/* Page Public */
.page-flash{ position:fixed; top:0; left:0; width:35%; height:100%; background:#f08300; z-index:10; background-repeat:no-repeat; background-position:center; background-size:cover;}
.page-content,.page-bottom{ padding-left:40%; padding-right:5%;}
.page-right{ padding:45px 0 75px;}
.page-here{ color:#888;}
.page-here span{ color:#009944;}
.page-public{ padding-top:65px;}
.page-name{ font-size:24px; color:#009944;}
.page-img{ width:100%;}
@media screen and (max-width:1440px){ 
.page-right{ padding:35px 0 65px;}
.page-public{ padding-top:50px;}
}
@media screen and (max-width:800px){ 
.page-flash{ display:none;}
.page-content{ padding-top:75px; padding-left:3.5%; padding-right:3.5%;}
.page-bottom{ padding:0;}
.page-right{ padding:0 0 35px;}
.page-public{ padding-top:35px;}
.page-name{ font-size:20px;}
}
@media screen and (max-width:480px){ 
.page-public{ padding-top:25px;}
}

/* Page About */
.about-list{ margin-top:45px;}
.about-list ul li{ float:left; width:22.75%; height:330px; margin-right:3%;}
.about-list ul li:nth-of-type(4){ margin-right:0;}
.about-list ul li a{ display:block; width:100%; height:100%; background-color:#f5f5f5; padding-top:50px;}
.about-list ul li a div{ width:100px; height:100px; margin:auto; background-color:#009944; border-radius:50%; -webkit-border-radius:50%; background-repeat:no-repeat; background-position:center; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
.about-list ul li a div.wy01{ background-image:url(../Images/wy01.png);}
.about-list ul li a div.wy02{ background-image:url(../Images/wy02.png);}
.about-list ul li a div.wy03{ background-image:url(../Images/wy03.png);}
.about-list ul li a div.wy04{ background-image:url(../Images/wy04.png);}
.about-list ul li a h3{ text-align:center; font-size:18px; font-weight:normal; color:#333; margin-top:28px; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
.about-list ul li a p{ color:#888; margin:12px 17% 0; line-height:24px; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
.about-list ul li a:hover{ background-color:#009944;}
.about-list ul li a:hover div{ background-color:#fff;}
.about-list ul li a:hover div.wy01{ background-image:url(../Images/wy1.png);}
.about-list ul li a:hover div.wy02{ background-image:url(../Images/wy2.png);}
.about-list ul li a:hover div.wy03{ background-image:url(../Images/wy3.png);}
.about-list ul li a:hover div.wy04{ background-image:url(../Images/wy4.png);}
.about-list ul li a:hover h3{ color:#fff;}
.about-list ul li a:hover p{ color:#fff;}
@media screen and (max-width:1440px){ 
.about-list ul li a{ padding-top:45px;}
.about-list ul li a div{ width:88px; height:88px;}
.about-list ul li a h3{ margin-top:23px;}
.about-list ul li a p{ margin:7px 15% 0;}
}
@media screen and (max-width:1024px){ 
.about-list{ margin-top:25px;}
.about-list ul li{ width:48.5%; height:300px; margin-right:3%; margin-top:3%;}
.about-list ul li:nth-of-type(2){ margin-right:0;}
.about-list ul li a p{ margin:7px 20% 0;}
}
@media screen and (max-width:800px){ 
.about-list{ margin-top:15px;}
}
@media screen and (max-width:480px){ 
.about-list ul li{ height:255px;}
.about-list ul li a{ padding-top:40px;}
.about-list ul li a div{ width:60px; height:60px; background-size:25px 25px;}
.about-list ul li a h3{ font-size:16px; margin-top:18px;}
.about-list ul li a p{ margin:7px 10% 0;}
}
@media screen and (max-width:320px){ 
.about-list ul li a{ padding-top:30px;}
}

/* Page Culture */
.gs-lb{ height:378px; margin-bottom:65px;}
.gs-lb:nth-of-type(2){ margin-bottom:0;}
.gs-lb a{ display:block; width:100%; height:100%; background-color:#f5f5f5;}
.gs-lb a dl{ float:left; width:50%; height:100%; overflow:hidden;}
.gs-lb a dl p{ width:100%; height:100%; background-repeat:no-repeat; background-position:center; background-size:cover; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
.gs-lb a div{ float:left; width:50%; height:100%; padding:8% 5% 0;}
.gs-lb a div span{ display:block; font-size:24px; color:#009944; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
.gs-lb a div p{ line-height:28px; color:#666; margin-top:25px; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
.gs-lb a:hover{ background-color:#5aa572;}
.gs-lb a:hover dl p{ -transform:scale(1.08,1.08); -webkit-transform:scale(1.08,1.08);}
.gs-lb a:hover div span{ color:#fff;}
.gs-lb a:hover div p{ color:#fff;}
@media screen and (max-width:1440px){ 
.gs-lb{ height:280px; margin-bottom:50px;}
.gs-lb a div{ padding:5% 5% 0;}
.gs-lb a div p{ line-height:24px; margin-top:15px;}
}
@media screen and (max-width:1280px){ 
.gs-lb a div{ padding:3% 4% 0;}
}
@media screen and (max-width:1024px){
.gs-lb{ height:auto;}
.gs-lb a dl{ width:100%; height:400px;}
.gs-lb a div{ width:100%; padding:5%;}
}
@media screen and (max-width:800px){
.gs-lb a dl{ height:520px;}
}
@media screen and (max-width:640px){
.gs-lb a dl{ height:400px;}
}
@media screen and (max-width:480px){
.gs-lb{ margin-bottom:25px;}
.gs-lb a dl{ height:320px;}
.gs-lb a div span{ font-size:18px;}
.gs-lb a div p{ margin-top:10px;}
}
@media screen and (max-width:414px){
.gs-lb a dl{ height:275px;}
}
@media screen and (max-width:375px){
.gs-lb a dl{ height:250px;}
}
@media screen and (max-width:375px){
.gs-lb a dl{ height:215px;}
}

/* Page Contact */
.lx-lb{ line-height:30px;}
.lx-lb strong{ display:block; font-size:23px; color:#009944; margin-bottom:15px;}
.lx-lb span{ font-family:Arial;}
.lx-lb font{ font-family:"vi-logo-font-Gotham-Book";}
.lx-ig{ margin-bottom:25px;}
.lx-ig ul li{ float:left; width:120px; text-align:center; font-size:16px; color:#000; margin-right:25px;}
.lx-ig ul li img{ width:100%; margin-bottom:10px;}
.lx-mb{ display:none; margin-top:25px;}
.lx-mb ul li{ float:left; width:100%; font-size:16px; color:#000; margin-bottom:25px;}
.lx-mb ul li img{ width:140px; margin-bottom:10px;}
@media screen and (max-width:480px){
.lx-lb{ line-height:24px;}
.lx-ig{ display:none;}
.lx-mb{ display:block;}
}

/* Page News */
.ns-lb li{ float:left; width:48.5%; margin-right:3%; margin-bottom:3%; overflow:hidden;}
.ns-lb li:nth-of-type(2n){ margin-right:0;}
.ns-lb li a{ display:block; width:100%; border:1px solid #e5e5e5; border-bottom:3px solid #e5e5e5; background-color:#fff; padding:25px;}
.ns-lb li a h2{ font-family:"vi-logo-font-Gotham-Book"; font-size:24px; font-weight:normal; color:#888;}
.ns-lb li a h4{ font-family:"vi-logo-font-Gotham-Book"; font-size:14px; font-weight:normal; color:#888;}
.ns-lb li a h3{ font-size:16px; font-weight:normal; color:#333; margin-top:10px; overflow:hidden;}
.ns-lb li a p{ color:#888; margin-top:10px; line-height:20px;}
.ns-lb li a:hover{ border:1px solid #009944; border-bottom:3px solid #009944; background-color:#009944; color:#fff}
.ns-lb li a:hover h2, .ns-lb li a:hover h4, .ns-lb li a:hover h3, .ns-lb li a:hover p{ color:#fff;}
@media screen and (max-width:1024px) { 
.ns-lb li{ width:100%; margin-right:0; margin-bottom:5%;}
.ns-lb li a{ padding:20px;}
.ns-lb li a h3{ font-size:15px; margin-top:5px;}
.ns-lb li a p{ margin-top:5px;}
}

.ns-nm{ font-size:30px; color:#333; text-align:center;}
.ns-in{ color:#888; margin-top:10px; text-align:center;}
.ns-in span{ margin:0 5px;}
.ns-in font{ font-family:"vi-logo-font-Gotham-Book";}
.ns-js{ margin-top:35px; line-height:24px;}
.ns-js img{ max-width:750px;}
.ns-nt{ margin-top:35px;}
.ns-nt a{ display:block; margin-top:10px; color:#888;}
.ns-nt a:hover{ color:#009944;}
@media screen and (max-width:480px){ 
.ns-nm{ font-size:18px;}
.ns-in{ margin-top:5px;}
.ns-js{ margin-top:20px;}
.ns-nt{ margin-top:20px;}
}

/* Page Producs */
.pro-search{ background:url(../Images/product.jpg) no-repeat center; width:100%; height:320px; position:relative;}
.pro-search form{ position:absolute; top:50%; left:0; width:60%; height:56px; margin:-28px 20% 0;}
.pro-search form .ss-in{ float:left; width:80%; height:56px; background-color:#fff; padding:0 25px; font-family:Microsoft YaHei; font-size:15px; color:#b5b5b5; border:none;}
.pro-search form .ss-st{ float:left; width:20%; height:56px; line-height:50px; font-family:Microsoft YaHei; font-size:24px; color:#fff; cursor:pointer; border:none; background-color:#f08300; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
.pro-search form .ss-st:hover{ background-color:#009944;}
@media screen and (max-width:640px) { 
.pro-search{ height:200px;}
.pro-search form{ width:80%; height:50px; margin:-25px 10% 0;}
.pro-search form .ss-in{ height:50px; padding:0 15px; font-size:14px;}
.pro-search form .ss-st{ height:50px; line-height:48px; font-size:20px;}
}
@media screen and (max-width:480px) { 
.pro-search{ height:150px;}
.pro-search form{ height:40px; margin:-20px 10% 0;}
.pro-search form .ss-in{ height:40px;}
.pro-search form .ss-st{ height:40px; line-height:38px; font-size:18px;}
}

.pro-class{ background-color:#f5f5f5; padding:35px 5%;}
.pro-class a{ float:left; margin-right:75px; font-size:15px; line-height:30px;}
.pro-class a.g{ font-weight:bold; color:#009944;}
.pro-class a span{ display:inline-block; width:12px; height:12px; border:2px solid #f08300; margin-right:10px; border-radius:50%; -webkit-border-radius:50%; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
.pro-class a:hover span, .pro-class a.g span{ border:2px solid #009944;}
@media screen and (max-width:640px) { 
.pro-class{ padding:25px 3.5%;}
.pro-class a{ margin-right:50px; font-size:14px; line-height:28px;}
}
@media screen and (max-width:480px) { 
.pro-class a{ margin-right:35px;}
}

.pro-list{ padding:65px 5% 75px;}
.pro-list ul li{ float:left; width:23.5%; margin-right:2%; margin-bottom:2%;}
.pro-list ul li:nth-of-type(4n){ margin-right:0;}
.pro-list ul li a{ display:block; width:100%; background-color:#f5f5f5; padding:20px; position:relative;}
.pro-list ul li a img{ width:100%;}
.pro-list ul li a dl{ padding-top:15px; font-family:"vi-logo-font-Gotham-Book"; font-size:15px; text-align:center;}
.pro-list ul li a p{ margin-top:10px; line-height:20px; font-family:Arial,"Microsoft YaHei"; color:#888;}
.pro-list ul li a:hover{ background-color:#009944;}
.pro-list ul li a:hover dl, .pro-list ul li a:hover p{ color:#fff;}
.pro-list ul li a span{ position:absolute; left:35px; top:35px; display:block; width:8%;}
.pro-list ul li a span img{ width:100%;}
@media screen and (max-width:1440px) { 
.pro-list{ padding:60px 5% 75px;}
.pro-list ul li a{ padding:15px;}
.pro-list ul li a span{ left:25px; top:25px;}
}
@media screen and (max-width:1280px) { 
.pro-list ul li{ width:31.2%; margin-right:3.2%; margin-bottom:3.2%;}
.pro-list ul li:nth-of-type(4n){ margin-right:3.2%;}
.pro-list ul li:nth-of-type(3n){ margin-right:0;}
}
@media screen and (max-width:800px) { 
.pro-list{ padding:55px 3.5% 65px;}
}
@media screen and (max-width:640px) { 
.pro-list{ padding:45px 3.5% 55px;}
.pro-list ul li{ width:48.5%; margin-right:3%; margin-bottom:3%;}
.pro-list ul li:nth-of-type(4n){ margin-right:3%;}
.pro-list ul li:nth-of-type(3n){ margin-right:3%;}
.pro-list ul li:nth-of-type(2n){ margin-right:0;}
}
@media screen and (max-width:480px) { 
.pro-list{ padding:25px 3.5% 35px;}
.pro-list ul li a{ padding:10px;}
.pro-list ul li a dl{ padding-top:10px; font-size:14px;}
.pro-list ul li a p{ margin-top:2px; line-height:18px; font-size:12px;}
.pro-list ul li a span{ left:20px; top:20px;}
}

.pro-view dl{ max-width:650px; margin:auto; position:relative;}
.pro-view dl img{ width:100%;}
.pro-view dl span{ position:absolute; left:25px; top:25px; display:block; width:6%;}
.pro-right{ max-width:650px; margin:50px auto 0;}
.pro-right span{ display:block; font-family:Arial; font-weight:bold; font-size:30px; color:#009944;}
.pro-right strong{ font-family:Arial; font-size:30px; color:#009944; line-height:48px;}
.pro-right p{ margin-top:20px; font-family:Arial,"Microsoft YaHei";}
.pro-right a{ display:block; float:left; padding:5px 10px; border:1px solid #e5e5e5; margin-top:25px; margin-right:10px; color:#888;}
.pro-right a:hover{ border:1px solid #009944; background-color:#009944; color:#fff;}
@media screen and (max-width:480px) { 
.pro-view dl span{ left:15px; top:15px;}
.pro-right{ margin:35px auto 0;}
.pro-right span{ font-size:24px;}
.pro-right strong{ font-size:24px;}
.pro-right p{ margin-top:15px;}
}


/* Page Next */
.next a{ display:block; float:left; padding:8px 20px; border:1px solid #e5e5e5; margin-top:15px; margin-right:5px; font-family:"vi-logo-font-Gotham-Book"; color:#888; cursor:pointer;}
.next a:hover{ border:1px solid #009944; background-color:#009944; color:#fff;}
.next a.hover{ border:1px solid #009944; color:#009944; font-weight:bold; font-size:18px;}
.next a.hover:hover{ color:#fff;}
.next a span{ font-family:"Microsoft YaHei";}
.next a.jt{ font-family:"SimSun", "NSimSun", "FangSong";}
@media screen and (max-width:1024px) { 
.next a{ padding:5px 15px; margin-top:10px;}
}
@media screen and (max-width:640px) { 
.next a{ padding:3px 12px;}
}