/* ====首页====== */
body{ background:#F7FBFD url(../images/top_bg.png) center top/100% auto no-repeat;}
/** header **/
.header{ position: relative; z-index:1000; }
.loarea{ height:96px; position:relative; z-index:3; background-color: rgba(255,255,255,.25); }
.loarea .wp{ width: 94%; max-width: 1400px; margin: 0 auto; display: flex; align-items: center;}
.logo{ width:380px; height:96px; display:flex; align-items:center; gap:0; overflow:hidden; }
.logo .tp{ height:88px; width:auto; max-width:100%; object-fit:contain; display:block; flex:0 0 auto; }
.logo .logo-text{
	display:inline-block;
	position: relative;
	top: 1px;
	padding: 2px 6px 2px 2px;
	max-width: 250px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 34px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: 1.2px;
	font-family: "STKaiti","KaiTi","STSong","Microsoft YaHei",sans-serif;
	color: #f5fbff;
	text-shadow: 0 2px 12px rgba(6, 84, 167, 0.45), 0 0 2px rgba(255,255,255,.45);
}
.navlogo{
	padding: 30px;
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:14px;
}
.navlogo .tp{
	max-width:66%;
	display:block;
}
.navlogo .navlogo-text{
	display:inline-block;
	font-size:28px;
	font-weight:800;
	line-height:1.1;
	letter-spacing:1.2px;
	font-family:"STKaiti","KaiTi","STSong","Microsoft YaHei",sans-serif;
	color:#f5fbff;
	text-shadow:0 2px 12px rgba(6, 84, 167, 0.45), 0 0 2px rgba(255,255,255,.45);
}
@supports ((-webkit-background-clip: text) or (background-clip: text)){
	.logo .logo-text,
	.navlogo .navlogo-text{
		background: linear-gradient(180deg,#f6fbff 0%,#8dd8ff 55%,#3aa9ff 100%);
		-webkit-background-clip: text;
		background-clip: text;
		color: transparent;
		-webkit-text-fill-color: transparent;
	}
}
.loginArea{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: clamp(6px, 0.8vw, 10px);
    flex: 0 1 auto;
    min-width: max-content;
    margin-left: auto;
    position: relative;
    font-size: 0;
}
.loginArea .loginBtn{ padding: 0.4em 1.4em; font-size: 20px;}

/* 已登录状态 */
.loginArea .avatar{ width: 44px; height: 44px; cursor: pointer;}
.loginInfoLay{ position: absolute; right: 0; width: 358px;  box-sizing: border-box; top: 56px; background-color: #fff; box-shadow:  0 0 6px 0 #ddd; padding: 15px 20px 0; display: none; }
.loginInfoLay .baseInfo{ padding: 14px 0; display: flex;}
.loginInfoLay .baseInfo .tp{ width: 55px; height: 55px; object-fit: cover; margin-right: 16px;}
.loginInfoLay .baseInfo .des{ flex: 1; min-width: 0;}
.loginInfoLay .baseInfo .des .tit{ font-size: 18px;}
.loginInfoLay .baseInfo .des .uid{ font-size: 15px; }
.loginInfoLay .baseInfo .des .uid .copyBtn{ cursor: pointer; color: #333;}
.loginInfoLay .baseInfo .des .uid .copyBtn:hover{ color: #007BFF;}
.vipInfo{ overflow: hidden; background: linear-gradient(180deg,#172840 0%,#101e33 100%); border: 1px solid rgba(86, 136, 209, .28);}
.vipInfo .intro{ padding: 15px 20px 20px; text-align: center;}
.vipInfo .intro .tit{ font-size: 18px; color: #dce9ff;}
.vipInfo .intro .subtit{ font-size: 14px; color: #9eb8dd; margin-top: 5px;}
.vipInfo .intro .mandiv{ margin-top: 15px;}
.vipInfo .intro .mandiv .sbtn{ background: linear-gradient(180deg,#2a4570 0%,#1f3659 100%); border: 1px solid rgba(112, 162, 242, .45); cursor: pointer; display: flex; justify-content: center; align-items: center;}
.vipInfo .intro .mandiv .sbtn .icon{ height: 22px; margin-right: 10px;}
.vipInfo .intro .mandiv .sbtn .val{ font-size: 16px; color: #e8f2ff;}
.vipInfo .intro .mandiv .sbtn:hover{ background: linear-gradient(180deg,#355889 0%,#2a4874 100%);}
.vipInfo .points{ background: linear-gradient(180deg,#1b2e4d 0%,#14243c 100%); border-top: 1px solid rgba(91, 142, 216, .25); font-size: 15px; padding: 12px 24px; display: flex; align-items: center; color:#cddffb; }
.vipInfo .points .icon{ height: 18px; margin-right: 10px;}
.vipInfo .points a{ color:#cddffb; }
.vipInfo .points .score{ margin-left: auto;}
.vipInfo .points.securityEntry{
    background: linear-gradient(180deg,#22385c 0%, #1a2d4d 100%);
    border-top: 1px solid rgba(109, 161, 238, .35);
}
.vipInfo .points.securityEntry a{
    color: #dbe9ff;
    font-weight: 600;
}
.vipInfo .points.securityEntry .score{
    color: #9eb9e3;
    font-size: 13px;
}
.vipInfo .points.securityEntry .icon{
    opacity: 1;
    filter: drop-shadow(0 0 3px rgba(88,153,255,.45));
}
.vipInfo .points.securityEntry:hover{
    background: linear-gradient(180deg,#22365a 0%, #1b2e4d 100%);
}
.loginInfoLay .exit{ font-size: 18px; cursor: pointer; text-align: center; padding: 1em 0;}
.loginInfoLay .exit:hover{ color: #007BFF;}
/*PC导航 begin*/
.nav{ z-index:5; flex:1; min-width:0; display:flex; align-items:center; justify-content:center; }
.navul{ font-size:0; display:flex; align-items:center; justify-content:center; flex-wrap:nowrap; white-space:nowrap; margin:0 auto; }
.navul li{ display:block; font-size:16px; position:relative; }
.rowLi{ position: static !important;}
.navul li>a{ padding:0 clamp(8px,0.9vw,16px); text-align:center; display:flex; align-items:center; justify-content:center; line-height:1; height:96px; position: relative; font-size: clamp(18px, 1.3vw, 24px); }
.navul li>a:hover,.act_nav{color:#007BFF !important;}

.chooseLan{ margin: 40px 0 0 40px; padding: 3px 8px; width: 80px; position: relative; cursor: pointer; background-color: #007BFF;}
.curLan{ color: #fff;  }
.curLan .iconCountry{ font-size: 16px; margin-right: 5px;}
.curLan .arr{ font-size: 16px; margin-left: 0px;}

.curLan .val{ font-size: 14px; text-transform: uppercase; }
.lanLay{ padding-top: 4px; position: absolute; left: 0px; top: 32px; display: none; width: 100%; }
.lanul{  border-top: 2px solid #007BFF; background-color: #fff;}
.lanul li{ }
.lanul li a{ display:block;padding: 5px 25px;  font-size: 12px; }
.lanul .icon{ margin-right: 10px;height: 12px; }
.lanul .val{font-size: 12px;}
.lanul a:hover{ color: #007BFF; background-color: #fafafa;}
.chooseLan:hover .lanLay{ display: block;}

/*PC导航end*/
.subnav{ position:absolute; display: none;  }
.subnavNormal{left:50%; margin-left: -60px; top:96px; width:120px;padding-top: 0px;}
.subnav:after{ content: ''; display: block; width: 0; height: 0; border: 8px solid transparent; border-bottom-color: #fff; position: absolute; top: -16px; left: 50%; margin-left: -6px; display: none;}
.subnav>.nr{background:rgba(0, 0, 0, .6); padding:10px 0; box-shadow: 0 2px 10px 0 #333; }
.subnav .nr a{text-align:left; line-height:2; padding: 6px 0; width:100%; font-size:13px; display:block;  color:#fff; text-align:center; }
.subnav .nr a:hover{ color: #fff !important; background-color: #D34F05; }

.subnavRow{ position: absolute; width: 100%; left: 0; top: 112px; padding-top: 0px; }
.subnavRow .wrap{ display: flex; align-items: center; justify-content: space-between;background:rgba(0, 0, 0, .6); padding:10px 0; box-shadow: 0 2px 10px 0 #333; }
.subnavRow .nr{ width: 100%; padding: 10px 20px; font-size: 0;}
.subnavRow .nr a{ display: inline-block; width:23%; margin: 0 1%; color: #fff; border-bottom: 1px dashed #fff; font-size: 13px; text-align: center; padding: 8px 0;}
.subnavRow .nr a:hover{ color: #fff !important; background-color: #D34F05;}


/*手机导航按钮及下拉菜单begin*/
.menubtn{ position:absolute; width:44px; min-width: 44px; height:44px; min-height: 44px; top:13px; right:2%; cursor:pointer; display:none; border:0; padding:0; background:transparent; z-index:214748302;}
.menubtn i{ display:block; width:22px; height:3px; left:11px; background-color:#000; position:absolute; -webkit-transition:.3s; -moz-transition:.3s; -o-transition:.3s; transition:.3s; border-radius: 2px;}
.menubtn i:nth-child(1){ top:12px; -webkit-transform-origin:left bottom; -moz-transform-origin:left bottom; -ms-transform-origin:left bottom; -o-transform-origin:left bottom; transform-origin:left bottom;}
.menubtn i:nth-child(2){ top:21px;}
.menubtn i:nth-child(3){ top:30px; -webkit-transform-origin:left top; -moz-transform-origin:left top; -ms-transform-origin:left top; -o-transform-origin:left top; transform-origin:left top;}
.menubtn.on i:nth-child(1){ -webkit-transform:rotate(40deg); -moz-transform:rotate(40deg); -ms-transform:rotate(40deg); -o-transform:rotate(40deg); transform:rotate(40deg);}
.menubtn.on i:nth-child(2){ opacity:0;}
.menubtn.on i:nth-child(3){ -webkit-transform:rotate(-40deg); -moz-transform:rotate(-40deg); -ms-transform:rotate(-40deg); -o-transform:rotate(-40deg); transform:rotate(-40deg);}
/*小导航*/
.inav{ width:min(84vw,360px); max-width: 360px; height: 100vh; overflow-y: auto; overflow-x:hidden; box-sizing:border-box; overscroll-behavior:contain; background-color:rgba(0, 0, 0, .92); position:fixed; z-index:214748300; top:0px; left:0; transform: translateX(-100%); visibility:hidden; pointer-events:none; display:block; transition: transform .22s ease, visibility .22s ease; will-change: transform; }
.inav.is-open,.mobile-nav-open .inav{ transform: translateX(0); visibility:visible; pointer-events:auto; }
html.mobile-nav-open,body.mobile-nav-open{ overflow:hidden; overflow-x:hidden; touch-action:none; max-width:100vw; }
body.mobile-nav-open .home-page-shell,body.mobile-nav-open .xl-home-layout{ overflow-x:hidden; max-width:100vw; }
body.mobile-nav-open .header{ z-index:214748301; }
body.mobile-nav-open .site-pet{ display:none !important; }
.mobile-nav-mask{ position:fixed; inset:0; z-index:214748299; display:block; border:0; padding:0; background:rgba(3,8,18,.48); opacity:0; cursor:pointer; transition:opacity .18s ease; }
.mobile-nav-mask.is-open{ opacity:1; }
.mobile-nav-mask[hidden]{ display:none !important; }
.inav ul{ margin: 0 20px; padding:0;}
.inavul li{border-bottom:1px solid #363636;}
.inavul li>a{ display:block; text-align:left;  font-size:14px; color:#fff; padding:15px 30px 15px 15px; position: relative;}
.inavul li>a .iconfont{ position: absolute; right: 0; top: 12px; font-size: 18px; }
.act_inav{ border-color: #007BFF !important; color:#007BFF !important;}
.act_inav .iconfont{ transform: rotate(90deg); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); }
.inavul .nr{ display: none; padding:5px 30px 5px 40px;}
.inavul .nr a{display:inline-block; text-align:left; padding: 4px 0; margin-right: 10px;  font-size:13px; color:#ddd;}
/*手机导航按钮及下拉菜单end*/
/*banner begin*/
.banner{ position:relative; z-index:3; }
.banner .swiper-slide{position:relative; overflow:hidden;}
.banimg{ width:100%; height:auto; display:block;}
.banner .swiper-pagination{ bottom:24px !important; display:flex; align-items:center; gap:10px; }
.banner .swiper-pagination-bullet{
width:20px;height:20px;padding:0;
background:rgba(10,14,24,0.72);
border:2px solid rgba(239,155,53,0.82);
border-radius:999px;
font-size:0;line-height:0;outline:none;cursor:pointer;
filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1; opacity: 1;
margin:0 8px !important;
box-shadow:0 0 0 1px rgba(0,0,0,0.24), 0 0 18px rgba(239,155,53,0.18), inset 0 1px 0 rgba(255,255,255,0.08);
}
.banner .swiper-pagination-bullet-active{
background:linear-gradient(180deg,#ffcf73 0%, #ef9b35 100%);
border-color:#ffd48a;
box-shadow:0 0 0 1px rgba(0,0,0,0.2), 0 0 22px rgba(255,196,92,0.42), inset 0 1px 0 rgba(255,255,255,0.28);
}
.banner .swiper-button-prev,.banner .swiper-button-next{ display: none;}
/* .banner .swiper-button-prev{ left:2%;}
.banner .swiper-button-next{ right:2%;} 

.banner .swiper-button-prev::after,.banner .swiper-button-next::after{ display: none;}
 .banner .swiper-button-prev,.banner .swiper-button-next{filter:alpha(opacity=40); -moz-opacity:0.4; -khtml-opacity: 0.4; opacity: 0.4;width:80px;  height:150px; line-height: 150px; top:50%; margin-top:-75px; color: #fff;}
.banner .swiper-button-prev .iconfont,.banner .swiper-button-next .iconfont{ font-size: 80px; font-weight: bold;}
.banner .swiper-button-prev:hover,.banner .swiper-button-next:hover{filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1; opacity: 1;} */
/*banner end*/
.footer{ padding: 40px 0; background-color: #fff; text-align: center; border-top: 1px solid #EEEEF1;}
.fnav{ font-size: 15px;}
.fnav a{ display: inline-block; padding: 0 1.2em; position: relative; color: #707070;}
.fnav a::after{ content: ""; display: block; width: 1px; height: 11px; position: absolute; background-color: #D9DDE1; right: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.fnav a:nth-last-child(1)::after{ display: none;}
.fnav a:hover{ color: #007BFF;}
.copyright{ color: #999999; margin-top: 10px;}
.copyright a{ color: #999;}
.copyright a:hover{ color: #333;}

.h_main{ padding: 30px 0;}
/* Override lib.css .wp 74% width constraint for homepage main area */
.h_main .wp{ width: 100% !important; }
.hm_l{ flex: 1 1 0; min-width: 0;}
.h_main .hm_l{ flex: 1 0 0 !important; min-width: 0; width: auto !important; max-width: none !important; }
.hm_r{ width: clamp(180px, 10vw, 220px); flex: 0 0 clamp(180px, 10vw, 220px);}
.h_tit2{ font-size: 20px; padding: 0.8em 0;}
.h_sales{ background-color: #fff; padding: 5px 22px 20px;}
.h_sales .wrap{}
.h_sales .wrap .tparea{ font-size: 0; overflow: hidden; position: relative; border-radius: 16px; height: 0; padding-top: 100%;}
.h_sales .wrap .tparea .tp{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; -webkit-transition: transform .35s ease; -moz-transition: transform .35s ease; -ms-transition: transform .35s ease; -o-transition: transform .35s ease; }
.h_sales .wrap .des{ padding: 10px 0;}
.h_sales .wrap .des .nr{ font-size: 16px; line-height: 1.6; text-align: justify;}
.h_sales .wrap .des .mandiv{ margin-top: 15px; text-align: center;}
.hm_r .h_sales .wrap .des .mandiv .sbtn{font-size: 14px;padding: 0.34em 1.2em;line-height: 1.2;}
.h_sales .tag{ margin-top: 8px; font-size: 16px; color: #C9C9C9;}



.h_tit{ padding: 22px 0; display: flex; align-items: center;  }
.h_tit .icon{ height: 62px; margin-right: 10px;}
.h_tit .des{ flex: 1; line-height: 1.2;}
.h_tit .des .tit{ font-size: 28px;}
.h_tit .des .tit .star{ height: 17px; margin-left: 12px; position: relative; top: -10px; height: 17px;} 
.h_tit .des .subtit{ color: #9CA0AF; margin-top: 6px;}
.hmPart{}
.hmPart .wrap{ display: flex; flex-wrap: wrap;}
.hmItem{ width: 32%; margin: 0 2% 2% 0;}
.hmItem:nth-child(3n){ margin-right: 0;}
.hmItem a{ display: flex; flex-direction: column; height: 100%; background-color: #fff; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; overflow: hidden;}
.hmItem .tparea{ font-size: 0; overflow: hidden; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px;  position: relative; height: 0; padding-top: 82%;}
.hmItem .tparea .tp{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; -webkit-transition: transform .35s ease; -moz-transition: transform .35s ease; -ms-transition: transform .35s ease; -o-transition: transform .35s ease; }
.hmItem .tparea .status{ font-size: 14px; display: inline-block; position: absolute; bottom: 0; z-index: 2; color: #fff; padding: 0.4em 1.4em;  background-color: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.3); }
.hmItem .tparea .statusOld{ left: 0; border-radius: 0 15px 0 0; -webkit-border-radius: 0 15px 0 0; -moz-border-radius: 0 15px 0 0; -ms-border-radius: 0 15px 0 0; -o-border-radius: 0 15px 0 0; }
.hmItem .tparea .statusNew{ right: 0 ; border-radius: 15px 0 0 0; -webkit-border-radius: 15px 0 0 0; -moz-border-radius: 15px 0 0 0; -ms-border-radius: 15px 0 0 0; -o-border-radius: 15px 0 0 0; }
.hmItem .des{ display: flex; flex-direction: column; justify-content: flex-start; min-height: 60px; padding: 10px 15px 10px 15px; position: relative; text-align: center;}
.hmItem .des .tit{ min-height: 1.35em; display: flex; align-items: flex-start; justify-content: center; font-size: 20px; line-height: 1.35; text-align: center; margin-top: 0; }
.hmItem .des .info{ min-height: 1.4em; display: flex; align-items: flex-start; justify-content: center; margin-top: 2px; color: #9F9F9F; line-height: 1.4; text-align: center; }
.hmItem .des .info:empty{ display: none; }
.hmItem .tparea .arr{ position:absolute; height:22px; left:50%; bottom:8px; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); z-index:3; }

.hmItem a:hover .des{box-shadow: 0px 7px 18px 0px rgba(0, 0, 0, 0.1);}
.hmItem a:hover .des .tit{ color: #007BFF}
.hmItem a:hover .tparea .arr{ left:50%; bottom:10px;}
.hmItem a:hover .tparea .tp{ transform: scale(1.06); -webkit-transform: scale(1.06); -moz-transform: scale(1.06); -ms-transform: scale(1.06); -o-transform: scale(1.06); }
.h_sales:hover .wrap .tparea .tp{ transform: scale(1.06); -webkit-transform: scale(1.06); -moz-transform: scale(1.06); -ms-transform: scale(1.06); -o-transform: scale(1.06); }

/* A9 global focus and motion baseline */
:root{
	--a9-focus-ring:#58a6ff;
	--a9-focus-shadow:rgba(88,166,255,.28);
	--a9-focus-inner:rgba(255,255,255,.18);
}

a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.sbtn:focus-visible,
.menubtn:focus-visible,
.mobile-nav-mask:focus-visible,
.navul li > a:focus-visible,
.inavul li > a:focus-visible,
.chooseLan:focus-visible,
.curLan:focus-visible,
.lanul a:focus-visible,
.loginArea .avatar:focus-visible,
.loginInfoLay .baseInfo .des .uid .copyBtn:focus-visible,
.banner .swiper-pagination-bullet:focus-visible,
.hmItem a:focus-visible,
.h_sales a:focus-visible,
.pagination a:focus-visible{
	outline:3px solid var(--a9-focus-ring);
	outline-offset:3px;
	box-shadow:0 0 0 6px var(--a9-focus-shadow), inset 0 0 0 1px var(--a9-focus-inner);
}

.sbtn,
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.loginArea .loginBtn,
.pagination a,
.pagination span{
	max-width:100%;
	line-height:1.25;
	overflow-wrap:anywhere;
	word-break:normal;
}

.menubtn,
.banner .swiper-pagination-bullet,
.loginArea .avatar,
.QQ dd .sp{
	touch-action:manipulation;
}

@media (prefers-reduced-motion: reduce){
	html:focus-within{
		scroll-behavior:auto;
	}

	.menubtn i,
	.inav,
	.mobile-nav-mask,
	.h_sales .wrap .tparea .tp,
	.hmItem .tparea .tp,
	.hmItem .tparea .arr,
	.banner .swiper-wrapper,
	.banner .swiper-slide,
	.ds-pending-spinner,
	.photo-canvas-loading__ring,
	.photo-canvas-loading__ring span,
	.photo-canvas-loading__bar span,
	.photo-history-item__spinner,
	.photo-history-pending::before,
	.photo-result-workspace::before,
	.animated.infinite,
	[class*="shine"],
	[class*="marquee"],
	[class*="float"],
	[class*="loading"]{
		animation:none !important;
		transition-duration:.01ms !important;
		transition-delay:0s !important;
	}

	.h_sales:hover .wrap .tparea .tp,
	.hmItem a:hover .tparea .tp,
	.hmItem a:hover .tparea .arr{
		transform:none !important;
	}
}
