:root {
	--logo-bg-url: url("");
  }
.btn_01 {position: relative;overflow: hidden;color: white;border-radius: 20px;padding: 1.5em 1em;text-align: center;}
.btn_01::before {content: '';position: absolute;top: 50%;left: 50%;width: 150%;height: 150%;transform: translate(-50%, -50%);background-image: var(--logo-bg-url);background-repeat: no-repeat;background-position: center;background-size: contain;opacity: 0.1;z-index: 0;}
.btn_01 .pc,.btn_01 .mb {position: relative;z-index: 1;} 

.container{width:100%; min-width:280px; overflow:hidden; font-family: 'NanumSquareNeo', sans-serif;}
.intro_header{position:relative; z-index:999; width:100%; height:130px; text-align:center; /* background:#fff; */ z-index:99999;}
.intro_header .inner{width:100%; height:100%; max-width:1760px; margin:0 auto; display:flex; justify-content:space-between; align-items:center;}
.intro_header .logo{display:flex; align-items:center; gap:0 25px;}
.intro_header h1 img {max-width: 200px;max-height: 50px;width: 100%;height: auto;object-fit: contain;display: block;}
.intro_header .logo p{margin-top:4px; font-size:18px; color:#000000; text-align:left; font-family:'EsaManru',sans-serif; font-weight:300;}
.intro_header .logo p span{display:block; font-size:13px; color:#8d8d8d;}
.intro_header .logo p span em{font-size:15px;}
.intro_header .gnb{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); display:flex; margin-left:-150px;}
.intro_header .gnb li{}
.intro_header .gnb li + li{margin-left:65px;}
.intro_header .gnb li a{position:relative; display:inline-block; font-size:17px; font-weight:600;}
.intro_header .gnb li a:after{content:''; position:absolute; bottom:-8px; left:50%; transform:translateX(-50%); width:0; height:2px; background:#fff;}
.intro_header .gnb li:hover a{color:#fff;}
.intro_header .gnb li:hover a:after{width:100%; transition:ease 0.2s;}
.intro_header .gnb li.on a{width:100%}
.intro_header .visitors{}
.intro_header .visitors p{font-size:14px; color:#000; text-align:left; width:110px; display:flex; justify-content:space-between;}
.intro_header .visitors p span{display:inline-block; text-align:right; font-weight:600;}
.intro_header .visitors p + p{margin-top:6px;}
.intro_header .btn_menu{display:none;}	  		

/* 인트로 커서 */
.cursor{position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); width:15px;height:15px; border-radius:100%; background-color:#fff; transition: height 0.5s ease,width 0.5s ease; pointer-events:none; z-index:999;}
.cursor.on{width:85px; height:85px; pointer-events:none; mix-blend-mode:difference;}
.cursor.color{width:85px; height:85px; pointer-events:none; background-color:#006aaa;}	 

#contents{margin:0 auto; max-width:1760px; width:100%;}
.intro{position:relative; max-width:100%; height:780px; margin:0 auto; padding-top:10px;}
.intro .visual{position:absolute; top:0; left:calc(50% - 375px); width:calc(50vw + 375px); height:100%; overflow:hidden;/* background:url(../csapp/img/visual.png)no-repeat; background-size:cover; background-position: center center; */ flex:none;}
.visual .visual_slide{width:100%; height:100%;}			 
.visual .swiper-container{height:100%;} 
.visual .swiper-slide{width:100%; overflow:hidden;} 
.visual .swiper-slide img{display:block; width:100%; height:100%; object-fit:cover;} 	   
.visual .swiper-slide .bg{width:100%; height:100%; background-size:cover; background-position:center !important;}

.intro .visual.show{border-radius:70px 0 0 70px; transition:ease-in 0.8s;}
.intro .visual .slogan{position:absolute; top:123px; left:128px; z-index:100;}
.intro .intro_cont{padding-top:117px; width:455px; height:100%; display:flex; flex-direction:column; justify-content:space-between; flex:none;}	
.intro .intro_text{}
.intro .intro_text h2.tit{font-family:'EsaManru',sans-serif; line-height:1;}
.intro .intro_text h2.tit span{display:block; font-weight:300; font-size:20px; color:#888888; letter-spacing:-0.5px;}
.intro .intro_text h2.tit em{font-size:30px; color:#a4a4a4; font-weight:300;}
.intro .intro_text h2.tit strong{margin-top:6px; position:relative; display:inline-block; font-size:46px; font-weight:300; color:#000; background:#fff;}
.intro .intro_text h2.tit strong svg{position:absolute; top:-37px; right:-37px; width:65px; height:65px; z-index:-1;
	transform-origin: center;
	animation: rotate 15s linear infinite;
    transform-origin: 50% 50%;
}
.intro .intro_text h2.tit strong svg text{font-size:14px; fill:#e51f1f;}
.intro .intro_text p{margin-top:30px; line-height:1.4; font-size:15px; color:#777777; font-weight:300; word-break:keep-all;}

@keyframes rotate{
	100% {
    	transform: rotate(360deg);
    }
}

.intro_btn_wrap{width:455px; max-width:100%;}
.intro_btn_wrap .intro_btn{display:flex; flex-wrap:wrap; gap:0 15px;}
.intro_btn_wrap .intro_btn.intro_btn2{margin-top:25px;}
.intro_btn_wrap .btn_01 span.pc{display:block;}
.intro_btn_wrap .btn_01 span.mb{display:none !important;}
.intro_btn_wrap .btn_01{position:relative; width:220px; height:220px; border-radius:50px; font-size:48px; color:#fff; overflow:hidden; font-family:'EsaManru',sans-serif; font-weight:300;}	 
.intro_btn_wrap .btn_01:after{content:''; position:absolute; right:20px; bottom:15px; display:block; width:50px; height:50px; border-radius:50%; background:url("../img/arrow_28x19.png")no-repeat center;}
.intro_btn_wrap .btn_01 span{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); display:block;}
.intro_btn_wrap .btn_01 span small{display:block; font-size:22px; color:#fff; font-family: 'NanumSquareNeo', sans-serif; font-weight:400;}
.intro_btn_wrap .btn_01.susi{background:#0075bc}
.intro_btn_wrap .btn_01.jungsi{background:#02abf0}
.intro_btn_wrap .btn_01:hover{transform:translate3d(0,-1px,0); box-shadow:0 0 15px rgba(0,0,0,0.7); transition:0.2s ease-in-out;}	 
.intro_btn_wrap .btn_01:before{/* background:url("../csapp/img/logo2.png")no-repeat; */ background-size:contain; background-position:center; opacity:.2;}

.intro_btn_wrap .btn_02 + .btn_02{margin-top:22px;}
.intro_btn_wrap .btn_02{position:relative; display:flex; align-items:center; padding-left:42px; width:100%; height:80px; background:#ededed; border:1px solid #e2e2e2; border-radius:30px;}
.intro_btn_wrap .btn_02:after{content:''; position:absolute; top:50%; right:35px; transform:translateY(-50%); display:block; width:29px; height:26px; background:url("../img/arrow_000.png") no-repeat center; background-size:100% auto;}
.intro_btn_wrap .btn_02 span{font-size:17px; color:#000000;}
.intro_btn_wrap .btn_02 em{font-weight:600;}
.intro_btn_wrap .btn_02:before{content:''; position:absolute; top:0; left:0; width:100%; height:100%; border:1px solid #e2e2e2; border-radius:30px;}


.intro_btn_wrap.type02{width:436px; gap:10px 0;}
.intro_btn_wrap.type02 .intro_btn{gap:10px 0;}
.intro_btn_wrap.type02 .btn_01{position:relative; width:100%; height:210px; border-radius:50px; font-size:40px;}	 
.intro_btn_wrap.type02 .btn_01:after{content:''; position:absolute; right:35px; bottom:auto; top:50%; transform:translateY(-50%); display:block; width:50px; height:50px; border-radius:50%; background:url("../img/arrow_29x26.png")no-repeat center;}
.intro_btn_wrap.type02 .btn_01 span{position:absolute; top:50%; left:48px; transform:translateY(-50%); display:block;}


.intro_btn_wrap.type03{width:433px;}
.intro_btn_wrap.type03 .intro_btn{gap:10px 0;}
.intro_btn_wrap.type03 .btn_01{position:relative; width:100%; height:160px; border-radius:50px; font-size:36px;}	 
.intro_btn_wrap.type03 .btn_01:after{content:''; position:absolute; right:45px; bottom:auto; top:50%; transform:translateY(-50%); display:block; width:50px; height:50px; border-radius:50%; background:url("../img/arrow_29x26.png")no-repeat center;}
.intro_btn_wrap.type03 .btn_01 span{position:absolute; top:50%; left:48px; transform:translateY(-50%); display:block;}
.intro_btn_wrap.type03 .intro_btn.intro_btn2{margin-top:12px;}

.intro_btn_wrap.type04{width:433px;}
.intro_btn_wrap.type04 .intro_btn{gap:0;}
.intro_btn_wrap.type04 .btn_01{position:relative; width:100%; height:220px; border-radius:50px; font-size:36px; background:#0075bc;}	
.intro_btn_wrap.type04 .btn_01:before{content:''; position:absolute; right:22px; display:block; width:180px; height:100%; background-size:contain; background-position:center;}
.intro_btn_wrap.type04 .btn_01 span{left:40px; transform:translate(0,-50%);}
.intro_btn_wrap.type04 .btn_01:after{bottom:auto; top:50%; transform:translateY(-50%); right:35px;}

.footer_intro{max-width:1760px; width:100%; margin:0 auto; }
.footer_intro .inner{width:100%; margin:0 auto; padding:25px 0 50px; padding-left:560px; text-align:left;}
.footer_intro address{text-align:left;}
.footer_intro address span{position:relative; display:inline-block; color:#8c8c8c; font-size:13px; line-height:1.4;}
.footer_intro address span + span{margin-left:11px;}
.footer_intro address span + span:before{content:''; position:absolute; top:3px; left:-6px; width:1px; height:13px; background:#8c8c8c; display:block;}			   



@media screen and (min-width:1024px){
	.intro_btn_wrap.type01 .btn_01:before{content:''; position:absolute; top:50%; transform:translateY(-50%); width:210px; height:210px;}
	.intro_btn_wrap.type01 .btn_01.susi:before{right:-110px}
	.intro_btn_wrap.type01 .btn_01.jungsi:before{left:-110px;}							   

	.intro_btn_wrap.type02 .btn_01:before{content:''; position:absolute; left:50%; transform:translateX(-50%); width:267px; height:267px;}
	.intro_btn_wrap.type02 .btn_01.susi:before{bottom:-125px}
	.intro_btn_wrap.type02 .btn_01.jungsi:before{top:-145px;}		 

	.intro_btn_wrap.type03 .btn_01:before{content:''; position:absolute; left:50%; transform:translateX(-50%); width:267px; height:267px;}
	.intro_btn_wrap.type03 .btn_01.susi:before{bottom:-145px}
	.intro_btn_wrap.type03 .btn_01.jungsi:before{top:-145px;}	

	.intro_btn_wrap.type01 .btn_01:hover span{top:40px; left:38px; transform:translate(0,0); transition:0.2s ease-in-out;}			  	
	.intro_btn_wrap.type01 .btn_01:hover span small{display:block; opacity:1;}
	.intro_btn_wrap.type01 .btn_01:hover:after{background-color:rgba(0,0,0,0.4); transition:0.2s ease-in-out;}	   
	.intro_btn_wrap.type02 .btn_01:hover{transform:translate3d(10px,0,0);} 
	.intro_btn_wrap.type02 .btn_01:hover:after{background-color:rgba(0,0,0,0.4); transition:0.2s ease-in-out;}	
	.intro_btn_wrap.type03 .btn_01:hover{transform:translate3d(10px,0,0);} 
	.intro_btn_wrap.type03 .btn_01:hover:after{background-color:rgba(0,0,0,0.4); transition:0.2s ease-in-out;}		
	.intro_btn_wrap.type04 .btn_01:hover{transform:translate3d(10px,0,0);} 
	.intro_btn_wrap.type04 .btn_01:hover:after{background-color:rgba(0,0,0,0.4); transition:0.2s ease-in-out;}		

	.intro_btn_wrap .btn_02:hover{border-radius:40px; background:#fff; box-shadow:0 0 10px rgba(0,0,0,0.4); transition:0.2s ease-in-out;}
	.intro_btn_wrap .btn_02:hover span{text-decoration:underline; text-underline-offset:3px; }
	.intro_btn_wrap .btn_02:hover:after{right:20px; transition:0.2s ease-in-out;}
	.intro_btn_wrap .btn_02:hover:before{border:2px solid #e51f1f; border-radius:40px; transition:0.2s ease-in-out;}		
}

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

	.intro_header .inner,
	.intro,
	.footer_intro .inner{width:92%;}

	.intro_header{height:100px;} 
	.intro_header .gnb{margin-left:40px;}
	.intro_header .gnb li + li{margin-left:40px;}

	.intro .intro_cont{width:calc(50% - 250px);}
	.intro .visual{left:calc(50% - 210px); width:calc(50vw + 210px);}
	.intro_btn_wrap,
	.intro_btn_wrap.type02,
	.intro_btn_wrap.type03,
	.intro_btn_wrap.type04{width:100%;}
	.intro_btn_wrap .intro_btn{gap:0 10px;}
	.intro_btn_wrap .btn_01{width:calc(100%/2 - 10px/2); height:205px}		

	.footer_intro .inner{padding-left: calc(50% - 210px);}
	.footer_intro .copy{display:block; margin-left:0;}
	.footer_intro .copy:before{display:none;}
}																								    

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

	.intro .intro_cont{width:calc(50% - 160px);}
	.intro .visual{left:calc(50% - 130px); width:calc(50vw + 130px);}
	.footer_intro .inner{padding-left: calc(50% - 120px);}

}

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

	.intro_header .gnb{margin-left:0;}
	.intro{height:730px;}
	.visual .slide{height:730px;}
	.intro .intro_cont{padding-top:100px; width:calc(50% - 70px);}
	.intro .visual{left:calc(50% - 50px); width:calc(50vw + 50px);}
	.intro .visual .slogan{top:14%; left:10%; max-width:70%; max-height:100px;}

	.intro .intro_text h2.tit span{font-size:18px;}
	.intro .intro_text h2.tit em{font-size:26px;}
	.intro .intro_text h2.tit strong{margin-top:6px; font-size:40px;}
	.intro .intro_text h2.tit strong svg{top:-32px; right:-30px; width:53px; height:53px;}
	.intro .intro_text p{margin-top:25px;}															  
	
	.intro_btn_wrap .btn_01{width:calc(100%/2 - 10px/2); height:190px; font-size:40px}
	.intro_btn_wrap .btn_01:after{width:45px; height:45px;}
	.intro_btn_wrap .btn_01 span small{font-size:19px;}
	
	.intro_btn_wrap .intro_btn.intro_btn2{margin-top:20px;}
	.intro_btn_wrap .btn_02 + .btn_02{margin-top:18px;}
	.intro_btn_wrap .btn_02{height:70px;}
	.intro_btn_wrap .btn_02 span{font-size:16px;}


	.intro_btn_wrap.type02 .btn_01{height:180px; font-size:36px;}	  
	.intro_btn_wrap.type04 .btn_01{height:190px; font-size:32px;}	
	.intro_btn_wrap.type04 .btn_01:before{width:160px}

	.footer_intro .inner{padding:25px 0 50px;}
	.footer_intro address{text-align:center;}
}

@media screen and (max-width:1023px){
	.cursor{display:none;}
	
	.intro_header{position:fixed; height:70px; background:#fff;}
	.intro_header h1 img{height:35px; width:auto;}		
	.intro_header .logo{gap:0 20px;}
	.intro_header .logo p{font-size:16px;}
	.intro_header .logo p span{font-size:12px;}
	.intro_header .logo p span em{font-size:14px;}

	.intro_header .gnb,
	.intro_header .visitors{display:none;}
	.intro_header .btn_menu{position:absolute; top:50%; right:4%; transform:translateY(-50%); display:block; width:22px; height:16px; font-size:0;} 
	.intro_header .btn_menu span{position:absolute; top:0; left:0; display:block; width:100%; height:2px; background:#000; transition:all 0.3s;}
	.intro_header .btn_menu span:nth-child(1){}
	.intro_header .btn_menu span:nth-child(2){width:16px; top:50%; transform:translateY(-50%);}
	.intro_header .btn_menu span:nth-child(3){top:auto; bottom:0;}					   
	.intro_header .btn_menu.on span{background:#fff;}
	.intro_header .btn_menu.on span:nth-child(1){transform:translateY(8px) rotateZ(135deg)}
	.intro_header .btn_menu.on span:nth-child(2){opacity:0;}
	.intro_header .btn_menu.on span:nth-child(3){transform:translateY(-6px) rotateZ(-135deg);}		 	

	.intro{padding-top:70px; height:auto;}
	.intro .visual{margin-top:10px; position:relative; top:auto; left:auto; transform:translate(0); width:calc(100%); height:460px; background-position:center top;}   
	.intro .visual.show{border-radius:70px;}
	.visual .slide{height:460px;}
	.intro .visual .slogan{top:14%; left:10%; max-width:45%}  
	
	.intro .intro_cont{width:100%; padding-top:30px;}
	.intro .intro_text{padding-left:10px;}
	.intro .intro_text h2.tit span{font-size:16px;}
	.intro .intro_text h2.tit em{font-size:22px;}
	.intro .intro_text h2.tit strong{font-size:36px;}
	.intro .intro_text h2.tit strong svg{top:-28px; right:-26px; width:48px; height:48px;}
	.intro .intro_text p{margin-top:20px;}		 

	.intro_btn_wrap{margin-top:30px; padding-left:5px;}
	.intro_btn_wrap .btn_01 span.mb{display:block !important;}
	.intro_btn_wrap .btn_01 span.pc{display:none !important;}		
	.intro_btn_wrap .btn_01{font-size:36px; height:170px;}
	.intro_btn_wrap .btn_01 span{width:100%; text-align:center;}
	.intro_btn_wrap.type02 .intro_btn{gap:0 10px;}
	.intro_btn_wrap.type02 .btn_01{width:calc(100%/2 - 10px/2); height:170px; font-size:36px;}	 
	.intro_btn_wrap.type02 .btn_01:after{top:auto; bottom:15px; right:20px; transform:translateY(0); width:45px; height:45px; background:url("../img/arrow_28x19.png")no-repeat center;}
	.intro_btn_wrap.type02 .btn_01 span{left:0; width:100%; text-align:center;}

	.intro_btn_wrap.type01 .btn_01:before,
	.intro_btn_wrap.type02 .btn_01:before,
	.intro_btn_wrap.type03 .btn_01:before{content:''; position:absolute; top:50%; transform:translateY(-50%); width:160px; height:160px; background-size:contain;}
	.intro_btn_wrap.type01 .btn_01.susi:before,
	.intro_btn_wrap.type02 .btn_01.susi:before,
	.intro_btn_wrap.type03 .btn_01.susi:before{left:calc(100% - 80px);}
	.intro_btn_wrap.type01 .btn_01.jungsi:before,
	.intro_btn_wrap.type02 .btn_01.jungsi:before,
	.intro_btn_wrap.type03 .btn_01.jungsi:before{left:-80px;}

	.intro_btn_wrap.type03 .intro_btn{gap:0 10px;}
	.intro_btn_wrap.type03 .btn_01{width:calc(100%/2 - 10px/2); height:170px; font-size:36px;}	 
	.intro_btn_wrap.type03 .btn_01:after{top:auto; bottom:15px; right:20px; transform:translateY(0); width:45px; height:45px; background:url("../img/arrow_28x19.png")no-repeat center;}
	.intro_btn_wrap.type03 .btn_01 span{left:0; width:100%; text-align:center;}

	.intro_btn_wrap.type04{width:100%;}
	.intro_btn_wrap.type04 .btn_01{width:100%; height:190px; font-size:36px;}
	.intro_btn_wrap.type04 .btn_01 span{text-align:left; padding-left:40px; left:0;}	   
	.intro_btn_wrap.type04 .btn_01:before{width:150px}


	.intro_btn_wrap .intro_btn.intro_btn2{display:none;}	
	
	.footer_intro .inner{padding:25px 0 40px;}
	.footer_intro address{text-align:center; padding:0 2%;}
	.footer_intro address span{font-size:12px;}
	.footer_intro address .addr{display:block;}
	.footer_intro address .tel{display:block;}
	.footer_intro address span + span:before{top:2px; height:10px;}  	
	.footer_intro address span:nth-child(2){margin-left:0;}
	.footer_intro address span:nth-child(2):before{display:none;}
	.footer_intro address .br{display:block;}
	
}

@media screen and (max-width:767px){  
	.container{min-height:660px;}
	.intro_header .inner,
	.intro,
	.footer_intro .inner{width:94%;}
	.header .menu{right:3%;}

	.intro_header{height:7vh;}
	.intro_header h1 img{height:3.5vh;}
	.intro_header .logo{gap:0 10px;}
	.intro_header .logo p{font-size:14px; letter-spacing:-1px;}
	.intro_header .logo p span{font-size:10px;}
	.intro_header .logo p span em{font-size:12px;}

	.intro{padding-top:7vh;}
	.intro .visual{margin-top:10px; height:40vh; min-height:270px;}
	.visual .slide{height:40vh; min-height:270px;}
	.intro .visual.show{border-radius:60px;}
	.intro .visual .slogan{left:12%;} 
	
	.intro .intro_cont{width:100%; padding-top:20px;}
	.intro .intro_text h2.tit span{font-size:14px;}
	.intro .intro_text h2.tit em{font-size:20px;}
	.intro .intro_text h2.tit strong{font-size:30px;}
	.intro .intro_text h2.tit strong svg{top:-23px; right:-23px; width:40px; height:40px;}
	.intro .intro_text p{margin-top:15px; font-size:13px;}			  

	.intro_btn_wrap{margin-top:25px;}	 
	.intro_btn_wrap .btn_01,
	.intro_btn_wrap.type02 .btn_01,   
	.intro_btn_wrap.type03 .btn_01,
	.intro_btn_wrap.type04 .btn_01{height:18vh; min-height:120px; font-size:28px; border-radius:40px; padding-left:20px;}	 		
	.intro_btn_wrap.type04 .btn_01 span{padding-left:30px;}	 	
	.intro_btn_wrap.type04 .btn_01:before{width:15vh;}

	.intro_btn_wrap.type01 .btn_01:before,
	.intro_btn_wrap.type02 .btn_01:before,
	.intro_btn_wrap.type03 .btn_01:before{width:17vh; height:17vh;}
	.intro_btn_wrap.type01 .btn_01.susi:before,
	.intro_btn_wrap.type02 .btn_01.susi:before,
	.intro_btn_wrap.type03 .btn_01.susi:before{left:calc(100% - 9vh);}
	.intro_btn_wrap.type01 .btn_01.jungsi:before,
	.intro_btn_wrap.type02 .btn_01.jungsi:before,
	.intro_btn_wrap.type03 .btn_01.jungsi:before{left:-9vh;}	

	.intro_btn_wrap .btn_01:after,
	.intro_btn_wrap.type02 .btn_01:after,
	.intro_btn_wrap.type03 .btn_01:after{bottom:20px; width:24px; height:22px; background-size:100% auto;}

	.footer_intro .inner{padding:20px 0 0;}
	.footer_intro address{letter-spacing:-0.5px;}

}
	
@media screen and (max-width:499px){

	.intro{}
	.intro .visual .slogan{max-width:50%; } 
	
	.intro .intro_cont{padding-top:10px;}
	.intro .intro_text h2.tit em{font-size:18px;}
	.intro .intro_text h2.tit span{font-size:13px;}
	.intro .intro_text h2.tit strong{font-size:27px;}
	.intro .intro_text p{margin-top:10px; font-size:13px; letter-spacing:-1px;}			  

	.intro_btn_wrap{margin-top:20px;}	 
	.intro_btn_wrap .btn_01,
	.intro_btn_wrap.type02 .btn_01,
	.intro_btn_wrap.type03 .btn_01{font-size:23px}	 	

	.footer_intro address span{font-size:11px;}			 

}
	
@media screen and (max-width:360px){	
	.footer_intro address{text-align:center; padding:0;}
	.footer_intro address span{font-size:10px;}
}									

@media screen and (max-width:320px){
	
	.intro_btn_wrap .btn_01,
	.intro_btn_wrap.type02 .btn_01,
	.intro_btn_wrap.type03 .btn_01{height:130px; font-size:24px}
	.footer_intro address span{letter-spacing:-0.5px;}

}