/* main css */

/* calc(var(--vh) - 100px); */

.main__visual {
	position:relative;
	height: 762px;
	/*background-image:url('../img/main/main_visual_bg_2024.jpg?new');*/
	background-position:center;
	background-size:cover;
	background-color: #004b85;
}

.main_item01 {
	position: absolute;
	top: 140px;
	left: calc(50% - 900px);
	opacity: 0;
	animation: main_item01 ease-in-out .7s 1.2s forwards;
}
@keyframes main_item01 {
	from {
		opacity: 0;
		transform: translateX(80px);
	}
	to {
		opacity: 1;
		transform: translateX(0px);
	}
}
.main_item02 {
	position: absolute;
	top: 140px;
	left: calc(50% + 300px);
	opacity: 0;
	animation: main_item02 ease-in-out .7s 1.2s forwards;
}
@keyframes main_item02 {
	from {
		opacity: 0;
		transform: translateX(-80px);
	}
	to {
		opacity: 1;
		transform: translateX(0px);
	}
}

.main__visual .title {
	position: absolute;
	bottom: -8px;
	left: 50%;
	transform: translateX(-50%);
	text-align: center;
	animation: mvTitAni .6s .2s ease-in-out both;
}
@keyframes mvTitAni {
	from {
		opacity: 0;
		transform:translateX(-50%) translateY(80px);
	}
	to {
		opacity: 1;
		transform:translateX(-50%) translateY(0px);
	}
}
.main_title_text {
	position: absolute;
	top: 80px;
	left: 50%;
	transform: translateX(-50%);
	opacity: 0;
	animation: main_title_text ease-in-out .5s .7s forwards;
}
@keyframes main_title_text {
	from {
		opacity: 0;
		transform: translateX(-50%) scale(1.15, 1.15);
	}
	to {
		opacity: 1;
		transform: translateX(-50%) scale(1, 1);
	}
}



@keyframes mvObjAni {
	from {
		opacity: 0;
		visibility:hidden;
		clip:rect(0,504px,294px,504px);
	}

	to {
		opacity: 1;
		visibility:visible;
		clip:rect(0,1008px,294px,0);
	}
}

.list__wrap {
	padding: 80px 0;
	position: relative;
	background-color: #fff;
}

.list__wrap .row {
	max-width:1270px;
}

.list__wrap .title__wrap {
	margin-bottom: 15px;
	padding-left: 20px;
}

.list__wrap .title__wrap .main__title {
	font-size:3rem;
	font-family:'Noto Sans CJK KR';
	font-weight: 600;
}

.list__wrap .title__wrap .tail__ {
	color:#848484;
	font-size:1.6rem;
	font-family:'Noto Sans CJK KR';
}

.list__wrap .content__wrap .tab__ {
	display:flex;
	margin-bottom: 40px;
	padding: 0 15px;
}

.list__wrap .content__wrap .tab__ li {
	display:flex;
	align-items:center;
	justify-content:center;
	width: 115px;
	height: 55px;
	border:1px solid #f0f0f0;
	font-size:1.6rem;
	transition-duration:400ms;
	margin-right: 2px;
	font-family:'Noto Sans CJK KR';
	cursor:pointer;
	color: #292929;
	font-weight: 500;
}

.list__wrap .content__wrap .tab__ li:hover,
.list__wrap .content__wrap .tab__ li.active {
	background-color:#014099;
	color:#fff;
}

.list__wrap .support__wrap {
	margin-bottom: 80px;
} 

.list__wrap .support__wrap .content__wrap .more__btn {
	position:absolute;
	top: 0;
	right: 15px;
	font-size:1.45rem;
	background-color:#f0f0f0;
	display:flex;
	align-items:center;
	justify-content:center;
	width: 180px;
	height: 55px;
	transition-duration:400ms;
	font-family:'Noto Sans CJK KR';
	font-weight: 500;
}

.list__wrap .support__wrap .content__wrap .more__btn img {
	transition-duration:400ms;
	margin-top: 3px;
}

.list__wrap .support__wrap .content__wrap .more__btn:hover {
	background-color:#014099;
	color:#fff;
}

.list__wrap .support__wrap .content__wrap .more__btn:hover img {
	-webkit-filter: brightness(0) invert(1); 
	filter: brightness(0) invert(1);
}

.list__wrap .content__wrap .more__btn img {
	margin-left: 5px;
}

.list__wrap .content__wrap .slider__wrap {
	overflow:hidden;
	padding: 15px 13px;
}

.list__wrap .content__wrap .slider__wrap .swiper-slide {
	position:relative;
}

.list__wrap .content__wrap .slider__wrap .swiper-slide a {
	display:block;
	padding: 30px;
	box-shadow: 0 0 15px #d5d5d5; 
	transition-duration:400ms;
	border:1px solid #f0f0f0;
}

.list__wrap .content__wrap .slider__wrap .swiper-slide a:hover {
	box-shadow: 0 0 18px #a5a5a5; 
}
.list__wrap .content__wrap .slider__wrap .swiper-slide a:hover .more__arrow {
	animation: arrow_hover ease-in-out 1s forwards;
}

@keyframes arrow_hover {
	0% {
		clip: rect(0,0, 14px, 0);
	}
	100% {
		clip: rect(0, 62px, 14px, 0);
	}
}
.list__wrap .content__wrap .slider__wrap .swiper-slide h4 {
	font-size:1.5rem;
	color:#014099;
	font-family:'Noto Sans CJK KR';
	font-weight: 400;
	margin-bottom: 15px;
}

.list__wrap .content__wrap .slider__wrap .swiper-slide h5 {
	font-size:2rem;
	height: 96px;
	margin-bottom: 15px;
}

.list__wrap .content__wrap .slider__wrap .swiper-slide p {
	font-size:1.4rem;
	margin-bottom: 30px;
}

.swiper-button-next, .swiper-button-prev {
	background-image:url('../img/main/main_list_arrow.png?new') !important;
	background-position:0 center;
	width: 40px;
	height: 40px;
	margin-top: 20px;
}

.swiper-button-prev {
	left: -10px;
}

.swiper-button-next {
	background-position:100% center;
	right: -10px;
}

.swiper-button-next:after, .swiper-button-prev:after {
	display:none;
}

.list__wrap .content__wrap .slider__wrap .swiper-slide .more__arrow {
	position:absolute;
	right: 31px;
	bottom: 30px;
}

.list__wrap .bs__list {
	display:flex;
	flex-wrap:wrap;
	padding-left: 20px;
	padding-right: 15px;
}

.list__wrap .bs__list li {
	position:relative;
	width: calc(33.3333% - 16.6667px);
	margin-right: 25px;
	margin-bottom: 25px;
}

.list__wrap .bs__list li:nth-child(4),
.list__wrap .bs__list li:nth-child(5) {
	
}

.list__wrap .bs__list li:nth-child(3),
.list__wrap .bs__list li:nth-child(6) {
	margin-right: 0;
}

.list__wrap .bs__list li a {
	display:block;
	width: 100%;
	padding: 20px;
	box-shadow: 0 0 15px #d5d5d5; 
	transition-duration:400ms;
}

.list__wrap .bs__list li a:hover {
	box-shadow: 0 0 18px #a5a5a5; 
}
.list__wrap .bs__list li a:hover .more__btn {
	animation: more_btn_hover ease-in-out .7s forwards;
}
@keyframes more_btn_hover {
	0% {
		transform: rotate(0);
	}
	10% {
		transform: rotate(-20deg);
	}
	100% {
		transform: rotate(90deg) translate(-3px, -2px);
	}
}

.list__wrap .bs__list li h4 {
	display:flex;
	height: 120px;
	width: 100%;
	align-items:center;
	justify-content: center;
	margin-bottom: 20px;
}

.list__wrap .bs__list li .info__ p {
	font-size:1.7rem;
	font-family:'Noto Sans CJK KR';
	font-weight: 500;
}

.list__wrap .bs__list li .info__ h5 {
	font-size: 2.3rem;
	font-family:'Noto Sans CJK KR';
	font-weight: 600;
}

.list__wrap .bs__list li .more__btn {
	position:absolute;
	right: 20px;
	bottom: 20px;
	transition-duration: 400ms;
}


/* side */
.side {
	position: fixed;
	top: 0px;
	right: 0;
	z-index: 9999998;
}

/*.side .close_side{ width: 55px; height: 247px; background: #1f3481; margin-top: 300px; cursor: pointer;}*/
.side .close_side {
	position: relative;
	background: #001740;
	width: 100px;
	height: 300px;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	transition: 0.3s;
	visibility: visible;
	opacity: 1;
	z-index: 40
}

.open_side{
    position: absolute;
    right: 0;
    top: 0;
    width: 300px;
    background: #001740;
    padding: 50px 10px;
	transition: 0.3s;
	opacity: 0;
	visibility: hidden;
	z-index: 30
}
.open_side .side_xbtn{
    display: inline-block;
    position: absolute;
    top: 16px;
    right: 16px;
    cursor: pointer;
}

.side.open .close_side { opacity: 0; visibility: hidden; z-index: 30}
.side.open .open_side { opacity: 1; visibility: visible; z-index: 40}

.side_link ul{}
.side_link ul li{
    text-align: center;
    padding-top: 30px;
}
.side_link ul li:nth-child(1){
    padding-top: 0;
}
.side_link ul li a { display: block; width: 100%; height: 100%}
.side_link ul li a img { object-fit: cover}

@media(max-width:991px) {
	.side { position: absolute; top: 60px; z-index: 9999;}
	.side .inner { position: fixed; top: 120px; right: 0}
	
	.side .close_side {
		width: 40px;
		height: 180px;
	}
	.side .close_side img {
		width: 15px;
	}


	.open_side { top: 0; width: 250px; padding: 50px 10px 10px 10px}
	
	.side_link ul li{ padding-top: 10px;}
	
	.main__visual {
		height: 550px;
		padding-top: 59px;
	}

	.main__visual .title {
		top: unset;
		bottom: 0;
		left: 0;
		right: unset;
		transform:translateY(80px);
	}
	@keyframes mvTitAni {
		from {
			opacity: 0;
			transform:translateY(80px);
		}
		to {
			opacity: 1;
			transform:translateY(0px);
		}
	}
	.m_main_title_text {
		position: absolute;
		top: 35px;
		left: 35px;
		opacity: 0;
		transform: scale(1.15, 1.15);
		animation: main_title_text ease-in-out .5s .7s forwards;
	}
	@keyframes main_title_text {
		from {
			opacity: 0;
			transform: scale(1.15, 1.15);
		}
		to {
			opacity: 1;
			transform: scale(1, 1);
		}
	}
	.m_main_title_text img {
		width: 230px;
	}

	.main__visual .obj {
		position:absolute;
		width: 90%;
		max-width:500px;
	}

	@keyframes mvObjAni {
		from {
			opacity: 0;
			visibility:hidden;
			clip:rect(0,250px,264px,250px);
		}

		to {
			opacity: 1;
			visibility:visible;
			clip:rect(0,500px,264px,0);
		}
	}

	.list__wrap {
		padding: 45px 0;
	}

	.list__wrap .support__wrap {
		margin-bottom: 50px;
	}

	.list__wrap .row {
		padding: 0;
	}

	.list__wrap .title__wrap {
		text-align:center;
		padding-left: 0;
	}

	.list__wrap .title__wrap .main__title {
		font-size:2.5rem;
		margin-bottom: 5px;
	}

	.list__wrap .title__wrap .tail__ {
		font-size:1.5rem;
	}

	.list__wrap .content__wrap .tab__ {
		flex-wrap:wrap;
		margin-bottom: 20px;
	}

	.list__wrap .content__wrap .tab__ li {
		width: calc(25% - 4px);
		margin-right: 5.3333px;
		margin-bottom: 5px;
		font-size:1.4rem;
		height: 45px;
	}

	.list__wrap .support__wrap .content__wrap .more__btn {
		width: calc(25% - 12px);
		top: 50px;
		font-size:1.3rem;
		height: 45px;
		right: 15px;
		line-height: 1.5rem;
		text-align: center;
	}

	.list__wrap .support__wrap .content__wrap .more__btn img {
		margin-left: 10px;
		margin-top: 0;
	}

	.list__wrap .content__wrap .tab__ li:nth-child(4n) {
		margin-right: 0;
	}

	.list__wrap .content__wrap .slider__wrap {
		padding-right: 0;
	}

	.list__wrap .content__wrap .slider__wrap .swiper_sp_slider {
		width: 100%;
	}

	.list__wrap .content__wrap .slider__wrap .swiper-slide {
		width: 75% !important;
	}

	.list__wrap .content__wrap .slider__wrap .swiper-slide a {
		padding: 15px;
	}

	.list__wrap .content__wrap .slider__wrap .swiper-slide h5 {
		font-size:1.8rem;
		height: 81px;
	}

	.list__wrap .content__wrap .slider__wrap .swiper-slide p {
		font-size:1.2rem;
	}

	.list__wrap .content__wrap .slider__wrap .swiper-slide .more__arrow {
		right: 15px;
		bottom: 15px;
	}

	.list__wrap .content__wrap .slider__wrap .swiper-slide h4 {
		font-size:1.4rem;
	}

	.swiper-button-next, .swiper-button-prev {
		margin-top: 55px;
	}

	.swiper-button-prev {
		left: 0;
	}

	.swiper-button-next {
		right: 0;
	}

	.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
		pointer-events:auto;
	}

	.list__wrap .bs__list {
		padding: 0 15px;
	}

	.list__wrap .bs__list li {
		width: calc(50% - 2px) !important;
		margin-right: 4px !important;
		margin-bottom: 4px;
	}

	.list__wrap .bs__list li:nth-child(2n) {
		margin-right: 0 !important;
	}

	.list__wrap .bs__list li a {
		padding: 10px;
	}

	.list__wrap .bs__list li h4 {
		text-align:center;
		padding-top: 35px;
		height: 70px;
	}

	.list__wrap .bs__list li .info__ p {
		font-size:1.3rem;
	}

	.list__wrap .bs__list li .info__ h5 {
		font-size:1.4rem;
	}

	.list__wrap .bs__list li .more__btn {
		right: 10px;
		bottom: auto;
		top: 15px;
		width: 20px;
	}

	.list__wrap .content__wrap .more__btn img {
		margin-left: 0;
	}
}

@media(max-width:575px) {
	.side { position: absolute; top: 60px;}
	.side .inner { top: 60px;}
	
	.open_side { width: 200px}
}