@charset "utf-8";

/* 웹 폰트 ========================= */
font-face {
     font-family:'NanumGothic';
     font-weight:400;
     src: url('font/NanumGothic.eot');
     src: url('font/NanumGothic.eot?#iefix') format('embedded-opentype'),
          url('font/NanumGothic.woff') format('woff'),
               url('font/NanumGothic.ttf') format('truetype');
 }
 @font-face {
     font-family:'NanumGothic';
     font-weight:600;
     src: url('font/NanumGothicBold.eot');
     src: url('font/NanumGothicBold.eot?#iefix') format('embedded-opentype'),
          url('font/NanumGothicBold.woff') format('woff'),
            url('font/NanumGothicBold.ttf') format('truetype');
 }
 @font-face {
     font-family:'NanumGothic';
     font-weight:900;
     src: url('font/NanumGothicExtraBold.eot');
     src: url('font/NanumGothicExtraBold.eot?#iefix') format('embedded-opentype'),
          url('font/NanumGothicExtraBold.woff') format('woff'),
            url('font/NanumGothicExtraBold.ttf') format('truetype');
 } /* */
 

@font-face {
    font-family: 'notokr';
    src: url('font/notokr-light.eot');
    src: url('font/notokr-light.eot?#iefix') format('embedded-opentype'),
         url('font/notokr-light.woff2') format('woff2'),
         url('font/notokr-light.woff') format('woff'),
         url('font/notokr-light.ttf') format('truetype'),
         url('font/notokr-light.svg#notokr-light') format('svg');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: 'notokr';
    src: url('font/notokr-regular.eot');
    src: url('font/notokr-regular.eot?#iefix') format('embedded-opentype'),
         url('font/notokr-regular.woff2') format('woff2'),
         url('font/notokr-regular.woff') format('woff'),
         url('font/notokr-regular.ttf') format('truetype'),
         url('font/notokr-regular.svg#notokr-regular') format('svg');
    font-weight:400;
    font-style: normal;
}
@font-face {
    font-family: 'notokr';
    src: url('font/notokr-medium');
    src: url('font/notokr-medium.eot?#iefix') format('embedded-opentype'),
         url('font/notokr-medium.woff2') format('woff2'),
         url('font/notokr-medium.woff') format('woff'),
         url('font/notokr-medium.ttf') format('truetype'),
         url('font/notokr-medium.svg#notokr-medium') format('svg');
    font-weight:600;
    font-style: normal;

}
@font-face {
    font-family: 'notokr';
    src: url('font/notokr-bold.eot');
    src: url('font/notokr-bold.eot?#iefix') format('embedded-opentype'),
         url('font/notokr-bold.woff2') format('woff2'),
         url('font/notokr-bold.woff') format('woff'),
         url('font/notokr-bold.ttf') format('truetype'),
         url('font/notokr-bold.svg#notokr-bold') format('svg');
    font-weight: 900;
    font-style: normal;
} /* */
@font-face {
  font-family: 'NanumSquare';
  font-weight: 100;
  font-style: normal;
  src: url(font/NanumSquareL.eot);
  src: url(font/NanumSquareL.eot?#iefix) format('embedded-opentype');
  src: local('☺'),
       url(font/NanumSquareL.eot?#iefix) format('embedded-opentype'),
       url(font/NanumSquareL.woff) format('woff'),
       url(font/NanumSquareL.ttf) format('truetype');
 }
 @font-face {
 font-family: 'NanumSquare';
 font-weight: 400;
 font-style: normal;
 src: url(font/NanumSquareR.eot);
 src: url(font/NanumSquareR.eot?#iefix) format('embedded-opentype');
 src: local('☺'),
      url(font/NanumSquareR.eot?#iefix) format('embedded-opentype'),
      url(font/NanumSquareR.woff) format('woff'),
      url(font/NanumSquareR.ttf) format('truetype');
}
@font-face {
 font-family: 'NanumSquare';
 font-weight: 600;
 font-style: normal;
 src: url(font/NanumSquareB.eot);
 src: url(font/NanumSquareB.eot?#iefix) format('embedded-opentype');
 src: local('☺'),
      url(font/NanumSquareB.eot?#iefix) format('embedded-opentype'),
      url(font/NanumSquareB.woff) format('woff'),
      url(font/NanumSquareB.ttf) format('truetype');
}
@font-face {
 font-family: 'NanumSquare';
 font-weight: 900;
 font-style: normal;
 src: url(font/NanumSquareEB.eot);
 src: url(font/NanumSquareEB.eot?#iefix) format('embedded-opentype');
 src: local('☺'),
      url(font/NanumSquareEB.eot?#iefix) format('embedded-opentype'),
      url(font/NanumSquareEB.woff) format('woff'),
      url(font/NanumSquareEB.ttf) format('truetype');
} /* */

/* //////////font//////////////// */

@font-face {font-family: 'SUIT-Regular';src: url(fonts/SUIT-ttf/SUIT-Heavy.ttf) format('woff2');font-weight:900;font-style: normal;}
@font-face {font-family: 'SUIT-Regular';src: url(fonts/SUIT-ttf/SUIT-ExtraBold.ttf) format('woff2');font-weight:800;font-style: normal;}
@font-face {font-family: 'SUIT-Regular';src: url(fonts/SUIT-ttf/SUIT-Bold.ttf) format('woff2');font-weight:700;font-style: normal;}
@font-face {font-family: 'SUIT-Regular';src: url(fonts/SUIT-ttf/SUIT-SemiBold.ttf) format('woff2');font-weight:600;font-style: normal;}
@font-face {font-family: 'SUIT-Regular';src: url(fonts/SUIT-ttf/SUIT-Medium.ttf) format('woff2');font-weight:500;font-style: normal;}
@font-face {font-family: 'SUIT-Regular';src: url(fonts/SUIT-ttf/SUIT-Regular.ttf) format('woff2');font-weight:400;font-style: normal;}
@font-face {font-family: 'SUIT-Regular';src: url(fonts/SUIT-ttf/SUIT-Light.ttf) format('woff2');font-weight:300;font-style: normal;}
@font-face {font-family: 'SUIT-Regular';src: url(fonts/SUIT-ttf/SUIT-ExtraLight.ttf) format('woff2');font-weight:200;font-style: normal;}
@font-face {font-family: 'SUIT-Regular';src: url(fonts/SUIT-ttf/SUIT-Thin.ttf) format('woff2');font-weight:100;font-style: normal;}


/* ////////////////////////////////////// */

body {
     color: #252525;
	font-size: 0.9rem;
	line-height: 1.2;
     font-family: "notokr", sans-serif;/**/
     /* font-family: 나눔스퀘어, 'NanumSquare', sans-serif; /* */
     /* font-family: 나눔고딕, 'NanumGothic', sans-serif; /* */
     /* background-color: #e4e6e9; */
     /* font-family: 'Jua', sans-serif; 
     /* font-family: 'SUIT-Regular', snas-serif; */
     /* background-color: #f3f5f5; */
     overflow: auto;
}

html, body {
  margin: 0;
  padding: 0;
}

button {
     background-color: transparent;
     border: none;
}

th {
	font-size:1.2rem;
}
.wrap {
  width: 100%;
  overflow:hiddne;
}
/* header ======================================================================
============================================================================= */
header {
     position: fixed;
     top: 0;
     width: 100%;
     z-index:9;
}
.head-box {
     display: flex;
     justify-content: space-between;
     padding: 0 20px;
     box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.1);
     background-color:#fff;
     height:60px;
     align-items: center;
}

.head-box h1 img {
	width: 115px;
	padding-top: 5px; 
}
.head-menu ul {
	display: flex;
	justify-content: end;
	align-items: center;
	padding-top:3px;
}
.head-menu ul li {
	position: relative;
	padding-left:6px;
	display:inline-block;
}
.head-menu-dk ul {
	display:flex;
	align-items: center;
}
.dk-box {
	border: 2px solid rgba(75, 138, 82, 1);
	border-radius: 5px;
	padding:3px 5px;
	font-weight: 700;
	margin-right: 5px;
}
.top-cart {
	position:relative;
}
.top-cart button {
	padding:0;
}
.top-cart span {
	position: absolute;
	bottom: -9px; 
	right: -9px;
	display: inline-block;
	min-width:16px;
	height: 16px;
	background-color: #b3051e;
	border-radius: 50%;
	text-align : center;
	color: #fff;
	padding: 0 1px;
	line-height:16px;
	font-size: 0.6rem;
	box-sizing:border-box;
}
.top-cart span i {
	text-align: center;
	color: #fff;
	font-style: normal;
}    
.top-cart img {
	width: 24px;
}
.top-tel {
	padding-left:8px;
}
.top-tel img {
	width: 20px;
}
.top-home img {
	width: 21px;
}
.top-hotel {
	display: inline-block;
	border-radius: 15px;
	border: 1px solid #569a5d;
	font-size: 0.8rem;
	font-weight: 600;
	padding: 5px 10px !important;
	text-align: center;
	margin-right: 5px;
}
.top-speed {
	background-color: rgba(255, 255, 255, 0.8);
	position: absolute;
	bottom: -48px;
	padding: 15px 10px 10px 10px;
    width: 100%;
    box-sizing: border-box;
    display:flex;
    align-content:center;
    justify-content: center;
}
.top-speed img {
	width: 50px;
}
.top {
	width: 50px;
    height: 50px;
    /* background: #222222; */
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    position: fixed;
    bottom: 60px;
    right: 10px;
    cursor: pointer;
    box-shadow: 0 0 6px 0 rgba(0,0,0,0.5);
    z-index: 999;
    display:none;     
}
.top i {
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: rgba(0, 0, 0, 0.8);
    font-weight: 600;
    font-size: 19px;
}
     
/* footer ======================================================================
============================================================================= */
footer {
	box-sizing:border-box;
    background-color:#f3f3f5;
    padding-bottom:50px;
    width:100%;
}
.footer-menu-box {
	position:fixed;
	bottom:0; 
	width:100%;
	background-color:#fff;
	padding:10px;
	z-index:5;
	box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1);
}
.footer-menu-box ul {
	display:flex;
	justify-content: space-around;
}
.footer-menu-box ul {
	text-align:center;
}
.footer-menu-box ul li a {
	color:#252525;
	padding-top: 26px;
	display:inline-block;
	min-width:30px;
	font-weight: 600;
	/*position:relative;*/
}
.footer-menu-box ul li a:hover {
	color: #4b8a52;
}
.footer-menu-box ul li span {
	font-size: 0.7rem;
	line-height: 1;
}
.footer-menu-home a {
	background:url('../images/main/icon_footer_menu_home.png') no-repeat center 0 / 20px auto;
}
.footer-menu-home a:hover {
	background:url('../images/main/icon_footer_menu_home_on.png') no-repeat center 0 / 20px auto;
}
.footer-menu-star a {
	background:url('../images/main/icon_footer_menu_star.png;') no-repeat center 0 / 20px auto;
}
.footer-menu-star a:hover {
	background:url('../images/main/icon_footer_menu_star_on.png') no-repeat center 0 / 20px auto;
}
.footer-menu-user a {
	background:url('../images/main/icon_footer_menu_user.png') no-repeat center 0 / 19px auto;
}
.footer-menu-user a:hover {
	background:url('../images/main/icon_footer_menu_user_on.png') no-repeat center 0 / 19px auto;
}
.footer-menu-cart a {
	background:url('../images/main/icon_footer_menu_cart.png') no-repeat center 0 / 22px auto;
	position: relative;
}
.footer-menu-cart a:hover {
	background:url('../images/main/icon_footer_menu_cart_on.png') no-repeat center 0 / 22px auto;
}

.cart-count {
	position: absolute;
	top: 15px; 
	right: -9px;
	display: inline-block;
	min-width:16px;
	height: 16px;
	background-color: #b3051e;
	border-radius: 50%;
	text-align : center;
	color: #fff;
	padding: 0 1px;
	line-height:16px;
	font-size: 0.6rem;
	box-sizing:border-box;
}
/* 개인정보취급방침 메뉴 */
.footer-price-box {
	padding:0 20px;
}
.footer-price-menu {
	padding: 15px 0px;
    /* border-bottom: 1px solid #e4e4e6; */
    display:flex;
    justify-content: center;
}
.footer-price-menu li {
	color:#969697;
    padding: 0px 5px;
    border-right:1px solid #e4e4e6;
    font-size: 0.8rem;
}
.footer-price-menu li:last-child {
    border-right:none;
}
.footer-price-menu button {
	padding: 0;
}
.footer-price-menu li a, .footer-price-menu li button {
	color: rgba(0, 0, 0, 0.8);
}
.footer-price-menu li.price-bold-txt a {
	color: #252525;
	font-weight: 600;
}

/* 회사 정보 */
address {
     padding:20px 20px 0;
}
address button {
     font-size:0.8rem;
     font-weight:600;
     padding-left:0;
     line-height: 1;
}
address button span {
     font-size: 0.8rem;
     vertical-align:middle;

}
address dt {
    width: 100%;
	text-align: center;
	border: 1px solid rgba(0, 0, 0, 0.3);
	background-color: rgba(255, 255, 255, 0.3);
	padding: 5px 10px;
	border-radius: 20px;
	margin-bottom: 5px;
}
address button span.info-open {
     display:none;
}
.info-open {
	display:none;
}
.info-close {
     
}
.address button span i {
	font-size: 1rem;
	line-height: 1;
}
.adr-box {
	line-height:1.6;
	font-size: 0.74rem;
    display:none;
    color: rgba(0, 0, 0, 0.65);
    padding-bottom: 15px;
    padding-left: 10px;
    padding-top: 5px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); 
}
.adr-box ul {
	overflow: hidden;
}
.copy-box {
	line-height:1.6;
	font-size: 0.74rem;
    color: rgba(0, 0, 0, 0.65);
	padding-bottom:30px;
	width: 100%;
	text-align: center;
}


/* main ======================================================================
============================================================================= */
main {
     padding-top: 64px;
     position: relative;
     overflow:hidden;
     background-color: #fff;
}
article {
	background-color: #fff;
}
section {
	padding-top:15px;
    padding-bottom:15px;
    width:100%;
   	overflow:hidden;
}
section h2 {
     line-height:1;
     font-weight: 900;
     font-size: 1.2rem;
     padding-left: 20px;
     padding-right: 20px;
     /* padding-bottom:10px; */
}
section > ul {
     padding-left: 10px;               
     padding-right: 10px;
}
section h2 {
     line-height: 1; 
}
section h2 span img {
     height:22px;
     vertical-align:middle;
}


/* 메인 하단 베스트 메뉴가 기본 리스트 */
.prod-normal-list {
     display:flex;
     flex-flow: row wrap;
     width: 100%;
     box-sizing:border-box;
     padding:10px;
     
}
.prod-normal-list li {
     width:50%;
     box-sizing:border-box;
     padding:6px;
}
.prod-normal-list li dl {
     width:100%;
     padding-bottom: 10px;
}
.prod-normal-list li dl dt {
     width:100%;
     height:100%;
     
}
.prod-normal-list li dl dt a {
     /* border-radius: 18px; */
     display:inline-block;
     overflow:hidden;
     width:100%;
}
.prod-normal-list li dl dt a img {
     width:100%;
     margin:0 auto;
     border-radius: 18px;
}
.prod-normal-list li dl dd {
     line-height:1.6;
     display: flex;
     align-items: center; 
     flex-flow: row wrap;
}
.prod-normal-list li dl dd b {
     font-size: 0.9rem;
     display:inline-block;
     padding-right:5px;
}
.prod-normal-lis li dl dd span {
     display:inline-block;
}

/* 금액 폰트 설정 */
.food-price-before {
     text-decoration: line-through  #a2a1a1;
     color: #a2a1a1;
     font-weight: 600;
     padding-right:3px;
     font-size: 0.8rem;
}
.food-price {
     font-weight: 600;
     font-size: 1rem;
}

/* 공통 텍스트 아이콘  */
.icon {
     font-size: 0.7rem; 
     color:#fff;
     font-weight:400;
     background-color:#252525;
     height:16px; border-radius:8px;
     padding:0 8px; 
     line-height:16px;
     display:inline-block;
     vertical-align: middle;
}
.icon-best {
     background-color: #b3051e;
}
.icon-event {
     background-color: #4a812d;
}
.icon-new {
     background-color: #e1a148;
}
/* 버튼 */
/* 하단버튼 뒤로가가 버튼 계속 추가됨 */
.btn-box ul {
	padding: 10px;
	display: flex;
	justify-content: space-between;
	border-top:1px solid rgba(0, 0, 0, 0.1);
	align-items: center;
}
.btn-box ul.btn-end {
	justify-content: flex-end;
}
.btn-box li {
	/* flex-grow: 1; */
	/* padding: 0 2px;*/
	padding: 0 6px;
}
.btn-box li button {
	background-color: rgba(75, 138, 82, 1);
	display:inline-block;
	padding: 6px 10px; 
	vertical-align: middle;
	color:#fff;
	font-weight:400;
}
.btn-box li button:active, 
.btn-box li button:hover {
	opacity: .75;
}
.btn-box button i {
	display:inline-block;
	font-size: 1.2rem;
	margin:0;
}
.btn-box li button:nth-of-type(even) {
	background-color: rgba(238, 159, 8, 1);
}
.btn-box li.back-btn button {
	background-color:#fff;
	color:#252525;
	padding: 6px 20px 6px 0; 
	flex: 2;
}
.btn-box li.btn-all {
	width:100%;
}
.btn-box li.btn-all button {
	width:100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
/* footer에 들어가는 버튼 */
/* footer detail footer */
.footer-bk {
	background-color: #fff;
}
.footer-btn-box {
	position:fixed;
	bottom:0; 
	width:100%;
	background-color:#fff;
	z-index:5;
	box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1);
}
.footer-btn-box ul {
	display: flex; 
	justify-content: space-between;
}
.footer-btn-box ul li {
	line-height: 0;
	font-size: 0;
}
.footer-btn-box ul li button {
	padding: 15px;
	font-size: 0.9rem;
	line-height: 1;
}
.footer-btn-box ul li:last-child button {
	background-color: rgba(75, 138, 82, 1);
	color: #fff;
}
.footer-btn-box ul li:last-child button:nth-of-type(even) {
	background-color: rgba(238, 159, 8, 1);
}
.footer-btn-box li.btn-all {
	width:100%;
}
.footer-btn-box li.btn-all button {
	width:100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.footer-btn-box ul li:last-child {
	flex: 2;
	display: flex;
}
.footer-btn-box ul li:last-child button {
	flex: 1;
}
.footer-btn-box ul li.wid-btn {
	display: flex;
}
.footer-btn-box ul li.wid-btn button:first-child {
	/* width: 30%; */
	background-color: rgba(238, 159, 8, 1);
	flex-grow: 1;
}
.footer-btn-box ul li.wid-btn button:last-child {
	/* width: 70%; */
	background-color: rgba(75, 138, 82, 1);
	flex-grow: 2;
}
/* alert 팝업 창 =================================== */
.alert-pop-wrap {
	position: fixed;
	width: 100%;
	height: 100%;	
	background-color: rgba(0, 0, 0, 0.45);
	top: 0;
	left: 0;
	z-index: 999;
}
.alert-pop-box {
	display: flex;
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
}
.alert-pop-box dl {
	max-width : 300px;
	border-radius: 20px;
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
	background-color: #fff;
}
.alert-pop-box dl dd div {
	display: flex;
	border-radius: 0 0 20px 20px;
	overflow: hidden;
}
.alert-pop-box dl dd div button {
	flex-grow: 1;
	text-align:center;
	padding: 10px;
	background-color: rgba(0, 0, 0, 0.5);
	color: #fff;
}
.alert-pop-box dl dt {
	padding: 14px 10px 10px;
	position: relative;
	width:100%;
	text-align: center;
}
.alert-pop-box dl dt span {
	display: inline-block;
	font-weight: 600;
	border-bottom: 1px solid #ccc;
	padding: 5px 10px 8px;
}
.alert-pop-box dl dt button {
	position:absolute;
	top: -30px;
	right: 0;
	font-weight: 900;
	color: #fff;
	font-size: 1.4rem;
}
.alert-pop-box dl dd p {
	padding: 6px 15px 20px;
	line-height: 1.5;
	text-align: center;
}
.alert-pop-box dl dd div button {
	background-color: rgba(75, 138, 82, 1);
}
.alert-pop-box dl dd div button:last-child {
	background-color: #efa312;
}
/* 메인에만 들어가는 time  pop */
.time-pop-wrap {
	position:fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5); 
	z-index: 999;
	padding: 10px;
	box-sizing: border-box;
}
.time-pop-box {
	display: flex;
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	}
.time-pop-box dl {
	max-width : 520px;
	border-radius: 20px;
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
	background-color: #fff;
	overflow: hidden;
}
.time-pop-box dl dt div {
	background-color: #def2ff;
	width: 100%;
	text-align: center;
	padding: 30px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
}
.time-pop-box dl dt div strong {
	font-size: 1.6rem;
	font-weight: 900;
	color: #083b8d;
}
.time-pop-box dl dt div img {
	width:50px;
}
.time-pop-box dl dt p {
	background-color:#def2ff;
	text-align: center;
	font-size: 1.4rem;
	font-weight: 600;
	line-height: 1.6;
}
.time-pop-box dl dt p span {
	color: #083b8d;
	font-weight: 900;
	font-size: 1.6rem;
}
.time-pop-box dl dt > span {
	display:flex;
	width: 100%;
}
.time-pop-box dl dt > span i {
	background-color:#def2ff;
	border-radius: 0 0 50px 50px;
	height: 30px;
	display:inline-block;
	flex-grow: 1;
}

.time-pop-box dl dd {
	padding: 20px 30px 30px 30px;
	font-size: 1.2rem;
	text-align: center;
	line-height: 1.6;
}
.time-pop-box dl dd p {
	padding-bottom: 20px; 
}
.time-pop-box dl dd p br {
	display:none;
}
.time-pop-box dl dd span {
	color: #083b8d;
	font-weight: 600;
	line-height: 1.6;
	display:block;
}
.time-pop-box dl dd span:nth-of-type(1) {
	font-weight: 900;
	font-size: 2rem;
}
.time-pop-box dl dd span:nth-of-type(2) {
	font-weight: 900;
	font-size: 1.2rem;
	color: #252525;
}
.time-pop-box dl dd span:nth-of-type(3) {
	font-size: 1.2rem;
}
.time-pop-box dl dd button {
	border-radius: 20px;
	border:2px solid #3b5c91;
	padding: 5px 20px;
	background-color: #a1e7ff;
	font-size: 1.2rem;
	font-weight: 600;
	width: 60%
}
.time-pop-box .close-time {
	font-size: 1.2rem;
}
.loading-wrap {
    position: fixed;
    display: none;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
  	text-align: center;
  	padding-top: 200px;
}