
/*-------------------------------
			font start
			----------------------------------*/
@font-face { font-weight: normal; font-style: normal; font-family: 'fontawesome'; src: url("../font/fontawesome-webfont.eot"); src: url("../font/fontawesome-webfont.eot") format("embedded-opentype"), url("../font/fontawesome-webfont.woff2") format("woff2"), url("../font/fontawesome-webfont.woff") format("woff"), url("../font/fontawesome-webfont.ttf") format("truetype"); font-display: fallback; }
@font-face { font-family: "Roboto-Regular"; font-style: normal; src: url(../font/Roboto-Regular.ttf) format("TrueType"); font-display: fallback; }
@font-face { font-family: "Roboto-Bold"; font-style: normal; src: url(../font/Roboto-Bold.ttf) format("TrueType"); font-display: fallback; }


@font-face { font-family: "open-reg"; font-style: normal; src: url(../font/opensans.ttf) format("TrueType"); font-display: fallback; }
@font-face { font-family: "open-bold"; font-style: normal; src: url(../font/Open-Sans-Bold.ttf) format("TrueType"); font-display: fallback; }
@font-face { font-family: "open-light"; font-style: normal; src: url(../font/Open-Light.ttf) format("TrueType"); font-display: fallback; }
@font-face { font-family: "open-semLi"; font-style: normal; src: url(../font/Open-Semibold-Italic.ttf) format("TrueType"); font-display: fallback; }

@font-face { font-family: "muli-bold"; font-style: normal; src: url(../font/Muli-Bold.ttf) format("TrueType"); font-display: fallback; }
@font-face { font-family: "muli-reg"; font-style: normal; src: url(../font/Muli-Regular.ttf) format("TrueType"); font-display: fallback; }

@font-face {font-family: 'homework';
	src:url('../font/homework-normal.ttf');
	font-weight: normal;
	font-style: normal;}
/*-------------------------------
			font end
			----------------------------------*/
/* clear floating */
.clearfix:after, .layout:after, .sys_row:after, .web_main:after, .page_main:after, .nav_wrap .head_nav:after, .items_list ul:after, .product_items:after, .promote_list:after, .cate_items ul:after, .web_head .logo:after, .product-intro:after, .detail-tabs:after, .foot_items:after, .news_cell:after, .sys_row:after, .banner_navigate_button:after, .foor_service:after { clear: both; display: block; visibility: hidden; height: 0; content: ""; }
.clearfix, .layout, .sys_row, .clearfix, .layout, .sys_row, .flex_row, .web_main, .page_main, .nav_wrap .head_nav, .items_list ul, .product_items, .promote_list, .cate_items ul, .web_head .logo, .product-intro, .detail-tabs, .foot_items, .sys_row, .banner_navigate_button, .foor_service { *zoom: 1;
}

/*gotop*/
.gotop { position: fixed; right: 50px; bottom: 50px; z-index: 99999; visibility: hidden; -webkit-box-sizing: content-box; box-sizing: content-box; width: 50px; height: 50px; background-color: #000000; background-clip: content-box; box-shadow: 0 0 8px rgba(0,0,0,.2); color: #ffffff; text-align: center; text-align: center; font-size: 18px; line-height: 50px; opacity: 0; cursor: pointer; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; -webkit-transform: translateY(100%); -moz-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); -ms-transform: translateY(100%); }
.gotop:hover, .gotop.active:hover { background-color: #000000; color: #fff; }
.gotop.active { visibility: visible; opacity: 1; -webkit-transform: none; -moz-transform: none; -o-transform: none; transform: none; -ms-transform: none; }
.gotop:before, .gotop em { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; }
.gotop em { position: absolute; top: 0; left: 0; width: 100%; color: #fff; font-size: 12px; opacity: 0; -webkit-transform: translateY(10px); -o-transform: translateY(10px); transform: translateY(10px); filter: alpha(opacity=0); -ms-transform: translateY(10px); }
.gotop:before { display: block; content: '\f176'; font-family: 'fontawesome'; }
.gotop:hover em { opacity: 1; -webkit-transform: none; -o-transform: none; transform: none; filter: alpha(opacity=100); -ms-transform: none; }
.gotop:hover:before { opacity: 0; -webkit-transform: translateY(-15px) scale(.5); -o-transform: translateY(-15px) scale(.5); transform: translateY(-15px) scale(.5); -ms-transform: translateY(-15px) scale(.5); filter: alpha(opacity=0); }



.right_aside_bar{position:fixed;z-index:9999;right:0px;top:175px}
.right_aside_bar .aside_cont{background:#e62129;width:46px;height:46px;line-height:46px;color:#fff;margin:3px 0;border-radius:3px;font-family:fontawesome;position:relative;transition:all ease-in-out .35s;z-index: 99;}
.right_aside_bar .aside_cont >a{color:#fff;display:block;text-align:center;font-size:24px;transition:all ease-in-out .35s}
.right_aside_bar .aside_cont span+span{position:absolute;left:-3px;top:0;background:#fff;transform:unset;padding:0 0px;opacity:0;transition:all ease-in-out .35s;box-shadow:0 0 3px rgba(0,0,0,.1);color:#000;font-size:14px;width:200px;z-index: 2;}
.right_aside_bar .aside_cont:hover{background:#fff;box-shadow:0 0 3px rgb(0 0 0 / 10%)}
.right_aside_bar .aside_cont:hover a{color:#e62129;cursor:pointer;}
.right_aside_bar .aside_mail span + span:hover, .right_aside_bar .aside_phone span + span:hover, .right_aside_bar .aside_wechat span + span:hover{color:#fff;background: #e62129;}
/*.right_aside_bar .aside_cont span + span.aside_ico a:hover{color:#fff;background: #e62129;}*/
.right_aside_bar .aside_cont:hover span+span{transform:translateX(-100%);opacity:1;background: #fff;color: #e62129;}
.right_aside_bar .aside_cont > i{color:#fff;display:block;text-align:center;font-size:24px;transition:all ease-in-out .35s;z-index: 9;position: relative;}
.right_aside_bar .aside_cont > i span a{display:block;position:relative}
.right_aside_bar .aside_cont > i span a:before{content:'';width:calc(100% - 2px);height:calc(100% - 1px);border:1px solid #e62129;opacity:0;position:absolute;left:0;top:0;pointer-events: none;z-index: 1;}
.right_aside_bar .aside_cont > i span a:hover::before{
    opacity:0;
}
.right_aside_bar .aside_cont:hover i{color:#e62129}
.right_aside_bar .aside_cont > i span a{-webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; -ms-transition: all .3s ease;}





