﻿.common-main.free-sample .l-wrap{max-width: none;padding: 0;}
.common-main.free-sample .page-nav{width: 100%;max-width: 1540px;padding: 0 70px;margin: 0 auto 50px auto;}

article{padding-bottom: 0;}
.get-wrap{padding: 3% 0 5% 0;}
.con-wrap{position: relative;padding: 5% 0;}
.f-wrap{position: relative;width: 100%;max-width: 1540px;padding: 0 70px;margin: 0 auto;}
.f-title{color: #222;font-size: var(--fontsize30);font-weight: var(--fontbold6);line-height: 1.3;}
.f-circle{display: flex;align-items: center;margin: 20px 0;}
.f-circle p{display: inline-block;width: 6px;height: 6px;margin-right: 8px;background: var(--color);border-radius: 50%;}
.f-circle p:last-child{margin-right: 0;}
@media (max-width:1280px) {
  .f-title{font-size: var(--fontsize26);}
}
@media (max-width:1024px) {
  .common-main.free-sample .page-nav{margin-bottom: 30px;padding: 0 15px;}
  .get-wrap{padding: 20px 0 40px 0;}
  .con-wrap{padding: 40px 0;}
  .f-wrap{padding: 0 15px;}
}
@media (max-width:990px) {
  .f-title{font-size: var(--fontsize24);}
}
@media (max-width:768px) {
  .f-title{font-size: var(--fontsize22);}
  .f-circle{margin: 15px 0;}
}

.pagesbanner{position: relative;}
.pagesbanner::before{content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: #000;opacity: .3;}
.pagesbanner .banner-text{width: 80%;color: #fff;text-align: center;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.pagesbanner .banner-text .title{font-size: 46px;font-weight: var(--fontbold6);line-height: 1.2;}
.pagesbanner .banner-text .des{font-size: var(--fontsize18);margin-top: 20px;padding: 0 220px;}
@media (max-width:1660px) {
  .pagesbanner .banner-text .des{padding: 0 150px;}
}
@media (max-width:1280px) {
  .pagesbanner .banner-text .title{font-size: 34px;}
  .pagesbanner .banner-text .des{font-size: var(--fontsize16);padding: 0 80px;margin-top:10px;}
}
@media (max-width:990px) {
  .pagesbanner .banner-text{width: 100%;}
  .pagesbanner .banner-text .title{font-size: var(--fontsize30);}
  .pagesbanner .banner-text .des{padding: 0 20px;line-height: 1.5;}
}
@media (max-width:500px) {
  .pagesbanner .banner-text .title{font-size: var(--fontsize24);}
}

.get-wrap .f-wrap{display: flex;justify-content: space-between;align-items: center;flex-wrap: wrap;}
.get-wrap .get-l{width: 45%;}
.get-wrap .get-l .text{color: #444;line-height: 1.6;}
.get-wrap .get-r{width: 48.5%;}
.get-wrap .get-r .swiper-slide{background: #fff;border-radius: 4px;border: 1px solid #E8F2FF;overflow: hidden;}
.get-wrap .get-r .swiper-slide .img img{width: 100%;transition: transform .3s ease;}
.get-wrap .get-r .swiper-slide .img:hover img{transform: scale(1.05);}
.get-wrap .get-r .swiper-pagination-bullet{margin: 0 5px;width: 22px;height: 5px;background: #C5D2E5;border-radius: 3px;opacity: 1;}
.get-wrap .get-r .swiper-pagination-active{background: var(--color);}
@media (max-width:768px) {
  .get-wrap .get-l,.get-wrap .get-r{width: 100%;}
  .get-wrap .get-l{margin-bottom: 20px;}
  .get-wrap .get-r .swiper-pagination-bullet{width: 18px;margin: 0 3px;}
}

.how-wrap{display: flex;justify-content: space-between;flex-wrap: wrap;}
.how-wrap .how-l{width: 50%;display: flex;flex-direction: column;justify-content: center;background: url(https://css02.v15cdn.com/m618/imgs/how_bg.webp) no-repeat;background-size: cover;}
.how-wrap .how-r{width: 50%;background: #F6F7F8;}
.how-wrap .how-l .wrap{display: flex;flex-direction: column;justify-content: center;height: 100%;max-width: 770px;width: 100%;padding: 0 90px 0 70px;margin-left: auto;}
.how-wrap .how-r .wrap{max-width: 770px;width: 100%;padding: 40px 70px 40px 80px;margin-right: auto;}
.how-wrap .how-l .text{color: #444;margin: 5px 0 20px 0;}
.how-wrap .how-l .btn-wrap{display: flex;align-items: center;flex-wrap: wrap;}
.how-wrap .how-l .btn-wrap .btn{margin-right: 20px;}
.how-wrap .how-l .btn-wrap .btn:last-child{margin-right: 0;}
.how-wrap .how-l .btn-wrap a{width: 218px;display: inline-block;padding: 5px 0;text-align: center;color: var(--color);font-weight: var(--fontbold5);border-radius: 4px;border: 1px solid var(--color);transition: all .3s ease;}
.how-wrap .how-l .btn-wrap a:hover{text-decoration: none;background: var(--color);color: #fff;}
.how-wrap .how-r .wmkcfeedback{margin-top: 0;}
.how-wrap .how-r .wmkcfeedback .inquiry-form>*{width: 100%;background: #fff;border-radius: 4px;border: 1px solid #E8F2FF;}
.how-wrap .how-r .wmkcfeedback .send-btn{margin: 0;width: 100%;font-weight: var(--fontbold5);border-radius: 4px;}
@media (max-width:1280px) {
  .how-wrap .how-l .wrap{padding-right: 50px;}
  .how-wrap .how-l .btn-wrap{flex-direction: column;align-items: flex-start;}
  .how-wrap .how-l .btn-wrap .btn{margin: 0 0 10px 0;}
  .how-wrap .how-l .btn-wrap .btn:last-child{margin: 0;}
  .how-wrap .how-r .wrap{padding-left: 50px;}
}
@media (max-width:1024px) {
  .how-wrap .how-l .wrap{padding: 0 15px;}
  .how-wrap .how-r .wrap{padding: 40px 15px}
}
@media (max-width:990px) {
  .how-wrap .how-l .wrap{margin: 0;max-width: none;}
  .how-wrap .how-l .btn-wrap a{width: 200px;padding: 2px 0;}
  .how-wrap .how-r .wrap{margin: 0;padding-top: 20px;max-width: none;}
}
@media (max-width:768px) {
  .how-wrap .how-l,.how-wrap .how-r{width: 100%;}
  .how-wrap .how-l .wrap{padding: 40px 15px 30px;}
  .how-wrap .how-l .btn-wrap{flex-direction: row;}
  .how-wrap .how-l .btn-wrap .btn{margin: 0 20px 0 0;}
  .how-wrap .how-r .btn-wrap a{padding: 5px 10px;}
}
@media (max-width:500px) {
  .how-wrap .how-l .btn-wrap a{width: 170px;font-size: var(--fontsize14);}
  .how-wrap .how-l .btn-wrap .btn{margin: 0 10px 10px 0;}
}

.con-wrap{background: var(--color);}
.con-wrap .f-wrap{text-align: center;}
.con-wrap .f-title{color: #fff;}
.con-wrap .f-circle span{background: #fff;}
.con-wrap .text{color: #fff;margin: 10px 0 25px 0;}
.con-wrap .btn a{display: inline-block;width: 140px;padding: 5px 0;color: #fff;border-radius: 4px;border: 1px solid #fff;}
.con-wrap .btn a:hover{text-decoration: none;color: var(--color);background: #fff;}
@media (max-width:1024px) {
  .con-wrap .text{margin: 5px 0 15px 0;}
  .con-wrap .btn a{padding: 2px 0;}
}
.pagesbanner{position: relative;}
.pagesbanner .banner-text{width: 75%;color: #fff;text-align: center;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);z-index: 3;}
.pagesbanner .banner-text .c-wrap{padding: 0;text-align: left;padding-right: 40%;}
.pagesbanner .banner-text .title{font-size: 46px;font-weight: var(--fontbold6);line-height: 1.2;}
.pagesbanner .banner-text .des{font-size: var(--fontsize18);font-weight: var(--fontbold4);margin: 10px 0 30px 0;padding: 0;}
.pagesbanner .banner-text a{display: inline-block;padding: 4px 20px;background: var(--color);border-radius: 6px;}
.pagesbanner .banner-text a:hover{background: #fff;}
@media (max-width:1660px) {
  .pagesbanner .banner-text .title{font-size: 34px;}
.pagesbanner .banner-text .des{margin-bottom: 15px;padding: 0;}
.pagesbanner .banner-text{width: 90%;}
}
@media (max-width:1280px) {
  .pagesbanner .banner-text{width: 85%;}
  .pagesbanner .banner-text .title{font-size: var(--fontsize30);}
  .pagesbanner .banner-text .des{font-size: var(--fontsize16);padding: 0;}
  .pagesbanner .banner-text a{padding: 4px 10px;}
}
@media (max-width:1024px) {
  .pagesbanner .banner-text{width: 95%;}
  .pagesbanner .banner-text .title{font-size: var(--fontsize24);}
  .pagesbanner .banner-text .c-wrap {padding: 0;text-align: center;padding-right: 0%;}
}
@media (max-width:768px) {
  .pagesbanner .banner-text .des{padding: 0 20px;line-height: 1.3;}
  .pagesbanner .banner-text a{padding: 2px 10px;}
}
@media (max-width:500px) {
  .pagesbanner .banner-text .title{font-size: var(--fontsize20);}
  .pagesbanner .banner-text .des{margin: 10px 0;}
}