:root {
    --bs-body-font-family: 'NanumSquare';
    --primary-color: #5b62aa;
    --second-color:#cdcfe4;
	--third-color:#2ba76b;
    --disable-color: #9f9f9f;
    --font-content-color: #ffffff;
    --font-base-color: #333333;
    --font-ad-color: #999;
    --font-deal-color: #2ba76b;
    --font-extra-time: #2ba76b;
    --font-desc-color: #adb0d4;
    --font-highlight: #2ba76b;
    --star-color:#ffce46;
    --outline-color: #e5e6e9;
    --bg-color: #f0f1f8;
    --bg-sub: #e7e9f6;
    --bg-white: #fff;
    --container-width: 720px;
    --navbar-width: 680px;
    --font-15: 15px;
    --section-radius:25px;
    --green: #2ba76b;
    --error: #cc0000;
    --grey:#ddd;
}
.btn-check:active+.btn, .btn-check:checked+.btn, .btn.active, .btn.show, .btn:active {
    background-color:var(--primary-color);
}

h1,h2,h2,h3,h4,h5,h6 {
    font-family: var(--bs-body-font-family);
	font-weight: 800;
	}
p,body,label,.col-3,.col-9 {
    font-family: var(--bs-body-font-family);
	font-weight: 600;
	letter-spacing: -0.25px;
	word-spacing: -0.25px;
	}
a,
a:hover {
    text-decoration: none;
    color: var(--primary-color);
}

.container { width:720px; }
.btn {
    font-size: 13px;
    line-height: 39px;
    padding-top: 0px;
    padding-bottom: 0px;
    width: 194px;
    border-radius: 50px;
}
.btn a {
    color: #fff;
}

.btn-lg {
    font-size: 20px;
    height: 69px;
    line-height: 69px;
    max-width: 355px;
    width: 90%;
}
.btn-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}
.btn-primary:hover {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}
.btn-outline {
    border: 2px solid var(--outline-color);
    background-color: var(--content-color);
    color: var(--bs-gray-900);
}
.btn-outline:hover {
    border-color: var(--primary-color);
}
.btn-outline a {
    color: var(--bs-gray-900);
}
.btn-green {
    background-color: var(--third-color);
    border-color: var(--third-color);
	color: white;
	}
.btn-white { background-color:var(--second-color); border-color:var(--primary-color); color:var(--primary-color);}
.splash {
    position: fixed;
    background-color:var(--bg-color);
    top:0; left:0; right:0; bottom:0;
    z-index: 100;
}
.splash .splash-image {
    position: absolute;
    display:none;
    top: 50%;
    left: 50%;
    transition: all 1.5s;
    opacity: 0;
    -webkit-transform: translate(-50%, -30%);
    -moz-transform: translate(-50%, -30%);
    -ms-transform: translate(-50%, -30%);
    -o-transform: translate(-50%, -30%);
    transform: translate(-50%, -30%);    
	width:25%;
}
.splash .splash-image.active {
    opacity: 1;
    transform: translate(-50%,-50%);
}
.m-wrap {
    max-width: 720px;
    margin: 0 auto;
    padding-top: 20px;
    padding-left:20px;
    padding-right:20px;
}
.m-wrap .contents {
    background-color: var(--bs-white);
    border-radius: 10px;
	margin: 60px 0px -20px 0px;
    padding: 40px 30px;
    box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.1);
}

/* form */
label.form-label {
    font-size: 14px;
    color: var(--disable-color);
}
label.form-label-main {
    font-size: 14px;
    color: var(--primary-color);
}
.mb-3:focus-within label {
    color: var(--primary-color);
}
input.theme1 {
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: none;
    box-shadow: -1px 2px 0px -1px var(--disable-color);
    border-radius: 0;
    padding-left: 0px;
    display: block;
}
input.theme1:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: red;
}
input.theme1:focus {
    box-shadow: -1px 3px 0px -1px var(--primary-color);
    border-color: var(--primary-color);
}
.inline-block { display:inline-block; }
.mb-rem2 {
    margin-bottom: 1rem !important;
}
.m-background:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 90px;
	background:linear-gradient(to bottom right, #848ac4 0%, #6167ad 50%, #5b62aa 100%);
    z-index: -1;
}
.page-back {
    color: var(--bs-white);
    position:relative;
    top:-2px; left:-15px;
}
.label-forgot {
    font-size: 15px;
    color: var(--primary-color);
    font-weight: 500;
}
h1 { color: var(--bs-white);
    font-size: 28px;
    margin: 10px 0px 20px 0px;
    padding-left: 15px;
}
h2 { font-size: 24px; }
h3 { color: var(--primary-color);
	font-size: 20px;
	margin-top: 50px;
	}
h4 { color: var(--primary-color);
    font-size: 18px;
    margin-bottom: 10px;
	}
h5 { color: var(--third-color);
    font-size: 16px;
	margin-bottom: 0rem	
	}
.col-form-label { padding-top:0; padding-bottom:0;}
.fw100 { font-weight:100; }
.fw200 { font-weight:200; }
.fw300 { font-weight:300; }
.fw400 { font-weight:400; }
.fw500 { font-weight:500; }
.fw600 { font-weight:600; }
.fw700 { font-weight:700; }
.fw800 { font-weight:800; }
.fw900 { font-weight:900; }

#loaderbg {
    position: fixed;
    top: 0px;
    left: 0px;
    background: rgba(0, 0, 0, 0.7) none repeat scroll 0% 0%;
    z-index: 2000;
    width: 100%;
    height: 100%;
    display: none;
}
#loader {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    animation: spin 1s linear infinite;
    border-color: #3498db #f3f3f3 #f3f3f3;
    border-image: none;
    border-radius: 50%;
    border-style: solid;
    border-width: 4px;
    height: 60px;
    left: 50%;
    margin: -40px 0 0 -40px;
    position: absolute;
    top: 50%;
    width: 60px;
    z-index: 1;
}
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
.close-loader {
    float: right;
    padding: 15px;
    cursor: pointer;
}
.desc {
    position: absolute;
    top: 55%;
    left: 44%;
    width: 200px;
    color: #fff;
    text-align: center;
    font-size: 13px;
}
.spinner:before {
    content: "";
    box-sizing: border-box;
    position: absolute;
    top: 22px;
    left: 18px;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-left: -10px;
    border-radius: 50%;
    border: 2px solid #ccc;
    border-top-color: #3c4450;
    animation: spinner 0.9s linear infinite;
}
@keyframes spinner {
    to {
        transform: rotate(360deg);
    }
}

.root { display:flex; justify-content: center; }
.container {
    max-width: 720px;
    min-width: 320px;
    width: 100%;
    margin: 0px auto;
    padding: 0px 16px;
}
.container.main { margin-top:60px; padding: 0px; position: relative;}
.tag { color: var(--third-color); font-size: 16px; }
.home-tag { color: var(--third-color); font-size: 16px;margin: -10px 0px 0px 40px; }
.lost-id { font-size:13px; color:var(--primary-color);}
/* header */
header { 
    display: flex;
    position: fixed;
    justify-content: space-between;
    max-width: var(--container-width);
    background-color:var(--bg-color);
    width: 100%;
    height: 56px;
    top: 0px;
    margin-bottom:10px;
    z-index: 1000;
}
.display-block { display:block !important; }
.menu-icon { width:175px; padding-left: 15px; }
.menu-icon svg { position:relative; top:15px; width:24px; height:24px; cursor: pointer; fill: var(--primary-color);}
.logo svg { position:relative; top: 9px; cursor: pointer;}
.tools { width:175px; padding-right: 15px; text-align:right;}
.tools.login .sign { }
.tools.login .search {
    position: relative;
    top: -7px;
}
.search { margin-right:10px; }
.search, .sign { display:inline-block; }
.search svg { position:relative; top: 15px; width:20px; height:20px; cursor: pointer; fill: var(--primary-color);}
.mb-name {
    position: relative;
    top: 17px;
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    padding-right:5px;
}
.sign .dropdown-toggle:after { 
    position: absolute;
    top: 27px;
    right: -7px;
}
.sign .dropdown-menu {
    top:15px !important;
}
.sign .dropdown-menu li {
    font-size:14px;
}
.sign svg { position:relative; top: 15px; width:24px; height:24px; cursor: pointer; fill: var(--primary-color);}
.shop-title { color: var(--primary-color); font-size: 20px;margin: 70px 0 30px 15px;font-weight: 800;font-family: var(--bs-body-font-family); }
.shop-title svg { fill:var(--primary-color); width:24px; height:24px; position: relative; top: -2px; }
.shop-home { margin:0px; background-color:var(--bg-white); border-radius:var(--section-radius); transition:all 0.35s; overflow: hidden;  z-index: 1; overflow: hidden; }
.shop-home h2 { color: var(--primary-color); padding: 25px 40px 10px; cursor: pointer; clear: both;}
.shop-home h2 span { float:right; }
.shop-home .shop-desc { padding: 0px 40px; color: var(--font-base-color); }
.shop-home .shop-desc.icon { margin-top:50px; color:var(--primary-color); font-weight: 800;}
.shop-home .shop-desc.icon svg { fill:var(--primary-color); width:26px; height:26px; position: relative; top:-3px; }
.shop-home .shop-desc .extra-time { color:var(--font-extra-time); }
.shop-home img { width: 100%; margin-bottom:30px; }
.shop-home.active { margin:0px 20px; }

.shop-event { background-color:var(--primary-color); border-radius:var(--section-radius); transition:all 0.35s; overflow: hidden; max-width: var(--container-width); z-index: 2; width: 100%; margin-bottom:30px; }
.shop-event h2 { color:var(--bg-white);  padding: 25px 40px 10px; cursor: pointer; clear: both;}
.shop-event .deal-price { display:block; width:100%; padding:0px 20px; }
.shop-event .deal-price .menu-list { display:table; width:100%; border-radius:20px; background-color: var(--bg-white); margin-bottom: 25px; padding: 20px 20px 10px;}
.shop-event .deal-price .menu-list .menu-wrap { display:flex; margin-bottom:10px; }
.shop-event .deal-price .menu-list .menu-wrap * { line-height:25px; }
.shop-event .deal-price .menu-list .menu-wrap .price { font-size: 1.0rem;font-weight: 400;
margin-left:auto; padding-right:10px; text-decoration:line-through; color:var(--disable-color);}
.shop-event .deal-price .menu-list .menu-wrap .sale { font-size:1.2rem;font-weight:800;color:var(--font-deal-color); font-family:var(--bs-body-font-family);}
.shop-event .deal-price .grid { display:table; width:100%; border-radius:20px; background-color: var(--bg-white); margin-bottom: 25px; }
.shop-event .deal-price .grid .empty { display: table-cell; vertical-align: middle; text-align: center; padding:20px; }
.shop-event .deal-price .grid .price-info { display:table-cell; vertical-align:top; padding-right:10px;}
.shop-event .deal-price .grid .menu-img { display:table-cell; width:150px; height:150px;}
.shop-event .deal-price .grid img { border-top-right-radius:20px; border-bottom-right-radius:20px; }
.shop-event .deal-price .grid h3 { padding:10px 15px 0px; margin-bottom: 15px; margin-top:10px; color:var(--font-base-color); }
.shop-event .deal-price .grid .info { display:flex; justify-content:space-between; align-items: center; padding: 0px 15px 0px; margin-bottom: 0px; font-size: var(--font-15)}
.shop-event .deal-price .grid .info .txt-price { font-size:1.5rem;font-weight:800;color: var(--font-deal-color); font-family: var(--bs-body-font-family);}
.shop-event .deal-price .grid .info .txt-price.storked { text-decoration:line-through; font-size:1.2rem;font-weight: 400; color: var(--disable-color); }
.shop-event.active { top:90px; }
.shop-home .map-area img { margin-bottom:0px; }

/*.shop-event.fixed { position:sticky; top:0px; }*/
.shop-map { background-color:var(--bg-white); border-radius: var(--section-radius); transition:all 0.35s; overflow: hidden; max-width: var(--container-width); z-index: 2; width: 100%; margin-top:30px; }
.shop-map h2 { color: var(--font-base-color); padding: 25px 40px 10px; cursor: pointer; clear: both;}
.shop-map.active { top:150px; }
.shop-map .address { margin-left:40px; margin-bottom:40px; }
.shop-map .map-area { text-align:center; }

.shop-review { background-color:var(--second-color);border-radius: var(--section-radius); transition:all 0.35s; overflow: hidden; max-width: var(--container-width); z-index: 2; width: 100%; margin-top:30px; padding-bottom:30px; }
.shop-review h2 { position:relative; color:var(--primary-color); padding: 25px 25px 10px; cursor: pointer; clear: both;}
.shop-review h2 .review-button { position:absolute; top:15px; right:30px; }
.shop-review .review-box { display:flex; margin:0px 30px; background-color:var(--bg-white); border-radius: 20px; padding:30px; margin-bottom:20px; }
.shop-review .review-box .review-status { width: 60%;}
.shop-review .review-box .review-status .avg { display:block; color:var(--primary-color); }
.shop-review .review-box .review-status .avg .point { font-size: 30px; font-weight: 800; }
.shop-review .review-box .review-status .avg .standard { padding-left:5px; font-size: 20px; font-weight: 600; }
.shop-review .review-box .review-status .total { margin-top:10px; display:block; color:var(--font-ad-color); font-weight:600; }
.shop-review .review-box .review-status .total svg { fill:var(--font-ad-color); position: relative; top:-2px; } 
.shop-review .stars { display:block; margin-top:15px;color:var(--grey); }
.shop-review .stars .active { color:var(--star-color); }
.shop-review .stars svg { fill:var(--star-color); width:24px; height:24px; } 
.shop-review .stars.point svg { fill:var(--grey); width:24px; height:24px; cursor: pointer;} 
.shop-review .stars.point svg.hover,
.shop-review .stars.point svg.active { fill:var(--star-color); }
.shop-review .review-box .review-dist { flex-grow: 1;}
.shop-review .review-box .review-dist .point-text { margin-bottom: 3px;}
.shop-review .review-box .review-dist .point-text .user10 { width:70%; height:20px; background-color:var(--star-color); border-radius: 5px; position: relative; top:4px; display:inline-block; }
.shop-review .review-box .review-dist .point-text .user8 { width:55%; height:20px; background-color:var(--star-color); border-radius: 5px; position: relative; top:4px; display:inline-block; }
.shop-review .review-box .review-dist .point-text .user6 { width:40%; height:20px; background-color:var(--star-color); border-radius: 5px; position: relative; top:4px; display:inline-block; }
.shop-review .review-box .review-dist .point-text .user4 { width:20%; height:20px; background-color:var(--star-color); border-radius: 5px; position: relative; top:4px; display:inline-block; }
.shop-review .review-box .review-dist .point-text .user2 { width:10%; height:20px; background-color:var(--star-color); border-radius: 5px; position: relative; top:4px; display:inline-block; }
.shop-review .review-form { display:none; margin:0px 30px; background-color:var(--bg-white); border-radius: 20px; padding:30px; margin-bottom:20px; }
#review-content { height:100px; }
.review-wrap { margin:0 30px; text-align:right; }
.shop-review .review-user { margin:0px 30px; background-color:var(--bg-white); border-radius: 20px; padding:30px; margin-bottom:20px; }
.shop-review .review-user .user-name { color:var(--primary-color); font-size:20px; font-weight: 600; margin-bottom:10px; }

.shop-nav { position:fixed; left:0px; right:0px; bottom:20px; background-color:var(--bg-color); border-radius: 10px; transition:all 0.35s; z-index: 10;max-width: var(--navbar-width); margin: 0 auto;}
.shop-nav ul { display:flex; margin:0; padding:0; margin-left: }
.shop-nav li { color:var(--color-white); flex: 1 1 0; width: 0; padding:12px 20px; text-align:center; cursor:pointer;}
.shop-nav li { border-radius:10px; }
.shop-nav li.slide { position: absolute; width:33.33%; height:100%; top:0; left:0; background-color:var(--primary-color); z-index: -1; opacity: 0; transition:all 0.25s;}
.shop-nav li.active { color:var(--bg-white); }

.shop-nav li:nth-child(1).active ~ .slide { left:0; opacity: 1; }
.shop-nav li:nth-child(2).active ~ .slide { left:33.33%; opacity: 1; }
.shop-nav li:nth-child(3).active ~ .slide { left:66.66%; opacity: 1; }
.deal-price::-webkit-scrollbar,
.deal-price::-webkit-scrollbar-thumb {
  width: 26px;
  border-radius: 13px;
  color: rgba(0, 0, 0, 0.3);
  background-clip: padding-box;
  border: 10px solid transparent;
}

.deal-price::-webkit-scrollbar-thumb {        
  box-shadow: inset 0 0 0 10px;
}

.deal-price:hover::-webkit-scrollbar,
.deal-price:hover::-webkit-scrollbar-thumb {
  color: rgba(0, 0, 0, 0.3);
}

.shop-list {
    margin: 0 15px;

}
.shop-list .item { 
    background-color: var(--bg-white);
    padding: 15px; 
    border-radius: 20px;
    margin-bottom:20px; 
}
.shop-list .item .shop-thumb { display:table-cell; }
.shop-list .item .shop-info { display:table-cell; vertical-align:top; padding-left: 15px; }
.shop-list .item .shop-info h5 { margin-top:10px;font-family:var(--bs-body-font-family);font-weight:600; }
.shop-list .item .shop-info .category { font-weight:700; color:var(--primary-color); padding-right:10px;font-family:var(--bs-body-font-family); }
.shop-list .item .shop-info .ad-text { color:var(--font-ad-color);font-family:var(--bs-body-font-family); }
.shop-list .item .shop-info .stars { margin:5px 0px;color:var(--font-highlight);font-family:var(--bs-body-font-family);font-size:0.8em; }
.shop-list .item .shop-thumb img { width: 100px; height: 100px; border-radius:20px; }
.shop-list .item .shop-etc { margin-top:10px; }
.shop-list .item .shop-etc .review { float:right; }
.shop-detail {margin:18px 0px;}
.user-comment{font-weight: 400;}
#checkAuth.disabled { background-color:var(--second-color); border-color:var(--primary-color); color:var(--primary-color);}
.shop-search { 
    position: relative;
    background-color: var(--bg-white);
    padding: 10px 20px 10px 45px;
    border-radius: 20px;
    margin: 0px 15px 20px;
}
.shop-search .search-icon {
    position: absolute;
    top: 8px; left: 18px;
}
.shop-search .search-icon svg { fill:var(--primary-color); }
.shop-search .input-search { border:0px; width:100%; box-shadow: none; padding: 0px;}

.result { margin:20px 15px 50px; }
.result ul { width:100%; margin: 0; padding: 0; display: flex; }
.result ul li { display:inline-block; text-align: center; padding: 15px; flex:1 1 0; }
.result ul li.more { background-color:var(--primary-color); color:var(--bg-white); border:2px solid var(--primary-color); border-radius: 50px; margin-right: 5px; }
.result ul li.skip { background-color:var(--bg-white); color: var(--primary-color); border:2px solid var(--primary-color); border-radius: 50px; margin-left: 5px; }
.mobile-break { display:none; }
.signup-box.sign-type,
.signup-box.sign-form { margin-top:80px; margin-left:0px; margin-right:0px; }
.signup-box { background-color:var(--bg-white); padding:30px; border-radius: 10px; margin:60px 0px 60px; font-size:14px; }
.signup-box h1 { position:relative; color:var(--font-base-color); font-weight:600; margin-bottom:10px; font-size:24px; padding-left:0px; }
.signup-box h1:after {
    position:absolute;
    content:'\f105';
    color:var(--font-base-color);
    font-family: 'fontawesome';
    font-size:36px;
    top:-7px;
    right:0px;
}
.signup-box h1 svg { width:36px; height:36px; fill: var(--primary-color); }
.signbox .form-control,
.sign-form .form-control { font-size:0.8rem; font-weight:600; }
.sign-form label.form-label { color:var(--font-base-color); }
.sign-desc {color:var(--font-desc-color); font-size:14px; padding-top:10px;}
.fileinput-button { position:relative; margin-top:10px; }
.fileinput-button input {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    opacity: 0;
    -ms-filter: 'alpha(opacity=0)';
    font-size: 100px;
    direction: ltr;
    cursor: pointer;
    width:194px;
    height:41px;
}
	.dropdown-menu { --bs-dropdown-link-active-bg: #2ba76b!important;}
	.btn-primary { --bs-btn-hover-bg: #cdcfe4!important;}

.footer {height: 90px;background-color:var(--primary-color);margin-top: 40px;}
.footer-copyright {font-size:6px;font-weight:400;color:var(--second-color);padding: 12px 0px 0px;}
#joinRes { padding-top:50px; }

.shop.empty h3 { font-weight:200; padding:0px 50px; word-break: break-word;}

@media (max-width:1080px) {
	.splash .splash-image {width:40%;}
	.splash .splash-image .img {width:40%;}
 }

@media (max-width:480px) {
	header {padding-left: 15px;}
	.tools.login .sign {margin-right: 30px;} 
	h1,h2,.shop-title { font-size: 20px; }
	h3 {padding: 0px 20px;}
	h4 { font-size: 17px; }
	h5 {font-size: 15px;letter-spacing: -1.25px;margin: 10px 0;}
    .btn.mobile { width: 100px; }
	p, body, label, .col-3, .col-9,
	.home-tag,
	.shop-event .deal-price .grid .info .txt-price.storked, 
	.shop-event .deal-price .grid .info .txt-price,
	.shop-event .deal-price .menu-list .menu-wrap .sale,
	.shop-event .deal-price .menu-list .menu-wrap .price,
	.user-comment {font-size: 15px;}
    .container.main { padding:0 15px; }
	.home-tag { font-size: 16px;margin-left:20px; }
	.shop-list {margin: 0 5px;}
	.shop-desc.icon {font-size: 16px;}
	.shop-home h2,
    .shop-event h2,
    .shop-map h2 { padding: 25px 25px 10px; }
    .shop-home .shop-desc { padding: 0px 20px; }
    .shop-event .deal-price .grid { height:auto; }
    .shop-event .deal-price .grid .menu-img { width: 115px; height:115px;}
    .shop-event .deal-price .grid h3 { padding: 5px 15px 0px; margin-bottom: 10px; font-size:16px;}
    .shop-event .deal-price { margin: 0px; }
    .shop-map .address { margin-left: 20px; }
    .shop-nav { margin:0 20px; }
    .shop-review .review-box { margin:0 20px; padding:20px; margin-bottom:20px; }
    .shop-review .review-user { margin:0 20px; padding:20px; margin-bottom:20px; }
    .mobile-break { display:initial; }
	.footer-copyright {font-size: 14px;}
    .shop-list .item .shop-info h5 { width:180px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
    .shop-review .review-form { padding: 20px; margin:0 20px; }
	.company-list li, .menu-list li {margin-bottom: 15px;}
	.review-wrap { margin:0 20px; }
	.btn {width: 100%;}
	.btn-primary {height: 44px;line-height: 44px;}
	.m-wrap .sign-up {width: 85%; margin: 15px 0px 0px -10px!important;}
	.menu-list.event .grid h3,
	.menu-list.event .grid .info .txt-title,
	.menu-list.event .grid .info .txt-price, 
	.menu-list.event .grid .info .txt-price.storked,
	.menu-list.common .menu-wrap .txt-menu-name,
	.menu-list.common .menu-wrap .retail ,
	.menu-list.common .menu-wrap .price {font-size: 14px!important;}
	.menu-list.event .grid .menu-img {width: 100px;height: 130px;}
	.splash .splash-image {width:100%;}
	.splash .splash-image .img {width:100%;}
	.price-info .menu-ctrl {margin-right:10px!important;}
 }

@media (max-width:389px) {
	h1 { font-size: 20px; }
	h2 { font-size: 18px; }
	h3 { font-size: 16px; }
	h4 { font-size: 16px; }
	h5 { font-size: 14px; }
	p, body, label, .col-3, .col-9,
	.home-tag,
	.shop-event .deal-price .grid .info .txt-price.storked, 
	.shop-event .deal-price .grid .info .txt-price,
	.shop-event .deal-price .menu-list .menu-wrap .sale,
	.shop-event .deal-price .menu-list .menu-wrap .price,
	.user-comment {font-size: 14px;}
	.container.main {padding: 0 5px;}
	.shop-list {margin: 0 1px;}
	.shop-list .item {padding: 10px 5px 5px 10px;}
	.m-wrap .contents {padding: 20px 20px;}
	.login-or {display: none;}
	.splash.splash-image {width:70%;}
	.splash.splash-image.img {width:70%;}
	.price-info .menu-ctrl {margin-right:1px!important;}
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.ui-menu .ui-menu-item-wrapper {
    font-family: var(--bs-body-font-family);
    font-size: 13px;
    font-weight: 600;
    padding: 5px 10px;
}
.ui-state-active,
.ui-menu .ui-menu-item-wrapper:hover {
    /* color:var(--green); */
    /* background-color:var(--bg-white); */
}

.partner-button {
    width:100%;
}
.btn.partner-button:active {
    background-color:var(--bs-btn-bg);
}

#partner .modal-footer { border:none; justify-content: center; }
#partner .modal-content {
    background-size: 200% 200%;
    background-image: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 25%, var(--primary-color) 25%, var(--third-color) 100%);
    -webkit-animation: AnimateBG 2s ease infinite;
            animation: AnimateBG 2s ease infinite;
}
#partner .modal-content h4 { color:var(--bg-white); font-size:26px; font-weight: 100;}
#partner .modal-content p { color:var(--bg-white); font-size:14px; font-weight:100; }

@-webkit-keyframes AnimateBG {
    0% {
      background-position: 0% 50%;
    }
    50% {
      background-position: 100% 50%;
    }
    100% {
      background-position: 0% 50%;
    }
}
  
@keyframes AnimateBG {
    0% {
      background-position: 0% 50%;
    }
    50% {
      background-position: 100% 50%;
    }
    100% {
      background-position: 0% 50%;
    }
}

.gradient-border {
    --border-width: 5px;
    background-color:transparent;
    border:none;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100px;
    font-size: 2rem;
    text-transform: uppercase;
    color: white;
    border-radius: var(--border-width);
    margin-bottom:30px;

    &::after {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        z-index: -1;
        width: 100%;
        height: 100px;
        background: linear-gradient(
            60deg,
            hsl(231, 33%, 50%),
            hsl(220, 23%, 80%),
            hsl(146, 51%, 44%),
            hsl(161, 50%, 92%)
        );
        background-size: 500% 500%;
        background-position: 0 200%;
        border-radius: calc(2 * var(--border-width));
        animation: moveGradient 4s alternate infinite;
    }
}

@keyframes moveGradient {
    50% {
        background-position: 100% 50%;
    }
}

.modal {
    text-align: center;
    padding: 0!important;
  }
  
  .modal:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -4px; /* Adjusts for spacing */
  }
  
  .modal-dialog {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
  }