@charset "utf-8";

/********** common **********/
.siteHeaderOffset{display:block; width:100%; height:80px; flex:none;}

/********** popup **********/
.popup{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}
.haoPopup{position:fixed; inset:0; z-index:9999; display:none;}
.haoPopup[aria-hidden="false"]{display:block;}
.haoPopupDim{position:absolute; inset:0; background:rgba(0,0,0,.55); backdrop-filter:blur(2px);}
.popup{width:min(90vw,520px); overflow:hidden;}
.haoPopupImg{display:block; width:100%; height:auto; -webkit-user-drag:none; user-select:none;}
.today,.close{cursor:pointer;}


/***************************
** index
***************************/
/** mainBanner **/
.mainBanner {background:url('/img/mainBanner.jpg'); background-position:center; background-size:cover;}
.mainBannerBtn {background:linear-gradient(to right, #3DC4C1, #1D78BF);}
/** problem **/
.problem {background: radial-gradient(circle, #F1FCFA 0%, #FFFFFF 100%);}
/** about **/
.about {--about-slide-gap:32px; overflow:hidden;}
.aboutSlider {width:100%; overflow:hidden;}
.aboutSliderTrack {display:flex; width:max-content; animation:aboutMarquee 24s linear infinite; will-change:transform;}
.aboutSliderGroup {display:flex; align-items:center; flex:none; gap:var(--about-group-gap, var(--about-slide-gap)); padding-right:var(--about-group-gap, var(--about-slide-gap));}
.aboutSliderGroup.wg80 {--about-group-gap:80px;}
.aboutSlideItem {flex:none; white-space:nowrap;}
@keyframes aboutMarquee {
    from {transform:translateX(0);}
    to {transform:translateX(-50%);}
}
/** why **/
.why {background:url('/img/whyBg.jpg'); background-position:center; background-size:cover;}
.whyCnts {display:grid; grid-template-columns:repeat(3, 1fr);}
/** service **/
.serviceWrap {align-items:flex-start;}
.serviceWrap > * {min-width:0;}
.serviceTabButton {justify-content:flex-start; background:#fff; border:none; outline:none; appearance:none; cursor:pointer; transition:background .3s ease, box-shadow .3s ease;}
.serviceTabButton.is-active {background:linear-gradient(to right, #3DC4C1, #1D78BF); box-shadow:0 20px 40px rgba(29,120,191,.18);}
.serviceTabIconBox {width:0; margin-right:0; overflow:hidden; opacity:0; flex:none; transition:width .3s ease, margin-right .3s ease, opacity .3s ease;}
.serviceTabButton.is-active .serviceTabIconBox {width:24px; margin-right:16px; opacity:1;}
.serviceTabIcon {display:block; width:100%; height:auto;}
.serviceTabLabel {color:#26272b; transition:color .3s ease;}
.serviceTabButton.is-active .serviceTabLabel {color:#f7f8f8;}
.servicePanel {display:none;}
.servicePanel.is-active {display:block; animation:servicePanelFade .3s ease;}
.servicePanelImage {display:block; object-fit:cover;}
@keyframes servicePanelFade {
    from {opacity:0; transform:translateY(10px);}
    to {opacity:1; transform:translateY(0);}
}
/** who **/
.whoCnts {display:grid; grid-template-columns:repeat(5, 1fr);}
.whoCnt {box-shadow:0 0 8px #A2EDE6; aspect-ratio:1 / 1;}
/** review **/
.review {--review-slide-gap:24px; --review-card-width:432px; overflow:hidden;}
.reviewSlider {width:100%; overflow:hidden;}
.reviewSliderTrack {display:flex; width:max-content; animation:reviewMarquee 32s linear infinite; will-change:transform;}
.reviewSliderGroup {display:flex; flex:none; gap:var(--review-slide-gap); padding-right:var(--review-slide-gap);}
.reviewCnt {flex:none; width:var(--review-card-width); box-sizing:border-box; border:1px solid #D9DADE;}

@keyframes reviewMarquee {
    from {transform:translateX(0);}
    to {transform:translateX(-50%);}
}
/** contact **/
.contact {background:url('/img/contactBg.jpg'); background-position:center; background-size:cover;}
.contactBtn {background:linear-gradient(to right, #3DC4C1, #1D78BF);}
.contactServiceButton {background:#fff; color:#91949f; cursor:pointer; transition:background .3s ease, color .3s ease, border-color .3s ease;}
.contactServiceButton.is-active {background:#26272b; color:#f7f8f8; border-color:#26272b;}
.contactAddressSearchButton {cursor:pointer;}