/* CSS Document */

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
address,
big,
code,
em,
img,
q,
s,
strike,
strong,
syt,
sup,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
form,
label,
legend,
table,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
footer,
header,
nav,
section,
audio,
video,
button,
input {
  margin: 0;
  padding: 0;
  border: 0;
  box-sizing: border-box;
  outline: 0;
  font: inherit;
  font-weight: normal;
  font-family:"Microsoft YaHei", "微软雅黑", SimSun, Arial;
  -webkit-font-smoothing: antialiased; }

em,
i {
  font-style: normal; }

b,
strong {
  font-weight: normal; }

img {
  border: none;
  vertical-align: top;
  max-width: 100%; }

a {
  text-decoration: none; outline:none;}

a:active {
  outline: 0; }
.clear{ clear:both;}

b{
	font-size: 0.32rem;
    line-height: 0.56rem;
    margin-top: 0.2rem;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
  box-sizing: border-box; }

ol,
ul {
  list-style: none; }

blockquote,
q {
  quotes: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }
body {
  background: #fff;
  font-size: 0.64rem; }
  
 /*菜单*/
.iphone__screen {
  width: 100%;
  background: #f7f6f9;
}
.iphone__content {
  position: relative;
  background-color: #D2527F;
  width: 100%;
  height: 100%;
}
.nav {
  position: absolute;
  z-index: 100;
  opacity: 0;
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 300ms;
          transition-duration: 300ms;
}
.nav--active{ overflow:hidden; height:15.85rem; position: absolute;}
.nav--active .nav {
  opacity: 1;
  background:#edeef0;
}
.iphone-back{ width:100%; height:auto; margin:0 auto; text-align:center; position:relative; background:#fff; margin-bottom:0.2rem; padding-bottom:0.1rem;overflow: hidden;}
.iphone-img{ width:100%; height:1.2rem; position:relative; border-top:1px #ebebeb solid; border-bottom:1px #ebebeb solid; display:table;box-shadow: 0 0.05rem 0.1rem rgba(0,0,0,0.07); background:#fff; text-align:center; z-index:2;}
.iphone-img span{ display:block; line-height:1.2rem;}
.and-title{ width:92.54%; height:auto; margin:0 auto; text-align:left; padding-top:0.3rem; padding-bottom:0.2rem; position:relative;}
.and-title em{ display:inline-block; float:left; width:0.05rem; height:0.3rem; background:#ff6960; margin-right:0.15rem; margin-top:0.05rem;}
.and-title span{    display: block; font-size: 0.28rem; color: #333;}

.understand-ge,.group-ul{ width:92.54%; height:auto; margin:0 auto; display:table;padding-bottom:0.2rem; text-align: center;}
.understand-ge li{ float:left; border-right:1px #edeef0 solid; border-bottom:1px #edeef0 solid; width:33.33%; padding-bottom:0.26rem;height: 1.39rem;}
.understand-img{ width:100%; height:0.43rem; line-height:0.43rem; margin-bottom:0.1rem;margin-top:0.3rem;}
.understand-img img{ vertical-align:bottom;max-width:42px; width:18.24%;}
.img02 img{ width:16.43%;max-width:38px;}
.img01 img{ width:15.64%; max-width:40px;}
.img03 img{ width:0.43rem;height:0.43rem;}
.img04 img{ width:17.37%; max-width:40px;}
.img05 img{ width:17.81%; max-width:41px;}
.img06 img{ width:16.87%;max-width:39px;}
.img07 img{ width:19.98%; max-width:46px;}
.img10 img{ width:0.33rem;height:0.32rem;}
.understand-zi{ padding-top:0.5rem;}

.group-ul li{ width:100%; height:auto; line-height:0.5rem; padding-top: 0.12rem; display:table;}
.group-menu{ float:left; width:25.4%;}
.group-menu span{ font-size:0.24rem; color:#333; float:left; margin-left:0.14rem; margin-right:0.24rem;}
.img08{float:left; margin-top: 0.13rem; width: 15.04%; max-width:26px;}
.img09{float:left; margin-top: 0.17rem;width: 5.79%; max-width: 10px;}
.group-menu-right{ float:left; border-bottom:1px #edeef0 solid; margin-left:1.2%; width: 73.28%; padding-bottom:0.16rem;}
.group-menu-right a{ font-size:0.22rem; color:#666; float:left; margin-left:0.2rem;  margin-right: 0.1rem;}
.group-bottm{ padding-bottom:1.88rem;}

/* Default navigation icon */
.nav__trigger {
  display: block;
  position: absolute;
  width: 0.36rem;
  height: 0.25rem;
  right: 0.3rem;
  top: 0.62rem;
  z-index: 200;
}
.nav--active .nav__trigger {opacity: 0.8;}
.nav__icon {
  display: block;
  position: relative;
  width: 0.36rem;
  height: 0.04rem;
  border-radius:0.3rem;
  background-color: #999;
  -webkit-transition-property: background-color, -webkit-transform;
  transition-property: background-color, -webkit-transform;
  transition-property: background-color, transform;
  transition-property: background-color, transform, -webkit-transform;
  -webkit-transition-duration: 300ms;
          transition-duration: 300ms;
}
.nav__icon:before,
.nav__icon:after {
  content: '';
  display: block;
  width: 0.36rem;
  height: 0.04rem;
  border-radius:0.3rem;
  position: absolute;
  background: #999;
  -webkit-transition-property: margin, -webkit-transform;
  transition-property: margin, -webkit-transform;
  transition-property: margin, transform;
  transition-property: margin, transform, -webkit-transform;
  -webkit-transition-duration: 300ms;
          transition-duration: 300ms;
}
.nav__icon:before {
  margin-top: -0.1rem;
}
.nav__icon:after {
  margin-top: 0.1rem;
}
.style-5 .nav {
  -webkit-transform: translate(100%, -100%) scale(0.5);
          transform: translate(100%, -100%) scale(0.5);
  border-radius: 100%;
}
.style-5 .nav--active .nav {
  -webkit-transform: translateY(0) scale(1);
          transform: translateY(0) scale(1);
  border-radius: 0;
  width: 100%;
  height: auto;
}
.style-5 .nav--active .nav__icon {
  background: rgba(0, 0, 0, 0);
}
.style-5 .nav--active .nav__icon:before {
  margin-top: 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
		  /*background:#fff;*/
}
.style-5 .nav--active .nav__icon:after {
  margin-top: 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
		  /*background:#fff;*/
}
/*.style-5 .nav--active .nav__icon:before {
     margin-top: 4px;
    -webkit-transform: rotate(40deg);
    transform: rotate(40deg);
    margin-left: 1px;
    width: 23px;
}
.style-5 .nav--active .nav__icon:after {
     margin-top: -11px;
    -webkit-transform: rotate(-50deg);
    transform: rotate(-50deg);
    width: 24px !important;
}*/

#z_btn_more,#z_btn_more,#video_01,#video_02{ width:100%; height:auto; margin:0 auto;}
/*.layui-layer-shade{ opacity: inherit !important; filter: alpha(opacity=inherit) !important;}
.layui-layer-setwin .layui-layer-close2{ z-index:99;}*/
.star-page{ width:100%;height:1.20rem;line-height:1.20rem; background:#fff; position:relative; border-top:1px #ebebeb solid; border-bottom:1px #ebebeb solid; display:table;box-shadow: 0 0.05rem 0.1rem rgba(0,0,0,0.07);z-index: 2;}
.phone-page{ float:left; margin-left:0.3rem; position:relative; width: 30%;}
.phone-page img{width:1.41rem;height:0.45rem;margin-top:0.4rem;}


.star-page .page_title{ display: block;}
.star-page .page_title b{ display: block;font-size: 0.26rem;color:#454545;position: relative;right:0.6rem; font-weight:bold;}


/*nav*/
.Video_list_main{width:100%;margin:0 auto;}
.hp_nav{width:100%;margin:0 auto;background:#fff;padding-top: 0.36rem;}
.hp_nav_main{width:100%;margin:0 auto;padding-top:0.45rem;}
.hp_nav_main ul{margin:0 auto;}
.hp_nav_main ul li{float:left; font-size:0.27rem;color:#444;margin:0 0.24rem;padding-bottom:0.45rem;}
.hp_nav_main ul li.thisclass{ font-size:0.27rem;color:#333333;background:url(../images/thisclass_x.png) center 0.5rem no-repeat;}
.and-top {padding-top: 0;}
/*头部转换*/
.wrapper02 {width: 100%;height: 1rem;overflow: hidden;margin:0 auto;position:relative;}
.wrapper02 .scroller {position:absolute;margin-left:0.1rem;}
.wrapper02 .scroller li {height: 1rem;color:#333;float: left;line-height: 1rem;font-size: 0.24rem;text-align: center}
.wrapper02 .scroller li a{color:#333;display:block;margin:0 .3rem}
.wrapper02 .scroller li.cur a{color:#ff6960;font-size:0.26rem;}

.phone-name {
    display: block;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    line-height: 0.43rem;
    width: 48%;
}
.phone-tit {
    margin-left: 1.32rem;
    margin-top: 0.44rem;
    margin-bottom: 0.4rem;
    font-size: 0.24rem;
    color: #383635;
    display: inline-block;
    font-weight: bold;
}
.star-imgo2 {
    float: left;
    width: 0.17rem;
    margin: 0.5rem 0 0.4rem 0;
    margin-left: 0.3rem;
    max-width: 17px;
}

/*foot*/
.foot-phone{ width:100%; height:auto;border-top:1px #edeef0 solid; margin:0 auto; text-align:center; background:#fff;}
.foot-phone b{ display:block; padding-top:0.4rem; text-decoration: none;}
.foot-phone b img{ margin-right:0.14rem;width: 3.74%; vertical-align: middle; max-width:28px;}
.foot-phone p{ padding-top:0.3rem; padding-bottom:0.5rem; line-height:0.3rem;}
.foot-phone a{ color:#f76b56 !important; font-weight:bold;}
.foot-title{ width:100%; height:auto;border-radius: 0.06rem;}
.foot-title img{ width: 100%; border-radius: 0; box-shadow: none;}
.foot-top{ margin-top:0.32rem !important;}

.col01{ color:#fff;}
.col02{ color:#f8ff3a;}
.col03{ color:#565656;}
.col04{ color:#333;}
.col05{ color:#f76b56;}
.col06{ color:#ababab;}
.col07{ color:#999;}
.col08{ color:#383635;}
.col09{ color:#444648;}
.col10{ color:#666;}
.col11{ color:#aaa;}
.col12{ color:#4d4965;}
.fz18{font-size:0.18rem;}
.fz20{ font-size:0.2rem;}
.fz22{ font-size:0.22rem;}
.fz24{ font-size:0.24rem;}
.fz26{font-size:0.26rem;}
.fz28{ font-size:0.28rem;}
.fz30{ font-size:0.3rem;}
.fz32{ font-size:0.32rem;}
.fz34{ font-size:0.34rem;}
.fz36{ font-size:0.36rem;}
.fz38{font-size:0.38rem;}
.fz40{font-size:0.4rem}
.fz42{font-size:0.42rem;}
.fz44{font-size:0.44rem;}
.fz46{font-size:0.46rem;}
.fz48{font-size:0.48rem;}
.fz50{ font-size:0.5rem;}
.block01{ display:block;}
.fw{ font-weight:bold;}
.pt33{ padding-top:0.33rem;}
.br01{ border-right:none !important;}
.br02{ border-bottom:none !important;}
.fl-le{ float:left;}
.fl-ri{ float:right;}
.pad60{ padding-bottom:0.6rem !important;}
.mar01{ margin-right:0 !important;}
.bark01{ background:#649efd;}
.bark02{ background:#ff8358;}
.star-imgol{ float: left; width: 23%; margin: 0.22rem 0; margin-left: 0.24rem; max-width: 169px;}
/*首页13年匠心铸造  金牌教学实力*/
.big-swiper{ width:96%; height:auto; margin-top: 1.08rem; background:#fff; margin-left:4%; padding-bottom: 0.23rem;}
.moswiper01{border-radius:0.06rem;}
.moswiper01 img{ width:43.14%; border-radius:0; box-shadow:none; max-width:106px; margin-top:0.2rem; margin-bottom:0.14rem;}
.moswiper01 span{ font-size:0.24rem; color:#333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display:block; line-height:0.32rem; margin-bottom:0.04rem;}
.moswiper01 p{ color:#999; font-size:0.2rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;  line-height:0.32rem;}
.moswiper{ box-shadow:0 0.05rem 0.1rem rgba(0,0,0,0.2); border-radius:0.06rem; background:#f6f6f6;}
.moswiper02{ padding-bottom:0.2rem;}
.total-down{ width:100%; height:auto;}
.total-down em{ float:left; width:36.3%; height:1px; background:#d9d9d9; margin-left:6%; margin-top:0.14rem;}
.total-down span{ float:left; width:0.06rem; height:0.06rem; border-radius:100%; background:#d9d9d9; margin-left: 6%; margin-top:0.12rem;}
.total-down img{width: 54.13%; max-width:133px; display:block; margin:0 auto; padding-top:0.12rem; clear:both; margin-bottom:0.16rem;}


@media screen and (max-width: 414px) {
.phone-and{margin-left: 0.3rem;margin-top:0.4rem;}
.nav__trigger{top:0.6rem;}
.phone-and em{ width:1px; height:0.34rem; background:#bbb; display:inline-block; margin-right:0.18rem; float:left;margin-top:0.1rem;}
.phone-and b{ font-size:0.30rem; font-weight:bold;position: relative; top:0.12rem;}
}
@media screen and (max-width: 375px) {
.phone-and{margin-left: 0.3rem;}
}
@media screen and (max-width: 360px) {
.phone-and{margin-left: 0.3rem;}
}
@media screen and (max-width: 320px) {
.phone-and{margin-left: 0.3rem;}
.phone-and b{top:0.12rem;}
}

.page{
	width: 100%;
	height: auto;
	text-align: center;
	margin-top: 30px;
	font-size:0.2rem;
}
.page a{
	width: 34px;
	text-align: center;
	font-size:0.2rem;
	background-color: #f4f4f4;
	line-height: 34px;
	color: #555;
	display: inline-block;
	margin: 0 4px;
}
.page a:hover,.page a.thislink{
	color: #fff;
	background-color: #ff6b6b;
}
.layui-layer-setwin .layui-layer-close2 {
    right: 0px!important;
    top: 0px!important;
}
.layui-layer-setwin {
    right: 0px!important;
    top: 0px!important;
}
/*弹窗*/
.tan{position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.6);display: none;z-index: 10000;}
.tan .box{width: 95%;height: auto;overflow: hidden;background-color: #fff;border-radius: 3px;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.tan .box .form{position: relative;height: 100%; padding: 0.5rem 10%;text-align: center;overflow: hidden;}
.tan .box .form span.close{position: absolute;right: 16px;top: 5px;font-size: 14px;display: block;cursor: pointer;height: 8px;width: 8px;color: #b0b8bf;}
.tan .box .form span:hover{color: #808492;}
.tan .box .form form input{display: block;width: 94%;outline-style: none;height: 0.8rem;margin-bottom: 0.2rem;border-radius: 3px;border:1px solid #ccc;padding: 0 3%; font-size:0.28rem ;position:relative;}
.tan .box .form h3{font-size: 0.35rem;color: #333437;font-weight: normal;margin-bottom: 0.5rem;}
.tan .box .form form input[name=valicode]{padding-right: 80px;}
.tan .box .form form button{display: block;width: 100%;outline-style: none;height: 0.8rem;margin-bottom: 0.2rem;margin-top: 0.5rem;border-radius: 3px;border:1px solid #ccc;font-size:0.32rem}
.tan .box .form form button[type=button]{background-color: #ff6960;color: #fff;border: 0;height: 40px;cursor: pointer;}
.tan .box .form form input.red{border-color: red;}
.tan .box .form form .valicode{position: relative;}
.tan .box .form form .valicode img{position: absolute;right: 8px;top: 2px;height: 35px;}
.tan .box .form p.reg{margin-top: 20px;}
.tan .box .form p.reg a{color: #333;font-size: 12px;float: right;}
.tan .box .form p.reg a:first-child{float: left;}
.tan .box .form form .error{height: 30px;line-height: 30px;text-align: left;color: red;font-size: 12px;display: none;}    
.tan .box .form .input-item {margin-bottom: 12px;position: relative;}
.tan .box .form .input-item .getcode {border: 0;top: 0;right: 5%;position: absolute;background: 0;line-height:  0.8rem;color: #f60;width: 38%;text-align: center; margin:0; padding:0; font-size:0.25rem ;}
/*留言*/
.tan2{position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.6);display: none;z-index: 10000;}
.tan2 .box{width: 95%;height: auto;overflow: hidden;background-color: #fff;border-radius: 3px;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.tan2 .box .form{position: relative;height: 100%; padding: 0.5rem 10%;text-align: center;overflow: hidden;}
.tan2 .box .form span.close2{position: absolute;right: 16px;top: 5px;font-size: 14px;display: block;cursor: pointer;height: 8px;width: 8px;color: #b0b8bf;}
.tan2 .box .form span:hover{color: #808492;}
.tan2 .box .form form input{display: block;width: 94%;outline-style: none;height: 0.8rem;margin-bottom: 0.2rem;border-radius: 3px;border:1px solid #ccc;padding: 0 3%; font-size:0.28rem}
.tan2 .box .form h3{font-size: 0.35rem;color: #333437;font-weight: normal;margin-bottom: 0.5rem;}
.tan2 .box .form form input[name=valicode]{padding-right: 80px;}
.tan2 .box .form form button{display: block;width: 100%;outline-style: none;height: 0.8rem;margin-bottom: 0.2rem;margin-top: 0.5rem;border-radius: 3px;border:1px solid #ccc;font-size:0.32rem}
.tan2 .box .form form button[type=button]{background-color: #ff6960;color: #fff;border: 0;height: 40px;cursor: pointer;}
.tan2 .box .form form button[type=button]:hover{background-color: #ff6960;}
/*视频提示*/
.tan3{position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.6);display: none;z-index: 10000;}
.tan3 .box{width: 95%;height: auto;overflow: hidden;background-color: #fff;border-radius: 3px;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.tan3 .box .form{position: relative;height: 100%; padding: 0.5rem 10%;text-align: center;overflow: hidden;}
.tan3 .box .form span.close3{position: absolute;right: 16px;top: 5px;font-size: 14px;display: block;cursor: pointer;height: 8px;width: 8px;color: #b0b8bf;}
.tan3 .box .form span:hover{color: #808492;}
.tan3 .box .form form input{display: block;width: 94%;outline-style: none;height: 0.8rem;margin-bottom: 0.2rem;border-radius: 3px;border:1px solid #ccc;padding: 0 3%; font-size:0.28rem}
.tan3 .box .form h3{font-size: 0.35rem;color: #333437;font-weight: normal;margin-bottom: 0.5rem;}
.tan3 .box .form form input[name=valicode]{padding-right: 80px;}
.tan3 .box .form form button{display: block;width: 100%;outline-style: none;height: 0.8rem;margin-bottom: 0.2rem;margin-top: 0.5rem;border-radius: 3px;border:1px solid #ccc;font-size:0.32rem}
.tan3 .box .form form button[type=button]{background-color: #ff6960;color: #fff;border: 0;height: 40px;cursor: pointer;}
.tan3 .box .form form button[type=button]:hover{background-color: #ff6960;}
.tan3 .box .form p{font-size:0.28rem}