﻿@charset "UTF-8";
/* Css for PEL, ver 1.0 CopyRight By Dongyi Network Technology CO.,Ltd Design Center 本网站通用布局
*/
/* Css Reset */
blockquote,body,dd,div,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,img,input,li,ol,p,pre,td,textarea,th,ul{padding:0;margin:0}
table{border-collapse:collapse;border-spacing:0}
fieldset,img{vertical-align:top;border:0}
address,caption,cite,code,dfn,em,i,th,var{font-weight:400;font-style:normal}
li,ol,ul{list-style:none}
dd,div,dl,dt,li,ol,ul{zoom:1}
caption,th{text-align:left}
h1,h2,h3,h4,h5,h6{font-weight:400;font-size:100%}
q:after,q:before{content:''}
abbr,acronym{border:0}
pre{white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word;font-size:16px;line-height:1.8;font-family:"Microsoft YaHei",SimSun,Arial,Helvetica,Tahoma,sans-serif}
article,aside,dialog,figure,footer,header,menu,nav,section,time{margin:0;padding:0;display:block;zoom:1}

/* Public */
body{color: #4f4f4f;font-size: 14px;line-height: 30px;font-family: "Microsoft YaHei", SimSun, Arial, Helvetica, Tahoma, sans-serif;text-align: center;-webkit-text-size-adjust: none;text-rendering: optimizeLegibility;background:#eaedeb;-webkit-font-smoothing: antialiased;}
a{color: #333;text-decoration: none;outline: none;-webkit-transition: 500ms;-o-transition: 500ms;-moz-transition: 500ms;transition: 500ms;}
.titmore{display:none;}
.clearbox{clear: both;}
.blank{display: block; height: 10px; font-size: 0px; line-height: 0; overflow: hidden; clear: both;}
.clearfix:after{content: "."; display: block; height: 0; clear: both; visibility: hidden;}
*html .clearfix{height: 1%;}
*+html .clearfix{min-height: 1%;}
.fl{float: left !important;}
.fr{float: right !important;}
.hide{display: none;}
input[type=button],
input[type=submit],
input[type=file],
button{cursor: pointer; -webkit-appearance: none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
.prev,.next {transition: all 0.5s;  width: 3%;  height: 12%; display: block; position: absolute; background: #fff url(../img/prev.png) center center no-repeat;background-size: 30%; opacity: 0.2; left: 0; top: 43%;  border-radius: 0 20px 20px 0;}
.next { right:0; left:auto; border-radius: 20px 0 0 20px; background-image:url(../img/next.png);}
.prev:hover{ opacity:0.8; box-shadow:5px 0 5px #c00;}
.next:hover { opacity:0.8; box-shadow:-5px 0 5px #c00;}

.side {float:right;width:312px;margin-left: 30px; position: sticky; top: 100px;}
.mainContent { overflow:hidden;}

/* frame */
body{text-align: center;}
.siteWidth{position: relative;max-width: 1400px;_width: 1400px;margin: 0 auto;}
#header{text-align: left;margin: 0 auto;height: 70px;background-color: rgba(255, 255, 255, 0.8);box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);position: fixed;width: 100%;z-index: 99;-webkit-backdrop-filter: saturate(180%) blur(6px);backdrop-filter: saturate(180%) blur(6px);}
#header.header-topNav-fixed{z-index: 9999;}
#content{clear: both;margin: 0 auto;max-width: 1400px;*width: 1400px;  min-width: 1000px;position: relative;min-height: 300px;z-index: 1;text-align: left;padding-top: 90px;padding-left: 20px;padding-right: 20px;}
#content:after{content: ".";display: block;height: 0;clear: both;visibility: hidden;}
#header .inner{max-width: 1400px; *width: 1400px; margin: auto;position: relative;height: 70px;padding-left: 20px;padding-right: 20px;}
#logo{float: left;margin: 18px 0px 0;}
#logo img{width: 100%;}



#header {
    min-width: 1000px;
}
#header .userLogged { float:right; margin-top:18px;}
#header .notlogged {background:url(../img/user.png) no-repeat 0;padding: 0 20px;color:#ec1411;}
#header .notlogged a { color:#ec1411 }
#header .notlogged a:hover{color:#333;}
/*#header .s-form {position: absolute;right: 350px;top: 33px;}*/
#header .userLogged .spe{margin: 0 0.5em;}

/* 导航栏 */
.topNav{float: left;margin: 0 0 0 60px;}
.topNav #mainNav li{float: left;margin-right: 0;}
.topNav #mainNav li .a1{font-size: 15px;color: #333333;display:block;line-height: 67px;padding: 0 10px;margin: 0 15px;}
.topNav #mainNav li.on1 .a1 {border-bottom: 3px solid #ec1411;/* color:#ec1411; */}
.topNav #mainNav #li-home { display:none;}
.black-web{width: 107px;height: 32px;background-color: #a01313;border-radius: 16px;display: block;float: left;line-height: 32px;text-align: center;font-size: 14px;color: #fbf5c1;margin-top: 55px;}

.banner {position:relative;margin-bottom: 20px;}
.banner .pic  img { border-radius:5px; width: 100%;}
.banner .title { display:none; }
.banner .hd { position:absolute; bottom:20px; left:41%; background:rgba(0, 0, 0, 0.2); padding:12px; height:10px; border-radius:20px; }
.banner .hd li { float:left; line-height:100px; height:10px; width:10px; padding:0 5px; overflow:hidden; background:rgba(255, 255, 255, 0.8); border-radius:5px; margin: 0 5px;}
.banner .hd li.on{background: rgb(234, 23, 19);}
/* 子导航 */
.subMenu { height:42px; margin-bottom:30px;}
.subMenu li { float:left; margin-right:10px;}
.subMenu li a { padding:10px 20px; display:block; border:1px solid transparent; border-radius:20px; line-height:20px; height:20px; color:#777;}
.subMenu li.on a {  border:1px solid #ec1411; font-weight:bold; color:#ec1411 }
.subMenu li a:hover{ border: 1px solid #ec1411;}
.subMenu li .titmore { display:none;}

/* 搜索 */
.search-wrapper{position: absolute;-webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);transform: translate(-50%, -50%);top: 0;right: 0;}
.search-wrapper .input-holder{overflow: hidden; height: 50px; background: rgba(255,255,255,0); border-radius:6px; position: relative; width:50px; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;transition: all 0.3s ease-in-out;}
.search-wrapper.active .input-holder{border-radius: 50px;width:230px;background: rgba(236, 236, 236);-webkit-transition: all .2s cubic-bezier(0.000, 0.105, 0.035, 1.570); -moz-transition: all .2s cubic-bezier(0.000, 0.105, 0.035, 1.570); transition: all .2s cubic-bezier(0.000, 0.105, 0.035, 1.570); filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#7f000000, ndcolorstr=#7f000000);}
.search-wrapper .input-holder .search-input{width:80%;height: 30px;padding:0px 0 0 20px;opacity: 0;position: absolute;top:0px;left:0px; background: transparent;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;border:none; outline:none;-webkit-transform: translate(0, 60px);-moz-transform: translate(0, 60px);transform: translate(0, 60px);-webkit-transition: all .2s cubic-bezier(0.000, 0.105, 0.035, 1.570);-moz-transition: all .2s cubic-bezier(0.000, 0.105, 0.035, 1.570);transition: all 0.2s cubic-bezier(0.000, 0.105, 0.035, 1.570);-webkit-transition-delay: 0.2s;moz-transition-delay: 0.2s;transition-delay: 0.2s;}
.search-wrapper.active .input-holder .search-input{opacity: 1;-webkit-transform: translate(0, 10px);-moz-transform: translate(0, 10px);transform: translate(0, 10px);}
.search-wrapper .input-holder .search-icon{width:48px;height:48px;border:none;background: url(../img/search-icon.png) 50% no-repeat;padding:0px;outline:none;position: relative;z-index: 2;float:right;cursor: pointer; border: solid 1px #e3e3e3; border-radius: 50%;-webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;}
.search-wrapper .input-holder .search-icon:hover{background: #ec1411 url(../img/search-iconhover.png) 50% no-repeat;}
.search-wrapper.active .input-holder .search-icon{display:none;}
.search-wrapper .input-holder .submit{display: none;}
.search-wrapper.active .input-holder .submit{display:block; width: 40px;height: 40px;position: absolute; right: 0;margin: 5px; border-radius: 50%;color: transparent; border:none; background:#ec1411 url(../img/search-iconhover.png) 50% no-repeat; cursor:pointer;}
.search-wrapper.active .input-holder .submit:hover{background:#ec1411 url(../img/search-iconhover.png) 50% no-repeat;}
.search-wrapper .close{display: none;position: absolute;z-index: 1;top:13px;right: 20px;width:25px;height:25px;cursor: pointer;-webkit-transform: rotate(-180deg);-moz-transform: rotate(-180deg);transform: rotate(-180deg);-webkit-transition: all 0.2s cubic-bezier(0.285, -0.450, 0.935, 0.110);-moz-transition: all 0.2s cubic-bezier(0.285, -0.450, 0.935, 0.110);transition: all 0.2s cubic-bezier(0.285, -0.450, 0.935, 0.110);-webkit-transition-delay: 0.2s;-moz-transition-delay: 0.2s;transition-delay: 0.2s;}
.search-wrapper.active .close{right:-35px;-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);transform: rotate(45deg);-webkit-transition: all .6s cubic-bezier(0.000, 0.105, 0.035, 1.570);-moz-transition: all .6s cubic-bezier(0.000, 0.105, 0.035, 1.570);transition: all 0.2s cubic-bezier(0.000, 0.105, 0.035, 1.570);-webkit-transition-delay: 0.5s;-moz-transition-delay: 0.5s;transition-delay: 0.5s;}
.search-wrapper .close::before, .search-wrapper .close::after{position:absolute;content:'';border-radius: 2px;background: rgba(0, 0, 0, 0.2);transition: all 1s;}
.search-wrapper .close:hover::before, .search-wrapper .close:hover::after{background: rgba(255,0, 0, 0.7);}
.search-wrapper.active .close:hover{-webkit-transform: rotate(225deg);-moz-transform: rotate(225deg);transform: rotate(225deg); transition: all 0.1s;}
.search-wrapper .close::before{width: 5px;height: 25px;left: 10px;top: 0px;}
.search-wrapper .close::after{width: 25px;height: 5px;left: 0px;top: 10px;}
.search-wrapper .result-container{width: 100%;position: absolute;top:80px;left:0px;text-align: center;font-size: 14px;display:none;color:#B7B7B7;}

.s-form{width: 200px;float: right;height: auto;overflow: hidden;padding: 18px 0;position: relative;}
.s-form .input-box {}
.s-form .input-box .from-control {height: 30px;padding: 0px 8px;border: #cccccc4d solid 1px;background: transparent;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;border-right: none;width: 70%;outline:none;transition: all 0.2s cubic-bezier(0.000, 0.105, 0.035, 1.570);-webkit-transition-delay: 0.2s;moz-transition-delay: 0.2s;transition-delay: 0.2s;}
.s-form .btn-box .btn {width: 40px;height: 40px;position: absolute;right: 20px;top: 12px;padding: 20px;border-radius: 50%;color: transparent;border: #ccc solid 1px;background: url(../img/search-icon.png) 50% no-repeat; cursor:pointer;transition: all 0.2s;}
.s-form .btn-box .btn:hover{background-color: #ea1e1a; border-color:#c30;}

#footer{padding: 40px 0;background: #333;color: #ffffff;}
#footer .copyRight{color: #aaa;}
#footer a{color: #aaa;}
#footer a:hover{color: #fff;}

.box { background:#fff; margin-bottom:30px;}
.box .hd { height:40px; line-height:40px; }
.box .hd h3 { height:20px; line-height:20px; border:1px solid #f1f1f1; border-bottom:0; font-size:18px; font-weight:bold; padding-left:20px; padding-top:20px; color:#333; }
.box .hd ul {text-align:center;border-bottom:1px solid #f1f1f1;background: #f3f3f3;display:block;height:40px;}
.box .hd li { float:left; width:33.33%;}
.box .hd li span { display:block; color:#6a6a6a; cursor:pointer; transition:all 0.3s}
.box .hd li.on span { background:#ec1411; color:#fff;}
.box .bd {padding:20px;border: 1px solid #f1f1f1; border-top:0}
.box .bd li .number { float:left; width:18px; height:18px; line-height:18px; margin-top:7px; color:#fff; background:#bf956f;text-align:center; font-size:12px;}
.box .bd li.first .number { background:#ec1411;}
.box .bd .infoList li:hover{ background: #c00;  border-radius: 10px;}
.box .bd .infoList li:hover a{color:#fff;}
.box .bd .friList { padding-top:5px;}
.box .bd .friList li { font-size:12px; height:26px; margin:0 10px 15px 0; line-height:26px;float:left;}
.box .bd .friList li a { color:#777; display:block; background:#f1f1f1f1; border-radius:13px; padding:0 20px; }
.box .bd .friList li a:hover { background:#ec1411; color:#fff}

.box .bd:after { content:""; display:block; clear:both;}

.userlogincomment_userLoginDialog { -webkit-transition: transform .4s cubic-bezier(.12,.4,.29,1.455); -webkit-transition: transform .4s cubic-bezier(.12,.4,.29,1.455); transition: transform .4s cubic-bezier(.12,.4,.29,1.455); -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateX(-70deg); transform: rotateX(-70deg); -moz-transition: transform .4s cubic-bezier(.12,.4,.29,1.455); -ms-transition: transform .4s cubic-bezier(.12,.4,.29,1.455); -o-transition: transform .4s cubic-bezier(.12,.4,.29,1.455);}
.userlogincomment_userLoginDialog {-webkit-transform: rotateX(0);transform: rotateX(0);display: block;}
/*--
颜色代码
#be3434 红色标题
#ddd 淡蓝色边框
--*/