@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: calc(100% - 100px); height: 500px; margin: 0 auto;}
#visual .v_bg{position: absolute; left:0; top:0; width: 100%; height: 100%; border-radius:var(--borderR50); overflow: hidden;}
#visual .v_bg .bg{position: absolute; left:0; top:0; width: 100%; height: 100%; background-repeat:no-repeat; background-size:cover; background-position:center; transform: scale(1); animation: m_vsImg 1.8s;}
#visual .v_txt{position: absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index: 9999; text-align:left;}
#visual .v_txt h3{font-size:3.333rem; font-weight: 700; line-height: 120%; letter-spacing: -3px; font-family:var(--title); color: var(--white); text-shadow: var(--text-shadow); filter: blur(5px); opacity: 0; animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) 0.3s forwards;}
#visual .v_txt p{padding: 25px 0 0; font-size:1rem; letter-spacing: -0.54px; line-height: 160%; font-weight: 400; color: var(--white); text-shadow:var(--text-shadow); filter: blur(5px); opacity: 0; animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) 0.3s forwards;}


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






/**** lnb ****/
.mobile_snb{background:var(--white); max-width:620px; width: 100%; box-sizing:border-box; padding: 20px 20px 0 20px; border-radius:var(--borderR30) 0 0 0; position: absolute; right: 0; bottom: 0; z-index:99999;}
.mobile_snb:before{content:''; display: block; width: 40px;	height: 40px; background:url('/img/radius.png') no-repeat center/contain; position:absolute; left:-40px; bottom:0;}
.mobile_snb:after{content:''; display: block; width: 40px;	height: 40px; background:url('/img/radius.png') no-repeat center/contain; position:absolute; right:0; top:-40px;}
.mobile_snb .tbox{display: flex;}
.mobile_snb .tbox .home{width: 70px;}
.mobile_snb .tbox .home a{display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; height: 70px; background:var(--main); color:var(--white); transition:all .3s linear; position: relative; font-size:0; border-radius:var(--borderR20);}
.mobile_snb .tbox .home a:hover{background:var(--sub);}
.mobile_snb .tbox .home a svg{width: 20px; height:auto;}

.mobile_snb .tbox .box{width: calc((100% - 70px)/2); padding-left: 10px; box-sizing:border-box; position: relative;}
.mobile_snb .tbox .box .dropLst{position: relative;}
.mobile_snb .tbox .box .dropLst > a{display: block; font-size:1rem; padding: 0 50px 0 20px; line-height: 70px; letter-spacing: -0.36px; box-sizing:border-box; position: relative; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block;}
.mobile_snb .tbox .box:last-child .dropLst > a{font-weight: 700; color:var(--main);}
.mobile_snb .tbox .box .dropLst > a:after{content:'\e5c5'; display: block; width: 24px; height: 24px; line-height: 24px; font-size:24px; text-align:center;  font-family:var(--icon); position: absolute; right:0; top:50%; margin-top: -12px; transition:all .3s ease; color:var(--basic); font-weight: 400;}
.mobile_snb .tbox .box .dropLst > a.on:after{transform:rotate(180deg);}
.mobile_snb .tbox .box .dropLst .dlst{display: none; position: absolute; left:-1px; top:70px; width: 100%; background:var(--white); box-shadow: 0px 7px 15px 0px rgba(0, 0, 0, 0.07); border-radius:var(--borderR20); overflow: hidden; box-sizing:border-box; padding: 25px 20px;}
.mobile_snb .tbox .box.dep1 .dropLst .dlst{left: 0;}
.mobile_snb .tbox .box .dropLst .dlst ul{}
.mobile_snb .tbox .box .dropLst .dlst ul li{margin: 0 0 10px;}
.mobile_snb .tbox .box .dropLst .dlst ul li:last-child{margin: 0;}
.mobile_snb .tbox .box .dropLst .dlst ul li a{display: block; font-size:1rem; line-height: 150%; letter-spacing: -0.36px; box-sizing:border-box; position: relative; 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{font-weight: 700; color:var(--main) !important;}
.mobile_snb .tbox .box .dropLst .dlst ul li a:hover{color:var(--black);}



/**** ŸÀÌƲ ****/
.subtitle{padding: 120px 0 40px; text-align:center;}
.subtitle h3{font-size:2.778rem; color:var(--black); font-weight: 700; line-height:120%; letter-spacing: -2.5px; font-family:var(--title);}


/**** ¼­ºêÆäÀÌÁö °øÅë ****/
.w1350 {max-width:1350px; width:90%; margin:0 auto; }

.subpad {box-sizing:border-box; padding:150px 0; }
.subpad_t {box-sizing:border-box; padding:150px 0 0; }
.subpad_b {box-sizing:border-box; padding:0 0 150px; }
/**** ¼­ºêÆäÀÌÁö °øÅë ****/

/**** ÅǸ޴º ****/
.cate_tab {margin: 0 auto 60px; box-sizing:border-box; position: relative;}
.cate_tab ul{display:flex; flex-wrap:wrap; justify-content: center; border-radius:var(--borderR10); padding:10px; box-sizing:border-box; background:var(--grayBg);}
.cate_tab ul li{width:auto; flex:1;}
.cate_tab ul li a{display:inline-block; width:100%; padding:0 20px; line-height:60px; height: 60px; color:var(--basic); box-sizing:border-box; transition:all .3s linear; position:relative; text-align:center; font-weight: 400; border-radius:var(--borderR10); }
.cate_tab ul li:hover a{ color:var(--main);}
.cate_tab ul li.on {}
.cate_tab ul li.on a{background:var(--main) !important; font-weight: 600; color:var(--white) !important; }
/**** ÅǸ޴º ****/

/**** ÅǸ޴º ver2 ****/
.cate_tab.ver2 {}
.cate_tab.ver2 ul{margin:0 auto; width: auto; max-width:685px;}
.cate_tab.ver2 ul li{width:50%; }
/**** ÅǸ޴º ver2 ****/

/**** sticky 2´Ü Ʋ ****/
.sticky_cont {display:flex;}
.sticky_cont .sticky_in {width:430px; padding:0 180px 0 0; box-sizing:border-box; }
.sticky_cont .sticky_in .sticy_tit {position:sticky; top:100px;}
.sticky_cont .sticky_in .sticy_tit h4 {font-weight:700; font-family:var(--title); line-height:155.556%;}
.sticky_cont .cont_in{width: calc(100% - 430px); position:relative;}
/**** sticky 2´Ü Ʋ ****/



/**** ¹Ù ŸÀÌƲ ½ºÅ¸ÀÏ ****/
.deco_tit {position:relative; padding-top:15px}
.deco_tit:before {content:''; width:47px; height:6px; background:url("/img/deco.png")no-repeat right; position:absolute; top:0; left:0; display:block;}
/**** ¹Ù ŸÀÌƲ ½ºÅ¸ÀÏ ****/


/**** µµÆ® ½ºÅ¸ÀÏ ****/
.dot_list {}
.dot_list li {position:relative; padding-left:12px; box-sizing:border-box;}
.dot_list li + li {margin-top:3px;}
.dot_list li:before {display:block; content:''; width:3px; height:3px; background:var(--basic); border-radius:100%; position:absolute; left:0; top:14px;}
/**** µµÆ® ½ºÅ¸ÀÏ ****/

/**** ¼ýÀÚ ½ºÅ¸ÀÏ ****/
.num_tit {position:relative; display:flex; gap:10px; align-items: center}
.num_tit span {border-radius:100%; width:35px; height:35px; font-size:14px; letter-spacing:-0.42px; color:var(--main); border:1px solid var(--main); display:block; display:flex; align-items: center; justify-content: center;}
/**** ¼ýÀÚ ½ºÅ¸ÀÏ ****/


/**** ÇÁ·Î¼¼½º ÀÏÁ¤ ½Ã°£ ·Ñ¸µ ****/
.process_list {display:flex; flex-wrap:wrap; gap:15px;}
.process_list dl {width:calc((100% - 15px) / 2); display:flex; align-items: center; padding:15px 20px; box-sizing:border-box; border-radius:var(--borderR10); background:var(--grayBg); transition:all .4s ease;}
.process_list dl dt {width:50px; height:24px; line-height:24px; font-size:14px; letter-spacing:-0.42px; background:var(--main); font-weight:700; color:var(--white); border-radius:100px; text-align:center; transition:all .4s ease;}
.process_list dl dd {width:calc(100% - 50px); padding-left:20px; box-sizing:border-box; color:var(--black); transition:all .4s ease;}

.process_list dl.active {background:var(--main);}
.process_list dl.active dt {background:var(--white); color:var(--main)}
.process_list dl.active dd {color:var(--white);}

.process_list dl:hover {background:var(--main);}
.process_list dl:hover dt {background:var(--white); color:var(--main)}
.process_list dl.:hover dd {color:var(--white);}
/**** ÇÁ·Î¼¼½º ÀÏÁ¤ ½Ã°£ ·Ñ¸µ ****/

/**** ÇÁ·Î¼¼½º ÀÏÁ¤ ½Ã°£ ·Ñ¸µ.ver2 ****/
.process_list.ver2 {}
.process_list.ver2 dl {width:100%;}
/**** ÇÁ·Î¼¼½º ÀÏÁ¤ ½Ã°£ ·Ñ¸µ.ver2 ****/

/**** ¹Ú½º¸®½ºÆ® ****/
.box_list {display:flex; flex-wrap:wrap; gap:30px;}
.box_list dl {box-sizing:border-box; border:1px solid var(--border); text-align:center; border-radius:var(--borderR20); padding:60px; width:calc((100% - 60px) / 3);}
.box_list dl dt {}
.box_list dl dt img {max-width:100%; height:auto; width:70px;}
.box_list dl dd {margin-top:25px;}
.box_list dl dd h4 {font-family:var(--title); margin-bottom:10px;}
/**** ¹Ú½º¸®½ºÆ® ****/




/**** ÀÌ¿ë¾à°ü, °³ÀÎÁ¤º¸Ãë±Þ¹æħ ****/
.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:-0.02em; 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:-0.02em;}
.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:-0.02em; 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);} 


.search_con .subtitle {padding-top:0 !important;}


/**** ¸ð¹ÙÀϽº¿ÍÀÌÇÁ ****/
.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:var(--white); 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 ~1300px
*******************************************************************************/
@media all and (max-width:1300px){

/**** sticky 2´Ü Ʋ ****/
.sticky_cont {display:flex; flex-wrap:wrap;}
.sticky_cont .sticky_in {width:100%; padding:0 0 0 0;}
.sticky_cont .cont_in{width: 100%; margin-top:50px;}
.sticky_cont .sticky_in .sticy_tit h4 br {display:none;}
/**** sticky 2´Ü Ʋ ****/

}

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

/**** ¼­ºêž ****/
#visual{width: calc(100% - 60px); height: 400px;}
#visual .v_txt h3{font-size:2.778rem;}
#visual .v_txt p{padding: 20px 0 0;}



/**** lnb ****/
.mobile_snb{max-width:70%; padding: 10px 10px 0 10px; }
.mobile_snb:before{width: 30px;	height: 30px; left:-30px; bottom:0;}
.mobile_snb:after{width: 30px;	height: 30px; right:0; top:-30px;}
.mobile_snb .tbox .home{width: 60px;}
.mobile_snb .tbox .home a{height: 60px;}

.mobile_snb .tbox .box{width: calc((100% - 60px)/2); padding-left: 5px;}
.mobile_snb .tbox .box .dropLst > a{line-height: 60px;}
.mobile_snb .tbox .box .dropLst .dlst{top:60px;}



/**** ŸÀÌƲ ****/
.subtitle{padding: 80px 0 30px;}
.subtitle h3{font-size:2.222rem;}


/**** ¼­ºêÆäÀÌÁö °øÅë ****/
.subpad {padding:100px 0; }
.subpad_t {padding:100px 0 0; }
.subpad_b {padding:0 0 100px; }


/**** ÅǸ޴º ****/
.cate_tab {margin: 0 auto 40px; }
.cate_tab ul{padding:10px; }
.cate_tab ul li a{padding:0 10px; line-height:50px; height: 50px; }
/**** ÅǸ޴º ****/


/**** sticky 2´Ü Ʋ ****/
.sticky_cont .cont_in{width: 100%; margin-top:35px;}
/**** sticky 2´Ü Ʋ ****/


/**** ¹Ù ŸÀÌƲ ½ºÅ¸ÀÏ ****/
.deco_tit {padding-top:10px;}
.deco_tit:before { height:4px; width: 37px;}
/**** ¹Ù ŸÀÌƲ ½ºÅ¸ÀÏ ****/

/**** µµÆ® ½ºÅ¸ÀÏ ****/
.dot_list li {padding-left:10px;}
.dot_list li:before {top:13px;}
/**** µµÆ® ½ºÅ¸ÀÏ ****/

/**** ¼ýÀÚ ½ºÅ¸ÀÏ ****/
.num_tit {gap:8px;}
.num_tit span {width:30px; height:30px; font-size:12px; }
/**** ¼ýÀÚ ½ºÅ¸ÀÏ ****/

/**** ÇÁ·Î¼¼½º ÀÏÁ¤ ½Ã°£ ·Ñ¸µ ****/
.process_list {gap:10px;}
.process_list dl {width:calc((100% - 10px) / 2); padding:13px 18px; }
.process_list dl dt {width:45px; height:22px; line-height:22px; font-size:12px;}
.process_list dl dd {width:calc(100% - 45px); padding-left:15px; }
/**** ÇÁ·Î¼¼½º ÀÏÁ¤ ½Ã°£ ·Ñ¸µ ****/

/**** ¹Ú½º¸®½ºÆ® ****/
.box_list {gap:20px;}
.box_list dl {padding:45px 5%; width:calc((100% - 40px) / 3);}
.box_list dl dt img {width:55px;}
.box_list dl dd {margin-top:20px;}
.box_list dl dd h4 {margin-bottom:8px;}
/**** ¹Ú½º¸®½ºÆ® ****/


/**** ÀÌ¿ë¾à°ü, °³ÀÎÁ¤º¸Ãë±Þ¹æħ ****/
.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{width: calc(100% - 30px); height: 300px;}
#visual .v_txt{top:40%;}
#visual .v_txt h3{font-size:2.222rem;}
#visual .v_txt p{padding: 12px 0 0;}

/**** lnb ****/
.mobile_snb{max-width:100%; padding:5px 10px; border-radius:0;}
.mobile_snb:before{width: 20px;	height: 20px; left:0; bottom:auto; top:-20px; transform:rotate(90deg); }
.mobile_snb:after{width: 20px;	height: 20px; right:0; top:-20px;}
.mobile_snb .tbox{align-items:center;}
.mobile_snb .tbox .home{width: 40px;}
.mobile_snb .tbox .home a{height: 40px;}
.mobile_snb .tbox .home a svg{width: 16px; height:auto;}

.mobile_snb .tbox .box{width: calc((100% - 40px)/2); padding-left: 5px;}
.mobile_snb .tbox .box .dropLst > a{padding: 0 40px 0 10px; line-height: 50px;}
.mobile_snb .tbox .box .dropLst > a:after{width: 20px; height: 20px; line-height: 20px; font-size:20px; margin-top: -10px;}
.mobile_snb .tbox .box .dropLst .dlst{top:50px; padding: 20px 15px;}
.mobile_snb .tbox .box .dropLst .dlst ul{}
.mobile_snb .tbox .box .dropLst .dlst ul li{margin: 0 0 8px;}



/**** ŸÀÌƲ ****/
.subtitle{padding: 40px 0 20px;}
.subtitle h3{font-size:1.778rem;}

/**** ¼­ºêÆäÀÌÁö °øÅë ****/
.subpad {padding:50px 0; }
.subpad_t {padding:50px 0 0; }
.subpad_b {padding:0 0 50px; }

/**** ÅǸ޴º ****/
.cate_tab {margin: 0 auto 30px; }
.cate_tab ul{flex-wrap:wrap;}
.cate_tab ul li {width:50%; flex:unset;}
.cate_tab ul li a{padding:0 6px; line-height:45px; height: 45px; }

/**** ÅǸ޴º ****/





/**** sticky 2´Ü Ʋ ****/
.sticky_cont .cont_in{margin-top:15px;}
/**** sticky 2´Ü Ʋ ****/



/**** ¹Ù ŸÀÌƲ ½ºÅ¸ÀÏ ****/
.deco_tit {background-position: right; }
.deco_tit:before { height:4px; width: 27px;}
/**** ¹Ù ŸÀÌƲ ½ºÅ¸ÀÏ ****/

/**** µµÆ® ½ºÅ¸ÀÏ ****/
.dot_list li {}
.dot_list li:before {top:10px;}
/**** µµÆ® ½ºÅ¸ÀÏ ****/

/**** ¼ýÀÚ ½ºÅ¸ÀÏ ****/
.num_tit {gap:6px;}
.num_tit span {width:26px; height:26px; font-size:11px; }
/**** ¼ýÀÚ ½ºÅ¸ÀÏ ****/

/**** ÇÁ·Î¼¼½º ÀÏÁ¤ ½Ã°£ ·Ñ¸µ ****/
.process_list {gap:10px;}
.process_list dl {width:100%; padding:10px 15px; }
.process_list dl dt {width:40px; height:20px; line-height:20px; font-size:11px;}
.process_list dl dd {width:calc(100% - 40px); padding-left:10px;}
/**** ÇÁ·Î¼¼½º ÀÏÁ¤ ½Ã°£ ·Ñ¸µ ****/


/**** ¹Ú½º¸®½ºÆ® ****/
.box_list {gap:10px; flex-wrap:wrap;}
.box_list dl {padding:20px 5%; width:100%;}
.box_list dl dt img {width:40px;}
.box_list dl dd {margin-top:15px;}
.box_list dl dd h4 {margin-bottom:4px;}
/**** ¹Ú½º¸®½ºÆ® ****/





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



/**** ÇÁ·Î¼¼½º ÀÏÁ¤ ½Ã°£ ·Ñ¸µ ****/
.process_list dl {flex-wrap:wrap;}
.process_list dl dd {width:100%; padding-left:0; padding-top:5px;}
/**** ÇÁ·Î¼¼½º ÀÏÁ¤ ½Ã°£ ·Ñ¸µ ****/

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




}