@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Nuosu+SIL&family=Open+Sans:wght@600&display=swap');

* {
  font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, "游ゴシック体", YuGothic, YuGothic Medium, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}

body,
nav,
ol,
ul,
p,
header,
footer,
section,
div,
img,
figure {
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}

p,
h1,
h2,
h3,
h4,
h5,
h6,
li,
a,
dt,
dd,
label,
span,
input,
textarea,
th,
td,
address {
  font-size: 0.9rem;
  line-height: 1.8;
  margin: 0 0 0 0;
  padding: 0 0 0 0;
  color: #000000;
  letter-spacing:0.1em;
}

a {
  text-decoration: none;
}

a,
a:link,
a:visit,
a:hover {
  color: #000000;
}

a {
  opacity: 1.0;
  transition: .3s;
}

a:hover {
  opacity: 0.7;
  transition: .3s;
}

li {
  list-style: none;
}

img {
  max-width: 100%;
}

video {
  filter: drop-shadow(0px 0px rgba(0, 0, 0, 0));
  outline: none;
  border: none;
  width: 100%;
  max-width: 100%;
  height: 100vh;
  display: block;
  margin: auto;
  object-fit: cover;
}

.sp {
  display: block;
}

.pc {
  display: none;
}

.fadein {
  opacity: 0;
  transform: translate(0, 0);
  transition: all 2s;
}

.fadein.active {
  opacity: 1;
  transform: translate(0, 0);
}

.fadein_load {
  animation: fadein 2s forwards;
}

@keyframes fadein {
  0% {
    opacity: 0
  }

  100% {
    opacity: 1
  }
}
html{
  scroll-behavior: smooth;
}

body {
  background-color: #cca76c;
  z-index: 0;
}

/*スクロールダウン全体の場所*/
.scrolldown{
  /*描画位置※位置は適宜調整してください*/
  position:absolute;
  left:10%;
  bottom:10px;
  /*全体の高さ*/
  height:50px;
}

/*Scrollテキストの描写*/
.scrolldown span{
  /*描画位置*/
  position: absolute;
  left:-8px;
  top: -50px;
  /*テキストの形状*/
  color: #fff;
  font-size: 0.7rem;
  font-style: italic;
  letter-spacing: 0.05em;
  /*縦書き設定*/
  -ms-writing-mode: tb-rl;
  -webkit-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
  font-family: YuMincho, "Yu Mincho", YuMincho Medium, "Yu Mincho Medium", "Hiragino Mincho ProN", "serif";
  transform: rotate(-180deg);
}

/* 線の描写 */
.scrolldown{
  animation: scroldown_animation .5s infinite alternate ease-in-out;
}
@keyframes scroldown_animation {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(10px);
  }
}
.scrolldown::after{
	content: "";
  /*描画位置*/
	position: absolute;
	top: -7px;
  left: 2px;
  /*線の形状*/
	width: 0.5px;
	height: 50px;
	background: #eee;
}

.line01 {
  position: absolute;
  top: 42px;
  right: -2px;
  transform-origin: right bottom;
  width: 15px;
  height: 0.5px;
  background-color: #fff;
  transform: rotate(60deg);
}

.lt-container {
  margin: 5rem 0;
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  position: relative;
}

.lt-container>figure {
  width: 100%
}

.lt-container>.col {
  width: 100%;
}

section {
  width: 90%;
  max-width: 1056px;
  margin: 0 auto
}

#catchcopy {
  margin: 0 auto;
  padding: 5rem 0;
  width: 100%;
}

#catchcopy .catchcopy {
  width: 100%;
  font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, "游ゴシック体", YuGothic, YuGothic Medium, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-size: 1.2rem;
  letter-spacing: 0.1em;
  text-align:center;
  margin: 0 auto 0 auto;
}

#movie {
  padding: 3rem 0;
}

#movie div {
  width: 100%;
  max-width: 1056px;
  margin: 0 auto;
}

#movie div iframe {
  width: 100%;
  height: 250px;
}

#concept .lt-container {
  margin: 5rem 0;
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-content: space-between;
}

#concept .col {
  display: flex;
  align-items: flex-end;
}

#concept .concept_title {
  margin: 10px 0;
  font-size: 1.2rem;
  letter-spacing:0.1em;
}

#concept .concept_text {
  letter-spacing:0.1em;
}

.delay-time1 {
  transition-delay: 0.6s;
}

.delay-time2 {
  transition-delay: 0.9s;
}


#information{
  margin:150px auto 50px;
}

#information .logo {
  width: 280px;
  margin: 0 auto;
}

#information .home-sns {
  width: 290px;
  margin: 2rem auto;
}

#information .home-sns a {
  display: block;
  margin: 10px;
}

#information .business_hours {
  text-align: center;
  color: #fff;
}

a.bh_menu-btn-border {
  border: 2px solid #000000;
  border-radius: 0;
  background: transparent;
  box-shadow: 3px 3px 0 #000000;
  font-size: 1rem;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: .5rem 3rem;
  cursor: pointer;
  user-select: none;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #000000;
  border-radius: 0.3rem;
  margin-bottom: 35px;
  font-family:  YuMincho, "Yu Mincho", YuMincho Medium, "Yu Mincho Medium", "Hiragino Mincho ProN", "serif";
}

a.bh_menu-btn-border:hover {
  -webkit-box-shadow: -3px -3px 0 #000000;
  box-shadow: -3px -3px 0 #000000;
}

#information .bh_detail {
  font-size: 15px;
  margin-bottom: 2rem;
  line-height:1.6;
  letter-spacing:0.1em;
  font-family: YuMincho, "Yu Mincho", YuMincho Medium, "Yu Mincho Medium", "Hiragino Mincho ProN", "serif";
}

#information .address {
  text-align: center;
  margin-bottom: 3rem;
}

#information .address p {
  margin-bottom: 3rem;
}
.insta_container{
  aspect-ratio: 1/1;
}
.insta_title{
  font-family: YuMincho, "Yu Mincho", YuMincho Medium, "Yu Mincho Medium", "Hiragino Mincho ProN", "serif";
  font-size: 1.2rem;
  color: #fff;
  text-align: center;
  padding-bottom: 3rem;
}
.insta_item{
  z-index: 100000;
  height: auto;
}
#insta_feed {
  width: 100%;
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  justify-content: space-between;
}

#information .access_br {
  width: 100%;
  margin: 2em auto;
  background-color: #fff;
  margin-bottom: 100px;
}

.access_br a {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
  padding: 10px;
}
.access_br img {
  display: block; 
}
.access_br img:nth-of-type(1) {
  width: 440px;
  height: 25px; 
}
.access_br img:nth-of-type(2) {
  width: 300px;
  height: 64px;
}


footer {
  padding: 2rem 0;
}

.footer-copyright {
  font-size:0.9rem;
  text-align: center;
  color: #fff!important;
}

.footer_management{
  margin:0 auto 5px;
}

.fm_img {
  display:block;
  width:90%;
  max-width: 360px;
  margin:0 auto;
}

.fm_img img{
  width:100%;
  height:24px;
}

.footer_address {
  margin-bottom: 20px;
  letter-spacing:0.1em;
  line-height:1.8;
}

.home-sns__list {
  display: flex;
  justify-content: center;
}

.home-sns__list li a {
  vertical-align: middle;
}

.home-sns__list li a img {
  display: inline-block;
}

.footer-copyright__label{
  margin:20px 0 0;
  font-size:0.7rem;
  letter-spacing:0.1em;
}

/*========= 背景動画設定のCSS ===============*/
/*header設定*/
#header {
  position: relative;
  width: 100%;
  height: 100vh;
  /*高さを全画面にあわせる*/
  overflow: hidden;
}

#video-area {
  z-index: -1;
  /*最背面に設定*/
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  overflow: hidden;
}

#video {
  /*天地中央配置*/
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /*縦横幅指定*/
  width: 177.77777778vh;
  /* 16:9 の幅→16 ÷ 9＝ 177.77% */
  height: 56.25vw;
  /* 16:9の幅 → 9 ÷ 16 = 56.25% */
  min-height: 100%;
  min-width: 100%;
}

#catchcopy_top {
  /*要素の配置*/
  position: absolute;
  /*要素を天地中央寄せ*/
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  /*見た目の調整*/
  color: #fff;
  font-size: 20pt;
  font-family: Arial;
  animation: fadein 2s forwards;
  z-index: 10000;
  width: 90%;
  max-width:600px;
  text-align: center;
}

#catchcopy_top img {
  width: 250px;
}

@media (max-width: 768px) {
  .sp_mark {
    display: none;
  }

  #catchcopy {
    padding-bottom: 0;
  }

  #catchcopy_top {
    font-size: 1.4rem;
  }
}

@media (min-width:768px) {
  .sp_mark {
    display: inline;
  }

  .sp {
    display: none;
  }

  .pc {
    display: block;
  }

  .lt-container {
    justify-content: space-between;
  }

  .lt-container > figure {
    width: 48%
  }

  .lt-container > .col {
    width: 46%;
  }

  #movie {
    padding: 5rem 0;
  }

  #movie div iframe {
    height: 600px;
  }

  #catchcopy_top img {
    width: 300px;
  }

  #catchcopy .catchcopy {
    font-size:26px;
    margin: 5rem auto 1rem auto;
  }

  #concept .lt-container {
    justify-content: space-between;
    align-content: space-between;
  }

  #concept .lt-container:nth-of-type(odd)>figure {
    order: 0;
  }

  #concept .lt-container:nth-of-type(odd)>.col {
    order: 1;
  }

  #concept .lt-container:nth-of-type(even)>figure {
    order: 1;
  }

  #concept .lt-container:nth-of-type(even)>.col {
    order: 0;
  }

  #information .access_br a {
    justify-content: center;
  }
  a.bh_menu-btn-border {
    font-size: 1.5rem;
    line-height: 1.5;
    padding: 1rem 3.5rem;
  }
  
  a.bh_menu-btn-border:hover {
    -webkit-box-shadow: -3px -3px 0 #000000;
    box-shadow: -3px -3px 0 #000000;
  }
  
  .insta_title{
    font-size: 1.5rem;
  }
  footer ul {
    justify-content: space-between;
  }

  footer ul li {
    width: 20%;
  }

  .copyright {
    font-size: 0.7rem;
    text-align: center;
  }
}