@charset "utf-8";
.contact_us{width:100%; margin-bottom:30px}
.contact_us a,.contact_us a:hover{text-decoration:none}

/* Title */
.contactTitle{position:relative; padding-bottom:20px; *zoom:1}
.contactTitle:after{content:" "; clear:both; display:block}
.contactTitle h2.contactTitleText{position:relative; float:left; margin:0; padding:0; font-size:28px}
a.admin_setup{position:relative; top:10px; float:right; margin-left:10px; padding-left:14px; background:url('../img/iconSetup.gif') no-repeat scroll 0 transparent; text-decoration:none; white-space:nowrap; font-size:12px; color:#666}

/* Terms */
#terms{width:100%; margin:10px 0; overflow:hidden; text-align:justify}
#terms .termsTitle{margin:0 0 10px 0; color:#3d3d3d; font-family:Arial,Helvetica,sans-serif,돋움; font-size:16px; font-weight:bold}
#termsContents p{margin:3px 0 3px 0; font-size:12px}
#agree_check{margin-top:20px; padding:7px; border:1px solid #e7e7e7; background:#f7f7f7; color:#666; font-family:Arial,Helvetica,sans-serif,돋움; font-size:12px; font-weight:bold}
#agree_check input{margin:0 4px 0 0}
#agree_check label{vertical-align:top; cursor:pointer}

/* Table */
#form_contact{margin:0; padding:0}
.required{position:relative; float:right; margin:0 0 10px 0; padding:0; font-family:Arial,Helvetica,sans-serif,돋움; font-size:12px; font-weight:bold; color:#a4a4a4}
#contact_table{width:100%; background-image:url("../img/support_bg.png"); background-size:cover; background-repeat:no-repeat; background-position:left top; border:0; border-top:2px solid #3576a1; border-bottom:1px solid #c2c2c2; border-spacing:0; margin:0; padding:0; box-sizing:border-box}
#contact_table th{width:196px; padding:15px 0 15px 30px; border-bottom:1px dashed #aaa; text-align:left; font-family:Arial,Helvetica,sans-serif,돋움; font-size:16px; font-weight:bold; color:#3d3d3d}
#contact_table td{padding:15px 0; border-bottom:1px dashed #aaa; text-align:left}
#contact_table td ul{margin:0; padding:0; list-style:none; *zoom:1}
#contact_table td ul:after{content:" "; clear:both; display:block}
#contact_table td ul li{float:left; margin:0 8px 0 0; padding:0}
#contact_table td p{margin:4px 0 0 0; padding:0; font-family:Arial,Helvetica,sans-serif,돋움; font-size:12px; color:#a4a4a4 !important}

/* Input (반응형 대응을 위해 width 100% 및 max-width 적용) */
#contact_table td input.text,
#contact_table td input.date,
#contact_table td input.tel{position:relative; width:100%; max-width:480px; height:50px; line-height:50px; margin:0; padding:0 8px; background:rgba(255,255,255,.85); border:1px solid #ccc; font-weight:700; font-size:18px; color:#333; vertical-align:middle; box-sizing:border-box}
#contact_table td input.tel{width:auto; max-width:60px; margin:0 4px 0 0} /* 전화번호 칸은 예외 처리 */
#contact_table td input.radio,
#contact_table td input[type=checkbox]{width:13px; height:13px; margin:0 5px 0 0; padding:0; vertical-align:middle}
#contact_table td label{margin:0 20px 0 0; vertical-align:middle; font-size:16px; color:#666 !important; cursor:pointer}
#contact_table td textarea{position:relative; width:100%; max-width:100%; height:160px; margin:0; padding:6px; background:rgba(255,255,255,.85); border:1px solid #ccc; font-weight:700; font-size:18px; color:#333; vertical-align:top; line-height:2; box-sizing:border-box}
#contact_table td select{position:relative; width:100% !important; max-width:256px !important; margin:0; padding:2px; background:rgba(255,255,255,.85); border:1px solid #ccc; color:#333; vertical-align:middle; box-sizing:border-box; height:50px}

/* Zip Address (고정폭 480px -> 100% / max-width 480px) */
#contact_table td .krZip .krzip-postcode-wrap label,
#contact_table td .krZip .krzip-address-wrap label{display:block; margin:15px 0}
#contact_table td .krZip .krzip-postcode{vertical-align:middle}
#contact_table td .krZip .krzip-search{height:48px !important; line-height:48px !important; vertical-align:middle; border:1px solid #ccc}
#contact_table td .krZip .krzip-postcode,
#contact_table td .krZip .krzip-roadAddress,
#contact_table td .krZip .krzip-jibunAddress,
#contact_table td .krZip .krzip-extraAddress,
#contact_table td .krZip .krzip-detailAddress{height:48px; line-height:48px; padding:0 8px; font-size:20px; box-sizing:border-box}
#contact_table td .krZip .krzip-roadAddress,
#contact_table td .krZip .krzip-jibunAddress,
#contact_table td .krZip .krzip-extraAddress,
#contact_table td .krZip .krzip-detailAddress{display:block; width:100%; max-width:480px; margin:15px 0}
#contact_table td .krZip .krzip-detailAddress{background:rgba(255,255,255,.85); border:1px solid #ccc}
#contact_table td .krZip .krzip-jibunAddress{display:none}

#contact_table td textarea:hover,
#contact_table td input.text:hover,
#contact_table td input.date:hover,
#contact_table td input.tel:hover,
#contact_table td select:hover{border-color:#acb8fc !important}

/* Option */
em.required_icon{position:relative; top:2px; *top:-2px; _top:1px; width:12px; height:12px; background:url(../img/em.png) no-repeat; display:inline-block; font-style:normal; color:#e81010; text-indent:-9999px}
#contact_form .cameron_table td label{margin:0; vertical-align:middle; font-size:12px; cursor:pointer; color:#5c5c5c !important}
.cufon{margin-bottom:4px}

/* Button */
.send{width:100%; margin-top:30px; text-align:center}

/* XE Message */
.message{text-align:center}
.message p{margin:14px 0 !important; font-size:16px}
.message .contactSuccess{text-shadow:none; color:#333}

.mail_content{margin-top:20px; padding:10px; border-top:2px solid #3b7aa4; border-bottom:1px solid #eee}
.mail_content ul{margin:0; padding:0; list-style:none}
.mail_content li{margin:0; padding:5px 0; font-family:'Malgun Gothic',돋움,sans-serif; font-weight:normal; font-size:13px}
.mail_content li .mail_var_title{margin-right:5px}

/* Price */
.price{margin-top:20px; text-align:right; font-family:'Malgun Gothic',돋움,sans-serif; font-size:12px; font-style:normal; color:#444}
.price span.product{font-size:20px; color:#444}
.price span.won{font-family:Arial,돋움,sans-serif; font-size:23px; color:#f26859}
.link_back_contact{margin:60px 0 30px; text-align:center}

/* Bank (고정폭 해제) */
.bank-info-title{margin-bottom:30px; padding-top:60px; border-top:1px solid #ccc; text-align:center; font-size:28px}
.bank-info{width:100%; max-width:640px; margin:0 auto; padding:30px 0; background-image:url("../img/support_bg.png"); background-size:cover; background-repeat:no-repeat; background-position:left top; background-color:#fff; border:1px solid #dedede; box-shadow:0 5px 15px rgba(0,0,0,.7); text-align:center; font-weight:700; font-size:24px; color:#333; box-sizing:border-box}
.bank-info p{margin:0; padding:0; line-height:1.7}
.copy-bank{margin-top:30px; text-align:center}
.copy-btn{display:inline-block; height:40px; line-height:40px; margin:5px; padding:0 30px; background-color:#eee; border:1px solid #dedede; font-size:16px; color:#000}
.copy-btn:hover,
.copy-btn:focus{background-color:#aaa9a9; border-color:#aaa9a9; color:#fff}

/* Font */
.contactTitle h2.contactTitleText,.contactTitle p.required,#terms .termsTitle,#agree_check,#contact_table th,#contact_table td p,#contact_table td label,#mail_content li .mail_var_title{font-family:'Nanum Gothic','Malgun Gothic',돋움,sans-serif; font-weight:700}

/* Payment */
.payment_wrapper{position:relative}
.fo_payment{}
.fo_payment-col{padding-top:20px; padding-bottom:20px; border-right:1px solid #e9e9e9; text-align:center}
.fo_payment h3.payment-title{margin:0; padding:0; font-family:'Nanum Gothic'; font-size:18px; font-weight:700; color:#adadad}
.fo_payment .payment-info{margin:28px 0 32px 0; padding:0; line-height:1.8; font-family:굴림; font-size:12px; color:#666}
.fo_payment .payment-info em{font-style:normal; font-weight:bold; color:#3576a1}
.fo_payment label{font-size:12px; font-weight:bold; color:#666; padding-left:3px}
.fo_payment input{padding:0; margin:0; vertical-align:middle}
.choice_box{padding-left:20px; float:left}
.choice_box ul{padding:0; margin:0; list-style:none; padding-top:9px}
.payment_info{margin-top:16px; padding:5px 20px; line-height:1.6; background:#f9f9f4}
.payment_info p, .payment_info span{color:#3397a7; font-size:11px}
.fo_payment #paypal-form{margin:0; padding:0; border:0}
.fo_payment .payment-btn{display:inline-block; padding:23px 40px 23px 75px; background-color:#fafafa; background-repeat:no-repeat; background-position:10px center; border:1px solid #ccc; font-family:'Nanum Gothic'; font-size:14px; color:#666; cursor:pointer}
.fo_payment .payment-btn:hover,
.fo_payment .payment-btn:focus{background-color:#fff}
.fo_payment .creditcard-icon{background-image:url(../img/payment-creditcard-icon.png)}
.fo_payment .realtime-icon{background-image:url(../img/payment-realtime-icon.png)}
.fo_payment .cash-icon{background-image:url(../img/payment-cash-icon.png)}
.fo_payment .paypal-icon{background-image:url(../img/payment-paypal-icon.png)}
#INIpay{position:absolute}


/* =========================================
   Mobile Responsive (모바일 화면 최적화)
========================================= */
@media (max-width:767px) {
	/* 테이블 레이아웃을 Block으로 전환하여 세로로 배치 */
	#contact_table,
	#contact_table tbody,
	#contact_table tr,
	#contact_table th,
	#contact_table td {
		display:block;
		width:100%;
		box-sizing:border-box;
	}

	#contact_table th {
		width:100%;
		padding:15px 15px 5px 15px; /* 타이틀 하단 여백 축소 */
		border-bottom:none; /* 모바일에서는 선 없앰 */
	}

	#contact_table td {
		padding:0 15px 15px 15px; /* 데이터 영역 여백 조정 */
	}

	/* 모바일에서는 입력칸을 100% 꽉 채우도록 max-width 초기화 */
	#contact_table td input.text,
	#contact_table td input.date,
	#contact_table td select,
	#contact_table td .krZip .krzip-roadAddress,
	#contact_table td .krZip .krzip-jibunAddress,
	#contact_table td .krZip .krzip-extraAddress,
	#contact_table td .krZip .krzip-detailAddress {
		max-width:100% !important;
	}

	.bank-info {
		width:100%;
		padding:20px 10px;
		font-size:20px;
	}

	.fo_payment .payment-btn {
		padding:15px 20px 15px 45px;
		background-position:5px center;
		background-size:25px auto;
	}
}