@charset "utf-8";

.skip_snb_menu {display:none;}

/* 비주얼 */
/* 최대 1920px까지 채우고 그 이상은 고정 + 중앙정렬. FHD 노트북/모니터까진 꽉 차고, 초대형 화면에서만 좌우 여백 */
/* height 고정(680px) 대신 aspect-ratio로 비율 고정 → 화면이 좁아져도 Hero 전체가 같은 비율로 균일 축소.
   덕분에 좌측 팝업(40%)·우측 동영상(60%) 박스 비율이 모든 화면에서 일정 → 비율 맞춘 소재는 잘림·여백 0%로 동일 노출.
   팝업 1.13:1(예 1536x1360) / 동영상 1.69:1(예 2304x1360). 폭 1920px 이상은 max-width로 1920x680 상한. */
.fs_main_visual {width:100%;max-width:1920px;margin:0 auto;aspect-ratio:1920 / 680;overflow:hidden;position:relative;}
.fs_main_visual .hero_grid {display:flex;width:100%;height:100%;}

/* 좌측 40% 팝업 슬라이더 */
/* 배경: 이미지 여백/로딩 시 노출되는 색 — 하단 공지사항 영역(.sec2)과 동일한 연한 회색 #f7f7f7 */
.fs_main_visual .hero_popup {width:40%;height:100%;position:relative;background:#f7f7f7;overflow:hidden;}
.fs_main_visual .hero_popup .hero_swiper {width:100%;height:100%;}
.fs_main_visual .hero_popup .swiper-wrapper {height:100%;}
.fs_main_visual .hero_popup .swiper-slide {display:block;width:100%;height:100%;position:relative;overflow:hidden;}/* overflow:hidden — 슬라이드 밖으로 넘치는 이미지가 옆 슬라이드로 겹쳐 보이는 현상 방지(특히 모바일) */
.fs_main_visual .hero_popup .swiper-slide > a,
.fs_main_visual .hero_popup .swiper-slide > p,
.fs_main_visual .hero_popup .swiper-slide > div {display:block;width:100%;height:100%;}
.fs_main_visual .hero_popup .swiper-slide a {display:block;width:100%;height:100%;text-decoration:none;}
/* 팝업 이미지는 항상 object-fit:fill — 박스에 맞춰 늘려 꽉 채움. 잘림(cover)·여백(contain) 없음. 비율이 다르면 눌리지만 내용은 전부 노출. */
.fs_main_visual .hero_popup .swiper-slide img {width:100%;height:100%;object-fit:fill;max-width:none;max-height:none;display:block;}
/* 자동사이즈(atmcSizeAt='Y')·수동(N) 모두 fill로 통일: 어떤 비율이든 잘리지 않고 박스에 꽉 채움(필요시 눌림). 인라인 width/height 무시 */
.fs_main_visual .hero_popup .swiper-slide.auto_fit img {position:absolute;top:0;left:0;width:100% !important;height:100% !important;max-width:none !important;max-height:none !important;object-fit:fill !important;display:block;}
.fs_main_visual .hero_popup .swiper-slide.auto_fit a,
.fs_main_visual .hero_popup .swiper-slide.auto_fit p {display:block;width:100%;height:100%;margin:0;padding:0;}
.fs_main_visual .hero_popup .swiper-slide.manual_fit {display:flex;align-items:center;justify-content:center;}
.fs_main_visual .hero_popup .swiper-slide.manual_fit a,
.fs_main_visual .hero_popup .swiper-slide.manual_fit p {display:flex;align-items:center;justify-content:center;width:100%;height:100%;margin:0;padding:0;}
.fs_main_visual .hero_popup .swiper-slide.manual_fit img {position:absolute;top:0;left:0;width:100% !important;height:100% !important;max-width:none !important;max-height:none !important;object-fit:fill !important;display:block;}
.fs_main_visual .hero_popup .hero_empty .hero_empty_inner {display:flex;align-items:center;justify-content:center;width:100%;height:100%;}

/* 데모 슬라이드 (popupTy='H' 데이터 없을 때 임시 노출) */
.fs_main_visual .hero_popup .hero_demo {display:flex;align-items:center;justify-content:flex-start;color:#fff;padding:0 8%;}
.fs_main_visual .hero_popup .hero_demo1 {background:linear-gradient(135deg,#1d4ed8 0%,#0a2e6e 100%);}
.fs_main_visual .hero_popup .hero_demo2 {background:linear-gradient(135deg,#0f766e 0%,#064e3b 100%);}
.fs_main_visual .hero_popup .hero_demo3 {background:linear-gradient(135deg,#c2410c 0%,#7c2d12 100%);}
.fs_main_visual .hero_popup .hero_demo_inner {max-width:90%;}
.fs_main_visual .hero_popup .hero_demo_inner .hero_tag {display:inline-block;padding:4px 14px;background:rgba(255,255,255,0.2);border:1px solid rgba(255,255,255,0.4);border-radius:20px;font-size:13px;letter-spacing:0.5px;margin-bottom:18px;}
.fs_main_visual .hero_popup .hero_demo_inner h3 {font-size:38px;font-weight:bold;line-height:1.25;margin-bottom:18px;color:#fff;}
.fs_main_visual .hero_popup .hero_demo_inner .lead {font-size:17px;line-height:1.55;margin-bottom:28px;opacity:0.92;}
.fs_main_visual .hero_popup .hero_demo_inner .hero_btn {display:inline-block;padding:12px 26px;background:rgba(255,255,255,0.18);border:1px solid rgba(255,255,255,0.55);color:#fff;text-decoration:none;border-radius:6px;font-size:14px;font-weight:500;transition:background 0.2s;}
.fs_main_visual .hero_popup .hero_demo_inner .hero_btn:hover {background:rgba(255,255,255,0.32);}

/* ===== Hero 슬라이드 : 2026 지방공무원 신규임용시험 공고 (피치톤 공고 카드) ===== */
.fs_main_visual .hero_popup .hero_exam {display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;padding:clamp(26px,5%,54px) clamp(24px,5%,52px);text-align:center;overflow:hidden;background:radial-gradient(120% 80% at 82% 4%,#fde6d8 0%,rgba(253,230,216,0) 55%),radial-gradient(130% 90% at 0% 100%,#f6c2a6 0%,rgba(246,194,166,0) 52%),linear-gradient(160deg,#f9d7c3 0%,#f3c0a6 100%);}
.fs_main_visual .hero_popup .hero_exam::before {content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,0.55) 1.5px,transparent 1.6px);background-size:26px 26px;opacity:.32;pointer-events:none;}
.fs_main_visual .hero_popup .hero_exam .exam_badge {position:relative;z-index:3;display:inline-flex;align-items:center;gap:8px;background:#fff;color:#c2410c;border:1px solid #f1aa86;padding:7px 18px;border-radius:999px;font-size:clamp(13px,1.1vw,15px);font-weight:700;letter-spacing:.02em;box-shadow:0 6px 16px rgba(194,65,12,.14);margin-bottom:clamp(12px,2.6vh,24px);}
.fs_main_visual .hero_popup .hero_exam .exam_badge .dot {width:7px;height:7px;border-radius:50%;background:#ff7a18;box-shadow:0 0 0 4px rgba(255,122,24,.18);}
.fs_main_visual .hero_popup .hero_exam .exam_card {position:relative;z-index:3;width:100%;height:auto;max-width:560px;background:#fff;border-radius:24px;padding:clamp(24px,3.6vh,38px) clamp(22px,5%,38px);box-shadow:0 24px 50px rgba(168,84,30,.20),0 4px 12px rgba(168,84,30,.10);}
.fs_main_visual .hero_popup .hero_exam .exam_title {font-family:'GangwonEduPower',sans-serif;font-weight:normal;color:#1f2d4d;line-height:1.42;font-size:clamp(19px,1.85vw,26px);letter-spacing:-.01em;word-break:keep-all;}
.fs_main_visual .hero_popup .hero_exam .exam_title b {color:#c2410c;font-weight:normal;}
.fs_main_visual .hero_popup .hero_exam .exam_divider {width:54px;height:4px;border-radius:4px;background:linear-gradient(90deg,#ff9500,#df6a1e);margin:clamp(14px,2.6vh,22px) auto;}
.fs_main_visual .hero_popup .hero_exam .exam_qa {font-size:clamp(13px,1.05vw,16px);color:#475067;line-height:1.7;}
.fs_main_visual .hero_popup .hero_exam .exam_qa .qa_lab {display:inline-block;font-weight:700;color:#1f2d4d;font-size:clamp(14px,1.15vw,17px);margin-bottom:5px;}
.fs_main_visual .hero_popup .hero_exam .exam_qa .qa_dept {font-weight:600;color:#2a3144;}
.fs_main_visual .hero_popup .hero_exam .exam_qa .qa_tel {font-weight:700;color:#c2410c;white-space:nowrap;}
.fs_main_visual .hero_popup .hero_exam .exam_cta {position:relative;z-index:3;width:auto;height:auto;display:inline-flex;align-items:center;gap:12px;margin-top:clamp(18px,3.2vh,30px);padding:14px 34px;border-radius:999px;background:linear-gradient(135deg,#ff8a1e,#e85d0c);color:#fff;text-decoration:none;font-size:clamp(15px,1.2vw,18px);font-weight:700;letter-spacing:-.01em;box-shadow:0 14px 30px rgba(232,93,12,.34);transition:transform .2s ease,box-shadow .2s ease;}
.fs_main_visual .hero_popup .hero_exam .exam_cta:hover {transform:translateY(-2px);box-shadow:0 18px 38px rgba(232,93,12,.46);}
.fs_main_visual .hero_popup .hero_exam .exam_cta .cta_arrow {display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.25);font-size:14px;line-height:1;}
.fs_main_visual .hero_popup .hero_exam .exam_illust {position:absolute;right:-14px;bottom:-10px;width:clamp(132px,21%,196px);height:auto;z-index:1;pointer-events:none;animation:heroExamFloat 4.5s ease-in-out infinite;}
@keyframes heroExamFloat {0%,100%{transform:translateY(0);}50%{transform:translateY(-7px);}}

/* 우측 하단 컨트롤 박스 (페이지 fraction + 이전 + 일시정지 + 다음) */
.fs_main_visual .hero_popup .hero_controls {position:absolute;right:1.5em;bottom:1.2em;z-index:20;display:flex;align-items:center;gap:6px;background:#fff;padding:6px 14px;border-radius:24px;color:#222;box-shadow:0 2px 8px rgba(0,0,0,0.18);}
.fs_main_visual .hero_popup .hero_controls > * {position:static !important;transform:none !important;margin:0 !important;}
.fs_main_visual .hero_popup .hero_controls .hero_pagination {width:auto;font-size:13px;font-weight:500;letter-spacing:0.5px;padding:0 8px;color:#222;}
.fs_main_visual .hero_popup .hero_controls .hero_pagination .swiper-pagination-current {color:#0a2e6e;font-weight:700;font-size:14px;}
.fs_main_visual .hero_popup .hero_controls .hero_pagination .swiper-pagination-total {color:#222;opacity:0.7;}
.fs_main_visual .hero_popup .hero_controls .hero_pagination .hero_frac_sep {color:#999;margin:0 3px;}
.fs_main_visual .hero_popup .hero_controls .hero_prev,
.fs_main_visual .hero_popup .hero_controls .hero_next,
.fs_main_visual .hero_popup .hero_controls .hero_play_pause {width:24px;height:24px;background:transparent;border:none;cursor:pointer;color:#222;padding:0;display:flex;align-items:center;justify-content:center;line-height:1;border-radius:0;}
.fs_main_visual .hero_popup .hero_controls .hero_prev::after,
.fs_main_visual .hero_popup .hero_controls .hero_next::after {content:none !important;}
.fs_main_visual .hero_popup .hero_controls .hero_prev::before {content:'‹';font-size:20px;font-weight:600;color:#222;}
.fs_main_visual .hero_popup .hero_controls .hero_next::before {content:'›';font-size:20px;font-weight:600;color:#222;}
.fs_main_visual .hero_popup .hero_controls .hero_play_pause.play::before {content:'❚❚';font-size:12px;letter-spacing:-1px;color:#222;}
.fs_main_visual .hero_popup .hero_controls .hero_play_pause.stop::before {content:'▶';font-size:11px;color:#222;}
.fs_main_visual .hero_popup .hero_controls .hero_prev:hover,
.fs_main_visual .hero_popup .hero_controls .hero_next:hover,
.fs_main_visual .hero_popup .hero_controls .hero_play_pause:hover {opacity:0.55;}

/* 우측 40% 동영상 */
.fs_main_visual .video {width:60%;height:100%;border-bottom-right-radius:6.250em;overflow:hidden;display:flex;align-items:center;position:relative;}
.fs_main_visual .video video {width:100%;height:100%;object-fit:cover;margin-top:0;}
.fs_main_visual .video .vis_text {position:absolute;bottom:1.250em;right:1.875em;left:auto;}
.fs_main_visual .video_ctrl {display:none;position:absolute;bottom:2.438em;right:2.438em;left:auto;width:64px;height:64px;border-radius:100%;background:rgba(255,149,0,0.2);}
.fs_main_visual .video_ctrl.on {display:block;}

/* 컨트롤 */
.fs_main_visual .mvis_controll_box {}

/* 컨텐츠 시작 */
.fs_main_contents {}
.con_box {}

/* 타이틀 공통 */
.con_tit {font-size:30px;color:#000;line-height:34px;font-family:'GangwonEduPower';font-weight:normal;}
.con_tit span {color:#a64e09;font-family:'GangwonEduPower';}

/* 자주찾는 서비스 */
.con1 {width:100%;padding:60px 0;position:relative;}
.con1 .con_tit_box .con_tit {margin-bottom:25px;}
.con1 .con_tit_box .con_tit br.mo {display:none;}
.con1 .con_txt_box .con_txt {justify-content:space-between;}
.con1 .con_txt_box .con_txt .swiper-slide {display:flex;justify-content:center;align-items:stretch;width:auto;}
.con1 .con_txt_box .con_txt a {display:flex;align-items:center;justify-content: space-between;flex-direction:column;padding-top:10px;text-align: center;}
.con1 .con_txt_box .con_txt a span {display:block;line-height:1.2;}
.con1 .con_txt_box .con_txt a span:last-child {margin-top:10px;min-height:2.000em;display:flex;justify-content:center;align-items:center;word-break:keep-all;}
.con1 .con_txt_box .con_txt a img {transition: 0.4s;}
.con1 .con_txt_box .con_txt a:is(:hover,:active,focus) img {margin-top:-10px;}
.con1 .pop_controll_box {display:none;}

/* 게시판, 열린교육감 바로가기 */
.sec2 {background:#f7f7f7;padding:90px 0;}
.sec2 .wrap_1300 {display:grid;grid-template-columns:2fr 1fr;gap:5%;}
/* 게시판 */
.tab_box {position:relative;}
.tab_box .tab_btn {position:relative;display:flex;flex-wrap:wrap;width:100%;}
.tab_box .tab_btn li {position:relative;padding:0 1vw;}
.tab_box .tab_btn li:first-child {padding-left:0;}
.tab_box .tab_btn li::after {content:"";position:absolute;top:9px;left:0;width:1px;height:20px;background:#cfd0d7;}
.tab_box .tab_btn li:first-child::after {display:none;}
.tab_box .tab_btn li a {position:relative;z-index:1;display:inline-block;width:100%;height:40px;line-height:40px;color:#444;font-weight:normal;font-size:25px;font-family:'GangwonEduPower';}
.tab_box .tab_btn li.on a {color:#a64e09;font-size:30px;}

.tab_box .tab_cbox .tab_content ul {margin-top:25px;height:365px;padding:20px 25px;display:grid;grid-template-rows:repeat(5,1fr);background:#fff;border-radius:20px;border:1px solid #cfd0d7;}
.tab_box .tab_cbox .tab_content li {width:100%;display:flex;justify-content:space-between;align-items:center;border-bottom:1px dashed #cfd0d7;}
.tab_box .tab_cbox .tab_content li:last-child {border-bottom:none;padding:0;}
.tab_box .tab_cbox .tab_content li > a {width:85%;font-size:18px;font-weight:500;line-height:1.6;}
.tab_box .tab_cbox .tab_content li > .data {font-size:13px;color:#777;}
.tab_box .more {position:absolute;right:0;top:-8px;background:#444;font-size:0;width:50px;height:50px;border-radius:100%;}
.tab_box .more:is(:hover,:focus,:active) {transform:rotate(360deg);background:#df8200;}
.tab_box .more span:after {content:"";position:absolute;top:16px;left:23px;width:3px;height:17px;background:#fff;}
.tab_box .more span:before {content:"";position:absolute;top:16px;left:23px;width:3px;height:17px;background:#fff;transform:rotate(90deg);}


/* 열린교육감 바로가기 */
.con3 .greetings_box {position:relative;height:430px;border-radius:30px;box-shadow:20px 0 50px 0 rgba(0,0,0,0.1);padding:50px 30px;background:url("../images/main/superintendent.png") no-repeat bottom right,linear-gradient(70deg, #fff, #ffdba9);}
.con3 .greetings_box:before {content:"";position:absolute;top:125px;right:30px;width:78px;height:70px;background:url("../images/main/marks.png") no-repeat center center;}
.con3 .greetings_box .con_tit {background:url("../images/main/greetings_title.png") no-repeat center center;display:inline-block;width:190px;height:90px;position:absolute;top:-35px;right:0;filter:drop-shadow(30px 0 20px rgba(0,0,0,0.08));text-align:center;padding-top:13px;font-size:25px;}
.con3 .greetings_box .greetings span {color:#a64e09;font-size:14px;font-weight:600;}
.con3 .greetings_box .greetings h4 {color:#222;line-height:35px;font-size:28px;font-family:'GangwonEduPower';margin-top:10px;}
.con3 .greetings_box .greetings h4 em {color:#a64e09;font-size:40px;}
.con3 .greetings_box .greetings p {font-size:14px;line-height:20px;color:#666;font-weight:500;margin-top:10px;}
.con3 .greetings_box .link {margin-top:40px;display:flex;max-width:50%;flex-wrap:wrap;}
.con3 .greetings_box .link li {margin-bottom:5px;}
.con3 .greetings_box .link li:last-child {margin-bottom:0;}
.con3 .greetings_box .link li a {background:#fff;height:35px;line-height:33px;display:flex;flex-wrap:wrap;align-items:center;border:1px solid #cfd0d7;border-radius:30px;padding:0 15px;color:#000;}
.con3 .greetings_box .link li a:hover,
.con3 .greetings_box .link li a:focus,
.con3 .greetings_box .link li a:active {border:1px solid #df8200;color:#df8200;}
.con3 .greetings_box .link li a span {font-weight:500;font-size:14px;margin-left:5px;}

/* 소통하는 강원교육, 알림판 */
.sec3 {padding:110px 0 90px 0;}
.sec3 .wrap_1300 {display:flex;flex-wrap:wrap;justify-content:space-between;width:100%;}
/* 소통하는 강원교육 */
.con4 {width:47%;}
.con4 .con_tit {position:relative;height:95px;line-height:95px;}
.con4 .con_tit:before
{content:"";position:absolute;top:0;left:-10.21vw;width:480px;height:95px;background:linear-gradient(-90deg,rgba(255,235,181,1) 0%,rgba(255,219,206,1) 50%);z-index:-1;border-radius:0 80px 50px 0;}
.con4 .sns_title {display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;}
.con4 .sns {display:flex;flex-wrap:wrap;}
.con4 .sns li {margin-left:5px;}
.con4 .con_txt {display:flex;flex-wrap:wrap;justify-content:space-between;margin-top:40px;}
.con4 .con_txt li {width:48%;text-align:center;}
.con4 .con_txt li a img {width:100%;border-radius:30px;}
.con4 .con_txt li a span {font-size:18px;color:#333;text-align:left;line-height:24px;margin-top:20px;font-weight:500;}
/* 알림판 */
.con5 {width:47%;position:relative;margin-top:25px;}
.con5 .con_tit {display:inline-block;position:relative;}
.con5 .con_tit:before {content:"";position:absolute;top:-50px;right:-75px;width:79px;height:79px;background:url("../images/main/con5_deco.png") no-repeat center center;}
.con5 .slide_box1 {margin-top:30px;}
.con5 .slide_box1 .slides01 .swiper-slide {border-radius:30px;overflow:hidden;border:1px solid #cfd0d7;aspect-ratio:2 / 1;}
.con5 .slide_box1 .slides01 .swiper-slide .imgdiv {display:flex;justify-content:center;align-items:center;position:relative;height:100%;}
.con5 .slide_box1 .slides01 .swiper-slide .imgdiv:after {content:"";position: absolute;bottom:0;width:100%;height:50%;display:block;}
.con5 .slide_box1 .slides01 .swiper-slide .imgdiv img {width:100%;height:100%;object-fit:fill;}
.con5 .slide_box1 .slides01 .swiper-slide .imgdiv span {position: absolute;right:20px;bottom:25px;z-index:1;font-size:2rem;font-weight:500;color:#fff;}
.con5 .pop_controll_box {position:absolute;top:8px;right:0;display:flex;align-items:center;width:100%;flex-wrap:wrap;justify-content:flex-end;}
.con5 .pop_controll_box .swiper-pagination-fraction {display:inline-block;width:auto;}
.con5 .pop_controll_box .pop_pager {margin-right:30px;font-size:14px;color:#666666;}
.con5 .pop_controll_box .pop_pager span {padding:0 5px;}
.con5 .pop_controll_box .pop_pager .swiper-pagination-current {font-weight:600;}
.con5 .pop_controll_box a {display:flex;justify-content:center;align-items:center;width:13px;height:15px;margin-left:8px;}
.con5 .pop_controll_box a.playStopButton1 {background-repeat: no-repeat;background-position: center center;font-size:0;margin:0 15px;}
.con5 .pop_controll_box a.playStopButton1.play {background-image:url("../images/main/con5_stop_btn.png");}
.con5 .pop_controll_box a.playStopButton1.stop {background-image:url("../images/main/con5_play_btn.png");}

/* 학부모 꿀정보 */
.sec4 {text-align:center;margin-bottom:100px;}
.sec4 .con6 {position:relative;padding:80px 0 70px 0;position:relative;}
.sec4 .con6:before {content:"";position:absolute;top:0;right:-10vw;width:calc(100vw - 15vw);height:150px;background:linear-gradient(rgba(255,235,181,1) 0%,rgba(255,219,206,1) 50%, #fff 100%);z-index:-1;border-radius:80px 0 0 0;opacity:0.2;}
.sec4 .con6 .con_tit {text-align:center;font-size:33px;position:relative;display:inline-block;}
.sec4 .con6 .con_tit:after {content:"";position:absolute;top:-95px;left:-40px;width:46px;height:90px;background:url("../images/main/con6_deco01.png") no-repeat center center;}
.sec4 .con6 .con_tit:before {content:"";position:absolute;top:-35px;right:-42px;width:59px;height:49px;background:url("../images/main/con6_deco03.png") no-repeat center center;}
.sec4 .con6 .con_tit span em {font-size:35px;position:relative;}
.sec4 .con6 .con_tit span em:before {content:"";position:absolute;top:-10px;left:4px;width:22px;height:11px;background:url("../images/main/con6_deco02.png") no-repeat center center;}
.sec4 .slide_box2 {margin-top:40px;}
.sec4 .slide_box2 .slides02 .swiper-slide {}
.sec4 .slide_box2 .slides02 .swiper-slide a {border-radius:30px;overflow:hidden;display:block;aspect-ratio:1 / 1;}
.sec4 .slide_box2 .slides02 .swiper-slide a img {width:100%;}
.sec4 .slide_box2 .slides02 .swiper-slide a span {position: absolute;right:20px;bottom:25px;z-index:1;font-size:2rem;font-weight:500;color:#fff;}
.sec4 .pop_controll_box {position:absolute;top:calc(50% + 25px);display:flex;align-items:center;width:calc(100% + 50px);flex-wrap:wrap;justify-content:space-between;margin-left:-25px;}
.sec4 .pop_controll_box button {width:50px;height:50px;background:#fff;z-index:1;border-radius:100%;box-shadow:30px 0 20px 0 rgba(0,0,0,0.08);}
.sec4 .pop_controll_box button.prev2 {left:0;}
.sec4 .pop_controll_box button.next2 {right:0;}
.sec4 .pop_controll_box button img {opacity:0.5;}
.sec4 .pop_controll_box button:hover img {opacity:1;}
.swiper-scrollbar {height:3px;background:#cfd0d7;}
.swiper-scrollbar-drag {height:18px;background:#ff9500;margin-top:-8px;}

@media only screen and (min-width:1920px){
    .tab_box .tab_btn li {padding:0 0.5vw;}
}
@media only screen and (max-width:1599px){
    /* height 고정(32.5rem) 제거: width+height 동시 고정 시 aspect-ratio가 무시되어 박스 비율이 깨지고 팝업이 잘렸음.
       제거하면 base의 aspect-ratio(1920/680)가 이 구간에도 그대로 적용되어 화면 축소 시 비율 유지(잘림 없음). */
    .fs_main_visual .video video {margin-top:0;}
    .fs_main_contents .wrap_1300 {padding:0 20px;}
}

@media only screen and (max-width:1499px){

    .wrap {padding:0 5%;}

    /* 자주찾는 서비스 */
    .con1 .con_txt li a span {font-size:14px;}

    /* 게시판 */
    .fs_main_contents .wrap_1300 {grid-template-columns:1fr;grid-template-rows:auto 1fr;}

    /* 열린교육감 */
    .con3 {width:100%;padding:0;margin-top:80px;}
    .con3 .greetings_box {height:250px;}
    .con3 .greetings_box:before {background-size:50px;top:30px;right:0;}
    .con3 .greetings_box .con_txt {display:flex;flex-wrap:wrap;width:100%;}
    .con3 .greetings_box .greetings {display:inline-block;}
    .con3 .greetings_box .link {max-width:22%;margin-top:0;margin-left:60px;}

    /* 소통하는 강원교육 */
    .con4 .con_tit:before {width:400px;}
    .con4 .sns li a img {width:35px;}

    /* 학부모 꿀정보 */
    .sec4 .con6:before {right:-5vw;width:calc(100vw - 10vw);}
}
@media only screen and (max-width:1329px){
    .fs_main_visual {height:auto;}
}
/* 데스크탑-좁은 폭(1024~1400): aspect-ratio로 Hero 높이가 낮아질 때 좌측 공고 카드(hero_exam)가 넘치지 않게 압축 */
@media only screen and (min-width:1024px) and (max-width:1400px){
    .fs_main_visual .hero_popup .hero_exam {padding:clamp(16px,3.2%,40px) clamp(16px,4%,40px);}
    .fs_main_visual .hero_popup .hero_exam .exam_badge {margin-bottom:clamp(8px,1.6vh,16px);}
    .fs_main_visual .hero_popup .hero_exam .exam_card {padding:clamp(16px,2.4vh,28px) clamp(16px,4%,30px);border-radius:18px;}
    .fs_main_visual .hero_popup .hero_exam .exam_title {font-size:clamp(16px,1.7vw,22px);}
    .fs_main_visual .hero_popup .hero_exam .exam_divider {margin:clamp(10px,1.8vh,18px) auto;}
    .fs_main_visual .hero_popup .hero_exam .exam_cta {margin-top:clamp(12px,2vh,22px);padding:11px 26px;}
}
@media only screen and (max-width:1023px){
    /* 비주얼 - 모바일에서 세로 스택: 팝업 위, 동영상 아래 (aspect-ratio 해제) */
    .fs_main_visual {aspect-ratio:auto;height:auto;}
    .fs_main_visual .hero_grid {flex-direction:column;}
    .fs_main_visual .hero_popup,
    .fs_main_visual .video {width:100%;}
    /* 팝업 슬라이드 이미지가 position:absolute;height:100%(fill)라, 부모에 확정 높이가 없으면 슬라이드가 붕괴해 겹침.
       aspect-ratio(768/680=팝업 비율)로 폭 기반 확정 높이 부여 → 슬라이드·이미지 정상. 큰 화면은 max-height로 상한. */
    .fs_main_visual .hero_popup {height:auto;aspect-ratio:768/680;max-height:520px;}
    .fs_main_visual .hero_popup .hero_exam {min-height:360px;padding:34px 22px;}
    .fs_main_visual .hero_popup .hero_exam .exam_illust {width:120px;right:-8px;bottom:-6px;}
    .fs_main_visual .video {height:auto;min-height:240px;border-bottom-right-radius:0;}
    .fs_main_visual .video_ctrl {right:5%;left:auto;bottom:15px;width:50px;height:50px;}
    .fs_main_visual .video_ctrl img {width:35px;}
    .fs_main_visual .video .vis_text img {width:200px;}
    .fs_main_visual .video .vis_text {right:5%;left:auto;bottom:15px;}

    /* 자주찾는 서비스 */
    .con1 .pop_controll_box {display:inline-flex;align-items:flex-start;flex-wrap:wrap;justify-content:flex-start;position:absolute;top:60px;right:0;}
    .con1 .pop_controll_box a {display:flex;justify-content:center;align-items:center;width:13px;height:15px;margin-left:8px;}
    .con1 .pop_controll_box a.playStopButton0 {background-repeat: no-repeat;background-position: center center;font-size:0;margin:0 15px;}
    .con1 .pop_controll_box a.playStopButton0.play {background-image:url("../images/main/con5_stop_btn.png");}
    .con1 .pop_controll_box a.playStopButton0.stop {background-image:url("../images/main/con5_play_btn.png");}

    /* 게시판 */
    .sec2 {padding:60px 0;}
    .tab_box .tab_btn li {padding:0 1.5vw;}
    .tab_box .tab_btn li::after {top:14px;}
    .tab_box .tab_btn li a {font-size:20px;}
    .tab_box .tab_btn li.on a {font-size:25px;}
    .tab_box .tab_cbox .tab_content ul {margin-top:15px;height:auto;}
    .tab_box .tab_cbox .tab_content li {height:auto;padding-bottom:5px;margin-top:5px;}
    .tab_box .tab_cbox .tab_content li a {font-size:14px;}
    .tab_box .tab_cbox .tab_content li .data {font-size:13px;}

    /* 열린교육감 */
    .con3 {margin-top:40px;}
    .con3 .greetings_box .link {max-width:28%;margin-left:30px;}

    /* 소통하는 강원교육 */
    .sec3 {padding:60px 0;}
    .con4 {width:100%;}
    .con4 .con_txt {margin-top:20px;}
    .con5 {width:100%;margin-top:80px;}
    .con5 .slide_box1 {margin-top:20px;}
}
@media only screen and (max-width:767px){
    .con_tit {font-size:25px;}

    /* 비주얼 */
    .fs_main_visual .video .vis_text img {width:100px;}

    /* 자주찾는 서비스 */
    .con1 {padding:40px 0;}
    .con1 > div .con_tit {font-size:25px;}
    .con1 > div .con_tit span {padding-right:5px;}
    .con1 .con_tit_box .con_tit span {padding-right:0;}
    .con1 .pop_controll_box {top:47px;}

    /* 게시판 */
    .sec2 {padding:60px 0;}
    .tab_box > ul {display:inline-flex;width:100%;padding-right:40px;}
    .tab_box .tab_btn li {padding:0 10px;}
    .tab_box .tab_btn li::after {display:block;}
    .tab_box .tab_btn li a {font-size:17px;}
    .tab_box .tab_btn li.on a {font-size:20px;}
    .tab_box .tab_cbox .tab_content ul {padding:10px 15px;}
    .tab_box .tab_cbox .tab_content ul li a {padding-right:20px;}
    .tab_box .more {width:35px;height:35px;top:0;right:-10px;}
    .tab_box .more span:before {top:10px;left:16px;}
    .tab_box .more span:after {top:10px;left:16px;}

    /* 열린교육감 */
    .con3 .greetings_box {height:420px;}
    .con3 .greetings_box .greetings {width:100%;}
    .con3 .greetings_box .greetings h4 {font-size:20px;line-height:25px;}
    .con3 .greetings_box .greetings h4 em {font-size:30px;}
    .con3 .greetings_box .greetings p {font-size:13px;}
    .con3 .greetings_box .con_tit {font-size:20px;}
    .con3 .greetings_box .link {margin-left:0;max-width:180px;margin-top:20px;width:160px;}
    .con3 .greetings_box .link li {width:100%;}
    .con3 .greetings_box .link li a span {font-size:13px;}

    /* 소통하는 강원교육 */
    .con4 .con_tit {height:70px;line-height:70px;}
    .con4 .con_tit:before {height:70px;width:300px;}
    .con4 .sns {width:100%;margin-top:10px;}
    .con4 .sns li a img {width:30px;}
    .con4 .con_txt {margin-top:10px;}
    .con4 .con_txt li a span {font-size:14px;line-height:normal;margin-top:10px;}

    /* 알림판 */
    .con5 .con_tit:before {background-size:50px;right:-60px;top:-45px;}
    .con5 .slide_box1 {margin-top:10px;}

    /* 학부모 꿀정보 */
    .sec4 {margin-bottom:60px;}
    .sec4 .con6 {padding:60px 0;}
    .sec4 .con6 .con_tit {font-size:25px;}
    .sec4 .con6 .con_tit:after {left:-30px;top:-85px;}
    .sec4 .con6 .con_tit:before {top:-30px;}
}
@media only screen and (max-width:575px){
    .tab_box .tab_btn li {width:50%;text-align:center;font-size:18px;}
    .tab_box .tab_btn li::after {left:0;height:10px;}
    .tab_box .tab_btn li:nth-child(odd) {padding-left:0;}
    .tab_box .tab_btn li:nth-child(odd)::after {display:none;}
    .tab_box .tab_btn li.on a {font-size:20px;}
    .tab_box .more {top:0;}
    .sec2 {padding:30px 0;}
}
@media only screen and (max-width:400px){
    .con3 .greetings_box {background:url("../images/main/superintendent.png") no-repeat bottom right -60px,linear-gradient(70deg, #fff, #ffdba9);}
}


/******************************/
/* 영문 */
/******************************/
:lang(en) .con_tit {font-size:25px;line-height:27px;}
:lang(en) .tab_box > ul {margin-bottom:30px;}
:lang(en) .tab_box > ul > li > h4 {height:30px;line-height:30px;}
:lang(en) .tab_box > ul > li > h4 a {font-size:20px;height:30px;line-height:30px;}
:lang(en) .tab_box > ul > li > h4:after {top:8px;height:15px;}
:lang(en) .tab_box > ul > li > h4 a.on {font-size:25px;}
:lang(en) .con1 .con_txt_box .con_txt a {justify-content:flex-start;gap:10px;font-size:0.875em;height:125px;}
:lang(en) .con3 .greetings_box {padding:50px 25px;background:url("../images/main/superintendent.png") no-repeat bottom right -60px,linear-gradient(70deg, #fff, #ffdba9);}
:lang(en) .con3 .greetings_box .con_tit {background-image:url("../images/main/greetings_title_en.png");width:260px;padding-top:10px;font-size:20px;line-height:22px;}
:lang(en) .con3 .greetings_box .greetings h4 {line-height:26px;font-size:18px;}
:lang(en) .con3 .greetings_box .greetings h4 br {display:none;}
:lang(en) .con3 .greetings_box .greetings h4 em {font-size:24px;}
:lang(en) .con3 .greetings_box .greetings p {margin-top:5px;}
:lang(en) .con3 .greetings_box .greetings p br {display:none;}
:lang(en) .con3 .greetings_box .link {margin-top:15px;max-width:80%;}
:lang(en) .con4 .con_tit {max-width:46.5%;line-height:35px;padding-top:13px;}
@media only screen and (max-width:1499px){
    :lang(en) .con3 .greetings_box .link {margin:15px 0 0;gap:10px;}
    :lang(en) .con3 .greetings_box .link li {margin-bottom:0;}
    :lang(en) .con4 .con_tit:before {width:425px;}
}
@media only screen and (max-width:1399px){
    :lang(en) .con_tit {font-size:24px;line-height:26px;}
    :lang(en) .con3 .greetings_box .link {max-width:90%;}
    :lang(en) .con4 .con_tit {line-height:30px;padding-top:4px;}
    :lang(en) .con4 .con_tit:before {width:370px;}
}
@media only screen and (max-width:1280px){
    :lang(en) .fs_head {padding:0;}
    :lang(en) .con4 .con_tit {line-height:35px;padding-top:15px;}
    :lang(en) .con4 .con_tit:before {width:400px;}
}
@media only screen and (max-width:1199px){
    :lang(en) .con_tit {font-size:23px;line-height:25px;}
    :lang(en) .con4 .con_tit:before {width:360px;}
}
@media only screen and (max-width:1099px){
    :lang(en) .con4 .con_tit {line-height:30px;padding-top:4px;}
    :lang(en) .con4 .con_tit:before {width:310px;}
}
@media only screen and (max-width:1023px){
    :lang(en) .con4 .con_tit {line-height:95px;padding-top:0;max-width:50%;}
    :lang(en) .con4 .con_tit:before {width:130%;}
}
@media only screen and (max-width:767px){
    :lang(en) .tab_box > ul {display:flex;width:100%;}
    :lang(en) .tab_box > ul > li > h4 {padding:0 10px;}
    :lang(en) .tab_box > ul > li > h4:after {display:block;}
    :lang(en) .tab_box > ul > li > div {padding-top:65px;padding-left:0;}
    :lang(en) .tab_box .more {top:10px;}
    :lang(en) .con1 .con_txt_box .con_txt a {justify-content:flex-end;height:110px;}
    :lang(en) .con3 {margin-top:130px;}
    :lang(en) .con3 .greetings_box .link {max-width:70%;width:auto;}
    :lang(en) .con4 .con_tit {max-width:100%;line-height:70px;}
    :lang(en) .con4 .con_tit:before {width:120%;}
}
@media only screen and (max-width:575px){
    :lang(en) .con_tit {font-size:20px;line-height:22px;}
    :lang(en) .tab_box > ul {flex-direction:column;}
    :lang(en) .tab_box > ul > li > h4 {padding-left:0;height:25px;line-height:25px;}
    :lang(en) .tab_box > ul > li > h4:after {display:none;}
    :lang(en) .tab_box > ul > li > h4 a {font-size:15px;height:25px;line-height:25px;}
    :lang(en) .tab_box > ul > li > h4 a.on {font-size:20px;}
    :lang(en) .tab_box > ul > li > div {padding-top:160px;}
    :lang(en) .tab_box .more {top:0;}
    :lang(en) .con1 > div .con_tit {font-size:20px;}
    :lang(en) .con1 .pop_controll_box {top:35px;}
    :lang(en) .sec2 {padding:30px 0;}
    :lang(en) .con3 {margin-top:225px;}
    :lang(en) .con3 .greetings_box .link {max-width:80%;}
    :lang(en) .con4 .con_tit {line-height:30px;padding-top:6px;}
    :lang(en) .con4 .con_tit:before {width:100%;}
}
@media only screen and (max-width:400px){
    :lang(en) .con3 .greetings_box {background:linear-gradient(70deg, #fff, #ffdba9);padding:50px 20px 20px;height:auto;}
    :lang(en) .con3 .greetings_box .link {max-width:100%;gap:3px;}
}