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


/* index3 */
.index3{ width:100%; max-width:1600px; margin:0 auto; padding:50px 0;}
.i3tl,.i3tr{float: left;position: relative;height: 400px;}

.i3tl{width:25%;background:#f6f6f6;background-size: cover;}
.i3tl .txt{text-align:center;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}
.i3tl .txt i{display:block;width:86px;height:42px;margin:0 auto;margin-bottom:20px}
.i3tl .txt h2{font-size:34px;color:#333;font-family:fantasy;line-height:1}
.i3tl .txt h3{font-size:30px;color:#333;line-height:60px;position:relative}
.i3tl .txt h3:after{content:'';width:30px;height:2px;background:#00a0ea;position:absolute;bottom:0;left:50%;margin-left:-15px}
.i3tl .txt a{font-size:12px;display:block;margin-top:40px;padding-top:30px;color:#102a51;background:url(../images/btn1.png) no-repeat top center;background-size:13px 15px}
.i3tl .txt a:hover{color:#00a0ea}

.i3tr{width: 75% }
.i3tr .images>div{display: none;width: 100%;height: 400px;}

.anav{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:70%}
.anav a{margin-bottom: 20px;display:block;float:left;width:44%;height:16%;text-align:center;line-height:50px;font-size:18px;color:#fff;position:relative;z-index:9;margin-left:20px; border:1px solid #fff; border-radius:30px; font-weight:bold;}
.anav a:hover{background:#00a0ea; color:#fff; transition: all .5s ease;}
.anav a:nth-of-type(2):hover{background:#C60001;}

.i3b li{float: left;width: 25%;position: relative;z-index: auto;}
.i3b li img{ max-width:100%;}
.i3b li:nth-child(1):before,
.i3b li:nth-child(3):before{position: absolute; z-index: 10; top: 50%; right: 0; margin-top: -34.5px; content: ''; opacity: 0; filter: alpha(opacity=0); border: 69px solid; border-color: transparent transparent transparent #00a0ea; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease;}
.i3b li:nth-child(3):before{border-color: transparent transparent transparent #BF0200;}

.i3b li:nth-child(1):hover:before,
.i3b li:nth-child(3):hover:before{opacity: 1; filter: alpha(opacity=100); right: -138px;}

.i3b li .txt1{width:100%;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);transform:translate(-50%,-50%);text-align:center}
.i3b li .txt1 i{display:block;width:18.958%;height:37.916%;margin:0 auto;margin-bottom:20px}
.i3b li .txt1 i img{display:block;margin:0 auto}
.i3b li .txt1 h3{font-size:26px;color:#fff;line-height:38px}
.i3b li .txt1 h4{font-size:16px;color:#fff;line-height:30px;text-transform:uppercase;padding-bottom:23px;position:relative}
.i3b li .txt1 h4:after{content:'';width:30px;height:2px;background:#fff;position:absolute;bottom:0;left:50%;margin-left:-15px}
.i3b li .txt1 a{font-size:12px;display:block;margin-top:20px;padding-top:30px;color:#fff;background:url(../images/btn2.png) no-repeat top center;background-size:13px 15px}
.i3b li .txt1 a:hover{color:#000}


.i3b li:nth-child(1):hover + li:nth-child(2) img{-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-ms-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2) }
.i3b li:nth-child(3):hover + li:nth-child(4) img{-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-ms-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2) }

.img{overflow:hidden;position: relative;max-width: 100%}
.img img{width:100%;max-width: 100%;cursor:pointer;-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-ms-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease}
.img img:hover{-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-ms-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2)}


/*Side*/
.side{position:fixed;width:54px;height:275px;right:0;top:275px;z-index:10000;}
.side ul li{width:54px;height:54px;float:left;position:relative;margin-bottom:2px;}
.side ul li .wx{width:220px;position:absolute; bottom:54px;right:0; display:none;}
.side ul li a:hover .wx{display:block;}
.side ul li .wx img{width:100%; display:block;}
.side ul li .sidebox{position:absolute;width:54px;height:54px;top:0;right:0;background:rgba(0,0,0,.3); color:#fff; line-height:54px; font-size:14px;overflow:hidden; border-radius:5px 0 0 5px;}
.side ul li .sidetop{width:54px;height:54px;line-height:54px;display:inline-block;background:rgba(0,0,0,.3); border-radius:5px 0 0 5px;}
.side ul li .sidetop:hover{background:#ee1d23;opacity:1;filter:Alpha(opacity=100);}
.side ul li img{float:left;}

@media (max-width: 1437px){
.i3tl, .i3tr {
    float: none;
    width: 100%;
}
}

@media (max-width: 980px){
.side{display:none;}
#hd .logo img{width:90%;}
.anav{width:100%}
.index3{ padding: 0;}
.i3tl, .i3tr{ height:350px; }
.i1l, .i1r {float: none; width: 100%; }
    .i1l a.titles{font-size: 14px;right: 15px;top:15px;}
    
    .i3b li{width: 50%;}
    .i3b li:nth-child(1):hover:before, 
    .i3b li:nth-child(3):hover:before{display: none}

}

@media (max-width: 480px){
.side{display:none;}
#hd .logo img{width:90%;}
.i1tl, .i1tr {float: none; width: 100%;}
    .iconb .txt{bottom: 10px;width: 80%;}
    .iconb .txt h5,
    .iconb .txt a{line-height: 20px;}
.i3b li{width: 100%;float: none;}

.anav{ width:100%;}
.anav a {height: 40px; line-height: 40px; margin-bottom: 10px; width:40%; font-size:15px; }
}