@charset "UTF-8";
/********************************************************************************

page-doctor.css　院長・スタッフ紹介.css

********************************************************************************/

/*============================================================
 メインビジュアル
*============================================================*/
/* 
---------------------------------------- */
#page-doctor #mainvisual  {
}
#page-ページslug #セクション名  {
}

/*============================================================
 セクション共通
*============================================================*/
/* 
---------------------------------------- */
#page-doctor .section {

}

/*============================================================
 セクション　院長紹介
*============================================================*/
#page-doctor #sec-doctor {
    position: relative;
    z-index: 2;
}
#page-doctor #sec-doctor::before {
    position: absolute;
    content: "";
    background: url(../images/doctor/bg-img.png) no-repeat center center / contain;
    width: 1366px;
    height: 825px;
    left: 50%;
    transform: translatex(-50%);
    top: 0;
    z-index: -1;
}
#page-doctor #sec-doctor .basic-block {
    align-items: flex-end;
}
#page-doctor #sec-doctor .image {
    width: 42%;
    text-align: center;
}
#page-doctor #sec-doctor .image img {
    max-width: 340px;
    width: 100%;
    height: auto;
}
#page-doctor #sec-doctor .info {
    width: 52%;
}
#page-doctor #sec-doctor .info .name {
    padding-bottom: 6px;
	border-bottom: 1px solid var(--common-color-sub);
	margin-bottom: 16px;
}
#page-doctor #sec-doctor .info .name h3 {
    font-size: 28px;
    font-weight: 500;
    margin-bottom: 8px;
}
#page-doctor #sec-doctor .info .name h3 span {
    font-size: 16px;
}
#page-doctor #sec-doctor .info .name p {
    color: var(--common-color-sub);
    font-size: 14px;
}
#page-doctor #sec-doctor .info .history {
	margin-bottom: 16px;
}
#page-doctor #sec-doctor .info .history dt {
	float: left;
	width: 132px;
	text-align: right;
	font-size: 14px;
	color: #3E3E3E;
    margin-bottom: 0;
}
#page-doctor #sec-doctor .info .history dd {
	margin-left: 156px;
	font-size: 14px;
	color: #3E3E3E;
    margin-bottom: 0;
}
#page-doctor #sec-doctor .affiliation h3.block-title {
    padding-bottom: 6px;
    border-bottom: 1px solid var(--common-color-sub);
    margin-bottom: 16px;
    font-size: 24px;
    font-weight: 500;
    text-align: center;
}
#page-doctor #sec-doctor .affiliation ul.disc.parts-boxes {
    justify-content: center;
    background: unset;
}

/*============================================================
 セクション　スタッフ紹介
*============================================================*/
#page-doctor #sec-staff .staff-list {

}
#page-doctor #sec-staff .list-block.style-2 {
    width: 50%;
    margin-bottom: 0;
}
#page-doctor #sec-staff h3.block-title {
    margin-bottom: 16px;
    color: var(--common-color-sub);
    font-size: 24px;
}

/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
 Tablet
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/
@media screen and (max-width: 1128px) {
    /*============================================================
     メインビジュアル
    *============================================================*/
    /* 
    ---------------------------------------- */
    #page-sample #mainvisual  {
    }

    /*============================================================
    セクション　院長紹介
    *============================================================*/
    #page-doctor #sec-doctor .image,
    #page-doctor #sec-doctor .info {
        width: 100%;
    }
    #page-doctor #sec-doctor .affiliation h3.block-title {
        text-align: left;
    }
    /*============================================================
    セクション　スタッフ紹介
    *============================================================*/
    #page-doctor #sec-staff .staff-list {
        gap: 40px;
    }
    #page-doctor #sec-staff .list-block.style-2 {
        width: 100%;
    }

    /*============================================================
     セクション
    *============================================================*/
    /* 
    ---------------------------------------- */
    #page-sample #sec-セクション名 {
    }

}



/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
 SP
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/
@media screen and (max-width: 767px) {
    /*============================================================
     メインビジュアル
    *============================================================*/
    /* 
    ---------------------------------------- */
    #page-sample #mainvisual  {
    }

    /*============================================================
    セクション　院長紹介
    *============================================================*/
    #page-doctor #sec-doctor {
    }
    #page-doctor #sec-doctor::before {
        background: url(../images/doctor/bg-img-sp.png) no-repeat center center / contain;
        width: 390px;
        height: 270px;
    }
    #page-doctor #sec-doctor .image img {
        max-width: 220px;
    }
    #page-doctor #sec-doctor .affiliation ul.disc.parts-boxes {
        justify-content: flex-start;
    }
    #page-doctor #sec-doctor .affiliation h3.block-title {
        font-size: 20px;
    }
    /*============================================================
    セクション　スタッフ紹介
    *============================================================*/
    #page-doctor #sec-staff h3.block-title {
        font-size: 20px;
    }


    /*============================================================
     セクション
    *============================================================*/
    /* 
    ---------------------------------------- */
    #page-sampletop #sec-セクション名 {
    }

}
