@charset "utf-8";
@import url("../fonts/fonts.css");

/******************************************************
	공통 CSS
******************************************************/
* {margin:0; padding:0; border:0; font-size:10px; box-sizing:border-box; font-family: 'SUIT', sans-serif!important; margin-block: 0; outline:none;}

:root {
    --color-white:      #FFFFFF;
    --color-gray-50:    #F9FAFB;
    --color-gray-100:   #F7F8F9;
    --color-gray-200:   #E3E5E8;
    --color-gray-300:   #C9CDD2;
    --color-gray-400:   #9EA4AA;
    --color-gray-500:   #72787F;
    --color-gray-600:   #454C53;
    --color-gray-700:   #26282B;
    --color-gray-800:   #080404;
    --color-black:      #000000;
    --color-action:    #1A3BD1;
    --color-alert:     #FF5452;
}

table {border-collapse:collapse;}
a {text-decoration:none; color:inherit; display:inline;}
a:link,
a:visited {text-decoration:none; color:var(--color-gray-800);}
a:hover {text-decoration:none; color:var(--color-gray-800);}
::-moz-selection {
	background-color: rgba(26,59,209,0.87);
	color: var(--color-white);
}
::selection {
	background-color: rgba(26,59,209,0.87);
	color: var(--color-white);
}

span {display:inline;}
img {vertical-align:middle; border:0;}
ol, ul {list-style:none outside; padding:0;}
p, ol, ul, dl, dt, dd {padding:0; margin:0;}
.btn {border:0; padding:0; border-radius:0; transition:none; text-align:initial; cursor: initial;}

html,body {width:100%;}
html{
	-o-text-size-adjust:none;
	-ms-text-size-adjust:none;
	-moz-text-size-adjust:none;
	-webkit-text-size-adjust:none;
	text-size-adjust:none;
}
body {background-color:var(--color-white); overflow: visible;}

.notScroll {position:fixed; top:0; left:0;}


input[type=text], input[type=email], input[type=tel], input[type=submit], input[type=password], input[type=image], input[type=button], textarea, select { -webkit-border-radius:0; -moz-appearance:none; -webkit-appearance:none; appearance:none;}
input[type=radio], input[type=checkbox] {-webkit-border-radius:0; -moz-appearance:none; appearance:none;}
input::-ms-clear {display: none;}
input:focus {outline:none;}
select:focus {outline:none;}
textarea:focus {outline:none; border-radius:0; box-shadow: 0;}
select::-ms-expand {display:none}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {-webkit-text-fill-color: #000; -webkit-box-shadow: 0 0 0px 1000px var(--color-white) inset; box-shadow: 0 0 0px 1000px var(--color-white) inset; transition: background-color 5000s ease-in-out 0s;}

:focus-visible {outline-color:var(--color-gray-700);}

input::-webkit-input-placeholder,
input::-moz-placeholder,
input:-ms-input-placeholder,
input:-moz-placeholder,
input::placeholder {color:var(--color-gray-200); font-size:1.6rem; font-weight:400;}

textarea::-webkit-input-placeholder,
textarea::-moz-placeholder,
textarea:-ms-input-placeholder,
textarea:-moz-placeholder,
textarea::placeholder {color:var(--color-gray-200); font-size:1.6rem; font-weight:400;}
/**** 공통 CSS END ****/



.wrap {width:100%; position: relative;}

.inner {width:calc(100% - 6rem); margin: auto; max-width:176rem;}
.sInner {width:calc(100% - 6rem); margin: auto; max-width:136.8rem;}

@media (max-width:479px) {
	.inner,
	.sInner {width:calc(100% - 4.4rem);}
}
@media (max-width:420px) {
	.inner,
	.sInner {width:calc(100% - 4rem);}
}

@media (max-width:390px) {
	* {font-size:9px;}
}
@media (max-width:360px) {
	* {font-size:8.5px;}
}
@media (max-width:320px) {
	* {font-size:8px;}
}


header {width:100%; position:sticky; top:0; left:0; z-index:99;}

#header {width:100%; height:8rem; background-color:var(--color-white); position: relative; z-index:98;}
#header .top {width:100%; height:100%; position:relative; z-index:2;}
#header .top .hInner {width:calc(100% - 6rem); max-width:176rem; margin: auto; height:100%; display:flex; align-items: center; position: relative;}
#header .top .hInner a.logo {display:flex; align-items: center; height:100%;}
#header .top .hInner a.logo img {height:3.2rem;}

#header .top .hInner a.back {width:7.6rem; height:100%; position: absolute; top:0; left:0; background:url("/skin/site_m/responsive-food/svg/common/btn_back.svg")no-repeat center; background-size:1.6rem; display:none;}
#header .top .hInner h2.sub_title {display:none; font-size:1.8rem; color:var(--color-gray-700); font-weight:600; letter-spacing:-0.02em; line-height:2.8rem;}

#header .top .hInner #gnb {margin-left:auto; height:100%;}
#header .top .hInner #gnb ul {display:flex; align-items: center; gap:5.6rem; height:100%;}
#header .top .hInner #gnb ul li {position: relative; white-space: nowrap; height:100%;}
#header .top .hInner #gnb ul li .nav_tit { display:flex; align-items: center; width:100%; height:100%; font-size:1.7rem; color:var(--color-gray-800); font-weight:600; letter-spacing:-0.03em; line-height:3.6rem; position:relative; cursor: pointer; padding:0 1.2rem;}
#header .top .hInner #gnb ul:has(.hit) .nav_tit {color:var(--color-gray-300);}
#header .top .hInner #gnb ul li .nav_tit.hit {color:var(--color-gray-800)!important;}

#header .top .hInner #gnb ul li .sgList {position: absolute; top:6.2rem; left:50%; transform: translateX(-50%); display:none; background-color:var(--color-white); border-radius:0.8rem; padding:0.8rem 0; box-shadow:0 0.2rem 0.6rem rgba(0,0,0,0.15); width:auto;}
#header .top .hInner #gnb ul li .sgList a {display: block; font-size:1.6rem; color:#080404; font-weight:500; letter-spacing:-0.02em; line-height:2.4rem; text-align: center; min-width:12rem; padding:0.8rem 2.4rem;}

#header .top .hInner #gnb ul li:has(.hit) .sgList {display:block;}
.isMobile #header .top .hInner #gnb ul li:has(.hit) .sgList {display:none;}

#header .top .hInner #gnb ul li .nav_tit.on {color:var(--color-action)!important;}

#header .top .hInner .icon_link {display:flex; align-items: center; gap:3.6rem; margin-left:auto;}
:has(#gnbPopup.popupShow) #header .top .hInner .icon_link {display:none;}
#header .top .hInner .icon_link .btn_search {width:4rem; height:4rem; display:flex; align-items: center; justify-content: center; cursor: pointer; border-radius:100%;}
#header .top .hInner .icon_link .btn_search::before {content:""; width:100%; height:100%; -webkit-mask:url("/skin/site_m/responsive-food/svg/common/ic_search.svg")no-repeat center; -moz-mask:url("/skin/site_m/responsive-food/svg/common/ic_search.svg")no-repeat center; -o-mask:url("/skin/site_m/responsive-food/svg/common/ic_search.svg")no-repeat center; -ms-mask:url("/skin/site_m/responsive-food/svg/common/ic_search.svg")no-repeat center; mask:url("/skin/site_m/responsive-food/svg/common/ic_search.svg")no-repeat center; -webkit-mask-size:2rem; -moz-mask-size:2rem; -o-mask-size:2rem; -ms-mask-size:2rem; mask-size:2rem; background-color:var(--color-gray-800);}
#header .top .hInner .icon_link .btn_contact {display: block; overflow:hidden; -webkit-mask-image: -webkit-radial-gradient(white, black); isolation: isolate; border-radius:10rem; position: relative; --border-angle: 0turn; --main-bg: conic-gradient(from var(--border-angle), #DFDFDF, #DFDFDF); border: solid 0.2rem transparent; --gradient-border: conic-gradient(from var(--border-angle), transparent 45%, #DFDFDF, var(--color-gray-800) 80%, transparent); background: var(--main-bg) padding-box, var(--gradient-border) border-box, var(--main-bg) border-box; background-position: center center; animation: bg-spin 2.4s linear infinite;}
#header .top .hInner .icon_link .btn_contact em {font-size:1.7rem; color:var(--color-gray-800); font-weight:800; line-height:3.4rem; padding:0 1.2rem; background-color:var(--color-white); display: block;}
@keyframes bg-spin {
    to {--border-angle: 1turn;}
}
@property --border-angle {
    syntax: "<angle>";
    inherits: true;
    initial-value: 0turn;
}

#header .top .hInner .gnbBtn {width:5.6rem; height:100%; display:none; align-items: center; justify-content: center; cursor: pointer; margin-left:0.8rem;}
:has(#gnbPopup.popupShow) #header .top .hInner .gnbBtn {margin-left: auto;}
#header .top .hInner .gnbBtn div {width:2.6rem; height:1.8rem; position: relative;}
#header .top .hInner .gnbBtn div span {width:100%; height:0.2rem; background-color:var(--color-gray-800); position:absolute; left:0; border-radius:10rem; transition:all 0.2s;}
#header .top .hInner .gnbBtn div span:nth-child(1) {top:0; transform-origin:left top;}
#header .top .hInner .gnbBtn div span:nth-child(2) {top:50%; transform: translateY(-50%);}
#header .top .hInner .gnbBtn div span:nth-child(3) {bottom:0; transform-origin:left bottom;}

#header .top .hInner .gnbBtn.on div span:nth-child(1) {transform:rotate(45deg); left:0.5rem; top:-0.1rem;}
#header .top .hInner .gnbBtn.on div span:nth-child(2) {opacity:0; left:50%;}
#header .top .hInner .gnbBtn.on div span:nth-child(3) {transform:rotate(-45deg); left:0.5rem; bottom:-0.1rem;}


#header.tempHidden .top .hInner .icon_link {margin-left:6.8rem;}


@media (hover: hover) {
    #header .top .hInner #gnb ul li .nav_tit,
    #header .top .hInner #gnb ul li .sgList a,
    #header .top .hInner .icon_link .btn_search,
    #header .top .hInner .icon_link .btn_contact,
    #header .top .hInner .icon_link .btn_contact em {transition:all 0.2s;}

    #header .top .hInner #gnb ul li .sgList:has(a:hover) a {color:var(--color-gray-300);}
    #header .top .hInner #gnb ul li .sgList:has(a:hover) a:hover {color:var(--color-gray-800);}

    #header .top .hInner .icon_link .btn_search:hover {background-color:var(--color-gray-100);}
    #header .top .hInner .icon_link .btn_contact:hover {--main-bg: conic-gradient(from var(--border-angle), rgba(26, 59, 209, 0.16), rgba(26, 59, 209, 0.16)); border: solid 0.2rem transparent; --gradient-border: conic-gradient(from var(--border-angle), transparent 45%, rgba(26, 59, 209, 0.16), var(--color-action) 80%, transparent);}
    #header .top .hInner .icon_link .btn_contact:hover em {color:var(--color-action);}
}
@media (max-width:1300px){
    #header .top .hInner #gnb ul {gap:4rem;}
    #header .top .hInner .icon_link {gap:1.6rem;}
    #header.tempHidden .top .hInner .icon_link {margin-left:4.8rem;}
}
@media (max-width:1200px){
    #header {height:7.2rem;}
    #header .top .hInner {width:calc(100% - 6rem);}
    #header .top .hInner a.logo img {height:2.8rem;}
    #header .top .hInner #gnb ul {gap:2.4rem;}
    #header .top .hInner #gnb ul li .nav_tit {padding:0 0.8rem;}

    #header .top .hInner .icon_link {gap:1.6rem;}
    #header .top .hInner .icon_link .btn_search {width:3.6rem; height:3.6rem;}
    #header .top .hInner .icon_link .btn_search::before {-webkit-mask-size:1.8rem; -moz-mask-size:1.8rem; -ms-mask-size:1.8rem; -o-mask-size:1.8rem; mask-size:1.8rem;}
    #header .top .hInner .icon_link .btn_contact em {font-size:1.6rem; line-height:3.2rem;}

    #header.tempHidden .top .hInner .icon_link {margin-left:3.6rem;}
}
@media (max-width:1023px){
    #header .top .hInner {width:100%; padding:0 3rem; padding-right:1.5rem;}
    #header .top .hInner a.logo img {height:2.6rem;}
    #header .top .hInner #gnb ul {gap:2rem;}
    #header .top .hInner .icon_link .btn_contact {display:none;}
    #header .top .hInner .icon_link .btn_search {width:3.2rem; height:3.2rem;}
    #header .top .hInner .icon_link .btn_search::before {-webkit-mask-size:2rem; -moz-mask-size:2rem; -ms-mask-size:2rem; -o-mask-size:2rem; mask-size:2rem;}
    #header .top .hInner .gnbBtn {display:flex;}

    #header.tempHidden .top .hInner #gnb ul {gap:3rem;}
    #header.tempHidden .top .hInner .icon_link {display:none;}
    #header.tempHidden .top .hInner .gnbBtn {margin-left:1.6rem;}
}
@media (max-width:900px){
    #header .top .hInner #gnb {display:none;}
    body:not(:has(main)) #header .top .hInner {padding-left:7rem;}
    body:not(:has(main)) #header .top .hInner a.logo {display:none;}
    body:not(:has(main)) #header .top .hInner a.back {display:block;}
    body:not(:has(main)) #header .top .hInner h2.sub_title {display:block;}

    #header.tempHidden .top .hInner .gnbBtn {margin-left:auto;}
}
@media (max-width:767px) {
	#header {height:6.2rem;}
    #header .top .hInner {padding:0 3rem; padding-right:2rem;}
    #header .top .hInner a.logo img {height:2.6rem;}
    #header .top .hInner .gnbBtn {width:4.2rem;}
    #header .top .hInner .gnbBtn div {width:2.2rem; height:1.6rem;}
    #header .top .hInner .gnbBtn.on div span {width:2.3rem;}
    #header .top .hInner .gnbBtn.on div span:nth-child(1) {left:0.4rem; top:-0.1rem;}
    #header .top .hInner .gnbBtn.on div span:nth-child(3) {left:0.4rem; bottom:-0.1rem;}
}
@media (max-width:600px) {
    body:not(:has(main)) #header .top .hInner {padding-left:6.6rem;}
    #header .top .hInner a.back {width:7.5rem; background-size:1.5rem;}
    #header .top .hInner h2.sub_title {font-size:1.7rem; line-height:2.7rem; padding-bottom:0.3rem;}
}
@media (max-width:479px) {
	#header {height:6rem;}
    #header .top .hInner {padding:0 2.2rem; padding-right:1.2rem;}
    #header .top .hInner a.logo img {height:2.4rem;}
    #header .top .hInner a.back {width:5.9rem;}
    #header .top .hInner h2.sub_title {font-size:1.6rem; line-height:2.6rem;}

    #header .top .hInner .icon_link .btn_search {width:3rem; height:3rem;}
    #header .top .hInner .icon_link .btn_search::before {-webkit-mask-size:1.8rem; -moz-mask-size:1.8rem; -ms-mask-size:1.8rem; -o-mask-size:1.8rem; mask-size:1.8rem;}

    #header .top .hInner .gnbBtn {margin-left:0.6rem;}
    #header .top .hInner .gnbBtn div {width:2.2rem; height:1.6rem;}
    #header .top .hInner .gnbBtn.on div span {width:2rem;}
    #header .top .hInner .gnbBtn.on div span:nth-child(1) {left:0.5rem; top:0;}
    #header .top .hInner .gnbBtn.on div span:nth-child(3) {left:0.5rem; bottom:0;}

    body:not(:has(main)) #header .top .hInner {padding-left:5.6rem;}
}
@media (max-width:420px) {
	#header {height:5.6rem;}
	#header .top .hInner {padding:0 2rem; padding-right:1rem;}
    #header .top .hInner a.logo img {height:2.2rem;}
    #header .top .hInner a.back {width:5.4rem; background-size:1.4rem;}
    
    #header .top .hInner .icon_link .btn_search {width:2.6rem; height:2.6rem;}
    #header .top .hInner .icon_link .btn_search::before {-webkit-mask-size:1.6rem; -moz-mask-size:1.6rem; -ms-mask-size:1.6rem; -o-mask-size:1.6rem; mask-size:1.6rem;}
    #header .top .hInner .gnbBtn {margin-left:0.3rem; width:4rem;}
    #header .top .hInner .gnbBtn div {width:2rem; height:1.4rem;}
    #header .top .hInner .gnbBtn.on div span:nth-child(1) {left:0.4rem; top:-0.1rem;}
    #header .top .hInner .gnbBtn.on div span:nth-child(3) {left:0.4rem; bottom:-0.1rem;}

    body:not(:has(main)) #header .top .hInner {padding-left:5rem;}
}
@media (max-width:390px) {
    #header .top .hInner h2.sub_title {padding:0; padding-top:0.2rem; font-size:1.5rem; line-height:2.5rem;}
}


#gnbPopup {position:fixed; top:0; left:0; width:100%; height:100%; overflow-y:auto; background-color:var(--color-white); z-index:97; transform: translateX(100%); padding-top:7.2rem;}
#gnbPopup .g_container {width:100%; height:100%;}
#gnbPopup .g_container .g_content {width:100%; padding:0 3rem; padding-bottom:4.2rem;}
#gnbPopup .g_list {width:100%; border-bottom:1px solid var(--color-gray-200);}
#gnbPopup .g_list .gBox {width:100%; position: relative; display:flex;}
#gnbPopup .g_list .gBox + .gBox {border-top:1px solid var(--color-gray-200);}
#gnbPopup .g_list .gBox .g_tit {width:18rem;}
#gnbPopup .g_list .gBox .g_tit a {font-size:2.2rem; color:var(--color-gray-800); font-weight:800; letter-spacing:-0.03em; line-height:3.2rem; padding:3.2rem 0; display:block;}
#gnbPopup .g_list .gBox .g_tit .fold {display:none; position: absolute; top:0; right:0; width:3.4rem; height:100%; background:url("/skin/site_m/responsive-food/svg/common/select.svg")no-repeat center; background-size:1.4rem; cursor: pointer;}

#gnbPopup .g_list .gBox.if_no2 {padding:0;}
#gnbPopup .g_list .gBox.if_no2::before {content:""; width:1.6rem; height:100%; position: absolute; top:0; right:0; -webkit-mask:url("/skin/site_m/responsive-food/svg/common/btn_arrow.svg")no-repeat center; -moz-mask:url("/skin/site_m/responsive-food/svg/common/btn_arrow.svg")no-repeat center; -o-mask:url("/skin/site_m/responsive-food/svg/common/btn_arrow.svg")no-repeat center; -ms-mask:url("/skin/site_m/responsive-food/svg/common/btn_arrow.svg")no-repeat center; mask:url("/skin/site_m/responsive-food/svg/common/btn_arrow.svg")no-repeat center; -webkit-mask-size:100%; -moz-mask-size:100%; -o-mask-size:100%; -ms-mask-size:100%; mask-size:100%; background-color:var(--color-gray-600);}
#gnbPopup .g_list .gBox.if_no2 .fold {display:none!important;}
#gnbPopup .g_list .gBox.if_no2 .g_tit {width:100%;}

#gnbPopup .g_list .gBox ul.list {width:calc(100% - 18rem); display:flex; flex-wrap:wrap; gap:1.6rem 2.4rem; padding-top:3.6rem; padding-bottom:3.2rem;}
#gnbPopup .g_list .gBox ul.list li {display:flex; position: relative;}
#gnbPopup .g_list .gBox ul.list li a {font-size:1.7rem; color:var(--color-gray-600); font-weight:500; letter-spacing:-0.03em; line-height:2.4rem;}

#gnbPopup .icon_link {width:100%; margin-top:3rem; display:flex; justify-content: center;}
#gnbPopup .btn_contact {width:100%; max-width:20rem; display: block; overflow:hidden; -webkit-mask-image: -webkit-radial-gradient(white, black); isolation: isolate; border-radius:10rem; position: relative; --border-angle: 0turn; --main-bg: conic-gradient(from var(--border-angle), #DFDFDF, #DFDFDF); border: solid 0.2rem transparent; --gradient-border: conic-gradient(from var(--border-angle), transparent 45%, #DFDFDF, var(--color-gray-800) 80%, transparent); background: var(--main-bg) padding-box, var(--gradient-border) border-box, var(--main-bg) border-box; background-position: center center; animation: bg-spin 2.4s linear infinite;}
#gnbPopup .btn_contact em {font-size:1.8rem; color:var(--color-gray-800); font-weight:800; line-height:5.2rem; padding:0 1.2rem; text-align: center; background-color:var(--color-white); display: block;}

#gnbPopup.popupShow {animation:gnb_show_ani 0.5s cubic-bezier(0.17, 0.67, 0, 1) forwards;}
#gnbPopup.popupHide {animation:gnb_hide_ani 0.5s cubic-bezier(0.17, 0.67, 0, 1) forwards;}
@keyframes gnb_show_ani {
    0% {transform: translateX(100%);}
    100% {transform: translateX(0);}
}
@keyframes gnb_hide_ani {
    0% {transform: translateX(0);}
    100% {transform: translateX(100%);}
}

@media (hover: hover) {
	#gnbPopup .btn_close,
    #gnbPopup .g_list .gBox .g_tit a,
    #gnbPopup .g_list .gBox .g_tit .fold,
    #gnbPopup .g_list .gBox.if_no2::before,
	#gnbPopup .g_list .gBox ul.list li a {transition:all 0.2s;}
	#gnbPopup .btn_close:hover {opacity:0.5;}
    #gnbPopup .g_list .gBox .g_tit a:hover,
	#gnbPopup .g_list .gBox ul.list li a:hover {color:var(--color-action);}
    #gnbPopup .g_list .gBox.if_no2:hover::before {background-color:var(--color-action);}
    #gnbPopup .g_list .gBox .g_tit .fold:hover {opacity:0.5;}
}
@media (max-width:767px) {
    #gnbPopup {padding-top:6.2rem;}
    #gnbPopup .g_container .g_content {padding-bottom:3.6rem;}
    #gnbPopup .g_list .gBox {padding:0; display:block;}
    #gnbPopup .g_list .gBox .g_tit {width:100%; position: relative; padding-right:5.4rem;}
    #gnbPopup .g_list .gBox .g_tit a {font-size:1.8rem; color:var(--color-gray-700); line-height:2.4rem; display:block; cursor: pointer; padding:2.4rem 0;}
    #gnbPopup .g_list .gBox .g_tit .fold {display: block;}
    #gnbPopup .g_list .gBox.show .fold {transform:rotate(-180deg);}

    #gnbPopup .g_list .gBox.if_no2::before {display:none;}
    #gnbPopup .g_list .gBox.if_no2 .g_tit {padding-right:0;}

    #gnbPopup .g_list .gBox ul.list {width:100%; padding:0.8rem 1.6rem; background-color:var(--color-gray-50); display:none;}
    #gnbPopup .g_list .gBox ul.list li {display: block;}
    #gnbPopup .g_list .gBox ul.list li a {display: block; font-size:1.5rem; color:var(--color-gray-600); line-height:2rem; padding:0.8rem 0;}

    #gnbPopup .g_list .gBox.show ul.list {display:block;}

    #gnbPopup .icon_link {margin-top:3rem;}
    #gnbPopup .btn_contact {max-width:18rem;}
    #gnbPopup .btn_contact em {font-size:1.7rem; line-height:4.8rem;}
}
@media (max-width:600px) {
    #gnbPopup .g_list .gBox .g_tit {padding-right:5.3rem;}
    #gnbPopup .g_list .gBox .g_tit a {font-size:1.7rem; padding:1.6rem 0;}
    #gnbPopup .g_list .gBox .g_tit .fold {width:3.3rem; background-size:1.3rem;}
    #gnbPopup .g_list .gBox ul.list li a {padding:0.6rem 0;}

    #gnbPopup .btn_contact {max-width:16rem;}
    #gnbPopup .btn_contact em {font-size:1.6rem; line-height:4.2rem;}
}
@media (max-width:479px) {
    #gnbPopup {padding-top:6rem;}
	#gnbPopup .g_container .g_content {padding:0 2.2rem; padding-bottom:3.6rem;}
    #gnbPopup .g_list .gBox .g_tit a {font-size:1.6rem;}
    #gnbPopup .g_list .gBox .g_tit .fold {width:3.2rem; background-size:1.2rem;}
    #gnbPopup .g_list .gBox ul.list li a {font-size:1.4rem;}
    
    #gnbPopup .icon_link {margin-top:4rem;}
    #gnbPopup .btn_contact {max-width:none;}
    #gnbPopup .btn_contact em {font-size:1.6rem; line-height:4.4rem;}
}
@media (max-width:420px) {
    #gnbPopup {padding-top:5.6rem;}
	#gnbPopup .g_container .g_content {padding:0 2rem; padding-bottom:3.2rem;}
}




#searchPopup {width:100%; position: fixed; top:0; left:0; z-index:99;}
#searchPopup .searchLayout {width:100%; position: absolute; top:0; left:0; z-index:2; transform: translateY(-100%);}
#searchPopup .searchLayout .searchForm {width:100%; padding:9.4rem 0; background-color:var(--color-white); display:flex; justify-content: center; flex-wrap:wrap;}
#searchPopup .searchLayout .searchForm .s_title {width:100%;}
#searchPopup .searchLayout .searchForm .s_title h2 {font-size:3.4rem; color:var(--color-gray-800); font-weight:700; letter-spacing:-0.05em; line-height:4.4rem; text-align: center; margin-bottom:2.4rem;}
#searchPopup .searchLayout .searchForm form {display: block; width:calc(100% - 6rem); max-width:72rem;}
#searchPopup .searchLayout .searchForm form .searchBar {width:100%; border:1px solid var(--color-gray-600); border-radius:10rem; position: relative; display:flex; align-items: center; padding:0 2.4rem; padding-right:1.5rem; flex-wrap:wrap;}
#searchPopup .searchLayout .searchForm form .searchBar input {width:calc(100% - 5.1rem); height:6.2rem; font-size:1.8rem; color:var(--color-gray-800); letter-spacing:-0.03em; font-weight:600; line-height:2.4rem; background-color: transparent;}
#searchPopup .searchLayout .searchForm form .searchBar:has(.ic_delete.show) input {width:calc(100% - 11rem);}
#searchPopup .searchLayout .searchForm form .searchBar input::placeholder {font-size:1.8rem; color:var(--color-gray-200); font-weight:400; letter-spacing:-0.03em;}
#searchPopup .searchLayout .searchForm form .searchBar input::-moz-placeholder {font-size:1.8rem; color:var(--color-gray-200); font-weight:400; letter-spacing:-0.03em;}
#searchPopup .searchLayout .searchForm form .searchBar input:-ms-input-placeholder {font-size:1.8rem; color:var(--color-gray-200); font-weight:400; letter-spacing:-0.03em;}
#searchPopup .searchLayout .searchForm form .searchBar input::-webkit-input-placeholder {font-size:1.8rem; color:var(--color-gray-200); font-weight:400; letter-spacing:-0.03em;}

#searchPopup .searchLayout .searchForm form .searchBar .ic_delete {height:100%; position: absolute; top:0; right:6.2rem; display:none;}
#searchPopup .searchLayout .searchForm form .searchBar .ic_delete.show {display: block;}
#searchPopup .searchLayout .searchForm form .searchBar .ic_delete::before {content:""; width:1px; height:1.6rem; background-color:var(--color-gray-200); position: absolute; top:50%; right:0; transform: translateY(-50%);}
#searchPopup .searchLayout .searchForm form .searchBar .ic_delete span {width:4.8rem; height:100%; position: relative; display: flex; align-items: center; justify-content: center; cursor: pointer;}
#searchPopup .searchLayout .searchForm form .searchBar .ic_delete span::before {content:""; width:1.6rem; height:1.6rem; border-radius:100%; background:url("/skin/site_m/responsive-food/svg/common/ic_delete.svg")no-repeat center var(--color-gray-400); background-size:0.8rem; display: block;}

#searchPopup .searchLayout .searchForm form .searchBar .btn_search {width:4rem; height:4rem; border-radius:10rem; margin-left: auto;}
#searchPopup .searchLayout .searchForm form .searchBar .btn_search::before {content:""; width:100%; height:100%; display: block; -webkit-mask:url("/skin/site_m/responsive-food/svg/common/ic_search.svg")no-repeat center; -moz-mask:url("/skin/site_m/responsive-food/svg/common/ic_search.svg")no-repeat center; -o-mask:url("/skin/site_m/responsive-food/svg/common/ic_search.svg")no-repeat center; -ms-mask:url("/skin/site_m/responsive-food/svg/common/ic_search.svg")no-repeat center; mask:url("/skin/site_m/responsive-food/svg/common/ic_search.svg")no-repeat center; -webkit-mask-size:2rem; -moz-mask-size:2rem; -o-mask-size:2rem; -ms-mask-size:2rem; mask-size:2rem; background-color:var(--color-gray-800);}

#searchPopup .searchLayout .btn_close {width:6.4rem; height:6.4rem; background:url("/skin/site_m/responsive-food/svg/common/ic_close_white.svg")no-repeat center rgba(8, 4, 4, 0.6); background-size:2rem; margin: auto; margin-top:4rem; border-radius:100%; display: block; cursor: pointer;}

#searchPopup .searchPopBg {width:100%; height:100%; position: fixed; top:0; left:0; background-color:rgba(0,0,0,0.4); z-index:1; display:none;}

#searchPopup.popupShow .searchLayout {animation: search_show_ani 0.4s ease forwards;}
#searchPopup.popupHide .searchLayout {animation: search_hide_ani 0.4s ease forwards;}

@media (hover: hover) {
    #searchPopup .searchLayout .searchForm form .searchBar .ic_delete span::before,
    #searchPopup .searchLayout .searchForm form .searchBar .btn_search,
    #searchPopup .searchLayout .btn_close {transition:all 0.2s;}

    #searchPopup .searchLayout .searchForm form .searchBar .ic_delete span:hover::before {background-color:var(--color-gray-300);}
    #searchPopup .searchLayout .searchForm form .searchBar .btn_search:hover {background-color:var(--color-gray-200);}
    #searchPopup .searchLayout .btn_close:hover {transform:rotate(180deg); background-color: var(--color-gray-800);}
}
@keyframes search_show_ani {
	0% {transform: translateY(-100%);}
	100% {transform: translateY(0);}
}
@keyframes search_hide_ani {
	0% {transform: translateY(0);}
	100% {transform: translateY(-100%);}
}
@media (max-width:1200px) {
    #searchPopup .searchLayout .searchForm {padding:9rem 0;}
    #searchPopup .searchLayout .searchForm .s_title h2 {font-size:3.2rem; line-height:4.2rem;}
    #searchPopup .searchLayout .searchForm form {max-width:64rem;}
    #searchPopup .searchLayout .btn_close {width:6rem; height:6rem;}
}
@media (max-width:1023px) {
    #searchPopup .searchLayout .searchForm {padding:8.6rem 0;}
    #searchPopup .searchLayout .searchForm .s_title h2 {font-size:3rem; line-height:4rem;}
    #searchPopup .searchLayout .searchForm form {max-width:64rem;}
    #searchPopup .searchLayout .btn_close {width:5rem; height:5rem; background-size:1.8rem; margin-top:3.6rem;}
}
@media (max-width:767px) {
    #searchPopup .searchLayout .searchForm .s_title h2 {font-size:2.8rem; line-height:3.8rem;}
    #searchPopup .searchLayout .searchForm form .searchBar {padding:0 2rem; padding-right:1.2rem;}
    #searchPopup .searchLayout .searchForm form .searchBar input {width:calc(100% - 4.3rem); height:5.5rem; font-size:1.7rem;}
    #searchPopup .searchLayout .searchForm form .searchBar:has(.ic_delete.show) input {width:calc(100% - 8.7rem);}
    #searchPopup .searchLayout .searchForm form .searchBar input::placeholder {font-size:1.7rem;}
    #searchPopup .searchLayout .searchForm form .searchBar input::-moz-placeholder {font-size:1.7rem;}
    #searchPopup .searchLayout .searchForm form .searchBar input:-ms-input-placeholder {font-size:1.7rem;}
    #searchPopup .searchLayout .searchForm form .searchBar input::-webkit-input-placeholder {font-size:1.7rem;}

    #searchPopup .searchLayout .searchForm form .searchBar .ic_delete {right:5.2rem;}
    #searchPopup .searchLayout .searchForm form .searchBar .ic_delete::before {height:1.5rem; transform: translateY(-50%) translateY(-0.05rem);}
    #searchPopup .searchLayout .searchForm form .searchBar .ic_delete span {width:4.7rem;}
    #searchPopup .searchLayout .searchForm form .searchBar .ic_delete span::before {width:1.5rem; height:1.5rem; background-size:0.9rem;}
    
    #searchPopup .searchLayout .searchForm form .searchBar .btn_search {width:3.5rem; height:3.5rem;}
    #searchPopup .searchLayout .searchForm form .searchBar .btn_search::before {-webkit-mask-size:1.9rem; -moz-mask-size:1.9rem; -o-mask-size:1.9rem; -ms-mask-size:1.9rem; mask-size:1.9rem;}
    
    #searchPopup .searchLayout .btn_close {width:4.2rem; height:4.2rem; background-size:1.6rem; margin-top:3.2rem;}
}
@media (max-width:600px) {
    #searchPopup .searchLayout .searchForm {padding:8rem 0;}
    #searchPopup .searchLayout .searchForm .s_title h2 {font-size:2.6rem; line-height:3.6rem;}
    #searchPopup .searchLayout .searchForm form .searchBar {padding:0 2rem; padding-right:1.2rem;}
    #searchPopup .searchLayout .searchForm form .searchBar input {width:calc(100% - 4.2rem); height:5rem; font-size:1.6rem;}
    #searchPopup .searchLayout .searchForm form .searchBar:has(.ic_delete.show) input {width:calc(100% - 8rem);}
    #searchPopup .searchLayout .searchForm form .searchBar input::placeholder {font-size:1.6rem;}
    #searchPopup .searchLayout .searchForm form .searchBar input::-moz-placeholder {font-size:1.6rem;}
    #searchPopup .searchLayout .searchForm form .searchBar input:-ms-input-placeholder {font-size:1.6rem;}
    #searchPopup .searchLayout .searchForm form .searchBar input::-webkit-input-placeholder {font-size:1.6rem;}

    #searchPopup .searchLayout .searchForm form .searchBar .ic_delete {right:5rem;}
    #searchPopup .searchLayout .searchForm form .searchBar .ic_delete::before {height:1.4rem; transform: translateY(-50%);}
    #searchPopup .searchLayout .searchForm form .searchBar .ic_delete span {width:4.2rem;}
    #searchPopup .searchLayout .searchForm form .searchBar .ic_delete span::before {width:1.4rem; height:1.4rem; background-size:0.8rem;}

    #searchPopup .searchLayout .searchForm form .searchBar .btn_search {width:3.4rem; height:3.4rem;}
    #searchPopup .searchLayout .searchForm form .searchBar .btn_search::before {-webkit-mask-size:1.8rem; -moz-mask-size:1.8rem; -o-mask-size:1.8rem; -ms-mask-size:1.8rem; mask-size:1.8rem;}

    #searchPopup .searchLayout .btn_close {width:3.6rem; height:3.6rem; background-size:1.4rem; margin-top:3rem;}
}
@media (max-width:479px) {
    #searchPopup .searchLayout .searchForm {padding:6.4rem 0;}
    #searchPopup .searchLayout .searchForm .s_title h2 {font-size:2.4rem; line-height:3.4rem; margin-bottom:1.6rem;}
    #searchPopup .searchLayout .searchForm form {width:calc(100% - 4.4rem);}

    #searchPopup .searchLayout .searchForm form .searchBar {padding:0 1.6rem; padding-right:0.8rem;}
    #searchPopup .searchLayout .searchForm form .searchBar input {width:calc(100% - 4.1rem); height:4.7rem; font-size:1.5rem;}
    #searchPopup .searchLayout .searchForm form .searchBar:has(.ic_delete.show) input {width:calc(100% - 7.2rem);}
    #searchPopup .searchLayout .searchForm form .searchBar input::placeholder {font-size:1.5rem;}
    #searchPopup .searchLayout .searchForm form .searchBar input::-moz-placeholder {font-size:1.5rem;}
    #searchPopup .searchLayout .searchForm form .searchBar input:-ms-input-placeholder {font-size:1.5rem;}
    #searchPopup .searchLayout .searchForm form .searchBar input::-webkit-input-placeholder {font-size:1.5rem;}

    #searchPopup .searchLayout .searchForm form .searchBar .ic_delete {right:4.3rem;}
    #searchPopup .searchLayout .searchForm form .searchBar .ic_delete::before {height:1.3rem; transform: translateY(-50%) translateY(-0.05rem);}
    #searchPopup .searchLayout .searchForm form .searchBar .ic_delete span {width:3.7rem;}
    #searchPopup .searchLayout .searchForm form .searchBar .ic_delete span::before {width:1.3rem; height:1.3rem; background-size:0.7rem;}

    #searchPopup .searchLayout .searchForm form .searchBar .btn_search {width:3.3rem; height:3.3rem;}
    #searchPopup .searchLayout .searchForm form .searchBar .btn_search::before {-webkit-mask-size:1.7rem; -moz-mask-size:1.7rem; -o-mask-size:1.7rem; -ms-mask-size:1.7rem; mask-size:1.7rem;}

    #searchPopup .searchLayout .btn_close {width:3.2rem; height:3.2rem; background-size:1.2rem; margin-top:2.4rem;}
}
@media (max-width:420px) {
    #searchPopup .searchLayout .searchForm {padding:5.6rem 0;}
    #searchPopup .searchLayout .searchForm .s_title h2 {font-size:2rem; line-height:2.8rem;}
    #searchPopup .searchLayout .searchForm form {width:calc(100% - 4rem);}
}



/* 모달 팝업 스크롤 */
.modalScroll .scroll-wrapper {overflow: hidden !important;  padding: 0 !important; position: relative;}
.modalScroll .scroll-wrapper > .scroll-content { border: none !important; box-sizing: content-box !important; height: auto; left: 0; margin: 0; max-height: none; max-width: none !important; overflow: scroll !important; padding: 0; position: relative !important; top: 0; width: auto !important;}
.modalScroll .scroll-wrapper > .scroll-content::-webkit-scrollbar { height: 0; width: 0;}
.modalScroll .scroll-element { display: none;}
.modalScroll .scroll-element, .scroll-element div { box-sizing: content-box;}
.modalScroll .scroll-element.scroll-x.scroll-scrollx_visible,
.modalScroll .scroll-element.scroll-y.scroll-scrolly_visible { display: block;}
.modalScroll .scroll-element .scroll-bar,
.modalScroll .scroll-element .scroll-arrow { cursor: default;}
.modalScroll .scroll-textarea {border: 1px solid #cccccc; border-top-color: #999999;}
.modalScroll .scroll-textarea > .scroll-content { overflow: hidden !important;}
.modalScroll .scroll-textarea > .scroll-content > textarea { border: none !important; box-sizing: content-box; height: 100% !important; margin: 0; max-height: none !important; max-width: none !important; overflow: scroll !important; outline: none; padding: 2px; position: relative !important; top: 0; width: 100% !important;}
.modalScroll .scroll-textarea > .scroll-content > textarea::-webkit-scrollbar { height: 0; width: 0;}
.modalScroll .scrollbar-outer > .scroll-element,
.modalScroll .scrollbar-outer > .scroll-element div{ border: none; margin: 0; padding: 0; position: absolute; z-index: 10;} 
.modalScroll .scrollbar-outer > .scroll-element div { display: block; height: 100%; left: 0; top: 0; width: 100%; }
.modalScroll .scrollbar-outer > .scroll-element.scroll-x { display:none; bottom: 0; height: 12px; left: 0; width: 100%;}
.modalScroll .scrollbar-outer > .scroll-element.scroll-x .scroll-element_outer { height: 8px; top: 0;}
.modalScroll .scrollbar-outer > .scroll-element .scroll-element_outer { overflow: hidden; }
.modalScroll .scrollbar-outer > .scroll-element .scroll-element_track { background-color:none; }
.modalScroll .scrollbar-outer > .scroll-element .scroll-element_outer,
.modalScroll .scrollbar-outer > .scroll-element .scroll-element_track,
.modalScroll .scrollbar-outer > .scroll-element .scroll-bar { -ms-border-radius:8px; -moz-border-radius:8px; -o-border-radius:8px; -webkit-border-radius:8px; border-radius:8px;}
.modalScroll .scrollbar-outer > .scroll-content.scroll-scrolly_visible { left:0; margin-left: 0; }
.modalScroll .scrollbar-outer > .scroll-content.scroll-scrollx_visible { top:  -12px; margin-top:  12px;}
.modalScroll .scrollbar-outer > .scroll-element.scroll-x .scroll-bar { min-width: 10px; }
.modalScroll .scrollbar-outer > .scroll-element.scroll-y .scroll-bar { min-height: 10px; }
.modalScroll .scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left: -14px; }
.modalScroll .scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top: -14px; }
.modalScroll .scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -14px; }
.modalScroll .scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -14px;}

.modalScroll .scrollbar-outer > .scroll-element.scroll-y {height:calc(100% - 0.8rem); right:0; top:0.4rem; width:0.8rem; position:absolute;}
.modalScroll .scrollbar-outer > .scroll-element.scroll-y .scroll-element_outer {left:0; width:0.4rem;}
.modalScroll .scrollbar-outer > .scroll-element .scroll-bar { background-color: var(--color-gray-200); cursor: pointer;}
.modalScroll .scrollbar-outer > .scroll-element .scroll-bar:hover { background-color: var(--color-gray-300);}
.modalScroll .scrollbar-outer > .scroll-element.scroll-draggable .scroll-bar { background-color: var(--color-gray-400);}

.modalScroll .popupBg {width:100%; height:100%; position: absolute; top:0; left:0; z-index:1; background-color: rgba(0,0,0,0.3);}

.isMobile .modalScroll .scrollbar-outer > .scroll-element .scroll-bar {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; -webkit-transition: opacity 0.2s linear; -moz-transition: opacity 0.2s linear; -o-transition: opacity 0.2s linear; -ms-transition: opacity 0.2s linear; transition: opacity 0.2s linear;}
.isMobile .modalScroll .scrollbar-outer.macosx.show > .scroll-element .scroll-bar,
.isMobile .modalScroll .scrollbar-outer.macosx > .scroll-element.scroll-draggable .scroll-bar { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter: alpha(opacity=70); opacity: 0.7;}



.top_btn_area {width:100%; position: fixed; bottom:0; left:0; z-index:98;}
.top_btn_area .inner {position: relative; opacity: 0; visibility: hidden; transform: translateY(4rem); transition: opacity 0.2s linear, transform 0.2s linear;}
.top_btn_area.show .inner {opacity: 1; visibility: visible; transform: translateY(0);}

.top_btn_area .inner #topBtn {width:4.8rem; height:4.8rem; position: absolute; bottom:4rem; right:0; border-radius:100%; box-shadow:0 0.4rem 0.8rem rgba(0,0,0,0.08); background-color:var(--color-gray-800);}
.top_btn_area .inner #topBtn::before {content:""; width:100%; height:100%; -webkit-mask:url("/skin/site_m/responsive-food/svg/common/topBtn.svg")no-repeat center; -moz-mask:url("/skin/site_m/responsive-food/svg/common/topBtn.svg")no-repeat center; -o-mask:url("/skin/site_m/responsive-food/svg/common/topBtn.svg")no-repeat center; -ms-mask:url("/skin/site_m/responsive-food/svg/common/topBtn.svg")no-repeat center; mask:url("/skin/site_m/responsive-food/svg/common/topBtn.svg")no-repeat center; -webkit-mask-size:1.4rem; -moz-mask-size:1.4rem; -o-mask-size:1.4rem; -ms-mask-size:1.4rem; mask-size:1.4rem; background-color:var(--color-white); display: block; cursor: pointer;}
.top_btn_area.black .inner #topBtn {background-color:var(--color-white);}
.top_btn_area.black .inner #topBtn::before {background-color:var(--color-gray-800);}
.top_btn_area.blue .inner #topBtn {background-color:var(--color-white);}
.top_btn_area.blue .inner #topBtn::before {background-color:var(--color-gray-800);}


@media (hover: hover) {
	.top_btn_area .inner #topBtn {transition:all 0.2s;}
	.top_btn_area .inner #topBtn:hover {background-color:var(--color-action);}
    .top_btn_area.black .inner #topBtn:hover::before {background-color:var(--color-white);}

    .top_btn_area.blue .inner #topBtn:hover {background-color:var(--color-gray-800);}
    .top_btn_area.blue .inner #topBtn:hover::before {background-color:var(--color-white);}
}
@media (max-width:1023px) {
    .top_btn_area .inner {width:100%; transform:translateY(3rem);}
    .top_btn_area .inner #topBtn {width:4.2rem; height:4.2rem; bottom:3rem; right:3rem;}
    :has(#fixNav) .top_btn_area .inner #topBtn {bottom:11.7rem;}
}
@media (max-width:767px) {
	.top_btn_area .inner {transform:translateY(2.4rem);}
    .top_btn_area .inner #topBtn {width:3.8rem; height:3.8rem; bottom:2.4rem; right:2.4rem;}
    .top_btn_area .inner #topBtn::before {-webkit-mask-size:1.2rem; -moz-mask-size:1.2rem; -o-mask-size:1.2rem; -ms-mask-size:1.2rem; mask-size:1.2rem;}
    :has(#fixNav) .top_btn_area .inner #topBtn {bottom:10.7rem;}
    :has(.p_Vfixbtn) .top_btn_area .inner #topBtn {bottom:8rem;}
}
@media (max-width:600px) {
	.top_btn_area .inner { transform:translateY(2rem);}
    .top_btn_area .inner #topBtn {width:3.6rem; height:3.6rem; bottom:2rem; right:2rem;}
    :has(#fixNav) .top_btn_area .inner #topBtn {bottom:10.3rem;}
    :has(.p_Vfixbtn) .top_btn_area .inner #topBtn {bottom:7.6rem;}
}
@media (max-width:479px) {
    .top_btn_area .inner {transform:translateY(1.6rem);}
    .top_btn_area .inner #topBtn {width:3.4rem; height:3.4rem; bottom:1.6rem; right:1.6rem;}
    .top_btn_area .inner #topBtn::before {-webkit-mask-size:1rem; -moz-mask-size:1rem; -o-mask-size:1rem; -ms-mask-size:1rem; mask-size:1rem;}
    :has(#fixNav) .top_btn_area .inner #topBtn {bottom:8.8rem;}
    :has(.p_Vfixbtn) .top_btn_area .inner #topBtn {bottom:7.2rem;}
}
@media (max-width:420px) {
    :has(.p_Vfixbtn) .top_btn_area .inner #topBtn {bottom:6.9rem;}
}



footer {width:100%; padding:4.2rem 0; background-color:var(--color-gray-50);}
footer .sInner {position: relative; display:flex; flex-wrap:wrap;}
footer .footer_company-info {width:100%; max-width:64.5rem;}
footer .footer_company-info p {font-size:1.4rem; color:var(--color-gray-800); font-weight:800; line-height:2rem;}
footer .footer_company-info .footer_company-list {width:100%; margin-top:1.6rem; display:flex; flex-wrap:wrap; gap:0.4rem 1.6rem;}
footer .footer_company-info .footer_company-list span {display: block; font-size:1.2rem; color:var(--color-gray-600); font-weight:500; line-height:1.8rem;}
footer .footer_company-info .footer_company-list span a {color:inherit;}

footer ul.footer_policy {width:100%; margin-top:1.6rem;}
footer ul.footer_policy li {display:flex; gap:1.6rem;}
footer ul.footer_policy li a {display: block; font-size:1.2rem; color:var(--color-gray-600); font-weight:500; line-height:2.2rem;}
footer ul.footer_policy li a em {display: block; font-size:1.2rem; color:var(--color-gray-800); font-weight:700;}

footer .footer_copyright {font-size:1.4rem; color:var(--color-gray-800); font-weight:500; letter-spacing:-0.03rem; line-height:2.2rem; margin-top:4rem; display: block; width:100%; order:2;}

footer .footer_customer-center { position: absolute; top:0; right:0;}
footer .footer_customer-center dl {width:100%; display:flex; justify-content: flex-end; gap:0.8rem;}
footer .footer_customer-center dl + dl {margin-top:0.8rem;}
footer .footer_customer-center dl dt {font-size:1.4rem; color:var(--color-gray-800); font-weight:700; line-height:2rem;}
footer .footer_customer-center dl dd {font-size:1.4rem; color:var(--color-action); font-weight:700; line-height:2rem;}
footer .footer_customer-center dl dd a {color:inherit;}
footer .footer_customer-center span {display: block; text-align: right; font-size:1.2rem; color:var(--color-gray-500); line-height:1.8rem; margin-top:0.8rem;}

footer .footer_sns {position: absolute; bottom:-0.8rem; right:-0.8rem; display:flex; gap:1.6rem;}
footer .footer_sns a {width:4rem; height:4rem; -webkit-mask:url("/skin/site_m/responsive-food/svg/common/insta.svg")no-repeat center; -moz-mask:url("/skin/site_m/responsive-food/svg/common/insta.svg")no-repeat center; -o-mask:url("/skin/site_m/responsive-food/svg/common/insta.svg")no-repeat center; -ms-mask:url("/skin/site_m/responsive-food/svg/common/insta.svg")no-repeat center; mask:url("/skin/site_m/responsive-food/svg/common/insta.svg")no-repeat center; -webkit-mask-size:2.4rem; -moz-mask-size:2.4rem; -o-mask-size:2.4rem; -ms-mask-size:2.4rem; mask-size:2.4rem; background-color:var(--color-gray-400);}

@media (hover: hover) {
	footer .footer_sns a,
	footer ul.footer_policy li a {transition:all 0.2s;}
	footer .footer_sns a:hover {background-color:var(--color-gray-700);}
	footer ul.footer_policy li a:hover {opacity:0.5;}
    footer .footer_company-info .footer_company-list span a:hover {text-decoration: underline; text-underline-offset:0.2rem; color:var(--color-action);}
    footer .footer_customer-center dl dd a:hover {text-decoration: underline; text-underline-offset:0.2rem;}
}
@media (max-width:1023px) {
    :has(#fixNav) footer {padding-bottom:12.9rem;}
    footer .footer_company-info {order:2; margin-top:2.4rem;}

    footer ul.footer_policy {order:3;}

    footer .footer_copyright {order:4;}
    
    footer .footer_customer-center {position: static; order:1; width:100%;}
    footer .footer_customer-center dl {justify-content: flex-start;}
    footer .footer_customer-center span {text-align:left;}
}
@media (max-width:767px) {
    :has(#fixNav) footer {padding-bottom:12.5rem;}
}
@media (max-width:479px) {
    footer {padding:3.6rem 0;}
    :has(#fixNav) footer { padding-bottom:10.8rem;}
	footer .footer_copyright {margin-top:3.2rem;}
}



#fixNav {width:100%; position: fixed; bottom:0; left:0; background-color:var(--color-white); border-top:1px solid var(--color-gray-200); z-index:98; display:none;}
#fixNav ul {width:100%; display:flex;}
#fixNav ul li {width:20%;}
#fixNav ul li a {display: block; width:100%; padding:1.6rem 0; padding-bottom:2.4rem; text-align: center;}
#fixNav ul li a .icon {display: block; width:2.6rem; height:2.6rem; margin: auto; background-color:var(--color-gray-400); -webkit-mask-size:100%!important; -moz-mask-size:100%!important; -o-mask-size:100%!important; -ms-mask-size:100%!important; mask-size:100%!important;}
#fixNav ul li a.btn_home .icon {-webkit-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_home.svg")no-repeat; -moz-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_home.svg")no-repeat; -o-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_home.svg")no-repeat; -ms-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_home.svg")no-repeat; mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_home.svg")no-repeat;}
#fixNav ul li a.btn_store .icon {-webkit-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_store.svg")no-repeat; -moz-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_store.svg")no-repeat; -o-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_store.svg")no-repeat; -ms-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_store.svg")no-repeat; mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_store.svg")no-repeat;}
#fixNav ul li a.btn_contact .icon {-webkit-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_contact.svg")no-repeat; -moz-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_contact.svg")no-repeat; -o-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_contact.svg")no-repeat; -ms-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_contact.svg")no-repeat; mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_contact.svg")no-repeat;}
#fixNav ul li a.btn_portfolio .icon {-webkit-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_portfolio.svg")no-repeat; -moz-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_portfolio.svg")no-repeat; -o-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_portfolio.svg")no-repeat; -ms-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_portfolio.svg")no-repeat; mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_portfolio.svg")no-repeat;}
#fixNav ul li a.btn_order .icon {-webkit-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_order.svg")no-repeat; -moz-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_order.svg")no-repeat; -o-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_order.svg")no-repeat; -ms-mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_order.svg")no-repeat; mask:url("/skin/site_m/responsive-food/svg/common/ic_nav_order.svg")no-repeat;}
#fixNav ul li a .text {display: block; font-size:1.2rem; color:var(--color-gray-400); font-weight:600; line-height:1.5rem; margin-top:0.3rem;}

#fixNav ul li.hit a .icon {background-color: var(--color-gray-700);}
#fixNav ul li.hit a .text {color: var(--color-gray-700);}

@media (max-width:900px) {
    #fixNav {display: block;}
}
@media (max-width:767px) {
    #fixNav ul li a .icon {width:2.4rem; height:2.4rem;}
    #fixNav ul li a .text {font-size:1.1rem; line-height:1.4rem;}
}
@media (max-width:479px) {
    #fixNav ul li a {padding:1.2rem 0; padding-bottom:2rem;}
    #fixNav ul li a .icon {width:2.2rem; height:2.2rem;}
    #fixNav ul li a .text {font-size:1rem; line-height:1.3rem; margin-top:0.2rem;}
}


.c_pagi {margin-top:8rem;}
.c_pagi .inner {display:flex;}
.c_pagi span {display:inline-block; zoom:1; *display:inline;} 
.c_pagi .num {width:3.8rem; height:3.8rem; border:0; padding:0; font-size:1.6rem; font-weight:500; min-width:auto; color: var(--color-gray-700);}
.c_pagi .number {gap:0.8rem;}
.c_pagi .number .hit {background-color: var(--color-gray-800)!important; color:var(--color-white); cursor: default;}
.c_pagi .nextprev .btn .icon {width:3.8rem; height:3.8rem; position: relative; opacity:1; background:none!important;}
.c_pagi .nextprev .btn .icon::before {content:""; width:100%; height:100%; position: absolute; top:0; left:0; border-radius:100%;}
.c_pagi .nextprev .ic_prev .icon::before {background:url("/skin/site_m/responsive-food/svg/common/page_prev.svg")no-repeat center; background-size:1.8rem;}
.c_pagi .nextprev .ic_next .icon::before {background:url("/skin/site_m/responsive-food/svg/common/page_next.svg")no-repeat center; background-size:1.8rem;}

@media (hover: hover) {
    .c_pagi .num,
    .c_pagi .nextprev .click .ok {transition:all 0.2s;}
    .c_pagi .num:hover,
    .c_pagi .nextprev .click .ok:hover {background-color:var(--color-gray-100);}
}
@media (max-width:1023px) {
    .c_pagi {margin-top:7.2rem;}
}
@media (max-width:900px) {
    .c_pagi {margin-top:6.4rem;}
}
@media (max-width:767px) {
    .c_pagi {margin-top:5.6rem;}
    .c_pagi .num {width:3.6rem; height:3.6rem;}
    .c_pagi .nextprev .btn .icon {width:3.6rem; height:3.6rem;}
}
@media (max-width:600px) {
    .c_pagi {margin-top:5rem;}
    .c_pagi .num {width:3.5rem; height:3.5rem; font-size:1.5rem;}
    .c_pagi .nextprev .btn .icon {width:3.5rem; height:3.5rem;}
    .c_pagi .nextprev .ic_prev .icon::before,
    .c_pagi .nextprev .ic_next .icon::before {background-size:1.7rem;}
}
@media (max-width:479px) {
    .c_pagi {margin-top:4rem;}
    .c_pagi .num,
    .c_pagi .nextprev .btn .icon {width:3.3rem; height:3.3rem;}
}
@media (max-width:420px) {
    .c_pagi {margin-top:3.2rem;}
    .c_pagi .num {width:3.2rem; height:3.2rem; font-size:1.4rem;}
    .c_pagi .nextprev .btn .icon {width:3.2rem; height:3.2rem;}
    .c_pagi .nextprev .ic_prev .icon::before,
    .c_pagi .nextprev .ic_next .icon::before {background-size:1.6rem;}
}


#content {width:100%; padding-bottom:16rem;}

@media (max-width:767px) {
    #content {padding-bottom:14rem;}
}
@media (max-width:600px) {
    #content {padding-bottom:12rem;}
}
@media (max-width:479px) {
    #content {padding-bottom:11rem;}
}
@media (max-width:420px) {
    #content {padding-bottom:10rem;}
}




/* 포트폴리오 상세 팝업 */
#portfolioDetail {width:100%; height:100%; position: fixed; top:0; left:0; z-index:10000; display:none; background-color:rgba(0,0,0,0.4);}
#portfolioDetail.popupShow {display: block;}
#portfolioDetail .portfolioDetailLayout {width:100%; height:100%;}
#portfolioDetail .portfolioDetailLayout .portfolioDetailContainer {width:100%; height:100%; padding:5rem 3rem; display:flex; align-items: center; justify-content: center; z-index:2;}

#portfolioDetail .pdContent {width:100%; max-width:72.8rem;}
#portfolioDetail .pdContent .imgSlider {width:100%; position: relative; padding:0 6.4rem;}
#portfolioDetail .pdContent .imgSlider .js_details_img_slide {width:100%; overflow: hidden; -webkit-radial-gradient(white, black); isolation: isolate; border-radius:2.4rem;}
#portfolioDetail .pdContent .imgSlider .js_details_img_slide .swiper-slide {width:100%;}
#portfolioDetail .pdContent .imgSlider .js_details_img_slide .swiper-slide div {width:100%;}
#portfolioDetail .pdContent .imgSlider .js_details_img_slide .swiper-slide div img {display: block; width:100%; height:100%; object-fit: cover;}

#portfolioDetail .pdContent .imgSlider .js_details_img_slide .swiper-pagination {bottom:2.4rem; width:100%; display:flex; justify-content: center; gap:0.8rem;}
#portfolioDetail .pdContent .imgSlider .js_details_img_slide .swiper-pagination .swiper-pagination-bullet {margin:0; width:0.8rem; height:0.8rem; background-color:#08040466; border-radius:10rem; opacity:1;}
#portfolioDetail .pdContent .imgSlider .js_details_img_slide .swiper-pagination .swiper-pagination-bullet-active {width:4rem; background-color:#080404CC;}

#portfolioDetail .pdContent .imgSlider .nav_btn {position: absolute; top:50%; width:4rem; height:4rem; border-radius:100%; transform: translateY(-50%); cursor: pointer; display:flex; justify-content: center; background-color:var(--color-white);}
#portfolioDetail .pdContent .imgSlider .nav_btn::before {content:""; width:100%; height:100%;}
#portfolioDetail .pdContent .imgSlider .slide_prev_btn {left:0;}
#portfolioDetail .pdContent .imgSlider .slide_prev_btn::before {-webkit-mask:url("/skin/site_m/responsive-food/svg/product/btn_prev.svg")no-repeat center; -moz-mask:url("/skin/site_m/responsive-food/svg/product/btn_prev.svg")no-repeat center; -o-mask:url("/skin/site_m/responsive-food/svg/product/btn_prev.svg")no-repeat center; -ms-mask:url("/skin/site_m/responsive-food/svg/product/btn_prev.svg")no-repeat center; mask:url("/skin/site_m/responsive-food/svg/product/btn_prev.svg")no-repeat center; -webkit-mask-size:1rem; -moz-mask-size:1rem; -o-mask-size:1rem; -ms-mask-size:1rem; mask-size:1rem; background-color:var(--color-gray-600);}
#portfolioDetail .pdContent .imgSlider .slide_next_btn {right:0;}
#portfolioDetail .pdContent .imgSlider .slide_next_btn::before {-webkit-mask:url("/skin/site_m/responsive-food/svg/product/btn_next.svg")no-repeat center; -moz-mask:url("/skin/site_m/responsive-food/svg/product/btn_next.svg")no-repeat center; -o-mask:url("/skin/site_m/responsive-food/svg/product/btn_next.svg")no-repeat center; -ms-mask:url("/skin/site_m/responsive-food/svg/product/btn_next.svg")no-repeat center; mask:url("/skin/site_m/responsive-food/svg/product/btn_next.svg")no-repeat center; -webkit-mask-size:1rem; -moz-mask-size:1rem; -o-mask-size:1rem; -ms-mask-size:1rem; mask-size:1rem; background-color:var(--color-gray-600);}


#portfolioDetail .pdContent .btn {width:100%; max-width:31.4rem; margin: auto; margin-top:2.4rem; display:flex; flex-wrap:wrap; justify-content: center;}
#portfolioDetail .pdContent .btn a.link {width:100%; height:5.6rem; background-color:var(--color-white); border-radius:10rem; display:flex; align-items: center; justify-content: center; font-size:1.6rem; color:var(--color-gray-800); font-weight:700; letter-spacing:-0.02em; line-height:2.4rem;}
#portfolioDetail .pdContent .btn a.close {width:4rem; height:4rem; margin-top:2.4rem; background:url("/skin/site_m/responsive-food/svg/common/ic_close_white.svg")no-repeat center rgba(8,4,4,0.4); background-size:1.8rem; border-radius:100%;}


@media (hover: hover) {
    #portfolioDetail .pdContent .imgSlider .nav_btn,
    #portfolioDetail .pdContent .imgSlider .nav_btn::before,
    #portfolioDetail .pdContent .btn a.link,
    #portfolioDetail .pdContent .btn a.close {transition:all 0.2s;}

    #portfolioDetail .pdContent .imgSlider .nav_btn:hover {background-color:var(--color-gray-200);}
    #portfolioDetail .pdContent .imgSlider .nav_btn:hover::before {background-color:var(--color-gray-800);}
    #portfolioDetail .pdContent .btn a.link:hover {background-color:var(--color-action); color:var(--color-white)}
    #portfolioDetail .pdContent .btn a.close:hover {background-color:var(--color-gray-800);}
}
@media (max-width:900px) {
    #portfolioDetail .pdContent {max-width:66.8rem;}
}
@media (max-width:767px) {
    #portfolioDetail .pdContent {max-width:100%;}
    #portfolioDetail .pdContent .imgSlider {padding:0 5.6rem;}
    #portfolioDetail .pdContent .imgSlider .js_details_img_slide {border-radius:2rem;}
    
    #portfolioDetail .pdContent .imgSlider .js_details_img_slide .swiper-pagination {bottom:2rem;}
    #portfolioDetail .pdContent .imgSlider .js_details_img_slide .swiper-pagination .swiper-pagination-bullet-active {width:3.6rem;}

    #portfolioDetail .pdContent .imgSlider .nav_btn {width:3.7rem; height:3.7rem; transform: translateY(-50%) translateY(-0.05rem);}
    #portfolioDetail .pdContent .imgSlider .slide_prev_btn::before,
    #portfolioDetail .pdContent .imgSlider .slide_next_btn::before {-webkit-mask-size:0.9rem; -moz-mask-size:0.9rem; -o-mask-size:0.9rem; -ms-mask-size:0.9rem; mask-size:0.9rem;}

    #portfolioDetail .pdContent .btn {max-width:24rem;}
    #portfolioDetail .pdContent .btn a.link {height:5.4rem;}
    #portfolioDetail .pdContent .btn a.close {width:3.6rem; height:3.6rem; background-size:1.6rem;}
}
@media (max-width:600px) {
    #portfolioDetail .pdContent .imgSlider {padding:0;}
    #portfolioDetail .pdContent .imgSlider .js_details_img_slide {border-radius:1.6rem;}
    #portfolioDetail .pdContent .imgSlider .nav_btn {width:3.4rem; height:3.4rem; transform: translateY(-50%); background-color:rgba(255,255,255,0.4);}
    #portfolioDetail .pdContent .imgSlider .slide_prev_btn {left:1.6rem;}
    #portfolioDetail .pdContent .imgSlider .slide_next_btn {right:1.6rem;}
    #portfolioDetail .pdContent .imgSlider .slide_prev_btn::before,
    #portfolioDetail .pdContent .imgSlider .slide_next_btn::before {-webkit-mask-size:0.8rem; -moz-mask-size:0.8rem; -o-mask-size:0.8rem; -ms-mask-size:0.8rem; mask-size:0.8rem;}

    @media (hover: hover) {
        #portfolioDetail .pdContent .imgSlider .nav_btn:hover {background-color:var(--color-gray-800);}
        #portfolioDetail .pdContent .imgSlider .nav_btn:hover::before {background-color:var(--color-white);}
    }

    #portfolioDetail .pdContent .btn {max-width:20rem;}
    #portfolioDetail .pdContent .btn a.link {height:5rem; font-size:1.5rem;}
}
@media (max-width:479px) {
    #portfolioDetail .portfolioDetailLayout .portfolioDetailContainer {padding:4rem 2.2rem;}
    #portfolioDetail .pdContent .imgSlider .js_details_img_slide {border-radius:1.4rem;}
    #portfolioDetail .pdContent .imgSlider .js_details_img_slide .swiper-pagination {bottom:1.6rem;}

    #portfolioDetail .pdContent .imgSlider .nav_btn {width:3rem; height:3rem;}
    #portfolioDetail .pdContent .imgSlider .slide_prev_btn {left:1.2rem;}
    #portfolioDetail .pdContent .imgSlider .slide_next_btn {right:1.2rem;}
    #portfolioDetail .pdContent .imgSlider .slide_prev_btn::before,
    #portfolioDetail .pdContent .imgSlider .slide_next_btn::before {-webkit-mask-size:0.7rem; -moz-mask-size:0.7rem; -o-mask-size:0.7rem; -ms-mask-size:0.7rem; mask-size:0.7rem;}

    #portfolioDetail .pdContent .btn {max-width:none;}
    #portfolioDetail .pdContent .btn a.link {height:4.8rem;}
    #portfolioDetail .pdContent .btn a.close {width:3.4rem; height:3.4rem; background-size:1.4rem; margin-top:2rem;}
}
@media (max-width:420px) {
    #portfolioDetail .portfolioDetailLayout .portfolioDetailContainer {padding:3.6rem 2rem;}
}



/* brandKit 상세 팝업 */
#brandKitDetail {width:100%; height:100%; position: fixed; top:0; left:0; z-index:10000; display:none; background-color:rgba(0,0,0,0.4);}
#brandKitDetail.popupShow {display: block;}
#brandKitDetail .brandKitLayout {width:100%; height:100%;}
#brandKitDetail .brandKitLayout .brandKitContainer {width:100%; height:100%; padding:5rem 3rem; display:flex; align-items: center; justify-content: center; z-index:2;}

#brandKitDetail .bkContainer {width:100%; max-width:80rem;}
#brandKitDetail .bkContainer .bkContent {width:100%; border-radius:2.4rem; overflow: hidden; -webkit-radial-gradient(white, black); isolation: isolate; background-color:var(--color-gray-50);}
#brandKitDetail .bkContainer .bkContent .thumb {width:100%; position: relative; aspect-ratio:3/2; overflow: hidden; -webkit-radial-gradient(white, black); isolation: isolate;}
#brandKitDetail .bkContainer .bkContent .thumb .img {width:100%; height:100%; display:flex; align-items: center; justify-content: center;}
#brandKitDetail .bkContainer .bkContent .thumb .img img {display: block; width:100%; height:100%; object-fit: cover;}
#brandKitDetail .bkContainer .bkContent .components {width:100%; border-radius:2.4rem; padding:2.4rem;}
#brandKitDetail .bkContainer .bkContent .components .cp_tit {width:100%; display:flex; justify-content: center; align-items: center; gap:0.5rem;}
#brandKitDetail .bkContainer .bkContent .components .cp_tit p {font-size:1.7rem; color:var(--color-gray-800); font-weight:600; letter-spacing:-0.03em; line-height:2.6rem;}
#brandKitDetail .bkContainer .bkContent .components .cp_tit em {font-size:1.4rem; color:var(--color-gray-500); font-weight:500; line-height:2rem;}
#brandKitDetail .bkContainer .bkContent .components .cp_list {width:100%; display:flex; justify-content: center; flex-wrap:wrap; gap:0.5rem 2.4rem; margin-top:1.6rem; font-size:1.6rem; color:var(--color-gray-700); font-weight:500; letter-spacing:-0.02em; line-height:2.4rem;}
#brandKitDetail .bkContainer .bkContent .components .cp_list a {position: relative; padding-right:2rem;}
#brandKitDetail .bkContainer .bkContent .components .cp_list a::after {content:""; width:1.2rem; height:100%; position: absolute; top:0; right:0; mask:url("/skin/site_m/responsive-food/svg/product/blank.svg")no-repeat center; mask-size:100%; background-color:var(--color-gray-600);}

#brandKitDetail .bkContainer .btn {width:100%; max-width:31.4rem; margin: auto; margin-top:2.4rem; display:flex; flex-wrap:wrap; justify-content: center;}
#brandKitDetail .bkContainer .btn a.link {width:100%; height:5.6rem; background-color:var(--color-white); border-radius:10rem; display:flex; align-items: center; justify-content: center; font-size:1.6rem; color:var(--color-gray-800); font-weight:700; letter-spacing:-0.02em; line-height:2.4rem;}
#brandKitDetail .bkContainer .btn a.close {width:4rem; height:4rem; margin-top:2.4rem; background:url("/skin/site_m/responsive-food/svg/common/ic_close_white.svg")no-repeat center rgba(8,4,4,0.4); background-size:1.8rem; border-radius:100%;}


@media (hover: hover) {
    #brandKitDetail .bkContainer .bkContent .components .cp_list a,
    #brandKitDetail .bkContainer .bkContent .components .cp_list a::before,
    #brandKitDetail .bkContainer .bkContent .components .cp_list a::after,
    #brandKitDetail .bkContainer .btn a.link,
    #brandKitDetail .bkContainer .btn a.close {transition:all 0.2s;}

    #brandKitDetail .bkContainer .bkContent .components .cp_list a:hover {color:var(--color-action);}
    #brandKitDetail .bkContainer .bkContent .components .cp_list a:hover::before,
    #brandKitDetail .bkContainer .bkContent .components .cp_list a:hover::after {background-color:var(--color-action);}
    #brandKitDetail .bkContainer .btn a.link:hover {background-color:var(--color-action); color:var(--color-white)}
    #brandKitDetail .bkContainer .btn a.close:hover {background-color:var(--color-gray-800);}
}
@media (max-width:900px) {
    #brandKitDetail .bkContainer .bkContent {max-width:none;}
}
@media (max-width:767px) {
    #brandKitDetail .bkContainer .bkContent {border-radius:2rem;}
    #brandKitDetail .bkContainer .bkContent .thumb {aspect-ratio:4/3;}
    #brandKitDetail .bkContainer .bkContent .components {padding:2rem;}
    #brandKitDetail .bkContainer .bkContent .components .cp_tit p {font-size:1.6rem;}
    #brandKitDetail .bkContainer .bkContent .components .cp_list {gap:0.4rem 1.8rem; font-size:1.5rem; line-height:2.3rem; margin-top:1.2rem;}
    #brandKitDetail .bkContainer .bkContent .components .cp_list a {padding-right:1.9rem;}
    #brandKitDetail .bkContainer .bkContent .components .cp_list a::after {width:1.1rem;}

    #brandKitDetail .bkContainer .btn {max-width:24rem;}
    #brandKitDetail .bkContainer .btn a.link {height:5.4rem;}
    #brandKitDetail .bkContainer .btn a.close {width:3.6rem; height:3.6rem; background-size:1.6rem;}
}
@media (max-width:600px) {
    #brandKitDetail .bkContainer .bkContent {border-radius:1.6rem;}
    #brandKitDetail .bkContainer .bkContent .components {padding:1.6rem;}
    #brandKitDetail .bkContainer .bkContent .components .cp_tit {justify-content: flex-start;}
    #brandKitDetail .bkContainer .bkContent .components .cp_tit p {font-size:1.5rem; line-height:2.3rem;}
    #brandKitDetail .bkContainer .bkContent .components .cp_tit em {font-size:1.3rem; line-height:1.8rem;}
    #brandKitDetail .bkContainer .bkContent .components .cp_list {gap:0.3rem 1.8rem; font-size:1.4rem; line-height:2.2rem; justify-content: flex-start; margin-top:1rem;}
    #brandKitDetail .bkContainer .bkContent .components .cp_list a {padding-right:1.8rem;}
    #brandKitDetail .bkContainer .bkContent .components .cp_list a::after {width:1rem;}

    #brandKitDetail .bkContainer .btn {max-width:20rem;}
    #brandKitDetail .bkContainer .btn a.link {height:5rem; font-size:1.5rem;}
}
@media (max-width:479px) {
    #brandKitDetail .brandKitLayout .brandKitContainer {padding:4rem 2.2rem;}
    #brandKitDetail .bkContainer .bkContent {border-radius:1.4rem;}
    #brandKitDetail .bkContainer .bkContent .thumb {aspect-ratio:5/4;}
    #brandKitDetail .bkContainer .bkContent .components .cp_list {gap:0.5rem 1.8rem; margin-top:0.8rem;}
    #brandKitDetail .bkContainer .bkContent .components .cp_list a {padding-right:1.7rem;}
    #brandKitDetail .bkContainer .bkContent .components .cp_list a::before {content:""; width:100%; height:1px; background-color:var(--color-gray-600); position: absolute; bottom:0.2rem; left:0;}

    #brandKitDetail .bkContainer .btn {max-width:none; margin-top:1.6rem;}
    #brandKitDetail .bkContainer .btn a.link {height:4.8rem;}
    #brandKitDetail .bkContainer .btn a.close {width:3.4rem; height:3.4rem; background-size:1.4rem; margin-top:1.6rem;}
}
@media (max-width:420px) {
    #brandKitDetail .brandKitLayout .brandKitContainer {padding:3.6rem 2rem;}
}