@charset "utf-8";

/* res
@media (max-width: 768px) { ... }
@media (min-width: 768px) and (max-width: 992px) { ... }
@media (min-width: 992px) and (max-width: 1200px) { ... }
@media (min-width: 1200px) { ... }
*/

a:focus {
	outline: none;
}
/* common */
.color_red,
.color-red {
	color:#e93b23 !important;
}
.color_blue,
.color-blue {
	color:#369 !important;
}
.color_black {color:#333 !important;}
.color_orange {color:#f63 !important;}
.color_green {color:#f0f !important;}
.color_aqua {color:#0ff !important;}
.color_pink {color:#f09 !important;}

.text-overflow {
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.word-break {
	word-break:break-all;
}
.required {
	display:inline-block;
	height:12px;
	padding-right:5px;
	color:#cc0000;
	font-size:18px;
	vertical-align:bottom;
	font-weight:bold;
	font-family:Arial, sans-serif;
	line-height:12px;
}
.required:after {
	content:"*";
}

/* popup */
.popup {
	padding:10px;
}
.popup .page-header {
	margin-top:0;
	background:url("../imgs/popup_title_bulit.gif") repeat-y 0 0 #888;
	height:37px;
	padding:0;
}
.popup .page-header h3 {
	margin-top:0;
	margin-bottom: 0;
	font-size:16px;
	font-weight: bold;
	color:#fff;
	padding:9px 0 0 24px;
}
.popup .close {
	width:24px;
	height:23px;
	background:url("../imgs/popup_close_btn.gif") no-repeat 0 0;
	opacity:1;
	margin:7px 7px 0 0;
}
.popup .close span {
	text-indent:-9999px;
	font-size:0;
}

/* table */
table.table-vertical-top thead th,
table.table-vertical-top thead td,
table.table-vertical-top tbody th,
table.table-vertical-top tbody td,
table.table-vertical-top tfoot th,
table.table-vertical-top tfoot td {
	vertical-align:top;
}
table.table-vertical-middle thead th,
table.table-vertical-middle thead td,
table.table-vertical-middle tbody th,
table.table-vertical-middle tbody td,
table.table-vertical-middle tfoot th,
table.table-vertical-middle tfoot td {
	vertical-align:middle;
}
table.type-align-center thead th,
table.type-align-center thead td,
table.type-align-center tbody th,
table.type-align-center tbody td,
table.type-align-center tfoot th,
table.type-align-center tfoot td {
	text-align:center;
}

/* dialog */
.common-layer {
	padding:0 !important;
	border:none !important;
	border-radius:0 !important;
	font-family:dotum, sans-serif;
	font-size:12px;
	letter-spacing:0;
}
.common-layer .ui-dialog-titlebar,
.common-layer .ui-resizable-handle {
	display:none;
}
.common-layer .ui-dialog-content {
	padding:0;
}
.common-layer-wrap {
	position:relative;
	border:solid 1px #cdcdcd;
	background:#fff;
}
.common-layer-wrap h3 {
	margin:0;
	padding:15px 0 11px 15px;
	font-size:14px;
	color:#000;
}
.common-layer-wrap .section {
	padding:0 15px 15px;
}
.common-layer-wrap .glyphicon-remove {
	position:absolute;
	display:block;
	top:-1px;
	right:-1px;
	width:27px;
	height:27px;
	line-height:27px;
	border:solid 1px #cdcdcd;
	text-align:center;
	vertical-align:middle;
}
.common-layer-wrap img {
	max-width:90%;
}
.common-layer-wrap .btn {
	font-size:14px;
}
#mall-cart-add-result h4 {
	font-size:14px;
}

/* placeholder */
label.placeholder {
	color:#c9c9c9 !important;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
	color:#c9c9c9 !important;
}
input:-moz-placeholder,
textarea:-moz-placeholder {
	color:#c9c9c9 !important;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
	color:#c9c9c9 !important;
	font-weight:normal !important;
}


/* 회원가입, 주문 등의 양식 */
.panel {
	border-radius:0 !important;
	box-shadow:none !important;
}
.panel-default>.panel-heading {
	background-image:none;
	background-color:#fbfbfb;
}
form.form-horizontal .panel-body {
	padding:15px 15px 10px;
}
form.form-horizontal label.control-label {
	font-weight:bold;
	color:#444;
	font-size:13px;
	padding-top:4px;
}
form.form-horizontal .form-group {
	border-bottom:1px solid #e8e8e8;
	margin-bottom:15px;
	padding-bottom:15px;
}
@media (max-width:768px) {
	form.form-horizontal .panel-body {
		padding-top:10px;
	}
	form.form-horizontal label.control-label {
		padding-top:0;
	}
	form.form-horizontal .form-group {
		margin-bottom:10px;
		padding-bottom:10px;
	}
}
form.form-horizontal .form-group:last-child {
	border-bottom:none;
	margin-bottom:0;
	padding-bottom:0;
}
form.form-horizontal .radio {
	padding-top:4px;
}
form.form-horizontal .radio label {
	color:#333;
	font-size:13px;
}
form.form-horizontal .help-block {
	color:#777;
	margin-bottom:0;
	line-height:160%;
}
form.form-horizontal .area-type-pay {
	margin-top:-4px;
}
form.form-horizontal .area-pay-bank {
	border:none;
	padding-bottom:0;
}
form.form-horizontal .checkbox-inline,
form.form-horizontal .radio-inline {
	padding-top:4px;
	padding-bottom:4px;
	font-size:13px;
	color:#333;
}
.form-group:after {
	clear:both;
	display:table;
	content:"";
}

/* 수량버튼 */
.btn-pm {
	display:inline-block;
	vertical-align:middle;
}
.btn-pm span {
	float:left;
	display:inline-block;
	vertical-align:middle;
}
.btn-pm span input {
	width:40px;
	height:26px;
	border:1px solid #ccc;
	border-left:none;
	border-right:none;
	text-align:center;
	border-radius:0 !important;
}
.btn-pm .btn-num {
	height:26px;
	padding:5px 8px;
	border:1px solid #ccc;
	background-color:#fff;
	top:0;
	line-height:0;
	float:left;
}
.btn-danger {
	color:#c33 !important;
	background-color:#fafafa !important;
	border-color:#c33 !important;
}

/* error 공통 페이지 */
#common-error {
	text-align:center;
	margin:100px 0;
	border:1px solid #ddd;
	padding:100px 0 80px;
	background:url("../imgs/error_bg.gif") repeat 0 0;
	font-size:16px;
	font-weight:bold;
	color:#444;
}
#common-error img {
	margin-bottom:20px;
}
#common-error button {
	margin-top:10px;
}
@media (min-width: 992px) {
	#common-error {width:80%;}
}
.column_center.col-lg-12 #common-error {
	margin:100px auto;
} /* column_left 없을 때, 가운데로 오게 수정 */
#common_error .wrap {
	padding: 50px 0;
	line-height: 22px;
	font-size: 14px;
	color: #444;
	text-align: center;
}
#common_error .message {
	width: 80%;
	margin: 0 auto 20px auto;
	padding: 50px 20px;
	border: 2px solid #ddd;
	background-color: #f8f8f8;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

/* input */
input[type=checkbox],
input[type=radio] {
	margin-top:3px;
}
input[type=text],
input[type=password],
textarea {
	border:1px solid #ccc;
	padding:1px 5px;
	vertical-align:middle;
}
input[type=text].wide,
input[type=password].wide,
textarea.wide {
	width:100%;
}
select {
	vertical-align:middle;
}

/* default */
.text-left {
	text-align:left !important;
}
.text-center {
	text-align:center !important;
}
.text-right {
	text-align:right !important;
}

.vertical-middle {
	vertical-align:middle !important;
}

/* btn */
.btn {
	background-image:none;
	box-shadow:none;
	text-shadow:none;
}
.btn-primary {
	background:#333 !important;
	border-color:#333 !important;
}
.btn-default {
	color:#444;
	background-color:#fafafa !important;
	border-color:#afafaf !important;
}
.btn-danger {
	color:#c33 !important;
	background-color:#fafafa !important;
	border-color:#c33 !important;
}
input[type=text],
input[type=password] {
	/* btn-xs랑 크기 맞추기 위해 min-height를 22로 둠. */
	min-height:22px;
}

.btn-group-lg>.btn,
.btn-lg {
	font-size:15px;
	font-weight:bold;
	padding:13px 15px;
	min-width:160px;
}
@media (max-width:768px){
	.btn-group-lg>.btn,
	.btn-lg {
		min-width:auto;
	}
}

a.button {
	display:inline-block;
	text-align:center;
	font-size:18px;
	width:46px;
	height:46px;
	border:1px solid #ddd;
	cursor:pointer;
	vertical-align:middle;
	transition:0.6s all ease 0s;
	position:relative;
	font-weight:normal;
	color:#333;
}
a.button span {
	top:13px;
}
input, .btn {
	border-radius: 0 !important;
}
.form-control {
	border-radius:0;
}
select.form-control {
	font-size:12px;
}

/* 모바일에서 PC보기 */
a.pc_to_mobile_btn {
	display:block;
	padding:15px 5px;
	border:1px solid #e0e0e0;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	font-weight:bold;
	font-size:50px;
	text-align:center;
	text-decoration:none;
	color:#999;
	background-color:#f9f9f9;
	background:#f6f6f6 -webkit-gradient(linear,0% 0%,0% 100%,from(#fcfcfc),to(#f6f6f6),color-stop(0.5,#f6f6f6),color-stop(0.5,#f6f6f6));
	background:#f6f6f6 -moz-linear-gradient(top,#fcfcfc,#f6f6f6);
}

/* -------------------- 여기까지 common.mall/common.css와 공통. 수정시 common.mall/common.css도 공통으로 수정. 가급적 수정 X. 이 외 추가는 style.css 에. -------------------- */





/* --------------------  common (아래부터 common end까지는 되도록 수정하지 말것 (-0-) )  ------------------------ */

/*
	display, overflow, {float, clear}, {position, top, right, bottom, left}, z-index, {width, height}, {margin, padding}
	border, {font-weight, font-size, font-family}, {text-decoration, text-indent}, text-align, vertical-align, white-space, line-height, list-style, color, background, other
*/

body {-webkit-text-size-adjust:none;}

/* section */
.section {clear:both; position:relative; *zoom:1;}
.section .wrap {clear:both; position:relative; *zoom:1;}
.section .wrap:after {display:block; clear:both; content:"";}

/* widget */
.widget {position:relative; *zoom:1;}
.widget .wrap {clear:both; position:relative; *zoom:1;}
.widget .wrap:after {display:block; clear:both; content:"";}

/* area */
.area {overflow:hidden; clear:both; position:relative; *zoom:1;}
.area .wrap {overflow:hidden; position:relative; *zoom:1;}
.area .wrap:after {display:block; clear:both; content:"";}

/* button_area */
.button_area {clear:both; padding:0 0 15px; text-align:right;}
.button_area img,
.button_area select,
.button_area input {vertical-align:middle;}

/* description */
.description em {font-style:normal;}
span.description {margin-left:2px;}
p.description {margin:7px 0 3px 2px;}

/* form_message */
.form_message {
	display:inline-block;
	margin-top:5px;
}

.form-error {color:#cc3333;}

/* default */
img.img {vertical-align:middle;}
ul.ul,
ol.ol,
dl.dl {overflow:hidden; margin:0; padding:0; *zoom:1;}
ul.ul li.li,
ol.ol li.li,
dl.dl dd.dd {list-style:none; margin:0; padding:0; *zoom:1;}
dl.dl dt.dt {margin:0; padding:0; *zoom:1;}
ul.ul li.li:after,
ol.ol li.li:after,
dl.dl dd.dd:after {display:block; clear:both; content:"";}

/* table_type */
table.type_row {width:100%; margin:0 0 10px 0; padding:0; border-top:2px solid #d9d9d9; /* table-layout:fixed; */}
table.type_row th .item {position:relative; white-space:nowrap;}
table.type_row td .item {position:relative;}
table.type_row th,
table.type_row td {padding:5px 10px; vertical-align:top;}
table.type_row th {background-color:#f9f9f9; text-align:left;}
table.type_row td {border-bottom:1px solid #ddd;}
table.type_row thead th,
table.type_row tbody th {border-bottom:1px solid #efefef;}
table.type_row.type_middle th,
table.type_row.type_middle td {vertical-align:middle;}
table.type_row td span.button_bar {color:#cbcbcb; padding:0 5px;}

/* tabel.type_default */
table.type_default {width:100%; margin:0 0 10px 0; padding:0; border:0 !important;}
table.type_default th,
table.type_default td {margin:0; padding:7px 5px; vertical-align:middle; word-break:break-all; word-wrap:break-word;}
table.type_default th {height:25px; padding:0; border:0 !important; font:normal 11px dotum, sans-serif; background:url("../imgs/list_thead_bg.gif") repeat-x; color:#666;}
table.type_default td {border-bottom:solid 1px #ddd;}
table.type_default th:first-child {background:url("../imgs/list_thead_left_right.gif") no-repeat left center;}
table.type_default th:last-child {background:url("../imgs/list_thead_left_right.gif") no-repeat right center;}
table.type_default th .item {border-right:solid 1px #d3d3d3;}
table.type_default th.last_child .item {border-right:0;}

table.type_wordbreak th,
table.type_wordbreak td {word-wrap:break-word; word-break:break-all;}

table.type_document {width:100%; margin:0 0 15px 0; padding:0; border:0; border-collapse:collapse;}
table.type_document th,
table.type_document td {border:solid 1px #d8d8d8;}
table.type_document thead tr th,
table.type_document tbody tr th {padding:10px 5px; text-align:center; background-color:#f5f5f5;}
table.type_document thead tr th {font-weight:bold;}
table.type_document tbody tr th,
table.type_document tbody tr td {vertical-align:middle; line-height:18px;}

/* no_count */
table.type_row td.no_count {width:100%; padding:40px 0; color:#666; text-align:center; *zoom:1;}
li.no_count {overflow:hidden; clear:both; width:100%; padding:40px 0; color:#666; text-align:center; list-style:none; *zoom:1;}

/* page_info */
.page_info {overflow:hidden; clear:both; padding:5px 0 8px 10px; margin:0; overflow:hidden; color:#555;}  
.page_info strong {font-weight:bold; color:#e65101;}

div.topMessage {position:fixed; _position:absolute; width:449px; height:33px; z-index:1000;}
div.topMessage img {vertical-align:middle;}
div.topMessage .inner {height:26px; margin-top:-33px; padding:9px 0 0 70px; background:url("../imgs/top_message_bg.png") no-repeat; z-index:9999; color:#fff; font-family:dotum, sans-serif;}
div.topMessage .inner strong {font-size:14px; color:#bb1620;}
div.topMessage .inner strong.color_enable {color:#ffff00;}
div.topMessage .inner a {padding-left:5px;}

/* section_write common */
.section_write {}
.section_write .wrap {}
.section_write fieldset.config {margin-bottom:10px; padding:0; border-bottom:1px solid #ddd;}
.section_write ul.field {overflow:hidden; margin:0; padding:10px 0;}
.section_write ul.field li.field_list {clear:both; margin:0; padding:3px 5px 8px 160px; list-style:none; *zoom:1;}
.section_write ul.field li:after {display:block; clear:both; content:"";}
.section_write ul.field li.field_join {padding-left:5px;}
.section_write ul.field .field_title {float:left; clear:left; display:inline; overflow:hidden; width:140px; margin:0 0 0 -160px; padding:3px 20px 0 0; text-align:right;  line-height:20px; *zoom:1;}
.section_write ul.field .field_title_type {padding-top:0;}
.section_write ul.field .type_required {background:url("../imgs/icon/mark_required.gif") no-repeat right center;}
.section_write ul.field .field_title span.type_title,
.section_write ul.field .field_title label.type_title {text-align:left; color:#5f5f5f;}
.section_write ul.field .field_item {float:left; width:100%; line-height:20px; color:#666;}
.section_write ul.field .wysiwyg_width,
.section_write ul.field textarea.wide,
.section_write ul.field input.wide {width:95%;}
fieldset.config h4 {
	margin:0;
	padding:8px 0 5px 10px; 
	background-color:#f3f3f3; 
	border:1px solid #ddd; 
	border-bottom:2px solid #ddd; 
	border-radius:5px 5px 0 0;
	-moz-border-radius:5px 5px 0 0;
	-webkit-border-radius:5px 5px 0 0;
	background-color:#f1f1f1;
	background:#e8e8e8 -webkit-gradient(linear,0% 0%,0% 100%,from(#f5f5f5),to(#e8e8e8),color-stop(0.5,#e8e8e8),color-stop(0.5,#e8e8e8));
	background:#e8e8e8 -moz-linear-gradient(top,#f5f5f5,#e8e8e8);
	font-size:14px;
	color:#444; 
	font-weight:bold;
}
.section_write ul.field textarea.wide {overflow:auto;}
fieldset.config h4 span.icon {font-weight:normal; font-size:16px; color:#999; vertical-align:middle;}
.section_write ul.field span.description, 
.section_write ul.field label.item_title {color:#555; vertical-align:middle;}
.section_write ul.field label.type_text {color:#777; vertical-align:middle;}
.section_write ul.field .upload_list {overflow:hidden; padding-top:5px;}
.section_write ul.field .upload_list select {float:left; width:80%; margin-right:10px;}
.section_write ul.field .upload_list .upload_button {float:left; width:100px;}
.section_write ul.field .upload_list a.upload_button_delete {display:block; margin-top:5px;}
.section_write ul.field .upload_list a.upload_button_movie {display:block; margin-top:5px;}

/* default */
fieldset.default_form {
	margin-bottom:20px;
}
fieldset.default_form ul {
	overflow:hidden;
	margin:0;
	padding:0;
	*zoom:1;
	border-top:1px solid #ddd;
}
fieldset.default_form select {
	display: inline-block;
	width: 61%;
	height: 30px;
	padding: 4px 12px;
	line-height: 1.42857143;
}
fieldset.default_form li.field_list{
	display: table;
	border-bottom:1px solid #ddd;
	width: 100%;
}
fieldset.default_form li.field_list .field_title {
	display: table-cell;
	min-width: 110px;
	padding-top: 5px;
	text-align: left;
	padding-left:10px;
	color: #666;
	line-height: 16px;
	vertical-align: middle;
	background-color:#fbfbfb;
	font-weight:bold;
}
fieldset.default_form li.field_list .field_item {
	overflow: hidden;
	color: #444;
	width: 90%;
	padding: 7px 13px;
	display: table-cell;
}
fieldset.default_form li.field_list .field_item .field-cell {
	margin-bottom:10px;
}
fieldset.default_form li.field_list .field_item label {
	margin-right:7px;
}
fieldset.default_form li.field_list .field_item p {
	margin:5px 0;
}
@media (max-width:768px) {
	fieldset.default_form li.field_list{
		display:block;
	}
	fieldset.default_form li.field_list .field_title {
		display:block;
		width:100%;
		padding:7px 0;
		border-bottom:1px solid #ccc;
		border-right:0;
		font-weight:bold;
	}
	fieldset.default_form li.field_list .field_item{
		display:block;
		width:100%;
		padding:7px 5px;
	}
}

ol.explain {overflow:hidden; clear:both; margin:0; padding:0; *zoom:1;}
ol.explain li {list-style:none; *zoom:1;}
ol.explain li:after {display:block; clear:both; content:"";}
ol.explain li div.number {float:left; margin-right:-100%; padding-top:3px;}
ol.explain li div.description {overflow:hidden; margin-left:16px; line-height:18px;}

.tab-default {overflow:hidden; clear:both; width:100%; margin:0 0 10px 0; padding:0; background:url("/imgs/system/tab_menu_bg.gif") left bottom repeat-x; list-style:none;}
.tab-default li {float:left; _display:inline; margin-right:-1px; border:1px solid #d4d4d4; color:#333;}
.tab-default li a {_float: left; display:block; padding:9px 18px 9px 19px; color:#666; text-decoration:none;}
.tab-default li a:hover {color:#333; background:#f4f4f4;}
.tab-default li.ui-state-active {border-bottom:1px solid #f4f4f4; background:#f4f4f4;}
.tab-default li.ui-state-active a {color: #333; font-weight:900; letter-spacing:-1px;}
@media (max-width:768px){
	.tab-default li a {
		padding:9px 10px;
	}
	#en .tab-default li a {
		padding:9px 5px;
		font-size:12px;
	}
}

.addr-book-area img {vertical-align:middle;}
.addr-book-area .addr-book-title {margin-bottom:5px;}
.addr-book-area .addr-book-title strong {
	display:inline-block;
	padding-top:3px;
	vertical-align:bottom;
	font-size:13px;
	color:#444;
}
.addr-book-area .addr-book-title a {float:right;}
.addr-book-area .addr-book-list table {margin:0;}
.addr-book-area .addr-book-list table tbody td {padding:0 5px;}
.addr-book-area .addr-book-list table tbody td.no_count {padding:10px 5px;}
.global_address label {
	margin-bottom:0;
	display:block;
}
.global_address input[type=text] {
	margin-bottom:3px;
}
.global_address .XenoZipResult {
	text-align:left;
}
.global_address .XenoZipResult span {
	white-space:normal;
}
.global_address input.wide {
	width:70% !important;
}

@media (max-width:768px) {
	.global_address .XenoZipBox4 {
		margin:0;
		padding:0;
		display:block;
	}
}

/* XenoZipBox input style definition */
.XenoZipBox input.type_text {position:relative;margin:2px 0;padding:3px 4px;border:1px solid;border-color:#b7b7b7 #e1e1e1 #e1e1e1 #b7b7b7;font-size:12px;_font-size:9pt;background-color:#fff;vertical-align:middle;}
.XenoZipBox  *:first-child+html input.type_text {font-size:9pt;}
.XenoZipBox  input.type_text:hover,
.XenoZipBox  input.type_text:focus {background-color:#f8f8f8;}
.XenoZipBox  input.number {text-align:right;}
.XenoZipBox .panel {margin:0; border:none; box-shadow: none;}
.XenoZipBox .btn-default {box-shadow: none;text-shadow:none;background:none; font-size:13px;}
.XenoZipBox .XenoZipResult {}


/* --------------------  common end (여기까지 수정은 되도록 삼가 (-0-) )  ------------------------ */
/* 아래부터는 사이트마다 수정하거나, 위의걸 덮어씌우면 되고, 정 위의걸 건드려야 일이 쉽게 끝난다고 판단될때에는 수정된 부분은 주석처리로 표시해줄것!! */


/* 180213 나눔고딕 폰트스타일 변경되어서, 위아래 간격때문에 추가 (at.maker2) */
body .btn-group-xs>.btn,
body .btn-xs {
	padding-top:0;
	padding-bottom:2px;
}
/*body#ko .btn-group-xs>.btn,*/
/*body#ko .btn-xs {*/
	/*padding-top:0;*/
	/*padding-bottom:2px;*/
/*}*/


















































