@charset "utf-8";

#header .container{max-width:1240px;width:100%;margin:0 auto;}

.left{text-align:left;}
.right{text-align:right;}
.center{text-align:center;}

.f_left{float:left;}
.f_right{float:right;}
html,body{height:100%;}



/* **********header*********** */
#header{position:relative;width:100%;height:142px;background:#fff;}
#header .logo{position:absolute;top:62px;left:50%;transform:translateX(-600px);-webkit-transform:translateX(-600px);-ms-transform:translateX(-600px);-moz-transform:translateX(-600px);z-index:9999;}
#header .logo a{display:block;width:140px;height:56px;background:url(/images/common/logo.png) no-repeat 0 50%;}
#header .util{position:relative;height:42px;text-align:right;border-bottom: 1px solid #efeff0;}
#header .util ul{display:inline-block;position:relative;}
#header .util ul li{float:left;}
#header .util ul li a{position:relative;display:block;padding:0 10px;font-size:14px;line-height:42px;color:#8e9194;letter-spacing:0;}
#header .util ul li a:before{position: absolute;top: 50%;left: -2px;width: 3px;height: 3px;background-color: #c9cacf;content: "";margin-top: -1px;border-radius: 50%;}
#header .util ul li:nth-child(2) a {color:#000;}
#header .util ul li:first-child a:before, #header .util ul li.chkakao a:before{display:none;}
#header .util ul li.site_map{position:absolute;top:80px;right:0;z-index:56;}
#header .util ul li.mo_menu{display:none;position:absolute;top:24px;right:0;z-index:2;}
#header .util ul li.site_map a,#header .util ul li.mo_menu a{padding:0;width:28px;height:22px;line-height:1;}
#header .util ul li.site_map a:before, #header .util ul li.mo_menu a:before, #header .util ul li.mypage a:before{display:none;}
.site_map .line,.mo_menu .line{display:inline-block;position:absolute;left:0;width:28px;height:2px;background:#000;}
.site_map .line:nth-of-type(1),.mo_menu .line:nth-of-type(1){top:0;width:17px;}
.site_map .line:nth-of-type(2),.mo_menu .line:nth-of-type(2){top:50%;margin-top:-1px;}
.site_map .line:nth-of-type(3),.mo_menu .line:nth-of-type(3){bottom:0}
#header .util ul li.mypage{position:absolute;top:72px;right:48px;z-index:56;}
#header .util ul li.mypage a{display: inline-block;width: 40px;height: 40px;background-position: -41px 0;vertical-align: middle;padding: 0;line-height: 40px;}
#header .util ul li.search{position:absolute;top:72px;right:103px;z-index:56;}
#header .util ul li.chkakao {position:absolute;top:72px;right:158px;z-index:56;}
#header .util ul li.chkakao a{display: inline-block;width: 40px;height: 40px;background-position: -245px -79px;vertical-align: middle;padding: 0;line-height: 40px;}
#header .util ul li.instagram {position:absolute;top:72px;right:214px;z-index:56;}
#header .util ul li.instagram a{display: inline-block;width: 40px;height: 40px;background-position: -286px -79px;vertical-align: middle;padding: 0;line-height: 40px;}
#header .util ul li.instagram a:before {display: none;}

/* 2023-03-22 commonNew.css 재작성
.search-wrapper {position: relative;}
.search-wrapper.active {}
.search-wrapper .input-holder {
    overflow: hidden;
    height: 40px;
	width:40px;
    background: rgba(255,255,255,0);
    border-radius:6px;
    position: relative;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.search-wrapper.active .input-holder {
    border-radius: 50px;
    width:400px;
	height: 65px;
    background: #fff;
	margin-top: -15px;
	border: 1px solid #3d94de;
    -webkit-transition: all .5s ;
    -moz-transition: all .5s;
    transition: all .5s;
	box-shadow: 0px 6px 10px 0px rgba(0, 0, 0, 0.1);
}
.search-wrapper .input-holder .search-input {
    width:100%;
    height: 41px;
    padding:0px 70px 0 20px;
    opacity: 0;
    position: absolute;
    top:0px;
    left:0px;
    background: transparent;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border:none;
    outline:none;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    color:#000;
    -webkit-transform: translate(0, 20px);
    -moz-transform: translate(0, 20px);
    transform: translate(0, 20px);
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    transition: all .3s;
    -webkit-transition-delay: 0.3s;
    -moz-transition-delay: 0.3s;
    transition-delay: 0.3s;
}
.search-wrapper.active .input-holder .search-input {
    opacity: 1;
    -webkit-transform: translate(0, 10px);
    -moz-transform: translate(0, 10px);
    transform: translate(0, 10px);
}

.search-wrapper .input-holder .search-icon {
    width:40px;
    height:40px;
    border:none;
    border-radius:50%;
    background: #a0a0a0;
    padding:0px;
    outline:none;
    position: relative;
    z-index: 2;
    float:right;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.search-wrapper.active .input-holder .search-icon {
    width: 50px;
    height:50px;
    margin:6px 65px 6px 6px;
    border-radius: 30px;
}
.search-wrapper .input-holder .search-icon span {
    width:22px;
    height:22px;
    display: inline-block;
    vertical-align: middle;
    position:relative;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: all .4s cubic-bezier(0.650, -0.600, 0.240, 1.650);
    -moz-transition: all .4s cubic-bezier(0.650, -0.600, 0.240, 1.650);
    transition: all .4s cubic-bezier(0.650, -0.600, 0.240, 1.650);

}
.search-wrapper.active .input-holder .search-icon span {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.search-wrapper .input-holder .search-icon span::before, .search-wrapper .input-holder .search-icon span::after {
    position: absolute;
    content:'';
}
.search-wrapper .input-holder .search-icon span::before {
    width: 2px;
    height: 10px;
    left: 9px;
    top: 15px;
    border-radius: 2px;
    background: #fff;
}
.search-wrapper .input-holder .search-icon span::after {
    width: 16px;
    height: 16px;
    left: 3px;
    top: 0px;
    border-radius: 16px;
    border:2px solid #fff;
}

.search-wrapper .close {
    position: absolute;
    z-index: 1;
    top:8px;
    right:8px;
    width:25px;
    height:25px;
    cursor: pointer;
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    transform: rotate(-180deg);
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    transition: all .3s;
    -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
    transition-delay: 0.2s;
}
.search-wrapper.active .close {
    right:25px;
	top: 22px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: all .6s;
    -moz-transition: all .6s;
    transition: all .6s;
    -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
    transition-delay: 0.2s;
}
.search-wrapper .close::before, .search-wrapper .close::after {
    position:absolute;
    content:'';
    background: #000;
    border-radius: 2px;
}
.search-wrapper .close::before {
    width:2px;
    height: 23px;
    left: 10px;
    top: 0px;
}
.search-wrapper .close::after {
    width: 23px;
    height:2px;
    left: 0px;
    top: 10px;
}
.search-wrapper .result-container {
    width: 50%;
    position: absolute;
    top:80px;
    left:0px;
    text-align: center;
    font-size: 14px;
    display:none;
    color:#B7B7B7;
	padding: 8px;
	border-radius: 4px;
	background:rgb(0, 0, 0, 0.4);
}

@media screen and (max-width: 560px) {
    .search-wrapper.active .input-holder {width:200px;}
}
 */




#animate{z-index:100;position:relative;height:100px;overflow:hidden;background:#fff ;transition:background .3s ease-out;z-index:1;}
/*#animate:before{content:"";position:absolute;left: 50%;margin-left: -618px;top:100px;width:300px;height:190px;background:url(/images/common/bg_gnb2.png) no-repeat 16% 42%;}*/
#animate:after{content:"";position:absolute;left:0;right:0;top:98px;bottom:0;height:100%;width:100%;background:#fff;opacity:0;z-index:-1;} /* gnb ���� */
#gnb.action #gnbwrap:before{opacity:1;padding:0;}

.style{height: 142px;transition: background .3s ease-out;}
#gnb.action{border-bottom:1px solid #107fd0;}
#gnb.action #animate{position:relative;border-bottom:2px solid #107fd0;}
#gnb.action #animate:after{opacity:1;}

#gnb{position:relative;height:100px;z-index:55;}
#gnb.action:before{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:#ddd;z-index:2;}
#gnb #tm{text-align: center;font-size:0;}

#gnb #tm .th1{display:inline-block;position:relative;}
#gnb #tm .th1 > a{display:block;overflow:hidden;font-size:22px;line-height:100px;color:#000;font-weight:400;}
#gnb #tm .th1 > a:hover,
#gnb #tm .th1 > a:focus{color:#107fd0;outline:0;}
#gnb #tm .th1:hover > a{color:#107fd0;outline:0;}
#gnb #tm .th1 > a span{display:inline-block;position:relative;height:100%;padding:0 40px;font-family:'godo';}
#gnb #tm .th1 > a span:before{content:"";display:block;position:absolute;left:50%;bottom:2px;width:0%;height:3px;background:#107fd0;opacity:0;transition:.3s;-webkit-transition:.3s;-moz-transition:.3s;}
#gnb #tm .th1 > a:hover span:before,
#gnb #tm .th1 > a:focus span:before{left:0;opacity:1; width: 100%;}

#tm .th2{display:none;position:absolute;width:100%;padding-top:25px;text-align:center;}
/*#gnb #tm .th1:first-child .th2:before{content: "";position: absolute;left: 50%;margin-left: 660px;bottom: -84px;width: 172px;height: 168px;background: url(/images/common/bg_gnb2.png) no-repeat 16% 42%;z-index: 2;}*/
#gnb.action #tm .th2{display:block;transition:all .3s ease }
#tm .th2 li > a{padding:0 10px;line-height:40px;font-size:17px;color:#333;text-align:center;}
#tm .th2 li > a:hover {color:#107fd0;transition:all .3s ease}
#tm .th2 li a span {position:relative}

/* th2 ���ٳֱ� �κ�*/
#tm .th2 li a span::after {
  content: '';
  width: 0%;
  left: 50%;
  top:25px;
  height: 1px;
  display: block;
  position: absolute;
  margin-top: 0px;
  border-bottom: 1px solid #107fd0;
  transition:all .3s ease;
}
#tm .th2 li:hover a span::after {
  content: '';
  width: 100%;
  left: 0px;
  top:25px;
  height: 1px;
  display: block;
  position: absolute;
  margin-top: 0px;
  border-bottom: 1px solid #107fd0;
  transition:all .3s ease;
}



/* mobile gnb*/
#shadow_device{display:none;position:fixed;top:0;right:0;z-index:999;width:100%;height:100%;background-color:#000;opacity:0.7}
#touchArea{display:none;position:absolute;top:0;left:0;z-index:1000;width:100%;height:100%}
#topmenu{display:none;overflow:hidden;overflow-y:auto;position:absolute;top:0;right:-250px;z-index:1040;width:250px;height:100%;background:#505256}
#topmenu h1{display:none}
#topmenu .m_util{position:relative;height:100px;padding:16px 10px 13px 10px;background: #1b507c;}
#topmenu .m_util a{ position: relative;display:inline-block;padding:0 12px;font-size:13px;line-height:36px;color: #fff;}
#topmenu .m_util a:after {display: block;position: absolute;right: 0;top: 50%;content: '';width: 1px;height: 12px;margin-top: -6px;background: #d9d9d9;}
#topmenu .m_util a:last-child:after {display: none;}

#close_topmenu{display:block;position:absolute;top:10px;left:12px;width:26px;height:25px;}
#close_topmenu .line{display:inline-block;position:absolute;left:-1px;top:11px;width:29px;height:2px;background:#fff;}
#close_topmenu .line:nth-of-type(1){-webkit-transform: rotate( -45deg );-ms-transform: rotate( -45deg );-moz-transform: rotate( -45deg );transform: rotate( -45deg );}
#close_topmenu .line:nth-of-type(2){-webkit-transform: rotate( 45deg );-ms-transform: rotate( 45deg );-moz-transform: rotate( 45deg );transform: rotate( 45deg );}

#gnb_device .th1{border-bottom:1px solid rgba(255,255,255,.2)}
#gnb_device .th1 .th1_lnk{display:block;position:relative;padding:18px 0 18px 30px;font-size:17px;line-height:1;color:#fff}
#gnb_device .th1 .th1_lnk:after{display:block;position:absolute;right: 18px;top: 20px;width: 10px;height: 10px;border-width:1px;border-style: solid;border-color: #fff;border-width: 1px 1px 0 0;transform: rotate(45deg);-webkit-transform: rotate(45deg);content:'';}

#gnb_device .th1 .th1_lnk.ov{background-color:#107fd0;color:#fff}
#gnb_device .th2{padding:15px 0;border-bottom:1px solid #e5e5e5;background:#f7f7f7}
#gnb_device .th2>li>a{display:block;position:relative;padding:0 9%;font-size:15px;line-height:28px;color:#333}
#gnb_device .th2>li>a:before{content:"";display:inline-block;margin-right:4px;width:3px;height:3px;background:rgba(0,0,0,.5);vertical-align:middle;}
#gnb_device .th2>li>a:hover,
#gnb_device .th2>li>a:focus{color:#000}

/* sub_visual*/
#sub_visual{position:relative;}
#sub_visual .sub_visual_wrap{padding:67px 0 0 0;height:248px;background:#000 url(/images/main/bg_subvisual.jpg) no-repeat 50% 50%;background-size:cover;}
#sub_visual .sub_visual_tit{display:block;font-size:35px;color:#fff;line-height:76px;font-weight:700;text-align:center;}
#sub_visual .location{text-align:center;}
#sub_visual .location_inner{display:inline-block;}
#sub_visual .location_inner ul{}
#sub_visual .location_inner ul li{display:inline-block;position:relative;vertical-align:middle;}
#sub_visual .location_inner ul li a{display:block;padding:0 14px 0 19px;font-size:14px;line-height:24px;color:#fff;}
#sub_visual .location_inner ul li.home a{padding: 0;margin-right: 14px;width:16px;height:16px;background:url(/images/main/location_home.png) no-repeat;}
#sub_visual .location ul li a:before{content:"";display:block;position:absolute;left:0;top:7px;width:5px;height:10px;background:url(/images/main/location_arr.png) no-repeat;}
#sub_visual .location ul li.home a:before{display:none;}
#sub_visual .share{display:inline-block;}
#sub_visual .share ul li{display:inline-block;position:relative;margin-left:4px;vertical-align:middle;}
#sub_visual .share ul li a:before{display:none;}
#sub_visual .share .sns button{display:inline-block;width:33px;height:32px;background:url(/images/main/ico_share_sns.png) no-repeat;}
#sns-group{display:none;position: absolute;top: 38px;left: 50%;margin-left: -64px;width: 116px;border: 1px solid #ddd;background: #fff;}
.open+#sns-group{display:block;}
#sns-group a{display: inline-block;overflow: hidden;position: relative;width: 33px;height: 33px;background:#1db9ff;border-radius:50%;text-indent:-9999em;}
#sns-group a:before{display:block;height:110%;content:''}
#sns-group a.tw{background:#1db9ff;}
#sns-group a.fb{background:#3b5b9a;}
#sns-group a.kakao{background:#fcd500;}

#sub_visual .share .print button{display:inline-block;width:33px;height:32px;background:url(/images/main/ico_share_print.png) no-repeat;}
#sub_nav{height:85px;background:#705e4c;}

#sub_nav ul li{display:block;float:left;width:100%}
#sub_nav ul.n2 li{width:50%;}
#sub_nav ul.n3 li{width:33.3%;}
#sub_nav ul.n4 li{width:25%;}
#sub_nav ul.n5 li{width:20%;}
#sub_nav ul.n6 li{width:16.6%;}
#sub_nav ul li a{display:block;position:relative;height:100%;font-size:15px;line-height:85px;color:#fff;text-align:center;}
#sub_nav ul li a:before{content:"";position:absolute;left:0;top:37px;width:1px;height:12px;background:rgba(255,255,255,0.5);}
#sub_nav ul li a:hover,
#sub_nav ul li a:focus,
#sub_nav ul li a.ov{background:#fff;color:#010101;}
#sub_nav ul li:first-child a:before,
#sub_nav ul li a:hover:before,
#sub_nav ul li a:focus:before,
#sub_nav ul li a.ov:before{display:none;}

/* contents*/
#contents{position:relative;}
#contents .contents_wrap{padding:87px 0 80px;min-height:400px;}
#contents .contents_tit{display:block;margin-bottom:20px;font-size:34px;color:#564738;letter-spacing:-0.075em;text-align:center;}

/* footer */
#footer{padding:55px 0;background:#4f5b68;}
#footer .flogo {display: inline-block;position: absolute;left: 0;top:0; border: none;display: block;width: 202px;height: 44px;background: url(/images/common/flogo.png) no-repeat 0 50%;}
#footer .flogo span{display: inline-block;position: absolute;left: 0;top: -10px;}
#footer .footer-info {padding-left: 270px;}
#footer .footer-info ul {margin:0 0 30px;}
#footer .footer-info ul:after {display:block; clear:both; visibility:hidden; content:'';}
#footer .footer-info ul li {display: inline-block; position:relative;margin-right:36px;}
#footer .footer-info ul li:after {display:block; position:absolute;top:4px; right:-18px; content:''; width:1px; height:11px; background:#a0a7b0;}
#footer .footer-info ul li:last-child {margin-right:0;}
#footer .footer-info ul li:last-child:after {display:none;}
#footer .footer-info ul li a {display:block; font-size:15px; color:#fff;}
#footer .footer-info ul li:first-child a {font-weight:700;color: #66def3;}
#footer .footer-info address {display:block; font-size:14px; color:#fff;}
#footer .footer-info address span {display:inline-block; font-size:14px; color:#fff;}
#footer .footer-info .copy {display:block; margin:3px 0 0 0;font-size:14px; color:#fff;line-height: 1.4;}

#footer .selectbox{position:absolute; right:100px; top:70px; width:224px; height:42px; font-family:"Noto Sans KR"; box-sizing:border-box;}
#footer .selectbox .tis{display:block; width:100%; height:40px; font-size:15px; font-weight:400;}
#footer .selectbox .tis a{
	display:block; position:relative; width:100%; height:100%; line-height:40px; padding:0 50px 0 30px; text-decoration:none; color:rgba(255,255,255,0.5); background-color:#181b21; box-sizing:border-box;
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
}
#footer .selectbox .tis a:after{
	content:""; display:block; position:absolute; right:19px; top:50%; width:13px; height:8px; margin-top:-4px; background-image:url(/kr/images/layout/selectbox_bul.png); background-repeat:no-repeat; background-position:center center;
	transform:rotate(0deg);
	-webkit-transform:rotate(0deg);
	transition:transform 0.3s ease;
	-webkit-transition:transform 0.3s ease;
}
#footer .selectbox .lists{
	position:absolute; left:0; bottom:42px; width:100%; height:0; padding:0px 30px; background-color:#181b21; box-sizing:border-box;
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
}
#footer .selectbox .lists .mCSB_scrollTools{opacity:1 !important; width:2px !important;}
#footer .selectbox .lists ul li{padding:6px 0;}
#footer .selectbox .lists ul li a{display:block; position:relative; line-height:15px; font-family:"Noto Sans KR"; font-size:14px; color:rgba(255,255,255,0.5);}
#footer .selectbox .lists ul li a:hover{text-decoration:none; font-weight:500; color:#fff;}
#footer .selectbox.on{overflow:visible;}
#footer .selectbox.on .tis a{background-color:#181b21;}
#footer .selectbox.on .tis a:after{
	transform:rotate(180deg);
	-webkit-transform:rotate(180deg);
}
#footer .selectbox.on .lists{height:160px; padding:30px; border-bottom:1px solid #23262f;}



@media only screen and (max-width:1200px) {
	#header .container{padding:0 30px;}
	#header .logo{margin-left:9%;}
	#gnb #tm .th1 > a span{padding:0 30px;}

}
@media only screen and (max-width:1023px) {
	#header{height:100px;}
	#header .logo{margin-left:0;top:30px;left:30px;transform:translateX(0);-webkit-transform:translateX(0);-ms-transform:translateX(0);-moz-transform:translateX(0);}
	#header .util{height:0;}
	#header .util ul li{display:none;}
	#header .util ul li.mo_menu{display:block;}
    #header .util ul li.chkakao {display: block;top: 16px;right: 45px;}
    #header .util ul li.instagram {display: block;top: 16px;right: 95px;}
	#gnb{display:none;}
	#sub_visual .sub_visual_tit{font-size:32px;}
	#sub_nav{display:none;}
	#contents .contents_wrap{padding:30px 0;}
	#contents .contents_tit{font-size:28px;}
	#footer{padding: 35px 30px;}
}

@media only screen and (max-width:760px) {
	#header .container{padding:0 15px;}
	#header{height:80px;}
	#header .logo{left:15px;top:20px;}
	#header .logo a{height: 38px;background-size: 75%;}
	#header .util ul li.mo_menu{top:15px;}
    #header .util ul li.chkakao, #header .util ul li.instagram {top: 7px;}
	#sub_visual .sub_visual_wrap{height: 220px;padding: 44px 0 0 0;}
	#sub_visual .sub_visual_tit{font-size:28px;line-height:52px;}
	#sub_visual .location_inner,#sub_visual .share{display:block;}
	#sub_visual .share{margin-top:20px;}
	#contents .contents_tit{font-size:24px;}

	#footer{padding:15px 0 30px 0;}
	#footer .address{margin-top:15px}
	#footer .address p{line-height:18px;}
	#footer .flogo {width: 80px;left: 50%;margin-left: -40px;background-size: 80px;}
	#footer .footer-info {padding-left: 0;padding-top: 60px;text-align: center;}
	#footer .footer-info ul {margin: 0 0 10px;}
 

}


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

}

#returnTop{display:none;z-index: 10000;position: fixed;bottom: 20px;right: 20px;}
#returnTop a{display:block;width:50px;height:50px;padding-top:9px;text-align:center;font-weight:100;font-size:10px;letter-spacing:1px;background-color:#858b98;color:#fff;}
#returnTop a img{display:block;margin:0 auto 5px;} 
  
#returnTop.static{position:relative;bottom:0;right:0;}
#returnTop.static a{position:absolute;top:-25px;right:20px;}


@media (max-width:1770px) {
#returnTop{}

#returnTop a{right:15px;}
}