/* #======================================================= section1 */
#section1{ padding-top: 100px; padding-bottom: 90px;}
#section1 .wrap1400{ width: 1424px; height: 1270px;}
#section1 .wrap1400 ul{ overflow: hidden;}
#section1 .wrap1400 li{ float: left; padding: 0 12px ; position: absolute;}
#section1 .wrap1400 li:nth-child(1){ top: 0; left: 0;}
#section1 .wrap1400 li:nth-child(2){ top: 0; left: 474px;}
#section1 .wrap1400 li:nth-child(3){ top: 0; right: 0;}
#section1 .wrap1400 li:nth-child(4){ top: 386px; left: 0;}
#section1 .wrap1400 li:nth-child(5){ top: 487px; left: 474px;}
#section1 .wrap1400 li:nth-child(6){ top: 386px; right: 0;}
#section1 .wrap1400 li:nth-child(7){ bottom: 0; left: 0;}
#section1 .wrap1400 li:nth-child(8){ bottom: 0; left: 474px;}
#section1 .wrap1400 li:nth-child(9){ bottom: 0; right: 0;}

#section1 .wrap1400 li a{ display: block; width: 100%; height: auto;}

#section1 .wrap1400 li a .img-wrap{ width: 100%; background-color: #061b39; box-shadow: 1px 0 4px rgba(51,51,51,.4); }
#section1 .wrap1400 li a .img-wrap .img{ width: 100%; height: 100%; opacity: 1; transition: .3s; position: relative; overflow: hidden;}
#section1 .wrap1400 li a .img-wrap .img:after{ position: absolute; content: ''; display: block; left: 0; top: -101%; width: 100%; height: 100%; background-color: #061b39; opacity: .6; transition: .5s; }
#section1 .wrap1400 li a:hover .img-wrap .img:after{ top: 0;}

#section1 .wrap1400 li:nth-child(1) a .img-wrap, #section1 .wrap1400 li:nth-child(3) a .img-wrap,
#section1 .wrap1400 li:nth-child(5) a .img-wrap, #section1 .wrap1400 li:nth-child(7) a .img-wrap,
#section1 .wrap1400 li:nth-child(8) a .img-wrap,
#section1 .wrap1400 li:nth-child(9) a .img-wrap{height: 300px;}

#section1 .wrap1400 li:nth-child(2) a .img-wrap,#section1 .wrap1400 li:nth-child(4) a .img-wrap,
#section1 .wrap1400 li:nth-child(6) a .img-wrap{ height: 400px;}

#section1 .wrap1400 li a .text-wrap{ width: 100%; padding-top: 15px; padding-bottom: 25px;}
#section1 .wrap1400 li a p{ font-size: 18px; color: #aaa; padding-bottom: 15px;}
#section1 .wrap1400 li a h3{ font-size: 20px;}

/* =================== 1024px =================== */
@media (max-width: 1024px) {
    #section1{ padding-top: 40px; padding-bottom: 50px;}
    #section1 .wrap1400{ width: 100%; padding: 0 10px; height: auto; }

    #section1 .wrap1400 li{ float: left; padding: 0 2.5px ; position: relative;}
    #section1 .wrap1400 li:nth-child(1),#section1 .wrap1400 li:nth-child(2),#section1 .wrap1400 li:nth-child(3),
    #section1 .wrap1400 li:nth-child(4),#section1 .wrap1400 li:nth-child(5),#section1 .wrap1400 li:nth-child(6),
    #section1 .wrap1400 li:nth-child(7),#section1 .wrap1400 li:nth-child(8),#section1 .wrap1400 li:nth-child(9){ top:unset; bottom: unset; right: unset; left: unset;}

    #section1 .wrap1400 li a .img-wrap{ width: 100%; background-color: #061b39; box-shadow: 1px 0 4px rgba(51,51,51,.4); height: 30.13vw!important; }

    #section1 .wrap1400 li a .text-wrap{ width: 100%; padding-top: 7.5px; padding-bottom:15px;}
    #section1 .wrap1400 li a p{ font-size: 11px; color: #aaa; padding-bottom: 5px;}
    #section1 .wrap1400 li a h3{ font-size: 12px;}

}