@charset "UTF8";
@import url("https://cdnjs.cloudflare.com/ajax/libs/pretendard/1.3.9/static/pretendard.css");
@import url("https://cdn.jsdelivr.net/gh/sunn-us/SUITE/fonts/variable/woff2/SUITE-Variable.css");


/****************** font  *************
 font-weight:800 / extrabold
 font-weight:700 / bold
 font-weight:600; / semibold
 font-weight:500 / medium
 font-weight:400 / regular 
 font-weight:300 / light
 font-weight:100 / thin
<<<<<<< HEAD

 SUITE font
 font-weight:800 / extrabold
 font-weight:700 / bold
 font-weight:600; / semibold
 font-weight:500 / medium
 font-weight:400 / regular 
 font-weight:300 / light

 SUITE-variable font
 font-weight:800 / extrabold
 font-weight:700 / bold
 font-weight:600; / semibold
 font-weight:500 / medium
 font-weight:400 / regular 
 font-weight:300 / light
 

********************************************** */
.main-content-wrap {
	font-family: 'Pretendard';
	font-size:20px;
	color:#201d1e;
	margin:0;
	padding:0;
	position:relative;
	min-width:100%;
}

/* ===== 메인 비주얼 ===== */
.main-visual{overflow:hidden}
.main-visual .swiper{width:calc(100% - 40px);margin:0 auto}
.main-visual .swiper-wrapper{align-items:stretch}
.main-visual .swiper-slide{width:100%;border-radius:20px;overflow:hidden;margin:0}
.main-visual .swiper-slide a,.main-visual .swiper-slide picture,.main-visual .swiper-slide img{display:block;width:100%;height:100%;object-fit:cover}
.main-visual .swiper-slide .m-img{display: none;}
.main-visual .visual-ctrl{display: flex; justify-content: end; margin:20px auto 0 auto; max-width:1400px; padding:0 20px}
.main-visual .visual-btn .swiper-button-next, .visual-btn .swiper-button-prev{position: relative; top:auto; margin:0; height:auto; right:0; z-index:1}
.main-visual .visual-btn {display:flex;align-items:center;gap:12px}
.main-visual .visual-btn .swiper-button-next,.main-visual .visual-btn .swiper-button-prev{position:static;flex-shrink:0;margin:0;width:32px;height:32px}
.main-visual .visual-btn .swiper-button-next::after,.main-visual .visual-btn .swiper-button-prev::after,.main-visual .visual-btn .swiper-navigation-icon{display:none}
.main-visual .visual-btn img{display:block;width:100%;height:100%;object-fit:contain}
.main-visual .visual-pagination{width:auto;min-width:54px;font-size:16px;text-align:center;font-variant-numeric:tabular-nums; display:none}
.main-visual .btn-pause { display: inline-block;width: 32px;height:32px; background: url(/images/home/kor/user/new_img/btn_main_stop.png) no-repeat center; background-size: 100%; }
.main-visual .btn-pause.play {background: url(/images/home/kor/user/new_img/btn_main_play.png) no-repeat center;}

.btn-pause { display: inline-block;width: 32px;height:32px; background: url(/images/home/kor/user/new_img/btn_main_stop.png) no-repeat center; background-size: 100%; }
.btn-pause.play {background: url(/images/home/kor/user/new_img/btn_main_play.png) no-repeat center;}

.theme_dark .btn-pause{ background: url(/images/home/kor/user/new_img/btn_main_stop_dark.png) no-repeat center; background-size: 100%;}
.theme_dark .btn-pause.play {background: url(/images/home/kor/user/new_img/btn_main_play.png) no-repeat center;}

.visualSwiper{border-radius:24px}
.visualSwiper .swiper-slide{height:480px}
@media (min-width:1320px){
  .main-visual .swiper{width:calc(100% - 160px);max-width:1400px;overflow:visible}
  .main-visual .visualSwiper .swiper-wrapper{height:480px;align-items:center}
  .main-visual .visualSwiper .swiper-slide{height:420px;transition:height 700ms ease}
  .main-visual .visualSwiper .swiper-slide-active{height:480px}
}

/* 배경 이미지 : 높이는 시안 비율(1430:480)로 고정 */
.visual-link{position:relative;display:block;width:100%;aspect-ratio:1400/480;
	background: var(--pc) no-repeat center / cover;
	color:#222;text-decoration:none}

/* ---- 텍스트 (PC) ---- */
.visual-txt-area{position:absolute;left:7.3%;top:50%;transform:translateY(-50%);letter-spacing:-.03em}
.visual-tit{display:block;font-size:54px;line-height:1.4;color:#222;word-break:keep-all;font-family: 'SUITE Variable';    font-weight: 700;}
.visual-txt{margin-top:30px;font-size:22px;line-height:1.8;color:#444}
.visual-link:focus-visible{outline:3px solid #0a84e0;outline-offset:-3px}

/*어떤 도움이 필요하신가요?*/
.main-content-1 {padding-top:70px; max-width:1420px; margin:0 auto; padding-left:20px}
.main-content-1 .help-tit{font-size: 36px;font-family: 'SUITE Variable';font-weight: 700; text-align: center; margin-bottom:40px}
.helpSwiper {
    padding-right: 0;
}
.main-content-1 .helpSwiper .swiper-slide{width:auto;}
.main-content-1 .helpSwiper .swiper-slide:last-child{margin-right:0 !important}
.main-content-1 .helpSwiper .help-ico{width:140px; height:140px; background:#f6f6f6; border-radius:50% 50% 12px 50%;  display:flex; align-items:center; justify-content:center;}
.main-content-1 .helpSwiper .help-txt{display:block; text-align: center; color:#201d1e; font-size: 17px; font-weight: 500; margin-top:30px}
.theme_dark .main-content-1 .helpSwiper .help-ico{background:#303030; border:1px solid #626262}
.theme_dark  .helpSwiper .help-txt, .theme_dark  .main-content-1 .help-tit{color:#ffffff}

.helpSwiper{  padding-block: 8px;   /* 위아래만 */
  margin-block: -8px;   /* 레이아웃 위치 유지 */}
.help-link {   display: block;  outline: none;}
.help-link:focus-visible {
   outline: 2px solid #000;
  outline-offset: -2px;   /* 링을 요소 안쪽으로 */
  border-radius: 12px;
}

/*여성인권 아카이브*/
/* ===== PC ===== */
.main-content-2 .arch-wrap{
  position:relative;
  margin:136px 0 100px 0;
}
.main-content-2 .arch-wrap::before{
  content:"";
  position:absolute;
  z-index:0;
  top:220px;
  bottom:0;
  right:0;
  left:max(24px, calc((100% - 1400px) / 2));
  background:#eef0f9;
  border-radius:100px 0 0 100px;
}
.theme_dark .main-content-2 .arch-wrap::before{ background:#001f49;}
.main-content-2 .arch-wrap > .inner{
  position:relative;
  z-index:1;
  width:min(1400px, calc(100% - 48px));
  margin:0 auto;
  padding-bottom:130px;
}
.main-content-2 .main-zone,
.main-content-2 .bnr{ margin-left:120px; }

.arch-wrap .arch{display: flex;}
.arch-wrap .arch .arch-head{width: calc(100% - 1046px)}
.arch-wrap .arch-list{width:1046px;}

.main-content-wrap h2{font-size: 34px;font-family: 'SUITE Variable';font-weight: 700; color:#201d1e; }
.main-content-wrap .cbtn.plus{width:34px; height:34px; display:inline-block; background: url(/images/home/kor/user/new_img/btn_main_more.png) no-repeat;}
.theme_dark .main-content-wrap .cbtn.plus{width:34px; height:34px; display:inline-block; background: url(/images/home/kor/user/new_img/btn_main_more_dark.png) no-repeat;}
.arch-head h2{margin-bottom:20px}

/*어떤도움을?*/
   .helpSwiper.swiper {
    position: relative;
    overflow: hidden;
    padding-bottom: 35px;
}
.helpSwiper.swiper .swiper-wrapper { justify-content: flex-start; }

.helpSwiper.swiper > .swiper-scrollbar.swiper-scrollbar-horizontal {
    display: block;
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: 0;
    width: auto;
    height: 8px;
    margin: 0;
    background: #f3f3f3;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
}
.helpSwiper.swiper > .swiper-scrollbar.swiper-scrollbar-horizontal .swiper-scrollbar-drag {
    height: 100%;
    background: linear-gradient(90deg, #128a9b, #1fa57a);
    border-radius: 8px;
}



/* ===== 아카이브 카드 ===== */
.arch-list li{width: 30.66%;margin-right: 4%;}
.arch-list li:last-child { margin-right: 0 }
.doc{display:block}

.doc-cover{
  position:relative;               /* 배지 / hover 버튼 기준 */
}
.doc-cover .img-box{
  display:block;
  aspect-ratio:2.8 / 4;
  border-radius:16px;
  overflow:hidden;
  background:#fff;
  border:1px solid #e7e7e7; box-sizing:border-box    /* 얇은 테두리 */
}
.doc-cover .img-type{
  width:100%;
  padding-top:143%;
  box-sizing:border-box;
  overflow:hidden;
  position:relative;
  background:#fff;
  display:block;                    /* 수정: inline-block → block (baseline 틈 제거) */
}
.doc-cover .img-type img{
  max-width:100%;
  max-height:100%;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  position:absolute;
  top:0;
  left:0;                           /* 수정: left 추가 */
}
/* 배지 */
.doc-cover .badge{
  position:absolute;
  left:20px;
  top:20px;
  z-index:4;
  padding:5px 18px;
  border-radius:20px;
  background:#26b4e9;
  color:#fff;
  font-size:18px;
  font-weight:700;
  line-height:1.3;
}
.doc-cover .badge.green{background:#4aa63c}
.doc-cover .badge.purple{background:#8c40bf}

/* 제목 / 날짜 */
.doc-title{
  margin-top:24px;
  font-size:21px;
  line-height:1.5;
  color:#201d1e;
  word-break:keep-all;
}
.doc-date{
  margin-top:15px;
  font-size:15px;
  color:#555;
  font-weight:300;
}

.theme_dark .doc-title{color:#fff}
.theme_dark .doc-date{color:#bbb}

/* ===== PC: hover 시 미리보기 / 다운로드 ===== */
.doc-btns{
  position:absolute;
  inset:0;
  z-index:3;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius:16px;
  background:rgba(0,0,0,.7);
  opacity:0;
  transition:opacity .2s;
}
.doc-btns a{
  display:block;
  width:146px;
  padding:9px 14px;
  border:1px solid #ccc;
  background:#fff;
  font-size:18px;
  color:#222;
  text-align:center;
}
.theme_dark .doc-btns a{color:#222}
.doc-btns a:first-child::after,
.doc-btns a:last-child::after{
  content:"";
  float:right;
  width:16px;
  height:19px;
  background:0 3px /contain no-repeat;
}
/* 아이콘 이미지가 있으면 경로만 바꿔서 쓰세요 */
.doc-btns a:first-child::after{background-image: url(/images/home/kor/user/new_img/ico_view_img1.png);}
.doc-btns a:last-child::after{background-image: url(/images/home/kor/user/new_img/ico_down_img1.png);}

.dark .doc-btns a:first-child::after{background-image: url(/images/home/kor/user/new_img/ico_view_img1_dark.png);}
.dark .doc-btns a:last-child::after{background-image:url(/images/home/kor/user/new_img/ico_down_img1_dark.png);}


@media (hover:hover){
  .doc:hover .doc-btns,
  .doc:focus-within .doc-btns{opacity:1}    /* 키보드 포커스에서도 보이게 */
}

.main-zone{
  display:grid;
  grid-template-columns:minmax(0,1fr) 40.5%;  
  grid-template-rows:74px auto;
  column-gap:41px;
  margin-top:70px;
}
.main-zone .news{grid-column:1;grid-row:1 / span 2;display:flex;flex-direction:column}
.main-zone .popup-ctrl{grid-column:2;grid-row:1}
.main-zone .section-popup-type1{grid-column:2;grid-row:2}

/* ===== 뉴스 탭 ===== */
.news-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:46px;
  margin-bottom:28px;
  flex:none;
}
.news .tabs{display:flex;align-items:center;gap:12px}
.news .tab{
  padding:12px 28px;
  border-radius:26px;
  font-size:22px;
  font-weight:700;
  color:#000;
  background:none;
}

.theme_dark .news .tab{color:#fff}
.news .tab.on{background:#004f9f;color:#fff}
.news .tab:not(.on){padding:0 4px;font-weight:500}
/* ===== 뉴스 카드 ===== */
.news-box{flex:1;min-height:0}
.news-panel{display:none;height:100%}
.news-panel.on{display:block}
.news-cont{height:100%}
.ncard{
  display:flex;
  height:100%;                      /* 수정: 행 높이를 꽉 채움 */
  background:#fff;
  border-radius:16px;
  border:1px solid #e2e3e5;
  box-sizing:border-box;
  overflow:hidden;
}
.theme_dark .ncard{background:#000; border:0}
.ncard .thumb{
  flex:none;
  width:252px;
  padding:12px 0 12px 12px;
}

.ncard .img-type{
  width:100%;
  padding-top:100%;
  box-sizing:border-box;
  overflow:hidden;
  position:relative;
  background:#fff;
  display:block;     
  border-radius: 10px;              
}
.ncard .img-type img{
  max-width:100%;
  max-height:100%;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  position:absolute;
  top:0;
  left:0;                         
}

.news-panel.graphic .thumb{width:352px; padding: 37px 0 37px 12px;}
.news-panel.graphic .img-type{padding-top:56%;}

.ncard .txt{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  padding:40px;
}
.ncard .cate{font-size:18px;font-weight:700;color:#62ac3f}
.ncard .tit{
  margin-top:10px;
  font-size:22px;
  font-weight:600;
  line-height:1.5;
  color:#201d1e;
  word-break:keep-all;
}
.ncard .date{margin-top:auto;font-size:15px;color:#555;font-weight:300}

.theme_dark .ncard .tit{color:#fff}
.theme_dark .ncard .date{color:#bbb}


/* ===== 팝업존 ===== */
.section-popup-type1{
  height:100%;                  
  border-radius:16px;
  overflow:hidden;
  background:#fff;
}
.section-popup-type1 .popup-swiper{height:100%}

.section-popup-type1 .swiper-slide > a{position:relative}  
.section-popup-type1 .img-type{
  width:100%;
  height:100%;
  box-sizing:border-box;
  overflow:hidden;
  position:relative;
  background:#fff;
  display:block;                 
}
.section-popup-type1 .img-type img{
  max-width:100%;
  max-height:100%;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  position:absolute;
  top:0;
  left:0;                     
}

.popup-ctrl{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  height:46px;
}
.popup-btn{display:flex;align-items:center;gap:8px}
.popup-ctrl .swiper-button-prev,
.popup-ctrl .swiper-button-next{
  position:static;
  width:32px;height:32px;
  margin:0;
  cursor:pointer;
}
.popup-ctrl .swiper-button-prev::after,
.popup-ctrl .swiper-button-next::after{display:none}
.popup-ctrl .swiper-button-prev img,
.popup-ctrl .swiper-button-next img{display:block;width:100%;height:100%}

.popup-ctrl .btn-pause {position:relative; display: inline-block;width: 32px;height:32px;}


/* ===== 하단 배너 ===== */
.main-banner{
  position:relative;
  margin-top:50px;
  margin-left:120px;
}

.main-banner .banner-inner{
  border-radius:16px;
  overflow:hidden;
  transition:height 0.4s ease;   /* 스르륵 */
  max-height:129px
}

.banner-inner a{display:block;border-radius:16px;overflow:hidden}
.banner-inner img{display:block;width:100%;height:auto}
.banner-inner .m-img{display:none}

/* 접힌 뒤 키보드 포커스 차단 */
.main-banner.is-closed .banner-inner{
  visibility:hidden;
  transition:height 0.4s ease, visibility 0s 0.4s;
}

.sch_input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  display: none;
}

/* 토글 버튼 */
.main-banner .banner-toggle{
  position:absolute;
  top:14px;
  right:14px;
  z-index:2;
  width:34px;
  height:34px;
  border-radius:50%;
  background:url(/images/home/kor/user/new_img/btn_toogle.png) no-repeat center / contain;
  transition:top 0.4s ease;
}
.main-banner.is-closed .banner-toggle{
  background-image:url(/images/home/kor/user/new_img/btn_main_more.png);
}

/*진흥원 소식*/
.notice-zone{
  display:grid;
  grid-template-columns:57.2% 1fr;     /* 시안: 800 / 575 */
  column-gap:25px;
  row-gap:0;
  align-items:stretch;
}
.notice-head{
  grid-column:1;
  display:flex;
  justify-content:space-between;     /* 제목 왼쪽, + 버튼 왼쪽 열 오른쪽 끝 */
  align-items:center;
  margin-bottom:28px;
}
.notice-head h2{font-size:32px;font-weight:700;color:#222}
.notice-head .cbtn{width:32px;height:32px}

/* 대표 기사 */
.main-content-3{max-width:1440px; margin:0 auto; padding:0 20px; box-sizing: border-box;}
.notice-main{
  grid-column:1;
  grid-row:2;
  position:relative;
  display:block;
  border-radius:16px;
  overflow:hidden;
  background:#ddd;
}
.notice-main .img-box,
.notice-main .img-box img{
  display:block;
  width:100%;
  height:100%;
}

.notice-main .img-box{
  width:100%;
  padding-top:52.5%;
  box-sizing:border-box;
  overflow:hidden;
  position:relative;
  background:#fff;
  display:block;                   
}
.notice-main .img-box img{
  max-width:100%;
  max-height:100%;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  position:absolute;
  top:0;
  left:0;                         
}


.notice-main .cap{
  position:absolute;
  left:0; right:0; bottom:0;
  padding:23px 40px;
  background:rgba(0,79,159,.8);     /* 파란 반투명 */
  color:#fff;
  border-radius:30px 30px 0 0;
}
.notice-main .cate{display:block;font-size:18px;font-weight:700;color:#fdc513}
.notice-main .tit{
  margin-top:8px;
  font-size:24px;
  font-weight:600;
  line-height:1.4;
  word-break:keep-all;
}
.notice-main .date{display:block;margin-top:10px;font-size:15px;color:#fff; font-weight:300}

/* 목록 */
.notice-list{
  grid-column:2;
  grid-row:2;
  display:flex;
  flex-direction:column;
  gap:7px;
}
.notice-list li{flex:1}
.notice-list a{
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:20px 32px;
  background:#fafafa;
  border:1px solid #e7e7e7;
  border-radius:16px;
}
.notice-list .cate{font-size:16px;font-weight:700}
.notice-list .c-blue{color:#26b4e9}
.notice-list .c-green{color:#62ac3f}
.notice-list .tit{
  margin-top:6px;
  font-size:20px;
  font-weight:500;
  color:#000;
  line-height:1.4;
}
.notice-list .date{margin-top:10px;font-size:15px;color:#666}

.theme_dark .notice-list a{background:#303030; border:1px solid #4e4e4e}
.theme_dark .notice-list .tit{color:#fff}
.theme_dark .notice-list .date{color:#bbb}


/* ===== 게시판 + 배너 ===== */
.board-zone{
  display:grid;
  grid-template-columns:minmax(0,1fr) 37.1%;  
  column-gap:80px;
  align-items:start;
  margin-top:70px
}

/* 탭 */
.board-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:12px;
}
.board-tabs{display:flex;align-items:center}
.btab{
  padding:11px 28px;
  border-radius:30px;
  font-size:22px;
  font-weight:600;
  color:#444;
  background:none;
  margin-right: 16px;
}
.theme_dark .btab{color:#fff}
.btab.on{background:#004f9f;color:#fff}
.btab:not(.on){padding:12px 4px;font-weight:500}
.btab:not(.on) + .btab:not(.on){position:relative;margin-left:34px}   /* 비활성 탭끼리 가운뎃점 */
.btab:not(.on) + .btab:not(.on)::before{
  content:"";
  position:absolute;
  left:-19px;top:50%;
  width:3px;height:3px;
  margin-top:-1px;
  border-radius:50%;
  background:#201d1e;
}

/* 목록 */
.board-panel{display:none}
.board-panel.on{display:block}
.board-list li{border-bottom:1px solid #ddd}
.theme_dark .board-list li{border-bottom:1px solid #333333}
.board-list li:last-child{border-bottom:0}
.board-list a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:21px 0;
}
.board-list .tit{
  flex:1;
  min-width:0;
  font-size:20px;
  color:#201d1e;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.board-list .date{flex:none;font-size:15px;color:#555; font-weight:300}

.theme_dark .board-list .tit{color:#fff}
.theme_dark .board-list .date{color:#ddd}

/* 배너 */
.board-bnr{position:relative;}
.board-swiper{border-radius:16px;overflow:hidden;border:1px solid #dbdbdb}
.board-swiper a{ width: 100%;
    padding-top: 52.5%;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
    background: #fff;
    display: block;}
.board-swiper img{ max-width:100%;
  max-height:100%;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  position:absolute;
  top:0;
  left:0;         }

/* 이전/다음/정지 버튼 (Swiper 기본 스타일 초기화) */
.board-bnr-btn{display:flex;align-items:center;gap:6px; justify-content: end; margin-bottom:40px;}
.board-bnr-btn .swiper-button-prev,
.board-bnr-btn .swiper-button-next{
  position:static;
  width:32px;height:32px;
  margin:0;
  cursor:pointer;
  z-index:1
}
.board-bnr-btn .swiper-button-prev::after,
.board-bnr-btn .swiper-button-next::after{display:none}
.board-bnr-btn .swiper-button-prev img,
.board-bnr-btn .swiper-button-next img{display:block;width:100%;height:100%}

.board-bnr-btn .btn-pause {position:relative; display: inline-block;width: 32px;height:32px}

/*기록과 소통*/
.main-content-4{max-width:1440px; margin:100px auto 0 auto; padding:0 20px; box-sizing: border-box;}
.comm-list{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px;
  margin-top:60px;
  padding-bottom:140px;
}

.zcard-logo{display:flex;align-items:center}
.zcard-logo img{display:block;max-height:100%;width:auto}

.zcard-sub{margin-top:40px;font-size:26px;color:#201d1e;line-height:1.3}
.zcard-name{margin-top:6px;font-size:38px;font-weight:700;color:#201d1e;line-height:1.3}
.zcard-desc{
  margin-top:16px;
  font-size:20px;
  line-height:1.5;
  color:#222222;
  font-weight:300;
  word-break:keep-all;
}

.theme_dark .zcard-sub, .theme_dark .zcard-name{color:#fff}
.theme_dark .zcard-desc{color:#bbb}
.zcard-btns{
  display:flex;
  gap:10px;
  margin-top:auto;
  padding-top:32px;
}

/* 버튼 공통 */
.zbtn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 29px;
  border:1px solid #616161;
  border-radius:26px;
  background:#fff;
  font-size:18px;
  color:#222;
  transition:background .2s, color .2s, border-color .2s;
}

.theme_dark .zbtn{color:#fff; background:#333333; border:1px solid #949494}
.zbtn::after{
  content:"";
  width:16px;height:16px;
  /* 수정: 끝에 쉼표만 있고 값이 없어서 문법 오류였음 → transition 줄 삭제 */
}
.zbtn-link::after{width:16px; height:16px; display:inline-block; background: url(/images/home/kor/user/new_img/ico_go.png) no-repeat;}
.zbtn-mail::after{width:16px; height:16px; display:inline-block; background: url(/images/home/kor/user/new_img/ico_newsletter.png) no-repeat;}

.theme_dark .zbtn-link::after{width:16px; height:16px; display:inline-block; background: url(/images/home/kor/user/new_img/ico_go_on.png) no-repeat;}
.theme_dark .zbtn-mail::after{width:16px; height:16px; display:inline-block; background: url(/images/home/kor/user/new_img/ico_newsletter_on.png) no-repeat;}


/* 기본 카드 (전환 효과만 유지) */
.zcard{
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:500px;
  padding:56px 40px 40px;
  background:#fafafa;
  border:1px solid #e2e3e5;
  border-radius:20px;
  transition:transform .3s, box-shadow .3s, background .3s, border-color .3s;
}

.theme_dark .zcard{background:#333; border:0}

/* ===== 호버 효과 (마우스 + 키보드 포커스) ===== */
/* 수정: 공통 동작(내려오기, 테두리, 글자색)만 남기고 색상은 카드별로 분리 */
@media (hover:hover){
  .zcard:hover{
    transform:translateY(25px);
    border-color:transparent;
  }
  .zcard:hover .zcard-desc{color:#444}

  /* 카드가 내려가면서 윗부분에 마우스가 걸쳐 깜빡이는 현상 방지 */
  .zcard:hover::before{
    content:"";
    position:absolute;
    left:0;right:0;
    top:-25px;
    height:25px;
  }

  /* 아이콘 on 이미지 (3장 공통) */
  .zcard:hover .zbtn-link::after{width:16px; height:16px; display:inline-block; background: url(/images/home/kor/user/new_img/ico_go_on.png) no-repeat;}
  .zcard:hover .zbtn-mail::after{width:16px; height:16px; display:inline-block; background: url(/images/home/kor/user/new_img/ico_newsletter_on.png) no-repeat;}
}

/* 키보드 포커스에서도 같은 효과 (터치 기기 포함) */
.zcard:focus-within{
  transform:translateY(25px);
  border-color:transparent;
}
/* 수정: 포커스일 때도 아이콘이 on 이미지로 바뀌도록 추가 */
.zcard:focus-within .zbtn-link::after{background-image:url(/images/home/kor/user/new_img/ico_go_on.png)}
.zcard:focus-within .zbtn-mail::after{background-image:url(/images/home/kor/user/new_img/ico_newsletter_on.png)}


/* ===== 수정: 1번 카드 (파랑) ===== */
.zcard:nth-child(1):hover,
.zcard:nth-child(1):focus-within{
  background:
    radial-gradient(circle at 80% 15%, rgba(255,255,255,.75) 0, rgba(255,255,255,0) 45%),
    radial-gradient(circle at 15% 90%, rgba(160,205,245,.9) 0, rgba(160,205,245,0) 55%),
    linear-gradient(135deg,#c9e8f1 0%,#a8dcf5 60%,#8fdcf8 100%);
  box-shadow:0 18px 30px rgba(60,120,170,.25);
}
.zcard:nth-child(1):hover .zbtn,
.zcard:nth-child(1):focus-within .zbtn{
  background:#0079bd;
  border-color:#0079bd;
  color:#fff;
}
.zcard:nth-child(1):hover .zbtn:hover{
  background:#005f94;
  border-color:#005f94;
}

/* ===== 수정: 2번 카드 (주황) ===== */
.zcard:nth-child(2):hover,
.zcard:nth-child(2):focus-within{
  background:
    radial-gradient(circle at 15% 15%, rgba(255,235,200,.9) 0, rgba(255,235,200,0) 45%),
    radial-gradient(circle at 85% 85%, rgba(255,160,100,.95) 0, rgba(255,160,100,0) 60%),
    linear-gradient(135deg,#ffe3bd 0%,#ffcb9c 55%,#ffad78 100%);
  box-shadow:0 18px 30px rgba(220,120,50,.28);
}
.zcard:nth-child(2):hover .zbtn,
.zcard:nth-child(2):focus-within .zbtn{
  background:#e15e00;
  border-color:#e06000;
  color:#fff;
}
.zcard:nth-child(2):hover .zbtn:hover{
  background:#e15e00;
  border-color:#b84d00;
}

/* ===== 수정: 3번 카드 (초록) ===== */
.zcard:nth-child(3):hover,
.zcard:nth-child(3):focus-within{
  background:
    radial-gradient(circle at 15% 15%, rgba(255,255,255,.85) 0, rgba(255,255,255,0) 45%),
    radial-gradient(circle at 85% 85%, rgba(160,225,130,.9) 0, rgba(160,225,130,0) 60%),
    linear-gradient(135deg,#e6f7d9 0%,#cdf1b8 55%,#b8eb9a 100%);
  box-shadow:0 18px 30px rgba(90,160,60,.25);
}
.zcard:nth-child(3):hover .zbtn,
.zcard:nth-child(3):focus-within .zbtn{
  background:#43a136;
  border-color:#43a136;
  color:#fff;
}
.zcard:nth-child(3):hover .zbtn:hover{
  background:#43a136;
  border-color:#43a136;
}

@media all and (max-width:1300px){
.zbtn{font-size:16px}
}
	
@media all and (max-width:1280px){

.main-content-wrap h2{font-size:30px;}
.visual-tit{font-size:50px;}
.visual-txt{font-size:20px}

.arch-wrap .arch .arch-head{width: calc(100% - 81.71vw)}
.arch-wrap .arch-list{width:81.71vw}
.doc-title{font-size:19px}
.notice-main .tit{font-size:22px}
.notice-list .cate{font-size:15px}
.notice-list .tit{font-size:18px}
.board-list .tit{font-size:18px}
.btab{font-size:20px}
.board-zone{gap:60px}
.comm-list{gap:20px}
.zcard{padding:4.29vw 3.12vw 3.12vw}
.zcard-sub{font-size:24px}
.zcard-name{font-size:36px}
.zcard-desc{font-size:18px}
.zbtn{padding:0.62vw 1.8vw; font-size:15px; gap:4px}

.news-panel.graphic .txt{padding:40px 20px}
.news-panel.graphic .thumb{width:280px}


}

@media all and (min-width: 1024px) and (max-width:1450px){


}


@media all and (max-width:1024px){
  .zcard:hover,
  .zcard:focus-within{transform:none}
  .comm-list{padding-bottom:0}
  
  /*메인비주얼*/
  .main-visual{margin:20px auto 0 auto;}
  .main-visual .visual-ctrl{padding:0 20px;}
  /*여성인권*/
  .arch-wrap .arch{display:block;}
  .arch-wrap .arch .arch-head{width:100%; display:flex;align-items: center; justify-content: space-between; padding-right:20px; box-sizing:border-box}
  .arch-wrap .arch-list{width:100%;        padding-left: 20px;    box-sizing: border-box;}
  .main-content-2 .arch-wrap > .inner{width:100%; padding-left:20px; box-sizing:border-box}
  .arch-list li{width:300px; margin-right:24px; }
  
  .doc { display: flex; flex-direction: column; }
  .doc-cover { display: contents; }

  .doc-cover .img-box { order: 1; position: relative; }
  .doc-cover .badge   { order: 0; position: absolute; top: 12px; left: 12px; z-index: 2; }
  .doc-title { order: 2; display: -webkit-box;
   -webkit-line-clamp: 3;       
   -webkit-box-orient: vertical;
   overflow: hidden;
   min-height: calc(1.5em * 3); 
   line-height: 1.5; }
  .doc-date  { order: 3; }
  .doc-btns {
      order: 4;
      position: static;            /* 오버레이 해제 */
      flex-direction: row;         /* 가로 2칸 */
      justify-content: stretch;
      gap: 8px;
      margin-top: 20px;
      padding: 0;
      background: none;
      opacity: 1;                  /* 항상 보이게 */
      border-radius: 0;
  }
  .doc-btns a {
      flex: 1;
      width: auto;
      font-size: 16px;
  }
  .main-content-2 .main-zone, .main-content-2 .bnr{margin-left:0; padding:0 20px;}

   .main-zone {
       grid-template-columns: minmax(0, 1fr);
       grid-template-rows: auto;
   }
   .main-zone .news                { grid-column: 1; grid-row: 1; }
   .main-zone .section-popup-type1 { grid-column: 1; grid-row: 2; margin-top:20px }
   .main-zone .popup-ctrl          { grid-column: 1; grid-row: 3; }

   /* 뉴스 카드: 가로형 → 세로형 */
   .ncard { flex-direction: column; }
   .ncard .date { margin-top: 15px; }   

    .section-popup-type1 {
        position: relative;
        height: auto;
        aspect-ratio: auto;
    }
    .section-popup-type1 .popup-swiper {
        position: relative;      /* absolute 해제 */
        inset: auto;
        height: auto;
        overflow: hidden;
    }
    .section-popup-type1 .swiper-wrapper {
        display: flex;           /* 가로 나열 유지 */
        height: auto;
    }
    .section-popup-type1 .swiper-slide {
        flex-shrink: 0;
        height: auto;            /* width는 Swiper가 인라인으로 잡음 */
    }
    .section-popup-type1 .swiper-slide > a {
        position: static;
        display: block;
        height: auto;
    }
    .section-popup-type1 .img-type {
        position: static;
        padding-top: 0;
    }
    .section-popup-type1 .img-type img {
        position: static;
        display: block;
        width: 100%;
        height: auto;
    }

    .main-zone .popup-ctrl { margin-top: 16px; }
    .main-banner{margin-left:0; padding:0 20px}
    .banner-inner .m-img{display:block;}
    .banner-inner .pc-img{display:none;}
    .banner-inner{padding-right:40px}
    
    .notice-zone{display:block}
    .board-zone{display:block}
    
    .ncard .thumb, .news-panel.graphic .thumb{width:100%; padding:20px; box-sizing:border-box}
    .ncard .txt, .news-panel.graphic .txt{padding:0px 20px 40px 20px}
     
    /* 1열 + 로고 왼쪽 / 글 오른쪽 */
    .comm-list { grid-template-columns: 1fr; margin-top:30px }

    .zcard {
        display: grid;
        grid-template-columns: auto 1fr;      /* 로고 | 텍스트 */
        column-gap: 40px;
        align-items: start;
    }
    .zcard-logo  { grid-column: 1; grid-row: 1 / span 4; }
    .zcard-sub,
    .zcard-name,
    .zcard-desc,
    .zcard-btns  { grid-column: 2; }
    .zcard-sub   { margin-top: 0; }
    .zcard-btns  { flex-direction: column; align-items: flex-start; margin-top: 0; }
    .zcard-sub  { margin-top: 0; }
    .zcard-name { margin-top: 6px; }
    .zcard-desc { margin-top: 16px; }
    .zcard-btns { margin-top: 0; padding-top: 24px; }

    /* hover 효과를 기본으로 */
    .zcard { border-color: transparent;min-height: 0; align-content: center;  padding: 40px 30px; }
    .zcard .zcard-desc { color: #444; }
    .zcard .zbtn-link::after { background-image: url(/images/home/kor/user/new_img/ico_go_on.png); }
    .zcard .zbtn-mail::after { background-image: url(/images/home/kor/user/new_img/ico_newsletter_on.png); }

    /* 1번 카드 (파랑) */
    .zcard:nth-child(1) {
        background:
            radial-gradient(circle at 80% 15%, rgba(255,255,255,.75) 0, rgba(255,255,255,0) 45%),
            radial-gradient(circle at 15% 90%, rgba(160,205,245,.9) 0, rgba(160,205,245,0) 55%),
            linear-gradient(135deg,#c9e8f1 0%,#a8dcf5 60%,#8fdcf8 100%);
    }
    .zcard:nth-child(1) .zbtn { background:#0079bd; border-color:#0079bd; color:#fff; }

    /* 2번 카드 (주황) */
    .zcard:nth-child(2) {
        background:
            radial-gradient(circle at 15% 15%, rgba(255,235,200,.9) 0, rgba(255,235,200,0) 45%),
            radial-gradient(circle at 85% 85%, rgba(255,160,100,.95) 0, rgba(255,160,100,0) 60%),
            linear-gradient(135deg,#ffe3bd 0%,#ffcb9c 55%,#ffad78 100%);
    }
    .zcard:nth-child(2) .zbtn { background:#e15e00; border-color:#e06000; color:#fff; }

    /* 3번 카드 (초록) */
    .zcard:nth-child(3) {
        background:
            radial-gradient(circle at 15% 15%, rgba(255,255,255,.85) 0, rgba(255,255,255,0) 45%),
            radial-gradient(circle at 85% 85%, rgba(160,225,130,.9) 0, rgba(160,225,130,0) 60%),
            linear-gradient(135deg,#e6f7d9 0%,#cdf1b8 55%,#b8eb9a 100%);
    }
    .zcard:nth-child(3) .zbtn { background:#43a136; border-color:#43a136; color:#fff; }
     /* 카드 hover/포커스 시 내려오는 효과 제거 */
  .zcard,
  .zcard:hover,
  .zcard:focus-within,
  .zcard:active,
  .zcard:nth-child(n):hover,
  .zcard:nth-child(n):focus-within,
  .zcard:nth-child(n):active {
    transform: none !important;
    box-shadow: none !important;
    transition: none !important;
  }
  .zcard:hover::before,
  .zcard:focus-within::before,
  .zcard:active::before {
    content: none !important;
  }
    
    

    /* 버튼 hover 시 색 변화 제거 (기본 색 그대로 유지) */
    .zcard:nth-child(1):hover .zbtn:hover { background: #0079bd; border-color: #0079bd; }
    .zcard:nth-child(2):hover .zbtn:hover { background: #e15e00; border-color: #e06000; }
    .zcard:nth-child(3):hover .zbtn:hover { background: #43a136; border-color: #43a136; }
    
    .notice-list{margin-top:15px;}
    .board-bnr{margin-top:40px}

}



@media all and (max-width:767px){
     .main-visual .swiper{width:calc(100% - 40px)}
	 .main-visual .swiper-slide{height:500px}
	.visual-link{background: var(--m) no-repeat center / cover;  align-items: flex-start; padding: 60px 30px;  }
	.visual-tit{font-size:30px}
	.visual-txt{font-size:17px; line-height:1.5}
	.visual-txt-area{left:30px; top:55px; right:30px; transform: none;}
	.main-visual .visual-btn .swiper-button-next img, .visual-btn .swiper-button-prev img, .main-visual .btn-pause{width:24px; height:24px; background-size:100% !important}
	.main-visual .visual-btn .swiper-button-next, .visual-btn .swiper-button-prev{left:0; width:auto}
	.main-visual .visual-btn{gap:6px}
	.main-visual .visual-btn .swiper-button-next, .main-visual .visual-btn .swiper-button-prev{width:24px; height:24px}
	.helpSwiper .swiper-slide {
	    width: 100px;            /* 모바일 아이콘 크기에 맞춰 고정 */
	    text-align: center;
	}
	.helpSwiper .swiper-slide .txt {   /* 실제 텍스트 클래스명으로 */
	    word-break: keep-all;
	    white-space: normal;
	}
	.main-content-1 .helpSwiper .help-ico{width:100px; height:100px;}
	.main-content-1 .helpSwiper .help-ico img{width:50%}
	.main-content-1{padding-top:50px}
	.main-content-1 .help-tit{font-size:24px; margin-bottom:30px}
	.main-content-1 .helpSwiper .help-txt{font-size:15px}
	.main-content-2 .arch-wrap{margin:60px 0}
	.main-content-wrap h2{font-size:23px}
	.main-content-wrap .cbtn.plus, .theme_dark .main-content-wrap .cbtn.plus{width:24px; height:24px; background-size:100%}
	.popup-ctrl .swiper-button-prev, .popup-ctrl .swiper-button-next, .board-bnr-btn .swiper-button-prev, .board-bnr-btn .swiper-button-next, .partner-ctrl .swiper-button-prev, .partner-ctrl .swiper-button-next{width:24px; height:24px}
	.popup-ctrl .btn-pause, .board-bnr-btn .btn-pause, .partner-ctrl .btn-pause{width:24px; height:24px; background-size:100% !important}
	.main-banner .banner-toggle{width:24px; height:24px; background-size: 100%; top:7px}
	
	.arch-list li{width:285px}
	.doc-cover .badge{font-size:16px}
	.doc-title{font-size:17px; margin-top:15px}
	.doc-date{font-size:14px; marign-top:10px;}
	.doc-btns{margin-top:10px}
	
	.main-zone{margin-top:60px}
	.news .tab{font-size:17px;     padding: 10px 24px;}
	.news-head{height:40px; margin-bottom:15px}
	.ncard .thumb, .news-panel.graphic .thumb{padding:15px}
	.ncard .cate{font-size:15px}
	.ncard .tit{font-size:17px}
	.ncard .date{font-size:14px; margin-top:10px}
	.ncard .txt, .news-panel.graphic .txt{padding:0 20px 30px 20px}
	.popup-ctrl{height:auto;}
	.popup-btn{gap:6px}
	.banner-inner{padding-right:25px; max-height:323px}
	.main-content-2 .arch-wrap > .inner{padding-bottom:70px}
	.main-content-2 .arch-wrap::before{ border-radius: 50px 0 0 50px;}
	.notice-main .cate{font-size:15px}
	.notice-main .tit{font-size:18px;}
	.notice-main .date{font-size:14px}
	.notice-main .img-box{padding-top:70%}
	.notice-main .cap{padding:15px 20px; border-radius: 15px 15px 0 0;}
	.notice-list a{padding:15px 25px; border-radius:10px; }
	.notice-list .cate{font-size:14px}
	.notice-list .tit{font-size:15px}
	.notice-list .date{font-size:12px}
	.board-zone{margin-top:50px}
	.btab{font-size:17px;     padding: 10px 24px}
	.btab:not(.on) + .btab:not(.on)::before{left:-13px}
	.btab:not(.on) + .btab:not(.on){padding-left:24px}
	.board-list .tit{font-size:16px; display:block;}
	.board-list .date{font-size:14px}
	.board-list a{display:block; padding:15px 0}
	.board-bnr{margin-top:20px}
	.board-bnr-btn{margin-bottom:20px}
	
	.main-content-4{margin-top:60px}
	.zcard{column-gap: 25px;}
	.zcard-sub{font-size:18px;}
	.zcard-name{font-size:25px}
	.zcard .zcard-desc{font-size:15px; margin-top:10px}
	.zcard-logo img{width:60px}
	.zbtn{font-size:14px; padding:8px 20px}
	.zbtn-link::after, .zcard .zbtn-mail::after, .theme_dark .zbtn-link::after, .theme_dark .zbtn-mail::after{width:14px; height:14px;         background-size: 100%;}
	.zcard-btns{padding-top:14px}

	
     /* 아이콘 on 이미지 (3장 공통) */
  .zcard:hover .zbtn-link::after{width:14px; height:14px; display:inline-block; background: url(/images/home/kor/user/new_img/ico_go_on.png) no-repeat; background-size:100%}
  .zcard:hover .zbtn-mail::after{width:14px; height:14px; display:inline-block; background: url(/images/home/kor/user/new_img/ico_newsletter_on.png) no-repeat; background-size:100%}
	
}