
/*_pc*/
@media all and (min-width:1025px) {	
    
    /*msec1*/
    .msec1 .swiper-slide{display:flex;align-items:center;height:100vh;overflow:hidden}
    .msec1 .swiper-slide .bg{position:absolute;left:0;right:0;top:0;bottom:0;transform:scale(1.1);transition:10s}
    .msec1 .swiper-slide .bg:after{content:'';position:absolute;left:0;right:0;top:0;bottom:0;background:rgba(0,0,0,0.4)}
    .msec1 .swiper-slide-active .bg{transform: scale(1)}
    .msec1 .swiper-slide-active .slogan .tit,
    .msec1 .swiper-slide-active .slogan .desc,
    .msec1 .swiper-slide-active .slogan .more{opacity:1;transform:translateY(0)}
    .msec1 .slogan{color:#fff;width:100%;padding-top:100px}
    .msec1 .slogan .tit{font-size:50px;font-weight:600;opacity:0;transform:translateY(20px);transition:0.5s 0.3s}
    .msec1 .slogan .desc{font-size:26px;font-weight:300;margin:50px 0;opacity:0;transform:translateY(20px);transition:0.5s 0.6s}
    .msec1 .slogan .more{margin-top:150px;opacity:0;transform:translateY(20px);transition:0.5s 0.9s}
    .msec1 .slogan .more a{display:flex;gap:5px;align-items:center;font-size:18px;font-weight:600;color:#fff;transition:0.3s}
    .msec1 .slogan .more a:after{content:'';display:inline-block;width:6px;height:6px;border:2px solid #fff;border-width:2px 2px 0 0;transform:rotate(45deg)}
    .msec1 .slogan .more a:hover{gap:10px}
    
    
    /*msec2*/
    .msec2{background:#fafafa;padding:100px 0 0}
    .msec2 .prd_con ul{display:flex;flex-wrap:wrap;border-top:1px solid #eee}
    .msec2 .prd_con li{display:flex;width:33.33%;border:1px solid #eee;border-width:0 0 1px 1px;text-align:center;}
    .msec2 .prd_con li a{display:block;padding:80px 50px 20px;background:#fafafa}
    .msec2 .prd_con li a:hover .thumb{transform:scale(1.05)}
    .msec2 .prd_con li .tit{font-size:24px;font-weight:600;text-transform:uppercase}
    .msec2 .prd_con li .desc{position:relative;z-index:10;flex:1;font-size:18px;margin:20px auto 0;min-height:100px;color:#777;padding:0 3vw}
    .msec2 .prd_con li .thumb{;transition:0.3s}
    
    
    /*msec3*/
    .msec3{text-align:center;margin:100px 0}
    .msec3 .logo{margin:150px 0 80px}
    .msec3 .info{}
    .msec3 .info .tit{font-size:42px;font-weight:600;text-transform:uppercase}
    .msec3 .info .desc{font-size:24px;line-height:1.6;margin:30px auto}
    .msec3 .bg{margin:100px 0}
    
    
    /*msec4*/
    .msec4{}
    .msec4 .list_con{display:flex;gap:70px;align-items:center; margin:95px 0}
    .msec4 .list_con:nth-child(2n) .img_grp{order:0}
    .msec4 .tit_grp{flex:1;order:1}
    .msec4 .tit_grp .tit{font-size:24px;text-transform:uppercase}
    .msec4 .tit_grp .desc{font-size:36px;margin:30px 0 60px;font-weight:600}
    .msec4 .tit_grp .more a{display:flex;gap:5px;align-items:center;font-size:18px;font-weight:600;color:var(--main-color);transition:0.3s}
    .msec4 .tit_grp .more a:after{content:'';display:inline-block;width:6px;height:6px;border:2px solid var(--main-color);border-width:2px 2px 0 0;transform:rotate(45deg) translateY(2px)}
    .msec4 .tit_grp .more a:hover{gap:10px}
    .msec4 .img_grp{width:60%;order:1;border-radius:15px;overflow:hidden}
    .msec4 .img_grp img{transition:0.3s}
    .msec4 .img_grp:hover img{transform:scale(1.1)}
    
    
    /*msec5*/
    .msec5{padding:100px 0;background:#dedede}
    .msec5 ul{display:flex;gap:20px}
    .msec5 li{flex:1;border-radius:15px;overflow:hidden;}
    .msec5 li.aos-animate{transition: 0.3s}
    .msec5 li:nth-of-type(1){background:url('../images/ms5_bg1.jpg') no-repeat center /cover}
    .msec5 li:nth-of-type(2){background:url('../images/ms5_bg2.jpg') no-repeat center /cover}
    .msec5 li:nth-of-type(3){background:url('../images/ms5_bg3.jpg') no-repeat center /cover}
    .msec5 li a{display:flex;gap:30px;flex-direction:column;align-items: center;color:#fff;padding:100px 0 60px;text-align:center;background:rgba(0,0,0,0.6);height:100%;transition:0.3s}
    .msec5 li:hover{flex:1.2}
    .msec5 li:hover a{background:rgba(12,100,104,0.9)}
    .msec5 li a .ico{display:flex;align-items:center; height:160px;}
    .msec5 li a .tit{font-size:22px;font-weight:600;text-transform:uppercase}
    .msec5 li a .desc{font-size:18px}
    
}

    

/*_mobile*/
@media all and (max-width:1024px) {

    
    /*msec1*/
    .msec1 .swiper-slide{display:flex;align-items:center;height:100vh;overflow:hidden}
    .msec1 .swiper-slide .bg{position:absolute;left:0;right:0;top:0;bottom:0;transform:scale(1.1);transition:10s}
    .msec1 .swiper-slide .bg:after{content:'';position:absolute;left:0;right:0;top:0;bottom:0;background:rgba(0,0,0,0.4)}
    .msec1 .swiper-slide-active .bg{transform: scale(1)}
    .msec1 .swiper-slide-active .slogan .tit,
    .msec1 .swiper-slide-active .slogan .desc,
    .msec1 .swiper-slide-active .slogan .more{opacity:1;transform:translateY(0)}
    .msec1 .slogan{color:#fff;width:100%;padding-top:100px}
    .msec1 .slogan .tit{font-size:34px;font-weight:600;opacity:0;transform:translateY(20px);transition:0.5s 0.3s}
    .msec1 .slogan .desc{font-size:18px;font-weight:300;margin:30px 0;opacity:0;transform:translateY(20px);transition:0.5s 0.6s}
    .msec1 .slogan .more{margin-top:100px;opacity:0;transform:translateY(20px);transition:0.5s 0.9s}
    .msec1 .slogan .more a{display:flex;gap:5px;align-items:center;font-size:16px;font-weight:600;color:#fff;transition:0.3s}
    .msec1 .slogan .more a:after{content:'';display:inline-block;width:6px;height:6px;border:2px solid #fff;border-width:2px 2px 0 0;transform:rotate(45deg)}
    .msec1 .slogan .more a:hover{gap:10px}
    
    
    /*msec2*/
    .msec2{background:#fafafa;padding:50px 0 0}
    .msec2 .prd_con ul{display:flex;flex-wrap:wrap;border-top:1px solid #eee}
    .msec2 .prd_con li{display:flex;width:100%;border:1px solid #eee;border-width:0 0 1px 1px;text-align:center;}
    .msec2 .prd_con li a{display:block;width:100%;padding:40px 25px 10px;background:#fafafa;te}
    .msec2 .prd_con li .tit{font-size:16px;font-weight:600;;text-transform:uppercase}
    .msec2 .prd_con li .desc{flex:1;font-size:12px;margin:20px auto 0;color:#777;padding:0 3vw}
    
    
    /*msec3*/
    .msec3{text-align:center;margin:50px 0}
    .msec3 .logo{margin:80px 20px 40px}
    .msec3 .info{}
    .msec3 .info .tit{font-size:24px;font-weight:600;text-transform:uppercase}
    .msec3 .info .desc{font-size:14px;line-height:1.6;margin:20px auto}
    .msec3 .bg{margin:50px 0}
    
    
    /*msec4*/
    .msec4{}
    .msec4 .list_con{display:flex;flex-wrap:wrap;gap:15px;align-items:center; margin:30px 0}
    
    .msec4 .tit_grp{width:100%}
    .msec4 .tit_grp .tit{font-size:15px;text-transform:uppercase}
    .msec4 .tit_grp .desc{font-size:20px;margin:10px 0;font-weight:600}
    .msec4 .tit_grp .more a{display:flex;gap:5px;align-items:center;font-size:14px;font-weight:600;color:var(--main-color);transition:0.3s}
    .msec4 .tit_grp .more a:after{content:'';display:inline-block;width:5px;height:5px;border:1px solid var(--main-color);border-width:1px 1px 0 0;transform:rotate(45deg)}
    .msec4 .tit_grp .more a:hover{gap:10ox}
    .msec4 .img_grp{width:100%}
    .msec4 .img_grp img{border-radius:10px;overflow:hidden}
    
    
    /*msec5*/
    .msec5{padding:50px 0;background:#dedede}
    .msec5 ul{display:flex;flex-wrap:wrap;gap:10px}
    .msec5 li{width:100%;border-radius:10px;overflow:hidden;transition:0.3s}
    .msec5 li:nth-of-type(1){background:url('../images/ms5_bg1.jpg') no-repeat center /cover}
    .msec5 li:nth-of-type(2){background:url('../images/ms5_bg2.jpg') no-repeat center /cover}
    .msec5 li:nth-of-type(3){background:url('../images/ms5_bg3.jpg') no-repeat center /cover}
    .msec5 li a{display:flex;gap:30px;flex-direction:column;align-items: center;color:#fff;padding:50px 0 30px;text-align:center;background:rgba(0,0,0,0.6);height:100%;transition:0.3s}
    .msec5 li a .ico{display:flex;justify-content:center; align-items:center;width:100px; height:100px;text-align:center}
    .msec5 li a .ico img{max-height:100%}
    .msec5 li a .tit{font-size:18px;font-weight:600;text-transform:uppercase}
    .msec5 li a .desc{font-size:14px}

}
