@charset "utf-8";
/*-------------------------------------------------
Last update : 2025. 12. 24.
-------------------------------------------------*/

html,
body {
	overflow: hidden;
	height: 100%;
}

#wrap {
	height: 100%;
	display: flex;
	flex-direction: column;
}

#container {
	flex: 1;
	overflow: hidden;
}

#krds-masthead {
	position:fixed;
	top:0;
	width:100%;
}
#krds-header .header-in {
	position:fixed;
	top:3.2rem;
	width:100%;
	background:#fff;
}


/* swiper-기본 */
.swiper {
	display: block;
	list-style: none;
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;
	padding: 0;
	position: relative;
	z-index: 1;
	width: 100%;
	height: 100%;
}

.swiper-vertical>.swiper-wrapper {
	flex-direction: column;
}

.swiper-wrapper {
	box-sizing: initial;
	display: flex;
	width: 100%;
	height: 100%;
	position: relative;
	transition-property: transform;
	transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
	z-index: 1;
}

.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
	transform: translateZ(0);
}

.swiper-horizontal {
	touch-action: pan-y;
}

.swiper-vertical {
	touch-action: pan-x;
}

.swiper-slide {
	display: block;
	flex-shrink: 0;
	height: 100%;
	position: relative;
	transition-property: transform;
	width: 100%;
}

.swiper-slide-invisible-blank {
	visibility: hidden;
}

.swiper-autoheight,
.swiper-autoheight .swiper-slide {
	height: auto;
}

.swiper-autoheight .swiper-wrapper {
	align-items: flex-start;
	transition-property: transform, height;
}

.swiper-backface-hidden .swiper-slide {
	backface-visibility: hidden;
	transform: translateZ(0);
}

.swiper-controls {
	display: flex;
	align-items: center;
	gap: 1.2rem;
}

.swiper-arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.2rem;
	position:relative;
}

.swiper-arrow::before {
	content:"";
	display:block;
	position:absolute;
	left:50%;
	top:50%;
	width:1px;
	height:1.4rem;
	background:#1E2124;
	transform:translate(-50%,-50%);
	opacity: 0.4;
}

.swiper-button {
	display: flex;
	align-items: center;
	justify-content: center;
}

.swiper-controls .swiper-autoplay .svg-icon {
	width: 2.4rem;
	height: 2.4rem;
}

.swiper-pagination.swiper-pagination-fraction {
	border: none;
	background: transparent;
}

.swiper-pagination.swiper-pagination-fraction .swiper-pagination-current {
	color: #FD5E10;
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
	background: transparent
}

/* Fullpage 컨테이너 */
.main.fullpage {
	height: 100%;
	position: relative;
	overflow: hidden;
}

.fullpage-sections {
	height: 100%;
	transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.fp-section {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100vh;
}

/* fullpage-Pagination */
.fullpage-pagination {
	position: absolute;
	left: 30px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
	display: flex;
	flex-direction: column;
}

.fullpage-pagination .fp-bullet {
	display: flex;
	align-items: center;
	gap: 1.2rem;
	position: relative;
	width: auto;
	height: auto;
	padding: 0.45rem 0;
	background: transparent;
	opacity: 1;
	transition: all 0.3s ease;
	cursor: pointer;
}

.fullpage-pagination .fp-bullet::before {
	content: '';
	display: block;
	width: 3.2rem;
	height: 3.2rem;
	border-radius: 50%;
	transition: all 0.3s ease;
	flex-shrink: 0;
	box-sizing: border-box;
}

.fullpage-pagination .fp-bullet::after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	left: 1.2rem;
	transform: translateY(-50%);
	width: 0.8rem;
	height: 0.8rem;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.25);
	transition: all 0.3s ease;
}

.fullpage-pagination .fp-bullet .bullet-text {
	color: #1E2124;
	font-size: 1.5rem;
	font-weight: 600;
	white-space: nowrap;
	transition: all 0.3s ease;
}

.fullpage-pagination .fp-bullet.active::before {
	border: 2px solid rgba(255, 95, 17, 0.3);
}

.fullpage-pagination .fp-bullet.active::after {
	background: #FD5E10;
}

/* service button */
.main-service {
	display:block !important;
}
.fp-service {
	position: absolute;
	left: 50%;
	bottom: 100%;
	transform: translateX(-50%);
	z-index: 100;
	padding:0.4rem 1.2rem 0;
	overflow: hidden;
}

.fp-service button {
	position:relative;
	display: inline-block;
	min-width: 17.6rem;
	padding:1.1rem 0.8rem;
	border-radius: 2.4rem 2.4rem 0 0;
	background: #243060;
	color: #fff;
	font-size:1.7rem;
	font-weight:700;
	line-height:1.5;
}

.fp-service button::before {
	content:"";
	display:block;
	position:absolute;
	bottom:0;
	left:-4rem;
	width:4rem;
	height:4rem;
	border-radius: 50%;
	box-shadow: 1.6rem 1.6rem 0 0 #243060;
}

.fp-service button::after {
	content:"";
	display:block;
	position:absolute;
	bottom:0;
	right:-4rem;
	width:4rem;
	height:4rem;
	border-radius: 50%;
	box-shadow: -1.6rem 1.6rem 0 0 #243060;
}

.fp-service button .svg-icon {
	vertical-align: middle;
	margin-left: 0.4rem;
	background:#fff;
}

/* 공통 */
.fp-section .container {
	display: flex;
	flex-direction: column;
	gap: 5rem;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}

.section-tit {
	margin-bottom:3.4rem;
	text-align: center;
}

.section-tit h2 {
	display:inline-block;
	position:relative;
	padding-right:1.75rem;
	color: #1E2124;
	font-size: 4rem;
	font-weight: 700;
	line-height: 1.3;
}

.section-tit h2::after {
	content:"";
	display:block;
	position:absolute;
	top:0;
	right:0;
	width:1rem;
	height:1rem;
	border-radius: 50%;
	background:#FD5E10;
}

.section-tit .txt {
	margin-top: 0.8rem;
	color: #464C53;
	font-size: 2.4rem;
	font-weight: 500;
}

.section-tit .txt.small {
	font-size: 2rem;
}

.h3-tit {
	font-size: 2.4rem;
	color: #000;
	margin-bottom: 1.6rem;
}

.ico-new::before {
	content: 'N';
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 2rem;
	height: 2rem;
	background: #FD5E10;
	color: #fff;
	font-size: 1.2rem;
	font-weight: 700;
	border-radius: 50%;
}

.btn-more {
	display: flex;
	width: 3.6rem;
	height: var(--number-13, 3.6rem);
	justify-content: center;
	align-items: center;
	border-radius: var(--radius-max, 100rem);
	border: 1px solid var(--color-border-gray-light, #CDD1D5);
	transition: all 0.25s ease;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
}

.btn-more:hover {
	transform: rotate(180deg);
}

.main .ico-arr {
	width: 2rem;
	height: 2rem;
	display: block;
	background: #fff;
	border-radius: 50%;
	mask: url('/resources/images/kps/new_main/ico_more.svg') no-repeat center center;
}

.arr-circle-more {
	width: 5.2rem;
	height: 5.2rem;
	border-radius: 2.6rem 0 0 0;
	background: #fff;
}

.arr-circle-more::before {
	content: "";
	position: absolute;
	left: -5.2rem;
	bottom: 0;
	width: 5.2rem;
	height: 5.2rem;
	overflow: hidden;
	border-radius: 50%;
	box-shadow: 2.6rem 2.6rem 0 0 #fff;
}

.arr-circle-more::after {
	content: "";
	position: absolute;
	right: 0;
	top: -5.2rem;
	width: 5.2rem;
	height: 5.2rem;
	overflow: hidden;
	border-radius: 50%;
	box-shadow: 2.6rem 2.6rem 0 0 #fff;
}

.arr-circle-more .circle {
	width: 4.4rem;
	height: 4.4rem;
	background: #000;
	border-radius: 50%;
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
}

.item-wrap {
	position: relative;
}

/* section1 */

.section1 {
	padding-top:19.4rem;
	background:url('/resources/images/kps/new_main/s1_bg.jpg') no-repeat center center / cover;
}

.section1 .container {
    gap: 8rem;
}

.section1 .visual {
	position:relative;
	margin-bottom: 1rem;
}

.section1 .visual .section-tit {
	margin-bottom:0;
    text-wrap: balance;
}

.section1 .visual .section-tit h2 {
	font-size: 4.8rem;
	padding-right:0;
}

.section1 .visual .section-tit h2 .color2 {
	color:#fd5e10;;
}

.section1 .visual .section-tit h2::after {
	display:none;
}

.section1 .visual .character {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	max-width: 22.9rem;
	background:url('/resources/images/kps/new_main/s1_character_bg.png') no-repeat 50% 100% / 100%;
}

.section1 .visual .icon_group {
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	width: 23rem;
	height: 17rem;
}
.section1 .visual .icon_group::after {
	content:"";
	display:block;
	position:absolute;
	left: 50%;
	top:50%;
	width:100%;
	height: 100%;
	background:url('/resources/images/kps/new_main/s1_icon_bg.png') no-repeat center center / cover;
	transform:translate(-50%, -50%);
	z-index: -1;
}

.section1 .visual .icon_group .icon1 {
	position: absolute;
	bottom: 10%;
	left:0;
	max-width: 15.3rem;
	animation: float1 3s ease-in-out infinite;
}

.section1 .visual .icon_group .icon2 {
	position: absolute;
	top: 0%;
	left: 50%;
	max-width:4.7rem;
	transform: translateX(-80%);
	animation: float2 3.5s ease-in-out infinite;
}

.section1 .visual .icon_group .icon3 {
	position: absolute;
	top:2.7rem;
	left: 50%;
	max-width:4.1rem;
	transform: translateX(50%);
	animation: float3 4s ease-in-out infinite;
}

/* 떠다니는 애니메이션 */
@keyframes float1 {
	0%, 100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(-10px);
	}
}

@keyframes float2 {
	0%, 100% {
		transform: translateX(-80%) translateY(0);
	}
	50% {
		transform: translateX(-80%) translateY(-8px);
	}
}

@keyframes float3 {
	0%, 100% {
		transform: translateX(50%) translateY(0);
	}
	50% {
		transform: translateX(50%) translateY(-12px);
	}
}

.section1 .main-search {
	display: block;

}

.section1 .main-search .input-wrap {
	display: block;
	margin: 2.4rem auto 0;
	max-width: 50rem;
	position: relative;
	padding: 2px;
	border-radius: 10rem;
	background: linear-gradient(110deg, #243060 21%, #EF5F0A 81%);
}

.section1 .main-search .input-wrap .input {
	width: 100%;
	padding: 0.6rem 5.6rem 0.6rem 3.6rem;
	border: none;
	height: 5.6rem;
	border-radius: 10rem;
	background: #fff;
	font-size: 2rem;
}

.section1 .main-search .input-wrap .input::placeholder {
    color: #8A949E;
}

.section1 .main-search .input-wrap .input:hover, .section1 .main-search .input-wrap .input:focus {
	outline: none;
}

.section1 .main-search .input-wrap .krds-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	right: 0.8rem;
	top: 50%;
	width: 4.8rem;
	height: 4.8rem;
	border-radius: 50%;
	background: #FD5E10;
	transform: translateY(-50%);
}

.section1 .main-search .input-wrap .krds-btn .svg-icon {
	width: 2rem;
	height: 2rem;
	background: #fff;
}

.section1 .main-search .keyword-wrap {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	gap: 2.4rem;
	margin-top: 1.6rem;
}

.section1 .main-search .keyword-wrap strong {
	font-size: 1.7rem;
	font-weight: 700;
	white-space: nowrap;
	display: flex;
	align-items: center;
	gap: 0.4rem;
    color: #1E2124;
}

.section1 .main-search .keyword-wrap .ico-star {
	width: 2rem;
	height: 2rem;
	background: #FD5E10;
	mask: url('/resources/images/kps/new_main/ico_star.svg') no-repeat center center;
}

.section1 .main-search .keyword-wrap .hashtag-list {
	display: flex;
	flex-wrap:wrap;
	gap: 1.2rem;
}

.section1 .main-search .keyword-list li {
	display: flex;
}

.section1 .main-search .keyword-wrap .hashtag-list li a {
	white-space: nowrap;
    color: #464C53;
}

.section1 .main-search .keyword-wrap .hashtag-list li a:hover, .section1 .main-search .keyword-wrap .hashtag-list li a:focus {
	text-decoration: underline;
	text-underline-offset: 4px;
}

.section1 .sec-cont {
	display: flex;
	gap: 3.2rem;
}

.section1 .sec-cont .notice-wrap {
	display: flex;
	flex-direction: column;
	gap: 1.6rem;
	flex: 1;
	min-width: 0;
}

.section1 .sec-cont .notice-wrap .btn-more {
	top: -5.3rem;
}

.section1 .notice-wrap .tab {
	width:100%;
	padding-right: 0;
	overflow-x: auto;
}

.section1 .notice-wrap .tab::-webkit-scrollbar {
	display: none;
}

.section1 .notice-wrap .tab ul {
	display: flex;
	gap: 1.6rem;
}

.section1 .notice-wrap .tab ul li {
	display: flex;
}

.section1 .notice-wrap .tab ul li + li::before {
	content:"";
	display:inline-block;
	width: 0.6rem;
	height: 0.6rem;
	margin-right:1.6rem;
	background: #ADADAD;
	border-radius: 50%;
	opacity: 0.5;
}

.section1 .notice-wrap .tab .btn-tab {
	display: flex;
	align-items: center;
	justify-content: center;
	position:relative;
	font-size: var(--font-size-heading-medium, 2.4rem);
	font-weight: 700;
	opacity: 0.6;
	transition: all 0.3s ease;
	height: 3.6rem;
}


.section1 .notice-wrap .tab .btn-tab::after {
	content:"";
	display:block;
	width:0;
	height:2px;
	background:#FD5E10;
	transition: all 0.3s ease;
	position:absolute;
	bottom:0;
	left:50%;
	transform:translateX(-50%);
}

.section1 .notice-wrap .tab .btn-tab:hover,
.section1 .notice-wrap .tab .active .btn-tab {
	opacity: 1;
}

.section1 .notice-wrap .tab .btn-tab:hover::after,
.section1 .notice-wrap .tab .active .btn-tab::after {
	width:100%;
}

.section1 .notice-wrap .tab-conts-wrap {
	border-radius: 2.4rem;
	background: #fff;
    border: 1px solid #E6E8EA;
}

.section1 .notice-wrap .tab-conts {
	display: flex;
	flex-direction: column;
	gap: 1.6rem;
	position: relative;
	display: none;
}

.section1 .notice-wrap .tab-conts.active {
	display: block;
}

.section1 .notice-wrap .tab-cont-item {
	padding: 1.2rem 3.2rem;
}

.section1 .notice-wrap .item-list {
	display: flex;
	flex-direction: column;
}

.section1 .notice-wrap .item {
	display: flex;
	align-items: center;
	gap: 2rem;
	padding: 1.75rem 0;
}

.section1 .notice-wrap .item + .item {
	border-top:1px dashed #EDEDED;
}s

.section1 .notice-wrap .item-cate {
	display: flex;
	padding: 0.3rem 1rem;
	line-height: normal;
	justify-content: center;
	align-items: center;
	gap: 1rem;
	border-radius: 0.8rem;
	background: #F8F8F8;
    font-size: 1.6rem;
    height: 3.1rem;
}

.section1 .notice-wrap .item-link {
	display: flex;
	align-items: center;
	gap: 0.8rem;
	flex: 1;
	min-width: 0;
}

.section1 .notice-wrap .item-link .item-tit {
	display: block;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 160%;
	color: #1E2124;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.section1 .notice-wrap .item-date {
	font-size: 1.6rem;
	margin-left: auto;
}


.section1 .popupzone-wrap {
	width: 30.6rem;
	position: relative;
	display: flex;
	flex-direction: column;
}

.section1 .popupzone-wrap .item {
	display: block;
	height: auto;
    aspect-ratio: 306/284;
	border-radius: 2.4rem;
	overflow: hidden;
}

.section1 .popupzone-wrap .item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.section1 .popupzone-wrap .swiper {
	margin-top: -5.2rem;
	padding-top: 5.2rem;
}

.section1 .popupzone-wrap .swiper-controls {
	position: absolute;
	right: 0;
	top: 0;
}
/* //section1 */

/* section2 */
.section2 {
	background: linear-gradient(122deg, #F5F3F3 16.37%, #F6F3F3 94.1%), linear-gradient(122deg, #F5F3F3 16.37%, #F6F3F3 94.1%), #FFF;
    position: relative;
}

.section2::before {
    display: block;
    content: "";
    width: 61.4rem;
    aspect-ratio: 1/1;
    background: #FFF;
    filter: blur(150px);
    position: absolute;
    right: 0;
    transform: translate(50%,-50%);
    top: 50%;
}

.section2 .section-tit {
    z-index: 1;
    position: relative;
}

.section2 .sec-cont {
	display: flex;
	gap: 3.2rem;
}

.section2 .sec-cont .report-wrap {
	border-radius: 2.4rem;
	background: linear-gradient(145deg, #243060 39.3%, #F4671B 92.19%);
	padding: 4rem 0 0 4.8rem;
	display: flex;
	flex-direction: column;
	gap: 3.2rem 1.6rem;
	width: calc(100% - 35.1rem);
	/* height: 42.6rem; */
}

.section2 .report-wrap .btn-more {
	top: -7.3rem;
	right:4.8rem;
	transition: all 0.3s ease;
}

.section2 .report-wrap .btn-more .svg-icon.ico-plus {
	background: #fff;
}

.section2 .report-wrap .tab {
	width:100%;
	padding-right:9rem;
	overflow-x: auto;
}

.section2 .report-wrap .tab::-webkit-scrollbar {
	display: none;
}

.section2 .report-wrap .tab ul {
	display: flex;
	gap: 1.6rem;
}

.section2 .report-wrap .tab ul li {
	display: flex;
}

.section2 .report-wrap .tab ul li + li::before {
	content:"";
	display:inline-block;
	width: 0.6rem;
	height: 0.6rem;
	margin-right:1.6rem;
	background: #fff;
	border-radius: 50%;
	opacity: 0.5;
}

.section2 .report-wrap .tab .btn-tab {
	display: flex;
	align-items: center;
	justify-content: center;
	height:4rem;
	color: var(--color-surface-white, #FFF);
	font-size: var(--font-size-heading-medium, 2.4rem);
	font-weight: 700;
	opacity: 0.6;
	transition: all 0.3s ease;
}

.section2 .report-wrap .tab .btn-tab:hover,
.section2 .report-wrap .tab .active .btn-tab {
	opacity: 1;
	background: transparent;
}

.section2 .report-wrap .tab-conts {
	display: flex;
	flex-direction: column;
	gap: 1.6rem;
	position: relative;
	display: none;
}

.section2 .report-wrap .tab-conts.active {
	display: block;
}

.section2 .report-wrap .tab-conts .swiper {
	padding-bottom: 5.8rem;
	min-height: 32.5rem;
}

.section2 .report-wrap .tab-cont-item {
	display: flex;
	gap: 2.4rem;
	padding-right:4.8rem;
}

.section2 .report-wrap .item-link {
	display: block;
}

.section2 .report-wrap .item-thumb {
	width: 18.4rem;
	height: 26.7rem;
	min-width: 18.4rem;
	border-radius: 1rem;
	background: #FFF;
	overflow: hidden;
}

.section2 .report-wrap .item-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.section2 .report-wrap .item-info {
	display: flex;
	flex-direction: column;
	gap: 1.6rem;
	flex: 1;
	min-width: 0;
}

.section2 .report-wrap .item-info .item-link {
	display: block;
}

.section2 .report-wrap .item-link .item-tit {
	color: #FFF;
	font-size: 2rem;
	font-weight: 700;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.section2 .report-wrap .item-link .item-txt {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	color: rgba(255, 255, 255, 0.80);
	font-size: 1.8rem;
	margin-top: 1.2rem;
}

.section2 .report-wrap .item-link .item-date {
	color: rgba(255, 255, 255, 0.80);
	font-size: 1.6rem;
	margin-top: 1.6rem;
}

.section2 .report-wrap .item-info .btn-wrap {
	display: flex;
	gap: 1.6rem;
	justify-content: flex-start;
}

.section2 .report-wrap .btn-wrap .btn {
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 3rem;
	border: 1px solid rgba(255, 255, 255, 0.40);
	padding: 0.8rem 1.6rem;
	gap: 0.4rem;
	color: rgba(255, 255, 255, 0.80);
	font-size:1.6rem;
	line-height:1.5;
}

.section2 .report-wrap .btn-wrap .btn .svg-icon {
	width: 2rem;
	height: 2rem;
	background: #fff;
}

.section2 .report-wrap .btn-wrap .btn:hover,
.section2 .report-wrap .btn-wrap .btn:focus {
	background:#000;
	border-color:#000;
}

.section2 .report-wrap .swiper-controls {
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: 1;
	background: #fff;
	padding: 0.8rem 2rem;
	border-radius: 2.6rem 0 2rem 0;
}

.section2 .report-wrap .swiper-controls::before {
	content: "";
	position: absolute;
	left: -5.2rem;
	bottom: 0;
	width: 5.2rem;
	height: 5.2rem;
	overflow: hidden;
	border-radius: 50%;
	box-shadow: 2.6rem 2.6rem 0 0 #fff;
}

.section2 .report-wrap .swiper-controls::after {
	content: "";
	position: absolute;
	right: 0;
	top: -5.2rem;
	width: 5.2rem;
	height: 5.2rem;
	overflow: hidden;
	border-radius: 50%;
	box-shadow: 2.6rem 2.6rem 0 0 #fff;
}

/* section2 > trend-wrap */
.section2 .trend-wrap {
	flex: 1 0 31.9rem;
	min-width: 31.9rem;
	padding-bottom:4rem;
	position: relative;
}

.section2 .trend-wrap::before {
    display: block;
    content: "";
    width: 73.4rem;
    aspect-ratio: 1/1;
    overflow: hidden;
    background: #FFF;
    filter: blur(50px);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: -1;
}

.section2 .trend-wrap .swiper {
	position: relative;
	height:32.2rem;
}

.section2 .trend-wrap .swiper .swiper-slide {
	overflow: hidden;
}

.section2 .trend-wrap .swiper-controls {
	position: absolute;
	bottom: 0.8rem;
	right: 0;
	z-index: 1;
}

.section2 .trend-wrap .item {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1.6rem;
	padding: 2.4rem;
	border-radius: 2.4rem;
	height: 100%;
	background: #F6F6F6;
}

.section2 .trend-wrap .item:hover .item-tit {
	text-decoration: underline;
}

.section2 .trend-wrap .arr-circle-more {
	position: absolute;
	top: 0;
	right: 0;
	border-radius: 0 0 0 2.6rem;
	opacity: 0;
	visibility: hidden;
	transition: all 0.2s ease;
    background: #F5F3F3;
}

.section2 .trend-wrap .arr-circle-more .circle {
	bottom: auto;
	top: 0;	
}

.section2 .trend-wrap .arr-circle-more::before {

	box-shadow: 2.6rem -2.6rem 0 0 #F5F3F3;
}

.section2 .trend-wrap .arr-circle-more::after {
	top: 5.2rem;
	box-shadow: 2.6rem -2.6rem 0 0 #F5F3F3;
}

.section2 .trend-wrap .item:hover .arr-circle-more { 
    background: #fff;
}
.section2 .trend-wrap .item:hover .arr-circle-more::before,
.section2 .trend-wrap .item:hover .arr-circle-more::after {
    box-shadow: 2.6rem -2.6rem 0 0 #fff;
}

.section2 .trend-wrap .item-cate {
	display: inline-flex;
	padding: 0.4rem 1.2rem;
	justify-content: center;
	align-items: center;
	gap: 1rem;
	border-radius: 3rem;
	background: #FFF;
}

.section2 .trend-wrap .item-cate.type1 {
	color: #EF5F0A;
}

.section2 .trend-wrap .item-cate.type2 {
	color: #243060;
}

.section2 .trend-wrap .item:has(.type1):hover {
	background: #F8EDE0;
}

.section2 .trend-wrap .item:has(.type2):hover {
	background: #E3ECF8;
}

.section2 .trend-wrap .item-tit {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 1.9rem;
	line-height:1.4;
}

.section2 .trend-wrap .item:hover .arr-circle-more {
	opacity: 1;
	visibility: visible;
}

/* autoplay button */
.swiper-autoplay {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.4rem;
	height: 2.4rem;
	border: none;
	background: transparent;
	cursor: pointer;
	padding: 0;
}

.swiper-autoplay .svg-icon {
	width: 1.6rem;
	height: 1.6rem;
}

.section2 .admovie-wrap {
	width: 55rem;
	border-radius: 2.4rem;
	background: var(--grad_purpletoorange, linear-gradient(145deg, #243060 39.3%, #F4671B 92.19%));
	padding: 2.4rem;
	color: #fff;
}

.section2 .admovie-wrap .btn-more {
	top: 2.4rem;
	right: 3.2rem;
}

.section2 .admovie-wrap .svg-icon.ico-plus {
	background: #fff;
}

.section2 .admovie-wrap .h3-tit {
	color: #fff;
}

.section2 .admovie-wrap .item-list {
	display: flex;
	gap: 1.6rem;
}

.section2 .admovie-wrap .item {
	flex: 1;
	min-width: 0;
}

.section2 .admovie-wrap .item-link {
	display: flex;
	flex-direction: column;
}

.section2 .admovie-wrap .item-link .item-thumb {
	border-radius: 1rem;
	margin-bottom: 0.8rem;
	overflow: hidden;
}

.section2 .admovie-wrap .item-link .item-thumb img {
	width: 100%;
	object-fit: cover;
}

.section2 .admovie-wrap .item-link .item-tit {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 1.6rem;
}

/* section2 > event-wrap */
/* .section2 .event-wrap {
	flex: 1 0 31.9rem;
	min-width: 31.9rem;
	position: relative;
}

.section2 .event-wrap .swiper {
	position: relative;
	padding-top: 5.3rem;
	margin-top: -5.3rem;
}


.section2 .event-wrap .swiper-controls {
	position: absolute;
	top: 0;
	right: 5rem;
	z-index: 1;
}

.section2 .event-wrap .item {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1.6rem;
	padding: 2.4rem;
	border-radius: 2.4rem;
	background: #fff;
	height: 100%;
}

.section2 .event-wrap .arr-circle-more {
	position: absolute;
	bottom: 0;
	right: 0;
	background: #f6f3f3;
	opacity: 0;
	;
	visibility: hidden;
	transition: all 0.2s ease;
}

.section2 .event-wrap .arr-circle-more::before {
	box-shadow: 2.6rem 2.6rem 0 0 #f6f3f3;
}

.section2 .event-wrap .arr-circle-more::after {
	box-shadow: 2.6rem 2.6rem 0 0 #f6f3f3;
}

.section2 .event-wrap .item-cate {
	display: inline-flex;
	padding: 0.4rem 1.2rem;
	justify-content: center;
	align-items: center;
	gap: 1rem;
	border-radius: 3rem;
	color: #fff;
}

.section2 .event-wrap .item-cate.type1 {
	background: #2788C4;
}

.section2 .event-wrap .item-cate.type2 {
	background: #D8732B;
}

.section2 .event-wrap .item:has(.type1) {}

.section2 .event-wrap .item:has(.type2) {}

.section2 .event-wrap .item:hover {
	background: #F8E3D0;
}

.section2 .event-wrap .item:hover .arr-circle-more {
	opacity: 1;
	visibility: visible;
}

.section2 .event-wrap .item:hover .item-cate.type1 {
	background: #044786;
}

.section2 .event-wrap .item:hover .item-cate.type2 {
	background: #b75b19;
}

.section2 .event-wrap .item-tit {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 1.9rem;
	font-weight: 500;
	margin-bottom: 0.8rem;
}

.section2 .event-wrap .item:hover .item-tit {
	text-decoration: underline;
}

.section2 .event-wrap .item-info {
	display: flex;
	flex-direction: column;
	gap: 0.8rem;
}

.section2 .event-wrap .item-date,
.section2 .event-wrap .item-place {
	font-size: 1.6rem;
	display: flex;
	align-items: center;
	gap: 0.2rem;
	line-height: 1;
}

.section2 .event-wrap .item-date::before,
.section2 .event-wrap .item-place::before {
	content: '';
	display: block;
	width: 1.7rem;
	height: 1.7rem;
}

.section2 .event-wrap .item-date::before {
	background: url('/resources/images/kps/new_main/ico_date.svg') no-repeat center center;
}

.section2 .event-wrap .item-place::before {
	background: url('/resources/images/kps/new_main/ico_map.svg') no-repeat center center;
} */

/* section2 > sns-wrap */
.section2 .sns-wrap {
	margin-top:3.4rem;
	padding:0 0 0 1rem;
}
.section2 .sns-wrap .h3-tit {}
.section2 .sns-wrap .txt {
	font-size:1.6rem;
}
.section2 .sns-wrap-content {
	position:relative;
	padding-right:calc(100% - 21.5rem);
}
.section2 .sns-list {
	margin-top:2rem;
}
.section2 .sns-list > li + li {
	margin-top:1.2rem;
}
.section2 .sns-list .sns-btn {
	display:block;
	position:relative;
	padding:0.3rem 2rem 0.3rem 4rem;
	color:#1E2124;
	font-size:1.6rem;
	font-weight:500;
	line-height:1.8;
}
.section2 .sns-list .sns-btn span {
	display:inline-block;
	vertical-align: middle;
	border-bottom:1px solid transparent;
}
.section2 .sns-list .sns-btn::before {
	content:"";
	display:inline-block;
	position:absolute;
	left:0; 
	top:50%;
	width:3.2rem;
	height:3.2rem;
	transform:translateY(-50%);
	background-size:cover;
	background-repeat:no-repeat;
	background-position:50% 50%;
	transition:all 0.3s ease;
}
.section2 .sns-list .sns-btn span::after {
	content:"";
	display:inline-block;
	vertical-align: middle;
	width:2rem;
	height:2rem;
	margin-left:0.8rem;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:cover;
	transition:all 0.3s ease;
	opacity: 0;
}
.section2 .sns-list .sns-btn:not([target="_blank"]) span::after {
	background-image:url(../../img/component/icon/ico_more.svg);
	opacity: 1;
}
.section2 .sns-list .sns-btn[target="_blank"] span::after {
	background-image:url(../../img/component/icon/ico_go.svg);
}
.section2 .sns-list .sns-btn:not([target="_blank"]) span,
.section2 .sns-list .sns-btn:not([target="_blank"]):hover span, .section2 .sns-list .sns-btn:not([target="_blank"]):focus span {
	border-color:#1E2124;
}
.section2 .sns-list .sns-btn:not([target="_blank"]):hover span::after, .section2 .sns-list .sns-btn:not([target="_blank"]):focus span::after {
	opacity: 1;
}
.section2 .sns-list > li[data-sns-type="youtube"] .sns-btn::before {
	background-image:url('/resources/images/kps/new_main/ico_youtube.svg');
}
.section2 .sns-list > li[data-sns-type="instagram"] .sns-btn::before {
	background-image:url('/resources/images/kps/new_main/ico_instagram.svg');
}
.section2 .sns-list > li[data-sns-type="facebook"] .sns-btn::before {
	background-image:url('/resources/images/kps/new_main/ico_facebook.svg');
}
.section2 .sns-list > li[data-sns-type="blog"] .sns-btn::before {
	background-image:url('/resources/images/kps/new_main/ico_blog.svg');
}
.section2 .sns-slide {
	position:absolute;
	right:0;
	top:-4.8rem;
	width:calc(100% - 21.5rem);
	padding-top:4.8rem;
	overflow:hidden;
}
.section2 .sns-slide .swiper-controls {
	position: absolute;
	right:0;
	top:0;
}
.section2 .sns-slide .swiper-pagination {
	font-size:1.5rem;
}
.section2 .sns-slide .item {
	display:block;
}
.section2 .sns-wrap .item-thumb {
	position:relative;
	display:block;
	height:17.2rem;
	border-radius:1.2rem;
	overflow:hidden;
}
.section2 .sns-wrap .item-thumb::before {
	content:"";
	display:block;
	position:absolute;
	right:0;
	top:0;
	width:3.2rem;
	height:3.2rem;
	border-radius:0 1.2rem 0 1.2rem;
	background:url('/resources/images/kps/new_main/ico_youtube_thumb.png') no-repeat 50% 50% / cover;
	z-index: 1;
}
.section2 .sns-wrap .item-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition:all 0.3s ease;
}
.section2 .sns-wrap .item-thumb:hover img {
	transform:scale(1.05);
}
.section2 .sns-wrap .item-info {
	padding:1.6rem 1rem;
}
.section2 .sns-wrap .item-tit {
	display:-webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 1.8rem;
	font-weight:600;
	line-height:1.6;
}

/* //section2 */

/* section3 */
.section3 {
	background:url('/resources/images/kps/new_main/s3_bg.jpg') no-repeat center center / cover;
}
.section3 .item-tit {
	font-size: 2.4rem;
	color: #1E2124;
	margin-bottom: 0.8rem;
}

.section3 .community-wrap .item-tit {
	display: flex;
	align-items: flex-end;
	height: 8.2rem;
	gap: 2.4rem;
	background: url('/resources/images/kps/new_main/heart_beat.png') no-repeat center right;
	padding-right: 12.6rem;
}

.section3 .community-wrap .item-tit img {
	margin-bottom: 1.2rem;
}

.section3 .community-wrap .item-tit .txt-wrap {
	font-size: 2rem;
}

.section3 .community-wrap .item-tit span {
	display: block;
	color:#DD611E;
}

.section3 .community-wrap .item-list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.8rem;
}

.section3 .community-wrap .item-list a {
	display: flex;
	padding: 1.4rem 1.4rem 1.4rem 2rem;
	align-items: center;
	gap: 3.2rem;
	border-radius: 3rem;
	background: #6E7984;
	color: #fff;
	font-size: 1.8rem;
	font-weight: 700;
}

.section3 .community-wrap .item-list a:hover {
	background: #243060;
}

.section3 .sec-cont {
	display: flex;
	gap: 2.4rem;
}

.section3 .card-item {
	display: flex;
	/* width: 38.4rem; */
	height: 30.1rem;
	padding: 3.2rem 3.2rem 5rem 3.2rem;
	flex-direction: column;
	justify-content: flex-end;
	align-items: flex-start;
	border-radius: 2.4rem;
	gap: 3.2rem;
	position: relative;
	background: linear-gradient(122deg, #F8E3D0 9.19%, #D0D8EA 96.33%), #F8E3D0;
}

.section3 .card-item .item-txt {
	font-size: 1.8rem;
	color: #464C53;
}

.section3 .card-item .arr-circle-more {
	position: absolute;
	bottom: 0;
	right: 0;
}

.section3 .card-item-hover {
	display: flex;
	/* width: 38.4rem; */
	width: 100%;
	height: 30.1rem;
	padding: 3.2rem 3.2rem 5rem 3.2rem;
	flex-direction: column;
	align-items: flex-start;
	gap: 2rem;
	border-radius: 2.4rem;
	background: linear-gradient(145deg, #243060 39.3%, #F4671B 92.19%);
	/* hidden by default; shown on hover/focus */
	opacity: 0;
	visibility: hidden;
	transition: opacity 200ms ease-in-out, visibility 200ms linear;
	position: absolute;
	top: 0;
	left: 0;
}

/* make the wrapper a positioning context so hover panel overlays the card */
.section3 .item-wrap {
	position: relative;
}

.section3 .sec-cont .item-wrap {
	overflow: hidden;
}
.section3 .item-wrap .card-item {
	position: relative;
	z-index: 1;
}

.section3 .item-wrap .card-item-hover {
	z-index: 2;
}

/* show hover panel when parent or the card receives hover/focus */
.section3 .item-wrap:hover .card-item-hover,
.section3 .item-wrap:focus-within .card-item-hover,
.section3 .card-item:hover+.card-item-hover,
.section3 .card-item:focus+.card-item-hover {
	opacity: 1;
	visibility: visible;

}

/* hide the original card visually while hover panel is visible (keeps layout stable) */
.section3 .item-wrap:hover .card-item,
.section3 .item-wrap:focus-within .card-item {
	opacity: 0;
	pointer-events: none;
}

.section3 .card-item-hover .item-tit {
	color: #FFF;
	font-size: 2.4rem;
	font-weight: 700;
	margin-bottom: 0;
}

.section3 .card-item-hover .item-list {
	display: flex;
	flex-direction: column;
	gap: 1.6rem;
	width: 100%;
}

.section3 .card-item-hover .item-list li a {
	display: flex;
	/* width: 32rem; */
	width: 100%;
	padding: 1.4rem 2.4rem;
	justify-content: space-between;
	align-items: center;
	border-radius: 1rem;
	background: #FFF;
	padding-left: 3.8rem;
	position: relative;
	color: #1E2124;
}

.section3 .card-item-hover .item-list a:hover {
	text-decoration: underline;
	background: linear-gradient(95deg, #FFEFDF 74.69%, #FA7D00 113.29%), #FFF;
}

.section3 .card-item-hover .item-list a::before {
	content: '';
	display: block;
	width: 0.6rem;
	height: 0.6rem;
	background: #FF671D;
	border-radius: 50%;
	position: absolute;
	left: 2.4rem;
	top: 50%;
	transform: translateY(-50%);
}

.section3 .card-item-hover .item-list .svg-icon {
	width: 2rem;
	height: 2rem;
	background: #9e9e9e;
}

.section3 .card-item-hover .item-list a:hover .svg-icon {
	background: #fff;
}

.section3 .pic-icon {
	display: block;
	width: 9rem;
	height: 9rem;
	filter: drop-shadow(8px 8px 24px rgba(66, 35, 0, 0.16));
}

.section3 .pic-icon img {
	max-height: 90%;
}



.section3 .community-wrap {
	display: flex;
	padding: 2.4rem 6rem 5rem 6rem;
	flex-direction: column;
	align-items: flex-start;
	gap: 3.2rem;
	position: relative;
	border-radius: 2.4rem;
	background: linear-gradient(90deg, #E1E6F2 0%, #ECEFF8 100%), linear-gradient(93deg, #D4E6FB 6.47%, #F9EDED 101.95%);
}

.section3 .community-wrap .ico-angle {
	width: 2rem;
	height: 1.8rem;
	background: #fff;
}

.section3 .ico-chat {
	background: url('/resources/images/kps/new_main/ico_chat.svg') no-repeat center center;
}

.section3 .ico-support {
	background: url('/resources/images/kps/new_main/ico_support.svg') no-repeat center center;
}

.section3 .ico-monitor {
	background: url('/resources/images/kps/new_main/ico_monitor.svg') no-repeat center center;
}

.section3 .community-wrap .character {
	position: absolute;
	top: 2.9rem;
	right: 3.5rem;
	max-width: 35.6rem;
}

/* //section3 */


/* footer slide effect */
#krds-footer {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 9;
	transform: translateY(100%);
	transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

#krds-footer.is-visible {
	transform: translateY(0);
}

    
@media (max-height:1080px) {
    .fp-section .container {
		gap:1.6rem;
	}
    
    .section1 .container {
        gap: 4rem;
    }
    
    .section3 .sec-cont {
        gap: 1.6rem;
    }
}

@media (max-width: 1940px) {
	.section-tit .txt {
		margin-top:0.4rem;
		font-size: 2.2rem;
	}
	.section1 .main-search .keyword-wrap {
		margin-top:0.8rem;
	}
	.section2 .sec-cont .report-wrap {
		gap:2.4rem 1.6rem;
		padding:2.8rem 0 0 3.6rem;
	}
	.section2 .report-wrap .item-thumb { 
		height:22.7rem; 
	}
	.section2 .report-wrap .item-info .btn-wrap {
		margin-top:2rem;
	}
	.section2 .trend-wrap .swiper {
		height:28rem;
	}
	.section2 .trend-wrap .item {
		gap:0.8rem;
		padding:2rem;
	}
	.section2 .report-wrap .swiper-controls {
		padding:0.4rem 2rem;
	}
	.section2 .report-wrap .tab-conts .swiper {
		min-height:27.5rem;
	}
}

@media (max-width: 1680px) { /* fullpage 비활성화 (노트북 사이즈) */
	html, body {
		overflow: visible;
		height: auto;
	}
	#wrap {
		height: auto;
	}
	.main.fullpage {
		height: auto;
		overflow: visible;
	}
	.fullpage-sections {
		height: auto;
		transform: none !important;
		transition: none !important;
	}
	.fp-section {
		height: auto;
		min-height: auto;
	}
	#krds-masthead {
		position: relative;
		transform: none !important;
	}
	#krds-header .header-in {
		position: relative;
		top: 0 !important;
	}
	#krds-footer {
		position: relative;
		transform: translateY(0) !important;
	}
	#krds-footer.is-visible {
		transform: translateY(0) !important;
	}
	.fullpage-pagination,
	.fullpage-assi {
		display: none;
	}
	section {
		padding: 8rem 2.4rem;
	}
	.section1 {
		padding-top: 6rem;
        background-position: 0 0;
        background-size: 100% 45rem;
	}

}

@media (max-width: 1240px) {
	.section1 .visual .character {
        max-width: 16rem;
        left: -1rem;
    }
    
    .section1 .visual .icon_group {
        width: 18rem;
        height: 18rem;
        right: -1rem;
    }
}

@media (max-width: 1024px) {
    .section1 .visual .section-tit h2 {
      font-size: 4.4rem;  
    } 
	.section3 .sec-cont {
		flex-direction: column;
	}
	.section3 .community-wrap {
		padding:2.4rem 2.4rem 4rem;
	}
	.section3 .community-wrap .character {
		display:none;
	}

	
}

@media (max-width: 780px) {
	.fp-section .container {
		/* padding: 0 1.6rem; */
		gap: 3.2rem;
	}
    section {
        padding: 40px 16px;
    }
    
    .section-tit h2 {
        font-size: 32px;   
    }
    
    .section-tit .txt {
        font-size: 18px;
        margin-top: 10px;    
    }
    
    .section-tit .txt.small {
        font-size: 16px;
    }
    
    .section1 {
        background: url('/resources/images/kps/new_main/s1_bg_mobile.png') no-repeat center center / cover;
    }
    
    .section1 .visual {
        flex-direction: column;
        display: flex;
        align-items: center;
    }

    .section1 .visual .section-tit {
        order: 0;
    }
    
    .section1 .visual .section-tit h2 {
        font-size: 36px;  
    }
    
    .section1 .visual .character {
        max-width: 160px;
        position: relative;
        top: auto;
        left: auto;
        transform: none;
        order: 1;
        margin-top: 6px;
        transform: translateY(6%);
    }
    
    .section1 .visual .icon_group {
        display: none;
    }
    
    .section1 .main-search {
        order: 2;
    }
    
    .section1 .main-search .input-wrap {
        margin-top:0;
    }
    
    .section1 .main-search .input-wrap .input {
        height: 52px;
        padding: 6px 52px 6px 28px;
    }
      
    .section1 .main-search .input-wrap .krds-btn {
        width: 40px;
        height: 40px;
    }
    
    
    .section1 .main-search .keyword-wrap  {
        margin-top: 16px;
        gap: 20px;
        font-size: 14px;
    }
    
    .section1 .main-search .keyword-wrap .ico-star {
        width: 16px;
        height: 16px;
        margin-top: -2px;
    }
    
    .section1 .main-search .keyword-wrap .hashtag-list {
        gap: 4px 8px;
    }
    
	.section2 .sec-cont .report-wrap {
		width: 100%;
		padding:2.4rem 0 0 2.4rem;
	}

	.section2 .report-wrap .btn-more {
		right:2.4rem;
	}

	.section2 .sec-cont {
		flex-direction: column;
	}

	.section2 .trend-wrap {
		padding-bottom:6rem;
	}

	.section1 .sec-cont {
		flex-direction: column;
	}

	.section1 .popupzone-wrap {
		width: 100%;
	}

	.section2 .admovie-wrap {
		width: 100%;
	}

	.section2 .sns-wrap-content {
		padding-right:calc(100% - 17rem);
	}

	.section2 .sns-slide {
		width: calc(100% - 18rem);
	}

	.section3 .sec-cont {
		flex-direction: column;
	}

	.section3 .card-item {
		width: 100%;
	}
}

@media (max-width: 540px) {
	.section1 .notice-wrap .tab-cont-item {
		padding:1rem 2.4rem;
	}
    
	.section1 .notice-wrap .item {
		flex-wrap:wrap;
		align-items: flex-start;
		flex-direction: column;
		gap:0.8rem;
	}
    
	.section1 .notice-wrap .item-link {
		width: 100%;
	}
    
    .section2 .report-wrap .tab-cont-item {
		padding-right:2.4rem;
	}
	.section2 .report-wrap .tab-conts .swiper {
		padding-bottom:8rem;
	}
    
	.section2 .report-wrap .tab-cont-item {
		flex-direction: column;
	}
	.section2 .report-wrap .item-thumb {
		margin:0 auto;
	}
	
	.section2 .admovie-wrap .item-list {
		flex-direction: column;
	}
}

@media (max-width: 420px) {
    .section-tit h2 {
        font-size: 30px;   
    }
    
    .section1 .visual .section-tit h2 {
        font-size: 32px;  
    }
    
    .section1 .visual .character {
        max-width: 117px;
    }
	.section2 .sns-wrap-content {
		padding-right:0;
	}
	.section2 .sns-slide {
		position:relative;
		top:0;
		right:auto;
		width:100%;
	}
}

/* Fade-in 애니메이션 */
.fade-in {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-in.is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* 딜레이 옵션 */
.fade-in.delay-1 { transition-delay: 0.1s; }
.fade-in.delay-2 { transition-delay: 0.2s; }
.fade-in.delay-3 { transition-delay: 0.3s; }
.fade-in.delay-4 { transition-delay: 0.4s; }
.fade-in.delay-5 { transition-delay: 0.5s; }