@charset "utf-8";


/* ---------------------------------------------------------------------------------------------------

共通

----------------------------------------------------------------------------------------------------*/
body {
  width: 100%;
  height: 100%;
}

#contents {
  position: relative;
  width: 100%;
  height: 100%;
  color: #fff;
  font-family: 'Noto Sans JP', "Hiragino Mincho ProN", serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "palt";
}
#contents img {
  width: 100%;
  height: auto;
}
#contents .pc {
display: block;
}
#contents .sp {
display: none;
}
header ,#sqexFooter {
  position: relative;
  z-index: 2;
}
a {
  color: #fff;
  text-decoration: none;
}

#loader-bg {
  position: fixed;
  z-index: 10000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
}
#loader-bg-inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
#loader {
  display: none;
  width: 120px;
  animation-duration: 2s;
}

.sp-bg {
  display: none;
}
.fixed {
  top: 0;
  left: 0;
  position: fixed !important;
}

.mfp-iframe-holder .mfp-close, .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close {
  opacity: 1;
  display: block;
  top: -50px;
  overflow: hidden;
  text-indent: 9999px;
  background: url(/seiken_lom/assets/common/images/menu-close-btn01.png) center right no-repeat;
  background-size: 50px auto;
}
img.mfp-img {
	padding: 0;
}

/* ----------------------------------------------------------------------------------------------------

ページタイトル

----------------------------------------------------------------------------------------------------*/
.page-head {
  padding: 150px 0 50px;
  text-align: center;
  background: none;
  font-size: 1;
  line-height: 1px;
}
.page-head-lom {
  opacity: 0;
  display: block;
  margin: 0 auto;
  width: 135px;
  animation-delay: 0s;
}
.page-head-en {
  opacity: 0;
  display: block;
  margin: 0 auto;
  width: 316px;
  animation-delay: 0.2s;
}


/* ----------------------------------------------------------------------------------------------------

メニュー

----------------------------------------------------------------------------------------------------*/
#contents .menu {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  background-color: rgba(0, 0, 0, .5);
}
#contents .nav {
  margin: 0 auto;
  max-width: 1000px;
  width: 66.666666vw;
}
.menu-logo {
  display: none;
}
#contents .nav-list {
  font-size: 0;
  border-right: 1px solid #938784;
}
#contents .nav-list-item {
  display: inline-block;
  max-width: 186px;
  width: 12.4vw;
  max-height: 70px;
  height: 9.333333vw;
  font-size: 0;
  border-left: 1px solid #938784;
  box-sizing: border-box;
}
#contents .nav-list-item:nth-of-type(1) {
  width: 16.666666vw;
  max-width: 250px;
}
#contents .nav-list-item:nth-of-type(1) img {
  width: 8.733333vw;
  max-width: 131px;
}
#contents .nav-list-item:nth-of-type(2) img {
  width: 4.866666vw;
  max-width: 73px;
}
#contents .nav-list-item:nth-of-type(3) img {
  width: 5.666666vw;
  max-width: 85px;
}
#contents .nav-list-item:nth-of-type(4) img {
  width: 8.6vw;
  max-width: 129px;
}
#contents .nav-list-item:nth-of-type(5) img {
  width: 4.733333vw;
  max-width: 71px;
}
#contents .nav-list-item a {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
}
.menu-open {
  display: none;
  position: fixed;
  top: 50%;
  right:20px;
  z-index: 9999;
  width: 70px;
}
.menu-close {
  display: none;
  position: fixed;
  top: 50%;
  right:20px;
  z-index: 9999;
  width: 70px;
}

.inner {
  margin: 0 auto;
  max-width: 1000px;
}

/* ----------------------------------------------------------------------------------------------------

パーティクル

----------------------------------------------------------------------------------------------------*/
canvas {
  background-color: transparent;
  width: 100%;
  height: 100%;
}
.canvas-wrap {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  opacity: 0.7;
}



/* ----------------------------------------------------------------------------------------------------

フッター

----------------------------------------------------------------------------------------------------*/
footer {
  position: relative;
  z-index: 2;
  background-color: #000;
  border-top: 1px solid #666;
}
.footer-banner {
	padding: 25px 0;
	text-align: center;
	font-size: center;
}
.footer-banner-item {
	display: inline-block;
	width: 246px;
}
.footer-banner-item + .footer-banner-item {
	margin-left: 30px;
}
.footer-banner-item a {
	transition: 0.3s;
}
.footer-banner-item a:hover {
	opacity: 0.5;
}
.footer-spec {
  position: relative;
  z-index: 2;
  padding: 20px 0;
  color: #fff;
  font-size: 12px;
  text-align: center;
}
.footer-spec-item {
  display: inline-block;
  margin-right: 1em;
  letter-spacing: 0.07em;
  line-height: 2;
}



/* ----------------------------------------------------------------------------------------------------

ここからスマートフォン

----------------------------------------------------------------------------------------------------*/

@media screen and (max-width:767px) {
  /* ----------------------------------------------------------------------------------------------------

  共通

  ----------------------------------------------------------------------------------------------------*/
  #contents .pc {
  display: none;
  }
  #contents .sp {
  display: block;
  }

  .sp-bg {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100vh;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  
  /* ----------------------------------------------------------------------------------------------------

  ページタイトル

  ----------------------------------------------------------------------------------------------------*/
  .page-head {
    padding: 10.666666vw 0 8vw;
  }
  .page-head-lom {
    width: 26.666666vw;
  }

  
  /* ----------------------------------------------------------------------------------------------------

  メニュー

  ----------------------------------------------------------------------------------------------------*/
  #contents .menu {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2000;
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, .85);
  }
  #contents .nav {
    margin: 0 auto;
    max-width: auto;
  }
  .menu-logo {
    display: block;
    margin: 0 auto;
    padding: 6vw 0 2.666666vw;
    width: 62.133333vw;
  }
  #contents .nav-list {
    border-right: none;
  }
  #contents .nav-list-item {
    display: block;
    margin: 0 auto;
    max-width: none;
    width: auto;
    height: 14.666666vw;
    border-left: none;
  }
  #contents .nav-list-item:nth-of-type(1) {
    width: auto;
  }
  #contents .nav-list-item:nth-of-type(1) img {
    width: 8.533333vw;
  }
  #contents .nav-list-item:nth-of-type(2) img {
    width: 19.066666vw;
  }
  #contents .nav-list-item:nth-of-type(3) img {
    width: 22.8vw;
  }
  #contents .nav-list-item:nth-of-type(4) img {
    width: 34.266666vw;
  }
  #contents .nav-list-item:nth-of-type(5) img {
    width: 18.8vw;
  }
  #contents .nav-list-item a {
  }
  .menu-open {
    display: block;
    position: fixed;
    top: 6vw;
    right: 2.666666vw;
    z-index: 1000;
    width: 12.8vw;
  }
  .menu-close {
    display: block;
    position: fixed;
    top: 6vw;
    right: 2.666666vw;
    width: 12.8vw;
  }
  
  .inner {
    margin: 0 2.666666vw;
    max-width: none;
    width: auto;
  }



  /* ----------------------------------------------------------------------------------------------------

  フッター

  ----------------------------------------------------------------------------------------------------*/
  footer {
  }
  .footer-banner {
		padding: 4vw 0;
	}
	.footer-banner-item {
		width: 45.333333vw;
	}
	.footer-banner-item + .footer-banner-item {
		margin-left: 2vw;
	}
	.footer-banner-item a:hover {
		opacity: 1;
	}
  .footer-spec {
    padding: 5.333333vw 0;
    font-size: 2.666666vw;
    text-align: left;
  }
  .footer-spec-item {
    display: block;
    margin-left: 0;
  }
}