@charset "utf-8";
/* CSS Document */

/* 군산 store*/
/* 리셋 */
html {
	height: 100vh;
	font-size: 20px;
	-webkit-text-size-adjust: none;
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: none;
	text-size-adjust: none;
	font-family: 'Noto Sans KR', sans-serif;
}
*, :before, :after {box-sizing: border-box;}
body {position: relative; padding: 0; margin: 0; overflow-x: hidden; overflow-y: scroll; background: #fff; color: #000;
font-family: 'Noto Sans KR', sans-serif; word-break: keep-all;}
.a11y {position: absolute; width: 1px; height: 1px; opacity: 0; font-size: 1px; overflow: hidden;}
body {height: 100vh; letter-spacing: -0.5px;}
.line {border-bottom: 1px solid #dcdcdc;}
.heavy {border-bottom: 6px solid #ECEFF1;}

select {
	padding: 0 12px;
	height: 40px;
-moz-appearance:none; /* Firefox */
-webkit-appearance:none; /* Safari and Chrome */
appearance:none;
}

/*헤더*/
header {
	position: fixed;
	top: 0;
	display: block;
	width: 100%;
	height: 56px;
	text-align: center;
	background: #fff;
	color: #424450;
	z-index: 22;
	border-bottom: 1px solid #dededf;
	background: #fff;
}
#header02 {
	background: #3C3E48;
}
header span {
	font-size: 16px;
	font-weight: 500;
	color: #424450;
}
#header02 span {
	color: #fff;
	font-size: 16px;
	font-weight: 500
}
header .cancel_btn {position: absolute; top: 0; left: 0; font-size: 0; padding: 0 8px; height: 50px; line-height: 50px;}
header .cancel_btn a {display: inline-block; width: 19px; height: 19px;}
header .cancel_btn a img {display: block; width: 14px; height: 14px;}
header .cancel_btn {float: left; font-size: 0; padding: 0 8px; height: 50px; line-height: 50px;}
header .cancel_btn a {display: inline-block;  background: url("../../images/storeApp/cancel.png") no-repeat 0 0 / 14px auto; width: 14px; height: 14px;}

header .menu__btn {
	position: absolute;
	top: 50%;
	left: 16px;
	width: 24px;
	height: 24px;
	font-size: 0;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
}
header .menu__btn a {
	display: block;
	width: 24px;
	height: 24px;
	background: url("../../images/storeApp/ico_menu.png") no-repeat 0 0 / 24px auto;
}

header .signOut {
	position: absolute;
	top: 50%;
	right: 16px;
	width: 24px;
	height: 24px;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
}
header .signOut img {
	display: block;
	width: 100%;
	height: 100%;
}
/* .signOut{float:right; right:16px; font-size:0;}
.signOut:after {content:''; display:block; clear:both;} */

header .return__btn {
	position: absolute;
	top: 50%;
	left: 16px;
	height: 24px;
	font-size: 0;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
}
#header02 .return__btn a {
	display: block;
	width: 24px;
	height: 24px;
	background: url("../../images/userApp/ico_return_w.png") no-repeat 0 0 / 24px auto;
}
header .return__btn a {
	display: block;
	width: 24px;
	height: 24px;
	background: url("../../images/storeApp/ico_return.png") no-repeat 0 0 / 24px auto;
}
header .save_btn {
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
}
header .save_btn input[id="d_save"] {display: none;}
header .save_btn label {
	font-size: 14px;
	color: #4775EF;
}
header .title h1 {
	display: inline-block;
	margin: 0;
	width: 52px;
	height: 47px;
	line-height: 47px;
	vertical-align: middle;
	background: url("../../images/storeApp/main_logo.png") no-repeat 0 14px / 52px auto;
}
header .title img {height: 30px; vertical-align: middle;}
header .title {line-height: 56px;}
header .title h1 {display: inline-block; margin: 0; background: url("../../images/storeApp/main_logo.png") no-repeat 0 14px / 52px auto; width: 52px; height: 47px; line-height: 47px; vertical-align: middle;}
header .title a img {width: 7px; height: 5px; vertical-align: middle;}
header .title h1 {
	display: inline-block;
	margin: 0;
	background: url("../../images/storeApp/main_logo.png") no-repeat 0 14px / 52px auto;
	width: 52px;
	height: 47px;
	line-height: 47px;
	vertical-align: middle;
	color: var(--sub-color);
}

header .logo {position: absolute; top: 0; left: 50%; transform: translateX(-50%);}
header .logo h1 {display: inline-block; margin: 0; background: url("../../images/storeApp/main_logo.png") no-repeat 0 14px / 52px auto; width: 52px; height: 47px; line-height: 47px; vertical-align: middle;}
header .logo a img {margin-left: 6px; width: 7px; height: 5px; vertical-align: middle;}

header .t_btn {position: absolute; right: 0; padding: 0 8px; font-size: 0; float: right; line-height: 50px;}
header .t_btn a {position: relative; padding: 0; line-height: 50px; vertical-align: middle;}
header .t_btn a img { width:auto; height: 14px;}
header .count {position: absolute; top: 10px; right: 8px; width: 12px; height: 12px; line-height: 10px; background: #F81115;
 border-radius: 50%; }
header .count span {font-size: 10px; color: #fff; line-height: 50%; transform: translateY(-50%); text-align: center;}

header .shopbsk {display: inline-block; padding: 0 7px; width: 22px; height: 14px; font-size: 0; color:#fff; line-height: 50px;
text-align: center; background: url("../../images/storeApp/header_basket.png") no-repeat 0 0 / 22px auto;}
header .shopbsk {display: inline-block; padding: 0 7px; width: 22px; height: 22px; font-size: 0; color:#fff; line-height: 50px;
 text-align: center;}
header .shopbsk {display: inline-block; padding: 0 7px; width: 22px; height: 22px; font-size: 0; color:#fff; line-height: 50px;
 text-align: center;}

header .search {display: inline-block; margin-left: 4px; width: 22px; height: 22px; font-size: 0;
background: url("../../images/storeApp/search.png") no-repeat 0 0 / 22px auto;}

header .success_btn {position: absolute; top: 0; right: 0; font-size: 0; height: 50px; line-height: 50px;}
header .success_btn a{line-height: 41px;vertical-align: middle;}
header .success {display: inline-block; padding: 0 7px; font-size: 12px; color:#333; line-height: 22px; text-align: center;}

/*네비*/
header nav {padding: 0 10px; position: relative; top: 0; width: 100%; height: 37px; border-bottom: 1px solid #e2e2e2;
border-top: 1px solid #e2e2e2; background: #fff; font-size: 0; line-height: 0; white-space: nowrap; overflow: auto;
 -webkit-overflow-scrolling: touch; box-sizing: content-box;}
header nav ul{padding: 0; margin: 0; text-align: justify; text-align-last: justify;}
header nav li {display: inline-block; padding: 0 7px;}
header nav .on a {position: relative; color: #000; font-weight: bold;}
header nav .on a:after {content: ''; position: absolute; left: 0; bottom: -1px; width: 100%; height: 2px; background:#000;}
header nav li a {display: block; height: 35px; line-height: 35px; color: #797979; font-size: 13.5px; }

main {
	padding-top: 56px;
	width: 100%;
	box-sizing: border-box;
}
.custmain {height: calc(100vh - 90px);}
main .selc_wrap {
	padding: 0 16px;
	height: 50px;
	line-height: 50px;
	background: #424450;
}
main .selc_wrap h4 {
	font-size: 14px;
	font-weight: 400;
	color: #fff;
}
main > div {
	position: relative;
}
/* main > div:nth-of-type(1) h4 {
	font-size: 14px;
	font-weight: 400;
	color: #fff;
	background: #424450;
	height: 46px; width: 100%; line-height: 46px;
	padding: 0 16px;
} */
main > div.sub-title02 h4 {
	font-size: 14px;
	font-weight: 500;
	color: #fff;
	background: #b3b3b3;
	width: 100%;
	height: 50px;
	line-height: 50px;
	padding: 0 16px;
}

/*하단정보 footer*/
footer {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 26px 0;
	text-align: center;
	background: #EDEEF2;
	overflow: hidden;
	line-height: 1.4;
}
footer > ul {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}
footer > ul li:not(:first-of-type) {
	margin-left: 12px;
}
footer > ul li:not(:first-of-type)::before {
	content: '';
	display: inline-block;
	margin-right: 10px;
	width: 1px;
	height: 10px;
	background: #757575;
	vertical-align: middle;
}
footer > ul li a {font-size: 12px;}
footer .rept_tel {margin-top: 4px; font-size: 12px;}


/* 햄버거메뉴 */
.lnb {
	position: fixed;
	top:0;
	left: -85%;
	width: 85%;
	height: 100%;
	background: #fff;
	z-index: 999;
	overflow-y: auto;
}
.buis_wrap {height: 100%; position: relative}
.buis_wrap .buis_top {
	position: relative;
	padding: 0 16px;
	background: #424450;
}
.buis_wrap .buis_top .cancel_btn {
	position: relative;
	height: 56px;
	line-height: 56px;
}
.buis_wrap .buis_top .cancel_btn a {
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
}
.buis_wrap .buis_top .cancel_btn a img {
	width: 24px;
	height: 24px;
}
.buis_wrap .buis_top .buis_title{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 28px 0 22px;
}

.lnb section.buis_wrap .buis_top .buis_title .setting_wrap {
	position: relative;
}
.lnb section.buis_wrap .buis_top .buis_title .setting_wrap .sett_con {
	position: relative;
}
.lnb .setting_wrap .sett_con input[name="runstopYn"] {
	display: none;
	position: absolute; top: 50%; right: 16px;
	transform: translateY(-50%);
}
.lnb .setting_wrap .sett_con input[name="runstopYn"] + label {
	position: relative;
	display: inline-block;
	padding-left: 2px;
	width: 89px;
	height: 30px;
	background: #5ad528;
	border-radius: 30px;
	overflow: hidden;
	transition: all .6s;
	-webkit-transition: all .6s;
	-moz-transition: all .6s;
	-ms-transition: all .6s;
	-o-transition: all .6s;
}
.lnb .setting_wrap .sett_con input[name="runstopYn"] + label:before {
	content: '';
	position: absolute;
	top: 50%;
	width: 26px;
	height: 26px;
	background: #fff;
	line-height: 20px;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	-ms-border-radius: 20px;
	-o-border-radius: 20px;
	transition: all .1s;
	-webkit-transition: all .1s;
	-moz-transition: all .1s;
	-ms-transition: all .1s;
	-o-transition: all .1s;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	z-index:20;
}
.lnb .setting_wrap .sett_con input[name="runstopYn"]:checked + label { background: #757575;}
.lnb .setting_wrap .sett_con input[name="runstopYn"]:checked + label:before {right: 2px;}

.runStop_wrap {
	font-size: 12px;
}
.runStop_wrap > div a {
	transition: all .001s;
	font-size: 13px;
	color: #fff;
}
.runStop_wrap div.pause_con a {
	top: 50%;
	left: 16px;
}
.runStop_wrap div.open_con a {
	top: 50%;
	right: 18px;
}
.runStop_wrap a {
	position: absolute;
	transform: translateY(-50%);
	color: #fff;
}
.runStop_wrap img {display: none;}

.pause_time {margin-bottom: 30px;}
.pause_time ul {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.pause_time ul li:not(:nth-of-type(4n)) {margin-right: 10px;}
/* .pause_time ul li:nth-of-type(n+1):nth-of-type(-n+4) {margin-bottom: 10px;} */
.pause_time ul.p_time {margin-bottom: 10px;}
.pause_time .p_all {width: 100%; margin-bottom: 10px;}
.pause_time .p_all li {
	width: 100%;
	margin-right: 0!important
}
.pause_time ul li {
	width: 25%;
	height: 34px;
	text-align: center;
}
.pause_time ul li input[id*="pTime"] {display: none;}
.pause_time ul li input[id*="pTime"] + label {
	display: block;
	height: 34px;
	line-height: 34px;
	font-size: 14px;
	font-weight: 400;
	background: #fff;
	border: 1px solid #707070;
}
.pause_time ul li input[id*="pTime"]:checked + label {
	background: #658DF9;
	border: 1px solid #658DF9;
	color: #fff;
	font-weight: 500;
}

#lnb-bg {
	position: fixed;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100vh;
	background-color: rgba(0,0,0,.7);
	z-index: 500;

}


.lnb .shop_btn {
	display: flex;
	padding-bottom: 24px;
}
.lnb .shop_btn a:first-of-type {margin-right: 8px;}
.lnb .shop_btn a {
	display: block;
	width: 50%;
	text-align: center;
	height: 38px;
	line-height: 38px;
	border: 1px solid #fff;
	box-sizing: content-box;
}
.lnb .shop_btn a span {
	font-weight: 400;
	font-size: 14px;
	color: #fff;
}

.lnb .buis_con {}
.lnb .buis_con ul {}
.lnb .buis_con ul li {
	padding: 16px;
	border-bottom: 1px solid #ededef;
}
.lnb .buis_con ul li::before {
	content: '';
	display: inline-block;
	margin-right: 4px;
	width: 24px;
	height: 24px;
	background: url(../../../images/storeApp/lnb_list_24.png)no-repeat center/24px auto;
	vertical-align: middle;
}
.lnb .buis_con ul li span {
	font-size: 14px;
	font-weight: 500;
	color: #424450;
}
.lnb .buis_con .lnb-list span {
	position: relative;
	display: inline-block;
	vertical-align: middle;
}
.lnb .buis_con .lnb-list span:before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	display: block;
	width: 24px;
	height: 24px;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
}
.lnb-bottom {text-align: center;}
.lnb-bottom span:first-of-type {margin-right: 8px;}
.lnb-bottom .btnLogout::before {
	content: '';
	display: inline-block;
	margin-right: 8px;
	height: 12px;
	width: 1px;
	background: #777;
}
.lnb-bottom span {font-size: 14px; color: #999;}
 .lnb-bottom { padding: 42px 0 32px;}

.buis_item em.new {
	display: inline-block;
	margin-left: 4px;
	width: 12px;
	height: 12px;
	background: url(../../images/userApp/common/chat_new-12.png)no-repeat center/12px auto;
}
.repop_inner h4{
	height: 48px;
	line-height: 48px;
	background: #424242;
	color: #fff;
	font-size: 14px;
	font-weight: 500;
	text-align: center;
	border-top-left-radius: 8px;
	-webkit-border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	-webkit-border-top-right-radius: 8px;
}
.repop_con {
	padding: 4px 14px 28px;
	background: #fff;
	border-bottom-left-radius: 8px;
	-webkit-border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	-webkit-border-bottom-right-radius: 8px;
}
.repop_con > div {margin-top: 24px;}
.repop_con > div span {
	display: block;
	margin-bottom: 8px;
	font-size: 13px;
	font-weight: 400;
	color: #212121;
}
.date_select {}
.date_select input[id="reseDt"] {
	white-space: nowrap;
}
.date_select input {
	padding: 14px;
	border: 1px solid #424450;
	background: #FEF1EB;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	overflow: hidden;
}
.time_chk > div{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}
input[name="timeChk"]{display: none;}
.time_chk > div:not(:last-of-type) input[name="timeChk"] + label {margin-bottom: 10px;}
input[name="timeChk"][disabled] + label {color: #b5b5b5;}
input[name="timeChk"] + label {
	display: block;
	width: 33.33%;
	height: 30px;
	margin-bottom: 10px;
	line-height: 30px;
	font-size: 14px;
	color: #212121;
	text-align: center;
}
input[name="timeChk"]:checked + label {
	color: #fff;
	background: #FF8E5E;
	border-radius: 3rem;
	-webkit-border-radius: 3rem;
}
.repop_btns {
	display:flex;
}
.repop_btns button {
	width: 50%;
	font-size: 14px;
	height: 40px;
	border-radius: 4px;
	-webkit-border-radius: 4px;
}
.repop_btns .cancel_btn {
	margin-right: 12px;
	background: transparent;
	border: 1px solid #FF8E5E;
	color: #FF8E5E;
}
.repop_btns .confirm_btn {
	background: #FF8E5E;
	color: #fff;
}

/* 원데이 예약팝업 */
.oneday_pop,
.reserve_pop {
	display: none;
	width: 100%;
	position: fixed;
	top: 0;
	background: rgba(0,0,0,.5);
	z-index: 300;
}
.repop_inner {
	padding: 0 16px;
	position: fixed;
	top: 50%;
	width: 100%;
	height: auto!important;
	z-index: 200;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}
.datetime_select li {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	padding: 16px 0;
	color: #212121;
	font-size: 14px;
	border-bottom: 1px solid #eee;
}
.datetime_select .list_disable span{
	opacity: 0.3;
}
.datetime_select span {
	display: block;
}
.date_sel {
	font-weight: bold;
}
.time_sel {
	text-align: center;
	flex: 2 0 0;
}
.sel_state {
	font-size: 12px;
	color: #fff;
	padding: 3px 6px;
	background: #000;
	border-radius: 2px;
}
.active_sel {
	background: #FF8E5E;
}
.active_sel::after {
	content: '가능'
}
.disable_sel {}
.list_disable .sel_state::after {
	content: '불가'
}

/* 아이폰5 */
@media only screen 
    and (min-device-width: 320px) 
    and (max-device-width: 350px) 
    and (-webkit-min-device-pixel-ratio: 2) 
    and (orientation: portrait) {
		footer {
			padding: 26px 0;
		}
    }
    /* 갤럭시s5 */
/* @media screen 
and (min-device-width: 360px) 
and (min-device-height: 640px) 
and (-webkit-device-pixel-ratio: 3) {
	.lnb-bottom {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 34px; 
	}
	footer {
			padding: 26px 0;
		}
} */
/* @media only screen 
    and (min-device-width: 375px) 
    and (min-device-height: 667px) 
    and (-webkit-min-device-pixel-ratio: 2) {
    .lnb-bottom {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 34px; 
	}
} */
@media only screen and (min-device-height: 812px) {footer{padding: 43px 0}}