@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");



.header {background: var(--white);}
.header::before{background:var(--border); z-index: 5;}
.header .header_in .logo a{background-image:url('/img/logo.png');}
.header .header_in .top_util ul li a path{fill:var(--black);}
.header .header_in .top_util ul li a rect{fill:var(--black);}
.header .gnb ul > li > a{color:var(--black);}


@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 {
	0% { transform:translateY(60px); opacity:0; }
	100% { transform:translateY(0); opacity:1; }
}



.visual_lnb {margin:119px auto 0; position: relative; z-index: 99;}
.visual_lnb dl{display: flex; align-items:center; flex-wrap: wrap;}
.visual_lnb dl dt {display: flex; align-items:center;}
.visual_lnb dl dt a {font-size: 0; line-height: 1; display: block;}
.visual_lnb dl dt a::before {content: "\e58a"; font-family: var(--icon); font-size: 26px; display: block; line-height: 1; color: var(--black); transition: all 0.4s;}
.visual_lnb dl dt a:hover::before {color: var(--main); transition: all 0.4s;}

.visual_lnb dl dd{position:relative; display: flex; align-items:center; flex-wrap: wrap;}
.visual_lnb dl dd:before{content:''; display:block; width:1px; height:10px; background:var(--border);  margin:0 16px; display: block; position: relative;}
.visual_lnb dl dd .txt {position: relative; font-size: 0.888rem; font-weight: 400; line-height: 175%; letter-spacing: var(--letter-spacing-button); text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden;  word-wrap: normal; display: block; display: flex; align-items:center; gap:0 10px;}
.visual_lnb dl dd:last-of-type .txt {color: var(--main); font-weight: 600;}
.visual_lnb dl dd .txt:after {content:'\e5c5'; font-family: var(--icon); font-size: 22px; color: var(--black); opacity: 0.3; transition: all 0.4s; display: block; line-height: 1; font-weight:400;}
.visual_lnb dl dd .txt.on:after {transform:rotate(180deg); transition: all 0.4s;}
.visual_lnb dl dd .dlst{position: absolute; z-index: 999; margin: 10px 0 0; width: 150px; top:30px; left:16px; background-color: var(--white); padding: 10px 15px; box-sizing:border-box; display: none; box-shadow:5px 5px 15px rgba(0,0,0,0.05);}
.visual_lnb dl dd .dlst.on{display: block;}
.visual_lnb dl dd .dlst ul{}
.visual_lnb dl dd .dlst ul li{padding: 0 0 4px;}
.visual_lnb dl dd .dlst ul li:last-child{padding: 0;}
.visual_lnb dl dd .dlst ul li a{font-size:0.8222rem; transition:all .2s linear; line-height: 120%; letter-spacing:var(--letter-spacing-default);}
.visual_lnb dl dd .dlst ul li a.on{color:var(--main);}
.search_none .visual_lnb dl dd:last-child{display: none;}





/* Title */
#subtitle{padding: 35px 0 70px; text-align:center;}
#subtitle h3{font-weight: 700;}



.basic_cont{max-width:1530px; width: 90%; margin:0 auto 180px;}


.dots {padding-left: 12px; box-sizing: border-box; position: relative; letter-spacing: -0.72px;}
.dots+.dots {margin-top: 5px;;}
.dots::before {content: ''; width: 3px; height: 3px; background: var(--sub); position: absolute; top:14px; left: 0;}


.sub_cate {background:var(--grayBg); margin:0 0 30px;}
.sub_cate ul {}
.sub_cate ul li {flex:1; display: flex !important; height: auto !important;}
.sub_cate ul li a {width:100%; padding:22px; box-sizing:Border-box; display: flex;  align-items: center;  justify-content: center; text-align:center; position:relative; transition:all .5s;}
.sub_cate ul li a:hover {color:var(--main); transition:all .5s;}
.sub_cate ul li a::after {content:''; width:100%; height:100%; border-bottom:2px solid var(--main); box-sizing:border-box; position:absolute; top:0;left:0; }
.sub_cate ul li.on a {background:var(--white); font-weight: 600; color:var(--main);}
.sub_cate ul li.on a::after {border:2px solid var(--main); border-bottom:0;}




/* Privacy Policy */
.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; letter-spacing:var(--letter-spacing-default); 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; letter-spacing:var(--letter-spacing-default);}
.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;  letter-spacing:var(--letter-spacing-default); 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);} 






.responsive-dim{position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,.6);z-index: 100; display:none;}
.responsive-dim .stock-scroll-drag-guide{position: absolute;top: 50%; left: 0;right: 0; text-align: center; transform: translate(0,-50%);}

.stock-scroll-drag-guide {display:flex; justify-content:center;}
	.stock-scroll-drag-guide .stock-scroll-drag-inner { position: relative; width:50px; height: 50px; }
	.stock-scroll-drag-guide .stock-scroll-drag-inner:before { position:absolute; top:4px; right:0; width:100%; height:3px; background-color:rgba(255,255,255,0.5); content:""; border-radius:5px;}
	.stock-scroll-drag-guide .drag-tail { position: absolute; z-index: 1; left: 0px; top: 3px; animation:stock-drag-hand 3s both infinite; }
	.stock-scroll-drag-guide .drag-tail .tail{display:block; width: 25px; height: 5px; background-color:#fff; border-radius:5px; opacity:1; }
	.stock-scroll-drag-guide .drag-tail .hand-icon{margin-top: 5px; display: block;}
	@keyframes stock-drag-hand {
		0% {
			left: 0;
			margin-left: 0px;
			transform: rotate(0deg);
		}
		10% {
			left: 0;
			margin-left: 0px;
			transform: rotate(0deg);
		}
		50% {
			left: 100%;
			margin-left: -25px;
		}
		100% {
			left: 0;
			margin-left: 0px;
		}
	}
	
	
	

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






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





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


.basic_cont{margin:0 auto 120px;}

.dots::before {top:12px;}

.visual_lnb {margin:98px auto 0;}
.visual_lnb dl dt a::before {font-size: 22px;}


/* Privacy Policy */
.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){
    

#subtitle {padding:40px 0 30px;}
.basic_cont{margin:0 auto 80px;}

.dots::before {top:9px;}


.sub_cate {margin:0 0 15px;}
.sub_cate ul li a {padding:10px;}


.visual_lnb {margin:66px 0 0; width: 100%; border-bottom: 1px solid var(--border);}
.visual_lnb dl {position: relative;}
.visual_lnb dl dt {display: none;}
.visual_lnb dl dd {position: static; flex:1; min-width: 0;}
.visual_lnb dl dd:before {display: none;}
.visual_lnb dl dd+dd {border-left: 1px solid var(--border);}
.visual_lnb dl dd .txt {padding: 11px 15px; padding-right:32px; box-sizing: border-box; width: 100%; display:block; white-space: nowrap; font-size:1rem;}
.visual_lnb dl dd .txt:after {position: absolute; top:50%; right: 10px; font-size: 18px; margin-top: -9px;}
.visual_lnb dl dd .dlst {width: 100%; left: 0; top:47px; border: 1px solid var(--border); margin:0; padding:15px 15px;}
.visual_lnb dl dd .dlst ul li {padding: 0 0 6px;;}
.visual_lnb dl dd .dlst ul li a {font-size: 0.888rem;}




 .sanctions_box{position: relative; overflow-y: hidden; overflow-x: auto;}
 .sanctions_box .responsive-dim.show{display: block;}
 .sanctions_box .img_box{width: 680px;}




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



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




}