@charset "utf-8";


/* 공통 레이아웃 */
.is-fix {position: fixed; inset:0; width:calc(100vw - var(--scroll-w));}
html { scroll-behavior: auto; scroll-padding-top: 60px; }
html::before {content: ''; position: fixed; inset: 0; pointer-events: none; background-color: #000; z-index: 9999; animation: fadeOut .8s ease-in both;}
.body-main,
.body-sub{background:url('../../images/achv/body_bg.png') no-repeat top center;}
.wrap { background: url('../../images/achv/body_bottom_bg01.png') no-repeat center calc(100% - var(--footer-h) + 10px) / contain; overflow: hidden;}
.wrap .inner { width:100%; max-width:1400px; margin:0 auto; box-sizing:border-box;}
.wrap .inner .contents { padding:40px 0 70px 0; }
/*.top_btn { position: fixed; bottom: 40px; right: 40px; background: #3549ff url('../../images/achv/top.png') no-repeat center 12px; width:60px; height: 60px; display: block; border-radius: 100px; font-family: 'BMDOHYEON'; text-align: center; line-height: 70px; }*/


/* header */
header { padding:30px 0; display: flex; justify-content: space-between; align-items: center;}
header .logo { display: flex; align-items: center; gap:10px;}
header .logo a {display: block; font-size: 0;}
header .logo .nth-1 {max-width: 54px;}
header .logo .nth-2 {max-width: 159px; margin-top:-20px; }/* pointer-events: none; */
header .main_menu ul { display: flex; gap:80px;}
header .main_menu ul li a { display: flex; gap:50px; font-family: 'BMDOHYEON'; font-size: 21px;}
header .main_menu ul li a:hover { color: #5a99ff; text-decoration: underline; text-underline-offset: 0.3em;}
header .top_sns ul { display: flex; gap:6px;}
header .top_sns ul li a { display: block; border-radius: 100px; width:38px; height: 38px; background: no-repeat center / contain;}
header .top_sns ul li a span { position: absolute; z-index: -100; text-indent: -99999px; }
header .top_sns ul li:nth-child(1) a {background-image:url('../../images/achv/sns_icon0.png');}
header .top_sns ul li:nth-child(2) a { background-image:url('../../images/achv/sns_icon1.png'); }
header .top_sns ul li:nth-child(3) a { background-image:url('../../images/achv/sns_icon2.png'); }
header .top_sns ul li:nth-child(4) a { background-image:url('../../images/achv/sns_icon3.png'); }
header .top_sns ul li:nth-child(5) a { background-image:url('../../images/achv/sns_icon4.png'); }
header .top_sns ul li:nth-child(6) a { background-image:url('../../images/achv/sns_icon5.png'); }
header .top_sns ul li:nth-child(7) a { background-image:url('../../images/achv/sns_icon6.png'); }
header .top_sns ul li:nth-child(8) a { background-image:url('../../images/achv/sns_icon7.png'); }
header .top_sns ul li a:hover { animation: jump-once 0.3s ease; }
@keyframes jump-once { 0% { transform: translateY(0); } 50% { transform: translateY(-5px); } 100% { transform: translateY(0); } }








/* 메인 비주얼 */
.main_visual { text-align:center; padding: 0 0 100px 0;} 

.main_visual .main_txt { margin:0 0 60px 0;}
.main_visual .main_txt strong { font-family: 'BMDOHYEON'; vertical-align: middle;}
.main_visual .main_txt strong em { background: linear-gradient(to right, #0ee0ff, #7482ff); -webkit-background-clip: text; background-clip: text;  color: transparent; display: inline-block; }
.main_visual .main_txt {font-weight: 700;}
.main_visual .main_txt .color1 {color:#0ee0ff;}
.main_visual .main_txt .color2 {color:#a1aaff;}



.main_visual .main_txt-wrap {display: inline-block; position: relative; --leaf-w : 90px; padding:0 calc(var(--leaf-w) + 20px);}
.main_visual .main_txt-wrap::before,
.main_visual .main_txt-wrap::after {content:''; display: inline-block; width:var(--leaf-w); height:100%; position: absolute; background:url('../../images/achv/ico_leaf.png') no-repeat center bottom / contain; animation: fadeIn 0.8s linear 1.5s both;}
.main_visual .main_txt-wrap::before {left:0; top:-20px;}
.main_visual .main_txt-wrap::after {right:0; top:-20px; transform: rotateY(180deg);}

.main_visual .main_txt-wrap > .nth-1 {margin-bottom:15px; display: flex; justify-content: center;}
.main_visual .main_txt-wrap > .nth-1 .nth-1{animation: fadeInLeft 1s ease-in-out 0.5s both; display: inline-block;}
.main_visual .main_txt-wrap > .nth-1 .nth-2{animation: fadeInRight 1s ease-in-out 0.5s both; display: inline-block;}
.main_visual .main_txt-wrap > .nth-2{animation: fadeInUp 1s ease-in-out 0.7s both; margin-top:-30px;}
.main_visual .main_txt-wrap > .nth-2::before,
.main_visual .main_txt-wrap > .nth-2::after {content:''; display: block; width:116px; height:116px; position: absolute; background: url('../../images/achv/ico_light.png') no-repeat center / contain;}

.main_visual .main_txt-wrap > .nth-2::before {bottom:20px; left:10px; animation: circleBg 10s linear infinite;}
.main_visual .main_txt-wrap > .nth-2::after {top:20px; right:10px; animation: circleBg-1 10s linear 0.5s infinite;}

.mo {display: none !important;}

@keyframes circleBg{
	0%{opacity: 1; transform:translate(-50%, 50%) rotate(0);}
	25%{opacity: 1;}
	30%{opacity: 0; }
	35%{opacity: 1;}
	40%{opacity: 0; }
	45%{opacity: 1;}
	100%{transform:translate(-50%, 50%) rotate(360deg);}
}
@keyframes circleBg-1{
	0%{opacity: 1; transform:translate(50%, -50%) rotate(0);}
	25%{opacity: 1;}
	30%{opacity: 0; }
	35%{opacity: 1;}
	40%{opacity: 0; }
	45%{opacity: 1;}
	100%{transform:translate(50%, -50%) rotate(360deg);}
}

.main_visual .board-container { display: grid;  grid-template-columns: repeat(7, 1fr);  grid-template-rows: repeat(6, 1fr);  width: 100%;  aspect-ratio: 7 / 6; gap:0px;}

.board-container .cell {position: relative; display: flex;  align-items: center;  justify-content: center;  box-sizing: border-box; opacity: 0; transform: translateY(20px); animation: cardfadeUp 0.3s ease forwards; animation-delay: var(--delay); aspect-ratio: 1 / 1;}
@keyframes cardfadeUp {
	to {opacity: 1; transform: translateY(0);}
}


.board-container .cell-inner {position: relative; width: 100%; height: 100%; transition: transform 0.6s; transform-style: preserve-3d; }
.board-container .cell-inner button {line-height: 1; font-size:0; background: transparent;}
.board-container .cell-front,
.board-container .cell-back { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; border-radius: 10px; overflow: hidden; border: 3px solid #fff;}
.board-container .cell-back {border-color:#0ee0ff; background-color: #040c21; /* background: linear-gradient(#00041c, #00041c) padding-box, linear-gradient(to bottom, #ffffff, #00e1ff) border-box;*/}

.board-container .cell.special .cell-front,
.board-container .cell.special .cell-back {border-color:#0ee0ff;}

.board-container .cell-front img,
.board-container .cell-back img {aspect-ratio: 1 / 1 ; object-fit: cover;}



.board-container .cell-front {animation: cardflip 0.5s ease forwards; animation-delay: var(--delay);}


@keyframes cardflip {
	0%{transform: rotateY(180deg);}
	100%{transform: rotateY(0deg);}
}

.board-container .cell-back {transform: rotateY(180deg); backface-visibility: hidden;}
.board-container .cell:hover {cursor: pointer;}
.board-container .cell:hover .cell-inner,
.board-container .cell:not(.special).is-on .cell-inner { transform: rotateY(180deg);}
.board-container .cell.special:hover {cursor: default;}
.board-container .cell.special:hover .cell-inner { transform: rotateY(0);}


/*버튼 수정 20260602 */
.board-container .cell-back .in-con {font-family: 'BMDOHYEON'; padding:10px; min-width: 0; display: flex; flex-direction: column; gap:5px 5px;}
.board-container .cell-back .in-con .hash {font-size:22px; margin-bottom:10px; overflow-wrap: break-word;}
.board-container .cell-back .in-con .txt {font-size:17px; line-height: 1.4;}

.board-container .cell-inner .in-con .in-link {display: flex; align-items: center; gap:5px; width:100%; max-width:120px; height:35px; font-family: 'BMDOHYEON'; font-size:15px; color:#fff; letter-spacing: -0.05em; background:transparent; border:2px solid #fff; padding:1px 15px 0; border-radius: 30px; transition: all 0.5s ease-in-out; position: relative; pointer-events: none;}
.board-container .cell-inner .in-con .in-link::before {content:''; display: block; width:18px; height:18px; background: no-repeat center / contain; margin-top:-2px; flex-shrink: 0;}
.board-container .cell-inner .in-con .in-link.nth-1::before {background-image: url('../../images/achv/ico_card01.png');}
.board-container .cell-inner .in-con .in-link.nth-2::before {background-image: url('../../images/achv/ico_card02.png');}
/*버튼 아이콘 추가 20260602 */
.board-container .cell-inner .in-con .in-link.nth-3::before {background-image: url('../../images/achv/ico_card03.png');}
.board-container .cell-inner .in-con .in-link.nth-4::before {background-image: url('../../images/achv/ico_card04.png');}


.board-container .cell-inner .in-con .in-link:hover {background-color: #3549ff; border-color: #0ee0ff;}



.cell.special .in-corner {background-color:#040c21; position: relative; width:100%; height:100%;}
.cell.special .in-corner .in-ani {position: absolute; inset: 0; overflow: hidden;}
.cell.special .in-corner .in-ani .item {position: absolute; width:100%; height:100%;}
.cell.special .in-corner .tit {position: relative; padding-top:70%; font-family: 'BMDOHYEON'; font-size:min(1.8vw, 26px); font-weight: 400; letter-spacing: -0.05em;}
.cell.special .in-corner:hover .tit {animation:ani-tit 2s ease infinite;}


.cell.special .in-corner.nth-1:hover .item.nth-2{animation:ani-1-2 1s linear infinite;}
.cell.special .in-corner.nth-1:hover .item.nth-3{animation:ani-1-3 1.5s linear infinite;}

.cell.special .in-corner.nth-2:hover .item.nth-1{ transform-origin: center bottom; animation:ani-2-1 3s ease-in-out infinite;}
.cell.special .in-corner.nth-3:hover .item.nth-1{animation:ani-3-1 3s ease-in-out infinite;}
.cell.special .in-corner.nth-4:hover .item.nth-1,
.cell.special .in-corner.nth-4:hover .item.nth-2{animation:ani-3-1 3s ease-in-out infinite;}
.cell.special .in-corner.nth-4:hover .item.nth-3{animation:ani-4-3 3s ease-in-out infinite;}
@keyframes ani-tit{
	0%, 100%{transform:translateY(0);}
	30%{transform:translateY(-15px);}
	50%{transform:translateY(0);}
	70%{transform:translateY(-8px);}
}

@keyframes ani-1-2{
	0%{opacity: 1;}
	50%{opacity: 0;}
	100%{opacity: 1;}
}
@keyframes ani-1-3{
	0%{left:0px;}
	20%{left:5%;}
	80%{left:5%;}
	100%{left:0px;}
}


@keyframes ani-2-1{
	0%{transform:rotate(0deg);}
	25%{transform:rotate(-8deg);}
	50%{transform:rotate(8deg);}
	75%{transform:rotate(-8deg);}
	100%{transform:rotate(0deg);}
}

@keyframes ani-3-1{
	0%{left:0; opacity:1;}
	35%{left:-100%; opacity:0;}
	50%{left:-100%; opacity:0;}
	51%{left:100%; opacity:0;}
	80%{left:0; opacity:1;}
	100%{left:0; opacity:1;}
}

@keyframes ani-4-3{
	0%{transform:scale(1);}
	14%{transform:scale(1.2);}
	28%{transform:scale(1);}
	42%{transform:scale(1.2);}
	70%{transform:scale(1);}
}







/*메인비주얼  중앙영역*/
.main_visual .center-content { grid-column: 2 / 7;  grid-row: 2 / 6;  display: flex;  flex-direction: column;  align-items: center;  justify-content: center;  border: none; /* 중앙 영역은 테두리 제거 */ opacity: 0; transition: opacity 1s ease-in-out; position: relative; overflow: hidden;}
.main_visual .center-content.is-active {opacity: 1;}

.main_visual .center-content::before {content:''; display:block; position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:100%; height:100%;  transition: all 1s ease-in-out; opacity: 0;  background:url('../../images/achv/card_center_bg01.png') no-repeat center / cover;}
.main_visual .center-content.is-active::before {transition-delay: 0.5s; opacity: 1;}


.main_visual .center-content .object-bg { position: absolute; inset: 0; transition: opacity 1s ease-in-out 1s; opacity: 0;}
.main_visual .center-content.is-active .object-bg {transition-delay:0.5s; opacity: 1;}
.main_visual .center-content .object-bg::before,
.main_visual .center-content .object-bg::after {content:''; display: none; position: absolute; width:10%; height: 14%; background:no-repeat center / contain; transform: rotate(90deg);}
.main_visual .center-content .object-bg::before {background-image: url('../../images/achv/card_object_01.png'); top:6%; right:5%;}
.main_visual .center-content .object-bg::after {background-image: url('../../images/achv/card_object_02.png'); bottom:6%; left:5%;}

.main_visual .center-content .object-bg .nth-1,
.main_visual .center-content .object-bg .nth-2,
.main_visual .center-content .object-bg .nth-3,
.main_visual .center-content .object-bg .nth-4 {position: absolute;  background:no-repeat center / contain;}
.main_visual .center-content .object-bg .nth-1 {width:28.5%; height:42.2%; background-image: url('../../images/achv/card_obj01.png'); top:-7%; right:1.3%;animation: pulse 3s linear infinite;}

.main_visual .center-content .object-bg .nth-2 {width:21.7%; height:26.8%; background-image: url('../../images/achv/card_obj02-01.png'); bottom:3%; left:2.5%; animation: ani-object 2s ease-in-out infinite;}
.main_visual .center-content .object-bg .nth-3 {width:6.6%; height:7.87%; background-image: url('../../images/achv/card_obj02-02.png'); bottom:10%; left:25%;animation: ani-object 3s ease-in-out infinite;}
.main_visual .center-content.is-active .object-bg .nth-4 {width:23%; height:13.3%; background-image: url('../../images/achv/logo_slogan.png'); top:4%; left:3%; animation: ani-object-4 20s linear 0.8s infinite; opacity: 0;}

@keyframes ani-object {
	0% { transform: translateY(0); }
	50% { transform: translateY(-20px); }
	100% { transform: translateY(0); }
}

@keyframes ani-object-4 {
	0% { transform: translateX(-200%); opacity: 0; }
	3% { transform: translateX(20px); opacity: 1;}
	5% { transform: translateX(0px); opacity: 1;}
	95% { transform: translateX(0); opacity: 1; left:3%;}
	98% { transform: translateX(0); opacity: 1; left:110%;}
	100% { transform: translateX(0); opacity: 0; left:110%;}
}


.main_visual .center-content .center_con {width: 100%;  padding:0 80px;  position: relative; opacity: 0;}
.main_visual .center-content .center_con.is-active {animation:fadeIn 0.5s linear 0.3s both;}

.main_visual .center-content .center_con.nth-0 .nth-1 {position: absolute; bottom:95%; left:12%;  width:19%; }
.main_visual .center-content.is-active .center_con.nth-0 .nth-1{animation:zoomInRight 1s linear 0.2s both;}
.main_visual .center-content.is-active .center_con.nth-0 .nth-2{animation:zoomInDown 1.5s ease both;}


.main_visual .center-content .center_con-inner { max-width: 560px; width:75%; margin:0 auto;}
.main_visual .center-content .center_con .image {border-radius: 20px; overflow: hidden;}

.main_visual .btn-wrap {display: flex; justify-content: center; margin-top:20px;}

.main_visual .pbtn {display: flex; align-items: center; gap:20px; padding:0 20px; height:44px; border-radius: 30px; background-color:rgba(5, 16, 42, 0.8); border:2px solid #fff; font-size:17px; font-weight: 700; color:#fff; transition: all 0.3s ease-in-out;}
.main_visual .pbtn::after {content: ''; display: block; width:19px; height:7px; background: url('../../images/achv/ico_arrow01.png') no-repeat center / contain;}
.main_visual .pbtn:hover {background-color: rgba(90, 153, 255, 1);}



/* 팝업*/
.cardpopup { position:fixed; left:0; top:0; width:100%; height:100%; display: none; align-items: center; justify-content: center; z-index: 999;background-color: rgba(0, 0, 0, 0.5); -webkit-backdrop-filter: blur(0px);backdrop-filter: blur(0px);}
.cardpopup.is-on {display: flex !important;}

.cardpopup .popup_inner { max-height:calc(100vh - 30px); max-height:calc(var(--vh, 1vh) * 100 - 30px); display: flex; flex-direction: column; width: calc(100vw - 30px); max-width:800px; background: url('../../images/achv/tit_bg.png') no-repeat; /*min-height: 360px;*/}
.cardpopup .popup_inner .con_top {flex-shrink: 0;}

.cardpopup .popup_inner .con_top .title { display: flex; justify-content:center ; align-items: center; width:auto; min-width: 130px; height: 54px; font-size: 21px; font-family: 'BMDOHYEON'; color: #fff; font-weight: 400; text-align: left; padding: 0 0 0 20px; background: linear-gradient(120deg, #3549ff 0%, #5420ea 100%); position: relative; border-radius: 20px 0 0 0;}
.cardpopup .popup_inner .con_top .title::after {content:''; display: block; width:60px; height:54px; background: url('../../images/achv/tit_bg01.png') no-repeat left top / contain; position: absolute; top:0; left:calc(100% - 15px); z-index: -1;}


.cardpopup .popup_inner .con_box {width:100%; height: auto; flex-grow: 1; min-height:0; color:#666; display: flex; flex-direction: column; padding:40px 40px 0; background-color: #fff; border-radius: 20px 20px 0 0;}
.cardpopup .popup_inner .scroll_box {overflow-y:auto; flex-grow:1; min-height: 0;} 

.cardpopup .pop-footer {flex-shrink: 0; background-color: #fff; border-radius: 0 0 20px 20px; padding:30px 0 30px;}
.cardpopup .close { display: block; background-color: #3549ff; border-radius: 10px; font-size: 21px; padding:15px 25px; margin:0 auto; }



.cardpopup .board_list .list {display: flex; flex-direction: column; gap: 5px;}
.cardpopup .board_list .link {display: flex; align-items: center; gap:15px; padding:10px; border:1px solid #eaeaea; border-radius: 5px; text-align: left; transition: all 0.3s ease-in-out;}
.cardpopup .board_list .link .cate {flex-shrink: 0; display: flex; align-items: center; justify-content: center; width:80px; height:30px; font-size: 15px; color:#fff;  font-family: 'BMDOHYEON'; background-color: #0073f4; border-radius: 5px; transition: all 0.3s ease-in-out;}
.cardpopup .board_list .link.nth-1 .cate {background-color: #0073f4;}
.cardpopup .board_list .link.nth-2 .cate {background-color: #3e9a43;}
.cardpopup .board_list .link.nth-3 .cate {background-color: #0f908e;}

.cardpopup .board_list .link .tit {flex-grow: 1; font-size:17px; color:#000; font-weight: 400;  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: all 0.3s ease-in-out;}
.cardpopup :focus-visible {outline: 2px dotted #000; outline-offset: -1px;}

.cardpopup .board_list .link:hover {background-color: #0073f4; border-color: #0073f4;}
.cardpopup .board_list .link:hover .cate {background-color: #000;}
.cardpopup .board_list .link:hover .tit {color: #fff;}


.cardpopup .popup_inner .con_box .attachment { margin-top: 20px; background:#05102a url('../../images/achv/download.png') no-repeat center right 15px; padding:10px 35px 10px 15px; border-radius: 10px; width: 100%; text-align: left;}
.cardpopup .popup_inner .con_box .attachment + .attachment {margin-top:10px;}
.cardpopupd .popup_inner .con_box .attachment span { position: relative; padding: 0 0 0 25px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; display: inline-block; width: calc(100% - 50px); }
.cardpopup .popup_inner .con_box .attachment span::before { content: ''; position: absolute; top:3px; left:0; background: url('../../images/achv/clip.png') no-repeat; width:17px; height: 16px; display: block;} 



.cardpopup .board_list .nodata .tit{position: relative; font-family: 'BMDOHYEON'; font-size:26px; color:#3549ff; font-weight: 400; padding:20px 0; margin-bottom:20px;}
.cardpopup .board_list .nodata .tit::before {content:''; display: block; position: absolute; bottom:0; left:50%; transform: translate(-50%, 0); width:30px; height:2px; background-color: #3549ff;}
.cardpopup .board_list .nodata .desc {font-size: 17px; color:#000; line-height: 1.5;}






.main_visual .btn_group { display: flex; gap: 15px; margin-top: 20px; justify-content: center; }
.main_visual .btn_group button { display: block; line-height: 24px; background: linear-gradient(135deg, #3549ff 0%, #4800a7 100%); font-family: 'BMDOHYEON'; font-size: 19px; border-radius: 8px; padding:12px 30px 8px 30px; }
.main_visual .btn_group button:hover { background: linear-gradient(135deg, #1e2fc4 0%, #30006e 100%); }


.main_visual .visual_mobile { display: none; }
.main_visual .visualThumbSwiper .swiper-slide img { border-radius: 10px; }
.main_visual .visual_mobile-inner .btn-wrap {justify-content: center;}

@media screen and (max-width: 1400px) {
	.board-container .cell-back .in-con .hash {font-size:20px;}
	.board-container .cell-back .in-con .txt {font-size:15px;}
}

@media screen and (max-width: 1280px) {
	.board-container .cell-front,
	.board-container .cell-back {border-radius: 15px;}
	
	.board-container .cell-back .in-con .hash {font-size:18px;}
	.board-container .cell-back .in-con .txt {font-size:14px;}
}

@media screen and (max-width: 1024px) {
	.board-container .cell-front,
	.board-container .cell-back {border-radius: 10px; border-width: 2px;}

	.board-container .cell-back .in-con .hash {font-size:15px; margin-bottom:5px;}
	.board-container .cell-back .in-con .txt {font-size:13px; font-family: Pretendard; line-height: 1.2;}

	/*버튼 수정 20260602 */
	.board-container .cell-inner .in-con .in-link {height:30px; font-size:13.5px; border-width: 1px;}
	.board-container .cell-inner .in-con .in-link::before {width:16px; height:16px;}
}
@media screen and (max-width: 960px) {
	.board-container .cell-back .in-con .hash {font-size:13px; margin-bottom:5px;}
	.board-container .cell-back .in-con .txt {font-size:11px; letter-spacing: -0.03em;}

	/*버튼 수정 20260602 */
	.board-container .cell-inner .in-con .in-link {height:28px; font-size:12px; padding:0 10px;}
	.board-container .cell-inner .in-con .in-link::before {width:12px; height:12px;}
}

@media screen and (max-width: 768px) {
	.board-container.mo {aspect-ratio: unset;}
	.board-container.mo .cell,
	.board-container.mo .cell .cell-front{--delay:0 !important;}
	
	.main_visual .board-container.mo .swiper-slide img {border-radius: 0 !important;}
	.main_visual .board-container.mo .center-content {border-radius: 10px; border:2px solid #fff; padding:60px 40px; margin-bottom:30px;}
	.main_visual .board-container.mo .center-content.is-active .nth-0 .nth-2{animation:zoomIn 1s ease both;}
	.main_visual .board-container.mo .center-content.is-active .nth-0 .nth-2 img{width:80%;}
	.main_visual .board-container.mo .thumb-wrap {position: relative;}


	.cardpopup .popup_inner .con_box {padding:20px 20px 0; border-radius: 10px 10px 0 0;}
	.cardpopup .popup_inner { background-size: 160px auto; }
	.cardpopup .pop-footer {border-radius: 0 0 20px 20px; padding:20px 0 20px; border-radius: 0 0 10px 10px;}
	.cardpopup .close { font-size:17px; border-radius: 5px; padding: 10px 20px; }

	.cardpopup .board_list .link .cate {width:70px; height:26px; font-size: 13px; padding-top: 2px;}
	.cardpopup .board_list .link .tit {font-size:15px; }

	.cardpopup .board_list .nodata .tit{font-size:20px; padding:20px 0 15px; margin-bottom:15px;}
	.cardpopup .board_list .nodata .desc {font-size: 15px;}
}
@media screen and (max-width: 640px) {
	.main_visual .pbtn {gap:10px; padding:0 20px; height:36px; font-size:15px;}
	.main_visual .pbtn::after { width:16px; height:6px;}
}




/*임시 확인용 - 실적용시 삭제*/
.center_con::after {content:attr(data-matnum); display: none; align-items: center; justify-content: center; font-size:40px; position: absolute; width:200px; height:50%; top:50%; left:0%; background-color: rgba(0, 0, 0, 0.8); transform: translate(0%, -50%);}
.center_con.nth-0::after {display: none;}





/* 콘텐츠 공통 */
.con_group {  display: flex; gap: 80px; margin-bottom: 80px; flex-wrap: wrap; }
.con_body{ background: url('../../images/achv/tit_bg.png') no-repeat; width:calc(50% - 40px);}
.con_body :focus-visible {outline: 2px dotted #000; outline-offset: -1px;}
.con_top { display: flex; justify-content:space-between; align-items: center; }
.con_top .title { display: flex; justify-content: center; align-items: center; width:178px; height: 54px; font-size: 21px; font-family: 'BMDOHYEON'; color:#fff; text-align: center; padding:0 20px 0 0;}
.con_top .like_count { display: flex; gap: 8px; align-items: center; }
.con_top .like_count button { background: url('../../images/achv/like_icon.png') no-repeat; width: 30px; height: 30px; text-indent: -99999px;  }
.con_top .like_count span { font-size: 21px; font-family: 'verdana'; color:#fff; font-weight: bold; }

.con_box { position: relative; background: #fff; border-radius: 20px; width: 100%; height:calc(100% - 54px);}
.con_box .more_btn { position: absolute; top: 0; right: 0; background-color: #030c21; text-indent: -99999px; width: 60px; height: 60px; border-radius: 0 15px 0 20px;}
.con_box .more_btn::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('../../images/achv/more_icon.png') no-repeat center center; width: 22px; height: 22px;  }
.con_box .more_btn:hover { background: #3549ff; }
.con_top .like_count button:hover { animation: jump-once 0.3s ease; }


/* 슬라이드 공통 */
.swiper { width:100%; }
.swiper img { width:100%; border-radius: 20px; }
.swiper-button-prev { top:calc(50% - 17px) !important; left: 0 !important; color: #fff; background:url('../../images/achv/slider_prev.png') no-repeat; width:30px; height: 80px; }
.swiper-button-next { top:calc(50% - 17px) !important; right: 0 !important; color: #fff;  background:url('../../images/achv/slider_next.png') no-repeat; width:30px; height: 80px; }
.swiper-button-next, .swiper-button-prev {::slotted(svg), svg {height: 30%;object-fit: contain;transform-origin: center;width: 30%;fill: currentColor;pointer-events: none; }}
.swiper-button-next, .swiper-button-prev {&.swiper-button-disabled { cursor: auto; opacity: .5; pointer-events: none; mix-blend-mode: luminosity; }}
.swiper-button-next, .swiper-button-prev span { text-indent: -9999px; }
.swiper-button-next:hover, .swiper-button-prev:hover {filter: brightness(0.7);}





/*보도자료 수정 20260604 */
.main_board .con_box { color: #111;  padding:40px; }
.main_board .con_box a {color:#111;}
.main_board .con_box .board_subject strong { font-size: 26px; font-family: 'BMDOHYEON'; width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; line-clamp: 2; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.3; }
.main_board .con_box .board_subject p { font-size: 19px; margin: 10px 0; width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; line-clamp: 2; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

.main_board .con_box img {aspect-ratio:560/252; width:100%;}


.main_board .board_desc {font-size:18px;  line-height:1.5; overflow: hidden; background-color: #f1f1f1; border-radius: 20px; padding:15px; }
.main_board .board_desc-inner {text-overflow: ellipsis; display: -webkit-box; line-clamp: 8; -webkit-line-clamp: 8; -webkit-box-orient: vertical; overflow: hidden;}


.main_board .con_box a:hover .board_subject strong{color:#1e54d2; text-decoration: underline; text-underline-offset: 0.3em;}

@media (max-width: 1400px) {
	.main_board .board_desc-inner {line-clamp: 7; -webkit-line-clamp: 7;}
}
@media (max-width: 1280px) {
	.main_board .board_desc-inner {line-clamp: 5; -webkit-line-clamp: 5;}
}
@media (max-width: 1024px) {
	.main_board .board_desc-inner {line-clamp: 6; -webkit-line-clamp: 6;}
	
}
@media (max-width: 768px) {
	.main_board .con_box .board_subject strong { font-size: 20px;}
	.main_board .con_box .board_subject p { font-size: 16px;}
	.main_board .board_desc {border-radius: 10px; font-size:16px;}
	.main_board .board_desc-inner {line-clamp: 7; -webkit-line-clamp: 7;}
}


/*보도자료 팝업용 수정 20260604*/
.mainboard .con_box .board_subject {border-bottom:3px solid #e5e5e5; padding-bottom:10px; margin-bottom: 15px; text-align: center;}
.mainboard .con_box .board_subject strong{font-size:26px; color:#000; line-height:1.3; margin-bottom:0;  display: inline-block; width: 100%; overflow:visible; text-overflow:unset;  line-clamp:unset; -webkit-line-clamp:unset; -webkit-box-orient: unset;  }

.mainboard .con_box .board_subject-summary {text-align: left;}
.mainboard .con_box .board_subject-summary p {display: flex; width: 100%; gap: 5px; color:#767676; margin-bottom:0;}
.mainboard .con_box .board_subject-summary p::before {content:'-'; }

.mainboard .mainboard-con {padding-bottom:30px; border-bottom:3px solid #e5e5e5; line-height: 1.5;}
.mainboard .con_box img {aspect-ratio: unset;}

.mainboard .mainboard-con .mainboard_desc h3 {margin-top:50px; color:#000; font-size:23px;}
.mainboard .mainboard-con .mainboard_desc h4 {margin-top:50px; color:#000; font-size:19px; font-weight: 600;}
.mainboard .mainboard-con .mainboard_desc h3 + h4 {margin-top:20px;}
.mainboard .mainboard-con .mainboard_desc p {color:#666; overflow:visible; text-overflow:unset; line-clamp:unset; -webkit-line-clamp:unset; -webkit-box-orient: unset; margin-top:20px;}
.mainboard .mainboard-con .mainboard_desc p:first-child{margin-top:0px;}
.mainboard .mainboard-con .mainboard_desc .stxt {font-size:0.85em;}

.mainboard .mainboard-con .link-wrap {margin:10px 0 0px; text-align: left;}
.mainboard .mainboard-con .open-link {display: inline-flex; align-items: center; justify-content: center; gap:5px;  border-radius: 5px; background-color: transparent; position: relative; padding:0 10px; height:30px; line-height: 1; font-size:16px; color:#000; transition: all 0.3s ease-in-out;}
.mainboard .mainboard-con .open-link.new::after {content:''; display: block; width:20px; height: 20px; background:#0073f4 url('../../images/achv/ico_go.png') no-repeat center / 16px auto; border-radius: 5px; transition: all 0.3s ease-in-out;}
.mainboard .mainboard-con .open-link:hover {background-color: transparent; text-decoration: underline; text-underline-offset: 0.3em;}
.mainboard .mainboard-con .open-link.new:hover::after {transform: translate(2px, -2px); background-color: #0b8f1d;}

@media (max-width: 768px) {
	.mainboard .con_box .board_subject {border-bottom:2px solid #e5e5e5; padding-bottom:15px; margin-bottom: 15px;}
	.mainboard .con_box .board_subject strong{font-size:20px;}
	.mainboard .mainboard-con {padding-bottom:20px; border-bottom:2px solid #e5e5e5;}

	.mainboard .mainboard-con .mainboard_desc h3 {margin-top:40px; font-size:20px;}
	.mainboard .mainboard-con .mainboard_desc h4 {margin-top:40px; font-size:17px;}
	.mainboard .mainboard-con .mainboard_desc h3 + h4 {margin-top:15px;}
	.mainboard .mainboard-con .mainboard_desc p {margin-top:15px; font-size:15px;}

	.mainboard .mainboard-con .link-wrap {margin:30px 0 20px;}
}



/* 스페셜 이벤트 */
.main_event .con_box { color: #111;  padding:40px; }
.main_event .con_box a { display: block; width: 100%;}
.main_event .con_box a img {aspect-ratio:120/77;}

.cardpopup.mainevent .popup_inner {width:auto; max-width: calc(100vw - 30px);}
.cardpopup.mainevent .con_box {text-align: center;}

/* 기후 영상 */
/*유튜브 스와이프 기능 추가 20260602 */
.swiper-slide.is-on::before,
.swiper-slide.is-on::after {content: ''; position: absolute; top: 0; height: 100%; width: 12%; z-index: 10; background: transparent;}
.swiper-slide.is-on::before {left: 0;}
.swiper-slide.is-on::after {right:0;}

.video_box {position: relative; object-fit: contain; overflow: hidden; background-color: #000; border-radius: 20px;}
.video_box::after {content:''; display: block; width:100%; height:100%; position: absolute; inset:0; background: transparent; border:5px solid #3549ff; pointer-events: none; border-radius: 20px; transition: opacity 0.5s ease-in-out; opacity: 0;}
.video_box:hover::after {opacity: 1;}

.video_box iframe,
.video_box .youtube-thumb{position:absolute; top:0; left:0; width:100%; height:100%;}

.youtube-thumb{cursor:pointer;}
.youtube-thumb img{ width:100%; height:100%; object-fit:cover; }

/*
.play-btn{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:56px; height:56px; border-radius:50%; background:rgba(0,0,0,0.7);}
.play-btn::before{content:''; position:absolute; top:50%; left:54%; transform:translate(-50%, -50%); border-left:18px solid #fff; border-top:10px solid transparent; border-bottom:10px solid transparent;}
*/
.youtube-thumb .play-btn {position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:76px; height:52px; background: url('../../images/achv/ico_play01.png') no-repeat center / contain; transition: all 0.3s ease-in-out;}
.main_sform .youtube-thumb .play-btn,
.vodlist.shorts .youtube-thumb .play-btn {width:58px; height:78px; background-image:url('../../images/achv/ico_play02.png');}
.youtube-thumb:hover .play-btn {transform: translate(-50%, -60%);}





.main_branding {width: 100%;}
.main_branding .video_box { aspect-ratio:16/9; }
.main_branding .video_box iframe { width: 100%; height: 100%; border-radius: 20px;}

.main_branding .sform_top .title {  background-image:url('../../images/achv/shorform_icon01.png'); }


/* 기후 쇼츠 */
.sform_top { margin-bottom: 20px; } 
.sform_top { display: flex; justify-content:space-between; align-items: center; }
.sform_top .title {  background:url('../../images/achv/shorform_icon.png') no-repeat left top; padding:18px 0 0 25px; display: flex; justify-content: center; align-items: baseline; font-size: 32px; font-family: 'BMDOHYEON'; color:#fff; }
.sform_top .title span { font-size: 50px; display: inline-block; margin-left: 10px; }

.sform_top .like_count { display: flex; gap: 8px; align-items: center;}
.sform_top .like_count button { background: url('../../images/achv/like_icon.png') no-repeat; width: 30px; height: 30px; text-indent: -99999px;  }
.sform_top .like_count span { font-size: 21px; font-family: 'verdana'; color:#fff; font-weight: bold; }
.sform_top .like_count button:hover { animation: jump-once 0.3s ease; }



.sform_box .sform_box { position: relative; }
.main_sform .swiper-slide { display: flex; justify-content: center; align-items: center;}
.main_sform .video_box { width: 100%; aspect-ratio:9 / 16; } 
.main_sform .video_box iframe { border-radius: 20px; width:100%; height:100%; position: relative;}
/*.main_sform .video_box iframe:hover { animation: bounce-once 0.3s ease; }*/
@keyframes bounce-once { 0% { transform: translateY(0); } 50% { transform: translateY(-20px); } 100% { transform: translateY(0); } }


.sform_box .control { display: flex; justify-content: center; align-items: center; height: 55px; gap: 20px; margin-top:20px; }
.sform_box .swiper-button-prev { background:url('../../images/achv/sform_prev.png') no-repeat; }
.sform_box .swiper-button-next { background:url('../../images/achv/sform_next.png') no-repeat; }
.sform_box .swiper-button-next, 
.sform_box .swiper-button-prev { position: relative; width:55px; height: 55px; } 
.sform_box .swiper-button-next, 
.sform_box .swiper-button-prev {&.swiper-button-disabled { cursor: auto; opacity: .5; pointer-events: none;}}
.sform_box .swiper-button-next, 
.sform_box .swiper-button-prev {::slotted(svg), svg { display: none; }}



.btn-more {display: flex; align-items: center; gap:8px; font-size: 21px; color:#fff; font-weight: 600; letter-spacing: -0.025; transition: all 0.3s ease-in-out; margin-left:auto; margin-right:30px;}
.btn-more::before {content:''; display: block; width:30px; height:30px; border-radius: 50%; flex-shrink: 0; background: #3549ff url('../../images/achv/ico_plus.png') no-repeat center; transition: all 0.3s ease-in-out;}
.btn-more:hover {color:#5a99ff; text-decoration: underline; text-underline-offset: 0.3em;}
.btn-more:hover::before {transform: rotate(360deg); transition-duration: 1s;}




/* footer */
footer { background-color: #02060d; padding:50px 0;}
footer .foot_logo { margin:0 0 20px 0; }
footer .foot_logo img { width:200px; }
footer address { font-style: normal; line-height: 1.6;}
footer .footer_bottom { display: flex; justify-content: space-between;  border-top: 1px solid #4e5156; padding:30px 0 0; margin:30px 0 0;}
footer .footer_bottom .footer_menu { display: flex; gap: 30px; }
footer .footer_bottom .footer_menu li:first-child a { color:#99bfff; }


.footer-top {display: flex; justify-content: space-between; gap:30px;}
.footer-info {flex-grow: 1; display: flex; flex-direction: column; justify-content: space-between;}

.footer-link {flex-shrink: 0;}
.footer-link .link-list {display: flex; flex-direction: column; gap:20px;}
.footer-link .link-list .item {display: flex; align-items: center; gap:15px;}
.footer-link .link-list .item::after {content:''; display: block; width:8px; height:14px; background: url('../../images/achv/ico_arrow02.png') no-repeat center / contain;}
.footer-link .link-list .item:hover {text-decoration: underline; text-underline-offset: 0.3em;}

.footer-sns {margin-top:30px; }
.footer-sns ul {display: flex; align-items: center; gap:5px;}
.footer-sns li > a {display: block; width:40px; height:40px; font-size:0; text-indent: -99999px; overflow: hidden; background-color:#fff; border-radius: 50%; transition: all 0.3s ease-in-out; position: relative;}
.footer-sns li > a span {position: relative; display:block; width:100%; height:100%;  background:no-repeat center top / 40px auto; transition: all 0.5s ease-in-out;}

.footer-sns li > a.instar::before {content: ''; display: block; position: absolute; width:100%; height:100%; background:radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%); opacity: 0; transition: all 0.5s ease-in-out;}

.footer-sns li > a.youtube span {background-image: url('../../images/achv/f_sns_ico01.png');}
.footer-sns li > a.instar span {background-image: url('../../images/achv/f_sns_ico02.png'); }
.footer-sns li > a.facebook span {background-image: url('../../images/achv/f_sns_ico03.png');}
.footer-sns li > a.x span {background-image: url('../../images/achv/f_sns_ico04.png');}
.footer-sns li > a.blog span {background-image: url('../../images/achv/f_sns_ico05.png');}
.footer-sns li > a.tik span {background-image: url('../../images/achv/f_sns_ico06.png');}

.footer-sns li > a:hover span{background-position: center -40px;}
.footer-sns li > a.youtube:hover {background-color:#f50000;}
.footer-sns li > a.instar:hover {background-color: transparent;}
.footer-sns li > a.instar:hover::before {opacity: 1;}
.footer-sns li > a.facebook:hover {background-color:#1e54d2;}
.footer-sns li > a.x:hover {background-color:#333;}
.footer-sns li > a.blog:hover {background-color:#2cae00;}
.footer-sns li > a.tik:hover {background-color:#333;}





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

@media (max-width: 1400px) {
	.body-main,
	.body-sub {background-image:url('../../images/achv/body_bg01.jpg'); background-size: 140% auto;}
	
	
	.wrap .inner {  padding:0 20px;}
	header .main_menu ul { gap:30px;}
	.board-container { width: 100%; }
	.con_group { gap:40px; margin-bottom:40px; justify-content:center; }
	.main_board, .main_event, .main_shorts {  width:calc(50% - 20px); }
	.main_board .con_box, .main_branding .con_box, .main_event .con_box, .main_shorts .con_box{ max-width:none; width:100%; box-sizing:border-box;}
	footer { padding:25px 0; font-size: 15px; }
	footer .foot_logo img { width:150px; }
	footer .footer_bottom { display: block;}
	footer .footer_bottom .footer_menu { margin-bottom: 15px; }
}


@media (max-width: 1024px) {
	.body-main,
	.body-sub {background-size: 160% auto;}

	.inner { padding:0 3%; }
	header { padding:3% 0; }
	header .logo .nth-1 {max-width: 40px;}
	header .logo .nth-2 {max-width: 114px; margin-top:-15px;}

	header .main_menu { display: none; }
	.main_visual { padding: 0 0 40px 0; }

	.main_board, .main_branding, .main_event, .main_shorts { width:100%; }
	.main_shorts .con_box { padding:20px; }
	.main_shorts .swiper-slide .shorts_box { max-width: 100%; }


	footer .footer_bottom {  padding:20px 0 0; margin:20px 0 0; }
}


@media (max-width: 960px) {
	.main_visual .main_txt-wrap {--leaf-w : 80px;}
	
}

@media screen and (max-width: 768px) {
	.mo {display: block !important;}
	.pc {display: none !important;}
	header .top_sns ul { gap: 3px; }
	header .top_sns ul li a { width: 25px; height: 25px; background-size:100% 100% !important; }
	.wrap .inner .contents { padding:20px 0 30px 0; }
	.main_visual .main_txt { margin-bottom: 30px; } 
	.main_visual .main_txt-wrap {--leaf-w : 60px; padding:0 calc(var(--leaf-w) + 0px);}
	.main_visual .main_txt-wrap > .nth-1 {margin-bottom:10px; flex-wrap: wrap;}
	.main_visual .main_txt-wrap > .nth-1 > .nth-1 img {max-width: 80%; }
	.main_visual .main_txt-wrap > .nth-1 > .nth-2 img {max-width: 80%; }
	.main_visual .main_txt-wrap > .nth-1 > .nth-2 {margin-top:-20px;}

	.main_visual .main_txt-wrap > .nth-2::before,
	.main_visual .main_txt-wrap > .nth-2::after {width: 50px; height: 50px;}
	.main_visual .main_txt-wrap > .nth-2::after {top:50%;}
	
	.main_visual .main_txt-wrap::after {transform: rotate(180deg); top:0;}


	.video_box::after {border-radius: 10px; border-width: 3px;}

	.con_group { margin-bottom:40px; }
	.main_board .con_box, .main_branding .con_box, .main_event .con_box { padding:20px; border-radius: 10px; height: auto;}
	.main_shorts .swiper-slide { width: 48.5% !important; }
	.main_board .con_box strong, .main_branding .con_box strong { font-size:20px; line-height:28px; }
	.main_board .con_box p, .main_branding .con_box p { font-size:16px; line-height:24px; }
	.main_branding .con_box iframe { height:240px; }
	.con_top { align-items: flex-start; } 
	.con_top .title { width:140px; height:46px; font-size:17px; background-size:100% 100%; }
	.con_top .like_count span { font-size:17px; }
	.con_body { background-size: 160px auto; }
	.con_box .more_btn { width:40px; height: 40px; } 
	.con_box .more_btn::before { width: 14px; height: 14px; }
	.video_box { border-radius: 10px;}
	.main_branding .video_box iframe,
	.main_sform .video_box iframe {border-radius: 10px;}
	
	
	
	.sform_top .title { font-size: 21px; padding: 20px 0 0 30px; }
	.sform_top .title span { font-size: 28px;} 
	.sform_top .like_count span { font-size: 17px;}





	.main_visual .board-container.pc { display: none;} 
	.main_visual .visual_mobile { display: block; }
	.main_visual .swiper { width: 100%; height: auto; margin-left: auto; margin-right: auto; margin-bottom: 0px;}
	.main_visual .swiper-slide { background-size: cover; background-position: center;}
	.main_visual .mySwiper2 { height: 80%; width: 100%;}
	.main_visual .mySwiper { height: 20%; box-sizing: border-box; padding: 10px 0;}
	.main_visual .mySwiper .swiper-slide { width: 25%; height: 100%; opacity: 0.4;}
	.main_visual .mySwiper .swiper-slide-thumb-active { opacity: 1;}
	.main_visual .swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover;}  
	.main_visual .swiper-button-next, .main_visual .swiper-button-prev { top:calc(50% - 11%) !important; }
	.main_visual .swiper-button-next {left:auto; right:-20px !important;} 
	.main_visual .swiper-button-prev { left:-20px !important;}
	

	.swiper img { width:100%; border-radius: 10px; }

		
	.btn-more {margin-right:10px; font-size:17px;}



	.footer-top {flex-wrap: wrap; gap:20px;}
	.footer-info {width: 100%;}

	.footer-link {width:100%; display: flex; align-items: flex-end; justify-content: space-between;}
	.footer-sns {margin-top:0px; }
	.footer-sns li > a {width:32px; height:32px;}
	.footer-sns li > a span{background-size:32px auto;}
	.footer-sns li > a:hover span {background-position: center -32px;}

	.con_top .like_count button,
	.sform_top .like_count button { width: 24px; height: 24px; background-size: contain;}
	.btn-more::before {width:24px; height:24px;  background-size: 10px auto;}

}

@media screen and (max-width: 767px) {
	
}

@media screen and (max-width: 500px) {
	header .logo  {gap:6px;}
	header .logo .nth-1 {max-width: 34px;}
	header .logo .nth-2 {max-width: 88px; margin-top:-13px;}

	.main_visual .main_txt-wrap {--leaf-w : 50px;}
	
	.main_board .con_box, .main_branding .con_box, .main_event .con_box, .main_shorts .con_box { padding:15px; }
	.main_branding .con_box iframe { height:200px; }
	.main_shorts .swiper-slide { width: 100% !important; }
	.main_shorts .swiper-slide .shorts_box { max-width: 100%; }
	.main_visual .btn_group { gap: 5px; }
	.main_visual .btn_group button { font-size: 17px; padding: 8px 15px 5px 15px; }
	.main_visual .visualThumbSwiper .swiper-slide img { border-radius: 5px; }

	.main_visual .main_txt-wrap {--leaf-w : 40px; padding:0 calc(var(--leaf-w) - 20px);}
	.main_visual .main_txt-wrap > .nth-1 > .nth-2 {margin-top:-5%;}
	.main_visual .main_txt-wrap > .nth-1 > .nth-1 img {max-width: 79%; }
	.main_visual .main_txt-wrap > .nth-1 > .nth-2 img {max-width: 70%; }
	.main_visual .main_txt-wrap > .nth-2 {margin-top:-7%;}

	.main_visual .main_txt-wrap::before {left:-15px; top:-10px;}
	.main_visual .main_txt-wrap::after {right:-10px; top:10px;}

	
	.main_visual .main_txt-wrap > .nth-2::before {bottom:10px; left:10px;}
	.main_visual .main_txt-wrap > .nth-2::after {top:50%; right:10px;}

	
}

@media screen and (max-width: 480px) {
	header .logo  {gap:6px; flex-shrink: 0;}
	header .logo .nth-1 {max-width: 28px; margin-top:5px;}
	header .logo .nth-2 {max-width: 80px; margin-top:-5px;}


	.sform_top .title { font-size: 17px; padding: 20px 0 0 25px; }
	.sform_top .title span { font-size: 21px;} 


	.footer-top {flex-wrap: wrap; gap:20px;}


	.footer-link {flex-wrap: wrap; gap:20px;}
	.footer-link .link-list { gap:10px; width:100%;}

	.footer-sns li > a {width:32px; height:32px;}
	.footer-sns li > a span{background-size:32px auto;}
	.footer-sns li > a:hover span {background-position: center -32px;}
}

@media screen and (max-width: 360px) {
	header .top_sns ul li a { width: 24px; height: 24px;}
}

@media screen and (max-width: 320px) {
	.main_visual .btn_group button { font-size: 15px; padding: 5px 10px 2px 10px; } 
}







/**********************************************************
*************************** 서브 **************************/

/*서브펭지 상단*/
.subvisual {margin-bottom:30px; text-align: center;
	--subtxt-dw : 166px;
	--subtxt-dh : 12px;
	--subtxt-dw-1 : 46px;
	--subtxt-dh-1 : 40px;

	--subtxt-padd-1 : 20px;
	--subtxt-padd-2 : calc(var(--subtxt-dw) + var(--subtxt-padd-1));
	--subtxt-posi-1 : calc(100% + var(--subtxt-padd-1));
}
.subvisual-copy {position: relative; padding:0 var(--subtxt-padd-2); display: inline-block;}
.subvisual-copy::before,
.subvisual-copy::after {content:''; display: block; position:absolute; width:var(--subtxt-dw-1); height:var(--subtxt-dh-1); background: no-repeat center / contain; transition: all 0.5s ease-in-out 1.2s;}

.subvisual-copy::before { background-image: url('../../images/achv/sub_deco0101.png'); right:calc(100% - var(--subtxt-dw)); bottom:calc(100% - var(--subtxt-dh-1) / 2);}
.subvisual-copy::after { background-image: url('../../images/achv/sub_deco0102.png'); left:calc(100% - var(--subtxt-dw)); top:calc(100% - var(--subtxt-dh-1) / 2);}

.subvisual-copy.nth-2::before { background-image: url('../../images/achv/sub_deco0201.png');}
.subvisual-copy.nth-2::after { background-image: url('../../images/achv/sub_deco0202.png');}

.subvisual-copy::before {animation: subtxtdeco 1.5s ease 0.8s infinite;}
.subvisual-copy::after {animation: subtxtdeco 1s ease 1.3s infinite;}
@keyframes subtxtdeco{
	0%{opacity: 1;}
	50%{opacity: 0;}
	100%{opacity: 1;}
}


.subvisual-copy .txt-wrap {display: inline-flex; align-items: flex-end; gap:20px; position: relative; min-width: 0;}
.subvisual-copy .txt-wrap::before,
.subvisual-copy .txt-wrap::after {content:''; display: block; position:absolute; top:50%; width:0; height:var(--subtxt-dh); background: no-repeat center / contain; transition: all 0.5s ease-in-out 1.2s; opacity: 0;}
.subvisual-copy .txt-wrap::before { background-image: url('../../images/achv/sub_deco0103.png'); right:var(--subtxt-posi-1);}
.subvisual-copy .txt-wrap::after { background-image: url('../../images/achv/sub_deco0104.png'); left:var(--subtxt-posi-1);}
.subvisual-copy.nth-2 .txt-wrap::before { background-image: url('../../images/achv/sub_deco0203.png');}
.subvisual-copy.nth-2 .txt-wrap::after { background-image: url('../../images/achv/sub_deco0204.png');}


.subvisual-copy.is-active .txt-wrap::before,
.subvisual-copy.is-active .txt-wrap::after {width:var(--subtxt-dw); opacity: 1;}

.subvisual-copy .txt-wrap .nth-1 {animation: fadeInLeft 0.5s ease-in-out 0.8s both;}
.subvisual-copy .txt-wrap .nth-2 {animation: fadeInRight 0.5s ease-in-out 1.3s both;}


@media screen and (max-width: 768px) {
.body-sub .wrap .inner .contents {padding-bottom:60px;}
	.subvisual {
		--subtxt-dw : 110px;
		--subtxt-dh : 8px;
		--subtxt-dw-1 : 36px;
		--subtxt-dh-1 : 31px;
		--subtxt-padd-1 : 15px;
	}
}
@media screen and (max-width: 500px) {
	.subvisual {
		--subtxt-dw : 90px;
		--subtxt-dh : 6px;
		--subtxt-dw-1 : 30px;
		--subtxt-dh-1 : 26px;
		--subtxt-padd-1 : 10px;
	}
}

@media screen and (max-width: 400px) {
	.subvisual-copy {padding:0 70px;}
}




.subvisual .pagebtn {margin-top:40px; display: flex;  align-items: center; justify-content: space-between; gap:5px;}
.pagebtn .page-btn {display: inline-flex; align-items: center;  gap:10px; padding:0 25px 0 12px; height:54px; font-size:24px; font-family: 'BMDOHYEON'; background:linear-gradient(to right, #3549ff 0%, #5420ea 75%); border-radius: 30px; transition: all 0.3s ease-in-out; box-shadow: 0 0 20px rgba(0, 0, 0, 0.6);}
.pagebtn .page-btn.back {background:linear-gradient(to right, #05af6f 0%, #21909f 75%);}
.pagebtn .page-btn span {padding-top:6px;}
.pagebtn .page-btn::before {content:''; display: block; width:30px; height:30px; background: #fff url('../../images/achv/sub_ico_arrow.png') no-repeat 0 center / auto 30px; border-radius: 50%;  transition: all 0.3s ease-in-out;}

.pagebtn .page-btn:hover {background:linear-gradient(to right, #5420ea 0%, #3549ff 75%);}
.pagebtn .page-btn.back:hover {background:linear-gradient(to right, #21909f 0%, #05af6f 75%);}
.pagebtn .page-btn:hover::before {background-color: #000; background-position: -30px center;}

@media screen and (max-width: 1024px) {
	.pagebtn .page-btn {height: 50px;  padding:0 20px 0 10px;}
}
@media screen and (max-width: 768px) {
	.subvisual .pagebtn {text-align: center;}
	.pagebtn .page-btn {height: 40px; font-size:18px; gap:5px;}
	.pagebtn .page-btn span {padding-top:4px;}
	.pagebtn .page-btn::before {width:20px; height:20px; background-size: auto 20px;}
	.pagebtn .page-btn:hover::before {background-position: -20px center;}
}
@media screen and (max-width: 480px) {
	.subvisual .pagebtn {margin-top:30px; text-align: center;}
	.pagebtn .page-btn {padding:0 15px 0 10px;}
	.pagebtn .page-btn span {padding-top:2px;}
	.pagebtn .page-btn {height: 36px; font-size:16px; gap:5px;}
}



/*서브페이지 리스트*/
.vodlist {display: grid; grid-template-columns: repeat(3, 1fr); gap:40px 20px; width: 100%;}
.vodlist .item { position: relative; min-width:0;}
.vodlist .video_box { aspect-ratio:16 / 9; border-radius: 10px;}
.vodlist .video_box::after {border-radius: 10px;}
.vodlist .subject {margin-top:15px; font-size:17px; font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: all 0.3s ease-in-out;}
.vodlist .vod-link {position: absolute; z-index: 99999; top:0; left:0; width:0; height:0; overflow: hidden; font-size:0; text-indent: -99999px; }


.vodlist.shorts {grid-template-columns: repeat(5, 1fr);}
.vodlist.shorts .video_box { aspect-ratio:9 / 16;}
.vodlist.shorts .subject {line-height: 1.2; height:2.4em; white-space: normal; display: -webkit-box; line-clamp: 2; box-orient: vertical; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

@media screen and (max-width: 1280px) {
	.vodlist {grid-template-columns: repeat(2, 1fr);}
	.vodlist.shorts {grid-template-columns: repeat(4, 1fr);}
}

@media screen and (max-width: 1024px) {
	.vodlist.shorts {grid-template-columns: repeat(3, 1fr);}
}


@media screen and (max-width: 768px) {
	.vodlist {grid-template-columns: repeat(2, 1fr); gap:30px 15px;}
	.vodlist .video_box,
	.vodlist .video_box::after {border-radius: 5px;}
	.vodlist .youtube-thumb .play-btn{zoom:0.7; display: none;}
	.vodlist .subject {font-size:15px; margin-top:10px;}
	.vodlist .vod-link {width:100%; height:100%;}
}

@media screen and (max-width: 640px) {
	.vodlist.shorts {grid-template-columns: repeat(2, 1fr);}
}

@media screen and (max-width: 360px) {
	.vodlist {grid-template-columns: repeat(1, 1fr);}
	.vodlist .video_box,
	.vodlist .video_box::after {border-radius: 5px;}
}