/* keyframes */
@keyframes anim-1{
	0%{
		transform: translate3d(-30px,0,0);
		opacity: 0;
	}
	100%{
		transform: translate3d(0,0,0);
		opacity: 1;
	}
}

@keyframes anim-2{
	0%{
		transform: translate3d(30px,0,0);
		opacity: 0;
	}
	100%{
		transform: translate3d(0,0,0);
		opacity: 1;
	}
}

@keyframes anim-3{
	0%{
		transform: translate3d(-10px,30px,0);
		opacity: 0;
	}
	100%{
		transform: translate3d(0,0,0);
		opacity: 1;
	}
}

@keyframes anim-4{
	0%{
		transform: translate3d(-30px,-10px,0);
		opacity: 0;
	}
	100%{
		transform: translate3d(0,0,0);
		opacity: 1;
	}
}

@keyframes anim-5{
	0%{
		transform: translate3d(30px,-10px,0);
		opacity: 0;
	}
	100%{
		transform: translate3d(0,0,0);
		opacity: 1;
	}
}

/* mv-serendie */
.mv-serendie{
	width: 100%;
	height: 700px;
	position: relative;
	overflow: hidden;
	margin-top: 80px;
}

.mv-serendie .mv-serendie-bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
}
.mv-serendie-bg .bg1{background-color: #E1F5E9;}
.mv-serendie-bg .bg2{background-color: #FFF0F9;}
.mv-serendie-bg .bg3{background-color: #FAFFE5;}
.mv-serendie-bg .bg4{background-color: #DDF9FA;}
.mv-serendie-bg .bg5{background-color: #FDEAC6;}

.mv-serendie-bg .mv-serendie-bg-wrap .mv-serendie-bg-slide{
	width: 100%;
	height: 100%;
}

.mv-serendie .mv-serendie-container{
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	height: 100%;
	max-width: 1240px;
	margin: 0 auto;
}
.mv-serendie .mv-serendie-title{
	width: 54.1129%;
	padding: 0 0.5%;
	order: 0;
}
.mv-serendie .mv-serendie-shapes{
	width: 40.241935%;
	order: 1;
}
.mv-serendie .mv-serendie-shapes .swiper-slide{
	display: flex;
	justify-content: center;
	align-items: center;
}
.mv-serendie .mv-serendie-shapes .swiper-slide img{
	display: block;
	opacity: 0;
}
.mv-serendie .mv-serendie-shapes .swiper-slide.swiper-slide-active img{
	opacity: 1;
}
.mv-serendie .mv-serendie-shapes .swiper-slide.swiper-slide-active.shape1 img{
	animation-name: anim-1;
	animation-duration: 0.8s;
	animation-iteration-count: 1;
}
.mv-serendie .mv-serendie-shapes .swiper-slide.swiper-slide-active.shape2 img{
	animation-name: anim-2;
	animation-duration: 0.8s;
	animation-iteration-count: 1;
}
.mv-serendie .mv-serendie-shapes .swiper-slide.swiper-slide-active.shape3 img{
	animation-name: anim-3;
	animation-duration: 0.8s;
	animation-iteration-count: 1;
}
.mv-serendie .mv-serendie-shapes .swiper-slide.swiper-slide-active.shape4 img{
	animation-name: anim-4;
	animation-duration: 0.8s;
	animation-iteration-count: 1;
}
.mv-serendie .mv-serendie-shapes .swiper-slide.swiper-slide-active.shape5 img{
	animation-name: anim-5;
	animation-duration: 0.8s;
	animation-iteration-count: 1;
}

.mv-serendie .mv-serendie-title h1 img{
	display: block;
}
.mv-serendie .mv-serendie-title p{
	text-align: center;
	font-size:min(2.3vw,31px);
	font-weight: 500;
	margin: 47px auto 0;
	line-height: calc(45 / 26);
}
.mv-serendie .mv-serendie-shapes{
	height: 700px;
}
@media screen and (min-width: 769px)and (max-width:1100px) {
	.mv-serendie .mv-serendie-title p{
		margin-top: 7.28571428%;
	}
}
@media screen and (max-width: 768px) {
	.mv-serendie{
		height: 485px;
		margin-top: 60px;
	}
	.mv-serendie .mv-serendie-container{
		display: block;
	}
	.mv-serendie .mv-serendie-title{
		width: 100%;
		padding: 0;
		order: 1;
	}
	.mv-serendie .mv-serendie-shapes{
		width: 100%;
		height: 330px;
		order: 0;
	}
	.mv-serendie .mv-serendie-shapes .swiper-slide img{
		max-height: 260px;
		width: auto;
	}
	.mv-serendie .mv-serendie-title{
		margin: 0 auto;
	}
	.mv-serendie .mv-serendie-logo{
		max-width: 276px;
		margin: 0 auto;
	}
	.mv-serendie .mv-serendie-title p{
		font-size: 0.875rem;
		max-width: 312px;
		margin: 0 auto;
		margin-top: 23px;
	}
}

/* contents */
#odg-content .serendie-tags-list.articleDetailList{
	margin-bottom: 0;
}
#odg-content .serendie-tags-list .articleDetailList__item{
	position: relative;
}
#odg-content .serendie-tags-list__item__inner.dummy {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 30px;
	border: 0;
	background-color: #D9D8D3;
	min-height: 510px;
}
#odg-content .serendie-tags-list__item__inner.dummy > img{
	width: auto;
	max-width: 100%;
}
#odg-content .serendie-tags-list .articleDetailList__photo{
	background: none;
}
#odg-content .serendie-tags-list .articleDetailList__photo::before{
	padding-top: 45.77777778%;
}
#odg-content .serendie-tags-list .articleDetailList__photo img{
	object-fit: inherit;
}
#odg-content .articleDetailList__title a::before{
    content: "";
    display: block;
    inset: 0;
    position: absolute;
    z-index: 2;
}
#odg-content .articleDetailList__tags{
	position: relative;
	margin-top: 30px;
	z-index: 3;
}

@media screen and (max-width: 768px) {
	.lead-text{
		padding-top: 38px;
	}
	#odg-content .serendie-tags-list__item__inner.dummy{
		min-height: 300px;
	}
	#odg-content .serendie-tags-list__item__inner.dummy > img{
		width: 145px;
		max-width: 100%;
	}
	#odg-content .articleDetailList__tags{
		margin-top: 15px;
	}
}

@media screen and (min-width: 769px) {
	#odg-content .serendie-tags-list .articleDetailList__item{
		width: 48.76033%;
		margin-left: 0;	 
		margin-bottom: 60px;  
	}
	#odg-content .serendie-tags-list .articleDetailList__item:nth-child(2n){
		margin-left: 2.47934%;
	}
	#odg-content .serendie-tags-list .articleDetailList__item .articleDetailList__en{
        font-size: 22px;
        width: 200px;
    }
}

/* banner-serendie */
.banner-serendie{
	margin: 20px auto 90px;
	padding: 0 20px;
	max-width: 1020px;
	width: auto;
}
/* .banner-serendie a:hover{
	opacity: 0.7;
} */
@media screen and (max-width: 768px) {
	.banner-serendie{
		margin: 80px 0 0;
		padding: 0;
	}
	.banner-serendie img{
		width: 100%;
		border: 1px solid #ccc;
		box-sizing: border-box;
	}
}
#odg.odg-detail #odg-content .tagsFooter__inner{
	max-width: 1210px;
}

/* containar */
#odg-content .main-container{
	margin-top: 10px!important;
}
@media screen and (max-width: 768px) {
	#odg-content .main-container{
		margin-top: 0!important;
	}
	#odg-content .mainBox .mainBox-inner.inner-data, #odg-content .mainBox .mainBox-inner.inner-medium {
		padding-top: 0!important;
	}
}