@charset "utf-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
:root {
    --swiper-theme-color: #103dd4 !important;
    --swiper-navigation-size: 30px;
}

html,body {position: relative;}
body {font-size: 14px;color: #000;margin: 0;padding: 0;position: relative;
    font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}


/* header */
header {position: sticky;top: 0px;height: 65px;width: 100%;z-index: 99;background: #fff !important;transition: all 0.25s;border-bottom: 1px solid #eaeaea;}
header h1.logo {height: 100%;display: flex;align-items: center;justify-content: center;}
header h1.logo > img {display: inline-block;width: 120px;}
header.sticky {height: 55px;/* transition: all 0.25s; *//* transition-delay: 0.25s; */box-shadow: 0px 0px 6px 1px #58585854;}
header.sticky h1.logo > img {transition: all 0.25s;/* transition-delay: 0.5s; */}

/* main */
main {position: relative;height: 100vh;}

/* mySwiper */
.mySwiper {overflow: hidden;width: 100%;/* height: 100%; */}
.mySwiper .swiper-slide {text-align: left;font-size: 18px;display: flex;flex-flow: column nowrap;justify-content: center;height: 100vh;}

.mySwiper .swiper-slide.slider01 {
  background: #2e2e2e url('../images/main01.png') no-repeat;
  background-size: auto;
  background-position: bottom right;
} 
.mySwiper .swiper-slide.slider02 {
  background: #2e2e2e  url('../images/main02.png') no-repeat;
  background-size: auto;
  background-position: bottom right;
} 
.mySwiper .swiper-slide.slider03 {
  background: #2e2e2e  url('../images/main03.png') no-repeat;
  background-size: auto;
  background-position: bottom right;
} 
.mySwiper .swiper-slide.slider04 {
  background: #2e2e2e  url('../images/main04.png') no-repeat;
  background-color: #2e2e2e;
  background-size: auto;
  background-position: bottom right;
} 
.mySwiper .swiper-slide.slider05 {
  background: #2e2e2e  url('../images/main05.png') no-repeat;
  background-color: #2e2e2e;
  background-size: auto;
  background-position: bottom right;
} 
.mySwiper .swiper-slide.slider06 {
  background: #2e2e2e  url('../images/main06.png') no-repeat;
  background-color: #2e2e2e;
  background-size: auto;
  background-position: bottom right;
} 

.mySwiper .swiper-text {display: flex;flex-direction: column;justify-content: center;margin: 0 auto;max-width: 1440px;width: calc(100% - 8vw);padding: 0 4vw 0 4vw;margin-bottom: 120px;}

.mySwiper .swiper-slide .title,
.mySwiper .swiper-slide .description,
.mySwiper .swiper-slide .step {display: block;opacity: 0;/* transition: 0.5s ease 0.5s; */}

.mySwiper .swiper-slide-active .title,
.mySwiper .swiper-slide-active .description,
.mySwiper .swiper-slide-active .step { opacity: 1;}

.mySwiper .more-btn {transition: 0.25s ease-in-out;padding: 10px 32px;font-size: 16px;margin-top: 40px;width: 80px;color: #ffffffb5;border: 2px solid #eaeaea;border-radius: 66px;text-align: center;}
.mySwiper .more-btn:hover {background: #ffffff;color: #000;border: 2px solid #ffffff;}

.mySwiper .swiper-slide-active .title {font-size: 27.5px;margin-bottom: 15px;color:#fff;transition: opacity 0.5s ease 0.25s;width: 100%;display: block;color: #FFF;font-family: Pretendard;font-size: 70px;font-style: normal;font-weight: 800;line-height: 110%; /* 77px */word-wrap: break-word;}
.mySwiper .swiper-slide-active .description {font-size: 24px;color: #e7e7e7;transition: opacity 0.5s ease 0.5s;}
.mySwiper .swiper-slide-active .step {transition: opacity 0.5s ease 0.5s;}
.mySwiper .swiper-slide-active .step li {width: 8px;height: 8px;background: #fff;display: inline-block;border-radius: 4px;margin-right:5px;}
.mySwiper .swiper-slide-active .step li.on {background: var(--swiper-theme-color);}


.mySwiper .swiper-box {position: absolute;bottom: 26%;left: 50%;transform: translate(-50% , 0);display: flex;align-items: center;justify-content: flex-start;height: 50px;width: calc(100% - 8vw);z-index: 99;max-width: 1440px;}
.mySwiper .swiper-progress-bar {/* position: relative; */width: 200px;display: block;height: 6px;background: #777777;position: absolute;bottom: 20px;opacity: 1;border-radius: 24px;overflow: hidden;}
.mySwiper .swiper-progress-bar .slide_progress-bar {/* position: absolute; */height: 100%;background: rgba(0, 0, 0, 1);width: auto;clear: both;opacity: 0;left: 0;right: 0;}
.mySwiper .swiper-progress-bar .slide_progress-bar:after {position: absolute;top: 0;left: 0;background: #0075ca;height: 100%;width: 0;content: "";transition: 0.1s width linear;opacity: 1;}
.mySwiper .swiper-progress-bar.active .slide_progress-bar {opacity: 1;}
.mySwiper .swiper-progress-bar.animate .slide_progress-bar:after { transition: width linear;transition-delay: unset; width: 100%;transition-duration: 8s;}

.mySwiper .swiper-pagination {color:#fff;font-size: 12px;display:inline-block;text-align: center;width: auto;bottom: 30px;left: 50%;transform: translate(-50%, 0);}
.mySwiper .swiper-pagination-bullet,
.mySwiper .swiper-pagination-bullet-active  {background: #fff;margin: 0 4px;width: 10px;height: 10px;}


.mySwiper .swiper-button-next,
.mySwiper .swiper-button-prev {color: var(--swiper-theme-color);background: #ffffffb3;border-radius: 50px;width: 32px;height: 32px;color: #000}

.mySwiper .swiper-button-prev {left:220px;}
.mySwiper .swiper-button-next {left:260px;}

.mySwiper .swiper-button-next:after,
.mySwiper .swiper-button-prev:after {font-size: 18px;font-weight: 800;color:000;} 


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

.fullpage {}
.fullpage .section{color: #fff;text-align:center;height: 100vh;}

/* Backgrounds colors for sections */
.fp-section:nth-child(1){}
.fp-section:nth-child(2){background-image: linear-gradient(128deg,#202020,#343434);}
.fp-section:nth-child(3){background-image: linear-gradient(128deg,#343434,#202020);}
.fp-section:nth-child(4){background-image: linear-gradient(128deg,#202020,#343434);}
.fp-section:nth-child(5){background: #000;}
.fp-section:nth-child(6){background-image: linear-gradient(128deg,#343434,#202020);}
.fp-section:nth-child(7){background-image: linear-gradient(128deg,#202020,#343434);}
.fp-section:nth-child(8){background-image: linear-gradient(128deg,#343434,#202020);}


/* Styling Our Menu */
nav {}
.logo {position: absolute;z-index: 999;width: 150px;left: 50px;top: 25px;}
.logo img  {}

nav{position:fixed;top:0;left:0;height: 80px;z-index: 70;width: 100%;padding: 0;margin:0;display: flex;align-items: center;justify-content: center;height: 80px;}
#menu li {display:inline-block;margin: 8px 0;color: #000;border-radius: 10px;}
#menu li.active,
#menu li.active:hover{}
#menu li a{text-decoration:none;padding: 9px 18px;display:block;font-size: 17px;font-weight: 500;color: #fff;}
#menu li.active a,
#menu li.active:hover a:hover{color: #40afff;font-weight: 800;}
.blur {filter: blur(8px);-webkit-filter: blur(8px);position: absolute;left: 0;top: 0;width: 100%;height: 80px;background: #00000021;z-index: -1;}


/* 추가 텍스트 */        
.gradient-text-ani {
    color: #f35626;
    background-image: linear-gradient(92deg,#f35626,#feab3a);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: Hue 5s linear infinite;
}
.gradient-text-ani2 {
    color: #f35626;
    background-image: linear-gradient(92deg,#3a3afe,#6326f3);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: Hue 5s linear infinite;
}
.gradient-text-ani3 {
    background-image: linear-gradient(92deg,#ade2d1,#0f7962);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: Hue 5s linear infinite;
}
    
@keyframes Hue {
    0% {
    filter:hue-rotate(0deg)
    }
    to {
    filter:hue-rotate(-1turn)
    }
}
    
.text-base {font-weight: 700;font-size: 70px;}


/* 공통 시작 */
.wrap { background: #000;}
.tit {color: #fff;border-bottom: 1px solid #373737;padding: 40px 0;max-width: 1440px;margin: 40px auto;width: calc(min(90rem, 90%));}

.tit .tit-b {color: var(--white, #FFF);font-family: Pretendard;font-size: 50px;font-style: normal;font-weight: 600;line-height: 130%; /* 91px */text-transform: uppercase;}
.point {color: #368ad4 !important;}
.mint {color: #ade2d1 !important;}
.tit .tit-b img {width: 262px;}
.tit .tit-m {color: var(--white, #FFF);font-family: Pretendard;font-size: 24px;font-style: normal;font-weight: 500;line-height: 120%; /* 52px */text-transform: uppercase;}
.tit .tit-s {color: #7C7C7C;font-family: Pretendard;font-size: 16px;font-style: normal;font-weight: 500;line-height: 140%; /* 24px */margin-top: 6px;}


.product {max-width: 1440px;margin:0 auto;position: relative;width: calc(min(90rem, 90%));margin: 0 auto;/* min-height: 100vh; */column-gap: 80px;border-radius: 16px;display: flex;align-items: center;}
.product > div {flex: 1;}
.product > div span {text-transform: uppercase;letter-spacing: 1.5px;font-size: 1rem;color: #fff;width: 9px;height: 9px;}
.product > div h1 {text-transform: capitalize;letter-spacing: 0;font-weight: 900;font-size: clamp(3rem, 2.6rem + 0.75vw, 4rem);background-color: #fff;background-size: 100%;background-repeat: repeat;-webkit-background-clip: text;-webkit-text-fill-color: transparent;-moz-background-clip: text;-moz-text-fill-color: transparent;margin-bottom: 14px;line-height: 88%;padding: 0 0 12px 0;}

.product > div p {line-height: 130%;color: #ffffffc7;font-size: 18px;font-weight: 500;display: inline-block;word-break: break-all;}

.product a {display: inline-block;text-decoration: none;text-transform: uppercase;color: #333;font-weight: 500;background: #fff;border-radius: 3.125rem;transition: 0.3s ease-in-out;padding: 16px 32px;font-size: 16px;margin-top: 40px;}
.product a > img {display: inline-block;width: 18px;height: 18px;vertical-align: sub;}

.product .swiper {width: 100%;height: 100%;padding: 0 0 32px 0;display: flex;align-items: center;justify-content: center;}

.product .swiper-pagination-bullet {background: #fff;margin: 0 4px;opacity: 0.4;}
.product .swiper-pagination-bullet-active {opacity: 1;}
.product .swiper-pagination {bottom: 0.857rem !important;z-index: 999;right: 50%;transform: translate(50%, 50%);}
.product .swiper-slide {width: 18.75rem;height: 24.75rem;display: flex;flex-direction: column;align-items: center;justify-content: center;border-radius: 16px;overflow: hidden;}
.product .swiper-slide h2 {color: #fff;font-weight: 400;font-size: 1.4rem;line-height: 1.4;margin-bottom: 0.625rem;}
.product .swiper-slide p {color: #dadada;font-weight: 300;font-size: 0.75rem;display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;overflow: hidden;}

.product .swiper-slide.swiper-slide-active {/* transform: scale(1.2) !important; */  }
.product .swiper-slide.swiper-slide-active .swiper-slide-shadow-right {display: none;}
.product .swiper-slide.swiper-slide-active .swiper-slide-shadow-left {display: none;}

.product .swiper-slide .iframe {width: 100%;height:100%;position:relative;}
.product .swiper-slide .iframe iframe {width: 100%;height:100%;}

.product .swiper-slide a {font-size: 0.9rem;}
.product .swiper-slide a:hover {color: #005baa;}
.product .swiper-slide div {display: none;opacity: 0;}

.product .swiper-slide-active div {display: block;opacity: 1;padding: 10px 32px 40px 32px;}

.product .swiper-button-prev,
.product .swiper-button-next {background: #ffffffb3;border-radius: 50px;width: 32px;height: 32px;}
.product .swiper-button-next:after,
.product .swiper-button-prev:after {font-size: 18px;font-weight: 800;color: #000;}


/* 넥필 이미지 */
/* .product.neck-feel .swiper-slide--one {background: url("../images/neckfeel1.gif") no-repeat 50% 50% / cover;} */
/* .product.neck-feel .swiper-slide--two {background: url("../images/neckfeel2.gif") no-repeat 50% 50% / cover;} */
.product.neck-feel .swiper-slide--three {background: url("../images/neckfeel3.jpg") no-repeat 50% 50% / cover;}
.product.neck-feel video {height: 400px;}


/* 아이롱 이미지 */
/* .product.iron .swiper-slide--one {background: url("../images/iron_01.gif") no-repeat 50% 50% / cover;} */
.product.iron .swiper-slide--two {background: url("../images/iron_02.jpg") no-repeat 50% 50% / cover;}
.product.iron .swiper-slide--three {background: url("../images/iron_03.jpg") no-repeat 50% 50% / cover;}
.product.iron .swiper-slide--one > video {height: 405px;}

.iron.product {justify-content: space-between;}
.iron.product > div {flex: 1;max-width: max-content;}

img {width: auto;height:auto}
.product .swiper-3d .swiper-slide-shadow-left,
.product .swiper-3d .swiper-slide-shadow-right {background-image: none;}


/* 셀룰라 */
.cellula.product {justify-content: space-between;}
.cellula.product > div {flex: 1;}

.cellula.product .cellula_video {border-radius: 16px;overflow: hidden;}
.cellula.product .cellula_video .iframe {width: 100%;height:100%;padding:56.25% 0 0 0;position:relative;}
.cellula.product .cellula_video .iframe iframe {width: 100%;height:100%;}


/* 휴심 */
.husim.product {justify-content: space-between;}
.husim.product > div {flex: 1;}
.husim.product .husim_video {border-radius: 16px;overflow: hidden;}
.husim_video .iframe {width: 100%;height:100%;padding:56.25% 0 0 0;position:relative;}
.husim_video .iframe iframe {width: 100%;height:100%;}


/* 로켓 */
.rocket.product {justify-content: space-between;}
.rocket.product > div {flex: 1;}
.rocket.product .rocket_video {border-radius: 16px;overflow: hidden;}
.rocket_video .iframe {width: 100%;height:100%;padding:60.25% 0 0 0;position:relative;}
.rocket_video .iframe iframe {width: 100%;height:100%;}


/* 아이롱 이미지 */
.product.cat-item .swiper-slide--one {background: url("../images/cat-1.jpg") no-repeat 50% 50% / cover;}
.product.cat-item .swiper-slide--two {background: url("../images/cat-2.jpg") no-repeat 50% 50% / cover;}
.product.cat-item .swiper-slide--three {background: url("../images/cat-3.jpg") no-repeat 50% 50% / cover;}
.product.cat-item .swiper-slide--one > video {height: 405px;}


.catalog {}

.catalog .tit img {margin-bottom: 40px;}
.catalog .tit {border-bottom: 0;}
.catalog .tit .tit-m {margin: 12px 0;}

.catalog_btn_box {margin-top: 40px; display: flex;gap: 8px;align-items: center;justify-content: center;}

.catalog .catalog_btn {padding: 12px 24px;height: 30px;display: inline-block;background: #4a88d2;font-size: 18px;line-height: 30px;border-radius: 66px;font-weight: 600;}
.catalog .catalog_btn.insta {background: #313131;display: inline-flex;gap: 4px;}
.catalog .catalog_btn.insta img {margin: 0;width: 32px;}
.catalog .catalog_btn > span {color: #fff;-webkit-text-fill-color: #fff;}

#fp-nav ul li:last-child{display: none;}
footer {height: 160px !important;background-color:#333333;text-align: center;color: #888888;}
footer .footer_info {max-width: 1440px;width: calc(min(90rem, 90%));margin: 0 auto;line-height: 150%;}
footer .footer_logo {margin-bottom: 20px;display: inline-block;margin: 0 auto;text-align: center;margin-bottom: 12px;}
footer .qr-code {width: 100px;position: absolute;right: 40px;top: 50%;transform: translate(0, -50%);}


/* 디테일 공통 */
.content_detail {}
.content_detail.gray {background: #39ae82;}
.content_detail.iron {background: #181818;}
.content_detail.neck {background: #2a698f;}
.content_detail .box {text-align: center;padding: 110px 0 0 0;}

.content_detail .cellula.box {}
.content_detail .neck.box {}
.content_detail .iron.box {}

.content_detail .box .img-box {border-radius: 16px;overflow: hidden;box-shadow: 8px 18px 22px 1px #00000042;max-width: 860px;width: 100%;margin: 0 auto;display: flex;flex-direction: column;}


/* 상세공통 */
.subHeader {padding: 0 20px;width: calc(100% - 40px);height: 80px;background: #fff;position: fixed;top: 0;}
.sub_menu {display: flex;align-items: center;height: 100%;gap: 8px;max-width: 860px;margin: 0 auto;}

.sub_menu li {}
.sub_menu li:last-child {margin-left: auto;}

.sub_menu li a {font-size: 16px;font-weight: 500;display: flex;align-items: center;gap: 8px;background: #eaeaea;padding: 8px 12px;border-radius: 48px;}

.iron .sub_menu li.on a {background: #181818;}
.neck .sub_menu li.on a {background: #37688e;}

.sub_menu li.on a {background: #38ad7d;color: #fff;font-weight: 700;font-size: 16px;}
.sub_menu li a.home {background: transparent;gap: 4px;}
.sub_menu li a img {width: 24px;}


.go-top {display: none;position: fixed;bottom: 50px;right: 50px;z-index: 1000;background: #fff;border-radius: 50px;width: 50px;height: 50px;line-height: 50px;text-align: center;box-shadow: 1px 2px 5px 1px #b3b3b363;border: 1px solid #eaeaea;}
.go-top img {width:32px;line-height: 50px;vertical-align: middle;}


/* 워터마크 지우기 */
.fp-watermark {display: none;}

.popupLayer {display:none; position:fixed; top:0; left:0; width:calc(100% - 30px); height:100%; background:rgba(0,0,0,0.6); z-index:9999;padding: 0 15px;}
.popupLayerBox {position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);width: 100%;max-width: 320px;margin: 0 auto;background: #000;border-radius: 10px;text-align: center;box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);overflow: hidden;}
.popupInfo {position: relative;overflow: hidden;padding:177.78% 0 0 0}
.popupLayer .btn-box {display: flex;justify-content: space-between;align-items: center;padding:8px 16px;background:#fff;}
.popupLayer #closePopupBtn {padding:8px 16px; background:#007bff; color:white; border:none; border-radius:5px; cursor:pointer;}



@media (max-width: 1440px) {
  .product {column-gap: 40px;}
   nav {justify-content: flex-end;}
}

@media (max-width: 1200px) {  
    .blur {background: #000;filter: blur(0);}
  .mySwiper .swiper-slide.slider01 {background-position: bottom center;background-size: 70%;}
  .mySwiper .swiper-slide.slider02 {background-position: bottom center;background-size: 70%;}
  .mySwiper .swiper-slide.slider03 {background-position: bottom center;background-size: 70%;}
  .mySwiper .swiper-slide.slider04 {background-position: bottom center;background-size: 100%;}
  .mySwiper .swiper-slide.slider05 {background-position: bottom center;background-size: 100%;}
  .mySwiper .swiper-slide.slider06 {background-position: bottom center;background-size: 100%;}


  .tit .tit-b {font-size: 34px;}
  .tit .tit-b > img {width: 180px;}
  .tit .tit-m {font-size: 20px;margin: 16px 0;}
  .tit .tit-s {max-width: 800px;text-align: center;margin: 0 auto;}

  .fp-responsive .fp-is-overflow.fp-section:nth-child(1) {padding: 0 !important;}
  .fp-responsive .fp-is-overflow.fp-section  {padding: 80px 0 !important;}

  .tit {padding: 32px 24px;margin: 24px auto 50px;background: #00000038;border-radius: 16px;border: 0;box-shadow: 0 0 0 0 #000;text-align: center;}
  .product {flex-direction: column;}
  .product > div {flex: none;/* text-align: center; */max-width: 680px;}
  .product a {margin-top: 24px;margin-bottom: 40px;padding: 8px 24px;float: right;}
  .product a:after {content:'';display: block;clear: both;height:0;}
  .product .swiper {max-width: 680px;}
  
  .cellula.product {flex-direction: column-reverse;}
  .cellula.product .cellula_video {max-width: 700px;width: 100%;}

  .husim.product {flex-direction: column-reverse;}
  .husim.product .husim_video {max-width: 700px;width: 100%;margin-top: 40px;}
  
  .rocket.product {flex-direction: column-reverse;}
  .rocket.product .rocket_video {max-width: 700px;width: 100%;margin-top: 40px;}

  .product.cat-item .swiper {margin-top: 40px ;}

    .fp-responsive footer.fp-is-overflow.fp-section{height: 180px !important;min-height: 180px !important;padding: 0 !important;}
    footer .footer_info {text-align: left;}
    footer .footer_info .inner {padding-right: 150px;}
}

@media (max-width: 850px) {
  #menu li a {padding: 9px 8px;}
}

@media (max-width: 767px) {
    #menu {display: none !important;}
    #nav-icon {margin: 10px;width: 32px;height: 29px;position: absolute;top: 19px;right: 20px;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .5s ease-in-out;-moz-transition: .5s ease-in-out;-o-transition: .5s ease-in-out;transition: .5s ease-in-out;cursor: pointer;}

    #nav-icon span {display: block;position: absolute;height: 3px;width: 100%;background: #fff;border-radius: 9px;opacity: 1;left: 0;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-o-transition: .25s ease-in-out;transition: .25s ease-in-out;  }
    #nav-icon span:nth-child(1) {top: 0px;}  
    #nav-icon span:nth-child(2),#nav-icon span:nth-child(3) {top: 8px;}
    #nav-icon span:nth-child(4) {top: 16px;}  
    #nav-icon.open span:nth-child(1) {top: 18px;width: 0%;left: 50%; }  
    #nav-icon.open span:nth-child(2) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    }  
    #nav-icon.open span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    }
    #nav-icon.open span:nth-child(4) {top: 18px;width: 0%;left: 50%;  }

    .menu.open {}
    .menu.active #menu {display: flex !important;background: #181818;width: 100%;height: 100%;position: fixed;top: 0;overflow: hidden;flex-direction: column;padding-top: 80px;}
    .menu.active #menu li {margin: 0;}
    .menu.active #menu li a {padding: 19px 50px;font-size: 24px;}

    .mySwiper .swiper-slide.slider01 { background-position: bottom center;background-size: contain;}
    .mySwiper .swiper-slide.slider02 { background-position: bottom center;background-size: contain;}
    .mySwiper .swiper-slide.slider03 {background-position: bottom center;background-size: contain;}
    .mySwiper .swiper-slide-active .title {font-size: 40px;}
    .mySwiper .swiper-slide-active .description {font-size: 16px;}

    .mySwiper .swiper-box { display: none;}

    .catalog_btn_box {flex-direction: column;}
    .catalog_btn_box a {min-width: 240px;}
}


@media (max-width: 450px) {
    :root {--swiper-navigation-size: 20px;}
    .fp-responsive .fp-is-overflow.fp-section {padding: 40px 0 !important;}

    .tit {border: 0;width: calc(100% - 90px);margin: 20px 20px 40px 20px;}

    .tit .tit-b {font-size: 24px;}
    .tit .tit-b > img {width: 180px;}
    .tit .tit-m {font-size: 18px;margin: 12px 0;}
    .tit .tit-s {font-size: 14px;}

    .product > div h1 {font-size: clamp(2.5rem, 1.8rem + 0.75vw, 4rem);}

    .product > div p {font-size: 15px;}
    .product .swiper-slide {height: 13rem;}

   
    .catalog .catalog_btn {width: 80%;}

    footer .footer_info .inner {padding-right: 0;}
    .footer .qr-code {display: none;}

    .logo {left: 20px;width: 100px;}

    .subHeader {padding: 0 10px;width: calc(100% - 20px);}
    .sub_menu {        flex-wrap: wrap;
      gap: 4px;
      height: 70px;
      margin-top: 8px;}
    .sub_menu li.on a {font-size: 13px;}
    .sub_menu li a {font-size: 13px;}
    .sub_menu li:last-child a {padding: 0;}
    
}