@charset "utf-8";
/* CSS Document */
* { margin:0; padding:0 }
*:focus {outline: none }
html { width:100%; height:100%; font-size:62.5%; /* 10÷16=62.5% */ }
body { font-size:14px; font-size:1.4rem; /* 12÷10=1.2 */ }
body { line-height:1.6em; font-weight:400; font-family: webfont, "微软雅黑", "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", PingHei, STHeiti; color:#000; background: #f5f5f5; height:100% }
em, q, cite, address { font-weight:400; font-style:normal }
h1, h2, h3, h4, h5, h6 { font-weight:400 }
address { display:inline }
img { border:none }
li { list-style:none }
q { quotes:none }
strong { font-weight:bold }
table { border-collapse:collapse }
th { text-align:left; font-weight:400 }
small { -webkit-text-size-adjust:none; font-size:10px }
i { font-style:normal } 

::selection { background:#d11b24; color:#fff }
::-moz-selection { background:#d11b24; color:#fff }

/* link */
a { color:#000; outline-style:none; text-decoration:none; cursor:pointer; transition-duration:0.2s; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s; -webkit-transform: translateZ(0); transform: translateZ(0) }
a:hover { color:#d11b24; -webkit-transform: translateZ(0); transform: translateZ(0) }

a.a01, .a01 a, a .a01 { color: #fff }
a.a01:hover, .a01 a:hover, a:hover .a01 { color:rgba(255,255,255,0.7) }

a.a02, .a02 a, a .a02, .a02 { color: #2d63aa }
a.a02:hover, .a02 a:hover, a:hover .a02, .a02:hover { color:#d11b24 }

/* clear float */
.cf { zoom:1 } /* for IE */
.cf:after { content:"."; display: block; clear:both; font-size:0; height:0; visibility:hidden; overflow:hidden } /* for other */
/* end of clear float */

/* float */
.fleft { float:left!important }
.fright { float:right!important }
.fnone { float:none!important }
/* text-align */
.tleft { text-align:left }
.tright { text-align:right }
.tcenter { text-align:center }
/* display */
.dis { display:block }
.undis { display:none }
a.undis { display:none !important }
.disinline { display:inline }
.disinblock { display:inline-block }

.cursor_pointer { cursor:pointer }
.cursor_default { cursor:default }

/* form */
label { cursor:pointer }
label:hover { text-decoration:underline }
input, select, textarea { vertical-align:middle; color:#000; font-family: webfont, "微软雅黑", "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", PingHei, STHeiti; transition-duration:0.2s; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -moz-border-radius:0; -webkit-border-radius:0; border-radius:0; appearance:none; -moz-appearance:none; -webkit-appearance:none }
input[type="text"], input[type="password"], select { height: 36px; line-height: 36px; border: 1px solid #cfcfcf; background: rgba(255,255,255,0.8); padding:0 10px; appearance:none; -moz-appearance:none; -webkit-appearance:none }
input[type="text"]:focus, input[type="password"]:focus, select:focus { border: 1px solid #2a61ad }
input[type="checkbox" i] { -webkit-appearance: checkbox; box-sizing: border-box }
textarea { border: 1px solid #cfcfcf; background: transparent; padding:10px }
textarea:focus { border: 1px solid #2a61ad }
button { cursor:pointer; vertical-align:middle; text-align:center; font-family: webfont, "微软雅黑", "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", PingHei, STHeiti }
select::-ms-expand { display: none }

/*-------------------结构-------------------*/
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary, time { display:block }

.container { margin-right:auto; margin-left:auto }
.container:before, .container:after { content:" "; display:table }
.container:after { clear: both }

.headspace { width: 100%; height: 130px }

.insidekv { height: calc(62vh); min-height: 460px; max-height: 660px; overflow: hidden }
.insidekv-slogan { height: calc(100% - 130px) }

/*-------------------定位-------------------*/
.positionRelative { position: relative }
.positionAbsolute { position: absolute } 
.positionStatic { position:static!important; top: 0!important; margin-top: 0!important }

.poabsolute-wh50 { position:absolute; top:50%; left:50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%) }
.poabsolute-w50 { position:absolute; left:50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%) }
.poabsolute-h50 { position:absolute; top:50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%) }
.poabsolute-t { position:absolute; top:0 }
.poabsolute-b { position:absolute; bottom:0 }

.left0 { left:0!important }
.top0 { top:0!important }
.right0 { right:0!important }

.zindex2 { z-index:2 }
.zindex3 { z-index:3 }

.overhidden { overflow:hidden }


/*-------------------通用圆角-------------------*/
.border-radius3 { -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px }
.border-radius10 { -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px }
.border-radius50 { -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50% }

/*-------------------透明度-------------------*/
.opacity0 { filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity:0; opacity:0 }
.opacity0_1 { filter:alpha(opacity=10); -moz-opacity:0.1; -khtml-opacity:0.1; opacity:0.1 }
.opacity0_3 { filter:alpha(opacity=30); -moz-opacity:0.3; -khtml-opacity:0.3; opacity:0.3 }
.opacity0_5 { filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity:0.5; opacity:0.5 }
.opacity0_6 { filter:alpha(opacity=60); -moz-opacity:0.6; -khtml-opacity:0.6; opacity:0.6 }
.opacity0_7 { filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity:0.7; opacity:0.7 }
.opacity0_8 { filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity:0.8; opacity:0.8 }

/*-------------------字体颜色、样式、字体间距-------------------*/
@font-face {font-family: 'webfont';
  src: url('//at.alicdn.com/t/webfont_gznyumkua1l.eot'); /* IE9*/
  src: url('//at.alicdn.com/t/webfont_gznyumkua1l.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('//at.alicdn.com/t/webfont_gznyumkua1l.woff') format('woff'), /* chrome、firefox */
  url('//at.alicdn.com/t/webfont_gznyumkua1l.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url('//at.alicdn.com/t/webfont_gznyumkua1l.svg#Alibaba-PuHuiTi-Regular') format('svg'); /* iOS 4.1- */
}

.iconfont { line-height: 1em }

.fa-0_6x { font-size: 0.6em!important; -webkit-transform: scale(0.8) }
.fa-0_8x { font-size: 0.8em!important }
.fa-1x { font-size: 1em!important }
.fa-1_2x { font-size: 1.2em!important }
.fa-1_6x { font-size: 1.6em!important }
.fa-1_8x { font-size: 1.8em!important }
.fa-2x { font-size: 2em!important }
.fa-2_4x { font-size: 2.4em!important }
.fa-3x { font-size: 3em!important }
.fa-4x { font-size: 4em!important }
.fa-5x { font-size: 5em!important }
.fa-6x { font-size: 6em!important }

.font-bold { font-weight: 600 }
.font-thin { font-weight: 300 }

.text-indent1 { text-indent: 1em }
.text-indent3 { text-indent: 3em }

.fontSize10 { font-size:10px; font-size:1rem; -webkit-transform:scale(0.8) }
.fontSize12 { font-size:12px }

h1, .h1 { font-size: 40px; line-height:1.1em }
h2, .h2 { font-size: 36px; line-height:1.1em }
h3, .h3 { font-size: 30px; line-height:1.1em }
h4, .h4 { font-size: 24px; line-height:1.1em }
h5, .h5 { font-size: 18px }
h6, .h6 { font-size: 16px }

.line-height1em { line-height:1em }
.line-height1_1em { line-height:1.1em }
.line-height1_2em { line-height:1.2em }
.line-height1_3em { line-height:1.3em }
.line-height1_4em { line-height:1.4em }
.line-height1_5em { line-height:1.5em }
.line-height1_6em { line-height:1.6em }
.line-height1_8em { line-height:1.8em }
.line-height2em { line-height:2em }
.line-height2_5em { line-height:2.5em }

.colorfff, .colorfff a { color: #fff }
.color000, .color000 a { color: #000 }

.colord3171a { color: #d3171a }
.color097c25 { color: #097c25 } 
.color054078 { color: #054078 }
.color535353 { color: #535353 }
.color2a61ae { color: #2a61ae }
.coloraf1a1d { color: #af1a1d }

/*-------------------背景颜色--------------------*/
.bgfff { background: #fff }
.bg000 { background: #000 }
.bgf0f0f0 { background: #f0f0f0 }
.bgf5f5f5 { background: #f5f5f5 }
.bgfafafa { background: #fafafa }
.bgd3171a { background: #d3171a }
.bgd3171a_80 { background: rgba(211,23,26,0.8) }
.bg2a61ad { background: #2a61ad }
.bg2a61ad_80 { background: rgba(42,97,173,0.8) } 
.bgececec { background: #ececec }
.bg5eb1d3 { background: #5eb1d3 }
.bgededed { background: #ededed }
.bg1bb3d4 { background: #1bb3d4 }
.bg2a61ae { background: #2a61ae }
.bg1175d4 { background: #1175d4 }
.bgca201e { background: #ca201e }
.bgb51412 { background: #b51412 }
.bgd31519 { background: #d31519 }
.bg194f80 { background: #194f80 }
.bgfbfbfb { background: #fbfbfb }

/*-------------------分割线、边框-------------------*/
.line-ebebeb { width:100%; height:1px; line-height:1px; font-size:0; background:#ebebeb; border:0 none }
.line-dedede { width:100%; height:1px; line-height:1px; font-size:0; background:#dedede; border:0 none }

.border-b-cfcfcf { border-bottom: 1px solid #cfcfcf }

/*-------------------间距-------------------*/
.margintop5 { margin-top:5px }
.margintop10 { margin-top:10px }
.margintop15 { margin-top:15px }
.margintop20 { margin-top:20px }
.margintop30 { margin-top:30px }
.margintop40 { margin-top:40px }
.margintop50 { margin-top:50px } 
.margintop60 { margin-top:60px } 
.margintop80 { margin-top:80px }
.margintop100 { margin-top:100px }

.marginbottom2 { margin-bottom:2px }
.marginbottom5 { margin-bottom:5px }
.marginbottom10 { margin-bottom:10px }
.marginbottom15 { margin-bottom:15px }
.marginbottom20 { margin-bottom:20px}
.marginbottom30 { margin-bottom:30px }
.marginbottom40 { margin-bottom:40px }
.marginbottom50 { margin-bottom:50px }
.marginbottom60 { margin-bottom:60px }
.marginbottom100 { margin-bottom:100px }

.marginleft5 { margin-left:5px }
.marginleft10 { margin-left:10px }
.marginleft15 { margin-left:15px }
.marginleft20 { margin-left:20px }
.marginleft30 { margin-left:30px }
.marginleft40 { margin-left:40px }

.marginright5 { margin-right:5px }
.marginright10 { margin-right:10px }
.marginright20 { margin-right:20px }
.marginright30 { margin-right:30px }
.marginright40 { margin-right:40px }

.marginauto { margin-left:auto; margin-right:auto }

.paddingtop0 { padding-top:0!important }
.paddingtop5 { padding-top:5px }
.paddingtop10 { padding-top:10px }
.paddingtop15 { padding-top:15px }
.paddingtop20 { padding-top:20px }
.paddingtop30 { padding-top:30px }
.paddingtop35 { padding-top:35px }
.paddingtop40 { padding-top:40px }
.paddingtop45 { padding-top:45px }
.paddingtop50 { padding-top:50px }
.paddingtop60 { padding-top:60px }

.paddingbottom0 { padding-bottom:0!important }
.paddingbottom5 { padding-bottom:5px }
.paddingbottom10 { padding-bottom:10px }
.paddingbottom15 { padding-bottom:15px }
.paddingbottom20 { padding-bottom:20px }
.paddingbottom30 { padding-bottom:30px }
.paddingbottom35 { padding-bottom:35px }
.paddingbottom40 { padding-bottom:40px }
.paddingbottom45 { padding-bottom:45px }
.paddingbottom50 { padding-bottom:50px }
.paddingbottom60 { padding-bottom:60px }


.paddingleft0 { padding-left:0!important }
.paddingleft5 { padding-left:5px }
.paddingleft10 { padding-left:10px }
.paddingleft15 { padding-left:15px }
.paddingleft20 { padding-left:20px }
.paddingleft30 { padding-left:30px }
.paddingleft40 { padding-left:40px }


.paddingright0 { padding-right:0!important }
.paddingright5 { padding-right:5px }
.paddingright10 { padding-right:10px }
.paddingright15 { padding-right:15px }
.paddingright20 { padding-right:20px }
.paddingright30 { padding-right:30px }
.paddingright40 { padding-right:40px}

.padding1 { padding:1px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box }
.padding5 { padding:5px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box }
.padding10 { padding:10px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box }
.padding15 { padding:15px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box }
.padding20 { padding:20px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box }
.padding30 { padding:30px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box }
.padding40 { padding:40px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box }
.padding60 { padding:60px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box }
.padding5_10 { padding:5px 10px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box }
.padding10_20 { padding:10px 20px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box }
.padding20_40 { padding:20px 40px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box }

.box-sizing { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box }

.mo_dis { display:none }
.mo_undis { display:block }

.row1 { margin-left: -1px; margin-right: -1px }
.row5 { margin-left: -5px; margin-right: -5px }
.row10 { margin-left: -10px; margin-right: -10px }
.row15 { margin-left: -15px; margin-right: -15px }
.row20 { margin-left: -20px; margin-right: -20px }


/*-------------------宽度、高度--------------------*/
.width10 { width:10% }
.width15 { width:15% }
.width20 { width:20% }
.width25 { width:25% }
.width30 { width:30% }
.width33 { width:33.33% }
.width35 { width:35% }
.width40 { width:40% }
.width45 { width:45% }
.width50 { width:50% }
.width55 { width:55% }
.width60 { width:60% }
.width65 { width:65% }
.width66 { width:66% }
.width70 { width:70% }
.width75 { width:75% }
.width80 { width:80% }
.width85 { width:85% }
.width90 { width:90% }
.width100 { width:100% }

.imgw20 { display:block; max-width:20%; height:auto }
.imgw30 { display:block; max-width:30%; height:auto }
.imgw40 { display:block; max-width:40%; height:auto }
.imgw50 { display:block; max-width:50%; height:auto }
.imgw60 { display:block; max-width:60%; height:auto }
.imgw70 { display:block; max-width:70%; height:auto }
.imgw80 { display:block; max-width:80%; height:auto }
.imgw90 { display:block; max-width:90%; height:auto }
.imgw100 { display:block; max-width:100%; height:auto }

.height50 { height:50% }
.height100 { height:100% }

.infinite-height { margin-bottom: -30000px; padding-bottom: 30000px }

/*-------------------区块-------------------*/
.area_100 { float:left; width:100% }
.area_90 { float:left; width:90% }
.area_85 { float:left; width:85% }
.area_80 { float:left; width:80% }
.area_75 { float:left; width:75% }
.area_70 { float:left; width:70% }
.area_66 { float:left; width:66.66% }
.area_65 { float:left; width:65% }
.area_60 { float:left; width:60% }
.area_55 { float:left; width:55% }
.area_50 { float:left; width:50% }
.area_45 { float:left; width:45% }
.area_40 { float:left; width:40% }
.area_35 { float:left; width:35% }
.area_33 { float:left; width:33.33% }
.area_30 { float:left; width:30% }
.area_25 { float:left; width:25% }
.area_20 { float:left; width:20% }
.area_15 { float:left; width:15% }
.area_10 { float:left; width:10% }
.area_5 { float:left; width:5% }


.com-rows_1 { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.com-rows_2 { height:3.15em; line-height:1.6em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical }
.com-rows_max2 { max-height:3.15em; line-height:1.6em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical }
.com-rows_3 { height:4.75em; line-height:1.6em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical }
.com-rows_max3 { max-height:4.75em; line-height:1.6em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical }
.com-rows_4 { height:5.55em; line-height:1.4em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical }
.com-rows_5 { height:6.95em; line-height:1.4em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:5; -webkit-box-orient:vertical }
.com-rows_6 { height:8.95em; line-height:1.5em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:6; -webkit-box-orient:vertical }
.com-rows_max6 { max-height:8.95em; line-height:1.5em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:6; -webkit-box-orient:vertical }

/*-------------------按钮-------------------*/ 
.button, a.button, input.button { text-decoration: none; text-align: center; display: inline-block; appearance: none; cursor: pointer; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition-property: all; transition-property: all; transition-duration:0.2s; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s }

.button-s, a.button-s, input.button-s { padding:8px 10px; line-height:1em }
.button-m, a.button-m, input.button-m { padding:10px 25px; line-height:1em }
.button-l, a.button-l, input.button-l { padding:20px 40px; line-height:1em }

.button-blue, a.button-blue, input.button-blue { background:#2a61ad; color:#fff }
.button-blue:hover, a:hover .button-blue, input.button-blue:hover { background:#000; color:#fff }

.button-yellow, a.button-yellow, input.button-yellow { border:2px solid #fdb300; background:#fdb300; color:#fff }
.button-yellow:hover, a:hover .button-yellow, input.button-yellow:hover { background:transparent; color:#fdb300 }


/*-------------------通用头部-------------------*/ 
.headbox { width: 100%; height: 130px; background: #fff; position: fixed; z-index: 1000 }
.headlogo { margin-top: 62px; margin-left: 40px }
.logo { height: 44px; width: auto } 

.nav { min-width: 400px; top: 70px; z-index: 1002 }
.nav .menuLi { float:left; display:block; position:relative }
.nav .menuLi .mainmenu { display:block; height:60px; line-height:60px; font-weight:bold; padding: 0 18px; position:relative }
.nav .menuLi .mainmenu:hover, .nav .menuLi .mainmenu.menuLiBnameover, .nav .menuLi .mainmenu.menuLipitchon:hover, .nav .menuLi .mainmenu.menuLipitchon.menuLiBnameover { background: #2d63aa; color: #fff }
.nav .menuLi .mainmenu.menuLipitchon { color: #2d63aa }
.menuListBox { min-width: 100%; line-height:30px; position:absolute; top:60px; left: 0; background: #d11b24; display:none }
.menuListBox a { display:block; width: 100%; padding: 0 18px; line-height:30px; color: #fff; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; white-space:nowrap }
.menuListBox a:hover { filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity:0.8; opacity:0.8 }
.menuListBox a:first-of-type { padding-top: 10px }
.menuListBox a:last-of-type { padding-bottom: 10px }

.subnav { margin-top: 74px; margin-right: 30px }
.subnav a { display: inline-block; padding: 0 12px; height: 44px; line-height: 44px }
.subnav a .iconfont { line-height: 44px }
.search-input-box { display: none; background: #fff; width: 100%; height: 130px; padding: 0 100px 0 50px; box-sizing: border-box; position: fixed; top: 0; z-index: 2000 }
.search-input-box .icon-close { position: absolute; top: 55px; right: 50px; cursor: pointer;
	-webkit-transition: all .1s ease-out;
	-moz-transition: all .1s ease-out;
	-ms-transition: all .1s ease-out;
	-o-transition: all .1s ease-out;
	transition: all .1s ease-out }
.search-input-box .icon-close:hover { 
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	transform: rotate(90deg) }
.search-input-con { height: 48px; margin-top: 40px; margin-right: 80px } 
.search-input-con .button { width: 60px; height: 28px; line-height: 28px; margin-top: 15px; margin-right: -80px }
input.search-input { width: 100%; height: 48px; line-height: 48px; border: 0; border-bottom: 1px solid #eee; background: transparent }
input.search-input:focus { border: 0; border-bottom: 1px solid #2a61ad }


.headbox, .headlogo, .logo, .nav, .subnav { transition:0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s }

.headbox.current { height: 44px }
.headbox.current .headlogo { margin-top: 10px }
.headbox.current .logo { height: 24px }
.headbox.current .nav { top: 0 }
.headbox.current .mainmenu { height:44px; line-height:44px }
.headbox.current .menuListBox { top:44px }
.headbox.current .subnav { margin-top: 0 }

@media ( min-width:801px ) and ( max-width:1024px ) {
.headbox { top: -40px }
.headbox.current { top: 0 }
.headlogo { margin-top: 72px; margin-left: 20px }
.logo { height: 34px } 
.nav .menuLi .mainmenu { padding: 0 12px }
.subnav { margin-right: 10px }
.subnav a { padding: 0 6px }

.headspace { height: 90px }

.insidekv-slogan { height: calc(100% - 90px) }

}


/*-------------------底部-------------------*/
.footbox { background: #054078; color: #f5f5f5; padding: 30px 0 80px }
.footbox a { color: #f5f5f5 }
.footbox a:hover { color: rgba(245,245,245,0.6) } 
.footbox .logo-w { max-width: 150px }
.share-mask { width: 100%; height: 100%; background: rgba(0,0,0,0.8); position: fixed; top: 0; left: 0; z-index: 9999; cursor: pointer; display: none }
.share-mask img { border: 8px solid #fff }
.foot-address-box { margin-top: 60px }
.foot-address { border-left: 1px solid #f5f5f5; padding-left: 10px }
.gototop { display:block; width:40px; height:40px; text-align: center; line-height: 40px; background:#fff; position:fixed; right:10px; bottom:10px; z-index:1001; transition:0.3s; -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; display:none; filter:alpha(opacity=20); -moz-opacity:0.2; -khtml-opacity:0.2; opacity:0.2 }
.gototop .iconfont { color: #000; line-height: 40px }
.gototop:hover { filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity:1; opacity:1 }

.linkpop { display: none; background: #58606c; width: 260px; box-sizing: border-box; position:absolute; bottom:32px; margin-left: -20px; z-index: 1000; }
.linkpop .icon-next1 { display: none; margin-top: 5px; margin-right: 10px }
.linkpop li a { display: inline-block; width: 100%; padding: 5px 0 5px 20px; box-sizing:border-box; color: #fff; }
.linkpop li a:hover { background: #2f3948 }
.linkpop li a:hover .icon-next1 { display: block }


/*-------------------通用-------------------*/
.com-more { display: inline-block; padding-right: 15px; box-sizing: border-box; position: relative }
.com-more .iconfont { position: absolute; top: 3px; right: 0; filter:alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; transition:0.3s; -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s }
a:hover .com-more .iconfont, a.com-more:hover .iconfont { filter:alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; -webkit-transform: translateX(10px); -moz-transform: translateX(10px); -ms-transform: translateX(10px); -o-transform: translateX(10px); transform: translateX(10px) }

.more .iconfont { transition:0.3s; -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s }
a:hover .more .iconfont, a.more:hover .iconfont { -webkit-transform: translateX(10px); -moz-transform: translateX(10px); -ms-transform: translateX(10px); -o-transform: translateX(10px); transform: translateX(10px) }

.zoomimg { -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; transition: 0.3s }
a:hover .zoomimg, .zoomimg:hover, .com-link:hover .zoomimg { transform: scale(1.05); -ms-transform: scale(1.05); -webkit-transform: scale(1.05); -o-transform: scale(1.05); -moz-transform: scale(1.05) }

.block-padding-t { padding-top: 60px }
.block-padding-b { padding-bottom: 60px }

.level3kv { height: calc(40vh); min-height: 400px; background: #445977; overflow: hidden }
.level3kv-slogan { bottom: 140px }
.level3-con { margin-left: 300px; min-height: 280px }
.sidebar { width: 240px; margin-left: -300px; position: absolute; top: -80px }
.sidebar-title { height: 80px; line-height: 80px; padding-left: 40px; background: #576a85; color: #fff }
.sidebar-list { padding: 30px 0 50px 40px; background: #727f92 }
.sidebar-list a { display: inline-block; width: 100%; height: 36px; line-height: 36px; color: #fff; font-weight: 300; position: relative }
.sidebar-list a:hover, .sidebar-list a.cur { padding-left: 12px }
.sidebar-list a:before { content: ''; position: absolute; left: 0; top: 17px; width: 6px; height: 1px; background: #fff; filter:alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0 }
.sidebar-list a:hover:before, .sidebar-list a.cur:before { filter:alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1 }


/*-------------------首页-------------------*/
.indexkv h1 { font-size: 56px }
.indexkv h5 { font-size: 28px }

.index-con01 { padding-top: 120px }
.index-list01 li { position: relative; padding-left: 45px; line-height: 28px } 
.index-list01 li:before { content: ''; position: absolute; left: 0; top: 15px; width: 40px; height: 1px; background: #fff }

.instock-img { height: 100%; border-left: 10px solid #f5f5f5; position: absolute; right: 0; background: url(../images/index/img03.jpg) center center no-repeat; background-size: cover }

.index1-bg{background: url(../images/index/index1-img.jpg); background-size: cover;height: calc(100vh) ;}
.index1-bg p{bottom: 40px}
.index1-bg .btn {border: 1px #003178 solid;padding: 10px 40px;color:#003178; width:10em;border-radius: 50px;}
.index1-bg .icon-jiantou {padding-left: 10px;vertical-align: middle;}


/*-------------------了解emc易倍体育-------------------*/
.about-con01 { top: 40% }
.about-con01 .icon-yinhao { position: absolute; top: -12px; left:0 }
.about-con03 { top: 20%; padding-left: 160px }
.about-con03 h1 { font-size: 60px; position: absolute; top: 0; left:30px }
.about-con03 .icon-yinhao { position: absolute; top: -12px; left:0 }
.about-con02, .about-con04 { width: 35%; bottom: -40px }
.about-con02 a { padding: 40px 40px 100px; background: rgba(212,27,30,0.9) }
.about-con04 a { padding: 40px 40px 80px; background: #2a61ae }

.about-area03 { margin-top: 160px }
.about-con05 { top: 20% }
.about-con05 .icon-yinhao { position: absolute; top: -5px; left:0 }
.about-con06 { width: 35%; min-width: 310px; top: -60px }
.about-con06 a { padding: 80px 40px 80px; background: #d7701e }

.about-con02 .more, .about-con04 .more, .about-con06 .more { bottom: 40px; right: 40px; filter:alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0 } 
.about-con02 a:hover .more, .about-con04 a:hover .more, .about-con06 a:hover .more { filter:alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1 }

.profile-level3kv { background: url(../images/about/profile-level3kv.jpg) center bottom no-repeat; background-size: cover }

.product-con { height: calc(100vh - 30px); min-height: 730px; background: url(../images/about/product-bg.jpg) center bottom no-repeat; background-size: cover }

.war-list01 li { position: relative; padding-left: 12px }
.war-list01 li:before { content: ''; position: absolute; left: 0; top: 12px; width: 8px; height: 1px; background: #000 }

.smart-img01 { background: url(../images/about/smart-img01.jpg) center center no-repeat; background-size: cover }
.smart-img02 { background: url(../images/about/smart-img02.jpg) center center no-repeat; background-size: cover }
.smart-img03 { background: url(../images/about/smart-img03.jpg) center center no-repeat; background-size: cover }		
.smart-img04 { background: url(../images/about/smart-img04.jpg) center center no-repeat; background-size: cover }
.smart-img05 { background: url(../images/about/smart-img05.jpg) center center no-repeat; background-size: cover }
		
.smart-card { background: #fff; margin-top: 3px }
.smart-card-box .smart-card:nth-of-type(3n-1), .smartcase-card-box div:nth-of-type(3n-1) .smartcase-card { background: #fafafa }
.smartcase-card { padding: 40px; background: #fff }

.smart-con { min-height: 230px }

.smart_contact1 { height: 220px; background: url(../images/about/smart_contact1.jpg); background-size: cover; background-position: center }
.smart_contact2 { height: 220px; background: url(../images/about/smart_contact2.jpg); background-size: cover; background-position: center }
.service_w4 { margin-left: 4em }
.service_w4 span { float: left }
.service_w4 span:first-child { margin-left:-4em; width: 4em; display: inline-block; white-space: nowrap }
.service_w4 span:last-child { width: 100% }


.sd-head { height: 260px; background: url(../images/about/sd-head.jpg) right bottom no-repeat; background-size: cover }
.sd-con img { max-width: 100% }

.gd-title { position: relative; padding-bottom: 4px; margin-bottom: 10px; font-weight: bold }
.gd-title:after { content: ''; width: 28px; height: 2px; line-height: 2px; background: #054078; position: absolute; left: 0; bottom: 0 }

.ei-head { height: 260px; background: url(../images/about/ei-head.jpg) center bottom no-repeat; background-size: cover }
.ei-list01 li { position: relative; padding-left: 16px }
.ei-list01 li:before { content: ''; position: absolute; left: 0; top: 9px; width: 4px; height: 4px; border-radius: 50%; background: #000 }

.ei-list02 li { position: relative; padding-left: 70px }
.ei-list02 li span { position: absolute; left: 0 }

.ei-dl { margin-left: 100px }
.ei-dl dt { width: 100px; margin-left: -100px }

.ei-txt dl { margin-left: 44px }
.ei-txt dl dt { width: 44px; margin-left: -44px }
.ei-txt dl dt .iconfont { line-height: 44px }

.accordion-title { padding: 40px 40px 0; background: #fbfbfb; cursor: pointer }
.accordion-title.unfold, .accordion-title:hover { background: #fff }
.accordion-title.unfold h4 { font-weight: bold }
.accordion-title.unfold .iconfont { -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg) }

.emergency-head { height: 260px; background: url(../images/about/emergency-head.jpg) center bottom no-repeat; background-size: cover }

.distribution-head { height: 260px; background: url(../images/about/distribution-head.jpg) center bottom no-repeat; background-size: cover } 

.culture-page .level3kv-slogan { bottom: 120px }
.culture-level3kv { background: url(../images/about/img03.jpg) left bottom no-repeat; background-size: cover }
.culture-dl { margin-left: 3em }
.culture-dl dt { width: 3em; margin-left: -3em }
.culture-page .level3-con { min-height: auto }

.culture-img01 { width: 60%; bottom: 100px }
.culture-bg { width: 60% }

.culture-con02 { background: url(../images/about/culture-img01.png) left bottom no-repeat; background-size: auto 100% }

.international-head { height: 260px; background: url(../images/about/international-head.jpg) center bottom no-repeat; background-size: cover }


/*-------------------新闻-------------------*/
.news-list .area_33 a { background: #fff; color: #535353 }
.news-list .area_33:nth-of-type(3n-1) a { background: #fbfbfb }
.news-list .more .iconfont { position: absolute; right: 30px; bottom: 30px; filter:alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0 }
.news-list a:hover .more .iconfont { filter:alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1 }

.nd-head { height: 260px; background: url(../images/news/nd-head.jpg) center bottom no-repeat; background-size: cover }
.nd-con img { max-width: 100%; margin-left: auto; margin-right: auto }


/*-------------------投资者关系-------------------*/
.stock1_1 { font-size: 90px; line-height: 1em }
.stock1_1 span { display: inline-block; border-bottom: 10px solid #d3171a }

.irkv { background: url(../images/ir/irkv.jpg) bottom center no-repeat; background-size: cover }
.ir-slogan { top: 34% }
.ir-dl01 { margin-right: 110px }
.ir-dl01 dd { width: 110px; margin-right: -110px; text-align: right }
.ir-finance-img { -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); box-shadow: 0 0 10px rgba(0, 0, 0, 0.2) }

.ir-stock-box .more { filter:alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0 }
.ir-stock-box:hover .more { filter:alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1 }

.ir-level3kv { background: url(../images/ir/irkv.jpg) bottom center no-repeat; background-size: cover }

.notice-con { padding: 20px 40px } 
.notice-con a:last-of-type { border-bottom: 0 }
.notice-list { margin-left: 120px; margin-right: 120px; line-height: 24px }
.notice-list-date { width: 120px; margin-left: -120px; color: rgba(0,0,0,0.8) }
.notice-con a:hover .notice-list-date { color: #d11b24 }
.notice-list-down { width: 120px; margin-right: -120px }
.notice-list-down .iconfont { line-height: 24px }
/*----分页----*/ 
.quotes { display: inline-block }
.quotes a { display: inline-block; width: 30px; height: 30px; line-height: 30px; color: #0066b3; margin: 0 1px }
.quotes a .iconfont { font-size: 22px; line-height: 30px }
.quotes a.disabled, .quotes a.disabled:hover { color: #989798 }
.quotes a:hover { color: #ef3139 }
.quotes span { display: inline-block; height: 24px; line-height: 24px; margin: 3px 10px }
.quotes input { width: 40px; text-align: center; height: 24px; line-height: 24px; margin: 3px 10px; border: 1px solid #989798; background: transparent; color: #0066b3 }

.stock-dl { margin-left: 160px }
.stock-dl dt { width: 160px; margin-left: -160px }
.stock-dl dt h1 { display: block; width: 100%; height: 160px; padding-top: 36px }
.stock-dl .stock1_1 { font-size: 60px }
.stock-dl .stock1_1 span { border-bottom: 0 }

.stock-table th, .stock-table td { vertical-align: top; padding-bottom: 10px }
.stock-table th { text-align: right; padding-right: 20px; color: rgba(0,0,0,0.7); word-break: keep-all; }
.stock-table td { padding-left: 20px; border-left: 1px solid #e2e2e2 }

.ircontact-table01 th, .ircontact-table01 td { vertical-align: top; padding-bottom: 20px }
.ircontact-table01 th { width: 60px; line-height: 36px }
.ircontact-table02 th, .ircontact-table02 td { vertical-align: top; padding-bottom: 10px }
.ircontact-table02 th { width: 60px }

/*-------------------客户服务-------------------*/
.servicekv { background: url(../images/service/servicekv.jpg) bottom center no-repeat; background-size: cover }
.service-con01 { padding-top: 60px; padding-bottom: 160px; background: url(../images/service/img01.jpg) center center no-repeat; background-size: cover }

.service-list01 li { position: relative; padding-left: 10px; line-height: 28px }
.service-list01 li:before { content: ''; position: absolute; left: 0; top: 14px; width: 5px; height: 1px; background: #2d63aa }
.service-list01 li:hover:before { background: #d11b24 }

.service-level3kv { background: url(../images/service/service-level3kv.jpg) #1d1d1d bottom center no-repeat; background-size: auto 100% }

.sales-page { min-height: 560px }
.sales-con01 { background: rgba(42,97,174,0.8) }
/* .sales-list-box01 { background: rgba(42,97,174,0.9) } */
.sales-list-box02 { background: rgba(42,97,174,0.6) }
.sales-list li { list-style-type: disc; list-style-position: inside; margin-bottom: 5px }

/*--弹出层--*/
.mask { position:fixed; top:0; left:0; z-index:9998; background:rgba(0,0,0,0.5); width:100%; height:100%; display:none }
.popup { position:fixed; z-index:9999; display:none }
.popup-closebox { width: 100%; padding:15px 30px; background:#2a61ad; position: relative }
.popup-closebox i.icon-close { cursor: pointer; position: absolute; top: 15px; right: 30px;
	-webkit-transition: all .1s ease-out;
	-moz-transition: all .1s ease-out;
	-ms-transition: all .1s ease-out;
	-o-transition: all .1s ease-out;
	transition: all .1s ease-out }
.popup-closebox i.icon-close:hover { 
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	transform: rotate(90deg) }
.popup-con { padding:30px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box }
.contact-inputlist li { margin-bottom: 15px }
input.contact-input { width:600px; height: 40px; line-height: 40px; background: #f5f5f5; border: 1px solid #f5f5f5 }
input.contact-input:focus, .contact-textarea:focus { background: #fff; border: 1px solid #2a61ad }
input.contact-inputCode { width:500px; height: 40px; line-height: 40px; background: #f5f5f5; border: 1px solid #f5f5f5 }
input.contact-inputCode:focus, .contact-textarea:focus { background: #fff; border: 1px solid #2a61ad }
.contact-textarea { width:600px; background: #f5f5f5; border: 1px solid #f5f5f5 }

/*-------------------抖动动画-------------------*/
.overlay-dialog-animate { -webkit-transform-origin: bottom center; -ms-transform-origin: bottom center; transform-origin: bottom center; -webkit-animation: scale-fade .5s forwards cubic-bezier(.8, .02, .45, .91); animation: scale-fade .5s forwards cubic-bezier(.8, .02, .45, .91) }

@-webkit-keyframes scale-fade {
0% {
opacity:0;
-webkit-transform:scale(.8) rotateX(-40deg);
transform:scale(.8) rotateX(-40deg)
}
50% {
opacity:1
}
70% { 
-webkit-transform:scale(1.05) rotateX(0);
transform:scale(1.05) rotateX(0)
}
100% {
-webkit-transform:scale(1) rotateX(0);
transform:scale(1) rotateX(0)
}
}
@keyframes scale-fade {
0% {
opacity:0;
-webkit-transform:scale(.8) rotateX(-40deg);
transform:scale(.8) rotateX(-40deg)
}
50% {
opacity:1
}
70% {
-webkit-transform:scale(1.05) rotateX(0);
transform:scale(1.05) rotateX(0)
}
100% {
-webkit-transform:scale(1) rotateX(0);
transform:scale(1) rotateX(0)
}
}

/*-------------------客户服务-------------------*/
.contactkv { background: url(../images/service/contactkv.jpg) bottom center no-repeat; background-size: cover }

.contact-dl { margin-left: 3.5em }
.contact-dl dt { width: 3.5em; margin-left: -3.5em }

/*-------------------响应式css-------------------*/

@media ( min-width:1260px ) {
.container { width:1170px }

}

@media ( min-width:1000px ) and ( max-width:1259px ) {
.container { width:960px }

.block-padding-t { padding-top: 40px }
.block-padding-b { padding-bottom: 40px }

.level3-con { margin-left: 260px }
.sidebar { width: 220px; margin-left: -260px }

.foot-address-box { margin-top: 0 }
.foot-address { width: 100% }
.foot-address:nth-of-type(2) { float: none; margin-top: 30px }

.war-con-l.area_50 { width: 60% }
.war-con-r.area_50 { width: 40% }
.war-con-r.area_50 .area_80 { width: 100% }

.smartcase-card { padding: 30px }

.stock1_1 { font-size: 80px }

.profile-con01 .poabsolute-h50, .profile-con02 .poabsolute-h50 { position:static!important; top: 0; left: 0; -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0) }
.profile-con02 .poabsolute-h50 { float: right }


.culture-con02 { background: url(../images/about/culture-img01.png) -200px bottom no-repeat; background-size: auto 100% }


}


@media ( min-width:801px ) and ( max-width:999px ) {

h1, .h1 { font-size: 36px }
h2, .h2 { font-size: 32px }
h3, .h3 { font-size: 26px }
h4, .h4 { font-size: 20px }
h5, .h5 { font-size: 16px }
h6, .h6 { font-size: 14px }

.container { width: 90%; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box }

.block-padding-t { padding-top: 30px }
.block-padding-b { padding-bottom: 30px }

.level3-con { margin-left: 250px }
.sidebar { width: 220px; margin-left: -250px }

.footbox { padding: 30px 0 }
.footbox .logo-w { max-width: 150px; margin-bottom: 20px }
.footbox .area_40, .footbox .area_60 { float: none; width: 100% }
.foot-address-box { margin-top: 0 }
.foot-address { width: 100%; margin-bottom: 20px; float: none }

.war-con-l.area_50 { width: 60% }
.war-con-r.area_50 { width: 40% }
.war-con-r.area_50 .area_80 { width: 100% }

.smartcase-card { padding: 30px }
.smart-card .com-rows_2 { height:4.75em; line-height:1.6em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical }

.stock1_1 { font-size: 70px }

.stock-dl { margin-left: 120px }
.stock-dl dt { width: 120px; margin-left: -120px }
.stock-dl dt.paddingleft40, .stock-dl dd.paddingleft40 { padding-left: 20px }
.stock-dl dt h1 { display: block; width: 100%; height: 160px; padding-top: 36px }

.sales-page { min-height: auto }
.sales-con01 { position: static; top: 0 }
.sales-list-box01 { width: 100%; margin-top: 20px }
.sales-page p.margintop40.marginbottom20 { margin-top: 20px; margin-bottom: 10px }
.sales-page img.width60 { width: 100% }

.profile-con01 .poabsolute-h50, .profile-con02 .poabsolute-h50 { position:static!important; top: 0; left: 0; -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0) }
.profile-con02 .poabsolute-h50 { float: right }

.culture-con02 { background: url(../images/about/culture-img01.png) -300px bottom no-repeat; background-size: auto 100% }

}



.header-mobile { width: 100%; height: 48px; line-height: 48px; background: #fff; position: fixed; top: 0; left: 0; z-index: 2000 }
.logo-mobile { width: auto; height: 28px; position: absolute; left: 20px; top: 10px }
.language { width: 40px; text-align: center; height: 48px; line-height: 48px; position: absolute; right: 44px }
.menu { width: 24px; text-align: center; height:18px; line-height: 18px; position: absolute; right: 20px; top: 15px; cursor: pointer; -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; transition: 0.3s }
.bar { height: 2px; width: 24px; display: block; position: absolute; background: #000; -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; transition: 0.3s }
.menu .bar:nth-of-type(1) {
  top: 2px;
  -moz-transition: top 0.3s ease 0.3s, -moz-transform 0.3s ease-out 0s;
  -o-transition: top 0.3s ease 0.3s, -o-transform 0.3s ease-out 0s;
  -webkit-transition: top 0.3s ease, -webkit-transform 0.3s ease-out;
  -webkit-transition-delay: 0.3s, 0s;
  transition: top 0.3s ease 0.3s, transform 0.3s ease-out 0s; 
}
.menu .bar:nth-of-type(2) {
  top: 8px;
  -moz-transition: ease 0.1s 0.2s;
  -o-transition: ease 0.1s 0.2s;
  -webkit-transition: ease 0.2s;
  -webkit-transition-delay: 0.2s;
  transition: ease 0.2s 0.2s;
}
.menu .bar:nth-of-type(3) {
  top: 14px;
  -moz-transition: top 0.3s ease 0.3s, -moz-transform 0.3s ease-out 0s;
  -o-transition: top 0.3s ease 0.3s, -o-transform 0.3s ease-out 0s;
  -webkit-transition: top 0.3s ease, -webkit-transform 0.3s ease-out;
  -webkit-transition-delay: 0.3s, 0s;
  transition: top 0.3s ease 0.3s, transform 0.3s ease-out 0s;
}
.menu.hover .bar:nth-of-type(1) {
  top: 8px;
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  -moz-transition: top 0.2s ease 0s, -moz-transform 0.2s ease-out 0.3s;
  -o-transition: top 0.2s ease 0s, -o-transform 0.2s ease-out 0.3s;
  -webkit-transition: top 0.2s ease, -webkit-transform 0.2s ease-out;
  -webkit-transition-delay: 0s, 0.3s;
  transition: top 0.2s ease 0s, transform 0.2s ease-out 0.3s;
}
.menu.hover .bar:nth-of-type(2) {
  opacity: 0;
}
.menu.hover .bar:nth-of-type(3) {
  top: 8px;
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -moz-transition: top 0.2s ease 0s, -moz-transform 0.2s ease-out 0.3s;
  -o-transition: top 0.2s ease 0s, -o-transform 0.2s ease-out 0.3s;
  -webkit-transition: top 0.2s ease, -webkit-transform 0.2s ease-out;
  -webkit-transition-delay: 0s, 0.3s;
  transition: top 0.2s ease 0s, transform 0.2s ease-out 0.3s;
}

.nav-mobile {
	width: 100%;
    height: calc(100%);
    background: #fff;
    padding-top: 48px;
	padding-left: 20px;
	padding-right: 20px;
	box-sizing: border-box;
    position: fixed;    
    z-index: 1999;
    top: 0;  
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition: all .5s cubic-bezier(.45,0,.14,1.03);
    -o-transition: all .5s cubic-bezier(.45,0,.14,1.03);
    transition: all .5s cubic-bezier(.45,0,.14,1.03);
    overflow: hidden;
}


.nav-mobile.open {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}

.nav-mobile .menu-items {
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%);
    height: calc(100%);
	margin-top: 20px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    -webkit-transition: all .5s cubic-bezier(.45,0,.14,1.03);
    -o-transition: all .5s cubic-bezier(.45,0,.14,1.03);
    transition: all .5s cubic-bezier(.45,0,.14,1.03);
}

.nav-mobile.open .menu-items {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}

.nav-mobile .menu-item {
	opacity: 0;
	-webkit-transition: all .5s cubic-bezier(.45, 0, .14, 1.03);
	-o-transition: all .5s cubic-bezier(.45, 0, .14, 1.03);
	transition: all .5s cubic-bezier(.45, 0, .14, 1.03);
	position: relative;
	border-bottom: 1px solid #eee;
}
.nav-mobile.open .menu-item {
	opacity: 1;
}

.nav-mobile .menu-item .nav-mobile-level {
	display: block;
	height: 42px;
	line-height: 42px;
}

.nav-mobile-icon { width: 62px; height: 42px; line-height: 42px; text-align: center; position: absolute; right: 0; top: 0 }
.nav-mobile-icon .iconfont { line-height: 42px }
.nav-mobile-icon .iconfont:before { content: "\e6f9" }
.nav-mobile-icon.hover .iconfont:before { content: "\e686" }
.nav-mobile-level2 { width: 100%; padding: 0 20px; box-sizing: border-box; display: none }
.nav-mobile-level2 a { display: inline-block; width: 100%; padding: 0 20px; box-sizing: border-box; height: 36px; line-height: 36px; border-top: 1px solid #f1f1f1; color: rgba(0,0,0,0.8) }