@charset "UTF-8";

:root {
  --pcvw: 1vw;
  --top-logo-width: 36.13vw;
  --scroll-height: 16vw;
}

body {
  margin: 0px;
  width: 100%;
  background-color: #fff;
  color: #000;
}

a {
  color:#000;
  text-decoration: none;
}

ul {
  padding: 0px;
  margin: 0px;
  list-style-type: none;
}

@media screen and (max-width: 736px) {
  .onlypc {
    display: none !important;
  }
  svg .onlypc {
    display: none !important;
  }
}

@media screen and (min-width: 737px) {
  .onlysp {
    display: none !important;
  }
  svg .onlysp {
    display: none !important;
  }
}

.hjss-anhor {
  position: absolute;
  top: 0px;
}

/* ダミー */
.dummy-header {
  background-color: #fff;
  width: 100%;
  height: 65px;
  border-bottom: solid 1px #999;
  display: none;
}

.dummy-footer {
  background-color: #666;
  width: 100%;
  height: 200px;
  display: none;
}

.hjss-wrap {
  position: relative;
  font-family: "Hiragino Kaku Gothic W5 JIS2004", "Hiragino Kaku Gothic ProN",
    "Hiragino Sans", "游ゴシック体", YuGothic, "游ゴシック Medium",
    "Yu Gothic Medium", Meiryo, sans-serif;
  font-weight: 500;
  font-feature-settings: "palt";
  min-height: calc(100vh - 66px);
  visibility: hidden;
  overflow-x:hidden;
}

.hjss-loaded .hjss-wrap {
  visibility: visible;
}

.hjss-modal-open .hjss-wrap {
  overflow: hidden;
  scrollbar-gutter: stable;
}

.img100 {
  width: 100%;
}

section {
  position: relative;
  /*display:inline-block;*/
}

.hjss-header-wrap {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
}

/* TOP HEADER */
.hjss-header {
  position: absolute;
  top:0px;
  width: 100%;
  z-index: 10;
}

.hjss-header-black {
  position: relative;
  filter: brightness(0);
  display: inline-block;
}

.hjss-header h1,
.menu-modal-header h1 {
  width: 45.728vw;
  margin: 5.33vw;
  line-height: 0px;
}

.hjss-header h1 img {
  width: 100%;
}

.hjss-header-menu-btn {
  position: absolute;
  right: 5.33vw;
  top: 4vw;
  width: 6.93vw;
  height: 6.93vw;
  transition:transform 0.4s ease-out;
}

.hjss-header-menu-btn.open-menu {
  transform:translate(-100%,0px) skew(45deg,0deg);
  transition:transform 0.2s ease-in;
}


.menu-modal-close-btn {
  position: absolute;
  right: 5vw;
  top: -0.53vw;
  width: 6.93vw;
  height: 6.93vw;
}

/* TOP HEADER NEWS */
.hjss-top-header {
  position: absolute;
  top: 22.72vw;
  width: 100%;
  height: 39px;
  z-index: 10;
}

.hjss-top-header-inner {
  position: relative;
  padding-top: 1px;
  display: flex;
  overflow: hidden;
  width: 100%;
  height: 38px;
}

.hjss-top-header-date,
.hjss-top-header-text {
  background-color: #bb271a;
  white-space: nowrap;
  display: flex;
  align-items: center;
  color: #fff;
}

.hjss-top-header-date {
  margin-right: 2px;
  font-size: 15px;
  padding-left: 13px;
  padding-right: 13px;
}

.hjss-top-header-text {
  font-size: 14px;
  overflow: hidden;
  flex: 1;
  display: flex;
}

.hjss-top-header-text-mask {
  position: relative;
  overflow: hidden;
  flex: 1;
}

.hjss-top-header-text-mask.news-scroll::before,
.hjss-top-header-text-mask.news-scroll::after {
  content: "";
  position: absolute;
  top: 0px;
  width: 26px;
  height: 100%;
  z-index: 1;
}

.hjss-top-header-text-mask.news-scroll::before {
  left: 0px;
  background: linear-gradient(
    to right,
    rgba(187, 39, 26, 1) 25%,
    rgba(187, 39, 26, 0) 100%
  );
}

.hjss-top-header-text-mask.news-scroll::after {
  right: 0px;
  background: linear-gradient(
    to left,
    rgba(187, 39, 26, 1) 25%,
    rgba(187, 39, 26, 0) 100%
  );
}

.hjss-top-header-text-arrow {
  width: 7px;
  padding-left: 11px;
  padding-right: 11px;
  display: none;
}

a .hjss-top-header-text-arrow {
  display: block;
}

.hjss-top-header-text-mask > div > span {
  padding-left: 13px;
  padding-right: 13px;
}

/* TOP */
.hjss-top {
  position: relative;
  width: 100%;
  height: calc(var(--vh, 1vh) * 100 - 65px);
  min-height: 150vw;
  z-index: 5;
  display: block;
}

.hjss-top-photo {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  overflow: hidden;
  clip-path: polygon(
    0% 0%,
    100% 0%,
    100% calc(100% - 40px),
    calc(100% - 40px) 100%,
    0% 100%
  );
  -webkit-clip-path: polygon(
    0% 0%,
    100% 0%,
    100% calc(100% - 40px),
    calc(100% - 40px) 100%,
    0% 100%
  );
}

.hjss-top-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hjss-top-logo {
  position: relative;
  margin: 5.33vw;
  width: var(--top-logo-width);
  visibility: hidden;
}

.hjss-top-main-text {
  position: absolute;
  /* top: 39.25vw; */
  width: 73.73vw;
  /* left: calc(50% - 36.865vw); */
  left:5.33vw;
  bottom:13.33vw;
  visibility: hidden;
  /*transform:scale(1.1);*/
}

.hjss-news-header {
  position: absolute;
}

.hjss-photo-zoom {
  transform: scale(1.05);
  transition: transform 3.2s ease-in-out;
}

.hjss-top-cover {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
  z-index: 12;
}

.hjss-top-cover::after {
  content: "";
  position: absolute;
  width: 400%;
  height: 400%;
  background-color: #fff;
  display: block;
  transform-origin: 50% 0%;
  transform: translate(-50%, 0%) rotate(-45deg);
}

.loaded.hjss-top-show .hjss-top-cover::after {
  animation: white-cover-hide-ani 0.5s 0.1s ease-in forwards;
}

@keyframes white-cover-hide-ani {
  0% {
    left: 0%;
    top: 0%;
  }
  99% {
    left: 100%;
    top: 100%;
  }
  100% {
    left: 100%;
    top: 100%;
    display: none;
  }
}

.loaded.hjss-top-show .hjss-top-logo {
  animation: top-logo-wipe-show-ani 0.4s 0.3s ease-in forwards;
}

@keyframes top-logo-wipe-show-ani {
  0% {
    visibility: visible;
    clip-path: polygon(
      calc(var(--top-logo-width) * -1) calc(var(--top-logo-width) * -1),
      calc(var(--top-logo-width)) calc(var(--top-logo-width) * -1),
      calc(var(--top-logo-width) * -1) calc(var(--top-logo-width))
    );
    -webkit-clip-path: polygon(
      calc(var(--top-logo-width) * -1) calc(var(--top-logo-width) * -1),
      calc(var(--top-logo-width)) calc(var(--top-logo-width) * -1),
      calc(var(--top-logo-width) * -1) calc(var(--top-logo-width))
    );
  }
  99% {
    visibility: visible;
    clip-path: polygon(
      0% 0%,
      calc(var(--top-logo-width) * 2) 0%,
      0% calc(var(--top-logo-width) * 2)
    );
    -webkit-clip-path: polygon(
      0% 0%,
      calc(var(--top-logo-width) * 2) 0%,
      0% calc(var(--top-logo-width) * 2)
    );
  }
  100% {
    visibility: visible;
    clip-path: none;
    -webkit-clip-path: none;
  }
}

.loaded.hjss-top-show .hjss-top-main-text {
  animation: fade-show-ani 1.2s 1s ease-out forwards;
  /*transform:scale(1);
  transition:transform 5s 1s ease-out;*/
}

@keyframes fade-show-ani {
  0% {
    visibility: visible;
    opacity: 0;
  }
  99% {
    visibility: visible;
    opacity: 1;
  }
  100% {
    visibility: visible;
    opacity: 1;
  }
}

.loaded.hjss-top-show .hjss-scroll-wrap > div {
  animation: scroll-wipe-show-ani 1s 1.5s ease-in forwards;
}

@keyframes scroll-wipe-show-ani {
  0% {
    visibility: visible;
    opacity: 0;
    clip-path: polygon(
      calc(var(--scroll-height) * -1) calc(var(--scroll-height) * -1),
      calc(var(--scroll-height)) calc(var(--scroll-height) * -1),
      calc(var(--scroll-height) * -1) calc(var(--scroll-height))
    );
    -webkit-clip-path: polygon(
      calc(var(--scroll-height) * -1) calc(var(--scroll-height) * -1),
      calc(var(--scroll-height)) calc(var(--scroll-height) * -1),
      calc(var(--scroll-height) * -1) calc(var(--scroll-height))
    );
  }
  99% {
    visibility: visible;
    opacity: 1;
    clip-path: polygon(
      0% 0%,
      calc(var(--scroll-height) * 2) 0%,
      0% calc(var(--scroll-height) * 2)
    );
    -webkit-clip-path: polygon(
      0% 0%,
      calc(var(--scroll-height) * 2) 0%,
      0% calc(var(--scroll-height) * 2)
    );
  }
  100% {
    visibility: visible;
    opacity: 1;
    clip-path: none;
    -webkit-clip-path: none;
  }
}

/*
.loaded .hjss-scroll {
  animation:scroll-loop-ani 6s infinite;
}

@keyframes scroll-loop-ani {
  0% {
    opacity:1;
    transform:translate(0%,0%);
  }
  55% {
    opacity:1;
    transform:translate(0%,0%);
  }
  69% {
    opacity:0;
    transform:translate(0%,20%);
    animation-timing-function: ease-in;
  }
  71% {
    opacity:0;
    transform:translate(0%,-20%);
    animation-timing-function: ease-out;
  }
  85% {
    opacity:1;
    transform:translate(0%,-0%);
    animation-timing-function: ease-out;
  }
  100% {
    opacity:1;
    transform:translate(0%,0%);
  }
}

.loaded .hjss-scroll-icon {
  animation:scroll-icon-loop-ani 6s infinite;
}

@keyframes scroll-icon-loop-ani {
  0% {
    transform:translate(0%,0%);
  }
  55% {
    transform:translate(0%,0%);
    animation-timing-function: ease-out;
  }
  63% {
    transform:translate(0%,70%);
    animation-timing-function: ease-in;
  }
  80% {
    transform:translate(0%,0%);
  }
  100% {
    transform:translate(0%,0%);
  }
}
*/

/* news tpics */
.hjss-news 
.hjss-topics {
  position: relative;
  width: 100%;
}

.hjss-topics h2 {
  width:18.93vw;
  margin:8.61vw auto 3.2vw 8.13vw;
  line-height:0px;
}

.hjss-news ul,
.hjss-topics ul {
  width: 84vw;
  margin: 8vw auto;
}

.hjss-topics ul {
  margin-top:0px;
}

.hjss-news li,
.hjss-topics li {
  margin: 0px 0px 2.67vw;
  padding-bottom: 2.67vw;
}

.hjss-news li {
  border-bottom: 1px #cccccc solid;
}

.hjss-news li a,
.hjss-topics li a {
  color: #000;
}

.hjss-news-img {
  line-height: 0px;
  display: none;
}

.hjss-news h3,
.hjss-topics h3 {
  font-size: 16px;
  margin: 5px 0px 7px;
}

.hjss-topics a h3 {
  text-decoration: underline;
}

.hjss-news p,
.hjss-topics p {
  font-size: 14px;
  margin: 0px;
  color: #808080;
}

.hjss-topics p {
  font-size:16px;
}

.hjss-news time,
.hjss-topics time {
  font-size: 14px;
  margin: 0px;
  color: #808080;
}

/* statement */
.hjss-statement {
  position: relative;
  /*  margin:0px 8vw;
  width:84vw;*/
  width: 100%;
  z-index: 0;
  margin-bottom: 8vw;
}

.hjss-text-wrap,
.hjss-text-wrap2,
.hjss-text-wrap3 {
  position: relative;
  margin: 0px 8vw;
  width: 84vw;
}

.hjss-statement > h2,
.hjss-statement > p {
  width: 100%;
  line-height: 0px;
}

.hjss-statement1 {
  margin: 0px 0px 5.47vw;
}

.hjss-statement2 {
  margin: 6.69vw 0px;
}

.hjss-statement3 {
  margin: 8.16vw 0px;
}

.hjss-faq-btn,
.hjss-mail-btn,
.hjss-mail2-btn,
.hjss-accept-btn,
.hjss-reject-btn,
.hjss-fly-btn,
.hjss-mini-fly-btn,
.hjss-contact-btn {
  display: block;
  margin: 5.33vw 0px;
}

.hjss-faq-btn > div,
.hjss-mail-btn > div,
.hjss-mail2-btn > div,
.hjss-accept-btn > div,
.hjss-reject-btn > div,
.hjss-fly-btn > div,
.hjss-mini-fly-btn > div,
.hjss-contact-btn > div {
  position: relative;
  width: 100%;
  height: 22.93vw;
  border: none;
  overflow: hidden;
  line-height: 0px;
  cursor: pointer;
  clip-path: polygon(
    0px 0px,
    100% 0px,
    100% calc(100% - 4.8vw),
    calc(100% - 4.8vw) 100%,
    0px 100%
  );
  -webkit-clip-path: polygon(
    0px 0px,
    100% 0px,
    100% calc(100% - 4.8vw),
    calc(100% - 4.8vw) 100%,
    0px 100%
  );
}

.hjss-reject-btn > div {
  clip-path: polygon(
    0px 0px,
    100% 0px,
    100% 100%,
    4.8vw 100%,
    0px calc(100% - 4.8vw)
  );
  -webkit-clip-path: polygon(
    0px 0px,
    100% 0px,
    100% 100%,
    4.8vw 100%,
    0px calc(100% - 4.8vw)
  );
}

.hjss-fly-btn > div,
.hjss-mini-fly-btn > div,
.hjss-mail2-btn > div,
.hjss-contact-btn > div {
  background-color: #cc0000;
}

.hjss-faq-btn > div,
.hjss-mail-btn > div,
.hjss-accept-btn > div,
.hjss-reject-btn > div {
  background-color: #000000;
}

.hjss-faq-btn > div > div,
.hjss-mail-btn > div > div,
.hjss-accept-btn > div > div {
  position: absolute;
  width: calc(100% - 1.6vw);
  height: calc(100% - 1.6vw);
  left: 0.8vw;
  top: 0.8vw;
  border: none;
  overflow: hidden;
  background-color: #fff;
  clip-path: polygon(
    0px 0px,
    100% 0px,
    100% calc(100% - 4.4vw),
    calc(100% - 4.4vw) 100%,
    0px 100%
  );
  -webkit-clip-path: polygon(
    0px 0px,
    100% 0px,
    100% calc(100% - 4.4vw),
    calc(100% - 4.4vw) 100%,
    0px 100%
  );
}

.hjss-faq-btn-text {
  position: absolute;
  width: 32.59vw;
  left: 5.39vw;
  top: calc(50% - 2.29vw);
  filter: brightness(0);
}

.hjss-mail2-btn-text {
  position: absolute;
  width: 56.74vw;
  left: 4.91vw;
  top: calc(50% - 2.24vw);
}

.hjss-contact-btn-text {
  position: absolute;
  width: 26vw;
  left: 5.97vw;
  top: calc(50% - 1.76vw);
}

.hjss-mail-btn-text {
  position: absolute;
  width: 47.5vw;
  left: 4.59vw;
  top: calc(50% - 2.21vw);
  filter: brightness(0);
}

.hjss-accept-btn-text {
  position: absolute;
  width: 18.12vw;
  left: 31.6vw;
  top: calc(50% - 2.24vw);
  filter: brightness(0);
}

.hjss-reject-btn-text {
  position: absolute;
  width: 23.25vw;
  left: 31.6vw;
  top: calc(50% - 2.24vw);
}

.hjss-fly-btn-text {
  position: absolute;
  width: 26.523vw;
  left: 5.87vw;
  top: calc(50% - 2.24vw);
}

.hjss-contact-btn-arrow,
.hjss-fly-btn-arrow {
  position: absolute;
  width: 2.73vw;
  top: calc(50% - 2.17vw);
  right: 7.01vw;
}

.hjss-faq-btn-arrow {
  position: absolute;
  width: 2.73vw;
  top: calc(50% - 2.17vw);
  right: 7.01vw;
  filter: brightness(0);
}

.hjss-mail-btn-icon {
  position: absolute;
  width: 6.67vw;
  top: calc(50% - 2.67vw);
  right: 6.77vw;
  filter: brightness(0);
}

.hjss-mail2-btn-icon {
  position: absolute;
  width: 6.67vw;
  top: calc(50% - 2.67vw);
  right: 7.57vw;
}

.hjss-accept-btn-icon {
  position: absolute;
  width: 2.93vw;
  top: calc(50% - 2.27vw);
  right: 7.01vw;
  filter: brightness(0);
}

.hjss-reject-btn-icon {
  position: absolute;
  width: 2.93vw;
  top: calc(50% - 2.27vw);
  left: 7.87vw;
}

/* トップ動画 */
.hjss-top-movie {
  position: relative;
  width: 100%;
  line-height: 0px;
}

.hjss-top-movie iframe {
  width: 84vw;
  height: 47.25vw;
  margin: 0px 8vw;
}

/* About */
/*
.hjss-about {
  margin:8vw 0px;
}

.hjss-about h2 {
  width:25.1vw;
  margin:9.33vw 0px;
  line-height: 0px;
}

.hjss-about-text {
  width:80.69vw;
  line-height: 0px;
}

.hjss-about-more-btn {
  margin:9.33vw 0px;
  display:block;
  line-height: 0px;
}

.hjss-about-more-btn > div {
  display:flex;
}

.hjss-about-more-btn > div > img:first-child {
  width:64.53vw;
}

.hjss-about-more-btn > div > img:last-child {
  width:2.67vw;
  margin-left:4.43vw;
}
*/

/* photo */
.hjss-photos ul {
  position: relative;
  width: 84.52vw;
  margin: 8vw auto;
  display: flex;
  flex-wrap: wrap;
}

.hjss-photos li {
  width: 41.46vw;
  margin: 0.26vw;
  line-height: 0px;
  cursor: pointer;
}

.hjss-photos li img {
  border: #ccc solid 1px;
  box-sizing: border-box;
}

.hjss-photos li > div {
  position: relative;
  width: 100%;
  height: 100%;
}

/* fixed */
.hjss-fixed-wrap {
  position: sticky;
  bottom: 0px;
  width: 100%;
  height: 0px;
  line-height: 0px;
  pointer-events: none;
  -webkit-touch-callout: none; /* リンク長押しのポップアップを無効化 */
  -webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}

.hjss-fixed-wrap > div {
  position: absolute;
  right: 0px;
  bottom: 0px;
  display: flex;
  flex-direction: column;
  pointer-events: auto;
}

.hjss-scroll-wrap {
  z-index: 10;
}

.hjss-scroll-wrap > div {
  bottom: 10.53vw;
  right: 0.24vw;
  cursor: pointer;
  visibility: hidden;
  padding: 4vw;
  /*clip-path: polygon(0px 0px,100% -1.928vw,100% 100%,0% calc(100% + 1.928vw));*/
  /*clip-path: polygon(0px 0px,20px 0px,0px 20px);*/
}

#scroll-btn img {
  position: relative;
}

#scroll-btn img,
#scroll-btn .hjss-scroll-btn-attention {
  transition: opacity 0.2s ease-in-out;
}

#scroll-btn.hide {
  pointer-events: none;
}

#scroll-btn.hide img,
#scroll-btn.hide .hjss-scroll-btn-attention {
  opacity: 0;
}

.hjss-scroll {
  width: 1.9328vw;
  height: 10.29vw;
}

.hjss-scroll-icon {
  width: 1.87vw;
  height: 1.35vw;
  margin-top: 3.6vw;
}

.hjss-fixed-text-wrap {
  position: absolute;
  bottom: 0px;
  right: 0px;
  display: none;
}

.hjss-fixed-text-wrap > div {
  position: absolute;
  bottom: 13.33vw;
  right: 2.53vw;
  display: flex;
  flex-direction: column;
}

.hjss-scroll-btn-attention {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  clip-path: polygon(
    4vw 4vw,
    6vw 2vw,
    6vw calc(100% - 4vw),
    4vw calc(100% - 2vw)
  );
  -webkit-clip-path: polygon(
    4vw 4vw,
    6vw 2vw,
    6vw calc(100% - 4vw),
    4vw calc(100% - 2vw)
  );
  overflow: hidden;
}

.hjss-scroll-btn-attention::after {
  content: "";
  position: absolute;
  left: 0px;
  top: 0px;
  width: 45vw;
  height: 15vw;
  background-color: #fff;
  transform: translate(-50%, -100%) rotate(-45deg);
}

.loaded.hjss-top-show .hjss-scroll-btn-attention::after {
  animation: gjss-scroll-attention-ani 6s infinite;
}

@keyframes gjss-scroll-attention-ani {
  0% {
    transform: translate(-50%, -100%) rotate(-45deg);
  }
  50% {
    transform: translate(-50%, -100%) rotate(-45deg);
  }
  80% {
    transform: translate(-50%, 250%) rotate(-45deg);
  }
  100% {
    transform: translate(-50%, 250%) rotate(-45deg);
  }
}

.hjss-fixed-icon {
  width: 2.13vw;
  height: 1.55vw;
  margin-bottom: 5.81vw;
}

.hjss-fixed-text {
  position: relative;
  left: 0px;
  width: 2vw;
  height: 49.23vw;
}

/* 2階層以降のタイトル */
.hjss-page-title {
  position: relative;
  width: 100%;
}

.hjss-page-title h2 {
  position: relative;
  width: 36vw;
  top: -8.53vw;
  margin: 0px auto 18.53vw;
  line-height: 0px;
}

.hjss-page-title-text h2,
.hjss-page-title-text2 h2 {
  position: relative;
  text-align: center;
  font-size: 5.33vw;
  top: -10vw;
  margin: 0px auto 15.33vw;
  line-height: 1.53em;
}

.hjss-page-title-text2 h2 {
  top: -14vw;
}

/* EXPERIENCE */
.hjss-experience-block {
  font-size: 4.27vw;
  font-weight: bold;
  line-height: 1.75em;
  margin-bottom: 10.67vw;
}

.hjss-experience-block-link {
  text-align:center;
}

.hjss-link-arrow {
  position: relative;
  width:2.67vw;
  margin-left:1.76vw;
  top: 0.06em;
}

/* FAQ */
.hjss-faq {
  /*margin-top:15vw;*/
  font-weight: 600;
}

.hjss-faq a {
  text-decoration: underline;
}

.hjss-faq-text-wrap {
  position: relative;
  margin: 8px 20px 0px;
  width: auto;
  padding-bottom: 0px;
}

.hjss-faq h1 {
  font-size: 22px;
  margin: 52px 0px;
}

.hjss-faq li {
  margin-bottom: 52px;
}

.hjss-qst {
  position: relative;
  font-size: 19px;
  line-height: 30px;
  color: #cc0000;
  margin-left: 37px;
  margin-bottom: 21.4px;
}

.hjss-qst::before {
  content: url(../imgs/faq_q.svg);
  display: inline-block;
  width: 21.67px;
  position: absolute;
  left: -37px;
  top: 3.7px;
}

.hjss-ans {
  position: relative;
  font-size: 16px;
  line-height: 28px;
  margin-left: 37px;
}

.hjss-ans::before {
  content: url(../imgs/faq_a.svg);
  display: inline-block;
  width: 18.69px;
  position: absolute;
  left: -37px;
  top: 6px;
}

.hjss-top-btn {
  position: sticky;
  left: 0px;
  top: 0px;
  margin-top: 10.13vw;
  z-index: 20;
  line-height: 0px;
}

.hjss-top-btn a {
  display: inline-block;
}

.hjss-top-btn a > div {
  position: relative;
  width: 12.11vw;
  height: 12.38vw;
  border: none;
  background-color: #000;
  overflow: hidden;
  line-height: 0px;
  cursor: pointer;
  clip-path: polygon(
    0px 0px,
    100% 0px,
    100% calc(100% - 3.2vw),
    calc(100% - 3.2vw) 100%,
    0px 100%
  );
  -webkit-clip-path: polygon(
    0px 0px,
    100% 0px,
    100% calc(100% - 3.2vw),
    calc(100% - 3.2vw) 100%,
    0px 100%
  );
}

.hjss-top-btn-text {
  position: absolute;
  /*width:8.55vw;
  left:9.01vw;
  top:calc(50% - 1.66vw);
  */
  display: none;
}

.hjss-top-btn-arrow {
  position: absolute;
  width: 2.4vw;
  top: calc(50% - 1.73vw);
  left: 4.8vw;
}

.hjss-links,
.hjss-links2 {
  position: relative;
  margin: 60px auto;
}

.hjss-links3 {
  position: relative;
  margin: 60px auto 0px;
  padding-bottom: 60px;
}

/* その他のお問い合わせ */
.hjss-confirm p {
  margin: 0px auto 13.33vw;
  font-size: 4.27vw;
  line-height: 1.75em;
  font-weight: bold;
}

.hjss-confirm .caution-text {
  font-size: 3.47vw;
  line-height: 1.54em;
  padding-left: 1em;
  text-indent: -1em;
  margin: 5.33vw 0px;
}

.hjss-confirm .hjss-confirm-text2 {
  margin-bottom: 5.33vw;
}

.hjss-confirm .caution-text::before {
  content: "・";
  width: 1em;
  position: relative;
  display: inline-block;
  text-indent: 0.2em;
}

.hjss-confirm h3 {
  font-size: 5.07vw;
  line-height: 1.58em;
  font-weight: bold;
  margin: 0px auto 5.33vw;
}

.hjss-confirm a {
  color: #cc0000;
  text-decoration: underline;
}

/* Let's Fly! */
.hjss-fly p {
  margin: 0px auto 13.33vw;
  font-size: 4.27vw;
  line-height: 1.75em;
  font-weight: bold;
}


/* Slider */
/* ios で画像ダウンロードできるように */
.keen-slider:not([data-keen-slider-disabled]) {
  -webkit-user-select: auto;
  -moz-user-select: auto;
  -ms-user-select: auto;
  user-select: auto;
  -webkit-touch-callout: auto;
  -khtml-user-select: auto;
  touch-action: auto;
}

.hjss-top-photo .keen-slider {
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 0.2s ease-in;
}

.hjss-top-photo .keen-slider.keen-slider-created {
  opacity: 1;
}

.navigation-wrapper {
  position: relative;
}

.hjss-top-photo .keen-slider .keen-slider__slide,
.hjss-top-photo .keen-slider .keen-slider__slide img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
}

.slider-white-bar {
  position: absolute;
  width: 200vmax;
  height: 10px;
  background-color: #fff;
  top: 0%;
  left: 0%;
  transform: translate(-50%, 0%) rotate(-45deg);
  transform-origin: center bottom;
}

/* SCROLL REVEAL */
.white-cover-sr /* 横長 */,
.white-cover-sr2 /* 縦長 */ {
  position: relative;
  overflow: hidden;
}

.white-cover-sr::after,
.white-cover-sr2::after {
  content: "";
  position: absolute;
  left: 0px;
  top: 0px;
  background-color: #fff;
  transition: transform 0.7s ease-in, opacity 1.2s ease-in;
}

.white-cover-sr::after {
  width: 100vw;
  height: calc(100% + 100vw);
  transform: translate(0px, -100vw);
  clip-path: polygon(100vw 0px, 100vw 100%, 0px 100%, 0px 100vw);
  -webkit-clip-path: polygon(100vw 0px, 100vw 100%, 0px 100%, 0px 100vw);
}

.white-cover-sr2::after {
  width: calc(100% + 100vw);
  height: 100vw;
  transform: translate(-100vw, 0px);
  clip-path: polygon(100vw 0px, 100% 0px, 100% 100vw, 0px 100vw);
  -webkit-clip-path: polygon(100vw 0px, 100% 0px, 100% 100vw, 0px 100vw);
}

.sr-show .white-cover-sr::after {
  transform: translate(0px, 100%);
  opacity: 0;
}

.sr-show .white-cover-sr2::after {
  transform: translate(100%, 0px);
  opacity: 0;
}

.white-cover-sr-d2::after {
  transition: transform 0.7s 0.5s ease-in, opacity 1.2s 0.5s ease-in;
}

.white-cover-sr-d3::after {
  transition: transform 0.5s 1.2s ease-in, opacity 1.2s 1.2s ease-in;
}

.white-cover-sr-d4::after {
  transition: transform 0.5s 1.7s ease-in, opacity 1.2s 1.7s ease-in;
}

.white-cover-sr-d5::after {
  transition: transform 0.5s 1.9s ease-in, opacity 1.2s 1.9s ease-in;
}

.white-cover-sr-d6::after {
  transition: transform 0.5s 2s ease-in, opacity 1.2s 2s ease-in;
}

/* MODAL */
.wipe-hover-btn-hover {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.wipe-hover-btn-hover img {
  transform: scale(1.1);
}

.modal-wrap {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 10000;
  overflow: auto;
  display: none;
}

.modal-bg {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.modal-bg > div {
  position: absolute;
  left: calc(50% - 50vmax);
  top: calc(50% - 50vmax);
  width: 100vmax;
  height: 100vmax;
  background-color: #fff;
}
/*
.modal-bg > div:nth-child(1) {
  opacity:0.3;
}

.modal-bg > div:nth-child(2) {
  opacity:0.5;
}
*/

.modal-show {
  display: flex !important;
}

.modal-hide {
  display: none !important;
}

.modal-wrap.modal-wrap-show {
  display: block;
}

.modal-wrap.modal-wrap-hide {
  animation: modal-wrap-hide 1s forwards;
  display: block;
}

@keyframes modal-wrap-hide {
  0% {
    display: block;
  }
  99% {
    display: block;
  }
  100% {
    display: hidden;
  }
}

.modal-wrap-show .modal-bg > div:nth-child(1) {
  animation: modal-bg-wipe-show 0.6s ease-in forwards;
}

/*
.modal-wrap-show .modal-bg > div:nth-child(2) {
  animation:modal-bg-wipe-show 0.4s 0.1s ease-in forwards;  
  clip-path:polygon(50vmax -50vmax, -50vmax 50vmax, -150vmax -50vmax, -50vmax -150vmax);
}

.modal-wrap-show .modal-bg > div:nth-child(3) {
  animation:modal-bg-wipe-show 0.4s 0.2s ease-in forwards;
  clip-path:polygon(50vmax 0vmax, -50vmax 50vmax, -150vmax -50vmax, -50vmax -150vmax);
}
*/

/*
.modal-wrap-hide .modal-bg > div:nth-child(1) {
  animation:modal-bg-wipe-hide 0.4s 0.5s ease-in forwards;
  clip-path:polygon(150vmax 50vmax, 50vmax 150vmax, -50vmax 50vmax, 50vmax -50vmax);
}

.modal-wrap-hide .modal-bg > div:nth-child(2) {
  animation:modal-bg-wipe-hide 0.4s 0.4s ease-in forwards;  
  clip-path:polygon(150vmax 50vmax, 50vmax 150vmax, -50vmax 50vmax, 50vmax -50vmax);
}

.modal-wrap-hide .modal-bg > div:nth-child(3) {
  animation:modal-bg-wipe-hide 0.4s 0.3s ease-in forwards;
  clip-path:polygon(150vmax 50vmax, 50vmax 150vmax, -50vmax 50vmax, 50vmax -50vmax);
}
*/
.modal-wrap-hide .modal-bg > div:nth-child(1) {
  animation: modal-bg-wipe-hide 0.6s 0.3s ease-in forwards;
  clip-path: polygon(
    150vmax 50vmax,
    50vmax 150vmax,
    -50vmax 50vmax,
    50vmax -50vmax
  );
  -webkit-clip-path: polygon(
    150vmax 50vmax,
    50vmax 150vmax,
    -50vmax 50vmax,
    50vmax -50vmax
  );
}

@keyframes modal-bg-wipe-show {
  0% {
    clip-path: polygon(
      50vmax -50vmax,
      -50vmax 50vmax,
      -150vmax -50vmax,
      -50vmax -150vmax
    );
    -webkit-clip-path: polygon(
      50vmax -50vmax,
      -50vmax 50vmax,
      -150vmax -50vmax,
      -50vmax -150vmax
    );
  }
  100% {
    clip-path: polygon(
      150vmax 50vmax,
      50vmax 150vmax,
      -50vmax 50vmax,
      50vmax -50vmax
    );
    -webkit-clip-path: polygon(
      150vmax 50vmax,
      50vmax 150vmax,
      -50vmax 50vmax,
      50vmax -50vmax
    );
  }
}

@keyframes modal-bg-wipe-hide {
  0% {
    clip-path: polygon(
      150vmax 50vmax,
      50vmax 150vmax,
      -50vmax 50vmax,
      50vmax -50vmax
    );
    -webkit-clip-path: polygon(
      150vmax 50vmax,
      50vmax 150vmax,
      -50vmax 50vmax,
      50vmax -50vmax
    );
  }
  100% {
    clip-path: polygon(
      250vmax 150vmax,
      150vmax 250vmax,
      50vmax 150vmax,
      150vmax 50vmax
    );
    -webkit-clip-path: polygon(
      250vmax 150vmax,
      150vmax 250vmax,
      50vmax 150vmax,
      150vmax 50vmax
    );
  }
}

.modal-contents {
  position: relative;
  width: 100%;
  min-height: 100%;
  pointer-events: none;
}

.modal-wrap-show .modal-contents {
  animation: modal-contents-show 0.2s 0.5s ease-in forwards;
  opacity: 0;
}

.modal-wrap-hide .modal-contents {
  animation: modal-contents-hide 0.4s 0s ease-in forwards;
}

@keyframes modal-contents-show {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes modal-contents-hide {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

.modal {
  pointer-events: none;
  display: none;
}

.modal > * {
  pointer-events: auto;
}

.top-movie-modal {
  position: relative;
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.youtube-wrap-wrap {
  position: relative;
  width: 100vw;
  height: 56.25vw;
  aspect-ratio: 16 / 9;
  line-height: 0px;
}

.youtube-wrap {
  width: 100%;
  height: 100%;
}

.youtube-cover {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
}

/*
.modal-wrap-show .youtube-wrap-wrap {
  animation:ytframe-show 1s 0.3s ease-out forwards;
  transform:scale(0.95);
}
*/

.youtube-cover > div {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #ccc;
}

.youtube-cover > div:nth-child(1) {
  left: 0px;
  top: 0px;
  background-color: #fff;
}

.youtube-cover > div:nth-child(2) {
  height: 1px;
  top: 0px;
  left: 0px;
}

.youtube-cover > div:nth-child(3) {
  width: 1px;
  top: 0px;
  right: 0px;
}

.youtube-cover > div:nth-child(4) {
  height: 1px;
  bottom: 0px;
  left: 0px;
}

.youtube-cover > div:nth-child(5) {
  width: 1px;
  top: 0px;
  left: 0px;
}

.modal-wrap-show .youtube-cover > div:nth-child(1) {
  animation: ytframe1-show 0.8s 0.8s ease-in forwards;
  opacity: 1;
}

.modal-wrap-show .youtube-cover > div:nth-child(2) {
  /*animation:ytframe2-show 1s 0.3s forwards;*/
  left: 0%;
  width: 0px;
}

.modal-wrap-show .youtube-cover > div:nth-child(3) {
  /*animation:ytframe3-show 1s 0.3s forwards;*/
  top: 0%;
  height: 0px;
}

.modal-wrap-show .youtube-cover > div:nth-child(4) {
  /*animation:ytframe4-show 1s 0.3s forwards;*/
  left: 0%;
  width: 0px;
}

.modal-wrap-show .youtube-cover > div:nth-child(5) {
  /*animation:ytframe5-show 1s 0.3s forwards;*/
  top: 0%;
  height: 0px;
}

/*
.modal-wrap-show .youtube-wrap-wrap {
  animation:youtube-ww-show 1.2s ease-out forwards;
  transform:scale(0.95);
}
*/

.modal-wrap-hide .youtube-cover > div {
  display: none;
}

/* POSTER MODAL */
.poster-modal {
  position: absolute;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
}

.poster-slider {
  height: 100%;
}

.poster-slider li {
  display: flex;
  align-items: center;
  justify-content: center;
}

.poster-slider img {
  -webkit-user-select: auto;
  -moz-user-select: auto;
  -ms-user-select: auto;
  user-select: auto;
  -webkit-touch-callout: auto;
  -khtml-user-select: auto;
  overflow: auto;
}

/*
@keyframes ytframe-show {
  0% {
    transform:scale(0.95);
  }
  100% {
    transform:scale(1);
  }
}
*/

@keyframes ytframe1-show {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes ytframe2-show {
  0% {
    left: 0%;
    width: 0px;
    animation-timing-function: ease-out;
  }
  33% {
    left: 0%;
    width: 100%;
    animation-timing-function: ease-in;
  }
  66% {
    left: 100%;
    width: 100%;
    animation-timing-function: ease-in;
  }
  100% {
    left: 100%;
    width: 100%;
  }
}

@keyframes ytframe3-show {
  0% {
    top: 0%;
    height: 0px;
  }
  33% {
    top: 0%;
    height: 0%;
    animation-timing-function: ease-out;
  }
  66% {
    top: 0%;
    height: 100%;
    animation-timing-function: ease-in;
  }
  100% {
    top: 100%;
    height: 100%;
    animation-timing-function: ease-in;
  }
}

@keyframes ytframe4-show {
  0% {
    left: 0%;
    width: 0px;
  }
  33% {
    left: 0%;
    width: 0%;
    animation-timing-function: ease-out;
  }
  66% {
    left: 0px;
    width: 100%;
    animation-timing-function: ease-in;
  }
  100% {
    left: 100%;
    width: 100%;
    animation-timing-function: ease-in;
  }
}

@keyframes ytframe5-show {
  0% {
    top: 0%;
    height: 0px;
    animation-timing-function: ease-out;
  }
  33% {
    top: 0%;
    height: 100%;
    animation-timing-function: ease-in;
  }
  66% {
    top: 100%;
    height: 100%;
    animation-timing-function: ease-in;
  }
  100% {
    top: 100%;
    height: 100%;
  }
}

/*
@keyframes youtube-ww-show {
  0% {
    transform:scale(0.95);
  }
  100% {
    transform:scale(1);
  }
}
*/

.modal-close-btn {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 20.53vw;
  height: 20.53vw;
  overflow: hidden;
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 20.9% 100%, 0% 79.1%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 20.9% 100%, 0% 79.1%);
  -webkit-touch-callout: none; /* リンク長押しのポップアップを無効化 */
  -webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}

.modal-close-btn-bg,
.modal-close-btn-hover {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  transform: translate(110%, -110%) scale(1.5) rotate(45deg);
  background-color: #fff;
}

.modal-close-icon {
  position: absolute;
  width: 35.08%;
  height: 35.08%;
  left: 32.46%;
  top: 32.46%;
  /* opacity: 0; */
}

.modal-wrap-show .modal-close-btn-bg {
  animation: modal-close-btn-show-ani 0.4s 0.5s ease-in forwards;
  transform: translate(110%, -110%) scale(1.5) rotate(45deg);
}

.modal-wrap-hide .modal-close-btn-bg {
  animation: modal-close-btn-hide-ani 0.4s 0s ease-in forwards;
  transform: translate(0%, 0%) scale(1.5) rotate(45deg);
}

.modal-wrap-show .modal-close-icon {
  animation: modal-close-icon-show-ani 0.2s 0.6s ease-in forwards;
}

.modal-wrap-hide .modal-close-icon {
  animation: modal-close-icon-hide-ani 0.2s 0s ease-in forwards;
}

@keyframes modal-close-btn-show-ani {
  0% {
    transform: translate(110%, -110%) scale(1.5) rotate(45deg);
  }
  100% {
    transform: translate(0%, 0%) scale(1.5) rotate(45deg);
  }
}

@keyframes modal-close-btn-hide-ani {
  0% {
    transform: translate(0%, 0%) scale(1.5) rotate(45deg);
  }
  100% {
    transform: translate(-110%, 110%) scale(1.5) rotate(45deg);
  }
}

@keyframes modal-close-icon-show-ani {
  0% {
    transform: scale(0.95);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes modal-close-icon-hide-ani {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(0.95);
    opacity: 0;
  }
}

/* MENU MODAL */
.menu-modal-wrap {
  position: fixed;
  top: 0px;
  right: 0px;
  width: 100%;
  height: 100%;
  z-index: 90;
  overflow-x: hidden;
  overflow-y: auto;
  display: none;
}

.menu-modal-wrap.modal-wrap-show {
  display: block;
  animation: menu-modal-wrap-show 0.3s ease-in forwards;
}

.menu-modal-wrap.modal-wrap-hide {
  animation: menu-modal-wrap-hide 0.2s 0.1s ease-in forwards;
}

.menu-modal-contents {
  position: absolute;
  left: 0px;
  top: 0px;
  padding-top: 65px;
  width: 100vw;
  min-height: calc(100% - 65px);
}

.menu-modal-bg,
.menu-modal-fg {
  position: absolute;
  left: 0px;
  top: 0px;
  background-color: #fff;
  width: 100%;
  height: 100%;
}

.modal-wrap-show .menu-modal-fg {
  animation: menu-modal-fg-show 0.3s 0.2s ease-in forwards;
}

.modal-wrap-hide .menu-modal-fg {
  animation: menu-modal-fg-hide 0.2s ease-in forwards;
}

.menu-modal-header {
  position: relative;
  width: 100%;
}

.menu-modal-contents ul {
  position: relative;
  width: 100%;
  /*min-height:calc(100vh - 86.93vw - 65px);*/
  margin: 21.87vw 0px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  line-height: 0px;
}

.menu-modal-contents li {
  height: 18.4vw;
  display: grid;
  place-items: center;
}

.menu-modal-contents li img {
  width: 33.07vw;
}

@keyframes menu-modal-wrap-show {
  0% {
    clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  }
  10% {
    clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  }
  100% {
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}

@keyframes menu-modal-wrap-hide {
  0% {
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
  100% {
    clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  }
}

@keyframes menu-modal-fg-show {
  0% {
    width: 100%;
  }
  100% {
    width: 0%;
  }
}

@keyframes menu-modal-fg-hide {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}