body{font-size: 16px;} 
.inner{ width:1440px;   margin: 0 auto;  }
.pl-inner{ padding-left: calc((100vw - 1440px)/2);}
.pr-inner{ padding-right: calc((100vw - 1440px)/2);}
.ml-inner{ margin-left: calc((100vw - 1440px)/2);}
.mr-inner{ margin-right: calc((100vw - 1440px)/2);}
.h-40{height: 40px;}.w-40{ width: 40px;}
.h-50{height: 50px;}.w-50{ width: 50px;}
.h-60{height: 60px;}.w-60{ width: 60px;}

.idxBg{ background: url(../images/idxBg.jpg) no-repeat center top /100% 90%  ; margin-top: -100px;  }

.zwheader{ height: 100px;}
.zw { margin-top: -100px; padding-top: 100px;  }

header{ height: 100px; color: #fff;position: sticky; z-index: 100; top: 0; left: 0; right: 0; width: 100%;}
/* header .logoImg{ filter: grayscale(100%) brightness(500%); transition: all 0s; -webkit-filter: grayscale(100%) brightness(500%); -webkit-transition: all 0s; -moz-transition: all 0s; -ms-transition: all 0s; -o-transition: all 0s; } */
header.scroll{  box-shadow: 0 0 15px rgba(0, 0, 0, .15); background: #fff; color: #333;}
/* header.scroll .logoImg{ filter:none; -webkit-filter:none; } */
.search-tab-box .item{ border-radius: 3px; height: 34px; line-height: 34px; position: relative; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; }
.search-tab-box .item + .item{ margin-left: 5px;}
.search-tab-box .item::before{ display: none; content: ''; width: 0; position: absolute; left: 50%;top: 100%;
    height: 0;
    border-style: solid;
    border-width: 6px 6px 0;
    border-color: #FFFFFF transparent transparent;   }
.search-tab-box .item.active{ background: #fff; color: var(--color);}
.search-tab-box .item.active::before{display: block; }
.hotSearch span:last-child{ display: none;}
.hotSearch a:hover{ color: #fff;}
.logoImg{ height: 70px;}
header .icon01{ display: none;}
header.scroll .icon01{ display: block;}
header.scroll .icon02{ display: none;}


.idxLatestTit{ border: 2px solid #dae2fd; width: 80px; height: 80px; line-height: 1;}
.idxLatestSwiper,.idxLatestSwiper .swiper-slide{ height: 70px;}
.idxLatest .button>div{ height: 30px;}
.idxLatest .button>div:hover{ color: var(--color);}
.w10{ width: 10%;}

.idxList   li{ height: 5.5em;  color: #757c8c;}
.idxListTab li::after{ display: block; content: ''; width: 0; transition: all .36s; height:3px; position: absolute; left: 0; bottom: -1px; background:var(--orange) ; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.idxListTab li .circle{ background: #f3f7fa; width: 40px; height: 40px;  }
.idxListTab li.on{ background: #fff2ee; color: var(--orange);} 
.idxListTab li.on .circle{ background:  var(--orange);}
.idxListTab li.on .circle .idxListTabIcon{ filter: grayscale(100%) brightness(500%); -webkit-filter: grayscale(100%) brightness(500%); }
.idxListTab li.on::after{ width: 100%;}

.idxListTabIcon{ width: 50%; transition: all 0s; -webkit-transition: all 0s; -moz-transition: all 0s; -ms-transition: all 0s; -o-transition: all 0s; }
.idxList-tab-content .idxList-tab-item{ display: none;}
.idxList-tab-content .idxList-tab-item.idxList-show{ display: block;}
.idxNavUl{ display: grid; grid-gap: 15px; grid-template-columns: repeat(3,1fr);}
.idxNavUl li {min-width:0}
.idxNavUl li .tit{ border-left: 4px solid var(--color);}
.idxNavUl li .icon-youjiantou1 { font-size: .9em;}

.idxNewsUl{ display: grid; grid-gap: 40px; grid-template-columns: repeat(2,1fr);}
.idxNewsUl li {min-width:0}
.idxNewsUl li .time{ width: 5.8em; height: 5.8em;}


.footerTop{ background: url(../images/footerTopBg.jpg) no-repeat center center / cover;}
.ewmUl li .img{ width: 122px;}
.navlist li:last-child{ border-bottom: none;}
.navlist li .tit{ width: 6em;}
.navlist li .tit::after{ display: block; content: ''; width:2px; height: 100%; position: absolute; right: 0; top: 0; background:var(--color) }
.navlist li .center  { color: #293246; max-height: 70px; overflow: hidden;}
.navlist li .button .close{ display: none;}
.navlist li.on .button .open{ display: none;}
.navlist li.on .button .close{ display: flex;}
.navlist li.on .center{ max-height: none;}

.screenTit li{ height: 4.4em;}
.screenTit li::after{ display: block; content: ''; width:0; transition: all .36s; height: 3px; position: absolute; left: 0; bottom: -1px; background:var(--orange) ; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.screenTit li.on{ color: var(--orange);}
.screenTit li.on::after{ width: 100%;}

.commonTabCon  .item{ display: none;}
.commonTabCon  .item.on{ display: block;}

.screenItem .tit::after{ display: block; content: ''; width: 2px; height: 1em; position: absolute; right:   0; top: 50%; transform: translateY(-50%); background:#eeeeee ; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.screenItem .right .active{ background: var(--orange); color: #fff;}
select + .icon-xiajiantou{ position: absolute; right: 0; top: 50%;transform: translateY(-50%);}
.ml-0{ margin-left: 0 !important;}

.custom .layui-laypage a, .layui-laypage span{height:40px; font-size: 16px; padding: 0 20px;
    line-height: 40px;}
.custom .layui-laypage .layui-laypage-skip{height:40px;  line-height: 40px;}
.custom  .layui-laypage input,.custom .layui-laypage button{height:40px;  line-height: 40px;}
.custom   .layui-laypage .layui-laypage-curr .layui-laypage-em{ background: var(--orange);}

.inputWidht4{ width: 8em;}

.bg-jian{ background: url(../images/bg-jian.jpg) no-repeat center center / cover;}
.LoginMore{ border: 2px dashed #d0d5e0; background: url(../images/LoginMoreBg.jpg) no-repeat center center / cover;}

.openPackage{ background: url(../images/openPackageBg.jpg) no-repeat center center / cover; color: #90472d;}

.buttonClick:hover{ opacity: .8;}
.openPackage li.w30 + li.w30{ margin-top: 15px;}
.imgHeight{ height: 1em;}


.infoKefu{ position: absolute;  right: 100%;  top: 10vh; z-index: 6; width: 60px; }
.sharebox a{ width: 60px; height: 60px; }
.infoKefu>div{ margin-top: -20px; border-radius: 20px 0 0 20px; -webkit-border-radius: 20px 0 0 20px; -moz-border-radius: 20px 0 0 20px; -ms-border-radius: 20px 0 0 20px; -o-border-radius: 20px 0 0 20px; }

.loginBg{ background: url(../images/loginBg.jpg) no-repeat center top / cover;}
.loginBox{ max-width: 600px;}

 .login-tip {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
}
 .login-tip .code-text {
    background: url(/images/login_tips.png) no-repeat;
    background-size: cover;
    width: 120px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    color: #fff;
}
.login-tip img{ width: 100px;}
.loginBox .ewmBox{ width: 15vw; min-width: 150px}
.loginTit li.on{ color: var(--color); font-weight: bold;}

.aboutBg{ background: url(../images/aboutBg.jpg) no-repeat center top / 100% auto;}

.aboutIDtIT .line{ width: 2.3em; height: 3px;}
.aboutIDtIT .line2{ width: 1.6em; height: 2px;}

.aboutLeft{ width: 220px;}
.aboutRight{ width: calc(100% - 220px);}
.aboutNav{ position: sticky; right: 0; top: 100px;}
.aboutNav a{ line-height: 3.3;}
.aboutNav a.on{ color: var(--orange);}
.aboutNav a::after{ display: block; content: ''; width: 3px; height:0; position: absolute; right: -1px ; top: 50%; margin-top: -.8em; background:var(--orange) ; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.aboutNav a.on::after{ height: 1.6em;}

 
.loginBox  dl{ color: #333;   z-index: 999;}
.loginBox  dl {position: absolute; ;width: 180px; top:100%;background: #fff;left: 50%;margin-left: -90px;-webkit-box-shadow: 0 13px 10px 0px rgba(151, 150, 150, 0.22);box-shadow: 0  0px 10px  rgba(74, 33, 189, .15);border-bottom-left-radius: 5px;border-bottom-right-radius: 5px}
.loginBox  dl dd {height: 40px;  padding-left: 25px; transition: all .36s ease;-ms-transition: all .36s ease;-o-transition: all .36s ease;-webkit-transition: all .36s ease;-moz-transition: all .36s ease}
.loginBox  dl dd:last-child {border-bottom: 0}
.loginBox  dl dd a { color: #333  ;font-weight: normal ;transition: all .36s ease;-ms-transition: all .36s ease;-o-transition: all .36s ease;-webkit-transition: all .36s ease;-moz-transition: all .36s ease;display: block}
.loginBox  dl dd {  display: flex; align-items: center; }
.loginBox  dl .line{ width: 100%; background: #ccc; height: 1px; margin: 5px 0;}
.loginBox  dl dd img{ height: 15px; width: auto; margin-right: 15px; }
.loginBox  dl dd a:hover {color: var(--color) ; font-weight: bold;transform: translateX(6px);}
 
 
.loginBox dl{ pointer-events: none; visibility:hidden; opacity:0; filter:alpha(opacity=0); transform:  translateY(20px); -ms-transform:  translateY(20px); -o-transform:  translateY(20px); -webkit-transform:  translateY(20px); -moz-transform:  translateY(20px); transition:all .5s ease; -ms-transition:all .5s ease; -o-transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; }
.loginBox:hover dl{ pointer-events: auto; visibility:visible; opacity:1; filter:alpha(opacity=100); transform:translateY(0); -ms-transform:translateY(0); -o-transform:translateY(0); -webkit-transform:translateY(0); -moz-transform:translateY(0); }
 

.noBorder{ border: none !important;}
.headerForm .keys{ width: 24em;}

.adminLeft{ width: 300px;}
.adminRight{ width: calc(100% - 320px);}
.adminNav a .adminIcon{ width: 24px; filter: grayscale(100%); -webkit-filter: grayscale(100%); }
.adminNav a.on{ background: #f6f9fc; color: var(--color);}
.adminNav a.on .adminIcon{ filter: none; -webkit-filter: none; }

.adminRightTit{ position: relative;}
.adminRightTit h1::after{ display: block; content: ''; width: 3px; height: 1em; position: absolute; left: 0; top: 50%; margin-top: -.5em; background:var(--color) }

.admin-mobile{ position: fixed; bottom: 20px; left: 20px; z-index: 50;}

.adminNav{ position: sticky; left: 0; top: 110px;}

.pop{ width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 500; display: none;}
.pop .bg{ background: rgba(0, 0, 0, .4);}
.pop .con{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 15; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); }
.dyPop .con{ width: 90%; max-width: 1000px;}
 
.pop .close:hover{  color: red; transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); }


.myOrder table tr td{padding: 1.3em 0; padding-left: 2.5em; }
.myOrder table thead tr td{   color: #757c8c; background: #f6f9fc; font-weight: bold; white-space: nowrap;}
.myOrder table tbody tr td{ border-bottom: 1px solid #e5e5e5; font-size: 14px;}
.myOrder table tbody tr td .tit{ width:6em;}



.imgHeight2{ height:1.6em;}

.descriptionPop{display: none;  width: 400px; position: absolute;   right: 0; top:100%; box-shadow: 0 0 15px rgba(74, 33, 189, .15); z-index: 15;} 
.descriptionPop::before{ display: none; content: '';position: absolute; z-index: 15;width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 15px;
    border-color: transparent transparent #fff;    right:  15%; top: -15px; }
.descriptionHover:hover .descriptionPop::before,.descriptionHover:hover .descriptionPop{ display: block;}
.descriptionHover{  position: absolute; right: 0; top: 0;}

.invoiceType{ padding-left: 1.5em;}
.invoiceType li::after{ display: block; content: ''; width:0; height: 2px; position: absolute; left: 0; bottom: 0; background:var(--color) ; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.invoiceType li.on{ color: var(--color); font-weight: bold;}
.invoiceType li.on::after{ width: 100%;}

.invoiceInfo .myOrder table tr td{  padding-left: 1.5em; }

.sixteenItem .left::after{ display: block; content: ''; width: 4px; height: 1.2em; position: absolute; left: 0; top: 50%; margin-top: -0.6em; background:var(--color) }
.sixteenItem .right .tip{ position: absolute; top: 50%; right: 0; transform: translateY(-50%); z-index: 10; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }

.sixteenButton{ width: 180px;}
.userInfoTop .img{  width: 100px; height: 100px;}

.w15{ width: 15%;}
.phonePop .con, .pwdPop .con, .dataPop .con{ width: 90%; max-width: 500px;}

.memberBg{ background: url(../images/memberBg.png) no-repeat center top #fdf6f2 ; background-size: 100% auto; color: #90472d;}

.membershipUl li { flex: 1;}
.membershipUl li .membershipIcon{ height: 70px;}
.membershipUl li .tit{ height: 3.5em;}

.memberNum{ border: 1px solid #ffdbc0;}
.memberNum button{ background: #ffdbc0; }
.memberNum input{ width: 5em;}

.memberpayInfo ul{ margin: 1em 0; padding-left: 2em;}

.memberEwm{ width: 150px;}

@media screen and (min-width:900px) { .params-container {display: table;}
.param-item {display: table-row;}
.param-cell {display: table-cell;}}

.payType li{ border-color: #ffdbc0;}
.payType li.active{  border-color: var(--orange);}