@charset "utf-8";

/**********************
** header 
**********************/
header{border-bottom:1px solid #f7f8f8; top:0; left:0; transition: background-color 0.3s ease-in-out, backdrop-filter 0.3s ease-in-out, -webkit-backdrop-filter 0.3s ease-in-out; background: rgba(254,254,254,0.8);   -webkit-backdrop-filter: saturate(180%) blur(6px);
  backdrop-filter: saturate(180%) blur(6px)}
header.active{background:#fefefe;}
header.active .logo img{filter:invert(1)}
header.active a{color:#26272b}
header.active .toggle span{background:#26272b}

/**********************
** index 
**********************/
/** mainBanner **/
.mainBanner{background: url('/img/mainBanner.jpg')center ;background-size:cover}
.mainTit{font-size:100px; left:-60px;}
.mainTit span{left:60px; top:80px}
.mainBnrScroll{bottom:0dvh; left:50%; transform:translateX(-50%)}
.mainBnrScroll:after{content:''; display:block; width:2px; height:48px; background:#f7f8f8}
.scrollDown {bottom:0;}
.scrollLine {border-left:2px solid #FFF;}
.mainBanner p {text-shadow: 0px 0px 4px rgba(0,0,0,0.5);}
/** //mainBanner **/

/** abut **/
.abutCnt {border:10px solid #8BB8B5;   box-shadow: 0 0 16px 0 rgba(0,0,0,0.25);}

/** mainProduct **/
.mainProduct1{background:url('/img/mainProduct-001.jpg') }
.productSubTit {opacity:0.5;}
.mainProduct2{background:url('/img/mainProduct-002.jpg') }
.mainProduct3{background:url('/img/mainProduct-003.jpg') }
.mainProduct4{background:url('/img/mainProduct-004.jpg') }
.mainProduct{background-size:cover; background-position: 11% 50%;}
.productSubTit {text-shadow: 0px 0px 4px rgba(0,0,0,0.5);}
/** //mainProduct **/

/** reviews **/



/** review **/
.review {background:url('/img/reviewBg.jpg')center; background-size:cover;}


/** partner **/
.partner {background:url('/img/partnerBg.jpg')center; background-size:cover;}
.partnerSubTit {color:#26272B; opacity:0.1;}
.partnerSlider { overflow: hidden; }
.partnerSlider .swiper-slide img {display: block; max-width: 100%; height: auto; object-fit: contain;}/* 이미 이전에 적용하신 내용 유지 */
.partnerSlider .swiper-wrapper {transition-timing-function: linear !important;}
.partnerSlider .swiper-slide {display: flex;  align-items: center; justify-content: center;}
.partnerSlider .swiper-slide img {display: block; height: 100%; width: auto !important; max-width: 100%; object-fit: contain;}

  


/**********************
** subpage 
**********************/
.companyBanner{background:url('/img/companyBannerBg.jpg')center}
.productBanner{background:url('/img/productSubBanner.jpg')center; background-position:center; background-size:cover;}
.buyBanner{background:url('/img/contactBannerBg.jpg')center}
.subBanner{background-size:cover;}
.subTit{font-size:100px}

/**********************
** company 
**********************/
.companySubBanner {background:url('/img/companySubBanner.jpg')center; background-size:cover;}
.subBanner {background:url('/img/companyMain.jpg')center; background-size:cover;}
.historySubTxt {opacity:0.2;}
.historyLine {right: 50%; transform:translateX(50%);}
.historyboll1 {right: 50%; transform:translateX(50%);}
.historyboll2 {right: 50%; transform:translateX(50%); top:304px;}
.historyboll3 {right: 50%; transform:translateX(50%); top:628px;}
.historyboll4 {right: 50%; transform:translateX(50%); top:816px;}
.historyboll5 {right: 50%; transform:translateX(50%); top:966px;}
.historyboll6 {right: 50%; transform:translateX(50%); top:1118px;}
.historyboll7 {right: 50%; transform:translateX(50%); top:1270px;}

.historyCnt1 {left: 0%;}
.historyCnt2 {right:0%; top:304px;}
.historyCnt3 {left: 0%; top:628px;}
.historyCnt4 {right:0%; top:816px;}
.historyCnt5 {left: 0%; top:966px;}
.historyCnt6 {right:0%; top:1118px;}
.historyCnt7 {left: 0%; top:1270px;}

.companySubBanner p {text-shadow: 0px 0px 4px rgba(0,0,0,0.5);}
/**********************
** product 
**********************/
.productIteam{width:calc(50% - 12px)}

.productViewDetail{font-size:200px; left:0; bottom:0;}
.productViewImg > div:nth-child(2){margin:0 24px}
.productViewType.double{border-top:1px solid #b8bac1; border-bottom:1px solid #b8bac1}
.productViewType.double2{ border-bottom:1px solid #b8bac1}


/**********************
** product-001
**********************/
.mainProduct-001Banner {background:url('/img/mainProduct-001.jpg')center; background-position:11% 50%; background-size:cover;}
.product-001BgTxt {bottom:0%;}
/**********************
** product-002
**********************/
.mainProduct-002Banner {background:url('/img/mainProduct-002.jpg')center; background-position:11% 50%; background-size:cover;}

/**********************
** product-003
**********************/
.mainProduct-003Banner {background:url('/img/mainProduct-003.jpg')center; background-position:11% 50%; background-size:cover;}

/**********************
** product-004
**********************/
.mainProduct-004Banner {background:url('/img/mainProduct-004.jpg')center; background-position:11% 50%; background-size:cover;}


.letterSubBanner {background:url('/img/letterSubBanner.jpg')center; background-position:center; background-size:cover;}

/**********************
** contact 
**********************/
.contactForm input, .contactForm textarea{border:1px solid #d9dade}
.contactForm input::placeholder, .contactForm textarea::placeholder, select option:disabled{color:#91949f}
.contactForm select{background:url('https://stunningw.com/img/arrow.svg') no-repeat #f7f8f8 !important; background-position:94% center !important; border:1px solid #d9dade}
.contactForm textarea{width:100%; max-width:100%; box-sizing: border-box;}

.policyBtnBox input[type="checkbox"]{left:-9999px}
.policyBtnBox input[type="checkbox"] + label{cursor: pointer;}
.policyBtnBox input[type="checkbox"] + label:before{content:'';display:block; width:20px; height:20px; border:1px solid #d9dade; margin-right:8px}
.policyBtnBox input[type="checkbox"]:checked + label:after{content:'';display:block; position:absolute; left:8px; top:42%; transform:translateY(-50%) rotate(45deg); border:1px solid #26272b;
width:6px; height:10px; border-width:0 1px 1px 0 }
.policyBtnBox a{border-bottom:1px solid #5d606c}

/**********************
** letter 
**********************/
.letterTbl {border-top:2px solid #26272B; border-bottom:2px solid #26272B;}
.letterTbl tbody > tr {border-top:1px solid #D9DADE;}

/**********************
** letterWirte
**********************/
.letterInputBox {border:1px solid #91949F;}
::placeholder { color: #91949F; opacity: 1; }
input::placeholder, textarea::placeholder { color: #91949F; }
.contactBox input[type="checkbox"]{left:-9999px;}
.contactBox input[type="checkbox"] + label{cursor: pointer; }
/* 기본(OFF) 상태 */
.contactBox input[type="checkbox"] + label::before{content: "";display: inline-block;width: 20px; height: 20px;margin-right: 8px;background-image: url("/img/chkOff.svg");background-repeat: no-repeat;background-position: center;background-size: cover;transition: transform .2s ease, opacity .2s ease;}
.contactBox input[type="checkbox"]:checked + label::before{background-image: url("/img/chkOn.svg?v=1");}
.underLine {text-decoration: underline;text-decoration-thickness: 1px;text-decoration-color: currentColor;text-decoration-skip-ink: auto;}
.contactStyleNo {border:none !important;}


/**********************
** letterPass
**********************/
.letterPassBox {box-shadow:0 0 16px 0 rgba(0,0,0,0.05);}
.letterPassInputBox {border:1px solid #D9DADE;}

/**********************
** letterview
**********************/
.viewLine {border-bottom:1px solid #91949F;}
.viewBtn {border:1px solid #D9DADE; background:none;}
.viewBtn2 {border:1px solid #9091A0;}
.commentlist {border-top:1px solid #D9DADE;}
.btnBgNo {background:none;}
.letterMainTxt p>img {width:100%;}

/**********************
** brandStory
**********************/
.brandStory{background:url('/img/brandSubBanner.jpg')center center no-repeat; background-size:cover;}
.brandStoryInfo{background:url('/img/brandstoryBg.jpg')center center no-repeat; background-size:cover}

.brandIntroduceCnt{background:linear-gradient(to bottom, #463756, #805D5D); right:20px; bottom:-20px}
.brandIntroduceDetail{border:1px solid #fefefe}
.brandIntroduceDetail hr{border:1px solid #fff; border-width:1px 0 0 0 }


/**********************
** login 
**********************/
.loginBg {background:url('/img/mainProduct-004.jpg')center; background-position:center; background-size:cover;}

/**********************
** policy
**********************/
.policyTp{border-bottom:1px solid #26272b}

/**********************
** footer 
**********************/
footer{border-top:1px solid #eeeef0}
.footMenu .footMenuA{border:1px solid #5d606c; border-width:1px 1px 1px 1px}
.footMenu .footMenuA:nth-child(2){border-width:1px 1px 1px 0}
.footerLogo{filter: invert(1);}