@import "icon-fonts/styles.css";
.align-middle {
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
.align-center {
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
.align-middle-center {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
}
.shadow-light {
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
}
.shadow-medium {
  -webkit-box-shadow: 5px 5px 5px 15px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 0px 25px 5px rgba(0, 0, 0, 0.2);
}
.shadow-strong {
  -webkit-box-shadow: 5px 5px 5px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 0px 0px 20px 5px rgba(0, 0, 0, 0.3);
}
.hide {
  display: none;
}
.auto-trim {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  -ms-text-overflow: ellipsis;
  -moz-binding: url('ellipsis.xml#ellipsis');
}
/* Step 1: Set up Keyframes */
/* fadeInOut */
@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* shrinkGrow */
@-webkit-keyframes shrinkGrow {
  from {
    width: 200px;
    height: 200px;
  }
  to {
    width: 100px;
    height: 100px;
  }
}
@keyframes shrinkGrow {
  from {
    width: 200px;
    height: 200px;
  }
  to {
    width: 100px;
    height: 100px;
  }
}
/* move */
@-webkit-keyframes move {
  0% {
    left: 0px;
    top: 0px;
  }
  25% {
    left: 300px;
    top: 0px;
  }
  50% {
    left: 300px;
    top: 300px;
  }
  75% {
    left: 0px;
    top: 300px;
  }
  100% {
    left: 0px;
    top: 0px;
  }
}
@keyframes move {
  0% {
    left: 0px;
    top: 0px;
  }
  25% {
    left: 300px;
    top: 0px;
  }
  50% {
    left: 300px;
    top: 300px;
  }
  75% {
    left: 0px;
    top: 300px;
  }
  100% {
    left: 0px;
    top: 0px;
  }
}
/* change colors */
@-webkit-keyframes change {
  0% {
    background-color: #eef529;
  }
  16.67% {
    background-color: #cc5e00;
  }
  33.33% {
    background-color: #b40808;
  }
  50% {
    background-color: #8312c9;
  }
  66.67% {
    background-color: #1e3cba;
  }
  83.33% {
    background-color: #1ba340;
  }
  100% {
    background-color: #eef529;
  }
}
@keyframes change {
  0% {
    background-color: #eef529;
  }
  16.67% {
    background-color: #cc5e00;
  }
  33.33% {
    background-color: #b40808;
  }
  50% {
    background-color: #8312c9;
  }
  66.67% {
    background-color: #1e3cba;
  }
  83.33% {
    background-color: #1ba340;
  }
  100% {
    background-color: #eef529;
  }
}
body,
html {
  width: 100%;
  background: #ededed;
  font-family: "微軟正黑體";
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}
body > div.wrap,
html > div.wrap {
  overflow: hidden;
  position: relative;
}
body > div.wrap div.view-wrap:not(.is-home),
html > div.wrap div.view-wrap:not(.is-home) {
  margin-bottom: 120px;
}
h1,
h2,
h3,
p,
span,
li,
a,
td {
  font-family: "微軟正黑體";
  font-size: 13px;
  text-decoration: none;
  color: #333333;
}
body.is-mobile h1,
body.is-mobile h2,
body.is-mobile h3,
body.is-mobile p,
body.is-mobile span,
body.is-mobile li,
body.is-mobile a,
body.is-mobile td {
  font-size: 1em;
}
div.topbar {
  width: 100%;
  height: 32px;
  background: #3d3938;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 11;
}
div.topbar ul.btns {
  width: 80%;
  margin: auto;
}
div.topbar ul.btns li {
  display: block;
  float: right;
  padding-left: 14px;
  margin-left: 14px;
  height: 32px;
  line-height: 32px;
  color: white;
  cursor: pointer;
}
div.topbar ul.btns li.home {
  background: url(../img/icons/home.png) left center no-repeat;
}
div.topbar ul.btns li.login {
  background: url(../img/icons/member.png) left center no-repeat;
}
div.topbar ul.btns li:first-child {
  padding-left: 20px;
}
div.popup-layer {
  position: fixed;
  z-index: 10;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
div.popup-layer div.banner-popup {
  position: fixed;
  width: 50%;
  height: 430px;
  z-index: 11;
  background: white;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
}
div.popup-layer div.banner-popup .wrap {
  width: 100%;
  height: 360px;
  overflow-y: auto;
  z-index: 20;
}
div.popup-layer div.banner-popup .wrap img {
  float: left;
  width: 335px;
  margin: 20px;
}
div.popup-layer div.banner-popup .wrap h1 {
  font-size: 35px;
  color: #8dc041;
  padding-bottom: 10px;
  padding-top: 20px;
}
div.popup-layer div.banner-popup .wrap h2 {
  font-size: 25px;
  color: #333;
  padding-bottom: 20px;
}
div.popup-layer div.banner-popup .wrap p {
  font-size: 15px;
  color: #333;
  line-height: 25px;
  padding-left: 20px;
}
div.popup-layer div.banner-popup .wrap a.order {
  display: block;
  padding: 10px 30px 10px 30px;
  font-size: 20px;
  background: #ffcc00;
  position: absolute;
  right: 40px;
  bottom: 20px;
  border: 0;
  letter-spacing: 10px;
}
div.popup-layer div.news-popup,
div.popup-layer div.event-popup {
  position: fixed;
  z-index: 11;
  width: 50%;
  background: white;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  height: 80%;
  overflow: auto;
}
div.popup-layer div.news-popup > div,
div.popup-layer div.event-popup > div {
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
div.popup-layer div.news-popup table tr td,
div.popup-layer div.event-popup table tr td {
  padding: 20px;
  vertical-align: top;
}
div.popup-layer div.news-popup table tr td:first-child,
div.popup-layer div.event-popup table tr td:first-child {
  width: 15%;
  padding-right: 0;
}
div.popup-layer div.news-popup table tr td:first-child > div.date,
div.popup-layer div.event-popup table tr td:first-child > div.date {
  background: #8dc041;
  border-radius: 1000px;
  width: 80px;
  height: 80px;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
div.popup-layer div.news-popup table tr td:first-child > div.date > p.year,
div.popup-layer div.event-popup table tr td:first-child > div.date > p.year {
  color: #666666;
  text-align: center;
  font-size: 13px;
  padding-top: 17px;
  line-height: 18px;
}
body.is-mobile div.popup-layer div.event-popup table tr td:first-child > div.date > p.year {
  font-size: 1em;
}
div.popup-layer div.news-popup table tr td:first-child > div.date > p.date,
div.popup-layer div.event-popup table tr td:first-child > div.date > p.date {
  color: white;
  text-align: center;
  font-size: 20px;
}
div.popup-layer div.news-popup table tr td:last-child,
div.popup-layer div.event-popup table tr td:last-child {
  width: 85%;
}
div.popup-layer div.news-popup table tr td:last-child div.content h1,
div.popup-layer div.event-popup table tr td:last-child div.content h1 {
  font-size: 18px;
  color: #000;
  padding: 20px 0 20px 0;
}
div.popup-layer div.news-popup table tr td:last-child div.content h2,
div.popup-layer div.event-popup table tr td:last-child div.content h2 {
  color: #000;
  line-height: 30px;
  padding: 20px 0 20px 0;
}
div.popup-layer div.news-popup table tr td:last-child div.content p,
div.popup-layer div.event-popup table tr td:last-child div.content p,
div.popup-layer div.news-popup table tr td:last-child div.content h2,
div.popup-layer div.event-popup table tr td:last-child div.content h2 {
  font-size: 15px;
}
div.popup-layer div.news-popup table tr td:last-child div.content p,
div.popup-layer div.event-popup table tr td:last-child div.content p {
  color: #666;
  line-height: 25px;
}
div.popup-layer .bg {
  position: fixed;
  z-index: 10;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  filter: alpha(opacity=(@a*100));
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  opacity: 0.8;
  background: black;
}
div.popup-layer button.close {
  border: 0;
  background: #333;
  padding: 10px 20px 10px 20px;
  position: fixed;
  right: 0;
  top: 0;
  font-size: 25px;
  color: white;
  cursor: pointer;
}
div.main-menu {
  height: 80px;
  width: 100%;
  position: absolute;
  top: 32px;
  left: 0;
  background: white;
  z-index: 11;
}
div.main-menu div.wrap {
  width: 80%;
  height: 100%;
  margin: auto;
  top: 0;
  position: relative;
}
div.main-menu div.wrap img.logo {
  position: absolute;
  display: block;
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  width: 180px;
}
div.main-menu div.wrap div.mobile-menu-icon {
  display: none;
}
div.main-menu div.wrap > ul {
  display: block;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
div.main-menu div.wrap > ul > li {
  display: block;
  float: left;
  margin-right: 10px;
  position: relative;
}
div.main-menu div.wrap > ul > li ul li:hover {
  background: #009f3e;
}
div.main-menu div.wrap > ul > li ul li:hover a {
  color: white;
}
div.main-menu div.wrap > ul > li:hover ul {
  display: block;
}
div.main-menu div.wrap > ul > li.noChildren:hover:before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #009f3e;
  position: absolute;
  top: 38px;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
div.main-menu div.wrap > ul > li a {
  font-size: 16px;
}
div.main-menu div.wrap > ul > li:last-child {
  margin-right: 0;
}
div.main-menu div.wrap > ul > li > ul {
  display: none;
  background: white;
  position: absolute;
  left: 0;
  top: 48px;
  width: 140px;
  border-top: 4px solid #009f3e;
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
}
div.main-menu div.wrap > ul > li > ul:before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #009f3e;
  position: absolute;
  top: -10px;
  left: 10px;
}
div.main-menu div.wrap > ul > li > ul:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 48px;
  top: -35px;
}
div.main-menu div.wrap > ul > li > ul > li {
  display: block;
  height: 40px;
  width: 100%;
  float: left;
  text-align: center;
  line-height: 40px;
  border-bottom: 1px solid #333;
}
div.main-menu div.wrap > ul > li > ul > li:last-child {
  border-bottom: 0;
}
div.main-menu div.wrap > ul.pc-menu > li > a {
  padding: 5px 15px 5px 15px;
  background: white;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
}
div.main-menu div.wrap > ul.pc-menu > li > a:hover {
  background: #009f3e;
  color: white;
}
div.main-menu div.wrap > ul.pc-menu > li.on > a {
  background: #009f3e;
  color: white;
}
div.main-menu div.wrap > ul.pc-menu > li:last-child {
  margin-right: 0;
}
div.main-banner {
  display: block;
  background: white;
  width: 80%;
  height: 420px;
  position: relative;
  margin: auto;
  margin-top: 135px;
}
div.main-banner div.imgs {
  position: relative;
  overflow: hidden;
  width: calc(100% - 16px);
  height: calc(100% - 16px);
  left: 8px;
  top: 8px;
  background: #333;
  z-index: 1;
  margin: 0;
}
div.main-banner div.imgs img {
  height: 100%;
  position: absolute;
  display: none;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform:translate(-50%, -50%);
}
div.main-banner div.imgs img.align-w {
  height: auto;
  width: 100%;
}
div.main-banner div.imgs h1.text {
  display: none;
  position: absolute;
  right: 20px;
  top: 20px;
  color: #666666;
  font-size: 40px;
  background: white;
  padding: 10px;
}
div.main-banner img.banner-text {
  position: absolute;
  right: 55px;
  bottom: 35px;
  z-index: 3;
}
div.main-banner div.nav {
  width: 100%;
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  z-index: 3;
}
div.main-banner div.nav img {
  position: absolute;
  cursor: pointer;
}
div.main-banner div.nav img:first-child {
  left: 20px;
}
div.main-banner div.nav img:last-child {
  right: 20px;
}
div.main-banner ul.indicators {
  display: block;
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  z-index: 3;
}
div.main-banner ul.indicators li {
  display: block;
  width: 16px;
  height: 16px;
  border-radius: 100px;
  background: white;
  float: left;
  margin-right: 10px;
  position: relative;
  cursor: pointer;
}
div.main-banner ul.indicators li:before {
  content: '';
  position: absolute;
  left: 3px;
  top: 3px;
  z-index: 5;
  width: 10px;
  height: 10px;
  border-radius: 100px;
  background: white;
}
div.main-banner ul.indicators li.on:before {
  background: #8dc041;
}
div.body-wrap {
  width: 70%;
  margin: auto;
  position: relative;
  margin-top: 85px;
}
div.body-wrap div.middle-banners {
  width: 100%;
  height: 235px;
  position: relative;
}
div.body-wrap div.middle-banners .banner-item {
  width: 45%;
  height: 235px;
  float: left;
  background: #e7e7e7;
  overflow: hidden;
  border: 10px solid white;
  cursor: pointer;
}
div.body-wrap div.middle-banners .banner-item:hover {
  border: 10px solid #8dc041;
}
div.body-wrap div.middle-banners .banner-item span.readmore:hover {
  background: #666;
}
div.body-wrap div.middle-banners .banner-item:first-child {
  margin-right: 4%;
}
div.body-wrap div.middle-banners .banner-item > div {
  position: relative;
  overflow: hidden;
  height: 100%;
}
div.body-wrap div.middle-banners .banner-item > div img {
  height: 100%;
}
div.body-wrap div.middle-banners .banner-item > div > div.mimage {
  position: absolute;
  left: 0;
  width: 55%;
  height: 100%;
  background: white no-repeat center center;
  background-size:contain;
  top: 0;
  margin: 0;
  
}
div.body-wrap div.middle-banners .banner-item > div > div.mdesc {
  position: absolute;
  right: 0;
  width: 45%;
  height: 100%;
  background: white;
  top: 0;
  margin: 0;
}
div.body-wrap div.middle-banners .banner-item > div > div > h1 {
  font-size: 20px;
  padding: 30px 0 0 10px;
}
div.body-wrap div.middle-banners .banner-item > div > div > p {
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  left: 10px;
  font-size: 16px;
  line-height: 20px;
}
div.body-wrap div.middle-banners .banner-item > div > div > p span {
  font-size: 12px;
}
div.body-wrap div.middle-banners .banner-item > div > div span.readmore {
  display: block;
  position: absolute;
  left: 10px;
  bottom: 10px;
  border-radius: 5px;
  background: #333333;
  color: white;
  text-align: center;
  padding: 5px 10px 5px 10px;
  font-size: 12px;
}
div.body-wrap div.middle-banners .banner-item > div div.arrow {
  width: 0;
  height: 0;
  background: none;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  border-right: 15px solid white;
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  left: -15px;
}
div.body-wrap div.news {
  width: 100%;
  margin-top: 55px;
}
div.body-wrap div.news > h1.title {
  text-align: center;
  color: green;
  font-size: 24px;
}
div.body-wrap div.news ul.items > li.item {
  display: block;
  width: 45%;
  height: 125px;
  float: left;
  position: relative;
  margin: 20px 2% 10px 2%;
  cursor: pointer;
}
div.body-wrap div.news ul.items > li.item.on > div.date {
  background: #FF530D;
}
div.body-wrap div.news ul.items > li.item > div.date {
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  background: #8dc041;
  border-radius: 1000px;
  width: 80px;
  height: 80px;
}
div.body-wrap div.news ul.items > li.item > div.date > p.year {
  color: #666666;
  text-align: center;
  font-size: 13px;
  padding-top: 17px;
  line-height: 18px;
}
body.is-mobile div.body-wrap div.news ul.items > li.item > div.date > p.year {
  font-size: 1em;
}
div.body-wrap div.news ul.items > li.item > div.date > p.date {
  color: white;
  text-align: center;
  font-size: 20px;
}
div.body-wrap div.news ul.items > li.item > div.text {
  position: absolute;
  top: 20px;
  left: 100px;
}
div.body-wrap div.news ul.items > li.item > div.text > h1.title {
  font-size: 18px;
  line-height: 34px;
  font-weight: bold;
}
div.body-wrap div.news ul.items > li.item > div.text > p {
  font-size: 15px;
  line-height: 17px;
  padding: 0 15px 5px 0;
}
div.bottom {
  width: 100%;
  position: relative;
  margin-top: 80px;
  background: url("../img/banners/home-bottom.jpg") center center no-repeat;
  background-size: cover;
  height: 600px;
}
div.bottom > img {
  width: 100%;
  margin-bottom: 90px;
  z-index: 1;
}
div.bottom div.overlay {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  filter: alpha(opacity=(@a*100));
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  opacity: 0.8;
  z-index: 3;
  background: #333333;
}
div.bottom div.outstanding {
  position: absolute;
  right: 200px;
  top: 60px;
  z-index: 5;
}
div.bottom div.outstanding > div.desc > h1 {
  padding-bottom: 20px;
  padding-right: 35px;
}
div.bottom div.outstanding > div.desc > h1 a {
  cursor: pointer;
  color: #8dc041;
  font-size: 28px;
}
div.bottom div.outstanding > div.desc > h1 a > img {
  position: relative;
  top: 5px;
  left: 3px;
}
div.bottom div.outstanding > div.desc > p {
  color: white;
  font-size: 15px;
  line-height: 25px;
}
div.bottom div.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 100px;
  background: #333333;
  z-index: 5;
  color: white;
}
div.bottom div.footer div.info {
  position: absolute;
  right: 45px;
  height: 50px;
  width: 260px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
div.bottom div.footer div.info img.fb {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
div.bottom div.footer div.info img.line {
  position: absolute;
  right: -50px;
  top: 38px;
  transform: translate(0, -75%);
  -webkit-transform: translate(0, -75%);
}
div.bottom div.footer div.info p.tel {
  display: block;
  font-size: 25px;
  color: white;
  padding: 0 0 0 35px;
}
div.bottom div.footer div.info p.addr {
  font-size: 13px;
  color: white;
  padding: 10px 50px 0 5px;
  text-align: right;
}
body.is-mobile div.bottom div.footer div.info p.addr {
  font-size: 1em;
}
div.bottom div.footer p.copyright {
  color: white;
  line-height: 100px;
  padding-left: 45px;
  font-size: 10px;
}
body.is-mobile {
  width: 100%;
}
body.is-mobile div.topbar ul.btns {
  right: 10px;
}
body.is-mobile div.main-menu div.wrap {
  width: 100%;
}
body.is-mobile div.main-menu div.wrap img.logo {
  left: 10px;
}
body.is-mobile div.main-menu div.wrap ul {
  background: white;
  left: 0px;
  top: 232px;
  z-index: 5;
}
body.is-mobile div.main-menu div.wrap ul li {
  text-align: center;
  float: none;
  display: block;
  width: 100%;
  height: 60px;
  line-height: 60px;
  background: #3d3938;
  border-bottom: 1px solid #222222;
}
body.is-mobile div.main-menu div.wrap ul li a {
  color: #cccccc;
  font-size: 20px;
}
body.is-mobile div.main-menu div.wrap ul.pc-menu {
  display: none;
}
body.is-mobile div.main-menu div.wrap div.mobile-menu-icon {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  display: block;
  font-size: 30px;
  color: #333333;
}
body.is-mobile div.view-wrap {
  position: relative;
  margin-top: 300px;
}
body.is-mobile div.view-wrap.menu-close {
  margin-top: 0px;
}
body.is-mobile div.main-banner {
  width: 100%;
  height: 200px;
}
body.is-mobile div.main-banner div.imgs {
  background: none;
  position: relative;
}
body.is-mobile div.main-banner div.imgs img {
  width: auto;
  height: 100%;
}
body.is-mobile div.main-banner div.imgs h1 {
  font-size: 20px;
}
body.is-mobile div.main-banner img.banner-text {
  width: 40%;
  bottom: 10px;
}
body.is-mobile div.main-banner div.nav img {
  width: 20px;
}
body.is-mobile div.main-banner ul.indicators {
  bottom: 12px;
}
body.is-mobile div.main-banner ul.indicators li {
  width: 10px;
  height: 10px;
}
body.is-mobile div.main-banner ul.indicators li:before {
  width: 6px;
  height: 6px;
  left: 2px;
  top: 2px;
}
body.is-mobile div.body-wrap {
  width: 80%;
  margin-top: 0px;
}
body.is-mobile div.body-wrap.menu-open {
  top: 285px;
}
body.is-mobile div.body-wrap div.middle-banners {
  top: 35px;
}
body.is-mobile div.body-wrap div.middle-banners div.banner-item {
  width: 100%;
  overflow-x: hidden;
}
body.is-mobile div.body-wrap div.news ul.items li.item {
  width: 100%;
  margin-left: 0;
}
body.is-mobile div.body-wrap div.news ul.items li.item > div.text > h1.title {
  line-height: 20px;
  padding-bottom: 10px;
}
body.is-mobile div.body-wrap div.news ul.items li.item > div.text > p {
  line-height: 17px;
  padding: 0 0px 5px 0;
}
body.is-mobile div.bottom {
  height: 300px;
  margin-top: 20px;
}
body.is-mobile div.bottom div.outstanding {
  left: 15%;
  top: 20%;
  width: 100%;
  position: absolute;
}
body.is-mobile div.bottom div.outstanding > div.desc h1 {
  font-size: 15px;
}
body.is-mobile div.bottom div.outstanding > div.desc > p {
  position: relative;
  top: -15px;
  font-size: 10px;
}
body.is-mobile div.bottom div.info {
  right: 10px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  width: 50%;
}
body.is-mobile div.bottom div.info p.tel {
  font-size: 15px;
  background-size: 18px 18px;
  background: none;
  padding: 0 0 0 25px;
}
body.is-mobile div.bottom div.info p.tel:before {
  content: "";
  background-image: url('../img/icons/tel.png');
  background-size: 18px 18px;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute;
  right: 105px;
}
body.is-mobile div.bottom div.info img.fb {
  right: 13px;
  width: 25px;
  transform: none;
}
body.is-mobile div.bottom div.info img.line {
  width: 30px;
  right: -14px;
  top: 22px;
  transform: none;
}
body.is-mobile div.footer div.info img.line {
  width: 30px;
  right: -14px;
  top: 22px;
  transform: none;
}
body.is-mobile div.bottom div.info p.addr {
  padding: 10px 25px 0 5px;
  line-height: 20px;
}
body.is-mobile div.bottom div.footer p.copyright {
  width: 40%;
  padding-left: 10px;
  left: 0;
  line-height: 17px;
  font-size: 8px;
  position: relative;
  top: 50%;
  transform: translate(0, -50%);
}
body.is-mobile div.footer {
  position: absolute;
  bottom: 0;
}
body.is-mobile div.footer p.copyright {
  width: 40%;
  padding-left: 10px;
  left: 0;
  line-height: 14px;
  font-size: 8px;
  position: relative;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
body.is-mobile div.footer div.info {
  right: 10px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  width: 50%;
}
body.is-mobile div.footer div.info p.tel {
  display: block;
  text-align: right;
  font-size: 15px;
  background-size: 18px 18px;
  background: none;
  padding: 0 0 0 25px;
}
body.is-mobile div.footer div.info p.tel:before {
  content: "";
  background-image: url('../img/icons/tel.png');
  background-size: 18px 18px;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute;
  right: 105px;
}
body.is-mobile div.footer div.info img.fb {
  right: 13px;
  width: 25px;
  transform: none;
}
body.is-mobile div.footer div.info img.line {
  width: 30px;
  transform: none;
}
body.is-mobile div.footer div.info p.addr {
  text-align: right;
  padding: 12px 40px 0 5px;
  line-height: 20px;
}
body.is-mobile div.people {
  width: 90%;
  position: relative;
  left: 5%;
  margin: 0;
}
body.is-mobile div.people div.img-wrap p.title span {
  font-size: 16px;
}
body.is-mobile div.people h1 {
  font-size: 18px;
}
body.is-mobile div.people-1 div.person-wrap div.person {
  border-radius: 250px;
  -webkit-border-radius: 250px;
  -moz-border-radius: 250px;
  margin: 0;
  float: none;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  margin-bottom: 100px;
  width: 250px;
  height: 250px;
}
body.is-mobile div.people-1 div.person-wrap div.person .img-wrap img {
  border-radius: 250px;
  -webkit-border-radius: 250px;
  -moz-border-radius: 250px;
  width: 250px;
  height: 250px;
  border: 0;
}
body.is-mobile div.people-list {
  width: 100%;
}
body.is-mobile div.people-list div.person-wrap div.person {
  width: 80%;
  left: 10%;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  float: none;
  margin: 0;
  margin-bottom: 60px;
}
body.is-mobile div.bread-crumbs {
  position: static;
  float: left;
  padding-bottom: 20px;
}
body.is-mobile div.login {
  width: 100%;
}
body.is-mobile div.login div.wrap {
  width: 100%;
}
body.is-mobile div.login div.wrap div.form-wrap {
  width: 70%;
  position: relative;
  margin: 0;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
body.is-mobile div.login div.wrap div.form-wrap h1 {
  padding: 10px 0 10px 0;
}
body.is-mobile div.login div.wrap div.form-wrap form {
  width: 100%;
}
body.is-mobile div.login div.wrap div.form-wrap form label {
  padding-left: 0;
  padding-bottom: 10px;
}
body.is-mobile div.login div.wrap div.form-wrap form input {
  width: 100%;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
body.is-mobile div.login div.wrap div.form-wrap form button {
  width: 100%;
  margin-right: 0;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
body.is-mobile div.login div.wrap div.form-wrap form button.first {
  margin-left: 0px;
}
body.is-mobile div.login div.wrap div.info-wrap {
  width: 90%;
}
body.is-mobile div.login div.popup-layer div.join {
  width: 80%;
  height: 50%;
}
body.is-mobile div.login div.popup-layer div.join p {
  padding: 40px 0 30px 60px;
}
body.is-mobile div.affiliates {
  width: 100%;
}
body.is-mobile div.affiliates ul.submenu {
  width: 80%;
  height: auto;
  margin: auto;
  margin-top: 20px;
}
body.is-mobile div.affiliates ul.submenu li {
  width: 100%;
  text-align: left;
}
body.is-mobile div.affiliates ul.submenu li a {
  padding-left: 50px;
}
body.is-mobile div.affiliates ul.submenu li.on {
  background: white;
}
body.is-mobile div.affiliates ul.submenu li.on a {
  color: #00cccc;
}
body.is-mobile div.affiliates ul.submenu li.on span {
  color: #00cccc;
}
body.is-mobile div.affiliates ul.submenu li.on:before {
  content: "";
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid #00cccc;
  left: 20px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
body.is-mobile div.affiliates ul.submenu li:hover {
  background: white;
}
body.is-mobile div.affiliates ul.submenu li:hover a {
  color: #00cccc;
}
body.is-mobile div.affiliates ul.submenu li:hover span {
  color: #00cccc;
}
body.is-mobile div.affiliates ul.submenu li:hover:before {
  display: none;
}
body.is-mobile div.affiliates ul.submenu li span {
  color: white;
  padding-left: 40px;
}
body.is-mobile div.affiliates > div.content {
  width: 80%;
  margin: auto;
}
body.is-mobile div.affiliates div.news div.calendar .clndr .clndr-grid .header-day,
body.is-mobile div.affiliates div.news div.calendar .clndr .clndr-grid .day {
  width: 13.8%;
}
body.is-mobile div.affiliates div.news div.calendar .zones li {
  padding: 5px 5px 5px 5px;
}
body.is-mobile div.affiliates div.org div.org-content-1 td {
  font-size: 14px;
  padding: 5px;
}
body.is-mobile div.affiliates div.org div.org-content-1 table {
  margin-bottom: 20px;
}
body.is-mobile div.affiliates div.org div.org-content-1 table tr td:nth-child(2) {
  border-right: 0px;
}
body.is-mobile div.affiliates div.org div.org-content-2 td {
  line-height: 20px;
  font-size: 14px;
}
body.is-mobile div.affiliates div.org div.org-content-2 ul li p {
  font-size: 16px;
}
body.is-mobile div.affiliates div.org div.org-content-3 ul.info {
  display: none;
}
body.is-mobile div.affiliates div.edu div.content {
  margin: auto;
}
body.is-mobile div.affiliates div.edu div.content div.videos-1,
body.is-mobile div.affiliates div.edu div.content div.videos-2 {
  display: block;
}
body.is-mobile div.affiliates div.edu div.content div.videos-1 ul.videos > li,
body.is-mobile div.affiliates div.edu div.content div.videos-2 ul.videos > li {
  width: 30%;
  float: left;
  margin-left: 5%;
}
body.is-mobile div.affiliates div.edu div.content div.videos-1 ul.videos > li:first-child,
body.is-mobile div.affiliates div.edu div.content div.videos-2 ul.videos > li:first-child {
  margin-left: 0;
}
body.is-mobile div.affiliates div.edu div.content div.videos-1 ul.videos div.current-video,
body.is-mobile div.affiliates div.edu div.content div.videos-2 ul.videos div.current-video {
  width: 100%;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  clear: both;
}
body.is-mobile div.affiliates div.list {
  position: relative;
}
body.is-mobile div.affiliates div.list div.step li,
body.is-mobile div.affiliates div.list div.step td {
  font-size: 16px !important;
}
body.is-mobile div.affiliates div.list div.step-1 p.note {
  position: static;
}
body.is-mobile div.affiliates div.list div.step-1 h1.step-title {
  padding-left: 20px;
  padding-top: 20px;
}
body.is-mobile div.affiliates div.list div.step-1 p.note {
  line-height: 24px;
  font-size: 16px;
  padding-left: 20px;
  padding-top: 15px;
}
body.is-mobile div.affiliates div.list div.step-1 hr {
  display: none;
}
body.is-mobile div.affiliates div.list div.step-1 div.content {
  border-top: 1px solid #eaeaea;
  padding: 0;
  margin: 0;
}
body.is-mobile div.affiliates div.list div.step-1 table {
  border-bottom: 1px solid #eaeaea;
  margin: 20px 0 20px 0;
}
body.is-mobile div.affiliates div.list div.step-1 table td,
body.is-mobile div.affiliates div.list div.step-1 table th {
  font-size: 12px;
  padding: 5px 20px 5px 20px;
  text-align: left;
}
body.is-mobile div.affiliates div.list div.step-1 table tr:last-child td {
  padding-bottom: 20px;
}
body.is-mobile div.affiliates div.list div.step-2 div.content div.part-1 div.remind {
  width: 90%;
  margin: auto;
}
body.is-mobile div.affiliates div.list div.step-2 div.content div.part-1 .deliveryType,
body.is-mobile div.affiliates div.list div.step-2 div.content div.part-1 .paymentType {
  width: 44%;
  float: left;
}
body.is-mobile div.affiliates div.list div.step-2 div.content div.part-1 div.deliveryType {
  margin: 0 0% 0 6%;
}
body.is-mobile div.affiliates div.list div.step-2 div.content div.part-1 div.paymentType {
  margin: 0 6% 0 0%;
}
body.is-mobile div.affiliates div.list div.step-2 div.content div.part-2 div.member-info {
  width: 90%;
}
body.is-mobile div.affiliates div.list div.step-2 div.content div.part-2 div.receiver-info {
  width: 90%;
  margin: 0 5% 0 5%;
}
body.is-mobile div.affiliates div.list div.step-3 table.order-info tr:last-child td {
  background: #e3e3e3;
  color: #333;
  text-align: center;
}
body.is-mobile div.affiliates div.list div.step-3 table.order-info td:first-child {
  width: 25%;
}
body.is-mobile div.affiliates div.list div.step-3 h1.subTotal {
  padding: 0px 0 30px 0;
}
body.is-mobile div.affiliates div.list div.step-3 h1.subTotal span {
  font-size: 20px;
}
body.is-mobile div.affiliates div.list div.step-4 div.content div.left {
  width: 94%;
}
body.is-mobile div.affiliates div.list div.step-4 div.content div.right {
  width: 94%;
  margin-left: 3%;
}
body.is-mobile div.affiliates div.list .popup-layer div.wrap {
  width: 90%;
  height: 80%;
  padding-bottom: 15px;
}
body.is-mobile div.affiliates div.list .popup-layer div.wrap h1 {
  padding: 40px 0 30px 15px;
}
body.is-mobile div.affiliates div.list .popup-layer div.wrap p {
  padding: 10px 15px 10px 15px;
}
body.is-mobile div.affiliates div.query div.orders-holder {
  width: 80%;
  height: auto;
  position: static;
  margin: auto;
  margin-bottom: 20px;
}
body.is-mobile div.affiliates div.query div.orders-holder div.wrap ul.orders {
  margin: auto;
}
body.is-mobile div.affiliates div.query div.orders-holder div.wrap ul.orders > li {
  width: 200px;
}
body.is-mobile div.affiliates div.query div.orders-holder div.wrap ul.orders > li span {
  width: 75px;
}
body.is-mobile div.affiliates div.query div.orders-holder div.arrows {
  position: relative;
  top: 55px;
}
body.is-mobile div.affiliates div.query div.orders-holder div.arrows img.left {
  left: -50px;
}
body.is-mobile div.affiliates div.query div.orders-holder div.arrows img.right {
  right: -50px;
}
body.is-mobile div.affiliates div.query hr {
  color: #666;
  background: #666;
}
body.is-mobile div.affiliates div.query div.current {
  width: 80%;
  margin: auto;
}
body.is-mobile div.affiliates div.query div.current ul li {
  width: 100%;
}
body.is-mobile div.affiliates div.query div.current table td,
body.is-mobile div.affiliates div.query div.current table th {
  font-size: 14px;
}
body.is-mobile div.affiliates div.query div.current table td.total {
  font-size: 16px;
}
body.is-mobile div.affiliates div.query div.current table td.total span {
  font-size: 16px;
  color:#000000;
}
body.is-mobile div.affiliates div.query div.current table td.total span.spacer {
  padding-right: 7px;
}
body.is-mobile div.affiliates div.shopping .categories {
  width:80%;
  margin:10px auto 0px auto;
  position:static;
  border-radius:10px;
}
body.is-mobile div.affiliates div.shopping .categories li {
  font-size: 16px;
}
body.is-mobile div.affiliates div.shopping h1 em {
  font-size: 20px;
  display: block;
}
body.is-mobile div.affiliates div.shopping h1 a {
  width: 20%;
}
body.is-mobile div.products {
  width: 100%;
  margin: auto;
  margin-top: 30px;
}
body.is-mobile div.products ul.banners {
  display: block;
  margin: auto;
  width: 80%;
}
body.is-mobile div.products ul.banners li {
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  margin-bottom: 15px;
}
body.is-mobile div.products ul.banners li:hover {
  border: 10px solid #8dc041;
}
body.is-mobile div.products ul.submenu {
  display: block;
  width: 80%;
  height: auto;
  margin-top: 20px;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
body.is-mobile div.products ul.submenu li {
  float: left;
  height: 60px;
  width: 100%;
  background: #0a93c7;
  text-align: left;
}
body.is-mobile div.products ul.submenu li a {
  color: white;
  padding-left: 45px;
}
body.is-mobile div.products ul.submenu li.on,
body.is-mobile div.products ul.submenu li:hover {
  background: white;
}
body.is-mobile div.products ul.submenu li.on a,
body.is-mobile div.products ul.submenu li:hover a {
  color: #0a93c7;
}
body.is-mobile div.products ul.submenu li.on:before,
body.is-mobile div.products ul.submenu li:hover:before {
  content: "";
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid #0a93c7;
  left: 20px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
body.is-mobile div.products div.product-list {
  margin-top: 80px;
  margin-bottom: 250px;
  position: relative;
  width: 100%;
}
body.is-mobile div.products div.product-list ul.items {
  width: 70%;
  display: block;
  margin: auto;
}
body.is-mobile div.products div.product-list ul.items > li {
  width: 100%;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
body.is-mobile div.products div.product-list ul.items > li .wrap {
  width: 100%;
}
body.is-mobile div.products div.product-list ul.items > li ul.info li {
  font-size: 16px;
}
body.is-mobile div.products div.product-list ul.paginator {
  width: 70%;
  display: block;
  position: absolute;
  bottom: -100px;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
body.is-mobile div.products div.product-list ul.paginator li {
  display: inline-block;
  padding: 10px;
  margin-right: 5px;
  margin-bottom: 10px;
  font-size: 16px;
  line-height: 16px;
  background: white;
  border: 1px solid #eaeaea;
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
}
body.is-mobile div.products div.product-list ul.paginator li.on {
  background: #333333;
  color: white;
}
body.is-mobile div.products div.product-list a.shopping-list {
  right: 15%;
}
body.is-mobile div.catePopup div.content {
  width: 80%;
  max-height: 70%;
  overflow: auto;
}
body.is-mobile div.catePopup div.content p {
  font-size: 16px;
  line-height: 20px;
}
body.is-mobile div.product-popup div.wrap {
  width: 90%;
}
body.is-mobile div.product-popup div.wrap > div img {
  width: 40%;
}
body.is-mobile div.product-popup div.wrap > div h1 {
  font-size: 16px;
  padding-top: 60px;
}
body.is-mobile div.product-popup div.wrap > div h2 {
  font-size: 14px;
}
body.is-mobile div.product-popup div.wrap > div h2 span {
  font-size: 14px;
  padding-right: 10px;
}
body.is-mobile div.product-popup div.wrap > div p.inputs input.qt {
  width: 30px;
  margin-right: 0;
  height: 27px;
}
body.is-mobile div.product-popup div.wrap > div p.inputs button.num {
  width: 30px;
  margin-right: 0;
  margin-bottom: 10px;
}
body.is-mobile div.product-popup div.wrap > div p.inputs button.order {
  font-size: 14px;
  padding: 5px 15px 5px 40px;
}
body.is-mobile div.product-popup div.wrap > div p.inputs button.order:before {
  width: 18px;
  height: 18px;
}
body.is-mobile div.product-popup div.wrap > div p.description {
  font-size: 14px;
  padding-bottom: 30px;
}
body.is-mobile div.popup-layer div.banner-popup {
  width: 90%;
  height: 60%;
  overflow: hidden;
}
body.is-mobile div.popup-layer div.banner-popup div.wrap {
  width: 100%;
  height: 100%;
}
body.is-mobile div.popup-layer div.banner-popup div.wrap img {
  width: 40%;
}
body.is-mobile div.popup-layer div.banner-popup div.wrap h1 {
  font-size: 25px;
  padding-left: 10px;
}
body.is-mobile div.popup-layer div.banner-popup div.wrap h2 {
  font-size: 20px;
  color: #333;
  padding-left: 10px;
}
body.is-mobile div.popup-layer div.banner-popup div.wrap p {
  font-size: 15px;
  padding-left: 10px;
  padding-bottom: 60px;
}
body.is-mobile div.popup-layer div.news-popup,
body.is-mobile div.popup-layer div.event-popup {
  width: 90%;
}
div.footer {
  position: relative;
  width: 100%;
  height: 100px;
  background: #333333;
  color: white;
  z-index: 5;
}
div.footer div.info {
  position: absolute;
  right: 45px;
  height: 50px;
  width: 260px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
div.footer div.info img.fb {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
div.footer div.info img.line {
  position: absolute;
  right: -50px;
  top: 38px;
  width: 50px;
  transform: translate(0, -75%);
  -webkit-transform: translate(0, -75%);
}
div.footer div.info p.tel {
  background: url(../img/icons/tel.png) left top no-repeat;
  font-size: 25px;
  color: white;
  padding: 0 0 0 35px;
}
div.footer div.info p.addr {
  font-size: 13px;
  color: white;
  padding: 10px 0 0 5px;
}
body.is-mobile div.footer div.info p.addr {
  font-size: 1em;
}
div.footer p.copyright {
  color: white;
  line-height: 100px;
  padding-left: 45px;
  font-size: 10px;
}
div.bread-crumbs {
  position: absolute;
  top: 127px;
  left: 10%;
  z-index: 3;
}
div.bread-crumbs a {
  font-size: 15px;
}
div.bread-crumbs a:after {
  content: ">";
}
div.bread-crumbs a:last-child:after {
  content: "";
}
div.story {
  width: 1190px;
  height: 900px;
  margin: auto;
  position: relative;
  top: 0;
}
div.story .img-wrap {
  width: 100%;
  height: 600px;
  overflow: hidden;
  position: relative;
  top: 195px;
  margin-bottom: 60px;
}
div.story .img-wrap img {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
}
div.story .img-wrap ul.indicators {
  position: absolute;
  right: 0;
  bottom: 0;
  cursor: pointer;
}
div.story .img-wrap ul.indicators li {
  display: block;
  float: left;
  width: 20px;
  height: 20px;
  border-radius: 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  background: #8dc041;
  margin-right: 20px;
}
div.story .img-wrap ul.indicators li.on {
  width: 14px;
  height: 14px;
  background: white;
  border: 4px solid #8dc041;
}
div.story .img-wrap ul.indicators li:last-child {
  margin-right: 0;
}
div.founder {
  width: 1190px;
  height: 850px;
  margin: auto;
  position: relative;
  top: 0;
}
div.founder .content-wrap {
  width: 100%;
  height: 650px;
  overflow: hidden;
  position: relative;
  top: 200px;
  margin-bottom: 100px;
  background: url(../img/story/founder.png) left bottom no-repeat;
}
div.founder .content-wrap div.texts {
  width: 545px;
  position: absolute;
  right: 30px;
}
div.founder .content-wrap div.texts h1 {
  font-size: 40px;
  color: #009f3e;
  padding: 0 0 30px 0;
  position: relative;
  left: -20px;
}
div.founder .content-wrap div.texts p {
  padding: 0px 0 20px 0;
  font-size: 17px;
  line-height: 20px;
}
div.founder .content-wrap div.texts p:before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  background: #009f3e;
  position: relative;
  left: -20px;
  top: 17px;
}
div.founder .content-wrap div.texts p.sub {
  padding-left: 30px;
}
div.founder .content-wrap div.texts p.bottom:before {
  display: none;
}
div.biz {
  width: 690px;
  height: 1170px;
  margin: auto;
  position: relative;
  top: 0;
}
div.biz div.content-wrap {
  width: 100%;
  height: 970px;
  overflow: hidden;
  position: relative;
  top: 150px;
  margin-bottom: 100px;
}
div.biz div.content-wrap img.biz-1 {
  margin-bottom: 20px;
}
div.wf {
  padding-top: 155px;
  width: 690px;
  margin: auto;
}
div.wf h1 {
  font-size: 40px;
  padding-bottom: 30px;
  color: #009f3e;
}
div.wf h2 {
  font-size: 27px;
  color: black;
  padding-bottom: 15px;
  padding-top: 15px;
}
div.wf p {
  color: #333333;
  font-size: 16px;
  line-height: 20px;
  padding-bottom: 15px;
}
div.wf img {
  margin-bottom: 50px;
}
div.people {
  width: 50%;
  margin: auto;
}
div.people div.img-wrap {
  margin-top: 155px;
  position: relative;
  margin-bottom: 25px;
  width: 100%;
}
div.people div.img-wrap img.main {
  width: 100%;
}
div.people div.img-wrap p.title {
  text-align: right;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 45px;
  background: #009f3e;
  margin: 0;
  padding: 0;
}
div.people div.img-wrap p.title span {
  line-height: 45px;
  font-size: 30px;
  padding-right: 10px;
  color: white;
  position: relative;
}
div.people div.img-wrap:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #009f3e;
  position: absolute;
  bottom: 45px;
  right: 30px;
}
div.people h1 {
  font-size: 25px;
  color: #009f3e;
  text-align: left;
  line-height: 30px;
  padding-bottom: 60px;
  padding-top: 20px;
}
div.people h2 {
  color: #009da6;
  font-size: 20px;
  padding-bottom: 20px;
}
div.people p {
  padding-bottom: 35px;
  line-height: 20px;
  font-size: 16px;
}
div.people-1 {
  width: 100%;
  background: #ccc;
}
div.people-1 div.person-wrap {
  width: 80%;
  margin: auto;
  padding-top: 40px;
  padding-bottom: 40px;
}
div.people-1 div.person-wrap div.person {
  border-radius: 150px;
  -webkit-border-radius: 150px;
  -moz-border-radius: 150px;
  float: left;
  overflow: hidden;
  margin-right: 20px;
  margin-bottom: 20px;
  margin-top: 20px;
  position: relative;
}
div.people-1 div.person-wrap div.person .img-wrap img {
  border-radius: 150px;
  -webkit-border-radius: 150px;
  -moz-border-radius: 150px;
  border: 10px solid white;
  width: 150px;
  height: 150px;
}
div.people-1 div.person-wrap div.person div.overlay {
  width: 100%;
  height: 100%;
  background: black;
  filter: alpha(opacity=(@a*100));
  -moz-opacity: 0.6;
  -khtml-opacity: 0.6;
  opacity: 0.6;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 3;
  display: none;
}
div.people-1 div.person-wrap div.person div.info {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
  display: none;
}
div.people-1 div.person-wrap div.person div.info h1 {
  padding: 0 15px 0 15px;
  color: white;
  text-align: center;
  font-size: 18px;
  position: relative;
  line-height: 22px;
  top: 50%;
  transform: translate(0, -50%);
}
div.people-list {
  width: 1000px;
  margin: auto;
}
div.people-list div.person-wrap {
  margin-top: 155px;
}
div.people-list div.person-wrap div.person {
  width: 300px;
  height: 415px;
  float: left;
  margin-right: 30px;
  margin-bottom: 100px;
}
div.people-list div.person-wrap div.person.last {
  margin-right: 0px;
}
div.people-list div.person-wrap div.person .img-wrap {
  overflow: hidden;
  width: 100%;
  height: 235px;
  border: 4px solid #666;
}
div.people-list div.person-wrap div.person .img-wrap img {
  height: 100%;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
div.people-list div.person-wrap div.person h1 {
  font-size: 18px;
  color: #009f3e;
  text-align: center;
  padding-bottom: 15px;
  padding-top: 15px;
}
div.people-list div.person-wrap div.person p {
  font-size: 16px;
  color: #333;
  line-height: 20px;
}
div.people-list div.person-wrap div.person a.more {
  display: inline-block;
  border: 0;
  background: #009f3e;
  color: white;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  padding: 10px 25px 10px 25px;
  font-size: 18px;
  margin-top: 20px;
}
div.people-list div.person-wrap div.person a.more:hover {
  background: #333;
}
div.bn {
  width: 1200px;
  margin: auto;
  position: relative;
}
div.bn ul.videos {
  display: block;
  width: 100%;
  position: relative;
  top: -70px;
}
div.bn ul.videos li {
  display: block;
  width: 225px;
  cursor: pointer;
  background: white;
  float: left;
  margin-right: 10px;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
}
div.bn ul.videos li img {
  width: 100%;
  border-bottom: 3px solid #8dc041;
}
div.bn ul.videos li p {
  text-align: center;
  line-height: 60px;
  font-size: 15px;
}
div.bn ul.videos li:hover {
  background: #8dc041;
}
div.bn ul.videos li:hover p {
  color: white;
}
div.bn div.body {
  width: 970px;
  margin: auto;
  margin-bottom: 60px;
}
div.bn div.body div.main-vid {
  margin: 0px 0 0 0px;
}
div.bn div.body h1 {
  font-size: 30px;
  padding-top: 80px;
}
div.bn div.body h1 span {
  font-size: 30px;
}
div.bn div.body ul.cards {
  margin-top: 30px;
}
div.bn div.body ul.cards li {
  display: block;
  width: 478px;
  height: 268px;
  background: white;
  float: left;
  margin-right: 5px;
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
div.bn div.body ul.cards li:last-child {
  margin-right: 0;
}
div.bn div.body ul.cards li h2 {
  color: #009da6;
  font-size: 18px;
  padding: 15px;
}
div.bn div.body ul.cards li p {
  font-size: 16px;
  color: #333;
  line-height: 20px;
  padding: 20px;
}
div.bn div.body h1.core {
  color: #009da6;
  text-align: center;
  padding-top: 70px;
  padding-bottom: 35px;
  clear: both;
}
div.bn div.body img.graph-1 {
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
div.bn div.body h2 {
  font-size: 20px;
  padding-bottom: 15px;
}
div.bn div.body h2.orange {
  color: #f18c00;
}
div.bn div.body h2.purple {
  color: #8a5199;
}
div.bn div.body h2.blue {
  color: #2c7eb7;
}
div.bn div.body h2.green {
  color: #b6c579;
}
div.bn div.body h2.red {
  color: #852c3e;
}
div.bn div.body p {
  font-size: 16px;
  padding-bottom: 40px;
}
div.bn-main-img,
div.contacts-main-img,
div.products-main-img {
  width: 100%;
  background-size: 100%;
  margin-top: 155px;
  position: relative;
}
div.bn-main-img div.mouse-area,
div.contacts-main-img div.mouse-area,
div.products-main-img div.mouse-area {
  position: absolute;
  z-index: 10;
  background: black;
  filter: alpha(opacity=(@a*100));
  -moz-opacity: 0;
  -khtml-opacity: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  left: 0;
  top: 0;
}
div.bn-main-img img,
div.contacts-main-img img,
div.products-main-img img {
  width: 100%;
  border-bottom: 10px solid #8dc041;
}
div.bn-main-img.health img,
div.contacts-main-img.health img,
div.products-main-img.health img {
  border-bottom: 10px solid #8dc041;
}
div.bn-main-img.beauty img,
div.contacts-main-img.beauty img,
div.products-main-img.beauty img {
  border-bottom: 10px solid #9f1931;
}
div.bn-main-img.other img,
div.contacts-main-img.other img,
div.products-main-img.other img {
  border-bottom: 10px solid #0993c6;
}
div.affiliates-main-img {
  width: 100%;
  background-size: 100%;
  margin-top: 155px;
}
div.affiliates-main-img img {
  width: 100%;
}
div.affiliates-1 {
  width: 80%;
  height: 　100px;
  position: absolute;
  top: 125px;
  left: 0;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
div.affiliates-1 div.bread-crumbs {
  top: 0;
}
div.affiliates {
  width: 1200px;
  margin: auto;
}
div.affiliates ul.submenu {
  display: block;
  width: 100%;
  height: 60px;
  border-radius: 15px;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  margin-top: 20px;
  overflow: hidden;
}
div.affiliates ul.submenu li {
  cursor: pointer;
  display: block;
  float: left;
  height: 100%;
  width: 171px;
  text-align: center;
  background: #00cccc;
  position: relative;
}
div.affiliates ul.submenu li a {
  line-height: 60px;
  color: white;
  font-size: 23px;
  width: 100%;
  height: 100%;
  display: block;
}
div.affiliates ul.submenu li.on,
div.affiliates ul.submenu li:hover {
  background: #333333;
}
div.affiliates ul.submenu li.on:before,
div.affiliates ul.submenu li:hover:before {
  content: "";
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #ededed;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
div.affiliates div.news div.news-content {
  background: white;
  width: 100%;
  margin-top: 20px;
  margin-bottom: 20px;
}
div.affiliates div.news div.news-content h1 {
  color: #5f7070;
  font-size: 30px;
  line-height: 30px;
  border-bottom: 1px solid #ccc;
  padding: 10px 0 10px 20px;
}
div.affiliates div.news div.news-content ul.list li {
  background: url(../img/news-icon.png) 20px center no-repeat;
  border-bottom: 1px solid #ccc;
  position: relative;
  cursor: pointer;
}
div.affiliates div.news div.news-content ul.list li p.title {
  padding: 15px 90px 15px 60px;
  font-size: 20px;
  line-height: 30px;
}
div.affiliates div.news div.news-content ul.list li span.date {
  color: #999;
  font-size: 16px;
  position: absolute;
  display: block;
  right: 15px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
div.affiliates div.news div.news-content ul.list li:hover {
  background: url(../img/news-icon.png) 15px center no-repeat;
  border-left: 5px solid #00cccc;
}
div.affiliates div.news div.news-content ul.paginator {
  height: 33px;
  display: block;
  float: right;
  margin: 10px 20px 10px 0;
}
div.affiliates div.news div.news-content ul.paginator li {
  display: block;
  float: left;
  width: 33px;
  height: 100%;
  text-align: center;
  cursor: pointer;
  background: #ededed;
}
div.affiliates div.news div.news-content ul.paginator li span {
  line-height: 33px;
}
div.affiliates div.news div.news-content ul.paginator li.on {
  background: #00cccc;
  cursor: default;
}
div.affiliates div.news div.news-content ul.paginator li.on span {
  color: white;
}
div.affiliates div.news div.news-content ul.paginator li.next:before {
  content: ">";
  line-height: 33px;
}
div.affiliates div.news div.news-content ul.paginator li.prev:before {
  content: "<";
  line-height: 33px;
}
/* 20160717 Remove calendar
div.affiliates div.news div.calendar {
  width: 100%;
  background: white;
  margin-top: 20px;
}
div.affiliates div.news div.calendar .header-day {
  background: #ccc;
  height: 40px !important;
  text-align:center;
  vertical-align:middle;
}
div.affiliates div.news div.calendar .header-day span {
  color: black;
}
div.affiliates div.news div.calendar .zones {
  width: 100%;
  border-bottom: 1px solid #ccc;
  border-left: 1px solid #ccc;
}
div.affiliates div.news div.calendar .zones li {
  display: inline-block;
  padding: 10px 15px 10px 15px;
  border-right: 1px solid #ccc;
  border-top: 3px solid #ccc;
  cursor: pointer;
}
div.affiliates div.news div.calendar .zones li.on {
  border-top: 0;
}
div.affiliates div.news div.calendar .zones li span {
  padding-right: 10px;
}
div.affiliates div.news div.calendar .zones li:after {
  content: url(../img/arr-down.png);
}
div.affiliates div.news div.calendar .clndr-content {
  width: 100%;
  position: relative;
}
div.affiliates div.news div.calendar .clndr-content .clndr {
  width: 100%;
  font-family: Arial;
}
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-controls {
  padding: 15px 0 15px 15px;
}
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-controls > div.control {
  float: left;
  margin-right: 10px;
}
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-grid {
  border-top: 1px solid #eaeaea;
  padding-bottom: 30px;
}
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-grid .days-of-the-week {
	width:100%;
}
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-grid .header-day,
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-grid .day {
  width: 14.2%;
  height: 100px;
  border-left: 1px solid #eaeaea;
  border-bottom: 1px solid #eaeaea;
  position: relative;
}
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-grid .header-day span,
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-grid .day span {
  position: absolute;
  left: 5px;
  top: 5px;
}
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-grid .header-day p,
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-grid .day p {
  cursor: pointer;
  padding-left: 30px;
  line-height: 17px;
  font-size: 14px;
  padding-top: 5px;
}
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-grid .header-day p:before,
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-grid .day p:before {
  content: url(../img/arr-orange.png);
}
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-table {
  width: 100%;
}
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-table tr td {
  width: 14.2%;
  height: 100px;
  position: relative;
}
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-table tr td:before {
  content: "";
  height: 100%;
  width: 1px;
  background: #ccc;
  display: block;
  position: absolute;
  right: 0;
}
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-table tr td:after {
  content: "";
  width: 100%;
  height: 1px;
  background: #ccc;
  display: block;
  position: absolute;
  bottom: 0;
}
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-table tr td:last-child:before {
  width: 0;
}
div.affiliates div.news div.calendar .clndr-content .clndr .clndr-table tr td .day-contents {
  padding: 5px 0 0 5px;
  color: #ccc;
}
*/
div.affiliates div.org div.org-content-1,
div.affiliates div.org div.org-content-2,
div.affiliates div.org div.org-content-3 {
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
}
div.affiliates div.org div.org-content-1 {
  background: white;
  margin-top: 20px;
  margin-bottom: 20px;
  position: relative;
}
div.affiliates div.org div.org-content-1 h1 {
  font-size: 30px;
  color: #5f7070;
  padding: 15px 23px 15px 23px;
}
div.affiliates div.org div.org-content-1 div.line {
  display: none;
  width: 1px;
  height: 220px;
  background: #ccc;
  left: 35%;
  top: 80px;
  position: absolute;
}
div.affiliates div.org div.org-content-1 table {
  border-top: 1px solid #ccc;
  width: 90%;
  height: 260px;
  position: relative;
  left: 5%;
}
div.affiliates div.org div.org-content-1 table tr {
  height: 65px;
}
div.affiliates div.org div.org-content-1 table tr td {
  font-size: 20px;
  vertical-align: middle;
  color: #666666;
  padding: 20px;
}
div.affiliates div.org div.org-content-1 table tr td:first-child {
  width: 125px;
  padding-left: 3px;
}
div.affiliates div.org div.org-content-1 table tr td:first-child:after {
  content: " :";
}
div.affiliates div.org div.org-content-1 table tr td:nth-child(2) {
  border-right: 1px solid #eaeaea;
}
div.affiliates div.org div.org-content-2 {
  background: #00cccc;
  margin-bottom: 20px;
  position: relative;
}
div.affiliates div.org div.org-content-2 h1 {
  font-size: 30px;
  color: white;
  padding: 15px 23px 15px 3.2%;
}
div.affiliates div.org div.org-content-2 table {
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  width: 94%;
  height: 150px;
  position: relative;
  left: 3%;
  margin-bottom: 30px;
}
div.affiliates div.org div.org-content-2 table tr {
  height: 75px;
}
div.affiliates div.org div.org-content-2 table tr td {
  font-size: 20px;
  vertical-align: middle;
  color: white;
  position: relative;
}
div.affiliates div.org div.org-content-2 table tr td:first-child {
  border-right: 1px solid #ccc;
}
div.affiliates div.org div.org-content-2 table tr td:nth-child(2) {
  padding-left: 7%;
}
div.affiliates div.org div.org-content-2 ul {
  padding-bottom: 20px;
  display: block;
}
div.affiliates div.org div.org-content-2 ul li {
  display: block;
  width: 45%;
  margin-bottom: 20px;
  background: white;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  text-align: center;
  height: 40px;
  float: left;
  margin-left: 3%;
}
div.affiliates div.org div.org-content-2 ul li p {
  line-height: 40px;
  font-size: 24px;
  color: #333333;
}
div.affiliates div.org div.org-content-2 ul li:last-child {
  clear: right;
}
div.affiliates div.org div.org-content-3 {
  position: relative;
}
div.affiliates div.org div.org-content-3 h1 {
  font-size: 30px;
  color: #5f7070;
  padding: 15px 23px 15px 23px;
}
div.affiliates div.org div.org-content-3 ul.tree > li {
  width: 100%;
  background: white;
  display: block;
  margin-bottom: 10px;
  padding-left: 25px;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap {
  padding-bottom: 60px;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem {
  width: 175px;
  height: 145px;
  float: left;
  position: relative;
  margin-right: 25px;
  margin-top: 40px;
  cursor: pointer;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem div.award {
  width: 41px;
  height: 55px;
  background: url(../img/award.png) center center no-repeat;
  position: absolute;
  left: -20px;
  top: 30px;
  z-index: 10;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 {
  font-size: 14px;
  color: #666;
  padding: 5px 0 5px 5px;
  position: relative;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 span {
  font-size: 16px;
}

body.is-mobile div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 table {
  width: 350px;
  left: 0px;
}
body.is-mobile div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 table.right {
  left: -180px;
}

div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 table {
  width: 460px;
  height: 210px;
  background: #ebeff1;
  position: absolute;
  left: 135px;
  top: 33px;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
  z-index: 11;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 table tr:last-child td {
  border-bottom: 0;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 table td {
  height: 40px;
  border-bottom: 1px solid #cdd7dc;
  vertical-align: middle;
  padding-left: 10px;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 table td:first-child {
  width: 85px;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 table td:nth-child(2) {
  width: 130px;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 table td:nth-child(3) {
  width: 70px;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 table:before {
  content: "";
  position: absolute;
  top: -10px;
  left: 17px;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #ebeff1;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 table.right {
  left: -235px;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 table.right:before {
  left: 387px;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 div.little-people {
  position: absolute;
  background: url(../img/little-people.png) center center no-repeat;
  width: 28px;
  height: 28px;
  right: 0;
  top: 0;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem h1 div.little-people.a {
  background: url(../img/little-people-green.png) center center no-repeat;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem table.scores {
  height: 100%;
  width: 100%;
  border: 1px solid #999999;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem table.scores td {
  width: 50%;
  vertical-align: middle;
  padding: 0;
  margin: 0;
  padding: 5px 0 5px 0;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem table.scores td:first-child {
  padding-left: 10px;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem table.scores td:first-child span {
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  padding: 8px;
  background: #999999;
  color: white;
  font-size: 12px;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem table.scores tr:first-child td {
  padding-top: 10px;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem table.scores tr:last-child td {
  padding-bottom: 10px;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem.on table.scores {
  border: 1px solid #19bb9b;
}
div.affiliates div.org div.org-content-3 ul.tree > li div.wrap div.treeItem.on table.scores td:first-child span {
  background: #19bb9b;
}
div.affiliates div.org div.org-content-3 ul.info {
  position: absolute;
  right: 3px;
  top: 20px;
}
div.affiliates div.org div.org-content-3 ul.info li {
  display: block;
  float: left;
  color: #666;
  font-size: 20px;
  margin-right: 50px;
}
div.affiliates div.downloads table {
  width: 100%;
  margin-top: 20px;
  margin-bottom: 20px;
}
div.affiliates div.downloads table th {
  background: #333;
  color: white;
  text-align: center;
  vertical-align: middle;
  font-size: 21px;
  padding: 20px;
}
div.affiliates div.downloads table td {
  background: #e7e7e7;
  color: #333;
  height: 130px;
  vertical-align: middle;
}
div.affiliates div.downloads table td p {
  padding: 20px;
  font-size: 21px;
  line-height: 30px;
}
div.affiliates div.downloads table td p span {
  font-size: 18px;
}
div.affiliates div.downloads table td img {
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
div.affiliates div.downloads table th,
div.affiliates div.downloads table td {
  font-size: 21px;
  border-right: 1px solid white;
  border-bottom: 1px solid white;
}
div.affiliates div.downloads table th:first-child,
div.affiliates div.downloads table td:first-child {
  width: 20%;
}
div.affiliates div.downloads table th:last-child,
div.affiliates div.downloads table td:last-child {
  width: 10%;
  border-right: 0;
}
div.affiliates div.shopping {
  position: relative;
}
div.affiliates div.shopping h1 {
  font-size: 21px;
  color: #333;
  padding-top: 65px;
  padding-bottom: 15px;
  position: relative;
}
div.affiliates div.shopping h1 a.shopping-list {
  background: #39ae39;
  border: 0;
  color: white;
  font-size: 20px;
  padding: 10px 45px 10px 10px;
  position: absolute;
  right: 0px;
  bottom: 7px;
  width:auto!important;
}
div.affiliates div.shopping h1 a.shopping-list:after {
  content: url(../img/icons/cart.png);
  position: absolute;
  right: 10px;
  top: 7px;
}
div.affiliates div.shopping h1 a.shopping-list span.count {
  position: absolute;
  border-radius: 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  background: #ff2600;
  color: white;
  display: block;
  left: -10px;
  top: -10px;
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 20px;
}

div.affiliates div.shopping h1 a.order {
  background: #39ae39;
  border: 0;
  color: white;
  font-size: 20px;
  padding: 10px 25px 10px 55px;
  position: absolute;
  right: 160px;
  bottom: 7px;
  width:auto!important;
  cursor:pointer;
}
div.affiliates div.shopping h1 a.order:before {
  content: url(../img/icons/cart.png);
  position: absolute;
  left: 10px;
  top: 7px;
}

div.affiliates div.shopping ul.categories {
  width: 100%;
  height: 45px;
  background: white;
  position: absolute;
  text-align: center;
  z-index: 10;
}
div.affiliates div.shopping ul.categories li {
  display: inline-block;
  font-size: 20px;
  line-height: 45px;
  padding: 0 30px 0 30px;
  cursor: pointer;
}
div.affiliates div.shopping ul.categories li.on {
  color: #00cccc;
}

div.affiliates div.shopping ul.categories li:hover:not(.on) {
  background: #009f3e;
  color: white;
}
div.affiliates div.shopping table {
  width: 100%;
  margin-bottom: 20px;
}
div.affiliates div.shopping table th {
  background: #333;
  color: white;
  text-align: center;
  vertical-align: middle;
  font-size: 21px;
  padding: 20px;
}
div.affiliates div.shopping table td {
  background: #e7e7e7;
  color: #333;
  height: 80px;
  vertical-align: middle;
  text-align: center;
}

div.affiliates div.shopping a.bottom-shopping-list {
  float: right;
  margin:20px 0px 50px 30px;
  padding: 7px 40px 7px 10px;
  background: #39ae39;
  border: 0;
  position: relative;
  font-size: 20px;
  color: white;
}
div.affiliates div.shopping a.bottom-shopping-list:after {
  content: "";
  display: block;
  position: absolute;
  right: 10px;
  width: 30px;
  height: 20px;
  background: url("../img/cart-icon.jpg") center center no-repeat;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
div.affiliates div.shopping a.bottom-shopping-list span.count {
  position: absolute;
  border-radius: 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  background: #ff2600;
  color: white;
  display: block;
  left: -10px;
  top: -10px;
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 20px;
}

div.affiliates div.shopping table td:first-child {
  width: 10%;
}
div.affiliates div.shopping table td:last-child {
  width: 10%;
  border-right: 0;
}
div.affiliates div.shopping table td:nth-child(2) {
  width: 40%;
}
div.affiliates div.shopping table td:nth-child(3) {
  width: 10%;
}
div.affiliates div.shopping table td:nth-child(3) input {
  width: 60%;
  height: 30px;
  font-size: 30px;
}
div.affiliates div.shopping table th,
div.affiliates div.shopping table td {
  font-size: 21px;
  border-right: 1px solid white;
  border-bottom: 1px solid white;
}
div.affiliates div.shopping button.order {
  float: right;
  margin-top: 20px;
  margin-bottom: 50px;
  padding: 5px 30px 5px 60px;
  background: #39ae39;
  border: 0;
  position: relative;
  font-size: 20px;
  color: white;
}
div.affiliates div.shopping button.order:before {
  content: "";
  display: block;
  position: absolute;
  left: 15px;
  width: 30px;
  height: 20px;
  background: url("../img/cart-icon.jpg") center center no-repeat;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
div.affiliates div.shopping button.order a {
  font-size: 20px;
  color: white;
}
div.affiliates div.list {
  margin-top: 20px;
}
div.affiliates div.list h3 {
  font-size: 24px;
  padding-bottom: 20px;
  color: #00cccc;
}
div.affiliates div.list button {
  background: #00cccc;
  color: white;
  padding: 10px 25px 10px 25px;
  border: 0;
  font-size: 20px;
}
div.affiliates div.list ul.options {
  display: block;
  width: 100%;
  right: 0;
}
div.affiliates div.list ul.options li {
  display: block;
  float: right;
  background: #00cccc;
  padding: 10px;
  margin-left: 10px;
}
div.affiliates div.list ul.options li a,
div.affiliates div.list ul.options li span {
  font-size: 23px;
  color: white;
}
div.affiliates div.list ul.options li:last-child {
  clear: left;
  background: none;
}
div.affiliates div.list ul.options li:last-child a {
  color: black;
}
div.affiliates div.list ul.options li.continue {
  background: none;
  font-size: 23px;
  color: #222;
}
div.affiliates div.list div.step {
  background: white;
  margin-bottom: 15px;
}
div.affiliates div.list div.step .step-title {
  color: #5f7070;
  font-size: 24px;
  padding: 20px;
  cursor: pointer;
  position: relative;
}
div.affiliates div.list div.step .step-title.ready:before {
  content: "編輯";
  display: block;
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  background: #00cccc;
  color: white;
  height: 35px;
  right: 20px;
  padding: 3px 20px 3px 20px;
  line-height: 35px;
}
div.affiliates div.list div.step .content {
  display: none;
}
div.affiliates div.list div.step.on .content {
  display: block;
}
div.affiliates div.list div.step.on .step-title {
  border-bottom: 1px solid #ccc;
}
div.affiliates div.list div.step.on .step-title:before {
  content: "";
  display: none;
}
div.affiliates div.list div.step .confirm-button {
  border-top: 1px solid #eaeaea;
  padding-top: 20px;
  padding-bottom: 20px;
}
div.affiliates div.list div.step .confirm-button button {
  float: right;
  margin-right: 20px;
}
div.affiliates div.list div.step-1 {
  margin-top: 20px;
  position: relative;
}
div.affiliates div.list div.step-1 .note {
  color: #5f7070;
  font-size: 22px;
  position: absolute;
  right: 20px;
  top: 0px;
  line-height: 64px;
}
div.affiliates div.list div.step-1 hr {
  border: 1px solid #eaeaea;
}
div.affiliates div.list div.step-1 table {
  width: 100%;
  font-size: 22px;
}
div.affiliates div.list div.step-1 table th {
  color: #009da6;
  text-align: center;
  vertical-align: middle;
  padding: 20px;
}
div.affiliates div.list div.step-1 table td {
  text-align: center;
  vertical-align: middle;
  color: #333;
  padding: 20px;
  font-size: 20px;
}
div.affiliates div.list div.step-1 table td.total {
  text-align: right;
  background: #666;
}
div.affiliates div.list div.step-1 table td.total span {
  padding: 20px;
  font-size: 20px;
  color: white;
}
div.affiliates div.list div.step-1 table input {
  width: 50px;
  height: 30px;
  text-align: center;
}
div.affiliates div.list div.step-1 button.confirm {
  padding: 10px 20px 10px 20px;
  background: #00cccc;
  margin: 20px;
  float: right;
  border: 0;
}
div.affiliates div.list div.step-1 button.confirm a {
  font-size: 20px;
  color: white;
}
div.affiliates div.list div.spacer {
  width: 100%;
  height: 10px;
  background: #ededed;
}
div.affiliates div.list div.step-2 div.content {
  margin-top: 20px;
}
div.affiliates div.list div.step-2 div.part-1 .deliveryType,
div.affiliates div.list div.step-2 div.part-1 .paymentType {
  width: 48%;
  float: left;
}
div.affiliates div.list div.step-2 div.part-1 div.remind {
  width: 100%;
  background: #ededed url(../img/remind.jpg) 15px center no-repeat;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  margin-top: 30px;
}
div.affiliates div.list div.step-2 div.part-1 div.remind ul {
  padding-left: 110px;
  list-style-type: disc;
  list-style-position: outside;
}
div.affiliates div.list div.step-2 div.part-1 div.remind ul li {
  font-size: 18px;
  color: #666666;
  line-height: 22px;
  margin-bottom: 10px;
  padding-right: 30px;
}
div.affiliates div.list div.step-2 div.part-1 div.remind ul li:first-child {
  padding-top: 20px;
}
div.affiliates div.list div.step-2 div.part-1 div.remind ul li:last-child {
  padding-bottom: 20px;
}
div.affiliates div.list div.step-2 div.part-1 div.note-wrap {
  padding: 20px;
}
div.affiliates div.list div.step-2 div.part-1 ul.note {
  margin-top: 15px;
  margin-bottom: 15px;
  display: block;
  margin-left: 20px;
  padding-right: 30px;
}
div.affiliates div.list div.step-2 div.part-1 ul.note li {
  margin-bottom: 10px;
  font-size: 16px;
  color: #666666;
  list-style-type: disc;
  list-style-position: outside;
  line-height: 24px;
}
div.affiliates div.list div.step-2 div.part-1 div.note {
  margin-bottom: 25px;
}
div.affiliates div.list div.step-2 div.part-1 div.note span {
  font-size: 20px;
  padding-right: 15px;
}
div.affiliates div.list div.step-2 div.part-1 div.note textarea {
  height: 100px;
  width: 80%;
  display: inline-block;
  vertical-align: top;
  border: 1px solid #cccccc;
}
div.affiliates div.list div.step-2 div.part-1 .deliveryType {
  margin: 0 2% 0 2%;
}
div.affiliates div.list div.step-2 div.part-1 .deliveryType table td {
  font-size: 18px;
  color: #666666;
  padding: 10px 30px 10px 0;
}
div.affiliates div.list div.step-2 div.part-1 .deliveryType table td:first-child {
  width: 20%;
}
div.affiliates div.list div.step-2 div.part-1 .deliveryType table td input {
  margin-right: 10px;
}
div.affiliates div.list div.step-2 div.part-1 .paymentType table td {
  font-size: 18px;
  color: #666666;
  padding: 10px 30px 10px 0;
}
div.affiliates div.list div.step-2 div.part-1 .paymentType table td:first-child {
  width: 25%;
}
div.affiliates div.list div.step-2 div.part-1 .paymentType table td input {
  margin-right: 10px;
  margin-bottom: 15px;
}
div.affiliates div.list div.step-2 div.part-2 div.member-info,
div.affiliates div.list div.step-2 div.part-2 div.receiver-info {
  width: 45%;
  float: left;
  padding-top: 20px;
}
div.affiliates div.list div.step-2 div.part-2 div.member-info {
  margin: 0 5% 0 5%;
}
div.affiliates div.list div.step-2 div.part-2 div.member-info div.info {
  margin-top: 20px;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  background: #00cccc;
  padding: 20px 0 20px 0;
}
div.affiliates div.list div.step-2 div.part-2 div.member-info div.info p {
  color: white;
  font-size: 20px;
  line-height: 40px;
  padding: 0 15px 0 15px;
}
div.affiliates div.list div.step-2 div.part-2 div.member-info div.info p span {
  color: white;
  font-size: 20px;
}
div.affiliates div.list div.step-2 div.part-2 div.member-info div.info p span:after {
  content: " : ";
}
div.affiliates div.list div.step-2 div.part-2 div.member-info div.info p em {
  color: white;
  font-size: 20px;
}
div.affiliates div.list div.step-2 div.part-2 div.receiver-info input[type="text"],
div.affiliates div.list div.step-2 div.part-2 div.receiver-info label,
div.affiliates div.list div.step-2 div.part-2 div.receiver-info select,
div.affiliates div.list div.step-2 div.part-2 div.receiver-info option {
  font-size: 20px;
  color: #666;
  height: 30px;
}
div.affiliates div.list div.step-2 div.part-2 div.receiver-info input[type="text"] {
  width: 80%;
  border: 1px solid #ccc;
}
div.affiliates div.list div.step-2 div.part-2 div.receiver-info select {
  border: 1px solid #ccc;
  height: 30px;
  width: 40%;
}
div.affiliates div.list div.step-2 div.part-2 div.receiver-info table {
  width: 100%;
}
div.affiliates div.list div.step-2 div.part-2 div.receiver-info table tr td {
  height: 45px;
  vertical-align: middle;
}
div.affiliates div.list div.step-2 div.part-2 div.receiver-info table tr td:first-child {
  width: 100px;
}
div.affiliates div.list div.step-3 .content {
  margin-top: 20px;
  width: 95%;
  margin: auto;
}
div.affiliates div.list div.step-3 p.note {
  font-size: 20px;
  color: #666;
  padding: 20px 0 20px 0;
}
div.affiliates div.list div.step-3 span.add-fee {
  color: yellow !important;
}
body.is-mobile div.affiliates div.list div.step-3 span.add-fee {
  color: #333333 !important;
}
div.affiliates div.list div.step-3 table {
  width: 100%;
}
div.affiliates div.list div.step-3 table.order-info {
  margin-bottom: 20px;
}
div.affiliates div.list div.step-3 table.order-info tr td,
div.affiliates div.list div.step-3 table.order-info tr th {
  height: 35px;
  vertical-align: middle;
  text-align: center;
  font-size: 20px;
  border: 2px solid white;
}
div.affiliates div.list div.step-3 table.order-info tr th {
  background: #222222;
  color: white;
}
div.affiliates div.list div.step-3 table.order-info tr td {
  background: #e3e3e3;
  color: #333;
}
div.affiliates div.list div.step-3 table.order-info tr:last-child td {
  background: #666666;
  text-align: right;
  padding-right: 15px;
  color: white;
}
div.affiliates div.list div.step-3 table.order-info tr:last-child td span {
  font-size: 20px;
  color: white;
}
div.affiliates div.list div.step-3 table.receiver-info {
  background: #00cccc;
  margin-bottom: 20px;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
}
div.affiliates div.list div.step-3 table.receiver-info tr td {
  color: white;
  font-size: 20px;
  padding: 20px;
}
div.affiliates div.list div.step-4 div.content {
  padding-top: 20px;
  width: 90%;
  margin: auto;
}
div.affiliates div.list div.step-4 div.content div.left,
div.affiliates div.list div.step-4 div.content div.right {
  float: left;
}
div.affiliates div.list div.step-4 div.content div.left {
  width: 47%;
  margin-right: 3%;
}
div.affiliates div.list div.step-4 div.content div.left p.note {
  line-height: 35px;
  font-size: 20px;
  color: #666666;
}
div.affiliates div.list div.step-4 div.content div.left p.note span {
  font-size: 20px;
  color: #666666;
  padding: 0 10px 0 10px;
}
div.affiliates div.list div.step-4 div.content div.left table {
  width: 100%;
  background: #e8e8e8;
  padding: 10px;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  overflow: hidden;
  margin: 20px 0 20px 0;
}
div.affiliates div.list div.step-4 div.content div.left table tr th {
  border-bottom: 1px solid #ccc;
  border-top: 1px solid #ccc;
}
div.affiliates div.list div.step-4 div.content div.left table tr td,
div.affiliates div.list div.step-4 div.content div.left table tr th {
  padding: 20px;
  text-align: center;
  font-size: 20px;
}
div.affiliates div.list div.step-4 div.content div.left table tr:first-child td {
  text-align: left;
}
div.affiliates div.list div.step-4 div.content div.left table tr:last-child td {
  background: #333;
  color: white;
}
div.affiliates div.list div.step-4 div.content div.left p.order-info {
  font-size: 18px;
  color: #666666;
  padding-bottom: 40px;
  line-height: 24px;
}
div.affiliates div.list div.step-4 div.content div.left p.contact-info {
  font-size: 20px;
  color: #666666;
  padding-bottom: 20px;
  line-height: 24px;
}
div.affiliates div.list div.step-4 div.content div.right {
  width: 50%;
  padding-top: 40px;
}
div.affiliates div.list div.step-4 div.content div.right h2,
div.affiliates div.list div.step-4 div.content div.right p {
  font-size: 20px;
  line-height: 28px;
}
div.affiliates div.list div.step-4 div.content div.right h2.wire-note {
  color: #333;
  padding-bottom: 30px;
}
div.affiliates div.list div.step-4 div.content div.right p.wire-info {
  padding-bottom: 40px;
  color: #666;
}
div.affiliates div.list div.step-4 div.content div.right p.if {
  padding-left: 35px;
  background: url(../img/warning.jpg) left center no-repeat;
}
div.affiliates div.list div.step-4 div.content button.confirm a {
  font-size: 20px;
  color: white;
}
div.affiliates div.list .popup-layer {
  width: 100%;
  height: 100%;
}
div.affiliates div.list .popup-layer div.wrap {
  width: 690px;
  height: 300px;
  position: absolute;
  z-index: 5;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  background: white;
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
}
div.affiliates div.list .popup-layer div.wrap h1 {
  color: #58cdcc;
  font-size: 24px;
  padding: 40px 0 30px 60px;
}
div.affiliates div.list .popup-layer div.wrap p {
  font-size: 18px;
  padding: 10px 0 10px 60px;
  line-height: 30px;
}
div.affiliates div.list .popup-layer div.wrap button.confirm {
  font-size: 18px;
  width: 150px;
  height: 33px;
  background: #58cdcc;
  color: white;
  border: 0;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
div.affiliates div.list .popup-layer div.wrap button.close {
  border: 0;
  background: #333;
  padding: 10px 20px 10px 20px;
  position: fixed;
  right: 0;
  top: 0;
  font-size: 25px;
  color: white;
  cursor: pointer;
}
div.affiliates div.list .popup-layer div.bg {
  position: fixed;
  background: black;
  filter: alpha(opacity=(@a*100));
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  opacity: 0.8;
  z-index: 3;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
div.affiliates div.query {
  margin-top: 20px;
  margin-bottom: 50px;
  background: white;
}
div.affiliates div.query h1 {
  font-size: 21px;
  color: #333;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 30px;
  border-bottom: 1px solid #eaeaea;
}
div.affiliates div.query div.orders-holder {
  margin-top: 40px;
  width: 1000px;
  height: 140px;
  position: relative;
  left: 80px;
  margin-bottom: 60px;
}
div.affiliates div.query div.orders-holder div.arrows img {
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
div.affiliates div.query div.orders-holder div.arrows img.left {
  left: -50px;
}
div.affiliates div.query div.orders-holder div.arrows img.right {
  right: -50px;
}
div.affiliates div.query div.orders-holder div.wrap {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
div.affiliates div.query div.orders-holder div.wrap ul.orders {
  display: block;
  width: 100000px;
  height: 100%;
  overflow: hidden;
  position: relative;
}
div.affiliates div.query div.orders-holder div.wrap ul.orders > li {
  display: block;
  float: left;
  width: 235px;
  margin-right: 20px;
  background: white;
}
div.affiliates div.query div.orders-holder div.wrap ul.orders > li.on {
  background: #00cccc;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
}
div.affiliates div.query div.orders-holder div.wrap ul.orders > li.on > ul {
  border: 0;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
}
div.affiliates div.query div.orders-holder div.wrap ul.orders > li.on > ul > li {
  color: white;
}
div.affiliates div.query div.orders-holder div.wrap ul.orders > li.on > ul > li span {
  background: white;
  color: #00cccc;
}
div.affiliates div.query div.orders-holder div.wrap ul.orders > li > ul {
  border: 1px solid #666;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
}
div.affiliates div.query div.orders-holder div.wrap ul.orders > li > ul > li {
  /*height: 30px;*/
  margin: 10px;
  display: block;
}
div.affiliates div.query div.orders-holder div.wrap ul.orders > li > ul > li:first-child {
  margin-top: 10px;
}
div.affiliates div.query div.orders-holder div.wrap ul.orders > li > ul > li span {
  background: #666666;
  color: white;
  line-height: 30px;
  display: inline-block;
  width: 100px;
  text-align: center;
  height: 100%;
  margin-right: 15px;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
}

div.affiliates div.query div.orders-holder div.wrap ul.orders > li > ul > li em {
  width:80px;
  display:inline-block;
}

div.affiliates div.query div.orders-holder div.wrap ul.orders > li:last-child {
  clear: right;
}
div.affiliates div.query div.hr {
  border-top: 1px solid #ccc;
}
div.affiliates div.query div.current {
  width: 765px;
  margin: auto;
}
div.affiliates div.query div.current > ul {
  display: block;
  margin-top: 50px;
  margin-bottom: 15px;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border: 1px solid #666;
  padding: 20px;
}
div.affiliates div.query div.current > ul li {
  display: block;
  float: left;
  width: 48%;
  height: 30px;
  font-size: 20px;
  color: #666666;
  margin-bottom: 25px;
}
div.affiliates div.query div.current > ul li span {
  padding-left: 20px;
  font-size: 20px;
}
div.affiliates div.query div.current > ul li:last-child {
  clear: right;
}

div.affiliates div.query div.current table.order_query_users {
  width: 100%;
  background: #ffffff;
  border:1px solid #999999;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  margin:20px 0px;
}
div.affiliates div.query div.current table.order_query_users th {
  color: #00cccc;
  font-size: 20px;
  padding: 15px;
  vertical-align: middle;
  text-align: left;
}
div.affiliates div.query div.current table.order_query_users td {
  font-size: 20px;
  color: #333;
  text-align: left;
  padding: 20px;
}

div.affiliates div.query div.current table.order_query_product_list {
  width: 100%;
  background: #eeeeee;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
}
div.affiliates div.query div.current table.order_query_product_list th {
  color: #00cccc;
  font-size: 20px;
  padding: 15px;
  vertical-align: middle;
  text-align: center;
  border-bottom: 1px solid :;
}
div.affiliates div.query div.current table.order_query_product_list td {
  font-size: 20px;
  color: #333;
  text-align: center;
  padding: 20px;
}
div.affiliates div.query div.current table.order_query_product_list td.total {
  font-size: 22px;
  background: white;
}
div.affiliates div.query div.current table.order_query_product_list td.total span {
  font-size: 22px;
  color: #000000;
  padding-right: 15px;
}
div.affiliates div.query div.current table.order_query_product_list td.total span.spacer {
  padding-right: 55px;
}
div.affiliates div.edu div.content {
  width: 100%;
  margin: 20px 0 50px 0;
}
div.affiliates div.edu div.content h1 {
  font-size: 40px;
  color: #019f3e;
  padding-bottom: 20px;
}
div.affiliates div.edu div.content p {
  font-size: 16px;
  color: #333;
  padding-bottom: 40px;
}
div.affiliates div.edu div.content div.videos-1 ul.videos,
div.affiliates div.edu div.content div.videos-2 ul.videos {
  position: relative;
}
div.affiliates div.edu div.content div.videos-1 ul.videos li,
div.affiliates div.edu div.content div.videos-2 ul.videos li {
  display: block;
  width: 225px;
  height: 190px;
  background: white;
  margin-bottom: 12px;
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
}
div.affiliates div.edu div.content div.videos-1 ul.videos li iframe,
div.affiliates div.edu div.content div.videos-2 ul.videos li iframe,
div.affiliates div.edu div.content div.videos-1 ul.videos li img,
div.affiliates div.edu div.content div.videos-2 ul.videos li img {
  cursor: pointer;
  width: 100%;
  height: 158px;
  border-bottom: 2px solid #8dc041;
}
div.affiliates div.edu div.content div.videos-1 ul.videos li h2,
div.affiliates div.edu div.content div.videos-2 ul.videos li h2 {
  text-align: center;
  font-size: 16px;
}
div.affiliates div.edu div.content div.videos-1 ul.videos div.current-video,
div.affiliates div.edu div.content div.videos-2 ul.videos div.current-video {
  width: 950px;
  height: 595px;
  background: red;
  position: absolute;
  left: 235px;
  background: black;
  top: 0;
}
div.affiliates div.edu div.content div.videos-1 ul.videos div.current-video iframe,
div.affiliates div.edu div.content div.videos-2 ul.videos div.current-video iframe {
  width: 100%;
  height: 100%;
}
div.contacts {
  width: 1200px;
  margin: auto;
}
div.contacts p {
  font-size: 16px;
}
div.contacts > h1 {
  font-size: 20px;
  text-align: center;
  padding-bottom: 75px;
  padding-top: 55px;
  font-weight: bold;
}
div.contacts div.maps {
  width: 700px;
  float: left;
}
div.contacts div.maps .gmap {
  margin-bottom: 20px;
}
div.contacts div.maps p {
  line-height: 23px;
}
div.contacts div.contact-info {
  width: 455px;
  float: left;
  margin-left: 40px;
}
div.contacts div.contact-info p {
  line-height: 23px;
  color: white;
}
div.contacts div.contact-info ul li {
  cursor: pointer;
  margin-bottom: 10px;
  padding: 15px;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
}
div.contacts div.contact-info ul li p {
  color: black;
}
div.contacts div.contact-info ul li p {
  line-height: 23px;
}
div.contacts div.contact-info ul li p.name {
  font-weight: bold;
}
div.contacts div.contact-info ul li p.addr {
  padding-left: 25px;
  background: url(../img/icons/addr.png) left 5px no-repeat;
}
div.contacts div.contact-info ul li p.tel {
  padding-left: 25px;
  background: url(../img/icons/icon-tel.png) left 5px no-repeat;
}
div.contacts div.contact-info ul li.on {
  background: #00cccc;
}
div.contacts div.contact-info ul li.on p {
  color: white;
}
div.contacts div.contact-info ul li.on p.addr {
  background: url(../img/icons/addr-on.png) left 5px no-repeat;
}
div.contacts div.contact-info ul li.on p.tel {
  background: url(../img/icons/tel-on.png) left 5px no-repeat;
}
div.contacts div.contact-info ul li.hover {
  background: #cccccc;
}
div.contacts div.contact-form {
  width: 590px;
  height: 520px;
  background: white;
  margin: auto;
  margin-top: 65px;
  margin-bottom: 50px;
}
div.contacts div.contact-form h1 {
  line-height: 60px;
  text-align: center;
  border-bottom: 1px solid #eaeaea;
  font-size: 23px;
  font-weight: bold;
}
div.contacts div.contact-form form ul {
  margin-left: 80px;
  margin-top: 30px;
}
div.contacts div.contact-form form ul li {
  margin-bottom: 20px;
}
div.contacts div.contact-form form ul li span {
  display: inline-block;
  width: 72px;
  font-size: 18px;
  padding-right: 15px;
}
div.contacts div.contact-form form input[type='text'],
div.contacts div.contact-form form textarea {
  width: 320px;
}
div.contacts div.contact-form form input[type='text'] {
  height: 35px;
  line-height: 35px;
  border: 1px solid #ccc;
}
div.contacts div.contact-form form button {
  background: #00cccc;
  color: white;
  border: 0;
  font-size: 24px;
  padding: 10px 20px 10px 20px;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  position: relative;
}
div.product-popup {
  position: fixed;
  z-index: 20;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  overflow: hidden;
}
div.product-popup div.bg {
  position: fixed;
  z-index: 10;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  filter: alpha(opacity=(@a*100));
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  opacity: 0.8;
  background: black;
}
div.product-popup .wrap {
  position: relative;
  z-index: 11;
  width: 850px;
  height: 80%;
  background: white;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  overflow-y: hidden;
}
div.product-popup .wrap > div {
  width: 95%;
  height: 95%;
  overflow-y: auto;
  position: relative;
  left: 5%;
  top: 5%;
}
div.product-popup .wrap > div .supply-date {
  width: 80px;
  height: 80px;
  background: #ffcc00;
  border-radius: 80px;
  -webkit-border-radius: 80px;
  -moz-border-radius: 80px;
  position: absolute;
  left: 210px;
  top: 180px;
}
div.product-popup .wrap > div .supply-date p {
  font-size: 20px;
  line-height: 25px;
  text-align: center;
  position: relative;
  display: block;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
div.product-popup .wrap > div img {
  float: left;
  width: 250px;
  margin-right: 50px;
  margin-bottom: 20px;
}
div.product-popup .wrap > div h1 {
  color: #333;
  font-size: 25px;
  padding-bottom: 10px;
}
div.product-popup .wrap > div h2 {
  font-size: 20px;
  padding-bottom: 10px;
  color: black;
}
div.product-popup .wrap > div h2 span {
  font-size: 20px;
  color: #39ae39;
  padding-right: 70px;
}
div.product-popup .wrap > div p.inputs {
  padding-bottom: 15px;
}
div.product-popup .wrap > div p.inputs input {
  background: #eaeaea;
  border: 0;
  color: #333;
  margin-right: 10px;
  height: 35px;
}
div.product-popup .wrap > div p.inputs input.qt {
  width: 90px;
  text-align: center;
}
div.product-popup .wrap > div p.inputs button.num {
  background: url(../img/btn-bg.png) center center no-repeat;
  color: #333;
  margin-right: 10px;
  border: 0;
  width: 42px;
  height: 29px;
  font-size: 18px;
}
div.product-popup .wrap > div p.inputs button.order {
  padding: 5px 30px 5px 60px;
  font-size: 20px;
  background: #39ae39;
  border: 0;
  color: white;
  position: relative;
}
div.product-popup .wrap > div p.inputs button.order:before {
  content: "";
  display: block;
  position: absolute;
  left: 15px;
  width: 30px;
  height: 20px;
  background: url("../img/cart-icon.jpg") center center no-repeat;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
div.product-popup .wrap > div p {
  font-size: 15px;
  color: #333;
  line-height: 25px;
}
div.product-popup .wrap > div p span {
  font-weight: bold;
  padding-right: 10px;
  font-size: 15px;
}
div.product-popup .wrap button.close {
  border: 0;
  background: #333;
  padding: 10px 20px 10px 20px;
  position: fixed;
  right: 0;
  top: 0;
  font-size: 25px;
  color: white;
  cursor: pointer;
}
div.product-popup .wrap.promo:before {
  content: "";
  display: block;
  width: 93px;
  height: 84px;
  background: url("../img/promo.png") left top no-repeat;
  position: absolute;
  left: 0;
  top: 0;
}
div.catePopup {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 20;
  left: 0;
  top: 0;
}
div.catePopup div.content {
  position: relative;
}
div.catePopup button.close {
  border: 0;
  background: #333;
  padding: 10px 20px 10px 20px;
  position: fixed;
  right: 0;
  top: 0;
  font-size: 25px;
  color: white;
  cursor: pointer;
}
div.catePopup div.bg {
  position: absolute;
  left: 0;
  top: 0;
  filter: alpha(opacity=(@a*100));
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  opacity: 0.8;
  background: black;
  width: 100%;
  height: 100%;
  z-index: 5;
}
div.catePopup div.content {
  width: 80%;
  background: white;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  z-index: 10;
  padding: 20px;
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
}
div.catePopup div.content p {
  font-size: 20px;
  line-height: 30px;
  padding-bottom: 15px;
  padding-right: 40px;
}
div.products {
  width: 1200px;
  margin: auto;
  margin-top: 30px;
}
div.products ul.banners {
	clear:both;
}
div.products ul.banners li {
  display: block;
  float: left;
  margin-left: 10px;
  border: 10px solid white;
  width: 370px;
  height: 120px;
  position: relative;
  overflow: hidden;
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
}
div.products ul.banners li img {
	width:100%;
}
div.products ul.banners li span {
  display: block;
  font-size: 30px;
  color: white;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  font-weight: bold;
  text-shadow: 1px 2px 3px #666;
  z-index: 10;
}
div.products ul.banners li span:after {
  content: " >";
}
div.products ul.banners li:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: url(../img/gradience.png) right top repeat-y;
  z-index: 5;
}
div.products ul.banners li.health:hover {
  border: 10px solid #8dc041;
}
div.products ul.banners li.health.on {
  border: 10px solid #8dc041;
}
div.products ul.banners li.beauty:hover {
  border: 10px solid #9f1931;
}
div.products ul.banners li.beauty.on {
  border: 10px solid #9f1931;
}
div.products ul.banners li.other:hover {
  border: 10px solid #0993c6;
}
div.products ul.banners li.other.on {
  border: 10px solid #0993c6;
}
div.products ul.submenu {
  display: block;
  width: 100%;
  height: 60px;
  border-radius: 15px;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  margin-top: 20px;
  overflow: hidden;
}
div.products ul.submenu li {
  cursor: pointer;
  display: block;
  float: left;
  height: 100%;
  text-align: center;
  position: relative;
}
div.products ul.submenu li a {
  line-height: 60px;
  color: #333333;
  font-size: 23px;
  width: 100%;
  height: 100%;
  display: inline-block;
}
div.products ul.submenu li.on,
div.products ul.submenu li:hover {
  background: white;
}
div.products ul.submenu li.on:before,
div.products ul.submenu li:hover:before {
  content: "";
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #c6db2d;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
div.products ul.submenu.health {
  background: #c6db2d;
}
div.products ul.submenu.health li {
  width: 171px;
}
/*div.products ul.submenu.health li:nth-child(7) {
  width: 174px;
}*/
div.products ul.submenu.beauty {
  background: #9f1931;
}
div.products ul.submenu.beauty li {
  width: 171px;
}
div.products ul.submenu.beauty li.on a,
div.products ul.submenu.beauty li:hover a {
  color: #9f1931;
}
div.products ul.submenu.beauty li.on:before,
div.products ul.submenu.beauty li:hover:before {
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #9f1931;
}
div.products ul.submenu.beauty li a {
  color: white;
}
div.products ul.submenu.other {
  background: #0993c6;
}
div.products ul.submenu.other li {
  width: 171px;
}
div.products ul.submenu.other li.on a,
div.products ul.submenu.other li:hover a {
  color: #0993c6;
}
div.products ul.submenu.other li.on:before,
div.products ul.submenu.other li:hover:before {
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #0993c6;
}
div.products ul.submenu.other li a {
  color: white;
}
div.products div.product-list {
  margin-top: 80px;
  margin-bottom: 80px;
  position: relative;
}
div.products div.product-list ul.items > li {
  cursor: pointer;
  display: block;
  width: 390px;
  height: 410px;
  background: white;
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
  position: relative;
}
div.products div.product-list ul.items > li.promo:before {
  content: "";
  display: block;
  width: 93px;
  height: 84px;
  background: url("../img/promo.png") left top no-repeat;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 3;
}
div.products div.product-list ul.items > li .wrap {
  width: 100%;
  height: 280px;
  border-bottom: 7px solid #333;
  position: relative;
  overflow: hidden;
}
div.products div.product-list ul.items > li .wrap img {
  width: 250px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
}
div.products div.product-list ul.items > li .wrap .promo {
  width: 80px;
  height: 80px;
  background: #ffcc00;
  border-radius: 80px;
  -webkit-border-radius: 80px;
  -moz-border-radius: 80px;
  position: absolute;
  right: 20px;
  bottom: 20px;
}
div.products div.product-list ul.items > li .wrap .promo p {
  font-size: 20px;
  line-height: 25px;
  text-align: center;
  position: relative;
  display: block;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}
div.products div.product-list ul.items > li ul.info {
  display: block;
  margin-top: 40px;
  margin-left: 20px;
}
div.products div.product-list ul.items > li ul.info li {
  display: block;
  margin-bottom: 10px;
  font-size: 20px;
}
div.products div.product-list ul.items > li ul.info li.price {
  color: #39ae39;
  font-size: 20px;
}
div.products div.product-list ul.items > li ul.info li.price span {
  color: #39ae39;
  font-size: 20px;
}
div.products div.product-list ul.items > li ul.info li.price span:after {
  content: "|";
  padding: 0 10px 0 10px;
}
div.products div.product-list ul.items > li ul.buttons {
  display: block;
  position: absolute;
  right: 10px;
  bottom: 20px;
}
div.products div.product-list ul.items > li ul.buttons li {
  padding: 10px;
  font-size: 16px;
  background: #333333;
  color: white;
}
div.products div.product-list ul.items > li ul.buttons li.cart {
  background: #39ae39;
  position: relative;
  margin-top: 5px;
}
div.products div.product-list ul.paginator {
  display: block;
  position: absolute;
  right: 0;
  bottom: -50px;
}
div.products div.product-list ul.paginator li {
  cursor: pointer;
  display: inline-block;
  padding: 10px;
  margin-right: 5px;
  font-size: 16px;
  line-height: 16px;
  background: white;
  border: 1px solid #eaeaea;
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
}
div.products div.product-list ul.paginator li.on {
  background: #333333;
  color: white;
}
div.products div.product-list a.shopping-list {
  background: #39ae39;
  border: 0;
  color: white;
  font-size: 20px;
  padding: 10px 45px 10px 10px;
  position: absolute;
  right: 10px;
  top: -44px;
}
div.products div.product-list a.shopping-list:after {
  content: url(../img/icons/cart.png);
  position: absolute;
  right: 10px;
  top: 7px;
}
div.products div.product-list a.shopping-list span.count {
  position: absolute;
  border-radius: 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  background: #ff2600;
  color: white;
  display: block;
  left: -10px;
  top: -10px;
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 20px;
}
div.login div.wrap {
  width: 1120px;
}
div.login div.wrap div.form-wrap {
  width: 490px;
  margin: auto;
}
div.login div.wrap div.form-wrap h1 {
  font-size: 30px;
  color: #5f7070;
  padding: 10px 20px 10px 20px;
  border-bottom: 1px solid #cccccc;
}
div.login div.wrap div.form-wrap form {
  margin-top: 35px;
  margin-bottom: 65px;
}
div.login div.wrap div.form-wrap form label {
  width: 85px;
  display: inline-block;
  color: #666666;
  font-size: 20px;
  padding-left: 35px;
}
div.login div.wrap div.form-wrap form input {
  width: 308px;
  height: 44px;
  font-size: 20px;
  border: 1px solid #ccc;
  margin-bottom: 15px;
  padding-left: 10px;
}
div.login div.wrap div.form-wrap form button {
  margin-top: 10px;
  width: 207px;
  height: 37px;
  background: #19bb9b;
  color: white;
  text-align: center;
  margin-right: 7px;
  float: left;
  border: 0;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  font-size: 20px;
}
div.login div.wrap div.form-wrap form button.first {
  margin-left: 35px;
}
div.login div.wrap div.info-wrap {
  width: 100%;
  border-top: 1px solid #ccc;
}
div.login div.wrap div.info-wrap ul.info {
  position: relative;
  left: 50px;
  margin-bottom: 50px;
}
div.login div.wrap div.info-wrap ul.info li {
  line-height: 30px;
  font-size: 20px;
  color: #666666;
  padding-bottom: 20px;
}
div.login div.wrap div.info-wrap ul.info li:before {
  content: "";
  width: 32px;
  height: 32px;
  display: block;
  background: url("../img/warning.png") left top no-repeat;
  position: relative;
  top: 32px;
  left: -40px;
}
div.login .popup-layer {
  width: 100%;
  height: 100%;
}
div.login .popup-layer div.join {
  width: 690px;
  height: 300px;
  position: absolute;
  z-index: 5;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  background: white;
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.1);
}
div.login .popup-layer div.join h1 {
  color: #58cdcc;
  font-size: 24px;
  padding: 40px 0 0 60px;
}
div.login .popup-layer div.join p {
  font-size: 18px;
  padding: 40px 0 100px 60px;
}
div.login .popup-layer div.join button.confirm {
  font-size: 18px;
  width: 120px;
  height: 33px;
  background: #58cdcc;
  color: white;
  border: 0;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}
div.login .popup-layer div.bg {
  position: fixed;
  background: black;
  filter: alpha(opacity=(@a*100));
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  opacity: 0.8;
  z-index: 3;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
div.clear {
  clear: both;
}
.printTable button {
	background:#00cccc;
	border:0;
	border-radius:5px;
	color:#ffffff;
	font-size:20px;
	padding:5px;
	margin:0 10px 10px 0;
	font-family:"微軟正黑體";
	cursor:pointer;
}

body.is-mobile .bread-crumbs2{
  padding-top: 125px;
  z-index: 11;
}

div.videocategory {
  margin: auto;
  padding-top: 150px;
  padding-left: 150px;
  position: relative;
  top: 0px;
}

body.is-mobile div.videocategory{
  padding-left: 0px;
  padding-top:  0px;
}

div.videocategory ul {
  margin: 30px;
}

div.videocategory li {
  margin-right: 20px;
  margin-bottom: 20px;
}

div.videocategory .list {
  padding: 10px;
  font-size: 36px;
    color: #009f3e;
}

div.videocategory ul.banners li {
    display: block;
    float: left;
    margin-left: 10px;
    border: 5px solid white;
    width: 200px;
    height: 80px;
    position: relative;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 2px 2px 4px 2px rgb(0 0 0 / 10%);
}

div.videocategory .sublabel{
	line-height:80px;
    width: 200px;
    height: 80px;
	//background-color:#003699;
	text-align: right;
    display: block;
    font-size: 16px;
    color: white;
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    font-weight: bold;
    text-shadow: 1px 2px 3px #666;
    z-index: 10;
}

div.videocategory .subimg::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url(../img/gradience.png) right top repeat-y;
    z-index: 5;
}


div.videocategorylistvideo {
  margin: auto;
  padding-top: 150px;
  padding-left: 150px;
  position: relative;
  top: 0px;
}

body.is-mobile div.videocategorylistvideo{
  padding-left: 0px;
  padding-top: 0px;
}

div.videocategorylistvideo ul {
  margin: 30px;
}

div.videocategorylistvideo li {
  margin: 20px;
}

div.videocategorylistvideo ul.banners li {
    display: block;
    float: left;
    margin-left: 10px;
    border: 5px solid white;
    //border-bottom: 40px solid white;
    width: 320px;
    height: 180px;
    position: relative;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 2px 2px 4px 2px rgb(0 0 0 / 10%);
}

div.videocategorylistvideo ul.banners .sublabel{
	//line-height:180px;
    width: 320px;
    height: 180px;
	background-color:#fff;
	text-align: center;
    display: block;
    font-size: 16px;
    color: black;
    position: absolute;
    top: 156px;
    //transform: translate(0, -50%);
    //-webkit-transform: translate(0, -50%);
    font-weight: bold;
    text-shadow: 1px 2px 3px #666;
    //z-index: 0;
    padding-top: 5px;
}

div.videocategorylookvideo {
  margin: auto;
  padding-top: 150px;
  padding-left: 120px;
  padding-right: 120px;
  position: relative;
  top: 0px;
}

body.is-mobile div.videocategorylookvideo{
  padding-left: 100px;
  padding-top: 0px;
}

div.ebookcategorylistebook {
  margin: auto;
  padding-top: 150px;
  padding-left: 150px;
  position: relative;
  top: 0px;
}

body.is-mobile div.ebookcategorylistebook{
  padding-left: 0px;
  padding-top:  0px;
}

div.ebookcategorylistebook ul.banners li {
    display: block;
    float: left;
    margin-top: 20px;
    margin-left: 20px;
    border: 5px solid white;
    //border-bottom: 40px solid white;
    width: 181px;
    height: 257px;
    position: relative;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 2px 2px 4px 2px rgb(0 0 0 / 10%);
}

div.ebookcategorylistebook ul.banners .sublabel{
	//line-height:180px;
    width: 181px;
    height: 257px;
	background-color:#fff;
	text-align: center;
    display: block;
    font-size: 16px;
    color: black;
    position: absolute;
    top: 233px;
    //transform: translate(0, -50%);
    //-webkit-transform: translate(0, -50%);
    font-weight: bold;
    text-shadow: 1px 2px 3px #666;
    //z-index: 0;
    padding-top: 5px;
}

div.learncategory {
  margin: auto;
  padding-top: 150px;
  padding-left: 150px;
  position: relative;
  top: 0px;
}

body.is-mobile div.learncategory{
  padding-left: 0px;
  padding-top:  0px;
}

div.learncategory ul {
  margin: 30px;
}

div.learncategory li {
  margin-right: 20px;
  margin-bottom: 20px;
}

div.learncategory .list {
  padding: 10px;
  font-size: 36px;
    color: #009f3e;
}

div.learncategory ul.banners li {
    display: block;
    float: left;
    margin-left: 10px;
    border: 5px solid white;
    width: 200px;
    height: 80px;
    position: relative;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 2px 2px 4px 2px rgb(0 0 0 / 10%);
}

div.learncategory .sublabel{
	line-height:80px;
    width: 200px;
    height: 80px;
	//background-color:#003699;
	text-align: right;
    display: block;
    font-size: 16px;
    color: white;
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    font-weight: bold;
    text-shadow: 1px 2px 3px #666;
    z-index: 10;
}

div.learncategory .subimg::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url(../img/gradience.png) right top repeat-y;
    z-index: 5;
}


div.learncategorylistlearn {
  margin: auto;
  padding-top: 150px;
  padding-left: 150px;
  position: relative;
  top: 0px;
}

body.is-mobile div.learncategorylistlearn{
  padding-left: 0px;
  padding-top: 0px;
}

div.learncategorylistlearn ul {
  margin: 30px;
}

div.learncategorylistlearn li {
  margin: 20px;
}

div.learncategorylistlearn ul.banners li {
    display: block;
    float: left;
    margin-left: 10px;
    border: 5px solid white;
    //border-bottom: 40px solid white;
    width: 320px;
    height: 180px;
    position: relative;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 2px 2px 4px 2px rgb(0 0 0 / 10%);
}

div.learncategorylistlearn ul.banners .sublabel{
	//line-height:180px;
    width: 320px;
    height: 180px;
	background-color:#fff;
	text-align: center;
    display: block;
    font-size: 16px;
    color: black;
    position: absolute;
    top: 156px;
    //transform: translate(0, -50%);
    //-webkit-transform: translate(0, -50%);
    font-weight: bold;
    text-shadow: 1px 2px 3px #666;
    //z-index: 0;
    padding-top: 5px;
}

div.learncategorylooklearn {
  margin: auto;
  padding-top: 150px;
  padding-left: 120px;
  padding-right: 120px;
  position: relative;
  top: 0px;
}

body.is-mobile div.learncategorylooklearn{
  padding-left: 0px;
  padding-top: 0px;
}







div.affiliateslearncategory {
  margin: auto;
  padding-top: 0px;
  padding-left: 0px;
  position: relative;
  top: 0px;
}

body.is-mobile div.affiliateslearncategory{
  padding-left: 0px;
  padding-top:  0px;
}

div.affiliateslearncategory ul {
  //margin: 30px;
  margin-top: 30px;
  margin-left: 10px;
}

div.affiliateslearncategory li {
  margin-right: 10px;
  margin-bottom: 20px;
}

div.affiliateslearncategory .list {
  padding: 10px;
  font-size: 36px;
  color: #009f3e;
}

div.affiliateslearncategory ul.banners li {
    display: block;
    float: left;
    margin-left: 10px;
    border: 5px solid white;
    width: 160px;
    height: 64px;
    position: relative;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 2px 2px 4px 2px rgb(0 0 0 / 10%);
}

div.affiliateslearncategory .sublabel{
	line-height:80px;
    width: 160px;
    height: 64px;
	//background-color:#003699;
	text-align: right;
    display: block;
    font-size: 16px;
    color: white;
    position: absolute;
    top: 38%;
    right: 4px;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    font-weight: bold;
    text-shadow: 1px 2px 3px #666;
    z-index: 10;
}

div.affiliateslearncategory .subimg::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url(../img/gradience.png) right top repeat-y;
    z-index: 5;
}


div.affiliateslearncategorylistlearn {
  margin: auto;
  padding-top: 0px;
  padding-left: 0px;
  position: relative;
  top: 0px;
}

body.is-mobile div.affiliateslearncategorylistlearn{
  padding-left: 0px;
  padding-top: 0px;
}

div.affiliateslearncategorylistlearn ul {
  margin-left: 15px;
}

div.affiliateslearncategorylistlearn li {
  margin: 20px;
}

div.affiliateslearncategorylistlearn ul.banners li {
    display: block;
    float: left;
    margin-left: 10px;
    border: 5px solid white;
    //border-bottom: 40px solid white;
    width: 320px;
    height: 180px;
    position: relative;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 2px 2px 4px 2px rgb(0 0 0 / 10%);
}

div.affiliateslearncategorylistlearn ul.banners .sublabel{
	//line-height:180px;
    width: 320px;
    height: 180px;
	background-color:#fff;
	text-align: center;
    display: block;
    font-size: 16px;
    color: black;
    position: absolute;
    top: 156px;
    //transform: translate(0, -50%);
    //-webkit-transform: translate(0, -50%);
    font-weight: bold;
    text-shadow: 1px 2px 3px #666;
    //z-index: 0;
    padding-top: 5px;
}

div.affiliateslearncategorylooklearn {
  margin: auto;
  padding-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
  position: relative;
  top: 0px;
}

body.is-mobile div.affiliateslearncategorylooklearn{
  padding-left: 0px;
  padding-top: 0px;
}

video::-internal-media-controls-download-button {
    display:none;
}
video::-webkit-media-controls-enclosure {
    overflow:hidden;
}
video::-webkit-media-controls-panel {
    width: calc(100% + 30px); 
}

div.publicationsLookPublication {
  background-color:#fff;
}

div.publicationsLookPublication .publication {
  margin: auto;
  @media (max-width:900px){
  	margin: 20px;
  	margin-left: 40px;
  }
  padding-top: 150px;
  
  @media (max-width:785px){
  	padding-top: 0px;
  }
  position: relative;
  top: 0px;
  background-color:#fff;
  max-width: 900px;
  width: 80%;
}

div.publicationsLookPublication .block{
  display: flex;
  /* 水平置中 */
  justify-content: center;
}

div.publicationsLookPublication .block img{
  max-width: 100%;
}

div.publicationsLookPublication .block,div.publicationsLookPublication .ck-content p {
	font-size: 15px;
	line-height: 1.5;
	letter-spacing: 1px;
}

div.publicationsLookPublication .block,div.publicationsLookPublication .ck-content span {
	font-size: 15px;
	line-height: 1.5;
	letter-spacing: 1px;
}

div.publicationsLookPublication .block,div.publicationsLookPublication .ck-content{
	padding-bottom: 20px;
}

div.publicationsLookPublication .block,div.publicationsLookPublication .ck-content ul{
	list-style-type: disc;
	list-style-position:inside;
	font-size: 15px;
	line-height: 1.5;
	letter-spacing: 1px;
}

div.publicationsLookPublication .block,div.publicationsLookPublication .ck-content ul li{
	font-size: 15px;
	line-height: 1.5;
	letter-spacing: 1px;
	padding-bottom: 3px;
}

div.publicationsLookPublication .ck-content a {
    color: -webkit-link;
    text-decoration: underline;
}


div.publicationsLookPublication .ck-content a {
    color: -webkit-link;
    text-decoration: underline;
}

div.publicationsLookPublication .publication .publication-tool img{
	cursor: pointer;
}

body.is-mobile div.publicationsLookPublication .publication{
	padding-top: 0px;
	max-width: 80%;
}

div.publicationsLookPublication .publication .publication-tool {
    position: relative;
    float: right;
    z-index: 99;
}

body.is-mobile div.publicationsLookPublication .publication .publication-tool {
    position: fixed;
    bottom: 10px;
    z-index: 99;
}

div.publicationsLookPublication .btn_left,div.publicationsLookPublication .btn_right {
    position: fixed;
    top: 50%;
    cursor: pointer;
}

div.publicationsLookPublication .btn_left {
	left: 2%;
}

div.publicationsLookPublication .btn_right {
	right: 6%;
}

body.is-mobile div.publicationsLookPublication .btn_right {
	right: 2%;
}

div.publicationsLookPublication .publication-title blockquote {
	overflow: hidden;
    padding-right: 1.5em;
    padding-left: 28px;
    margin-left: 0;
    margin-right: 0;
    margin-top: 20px;
    margin-bottom: 20px;
    font-size: 32px;
    color: #00B050;
    border-left: solid 5px hsl(0, 0%, 80%);
    border-color: #00B050;
}

div.publicationsLookPublication .trustbody {
	min-height:48vh;
	
}

div.publicationlistpublication {
  margin: auto;
  background-color:#fff;
}

div.listpublication {
  display: flex;
  /*
  flex-direction:row;
  */
  /* 水平置中 */
  
  justify-content: center;
  margin: auto;
  @media (max-width:900px){
  	margin: 20px;
  }
  padding-top: 150px;
  @media (max-width:785px){
  	padding-top: 0px;
  }
  position: relative;
  top: 0px;
}

div.listpublication .list{
    width: 100vw;
	max-width: 1280px;
}

div.listpublication ul {
  margin: 0px;
}

div.listpublication li {
  //margin: 20px;
}

div.listpublication ul.banners li {
    display: block;
    float: left;
    margin: 10px;
    //border: 5px solid white;
    width: 23%;
	@media (max-width:940px){
		width: 46%;
	}
	@media (max-width:600px){
		width: 90%;
	}
    position: relative;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 2px 2px 4px 2px rgb(0 0 0 / 10%);
}

body.is-mobile div.listpublication ul.banners li {
    margin: 10px;
	width: 45%;
}

div.listpublication ul.banners li img{
	width: 100%;
	height: 100%;
	aspect-ratio: 300 / 390;
}

div.listpublication ul.banners .sublabeldate{
	background-color:#fff;
	filter:alpha(opacity=70); 
	opacity:0.7; 
	text-align: center;
    display: block;
    font-size: 14px;
    line-height: 22px;
    height: 22px;
    color: gray;
    font-weight: bold;
    position: absolute;
    width: 100%;
    bottom: 32px;
}

div.listpublication ul.banners .sublabeltitle{
	background-color:#fff;
	text-align: center;
    display: block;
    font-size: 18px;
    height: 26px;
    color: black;
    font-weight: bold;
    margin-top: 7px;
    overflow:hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding: 0px 10px 0px 10px;
}

div.publicationlistpublication .order-type {
  position: absolute;
  top: 120px;
  right: 10%;
  z-index: 4;
  font-size: 14px;
}

body.is-mobile div.listpublication{
  padding-left: 0px;
  padding-top: 0px;
}


.gototop{
  width:56px;
  height:56px;
  line-height:56px;
  font-family:verdana;
  text-align:center;
  position:fixed;
  bottom:120px;
  right:30px;
  border-radius:50%;
  text-decoration:none;
  cursor: pointer;
  display:none;
  z-index: 100;
}

.trustbody , .listpublication{
	-webkit-touch-callout:none; /*系統預設選單被禁用*/ 
	-webkit-user-select:none; /*webkit瀏覽器*/ 
	-khtml-user-select:none; /*早期瀏覽器*/ 
	-moz-user-select:none;/*火狐*/ 
	-ms-user-select:none; /*IE10*/ 
	user-select:none;
}

.trustbody i{
	font-style: italic;
}	

.trustbody strong{
	font-weight: bold;
}