/*	################################################################
	1. GENERAL STRUCTURES
################################################################# */
	* {
		margin: 0;
		padding: 0px;
	}
	html{
		/*font-size: 62.5%;*/
1
	}
body {
/* 画像ファイルの指定 */
	margin: 0;
	height: 100%;
	color: #222;
	font-family: 'Noto Sans JP', sans-serif;
	background-color: #000;
	}

h1, h2, h3, h4, h5, h6 {
	margin: 0;
  font-family: 'Noto Sans JP', sans-serif;}



p {
	padding: 0;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	font-size: 18px;
	color: #555555;
	line-height: 1.8em;
}

img {
	height: auto;
}
a {
	padding: 0;
	margin: 0;
	color: #00A6FF;
}
a:hover,
a:focus {

}
.xs { font-size: xx-small } /* 小2 */
.xm { font-size: x-small }  /* 小1 */
.sm { font-size: small }    /* 小 */
.md { font-size: medium }   /* 標準 */
.la { font-size: large }    /* 大 */
.xr { font-size: x-large;}  /* 大1 */
.xl { font-size: xx-large;} /* 大2 */
.mb18{margin-bottom: 1.8em}
.mb36{margin-bottom: 3.6em}

::-moz-selection  {
	color: #fff;
	text-shadow:none;
	background:#2B2E31;
}


/*youtube responsive*/
.video-wrap {
  position: relative;
  margin-top: 1.2em;
  margin-bottom: 1.2em;
  padding-top: 69px;
  padding-bottom: 50%;
  overflow: hidden;
}

.video-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

/*google map responsive*/
.ggmap {
position: relative;
padding-bottom: 50.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


/*	################################################################
	NAVIGATION
################################################################# */
.logo{
  top: 16px;
  left: 30px;
  position: absolute;
  z-index: 999;
}
.contact{
  top: 30px;
  right: 30px;
  position: absolute;
  z-index: 999;
}
/*	################################################################
HEADER
################################################################# */
.header_bg{
  background-color: #000;
}
.mainv img{
  width: 100vw;
  height: 100dvh;
  z-index: 1;
}

.header_t_text img {
  position: absolute;
  top: 20%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.header_b_text img{
  position: absolute;
  bottom: 5%;
  left: 50%;
  transform: translate(-50%, -50%);
}


@media screen and (max-width:768px) {
.headertext h2{
  top: 15%;
}
.header_t_text img {
  top: 15%;
}
}


/*  ################################################################
ページトップ / スクロール
################################################################# */

/*スクロール*/
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@300;400&display=swap');

.scroll_down{
  position:absolute;
  bottom:50px;
  right:50%;
  animation: arrowmove 1s ease-in-out infinite;
}

.scroll_down a{
  position: absolute;
  left: -24px;
  bottom: 30px;
  color: #FFF;
  font-size: 14px;
  font-family: 'Josefin Sans', sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
  width: 24px;
  height: 24px;
  text-decoration: none;
}

.text {
  display: block;
  margin-top: 70px;
  margin-left: -14px;
  font-size: 12px;
  color: #FFF;
  text-transform: uppercase;
  white-space: nowrap;
  letter-spacing: 2px;
}

.arrow {
  position: absolute;
  width: 28px;
  height: 5px;
  opacity: 0;
  transform: scale3d(0.5, 0.5, 0.5);
  animation: move 3s ease-out infinite;
}

.arrow:first-child {
  animation: move 3s ease-out 1s infinite;
}

.arrow:nth-child(2) {
  animation: move 3s ease-out 2s infinite;
}

.arrow:before,
.arrow:after {
  content: ' ';
  position: absolute;
  top: 0;
  height: 100%;
  width: 51%;
  background: #FFF;
}

.arrow:before {
  left: 0;
  transform: skew(0deg, 30deg);
}

.arrow:after {
  right: 0;
  width: 50%;
  transform: skew(0deg, -30deg);
}

@keyframes move {
  25% { opacity: 1; }
  33% { opacity: 1; transform: translateY(30px); }
  67% { opacity: 1; transform: translateY(40px); }
  100% { opacity: 0; transform: translateY(55px) scale3d(0.5, 0.5, 0.5); }
}


/*  ################################################################
CONTENTS
################################################################# */
.contents{
  padding: 300px 30px;
  background-color: #000;
  background: url(../../assets/img/bg2.jpg) ;
  background-size: cover;
  background-position: top;
}

.contents_space{
  margin: 500px 0 ;
}

@media screen and (max-width:768px) {
.contents{
  padding: 200px 30px;
  background-position: 75% 75%;
}
}

/*  ################################################################
CONTENTS
################################################################# */
.contents2{
  padding: 100px 30px;
  background-color: #000;
}

.contents2 p{
  margin-top: 15px;
  color: #FFFFFF;
  font-size: 16px;
  font-weight: bold;
}


@media screen and (max-width:768px) {
.contents2{
  padding: 100px 30px;
  background-position: 75% 75%;
}
}


/*  ################################################################
COMPANY
################################################################# */
.company{
  background-color: #FFFFFF;
  padding: 130px 0;
}

.company h3{
  font-size: 36px;
  color: #333333;
  line-height: 1.2em;
  font-family: 'Noto Sans JP', sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
  letter-spacing:2px;
  margin-bottom: 1.2em;
}

/* table01 */
#table01 tr {
  border-bottom: 1px solid #DDDDDD;

}

#table01 th,
#table01 td {
  padding: 24px 0;
  border: none;
}

#table01 th {
  width: 30%;
  font-size: 18px;
  font-weight: 600;
  font-family: "'Montserrat', Noto Sans JP", sans-serif;
}

#table01 td {
  font-size: 18px;
  font-weight: 400;
  font-family: "'Montserrat', Noto Sans JP", sans-serif;
  color: #555555;
}



/* sp */
@media only screen and (max-width: 480px) {
  #table01 th,
  #table01 td {
    width: 100%;
    display: block;
  }

  #table01 th {
    width: 100%;
  }

  #table01 td {
    padding-top: 0;
  }
}

/*  ################################################################
CONTACT
################################################################# */
.contact2{
  padding: 100px 0;
  margin: 0 auto;
 text-align: center;
}

.contact2 h4{
  font-weight: bold;
  color: #FFF;
}


.line2{
  background: url(../../assets/img/line2.svg) ;
  background-size: cover;
  z-index: 2;
}


/*	################################################################
COMMON
################################################################# */
.title h2{
  font-size: 54px;
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  letter-spacing:3px;
}



@media screen and (min-width:991px) {
  .sp{display: none;}
}
@media screen and (max-width:992px) {
  .pc {display: none;}
}


/*	################################################################
	FOOTER SECTION
################################################################# */
/* Footer */
footer{
  background-color: #000000;
	padding: 130px 0;
	color: white;
}
footer p{
  margin-top: 1.2em;
	color: #555555;
  font-size: 11px;
}

footer a{
  color: #FFF;
}