.MainContainer{max-width:720px;margin:auto;background: #f2ab3b;}

.qun-head{background: #f07c10;position:relative;}
.qun-head .qun-icon{position:absolute; z-index:1;left:15px;bottom:0px;width:90px;height:90px; border-radius: 100%;}
.qun-head .qun-v{position:absolute;width:20px;height:20px;z-index:2;left:80px;bottom:0px;}
.qun-head .word{height:35px; background: #f2ab3b;border:0;}
.qun-head span{display:block;float:right;padding:0px 16px 0px 16px;margin-right:15px;font-size:13px;border-radius: 3px;}
.qun-head span.join{color:#fff;}
.qun-head .banner{background:url({$info.banner}) no-repeat;	background-position:center center;}
.qun-head .banner img{width:100%;}


.SideBox{position:absolute; top:-50px; background: #FFF;padding: 50px 15px 15px 15px;position: relative; margin:15px 15px 15px 0;border-radius: 0 10px 110px 0;}
.SideBox .head .qun-title{font-weight:bold; font-size:18px; color: #f07c10; }
.aboutcnt .cnt{color: #f07c10;width:100%;overflow: hidden;font-size:14px;line-height:23px;}
.aboutcnt .cnt p{ padding:5px 0;}
.aboutcnt .nav{color: #888; font-size:12px;}
.aboutcnt .nav em{font-weight:bold;margin-left:10px;margin-right:3px;}
.aboutcnt .nav em.left{margin-left:0;}
.aboutcnt .nav span{margin-left:8px;}





.MainMenu{top:-40px;padding: 15px;position: relative;}
.MainMenu ul:after{content: '';display:block;clear: both;}
.MainMenu ul li{width:25%;float: left;overflow: hidden;position: relative;}
.MainMenu ul li span,.MainMenu ul li em{display: block;width:60px;overflow: hidden;margin: auto;text-align: center;position: relative;}
.MainMenu ul li span{border-radius: 50%;background: #23C075;color: #FFF;}
.MainMenu ul li em{line-height: 40px;overflow: hidden;font-size:14px;color: #FFF;}
.MainMenu ul li:nth-child(2) span{background: #F90;}
.MainMenu ul li:nth-child(3) span{background: #B01FE0;}
.MainMenu ul li:nth-child(4) span{background: #133CD7;}
.MainMenu ul li span:before{content: '';display: block;padding-top: 100%;}
.MainMenu ul li span i{
	position: absolute;
	left:50%;
	top: 50%;
	font-size:30px;
  -webkit-transform: translate3D(-50%, -50%, 0);
      -ms-transform: translate3D(-50%, -50%, 0);
          transform: translate3D(-50%, -50%, 0);
}


.xuzhi{position:absolute; padding: 15px;position: relative;background: #f2ab3b;}
.xuzhi .head .qun-title{font-weight:bold; font-size:18px; color: #333; }
.xuzhi .cnt{color: #fff;width:100%;overflow: hidden;font-size:14px;line-height:23px;}
.xuzhi .cnt span{ padding:5px 0;}
.xuzhi .cnt p{ padding:5px 0;}
.xuzhi .nav{color: #888; font-size:12px;}
.xuzhi .nav em{font-weight:bold;margin-left:10px;margin-right:3px;}
.xuzhi .nav em.left{margin-left:0;}
.xuzhi .nav span{margin-left:8px;}


/**底部**/

.footer{ width: 100%; max-width:720px;margin:auto;background: #f2ab3b; position:fixed; bottom: 0; z-index: 10;} 
.foot{overflow: hidden; padding:10px 15px;}
.foot_l{ float: left;font-size: 16px; color:#000; padding-top:6px;}
.foot_r{ float: right; background:#f30; border-radius:20px; padding:5px 50px;}
.foot_r a{color:#fff;}



/**关注**/
.guanzhu {position:fixed;width:100%;max-width:720px;margin:auto;background:rgba(0,0,0,.5);z-index:999;}
.guanzhu .list{float:left; padding-left:15px;line-height: 50px; color: #f9f9f9;}
.guanzhu .gz {float: right; margin-right:15px;background: #f30; border-radius: 15px;font-size: 14px; color: #fff; margin-top:15px; line-height:22px; padding:0 12px;}

/**幻灯片/banner**/
.qun-head{background:#fff;position:relative;}
.qun-head .banner{background-position:center center;}
.qun-head .banner img{width:100%;}
#owl-demo { width: 100%; margin-left: auto; margin-right: auto;}
#owl-demo .item{ display: block;}
#owl-demo img { display: block; width: 100%;}
.owl-theme .owl-controls{margin-top:0;}

/**标题**/
.title_1 {padding:30px 15px; text-align: center;}
.title_1 span{display: block;font-size: 30px;color: #F90;line-height:40px;font-weight: 800;}
.title_1 span em{color: #333;margin-right: 5px;font-size: 30px;font-weight: 800;}
.title_1 p{color:#666;}

.about_1 { padding:50px 15px;}
.about_1 .head { border-left:8px solid #f90;border-radius:15px 0 0 0; border-top:1px solid #f90;}
.about_1 .head span { color:#f90; font-weight:bold; line-height:50px;}
.about_1 .head p{ padding-left:20px; color:#999; padding-top:10px;}
.about_1 .content{color:#999; text-align:justify; line-height:24px; padding:15px 0; font-size:14px;}
.about_1 .content span { color:#f90; text-align:center;}
.about_1 .content p { padding:5px 0;}

.about_2 {background: url(lx_8.png) center no-repeat; background-size: cover;padding:50px 0 0;}
.about_2 .lesson_head {font-size:30px; text-align:center; color:#fff; padding-bottom:30px;}
.box_2{padding:20px 5px; margin:15px; border-radius:10px; background: #000033;}
.box_2 ul:after{content: '';display:block;clear: both;}
.box_2 ul li{width:31%;float:left; padding:10px 1% 10px 1.3%;}
.box_2 ul li span{position: relative; margin:10px auto; padding:15px 0; display: block; width:43px; height: 40px; color: #fff; background: #de1620; font-size: 30px; line-height: 26px; font-weight: bold;}
.box_2 ul li span:before { content: ""; position: absolute; left: -20px; top: 0; width: 0; height: 0; border-right: 20px solid #de1620; border-top: 35px dashed transparent; border-bottom: 35px dashed transparent;}
.box_2 ul li span:after { content: ""; position: absolute; right: -20px; top: 0; width: 0; height: 0; border-left: 20px solid #de1620; border-top: 35px dashed transparent; border-bottom: 35px dashed transparent;}
.box_2 ul li span p {font-size:9px; line-height: 12px; filter: alpha(opacity=80); -khtml-opacity: .8; -moz-opacity: .8; opacity: .8;}
.box_2 ul li em{font-size: 14px; line-height:16px; color:#fff;}

.about_3{padding: 15px; text-align: center;}
.about_3 ul li{width:50%;float: left;padding:15px 0;}
.about_3 ul li span{color: #fff;border-radius:20px; padding:10px 40px; background: #d00904;}
.about_3 ul em{color: #fff;line-height:38px;}
.about_3 ul li:nth-child(2) span{background: #F90;}
.about_3 ul li:nth-child(3) span{background: #B01FE0;}
.about_3 ul li:nth-child(4) span{background: #133CD7;}
.about_3 .fifty_2{font-size:20px;line-height:30px;color: #fff; font-weight:800;}

.about_4{padding: 20px 15px 40px;text-align:center; background:#f9f9f9 url(wenti.png) no-repeat center;background-size: 100%; }
.about_4 .head { font-size:20px; text-align:center; color:#f90;padding:15px 0 0; font-weight:700;}
.about_4 .info-content img{width:100%;}
.about_4 .info-content p{line-height:24px;}

/*课程大纲列表*/
.about_5{background: #fff url(lx_6.jpg) center no-repeat; background-size:100%;}
.owl-carousel {-ms-touch-action:pan-y;}
.owl-carousel .owl-wrapper-outer {overflow:hidden;}
.owl-carousel .owl-item {float:left}
.slide{padding:15px 15px 30px 40px;}
.slide .title{color:#fff; font-size:24px; padding-bottom:30px;}
.slide .title span{margin-right:5px;font-weight:700;font-style:oblique;}
.slide .content{line-height:28px; color:#f6f6f6;}
.about_5 .huadong{ padding-bottom:30px;text-align:center; font-size:14px; color:#f90; }

/**学习方式**/
.buzhou{background: url(lx_11.png) no-repeat center 70%;background-size: 150px; padding-bottom:20px;}
.buzhou:after{content: '';display: block;clear: both;}	
.buzhou .why{width:45%;float: left;overflow: hidden;}
.buzhou .why ul{padding:30px 20px;}
.buzhou .why ul i{ font-size:50px; color:#ddd;}
.buzhou .why ul li {color:#fff; font-size: 18px; font-weight:700; padding-bottom:5px;}
.buzhou .why ul ol{display: block;font-size: 14px;color:#999; line-height:20px;}
.buzhou .fr{float: right; text-align:right;}

.huoban{ padding:20px 10px; background:#eee;}
.huoban img{border-radius: 10px; width:100%;}

/**讲师**/
.about_6{max-width: 720px; margin:0 15px;}
.jiangshi {background: #164698 url(jiangshi_bg.png) top no-repeat; background-size: 100%; height:auto; border-radius:15px;}
.jiangshi .tit{ padding:110px 15px 40px; content: '';display:block;clear: both;}
.jiangshi .tit span{color: #000; font-size: 30px; line-height:100px;}
.jiangshi .tit p{color:#666; font-size:14px;}
.jiangshi .con{padding:10px 15px 20px; background: #164698; border-radius:15px;}
.jiangshi .con p{color: #fff;}

/**优势**/
.youshi{padding:20px 10px;}
.youshi:after{content: '';display: block;clear: both;}	
.youshi .why{width:50%;float: left;overflow: hidden;}
.youshi .why ul{margin: 5px;background: #fff;padding: 10px; border-radius:10px;}
.youshi .why ul li { padding:10px 0;color:#333; font-size: 16px; max-height:40px;}
.youshi .why ul ol{display: block;font-size: 14px;color:#999; line-height:20px; min-height:80px;}

/***滑动图片**/
.about_7{overflow:hidden; padding:20px 15px;}
.common-bgmargin{overflow: hidden;position: relative;}
.pic{width:100%;display: inline;white-space: nowrap;overflow-x:scroll;float:left;overflow-y:hidden；}
.pic li{display:inline-block;width:80%;margin-right:8px;}
.pic li .img {position: relative; }
.pic li .img img {width:100%; border-radius:5px; min-height:180px;}
.pic li .img .info {position: absolute; bottom: 0; left:0; right:0;padding: 2px 10px; background: rgba(0, 0, 0, .5);font-size: 14px; color: #fff; border-radius:0 0 5px 5px;}

/**评价**/
.about_9{margin:15px;}
.about_9:after{content: '';display: block;clear: both;}	
.about_9 li{margin-right:15px;width:80%;background:#fff;border-radius:5px;}
.about_9 li:nth-child(15){margin-right: 0;}
.about_9 li .lists{border-radius:5px; background: url(../../haibao/default/yinhao.png) bottom 10px right 10px no-repeat; background-size: 15%;}
.about_9 li .lists .title{padding:10px;color:#333; min-height:130px; text-align:justify;
word-break: break-all;
    text-overflow: ellipsis;
    display: -webkit-box; 
    -webkit-box-orient: vertical; 
    -webkit-line-clamp: 5; 
    overflow: hidden; }
.about_9 li .lists .price{position:absolute;height:60px;top:-5px;}
.about_9 li .lists .price div{padding:15px 10px 0 10px;text-align:center;line-height:18px;height:40px;overflow:hidden;color:#F30;}
.about_9 li .lists .time{padding:5px 10px 10px;color:#999; font-size:12px;}
.about_9 li .lists .time i{padding-right:3px;}

.about_9 li .lists .img {position: relative;}
.about_9 li .lists .img img {width:100%;border-radius:5px 5px 0 0; max-height:200px;}
.about_9 li .lists .img .info {position: absolute; bottom: 0; left:0; right:0;background: rgba(0, 0, 0, .5); padding:8px 10px;}
.about_9 li .lists .img .info p{font-size: 12px; line-height:18px; color: #fff;}
.about_9 li .lists .img .info i{padding-right:3px; color:#fff;}


/**关于**/
.about_8{ background: #fff url(lx_5.jpg) top center no-repeat; background-size: cover;-webkit-background-size: cover;-o-background-size: cover;background-position: center 0;}
.about_8 .head { font-size:20px; text-align:center; color:#fff;padding:15px;}
.about_8 .content{text-align:justify; padding:0 15px;  padding-top:320px;}
.about_8 .content p{line-height:24px; color:#333; padding-bottom:10px;}


/**底部**/

/**底部弹窗**/
.tcmall-mask{ display:none; z-index:100; background:rgba(0,0,0,0.8); position:fixed; top:0; left:0; right:0; bottom:0;-webkit-animation:fadeIn 0.5s 0s ease both; -moz-animation:fadeIn 0.5s 0s ease both;}
.cart{ display:none; position:fixed; background:#fff; border-radius:10px 10px 0 0; bottom:0; z-index:101;width:100%;}
.cart .cart_header{ position:fixed;float:right; right:15px;}
.cart .cart_header .close{font-size:24px; padding-top:10px;}
/**表单**/
.biaodan{height:auto;}
.biaodan .biaodan_header{ padding:20px 20px 0;}
.biaodan .biaodan_header .title{ line-height:40px; font-size:20px; color:#000;}
.biaodan .biaodan_header .Info{color: #666;font-size:14px;}
.biaodan .biaodan_header .Info i{ color:#f30;font-size:16px;padding-right:3px;}
.biaodan .aboutcnt{padding:20px;}
.biaodan .aboutcnt dl{padding-bottom:20px; width:90%;}
.biaodan .aboutcnt dd .layui-input{ border-radius:15px; border:1px solid #eee; padding:5px 15px; font-size:14px; }
.aboutcnt .butter button{display: block;border:0px;width:50%;line-height:40px;background:#f30;color: #FFF;border-radius: 25px;margin: 15px auto;}




