/* common */
* {line-height:1.5; word-break:keep-all; color:#5b5a5d;}
body {max-width:540px; margin:0 auto; width:100%; display:block;}
body.main {background:url('../images/bg_main.png') no-repeat right top / cover;}
.wrapper {max-width:540px; margin:0 auto; padding:0 20px; width:100%;}
.is-pc {display:block;}
.is-m {display:none;}
@media (max-width:991px){
.is-pc {display:none;}
.is-m {display:block;}
}

/* header */
header {margin:0 -20px;}
header .back {font-size:0; display:block; position:absolute; left:20px; top:50%; transform:translateY(-50%); width:24px; height:24px; border-radius:50%; background:#f5f5f5 url('../images/icon_back.png') no-repeat center / cover;}
header .header-title {margin:0 0 24px; padding:30px 20px; background:linear-gradient(to right, #5B88ED, #3F74E8); border-radius:0 0 40px 40px;}
header .header-title h1 {text-align:center; color:#fff; font-size:24px; font-weight:bold;}
header .header-step {padding:24px 20px; position:relative;}
header .header-step h1 {text-align:center; font-size:24px; font-weight:bold; color:#5b5a5d;}
header .header-step h1.sm {font-size:20px;}
header .header-logo {margin:0 0 24px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; padding:24px 20px; position:relative; background:linear-gradient(to right, #5B88ED, #3F74E8); border-radius:0 0 40px 40px;}
header .header-logo h1 {width:111.52px; height:42px; font-size:0; background:url('../images/icon_header_logo.png') no-repeat center / cover;}
header .header-shop {display:flex; flex-wrap:wrap; align-items:center; position:relative; padding:12px 20px;}
header .header-shop h1 {margin:0 20px; flex:1; min-width:0;}
header .header-shop h1 a {display:block; text-align:center;}
header .header-shop h1 a img {width:100%; display:block; margin:0 auto;}
header .header-shop .menu {width:24px; height:24px; font-size:0; background:url('../images/icon_menu.png') no-repeat center / 24px auto;}
header .header-shop-menu {overflow:hidden; pointer-events:none; opacity:0; position:fixed; left:50%; top:0; width:100%; max-width:540px; height:100%; transform:translateX(-50%); background:rgba(0,0,0,0.7); z-index:9999; transition:all ease 0.5s;}
header .header-shop-menu .box {pointer-events:none; opacity:0; position:absolute; left:-50px; top:0; width:275px; height:100%; overflow-y:auto; transition:all ease 0.5s; background:#333;}
header .header-shop-menu .shop-head {display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; padding:12px;}
header .header-shop-menu .shop-head a {display:block; font-size:0; width:20px; height:20px; background:url('../images/icon_shop_menu_close.png') no-repeat center / cover;}
header .header-shop-menu .shop-body {padding:0 24px 24px;}
header .header-shop-menu .shop-body h2 {font-size:20px; font-weight:600; color:#fff; margin:0 0 4px;}
header .header-shop-menu .shop-body .shop-body-cate ul li a {padding:8px 12px; font-size:16px; font-weight:500; color:#fff; display:flex; flex-wrap:wrap; align-items:center;}
header .header-shop-menu .shop-body .shop-body-btn {display:flex; flex-wrap:wrap; align-items:center; border-top:1px solid #999; margin:24px 0 0; padding:24px 12px 0;}
header .header-shop-menu .shop-body .shop-body-btn a {border:1px solid #A6ABB3; border-radius:8px; height:33px; font-weight:600; color:#fff; margin:0 8px 0 0; flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
header .header-shop-menu .shop-body .shop-body-btn a:last-of-type {margin:0;}
header .header-main {background:url('../images/bg_main_header.png') no-repeat right top / cover; margin:0; padding:24px 20px 80px; border-radius:0 0 40px 40px;}
header .header-main .main-top {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; margin:0 0 40px;}
header .header-main .main-top h1 a img {width:111px;}
header .header-main .main-top .download {height:36px; padding:0 20px; border:1px solid rgba(255,255,255,0.5); background:rgba(255,255,255,0.1); font-size:16px; font-weight:bold; color:#fff; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; border-radius:50px; box-shadow:0 4px 4px rgba(0,0,0,0.25);}
header .header-main .main-top .download:after {display:inline-block; content:""; width:16px; height:16px; background:url('../images/icon_download.png') no-repeat center / cover;}
header .header-main .main-text h2 {font-size:24px; font-weight:bold; color:#fff;}
header .header-main .main-text p {font-size:15px; font-weight:600; color:#fff;}
header .header-main .main-text p:last-of-type {margin:8px 0 0;}
header .header-main .main-search {margin:40px 0 0;}
header .header-main .main-search p {margin:0 0 8px; font-size:15px; font-weight:500; color:#fff;}
header.fixed .header-shop-menu {pointer-events:inherit; opacity:1;}
header.fixed .header-shop-menu .box {pointer-events:inherit; opacity:1; left:0;}

/* section */
section {padding:0 0 180px;} /* 위,오른쪽 왼쪽, 아래 padding  padding:0 0 24px;*/

/* footer */
footer {position:fixed; left:50%; bottom:0; background:#fff; width:100%; z-index:1000; max-width:540px; padding:0 20px; transform:translateX(-50%);}
footer .footer-button {padding:24px 0;}
footer .footer-cate {margin:0 -20px; border-top:1px solid #d9d9d9;}
footer .footer-cate ul {display:flex; flex-wrap:wrap;}
footer .footer-cate ul li {flex:1; min-width:0;}
footer .footer-cate ul li a {display:block; padding:12px 0; text-align:center; font-size:12px; color:#A6ABB3;}
footer .footer-cate ul li a:before {display:block; content:""; margin:0 auto 8px; width:24px; height:24px; background-size:cover; background-position:center;}
footer .footer-cate ul li.active a {font-weight:bold; color:#4C89ED;}
footer .footer-cate ul li.home a:before {background-image:url('../images/icon_footer_cate_01.png');}
footer .footer-cate ul li.search a:before {background-image:url('../images/icon_footer_cate_02.png');}
footer .footer-cate ul li.message a:before {background-image:url('../images/icon_footer_cate_03.png');}
footer .footer-cate ul li.company a:before {background-image:url('../images/icon_footer_cate_04.png');}
footer .footer-cate ul li.mypage a:before {background-image:url('../images/icon_footer_cate_05.png');}
footer .footer-cate ul li.home.active a:before {background-image:url('../images/icon_footer_cate_on_01.png');}
footer .footer-cate ul li.search.active a:before {background-image:url('../images/icon_footer_cate_on_02.png');}
footer .footer-cate ul li.message.active a:before {background-image:url('../images/icon_footer_cate_on_03.png');}
footer .footer-cate ul li.company.active a:before {background-image:url('../images/icon_footer_cate_on_04.png');}
footer .footer-cate ul li.mypage.active a:before {background-image:url('../images/icon_footer_cate_on_05.png');}
footer .footer-price {padding:18px; margin:0 -20px; border:1px solid #E1E1E1; border-width:1px 1px 0 1px; border-radius:8px 8px 0 0; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
footer .footer-price b {font-size:16px; font-weight:600; color:#666;}
footer .footer-price p {display:flex; flex-wrap:wrap; align-items:baseline; font-size:20px; font-weight:500; color:#4880EE;}
footer .footer-price p em {margin:0 0 0 4px; font-size:16px; font-weight:500; color:#4880EE;}
footer .footer-shop {margin:0 -20px; position:relative; padding:18px; border:1px solid #e1e1e1; border-width:1px 1px 0 1px; border-radius:8px 8px 0 0; position:relative;}
footer .footer-shop .toggle {font-size:0; position:absolute; left:50%; top:-17px; width:42px; height:24px; transform:translateX(-50%); content:""; background:url('../images/icon_footer_shop.png') no-repeat center / cover;}
footer .footer-shop .shop-top {border-bottom:1px solid #d9d9d9; padding:0 0 12px; margin:0 0 12px; display:none;}
footer .footer-shop .shop-top .shop-top-option ul li {margin:0 0 12px; display:flex; flex-wrap:wrap; align-items:center;}
footer .footer-shop .shop-top .shop-top-option ul li:last-of-type {margin:0;}
footer .footer-shop .shop-top .shop-top-option ul li > strong {width:90px; font-size:16px; font-weight:600; color:#666;}
footer .footer-shop .shop-top .shop-top-option ul li > div {flex:1; min-width:0;}
footer .footer-shop .shop-top .shop-top-option ul li > div p {font-size:16px; font-weight:bold; color:#666; text-align:right;}
footer .footer-shop .shop-bottom .shop-bottom-total {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; margin:0 0 12px;}
footer .footer-shop .shop-bottom .shop-bottom-total b {font-size:16px; font-weight:600; color:#666;}
footer .footer-shop .shop-bottom .shop-bottom-total p {font-size:16px; font-weight:500;}
footer .footer-shop .shop-bottom .shop-bottom-total p em {font-size:16px; font-weight:600;}
footer .footer-shop.active .toggle {background-image:url('../images/icon_footer_shop_on.png');}
footer .footer-shop.active .shop-top {display:block;}

/* color */
.ft-active {color:#5B88ED !important;}

/* main-box */
.main-box {padding:45px 0 0;}
.main-box .main-logo {margin:0 0 24px;}
.main-box .main-logo h1 img {display:block; margin:0 auto; width:100%; max-width:297px;}
.main-box .main-logo h2 {text-align:center; margin:24px 0 0; font-size:18px; font-weight:600; color:#fff;}

/* main-tab-box */
.main-tab-box {position:relative; margin:-28px 0 24px;}
.main-tab-box ul {display:flex; flex-wrap:wrap; align-items:Center; border-radius:50px; background:#fff; padding:4px; border:1px solid #ddd;} 
.main-tab-box ul li {flex:1; min-width:0;}
.main-tab-box ul li a {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; border-radius:50px; height:40px; font-size:16px; font-weight:600;}
.main-tab-box ul li.active a {background:#4880EE; color:#fff;}

/* main-tab-content-box */
.main-tab-content-box .content {display:none;}
.main-tab-content-box .content.active {display:block;}

/* main-cate-box */
.main-cate-box ul {display:flex; flex-wrap:wrap; margin:0 -6px -12px;}
.main-cate-box ul li {width:calc(50% - 12px); margin:0 6px 12px;}
.main-cate-box ul li a {display:block;}
.main-cate-box ul li a img {position:relative; z-index:3; display:block; margin:0 auto; width:calc(100% - 10px);}
.main-cate-box ul li a div {margin:-40% 0 0; position:relative; border-radius:8px; box-shadow:0 4px 10px rgba(0,0,0,0.2);}
.main-cate-box ul li a div:after {display:block; content:""; padding-bottom:75%;}
.main-cate-box ul li a div p {position:absolute; left:0; bottom:0; width:100%; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; padding:10px 12px; font-size:16px; font-weight:600;}
.main-cate-box ul li a div p:after {display:inline-block; content:""; width:16px; height:16px; background:url('../images/icon_main_cate_more.png') no-repeat center / cover;}
.main-cate-box ul li:nth-of-type(1) a div {background:#C8D4FC;}
.main-cate-box ul li:nth-of-type(2) a div {background:#FFF1B4;}
.main-cate-box ul li:nth-of-type(3) a div {background:#E2E9F3;}
.main-cate-box ul li:nth-of-type(4) a div {background:#C6F8CD;}
.main-cate-box ul li:nth-of-type(5) a div {background:#FFE5CC;}
.main-cate-box ul li:nth-of-type(6) a div {background:#FEEFDC;}

/* main-ceo-box */
.main-ceo-box ul {display:flex; flex-wrap:wrap; margin:0 -6px -12px;}
.main-ceo-box ul li {width:calc(50% - 12px); margin:0 6px 12px;}
.main-ceo-box ul li a {display:block;}
.main-ceo-box ul li a .list-image {background-size:cover; background-position:center; border-radius:8px; box-shadow:0 4px 10px rgba(0,0,0,0.2);}
.main-ceo-box ul li a .list-image:after {display:block; content:""; padding-bottom:100%;}
.main-ceo-box ul li a .list-content {margin:4px 0 0; display:flex; flex-wrap:wrap; align-items:center; border-radius:8px; box-shadow:0 4px 10px rgba(0,0,0,0.2); padding:10px 12px;}
.main-ceo-box ul li a .list-content img {width:24px; height:24px; border-radius:50%; object-fit:cover;}
.main-ceo-box ul li a .list-content p {flex:1; min-width:0; padding:0 0 0 4px; font-size:14px; font-weight:600;}

/* main-sns-box */
.main-sns-box {margin:42px -20px 0; background:#F5FFFD; border:1px solid #CEEAFF; border-width:1px 0; padding:24px 20px;}
.main-sns-box h2 {text-align:center; font-size:18px; font-weight:600; margin:0 0 12px;}
.main-sns-box ul {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; margin:0 0 12px;}
.main-sns-box ul li {width:42px; margin:0 24px 0 0;}
.main-sns-box ul li:last-of-type {margin:0;}
.main-sns-box ul li a {display:block; width:100%; height:42px; font-size:0; background-size:cover; background-position:center;}
.main-sns-box ul li:nth-of-type(1) a {background-image:url('../images/icon_check_list_tictok.png');}
.main-sns-box ul li:nth-of-type(2) a {background-image:url('../images/icon_check_list_thread.png');}
.main-sns-box ul li:nth-of-type(3) a {background-image:url('../images/icon_check_list_youtube.png');}
.main-sns-box ul li:nth-of-type(4) a {background-image:url('../images/icon_check_list_instagram.png');}

/* main-link-box */
.main-link-box ul li {margin:0 0 24px;}
.main-link-box ul li:last-of-type {margin:0;}
.main-link-box ul li a {border-radius:8px; padding:35px; display:flex; flex-wrap:wrap; align-items:center; background-size:cover; background-position:right center;}
.main-link-box ul li a p {display:flex; flex-wrap:wrap; align-items:center; font-size:16px; font-weight:bold; color:#fff;}
.main-link-box ul li a p:before {display:inline-block; content:""; width:4px; height:4px; margin:0 7px 0 0; border-radius:50%; background:rgba(255,255,255,0.7);}
.main-link-box ul li:nth-of-type(1) a {background-image:url('../images/bg_main_link_01.png');}
.main-link-box ul li:nth-of-type(2) a {background-image:url('../images/bg_main_link_02.png');}
.main-link-box ul li:nth-of-type(3) a {background-image:url('../images/bg_main_link_03.png');}
.main-link-box ul li:nth-of-type(4) a {background-image:url('../images/bg_main_link_04.png');}

/* main-rank-box */
.main-rank-box ul {display:block; overflow-x:auto; overflow-y:hidden; white-space:nowrap; padding:12px 0; margin:0 -20px;}
.main-rank-box ul li {display:inline-block; margin-right:-4%;}
.main-rank-box ul li:first-of-type {margin-left:10px;}
.main-rank-box ul li:last-of-type {margin-right:calc(20px - 10%);}
.main-rank-box ul li a {display:flex; flex-wrap:wrap; align-items:flex-end;}
.main-rank-box ul li strong {font-size:128px; font-weight:600; color:transparent; -webkit-text-stroke:1px #a0a0a0; display:flex; flex-wrap:wrap; align-items:flex-end; height:153px;}
.main-rank-box ul li .list-image {margin:0 0 0 -10%; width:107px; height:153px; border-radius:8px; background-size:cover; background-position:center; position:relative; overflow:hidden;}
.main-rank-box ul li .list-image:after {position:absolute; left:0; top:0; width:100%; height:100%; content:""; background:linear-gradient(to bottom, transparent, #000 150%);}

/* more-box */
.more-box a {display:flex; flex-wrap:wrap; align-items:center; font-size:12px;}
.more-box a:after {display:inline-block; content:""; width:16px; height:16px; background:url('../images/icon_more.png') no-repeat center / cover;}

/* title-box */
.title-box {margin:0 0 24px;}
.title-box h2 {font-size:18px; font-weight:600; color:#5b5a5d;}
.title-box h2 b {font-size:18px; font-weight:bold; color:#5b5a5d;}
.title-box p {font-size:14px; font-weight:500; color:#b5b5b5; margin:12px 0 0;}

/* text-box */
.text-box p {font-size:14px; font-weight:500; color:#5b5a5d;}
.text-box p b {font-size:14px; font-weight:600; color:#4377E9;}
.text-box p.lg {font-size:16px;}
.text-box p.lg b {font-size:16px;}

/* message-box */
.message-box p {font-size:14px; color:#ff0000;}

/* line-box */
.line-box {width:100%; height:1px; background:#d9d9d9; margin:24px 0;}

/* cookie-box */
.cookie-box {display:none; pointer-events:inherit; opacity:1; position:fixed; left:50%; top:0; width:100%; height:100%; max-width:540px; transform:translateX(-50%); z-index:9999; transition:all ease 0.5s; background:rgba(0,0,0,0.6);}
.cookie-box .box {pointer-events:inherit; opacity:1; transition:all ease 0.5s; position:absolute; left:50%; top:50%; width:calc(100% - 40px); transform:translate(-50%,-50%); background:#fff; border-radius:8px; overflow-x:hidden; overflow-y:auto;}
.cookie-box .box .list-head {position:absolute; right:12px; top:12px; z-index:100;}
.cookie-box .box .list-head a {display:block; font-size:0; width:44px; height:44px; background:url('../images/icon_cookie_close.png') no-repeat center / cover;}
.cookie-box .box .list-body img {width:100%;}
.cookie-box .box .list-foot {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.cookie-box .box .list-foot a {padding:10px 20px; font-size:14px; font-weight:500; color:#a0a0a0;}
.cookie-box .box .list-foot a.close {color:#5b5a5d;}
.cookie-box.show {display:block;}
.cookie-box.off {pointer-events:none; opacity:0; display:none;}
.cookie-box.off .box {pointer-events:none; opacity:0; top:45%;}
.cookie-box.today {display:none !important;}

/* button-box */
.button-box {display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.button-box .btn {border-radius:10px; height:48px; font-size:16px; font-weight:600; flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.button-box .btn.sm {border-radius:8px; height:38px; font-size:14px; font-weight:400;}
.button-box .btn.map:before {display:inline-block; content:""; width:24px; height:24px; margin:0 10px 0 0; background:url('../images/icon_map.png') no-repeat center / cover;}
.button-box .btn-active {background:#4C89ED; color:#fff;}
.button-box .btn-bd-active {border:1px solid #4C89ED; color:#4C89ED; background:#fff;}
.button-box .btn-gray {background:#5B5A5D; color:#fff;}
.button-box .btn-kakao {background:#FFE812; color:#000;}
.button-box .btn-kakao:before {display:inline-block; content:""; width:24px; height:24px; margin:0 3px 0 0; background:url('../images/icon_btn_kakao.png') no-repeat center / cover;}
.button-box .btn.disabled {background:#A6ABB3;}

/* login-button-box */
.login-button-box {display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.login-button-box p {font-size:14px; font-weight:500; color:#5b5a5d; margin:0 12px 0 0;}
.login-button-box a {font-size:14px; font-weight:600; color:#3F74E8; text-decoration:underline;}

/* input-box */
.input-box {transition:all ease 0.5s; display:flex; flex-wrap:wrap; align-items:center; border-radius:8px; border:1px solid #e1e1e1; overflow:hidden; background:#fff;}
.input-box input {flex:1; min-width:0; height:38px; padding:0 18px; font-size:14px; color:#5b5a5d;}
.input-box input::placeholder {color:#B5B5B5;}
.input-box .search {display:block; font-size:0; width:16px; height:16px; background:url('../images/icon_search.png') no-repeat center / cover; margin:0 18px 0 0;}
.input-box.search-input {border-radius:50px;}
.input-box.active {border-color:#0085FF;}
.input-box.active.shop {border-color:#FF8383;}

/* category-box */
.category-box ul {margin:0 -20px; display:block; overflow-x:auto; white-space:nowrap;}
.category-box ul::-webkit-scrollbar {display:none;}
.category-box ul li {display:inline-block; margin:0 3px 0 0;}
.category-box ul li:first-of-type {margin-left:20px;}
.category-box ul li:last-of-type {margin-right:20px;}
.category-box ul li a {background:#F8F8F8; border:1px solid #CEEAFF; font-size:13px; padding:5px 15px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; border-radius:50px;}

/* date-box */
.date-box {display:flex; flex-wrap:wrap; align-items:center;}
.date-box .date {flex:1; min-width:0; position:relative; display:flex; flex-wrap:wrap; align-items:center; overflow:hidden; border:1px solid #e1e1e1; background:#fff; border-radius:8px;}
.date-box .date:after {display:inline-block; content:""; width:16px; height:16px; background:url('../images/icon_date.png') no-repeat center / cover; margin:0 8px 0 0;}
.date-box .date input {background:#fff; line-height:38px; color:#000; flex:1; min-width:0; display:block; height:38px; padding:0 10px; font-size:14px;}
.date-box .date input::-webkit-calendar-picker-indicator {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer; z-index:3;}
.date-box em {margin:0 10px; font-size:14px;}

/* select-box */
.select-box {display:flex; flex-wrap:wrap; align-items:center; border-radius:8px; border:1px solid #e1e1e1; overflow:hidden;}
.select-box select {flex:1; min-width:0; height:38px; padding:0 38px 0 18px; font-size:14px; color:#5b5a5d; background:url('../images/icon_select.png') no-repeat calc(100% - 18px) center / 24px;}

/* agree-box */
.agree-box {height:120px; border-radius:8px; border:1px solid #e1e1e1; padding:18px; overflow-y:auto;}
.agree-box p {font-size:12px; color:#b5b5b5; margin:0 0 12px;}
.agree-box p:last-of-type {margin:0;}

/* textarea-box */
.textarea-box textarea {display:block; width:100%; border:1px solid #e1e1e1; border-radius:8px; padding:18px; height:140px; font-size:14px;}
.textarea-box textarea::placeholder {color:#b5b5b5;}

/* request-box */
.request-box {background:#F8F8F8; border:1px solid #ddd; border-radius:8px; padding:12px;}
.request-box strong {display:block; font-size:14px; font-weight:500;}
.request-box p {margin:8px 0 0; font-size:14px; font-weight:300;}

/* check-box */
.check-box {position:relative; overflow:hidden;}
.check-box input {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.check-box label {display:flex; flex-wrap:wrap; align-items:center; font-size:14px; font-weight:500; color:#5b5a5d;}
.check-box label:before {display:inline-block; content:""; width:20px; height:20px; margin:0 8px 0 0; background:url('../images/icon_check.png') no-repeat center / cover;}
.check-box input:checked ~ label:before {background-image:url('../images/icon_check_on.png');}

/* upload-box */
.upload-box {margin:0 0 12px;}
.upload-box:last-of-type {margin:0;}
.upload-box ul {display:flex; flex-wrap:wrap;}
.upload-box ul li {flex:1; min-width:0; position:relative; margin:0 10px 0 0;}
.upload-box ul li:last-of-type {margin:0;}
.upload-box ul li input {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.upload-box ul li label {position:relative; cursor:pointer; display:block; background:#f8f8f8; border:1px dashed #d9d9d9; border-radius:8px;}
.upload-box ul li label:after {display:block; content:""; padding-bottom:50%;} /* padding-bottom높이지정 */
.upload-box ul li label p {font-size:14px; font-weight:500; color:#5b5a5d; position:absolute; left:0; top:0; width:100%; height:100%; display:flex; flex-wrap:wrap; align-items:center; align-content:center; justify-content:center;}
.upload-box ul li label p:before {display:block; content:""; width:100%; height:32px; margin:0 0 3px; background-size:32px auto; background-position:center; background-repeat:no-repeat;}
.upload-box ul li.photo label p:before {background-image:url('../images/icon_upload_photo.png');}
.upload-box ul li.gallery label p:before {background-image:url('../images/icon_upload_gallery.png');}
.upload-box dl {display:block; margin:12px -20px 0; overflow-x:auto; white-space:nowrap;}
.upload-box dl dd {display:inline-block; margin:0 12px 0 0; width:137px; height:108px; border-radius:8px; background-size:cover; background-position:center; position:relative;}
.upload-box dl dd:first-of-type {margin-left:20px;}
.upload-box dl dd:last-of-type {margin-right:20px;}
.upload-box dl dd .delete {position:absolute; right:4px; top:4px; width:12px; height:12px; font-size:0; background:url('../images/icon_upload_delete.png') no-repeat center / cover;}

/* link-box */
.link-box {margin:24px 0 0;}
.link-box ul {display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.link-box ul li {display:flex; flex-wrap:wrap; align-items:center;}
.link-box ul li:after {display:inline-block; content:""; width:1px; height:10px; background:#d9d9d9; margin:0 12px;}
.link-box ul li:last-of-type:after {display:none;}
.link-box ul li a {font-size:14px; font-weight:500; color:#5b5a5d;}

/* certificate-box */
.certificate-box {margin:24px 0 0; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.certificate-box a {font-size:14px; font-weight:500; color:#5b5a5d; text-decoration:underline;}
.certificate-box time {font-size:14px; color:#FF0000;}

/* write-box */
.write-box ul li {margin:0 0 12px;}
.write-box ul li:last-of-type {margin:0;}
.write-box ul li > strong {display:block; margin:0 0 2px; font-size:14px; color:#5b5a5d;}

/* map-box */
.map-box .map {position:relative; overflow:hidden;}
.map-box .map:after {display:block; content:""; padding-bottom:100%;}
.map-box .map iframe {position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover;}
.map-box .text {margin:4px 0 0;}
.map-box .text strong {display:block; font-size:14px; color:#5b5a5d;}
.map-box .text .text-inner {display:flex; flex-wrap:wrap;}
.map-box .text .text-inner > b {margin:0 15px 0 0; font-size:12px;}
.map-box .text .text-inner > div {flex:1; min-width:0;}
.map-box .text .text-inner > div p {font-size:12px;}

/* check-list-box */
.check-list-box ul li {margin:0 0 12px; display:flex; flex-wrap:wrap; align-items:center;}
.check-list-box ul li:last-of-type {margin:0;}
.check-list-box ul li:after {display:block; content:""; width:38px; height:38px; border-radius:8px; border:1px solid #e1e1e1; margin:0 0 0 4px;}
.check-list-box ul li .check-box {width:39px; height:38px; margin:0 8px 0 0;}
.check-list-box ul li .check-box label {width:100%; height:100%;}
.check-list-box ul li .check-box label:before {width:100%; height:100%; margin:0;}
.check-list-box ul li .check-box label p {font-size:0; flex:none;}
.check-list-box ul li .check-box input:checked ~ label:before {background-image:url('../images/icon_check_on2.png');}
.check-list-box ul li.share:after {background:url('../images/icon_check_list_share.png') no-repeat center / 24px;}
.check-list-box ul li.call:after {background:url('../images/icon_check_list_call.png') no-repeat center / 24px;}
.check-list-box ul li.location:after {background:url('../images/icon_check_list_location.png') no-repeat center / 24px;}
.check-list-box ul li.address:after {background:url('../images/icon_check_list_address.png') no-repeat center / 24px;}
.check-list-box ul li.shop:after {background:url('../images/icon_check_list_shop.png') no-repeat center / 24px;}
.check-list-box ul li.share:after {background:url('../images/icon_check_list_share.png') no-repeat center / 24px;}
.check-list-box ul li.email:after {background:url('../images/icon_check_list_email.png') no-repeat center / 24px;}
.check-list-box ul li.youtube:after {background:url('../images/icon_check_list_youtube.png') no-repeat center / cover; border:0;}
.check-list-box ul li.instagram:after {background:url('../images/icon_check_list_instagram.png') no-repeat center / cover; border:0;}
.check-list-box ul li.thread:after {background:url('../images/icon_check_list_thread.png') no-repeat center / cover; border:0;}
.check-list-box ul li.tictok:after {background:url('../images/icon_check_list_tictok.png') no-repeat center / cover; border:0;}
.check-list-box ul li.kakao:after {background:url('../images/icon_check_list_kakao.png') no-repeat center / cover; border:0;}
.check-list-box ul li.baemin:after {background:url('../images/icon_check_list_baemin.png') no-repeat center / cover; border:0;}
.check-list-box ul li.yogiyo:after {background:url('../images/icon_check_list_yogiyo.png') no-repeat center / cover; border:0;}
.check-list-box ul li.ddyo:after {background:url('../images/icon_check_list_ddyo.png') no-repeat center / cover; border:0;}

/* check-color-box */
.check-color-box ul {display:flex; flex-wrap:wrap; margin:12px -5px -10px;}
.check-color-box ul li {position:relative; width:calc(50% - 10px); margin:0 5px 10px;}
.check-color-box ul li input {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.check-color-box ul li label {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; padding:12px; font-size:14px; font-weight:600; background:#fff; border:1px solid #ddd; border-radius:8px; box-shadow:0 4px 10px rgba(0,0,0,0.2);}
.check-color-box ul li label img {width:24px; height:24px; object-fit:cover;}
.check-color-box ul li input:checked ~ label {border-color:#4C89ED; color:#4C89ED;}

/* cate-list-box */
.cate-list-box ul {display:flex; flex-wrap:wrap; margin:0 -5px -10px;}
.cate-list-box ul li {width:calc(50% - 10px); margin:0 5px 10px;}
.cate-list-box ul li a {display:flex; flex-wrap:wrap; align-items:center; padding:12px; background:#fff; border:1px solid #ddd; border-radius:8px; box-shadow:0 4px 10px rgba(0,0,0,0.2);}
.cate-list-box ul li a p {flex:1; min-width:0; padding:0 12px 0 0; font-size:14px; font-weight:600;}
.cate-list-box ul li a img {width:24px; height:24px; object-fit:cover;}
.cate-list-box ul li small {display:block; text-align:right; margin:4px 0 0; font-size:8px; font-weight:600; color:#0081C2;}
.cate-list-box ul li small.red {color:#FF0000;}

/* table-box */
.table-box table thead tr th {height:38px; font-size:14px; font-weight:600; color:#141567; background:#F5F5F5; border:1px solid #ddd; border-width:1px 1px 1px 0;}
.table-box table thead tr th:last-of-type {border-right:0;}
.table-box table thead tr th small {font-size:11px; color:#141567; font-weight:300; position:relative; top:3px;}
.table-box table tbody tr td {border:1px solid #ddd; border-width:0 1px 1px 0; padding:12px 5px; font-size:14px; font-weight:500;}
.table-box table tbody tr td:last-of-type {border-right:0;}
.table-box table tbody tr td.gr {background:#FBFBFB;}
.table-box table tbody tr th {border:1px solid #ddd; border-width:0 1px 1px 0; padding:12px 5px; font-size:14px; font-weight:500; background:#F5F5F5;}

/* total-box */
.total-box p {font-size:16px; font-weight:500;}
.total-box p b {font-size:16px; font-weight:700; color:#4377E9;}

/* list-box */
.list-box ul {display:block; overflow-x:auto; white-space:nowrap; margin:0 -20px;}
.list-box ul::-webkit-scrollbar {display:none;}
.list-box ul li {display:inline-block; width:107px; margin:0 5px 0 0;}
.list-box ul li:first-of-type {margin-left:20px;}
.list-box ul li:last-of-type {margin-right:20px;}
.list-box ul li a {display:block; height:153px; border-radius:8px; background-size:cover; background-position:center; box-shadow:0 4px 20px rgba(0,0,0,0.2);}

/* company-box */
.company-box ul {display:flex; flex-wrap:wrap; margin:0 -6px -12px;}
.company-box ul li {width:calc(50% - 12px); margin:0 6px 12px;}
.company-box ul li a {display:block;}
.company-box ul li a .list-image {border-radius:8px; background-size:cover; background-position:center; box-shadow:0 4px 20px rgba(0,0,0,0.2);}
.company-box ul li a .list-image:after {display:block; content:""; padding-bottom:140%;}
.company-box ul li a .list-content {margin:8px 0 0;}
.company-box ul li a .list-content p {text-align:center; font-size:18px; font-weight:500;}

/* advertise-box */
.advertise-box ul {display:block; overflow-x:auto; white-space:nowrap; margin:0 -20px; padding:12px 0;}
.advertise-box ul li {width:160px; display:inline-block; margin:0 6px 0 0;}
.advertise-box ul li:first-of-type {margin-left:20px;}
.advertise-box ul li:last-of-type {margin-right:20px;}
.advertise-box ul li a {display:block; border-radius:8px; background-size:cover; background-position:center; box-shadow:0 4px 20px rgba(0,0,0,0.2);}
.advertise-box ul li a:after {display:block; content:""; padding-bottom:140%;}

/* banner-box */
.banner-box {margin:0 -20px;}
.banner-box .swiper-slide {width:287px;}
.banner-box .swiper-slide a {padding:12px; display:flex; flex-wrap:wrap; align-items:center; background:#E0E5FF; border-radius:8px; box-shadow:0 4px 10px rgba(0,0,0,0.2);}
.banner-box .swiper-slide a .list-image {width:104px; background-size:cover; background-position:center; border-radius:8px;}
.banner-box .swiper-slide a .list-image:after {display:block; content:""; padding-bottom:100%;}
.banner-box .swiper-slide a .list-content {flex:1; min-width:0; padding:0 0 0 12px;}
.banner-box .swiper-slide a .list-content b {font-size:16px; font-weight:600;}
.banner-box .swiper-slide a .list-content p {margin:4px 0 0; font-size:14px; color:#666;}
.banner-box .swiper-container {padding-top:12px; padding-bottom:12px;}
.banner-box .swiper-pagination {position:static; margin:12px 0 0; width:100%;}
.banner-box .swiper-pagination span {width:25px; height:4px; background:#b5b5b5; border-radius:2px; transition:all ease 0.5s; margin:0 2px;}
.banner-box .swiper-pagination span.swiper-pagination-bullet-active {background:#5B5A5D;}

/* banner-swiper-box */
.banner-swiper-box {margin:0 -20px;}
.banner-swiper-box .swiper-slide a {display:block;}
.banner-swiper-box .swiper-slide img {width:100%; border-radius:8px; box-shadow:0 4px 10px rgba(0,0,0,0.2);}
.banner-swiper-box .swiper-container {padding-top:12px; padding-bottom:12px;}

/* banner-swiper-big-box */
.banner-swiper-big-box {margin:0 -20px 0 0;}
.banner-swiper-big-box .swiper-slide a {display:block;}
.banner-swiper-big-box .swiper-slide img {width:100%; border-radius:8px; box-shadow:0 4px 10px rgba(0,0,0,0.2);}
.banner-swiper-big-box .swiper-container {padding-top:12px; padding-bottom:12px;}

/* banner-image-box */
.banner-image-box a {display:block;}
.banner-image-box img {width:100%; border-radius:8px; box-shadow:0 4px 10px rgba(0,0,0,0.2);}
.banner-image-box.full {margin:0 -20px;}

/* banner-full-box */
.banner-full-box {margin:0 -20px; box-shadow:0 4px 10px rgba(0,0,0,0.2); border-radius:8px;}
.banner-full-box a {display:block;}
.banner-full-box img {width:100%; border-radius:8px;}
.banner-full-box .swiper-pagination {padding:4px 12px; background:rgba(255,255,255,0.4); width:auto; left:50%; transform:translateX(-50%); display:flex; flex-wrap:wrap; align-items:center; justify-content:center; border-radius:50px;}
.banner-full-box .swiper-pagination span {width:10px; height:10px; background:#d9d9d9; opacity:1;}
.banner-full-box .swiper-pagination span.swiper-pagination-bullet-active {background:#4C89ED;}

/* product-image-box */
.product-image-box {margin:0 -20px;}
.product-image-box img {width:100%;}
.product-image-box .swiper-pagination {position:static; margin:12px 0 0; width:100%;}
.product-image-box .swiper-pagination span {width:25px; height:4px; background:#b5b5b5; border-radius:2px; transition:all ease 0.5s; margin:0 2px;}
.product-image-box .swiper-pagination span.swiper-pagination-bullet-active {background:#5B5A5D;}

/* person-box */
.person-box ul li {margin:0 0 25px;}
.person-box ul li:last-of-type {margin:0;}
.person-box ul li .list-head {background-size:cover; background-position:center; position:relative; display:flex; flex-wrap:wrap; align-items:center; padding:20px 12px; border:1px solid #d9d9d9; border-bottom:0;}
.person-box ul li .list-head:before {position:absolute; content:""; left:0; top:0; width:100%; height:100%; background:linear-gradient(to bottom, transparent, #000);}
.person-box ul li .list-head img {width:40px; height:40px; object-fit:cover; position:relative;}
.person-box ul li .list-head p {flex:1; min-width:0; padding:0 0 0 10px; font-size:16px; font-weight:600; color:#fff; position:relative;}
.person-box ul li .list-head .list-head-button {position:relative; margin:0 0 0 10px; width:72px;}
.person-box ul li .list-head .list-head-button a {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; margin:0 0 5px; height:22px; border-radius:4px; font-size:12px; font-weight:600; color:#fff;}
.person-box ul li .list-head .list-head-button a:last-of-type {margin:0;}
.person-box ul li .list-head .list-head-button a.remove {background:#FF8800;}
.person-box ul li .list-head .list-head-button a.add {background:#A6ABB3;}
.person-box ul li .list-body {background:#F8F8F8; padding:20px 12px; border:1px solid #d9d9d9;}
.person-box ul li .list-body .list-body-profile {display:flex; flex-wrap:wrap; align-items:center; padding:0 12px 12px; border-bottom:1px solid #d9d9d9;}
.person-box ul li .list-body .list-body-profile img {width:74px; border:1px solid #d9d9d9;}
.person-box ul li .list-body .list-body-profile div {flex:1; min-width:0; padding:0 0 0 12px;}
.person-box ul li .list-body .list-body-profile div strong {display:block; font-size:16px; font-weight:600;}
.person-box ul li .list-body .list-body-profile div dl dd {margin:3px 0 0; display:flex; flex-wrap:wrap; align-items:center;}
.person-box ul li .list-body .list-body-profile div dl dd b {display:flex; flex-wrap:wrap; align-items:center; font-size:14px; color:#666;}
.person-box ul li .list-body .list-body-profile div dl dd b:after {display:inline-block; content:""; width:1px; height:8px; background:#d9d9d9; margin:0 4px;}
.person-box ul li .list-body .list-body-profile div dl dd p {font-size:14px;}
.person-box ul li .list-body .list-body-info {padding:12px;}
.person-box ul li .list-body .list-body-info dl dd {margin:0 0 4px; display:flex; flex-wrap:wrap; align-items:center;}
.person-box ul li .list-body .list-body-info dl dd b {display:flex; flex-wrap:wrap; align-items:center; font-size:14px; color:#666;}
.person-box ul li .list-body .list-body-info dl dd b:after {display:inline-block; content:""; width:1px; height:8px; background:#d9d9d9; margin:0 4px;}
.person-box ul li .list-body .list-body-info dl dd p {font-size:14px; font-weight:600;}
.person-box ul li .list-body .list-body-history dl {display:flex; flex-wrap:wrap; margin:0 -4px -8px;}
.person-box ul li .list-body .list-body-history dl dd {display:flex; flex-wrap:wrap; align-items:center; padding:4px; width:calc(50% - 8px); margin:0 4px 8px;}
.person-box ul li .list-body .list-body-history dl dd div {flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:center; padding:0 4px 0 0;}
.person-box ul li .list-body .list-body-history dl dd div img {width:20px; height:20px; object-fit:cover; margin:0 4px 0 0;}
.person-box ul li .list-body .list-body-history dl dd div p {flex:1; min-width:0; font-weight:600; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.person-box ul li .list-body .list-body-history dl dd strong {padding:0 12px; height:21px; font-weight:600; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; background:#fff; border-radius:50px;}
.person-box ul li .list-body .list-body-button {margin:12px 0 0;}
.person-box ul li .list-body .list-body-button .btn {border-radius:0;}
.person-box ul li .list-foot {margin:8px 0 0;}
.person-box ul li .list-foot dl {display:flex; flex-wrap:wrap;}
.person-box ul li .list-foot dl dd {flex:1; min-width:0; margin:0 12px 0 0;}
.person-box ul li .list-foot dl dd:last-of-type {margin:0;}
.person-box ul li .list-foot dl dd a {display:block; border:1px solid; border-radius:8px; padding:6px;}
.person-box ul li .list-foot dl dd a:before {display:block; margin:0 auto; width:24px; height:24px; background-size:cover; background-position:center; content:"";}
.person-box ul li .list-foot dl dd a p {text-align:center; font-size:12px;}
.person-box ul li .list-foot dl dd:nth-of-type(1) a {border-color:#00AE14;}
.person-box ul li .list-foot dl dd:nth-of-type(2) a {border-color:#FFE812;}
.person-box ul li .list-foot dl dd:nth-of-type(3) a {border-color:#5B88ED;}
.person-box ul li .list-foot dl dd:nth-of-type(4) a {border-color:#FF8800;}
.person-box ul li .list-foot dl dd:nth-of-type(1) a:before {background-image:url('../images/icon_person_btn_01.png');}
.person-box ul li .list-foot dl dd:nth-of-type(2) a:before {background-image:url('../images/icon_person_btn_02.png');}
.person-box ul li .list-foot dl dd:nth-of-type(3) a:before {background-image:url('../images/icon_person_btn_03.png');}
.person-box ul li .list-foot dl dd:nth-of-type(4) a:before {background-image:url('../images/icon_person_btn_04.png');}

.map-search-box {position:relative; margin:0 -20px;}
.map-search-box .map-iframe {position:relative; width:100%; height:100%; object-fit:cover;}
.map-search-box .map-iframe iframe {position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover;}
.map-search-box .map-iframe .map-iframe-pin {position:absolute; width:24px; height:24px; background:url('../images/icon_map_pin.png') no-repeat center / cover;}
.map-search-box .map-iframe .map-iframe-position {position:absolute; width:15px; height:21px; background:url('../images/icon_map_position.png') no-repeat center / cover;}
.map-search-box .map-top {position:absolute; left:0; top:0; padding:24px 20px 0; z-index:20; width:100%;}
.map-search-box .map-bottom {pointer-events:none; opacity:0; position:absolute; left:0; top:67px; width:100%; height:calc(100% - 67px); z-index:9999; transition:all ease 0.2s;}
.map-search-box .map-bottom .inner {position:absolute; left:0; bottom:-30px; width:100%; height:50%; overflow-x:hidden; overflow-y:hidden; transition:all ease 0.2s; background:#fff; border:1px solid #D9D9D9; border-bottom:0; border-radius:18px 18px 0 0; padding:0 20px 20px;}
.map-search-box .map-bottom .inner:before {display:block; content:""; width:40px; height:3px; background:#b5b5b5; border-radius:2px; margin:12px auto;}
.map-search-box .map-bottom .inner.scroll_on {height:50%; overflow-y:hidden; bottom:0;}
.map-search-box .map-bottom .inner.scroll_down {height:100%; overflow-y:auto; bottom:0;}
.map-search-box.fixed .map-bottom {pointer-events:inherit; opacity:1;}
.map-search-box.fixed .map-bottom .inner {bottom:0;}

/* group-box */
.group-box ul {margin:0 -20px; display:block; overflow-x:auto; white-space:nowrap;}
.group-box ul li {display:inline-block; width:107px; margin:0 5px 0 0;}
.group-box ul li:first-of-type {margin-left:20px;}
.group-box ul li:last-of-type {margin-right:20px;}
.group-box ul li a {display:block; position:relative;}
.group-box ul li a .list-image {height:152px; border-radius:8px; background-size:cover; background-position:center; position:relative; overflow:hidden;}
.group-box ul li a .list-image:after {position:absolute; left:0; top:0; width:100%; height:100%; content:""; background:linear-gradient(to bottom, transparent, #000 120%);}
.group-box ul li a .list-content {position:absolute; left:0; bottom:0; width:100%; padding:7px;}
.group-box ul li a .list-content p {text-align:center; font-size:16px; font-weight:600; color:#fff;}

/* team-box */
.team-box ul {display:flex; flex-wrap:wrap; margin:0 -9px -12px;}
.team-box ul li {width:calc(33.33% - 18px); margin:0 9px 12px;}
.team-box ul li a {display:block;}
.team-box ul li img {width:100%;}
.team-box ul li p {text-align:center; margin:4px 0 0; font-size:14px; font-weight:600;}

/* mypage-box */
.mypage-box {background:#f8f8f8; border:1px solid #d9d9d9; border-radius:8px; padding:24px;}
.mypage-box ul {display:flex; flex-wrap:wrap; margin:0 0 -24px;}
.mypage-box ul li {width:33.33%; margin:0 0 24px;}
.mypage-box ul li a {display:block;}
.mypage-box ul li a p {text-align:center; font-size:14px; font-weight:600;}
.mypage-box ul li a:before {display:block; content:""; width:42px; height:42px; margin:0 auto; background-size:cover; background-position:center;}
.mypage-box ul li.mypage01 a:before {background-image:url('../images/icon_mypage_01.png');}
.mypage-box ul li.mypage02 a:before {background-image:url('../images/icon_mypage_02.png');}
.mypage-box ul li.mypage03 a:before {background-image:url('../images/icon_mypage_03.png');}
.mypage-box ul li.mypage04 a:before {background-image:url('../images/icon_mypage_04.png');}
.mypage-box ul li.mypage05 a:before {background-image:url('../images/icon_mypage_05.png');}
.mypage-box ul li.mypage06 a:before {background-image:url('../images/icon_mypage_06.png');}
.mypage-box ul li.mypage07 a:before {background-image:url('../images/icon_mypage_07.png');}
.mypage-box ul li.mypage08 a:before {background-image:url('../images/icon_mypage_08.png');}

/* product-box */
.product-box {margin:24px 0 0;}
.product-box h2 {font-size:18px; font-weight:500; border-bottom:1px solid #d9d9d9; margin:0 0 24px; padding:0 0 24px;}
.product-box .product-option > ul > li {display:flex; flex-wrap:wrap; align-items:center; margin:0 0 12px;}
.product-box .product-option > ul > li:last-of-type {margin:0;}
.product-box .product-option > ul > li > strong {width:88px; font-size:16px; font-weight:500;}
.product-box .product-option > ul > li > div {flex:1; min-width:0;}
.product-box .product-total {margin:24px 0 0; border:1px solid #d9d9d9; border-radius:8px; padding:20px;}
.product-box .product-total ul li {margin:0 0 8px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.product-box .product-total ul li:last-of-type {margin:12px 0 0; padding:12px 0 0; border-top:1px solid #d9d9d9;}
.product-box .product-total ul li b {color:#666;}
.product-box .product-total ul li p {color:#666; font-weight:500;}
.product-box .product-total dl {margin:8px 0 0;}
.product-box .product-total dl dd {font-size:12px; color:#a0a0a0;}
.product-box .product-image {margin:12px 0 0;}
.product-box .product-image h3 {text-align:center; margin:24px 0 12px; font-size:18px; font-weight:500;}
.product-box .product-image img {width:100%;}
.product-box .product-price {border-bottom:4px solid #F4F3F3; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; margin:4px -20px 0; padding:5px 20px 12px;}
.product-box .product-price span {display:flex; flex-wrap:wrap; align-items:center; height:18px; padding:0 8px; font-size:12px; font-weight:600; color:#fff; background:#ED4C4F; border-radius:2px;}
.product-box .product-price b {font-size:20px; font-weight:bold; color:#4377E9;}

/* color-box */
.color-box {display:flex; flex-wrap:wrap; margin:0 -5px -10px;}
.color-box .color {margin:20px 5px 10px; position:relative;}
.color-box .color input {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.color-box .color label {display:block;}
.color-box .color label div {width:20px; height:20px; margin:0 auto; border-radius:50%;}
.color-box .color label p {font-size:12px; opacity:0; text-align:center;}
.color-box .color input:checked ~ label p {opacity:1;}

/* switch-box */
.switch-box {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; border:1px solid #ddd; border-radius:50px; padding:4px;}
.switch-box a {flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; border-radius:50px; height:30px; font-size:14px;}
.switch-box a.active {background:#4B7FD3; color:#fff;}

/* shop-state-box */
.shop-state-box ul {display:flex; flex-wrap:wrap;}
.shop-state-box ul li {flex:1; min-width:0; margin:0 8px 0 0;}
.shop-state-box ul li:last-of-type {margin:0;}
.shop-state-box ul li a {display:block; border-radius:8px; padding:12px;}
.shop-state-box ul li a p {display:flex; flex-wrap:wrap; align-items:center; font-size:14px; font-weight:600; color:#fff;}
.shop-state-box ul li a p:before {display:inline-block; content:""; margin:0 4px 0 0; width:20px; height:20px; background-size:cover; background-position:center;}
.shop-state-box ul li a strong {display:block; font-size:20px; font-weight:600; color:#fff;}
.shop-state-box ul li:first-of-type a {background:linear-gradient(to right, #00D218, #00AE14);}
.shop-state-box ul li:last-of-type a {background:linear-gradient(to right, #FFBA6C, #FF8800);}
.shop-state-box ul li:first-of-type a p:before {background-image:url('../images/icon_shop_state_01.png');}
.shop-state-box ul li:last-of-type a p:before {background-image:url('../images/icon_shop_state_02.png');}

/* quantity-box */
.quantity-box {border:1px solid #D9D9D9; border-radius:4px; overflow:hidden; display:flex; flex-wrap:wrap; align-items:center;}
.quantity-box a {position:relative; z-index:10; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; width:36px; height:32px; font-size:16px; font-weight:600; color:#A6ABB3;}
.quantity-box input {width:53px; height:32px; border:1px solid #d9d9d9; border-width:0 1px; text-align:center; font-size:16px; font-weight:bold;}

/* item-box */
.item-box ul li {margin:0 0 24px; position:relative;}
.item-box ul li:last-of-type {margin:0;}
.item-box ul li .link {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; font-size:0;}
.item-box ul li .inner {display:flex; flex-wrap:wrap; align-items:center;}
.item-box ul li .inner .list-image {width:120px; border-radius:8px; background-size:cover; background-position:center;}
.item-box ul li .inner .list-image:after {display:block; content:""; padding-bottom:125%;}
.item-box ul li .inner .list-content {flex:1; min-width:0; padding:0 0 0 12px;}
.item-box ul li .inner .list-content strong {display:-webkit-box; font-size:16px; font-weight:500; overflow:hidden; text-overflow:ellipsis; -webkit-box-orient:vertical; -webkit-line-clamp:2; word-break:normal;}
.item-box ul li .inner .list-content .price {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; margin:4px 0 0;}
.item-box ul li .inner .list-content .price span {display:flex; flex-wrap:wrap; align-items:center; height:18px; padding:0 8px; font-size:12px; font-weight:600; color:#fff; background:#ED4C4F; border-radius:2px;}
.item-box ul li .inner .list-content .price b {font-size:20px; font-weight:bold; color:#4377E9;}
.item-box ul li .inner .list-content .button {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; margin:20px 0 0;}
.item-box ul li .inner .list-content .button .cart {position:relative; z-index:10; width:36px; height:32px; font-size:0; background:url('../images/icon_item_cart.png') no-repeat center / cover;}
@media (max-width:340px){
.item-box ul li .inner .list-image {width:90px;}
.item-box ul li .inner .list-content .button {margin:8px 0 0;}
}

/* shop-footer-box */
.shop-footer-box {margin:42px -20px -24px; padding:24px 20px; background:#F5F9F9;}
.shop-footer-box .footer-link {margin:0 0 24px;}
.shop-footer-box .footer-link ul {display:flex; flex-wraP:wrap; align-items:center; justify-content:center;}
.shop-footer-box .footer-link ul li {margin:0 12px 0 0;}
.shop-footer-box .footer-link ul li:last-of-type {margin:0;}
.shop-footer-box .footer-link ul li a {font-size:14px; font-weight:500; color:#323232;}
.shop-footer-box .footer-link ul li:first-of-type a {color:#0085FF;}
.shop-footer-box .footer-info h2 {margin:0 0 12px; text-align:center; font-size:16px; font-weight:600; color:#323232;}
.shop-footer-box .footer-info p {text-align:center; color:#323232;}
.shop-footer-box .footer-copy {margin:24px 0 0;}
.shop-footer-box .footer-copy p {text-align:center; font-size:14px; color:#323232;}
.shop-footer-box .footer-copy p b {font-weight:600; color:#323232;}