/* PC-first (±âº» = PC) */

/* ==========================
COMMON
========================== */
:root {
	--key-color: #F76F6F;
	--text-color: #333;
}

html {
    scrollbar-gutter: stable;
}
/* ÁÖ°£±Þ½ÄÇ¥ - ÇÐ¿øº° Å¾ */
.food-top {position: relative; width: 100%; padding: 80px 0 60px; background: linear-gradient(180deg, #FFF2F2 0%, #FAF6F5 106.15%); overflow: hidden;}
.food-top .tit-group {letter-spacing: -0.2px; text-align: center;}
.food-top .tit-group em{display: inline-flex; padding: 8px 0; margin-bottom: 24px;  border-top: 1px solid #B1B1B1; border-bottom: 1px solid #B1B1B1; font-weight: 500; font-size: 22px;}
.food-top .tit-group h3 {margin-bottom: 40px; background: radial-gradient(186.81% 221.68% at 7.42% -117.86%, #FFCDAE 0%, #FF5C5C 100%); background-clip: text; -webkit-background-clip: text;-webkit-text-fill-color: transparent; font-size: 84px; font-weight: 800; line-height: 1;}
.food-top .tit-group p {font-size: 20px; line-height: 1.4;}
.food-top .tit-group p b {font-weight: 700;}

.food-swiper {margin: 30px auto 0; max-width: 1024px; overflow: hidden;}
.food-swiper .swiper-slide {display: flex; border-radius: 20px; overflow: hidden;}
.food-swiper .left {width: calc(100% - 344px);}
.food-swiper .right {flex: 1; width: 344px; padding: 40px; background: #fff;}
.food-swiper .right strong {display: flex; margin-bottom: clamp(4px, calc(4px + (12 - 4) * ((100vw - 360px) / 840)), 12px); font-size: 28px; line-height: 1.3; letter-spacing: -0.7px;}
.food-swiper .right strong em {margin-right: 0.4em; font-weight: 200;}
.food-swiper .right p {font-size: 18px; color: #555; letter-spacing: -0.18px;} 
.food-swiper .swiper-slide img {width: 100%;}
.food-swiper .swiper-pagination {position: initial; margin-top: 20px;}
.food-page .food-swiper .swiper-pagination-bullet {margin:0 3px;background:rgba(0, 0, 0, 0.20);opacity: 1;}
.food-page .food-swiper .swiper-pagination-bullet-active {width:29px;border-radius: 100px;background:#FF5C5C;}

.food-top .fixed-menu ul {display: flex; gap: 12px; border-radius: 8px 0 0 8px; font-size: 14px; letter-spacing: -0.1px ;}
.food-top .fixed-menu ul li:nth-child(1) a {border: 1px solid; color: var(--key-color); background: #fff; }
.food-top .fixed-menu ul li:nth-child(2) a {color: #fff; background: var(--key-color); }
.food-top .fixed-menu ul li a {width: 100%; padding: 16px; text-align: left;}
/* ==========================
ÁÖ°£½Ä´ÜÇ¥ º»¹®
========================== */
/* ³¯Â¥ ³×ºñ */
.food-weekly-sec {padding:60px 0 70px}
.food-weekly-sec .container {max-width: 1200px; width: 100%; margin: 0 auto; box-sizing: border-box;}
.weekly-nav {display:flex;align-items:center;justify-content:center;gap:80px;margin-bottom:35px}
.weekly-tit {min-width: 240px; font-size:32px;font-weight:700;color:#333;letter-spacing:-0.64px;line-height:1;white-space:nowrap;text-align: center;}
.btn-week {display:inline-flex;align-items:center;gap:10px;font-size:20px;color:#555;letter-spacing:-0.2px;}
.btn-week.btn-disabled {color: #b1b1b1; pointer-events: none;}
.btn-week.btn-disabled .ico-chev {border-bottom: 1.5px solid #b1b1b1; border-left: 1.5px solid #b1b1b1;}
.btn-week .ico-btn-circle {display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;border:1px solid #DBDBDB;}
.btn-week .ico-chev {display:block;width:9px;height:9px;border-bottom:1.5px solid #555;border-left:1.5px solid #777;transform:translateX(1px) rotate(45deg)}
.btn-next .ico-chev {transform: translateX(-1px) rotate(-135deg)}
/* ÅÇ */
.food-day-cont {}
.food-tab {background:#ededed}
.food-tab ul {display:flex;}
.food-tab .tab-empty {width: 94px;border-right:1px solid #dbdbdb}
.food-tab li:not(.tab-empty) {flex:1; width: auto;}
.food-tab li:not(.tab-empty) {border-left:1px solid #dbdbdb}
.food-tab li button,
.food-tab li a {display:block;width:100%;padding:16px 8px;background:#ededed; font-weight:600; font-size: 16px; color:#777;letter-spacing:-0.4px;line-height:1.3; cursor: inherit; text-align: center;}
.food-tab li.is-active button,
.food-tab li.is-active a {background:#f76f6f;color:#fff;font-weight:700}
/* PC ÀüÃ¼ ½Ä´ÜÇ¥ */
.food-table {border-top:1px solid #e5e5e5}
.food-table .table-row {display:flex;}
.food-table .cell-th {display:flex;align-items:center;justify-content:center;width: 94px;background:#f5f5f5;border-bottom:1px solid #e5e5e5;font-weight:600;letter-spacing:-0.16px;}
.food-table .cell-list {display:flex;flex:1;}
.food-table .cell-day {flex:1; padding:14px;border-left:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5;font-size:14px;line-height:1.4;color:#555;letter-spacing:-0.14px;word-break:break-all}
.food-table .cell-day.is-today {}
.food-table .cell-day .no-data {display: none;}
.food-table .cell-day .no-diet {display: flex; flex-direction: column; gap: 6px; width: 100%; height: 100%; align-items: center; justify-content: center; font-weight: 400; color: #B1B1B1;}
/* ½Ä´Ü ¾øÀ½ */
.food-table-empty { border-top: 1px solid #e5e5e5;  border-bottom: 1px solid #e5e5e5;}
.food-empty-cont { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px; min-height: 380px;}
.ico-empty {}
.food-empty-cont p {font-size:16px;color:#333;letter-spacing:-0.4px;line-height:1.1}

/* ¿ø»ê */
.food-origin {background:#f8f8f8;border-radius:10px;overflow:hidden;margin-top:35px}
.food-origin dl {margin:0}
.food-origin dt {display:flex;align-items:center;justify-content:space-between;padding:clamp(11px, calc(11px + (14 - 11) * ((100vw - 360px) / 840)), 14px) clamp(16px, calc(16px + (20 - 16) * ((100vw - 360px) / 840)), 20px);font-size:16px;font-weight:700;color:#333;letter-spacing:-0.16px;line-height:1.4;cursor:pointer;}
.food-origin dt::after {content:'';display:block;width:8px;height:8px;border-top:2px solid #7E7E7E;border-right:2px solid #7E7E7E;transform:rotate(135deg);flex-shrink:0;margin-top:-4px;transition:transform 0.2s}
.food-origin.is-open dt::after {transform:rotate(-45deg);margin-top:4px}
.food-origin dd {display:none;border-top:1px solid #e5e5e5;padding:clamp(16px, calc(16px + (20 - 16) * ((100vw - 360px) / 840)), 20px) clamp(16px, calc(16px + (36 - 16) * ((100vw - 360px) / 840)), 36px)}
.food-origin ul {list-style:disc;padding-left:22px}
.food-origin ul li {list-style:disc; font-size:clamp(13px, calc(13px + (14 - 13) * ((100vw - 360px) / 840)), 14px);line-height:1.6;color:#555;letter-spacing:-0.14px}
.food-origin ul li strong {display:block;font-weight:700}
/* À¯ÀÇ»çÇ× */
.food-attention {margin-top: 30px; padding:20px clamp(24px, calc(24px + (36 - 24) * ((100vw - 360px) / 840)), 36px); border:1px solid #e5e5e5;border-radius:10px; font-size:14px;line-height:1.6;color:#777;letter-spacing:-0.14px;}
.food-attention p {}
.attention-link {font-size:clamp(13px, calc(13px + (15 - 13) * ((100vw - 360px) / 840)), 15px);font-weight:500;color:#777;letter-spacing:-0.375px;text-decoration:underline;line-height:1.1;}
.attn-div {margin-top: 21px;}
.attention-link:hover {text-decoration: underline;}

.food-btm {width: 100%; padding: 40px 0; background: url("https://russeldata.megastudy.net/campus/images/russel/campus_common/campus/weekly_food/fd_btm_bg.jpg") no-repeat center/cover; font-weight: 600; font-size: 28px; color: #333; letter-spacing: -0.2px; line-height: 1.4;}

/* PC & TABLET */
@media (min-width:768px){
	.food-top .fixed-menu {position: absolute; right: 0; top: 19.5%; z-index: 2;}
	.food-top .fixed-menu ul {flex-direction: column;}
	.food-page .food-top .fixed-menu ul > li a{border-radius: 8px 0 0 8px; border-right: none;}
	.food-top .fixed-menu ul strong {font-weight: 700; font-size: 18px; line-height: 1.2;}
}
/* TA */
@media (min-width:768px) and (max-width:1199px){
	.food-swiper .swiper-wrapper {margin-left: 25%;}

	.food-table .table-row:has(.cell-day.is-today .no-diet) .cell-th,
	.food-table .table-row:has(.cell-day.is-today .no-diet) .no-diet {display: none;}

	.food-table .cell-day {font-size: 16px;}

}
/* PC */
@media (min-width:1200px){
	.food-top .fixed-menu {top: 27%;}
	.food-table .cell-day.active {background:#fff9f9;color:#333;font-weight:500}
	.food-table:not(.food-table-empty) .food-empty-cont {display: none;}
	
}
/* TA */
@media (max-width:1199px) {
	.food-swiper {max-width: none;}
	.food-swiper .swiper-slide {flex-direction: column;}
	.food-swiper .left {width: 100%;}
	.food-swiper .right {width: 100%; padding: 20px 24px 0; padding-bottom: 0; min-height: 147px;}
	.food-swiper.pyeongchon .right, 
	.food-swiper.bucheon .right,
	.food-swiper.bundang  .right {min-height: 178px ;}
	.food-swiper.live  .right {min-height: 204px ;}
	.food-swiper .right strong {font-size: 20px;}
	.food-swiper .right p{font-size: 14px;}
	
	.weekly-nav {gap:80px}
	.food-tab .tab-empty {display: none;}

	.food-table {display: grid; grid-template-columns: repeat(2, 1fr); padding: 24px 24px 0; border-top: none;}
	.food-table .table-row {}
	.food-table .cell-day:has(.no-data) {padding: 0;}
	.food-table .cell-day {padding: 16px 32px;}
	.food-table .cell-day.is-today {background: #fff;}

	.food-table .table-row {border: 1px solid #e5e5e5; margin: -1px;} 
	.food-table .cell-th,
	.food-table .cell-td,
	.food-table .cell-day {border:none !important;}
	.food-table .cell-th {border-right: 1px solid #e5e5e5 !important;}

	.food-table .cell-day:not(.is-today) {display: none; }
	.food-table .cell-day .no-data {display: flex; align-items: center; justify-content: center; height: 100%; background: #F8F8F8 url('https://russeldata.megastudy.net/campus/images/russel/campus_common/campus/weekly_food/fd_nodata.png') no-repeat center bottom/cover; font-weight: 400; font-size: 16px; color: #777;}

	.food-table-empty {display: block; padding: 0; border-bottom: none;}
	.food-table-empty .table-row {display: none;}
	.food-table .table-row:has(.cell-day.is-today .food-empty-cont) {grid-column: 1/span 2; border: none;}
	.food-table .table-row:has(.cell-day.is-today .food-empty-cont) + .table-row {display: none;;}
	.food-table .cell-day.is-today:has(.food-empty-cont) {min-height: 268px;}
	.food-empty-cont {min-height: 268px;}

	.food-origin,
	.food-attention,
	.attn-div {margin-left: 24px; margin-right: 24px;}
}

/* MO */
@media (max-width:767px) {
	.food-top {padding: 60px 0 40px;}
	.food-top .tit-group em {margin-bottom: 18px; font-size: 17px;}
	.food-top .tit-group h3 {margin-bottom: 24px; font-size: 58px;}
	.fixed-menu {display: flex; justify-content: center;}
	.food-top .fixed-menu {margin-bottom: 40px;}
	.food-top .fixed-menu ul li {}
	.food-top .fixed-menu ul li a,
	.food-top .fixed-menu ul li a strong {font-weight: 600;}
	.food-top .fixed-menu ul li a {min-width: 143px; padding: 9px 14px; border-radius: 4px; text-align: center;}
	.food-top .tit-group p {font-size: 16px;}
	.food-swiper {padding: 24px 16px 0; margin: 0;}
	.food-swiper .swiper-pagination {margin-top: 12px;}
	.food-page .food-swiper .swiper-pagination-bullet {width: 6px; height: 6px;}
	.food-page .food-swiper .swiper-pagination-bullet-active {width: 16px;}

	.food-weekly-sec {padding:40px 0 50px; }
	.weekly-nav {gap:0px;padding:0 16px; margin-bottom: 20px;}
	.weekly-tit {min-width: 175px; font-weight: 600; font-size:22px;}
	.btn-week {gap:6px;font-size:14px;}
	.btn-week .ico-btn-circle {width:24px;height:24px;}
	.btn-week .ico-chev {width:8px;height:8px}
	.food-tab {overflow: hidden;}
	.food-tab ul {}
	.food-tab li:not(.tab-empty) {flex:none;}
	.food-tab li button,
	.food-tab li a {padding:14px 22px;font-size:14px; touch-action: pan-x;}

	.food-table {grid-template-columns: 1fr; padding: 16px; }
	.food-table .cell-day {padding-left: 24px;padding-right: 24px;}
	.food-table .cell-th {border-left: 1px solid #e5e5e5; font-size: 15px;}
	.food-table .cell-day .no-diet {display: none;}
	.food-table .cell-day .no-data {display: none;}
	.food-table .table-row:has(.cell-day.is-today .no-diet) .cell-th {display: none;}
	.food-table .table-row:has(.cell-day.is-today .no-data) {
        display: none;
    }
	
	.food-table-empty {padding: 0;}
	.food-empty-cont {}
	.food-empty-cont p {font-size: 14px;}

	.food-origin, .food-attention, .attn-div {margin-left: 16px; margin-right: 16px;}
	.food-origin {margin-top: 5px;}
	.food-origin dt {font-size: 14px;}
	.food-origin dd {border-top-color:#dbdbdb}
	.food-attention {margin-top: 20px; font-size: 13px;}
	.food-attention p {font-size: 13px;}
	.food-btm {padding: 20px 0; font-size: 22px; background-image: url("https://russeldata.megastudy.net/campus/images/russel/campus_common/campus/weekly_food/fd_btm_bg_m.jpg");}
	.food-btm strong {font-weight: 600;}
}