.mv{ background: #004880; position: relative; display: flex; }
.mv .main-slide{ width: calc(50% + 3.5rem); margin: 0; }
.mv .main-slide:before{ content: ''; width: 30rem; height: 21.9rem; background: url(../images/common/webp/logo01.webp) no-repeat center/contain; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 10; }
.no-webp .mv .main-slide:before{ background-image: url(../images/common/logo01.png); }
.mv .main-slide li{ background-repeat: no-repeat; background-size: cover; background-position: center; }
.mv .main-slide .slide01{ background-image: url(../images/index/webp/mv01.webp); }
.mv .main-slide .slide02{ background-image: url(../images/index/webp/mv02.webp); }
.mv .main-slide .slide03{ background-image: url(../images/index/webp/mv03.webp); }
.no-webp .mv .main-slide .slide01{ background-image: url(../images/index/mv01.jpg); }
.no-webp .mv .main-slide .slide02{ background-image: url(../images/index/mv02.jpg); }
.no-webp .mv .main-slide .slide03{ background-image: url(../images/index/mv03.jpg); }
.mv .content{ width: calc(50% - 3.5rem); height: 100vh; margin-left: auto; display: flex; align-items: center; padding-left: 8rem; background-image: url(../images/index/webp/mv-bg01.webp), url(../images/index/webp/mv-bg02.webp); background-repeat: no-repeat, no-repeat; background-size: 28.5rem, 50.2rem; background-position: top left, bottom right; }
.no-webp .mv .content{ background-image: url(../images/index/mv-bg01.png), url(../images/index/mv-bg02.png); }
.mv .content ul{ display: flex; margin-bottom: 3rem; }
.mv .content ul li{ font-size: 1.4rem; font-weight: 700; color: #fff; background: #001e78; padding: 0 .5em; }
.mv .content ul li + li{ margin-left: .6rem; }
.mv .content p.catch{ font-size: 5rem; color: #fff; line-height: 1.7; letter-spacing: .16em; margin-bottom: 1.4rem; }
.mv .content h1{ color: #fff; font-weight: 400; font-size: 1.6rem; }

.mv + .news{ background: #e1e3e3; display: flex; align-items: center; height: 10rem; margin-top: -5rem; z-index: 11; padding: 0 5rem; }
.mv + .news dt{ font-size: 1.4rem; font-weight: 700; color: #7f7b6b; width: 9rem; border-right: solid 1px; }
.mv + .news dt a{ width: 6.2rem; height: 2.2rem; color: #004880; display: flex; align-items: center; border: solid 1px; font-size: 1.2rem; font-weight: 400; padding-left: .5em; position: relative; margin-top: .3rem; }
.mv + .news dt a:after{ content: ''; width: .56rem; height: .56rem; border-bottom: solid 1px; border-right: solid 1px; position: absolute; top: 50%; right: .5rem; transform: translateY(-50%) rotate(-45deg); }
.mv + .news dd{ font-size: 1.4rem; width: calc(100% - 9rem); padding-left: 3rem; }
.mv + .news dd ul li{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.sec-medical{ background: url(../images/index/webp/medical-bg01.webp) #505050 no-repeat top right .5rem/135.7rem; margin-top: -5rem; padding: 15rem 0 10rem; }
.no-webp .sec-medical{ background-image: url(../images/index/medical-bg01.png); }
.sec-medical .wrap{ padding: 10rem 6rem 11rem; z-index: 0; }
.sec-medical .wrap:before{ content: ''; width: calc(100% - 1rem); height: calc(100% - 1rem); border: solid 1px #fff; position: absolute; top: 0; left: 0; z-index: -1; }
.sec-medical .wrap:after{ content: ''; width: calc(100% - 1rem); height: calc(100% - 1rem); border: solid 1px #fff; position: absolute; top: 1rem; left: 1rem; z-index: -1; }
.sec-medical h2 + p{ max-width: 50rem; margin: 0 auto 4rem; color: #fff; }
.sec-medical h2 + p strong{ font-weight: 700; border-bottom: solid 1px #7f7b6b; padding-bottom: .2em; }
.sec-medical .point{ padding-top: 7rem; display: flex; justify-content: space-between; background: url(../images/index/medical04.png) no-repeat top center/.4rem; }
.sec-medical .point li{ width: 26rem; background: #e1e3e3; padding-bottom: 1.8rem; }
.sec-medical .point li img{ display: block; width: 100%; margin-bottom: 1.4rem; }
.sec-medical .point li h3{ color: #7f7b6b; text-align: center; font-size: 2rem; line-height: 1.5; margin-bottom: 1.2rem; }
.sec-medical .point li p{ padding: 0 2rem; }

.sec-first .left{ width: calc(50% + 3.5rem); background: url(../images/index/webp/first-bg01.webp) no-repeat center/cover; display: flex; align-items: center; }
.no-webp .sec-first .left{ background-image: url(../images/index/first-bg01.jpg); }
.sec-first .left .inner{ width: 50rem; margin-left: auto; margin-right: 3.5rem; position: relative; z-index: 0; }
.sec-first .left .inner:before{ content: ''; width: 52rem; height: 42rem; background: url(../images/index/webp/first-txt01.webp) no-repeat center/contain; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: -1; }
.no-webp .sec-first .left .inner:before{ background-image: url(../images/index/first-txt01.png); }
.sec-first .left .inner h2{ font-size: 3rem; color: #fff; text-align: center; line-height: 1.6; }
.sec-first .right{ width: calc(50% - 3.5rem); }
.sec-first .right li{ background: #e1e3e3; font-size: 1.6rem; font-weight: 700; color: #004880; }
.sec-first .right li:nth-of-type(even){ background: #d7d9d9; }
.sec-first .right li a{ display: flex; width: 100%; height: 13rem; align-items: center; padding-left: 14rem; position: relative; }
.sec-first .right li a:before{ content: ''; width: 8rem; height: 8rem; border-radius: 4rem; background-repeat: no-repeat; background-size: cover; background-position: center; position: absolute; top: 50%; left: 4rem; transform: translateY(-50%); }
.sec-first .right li:nth-of-type(1) a:before{ background-image: url(../images/index/webp/first01.webp); }
.sec-first .right li:nth-of-type(2) a:before{ background-image: url(../images/index/webp/first02.webp); }
.sec-first .right li:nth-of-type(3) a:before{ background-image: url(../images/index/webp/first03.webp); }
.sec-first .right li:nth-of-type(4) a:before{ background-image: url(../images/index/webp/first04.webp); }
.no-webp .sec-first .right li:nth-of-type(1) a:before{ background-image: url(../images/index/first01.jpg); }
.no-webp .sec-first .right li:nth-of-type(2) a:before{ background-image: url(../images/index/first02.jpg); }
.no-webp .sec-first .right li:nth-of-type(3) a:before{ background-image: url(../images/index/first03.jpg); }
.no-webp .sec-first .right li:nth-of-type(4) a:before{ background-image: url(../images/index/first04.jpg); }
.sec-first .right li a span{ display: block; width: 35rem; position: relative; }
.sec-first .right li a span:after{ content: ''; width: 1.3rem; height: 1.3rem; border-right: solid 1px; border-bottom: solid 1px; position: absolute; top: 50%; right: 0; transform: translateY(-50%) rotate(-45deg); }

.sec-dr{ background: url(../images/index/webp/dr-bg01.webp) no-repeat center/cover; position: relative; z-index: 0; }
.no-webp .sec-dr{ background-image: url(../images/index/dr-bg01.jpg); }
.sec-dr:before{ content: ''; width: 100%; height: 100%; background: url(../images/index/webp/dr-bg02.webp) no-repeat center bottom 3.5rem/100%; position: absolute; top: 0; left: 0; z-index: -1; }
.no-webp .sec-dr:before{ background-image: url(../images/index/dr-bg02.png); }
.sec-dr .wrap{  width: 1200px; padding-top: 9rem; padding-bottom: 8rem; align-items: flex-end; }
.sec-dr .left{ position: relative; z-index: 2;  margin-bottom: 300px;}
.sec-dr .left .logo{ display: block; margin-bottom: 1.8rem; }
.sec-dr .left h2{ margin-bottom: 2rem; }
.sec-dr .left h2 small{ line-height: 2; display: block; font-size: 1.6rem; font-weight: 400; letter-spacing: 0; }
.sec-dr .left h2 strong{ font-size: 5rem; color: #004880; }
.sec-dr .left p{ color: #fff; } 
.sec-dr .wrap .img {
    width: 80rem;
    line-height: 0;
    position: absolute;
    bottom: 0;
    left: 46%;
    transform: translateX(-50%);
}
.sec-dr .right{ width: 31rem; position: relative; z-index: 2; }
.sec-dr .right p{ margin-bottom: 4rem; }
.sec-dr .img{ width: 35rem; line-height: 0; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); }
.sec-dr .right.dr-name{ position: relative; z-index: 2; }
.sec-dr .right.dr-name .logo{ display: block; margin-bottom: 1.8rem; }
.sec-dr .right.dr-name h2{ margin-bottom: 0rem; }
.sec-dr .right.dr-name h2 small{ line-height: 2; font-size: 1.6rem; display: block; font-weight: 400; }
.sec-dr .right.dr-name h2 strong{ font-size: 5rem; color: #004880; }
.sec-dr .right.dr-name p{ color: #fff; }

.sec-treatment .point li{ position: relative; }
.sec-treatment .point li .img{ width: calc(50vw + 3.5rem); height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center; position: absolute; top: 0; left: calc(-50vw + 50rem); }
.sec-treatment .point li:nth-of-type(even) .img{ width: calc(50vw - 3.5rem); left: auto; right: calc(-50vw + 50rem); }
.sec-treatment .point li:nth-of-type(1) .img{ background-image: url(../images/index/webp/treatment-point03.webp); background-position: center left; }
.sec-treatment .point li:nth-of-type(2) .img{ background-image: url(../images/index/webp/treatment-point02.webp); background-position: center right; }
.no-webp .sec-treatment .point li:nth-of-type(1) .img{ background-image: url(../images/index/treatment-point03.jpg); }
.no-webp .sec-treatment .point li:nth-of-type(2) .img{ background-image: url(../images/index/treatment-point02.jpg); }
.sec-treatment .point li .content{ width: 40rem; padding: 8rem 0 10rem; }
.sec-treatment .point li:nth-of-type(odd) .content{ margin-left: auto; }
.sec-treatment .point li .content h3{ font-size: 3rem; color: #004880; line-height: 1.6; margin-bottom: 2.5rem; }
.sec-treatment .point li .content p{ margin-bottom: 3.5rem; }
.sec-treatment .point li .content a{ width: 40rem; }

.sec-youtube{ padding: 11rem 0 10rem; background: url(../images/index/webp/youtube-bg01.webp) no-repeat center/cover; position: relative; z-index: 0; }
.no-webp .sec-youtube{ background-image: url(../images/index/youtube-bg01.jpg); }
.sec-youtube:before{ content: ''; width: 28.85rem; height: 50rem; background: url(../images/index/webp/youtube-bg02.webp) no-repeat right bottom/contain; position: absolute; bottom: 0; right: 0; z-index: -1; }
.no-webp .sec-youtube:before{ background-image: url(../images/index/youtube-bg02.png); }
.sec-youtube .content{ width: calc(100% - 2rem); margin: 0 auto 6rem; position: relative; background: #e1e3e3; padding: 4rem 15.5rem 5rem; z-index: 0; }
.sec-youtube .content:before{ content: ''; width: calc(100% + 1rem); height: calc(100% + 1rem); box-sizing: border-box; border: solid 1px #fff; position: absolute; bottom: 0; right: 0; z-index: -1; }
.sec-youtube .content:after{ content: ''; width: calc(100% + 1rem); height: calc(100% + 1rem); box-sizing: border-box; border: solid 1px #fff; position: absolute; top: 0; left: 0; z-index: -1; }
.sec-youtube .content h2{ color: #7f7b6b; }
.sec-youtube .content h2 + p{ text-align: center; margin-bottom: 4rem; }
.sec-youtube .content .link-row{ padding-right: 1rem; padding-bottom: 1rem; margin-bottom: 5rem; }
.sec-youtube .content .link-row a{ display: block; line-height: 0; position: relative; z-index: 0; }
.sec-youtube .content .link-row a:before{ content: ''; width: 100%; height: 100%; background: #7f7b6b; position: absolute; bottom: -1rem; right: -1rem; z-index: -1; }
.sec-youtube .content .link-row a:after{ content: ''; width: 3rem; height: 3rem; background: url(../images/index/btn-play01.png) no-repeat center/contain; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.sec-youtube .content a.btn{ width: 40rem; margin: 0 auto; }
.sec-youtube .banner-list{ display: flex; justify-content: space-between; flex-wrap: wrap; }
.sec-youtube .banner-list li{ line-height: 0; }
.sec-youtube .banner-list li:nth-of-type(n+3){ margin-top: .8rem; }

.sec-blog{ margin-top: 15.5rem; background: #323232; padding: 4rem 5rem 5rem; }
.sec-blog .blog-row{ position: relative; margin-bottom: 5rem; min-height: 39.4rem; }
.sec-blog .blog-row .img{ position: absolute; width: 42rem; bottom: 0; left: 0; }
.sec-blog .blog-row .content{ width: 42rem; margin-left: auto; }
.sec-blog .blog-row .content h2{ font-size: 2rem; padding-bottom: 1.6rem; border-bottom: solid 1px; margin-bottom: 2.5rem; }
.sec-blog .blog-row .content dl{ padding-bottom: 3rem; border-bottom: solid 1px #7f7b6b; position: relative; }
.sec-blog .blog-row .content dl + dl{ margin-top: 2.6rem; }
.sec-blog .blog-row .content dl dt{ font-size: 1.8rem; margin-bottom: .8rem; }
.sec-blog .blog-row .content dl dt .time{ display: block; font-size: 1.2rem; margin-bottom: 1.3rem; }
.sec-blog .blog-row .content dl:first-of-type dt .time:before{ content: 'NEW'; display: inline-block; background: #7f7b6b; padding: 0 .5em; margin-right: .6em; }
.sec-blog .blog-row .content dl dd{ font-size: 1.2rem; height: 4rem; overflow-y: scroll; padding-right: 3.8rem; }
.sec-blog .blog-row .content dl dd::-webkit-scrollbar{ width: .4rem; background: #fff; }
.sec-blog .blog-row .content dl dd::-webkit-scrollbar-thumb{ background: #7f7b6b; }
.sec-blog a.btn{ margin: 0 auto; width: 40rem; }

.micro {width: 750px;margin: 0 auto 80px;}

.director_wrap{ background:#505050; padding: 5rem 0; }
.director_wrap h2{ color: #FFF; font-size: 2.2rem; text-align:center; font-family: YuMincho,游明朝体,Yu\ Mincho,游明朝,yu-mincho-pr6n,serif; border-bottom: 1px solid; margin-bottom: 4rem; }
.director_wrap .dr_flex{ display: flex; justify-content: space-between; flex-direction:row-reverse; align-items: flex-end; width: 880px; margin: 0 auto; background: #FFF; padding: 5rem;  }
.director_wrap .dr_flex .text{ width: 75%;}
.director_wrap .dr_flex .text p{ font-size: 14px;}
.director_wrap .dr_flex .text p + p{ margin-top: 1rem;}
.director_wrap .dr_flex .img{ background: #f4f3ef; width: 300px; margin-right: -15rem; }


/* ------------------------------------------------------------------
   モニター募集バナースライダー（MV／NEWS帯の直下）
   z-index は .news(11) より下・.sec-intro(2) より上に置く。
   .sec-intro は margin-top:-5rem で潜り込んでくるため、
   その分を padding-bottom で吸収してバナーに重ならないようにする。
   ------------------------------------------------------------------ */
/* 背景は敷かないこと。#top-page の白グラデーションを透かして使う。
   SPでは .news（z-index:3）が margin-bottom:- で本ブロックに食い込んでおり、
   z-index:5 の本ブロックに背景を敷くとお知らせを塗り潰して見切れる。
   margin-top:-5rem は #top-page の開始位置を MV下端まで引き上げるため（PCのみ）。
   元は第一子 .sec-intro の margin-top:-5rem がマージン相殺で同じ働きをしていたが、
   padding を持つ本ブロックが第一子になると相殺が起きず、
   MV下端と #top-page の間に body のグレー(#e1e3e3)が50px露出する。
   padding-top はその-5rem分を戻した上でお知らせ下端を避ける値。 */
.monitor-bnr{ position: relative; z-index: 5; margin-top: -5rem; padding: 11rem 0 10rem; }
.monitor-bnr__slider{ visibility: hidden; }
.monitor-bnr__slider.slick-initialized{ visibility: visible; }
.monitor-bnr__item{ display: inline-block; width: 28rem; margin: 0 1rem; }
.monitor-bnr__item img{ display: block; width: 100%; height: auto; aspect-ratio: 1080/1350; }
.monitor-bnr .slick-list{ overflow: hidden; }
.monitor-bnr__dots{ display: flex; justify-content: center; margin-top: 3rem; }
.monitor-bnr__dots ul{ display: flex; }
.monitor-bnr__dots li{ margin: 0 .6rem; }
.monitor-bnr__dots li button{ width: 1rem; height: 1rem; padding: 0; border: none; border-radius: 50%; background: #c5cbd1; text-indent: -9999px; overflow: hidden; cursor: pointer; transition: background .3s; }
.monitor-bnr__dots li.slick-active button{ background: #004880; }