@charset "utf-8";
/* Css Document */
html{ font-family:Microsoft YaHei; font-size:.875rem; color:#333; line-height:1.5rem;}
body,div,ul,li,dl,dt,dd,ol,form,a,span,p,h1,h2,h3,h4,h5,h6,label,table,tbody,tr,th,td,object,iframe{ margin:0px; padding:0px;}
img{ vertical-align:bottom; border:none;}
ul,li{ list-style-type:none;}
a{ color:#333; text-decoration:none;}
a:hover{ color:#d20313; text-decoration:none;}
a{ outline: none;}
a:active{ star:expression(this.onFocus=this.blur());}
:focus{ outline:0;}
.clear{ width:0px; height:0px; padding:0px; margin:0px; clear:both;}
.left{ float:left;}
.right{ float:right;}
@font-face {
 font-family: "vi-logo-font-Gotham-Book";
 src: url("../Fonts/vi-logo-font-Gotham-Book.otf");
 src: url("../Fonts/Gotham-Book.eot") format("embedded-opentype"),
 url("../Fonts/Gotham-Book.woff") format("woff"),
 url("../Fonts/Gotham-Book.ttf") format("truetype"),
 url("../Fonts/Gotham-Book.svg") format("svg");
}
.eng{ font-family:"vi-logo-font-Gotham-Book";}

/* Css Desktop Top */
.nav{ display:block; position:fixed; top:0px; left:0px; width:100%; height:100px; background-color:#fff; padding:0 10%; z-index:1000; box-sizing:border-box; -webkit-box-sizing:border-box; box-shadow:0 3px 3px 0 rgba(0, 0, 0, 0.08); -webkit-box-shadow:0 3px 3px 0 rgba(0, 0, 0, 0.08);}
.logo{ float:left; width:95px; height:55px; margin-top:23px;}
.logo img{ width:95px; height:55px;}
.db-lb{ float:right;}
.db-lb ul li{ float:left; margin:0 10px;}
.db-lb ul li a{ display:block; padding:0 10px; line-height:100px; font-size:1.12rem; color:#000; transition:all .2s ease-in-out; -webkit-transition:all .2s ease-in-out;}
.db-lb ul li a:hover{ color:#d20313;}
.db-tb{ float:right; margin-left:8px;}
.db-tb ul{ margin-top:34px;}
.db-tb ul li{ float:right; margin-left:18px;}
.db-tb ul li a{ cursor:pointer;}
@media screen and (max-width:1440px) { 
.nav{ padding:0 5%;}
}
@media screen and (max-width:1280px) { 
.db-lb ul li{ margin:0px;}
}
@media screen and (max-width:1024px) { 
.db-lb ul li a{ padding:2px 5px 0;}
}
@media screen and (max-width:800px) { 
.nav{ display:none;}
}

/* Css Mobile Top */
.dh-bg{ display:none; position:fixed; top:0px; left:0px; width:100%; height:60px; background-color:#fff; z-index:1000; -webkit-box-shadow:0 3px 3px 0 rgba(0, 0, 0, 0.08); box-shadow:0 3px 3px 0 rgba(0, 0, 0, 0.08);}
.mobile{ width:62px; height:36px; margin-top:12px; margin-left:15px;}
.toggle{ display:block; float:right; width:72px; height:60px; background-color:#d20313;}
.toggle img{ width:28px; height:20px; margin-left:22px; margin-top:20px;}
@media screen and (max-width:800px) { 
.dh-bg{ display:block;}
}

/* Css flash */
.flash{ margin-top:100px;}
@media screen and (max-width:800px) { 
.flash{ margin-top:60px;}
}

/* Css Img */
.ig-bg{ margin:65px 5% 0;}
.ig-bg h1{ font-size:2rem; font-weight:normal; text-align:center; line-height:2.5rem;}
.ig-bg h5{ font-family:"vi-logo-font-Gotham-Book"; font-size:1.08rem; font-weight:normal; color:#888; text-align:center; line-height:2.2rem;}
.ig-bg ul{ margin-top:15px;}
.ig-bg ul li{ float:left; width:20%; margin:0 2.5%; overflow:hidden;}
.ig-bg ul li img{ width:100%;}
.ig-bg ul li h2{ font-size:1.25rem; font-weight:normal; line-height:2.5rem; margin-left:50px;}
.ig-bg ul li font{ font-family:"vi-logo-font-Gotham-Book";}
.ig-bg ul li p{ color:#666; margin-left:50px;}
.a{ display:block; width:98px; height:33px; line-height:33px; border:1px solid #c0c0c0; margin-top:20px; text-align:center; color:#888; border-radius:3px; -webkit-border-radius:3px; transition:all .2s ease-in-out; -webkit-transition:all .2s ease-in-out;}
.a:hover{ border:1px solid #d20313; background-color:#d20313; color:#fff;}
@media screen and (max-width:1440px) { 
.ig-bg{ margin:65px 0 0;}
}
@media screen and (max-width:1280px) { 
.ig-bg ul li h2{ margin-left:0px;}
.ig-bg ul li p{ margin-left:0px;}
}
@media screen and (max-width:1024px) { 
.ig-bg ul li{ width:40%; margin:0 5% 10px;}
.ig-bg ul li h2{ margin-left:50px;}
.ig-bg ul li p{ margin-left:50px;}
}
@media screen and (max-width:800px) { 
.ig-bg{ margin:45px 0 0;}
.ig-bg ul{ margin-top:0px;}
.ig-bg ul li h2{ margin-left:0px;}
.ig-bg ul li p{ margin-left:0px;}
}
@media screen and (max-width:480px) { 
.ig-bg{ margin:25px 0 0;}
.ig-bg h1{ font-size:1.5rem; line-height:2rem;}
.ig-bg h5{ font-size:1rem; line-height:2rem;}
.ig-bg ul li h2{ font-size:1.05rem; line-height:2rem;}
}
@media screen and (max-width:320px) { 
.ig-bg ul li p{ display:none;}
.ig-bg ul li h2{ font-family:Microsoft YaHei; font-size:1rem; line-height:1.5rem; margin-left:0px; text-align:center;}
.ig-bg ul li font{ display:block;}
}

/* Css About */
.ab-bg{ background-image:url(../Images/gs.jpg); background-position:center; background-size:cover; padding:100px 10%; margin-top:100px; box-sizing:border-box; -webkit-box-sizing:border-box;}
.ab-js{ background-color:#fff;}
.ab-js ul li{ float:right; width:50%; overflow:hidden;}
.ab-js ul li.ab-ig a{ display:block; width:100%; overflow:hidden; position:relative;}
.ab-js ul li.ab-ig a .ab-mg{ display:block; background-image:url(../Images/com.jpg); background-repeat:no-repeat; background-position:center; background-size:cover; width:100%; height:500px; overflow:hidden; transition:all .5s ease-in-out; -webkit-transition:all .5s ease-in-out;}
.ab-js ul li.ab-ig a:hover .ab-mg{ -transform:scale(1.05,1.05); -webkit-transform:scale(1.05,1.05);}
.ab-js ul li.ab-ig a .ab-bj{ position:absolute; left:0; top:0; z-index:2; width:100%; height:100%; background-color:#000; opacity:0; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=0)"; transition:all .5s ease-in-out; -webkit-transition:all .5s ease-in-out;}
.ab-js ul li.ab-ig a:hover .ab-bj{ opacity:0.25;filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.25);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=0.25)";}
.ab-js ul li.ab-ig a .ab-bs{ position:absolute; left:50%; top:50%; z-index:3; width:60px; height:28px; margin-left:-30px; margin-top:-15px; border-top:1px solid #fff; border-bottom:1px solid #fff; opacity:0; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=0)"; transition:all .5s ease-in-out; -webkit-transition:all .5s ease-in-out;}
.ab-js ul li.ab-ig a:hover .ab-bs{ opacity:1; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=1);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=1)"; -transform:scale(.1,1); -webkit-transform:scale(.1,1);}
.ab-js ul li.ab-ig a .ab-am{ position:absolute; left:50%; top:50%; z-index:3; width:60px; height:28px; line-height:28px; color:#fff; margin-left:-30px; margin-top:-15px; opacity:0; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=0)"; transition:all .5s ease-in-out; -webkit-transition:all .5s ease-in-out;}
.ab-js ul li.ab-ig a:hover .ab-am{ opacity:1; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=1);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=1)";}
.ab-js ul li.ab-tx .ab-lt{ margin:10% 14% 0 8%;}
.ab-js ul li.ab-tx .ab-lt h1{ font-size:2rem; font-weight:normal; line-height:2.5rem;}
.ab-js ul li.ab-tx .ab-lt h5{ font-family:"vi-logo-font-Gotham-Book"; font-size:1.08rem; font-weight:normal; color:#888; line-height:2.2rem;}
.ab-js ul li.ab-tx .ab-lt h3{ font-size:1.5rem; font-weight:normal; color:#666; line-height:4rem;}
.ab-js ul li.ab-tx .ab-lt p{ color:#888; margin-top:5px;}
.ab-js ul li.ab-tx .ab-lt a{ display:block; width:40px; height:40px; border:1px solid #aeaeae; border-radius:20px; -webkit-border-radius:20px; margin-top:15%; background-image:url(../Images/jt01.png); background-repeat:no-repeat; background-position:center; transition:all .2s ease-in-out; -webkit-transition:all .2s ease-in-out;}
.ab-js ul li.ab-tx .ab-lt a:hover{ border:1px solid #d20313; background-color:#d20313; background-image:url(../Images/jt02.png);}
@media screen and (max-width:1680px) { 
.ab-js ul li.ab-ig a .ab-mg{ height:450px;}
}
@media screen and (max-width:1440px) { 
.ab-bg{ padding:100px 5%;}
}
@media screen and (max-width:1024px) { 
.ab-bg{ padding:65px 5%; margin-top:65px;}
}
@media screen and (max-width:800px) { 
.ab-bg{ background-image:none; background-color:#f0f0f0; padding:0; margin-top:50px;}
.ab-js ul li{ width:100%;}
.ab-js ul li.ab-tx .ab-lt{ margin:5%;}
.ab-js ul li.ab-tx .ab-lt a{ margin-top:5%;}
}
@media screen and (max-width:480px) { 
.ab-js ul li.ab-ig a .ab-mg{ height:300px;}
.ab-js ul li.ab-tx .ab-lt h1{ font-size:1.5rem; line-height:2rem;}
.ab-js ul li.ab-tx .ab-lt h5{ font-size:1rem; line-height:2rem;}
.ab-js ul li.ab-tx .ab-lt h3{ font-size:1.2rem; line-height:3rem;}
}

.ab-sm{ margin-top:20px;}
.ab-sm ul li{ float:left; width:24.025%; margin-right:1.3%; overflow:hidden; box-sizing:border-box; -webkit-box-sizing:border-box;}
.ab-sm ul li.ab-yb{ margin-right:0;}
.ab-sm ul li a{ display:block; width:100%; overflow:hidden; position:relative; background:#333;}
.ab-sm ul li a img{ display:block; width:100%; overflow:hidden; transition:all .5s ease-in-out; -webkit-transition:all .5s ease-in-out;}
.ab-sm ul li a:hover img{ -transform:scale(1.05,1.05); -webkit-transform:scale(1.05,1.05);}
.ab-sm ul li a .ab-aj{ position:absolute; left:0; top:0; z-index:2; width:100%; height:100%; background-color:#000; opacity:0; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=0)"; transition:all .5s ease-in-out; -webkit-transition:all .5s ease-in-out;}
.ab-sm ul li a:hover .ab-aj{ opacity:0.35;filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.35);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=0.35)";}
.ab-sm ul li a .ab-as{ position:absolute; left:50%; top:50%; z-index:3; width:60px; height:28px; margin-left:-30px; margin-top:-15px; border-top:1px solid #fff; border-bottom:1px solid #fff; opacity:0; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=0)"; transition:all .5s ease-in-out; -webkit-transition:all .5s ease-in-out;}
.ab-sm ul li a:hover .ab-as{ opacity:1; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=1);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=1)"; -transform:scale(.1,1); -webkit-transform:scale(.1,1);}
.ab-sm ul li a .ab-um{ position:absolute; left:50%; top:50%; z-index:3; width:60px; height:28px; line-height:28px; color:#fff; margin-left:-30px; margin-top:-15px; opacity:0; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=0)"; transition:all .5s ease-in-out; -webkit-transition:all .5s ease-in-out;}
.ab-sm ul li a:hover .ab-um{ opacity:1; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=1);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=1)";}
.ab-sm ul li dl{ background:#fff; overflow:hidden; height:50px; line-height:50px; padding:0 20px; font-size:1.08rem; color:#666;}
.ab-sm ul li dl span{ float:right;}
.ab-sm ul li dl span a{ display:inherit; color:#666; background:none;}
.ab-sm ul li dl span a:hover{ color:#d20313;}
@media screen and (max-width:800px) { 
.ab-sm{ margin-top:5%;}
.ab-sm ul li{ width:42.5%; margin:0 2.5% 5% 5%;}
.ab-sm ul li.ab-sb{ margin:0 5% 5% 2.5%;}
}
@media screen and (max-width:480px) { 
.ab-sm ul li dl{ font-size:1rem;}
}

/* Css News */
.ns-bg{ margin:75px 10% 0;}
.ns-bg h1{ font-size:2rem; font-weight:normal; text-align:center; line-height:2.5rem;}
.ns-bg h5{ font-family:"vi-logo-font-Gotham-Book"; font-size:1.08rem; font-weight:normal; color:#888; text-align:center; line-height:2.2rem;}
.ns-bg ul{ margin-top:40px;}
.ns-bg ul li{ float:left; width:30%; margin-right:5%; background-color:#f0f0f0; overflow:hidden; padding:65px 35px 0; box-sizing:border-box; -webkit-box-sizing:border-box;}
.ns-bg ul li.ns-yb{ margin-right:0;}
.ns-bg ul li h2{ font-family:"vi-logo-font-Gotham-Book"; font-size:2rem; font-weight:normal; color:#888; line-height:2rem;}
.ns-bg ul li h4{ font-family:"vi-logo-font-Gotham-Book"; font-size:1rem; font-weight:normal; color:#888; line-height:1.5rem;}
.ns-bg ul li h3{ font-size:1.25rem; font-weight:normal; color:#333; line-height:2rem; margin-top:25px;}
.ns-bg ul li p{ color:#888; margin-top:15px;}
.ns-bg ul li dl{ margin-top:45px; border-top:1px solid #d0d0d0; height:75px; line-height:50px; background:url(../Images/yj.png) no-repeat left 18px;  font-family:"vi-logo-font-Gotham-Book"; color:#888; padding-left:28px;}
.ns-bg ul li dl a{ display:block; float:right; color:#888; transition:all .2s ease-in-out; -webkit-transition:all .2s ease-in-out;}
.ns-bg ul li dl a:hover{ color:#d20313;}
@media screen and (max-width:1440px) { 
.ns-bg{ margin:75px 5% 0;}
}
@media screen and (max-width:800px) { 
.ns-bg{ margin:50px 5% 0;}
.ns-bg ul{ margin-top:0;}
.ns-bg ul li{ width:100%; margin-right:0; margin-top:35px; padding:45px 35px 0;}
.ns-bg ul li h3{ margin-top:15px;}
.ns-bg ul li dl{ margin-top:35px;}
}
@media screen and (max-width:480px) { 
.ns-bg{ margin:25px 5% 0;}
.ns-bg h1{ font-size:1.5rem; line-height:2rem;}
.ns-bg h5{ font-size:1rem; line-height:2rem;}
.ns-bg ul li{ margin-top:20px; padding:30px 20px 0;}
.ns-bg ul li h2{ font-size:1.5rem;}
.ns-bg ul li h4{ font-size:1rem;}
.ns-bg ul li h3{ font-size:1.2rem; margin-top:15px;}
.ns-bg ul li p{ margin-top:10px;}
.ns-bg ul li dl{ margin-top:25px; height:60px;}
}

/* Css Bottom */
.bt-bg{ background-color:#f0f0f0; height:140px; margin-top:100px; padding:0 10%; box-sizing:border-box; -webkit-box-sizing:border-box;}
.bt-bg ul li{ float:left; width:50%; margin-top:44px;}
.bt-bg ul li .bt-tb{ display:block; float:right; width:32px; height:32px; background-color:#000; overflow:hidden; margin-top:6px; margin-left:5px; cursor:pointer; border-radius:50%; -webkit-border-radius:50%; transition:all .2s ease-in-out; -webkit-transition:all .2s ease-in-out;}
.bt-bg ul li .bt-tb img{ width:32px; height:32px;}
.bt-bg ul li .bt-tb:hover{ background-color:#d20313;}
@media screen and (max-width:1440px) { 
.bt-bg{ padding:0 5%;}
}
@media screen and (max-width:800px) {
.bt-bg{ height:165px; margin-top:35px; padding-top:35px; font-size:.875rem; line-height:1.5rem;}
.bt-bg ul li{ width:100%; margin-top:0px; text-align:center;}
.bt-bg ul li .bt-tg{ display:block; width:185px; margin:5px auto 0px;}
}

/* Reveal Modals */	
.reveal-modal-bg{ position:fixed; height:100%; width:100%; background:#000; background:rgba(0,0,0,.8); z-index:10000; display:none; top:0; left:0;}
.reveal-modal{ visibility:hidden; position:absolute; top:50%; left:50%; width:360px; height:400px; margin-top:-200px; margin-left:-180px; z-index:100000; background-color:#fff; text-align:center; -webkit-border-radius:5px; border-radius:5px; -webkit-box-shadow:0 0 10px rgba(0,0,0,.4); box-shadow:0 0 10px rgba(0,0,0,.4);}
.reveal-modal img{ width:200px; height:200px; margin-top:50px;}
.reveal-modal h3{ font-weight:normal; color:#000; font-size:1.08rem; margin:5px 0 20px;}
.reveal-modal .close-reveal-modal{ display:block; width:110px; height:40px; line-height:40px; background-color:#000; cursor: pointer; margin:0 auto; font-size:1.2rem; color:#fff; -webkit-border-radius:5px; border-radius:5px;}
.reveal-modal .close-reveal-modal:hover{ text-decoration:none; background-color:#333;}
.reveal-moday{ top:0; left:0; width:100%; height:100%; margin-top:0; margin-left:0; background-color:#222; -webkit-border-radius:0; border-radius:0; -webkit-box-shadow:0 0 0 rgba(0,0,0,0); box-shadow:0 0 0 rgba(0,0,0,0);}
.reveal-moday form{ position:absolute; top:50%; left:0; width:80%; height:60px; margin:-30px 10% 0; box-sizing:border-box; -webkit-box-sizing:border-box;}
.reveal-moday form .ss-in{ float:left; width:85%; height:60px; border:1px solid #333; background-color:#222; padding:0 15px; font-family:Microsoft YaHei; color:#fff; box-sizing:border-box; -webkit-box-sizing:border-box;}
.reveal-moday form .ss-st{ float:left; width:15%; height:60px; border:1px solid #333; border-left:none; background-color:#252525; font-family:Microsoft YaHei; font-size:1.2rem; color:#fff; letter-spacing:5px; cursor:pointer; box-sizing:border-box; -webkit-box-sizing:border-box;}
.reveal-moday form .ss-st:hover{ border:1px solid #d20313; background-color:#d20313;}
.reveal-modal .close-reveal-moday{ position:absolute; top:0; right:0; width:50px; height:50px; line-height:50px; background:none; font-size:2rem; color:#fff; -webkit-border-radius:0; border-radius:0;}
.reveal-modal .close-reveal-moday:hover{ background:none; color:#d20313;} 
