@charset "utf-8";

/* Google Fonts読み込み */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');

/* フォント設定 - Mac/iOSは游明朝、Android端末はNoto Serif JPで明朝体を表示 */
body {
  font-family: '游明朝', 'YuMincho', "Noto Serif JP", serif !important;
}

#main-visual.t-e-main {
  display: flex;
  justify-content: center;
  align-items: center;
  background: url(../img/bg-hero.jpg);
}
.t-e-main .t-e-logo {
  max-width: 337px;
  width: 100%;
}

@media (max-width: 767px) {
  #main-visual.t-e-main {
    height: 300px!important;
  }
  .t-e-main .t-e-logo {
    max-width: 117px;
    transform: translateY(-20px);
  }
  #scrollIcon-wrap {
    bottom: 6px;
    width: calc(36px * 0.8);
    height: calc(57px * 0.8);
  }
  #scrollIcon-wrap img {
    width: 100%;
  }
  #scrollIcon {
    width: calc(36px * 0.7);
    height: calc(57px * 0.7);
  }
  #scrollIcon .arrow {
    width: 100%;
  }
  
}

main {
  background-color: #fff216!important;
}
#yui-logo-wrap, .yui-wrap {
  margin-top: 0;
  padding-top: 80px;
}
.t-e-logo_02 {
  display: block;
  max-width: 307px;
  width: 100%;
  margin: 56px auto 20px;
}

@media (max-width: 767px) {
  #yui-logo-wrap, .yui-wrap {
    margin-bottom: 24px;
    padding-top: 48px;
  }
  .t-e-logo_02 {
    max-width: 192px;
    margin: 24px auto 20px;
  }
}

.t-e-gallery {
  width: 100vw;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  max-width: 1600px;
  margin-bottom: 100px;
}
.gallery-container {
  width: 100%;
  overflow: hidden;
}
.gallery-track {
  display: flex;
  animation: scroll 150s linear infinite;
  width: max-content;
}
.gallery-item {
  flex: 0 0 252px;
  height: 194px;
  margin-right: 4px;
}
.gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@keyframes scroll {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-50%);
  }
}
@media (max-width: 991px) {
  .t-e-gallery {
    margin-bottom: 56px;
  }
}
@media (max-width: 767px) {
  .t-e-gallery {
    margin-bottom: 40px;
  }
}

.section-ttl.txt-medium {
  font-size: 25px;
}
.section-ttl.mt-32 {
  margin-top: 32px;
}
.section-ttl.mt-60 {
  margin-top: 60px;
}

.t-e-wrap.first-wrap {
  margin-bottom: 88px;
}
.t-e-wrap.second-wrap {
  margin-bottom: 100px;
}

.t-e-flex {
  display: flex;
  justify-content: space-between;
}

.t-e-photo {
  position: relative;
  max-width: 580px;
  width: 100%;
}
.t-e-wrap img#map {
  position: absolute;
  right: -60px;
  bottom: -75px;
}
.t-e-text {
  max-width: 440px;
}
.t-e-text .note {
  font-size: 12px;
}
@media (max-width: 1199px) {
  .t-e-photo {
    max-width: 480px;
  }
  .t-e-wrap img#map {
    width: calc(277px * 480 / 580);
    right: -40px;
    bottom: -8px;
  }
  .t-e-text {
    max-width: 400px;
  }
}
@media (max-width: 991px) {
  .t-e-flex {
    margin-left: 0;
    margin-right: 0;
    flex-direction: column;
  }
  .second-wrap .t-e-flex {
    flex-direction: column-reverse;
  }
  .t-e-photo {
    max-width: 580px;
    margin-top: 32px;
    margin-left: auto;
    margin-right: auto;
  }
  .t-e-wrap img#map {
    width: 277px;
    right: -60px;
    bottom: -75px;
  }
  .t-e-text {
    max-width: 580px;
    margin-left: auto;
    margin-right: auto;
  }

  .section-ttl.mt-32 {
    margin-top: 0;
  }
  .section-ttl.mt-60 {
    margin-top: 0;
  }

}
@media (max-width: 767px) {
  .section-ttl.txt-big {
    font-size: 20px;
  }
  
  .section-ttl {
    margin-bottom: 17px;
  }
  .section-ttl.txt-medium {
    font-size: 17px;
  }
  .section-ttl.mt-32 {
    margin-top: 0;
  }
  .section-ttl.mt-60 {
    margin-top: 0;
  }
  
  .t-e-wrap.first-wrap {
    margin-bottom: 88px;
  }
  .t-e-wrap.second-wrap {
    margin-bottom: 100px;
  }

  .t-e-photo {
    margin-top: 20px;
  }
  .t-e-text p {
    font-size: 14px;
  }
}

@media (max-width: 612px) {
  .t-e-wrap.first-wrap {
    margin-bottom: 48px;
  }
  .t-e-wrap.second-wrap {
    margin-bottom: 48px;
  }

  .t-e-wrap img#map {
    width: calc((100vw - 32px) * 277 / 580);
    right: -16px;
    bottom: -40px;
  }
}

.t-e-lineup img {
  max-width: 100%;
  width: 100%;
}

footer {
  margin-top: 0!important;
}

@media (max-width: 480px) {
  #yui-logo-wrap .container {
    padding-left: 10px;
    padding-right: 10px;
  }
  .hide-sp {
    display: none!important;
  }
}

