@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700;800&display=swap');

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;line-height:180%;letter-spacing:normal} /* delete vertical-align,font:inherit; */
body,html{width:100%; font-size:15px; color:#666;  font-family:Malgun Gothic,'Malgun Gothic','Nanum Gothic', sans-serif;}
*{ font-family:Malgun Gothic,'Malgun Gothic','Nanum Gothic', sans-serif; }
ol,ul,li{list-style:none;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
table {border-collapse:separate;border-spacing:0; font-size:1rem;}
table caption {overflow:hidden; font-size:0; line-height:0; font-size:1rem;}
tbody,tfoot,thead,tr,th,td {margin:0;line-height:180%;letter-spacing:normal;}
input, textarea, button {appearance: none; -moz-appearance: none; -webkit-appearance: none; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0;}
a{cursor:pointer;text-decoration:none;color:#666;}
address{font-style:normal;}
input,select,img{vertical-align:middle;}
input:focus, textarea:focus, button:focus {outline:none;}  /* 크롬에서 커서 클릭시 파란색 테두리 제외*/
span{line-height:inherit}



/** S::레이아웃 **/
#wrap {position:relative; width:100%; min-width:280px; height:100%;}


/** 공통 **/
	h4.title{text-align:center; padding:0 15px 47px; font-weight:900; font-size:1.533rem; letter-spacing:0.3pt; line-height:120%; color:#fff; }
	.ls0 {letter-spacing:0 !important; }

	.ani_effect{opacity:0; transition:all 0.8s linear; position:relative; top:50px;}
	.ani_effect.action{opacity:1; transition:all 0.8s linear; transition-delay:0s; position:relative; top:0;}

	.ani_effect.delay1.action{transition-delay:0.3s; }
	.ani_effect.delay2.action{transition-delay:0.6s; }
	.ani_effect.delay3.action{transition-delay:0.9s; }
	.ani_effect.delay4.action{transition-delay:1.2s; }


/** E::레이아웃 **/



/** S::비쥬얼 **/
#visual{width:100%; height:100vh; position:Relative; overflow:hidden; }
		#visual .bg{height:100%;background-size:cover; background-position:center; position:Relative; z-index:1; animation-duration: 5s; animation-name:visualScale; transform:scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); transform:scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); transition:all 0.3s linear;}
			@keyframes visualScale {
				 0% { transform:scale(1.15); -ms-transform: scale(1.15); -webkit-transform: scale(1.15); }
				 100% { transform:scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); }
			}
		#visual .vtxt{position:absolute; top:50%; width:100%; text-align:center; transform:translateY(-50%); z-index:50;}
		#visual .vtxt h2{opacity:0; transition:all 0.7s linear; margin-top:40px;}
		#visual .vtxt h2.on{opacity:1; transition:all 0.7s linear; margin-top:0;}
		#visual .vtxt img{max-width:70%;}
		#visual .vtxt p{font-size:1.133rem; color:#fff; letter-spacing:0.3pt; padding:25px 0 0; transition:all 0.7s linear; opacity:0;}
		#visual .vtxt p.on{opacity:1; transition:all 0.7s linear;}

		#visual .vScr{position:Absolute; left:50%;transform:translateX(-50%); bottom:35px; color:#fff; line-height:1; text-align:center; cursor:pointer; transition:all 0.2s linear; z-index:50;}
		#visual .vScr:hover{opacity:0.6; transition:all 0.2s linear;}
		#visual .vScr::before{content:""; display:block; width:36px; height:44px; background:url('../../img/v_scr.png') no-repeat center top/100% auto; padding:0 0 20px; -moz-animation: scrMove 2s infinite; -webkit-animation: scrMove 2s infinite; animation: scrMove 2s infinite; }
            @keyframes scrMove {
                    0% {padding:0 0 20px; opacity:1;}
                    50% {padding:0 0 20px; opacity:1;}
                    100% { opacity:1; }
                    100% {padding:0 0 0px; opacity:0; }
                }
/** E::비쥬얼 **/



/** S::ABOUT US **/
.about_cont{padding:113px 0;}
		.about_cont h4.title{color:#222}
		.about_cont .aboutCont_in{max-width:1280px; padding:0 15px; margin:0 auto; display:flex; flex-direction:row; justify-content:space-between;}
		.aboutCont_in > div{width:calc(50% - 20px); text-align:justify; word-break:keep-all; letter-spacing:-0.75pt; }
/** E::ABOUT US **/

 

/** S::TRACK RECORD **/
.track_cont{background:url('../../img/track_bg.jpg') no-repeat center/cover; padding:143px 0 180px;}
		.track_cont .trackCont_in{max-width:1280px; padding:8px 15px 0; margin:0 auto; }
		.trackCont_in ul{display:flex; flex-direction:row;}
		.trackCont_in li{width:calc(100% / 3); text-align:center; box-sizing:Border-box; border-right:1px solid rgba(255,255,255,0.15);}
		.trackCont_in li:last-child{border-right:none; }
		.trackCont_in li div{font-size:0.9333rem; color:rgba(255,255,255,0.6); line-height:120%; letter-spacing:-0.35pt; margin:16px 0 27px;}
		.trackCont_in li div span{font-weight:900; color:#fff; font-size:3.2rem; line-height:1; display:inline-block; }
		.trackCont_in li h6{font-size:1.133rem; color:#fff; font-weight:700; letter-spacing:-0.75pt; line-height:120%; }
/** E::TRACK RECORD **/



/** S::CONTACT US **/
.contact_cont{ padding:146px 0 162px;}
		.contact_cont ul{text-align:center; font-size:0; margin:20px 0 0}
		.contact_cont li{display:inline-block; font-size:1rem; color:rgba(255,255,255,0.4); line-height:120%; padding-left:90px; position:relative; }
				.contact_cont li.type_adr{letter-spacing:-0.55pt;}
				.contact_cont li.type_tel{margin:0 50px;}
		.contact_cont li::before{content:""; display:block; width:70px; height:70px; border-radius:50%; background-color:rgba(255,255,255,0.3); position:Absolute; left:0; top:50%; margin-top:-35px; background-size:auto 20px; background-repeat:no-repeat; background-position:center; }
				.contact_cont li.type_adr::before{background-image:url('../../img/contact_icon01.png'); }
				.contact_cont li.type_tel::before{background-image:url('../../img/contact_icon02.png'); }
				.contact_cont li.type_email::before{background-image:url('../../img/contact_icon03.png'); }
		.contact_cont li h6{text-align:left; font-size:1.133rem; font-weight:700; color:#fff; line-height:120%;padding:0 0 10px;}
/** E::CONTACT US **/


/** S::푸터 **/
#footer{background-image:url('../../img/contact_bg.png'); background-position:center top; background-repeat:no-repeat; background-color:#222; ; }
		#footer .footer_in{max-width:1280px; margin:0 auto; border-top:1px solid rgba(255,255,255,0.1); text-align:center; padding:60px 0}
		.footer_in h3{}
		.footer_in ul{font-size:0; margin:18px 0 0}
				.footer_in li{display:inline-block; font-size:12px; color:rgba(255,255,255,0.3); letter-spacing:0.1pt; }
				.footer_in li a{color:rgba(255,255,255,0.3); letter-spacing:0.1pt; }
				.footer_in li::after{content:""; display:inline-block; width:1px; height:9px; background:rgba(255,255,255,0.2); vertical-align:middle; margin:0 20px;}
				.footer_in li:last-child::after{display:none; }
				.footer_in li.code{font-size:13px; color:#4a44bd; letter-spacing:-0.75pt; text-decoration:underline; cursor:pointer; }
/** E::푸터 **/

/* The Modal (background) */
.modal {display: none; position: fixed; z-index: 99999; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(6,6,22,0.9);}
/* Modal Content */
.modal-content { background-color: #fff; margin: auto; position:absolute; width:800px; top:50%; left:50%; transform:translate(-50%,-50%);  max-height:80%; }
/* The Close Button */
.modal-close {display:block; position:Absolute; right:0; top:-40px; width:18px; height:18px; background:url('../../img/popupClose.png') no-repeat left center; overflow:hidden; text-indent:-999999px;; transition:all 0.2s linear; cursor:pointer; }
.modal-close:hover, .modal-close:focus {opacity:0.5; transition:all 0.2s linear;}



/** S::스튜어드십 코드 **/
.madal_code{}
.madal_code h5{background:#211d70; font-size:1.667rem; color:#fff; padding:20px 0; font-weight:900; letter-spacing:-1pt; line-height:150%;}
.madal_code .codeCont{text-align:left; padding:35px; overflow-y:scroll; height:calc(80vh - 75px); box-sizing:border-box; }
.madal_code .codeCont p{font-size:0.9333rem; letter-spacing:-0.55pt; }
.madal_code .codeCont p.tit{font-weight:900; color:#222; font-size:1.067rem; line-height:170%; padding:28px 0 8px}
.madal_code .codeCont .contact{margin:28px 0 0; background:#f5f5f5; padding:30px 30px 20px; }
		.madal_code .codeCont .contact dl{margin:0 0 10px;}
		.madal_code .codeCont .contact dt, 
		.madal_code .codeCont .contact dd{padding:0 0 0 50px; font-size:0.9333rem; position:relative; }
		.madal_code .codeCont .contact dt{letter-spacing:-0.25pt; }
		.madal_code .codeCont .contact span{display:block; position:absolute; left:0; font-weight:700; color:#222; letter-spacing:-0.55pt; }
/** E::스튜어드십 코드 **/




/*******************************************************************************
    @media ~1280px
*******************************************************************************/
@media all and (max-width:1280px){




}

/*******************************************************************************
    @media  ~980px                body,html{font-size:14px; }     3%
*******************************************************************************/
@media all and (max-width:980px){

body,html{font-size:14px;}



/** S::ABOUT US **/
.about_cont{padding:93px 0;}
		.about_cont .aboutCont_in{padding:0 3%;}
/** E::ABOUT US **/



/** S::TRACK RECORD **/
.track_cont{padding:120px 0 130px;}
		.track_cont .trackCont_in{padding:8px 3% 0; margin:0 auto; }
		.trackCont_in li img{height:42px;}
		.trackCont_in li div{margin:16px 0 27px; font-size:0.9333rem}
		.trackCont_in li div span{font-size:2.533rem}
		.trackCont_in li h6{font-size:1.067rem}
/** E::TRACK RECORD **/



/** S::CONTACT US **/
.contact_cont{padding:120px 0 130px;}
		.contact_cont ul{text-align:left; font-size:0; margin:10px 0 0;}
		.contact_cont li{padding-left:80px; position:relative; width:287px; box-sizing:border-box; display:block; margin:0 auto;}
				.contact_cont li.type_tel{margin:30px auto;}
		.contact_cont li::before{width:58px; height:58px; margin-top:-28px; background-size:auto 18px; }
		.contact_cont li h6{ font-size:1rem; padding:0 0 5px;}
/** E::CONTACT US **/


/** S::푸터 **/
#footer{ padding:0 3%; background-size:200% auto;}
		#footer .footer_in{padding:50px 0}
/** E::푸터 **/




/* Modal Content */
.modal-content {width:80%;}

/* The Close Button */
.modal-close {display:block; position:Absolute; right:0; top:-40px; width:18px; height:18px; background:url('../../img/popupClose.png') no-repeat left center; overflow:hidden; text-indent:-999999px;; transition:all 0.2s linear; cursor:pointer; }


/** S::스튜어드십 코드 **/
.madal_code{}
.madal_code h5{ font-size:1.333rem; padding:20px 0; }
.madal_code .codeCont{padding:20px;  height:calc(80vh - 80px);  }
.madal_code .codeCont p.tit{ font-size:1rem; }
.madal_code .codeCont .contact{margin:20px 0 0; padding:20px 20px 10px; }
/** E::스튜어드십 코드 **/



@media all and  (orientation: Landscape) {	/* Landscape(가로) 모드일 때 적용할 CSS */
/** S::비쥬얼 **/
#visual{width:100%; height:600px;  }


/** S::ABOUT US **/
		.about_cont .aboutCont_in{display:block; }
		.about_cont .aboutCont_in > div{width:100%; text-align:left; word-break:break-all;}
		.about_cont .aboutCont_in > div + div{margin-top:25px;}
/** E::ABOUT US **/

}



}



/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){

/** 공통 **/
	h4.title{padding:0 3% 30px; }

/** S::비쥬얼 **/
		#visual .vtxt img{max-width:60%;}
		#visual .vtxt p{padding:15px 10% 0; line-height:160%;}
		#visual .vtxt p br{display:none; }

		#visual .vScr{bottom:25px; }
		#visual .vScr::before{ width:28px; height:34px; margin:0 auto; padding:0 0 15px; -moz-animation: scrMove 1.8s infinite; -webkit-animation: scrMove 1.8s infinite; animation: scrMove 1.8s infinite; }
            @keyframes scrMove {
                    0% {padding:0 0 15px; opacity:1;}
                    50% {padding:0 0 15px; opacity:1;}
                    100% { opacity:1; }
                    100% {padding:0 0 0px; opacity:0; }
                }
/** E::비쥬얼 **/


/** S::ABOUT US **/
.about_cont{padding:73px 0;}
		.about_cont .aboutCont_in{display:block; }
		.about_cont .aboutCont_in > div{width:100%; text-align:left; word-break:break-all;}
		.about_cont .aboutCont_in > div + div{margin-top:25px;}
/** E::ABOUT US **/



/** S::TRACK RECORD **/
.track_cont{padding:90px 0 100px;}
		.trackCont_in ul{display:block; width:60%; margin:0 auto; }
		.trackCont_in li{width:100%; border-left:none; border-top:1px solid rgba(255,255,255,0.15);  border-right:none; padding:30px 0; }
		.trackCont_in li:first-child{border:none; padding-top:0;}
		.trackCont_in li:last-child{ padding-bottom:0;}
		.trackCont_in li img{height:30px;}
		.trackCont_in li div{margin:8px 0 18px}
		.trackCont_in li div span{font-size:2rem}
/** E::TRACK RECORD **/


/** S::CONTACT US **/
.contact_cont{padding:90px 0 100px;}
/** E::CONTACT US **/


/** S::푸터 **/
#footer{}
		#footer .footer_in h3 img{width:98px;}
		#footer .footer_in{padding:50px 0}
		#footer .footer_in ul{margin-top:15px;}
		#footer .footer_in li{display:block; margin:0 0 2px;}
		#footer .footer_in li::after{display:none;}
/** E::푸터 **/




/* The Close Button */
.modal-close {display:block; position:Absolute; right:0; top:-40px; width:18px; height:18px; background:url('../../img/popupClose.png') no-repeat left center; overflow:hidden; text-indent:-999999px;; transition:all 0.2s linear; cursor:pointer; }


/** S::스튜어드십 코드 **/
.madal_code{}
.madal_code h5{ font-size:1.333rem; padding:20px 3%; word-break:keep-all;}
.madal_code .codeCont{padding:20px;  height:calc(80vh - 120px);  }
.madal_code .codeCont p.tit{ font-size:1rem; }
.madal_code .codeCont .contact{margin:20px 0 0; padding:20px 20px 10px; }
/** E::스튜어드십 코드 **/



@media all and  (orientation: Landscape) {	/* Landscape(가로) 모드일 때 적용할 CSS */
	/** S::비쥬얼 **/
	#visual{width:100%; height:600px;  }
}




}



/*******************************************************************************
    @media ~480px                body,html{font-size:13px; }
*******************************************************************************/
@media all and (max-width:480px){

body,html{font-size:13px;}

/** 공통 **/
	h4.title{padding:0 3% 25px; }



/** S::비쥬얼 **/

		#visual .vScr{font-size:12px;}
		#visual .vScr::before{ width:22px; height:27px; margin:0 auto; padding: 0 0 10px;}
/** E::비쥬얼 **/


/** S::ABOUT US **/
.about_cont{padding:53px 0;}
/** E::ABOUT US **/



/** S::TRACK RECORD **/
.track_cont{padding:70px 0 80px;}
		.trackCont_in ul{width:90%;}
		.trackCont_in li{padding:25px 0; }
/** E::TRACK RECORD **/


/** S::CONTACT US **/
.contact_cont{padding:70px 0 80px;}
		.contact_cont li{padding-left:60px; width:260px;}
				.contact_cont li.type_tel{margin:25px auto;}
		.contact_cont li::before{width:46px; height:46px; margin-top:-23px; background-size:auto 15px; }

/** E::CONTACT US **/



/** S::스튜어드십 코드 **/
.madal_code{}
.madal_code h5{ font-size:1.2rem; padding:15px 3%; }
.madal_code .codeCont{height:calc(80vh - 120px);  }
.madal_code .codeCont .contact dl{margin:0 0 20px;}
.madal_code .codeCont .contact dl:last-child{margin:0 0 10px;}
.madal_code .codeCont .contact span{position:Relative; padding:0 0 3px;}
.madal_code .codeCont .contact dt, .madal_code .codeCont .contact dd{padding:0; line-height:120%;}
.madal_code .codeCont .contact dt{margin:0 0 10px;}

/** E::스튜어드십 코드 **/



#footer .footer_in{padding:30px 0}
#footer .footer_in li span{display:block;}


}
/*******************************************************************************
    @media ~360px
*******************************************************************************/
@media all and (max-width:320px){




}