@charset "utf-8";
/* KV */
.kv{position: relative; line-height: 1;}
.kv:after{content: ''; position: absolute; bottom: 0; left: 0; height: 10%; width: 100%; background: linear-gradient(to top, rgba(255,255,255,1), rgba(255,255,255,0));}
.top-slide{position: relative; overflow: hidden; height: calc(100vh - 70px); z-index: 40;}
[class*="top-slide_bg"]{width: 100%; height: 100%; position: absolute; top: 0; left: 0; transform: scale(1.2) translateZ(0); will-change: transform;}
[class*="top-slide_txt"]{z-index: 50; line-height: 1.3; font-weight: 200; letter-spacing: 0.05em; position: absolute;}
.slick-slide.is-active [class*="top-slide_bg"]{animation: slideZoom 9s ease-out forwards .6s;}

.top-slider .slick-dots{position: absolute; bottom: 8%; right: 2%; width: 10px; z-index: 300;}
.top-slider .slick-dots li{width: 10px; height: 10px; margin: 15px 0 0 0; border-radius: 100%; background: #fff; display: block; text-indent: -9999px; cursor: pointer;}
.top-slider .slick-dots li.slick-active{background: #5FC5DE;}

@keyframes slideZoom {
    0% {transform: scale(1.2) translateZ(0);}
    100% {transform: scale(1) translateZ(0);}
}

@media screen and (min-width: 768px) {
    [class*="top-slide_txt"]{font-size: min(4.2vw,5rem);}
    .top-slide_txt01{left: 14%; bottom: 9%;}
    .top-slide_txt02{left: 14%; top: 28%;}
    .top-slide_txt03{left: 14%;top: 28%;}
    .top-slide_txt04{left: 14%; bottom: 9%;}
    
    .top-slide_bg01{background: url("../img/top/slide01.jpg") no-repeat center center/cover;}
    .top-slide_bg02{background: url("../img/top/slide02.jpg") no-repeat center center/cover;}
    .top-slide_bg03{background: url("../img/top/slide03.jpg") no-repeat center center/cover;}
    .top-slide_bg04{background: url("../img/top/slide04.jpg") no-repeat center center/cover;}
}

@media screen and (max-width: 767px) {
    .top-slide{height: 100vh; height: 100dvh;}
    [class*="top-slide_txt"]{font-size: 7.8vw; text-align: center; left: 0; top: 42vw; width: 100%;}
    
    .top-slide_bg01{background: url("../img/top/slide01_sp.jpg") no-repeat center center/cover;}
    .top-slide_bg02{background: url("../img/top/slide02_sp.jpg") no-repeat center center/cover;}
    .top-slide_bg03{background: url("../img/top/slide03_sp.jpg") no-repeat center center/cover;}
    .top-slide_bg04{background: url("../img/top/slide04_sp.jpg") no-repeat center center/cover;}
    
    .top-slider [class*="top-slide_txt"]{display: none !important;}
    .top-slider .slick-dots{right: 0; bottom: 80px; width: 100%; display: flex; justify-content: center;}
    .top-slider .slick-dots li{margin: 0 8px;}
}

/* Btn More */
.btn-more{width: 135px; height: 34px; font-size: 1.4rem; padding-top: 2px; font-style: italic; background: #5FC5DE; color: #fff; text-align: center; display: flex; justify-content: center; align-items: center;}
.btn-more:after{content: ''; background: url("../img/common/ic_arrow.svg") no-repeat top left/100% 100%; display: block;  opacity: 0; text-indent: 0; transition: .4s;}
.btn-more:hover:after{opacity: 1; text-indent: -15px; margin-left: 12px; width: 15px; height: 15px;}
.btn-more:hover{background: #18A5CE;}

@keyframes flowing {
    from{transform: translateX(-100%);}
    to{transform: translateX(0);}
}

/* Intro */
.intro-head{display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding: 60px 0 35px;}
.intro-txt{font-size: min(15vw,18.3rem); font-weight: 100; line-height: 1; letter-spacing: 0.01em; margin-right: 5%;}
.intro-desc{font-size: min(2vw,2.5rem); line-height: 2;}

.intro-txt span{opacity: 0;}
.intro-txt.is-view{animation: flowing 2s forwards;}
.intro-txt.is-view span{opacity: 1; transition: .7s ease;}

@media (max-width: 767px){
    .intro-head{padding: 8vw 0 6vw;}
    .intro-txt{font-size: 35vw; margin: 0 0 0;}
    .intro-desc{font-size: 3vw;}
}

.intro-box_left .js-photo{padding-bottom: 62.8%;}
.intro-box_right .js-photo{padding-bottom: 121.2%;}
.intro-box .js-photo:after{content: ''; width: 100%; height: 7px; background: url("../img/top/line.png") repeat-x bottom left/auto 100%; position: absolute; bottom: 0; left: 0;}

@media (min-width: 768px){
    .intro-box{display: flex; justify-content: space-between;}
    .intro-box_left{width: 45%; display: flex; align-content: space-between; flex-wrap: wrap;}
    .intro-box_right{width: 50.83%;}    
    .intro-box_left .js-photo{border-radius: 0 4.16vw 0 0;}
    .intro-box_right .js-photo{border-radius: 5.2vw 0 0 0;}
}

@media (max-width: 767px){
    .intro-box_left{margin: 0 30px 0 0;}
    .intro-box_right{margin: 30px 0 30px 30px;}    
    .intro-box_left .js-photo{border-radius: 0 10vw 0 0;}
    .intro-box_right .js-photo{border-radius: 10vw 0 0 0;}
    .intro-box .js-photo:after{height: min(1vw,7px);}
}

/* Product */
.product{padding: 180px 0 100px; text-align: center;}
.product-desc{margin: 0 0 80px; font-size: min(2.8vw,2.5rem); line-height: 1.6;}
.product-item_txt{margin: 0 25px 0 0; font-size: 2.4rem; line-height: 1.1; font-weight: 400; color: #5FC5DE; letter-spacing: 0.05em;}
.product-btn a{max-width: 560px; width: 100%; padding: 0.75em 0; font-size: min(1.7vw,2rem); line-height: 1.5; border-radius: 90px; display: flex; justify-content: center; align-items: center; background: #5FC5DE; color: #fff; text-align: left; transition: .3s;}
.product-btn a:before{content: ''; width: 49px; height: 49px; margin-right: 15px; background: url("../img/top/ic_thawing.svg") no-repeat top left/100%;}
.product-btn a:hover{background: #18A5CE;}

@media (min-width: 768px){
    .product-box{display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap;}
    .product-item{width: 47.33%; margin: 0 5.34% 5.34% 0;}
    .product-item:nth-of-type(2n){margin-right: 0;}
    .product-item_head{max-width: 560px; margin: 17px 0 47px; display: flex; justify-content: center; align-items: center;}
}

@media (max-width: 767px){
    .product{padding: 60px 0 30px;}
    .product-desc{text-align: left; margin: 0 0 30px; font-size: clamp(1.6rem,3.8vw,2.5rem);}
    .product .btn-more{margin: 0 auto;}
    .product-item{margin: 0 0 40px;}
    .product-item_txt{margin: 20px 0 10px; font-size: 2rem;}
    .product-btn a{margin: 30px auto 0; width: 90%; font-size: min(3.2vw,2rem);}
    .product-btn a:before{width: min(8vw,49px); height: min(8vw,49px); margin-right: 4%;}
}

/* Discover */
.discover-main{border-top: 0.9375vw solid #5FC5DE; position: relative; z-index: 10;}

.discover-tit{background: #5FC5DE; text-align: center; padding: 1.5em 0; font-size: min(5vw,6rem); letter-spacing: 0.15em; line-height: 1.3; font-style: italic; color: #fff;}
.discover-tit h2 span{opacity: 0;}
.discover-tit.is-view h2{animation: flowing 2.4s forwards;}
.discover-tit.is-view h2 span{opacity: 1; transition: .5s ease;}

@media (min-width: 768px){
    .discover-main .js-photo{padding-bottom: 31.67%;}
    
    .discover .btn-more{width: 200px; margin: 45px 0 0 0;}
    
    .discover-box01{display: flex; justify-content: space-between; align-items: center; overflow: hidden;}
    .discover-box01 .photo{width: 53.8%;}
    .discover-box01 .inner{width: 43.5%; margin-bottom: 29.48vw;}

    .discover-box02{display: flex; justify-content: space-between; background: #E9F8FB; padding-bottom: 260px;}
    .discover-box02 .photo{width: 46.2%; margin-top: -40vw; position: relative;}
    .discover-box02 .outer{width: 49.2%; display: flex; justify-content: flex-end;}
    .discover-box02 .inner{margin: -100px 0 0;}

    .discover-box03{display: flex; justify-content: center; align-items: flex-end; margin: 100px 0 300px;}
    .discover-box03 .photo{margin: -300px 3.6% 0 0;}
}

@media (max-width: 767px){
    .discover-main .js-photo{padding-bottom: 80%;}

    .discover-tit{font-size: min(9vw,6rem);}
    
    .discover-box01{margin: 0 0 20px; overflow: hidden;}
    .discover-box01 .inner{margin: -40% 0 0 30px; position: relative; z-index: 2;}
    
    .discover-box02{display: flex; flex-wrap: wrap;}
    .discover-box02 .photo{width: 100%; order: -1; position: relative; z-index: 10}
    .discover-box02 .outer{background: #E9F8FB; padding: 30px 30px 60px; position: relative; z-index: 1;}
    .discover-box02 .outer:before{content: ''; display: inline-block; width: 100%; height: 100px; background: #E9F8FB; position: absolute; top: 100%; left: 0; z-index: -1;}
    
    .discover-box03{margin: 0 15px 180px 25%; z-index: 2; position: relative;}
    .discover-box03 .photo{margin: 0 0 15px;}
}

/* Health & Safety */
.health{display: flex; flex-wrap: wrap; background: #B9F3FF;}
.health-outer{width: 54.27%; display: flex; justify-content: flex-end; align-items: center;}
.health-inner{max-width: 630px; width: 100%; padding: 20px;}
.health-inner .m-tit{margin-bottom: 17px;}
.health-desc{max-width: 530px; margin: 0 0 30px;}
.health-img{width: 45.73%; position: relative;}

@media (min-width: 768px){
    .health-img:before{content: ''; position: absolute; top: 0; left: 0; width: 34%; height: 100%; background: linear-gradient(to right, rgba(185,243,255,1), rgba(185,243,255,0));}
}

@media (max-width: 1023px) and (min-width: 768px){
    .health-img img{object-fit: cover; height: 100%;}
}

@media (max-width: 767px){
    .health-img{width: 100%; order: -1;}
    .health-outer{width: 100%;}
    .health-inner{padding: 25px 30px 30px; max-width: 767px;}
    .health-desc{max-width: 767px; margin: 0 0 20px;}
}

/* Info */
.info{background: #eee; padding: 100px 0;}
.info .m-tit{text-align: center;}
.info-list{max-width: 864px; margin: 0 auto; border-top: 1px solid #330100;}
.info-list li{border-bottom: 1px solid #330100; padding: 40px 0 60px;}
.info-day{font-weight: 600;}
.info-tit{font-size: 2.5rem; line-height: 1.4; font-weight: 600; padding: 10px 0;}

@media (max-width: 767px){
    .info{padding: 60px 0 70px;}
    .info-list li{padding: 20px 0 30px;}
    .info-tit{font-size: min(5.8vw,2.5rem); padding: 5px 0;}
}