@charset "utf-8";




@media screen and (min-width:768px){
/*pc・タブレットcss*/

.top-ttl01{
	margin-bottom:50px;
	text-align:center;
}
.top-ttl01 .jp{
	display:block;
	font-size:30px;
	line-height:1.4;
	font-weight:700;
	margin-bottom:5px;
}
.top-ttl01 .en{
	display:block;
	font-size:16px;
	line-height:1.4;
	font-weight:700;
	font-family: "Zen Old Mincho", serif;
}

/* +++++++++++++++++++++++++ */

#mv{
	position:relative;
	width:100%;
	height:108vw;
	margin-bottom:7vw;
}
#mv:before{
	content:"";
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:108vw;
	z-index:2;
	opacity: 0;
	background:url(../img/top/mv_bg01.png) no-repeat center top / 100% auto #fff;
	animation: mv_bg01 4s 0s both; 
}
#mv:after{
	content:"";
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:108vw;
	z-index:2;
	opacity: 0;
	background:url(../img/top/mv_bg02.png) no-repeat center top / 100% auto #fff;
	animation: mv_bg02 3s 3s both; 
}

#mv .mv-copy{
	position: sticky;
	z-index:3;
	width:100%;
	top:50vh;
	padding-bottom:calc(50vh + 1em);
	text-align:center;
}
#mv .mv-copy .inner{
	display:inline-block;
	font-size:40px;
	line-height:1;
	font-family: "Zen Old Mincho", serif;
	font-weight: 700;
	color:#fff;
	background-color:#18943B;
	padding:0.2em 0.4em;
	animation: mv_copy 2s 5s both; 
}

#mv .scroll-box{
	position:absolute;
	top:0;
	left:0;
	z-index:3;
	width:100%;
	height:100vh;
	animation: mv_scroll 2s 5s both; 
}
#mv .scroll-box-inner{
	position: absolute;
	bottom:3vw;
	left:50%;
	width:5vw;
	margin-left:-2.5vw;
}
#mv .scroll-txt{
	font-size:20px;
	font-weight:700;
	color:#fff;
	text-align:center;
	padding-top:3vw;
}
#mv .scroll-txt:after{
	content:"";
	position:absolute;
	left:50%;
	top:0%;
	width: 2vw;
	height: 2vw;
	margin-left:-1.2vw;
	border-top: 6px solid #fff;
	border-right: 6px solid #fff;
	transform: rotate(135deg);
}



/* +++++++++++++++++++++++++ */

@keyframes mv_bg01 {
  0% {
	opacity: 0;
  }
  100% {
	opacity: 1;
  }
}
@keyframes mv_bg02 {
  0% {
	opacity: 0;
  }
  100% {
	opacity: 1;
  }
}
@keyframes mv_copy {
  0% {
	opacity: 0;
  }
  100% {
	opacity: 1;
  }
}
@keyframes mv_scroll {
  0% {
	opacity: 0;
  }
  100% {
	opacity: 1;
  }
}

/*　上に上がる動き　*/
#mv .scroll-box-inner.MvScrollUp{
	animation: MvScrollUpAnime 0.5s forwards;
}
@keyframes MvScrollUpAnime{
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

/*　下に下がる動き　*/
#mv .scroll-box-inner.MvScrollDown{
	animation: MvScrollDownAnime 0.5s forwards;
}
@keyframes MvScrollDownAnime{
  from {
  	opacity: 0;
  }
  to {
  	opacity: 1;
  }
}

/* +++++++++++++++++++++++++ */

#philosophy{
	margin-bottom:5vw;
}
#philosophy .copy-main{
	margin-bottom:20px;
	text-align:center;
	color:#18943B;
	font-size:40px;
	line-height:1.4;
	font-weight:700;
	letter-spacing:0.01em;
	font-family: "Zen Old Mincho", serif;
}
#philosophy .copy-txt{
	margin-bottom:50px;
	text-align:center;
	color:#18943B;
}


#our-philosophy{
	padding-top:50px;
}
#our-philosophy .movie{
	width:45%;
}
#our-philosophy .txt{
	width:45%;
}
#our-philosophy .txt .ttl{
	margin-bottom:30px;
	font-size:48px;
	font-weight:700;
	letter-spacing:0.01em;
	font-family: "Zen Old Mincho", serif;
}
#our-philosophy .txt .ttl .mini{
	font-size:16px;
}
#our-philosophy .txt li{
	width:30%;
	margin-right:5%;
	margin-bottom:4%;
}
#our-philosophy .txt li a{
	display:block;
	background-color:#F2F2E9;
	text-align:center;
	padding:30px 0;
}
#our-philosophy .txt li:nth-child(3n){
	margin-right:0;
}
#our-philosophy .txt li .en{
	position:relative;
	display:block;
	margin-bottom:10px;
	padding-bottom:10px;
	font-size:30px;
	line-height:1.4;
	font-weight:700;
	letter-spacing:0.01em;
	font-family: "Zen Old Mincho", serif;
}
#our-philosophy .txt li .en:before{
	content:"";
	position:absolute;
	left:50%;
	bottom:0;
	width:2em;
	height:1px;
	margin-left:-1em;
	background-color:#000;
	-webkit-transition: all .4s; transition: all .4s;
}
#our-philosophy .txt li .en::first-letter {
	color:#B10017;
	-webkit-transition: all .4s; transition: all .4s;
}
#our-philosophy .txt li .jp{
	display:block;
	font-size:14px;
	line-height:1.4;
}

#our-philosophy .txt li a:hover{
	opacity:1;
	background-color:#B10017;
	color:#fff;
}
#our-philosophy .txt li a:hover .en:before{
	background-color:#fff;
}
#our-philosophy .txt li a:hover .en::first-letter {
	color:#DD919B;
}



/* +++++++++++++++++++++++++ */

#business{
	padding:5vw 0;
	background-color:#F2F2E9;
}
#business .top-ttl01{
	text-align:left;
}
#business .business-box > .txt{
	width:25%;
}
#business .business-box > .business-list{
	width:70%;
}
#business .copy-main{
	margin-bottom:20px;
	color:#18943B;
	font-size:40px;
	line-height:1.4;
	font-weight:700;
	letter-spacing:0.01em;
	font-family: "Zen Old Mincho", serif;
}
#business .copy-txt{
	margin-bottom:20px;
	color:#18943B;
}
#business .business-list li{
	width:15%;
	margin-right:2%;
}
#business .business-list li:nth-child(6){
	margin-right:0;
}
#business .business-list li .icon{
	margin-bottom:10px;
}
#business .business-list li .ttl{
	font-weight:700;
	font-size:16px;
}
#business .business-list li .disc{
	font-size:12px;
	line-height:1.8;
}

/* +++++++++++++++++++++++++ */

#slider-img{
	margin-bottom:8vw;
}

/* +++++++++++++++++++++++++ */

#works{
	margin-bottom:8vw;
}
#works .top-ttl01{
	text-align:left;
}
#works .works-box > .txt{
	width:30%;
}
#works .works-box > .works-list{
	width:66%;
	-webkit-box-ordinal-group: -1; -moz-box-ordinal-group: -1; -webkit-flex-order: -1; -moz-flex-order: -1; -webkit-order: -1; -moz-order: -1; order: -1;
}
#works .copy-main{
	margin-bottom:20px;
	color:#18943B;
	font-size:40px;
	line-height:1.4;
	font-weight:700;
	letter-spacing:0.01em;
	font-family: "Zen Old Mincho", serif;
}
#works .copy-txt{
	margin-bottom:50px;
	color:#18943B;
}
#works .works-list li{
	width:31%;
	margin-right:3.333%;
	margin-bottom:3%;
}
#works .works-list li:nth-child(3n){
	margin-right:0;
}
#works .works-list li .ttl{
	position: relative;
	padding:20px 20px;
	font-size:16px;
	text-align:center;
	background-color:#F2F2E9;
}
#works .works-list li .ttl:after{
	position:absolute;
	right:20px;
	top:50%;
	content:"";
	width: 8px;
	height: 8px;
	margin-top:-3px;
	border-top: 2px solid #C11920;
	border-right: 2px solid #C11920;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	-webkit-transition: all .4s;
	transition: all .4s;
}

/* ++++++ */

#works .works-list li a:hover{
	opacity:1;
}
#works .works-list li .ph{
	overflow:hidden;
}
#works .works-list li .ph img{
	-webkit-transition: all .4s;
	transition: all .4s;
}
#works .works-list li a:hover .ph img{
	transform:scale(1.1,1.1);
}
#works .works-list li .ttl{
	-webkit-transition: all .4s;
	transition: all .4s;
}
#works .works-list li a:hover .ttl{
	background-color:#B10017;
	color:#fff;
}
#works .works-list li a:hover .ttl:after{
	right:10px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
}


/* +++++++++++++++++++++++++ */

#fiximg01{
	margin-bottom:8vw;
    height:450px;
    position: relative;
    clip-path: inset(0);
}
#fiximg01 img {
    object-fit: cover;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}


/* +++++++++++++++++++++++++ */

#others{
	margin-bottom:8vw;
}
#others .top-ttl01{
	text-align:left;
}
#others #company,
#others #recruit{
	width:45%;
}
#others #company .ph,
#others #recruit .ph{
	margin-bottom:30px;
}




}



@media screen and (min-width:768px) and ( max-width:1460px) {
	
	#business .business-box > .txt br{
		display:none;
	}

}


@media screen and (min-width:768px) and ( max-width:1366px) {
	


}
@media (max-width: 768px) {

		
		
	.top-ttl01{
		margin-bottom:5vw;
	}
	.top-ttl01 .jp{
		display:block;
		font-size:22px;
		line-height:1.4;
		font-weight:700;
		margin-bottom:5px;
	}
	.top-ttl01 .en{
		display:block;
		font-size:12px;
		line-height:1.4;
		font-weight:700;
		font-family: "Zen Old Mincho", serif;
	}
	
	/* +++++++++++++++++++++++++ */
	
	#mv{
		position:relative;
		width:100%;
		height:172vw;
		margin-bottom:25vw;
	}
	#mv:before{
		content:"";
		position: absolute;
		top:12vw;
		left:0;
		width:100%;
		height:160vw;
		z-index:2;
		opacity: 0;
		background:url(../img/top/mv_bg01_sp.png) no-repeat center bottom / 100% auto #fff;
		animation: mv_bg01 4s 0s both; 
	}
	#mv:after{
		content:"";
		position: absolute;
		top:12vw;
		left:0;
		width:100%;
		height:160vw;
		z-index:2;
		opacity: 0;
		background:url(../img/top/mv_bg02_sp.png) no-repeat center bottom / 100% auto #fff;
		animation: mv_bg02 3s 3s both; 
	}
	
	#mv .mv-copy{
		position:relative;
		z-index:3;
		width:100%;
		top:15vw;
		text-align:center;
	}
	#mv .mv-copy .inner{
		display:inline-block;
		font-size:20px;
		line-height:1;
		font-family: "Zen Old Mincho", serif;
		font-weight: 700;
		animation: mv_copy 2s 5s both; 
	}
	
	#mv .scroll-box{
		position:absolute;
		bottom:-20vw;
		left:0;
		z-index:3;
		width:100%;
	}
	#mv .scroll-box-inner{
		position: absolute;
		bottom:5vw;
		left:50%;
		width:15vw;
		margin-left:-7.5vw;
	}
	#mv .scroll-txt{
		font-size:14px;
		font-weight:700;
		color:#000;
		text-align:center;
		padding-top:7vw;
	}
	#mv .scroll-txt:after{
		content:"";
		position:absolute;
		left:50%;
		top:0%;
		width: 5vw;
		height: 5vw;
		margin-left:-2.5vw;
		border-top: 3px solid #000;
		border-right: 3px solid #000;
		transform: rotate(135deg);
	}
	
	
	
	/* +++++++++++++++++++++++++ */
	
	@keyframes mv_bg01 {
	  0% {
		opacity: 0;
	  }
	  100% {
		opacity: 1;
	  }
	}
	@keyframes mv_bg02 {
	  0% {
		opacity: 0;
	  }
	  100% {
		opacity: 1;
	  }
	}
	@keyframes mv_copy {
	  0% {
		opacity: 0;
	  }
	  100% {
		opacity: 1;
	  }
	}
	
	/* +++++++++++++++++++++++++ */
	
	#philosophy{
		margin-bottom:15vw;
	}
	#philosophy .copy-main{
		margin-bottom:2vw;
		color:#18943B;
		font-size:32px;
		line-height:1.4;
		font-weight:700;
		letter-spacing:0.01em;
		font-family: "Zen Old Mincho", serif;
	}
	#philosophy .copy-txt{
		margin-bottom:5vw;
		font-size:16px;
		color:#18943B;
	}
	
	
	#our-philosophy{
		padding-top:5vw;
	}
	#our-philosophy .movie{
		width:100%;
		margin-bottom:5vw;
	}
	#our-philosophy .txt{
		width:100%;
	}
	#our-philosophy .txt .ttl{
		margin-bottom:5vw;
		font-size:35px;
		font-weight:700;
		letter-spacing:0.01em;
		font-family: "Zen Old Mincho", serif;
	}
	#our-philosophy .txt .ttl .mini{
		font-size:12px;
	}
	#our-philosophy .txt li{
		width:47.5%;
		margin-right:5%;
		margin-bottom:4%;
		background-color:#F2F2E9;
		text-align:center;
		padding:3vw 0;
	}
	#our-philosophy .txt li:nth-child(2n){
		margin-right:0;
	}
	#our-philosophy .txt li .en{
		position:relative;
		display:block;
		margin-bottom:3vw;
		padding-bottom:3vw;
		font-size:28px;
		line-height:1.4;
		font-weight:700;
		letter-spacing:0.01em;
		font-family: "Zen Old Mincho", serif;
	}
	#our-philosophy .txt li .en:before{
		content:"";
		position:absolute;
		left:50%;
		bottom:0;
		width:2em;
		height:1px;
		margin-left:-1em;
		background-color:#000;
	}
	#our-philosophy .txt li .en::first-letter {
		color:#B10017;
	}
	#our-philosophy .txt li .jp{
		display:block;
		font-size:11px;
		line-height:1.4;
	}
	
	/* +++++++++++++++++++++++++ */
	
	#business{
		padding:15vw 0;
		background-color:#F2F2E9;
	}
	#business .business-box > .txt{
		width:100%;
		margin-bottom:5vw;
	}
	#business .business-box > .business-list{
		width:100%;
	}
	#business .copy-main{
		margin-bottom:2vw;
		color:#18943B;
		font-size:28px;
		line-height:1.4;
		font-weight:700;
		letter-spacing:0.01em;
		font-family: "Zen Old Mincho", serif;
	}
	#business .copy-txt{
		margin-bottom:5vw;
		font-size:16px;
		color:#18943B;
	}
	#business .business-list li{
		width:47.5%;
		margin-right:5%;
		margin-bottom:5%;
	}
	#business .business-list li:nth-child(2n){
		margin-right:0;
	}
	#business .business-list li .icon{
		margin-bottom:3vw;
	}
	#business .business-list li .ttl{
		font-weight:700;
		font-size:16px;
	}
	#business .business-list li .disc{
		font-size:12px;
		line-height:1.8;
	}
	
	/* +++++++++++++++++++++++++ */
	
	#slider-img{
		margin-bottom:15vw;
	}
	
	/* +++++++++++++++++++++++++ */
	
	#works{
		margin-bottom:15vw;
	}
	#works .works-box > .txt{
		width:100%;
		margin-bottom:5vw;
	}
	#works .works-box > .works-list{
		width:100%;
	}
	#works .copy-main{
		margin-bottom:2vw;
		color:#18943B;
		font-size:28px;
		line-height:1.4;
		font-weight:700;
		letter-spacing:0.01em;
		font-family: "Zen Old Mincho", serif;
	}
	#works .copy-txt{
		margin-bottom:5vw;
		font-size:16px;
		color:#18943B;
	}
	#works .works-list li{
		width:47.5%;
		margin-right:5%;
		margin-bottom:5%;
	}
	#works .works-list li:nth-child(2n){
		margin-right:0;
	}
	#works .works-list li .ttl{
		position: relative;
		padding:2vw;
		text-align:center;
		background-color:#F2F2E9;
	}
	#works .works-list li .ttl:after{
		position:absolute;
		right:15px;
		top:50%;
		content:"";
		width: 6px;
		height: 6px;
		margin-top:-3px;
		border-top: 1px solid #C11920;
		border-right: 1px solid #C11920;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		-webkit-transition: all .4s;
		transition: all .4s;
	}
	
	/* +++++++++++++++++++++++++ */
	
	#fiximg01{
		margin-bottom:15vw;
		height:50vw;
		position: relative;
		clip-path: inset(0);
	}
	#fiximg01 img {
		object-fit: cover;
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}
	
	
	/* +++++++++++++++++++++++++ */
	
	#others{
		margin-bottom:15vw;
	}
	#others .top-ttl01{
		text-align:left;
	}
	#others #company{
		margin-bottom:10vw;
	}
	#others #company,
	#others #recruit{
		width:100%;
	}
	#others #company .ph,
	#others #recruit .ph{
		margin-bottom:5vw;
	}
	
	
	
	
	
	
	
				
}