@charset "UTF-8";
@import url("https://fonts.googleapis.com/earlyaccess/notosanskr.css");
@import url('https://fonts.googleapis.com/earlyaccess/nanumgothic.css');
@import url('https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css');
@font-face {
	font-family: 'Albertus';
	src: url('./AlbertusMedium-Regular.eot');
	src: url('./AlbertusMedium-Regular.eot?#iefix') format('embedded-opentype'),
		url('./AlbertusMedium-Regular.woff2') format('woff2'),
		url('./AlbertusMedium-Regular.woff') format('woff');
	font-weight: 500;
	font-style: normal;
}

/*** RESET ***/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, textarea, input, select, button,p, blockquote, th, td {
	margin:0; 
	padding:0; 
	word-break:keep-all;
}
h1, h2, h3, h4, h5, h6 {font-weight:bold;}
fieldset, img {border:0 none;}
dl, ul, ol, menu, li {list-style:none;}
body {background:white; overflow-x:hidden;}
body, html {width:100%; height:100%;}
body, th, td, input, select, textarea, button {
	font-size:14px;
	line-height:1.5;
	font-family: "Nanum Gothic", sans-serif;
	font-weight:normal;
	color:#222;
	background:white;
	vertical-align:middle;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
}
a {color:inherit; text-decoration:none; cursor:pointer;}
a:active,  a:hover {text-decoration:none;}
address, caption, cite, code, dfn, em, var {font-style:normal; font-weight:normal;}
img {vertical-align:middle;}



/*** 랜딩 이미지 & 로그인 화면 ***/
#main {width:100vw; height:100%; background-image:url("../img/login-bg.png"); background-repeat:no-repeat; background-position:center top; background-size:100% auto;}
#main .landing {position:fixed; display:none; top:0; left:0; width:100vw; height:100%; z-index:9999; background-image:url("../img/login-bg.png");}
#main .landing img {position:absolute; width:60vw; top:28%; left:20vw;}
#main .landing p {position:absolute; width:100vw; bottom:3%; text-align:center; font-size:11px; font-family:"Arial", sans-serif; color:black; letter-spacing:-0.5px;}
#main #login {display:none; width:100%; height:100%;}
#main #login h1 {width:100%; text-align:center; padding:32px 0;}
#main #login h1 img {height:62px; width:auto;}
#main #login form {position:relative; width:calc(100% - 60px); height:calc(100% - 216px); min-height:340px; margin-bottom:10px; padding:25px 30px; background:white; border-radius:40px;}
#main #login form h2 {font-size:34px; margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#main #login form .input {width:calc(100% - 30px); padding:0 15px; height:50px; margin-bottom:20px; border:1px solid #B8B8B8; border-radius:25px;}
#main #login form .input img {float:left; vertical-align:top; height:20px; margin-top:15px;}
#main #login form .input input {float:right; width:calc(100% - 30px); height:100%; border:none; background:none; font-size:16px; color:#878787;}
#main #login form button {clear:both; display:block; width:100%; height:50px; margin-bottom:20px; font-size:18px; font-family:"NanumSquare"; font-weight:bold; color:white; background:#503222; border:none; border-radius:40px;}
#main #login form .chk-box {text-align:center;}
#main #login form .chk-box label {height:20px; line-height:20px; font-weight:bold; color:#4e3263; letter-spacing:-0.5px;}
#main #login form .chk-box label input {display:none;}
#main #login form .chk-box label input ~ span {display:inline-block; vertical-align:top; width:20px; height:20px; margin-right:8px; background-image:url("../img/login-chk-off.png"); background-repeat:no-repeat; background-position:center center; background-size:100%;}
#main #login form .chk-box label input:checked ~ span {background-image:url("../img/login-chk-on.png");}
#main #login form p:not(.input) {position:absolute; width:calc(100% - 60px); bottom:5%; text-align:center; font-size:13px; font-family:"NanumSquare"; font-weight:500;}
#main #cont3 {position:fixed; display:none; top:10vh; left:0; width:100vw; height:calc(80vh - 80px); padding:40px 0; background:white; border-radius:40px; z-index:999999;}
#main #cont3 .wrap > img {display:block; width:auto; margin:0 auto;}
#main #cont3 .input {width:calc(100% - 30px); padding:0 15px; height:50px; margin:10px auto 0 auto; border:1px solid #B8B8B8; border-radius:25px;}
#main #cont3 .input img {float:left; vertical-align:top; height:20px; margin-top:15px;}
#main #cont3 .input input {float:right; width:calc(100% - 30px); height:100%; border:none; background:none; font-size:16px; color:#878787;}
#main #cont3 button {clear:both; display:block; width:100%; height:50px; margin:10px auto; font-size:18px; font-family:"NanumSquare"; font-weight:bold; color:white; background:#503222; border:none; border-radius:40px;}

/*** 랜딩 이미지 & 로그인 화면 - 반응형 ***/
@media screen and (max-width:350px) {
#main #login form h2 {font-size:32px; margin-bottom:25px;}
#main #login form .input {height:46px; border-radius:23px; margin-bottom:15px;}
#main #login form button {height:46px; border-radius:23px; margin-bottom:15px; font-size:16px;}
#main #login form .input img {margin-top:13px;}
}

/*** 공통 ***/
.wrap {position:relative; width:90%; height:auto; margin:0 auto;}
.clear {clear:both;}
header {position:fixed; width:100%; height:52px; padding:20px 0; top:0; left:0; background:#428bca; z-index:999;}
header a {position:absolute; display:block; top:50%;}
header h1 {text-align:center;}
header h1 img {height:52px;}
header .menu {left:0; margin-top:-12px;}
header .menu img {height:24px;}
h2.gray {text-align:center; font-size:32px !important; line-height:1.5;}
h2.gray span {display:block; font-size:16px; font-weight:normal; color:#999;}
#ui-btns {position:fixed; width:100%; bottom:0; left:0; height:70px; background:#503222; border-top-left-radius:25px; border-top-right-radius:25px; z-index:99;}
#ui-btns ul {width:90%; margin:0 auto; padding:12px 0 10px 0; text-align:center;}
#ui-btns ul li {float:left; width:25%; text-align:center;}
#ui-btns ul li a {color:white; font-size:12px; line-height:1;}
#ui-btns ul li a img {display:inline-block; height:22px; margin-bottom:5px;}
#modal-bg {position:fixed; display:none; top:0; left:0; width:100vw; height:100vh; background:rgba(0, 0, 0, 0.6); z-index:999;}

#submenu {position:fixed; width:75vw; height:100vh; top:0; left:0; margin-left:-75vw; z-index:9999; background:white; border-top-right-radius:40px; overflow-y:auto !important;}
#submenu #s_top {position:relative; padding:20px; background:#503222;}
#submenu #s_top .close-sub {position:absolute; top:20px; right:20px;}
#submenu #s_top .close-sub img {width:25px; height:25px;}
#submenu #s_top > img {position:absolute; display:block; width:40px; height:40px; top:50%; left:20px; margin-top:-20px;}
#submenu #s_top h3 {margin-left:55px; color:white; font-size:14px; font-weight:normal;}
#submenu #s_top h3 b {font-size:18px; font-weight:bold;}
#submenu #l_side_height {width:calc(100% - 40px); height:calc(100vh - 280px); padding:10px 20px; overflow-y:auto;}
#submenu ul {height:auto;}
#submenu ul li {border-bottom:1px solid #ddd;}
#submenu ul li a {display:block; width:100%; height:54px; line-height:54px; font-size:15px;}
#submenu ul li a img {display:inline-block;}
#submenu .ver {padding:10px 20px 20px 20px; color:#aaa; text-align:right;}
#submenu .btn {padding:0 20px;}
#submenu .btn a {display:block; width:100%; height:40px; line-height:40px; font-size:15px; color:white; text-align:center; border-radius:10px; background:#503222;}

.modal-log {position:fixed; display:none; top:0px; left:10vw; width:80vw; text-align:center; background:white; border-radius:20px; z-index:99999; overflow:hidden; box-shadow:4px 4px 6px rgba(0, 0, 0, 0.2);}
.modal-log h3 {height:60px; line-height:60px; font-size:18px; color:white; background:#503222;}
.modal-log p:not(.m-btn) {margin:20px 0; font-size:15px; line-height:20px;}
.modal-log p:not(.m-btn) b {color:#FF5500; font-size:1.2em;}
.modal-log p.m-btn {margin-bottom:20px;}
.modal-log p.m-btn a {display:block; width:60%; height:40px; margin:0 auto; line-height:40px; text-align:center; font-size:15px; font-weight:bold; color:white; background:#503222; border:1px solid #503222; border-radius:20px;}

/*** 공통 - 반응형 ***/
@media screen and (max-width:350px) {
h2.gray {font-size:28px !important;}
}

/*** 구글 본인인증 화면 ***/
#google {width:100vw; height:100%; background-image:url("../img/login-bg.png"); background-repeat:no-repeat; background-position:center top; background-size:100% auto;}
#google h1 {width:100%; text-align:center; padding:32px 0;}
#google h1 img {height:62px; width:auto;}
#google #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#google #cont1 .wrap > img {display:block; width:auto; margin:0 auto;}
#google #cont1 .input {width:calc(100% - 30px); padding:0 15px; height:50px; margin:10px auto 0 auto; border:1px solid #B8B8B8; border-radius:25px;}
#google #cont1 .input img {float:left; vertical-align:top; height:20px; margin-top:15px;}
#google #cont1 .input input {float:right; width:calc(100% - 30px); height:100%; border:none; background:none; font-size:16px; color:#878787;}
#google #cont1 button {clear:both; display:block; width:100%; height:50px; margin:10px auto; font-size:18px; font-family:"NanumSquare"; font-weight:bold; color:white; background:#503222; border:none; border-radius:40px;}


/*** 메인 화면 ***/
#front {height:calc(100vh - 162px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#front #cont1 {min-height:calc(100vh - 252px); padding:40px 0; border-radius:40px; background:white;}
#front #cont1 .wallet {display:block; width:50%; margin:0 auto 40px auto;}
#front #cont1 dl {}
#front #cont1 dl dd {padding-bottom:5px; margin-bottom:20px; border-bottom:1px solid #ddd;}
#front #cont1 dl dd p:nth-of-type(1) {top:0; left:0;}
#front #cont1 dl dd p:nth-of-type(1) b {display:block; font-size:15px;}
#front #cont1 dl dd p:nth-of-type(1) span {font-size:12px; color:#777;}
#front #cont1 dl dd p:nth-of-type(2) {text-align:right; font-size:18px;}
#front #cont1 dl dd p:nth-of-type(2) strong {font-size:25px;}
#front #cont2 {position:fixed; display:none; top:10vh; left:0; width:100vw; height:calc(80vh - 80px); padding:40px 0; background:white; border-radius:40px; z-index:999999;}
#front #cont2 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#front #cont2 table {width:100%; margin-bottom:15px; border-collapse:collapse; border-top:2px solid #503222;}
#front #cont2 table th,
#front #cont2 table td {padding:10px; border-bottom:1px solid #ddd; background:transparent;}
#front #cont2 table th {font-size:14px; font-weight:bold;}
#front #cont2 table td {font-size:12px; letter-spacing:-0.5px; white-space:pre-wrap;}
#front #cont2 .btn {position:absolute; right:0; top:46px;}
#front #cont2 .btn a {clear:both; display:inline-block; padding:0 15px; height:22px; line-height:22px; text-align:center; font-size:13px; font-family:"NanumSquare"; font-weight:bold; border:1px solid #503222; border-radius:40px; color:white; background:#503222;}
#front #cont2 #chk_box {position:absolute; left:0; top:50px;}
#front #cont2 #chk_box input {display:none; line-height:30px;}
#front #cont2 #chk_box input ~ span {display:inline-block; vertical-align:top; width:20px; height:20px; background-image:url("../img/login-chk-off.png"); background-repeat:no-repeat; background-position:center center; background-size:cover;}
#front #cont2 #chk_box input:checked ~ span {background-image:url("../img/login-chk-on.png");}
@media screen and (max-width:350px) {
#front #cont2 #chk_box {top:44px;}
#front #cont2 .btn {top:40px;}
}

/*** 아이디 찾기 ***/
#find_ID {min-height:calc(100vh - 92px); padding:92px 0 0 0; overflow-y:auto; background:#428bca;}
#find_ID #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#find_ID #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#find_ID #cont1 dl {}
#find_ID #cont1 dd {position:relative;  height:50px; line-height:50px; padding:0 20px; margin-bottom:20px; border-radius:25px; border:1px solid #B8B8B8;}
#find_ID #cont1 dd input {height:100%; font-size:16px; background:transparent; border:none; vertical-align:top;}
#find_ID #cont1 dd:not(:nth-of-type(2)) input {width:100%;}
#find_ID #cont1 dd:nth-of-type(2) input {width:calc(100% - 66px);}
#find_ID #cont1 dd a {position:absolute; display:block; height:30px; top:50%; right:10px; margin-top:-15px; line-height:30px; padding:0 12px; font-size:12px; font-weight:bold; color:white; background:#503222; border-radius:15px;}
#find_ID #cont1 .btn {}
#find_ID #cont1 .btn a {clear:both; display:block; width:100%; height:50px; line-height:50px; text-align:center; font-size:18px; font-family:"NanumSquare"; font-weight:bold; color:white; border:none; background:#503222; border-radius:40px;}

/*** 비밀번호 찾기 ***/
#find_PW {min-height:calc(100vh - 162px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#find_PW #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#find_PW #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#find_PW #cont1 dl {}
#find_PW #cont1 dd {position:relative;  height:50px; line-height:50px; padding:0 20px; margin-bottom:20px; border-radius:25px; border:1px solid #B8B8B8;}
#find_PW #cont1 dd input {height:100%; font-size:16px; background:transparent; border:none; vertical-align:top;}
#find_PW #cont1 dd:not(:nth-of-type(2)) input {width:100%;}
#find_PW #cont1 dd:nth-of-type(2) input {width:calc(100% - 66px);}
#find_PW #cont1 dd a {position:absolute; display:block; height:30px; top:50%; right:10px; margin-top:-15px; line-height:30px; padding:0 12px; font-size:12px; font-weight:bold; color:white; background:#503222; border-radius:15px;}
#find_PW #cont1 .btn {}
#find_PW #cont1 .btn a {clear:both; display:block; width:100%; height:50px; line-height:50px; text-align:center; font-size:18px; font-family:"NanumSquare"; font-weight:bold; color:white; background:#503222; border:none; border-radius:40px;}

/*** MY 정보 ***/
#my_info {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#my_info #cont0 {position:fixed; display:none; width:100%; top:10vh; left:0; padding:40px 0; background:white; border-radius:40px; z-index:99999;}
#my_info #cont0 .input {width:calc(90% - 30px); padding:0 15px; height:50px; margin:10px auto 0 auto; border:1px solid #B8B8B8; border-radius:25px;}
#my_info #cont0 .input img {float:left; vertical-align:top; height:20px; margin-top:15px;}
#my_info #cont0 .input input {float:right; width:calc(100% - 30px); height:100%; border:none; background:none; font-size:16px; color:#878787;}
#my_info #cont0 button {clear:both; display:block; width:90%; height:50px; margin:10px auto; font-size:18px; font-family:"NanumSquare"; font-weight:bold; color:white; background:#503222; border:none; border-radius:40px;}
#my_info #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#my_info #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#my_info #cont1 dl {}
#my_info #cont1 dt {margin-bottom:5px; padding-left:13px; font-size:14px; font-weight:bold;}
#my_info #cont1 dd {position:relative;  height:50px; line-height:50px; padding:0 20px; margin-bottom:20px; border-radius:25px; border:1px solid #B8B8B8;}
#my_info #cont1 dd input {height:100%; font-size:16px; background:transparent; border:none; vertical-align:top;}
#my_info #cont1 dd:not(:nth-of-type(2)) input {width:100%;}
#my_info #cont1 dd:nth-of-type(2) input {width:calc(100% - 66px);}
#my_info #cont1 dd a {position:absolute; display:block; height:30px; top:50%; right:10px; margin-top:-15px; line-height:30px; padding:0 12px; font-size:12px; font-weight:bold; color:white; background:#503222; border-radius:15px;}
#my_info #cont1 .btn {display:none; text-align:center;}
#my_info #cont1 .btn a {clear:both; display:inline-block; width:45%; height:42px; line-height:42px; text-align:center; font-size:16px; font-family:"NanumSquare"; font-weight:bold; border:1px solid #503222; border-radius:40px;}
#my_info #cont1 .btn .cancel {color:#503222; margin-right:5px;}
#my_info #cont1 .btn .my_info {color:white; background:#503222;}

/*** 매출관리 ***/
#sales {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#sales #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#sales #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#sales #cont1 #src_bar {margin-bottom:10px; text-align:center;}
#sales #cont1 #src_bar b {display:inline-block; height:30px; line-height:30px; margin-right:1%;}
#sales #cont1 #src_bar input {display:inline-block; width:calc(38% - 10px); padding:0 5px; border-radius:8px; height:30px; text-align:center; border:1px solid #ddd;}
#sales #cont1 #src_bar .btn {margin-top:10px; text-align:center;}
#sales #cont1 #src_bar .btn a {clear:both; display:inline-block; width:45%; height:42px; line-height:42px; text-align:center; font-size:16px; font-family:"NanumSquare"; font-weight:bold; border:1px solid #503222; border-radius:40px; color:white; background:#503222;}
#sales #sale_total {padding: 15px 20px; text-align: center; background: rgba(80, 50, 34, 0.1); border-radius: 20px;}
#sales #sale_total p {font-size:16px; color:#222; font-weight:bold;}
#sales #sale_total p b {font-size: 25px; color: #FF5500;}
#sales #cont1 dl {}
#sales #cont1 dl dd {position:relative; padding:20px 0 50px 0; border-bottom:1px solid #ddd;}
#sales #cont1 dl dd.null {padding:0; text-align:center; font-size:16px; color:#aaa; border-bottom:none;}
#sales #cont1 dl dd p:nth-of-type(1) {top:0; left:0;}
#sales #cont1 dl dd p:nth-of-type(1) b {display:inline-block;}
#sales #cont1 dl dd p:nth-of-type(1) span {font-size:12px; color:#777;}
#sales #cont1 dl dd p:nth-of-type(2) {margin-top:5px; font-size:18px;}
#sales #cont1 dl dd p:nth-of-type(2) strong {font-size:25px; color:#FF5500;}
#sales #cont1 dl dd p.btn {position:absolute; top:50%; right:0; margin-top:-42px;}
#sales #cont1 dl dd p.btn a {display:block; padding:3px 10px; text-align:center; font-size:13px; border:1px solid #503222; border-radius:5px;}
#sales #cont1 dl dd p.btn a:not(:last-of-type) {margin-bottom:8px;}
#sales #cont1 dl dd p.btn a.modal {color:white; background:#503222;}
#sales #cont1 dl dd p.btn a:not(.modal) {color:#503222; background:white;}
#sales .modal-log p.m-btn a {display:inline-block; width:35%;}
#sales .modal-log p.m-btn a.cancel {background:transparent; color:#503222;}
#receipt_box {position:fixed; display:none; top:0; left:0; width:100vw; height:100vh; font-family:"NanumSquare", sans-serif; background:#07102D; z-index:999999;}
#receipt_wrap {position:absolute; width:95vw; height:94vh; top:2vh; left:2.5vw; background:white; border-radius:20px;}
#receipt_wrap h2 {width:100%; height:6vh; margin-bottom:2vh; line-height:6vh; text-align:center; color: white; font-size:1.4em; background:#2249BE; border-radius:10px; box-shadow:0 1vh 5px rgba(0, 0, 0, 0.1);}
#r_tb_1 {width:96%; margin:0 auto; border-collapse:collapse;}
#r_tb_1 th,
#r_tb_1 td {width:50%; height:2.6vh; text-align:left; padding:0 10px; font-size:0.75em; font-family:inherit; font-weight:bold; border-bottom:1px solid #ddd;}
#r_tb_1 th:nth-of-type(odd),
#r_tb_1 td:nth-of-type(odd) {border-right:1px solid #ccc;}
#r_tb_1 th {color:#666; background:#EBEBEB; border-top:1px solid #ccc;}
#r_tb_1 td {color:#222;}
#r_cont1 {}
#r_cont1 h3 {width:90%; padding:4px 0; font-size:0.9em; margin:1vh auto; text-align:center; color:white; border-radius:50px;}
#r_cont1 #r_cont1_1 {float:left; width:50%;}
#r_cont1 #r_cont1_1 h3 {background:#FB76A5;}
#r_cont1 #r_cont1_1 table {width:90%; margin:0 auto 10px auto; border-top:1px solid #ddd; border-collapse:collapse;}
#r_cont1 #r_cont1_1 table th,
#r_cont1 #r_cont1_1 table td {width:26%; padding:3px 6px; font-size:0.7em; border-bottom:1px solid #ddd;}
#r_cont1 #r_cont1_1 table th {background:#FFE1E9;}
#r_cont1 #r_cont1_1 table td {text-align:right; color:#FF2759; font-weight:bold;}
#r_cont1 #r_cont1_1 .r_cancel {display:none; width:75%; margin:0 auto 1vh auto;}
#r_cont1 #r_cont1_2 {float:left; width:50%;}
#r_cont1 #r_cont1_2 h3 {background:#273A98;}
#r_cont1 #r_cont1_2 dl {width:90%; margin:0 auto 1vh auto;}
#r_cont1 #r_cont1_2 dl dt,
#r_cont1 #r_cont1_2 dl dd {padding:3px 6px; line-height:1.2; font-size:0.7em;}
#r_cont1 #r_cont1_2 dl dt {border-bottom:1px solid #ccc; background:#EBEBEB;}
#r_cont1 #r_cont1_2 dl dd {letter-spacing:-0.5px;}
#r_cont2 {width:calc(96% - 12px); padding:5px 6px; margin:0 auto; font-size:0.7em; border-top:1px solid #ddd;}
#r_cont2 p {line-height:1.4;}
#r_cont3 {width:calc(96% - 12px); padding:5px 0; margin:0 auto; text-align:center; font-size:0.7em; border-top:1px solid #ddd;}
#r_cont3 p {line-height:1.4;}
#r_cont3 p.copy {color:#999; letter-spacing:0.5px;}
#receipt_wrap .receipt_close,
#receipt_wrap .receipt_save {
	position:absolute; 
	height:10vw;
	line-height:10vw;
	padding:0 20px;
	margin-bottom:-5vw;
	bottom:0; 
	left:50%; 
	font-weight:bold; 
	font-size:15px; 
	color:white; 
	border:2px solid white; 
	border-radius:10vw;
}
#receipt_wrap .receipt_close {margin-left:-72px; background:#2249BE;}
#receipt_wrap .receipt_save {margin-left:3px; background:#DC4278;}

/*** 매출관리 - 반응형 ***/
@media screen and (max-width:350px) {
#sales #cont1 dl dd p:nth-of-type(1) span {font-size:11px;}
#sales #cont1 dl dd p:nth-of-type(1) b {font-size:12px;}
#sales #cont1 dl dd p.btn {margin-top:-39px;}
#sales #cont1 dl dd p.btn a {padding:2px 8px;}
#receipt_wrap h2 {box-shadow:none; margin-bottom:1vh; font-size:1.2em;}
#r_tb_1 th,
#r_tb_1 td {height:2.4vh; font-size:0.5em;}
#r_cont1 h3 {margin:0.5vh auto; font-size:0.7em;}
#r_cont1 #r_cont1_1 table th,
#r_cont1 #r_cont1_1 table td {font-size:0.5em;}
#r_cont1 #r_cont1_2 dl {margin:0 auto 0.5vh auto;}
#r_cont1 #r_cont1_2 dl dt,
#r_cont1 #r_cont1_2 dl dd {padding:2px 6px; font-size:0.5em;}
#r_cont2 p,
#r_cont3 p {font-size:0.5em; line-height:1.2;}
}

@media screen and (min-width:701px) {
#receipt_wrap {width:600px; left:50%; margin-left:-300px;}
#r_cont1 #r_cont1_1 .r_cancel {width:60%;}
}

/*** 선물하기 ***/
#gift {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#gift #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#gift #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#gift #cont1 h3 {padding:15px 20px; font-size:28px; text-align:center; color:#FF5500; background:rgba(80, 50, 34, 0.1); border-radius:20px;}
#gift #cont1 h3 span {font-size:20px; color:#222;}
#gift #cont1 #src_bar {margin-top:10px;}
#gift #cont1 #src_bar b {float:left; display:inline-block; width:26%; height:30px; line-height:30px; text-align:center; margin-right:1%;}
#gift #cont1 #src_bar input {float:left; width:calc(58.5% - 10px); padding:0 5px; height:30px; border-radius:8px; border:1px solid #ddd;}
#gift #cont1 #src_bar a {float:right; display:inline-block; width:15%; height:30px; line-height:30px; text-align:center; color:white; border-radius:8px; background:#503222;}
#gift #cont1 #result {display:none; width:100%; margin-top:10px; border-collapse:collapse; border-top:2px solid #503222;}
#gift #cont1 #result th,
#gift #cont1 #result td {padding:10px 5px; text-align:center; border-bottom:1px solid #ddd;}
#gift #cont1 #result th {font-weight:bold;}
#gift #cont1 #result td {font-size:13px;}
#gift #cont1 #result td:first-of-type {font-weight:bold; color:#FF5500;}
#gift #cont1 #result td a {display:block; padding:3px 4px; font-size:12px; color:white; background:#503222; border-radius:8px;}
#gift .modal-log p.m-btn a {display:inline-block; width:35%;}
#gift .modal-log p.m-btn a.cancel {background:transparent; color:#503222;}

/***  MY 포인트 ***/
#my_point {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#my_point #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#my_point #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#my_point #cont1 #src_bar {margin-top:10px; text-align:center;}
#my_point #cont1 #src_bar b {display:inline-block; height:30px; line-height:30px; margin-right:1%;}
#my_point #cont1 #src_bar input {display:inline-block; width:calc(38% - 10px); padding:0 5px; border-radius:8px; height:30px; text-align:center; border:1px solid #ddd;}
#my_point #cont1 #src_bar .btn {margin-top:10px; text-align:center;}
#my_point #cont1 #src_bar .btn a {clear:both; display:inline-block; width:45%; height:42px; line-height:42px; text-align:center; font-size:16px; font-family:"NanumSquare"; font-weight:bold; border:1px solid #503222; border-radius:40px; color:white; background:#503222;}
#my_point #cont1 #result {width:100%; margin-top:10px; border-collapse:collapse; border-top:2px solid #503222;}
#my_point #cont1 #result th,
#my_point #cont1 #result td {width:calc(20% - 20px); padding:10px 0; text-align:center; line-height:1.4; border-bottom:1px solid #ddd;}
#my_point #cont1 #result th {font-size:14px; font-weight:bold;}
#my_point #cont1 #result td {font-size:12px; letter-spacing:-0.5px;}
#my_point #cont1 .wrap > .btn {text-align:center;}
#my_point #cont1 .wrap > .btn a {clear:both; display:inline-block; width:45%; height:42px; line-height:42px; text-align:center; font-size:16px; font-family:"NanumSquare"; font-weight:bold; border:1px solid #503222; border-radius:40px;}
#my_point #cont1 .wrap > .btn a:nth-of-type(1) {color:#503222; margin-right:5px;}
#my_point #cont1 .wrap > .btn a:nth-of-type(2) {color:white; background:#503222;}
#my_point #cont2 {position:fixed; display:none; top:10vh; left:0; width:100vw; height:calc(80vh - 80px); padding:40px 0; background:white; border-radius:40px; z-index:999999;}
#my_point #cont2 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#my_point #cont2 dl {}
#my_point #cont2 dd {position:relative;  height:50px; line-height:50px; padding:0 20px; margin-bottom:20px; border-radius:25px; border:1px solid #B8B8B8;}
#my_point #cont2 dd input {height:100%; font-size:16px; background:transparent; border:none; vertical-align:top;}
#my_point #cont2 dd:not(:nth-of-type(2)) input {width:100%;}
#my_point #cont2 dd:nth-of-type(2) input {width:calc(100% - 66px);}
#my_point #cont2 dd a {position:absolute; display:block; height:30px; top:50%; right:10px; margin-top:-15px; line-height:30px; padding:0 12px; font-size:12px; font-weight:bold; color:white; background:#503222; border-radius:15px;}
#my_point #cont2 .btn {margin-top:10px; text-align:center;}
#my_point #cont2 .btn a {clear:both; display:inline-block; width:45%; height:42px; line-height:42px; text-align:center; font-size:16px; font-family:"NanumSquare"; font-weight:bold; border:1px solid #503222; border-radius:40px;}
#my_point #cont2 .btn a:nth-of-type(1) {color:#503222; margin-right:5px;}
#my_point #cont2 .btn a:nth-of-type(2) {color:white; background:#503222;}

#my_point #cont3 {position:fixed; display:none; top:10vh; left:0; width:100vw; height:calc(80vh - 80px); padding:40px 0; background:white; border-radius:40px; z-index:999999;}
#my_point #cont3 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#my_point #cont3 dl {}
#my_point #cont3 dd {position:relative;  height:50px; line-height:50px; padding:0 20px; margin-bottom:20px; border-radius:25px; border:1px solid #B8B8B8;}
#my_point #cont3 dd input {height:100%; font-size:16px; background:transparent; border:none; vertical-align:top;}
#my_point #cont3 dd:not(:nth-of-type(2)) input {width:100%;}
#my_point #cont3 dd:nth-of-type(2) input {width:calc(100% - 66px);}
#my_point #cont3 dd a {position:absolute; display:block; height:30px; top:50%; right:10px; margin-top:-15px; line-height:30px; padding:0 12px; font-size:12px; font-weight:bold; color:white; background:#503222; border-radius:15px;}
#my_point #cont3 .btn {margin-top:10px; text-align:center;}
#my_point #cont3 .btn a {clear:both; display:inline-block; width:45%; height:42px; line-height:42px; text-align:center; font-size:16px; font-family:"NanumSquare"; font-weight:bold; border:1px solid #503222; border-radius:40px;}
#my_point #cont3 .btn a:nth-of-type(1) {color:#503222; margin-right:5px;}
#my_point #cont3 .btn a:nth-of-type(2) {color:white; background:#503222;}

/*** MY 포인트 - 반응형 ***/
@media screen and (max-width:350px) {
#my_point #cont1 #src_bar input {width:35%;}
}

/*** 포인트 선물하기 ***/
#send_point {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#send_point #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#send_point #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#send_point #cont1 h3 {padding:15px 20px; font-size:28px; text-align:center; color:#FF5500; background:rgba(80, 50, 34, 0.1); border-radius:20px;}
#send_point #cont1 h3 span {font-size:20px; color:#222;}
#send_point #cont1 .src_bar {margin-top:10px;}
#send_point #cont1 .src_bar b {float:left; display:inline-block; width:25%; height:30px; line-height:30px; text-align:center; margin-right:1%;}
#send_point #cont1 .src_bar input {float:left; width:calc(58% - 10px); padding:0 5px; height:30px; border:1px solid #ddd; border-radius:8px;}
#send_point #cont1 .src_bar a {float:right; display:inline-block; width:15%; height:30px; line-height:30px; text-align:center; color:white; border-radius:8px; background:#503222;}
#send_point #cont1 #result {display:none; width:100%; margin-top:10px; border-collapse:collapse; border-top:2px solid #503222;}
#send_point #cont1 #result th,
#send_point #cont1 #result td {padding:10px 5px; text-align:center; border-bottom:1px solid #ddd;}
#send_point #cont1 #result th {font-weight:bold;}
#send_point #cont1 #result td {font-size:13px;}
#send_point #cont1 #result td:first-of-type {font-weight:bold; color:#FF5500;}
#send_point #cont1 #result td a {display:block; padding:3px 4px; font-size:12px; color:white; background:#503222; border-radius:8px;}
#send_point #cont1 #result tfoot td {border-bottom:none;}
#send_point #cont1 #result tfoot td a {height:40px; line-height:40px; font-size:16px; border-radius:25px;}
#send_point .modal-log p.m-btn a {display:inline-block; width:35%;}
#send_point .modal-log p.m-btn a.cancel {background:transparent; color:#503222;}

/*** 포인트 정산 ***/
#point_calc {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#point_calc #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#point_calc #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#point_calc #cont1 h3 {padding:15px 20px; margin-bottom:20px; font-size:28px; text-align:center; color:#FF5500; background:rgba(80, 50, 34, 0.1); border-radius:20px;}
#point_calc #cont1 h3 span {font-size:20px; color:#222;}
#point_calc #cont1 .src_bar {margin-top:10px;}
#point_calc #cont1 .src_bar b {float:left; display:inline-block; width:25%; height:50px; line-height:50px; text-align:center; margin-right:1%;}
#point_calc #cont1 .src_bar input,
#point_calc #cont1 .src_bar select {float:right; width:calc(74% - 20px); padding:0 10px; height:50px; border:1px solid #ddd; border-radius:25px; font-size:16px;}
#point_calc #cont1 .for-width {float:right; width:calc(74% - 20px); overflow:hidden;}
#point_calc #cont1 .src_bar #point {float:left; width:78%; text-align:right;}
#point_calc #cont1 .src_bar .btn_mini {float:right; width:20%;}
#point_calc #cont1 .src_bar .btn_mini a {display:block; width:100%; height:24px; line-height:24px; text-align:center; font-size:11px; color:white; background:#503222; border-radius:20px;}
#point_calc #cont1 .src_bar .btn_mini a:not(:last-of-type) {margin-bottom:2px;}
#point_calc #cont1 .btn {text-align:center;}
#point_calc #cont1 .btn a {clear:both; display:inline-block; width:45%; height:42px; line-height:42px; text-align:center; font-size:16px; font-family:"NanumSquare"; font-weight:bold; border:1px solid #503222; border-radius:40px;}
#point_calc #cont1 .btn a:nth-of-type(1) {color:#503222; margin-right:5px;}
#point_calc #cont1 .btn a:nth-of-type(2) {color:white; background:#503222;}
#point_calc #modal-log-2 span {font-weight:bold;}
#point_calc .modal-log p.m-btn a {display:inline-block; width:35%;}
#point_calc .modal-log p.m-btn a.cancel {background:transparent; color:#503222;}

/***  매출현황 ***/
#sales_calc {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#sales_calc #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#sales_calc #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#sales_calc #cont1 #src_bar {margin-top:10px; text-align:center;}
#sales_calc #cont1 #src_bar b {display:inline-block; height:30px; line-height:30px; margin-right:1%;}
#sales_calc #cont1 #src_bar input {display:inline-block; width:calc(34% - 10px); padding:0 5px; border-radius:8px; height:30px; text-align:center; border:1px solid #ddd;}
#sales_calc #cont1 #result {display:none; width:100%; margin-top:10px; border-collapse:collapse; border-top:2px solid #503222;}
#sales_calc #cont1 #result th,
#sales_calc #cont1 #result td {width:calc(20% - 20px); padding:10px 0; text-align:center; line-height:1.4; border-bottom:1px solid #ddd;}
#sales_calc #cont1 #result th:nth-of-type(1),
#sales_calc #cont1 #result td:nth-of-type(1) {width:28%;}
#sales_calc #cont1 #result th:nth-of-type(2),
#sales_calc #cont1 #result td:nth-of-type(2) {}
#sales_calc #cont1 #result th:nth-of-type(3),
#sales_calc #cont1 #result td:nth-of-type(3) {width:20%;}
#sales_calc #cont1 #result th {font-size:14px; font-weight:bold;}
#sales_calc #cont1 #result td {font-size:12px; letter-spacing:-0.5px;}
#sales_calc #cont1 #result td a {display:block; padding:5px 0; background:#503222; color:white; border-radius:8px;}
#sales_calc #cont2 {position:fixed; display:none; top:10vh; left:0; width:100vw; height:calc(80vh - 80px); padding:40px 0; background:white; border-radius:40px; z-index:999999;}
#sales_calc #cont2 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#sales_calc #cont2 table {width:100%; margin-bottom:15px; border-collapse:collapse; border-top:2px solid #503222;}
#sales_calc #cont2 table th,
#sales_calc #cont2 table td {padding:10px 5px; text-align:center; border-bottom:1px solid #ddd;}
#sales_calc #cont2 table th {font-size:14px; font-weight:bold;}
#sales_calc #cont2 table td {font-size:12px; letter-spacing:-0.5px;}
#sales_calc .btn {margin-top:10px; text-align:center;}
#sales_calc .btn a {clear:both; display:inline-block; width:45%; height:42px; line-height:42px; text-align:center; font-size:16px; font-family:"NanumSquare"; font-weight:bold; border:1px solid #503222; border-radius:40px; color:white; background:#503222;}

/***  판매현황 ***/
#sell_calc {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#sell_calc #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#sell_calc #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#sell_calc #cont1 #src_bar {width:100%; margin-top:-2px; text-align:center;}
#sell_calc #cont1 #src_bar th,
#sell_calc #cont1 #src_bar td {padding:2px 5px; text-align:center;}
#sell_calc #cont1 #src_bar th {font-weight:bold;}
#sell_calc #cont1 #src_bar td {}
#sell_calc #cont1 #src_bar td input {display:inline-block; width:100%; padding:0 5px; border-radius:8px; height:30px; text-align:center; border:1px solid #ddd;}
#sell_calc #cont1 #src_bar td input#i_store {float:left; width:84%; text-align:left;}
#sell_calc #cont1 #src_bar td a {float:right; display:block; height:30px;}
#sell_calc #cont1 #src_bar td a img {height:100%;}
#sell_calc #cont1 #result {display:none; width:100%; margin-top:10px; border-collapse:collapse; border-top:2px solid #503222;}
#sell_calc #cont1 #result th,
#sell_calc #cont1 #result td {width:calc(20% - 20px); padding:10px 0; text-align:center; line-height:1.4; border-bottom:1px solid #ddd;}
#sell_calc #cont1 #result th {font-size:14px; font-weight:bold;}
#sell_calc #cont1 #result td {font-size:12px; letter-spacing:-0.5px;}
#sell_calc #cont1 #result td:nth-of-type(4) {width:18%; padding:2px 0;}
#sell_calc #cont1 #result td a {display:block; padding:6px 0; font-size:12px; color:white; background:#503222; border-radius:8px;}

/*** 공지사항 ***/
#notice {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#notice #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#notice #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#notice #cont1 #src_bar {margin-top:10px; text-align:center;}
#notice #cont1 #src_bar b {display:inline-block; height:30px; line-height:30px; margin-right:1%;}
#notice #cont1 #src_bar input {display:inline-block; width:calc(34% - 10px); padding:0 5px; border-radius:8px; height:30px; text-align:center; border:1px solid #ddd;}
#notice #cont1 #result {display:none; width:100%; margin-top:10px; border-collapse:collapse; border-top:2px solid #503222;}
#notice #cont1 #result th,
#notice #cont1 #result td {padding:10px 6px; text-align:center; line-height:1.4; border-bottom:1px solid #ddd;}
#notice #cont1 #result th:nth-of-type(1),
#notice #cont1 #result td:nth-of-type(1) {width:28%;}
#notice #cont1 #result th:nth-of-type(2),
#notice #cont1 #result td:nth-of-type(2) {}
#notice #cont1 #result th:nth-of-type(3),
#notice #cont1 #result td:nth-of-type(3) {width:20%;}
#notice #cont1 #result th {font-size:14px; font-weight:bold;}
#notice #cont1 #result td {font-size:12px; letter-spacing:-0.5px;}
#notice #cont1 #result td a {display:block; padding:5px 0; background:#503222; color:white; border-radius:8px;}
#notice #cont2 {position:fixed; display:none; top:10vh; left:0; width:100vw; height:calc(80vh - 80px); padding:40px 0; background:white; border-radius:40px; z-index:999999;}
#notice #cont2 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#notice #cont2 table {width:100%; margin-bottom:15px; border-collapse:collapse; border-top:2px solid #503222;}
#notice #cont2 table th,
#notice #cont2 table td {padding:10px; border-bottom:1px solid #ddd;}
#notice #cont2 table th {font-size:14px; font-weight:bold;}
#notice #cont2 table td {font-size:12px; letter-spacing:-0.5px; white-space:pre-wrap;}#notice .btn {margin-top:10px; text-align:center;}
#notice .btn a {clear:both; display:inline-block; width:45%; height:42px; line-height:42px; text-align:center; font-size:16px; font-family:"NanumSquare"; font-weight:bold; border:1px solid #503222; border-radius:40px; color:white; background:#503222;}

/*** 마일리지 관리 ***/
#mileage {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#mileage #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#mileage #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#mileage #cont1 dl {}
#mileage #cont1 dl dd {position:relative; padding:20px 0 20px 0; border-bottom:1px solid #ddd;}
#mileage #cont1 dl dd.null {padding:0; text-align:center; font-size:16px; color:#aaa; border-bottom:none;}
#mileage #cont1 dl dd p:nth-of-type(1) {top:0; left:0;}
#mileage #cont1 dl dd p:nth-of-type(1) b {display:inline-block;}
#mileage #cont1 dl dd p:nth-of-type(1) span {font-size:12px; color:#777;}
#mileage #cont1 dl dd p:nth-of-type(2) {margin-top:5px; font-size:18px;}
#mileage #cont1 dl dd p:nth-of-type(2) strong {font-size:25px; color:#FF5500;}
#mileage #cont1 dl dd p.btn {position:absolute; top:50%; right:0; margin-top:-42px;}
#mileage #cont1 dl dd p.btn a {display:block; padding:3px 10px; text-align:center; font-size:13px; border:1px solid #503222; border-radius:5px;}
#mileage #cont1 dl dd p.btn a:not(:last-of-type) {margin-bottom:8px;}
#mileage #cont1 dl dd p.btn a.modal {color:white; background:#503222;}
#mileage #cont1 dl dd p.btn a:not(.modal) {color:#503222; background:white;}
#mileage .modal-log p.m-btn a {display:inline-block; width:35%;}
#mileage .modal-log p.m-btn a.cancel {background:transparent; color:#503222;}

/*** 가맹점 사용 동의 및 확약서 ***/
#agreement {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#agreement #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#agreement #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#agreement #cont1 #sw_wrap {}
#agreement #cont1 .verify-p {float:left; position:relative; width:50%; height:50px; line-height:50px; padding:0 20px; margin-bottom:20px; border-radius:25px; border:1px solid #B8B8B8;}
#agreement #cont1 .verify-p input {width:calc(100% - 80px); height:100%; font-size:16px; background:transparent; border:none; vertical-align:top;}
#agreement #cont1 .verify-p a {position:absolute; display:block; height:30px; top:50%; right:10px; margin-top:-15px; line-height:30px; padding:0 12px; font-size:12px; font-weight:bold; color:white; background:#503222; border-radius:15px;}
#agreement #cont1 #sw_wrap .open-modal {float:right;}
#agreement #cont1 #sw_wrap .open-modal img {margin-top:6px; height:40px;}
#agreement #cont1 #signature-pad {}
#agreement #cont1 #signature-pad canvas {display:block; width:100%; height:150px; margin:5px 0; background:#EDEAE8 !important; border:1px solid #B8B8B8;}
#agreement #cont1 #signature-pad button {border:none; padding:5px 10px; color:white; font-size:13px; border-radius:25px; background:#503222;}
#agreement #cont1 .agreement {text-align:center;}
#agreement #cont1 .agreement label {font-weight:bold;}
#agreement #cont1 .agreement label:not(:last-of-type) {margin-right:5%;}
#agreement #cont1 .agreement input {display:none;}
#agreement #cont1 .agreement input ~ span {display:inline-block; vertical-align:top; width:20px; height:20px; background:url("../img/ico-radio.png") no-repeat left center;}
#agreement #cont1 .agreement input:checked ~ span {background-position:right center;}
#agreement #cont1 .btn {}
#agreement #cont1 .btn a {display:block; width:60%; height:48px; line-height:48px; margin:0 auto; font-weight:bold; font-size:16px; text-align:center; color:white; background:#503222; border-radius:24px;}
#agreement #cont2 {position:fixed; display:none; top:10vh; left:0; width:calc(100vw - 20px); height:calc(80vh - 80px); padding:40px 10px; background:white; border-radius:40px; z-index:999999; overflow-y:auto;}
#agreement #cont2 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#agreement #cont2 h3 {font-size:14px;}
#agreement #cont2 #terms {}
#agreement #cont2 #terms ol {padding-left:18px;}
#agreement #cont2 #terms ol > li {list-style-type:decimal; list-style-position:outside;}
#agreement #cont2 #terms ol > li:not(:last-of-type) {margin-bottom:10px;}
#agreement #cont2 #terms ul {margin-top:10px;}
#agreement #cont2 #terms ul li:not(:last-of-type) {margin-bottom:10px;}
#agreement #cont2 label {display:block; text-align:center;}
#agreement #cont2 label input[type="checkbox"] {display:none;}
#agreement #cont2 label input[type="checkbox"] ~ span {display:inline-block; vertical-align:top; width:20px; height:20px; margin-right:4px; background-image:url("../img/login-chk-off.png"); background-repeat:no-repeat; background-position:center center; background-size:100%;}
#agreement #cont2 label input[type="checkbox"]:checked ~ span {background-image:url("../img/login-chk-on.png");}
#agreement #cont2 .btn {}
#agreement #cont2 .btn a {display:block; width:60%; height:48px; line-height:48px; margin:0 auto; font-weight:bold; font-size:16px; text-align:center; color:white; background:#503222; border-radius:24px;}

/*** 영수증 ***/
#receipt {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#receipt #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#receipt #cont1 .welcomePayments {display:block; width:42%; margin:0 auto 2px auto;}
#receipt #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#receipt #cont1 h3 {}
#receipt #cont1 .rec {width:100%;margin-top:5px; border-collapse:collapse; border-top:2px solid #aaa;}
#receipt #cont1 .rec th,
#receipt #cont1 .rec td {padding:6px 8px; line-height:1.4; border-bottom:1px dotted #ddd;}
#receipt #cont1 .rec th {width:26%; font-weight:bold;}
#receipt #cont1 .rec th span {font-weight:normal; font-size:10px; letter-spacing:-1px;}
#receipt #cont1 .rec td {font-size:13px;}
#receipt #cont1 .comment {font-size:11px;}
#receipt #cont1 .cancel {position:fixed; width:80vw; height:20vh; top:50%; left:50%; margin:-10vh 0 0 -42.5vw; line-height:20vh; text-align:center; color:red; font-size:72px; font-weight:bold; font-family:"NanumSquare", sans-serif; border-radius:40px; border:8px solid red; background:rgba(255, 255, 255, 0.8); transform:rotate(350deg); z-index:999999;}
#receipt #cont1 .btn {}
#receipt #cont1 .btn a {display:block; width:60%; height:48px; line-height:48px; margin:0 auto; font-weight:bold; font-size:16px; text-align:center; color:white; background:#503222; border-radius:24px;}

/*** 문자결제 ***/
#text_purchase {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#text_purchase #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#text_purchase #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#text_purchase #cont1 dt {margin-bottom:2px; padding-left:13px; font-size:14px; font-weight:bold;}
#text_purchase #cont1 dd {position:relative;  height:50px; line-height:50px; padding:0 20px; margin-bottom:5px; border-radius:25px; border:1px solid #B8B8B8;}
#text_purchase #cont1 dd input {width:100%; height:100%; font-size:16px; background:transparent; border:none; vertical-align:top;}
#text_purchase #cont1 .btn {}
#text_purchase #cont1 .btn a {display:block; width:60%; height:48px; line-height:48px; margin:0 auto; font-weight:bold; font-size:16px; text-align:center; color:white; background:#503222; border-radius:24px;}

/*** MY 카드 1 ***/
#my_card_1 {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#my_card_1 #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px; overflow-x:hidden;}
#my_card_1 #cont1 h2 {margin-bottom:30px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#my_card_1 #cont1 .card_list {}
#my_card_1 #cont1 .card_list li {position:relative; margin-bottom:10px;}
#my_card_1 #cont1 .card_list li img.bg {width:90vw; height:auto;}
#my_card_1 #cont1 .card_list li img.btn {position:absolute; width:10vw; left:55%; bottom:10px;}
#my_card_1 #cont1 .card_list li div {position:absolute; width:100%; height:100%; top:0; left:0;}
#my_card_1 #cont1 .card_list li div p {position:absolute; color:white; font-family:"NanumSquare"; font-weight:bold; text-shadow:1px 1px 5px rgba(0, 0, 0, 1);}
#my_card_1 #cont1 .card_list li div p:nth-of-type(1) {top:6%; right:6%; font-size:26px; text-align:center;}
#my_card_1 #cont1 .card_list li div p:nth-of-type(2) {left:8%; bottom:25% ;font-size:23px;}
#my_card_1 #cont1 .card_numb {}
#my_card_1 #cont1 .card_numb li {display:inline-block; margin-right:4px;}
#my_card_1 #cont1 .card_numb li a {display:block; width:14px; height:14px; border-radius:7px; background:rgba(0, 0, 0, 0.3); text-indent:-9999px; overflow:hidden;}
#my_card_1 #cont1 .card_numb li a.on {background:rgba(0, 0, 0, 0.6);}

/*** 공통 - 반응형 ***/
@media screen and (max-width:350px) {
#my_card_1 #cont1 .card_list li div p:nth-of-type(2) {font-size:20px;}
}

/*** MY 카드 2 ***/
#my_card_2 {min-height:calc(100vh - 92px); padding:92px 0 70px 0; overflow-y:auto; background:#428bca;}
#my_card_2 #cont1 {min-height:60vh; padding:40px 0; background:white; border-radius:40px;}
#my_card_2 #cont1 h2 {margin-bottom:10px; font-weight:bold; color:#878787; letter-spacing:-0.5px;}
#my_card_2 #cont1 #card_info {width:calc(100% - 60px); padding:15px 30px; margin:0 auto; background:#eee; border-radius:20px;}
#my_card_2 #cont1 #card_info p {}
#my_card_2 #cont1 #card_info p:not(:last-of-type) {margin-bottom:5px;}
#my_card_2 #cont1 #card_info p b {display:inline-block; width:25%;}
#my_card_2 #cont1 #src_bar {margin-top:10px; text-align:center;}
#my_card_2 #cont1 #src_bar b {display:inline-block; height:30px; line-height:30px; margin-right:1%;}
#my_card_2 #cont1 #src_bar input {display:inline-block; width:calc(34% - 10px); padding:0 5px; border-radius:8px; height:30px; text-align:center; border:1px solid #ddd;}
#my_card_2 #cont1 #result {width:100%; margin-top:10px; border-collapse:collapse; border-top:2px solid #503222;}
#my_card_2 #cont1 #result th,
#my_card_2 #cont1 #result td {width:25%; padding:10px 0; text-align:center; line-height:1.4; border-bottom:1px solid #ddd;}
#my_card_2 #cont1 #result th {font-size:14px; font-weight:bold;}
#my_card_2 #cont1 #result td {font-size:12px; letter-spacing:-0.5px;}
#my_card_2 #cont1 #result tfoot td {border-bottom:none;}
#my_card_2 .btn {margin-top:10px; text-align:center;}
#my_card_2 .btn a {clear:both; display:inline-block; width:40vw; height:42px; line-height:42px; text-align:center; font-size:16px; font-family:"NanumSquare"; font-weight:bold; border:1px solid #503222; border-radius:40px; color:white; background:#503222;}


/*** 업데이트 ***/
#update {position:relative; width:100vw; height:100%; background:#428bca;}
#update img {position:absolute; width:60vw; top:20%; left:20vw;}
#update .group {position:absolute; width:64vw; left:18vw; bottom:30%; text-align:center;}
#update .group p:not(.copy) {color:#503222; font-family:"NanumSquare"; font-weight:bold; margin-bottom:5px;}
#update .group a { display:block; width:64vw; height:50px; line-height:50px; color:white; font-family:"NanumSquare"; font-size:18px; border:3px solid white; border-radius:28px; background:#503222;}
#update .copy {position:absolute; width:100vw; bottom:3%; text-align:center; font-size:11px; font-family:"Arial", sans-serif; color:black; letter-spacing:-0.5px;}