body.overflow-hidden {
  /* when primary navigation is visible, the content in the background won't scroll */
  overflow: hidden;
}
/* -------------------------------- 

Main components 

-------------------------------- */

.cd-header {
  position: relative;
  background: #b18556;
  height:125px;
  z-index: 3;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: none;
}
@media only screen and (max-width: 768px) {
  .cd-header,.cd-primary-nav {
    display: block;
  }
}

.cd-logo {
  display: block;
  position: absolute;
  top: 50%;
  width: 50%;
  left: 25%;
  text-align: center;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.cd-logo img {
  width: auto;
  max-height: 80px;
}

.cd-secondary-nav {
  position: absolute;
  top: 50%;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 10em;
  /* hidden on small devices */
  display: none;
}
.cd-secondary-nav li {
  display: inline-block;
  margin-left: 2.2em;
}
.cd-secondary-nav a {
  display: inline-block;
  color: white;
  text-transform: uppercase;
  font-weight: 700;
}
.cd-sear {
  position: absolute;
  right: 25px;
  top: 0;
  height: 100%;
  width: 50px;
  text-align: center;
  background: url(../images/seto.png) no-repeat center center;
}
.cd-primary-nav-trigger {
  position: absolute;
  left: 25px;
  top: 0;
  height: 100%;
  width: 50px;
}
.cd-primary-nav-trigger .cd-menu-text {
  color: white;
  text-transform: uppercase;
  font-weight: 700;
  /* hide the text on small devices */
  display: none;
}
.cd-primary-nav-trigger .cd-menu-icon {
  /* this span is the central line of the menu icon */
  display: inline-block;
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  width: 30px;
  height: 2px;
  background-color: white;
  -webkit-transition: background-color 0.3s;
  -moz-transition: background-color 0.3s;
  transition: background-color 0.3s;
  /* these are the upper and lower lines in the menu icon */
}
.cd-primary-nav-trigger .cd-menu-icon::before, .cd-primary-nav-trigger .cd-menu-icon:after {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: white;
  right: 0;
  -webkit-transition: -webkit-transform .3s, top .3s, background-color 0s;
  -moz-transition: -moz-transform .3s, top .3s, background-color 0s;
  transition: transform .3s, top .3s, background-color 0s;
}
.cd-primary-nav-trigger .cd-menu-icon::before {
  top: -12px;
}
.cd-primary-nav-trigger .cd-menu-icon::after {
  top: 12px;
}
.cd-primary-nav-trigger .cd-menu-icon.is-clicked {
  background-color: rgba(255, 255, 255, 0);
}
.cd-primary-nav-trigger .cd-menu-icon.is-clicked::before, .cd-primary-nav-trigger .cd-menu-icon.is-clicked::after {
  background-color: white;
}
.cd-primary-nav-trigger .cd-menu-icon.is-clicked::before {
  top: 0;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}
.cd-primary-nav-trigger .cd-menu-icon.is-clicked::after {
  top: 0;
  -webkit-transform: rotate(225deg);
  -moz-transform: rotate(225deg);
  -ms-transform: rotate(225deg);
  -o-transform: rotate(225deg);
  transform: rotate(225deg);
}


.cd-primary-nav {
  /* by default it's hidden - on top of the viewport */
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background: #fff;
  z-index: 2;
  padding:125px 0 50px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  overflow: auto;
  /* this fixes the buggy scrolling on webkit browsers - mobile devices only - when overflow property is applied */
  -webkit-overflow-scrolling: touch;
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
  -webkit-transition-duration: 0.4s;
  -moz-transition-duration: 0.4s;
  transition-duration: 0.4s;
}
.cd-primary-nav li {
  font-size: 24px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-transform: capitalize;
  color: #575757;
  border-bottom: 1px #d8d8d8 solid;
}
.cd-primary-nav li > a {
  display:block;
  padding: 19px 6%;
  color: #575757;
}
.cd-primary-nav .cd-toplx {padding:26px 6%;}
.cd-primary-nav .cd-toplx i {display: inline-block;vertical-align: middle;line-height: 30px;}
.cd-primary-nav .cd-toplx span  {display: inline-block;vertical-align: middle;margin-left: 10px;}
.cd-primary-nav .cd-lang {padding:20px 6%;text-align: right;}
.cd-primary-nav .cd-lang .yl {float: left;}
.cd-primary-nav .cd-lang a {display: inline-block;margin-left: 20px;padding: 0;}
.cd-primary-nav .cd-banq {font-size: 16px;color: #9e9e9e;padding:80px 6% 40px;border-bottom: none;}
.cd-primary-nav .cd-link {padding:40px 6%;border-bottom: none;}
.cd-primary-nav .cd-link a {display: inline-block;background-color: #575757;color: #fff;font-size:21px;padding:6px 0;width: 180px;text-align: center;}
.cd-primary-nav .cd-pro > a{position: relative;}
.cd-primary-nav .cd-pro > a::after {content: "";right: 6%;top: 50%;width:34px;height: 18px;margin-top: -9px;background:url(../images/xjt.png) no-repeat center center;position: absolute;-webkit-transition:all ease-out 0.2s;transition:all ease-out 0.2s;}
.cd-primary-nav .cd-pro > a.isp::after {transform:rotate(180deg);-webkit-transform:rotate(180deg);}
.cd-proli {padding: 15px 4% 40px;display: none;}
.cd-proli .proli{float: left;width: 33.333%;padding: 0 2%;text-align: center;font-size: 0;}
.cd-proli .proli:first-child{text-align: left;}
.cd-proli .proli:last-child{text-align: right;}
.cd-proli .proli span{font-size:3vw;color: #949494;margin-right: 5px;display: inline-block;vertical-align: middle;}
.cd-proli .proli img {max-width: 100%;height: auto;}
.cd-modlx {background-color:rgba(0,0,0,.8);position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  z-index:99;
  overflow: auto;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.4s;
  -moz-transition-duration: 0.4s;
  transition-duration: 0.4s;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  }
.cd-modlx.mod-vis {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;}
.cd-modlx .cd-mlx {background-color: #fff;width:90%;padding:50px 0;margin:125px auto 20%;position: relative;transform:scale(0.8);-webkit-transform:scale(0.8);-webkit-transition-property: all;
  -moz-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.4s;
  -moz-transition-duration: 0.4s;
  transition-duration: 0.4s;}
.cd-modlx.mod-vis .cd-mlx{transform:scale(1);-webkit-transform:scale(1);}
.cd-modlx .cd-mlx .cd-close {position: absolute;right:20px;top: 20px;}
.cd-modlx .cd-mlx .cd-close img{max-width: 100%;height: auto;}
.cd-mod {text-align: center;background-color: #fff;padding-top:10px;}
.cd-wx {margin-top:50px;}
.cd-mod > img {max-width:100%;height: auto;}
.cd-mod .wnr {font-size:20px;color: #575757;margin-top: 20px;}
.cd-mod .wnr a {color: #575757;}
.cd-mod .inr {font-size:24px;color: #575757;display:table;width: 100%;table-layout: fixed;word-wrap: break-word;margin:30px 0;}
.cd-mod .inr .icen {vertical-align:middle; display:table-cell;}
.cd-mod .inr a {color: #575757;}
.cd-mod a.but {padding:12px 54px;display:inline-block;color: #575757;font-size: 23px; text-align:center;-webkit-transition:  all ease-out .3s;-moz-transition:  all ease-out .3s;transition:  all ease-out .3s;border: 1px #575757 solid;}

.cd-modsear {background-color:rgba(0,0,0,.8);position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  z-index: 99;
  overflow: auto;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.4s;
  -moz-transition-duration: 0.4s;
  transition-duration: 0.4s;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  }
.cd-modsear.mod-svis {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;}
.cd-modsear .cd-search {background-color: #fff;width:90%;padding:16% 1rem 30%;margin:125px auto 20%;position: relative;transform:scale(0.8);-webkit-transform:scale(0.8);-webkit-transition-property: all;
  -moz-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.4s;
  -moz-transition-duration: 0.4s;
  transition-duration: 0.4s;}
  .cd-modsear .cd-search::after {content: "";position: absolute;left: 0;bottom: 12%;background: url(../images/searbg.png) no-repeat center center;width: 100%;height:10px;background-size:contain;}
.cd-modsear.mod-svis .cd-search{transform:scale(1);-webkit-transform:scale(1);}
.cd-modsear .cd-search .cd-sclose {position: absolute;right:20px;top: 20px;}
.cd-modsear .cd-search .cd-sclose  img{max-width: 100%;height: auto;}
.cd-search h2{font-size:6vw;font-weight: normal;color: #575757;text-align: center;letter-spacing: 5px;}
.cd-search .m-inp{position: relative;margin-top: 20px;}
.cd-search .m-inp .inp{width: 100%;border: 1px #646464 solid;background-color: #fff;padding:4% 10px;padding-right: 16%; font-size: 5vw;color: #333;font-weight: normal;}
.cd-search .m-inp .sub{border: none;position: absolute;right: 0;top: 0;background: url(../images/mser.png) no-repeat center center;width:16%;height: 100%;}
.cd-search .m-dx {margin-top:8%;}
.cd-search .m-dx i {vertical-align: middle;padding-left: 10px;display: inline-block;font-style: normal;}
.cd-search input[type=checkbox] {visibility: hidden;width: 0;height: 0;display: none;}
.checkboxFive {float: left;width:29%;font-size:4vw;position: relative;margin: 2% 0;}
.checkboxFive.ml {margin-left:6.5%;}
.checkboxFive label {padding-left:26px;width: 100%;display: inline-block;}
.checkboxFive label::before {
            cursor: pointer;
             content: '';
            position: absolute;
            width: 20px;
            height: 20px;
            top: 50%;
            left: 0;
            background: #fff;
            margin-top:-10px;
            border: 1px solid #5b5b5b;
        }
.checkboxFive label::after {
            opacity: 0;
            content: '';
            position: absolute;
            width: 9px;
            height: 5px;
            background: transparent;
            top: 50%;
            left:5px;
            border: 3px solid #333;
            border-top: none;
            margin-top: -3px;
            border-right: none;
            -webkit-transform: rotate(-45deg);
            -moz-transform: rotate(-45deg);
            -o-transform: rotate(-45deg);
            -ms-transform: rotate(-45deg);
            transform: rotate(-45deg);
        }   
.checkboxFive input[type=checkbox]:checked + label:after {
            opacity: 1;
}
.cd-search .mszhu {color: #9e9e9e;font-size:3vw;margin-top: 10%;}


.cd-primary-nav.is-visible {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
}
@media (max-width:768px) {
.cd-proli .proli img {width: 50%;height: auto;}
}
@media (max-width:640px) {
.cd-primary-nav-trigger .cd-menu-icon {
  width:26px;
}
.cd-primary-nav-trigger .cd-menu-icon::before {
  top: -10px;
}
.cd-primary-nav-trigger .cd-menu-icon::after {
  top: 10px;
}
.cd-header {height:100px;}
.cd-sear {right: 15px;background-size:80%;}
.cd-logo img {max-height:50px;}
.cd-primary-nav {padding: 100px 0 40px;}
.cd-primary-nav li {font-size: 4vw;}
.cd-primary-nav li > a {padding: 5% 6%;}
.cd-primary-nav .cd-toplx {padding: 6% 6%;}
.cd-primary-nav .cd-lang {padding: 5% 6%;}
.cd-primary-nav .cd-banq {padding: 10% 6%;font-size:9px;}
.cd-primary-nav .cd-banq img {width: 12px;height: auto;}
.cd-primary-nav .cd-link{padding:0 6%;}
.cd-primary-nav .cd-link a {font-size: 4vw;}
.cd-primary-nav .cd-pro > a::after {background-size:70%;}
.cd-modlx .cd-mlx {padding:10% 0;margin: 100px auto 20%;}
.cd-modsear .cd-search {margin: 100px auto 20%;}
.cd-modlx .cd-mlx .cd-close,.cd-modsear .cd-search .cd-sclose {width:26px;}
.cd-proli {padding:3% 4% 6%;}
.cd-mod > img {width:66px;}
.cd-mod .inr {font-size: 4vw;margin: 5% 0;}
.cd-mod a.but {font-size: 4vw;padding:8px 48px;}
.cd-wx {margin-top: 10%;}
.cd-mod .wnr {font-size: 3.5vw;}
.cd-mod .wnr img {width:120px;height: auto;margin-bottom: 5px;}
}

@media (max-width:480px) {
.cd-primary-nav-trigger .cd-menu-icon {
  width:20px;
}
.cd-primary-nav-trigger .cd-menu-icon::before {
  top: -8px;
}
.cd-primary-nav-trigger .cd-menu-icon::after {
  top: 8px;
}
.cd-header {height:66px;}
.cd-sear {right: 15px;background-size: 60%;}
.cd-primary-nav {padding: 66px 0 30px;}
.cd-logo img {max-height:40px;}
.cd-primary-nav-trigger {left: 15px;}
.cd-proli .proli span {font-size: 12px;}
.cd-proli .proli{padding: 0 1%;}
.cd-proli .proli img {width:40%;height: auto;}
.cd-primary-nav .cd-lang a {margin-left: 10px;width:18%;}
.cd-primary-nav .cd-link a {width:120px;padding:2px 5px;}
.cd-search .m-inp .sub{background-size:80%;}
.checkboxFive {font-size:4vw;width: 32%;}
.checkboxFive.ml {margin-left: 2%;}
.cd-primary-nav .cd-banq {padding:14% 6%;}
.cd-primary-nav .cd-pro > a::after {background-size:50%;}
.cd-primary-nav .cd-lang img{max-width:100%;height: auto;}
.cd-primary-nav .cd-toplx img{width: 60%;height: auto;}
.cd-primary-nav .cd-toplx span {margin-left: 4px;}
.cd-mod > img {width:50px;}
.cd-modlx .cd-mlx .cd-close,.cd-modsear .cd-search .cd-sclose {width:20px;}
.cd-modlx .cd-mlx {margin:66px auto 10%;}
.cd-modsear .cd-search {margin:66px auto 10%;}
}