body {
	margin: 0;
}
body.overflowHidden {
	overflow: hidden;
}
#main {
	font-size: 16px;
	font-weight: 400;
	font-family: "Arial", "メイリオ";
	line-height: 26px;
	overflow-x: hidden;
}
@media screen and (max-width: 1080px) {
	#main {
		font-size: 1.6vw;
		line-height: 2.6vw;
	}
}
@media screen and (max-width: 568px) {
	#main {
		font-size: 4vw;
		line-height: 7vw;
	}
}

#bl_loading {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
body.is-loading {
	overflow: hidden;
}
#bl_loadingImageWrap {
	transition: transform 0.6s ease, opacity 0.6s ease;
	z-index: 5;
}
#bl_loadingImageWrap img{
	top: 34em;
	left: 0;
	right: 0;
	margin: 0 auto;
	position: absolute;
}
@media screen and (max-width: 568px) {
	#bl_loadingImageWrap img{
		top: 21em;
	}
}

#bl_loadingImageWrap img.block{
	width: 7em;
}
@media screen and (max-width: 568px) {
	#bl_loadingImageWrap img.block{
		width: 4.8em;
	}
}
#bl_loadingImageWrap img.logo{
	width: 32em;
}
@media screen and (max-width: 568px) {
	#bl_loadingImageWrap img.logo{
		width: 22em;
	}
}
#bl_loadingImageWrap .brick_color-06{animation: brick_color-06 1.0s ease-in forwards; margin-top: 0;}
@keyframes brick_color-06 {
	0% { transform:translate3d(0,0,0); }
	50% { transform:translate3d(0,6em,0); }
	80% { opacity:1; }
	100% { transform:translate3d(0,6em,0); opacity:0; }
}
#bl_loadingImageWrap .brick_color-03{animation: brick_color-03 1.0s ease-in forwards; margin-top: -2.6em;}
@keyframes brick_color-03 {
	0% { transform:translate3d(0,0,0); }
	50% { transform:translate3d(0,2em,0); }
	80% { opacity:1; }
	100% { transform:translate3d(0,2em,0); opacity:0; }
}
#bl_loadingImageWrap .brick_color-02{animation: brick_color-02 1.0s ease-in forwards; margin-top: -5.3em;}
@keyframes brick_color-02 {
	0% { transform:translate3d(0,0,0); }
	50% { transform:translate3d(0,-2em,0); }
	80% { opacity:1; }
	100% { transform:translate3d(0,-2em,0); opacity:0; }
}
#bl_loadingImageWrap .brick_color-01{animation: brick_color-01 1.0s ease-in forwards; margin-top: -7.9em;}
@keyframes brick_color-01 {
	0% { transform:translate3d(0,0,0); }
	50% { transform:translate3d(0,-6em,0); }
	80% { opacity:1; }
	100% { transform:translate3d(0,-6em,0); opacity:0; }
}

#bl_loadingImageWrap .brick_color-15{animation: brick_color-15 2.0s 0.8s ease-in-out forwards; margin-top: 0; transform:translate3d(0,6em,0); opacity:0;}
@keyframes brick_color-15 {
	0% { opacity:0; }
	10% { opacity:1; }
	25% { transform:translate3d(0,6em,0); }
	50% { margin-top: 0; transform:translate3d(0,0,0); opacity:1; }
	90% { margin-top: 0; transform:translate3d(0,0,0); opacity:1; }
	100% { margin-top: 0; transform:translate3d(0,0,0); opacity:0; }
}

#bl_loadingImageWrap .brick_color-14{animation: brick_color-14 2.0s 0.8s ease-in-out forwards; margin-top: -2.6em; transform:translate3d(0,2em,0); opacity:0;}
@keyframes brick_color-14 {
	0% { opacity:0; }
	10% { opacity:1; }
	25% { margin-top: -2.6em; transform:translate3d(0,2em,0); }
	50% { margin-top: 0; transform:translate3d(0,0,0); opacity:1; }
	90% { margin-top: 0; transform:translate3d(0,0,0); opacity:1; }
	100% { margin-top: 0; transform:translate3d(0,0,0); opacity:0; }
}
#bl_loadingImageWrap .brick_color-13{animation: brick_color-13 2.0s 0.8s ease-in-out forwards; margin-top: -5.3em; transform:translate3d(0,-2em,0); opacity:0;}
@keyframes brick_color-13 {
	0% { opacity:0; }
	10% { opacity:1; }
	25% { margin-top: -5.3em; transform:translate3d(0,-2em,0); }
	50% { margin-top: 0; transform:translate3d(0,0,0); opacity:1; }
	90% { margin-top: 0; transform:translate3d(0,0,0); opacity:1; }
	100% { margin-top: 0; transform:translate3d(0,0,0); opacity:0; }
}
#bl_loadingImageWrap .brick_color-12{animation: brick_color-12 2.0s 0.8s ease-in-out forwards; margin-top: -7.9em; transform:translate3d(0,-6em,0); opacity:0;}
@keyframes brick_color-12 {
	0% { opacity:0; }
	10% { opacity:1; }
	25% { margin-top: -7.9em; transform:translate3d(0,-6em,0); }
	50% { margin-top: 0; transform:translate3d(0,0,0); opacity:1; }
	90% { margin-top: 0; transform:translate3d(0,0,0); opacity:1; }
	100% { margin-top: 0; transform:translate3d(0,0,0); opacity:0; }
}

#bl_loadingImageWrap .LP_sozai-36{animation: LP_sozai-36 2.0s 1.4s ease-in-out forwards; margin-top: 100em;}
@keyframes LP_sozai-36 {
	0% { opacity:0; }
	5% { opacity:1; }
	50% { margin-top: -0.3em; opacity:1; }
	60% { margin-top: -0.3em; opacity:1; }
	70% { margin-top: -0.3em; opacity:0; }
	100% { opacity:0; }
}
#bl_loadingImageWrap .LP_sozai-35{animation: LP_sozai-35 2.0s 1.4s ease-in-out forwards; margin-top: -100em;}
@keyframes LP_sozai-35 {
	0% { opacity:0; }
	5% { opacity:1; }
	50% { margin-top: 0; opacity:1; }
	60% { margin-top: 0; opacity:1; }
	70% { margin-top: 0; opacity:0; }
	100% { opacity:0; }
}

#bl_loadingImageWrap .LP_sozai-38{animation: LP_sozai-38 2.0s 2.6s ease-in-out forwards; opacity:0;}
@keyframes LP_sozai-38 {
	0% { opacity:0; }
	5% { transform:translate3d(0,0,0); opacity:1; }
	30% { transform:translate3d(0,0,0); }
	50% {  transform:translate3d(-12em,0,0); opacity:1; }
	60% { opacity:0; }
	100% { transform:translate3d(-12em,0,0); opacity:0; }
}
@media screen and (max-width: 568px) {
	@keyframes LP_sozai-38 {
		0% { opacity:0; }
		5% { transform:translate3d(0,0,0); opacity:1; }
		30% { transform:translate3d(0,0,0); }
		50% {  transform:translate3d(-8.1em,0,0); }
		70% { transform:translate3d(-8.1em,0,0); opacity:1; }
		80% { opacity:0; }
		100% { transform:translate3d(-8.1em,0,0); opacity:0; }
	}
}

#bl_loadingImageWrap .LP_sozai-39{animation: LP_sozai-39 2.0s 3.6s ease-in-out forwards; opacity:0; clip-path: inset(0 75% 0 0);}
@keyframes LP_sozai-39 {
	0% { opacity:0; }
	25% { clip-path: inset(0 75% 0 0); opacity:1; }
	35% { clip-path: inset(0 0 0 0); }
	90% { opacity:1; }
	100% { clip-path: inset(0 0 0 0); opacity:0; }
}



.shutter {
	position: absolute;
	content: '';
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 1);
	animation: shutter 1.0s 5.3s ease-in-out forwards;
}
@keyframes shutter {
	0% { background: rgba(255, 255, 255, 1); opacity:1; }
	99% { background: rgba(255, 255, 255, 0); opacity:1; }
	100% { background: rgba(255, 255, 255, 0); opacity:0; }
}
#bl_loading.is-finished {
	background: transparent;
	pointer-events: none;
}


.site-body{
	position: fixed;
	background-color: #fff;
	width: 1000px;
	height: 100vh;
	top: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
}
@media screen and (max-width: 1080px) {
	.site-body{
		width: 100%;
	}
}
.innerBox {
	width: 1000px;
	margin: 0 auto;
}
@media screen and (max-width: 1080px) {
	.innerBox {
		width: 95%;
	}
}
@media screen and (max-width: 568px) {
	.innerBox {
		width: 90%;
	}
}
.br_sp {
	display: none;
}
@media screen and (max-width: 568px) {
	.br_sp {
		display: block;
	}
}
#back_text{
	position: absolute;
	user-select: none;
}
#back_text .slider-wrapper,#back_text .slider-wrapper2 {
	position: fixed;
	overflow: hidden;
}
#back_text .slider-wrapper {
	display: flex;
}
#back_text .slider-wrapper2 {
	display: block;
}
#back_text .slider,#back_text .slider2 {
	list-style: none;
	padding: 0;
}
#back_text .slider1 {
	display: flex;
	animation: scroll-left 40s infinite linear .5s both;
}
#back_text .slider2 {
	display: block;
	animation: scroll-top 40s infinite linear .5s both;
}
#back_text .slide {
	width: calc(210em / 3);
}
#back_text .slide2 {
	height: calc(210em / 3);
}
#back_text .slide p {
	opacity: 0.05;
}
#back_text .slide2 p {
	opacity: 0.05;
	writing-mode: vertical-rl;
}

@keyframes scroll-left {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-100%);
	}
}
@keyframes scroll-top {
	from {
		transform: translateY(0);
	}
	to {
		transform: translateY(-100%);
	}
}
.big_text1,.big_text2,.big_text3{
	position: absolute;
	user-select: none;
	opacity: 0.1;
}
.big_text1 p,.big_text2 p,.big_text3 p{
	font-size: 11em;
	font-weight: 900;
	line-height: 1em;
	writing-mode: vertical-rl;
	height: 10em;
}
.big_text1{
	right: -30vw;
}
.big_text2{
	top: 50em;
	left: -30vw;
}
.big_text3{
	top: 130em;
	right: -30vw;
}
@media screen and (max-width: 1080px) {
	.big_text1,.big_text2,.big_text3{
		display: none;
	}
}


#top-video{
	margin: 0;
	position: relative;
	z-index: 1;
}
#top-video img{
	position: absolute;
	width: 32em;
	margin: 34em auto 0;
	left: 0;
	right: 0;
}
@media screen and (max-width: 568px) {
	#top-video img{
		width: 22em;
		margin: 21em auto 0;
	}
}
#top-video .text{
	position: absolute;
	margin: 43em auto 0;
	left: 0;
	right: 0;
}
@media screen and (max-width: 568px) {
	#top-video .text{
		margin: 27em auto 0;
	}
}

#top-video video{
	width: 100vw;
	height: 75em;
	object-fit: cover;
}
@media screen and (max-width: 568px) {
	#top-video video{
		height: 45em;
	}
}






.deco-heading,.deco-heading2 {
	font-size:3.4em;
	letter-spacing:0.2em;
	text-align: center;
}
@media screen and (max-width: 568px) {
	.deco-heading,.deco-heading2 {
		font-size:2em;
		letter-spacing:0.1em
	}
}
.deco-heading::before,.deco-heading2::before,
.deco-heading::after,.deco-heading2::after {
	content: "";
	display: inline-block;
	width: 1em;
	height: 1em;
	background-image: url("https://clicklab.clutch-kobe.co.jp/wp-content/uploads/2026/01/bd3f7cc241cea51bbb261ce7525e477d-1.png");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	margin: 0 0.5em;
	vertical-align: -0.2em;
}
.deco-heading::before,.deco-heading::after {
	background-image: url("https://clicklab.clutch-kobe.co.jp/wp-content/uploads/2026/01/bd3f7cc241cea51bbb261ce7525e477d-1.png");
}
.deco-heading2::before,.deco-heading2::after {
	background-image: url("https://clicklab.clutch-kobe.co.jp/wp-content/uploads/2026/01/brick_color-04-1.png");
}
.deco-sub-heading{
	font-size:1.7em;
	line-height: 2em;
	margin: 3em 0;
}
@media screen and (max-width: 568px) {
	.deco-sub-heading{
		letter-spacing:-0.06em
	}
}
@media screen and (max-width: 568px) {
	.deco-heading2::before,.deco-heading2::after {
		margin: 0 0.1em;
	}
}



.seven-b_heading img{
	width:40em;
	height:auto;
}
@media screen and (max-width: 568px) {
	.seven-b_heading img{
		width:100%;
	}
}
.seven-b_list{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}
.seven-b{
	position: relative;
	width: 8em;
	margin: 0 5% 5%;
}
.seven-b:hover{
	z-index: 999;
}
.seven-b img{
	width: 100%;
	height: auto;
	transition: all .5s ease;
	transform: rotate(0);
	animation: none;
}
.seven-b img.active {
	animation: seven-b-img 0.5s ease-in-out infinite;
}
@keyframes seven-b-img {
	33% { transform: rotate(-10deg); }
	66% { transform: rotate(10deg); }
	100% { transform: rotate(0); }
}
.seven-b img:hover{
	animation: seven-b-img-hover 0.5s ease-in-out infinite;
}
@keyframes seven-b-img-hover {
	33% { transform: rotate(-10deg); }
	66% { transform: rotate(10deg); }
	100% { transform: rotate(0); }
}
.seven-b figcaption{
	opacity: 0;
	transition: 0.5s;
	background: #fff;
	box-shadow: 0.2em 0.2em 0.2em #00000030;
	position: absolute;
	padding: 1em;
	width: 10em;
	height: auto;
	text-align: center;
	border-radius: 0.5em;
	visibility: hidden;
	pointer-events: none;
	margin: -1em -2em;
}
.seven-b strong{
	font-size: 1.2em;
}
.seven-b strong span{
	color:#ea5532;
}

.seven-b:hover figcaption{
	opacity: 1;
	visibility: visible;
}
.seven-b figcaption:before {
	content: "";
	position: absolute;
	top: -2em;
	left: 50%;
	margin-left: -1em;
	border: 1em solid transparent;
	border-bottom: 1em solid #fff;
}


.egg_img{
	margin: 0em 0 54em;
	transform-origin: 30em -25em;
}
.egg_img img{
	position: absolute;
	width: 40em;
	left: 0;
	right: 0;
	margin: -46em auto 0;
}
@media screen and (max-width: 568px) {
	.egg_img{
		margin: 0em 0 22em;
		transform-origin: 11em -10em;
	}
	.egg_img img{
		width: 100%;
		margin: -22em auto 0;
	}
}

.egg_img.show{animation: img0 1.0s ease-in forwards;}
@keyframes img0 {
	0% { transform: rotate(0); }
	100% { transform: rotate(90deg); }
}
.egg_img.show .img1{animation: img1 1.0s ease-in forwards;}
@keyframes img1 {
	0% { opacity: 1; }
	100% { opacity: 0; }
}
.egg_img .img2{opacity: 0;}
.egg_img.show .img2{animation: img2 1.0s ease-in forwards;}
@keyframes img2 {
	0% { opacity: 0; }
	50% { opacity: 1; }
	90% { opacity: 1; }
	100% { opacity: 0; }
}
.egg_img .img3{opacity: 0;}
.egg_img.show .img3{animation: img3 1.0s 1.0s ease-in forwards;}
@keyframes img3 {
	0% { opacity: 0; }
	10% { transform: rotate(0deg); opacity: 1; }
	100% { transform: translate3d(0,25%,0) rotate(45deg); opacity: 1; }
}
.egg_img .img4{opacity: 0;}
.egg_img.show .img4{animation: img4 1.0s 1.0s ease-in forwards;}
@keyframes img4 {
	0% { opacity: 0; }
	10% { transform: rotate(0deg); opacity: 1; }
	100% { transform: translate3d(0,-25%,0) rotate(-45deg); opacity: 1; }
}
.egg_img .object div{
	position: absolute;
	padding: 3%;
	opacity: 0;
}
.egg_img .object div:nth-child(1){background-color: red; margin: -35% 32%;}
.egg_img .object div:nth-child(2){background-color: blue; margin: -35% 44%;}
.egg_img .object div:nth-child(3){background-color: yellow; margin: -45% 34%;}
.egg_img .object div:nth-child(4){background-color: green; margin: -55% 36%;}
.egg_img .object div:nth-child(5){background-color: purple; margin: -56% 47%;}
.egg_img .object div:nth-child(6){background-color: orange; margin: -54% 54%;}
.egg_img.show .object div{animation: object 1.0s 2.0s ease-in forwards;}
@keyframes object {
	0% { opacity: 0; }
	50% { opacity: 1; }
	100% { transform: translate3d(50em,0,0); opacity: 0; }
}


.egg_text{
	position: absolute;
	margin: -55% auto 0;
	left: 0;
	right: 0;
	z-index: 1;
}
.egg_text p{
	font-size: 1.5em;
	font-weight: 700;
	line-height: 1.5em;
}
@media screen and (max-width: 568px) {
	.egg_text{
		margin: -63% auto 0;
	}
	.egg_text p{
		font-size: 0.8em;
	}
}
.egg_wrap{
	position: absolute;
	margin: -60% auto 0;
	left: 0;
	right: 0;
	width: 40em;
}
@media screen and (max-width: 568px) {
	.egg_wrap{
		margin: -65% auto 0;
		width: 75%;
	}
}
.egg_wrap img{
	width: 100%;
}
.egg_wrap .box1,.egg_wrap .box2{
	position: absolute;
	margin: -76% auto 0;
	font-size: 1.5em;
	font-weight: 700;
	line-height: 1.2em;
	color: #fff;
}
@media screen and (max-width: 568px) {
	.egg_wrap .box1,.egg_wrap .box2{
		font-size: 0.65em;
	}
}
.egg_wrap .heading,.egg_wrap .heading{
	margin-bottom: 2em;
}
.egg_wrap .box1{
	left: 0;
	right: 46%;
}
.egg_wrap .box2{
	left: 44%;
	right: 0;
}



.acbox{
	margin: 2em auto;
	width: 95%;
}
.acbox label{
	width: auto;
	text-align: center;
	position: relative;
	display: block;
	padding: 1em;
	cursor: pointer;
	font-size: 1.5em;
	font-weight: 700;
	color: #fff;
	background-color: var(--vk-color-primary)
}
.acbox input{
	display: none;
}
.acbox label:after{
	content: "＋";
	position: absolute;
	top: 50%;
	right: 2%;
	margin-top: -0.5em;
}
.acbox input:checked ~ label::after {
	content:"―";
}
.acbox input:checked ~ .sorting{
	height: auto;
	opacity: 1;
}

.sorting{
	border: solid 10px var(--vk-color-primary);
	padding: 1.2em;

	height: 0;
	overflow: hidden;
	opacity: 0;
	transition: 0.15s;
}
.sorting .main_heading{
	font-size: 2em;
	font-weight: 700;
	line-height: 1.5em;
	color: #fff;
	text-align: center;
	margin: 0;
	background-color: var(--vk-color-primary);
}
@media screen and (max-width: 568px) {
	.sorting .main_heading{
		font-size: 1.8em;
	}
}
.sorting .list{
	text-align: left;
}
.sorting .list p{
	font-size: 1.4em;
	line-height: 1.5em;
	padding-left: 2em;
	position: relative;
}
.sorting .list p::before {
	content: ''; /* 必須 */
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%); /* 上下中央揃え */
	width: 2em;
	height: 1.5em;
	background-image: url('https://clicklab.clutch-kobe.co.jp/wp-content/uploads/2026/01/brick_color-04.png');
	background-size: contain;
	background-repeat: no-repeat;
}

.sorting .heading{
	text-align: center;
	background: #c45337;
	border-radius: 1em;
	font-size: 1.5em;
	font-weight: 700;
	color: #fff;
	padding: 0.2em;
}
.sorting .columns,.sorting .columns2{
	display: flex;
}
.sorting .columns .column{
	flex-direction: row-reverse;
}
.sorting .columns2{
	flex-direction: row-reverse;
}
.sorting .column{
	width: 50%;
	margin: auto;
}
.sorting .column:first-child img{
	width: 100%;
}
.sorting .column p{
	position: relative;
    padding: 1em;
    background-color: var(--vk-color-primary);
    color: #ffffff;
    border-radius: 1em;
    font-size: 1em;
    width: 80%;
    margin: 0.5em auto;
}
.sorting .column p::before{
	content: '';
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	border-radius: 50%;
	transform: rotate(225deg);
	left: 6em;
	bottom: -15px;
	border-left: 20px solid var(--vk-color-primary);
	border-top: 20px solid var(--vk-color-primary);
	border-right: 20px solid transparent;
	border-bottom: 20px solid transparent;
}
.sorting .column p::after{
	content: '';
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	border-radius: 50%;
	transform: rotate(225deg);
	left: 6.6em;
	bottom: -20px;
	border-left: 20px solid #ffffff;
	border-top: 20px solid #ffffff;
	border-right: 20px solid transparent;
	border-bottom: 20px solid transparent;
}
.sorting .column .face img,.sorting .column .face2 img{
	width: 6em;
}

.sorting .face2{
	transform: scale(-1, 1);
}
@media screen and (max-width: 568px) {
	.sorting .columns,.sorting .columns2{
		display: block;
	}
	.sorting .column{
		width: 100%;
	}	
}


.blocks{
	margin: 40em 0 65em;
}
.blocks img{
	position: absolute;
	width: 10em;
	left: 0;
	right: 0;
	margin: 0 auto;
}
.blocks .img03{transform: translate3d(0em, -100em, 0); opacity: 0;}
.blocks.show .img03{animation: img03 1.0s 0.9s ease-in-out forwards; opacity: 1;}
@keyframes img03 {
	0% { transform: translate3d(0em, -100em, 0); }
	100% { transform: translate3d(0em, -15em, 0); }
}

.blocks .img02{transform: translate3d(0em, -100em, 0); opacity: 0;}
.blocks.show .img02{animation: img02 1.0s 0.8s ease-in-out forwards; opacity: 1;}
@keyframes img02 {
	0% { transform: translate3d(-4.8em, -100em, 0); }
	100% { transform: translate3d(-4.8em, -9.5em, 0); }
}

.blocks .img05{transform: translate3d(0em, -100em, 0); opacity: 0;}
.blocks.show .img05{animation: img05 1.0s 0.7s ease-in-out forwards; opacity: 1;}
@keyframes img05 {
	0% { transform: translate3d(4.8em, -100em, 0); }
	100% { transform: translate3d(4.8em, -9.5em, 0); }
}

.blocks .img04{transform: translate3d(0em, -100em, 0); opacity: 0;}
.blocks.show .img04{animation: img04 1.0s 0.6s ease-in-out forwards; opacity: 1;}
@keyframes img04 {
	0% { transform: translate3d(-9.5em, -100em, 0); }
	100% { transform: translate3d(-9.5em, -4em, 0); }
}

.blocks .img07{transform: translate3d(0em, -100em, 0); opacity: 0;}
.blocks.show .img07{animation: img07 1.0s 0.5s ease-in-out forwards; opacity: 1;}
@keyframes img07 {
	0% { transform: translate3d(0em, -100em, 0); }
	100% { transform: translate3d(0, -4em, 0); }
}

.blocks .img06{transform: translate3d(0em, -100em, 0); opacity: 0;}
.blocks.show .img06{animation: img06 1.0s 0.4s ease-in-out forwards; opacity: 1;}
@keyframes img06 {
	0% { transform: translate3d(9.5em, -100em, 0); }
	100% { transform: translate3d(9.5em, -4em, 0); }
}

.blocks .img01{transform: translate3d(0em, -100em, 0); opacity: 0;}
.blocks.show .img01{animation: img01 1.0s 0.3s ease-in-out forwards; opacity: 1;}
@keyframes img01 {
	0% { transform: translate3d(-14.2em, -100em, 0); }
	100% { transform: translate3d(-14.2em, 1.5em, 0); }
}

.blocks .img05_2{transform: translate3d(0em, -100em, 0); opacity: 0;}
.blocks.show .img05_2{animation: img05_2 1.0s 0.2s ease-in-out forwards; opacity: 1;}
@keyframes img05_2 {
	0% { transform: translate3d(-4.6em, -100em, 0); }
	100% { transform: translate3d(-4.6em, 1.5em, 0); }
}

.blocks .img03_2{transform: translate3d(0em, -100em, 0); opacity: 0;}
.blocks.show .img03_2{animation: img03_2 1.0s 0.1s ease-in-out forwards; opacity: 1;}
@keyframes img03_2 {
	0% { transform: translate3d(4.6em, -100em, 0); }
	100% { transform: translate3d(4.6em, 1.5em, 0); }
}

.blocks .img02_2{transform: translate3d(0em, -100em, 0); opacity: 0;}
.blocks.show .img02_2{animation: img02_2 1.0s ease-in-out forwards; opacity: 1;}
@keyframes img02_2 {
	0% { transform: translate3d(14.2em, -100em, 0); }
	100% { transform: translate3d(14.2em, 1.5em, 0); }
}
.blocks .text1,.blocks .text2,.blocks .text3{
	position: absolute;
	transform: scale(1);
	left: 0;
	right: 0;
	font-size: 1.5em;
	font-weight: 700; 
	opacity: 0;
}
.blocks.show .text1{animation: blocks_text1 1.0s 1.1s ease-in-out forwards; transform: scale(0); opacity: 1;}
@keyframes blocks_text1 {
	0% { transform: translate3d(0, -1em, 0) scale(0); }
	50% { transform: translate3d(0, -1em, 0) scale(1.2); }
	100% { transform: translate3d(0, -1em, 0) scale(1); }
}
.blocks.show .text2{animation: blocks_text2 1.0s 1.0s ease-in-out forwards; transform: scale(0); opacity: 1;}
@keyframes blocks_text2 {
	0% { transform: translate3d(-3.2em, 2.5em, 0) scale(0); }
	50% { transform: translate3d(-3.2em, 2.5em, 0) scale(1.2); }
	100% { transform: translate3d(-3.2em, 2.5em, 0) scale(1); }
}
.blocks.show .text3{animation: blocks_text3 1.0s 0.9s ease-in-out forwards; transform: scale(0); opacity: 1;}
@keyframes blocks_text3 {
	0% { transform: translate3d(3.2em, 2.5em, 0) scale(0); }
	50% { transform: translate3d(3.2em, 2.5em, 0) scale(1.2); }
	100% { transform: translate3d(3.2em, 2.5em, 0) scale(1); }
}

.blocks .copy{
	position: absolute;
	transform: scale(1);
	margin-top: 6em;
	left: 0;
	right: 0;
	opacity: 0;
}
.blocks.show .copy{animation: copy 1.0s 1.0s ease-in-out forwards; transform: scale(0); opacity: 1;}
@keyframes copy {
	0% { transform: scale(0); }
	50% { transform: scale(1.2); }
	100% { transform: scale(1); }
}










.swiper{
	height: 48em;
	margin-bottom: 5em;
}
@media screen and (max-width: 568px) {
	.swiper{
		height: 20em;
	}
}
.swiper-slide {
	transform: scale(.7); /* 左右のスライドを小さくする */
	transition: .2s;
	width: 70vw !important;
	max-width: 40em;
}
@media screen and (max-width: 568px) {
	.swiper-slide{
		width: 20em !important;
	}
}
.swiper-slide img {
	height: auto;
	width: 100%;
	margin-top: 6em;
}
@media screen and (max-width: 568px) {
	.swiper-slide img {
		margin-top: 0;
	}
}
.swiper-slide-active {
	transform: scale(1.35); /* 中央のスライドは小さくしない */
	z-index: 1; /* 中央のスライドを一番上にする */
}
@media screen and (max-width: 568px) {
	.swiper-slide-active {
		transform: scale(1);
	}
}

.swiper-balloon {
	opacity: 0;
	transition: all .5s ease;
}
.swiper-slide-active .swiper-balloon {
	opacity: 1;
	transform: none;
}
.swiper-balloon .wrap {
	position: relative;
	border-radius: 1em;
	box-shadow: 0.2em 0.2em 0.2em #000;
	padding: 1em;
	transform: scale(0);
	transform-origin: 50% 100%;
	transition: all .5s ease;
}
.swiper-slide-active .swiper-balloon .wrap {
	transform: scale(1);
}
.swiper-balloon .wrap:before {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -1em;
	border: 1em solid transparent;
	border-top: 1em solid #fff;
}
.swiper-balloon .wrap p{
	margin: 0;
	font-size: 1.2em;
	line-height: 1.5em;
}
.swiper-pagination-bullet {
	border-radius: 0 !important;
	width: 20px !important;       /* 幅を指定 */
	height: 10px !important;      /* 高さを指定（幅と同じにすれば正方形） */
	background: #000 !important;  /* 色 */
	opacity: 0.5 !important;      /* 非アクティブ時の透過度 */
}
/* アクティブなページネーションのスタイル */
.swiper-pagination-bullet-active {
	opacity: 1 !important;        /* アクティブ時は不透明に */
	background: #333 !important;  /* アクティブ時の色 */
}
.modaal-gallery-item.is_active{
	max-width: 80em;
}
.modaal-close{
	top: -4em !important;
	right: -1em !important;
	position: absolute !important;
}


.sa.sa--scaleUp {
	opacity: 0;
	transition: all .5s ease;
}
.sa.show.sa--scaleUp {
	animation: sa--scaleUp 0.5s ease-in-out forwards; 
	transform: scale(0);
	opacity: 1;
}
@keyframes sa--scaleUp {
	0% { transform: scale(0); }
	50% { transform: scale(1.2); }
	100% { transform: none;; }
}

.site-footer{
	background: #fff;
}


#contact_button,#contact_button_fixed {
	cursor: pointer;
	width: 8em;
	z-index: 100;
}
#contact_button {
	display: block;
	position: absolute;
	margin: -9em 0 0 70em;
}
#contact_button.view {
	display:none;
}
#contact_button_fixed {
	display: none;
	position: fixed;
	margin: 0 0 0 70em;
	top: 5%;
}
#contact_button_fixed.view {
	display: flex;
}
#contact_button img,#contact_button_fixed img,#contact_button_sp img{
	width: 100%;
}
@media screen and (max-width: 1460px) {
	#contact_button,#contact_button_fixed {
		margin-left: 50em;
	}
}
@media screen and (max-width: 568px) {
	#contact_button {
		margin: -14em 0 0 18em;
		width: 4em;
	}
	#contact_button_fixed {
		margin: 0 0 0 18em;
		width: 4em;
	}
}



footer{
	position: relative;
}
footer #contact{
	text-align: center;
	background-color: #abe3ff;
	padding: 4em 0 5em;
}
footer #contact .columns{
	display: flex;
	justify-content: center;
	align-items: center;
}
footer #contact .column{
	width: 40%;
}
@media screen and (max-width: 568px) {
	footer #contact .columns{
		display: block;
	}
	footer #contact .column{
		width: 100%;
		margin-bottom: 1em;
	}
}
footer #contact .column img{
	width: 100%;
}
footer #company{
	width: 100%;
	background-color: var(--vk-color-primary);
	padding: 2.5em 0;
	color: #fff;
}
footer #company .logos{
	display: flex;
	border-bottom: solid 0.2em;
	padding-bottom: 1em;
	margin-bottom: 1em;
	align-items: end;
}
@media screen and (max-width: 568px) {
	footer #company .logos{
		display: block;
	}
}
footer #company .logo{
	width: 50%;
}
@media screen and (max-width: 568px) {
	footer #company .logo{
		width: 100%;
	}
}
footer #company .logo img{
	width: 15em;
	margin: 0em 0 -1em 0;
}
footer #company .columns{
	display: flex;
}
footer #company .column{
	width: 50%;
}
@media screen and (max-width: 568px) {
	footer #company .columns{
		display: block;
	}
	footer #company .column{
		width: 100%;
	}
}
footer #company .column img{
	width: 45%;
}
footer #company .columns .column:first-child {
    padding-right: 1em;
    margin-right: 1em;
    border-right: solid 0.2em;
}
@media screen and (max-width: 568px) {
	footer #company .columns .column:first-child {
		padding-right: 0;
		margin-right: 0;
		border-right: none;

		padding-bottom: 1em;
		margin-bottom: 1em;
		border-bottom: solid 0.2em;
	}
}

footer #copyright{
	text-align: center;
	background-color: #fff;
	padding: 0.5em 0;
}