/*_pc*/
@media all and (min-width:1025px) {	
	
    section{position:relative;margin:150px 0}
	
	

	
	.msec1{margin:0}
	.msec1 .swiper-container{position:relative;overflow:hidden}
    .msec1 .swiper-slide{position:relative;height:100vh;overflow:hidden}
    .msec1 .swiper-slide .bg{transform:scale(1.1);height:100%;transition:10s}
    .msec1 .swiper-slide-active .bg{transform: scale(1.0);;transition:10s}
    .msec1 .swiper-slide .slogan{position:absolute;z-index:10;top:50%;transform:translateY(-50%);width:100%;text-align:center;color:#fff}
	.msec1 .swiper-slide .slogan > div{overflow:hidden}
	.msec1 .swiper-slide .slogan .text1{position:absolute;width:100%;transform:translateY(-60px)}
    .msec1 .swiper-slide .slogan .text1 span{display:block;font-size:28px;font-weight:500;transform:translateY(100%);transition: 0.8s 1s}
    .msec1 .swiper-slide .slogan .text2 span{display:block;font-size:84px;font-weight:600;transform:translateY(100%);transition: 0.8s 1.3s}
	.msec1 .swiper-slide .slogan .text3 span{display:block;font-size:84px;font-weight:600;transform:translateY(100%);transition: 0.8s 1.5s}
    .msec1 .swiper-slide-active .slogan .text1 span{transform:translateY(0)}
    .msec1 .swiper-slide-active .slogan .text2 span{transform:translateY(0)}
	.msec1 .swiper-slide-active .slogan .text3 span{transform:translateY(0)}
	.msec1 .container{display:flex;justify-content:center}
    .msec1 .swiper-control{position:relative;z-index:10;top:-120px;display:flex;gap:10px;justify-content:center;align-items:center;text-align:center}
    .msec1 .swiper-control .swiper-button-prev-custom{display:block;width:30px;height:30px;background:url('../images/swiper-prev-w.png') no-repeat center;cursor:pointer}
    .msec1 .swiper-control .swiper-button-next-custom{display:block;width:30px;height:30px;background:url('../images/swiper-next-w.png') no-repeat center;cursor:pointer}
    .msec1 .swiper-control .swiper-pagination-custom{display:flex;gap:10px;justify-content:center;align-items:center;color:#fff;}
    .msec1 .swiper-control .swiper-pagination-custom > span{display:inline-block;position:relative;font-size:18px;color:#fff;font-weight:600}
    .msec1 .swiper-control .swiper-pagination-custom i,
	.msec1 .swiper-control .swiper-pagination-custom .swiper-pagination-total{opacity:0.5}
    .msec1 .swiper-progressbar { position: absolute;z-index: 20;top:50%;transform:translateY(-14px);left:0;width:100%;background:rgba(255,255,255,0.2)}
	.msec1 .swiper-progressbar span{display:block;height:3px;width: 0%;background:var(--main-color);transition: linear 6s;}
    
    /*msec2*/	
	.msec2{padding-bottom:150px;text-align:center;overflow:hidden}
	.msec2 .tit1{font-size:var(--headline3);}
	.msec2 .tit2{font-size:var(--headline1);font-weight:700;margin:30px 0;line-height:1.2}
	.msec2 .desc{font-size:var(--body1);color:#333;margin:50px 0;line-height:1.6}		



	@keyframes textLoop {
        0% {
          transform: translate3d(0, 0, 0);
        }
        100% {
          transform: translate3d(-100%, 0, 0);
        }
    }
	
	.msec2 .flow_text{display:flex;position:absolute;z-index:-1;left:0;bottom:0;width:100%;font-size:250px;color:#f8f8f8;font-weight:700;white-space:nowrap;overflow:hidden}
	.msec2 .flow_text span{animation: textLoop 30s linear infinite;padding:0 10px}
    
    
    /*msec3*/
    .msec3{overflow:hidden;background:url('../images/ms3_bg.jpg') no-repeat center bottom /cover;padding:100px 0 200px}
	.msec3 .container{display:flex;}
	
	


	.msec3 .tit_con{width:400px;min-width:400px}
	.msec3 .tit_con .tit1{font-size:var(--headline1);font-weight:700;line-height:1.2}	
	.msec3 .tit_con .tit2{display:flex;gap:15px;align-items:center; font-size:var(--headline2);letter-spacing:2px;margin:20px 0}
	.msec3 .tit_con .tit2:before{content:'';display:inline-block;width:40px;height:3px;background:var(--main-color)}
	.msec3 .tit_con .controler{display:flex;gap:10px;margin-top:150px}
	.msec3 .tit_con .controler > div{width:60px;height:60px;border:2px solid #111;border-radius:10px;opacity:0.3;cursor:pointer;font-size:0}
	.msec3 .tit_con .controler > div:hover{opacity:1}
	.msec3 .tit_con .controler .swiper-prev{background:url('../images/swiper-prev.png') no-repeat center}
	.msec3 .tit_con .controler .swiper-next{background:url('../images/swiper-next.png') no-repeat center}


	.msec3 .swiper{flex:1;min-width:100%}
	.msec3 .swiper-wrapper{display:flex;align-items:center}
	.msec3 .swiper-slide{display:flex;align-items:center;position:relative;;width:900px;height:550px;transition:1s}
	.msec3 .swiper-slide .thumb{width:300px;transition:1s}/*비활성화제품 사이즈*/

	.msec3 .swiper-slide .info{position:absolute;width:300px;left:580px;top:55%;transform:translateY(-50%);opacity:0;transition:0.4s 0.6s}
	.msec3 .swiper-slide .info .tit{font-size:var(--headline2);font-weight:600}
	.msec3 .swiper-slide .info .desc{color:#777;margin:20px 0}
	.msec3 .swiper-slide .info .more{margin:30px 0}

	.msec3 .swiper-slide-active{transition:1s}
	.msec3 .swiper-slide-active .thumb{width:600px}/*활성화제품 사이즈*/
	.msec3 .swiper-slide-active .info{top:50%;opacity:1}
	.msec3 .swiper-slide-next+div{transform:translateX(-70%)}/*비활성화제품 간격*/
	
	
    
    /*msec4*/
	.msec4{overflow:hidden}
	.msec4 .tit_con{display:flex;justify-content:space-between;align-items:flex-end}
	.msec4 .tit_con .tit{font-size:var(--headline1);font-weight:700;line-height:1.2}
	.msec4 .tit_con .desc{font-size:var(--body1);color:#333;text-align:right}

	.msec4 .prd_con{margin:150px 0}
	.msec4 .prd_con ul{display:flex;gap:10px;overflow:hidden}
	.msec4 .prd_con li{flex:1;display:flex;position:relative;align-items:center;background:#f6f5f5;height:650px;overflow:hidden; transition:0.3s}
	.msec4 .prd_con li:hover{flex:2;background:#fff}
	.msec4 .prd_con li:hover .thumb{top:-60px}
	.msec4 .prd_con li:hover .info{opacity:1;bottom:0;transition: 0.3s 0.3s}
	.msec4 .prd_con .thumb{position:relative;top:0;transition:0.3s}
	.msec4 .prd_con .info{position:absolute;left:0;width:100%;bottom:-20px;padding:50px 70px;opacity:0}
	.msec4 .prd_con .info .tit{font-size:36px;font-weight:600;margin:20px 0;white-space:nowrap}
	.msec4 .prd_con .info .more{}

    
    /*msec5*/
    @keyframes spread {
	  0% {width: 10px;height:10px;opacity:0;}  
	  30% {opacity: 0.1;}
	  100% {width: 160px;height: 160px;opacity: 0;}
	}
		
	.msec5{text-align:center;overflow:hidden}
	.msec5 .text1{font-size:var(--headline3)} 
	.msec5 .text2{font-size:var(--headline1);margin:20px 0;font-weight:700}
	.msec5 .desc{font-size:var(--body1);margin:20px 0;line-height:1.5}
	
	.msec5 .earth{position:relative;max-width:1920px;margin:50px auto}
	.msec5 .pointer{}
	.msec5 .pointer .pin{position:absolute;left:50%;transform:translateX(-50%);bottom:0;}
	.msec5 .pointer .pin:after{content:'';position:absolute;left:50%;bottom:0;width:1px;background:var(--main-color)}
	.msec5 .pointer .pin img{max-width:none}
	.msec5 .pointer.s1{position:absolute;left:75.31%;top:54.71%;}
	.msec5 .pointer.s1 .pin{padding-bottom:80px}
	.msec5 .pointer.s1 .pin:after{height:80px}
	.msec5 .pointer.s2{position:absolute;left:62.42%;top:52.72%;}	
	.msec5 .pointer.s2 .pin{padding-bottom:40px}
	.msec5 .pointer.s2 .pin:after{height:40px}
	
	.msec5 .pointer i{position: absolute;top: 50%;left: 50%;width: 10px;height: 10px;background:var(--main-color);border-radius: 50%;transform: translate(-50%, -50%);opacity:0;}		
	.msec5 .pointer i:nth-of-type(1){opacity:1}

	.msec5 .pointer.s1 i:nth-of-type(2){animation: spread 3s ease-out infinite}		
	.msec5 .pointer.s1 i:nth-of-type(3){animation: spread 3s ease-out infinite;animation-delay: 1s;}
	.msec5 .pointer.s1 i:nth-of-type(4){animation: spread 3s ease-out infinite;animation-delay: 2s;}

	.msec5 .pointer.s2 i:nth-of-type(2){animation: spread 4s ease-out infinite}	
	.msec5 .pointer.s2 i:nth-of-type(3){animation: spread 4s ease-out infinite;animation-delay: 1s;}
	.msec5 .pointer.s2 i:nth-of-type(4){animation: spread 4s ease-out infinite;animation-delay: 2s;}
	.msec5 .pointer.s2 i:nth-of-type(5){animation: spread 4s ease-out infinite;animation-delay: 3s;}

	.msec5 .flow_text{position:relative;display:flex;overflow:hidden;text-align:left;gap:0;top:-100px}
	.msec5 .flow_text ul{display:flex;gap:200px;;animation: textLoop 30s linear infinite;padding:0 100px}
	.msec5 .flow_text ul li{}
	.msec5 .flow_text ul li img{min-width:100%;max-width:none}


		
	/*msec6*/	
	.msec6{background:url('../images/ms6_bg.jpg') no-repeat center /cover;color:#fff;padding:200px 0;margin-bottom:0}
	.msec6 .container{display:flex;}
	.msec6 .text1{flex:1;font-size:var(--headline1)}
	.msec6 .info_con{flex:1}
	.msec6 .info_con .tit{font-size:var(--headline2);letter-spacing:2px}
	.msec6 .info_con .desc{font-size:var(--body1);margin:20px 0;line-height:1.6}
	.msec6 .info_con .more{margin-top:50px}
    
}

    

/*_mobile*/
@media all and (max-width:1024px) {

    section{position:relative;margin:80px 0}
	

	

	
	.msec1{margin:0}
	.msec1 .swiper-container{position:relative;overflow:hidden}
    .msec1 .swiper-slide{position:relative;height:100vh;overflow:hidden}
    .msec1 .swiper-slide .bg{transform:scale(1.1);height:100%;transition:10s}
    .msec1 .swiper-slide-active .bg{transform: scale(1.0);;transition:10s}
    .msec1 .swiper-slide .slogan{position:absolute;z-index:30;top:50%;transform:translateY(-50%);width:100%;text-align:center;color:#fff;padding:0 15px}
	.msec1 .swiper-slide .slogan > div{overflow:hidden}
	.msec1 .swiper-slide .slogan .text1{position:absolute;width:100%;transform:translateY(-50px)}
    .msec1 .swiper-slide .slogan .text1 span{display:block;font-size:18px;font-weight:500;transform:translateY(100%);transition: 0.8s 1s}
    .msec1 .swiper-slide .slogan .text2 span{display:block;font-size:42px;font-weight:600;transform:translateY(100%);transition: 0.8s 1.3s}
	.msec1 .swiper-slide .slogan .text3 span{display:block;font-size:42px;font-weight:600;transform:translateY(100%);transition: 0.8s 1.5s}
    .msec1 .swiper-slide-active .slogan .text1 span{transform:translateY(0)}
    .msec1 .swiper-slide-active .slogan .text2 span{transform:translateY(0)}
	.msec1 .swiper-slide-active .slogan .text3 span{transform:translateY(0)}
	.msec1 .container{display:flex;justify-content:center}
    .msec1 .swiper-control{position:relative;z-index:10;top:-80px;display:flex;gap:8px;justify-content:center;align-items:center;text-align:center}
    .msec1 .swiper-control .swiper-button-prev-custom{display:block;width:30px;height:30px;background:url('../images/swiper-prev-w.png') no-repeat center;cursor:pointer}
    .msec1 .swiper-control .swiper-button-next-custom{display:block;width:30px;height:30px;background:url('../images/swiper-next-w.png') no-repeat center;cursor:pointer}
    .msec1 .swiper-control .swiper-pagination-custom{display:flex;gap:10px;justify-content:center;align-items:center;color:#fff;}
    .msec1 .swiper-control .swiper-pagination-custom > span{display:inline-block;position:relative;font-size:15px;color:#fff;font-weight:600}
    .msec1 .swiper-control .swiper-pagination-custom i,
	.msec1 .swiper-control .swiper-pagination-custom .swiper-pagination-total{opacity:0.5}
    .msec1 .swiper-progressbar { position: absolute;z-index: 10;top:50%;transform:translateY(-15px);left:0;width:100%;background:rgba(255,255,255,0.2)}
	.msec1 .swiper-progressbar span{display:block;height:2px;width: 0%;background:var(--main-color);transition: linear 6s;}
    
    /*msec2*/	
	.msec2{padding-bottom:160px;text-align:center;overflow:hidden}
	.msec2 .tit1{font-size:var(--headline3);}
	.msec2 .tit2{font-size:var(--headline1);font-weight:700;margin:20px 0;line-height:1.2}
	.msec2 .desc{font-size:var(--body1);color:#333;margin:30px 0;line-height:1.6}				



	@keyframes textLoop {
        0% {
          transform: translate3d(0, 0, 0);
        }
        100% {
          transform: translate3d(-100%, 0, 0);
        }
    }
	
	.msec2 .flow_text{display:flex;position:absolute;z-index:-1;left:0;bottom:0;width:100%;font-size:130px;color:#f8f8f8;font-weight:700;white-space:nowrap;overflow:hidden}
	.msec2 .flow_text span{animation: textLoop 30s linear infinite;padding:0 10px}
    
    
    /*msec3*/
    .msec3{overflow:hidden;background:url('../images/ms3_bg.jpg') no-repeat center bottom /cover;padding:60px 0 120px}
	.msec3 .container{}

	.msec3 .tit_con{}
	.msec3 .tit_con .tit1{font-size:var(--headline1);font-weight:700;line-height:1.2}	
	.msec3 .tit_con .tit2{display:flex;gap:15px;align-items:center; font-size:var(--headline2);letter-spacing:2px;margin:20px 0}
	.msec3 .tit_con .tit2:before{content:'';display:inline-block;width:30px;height:2px;background:var(--main-color)}
	.msec3 .tit_con .controler{display:flex;gap:5px;margin-top:50px}
	.msec3 .tit_con .controler > div{width:50px;height:50px;border:2px solid #111;border-radius:10px;opacity:0.3;cursor:pointer;font-size:0}
	.msec3 .tit_con .controler > div:hover{opacity:1}
	.msec3 .tit_con .controler .swiper-prev{background:url('../images/swiper-prev.png') no-repeat center}
	.msec3 .tit_con .controler .swiper-next{background:url('../images/swiper-next.png') no-repeat center}


	.msec3 .swiper{}
	.msec3 .swiper-wrapper{}
	.msec3 .swiper-slide{position:relative;}
	.msec3 .swiper-slide .thumb{max-width:500px;margin:0 auto;}/*비활성화제품 사이즈*/

	.msec3 .swiper-slide .info{}
	.msec3 .swiper-slide .info .tit{font-size:var(--headline2);font-weight:600}
	.msec3 .swiper-slide .info .desc{color:#777;margin:20px 0}
	.msec3 .swiper-slide .info .more{margin:30px 0}

	.msec3 .swiper-slide-active{}
	.msec3 .swiper-slide-active .thumb{}/*활성화제품 사이즈*/
	.msec3 .swiper-slide-active .info{}
	
	
    
    /*msec4*/
	.msec4{overflow:hidden}
	.msec4 .tit_con{}
	.msec4 .tit_con .tit{font-size:var(--headline1);font-weight:700;line-height:1.2}
	.msec4 .tit_con .desc{font-size:var(--body1);color:#333;margin:20px 0}

	.msec4 .prd_con{margin:80px 0}
	.msec4 .prd_con ul{}
	.msec4 .prd_con li{margin:60px 0}
	.msec4 .prd_con .thumb{background:#f6f5f5;text-align:center}
	.msec4 .prd_con .info{}
	.msec4 .prd_con .info .tit{font-size:26px;font-weight:600;margin:20px 0 10px;white-space:nowrap}
	.msec4 .prd_con .info .more{}

    
    /*msec5*/
    @keyframes spread {
	  0% {width: 10px;height:10px;opacity:0;}  
	  30% {opacity: 0.1;}
	  100% {width: 160px;height: 160px;opacity: 0;}
	}
		
	.msec5{text-align:center;overflow:hidden}
	.msec5 .text1{font-size:var(--headline3)} 
	.msec5 .text2{font-size:var(--headline1);margin:20px 0;font-weight:700;line-height:1.2;}
	.msec5 .desc{font-size:var(--body1);margin:20px 0;line-height:1.5}
	.msec5 .earth{position:relative;max-width:1920px;margin:0 auto}
	.msec5 .pointer{}
	.msec5 .pointer .pin{position:absolute;left:50%;transform:translateX(-50%);bottom:0}	
	.msec5 .pointer .pin:after{content:'';position:absolute;left:50%;bottom:0;width:1px;background:var(--main-color)}
	.msec5 .pointer .pin img{max-width:none}
	
	.msec5 .pointer.s1{position:absolute;left:75.31%;top:54.71%;}
	.msec5 .pointer.s1 .pin{padding-bottom:40px}
	.msec5 .pointer.s1 .pin:after{height:40px}
	.msec5 .pointer.s1 .pin img{width:100px}
	.msec5 .pointer.s2{position:absolute;left:62.42%;top:52.72%;}	
	.msec5 .pointer.s2 .pin{bottom:auto;top:0;padding-top:40px}
	.msec5 .pointer.s2 .pin:after{bottom:auto;top:0;height:40px}
	.msec5 .pointer.s2 .pin img{width:76px}
	
	.msec5 .pointer i{position: absolute;top: 50%;left: 50%;width: 7px;height: 7px;background:var(--main-color);border-radius: 50%;transform: translate(-50%, -50%);opacity:0;}		
	.msec5 .pointer i:nth-of-type(1){opacity:1}

	.msec5 .pointer.s1 i:nth-of-type(2){animation: spread 3s ease-out infinite}		
	.msec5 .pointer.s1 i:nth-of-type(3){animation: spread 3s ease-out infinite;animation-delay: 1s;}
	.msec5 .pointer.s1 i:nth-of-type(4){animation: spread 3s ease-out infinite;animation-delay: 2s;}

	.msec5 .pointer.s2 i:nth-of-type(2){animation: spread 4s ease-out infinite}	
	.msec5 .pointer.s2 i:nth-of-type(3){animation: spread 4s ease-out infinite;animation-delay: 1s;}
	.msec5 .pointer.s2 i:nth-of-type(4){animation: spread 4s ease-out infinite;animation-delay: 2s;}
	.msec5 .pointer.s2 i:nth-of-type(5){animation: spread 4s ease-out infinite;animation-delay: 3s;}

	.msec5 .flow_text{display:flex;overflow:hidden;text-align:left;gap:0;margin:50px 0}
	.msec5 .flow_text ul{display:flex;gap:40px;align-items:center;animation: textLoop 30s linear infinite;padding:0 20px}
	.msec5 .flow_text ul li{}
	.msec5 .flow_text ul li img{max-width: 90px;max-height: 30px;object-fit: contain;}


		
	/*msec6*/	
	.msec6{background:url('../images/ms6_bg.jpg') no-repeat center /cover;color:#fff;padding:160px 0;margin-bottom:0;overflow:hidden}
	.msec6 .container{}
	.msec6 .text1{font-size:var(--headline1)}
	.msec6 .info_con{margin:40px 0 0}
	.msec6 .info_con .tit{font-size:var(--headline2);letter-spacing:2px}
	.msec6 .info_con .desc{font-size:var(--body1);margin:20px 0;line-height:1.6}
	.msec6 .info_con .more{margin-top:50px}
    
    

}
._mo_min{display:none}
@media all and (max-width:480px) {
	._mo_min{display:block}
	
	.msec1 .swiper-progressbar{transform:translateY(-45px)}
}