@charset "UTF-8";
/* CSS Document */
/**********************************************************/
/* PC */
/**********************************************************/
/* general */
html {
  font-size: 62.5%; /*16px × 62.5% = 10px*/
  width: 100%;
  height: 100%;
}

body {
  font-family: "Noto Serif JP", serif;
  font-size: 1.6rem;
  font-weight: 400;
  color: #000;
  font-feature-settings: "palt"; /* 自動カーニング */
  letter-spacing: 0.15em;
  line-height: 1;
  min-width: 1200px;
  height: 100%;
}
/* body.page-top {
  overflow: hidden;
} */

img {
  max-width: 100%;
  vertical-align: bottom;
  image-rendering: -webkit-optimize-contrast;
}

a {
  color: #4B4B4B;
  text-decoration: none;
}

a:hover {
  opacity: 0.7;
  transition: 0.3s;
}

/* ◎ここから */
* {
  box-sizing: border-box;
}

/* flex */
.flex {
  display: flex;
  justify-content: space-between;
}

/*右から左へ横並び*/
.reverse {
  flex-direction: row-reverse;
}

.flex-start {
  align-items: flex-start;
}

.pc {
  display: block;
}

.sp {
  display: none;
}

/* font-family */
/* 游明朝体 */
.sans {
  font-family: "Noto Sans JP", sans-serif;
}

.serif {
  font-family: "Noto Serif JP", serif;
}

.shippori {
  font-family: "Shippori Mincho", serif;
}

.bold {
  font-weight: bold;
}

.inner1340 {
  max-width: 1340px;
  margin: 0 auto;
}

.inner1240 {
  max-width: 1240px;
  margin: 0 auto;
}

.inner1140 {
  max-width: 1140px;
  margin: 0 auto;
}

.inner1040 {
  max-width: 1040px;
  margin: 0 auto;
}

.inner940 {
  max-width: 940px;
  margin: 0 auto;
}

/**********************************
 その場でふわっ
**********************************/
.fadeIn {
  animation-name: fadeInAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0;
}

@keyframes fadeInAnime {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/**********************************
 下からふわっ
**********************************/
.fadeUp {
  animation-name: fadeUpAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(200px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* 左から */
.fadeLeft {
  animation-name: fadeLeftAnime;
  animation-duration: 2s;
  animation-fill-mode: forwards;
  opacity: 0;
}

@keyframes fadeLeftAnime {
  from {
    opacity: 0;
    transform: translateX(-50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
.fadeInTrigger,
.fadeUpTrigger,
.fadeLeftTrigger {
  opacity: 0;
}

/**********************************
 順番にアニメーション
**********************************/
.delay-time02 {
  animation-delay: 0.2s;
}

.delay-time04 {
  animation-delay: 0.4s;
}

.delay-time06 {
  animation-delay: 0.6s;
}

.delay-time08 {
  animation-delay: 0.8s;
}

.delay-time10 {
  animation-delay: 1s;
}

.delay-time12 {
  animation-delay: 1.2s;
}

.delay-time14 {
  animation-delay: 1.4s;
}

.delay-time15 {
  animation-delay: 1.5s;
}

.delay-time22 {
  animation-delay: 2.2s;
}

.ani-box {
  opacity: 0;
}

/**********************************
ハンバーガー内
**********************************/
#g-nav {
  position: fixed;
  z-index: -1;
  opacity: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  transition: all 2.5s;
  text-align: center;
  color: #fff;
}

#g-nav.panelactive {
  opacity: 1;
  z-index: 999;
  top: 0;
	background: rgba(85,109,136,0.85);
}

#g-nav #g-nav-icon {
  opacity: 0;
}

#g-nav.panelactive #g-nav-icon {
  position: fixed;
  top: 50%;
  left: 0%;
  transform: translateY(-50%);
  z-index: 999;
  width: 50%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  opacity: 1;
}

#g-nav #g-nav-icon img {
  width: 170px;
  margin: 28px auto;
}

#g-nav #g-nav-icon .ttl {
  font-size: 2.6rem;
}

#g-nav #g-nav-icon .ttl2 {
  font-size: 3.2rem;
}
#g-nav #g-nav-icon .ttl3 {
	margin-top:30px;
  font-size: 2.6rem;
}

#g-nav.panelactive #g-nav-list {
  position: fixed;
  left: 50%;
  z-index: 999;
  width: 50%;
  height: 100vh;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

#g-nav .g-nav-box {
  display: none;
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 304px;
}

#g-nav.panelactive .g-nav-box {
  display: block;
}

#g-nav .gnav-logo {
  width: 304px;
}

#g-nav .h-nav {
  position: relative;
}

#g-nav .h-nav a {
  margin: 0 auto 0 85px;
  text-align: left;
}

#g-nav .h-nav::before {
  position: absolute;
  top: 10px;
  left: 24px;
  height: 308px;
  width: 1px;
  content: "";
  background: #fff;
}

#g-nav .h-nav::after {
  position: absolute;
  top: 10px;
  left: 28px;
  height: 308px;
  width: 1px;
  content: "";
  background: #fff;
}

#g-nav li a {
  color: #fff;
}

#g-nav li .h-nav a {
  padding: 13px 0;
  display: block;
  letter-spacing: 0.2em;
  font-size: 2rem;
}

.h-under {
  margin-left: -27px;
}

.gnav-reserve a {
  font-size: 1.3rem;
  padding: 14px 0;
  border: solid 1px #fff;
  border-radius: 34px;
  display: block;
  margin: 60px auto auto auto;
  width: 237px;
}

.gnav-sns {
  width: 120px;
  margin: 25px auto 20px auto;
}

.gnav-sns img {
  width: 33px;
}

.gnav-policy {
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  margin-bottom: 13px;
}

.g-nav-box small {
  font-size: 0.7rem;
  font-size: 10px;
  transform: scale(0.7);
  letter-spacing: 0;
}

.scrollShield {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overscroll-behavior: none;
}

.mt-175{
	margin-top: 175px;
}