@charset "utf-8";
/* CSS Document */



p{
	font-size: 1.6rem;
}
p,dt,dd,li{
  letter-spacing: 1px;
}

/*------------------------------------------------------------------------
	PC
------------------------------------------------------------------------*/



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


	section{
		padding-top: 200px;
	}

	.sticky_item{
		margin-top: 200px;
	}

	section.sec_1{
		position: relative;
		padding: 230px 0 150px;
		margin: 0 auto;
	}

	section.sec_1.csr{
		padding: 230px 0 0;
	}

	section.sec_1::before{
		content: "";
		display: block;
		background-color: #F0F0F0;
		min-width: 1340px;
		width: 93vw;
		height: calc(100% - 668px);
		position: absolute;
		right: 0;
		bottom: 0;
		z-index: -1;
	}

	section.sec_1.csr::before{
		height: calc(100% - 582px);
	}

	section[class^=sec_] .inner{
		padding-left: 200px;
	}

	.title_en{
		position: relative;
		padding-top: 30px;
		margin-bottom: 60px;
	}

	.title_en::before{
		content: "";
		display: block;
		background-color: #707070;
		width: 232px;
		height: 1px;
		position: absolute;
		top: 0;
		left: 0;
	}

	.title_en span.bg_text{
    letter-spacing: 10px;
		display: block;
		font-size: 8rem;
		font-weight: 700;
		color: #F2F5F9;
		line-height: 1;
		opacity: 0.6;
		position: absolute;
		top: -0.5em;
		z-index: -1;
	}

	.title_en span{
		font-size: 1.4rem;
		font-weight: 700;
    letter-spacing: 1.5px;
	}

	.title_en h1,
	.title_en h2{
		font-size: 3.4rem;
		font-weight: 700;
    letter-spacing: 2px;
	}

	section.sec_1 .movie_wrap{
		position: relative;
		margin: 0 0 100px 50px;
	}

	section.sec_1 .movie_wrap,
	section.sec_1 .movie_wrap img{
		width: 866px;
		height: 544px;
	}
	section.sec_1 .movie_wrap .square{
		width: 603px;
    height: 544px;
    margin-left: 100px;
	}
	section.sec_1 .movie_wrap img{
		position: absolute;
		top: 0;
		left: 0;
	}

	section.sec_1 .movie_wrap iframe{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}

	section.sec_1 .movie_wrap p.en{
		font-weight: 700;
		writing-mode: vertical-rl;
		opacity: 0.2;
		position: absolute;
		top: 50%;
		right: -50px;
		transform: translateY(-50%);
	}

	section.sec_1.csr .movie_wrap p.en{
		top: 37%;
	}

	section.sec_1 h2{
    letter-spacing: 5px;
		font-size: 3.4rem;
		font-weight: 500;
		margin: 0 0 70px 150px;
	}

	section.sec_1 .text{
		font-size: 1.6rem;
		width: 570px;
		margin: 0 0 0 6%;
	}

	section.sec_1 .text p,
	section.sec_1 .text ul{
		margin-bottom: 20px;
	}

	ul.disc{
		list-style: disc;
		list-style-position: inside;
		text-indent: -1.5em;
		margin-left: 1.5em;
	}

	section.sec_2{
		position: relative;
	}

	body#service section.sec_2 ul.photo_list,
	body#recruit section.sec_2 ul.photo_list{
		display: flex;
	}

	body#service section.sec_2 ul.photo_list li,
	body#recruit section.sec_2 ul.photo_list li{
		min-width: 515px;
		width: 35.7%;
	}

	body#service section.sec_2 ul.photo_list li .img_wrap,
	body#recruit section.sec_2 ul.photo_list li .img_wrap{
		width: 100%;
		height: auto;
		aspect-ratio: 515/309;
	}

	body#service section.sec_2 ul.photo_list li .img_wrap img,
	body#recruitsection.sec_2 ul.photo_list li .img_wrap img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.sticky_sec{
		display: flex;
		justify-content: center;
		position: relative;
	}

	.sticky_sec::before{
		content: "";
		display: block;
		background-color: #fff;
		min-width: 1030px;
		width: 71%;
		height: 100%;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		z-index: -1;
	}

	.sticky_sec .sticky_container{
		width: 28.5%;
		padding-left: 14%;
	}

	.sticky_sec .sticky_container .sticky_item{
		position: sticky;
		top: 100px;
	}

	.sticky_sec .sticky_container .sticky_item li{
		font-size: 1.4rem;
		font-weight: 700;
		color: #707070;
		position: relative;
		padding-left: 20px;
		margin-bottom: 15px;
	}

	.sticky_sec .sticky_container .sticky_item li.current{
		color: #333;
	}

	.sticky_sec .sticky_container .sticky_item li.current::before{
		content: "";
		display: inline-block;
		width: 15px;
		height: 15px;
		border: 1px solid #333333;
		border-radius: 50%;
		position: absolute;
		top: 50%;
		left: 0;
		transform: translateY(-50%);
	}

	.sticky_sec .sticky_container .sticky_item li.current::after{
		content: "";
		display: inline-block;
		background-color: #333;
		width: 2px;
		height: 2px;
		border-radius: 50%;
		position: absolute;
		top: 50%;
		left: 8px;
		transform: translateY(-50%);
	}

	.sticky_sec .sec_container{
		width: 71.5%;
	}

	.sticky_sec .sec_container .inner{
		width: 945px;
		padding-left: 34px;
		margin: 0;
	}

	.sticky_sec .sec_container h2{
		font-size: 3.4rem;
    letter-spacing: 2px;
		font-weight: 700;
		position: relative;
		padding-top: 45px;
		margin-bottom: 30px;
	}

	.sticky_sec .sec_container h2::before{
		content: "";
		display: block;
		background-color: #707070;
		width: 106px;
		height: 1px;
		position: absolute;
		top: 0;
		left: 0;
	}

	.sticky_sec .sec_container dl{
		display: flex;
		border-top: 1px solid #707070;
	}

	.sticky_sec .sec_container dl:last-of-type{
		border-bottom: 1px solid #707070;
	}

	.sticky_sec .sec_container dl dt,
	.sticky_sec .sec_container dl dd{
		font-size: 1.6rem;
		padding: 20px;
	}

	.sticky_sec .sec_container dl dt{
		font-weight: 700;
    width: 240px;
  }

	.sticky_sec .sec_container dl dd{
		width: calc(100% - 150px);
	}




}






/*------------------------------------------------------------------------
	SP
------------------------------------------------------------------------*/



@media screen and (max-width:767px){


	section{
		padding-top: 60px;
	}

	section.sec_1{
		position: relative;
		padding: 110px 0 40px;
		margin: 0 auto;
	}

	section.sec_1::before{
		content: "";
		display: block;
		background-color: #F0F0F0;
		width: 95%;
		height: 75%;
		position: absolute;
    top: 38%;
    right: 0;
		z-index: -1;
	}

	section.sec_1.csr::before{
		height: 37%;
		top: auto;
		bottom: 0;
	}

	.title_en{
		position: relative;
		padding-top: 30px;
		margin-bottom: 30px;
	}

	.title_en::before{
		content: "";
		display: block;
		background-color: #707070;
		width: 50px;
		height: 1px;
		position: absolute;
		top: 0;
		left: 0;
	}

	.title_en span.bg_text{
    letter-spacing: 6px;
		display: block;
		font-size: 6rem;
		font-weight: 700;
		color: #F2F5F9;
		line-height: 1;
		opacity: 0.6;
		position: absolute;
		top: -0.5em;
		z-index: -1;
	}

	.title_en span{
		font-size: 1.4rem;
		font-weight: 700;
		letter-spacing: 1.5px;
	}

	.title_en h1,
	.title_en h2{
		font-size: 2.4rem;
		font-weight: 700;
		letter-spacing: 1.5px;
	}

	section.sec_1 .movie_wrap{
		position: relative;
		margin-bottom: 50px;
	}

	section.sec_1 .movie_wrap{
		width: 100%;
		height: auto;
		aspect-ratio: 866/544;
	}
	section.sec_1 .movie_wrap img{
		width: 100%;
		height: 100%;
		object-fit: cover;
		position: absolute;
		top: 0;
		left: 0;
	}
  section.sec_1 .movie_wrap .square{
		width: 100%;
    height: auto;
		object-fit: cover;
		position: absolute;
		top: 0;
		left: 0;
	}

	section.sec_1 .movie_wrap iframe{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}

	section.sec_1 .movie_wrap p.en{
		font-size: 1.2rem;
		font-weight: 700;
		opacity: 0.2;
		position: absolute;
		bottom: -0px;
		right: 0;
		transform: translateY(-50%);
	}
  #csr section.sec_1 .movie_wrap p.en {
    bottom: -30px;
}
	#transport section.sec_1 .movie_wrap p.en {
    bottom: -30px;
}
  #about section.sec_1 .movie_wrap p.en {
    bottom: -30px;
}
  #service section.sec_1 .movie_wrap p.en {
    bottom: -30px;
}
  #recruit section.sec_1 .movie_wrap p.en {
    bottom: -30px;
}


	section.sec_1 h2{
		font-size: 2rem;
		font-weight: 500;
		margin: 0 0 30px 10px;
		letter-spacing: 2px;
	}

	section.sec_1 .text{
		font-size: 1.6rem;
		margin: 0 10px;
	}

	section.sec_1 .text p,
	section.sec_1 .text ul{
		margin-bottom: 20px;
		letter-spacing: 2px;
	}

	ul.disc{
		list-style: disc;
		list-style-position: inside;
		text-indent: -1.5em;
		margin-left: 1.5em;
	}

	section.sec_2,
	.sticky_sec{
		position: relative;
	}

	body#service section.sec_2 ul.photo_list,
	body#recruit section.sec_2 ul.photo_list{
		display: flex;
	}

	body#service section.sec_2 ul.photo_list li,
	body#recruit section.sec_2 ul.photo_list li{
		width: 50%;
		height: auto;
	}

	body#service section.sec_2 ul.photo_list li .img_wrap,
	body#service section.sec_2 ul.photo_list li .img_wrap img,
	body#recruit section.sec_2 ul.photo_list li .img_wrap,
	body#recruitsection.sec_2 ul.photo_list li .img_wrap img{
		width: 100%;
		height: 100%;
		object-fit: cover;
		aspect-ratio: 515/309;
	}

	.sticky_sec::before{
		content: "";
		display: block;
		background-color: #fff;
		width: 71%;
		height: 100%;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		z-index: -1;
	}

	.sticky_sec .sec_container h2{
		font-size: 2.4rem;
		font-weight: 700;
		position: relative;
		padding-top: 30px;
		margin-bottom: 30px;
		letter-spacing: 1.5px;
	}

	.sticky_sec .sec_container h2::before{
		content: "";
		display: block;
		background-color: #707070;
		width: 50px;
		height: 1px;
		position: absolute;
		top: 0;
		left: 0;
	}

	.sticky_sec .sec_container dl{
		border-top: 1px solid #707070;
	}

	.sticky_sec .sec_container dl:last-of-type{
		border-bottom: 1px solid #707070;
	}

	.sticky_sec .sec_container dl dt,
	.sticky_sec .sec_container dl dd{
		font-size: 1.6rem;
		padding: 10px;
	}

	.sticky_sec .sec_container dl dt{
		font-weight: 700;
	}

	.sticky_sec .sec_container dl dd{
		font-size: 1.3rem;
	}





}