﻿.intro{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.intro img{cursor:pointer}.intro .dermatology{width:50vw;height:100vh;background:url("../image/img_1.jpg") center no-repeat;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:all 1s;transition:all 1s}.intro .dermatology:hover{width:80vw}.intro .womensclinic{width:50vw;height:100vh;background:url("../image/img_2.jpg") center no-repeat;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:all 1s;transition:all 1s}.intro .womensclinic:hover{width:80vw}.site__main{font-size:14px;line-height:1;overflow:hidden}.site__main h2,.site__main h3,.site__main h4{font-weight:normal}.site__main p{line-height:2;color:#c5c5c5}.site__main section{position:relative}.site__main .main__line{position:absolute;top:0;left:50%;z-index:-1;width:1px;height:100%;background:#eaeaea}.site__main .main__line.--left{translate:-400px 0}.site__main .main__line.--right{translate:400px 0}.section__visual{padding-bottom:215px;white-space:nowrap}.section__visual h2{position:absolute;bottom:0;left:50%;z-index:10;translate:-50% 0;height:215px;font-size:190px;color:#717171;letter-spacing:-0.03em;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.section__visual h2 strong{margin-top:-0.57em}.section__visual h2 i{width:670px;height:340px;background:url(../image/for-beauty.svg) center/contain no-repeat;position:relative;top:.48em;margin-top:-1.2em}.section__visual .visual__video{max-height:calc(100dvh - 0px);overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.section__visual .visual__video video{width:100%;max-width:2000px}.section__visual .slick-slide{height:900px;overflow:hidden;position:relative}.section__visual .slick-slide .slick__mov{height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.section__visual .slick-slide .slick__mov video{mix-blend-mode:multiply}.section__visual .slick-slide .slick__txt{width:83em;position:absolute;left:50%;top:50%;translate:-50% -50%;text-align:center}.section__visual .slick-slide .slick__txt h2{padding-bottom:.8em;font-size:20px;font-weight:400}.section__visual .slick-slide .slick__txt strong{font-size:60px;line-height:1.3}@media screen and (max-width: 1650px){.section__visual h2{font-size:160px}.section__visual h2 i{width:550px;height:270px}}.section__okay{border-top:1px solid #eaeaea;padding-bottom:130px}.section__okay .okay__title{padding:80px 0 170px;text-align:center}.section__okay .okay__title h3{font-size:18px;font-weight:bold;margin-bottom:1em;color:#717171}.section__okay .okay__slider{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative}.section__okay .okay__slider .okay__badge{position:absolute;top:0;left:50%;z-index:10;translate:-50% -50%;font-size:36px;width:5.4em;height:5.4em;border-radius:100%;background:url(../image/badge-bg.jpg)}.section__okay .okay__slider .okay__badge::before,.section__okay .okay__slider .okay__badge::after{content:"";position:absolute;top:50%;left:50%;translate:-50% -50%}.section__okay .okay__slider .okay__badge::before{width:4.4em;height:4.4em;background:url(../image/badge-text.svg) center/contain no-repeat;-webkit-animation:okay_badge 60s linear infinite;animation:okay_badge 60s linear infinite}.section__okay .okay__slider .okay__badge::after{width:2.7em;height:.75em;background:url(../image/badge-logo.svg) center/contain no-repeat}.section__okay .okay__slider .swiper{width:2000px;height:630px;overflow:hidden}.section__okay .okay__slider .swiper::after{content:"";position:absolute;top:0;left:50%;z-index:5;translate:-50% 0;width:2000px;height:100%;pointer-events:none;background:url(../image/cover-invert.svg) center/auto 100% no-repeat}.section__okay .okay__slider .swiper .swiper-slide{width:438px;height:630px;margin:0 40px;position:relative;top:0;-webkit-transition:top 1s;transition:top 1s}.section__okay .okay__slider .swiper .slide-01{background:url(../image/01.jpg) center/cover no-repeat}.section__okay .okay__slider .swiper .slide-02{background:url(../image/02.jpg) center/cover no-repeat}.section__okay .okay__slider .swiper .slide-03{background:url(../image/03.jpg) center/cover no-repeat}.section__okay .okay__slider .swiper .slide-04{background:url(../image/04.jpg) center/cover no-repeat}.section__okay .okay__slider .swiper .slide-05{background:url(../image/05.jpg) center/cover no-repeat}.section__okay .okay__slider .swiper .slide-06{background:url(../image/06.jpg) center/cover no-repeat}.section__okay .okay__slider .swiper .slide-07{background:url(../image/07.jpg) center/cover no-repeat}.section__okay .okay__slider .swiper .slide-08{background:url(https://okayderma.com/img/main/okay/08.jpg) center/cover no-repeat}.section__okay .okay__slider .swiper .slide-09{background:url(https://okayderma.com/img/main/okay/09.jpg) center/cover no-repeat}.section__okay .okay__slider .swiper .slide-010{background:url(https://okayderma.com/img/main/okay/010.jpg) center/cover no-repeat}.section__okay .main__line{z-index:10;mix-blend-mode:darken}@-webkit-keyframes okay_badge{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes okay_badge{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.section__de-aging{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.section__de-aging h3{font-size:80px;color:#717171;text-align:center;padding-bottom:.6em}.section__de-aging .slider__wrapper{width:2000px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border-top:1px solid #b8b8b8;border-bottom:1px solid #b8b8b8}.section__de-aging .slider__wrapper .slider__container{width:50%}.section__de-aging .slider__nav{background:#fff;height:599px}.section__de-aging .slider__nav .swiper,.section__de-aging .slider__nav .swiper-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.section__de-aging .slider__nav .swiper{overflow:visible}.section__de-aging .slider__nav .swiper-wrapper{-webkit-transform:none !important;-ms-transform:none !important;transform:none !important}.section__de-aging .slider__nav .swiper-slide{height:99.8333333333px;cursor:pointer;pointer-events:all !important;-webkit-transition:background .8s;transition:background .8s}.section__de-aging .slider__nav .swiper-slide dl{width:700px;height:100%;padding-left:30px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative}.section__de-aging .slider__nav .swiper-slide dl dt{font-size:25px;width:8em;font-family:var(--Marcellus);color:#717171}.section__de-aging .slider__nav .swiper-slide dl .nav__desc{line-height:2;color:#c5c5c5;opacity:0;-webkit-transition:.8s;transition:.8s}.section__de-aging .slider__nav .swiper-slide dl .nav__img{position:absolute;bottom:0;left:100%;opacity:0;translate:-80px 0;-webkit-transition:.8s;transition:.8s}.section__de-aging .slider__nav .swiper-slide dl::after{content:"";position:absolute;top:50%;right:0;width:10px;height:15px;background:url(../image/icon-arrow.svg) center/contain no-repeat;opacity:1;translate:0 -50%;-webkit-transition:.8s;transition:.8s}.section__de-aging .slider__nav .swiper-slide-active{background:#f5f5f5}.section__de-aging .slider__nav .swiper-slide-active dl .nav__desc{opacity:1}.section__de-aging .slider__nav .swiper-slide-active dl .nav__img{opacity:1;translate:-40px 0}.section__de-aging .slider__nav .swiper-slide-active dl::after{opacity:0;translate:-30px -50%}.section__de-aging .slider__nav .swiper-slide+.swiper-slide{border-top:1px solid #eaeaea}@media screen and (max-width: 1600px){.section__de-aging .slider__nav .swiper-slide dl{width:600px;padding-left:20px}.section__de-aging .slider__nav .swiper-slide dl dt{font-size:20px}.section__de-aging .slider__nav .swiper-slide-active dl .nav__img{translate:-10px 0}.section__de-aging .slider__nav .swiper-slide dl .nav__img img{width:100px}}.section__safety{padding:235px calc(50% - 700px)}.section__safety h3{font-size:80px;color:#717171;position:absolute;bottom:calc(100% - .35em);left:30px;z-index:5}.section__safety .safety__img{width:1400px;height:500px;background:url(../image/visual.jpg)}.section__safety p{position:absolute;top:calc(100% + 30px);right:50px;z-index:5}.section__safety p strong{font-size:18px;color:#717171;display:block;margin-bottom:.5em}