@charset "utf-8";
/*共通設定*/
.sp-br {
    display: none;
}
/*終わり*/

/*<section class="notice-03">*/
.notice-03 {
	margin: 100px 0;
}

.notice-03-in {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 100%;
}

.notice-03-l,
.notice-03-r {
	width: 48%;
}

.notice-list-03 {
	padding: 16px 0;
}

.notice-list-03 li {
	margin: 10px 0;
	text-align: left;
}

.notice-list-03 a {
    padding: 2px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.notice-list-03 a:hover {
	color: #2264b9;
}

.notice-list-03 .list-flex {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	align-items: center;
	justify-content: left;
}

.notice-list-03 time {
	width: 20%;
	font-size: 13px;
}

.notice-list-03 .list-flex p {
	width: 80%;
}

.notice-list-03 a:hover .arrow-con01::before {
	background: #2264b9;
}

.notice-list-03 a:hover .arrow-con01::after {
	border-top: 1px solid #2264b9;
	border-right: 1px solid #2264b9;
}

.notice-03-r .title:hover {
    color: #435259;
}

.notice-03-r dl {
    padding: 28px 0;
    display: flex;
    align-items: flex-start;
    justify-content: left;
    flex-wrap: wrap;
    width: 100%;
    line-height: 1.1;
}

.notice-03-r dt {
    width: 15%;
    border-right: solid 1px #435259;
    margin-bottom: 24px;
}

.notice-03-r dd {
    width: 85%;
    margin-bottom: 24px;
    padding-left: 16px;
}
/*終わり*/

/*<section class="doctor">*/
.doctor {
    margin-bottom: 100px;
}

.doctor-in h2 {
    margin-bottom: 24px;
}

.doctor-in .flex-con {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    margin-bottom: 24px;
}

.doctor-in a {
    width: 48%;
    text-align: center;
    background-color: #fff;
    color: #14b88d;
    border-radius: 8px;
    border: solid 2px #14b88d;
    padding: 8px;
}

.doctor-in a:hover {
    color: #fff;
    background-color: #14b88d;
}

.doctor-in .small-txt {
    font-size: 14px;
}
/*終わり*/

/*<section class="medical-info">*/
.medical-info {
    margin-bottom: 100px;
}

.medical-info .title {
    border-bottom: none;
    padding-bottom: 0;
}

.medical-info .title:hover {
    color: #14b88d;
}

.medical-info .title:hover .arrow-con02::before {
	border: 1px solid #14b88d;
}

.medical-info .title:hover .arrow-con02::after {
	border-top: 2px solid #14b88d;
	border-right: 2px solid #14b88d;
}

.medical-info .flex-con02 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
    margin-top: 24px;
}

.medical-info .flex-con02 a {
    width: 24%;
    background-color: #fff;
    color: #14b88d;
    border-radius: 8px;
    border: solid 2px #14b88d;
    padding: 8px;
    text-align: center;
    margin-bottom: 1%;
}

.medical-info .flex-con02 a:hover {
    color: #fff;
    background-color: #14b88d;
}

.medical-info .flex-con03 {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
    gap: 1%;
}
/*終わり*/

/*<section class="first">*/
.first {
    margin-bottom: 80px;
}

.first h2 {
    margin-bottom: 24px;
}

.first-txt {
    max-width: 880px;
    width: 100%;
    margin: 0 auto;
    border: solid 3px #f21a41;
	display: table;
}

.first-txt h3 {
	-ms-writing-mode: tb-rl;
  	writing-mode: vertical-rl;
	background-color: #f21a41;
	display: table-cell;
	vertical-align: middle;
	color: #fff;
	font-weight: 400;
	width: 6%;
	padding-top: 32px;
    font-size: 18px;
}

.side-line {
	position: relative;
}

.side-line::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 32px;
	width: 1px;
	height: 120px;
	margin: auto;
	background-color: #fff;
}

.first-txt-in {
    padding: 24px;
}

.first-txt-in .txt-flex {
    display: flex;
    align-items: flex-end;
    justify-content: left;
}

.first-txt-in .txt-01 span,
.first-txt-in .txt-03,
.first-txt-in .txt-04,
.first-txt-in .txt-05,
.first-txt-in .txt-06 {
    font-size: 18px;
    font-weight: 600;
}

.first-txt-in .txt-01 {
    margin-bottom: 16px;
}

.first-txt-in .txt-08 {
    margin-top: 16px;
}

.first-txt-in .txt-02,
.first-txt-in .txt-03,
.first-txt-in .txt-04,
.first-txt-in .txt-05,
.first-txt-in .txt-06 {
    margin-left: 16px;
}
 
.first-txt-in .txt-07 {
    font-size: 14px;
    align-items: flex-start;
    color: #f21a41;
    margin-left: 16px;
    margin-top: 8px;
}

.first-txt-in .txt-08 a {
    font-size: 18px;
    color: #14b88d;
    border-bottom: solid 1px #14b88d;
}

.first-txt-in .txt-08 a:hover {
    opacity: 0.8;
}

.first-txt-in .flex-con {
    display: flex;
    align-items: flex-end;
}

.first-txt-in .txt-09,
.first-txt-in .txt-10 {
    margin-left: 16px;
}
/*終わり*/

/*<section class="flow">*/
.flow {
    margin-bottom: 100px;
}

.flow h2 {
    margin-bottom: 24px;
}

.flow-img {
    max-width: 880px;
    width: 100%;
    margin: 0 auto;
}

.flow-img img {
    width: 100%;
    object-fit: cover;
}
/*終わり*/

/*タブレット*/
@media (max-width: 1024px) {
/*<section class="notice-03">*/
    .notice-03-in {
        display: block;
    }

    .notice-03-l,
    .notice-03-r {
        width: 100%;
    }

    .notice-03-l {
        margin-bottom: 40px;
    }
/*終わり*/

/*<section class="doctor">*/
/*終わり*/

/*<section class="medical-info">*/
    .medical-info .flex-con03 {
        justify-content: space-between;
        row-gap: 1%;
    }

    .medical-info .flex-con03 a {
        width: 49%;
    }
/*終わり*/

/*<section class="first">*/
    .side-line::after {
        height: 200px;
    }

    .first-txt-in span {
        font-size: 18px;
    }
/*終わり*/
}

/*スマホ*/
@media (max-width: 599px) {
/*共通設定*/
    .sp-br {
        display: block;
    }
/*終わり*/

/*<section class="notice-03">*/
    .notice-03 {
        margin-bottom: 80px;
    }

	.notice-list-03 .list-flex {
		display: block;
	}

	.list-flex-03 time {
		width: 100%;
		display: block;
	}

	.notice-list-03 .list-flex p {
		width: 95%;
	}

    .notice-03-r dl {
        justify-content: space-between;
    }

    .notice-03-r dt {
        width: 20%;
    }
    
    .notice-03-r dd {
        width: 80%;
    }    
/*終わり*/

/*<section class="doctor">*/
    .doctor {
        margin-bottom: 80px;
    }

    .doctor-in .flex-con {
        display: block;
    }

    .doctor-in a {
        width: 100%;
        display: block;
    }

    .doctor-in a:first-child {
        margin-bottom: 10px;
    }
/*終わり*/

/*<section class="medical-info">*/
    .medical-info {
        margin-bottom: 80px;
    }

    .medical-info .flex-con02 a {
        width: 49%;
        margin-bottom: 3%;
    }

    .medical-info .flex-con03 {
        display: block;
        width: 100%;
    }

    .medical-info .flex-con03 a {
        width: 100%;
        display: block;
    }
/*終わり*/

/*<section class="first">*/
    .first-txt {
        display: block;
    }

    .first-txt-in {
        padding: 16px;
    }

    .first-txt h3 {
        -ms-writing-mode: horizontal-tb;
        writing-mode: horizontal-tb;
        padding: 8px 24px;
    }

    .side-line::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 100px;
        width: 120px;
        height: 1px;
        background-color: #fff;
    }

    .first-txt-in .txt-02,
    .first-txt-in .txt-03,
    .first-txt-in .txt-04,
    .first-txt-in .txt-05,
    .first-txt-in .txt-06 {
        margin-left: 0;
    }

    .first-txt-in .flex-con {
        display: block;
    }

    .first-txt-in .txt-07 {
        margin-left: 0;
    }    
/*終わり*/

}