@charset "utf-8";

footer{
	position: relative;
	z-index: 3;
}

section.business{
	position: static;
	max-width: 1440px;
	margin: 0 auto;
}
section.business .group.mess{
	display: none !important;
}
section.business .group.grid{
	position: absolute;
	width: 1px;
	height: 100%;
	background-color: #707070;
	top: 0;
	left: 180px;
	z-index: 3;
}
section.business .group.tag{
	position: absolute;
	font-family: 'Catamaran', sans-serif;
	color: #3A8153;
	display: inline-block;
	padding: .2em .4em;
	background-color: #fff;
	font-weight: 900;
	top: 0;
	left: 180px;
	transform: translateY(150%) rotate(90deg);
	transform-origin: left center;
	z-index: 4;
}
@media screen and (min-width: 771px){

}
@media screen and (max-width: 770px){
	section.business:before{
		left: 6vw;
	}
	section.business .group.tag{
		padding: 0 1em;
		left: 6vw;
		font-size: 1rem;
	}
}

/*--------------------------------------------------------------------*/

.whereami{
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	right: 2vw;
	z-index: 10;
	flex-direction: column;
	align-items: flex-end;
}
.whereami .item a{
	display: inline-block;
}
.whereami .item{
	padding: .5em 0;
	min-height: 1em;
}
.whereami .item .name{
	opacity: 0;
	color: #ccc;
	white-space: nowrap;
	height: 0px;
	width: 0px;
	transition: opacity .3s, height .4s;
	overflow: hidden;
}
.whereami .item:hover .name{
	opacity: 1;
	height: 1em;
	width: auto;
}
.whereami .item .dot{
	width: 8px;
	height: 8px;
	background-color: #ccc;
	border-radius: 4px;
	margin-left: 1em;
}
.whereami .item.current .name{
	color: #000;
}
.whereami .item.current .dot{
	background-color: #000;
}
@media screen and (min-width: 771px){

}
@media screen and (max-width: 770px){
	.whereami{
		right: 5vw;
	}
	.whereami .item .name{
		display: none;
	}
}

/*--------------------------------------------------------------------*/

section.business .panel{
	background-color: #fff;
	flex: 1;
	margin-left: 1.2em;
	padding-left: calc(90px - 1.2em);
	position: relative;
	z-index: 1;
	width: 55%;
}
section.business .panel .state{
	background-color: #fff;
	padding: 4em 4em 4em 8em;
}
@media screen and (min-width: 771px){

}
@media screen and (max-width: 1200px) and (min-width: 599px){
	section.business .box{
		flex-direction: column;
	}
	section.business .panel{
		width: auto;
		box-sizing: border-box;
		margin-right: 1.2em;
		margin-bottom: 40vw;
	}
	
	section.business .panel .state{
		background-color: #fff;
		padding-left: 6vw;
	}
}
@media screen and (max-width: 599px){
	section.business .box.block{
		
	}
	section.business .panel{
		margin: 0 2vw;
		padding-left: calc(4vw);
		width: auto;
	}
	section.business .panel .state{
		width: auto;
		min-width: 0;
		padding: 4em 5vw;
		padding-left: 9vw;
	}
}

/*--------------------------------------------------------------------*/

section.business .each:nth-child(even) .panel{
	transform: translateX(5%);
}
section.business .image{
	transform: translateY(15%);
	position: relative;
	z-index: 0;
	padding-bottom: 1em;
	overflow: hidden;
	max-width: 537px;
}
section.business .image img{
	transform: translateY(10%);
	opacity: 0;
	transition: transform 1s, opacity .4s;
	object-fit: cover;
	width: 100%;
	height: 100%;
}
section.business .image.-anim-start img{
	transform: translateY(0%);
	opacity: 1;
}
@media screen and (min-width: 771px){

}
@media screen and (max-width: 1200px) and (min-width: 599px){
	section.business .box{
		position: relative;
	}
	section.business .each:nth-child(even) .panel{
		transform: translateX(0);
	}
	section.business .image{
		transform: translateY(-3em);
		padding-bottom: 0;
		position: absolute;
		right: 0;
		bottom: 0;
		height: 40vw;
		z-index: 2;
		width: 90%;
		max-width: none;
	}

}
@media screen and (max-width: 599px){
	section.business .each:nth-child(even) .panel{
		transform: translateX(0);
	}
	section.business .image{
		transform: translateY(-2vw);
		padding-bottom: 0;
	}
}

/*--------------------------------------------------------------------*/

section.business .heading{
	margin-bottom: 2em;
}
section.business .heading .commonIndex{
	flex-direction: column;
    align-items: flex-start;
}
section.business .heading .commonIndex .swipe{
	display: inline-block;
}
section.business .heading .commonIndex .en .swipe:first-of-type{
	margin-bottom: .1em;
}
section.business .heading .commonIndex .en .swipe:first-of-type .-label:first-letter{
	color: #3A8153;
}
section.business .heading .commonIndex .en{
	margin-bottom: 0;
	max-width: 6.9em;
}
section.business .heading .ja{
	margin: 1em 0 .5em 0;
	white-space: nowrap;
}
@media screen and (min-width: 771px){

}
@media screen and (max-width: 770px){
	section.business .heading .commonIndex .en{
		font-size: min(8.8vw, 4rem) !important;
	}
}

/*--------------------------------------------------------------------*/