@charset "utf-8";



#wrap {width:100%; margin:auto; /* overflow-x:hidden; */}

#hd_pop {display:none;}
#hd_login_msg {display:none;}

#wrap a, #contents a {text-decoration:none;} 


/* login / join */

.login_input {border:1px solid #aaa;}
.login_input > div {padding-left:55px;}
.id {background:url(../images/id_bg.png) no-repeat; border-bottom:1px solid #ddd;}
.pw {background:url(../images/pw_bg.png) no-repeat;}

	.loginBox {display:none;z-index:6000;position:fixed;top:0;width:100%;height:100%;background:rgba(0,0,0,0.75)}
	.loginBox .in {position:fixed; width:100%; max-width:500px; top:50%; left: 50%; right:0; margin-left:-250px; margin-top:-238px; background:#fff; padding:50px; overflow: auto;}
	.loginBox .close{position:absolute; top:25px; right:15px; width:40px; cursor:pointer}

	.loginBox .in h2 {text-transform:uppercase; text-align:center; margin-bottom:20px;}
	.loginBox .in h2:before {display: block; content: ''; width: 100px; height: 3px; background: #c40c32; margin:0 auto 10px;}



	/* 버튼 스타일 */
	.login_btn > button {width:100%; height:50px; font-family:inherit; cursor:pointer;}
			button.rBtn {background:#c40c32; color:#fff;}
			button.bBtn {background:#444; color:#fff; margin-top:5px;}
			button.fBtn {background:#fff; color:#666; font-size:14px; cursor:pointer; padding-right:5px; font-weight:500}


	.other {margin:10px 0 25px; width:100%; display:inline-block;}

	/* 로그인 인풋 */
	.login_input > div input {width:100%; padding:3px 20px 3px 3px; float:none; height: 60px; color:#666; background-color: #fff; -webkit-appearance: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;  border-style:none; padding:0 20px;}
	.login_input > div input:-internal-autofill-selected {background-color:#fff !important;}
	.login_input > div input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px #fff inset;}

	.keep {padding-left:5px; float:left;}


	/* ID / PW 찾기 */
	.findBtn {float:right;}
	.find {width:65%; margin:auto;}















/* 인풋 박스 공통 */	
	label {font-weight:normal;  margin-bottom:0; cursor:pointer;}
	.sub input[type=text] {height: 40px; border: 1px solid #ddd; padding: 0 15px; width:100%;}
	.sub input.halfIn {width:50%;}
	.sub input.divIn {width:30%; height: 40px; border: 1px solid #ddd; padding: 0 15px;}

	.inputt {font-size: 14px; padding:8px 15px; text-align:left; float: left; border: 1px solid #ddd; width:100%;}
	/* input[type="checkbox"] {position: absolute; width:1px; height:1px; padding:0; margin:-1px; overflow: hidden; clip:rect(0,0,0,0); border:0}
	input[type="checkbox"] + label {display: inline-block; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; font-size:14px; font-weight:normal;}
	input[type="checkbox"] + label:before {content: ' ';display: inline-block;width:18px;height: 18px; line-height: 18px;margin: -2px 8px 0 0;text-align: left;vertical-align: middle; background:#fafafa; border:1px solid #aaa;} */
	.sub textarea {border: 1px solid #ddd; padding: 0 15px; width:100%;}




/* 팝업레이어 */
#hd_pop {z-index:1000;position:relative;margin:0 auto;width:970px;height:0}
#hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
.hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff}
.hd_pops_con {}
.hd_pops_footer {padding:10px 0;background:#000;color:#fff;text-align:right}
.hd_pops_footer button {margin-right:5px;padding:5px 10px;border:0;background:#393939;color:#fff}

/* 상단 레이아웃 */
#hd {z-index:4;position:relative;min-width:970px;background:#fff}
.hd_zindex {z-index:10 !important}
#hd_h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#hd_wrapper {position:relative;margin:0 auto;padding:26px 0;width:970px;zoom:1}
#hd_wrapper:after {display:block;visibility:hidden;clear:both;content:""}

/* #logo {float:left;padding:5px 0 0} */



/* 우측 배너 */
#rightBanner {position: absolute; width:120px;z-index:100; top:900px; right:5px; }
#rightBanner .banner {}
#rightBanner .banner > ul {margin:10px 0 0 0;}
#rightBanner .banner > ul li {display:none;}
#rightBanner .banner > ul li:first-child {display:block;}
#rightBanner .banner.fixed { position: fixed;  top: 70px; }


/* 롤링텍스트 */
.notice{width:100%; height:40px; overflow:hidden; background-color:#eceff8;}
	.rolling{position:relative; width:100%; height:auto;}
	.rolling li{width:100%; height:40px; line-height:40px; text-align:center; font-size:15px;}


/* 로그인/조인 버튼 */
.my_menu {position:absolute; right:0; top:0; background:#d2d7e5; height:40px;}
.my_menu ul {}
.my_menu ul li {float:left; text-align:center; width:80px;}
.my_menu ul li a {display:block; padding:10px; font-size:12px; color:#222}
	.my_menu ul li a:hover {font-weight:500;}



/* gnb 헤더 */
#header{background:#fff; position:fixed; z-index:5000;top:40px;width:100%; height:70px; -webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out}
#header:after {display:block; content:''; clear:both}
	.header {width:100%; margin:0 auto;}
	.header:after {display:block; content:''; clear:both}
		.header .logo {float:left; text-align:center; padding-left:10px;}
			.header .logo a {display:block; line-height:70px;}
			.header .logo a img {width:100%; max-width:165px; vertical-align:middle;}
		
		/* gnb */
		 .header .gnb {width:78%; position:absolute; left:50%; transform:translateX(-50%); display:inline-block; text-align:center;}
			.gnb ul {position: relative; margin: 0;	padding: 0;	list-style: none;}
			.gnb ul::after {display: block;	clear: both; content: '';}
			.gnb ul li {position: relative;	/* float: left; */}
				

			.gnb ul li:hover {background-color: rgba(255,255,255,.5);}

			.gnb ul li a {display:block; text-decoration:none;}
			.gnb ul ul {position: absolute;	top: 100%; visibility: hidden; opacity: 0;	transition: .2s ease-in-out;}
			.gnb ul ul li {float:none;	margin:0; padding:0 20px;}
			
			.gnb ul ul ul {position: absolute; top:0; left:100%;}
			.gnb ul li:hover > ul {visibility: visible;	opacity: 1;}


			.gnb > ul > li {display:inline-block;}
			.gnb > ul > li > a {color:#000; font-size:17px; line-height:70px; padding:0 20px; font-weight:500; }
			.gnb > ul > li > ul {background:rgba(255,255,255,0.75); width:200px; margin-right:-100px; right:50%; border:1px solid #eee;}
				.gnb > ul > li > ul:before {content:''; display:block; width:100px; height:3px; background:#c40c32; margin:auto; position:relative; top:-3px;}
			.gnb > ul > li > ul > li:hover > a {color:#c1402d; text-decoration:none;}
			.gnb > ul > li > ul > li > ul {background:rgba(255,255,255,0.8); width:100%; border:1px solid #eee; top:-1px;}
			.gnb > ul > li > ul > li > a {font-size:13px; margin:0 auto; padding:10px 0; color:#666}
			.gnb > ul > li > ul > li > ul > li > a {font-size:13px; margin:0 auto; padding:10px 0; color:#666}
			.gnb > ul > li > ul > li > ul > li:hover > a {color:#c1402d}

			.gnb > ul > li > ul > li > a > span {position:absolute; right:15px; font-size:15px;}
			.gnb > ul > li > ul > li > a > span:after {content:'+'; display:inline-block; }


			/* 우측메뉴 */
			.header .util {float:right; height:100%; line-height:70px;}
				.header .util ul {float:right; width:100%; margin-bottom:0;}
				.header .util ul li {background:#c40c32; float:left; text-align:center; cursor:pointer;}
					.header .util ul li:last-child {background:#283e56;}
				.header .util ul li a {display:block; padding:0 25px;}
				.header .util ul li a img {vertical-align:middle} 
			





		
/* 고정 헤더 */			
	.fix_head{top:0 !important; -webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-ms-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out; }
		.fix_head .header{width:100%; max-width:100% !important; background:rgba(255,255,255,0.975); box-shadow: 0 0 10px rgba(0,0,0,0.15);}
		.fix_head .header h1{padding:0 10px}
		.fix_head .header h1 img{width:110px}
		.fix_head .gnb > ul .depth2{top:70px; border-top:none}
	


/* 서치버튼 */
	#search {display:none; z-index:1000; padding:20px 25px; border:1px solid #ddd; background:rgba(255,255,255,0.95); width:400px; height:85px; position:absolute; right:0; margin-right:80px}
	#search > div {border-bottom:2px solid #333; padding-bottom:5px; width:100%; position:relative}
	#search > div:after {content:''; clear:both; display:block}
	#search input {border:none; float:left; width:90%; padding:8px 15px; font-size:15px; background:rgba(0,0,0,0); height:auto; line-height:normal;}
	#search input::placeholder {color:#999; font-size:15px}
	#search button {float:right; width:32px; height:32px; background:#333; text-align:center; cursor:pointer; font:icon;}
	#search button img {width:100%; max-width:18px;}
		.search_close {display:none; position:relative;}



/* 모바일 메뉴 */
	.menu-bt-wrapper {z-index:6000; display:none; cursor:pointer; position:fixed; top:10px; right:10px; background:rgba(255, 255, 255, 0)}
	.menu-bt{height:40px;width:45px;display:block;position:relative;padding:10px;box-sizing:border-box}
	.menu-bt-line{float:left;position:relative;height:2px;width:100%;background-color:#444;border-radius:50px;transition:all .5s ease-in-out;-webkit-transform-origin:left center;-moz-transform-origin:left center;-ms-transform-origin:left center;-o-transform-origin:left center; transform-origin:left center;}
	.menu-bt-line1{top:0}
	.menu-bt-line2 {top:7px;opacity:1}
	.menu-bt-line3 {top:14px}
	.menu-open .menu-bt .menu-bt-line1{transform: rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform: rotate(45deg)}
	.menu-open .menu-bt .menu-bt-line2{opacity:0}
	.menu-open .menu-bt .menu-bt-line3{transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform: rotate(-45deg)}
		.ove{overflow-y:hidden}


	#mb_nav {position:fixed; top:0; right:-300px; z-index:4001; width:300px; height:100%; background:#f7f7f7; overflow-y:auto}
	

	#mb_nav .logo_m {background:#283e56; padding:25px 15px; height:100px; margin-bottom:-25px;}
	#mb_nav .logo_m a img {width:100%; max-width:110px; }

	#mb_nav .menu_m {padding:0 15px;}
	#mb_nav .menu_m .mb_admin {width:100%; text-align:center; margin-bottom:15px; background:#fff; border:1px solid #ddd}
	
	#mb_nav .menu_m .mb_admin li{display:inline-block; margin-right:20px;}
		#mb_nav .menu_m .mb_admin li:last-child {margin-right:0;}
	#mb_nav .menu_m .mb_admin li a {width:100%; height:100%; display:block; color:#aaa; padding:15px 0; font-size:13px}
		#mb_nav .menu_m .mb_admin li a:hover {font-weight:500}

	#mb_nav .depth1 {clear:both; margin-bottom:50px; border:1px solid #ddd; border-bottom:0}	
	#mb_nav .depth1 > li > a {width:100%; display:block; padding:15px; font-weight:500; font-size:15px; color:#222; background:#fff; border-bottom:1px solid #ddd; cursor:pointer}
	#mb_nav .depth1 > li > a span {display:block; float:right; font-size:10px; color:#222}
	#mb_nav .depth1 > li > a span:after {clear:both;display:block;content:'▼';}
	#mb_nav .depth1 > li > a span.add:after {content:'▲';}
	
	#mb_nav .depth2 {/* padding:15px 0; */ display:none; background:#f1f1f1}
	#mb_nav .depth2 > li {border-bottom:1px solid #ddd;}
	#mb_nav .depth2 > li > a {width:100%; display:block; padding:15px 30px; font-size:13px; color:#444}
	#mb_nav .depth2 > li > a span {display:block; float:right; font-size:10px; color:#222}
	#mb_nav .depth2 > li > a span:after {clear:both;display:block;content:'▼';}
	#mb_nav .depth2 > li > a span.add:after {content:'▲';}
	
	#mb_nav .depth3 {display:none;}
	#mb_nav .depth3 > li > a{width:100%;display:block;padding:5px 45px 10px;font-size:12px;color:#999}
		
		
	.mb_nav_bg{display:none;position:fixed;top:0;z-index:4000;width:100%;height:100%;background:rgba(0,0,0,0.6);cursor:pointer}

	#mb_nav .depth1 > li .toggle_btn1 {background:#ebeff8}
	#mb_nav .depth2 > li > .toggle_btn2 {font-weight:500; color:#444}


/* contents */
	#contents{width:100%; margin:0 auto}
	#contents:after{display:block;content:'';clear:both}







/* 푸터 */
	.footer {text-align:center; color:#888; font-size:14px;}
	.footer .inner {padding:0 10px; max-width:1200px; width:100%; margin:auto;}
	.footer .ft_top {background:#333; border-bottom:1px solid rgba(255,255,255,.2)}
		.footer .ft_top ul {margin-bottom:0;}
		.footer .ft_top ul li {display:inline-block; position:relative; margin:0 15px;}
			.footer .ft_top ul li:after {content:''; display:inline-block; width:2px; height:15px; background:#555; position:absolute; top:50%; right:-15px; margin-top:-7.5px;}
			.footer .ft_top ul li:last-child:after {display:none;}
		.footer .ft_top ul li a {display:block; padding:20px 0; font-size:15px; color:#ddd; text-decoration:none;}

	.footer .ft_bot {background:#444; }
	.footer .ft_bot .address {padding:50px 0; display:inline-block; width:100%;}

		.footer .address ul.sns {margin-bottom:30px;}
		.footer .address ul.sns li {margin-right:30px; display:inline-block;}
			.footer .address ul.sns li:last-child {margin-right:0;}
		.footer .address ul.sns li a {opacity:0.4}
			.footer .address ul.sns li a:hover {opacity:1; transition:all .3s}
			

		
		.footer .address .inner .ft_logo {float:left; width:15%;}
		.footer .address .inner .info {float:left; width:70%;}
			.footer .address .inner .info p {}
			.footer .address .inner .info ul {margin-bottom:15px;}
			.footer .address .inner .info ul li {display:inline-block; position:relative; margin:0 15px;}
			.footer .address .inner .info ul li:after {content:''; display:inline-block; width:2px; height:15px; background:#555; position:absolute; top:50%; right:-15px; margin-top:-7.5px;}
				.footer .address .inner .info ul li:last-child:after {display:none;}
			.footer .address .inner .info ul li span {color:#eee; }
		.footer .address .inner .ft_bn{float:left; width:15%;}

	.footer .copyright {padding:15px 10px; border-top:1px solid rgba(255,255,255,.2)}
	.footer .copyright p span {font-size:12px; color:#666}
	.footer .copyright p span a {color:#666; text-decoration:none;}


		



/* 서브 공통 */

.s_visual{height:400px;background-size:cover; position:relative;}
.s_visual .in h1 {text-align:center; color:#fff; padding-top:180px; text-shadow:0px 0px 5px rgba(0,0,0,0.35)}
.sv01{background:url(../images/sub/sub01.jpg) no-repeat center center}

	

.sub_menu{background:rgba(36,73,113,.8); position:absolute; bottom:0; width:100%;}
	.sub_menu:after {display:block;content:'';clear:both}
			.sub_menu > ul {max-width:1200px; margin:0 auto; height:50px; line-height:50px;}
			.sub_menu > ul > li {position:relative; display:table-cell; z-index:5; width:250px;}
			.sub_menu > ul > li:first-child {width:auto; border-left:1px solid rgba(221,221,221,.5)}

			.sub_menu > ul > li > a {color:#fff; padding:0 20px; display:block;  border-right:1px solid rgba(221,221,221,.5); box-sizing:border-box; font-size:14px; text-decoration:none;}
				.sub_menu > ul > li:nth-child(3) > a {max-width:250px; overflow: hidden;text-overflow: ellipsis; white-space: nowrap;}
				.sub_menu > ul > li > a img {vertical-align:middle;}
			.sub_menu > ul > li.active a {color:red;}

			.sub_menu > ul > li a:hover {}
			.sub_menu > ul > li span{font-size:6px; position:absolute; right:20px;}
			.sub_menu > ul > li > ul {position:absolute; width:100%; background:rgba(255,255,255,0.975); max-height:0; overflow:hidden; line-height:1.5;
								-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out}
			.sub_menu > ul > li > ul > li {width:100%; margin:0 auto; font-size:14px; text-align:left}
			
			.sub_menu > ul > li > ul > li > a{width:100%;margin:0 auto; padding:10px 30px;display:block;color:#666; font-size:14px; text-decoration:none;}
			.sub_menu > ul > li > ul > li:hover > a {color:#c40c32; font-weight:500}
		.sub_menu li:hover ul{max-height:800px; padding:5px 0; border:1px solid #ddd; border-top:0; }

.location {padding-left:10px; display:none;}
.location ul li {float:left;}
.location ul li:after {content:'>'; display:inline-block; color:#bbb; margin-right:5px; padding-left:5px;}
.location ul li:last-child:after {display:none;}
.location ul li a {font-size:11px;}
.location ul li img {max-width:12px;}






/* Terms of Use + Privacy Policy */
	.etc {}
	.etc .in {}
	.etc .in .line {padding:0 15px;}
	.etc .in h5 {margin-top:25px; counter-increment:step-counter; position:relative; font-size:17px;}
		.etc .in h5:before {content:counter(step-counter) ". "; position:absolute; left:0;}
		.etc .in h5.ten:before {left:-5px;}
	.etc .in p {font-size:14px;}
	.etc .in p.pl40 {padding-left:40px;}

	.etc .in .line > ul {counter-reset:item;}
	.etc .in .line > ul > li {font-size:14px; counter-increment:item; position:relative; padding-left:20px;}
	.etc .in .line > ul > li:before {content:"(" counters(item, " ") ")  "; position:absolute; left:0;}

	.etc .in .line > ul > li > p {margin:10px 0 25px;}


			
/* mypage */
	.mypage {}
	.mypage ul.ev_tab li {width:50%; text-align:center;}
	.emailsub {background:#f7f7f7; padding:25px;}









/************ 반응형 ***************/
@media(max-width:1350px){ 
	.header .logo a img {max-width:130px;}
	.header .util ul li a {padding:0 20px;}
	#search {margin-right:70px;}
	.my_menu ul li {width:70px;}
	.gnb > ul > li > a {padding:0 13px; font-size:16px;}
}

@media(max-width:1200px){ 
	.menu-bt-wrapper, .member_card_btn{display:block}
	.top, .header .gnb, .header .util{display:none}
	#contents {padding-top:40px;}
		#header {top:0; height:60px; border-bottom:1px solid #eee;}
		.header .logo a {line-height:60px;}
		#header .header h1 img{width:110px}
	.sub {padding:100px 0 !important}
	.s_visual {display:none;}
	.sub_menu {display:none;}
	/* .location {display:block; padding-top:70px;} */
	#rightBanner {display:none;}

}
@media(max-width:1100px){
	.footer .ft_bot .address {padding:20px 0;}
	.footer .address .inner .ft_logo, .footer .address .inner .info, .footer .address .inner .ft_bn {float:none; width:100%;}
	.footer .address .inner .info {margin:15px 0 }
	.footer .address .inner img {max-width:120px;}
}

@media(max-width:1000px){
	.etc .in h5 {font-size:16px;}
	.loginBox .in {margin-top:-216px;}
	.login_input > div input {height:50px; font-size:13px;}
	.id, .pw {background-position:left center}
}
@media(max-width:700px){
	.footer .ft_top ul li a {font-size:13px; padding:13px 0;}
	.footer {font-size:12px;}
	.footer .address ul.sns li img {max-width:20px;}
}
@media(max-width:650px){
	.sub input.halfIn {width:100%}
	.sub input.divIn {width:100%;}
	.sub input.thi {margin:5px 0;}
}
@media(max-width:550px){
	.footer .address .inner .info ul li:nth-child(2):after {display:none;}
	.footer .ft_top ul li {margin:0 10px;}
	.footer .ft_top ul li:after {right:-10px;}
	.footer .ft_bot p {font-size:12px;}

	.etc .in .line {padding:0 5px;}
	.loginBox .in {max-width:unset; left:unset; right:unset; margin-left:0; padding:30px 15px 50px; margin:-216px 2.5% 0; width:95%;}
	.loginBox .close {width:30px;}
	.loginBox .in .close img {max-width:25px;}
}