html,body{
	margin:0;
	padding:0;
}
@media screen and (min-width:751px){
	.pc-only{
		display:inline;
	}
	.sp-only{
		display:none;
	}
}
@media screen and (max-width:750px){
	.pc-only{
		display:none;
	}
	.sp-only{
		display:inline;
	}
}
body{
	font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
	color:#FFF;
	font-size:16px;
	-webkit-text-size-adjust: 100%;
}

/* loading */
#loader-bg {
	z-index: 9999;
	display: none;
	position: fixed;
	width: 100vw;
	height: 100vh;
	top: 0px;
	left: 0px;
	z-index: 2;
}
#loader {
	display: none;
	background-image:url(../images/logo.png);
	background-size:auto auto;
	background-repeat:no-repeat;
	background-position: center;
	width: 100vw;
	height: 100vh;
	margin:auto;
	text-align: center;
}
.load-bg{background: #000000;}

/* water-effect */
.ripple,
.ripple:before,
.ripple:after {/*疑似要素も作り、3つの波紋を作る*/
  display: block;
  border-radius: 2px;
  width: 2px;
  height: 2px;
  animation: rip 2s infinite ease-out;
}
.ripple {
  position: absolute;
  z-index: -1;
  top: 50%;
  right:0;
  left: 0;
  margin:auto;
}
.ripple:before,
.ripple:after {
  content: "";
  position: absolute;
}
.ripple:before {/*遅延させる*/
  animation-delay: 0.2s;
  top: 5px;
  left: 25px;
}
.ripple:after {/*さらに遅延*/
  animation-delay: 0.8s;
  top: 25px;
  left: 0;
}
@keyframes rip {/*keyframesで波紋セッティング*/
  0% {
    box-shadow: 0 0 0 0 transparent, 0 0 0 0 transparent, 0 0 0 0 transparent,
      0 0 0 0 transparent;
  }
  15% {
    box-shadow: 0 0 0 0 #000, 0 0 0 0 rgba(255, 255, 255, 0.4),
      0 0 0 0 #000, 0 0 0 0 rgba(0, 0, 0, 0.08);
  }
  100% {
    box-shadow: 0 0 40px 200px #000, 0 0 10px 210px transparent,
      0 0 30px 220px #000, 0 0 5px 230px transparent;
  }
}

article.contents1 section,article.contents2 section,article.contents3 section{
	padding:80px 0;
}

/* firstview */
ul.mvslider{
	margin:0;
	padding:0;
}
	ul.mvslider li{
		width:100%;
		height:85vh;
	}
	ul.mvslider li img{
		width:100%;
		height:100%;
		object-fit: cover;
	}

article.fv section{
	position:relative;
	height:98vh;
}
	article.fv section .main_scroll a {
		position:absolute;
		bottom:0;
		right:0;
		left:0;
	  z-index: 2;
	  display: block;
		text-align:center;
		margin:auto;
	  -webkit-transform: translate(0, -50%);
	  transform: translate(0, -50%);
	  text-decoration: none;
		color:#FFF;
		text-decoration:none;
	}
	article.fv section .main_scroll a span {
	  position: absolute;
	  bottom: 58px;
	  left: 50%;
	  width: 24px;
	  height: 24px;
	  margin-left: -12px;
	  border-left: 1px solid #fff;
	  border-bottom: 1px solid #fff;
	  -webkit-transform: rotate(-45deg);
	  transform: rotate(-45deg);
	  -webkit-animation: sdb 1.5s infinite;
	  animation: sdb 1.5s infinite;
	  box-sizing: border-box;
	}
		@-webkit-keyframes sdb {
		  0% {
			-webkit-transform: rotate(-45deg) translate(0, 0);
			opacity: 0;
		  }
		  50% {
			opacity: 1;
		  }
		  100% {
			-webkit-transform: rotate(-45deg) translate(-20px, 20px);
			opacity: 0;
		  }
		}
		@keyframes sdb {
		  0% {
			transform: rotate(-45deg) translate(0, 0);
			opacity: 0;
		  }
		  50% {
			opacity: 1;
		  }
		  100% {
			transform: rotate(-45deg) translate(-20px, 20px);
			opacity: 0;
		  }
		}

main{
	background:url(../images/bg.jpg);
	background-size:auto 100%;
}
/* first message */
article.contents1 section.firstmessage{
	text-align:center;
}
	article.contents1 section.firstmessage h2{
		font-size:2.2em;
	}
.firstimage{
	position:relative;
}
.firstimage .makimono{
	z-index:1;
	position:absolute;
	top:60px;
	left:0;
	box-shadow:3px 3px 10px rgba(0,0,0,0.8);
}
.bg-image-loop {
	width: 100%;
	height: 450px; /* 画像の高さを指定 */
	position: relative;
	background: url(../images/slide.jpg) repeat-x 0 0;
	background-size: auto 100%;
	animation: bg-slider 34s linear infinite;
	margin:0;
	padding: 0;
}
@keyframes bg-slider {
	from { background-position: 0 0; }
    to { background-position: 1701px 0; } 
}
@media screen and (max-width:750px){
.firstimage .makimono{
	top:0;
	width:auto;
	height:225px;
	}	
	.bg-image-loop{
		height:225px;
	}
}

ul.firstslider{
	margin:0;
	padding:0;
}
	ul.firstslider li{
		width:auto!important;
	}

.bg-video-wrap {
	z-index:2;
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100vh;
  background: url(../images/mask.png) no-repeat center center/cover;
}
.bg-video-wrap video {
  min-width: 100%;
  min-height: 100vh;
  z-index: 1;
}
.overlay {
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(0,0,0,0.7);
  z-index: 2;
}
.bg-video-wrap h1 {
  text-align: center;
  color: #fff;
  position: absolute;
  top: -100px;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 3;
  max-width: 400px;
  width: 100%;
  height: 300px;
  animation: fadeIn 15s ease 0s 1 normal;
}
@keyframes fadeIn { /*animetion-nameで設定した値を書く*/

  0% {opacity: 0} /*アニメーション開始時は不透明度0%*/

  100% {opacity: 1} /*アニメーション終了時は不透明度100%*/

}
/* about */
article.contents2{
}
article.contents2 h2{
	text-align: center;
    font-size: 2.2em;
    margin-top: 0;
    padding: 1em;
}
article.contents2 section{
	max-width:1000px;
	width:100%;
	margin:auto;
}
article.contents2 .about{
	margin-bottom:80px;
}
	article.contents2 .about .table{
		display:flex;
		justify-content: center;
		align-items: center;
		width:100%;
		height:auto;
		padding:0 2em;
	}
		article.contents2 .about .table h3{
			font-size:1.4em;
			max-width:90%;
			margin:0 5% .5em 5%;
		}
		article.contents2 .about .table p{
			max-width:90%;
			margin:0 5%;
		}
	article.contents2 .about .table.about1{
		background: linear-gradient(45deg, rgba(255, 255, 255, .2), rgba(255, 255, 255, 0));
		flex-direction:row;
	}
	article.contents2 .about .table.about2{
		background: linear-gradient(-45deg, rgba(255, 255, 255, .2), rgba(255, 255, 255, 0));
		flex-direction:row-reverse;
	}

/* item_list */
article.contents3{
	color:#000;
	padding-bottom: 100px;
}
article.contents3 section{
	max-width:1000px;
	width:100%;
	margin:auto;
}
.bx-viewport{
	background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, .1));
	color:#FFF;
	padding:1em 0;

}
.itemslider li h3{
	text-align:center;
}
.itemslider li h3:before{
	content:"『";
}
.itemslider li h3:after{
	content:"』";
}

.itemslider li .item_info{
	border: #BF9A0B 1px solid;
	display:flex;
	justify-content: flex-start;
	align-items: center;
	margin:0 1em;
	padding:1em 60px;
}
	.itemslider li .item_info .images{
		width:40%;
	}
	.itemslider li .item_info .text{
		width: 55%;
		min-height: 200px;
		padding: 0 0 0 5%;
	}
		.itemslider li .item_info .text p{
			margin-bottom:1em;
		}

		.itemslider li .item_info .text a.item_button{
			display:block;
			border:#BF9A0B 2px solid;
			background:#BF9A0B;
			color:#FFF;
			text-align:center;
			text-decoration:none;
			max-width:10em;
			height:2.6em;
			line-height:2.6em;
			padding:.3em 1.5em;
			-webkit-transition: all .3s;
			transition: all .3s;
		}
			.itemslider li .item_info .text a.item_button:hover{
				display:block;
				border:#BF9A0B 2px solid;
				color:#BF9A0B;
				background:transparent;
			}

.itemslider dl{
	display:flex;
	width:100%;
	margin:0;
}
.itemslider dt{
	min-width:3em;
}
.itemslider dd{
}
.contents3 .bx-viewport {
	height:auto!important;
}
footer{
	background:#000;
	text-align:center;
	padding:40px 0;
}
	footer .contact_button{
		position:relative;
		border:#BF9A0B 1px solid;
		color:#BF9A0B;
		text-align:center;
		text-decoration:none;
		height:3em;
		padding:.5em 2em;
		font-size: 1.4em;
		-webkit-transition: all .3s;
		transition: all .3s;
	}
		footer .contact_button:before{
			content:"";
			position:absolute;
			top:2px;
			left:2px;
			display:block;
			border:#BF9A0B 1px solid;
			width:100%;
			height:2em;
		}
	footer .contact_button:hover{
		background:#BF9A0B;
		border:#BF9A0B 1px solid;
		color:#FFF;
	}
		footer .contact_button:hover:before{
			border:#BF9A0B 1px solid;
		}

footer ul.footer_menu{
	display:flex;
	list-style:none;
	justify-content: center;
	margin-top:40px;
	padding:0;
}
	footer ul.footer_menu li{
		padding:0 1em 0 0;
	}
		footer ul.footer_menu li:after{
			content:"｜";
			color:#BF9A0B;
			padding-left:1em;
		}
		footer ul.footer_menu li:last-child:after{
			content:"";
		}
	footer ul.footer_menu li a{
		color:#FFF;
		text-decoration:none;
	}
	footer ul.footer_menu li a:hover{
		text-decoration:underline;
	}

article.contents2.company .about{
	margin-bottom:80px;
}
	article.contents2.company .about .table{
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		position: relative;
		border: #BF9A0B 1px solid;
		width: calc(70% - 4em);
		height: 480px;
		padding: 0 2em;
		margin: auto;
	}
		article.contents2.company .about .table:before{
			content:"";
			position:absolute;
			top:5px;
			left:5px;
			display:block;
			border:#BF9A0B 1px solid;
			width:100%;
			height:480px;
		}
			article.contents2.company .about .table dl{
				display:flex;
				flex-wrap:wrap;
				width:100%;
			}
			article.contents2.company .about .table dl dt{
				width:30%;
			}
			article.contents2.company .about .table dl dd{
				width:70%;
				margin:0;
				padding:0;
			}

@media (max-width: 750px) {
body{
	font-size:12px;
	-webkit-text-size-adjust: 100%;
}
.bg-video-wrap h1 {
    top: -120px;
    bottom: 0;
    max-width: 100%;
    width: 100%;
    height: 302px;
}
.bg-video-wrap h1 img{
      width: auto;
    height: 100%;
}
article.contents1 section{
	padding:0;
	margin-bottom:40px;
}
article.contents2 section,article.contents3 section{
	padding:40px 0;
}
/*loading*/
#loader-bg {
	display: none;
	position: fixed;
	width: 100vw;
	height: 100vh;
	top: 0px;
	left: 0px;
	z-index: 4;
}
#loader {
	display: none;
	background-image:url(../images/logo.png);
	background-size:auto auto;
	background-repeat:no-repeat;
	background-position: center;
	width: 100vw;
	height: 100vh;
	margin:auto;
	text-align: center;
	z-index: 5;
}
/* firstview */
ul.bxslider li{
	width:100%;
	height:75vh;
}
ul.bxslider li img{
	width:auto;
	height:100%;
	object-fit: cover;
}
article.fv section{
	position:relative;
	height:auto;
	padding-bottom:0;
}

/* first message */
article.contents1 section.firstmessage{
	text-align:center;
}
	article.contents1 section.firstmessage h2{
		font-size:1.8em;
		margin-top:0;
		padding-top:20px;
	}
ul.firstslider{
	margin:0;
	padding:0;
}
	ul.firstslider li{
		width:auto!important;
	}

/* about */
article.contents2 section{
	max-width:750px;
	width:calc(100% - 32px);
	margin:auto;
	padding:0 16px;
}
article.contents2 .about{
	margin-bottom:40px;
}
	article.contents2 .about .table{
		display:flex;
		
		justify-content: center;
		align-items: center;
		width:calc(100% - 2em);
		height:auto;
		padding:0 1em 20px 1em;
	}
	article.contents2 .about .table.about1,article.contents2 .about .table.about2{
		flex-direction:column-reverse;
	}
			article.contents2 .about .table h3{
				font-size:1.4em;
				max-width:100%;
			}
			article.contents2 .about .table p{
				max-width:100%;
			}
		article.contents2 .about1,article.contents2 .about2{
			position:relative;
		}
			article.contents2 .about1 .table{
				position:relative;
				margin:0 0 150px 0;
			}
				article.contents2 .about .table img{
					position:relative;
					top:0;
					right:0;
					left:0;
					width:80%;
					margin:auto;
				}
			article.contents2 .about2 .table{
				position:relative;
				margin:0 0 0 auto;
			}
				article.contents2 .about2 img{
					position: relative;
					top: -100px;
					right: 0;
					left: auto;
					height: 60%;
				}
			article.contents2 .about2 .table h3,article.contents2 .about2 .table p{
				margin:auto ;
			}
	
/* item_list */
article.contents3{
	color:#000;
	padding-bottom:80px;
}
article.contents3 section{
	max-width:750px;
	width:calc(100% - 32px);
	margin:auto;
	padding:0 16px;
}
.itemslider{
	margin:0;
}
.itemslider li h3{
	text-align:center;
}

.itemslider li .item_info{
	display:flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	padding:1em;
}
	.itemslider li .item_info .images{
		width:100%;
	}
	.itemslider li .item_info .text{
		text-align:12px;
		width:100%;
		padding:0 0 20px 0;
	}
		.itemslider li .item_info .text p{
			margin-bottom:0em;
		}

		.itemslider li .item_info .text a.item_button{
			margin:10px auto 0 auto;
			padding:10px 1em;
		}
footer{
	background:#000;
	text-align:center;
	padding:40px 0;
}
	footer .contact_button{
		position:relative;
		border:#BF9A0B 1px solid;
		color:#BF9A0B;
		text-align:center;
		text-decoration:none;
		height:3em;
		padding:.5em 2em;
	}
		footer .contact_button:before{
			content:"";
			position:absolute;
			top:2px;
			left:2px;
			display:block;
			border:#BF9A0B 1px solid;
			width:100%;
			height:2em;
		}
footer ul.footer_menu{
	display:flex;
	list-style:none;
	flex-direction: column;
	justify-content: center;
	margin-top:20px;
}
	footer ul.footer_menu li{
		margin-bottom:10px;
		padding:0;
	}
	footer ul.footer_menu li a{
		text-decoration:underline;
	}
		footer ul.footer_menu li:after{
			content:"";
		}
		footer ul.footer_menu li:last-child:after{
			content:"";
		}
article.contents2.company .about{
	margin-bottom:0px;
}
	article.contents2.company .about .table{
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		position: relative;
		border: #BF9A0B 1px solid;
		width: calc(90% - 4em);
		width: calc(90% - 4em);
		height: 380px;
		padding: 0 2em;
		margin: auto;
	}
		article.contents2.company .about .table:before{
			content:"";
			position:absolute;
			top:5px;
			left:5px;
			display:block;
			border:#BF9A0B 1px solid;
			width:100%;
			height:380px;
		}
			article.contents2.company .about .table dl{
				display:flex;
				flex-wrap:wrap;
				width:100%;
			}
			article.contents2.company .about .table dl dt{
				width:30%;
			}
			article.contents2.company .about .table dl dd{
				width:70%;
				margin:0;
				padding:0;
			}

}