--radius.content-culture{
	--width-culture-item:20rem;
}
.content-culture-b-item{
--radius:30px;
}
@media (min-width:768px){
	.content-culture{
		--width-culture-item:39rem;
		--width-culture-item-b:27rem;
		--width-culture-b-item:32rem;
	}
}
.content-culture{ padding:2rem 0; overflow:hidden; background:var(--colorL);background-color: var(--colorW);/*  background:linear-gradient(0deg, var(--colorW) 0%, var(--colorW) 15%, var(--colorL) 15%); */ }
.content-culture-container{ position:relative; display:block; width:100%; min-height:25rem; margin:10rem 0 0 0; }
.content-culture-item{ position:absolute; top:0; width:var(--width-culture-item); border-radius:var(--radius); background-color:var(--colorG); border:1px solid var(--colorG); padding:1.5rem 2rem; transition:all 0.4s ease; }
.content-culture-item.animate, .content-culture-item *{ transition:all 0.4s ease; }
.content-culture-hover{ position:absolute; top:0; left:0; width:100%; height:100%; display:none; border-radius:var(--radius); background-color:var(--colorG); opacity:0.8; z-index:2; }
.content-culture-item.active{ left:calc(50% - (var(--width-culture-item) / 2)); background-color:var(--colorL); border:1px solid var(--colorC); z-index:1; margin-top:2rem; box-shadow:0 1rem 5rem rgba(0,0,0,0.2); }
.content-culture-item.prev{ left:calc(50% - (var(--width-culture-item) * 1.2)); z-index:0; }
.content-culture-item.next{ left:calc(50% + (var(--width-culture-item) * 0.2)); z-index:0; }
.content-culture-image{ position:relative; display:block; width:100%; height:12rem; margin:0 auto; border-radius:var(--radius); overflow:hidden; z-index:1; }
.content-culture-image img{ position:absolute; top:0; right:0; width:100%; height:auto; }
.content-culture-item.active .content-culture-image{ margin-top:-10.5rem; }
.content-culture-title{ position:relative; display:block; margin:1.25rem auto 0 auto; text-align:center; }
.content-culture-text{ position:relative; display:none; line-height:1.2; text-align:center; background-color:var(--colorW); padding:1.5rem 2rem; border-radius:var(--radius); margin:1.25rem 0 0 0; }
.content-culture-item.active .content-culture-text{ display:block; }
.content-culture-item.active:hover .content-culture-image{ box-shadow:var(--shadow); }
.content-culture-text-hover{ position:absolute; top:0; left:0; width:100%; height:100%; display:none; z-index:4; padding:2.5rem 6rem; text-align:center; align-items:center; }
.content-culture-item.hover.anime-left{ animation:hoverLeft 1s forwards; }
.content-culture-item.hover.anime-right{ animation:hoverRight 1s forwards; }
@keyframes hoverLeft{
	0% { transform:translateX(0); }
	50% { transform:translateX(-15rem); z-index:0; }
	100% { transform:translateX(0); z-index:5; }
}
@keyframes hoverRight{
	0% { transform:translateX(0); }
	50% { transform:translateX(15rem); z-index:0; }
	100% { transform:translateX(0); z-index:5; }
}
.content-culture-item.hover .content-culture-hover{ display:block; }
.content-culture-item.hover .content-culture-title, .content-culture-item.hover .content-culture-title{ opacity:0; }
.content-culture-item.hover .content-culture-text-hover, .content-culture-item.hover .content-culture-text-hover{ display:flex; }

.leaf.content-culture-leaf{ background-color:var(--colorA); position:absolute; top:8rem; right:-20rem; left:auto; width:59rem; height:35rem; transform:rotate(240deg); transition:all 1s ease; }
.leaf.content-culture-leaf:hover{ background-color:var(--colorB); }

@media (min-width:768px){
	.content-culture-container{ min-height:40rem; }
	.content-culture-item{ padding:2.5rem 3rem; }
	.content-culture-image{ height:18rem; }
	.content-culture-text{ padding:2.5rem 3rem; }
}
@media (max-width:767px){
	.content-culture-header{top:-40% !important;}
}






.content-culture-b-container{ position:relative; display:block; width:100%; min-height:25rem; margin:10rem 0 0 0; }
.content-culture-b-item{ position:absolute; bottom:0; width:var(--width-culture-b-item); border-radius:var(--radius); background-color:var(--colorW); border:1px solid var(--colorN); padding:1.5rem 2rem; transition:all 0.4s ease; }
.content-culture-b-item.animate, .content-culture-b-item *{ transition:all 0.4s ease; }
.content-culture-b-hover{ position:absolute; top:0; left:0; width:100%; height:100%; display:none; border-radius:var(--radius); background-color:var(--colorW); opacity:0.8; z-index:2; }
.content-culture-b-item.active{ left:calc(50% - (var(--width-culture-item-b) * 1.2)); background-color:var(--colorW); border:1px solid var(--colorN); z-index:3; /* margin-top:2rem; */ /* s */ }
.content-culture-b-item.prev{ left:calc(50% - (var(--width-culture-item-b) * 0.4)); z-index:2;transform: scale(0.9);}
.content-culture-b-item.next{ left:calc(50% + (var(--width-culture-item-b) / 5)); z-index:1; transform: scale(0.7);}
.content-culture-b-image{ position:relative; display:block; width:100%; height:12rem; margin:0 auto; border-radius:var(--radius); overflow:hidden; z-index:1; }
.content-culture-b-image img{ position:absolute; top:0; right:0; /* width:100%; */ height:auto; }
.content-culture-b-item.active .content-culture-b-image{ /* margin-top:-10.5rem; */ }
.content-culture-b-title{ position:relative; display:block; margin:1.25rem auto 0 auto; text-align:center;font-family: var(--font); }
.content-culture-b-text{ position:relative; display:block; line-height:1.2; text-align:center; background-color:var(--colorW); padding:1.5rem 2rem; border-radius:var(--radius); margin:.25rem 0 0 0; font-size: 16px;}
.content-culture-b-item.active .content-culture-b-text{ display:block; }
.content-culture-b-item.active:hover .content-culture-b-image{/*  box-shadow:var(--shadow); */ }
.content-culture-b-text-hover h3{font-family: var(--font);}
.content-culture-b-text-hover h3 p, .content-culture-b-text-hover h3 span{font-size: 16px;font-weight: 400;	line-height: 21px;display: block;	}
.content-culture-b-text-hover{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:4; padding:2.5rem 6rem; text-align:center; align-items:center; }
.content-culture-b-item.hover.anime-left{ animation:hoverLeft 1s forwards; }
.content-culture-b-item.hover.anime-right{ animation:hoverRight 1s forwards; }
.content-culture-header{padding: 50px;width: 100%;min-height: 403px;position: absolute;top:-20%;opacity: 0.9;background: linear-gradient(90deg, rgba(209, 243, 226, 0.8776) 0%, #C8CBFF 100%);border-radius: 30px;}
@keyframes hoverLeft{
	0% { transform:translateX(0); }
	50% { transform:translateX(-15rem); z-index:0; }
	100% { transform:translateX(0); z-index:5; }
}
@keyframes hoverRight{
	0% { transform:translateX(0); }
	50% { transform:translateX(15rem); z-index:0; }
	100% { transform:translateX(0); z-index:5; }
}
.content-culture-b-item.hover .content-culture-b-hover{ display:block; }
.content-culture-b-item.hover .content-culture-b-title, .content-culture-b-item.hover .content-culture-b-title{ /* opacity:0; */ }
.content-culture-b-item.hover .content-culture-b-text-hover, .content-culture-b-item.hover .content-culture-b-text-hover{ display:flex; }

.leaf.content-culture-b-leaf{ background-color:var(--colorA); position:absolute; top:8rem; right:-20rem; left:auto; width:59rem; height:35rem; transform:rotate(240deg); transition:all 1s ease; }
.leaf.content-culture-b-leaf:hover{ background-color:var(--colorB); }

@media (min-width:768px){
	.content-culture-b-container{ min-height:30rem; }
	.content-culture-b-item{ padding:2.5rem 2.65rem; }
	.content-culture-b-image{ height:22.5rem; }
	.content-culture-b-text{ padding:1rem 0; }
}