﻿/* CSS Document */
html, body, h1, h2, h3, h4, h5, h6, div, dl, dt, dd, ul, ol, li, p, blockquote, pre, hr, figure, table, caption, th, td, form, fieldset, legend, input, button, textarea, menu { margin: 0; padding: 0; }
header, footer, section, article, aside, nav, hgroup, address, figure, figcaption, menu, details, summary, main { display: block; }
audio, canvas, progress, video { display: inline-block; }
audio:not([controls]) { display: none; height: 0; }
table { border-collapse: collapse; border-spacing: 0; }
html, body, fieldset, img, iframe, abbr { border: 0; }
[hidefocus], summary { outline: 0; }
a { background-color: transparent; }
a:active, a:hover { outline: 0; }
img { vertical-align: middle; }
li { list-style: none; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; }
small { font-size: 80%; }
sub, sup { position: relative; line-height: 0; vertical-align: baseline; font-size: 75%; }
sub { bottom: -0.25em; }
sup { top: -0.5em; }
svg:not(:root) { overflow: hidden; }
code, kbd, pre, samp { font-size: 1em; font-family: monospace, monospace; }
q:before, q:after { content: none; }
label, summary { cursor: default; }
a, button { cursor: pointer; }
h1, h2, h3, h4, h5, h6, em, strong, b { font-weight: bold; }
del, ins, u, s, a, a:hover { text-decoration: none; }
button, input, select, textarea, keygen, legend { margin: 0; font: inherit; color: inherit; }
textarea { overflow: auto; }
/*body{background:#fff;font:14px/1.5 "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;color:#333;}*/
body { background: #fff; font: 14px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif; }
:focus { outline: 0; -webkit-tap-highlight-color: transparent; }
::-webkit-input-placeholder {
color:#bbb;
}
i,em{
    font-style: normal;
}
/* rem */
/*
 * 
 * 计算公式：b * (d / r)
 * b 为基数，即像素值和 rem 值的比例，比如它们的比例是100：1，那么 b = 100；
 * d 为设备尺寸；
 * r 为标准尺寸(参照尺寸)；
 *
 */
@media screen and (max-width: 319px) {
html { font-size: 85.33333px; }
}

@media screen and (min-width: 320px) and (max-width: 359px) {
html { font-size: 85.33333px; }
}

@media screen and (min-width: 360px) and (max-width: 374px) {
html { font-size: 96px; }
}

@media screen and (min-width: 375px) and (max-width: 383px) {
html { font-size: 100px; }
}

@media screen and (min-width: 384px) and (max-width: 399px) {
html { font-size: 102.4px; }
}

@media screen and (min-width: 400px) and (max-width: 413px) {
html { font-size: 106.66667px; }
}

@media screen and (min-width: 414px) and (max-width: 767px) {
html { font-size: 110.4px; }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
html { font-size: 204.8px; }
}

@media screen and (min-width: 1024px) {
html { font-size: 273.06667px; }
}
/*header*/
header{
    width:100%;
    height:auto;
    text-align:center;
    overflow:hidden;
    position: absolute;
    z-index: 10;
    padding:.25rem;
    box-sizing: border-box;
}
.logo{width:.47rem;float:left;}
.logo img{
    width: 100%;
}
.tel{
    float:right;
    color: #fff;
    font-size:.1rem;
    line-height: .12rem;
    text-align: center;
    text-shadow: #45ac56 1px 0 0, #45ac56 0 1px 0, #45ac56 -1px 0 0, #45ac56 0 -1px 0;
}
.banner{width: 100%;height:3.25rem;position: relative;overflow: hidden;}
.banner>img{width: 100%;height: auto;}
.warp{
    padding-bottom: .25rem;
}
.warp *{
    box-sizing: border-box;
}
.warp h2{
    height: .34rem;
    background:url(../images/h2_bg.png) no-repeat .575rem .03rem;
    background-size: .31rem .31rem;
    text-align: center;
}
.warp h2 img{
    width:1.16rem;
}
.warp h3{
    font-size: .13rem;
    line-height: .13rem;
    color: #2e2e2e;
    text-align: center;
}
.part1{
    width: 100%;
    height: .55rem;
    position: relative;
}
.part1 .allow{
    position: absolute;
    width: 3.5rem;
    height: .84rem;
    background: url(../images/p1_bg.png) no-repeat;
    background-size: 100%;
    top: -.535rem;
    left: 50%;
    transform:translate(-50%,0);/*左右，上下*/
    padding: .125rem 0 0 .125rem;
}
.part1 .allow p{
    float: left;
}
.part1 .allow p:nth-of-type(1){
    width:1.04rem;
    text-align: center;
    padding-top:.06rem;
}
.part1 .allow p:nth-of-type(1) span{
    display: block;
    color: #27c266;
    font-size: .1rem;
    line-height: .1rem;
    margin-bottom:.05rem;
}
.part1 .allow p:nth-of-type(1) label{
    display: block;
    font-size: .24rem;
    color: #27c266;
    font-weight: 700;
    line-height: .24rem;
}
.part1 .allow p:nth-of-type(2){
    width: 1.45rem;
    padding:.12rem 0 0 .11rem;
}
.part1 .allow p:nth-of-type(2) span{
    display: block;
    font-size: .13rem;
    color: #464646;
    line-height: .13rem;
    margin-bottom: .08rem;
}
.part1 .allow p:nth-of-type(2) label{
    display: block;
    width: .82rem;
    height: .13rem;
    box-sizing: content-box;
    font-size: .1rem;
    line-height: .13rem;
    border-radius: .05rem;
    border: 1px solid #27c266;
    color: #27c266;
    text-align: center;
}
.part1 .allow p:nth-of-type(3){
    width: .75rem;
    height: .59rem;
}
.part1 .allow p:nth-of-type(3) a{
    display: block;
    height: .59rem;
    color: #fff;
    text-align: center;
    font-size: .13rem;
    line-height: .15rem;
    padding-top: .14rem;
}
.part2{
    width: 100%;
    padding:.25rem .25rem .3rem;
}
.part2 h3{
    margin-bottom: .25rem;
}
.part2 img{
    display: block;
    margin: 0 auto;
    width:100%;
}
.part3{
    width: 100%;
    padding:0 .25rem;
}
.part3 h3{
    margin-bottom:.32rem;
}
.part3 ul{
    width: 100%;
}
.part3 ul li{
    position: relative;
    width: 100%;
    height:.825rem;
    margin-bottom: .125rem;
    padding-left:.88rem;
}
.part3 ul li img{
    display: block;
    position: absolute;
    width: .8rem;
    height: .8rem;
    top: 0;
    left: 0;
    border-radius: .04rem;
}
.part3 ul li span{
    display: block;
    height: .26rem;
    text-indent: .085rem;
    font-size: .16rem;
    font-weight: 700;
}
.part3 ul li span i{
    color: #3bca6c;
    padding-left: .13rem;
    font-size: .12rem;
    font-weight: 500;
}
.part3 ul li label{
    display: block;
    width: 100%;
    height: .56rem;
    background: #f8f8f8;
    border-radius: .03rem;
    padding:.08rem 0 0 .1rem;
    line-height: .2rem;
    color: #434343;
    font-size: .1rem;
}
.part3 ul li label em{
    font-size: .12rem;
    font-weight: 500;
}
.part4{
    width: 100%;
    padding:.26rem .25rem .25rem;
    position: relative;
}
/* .part4::before{
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height:3.45rem;
    background: #3bca6c;
    bottom: 0;
    left: 0;
    z-index: -1;
} */
.part4 h4{
    height: .28rem;
    text-align: center;
    background:url(../images/p4_h4.png) no-repeat 1.33rem 0;
    background-size:1.82rem;
    font-size: .18rem;
    color: #3bca6c;
    line-height: .28rem;
}
.part4 h4 span{
    font-size: .13rem;
    color: #2e2e2e;
    padding-left: .08rem;
}
.part4 ul.hd{
    display: flex;
    justify-content: space-around;
    width: 100%;
    height: .8rem;
    padding-top: .32rem;
}
.part4 ul.hd li{
    position: relative;
    font-size: .15rem;
    color: #585858;
    line-height: .16rem;
}
.part4 ul.hd li.on{
    font-size: .16rem;
    color: #3bca6c;
    font-weight: 700;
}
.part4 ul.hd li.on::before{
    content:"";
    display: block;
    position: absolute;
    width: .18rem;
    height: 5px;
    background: #fbd448;
    border-radius: 2.5px;
    left: 50%;
    transform:translate(-50%,0);/*左右，上下*/
    bottom:.16rem;
}
.part4 div.bd{
    width: 100%;
    border: 1px solid #3bca6c;
    padding:.2rem .18rem .25rem;
    background: #fff;
    border-radius:.04rem;
}
.part4 div.bd li{
    margin-bottom:.06rem;
}
.part4 div.bd li.tit{
    line-height: .14rem;
    font-size: .14rem;
    font-weight: 700;
    color: #3a3a3a;
    margin-bottom: .12rem;
}
.part4 div.bd li.tit a{
    float: right;
    font-size: .11rem;
    color: #3bca6c;
    font-weight: 500;
}
.part4 div.bd li.tit i{
    color: #3bca6c;
}
.part4 div.bd li span{
    display: inline-block;
    width: .57rem;
    font-size: .11rem;
    color: #3a3a3a;
    line-height: .16rem;
    vertical-align: top;
}
.part4 div.bd li label,.part4 div.bd li em{
    display: inline-block;
    width:2.3rem;
    line-height: .16rem;
    font-size: .11rem;
    color: #3a3a3a;
    margin-left: -4px;
    vertical-align: top;
}
.part4 div.bd li em{
    color: #3bca6c;
    font-weight: 500;
}
.part4 div.bd li.boundary{
    width: 100%;
    height: 1px;
    box-sizing: content-box;
    padding-bottom:.24rem;
    border-top: 1px solid #f7f7f7;
    margin-top: .25rem;
}
.part4 a.btn{
    display: block;
    margin:.125rem auto 0;
    width: 100%;
    height: .46rem;
    border-radius:.05rem;
    background: #fbd448;
    text-align: center;
    line-height: .46rem;
    color: #fff;
    font-size: .13rem;
}
.part5{
    width: 100%;
    padding: .38rem .25rem .25rem;    
}
.part5 .course{
    padding:.5025rem 0 1rem;
    position: relative;
}
.part5 ul.hd{
    position: absolute;
    width: 100%;
    text-align: center;
    left: 0;
    bottom:.2rem;
}
.part5 ul.hd li{
    display: inline-block;
    width:.55rem;
    height: .55rem;
    border-radius: 50%;
    border: 1px solid #2bb84f;
    margin: 0 .05rem;
    overflow: hidden;
}
.part5 ul.hd li.on{
    background: #2bb84f;
}
.part5 ul.hd li img{
    width: 100%;
}
.part5 .bd{
    position: relative;
    width: 100%;
    border-radius: .08rem;
    background-image:linear-gradient(131deg,rgba(43,184,79,.2),rgba(43,184,79,0));
    box-shadow: 0 0 .1rem rgba(29, 189, 99,.4);
}
.part5 .bd ul{
    width: 100%;
    height: 1.7rem;
    background:url(../images/p5_bg1.png) no-repeat 2.43rem .1rem;
    background-size:.66rem;
    padding:.16rem 0 0 1.35rem;
    position: relative;
}
.part5 .bd ul::before{
    content: "";
    display: block;
    position: absolute;
    width:2.75rem;
    height: .075rem;
    background:#a3da02;
    top: -.075rem;
    left: 50%;
    transform:translate(-50%,0);/*左右，上下*/
    border-radius: .05rem .05rem 0 0;
    z-index: 1;
}
.part5 .bd ul::after{
    content: "";
    display: block;
    position: absolute;
    width:1.9rem;
    height:.15rem;
    background:rgba(43, 184, 79, .1);
    top: -.15rem;
    left: 50%;
    transform:translate(-50%,0);/*左右，上下*/
    border-radius: .05rem .05rem 0 0;
    z-index:2;
}
.part5 .bd ul img{
    position: absolute;
    width:1.44rem;
    left:-.2rem;
    bottom: 0;
    z-index:10
}
.part5 .bd ul li:nth-of-type(1){
    font-size: .15rem;
    line-height: .15rem;
    margin-bottom: .04rem;
    font-weight: 700;
    color: #000000;
}
.part5 .bd ul li:nth-of-type(1) i{
    color: #4c4c4c;
    font-size: .11rem;
    padding-left: .15rem;
    font-weight: 500;
}
.part5 .bd ul li:nth-of-type(2){
    margin-bottom: .15rem;
}
.part5 .bd ul li:nth-of-type(2) label{
    display: inline-block;
    width: .5rem;
    height: .13rem;
    box-sizing: content-box;
    border: 1px solid #2bb84f;
    text-align: center;
    line-height: .13rem;
    color: #2bb84f;
    font-size: .1rem;
    margin-right: .05rem;
}
.part5 .bd ul li:nth-of-type(3){
    margin-bottom: .08rem;
}
.part5 .bd ul li:nth-of-type(3) em{
    display: block;
    width: .7rem;
    height: .13rem;
    background: #2bb84f;
    color: #fff;
    text-align: center;
    line-height: .13rem;
    font-size: .1rem;
    font-weight: 500;
}
.part5 .bd ul li:nth-of-type(4) span{
    display: block;
    padding-left:.06rem;
    position: relative;
    font-size: .11rem;
    color: #4c4c4c;
    line-height:.14rem;
}
.part5 .bd ul li:nth-of-type(4) span::after{
    content: "";
    display: block;
    position: absolute;
    width:4px;
    height:4px;
    border-radius: 50%;
    background: #2bb84f;
    left: 0;
    top: .06rem;
}
.part6{
    width: 100%;
    padding:0 .35rem .2rem;
}
.part6 h3{
    margin-bottom: .2rem;
}
.part6 .swiper-container{
    width: 100%;
    height:1.73rem;
}
.part6 .swiper-container li{
    width: 3.06rem;
    height: 1.43rem;
    border-radius: .05rem;
    position: relative;
    overflow: hidden;
}
.part6 .swiper-container li img{
    width: 100%;
}
.part6 .swiper-container li span{
    display: block;
    position: absolute;
    width: 100%;
    height: .37rem;
    left: 0;
    bottom: 0;
    background-image: linear-gradient(to right,rgba(0,0,0,.8),rgba(0,0,0,0));
    font-size: .12rem;
    line-height: .37rem;
    text-indent: .2rem;
    color: #fff;
}
.part6 .swiper-container-horizontal>.swiper-pagination-bullets{
    bottom:0;
}
.part6 .swiper-pagination-bullet{
    background: #a5a5a5;
    opacity: 1;
    width: .06rem;
    height: .06rem;
}
.part6 .swiper-pagination-bullet-active{
    background:#3fb557
}
.part7{
    padding: 0 .25rem .34rem;
}
.part7 h5{
    font-size: .2rem;
    text-align: center;
    line-height: .2rem;
    color: #2bb84f;
    margin-bottom: .08rem;
}
.part7 h6{
    font-size: .12rem;
    color: #2e2e2e;
    text-align: center;
    line-height: .12rem;
    margin-bottom: .2rem;
    position: relative;
}
.part7 h6::after{
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    width: 60%;
    height: .04rem;
    background: #edf8cc;
    left:50%;
    transform:translate(-50%,0);/*左右，上下*/
    bottom: 0;
}


