@charset "utf-8";

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  list-style: none;
  line-height: 0;
}

body {
  position: relative;
  background: #fff;
  color: #000;
  font-family: 'メイリオ','Meiryo','Hiragino Sans','ヒラギノ角ゴシック','Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','ＭＳ Ｐゴシック',Osaka,Verdana,sans-serif;
  line-height: 1.6;
  max-width: 100vw;
  min-width: auto;
}
img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

@media only print {
  .no-print {
    display: none;
    visibility: hidden;
  }
}

.wrapper {
  width: 75vw;
  max-width: 1500px;
  margin: 0 auto;
}
@media screen and (max-width: 640px) {
  .wrapper {
    width: 100%;
  }
}

.button:hover {
  opacity: 0.7;
  transition: all 0.2s;
  cursor: pointer;
}

.kv {
  position: relative;
}

.logo01 {
    width: 9.5%;
    position: absolute;
    top: 7.9%;
    left: 2.6%;
}
.logo02 {
    width: 12%;
    position: absolute;
    top: 7.9%;
    left: 85.6%;
}
.logo03 {
    width: 22%;
    position: absolute;
    top: 65.5%;
    left: 75%;
}

.item {
  position: relative;
}

.btn1 {
    width: 21.2%;
    position: absolute;
    top: 90%;
    left: 6.8%;
}
.btn2 {
    width: 21.2%;
    position: absolute;
    top: 90%;
    left: 52.7%;
}
.btn3 {
    width: 21.2%;
    position: absolute;
    top: 55.5%;
    left: 6.8%;
}

.btn4 {
    width: 21.2%;
    position: absolute;
    top: 55.5%;
    left: 52.6%;
}
.btn5 {
    width: 21.2%;
    position: absolute;
    top: 86.19%;
    left: 53.3%;
}

.btn6 {
    width: 21.2%;
    position: absolute;
    top: 97.8%;
    left: 39.4%;
}


.banner{
  width: 60%;
  position: absolute;
  top: 81%;
  left: 19.8%;
}

@media screen and (max-width: 640px) {
  .banner{
      width: 70%;
      position: absolute;
      top: 82%;
      left: 14.8%;
  }
}


/* モーダルコンテンツ
--------------------------------------------- */
/* allergies */
.modal__content .allergies {
  position: absolute;
  right: 8.4%;
  width: 24.575%;
}
.modal__content .allergies.link01 {
  top: 68.9%;
}

.modal__content .allergies.link02 {
  top: 66.5%;
}

/* modal */
.modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1001;
  visibility: visible;
}

.modal__bg {
  background: rgba(0,0,0,0.8);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  overflow-y: scroll;
}

.js-modal__content-outer {
  position: fixed;
  width: 100%;
  height: 100vh;
}

.modal__content {
  position: relative;
  width: 1001px;
  height: auto;
  margin: 10vw auto;
}
@media screen and (max-width: 1024px) {
  .modal__content {
    width: 90vw;
    margin: 15vw auto 10vw auto;
  }
}

.js-modal-close {
  position: absolute;
  top: -9%;
  right: 0;
  display: block;
  width: min(4.4vw, 66px);
  height: min(4.4vw, 66px);
  cursor: pointer;
}
@media screen and (max-width: 640px) {
  .js-modal-close {
    top: -8.6vw;
    width: 6.6vw;
    height: 6.6vw;
  }
}

.cookie_consent-consent_banner__description span{
  line-height: 1.6;
}