
/****************************************************************************
CSS RESET
****************************************************************************/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, 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, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas,
details, embed,  figure, figcaption, footer, header, hgroup,  menu, nav, output, ruby, section, summary, time, mark, audio,
video {	margin: 0; 	padding: 0;	border: 0; font-family: "Arial", "sans-serif","Microsoft Yahei"; font-size: 100%;vertical-align: baseline;}
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table {	border-collapse: collapse; border-spacing: 0; }
b{ font-weight: 600; }


a:link,a:visited{color:#333;text-decoration:none;}
a:hover{color:#333;text-decoration:none;}

.transition_1{-webkit-transition: all 200ms linear;
-moz-transition: all 200ms linear;
-o-transition: all 200ms linear;
-ms-transition: all 200ms linear;
transition: all 200ms linear;}

.shadowbox_0{ 
-webkit-box-shadow: 5px 0px 8px #333;
-moz-box-shadow: 5px 0px 8px #333;
box-shadow: 5px 0px 8px #333;}
.shadowbox_1{ 
-webkit-box-shadow: 5px 5px 8px #ddd;
-moz-box-shadow: 5px 5px 8px #ddd;
box-shadow: 5px 5px 8px #ddd;}
.shadowbox_2{ 
-webkit-box-shadow: 0px 0px 8px #ddd;
-moz-box-shadow: 0px 0px 8px #ddd;
box-shadow: 0px 0px 8px #ddd;}

.shadowbox_3{ 
-webkit-box-shadow: 0px 0px 8px #ccc;
-moz-box-shadow: 0px 0px 8px #ccc;
box-shadow: 0px 0px 8px #ccc;}

.alpha_1{filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;}
.alpha_2{filter:alpha(opacity=80);
-moz-opacity:0.8;
-khtml-opacity: 0.8;
opacity: 0.8;}
.alpha_3{filter:alpha(opacity=90);
-moz-opacity:0.9;
-khtml-opacity: 0.9;
opacity: 0.9;}

.shadow-only-bottom{ 
	box-shadow: 0px 7px 7px -7px #ddd; 
	-webkit-box-shadow: 0px 7px 7px -7px #ddd; 
	-moz-box-shadow: 0px 7px 7px -7px #ddd; 
}
.shadow-only-right{ 
	box-shadow: 7px 0px 7px -7px #5E5E5E;
	-webkit-box-shadow: 7px 0px 7px -7px #5E5E5E;
	-moz-box-shadow: 7px 0px 7px -7px #5E5E5E;
}
.shadow-only-left{ 
	box-shadow: -7px 0px 7px -7px #5E5E5E;
	-webkit-box-shadow: -7px 0px 7px -7px #5E5E5E; 
	-moz-box-shadow: -7px 0px 7px -7px #5E5E5E; 
}
.showdow-only-top{ 
	box-shadow: 0px -7px 7px -7px #5E5E5E;
	-webkit-box-shadow: 0px -7px 7px -7px #5E5E5E;
	-moz-box-shadow: 0px -7px 7px -7px #5E5E5E;
}

.radius_1{ -moz-border-radius: 50%; /* Mozilla浏览器的私有属性 */ 
-webkit-border-radius: 50%; /* Webkit浏览器的私有属性 */ 
border-radius: 50%;}
.radius_2{ -moz-border-radius: 8px; /* Mozilla浏览器的私有属性 */ 
-webkit-border-radius: 8px; /* Webkit浏览器的私有属性 */ 
border-radius: 8px;}

.no-bg{ background: none; }

/************************************************************/
*{padding:0; margin:0;}
html, body{ font-family: "Arial", "sans-serif","Microsoft Yahei"; color:#444; min-width: 320px; max-width:1024px; width:100%; font-size: 12px; margin: 0 auto; }
h1{ font-family: "Arial", "sans-serif","Microsoft Yahei"; }

.page-content{ max-width: 1024px;margin:0 auto; position: relative; }
.container-fluid{ margin:0px auto; max-width: 1024px; }
.container-fluid .row{ margin: 0 auto; }

/*导航菜单*/

.nav-blank{ height: 60px; }
.nav-section{ position: fixed; top: 0; display: block; height: 60px; line-height: 60px; width: 100%; max-width: 1024px; z-index: 99999; background-color: #ffffff; }
.nav-row{ position: relative; }
.nav-logo{ display: inline-block; margin-left: 10px; height: 100%; }
.nav-logo img{ width: 70%; display: inline-block; }
.nav-cat-icon{ width: 60px; height: 60px; display: block; position: relative; float: right; line-height: 0px; }
.nav-cat-icon .menu-icon{ position: absolute; right: 10px; top: 22px;
	width: 22px;
	height: 22px;
	border-top: 2px solid #DD575C;
	border-bottom: 2px solid #DD575C;
	background-color: #DD575C;
	padding: 8px 0;
    background-clip:content-box;
    display: block;
}

/* Mobile Nav width: 414px *****************************************/
.nav-section #top-nav-box{width: 100%; height: 0px; display: block; overflow: visible; position: relative; z-index: 99998;}
.nav-section #top-nav-box .body-mask{ width: 100%; height: 1500px; display: none; opacity:0; position: fixed; top: 60px; z-index: 99990; background-color: #0C0C0C;}
.nav-section #top-nav-box .slide-nav{ width: 78%; height: 1500px; display: block; position: fixed; top:60px; right:-1024px; z-index: 99995; background-color: #343535;}
.nav-section #top-nav-box .slide-nav .nav-item{ width: 100%; min-height: 58px; line-height: 58px; margin: 0px auto; background-color: #583538; border-bottom: #343535 solid 1px; text-transform: uppercase;  }
.nav-section #top-nav-box .slide-nav .nav-item a.parent-link{ width: 100%; height: 100%; display: block; color: #fff; font-weight: bold; font-size: 1.4rem; padding-left: 2rem; background-color: #e83743; position: relative;}
.nav-section #top-nav-box .slide-nav .nav-item a.parent-link:before{content: ''; width: 14px; height: 14px; display: block;
    border-right: #fff solid 2px; border-top: #fff solid 2px; position: absolute; top:22px; right:2.5rem;
    transform:rotate(45deg);
    -ms-transform:rotate(45deg); 	/* IE 9 */
    -moz-transform:rotate(45deg); 	/* Firefox */
    -webkit-transform:rotate(45deg); /* Safari 和 Chrome */
    -o-transform:rotate(45deg); 	/* Opera */
}
.nav-section #top-nav-box .slide-nav .nav-focus a.parent-link:before{
    transform:rotate(135deg);
    -ms-transform:rotate(135deg); 	/* IE 9 */
    -moz-transform:rotate(135deg); 	/* Firefox */
    -webkit-transform:rotate(135deg); /* Safari 和 Chrome */
    -o-transform:rotate(135deg); 	/* Opera */
}

/*Mobile Nav 二级子菜单*/
.nav-section #top-nav-box .slide-nav .nav-item .sub-nav-item{ width: 100%; padding-top: 10px; padding-bottom: 10px;}
.nav-section #top-nav-box .slide-nav .nav-item .sub-nav-item .sub-link{ width: 100%; height: 40px; line-height: 40px; margin: 0px auto;}
.nav-section #top-nav-box .slide-nav .nav-item .sub-nav-item .sub-link a{width: 100%; height: 100%; display: block; color: #fff; font-weight: 600; font-size: 1.2rem; padding-left: 3rem; text-transform: uppercase; }

/*Mobile Nav 中英文转换*/
.nav-section #top-nav-box .slide-nav .lang-change{ width: 30%; height: 4rem; display: block; margin: 0px auto; margin-top: 3rem;}
.nav-section #top-nav-box .slide-nav .lang-change .lang-link{ width: 2rem; height: 2rem; line-height: 1rem; float: left; text-align: center;}
.nav-section #top-nav-box .slide-nav .lang-change .float-right{ float: right; }
.nav-section #top-nav-box .slide-nav .lang-change .lang-link a{ width: 100%; height: 100%; display: block;color: #fff; font-weight: 600; font-size: 1.3rem; position: relative;}
.nav-section #top-nav-box .slide-nav .lang-change .lang-focus a{ color: #e83743;}
.nav-section #top-nav-box .slide-nav .lang-change .lang-focus span{ width: 12px; height: 12px; display: block; margin: -2rem auto; position: relative; overflow: hidden;}
.nav-section #top-nav-box .slide-nav .lang-change .lang-focus span:before{content: ''; width: 12px; height: 12px; display: block; position: absolute; top:8px; left:0px; background-color: #e83743;
    transform:rotate(45deg);
    -ms-transform:rotate(45deg); 	/* IE 9 */
    -moz-transform:rotate(45deg); 	/* Firefox */
    -webkit-transform:rotate(45deg); /* Safari 和 Chrome */
    -o-transform:rotate(45deg); 	/* Opera */}




@media (max-width:360px){
    /*Mobile Nav*/
    .nav-section #top-nav-box .slide-nav .nav-item{ width: 100%; min-height: 40px; line-height: 40px;}
    .nav-section #top-nav-box .slide-nav .nav-item a.parent-link{ font-weight: 600; font-size: 1.2rem; padding-left: 1rem; background-color: #e83743; position: relative;}
    .nav-section #top-nav-box .slide-nav .nav-item a.parent-link:before{content: ''; width: 10px; height: 10px; top:15px;    }
    /*Mobile Nav 二级子菜单*/
    .nav-section #top-nav-box .slide-nav .nav-item .sub-nav-item{ width: 100%; padding-top: 5px; padding-bottom: 5px;}
    .nav-section #top-nav-box .slide-nav .nav-item .sub-nav-item .sub-link{ width: 100%; height: 30px; line-height: 30px; margin: 0px auto;}
    .nav-section #top-nav-box .slide-nav .nav-item .sub-nav-item .sub-link a{width: 100%; height: 100%; display: block; color: #fff; font-weight: normal; font-size: 1rem; padding-left: 2rem;}
    /*Mobile Nav 中英文转换*/
    .nav-section #top-nav-box .slide-nav .lang-change .lang-link a{font-weight: 600; font-size: 1.2rem;}
}


@media (min-width:450px){
	.nav-section #top-nav-box .slide-nav{ width: 65%;}
}

@media (min-width:768px){
	.container-fluid .row{ width:93%; }
	.nav-logo{ margin-left: 70px; }
	.nav-logo img{ width: 100%; }

	.nav-blank{ height: 100px; }
	.nav-section{ height: 100px; line-height: 100px; }
	.nav-logo{ display: inline-block; margin-left: 30px; height: 100%; }
	.nav-cat-icon{ right: 30px; top: 38px; }
	.nav-cat-icon .menu-icon{ 
		width: 40px;
		height: 30px;
		border-top: 2px solid #DD575C;
		border-bottom: 2px solid #DD575C;
		background-color: #DD575C;
		padding: 12px 0;
	    background-clip:content-box;
	    display: block;
	}

    /* Mobile Nav */
    .nav-cat-icon .menu-icon{top:0px;}
    .nav-section #top-nav-box .body-mask{ top:100px;}
    .nav-section #top-nav-box .slide-nav{ width: 40%;top: 100px;}
    .nav-section #top-nav-box .body-mask{ top: 100px;}
}

@media (min-width:1024px){
	.nav-section #top-nav-box .slide-nav{ width: 35%;}
}

/*导航菜单 END*/

.top-b-img img{ display: block; width: 100%; }
