@charset "utf-8";

/* 컨테이너 영역 */
#container {background: #f3f4f5; }
#container .inner {margin:0 auto; max-width: 192rem;}
#container > .inner:not(.in-between) {padding-bottom: 0;}

/* 메인 콘텐츠 영역 */
.main-content { display: flex; flex-direction: row;max-width: 192rem;margin: 0 auto; /*display: grid; grid-template-columns: 63rem 1fr; gap:3rem;*/ align-items: start;}

/* 좌측 컬럼 */
.left-column { max-width: 63rem; height: 98rem; padding:8rem 6rem 0 6rem; box-sizing: border-box; background-image: url(../../../img/frt/main/aside.png); background-repeat: no-repeat; background-position: center center; background-size: cover; position: sticky; top: 0; align-self: flex-start;}

/* 검색 영역 */
.search-section {margin-bottom:4.9rem;}
.search-box {position: relative; margin-bottom:2rem;}
.search-input {width: 100%; height: 7.4rem; padding: 0.1rem 4.2rem 0 2.5rem !important; border: none; border-radius:1.2rem; background: #fff; font-size: 1.8rem; color: #333;box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.3);}
.search-input[placeholder] {color: #333;  width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: inline-block;}
.search-input:focus {outline: none; }
.search-btn {position: absolute; right: 2rem; top: 50%; transform: translateY(-50%); border: none; background: transparent; cursor: pointer; display: flex; align-items: center; justify-content: center;}
.search-btn .svg-icon {width: 3rem; height: 3rem; webkit-mask-image: none !important; mask-image: none !important;background:url(../../../img/frt/main/sch_btn.png); background-repeat: no-repeat; background-position: center center; background-size: contain; }

/* 인기검색어어 영역 */
.quick-links {display: flex; gap:1rem; flex-direction: row; align-items: flex-start;  align-content: center;/*flex-wrap: wrap;*/}
.quick-buttons-wrapper {display: flex; gap: 0.6rem; flex-wrap: wrap;}
.quick-links h3 {color:#fff;font-size:1.7rem; font-weight:400;padding:0.4rem 0 0 3rem;background:url(../../../img/frt/main/fam-search-icon.png); background-repeat: no-repeat; background-position: left center;}
.quick-link-btn {display: flex; align-items: center; min-width: 0;width:12rem; padding: 0.5rem 1.2rem 0.3rem 1.3rem; border: 1px solid #fff; text-align: center;border-radius: 2.2rem; background: transparent; color: #fff; font-size: 1.6rem; font-weight: 400; cursor: pointer; transition: all 0.3s ease; }
.quick-link-btn span {display: block; flex-grow: 1;  text-align: center; overflow: hidden;text-overflow: ellipsis; white-space: nowrap;}
.quick-link-btn .svg-icon {width: 2rem; height: 2rem;  flex-shrink: 0;}
.quick-link-btn:hover {background: rgba(255, 255, 255, 0.1);}

/* 준비 섹션 */
.prepare-section .section-title {font-size: 2.4rem;font-weight:400; color: #fff; margin-bottom: 2.2rem; line-height: 1.4; letter-spacing: -0.1rem;}
.prepare-section .section-title span {font-weight: 600; }
.feature-cards {display: grid; grid-template-columns: repeat(2, 1fr); gap:2rem;}
.feature-card {position: relative; background: transparent; border: 1px solid #f48f97; border-radius: 1rem; padding:1rem 2rem; display: flex; align-items: flex-start; cursor: pointer; transition: all 0.2s ease;}
.feature-card:hover {background: #fff;box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);}
.feature-card:hover .card-title {color: #a41543;}
.feature-card:hover .card-desc {color: #a41543;}
.feature-card:hover .ico-fflag {background:url(../../../img/frt/main/ico-fflag-on.png);}
.feature-card:hover .ico-graph {background:url(../../../img/frt/main/ico-graph-on.png);}
.feature-card:hover .ico-talk {background:url(../../../img/frt/main/ico-talk-on.png);}
.feature-card:hover .ico-earth {background:url(../../../img/frt/main/ico-earth-on.png);}
.card-icon {flex-shrink: 0; width: 4rem; height: 4rem; display: flex; align-items: center; justify-content: center;}

.ico-graph {display:inline-block; height:2rem;background:url(../../../img/frt/main/ico-graph.png); background-repeat: no-repeat; background-position: center center; position: absolute;top:0.5rem;left:0;}
.ico-fflag {display:inline-block; width:2.1rem;height:2.1rem;background:url(../../../img/frt/main/ico-fflag.png); background-repeat: no-repeat; background-position: center center; position: absolute;top:0.5rem;left:0;}
.ico-talk {display:inline-block; width:2.6rem;height:2.3rem;background:url(../../../img/frt/main/ico-talk.png); background-repeat: no-repeat; background-position: center center; position: absolute;top:0.5rem;left:0;}
.ico-earth {display:inline-block; width:2.3rem;height:2.3rem;background:url(../../../img/frt/main/ico-earth.png); background-repeat: no-repeat; background-position: center center; position: absolute;top:0.5rem;left:0;}

.card-content {flex: 1;}
.card-title { position: relative; font-size: 2rem; padding:0 0 0 3.5rem; font-weight: 700; color: #fff; margin-bottom: 0.8rem; transition: color 0.2s ease; word-break:keep-all; line-height:1.25;}
.card-desc { font-size: 1.4rem; color: #fff; line-height: 1.4; transition: color 0.2s ease; padding:0 2rem 0 0;}
.card-content .card-arrow {position: absolute; bottom: 2rem; right:2rem; width: 1.6rem; height: 1.1rem; display: flex; align-items: center; justify-content: center;background:url(../../../img/frt/main/card-arrow.png); background-repeat: no-repeat; background-position: center center; }
.card-content .card-arrow .svg-icon {width: 1.6rem; height: 1.6rem;}
.card-content:hover .card-arrow {background:url(../../../img/frt/main/card-arrow-on.png); background-repeat: no-repeat; background-position: center center;}
/*포커스 처리*/
.feature-cards a:focus-visible{outline:none !important}
.feature-cards a:focus:not(:focus-visible){outline:none !important}
.feature-cards a:focus-visible .feature-card {outline: var(--krds-number-2) solid var(--krds-color-light-gray-0); outline-offset: -0.2rem !important;}
.feature-cards a:focus:not(:focus-visible) .feature-card {outline: var(--krds-number-2) solid var(--krds-color-light-gray-0); outline-offset: -0.2rem !important;}

/* 국가별 모아보기 섹션 */
.country-section {margin-top: 5.2rem;}
.country-section .section-title {display: flex;align-items:center;color:#fff; font-size:2.4rem; font-weight:600; margin-bottom: 2.3rem;}
.country-section .section-desc {display: inline-block;font-size: 1.3rem; color: rgba(255, 255, 255, 08); padding: 0 0 0 1.5rem;}
.country-map {position: relative; width: 100%; /*overflow: hidden;*/   z-index: 20;}
.country-map .map-image {width:auto; height: auto; display: block;}
.map-marker-container {position:absolute; cursor: pointer; z-index:10; text-decoration: none;  color: inherit; /*width: 3rem; height: 3rem;*/ transition: opacity .3s ease, transform .3s ease;}
/*.map-marker-container:focus {  outline: 2px solid #a41543;  outline-offset: 4px; }*/
.map-marker-container.active {z-index:9999;transform: translateZ(0); }
.map-marker-dot {position: absolute; width: 1.4rem; height: 1.4rem; background: #a41543; border: 0.2rem solid #fff; border-radius: 50%; z-index: 100; top: 0; left: 0;}
.map-marker-label {position: absolute;white-space: nowrap; color: #333333; background-color:#fff; padding: 0.3rem 1rem 0.2rem 2rem; border-radius: 2.2rem; border: 0.2rem solid #333;  color: #333; font-size: 1.3rem;  font-weight: 600;  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); top: -0.7rem;transform: translateY(-50%); left:-0.5rem;transform: translatex(0); text-align: center;opacity: 0; visibility: hidden;transition: opacity 0.3s ease-out, visibility 0s 0.3s;}
.map-marker-container.active .map-marker-label {opacity: 1; visibility: visible;   transition-delay: 0s;}
.map-marker-container.country-ca {/*top:80px; right:110px;*/ top: 27.5%; right: 21.5%;}
.map-marker-container.country-us { /*top:105px; right:60px; */ top: 36.5%;right: 14.2%;}
.map-marker-container.country-mx { /*top:148px; right:92px; */ top: 51%; right: 20.5%;}
.map-marker-container.country-br { /*top:148px; right:92px; */ top: 73.2%; right: 8.2%;}
.map-marker-container.country-ar { /*top:148px; right:92px; */ top: 84.7%; right:11%;}
.map-marker-container.country-se { /*top:148px; right:92px; */ top: 25.4%; left:8.8%;}
.map-marker-container.country-gb { /*top:148px; right:92px; */ top: 30.5%; left:3.3%;}
.map-marker-container.country-fr { /*top:148px; right:92px; */ top: 32.5%; left:6.5%;}
.map-marker-container.country-de { /*top:148px; right:92px; */ top: 33%; left:9.5%;}
.map-marker-container.country-ru { /*top:148px; right:92px; */ top: 28.8%; left:15.3%;}
.map-marker-container.country-es { /*top:148px; right:92px; */ top: 38.6%; left:3.9%;}
.map-marker-container.country-it { /*top:148px; right:92px; */ top: 38.3%; left:7.4%;}
.map-marker-container.country-tr { /*top:148px; right:92px; */ top: 41.3%; left:13.9%;}
.map-marker-container.country-ae { /*top:148px; right:92px; */ top: 50.8%; left:19.6%;}
.map-marker-container.country-in { /*top:148px; right:92px; */ top: 50.8%; left:27%;}
.map-marker-container.country-th { /*top:148px; right:92px; */ top: 52.8%; left:32.9%;}
.map-marker-container.country-sg { /*top:148px; right:92px; */ top: 60%; left:32.9%;}
.map-marker-container.country-id { /*top:148px; right:92px; */ top: 66.7%; left:36.2%;}
.map-marker-container.country-au { /*top:148px; right:92px; */ top: 78.9%; left:46%;}
.map-marker-container.country-vn { /*top:148px; right:92px; */ top: 49.8%; left:36.6%;}
.map-marker-container.country-cn { /*top:148px; right:92px; */ top: 36%; left:38.5%;}
.map-marker-container.country-jp { /*top:148px; right:92px; */ top: 43%; left:43%;}
.map-marker-container.country-pl { /*top:148px; right:92px; */ top: 35%; left:12.8%;}
.map-marker-container.country-sa { /*top:148px; right:92px; */ top: 52.3%; left:16.5%;}
.map-marker-container.country-ph { /*top:148px; right:92px; */ top: 51%; left:41%;}
.country-fr .map-marker-label { transform: translateY(1.3rem); }
.country-de .map-marker-label { transform: translateY(1.2rem); }
.country-es .map-marker-label { transform: translateY(1.3rem); }
.country-th .map-marker-label { transform: translateY(1rem); }
.country-sa .map-marker-label { transform: translateY(1.2rem); }
.country-ph .map-marker-label { transform: translateY(1rem); }

/* 국가별 모아보기 모바일 섹션 */
.moble-only { position: relative; display:none; width: 100%; }
.country-toggle-btn { padding: 1rem 8rem; border: 1px solid #000; background-color: #fff; cursor: pointer; font-size: 2.4rem; font-weight:600; border-radius: 25rem; display: flex; align-items: center; align-content: center;gap: 0.8rem; margin-left: auto; margin-right: auto;}
.country-list-dropdown { /*position: absolute; top: 100%;*/ left: 0;  z-index: 100; /* 다른 요소 위에 표시 */  width: 100%; display:none;}
.moble-only .country-txt {font-size:1.3rem; color:#fff; text-align:center; display:none; padding-top:20px;}
.country-toggle-btn .svg-icon {width:1.8rem;height:1rem;}
.country-toggle-btn .arrow-icon { display: inline-block;transition: transform 0.3s;webkit-mask-image: none !important; mask-image: none !important; background-color: transparent;background-image: url(../../../img/frt/main/arrow_down2.svg); background-repeat: no-repeat; background-position: center center; background-size: contain; }
.country-toggle-btn[aria-expanded="true"] .arrow-icon { transform: rotate(180deg);}

/* 국가 리스트 */
.country-list { list-style: none; padding: 0;display: grid;  grid-template-columns: repeat(5, 1fr); margin-top:3rem;background-color:rgba(255, 255, 255, 0.15);border-radius: 0.8rem; overflow: hidden;} 
.country-list li { position:relative; overflow: hidden; border-radius: 0; border-bottom:0.1rem solid #cd6368; border-right:0.1rem solid #cd6368;}
.country-list li::after {content: ''; position: absolute; bottom: 0; left: 0; width: 100%;height:0.5rem; background-color: #a41543; transform: translateY(5px); transition: transform 0.3s ease-out;}
.country-list li:hover::after {transform: translateY(0);}
.country-list li a { display: block; min-width: 0;  height: 5rem; padding: 1.4rem 1rem 1rem 1rem; text-decoration: none; color: #fff;  transition: all 0.3s ease; text-align: center;font-size:1.5rem;  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.country-list li a span { flex-grow: 1; width: 100%; white-space: nowrap;  overflow: hidden;text-overflow: ellipsis; text-align: center;}
.country-list li a:hover { background-color: #fff; font-weight:700; color:#a41543; font-size:1.6rem;}
.country-list li:nth-child(5n) {border-right: none; }

/* 우측 컬럼 */
.right-column {/*display: flex; flex-wrap: wrap; align-items: flex-start; */min-height: 90rem; margin:5rem 0 0 4rem; box-sizing: border-box; }
.right-ctop {display: flex; flex-wrap: wrap; align-items: flex-start;min-height: 37rem; gap:4rem;}
.right-cbottom {display: flex; flex-wrap: wrap; align-items: flex-start;min-height: 47rem; margin-top: 4rem; gap:4rem;align-items: stretch;}

/* 우측 그리드 */
.left-grid {width: 56rem;max-width: 56rem; background-color: #fff; border:0.1rem solid #ddd; border-radius: 1.2rem;height: 37rem; padding:4rem; display: flex; flex-direction: column; box-sizing: border-box; }

/* 모집중인행사 */
.events-section {position: relative; display:flex; flex-direction: column;}
.section-controls-inline { position: absolute; top: -3.5rem; right: 0; display: flex; gap: 0.8rem; align-items: center;}
.events-tabs-wrapper {/*grid-column: 1 / span 3; grid-row: 1 / span 2;*/}
.events-tabs-wrapper .section-header {display: flex; justify-content: space-between; align-items: center; }
.events-tabs-wrapper .section-tabs {display: flex; gap: 1rem;}
.events-tabs-wrapper .tab-btn { letter-spacing: -2.5px; line-height: 1.2; padding: 0 0; border: none; color: #555555; font-size: 2.8rem; font-weight: 400; margin-right:1.5rem;cursor: pointer; border-bottom: 0.3rem solid transparent; transition: all 0.2s ease;}
.events-tabs-wrapper .tab-btn.active {color: #000; border-bottom-color: #000; font-weight: 700;}
.events-tabs-wrapper .tab-btn:hover {color: #1E2124;}

.section-controls-inline .control-btn {width:3rem; height:3rem; border: none; background: transparent; cursor: pointer; display: flex; align-items: center; justify-content: center; border-radius: 0.4rem; transition: background 0.2s ease;}
.section-controls-inline .svg-icon { background-color: transparent;}
.section-controls-inline .ctrl-prev {width:1.6rem; height:1.8rem;webkit-mask-image: none !important; mask-image: none !important; background-color: transparent;background-image: url(../../../img/frt/main/ico-event-prev.svg); background-repeat: no-repeat; background-position: center center; background-size: contain; }
.section-controls-inline .ctrl-play {width: 2rem; height:1.8rem; webkit-mask-image: none !important; mask-image: none !important; background-color: transparent;background-image: url(../../../img/frt/main/ico-event-play.svg); background-repeat: no-repeat; background-position: center center; background-size: contain; }
.section-controls-inline .ctrl-next { width:1.6rem; height:1.8rem;background-image: url(../../../img/frt/main/ico-event-prev.svg); background-repeat: no-repeat; transform:rotate(180deg);}
.section-controls-inline .ctrl-more {width: 2.4rem; height:2.4rem; webkit-mask-image: none !important; mask-image: none !important; background-color: transparent;background-image: url(../../../img/frt/main/ico-plus.svg); background-repeat: no-repeat; background-position: center center; background-size: contain; }
.section-controls-inline .svg-icon.ico-plus {background-image:none;}

/* 모집중인 행사 swiper */
.events-swiper {width: 100%;}
.events-swiper .swiper-wrapper {flex-direction: row;}
.events-swiper .swiper-slide {height: auto;}
.events-group {display: flex; flex-direction: column; gap: 1.6rem; margin-top:1.4rem; }
.event-item {/*display: flex; gap: 3rem; padding-bottom: 1.8rem; border-bottom: 1px solid #E5E7EB;*/display: block; border-bottom: 1px solid #E5E7EB;}
.event-item:not(:first-child):last-child {border-bottom: none;}
.event-item a { display: flex;  gap: 3rem; padding: 1.6rem 0.2rem;width: 100%; text-decoration: none; color: inherit;}

/* 모집중인 행사 swiper 0424수정*/
.event-content { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.4rem;}
.event-title { font-size: 2rem; font-weight: 600; color: #000; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; width: 100%;}
.event-period { font-size: 1.6rem; color: #8d8d8d;  white-space: nowrap; overflow: hidden;  text-overflow: ellipsis;  display: block;}
.recruiting-swiper, .upcoming-swiper { width: 100%; margin: 0;}
/* 일시정지 상태일 때 (재생 아이콘 표시) */
.section-controls-inline .ctrl-play.paused {background-image: url(../../../img/frt/main/ico-event-paused.png);}
/* 기본 상태 (재생 중이므로 정지 아이콘 표시) */
.section-controls-inline .ctrl-play {background-image: url(../../../img/frt/main/ico-event-play.png);}
.section-controls-inline .ctrl-pre {margin-left: -0.2rem;}
.section-controls-inline .ctrl-next {margin-left: -0.4rem; }
.section-controls-inline .ctrl-more {margin-left:0.4rem;}

/*포커스 표시*/
.event-item a:focus {outline: none; box-shadow:inset 0 0 0 0.2rem var(--krds-color-light-primary-50); }
.events-group .event-item:last-child a { border-bottom: none;}
.event-label {flex-shrink: 0; width: 8.5rem; height: 8.5rem; display: flex; align-items: center; justify-content: center; flex-direction: column; font-weight: 600;color: #333;background-image: url(../../../img/frt/main/event-bg.svg); background-repeat: no-repeat; background-position: center center; background-size: contain; }
.event-label .dday-tit {font-size: 1.4rem;display: block;  line-height: 1.2;padding-top: 1rem;}
.event-label .dday-num {font-size: 2.8rem; display: block;  position: relative; top:-0.6rem; font-weight:700;}
.event-label.urgent {color:#b33c62; font-weight:700; font-size:2rem; white-space: normal; line-height: 1.1; background-image: url(../../../img/frt/main/event-urgent.svg); background-repeat: no-repeat; background-position: center center; background-size: contain;}
.events-section .event-content {flex: 1; display: flex; flex-direction: column; gap: 0.4rem;box-sizing: border-box !important; width: 100% !important; max-width: 100% !important; overflow: hidden !important;}
.events-section .event-category {display: inline-flex;align-self: flex-start;width: auto; font-size: 1.5rem; font-weight:600; color: #b33c62; background-color:#f3f6f9; border-radius:0.4rem; padding:0.2rem 0.8rem; }
.events-section .event-period {width: 100%;min-width: 0 !important;font-size: 1.6rem; color: #8d8d8d; font-weight:400;overflow: hidden;text-overflow: ellipsis; white-space: nowrap;}
.events-section .event-title {width: 100% !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; box-sizing: border-box !important; max-width: 100% !important; font-size: 2rem; font-weight: 600; color: #000000; line-height: 1.4;overflow: hidden;text-overflow: ellipsis; white-space: nowrap;}


/* 카드슬라이드+메인캐러셀 섹션 */
.right-grid {display: flex;flex-grow: 1; flex-direction:column; max-width: 58rem; height:37rem;gap:4rem; width: 100%;box-sizing: border-box;}

/* 카드슬라이드 섹션 */
.card-section {display: flex; border-radius: 1.2rem; box-sizing: border-box;background: #333;overflow: hidden; position: relative;}
/* 탭 기본 */
.card-tab { flex: 1;  display: flex; flex-direction: column;  justify-content:flex-start;  align-items: flex-start;  cursor: pointer;  transition: all 0.4s ease; padding:0; color: #fff;  height: 13.5rem;  box-sizing: border-box;  border-radius: 1.2rem;  margin: 0 -1rem;  z-index: 0;  position: relative;}
.card-tbox {display: flex; flex-direction: row; align-items: center;margin-top: 1rem;  letter-spacing: -0.13rem;width: 100%;flex-wrap: nowrap;}
.card-section .card-tab a { display:block; width: 100%; box-sizing: border-box; position: relative; padding: 2.5rem 1rem 2.5rem 3.5rem; }
.tab-1 { background: #da2e65; z-index:3; }
.tab-2 { background: #333;  z-index:2; }
.tab-3 { background: #a41543;  z-index:1;}
.ico-guide {display:inline-block; width:3rem;height:3rem;background:url(../../../img/frt/main/ico-oversea-guide.svg); background-repeat: no-repeat; background-position: center center; }
.ico-download {display:inline-block; width:3.5rem;height:3rem;background:url(../../../img/frt/main/ico-download.svg); background-repeat: no-repeat; background-position: center center; }
.ico-speech {display:inline-block; width:3rem;height:3rem;background:url(../../../img/frt/main/ico-speech.svg); background-repeat: no-repeat; background-position: center center; }
/* 설명 표시 */
.card-tab .card-subtit {display: inline-block;font-size: 1.7rem;white-space: nowrap; flex-shrink: 0;font-weight: 600; line-height: 1.2;}
.card-tab .card-subtxt { /*display: none;*/max-width: 0; opacity: 0; overflow: hidden; font-size: 1.4rem; font-weight:400;  margin:0 0 0 2rem; position: relative;padding-left: 1.6rem; white-space: nowrap; transition: max-width 0.4s ease, opacity 0.4s ease; text-align: left; }
.card-tab .card-subtxt::before { content:'';  width: 0.3rem; height: 3.5rem; background-color: rgba(255, 255, 255, 0.8);  vertical-align: top; position: absolute; left:0; top:0.3rem; }
.card-tab.active .card-subtxt { /*display: block;*/max-width: 26rem; max-height:inherit;  opacity: 1; overflow-wrap: break-word; }
.card-section .card-tab .card-arrow {position: absolute; top:2.5rem; right:3rem; background:url(../../../img/frt/main/arrow_right2.svg); background-repeat: no-repeat; background-position: center center;  opacity: 0; visibility: hidden;  transition: opacity 0.4s ease, visibility 0.4s ease, right 0.4s ease;}
.card-section .card-tab .card-arrow .svg-icon {width: 1.6rem; height: 1.1rem;}
.card-tab.active .card-arrow { opacity: 1; visibility: visible;}

/* 활성 탭 */
.card-tab.active { flex: 3; text-align: left; justify-content: flex-start;}
.tab-1.active ~ .tab-2 a, .tab-1.active ~ .tab-3 a {padding-right: 0.2rem;}
	
	
	/*포커스*/
	/* 1. 기본 브라우저 아웃라인 초기화 */
	.card-section .card-tab a:focus,
	.card-section .card-tab a:focus-visible {
		outline: none !important;
		box-shadow: none !important;
	}
	
	/* 2. 키보드 탭 키로 포커스 진입 시 처리 (마진 및 회색 잔상 완전 차단) */
	.card-section .card-tab:has(a:focus-visible) {
		position: relative !important;
		  
		  /* 💡 [핵심] 포커스가 오면 마이너스 마진을 해제하고 양옆을 벌려 
		이전 카드의 회색 배경이 내 카드 밑으로 파고드는 것을 물리적으로 차단합니다. 
		margin: 0 0.5rem !important; */
		
		/* 💡 포커스된 카드를 최상위 레이어로 올려 뒤쪽 카드의 잔상이나 그림자를 아래로 깔아뭉갭니다. */
		z-index: 100 !important; 
		border-radius: 1.2rem !important;
	}
	
	/* 3. [핵심] a::after를 최상위 스킨으로 얹어 보라색 점선 표출 */
	.card-section .card-tab a:focus-visible::after {
		content: '' !important;
		position: absolute !important;
		  
		/* 💡 카드의 둥근 모서리(1.2rem) 안쪽 안전 구역으로 안착하도록 사방 0.4rem(4px) 진입 */
		top: 0.1rem !important;
		left: 0.1rem !important;
		right: 0 !important;
		bottom: var(--krds-number-3) !important;
		
		/* 💡 KRDS 규격 보라색 점선 테두리 정의 */
		border: var(--krds-number-2) solid var(--krds-color-light-primary-50) !important;
		
		/* 💡 사방이 0.4rem 줄어든 만큼 보더 곡률도 0.8rem으로 정밀 동기화 */
		border-radius: var(--krds-number-7) !important;
		
		/* 💡 내부 글자나 아이콘 레이아웃을 해치지 않고 오직 '선'만 배경 위에 유령처럼 얹어지도록 설정 */
		z-index: 99999 !important;
		pointer-events: none;
	}
	
	/* 4. [첫 번째 카드 tab-1 왼쪽 짤림 전용 방어]
	.card-section .card-tab.tab-1:has(a:focus-visible) {
		z-index: 105 !important;
	} */
	.card-section .card-tab.tab-1 a:focus-visible::after {
		left:1.1rem !important;
	}
	
	.card-section .card-tab.tab-3 a:focus-visible::after {
		left:0 !important;
		right:1.1rem !important;
	}
							

/* 캐러셀 섹션 */
.carousel-section { position: relative;width: 100%; max-width: 58rem; background-color:#fff; border-radius: 0.8rem; overflow: hidden;}
.main-carousel-swiper { width: 100%; /*height: 19.5rem;*/ aspect-ratio: 58 / 19.5; position: relative; background: rgba(255, 255, 255, 0.8);}
.main-carousel-swiper .swiper-slide { width: 100%; height: 100%;}
.main-carousel-swiper .carousel-image { width: 100%; height: 100%; position: relative;background:#fff url(../../../img/frt/main/noImg.svg); background-repeat: no-repeat; background-position: center center; }
.main-carousel-swiper .carousel-image img { width: 100%;  height: 100%; object-fit:cover;object-position: center top;}
.swiper-slide .overlay-text { position: absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important;}
	
	/* ==========================================
   스와이퍼 전환 연동 포커스 테두리 수정
   ========================================== */
	
	/* 1. 기본 브라우저 아웃라인은 깔끔하게 초기화 */
	.main-carousel-swiper .swiper-slide a:focus,
	.main-carousel-swiper .swiper-slide a:focus-visible {
	  outline: none !important;
	  box-shadow: none !important;
	}
	
	/* 2. [핵심] 이미지 위로 선을 강제 주입하는 가상 요소 설정 */
	.main-carousel-swiper .swiper-slide a:focus-visible::after {
	  content: '' !important;
	  position: absolute !important;
	  
	  /* 💡 중요: 스와이퍼의 overflow: hidden에 선이 잘리지 않게 사방 0.3rem씩 안으로 밀어 넣음 */
	  top: var(--krds-number-1) !important;
	  left: var(--krds-number-1) !important;
	  right: var(--krds-number-1) !important;
	  bottom: var(--krds-number-1) !important;
	  
	  /* 💡 KRDS 변수 두께와 색상을 계산하여 보라색 점선 테두리 생성 */
	  border: var(--krds-number-2) solid var(--krds-color-light-primary-50) !important;
	  
	  /* 💡 슬라이드 곡률(예: 0.8rem)보다 살짝 작게 주어 둥근 모서리에 딱 핏되게 조절 */
	  border-radius: 0.8rem !important;
	  
	  /* 💡 [가장 중요] 내부 이미지(.carousel-image)보다 무조건 최상단에 뜨도록 울트라 레이어 적용 */
	  z-index: 999999 !important;
	  pointer-events: none; /* 마우스 드래그나 클릭을 방해하지 않음 */
	}
	
	/* 3. 포커스된 슬라이드 자체가 옆 슬라이드나 부모 레이어 뒤로 숨지 않도록 격상 */
	.main-carousel-swiper .swiper-slide:has(a:focus-visible) {
	  position: relative !important;
	  z-index: 999 !important;
	}

/* 메인 캐러셀 버튼 스타일 */
.carousel-controls { position: absolute; bottom: 0; left: 0; right: 0;  display: flex;  justify-content: space-between;  align-items: center; height: 3.2rem; padding: 0 2rem;
  background-color: rgba(0, 0, 0, 0.7);  backdrop-filter: blur(5px);  border-radius: 0 0 0.8rem 0.8rem;  z-index: 10; pointer-events: auto;}
.carousel-progress { display: flex; align-items: center; gap: 10px;  flex: 1; }
.carousel-progress .progress-bar { flex: 1; height: 0.4rem;  background: #E6E8EA; border-radius: 0.2rem;  overflow: hidden;}
.carousel-progress .progress-bar .progress-fill { width: 20%; height: 100%; background: #3D9FB8; border-radius: 0.2rem; transition: none;  box-shadow: 0 0 5px rgba(255, 255, 255, 0.7);}
.carousel-progress .carousel-pagination { font-size: 1.7rem; font-weight: 400;  color: #ffffff; min-width: auto; margin-left:15rem; margin-top:0.2rem; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.7);}
.carousel-arrows { display: flex; gap:0.8rem; margin-left: 2rem; }
.carousel-arrows .arrow-btn { display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 11; pointer-events: auto; position: relative;}
.carousel-arrows .svg-icon.ico-angle { width: 0.9rem; height:1.4rem;  -webkit-mask-image: none !important; mask-image: none !important;background:url(../../../img/frt/main/arrow_next.svg); background-repeat: no-repeat; background-repeat: no-repeat; background-size:contain;  background-position: center center;}
.carousel-arrows .svg-icon.ico-swiper-stop { -webkit-mask-image: none !important; mask-image: none !important;background:url(../../../img/frt/main/arrow_pause.svg); background-repeat: no-repeat; background-size:contain;  background-position: center center; width: 2rem; height:1.3rem; }
.carousel-arrows .svg-icon.ico-swiper-play {-webkit-mask-image: none !important; mask-image: none !important;background:url(../../../img/frt/main/icon-play2.svg); background-repeat: no-repeat; background-size:contain;  background-position: center center;width: 2rem; height:2rem; }
.carousel-arrows .svg-icon.ico-angle.left {transform:rotate(180deg);}
.carousel-arrows .svg-icon.ico-angle.right {transform:rotate(360deg);}

/* 해외동향·통계 섹션 */
.trends-section {background-color: #fff; border:0.1rem solid #ddd; border-radius: 1.2rem;  padding:3.5rem 4rem; display: flex; flex-direction: column; max-width: 32rem; min-height: 47rem;  box-sizing: border-box;}
.trends-section .section-header {display: flex; justify-content: space-between; align-items: center; }
.trends-section .section-title {font-size: 2.8rem; font-weight: 700; color: #000; letter-spacing: -2px; line-height: 1.2;}
.trends-section .more-btn {width: 2.4rem; height: 2.4rem;}
.trends-section .more-btn .ico-plus {webkit-mask-image: none !important; mask-image: none !important; background-color: transparent;background-image: url(../../../img/frt/main/ico-plus.svg); background-repeat: no-repeat; background-position: center center; background-size: contain; }
.weekly-card {margin-top:4rem;}
.weekly-card a {display:block;}
.weekly-card .weekly-img { height:11rem; overflow: hidden;border-radius: 1.2rem; background-color: #eee9ed; border-radius: 1.2rem;  position: relative;background:#f3f4f5 url(../../../img/frt/main/noImg.svg); background-repeat: no-repeat; background-position: center center; position: relative;}
.weekly-card .weekly-img img { width: 100%; height: 100%; object-fit:cover; object-position: center 8%;}
.weekly-info {display: flex; flex-direction: column; gap: 0.6rem; margin:1rem 0 2.4rem 0;}
.weekly-cate {font-size: 1.5rem;color:#a41543; font-weight: 600;}
.weekly-number {font-size: 1.6rem; color:#000;font-weight: 600; letter-spacing: -0.08rem;overflow: hidden;text-overflow: ellipsis; white-space: nowrap;}
.weekly-date {font-size: 1.4rem; color: rgba(0, 0, 0, 0.6);}
.trend-article {border-top: 0.1rem solid #E5E7EB; border-bottom: 0.1rem solid #E5E7EB; padding:1.8rem 0 0 0; } 
.trend-header {display: flex;  align-items: center; justify-content: center; margin-bottom: 0rem;margin-top: -3rem; }
.trend-title {font-size: 1.1rem; font-weight: 400; color: #333; border:0.1rem solid #ddd; background-color: #fff; border-radius:2rem; padding: 0.3rem 0.8rem;}
.weekly-card li:last-child .weekly-img {display:none;}
.weekly-card li:last-child .weekly-info {margin:1rem 0 1rem 0;}

/* W·포커스 W·인사이드 섹션 */
.focus-section {background-color: #fff; border:0.1rem solid #ddd; border-radius: 1.2rem;  padding:3.5rem 4rem; display: flex; flex-direction: column; width: 100%; max-width: 48rem; min-width: 48rem; min-height: 47rem;  box-sizing: border-box;}
.focus-section .section-header {display: flex; justify-content: space-between; align-items: center; }
.focus-section .section-tabs {display: flex; gap: 1rem;}
.focus-section .tab-btn { letter-spacing: -2.5px; line-height: 1.2; padding: 0 0; border: none; color: #555555; font-size: 2.8rem; font-weight: 400; margin-right:1.5rem;cursor: pointer; border-bottom: 0.3rem solid transparent; transition: all 0.2s ease;}
.focus-section .tab-btn.active {color: #000; border-bottom-color: #000; text-shadow: 0.03em 0 currentColor;}
.focus-section .tab-btn:hover {color: #1E2124;}
.article-list {display: flex; flex-direction: column; gap: 2rem;margin-top:4rem;width:100%; }
.article-item {display: flex; padding-bottom: 2rem; border-bottom: 1px solid #E5E7EB;  width: 100%; min-width: 0;}
.article-item > a {display: block; width: 100%; overflow: hidden; text-decoration: none;}
.article-item:last-child {border-bottom: none; padding-bottom: 0;}
.article-thumb {flex-shrink: 0; width: 12rem; height: 8rem; border-radius: 0.8rem; overflow: hidden;}
.article-thumb img {width: 100%; height: 100%; object-fit: cover;}
.article-info {display: flex; flex-direction: column; gap: 0.6rem; width: 100%; min-width: 0; }
.article-category {font-size: 1.5rem; color: #a41543;font-weight: 600; }
.article-info .article-title {width: 100%; min-width: 0;font-size: 1.6rem; font-weight: 600; color: #000; margin: 0; line-height: 1.4; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.article-date {font-size: 1.4rem; color: #9CA3AF;}
.focus-content { position: relative;width: 100%;  min-width: 0; }
.focus-section .more-btn-abs {position: absolute; top: -3.3rem; right: 0;width: 3.2rem; height: 3.2rem; border: none; background: transparent; cursor: pointer; display: flex; align-items: center; justify-content: center; border-radius: 0.4rem; transition: background 0.2s ease;}
.focus-section .more-btn-abs .ico-plus { width: 2.4rem; height: 2.4rem;webkit-mask-image: none !important; mask-image: none !important; background-color: transparent;background-image: url(../../../img/frt/main/ico-plus.svg); background-repeat: no-repeat; background-position: center center; background-size: contain; }
.focus-section .more-btn-abs:hover { background-color: #F3F4F6;}

/* 마켓플레이스+ 해외마켓정보 */
.cbottom-right {width: 30rem;max-width: 30rem;display: flex; flex-direction: column; gap: 4rem;align-items: stretch;}
/* 마켓플레이스 섹션 */
.marketplace-section {width: 100%;display: flex; flex-direction: column; background-color: #fff; border-radius: 1.2rem; /*height: 28rem;*/flex: 1.8; padding:3rem 4rem;box-sizing: border-box;}
.marketplace-section .section-header {display: flex; justify-content: space-between; }
.marketplace-section .section-title {font-size: 2rem; font-weight: 700; color: #000; letter-spacing: -0.03rem; line-height: 1.2;}
.external-link {width: 3.2rem; height: 3.2rem; border: none; background: transparent; cursor: pointer; display: flex; align-items: center; justify-content: center; border-radius: 0.4rem; transition: background 0.2s ease;}
.external-link:hover {background: #F3F4F6;}
.external-link .svg-icon {width: 2rem; height: 2rem; background-color: #6B7280;}
.marketplace-section .new-badge {display: inline-block; padding: 0.1rem 1rem 0.2rem 1rem; background-color: #2fa9aa; color: #fff; border-radius: 2rem; font-size: 1.4rem; font-weight: 600; margin-left: 0.2rem;  position: relative; top:-0.4rem;}
.marketplace-card-list {position: relative;margin-top:2rem;width: 100%;}
.marketplace-card { display: flex; width: 100%;flex-direction: column;}
.marketplace-image {width: 100%; height: 9.5rem; border: 0.1rem solid #bdbdbd; border-radius: 1.2rem;  border-radius: 0.8rem; overflow: hidden;background:#f3f4f5 url(../../../img/frt/main/noImg.svg); background-repeat: no-repeat; background-position: center center; }
.marketplace-image img {width: 100%; height: 100%; object-fit: cover;}
.marketplace-card .marketplace-tags { position: absolute; top:7.5rem;padding:0 0.7rem 0 1rem; background-color: #F3F4F6;border-radius:0 0.4rem 0 0.4rem; border:0.1rem solid #ddd;height: 2rem; }
.marketplace-card .marketplace-tags .tag { color: #000;  font-size: 1.1rem; font-weight: 500; line-height: 1; position: relative;top:-0.4rem;}
.marketplace-title {width:100%;font-size: 1.7rem; font-weight: 700; color: #000000; margin-top: 1.2rem;overflow: hidden;text-overflow: ellipsis; white-space: nowrap; }
.marketplace-desc {font-size: 1.3rem; color: #555555; line-height: 1.6;  display: -webkit-box; -webkit-line-clamp: 2;  -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; margin-top:0.5rem;}
.marketplace-section .section-header .svg-icon {display:block;width:2.4rem; height:2.4rem;-webkit-mask-image: none !important; mask-image: none !important; background-color: transparent;background-image: url(../../../libs/krds/img/component/icon/ico_go.svg); background-repeat: no-repeat; background-position: center center; background-size: contain;}
.marketplace-section .section-header a {display:block; padding:0;}
.marketplace-section .svg-icon.ico-go {width:2.4rem; height:2.4rem;-webkit-mask-image: none !important; mask-image: none !important; background-image: url(../../../img/frt/main/ico_go.svg); background-repeat: no-repeat; background-position: center center; background-size: contain;}

/* 해외마켓정보 섹션 */
.market-info {position:relative;display: flex; align-items: center; align-content: center; /*height: 15rem;*/flex: 1; background:#000 url(../../../img/frt/main/market-info-bg.svg); background-repeat: no-repeat; background-position: center center; background-size:cover; border-radius: 1.2rem; box-sizing: border-box;}
.market-info::before { content:'';  width: 0.4rem; height: 6rem; background-color: rgba(255, 255, 255, 0.8);  vertical-align: top; position: absolute; left:4rem; top: 50%; transform: translateY(-50%);}
.market-info a {display: flex;width: 100%; height: 100%;justify-content:flex-start; align-items:center;}
.market-ibox {padding:0 0 0 6.3rem;}
.market-info-title {font-size: 2rem; font-weight: 700; color: #fff; margin-bottom: 0.4rem;}
.market-info-desc {font-size: 1.4rem; letter-spacing: -0.08rem; color: rgba(255, 255, 255, 0.8); line-height: 1.2;}
.market-info .card-arrow {position: absolute; bottom:2rem; right:2rem; background:url(../../../img/frt/main/arrow_right2.svg); background-repeat: no-repeat; background-position: center center;}
.market-info .card-arrow .svg-icon {width: 1.6rem; height: 1.1rem;}

/*국가별 모아보기 - 모달*/
.nation-modal *{transition: all 0.4s ease;}
.nation-modal .modal-content .modal-conts{padding: 0; overflow-x: hidden}
.nation-modal .modal-content{padding:0 !important; /* height: 80%; */ max-height: 76.2rem !important; }
.nation-modal .nation-top-box{width: 100%; max-width: 182rem; padding: 2.8rem 2rem; margin: 0 auto ;position: relative; display: flex; justify-content: space-between; align-items: center;}
.nation-modal .nation-top-box:after{display: block; background: #dddddd; position: absolute; bottom: 0; left: 50%;  z-index: -1; transform: translateX(-50%); content: ""; width: 100vw; height: 0.1rem;}
.nation-modal .nation-top-box .left-box{display: flex; align-items: center; gap:3rem;  }
.nation-modal .nation-top-box .left-box .nation-tit{ transition: all 0.4s ease;}
.nation-modal .nation-top-box .left-box .nation-tit h2{font-size: 2.8rem; font-weight: 800; color:#000000;}
.nation-modal .nation-top-box .left-box .full-box{display:flex; align-items: center; gap:3rem;  }
.nation-modal .nation-top-box .left-box .full-box .nation-center ul{display: flex; gap:1rem; transition: all 0.3s ease;}
.nation-modal .nation-top-box .left-box .full-box .nation-center ul li .btn-center{display: flex; flex-direction: column; align-items: flex-start; gap:0; height: 5.2rem; padding:0 5rem 0 2rem; color:#fff; border-radius: 0.5rem; background:#be2254 url("../../../img/frt/main/arrow_right.png") no-repeat; background-position: calc(100% - 2rem) center; line-height: 1; font-size: 1.6rem; font-weight: 500; }
.nation-modal .nation-top-box .left-box .full-box .nation-center ul li .btn-center span.nation_time{font-size: 1.2rem; color:rgba(255, 255, 255, 0.6)}
.nation-modal .nation-top-box .left-box .full-box .nation-center-list select{ width: 23rem; height: 5.2rem; border-color:#333333; font-weight: 600; font-size: 1.7rem; color:#000}

.nation-modal .nation-content-wrap .nation-search-wrap{display: flex; align-items: center; position: absolute; top: 2.8rem; right: calc(50% - 80rem); transition: all 0.3s ease;}
.nation-modal .nation-content-wrap .nation-search-wrap .nation-search{display: flex; align-items: center; border-bottom: 0.3rem solid #a41543; width: 35rem; height: 6rem; gap:1.2rem}
.nation-modal .nation-content-wrap .nation-search-wrap .nation-search:before{content: "#"; display: inline-flex;color:#a41543; opacity: 0.6; font-size:3rem; font-weight: 800}
.nation-modal .nation-content-wrap .nation-search-wrap .nation-search .nation-input{border: 0; display: inline-flex; flex: 1; border-radius: 0.6rem }
.nation-modal .nation-content-wrap .nation-search-wrap .nation-search .nation-input[placeholder]{font-size: 1.8rem; color:#333333; opacity: 0.6}
.nation-modal .nation-content-wrap .nation-search-wrap .nation-search .nation-input:focus{ outline: none; box-shadow:0 0 0 0.2rem var(--krds-color-light-primary-50);}
.nation-modal .nation-content-wrap .nation-search-wrap .nation-search .btn-search{background:url("../../../img/frt/main/icon_nation_search.png") no-repeat center; padding: 0; width:2.1rem; height: 2.1rem;  margin-right: 1rem }
/*닫기버튼*/
.nation-modal .btn-close{top:2.8rem !important; right:calc(50% - 89rem) !important; background: #f2f4f6 url("../../../img/frt/main/icon_nation_close.png") no-repeat; background-position:center; background-size: auto; border:0.1rem solid #dddddd; border-radius: 1.2rem; width: 6rem !important; height: 6rem !important; display: flex; align-items: center; justify-content: center}
/**/
.nation-content-wrap{height: calc(100% - 10.8rem); overflow-y: auto; }
.nation-content-box{ width: 100%; max-width: 182rem; padding: 2.8rem 2rem; margin: 0 auto; display: flex; justify-content: space-between; align-items:stretch; gap:4rem; position: relative; }
.nation-content-box .nation-info-wrap{flex-shrink: 0;  display: inline-flex; width:44rem; border:0.1rem solid #dddddd; background:#f2f4f6; border-radius: 1rem;}
.nation-content-box .nation-info-wrap .nation-info{padding: 3rem 4rem 3rem 3rem; display: flex; flex: 1 1 0; gap:1.5rem}
.nation-content-box .nation-info-wrap .nation-info .flag-box{width: 9rem; height: 6.8rem; border-radius: 0.8rem; border:0.1rem solid #ddd; overflow: hidden; position: relative;}
.nation-content-box .nation-info-wrap .nation-info .flag-box p{ position: absolute; top:0; left: 0; width: 100%; height: 100%; object-fit: cover}
.nation-content-box .nation-info-wrap .nation-info .flag-box p .flag-icon{width: 100%; height:100%}
.nation-content-box .nation-info-wrap .nation-info .info-box{flex: 1}
.nation-content-box .nation-info-wrap .nation-info .info-box ul{display: flex; flex-direction: column;}
.nation-content-box .nation-info-wrap .nation-info .info-box ul li{height: 4.2rem;}
.nation-content-box .nation-info-wrap .nation-info .info-box ul li dl{display: flex; gap:0.8rem;}
.nation-content-box .nation-info-wrap .nation-info .info-box ul li dl dt{display: inline-flex; align-items: center; justify-content: center; width: 8rem; height: 3rem; background: #fff; border: 0.1rem solid #ddd; border-radius: 0.4rem; font-size: 1.4rem; color:#333333; font-weight: 700;}
.nation-content-box .nation-info-wrap .nation-info .info-box ul li dl dd{flex: 1;  font-size: 1.5rem; color: #333333; font-weight: 600; padding-top: 0.4rem; letter-spacing: -0.04rem}
.nation-content-box .nation-info-wrap .nation-info .info-box ul li dl dd strong{line-height: 1;}
.nation-content-box .nation-info-wrap .nation-info .info-box ul li dl dd span{display: block; font-weight: 400; font-size: 1.1rem; color:#888888; line-height: 1}

.nation-content-box .nation-bbs-wrap{flex: 1; padding: 0; margin: 0;}
/* .nation-content-box .nation-bbs-wrap>ul{width: 100%; display: flex; flex-wrap: wrap; }
.nation-content-box .nation-bbs-wrap>ul>li{display: inline-flex; width: calc(50% - 1.5rem); border:0.1rem solid #ddd; border-radius: 0.8rem; padding: 2.4rem 4rem; min-height: calc(50% - 1.5rem) !important; margin-bottom: 3rem; overflow: hidden;}
.nation-content-box .nation-bbs-wrap>ul>li:nth-child(2){margin-right: 1.5rem}
.nation-content-box .nation-bbs-wrap>ul>li:nth-child(3){margin-left: 1.5rem}
.nation-content-box .nation-bbs-wrap>ul>li:nth-child(4){margin-right: 1.5rem}
.nation-content-box .nation-bbs-wrap>ul>li:nth-child(5){margin-left: 1.5rem}
.nation-content-box .nation-bbs-wrap>ul>li:nth-child(n+4):nth-child(-n+5){margin-bottom: 0;} */
.nation-content-box .nation-bbs-wrap>ul{width: 100%; display: flex; flex-wrap: wrap; gap:var(--krds-number-12) var(--krds-number-8);}
.nation-content-box .nation-bbs-wrap>ul>li{flex:1 0 calc(50% - 1.6rem);  border:0.1rem solid #ddd; border-radius: 0.8rem; padding: 2.4rem 4rem; min-height: calc(50% - 1.5rem) !important; overflow:hidden;}
.nation-content-box .nation-bbs-wrap>ul>li>.tit-box{width: 0; height: 0; opacity: 0; font-size: 0; line-height: 0; margin: -1px;}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area{width: 100%; position: relative}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .hidden{display: none}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab{border-bottom: 0.1rem solid #000; margin-bottom: 2.5rem}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab>ul{gap:2.4rem;}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab ul li{flex:0;}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab ul li button.btn-tab{font-size: 2.1rem; color:#888888; font-weight: 500; align-items: flex-start; padding: 0; border:0; height: 4.2rem}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab ul li button.btn-tab:hover{background-color:var(--krds-color-light-gray-0);}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab ul li.active button.btn-tab{font-weight: 700; color:#000; border-bottom: 0.2rem solid #000}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section .more-btn{position: absolute; top: 0.1rem; right: 0; }
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section .more-btn button.btn-more{background:url("../../../img/frt/main/icon_nation_more.png") no-repeat; width: 2.4rem; height: 2.4rem; padding: 0;}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul {display: flex; flex-direction: column; width: 100%; gap:1.4rem; padding: 0.2rem; overflow: hidden;}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul li{height: 3rem}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul li a{ display: -webkit-box; width: 100%; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical; word-break: break-all}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul li span.tit{font-size:1.5rem; color:#000; letter-spacing: -0.04rem}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul.event-bbs-list li a span.cate{display: inline-block; text-align: center; vertical-align: middle; width: 8.4rem; height: 2.6rem; border:0.1rem solid #a41543; border-radius: 0.5rem; background: #fff; font-size: 1.4rem; color: #a41543; margin-right: 1.5rem ; letter-spacing: -0.02rem; line-height: 2.4rem;}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul.bbs-bbs-list li a span.cate{font-size: 1.5rem; color:#a41543; font-weight: 600; }
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul.bbs-bbs-list li a span.cate:after{content: " ㅣ ";}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul.news-bbs-list{gap:1.5rem}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul.news-bbs-list li{border-bottom: 0.1rem solid #ddd; height: 4.4rem}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul.news-bbs-list li:last-child{border-bottom: 0}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul.news-bbs-list li a{ -webkit-line-clamp:2;}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul.news-bbs-list li a span.tit{display: -webkit-box; width: 100%; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical; word-break: break-all; line-height: 1;}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul.news-bbs-list li a span.cate{font-size: 1.3rem; color:#a41543; line-height: 1; padding-right: 1rem}
.nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul.news-bbs-list li a span.date{font-size: 1.3rem; color:#999999; line-height: 1;}


.nation-modal .modal-conts{position: static !important; display: block !important;}

/*차트보기*/
.nation-content-box .nation-bbs-wrap>ul>li.chart-wrap{width: 0; height: 0 !important; padding: 0; margin: 0; border: 0;}
.nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap{position: absolute; bottom: 2.8rem; left: 2rem; width:44rem; height: 37.5rem; border:0.1rem solid #dddddd; background:#f6e7ec; border-radius: 1rem; padding:4rem;}
.nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap .tit-box{ position: relative; margin-bottom: 3rem;}
.nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap .tit-box h4{color:#000; font-size: 2.1rem; }
.nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap .tit-box h4 span{font-size: 1.3rem; font-weight: 500; opacity: 0.8; padding-left: 0.8rem}
.nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap .tit-box .more-btn{position: absolute; top: 0; right: 0;}
.nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap .tit-box .more-btn button.btn-more{background:url("../../../img/frt/main/icon_nation_more.png") no-repeat; width: 2.4rem; height: 2.4rem; padding: 0;}
.nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap .chart-box{width: 100%; height: calc(100% - 6.2rem)}
.nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap .chart-box canvas{width: 100%; height: 100%;}


/*******************************************************
					미디어쿼리						
*******************************************************/

@media (min-width: 1671px) and (max-width: 1920px) {     
    #container .inner {max-width:100%; padding: 0;}
    .main-content {max-width:100%; padding: 0 4rem 0 0;}   
    .left-column { width: calc(100% - 60%); max-width: none; /*min-height: 100vh;*/ height: 100%; padding: 5rem 3rem 5rem 3rem; margin-right: 0; background-size: cover;z-index: 10; box-sizing: border-box; transition: top 0.3s ease;}
    .right-column {width:60%; max-width: none; flex-wrap: wrap;  min-width: 0; margin: 5rem 0 0 0; margin-left: 4rem; width: 100%; max-width: 100%; min-height:none;}
    .right-ctop {flex-direction: row; width: 100%; max-width: 100%; gap: 4rem; min-height: auto;}   
    .left-grid {width: 48%; max-width: none; min-height: auto; padding: 4rem 4rem 3rem 4rem; flex-shrink: 0; }
    .right-grid {width: 48%; max-width: none;  min-height: auto; padding: 0;  border-radius: 1.2rem; flex-shrink: 0; }
    .carousel-section {width: 100%;max-width: 100%;height: auto;}
    
    .right-cbottom {flex-wrap: nowrap;width: 100%; max-width: none; gap: 4rem; min-height: auto; margin-top: 4rem;align-items: stretch;}
    .trends-section { width: 30%; max-width: none; height: auto; box-sizing: border-box;}
    .focus-section {width: 40%; max-width: none; height: auto;  box-sizing: border-box;}
    .cbottom-right { width: 23%; max-width: none; height: auto;  box-sizing: border-box;}
    
    .quick-buttons-wrapper {gap:0.6rem;}
    .quick-links {flex-direction: column;}
    .quick-link-btn {padding:0.5rem 0.6rem 0.3rem 0.6rem; text-align: center; width: 10rem;}
    .card-title .svg-icon {display:none;}
    .card-title {padding:0;}
    .feature-card {min-height:12.5rem;} 
  
    
}

@media (max-width: 1820px){
    .nation-modal .nation-top-box{padding: 2.8rem 4rem;}
    .nation-modal .nation-content-wrap .nation-search-wrap{right: 13rem;}
    .nation-modal .btn-close{right:4rem !important;}
}

@media (max-width: 1820px) and (min-width:1281px){
    .nation-modal .nation-top-box{padding-left: 2rem; padding-right: 2rem}
    .nation-modal .btn-close{right: 2rem !important}
    .nation-modal .nation-content-wrap .nation-search-wrap{right:10rem}
    .nation-content-box{gap:3rem}    
    .nation-content-box .nation-info-wrap{ width:36rem;}
    .nation-content-box .nation-info-wrap .nation-info{padding:2.4rem;}
    .nation-content-box .nation-info-wrap .nation-info .flag-box{width: 6rem; height: 4.6rem;}
    .nation-content-box .nation-info-wrap .nation-info .info-box ul li dl dt{width:6rem; letter-spacing: -0.05rem;}
    .nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap{width:36rem; padding: 3rem 2.4rem }
    
    .nation-content-box .nation-bbs-wrap>ul>li{padding: 2rem 3rem;}
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab>ul{gap:1rem;}    
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab ul li button.btn-tab{font-size: 1.9rem; letter-spacing: -0.1rem}    
    
}

@media (max-width: 1280px) {    
    /*국가별 레이아웃*/
    .nation-modal .nation-top-box .left-box .full-box{gap:2rem}
    .nation-modal .btn-close{top:2.8rem !important; width: 5.2rem !important; height: 5.2rem !important}
    .nation-modal .nation-content-wrap .nation-search-wrap{ top:2.4rem; right: 11rem}
    .nation-modal .nation-content-wrap .nation-search-wrap .nation-search{height:5.2rem;}
    
    .nation-content-wrap{overflow-y: auto; }
    .nation-content-box{flex-direction:column; padding:4rem;}
    .nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap{top:4rem; bottom: auto; left:auto; right: 4rem; width: 44rem; height: 29.5rem;}
    .nation-content-box .nation-info-wrap{width: auto; height: 29.4rem; margin-right: 47rem}
    .nation-content-box .nation-info-wrap .nation-info{padding: 4rem; gap:4rem}
    .nation-content-box .nation-info-wrap .nation-info .flag-box{width: 15.5rem; height: 11.5rem}
    .nation-content-box .nation-info-wrap .nation-info .info-box ul{gap:1.4rem}
    .nation-content-box .nation-info-wrap .nation-info .info-box ul li dl{gap:1rem}
    
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul.event-bbs-list li a span.cate{margin-right: 1rem}
    
}

@media (max-width: 1150px) {
    .nation-modal .nation-top-box{flex-direction: column;}
    .nation-modal .nation-top-box .left-box{width: 100%; justify-content:space-between;}
    .nation-modal .nation-top-box .left-box .full-box{flex:1; gap:0}
    .nation-modal .nation-top-box .left-box .full-box .nation-center-list{margin-left: auto; margin-right: 6.8rem}
    .nation-modal .nation-top-box .left-box .full-box .nation-center-list select{width:18rem;}
    .nation-modal .nation-content-wrap .nation-search-wrap{padding:2.4rem 0 0 0; position: static; justify-content: center}
    .nation-modal .nation-content-wrap .nation-search-wrap .nation-search{height:auto;}
    
    .nation-content-box .nation-info-wrap{ margin-right: 43rem}
    .nation-content-box .nation-info-wrap .nation-info{padding: 3rem; gap:2rem;}    
    .nation-content-box .nation-info-wrap .nation-info .flag-box{width: 9rem; height: 6.8rem}
    .nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap{padding: 3rem; width:  40rem}
    
    .nation-content-box .nation-bbs-wrap>ul>li{padding: 2rem;}
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab>ul{gap:1rem;}    
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab ul li button.btn-tab{font-size: 1.9rem; letter-spacing: -0.1rem}    
}
/* 반응형: 태블릿 */
@media (min-width: 1111px) and (max-width: 1670px) {    
    #container .inner {max-width:100%; padding: 0;}
    .main-content {max-width:100%; padding: 0 4rem 0 0;}
    .left-column {max-width: 48rem; width: 48rem;  flex-shrink: 0; min-height: 100vh; height: 100%; padding: 5rem 3rem 5rem 3rem; margin-right: 0; background-size: cover;z-index: 10; box-sizing: border-box; transition: top 0.3s ease;}
    .right-column {flex-grow: 1; min-width: 0; margin: 5rem 0; margin-left: 4rem;flex-direction: column; width: 100%;    max-width: 100%;}
    .right-ctop {flex-direction: column; width: 100%; max-width: 100%; gap: 4rem; min-height: auto;}
    .right-cbottom {flex-direction: column; width: 100%; max-width: 100%; gap: 4rem; min-height: auto; margin-top: 4rem; }
    .left-grid {width: 100%;max-width: 100%; height: auto; padding:4rem 4rem 3rem 4rem;}
    .right-grid {width: 100%;max-width: 100%; height: auto;}
    .trends-section {width: 100%;max-width: 100%;height: auto; min-height:auto;}
    .carousel-section {width: 100%;max-width: 100%;height: auto;}
   
    .focus-section {width: 100%;max-width: 100%;height: auto;}
    .cbottom-right {max-width: 100%; width: 100%; flex-direction: row; gap:4rem; height:auto;}
    .marketplace-section {flex:6; min-width: 0;height: auto;align-self: stretch}
    .market-info {flex:4;min-width: 0; height:auto;align-self: stretch}
   
    .search-input {box-sizing: border-box; padding:0.1rem 5rem 0 1.5rem !important;}
    .search-btn {right:1.5rem;}
    .quick-buttons-wrapper {gap:0.6rem;}
    .quick-links {flex-direction: column;}
    .quick-link-btn {padding:0.5rem 0.6rem 0.3rem 0.6rem; text-align: center; width: 10rem;}
    .feature-cards {display:flex; flex-direction:column;}
    .feature-card { padding:1.5rem 2rem;}
    /*메인캐러셀*/
    .main-carousel-swiper {/*height:25rem;*/aspect-ratio: 16 / 5;}    
    /*해외동향.통계*/
    .weekly-card {display:flex;gap:3rem;width: 100%; /*overflow: hidden;*/height: 100%;}
    .weekly-card li { flex-grow: 1; flex-basis: 0; min-width: 0;height: 100%; }
    .weekly-card li:last-child .weekly-img {display:flex;}
    .weekly-card a {display: flex; gap: 1.5rem; align-items: flex-start; height: 100%;  }
    .weekly-card li:last-child a { display: block;  height: 100%; }
    .weekly-card li:last-child .trend-article {display: flex; gap: 1.5rem; align-items: flex-start; border-top: 0; border-bottom: 0; padding: 0;}    
    .weekly-card .weekly-img {height: 20rem; width: 14rem; flex-shrink: 0; overflow: hidden; border:0.1rem solid #ddd;  } 
    .weekly-info {display: flex; flex-direction: column; gap: 0.6rem; margin:0;  flex-grow: 1;min-width: 0;}
    .trend-article {border-top:0; border-bottom:0; padding:0;}
    .trend-header {display:none;}
    
    /*해외마켓정보*/
    .market-info {position:relative;}
    .market-info::before {/*top:25%;*/}
    .market-ibox {padding:0 3rem 0 6.3rem;}

}
/* 반응형: 모바일 */
@media (max-width: 1110px) {   
    #container .inner {max-width:100%; padding: 0;}
    .main-content {max-width:100%; padding: 0 3rem 0 0;}
    .left-column {/*max-width: 38em; width: 38rem;*/  flex-shrink: 0; min-height: 100vh; height: 100%; padding: 4rem 2rem 2rem 2rem; margin-right: 0; background-size: cover;z-index: 10; box-sizing: border-box; transition: top 0.3s ease;}
    .map-marker-label {padding: 0.3rem 0.8rem 0.2rem 2rem; border-radius: 2.2rem; border: 0.2rem solid #333;  color: #333; font-size: 1.2rem;  font-weight: 600;  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); top: -0.7rem;transform: translateY(-50%); left:-0.5rem;transform: translatex(0); text-align: center;opacity: 0; visibility: hidden;transition: opacity 0.3s ease-out, visibility 0s 0.3s;}
    .right-column {flex-grow: 1; min-width: 0; margin: 3rem 0; margin-left: 3rem;flex-direction: column; width: 100%; max-width: 100%;}
    .right-ctop {flex-direction: column; width: 100%; max-width: 100%; gap: 3rem; min-height: auto;}
    .right-cbottom {flex-direction: column; width: 100%; max-width: 100%; gap: 3rem; min-height: auto; margin-top: 3rem; }
    .left-grid {width: 100%;max-width: 100%; height: auto; padding:4rem 3rem 3rem 3rem;}
    .right-grid {width: 100%;max-width: 100%; height: auto; gap:3rem;}
    .trends-section {width: 100%;max-width: 100%;height: auto; min-height:auto;}
    .carousel-section {width: 100%;max-width: 100%;height: auto;}    
   
    .focus-section {width: 100%;max-width: 100%;height: auto;}
    .cbottom-right {max-width: 100%; width: 100%; flex-direction: row; gap:3rem; height:auto;}
    .marketplace-section {flex:6;min-width: 0; height: auto;align-self: stretch}
    .market-info {flex:4; min-width: 0;height:auto;align-self: stretch}
    
    .search-input {box-sizing: border-box; padding:0.1rem 5rem 0 1.5rem !important;}
    .search-btn {right:1.5rem;}
    .quick-buttons-wrapper {gap:0.6rem;}
    .quick-links {flex-direction: column;}
    .quick-link-btn {padding:0.5rem 0.6rem 0.3rem 0.6rem; text-align: center; width: 10rem;}
    .feature-cards {display:flex; flex-direction:column;}
    .feature-card { padding:1.5rem 2rem;}
    
    .main-carousel-swiper {/*height:20rem;*/}  
    
    /*해외동향.통계*/
    .weekly-card {display:flex; flex-direction: column;gap:3rem;width: 100%; /*overflow: hidden;*/height: 100%;}
    .weekly-card li { flex-grow: 1; flex-basis: 0; min-width: 0;height: 100%; }
    .weekly-card li:last-child .weekly-img {display:flex;}
    .weekly-card a {display: flex; gap: 1.5rem; align-items: flex-start; height: 100%;  }
    .weekly-card li:last-child a { display: block;  height: 100%; }
    .weekly-card li:last-child .trend-article {display: flex; gap: 1.5rem; align-items: flex-start; border-top: 0; border-bottom: 0; padding: 0;}    
    .weekly-card .weekly-img {height: 11rem; width: 24rem; flex-shrink: 0; overflow: hidden; border:0.1rem solid #ddd;  } 
    .weekly-info {display: flex; flex-direction: column; gap: 0.6rem; margin:0;  flex-grow: 1;min-width: 0;}
    .trend-article {border-top:0; border-bottom:0; padding:0;}
    .trend-header {display:none;}
    
    .market-ibox {padding:4rem 2rem 2rem 3rem;}  
    .market-info::before {display:none;}    
}

@media (max-width: 1024px) {
    .nation-content-box{padding:4rem 2.4rem; gap:3rem}
    .nation-content-box .nation-info-wrap{ margin-right: calc(50% + 1rem)}
    .nation-content-box .nation-info-wrap .nation-info .flag-box{width: 6rem; height: 4.6rem;}
    .nation-content-box .nation-info-wrap .nation-info .info-box ul li{height: auto}
    .nation-content-box .nation-info-wrap .nation-info .info-box ul li dl dt{width:6rem; letter-spacing: -0.05rem;}
    /* .nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap{width:calc(50% - 3.5rem); right: 2.4rem}
    .nation-content-box .nation-bbs-wrap>ul>li{width:calc(50% - 1rem)}
    .nation-content-box .nation-bbs-wrap>ul>li:nth-child(2){margin-right: 1rem}
    .nation-content-box .nation-bbs-wrap>ul>li:nth-child(3){margin-left: 1rem}
    .nation-content-box .nation-bbs-wrap>ul>li:nth-child(4){margin-right: 1rem}
    .nation-content-box .nation-bbs-wrap>ul>li:nth-child(5){margin-left: 1rem} */
    .nation-content-box .nation-bbs-wrap>ul{gap:var(--krds-number-6) var(--krds-number-6)}
    .nation-content-box .nation-bbs-wrap>ul>li{flex:1 0 calc(50% - 1rem); }
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab>ul{gap:0.8rem}
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab ul li button.btn-tab{font-size:1.7rem;}
}
/* 반응형: 모바일 */
@media (max-width: 960px) {  
    .main-content {flex-direction:column; padding:0; min-height:none;}
    .left-column {max-width:100%; width:100%; position: static; min-height: auto; padding:5rem 2rem 4rem 2rem;}
    .right-column {margin-left: 0; padding: 0 1.6rem;  }
    .cbottom-right {flex-direction: column;}  
    .quick-links {align-items:center;  align-content: center;}
    .quick-link-btn {width:auto; max-width:12rem; padding-left:1rem; padding-right:1rem; }
    .quick-link-btn span {text-align:center;}
    .prepare-section .section-title { text-align:center;}
    .feature-cards {display:grid;grid-template-columns:repeat(2, 1fr); gap:2rem; padding:0 7rem; }
    .feature-card {min-height:12.6rem;}
    .feature-card:hover {border:0.1rem solid #000;}
    .card-title .svg-icon {display:none;}
    .card-title {padding:0;}
    /* .card-content .card-arrow {bottom:0; top:2rem;} */
    
    /* 국가별 모아보기 모비일섹션 */
    .country-section.pc-only {display:none;}
    .moble-only {display:block;}

    .weekly-card .weekly-img {height: 11rem; width:16rem; flex-shrink: 0; overflow: hidden; border:0.1rem solid #ddd;} 
    
    .market-ibox {padding:2rem 0 2rem 6.5rem;}
    .market-info::before {display:block;}    

}
@media (max-width: 768px) {
    .krds-modal.nation-modal[data-type=bottom-sheet] .modal-dialog .modal-content{right:auto; left:0; bottom:-100%; width: 100%; height: 80%; max-height: none !important; }
    .krds-modal.nation-modal.in[data-type=bottom-sheet] .modal-dialog .modal-content{left:0; bottom:0;}   
    .nation-modal .nation-top-box{padding:0;}
    .nation-modal .nation-top-box .left-box {flex-direction: column; gap:0;}
    .nation-modal .nation-top-box .left-box .nation-tit{width:100%; display: flex; align-items: center; justify-content: center; height: 8.2rem;  padding:1.6rem; border-bottom: 0.1rem solid #dddddd}
    .nation-modal .nation-top-box .left-box .full-box{width: 100%; padding: 1.6rem; gap:2rem}
    .nation-modal .nation-top-box .left-box .full-box .nation-center ul{flex: 1 1 0;}
    /* .nation-modal .nation-top-box .left-box .full-box .nation-center ul li{flex: 1;} */
    .nation-modal .nation-top-box .left-box .full-box .nation-center ul li .btn-center{width: 100%;}
    .nation-modal .nation-top-box .left-box .full-box .nation-center-list{margin-right: 0rem; width: 18rem}
    .nation-modal .btn-close{top:1.6rem !important; right:1.6rem !important; width: 5.2rem !important; height: 5.2rem !important}
    
    .nation-content-wrap{height: calc(100% - 16.6rem); padding-bottom:2rem;}
    .nation-content-box{gap:3rem; padding-bottom: 0;}
    
    .nation-content-box .nation-info-wrap{margin-right: 0; height: auto;}    
    .nation-content-box .nation-info-wrap .nation-info .flag-box{width: 15.5rem; height: 11.5rem}
    .nation-content-box .nation-bbs-wrap>ul>li.chart-wrap{width:auto; height: auto; }
    .nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap{ position:static}
    
    
    .nation-content-box .nation-bbs-wrap>ul{/*display: block;*/ border-top: 0.2rem solid #000; gap:0;}
    .nation-content-box .nation-bbs-wrap>ul>li{flex:1 0 100%; padding: 0; margin: 0; min-height: auto !important; height: auto !important; border-radius: 0; border:0; border-bottom: 0.1rem solid #000; }
    /* .nation-content-box .nation-bbs-wrap>ul>li:nth-child(2){margin-right: 0}
    .nation-content-box .nation-bbs-wrap>ul>li:nth-child(3){margin-left: 0}
    .nation-content-box .nation-bbs-wrap>ul>li:nth-child(4){margin-right: 0}
    .nation-content-box .nation-bbs-wrap>ul>li:nth-child(5){margin-left: 0} */
    .nation-content-box .nation-bbs-wrap>ul>li>.tit-box{width: auto; height: auto; margin: 0; opacity: 1; font-size:unset; padding: 0.2rem; }
    .nation-content-box .nation-bbs-wrap>ul>li .tab-area, .nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap.tab-area{ max-height: 0; padding: 0 2rem; margin: 0; border: 0; transition: all 0.4s ease; }
    .nation-content-box .nation-bbs-wrap>ul>li .tab-area.active, .nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap.tab-area.active{max-height: 30rem; }
    
    .nation-content-box .nation-bbs-wrap>ul>li>.tit-box .btn-accordion_modal{ display: flex;width: 100%; padding: 0 2.4rem 0 2rem; font-size: 2.1rem; color:#000; font-weight: 700; align-items: center; height: 6.5rem; position: relative;}
    .nation-content-box .nation-bbs-wrap>ul>li>.tit-box .btn-accordion_modal:before{content:"- "; display: inline-flex;}
    .nation-content-box .nation-bbs-wrap>ul>li>.tit-box .btn-accordion_modal:after{content:""; display: block; position: absolute; top:calc(50% - 0.2rem); right: 2.6rem; width: 1rem; height: 1rem; border-bottom: 0.1rem solid #000; border-left: 0.1rem solid #000; transform: rotate(-45deg) translateY(-50%);}
    .nation-content-box .nation-bbs-wrap>ul>li>.tit-box .btn-accordion_modal[aria-expanded=true]:after{ transform: rotate(135deg) translateY(-50%); right: 3.4rem}
    
    .nation-content-box .nation-bbs-wrap>ul>li .tab-area.active{background: #f2f4f6; padding: 2rem }
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab{border-bottom: 0; margin-bottom: 2rem}
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab>ul{gap:0; }
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab>ul li{ padding: 0; margin: 0; display: inline-flex;}
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab ul li button.btn-tab{padding: 0 1.4rem; height: 5rem; align-items:center; color:#888; font-size: 1.9rem; background: #fff; border: 0.1rem solid #ddd;   border-bottom: 0.1rem solid #ddd; border-left: 0; }
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab>ul li:first-child button.btn-tab{border-left: 0.1rem solid #ddd; border-radius: 0.8rem 0 0 0.8rem }
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab>ul li:last-child button.btn-tab{border-radius:0 0.8rem 0.8rem 0; }
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab ul li.active button.btn-tab{ border-bottom: 0.1rem solid #ddd;}
    
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section .more-btn{ top: 3.3rem; right: 2rem;  }
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul{padding:0 1.5rem;}
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul li{height: auto}
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul.event-bbs-list li a span.cate{margin-right: 0.4rem}
    
    /*차트보기*/
    .nation-content-box .nation-bbs-wrap>ul>li.chart-wrap{border-bottom: 0.1rem solid #000; width: 100%; height: auto !important; order: 5;}
    .nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap{width: 100%; border-radius: 0; background:#f6e7ec !important}
    .nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap .tit-box{margin-bottom: 2rem}
    
    /*모집중인행사*/
    .section-controls-inline {top:-2.8rem;}
}
@media (max-width: 600px) {
    .card-tab.active .card-subtxt {display:none;}
     .left-grid {padding:3rem 2rem 2rem 2rem;}
    .events-tabs-wrapper .tab-btn {font-size:2.4rem;} 
    .trends-section .section-title{font-size:2.4rem;} 
    .focus-section .tab-btn {font-size:2.4rem;} 
    .trends-section {padding:3rem;}
    .focus-section{padding:3rem;min-width:100%;box-sizing: border-box;}
    .marketplace-section{padding:3rem;}
    .feature-cards {display:grid;grid-template-columns:repeat(2, 1fr); gap:2rem; padding:0; }
    .weekly-card {gap:1.5rem; margin-top:2.5rem;}    
    .country-toggle-btn {padding:1rem 4rem;}
}

@media (max-width: 550px) {
    .nation-modal .nation-top-box .left-box .full-box .nation-center{flex: 1;}
    .nation-modal .nation-top-box .left-box .full-box .nation-center ul li{flex: 1;}
    .nation-modal .nation-top-box .left-box .full-box .nation-center ul li .btn-center{padding-left: 1.6rem;  padding-right: 3rem; background-position: calc(100% - 1.6rem) center;}
    .nation-modal .nation-top-box .left-box .full-box .nation-center ul li .btn-center span{display: none;}
    .nation-modal .nation-top-box .left-box .full-box .nation-center-list{ width:30%}
    .nation-modal .nation-top-box .left-box .full-box .nation-center-list select{width:100%; font-size: 1.5rem; padding: 0 0.6rem !important; background-position:center right 0.6rem}
    
    .nation-content-box .nation-info-wrap .nation-info{flex-direction:column}
    .nation-content-box .nation-info-wrap .nation-info .flag-box{width: 9rem; height: 6.8rem; margin: 0 auto}
    
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab{margin-bottom: 1rem;}
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab ul li button.btn-tab{font-size: 1.7rem;}
  
}

@media (max-width: 500px) {
    .events-tabs-wrapper .tab-btn {font-size:2.2rem; margin-right:0.5rem;}
    .trends-section .section-title {font-size:2.2rem;}
    .focus-section .tab-btn {font-size:2.2rem;margin-right:0.5rem;}
    .event-item a {gap:2rem;}
    .feature-card {padding:1.5rem; gap:1.5rem; height:100%; min-height:17rem;}
    .section-controls .control-btn {width:1.5rem; height:1.5rem;}
    .section-controls .control-btn .svg-icon {width:1rem; height:1.2rem;}
    .section-controls .control-btn .ico-plus {width:2rem; height:2rem;}
}

@media (max-width: 480px) {
    .nation-modal .nation-top-box .left-box .full-box{gap:1.6rem}
    .nation-modal .nation-top-box .left-box .full-box .nation-center ul li .btn-center{background-image: none; padding:0 0.6rem; align-items: center}
    .nation-content-box{width:90%; padding-left: 0; padding-right: 0;}
    .nation-content-box .nation-bbs-wrap>ul>li .tab-area.active{padding: 1.4rem;}
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section .more-btn{top:2.4rem}
}

@media (max-width: 450px) {
	
	/*진출 안내 버튼
	.card-content .card-arrow{display:none;}*/
	
    /*해외센터 게시판*/
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab ul li{flex: 1; }
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul{padding:0 0.6rem ;}
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section .more-btn{position: static; order:2;  text-align: right;}
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section .more-btn button.btn-more{width: auto; background-image: none; }
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section .more-btn button.btn-more:before{content:"더보기"; display: inline-flex;}
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section .more-btn button.btn-more:after{content:""; display: inline-flex; width: 1rem; height: 1rem; border-bottom: 0.1rem solid #000; border-left: 0.1rem solid #000; transform: rotate(225deg) ;}
    .nation-content-box .nation-bbs-wrap>ul>li>.tab-area .tab-conts-wrap section ul{order:1;}
    
    .krds-modal.nation-modal[data-type=bottom-sheet] .modal-dialog .modal-content{height:100%; border-radius:0; top:0; left:100%;}
    .krds-modal.nation-modal.in[data-type=bottom-sheet] .modal-dialog .modal-content{left:0; }        
    
}

@media (max-width: 400px) {
    .nation-modal .nation-content-wrap .nation-search-wrap .nation-search{width: 90%}
    .nation-modal .nation-content-wrap .nation-search-wrap .nation-search .nation-input{min-width: 0}
    
    .nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap .tit-box h4 span{display: block; padding-left:0;}
    .nation-content-box .nation-bbs-wrap>ul>li .nation-chart-wrap .tit-box .more-btn{top:1rem}
    
   
}
@media (max-width: 390px) {
    .events-tabs-wrapper .tab-btn {font-size:1.9rem; margin-right:0;}
    .trends-section .section-title {font-size:2rem;}
    .focus-section .tab-btn {font-size:2rem;margin-right:0;}
    .carousel-progress .carousel-pagination {margin-left:0;}
    .weekly-card .weekly-img {width:9rem;}
}
