@font-face{
  font-family: 'Montserrat';
  src: url('./../../font/Montsarret/Montserrat-Regular.ttf');
  font-weight: 400;
}
@font-face{
  font-family: 'Montserrat';
  src: url('./../../font/Montsarret/Montserrat-SemiBold.ttf');
  font-weight: 600;
}
html,body,div,object,iframe,applet,object,h1,h2,h3,h4,h5,h6,p,blockquote,pre,address,dl,dt,dd,ol,ul,li,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,menu,nav,output,ruby,section,summary,time,mark,audio,video,progress,h1,h2,h3,h4,h5,h6{margin:0;padding:0;border:0;vertical-align:baseline;box-sizing: border-box;}
li{list-style:none}
article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}
audio,canvas,progress,video{display:inline-block}
audio:not([controls]){display:none;height:0}
[hidden],template{display:none}
a{background-color:transparent;text-decoration:none;color:#333;}
a:active,a:hover{outline:0}
abbr[title]{border-bottom:1px dotted}
b,strong{font-weight:bold}
dfn{font-style:italic}
/* h1{font-size:2em;margin:.67em 0} */
mark{background:#ff0;color:#000}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sup{top:-0.5em}
sub{bottom:-0.25em}
img{border:0}
svg:not(:root){overflow:hidden}
figure{margin:1em 40px}
hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}
pre{overflow:auto}
code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}
button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0;outline:none;line-height:normal}
button{overflow:visible}
button,select{text-transform:none}
button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}
button[disabled],html input[disabled]{cursor:default}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
input{line-height:normal}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}
input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}
input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}
input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}
legend{border:0;padding:0}
textarea{overflow:auto}
optgroup{font-weight:bold}
table{border-collapse:collapse;border-spacing:0}
td,th{padding:0}
html,body{
    width: 100%;
    min-width: 1200px;
}
html {  
    overflow-x: auto;  
    overflow-y: scroll;  
}
* {
  font-family: 'Montserrat', 'SF Pro Display', 'Helvetica Neue', 'Helvetica, Arial', 'sans-serif' !important;
  font-style: normal !important;
}

.clearfix:before,.clearfix:after {
    content: "";
    display: block;
    clear: both;
}

.two-line-ellipsis{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.ellipsis{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 头部样式 */
.header{
    position: fixed;
    left: 0;
    top: 0;
    display: flex;
    width: 100%;
    height: 60px;
    line-height: 60px;
    padding: 0 calc(50% - 600px);
    font-size:16px;
    background: #fff;
    backdrop-filter: blur(30px);
    z-index: 1000;
}
.head-and-banner .header{
    height: 60px;
    /* background-color:transparent; */
    /* box-shadow: none; */
}
.header:hover{
    background-color: #fff!important;
}
.header .logo{
    display: flex;
    align-items: center;
    height: 16px;
    margin: 22px 240px 0 0;
    font-size: 30px;
    font-weight: 600;
    color: #FC4B42;
    cursor: pointer;
}
.header .nav{
    flex: 1;
}

.header .nav .nav-list{
    display: flex;
    justify-content: flex-end;
}
.header .nav-list .level1{
    padding: 0 20px;
    position: relative;
}

.header .nav-list .level1 > a{
    display: inline-block;
    height: 60px;
    line-height: 60px;
    font-weight: 400;
    font-size: 15px;
    color: #757575;
    white-space: nowrap;
}
.header:not(:hover) .nav-list .level1.choosed a{
    color: #FC4B42;
    /* white-space: nowrap; */
    /* border-bottom: 4px solid #FC4B42; */
}
.header .nav-list .level1:hover a{
    /* white-space: nowrap; */
}
.header .nav-list .level1:hover > a{
    color: #FC4B42;
    /* border-bottom: 4px solid #FC4B42; */
}
.header .level1 .sub-nav-list{
    display: none;
    position: absolute;
    left: 0;
    top: 60px;
    width: 213px;
    padding: 12px 10px;
    background: #FFFFFF;
    box-shadow: 0px 4px 50px rgba(0, 0, 0, 0.11);
    border-radius: 12px;
    z-index: 1000;
}
.header .level1 .sub-nav-list .level2{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size:14px;
    font-weight:400;
    line-height:48px;
    color:rgba(51,51,51,1);
}
.header .level1 .sub-nav-list .level2 a{
    display: block;
    width: 100%;
    padding-left: 20px;
}
.header .level1 .sub-nav-list .level2:hover{
    background: #F5F5F5;
    border-radius: 6px;
}
.header .level1:hover .sub-nav-list{
    display: block;
}

.header .btns{
    display: flex;
}

.header .btns .search{
    text-align: center;
    padding: 0 30px;
    cursor: pointer;
}
.header .btns .search:hover{
    background-color: rgba(238,238,238,1);
}
.header .search img{
    display: inline-block;
    width: 20px;
    height: 20px;
    vertical-align: middle;
}

.header .btns-search {
  position: fixed;
  top: 0;
  width: 0px;
}
.btns-search .btns {
  display: inline-block;
  background: #fff;
  float: right;
}
.btns-search .btnsW {
  display: inline-block;
  background: #fff;
  float: right;
}
.btns-search .search {
  padding: 0 5px 0 75px;
  cursor: pointer;
}
.header .search .close-img{
  display: inline-block;
  width: 30px;
  height: 30px;
  vertical-align: middle;
}
.btns-search .btns > input {
  border: 0;
  width: 0;
  padding-right: 0;
  transition: all 0.4s ease 0.15s;
}
.btns-search .btnsW > input {
  border: 0;
  width: 520px;
  padding-right: 230px;
  transition: all 0.4s ease 0.15s;
}
.btns-search .content {
  width: 0px;
  text-align: right;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}
.btns-search .sub-nav-list {
  line-height: 50px;
  background-color: #fff;
  display: none;
  width: 600px;
  position: absolute;
  text-align: left;
  padding: 0 0 25px 30px;
  left: 310px;
  top: 60px;
  z-index: 1005;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
  border-radius: 12px;
}
.btns-search .sub-nav-list span {
  font-size: 13px;
  color: #999999;
}
.btns-search .content:hover .sub-nav-list {
  display: block;
}

.header .btns .store{
    height: 60px;
    padding: 0 30px;
    position: relative;
}
.header .btns .store > a{
    display: inline-block;
    padding-top: 5px;
}
.header .btns .store:hover{
    background:rgba(238,238,238,1);
}
.header .btns .store:hover .panel{
    display: block;
}
.header .store .store-icon{
    display: inline-block;
    width: 18px;
    height: 20px;
    text-align: center;
}
.header .store .panel{
    width: 160px;
    position: absolute;
    left: -24px;
    top: 60px;
    display: none;
    /* text-align: center; */
    background-color: #fff;
    z-index: 1000;
    box-shadow:0px 0px 10px rgba(0,0,0,0.1);
    /* padding: 10px 0; */
}
.header .store .panel .barcode{
    width: 120px;
    height: 120px;
    display: block;
    margin: 20px auto 7px;
}
.header .store .panel .row{
    line-height: 48px;
    display: flex;
    /* justify-content: center; */
    padding-left: 24px;
    justify-content: flex-start;
    align-items: center;
}
.header .store .panel .row:hover{
    background-color: rgba(238,238,238,1);
}
.header .store .panel .row img{
    width: 20px;
    height: 20px;
    margin-right: 8px;
}
.header .btns .lang{
    color: #333;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 25px;
    cursor: pointer;
    position: relative;
}
.header .btns .lang:hover{
    background-color: rgba(238,238,238,1);
}

.false-header{
    height: 60px;
    width: 100%;
}


/* 底部样式 */
footer{
    width: 100%;
    min-width: 1200px;
    background-color: #fafafa;
}
footer .main{
    width: 1200px;
    margin: 0 auto;
}
footer .main .logo{ 
    font-size: 30px;
    font-weight: 600;
    color: #FC4B42;
    padding: 56px 0 64px 0;
}
footer .main .box{
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}
footer .main .box ul{
    display: flex;
    justify-content: space-between;
}
footer .main .box ul li{
    margin-right: 64px;
}
footer .main .box ul li dt{
    font-size:14px;
    font-weight:bold;
    color:rgba(102,102,102,1);
    padding-bottom: 32px;
    white-space: nowrap;
}
footer .main .box ul li dd{
    font-size:14px;
    font-weight:400;
    color:rgba(153,153,153,1);
    padding-bottom: 16px;
    white-space: nowrap;
}
footer .main .box ul li dd a{
    color:rgba(153,153,153,1);
    display: flex;
    align-items: center;
}
footer .main .box ul li dd a img{
    margin-right: 5px;
    height: 18px;
    width: 18px;
}
footer .follow-us{
    position: absolute;
    right: 0;
    bottom: 16px;
    text-align: left;
}
footer .follow-us h3{
    font-weight: 600;
    font-size: 14px;
    color: #404040;
    margin-bottom: 15px;
}

footer .follow-us .form{
   position: relative;
}

footer .follow-us .form .link{
   position:absolute;
   top: 22px;
   right: 10px;
}

footer .follow-us .form #call_tips{
  display: none;
  position:absolute;
  bottom: 94px;
  left: 28px;
  width: 259px;
  padding: 15px 15px 15px 31px;
  font-weight: 400;
  font-size: 12px;
  line-height: 19px;
  color: #757575;
  background: #FFFFFF;
  border-radius: 10px;
}
footer .follow-us .form #call_tips::after{
  content: '';
  position:absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%); 
  transform: rotate(45deg); 
  width: 10px;
  height: 10px; 
  background: #fff;
}
footer .follow-us .form #call_tips img{
  position:absolute;
  left: 15px;
}
footer .follow-us .form #call_tips p{
  width: 205px;
  margin-left: 10px;
}

footer .follow-us input{
    width: 100%;
    height: 40px;
    background: #FFFFFF;
    padding-left: 10px;
    font-weight: 400;
    font-size: 13px;
    color: #121212;
    margin:12px 0 44px;
    border: 1px solid #BFBFBF;
    border-radius: 8px;
}
footer .follow-us input::-webkit-input-placeholder { /* WebKit, Blink, Edge */
  color:    #ADADAD;
  font-size: 13px;
}
footer .follow-us input:-moz-placeholder { /* Mozilla Firefox 4 ~ 18 */
 color:    #ADADAD;
 font-size: 13px;
}
footer .follow-us input::-moz-placeholder { /* Mozilla Firefox 19+ */
 color:    #ADADAD;
 font-size: 13px;
}

footer .follow-us input::-ms-input-placeholder { /* Microsoft Edge */
 color:    #ADADAD;
 font-size: 13px;
}

footer .follow-us input::placeholder { /* 大部分现代浏览器 */
 color:    #ADADAD;
 font-size: 13px;
}


footer .follow-us .platform-list a{
    display: inline-block;
    width: 40px;
    height: 40px;
}
footer .follow-us .platform-list a:not(:last-of-type){
    margin-right: 20px;
}
footer .follow-us .platform-list a img{
    width: 100%;
    height: 100%;
}
footer .follow-us .email{
    font-weight: 300;
    font-size: 14px;
    line-height: 17px;
    color: #999999;
}

footer .friend-links{
    padding: 10px 0;
    overflow: hidden;
}
footer .friend-links a{
    color: #f8f8f8;
    padding-right: 15px;
}


footer .barcodes{

}
footer .barcodes .bor-code-list{
    display: flex;
    align-items: center;
    margin-bottom: 42px;
}
footer .barcodes .bor-code-list img{
    width: 120px;
    height: 120px;
    margin-left: 40px;
}
footer .barcodes p{
    text-align: right;
    font-size:14px;
    font-weight:400;
    color:rgba(153,153,153,1);
    margin-bottom: 16px;
}
footer .copy-right{
    width: 1196px;
    height: 76px;
    line-height: 76px;
    margin: 0 auto;
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    color: #999999;
    border-top: 1px solid rgba(219,219,219,1);
}

.more-three-text{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    word-break: break-all;
}

.slide-block{
    position: absolute;
    bottom: 0;
    z-index: -1;
    width: 64px;
    height: 4px;
    color: #FC4B42;
    border-bottom: 4px solid #FC4B42;
    border-radius: 10px;
}
.slide-block.hide{
    display: none;
}

.contact-us-btn{
    position: fixed;
    right: 31px;
    bottom: 200px;
    z-index: 100;
    cursor: pointer;
}
.contact-service-btn{
  position: fixed;
  right: 31px;
  bottom: 286px;
  z-index: 100;
  cursor: pointer;
}
.contact-service-btn:hover + .contact_btn_tips{
  display: block;
}
.contact_btn_tips {
  display: none;
  position: fixed;
  right: 16px;
  bottom: 370px;
  width: 165px;
  height: 60px;
  padding: 14px;
  background: #FFFFFF;
  box-shadow: 0px 4px 11px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  z-index: 100;
  cursor: pointer;
}
.contact_btn_tips:after {
  content: '';
  position: absolute;
  right: 52px;
  bottom: -5px;
  width: 10px;
  height: 10px;
  background: #fff;
  transform: rotate(45deg);
  z-index: 100;
}
.contact_btn_tips p {
  font-weight: 600;
  font-size: 13px;
  line-height: 105.9%;
  color: #262626;
  margin-bottom: 7px;
}
.contact_btn_tips h4 {
  font-weight: 400;
  font-size: 13px;
  line-height: 105.9%;
  color: #757575;
}

/* toast提示 */
.toast-tip{
    position: fixed;
    left: 50%;
    top: 110px;
    transform: translateX(-50%);
    z-index: 3000;
    width: 260px;
    height: 40px;
    padding: 12px 16px;
    line-height: 22px;
    
    font-size: 14px;
    color: rgba(0, 0, 0, 0.65);
    background: #F6FFED;
    display: flex;
    align-items: center;
}
.toast-tip img{
    margin-right: 7px;
    width: 16px;
    height: 16px;
}

.dialog-wrap {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.2);
  z-index: 1002
}

.dialog-wrap .leave-msg-dialog{
  position: relative;
  width: 1000px;
  height: 584px;
  padding: 30px 40px;
  text-align: center;
  background: #FFFFFF;
  border-radius: 22px;
}
.dialog-wrap .leave-msg-dialog .close_img{
  position: absolute;
  top: 30px;
  right: 30px;
  width: 30px;
  cursor: pointer;
}
.dialog-wrap .leave-msg-dialog h3{
  font-weight: 600;
  font-size: 28px;
  color: #121212;
}
.dialog-wrap .leave-msg-dialog h4{
font-weight: 400;
font-size: 18px;
color: #121212;
margin: 10px 0 17px;
}
.dialog-wrap .leave-msg-dialog .form{
  padding: 10px 0 0;
}
.dialog-wrap .leave-msg-dialog .form .row-user{
  display:flex;
  justify-content: flex-start;
  color:#666;
  font-size:14px;
}
.dialog-wrap .leave-msg-dialog .form .row-user .form-item{
  position: relative;
  padding-top: 20px;
  margin: 0 15px 0 0;
}
.dialog-wrap .leave-msg-dialog .form .form-item .tips{
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  line-height: 20px;
  padding-left: 20px;
  color: red;
}
.dialog-wrap .leave-msg-dialog .form .row-user .form-item ul {
  display: none;
  position: absolute;
  top: 70px;
  left: 0;
  width: 100%;
  padding: 12px 10px;
  background: #FFFFFF;
  box-shadow: 0px 4px 50px rgb(0 0 0 / 11%);
  border-radius: 12px;
  animation: down .3s ease-out;
  overflow: hidden;
}
@keyframes down {
  from {opacity: 0;}
  to {opacity: 1;}
}
.dialog-wrap .leave-msg-dialog .form .row-user .form-item ul li {
  font-size: 16px;
  font-weight: 400;
  line-height: 45px;
  color: rgba(51,51,51,1);
  overflow: hidden;
  white-space: nowrap;
  word-break: break-all;
  text-overflow: ellipsis;
  cursor: pointer;
  }
  .dialog-wrap .leave-msg-dialog .form .row-user .form-item ul li:hover {
  background: #F5F5F5;
  border-radius: 6px;
}
.dialog-wrap .leave-msg-dialog .form .row-user .form-item input {
  width: 296px;
  height: 50px;
  padding: 0 0 0 50px;
  color: #121212;
  background: #FFFFFF;
  border: 1px solid #D9D9D9;
  border-radius: 12px;
  box-sizing: border-box;
}
.dialog-wrap .leave-msg-dialog .form .row-user .form-item #problemType {
cursor: pointer;
}
.dialog-wrap .leave-msg-dialog .form .row-user .form-item .before {
position: absolute;
top: 37px;
left: 15px;
}
.dialog-wrap .leave-msg-dialog .form .row-user .form-item .after {
position: absolute;
top: 40px;
right: 20px;
}
.dialog-wrap .leave-msg-dialog .form .row-question{
  margin-top: 32px;
  color:#666;
  font-size:14px;
}
.dialog-wrap .leave-msg-dialog .form .row-question .form-item textarea{
  width: 918px;
  height: 162px;
  padding: 20px 30px;
  color: #121212;
  background: #FFFFFF;
  border: 1px solid #D9D9D9;
  border-radius: 12px;
  box-sizing: border-box;
  resize:none
}
.dialog-wrap .leave-msg-dialog .form .row-anwser-code{
  margin-top: 16px;
  color:#666;
  font-size:14px;
  display:flex;
  justify-content: space-between;
  align-items: flex-end;
}
.dialog-wrap .leave-msg-dialog .form .row-anwser-code .form-item input{
  width:195px;
  height:40px;
  background:rgba(245,245,245,1);
  color: #333;
  opacity:1;
  /* border:none; */
  margin-right: 16px;
}
.dialog-wrap .leave-msg-dialog .form .form-item .error-tip{
  color:red;
  font-size:14px;
  /* margin-top: 4px; */
  /* display: inline-block; */
  padding-left: 8px;
  display: none;
}
.dialog-wrap .leave-msg-dialog .form .form-item .error-tip.show-error-tip{
  display: inline-block;
}

.dialog-wrap .leave-msg-dialog .form .row-anwser-code .form-item .left-img{
  margin-top: 8px;
  display:flex;  
  justify-content: space-between;
  align-items: center;
}
.dialog-wrap .leave-msg-dialog .form .row-anwser-code .form-item .left-img img{
margin-right: 16px;
}
.dialog-wrap .leave-msg-dialog .form .row-anwser-code .form-item .left-img input{
  padding-left: 12px;
}
input,textarea{
  border: none;
}
.dialog-wrap .leave-msg-dialog .form input.error, .dialog-wrap .leave-msg-dialog .form textarea.error{
  border:2px solid rgba(252,75,66,1) !important;
}
.dialog-wrap .leave-msg-dialog .form .row-anwser-code .form-item #codeImgDialog{
  width:116px;
  height:40px;
  cursor: pointer;
}
.dialog-wrap .leave-msg-dialog .form .row-anwser-code .button{
display: flex;
align-items: center;
justify-content: center;
width: 157px;
height: 52px;
background: #FFFFFF;
border-radius: 42px;
border: 1px solid #e6e4e4;
opacity: 0.3;
cursor: pointer;
}
.dialog-wrap .leave-msg-dialog .form .row-anwser-code .button span{
margin: 0 20px 0 30px;
}
.dialog-wrap .leave-msg-dialog .form .row-anwser-code .form-item input{
width: 230px;
height: 43px;
background: #FFFFFF;
border: 1px solid #f6efef;
border-radius: 8px;
}
.dialog-wrap .leave-msg-dialog .form .row-anwser-code .right{
  display: flex;
  align-items: center;
}
.dialog-wrap .leave-msg-dialog .form .row-anwser-code .right .tip{
  display: flex;
  align-items: center;
  padding-right: 21px;
}
.dialog-wrap .leave-msg-dialog .form .row-anwser-code .right .tip.hide{
  display: none;
}
.dialog-wrap .leave-msg-dialog .form .row-anwser-code .right .tip span{
  padding-left: 8px;
  font-size:14px;
  font-family:Source Han Sans CN;
  font-weight:400;
}
.dialog-wrap .leave-msg-dialog .form .row-anwser-code .right .tip.successDialog span{
  color:rgba(52,199,36,1);
}
.dialog-wrap .leave-msg-dialog .form .row-anwser-code .right .tip.failDialog span{
  color:red;
}