@charset "UTF-8";

#scrollBtn {
	position: absolute;
	right: 50px;
	top: 0;
	bottom: 0;
	margin: auto;
	height: 200px;
	width: 10px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	
}

		#scrollBtn > li {
			display: inline-block;
			width: 50%;
			float: left;
/*
			border-left: solid 1px;
			border-bottom: solid 1px;
*/
			text-align: center;
			margin-left: 0px;
			/*! padding: 2em; */
			font-weight: bold;
			line-height: 3.5em;
			text-align: center;
			border: none;
			}

		#scrollBtn > a,
		#scrollBtn > a:link,
		#scrollBtn > a:visited {
			/*! cursor: pointer; */
			display: block;
			/*! outline: none; */
			width: 10px;
			height: 10px;
			background: #fff;
			text-decoration: none;
			/*! color: #fff; */
/* 			color: #5e9cdf; */
			/*! font-weight: normal; */
			filter: drop-shadow(0 0 5px rgba(0, 0, 100, .3));
			  /*! -ms-writing-mode: tb-rl; */
      /*! writing-mode: vertical-rl; */
			transition: .3s;
			/*! width: 2em; */
			/*! margin-bottom: 0em; */
			/*! line-height: 2em; */
			/*! padding: 2em .5em; */
      border-radius:5px;

			z-index: 1;
			position: relative;
			}
		#scrollBtn > a.active {
			background: #fc9;
			width: 5px;
			height: 30px;
/* 				background: linear-gradient(125deg, rgba(0, 183, 255,1) 0%, rgba(44, 3, 193,1) 100%);
			transition: .3s; */
}
		#scrollBtn > a.active:after {
				color: #88bbf2;
			
		}
.wrap { 
  padding-top:0;
background: url(../img/mv_backB.jpg) no-repeat;
	background-size: 100% 100vh;
	background-attachment:  fixed;
position: relative;
	display: block;
  width: 100%;
  /* height: 100vh;
  scroll-snap-type: y mandatory;
  overflow: scroll; */
	
	
}

main {
padding:0;
}

main > section,
.main > section {
	scroll-snap-align: start;
/* 	overflow: scroll; */
	height: 100vh;
	
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
	/* scroll-snap-align: start;
	scroll-snap-stop: always; */
}




.mv {
	width: 100%;
	height: 100vh;
	background: url(../img/mv_back_A.png) no-repeat;
	background-size:  100%;
	background-position: bottom  60% center;
	display: flex;
	justify-content: center;
	align-items: flex-start;
/* 	background-attachment: fixed; */
	/*! overflow: scroll; */
}

.mv h1 {
	text-align: center;
	margin-top: 40vh;

}


.sec01 {
	width: 100%;
	/*! height: 100vh; */
	background: url(../service_img/sec02_back.jpg) no-repeat,linear-gradient(#dbd7d7,#d3ced0);
	background-size:  cover;
	background-position: left 80% bottom;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--c-main);
  font-family: var(--f-min);
	flex-wrap: wrap;
	padding: 50px 0;
}
.sec01:after {
	content: "";
	flex: 0 1 200px;
	align-self: stretch;
}
.sec01dit {
	flex: 0 1 90%;
/* 	margin-right: 30%; */
	text-align: left;
	font-size: var(--f-m);
	line-height: 2;
	padding: 0 ;
}
.sec01dit h2 {
	font-size: var(--f-l);
	margin-bottom: 20px;
}
.sec01ditComme {
  margin-bottom: 30px;
  font-size: var(--f-s);
  line-height: 3;
  
}
.sec01ditBtn {
display: flex;
  justify-content:center;
  gap: 10px;
}

.sec01ditBtn a:nth-of-type(1) {
  background: #3a70a8;
  color: #fff;
/*   width: 150px; */
	flex: 1;
  height: 40px;
  line-height: 40px;
  display: block;
  text-align: center;
  font-size: var(--f-s);
	text-decoration: none;
  
}
.sec01ditBtn a:nth-of-type(2) {
  background: #b12310;
  color: #fff;
	flex: 1;
  height: 40px;
  line-height: 40px;
  display: block;
  text-align: center;
  font-size: var(--f-s);
	text-decoration: none;
  
}





.sec02 {
	width: 100%;
/* 	height: 100vh; */
  background: url(../img/mv_backC.jpg) no-repeat;
	background-size: cover;
	background-position: top center, bottom center;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	color: var(--c-base);
	text-align: center;
	padding: 50px 0;
}
.sec02 h2 {
  font-weight: normal;
	font-family: var(--f-min);
	font-size: var(--f-l);
	line-height: 1.5;
	margin-bottom: 50px;
}
.sec02_subtitle {
	font-size: var(--f-s);
	display: block;
}
.sec02_subcomme {
	font-size: var(--f-ss);
}
.sec02inner {
}

.sec02inner  img{
	width: 95%;
}






.sec03 {
	width: 100%;
	/*! height: 100vh; */
	background: url(../service_img/sec03_back.jpg) no-repeat,linear-gradient(#dbd7d7,#d3ced0);
	background-size:  cover;
	background-position: left 80% bottom;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--c-main);
  font-family: var(--f-min);
	flex-wrap: wrap;
	padding:  50px 0;
}

.sec03dit {
	flex: 0 1 90%;
	margin-right: 0%;
	text-align: center;
	font-size: var(--f-m);
	line-height: 2;
	padding: 0;
}
.sec03dit h2 {
	font-size: var(--f-l);
	text-align: left;
	margin-bottom: 1em;
}
.sec03ditComme {
  margin-bottom: 50px;
  font-size: var(--f-s);
  line-height: 3;
	text-align: left;
  
}
.sec03ditBtn {
display: flex;
  justify-content: center;
  gap: 10px;
}

.sec03ditBtn a:nth-of-type(1) {
  background: #b12310;
  color: #fff;
  width: 150px;
  height: 40px;
  line-height: 40px;
  display: block;
  text-align: center;
  font-size: var(--f-s);
	text-decoration: none;
  
}

.sec04 {
	width: 100%;
	/*! height: 100vh; */
	background: url(../service_img/sec04_back.jpg) no-repeat,linear-gradient(#dbd7d7,#d3ced0);
	background-size:  cover;
	background-position: left 80% bottom;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--c-main);
  font-family: var(--f-min);
	flex-wrap: wrap;
	padding: 50px 0;
}
.sec04 h2 {
  font-size: var(--f-l);
  margin-bottom: 20px;
	text-align: left;

}
/* .sec04:after {
	content: "";
	flex: 0 1 200px;
	align-self: stretch;
} */
.sec04dit {
	flex: 0 1 90%;
/* 	margin-right: 30%; */
	text-align: center;
	font-size: var(--f-m);
	line-height: 2;
	padding: 0;
}
.sec04ditComme {
  margin-bottom: 30px;
  font-size: var(--f-s);
  line-height: 3;
	text-align: left;
  
}
.sec04ditBtn {
display: flex;
  justify-content: center;
  gap: 10px;
}

.sec04ditBtn a:nth-of-type(1) {
  background: #b12310;
  color: #fff;
  width: 150px;
  height: 40px;
  line-height: 40px;
  display: block;
  text-align: center;
  font-size: var(--f-s);
	text-decoration: none;
  
}






.sec05 {
	width: 100%;

	justify-content: center;
	align-items: center;
	color: var(--c-main);
  font-family: var(--f-min);
	flex-wrap: wrap;
	padding: 50px 0;
	background: #fff;
}
.sec05 h2 {
  font-size: var(--f-l);
  margin-bottom: 20px;
}

.sec05dit {
width: 95%;
/* 	margin-right: 30%; */
	text-align: center;
	font-size: var(--f-m);
	line-height: 2;
	padding: 0 ;
}
.sec05dit img {
	width: 100%;
}