/* 공통 */
h2.heading { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: calc(var(--Titfont) * 2.4); font-weight: 800; line-height: 1.3; color: #1D1D1D; flex: 1; }
.swiper-button-next,
.swiper-button-prev { background: none !important; position: unset !important; top: auto !important; bottom: auto !important; left: auto !important; right: auto !important; margin: 0 !important; }
.btn_more { display: inline-flex; align-items: center; justify-content: center; position: absolute; right: 0; top: 0; border-radius: 50%; background: #1D1D1D; width: calc(var(--mainfont) * 2.5); height: calc(var(--mainfont) * 2.5); color: #fff; font-size: var(--mainfont); transition: 0.2s ease-in-out; }
.btn_more:hover,
.btn_more:focus { transform: rotate(180deg); }

/* 메인비주얼 */
.visual { position: relative; } 
.visual .swiper { isolation: isolate; border-radius: calc(var(--mainfont) * 4); overflow: hidden; }
.visual .swiper-slide p { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 0; line-height: 0; background: #e1e1e1; }
.visual .swiper-slide p img { width: 100%; }
.visual .cntBtn { position: absolute; left: 50%; transform: translateX(-50%); bottom: calc(var(--mainfont) * 3.9); display: inline-flex; align-items: center; border-radius: 1.5rem; background: rgba(29,29,29,0.75); padding: calc(var(--mainfont) * 0.65) calc(var(--mainfont) * 1.5); z-index: 2; color: #fff; }
.visual .cntBtn button { display: inline-flex; align-items: center; justify-content: center; width: var(--mainfont); height: var(--mainfont); font-size: var(--mainfont); }
.visual .cntBtn button.pause { margin: 0 calc(var(--mainfont) * 0.75); }
.visual .cntBtn button.pause.play .ri-pause-line,
.visual .cntBtn button.pause .ri-play-fill { display: none; }
.visual .cntBtn button.pause .ri-pause-line,
.visual .cntBtn button.pause.play .ri-play-fill { display: block; }
.visual .cntBtn .page { height: calc(var(--mainfont) * 1.2); display: flex; align-items: center; font-size: var(--mainfont); margin-left: calc(var(--mainfont) * 0.75); }
.visual .cntBtn .page strong { font-weight: bold; }
.visual .cntBtn .page span { position: relative; padding-left: calc(var(--mainfont) * 0.75); margin-left: calc(var(--mainfont) * 0.5); }
.visual .cntBtn .page span::before { position: absolute; content: ""; border-radius: 50%; width: calc(var(--mainfont) * 0.25); height: calc(var(--mainfont) * 0.25); top: 50%; transform: translateY(-50%); left: 0; background: #D9D9D9; }
 
/* 프로그램 안내 */
.program { position: relative; display: flex; flex-wrap: wrap; gap: calc(var(--mainfont) * 4);
    --proHeight : 22.5rem;
}
.program .titWrap { width: 16rem; position: relative; z-index: 2; }
.program .titWrap > p { font-size: var(--mainfont); font-weight: bold; color: #ccc; letter-spacing: 10%; }
.program .titWrap > h2.heading { margin: calc(var(--mainfont) * 0.8) 0 calc(var(--mainfont) * 1.6); }
.program .titWrap > .tabBox ul { display: flex; flex-direction: column; gap: calc(var(--mainfont) * 0.8); width: 100%; }
.program .titWrap > .tabBox ul li a { display: flex; align-items: center; justify-content: start; border: 1px solid #D6D6D6; border-radius: calc(var(--radius) * 5); padding: 0 calc(var(--mainfont) * 1.5); height: calc(var(--mainfont) * 3.8); color: #666666; font-size: calc(var(--mainfont) * 1.1); font-weight: 500; line-height: var(--basicLine); position: relative; }
.program .titWrap > .tabBox ul li a::before { position: absolute; content: ""; top: 50%; transform: translateY(-50%); left: 100%; width: 0; background: linear-gradient(to right, #1E2B4D, #fff); height: 2px; }

@keyframes grow {
    0% { width: 0%; }
    100% { width: calc(var(--mainfont) * 4); }
}

.program .titWrap > .tabBox ul li a::after { position: absolute; content: ""; top: 50%; transform: translate(-50%, -50%); left: calc(100% + calc(var(--mainfont) * 4)); width: calc(var(--mainfont) * 1.25); height: calc(var(--mainfont) * 1.25); border-radius: 50%; background: #1e2b4d; border: calc(var(--mainfont) * 0.35) solid #fff; box-shadow: 0px 0px 10px rgba(0,0,0,0.25); opacity: 0; visibility: hidden; transition: 0.2s ease-in-out; }
.program .titWrap > .tabBox ul li a span { max-width: 100%; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.program .titWrap > .tabBox ul li a.current { color: #fff; background: #1E2B4D; border-color: #1E2B4D; font-weight: bold; }
.program .box { width: calc(100% - calc(16rem + calc(var(--mainfont) * 4))); display: none; position: relative; }
.program .box.on { display: block; }
.program .box .cntBtn { position: absolute; right: 0; top: 0; display: flex; align-items: center; gap: calc(var(--mainfont) * 0.4); z-index: 2; }
.program .box .cntBtn .page { display: inline-flex; align-items: center; background-color: #1D1D1D; color: #fff; border-radius: 100rem; height: calc(var(--mainfont) * 2.5); padding: 0 var(--mainfont); width: auto !important; }
.program .box .cntBtn .page strong { font-weight: bold; }
.program .box .cntBtn .page span { position: relative; padding-left: calc(var(--mainfont) * 0.75); margin-left: calc(var(--mainfont) * 0.5); }
.program .box .cntBtn .page span::before { position: absolute; content: ""; border-radius: 50%; width: calc(var(--mainfont) * 0.25); height: calc(var(--mainfont) * 0.25); top: 50%; transform: translateY(-50%); left: 0; background: #fff; }
.program .box .cntBtn button { display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; width: calc(var(--mainfont) * 2.5); height: calc(var(--mainfont) * 2.5); border: 1px solid #000000; background: #fff; color: #000; font-size: var(--mainfont); }
.program .box .cntBtn button.pause { background: #EDEDED; border-color: #EDEDED; }
.program .box .cntBtn button.pause.play .ri-pause-line,
.program .box .cntBtn button.pause .ri-play-fill { display: none; }
.program .box .cntBtn button.pause .ri-pause-line,
.program .box .cntBtn button.pause.play .ri-play-fill { display: block; }
.program .box .swiper { width: 100%; }
.program .box .swiper-slide { width: 100% !important; display: flex; flex-wrap: wrap; gap: calc(var(--mainfont) * 2.5); }
.program .box .swiper-slide .videoWrap { flex: 1; overflow: hidden; position: relative; border-radius: calc(var(--radius) * 3); height: var(--proHeight); }
.program .box .swiper-slide .videoWrap::before { position: absolute; content: ""; width: 100%; height: 100%; background: rgba(0,0,0,0.5); left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 1; }
.program .box .swiper-slide .videoWrap .vdo_crt { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2; }
.program .box .swiper-slide .videoWrap .vdo_crt .play { display: inline-flex; align-items: center; justify-content: center; color: #fff; border: 1px solid #fff; width: calc(var(--mainfont) * 6); height: calc(var(--mainfont) * 6); border-radius: 50%; font-size: calc(var(--mainfont) * 1.75); } 
/* .program .box .swiper-slide .videoWrap .vdo_crt button.play { display: inline-flex; }
.program .box .swiper-slide .videoWrap .vdo_crt button.stop,
.program .box .swiper-slide .videoWrap.actv .vdo_crt button.play { display: none; } */
.program .box .swiper-slide .videoWrap .video { display: flex; align-items: center; justify-content: center; height: 100%; width: 100%; background: #e1e1e1; height: var(--proHeight); }
.program .box .swiper-slide .videoWrap .video img,
.program .box .swiper-slide .videoWrap video,
.program .box .swiper-slide .videoWrap iframe { max-width: 100%; object-fit: contain; height: 100%; }
.program .box .no_data { height: var(--proHeight); width: 100%; background: #e1e1e1; border-radius: calc(var(--radius) * 3); display: flex; align-items: center; justify-content: center; font-size: calc(var(--mainfont) * 0.9); font-weight: 500; }
.program .box .swiper-slide .txt { position: relative; width: 44.167%; margin-top: calc(var(--mainfont) * 3.74); }
/* .program .box .swiper-slide .txt .goLnk { display: inline-flex; align-items: center; justify-content: center; position: absolute; right: 0; top: 0; width: calc(var(--mainfont) * 2.5); height: calc(var(--mainfont) * 2.5); border-radius: 50%;  background: #EF1C23; color: #fff; font-size: calc(var(--mainfont) * 1.25); box-shadow: 0px 0px 0px 7px rgba(239,28,35,0.1); } */
.program .box .swiper-slide .txt > p { color: #1D1D1D; font-size: calc(var(--mainfont) * 1.2); font-weight: bold; line-height:  1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.program .box .swiper-slide .txt > ul { margin: calc(var(--mainfont) * 1) 0 calc(var(--mainfont) * 1.25); padding-top: calc(var(--mainfont) * 1.25); border-top: 1px solid rgba(29,29,29,0.2); width: 100%; display: flex; flex-wrap: wrap; gap: calc(var(--mainfont) * 1); }
.program .box .swiper-slide .txt > ul > li { position: relative; padding-left: calc(var(--mainfont) * 5.5); color: #1D1D1D; font-size: calc(var(--mainfont) * 1); line-height: var(--basicLine); }
.program .box .swiper-slide .txt ul li { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.program .box .swiper-slide .txt > ul > li > span { position: absolute; left: 0; top: 0; display: inline-flex; align-items: center; gap: calc(var(--mainfont) * 0.25); font-weight: 600; font-size: calc(var(--mainfont) * 0.95); }
.program .box .swiper-slide .txt > ul > li > span > i { display: inline-flex; align-items: center; justify-content: center; width: calc(var(--mainfont) * 1.25); height: calc(var(--mainfont) * 1.35); }
.program .box .swiper-slide .txt > ul > li.date > ul { display: flex; flex-direction: column; gap: calc(var(--mainfont) * 0.6); } 
.program .box .swiper-slide .txt > ul > li.date > ul > li { position: relative; padding-left: calc(var(--mainfont) * 3.3); }
.program .box .swiper-slide .txt > ul > li.date > ul > li > span { position: absolute; left: 0; top: 0; padding-right: calc(var(--mainfont) * 0.5); width: calc(var(--mainfont) * 2.75); }
.program .box .swiper-slide .txt > ul > li.date > ul > li > span:before { position: absolute; content: ""; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: calc(var(--mainfont) * 0.6); background: #d9d9d9; }
.program .box .swiper-slide .txt .last-txt { display: flex; align-items: center; justify-content: start; border-radius: calc(var(--radius) * 0.5); background: #F8F8F8; padding: calc(var(--mainfont) * 0.5) calc(var(--mainfont) * 1); color: #888888; font-size: calc(var(--mainfont) * 0.9); line-height: var(--basicLine); }
/* 프로그램 안내 : active */
.program .titWrap > .tabBox ul li a.current::before { animation: grow 0.2s ease-in-out forwards; }
.program .titWrap > .tabBox ul li a.current::after { opacity: 1; visibility: visible; transition-delay: 0.2s; }

/* 탐구교실 안내 */
.explore { display: flex; flex-wrap: wrap; width: 100%; position: relative; }
.explore::before { position: absolute; content: ""; top: calc(var(--mainfont) * -10); left: calc(var(--mainfont) * -15.95); background: url('/00_common/images/template/T0002/main/expl_img_05.png')no-repeat center center / contain;  width: calc(var(--mainfont) * 29.75); height: calc(var(--mainfont) * 29.75); }
.explore .lft { position: relative; width: 40rem; height: 23.2rem; border-radius: calc(var(--radius) * 4) calc(var(--radius) * 4) 0 calc(var(--radius) * 4); background: #00AAFF; color: #fff; padding: calc(var(--mainfont) * 5) calc(var(--mainfont) * 12.2) calc(var(--mainfont) * 3.1) calc(var(--mainfont) * 12.2); display: flex; flex-direction: column; }
.explore .lft::before { position: absolute; content: ""; bottom: calc(var(--mainfont) * -12); left: 50%; transform: translateX(-50%); width: calc(var(--mainfont) * 21.7); height: calc(var(--mainfont) * 21.5); border-radius: 50%; background: rgba(255,255,255,0.2); }
.explore .lft .chr_01,
.explore .lft .bg_01,
.explore .lft .bg_02 { position: absolute; content: ""; }
.explore .lft .chr_01 { bottom: -2.5rem; left: calc(var(--mainfont) * 1.8); max-width: calc(var(--mainfont) * 9); }
.explore .lft .bg_02 { top: calc(var(--mainfont) * 3.65); right: calc(var(--mainfont) * 10.1); max-width: calc(var(--mainfont) * 2.35); }
.explore .lft .bg_01 { left: calc(var(--mainfont) * 2.05); top: calc(var(--mainfont) * 2.65); max-width: calc(var(--mainfont) * 9.75); }
.explore .lft > span { display: block; font-size: calc(var(--mainfont) * 1.4); line-height: var(--basicLine); font-weight: 500; text-shadow: 0px 0px 20px rgba(0,0,0,0.2); }
.explore .lft > p { display: block; line-height: 1.3; font-weight: bold; font-size: calc(var(--mainfont) * 2.4); letter-spacing: -2%; text-shadow: 0px 0px 20px rgba(0,0,0,0.2); margin-top: calc(var(--mainfont) * 0.3); }
.explore .lft > .goLnk { display: inline-flex; align-items: center; justify-content: center; padding: 0 calc(var(--mainfont) * 3.25); background: #fff; color: #1D1D1D; font-size: calc(var(--mainfont) * 1.1); font-weight: bold; line-height: var(--basicLine); border-radius: 1000rem; height: calc(var(--mainfont) * 3.65); margin: calc(var(--mainfont) * 2.4) auto 0; position: relative; z-index: 1; transition: 0.2s ease-in-out; }
.explore .lft > .goLnk:hover,
.explore .lft > .goLnk:focus { background: #1E2B4D; color: #fff; }
.explore .rgt { background: #fff; box-shadow: 0px 0px 80px rgba(0,0,0,0.1); width: 47.5rem; height: 22.45rem; border-radius: calc(var(--radius) * 4) calc(var(--radius) * 4) calc(var(--radius) * 4) 0; position: absolute; margin-left: 2.5rem; right: 0; bottom: -2.5rem; padding: calc(var(--mainfont) * 2.75) calc(var(--mainfont) * 2.5) calc(var(--mainfont) * 2.5); }
.explore .rgt .chr_02 { position: absolute; right: calc(var(--mainfont) * 2); bottom: calc(var(--mainfont) * 3); max-width: calc(var(--mainfont) * 11.7); z-index: 1; }
.explore .rgt ul { display: flex; flex-direction: column; gap: calc(var(--mainfont) * 0.8); width: 100%; overflow-y: auto; height: calc(calc(var(--mainfont) * 3.2) + calc(var(--mainfont) * 14)); }
.explore .rgt ul li { position: relative; padding-left: calc(var(--mainfont) * 7.1); line-height: calc(var(--mainfont) * 2.8); }
.explore .rgt ul li > span { display: inline-flex; align-items: center; justify-content: center; border: 1px solid #000000; border-radius: calc(var(--radius) * 50); color: #000; height: 100%; width: calc(var(--mainfont) * 5.5); padding: 0 calc(var(--mainfont) * 0.75); position: absolute; left: 0; top: 0; font-size: var(--mainfont); font-weight: bold; }
.explore .rgt ul li p { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; background: #FAFAFA; color: #000; border-radius: calc(var(--radius) * 50); padding: 0 var(--mainfont); font-size: var(--mainfont); }

/* 센터 소식 */
.notice { position: relative; }
.notice .titWrap { display: flex; flex-wrap: wrap; align-items: center; padding-right: calc(var(--mainfont) * 3); }
.notice .titWrap h2 { flex: none; max-width: 30%; line-height: calc(var(--mainfont) * 2.5); }
.notice .tabBox { width: 70%; padding-left: calc(var(--mainfont) * 2.8); }
.notice .tabBox ul { display: flex; width: 100%; gap: calc(var(--mainfont) * 2.25); }
.notice .tabBox ul li { position: relative; max-width: calc((100% - calc(var(--mainfont) * 2.25)) / 2); }
.notice .tabBox ul li::before { position: absolute; content: ""; border-radius: 50%; width: 0.25rem; height: 0.25rem; background: #D9D9D9; top: 50%; transform: translateY(-50%); right: calc(calc(var(--mainfont) * 2.25) / -1.75); }
.notice .tabBox ul li:last-child:before { display: none; }
.notice .tabBox ul li a { display: block; position: relative; color: #666; font-size: calc(var(--mainfont) * 1.4); font-weight: 500; line-height: var(--basicLine); transition: 0.2s ease-in-out; }
.notice .tabBox ul li a::before { position: absolute; content: "\eb80"; left: 0; top: 50%; transform: translateY(-50%); color: #2f52d4; font-family: 'remixicon'; opacity: 0; visibility: hidden; transition: 0.2s ease-in-out; }
.notice .tabBox ul li a span { position: relative; padding: 0 calc(var(--mainfont) * 0.5); z-index: 1; max-width: 100%; white-space: nowrap; overflow: hidden; display: block; }
.notice .tabBox ul li a span::before { position: absolute; content: ""; bottom: 0; width: 0%; left: 50%; transform: translateX(-50%); border-radius: 2.5rem; background: rgba(47,82,212,0.1); height: calc(var(--mainfont) * 0.75); z-index: -1; transition: 0.2s ease-in-out; }
.notice .lst { display: none; margin-top: calc(var(--mainfont) * 1.9);
    --noticeHeight: 11.5rem;
}
.notice .lst.on { display: block; }
.notice .lst ul { display: flex; gap: calc(var(--mainfont) * 1.5); }
.notice .lst ul li { width: calc((100% - calc(var(--mainfont) * 3)) / 3); height: var(--noticeHeight); }
.notice .lst ul li:nth-child(n + 4) { display: none; }
.notice .lst ul li.no_data { width: 100%; display: flex; align-items: center; justify-content: center; border-radius: var(--radius); font-size: calc(var(--mainfont) * 0.9); font-weight: 500; background: #e1e1e1; }
.notice .lst ul li a { display: block; background: #FAFAFA; border: 1px solid transparent; border-radius: calc(var(--radius) * 1); padding: calc(var(--mainfont) * 1.5) calc(var(--mainfont) * 1.25) calc(var(--mainfont) * 4.1); position: relative; height: 100%; }
.notice .lst ul li a .top { display: flex; align-items: center; justify-content: space-between; }
.notice .lst ul li a .top > span { display: inline-flex; align-items: center; justify-content: center; border: 1px solid #D6D6D6; font-size: calc(var(--mainfont) * 0.9); color: #1D1D1D; font-weight: 600; padding: 0 calc(var(--mainfont) * 0.8); height: calc(var(--mainfont) * 1.8); border-radius: calc(var(--radius) * 2.5); background: #fff; }
.notice .lst ul li a .top > em { color: #8E8E8E; font-size: calc(var(--mainfont) * 0.9); font-weight: bold; }
.notice .lst ul li a p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; color: #1d1d1d; font-size: var(--mainfont); line-height: calc(var(--mainfont) * 1.5); font-weight: 500; height: calc(var(--mainfont) * 3); margin-top: calc(var(--mainfont) * 1.25); }
.notice .lst ul li a span.more { position: absolute; bottom: calc(var(--mainfont) * 1.5); right: calc(var(--mainfont) * 1.25); display: inline-flex; align-items: center; gap: calc(var(--mainfont) * 0.4); color: #999999; font-size: calc(var(--mainfont) * 0.9); font-weight: 600; line-height: var(--basicLine); }
.notice .lst ul li a span.more i { display: inline-flex; align-items: center; justify-content: center; width: var(--mainfont); height: var(--mainfont); font-width: 400; }
/* 센터 소식 : active */
.notice .lst ul li a,
.notice .lst ul li a span.more { transition: 0.2s ease-in-out; }
.notice .lst ul li a:hover,
.notice .lst ul li a:focus { background: #fff; border-color: #1D1D1D; }
.notice .lst ul li a:hover p,
.notice .lst ul li a:focus p { font-weight: bold; }
.notice .lst ul li a:hover span,
.notice .lst ul li a:focus span { color: #1D1D1D; }
.notice .tabBox ul li a:hover,
.notice .tabBox ul li a:focus { color: #1d1d1d; }
.notice .tabBox ul li a.current { padding-left: calc(var(--mainfont) * 1.5); color: #1d1d1d; font-weight: bold; }
.notice .tabBox ul li a.current::before { opacity: 1; visibility: visible; }
.notice .tabBox ul li a.current span::before { width: 100%; }

/* 주요 서비스 */
.service { position: relative; display: flex; flex-wrap: wrap; background: #2C354E; border-radius: calc(var(--radius) * 2); padding: calc(var(--mainfont) * 2.4) calc(var(--mainfont) * 2) calc(var(--mainfont) * 2.4) calc(var(--mainfont) * 3); overflow: hidden; width: 100%; height: 100%; }
.service::before { position: absolute; content: ""; border-radius: 50%; background: rgba(255,255,255,0.1); left: calc(var(--mainfont) * -8.2); width: calc(var(--mainfont) * 21.7); height: calc(var(--mainfont) * 21.5); bottom: calc(var(--mainfont) * -17); }
.service .titWrap { width: 9.7rem; }
.service .titWrap h2 { font-size: calc(var(--mainfont) * 1.6); position: relative; padding-top: calc(var(--mainfont) * 2); color: #fff; line-height: 1; display: inline-block; overflow: visible; white-space: wrap; }
.service .titWrap h2::before { position: absolute; content: ""; top: 0; right: calc(var(--mainfont) * -0.85); width: calc(var(--mainfont) * 1.3); height: calc(var(--mainfont) * 1.25); background: url('/00_common/images/template/T0002/main/service_ico05.png') no-repeat center center / contain; } 
.service .lst { flex: 1; overflow: hidden; }
.service .lst ul { display: flex; }
.service .lst ul li { flex: 1; overflow: hidden; }
.service .lst ul li a { display: block; width: 100%; text-align: center; padding: 0 calc(var(--mainfont) * 0.8); position: relative; }
.service .lst ul li:first-child a::before { display: none; }
.service .lst ul li a::before { position: absolute; content: ""; left: 0; top: 0; width: 1px; height: 100%; border-left: 1px dashed rgba(255,255,255,0.3); }
.service .lst ul li a .img { display: inline-flex; align-items: center; justify-content: center; font-size: 0; line-height: 0; margin: 0 auto; width: 100%; height: calc(var(--mainfont) * 6); }
.service .lst ul li a .img img { max-width: calc(var(--mainfont) * 7.15); max-height: 100%; }
.service .lst ul li a p { color: #fff; position: relative; display: inline-block; font-size: var(--mainfont); font-weight: 500; line-height: calc(var(--mainfont) * 1.5); white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; transition: 0.2s ease-in-out; }
.service .lst ul li a p::after { position: absolute; content: "\ea70"; align-items: center; justify-content: center; background: #fff; border-radius: 50%; font-size: var(--mainfont); width: calc(var(--mainfont) * 1.5); height: calc(var(--mainfont) * 1.5); font-family: 'remixicon'; color: #1D1D1D; transition: 0.2s ease-in-out; opacity: 0; visibility: hidden; right: 0; top: 50%; transform: translateY(-50%); }
/* 주요 서비스 : active */
.service .lst ul li a:hover p,
.service .lst ul li a:focus p { padding-right: calc(var(--mainfont) * 2.1); }
.service .lst ul li a:hover p::after,
.service .lst ul li a:focus p::after { opacity: 1; visibility: visible; }

/* 팝업존 */
.popupzone { position: relative; width: 100%; border-radius: calc(var(--radius) * 2); overflow: hidden; height: 100%; }
.popupzone .control { display: inline-flex; align-items: center; position: absolute; bottom: 0; right: 0; background: rgba(29,29,29,0.75); border-radius: calc(var(--radius) * 1.5) 0 0 0; color: #fff; z-index: 3; height: calc(var(--mainfont) * 2.5); padding: 0 calc(var(--mainfont) * 1.5); }
.popupzone .control button { display: inline-flex; align-items: center; justify-content: center; width: var(--mainfont); height: var(--mainfont); font-size: var(--mainfont); }
.popupzone .control button.pause { margin: 0 calc(var(--mainfont) * 0.5); }
.popupzone .control button.pause.play .ri-pause-line,
.popupzone .control button.pause .ri-play-fill { display: none; }
.popupzone .control button.pause .ri-pause-line,
.popupzone .control button.pause.play .ri-play-fill { display: block; }
.popupzone .control .page { margin-left: calc(var(--mainfont) * 0.75); display: inline-flex; align-items: center; font-size: var(--mainfont); color: #fff; }
.popupzone .control .page strong { font-weight: bold; }
.popupzone .control .page span { position: relative; padding-left: calc(var(--mainfont) * 0.75); margin-left: calc(var(--mainfont) * 0.5); }
.popupzone .control .page span::before { position: absolute; content: ""; border-radius: 50%; width: calc(var(--mainfont) * 0.25); height: calc(var(--mainfont) * 0.25); top: 50%; transform: translateY(-50%); left: 0; background: #D9D9D9; }
.popupzone .popup,
.popupzone .popup .swiper { height: 100%; }
.popupzone .swiper-slide a { display: flex; align-items: center; justify-content: center; font-size: 0; line-height: 0; background: #e1e1e1; position: relative; width: 100%; height: 100%; } 
.popupzone .swiper-slide a::before { position: absolute; content: ""; width: 100%; height: 100%; background: transparent; border: 2px solid #111; border-radius: calc(var(--radius) * 2); opacity: 0; visibility: hidden; z-index: 2; }
.popupzone .swiper-slide a:focus::before { opacity: 1; visibility: visible; }
.popupzone .swiper-slide a img { max-width: 100%; height: 100%; object-fit: contain; }


/***** 반응형 *****/

@media screen and (max-width: 1640px) {
    /* 탐구교실 안내 */
    .explore .lft { width: 50%; padding: calc(var(--mainfont) * 5) calc(var(--mainfont) * 10) calc(var(--mainfont) * 3.1) calc(var(--mainfont) * 10); }
    .explore .rgt { width: 60%; }

    /* 주요 서비스 */
    .service { padding:calc(var(--mainfont) * 2.4) calc(var(--mainfont) * 1.5) calc(var(--mainfont) * 2.4) calc(var(--mainfont) * 2);  }
    .service .titWrap { width: 8rem; }
}

@media screen and (max-width: 1440px) {
    /* 탐구교실 안내 */
    .explore .lft { padding: calc(var(--mainfont) * 5) calc(var(--mainfont) * 5) calc(var(--mainfont) * 3.1) calc(var(--mainfont) * 5); text-align: center; justify-content: center; align-items: center; }
    .explore .lft .bg_02 { top: calc(var(--mainfont) * 3); right: calc(var(--mainfont) * 9.5); }
    .explore .lft .chr_01 { max-width: calc(var(--mainfont) * 7); }
    .explore .rgt .chr_02 { max-width: calc(var(--mainfont) * 9); }

    /* 센터 소식 */
    .notice .lst { 
        --noticeHeight : 15.6rem;
    }
}

@media screen and (max-width: 1240px) {
    h2.heading { font-size: calc(var(--Titfont) * 2.2); line-height: calc(var(--mainfont) * 2.25); }

    /* 메인비주얼 */
    .visual .swiper { border-radius: calc(var(--mainfont) * 2); }
    .visual .cntBtn { bottom: calc(var(--mainfont) * 2); }

    /* 프로그램 안내 */
    .program { gap: calc(var(--mainfont) * 2.5);
        --proHeight : calc(var(--mainfont) * 17.5);
    }  
    .program .titWrap > h2.heading { margin: calc(var(--mainfont) * 0) 0 calc(var(--mainfont) * 1.25); }
    .program .box,
    .program .titWrap { width: 100%; }
    .program .titWrap > p,
    .program .titWrap > .tabBox ul li a::before,
    .program .titWrap > .tabBox ul li a::after { display: none; }
    .program .titWrap > .tabBox ul { flex-direction: row; flex-wrap: wrap; }
    .program .titWrap > .tabBox ul > li { width: calc((100% - calc(var(--mainfont) * 1.6)) / 3); }
    .program .box .swiper-slide .txt { width: 55%; }  
    .program .box .swiper-slide { gap: calc(var(--mainfont) * 1.75); } 
    .program .box .swiper-slide .videoWrap { border-radius: calc(var(--radius) * 2); }
    .program .box .swiper-slide .videoWrap .vdo_crt .play { width: calc(var(--mainfont) * 4.5); height: calc(var(--mainfont) * 4.5); font-size: calc(var(--mainfont) * 1.5); }

    /* 탐구교실 안내 */
    .explore .lft .bg_01,
    .explore .lft .bg_02,
    .explore .rgt .chr_02,
    .explore .lft .chr_01 { display: none; }
    .explore .lft { padding: calc(var(--mainfont) * 5) calc(var(--mainfont) * 2) calc(var(--mainfont) * 3.1) calc(var(--mainfont) * 2); width: 32.5%; border-radius: calc(var(--radius) * 2) calc(var(--radius) * 2) 0 calc(var(--radius) * 2); text-align: start; align-items: start; justify-content: space-between; height: 100%; }
    .explore .rgt { border-radius: calc(var(--radius) * 2) calc(var(--radius) * 2) calc(var(--radius) * 2) 0; position: relative; right: auto; bottom: auto; margin-left: 0; width: 67.5%; display: flex; align-items: center; height: 100%; }
    .explore { height: 100%; }  
    .explore .lft > span { font-size: calc(var(--mainfont) * 1.2); } 
    .explore .lft > p { font-size: calc(var(--mainfont) * 2); }
    .explore .lft > .goLnk { height: calc(var(--mainfont) * 3); } 

    /* 센터 소식 */
    .notice .lst ul li { width: calc((100% - calc(var(--mainfont) * 1.5)) / 2); }
    .notice .lst ul li:nth-child(n + 3) { display: none; }
}

@media screen and (max-width: 1024px) {
    /* 주요 서비스 */
    .service .lst ul li a .img img { max-width: calc(var(--mainfont) * 6.5); }
}

@media screen and (max-width: 968px) {
    /* 프로그램 안내 */
    .program {
        --proHeight: calc(var(--mainfont) * 15);
    }

    /* 탐구교실 안내 */
    .explore .rgt,
    .explore .lft { width: 100%; height: auto; }
    .explore::before,
    .explore .lft > span { display: none; }
    .explore .lft { padding: calc(var(--mainfont) * 1.5); align-items: center; justify-content: center; text-align: center; }
    .explore .lft > .goLnk { margin: calc(var(--mainfont) * 1) auto 0; height: calc(var(--mainfont) * 2.75); }
    .explore .lft::before { bottom: calc(var(--mainfont) * -16); }
    .explore .rgt { padding: calc(var(--mainfont) * 2) 0; box-shadow: none; border-radius: 0; background: transparent; }
    .explore .rgt ul { height: auto; overflow: hidden; }
    .explore .rgt ul li > span { height: calc(var(--mainfont) * 2.8); }
    .explore .rgt ul li p { line-height: 1.5; white-space: wrap; min-height: calc(var(--mainfont) * 2.8); display: flex; align-items: center; padding: calc(var(--mainfont) * 0.5) calc(var(--mainfont) * 1.25); }

    /* 센터 소식 */
    .notice .lst { 
        --noticeHeight: 12.5rem;
    }

    /* 주요 서비스  */
    .service .titWrap { width: 100%; }
    .service .lst { flex: none; width: 100%; margin-top: calc(var(--mainfont) * 2); }
    .service .titWrap h2 { padding: 0; }
    .service::before,
    .service .titWrap h2::before { display: none; }
}

@media screen and (max-width: 768px) {
    /* 메인비주얼 */
    .visual .swiper-slide p { overflow: hidden; }
    .visual .swiper-slide p img { width: 150%; }

    /* 프로그램 안내 */
    .program {
        --proHeight: calc(var(--mainfont) * 17);
        gap: calc(var(--mainfont) * 1.85);
    }
    .program .titWrap > h2.heading { margin: calc(var(--mainfont) * 0) 0 calc(var(--mainfont) * 0.85); }
    .program .titWrap > .tabBox { position: relative; }
    .program .titWrap > .tabBox ul { overflow-x: auto; width: calc(100% + var(--cntpadding)); flex-wrap: nowrap; }
    .program .titWrap > .tabBox ul::-webkit-scrollbar { display: none; }
    .program .titWrap > .tabBox ul > li { width: auto; }
    .program .titWrap > .tabBox::after { position: absolute; content: ""; top: 0; right: calc(var(--cntpadding) * -1); width: 2.5rem; height: 100%; background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,0.9)); pointer-events: none; opacity: 0; visibility: hidden; transition: 0.2s ease-in-out; }
    .program .titWrap > .tabBox.is-scrollable::after { opacity: 1; visibility: visible; }
    .program .box .swiper-slide { flex-wrap: wrap; }
    .program .box .swiper-slide .videoWrap { flex: none; width: 100%; }
    .program .box .swiper-slide .txt { width: 100%; margin-top: calc(var(--mainfont) * 3); }
    .program .box .cntBtn { top: calc(var(--proHeight) + 1rem); }
    .program .titWrap > .tabBox ul li a { height: calc(var(--mainfont) * 3.25); }

    /* 탐구 교실 안내 */
    .explore .rgt ul li { padding-left: calc(var(--mainfont) * 6.5); }

    /* 주요 서비스 */
    .service .lst ul { flex-wrap: wrap; gap: calc(var(--mainfont) * 2) 0; }
    .service .lst ul li { flex: none; width: 50%; }
    .service .lst ul li:nth-child(2n + 1) a::before { display: none; }
}

@media screen and (max-width: 540px) {
    /* 센터소식 */
    .notice .tabBox { width: 100%; padding-left: 0; padding-right: calc(var(--mainfont) * 3); margin-top: calc(var(--mainfont) * 1); }
    .notice .titWrap { padding-right: 0; }
    .notice h2.heading { padding-right: 0; width: 100%; max-width: 100%; }
    .notice .btn_more { top: calc((var(--mainfont) * 2.5) + calc(var(--mainfont) * 0.75)); }
}

@media screen and (max-width: 480px) {
    /* 메인비주얼 */
    .visual .swiper-slide p img { width: 170%; }
    .visual .cntBtn { bottom: calc(var(--mainfont) * 1.5); }

    /* 프로그램 안내 */
    .program .box .swiper-slide .txt ul li { width: 100%; }
    /* .program .box .swiper-slide .txt .goLnk { box-shadow: 0px 0px 0px 5px rgba(239,28,35,0.1); } */

    /* 센터소식 */
    .notice .lst {
        --noticeHeight : 8.5rem;
    }
    .notice .lst ul { flex-wrap: wrap; }
    .notice .lst ul li { width: 100%; }
    .notice .lst ul li a span.more { display: none; }
    .notice .lst ul li a { padding: calc(var(--mainfont) * 1.5) calc(var(--mainfont) * 1.25); }

    /* 탐구 교실 안내 */
    .explore .rgt ul li { padding-left: calc(var(--mainfont) * 6); }
    .explore .rgt ul li > span { height: calc(var(--mainfont) * 2.5); }
    .explore .rgt ul li p { min-height: calc(var(--mainfont) * 2.5); padding: calc(var(--mainfont) * 0.5) calc(var(--mainfont) * 1.25); }
    .explore .lft > .goLnk { width: calc(100% - calc(var(--mainfont) * 4)); padding: 0 var(--mainfont); }

}

@media screen and (max-width: 380px) {
    .btn_more { font-size: calc(var(--mainfont) * 1.1); }

    /* 메인비주얼 */
    .visual .cntBtn { bottom: calc(var(--mainfont) * 1); padding: calc(var(--mainfont) * 0.45) calc(var(--mainfont) * 1.25); }
    .visual .cntBtn button.pause { margin: 0 calc(var(--mainfont) * 0.5); }

    /* 센터 소식 */
    .notice .tabBox ul { gap: calc(var(--mainfont) * 0.75) calc(var(--mainfont) * 1.85); flex-wrap: wrap; }
    .notice .tabBox ul li::before { right: calc(calc(var(--mainfont) * 1.85) / -1.75); }
    .notice .btn_more { top: calc((var(--mainfont) * 2.5) + calc(var(--mainfont) * 0.65)); }
    .notice .lst { margin-top: calc(var(--mainfont) * 1.35);
      --noticeHeight : 7.5rem;
    }
    .notice .tabBox ul li { max-width: 100%; }

    /* 프로그램 안내 */
    .program {
        --proHeight: calc(var(--mainfont) * 15);
        gap: calc(var(--mainfont) * 1.5);
    }
    .program .box .swiper-slide .videoWrap .vdo_crt .play img { max-width: calc(var(--mainfont) * 1.5); }
    .program .box .swiper-slide .txt > ul > li > span { font-size: calc(var(--mainfont) * 0.95); }
    .program .box .swiper-slide .txt > ul > li { font-size: var(--mainfont); }
    .program .box .no_data { border-radius: calc(var(--radius) * 2); }
    .program .titWrap > .tabBox ul li a { padding: 0 calc(var(--mainfont) * 1.25); height: calc(var(--mainfont) * 3); }

    /* 탐구 교실 안내 */
    .explore .lft > .goLnk { width: calc(100% - calc(var(--mainfont) * 2)); }

    /* 주요 서비스 */
    .service { padding: calc(var(--mainfont) * 2) calc(var(--mainfont) * 1.5); }
    .service .lst ul li a .img img { max-width: calc(var(--mainfont) * 6); }
    .service .lst ul { gap: calc(var(--mainfont) * 1) 0; }
}

@media screen and (max-width: 320px) {
    /* 주요 서비스 */
    .service .lst ul { gap: 0; } 
    .service .lst ul li { width: 100%; } 
    .service .lst ul li a { padding: calc(var(--mainfont) * 0.8) 0; }
    .service .lst ul li a::before { width: 100%; height: 1px; border-left: none; border-top: 1px dashed rgba(255,255,255,0.3); display: block !important; top: 0; }
    .service .lst ul li:first-child a::before { display: none !important; }
    
}