.bg-red {
	background:#cd2122;
}
.bg-jzp-counter {
	background: url('../images/bg-counter.jpg') no-repeat center 50%;
	position: relative;
	background-size: cover;
}
.jzp-counter {
	position: absolute;
    width: 100%;
    height: auto;
    background:rgba(0,0,0,0.3);
}
.bg-match-yqh {
	background: url('../images/bg-match-yqh.jpg') center 50%;    
}
.match-yqy {
	padding:30px 50px;
}  
.bg-club-yqh {
	background: url('../images/bg-club-yqh.jpg') center 50%;    
}
.club-yqy {
	padding:30px 50px;
}    
.hyrc {
	font-size:1.2em;
	margin-bottom:50px;
	text-align:center;
}
.hyrc i{
	font-size:2em;
	background:#cd2122;
	border-radius: 50%;
	color:#fff;
	width:90px;
	height:90px;
	line-height:90px;
	text-align:center;
}
.csxz {
	font-size:1.2em;
	margin-bottom:50px;
	text-align:center;
}
.csxz i{
	font-size:2em;
	background:#cd2122;
	border-radius: 50%;
	color:#fff;
	width:90px;
	height:90px;
	line-height:90px;
	text-align:center;
	margin-bottom:30px;
}
.csxz p{
	margin:0px;
}

.kd-school {
	background:#000;
	color:#fff;
	border:solid 1px #dee2e6;
    text-align: center; 
	font-size:0.85em;
	line-height:3em;
}
.kd-school .lhx2{
	line-height:6em;
}
.kd-school .lhx3{
	line-height:9em;
}
.kd-school .lhx4{
	line-height:12em;
}
.kd-school .lhx5{
	line-height:15em;
}

.kd-school a{
	color:#fff;
}
.kl-iconbox--sh-circle span.kl-iconbox__iconx {display: inline-block; border-radius: 50%; vertical-align: middle; position: relative; z-index: 1; line-height:2.5em;width:2.5em;height:2.5em; background-color: #e74c3c; color: #fff; font-size: 46px;}
.kl-iconbox--sh-circle span.kl-iconbox__iconx:after {content:''; position: absolute; top:0; left:0; width:100%; height: 100%; z-index: -1; border-radius: 50%; opacity:0; -webkit-transform:scale(0); -ms-transform:scale(0); transform:scale(0); -webkit-transform-origin:50% 50%; -ms-transform-origin:50% 50%; transform-origin:50% 50%; 
	-webkit-transition: -webkit-transform .2s cubic-bezier(0.215, 0.610, 0.355, 1.000), opacity .2s cubic-bezier(0.215, 0.610, 0.355, 1.000); transition: transform .2s cubic-bezier(0.215, 0.610, 0.355, 1.000), opacity .2s cubic-bezier(0.215, 0.610, 0.355, 1.000); }
.kl-iconbox--sh-circle:hover span.kl-iconbox__iconx:after {-webkit-transform:scale(1.15); -ms-transform:scale(1.15); transform:scale(1.15); opacity: 1; background-color: #c0392b;}




.css3panels-container-cuntomer {position:relative; z-index:0; min-height:150px; margin-left: 10px; margin-top:7px;width:145%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
}





/* Fixes CSS3 Panels */
@media (min-width: 992px) and (max-width: 1200px) {

    .css3panels-container-cuntomer.css3panels--resize:hover .css3panel .css3panel-caption {width: 100%; margin-left: -30%;}
    .css3panels-container-cuntomer.css3panels--resize:hover .css3panel:hover .css3panel-caption {/*width: 100%; margin-left: 0%;*/}



}
@media (min-width: 768px) and (max-width: 991px) {

    .css3panels-container-cuntomer.css3panels--resize:hover .css3panel .css3panel-caption {/*width: 130%; margin-left: -30%;*/}
    .css3panels-container-cuntomer.css3panels--resize:hover .css3panel:hover .css3panel-caption {/*width: 100%; margin-left: 0%;*/}

}

@media (max-width: 767px) {

    .css3panels-container-cuntomer {
	width:100%;
        margin-left: 0; margin-right: 0;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-flex-wrap: wrap;
            -ms-flex-wrap: wrap;
                flex-wrap: wrap;
    }

    
}