@font-face {
  font-family: 'PoppinsRegular';
  src: url('../font/Poppins-Regular.woff');
}
@font-face {
  font-family: 'PoppinsMedium';
  src: url('../font/Poppins_Medium.woff');
}
@font-face {
  font-family: 'PoppinsSemiBold';
  src: url('../font/Poppins-SemiBold.woff');
}
@font-face {
  font-family: 'PoppinsLight';
  src: url('../font/Poppins-Light.ttf');
}
@font-face {
  font-family: 'SpectralLight';
  src: url('../font/CormorantGaramond-Medium.ttf');
}
@font-face {
  font-family: 'cg-i';
  src: url('../font/CormorantGaramond-Italic.ttf');
}
.pop-r {font-family: 'PoppinsRegular';}
.pop-m {font-family: 'PoppinsMedium';}
.pop-sb {font-family: 'PoppinsSemiBold';}
.pop-l {font-family: 'PoppinsLight';}
.spe-l {font-family: 'SpectralLight', 'fangsong', 'serif';;}
.serif {font-family: serif;}
:root {
  --primary-color: #545d18;
  --high-color: #e7ed49;
  --light-color: #f6f5ea;
}
* {box-sizing: border-box; -webkit-box-sizing: border-box; outline: none;}
html {scroll-behavior: initial;}
html, body {-webkit-text-size-adjust: none; overflow-x: hidden; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
html, body, input, select, input, textarea, button{font-weight: normal; font-family: 'PoppinsRegular', 'Arial';}
body {font-size: 17rem; line-height: 1.25; color: var(--primary-color); background-color: #fff; -webkit-overflow-scrolling: touch; }
h1, h2, h3, h4, h5, h6 {margin: 0; font-weight: 500;}
ul, dl, dd, p {margin: 0; padding: 0;}
ul {list-style: none;}
small {display: block;}
::-ms-clear, ::-ms-reveal, select::-ms-expand {display: none; } 
input, textarea, button {border: 0;}
select:focus, textarea:focus, input:focus {outline: none;}
textarea {resize: none;}
a {color: inherit; transition: all .3s;}
a:hover, a:active, a:link, a:visited, a:focus {text-decoration: none;}
a:focus, input:focus, p:focus, div:focus {-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
img {display: block; max-width: 100%; max-height: 100%;}

.weui-cell {padding: 10rem 15rem; position: relative; display: -webkit-box; display: -webkit-flex; display: flex;-webkit-box-align: center; -webkit-align-items: center; align-items: center;}
.weui-cell__bd {min-width: 1px; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1;}
.weui-cell__ft {text-align: right; color: #999999;}
.weui-flex {display: -webkit-box; display: -webkit-flex; display: flex;}
.weui-flex__item {-webkit-box-flex: 1; -webkit-flex: 1; flex: 1;}
.weui-input {width: 100%; background-color: transparent; font-size: inherit; font-weight: inherit; color: inherit; height: 1.41176471em; line-height: 1.41176471; -webkit-appearance: none;}
.weui-input::-webkit-input-placeholder {color: #cacaca;} 
.start {-webkit-box-align: start; -webkit-align-items: flex-start; align-items: flex-start;}
.middle {-webkit-box-align: center; -webkit-align-items: center; align-items: center;}
.end {-webkit-box-align: end; -webkit-align-items: flex-end; align-items: flex-end;}
.vmid {vertical-align: middle;}
.noborder {border: 0 !important;}
.nobefore::before, .noafter::after {display: none !important;}
.nowrap {white-space: nowrap;}
.ellipsis {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.line2 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; word-wrap: break-word;}
.line3 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; word-wrap: break-word;}
.auto {margin-left: auto; margin-right: auto;}
.row:after, .clearfix:after {display: block; clear: both; height: 0px; overflow: hidden; content: "\200B" }
.row, .clearfix {*zoom: 1;}
.imgfill {width: 100%; height: 100%; object-fit: cover;}
.toast {display: none; z-index: 90; top: 50%; left: 50%; padding: 10px 20px; min-width: 240px; font-size: 16px; text-align: center; color: #fff; background-color: rgba(0, 0, 0, .75); border-radius: 6px; transform: translate(-50%, -50%);}

::-webkit-scrollbar {width: 5px; background-color: rgba(84, 93, 24, .3);}
::-webkit-scrollbar-corner {background-color: rgba(0, 0, 0, 0);}
::-webkit-scrollbar-thumb {width: 5px; margin: 1px; border-radius: 4px; border: 0; background-color: var(--primary-color);}
::-webkit-scrollbar:horizontal {height: 5px; margin: 1px;}

.fleft {float: left;}
.fright {float: right;}
.rel {position: relative;}
.abs {position: absolute;}
.fixed {position: fixed;}
.tleft {text-align: left;}
.tright {text-align: right;}
.tcenter {text-align: center;}
.justify {text-align: justify;}
.overhide {overflow: hidden;}
.hand {cursor: pointer;}
.block {display: block;}
.iblock {display: inline-block;}
.hidden {display: none !important;}
.trans-3 {-webkit-transition: all .3s; transition: all .3s;}
.light {font-weight: 200;}
.regular {font-weight: 300;}
.bold {font-weight: 600;}
.mg0 {margin: 0 !important;}
.mt0 {margin-top: 0 !important;}
.ml0 {margin-left: 0 !important;} 
.mr0 {margin-right: 0 !important;}
.mb0 {margin-bottom: 0 !important;}
.pd0 {padding: 0 !important;}
.pt0 {padding-top: 0 !important;}
.pl0 {padding-left: 0 !important;}
.pr0 {padding-right: 0 !important;}
.pb0 {padding-bottom: 0 !important;}
.mt10 {margin-top: 10rem;}
.mt30 {margin-top: 30rem;}
.mt40 {margin-top: 40rem;}
.mt100 {margin-top: 100rem;}

.f10 {font-size: 10rem;}
.f12 {font-size: 12rem;}
.f14 {font-size: 14rem;}
.f15 {font-size: 15rem;}
.f16 {font-size: 16rem;}
.f17 {font-size: 17rem;}
.f18 {font-size: 18rem;}
.f20 {font-size: 20rem;}
.f22 {font-size: 22rem;}
.f24 {font-size: 24rem;}
.f25 {font-size: 25rem;}
.f26 {font-size: 26rem;}
.f28 {font-size: 28rem;}
.f30 {font-size: 30rem;}
.f32 {font-size: 32rem;}
.f34 {font-size: 34rem;}
.f36 {font-size: 36rem;}
.f44 {font-size: 44rem;}
.f50 {font-size: 50rem;}
.f56 {font-size: 56rem;}
.f68 {font-size: 68rem;}
.f70 {font-size: 70rem;}

.white {color: #fff;}
.gray333 {color: #333;}
.gray666 {color: #666;}
.gray999 {color: #999;}
/* .wrapper {padding-top: 70rem;} */
.container-fluid {padding-left: 0; padding-right: 0; width: 83.6%;}
.container {padding-left: 0; padding-right: 0; width: 70.5%;}
.hfill {height: 100vh;}
.bgcover {background-repeat: no-repeat; background-position: 50% 50%; background-size: cover;}
.imgbox {position: relative; overflow: hidden;}
.imgbox:not(.autoh) img {margin-left: auto; margin-right: auto; max-width: none; max-height: none; width: 100%; height: 100%; object-fit: cover;}
.imgani {transition: all .8s;}
.imgani:hover {transform: scale(1.1);}
.overlay::before {position: absolute; display: block; content: ''; left: 0; right: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .6); transition: all .3s;}
.header {position: fixed; z-index: 999; top: 0; left: 0; right: 0; background-color: rgba(246, 245, 235, 0);}
.header .logo {left: 15rem; top: 50%; transform: translateY(-50%); transition: color .3s;}
.header .logo a {width: 450rem; height: 27rem;  background-image: url(../img/logo.png); background-repeat: no-repeat; background-position: center top; background-size: 100% 200%;}
.header.on, .wrapper .header {background-color: rgba(246, 245, 235, 1);}
.header.on .navbar > li, .wrapper .header .navbar > li {padding-top: 18rem; padding-bottom: 18rem;}
.header.on .navbar a, .wrapper .header .navbar a {color: var(--primary-color);}
.header.on .navbar a i, .wrapper .header .navbar a i {border-top-color: var(--primary-color); border-right-color: var(--primary-color);}
.header.on .smlogo a, .wrapper .header .smlogo a {background-position: center bottom;}
.header.on .smlogo small, .wrapper .header .smlogo small {display: none;}
.wrapper {padding-top: 101rem;}
.wrapper .header {height: 101rem;}
.wrapper .header .navbar {height: 100%;}
.navbar {margin-left: -15rem; margin-right: -15rem; padding: 0; transition: all .3s;}
.navbar .smlogo a {margin: 0 auto; width: 23.438vw; height: calc(23.438vw * (27 /450)); background-image: url(../img/logo.png); background-repeat: no-repeat; background-position: center top; background-size: 100% 200%;}
.navbar .smlogo small {margin: 20rem auto 0; width: 12.24vw; height: calc(12.24vw * (14 / 235)); background: url(../img/logo2.png) no-repeat center center; background-size: 100%;}
.navbar > li {position: relative; display: inline-block; padding: 50rem 0; transition: padding .5s;}
.navbar > li > a {display: block; padding: 20rem; color: #fff; text-transform: uppercase; letter-spacing: 1rem; transition: all .3s;}
.navbar > li > a i {position: relative; top: -2rem; margin-left: 8rem; display: inline-block; width: 10rem; height: 10rem; border-top: 2px solid var(--light-color); border-right: 2px solid var(--light-color); transform: rotate(45deg); transition: all .3s;}
.navbar > li.on .dropmenu {z-index: 11; pointer-events: all; opacity: 1; transform: translateY(0);}
.dropmenu {position: absolute; z-index: -1; left: 0; right: 0; top: 100%; background-color: var(--light-color); opacity: 0; pointer-events: none; transform: translateY(-10px); transition: all .5s;}
.dropmenu li {position: relative;}
.dropmenu a {display: block; padding: 7rem 17rem; color: #fff; text-transform: capitalize;}
.dropmenu .submenu {position: absolute; left: 100%; top: 0; background: var(--light-color); overflow: hidden; opacity: 0; pointer-events: none; transition: opacity .5s;}
.dropmenu li.on .submenu {opacity: 1; pointer-events: all;}
.mask {display: none; position: fixed; z-index: 1000; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, .5);}
.menubox {position: fixed; z-index: 1002; top: 0; right: 0; margin-right: 6%; height: 101rem; transition: background .3s .5s;}
.menubtn {position: absolute; top: 10rem; right: 0; width: 80rem; height: 80rem; cursor: pointer;}
.menubtn i {position: absolute; display: block; top: 50%; left: 50%; height: 3rem; width: 30rem; background: #fff; border-radius: 2px; transform: translate(-50%, -50%); transition: all .3s;}
.menubtn i:nth-child(1) {margin-top: -10rem;}
.menubtn i:nth-child(3) {margin-top: 10rem;}
.menubox.on {margin-right: 0; width: 60%; background: #fff;}
.menubox.on .menubtn {right: 7rem;}
.menubox.on i {background-color: #333;}
.menubox.on i:nth-child(2) {width: 0;}
.menubox.on i:nth-child(1) {margin-top: 0; transform: translate(-50%, -50%) rotate(45deg);}
.menubox.on i:nth-child(3) {margin-top: 0; transform: translate(-50%, -50%) rotate(-45deg);}
.footer > img {margin-top: -6rem; margin-left: auto;margin-right: auto;}
.footer .menu {left: 0; top: 15.5%; right: 0; margin-left: -40rem; margin-right: -40rem; text-align: center;}
.footer .menu li {display: inline-block; padding: 40rem 45rem;}
.footer .menu li a {color: var(--primary-color); text-decoration: underline; text-underline-offset: 10rem; transition: color .3s;}
.footer .copyright {left: 0; bottom: 60rem; right: 0; color: var(--high-color);}
.pagination {margin: 0 auto; padding: 2px 5px;}
.pagination .btn-prev::before, .pagination .btn-next::before {position: absolute; display: block; content: ''; top: 50%; width: 7rem; height: 7rem; border-left: 1px solid var(--primary-color); border-top: 1px solid var(--primary-color); transition: all .3s;}
.pagination .btn-prev::after, .pagination .btn-next::after {position: absolute; display: block; content: ''; top: 50%; width: 16rem; height: 1px; background: var(--primary-color); transform: translateY(-50%); transition: all .3s;}
.pagination .btn-prev::before {left: 5rem; transform: rotate(-45deg) translate(-30%, -100%);}
.pagination .btn-next::before {right: 5rem; transform: rotate(135deg) translate(-110%, -40%);}
.pagination .btn-prev::after {left: -2rem;}
.pagination .btn-next::after {right: -3rem;}
.pagination .pager, .pagination .pager a{display: inline-block;}
.pagination .pager i {display: inline-block; width: 1px; height: 14rem; background: #9FA47D;}
.pagination .pager a{padding: 0 15rem 0 9rem; color: var(--primary-color); transition: all .3s;}
.pagination .pager a.on {color: var(--high-color) !important;}
.pagination a.btn-prev, .pagination a.btn-next {padding: 0 26rem;}
