@charset "utf-8";
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td, span, input, textarea { margin: 0; padding: 0 }
body { font-size: 14px; font-family: "微软雅黑", Arial, Verdana, Arial, Helvetica, sans-serif; padding-top: 1px; background: #fff }
li, ol { list-style: none }
ins { text-decoration: none }
i, em { font-style: normal }
a { text-decoration: none; font-family: "微软雅黑" }
a:hover { cursor: pointer; text-decoration: none }
:focus { outline: 0 }
.clear { clear: both; line-height: 0; overflow: hidden; zoom: 1; font-size: 0; content: '.' }
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0 }
img { padding: 0; margin: 0 }
a img { border: 0 }
input, textarea { border: 0; font-family: "微软雅黑"; font-size: 13px }
h1, h2, h3, h4, h5, h6 { font-weight: 400; font-size: 14px; font-family: "微软雅黑" }
.fl { float: left }
.fr { float: right }


h2.main_title { overflow: hidden; display: block; text-align: center; line-height: 0; font-size: 0; position: relative; padding-bottom: 1.4rem; background: url(/mobile/images/Index/tbg1.png) no-repeat center bottom; background-size: 1.85rem auto; -webkit-background-size: 1.85rem auto }
h2.main_title a { display: block }
h2.main_title a strong { display: block; font-size: 2.4rem; color: #333; line-height: 100%; letter-spacing: .1rem }
h2.main_title a span { display: block; font-size: 1.4rem; color: #333; line-height: 100%; font-weight: 400; margin-top: .75rem; letter-spacing: 1px }
h2.main_title a:hover { color: #333 }
h2.main_title2 { background: url(/mobile/images/Index/tbg.png) no-repeat center bottom; background-size: 1.85rem auto; -webkit-background-size: 1.85rem auto }
h2.main_title2 a strong, h2.main_title2 a span { color: #fff }

.ban { position: relative; z-index: 3; width: 100%; overflow: hidden }
.ban img { display: block; width: 100% }
.ban .swiper-pagination { bottom: 2rem }
.ban .swiper-pagination-bullet { background: #fff; width: .8rem; opacity: 1; height: .8rem; margin: 0 .4rem !important }
.ban .swiper-pagination-bullet-active { border-radius: .4rem; opacity: 1; background: #ca0303 }

.train { padding: 3rem 9.33% 1.35rem }
.train ul { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap }
.train li { text-align: center; margin-right: 5% }
.train li i {display: block;width: 4.85rem;height: 4.85rem;background: #ca0303;box-shadow: 0 0 1.5rem 0 rgba(51, 51, 51, .35);border-radius: 50%;margin: 0 auto;padding: 1rem;overflow: hidden;}
.train li img{ margin-top:0.48rem}
.train li h3 { font-size: 1.5rem; color: #333; line-height: 100%; margin: .8rem 0 1.9rem }
.train li:nth-child(3n) { margin-right: 0 }

.intro { background: #EFEFEF; padding: 4rem 4% 3.3rem }
.intro h2 { text-align: center; margin-bottom: 1.8rem }
.intro h2 strong { display: block; font-size: 2.1rem; color: #333; line-height: 100%; margin-bottom: .8rem }
.intro h2 span { display: inline-block; font-size: 1.4rem; color: #fff; line-height: 2.5rem; padding: 0 2.2rem; position: relative; background: #CA0303 }
.intro h2 span:before { position: absolute; content: ""; border-style: solid; border-width: 1.25rem; border-color: transparent transparent transparent #EFEFEF; left: 0; top: 0 }
.intro h2 span:after { position: absolute; content: ""; border-style: solid; border-width: 1.25rem; border-color: transparent #EFEFEF transparent transparent; right: 0; top: 0 }
.intro ul { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap }
.intro ul li { width: 48.84%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background: #fff; border: 1px solid #d2d2d2; border-radius: .5rem; padding: 2rem 1.5rem 1.8rem 1.7rem; margin-bottom: .7rem; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center }
.intro ul li h3 { font-size: 1.5rem; color: #333; line-height: 1.95rem }
.intro ul li h3 strong, .intro ul li h3 span { display: block }
.intro ul li img { width: 3.2rem }

.lesson {background: url(/mobile/images/Index/lesson_bg.jpg) no-repeat center top;background-size: 41rem auto;-webkit-background-size: 41rem auto;padding: 4rem 4%;}
.lesson_nav { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; margin: 1.6rem 0 .55rem }
.lesson_nav li { width: 32.89%; height: 3.45rem; background: #fff; border-radius: .5rem; text-align: center; font-size: 1.5rem; color: #333; line-height: 3.45rem; -o-transition: all .3s ease; transition: all .3s ease; margin-bottom: .25rem; cursor: pointer }
.lesson_nav li.cur { color: #fff; background: #ca0303 }
.lesson_con { position: relative }
.lesson_con dl { border-radius: .5rem; overflow: hidden; background: #fff }
.lesson_con dd { padding: 2.2rem 2.9rem 2.95rem }
.lesson_con dd h3 a { display: block; font-size: 1.8rem; color: #ca0303; line-height: 2rem; font-weight: 700 }
.lesson_con dd .desc { margin: 1.4rem 0 2.3rem;    height: 8.4rem;    overflow: hidden; }
.lesson_con dd .desc p { font-size: 1.4rem; color: #333; line-height: 2.1rem }
.info { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center }
.info a { display: block; width: 13.65rem; height: 3.4rem; background: #ca0303; border-radius: 1.75rem; border: 1px solid #ca0303; -o-transition: all .3s ease; transition: all .3s ease; text-align: center; font-size: 1.5rem; color: #fff; line-height: 3.4rem }
.info a:first-child { background: 0 0; border-color: #313131; color: #333; margin-right: .9rem }
.lesson_switch div { position: absolute; width: 3.9rem; height: 3.9rem; opacity: .8; border-radius: 50%; -o-transition: all .3s ease; transition: all .3s ease; top: 8.05rem; z-index: 9; cursor: pointer }
.lesson_switch div:hover { opacity: 1 }
.lesson_switch .lesson_prev { left: 1.5rem }
.lesson_switch .lesson_next { right: 1.5rem }

.skill { padding: 4rem 4% }
.skill ul { margin: 1.8rem 0 .9rem; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap }
.skill ul li { width: 48.7%; border-radius: .5rem; overflow: hidden; margin-bottom: .9rem }
.skill ul li a { display: block }
.skill ul li h4 { background: #EEE }
.skill ul li h4 a { font-size: 1.4rem; color: #333; line-height: 3.25rem; text-align: center; padding: 0 1rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap }

.power { padding: 4rem 0 3.85rem; background: #EFEFEF }
.power h2 a strong { letter-spacing: 0 }
.power_con { position: relative; margin-top: 1.55rem }
.power_con dd { position: relative; padding: 2.5rem 2rem 2.8rem 2.1rem }
.power_con dd .num { width: 5.05rem; height: 6.35rem; background: url(/mobile/images/Index/num_bg.png) no-repeat center top; background-size: 100% 100%; -webkit-background-size: 100% 100%; position: absolute; top: -.7rem; right: 1.85rem }
.power_con dd .num img { width: 2.25rem; margin: 0 auto; padding-top: 1.65rem }
.power_con dd h3 strong { display: block; font-size: 1.9rem; color: #333; line-height: 100% }
.power_con dd h3 span { display: block; font-size: .7rem; color: #999; line-height: 100%; font-family: arial; margin-top: .5rem }
.power_con dd p { margin-top: 1.8rem; font-size: 1.4rem; color: #333; line-height: 2.1rem }
.power .swiper-pagination { position: relative; bottom: 0; height: 1rem }
.power .swiper-pagination-bullet { background: #BFBFBF; width: 1rem; opacity: 1; border-radius: 50%; height: 1rem; margin: 0 .45rem !important }
.power .swiper-pagination-bullet-active { border-radius: 50%; opacity: 1; background: #ca0303 }

.case { padding: 4rem 10%; background: url(/mobile/images/Index/case_bg.jpg) no-repeat center top; background-size: 100% 100%; -webkit-background-size: 100% 100% }
.case_con { margin-top: 1.6rem }
.case_con dl { border-radius: .5rem; overflow: hidden; opacity: .5; -o-transition: all .3s ease; transition: all .3s ease }
.case_con dd { background: #fff; padding: 2rem 2.45rem 1.75rem }
.case_con dd h4 { font-weight: 400; padding-bottom: 1.1rem; border-bottom: 1px solid #DCDCDC }
.case_con dd h4 strong { display: inline-block; font-size: 1.8rem; color: #ca0303; line-height: 100%; vertical-align: text-bottom; font-weight: 400; margin-right: .7rem }
.case_con dd h4 span { display: inline-block; font-size: 1.4rem; color: #ca0303; line-height: 100%; vertical-align: text-bottom }
.case_con dd .desc { font-size: 1.3rem; color: #333; line-height: 2.1rem; padding: .85rem 0; border-bottom: 1px solid #DCDCDC; margin-bottom: 1.6rem }
.case_con dd i { display: inline-block; font-size: 1.3rem; color: #ca0303; line-height: 1.3rem; padding-right: 3.6rem; background: url(/mobile/images/Index/more.png) no-repeat right center; background-size: 2.9rem auto; -webkit-background-size: 2.9rem auto }
.case_con dl.swiper-slide-active { opacity: 1 }

.album { padding: 4.1rem 4% 3.75rem }
.album ul { margin-top: 1.55rem; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; border-radius: .5rem; overflow: hidden }
.album ul li { margin-bottom: .25rem }
.album ul li:nth-child(1) { width: 22.6% }
.album ul li:nth-child(2) { width: 26.38% }
.album ul li:nth-child(3) { width: 49.42% }
.album ul li:nth-child(4) { width: 73% }
.album ul li:nth-child(5) { width: 26.23% }
.album ul li:nth-child(6) { width: 49.56% }
.album ul li:nth-child(7) { width: 49.56% }

.news { padding: 4rem 4% 5.65rem; background: #EFEFEF }
.news dl { margin-top: 1.5rem }
.news dl dt { border-radius: .5rem; line-height: 0; overflow: hidden }
.news dl dd { padding: 1.5rem .45rem 1.8rem }
.news dl dd h4 { font-size: 1.5rem; color: #333; line-height: 1.6rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.news dl dd p { font-size: 1.4rem; color: #666; line-height: 1.8rem; margin: .9rem 0 1rem }
.news dl dd span { display: block; font-size: 1.1rem; color: #999; line-height: 100% }
.news ul { border-top: 1px solid #D2D2D2; border-bottom: 1px solid #D2D2D2; padding: .2rem 0 }
.news ul li { border-bottom: 1px dashed #ccc }
.news ul li h4 { font-size: 1.4rem; color: #333; line-height: 4.5rem; padding-left: 2.1rem; position: relative; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 400 }
.news ul li h4:before { position: absolute; content: ""; width: .6rem; height: .1rem; background: #666; left: .4rem; top: 2.2rem }
.news ul li:last-child { border-bottom: 0 }
.g-ft { margin-top: 0 !important }

html { background: #fff }
 
 /*
 .wrap{ opacity:0; }
.loading{position:fixed;width:100%;height:100%; top:0; z-index:51; display:none; max-width:640px; min-width:320px; z-index:99999;background:#fff;opacity:1;}
.loading img{ display:none;}
.loading #showNext{ line-height:1.8rem; display:none; color:#333; border:0.05rem solid #333; border-radius:5%; padding-left:1rem; padding-right:1rem; text-align:center; position:absolute; right:1rem; top:1rem; z-index:99;}

.homeShow{ animation: fade 0.8s ease both;-webkit-animation: fade 0.8s ease both; }
.ht_z {position:absolute;width:37.33%;top:8.54rem;left:31.73%;background-size: 100%;height:6.375rem; z-index:10}
.loading img{width:100%;}
.ht_t {position:absolute;left:0;bottom:4.5rem;background-size:100% 30.70rem;height:30.70rem;width:100%}
*/
@-webkit-keyframes fade {
  from 
  {
   opacity:1;
   display:block;
   
  }

  to {
    opacity: 0;
    display:none;
    height:0;
   
  }
}

@keyframes fade {
  from{
    opacity: 1;
   display:block;
  }

  to 
  {
    display:none;
    opacity: 0;
    height:0;
  }
}

.fade {
  -webkit-animation-name: fade;
  animation-name: fade;
}


@media screen and (min-width:320px){html{font-size:8.533px;}}
@media screen and (min-width:360px){html{font-size:9.6px;}}
@media screen and (min-width:375px){html{font-size:10px;}}
@media screen and (min-width:393px){html{font-size:10.48px;}}
@media screen and (min-width:400px){html{font-size:10.664px;}}
@media screen and (min-width:414px){html{font-size:11.04px;}}
@media screen and (min-width:440px){html{font-size:11.73px;}}
@media screen and (min-width:480px){html{font-size:12.796px;}}
@media screen and (min-width:520px){html{font-size:13.863px;}}
@media screen and (min-width:560px){html{font-size:14.93px;}}
@media screen and (min-width:600px){html{font-size:15.996px;}}
@media screen and (min-width:640px){html{font-size:17.06px;}}
@media screen and (min-width:680px){html{font-size:18.1288px;}}
@media screen and (min-width:700px){html{font-size:18.66px;}}
@media screen and (min-width:720px){html{font-size:19.1952px;}}
@media screen and (min-width:750px){html{font-size:20px;}}