/* Page Flash */
.slide{ padding-top:100px;}
.slide div{ background-repeat:no-repeat; background-position:center; background-size:cover; height:770px;}
@media screen and ( max-width:2048px ){
.slide div{ height:620px;}
}
@media screen and ( max-width:1920px ){
.slide div{ height:580px;}
}
@media screen and ( max-width:1680px ){
.slide div{ height:508px;}
}
@media screen and ( max-width:1440px ){
.slide div{ height:435px;}
}
@media screen and ( max-width:1280px ){
.slide{ padding-top:80px;}
.slide div{ height:385px;}
}
@media screen and ( max-width:1024px ){
.slide div{ height:320px;}
}
@media screen and ( max-width:800px ){
.slide{ padding-top:60px;}
.slide div{ height:270px;}
}
@media screen and ( max-width:480px ){
.slide div{ height:220px;}
}

.slide2 div{ height:1265px;}
@media screen and (max-width:2048px){
.slide2 div{ height:1000px;}
}
@media screen and (max-width:1920px){
.slide2 div{ height:950px;}
}
@media screen and (max-width:1680px){
.slide2 div{ height:830px;}
}
@media screen and (max-width:1440px){
.slide2 div{ height:700px;}
}
@media screen and (max-width:1280px){
.slide2 div{ height:630px;}
}
@media screen and (max-width:1024px){
.slide2 div{ height:500px;}
}
@media screen and (max-width:800px){
.slide2 div{ height:400px;}
}
@media screen and (max-width:480px){
.slide2 div{ height:250px;}
}

/* Page Public */
.public{ background-color:#f5f5f5; padding:60px 0;}
@media screen and (max-width:1024px){
.public{ padding:50px 0;}
}
@media screen and (max-width:480px){
.public{ padding:30px 0;}
}

/* Page About */
.about strong{ display:block; font-size:24px; color:#cf000e; text-transform:uppercase; margin:10px 0 30px;}
.about dl{ float:right; width:45%; margin-top:8px; margin-left:5%; margin-bottom:30px;}
.about ul{ margin-top:48px;}
.about ul li{ float:left; width:48.75%; margin-right:2.5%; margin-bottom:2.5%;}
.about ul li:nth-of-type(2n){ margin-right:0;}
.about ul li a{ display:block; width:100%; height:148px; background-color:#fff; overflow:hidden;}
.about ul li a span{ display:block; float:left; width:68px; height:60px; margin:43px 0 0 35px; background-repeat:no-repeat; background-position:center; background-size:68px 60px; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
.about ul li a span.ab01{ background-image:url(../Images/ys01.png);}
.about ul li a span.ab02{ background-image:url(../Images/ys02.png);}
.about ul li a span.ab03{ background-image:url(../Images/ys03.png);}
.about ul li a span.ab04{ background-image:url(../Images/ys04.png);}
.about ul li a p{ margin:35px 35px 0 138px; line-height:22px; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
.about ul li a p strong{ display:block; font-family:"HORATIOM"; font-size:15px; font-weight:normal; color:#333; text-transform:uppercase; letter-spacing:.3px; margin-bottom:5px; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}

@media screen and (max-width:1024px){
.about strong{ font-size:20px;}
.about dl{ margin-top:5px; margin-bottom:20px;}
.about ul{ margin-top:30px;}
.about ul li a p{ margin-top:27px;}
}
@media screen and (max-width:800px){ 
.about dl{ width:45%;}
.about ul li{ width:100%; margin-right:0;}
.about ul li a p{ margin-top:35px;}
}
@media screen and (max-width:480px){ 
.about strong{ font-size:18px; margin:5px 0 20px;}
.about dl{ float:inherit; width:100%; margin-left:0;}
.about ul{ margin-top:20px;}
.about ul li{ margin-bottom:20px;} 
.about ul li a{ height:auto; background-color:inherit;}
.about ul li a span{ display:none;}
.about ul li a p{ margin:0;}
}

/* Page Exhibition */
.exhibition a{ display:block; float:left; width:31.8%; margin-right:2.3%; margin-top:1.15%; margin-bottom:1.15%;}
.exhibition a:nth-of-type(3n){ margin-right:0;}

@media screen and (max-width:800px){ 
.exhibition a{ width:48.5%; margin-right:3%; margin-top:1.5%; margin-bottom:1.5%;}
.exhibition a:nth-of-type(3n){ margin-right:3%;}
.exhibition a:nth-of-type(2n){ margin-right:0;}
}

/* Page Honor */
.honor a{ display:block; float:left; width:31.4%; margin-right:2.9%; margin-top:1.45%; margin-bottom:1.45%;}
.honor a:nth-of-type(3){ margin-right:0;}
.honor a:nth-of-type(4){ width:48.55%;}
.honor a:nth-of-type(5){ width:48.55%; margin-right:0;}
.honor a:nth-of-type(8){ margin-right:0;}

@media screen and (max-width:480px){ 
.honor a{ width:100%; margin-right:0; margin-top:2%; margin-bottom:2%;}
.honor a:nth-of-type(4){ width:100%;}
.honor a:nth-of-type(5){ width:100%;}
}

/* Page Contact */
.map_bg{ padding-top:100px;}
#map_canvas{ width:100%; height:580px;}
#map_name{ font-weight:bold; color:#cf000e;}
.contact-bg{ width:100%; padding:50px; background-color:#fff;}
.contact-zb{ float:right; width:50%; line-height:30px;}
.contact-zb dl{ display:block; font-size:18px; font-weight:bold; color:#cf000e; text-transform:uppercase; margin-bottom:15px;}
.contact-zb span{ font-family:Arial;}
.contact-yb{ float:left; width:42%;}
.contact-yb dl{ margin-bottom:10px;}
.contact-in{ width:100%; height:35px; font-family:Arial; color:#888; padding:0 10px; margin-bottom:10px; border:1px solid #e0e0e0;}
.contact-tx{ width:100%; height:80px; font-family:Arial; color:#888; padding:10px; margin-bottom:4px; border:1px solid #e0e0e0; outline:none; resize:none;}
.contact-sb{ width:120px; height:35px; font-family:Arial; font-size:18px; color:#fff; text-transform:uppercase; cursor:pointer; border:none; background-color:#cf000e;}
.contact-sb:hover{ background-color:#000;}

@media screen and (max-width:1280px){
.map_bg{ padding-top:80px;}
}
@media screen and (max-width:1024px){
#map_canvas{ height:450px;}
.contact-bg{ padding:3.5%;}
.contact-zb{ line-height:24px;}
}
@media screen and (max-width:800px){
.contact-bg{ padding:25px;}
.contact-zb{ float:inherit; width:100%; line-height:24px;}
.contact-yb{ float:inherit; width:100%;}
.contact-yb dl{ margin-top:20px; color:#cf000e;}
}
@media screen and (max-width:640px){
.map_bg{ padding-top:60px;}
}
@media screen and (max-width:480px){
#map_canvas{ height:400px;}
}

/* Page Products */
.cl-lb{ display:none; padding:3.5% 3.5% 1.5%; background:#f5f5f5;}
.cl-lb a{ float:left; display:block; width:48.5%; margin-right:3%; margin-bottom:2%; line-height:20px; color:#555; background:#fff; padding:5px 10px; overflow:hidden;}
.cl-lb a:nth-of-type(2n){ margin-right:0;}
.cl-lb a:nth-of-type(2n+1){ clear:both;}
.cl-lb a.b, .cl-lb a:hover{ background:#cf000e; color:#fff;}

.ig-lb{ max-width:1200px; margin:auto; padding:75px 0;}
.ig-zb{ float:left; width:250px;}
.ig-cl{ width:100%; padding-bottom:35px; background-color:#f2f2f2;}
.ig-cl dl{ width:100%; height:120px; font-family:"HORATIOM"; font-size:20px; color:#fff; text-transform:uppercase; letter-spacing:.3px; background-color:#cf000e; padding:30px 0 0 30px; margin:0;}
.ig-cl ul{ padding-left:30px; margin-top:-41px;}
.ig-cl ul li a{ display:block; background-color:#fff; border-bottom:1px solid #f2f2f2; color:#555; line-height:20px; padding:10px 15px;}
.ig-cl ul li a:hover,.ig-cl ul li a.g{ color:#cf000e;}
.ig-cl ul li ul.level{ padding-left:0; padding-bottom:10px; margin-top:0; background:#fff;}
.ig-cl ul li ul.level li a{ font-size:12px; border-bottom:none; padding:0 15px 5px;}
.ig-cl ul li ul.level li a:hover,.ig-cl ul li ul.level li a.l{ color:#cf000e;}

.ig-yb{ margin-left:300px;}
.ig-yb dl{ margin-bottom:25px; color:#888; height:24px;}
.ig-yb dl u{ text-decoration:none;}
.ig-yb dl font{ color:#cf000e;}
.ig-ls li{ float:left; width:31.4%; margin-right:2.9%; margin-bottom:2.9%;}
.ig-ls li:nth-of-type(3n){ margin-right:0;}
.ig-ls li a{ display:block; width:100%; height:100%; background-color:#f2f2f2; padding:15px;}
.ig-ls li a img{ width:100%;}
.ig-ls li a div{ width:100%; color:#cf000e; line-height:22px; margin:0; padding-top:10px; overflow:hidden;}
.ig-ls li a div span{ display:block; line-height:20px;}
.ig-ls li a:hover{ background-color:#cf000e;}
.ig-ls li a:hover div{ color:#fff;}
.ig-ls li a:hover div span{ color:#fff;}

@media screen and (max-width:1280px){ 
.ig-lb{ max-width:inherit; padding:65px 25px;}
}
@media screen and (max-width:1024px){
.cl-lb{ display:block;}
.ig-lb{ padding:50px 3.5%;}
.ig-zb{ display:none;}
.ig-yb{ margin-left:0;}
}
@media screen and (max-width:640px){ 
.ig-lb{ padding:0 3.5% 35px;}
.ig-yb dl{ margin-bottom:30px; text-align:center; height:60px;}
.ig-yb dl u{ display:none;}
.ig-yb dl font{ display:inline-table; height:60px; line-height:60px; font-size:12px; position:relative; overflow:hidden;}
.ig-yb dl font span{ position:absolute; left:0; bottom:0; display:block; width:100%; height:3px; background-color:#cf000e;}
.ig-ls li{ width:48.5%; margin-right:3%; margin-bottom:3%;}
.ig-ls li:nth-of-type(3n){ margin-right:3%;}
.ig-ls li:nth-of-type(2n){ margin-right:0;}
.ig-ls li:nth-of-type(2n+1){ clear:both;}
}
@media screen and (max-width:480px){
.cl-lb a{ float:inherit; width:100%; margin-right:0;} 
.ig-ls li a{ padding:10px;}
}
@media screen and (max-width:320px){ 
.ig-yb dl{ display:none;}
.ig-ls{ margin-top:30px;}
}

/* Page Page */
.page a{ display:block; float:left; padding:10px 20px; background-color:#f2f2f2; margin-right:5px; font-family:Arial; color:#555; cursor:pointer;}
.page a:hover{ background-color:#cf000e; color:#fff;}
.page a.pageNext{ font-weight:bold; color:#e60012;}
.page a.pageNext:hover{ color:#fff;}

@media screen and (max-width:1024px){ 
.page a{ padding:8px 15px;}
}
@media screen and (max-width:480px){
.page a{ margin-top:8px;}
}

/* Page ProductView */
.ig-gg{ text-align:center;}
.ig-gg img{ max-width:790px;}
.ig-nm{ font-family:Arial; font-size:24px; font-weight:bold; color:#e60012; text-align:center; margin-top:30px;}
.ig-js{ margin-top:50px;}
.ig-js img{ max-width:790px;}
.ig-pj{ margin-top:50px;}
.ig-pj img{ max-width:900px;}
.ig-nt{ margin-top:50px;}
.ig-nt a{ float:left; padding:10px 20px; background-color:#f2f2f2; color:#555;}
.ig-nt a:nth-of-type(2){ float:right;}
.ig-nt a:hover{ background-color:#e60012; color:#fff;}

@media screen and (max-width:1024px) {
.ig-nt a{ padding:8px 15px;}
}
@media screen and (max-width:640px){ 
.ig-nm{ font-size:18px; margin-top:20px;}
.ig-js{ margin-top:30px;}
.ig-pj{ margin-top:30px;}
.ig-nt{ margin-top:30px;}
}

/* Css Marketing */
.marketing-lb{ margin:20px 0;}
.marketing-ig{ float:right; background-color:#f5f5f5; width:50%; height:600px; background:url(../Images/global.jpg) no-repeat center; background-size:cover;}
.marketing-tx{ float:left; background-color:#fff; width:50%; height:600px; padding:80px 55px;}
.marketing-tx span{ display:block; font-size:24px; font-weight:bold; color:#cf000e; text-transform:uppercase; margin-bottom:30px;}
.marketing-tx p{ margin-top:20px; line-height:24px;}
.marketing-mb{ display:none; text-align:center;}
.marketing-mb img{ width:75%;}

@media screen and (max-width:1024px){ 
.marketing-lb{ margin:10px 0;}
.marketing-ig{ display:none;}
.marketing-tx{ float:inherit; background-color:#f5f5f5; width:100%; height:auto; padding:0;}
.marketing-tx span{ font-size:20px; margin-bottom:20px;}
.marketing-mb{ display:block;}
}
@media screen and (max-width:640px){ 
.marketing-mb img{ width:100%;}
}





.gsTx{ padding:50px 0 15px; text-align:center;}
.gsTx a{ font-size:24px; font-weight: bold; color:#cf000e; margin: 0 50px;}
.gsTx a:hover{ color:#333;}

@media screen and (max-width:1080px){
.gsTx a{ margin: 0 25px;}
}
@media screen and (max-width:1024px){
.gsTx a{ font-size:20px;}
}
@media screen and (max-width:800px){
.gsTx a{ display: block; margin: 25px 0;}
}
@media screen and (max-width:480px){
.gsTx{ padding:0;}
}