@media (max-width: 1009px) {
section.col-sm-12 {
  margin-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}
body.path-vip div.main-container {
  padding-bottom: 0px;
}
div.ii-vip-intro {
  overflow: hidden;
  margin-bottom: 0px;
}
.icon-thumb,
.icon-comment {
  padding-right: 4px;
}
div.region-header div.alert {
  display: none;
}
/**
 * ----------------------------------------------------------------------------
 * top nav
 * ---------------------------------------------------------------------------
**/
ul.ii-nav-tabs {
  border-bottom: none;
  padding: 0px 30px;
  background-color: #fff;
}
.ii-nav-tabs li {
  float: left;
  width: 33%;
}
.ii-nav-tabs li:nth-child(2) {
  text-align: center;
}
.ii-nav-tabs li:nth-child(3) {
  text-align: right;
}
.nav.ii-nav-tabs li > span {
  display: block;
  padding: 10px 15px;
}
.ii-nav-tabs li.active span:before {
  content: '';
  width: 32px;
  height: 4px;
  background-color: #d37957;
  position: absolute;
  bottom: 6px;
}
.ii-nav-tabs li.active:nth-child(1) span:before {
  left: 20px;
}
.ii-nav-tabs li.active:nth-child(2) span:before {
  left: 50%;
  transform: translate(-16px, 0px);
}
.ii-nav-tabs li.active:nth-child(3) span:before {
  right: 20px;
}
/**
 * ----------------------------------------------------------------------------
 * slides
 * ---------------------------------------------------------------------------
**/
ul.ii-touch-slide {
  width: 300vw;
  position: relative;
}
ul.ii-touch-slide.svip {
  left: -100vw;
}
ul.ul.ii-touch-slide.vvip {
  left: -200vw;
}
.nav.ii-touch-slide > li {
  float: left;
  width: 100vw;
  padding: 0px;
  position: unset;
}
.ii-touch-slide .ii-scroll-content {
  overflow-y: scroll;
  height: calc(100vh - 48px);
  overflow-x: hidden;
  margin-top: 5px;
}
.ii-touch-slide .ii-scroll-content.no-scroll {
  overflow-y: visible;
  overflow-x: visible;
}
.ii-touch-slide .ii-vip-ad {
  margin: 0px 15px 5px 15px;
}
.ii-touch-slide .ii-card {
  position: relative;
  height: calc(50vw - 17px);
  border-radius: 8px;
  box-shadow:0px 2px 4px 0px rgba(0,0,0,0.32);
  border:0px solid rgba(151,151,151,1);
  padding: 24px 23px;
  margin: 0px 18px 40px 17px;
}
.ii-touch-slide .ii-card.vip {
  background:linear-gradient(180deg,rgba(232,207,155,1) 0%,rgba(216,186,128,1) 100%);
}
.ii-touch-slide .ii-card.vip:after {
  content: '';
  position: absolute;
  right: -20px;
  top: 0px;
  width: 10px;
  height: calc(50vw - 17px);
  background:linear-gradient(180deg,rgba(73,73,73,1) 0%,rgba(0,0,0,1) 100%);
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}
.ii-touch-slide .ii-card.svip {
  background:linear-gradient(180deg,rgba(73,73,73,1) 0%,rgba(0,0,0,1) 100%);
}
.ii-touch-slide .ii-card.svip:before {
  content: '';
  position: absolute;
  left: -19px;
  top: 0px;
  width: 10px;
  height: calc(50vw - 17px);
  background:linear-gradient(180deg,rgba(232,207,155,1) 0%,rgba(216,186,128,1) 100%);
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}
.ii-touch-slide .ii-card.svip:after {
  content: '';
  position: absolute;
  right: -20px;
  top: 0px;
  width: 10px;
  height: calc(50vw - 17px);
  background:linear-gradient(180deg,rgba(255,133,86,1) 0%,rgba(211,121,87,1) 100%);
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}
.ii-touch-slide .ii-card.vvip {
  background:linear-gradient(180deg,rgba(255,133,86,1) 0%,rgba(211,121,87,1) 100%);
}
.ii-touch-slide .ii-card.vvip:before {
  content: '';
  position: absolute;
  left: -19px;
  top: 0px;
  width: 10px;
  height: calc(50vw - 17px);
  background:linear-gradient(180deg,rgba(73,73,73,1) 0%,rgba(0,0,0,1) 100%);
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}
.ii-touch-slide .ii-card > h2 {
  font-size: 28px;
}
.ii-touch-slide .ii-card.svip > h2 {
  color: #E3C892;
}
.ii-touch-slide .ii-card.vvip > h2 {
  color: #fff;
}
.ii-touch-slide .ii-card > p {
  position: absolute;
  bottom: 18px;
  left: 0px;
  width: 100%;
}
.ii-touch-slide .ii-card .ii-vip-price {
  font-size: 20px;
  padding-left: 23px;
  vertical-align: bottom;
}
.ii-touch-slide .ii-card.svip .ii-vip-price {
  color: #E1C690;
}
.ii-touch-slide .ii-card.vvip .ii-vip-price {
  color: #fff;
}
.ii-touch-slide .ii-card > p s {
  padding-left: 4px;
   vertical-align: text-bottom;
}
.ii-touch-slide .ii-card.vip > p s {
  color: #666;
}
.ii-touch-slide .ii-card.svip > p s {
  color: #E1C690;
  font-weight: 300;
}
.ii-touch-slide .ii-card.vvip > p s {
  color: #fff;
}
.ii-touch-slide .ii-card > p > .btn {
  float: right;
  margin-right: 17px;
  font-size: 18px;
  padding: 4px 12px;
  border-radius: 18px;
  margin-top: -2px;
}
.ii-touch-slide .ii-card.vip > p > .btn,
.ii-touch-slide .ii-card.svip > p > .btn {
  background-color: #3f372d;
  color: #DFC48D;
}
.ii-touch-slide .ii-card.vvip > p > .btn {
  background-color: #fff;
  color: #EA7F57;
}
/**
 * ----------------------------------------------------------------------------
 * vip privilege
 * ---------------------------------------------------------------------------
**/
.ii-touch-slide .ii-content > h3 {
  font-size: 22px;
  text-align: center;
  margin-bottom: 30px;
}
.ii-touch-slide .ii-content .ii-privileges {
  overflow: hidden;
}
.ii-touch-slide .ii-content .ii-privileges-item {
  float: left;
  width: 33%;
  height: 112px;
  padding: 42px 4px 0px 9px;
  text-align: center;
  position: relative;
  margin-bottom: 15px;
}
.ii-touch-slide .ii-content .ii-privileges-item > p {
  margin-bottom: 4px;
}
.ii-touch-slide .ii-content .ii-privileges-item > span {
  display: inline-block;
  font-size: 10px;
  line-height: 1.3;
}
.ii-touch-slide .ii-content .ii-privileges-item:before {
  content: '';
  position: absolute;
  left: 50%;
  top: 0px;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  width: 36px;
  height: 36px;
  background: url('/modules/custom/ii_vip/images/vip-intro-icon-20201027.png') no-repeat;
  background-size: auto 36px;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(5):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(3):before,
.ii-touch-slide .ii-content.vip .ii-privileges-item:nth-child(1):before {
  background-position: -144px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(6):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(4):before,
.ii-touch-slide .ii-content.vip .ii-privileges-item:nth-child(2):before {
  background-position: -180px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(7):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(5):before,
.ii-touch-slide .ii-content.vip .ii-privileges-item:nth-child(3):before {
  background-position: -216px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(8):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(6):before,
.ii-touch-slide .ii-content.vip .ii-privileges-item:nth-child(4):before {
  background-position: -252px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(9):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(7):before,
.ii-touch-slide .ii-content.vip .ii-privileges-item:nth-child(5):before {
  background-position: -540px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(10):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(8):before,
.ii-touch-slide .ii-content.vip .ii-privileges-item:nth-child(6):before {
  background-position: -576px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(11):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(9):before,
.ii-touch-slide .ii-content.vip .ii-privileges-item:nth-child(7):before {
  background-position:  -288px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(12):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(10):before,
.ii-touch-slide .ii-content.vip .ii-privileges-item:nth-child(8):before {
  background-position: -324px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(13):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(11):before,
.ii-touch-slide .ii-content.vip .ii-privileges-item:nth-child(9):before {
  background-position: -360px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(14):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(12):before,
.ii-touch-slide .ii-content.vip .ii-privileges-item:nth-child(10):before {
  background-position: -504px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(15):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(13):before,
.ii-touch-slide .ii-content.vip .ii-privileges-item:nth-child(11):before {
  background-position: -612px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(16):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(14):before,
.ii-touch-slide .ii-content.vip .ii-privileges-item:nth-child(12):before {
  background-position: -396px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(17):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(15):before,
.ii-touch-slide .ii-content.vip .ii-privileges-item:nth-child(13):before {
  background-position: -432px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(18):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(16):before,
.ii-touch-slide .ii-content.vip .ii-privileges-item:nth-child(14):before {
  background-position: -648px 0;
}

.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(3):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(1):before {
  background-position: -72px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(4):before,
.ii-touch-slide .ii-content.svip .ii-privileges-item:nth-child(2):before {
  background-position: -108px 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(1):before {
  background-position: 0 0;
}
.ii-touch-slide .ii-content.vvip .ii-privileges-item:nth-child(2):before {
  background-position: -36px 0;
}
/**
 * ----------------------------------------------------------------------------
 * lists
 * ---------------------------------------------------------------------------
**/
.ii-intro-list {
  padding: 15px 18px 15px 17px;
  border-top: 5px solid #e5e5e5;
}
.ii-intro-list > h3 {
  font-size: 22px;
  text-align: center;
  margin-bottom: 8px;
}
.ii-intro-list > p {
  color: #666;
  text-align: center;
  line-height: 1.4;
  margin-bottom: 20px;
}
.ii-vip-qr {
  margin: 30px auto;
  width: 150px;
}
.ii-notice {
  margin-bottom: 50px;
}
.ii-course-list .views-field-field-poster {
  float: left;
  width: 87px;
  margin-right: 10px;
}
.views-field-field-activity-summary-image {
  width: 100%;
}
.ii-forum-list .views-field-title h3 {
  font-size: 18px;
  margin: 6px 0 0 0;
}
.views-field-field-activity-summary-image img {
  border-radius: 6px;
}
.ii-course-list .views-field-title h3 {
  font-size: 16px;
  line-height: 1.3;
}
.ii-intro-list .view .views-row {
  margin: 15px 0px;
  overflow: hidden;
  position: relative;
}
.ii-course-list .views-field-title {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  height: 42px;
  overflow: hidden;
  font-weight: bold;
}
.ii-course-list .views-field-field-slogon {
  font-size: 12px;
  font-weight: 300;
}
.ii-course-list .views-field-field-presenter {
  float: left;
  font-size: 12px;
  margin-right: 4px;
  font-weight: 500;
  line-height: 1.3;
}
.ii-course-list .views-field-field-position {
  font-size: 12px;
  color: #666;
  overflow: hidden;
  line-height: 1.3;
}
.ii-course-list .views-field-nid {
  font-size: 10px;
  color: #999;
}
.ii-course-list .views-field-field-tags ul {
  line-height: 1.5;
}
.ii-course-list .views-field-field-tags li {
  display: inline-block;
  font-size: 10px;
  margin-right: 12px;
  background-color: #E9BCAB;
  padding: 0px 4px;
}
.ii-article-list .views-field-field-image,
.ii-association-list .views-field-field-image {
  float: left;
  width: 100px;
  overflow: hidden;
  margin-right: 15px;
  border-radius: 8px;
}
.ii-article-list .views-field-title,
.ii-association-list .views-field-title {
  margin-bottom: 8px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  height: 46px;
  overflow: hidden;
}
.ii-association-list .views-field-article-like-count,
.ii-association-list .views-field-comment-count,
.ii-article-list .views-field-article-like-count,
.ii-article-list .views-field-comment-count {
  color: #999;
  display: inline-block;
}
.views-field-article-like-count {
  padding-right: 12px;
}
.ii-article-list .views-field-field-staff-picture,
.ii-association-list .views-field-field-staff-picture {
  float: left;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  margin-right: 15px;
}
.ii-notice > div {
  text-align: justify;
}
/**
 * ----------------------------------------------------------------------------
 * checkout
 * ---------------------------------------------------------------------------
**/
.region-content > .ii-intro-bottom-btn {
  position: fixed;
  left: 0;
  bottom: 0;
  margin-bottom: -1px;
  z-index: 9;
  width: 100%;
  padding: 0px;
}
.region-content > .ii-intro-bottom-btn > div {
  display: none;
}
.ii-intro-bottom-btn .btn-left,
.ii-intro-bottom-btn .btn-right {
  float: left;
  width: 50%;
  border-radius: 0;
  padding: 8px 6px 4px;
}
.ii-intro-bottom-btn .btn.btn-left,
.ii-intro-bottom-btn .btn.btn-left a {
  background-color: #f5f3e7;
  color: #353535;
}
.ii-intro-bottom-btn .btn.btn-right,
.ii-intro-bottom-btn .btn.btn-right a {
  background-color: #e23f48;
  color: #fff;
}
.ii-intro-bottom-btn .btn-left span:nth-child(2),
.ii-intro-bottom-btn .btn-right span:nth-child(2),
.ii-intro-bottom-btn .btn-full span:nth-child(2) {
  font-size: 11px;
  display: block;
}
.ii-intro-bottom-btn .btn.btn-full {
  background-color: #E0484F;
  border-radius: 0px;
  color: #fff;
  width: 100%;
  padding: 8px 6px 6px;
}
.ii-intro-bottom-btn .btn.btn-full a {
  color: #fff;
  background-color: #E0484F;
}
.ii-intro-bottom-btn .btn span:nth-child(1) {
  font-size: 20px;
  line-height: 1;
  display: block;
  font-weight: bold;
}
.ii-vip-temp {
  font-size: 12px;
}
.ii-card-pop {
  position: fixed;
  z-index: 199;
  width: 88px;
  bottom: 70px;
  right: 0;
}
}