﻿@charset "utf-8";
/* CSS Document */
#banner { position: relative; }
#banner .slides .Item { position: relative; }
#banner .slides .Item .box { position: absolute; top: 50%; margin-top: -114px; left: 0; width: 100%; }
#banner .slides .Item .Intro h2 { font-size: 38px; color: #fff; line-height: 60px; margin-top: 20%; opacity: 0; filter: alpha(opacity=0); transition: all 1s; }
#banner .slides .Item .Intro p { font-size: 20px; color: #fff; line-height: 30px; margin-top: 20%; opacity: 0; filter: alpha(opacity=0); transition: all 1.2s; }
#banner .slides .Item .Intro .More { margin-top: 6%; display: block; font-size: 14px; line-height: 30px; color: #fff; display: inline-block; border-bottom: 1px solid #fff; margin-top: 20%; opacity: 0; filter: alpha(opacity=0); transition: all 1.5s; }
#banner .slides .Item .Intro .More .sjr { display: inline-block; margin-left: 10px; width: 0; height: 0; border-top: 5px solid transparent; border-left: 7px solid #fff; border-bottom: 5px solid transparent; }
#banner .banbtn { position: absolute; bottom: 0; left: 0; width: 100%; z-index: 98; background-image: url('../images/black.png'); }
#banner .slides .flex-active-slide .Item .box .Intro h2 { opacity: 1; filter: alpha(opacity=100); margin-top: 0; transition-delay: 0.8s; }
#banner .slides .flex-active-slide .Item .Intro p { opacity: 1; filter: alpha(opacity=100); margin-top: 0; transition-delay: 1s; }
#banner .slides .flex-active-slide .Item .Intro .More { opacity: 1; filter: alpha(opacity=100); margin-top: 6%; transition-delay: 1.2s; }
.notice { height: 50px; overflow: hidden; position: relative; }
.notice .name { font-size: 14px; color: #fff; line-height: 50px; position: absolute; left: 0; top: 0; }
.notice .name .iconfont { font-size: 18px; margin-right: 10px; line-height: 49px; }
.notice .main { width: 100%; padding-left: 100px; }
.notice .main h3 { font-size: 14px; color: #fff; line-height: 50px; font-weight: 500; height: 50px; overflow: hidden; }
.notice .main a:hover h3 { }

.conten { padding-top: 30px; }
.conten .section .Title { position: relative; margin-bottom: 25px; }
.conten .section .Title h3 { position: relative; height: 18px; padding-left: 15px; line-height: 18px; }
.conten .section .Title h3 .line { background: #00349a; position: absolute; left: 0; top: 2px; width: 5px; height: 18px; display: block; }
.conten .section .Title h3 .cn { font-size: 18px; color: #00349a; line-height: 20px; display: inline-block; }
.conten .section .Title .More { position: absolute; right: 0; top: 0; font-size: 14px; color: #666666; line-height: 20px; }
.conten .section .Title .More .Icon-more { font-size: 10px; color: #fff; font-family: "宋体"; background: #b5b5b5; border-radius: 50%; display: inline-block; width: 15px; height: 15px; line-height: 15px; text-align: center; margin-left: 5px; }
.conten .section .Title .More:hover { color: #00349a; }
.conten .section .Title .More:hover .Icon-more { background: #113f8d; }

#Case { margin-bottom: 40px; }
#Case .main { margin: 0 -13px; }
.Prolist .owl { }
.Prolist .Item { margin: 0 13px; position: relative; }
.Prolist .Item .pic { overflow: hidden; }
.Prolist .Item .pic img { width: 100%; transition: all 0.3s linear; -moz-transition: all 0.3s linear; -webkit-transition: all 0.3s linear; }
.Prolist .Item .Intro { background-image: url('../images/black.png'); position: absolute; left: 0; width: 100%; bottom: 0; padding: 10px 15px; transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; }
.Prolist .Item .Intro h3 { font-size: 14px; color: #fff; line-height: 24px; font-weight: 500; }
.Prolist .Item:hover .pic img { transform: scale(1.1); -webkit-transform: scale(1.2); -moz-transform: scale(1.2); }
.Prolist .Item:hover .Intro { padding: 20px 15px; }
.Prolist .owl-controls .owl-buttons div { position: absolute; top: 50%; width: 30px; height: 50px; margin-top: -25px; font-size: 0 !important; border-radius: 0 !important; }
.Prolist .owl-controls .owl-buttons .owl-prev { left: -60px; background: url('../images/icon_left01.png') no-repeat center center; }
.Prolist .owl-controls .owl-buttons .owl-next { right: -60px; background: url('../images/icon_right01.png') no-repeat center center; }

.Threebox .Box { float: left; }
#News { width: 38%; padding-right: 35px; }
#News .Title h3 .cn { color: #666; margin-right: 15px; cursor: pointer; }
#News .Title h3 .cn.cur { color: #00349a; }
#News .main .Item { padding: 10px 0; border-bottom: 1px dashed #e5e5e5; }
#News .main .Item a { overflow: hidden; display: block; }
#News .main .Item:last-child { border-bottom: 0; }
#News .main .pic { float: left; width: 30%; overflow: hidden; height: 77px; }
#News .main .pic img { width: 100%; transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; }
#News .main .Intro { float: right; width: 66%; }
#News .main .Intro h3 { font-size: 14px; color: #033333; line-height: 26px; font-weight: 500; height: 52px; overflow: hidden; }
#News .main .Intro .date { font-size: 14px; color: #999; line-height: 26px; }
#News .main .Item:hover .pic img { transform: scale(1.1); -webkit-transform: scale(1.2); -moz-transform: scale(1.2); }
#News .main .Item:hover h3 { color: #113f8d; }
#Tech { width: 39%; padding-right: 25px; margin-bottom: 40px; }
#Tech .main { background: #f7f7f7; padding: 10px 20px; }
#Tech .main li a { border-bottom: 1px dashed #e5e5e5; padding: 10px 0; display: block; padding-left: 10px; position: relative; padding-right: 20px; }
#Tech .main li:last-child a { border-bottom: 0; }
#Tech .main li h3 { font-size: 14px; color: #333; line-height: 35px; height: 35px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; font-weight: 500; }
#Tech .main li .dit { position: absolute; width: 5px; height: 5px; border-radius: 50%; background: #113f8d; left: 0; top: 50%; margin-top: -2px; }
#Tech .main li .IconR { background: url('../images/icon/parrow.png') no-repeat -28px 0; width: 10px; height: 12px; position: absolute; display: block; right: 0; top: 50%; margin-top: -12px; }
#Tech .main li:hover h3 { color: #00349a; }
#Tech .main li:hover .IconR { background-position: -40px 0; }
#Recru { width: 23%; }
#Recru .main .Item { position: relative; }
#Recru .main .Item .pic { overflow: hidden; }
#Recru .main .Item .pic img { width: 100%; }
#Recru .main .Item h3 { position: absolute; left: 0; bottom: 0; width: 100%; background-image: url('../images/black.png'); font-size: 14px; color: #fff; line-height: 50px; text-align: center; font-weight: 500; }
#Product { background: #fafafa; padding: 20px 0; }
#Product li { float: left; width: 20%; text-align: center; }
#Product .pic { position: relative; width: 100px; height: 100px; border-radius: 50%; overflow: hidden; position: relative; background: #fefefe; box-shadow: 0 0 3px 3px #eee; margin: 0 auto; }
#Product .pic img { position: absolute; left: 0; bottom: 0; width: 100%; transition: transform 0.3s linear; -webkit-transition: transform 0.3s linear; -moz-transition: transform 0.3s linear; }
#Product li h3 { font-size: 14px; color: #000000; line-height: 40px; text-align: center; font-weight: 500; }
#Product li:hover h3 { color: #113f8d; }
#Product li:hover .pic img { bottom: -100px; transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); }




@media (min-width: 1200px) {
}

@media (min-width: 1024px) {
}

@media (min-width: 768px) {
}

@media (max-width: 1200px) {
}

@media (max-width: 1025px) {
    #banner .slides .Item .box { margin-top: -90px; }
    #banner .slides .Item .Intro h2 { font-size: 20px; line-height: 40px; }
    #banner .slides .Item .Intro p { font-size: 16px; line-height: 25px; }
    #banner .slides .flex-active-slide .Item .Intro .More { margin-top: 2%; }

    .conten { padding-top: 15px; }
    .conten .section .Title { margin-bottom: 20px; }
    #Case { margin-bottom: 20px; }
    #Case .main { margin: 0 -5px; }
    .Prolist .Item { margin: 0 5px; }
    #News { padding-right: 10px; }
    #Tech { padding-right: 10px; }
}

@media (max-width: 768px) {
    #News { width: 100%; float: none; margin-bottom: 20px; }
    #Tech { width: 55%; }
    #Recru { width: 45%; }

    #Product .pic { width: 80px; height: 80px; }
    #Product li:hover .pic img { bottom: -80px; }
}

@media (max-width: 640px) {
    #banner .banbtn { position: relative; background: #201f1f; }

    #banner .slides .Item .box { margin-top: -61px; }
    #banner .slides .Item .Intro h2 { font-size: 16px; }
    #banner .slides .Item .Intro p { font-size: 12px; line-height: 20px; }
    #banner .slides .Item .Intro .More { font-size: 12px; line-height: 30px; }
}

@media (max-width: 520px) {
    .Threebox .Box { float: none; }
    #Tech { width: 100%; padding: 0; margin-bottom: 20px; }
    #Recru { width: 100%; }
    #Product li { width: 33.33%; text-align: center; }
    #Product li:first-child { width: 50%; }
    #Product li:nth-child(2) { width: 50%; }
}

@media (max-width: 420px) {
    .conten .section .Title .More { font-size: 12px; }
    #Tech .main { padding: 5px 10px; }
    #Tech .main li h3 { font-size: 12px; }
    #News .main .Intro h3 { font-size: 12px; line-height: 20px; height: 40px; }
    #News .main .Intro .date { font-size: 12px; line-height: 20px; }
}
