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

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;
}
.contact{
  top: 30px;
  right: 30px;
  position: absolute;
}

@media screen and (max-width:768px) {
.logo{
  top: 5px;
  left: 15px;
}
.contact{
  top: 15px;
  right: 15px;
  position: absolute;
}
}

/*	################################################################
HEADER
################################################################# */
.mainv{
  background: url(../../assets/img/bg.jpg) ;
  background-size: cover;
  width: 100vw;
  height: 100dvh;
  z-index: 1;
}

.line{
  background: url(../../assets/img/line.svg) ;
  background-size: cover;
  width: 100vw;
  height: 100dvh;
  z-index: 2;
}

.headertext h2{
  position: absolute;
  top: 40%;
  left: 60px;
  font-size: 4vw;
  line-height: 6vw;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 600;
}

.strongblue{
  color: #FFF;
  background-color:#0045FF;
}

@media screen and (max-width:768px) {
.headertext h2{
  top: 30%;
  left: 30px;
  font-size: 10vw;
  line-height: 15vw;
}
}

/*  ################################################################
BASE BG
################################################################# */
/*.basebg{
background-color:hsla(182,32%,87%,1);
background-image:
radial-gradient(at 5% 90%, hsla(254,30%,81%,1) 0px, transparent 30%),
radial-gradient(at 1% 2%, hsla(7,27%,83%,1) 0px, transparent 30%);
}*/

.basebg{
background: url(../../assets/img/bg3.jpg) ;
background-size: cover;
}

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

/*スクロール*/
.scrollbar-text_05 {
  display: inline-block;
  position: absolute;
  bottom: 0;
  padding: 10px 10px 110px;
  color: #000;
  font-size: 14px;
  font-family: "Roboto", sans-serif;
  line-height: 1;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  writing-mode: vertical-lr;
  right: 30px;
  transform: translateX(-50%);
}

.scrollbar_05 {
  position: absolute;
  right: 65px;
  transform: translateX(-50%);
  bottom: 1px;
}

.scrollbar_05::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 1px;
  height: 100px;
  background: #000;
  animation: liner 2.5s cubic-bezier(1, 0, 0, 1) infinite;
}

@keyframes liner {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  30% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  70% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}

/*  ################################################################
SERVICE
################################################################# */
.service{
  padding: 130px 0;
}

.service 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;
}

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



/*  ################################################################
TEAMS
################################################################# */
.teams{
  padding: 130px 0;
}

.teams h3{
  font-size: 24px;
  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;
}
.teams h4{
  font-size: 14px;
  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;
}

/*  ################################################################
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;
}


.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;
}

.jpsub_title {
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #555555;

}

.jpsub_title::before {
    content: "";
    width: 40px;
    height: 1px;
    background-color: #555555;
    display: block;
    margin-right: 20px;

}

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


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

footer a{
  color: #FFF;
}