/* 重置样式 */
:root{
    --default-color: #104f2a;
    --font-color: #11192D;
    --font-color-2: #50607a;
    --font-color-3: #d2910e;
    --font-size-12: 0.75rem;
    --font-size-14: 0.88rem;
    --font-size-16: 1rem;
    --font-size-18: 1.125rem;
    --font-size-20: 1.25rem;
    --font-size-22: 1.38rem;
    --padding-4: 0.25rem;
    --padding-8: 0.5rem;
    --padding-12: 0.75rem;
    --padding-16: 1rem;
    --padding-24: 1.5rem;
    --padding-32: 2rem;
    --margin-4: 0.25rem;
    --margin-8: 0.5rem;
    --margin-12: 0.75rem;
    --margin-16: 1rem;
    --margin-24: 1.5rem;
    --margin-32: 2rem;
}
.lg-btn{width: 100%;line-height: 3rem;height: 3rem;background-color: var(--default-color);font-size: var(--font-size-16);font-weight: bold;text-align: center;cursor: pointer;color: #fff;border-radius: 0.55rem;}
.sd{box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.06);}

* {margin: 0;padding: 0;box-sizing: border-box;font-family: 'Segoe UI', 'Microsoft YaHei', sans-serif;}
html,body {min-height: 100%;color: #232323;line-height: 1.6;font-size: 16px;transition: all 0.3s ease;background-color: #f7f8fc;}
/* PC端：1920px及以上 */
@media screen and (min-width: 1920px) {
    html {font-size: 16px; /* 1rem = 16px */}
}
/* 平板端：768px-1199px */
@media screen and (min-width: 768px) and (max-width: 1199px) {
    html {font-size: 14px; /* 1rem = 14px */}
}
/* 手机端：767px及以下 */
@media screen and (max-width: 767px) {
    html {font-size: 12px; /* 1rem = 12px */}
}
/* 超小手机：375px及以下 */
@media screen and (max-width: 375px) {
    html {font-size: 10px; /* 1rem = 10px */}
}

a{color: var(--font-color);text-decoration: none;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);cursor: pointer;}
a:hover {text-decoration: none;color:var(--font-color);}
button,input,select,textarea {font-size: var(--font-size-14);margin: 0;padding: 0;outline: none;color: var(--font-color-2);}
textarea,input,select{resize: none;outline: none;padding: 0 1rem;box-sizing: border-box;}
textarea {resize: none;-webkit-appearance: none;}
ul,ol,li {list-style: none;}
i,em {font-style: normal;}
img{ border:none;}
.fl{float: left;}
.fr{float: right;}
.clearfix:before, .clearfix:after {content:"";display:table;}
.clearfix:after{clear:both;overflow:hidden;}
.clearfix{zoom:1;}
.clear{ clear:both;}
img{max-width: 100%;height: auto;}


.sd{box-shadow: 0 0 10px 3px rgba(0, 0, 0, 0.08);}
.ellip{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.m-ellips{display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;}
.mt{margin-top: var(--margin-24);}
.mask{width: 100%;height: 100%;position: fixed;top: 0;left: 0;z-index: 9998;background-color: rgba(0, 0, 0, .35);display: none;}
.card{width: 100%;border-radius: 0.625rem;background-color: #fff;box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.05);padding: var(--padding-16);box-sizing: border-box;}

/* 布局容器 */
.container {display: flex;flex-direction: column;min-height: 100vh;}
/* 固定头部 */
header{position: fixed;top: 0;width: 100%;z-index: 1000;border-bottom: solid 1px #dddddd;background-color: #fff;}
.header-container {width: 100%;max-width: 1200px;height: 5rem;margin: 0 auto;display: flex;align-items: center;}
.logo {font-size: 1.8rem;font-weight: 700;display: flex;align-items: center;}
.logo img {width: 5rem;height: 5rem;}
/* 导航菜单 */
.nav-menu {display: flex;margin-left: var(--margin-16);}
.nav-menu a {color: #5c5c5c;padding: 0 var(--padding-8);}
.nav-menu a:hover {color: var(--default-color);font-weight: bold;}
.nav-menu a.active {color: var(--default-color);font-weight: bold;}
.header-search{min-width: 0;flex: 1;margin-left: var(--margin-12);display: flex;align-items: center;padding: 0 var(--padding-8);box-sizing: border-box;border: solid 1px #e9eaeb;border-radius: 5px;overflow: hidden;}
.header-search img{width: 0.75rem;height: 0.75rem;}
.header-search input{min-width: 0;flex: 1;height: 1.5rem;line-height: 1.5rem;border: none;}
.more-nav{display: flex;align-items: center;}
.more-nav .item{margin-left: var(--margin-12);display: flex;align-items: center;}
.more-nav .item img{width: 1.125rem;height: 1.125rem;}
.more-nav .item span{margin-left: var(--margin-8);font-size: var(--font-size-12);color: #999999;}
.more-nav .item span:hover{color: var(--default-color);}

.lang-list{display: flex;align-items: center;margin-left: var(--margin-12);}
.lang-list .item{display: flex;align-items: center;cursor: pointer;}
.lang-list .line{padding: 0 var(--padding-8);font-size: var(--font-size-12);color: #999999;}
.lang-list .item img{width: 1.3rem;height: 1.3rem;margin-right: var(--margin-4);}
.lang-list .item span{font-size: var(--font-size-12);color: #999999;}
.lang-list .item:hover span{color: var(--default-color);}

.header-qrcode-popup{position: fixed;left: 0;top: 0;z-index: 9999;background-color: #fff;filter: drop-shadow(0 0 15px rgba(0, 0, 0, .08));padding: var(--padding-12) var(--padding-16);border-radius: 12px;width: 10rem;box-sizing: initial;display: none;}
.header-qrcode-popup::before{content: "";width: 0;height: 0;border-left: 8px solid transparent;border-right: 8px solid transparent;border-bottom: 12px solid #fff;position: relative;top: calc(var(--padding-12) - var(--padding-12) * 2 - 12px);left: 50%;z-index: 1;transform: translateX(-50%);display: block;}
.header-qrcode-popup .item{width: 100%;display: none;}
.header-qrcode-popup .item .text{width: 100%;font-size: var(--font-size-16);font-weight: bold;color: #2e2521;text-align: center;}
.header-qrcode-popup .item .tip{width: 100%;font-size: var(--font-size-12);color: #888888;text-align: center;}
.header-qrcode-popup .item .qrcode{width: 100%;margin-top: var(--margin-12);text-align: center;}
.header-qrcode-popup .item .qrcode img{width: 5rem;height: 5rem;display: inline-block;}
.header-qrcode-popup .item .call{width: 100%;height: 1.9rem;margin-top: var(--margin-16);display: flex;align-items: center;justify-content: center;background-color: var(--default-color);border-radius: 1rem;}
.header-qrcode-popup .item .call img{width: 1.18rem;height: 1.18rem;}
.header-qrcode-popup .item .call span{margin-left: var(--margin-12);font-size: var(--font-size-14);font-weight: bold;color: #fff;}



/* 移动端菜单按钮 */
.menu-toggle {display: none;background: none;border: none;color: var(--font-color);font-size: 2rem;cursor: pointer;margin-left: var(--margin-24);filter: drop-shadow(0, 0, 10px, 10px #000);}

.mobile-header-container-mask{position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.35);z-index: 998;display: none;}
.mobile-header-container{position: fixed;top: 0;right: 0;z-index: 999;transform: translateX(100%);background-color: #fff;width: 20rem;height: 100vh;padding: calc(5rem + var(--padding-32)) var(--padding-16) var(--padding-32) var(--padding-16);box-sizing: border-box;transition: all .5s ease;}
.mobile-header-container.active{transform: translateX(0);}
.mobile-nav-menu li{width: 100%;}
.mobile-nav-menu a {width: 100%;display: inline-block;line-height: 3rem;color: #5c5c5c;padding: 0 var(--padding-16);border-radius: 5px;}
.mobile-nav-menu a:hover {background-color: var(--default-color);color: #fff;}
.mobile-nav-menu a.active {background-color: var(--default-color);color: #fff;}
.mobile-lang-list{width: 100%;margin-top: 5rem;display: flex;align-items: center;justify-content: center;}
.mobile-lang-list .item{display: flex;align-items: center;cursor: pointer;}
.mobile-lang-list .line{padding: 0 var(--padding-8);font-size: var(--font-size-12);color: #999999;}
.mobile-lang-list .item img{width: 1.3rem;height: 1.3rem;margin-right: var(--margin-12);}
.mobile-lang-list .item span{font-size: var(--font-size-12);color: #999999;}


/* 主要内容区域 */
main {flex: 1;padding-top: 5rem !important;padding-bottom: var(--padding-32);max-width: 1200px;margin: 0 auto;width: 100%;}

/* 固定底部 */
footer {background-color: #f3f4f6;}
.footer-container{max-width: 1200px;margin: 0 auto;display: flex;align-items: center;padding: 3rem 0;}
.footer-base-info{width: 25%;display: flex;align-items: center;}
.footer-logo img{width: 6.5rem;height: 6.5rem;}
.footer-lang{width: 8.26rem;margin-left: var(--margin-24);}
.lang-dropdown{position: relative;width: 100%;}
.dropdown-header{width: 100%;height: 1.875rem;padding: 0 var(--padding-12);border-radius: 5px;background: #fff;cursor: pointer;display: flex;justify-content: space-between;align-items: center;}
.lang-dropdown .lang-box{display: flex;align-items: center;}
.lang-dropdown .lang-box img{width: 1.3rem;height: 1.3rem;}
.lang-dropdown .lang-box span{margin-left: var(--margin-8);font-size: var(--font-size-12);color: #666666;}
.dropdown-arrow{width: 1rem;height: 1rem;}
.dropdown-list{position: absolute;bottom: 100%;left: 0;right: 0;margin: 5px 0;padding: 0;border: 1px solid #ddd;border-radius: 5px;background: #fff;box-shadow: 0 2px 10px rgba(0,0,0,0.1);display: none;z-index: 1000;max-height: 200px;overflow-y: auto;}
.dropdown-list li{list-style: none;padding: var(--padding-4) var(--padding-12);cursor: pointer;}
.lang-dropdown.active .dropdown-list{display: block;}

.footer-currency{width: 100%;height: 1.875rem;padding: 0 var(--padding-12);border-radius: 5px;background: #fff;display: flex;align-items: center;margin-top: var(--margin-12);}
.footer-currency img{width: 1.3rem;height: 1.3rem;}
.footer-currency span{margin-left: var(--margin-8);font-size: var(--font-size-12);color: #666666;}

.footer-center{min-width: 0;flex: 1;text-align: center;}
.footer-center .links{width: 100%;text-align: center;}
.footer-center .links li{display: inline-block;padding: 0 var(--margin-24);border-right: solid 2px #969696;font-size: var(--font-size-14);font-weight: bold;line-height: 1;}
.footer-center .links li a{color: #969696;}
.footer-center .links li:last-child{border-right: none;}
.footer-center .copyright{width: 100%;text-align: center;margin-top: var(--margin-16);font-size: var(--font-size-12);color: #cacbce;}
.footer-center .copyright a{color: #cacbce;}
.footer-quick-links{width: 25%;display: flex;align-items: center;justify-content: flex-end;}
.footer-quick-links .ql-war .ql-header{font-size: var(--font-size-16);font-weight: bold;color: #969696;}
.footer-quick-links .ql-war .ql-list{display: flex;align-items: center;margin-top: var(--margin-8);}
.footer-quick-links .ql-war .ql-list li{margin-right: var(--font-size-12);}
.footer-quick-links .ql-war .ql-list li:last-child{margin-right: 0;}
.footer-quick-links .ql-war .ql-list li img{width: 1.75rem;height: 1.75rem;}

.pages{width: 100%;padding: var(--padding-24) 0;}
.pages .pagination{width: 100%;display: flex;align-items: center;justify-content: center;}
.pages .pagination li{border: solid 1px #eeeeee;background-color: #f3f4f6;border-radius: 0.5rem;margin: 0 var(--margin-4);box-sizing: inherit;font-size: var(--font-size-12);cursor: pointer;}
.pages .pagination li a, .pages .pagination li span{width: 1.875rem;height: 1.875rem;line-height: 1.875rem;text-align: center;display: inline-block;}
.pages .pagination li:hover, .pages .pagination li.active{background-color: var(--default-color);border-color: var(--default-color);color: #fff;}
.pages .pagination li:hover a, .pages .pagination li.active a{color: #fff;}
.pages .pagination li.disabled{background-color: #f3f4f6;color: #ccc;cursor: not-allowed;}
.pages .pagination li.disabled a{color: #888;}



.head-title{width: 100%;padding: var(--padding-24) 0;display: flex;align-items: center;cursor: pointer;}
.head-title img{width: 1rem;height: 1rem;}
.head-title span{margin-left: var(--margin-12);font-size: 1.375rem;font-weight: bold;}


@media (max-width: 1201px) {
    .header-container{padding: 0 var(--padding-12)}
    .nav-menu {display: none;position: absolute;top: 100%;left: 0;width: 100%;background-color: #2c3e50;flex-direction: column;padding: 1rem 0;}
    .more-nav .item{margin-left: var(--margin-12);}
    .lang-list{display: none;}
    .menu-toggle {display: block;}

    main {padding: 100px 15px 80px;}
    .footer-container{padding: var(--padding-8) var(--padding-12);}
}
@media (max-width: 993px) {
    .footer-container{flex-direction: column;align-items: center;}
    .footer-base-info{width: 100%;display: flex;align-items: center;justify-content: center;}
    .footer-center{width: 100%;margin-top: var(--margin-12);}
    .footer-quick-links{width: 100%;margin-top: var(--margin-12);justify-content: center;}
    .footer-quick-links .ql-war .ql-header{text-align: center;}
    .footer-quick-links .ql-war .ql-list{justify-content: center;}
}
@media (max-width: 576px) {
    .more-nav .item{margin-left: var(--margin-8);}
    main {padding: 90px 10px 70px;}
}