@import url("common.css");
@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..500,0..1,-50..200");



/* 서브탑 */
#visual {position:relative; width:100%; height:var(--vh); background:var(--black);}
#visual .visual_in {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:9999; height:100%; display:flex; flex-wrap:wrap; align-content:center;}
#visual .v_txt {width:100%; text-align:center; opacity:0; filter:Alpha(opacity=0); -webkit-transform: translateY(50px); transform: translateY(50px); animation: v_txt 1.3s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay:0.6s;}
#visual .v_txt h3 {color: var(--white); font-family: var(--eng); font-size: 4.555rem; font-weight: 900; line-height:100%; margin:40px 0 0; text-transform:uppercase;}
#visual .v_txt p {display:none; color: var(--white); font-size: 1.444rem; font-weight: 300; line-height: 146.154%;  margin:18px 0 0;}

#visual .v_bg {position:absolute; left:0; top:0; width:100%; height:100%; overflow: hidden;}
#visual .v_bg::before {content:''; width:100%; height:20%; opacity: 0.25; background: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0.00) 100%); position:absolute; top:0; left:0;}
#visual .v_bg::after {content:''; width:100%; height:100%; background:rgba(0,0,0,0.5); position:absolute; top:0; left:0;}
#visual .v_bg .bg {position:absolute; left:0; top:0; width:100%; height:100%; transform: scale(1); animation: m_vsImg 2s cubic-bezier(0.4, 0, 0.2, 1);}
#visual .v_bg .jarallax {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:100%; height:100%; opacity:0.6;}

#visual .scr-btn {position:absolute; bottom:60px; left:50%; transform:translateX(-50%); display:flex; flex-wrap:wrap; align-items:center; color: rgba(255,255,255,0.8); text-shadow: 0px 0px 30px rgba(0, 0, 0, 0.08); font-family: var(--eng); font-size: 12px; font-weight: 600; line-height:108.333%; letter-spacing: 0.36px; gap:5px; z-index:9999;}
#visual .scr-btn::before {content:'\e323'; font-family:var(--icon); font-size:26px; line-height:1; display:block; font-weight:400;}

@keyframes m_vsImg {
	0% { -webkit-transform:scale(1.1); -ms-transform:scale(1.1); transform:scale(1.1); }
	20% { -webkit-transform:scale(1.1); -ms-transform:scale(1.1); transform:scale(1.1); }
	100% { -webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1); }
}
@keyframes v_txt {
	from {
		opacity:0;filter:Alpha(opacity=0);
		-webkit-transform: translateY(50px); 
		transform: translateY(50px); 
	}
	to {
		opacity:1.0;filter:Alpha(opacity=100);
		-webkit-transform: translateY(0); 
		transform: translateY(0); 
	}
}






/* 비주얼 lnb */
.visual_lnb {width:100%; opacity:0; filter:Alpha(opacity=0); -webkit-transform: translateY(50px); transform: translateY(50px); animation: v_txt 1.3s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay:0.3s;}
.visual_lnb dl{display: flex; align-items:center; justify-content:center; }
.visual_lnb dl dt {}
.visual_lnb dl dt a {display:flex; flex-wrap:wrap; align-items:center; gap:5px; font-size:0.88rem; color:rgba(255,255,255,0.5); }
.visual_lnb dl dt a::before {content:'\e88a'; font-size:20px; font-family:var(--icon); color:inherit; line-height:1; font-variation-settings: 'FILL' 1; position:relative; top:-1px;}
.visual_lnb dl dd {position:relative; display:flex; flex-wrap:wrap; align-items:center; font-size:0.88rem; color:rgba(255,255,255,0.5); }
.visual_lnb dl dd:last-of-type {color:var(--white); font-weight: 600;}
.visual_lnb dl dd::before {content:''; width: 3px; height: 3px; background:Var(--white); border-radius:100%; opacity:0.5; margin:0 15px;}



/* PC lnb */
.lnb {max-width:100%; position: sticky; top:0; left:0; z-index: 9; top:0; background:var(--white);  box-sizing:border-box; width:100%; margin:0; transition:all 0.5s cubic-bezier(0.4, 0, 0.2, 1); z-index:90;}
.lnb::after {content:''; width:100%; height:1px; background:#ddd; position:absolute; bottom:1px; left:0; z-index:-1;}
.header.fixed + #sitemap + .container #contents .lnb {top:96px; transition:all 0.5s cubic-bezier(0.4, 0, 0.2, 1);}
.lnb .lnb_in{}
.lnb .lnb_in ul{display:flex; justify-content: center;}
.lnb .lnb_in ul li{width: auto; margin:0 40px;}
.lnb .lnb_in ul li a {display:block; font-size:1rem; line-height: 72px; box-sizing:border-box; position:relative;}
.lnb .lnb_in ul li.left_linktop a, .lnb .lnb_in ul li a.active{background: var(--gra); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight:600;}
.lnb .lnb_in ul li:hover a {background: var(--gra); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
 
.lnb .lnb_in ul li a:after{content:''; display:block; width:0; height:3px; background:var(--gra); position:absolute; left:50%; bottom:0; transform:translateX(-50%); transition:all .3s cubic-bezier(0.4, 0, 0.2, 1); z-index:20;}
.lnb .lnb_in ul li:hover a:after{width: 100%;}
.lnb .lnb_in ul li.left_linktop a:after, .lnb .lnb_in ul li a.active:after{width: 100%;}
.search_none .lnb{display: none;}


/* 모바일 lnb */
.mobile_snb {display:none;}

#contents{}
#contents.marT0{margin:0 auto !important;}
.search_none #contents{margin: 0 auto;}

/* 타이틀 */
#subtitle{padding: 120px 0 60px; text-align:center;}
#subtitle h3 {color: var(--black); font-size: 3rem; font-weight: 800; line-height: 1;}




/*** 공통 css ***/
.basic_cont{max-width:1710px; width: 90%; margin:0 auto 200px;}

.black {color:var(--black) !important;}
.marb30 {margin:0 0 30px;}

.fs45 {color: var(--black); font-size: 2.5rem; font-weight: 300; line-height: 133.333%; }
.fs30 {color: var(--white); font-size: 1.666rem; font-weight: 700; line-height:140%; }
.fs21 {font-size: 1.1666rem; font-weight: 300; line-height:157.143%; }
.gra-txt {background: var(--gra); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;}

.dots {padding-left:13px; box-sizing:border-box; position:relative; }
.dots b {font-weight:400; letter-spacing:inherit; line-height:inherit;}
.dots+.dots {margin:5px 0 0;}
.dots::before {content:''; width: 3px; height: 3px; border-radius:100%; opacity: 0.5; background:var(--black); position:absolute; top:14px; left:0;}

.tab-list {display:flex; flex-wrap:wrap; justify-content:center; margin:0 0 55px; gap:0 6px;}
.tab-list li {}
.tab-list li a {display:block; color: rgba(43,44,47,0.3); text-align: center; font-family: var(--eng); font-size: 1rem; font-weight: 700; line-height:133.333%; padding:19px 28px; box-sizing:border-box; background: var(--grayBg); border-radius:50px; min-width:255px; height:100%; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.tab-list.ver3 li a {min-width:180px; font-family: 'Pretendard', 'Archivo', Malgun Gothic,'Malgun Gothic', sans-serif; }
.tab-list li:hover a {color:Var(--main);}
.tab-list li.on a {background:var(--main); color:Var(--white) !important;}
.tab-list.subColor li:hover a {color:Var(--sub) !important;}
.tab-list.subColor li.on a {background:var(--sub); color:Var(--white) !important;}












.ready-cont {padding:120px 60px 150px; box-sizing:border-box; background:var(--grayBg);}
.ready-cont .ready-in {text-align:center; }
.ready-cont .ready-in i {width: 110px; height: 110px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; border-radius:100%; background: var(--gra); margin:0 auto;}
.ready-cont .ready-in i::before {content:'\e004'; font-size:56px; color:var(--white); font-family:var(--icon); font-style:normal;}
.ready-cont .ready-in h3 {display:inline-block; font-family: var(--eng); font-size: 3.444rem; font-weight: 900; line-height:103.226%; background: var(--gra); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin:40px 0 20px;}


/* 갤러리2(배너) */
.gallery_roll{position:relative;}
.gallery_roll:after{content:''; display:block; clear:both;}
.gallery_roll .roll{position:relative;}
.gallery_roll .roll .imgArea{background:#000; overflow: hidden; aspect-ratio: 3 / 2;}
.gallery_roll .roll .imgArea img{width: 100%;  display: block; width: 100%; height: 100%; object-fit: cover;}
.gallery_roll .roll .txtArea{position:absolute; left:0; bottom:0; width:100%; text-align:center; background:rgba(34,34,34,.6); padding:20px; box-sizing:border-box;}
.gallery_roll .roll .txtArea h4{font-weight:400; color:var(--white); line-height:150%; font-size:1.25rem;}
.gallery_roll .slick-arrow{border:0; padding:0; font-size:0; outline:none; cursor:pointer; width:30px; height:30px; transition:all .3s linear; position: absolute; z-index: 9999; width: 30px; height: 30px; opacity: 1; left: auto; right:auto; bottom: auto; top:50%; margin-top:-15px;}
.gallery_roll .slick-arrow:hover{opacity:0.5;}
.gallery_roll .slick-prev{background:url('/img/arrow_p_w.png') no-repeat center/100% auto; left:30px;}
.gallery_roll .slick-next{background:url('/img/arrow_n_w.png') no-repeat center/100% auto; right:30px;}

.gallery_nav{margin:30px -2px 0; width:calc(100% + 4px);}
.gallery_nav:after{content:''; display:block; clear:both;}
.gallery_nav .roll{margin:0 2px; cursor:pointer; background-color:#000; overflow: hidden;}
.gallery_nav .roll .txtArea{display: none;}
.gallery_nav .roll .imgArea{overflow: hidden; aspect-ratio: 3 / 2;}
.gallery_nav .roll .imgArea img{opacity:0.5; width: 100%;  display: block; width: 100%; height: 100%; object-fit: cover;}
.gallery_nav .roll.slick-current .imgArea img{opacity:1;}




/* 천명호추가(2016-07-20) */
.pay_add_tit {font-size: 11px; color: #555;}
.pay_add_tit2 {font-size: 11px; color: #ee2d7a;}

/* 이용약관, 개인정보취급방침 */
.policy_cont{position:relative; overflow:hidden; font-size:1rem;}
.policy_cont br{display:block;}
.policy_cont strong{font-weight:500; color:var(--black);}
.policy_cont .cont_title{font-size:1.412rem; color:var(--black); padding-bottom:18px; font-weight:500;}
.policy_cont p.cont_tit {display:block; font-size:1.2em !important; padding-bottom:10px; font-weight:500; color:var(--black) !important; }
.policy_cont .cont_txt {padding:0px 0px 35px 0;}
.policy_cont .cont_txt2 {padding-bottom:35px;}
.policy_cont .cont_box {padding:25px; background:var(--grayBg); margin:7px 0px 10px 0px; display:block; line-height:1.7;}

.privacy_list {width:91%; overflow:hidden; clear:both; *zoom:1; padding:4% 4% 3% 4%; border:1px solid var(--border); margin-bottom:30px;}
.privacy_list li {width:50%; float:left; padding-bottom:1%;}
.privacy_list li a {font-weight:500; color:var(--black);} 






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



/*** 공통 css ***/
.fs45 br {display:none;}
.fs30 br {display:none;}
.fs21 br {display:none;}
.gra-txt br {display:none;}
.stxt br {display:none;}







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


/* 서브탑 */













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

/* 서브탑 */
#visual .v_txt h3 {font-size:3.666rem;}

.visual_lnb dl dt a::before {font-size:16px;}

.header.fixed + #sitemap + .container #contents .lnb {top:86px; }

/* PC lnb */
.lnb{}
.lnb .lnb_in{}
.lnb .lnb_in ul{}
.lnb .lnb_in ul li{margin:0 20px;}
.lnb .lnb_in ul li a {line-height:60px;}





/* 타이틀 */
#subtitle{padding: 80px 0 45px;}
#subtitle h3 {font-size:2.5rem;}


/*** 공통 css ***/
.basic_cont{margin:0 auto 120px;}



.fs45 {font-size:2.2rem;}
.dots::before {top:11px;}


.tab-list li a {padding:15px 20px; min-width:230px;}








.ready-cont {padding:80px 40px 100px;}
.ready-cont .ready-in i {width:80px; height:80px;}
.ready-cont .ready-in i::before {font-size:40px;}
.ready-cont .ready-in h3 {font-size:2.66rem; margin:30px 0 10px;}


/* 이용약관, 개인정보취급방침 */
.policy_cont{}
.policy_cont p.cont_tit {font-size:1.2em !important; padding-bottom:5px;}
.policy_cont .cont_txt {padding:0px 0px 25px 0; }
.policy_cont .cont_txt2 {padding-bottom:25px;}
.policy_cont .cont_box {padding:18px 18px; }

.privacy_list {margin-bottom:30px;}
.privacy_list li {width:100%;  }

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


/* 서브탑 */
#visual .v_txt h3 {font-size:2.55rem; margin:20px 0 0;}
#visual .v_txt p {font-size:1.22rem; margin:10px 0 0;}
#visual .scr-btn {bottom:30px; }
#visual .scr-btn::before {font-size:20px;}

.visual_lnb dl dt a {font-size:0.933rem;}
.visual_lnb dl dt a::before {font-size:16px;}
.visual_lnb dl dd {font-size:0.933rem;}
.visual_lnb dl dd::before {margin:0 10px;}




/* PC lnb */
.lnb{display: none;}


/* 모바일 lnb */
.mobile_snb {display:block;}
.mobile_snb .tbox{display:flex;}
.mobile_snb .tbox .box{width:50%; box-sizing:border-box;}
.mobile_snb .tbox .box .dropLst{position: relative;}
.mobile_snb .tbox .box .dropLst .title{display:block; font-size:1rem; font-weight: 700; line-height:50px; box-sizing:border-box; padding:0 40px 0 10%; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block; position: relative;}
.mobile_snb .tbox .box .dropLst .title:after{content:'\e5c5'; display:block; position:absolute; right:10%; top:0; font-family:var(--icon); transition:all .3s linear; opacity: 1;}
.mobile_snb .tbox .box.dep1 .dropLst .title:after{background-image:url('/img/lnb_arrow_on.png');}
.mobile_snb .tbox .box.dep1 .dropLst .title{background:var(--white); color:var(--main);}
.mobile_snb .tbox .box.dep2 .dropLst .title{background:var(--gra); color:var(--white);}
.mobile_snb .tbox .box .dropLst .title.on{}
.mobile_snb .tbox .box .dropLst .title.on:after{transform:rotate(180deg);}
.mobile_snb .tbox .box .dropLst .dlst{display:none; position: absolute; left: 0; top:50px; width: 200%; background:var(--white); z-index: 99999; box-shadow:0 20px 20px rgba(0,0,0,.05);}
.mobile_snb .tbox .box.dep2 .dropLst .dlst{left: -100%;}
.mobile_snb .tbox .box .dropLst .dlst ul{}
.mobile_snb .tbox .box .dropLst .dlst ul li{}
.mobile_snb .tbox .box .dropLst .dlst ul li a{display: block; padding: 0 5%; font-size:1rem; line-height:50px; box-sizing:border-box; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block;}
.mobile_snb .tbox .box .dropLst .dlst ul li a.on{color:var(--main);}

.search_none .mobile_snb{display: none;}

#contents{margin:0 auto;}




/* 타이틀 */
#subtitle{padding: 60px 0 30px;}
#subtitle h3 {font-size:2rem;}


/*** 공통 css ***/
.basic_cont{margin:0 auto 80px;}


.fs45 {font-size:1.888rem;}
.fs30 {font-size:1.3rem;}
.dots {padding-left:10px;}
.dots::before {top:8px;}

.tab-list {margin:0 0 25px;}
.tab-list li {width:calc((100% - 6px) / 2);}
.tab-list li a {padding:12px 20px; min-width:auto; width:100%; height:100%;}
.tab-list.ver3 li {width:calc((100% - 12px) / 3);}
.tab-list.ver3 li a {min-width:auto; width:100%;}





.ready-cont {padding:50px 20px;}
.ready-cont .ready-in i {width:60px; height:60px;}
.ready-cont .ready-in i::before {font-size:26px;}
.ready-cont .ready-in h3 {font-size:1.88rem; margin:20px 0 10px;}



}
