/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:0;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}
/*==== global ====*/
html {min-width: 0 !important;}
body {background: #f3f3f3;}
#hdM, #bdM ,#ft-m {width: 100vw; overflow: hidden;}
ul, ol, ul li, ol li, dl, dl dd, dl dt, p {list-style: none; margin: 0; padding: 0; border: 0 none;}
a {
  color: #2a2a2a;
  text-decoration: none;
}
a.more {color: #b8b8b8; font-size: .8rem;}
.typo {overflow: scroll}

/*==== module&function ====*/
.row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: start;
  -ms-flex-align: start;
  -webkit-align-items: flex-start;
  align-items: flex-start;
}
.row > [class*="col-"] {box-sizing: border-box;}
.row .col-100 {width: 100%;width: -webkit-calc((100% - 16px*0) / 1);width: calc((100% - 16px*0) / 1);}
.row.no-gutter .col-100 { width: 100%;}
.row .col-80 {width: 80%; width: -webkit-calc((100% - 16px*0.25) / 1.25); width: calc((100% - 16px*0.25) / 1.25);}
.row.no-gutter .col-80 { width: 80%;}
.row .col-75 {width: 75%; width: -webkit-calc((100% - 16px*0.33333333333333326) / 1.3333333333333333); width: calc((100% - 16px*0.33333333333333326) / 1.3333333333333333);}
.row.no-gutter .col-75 { width: 75%;}
.row .col-66 {width: 66.66666666666666%; width: -webkit-calc((100% - 16px*0.5000000000000002) / 1.5000000000000002); width: calc((100% - 16px*0.5000000000000002) / 1.5000000000000002);}
.row.no-gutter .col-66 { width: 66.66666666666666%;}
.row .col-60 {width: 60%; width: -webkit-calc((100% - 16px*0.6666666666666667) / 1.6666666666666667); width: calc((100% - 16px*0.6666666666666667) / 1.6666666666666667);}
.row.no-gutter .col-60 { width: 60%;}
.row .col-50 {width: 50%; width: -webkit-calc((100% - 16px*1) / 2); width: calc((100% - 16px*1) / 2);}
.row.no-gutter .col-50 { width: 50%;}
.row .col-40 {width: 40%; width: -webkit-calc((100% - 16px*1.5) / 2.5); width: calc((100% - 16px*1.5) / 2.5);}
.row.no-gutter .col-40 { width: 40%;}
.row .col-33 {width: 33.333333333333336%; width: -webkit-calc((100% - 16px*2) / 3); width: calc((100% - 16px*2) / 3);}
.row.no-gutter .col-33 { width: 33.333333333333336%;}
.row .col-25 {width: 25%; width: -webkit-calc((100% - 16px*3) / 4); width: calc((100% - 16px*3) / 4);}
.row.no-gutter .col-25 { width: 25%;}
.row .col-20 {width: 20%; width: -webkit-calc((100% - 16px*4) / 5); width: calc((100% - 16px*4) / 5);}
.row.no-gutter .col-20 { width: 20%;}

i.icon {
  display: inline-block; 
  vertical-align: middle;
  background-size: 100% auto;
  background-position: center;
  background-repeat: no-repeat;
  font-style: normal;
  position: relative;
}

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.fast {
  -webkit-animation-duration: 800ms;
  animation-duration: 800ms;
}

.animated.faster {
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
}

/* card */
.card {
  margin: 16px; position: relative; 
  border-radius: 2px; font-size: 14px;
}
.row:not(.no-gutter) .col > .card { margin-left: 0; margin-right: 0;}
.card.card-bg {background: #fff;}
.card.card-pd {margin: 0; padding: 16px;}
.card-content {position: relative; }
.card-content-inner {padding: 16px; position: relative;}
.card-content-inner > p:first-child {margin-top: 0;}
.card-content-inner > p:last-child {margin-bottom: 0;}
.card.card-shadow {box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);}
.card .h {height: 8vw; line-height: 5vw; }
.card .h h3 {font-size: 1.2rem; margin: 0;}

.card .b .list li {
  line-height: 1.5; 
  display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; 
  -webkit-justify-content: space-between; justify-content: space-between;
}
.card .b .list li > a {font-size: 1rem; overflow: hidden; word-wrap: normal; white-space: nowrap; text-overflow: ellipsis;}
p.more {text-align: right;}

.f-mt1 {margin-top: 1rem;}
.f-mt2 {margin-top: 2rem;}
.tab-pane {display: none;}
.tab-pane.on {display: block;}
#bd.common .content .m-card h3 a {
  font-size: 1.2rem;
  line-height: 1.15;
}
.wd-m-page ul li a, .wd-m-page ul li span {
  font-size: .7rem;
  padding: 4px;
}

/*==== header ====*/
#hdM {height: 60px; background: #fff; overflow: visible;}
#hdM > .card {margin-top: 0; margin-bottom: 0;}
#hdM [class*="col-"] {
  height: 60px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}
#hdM .logo img {
  width: 100%; 
  height: -webkit-calc((100vw - 16px * 2) * 2 / 3 / 355 * 44); 
  height: calc((100vw - 16px * 2) * 2 / 3 / 355 * 44); 
  max-width: 355px;
  max-height: 44px; 
}
#hdM .menu {justify-content: flex-end;}
#hdM .menu .menu-btn {width: 5vw; height: 5vw;}
#hdM .menu .icon-menu {width: 5vw; height: 0px; border-bottom: 1px solid #000; position: relative;}
#hdM .menu .icon-menu::after,
#hdM .menu .icon-menu::before {
  position: absolute;
  content: "";
  width: 5vw;
  height: 0;
  border-bottom: 1px solid #000;
}
#hdM .menu .icon-menu::after {margin-top: -2vw;}
#hdM .menu .icon-menu::before {margin-top: 2vw;}
#hdM .menu ul.menu-list {
  position: fixed; 
  width: 100vw;
  height: 100vh;
  top: 0;
  right: 0;
  background: rgba(255, 255, 255, .96); 
  border-radius: 0 0 4px 4px;
  z-index: 99;
  display: none;
  overflow: scroll;
}
#hdM .menu ul.menu-list > li.top {
  height: 60px;
  line-height: 60px;
}
#hdM .menu ul.menu-list > li.top > a {font-weight: normal; margin-right: .2rem; font-size: 1rem;}
#hdM .menu ul.menu-list > li.top > a.close-btn {
  float: right;
  font-size: 3rem;
  font-weight: 400;
  color: #000;
  text-shadow: 0 1px 0 #FFF;
  opacity: 0.4;
}
#hdM .menu ul.menu-list > li {
  width: -webkit-calc(100vw - 32px);
  width: calc(100vw - 32px);
  padding: 0 16px;
  text-align: left;
  line-height: 2;
  border-top: 1px solid #d8d8d8;
  overflow: scroll;
}
#hdM .menu ul.menu-list > li > a {font-size: 1.1rem; font-weight: bold;}
#hdM .menu ul.menu-list > li dl {
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#hdM .menu ul.menu-list > li dd {
  width: 46%;
  height: 1.5rem;
  margin-bottom: .5rem;
  line-height: 1.5rem;
  text-align: center;
  font-size: .8rem;
  border: 1px solid #b8b8b8;
  border-radius: 2px;
}
#hdM .menu ul.menu-list > li dd a {
  width: 100%;
  height: 100%;
  display: inline-block;
}
#hdM .menu ul.menu-list > li dd:last-child {
  margin-bottom: .5em;
}

/* body */
#banner {width: 100vw; height: 30vw;}
/* #banner .bd, #banner ul li, #banner ul li a {display: block; width: 100vw; height: 30vw;} */
#banner .bd ul li {background-size: contain; background-position: center; background-repeat: no-repeat;}
#banner .hd {width: 100%; height: 4vw; line-height: 4vw; position: absolute; text-align: center; margin-top: -6vw;}
#banner .hd span {padding: 4px; margin: 0 4px; background: rgba(255, 255, 255, .5); display: inline-block; border-radius: 50%;}
#banner .hd span.on {background: #019be2;}

#bdM .module4 .hd {
  width: 100vw;
  height: 10vw;
  background: -moz-linear-gradient(left, #019be2, #85cb26);
  background: -webkit-linear-gradient(left, #019be2, #85cb26);
  background: -o-linear-gradient(left, #019be2, #85cb26);
  background: -ms-linear-gradient(left, #019be2, #85cb26);
  background: linear-gradient(left, #019be2, #85cb26);
}
#bdM .module4 .hd ul {
  width: 100%;
  height: -webkit-calc(10vw - 3px);
  height: calc(10vw - 3px);
  position: relative;
  top: 3px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}
#bdM .module4 .hd ul li{
  width: 25%;
  height: -webkit-calc(10vw - 6px);
  height: calc(10vw - 6px);
  line-height: -webkit-calc(10vw - 6px);
  line-height: calc(10vw - 6px);
  border-left: 1px solid #f3f3f3;
  text-align: center;
}
#bdM .module4 .hd ul li:first-child {border-left: 0 none;}
#bdM .module4 .hd ul li::after {
  position: absolute;
  left: 0;
  bottom: 0;
  content: "";
  width: 100%;
  height: 3px;
}
#bdM .module4 .hd ul li.on::after {
  background: #f3f3f3;
}
#bdM .module4 .hd ul li a {color: #fff; font-size: 1rem;}
#bdM .module4 .hd ul li.on {background: #f3f3f3;}
#bdM .module4 .hd ul li.on a {color: #407AE0;}
#bdM .module4 .bd .tab-pane .card-content-inner {height: 102px;}
#bdM .module4 .bd .card {
  width: -webkit-calc(100vw - 16px * 2);
  width: calc(100vw - 16px * 2);
}
#mien .typo {font-size: 1rem; overflow: hidden;}

.slide-pane-item {
  max-width: -webkit-calc(100vw - 16px * 4);
  max-width: calc(100vw - 16px * 4);
}
#bdM .quick .bd ul {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}
#bdM .quick .bd ul li {width: 25%; float: left; text-align: center;}

.ft-links .col {display: inline-block; height: 2rem; line-height: 2rem; text-align: center;}
.ft-links .col img {
  position: absolute; 
  display: none; 
  width: calc((100vw - 16px * 4) / 4); 
  height: calc((100vw - 16px * 4) / 4); 
  margin-top: -calc((100vw - 16px * 4) / 4);
}
.ftM .copyright p {width: 100%; line-height: 1.2rem; text-align: center; font-size: .8rem; margin-bottom: .5rem;}

@media screen and (max-width: 320px) {
  #hdM .menu ul.menu-list > li.top > a {
    font-size: .8rem;
    margin-right: 0;
  }
  #hdM .menu ul.menu-list > li.top > a.close-btn {font-size: 2rem;}
}
@media screen and (max-width: 360px) {
  #hdM .menu ul.menu-list > li.top > a {font-size: .9rem;}
}