@font-face {
	font-family: 'Averta';
	src: url("../fonts/Averta/TTF/Averta-Regular.ttf");
}
@font-face {
	font-family: 'Averta-Light';
	src: url("../fonts/Averta/TTF/Averta-Extrathin.ttf");
}
@font-face {
	font-family: 'Noto Sans';
	src: url("../fonts/NotoSansCJKjp-hinted/NotoSansCJKjp-Regular.otf");
}
@font-face {
	font-family: 'Noto Sans-Light';
	src: url("../fonts/NotoSansCJKjp-hinted/NotoSansCJKjp-Light.otf");
}

/** 右上メニュー START **/
header {
  width: 100%;
}
#nav-toggle {
  position: fixed;
  top: 30px;
  right: 50px;
  height: 32px;
  cursor: pointer;
  background: #000;
  width: 50px;
  height: 50px;
}
#nav-toggle > div {
  width: 20px;
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-\ transform: translateY(-50%) translateX(-50%);
}
#nav-toggle > div > span.toggle {
  width: 100%;
  height: 1px;
  left: 0;
  display: block;
  background: #fff;
  position: absolute;
  transition: top .5s ease, -webkit-transform .3s ease-in-out;
  transition: transform .3s ease-in-out, top .5s ease;
  transition: transform .3s ease-in-out, top .5s ease, -webkit-transform .3s ease-in-out;
}
header.deteal_header #nav-toggle > div > span.toggle {
  width: 100%;
  height: 1px;
  left: 0;
  display: block;
  background: #fff;
  position: absolute;
  transition: top .5s ease, -webkit-transform .3s ease-in-out;
  transition: transform .3s ease-in-out, top .5s ease;
  transition: transform .3s ease-in-out, top .5s ease, -webkit-transform .3s ease-in-out;
}
#nav-toggle span.toggle:nth-child(1) {
  top: 0;
}
#nav-toggle span.toggle:nth-child(2) {
}
#nav-toggle span.toggle:nth-child(3) {
  top: 10px;
}
.open #nav-toggle span.toggle {
  background: #fff;
}
.open #nav-toggle span.toggle:nth-child(1) {
  top: 5px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.open #nav-toggle span.toggle:nth-child(2) {
  top: 10px;
  width: 0;
  left: 50%;
}
.open #nav-toggle span.toggle:nth-child(3) {
  top: 5px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
#nav-toggle {
  z-index: 998;transform: translateZ(1px);
}
#container {
  z-index: 900;transform: translateZ(1px);
}
#gloval-nav {
  height: 100vh;
  background-color: rgba(0, 0, 0, .8);
  color: #fff;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 990;
  text-align: center;
  display: flex;
  visibility: hidden;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 29px;
  opacity: 0;
  transition: opacity .3s ease, visibility .3s ease;
}
#gloval-nav a {
  display: block;
  color: #fff;
  text-decoration: none;
  padding: 20px 0;
  transition: color .3s ease;
  font-size: .55em;
  font-family: "Averta-Light", "Noto Sans" , sans-serif;
  font-weight: 300;
  letter-spacing: .1em;
}
#gloval-nav a:hover {
  color: #666;
}
#gloval-nav ul {
  list-style: none;
  padding: 0;
}
#gloval-nav ul li {
  opacity: 0;
  -webkit-transform: translateX(200px);
  transform: translateX(200px);
  transition: opacity .2s ease, -webkit-transform .3s ease;
  transition: transform .3s ease, opacity .2s ease;
  transition: transform .3s ease, opacity .2s ease, -webkit-transform .3s ease;
}
#gloval-nav ul li:nth-child(2) {
  transition-delay: .05s;
}
#gloval-nav ul li:nth-child(3) {
  transition-delay: .15s;
}
#gloval-nav ul li:nth-child(4) {
  transition-delay: .25s;
}
.open {
  overflow: hidden;
}
.open #gloval-nav {
  visibility: visible;
  opacity: 1;
}
.open #gloval-nav li {
  opacity: 1;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  transition: opacity .9s ease, -webkit-transform 1s ease;
  transition: transform 1s ease, opacity .9s ease;
  transition: transform 1s ease, opacity .9s ease, -webkit-transform 1s ease;
  z-index: 999;
}
@media screen and (max-width: 767px) {
  #nav-toggle {
    right: 20px;
    top: 20px;
  }
  #gloval-nav a {
    padding: 10px 0;
    font-size: .5em;
  }
}
/** 右上メニュー END **/



/** ページトップ START **/
.top-wrapper {
  margin-top: -25px;
  height:100vh;
  text-align: center;
  z-index: 80;
}

.top-slide-img {
	max-width:100vw;
	min-width:100vw;
	height:100vh;
	background: center center / cover no-repeat;
}

.top-companyname {
 font-family: "Averta-Light", "Noto Sans-Light" , sans-serif;
  z-index: 100;transform: translateZ(1px);
  position: absolute;
  margin: 25vh 0 0 60px;
  text-align: left;
  font-size: 60px;
}
.top-companyname p {
  font-family: "Averta-Light", "Noto Sans-Light" , sans-serif;
  color: #FFFFFF;
  font-weight: 400;
  margin: 0;
  height: 100px;
  letter-spacing: .05em;
}
@media screen and (max-width: 767px) {
  .top-companyname {
    font-family: "Averta-Light", "Noto Sans-Light" , sans-serif;
    z-index: 1;transform: translateZ(1px);
    position: absolute;
    margin: 25vh 0 0 20px;
    text-align: left;
    font-size: 60px;
  }
  .top-companyname p {
    font-family: "Averta-Light", "Noto Sans-Light" , sans-serif;
    color: #FFFFFF;
    font-weight: 400;
    margin: 0;
    height: 80px;
    letter-spacing: .05em;
  }
}
/** ページトップ END **/

/** 本文のフォントサイズ（スマホ画面）START **/
@media screen and (max-width: 768px) {
  .entry-message,
  .member-message,
  .portfolio-message {
    font-size: 13px;
  }
}
/** 本文のフォントサイズ（スマホ画面）END **/

/* ABOUT START */
.recruit_left{
	padding: 5px 0;
	display: table-cell;
	vertical-align: middle;
	background: #464646;
	text-align:center;
	width: 100%;
	display: block;
	border-top: none;
}
.recruit_left p{
	width: 100%;
	background: 0 0;
	color: #fff;
	text-align: center;
	padding: 0px 0;
	font-weight:700;
	font-size:14.5px;
  margin: 10px 0 10px 0 !important;
}
.recruit_right{
	/* width: 100%; */
	padding: 9px 0;
	display: table-cell;
	vertical-align: middle;
	text-align:center;
}
.recruit_right p{
	background: 0 0;
	color: #1b1b1b;
	text-align: left;
	padding: 5px 10px;
	margin-bottom: 0;
	font-size:13px;
	text-align:left;
}
  @media only screen and (min-width: 769px){
  	.recruit_left{
  		width: 240px;
  		min-width: 240px;
  		padding: 15px 0;
  		display: table-cell;
  		vertical-align: middle;
  		margin:0px 0px 1px 0px;

  		flex-flow: column;
  		justify-content:space-around;
  	}
  	.recruit_left p{
  		width: 100%;
  		background: 0 0;
  		color: #fff;
  		text-align: center;
  		padding: 9px 0;
      margin: 0 0 0 0 !important;
  		font-size:14.5px;
  	}

  	.recruit_right {
  		width: 460px;
  		padding: 0px 0;
  		display: table-cell;
  		vertical-align: middle;
  		background:;
  	}
  	.recruit_right p{
  		width: 100%;
  		background: 0 0;
  		color: #1b1b1b;
  		text-align: left;
  		margin-bottom: 0;
  		font-size:14.5px;
  		text-align:left;
  		padding: 13px 30px;
  	}
  }

.dots_line {
  height: 1px;
  margin:1rem 0rem;
  position: relative;
}
.dots_line::before {
  content: "";
  background-image: linear-gradient(to right, #000, #000 3px, transparent 3px, transparent 8px);
  background-size: 8px 1px;
  background-repeat: repeat-x;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  letter-spacing: 4px;
}

.recruit-p1{
  font-size:20px;
  font-weight:400;
}

.recruit-p2{
  font-size:16px;
  margin-bottom:40px;
}

.recruit-inner{
  width:80%;
  text-align:center;
  margin: auto;
}
/* ABOUT END */

/** 連絡先ボタン START **/
@media screen and (max-width: 768px) {
  .entry .btn-custom {
    background-color: #c9ba71;
    border-color: #c9ba71;
    margin: 10px 0 10px 0 !important;
    padding: 10px 0;
    font-size: 13px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    border-radius: 30px;
    display: block;
  }
}
.entry .btn-custom {
  background-color: #c9ba71;
  border-color: #c9ba71;
  width: 270px;
  padding: 10px 0;
  font-size: 15px;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  border-radius: 30px;
  display: inline-block;
}
.btn-icon {
  font-size: 15px;
  margin: 0 5px;
}
/** 連絡先ボタン END **/

/** フッター START **/
.footer {
  background-color:#464646;
  height: 100vh;
  width: 100vw;
  min-height: 750px;
  min-width: 100vw;
}
.footer-a {
  width:20px;
}
  @media screen and (max-width: 768px) {
    .footer-a {
      color:#ffffff;
      font-size:20px;
      display: block;
      letter-spacing: .05em;
      font-weight:400;
      font-family: "Averta-Light", "Noto Sans-Light" , sans-serif;
      width:50px;
    }
    .h1-footer{
      font-family: "Averta-Light", "Noto Sans-Light" , sans-serif;
      color:#ffffff;
      font-size:60px;
    }
  }
  @media screen and (min-width: 769px) {
    .footer-a {
      color:#ffffff;
      font-size:30px;
      display: block;
      letter-spacing: .05em;
      font-family: "Averta-Light", "Noto Sans-Light" , sans-serif;
    }
    .h1-footer{
      font-family: "Averta-Light", "Noto Sans-Light" , sans-serif;
      color:#ffffff;
      font-size:80px;
    }
  }
.footer-innner{
  padding:30px;
}
.footer-innner2{
  padding-right: 30px;
  text-align: right;
}
.bottom-border {
  border: solid 0 0 1px 0 #00000;
}
.footer-icon i {
  font-size: 20px;
  padding: 0 5px;
}
.copyright{
  padding-right: 30px;
  text-align: right;
}
.copyright span {
  color: #FFFFFF;
}
/** フッター END **/


/** GoogleMap START **/
.company-map {
  padding-left: 20px;
  text-align: center;
}
/** GoogleMap END **/

/** 画像の角丸 START **/
.image-radius {
  border-radius: 20px ;
}
/** 画像の角丸 END **/

/** スライダー画像のサイズ START **/
.owl-carousel .owl-item img {
  width: 100%;
}
  @media screen and (max-width: 768px) {
    .owl-carousel .owl-item img {
      width: 75vw;
      margin: auto;
    }
  }
/** スライダー画像のサイズ END **/
