@charset "utf-8";

/* FONTS */
@font-face{
	font-family:'SangSangBodyL';
	font-style:normal;
	font-weight:normal;
	src:url('../fonts/SangSangBodyL.eot');
	src:local('?'), url('../fonts/SangSangBodyL.woff') format('woff'), url('../fonts/SangSangBodyL.ttf') format('truetype');
}
@font-face{
	font-family:'SangSangBodyM';
	font-style:normal;
	font-weight:normal;
	src:url('../fonts/SangSangBodyM.eot');
	src:local('?'), url('../fonts/SangSangBodyM.woff') format('woff'), url('../fonts/SangSangBodyM.ttf') format('truetype');
}
@font-face{
	font-family:'SangSangTitleM';
	font-style:normal;
	font-weight:normal;
	src:url('../fonts/SangSangTitleM.eot');
	src:local('?'), url('../fonts/SangSangTitleM.woff') format('woff'), url('../fonts/SangSangTitleM.ttf') format('truetype');
}
@font-face{
	font-family:'SangSangTitleB';
	font-style:normal;
	font-weight:normal;
	src:url('../fonts/SangSangTitleB.eot');
	src:local('?'), url('../fonts/SangSangTitleB.woff') format('woff'), url('../fonts/SangSangTitleB.ttf') format('truetype');
}
/*
* {
    margin: 0;
    padding: 0;
    font: inherit;
    color: inherit;
    max-height: 999999px;
}
*/
/* reset */
html, body { 
	height:100%;
}
body {
	-webkit-text-size-adjust:none;
} /* 뷰표트 변환시 폰트크기 자동확대 방지 */
body * {
	box-sizing:border-box;
}
	/*font-family:'SangSangBodyL','NanumGothic','돋움',Dotum,'굴림',Gulim,Helvetica,AppleGothic,sans-serif;*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, textarea,
table, caption, tbody, tfoot, thead, tr, th, td,
header, footer, nav, menu, section, article, aside, *:after, *:before {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
	word-break: break-all;

  font-family: 'Pretendard', sans-serif;
	font-size:inherit;
	vertical-align:top;
	letter-spacing:-0.25px;
	line-height:1.5;
}
/*251023*/
input {
  margin: 0;
	padding: 0;
}
/*//251023*/
h1, h2, h3, h4, h5, h6 {
	font-weight:normal;
}
sup { 
    vertical-align: super !important;
    font-size: smaller !important;
}
header, footer, section, article, aside, nav, 
hgroup, details, menu, figure, figcaption {
    display: block;
}

table {
	border-collapse: separate;
	border-spacing: 0; 
	table-layout:fixed; 
	word-wrap:break-word; 
	word-break:break-all; 
}
table th, table td {
	text-align:center; 
	vertical-align:middle;
}
ol, ul, li {
	list-style: none outside none;
}

a { color:#666;
	text-decoration:none;
	vertical-align: top; 
}
/* a:hover, a:visited {
	text-decoration:underline;
} */
img { 
	width: 100%; 
	border: 0 none; 
	vertical-align: top;
}
hr {
	display: none;
}
form input, form select, form label, form img {
	vertical-align: middle;
}
fieldset {
	border: 0 none;
}
em, address {
	font-style: normal;
}
iframe {
	margin: 0; 
	padding: 0;
}
legend, .blind {
	visibility:hidden;
	position:absolute;
	left:-99999em;
	width:1px;
	height:1px;
	text-indent:-9999em;
	font-size:0;
	top:-9999em;
	overflow:hidden;
}
caption {
	width:0; 
	height:0; 
	font-size:0; 
	line-height:0; 
	overflow:hidden; 
	visibility:hidden;
	line-height:0;
}
/* 
option {
	height:30px; 
	font-size:13px;
	color:#666;
	letter-spacing:-0.5px;
}
*/
button {
	padding:0;
	margin:0;
	background:none;
	border:0;
	border-radius:0;
	cursor:pointer;
}
button::-moz-focus-inner {
	border:0; 
	padding:0;
}
button::-ms-focus-inner {
	border:0; 
	padding:0;
}

/* COMMON */
#wrapper {
  overflow-x: hidden;
  position: relative;
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
}

/*공통*/
#container {
  padding: 0 0;
  position: relative;
  z-index: 1;
  top:0;
}

/*
.visual_box {
  width: 1760px;
  height: 860px;
  margin: 0 auto;
}
*/


/* 메인 개선*/
.main_cont {
  margin: 0 16px;
}
.visual.main-new-visual{
  position:relative; 
}
/*  height: 572px;*/
.visual-inner {
  max-width: 640px;
  margin: 0 auto;
  position: relative;
}
.visual-inner .swiper-wrapper {
  z-index: 1;
}

/* height:572px;*/
.visual .swiper-slide{
  background-repeat:no-repeat;background-position:0 0;background-size:cover;width: 100%;
  background-size: 100% 572px;
}
/*.visual .swiper-slide{height:572px;margin-left:0px;} */
.visual .slide_inr {max-width: 100%;  position: relative; width:100%;}/*height:572px;*/
.visual .slide_inr .img {
  position: relative;
  z-index: 1;
}
.swiper-slide-active .slide_inr .img img {
  transform:scale(1.05);
	transition: transform 5s 1s;
}
.visual .slide-txt{position:absolute;top:50%;left:16px;font-size:40px;font-weight: normal;color:#fff;transform:translateY(-50%); z-index: 2;}
.visual .slide-txt strong{display:block;margin:20px 0 60px;font-size:70px;font-weight:bold;color:#fff; line-height: 1.23;}
.visual .slide-txt .view-more, .visual .swiper-new-top .slide-txt .view-whitepaper{color:#fff;font-size:20px; padding: 20px 32px;  border:1px solid #fff; display: inline-block; font-weight: normal;}
.visual .slide-txt .view-whitepaper:after {margin-top: -5px;}
/* 운영 기존 초기값 초기화 */
.visual.main-new-visual .swiper-pagination-bullet::before {
  display: none;
}
/* // 운영 기존 초기값 초기화 */
.visual.main-new-visual .swiper-container-horizontal>.swiper-pagination-bullets, .visual.main-new-visual .swiper-pagination-custom, .visual.main-new-visual .swiper-pagination-fraction {text-align: center;width: 100%;}
.visual.main-new-visual .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { margin :0; margin-right: 16px;}
.visual.main-new-visual .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet:last-child {margin-right: 0;}
.visual.main-new-visual .swiper-pagination-bullet { position: relative;width: 336px;height: auto; text-align: left;border-radius: 20px;opacity: 1;margin-right: 20px;background-color: transparent;}

.visual.main-new-visual .swiper-pagination-bullet em {font-size: 15px; line-height: 28px;	font-weight: bold;	letter-spacing: -0.38px; color: #fff;}
.visual.main-new-visual .swiper-pagination-bullet i { position: absolute;bottom: 0;left: 0; z-index: 1; width: 100%;height: 3px; background-color: #fff;opacity: 0.2; display: block;}
.visual.main-new-visual .swiper-pagination-bullet b { position: absolute; bottom: 0; left: 0; z-index: 2; width: 0%; height: 3px;background-color: #fff;}
.visual.main-new-visual .swiper-pagination-bullet-active { background-color: transparent;}
.visual.main-new-visual .swiper-pagination-bullet-active b {  
    animation-name: swBar; animation-duration: 5s;animation-timing-function: ease-in;animation-iteration-count: 1;animation-direction: alternate; animation-fill-mode:forwards;
}

.control-area {position: absolute; display: flex;   position: absolute;  bottom:60px; left:16px;  z-index: 11;  height: 2px; justify-content: center; width: calc(100% - 32px); }/*left:90px;*/
.control-area .sw-pagination { display: flex; justify-content: center; align-items: center;  width: 100%; gap: 0 6px;}
.visual.main-new-visual .swiper-pagination-bullet {background: #fff;opacity: 0.3; height: 3px; }

@keyframes swBar {
    0% {width: 0;}
    100% {width:100%;}
}

/*테스트*/
.main-visual-container {
  margin: 0 auto;
  overflow: hidden;
  border-radius: 30px;
}
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin :0;
    margin-right: 20px;
}
.main-visual-container .swiper-pagination-bullet::before {
  display: none;
}
.main-visual-container .swiper-pagination-bullet {
    position: relative;
    width: 33.333%;
    height: 2px      ;
    text-align: left;
    border-radius: 0px;
    opacity: 1;
    margin-right: 0px;
    background-color: transparent;

    em {

        color: #111;
    }
    i {
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 1;
        width: 100%;
        height: 3px;
        background-color: rgba(255, 255, 255, .3);
    }
    b {
        position: absolute;
        bottom: 0;
        left:  0;
        z-index: 2;
        width: 0%;
        height: 3px;
        background-color: rgba(255, 255, 255, 1);
    }
}
.visual .swiper-pagination-bullet-active {
    background-color: transparent;
    b {  
        animation-name: countingBar;
        animation-duration: 5s;
        animation-timing-function: ease-in;
        animation-iteration-count: 1;
        animation-direction: alternate ;
        animation-fill-mode:forwards;
    }
}


@keyframes countingBar {
    0% {width: 0;}
    100% {width:100%;}
}



.slide-content {
  position: absolute;
  bottom: 60px;
  left: 5%;
  transform: translateY(-50%);
  color: #fff;
  z-index: 10;
}
.slide-content h2 {
  font-family:'SangSangTitleB', sans-serif;
  font-size: 38px;
  font-style: normal;
  font-weight: 400;
  line-height: 140%;
  margin-bottom: 16px;
}
.slide-content p {
  font-size: 16px;
  font-weight: 600;
  line-height: 140%;
  color: #fff;
}

.slide-content h2,
.slide-content p {
  opacity: 0;
  transform: translateY(100%);
  transition: opacity 1s ease, transform 1s ease;
}

.swiper-slide-active .slide-content h2,
.swiper-slide-active .slide-content p {
  opacity: 1;
  transform: translateY(0);
}

.swiper-slide-active .slide-content p {
  transition-delay: 0.3s;
}

/*컨텐츠 1440px*/
.contbox-ty1 {
  width: 100%;
  margin: 0 auto;
  font-family:'SangSangTitleM', sans-serif;
  position: relative;
}
.contbox-ty1 .tr {
  position: relative;
}
.cont_ty {
  padding: 64px 0;
}
.cont_ty1 {
  padding: 64px 0 60px 0;
}
.cont_ty2 {
  padding: 100px 0;
}
/*font-family:'SangSangTitleM', sans-serif;*/

/*재단사무처*/
.title-ty1 {
  display: flex;
  flex-direction: column;
}
.title-ty1-mb {
  margin-bottom: 40px;
}
.title-ty-mb {
  margin-bottom: 26px;
}
/*font-family: "KT&G SangSangTitle", sans-serif;
font-family:'SangSangBodyM', sans-serif;
*/
.title-ty1 p {
  font-size: 16px;
  font-weight: 400;
  line-height: 100%;
  font-family:'SangSangTitleB', sans-serif;
}
.title-ty1 p.color-id-ty1 {
  color: #1CA8E0;
}
.title-ty1 p.color-id-ty2 {
  color: #F7941D;
}
.title-ty1 p.color-id-ty3 {
  color: #8FC940;
}
.title-ty1 p.color-id-ty4 {
  color: #F25D22;
}

.title-ty1 h3 {
  color: #000;
  font-size: 26px;
  font-weight: 400;
  line-height: 140%; 
  letter-spacing: -2px;
  font-family:'SangSangTitleB', sans-serif;
  margin-top: 8px;
}

/*margin-top: 80px;*/
.ulbox-ty1 {
  display: flex;
  flex-direction: column;
  gap: 8px;
  
}
.ulbox-ty1 .li {
  width: 100%;
  /*height: 80px;*/
}
.ulbox-ty1 .li > a {
  display: block;
  border-radius: 16px;
  border: 1px solid #D9D9D9;
  background: #fff;
  padding: 0 0px;
  position: relative;
}
/*
.ulbox-ty1 .li > a:hover {
  border: 1px solid #1CA8E0;
  background: #1CA8E0;
}
.ulbox-ty1 .li > a:hover .text-wrap .txt-box .tit-1 {
  color: #fff;
}
.ulbox-ty1 .li > a:hover .text-wrap .txt-box .txt-1 {
  color: #fff;
}
*/

.ulbox-ty1 .li > a .text-wrap {
  display: flex;
  align-items: center;
  width: 100%;
  height: 80px;
  padding: 0 16px;
  overflow: hidden;
  border-radius: 16px;
}
.ulbox-ty1 .li > a .text-wrap .txt-box {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 10px;
  position: relative;
  z-index: 2;
}
.ulbox-ty1 .li > a .text-wrap .txt-box .tit-1 {
  color: #222;
  font-size: 18px;
  font-weight: 600;
  line-height: 100%;
}
.ulbox-ty1 .li > a .text-wrap .txt-box .txt-1 {
  color: #444;
  font-size: 16px;
  font-family:'SangSangBodyL', sans-serif;
  font-weight: 400;
  line-height: 100%;
  letter-spacing: -0.4px;
}
.ulbox-ty1 .li > a .text-wrap .btn-a span {
  position: relative;
  z-index: 2;
}
.ulbox-ty1 .li > a .text-wrap .btn-bg-a {
  position: absolute;
  bottom: 0;
  right:46px;
  z-index: 1;
  width: 88px;
  height: 80px;
}

.ulbox-ty1 .li.n2 > a .text-wrap .btn-bg-a {
  overflow: hidden;
}



/*자원봉사센터(&터)*/
/*background-color: #F8F7F5;
background: #D9D9D9;
*/
.contbox-full-gray-ty1 {
  background-color: #F8F7F5;
  margin: 0 -16px;
  padding: 0 16px;
}

.sec2 {
  padding: 150px 0;
}

.flex-cont {
  display: flex;
  flex-direction: column;
  gap: 60px;
}

.flex-cont-ty2 {
  display: flex;
  flex-direction: column;
  gap: 100px;
}
.flex-cont-ty3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  /*height: 360px;*/
  position: relative;
  z-index: 3;
  padding: 48px 0;
}
@media screen and (max-width: 370px){
  .flex-cont-ty3 {padding: 38px 0;}
}
.flex-ty1 {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.flex-ty1 .box-1 {
  width: 100%;
}

.title-ty2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
  font-family: 'Pretendard', sans-serif;
}
.title-ty2 h4 {
  color: #222;
  font-size: 18px;
  font-weight: 600;
  line-height: 100%;
}
.title-ty2 .btn-alink {
  display: flex;
  align-items: center;
  gap: 10px;
  
}
.title-ty2 .btn-alink span {
  color: #222;
  font-size: 13px;
  font-weight: 400;
  line-height: 100%;

}
.title-ty2 .btn-alink img {
  width: 14px;
}

/*프로그램 신청*/
.list-ty1 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.list-ty1 li {
  width: calc(50% - 8px);
  height: 160px;
}
.list-ty1 li a {
  display: block;
  border-radius: 16px;
  border: 1px solid #D9D9D9;
  background: #FFF;
  color: #222;
  height: 160px;
  display: flex;
  flex-direction: column;
  align-items: self-start;
  gap: 16px;
  padding: 0 16px 16px 16px;
  font-family: 'Pretendard', sans-serif;
  
}
/*
.list-ty1 li a:hover {
  background: #F7941D;
}
.list-ty1 li a:hover span {
  color: #F7941D;
  background-color: #fff;
}
.list-ty1 li a:hover span.off {
  background-color: #fff;
}

.list-ty1 li a:hover p {
  color: #fff;
}
*/

.list-ty1 li a > span {
  display: inline-flex;
  padding: 6px 10px;
  justify-content: center;
  align-items: center;
  border-radius: 99px;
  background: #F7941D;

  color: #FFF;
  font-size: 12px;
  font-weight: 600;
  line-height: 100%;

  margin-top: 16px;
}
.list-ty1 li a > span.off {
  background: #7B7B7B;
}
.list-ty1 li a p {
  color: #222;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%; 
  letter-spacing: -0.28px;

  overflow : hidden;   
  text-overflow: ellipsis;    
  display: -webkit-box;    
  -webkit-line-clamp: 4;    
  -webkit-box-orient: vertical;
}

/*협력동아리*/
.club-box {
  width: 100%;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
}
.club-box img {
  position: relative;
  z-index: 1;
}
.club-box .text-box {
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  color: #FFF;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
/*font-family:'SangSangBodyL', sans-serif;*/
.club-box .text-box p {
  text-align: center;
  font-family: "Pretendard", sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 130%;
  letter-spacing: -0.6px;
  text-transform: uppercase;
  width: 363px;
}
.club-box .text-box a {
  font-family: 'Pretendard', sans-serif;
  color: #FFF;
  font-size: 14px;
  font-weight: 500;
  line-height: normal;

  display: inline-flex;
  padding: 12px 24px;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
  border: 1px solid #FFF;
  /*backdrop-filter: blur(15px);*/
  text-align: center;
  
  margin: 0 auto;
}

.sns-wrap {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.ul-sns {
  display: flex;
  width: 100%;
  padding: 16px 0px;
  align-items: center;
  gap: 24px;
  flex-shrink: 0;
  justify-content: space-between;
  border-top: 1px solid #D9D9D9;
  border-bottom: 1px solid #D9D9D9;
}
.ul-sns .sns-title {
  color: #222;
  font-family: 'Pretendard', sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 100%; 
}
/*flex: 1;*/
.ul-sns .sns-icon-box {
}
.ul-sns ul li > a {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;

  color: #222;
  font-family: 'Pretendard', sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 100%; 
  width: 40px;
  margin: 0 auto;
}
.sns-list {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex: 1 0 0;
  gap: 20px;
}
.sns-list li {
  display: flex;
  align-items: center;
}

.youtube-wrap {
  display: flex;
  justify-content: space-between;
}
.youtube-wrap .n1 {
  flex: 1;
  height: 417px;
}
.youtube-wrap .n2 {
  margin-left: 114px;
  width: 219px;
  height: 417px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 36px;
  font-family: 'Pretendard', sans-serif;
}
.youtube-wrap .n2 .t1 {
  color: #222;
  font-size: 36px;
  font-weight: 600;
  line-height: 100%; 
}
.youtube-wrap .n2 a {
  color: #222;
  font-size: 16px;
  font-weight: 500;
  line-height: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
}



/*&터 활동 스토리*/
.contbox-full-gray-ty2 {
  background: #EFECE5;
}


/* 레이아웃 */
.youtube-layout {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0px;
}

.youtube-play-box {
  width: 981px;
}

/*&터 활동 스토리*/
.main-swiper {
  width: 100% ;
  overflow: hidden;
}
.main-swiper .youtube-inner {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
  overflow: hidden;
  border-radius: 30px;
}
.main-swiper .youtube-inner iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none; /* 기본적으로 터치 막기 */
}
.youtube-inner.playing iframe {
  pointer-events: auto; /* 재생 버튼 누른 경우만 허용 */
}
.main-swiper .swiper-pagination {
  position: static;
  width: 100%;
  margin-top: 8px;
  height: 8px;
  line-height: normal;
}

.main-swiper .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  background-color: #D9D9D9;
  opacity: 1;
  border-radius: 50%;
}

.main-swiper.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  margin-right: 8px;
  position: relative;
  overflow: hidden;
}
.main-swiper .swiper-pagination-bullet::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.main-swiper .swiper-pagination-bullet-active::before {
  width: 8px;
  height: 8px;
  background-color: #F7941D;
  animation: none;
}

.main-swiper img {
  width: 100%;
  border-radius: 8px;
  cursor: pointer;
}

/*작은 썸네일*/
.thumbs-wrap {
  flex: 1;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  overflow: hidden;
}
.thumbs-wrap .swiper-container-vertical>.swiper-wrapper {
  justify-content: space-between;
  align-items: flex-start;
  align-self: stretch;
  height: 417px;
}
.thumbs-wrap .thumbs-swiper {
  width: 219px;
  height: 417px;
}
.thumbs-wrap .thumbs-swiper .swiper-wrapper .swiper-slide {
  height: 123px;
}
.thumbs-wrap .thumbs-swiper img {
  max-width: 100%;
  height: 123px;
  border-radius: 8px;
  cursor: pointer;
}

.thumb-title {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  
  font-family: 'Pretendard', sans-serif;
  width: 100%;
}
.thumb-title > div {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.thumb-title h3 {
  color: #222;
  font-size: 18px;
  font-weight: 600;
  line-height: 100%;
}
.more-btn {
  color: #222;
  font-size: 13px;
  font-weight: 400;
  line-height: 100%;
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: 'Pretendard', sans-serif;
}
.more-btn img {
  max-width: 100%;
  width: 14px;
}
.img-abs-right {
  position: absolute;
  bottom: 0;
  right: 0px;
}

.img-welfare {
  position: absolute;
  bottom: 0;
}
.img-welfare.--left {
  width: 108px;
  height: 66px;
  left: 0px;
}
.img-welfare.--right {
  width: 64px;
  height: 66px;
  right: 0px;
}
/* 팝업 스타일 */
.video-popup {
  display: none;
  position: fixed;
  z-index: 9999;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.7);
}

.popup-content {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 80%; max-width: 800px;
}

.popup-content iframe {
  width: 100%;
  height: 450px;
  border-radius: 8px;
}

.popup-close {
  position: absolute;
  right: -20px;
  top: -20px;
  font-size: 30px;
  color: white;
  cursor: pointer;
}


/*메인 영상 팝업*/
.layer_box {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  font-size: 0;
  line-height: 0;
  white-space: nowrap;
  text-align: center;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  /*background-color: #00000080;*/
  transition: opacity .35s linear;
  z-index:100;
  
}
.layer_box::after {
  content: '';
  clear: both;
  display: block;
  position: absolute;
  left:0; top:0; right:0; bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background: #000;
  opacity: 0.5;
}
/*display: block; position:absolute;left:50%; top: 86px;margin-left:-426px;*/

.video_pop_inner {
  width:320px;/*height:630px;*/border:solid 2px #000;background:#000;box-shadow:#555 3px 3px 10px 0px;
  position:absolute;left:50%; top: 86px; transform: translateX(-50%); z-index: 2;
}
.video_pop_inner .frame {
  width: 320px;
  /*height: 480px;*/
}
.video_pop_inner .btn_close_videopop{position:absolute;display:block;top:0;right:-37px;width:35px;height:35px;text-indent:-9999px;background:url('../images/main-renewal/button_close_video.gif') 0 0 no-repeat;}
.video_pop_inner .video_text{overflow:auto;width:853px;height:150px;margin-top:-2px;background-color:#182225}
.video_pop_inner .video_text div {margin:20px;}
.video_pop_inner .video_text div p{padding:5px 0;font-size:13px;line-height:1.8em;color:#aaa; text-align: left;}



.video_pop_box {z-index:100;display:none;position:fixed;left:50%;width:853px;height:630px;margin-left:-426px;border:solid 2px #000;background:#000;box-shadow:#555 3px 3px 10px 0px}
.video_pop_box .btn_close_videopop{position:absolute;display:block;top:0;right:-37px;width:35px;height:35px;text-indent:-9999px;background:url('/rs/images/main/btn_close_video.gif') 0 0 no-repeat;}
.video_pop_box .video_text{overflow:auto;width:853px;height:150px;margin-top:-2px;background-color:#182225}
.video_pop_box .video_text div {margin:20px;}
.video_pop_box .video_text div p{padding:5px 0;font-size:13px;line-height:1.8em;color:#aaa}

.black_opacity_new {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 99;
  width: 100%;
  background: #000;
  opacity: 0.5;
  top: 92.5px;
}
.black_opacity_new {
    z-index: 98;
}

/*지역별복지센터*/
.contbox-full-green-ty1 {
  margin: 0 -16px;
  background: #EFF8E5 url('../img/main/bg-pattern-green.png') no-repeat 0 0;
  background-size: cover;
}
.contbox-full-green-ty1 .cont_ty1 {
  width: auto;
  padding: 64px 16px 60px 16px;
}
.welfare-center-list {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.welfare-center-list a {
  display: flex;
  width: 160px;
  height: 160px;
  padding: 0px;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  flex-shrink: 0;
  aspect-ratio: 1/1;
  font-family: 'Pretendard', sans-serif;
  color: #fff;
  border-radius: 999px;
  border: 1px solid #D9D9D9;
  background: #FFF;
}
.welfare-center-list a.n1 {
  background: rgba(143,201,64,1);
}
.welfare-center-list a.n2 {
  border: 2px solid #8fc940;
  color: #8fc940;
}
.welfare-center-list a h4 {
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  line-height: 130%;
}
.welfare-center-list a span {
  width: 24px;
  display: block;
  margin: 16px auto 0 auto;
}
.welfare-center-list a p {
  font-size: 18px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.36px;
}

/*
.welfare-center-list a:hover {
  border-radius: 999px;
  background: #8FC940;
  color: #fff;
}
.welfare-center-list a:hover h4, .welfare-center-list a:hover p {
  color: #fff;
}
*/


/*후원*/
/*#D9D9D9*/
.contbox-full-gray-ty3 {
  position: relative;
  /*height: 353px;*/
  /*background: url('../img/main/img-bg-boost.png') lightgray -2.655px -65.946px / 100.043% 117.954% no-repeat;*/
  overflow: hidden;
  z-index: 1;
  margin: 0 -16px;
}
.contbox-full-gray-ty3::before {
  content: '';
  clear: both;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0.63;
  background: #2B251F;
  position: absolute;
  top:0;
  left:0;
  z-index: 1;
}
.contbox-full-gray-ty3 .bg-box {
  position: absolute;
  top:0; left:0;
  width: 100%;
  height: 100%;
  /*background: url('../images/mobile/img/main/img-bg-boost.png') lightgray -2.655px -65.946px / 100.043% 117.954% no-repeat;*/
  background-position: center center;
  z-index: 0;
}
.contbox-full-gray-ty3 .bg-box img {
  object-fit: contain;
}
.title-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: #FFF;
}
.title-box span {
  font-family:'SangSangTitleB';
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 100%;
}
.title-box p {
  color: #FFF;
  font-family: "Pretendard", sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 140%; 
}
.btn-wrap {
  display: flex;
  gap: 8px;
  opacity: 1;
}
.btn-wrap a {
  display: flex;
  padding: 12px 24px;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  color: #FFF;

  font-family: 'Pretendard', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: normal;
  border-radius: 99px;
  border: 1px solid #FFF;
  min-width: 136px;
}

.flex-ty2 {
  display: flex;
  justify-content: space-between;
  /*align-items: center;*/
  /*align-items: flex-end;*/
}
.flex-ty2 div {
  flex: none;
}
.flex-ty2 div .more-btn {
  margin-top: 36px;
}
/*알림센터*/
.id {
  color: #F25D22;
}


.notice-list {
  width: 100%;
  border-collapse: collapse;
  border-top: 2px solid #222;
  font-family: 'Pretendard', sans-serif;
}
.notice-item {
  display: flex;
  /*justify-content: space-between;*/
  align-items: center;
  padding: 16px 16px;
  border-bottom: 1px solid #9F9F9F;
  /*개발 태그 누락 수정*/
  cursor: pointer;
  position: relative;
  /*min-height: 42px;*/
}
.notice-item.pinned {
  background: rgba(255, 185, 147, 0.05);
}
.notice-item .pin-icon {
  margin-left: auto;
}
.notice-item .news_date_box {
  display: flex;
  flex-direction: column; 
  gap: 6px; /* 날짜랑 제목 간격 */
  flex: 1; /* 아이콘 안 밀리게 남은 공간 차지 */
  min-width: 0; /* 중요: flex 자식 말줄임 허용 */
  /*개발 태그 누락 수정*/
  position: relative;
}
/*개발 태그 누락 수정*/
.notice-list .notice-item .news_date_box .notice-title {
  height: auto;
}
.notice-item .news_date_box  .notice-date {
  position: relative;
  top: 0;
}
/* //개발 태그 누락 수정*/
.notice-item .notice-date {
  width: 100px;
  flex-shrink: 0;
  font-size: 12px;
  color: #222;
  font-weight: 400;
  line-height: 130%;
  margin-right: 0px;
  /*개발 태그 누락 수정*/
  position: absolute;
  top:16px;
}
.notice-item:not(.pinned) .notice-date {
  color: #666;
}
.notice-list .notice-title {
  flex: 1;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  color: #222;
  min-width: 0; /* 중요: flex 내부 말줄임 활성화 */
  /*
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  */
  /*개발 태그 누락 수정 - pc 태그 그대로 사용 height: 42px;*/
  padding-top: 20px;
  height: 36px;
  display: flex;
  align-items: flex-end;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.notice-list .notice-title span {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.notice-list .notice-item:not(.pinned) .notice-title {
  color: #444;
  font-weight: 500;
}
.pin-icon {
  width: 24px;
  height: 24px;
}
.pin-icon img {
  width: 24px;
  height: 24px;
}

.btn-faq-qna-box {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 24px;
  margin-top: 24px;
}
.btn-faq-qna-box a {
  display: flex;
  padding: 12px 40px;
  justify-content: center;
  align-items: center;
  flex: 1 0 0;
  border-radius: 8px;
  border: 1px solid #F25D22;

  color: #F25D22;
  text-align: center;
  font-family: 'Pretendard', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 130%;
}
.btn-faq-qna-box a.n1 {
  background: #F25D22;
  color: #fff;
}
.btn-faq-qna-box a.n1 {
  border: 1.5px solid #F25D22;
}
/*
.btn-faq-qna-box a:hover {
  background: #F25D22;
  color: #fff;
}
*/
/* 기존 중복으로 인한 재수성 */
.section.section_visual {}
.section .swiper-container.main_slider {
  margin: 0 auto;
  overflow: hidden;
  border-radius: 30px;
}

.section.section_visual .swiper-pagination-bullet {
  width: 25%;
  height: 3px;
  border-radius: 0px;
  /*background-color: rgba(255, 255, 255, .5);*/
  /*
  background: transparent;
  background-color: rgba(255, 255, 255, .1);
  */
}
.section.section_visual .swiper-pagination-bullet::before {
  background-color: rgba(255, 255, 255, .5);
  height: 3px;
}
.section.section_visual .swiper-pagination-bullet-active {
  background-color: rgba(255, 255, 255, .1);
}
.section.section_visual .swiper-pagination-bullet-active::before {
  opacity: 1;background-color: rgba(255, 255, 255, 1);
  /*background-color: rgba(255, 255, 255, 1);*/
  animation-name: countingBar;
  animation-duration: 5s;
  animation-timing-function: ease-in;
  animation-iteration-count: 1;
  animation-direction: alternate ;
  animation-fill-mode:forwards;
}
.section.section_visual .pagination_container {
  padding: 0 0px;
  margin: 0 0px;
  /*width: calc(100% - 20px);*/
  width: 88%;
}
.section.section_visual .pagination_container .swiper-pagination{
  display: flex;
  align-items: center;
  width: 100%;
  /*width: calc(100% - 20px);*/
}
@keyframes countingBar {
  0% {width: 0;}
  100% {width:100%;}
}