@charset "UTF-8";
/****  0) Tokens & Base *****/
:root {
    /* colors */
    --brand:#389a80;          /* primary */
	 --ink:#333333;            /* headings */
	 --text:#787878;           /* body */
	 --muted:#999999;
	 --line:rgba(0,0,0,.15);
	 --panel:#f4f4f4;
	 --dark:#2e3a59;           /* deep blue */
	 --accent:#e67e25;         /* orange */
	 --accent-2:#e8dcc8;       /* sand */
	 --plum:#514263;          /* purple */
	 --radius:1rem;
	 --shadow:0 8px 24px rgba(0,0,0,.06);
	 --ff:"Pretendard-Regular", "Malgun Gothic", "맑은 고딕", Dotum, "돋움", system-ui, sans-serif;
	 --ff-b:"Pretendard-Bold", "Malgun Gothic", "맑은 고딕", Dotum, "돋움", system-ui, sans-serif;
	 --ff-sb:"Pretendard-SemiBold", "Malgun Gothic", "맑은 고딕", Dotum, "돋움", system-ui, sans-serif;
	 --w-1:170rem;
	 --w-2:150rem;
	 --w-3:120rem;
}
html {
	font-size: 62.5%;
}
body {
	position: relative;
	font-family: var(--ff);
	color: var(--text);
	word-break: keep-all;
	top: 0 !important;
}
*, *::before, *::after {
	box-sizing: border-box;
}
img, video {
	max-width: 100%;
	height: auto;
	display: block;
}
@media (prefers-reduced-motion:reduce) {
	* {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
		scroll-behavior: auto !important;
	}
}
/****  1) Typography *****/
body h1, body h2, body h3, body h4, body h5, body h6 {
	font-family: var(--ff-b);
	color: var(--ink);
}
body h1 {
	font-size: 10.8rem;
	line-height: 1.2;
}
body h2 {
	font-size: 4.8rem;
	line-height: 1.3;
}
body h3 {
	font-size: 3.6rem;
	line-height: 1.35;
}
body h4 {
	font-size: 3rem;
	line-height: 1.4;
}
body h5 {
	font-size: 2.4rem;
	line-height: 1.5;
}
body h6 {
	font-size: 2rem;
	line-height: 1.5;
}
.bigP {
	font-size: 1.9rem;
}
.smTxt {
	font-size: 1.6rem;
}
body p, body li, body dt, body a, body th, body td {
	font-size: 1.8rem;
	line-height: 1.6;
}
body label, body span {
	font-size: 1.7rem;
	line-height: 1.4;
}
.normalTxt {
	font-family: "Pretendard-ExtraLight";
	font-weight: 200;
}
.Myeongjo {
	font-family: "Nanum Myeongjo";
}
/* utilities */
.txtCenter {
	text-align: center;
}
.txtRight {
	text-align: right;
}
.txtLeft {
	text-align: left;
}
.blockCenter {
	margin: 0 auto;
}
.lightblueTxt {
	color: #4391ed;
}
.greyTxt {
	color: #999 !important;
}
.lightgreyTxt {
	color: #aaa;
}
.redTxt {
	color: #ee2323 !important;
}
.blueTxt {
	color: #0066b3 !important;
}
.greenTxt {
	color: #10A05C !important;
}
.underTxt {
	text-decoration: underline;
}
.ui.button.green {
	background-color: #149f5c;
	color: #fff;
}
.ui.button.grey {
	background-color: #999;
	color: #fff;
}
/* media helpers */
.img {
	display: block;
}
.img img {
	width: 100%;
	height: auto;
}
.bgImg {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.blind {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
/* flex helpers */
.flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.flex-first {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}
.flex-center {
	display: flex;
	justify-content: center;
	align-items: center;
}
.flex-align-center {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
/* list styles */
ul.num, ol.num {
	list-style: decimal;
	padding-left: 2rem;
}
.dot li {
	position: relative;
	line-height: 1.4;
	margin-bottom: .8rem;
	padding-left: 1.8rem;
}
.dot li::before {
	content: "";
	position: absolute;
	top: .8rem;
	left: .4rem;
	width: .5rem;
	height: .5rem;
	border-radius: 50%;
	background: #999;
}
.dot.bigP li {
	font-size: 1.9rem;
	color: #333;
}
.bar {
	position: relative;
	padding-top: 2rem;
}
.bar::before {
	content: "";
	position: absolute;
	width: 5rem;
	height: .4rem;
	top: 0;
	left: 0;
	background: #333;
}
.bar li {
	position: relative;
	color: var(--text);
	padding-left: 2rem;
	margin-bottom: .5rem;
}
.bar li::before {
	content: "";
	position: absolute;
	left: .3rem;
	top: 1.3rem;
	width: .7rem;
	height: .2rem;
	background: #999;
}
/* Kendo basics */
.k-checkbox,
.k-radio {
	vertical-align: baseline;
	border: .1rem solid rgba(0,0,0,.15);
	border-radius: .3rem;
}
.k-radio {
	border-radius: 99.9rem;	
}
.k-checkbox:checked,
.k-checkbox.k-checked,
.k-radio:checked,
.k-radio.k-checked {
	border-color: #149f5c;
	color: #fff;
	background: #149f5c;
	box-shadow: none;
}
.k-radio:focus,
.k-checkbox:focus {
	outline: none !important;
	box-shadow: 0 .1rem .1rem .2rem rgba(20,159,92,.5) !important;
}
/* containers */
.inner1 {
	max-width: var(--w-1);
	margin-inline: auto;
	padding-inline: 2rem;
}
.inner2 {
	max-width: var(--w-2);
	margin-inline: auto;
	padding-inline: 2rem;
}
.inner3 {
	max-width: var(--w-3);
	margin-inline: auto;
	padding-inline: 2rem;
}
/****  2) Header & Top bar *****/
#hdTop .greenBg {
	background: var(--dark);
	text-align: right;
	height: 4.2rem;
}
#hdTop .greenBg a {
	display: inline-block;
	color: #fff;
	vertical-align: middle;
}
#hdTop .greenBg a.snsIcon {
	width: 2.4rem;
	height: 4.2rem;
	background-position: center;
	background-repeat: no-repeat;
	opacity: .85;
}
#hdTop .greenBg a:hover {
	text-decoration: underline;
}
#hdTop .greenBg a.snsIcon:hover {
	opacity: 1;
	transition: opacity .3s ease;
}
#hdTop .greenBg a.snsIcon.one {
	background-image: url(../../main/images/sns-wh-icon_01.png);
}
#hdTop .greenBg a.snsIcon.two {
	background-image: url(../../main/images/sns-wh-icon_02.png);
}
#hdTop .greenBg a.snsIcon.three {
	background-image: url(../../main/images/sns-wh-icon_03.png);
}
#hdTop .greenBg a.snsIcon.four {
	background-image: url(../../main/images/sns-wh-icon_04.png);
}
#hdTop .greenBg a + a.snsIcon {
	margin-left: 4rem;
}
#hdTop .greenBg a.snsIcon + a.snsIcon, #hdTop .greenBg a + a {
	margin-left: 2rem;
}
#hdTop .top {
 border-bottom: .1rem solid var(--line);
}
#hdTop .top .inner2 {
	height: 11rem;
	position: relative;
}
.logo {
	position: absolute;
	overflow: hidden;
	width: 32rem;
	max-width: 52vw;
	height: auto;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.logo img {
	width: 100%;
}
#menuBar {
	border-bottom: .5rem solid var(--dark);
}
/* join menu */
.joinMenu {
	position: absolute;
	text-align: right;
	/*width: 38rem;*/
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	z-index: 12;
}
.joinMenu .icon, .menu_btn {
	display: inline-block;
	width: 3rem;
	height: 4rem;
	background-position: center;
	background-repeat: no-repeat;
	cursor: pointer;
}
.joinMenu .icon + .icon {
	margin-left: 2rem;
}
.joinMenu .icon + .menu_btn {
	margin-left: 3rem;
}
.joinMenu .icon.login {
	background-image: url(../../main/images/login-icon.png);
}
.joinMenu .icon.logout {
	background-image: url(../../main/images/logout-icon.png);
}
.joinMenu .icon.mypage {
	background-image: url(../../main/images/mypage-icon.png);
}
.joinMenu .icon.searchShow {
	background-image: url(../../main/images/search-icon.png);
}
.menu_btn {
	background-image: url(../../main/images/mobile-icon.png);
}
/* search popup */
.searchPop {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,.75);
	z-index: 200;
	display: none;
}
.searchPop .innerArea {
	background: #514263;
	padding: 6rem 0;
	text-align: center;
}
.searchPop .inputfrm {
	max-width: 68rem;
	margin: 0 auto;
	height: 6.4rem;
	position: relative;
	background: #fff;
	border-radius: 4rem;
	padding: 1.5rem 8rem 1.5rem 3rem;
}
.searchPop .inputfrm input {
	width: 100%;
	line-height: 3.4rem;
	border: none;
	background: none;
	font-size: 1.8rem;
}
.searchPop .inputfrm input:focus {
	outline: none;
}
.searchPop .inputfrm .btn {
	position: absolute;
	width: 3.6rem;
	height: 3.6rem;
	top: 50%;
	right: 3rem;
	padding: .5rem;
	transform: translateY(-50%);
}
.searchPop .searchHide {
	display: inline-block;
	margin-top: 4rem;
	font-size: 1.7rem;
	color: #fff;
}
/* menu structure */
#menuBar .inner2 {
	position: relative;
	overflow: visible;
	text-align: center !important;
}
nav {
	position: relative;
	display: inline-block;
	margin: 0 auto;
	z-index: 11;
}
nav .gnb>li {
	float: left;
	position: relative;
	text-align: center;
	padding: 0 6.5rem;
}
nav .gnb>li>a {
	font-family: var(--ff-b);
	font-size: 2rem;
	color: #333;
	position: relative;
	height: 9rem;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
}
nav .gnb>li>a::after {
	content: "";
	width: 0;
	height: .5rem;
	background: var(--accent);
	position: absolute;
	left: 0;
	bottom: -.5rem;
	transition: width .6s;
}
nav .gnb>li:hover>a::after {
	width: 100%;
}
nav .gnb>li>.depth2 {
	position: absolute;
	width: 100%;
	height: 40rem;
	padding: 3rem 0;
	display: none;
	cursor: pointer;
	left: 0;
	top: 9.5rem;
	background: transparent;
	border-right: 1px solid rgba(0,0,0,.05);
}
nav .gnb>li:hover>.depth2, nav .gnb>li>.depth2:hover {
	border-top: 0.1rem solid var(--line);
	background: #f4f4f4;
	transition: background-color .6s ease;
}
nav .gnb>li:first-child>.depth2::before {
	content: "";
	position: absolute;
	inset: 0 0 0 0;
 	width: .1rem;
	background: rgba(0,0,0,.05);
}
nav .gnb>li>.depth2>li {
	text-align: left;
	padding: 1rem 2.5rem;
}
nav .gnb>li>.depth2>li>a {
	font-size: 1.8rem;
	line-height: 1.4;
	color: #333;
	display: inline-block;
	border-bottom: 1px solid transparent;
}
nav .gnb>li>.depth2>li .depth3>li {
	position: relative;
	padding-left: 1.5rem;
}
nav .gnb>li>.depth2>li .depth3>li::before {
	content: "";
	position: absolute;
	width: .4rem;
	height: .4rem;
	border-radius: 50%;
	top: 1.2rem;
	left: .5rem;
	background: #666;
}
nav .gnb>li>.depth2>li .depth3>li>a {
	color: #666;
	padding: .4rem 0;
	font-size: 1.5rem;
	font-weight: 400;
	display: inline-block;
}
/* menu backdrops */
.gnbBg {
	position: absolute;
	height: 0;
	background: #fff;
	z-index: 10;
	width: 100%;
	top: 24.7rem;
	transition: height .6s;
}
.gnbBg.on {
	height: 40rem;
	display: block;
	border-top: .1rem solid var(--line);
	border-bottom: .1rem solid var(--line);
}
header:hover {
	background: #fff;
	transition: background-color .6s ease;
}
.blackBg {
	position: absolute;
	top: 24.8rem;
	left: 0;
	width: 100%;
	height: 100%;
	overflow-y: auto;
	background: rgba(0,0,0,.75);
	z-index: 1;
	display: none;
}
.blackBg.on {
	display: block;
}
/* mobile menu chrome hidden by default on desktop */
header nav .top, #menuBar .joinMenu {
	display: none;
}
/****  3) Main Slide *****/
#slide {
	position: relative;
	background: #f6f3f2;
}
#slide .mainSlide {
	position: relative;
	overflow: hidden;
}
#slide .swiper-slide {
	position: relative;
	display: flex;
	justify-content: center;
	overflow: hidden;
	width: 100%;
}
#slide .swiper-slide .inner2 {
	position: absolute;
	inset: auto 0 0 0;
	height: 100%;
	display: flex;
	align-items: center;
	padding: 0 2rem;
}
#slide .swiper-slide .inner2 h2, #slide .swiper-slide .inner2 p {
	color: #fff;
}
#slide .swiper-slide .inner2 p {
	margin-top: 2rem;
}
#slide .swiper-slide .inner2 .ui.button {
	position: relative;
	display: inline-block;
	font-family: var(--ff-sb);
	color: #fff;
	font-size: 1.8rem;
	line-height: 3.5rem;
	padding: 1.5rem 9rem 1.5rem 4rem;
	border-radius: 3.5rem;
	font-weight: 500;
	background: #149f5c;
	margin-top: 4rem;
	transition: transform .2s ease;
}
#slide .swiper-slide .inner2 .ui.button:active {
	transform: scale(.98);
}
#slide .swiper-slide .img img {
	display: block;
	width: 100%;
}
/* slide control pod */
.slideCon.conBox {
	position: absolute;
	bottom: 4rem;
	left: 50%;
	display: inline-flex;
	align-items: center;
	gap: 1rem;
	height: 5.1rem;
	padding: 0 1.2rem;
	border-radius: 3rem;
	background: rgba(0,0,0,.4);
	transform: translateX(-50%);
	z-index: 11;
	width: auto;;
}
.slideCon.conBox .swiper-button-prev, .slideCon.conBox .swiper-button-next, .slideCon.conBox #stopButton, .slideCon.conBox #startButton {
	position: static;
	display: block;
	width: 1.5rem;
	height: 5.1rem;
	background-position: center;
	background-repeat: no-repeat;
	z-index: 12;
	flex: 0 0 1.5rem;
}
.slideCon.conBox .swiper-button-prev {
	margin-top: 0.2rem;
	background-image: url(../../main/images/slidePre_icon.png);
}
.slideCon.conBox .swiper-button-next {
	margin-top: 0.2rem;
	background-image: url(../../main/images/slideNext_icon.png);
}
.slideCon.conBox #stopButton {
	background-image: url(../../main/images/white_stop_icon.png);
}
.slideCon.conBox #startButton {
	background-image: url(../../main/images/white_start_icon.png);
}
.slideCon.conBox .swiper-pagination {
	position: static;
	width: auto;
	display: flex;
	align-items: center;
	gap: .6rem;
	margin: 0 .6rem;
	left: auto;
	top: auto;
	transform: none;
	white-space: nowrap;
}
.slideCon.conBox .swiper-pagination-bullet {
	width: 1rem;
	height: 1rem;
	border-radius: .5rem;
	background: rgba(255,255,255,1);
	opacity: 1;
	cursor: pointer;
	margin: 0;
}
.slideCon.conBox .swiper-pagination-bullet-active {
	background: var(--accent);
	width: 4.5rem;
}
#slide .mainSlide .swiper-slide video {
	width: 100%;
	height: 72rem;
	object-fit: cover;
}
/****  4) Program / Notice / Exhibition / News *****/
#program, #greenBg, #news {
	padding: 10rem 0;
}
#greenBg {
	background: var(--plum);
}
#program h1, #greenBg h1, #news h1, #program h5, #greenBg h5, #news h5 {
	text-align: center;
	color: #919191;
}
#greenBg h1, #greenBg h5 {
	color: #fff;
}
#program h1 + h5, #greenBg h1 + h5, #news h1 + h5 {
	margin-top: 1rem;
	margin-bottom: 8rem;
}
/* program cards */
.procList {
	gap: 4.2rem;
}
.procList .item {
	width: calc(50% - 2.1rem);
	text-align: center;
	position: relative;
	overflow: hidden;
	transition: transform .3s ease, box-shadow .3s ease;
	cursor: pointer;
	border-radius: 1.2rem;
	box-shadow: var(--shadow);
}
.procList .item:hover {
	transform: translateY(-.6rem);
}
.procList .item::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,.05));
}
.procList .item dd {
	width: 100%;
}
.procList .item dd img {
	width: 100%;
	aspect-ratio: 1/1;
	object-fit: cover;
}
.procList .item dt {
	position: absolute;
	inset: 0;
	padding: 4rem;
}
.procList .procLabel {
	display: inline-block;
	min-width: 8.6rem;
	padding: .8rem 1rem;
	font-size: 1.6rem;
	font-weight: 700;
	color: #fff;
	text-align: center;
	background: #a9a9a9;
	border-radius: .6rem;
}
.procList .procLabel.ing {
	background: #07e869;
}
.procList .procLabel.end {
	background: #333;
}
.procList .item dt h2 {
	color: #fff;
	font-size: 6rem;
	line-height: 1.3;
}
.procList .item dt p {
	color: #fff;
	line-height: 1.5;
	margin: 2rem 0 3rem 0;
	background-position: left center;
	background-repeat: no-repeat;
}
.procList .item dt .ui.button, .exhibition dt .ui.button {
	font-size: 1.8rem;
	padding: 1.5rem 4rem;
	border-radius: 100rem;
	color: var(--dark);
	background: var(--accent-2);
}
p.icon-01 {
	background-image: url(../../main/images/proc-icon-01.png);
}
p.icon-02 {
	background-image: url(../../main/images/proc-icon-02.png);
}
p.icon-03 {
	background-image: url(../../main/images/cleandar-icon.png);
}
/* notice bar */
#notice {
	padding: 2.5rem 0;
	border-top: .1rem solid var(--line);
}
#notice h6 {
	position: relative;
	width: 12rem;
	padding-left: 3rem;
	line-height: 5rem;
	height: 5rem;
	background-image: url(../../main/images/notice-icon.png);
	background-position: left center;
	background-repeat: no-repeat;
}
#notice .noticeSlide {
	position: relative;
	width: calc(100% - 30rem);
	overflow: hidden;
	height: 5rem;
	text-align: left;
	padding-left: 6rem;
}
#notice .noticeSlide .flex-first {
	gap: 3rem;
}
#notice .noticeSlide .tit {
	width: 100%;
	max-width: 38rem;
	text-align: left;
	font-size: 1.9rem;
	line-height: 5rem;
	color: #332;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
#notice .noticeSlide .date {
	font-size: 1.7rem;
	line-height: 5rem;
	color: var(--text);
}
#notice .noticeSlide .slideCon {
	position: absolute;
	left: 0;
	top: 0;
	width: 2rem;
	height: 5rem;
}
#notice .noticeSlide .slideCon .swiper-button-prev, #notice .noticeSlide .slideCon .swiper-button-next {
	position: absolute;
	left: 0;
	width: 2rem;
	height: 1.5rem;
	cursor: pointer;
	background-position: center;
	background-repeat: no-repeat;
}
#notice .noticeSlide .slideCon .swiper-button-prev {
	top: 6rem;
	background-image: url(../../main/images/notice-bottom-icon.png);
}
#notice .noticeSlide .slideCon .swiper-button-next {
	top: 2rem;
	background-image: url(../../main/images/notice-top-icon.png);
}
#notice .ui.button.black {
	font-size: 1.7rem;
	padding: .6rem 2.5rem;
	border-radius: 2.5rem;
}
/* exhibition-card */
.exhibition-card {
	background: #fff;
	overflow: hidden;
	border-radius: 1.2rem;
	box-shadow: var(--shadow);
}
.exhibition-media {
	position: relative;
	width: 49rem;
	aspect-ratio: 1/1;
	overflow: hidden;
}
.exhibition-media img {
	position: absolute;
	width: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	transition: transform .3s ease;
}
.exhibition-media:hover img {
	transform: translate(-50%, -50%) scale(1.03);
}
.exhibition-body {
	width: calc(100% - 49rem);
	padding: 6rem;
}
.exhibition-body p {
	font-size: 1.7rem;
	color: #666;
	line-height: 1.4;
	margin-top: 2rem;
}
.exhibition-body p.smTxt {
	color: #999;
	line-height: 1.5;
	padding-left: 2.8rem;
	background-position: left center;
	background-repeat: no-repeat;
}
.exhibition-body .ui.button {
	margin-top: 4rem;
}
.exhibition-swiper.swiper {
	padding-bottom: 11.1rem;
}
.exhibition-swiper .slideCon.conBox {
	bottom: 0rem;
}
.bntSet {
	margin-top: 6rem;
}
.bntSet .ui.button.green {
	margin: 0 .5rem;
	font-size: 2rem;
	font-weight: 400;
	background: var(--plum);
	padding: 1.2rem 2.5rem;
	border-radius: 3rem;
	transition: all .2s ease;
}
.bntSet .ui.button.green:hover {
	color: #333;
	background: #fff;
}
.bntSet .ui.button.green.on {
	color: #333;
	font-weight: 700;
	background: #fff;
}
/* news carousel */
#news {
	position: relative;
}
#news .swiper-viewport {
	width: calc(100% - ((100% - 108rem)/2));
	overflow: hidden;
	float: right;
}
#news .clearBoth {
	clear: both;
}
#news .swiper-container {
	display: flex;
	height: 100%;
	transition: transform .4s ease-in-out;
	touch-action: pan-y;
	margin-bottom: 10rem;
}
#news .swiper-container .swiper-slide {
	width: 41rem;
	cursor: pointer;
}
#news .swiper-container .swiper-slide dt {
	margin-top: 3rem;
	width: 100%;
	height: auto;
}
#news .swiper-container .swiper-slide dt h5 {
	color: #333;
	text-align: left;
}
#news .swiper-container .swiper-slide dt p {
	margin-top: 1rem;
	padding-left: 3rem;
	background-position: left .2rem;
	background-repeat: no-repeat;
}
#news .swiper-nav.conBox {
	position: absolute;
	bottom: 10rem;
	left: 50%;
	display: block;
	width: 22.5rem;
	height: 5.1rem;
	border-radius: 3rem;
	background: #000;
	transform: translateX(-50%);
	z-index: 11;
}
#news .swiper-nav.conBox #prev, #news .swiper-nav.conBox #next, #news .swiper-nav.conBox #stop, #news .swiper-nav.conBox #start {
	position: absolute;
	top: 0;
	display: block;
	width: 1.5rem;
	height: 5.1rem;
	background-position: center;
	background-repeat: no-repeat;
	z-index: 12;
}
#news .swiper-nav.conBox #stop {
	background-image: url(../../main/images/white_stop_icon.png);
	right: 4.1rem;
}
#news .swiper-nav.conBox #start {
	background-image: url(../../main/images/white_start_icon.png);
	right: 4.1rem;
}
#news .swiper-nav.conBox #prev {
	background-image: url(../../main/images/slidePre_icon.png);
	right: 6rem;
}
#news .swiper-nav.conBox #next {
	background-image: url(../../main/images/slideNext_icon.png);
	right: 2.3rem;
}
#news .swiper-pagination {
	position: absolute;
	width: 12rem;
	top: 50%;
	left: 2rem;
	transform: translateY(-50%);
	z-index: 12;
}
#news .swiper-pagination .swiper-pagination-bullet {
	width: 1rem;
	height: 1rem;
	border-radius: .5rem;
	background: #fff;
	opacity: 1;
	cursor: pointer;
}
#news .swiper-pagination .swiper-pagination-bullet-active {
	background: var(--accent);
	width: 4.5rem;
}
/****  5) Light Section & Hot Links *****/
#lightGreenBg {
	margin-top: 10rem;
	position: relative;
}
#lightGreenBg .inner3 {
	padding-bottom: 5rem;
}
#lightGreenBg::before {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 25.2rem;
	background: var(--accent-2);
}
#lightGreenBg .inner3::before {
	content: "";
	position: absolute;
	width: 45.1rem;
	height: 33rem;
	right: 8rem;
	bottom: 0;
	background-image: url(../../main/images/character-img.png);
	background-position: center bottom;
	background-repeat: no-repeat;
}
.hotLink a {
	display: block;
	width: 25rem;
	padding: 1.8rem 3rem 1.8rem 7.5rem;
	font-size: 2rem;
	color: #fff;
	background-position: 3rem center;
	background-repeat: no-repeat;
	background-color: #b0b2b5;
	transition: background-color .2s ease;
}
.hotLink a:hover {
	text-decoration: none;
	background-color: #5e5e5e;
}
.hotLink a + a {
 margin-left: .1rem;
}
.mainIcon-01 {
	background-image: url(../../main/images/main-icon_01.png);
}
.mainIcon-02 {
	background-image: url(../../main/images/main-icon_02.png);
}
.mainIcon-03 {
	background-image: url(../../main/images/main-icon_03.png);
}
.hotLink + h5 {
	margin-top: 10rem;
}
.infoWrap {
	margin-top: 1.5rem;
}
.infoWrap h2, .infoWrap p {
	color: #333;
}
.infoWrap .tit {
	display: flex;
	width: 12rem;
	color: #999;
	align-items: flex-end;
}
.infoWrap .ui.button.black {
	margin-top: 2.5rem;
	padding: 1.5rem 2.5rem;
	font-size: 1.6rem;
	border-radius: 3rem;
}
/****  6) Footer *****/
footer .menu {
	padding: 3rem 0;
	border-top: .1rem solid var(--line);
	border-bottom: .1rem solid var(--line);
}
footer .menu li a {
	color: #000;
	margin: 0 2rem;
}
footer .menu li a:hover, #footerInfo .footerMenu li li a:hover {
	text-decoration: underline;
}
#footerInfo {
	padding: 10rem 0;
}
#footerInfo .addrInfo {
	width: 40rem;
}
#footerInfo img + p {
	margin-top: 2rem;
}
#footerInfo .snsLink {
	margin-top: 3rem;
}
#footerInfo .snsLink a {
	display: inline-block;
	color: #fff;
	vertical-align: middle;
}
#footerInfo .snsLink a + a {
	margin-left: 2rem
}
#footerInfo .snsLink .snsIcon {
	width: 3rem;
	height: 3rem;
	background-position: center;
	background-repeat: no-repeat;
}
#footerInfo .snsLink .snsIcon.one {
	background-image: url(../../main/images/sns-black-icon01.png);
}
#footerInfo .snsLink .snsIcon.two {
	background-image: url(../../main/images/sns-black-icon02.png);
}
#footerInfo .snsLink .snsIcon.three {
	background-image: url(../../main/images/sns-black-icon03.png);
}
#footerInfo .snsLink .snsIcon.four {
	background-image: url(../../main/images/sns-black-icon04.png);
}
#footerInfo .footerMenu {
	width: calc(100% - 52rem);
}
#footerInfo .footerMenu li {
	width: calc((100%/8) - 3rem);
}
#footerInfo .footerMenu li li {
	width: 100%;
}
#footerInfo .footerMenu li>a {
	font-size: 2.2rem;
	font-family: var(--ff-sb);
	color: #000;
}
#footerInfo .footerMenu li ul.depth2 {
	margin-top: 2rem;
}
#footerInfo .footerMenu li li a {
	font-size: 1.7rem;
	line-height: 1.5;
	color: var(--text);
	font-family: var(--ff);
}
#footerInfo .footerMenu>li>.depth2>li .depth3>li {
	position: relative;
	padding-left: 1.5rem;
}
#footerInfo .footerMenu>li>.depth2>li .depth3>li::before {
	content: "";
	position: absolute;
	width: .4rem;
	height: .4rem;
	border-radius: 50%;
	top: 1.2rem;
	left: .5rem;
	background: #666;
}
#footerInfo .footerMenu>li>.depth2>li .depth3>li>a {
	color: #666;
	padding: .4rem 0;
	font-size: 1.5rem;
	font-weight: 400;
	display: inline-block;
}
/****  7) Quick Menu & Go-top  *****/
#quickMenu {
	position: absolute;
	text-align: center;
	width: 11rem;
	top: 8rem;
	right: 4rem;
	z-index: 20;
}
#quickMenu .leaflet {
	overflow: hidden;
	width: 100%;
	padding: 0;
	border-radius: 1rem;
	background: linear-gradient(#673994, #c86e2b);
	margin-bottom: 1rem;
	box-shadow: .5rem .5rem .3rem rgba(0,0,0,.2);
}
#quickMenu .leaflet .list {
	padding: 3rem 0 2rem;
}
#quickMenu .leaflet a {
	display: block;
	font-size: 1.6rem;
	line-height: 1.4;
	color: #fff;
	padding: 1rem 2rem;
}
#quickMenu .leaflet .eng {
	display: block;
	font-size: 1.4rem;
}
#quickMenu .goTop {
	width: 100%;
	background: #cba87e;
	padding: 1.5rem 2rem;
}
#quickMenu .tipIcon {
	display: block;
	margin: 1rem auto;
	text-align: center;
	line-height: 4rem;
	width: 4rem;
	height: 4rem;
	border-radius: 99.9rem;
	background-color: #4a2e1f;
}
/****   8) Swiper defaults (icon-only) *****/
.swiper-button-next:after, .swiper-button-prev:after {
	content: '' !important;
}

/****   9) Responsive Breakpoints  *****/

@media (max-width:1719px) {
	nav .gnb>li {
		padding: 0 4.8rem;
	}
}
@media (max-width: 1599px) {
	:root {
		 --w-1:150rem;
		 --w-2:132rem;
		 --w-3:104rem;
	}
	body h1 {
		font-size: 8.8rem;
	}
	body h2 {
		font-size: 4.2rem;
	}
	body h3 {
		font-size: 3.2rem;
	}
	body h4 {
		font-size: 2.6rem;
	}
	/* GNB spacing a touch tighter */
	nav .gnb>li {
		padding: 0 5.4rem;
	}
	#slide .mainSlide .swiper-slide video {
		height: 58rem;
	}
	.procList .item dt h2 {
		font-size: 5.2rem;
	}
	.exhibition-media {
		width: 42rem;
	}
	.exhibition-body {
		width: calc(100% - 42rem);
		padding: 4.5rem;
	}
	.joinMenu {
    	right: 14.5rem;
	}
	#quickMenu {
		right: 2rem;
	}
	#lightGreenBg .inner3::before {
		right: 0rem;
	}
	#footerInfo .footerMenu li {
		width: calc((100% / 8) - 1rem);
	}
}
@media (max-width:1299px) {
	:root {
		 --w-1:132rem;   /* 1320px */
		 --w-2:118rem;   /* 1180px */
		 --w-3:96rem;    /* 960px  */
	}
	#program, #greenBg, #news, #footerInfo {
		padding: 7rem 0;
	}
	#program h1 + h5, #greenBg h1 + h5, #news h1 + h5 {
    	margin-top: 1rem;
    	margin-bottom: 6rem;
	}
	.inner2 {
        padding: 0rem  2rem;
    }
	#hdTop .top .inner2 {
		height: 9.6rem;
	}
	.logo {
		width: 28rem;
	}
	.slideCon.conBox {
		bottom: 2rem;
		padding: 0 19rem 0 1.2rem;
	}
	.procList .item dt h2 {
		font-size: 4.6rem;
	}
	.procList .item dt p {
		font-size: 1.7rem;
	}
	.exhibition-media {
		width: 38rem;
	}
	.exhibition-body {
		width: calc(100% - 38rem);
		padding: 3.6rem;
	}
	#notice .noticeSlide .tit {
		max-width: 32rem;
	}

	/* mobile menu shell */
	#menuBar .joinMenu {
		display: block;
	}
	header nav {
		position: fixed;
		width: 80%;
		max-width: 38rem;
		right: -38rem;
		top: 0;
		z-index: 1000;
		background: #fff;
		overflow-y: auto;
		height: 100%;
		padding: 0;
		text-align: left;
	}
	header nav .top {
		display: block;
		padding: 2rem;
		position: relative;
		background: #fff;
	 	border-bottom: .1rem solid var(--line);
	}
	header nav .top .img {
		display: block;
		width: 26rem;
	}
	header nav .top .img img {
		width: 100%;
	}
	header nav .menu_close {
		position: absolute;
		right: 2rem;
		top: 50%;
		transform: translateY(-50%);
	}
	header nav .menu_close button {
		width: 1.9rem;
		height: 1.9rem;
		background: url("../main/images/menu_close.png") no-repeat center;
		border: none;
	}
	header nav .gnb>li {
		float: none;
		border-bottom: 1px solid var(--line);
		margin: 0;
		padding: 0;
	}
	header nav .gnb>li>a {
		display: block;
		font-size: 1.8rem;
		font-weight: 400;
		height: auto;
		line-height: 1.3;
		padding: 1.6rem 2rem;
		color: #333;
		text-align: left;
	}
	header nav .gnb>li>a:focus, header nav .gnb>li:hover>a {
		/*background: #4391ed;*/
		background: var(--dark);
		color: #fff;
	}
	header nav .gnb>li>.depth2 {
		display: none;
		position: static;
		background: #f5f5f5;
		padding: 2rem 1rem 2rem 0;
		width: 100%;
		height: auto !important;
	}
	header nav .gnb>li>.depth2>li>a {
		position: relative;
		color: #666;
		padding: 0 0 0 1.4rem;
		font-size: 1.6rem;
		line-height: 1.5;
	}
	header nav .gnb>li>.depth2>li>a:before {
		content: "";
		width: .6rem;
	 	height: .3rem;
		background: #999;
		display: block;
		position: absolute;
		left: 0;
		top: 1.2rem;
	}
	.gnbBg, nav .gnb>li>a::after {
		display: none;
	}
	.gnbBg_m {
		position: fixed;
		inset: 0;
		background: rgba(0,0,0,.7);
		display: none;
		z-index: 10;
	}
	nav .gnb>li>.depth2>li .depth3>li:before {
		display: none;
	}
	header nav .gnb>li>.depth2>li .depth3>li>a {
		position: relative;
		color: #666;
		padding: 0 0 0 1rem;
	}
	header nav .gnb>li>.depth2>li .depth3>li a:before {
		content: "";
	 	width: .4rem;
	 	height: .4rem;
		background: #999;
		display: block;
		position: absolute;
		border-radius: 50%;
		left: 0;
		top: 1.2rem;
	}
	nav .gnb>li>.depth2>li {
		text-align: left;
		padding: 0.3rem 2.5rem;
	}
	/* program cards reduce gap */
	.procList {
		gap: 2rem;
	}
	.joinMenu {
        right: 2rem;
    }
	#quickMenu,
	.footerMenu.flex {
		display: none;	
	}
	#footerInfo .addrInfo {
		text-align: center;
		margin: 0 auto;
	}
	#footerInfo .addrInfo img {
		margin: 0 auto;
	}
}
@media (max-width:1023px) {
	#program, #greenBg, #news, #footerInfo {
		padding: 6rem 0;
	}
	#program h1 + h5, #greenBg h1 + h5, #news h1 + h5 {
    	margin-top: 1rem;
    	margin-bottom: 5rem;
	}
	#hdTop .top .inner2 {
		height: 8.8rem;
	}
	.logo {
		width: 24rem;
	}
	/* Slide: lower height to fit tablets */
	#slide .mainSlide .swiper-slide video {
		height: 44rem;
	}
	.slideCon.conBox {
		bottom: 1.6rem;
	}
	/* Program: stack each card full width */
	.procList {
		gap: 1.6rem;
	}
	.procList .item {
		width: 100%;
	}
	.procList .item dt {
		padding: 3rem;
	}
	.procList .item dt h2 {
		font-size: 4rem;
	}
	/* Exhibition: image on top, text under */
	.exhibition-card {
		border-radius: 1rem;
	}
	.exhibition-media {
		width: 100%;
		aspect-ratio: 16/9;
	}
	.exhibition-body {
		width: 100%;
		padding: 3rem;
	}
	/* Notice: full width list area */
	#notice .noticeSlide {
		width: 100%;
		padding-left: 3rem;
	}
	#notice .noticeSlide .slideCon .swiper-button-next {
    	top: 3rem;
	}
	#notice .noticeSlide .slideCon .swiper-button-prev {
		top: 5rem;
	}
	#notice .noticeSlide .slideCon {
		height: 4rem;
	}
	#notice .noticeSlide .tit {
		width: calc(100% - 10rem);
		font-size: 1.7rem;
	}
	#notice .noticeSlide .date {
		width: 7rem;
		font-size: 1.5rem;
	}
	#notice .ui.button.black {
		font-size: 1.6rem;
		padding: 1.2rem 2.5rem;
		border-radius: 99.9rem;
		margin-top: 1rem;
	}
	/* News rail → full width */
	#news .swiper-viewport {
		width: 100%;
		float: none;
	}
	#news .swiper-container {
		margin-bottom: 6rem;
	}
	#news .swiper-nav.conBox {
		bottom: 6rem;
	}
	/* Light section mascot fade/shift */
	#lightGreenBg,
	.hotLink + h5 {
		margin-top: 6rem;
	}
	#lightGreenBg::before {
		height: 32rem;
	}
	#lightGreenBg .inner3 {
		padding-bottom: 12rem;
	}
	#lightGreenBg .inner3::before {
		right: 2rem;
		width: 36.08rem;
    	height: 26.4rem;
		background-size: 100%;
	}
	/* Footer → two columns menu blocks */
	#footerInfo {
		padding: 6rem 0;
	}
	#footerInfo .addrInfo {
		width: 100%;
		margin-bottom: 3rem;
	}
	#footerInfo .footerMenu {
		width: 100%;
	}
	
	#footerInfo .footerMenu li {
		width: calc(50% - 1.6rem);
		margin-bottom: 2rem;
	}
}
@media (max-width:767px) {
	#hdTop .top .inner2 {
        height: 12rem;
    }
	.logo {
		max-width: 72vw;
		width: 27rem;
		top: 6rem;
		transform: translate(-50%, 0rem);
	}
	.joinMenu {
		top: 1rem;
		right: 2rem;
		transform: translateY(0);
	}
	.joinMenu .icon, .menu_btn {
		display: inline-block;
		width: 2.4rem;
		height: 3.2rem;
	}
	.joinMenu .icon + .icon {
    	margin-left: 1.5rem;
	}
	.joinMenu .icon + .menu_btn {
    	margin-left: 2rem;
	}
	.searchPop .innerArea {
		padding: 4rem 2rem;
		text-align: center;
	}
	.searchPop .searchHide {
		margin-top: 3rem;
	}
	#slide .mainSlide .swiper-slide video {
        height: 26rem;
    }
	.slideCon.conBox {
		bottom: 1.2rem;
		width: 18rem;
		height: 4.6rem;
	}
	.slideCon.conBox .swiper-pagination {
		width: 10rem;
	}
	/* Global paddings */
	#program, #greenBg, #news, #footerInfo {
		padding: 5rem 0;
	}
	#lightGreenBg {
		margin-top: 5rem;
	}
	#lightGreenBg::before {
		height: 16rem;
	}
	#lightGreenBg .inner3 {
        padding-bottom: 20rem;
    }
	#lightGreenBg .inner3::before {
		left: 50%;
		right: auto;
		width: 27.06rem;
		height: 19.8rem;
		transform: translateX(-50%);
	}
	/* Slide control size */
	.slideCon.conBox {
		bottom: 1.2rem;
		width: 18rem;
		height: 4.6rem;
		gap:.6rem;
	}
	.slideCon.conBox .swiper-pagination {
		width: 10rem;
	}
	/* Hot links → single column */
	.hotLink {
		display: grid;
		grid-template-columns: 1fr;
		gap:.8rem;
	}
	.hotLink a {
		width: 100%;
	}

	/* Footer compact */
	footer .menu {
		padding: 2rem 0;
	}
	footer .menu li a {
		margin: 0 1rem;
	}
	/* Headings scale down on small devices */
	body h1 {
		font-size: 4.8rem;
	}
	body h2 {
		font-size: 3.2rem;
	}
	body h3 {
		font-size: 2.4rem;
	}
	body h4 {
		font-size: 2.2rem;
	}
	body h5 {
		font-size: 2rem;
	}
	body h6 {
		font-size: 1.8rem;
	}
	.bigP {
		font-size: 1.8rem;
	}
	body p, body li, body dt, body a, body th, body td {
		font-size: 1.5rem;
	}
	
	footer .menu li:first-child,
	footer .menu li:last-child {
		display: none;	
	}
}

/****   10) Animations  *****/
@keyframes Fadein {
	0% {
		transform: translateY(1rem);
		opacity: 0;
	}
	100% {
		transform: translateY(0);
		opacity: 1;
	}
}
@keyframes smFadein {
	0% {
		transform: translateY(10rem);
		opacity: 0;
	}
	100% {
		transform: translateY(0);
		opacity: 1;
	}
}
@keyframes BigFadein {
	0% {
		transform: translateY(20rem);
		opacity: 0;
	}
	100% {
		transform: translateY(0);
		opacity: 1;
	}
}
@keyframes smFadeDown {
	0% {
		transform: translateY(-10rem);
		opacity: 0;
	}
	100% {
		transform: translateY(0);
		opacity: 1;
	}
}
@keyframes imgloading {
	0% {
		transition: transform 3s ease-in-out, opacity 3s ease-in-out;
		transform: scale(1.2) rotate(.003deg);
		opacity: .7;
	}
	100% {
		transform: scale(1) rotate(.003deg);
		opacity: 1;
	}
}

/****   11) Typography precedence fix (override libs)  *****/
body h1, body h2, body h3, body h4, body h5, body h6 {
	font-family: var(--ff-b);
	color: var(--ink);
}
.ui * h1, .ui * h2, .ui * h3, .ui * h4, .ui * h5, .ui * h6 {
	font-size: inherit;
	line-height: inherit;
}
.ui.header {
	font-size: inherit;
	line-height: inherit;
	font-weight: inherit;
}
.ui.header h1, .ui.header h2, .ui.header h3, .ui.header h4, .ui.header h5, .ui.header h6 {
	font-size: inherit;
	line-height: inherit;
}
.ui * p {
	font-size: 1.8rem;
	line-height: 1.6;
}