@charset "utf-8";
/* 
 * Project Name:baibo纪念册
 * Author:allen
 * Date：2019.03.22
 */
html, body, div, span, applet, object, iframe, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0px; border: 0; font-size: 100%; outline: none; }
table, caption, tbody, tfoot, thead, tr, th, td{ margin: 0; padding: 0px; font-size: 100%; outline: none; }
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; overflow-x: hidden; }
/* always display scrollbars */
body { font: 12px/1.8 "Microsoft Yahei","微软雅黑","Hiragino Sans GB","冬青黑体","微软正黑体","Microsoft JhengHei","Arial","Helvetica","SimHei","黑体","STXihei","华文细黑",sans-serif; margin: 0 auto; color: #6c6c6c; background-color: #fff; -webkit-tap-highlight-color: rgba(0,0,0,0); }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
strong { font-weight: bold; }
img { border: 0; }
input { outline: none; }
input[type="text"], input[type="button"], input[type="submit"], input[type="reset"] { -webkit-appearance: none; border-radius: 0; }
textarea { -webkit-appearance: none; border-radius: 0; outline: none; }
::-moz-selection { background: #b53146; color: #fff; text-shadow: none; }
::selection { background: #b53146; color: #fff; text-shadow: none; }
select { outline: none; }
select::-ms-expand { display: none; }
a:active, a:hover { text-decoration: none; outline: none; }
a:focus { text-decoration: none; outline: 0; }
.clearfix:before, .clearfix:after { display: table; content: ""; line-height: 0px; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
.fc { text-align: center; }
.fr { text-align: right; }
.l { float: left; display: inline-block; }
.r { float: right; display: inline-block; }
.vt { vertical-align: top; }
.vm { vertical-align: middle; }
.inner { width: 1180px; margin: 0px auto; }
.trans3 { -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; }
.trans4 { -webkit-transition: 0.4s; -moz-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; }
.trans6 { -webkit-transition: 0.6s; -moz-transition: 0.6s; -o-transition: 0.6s; transition: 0.6s; }
.transYT { transform: translateY(50px); -webkit-transform: translateY(50px); opacity: 0; visibility: hidden; transition: transform 600ms,opacity .5s cubic-bezier(0.445, 0.145, 0.355, 1); -webkit-transition: transform 600ms,opacity .5s cubic-bezier(0.445, 0.145, 0.355, 1); transition-timing-function: ease-out; -webkit-transition-timing-function: ease-out; }
.transYT2 { transform: translateY(-50px); -webkit-transform: translateY(-50px); opacity: 0; visibility: hidden; transition: transform 600ms,opacity .5s cubic-bezier(0.445, 0.145, 0.355, 1); -webkit-transition: transform 600ms,opacity .5s cubic-bezier(0.445, 0.145, 0.355, 1); transition-timing-function: ease-out; -webkit-transition-timing-function: ease-out; }
.transXT { transform: translateX(50px); -webkit-transform: translateX(50px); opacity: 0; visibility: hidden; transition: transform 600ms,opacity .5s cubic-bezier(0.445, 0.145, 0.355, 1); -webkit-transition: transform 600ms,opacity .5s cubic-bezier(0.445, 0.145, 0.355, 1); transition-timing-function: ease-out; -webkit-transition-timing-function: ease-out; }
.transXT2 { transform: translateX(-50px); -webkit-transform: translateX(-50px); opacity: 0; visibility: hidden; transition: transform 600ms,opacity .5s cubic-bezier(0.445, 0.145, 0.355, 1); -webkit-transition: transform 600ms,opacity .5s cubic-bezier(0.445, 0.145, 0.355, 1); transition-timing-function: ease-out; -webkit-transition-timing-function: ease-out; }
.action.transYT { opacity: 1; visibility: visible; transform: translateY(0px); -webkit-transform: translateY(0px); }
.action.transYT2 { opacity: 1; visibility: visible; transform: translateY(0px); -webkit-transform: translateY(0px); }
.action.transXT { opacity: 1; visibility: visible; transform: translateY(0px); -webkit-transform: translateY(0px); }
.action.transXT2 { opacity: 1; visibility: visible; transform: translateY(0px); -webkit-transform: translateY(0px); }
.dly_1 { transition-delay: 100ms; -webkit-transition-delay: 100ms; }
.dly_2 { transition-delay: 200ms; -webkit-transition-delay: 200ms; }
.dly_3 { transition-delay: 300ms; -webkit-transition-delay: 300ms; }
.dly_4 { transition-delay: 400ms; -webkit-transition-delay: 400ms; }
.dly_5 { transition-delay: 500ms; -webkit-transition-delay: 500ms; }
.dly_6 { transition-delay: 600ms; -webkit-transition-delay: 600ms; }
.dly_7 { transition-delay: 700ms; -webkit-transition-delay: 700ms; }
.dly_8 { transition-delay: 800ms; -webkit-transition-delay: 800ms; }
.top{ height: 159px; position: relative; overflow: hidden;}
.top a:link,.top  a:visited { color: #4c4c4c;}
.top a:active,.top  a:hover { color: #b53146;}
.logo{ float: left; display: block; width: 247px;}
.logo img{ width: 100%; display: block;}
.logo .txt{ font: bold 18px/32px "microsoft yahei"; border-bottom: 6px solid #B53146;display: block; text-align: center;}
.silder-top{ float: right; text-align: right; color: #1f1a17;}
.silder-top-w{ color: #787878; font-size: 13px; font-style: italic; padding: 8px 4px 12px 0px;}
.silder-top-w .sline{ padding: 0px 5px;}
.wx-gz{ background: url(../images/erm.png) no-repeat scroll left center; padding-left: 30px; margin-left: 30px; }
.silder-top-tel{ color: #1f1a17; font-size: 19px; font-weight: bold; height: 36px; line-height: 36px; margin-bottom: 36px;}
.silder-top-tel .tel{ font-size: 28px; background: url(../images/tel_bg.png) no-repeat scroll left center; padding-left: 40px; width: 238px; display: block; float:right; height: 36px; line-height: 36px; text-align: left; margin-left: 10px; letter-spacing: 0.05em;}
.trans, .trans:hover { -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0s; -moz-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0s; -o-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0s; transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0s; -ms-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0s; }
.trans-fast, .trans-fast:hover { -webkit-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; }
.csstransforms .nav a:before{ content:""; width:100%; height:1px; background-color:white; position:absolute; left:0; bottom:0px; transform-origin:100%; -webkit-transform-origin:100%; -webkit-transition:-webkit-transform .3s cubic-bezier(.4,0,.2,1); transition:-webkit-transform .3s cubic-bezier(.4,0,.2,1); transition:transform .3s cubic-bezier(.4,0,.2,1); transition:transform .3s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1); transform:scaleX(0); -webkit-transform:scaleX(0);}
.csstransforms .nav a:hover:before{ transform:scaleX(1); -webkit-transform:scaleX(1); -moz-transform:scaleX(1); transform-origin:0; -webkit-transform-origin:0;}
.no-csstransforms .nav a:hover .bot{ width: 100%;}
.top .nav a.active{ color: #b53146;}
.top .nav a.active .bot{ width: 100%;}
.menu-handler { background-color: #4c4c4c; display: block; width: 86px; height: 56px; cursor: pointer; position: relative; transition: all 0.3s cubic-bezier(0.445, 0.145, 0.355, 1); -webkit-transition: all 0.3s cubic-bezier(0.445, 0.145, 0.355, 1); -moz-transition: all 0.3s cubic-bezier(0.445, 0.145, 0.355, 1); position: absolute; right: 0px; top: 0px; display: none;}
.menu-handler .txt{ position: absolute;  left: 10px; top: 0px; line-height: 56px; font-size: 15px; color: #fff;}
.menu-handler .burger { width: 20px; border-radius: 2px; height: 2px; background-color: #fff; display: block; position: absolute; z-index: 5; top: 21px; left: 50px;  transform-origin: center; -webkit-transform-origin: center; -moz-transform-origin: center; -o-transform-origin: center; -ms-transform-origin: center; }
.menu-handler .burger-2 { top: 28px; }
.menu-handler .burger-3 { top: 35px; }
.menu-handler.active .burger-1 { top: 28px; -moz-transform: rotate(225deg); -webkit-transform: rotate(225deg); -o-transform: rotate(225deg); -ms-transform: rotate(225deg); transform: rotate(225deg); }
.menu-handler.active .burger-2 { -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); filter: alpha(opacity=0); opacity: 0; -moz-opacity: 0; -khtml-opacity: 0; -webkit-opacity: 0; }
.menu-handler.active .burger-3 { top: 28px; -moz-transform: rotate(-225deg); -webkit-transform: rotate(-225deg); -o-transform: rotate(-225deg); -ms-transform: rotate(-225deg); transform: rotate(-225deg); }
.pusher-black { position: fixed; width: 100%; height: 100%; left: 0px; top: 0px; background-color: rgba(0,0,0,0.5); display: none; z-index: 900; }
.menuBox a:link, .menuBox a:visited { color: #1f1a17; }
.menuBox a:active, .menuBox a:hover { color: #b53146; }
.menuBox { background-color: #f8f8f8; color: #4c4c4c; position: fixed; right: 0px; top: 0px; width: 580px; height: 100%; z-index: 910; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; transform: translate(570px,0px); -moz-transform: translate(584px,0px); -webkit-transform: translate(584px,0px);  -o-transform: translate(584px,0px);  transition: all 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s; -webkit-transition: all 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s; display: none; }
.csstransforms3d .menuBox { display: block; }
.menuBox-logo { padding: 10px 30px; display: block; background-color: #fff;}
.menuBox-logo a img{ height: 36px; display: block;}
.navMobile { padding: 40px 0px; }
.nav-link:before { content: ""; width: 18px; height: 12px; position: absolute; right: 5%; margin-top: -6px; top: 50%; transform: scale(0.8); -webkit-transform: scale(0.8); -moz-transform: scale(0.8); background-position: center center; background-repeat: no-repeat; transition: 0.4s; -webkit-transition: 0.4s; }
.navMobile .item { padding: 12px 30px; display: block; position: relative; font-size: 16px; line-height: 1.4; }
.navMobile li.active .item { color: #fff; background-color: #f0be00; }
.navMobile .subnav { display: none; background-color: #ffffff; padding: 20px 0px; }
.navMobile .subnav a { color: #828282; display: inline-block; margin: 0px 10px 6px 30px; }
.navMobile .subnav a:hover { color: #f0be00; text-decoration: underline; }
.navMobile li.active .nav-link:before { background-image: url(../images/m_ico2.png); }
.menuOpen .top { transition: all 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s; -webkit-transition: all 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s; }
.menuOpen .pusher-black { display: block; }
.mobile-foot { padding: 40px 30px; border-top: 1px solid #d8d8d8; }
.mobile-foot .sharpbox { margin-bottom: 18px; }
/*base style end*/

/*head*/
.topbanner img {
	width: 1180px;
}
.headermob {
    z-index: 1002;
    height: 40px;
    overflow: hidden;
    text-align: center;
    background: #282828;
    padding: 10px 0 0 3px;
    position: relative;
    line-height: 30px;
}
.private-lette {
	right: -2px;
    top: 0px;
    margin-right: 6px;
    width: 40px;
    height: 50px;
}
.private-lette img {
    margin-top: 5px;
    height: 25px;
}
.logo_link {
    margin-top: 2px;
    margin-left: -70px;
    position: absolute;
    padding-left: 0px;
    left: 50%;
}
.logo {
    height: 25px;
    margin-top: 3px;
}
.heade-tel {
	float: right;
	margin-right: 10px;
}
/*tag style end*/
.case-nav-box{ margin: 20px auto;}
.case-nav a:link,.case-nav a:visited { color: #5f5f5f;}
.case-nav a:active,.case-nav a:hover { color: #fff;}
.case-nav ul{ margin-left: -1%;}
.case-nav li{ float: left; display: block; width: 13.28%; margin:0px 0px 8px 1%;}
.case-nav a{ border: 1px solid #cccccc; display: block; text-align: center; font-size: 16px; padding: 2px 0px; border-radius: 8px; position: relative; overflow: hidden;}
.case-nav a .txt{ position: relative; z-index: 2;}
.case-nav a:before{ content:""; width:0; height:0; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); background:#13678c; border-radius:50%; transition:460ms ease-in-out;}
.case-nav a:hover,.case-nav a.active{ border-color: #13678c; color: #fff;}
.case-nav a:hover:before,.case-nav .active:before{ width:110%; height:250%;}
.no-csstransforms .case-nav a:hover,.no-csstransforms .case-nav a.active{ background-color: #B53146;}
.cpnav { display: none; padding: 0px 5%; color: #fff; line-height: 32px; height: 32px; overflow: hidden; font-size: 17px; background-color: #b53146 ; cursor: pointer; position: relative; border-radius: 4px;}
.cpnav .caret{ background: url('/images/i_p1.png') no-repeat scroll left center; position: absolute; right: 5%; top: 0px; height: 100%; width: 16px;}
.case-infobox a:link,.case-infobox a:visited { color: #5f5f5f;}
.case-infobox a:active,.case-infobox a:hover { color: #B53146;}
.case-infobox{ padding: 48px 0px 20px; background: url('/images/yy.png') no-repeat scroll center top; text-align: center; font-size: 14px;}
.case-infobox h1{ font-size: 28px; line-height: 1.5; color: #1e1a1b; font-weight: normal;}
.case-infobox .by{ font-style: italic; color: #323232; margin: 5px auto 25px;}
.case-infobox .c{ background: url(/images/linefutitle.png) repeat-x scroll left bottom; padding-bottom: 20px; text-align: left;}
.case-infobox .jd-by{ background-color: #7f7f7f; color: #fff; width: 163px; margin: 0px auto; position: relative; top: -2px;}
.pageT{ font-size: 24px; color: #1E1A1B; padding-bottom: 20px; line-height: 1.2;}
.pageT b{ text-transform: uppercase;}
.pageT span{ padding: 0px 12px;}
.case-page a:link,.case-page a:visited { color: #3b3b3b;}
.case-page a:active,.case-page a:hover { color: #B53146;}
.caseList ul{ margin-left: -1%;}
.caseList li{ float: left; display: block; margin:0px 0px 30px 1%; width: 19%; text-align: left;}
.caseList .img{ overflow: hidden; position: relative; margin-bottom: 5px;}
.caseList .img img{ width: 100%; display: block; transition: 600ms; -webkit-transition: 600ms;}
.caseList .black-30{ width: 100%; height: 100%; opacity: 0; position: absolute; left: 0px; top: 0px; display: block; visibility: hidden;}
.caseList .c{ font-size: 14px; line-height: 1.5; height: 48px; overflow: hidden;margin: 10px;}
.caseList li:hover .black-30{ opacity: 1; visibility: visible;}
.caseList li:hover .img img { transform: scale(1.1); -webkit-transform: scale(1.1); }
.paging li {display: inline;}
.paging a:link,.paging a:visited { color: #3b3b3b;}
.paging a:active,.paging a:hover { color: #B53146;}
.paging{ padding: 20px 0px 30px; text-align: center; font-size: 20px;}
.paging a{ padding: 2px 8px; margin: 0px 2px;}
.paging a.active,.paging a:hover{ background-color: #13678c; color:#fff;}
.caseInner{ padding: 30px 0px 50px;}
.caseInner a:link,.caseInner a:visited { color: #2c2725;}
.caseInner a:active,.caseInner a:hover { color: #B53146;}

.td2{ text-align: center;}
.caseIL{ background-color: #cccccc; text-align: center; padding: 5px 0px; font-size: 16px; margin:12px 0px;}
.pagePaing{ padding: 30px 0px;}
.remocom-new{ padding:30px 0px 5px;}
.remocom-new .t{ font-size: 20px; color: #1E1A1B; margin-bottom: 10px; background-color:#f2f2f2; padding: 5px 20px;}
.remocom-new .list li{ float: left; display: block; width: 50%; font-size: 16px; height: 32px; line-height: 32px; overflow: hidden; background: url(../images/sico3.png) no-repeat scroll left center;}
.remocom-new .list li a{ display: block; padding: 0px 20px;}
.remocom-new a:link,.remocom-new a:visited { color: #2c2725;}
.remocom-new a:active,.remocom-new a:hover { color: #B53146;}
/*tag style end end*/

/*相关案例*/
.xw_main{display: block;
    width: 1180px;
	height:210px;
    padding-top: 10px;
    margin: 30px auto 20px auto;
	box-shadow:0 0 8px #cdcdcd;
	padding-bottom:20px;}
.xw_tt{
    color: #8b8b8b;
    font-size: 16px;
    font-weight: 600;0px 0;
	margin:0 20px 0 20px;
	border-bottom: 1px solid #ccc;
	padding: 10px 0 10px 0;
	}
/*.xw_mg{ margin-bottom:120px;}*/
.xw_mg{ width:1140px; display:block; margin:auto;padding-top: 25px;}
.xw_dy{
    display: block;
    max-width:185px;
    float: left;
    margin-left:5px;
overflow: hidden;
position:relative;
}
.xw_dy img{ width:185px;
height:125px;
}
.xw_main .xw_dy:first-child{margin-left:0px;}
/*.xw_dy:hover{opacity:1.0;transition: all 0.4s ease 0s;}*/

.xw_tt_1{
    width: 188px;
    height: 125px;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;		
    }
.xw_tt_1 span{
line-height:125px; display:none;background-color:#ededed;font-size:16px;font-weight: 600;}
.xw_tt_1:hover span{ display:block; color: #333;}
/* /相关案例*/