/* CSS */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}


/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}

body {
	line-height: 1;
	background-color: #f4fbf9;
	position: absolute;
	margin: 0;
	width: 100%;
	height: 100%;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

button,input,optgroup,select,textarea { margin:0; font-size:inherit; line-height:inherit; }
input[type=checkbox],input[type=radio] { box-sizing:border-box; padding:0; }
input:focus, select:focus, option:focus, textarea:focus, button:focus{
	outline: none;
}

a { color:#007bff; text-decoration:none; background-color:transparent; -webkit-text-decoration-skip:objects; }
a:hover { color:#0056b3; text-decoration:none; }
a:not([href]):not([tabindex]) { color:inherit; text-decoration:none; }
a:not([href]):not([tabindex]):focus,a:not([href]):not([tabindex]):hover { color:inherit; text-decoration:none; }
a:not([href]):not([tabindex]):focus{ outline: 0; }

.cursorpointer { cursor: pointer; }

/* body css */
.body_wrap { background: url('/images/bg_brick.png') repeat-y; background-size: 100% auto; padding:0; width:100%; height:100%;  box-sizing: border-box; }
.body_container { max-width:750px; background-color: #ffffff; background-color:rgba( 255, 255, 255, 0.5 ); width:100%; height:100%; margin:0 auto; }
.body_container .body_logo { text-align: center; }
.body_container .body_logo > ul > li > h1 > img { width: 150px; }
.body_container .body_logo.dim {
	background-color: rgba( 255,255,255, 0.9 );
	-webkit-transition: all .5s ease-out 0.1s;
	-moz-transition: all .5s ease-out 0.1s;
	-o-transition: all .5s ease-out 0.1s;
	transition: all .5s ease-out 0.1s;
	box-shadow: 0 0.2rem 0.2rem #00000022;
}
.body_container .body_logo.dim:after { display: block; }

/* logo info change */
.body_container .body_logo { position:fixed; top:0; left:0; right:0; padding:20px; z-index:10; background-color: rgba( 255, 255, 255, 0 ); }

/* screen size 320 ~ 640 */
@media (min-width:320px) and (max-width:640px)  {
	.body_wrap { padding:0; }
	.body_container .body_logo { display: flex; text-align: left; }
	.body_container .body_logo ul { width:100%; }
	.body_container .body_logo li { display: inline-block; }
	.body_container .body_logo > ul > li > h1 > img { width: 100px; }
	.body_container .body_logo .topPageTitleLi { margin-top: 12px; float: right; }
	.body_container .body_logo .topPageTitle { color: #00483D; }
}

/* ========================================================= */

/*------------*/
/* login page */
/*------------*/

.login-area { max-width:714px; width:100%; margin:0 auto; }
.login-area .login-box {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	min-height: 100vh;
}

.login-area .login-box .login-box-sub {
	margin: auto;
	width: 450px;
	max-width: 100%;
	text-align: center;
}

.login-area .login-box .login-box-sub form {
	margin: auto;
	width: 450px;
	max-width: 100%;
	background: #fff;
	border-radius: 3px;
}

.login-area .login-form-head {
	text-align: center;
	background: #077287;/*#00483D*/
	padding: 50px;
}

.login-area .login-form-head h4 {
	letter-spacing: 0;
	text-transform: uppercase;
	font-weight: 600;
	margin-bottom: 7px;
	color: #fff;
}

.login-area .login-form-head p {
	color: #fff;
	font-size: 14px;
	line-height: 22px;
}

.login-area .login-form-body {
	padding: 50px;
}

.login-area .form-gp {
	margin-bottom: 25px;
	position: relative;
}

.login-area .form-gp label {
	position: absolute;
	left: 0;
	top: 0;
	color: #b3b2b2;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}

.login-area .form-gp.focused label {
	top: -15px;
	color: #7e74ff;
}

.login-area .form-gp input {
	width: 100%;
	height: 30px;
	border: none;
	border-bottom: 1px solid #e6e6e6;
}

.login-area .form-gp input::-webkit-input-placeholder { color: #dad7d7; }
.login-area .form-gp input::-moz-placeholder { color: #dad7d7; }
.login-area .form-gp input:-ms-input-placeholder { color: #dad7d7; }
.login-area .form-gp input:-moz-placeholder { color: #dad7d7; }
.login-area .form-gp i {
	position: absolute;
	right: 5px;
	bottom: 15px;
	color: #7e74ff;
	font-size: 16px;
}

.custom-control { position:relative; display:block; min-height:1.5rem; padding-left:1.5rem; }
.custom-control-label { margin-top: 2px; }
.custom-checkbox .custom-control-label::before { border-radius:.25rem; }
.custom-checkbox .custom-control-input:checked~.custom-control-label::before { background-color:#007bff; }
.custom-checkbox .custom-control-input:checked~.custom-control-label::after{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")}
.custom-checkbox .custom-control-input:indeterminate~.custom-control-label::before{background-color:#007bff}
.custom-checkbox .custom-control-input:indeterminate~.custom-control-label::after{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3E%3Cpath stroke='%23fff' d='M0 2h4'/%3E%3C/svg%3E")}
.custom-checkbox .custom-control-input:disabled:checked~.custom-control-label::before { background-color:rgba(0,123,255,.5); }
.custom-checkbox .custom-control-input:disabled:indeterminate~.custom-control-label::before { background-color:rgba(0,123,255,.5); }
.custom-control-input.is-valid~.custom-control-label,.was-validated .custom-control-input:valid~.custom-control-label { color:#28a745; }
.custom-control-input.is-valid~.custom-control-label::before,.was-validated .custom-control-input:valid~.custom-control-label::before { background-color:#71dd8a; }
.custom-control-input.is-valid~.valid-feedback,.custom-control-input.is-valid~.valid-tooltip,.was-validated .custom-control-input:valid~.valid-feedback,.was-validated .custom-control-input:valid~.valid-tooltip { display:block; }
.custom-control-input.is-valid:checked~.custom-control-label::before,.was-validated .custom-control-input:valid:checked~.custom-control-label::before { background-color:#34ce57; }
.custom-control-input.is-valid:focus~.custom-control-label::before,.was-validated .custom-control-input:valid:focus~.custom-control-label::before { box-shadow:0 0 0 1px #fff,0 0 0 .2rem rgba(40,167,69,.25); }

.login-area .row { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; }
.login-area .mb-4 { margin-bottom: 1.5rem !important; }
.login-area .mt-5 { margin-top: 3rem !important; }
.login-area .rmber-area { font-size: 13px; }
.login-area .rmber-area ul { width:100%; padding: 0; }
.login-area .rmber-area li {
	display: inline-block;
	min-height:1px;
}

.login-area .text-left { text-align: left !important; }
.login-area .text-center { text-align: center !important; }
.login-area .text-right { text-align: right !important; }
.login-area .mr-sm-2 { margin-right: .5rem !important; }
.login-area .text-muted { color: #6c757d !important; }

.login-area .submit-btn-area { text-align: center; }
.login-area .submit-btn-area button {
	width: 100%;
	height: 50px;
	border: none;
	/*
	background: #eff8f5;
	color: #585b5f;
	*/
	background: #68BBCB;/*#60B9A5*/
	color: #fff;
	border-radius: 40px;
	text-transform: uppercase;
	letter-spacing: 0;
	font-weight: 600;
	font-size: 12px;
	box-shadow: 0 0 22px rgba(0, 0, 0, 0.07);
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}

.login-area .submit-btn-area button:hover {
	background: #4DA7B9;/*#60B9A5*/
	color: #fff;
}

.login-area .submit-btn-area button i {
	margin-left: 15px;
	-webkit-transition: margin-left 0.3s ease 0s;
	transition: margin-left 0.3s ease 0s;
}

.login-area .submit-btn-area button:hover i { margin-left: 20px; }

.login-area .form-footer a { margin-left: 5px; }
.login-area .form-footer i {
	color: #ff6600;
	font-size: 16px;
}

/* screen size 320 ~ 640 */
@media (min-width:320px) and (max-width:640px)  {
	.login-area .login-box { padding: 65px 0 0 0; }
}

/* ========================================================= */

/*---------------------*/
/* id & pw search page */
/*---------------------*/

.idpw-area { max-width:714px; width:100%; margin:0 auto; }
.idpw-area .idpw-box {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	min-height: 100vh;
}

.idpw-area .idpw-box form {
	margin: auto;
	width: 450px;
	max-width: 100%;
	background: #fff;
	border-radius: 3px;
}

.idpw-area .idpw-form-head {
	text-align: center;
	background: #00483D;
	padding: 50px;
}

.idpw-area .idpw-form-head h4 {
	letter-spacing: 0;
	text-transform: uppercase;
	font-weight: 600;
	margin-bottom: 7px;
	color: #fff;
}

.idpw-area .idpw-form-head p {
	color: #fff;
	font-size: 14px;
	line-height: 22px;
}

.idpw-area .idpw-form-body {
	padding: 50px;
}

.idpw-area .form-gp {
	margin-bottom: 25px;
	position: relative;
}

.idpw-area .form-gp label {
	color: #b3b2b2;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}

.idpw-area .form-gp.focused label {
	color: #7e74ff;
}

.idpw-area .form-gp input {
	width: 100%;
	height: 30px;
	border: none;
	border-bottom: 1px solid #e6e6e6;
}

.idpw-area .form-gp input::-webkit-input-placeholder { color: #dad7d7; }
.idpw-area .form-gp input::-moz-placeholder { color: #dad7d7; }
.idpw-area .form-gp input:-ms-input-placeholder { color: #dad7d7; }
.idpw-area .form-gp input:-moz-placeholder { color: #dad7d7; }
.idpw-area .form-gp i {
	color: #7e74ff;
	font-size: 16px;
}

.idpw-area .row { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; }
.idpw-area .mb-4 { margin-bottom: 1.5rem !important; }
.idpw-area .mt-5 { margin-top: 3rem !important; }
.idpw-area .rmber-area { font-size: 13px; }
.idpw-area .text-right { margin-top:-13px; text-align: right !important; }
.idpw-area .text-center { text-align: center !important; }
.idpw-area .mr-sm-2 { margin-right: .5rem !important; }
.idpw-area .text-muted { color: #6c757d !important; }

.idpw-area .id_result { display:none; }
.idpw-area .id_result.on { display:block; font-weight:bold; color:#0066ff; }

/* 아이디 찾기 submit button */
.idpw-area .submit-btn-area { text-align: center; }
.idpw-area .submit-btn-area button {
	width: 100%;
	height: 50px;
	border: none;
	background: #60B9A5;
	color: #fff;
	border-radius: 40px;
	text-transform: uppercase;
	letter-spacing: 0;
	font-weight: 600;
	font-size: 12px;
	box-shadow: 0 0 22px rgba(0, 0, 0, 0.07);
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}

.idpw-area .submit-btn-area button:hover {
	background: #60B9A5;
	color: #fff;
}

.idpw-area .submit-btn-area button i {
	margin-left: 15px;
	-webkit-transition: margin-left 0.3s ease 0s;
	transition: margin-left 0.3s ease 0s;
}

.idpw-area .submit-btn-area button:hover i { margin-left: 20px; }
.idpw-area .submit-btn-area.off { display:none; }

/* 로그인 하러가기 button */
.idpw-area .login-btn-area { display:none; text-align: center; }
.idpw-area .login-btn-area button {
	width: 100%;
	height: 50px;
	border: none;
	background: #eb2e5e;
	color: #fff;
	border-radius: 40px;
	text-transform: uppercase;
	letter-spacing: 0;
	font-weight: 600;
	font-size: 12px;
	box-shadow: 0 0 22px rgba(0, 0, 0, 0.07);
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}

.idpw-area .login-btn-area button:hover {
	background: #eb2e5e;
	color: #fff;
}

.idpw-area .login-btn-area button i {
	margin-left: 15px;
	-webkit-transition: margin-left 0.3s ease 0s;
	transition: margin-left 0.3s ease 0s;
}

.idpw-area .login-btn-area button:hover i { margin-left: 20px; }
.idpw-area .login-btn-area.on { display:block; }

.idpw-area .form-footer a { margin-left: 5px; }
.idpw-area .form-footer i {
	color: #ff6600;
	font-size: 16px;
}

/* screen size 320 ~ 640 */
@media (min-width:320px) and (max-width:640px)  {
	.idpw-area .idpw-box { padding: 65px 0 0 0; }
}

/* ========================================================= */

/*-------*/
/* join1 */
/*-------*/

.join1-area { max-width:714px; width:100%; margin:0 auto; }
.join1-area .term { padding: 100px 0 0 0; }
.join1-area .term .header { top: 0; left:0; height:60px; padding:0 60px; background:#077287; z-index: 100; }
.join1-area .term .header.transparent { background: none; }
.join1-area .term .header h1 { font-size: 14px; font-weight: bold; color: #fff; text-align: center; line-height: 60px; }
.join1-area .term .header h1 img { display: block; width: 150px; margin: 23px auto 0; }
.join1-area .term .inner { padding: 20px 20px 20px 20px; background: #fff; }
.join1-area .term .row { margin-top:15px; }
.join1-area .term .textarea { overflow-y:auto; height:100%; margin-top:10px; padding:15px 20px; background:#f4f5f7; border-radius:4px; font-size:13px; line-height:1.5; color:#8d99a9; }
.join1-area .term .input-checkbox.total { padding-top:15px; }
.join1-area .term .input-checkbox.total span { font-size:13px; font-weight:bold; }
.join1-area .term .input-checkbox.total span em { font-size:11px; color:red; }

/* Button */
.join1-area .term .btn-wrap { position:fixed; bottom:0; max-width:714px; width:100%; padding:0; }
.join1-area .term .btn-wrap .btn { position:absolute; bottom:0; width:100%; }
.join1-area .term .btn-wrap .type { display:block; width:100%; height:50px; padding:0; font-size:14px; text-align:center; line-height:50px; }
.join1-area .term .btn-wrap .color { background:#001048; color:#fff; }
.join1-area .term .btn-wrap .disabled { background:#eee !important; border:none !important; color:#999 !important; }

/* screen size 320 ~ 640 */
@media (min-width:320px) and (max-width:640px)  {
	.join1-area .term { padding: 85px 0 0 0; }
	.join1-area .term .row { margin:15px 0 50px 0; }
	.join1-area .term .btn-wrap { background-color:#fff; }
	.join1-area .term .textarea { height:100%; }
}

/* ========================================================= */

/*-------*/
/* join2 */
/*-------*/

.join2-area { max-width:714px; width:100%; margin:0 auto; }
.join2-area { max-width:714px; width:100%; margin:0 auto; }
.join2-area .term { padding: 100px 0 0 0; }
.join2-area .term .header { top: 0; left:0; height:60px; padding:0 60px; background:#077287; z-index: 100; }
.join2-area .term .header.transparent { background: none; }
.join2-area .term .header h1 { font-size: 14px; font-weight: bold; color: #fff; text-align: center; line-height: 60px; }
.join2-area .term .header h1 img { display: block; width: 150px; margin: 23px auto 0; }
.join2-area .term .inner { padding: 20px 20px 20px 20px; background: #fff; }
.join2-area .term .row { margin-top:15px; }

.join2-area .term .input-text { position: relative; padding:9px 0 0 0; }
.join2-area .term .input-text .input-label { display:inline-block; width:105px; height:40px; font-size:13px; text-align:right; }
.join2-area .term .input-text input { width:80%; height:40px; padding:0; border:0; border-bottom:1px solid #eee; font-size:14px; color:#433131; }
.join2-area .term .input-text input::placeholder { font-size:14px; color:#999faa; }
.join2-area .term .input-text .zip_btn {
	width:80px;
	height:30px;
	display: inline-block;
	padding: 0;
	margin: 0;
	border: 1px solid #ccc;
	border-color: #dbdbdb #d2d2d2 #b2b2b2 #d2d2d3;
	cursor: pointer;
	color: #464646;
	border-radius: 0.2em;
	vertical-align: middle;
	font-size: 11px;
	line-height: 1.25em;
	background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#f2f2f2));
	background-image: -moz-linear-gradient(top,#fff,#f2f2f2);
	background-image: -o-gradient(top,#fff,#f2f2f2);
	background-image: linear-gradient(top,#fff,#f2f2f2);
}
.join2-area .term .input-text select { width:60%; height:30px; font-size:14px; color:#433131; }
.join2-area .term .input-text .error { display:none; position:absolute; bottom:-6px; left:110px; z-index:2; width:100%; font-size:10px; color:#ff5252; line-height:16px; }
.join2-area .term .input-text .error.on { display:block; }
.join2-area .term .input-text .readonly { height:40px; padding:0; border:0; border-bottom:1px solid #eee; font-size:14px; color:#433131; line-height:39px; }
.join2-area .term .input-text.type2 input { padding:0 10px; border:1px solid #ddd; border-radius:2px; }
.join2-area .term .input-text textarea { width:100%; height:200px; padding:10px; border:1px solid #eee; border-radius:6px; font-size:14px; color:#433131; }
.join2-area .term .input-text textarea::placeholder { font-size:14px; color:#999faa; }
.join2-area .term .sub-info { margin:5px 0 15px 115px; font-size:10px; color:#433131; }
.join2-area .term .sub-info .error { display:none; font-size:10px; color:#ff5252; }
.join2-area .term .sub-info .error.on { display:inline-block; }

.join2-area .term .notice_form { padding:20px; font-size:12px; background-color:#f3f3f3; }

/* Button */
.join2-area .term .btn-wrap { position:fixed; bottom:0; max-width:714px; width:100%; padding:0; }
.join2-area .term .btn-wrap .btn { position:absolute; bottom:0; width:100%; }
.join2-area .term .btn-wrap .type { display:block; width:100%; height:50px; padding:0; font-size:14px; text-align:center; line-height:50px; }
.join2-area .term .btn-wrap .color { background:#001048; color:#fff; }
.join2-area .term .btn-wrap .disabled { background:#eee !important; border:none !important; color:#999 !important; }

/* screen size 320 ~ 640 */
@media (min-width:320px) and (max-width:640px)  {
	.join2-area .term { padding: 85px 0 50px 0; }
	.join2-area .term .inner { padding: 20px 10px 20px 10px; background: #fff; }
	.join2-area .term .row { margin:15px 0 0 0; }

	.join2-area .term .input-text input { width:61%; }

	.join2-area .term .btn-wrap { background-color:#fff; }
	.join2-area .term .textarea { height:100%; }
}

/* ========================================================= */

/*------*/
/* body */
/*------*/

.body-area { max-width:714px; width:100%; margin:0 auto; }
.body-area .term { padding: 100px 0 0 0; }

.body-area .term .header { width: 100%; height: 70px; padding: auto; background: #077287; border-radius: 0px; z-index: 100; }
.body-area .term .header .image {
	display: inline-block;
	padding:11px 5px 11px 11px;
}
.body-area .term .header .image img {
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	border-radius: 50%;
	vertical-align: bottom !important;
}
.body-area .term .header .userInfo {
	display:inline-block;
	color:#fff;
	font-size: 13px;
}

.body-area .term .header .btn_info_area {
	display:inline-block;
	float: right;
	padding:18px 11px 18px 0;
}

.body-area .term .inner { padding: 10px 0 10px 0; }
.body-area .term .inner .row { margin:0; padding:15px; background: #fff; }

/* Tab menu */
.body-area .term .inner .row .tabmenu {
	padding: 0;
	margin: 0;
	background: #ffffff;
}

.body-area .term .inner .row .tabmenu section {
	border-top: 1px solid #ddd;
}

.body-area .term .inner .row .body_view { 
	display:block;
	padding:20px 0 100px 0;
}

.body-area .term .inner .row .body_view .info_body {
	border: 1px solid #eee;
	padding: 5px;
}

/* 라디오버튼 숨김 */
.body-area .term .inner .row .tabmenu input[type="radio"] { display: none; }
.body-area .term .inner .row .tabmenu label {
	display: inline-block;
	margin: 0 0 -1px;
	padding: 15px;
	font-weight: 600;
	text-align: center;
	color: #bbb;
	border: 1px solid transparent;
}

.body-area .term .inner .row .tabmenu label:hover {
	color: #45A3B4;
	cursor: pointer;
}

/*input 클릭시, label 스타일*/
.body-area .term .inner .row .tabmenu input[type="radio"]:checked + label {
	color: #555;
	border: 1px solid #ddd;
	border-top: 2px solid #3E9DAF;
	border-bottom: 1px solid #ffffff;
}

/* bottom fix menu */
.body-area .term .bottom-wrap { position:fixed; bottom:0; max-width:714px; width:100%; height:60px; padding:0; background:#000; text-align: center; padding-top:12px; z-index: 100; }
.body-area .term .bottom-wrap .divdisplay {
	display: inline-block;
	width: 20%;
	color:#fff;
	font-size:12px;
}
.body-area .term .bottom-wrap .divdisplay .btnfont {
	padding-top:7px;
	color:#fff;
}

/* button */
.btn {
	padding: 0;
	font-size: 12px;
	letter-spacing: 0;
	display: inline-block;
	font-weight: bold;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: 1px solid transparent;
	padding: 7px;
	line-height: 1.5;
	/*border-radius: .25rem;*/
	transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.mb-3 {
	margin-bottom: 1rem!important;
}
.btn-colorred {
	color: #fff;
	background-color: #dc3545;
	border-color: #dc3545;
}
.btn-colorblue {
	color: #fff;
	background-color: #007bff;
	border-color: #007bff;
}

/* screen size 320 ~ 640 */
@media (min-width:320px) and (max-width:640px)  {
	.body-area .term { padding: 85px 0 0 0; }
	.body-area .term .row { margin:15px 0 50px 0; }
	.body-area .term .bottom-wrap { background-color:#000; }
}

/* Tables */
.table {
	width: 100%;
	max-width: 100%;
	margin-bottom: 20px;
}
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
	padding: 8px;
	line-height: 1.42857143;
	vertical-align: top;
	border-top: 1px solid #ddd;
}
.table > thead > tr > th {
	vertical-align: bottom;
	border-bottom: 2px solid #ddd;
}
.table > caption + thead > tr:first-child > th,
.table > colgroup + thead > tr:first-child > th,
.table > thead:first-child > tr:first-child > th,
.table > caption + thead > tr:first-child > td,
.table > colgroup + thead > tr:first-child > td,
.table > thead:first-child > tr:first-child > td {
	border-top: 0;
}
.table > tbody + tbody {
	border-top: 2px solid #ddd;
}
.table .table {
	background-color: #fff;
}

.table tbody tr td, .table tbody tr th {
	padding: 10px;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
}

.table tbody tr.primary td, .table tbody tr.primary th {
	background-color: #1f91f3;
	color: #fff;
}

.table tbody tr.success td, .table tbody tr.success th {
	background-color: #2b982b;
	color: #fff;
}

.table tbody tr.info td, .table tbody tr.info th {
	background-color: #00b0e4;
	color: #fff;
}

.table tbody tr.warning td, .table tbody tr.warning th {
	background-color: #ff9600;
	color: #fff;
}

.table tbody tr.danger td, .table tbody tr.danger th {
	background-color: #fb483a;
	color: #fff;
}

.table thead tr th {
	padding: 10px;
	border-bottom: 1px solid #eee;
}

.table-bordered { border-top: 1px solid #eee; }
.table-bordered tbody tr td, .table-bordered tbody tr th {
	padding: 10px;
	border: 1px solid #eee;
}
.table-bordered thead tr th {
	padding: 10px;
	border: 1px solid #eee;
}

.table-striped > tbody > tr:nth-of-type(odd) {
	background-color: #f9f9f9;
}

.table-hover > tbody > tr:hover {
	background-color: #f5f5f5;
}

/* 페이징 (S) */
.page_wrap {
	text-align:center;
	font-size:0;
 }
.page_nation {
	display:inline-block;
}
.page_nation .none {
	display:none;
}
.page_nation a {
	display:block;
	margin:0 3px;
	float:left;
	border:1px solid #e6e6e6;
	width:28px;
	height:28px;
	line-height:28px;
	text-align:center;
	background-color:#fff;
	font-size:13px;
	color:#999999;
	text-decoration:none;
}
.page_nation .arrow {
	border:1px solid #ccc;
}
.page_nation .pprev {
	background:#f8f8f8 url('/images/page_pprev.png') no-repeat center center;
	margin-left:0;
}
.page_nation .prev {
	background:#f8f8f8 url('/images/page_prev.png') no-repeat center center;
	margin-right:7px;
}
.page_nation .next {
	background:#f8f8f8 url('/images/page_next.png') no-repeat center center;
	margin-left:7px;
}
.page_nation .nnext {
	background:#f8f8f8 url('/images/page_nnext.png') no-repeat center center;
	margin-right:0;
}
.page_nation a.active {
	background-color:#42454c;
	color:#fff;
	border:1px solid #42454c;
}
/* 페이징 (E) */

/* ========================================================= */

/*------------*/
/* 레이어팝업 */
/*------------*/

/* 마스크 */
#mask {
	display: none;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 200;
	background-color: #000;
	opacity: 0.8;
}

/* 팝업창 */
.popupLayer {
	display: none;
	position: fixed;
	top : 0px;
	background-color: #fff;
	z-index: 210;
}

/* ========================================================= */

/*-----------------------------------*/
/* 메인 - 기본정보, 수익내역, 추천인 */
/*-----------------------------------*/

/* 기본정보 */
.info_body .index_title {
	line-height: 35px;/*50px*/
	padding: 5px 10px 5px 10px;
	margin: 0;
	color: #fff;
	font-weight: bolder;
	background-color: #52b9cd;/*#3E9DAF*/
	/*display: flex;*/
	align-items: center;
}
.info_body .index_title_sub1 { color: #fff; }
.info_body .index_title_sub2 { color: #000; }

.info_body .index_body ul li {
	margin: 0;
	padding: 5px 0 0 0;
	font-size: 14px;
}

.info_body .index_body div {
	display: flex;
	align-items: center;
	line-height: 50px;
	padding: 0 10px 0 10px;
	background-color: #ebf8f4;
}

.info_body .index_body .data_title {
	font-weight: bold;
	background-color: #E6F3F7;
}
.info_body .index_body .data_info {
	padding: 0 0 0 20px;
	border-bottom: 1px solid #dff2ed;
}

/* 수익내역 */
.info_body .profit_date {
	line-height: 35px;
	padding: 0 0 5px 0;
	margin: 0;
	float: right;
}
.info_body .profit_date select { height:25px; font-size:14px; }
.info_body .profit_info {
	line-height: 30px;
	padding: 10px;
	margin: 0;
	color: #fff;
	font-size:13px;
	font-weight: bold;
	text-align: center;
	background-color: #348694;
}
.info_body .profit_info .date_color { color: #ffcc00; }
.info_body .profit_info .deep_color { color: #66ff00; }
.info_body .profit_info2 {
	line-height: 30px;
	padding: 10px;
	margin: 0;
	color: #fff;
	font-size:13px;
	font-weight: bold;
	text-align: center;
	background-color: #345694;
}

/* 추천인 */

/* ========================================================= */

/*--------------------*/
/* 상품구매, 구매내역 */
/*--------------------*/

/* 상품구매 */
.info_body .goods_title {
	display: flex;
	align-items: center;
	padding: 10px 0 10px 10px;
	background-color: #689DF5;
	color: #fff;
	font-weight: bold;
}

.info_body .goods_list ul {
	padding: 10px 0 10px 0;
	text-align: center;
}
.info_body .goods_list li {
	display: inline-block;
	overflow:auto;
	padding: 5px;
	width: 200px;
	@media screen and (max-width: 767px) {
		width: 150px;
	}
}
.info_body .goods_list .goods_box {
	padding: 20px 0 20px 0;
	text-align: center;
	border:2px solid #EFEFEF;
	border-radius: 10px;
}

.info_body .pay_method ul {
	padding: 10px 0 5px 0;
	text-align: center;
}
.info_body .pay_method li {
	display: inline-block;
	overflow:auto;
	padding: 5px;
	width: 150px;
}
.info_body .pay_method .pay_box {
	padding: 20px 0 20px 0;
	text-align: center;
	border:2px solid #e0e4fe;
	border-radius: 10px;
}

.info_body .pay_notice ul {
	padding: 10px 0 5px 0;
}
.info_body .pay_notice li {
	overflow:auto;
	padding: 5px;
}
.info_body .pay_notice .account_info {
	padding: 10px;
	font-weight: bold;
	background-color: #dce9fe;
}
.info_body .pay_notice .refund_info {
	padding: 7px;
}

/* buy bottom fix menu */
.body-area .term .buy_button_area {
	max-width:714px; 
	width:100%;
	position:fixed;
	bottom:72px;
	padding:0;
	text-align: center;
	display: none;
	background-color:rgba( 255, 255, 255, 0.7 );
}
.body-area .term .buy_button_area .buy_button {
	width:96px;
	height:96px;
	display: inline-block;
}

/* 구매내역 */
.info_body .goodsBuyList ul li {
	padding: 5px 0 5px 0;
}

.info_body .goodsBuyList .goods_box {
	display: grid;
	grid-template-columns: 130px 1fr;
	padding: 5px;
	border-radius: 10px;
	font-size: 12px;
}
.info_body .goodsBuyList .boxborder1 { border: 3px solid #26608e; }
.info_body .goodsBuyList .boxborder2 { border: 3px solid #ad078c; }
.info_body .goodsBuyList .goods_box .imgbox {
	grid-row: span 4;
	display: flex;
	align-items: center;
	width: 130px;
}
.info_body .goodsBuyList .goods_box .goodsbox1 { 
	line-height: 17px;
	border-bottom: 1px solid #000;
	display: flex;
	align-items: center;
}
.info_body .goodsBuyList .goods_box .goodsbox2 {
	line-height: 17px;
	border-bottom: 1px solid #000;
	display: flex;
	align-items: center;
}
.info_body .goodsBuyList .goods_box .goodsbox3 {
	line-height: 17px;
	border-bottom: 1px solid #000;
	display: flex;
	align-items: center;
}
.info_body .goodsBuyList .goods_box .goodsbox4 {
	line-height: 17px;
	border-bottom: 1px solid #000;
	display: flex;
	align-items: center;
}

/* ========================================================= */

/*---------------------*/
/* 내정보, 내정보 수정 */
/*---------------------*/
.info_body input {
	display: block;
	width: 100%;
	height: 30px;
	border: 1px solid #e6e6e6;
}
.info_body input::-webkit-input-placeholder { color: #dad7d7; }
.info_body input::-moz-placeholder { color: #dad7d7; }
.info_body input:-ms-input-placeholder { color: #dad7d7; }
.info_body input:-moz-placeholder { color: #dad7d7; }

.info_body .btn_info_area {
	display:inline-block;
	text-align: center;
	padding:0;
}

/* 내정보 */
.info_body .info_body_small { padding:0; width: 100%; }
.info_body .info_body_small .input-text { position: relative; padding:9px 0 0 0; }
.info_body .info_body_small .input-text .input-label { display:inline-block; width:80px; height:40px; font-size:13px; text-align:right; }
.info_body .info_body_small .input-text div { display: inline-block; width: 85%; height:35px; padding:10px 0 0 0; border:0; border-bottom:1px solid #eee; font-size:14px; color:#433131; }

.info_body .input-text { position: relative; padding:9px 0 0 0; }
.info_body .input-text .input-label { display:inline-block; width:105px; height:40px; font-size:13px; text-align:right; }
.info_body .input-text div { display: inline-block; width: 82%; }
.info_body .input-text input { width:100%; height:40px; padding:0; border:0; border-bottom:1px solid #eee; font-size:14px; color:#433131; }
.info_body .input-text input::placeholder { font-size:14px; color:#999faa; }
.info_body .input-text ul { padding: 0; margin: 0; }
.info_body .input-text li { display: inline-block; }
.info_body .input-text .zip_btn {
	width:80px;
	height:30px;
	display: inline-block;
	padding: 0;
	margin: 0;
	border: 1px solid #ccc;
	border-color: #dbdbdb #d2d2d2 #b2b2b2 #d2d2d3;
	cursor: pointer;
	color: #464646;
	border-radius: 0.2em;
	vertical-align: middle;
	font-size: 11px;
	line-height: 1.25em;
	background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#f2f2f2));
	background-image: -moz-linear-gradient(top,#fff,#f2f2f2);
	background-image: -o-gradient(top,#fff,#f2f2f2);
	background-image: linear-gradient(top,#fff,#f2f2f2);
}

.info_body .input-text select { width:100%; height:30px; font-size:14px; color:#433131; }
.info_body .input-text .error { display:none; position:absolute; bottom:-6px; left:110px; z-index:2; width:100%; font-size:10px; color:#ff5252; line-height:16px; }
.info_body .input-text .error.on { display:block; }
.info_body .input-text .readonly { height:40px; padding:0; border:0; border-bottom:1px solid #eee; font-size:14px; color:#433131; line-height:39px; }
.info_body .input-text.type2 input { padding:0 10px; border:1px solid #ddd; border-radius:2px; }
.info_body .input-text textarea { width:100%; height:200px; padding:10px; border:1px solid #eee; border-radius:6px; font-size:14px; color:#433131; }
.info_body .input-text textarea::placeholder { font-size:14px; color:#999faa; }
.info_body .sub-info { margin:5px 0 15px 115px; font-size:10px; color:#433131; }
.info_body .sub-info .error { display:none; font-size:10px; color:#ff5252; }
.info_body .sub-info .error.on { display:inline-block; }

.info_body .notice_form { padding:20px; font-size:12px; background-color:#f3f3f3; }

/* 비밀번호 변경창 */
.pwdChangeWindow {
	padding: 10px;
	margin: 0;
	width: 240px;
	height: 270px;
}
.pwdChangeWindow ul { padding: 0; margin: 0; }
.pwdChangeWindow ul li { padding: 10px 0 0 0; margin: 0; }
.pwdChangeWindow input { width: 100%; height:30px; padding:0; border:0; border-bottom:1px solid #eee; font-size:14px; color:#433131; }
.pwdChangeWindow input::placeholder { font-size:14px; color:#999faa; }

/* screen size 320 ~ 640 */
@media (min-width:320px) and (max-width:640px)  {
	.info_body .info_body_small .input-text div { display:inline-block; width: 65%; }
	.info_body .input-text div { display:inline-block; width: 60%; }
	.info_body .textarea { height:100%; }
}

/* ========================================================= */

/*----------*/
/* 공지사항 */
/*----------*/

.body_view .btn_info_area {
	display:inline-block;
	float: left;
	padding:0;
}