@import url("https://fonts.googleapis.com/css2?family=Anton&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200..900&family=Zen+Old+Mincho&display=swap");
body {
  margin: 0;
  padding: 0;
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  color: #fff;
  overflow-x: hidden;
}
body::before {
  content: "";
  position: absolute;
  background-image: url(../img/bg.jpg);
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  opacity: 0.1;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

.langbox {
  z-index: 500;
  position: relative;
  max-width: 1500px;
  width: 100%;
  margin: 0 auto;
}

.lang {
  display: flex;
  position: absolute;
}
@media only screen and (max-width: 1269px) {
  .lang {
    top: 95px;
    right: 10px;
  }
}
@media only screen and (min-width: 1270px) {
  .lang {
    top: 50px;
    left: 20px;
  }
}
.lang .lang_item {
  text-align: center;
  box-sizing: border-box;
  color: #fff;
  font-weight: bold;
  letter-spacing: 0.1em;
}
@media only screen and (min-width: 1270px) {
  .lang .lang_item {
    font-size: 1.25rem;
  }
}
.lang .lang_item a {
  color: #fff;
  text-decoration: none;
}
.lang .lang_item a:hover {
  text-decoration: underline;
}
.lang .lang_item:first-child::after {
  content: "/";
  display: inline-block;
  color: #fff;
  margin: 0 12px 0 7px;
  font-weight: normal;
}
.lang .select {
  color: #d46e19;
}

.section {
  position: relative;
}
@media only screen and (max-width: 1269px) {
  .section {
    padding: 90px 17px 0;
  }
}
@media only screen and (min-width: 1270px) {
  .section {
    max-width: 950px;
    width: calc(100% - 30px);
    margin: 0 auto;
    padding: 50px 0 0;
  }
}

.title {
  font-family: "Anton", sans-serif;
  color: #222;
  position: absolute;
  top: 0;
  z-index: -1;
  margin: 0;
}
@media only screen and (max-width: 1269px) {
  .title {
    font-size: 5.2rem;
    left: 0;
  }
}
@media only screen and (min-width: 1270px) {
  .title {
    font-size: 9.5rem;
    letter-spacing: 0.05rem;
    left: -40px;
  }
}

h3 {
  margin: 0 0 20px;
  letter-spacing: 0.1rem;
}
@media only screen and (max-width: 1269px) {
  h3 {
    font-size: 1.4rem;
  }
}
@media only screen and (min-width: 1270px) {
  h3 {
    margin: 0 0 20px;
    font-size: 2.2rem;
  }
}

.global_head {
  margin: 0;
  padding: 0;
}

.content {
  overflow: hidden;
  background-color: #54bd95;
}

.hero {
  width: 100vw;
  overflow: hidden;
  height: 100vh;
  position: relative;
}
.hero__ttl {
  position: absolute;
  z-index: 50;
}
@media only screen and (min-width: 1270px) {
  .hero__ttl {
    max-width: 1750px;
    width: 70%;
    min-width: 767px;
    bottom: 2vh;
    left: 50%;
    transform: translateX(-50%);
  }
}
.hero__ttl p {
  max-width: 1250px;
  font-family: "Zen Old Mincho", serif;
  font-weight: bolder;
  text-align: center;
  background-color: #24343b;
  margin: 0 auto;
  padding: 0 0 5px;
}
@media only screen and (max-width: 1269px) {
  .hero__ttl p {
    bottom: 0;
    font-size: 30px;
  }
  .hero__ttl p span {
    text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
    font-weight: bold;
  }
}
@media only screen and (min-width: 1270px) {
  .hero__ttl p {
    font-size: 1.35vw;
  }
  .hero__ttl p span {
    text-shadow: rgb(255, 255, 255) 6px 0px 0px, rgb(255, 255, 255) 5.91686px 0.995377px 0px, rgb(255, 255, 255) 5.66974px 1.96317px 0px, rgb(255, 255, 255) 5.2655px 2.87655px 0px, rgb(255, 255, 255) 4.71532px 3.71022px 0px, rgb(255, 255, 255) 4.03447px 4.44106px 0px, rgb(255, 255, 255) 3.24181px 5.04883px 0px, rgb(255, 255, 255) 2.35931px 5.51667px 0px, rgb(255, 255, 255) 1.41143px 5.83163px 0px, rgb(255, 255, 255) 0.424423px 5.98497px 0px, rgb(255, 255, 255) -0.574341px 5.97245px 0px, rgb(255, 255, 255) -1.55719px 5.79441px 0px, rgb(255, 255, 255) -2.49688px 5.45578px 0px, rgb(255, 255, 255) -3.36738px 4.96596px 0px, rgb(255, 255, 255) -4.14455px 4.33852px 0px, rgb(255, 255, 255) -4.80686px 3.59083px 0px, rgb(255, 255, 255) -5.33596px 2.74364px 0px, rgb(255, 255, 255) -5.71718px 1.8204px 0px, rgb(255, 255, 255) -5.93995px 0.84672px 0px, rgb(255, 255, 255) -5.99811px -0.150428px 0px, rgb(255, 255, 255) -5.89004px -1.14341px 0px, rgb(255, 255, 255) -5.61874px -2.1047px 0px, rgb(255, 255, 255) -5.19172px -3.00766px 0px, rgb(255, 255, 255) -4.62082px -3.82727px 0px, rgb(255, 255, 255) -3.92186px -4.54081px 0px, rgb(255, 255, 255) -3.11421px -5.12852px 0px, rgb(255, 255, 255) -2.22026px -5.57409px 0px, rgb(255, 255, 255) -1.26477px -5.86518px 0px, rgb(255, 255, 255) -0.274238px -5.99373px 0px, rgb(255, 255, 255) 0.723898px -5.95617px 0px, rgb(255, 255, 255) 1.70197px -5.75355px 0px, rgb(255, 255, 255) 2.63288px -5.39147px 0px, rgb(255, 255, 255) 3.49082px -4.87998px 0px, rgb(255, 255, 255) 4.25202px -4.23324px 0px, rgb(255, 255, 255) 4.89538px -3.46919px 0px, rgb(255, 255, 255) 5.40307px -2.60899px 0px, rgb(255, 255, 255) 5.76102px -1.67649px 0px, rgb(255, 255, 255) 5.95932px -0.697531px 0px;
    font-weight: bold;
  }
}
@media only screen and (min-width: 2550px) {
  .hero__ttl p {
    font-size: 35px;
  }
}
.hero__ttl--ttl {
  position: absolute;
  z-index: 50;
  width: 100%;
}
@media only screen and (min-width: 1270px) {
  .hero__ttl--ttl {
    bottom: 50px;
  }
}
@media only screen and (max-width: 1269px) {
  .hero__ttl--ttl {
    bottom: 40px;
  }
}
.hero__ttl--ttl p {
  max-width: 1250px;
  font-family: "Zen Old Mincho", serif;
  font-weight: bolder;
  text-align: center;
  background-color: #24343b;
  margin: 0 auto;
  padding: 0 0 5px;
}
@media only screen and (max-width: 1269px) {
  .hero__ttl--ttl p {
    bottom: 0;
    font-size: 30px;
  }
  .hero__ttl--ttl p span {
    text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
    font-weight: bold;
  }
}
@media only screen and (min-width: 1270px) {
  .hero__ttl--ttl p {
    font-size: 2.5vw;
  }
  .hero__ttl--ttl p span {
    text-shadow: rgb(255, 255, 255) 6px 0px 0px, rgb(255, 255, 255) 5.91686px 0.995377px 0px, rgb(255, 255, 255) 5.66974px 1.96317px 0px, rgb(255, 255, 255) 5.2655px 2.87655px 0px, rgb(255, 255, 255) 4.71532px 3.71022px 0px, rgb(255, 255, 255) 4.03447px 4.44106px 0px, rgb(255, 255, 255) 3.24181px 5.04883px 0px, rgb(255, 255, 255) 2.35931px 5.51667px 0px, rgb(255, 255, 255) 1.41143px 5.83163px 0px, rgb(255, 255, 255) 0.424423px 5.98497px 0px, rgb(255, 255, 255) -0.574341px 5.97245px 0px, rgb(255, 255, 255) -1.55719px 5.79441px 0px, rgb(255, 255, 255) -2.49688px 5.45578px 0px, rgb(255, 255, 255) -3.36738px 4.96596px 0px, rgb(255, 255, 255) -4.14455px 4.33852px 0px, rgb(255, 255, 255) -4.80686px 3.59083px 0px, rgb(255, 255, 255) -5.33596px 2.74364px 0px, rgb(255, 255, 255) -5.71718px 1.8204px 0px, rgb(255, 255, 255) -5.93995px 0.84672px 0px, rgb(255, 255, 255) -5.99811px -0.150428px 0px, rgb(255, 255, 255) -5.89004px -1.14341px 0px, rgb(255, 255, 255) -5.61874px -2.1047px 0px, rgb(255, 255, 255) -5.19172px -3.00766px 0px, rgb(255, 255, 255) -4.62082px -3.82727px 0px, rgb(255, 255, 255) -3.92186px -4.54081px 0px, rgb(255, 255, 255) -3.11421px -5.12852px 0px, rgb(255, 255, 255) -2.22026px -5.57409px 0px, rgb(255, 255, 255) -1.26477px -5.86518px 0px, rgb(255, 255, 255) -0.274238px -5.99373px 0px, rgb(255, 255, 255) 0.723898px -5.95617px 0px, rgb(255, 255, 255) 1.70197px -5.75355px 0px, rgb(255, 255, 255) 2.63288px -5.39147px 0px, rgb(255, 255, 255) 3.49082px -4.87998px 0px, rgb(255, 255, 255) 4.25202px -4.23324px 0px, rgb(255, 255, 255) 4.89538px -3.46919px 0px, rgb(255, 255, 255) 5.40307px -2.60899px 0px, rgb(255, 255, 255) 5.76102px -1.67649px 0px, rgb(255, 255, 255) 5.95932px -0.697531px 0px;
    font-weight: bold;
  }
}
@media only screen and (min-width: 2550px) {
  .hero__ttl--ttl p {
    font-size: 65px;
  }
}
@media only screen and (max-width: 1269px) {
  .hero__ttl img {
    max-width: max-content;
    width: 90%;
    display: block;
    margin: 0 auto;
    padding-top: 10px;
  }
}
@media only screen and (min-width: 1270px) {
  .hero__ttl img {
    max-height: 225px;
    width: auto;
    margin: 0 auto;
    display: block;
  }
}
.hero__ttl--ghorus {
  position: absolute;
  z-index: 11;
}
@media only screen and (max-width: 1269px) {
  .hero__ttl--ghorus {
    display: none;
    bottom: 0;
    left: -100px;
  }
}
@media only screen and (min-width: 1270px) {
  .hero__ttl--ghorus {
    max-width: 750px;
    bottom: 350px;
    left: 0px;
  }
}
@media only screen and (max-width: 1269px) {
  .hero__ttl--ghorus img {
    rotate: 10deg;
    max-width: 400px;
    width: 90%;
    display: block;
  }
}
@media only screen and (min-width: 1270px) {
  .hero__ttl--ghorus img {
    max-width: 750px;
    width: 90%;
    display: block;
  }
}
.hero__ttl--bajas {
  position: absolute;
  z-index: 11;
}
@media only screen and (max-width: 1269px) {
  .hero__ttl--bajas {
    display: none;
    bottom: 0;
    left: -100px;
  }
}
@media only screen and (min-width: 1270px) {
  .hero__ttl--bajas {
    bottom: 350px;
    right: 0px;
  }
}
@media only screen and (max-width: 1269px) {
  .hero__ttl--bajas img {
    rotate: 10deg;
    max-width: 400px;
    width: 90%;
    display: block;
  }
}
@media only screen and (min-width: 1270px) {
  .hero__ttl--bajas img {
    max-width: 750px;
    width: 90%;
    display: block;
  }
}
.hero__mnstr {
  max-width: 800px;
  width: 80vw;
  position: relative;
  height: 100vh;
  margin: 0 auto;
}
.hero__bajas {
  position: absolute;
}
@media only screen and (max-width: 1269px) {
  .hero__bajas {
    bottom: 0%;
    z-index: 10;
    right: -70%;
  }
}
@media only screen and (min-width: 1270px) {
  .hero__bajas {
    z-index: 9;
    bottom: 50%;
    transform: translateY(50%);
    right: -300px;
  }
}
@media only screen and (min-width: 1440px) {
  .hero__bajas {
    z-index: 9;
    bottom: 50%;
    transform: translateY(50%);
    right: -450px;
  }
}
@media only screen and (min-width: 1910px) {
  .hero__bajas {
    z-index: 9;
    bottom: 45%;
    transform: translateY(50%);
    right: -450px;
  }
}
@media only screen and (min-width: 2550px) {
  .hero__bajas {
    bottom: 45%;
    transform: translateY(50%);
    right: -450px;
  }
}
.hero__bajas img {
  transform: scaleX(-1);
}
@media only screen and (max-width: 1269px) {
  .hero__bajas img {
    rotate: 25deg;
    width: 60vh;
    display: block;
  }
}
@media only screen and (min-width: 1270px) {
  .hero__bajas img {
    width: 650px;
    display: block;
  }
}
@media only screen and (min-width: 1440px) {
  .hero__bajas img {
    width: 750px;
    display: block;
  }
}
.hero__ghorus {
  position: absolute;
  z-index: 9;
}
@media only screen and (max-width: 1269px) {
  .hero__ghorus {
    top: -10%;
    left: -70%;
  }
}
@media only screen and (min-width: 1270px) {
  .hero__ghorus {
    bottom: 50%;
    transform: translateY(50%);
    left: -300px;
  }
}
@media only screen and (min-width: 1440px) {
  .hero__ghorus {
    bottom: -3vw;
    left: -450px;
    bottom: 45%;
    transform: translateY(50%);
  }
}
@media only screen and (min-width: 1910px) {
  .hero__ghorus {
    z-index: 9;
    bottom: 45%;
    transform: translateY(50%);
    left: -450px;
  }
}
@media only screen and (min-width: 2550px) {
  .hero__ghorus {
    bottom: 45%;
    transform: translateY(50%);
    left: -450px;
  }
}
@media only screen and (max-width: 1269px) {
  .hero__ghorus img {
    rotate: 10deg;
    width: 60vh;
    display: block;
  }
}
@media only screen and (min-width: 1270px) {
  .hero__ghorus img {
    width: 650px;
    display: block;
  }
}
@media only screen and (min-width: 1440px) {
  .hero__ghorus img {
    width: 750px;
    display: block;
  }
}

.midbox {
  position: relative;
}
.midbox::before {
  content: "";
  position: absolute;
  background-image: url(../img/bg.jpg);
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  opacity: 0.1;
}

.mid {
  position: relative;
  z-index: 10;
  border-radius: 10px;
  padding: 10px;
  margin: 0 auto;
  background-color: #cf6800;
}
@media only screen and (min-width: 1270px) {
  .mid {
    border: solid #ffffff 5px;
    width: 1000px;
  }
}

@media only screen and (max-width: 1269px) {
  .about {
    margin: 0 0 60px;
  }
}
@media only screen and (min-width: 1270px) {
  .about {
    margin: 0 0 90px;
  }
}
@media only screen and (min-width: 1270px) {
  .about__container {
    display: flex;
    justify-content: space-between;
  }
}
@media only screen and (max-width: 1269px) {
  .about__text {
    margin: 0 0 35px;
  }
}
@media only screen and (min-width: 1270px) {
  .about__text {
    margin: 0 0 50px;
  }
}
.about__text .lead {
  background: #fff;
  color: #54bd95;
  margin: 0 0 30px;
  font-weight: 700;
  padding: 4px;
  line-height: 100%;
  display: inline-block;
}
@media only screen and (max-width: 1269px) {
  .about__text .lead {
    font-size: 1.35rem;
  }
}
@media only screen and (min-width: 1270px) {
  .about__text .lead {
    font-size: 1.9rem;
  }
}
.about__text__p.fadein {
  animation-delay: 10s;
}
.about__text__p p {
  font-weight: 600;
}
@media only screen and (max-width: 1269px) {
  .about__text__p p {
    font-size: 1.05rem;
    line-height: 2.3rem;
    margin: 0 0 10px;
  }
}
@media only screen and (min-width: 1270px) {
  .about__text__p p {
    font-size: 1.15rem;
    line-height: 2.3rem;
    margin: 0 0 25px;
  }
}
.about__text__p p:last-child {
  margin: 0;
}
@media only screen and (max-width: 1269px) {
  .about__pic-item {
    width: 240px;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 1270px) {
  .about__pic-item {
    margin: 0 20px;
  }
}
.about__pic-item p {
  text-align: center;
  font-weight: 600;
  letter-spacing: 0.1rem;
}
@media only screen and (max-width: 1269px) {
  .about__pic-item p {
    font-size: 0.95rem;
  }
}

@media only screen and (max-width: 1269px) {
  .prod {
    margin: 50px 0 60px;
  }
}
@media only screen and (min-width: 1270px) {
  .prod {
    margin: 0;
  }
}
.prod__container {
  display: flex;
}
@media only screen and (max-width: 1269px) {
  .prod__container {
    flex-direction: column;
    margin: 0 0 60px;
  }
}
@media only screen and (min-width: 1270px) {
  .prod__container {
    justify-content: space-between;
    margin: 0 0 50px;
  }
}
.prod__container:last-child {
  margin: 0;
}
@media only screen and (max-width: 1269px) {
  .prod__main {
    order: -1;
    width: 100%;
    margin-bottom: 20px;
  }
}
@media only screen and (min-width: 1270px) {
  .prod__main {
    width: 50%;
  }
}
.prod__main--ttlright {
  position: absolute;
}
@media only screen and (min-width: 1270px) {
  .prod__main--ttlright {
    right: -125px;
    top: -50px;
    rotate: 5deg;
  }
}
@media only screen and (max-width: 1269px) {
  .prod__main--ttlright {
    left: -25px;
    top: -80px;
    rotate: -10deg;
  }
}
@media only screen and (min-width: 1270px) {
  .prod__main--ttlright img {
    height: 500px;
  }
}
@media only screen and (max-width: 1269px) {
  .prod__main--ttlright img {
    height: 450px;
  }
}
.prod__main--ttlleft {
  position: absolute;
}
@media only screen and (min-width: 1270px) {
  .prod__main--ttlleft {
    left: -75px;
    rotate: -25deg;
  }
}
@media only screen and (max-width: 1269px) {
  .prod__main--ttlleft {
    left: -25px;
    top: -125px;
    rotate: -10deg;
  }
}
.prod__main--ttlleft img {
  height: 500px;
}
@media only screen and (max-width: 1269px) {
  .prod__sub {
    width: 100%;
  }
}
@media only screen and (min-width: 1270px) {
  .prod__sub {
    width: 40%;
    padding: 70px 0 0;
  }
}
.prod__sub-thum {
  display: flex;
  flex-wrap: wrap;
}
@media only screen and (max-width: 1269px) {
  .prod__sub-thum {
    margin: 0 0 15px;
  }
}
@media only screen and (min-width: 1270px) {
  .prod__sub-thum {
    margin: 0 0 20px;
  }
}
.prod__sub-item {
  position: relative;
  overflow: hidden;
  background: #ffffff;
  border: #ccc solid 1px;
}
@media only screen and (max-width: 1269px) {
  .prod__sub-item {
    width: 60px;
    height: 60px;
    margin: 0 8px 10px 0;
  }
}
@media only screen and (min-width: 1270px) {
  .prod__sub-item {
    width: 95px;
    height: 95px;
    margin: 0 10px 10px 0;
  }
  .prod__sub-item:hover {
    opacity: 0.8;
  }
}
.prod__sub-item img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  object-fit: cover;
}
.prod__sub-detail {
  color: #fff;
}
@media only screen and (max-width: 1269px) {
  .prod__sub-detail {
    width: 100%;
    order: 3;
  }
}
@media only screen and (min-width: 1270px) {
  .prod__sub-detail {
    width: 100%;
    margin: 0 0 20px;
  }
}
.prod__sub-detail h2 {
  margin: 0 0 5px;
  padding: 7px 5px 5px;
  width: fit-content;
}
@media only screen and (max-width: 1269px) {
  .prod__sub-detail h2 {
    font-size: 22px;
    line-height: 32px;
    background-color: #24343b;
  }
}
@media only screen and (min-width: 1270px) {
  .prod__sub-detail h2 {
    font-size: 30px;
    font-weight: bolder;
    line-height: 28px;
    background-color: #24343b;
  }
}
.prod__sub-detail h3 {
  margin: 0 0 25px;
  padding: 3px 3px 1px;
  width: fit-content;
}
@media only screen and (max-width: 1269px) {
  .prod__sub-detail h3 {
    font-size: 22px;
    line-height: 32px;
    background-color: #24343b;
  }
}
@media only screen and (min-width: 1270px) {
  .prod__sub-detail h3 {
    font-size: 20px;
    font-weight: bolder;
    line-height: 28px;
    background-color: #24343b;
  }
}
.prod__sub-detail dl {
  display: grid;
  grid-template-columns: 95px auto;
}
@media only screen and (max-width: 1269px) {
  .prod__sub-detail dl {
    border-top: solid #fff 1px;
    border-bottom: solid #fff 1px;
    padding-top: 10px;
    margin-bottom: 50px;
  }
}
.prod__sub-detail dt {
  grid-column: 1;
  font-size: 15px;
  padding-top: 5px;
  font-weight: bolder;
}
.prod__sub-detail dd {
  font-weight: bolder;
  grid-column: 2;
  font-size: 20px;
}
@media only screen and (max-width: 1269px) {
  .prod__sub-detail dd {
    margin: 0 0 5px;
  }
}
@media only screen and (min-width: 1270px) {
  .prod__sub-detail dd {
    margin: 0 0 25px;
  }
}
.prod__sub-caption p {
  padding: 0;
  margin: 0;
  color: #fff;
  font-weight: 700;
}
@media only screen and (max-width: 1269px) {
  .prod__sub-caption p {
    font-size: 17px;
    line-height: 25px;
  }
}
@media only screen and (min-width: 1270px) {
  .prod__sub-caption p {
    font-size: 22px;
    line-height: 28px;
    margin: 0 0 10px;
  }
}
.prod__sub .soldout {
  color: #d83820;
  margin: 30px 0 0;
  font-weight: bold;
}
.prod__sub .soldout__ttl {
  font-family: "Anton", sans-serif;
}
@media only screen and (max-width: 1269px) {
  .prod__sub .soldout__ttl {
    font-size: 33px;
  }
}
@media only screen and (min-width: 1270px) {
  .prod__sub .soldout__ttl {
    font-size: 43px;
  }
}
@media only screen and (max-width: 1269px) {
  .prod__sub .soldout p {
    font-size: 17px;
  }
}
@media only screen and (min-width: 1270px) {
  .prod__sub .soldout p {
    font-size: 19px;
    line-height: 29px;
  }
}
.prod .sp-button {
  border: 2px solid #ffffff !important;
}
@media only screen and (max-width: 1269px) {
  .prod .sp-button {
    width: 10px !important;
    height: 10px !important;
  }
}
.prod .sp-selected-button {
  background-color: #ffffff !important;
}
.prod .sp-next-arrow:after, .prod .sp-next-arrow:before, .prod .sp-previous-arrow:after, .prod .sp-previous-arrow:before {
  background-color: #ffffff !important;
}

@media only screen and (max-width: 1269px) {
  .information {
    margin: 0 0 60px;
    overflow: hidden;
  }
}
@media only screen and (min-width: 1270px) {
  .information {
    margin: 0 0 90px;
  }
}
.information .lead {
  background: #fff;
  color: #54bd95;
  margin: 0 0 30px;
  font-weight: 700;
  padding: 4px;
  line-height: 100%;
  display: inline-block;
}
@media only screen and (max-width: 1269px) {
  .information .lead {
    font-size: 1.35rem;
  }
}
@media only screen and (min-width: 1270px) {
  .information .lead {
    font-size: 1.9rem;
  }
}
.information dl dt {
  margin: 0;
  font-weight: 700;
}
@media only screen and (max-width: 1269px) {
  .information dl dt {
    margin: 0 0 10px;
  }
}
@media only screen and (min-width: 1270px) {
  .information dl dt {
    margin: 0 0 15px;
    font-size: 1.25rem;
  }
}
.information dl dd {
  margin: 0;
}
@media only screen and (min-width: 1270px) {
  .information dl dd {
    width: 75%;
    font-size: 1.1rem;
  }
}
@media only screen and (min-width: 1270px) {
  .information__date {
    display: flex;
  }
  .information__date dl {
    width: 30%;
  }
}
.information__timelate p {
  margin: 0;
}
@media only screen and (max-width: 1269px) {
  .information__timelate {
    margin: 0 0 35px;
  }
}
@media only screen and (min-width: 1270px) {
  .information__timelate {
    margin: 0 0 40px;
  }
}

@media only screen and (max-width: 1269px) {
  .note {
    margin: 0 0 60px;
  }
}
@media only screen and (min-width: 1270px) {
  .note {
    margin: 0 0 90px;
  }
}
@media only screen and (max-width: 1269px) {
  .note ul {
    font-size: 0.95rem;
    line-height: 1.8rem;
    margin: 0 0 0 30px;
    padding: 0;
  }
}
@media only screen and (min-width: 1270px) {
  .note ul {
    font-size: 1.05rem;
  }
}
@media only screen and (max-width: 1269px) {
  .note ul li {
    margin: 0 0 12px;
  }
}
@media only screen and (min-width: 1270px) {
  .note ul li {
    margin: 0 0 10px;
  }
}
.note ul li:last-child {
  margin: 0;
}

@media only screen and (max-width: 1269px) {
  .schedule {
    margin: 0 0 60px;
  }
}
@media only screen and (min-width: 1270px) {
  .schedule {
    margin: 0 0 90px;
  }
}
.schedule table tr {
  display: flex;
  border-top: #fff solid 2px;
}
@media only screen and (max-width: 1269px) {
  .schedule table tr {
    flex-direction: column;
    padding: 30px 0;
  }
}
@media only screen and (min-width: 1270px) {
  .schedule table tr {
    align-items: flex-start;
    padding: 40px 20px;
  }
}
.schedule table tr:last-child {
  border-bottom: #fff solid 2px;
}
.schedule table tr th {
  text-align: left;
}
@media only screen and (max-width: 1269px) {
  .schedule table tr th {
    font-size: 1.15rem;
    margin: 0 0 20px;
  }
}
@media only screen and (min-width: 1270px) {
  .schedule table tr th {
    width: 25%;
    font-size: 1.2rem;
  }
}
@media only screen and (min-width: 1270px) {
  .schedule table tr td {
    width: 75%;
  }
}
.schedule table h4 {
  background: #fff;
  color: #54bd95;
  display: inline-block;
  line-height: 100%;
  letter-spacing: 0.05rem;
  margin: 0 0 25px;
}
@media only screen and (max-width: 1269px) {
  .schedule table h4 {
    font-size: 1.1rem;
    padding: 6px 10px 5px;
  }
}
@media only screen and (min-width: 1270px) {
  .schedule table h4 {
    font-size: 1.4rem;
    padding: 7px 15px 5px;
  }
}
.schedule table p {
  letter-spacing: 0.03rem;
}
@media only screen and (max-width: 1269px) {
  .schedule table p {
    font-size: 0.95rem;
    line-height: 1.8rem;
    margin: 0 0 30px;
  }
}
@media only screen and (min-width: 1270px) {
  .schedule table p {
    font-size: 1.05rem;
    line-height: 1.9rem;
    margin: 0 0 15px;
  }
}
.schedule table p:last-of-type {
  margin: 0;
}
@media only screen and (max-width: 1269px) {
  .schedule__note {
    margin: 25px 0 0;
    font-size: 0.95rem;
    line-height: 1.8rem;
  }
}
@media only screen and (min-width: 1270px) {
  .schedule__note {
    margin: 35px 0 0;
    font-size: 1.05rem;
    line-height: 1.9rem;
  }
}

@media only screen and (min-width: 1270px) {
  .sns {
    position: fixed;
    top: 50%;
    right: 25px;
    z-index: 99;
  }
}
@media only screen and (max-width: 1269px) {
  .sns .section {
    padding: 60px 17px;
    display: flex;
    width: fit-content;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 1270px) {
  .sns .section {
    padding: 0;
  }
}
@media only screen and (max-width: 1269px) {
  .sns__item {
    margin: 0 0 15px;
  }
  .sns__item:last-child {
    margin: 0 0 0 20px;
  }
}
@media only screen and (min-width: 1270px) {
  .sns__item:hover {
    opacity: 0.8;
    transition: 0.3s;
  }
}
@media only screen and (max-width: 1269px) {
  .sns__item p {
    margin: 0 0 10px;
    color: #999;
    font-size: 0.85rem;
  }
}
@media only screen and (min-width: 1270px) {
  .sns__item p {
    display: none;
  }
}
.sns__item a {
  color: #666;
  text-decoration: none;
}
@media only screen and (min-width: 1270px) {
  .sns__item.sns-twitter {
    margin: 0 0 15px;
  }
}
.sns__item.sns-twitter span::before {
  font-family: "Font Awesome 5 Brands";
  font-weight: 900;
  content: "\e61b";
  font-size: 1.3rem;
}
.sns__item.sns-instagram span::before {
  font-family: "Font Awesome 5 Brands";
  font-weight: 900;
  content: "\f16d";
  font-size: 1.3rem;
}

@media only screen and (min-width: 1270px) {
  .sponly {
    display: none;
  }
}

@media only screen and (max-width: 1269px) {
  .pconly {
    display: none;
  }
}

.fadein-top {
  opacity: 0;
  animation: 0.6s ease-in forwards fadein-top;
}

@keyframes fadein-top {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fadein {
  transform: translate(-50px, 0);
  transition: all 1s;
  opacity: 0;
}
.fadein.scrollin {
  transform: translate(0, 0);
  opacity: 1;
}

.fadein2 {
  transform: translate(-50px, 0);
  transition: all 1.5s;
  opacity: 0;
}
.fadein2.scrollin {
  transform: translate(0, 0);
  opacity: 1;
}

.fadein3 {
  transform: translate(-50px, 0);
  transition: all 2s;
  opacity: 0;
}
.fadein3.scrollin {
  transform: translate(0, 0);
  opacity: 1;
}

.bottom {
  position: relative;
  z-index: 5;
  background: url(../img/bottom.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: left;
  padding: 10px 0;
}
@media only screen and (min-width: 1270px) {
  .bottom {
    width: 1000px;
    margin: 0 auto;
  }
}
.bottom::before {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
}
@media only screen and (min-width: 1270px) {
  .bottom::before {
    background-position: center;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: 100vh;
  }
}
@media only screen and (max-width: 1269px) {
  .bottom::before {
    background-position: bottom;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: 1500px;
  }
}
.bottom .note {
  position: relative;
  z-index: 6;
  background: rgba(44, 44, 44, 0.8352941176);
  max-width: 1000px;
  width: 100%;
  border: white solid 1px;
}
@media only screen and (max-width: 1269px) {
  .bottom .note {
    max-width: fit-content;
    width: 100%;
    margin: 10px;
    padding: 10px;
  }
}
@media only screen and (min-width: 1270px) {
  .bottom .note {
    margin: 150px auto -10px;
  }
}
.bottom .note h3 {
  padding: 0 0 8px;
  border-bottom: white solid 1px;
}
@media only screen and (max-width: 1269px) {
  .bottom .note h3 {
    font-size: 1rem;
    margin: 10px;
  }
}
@media only screen and (min-width: 1270px) {
  .bottom .note h3 {
    margin: 50px;
    font-size: 1.3rem;
  }
}
@media only screen and (min-width: 1270px) {
  .bottom .note_item {
    margin: 50px;
  }
}
.bottom .note_item:last-child {
  margin: 0;
}
.bottom .note_item p {
  margin: 0;
  padding: 0;
  line-height: 1.9rem;
}
.bottom .note_item p a {
  color: #f06b4a;
  text-decoration: none;
  word-break: break-all;
}
.bottom .note_item p a:hover {
  text-decoration: underline;
}
.bottom .note_item ul {
  margin: 0 0 0 20px;
  padding: 0;
}
.bottom .note_item ul li {
  margin: 0 0 7px;
  line-height: 1.8rem;
}
.bottom .note_item ul li:last-child {
  margin: 0;
}
.bottom .note_item ul li span {
  font-weight: bold;
}

.link {
  background: #f06b4a;
  text-align: center;
  font-weight: bold;
  height: 65px;
  line-height: 70px;
  position: relative;
  transition: 0.5s;
}
@media only screen and (min-width: 1270px) {
  .link {
    max-width: 500px;
    width: 100%;
    margin: 70px auto;
    border-radius: 10px;
  }
}
.link::before {
  content: "";
  position: absolute;
  right: 10%;
  border: 0px;
  border-top: solid 4px #fff;
  border-right: solid 4px #fff;
  transform: rotate(45deg);
  pointer-events: none;
  top: 42.5%;
  width: 10px;
  height: 10px;
}
.link:hover {
  background: #f06b4a;
}
.link a {
  color: #ffffff;
  text-decoration: none;
  letter-spacing: 0.1rem;
  display: block;
  width: 100%;
}
@media only screen and (min-width: 1270px) {
  .link a {
    font-size: 1.3rem;
  }
}

.check {
  background: #474747;
  box-sizing: border-box;
}
@media only screen and (max-width: 1269px) {
  .check {
    margin: 25px 0 0;
    padding: 25px 20px;
  }
}
@media only screen and (min-width: 1270px) {
  .check {
    max-width: 800px;
    margin: 35px auto 0;
    padding: 28px 30px;
  }
}
.check p {
  text-align: center;
}
@media only screen and (max-width: 1269px) {
  .check p {
    font-size: 0.9rem;
    margin: 0 0 12px;
  }
}
@media only screen and (min-width: 1270px) {
  .check p {
    line-height: 1.6rem;
    margin: 0 0 13px;
  }
}
.check__box {
  text-align: center;
}
.check__box label {
  font-weight: 600;
}
@media only screen and (max-width: 1269px) {
  .check__box label {
    font-size: 1rem;
  }
}
@media only screen and (min-width: 1270px) {
  .check__box label {
    font-size: 1.05rem;
    cursor: pointer;
  }
}
.check__box input[type=checkbox] {
  transform: scale(1.3);
  margin: 0 10px 0 0;
  position: relative;
}
@media only screen and (max-width: 1269px) {
  .check__box input[type=checkbox] {
    top: 1px;
  }
}

.apply-btn {
  transition: 0.5s;
  background: #1a1311;
  text-align: center;
  font-weight: 600;
  position: relative;
  border-radius: 4px;
}
@media only screen and (max-width: 1269px) {
  .apply-btn {
    margin: 30px 0 0;
    height: 60px;
    line-height: 60px;
    font-size: 0.95rem;
  }
}
@media only screen and (min-width: 1270px) {
  .apply-btn {
    margin: 40px auto 0;
    width: 700px;
    height: 75px;
    line-height: 75px;
    font-size: 1.2rem;
    transition: 0.3s;
  }
  .apply-btn:hover {
    background: #333;
  }
}
.apply-btn::after {
  content: "";
  pointer-events: none;
}
@media only screen and (max-width: 1269px) {
  .apply-btn::after {
    width: 7px;
    height: 7px;
    right: 20px;
  }
}
@media only screen and (min-width: 1270px) {
  .apply-btn::after {
    width: 10px;
    height: 10px;
    right: 30px;
  }
}
.apply-btn a {
  display: block;
  width: 100%;
  text-decoration: none;
}
.apply-btn.is-inactive {
  background: #ccc;
  pointer-events: none;
}
.apply-btn.is-active {
  background: #f06b4a;
  pointer-events: auto;
}
.apply-btn.is-active:hover {
  background: #1e8bc5;
}

.msg {
  background: #ccc;
  text-align: center;
  font-weight: bold;
  height: 65px;
  line-height: 70px;
  position: relative;
  transition: 0.5s;
  text-decoration: none;
  letter-spacing: 0.1rem;
  display: block;
  width: 100%;
}
@media only screen and (min-width: 1270px) {
  .msg {
    max-width: 500px;
    width: 100%;
    margin: 70px auto 0;
    border-radius: 5px;
    font-size: 1.3rem;
  }
}

.date {
  text-align: center;
  font-weight: bold;
}

.bg::after {
  content: "";
  background-image: url(../img/tower.png);
  background-repeat: no-repeat;
  position: absolute;
  inset: 0;
  z-index: 1;
}
@media only screen and (max-width: 1269px) {
  .bg::after {
    background-size: cover;
    background-position: top;
  }
}
@media only screen and (min-width: 1270px) {
  .bg::after {
    background-size: 30vh;
    background-position: center;
  }
}
@media only screen and (min-width: 1270px) {
  .bg::after {
    height: 100%;
    min-height: 100vh;
  }
}

.noise-wrapper {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  z-index: 10;
  padding: 0;
}
.noise-wrapper:after {
  content: "";
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 100%);
}

.noise {
  overflow: hidden;
  position: fixed;
  top: -500px;
  right: -500px;
  bottom: -500px;
  left: -500px;
  background: transparent url(../img/noise.png) 0 0;
  background-size: 750px 750px;
  opacity: 0.5;
  animation: noise 0.5s steps(8, end) infinite both;
}

@keyframes noise {
  0% {
    transform: translateX(0px, 0px);
  }
  10% {
    transform: translate(-100px, 100px);
  }
  20% {
    transform: translate(150px, -100px);
  }
  30% {
    transform: translate(-100px, 100px);
  }
  40% {
    transform: translate(100px, -150px);
  }
  50% {
    transform: translate(-100px, 200px);
  }
  60% {
    transform: translate(-200px, -100px);
  }
  70% {
    transform: translateY(50px, 100px);
  }
  80% {
    transform: translate(100px, -150px);
  }
  90% {
    transform: translate(0px, 200px);
  }
  100% {
    transform: translate(-100px, 100px);
  }
}
header, footer {
  position: relative;
  z-index: 100;
}/*# sourceMappingURL=style.css.map */