@charset "utf-8";
/* CSS Document */
body{max-width: 100%; overflow-x: hidden; background: #fff; font: 18px/36px "Hiragino Sans GB", "MicroSoft YaHei", Arial, sans-serif;}
body , h1 , h2 , h3 , h4 , h5 , h6 , hr , p , blockquote , dl , dt , dd , ul , ol , li,pre , form , fieldset , legend , button , input , select, textarea,th, td{margin: 0; padding: 0;}
img{border: none; max-width: 100%;}
body{width: 100%;}
a{color: #2b2a3c; text-decoration: none;}
a:hover{text-decoration: none;}
a , area{blr: expression(this.onFocus=this.blur());}
ul , ol , li{list-style: none;}
table{border-collapse: collapse; border-spacing: 0; max-width: 100%;}
input , :focus{outline: 0;}
input[type="button"] , input[type="submit"] , input[type="reset"] , select{-webkit-appearance: none; appearance:none; -moz-appearance:none; -ms-appearance:none;}
input::focus-inner{padding: 0; border: 0;}
input::-webkit-input-placeholder{ color: #999;}
input::-moz-placeholder{ color: #999;}
input:-moz-placeholder{ color: #999;}
input:-ms-input-placeholder{ color: #999;}
select::-ms-expand{display: none;}
select{appearance:none; -moz-appearance:none; -webkit-appearance:none;}

.fl{float: left;} .fr{float: right;}
.clearfix::after{display: block; content: ''; height: 0; font-size: 0; clear: both;} .clearfix{zoom: 1;}
.clear{height: 0; width: 100%; overflow: hidden; font-size: 1px; line-height: 0; visibility: hidden;}
.Width{width: 1190px; margin: 0 auto;}
.hide , .onlymob{display: none;}
.container{width:1200px; margin:0 auto; position:relative; box-sizing: border-box;}
.container::after{display: block; content: ''; height: 0; font-size: 0; clear: both;}
ul::after{display: block; content: ''; height: 0; font-size: 0; clear: both;}

/* 通用头部 */
.ht_top{width:100%;background:url(https://www.huatu.com/z/413ztjx/images/nav_bg.gif) repeat-x 0; height:41px;}
.logo{float:left;}
.logo img{ border:0; padding:0;}
.zt_top{width:1000px;height:41px;margin:0 auto;}
.topnav{float:right;}
.huatu01{margin-left:10px; font-size:14px; color:#333; text-decoration:none;}
.huatu01:hover{ text-decoration:none; color:#C30;}
.huatu{ float:right; line-height:41px;}

.wx{position: relative;padding-left: 30px;background: url(http://u2.huatu.com/hubei/2018/kc_wxin.png) no-repeat left 

center;cursor: pointer;float:right;margin-left:12px;font-size: 14px;color:#333;z-index: 999;}
.wx:hover .wx_box{display: block;}
.wx:hover{color: #FF4B4E;}
.wx_wrap{min-width: 192px;height: 100px;padding-top: 30px;margin-bottom: 13px;}
.wx_box{display: none;position: absolute;bottom: -150px;padding-left: 20px;left: 0;min-width: 217px;height: 150px;background-color: #fff;z-index: 10;box-shadow: 0 0 7px rgba(58, 58, 58, 0.2);
background-color: white;
}
.wx_box img{display: block;float: left;width: 80px;height: 80px;}
.wx_box a{display: block;float: left;width: 70px;height: 26px;margin-left: 15px;background: #e92930;border-radius: 3px;color: #fff 

!important;font-size: 14px;line-height: 26px;text-align: center;margin-top:-2px;text-decoration: none;}
.wx_box span{display: block;float: left;margin: 0 0 10px 15px;color: #000;font-size: 14px;line-height: 23px;}


@media only all and (max-width:1200px){
	.zt_top{width:100%;}
	.wx{display:none;}
	
}

@media only all and (max-width:800px){
	
	.zt_top{width:100%;}
	.wx{display:none;}
	
	
}


@media only all and (max-width:500px){
	
	
	.zt_top{width:100%;}
	.wx{display:none;}
	
}

/* 通用底部 */
.footer{clear: both; position: relative; padding: 30px 0; text-align: center; margin-top: 50px;}
.footer p{position: relative; z-index: 2; color:#333; font-size: 16px; line-height: 30px;}
.footer p span{padding: 0 5px;}
.footer p a{color:#333;}

.banner_box{width: 100%; height: 275px; background: url("../images/banner_bg.png") center top no-repeat; position: relative;}
.banner_box canvas{position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%;}
/* .banner_box .container{padding-top: 50px;} */
.banner_logo{display: block; width: 170px; margin: 0 auto; padding-top: 23px; }
.banner_box h1{font-size: 0; background: url("../images/banner_h1.png") no-repeat; width: 661px; height: 187px; margin: 10px auto 0 auto;background-size: 100%;}
.banner_box h2{font-size: 0;}
.body_box{margin-top: 25px;}
.icon_list li{float: left;width: 23%;margin: 10px 1%;transition: all 1s;}
.list_icon_box{transition: all 1s;display: flex;justify-content: center;align-items: center;width: 155px;height: 155px;box-sizing: border-box;border-radius: 50%;border:1px solid #dcdcdc;box-shadow:2px 8px 12px 0px rgba(14,13,20,0.1);padding: 20px;margin: 0 auto;background: #fff;}
.list_icon_box img,.right_icon_box img{max-width: 100%;}
.icon_list li p{line-height: 1.5rem;text-align: center;font-size: .8rem;color: #0E0D14;}
.right_list{display: none;width: 100%;height: 100%;position: fixed;z-index: 99;left: 0;right: 0;top: 0;bottom: 0;background: rgba(0,0,0,.5);}
.right_list_box{display: none;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);background: #fff;width: 46%;box-sizing: border-box;padding: 20px;border: 1px solid #A5A5A6;color: #0E0D14;border-radius: .5rem;}
.right_list_top{margin-bottom: .5rem;}
.right_icon_box{float: left;display: flex;justify-content: center;align-items: center;width: 110px;height: 110px;box-sizing: border-box;border-radius: 50%;border:1px solid #dcdcdc;box-shadow:2px 8px 12px 0px rgba(14,13,20,0.1);padding: 15px;margin-right: .4rem;}
.right_list_top h5{float: left;line-height: 3rem;font-size: 1rem;}
.right_text{line-height: 1.5rem;font-size: .7rem;}
.right_text b,.right_text span{display: inline-block;vertical-align: top;}
.right_text b{font-size: .8rem;font-weight: bold;margin-right: .3rem;}
.right_qr{display: block;margin: .3rem auto;width: 200px;}
.right_btn{display: block;width: 4.5rem;line-height: 1.6rem;background:rgba(255,255,255,1);border:1px solid #dcdcdc;border-radius: .8rem;margin: 0 auto;text-align: center;font-size: .8rem;color: #0E0D14;}
.fixed_close{display: block;position: absolute;right: .3rem;top: .3rem;width: 1.5rem;}

/*	.xiangyang{float:left;width: 33%;}
.xiangyang p{text-align: center;font-size: 24px;}
.right_qr1{display: block;margin: .3rem .5rem ;width: 200px;}

.icon_list li:nth-last-child(1){margin: 0 auto;float: none;}*/

@media only all and (max-width:1200px){
	.onlymob{display: block;}
    html{font-size: 20px;}
    body{width: 100%;font-size: .7rem;line-height: 1.2rem;background-size: auto 12rem;background-position: center 2rem;}
    html, body{-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
    .Width{width: 17.5rem;}
    .container{width: 98%;}
    .fl,.fr{float: none;}

    /* 隐藏元素 */
    .ht_top .topnav a:nth-child(n+2), .stage,.footer p,.pc, .onlypc{display: none;}

    /* 通用头部 */
    .ht_top{height: 2.5rem;background-size: auto 100%;line-height: 2.5rem;}
    .ht_top h1 a{height: 2.5rem;width: 7.5rem;background: url(../images/mob_logo.png) no-repeat center / contain;}
    .ht_top .topnav{font-size: .8rem;text-indent: -1000rem;}
    .ht_top .topnav a{padding: 0 0 0 0.3rem;text-indent: 0;float: right;}
    .footer{position: relative;height: 2.4rem;padding: 0;overflow: hidden;}
    .footer:before{display: block;content: "华图教育集团版权所有";position: absolute;left: 0;top: 0;width: 100%;height: 2.4rem;overflow: hidden;color: #333;font-size: .7rem;line-height: 2.4rem;text-align: center;}
    .banner_box{width: 100%;height: 10rem;background: url("../images/banner_bg.png") center top no-repeat;background-size: auto 100%;position: relative;}
    .banner_box canvas{position: absolute;top: 0;left: 0;right: 0;bottom: 0;width: 100%;height: 100%;}
    .banner_box .container{padding-top: 1.25rem;}
    .banner_logo{display: block;width: 6.5rem;padding-top: 0;}
    .banner_box h1{font-size: 0;background: url("../images/banner_h1.png");background-size: 100%;background-repeat: no-repeat;width: 17rem;height: 6rem;margin: 1rem auto 0 auto;}
    .banner_box h2{font-size: 0;}
    .body_box{margin-top: 1rem;}
    .icon_list{width: 100%;float: left;transition: all 1s;}
    .icon_list_fixed{width: 750px;}
    .icon_list li{float: left;width: 31.3%;margin: .25rem 1%;transition: all 1s;}
    .list_icon_box{transition: all 1s;display: flex;justify-content: center;align-items: center;width: 4.5rem;height: 4.5rem;box-sizing: border-box;border-radius: 50%;border:1px solid #dcdcdc;box-shadow:2px 8px 12px 0px rgba(14,13,20,0.1);padding: .25rem;margin: 0 auto;background: #fff;}
    .list_icon_box img,.right_icon_box img{max-width: 100%;}
    .icon_list li p{line-height: 1.5rem;text-align: center;font-size: .8rem;color: #0E0D14;}
    .right_list{display: none;width: 100%;height: 100%;position: fixed;z-index: 99;left: 0;right: 0;top: 0;bottom: 0;background: rgba(0,0,0,.5);}
    .right_list_box{display: none;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);background: #fff;width: 80%;box-sizing: border-box;padding: .5rem;border: 1px solid #A5A5A6;color: #0E0D14;border-radius: .5rem;}
    .right_list_top{margin-bottom: .5rem;}
    .right_icon_box{float: left;display: flex;justify-content: center;align-items: center;width: 3rem;height: 3rem;box-sizing: border-box;border-radius: 50%;border:1px solid #dcdcdc;box-shadow:2px 8px 12px 0px rgba(14,13,20,0.1);padding: .2rem;margin-right: .4rem;}
    .right_list_top h5{float: left;line-height: 3rem;font-size: 1rem;}
    .right_text{line-height: 1.5rem;font-size: .7rem;}
    .right_text b,.right_text span{display: inline-block;vertical-align: top;}
    .right_text b{font-size: .8rem;font-weight: bold;margin-right: .3rem;}
	
	.xiangyang{float:left;width: 33%;}
	.xiangyang p{font-size: .65rem;}
	
    .right_qr{display: block;margin: .3rem auto;width: 45%;}
    .right_btn{display: block;width: 4.5rem;line-height: 1.6rem;background:rgba(255,255,255,1);border:1px solid #dcdcdc;border-radius: .8rem;margin: 0 auto;text-align: center;font-size: .8rem;color: #0E0D14;}
    .fixed_close{display: block;position: absolute;right: .3rem;top: .3rem;width: 1.5rem;}
}

@media (min-width: 1230px)and (max-width:1280px){
    /* @media screen and (max-width:1280px){ */
        .banner_box{
            height: 220px;
        }
        .banner_logo{
            width: 120px;
            padding-top: 23px;
        }
        .banner_box h1{
            width: 520px;
            height: 150px;
        }
        .container{
            width: 900px;
        }
        .list_icon_box{
            width: 108px;
            height: 108px;
        }
        .icon_list li p{
            font-size: .5rem;
            line-height: 1.1rem;
        }
    }