@charset "utf-8";

@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@font-face {
	font-family :Nanum Gothic;
	font-style :normal;
	font-weight :400;
	src :url(http://themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.eot);
	src :url(http://themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.woff2) format('woff2'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.woff) format('woff'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.ttf) format('truetype');
}

/* ============================== 기본 설정 ============================== */
* {
	margin: 0; padding: 0;
	font-size: 14px; color: #444;
	font-family: 'Nanum Gothic', '나눔고딕', 'dotum', '돋움', "Malgun Gothic", "맑은 고딕", 'Tahoma', 'Geneva', sans-serif;
	-webkit-tap-highlight-color: rgba( 1, 108, 136, 0 );
	-moz-tap-highlight-color:	rgba( 1, 108, 136, 0 );
	-ms-tap-highlight-color:	rgba( 1, 108, 136, 0 );
	-o-tap-highlight-color:		rgba( 1, 108, 136, 0 );
	
	-webkit-text-size-adjust: none;
}
*::selection { color: #fff; background-color: #016c88; }
header, nav, article, section, aside, footer { display: block; }

ul, ol { list-style: none; }
a:link, a:active, a:visited {
	text-decoration: none; color: #444;
}
hr { clear: both; margin: 10px 0; }
img { border: 0; }
input[type="button"], label, button { cursor: pointer; outline: 0; }
input[type="text"], input[type="email"], input[type="password"] { outline: 0; }

/* ============================== Navigation ============================== */
#gnb { position: fixed; z-index: 1000; }
#gnb > .bg {
	display: none; position: absolute; left: 0; top: 0; z-index: 50; background-color: #000;
	opacity: 0.6; filter: alpha(opacity=60);
}

#gnb > .gnb_list {
	display: none; position: absolute; z-index: 100; cursor: default;
	/*background-color: rgba( 21, 105, 121, 1 ); border: 2px solid rgba( 255, 255, 255, 0.1 );*/
	
	background-color: #fff;
	-webkit-box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.5 );
	-moz-box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.5 );
	-ms-box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.5 );
	-o-box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.5 );
	box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.5 );
	/*border-radius: 0 10px 10px 0;*/
	
}
#gnb > .gnb_list > .gnb_title {
	height: 49px;
	
	/*background: #00728d;*/
	background: #338ea4;
	filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#a0e5fd', endColorstr='#338ea4',GradientType=0 );
	
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.24);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.24);
	box-shadow: 0 1px 2px rgba(0,0,0,0.24);
}
#gnb > .gnb_list > .gnb_title > .mem_img { float: left; }
#gnb > .gnb_list > .gnb_title > .mem_img > img {
	margin: 11px 0 11px 10px; border-radius: 10px; border: 2px solid #fff;
	-webkit-box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.2 );
	-moz-box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.2 );
	-ms-box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.2 );
	-o-box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.2 );
	box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.2 );
}
#gnb > .gnb_list > .gnb_title > h2 {
	float: left; color: #fff; font-weight: normal; font-size: 18px; padding: 0 10px; height: 49px; line-height: 49px;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#gnb > .gnb_list > .gnb_title > .close_btn {
	float: right; width: 49px; height: 49px; background: url('../../images/common/close_btn.png') 50% 50% no-repeat;
}
#gnb > .gnb_list > .gnb_title > .icon_login {
	float: left; width: 19px; height: 21px; margin: 14px 0 0 10px; background: url('../../images/common/icon_login.png') no-repeat;
}

#gnb > .gnb_list > ul {
	clear: both;
	/*border-top: 1px solid #c6c6c6; border-bottom: 1px solid #c6c6c6;*/
	background: red;
}

#gnb > .gnb_list > ul.gnb_main > li { float: left; width: 70px; border-bottom: 1px solid #c6c6c6; padding-bottom: 10px; }
#gnb > .gnb_list > ul.gnb_main > li > span.icon { display: block; margin: 0 auto; width: 49px; height: 49px; }
#gnb > .gnb_list > ul.gnb_main > li > span.txt { display: block; text-align: center; font-size: 13px; }
#gnb > .gnb_list > ul.gnb_main > li.overview > span.icon {
	background: url('../../images/common/icon_car.png') 50% 50% no-repeat;
}
#gnb > .gnb_list > ul.gnb_main > li.best > span.icon {
	background: url('../../images/common/icon_best_shop.png') 50% 50% no-repeat;
}
#gnb > .gnb_list > ul.gnb_main > li.area > span.icon {
	background: url('../../images/common/icon_area.png') 50% 50% no-repeat;
}
#gnb > .gnb_list > ul.gnb_main > li.community > span.icon {
	background: url('../../images/common/icon_community.png') 50% 50% no-repeat;
}
#gnb > .gnb_list > ul.gnb_main > li.news > span.icon {
	background: url('../../images/common/icon_news.png') 50% 50% no-repeat;
}

#gnb > .gnb_list > ul.gnb_sub > li { float: left; width: 139px; border-right: 1px solid #c6c6c6; border-bottom: 1px solid #c6c6c6; }
#gnb > .gnb_list > ul.gnb_sub > li > span.icon { display: block; float: left; width: 49px; height: 49px; }
#gnb > .gnb_list > ul.gnb_sub > li > span.txt { display: block; float: left; height: 49px; line-height: 49px; }
#gnb > .gnb_list > ul.gnb_sub > li.notice > span.icon {
	background: url('../../images/common/icon_notice.png') 50% 50% no-repeat;
}
#gnb > .gnb_list > ul.gnb_sub > li.note > span.icon {
	background: url('../../images/common/icon_note.png') 50% 50% no-repeat;
}
#gnb > .gnb_list > ul.gnb_sub > li.phone > span.icon {
	background: url('../../images/common/icon_phone.png') 50% 50% no-repeat;
}
#gnb > .gnb_list > ul.gnb_sub > li.sms > span.icon {
	background: url('../../images/common/icon_sms.png') 50% 50% no-repeat;
}
#gnb > .gnb_list > ul.gnb_sub > li.kakao > span.icon {
	background: url('../../images/common/icon_kakao.png') 50% 50% no-repeat;
}


#gnb > .gnb_list > .gnb_logout {
	clear: both; width: 238px; margin-left: 10px; padding: 10px; text-align: center; border: 1px solid #c6c6c6; cursor: pointer;
}
#gnb > .gnb_list > .gnb_login {
	float: left; width: 100px; margin: 20px 5px 0 10px; padding: 10px; text-align: center; border: 1px solid #c6c6c6; cursor: pointer;
}
#gnb > .gnb_list > .gnb_register {
	float: left; width: 100px; margin: 20px 10px 0 5px; padding: 10px; text-align: center; border: 1px solid #c6c6c6; cursor: pointer;
}

/* ============================== Article ============================== */
#contents {
	margin: 0 auto; /* width: 1024px; 
	
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;*/
}

/* ============================== footer ============================== */
footer {
	background-color: #444; *background-color: #444; background-color: #444\9;
}
#footerContainer {
	margin: 0 auto; padding: 5px 0 10px;
	
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
#footerContainer > ul {
	margin-top: 10px;
}
#footerContainer > ul > li {
	float: left; margin-right: 10px; height: 30px; line-height: 30px;
}
#footerContainer > ul > li > a {
	font-size: 12px; color: #fff; *color: #fff; color: #fff\9; cursor: pointer;
	border-bottom: 1px solid #e8e8e8;
}
#footerContainer > p { margin-bottom: 10px; font-size: 12px; color: #fff; *color: #fff; color: #fff\9; }
#footerContainer > p > span { color: #00728d; font-size: 12px; font-weight: 700; }
/* ============================== /footer ============================== */



/* ============================== Top Button ============================== */

#top-btn {
	display: none; width: 31px; height: 31px; position: fixed; bottom: 25px; right: 5px;
	cursor: pointer; border: 1px solid #c6c8cb; border-radius: 25px;
	-webkit-box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.2 );
	-moz-box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.2 );
	-ms-box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.2 );
	-o-box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.2 );
	box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.2 );
	overflow: hidden;
}
#top-btn > .btn_group { position: relative; }
#top-btn > .btn_group > .top-btn_bg {
	position: absolute; top: 0; left: 0;
	width: 31px; height: 31px; background-color: #fff; opacity: 0.6; filter: alpha(opacity=60);
}
#top-btn > .btn_group > .top-btn_txt {
	position: absolute; top: 9px; left: 10px;
	text-align: center; color: #444; font-size: 0;
	width: 10px; height: 13px; background: url('../../images/common/icon_top_arrow.png') no-repeat;
}
/* ============================== /Top Button ============================== */



/* ============================== Board Paging List ============================== */

/*
.paging { float: left; margin-right: 0; }
.paging > li {
	min-width: 29px; height: 31px; float: left; margin: 0 2px; cursor: pointer;
}
.paging > li > span {
	min-width: 29px; height: 31px; line-height: 31px; display: block; text-align: center;
	background-color: #e8e8e8; border-radius: 3px;
}

.paging > li > span.active {
	min-width: 29px; height: 31px; line-height: 31px; text-align: center;
	color: #fff; font-weight: 700; background-color: #2e849a; border-radius: 3px;
}

*/

#board_list { float: left; margin-right: 0; }
#board_list > a {
	width: 28px; height: 31px; line-height: 31px; display: block; float: left; text-align: center; margin: 2px;
	background-color: #e8e8e8; border-radius: 3px;
}
#board_list > a.active {
	display: block; color: #fff; font-weight: 700;
	background-color: #2e849a; border-radius: 3px;
}


#board_list > div.start_end { float: left; }
#board_list > div.start_end > a {
	width: 28px; height: 31px; line-height: 31px; display: inline-block; text-align: center; margin: 2px;
	background-color: #e8e8e8; border-radius: 3px;
}
#board_list > div.start_end > span.board_comma {
	width: 14px; height: 31px; line-height: 31px; display: inline-block; text-align: center; margin: 2px;
}

#board_another_list > div.start_end:after { content: ''; display: block; clear: both; }
#board_another_list > div.start_end > a {
	width: 100%; height: 21px; display: block; float: left; line-height: 21px; text-align: center;
	background-color: #e8e8e8; border-radius: 3px; padding: 3px 0;
}


/* ============================== Public Class ============================== */
.text {
	width: 240px; height: 48px; *height: 33px; height: 33px\9;
	padding: 0 14px; *padding: 15px 14px 0 14px; padding: 15px 14px 0 14px\9;
	font-size: 16px; background: #fff;
	border: 1px solid #bfbfbf; border-radius: 10px;
	-webkit-box-shadow: 1px 2px 0 rgba(255,255,255,0.75), inset 1px 3px 5px rgba(0,0,0,0.07);
	-moz-box-shadow: 1px 2px 0 rgba(255,255,255,0.75), inset 1px 3px 5px rgba(0,0,0,0.07);
	box-shadow: 1px 2px 0 rgba(255,255,255,0.75), inset 1px 3px 5px rgba(0,0,0,0.07);
}
.form_text {
	width: 228px; height: 32px; *height: 33px; height: 33px\9;
	padding: 0 14px; *padding: 15px 14px 0 14px; padding: 15px 14px 0 14px\9;
	font-size: 14px; background: #fff;
	border: 1px solid #bfbfbf; border-radius: 5px;
	-webkit-box-shadow: 1px 2px 0 rgba(255,255,255,0.75), inset 1px 3px 5px rgba(0,0,0,0.07);
	-moz-box-shadow: 1px 2px 0 rgba(255,255,255,0.75), inset 1px 3px 5px rgba(0,0,0,0.07);
	box-shadow: 1px 2px 0 rgba(255,255,255,0.75), inset 1px 3px 5px rgba(0,0,0,0.07);
}
.text_Area {
	width: 100%; height: 100px; *height: 133px; height: 133px\9;
	padding: 15px; *padding: 15px 14px 0 14px; padding: 15px 14px 0 14px\9;
	font-size: 14px; background: #fff; border: 1px solid #bfbfbf; border-radius: 10px;
	-webkit-box-shadow: 1px 2px 0 rgba(255,255,255,0.75), inset 1px 3px 5px rgba(0,0,0,0.07);
	-moz-box-shadow: 1px 2px 0 rgba(255,255,255,0.75), inset 1px 3px 5px rgba(0,0,0,0.07);
	box-shadow: 1px 2px 0 rgba(255,255,255,0.75), inset 1px 3px 5px rgba(0,0,0,0.07);
}
.login_btn {
	float: left; width: 116px; height: 38px; color: #fff; font-size: 16px;
	margin: 20px 0 0 1px; cursor: pointer;
	
	border-radius: 3px; border: 1px solid #00728d;
	background: #00728d;
	background: -moz-linear-gradient(top,  #00728d 0%, #73d0f0 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00728d), color-stop(100%,#00728d));
	background: -webkit-linear-gradient(top,  #a0e5fd 0%,#00728d 100%);
	background: -o-linear-gradient(top,  #a0e5fd 0%,#00728d 100%);
	background: -ms-linear-gradient(top,  #a0e5fd 0%,#00728d 100%);
	background: linear-gradient(to bottom,  #a0e5fd 0%,#00728d 100%);
	filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#a0e5fd', endColorstr='#00728d',GradientType=0 );
	
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.24);
	-moz-box-shadow:	0 1px 2px rgba(0,0,0,0.24);
	box-shadow:			0 1px 2px rgba(0,0,0,0.24);
}
.login_basic_btn {
	width: 100%; height: 38px; color: #fff; font-size: 16px;
	margin: 20px 0 0 1px; cursor: pointer;
	
	border-radius: 3px; border: 1px solid #00728d;
	background: #00728d;
	background: -moz-linear-gradient(top,  #00728d 0%, #73d0f0 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00728d), color-stop(100%,#00728d));
	background: -webkit-linear-gradient(top,  #a0e5fd 0%,#00728d 100%);
	background: -o-linear-gradient(top,  #a0e5fd 0%,#00728d 100%);
	background: -ms-linear-gradient(top,  #a0e5fd 0%,#00728d 100%);
	background: linear-gradient(to bottom,  #a0e5fd 0%,#00728d 100%);
	filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#a0e5fd', endColorstr='#00728d',GradientType=0 );
	
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.24);
	-moz-box-shadow:	0 1px 2px rgba(0,0,0,0.24);
	box-shadow:			0 1px 2px rgba(0,0,0,0.24);
}
.login_facebook_btn {
	width: 100%; height: 38px; color: #fff; font-size: 16px;
	margin: 20px 0 0 1px; cursor: pointer;
	
	border-radius: 3px; border: 1px solid #3c599b;
	background: #3c599b;
	background: -moz-linear-gradient(top,  #3c599b 0%, #3c599b 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3c599b), color-stop(100%,#3c599b));
	background: -webkit-linear-gradient(top,  #a0e5fd 0%,#3c599b 100%);
	background: -o-linear-gradient(top,  #a0e5fd 0%,#3c599b 100%);
	background: -ms-linear-gradient(top,  #a0e5fd 0%,#3c599b 100%);
	background: linear-gradient(to bottom,  #a0e5fd 0%,#3c599b 100%);
	filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#a0e5fd', endColorstr='#3c599b',GradientType=0 );
	
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.24);
	-moz-box-shadow:	0 1px 2px rgba(0,0,0,0.24);
	box-shadow:			0 1px 2px rgba(0,0,0,0.24);
}
.login_kakao_btn {
	width: 100%; height: 38px; color: #fff; font-size: 16px; font-weight: 700;
	margin: 20px 0 0 1px; cursor: pointer;
	
	border-radius: 3px; border: 1px solid #ef9200;
	background: #ef9200;
	background: -moz-linear-gradient(top,  #ef9200 0%, #ef9200 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ef9200), color-stop(100%,#ef9200));
	background: -webkit-linear-gradient(top,  #fdfe7f 0%,#ef9200 100%);
	background: -o-linear-gradient(top,  #fdfe7f 0%,#ef9200 100%);
	background: -ms-linear-gradient(top,  #fdfe7f 0%,#ef9200 100%);
	background: linear-gradient(to bottom,  #fdfe7f 0%,#ef9200 100%);
	filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#fdfe7f', endColorstr='#ef9200',GradientType=0 );
	
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.24);
	-moz-box-shadow:	0 1px 2px rgba(0,0,0,0.24);
	box-shadow:			0 1px 2px rgba(0,0,0,0.24);

	-webkit-text-shadow: -2px -2px 10px #ef9200;
	-moz-text-shadow:	 -2px -2px 10px #ef9200;
	text-shadow:		 -2px -2px 10px #ef9200;
}

.btn {
	display: block; width: 110px; height: 33px; margin: 10px auto; font-size: 14px; cursor: pointer;
	background: #fff; border: 1px solid #e8e8e8; border-radius: 5px; color: #00728d; text-align: center;
	-webkit-box-shadow: 	1px 2px 3px rgba(0,0,0,0.12);
	-moz-box-shadow: 	1px 2px 3px rgba(0,0,0,0.12);
	box-shadow: 			1px 2px 3px rgba(0,0,0,0.12);
}
.cur-hand { cursor: pointer; }
.find_text {
	font-size: 11px; float: right; width: 105px; margin-top: 40px; text-decoration: underline;
}
.title_txt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.line { clear: both; height: 10px; border-bottom: 1px solid #e8e8e8; margin-bottom: 10px; }

.clear-fix { clear: both; }
.deco-top { clear: both; height: 64px; }
.deco { clear: both; height: 20px; }

.deco-1 { clear: both; height: 1px; }
.deco-5 { clear: both; height: 5px; }
.deco-10 { clear: both; height: 10px; }
.deco-15 { clear: both; height: 15px; }
.deco-20 { clear: both; height: 20px; }
.deco-30 { clear: both; height: 30px; }
.deco-40 { clear: both; height: 40px; }
.deco-90 { clear: both; height: 90px; }

.font_bold { font-weight: 700; }
.font-underline { text-decoration: underline; }
.font_point { color: #016c88; }
.font_red { color: #dc143c; }
.border_gray { border: 1px solid #e8e8e8; }
.clear { clear: both; }

.point_icon {
	display: inline-block; margin: 0 5px;
	width: 18px; height: 18px; line-height: 18px; color: #fff; text-align: center; font-weight: 700; border-radius: 3px;
	background: #00728d; background: -moz-linear-gradient(top,  #00728d 0%, #73d0f0 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00728d), color-stop(100%,#00728d)); background: -webkit-linear-gradient(top,  #a0e5fd 0%,#00728d 100%); background: -o-linear-gradient(top,  #a0e5fd 0%,#00728d 100%); background: -ms-linear-gradient(top,  #a0e5fd 0%,#00728d 100%); background: linear-gradient(to bottom,  #a0e5fd 0%,#00728d 100%); filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#a0e5fd', endColorstr='#00728d',GradientType=0 ); -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.24); -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.24); box-shadow: 0 1px 2px rgba(0,0,0,0.24);
}

.hr-box { position: relative; }
hr { border-top: 1px solid #dadbde; }
hr:before {
	content: 'or'; color: #bfc0c5; display: inline-block; position: absolute; top: -8px; left: 50%;
	-webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%);
	background-color: #ffffff; padding: 0 4px;
}

/* 새로운 쪽지 아이콘 */
.note_icon_p {
	display: inline-block; margin-right: -3px;
	width: 18px; height: 18px; line-height: 18px; color: #fff; text-align: center; font-weight: 700; border-radius: 10px;
	background: #00728d;
}
.note_icon_m { border-bottom: 1px solid #c6c6c6; }
.note_icon_m > span.icon {
	display: block; float: left; width: 49px; height: 49px;
	background: url('../../images/common/icon_note.png') 50% 50% no-repeat;
}

.note_icon_m > p.note_counter {
	display: block; float: left; font-size: 15px; height: 49px; line-height: 49px;
}
.note_icon_m > p.note_counter > span { font-size: 15px; height: 49px; line-height: 49px; color: #016c88; font-weight: 700; }