@charset "utf-8";
/* CSS Document */

.about1{ font-size:16px; background:url(../images/icons/ab_bg1.jpg) center no-repeat; background-size:cover; padding:0 0 100px;}
.about1 h4{ display:block; line-height:2.5; color:#0b469e; font-size:2em; overflow:hidden;}
.about1 .flex{ display:flex; flex-direction:row-reverse; align-items:center;}
.about1 .pic{ width:35.5%; overflow:hidden; flex-shrink:0; margin-left:4.75%;}
.about1 .pic img{ display:block; max-width:100%; margin:0 auto; transition:all ease 0.4s;}
.about1 .pic:hover img{ transform:scale(1.05);}
.about1 .txt{ flex:auto; line-height:2; color:#333; overflow:hidden; padding:0.3em 0;}

.about2{ padding:0 0 80px;}
.about2 ul{ display:block; font-size:16px; overflow:hidden; margin:0 -14px;}
.about2 ul li{ display:block; width:20%; float:left;}
.about2 ul li a{ display:block; background:#0047ba; overflow:hidden; position:relative; margin:0 14px; cursor:pointer;}
.about2 ul li img.pic{ display:block; width:100%; opacity:0.75; transition:all ease 0.4s;}
.about2 ul li a:hover img.pic{ transform:scale(1.12);}
.about2 ul li p{ display:block; width:100%; color:#fff; box-sizing:border-box; padding:12% 9%; position:absolute; left:0; bottom:0;}
.about2 ul li p img{ display:block; height:1.875em;}
.about2 ul li p em{ display:block; line-height:2; font-size:1.25em;}
.about2 ul li p span{ display:block; line-height:1.375;}

.about3{ background:url(../images/icons/ab_bg3.jpg) center no-repeat; background-size:cover;}
.about3 .develop{ display:block; font-size:16px; position:relative; margin:-60px 0 20px;}
.about3 .develop .swiper-container{ margin:0 5%; position:relative;}
.about3 .develop .swiper-container::after{ content:''; display:block; width:100%; height:2px; background-image:linear-gradient(to right, rgba(0,71,186,0.1), rgba(0,71,186,1), rgba(0,71,186,0.1)); position:absolute; left:0; top:50%; margin-top:-1px; z-index:1;}
.about3 .develop .swiper-wrapper{ z-index:2;}
.about3 .develop .swiper-slide{ display:block; overflow:hidden;}
.about3 .develop .swiper-slide a{ display:block; margin:18.5em 1.9em; position:relative;}
.about3 .develop .swiper-slide a::before,
.about3 .develop .swiper-slide a::after{ content:''; display:block; overflow:hidden; clear:both;}
.about3 .develop .swiper-slide a i{ display:block; width:1.75em; height:1.75em; box-sizing:border-box; background:#0047ba; background-clip:content-box; padding:0.25em; border:2px solid #0047ba; border-radius:50%; margin:1em 1.9em; position:relative;}
.about3 .develop .swiper-slide a i::after{ content:''; display:block; width:2.75em; height:2.75em; border:2px solid #0047ba; border-radius:50%; box-sizing:border-box; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); opacity:0.55;}
.about3 .develop .swiper-slide a .txt{ width:100%; overflow:hidden; position:absolute; left:0;}
.about3 .develop .swiper-slide:nth-child(odd) a .txt{ bottom:100%;}
.about3 .develop .swiper-slide:nth-child(even) a .txt{ top:100%;}
.about3 .develop .swiper-slide a .txt b{ display:block; line-height:1.5; color:#0047ba; font-size:2.25em;}
.about3 .develop .swiper-slide a .txt p{ display:block; line-height:1.875; color:#333; overflow:hidden; padding:0 0 1em;}
.about3 .develop .swiper-button-prev,
.about3 .develop .swiper-button-next{ display:block; width:44px; height:44px; background:none; border:2px solid #0047ba; border-radius:50%; top:50%; margin-top:-24px; background-size:100% auto !important; opacity:1 !important;}
.about3 .develop .swiper-button-prev{ left:0;}
.about3 .develop .swiper-button-next{ right:0;}
.about3 .develop .swiper-button-prev img,
.about3 .develop .swiper-button-next img{ width:100%;}
.about3 .develop .swiper-button-prev:hover,
.about3 .develop .swiper-button-next:hover{ background-color:#0047ba; border-color:#0047ba;}
.about3 .develop .swiper-button-prev:hover img,
.about3 .develop .swiper-button-next:hover img{ filter:brightness(0) invert(1);}

.about4{ background:url(../images/icons/ab_bg4.jpg) center no-repeat; background-size:cover; padding:0 0 80px;}
.about4 .honor{ font-size:16px; overflow:visible;}
.about4 .honor .swiper-container{ padding:0 10px 80px;}
.about4 .honor .swiper-slide{ position:relative; cursor:pointer; pointer-events:auto;}
.about4 .honor .swiper-slide a{ display:block; overflow:hidden; background:#fff; padding:14px; position:relative; box-shadow:0 0 9px 1px rgba(206,206,206,0.4); margin:10px 0;}
.about4 .honor .swiper-slide a img{ display:block; width:100%; transition:all ease 0.4s;}
.about4 .honor .swiper-pagination{ display:block; height:12px; left:50%; bottom:0; transform:translate(-50%,0);}
.about4 .honor .swiper-pagination-bullet{ vertical-align:top; width:12px; height:12px; background:#0047ba; border-radius:50%; margin:0 7px !important; opacity:0.6;}
.about4 .honor .swiper-pagination-bullet-active{ opacity:1;}
.about4 .honor .swiper-button-prev,
.about4 .honor .swiper-button-next{ display:none; width:66px; height:66px; border:1px dashed #6eb92b; border-radius:50%; margin-top:0; background-size:contain !important; top:auto; bottom:0;}
.about4 .honor .swiper-button-prev{ background:url(../images/icons/prev31.png) center no-repeat; left:50%; margin-left:-120px;}
.about4 .honor .swiper-button-next{ background:url(../images/icons/next31.png) center no-repeat; right:50%; margin-right:-120px;}
.about4 .honor .swiper-button-prev:hover,
.about4 .honor .swiper-button-next:hover{ border-style:solid; border-color:#6eb92b; background-color:#6eb92b;}
.about4 .honor .swiper-button-prev:hover{ background-image:url(../images/icons/prev3_h.png);}
.about4 .honor .swiper-button-next:hover{ background-image:url(../images/icons/next3_h.png);}

.shadow{ width:100%; height:100%; background:rgba(0,0,0,0.6); position:fixed; left:0; top:0; z-index:9998; opacity:0; visibility:hidden; transition:all ease 0.2s;}
.shadow.show{ opacity:1; visibility:visible;}
.picShow{ position:fixed; left:50vw; top:50%; top:0; transform:translate(-50%,0); z-index:9999; opacity:0; visibility:hidden;}
.picShow.show{ opacity:1; visibility:visible;}
.picShow .pic{ display:flex; justify-content:center; align-items:center; width:80vw; height:80vh; height/:750px; max-height/:82vh; width:90vw; height:100vh; background-size:contain !important; background-position:center; background-repeat:no-repeat; transform:scale(0.8); opacity:0; transition:all ease 0.4s;}
.picShow .pic img{ display:block; max-width:96%; max-height:96%;}
.picShow.show .pic{ transform:scale(1); opacity:1;}
.picShow a.close{ width:24px; height:24px; background:url(../images/common/close.png) center no-repeat; background-size:contain; position:absolute; left:100%; bottom/:100%; top:2%; z-index:9; cursor:pointer;}


@media only screen and (max-width:1440px){

.about1 h4{ font-size:1.5em;}
.about1 .flex{ display:block;}
.about1 .pic{ float:right; margin:0 0 0.5% 3%; width:46%;}
.about1 .txt{ overflow:visible;}

.about2 ul{ font-size:15px; margin:0 -10px;}
.about2 ul li a{ margin:0 10px;}
.about2 ul li p img{ height:2em;}
.about2 ul li p em{ line-height:2.5;}
.about2 ul li p span{ line-height:1.5;}

.about3 .develop{ font-size:15px;}


}

@media only screen and (max-width:768px){

.about1{ font-size:14px; padding:0 0 40px;}
.about1 h4{ font-size:1.375em; margin-top:-0.75em;}
.about1 .pic{ width:auto; float:none; margin:0.375em 0 0.75em;}
.about1 .pic img{ width:100%; height:160px; object-fit:cover;}

.about2{ padding:0 0 40px;}
.about2 ul{ font-size:12px;}
.about2 ul li{ width:100%; padding:0 0 12px;}
.about2 ul li img.pic{ height:150px; object-fit:cover;}
.about2 ul li p{ padding:7% 5%;}
.about2 ul li p img{ height:30px;}

.about3 .develop{ font-size:13px; margin:-130px 0 40px;}
.about3 .develop .swiper-container{ margin:0 40px;}
.about3 .develop .swiper-slide a{ margin:11em 0.5em;}
.about3 .develop .swiper-slide a i{ width:18px; height:18px; border-width:1px; margin:0.5em 1.6em;}
.about3 .develop .swiper-slide a i::after{ display:none;}
.about3 .develop .swiper-slide a .txt b{ line-height:2; font-size:1.875em;}
.about3 .develop .swiper-slide a .txt p{ padding:0;}
.about3 .develop .swiper-slide:nth-child(odd) a .txt{ bottom:auto; top:100%;}
.about3 .develop .swiper-button-prev,
.about3 .develop .swiper-button-next{ width:26px; height:26px; border-width:1px; margin-top:-14px;}

.about4{ padding:0 0 40px;}
.about4 .honor{ font-size:14px; margin:-10px -75% 0;}
.about4 .honor .swiper-container{ padding-bottom:40px;}
.about4 .honor .swiper-slide a{ padding:4px;}
.about4 .honor .swiper-pagination{ height:8px;}
.about4 .honor .swiper-pagination-bullet{ width:8px; height:8px; margin:0 4px !important;}

.picShow .pic{ width:95vw;}
.picShow a.close{ left:auto; right:0;}







}












/**/