@charset "utf-8";

/* ----------------------------------------------
  #top-animation
 ---------------------------------------------- */

#mv-wrap { position:fixed; top:0; left:0; z-index:999999; width:100%; height:100%; background:#fff url(../img/top/bnr_top_anime.svg) center center no-repeat; border:1px #aaa solid; margin:0 auto; }
.mv-sp { width:100%; height:100%; position:relative; z-index:1; }
.mv-pc { width:100%; height:100%; position:relative; z-index:1; }
.route { position:absolute; inset:0; width:100%; height:100%; z-index:2; }
.tooth { position:absolute; height:auto; transform:translate(-50%, -50%); z-index:3; opacity:0; }

@media screen and (max-width:899px){
#mv-wrap { background-size:70% auto; padding:10px 40px 0 0; }
.mv-sp { aspect-ratio:390/844; }
.mv-pc { display:none; }
.route { aspect-ratio:390/844; }
.tooth { width:120px; }
}

@media screen and (min-width:900px){
#mv-wrap { background-size:540px; padding:200px 0 0 280px; }
.mv-sp { display:none; }
.mv-pc { aspect-ratio:1197/1515; }
.route { aspect-ratio:1197/1515; }
.tooth { width:120px; }

}




body.mv-loading { overflow:hidden; }
.slide-top-mv { opacity:0; }
.slide-top-mv.is-ready { opacity:1; transition:0.5s; }




/* ----------------------------------------------
  #top-mainview
 ---------------------------------------------- */

#top-mainview { width:100%; height:auto; aspect-ratio:390/585; position:relative; z-index:1; }
.top-mv-lcp { width:100%; height:100%; position:relative; z-index:1; transition:opacity .3s ease; }
.top-mv-lcp img { display:block; width:100%; height:auto; object-fit:cover; object-position:right 0 top 0; aspect-ratio:390/423; }
.top-mv-lcp.is-hidden { opacity:0; visibility:hidden; pointer-events:none; }
.slide-top-mv { position:absolute; top:0; right:0; width:100%; height:100%; overflow:hidden; margin-inline:auto; z-index:2; opacity:0; visibility:hidden; transition:opacity .3s ease; pointer-events:none; } /* スライダーは最初は非表示 */
.slide-top-mv picture { display:block; }
.slide-top-mv picture img { width:100%; height:auto; }
.slide-top-mv.is-ready { opacity:1; visibility:visible; }
.add-animation { animation:zoomUp 10s linear 0s normal both; }

@media screen and (min-width:900px){
#top-mainview { aspect-ratio:1380/706; }
.top-mv-lcp {}
.top-mv-lcp img { aspect-ratio:1500/580; object-position:right 0 top 0; }
.slide-top-mv {}
.slide-top-mv picture {}
.slide-top-mv picture img { aspect-ratio:1500/580; }
.add-animation {}
}
@media screen and (min-width:1380px){
#top-mainview { width:1380px; margin:0 auto; }
.top-mv-lcp {}
.top-mv-lcp img { object-position:right 0 top 0; }
.slide-top-mv {}
.slide-top-mv picture {}
.slide-top-mv picture img {}
.add-animation {}
}




#top-mv-thumb { position:absolute; top:0; left:0; width:100%; height:auto; aspect-ratio:390/585; z-index:999; }
.top-mv-thumb-tit { display:flex; flex-flow:column nowrap; justify-content:center; width:33.33vw; aspect-ratio:113/368; line-height:1.5; background:rgba(255,255,255,0.9); margin:0 0 0 calc(100% - 33.33vw); writing-mode:vertical-rl; }
.top-mv-thumb-tit dt { display:flex; align-items:end; width:45%; height:100%; padding:12.82vw 0 0; font-size:4.61vw; color:#384658; font-weight:500; letter-spacing:0.12em; position:relative; }
.top-mv-thumb-tit dt:before { content:""; position:absolute; bottom:6.66vw; right:3.07vw; width:6.15vw; height:6.15vw; background:#75E8E5; border-radius:1.03vw; }
.top-mv-thumb-tit dt:after { content:""; position:absolute; bottom:3.59vw; right:9.48vw; width:3.07vw; height:3.07vw; background:#58B3F8; border-radius:0.51vw; }
.top-mv-thumb-tit dd { display:flex; align-items:start; width:55%; height:100%; padding:12.82vw 0 0; font-size:7.69vw; color:#2971A9; font-weight:500; letter-spacing:0.16em; position:relative; }
.top-mv-thumb-tit dd:before { content:""; position:absolute; top:3.59vw; left:-3.07vw; width:6.15vw; height:6.15vw; background:#FF8B7E; border-radius:1.03vw; }
.top-mv-thumb-tit dd:after { content:""; position:absolute; top:9.23vw; left:3.07vw; width:3.07vw; height:3.07vw; background:#FFEAB0; border-radius:0.51vw; }
.top-mv-thumb-box { background:#EEF8FD; padding:4.61vw 0; position:relative; }
.top-mv-thumb-box p { text-align:center; padding:0 0 3.33vw; font-size:3.59vw; color:#2971A9; font-weight:600; }
.top-mv-thumb-box ul { width:71.79vw; text-align:center; margin:0 auto; }
.top-mv-thumb-box li { display:flex; justify-content:center; align-items:center; height:7.69vw; background:#fff; border-radius:1.03vw; border:1px #E5E5E5 solid; text-align:left; font-size:3.33vw; color:#384658; font-weight:500; list-style:none; position:relative; }
.top-mv-thumb-box li:not(:last-child) { margin:0 0 1.03vw; }
.top-mv-thumb-box li::after { content:""; position:absolute; top:0.77vw; left:0.77vw; width:0; height:0; border-style:solid; border-width:2.56vw 2.56vw 0 0; }
.top-mv-thumb-box li:nth-of-type(1)::after { border-color:#58B3F8 transparent transparent transparent; }
.top-mv-thumb-box li:nth-of-type(2)::after { border-color:#75E8E5 transparent transparent transparent; }
.top-mv-thumb-box li:nth-of-type(3)::after { border-color:#FF8B7E transparent transparent transparent; }
.top-mv-thumb-box li:before { display:inline-block; content:"# "; }
.top-mv-thumb-box li span { display:block; width:63%; }

@media screen and (min-width:900px){
#top-mv-thumb { aspect-ratio:1380/706; }
.top-mv-thumb-tit { width:15.57vw; aspect-ratio:215/534; margin:0 0 0 calc(100% - 15.57vw); }
.top-mv-thumb-tit dt { padding:3.62vw 0 0; font-size:1.88vw; }
.top-mv-thumb-tit dt:before { bottom:0.87vw; right:1.88vw; width:4.13vw; height:4.13vw; border-radius:0.29vw; }
.top-mv-thumb-tit dt:after { bottom:-1.16vw; right:5.86vw; width:2.03vw; height:2.03vw; border-radius:0.14vw; }
.top-mv-thumb-tit dd { padding:3.62vw 0 0; font-size:2.68vw; }
.top-mv-thumb-tit dd:before { top:1.52vw; left:-3.11vw; width:4.13vw; height:4.13vw; border-radius:0.29vw; }
.top-mv-thumb-tit dd:after { top:5.65vw; left:1.01vw; width:2.03vw; height:2.03vw; border-radius:0.14vw; }
.top-mv-thumb-box { display:flex; flex-flow:row nowrap; justify-content:space-between; align-items:center; height:12.46vw; background:none; padding:0; }
.top-mv-thumb-box p { width:56.52vw; text-align:left; padding:0 0 0 13.04vw; font-size:2.03vw; }
.top-mv-thumb-box ul { width:25.36vw; text-align:left; margin:0 15.57vw 0 0; }
.top-mv-thumb-box li { height:2.75vw; border-radius:0.29vw; font-size:1.09vw; }
.top-mv-thumb-box li:not(:last-child) { margin:0 0 0.36vw; }
.top-mv-thumb-box li::after { top:0.29vw; left:0.36vw; border-width:0.87vw 0.87vw 0 0; }
.top-mv-thumb-box li span { width:57%; }
}
@media screen and (min-width:1380px){
#top-mv-thumb {}
.top-mv-thumb-tit { width:215px; margin:0 0 0 calc(100% - 215px); }
.top-mv-thumb-tit dt { padding:50px 0 0; font-size:26px; }
.top-mv-thumb-tit dt:before { bottom:12px; right:26px; width:57px; height:57px; border-radius:4px; }
.top-mv-thumb-tit dt:after { bottom:-16px; right:81px; width:28px; height:28px; border-radius:2px; }
.top-mv-thumb-tit dd { padding:50px 0 0; font-size:37px; }
.top-mv-thumb-tit dd:before { top:21px; left:-43px; width:57px; height:57px; border-radius:4px; }
.top-mv-thumb-tit dd:after { top:78px; left:14px; width:28px; height:28px; border-radius:2px; }
.top-mv-thumb-box { height:172px; }
.top-mv-thumb-box p { width:780px; padding:0 0 0 180px; font-size:28px; }
.top-mv-thumb-box ul { width:350px; margin:0 215px 0 0; }
.top-mv-thumb-box li { height:38px; border-radius:4px; font-size:15px; }
.top-mv-thumb-box li:not(:last-child) { margin:0 0 5px; }
.top-mv-thumb-box li::after { top:4px; left:5px; border-width:12px 12px 0 0; }
.top-mv-thumb-box li span {}
}




#top-main { padding:12.82vw 0 0; }
#top-mainview:before { content:""; position:absolute; bottom:10.77vw; right:4.1vw; width:2.05vw; height:2.05vw; background:#58B3F8; border-radius:0.51vw; z-index:1000; }
#top-mainview:after { content:""; position:absolute; bottom:7.18vw; right:4.1vw; width:2.05vw; height:2.05vw; background:#58B3F8; border-radius:0.51vw; z-index:1000; }
#top-mv-thumb:before { content:""; position:absolute; bottom:3.59vw; right:4.1vw; width:2.05vw; height:2.05vw; background:#58B3F8; border-radius:0.51vw; z-index:1000; }
#top-mv-thumb:after { content:""; position:absolute; top:112.56vw; left:5.13vw; width:2.05vw; height:2.05vw; background:#FF8B7E; border-radius:0.51vw; z-index:1000; }
.top-mv-thumb-box:before { content:""; position:absolute; top:7.69vw; left:5.13vw; width:2.05vw; height:2.05vw; background:#FF8B7E; border-radius:0.51vw; z-index:1000; }
.top-mv-thumb-box:after { content:""; position:absolute; top:11.28vw; left:5.13vw; width:2.05vw; height:2.05vw; background:#FF8B7E; border-radius:0.51vw; z-index:1000; }

@media screen and (min-width:900px){
#top-main { padding:5.8vw 0 0; position:relative; }
#top-main:before { content:""; position:absolute; top:-12.46vw; left:calc(50% - 50vw); width:100vw; height:12.46vw; background:#EEF8FD; }
#top-mainview:before { bottom:5.36vw; right:10.86vw; width:0.87vw; height:0.87vw; border-radius:0.14vw; }
#top-mainview:after { bottom:3.84vw; right:10.86vw; width:0.87vw; height:0.87vw; border-radius:0.14vw; }
#top-mv-thumb:before { bottom:2.31vw; right:10.86vw; width:0.87vw; height:0.87vw; border-radius:0.14vw; }
#top-mv-thumb:after { top:40.94vw; left:8.69vw; width:0.87vw; height:0.87vw; border-radius:0.14vw; }
.top-mv-thumb-box:before { top:3.84vw; left:8.69vw; width:0.87vw; height:0.87vw; border-radius:0.14vw; }
.top-mv-thumb-box:after { top:5.36vw; left:8.69vw; width:0.87vw; height:0.87vw; border-radius:0.14vw; }
}
@media screen and (min-width:1380px){
#top-main { padding:80px 0 0; }
#top-main:before { top:-172px; height:172px; }
#top-mainview:before { bottom:74px; right:150px; width:12px; height:12px; border-radius:2px; }
#top-mainview:after { bottom:53px; right:150px; width:12px; height:12px; border-radius:2px; }
#top-mv-thumb:before { bottom:32px; right:150px; width:12px; height:12px; border-radius:2px; }
#top-mv-thumb:after { top:565px; left:120px; width:12px; height:12px; border-radius:2px; }
.top-mv-thumb-box:before { top:53px; left:120px; width:12px; height:12px; border-radius:2px; }
.top-mv-thumb-box:after { top:74px; left:120px; width:12px; height:12px; border-radius:2px; }
}




@keyframes zoomUp {
    0% { transform:scale(1); }
  100% { transform:scale(1.15); }
}




#top-mainview .dots-top-mv { position:absolute; bottom:-12.82vw; left:calc(50% - 40vw); width:80vw; }

@media screen and (min-width:900px){
#top-mainview .dots-top-mv { bottom:-4.35vw; left:calc(50% - 40vw); width:80vw; }
}
@media screen and (min-width:1380px){
#top-mainview .dots-top-mv { bottom:-60px; }
}




.slick-dots { display:flex; flex-flow:row nowrap; justify-content:center; width:100%; }
.slick-dots li { display:flex; justify-content:center; align-items:center; width:12.82vw; height:12.82vw; list-style:none; position:relative; }
.slick-dots li button { width:3.07vw; height:3.07vw; background:#D9D9D9; border-radius:50%; border:none; padding:0; text-indent:-9999px; }
.slick-dots li.slick-active button { background:#5989B2 !important; }

@media screen and (min-width:900px){
.slick-dots {}
.slick-dots li { width:3.62vw; height:3.62vw; }
.slick-dots li button { width:0.87vw; height:0.87vw; cursor:pointer; }
}
@media screen and (min-width:1380px){
.slick-dots {}
.slick-dots li { width:50px; height:50px; }
.slick-dots li button { width:12px; height:12px; }
}







@media screen and (min-width:900px){
#top-mainview .dots-top-mv { bottom:-4.35vw; left:calc(50% - 40vw); width:80vw; }
}
@media screen and (min-width:1380px){
#top-mainview .dots-top-mv { bottom:-60px; }
}




.mv-skip { position:fixed; bottom:5.13vw; right:5.13vw; z-index:9999999; background:#2971A9; border-radius:999px; border:none; padding:2.56vw 3.59vw; font-size:3.07vw; color:#fff; letter-spacing:0.08em; cursor:pointer; transition: 0.2s; }
.mv-skip:hover { opacity:0.7; }

@media screen and (min-width:900px){

}
@media screen and (min-width:1380px){
.mv-skip { bottom:20px; right:20px; padding:10px 14px; font-size:12px; }
}




/* ----------------------------------------------
 ! top-main-box
 ---------------------------------------------- */

#top-main-box { display:flex; flex-flow:column-reverse wrap; padding:5.13vw 5.13vw 0; }
#top-main-txt { line-height:1.8; background:url(../img/top/bg_features.svg) right center no-repeat; background-size:15.89vw auto; font-size:6.66vw; font-weight:500; }
#top-main-nav { display:flex; flex-flow:row wrap; justify-content:space-between; margin:0 0 12.82vw; }
#top-main-nav li { width:41.02vw; border-bottom:1px #2971A9 dotted; list-style:none; }
#top-main-nav li a { display:flex; align-items:center; height:12.82vw; padding:0 0 0 10.25vw; font-size:3.07vw; color:#2971A9; font-weight:600; text-decoration:none; position:relative; }
#top-main-nav li:nth-of-type(1) a { background:url(../img/top/ico_top_main_nav_01.svg) 1.79vw center/4.1vw auto no-repeat; }
#top-main-nav li:nth-of-type(2) a { background:url(../img/top/ico_top_main_nav_03.svg) 1.54vw center/4.61vw auto no-repeat; }
#top-main-nav li:nth-of-type(3) a { background:url(../img/top/ico_top_main_nav_04.svg) 1.79vw center/4.1vw auto no-repeat; }
#top-main-nav li:nth-of-type(4) a { background:url(../img/top/ico_top_main_nav_02.svg) 1.54vw center/4.61vw auto no-repeat; }
#top-main-nav li a:after { content:""; position:absolute; top:calc(50% - 0.77vw); right:0; width:0; height:0; border-style:solid; border-width:1.54vw 1.03vw 0 1.03vw; border-color:#2971A9 transparent transparent transparent; }

@media screen and (min-width:900px){
#top-main-box { flex-flow:row wrap; justify-content:space-between; align-items:center; width:86.95vw; margin:0 auto; padding:1.45vw 0 2.9vw; position:relative; }
#top-main-box:before { content:""; position:absolute; top:-3.62vw; left:-10.86vw; width:10.43vw; height:10.43vw; background:#F7F8F8; border-radius:0.29vw; z-index:-2; }
#top-main-box:after { content:""; position:absolute; top:7.24vw; left:-0.43vw; width:3.91vw; height:3.91vw; background:#F7F8F8; border-radius:0.29vw; z-index:-2; }
#top-main-txt { background:none; font-size:3.62vw; position:relative; }
#top-main-txt:after { content:""; position:absolute; top:-9.49vw; left:0; width:10.07vw; height:9.49vw; background:url(../img/top/bg_features.svg) center center/cover no-repeat; z-index:-1; }
#top-main-nav { width:29.71vw; margin:0; position:relative; }
#top-main-nav:before { content:""; position:absolute; top:0; left:-5.8vw; width:1px; height:9.49vw; background:#C7C7C7; }
#top-main-nav li { width:14.05vw; height:3.26vw; }
#top-main-nav li a { height:3.26vw; justify-content:start; padding:0 0 0 2.75vw; font-size:1.09vw; }
#top-main-nav li:nth-of-type(1) a { background:url(../img/top/ico_top_main_nav_01.svg) 0.58vw center/1.16vw auto no-repeat; }
#top-main-nav li:nth-of-type(2) a { background:url(../img/top/ico_top_main_nav_03.svg) 0.43vw center/1.3vw auto no-repeat; }
#top-main-nav li:nth-of-type(3) a { background:url(../img/top/ico_top_main_nav_04.svg) 0.58vw center/1.16vw auto no-repeat; }
#top-main-nav li:nth-of-type(4) a { background:url(../img/top/ico_top_main_nav_02.svg) 0.43vw center/1.3vw auto no-repeat; }
#top-main-nav li a:after { top:calc(50% - 0.21vw); border-width:0.43vw 0.29vw 0 0.29vw; }
#top-main-nav li a:hover { opacity:0.7; transition:1s ease; }
}
@media screen and (min-width:1380px){
#top-main-box { width:1200px; padding:20px 0 40px; }
#top-main-box:before { top:-50px; left:-150px; width:144px; height:144px; border-radius:4px; }
#top-main-box:after { top:100px; left:-6px; width:54px; height:54px; border-radius:4px; }
#top-main-txt { font-size:50px; }
#top-main-txt:after { top:-131px; width:139px; height:131px; }
#top-main-nav { width:410px; }
#top-main-nav:before { left:-80px; width:1px; height:131px; }
#top-main-nav li { width:194px; height:45px; }
#top-main-nav li a { height:45px; padding:0 0 0 38px; font-size:15px; }
#top-main-nav li:nth-of-type(1) a { background:url(../img/top/ico_top_main_nav_01.svg) 8px center/16px auto no-repeat; }
#top-main-nav li:nth-of-type(2) a { background:url(../img/top/ico_top_main_nav_03.svg) 6px center/18px auto no-repeat; }
#top-main-nav li:nth-of-type(3) a { background:url(../img/top/ico_top_main_nav_04.svg) 8px center/16px auto no-repeat; }
#top-main-nav li:nth-of-type(4) a { background:url(../img/top/ico_top_main_nav_02.svg) 6px center/18px auto no-repeat; }
#top-main-nav li a:after { top:calc(50% - 3px); border-width:6px 4px 0 4px; }
}




/* ----------------------------------------------
 ! top-common
 ---------------------------------------------- */

.top-tit-box { text-align:center; margin:0 auto; padding:15.38vw 0 0; position:relative; }
.top-tit-box em { display:block; line-height:1.6; padding:0 0 1.03vw; font-size:3.33vw; color:#0672C4; font-weight:500; font-style:normal; letter-spacing:0.025em; text-transform:uppercase; }
.top-tit-box h2 { line-height:1.5; padding:0 0 12.82vw; font-size:6.66vw; color:#384658; font-weight:600; letter-spacing:0.05em; position:relative; }
.top-tit-box h2 strong { display:inline-block; margin:0 1.05vw; font-size:125%; color:#2971A9; }
.top-tit-box:before { content:""; position:absolute; bottom:7.69vw; left:calc(50% - 4.61vw); width:2.05vw; height:2.05vw; background:#FF8B7E; border-radius:0.51vw; }
.top-tit-box:after { content:""; position:absolute; bottom:7.69vw; right:calc(50% - 4.61vw); width:2.05vw; height:2.05vw; background:#75E8E5; border-radius:0.51vw; }
.top-tit-box h2:after { content:""; position:absolute; bottom:7.69vw; left:calc(50% - 1.03vw); width:2.05vw; height:2.05vw; background:#FF8B7E; border-radius:0.51vw; }


@media screen and (min-width:900px){
.top-tit-box { padding:5.8vw 0 0; }
.top-tit-box em { padding:0 0 0.58vw; font-size:1.16vw; }
.top-tit-box h2 { padding:0 0 5.8vw; font-size:2.75vw; font-weight: 500;}
.top-tit-box h2 strong { margin:0 0.29vw; }
.top-tit-box:before { bottom:3.98vw; left:calc(50% - 1.95vw); width:0.87vw; height:0.87vw; border-radius:0.14vw; }
.top-tit-box:after { bottom:3.98vw; right:calc(50% - 1.95vw); width:0.87vw; height:0.87vw; border-radius:0.14vw; }
.top-tit-box h2:after { bottom:3.98vw; left:calc(50% - 0.43vw); width:0.87vw; height:0.87vw; border-radius:0.14vw; }
}
@media screen and (min-width:1380px){
.top-tit-box { padding:80px 0 0; }
.top-tit-box em { padding:0 0 2px; font-size:16px; }
.top-tit-box h2 { padding:0 0 80px; font-size:38px; }
.top-tit-box h2 strong { margin:0 4px; }
.top-tit-box:before { bottom:55px; left:calc(50% - 27px); width:12px; height:12px; border-radius:2px; }
.top-tit-box:after { bottom:55px; right:calc(50% - 27px); width:12px; height:12px; border-radius:2px; }
.top-tit-box h2:after { bottom:55px; left:calc(50% - 6px); width:12px; height:12px; border-radius:2px; }
}




/* ----------------------------------------------
  #top-art-feature
 ---------------------------------------------- */

#top-art-feature { position:relative; }
#top-art-feature:before { content:""; position:absolute; top:20.5vw; right:2.05vw; width:22.3vw; height:22.3vw; background:#F3F4F5; border-radius:1.03vw; z-index:1; }
#top-art-feature:after { content:""; position:absolute; top:42.8vw; right:24.35vw; width:8.2vw; height:8.2vw; background:#F3F4F5; border-radius:1.03vw; z-index:1; }
#top-feature-wrap { padding:0 0 10.25vw; }
#top-feature-ul { background:#fff; padding:0 5.13vw; position:relative; z-index:2; }
#top-feature-ul li { border:1px #E5E5E5 solid; border-radius:2.05vw; padding:1.79vw; list-style:none; }
#top-feature-ul li:not(:last-child) { margin:0 0 2.05vw; }
#top-feature-ul button { display:flex; align-items:center; width:100%; height:20.51vw; line-height:1.4; background:#fff; border:none; text-align:left; font-size:4.1vw; color:#384658; font-weight:500; font-family:'Zen Maru Gothic'; font-style:normal; letter-spacing:0.02em; position:relative; }
#top-feature-ul button:before { content:""; position:absolute; top:calc(50% - 0.25vw); right:3.85vw; width:5.13vw; height:0.5vw; background:#2971A9; }
#top-feature-ul button:after { content:""; position:absolute; top:calc(50% - 0.25vw); right:3.85vw; width:5.13vw; height:0.5vw; background:#2971A9; transform:rotate(90deg); }
#top-feature-ul button span { display:flex; justify-content:center; align-items:center; width:17.17vw; height:100%; border-right:1px #D0D0D0 dashed; margin:0 3.85vw 0 0; font-size:8.2vw; color:#2971A9; font-weight:600; letter-spacing:0.1em; position:relative; }
#top-feature-ul button span:before { content:""; position:absolute; top:0; left:0; width:2.05vw; height:2.05vw; border-radius:0.51vw; }
#top-feature-ul button span:after { content:""; position:absolute; top:2.05vw; left:2.05vw; width:2.05vw; height:2.05vw; border-radius:0.51vw; }
#top-feature-ul li:nth-child(odd) button span:before { background:#75E8E5; }
#top-feature-ul li:nth-child(odd) button span:after { background:#FFEAB0; }
#top-feature-ul li:nth-child(even) button span:before { background:#FF8B7E; }
#top-feature-ul li:nth-child(even) button span:after { background:#FFEAB0; }

@media screen and (min-width:900px){
#top-art-feature { }
#top-art-feature:before { top:5.8vw; right:calc(50% - 52.89vw); width:10.43vw; height:10.43vw; border-radius:0.29vw; }
#top-art-feature:after { top:16.23vw; right:calc(50% - 42.39vw); width:3.91vw; height:3.91vw; border-radius:0.29vw; }
#top-feature-wrap { padding:0 0 7.24vw; position:relative; }
#top-feature-wrap:before { content:""; position:absolute; bottom:-2.17vw; left:0; width:70%; height:2.17vw; background:#fff; border-radius:0 0 0.58vw 0; z-index:2; }
#top-feature-wrap:after { content:""; position:absolute; bottom:0; right:0; width:30%; height:2.17vw; background:#EEF8FD; border-radius:0.58vw 0 0 0; z-index:2; }
#top-feature-ul { display:flex; flex-flow:row wrap; justify-content:space-between; width:86.95vw; margin:0 auto; padding:0; }
#top-feature-ul li { width:28.69vw; border-radius:0.58vw; margin:0 0 1.16vw; padding:0.51vw; }
#top-feature-ul li:not(:last-child) { margin:0 0 1.16vw; }
#top-feature-ul button { height:6.52vw; font-size:1.3vw; }
#top-feature-ul button:before { top:calc(50% - 0.07vw); right:1.16vw; width:1.45vw; height:0.14vw; }
#top-feature-ul button:after { top:calc(50% - 0.07vw); right:1.16vw; width:1.45vw; height:0.14vw; }
#top-feature-ul button span { width:5.43vw; margin:0 1.3vw 0 0; font-size:2.31vw; }
#top-feature-ul button span:before { width:0.65vw; height:0.65vw; border-radius:0.14vw; }
#top-feature-ul button span:after { top:0.58vw; left:0.65vw; width:0.65vw; height:0.65vw; border-radius:0.14vw; }
#top-feature-ul button:hover { opacity:0.7; transition:1s ease; cursor:pointer; }
}
@media screen and (min-width:1380px){
#top-art-feature { }
#top-art-feature:before { top:80px; right:calc(50% - 730px); width:144px; height:144px; border-radius:4px; }
#top-art-feature:after { top:224px; right:calc(50% - 585px); width:54px; height:54px; border-radius:4px; }
#top-feature-wrap { padding:0 0 100px; }
#top-feature-wrap:before { bottom:-30px; height:30px; border-radius:0 0 8px 0; }
#top-feature-wrap:after { height:30px; border-radius:8px 0 0 0; }
#top-feature-ul { width:1200px; }
#top-feature-ul li { width:396px; border-radius:8px; margin:0 0 16px; padding:7px; }
#top-feature-ul li:not(:last-child) { margin:0 0 16px; }
#top-feature-ul button { height:90px; font-size:18px; }
#top-feature-ul button:before { top:calc(50% - 1px); right:16px; width:20px; height:2px; }
#top-feature-ul button:after { top:calc(50% - 1px); right:16px; width:20px; height:2px; }
#top-feature-ul button span { width:75px; margin:0 18px 0 0; font-size:32px; }
#top-feature-ul button span:before { width:9px; height:9px; border-radius:2px; }
#top-feature-ul button span:after { top:8px; left:9px; width:9px; height:9px; border-radius:2px; }
}




.top-feature-dialog { width:calc(100% - 10.25vw); background:#fff; border-radius:2.56vw; border:none; padding:0; }
.top-feature-dialog::backdrop { background:rgba(56,70,88,0.7); }
.top-feature-sec { padding:0 0 6.15vw; position:relative; }
.top-feature-sec figure { padding:0 0 7.69vw; }
.top-feature-sec figure img { width:100%; height:auto; }
.top-feature-sec h3 { padding:0 5.13vw 7.69vw; font-size:4.61vw; color:#2971A9; font-weight:500; }
.top-feature-sec h3 span { display:inline-block; vertical-align:sub; margin:0 5.13vw 0 0; font-size:8.2vw; letter-spacing:0.1em; }
.top-feature-sec div { height:51.28vw; overflow-y:scroll; border-bottom:0.5px #384658 solid; margin:0 5.13vw 6.15vw; }
.top-feature-sec div p { line-height:2; font-size:3.59vw; }
.top-feature-sec div p:not(:last-child) { padding:0 0 7.69vw; }
.btn-top-feature-close { text-align:center; margin:0 auto; }
.btn-top-feature-close button { background:none; border:none; font-size:3.59vw; color:#2971A9; font-weight:500; font-family:'Zen Maru Gothic'; font-style:normal; }

@media screen and (min-width:900px){
.top-feature-dialog { width:calc(100% - 2.9vw); max-width:79.71vw; border-radius:0.72vw; }
.top-feature-dialog::backdrop {}
.top-feature-sec { padding:0 0 3.62vw; }
.top-feature-sec figure { padding:0 0 2.9vw; }
.top-feature-sec figure img {}
.top-feature-sec h3 { padding:0 10.14vw 2.9vw; font-size:2.17vw; letter-spacing:0.05em; }
.top-feature-sec h3 span { margin:0 2.17vw 0 0; font-size:3.98vw; }
.top-feature-sec div { height:auto; overflow-y:auto; border-bottom:none; margin:0 10.14vw 3.62vw; }
.top-feature-sec div p { font-size:1.16vw; }
.top-feature-sec div p:not(:last-child) { padding:0 0 2.9vw; }
.btn-top-feature-close {}
.btn-top-feature-close button { font-size:1.16vw; }
.btn-top-feature-close button:hover { opacity:0.7; transition:1s ease; cursor:pointer; }
}
@media screen and (min-width:1380px){
.top-feature-dialog { width:calc(100% - 40px); max-width:1100px; border-radius:10px; }
.top-feature-dialog::backdrop {}
.top-feature-sec { padding:0 0 50px; }
.top-feature-sec figure { padding:0 0 40px; }
.top-feature-sec figure img {}
.top-feature-sec h3 { padding:0 140px 40px; font-size:30px; }
.top-feature-sec h3 span { margin:0 30px 0 0; font-size:55px; }
.top-feature-sec div { margin:0 140px 40px; }
.top-feature-sec div p { font-size:16px; }
.top-feature-sec div p:not(:last-child) { padding:0 0 30px; }
.btn-top-feature-close {}
.btn-top-feature-close button { font-size:16px; }
}




body:has(dialog[open]) { overflow:hidden; }
.top-feature-dialog { opacity:0; transform:translateY(50px); transition:opacity .4s ease, transform .4s ease; }
.top-feature-dialog[open] { opacity:1; transform:translateY(0); }
.top-feature-dialog::backdrop { background:rgba(56,70,88,0.7); opacity:0; transition:opacity 4s ease; }
.top-feature-dialog[open]::backdrop { opacity:1; }

.top-feature-dialog.is-show {
  opacity: 1;
  transform: translateY(0);
}


/* ----------------------------------------------
  #top-art-treatment
 ---------------------------------------------- */

#top-art-treatment { background:#EEF8FD; position:relative; }
#top-art-treatment:before { content:""; position:absolute; top:16.4vw; left:2.05vw; width:22.3vw; height:22.3vw; background:#E7F1F6; border-radius:1.03vw; z-index:1; }
#top-art-treatment:after { content:""; position:absolute; top:38.7vw; left:24.35vw; width:8.2vw; height:8.2vw; background:#E7F1F6; border-radius:1.03vw; z-index:1; }
#top-treatment-wrap {}
.top-treatment-sec { position:relative; }
.top-treatment-tit { display:table; text-align:center; margin:0 auto; padding:7.69vw 0; position:relative; font-weight:500; }
.top-treatment-tit h3 { display:table; line-height:1.3; font-size:5.64vw; color:#384658; font-weight:500; position:relative; }
.top-treatment-tit h3 span { display:table; position:relative; }
.top-treatment-tit:before { content:""; position:absolute; top:calc(50% - 1.03vw); left:-16.92vw; width:2.05vw; height:2.05vw; background:#75E8E5; border-radius:0.51vw; }
.top-treatment-tit:after { content:""; position:absolute; top:calc(50% - 1.03vw); right:-16.92vw; width:2.05vw; height:2.05vw; background:#75E8E5; border-radius:0.51vw; }
.top-treatment-tit h3:before { content:""; position:absolute; top:calc(50% - 1.03vw); left:-13.33vw; width:2.05vw; height:2.05vw; background:#58B3F8; border-radius:0.51vw; }
.top-treatment-tit h3:after { content:""; position:absolute; top:calc(50% - 1.03vw); right:-13.33vw; width:2.05vw; height:2.05vw; background:#58B3F8; border-radius:0.51vw; }
.top-treatment-tit h3 span:before { content:""; position:absolute; top:calc(50% - 1.03vw); left:-9.74vw; width:2.05vw; height:2.05vw; background:#58B3F8; border-radius:0.51vw; }
.top-treatment-tit h3 span:after { content:""; position:absolute; top:calc(50% - 1.03vw); right:-9.74vw; width:2.05vw; height:2.05vw; background:#58B3F8; border-radius:0.51vw; }

@media screen and (min-width:900px){
#top-art-treatment {}
#top-art-treatment:before { top:5.8vw; left:calc(50% - 53.62vw); width:10.43vw; height:10.43vw; border-radius:0.29vw; }
#top-art-treatment:after { top:224px; left:calc(50% - 595px); width:3.91vw; height:3.91vw; border-radius:0.29vw; }
#top-treatment-wrap { padding:2.17vw 0 4.35vw; position:relative; }
#top-treatment-wrap:before { content:""; position:absolute; bottom:-2.17vw; left:0; width:30%; height:2.17vw; background:#EEF8FD; border-radius:0 0 0.58vw 0; z-index:2; }
#top-treatment-wrap:after { content:""; position:absolute; bottom:0; right:0; width:70%; height:2.17vw; background:#fff; border-radius:0.58vw 0 0 0; z-index:2; }
.top-treatment-sec {}
.top-treatment-tit { padding:2.17vw 0; }
.top-treatment-tit h3 { font-size:2.17vw; }
.top-treatment-tit h3 span {}
.top-treatment-tit:before { top:calc(50% - 0.43vw); left:-7.24vw; width:0.87vw; height:0.87vw; border-radius:0.14vw; }
.top-treatment-tit:after { top:calc(50% - 0.43vw); right:-7.24vw; width:0.87vw; height:0.87vw; border-radius:0.14vw; }
.top-treatment-tit h3:before { top:calc(50% - 0.43vw); left:-5.8vw; width:0.87vw; height:0.87vw; border-radius:0.14vw; }
.top-treatment-tit h3:after { top:calc(50% - 0.43vw); right:-5.8vw; width:0.87vw; height:0.87vw; border-radius:0.14vw; }
.top-treatment-tit h3 span:before { top:calc(50% - 0.43vw); left:-4.35vw; width:0.87vw; height:0.87vw; border-radius:0.14vw; }
.top-treatment-tit h3 span:after { top:calc(50% - 0.43vw); right:-4.35vw; width:0.87vw; height:0.87vw; border-radius:0.14vw; }
}
@media screen and (min-width:1380px){
#top-art-treatment {}
#top-art-treatment:before { top:80px; left:calc(50% - 740px); width:144px; height:144px; border-radius:4px; }
#top-art-treatment:after { top:224px; left:calc(50% - 595px); width:54px; height:54px; border-radius:4px; }
#top-treatment-wrap { padding:30px 0 60px; }
#top-treatment-wrap:before { bottom:-30px; height:30px; border-radius:0 0 8px 0; }
#top-treatment-wrap:after { height:30px; border-radius:8px 0 0 0; }
.top-treatment-sec {}
.top-treatment-tit { padding:30px 0; }
.top-treatment-tit h3 { font-size:30px; }
.top-treatment-tit h3 span {}
.top-treatment-tit:before { top:calc(50% - 6px); left:-100px; width:12px; height:12px; border-radius:2px; }
.top-treatment-tit:after { top:calc(50% - 6px); right:-100px; width:12px; height:12px; border-radius:2px; }
.top-treatment-tit h3:before { top:calc(50% - 6px); left:-80px; width:12px; height:12px; border-radius:2px; }
.top-treatment-tit h3:after { top:calc(50% - 6px); right:-80px; width:12px; height:12px; border-radius:2px; }
.top-treatment-tit h3 span:before { top:calc(50% - 6px); left:-60px; width:12px; height:12px; border-radius:2px; }
.top-treatment-tit h3 span:after { top:calc(50% - 6px); right:-60px; width:12px; height:12px; border-radius:2px; }
}




.top-treatment-ul { display:flex; flex-flow:row wrap; justify-content:space-between; padding:0 5.13vw 10.25vw; position:relative; z-index:2; }
#top-treatment-ul01:before { content:""; position:absolute; top:-25.13vw; right:5.13vw; width:16.92vw; height:25.13vw; background:url(../img/top/bg_treatment.svg) center center/cover no-repeat; }
.top-treatment-ul:after { content:""; width:43.58vw; }
.top-treatment-ul li { width:43.58vw; background:#fff; border-radius:2.05vw; border:1px #E5E5E5 solid; margin:0 0 2.56vw; list-style:none; }
.top-treatment-ul li a { display:flex; flex-flow:column nowrap; justify-content:center; align-items:center; height:35.89vw; padding:0 0 3.33vw; text-decoration:none; position:relative; }
.top-treatment-ul li a:before { content:""; position:absolute; bottom:0.77vw; right:0.77vw; width:6.15vw; height:6.15vw; border-radius:1.03vw; }
.top-treatment-ul li a:after { content:""; position:absolute; bottom:2.94vw; right:2.94vw; width:0; height:0; border-style:solid; border-width:0.89vw 0 0.89vw 1.54vw; border-color:transparent transparent transparent #fff;}
#top-treatment-ul01 li a:before { background:#58B3F8; }
#top-treatment-ul02 li a:before { background:#FF8B7E; }
#top-treatment-ul03 li a:before { background:#75E8E5; }
.top-treatment-ul li figure { padding:0 0 0; }
.top-treatment-ul li figure img { width:14.51vw; height:auto; }
.top-treatment-ul li p { line-height:1.4; text-align:center; font-size:3.59vw; color:#384658; font-weight:500; }

@media screen and (min-width:900px){
.top-treatment-ul { justify-content:flex-start; width:86.95vw; margin:0 auto; padding:0 0 2.9vw; }
#top-treatment-ul01:before { top:-13.04vw; right:1.09vw; width:7.82vw; height:13.04vw; }
.top-treatment-ul:after { display:none; }
.top-treatment-ul li { width:16.81vw; border-radius:0.43vw; margin:0 0 1.16vw; }
.top-treatment-ul li:not(:nth-child(5n)) { margin-right:0.72vw; }
.top-treatment-ul li a { height:13.33vw; padding:0 0 0.87vw; }
.top-treatment-ul li a:before { bottom:0.36vw; right:0.36vw; width:2.31vw; height:2.31vw; border-radius:0.29vw; }
.top-treatment-ul li a:after { bottom:1.3vw; right:1.16vw; border-width:0.29vw 0 0.29vw 0.43vw; }
.top-treatment-ul li a:hover { opacity:0.7; transition:1s ease; }
.top-treatment-ul li figure { padding:0 0 0; }
.top-treatment-ul li figure img { width:5.8vw; transition:transform 0.6s ease; }
.top-treatment-ul li a:hover figure img { transform:scale(1.1); }
.top-treatment-ul li p { font-size:1.16vw; }
}
@media screen and (min-width:1380px){
.top-treatment-ul { width:1200px; margin:0 auto; padding:0 0 40px; }
#top-treatment-ul01:before { top:-180px; right:15px; width:108px; height:180px; }
.top-treatment-ul li { width:232px; border-radius:6px; margin:0 0 16px; }
.top-treatment-ul li:not(:nth-child(5n)) { margin-right:10px; }
.top-treatment-ul li a { height:184px; padding:0 0 12px; }
.top-treatment-ul li a:before { bottom:5px; right:5px; width:32px; height:32px; border-radius:4px; }
.top-treatment-ul li a:after { bottom:18px; right:16px; border-width:4px 0 4px 6px; }
.top-treatment-ul li figure { padding:0 0 0; }
.top-treatment-ul li figure img { width:80px; }
.top-treatment-ul li p { font-size:16px; }
}




#sub-menu-box { background:#EEF8FD; margin:0 0 10.25vw; padding:10.25vw 0 0; }
.page-menu #top-treatment-ul01:before { display:none; }
.sub-menu-tit { margin:0 5.13vw 3.07vw; }
.sub-menu-tit a { display:flex; align-items:center; height:20.51vw; padding:0 0 0 5.13vw; text-decoration:none; position:relative; }
#sub-menu-tit01 a { background:#FFE8E5; border:1px #FF8B7E solid; border-radius:2.05vw; }
#sub-menu-tit02 a { background:#E3FAFA; border:1px #75E8E5 solid; border-radius:2.05vw; }
.sub-menu-tit a:before { content:""; position:absolute; bottom:0.77vw; right:0.77vw; width:6.15vw; height:6.15vw; border-radius:1.03vw; }
.sub-menu-tit a:after { content:""; position:absolute; bottom:2.94vw; right:2.94vw; width:0; height:0; border-style:solid; border-width:0.89vw 0 0.89vw 1.54vw; border-color:transparent transparent transparent #fff; }
#sub-menu-tit01 a:before { background:#FF8B7E; }
#sub-menu-tit02 a:before { background:#75E8E5; }
.sub-menu-tit figure { margin-right:4.1vw; }
.sub-menu-tit figure img {}
.sub-menu-tit h2 { font-size:4.61vw; color:#384658; font-weight:500; }

@media screen and (min-width:900px){
#sub-menu-box { margin:0 0 2.9vw; padding:0; }
.sub-menu-tit { width:53.62vw; margin:0 auto; }
.sub-menu-tit a { justify-content:center; height:5.8vw; padding:0; }
#sub-menu-tit01 a { border-radius:0.58vw; }
#sub-menu-tit02 a { border-radius:0.58vw; }
.sub-menu-tit a:before { bottom:0.36vw; right:0.36vw; width:1.74vw; height:1.74vw; border-radius:0.29vw; }
.sub-menu-tit a:after { bottom:0.94vw; right:0.94vw; border-width:0.29vw 0 0.29vw 0.43vw; }
.sub-menu-tit a:hover { opacity:0.7; transition:1s ease; }
.sub-menu-tit figure { margin-right:1.16vw; }
.sub-menu-tit figure img { height:2.75vw; transition:transform 0.6s ease; }
.sub-menu-tit a:hover figure img { transform:scale(1.1); }
.sub-menu-tit h2 { font-size:1.3vw; }
.page-menu {}
.page-menu .top-treatment-ul { width:53.62vw; margin:0 auto; padding:2.9vw 0 1.45vw; }
.page-menu .top-treatment-ul li { width:12.17vw; margin:0 0 1.45vw; }
.page-menu .top-treatment-ul li:not(:nth-child(4n)) { margin-right:1.59vw; }
.page-menu .top-treatment-ul li a { height:10.28vw; }
.page-menu .top-treatment-ul li p { font-size:1.01vw; }
.page-menu .top-treatment-ul li a:before { width:1.74vw; height:1.74vw; }
.page-menu .top-treatment-ul li a:after { bottom:0.94vw; right:0.94vw; }
}
@media screen and (min-width:1380px){
#sub-menu-box { margin:0 0 40px; }
.sub-menu-tit { width:740px; }
.sub-menu-tit a { height:80px; }
#sub-menu-tit01 a { border-radius:8px; }
#sub-menu-tit02 a { border-radius:8px; }
.sub-menu-tit a:before { bottom:5px; right:5px; width:24px; height:24px; border-radius:4px; }
.sub-menu-tit a:after { bottom:13px; right:13px; border-width:4px 0 4px 6px; }
.sub-menu-tit figure { margin-right:16px; }
.sub-menu-tit figure img { height:38px; }
.sub-menu-tit h2 { font-size:18px; }
.page-menu {}
.page-menu .top-treatment-ul { width:740px; padding:40px 0 20px; }
.page-menu .top-treatment-ul li { width:168px; margin:0 0 20px; }
.page-menu .top-treatment-ul li:not(:nth-child(4n)) { margin-right:22px; }
.page-menu .top-treatment-ul li a { height:142px; }
.page-menu .top-treatment-ul li p { font-size:14px; }
.page-menu .top-treatment-ul li a:before { width:24px; height:24px; }
.page-menu .top-treatment-ul li a:after { bottom:13px; right:13px; }
}




/* ----------------------------------------------
  #top-art-case
 ---------------------------------------------- */

#top-art-case { position:relative; z-index:1; }
#top-art-case:before { content:""; position:absolute; top:16.4vw; right:2.05vw; width:22.3vw; height:22.3vw; background:#F3F4F5; border-radius:1.03vw; z-index:2; }
#top-art-case:after { content:""; position:absolute; top:38.7vw; right:24.35vw; width:8.2vw; height:8.2vw; background:#F3F4F5; border-radius:1.03vw; z-index:2; }
#top-case-wrap { padding:0 0 10.25vw; }
#top-case-box { position:relative; z-index:3; }
#top-case-box:before { content:""; position:absolute; top:-31.28vw; left:5.13vw; width:18.46vw; height:31.28vw; background:url(../img/top/bg_case.svg) center center/cover no-repeat; z-index:4; }
.slide-top-case { margin:0 0 12.82vw; }

@media screen and (min-width:900px){
#top-art-case {}
#top-art-case:before { top:3.62vw; right:calc(50% - 52.89vw); width:10.43vw; height:10.43vw; border-radius:0.29vw; }
#top-art-case:after { top:14.05vw; right:calc(50% - 42.39vw); width:3.91vw; height:3.91vw; border-radius:0.29vw; }
#top-case-wrap { padding:2.17vw 0 8.69vw; position:relative; }
#top-case-wrap:before { content:""; position:absolute; bottom:-2.17vw; left:0; width:70%; height:2.17vw; background:#fff; border-radius:0 0 0.58vw 0; z-index:2; }
#top-case-wrap:after { content:""; position:absolute; bottom:0; right:0; width:30%; height:2.17vw; background:#EEF8FD; border-radius:0.58vw 0 0 0; z-index:2; }
#top-case-box { width:86.95vw; margin:0 auto; }
#top-case-box:before { top:-12.75vw; left:1.01vw; width:7.46vw; height:12.75vw; }
.slide-top-case { display:flex; flex-flow:row nowrap; justify-content:space-between; margin:0 0 3.62vw; }
}
@media screen and (min-width:1380px){
#top-art-case {}
#top-art-case:before { top:50px; right:calc(50% - 730px); width:144px; height:144px; border-radius:4px; }
#top-art-case:after { top:194px; right:calc(50% - 585px); width:54px; height:54px; border-radius:4px; }
#top-case-wrap { padding:30px 0 120px; }
#top-case-wrap:before { bottom:-30px; height:30px; border-radius:0 0 8px 0; }
#top-case-wrap:after { height:30px; border-radius:8px 0 0 0; }
#top-case-box { width:1200px; }
#top-case-box:before { top:-176px; left:14px; width:103px; height:176px; }
.slide-top-case { margin:0 0 50px; }
}




.top-case-sec {}
.top-case-dl { width:71.79vw; border:1px #E5E5E5 solid; border-radius:2.56vw; margin:0 auto 5.13vw; }
.top-case-dl > dt { position:relative; }
.top-case-dl > dt figure { border-radius:2.56vw 2.56vw 0 0; }
.top-case-dl > dt figure img { width:71.79vw; height:45.89vw; object-fit:cover; }
.top-case-dl > dt > p { position:absolute; bottom:0; left:0; background:#2971A9; border-radius:0 1.03vw 0 0; padding:1.79vw 2.56vw; font-size:3.33vw; color:#fff; }
.top-case-dl > dd { padding:5.13vw; }
.top-case-dl > dd > h3 { line-height:1.6; padding:0 0 5.13vw; font-size:4.1vw; font-weight:600; }
.top-case-dl > dd > h3 > a { color:#384658; text-decoration:none; }
.top-case-info { display:flex; flex-flow:row wrap; line-height:1.8; }
.top-case-info dt { width:25%; font-size:3.07vw; color:#0672C4; font-weight:500; }
.top-case-info dd { width:75%; font-size:3.07vw; font-weight:500; }

@media screen and (min-width:900px){
.top-case-sec {}
.top-case-dl { width:21.15vw; border-radius:0.72vw; }
.top-case-dl > dt {}
.top-case-dl > dt figure { border-radius:0.72vw 0.72vw 0 0; }
.top-case-dl > dt figure img { width:21.15vw; height:12.46vw; }
.top-case-dl > dt > p { border-radius:0 0.29vw 0 0; padding:0.58vw 1.01vw; font-size:0.94vw; }
.top-case-dl > dd { padding:2.17vw 1.3vw; }
.top-case-dl > dd > h3 { padding:0 0 1.74vw; font-size:1.3vw; }
.top-case-dl > dd > h3 > a {}
.top-case-info {}
.top-case-info dt { width:25%; font-size:1.01vw; }
.top-case-info dd { width:75%; font-size:1.01vw; }
}
@media screen and (min-width:1380px){
.top-case-sec {}
.top-case-dl { width:292px; border-radius:10px; }
.top-case-dl > dt {}
.top-case-dl > dt figure { border-radius:10px 10px 0 0; }
.top-case-dl > dt figure img { width:292px; height:172px; }
.top-case-dl > dt > p { border-radius:0 4px 0 0; padding:8px 14px; font-size:13px; }
.top-case-dl > dd { padding:30px 18px; }
.top-case-dl > dd > h3 { padding:0 0 24px; font-size:18px; }
.top-case-dl > dd > h3 > a {}
.top-case-info {}
.top-case-info dt { width:25%; font-size:14px; }
.top-case-info dd { width:75%; font-size:14px; }
}




.slide-arrow { width:12.82vw; height:12.82vw; background:transparent; border:none; padding:0; cursor:pointer; transform:translateY(-50%); }
.prev-arrow { left:-12.82vw; }
.next-arrow { right:-12.82vw; }
.slide-arrow::before { content:""; display:block; width:3.07vw; height:3.07vw; border-top:0.51vw solid #333; border-right:0.51vw solid #333; margin:auto; }
.prev-arrow::before { transform:rotate(-135deg); }
.next-arrow::before { transform:rotate(45deg); }

.slider:not(.slick-initialized) { display:flex; overflow:hidden; }
.slider:not(.slick-initialized) > * { width:100%; flex-shrink:0; }
.slider.slick-initialized { display:block; }

@media screen and (min-width:900px){
.slide-arrow { width:3.62vw; height:3.62vw; }
.prev-arrow { left:-3.62vw; }
.next-arrow { right:-3.62vw; }
.slide-arrow::before { width:0.87vw; height:0.87vw; border-top:0.14vw solid #333; border-right:0.14vw solid #333; }
}
@media screen and (min-width:1380px){
.slide-arrow { width:50px; height:50px; }
.prev-arrow { left:-50px; }
.next-arrow { right:-50px; }
.slide-arrow::before { width:12px; height:12px; border-top:2px solid #333; border-right:2px solid #333; }
}




.slide-top-case .dots-top-mv { position:absolute; bottom:0; left:0; }
.slide-top-case .slick-dots { margin:3.85vw 0 7.69vw; }

@media screen and (min-width:900px){
.slide-top-case .slick-dots { margin:2.17vw 0 7.24vw; }
}
@media screen and (min-width:1380px){
.slide-top-case .slick-dots { margin:30px 0 100px; }
}




/* ----------------------------------------------
  #top-art-contact
 ---------------------------------------------- */

#top-art-contact { background:#fff url(../img/top/bg_contact.svg) left 50% bottom 10.25vw/82.3vw auto no-repeat; position:relative; }
#top-art-contact:before { content:""; position:absolute; top:11.0vw; left:2.05vw; width:22.3vw; height:22.3vw; background:#F3F4F5; border-radius:1.03vw; z-index:1; }
#top-art-contact:after { content:""; position:absolute; top:33.3vw; left:24.35vw; width:8.2vw; height:8.2vw; background:#F3F4F5; border-radius:1.03vw; z-index:1; }
#top-contact-wrap { padding:0 0 48.71vw; }
#top-contact-ul { display:flex; flex-flow:row nowrap; justify-content:space-between; padding:0 5.13vw 5.13vw; position:relative; z-index:3; }
#top-contact-ul li { width:48.5%; background:#fff; border-radius:2.05vw; border:2px #E5E5E5 solid; list-style:none; }
#top-contact-ul li a { display:flex; flex-flow:column nowrap; justify-content:center; align-items:center; height:55.89vw; padding:0 5.13vw; color:#384658; text-decoration:none; position:relative; }
#top-contact-ul li a:before { content:""; position:absolute; bottom:0.77vw; right:0.77vw; width:6.15vw; height:6.15vw; border-radius:1.03vw; }
#top-contact-ul li a:after { content:""; position:absolute; bottom:2.94vw; right:2.94vw; width:0; height:0; border-style:solid; border-width:0.89vw 0 0.89vw 1.54vw; border-color:transparent transparent transparent #fff;}
#top-contact-ul li:first-of-type a:before { background:#FF8B7E; }
#top-contact-ul li:last-of-type a:before { background:#58B3F8; }
#top-contact-ul figure { padding:0 0 4.1vw; }
#top-contact-ul figure img { width:7.69vw; height:auto; }
#top-contact-ul h3 { line-height:1.4; padding:0 0 4.61vw; font-weight:500; }
#top-contact-ul li:first-of-type h3 { font-size:3.59vw; color:#BD5347; }
#top-contact-ul li:last-of-type h3 { font-size:4.61vw; color:#2971A9; }
#top-contact-ul dl { width:100%; text-align:center; }
#top-contact-ul dt { line-height:1.4; margin:0 0 3.59vw; padding:0 0 3.59vw; border-bottom:1px #384658 solid; font-size:3.59vw; font-weight:500; }
#top-contact-ul dd { display:flex; justify-content:center; align-items:center; font-size:3.33vw; font-weight:600; position:relative; }
#top-contact-ul dd:before { content:""; display:block; width:0; height:0; border-style:solid; border-width:0.77vw 0 0.77vw 1.54vw; margin:0 2.05vw 0 0; }
#top-contact-ul li:first-of-type dd:before { border-color:transparent transparent transparent #FF8B7E; }
#top-contact-ul li:last-of-type dd:before { border-color:transparent transparent transparent #2971A9; }
#top-art-contact .txt-basic p { text-align:center; color:#384658; font-weight:600; }

@media screen and (min-width:900px){
#top-art-contact { background:#EEF8FD url(../img/top/bg_contact.svg) left 50% bottom 5.8vw/43.47vw auto no-repeat; }
#top-art-contact:before { top:3.62vw; left:calc(50% - 53.62vw); width:10.43vw; height:10.43vw; border-radius:0.29vw; }
#top-art-contact:after { top:14.05vw; left:calc(50% - 43.11vw); width:3.91vw; height:3.91vw; border-radius:0.29vw; }
#top-contact-wrap { padding:0 0 24.63vw; position:relative; }
#top-contact-wrap:before { content:""; position:absolute; bottom:-2.17vw; left:0; width:70%; height:2.17vw; background:#fff; border-radius:0 0 0.58vw 0; z-index:2; }
#top-contact-wrap:after { content:""; position:absolute; bottom:0; right:0; width:30%; height:2.17vw; background:#2971A9; border-radius:0.58vw 0 0 0; z-index:2; }
#top-contact-ul { width:57.97vw; margin:0 auto; padding:0 0 4.35vw; }
#top-contact-ul li { width:28.4vw; border-radius:0.58vw; }
#top-contact-ul li a { height:13.33vw; padding:0 1.45vw; }
#top-contact-ul li a:before { bottom:0.36vw; right:0.36vw; width:2.31vw; height:2.31vw; border-radius:0.29vw; }
#top-contact-ul li a:after { bottom:1.3vw; right:1.16vw; border-width:0.29vw 0 0.29vw 0.43vw; }
#top-contact-ul li a:hover { opacity:0.7; transition:1s ease; }
#top-contact-ul figure { position:absolute; top:2.9vw; padding:0; }
#top-contact-ul li:first-of-type figure { left:7.97vw; }
#top-contact-ul li:last-of-type figure { left:5.8vw; }
#top-contact-ul figure img { width:3.47vw; transition:transform 0.6s ease; }
#top-contact-ul li a:hover figure img { transform:scale(1.1); }
#top-contact-ul h3 { padding:0 0 2.17vw 4.35vw; }
#top-contact-ul li:first-of-type h3 { font-size:1.59vw; }
#top-contact-ul li:last-of-type h3 { font-size:1.74vw; }
#top-contact-ul dl {}
#top-contact-ul dt { border-bottom:none; margin:0; padding:0; font-size:1.16vw; }
#top-contact-ul dd { display:none; }
#top-art-contact .txt-basic p { font-size:1.3vw; }
}

@media screen and (min-width:1380px){
#top-art-contact { background:#fff url(../img/top/bg_contact.svg) left 50% bottom 80px/600px auto no-repeat; }
#top-art-contact:before { top:50px; left:calc(50% - 740px); width:144px; height:144px; border-radius:4px; }
#top-art-contact:after { top:194px; left:calc(50% - 595px); width:54px; height:54px; border-radius:4px; }
#top-contact-wrap { padding:0 0 340px; }
#top-contact-wrap:before { bottom:-30px; height:30px; border-radius:0 0 8px 0; }
#top-contact-wrap:after { height:30px; border-radius:8px 0 0 0; }
#top-contact-ul { width:800px; padding:0 0 60px; }
#top-contact-ul li { width:392px; border-radius:8px; }
#top-contact-ul li a { height:184px; padding:0 20px; }
#top-contact-ul li a:before { bottom:5px; right:5px; width:32px; height:32px; border-radius:4px; }
#top-contact-ul li a:after { bottom:18px; right:16px; border-width:4px 0 4px 6px; }
#top-contact-ul figure { position:absolute; top:40px; }
#top-contact-ul li:first-of-type figure { left:110px; }
#top-contact-ul li:last-of-type figure { left:80px; }
#top-contact-ul figure img { width:48px; }
#top-contact-ul h3 { padding:0 0 30px 60px; }
#top-contact-ul li:first-of-type h3 { font-size:22px; }
#top-contact-ul li:last-of-type h3 { font-size:24px; }
#top-contact-ul dl {}
#top-contact-ul dt { font-size:16px; }
#top-contact-ul dd {}
#top-art-contact .txt-basic p { font-size:18px; }
}




/* ----------------------------------------------
  #top-art-doctor
 ---------------------------------------------- */

#top-art-doctor { background:#2971A9; position:relative; }
#top-art-doctor:before { content:""; position:absolute; top:16.4vw; right:2.05vw; width:22.3vw; height:22.3vw; background:#2C6899; border-radius:1.03vw; z-index:1; }
#top-art-doctor:after { content:""; position:absolute; top:38.7vw; right:24.35vw; width:8.2vw; height:8.2vw; background:#2C6899; border-radius:1.03vw; z-index:1; }
#top-doctor-wrap { padding:0 0 17.94vw; }
#top-art-doctor .top-tit-box em { color:#fff; }
#top-art-doctor .top-tit-box h2 { color:#fff; }

@media screen and (min-width:900px){
#top-art-doctor {}
#top-art-doctor:before { top:1.45vw; right:calc(50% - 52.89vw); width:10.43vw; height:10.43vw; border-radius:0.29vw; }
#top-art-doctor:after { top:11.88vw; right:calc(50% - 42.39vw); width:3.91vw; height:3.91vw; border-radius:0.29vw; }
#top-doctor-wrap { padding:0 0 10.14vw; position:relative; }
#top-doctor-wrap:before { content:""; position:absolute; bottom:-2.17vw; left:0; width:30%; height:2.17vw; background:#2971A9; border-radius:0 0 0.58vw 0; z-index:2; }
#top-doctor-wrap:after { content:""; position:absolute; bottom:0; right:0; width:70%; height:2.17vw; background:#EEF8FD; border-radius:0.58vw 0 0 0; z-index:2; }
}
@media screen and (min-width:1380px){
#top-art-doctor {}
#top-art-doctor:before { top:20px; right:calc(50% - 730px); width:144px; height:144px; border-radius:4px; }
#top-art-doctor:after { top:164px; right:calc(50% - 585px); width:54px; height:54px; border-radius:4px; }
#top-doctor-wrap { padding:0 0 140px; }
#top-doctor-wrap:before { bottom:-30px; height:30px; border-radius:0 0 8px 0; }
#top-doctor-wrap:after { height:30px; border-radius:8px 0 0 0; }
}




#top-message-dl { display:flex; flex-flow:column nowrap; padding:15.38vw 0 0; }
#top-message-dl dt { display:flex; flex-flow:column nowrap; justify-content:center; align-items:start; height:52.3vw; background:#fff; border-radius:0 2.05vw 2.05vw 0; margin:0 5.13vw 6.15vw 0; padding:0 0 0 57.94vw; position:relative; }
#top-message-dl dt img { position:absolute; bottom:0; left:-7.69vw; width:64vw; height:auto; }
#top-message-dl dt em { display:block; padding:0 0 3.07vw; font-size:3.59vw; color:#384658; font-weight:500; font-style:normal; }
#top-message-dl dt span { display:block; font-size:3.59vw; color:#2971A9; font-weight:600; }
#top-message-dl dt strong { display:inline-block; margin:0 0 0 2.05vw; font-size:4.61vw; }
#top-message-dl dd { padding:0 5.13vw 10.25vw; }
#top-message-dl dd p { line-height:1.65; font-size:3.59vw; color:#fff; }
#top-message-dl dd p:not(:last-child) { padding:0 0 5.13vw; }
#top-art-doctor .btn-more a { background:#fff; color:#2971A9; font-weight:600; }
#top-art-doctor .btn-more a:before { border-color:transparent transparent transparent #2971A9; }

@media screen and (min-width:900px){
#top-message-dl { flex-flow:row nowrap; justify-content:space-between; width:86.95vw; margin:0 auto; padding:1.45vw 0 3.98vw; position:relative; z-index:3; }
#top-message-dl:before { content:""; position:absolute; top:-1.45vw; left:calc(50% - 108vw); width:100vw; height:8.69vw; background:#2C6899; border-radius:1.03vw; z-index:1; }
#top-message-dl dt { width:44.42vw; height:19.78vw; border-radius:0.58vw; margin:0; padding:0 0 0 27.89vw; positon:relative; z-index:2; }
#top-message-dl dt img { left:-0.79vw; width:25.14vw; }
#top-message-dl dt em { padding:0 0 1.09vw; font-size:1.23vw; }
#top-message-dl dt span { font-size:1.3vw; }
#top-message-dl dt strong { margin:0 0 0 0.58vw; font-size:1.74vw; }
#top-message-dl dd { width:37.31vw; padding:0; positon:relative; z-index:2; }
#top-message-dl dd p { font-size:1.23vw; }
#top-message-dl dd p:not(:last-child) { padding:0 0 1.88vw; }
#top-art-doctor .btn-more a {}
#top-art-doctor .btn-more a:before {}
}
@media screen and (min-width:1380px){
#top-message-dl { width:1200px; padding:20px 0 55px; }
#top-message-dl:before { top:-20px; height:120px; border-radius:1.03vw; }
#top-message-dl dt { width:613px; height:273px; border-radius:8px; padding:0 0 0 385px; }
#top-message-dl dt img { left:-11px; width:347px; }
#top-message-dl dt em { padding:0 0 15px; font-size:17px; }
#top-message-dl dt span { font-size:18px; }
#top-message-dl dt strong { margin:0 0 0 8px; font-size:24px; }
#top-message-dl dd { width:515px; }
#top-message-dl dd p { font-size:17px; }
#top-message-dl dd p:not(:last-child) { padding:0 0 26px; }
#top-art-doctor .btn-more a {}
#top-art-doctor .btn-more a:before {}
}




