@charset "utf-8";
.view{width:100%; height:127px; float:left; overflow:hidden; position:relative; text-align:center; -webkit-box-shadow:1px 1px 2px #e6e6e6; -moz-box-shadow:1px 1px 2px #e6e6e6; box-shadow:1px 1px 2px #e6e6e6}
.view .content, .view .mask{width:100%; height:127px; position:absolute; overflow:hidden; top:0; left:0}
.view img{display:block; position:relative}
.view h2{font:normal 20px ralewayregular; color:#fff; text-align:left; position:absolute; z-index:50; width:100%; top:0; padding:5px 10px; opacity:1}
.view h2 span{font:normal 12px/13px Arial, Helvetica, sans-serif; color:#fff; display:block;}
.view h2.career_people{font-size:13px; font-family:Arial; padding:2px 10px!important}
.view h2.career_people span{background-position:right -107px; padding-right:15px; float:left}
.view p{font:400 24px ralewaylight; color:#0074bc; position:relative; padding:50px 30px 0; text-align:center}
.view-first img{-webkit-transition:all .4s linear; -moz-transition:all .4s linear; -o-transition:all .4s linear; -ms-transition:all .4s linear; transition:all .4s linear}
.view-first .mask{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter:alpha(opacity=0); opacity:1; -webkit-transition:all .4s ease-in-out; -moz-transition:all .4s ease-in-out; -o-transition:all .4s ease-in-out; -ms-transition:all .4s ease-in-out; transition:all .4s ease-in-out; position:absolute; z-index:0}
.view-first h2,.mask2 h2 span,.mask3 h2 span{-webkit-transition:all .4s ease-in-out; -moz-transition:all .4s ease-in-out; -o-transition:all .4s ease-in-out; -ms-transition:all .4s ease-in-out; transition:all .4s ease-in-out; transition:all .4s ease-in-out;}
/*.view-first h2{-webkit-transform:translateY(100px); -moz-transform:translateY(150px); -o-transform:translateY(150px); -ms-transform:translateY(150px); transform:translateY(150px); -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter:alpha(opacity=0); opacity:0; -webkit-transition:all .4s ease-in-out; -moz-transition:all .4s ease-in-out; -o-transition:all .4s ease-in-out; -ms-transition:all .4s ease-in-out; transition:all .4s ease-in-out}*/
.view-first:hover img{-webkit-transform:scale(1.2, 1.2); -moz-transform:scale(1.2, 1.2); -o-transform:scale(1.2, 1.2); -ms-transform:scale(1.2, 1.2); transform:scale(1.2, 1.2)}
.view-first:hover .mask{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); opacity:1}
.view-first:hover h2{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); opacity:1; -webkit-transform:translateY(0px); -moz-transform:translateY(0px); -o-transform:translateY(0px); -ms-transform:translateY(0px); transform:translateY(0px); z-index:10; font-weight:bold;}

@media only screen and (min-width:701px) and (max-width:800px){
.view, .view .mask{/*height:;*/}

}

.mask2 h2{font:normal 24px/22px ralewaybold; text-align:center; padding:0; margin-top:18%; text-shadow: 2px 2px 12px #000; height:100vh;}
.mask2 h2 span{font:normal 23px/22px ralewayregular; height:100vh;}
/*.mask2:hover h2,.mask2 h2 span:hover,.mask3:hover h2,.mask3 h2 span:hover{font-weight:normal; transform:none; font-size:26px; line-height:24px; display:block;}*/
.mask2 h2{-webkit-transition:all .4s ease-in-out; -moz-transition:all .4s ease-in-out; -o-transition:all .4s ease-in-out; -ms-transition:all .4s ease-in-out; transition:all .4s ease-in-out; transition:all .4s ease-in-out;}
.mask3 h2{font:normal 24px/22px ralewaybold; text-align:center; padding:0; margin-top:18%; text-shadow: 0px 1px 1px #9d4000; height:100vh;}
.mask3 h2 span{font:normal 23px/22px ralewayregular; height:100vh;}
.mask3 h2{-webkit-transition:all .4s ease-in-out; -moz-transition:all .4s ease-in-out; -o-transition:all .4s ease-in-out; -ms-transition:all .4s ease-in-out; transition:all .4s ease-in-out; transition:all .4s ease-in-out;}

@media only screen and (min-width:320px) and (max-width:360px){

.view img{margin-left:-30px;}
.mask2 h2,.mask2 h2{margin-top:22%;}

}

@media screen and (max-width:320px){
.view img{height:117%;}
.view h2{padding:5px;}
}


.bannerProduct li{overflow:hidden; position:relative;}
.bannerProduct li img{-webkit-transition:all .4s linear; -moz-transition:all .4s linear; -o-transition:all .4s linear; -ms-transition:all .4s linear; transition:all .4s linear; display:block; position:relative;}
.bannerProduct li:hover img{-webkit-transform:scale(1.2, 1.2); -moz-transform:scale(1.2, 1.2); -o-transform:scale(1.2, 1.2); -ms-transform:scale(1.2, 1.2); transform:scale(1.2, 1.2)}
