/**************************************************************/
  /**************************************************************/
  /***************************** main ***************************/
  /**************************************************************/
  /**************************************************************/
  /* ----------------------- video visual ----------------------*/
  /* .main_copy {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    left: 50%;
    bottom: 5rem;
    transform: translate(-50%);
    text-align: center;
    z-index: 2;
    color: #fff;
}
.main_copy img {
    margin-bottom: 1.25rem;
}
.main_copy p {
    display: block;
    width: 100%;
    font-size: 1.75rem;
    font-family: var(--main-font);
    font-weight: 600;
    letter-spacing: 1px;
} */


/* 페이지별 헤더 색상 교체 */

/* #header.mainheader {border-bottom: 1px solid var(--c-black-5);} */
#header.mainheader .logo a img.on {display: block;}
#header.mainheader .logo a img.off {display: none;}

#header.mainheader .top_header .wrap a { color: var(--c-black-1);}
#header.mainheader nav #gnb li .nav_dep1 {color: var(--c-black-1);}
#header.mainheader .open .join a {color: var(--c-black-3);}
#header.mainheader .open .login a {color: var(--c-black-3);}
#header.mainheader .open ul li a {color: var(--c-black-3);}

#header.mainheader .open ul li a .material-icons-round, #header.mainheader.on .open ul li a .material-icons-outlined {color: var(--c-black-3);}
#header.mainheader .menu_area ul li a.btn_ham_menu {
    background-image: url(../images/common/ic_ham_menu_on.png);
}

#header.mainheader.on .top_header .wrap a { color: var(--c-black-1);}
#header.mainheader.on nav #gnb li .nav_dep1 {color: var(--c-black-1);}
#header.mainheader.on .open .join a {color: var(--c-black-3);}
#header.mainheader.on .open .login a {color: var(--c-black-3);}
#header.mainheader.on .open ul li a {color: var(--c-black-3);}

#header.mainheader.on .open ul li a .material-icons-round, #header.mainheader.on .open ul li a .material-icons-outlined {color: var(--c-black-3);}

#header.mainheader.on .menu_area ul li a.btn_ham_menu {
    background-image: url(../images/common/ic_ham_menu_on.png);
}
#header.mainheader.on .logo a img.on {
    display: none;
}
#header.mainheader.on .logo a img.off {
    display: block;
}

.fp-viewing-HOME #header.mainheader .menu_area ul li a.btn_ham_menu {background-image: url(../images/common/ic_ham_menu.png);}
.fp-viewing-HOME #header.on .menu_area ul li a.btn_ham_menu {background-image: url(../images/common/ic_ham_menu_on.png);}
.fp-viewing-HOME #header.mainheader .menu_area ul li a.searchbtn {background-image: url(../images/common/ic_search.png);}
.fp-viewing-HOME #header.mainheader .open ul li a
.fp-viewing-HOME #header.mainheader nav #gnb li .nav_dep1 {color: #fff; }
.fp-viewing-HOME #header .top_header .wrap a {color: #fff;}
.fp-viewing-HOME #header nav #gnb li .nav_dep1 { color: #fff;}
.fp-viewing-HOME #header .logo a img.off { display: block !important;}
.fp-viewing-HOME #header .logo a img.on { display: none !important;}
.fp-viewing-HOME #header.on .logo a img.on { display: block !important;}
.fp-viewing-HOME #header.on .logo a img.off { display: none !important;}


.fp-viewing-FOOTER #header.mainheader {background: #fff;}



/* ------------------- sec basic setting ---------------------*/

.section .inner {
    width: var(--web-width);
    margin: 0 auto;
}

.section .inner .sec_tit {
    /* width: 100%; */
}

.section .inner .sec_tit h3 {
    font-size: var(--txt-6xl);
    font-weight: 400;
    color: var(--c-black-1);
    display: inline-block;
}

.section .inner .sec_tit h3 span{
    font-size: 2.25rem;
    color: var(--c-black-1);
    font-weight: 500;
    margin-top: 10px;
}
.section .inner .sec_tit p{
    font-size: var(--txt-3xl-1);
    color: var(--c-black-1);
    font-weight: 400;
    margin-top: 1rem;
}
.section .inner .sec_tit h4 {
    font-size: var(--txt-4xl-1);
    font-weight: 600;
    color: var(--c-black-1);
}
.section .inner .btn_plus {
    display: inline-block;
    /* width: 200px;
    height: 50px; 
    background: var(--main-color);
    border-radius: var(--radius-all-xs);
    padding: 1.5rem;
    font-size: 1.125rem;
    font-weight: 400;
    transition: 0.3s;*/
    display: flex;
    justify-content: center;
    align-items: center;
}
.section .inner .btn_plus .material-icons-outlined {
    font-size: 3.25rem;
    color: var(--main-color-2);
}
/* .section .inner .btn_plus:hover {
    color: #fff;
} */


/* -------------------------- sec1 ---------------------------*/
@keyframes scroll {
    0% {
        transform: translateY(0);
    }

    100% {
        transform: translateY(-20px);
    }
}
.sec1 {
    position: relative;
}
.sec1::before {
    content: "";
    display: block;
    width: 15px;
    height: 135px;
    background: url(../images/main/scrollimg.png) no-repeat center center;
    position: absolute;
    right: 35px;
    top: 80%;
    background-size: cover;
    opacity: 1;
    z-index: 9999;
    animation: scroll .8s infinite alternate;
}

.sec1::after {
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    height: 20px;
    background: #8b0029;
}

#main_full .section.active::before,
#main_full .section.active::after {
    opacity: 1;
    transition: .8s .6s
}

.section .inner .sec_tit_wrap {
    margin-bottom: 2.5rem;

}

/* -------------------------- sec_activity ---------------------------*/

.section.sec_activity {
    position: relative;
    background: url(../images/main/activity_bg.png) no-repeat center;
    z-index: 1;
}

.section.sec_activity .inner {
    margin: 4rem auto 0;
    position: relative;
}

.section.sec_activity .inner .sec_tit_wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.section.sec_activity .inner .sec_tit {
    width: 100%;
    text-align: center;
}
/* 카드 그리드 */
.volunteer-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 2rem;
}

.v-card {
  display: grid;
  grid-template-columns: 1fr;
  /* background: #fff;
  border-radius: var(--radius-all-sm);
  box-shadow: 0 10px 28px rgba(0,0,0,.08);
  overflow: hidden; */
}

/* 썸네일 */
.v-thumb { 
    aspect-ratio: 4/5; 
    overflow: hidden;
    border-radius: var(--radius-2-xl); 
    box-shadow: 10px 10px 20px rgba(0, 0, 0, .2);
}
.v-thumb.alt { 
    border-radius: var(--radius-2-xl-re); 
}
.v-thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1.02);
  transition: transform .35s ease;
}
.v-card:hover .v-thumb img { transform: scale(1.06); }

/* 본문 */
.v-body {
  padding: 2rem 0 0;
}
.v-tit {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}
.v-heading {
  font-size: var(--txt-3xl);
  font-weight: 600;
  color: var(--c-black-1);
  width: 100%;
  text-align: center;
}
.v-desc {
  margin: 0 0 1.25rem;
  font-size: var(--txt-lg-2);
  font-weight: 400;
  line-height: 1.5;
  color: var(--c-black-3);
  margin-top: 1rem;
}

/* 버튼 */
.btn-more {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  padding: .5rem 1.5rem;
  color: var(--main-color);
  background: #fff;
  border: 1px solid var(--main-color);
  border-radius: var(--radius-all-lg);
  transition: background .2s ease, color .2s ease, transform .1s ease;
}
/* 화살표(아이콘) 크게 */
.btn-more .cap { width: 24px; height: 24px; }   /* 원형 캡 사이즈 ↑ */
.btn-more .ico { width: 24px; height: 24px; }   /* SVG 아이콘 사이즈 ↑ */
.btn-more .ico path { stroke-width: 2; }      /* 선 굵기 ↑ (테두리 또렷) */

.btn-more:hover {
  background: var(--main-color);
  color: #fff;
  transform: translateY(-1px);
}
.btn-more span {
  font-size: var(--txt-md);
  font-weight: 500;
  font-family: var(--sub-font);
  text-transform: uppercase; /* 디자인 시안 느낌 유지 */
}

/* 버튼 대안 컬러 (의료봉사 카드) */
.btn-more.alt {
  color: #fff;
  background: var(--main-color);
  border-color: var(--main-color);
}
.btn-more.alt:hover {
  background: color-mix(in oklab, var(--main-color) 88%, black 12%);
  border-color: color-mix(in oklab, var(--main-color) 88%, black 12%);
}

/* -------------------------- sec_notice ---------------------------*/

.section.sec_notice {
    position: relative;
    background: url(../images/main/notice_bg.png) no-repeat center;

}
.section.sec_notice .inner {
    margin: 5rem auto 0;
}
.sec_notice .sec_tit_wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}
.sec_notice .sec_tit_wrap .sec_menu {
    display: flex;
    justify-content: flex-end;
    width: 50%;
    gap: 1.5rem;
}


/* 섹션 래퍼 */
.news-sec {
  position: relative;
}
.news-bg {
  position: absolute; inset: 0 0 0 0;
  background:
    radial-gradient(140% 120% at 0% 0%, #fff 0 58%, transparent 59%) top left / 70% 60% no-repeat,
    linear-gradient(180deg, #fff 0%, color-mix(in oklab, var(--sub-color-6), #fff 55%) 100%);
  pointer-events: none; z-index: 0;
}

/* 그리드 컨테이너 공통 */
.container { max-width: var(--web-width); margin: 0 auto; position: relative; z-index: 1; }

/* 헤더 */
.news-header { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 1rem; }
.news-title {
  margin: 0;
  font-size: clamp(var(--txt-4xl), 5vw, var(--txt-5xl));
  font-weight: 800; letter-spacing: -.02em; color: var(--c-black-2);
}
.news-title span { opacity: .55; }

.tab_main-tab { display: flex; align-items: center; gap: 1.5rem; }
.tab_main-tab .tab_main {
  appearance: none; border: 0; background: none; cursor: pointer;
 
  font-size: var(--txt-2xl); color: var(--c-black-3);
}
.tab_main-tab .tab_main:hover { color: var(--c-black-1); }
.tab_main-tab .tab_main.active { color: var(--main-color); font-weight: 600; }

/* 카드 그리드 */
.news-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: var(--pad-tb-md);
}
.news-card {
  background: #fff; 
  border-radius: var(--radius-all-sm);
  box-shadow: 5px 5px 20px rgba(0,0,0,.15);
  padding: var(--pad-tb-lg); 
  display: grid; grid-template-rows: auto 1fr auto;
  cursor: pointer;
}
.news-head {
  margin: 0 0 1rem; font-size: var(--txt-xl); line-height: 1.35; font-weight: 600; color: var(--c-black-2); min-height: 66px;
}
.news-desc {
  margin: 0 0 1rem; font-size: var(--txt-md); line-height: 1.35; color: var(--c-black-3);
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;min-height: 66px;
}
.news-date {
  font-size: var(--txt-md); font-weight: 600; color: var(--main-color);
}

/* CTA 두 개 */
.cta-grid {
  margin-top: var(--pad-tb-lg);
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--pad-tb-md);
}
.cta-card {
  position: relative;
  display: grid; grid-auto-flow: column; align-items: center; justify-content: space-between;
  padding: 2rem 2.25rem;
  border-radius: var(--radius-2-lg-re);
  color: #fff; text-decoration: none; overflow: hidden;
  /* box-shadow: 0 12px 28px rgba(0,0,0,.12); */
}
.cta-card strong { font-size: clamp(var(--txt-xl), 2.5vw, var(--txt-3xl)); font-weight: 600; letter-spacing: -.02em; }

.cta-card .material-icons-outlined {
    font-size: var(--txt-5xl);
}
/* 왼쪽 - sunrise(오렌지→라임) */
.cta--sunrise {
    color: #fff;
    /* background: rgba(247, 176, 35, 0.4); */
    background-image: linear-gradient(150deg, rgba(250, 208, 123, 1) 35%, rgba(242, 156, 113, 1) 65%) !important;
}
/* 오른쪽 - crimson(버건디) */
.cta--crimson {
    background: rgba(139, 0, 41, 0.9);
}

/* CTA 오른쪽 원형 캡 */
.cta-cap {
  width: 52px; height: 52px; border-radius: var(--round_max);
  display: grid; place-items: center;
  background: rgba(255,255,255,.92); color: var(--c-black-2);
  transition: transform .2s ease, background .2s ease;
}


/* -------------------------- sec_gallery ---------------------------*/

.section.sec_gallery {
    position: relative;
    background: url(../images/main/gallery_bg.png) no-repeat center;

}
.section.sec_gallery .inner {
    margin: 5rem auto 0;
}
.sec_gallery .sec_tit_wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}
.sec_gallery .sec_tit_wrap .sec_menu {
    display: flex;
    justify-content: flex-end;
    width: 50%;
    gap: 1.5rem;
}

.tab_gall-tab { display: flex; align-items: center; gap: 1.5rem; }
.tab_gall-tab .tab_gall {
  appearance: none; border: 0; background: none; cursor: pointer;
 
  font-size: var(--txt-2xl); color: var(--c-black-3);
}
.tab_gall-tab .tab_gall:hover { color: var(--c-black-1); }
.tab_gall-tab .tab_gall.active { color: var(--main-color); font-weight: 600; }

/* 섹션 여백 */
.gallery-sec { 
    
}

/* 3열 그리드 */
.gallery-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--pad-tb-md);
}

/* 카드 */
.g-card{
    display:block;
    text-decoration:none;
    color:inherit;
    transition: transform .18s ease, box-shadow .18s ease;
    /* background: #fff;
    border-radius: var(--radius-all-sm);
    box-shadow: 5px 5px 20px rgba(0,0,0,.15); */
}

.g-figure{
  background:#fff;
  border-radius: var(--radius-all-sm);
  overflow:hidden;
  display:grid;
  grid-template-rows: auto auto;
}

/* 썸네일 (시안 비율에 가깝게 4:3) */
.g-figure img{
  width:100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display:block;
  transform: scale(1.02);
  transition: transform .35s ease;
  border-radius: var(--radius-all-sm);
  border-bottom: 1px solid var(--c-black-6);
}

/* 캡션 */
.g-caption{
  padding: 2rem 0;
  font-size: var(--txt-xl);
  color: var(--c-black-2);
  font-weight: 600;
  line-height: 1.5;
  display:-webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow:hidden;
  /* text-align: center; */

}
.g-caption .g-title {
	font-size: var(--txt-xl);
  color: var(--c-black-2);
  font-weight: 600;
  line-height: 1.5;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
	margin-bottom: 6px;
}

.g-caption .g-desc {
	font-size: var(--txt-md);
	font-weight: 400;
	color: #666;
	line-height: 1.5;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
}
/* hover 효과 */
.g-card:hover { transform: translateY(-4px); }
.g-card:hover img { transform: scale(1.06); }

/* 접근성: 키보드 포커스 */
.g-card:focus-visible .g-figure{
  outline: 3px solid color-mix(in oklab, var(--accent-color), white 35%);
  outline-offset: 3px;
  border-radius: var(--radius-all-sm);
}


/* -------------------------- sec_introduce ---------------------------*/

.section.sec_introduce {
    position: relative;
    /* background: url(../images/main/gallery_bg.png) no-repeat center; */

}
.section.sec_introduce .inner {
    margin: 4rem auto 0;
    /* position: relative; */
}
.section.sec_introduce .inner .sec_tit_wrap {
    margin-top: 2.5rem;
}
.section.sec_introduce .sec_tit h3 {
    font-size: var(--txt-7xl);
    line-height: var(--txt-7xl);
}
.section.sec_introduce .inner .sec_tit p{
    margin-top: 10px;
}

/* 상단 2열 레이아웃 */
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items: center;position:relative;z-index: 2;}

.hero-text {
  display: grid;
  grid-template-rows: 1fr 1fr;
  /* gap: 2.5rem; */
  align-items: center;
  height: 100%;
}

/* 타이틀 */
.hero-title{margin:0 0 .5rem;line-height:1.05;color:var(--c-black-2)}
.hero-title .en{display:block;font-weight:400;font-size:clamp(2rem,5.2vw,3.5rem);letter-spacing:.03em}
.hero-title strong{display:block;font-weight:800;font-size:clamp(2.4rem,6vw,4rem);letter-spacing:.02em}
.hero-sub{margin:.25rem 0 0;font-weight:800;color:var(--main-color);font-size:var(--txt-2xl)}

/* 이미지 카드 */
.hero-media{margin:0;aspect-ratio: 4 / 3;overflow:hidden;border-radius: 0 3.75rem 0 3.75rem;
  box-shadow:0 18px 42px rgba(0,0,0,.18)}
.hero-media img{width:100%;height:100%;object-fit:cover;display:block}

/* 하단 그라디언트 패널 */
.hero-panel{
  position:relative;
  z-index: 2;
  /* margin-top:-240px; */
  /* padding:3.75rem 0; */
  /* background:
    linear-gradient(135deg,
      color-mix(in oklab, var(--sub-color) 35%, #fff 65%) 0%,
      color-mix(in oklab, var(--sub-color), var(--sub-color-3) 45%) 100%); */
  color:var(--c-black-2);
  border-radius: 3.125rem 0 3.125rem 0; /* 좌상/우하 라운드 */
  /* height: 340px; */
}
.hero-grid:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, 0);
  width: 1740px;
  height: calc(50% + 4rem);
  z-index: -1;
  /* margin-top: calc(var(
  --pad-tb-lg) * .6); */
  /* padding: 2.25rem 2.25rem 2.5rem; */
  background: rgba(247, 176, 35, 0.2);
  background-image: linear-gradient(135deg, rgba(253, 231, 189, 1) 30%, rgba(249, 205, 184, 1) 65%) !important;
  border-radius: 3.75rem 3.75rem 0 0;
}
.panel-text{
    /* max-width: 45%; */
    margin-bottom: 3.125rem;
    line-height: 1.5;
    font-size: var(--txt-lg-2);
    color: var(--c-black-2)
  }

/* 우하단 데코 블록 */
.hero-decor{
  position:absolute;right:0;bottom:0;z-index:0;
  width:min(62%,880px);height:220px;
  background: color-mix(in oklab, var(--sub-color-3), #fff 40%);
  border-radius: 0 3.75rem 0 3.75rem; /* 우상/좌하 라운드 */
  filter: saturate(92%);
}

/*--------------------------------------1710----------------------------------*/
@media screen and (max-width:1710px) {
  .section .inner { padding: 4rem 90px; }
}