@charset "utf-8";

/**********************
** header 
**********************/
header{border-bottom:1px solid #f7f8f8; top:0; left:0; transition: ease-in-out 0.3s;}
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/mainBannerBg.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}
/** //mainBanner **/

/** mainProduct **/
.mainProductTit{font-size:100px}
.mainProductCta{width:fit-content; border-bottom:2px solid #f7f8f8}
.mainProduct .mainTit{left:-40px}
.mainProduct .mainTit span{left:40px; top:20px}

.mainProduct1{background:url('/img/productBanner3Bg.jpg')center }
.mainProduct2{background:url('/img/productBanner1Bg.jpg')center }
.mainProduct3{background:url('/img/productBanner2Bg.jpg')center }
.mainProduct4{background:url('/img/productBanner4Bg.jpg')center }
.mainProduct{background-size:cover}
/** //mainProduct **/

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

/**********************
** company 
**********************/
.companySub{line-height: 0;}

/**********************
** 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}
/**********************
** 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}

/**********************
** policy
**********************/
.policyTit{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);}