@charset "UTF-8";
/* Scss Document */
.flex_30 {
  width: 30%;
}

.flex_31 {
  width: 31%;
}

.flex_32 {
  width: 32%;
}

.flex_33 {
  width: 33%;
}

.flex_34 {
  width: 34%;
}

.flex_35 {
  width: 35%;
}

.flex_36 {
  width: 36%;
}

.flex_37 {
  width: 37%;
}

.flex_38 {
  width: 38%;
}

.flex_39 {
  width: 39%;
}

.flex_40 {
  width: 40%;
}

.flex_41 {
  width: 41%;
}

.flex_42 {
  width: 42%;
}

.flex_43 {
  width: 43%;
}

.flex_44 {
  width: 44%;
}

.flex_45 {
  width: 45%;
}

.flex_46 {
  width: 46%;
}

.flex_47 {
  width: 47%;
}

.flex_48 {
  width: 48%;
}

.flex_49 {
  width: 49%;
}

.flex_50 {
  width: 50%;
}

.flex_51 {
  width: 51%;
}

.flex_52 {
  width: 52%;
}

.flex_53 {
  width: 53%;
}

.flex_54 {
  width: 54%;
}

.flex_55 {
  width: 55%;
}

.flex_56 {
  width: 56%;
}

.flex_57 {
  width: 57%;
}

.flex_58 {
  width: 58%;
}

.flex_59 {
  width: 59%;
}

.flex_60 {
  width: 60%;
}

.flex_61 {
  width: 61%;
}

.flex_62 {
  width: 62%;
}

.flex_63 {
  width: 63%;
}

.flex_64 {
  width: 64%;
}

.flex_65 {
  width: 65%;
}

.flex_66 {
  width: 66%;
}

.flex_67 {
  width: 67%;
}

.flex_68 {
  width: 68%;
}

.flex_69 {
  width: 69%;
}

.flex_70 {
  width: 70%;
}

.padding100 {
  padding-top: 100px;
  padding-bottom: 100px;
}

.padding110 {
  padding-top: 110px;
  padding-bottom: 110px;
}

.padding120 {
  padding-top: 120px;
  padding-bottom: 120px;
}

.padding130 {
  padding-top: 130px;
  padding-bottom: 130px;
}

.padding140 {
  padding-top: 140px;
  padding-bottom: 140px;
}

.padding150 {
  padding-top: 150px;
  padding-bottom: 150px;
}

.padding160 {
  padding-top: 160px;
  padding-bottom: 160px;
}

.padding170 {
  padding-top: 170px;
  padding-bottom: 170px;
}

.padding180 {
  padding-top: 180px;
  padding-bottom: 180px;
}

.padding190 {
  padding-top: 190px;
  padding-bottom: 190px;
}

.padding200 {
  padding-top: 200px;
  padding-bottom: 200px;
}

.padding210 {
  padding-top: 210px;
  padding-bottom: 210px;
}

.padding220 {
  padding-top: 220px;
  padding-bottom: 220px;
}

.padding230 {
  padding-top: 230px;
  padding-bottom: 230px;
}

.padding240 {
  padding-top: 240px;
  padding-bottom: 240px;
}

.padding250 {
  padding-top: 250px;
  padding-bottom: 250px;
}

.padding260 {
  padding-top: 260px;
  padding-bottom: 260px;
}

.padding270 {
  padding-top: 270px;
  padding-bottom: 270px;
}

.padding280 {
  padding-top: 280px;
  padding-bottom: 280px;
}

.padding290 {
  padding-top: 290px;
  padding-bottom: 290px;
}

.padding300 {
  padding-top: 300px;
  padding-bottom: 300px;
}

.margin100 {
  margin-top: 100px;
  margin-bottom: 100px;
}

.margin110 {
  margin-top: 110px;
  margin-bottom: 110px;
}

.margin120 {
  margin-top: 120px;
  margin-bottom: 120px;
}

.margin130 {
  margin-top: 130px;
  margin-bottom: 130px;
}

.margin140 {
  margin-top: 140px;
  margin-bottom: 140px;
}

.margin150 {
  margin-top: 150px;
  margin-bottom: 150px;
}

.margin160 {
  margin-top: 160px;
  margin-bottom: 160px;
}

.margin170 {
  margin-top: 170px;
  margin-bottom: 170px;
}

.margin180 {
  margin-top: 180px;
  margin-bottom: 180px;
}

.margin190 {
  margin-top: 190px;
  margin-bottom: 190px;
}

.margin200 {
  margin-top: 200px;
  margin-bottom: 200px;
}

.margin210 {
  margin-top: 210px;
  margin-bottom: 210px;
}

.margin220 {
  margin-top: 220px;
  margin-bottom: 220px;
}

.margin230 {
  margin-top: 230px;
  margin-bottom: 230px;
}

.margin240 {
  margin-top: 240px;
  margin-bottom: 240px;
}

.margin250 {
  margin-top: 250px;
  margin-bottom: 250px;
}

.margin260 {
  margin-top: 260px;
  margin-bottom: 260px;
}

.margin270 {
  margin-top: 270px;
  margin-bottom: 270px;
}

.margin280 {
  margin-top: 280px;
  margin-bottom: 280px;
}

.margin290 {
  margin-top: 290px;
  margin-bottom: 290px;
}

.margin300 {
  margin-top: 300px;
  margin-bottom: 300px;
}

.pt-110 {
  padding-top: 110px;
}

.pt-120 {
  padding-top: 120px;
}

.pt-130 {
  padding-top: 130px;
}

.pt-140 {
  padding-top: 140px;
}

.pt-150 {
  padding-top: 150px;
}

.pt-160 {
  padding-top: 160px;
}

.pt-170 {
  padding-top: 170px;
}

.pt-180 {
  padding-top: 180px;
}

.pt-190 {
  padding-top: 190px;
}

.pt-200 {
  padding-top: 200px;
}

.pt-210 {
  padding-top: 210px;
}

.pt-220 {
  padding-top: 220px;
}

.pt-230 {
  padding-top: 230px;
}

.pt-240 {
  padding-top: 240px;
}

.pt-250 {
  padding-top: 250px;
}

.pt-260 {
  padding-top: 260px;
}

.pt-270 {
  padding-top: 270px;
}

.pt-280 {
  padding-top: 280px;
}

.pt-290 {
  padding-top: 290px;
}

.pt-300 {
  padding-top: 300px;
}

.pb-110 {
  padding-bottom: 110px;
}

.pb-120 {
  padding-bottom: 120px;
}

.pb-130 {
  padding-bottom: 130px;
}

.pb-140 {
  padding-bottom: 140px;
}

.pb-150 {
  padding-bottom: 150px;
}

.pb-160 {
  padding-bottom: 160px;
}

.pb-170 {
  padding-bottom: 170px;
}

.pb-180 {
  padding-bottom: 180px;
}

.pb-190 {
  padding-bottom: 190px;
}

.pb-200 {
  padding-bottom: 200px;
}

.pb-210 {
  padding-bottom: 210px;
}

.pb-220 {
  padding-bottom: 220px;
}

.pb-230 {
  padding-bottom: 230px;
}

.pb-240 {
  padding-bottom: 240px;
}

.pb-250 {
  padding-bottom: 250px;
}

.pb-260 {
  padding-bottom: 260px;
}

.pb-270 {
  padding-bottom: 270px;
}

.pb-280 {
  padding-bottom: 280px;
}

.pb-290 {
  padding-bottom: 290px;
}

.pb-300 {
  padding-bottom: 300px;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.mb-110 {
  margin-bottom: 110px;
}

.mb-120 {
  margin-bottom: 120px;
}

.mb-130 {
  margin-bottom: 130px;
}

.mb-140 {
  margin-bottom: 140px;
}

.mb-150 {
  margin-bottom: 150px;
}

.mb-160 {
  margin-bottom: 160px;
}

.mb-170 {
  margin-bottom: 170px;
}

.mb-180 {
  margin-bottom: 180px;
}

.mb-190 {
  margin-bottom: 190px;
}

.mb-200 {
  margin-bottom: 200px;
}

.mb-210 {
  margin-bottom: 210px;
}

.mb-220 {
  margin-bottom: 220px;
}

.mb-230 {
  margin-bottom: 230px;
}

.mb-240 {
  margin-bottom: 240px;
}

.mb-250 {
  margin-bottom: 250px;
}

.mb-260 {
  margin-bottom: 260px;
}

.mb-270 {
  margin-bottom: 270px;
}

.mb-280 {
  margin-bottom: 280px;
}

.mb-290 {
  margin-bottom: 290px;
}

.mb-300 {
  margin-bottom: 300px;
}

* {
  text-decoration: none !important;
}

.sp_more {
  display: none;
}

/**トップページ　タイトルアニメーション***/
.toptitleMove span:nth-child(1) {
  animation: title2 0.6s ease 0.1s forwards;
}

.toptitleMove span:nth-child(2) {
  animation: title2 0.6s ease 0.115s forwards;
}

.toptitleMove span:nth-child(3) {
  animation: title2 0.6s ease 0.13s forwards;
}

.toptitleMove span:nth-child(4) {
  animation: title2 0.6s ease 0.145s forwards;
}

.toptitleMove span:nth-child(5) {
  animation: title2 0.6s ease 0.16s forwards;
}

.toptitleMove span:nth-child(6) {
  animation: title2 0.6s ease 0.175s forwards;
}

.toptitleMove span:nth-child(7) {
  animation: title2 0.6s ease 0.19s forwards;
}

.toptitleMove span:nth-child(8) {
  animation: title2 0.6s ease 0.205s forwards;
}

.toptitleMove span:nth-child(9) {
  animation: title2 0.6s ease 0.22s forwards;
}

.toptitleMove span:nth-child(10) {
  animation: title2 0.6s ease 0.235s forwards;
}

.toptitleMove span:nth-child(11) {
  animation: title2 0.6s ease 0.25s forwards;
}

.toptitleMove span:nth-child(12) {
  animation: title2 0.6s ease 0.265s forwards;
}

.toptitleMove span:nth-child(13) {
  animation: title2 0.6s ease 0.28s forwards;
}

.toptitleMove span:nth-child(14) {
  animation: title2 0.6s ease 0.295s forwards;
}

.toptitleMove span:nth-child(15) {
  animation: title2 0.6s ease 0.31s forwards;
}

.toptitleMove span:nth-child(16) {
  animation: title2 0.6s ease 0.325s forwards;
}

.toptitleMove span:nth-child(17) {
  animation: title2 0.6s ease 0.34s forwards;
}

.toptitleMove span:nth-child(18) {
  animation: title2 0.6s ease 0.355s forwards;
}

.toptitleMove span:nth-child(19) {
  animation: title2 0.6s ease 0.37s forwards;
}

.toptitleMove span:nth-child(20) {
  animation: title2 0.6s ease 0.385s forwards;
}

.toptitleMove span:nth-child(21) {
  animation: title2 0.6s ease 0.4s forwards;
}

.toptitleMove span:nth-child(22) {
  animation: title2 0.6s ease 0.415s forwards;
}

.toptitleMove span:nth-child(23) {
  animation: title2 0.6s ease 0.43s forwards;
}

.toptitleMove span:nth-child(24) {
  animation: title2 0.6s ease 0.445s forwards;
}

.toptitleMove span:nth-child(25) {
  animation: title2 0.6s ease 0.46s forwards;
}

.toptitleMove span:nth-child(26) {
  animation: title2 0.6s ease 0.475s forwards;
}

.toptitleMove span:nth-child(27) {
  animation: title2 0.6s ease 0.49s forwards;
}

.toptitleMove span:nth-child(28) {
  animation: title2 0.6s ease 0.505s forwards;
}

.toptitleMove span:nth-child(29) {
  animation: title2 0.6s ease 0.52s forwards;
}

.toptitleMove span:nth-child(30) {
  animation: title2 0.6s ease 0.535s forwards;
}

.toptitleMove span:nth-child(31) {
  animation: title2 0.6s ease 0.55s forwards;
}

.toptitleMove span:nth-child(32) {
  animation: title2 0.6s ease 0.565s forwards;
}

.toptitleMove span:nth-child(33) {
  animation: title2 0.6s ease 0.58s forwards;
}

.toptitleMove span:nth-child(34) {
  animation: title2 0.6s ease 0.595s forwards;
}

.toptitleMove span:nth-child(35) {
  animation: title2 0.6s ease 0.61s forwards;
}

.toptitleMove span:nth-child(36) {
  animation: title2 0.6s ease 0.625s forwards;
}

.toptitleMove span:nth-child(37) {
  animation: title2 0.6s ease 0.64s forwards;
}

.toptitleMove span:nth-child(38) {
  animation: title2 0.6s ease 0.655s forwards;
}

.toptitleMove span:nth-child(39) {
  animation: title2 0.6s ease 0.67s forwards;
}

.toptitleMove span:nth-child(40) {
  animation: title2 0.6s ease 0.685s forwards;
}

.toptitleMove span:nth-child(41) {
  animation: title2 0.6s ease 0.7s forwards;
}

.toptitleMove span:nth-child(42) {
  animation: title2 0.6s ease 0.715s forwards;
}

.toptitleMove span:nth-child(43) {
  animation: title2 0.6s ease 0.73s forwards;
}

.toptitleMove span:nth-child(44) {
  animation: title2 0.6s ease 0.745s forwards;
}

.toptitleMove span:nth-child(45) {
  animation: title2 0.6s ease 0.76s forwards;
}

.toptitleMove span:nth-child(46) {
  animation: title2 0.6s ease 0.775s forwards;
}

.toptitleMove span:nth-child(47) {
  animation: title2 0.6s ease 0.79s forwards;
}

.toptitleMove span:nth-child(48) {
  animation: title2 0.6s ease 0.805s forwards;
}

.toptitleMove span:nth-child(49) {
  animation: title2 0.6s ease 0.82s forwards;
}

.toptitleMove span {
  display: inline-block;
  transform: translateY(80px);
}

@keyframes title2 {
  0% {
    transform: translateY(100px);
  }
  100% {
    transform: translateY(0);
  }
}

/**中ページ　タイトルアニメーション***/
.titleMove span:nth-child(1) {
  animation: title 0.6s ease 0.1s forwards;
}

.titleMove span:nth-child(2) {
  animation: title 0.6s ease 0.18s forwards;
}

.titleMove span:nth-child(3) {
  animation: title 0.6s ease 0.26s forwards;
}

.titleMove span:nth-child(4) {
  animation: title 0.6s ease 0.34s forwards;
}

.titleMove span:nth-child(5) {
  animation: title 0.6s ease 0.42s forwards;
}

.titleMove span:nth-child(6) {
  animation: title 0.6s ease 0.5s forwards;
}

.titleMove span:nth-child(7) {
  animation: title 0.6s ease 0.58s forwards;
}

.titleMove span:nth-child(8) {
  animation: title 0.6s ease 0.66s forwards;
}

.titleMove span:nth-child(9) {
  animation: title 0.6s ease 0.74s forwards;
}

.titleMove span:nth-child(10) {
  animation: title 0.6s ease 0.82s forwards;
}

.titleMove span:nth-child(11) {
  animation: title 0.6s ease 0.9s forwards;
}

.titleMove span:nth-child(12) {
  animation: title 0.6s ease 0.98s forwards;
}

.titleMove span:nth-child(13) {
  animation: title 0.6s ease 1.06s forwards;
}

.titleMove span:nth-child(14) {
  animation: title 0.6s ease 1.14s forwards;
}

.titleMove span:nth-child(15) {
  animation: title 0.6s ease 1.22s forwards;
}

.titleMove span:nth-child(16) {
  animation: title 0.6s ease 1.3s forwards;
}

.titleMove span:nth-child(17) {
  animation: title 0.6s ease 1.38s forwards;
}

.titleMove span:nth-child(18) {
  animation: title 0.6s ease 1.46s forwards;
}

.titleMove span:nth-child(19) {
  animation: title 0.6s ease 1.54s forwards;
}

/*
.titleMove span {
    -webkit-clip-path: inset(100% 0 0 0);
    clip-path: inset(100% 0 0 0);
    display: inline-block;
}
@keyframes title {
    0% {
        -webkit-clip-path: inset(100% 0 0 0);
        clip-path: inset(100% 0 0 0);
        transform: translateY(30px);
    }
    100% {
        webkit-clip-path: inset(0);
        clip-path: inset(0);
        transform: translateY(0);
    }
}
*/
.titleMove span {
  display: inline-block;
}

@keyframes title {
  0% {
    transform: translateY(100px);
  }
  100% {
    transform: translateY(0);
  }
}

.title_eng {
  height: 90px;
  overflow: hidden;
  border: 1px solid #FFF;
}

.title_eng span {
  display: inline-block;
  transform: translateY(100px);
}

.title_ja {
  height: 50px;
  overflow: hidden;
}

.title_ja span {
  display: inline-block;
  transform: translateY(100px);
}

@media (min-width: 1024px) {
  /**ANIMATE***/
  .fadeInUp {
    opacity: 0;
    transform: translateY(50px);
  }
  .move.fadeInUp {
    animation: fadeInUp 1.5s ease 0s forwards;
  }
  @keyframes fadeInUp {
    0% {
      opacity: 0;
      transform: translateY(50px);
    }
    100% {
      opacity: 1;
      transform: translateX(0);
    }
  }
  /**/
  .imgOnBg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: scaleX(0);
    transform-origin: left bottom;
    background-color: #000;
    z-index: 500;
  }
  .move .imgOnBg {
    animation: imgOnBg 1.0s ease 0s forwards;
  }
  @keyframes imgOnBg {
    0% {
      transform: scaleX(0);
      transform-origin: right bottom;
    }
    45% {
      transform: scaleX(1);
      transform-origin: right bottom;
    }
    55% {
      transform: scaleX(1);
      transform-origin: left bottom;
    }
    100% {
      transform: scaleX(0);
      transform-origin: left bottom;
    }
  }
  /**/
  .imgFadeIn {
    opacity: 0;
  }
  .move .imgFadeIn {
    animation: imgFadeIn 1.5s ease 0.5s forwards;
  }
  @keyframes imgFadeIn {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  /**/
  .fadeIn {
    opacity: 0;
  }
  .move .fadeIn {
    animation: fadeIn 1.5s ease 0.5s forwards;
  }
  @keyframes fadeIn {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  /***/
  .move.titleUp span:nth-child(1) {
    animation: titleUp 1s ease 0.1s forwards;
  }
  .move.titleUp span:nth-child(2) {
    animation: titleUp 1s ease 0.13s forwards;
  }
  .move.titleUp span:nth-child(3) {
    animation: titleUp 1s ease 0.16s forwards;
  }
  .move.titleUp span:nth-child(4) {
    animation: titleUp 1s ease 0.19s forwards;
  }
  .move.titleUp span:nth-child(5) {
    animation: titleUp 1s ease 0.22s forwards;
  }
  .move.titleUp span:nth-child(6) {
    animation: titleUp 1s ease 0.25s forwards;
  }
  .move.titleUp span:nth-child(7) {
    animation: titleUp 1s ease 0.28s forwards;
  }
  .move.titleUp span:nth-child(8) {
    animation: titleUp 1s ease 0.31s forwards;
  }
  .move.titleUp span:nth-child(9) {
    animation: titleUp 1s ease 0.34s forwards;
  }
  .move.titleUp span:nth-child(10) {
    animation: titleUp 1s ease 0.37s forwards;
  }
  .move.titleUp span:nth-child(11) {
    animation: titleUp 1s ease 0.4s forwards;
  }
  .move.titleUp span:nth-child(12) {
    animation: titleUp 1s ease 0.43s forwards;
  }
  .move.titleUp span:nth-child(13) {
    animation: titleUp 1s ease 0.46s forwards;
  }
  .move.titleUp span:nth-child(14) {
    animation: titleUp 1s ease 0.49s forwards;
  }
  .move.titleUp span:nth-child(15) {
    animation: titleUp 1s ease 0.52s forwards;
  }
  .move.titleUp span:nth-child(16) {
    animation: titleUp 1s ease 0.55s forwards;
  }
  .move.titleUp span:nth-child(17) {
    animation: titleUp 1s ease 0.58s forwards;
  }
  .move.titleUp span:nth-child(18) {
    animation: titleUp 1s ease 0.61s forwards;
  }
  .move.titleUp span:nth-child(19) {
    animation: titleUp 1s ease 0.64s forwards;
  }
  .move.titleUp span:nth-child(20) {
    animation: titleUp 1s ease 0.67s forwards;
  }
  .move.titleUp span:nth-child(21) {
    animation: titleUp 1s ease 0.7s forwards;
  }
  .move.titleUp span:nth-child(22) {
    animation: titleUp 1s ease 0.73s forwards;
  }
  .move.titleUp span:nth-child(23) {
    animation: titleUp 1s ease 0.76s forwards;
  }
  .move.titleUp span:nth-child(24) {
    animation: titleUp 1s ease 0.79s forwards;
  }
  .move.titleUp span:nth-child(25) {
    animation: titleUp 1s ease 0.82s forwards;
  }
  .move.titleUp span:nth-child(26) {
    animation: titleUp 1s ease 0.85s forwards;
  }
  .move.titleUp span:nth-child(27) {
    animation: titleUp 1s ease 0.88s forwards;
  }
  .move.titleUp span:nth-child(28) {
    animation: titleUp 1s ease 0.91s forwards;
  }
  .move.titleUp span:nth-child(29) {
    animation: titleUp 1s ease 0.94s forwards;
  }
  .move.titleUp span:nth-child(30) {
    animation: titleUp 1s ease 0.97s forwards;
  }
  .move.titleUp span:nth-child(31) {
    animation: titleUp 1s ease 1s forwards;
  }
  .move.titleUp span:nth-child(32) {
    animation: titleUp 1s ease 1.03s forwards;
  }
  .move.titleUp span:nth-child(33) {
    animation: titleUp 1s ease 1.06s forwards;
  }
  .move.titleUp span:nth-child(34) {
    animation: titleUp 1s ease 1.09s forwards;
  }
  .move.titleUp span:nth-child(35) {
    animation: titleUp 1s ease 1.12s forwards;
  }
  .move.titleUp span:nth-child(36) {
    animation: titleUp 1s ease 1.15s forwards;
  }
  .move.titleUp span:nth-child(37) {
    animation: titleUp 1s ease 1.18s forwards;
  }
  .move.titleUp span:nth-child(38) {
    animation: titleUp 1s ease 1.21s forwards;
  }
  .move.titleUp span:nth-child(39) {
    animation: titleUp 1s ease 1.24s forwards;
  }
  .move.titleUp span:nth-child(40) {
    animation: titleUp 1s ease 1.27s forwards;
  }
  .move.titleUp span:nth-child(41) {
    animation: titleUp 1s ease 1.3s forwards;
  }
  .move.titleUp span:nth-child(42) {
    animation: titleUp 1s ease 1.33s forwards;
  }
  .move.titleUp span:nth-child(43) {
    animation: titleUp 1s ease 1.36s forwards;
  }
  .move.titleUp span:nth-child(44) {
    animation: titleUp 1s ease 1.39s forwards;
  }
  .move.titleUp span:nth-child(45) {
    animation: titleUp 1s ease 1.42s forwards;
  }
  .move.titleUp span:nth-child(46) {
    animation: titleUp 1s ease 1.45s forwards;
  }
  .move.titleUp span:nth-child(47) {
    animation: titleUp 1s ease 1.48s forwards;
  }
  .move.titleUp span:nth-child(48) {
    animation: titleUp 1s ease 1.51s forwards;
  }
  .move.titleUp span:nth-child(49) {
    animation: titleUp 1s ease 1.54s forwards;
  }
  .titleUp {
    overflow: hidden;
  }
  .titleUp.eng_60 {
    height: 70px;
  }
  .titleUp.title_22 {
    height: 40px;
    margin-top: 10px;
  }
  .titleUp span {
    transform: translateY(100px);
    display: inline-block;
  }
  @keyframes titleUp {
    0% {
      transform: translateY(100px);
    }
    100% {
      transform: translateY(0);
    }
  }
}

/***************************/
.section a {
  color: inherit;
}

.custom-cursor {
  cursor: url("../images/cursor_b.png"), auto;
}

#js-mouse {
  pointer-events: none;
  position: fixed;
  top: -100px;
  left: -100px;
  width: 201px;
  height: 201px;
  background: url("../images/cursor_b.png") left 0/100% 100% no-repeat;
  border-radius: 50%;
  transform: translate(0, 0);
  transition: all 0.3s ease-out;
  z-index: 9999;
  opacity: 0;
}

#js-mouse.js-hover-white {
  background: url("../images/cursor_w.png") left 0/100% 100% no-repeat;
}

#js-cursor {
  pointer-events: none;
  position: fixed;
  top: -15px;
  left: -15px;
  width: 201px;
  height: 201px;
  border-radius: 50%;
  transform: translate(0, 0);
  z-index: 10000;
  opacity: 0;
}

html body .js-area a {
  cursor: none;
}

.js-area a {
  display: block;
}

.active .logo img {
  opacity: 0;
  /*        filter: invert(100%);*/
}

.active .logo:after {
  opacity: 1;
}

.active .logo_in img {
  opacity: 0;
}

.active .logo_in:after {
  opacity: 1;
}

.active .online {
  border-color: #231815;
}

.active .online a {
  color: #231815;
}

.active .online img {
  filter: invert(100%);
}

.active .insta_fixed a {
  color: inherit;
}

.active .insta_fixed img {
  filter: invert(100%);
}

.active .cy_footer p {
  color: #231815;
}

.active #spicon .open {
  filter: invert(0%);
}

/**中ページのbody***/
.body_in #spicon .open {
  filter: invert(0%);
}

.body_in .online {
  border-color: #231815;
}

.body_in .online a {
  color: #231815;
}

.body_in .online img {
  filter: invert(100%);
}

.body_in .insta_fixed a {
  color: #231815;
}

.body_in .insta_fixed img {
  filter: invert(100%);
}

.body_in .cy_footer p {
  color: #231815;
}

.body_in.active .logo img {
  opacity: 0;
}

.body_in.active .logo:after {
  background-image: url("../images/top1.png");
  opacity: 1;
}

.body_in.active .online {
  border: 1px solid #FFF;
}

.body_in.active .online a {
  color: #FFF;
}

.body_in.active .online img {
  filter: invert(0%);
}

.body_in.active #spicon .open {
  filter: invert(100%);
}

.body_in.active .insta_fixed a {
  color: #FFF;
}

.body_in.active .insta_fixed img {
  filter: invert(0%);
}

.body_in.active .cy_footer p {
  color: #FFF;
}

@media only screen and (min-width: 1024px) {
  .body_in.first .logo img, .body_in.addBody .logo img {
    opacity: 1;
  }
  .body_in.first .online, .body_in.addBody .online {
    border-color: #FFF;
  }
  .body_in.first .online a, .body_in.addBody .online a {
    color: #FFF;
  }
  .body_in.first .online img, .body_in.addBody .online img {
    filter: invert(0%);
  }
  .body_in.first #spicon .open, .body_in.addBody #spicon .open {
    filter: invert(100%);
  }
  .body_in.first .insta_fixed a, .body_in.addBody .insta_fixed a {
    color: #231815;
  }
  .body_in.first .insta_fixed img, .body_in.addBody .insta_fixed img {
    filter: invert(100%);
  }
  .body_in.first .cy_footer p, .body_in.addBody .cy_footer p {
    color: #FFF;
  }
}

@media only screen and (max-width: 1024px) {
  .body_in.first .logo img, .body_in.addBody .logo img {
    opacity: 0;
  }
  .body_in.first .logo:after, .body_in.addBody .logo:after {
    background-image: url("../images/top1.png");
    opacity: 1;
  }
  .body_in.first #spicon .open, .body_in.addBody #spicon .open {
    filter: invert(100%);
  }
  .body_in.first .insta_fixed a, .body_in.addBody .insta_fixed a {
    color: #FFF;
  }
  .body_in.first .insta_fixed img, .body_in.addBody .insta_fixed img {
    filter: invert(0%);
  }
  .body_in.first .cy_footer p, .body_in.addBody .cy_footer p {
    color: #FFF;
  }
}

/***********************/
.insta_fixed {
  position: fixed;
  left: 50px;
  bottom: 30px;
  z-index: 999;
}

.insta_fixed a {
  color: #FFF;
  transition: 0.5s ease;
  font-size: 15px;
}

.insta_fixed img {
  margin-left: 10px;
  transition: 0.5s ease;
}

.cy_footer {
  position: fixed;
  right: 50px;
  bottom: 30px;
  z-index: 999;
}

.cy_footer p {
  font-size: 14px;
  color: #FFF;
  transition: 0.5s ease;
}

/************************/
.cy_header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  padding: 25px 0 20px;
  border-bottom: 1px solid #dcdcdc;
  transition: 0.5s ease;
}

.h_flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1760px;
  width: 94%;
  margin: 0 auto;
}

.logo {
  position: relative;
}

.logo a {
  position: relative;
  z-index: 999;
}

.logo:after {
  content: "";
  background: url("../images/logo_in.png") left 0/100% 100% no-repeat;
  width: 155px;
  height: 56px;
  position: absolute;
  top: 0;
  left: 0;
  transition: 0.5s ease;
  opacity: 0;
}

.logo img {
  transition: 0.5s ease;
}

.online {
  width: 230px;
  margin-right: 110px;
  transition: 0.5s ease;
  border: 1px solid #FFF;
}

.online a {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  color: #FFF;
  padding: 10px 0;
  transition: 0.5s ease;
}

.online:hover {
  border-color: #270606;
}

.online:hover a {
  background-color: #270606;
  color: #FFF;
}

.online:hover a img {
  filter: invert(0%);
}

.online img {
  margin-right: 10px;
  position: relative;
  top: -2px;
  transition: 0.5s ease;
}

/***********************/
.top_main {
  background: url("../images/main.jpg") 50% 0/cover no-repeat;
  height: 100vh;
  width: 100vw;
  display: flex;
  justify-content: center;
  align-items: center;
}

.top_title {
  font-size: 55px;
  color: #FFF;
  text-align: center;
  line-height: 1.5em;
  margin-top: 100px;
  letter-spacing: 0.07em;
  height: 75px;
  overflow: hidden;
}

.sp_top_title {
  display: none;
}

/***************/
.sec02_flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 1880px;
}

.sec02_left {
  width: 46%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.title_18 {
  font-size: 18px;
}

.sec02_eng {
  font-size: 16px;
  text-align: right;
  margin-left: 150px;
}

.sec02_right {
  width: 50%;
}

.sec02_right img {
  width: 100%;
  height: 100vh;
  object-fit: cover;
}

/**************/
.sec03_container {
  min-width: 2460px;
  width: 100%;
}

.sec03_flex {
  width: 90%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.sec03_left {
  width: 46%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.be_bb {
  position: relative;
}

.be_bb:before {
  content: "";
  border-bottom: 1px solid #cf4092;
  width: 70px;
  position: absolute;
  left: -110px;
  top: 50%;
  transform: translateY(-50%);
}

.eng_60 {
  font-size: 60px;
  line-height: 1.3em;
}

.title_22 {
  font-size: 22px;
}

.line_height20 {
  line-height: 2em;
}

.line_height22 {
  line-height: 2.2em;
}

.line_height24 {
  line-height: 2.4em;
}

.sec03_right {
  width: 54%;
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

.sec03_right img {
  width: 100%;
  height: auto;
}

.sec03_img1 {
  width: 160px;
  position: relative;
  z-index: 500;
  top: 60px;
}

.sec03_img1 .imgOnBg {
  width: calc(100% + 280px);
}

.sec03_img1 img {
  width: calc(100% + 280px);
  height: auto;
}

.sec03_img2 {
  width: calc(100% - 160px);
  margin-top: -20px;
}

.more_shape {
  position: absolute;
  right: 140px;
  bottom: 0;
  z-index: 500;
}

.more_shape a {
  border: 1px solid #231815;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.more_shape.more_w a {
  border-color: #FFF;
}

/******************/
.sec04_cont {
  width: 2920px;
  display: block;
  height: 100vh;
}

.sec04_flex {
  width: 2920px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100vh;
  background-color: #070101;
}

.sec04_left {
  background: linear-gradient(45deg, #070101, #230505);
  width: 35%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
}

.sec04_left.baked_gra {
  background: linear-gradient(25deg, #070101, #400e0e);
}

.sec04_left.choco_gra {
  background: linear-gradient(45deg, #0f0101, #581616);
}

.sec04_right {
  width: 65%;
  position: relative;
  background-color: #FFF;
}

.sec04_right .img100 img {
  width: 100%;
  height: 100vh;
  object-fit: cover;
}

.eng_absolute {
  font-size: 220px;
  line-height: 0.5em;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  letter-spacing: 0.06em;
  color: #FFF;
  z-index: 600;
  mix-blend-mode: overlay;
}

.more_shape.sec04_more {
  right: 140px;
  bottom: 90px;
}

.ml_minus {
  margin-left: -2px;
}

/******************/
.sec07_flex {
  width: 1650px;
  display: flex;
  justify-content: space-between;
  height: 100%;
}

.sec07_left {
  width: 70%;
  max-width: 890px;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.sec07_right {
  width: 30%;
  position: relative;
}

.sec07_right .img100 img {
  width: 100%;
  height: 100vh;
  object-fit: cover;
}

.more_shape.sec07_more {
  right: auto;
  left: -110px;
  bottom: 95px;
}

/*********/
.sec08_container {
  width: 1390px;
  text-align: center;
}

.sec08_img {
  text-align: center;
  margin: 80px auto 0;
  max-width: 980px;
}

.sec08_img img {
  max-width: 100%;
  height: auto;
}

/******************/
.sec09_flex {
  width: 2480px;
  display: flex;
  justify-content: space-between;
  height: 100%;
}

.sec09_left {
  background: linear-gradient(45deg, #070101, #230505);
  width: 46%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
}

.sec09_right {
  width: 54%;
  position: relative;
}

.sec09_right .img100 img {
  width: 100%;
  height: 100vh;
  object-fit: cover;
}

.more_shape.sec09_more {
  right: auto;
  left: -40px;
  bottom: 95px;
}

/******************/
.sec10_gra {
  background: linear-gradient(#070101, #230505);
  width: 2150px;
}

.sec10_flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1620px;
  width: 90%;
  margin: 0 auto;
  height: 100vh;
}

.sec10_left {
  width: 40%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
}

.sec10_more a {
  color: #FFF;
  font-size: 15px;
  position: relative;
  height: 46px;
  padding-right: 60px;
}

.sec10_more span {
  position: absolute;
  right: 0;
  top: 50%;
  border-radius: 50%;
  transform: translateY(-50%);
  border: 1px solid #FFF;
  width: 46px;
  height: 46px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.sec10_more img {
  width: 14px;
  height: auto;
}

.sec10_right {
  width: 56%;
  max-width: 940px;
  position: relative;
}

.insta ul {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 20px;
  row-gap: 20px;
}

.insta ul li {
  overflow: hidden;
}

.insta img {
  width: 220px;
  height: 220px;
  object-fit: cover;
  transition: 0.3s ease;
}

.insta a:hover img {
  transform: scale(1.1);
}

/**********************/
.sec11_container {
  width: 2020px;
}

.sec11_flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1480px;
  width: 90%;
  margin: 0 auto;
}

.sec11_left {
  width: 60%;
  position: relative;
  height: 100vh;
  display: flex;
  align-items: center;
  padding-left: 100px;
}

.more_shape.sec11_more {
  position: absolute;
  left: auto;
  right: 0;
  bottom: 80px;
}

.sec11_right {
  width: 40%;
  max-width: 565px;
  display: flex;
  justify-content: space-between;
}

@media (min-width: 1024px) {
  /* ------------------------------
   loopSlider
------------------------------ */
  .loopSliderWrap {
    top: 0;
    left: 0;
    height: 370px;
    position: absolute;
  }
  .loopSlider {
    width: 100%;
    height: 370px;
    text-align: left;
    position: relative;
    margin-top: -250px;
  }
  .loopSlider ul {
    height: 370px;
    float: left;
  }
  .loopSlider ul li {
    height: 370px;
    display: block;
    overflow: hidden;
    width: 270px;
  }
  .loopSlider ul li img {
    height: auto;
    width: 100%;
  }
  /* ------------------------------
   loopSlider
------------------------------ */
  .loopSliderWrap2 {
    bottom: 0;
    left: 0;
    height: 370px;
    position: absolute;
    padding-top: 250px;
  }
  .loopSlider2 {
    width: 100%;
    height: 370px;
    text-align: left;
    position: relative;
  }
  .loopSlider2 ul {
    height: 370px;
    float: left;
  }
  .loopSlider2 ul li {
    height: 370px;
    display: block;
    overflow: hidden;
    width: 270px;
  }
  .loopSlider2 ul li img {
    height: auto;
    width: 100%;
  }
}

@media (max-width: 1024px) {
  /* ------------------------------
   loopSlider
------------------------------ */
  .loopSliderWrap {
    top: 0;
    left: 0;
    height: 260px;
    overflow: hidden;
    position: absolute;
  }
  .loopSlider {
    width: 100%;
    height: 260px;
    text-align: left;
    position: relative;
    overflow: hidden;
    margin-top: 0;
  }
  .loopSlider ul {
    height: 274px;
    float: left;
    display: block;
  }
  .loopSlider ul li {
    height: 274px;
    float: left;
    display: inline;
    overflow: hidden;
    width: 200px;
    padding: 0 5px;
  }
  .loopSlider ul li img {
    height: auto;
    width: 100%;
  }
  /* ------------------------------
   loopSlider
------------------------------ */
  .loopSliderWrap2 {
    top: 0;
    right: 0;
    height: 274px;
    overflow: hidden;
    position: absolute;
    margin-right: -100px;
  }
  .loopSlider2 {
    width: 100%;
    height: 274px;
    text-align: left;
    position: relative;
    overflow: hidden;
  }
  .loopSlider2 ul {
    height: 274px;
    float: left;
    display: block;
    overflow: visible;
  }
  .loopSlider2 ul li {
    height: 274px;
    float: left;
    display: inline;
    overflow: hidden;
    width: 200px;
    padding: 0 5px;
  }
  .loopSlider2 ul li img {
    height: auto;
    width: 100%;
  }
}

@media (max-width: 740px) {
  /* ------------------------------
   loopSlider
------------------------------ */
  .loopSliderWrap {
    height: 170px;
  }
  .loopSlider {
    height: 170px;
  }
  .loopSlider ul {
    height: 178px;
  }
  .loopSlider ul li {
    height: 178px;
    width: 130px;
  }
  /* ------------------------------
   loopSlider
------------------------------ */
  .loopSliderWrap2 {
    height: 178px;
    margin-right: -100px;
  }
  .loopSlider2 {
    height: 178px;
  }
  .loopSlider2 ul {
    height: 178px;
  }
  .loopSlider2 ul li {
    height: 178px;
    width: 130px;
  }
}

/* ------------------------------
   CLEARFIX ELEMENTS
------------------------------ */
.loopSliderWrap:after, .loopSliderWrap2:after {
  content: "";
  display: none;
  clear: none;
}

/******************/
.sec12_gra {
  background: url("../images/top_gra.jpg") 50% 0/cover no-repeat;
  width: 2930px;
}

.sec12_flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin: 0 auto;
  height: 100vh;
}

.sec12_flex .js-area {
  width: 2034px;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sec12_flex .js-area a {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
  padding-left: 360px;
  width: 100%;
}

.sec12_left {
  width: 710px;
}

.sec12_map {
  width: 970px;
  padding-top: 80px;
}

.sec12_map iframe {
  width: 100%;
  max-height: 650px;
  height: 70vh;
}

.sec12_right {
  width: calc(100% - 2034px);
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sec12_right a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-left: auto;
  width: 280px;
  color: #FFF;
  font-size: 25px;
}

.sec12_right a span {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  border: 1px solid #FFF;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  top: -3px;
}

/***************************************************************

    コンセプト

***************************************************************/
.main_in {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  width: 2400px;
}

.title_in {
  padding-bottom: 200px;
  width: calc(100% - 1280px);
}

.title_in > div {
  width: 90%;
  max-width: 800px;
  margin: 0 auto;
}

.title_in p {
  font-size: 92px;
  line-height: 1em;
  white-space: nowrap;
}

.title_in h2 {
  font-size: 24px;
  white-space: nowrap;
  padding-top: 10px;
}

.main_img {
  width: 1280px;
}

.main_img img {
  width: 100%;
  height: 100vh;
  min-height: 950px;
  object-fit: cover;
}

/********************************/
.con02_gra {
  width: 2520px;
  background: linear-gradient(45deg, #070101, #230505);
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.con02_flex {
  max-width: 1980px;
  width: 90%;
  padding-top: 80px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.con02_left {
  width: 50%;
}

.con02_right {
  width: 45%;
  max-width: 710px;
  color: #FFF;
}

/*******/
.con03_img {
  width: 1400px;
}

.con03_img img {
  width: 100%;
  height: 100vh;
  object-fit: cover;
}

/********/
.con04_container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2080px;
}

.con04_flex {
  display: flex;
  justify-content: space-between;
  max-width: 1500px;
  margin: 0 auto;
}

.con04_left {
  width: 500px;
}

.con04_right {
  width: calc(100% - 500px);
}

.con04_right ul {
  position: relative;
}

.con04_right ul:after {
  content: "";
  border-left: 1px solid #1a1315;
  position: absolute;
  left: 7px;
  top: 8px;
  height: calc(100% - 16px);
}

.con04_right ul li {
  padding-left: 50px;
  position: relative;
}

.con04_right ul li:nth-child(n+2) {
  margin-top: 30px;
}

.con04_right ul li:after {
  content: "";
  background-color: #752940;
  border: 3px solid #FFF;
  width: 15px;
  height: 15px;
  position: absolute;
  left: 0;
  top: 6px;
  border-radius: 50px;
  z-index: 500;
}

/**********/
.sec05_img {
  width: 520px;
}

.sec05_img img {
  width: 100%;
  height: 100vh;
  object-fit: cover;
}

/**********/
.back_content {
  background: linear-gradient(45deg, #120202, #5a1717);
  width: 900px;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

.back_content.bg_none {
  background: none;
}

.back_content p {
  width: 560px;
  text-align: center;
}

.back_content p a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-left: auto;
  width: 280px;
  margin: 0 auto;
  color: #FFF;
  font-size: 25px;
}

.back_content p a span {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  border: 1px solid #FFF;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  top: -3px;
}

/**************************************************************

    商品

**************************************************************/
.products_gra {
  background: url("../images/item_bg.jpg") 50% 0/cover no-repeat;
  height: 100vh;
  width: 12613px;
  display: flex;
  align-items: center;
}

.pro_flex {
  width: 2030px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100vh;
}

.pro_left {
  width: 860px;
  color: #FFF;
}

.pro_left > div {
  width: 470px;
  margin-left: auto;
}

.pro_right {
  width: 1000px;
  margin-top: 100px;
}

.pro_right img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/*******/
.pro01_img {
  width: 1880px;
  text-align: right;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.pro01_img img {
  width: 1672px;
  height: 100%;
  object-fit: cover;
}

/**************************************************************

    BEAN TO BAR

**************************************************************/
.bean_gra {
  background: url("../images/bean_bg1.jpg") left 0/cover no-repeat;
  min-width: 3087px;
  width: 100%;
  height: 100vh;
}

.bean01_flex {
  max-width: 2550px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.bean01_left {
  display: flex;
  align-items: center;
  color: #FFF;
  width: calc(100% - 1020px);
  padding-top: 80px;
}

.bean_logo {
  margin-right: 150px;
}

.bean01_right {
  width: 1020px;
  display: flex;
  justify-content: space-between;
  height: 100vh;
}

.bean01_right > div {
  height: calc(100vh - 80px);
}

.bean01_right > div:nth-child(2) {
  display: flex;
  align-items: flex-end;
  margin-top: 80px;
}

.bean01_right > div img {
  width: 480px;
  height: calc(100vh - 80px);
  object-fit: cover;
}

/**************/
.bean02_cont {
  width: 100%;
  min-width: 4200px;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bean02_flex {
  display: flex;
  justify-content: space-between;
  max-width: 3760px;
  width: 100%;
  margin: 0 auto;
}

.bean02_left {
  width: 590px;
  padding-left: 160px;
}

.bean02_right {
  width: calc(100% - 590px);
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  column-gap: 150px;
  row-gap: 0;
}

.bean02_right > div {
  border: 1px solid #1a1315;
  padding: 40px 25px 50px;
  position: relative;
}

.bean02_right > div:after {
  content: "";
  background: url("../images/bean_shape.jpg") left 0/41px 79px no-repeat;
  width: 41px;
  height: 79px;
  position: absolute;
  right: -100px;
  top: 50%;
  transform: translateY(-50%);
}

.bean02_right > div:last-child:after {
  display: none;
}

.bean02_right > div h3 {
  font-size: 30px;
  margin: 20px 0 10px;
  text-align: center;
}

.bean_num {
  text-align: center;
  width: fit-content;
  font-size: 40px;
  margin: 0 auto;
  border-bottom: 2px solid #752940;
  line-height: 1.3em;
}

.bean_text2 {
  line-height: 2em;
  text-align: center;
}

/********************************************/
.bean04_gra {
  background: url("../images/bean_bg2.jpg") left 0/cover no-repeat;
  min-width: 6890px;
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
}

.bean04_flex1 {
  display: flex;
  justify-content: space-between;
  width: 2210px;
  padding-top: 80px;
}

.bean04_left1 {
  width: calc(100% - 960px);
  padding-left: 360px;
  color: #FFF;
  padding-top: 80px;
}

.bean04_right1 {
  width: 960px;
}

.bean04_right1 img {
  width: 100%;
  height: 640px;
  object-fit: cover;
}

/****/
.bean04_flex2 {
  display: flex;
  justify-content: space-between;
  padding-top: 80px;
  color: #FFF;
}

.bean04_left2 {
  width: 1040px;
  padding-left: 350px;
  padding-top: 60px;
}

.bean04_right2 {
  width: calc(100% - 1040px);
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  column-gap: 65px;
  row-gap: 40px;
  min-height: 65vh;
  max-height: 80vh;
}

.line_up {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.line_up > div {
  display: flex;
  justify-content: space-between;
}

.line_up > div:nth-child(n+2) {
  margin-top: 20px;
}

.line_up_img {
  width: 258px;
}

.line_up_img img {
  width: 100%;
  height: auto;
}

.line_up_text {
  width: calc(100% - 310px);
}

.line_up_text .eng {
  font-size: 26px;
  line-height: 1.5em;
}

.line_up_text h3 {
  font-size: 16px;
  margin-top: 5px;
}

.line_up_text .text {
  margin-top: 15px;
}

/*********/
.bean05_img img {
  width: 730px;
  height: 100vh;
  object-fit: cover;
}

/**************************************************************

    GIFT

**************************************************************/
.gift_gra {
  background: linear-gradient(45deg, #050000, #360a0a);
  min-width: 2630px;
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
  padding-top: 80px;
}

.gift_flex {
  max-width: 2090px;
  width: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.gift_right {
  width: 1110px;
}

.gift_right img {
  width: 1110px;
  max-height: 680px;
  height: 80vh;
  object-fit: cover;
}

/*********/
.gift03_cont {
  width: 1840px;
  height: 100vh;
}

.gift03_flex {
  display: flex;
  justify-content: space-between;
  max-width: 1400px;
  margin: 0 auto;
}

.gift03_right {
  order: 2;
  width: calc(100% - 800px);
  display: flex;
  align-items: center;
  padding-top: 80px;
}

.title_33 {
  font-size: 33px;
  line-height: 1.5em;
}

.gift03_left {
  width: 620px;
}

.gift03_left img {
  width: 100%;
  height: 92vh;
  object-fit: cover;
}

/*********/
.gift04_cont {
  width: 1640px;
  height: 100vh;
}

.gift04_flex {
  display: flex;
  justify-content: space-between;
  margin: 0 auto;
}

/**************************************************************

    RECRUIT

**************************************************************/
.rec_gra {
  background: linear-gradient(45deg, #050000, #360a0a);
  min-width: 2700px;
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
  padding-top: 80px;
}

.rec_flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #FFF;
  max-width: 2150px;
  margin: 0 auto;
}

.rec_left {
  width: 970px;
  padding-left: 120px;
}

.rec_right {
  width: 980px;
}

.rec_right img {
  width: 980px;
  max-height: 680px;
  height: 80vh;
  object-fit: cover;
}

/***************/
.rec03_cont {
  width: 100%;
  min-width: 3760px;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rec03_flex {
  min-width: 3320px;
  width: 90%;
  margin: 0 auto;
  padding-top: 80px;
  display: flex;
  justify-content: space-between;
}

.rec03_flex > div {
  display: flex;
  justify-content: space-between;
  width: 1020px;
  margin: 0 auto;
}

.rec03_left {
  width: 560px;
  padding-top: 80px;
}

.rec03_right {
  width: 450px;
}

.rec03_right img {
  width: 450px;
  max-height: 680px;
  height: 80vh;
  object-fit: cover;
}

/*********************/
.rec04_gra {
  min-width: 2525px;
  width: 100%;
  height: 100vh;
  color: #FFF;
  background: linear-gradient(45deg, #110101, #5c1818);
}

.rec04_flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #FFF;
}

.rec04_left {
  width: 1630px;
  padding-left: 360px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-top: 80px;
}

.rec04_left .be_bb {
  width: 470px;
}

.rec04_table {
  width: calc(100% - 470px);
}

.rec04_table > div {
  display: flex;
  justify-content: space-between;
  padding: 25px 10px;
  border-bottom: 1px solid #FFF;
}

.rec_cell1 {
  width: 165px;
}

.rec_cell2 {
  width: calc(100% - 165px);
}

/**************************************************************

    SHOP

**************************************************************/
.shop_gra {
  background: linear-gradient(45deg, #050000, #360a0a);
  min-width: 2520px;
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
  padding-top: 80px;
}

.shop_flex {
  max-width: 2000px;
  width: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.shop_left {
  width: 940px;
  padding-left: 110px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100vh;
  position: relative;
  padding-bottom: 120px;
}

.shop_left > div {
  width: 100%;
}

.ac_table > div {
  display: flex;
  justify-content: space-between;
  padding: 2px 0;
}

.ac_cell1 {
  width: 80px;
}

.ac_cell2 {
  width: calc(100% - 80px);
}

.shop_img {
  position: absolute;
  right: 0;
  bottom: 0;
  text-align: right;
}

.shop_right {
  width: 960px;
}

.shop_right iframe {
  width: 100%;
  height: 80vh;
  max-height: 650px;
}

/*****************/
.shop03_cont {
  min-width: 2760px;
  width: 100%;
  background: linear-gradient(20deg, #050000, #461010);
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100vh;
  color: #FFF;
  padding-top: 80px;
}

.shop03_flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.shop03_left {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-left: 320px;
}

.shop03_left .be_bb {
  width: 570px;
  margin-top: 80px;
}

.calendar {
  width: 960px;
}

.calendar img {
  width: 960px;
  max-height: 640px;
  height: 80vh;
  object-fit: cover;
}

.calendar iframe {
  width: 960px;
  max-height: 640px;
  height: 80vh;
}

/* PC用
------------------------------------------------------------*/
@media only screen and (max-width: 1200px) {
  /************************/
  .top_title {
    font-size: 40px;
    color: #FFF;
    text-align: center;
    line-height: 1.4em;
    letter-spacing: 0.07em;
    height: 60px;
  }
}

@media only screen and (max-width: 1024px) {
  .padding100 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding110 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding120 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding130 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding140 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding150 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding160 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding170 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding180 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding190 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding200 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding210 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding220 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding230 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding240 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding250 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding260 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding270 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding280 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding290 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .padding300 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .margin100 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin110 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin120 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin130 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin140 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin150 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin160 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin170 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin180 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin190 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin200 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin210 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin220 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin230 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin240 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin250 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin260 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin270 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin280 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin290 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .margin300 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .pt-120 {
    padding-top: 120px;
  }
  .pt-130 {
    padding-top: 120px;
  }
  .pt-140 {
    padding-top: 120px;
  }
  .pt-150 {
    padding-top: 120px;
  }
  .pt-160 {
    padding-top: 120px;
  }
  .pt-170 {
    padding-top: 120px;
  }
  .pt-180 {
    padding-top: 120px;
  }
  .pt-190 {
    padding-top: 120px;
  }
  .pt-200 {
    padding-top: 120px;
  }
  .pt-210 {
    padding-top: 120px;
  }
  .pt-220 {
    padding-top: 120px;
  }
  .pt-230 {
    padding-top: 120px;
  }
  .pt-240 {
    padding-top: 120px;
  }
  .pt-250 {
    padding-top: 120px;
  }
  .pt-260 {
    padding-top: 120px;
  }
  .pt-270 {
    padding-top: 120px;
  }
  .pt-280 {
    padding-top: 120px;
  }
  .pt-290 {
    padding-top: 120px;
  }
  .pt-300 {
    padding-top: 120px;
  }
  .pb-120 {
    padding-bottom: 120px;
  }
  .pb-130 {
    padding-bottom: 120px;
  }
  .pb-140 {
    padding-bottom: 120px;
  }
  .pb-150 {
    padding-bottom: 120px;
  }
  .pb-160 {
    padding-bottom: 120px;
  }
  .pb-170 {
    padding-bottom: 120px;
  }
  .pb-180 {
    padding-bottom: 120px;
  }
  .pb-190 {
    padding-bottom: 120px;
  }
  .pb-200 {
    padding-bottom: 120px;
  }
  .pb-210 {
    padding-bottom: 120px;
  }
  .pb-220 {
    padding-bottom: 120px;
  }
  .pb-230 {
    padding-bottom: 120px;
  }
  .pb-240 {
    padding-bottom: 120px;
  }
  .pb-250 {
    padding-bottom: 120px;
  }
  .pb-260 {
    padding-bottom: 120px;
  }
  .pb-270 {
    padding-bottom: 120px;
  }
  .pb-280 {
    padding-bottom: 120px;
  }
  .pb-290 {
    padding-bottom: 120px;
  }
  .pb-300 {
    padding-bottom: 120px;
  }
  .mt-120 {
    margin-top: 120px;
  }
  .mt-130 {
    margin-top: 120px;
  }
  .mt-140 {
    margin-top: 120px;
  }
  .mt-150 {
    margin-top: 120px;
  }
  .mt-160 {
    margin-top: 120px;
  }
  .mt-170 {
    margin-top: 120px;
  }
  .mt-180 {
    margin-top: 120px;
  }
  .mt-190 {
    margin-top: 120px;
  }
  .mt-200 {
    margin-top: 120px;
  }
  .mt-210 {
    margin-top: 120px;
  }
  .mt-220 {
    margin-top: 120px;
  }
  .mt-230 {
    margin-top: 120px;
  }
  .mt-240 {
    margin-top: 120px;
  }
  .mt-250 {
    margin-top: 120px;
  }
  .mt-260 {
    margin-top: 120px;
  }
  .mt-270 {
    margin-top: 120px;
  }
  .mt-280 {
    margin-top: 120px;
  }
  .mt-290 {
    margin-top: 120px;
  }
  .mt-300 {
    margin-top: 120px;
  }
  .mb-120 {
    margin-bottom: 120px;
  }
  .mb-130 {
    margin-bottom: 120px;
  }
  .mb-140 {
    margin-bottom: 120px;
  }
  .mb-150 {
    margin-bottom: 120px;
  }
  .mb-160 {
    margin-bottom: 120px;
  }
  .mb-170 {
    margin-bottom: 120px;
  }
  .mb-180 {
    margin-bottom: 120px;
  }
  .mb-190 {
    margin-bottom: 120px;
  }
  .mb-200 {
    margin-bottom: 120px;
  }
  .mb-210 {
    margin-bottom: 120px;
  }
  .mb-220 {
    margin-bottom: 120px;
  }
  .mb-230 {
    margin-bottom: 120px;
  }
  .mb-240 {
    margin-bottom: 120px;
  }
  .mb-250 {
    margin-bottom: 120px;
  }
  .mb-260 {
    margin-bottom: 120px;
  }
  .mb-270 {
    margin-bottom: 120px;
  }
  .mb-280 {
    margin-bottom: 120px;
  }
  .mb-290 {
    margin-bottom: 120px;
  }
  .mb-300 {
    margin-bottom: 120px;
  }
  .sp_more {
    display: flex;
    align-items: center;
    font-size: 15px;
    position: relative;
    height: 46px;
    padding-right: 60px;
    width: 170px;
  }
  .sp_more span {
    position: absolute;
    right: 0;
    top: 50%;
    border-radius: 50%;
    transform: translateY(-50%);
    border: 1px solid #231815;
    width: 46px;
    height: 46px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .sp_more img {
    width: 14px;
    height: auto;
  }
  .sp_more.sp_more_w span {
    border-color: #FFF;
  }
  .cy_header {
    border-bottom: 0;
  }
  .top_main {
    width: 100%;
  }
  .be_bb:before {
    display: none;
    left: -80px;
  }
  /***************/
  .sec02_flex {
    display: block;
    width: 90%;
    margin: 0 auto;
    padding: 100px 0 0;
  }
  .sec02_left {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .sec02_right {
    width: 100%;
    margin-top: 100px;
  }
  .sec02_right img {
    width: 100%;
    height: 100vh;
    object-fit: cover;
  }
  /**************/
  .sec03_container {
    min-width: 90%;
    width: 90%;
    margin: 0 auto;
    padding-top: 100px;
  }
  .sec03_flex {
    width: 100%;
    display: block;
  }
  .sec03_left {
    width: 100%;
    display: block;
  }
  .sec03_right {
    width: 100%;
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-top: 60px;
  }
  .sec03_right img {
    width: 100%;
    height: auto;
  }
  .sec03_img1 {
    width: 20%;
    position: relative;
    z-index: 500;
    top: 60px;
  }
  .sec03_img1 img {
    width: 200%;
    height: auto;
  }
  .sec03_img2 {
    width: calc(100% - 120px);
    margin-top: -20px;
  }
  .more_shape {
    right: 0px;
    bottom: auto;
    top: -150px;
  }
  .more_shape a {
    width: 120px;
    height: 120px;
  }
  .more_shape a img {
    width: 40px;
    height: auto;
  }
  /******************/
  .sec04_flex {
    width: 100%;
    display: block;
    margin: 100px auto 0;
    height: 100%;
  }
  .sec04_flex.spmt-0 {
    margin-top: 0;
  }
  .sec04_left {
    background: linear-gradient(45deg, #070101, #230505);
    width: 100%;
    height: auto;
    display: block;
    padding: 100px 0;
  }
  .sec04_left > div {
    width: 90%;
    margin: 0 auto;
  }
  .sec04_right {
    width: 100%;
    margin-top: 0;
  }
  .sec04_right .img100 img {
    height: 500px;
  }
  .eng_absolute {
    font-size: 13vw;
    line-height: 0.6em;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
    letter-spacing: 0.06em;
    color: #FFF;
    mix-blend-mode: overlay;
  }
  .more_shape.sec04_more {
    right: 30px;
    bottom: auto;
    top: -210px;
  }
  .ml_minus {
    margin-left: -2px;
  }
  /******************/
  .sec07_flex {
    width: 100%;
    display: block;
    margin: 0 auto;
    padding: 100px 0 0;
  }
  .sec07_left {
    width: 90%;
    max-width: 90%;
    margin: 0 auto;
    height: auto;
    display: block;
  }
  .sec07_right {
    width: 100%;
    margin-top: 60px;
  }
  .sec07_right .img100 img {
    width: 100%;
    height: 500px;
    object-fit: cover;
  }
  .more_shape.sec07_more {
    left: auto;
    right: 30px;
    bottom: auto;
    top: -160px;
  }
  /*********/
  .sec08_container {
    width: 90%;
    margin: 0 auto;
    text-align: center;
  }
  .sec08_img {
    text-align: center;
  }
  .sec08_img img {
    max-width: 100%;
    height: auto;
  }
  /******************/
  .sec09_flex {
    width: 100%;
    display: block;
    margin-top: 100px;
  }
  .sec09_left {
    width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
    padding: 100px 0;
  }
  .sec09_left > div {
    width: 90%;
    margin: 0 auto;
  }
  .sec09_right {
    width: 100%;
    position: relative;
  }
  .sec09_right .img100 img {
    width: 100%;
    height: 500px;
    object-fit: cover;
  }
  .more_shape.sec09_more {
    right: auto;
    left: auto;
    right: 20px;
    bottom: auto;
    top: -200px;
  }
  .more_shape.sec09_more a {
    border-color: #FFF;
  }
  /******************/
  .sec10_gra {
    width: 100%;
    padding-bottom: 100px;
  }
  .sec10_flex {
    display: block;
    max-width: 90%;
    width: 90%;
    margin: 0 auto;
    height: auto;
  }
  .sec10_left {
    width: 100%;
    display: block;
    padding: 100px 0;
  }
  .sec10_more a {
    color: #FFF;
    font-size: 15px;
    position: relative;
    height: 46px;
    padding-right: 60px;
  }
  .sec10_more span {
    position: absolute;
    right: 0;
    top: 50%;
    border-radius: 50%;
    transform: translateY(-50%);
    border: 1px solid #FFF;
    width: 46px;
    height: 46px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .sec10_more img {
    width: 14px;
    height: auto;
  }
  .sec10_right {
    width: 100%;
    max-width: 100%;
    position: relative;
  }
  /**********************/
  .sec11_container {
    width: 100%;
    margin: 0 auto;
  }
  .sec11_flex {
    display: block;
    justify-content: space-between;
    align-items: center;
    max-width: 1480px;
    width: 100%;
    margin: 0 auto;
  }
  .sec11_left {
    width: 90%;
    margin: 0 auto;
    height: auto;
    display: block;
    padding: 100px 0;
  }
  .more_shape.sec11_more {
    position: absolute;
    left: auto;
    right: 0;
    bottom: 80px;
  }
  .sec11_right {
    width: 100%;
    max-width: 100%;
    display: block;
    justify-content: space-between;
  }
  /******************/
  .sec12_gra {
    width: 100%;
  }
  .sec12_flex {
    display: block;
    width: 90%;
    margin: 0 auto;
    height: auto;
  }
  .sec12_flex .js-area {
    width: 100%;
    height: auto;
    display: block;
  }
  .sec12_flex .js-area a {
    display: block;
    padding-left: 0;
    width: 100%;
  }
  .sec12_left {
    width: 100%;
    padding: 80px 0 0;
  }
  .sec12_map {
    width: 100%;
    padding-top: 40px;
    margin: 0 auto;
  }
  .sec12_map iframe {
    width: 100%;
    max-height: auto;
    height: 400px;
  }
  .sec12_right {
    width: 100%;
    text-align: center;
    display: block;
    padding: 100px 0;
  }
  .insta_fixed {
    display: none;
  }
  .cy_footer {
    position: fixed;
    right: 50px;
    bottom: 30px;
    z-index: 999;
  }
  .cy_footer p {
    font-size: 14px;
    color: #FFF;
    transition: 0.5s ease;
  }
  /***************************************************************

    コンセプト

***************************************************************/
  .main_in {
    display: block;
    width: 100%;
    position: relative;
  }
  .title_in {
    padding-bottom: 0;
    width: 100%;
    position: absolute;
    bottom: 60px;
    left: 0;
    z-index: 500;
  }
  .title_in > div {
    width: 90%;
    max-width: 90%;
  }
  .title_in p {
    font-size: 62px;
    line-height: 1em;
    white-space: nowrap;
    width: fit-content;
    background-color: #FFF;
    padding: 5px 10px 0;
  }
  .title_in h2 {
    font-size: 20px;
    white-space: nowrap;
    width: fit-content;
    background-color: #FFF;
    padding: 5px 10px 1px;
    margin-top: 10px;
    line-height: 1em;
  }
  .title_eng {
    height: 70px;
  }
  .title_ja {
    height: 30px;
  }
  .main_img {
    width: 100%;
  }
  .main_img img {
    width: 100%;
    height: 500px;
    min-height: 500px;
    object-fit: cover;
  }
  /********************************/
  .con02_gra {
    width: 100%;
    height: auto;
    display: block;
  }
  .con02_flex {
    max-width: 1980px;
    width: 90%;
    padding: 80px 0;
    margin: 0 auto;
    display: block;
  }
  .con02_left {
    width: 100%;
  }
  .con02_left img {
    width: 100%;
    height: auto;
  }
  .con02_right {
    width: 100%;
    max-width: 100%;
    color: #FFF;
    margin-top: 60px;
  }
  /*******/
  .con03_img {
    width: 100%;
  }
  .con03_img img {
    width: 100%;
    height: 500px;
    object-fit: cover;
  }
  /********/
  .con04_container {
    display: block;
    width: 90%;
    margin: 0 auto;
    padding: 80px 0;
  }
  .con04_flex {
    display: block;
    max-width: 100%;
    margin: 0 auto;
  }
  .con04_left {
    width: 100%;
  }
  .con04_right {
    width: 100%;
    margin-top: 40px;
  }
  .con04_right ul {
    position: relative;
  }
  .con04_right ul:after {
    content: "";
    border-left: 1px solid #1a1315;
    position: absolute;
    left: 7px;
    top: 8px;
    height: calc(100% - 16px);
  }
  .con04_right ul li {
    padding-left: 50px;
    position: relative;
  }
  .con04_right ul li:nth-child(n+2) {
    margin-top: 30px;
  }
  .con04_right ul li:after {
    content: "";
    background-color: #752940;
    border: 3px solid #FFF;
    width: 15px;
    height: 15px;
    position: absolute;
    left: 0;
    top: 6px;
    border-radius: 50px;
    z-index: 500;
  }
  /**********/
  .sec05_img {
    width: 100%;
  }
  .sec05_img img {
    width: 100%;
    height: 500px;
    object-fit: cover;
  }
  /**********/
  .back_content {
    background: linear-gradient(45deg, #120202, #5a1717);
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
    padding: 80px 0;
  }
  .back_content.bg_none {
    background: none;
  }
  .back_content p {
    width: 100%;
    text-align: center;
  }
  .back_content p a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-left: auto;
    width: 280px;
    margin: 0 auto;
    color: #FFF;
    font-size: 25px;
  }
  .back_content p a span {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 1px solid #FFF;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    top: -3px;
  }
  /**************************************************************

    商品

**************************************************************/
  .products_gra {
    background: linear-gradient(45deg, #050000, #360a0a);
    height: auto;
    width: 100%;
    display: block;
  }
  .pro_flex {
    width: 100%;
    display: block;
    height: auto;
  }
  .pro_left {
    width: 90%;
    color: #FFF;
    margin: 0 auto;
    padding: 80px 0;
  }
  .pro_left > div {
    width: 100%;
    margin-left: auto;
  }
  .pro_right {
    width: 100%;
    margin-top: 0;
  }
  .pro_right img {
    height: 500px;
  }
  /*******/
  .pro01_img {
    width: 90%;
    margin: 80px auto 0;
    text-align: center;
    display: block;
  }
  .pro01_img img {
    width: 100%;
    height: auto;
  }
  /**************************************************************

    BEAN TO BAR

**************************************************************/
  .bean_gra {
    background: linear-gradient(45deg, #050000, #360a0a);
    min-width: 100%;
    width: 100%;
    height: auto;
  }
  .bean01_flex {
    max-width: 100%;
    margin: 0 auto;
    display: block;
    justify-content: space-between;
    align-items: center;
    padding: 80px 0 0;
  }
  .bean01_left {
    display: block;
    width: 90%;
    margin: 0 auto;
    padding: 0;
    text-align: center;
  }
  .bean_logo {
    margin-right: 0;
  }
  .bean_text {
    margin-top: 40px;
    text-align: left;
  }
  .bean01_right {
    width: 100%;
    display: flex;
    height: auto;
    margin-top: 60px;
  }
  .bean01_right > div {
    height: auto;
  }
  .bean01_right > div:nth-child(2) {
    display: flex;
    align-items: flex-end;
    margin-top: 0;
  }
  .bean01_right > div img {
    width: 100%;
    height: auto;
  }
  /**************/
  .bean02_cont {
    width: 100%;
    min-width: 100%;
    height: auto;
    display: block;
  }
  .bean02_flex {
    display: block;
    max-width: 90%;
    width: 90%;
    margin: 0 auto;
    padding: 80px 0;
  }
  .bean02_left {
    width: 100%;
    padding-left: 0;
  }
  .bean02_right {
    padding-top: 40px;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 20px;
    row-gap: 20px;
  }
  .bean02_right > div {
    border: 1px solid #1a1315;
    padding: 40px 25px 50px;
    position: relative;
  }
  .bean02_right > div:after {
    display: none;
    content: "";
    background: url("../images/bean_shape.jpg") left 0/30px 60px no-repeat;
    width: 30px;
    height: 60px;
    position: absolute;
    right: -48px;
    top: 50%;
    transform: translateY(-50%);
  }
  .bean02_right > div:last-child:after {
    display: none;
  }
  .bean02_right > div:nth-child(2n):after {
    display: none;
  }
  .bean02_right > div h3 {
    font-size: 30px;
    margin: 20px 0 10px;
    text-align: center;
  }
  .bean_num {
    text-align: center;
    width: fit-content;
    font-size: 40px;
    margin: 0 auto;
    border-bottom: 2px solid #752940;
    line-height: 1.3em;
  }
  .bean_text2 {
    line-height: 2em;
    text-align: center;
  }
  /********************************************/
  .bean04_gra {
    background: linear-gradient(45deg, #050000, #360a0a);
    min-width: 100%;
    width: 100%;
    height: auto;
    display: block;
    align-items: center;
  }
  .bean04_flex1 {
    display: block;
    width: 100%;
    padding-top: 0;
  }
  .bean04_left1 {
    width: 90%;
    margin: 0 auto;
    padding-left: 0;
    padding: 80px 0;
  }
  .bean04_right1 {
    width: 100%;
  }
  .bean04_right1 img {
    width: 100%;
    height: 500px;
    object-fit: cover;
  }
  /****/
  .bean04_flex2 {
    display: block;
    padding-top: 0;
    height: auto;
    padding-bottom: 80px;
  }
  .bean04_left2 {
    width: 90%;
    margin: 0 auto;
    padding-left: 0;
    padding: 80px 0;
  }
  .bean04_right2 {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    column-gap: 0;
    row-gap: 0;
    min-height: 0;
    max-height: 100%;
  }
  .line_up {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 90%;
    margin: 20px auto;
  }
  .line_up > div {
    display: flex;
    justify-content: space-between;
  }
  .line_up > div:nth-child(n+2) {
    margin-top: 40px;
  }
  .line_up_img {
    width: 258px;
  }
  .line_up_img img {
    width: 100%;
    height: auto;
  }
  .line_up_text {
    width: calc(100% - 310px);
  }
  .line_up_text .eng {
    font-size: 26px;
    line-height: 1.5em;
  }
  .line_up_text h3 {
    font-size: 16px;
    margin-top: 5px;
  }
  .line_up_text .text {
    margin-top: 15px;
  }
  /*********/
  .bean05_img img {
    width: 100%;
    height: 500px;
  }
  /**************************************************************

    GIFT

**************************************************************/
  .gift_gra {
    min-width: 100%;
    height: auto;
    display: block;
    padding-top: 0;
  }
  .gift_flex {
    max-width: 100%;
    width: 100%;
    display: block;
  }
  .gift_left {
    width: 90%;
    margin: 0 auto;
    padding: 80px 0;
  }
  .gift_right {
    width: 100%;
  }
  .gift_right img {
    width: 100%;
    max-height: 500px;
    height: 500px;
  }
  /*********/
  .gift03_cont {
    width: 100%;
    height: auto;
  }
  .gift03_flex {
    display: block;
    max-width: 100%;
    margin: 0 auto;
  }
  .gift03_right {
    order: 2;
    width: 90%;
    margin: 0 auto;
    display: block;
    padding-top: 0;
    padding: 80px 0;
  }
  .title_33 {
    font-size: 33px;
    line-height: 1.5em;
  }
  .gift03_left {
    width: 100%;
  }
  .gift03_left img {
    width: 100%;
    height: 500px;
    object-fit: cover;
  }
  /*********/
  .gift04_cont {
    width: 100%;
    height: auto;
  }
  .gift04_flex {
    display: block;
    justify-content: space-between;
    margin: 0 auto;
  }
  /**************************************************************

    RECRUIT

**************************************************************/
  .rec_gra {
    background: linear-gradient(45deg, #050000, #360a0a);
    min-width: 100%;
    height: auto;
    display: block;
    padding-top: 0;
  }
  .rec_flex {
    display: block;
    max-width: 100%;
    margin: 0 auto;
  }
  .rec_left {
    width: 90%;
    margin: 0 auto;
    padding-left: 0;
    padding: 80px 0;
  }
  .rec_right {
    width: 100%;
  }
  .rec_right img {
    width: 100%;
    max-height: 500px;
    height: 500px;
  }
  /***************/
  .rec03_cont {
    width: 100%;
    min-width: 100%;
    height: auto;
    display: block;
  }
  .rec03_flex {
    min-width: 90%;
    width: 90%;
    margin: 0 auto;
    padding-top: 0;
    display: block;
  }
  .rec03_flex > div {
    display: flex;
    width: 100%;
    margin: 80px 0;
  }
  .rec03_left {
    width: 50%;
    padding-top: 0;
  }
  .rec03_right {
    width: 45%;
  }
  .rec03_right img {
    width: 100%;
    max-height: 500px;
    height: 500px;
    object-fit: cover;
  }
  /*********************/
  .rec04_gra {
    min-width: 100%;
    width: 100%;
    height: auto;
  }
  .rec04_flex {
    display: block;
    padding: 80px 0 0;
  }
  .rec04_left {
    width: 90%;
    margin: 0 auto;
    padding-left: 0;
    display: block;
    padding-top: 0;
  }
  .rec04_left .be_bb {
    width: 100%;
  }
  .rec04_table {
    width: 100%;
    margin-top: 40px;
  }
  .rec04_table > div {
    display: flex;
    justify-content: space-between;
    padding: 25px 10px;
    border-bottom: 1px solid #FFF;
  }
  .rec_cell1 {
    width: 165px;
  }
  .rec_cell2 {
    width: calc(100% - 165px);
  }
  /**************************************************************

    SHOP

**************************************************************/
  .shop_gra {
    min-width: 100%;
    width: 100%;
    height: auto;
    display: block;
    padding-top: 0;
  }
  .shop_flex {
    max-width: 100%;
    width: 100%;
    display: block;
  }
  .shop_left {
    width: 90%;
    padding-left: 0;
    display: block;
    height: auto;
    padding-bottom: 0;
    margin: 0 auto;
    padding: 80px 0 60px;
  }
  .shop_left > div {
    width: 100%;
  }
  .shop_img {
    position: static;
    right: 0;
    bottom: 0;
    text-align: right;
    margin-top: 40px;
  }
  .shop_img img {
    width: 100%;
    height: auto;
  }
  .shop_right {
    width: 100%;
  }
  .shop_right iframe {
    width: 100%;
    height: 500px;
    max-height: 500px;
  }
  /*****************/
  .shop03_cont {
    min-width: 100%;
    width: 100%;
    display: block;
    height: auto;
    padding-top: 0;
  }
  .shop03_flex {
    display: block;
    width: 90%;
    margin: 0 auto;
  }
  .shop03_left {
    display: block;
    padding-left: 0;
    padding: 80px 0 0;
  }
  .shop03_left .be_bb {
    width: 100%;
    margin-top: 0;
  }
  .calendar {
    width: 100%;
    margin-top: 60px;
  }
  .calendar img {
    width: 100%;
    max-height: auto;
    height: auto;
  }
  .calendar iframe {
    width: 100%;
    max-height: 640px;
    height: 640px;
  }
}

@media only screen and (max-width: 740px) {
  .flex_30 {
    width: 100%;
  }
  .flex_31 {
    width: 100%;
  }
  .flex_32 {
    width: 100%;
  }
  .flex_33 {
    width: 100%;
  }
  .flex_34 {
    width: 100%;
  }
  .flex_35 {
    width: 100%;
  }
  .flex_36 {
    width: 100%;
  }
  .flex_37 {
    width: 100%;
  }
  .flex_38 {
    width: 100%;
  }
  .flex_39 {
    width: 100%;
  }
  .flex_40 {
    width: 100%;
  }
  .flex_41 {
    width: 100%;
  }
  .flex_42 {
    width: 100%;
  }
  .flex_43 {
    width: 100%;
  }
  .flex_44 {
    width: 100%;
  }
  .flex_45 {
    width: 100%;
  }
  .flex_46 {
    width: 100%;
  }
  .flex_47 {
    width: 100%;
  }
  .flex_48 {
    width: 100%;
  }
  .flex_49 {
    width: 100%;
  }
  .flex_50 {
    width: 100%;
  }
  .flex_51 {
    width: 100%;
  }
  .flex_52 {
    width: 100%;
  }
  .flex_53 {
    width: 100%;
  }
  .flex_54 {
    width: 100%;
  }
  .flex_55 {
    width: 100%;
  }
  .flex_56 {
    width: 100%;
  }
  .flex_57 {
    width: 100%;
  }
  .flex_58 {
    width: 100%;
  }
  .flex_59 {
    width: 100%;
  }
  .flex_60 {
    width: 100%;
  }
  .flex_61 {
    width: 100%;
  }
  .flex_62 {
    width: 100%;
  }
  .flex_63 {
    width: 100%;
  }
  .flex_64 {
    width: 100%;
  }
  .flex_65 {
    width: 100%;
  }
  .flex_66 {
    width: 100%;
  }
  .flex_67 {
    width: 100%;
  }
  .flex_68 {
    width: 100%;
  }
  .flex_69 {
    width: 100%;
  }
  .flex_70 {
    width: 100%;
  }
  .padding100 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding110 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding120 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding130 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding140 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding150 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding160 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding170 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding180 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding190 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding200 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding210 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding220 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding230 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding240 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding250 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding260 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding270 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding280 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding290 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .padding300 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .margin100 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin110 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin120 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin130 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin140 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin150 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin160 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin170 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin180 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin190 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin200 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin210 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin220 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin230 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin240 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin250 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin260 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin270 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin280 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin290 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .margin300 {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .pt-110 {
    padding-top: 100px;
  }
  .pt-120 {
    padding-top: 100px;
  }
  .pt-130 {
    padding-top: 100px;
  }
  .pt-140 {
    padding-top: 100px;
  }
  .pt-150 {
    padding-top: 100px;
  }
  .pt-160 {
    padding-top: 100px;
  }
  .pt-170 {
    padding-top: 100px;
  }
  .pt-180 {
    padding-top: 100px;
  }
  .pt-190 {
    padding-top: 100px;
  }
  .pt-200 {
    padding-top: 100px;
  }
  .pt-210 {
    padding-top: 100px;
  }
  .pt-220 {
    padding-top: 100px;
  }
  .pt-230 {
    padding-top: 100px;
  }
  .pt-240 {
    padding-top: 100px;
  }
  .pt-250 {
    padding-top: 100px;
  }
  .pt-260 {
    padding-top: 100px;
  }
  .pt-270 {
    padding-top: 100px;
  }
  .pt-280 {
    padding-top: 100px;
  }
  .pt-290 {
    padding-top: 100px;
  }
  .pt-300 {
    padding-top: 100px;
  }
  .pb-110 {
    padding-bottom: 100px;
  }
  .pb-120 {
    padding-bottom: 100px;
  }
  .pb-130 {
    padding-bottom: 100px;
  }
  .pb-140 {
    padding-bottom: 100px;
  }
  .pb-150 {
    padding-bottom: 100px;
  }
  .pb-160 {
    padding-bottom: 100px;
  }
  .pb-170 {
    padding-bottom: 100px;
  }
  .pb-180 {
    padding-bottom: 100px;
  }
  .pb-190 {
    padding-bottom: 100px;
  }
  .pb-200 {
    padding-bottom: 100px;
  }
  .pb-210 {
    padding-bottom: 100px;
  }
  .pb-220 {
    padding-bottom: 100px;
  }
  .pb-230 {
    padding-bottom: 100px;
  }
  .pb-240 {
    padding-bottom: 100px;
  }
  .pb-250 {
    padding-bottom: 100px;
  }
  .pb-260 {
    padding-bottom: 100px;
  }
  .pb-270 {
    padding-bottom: 100px;
  }
  .pb-280 {
    padding-bottom: 100px;
  }
  .pb-290 {
    padding-bottom: 100px;
  }
  .mt-110 {
    margin-top: 100px;
  }
  .mt-120 {
    margin-top: 100px;
  }
  .mt-130 {
    margin-top: 100px;
  }
  .mt-140 {
    margin-top: 100px;
  }
  .mt-150 {
    margin-top: 100px;
  }
  .mt-160 {
    margin-top: 100px;
  }
  .mt-170 {
    margin-top: 100px;
  }
  .mt-180 {
    margin-top: 100px;
  }
  .mt-190 {
    margin-top: 100px;
  }
  .mt-200 {
    margin-top: 100px;
  }
  .mt-210 {
    margin-top: 100px;
  }
  .mt-220 {
    margin-top: 100px;
  }
  .mt-230 {
    margin-top: 100px;
  }
  .mt-240 {
    margin-top: 100px;
  }
  .mt-250 {
    margin-top: 100px;
  }
  .mt-260 {
    margin-top: 100px;
  }
  .mt-270 {
    margin-top: 100px;
  }
  .mt-280 {
    margin-top: 100px;
  }
  .mt-290 {
    margin-top: 100px;
  }
  .mt-300 {
    margin-top: 100px;
  }
  .mb-110 {
    margin-bottom: 100px;
  }
  .mb-120 {
    margin-bottom: 100px;
  }
  .mb-130 {
    margin-bottom: 100px;
  }
  .mb-140 {
    margin-bottom: 100px;
  }
  .mb-150 {
    margin-bottom: 100px;
  }
  .mb-160 {
    margin-bottom: 100px;
  }
  .mb-170 {
    margin-bottom: 100px;
  }
  .mb-180 {
    margin-bottom: 100px;
  }
  .mb-190 {
    margin-bottom: 100px;
  }
  .mb-200 {
    margin-bottom: 100px;
  }
  .mb-210 {
    margin-bottom: 100px;
  }
  .mb-220 {
    margin-bottom: 100px;
  }
  .mb-230 {
    margin-bottom: 100px;
  }
  .mb-240 {
    margin-bottom: 100px;
  }
  .mb-250 {
    margin-bottom: 100px;
  }
  .mb-260 {
    margin-bottom: 100px;
  }
  .mb-270 {
    margin-bottom: 100px;
  }
  .mb-280 {
    margin-bottom: 100px;
  }
  .mb-290 {
    margin-bottom: 100px;
  }
  .mb-300 {
    margin-bottom: 100px;
  }
  /************************/
  .cy_header {
    padding: 15px 0 10px;
    border-bottom: 0;
  }
  .h_flex {
    width: 90%;
    margin: 0 auto;
  }
  .logo img {
    width: 120px;
    height: auto;
  }
  .logo:after {
    width: 120px;
    height: 43px;
  }
  .online {
    display: none;
  }
  /***********************/
  .top_main {
    background: url("../images/main.jpg") 50% 0/cover no-repeat;
    height: 600px;
    width: 100vw;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .top_title {
    display: none;
    font-size: 8vw;
    margin-top: 50px;
    height: 60px;
  }
  .sp_top_title {
    display: block;
    font-size: 7vw;
    margin-top: 50px;
    color: #FFF;
    text-align: center;
    letter-spacing: 0.07em;
  }
  .sp_top_title p {
    line-height: 1.3em;
    overflow: hidden;
    height: 40px;
    margin-top: 10px;
  }
  /***************/
  .sec02_flex {
    padding: 80px 0 0;
  }
  .sec02_left {
    width: 100%;
    display: block;
    text-align: center;
  }
  .sec02_left .title_18 {
    font-size: 20px;
  }
  .title_18 {
    font-size: 18px;
  }
  .sec02_eng {
    font-size: 16px;
    text-align: center;
    margin-left: 0;
    margin-top: 10px;
  }
  .sec02_right {
    width: 100%;
    margin-top: 40px;
  }
  .sec02_right img {
    width: 100%;
    height: 300px;
    object-fit: cover;
  }
  /**************/
  .sec03_container {
    padding-top: 80px;
  }
  .sec03_flex {
    width: 100%;
    display: block;
  }
  .sec03_left {
    width: 100%;
    display: block;
  }
  .be_bb {
    position: relative;
  }
  .be_bb:before {
    content: "";
    border-bottom: 1px solid #cf4092;
    width: 70px;
    position: absolute;
    left: -110px;
    top: 50%;
    transform: translateY(-50%);
  }
  .eng_60 {
    font-size: 35px;
    line-height: 1.3em;
  }
  .title_22 {
    font-size: 18px;
  }
  .line_height20 {
    line-height: 2em;
  }
  .line_height22 {
    line-height: 2.2em;
  }
  .line_height24 {
    line-height: 2.4em;
  }
  .sec03_right {
    width: 100%;
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-top: 50px;
  }
  .sec03_right img {
    width: 100%;
    height: auto;
  }
  .sec03_img1 {
    width: 20%;
    position: relative;
    z-index: 500;
    top: 40px;
  }
  .sec03_img1 img {
    width: 200%;
    height: auto;
  }
  .sec03_img2 {
    width: calc(100% - 80px);
    margin-top: 0;
  }
  .more_shape {
    position: absolute;
    right: 0;
    bottom: auto;
    top: -28px;
  }
  .more_shape a {
    width: 60px;
    height: 60px;
  }
  .more_shape a img {
    width: 20px;
    height: auto;
  }
  /******************/
  .sec04_flex {
    margin: 80px auto 0;
  }
  .sec04_flex.spmt-0 {
    margin-top: 0;
  }
  .sec04_left {
    padding: 80px 0 60px;
  }
  .sec04_right {
    width: 100%;
    margin-top: 0;
  }
  .sec04_right .img100 img {
    height: 300px;
  }
  .more_shape.sec04_more {
    right: 20px;
    bottom: auto;
    top: -28px;
  }
  .ml_minus {
    margin-left: -2px;
  }
  /******************/
  .sec07_flex {
    width: 100%;
    display: block;
    margin: 0 auto;
    padding: 80px 0 0;
  }
  .sec07_left {
    width: 90%;
    max-width: 90%;
    margin: 0 auto;
    height: auto;
    display: block;
  }
  .sec07_right {
    width: 100%;
    margin-top: 50px;
  }
  .sec07_right .img100 img {
    width: 100%;
    height: 300px;
    object-fit: cover;
  }
  .more_shape.sec07_more {
    left: auto;
    right: 20px;
    bottom: auto;
    top: -28px;
  }
  /*********/
  .sec08_img {
    margin-top: 60px;
  }
  /******************/
  .sec09_flex {
    margin-top: 80px;
  }
  .sec09_left {
    padding: 80px 0 60px;
  }
  .sec09_left > div {
    width: 90%;
    margin: 0 auto;
  }
  .sec09_right .img100 img {
    height: 300px;
  }
  .more_shape.sec09_more {
    right: auto;
    left: auto;
    right: 20px;
    bottom: auto;
    top: -28px;
  }
  .more_shape.sec09_more a {
    border-color: #FFF;
  }
  /******************/
  .sec10_gra {
    padding-bottom: 80px;
  }
  .sec10_left {
    padding: 80px 0 40px;
  }
  .insta ul {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 20px;
    row-gap: 20px;
  }
  .insta img {
    width: 200px;
    height: 150px;
  }
  /**********************/
  .sec11_container {
    width: 100%;
    margin: 0 auto;
  }
  .sec11_flex {
    display: block;
    justify-content: space-between;
    align-items: center;
    max-width: 1480px;
    width: 100%;
    margin: 0 auto;
  }
  .sec11_left {
    width: 90%;
    margin: 0 auto;
    height: auto;
    display: block;
    padding: 80px 0 50px;
    position: relative;
  }
  .more_shape.sec11_more {
    position: absolute;
    left: auto;
    right: 0;
    top: auto;
    bottom: -30px;
  }
  .sec11_right {
    width: 100%;
    max-width: 100%;
    display: block;
    justify-content: space-between;
  }
  /******************/
  .sec12_gra {
    width: 100%;
    padding: 80px 0;
    margin-top: 80px;
  }
  .sec12_left {
    width: 100%;
    padding: 0;
  }
  .sec12_map {
    padding-top: 40px;
  }
  .sec12_map iframe {
    max-height: 300px;
    height: 300px;
  }
  .sec12_right {
    width: 100%;
    width: 220px;
    margin: 0 auto 0;
    padding: 40px 0 0;
  }
  .sec12_right a {
    width: 220px;
    font-size: 18px;
  }
  .sec12_right a span {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 1px solid #FFF;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    top: -3px;
  }
  .sec12_right a img {
    display: inline-block;
    transform: rotate(90deg);
  }
  .cy_footer {
    right: 10px;
    bottom: 10px;
  }
  .cy_footer p {
    font-size: 12px;
  }
  /***************************************************************

    コンセプト

***************************************************************/
  .title_in {
    bottom: 30px;
  }
  .title_in p {
    font-size: 32px;
    line-height: 1em;
    white-space: nowrap;
  }
  .title_in h2 {
    font-size: 18px;
    white-space: nowrap;
    line-height: 1em;
  }
  .title_eng {
    height: 40px;
  }
  .title_ja {
    height: 25px;
  }
  .main_img img {
    height: 100%;
    min-height: 400px;
  }
  /********************************/
  .con02_right {
    margin-top: 40px;
  }
  /*******/
  .con03_img {
    width: 100%;
  }
  .con03_img img {
    width: 100%;
    height: 300px;
    object-fit: cover;
  }
  /**********/
  .sec05_img img {
    height: 300px;
    object-fit: cover;
  }
  /**********/
  .back_content {
    padding: 40px 0;
  }
  .back_content.bg_none {
    background: none;
  }
  .back_content p {
    width: 100%;
    text-align: center;
  }
  .back_content p a {
    width: 220px;
    font-size: 18px;
  }
  .back_content p a span {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 1px solid #FFF;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    top: -3px;
  }
  .back_content p a img {
    display: inline-block;
    transform: rotate(90deg);
  }
  /**************************************************************

    商品

**************************************************************/
  .pro_left {
    padding: 60px 0;
  }
  .pro_right img {
    height: 300px;
  }
  /*******/
  .pro01_img {
    width: 90%;
    margin: 60px auto 0;
    text-align: center;
    display: block;
  }
  .pro01_img img {
    width: 100%;
    height: auto;
  }
  /**************************************************************

    BEAN TO BAR

**************************************************************/
  .bean_logo {
    margin-right: 0;
  }
  .bean_logo img {
    width: 200px;
    height: auto;
  }
  .bean01_right {
    margin-top: 40px;
  }
  /**************/
  .bean02_flex {
    padding: 60px 0;
  }
  .bean02_right {
    padding-top: 40px;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    column-gap: 0;
    row-gap: 70px;
  }
  .bean02_right > div {
    padding: 40px 20px 50px;
  }
  .bean02_right > div:after {
    display: block;
    background: url("../images/bean_shape.jpg") left 0/30px 60px no-repeat;
    width: 30px;
    height: 60px;
    position: absolute;
    right: 50%;
    top: calc(100% + 6px);
    transform: translateX(50%) rotate(90deg);
  }
  .bean02_right > div:nth-child(2n):after {
    display: block;
  }
  .bean02_right > div:last-child:after {
    display: none;
  }
  .bean02_right > div h3 {
    font-size: 24px;
    margin: 20px 0 10px;
    text-align: center;
  }
  .bean_num {
    width: fit-content;
    font-size: 32px;
  }
  .bean_text2 {
    line-height: 2em;
    text-align: center;
  }
  /********************************************/
  .bean04_right1 img {
    height: 300px;
  }
  /****/
  .bean04_flex2 {
    display: block;
    padding-top: 0;
    height: auto;
  }
  .bean04_left2 {
    width: 90%;
    margin: 0 auto;
    padding-left: 0;
    padding: 80px 0 40px;
  }
  .bean04_right2 {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    column-gap: 0;
    row-gap: 0;
    min-height: 0;
    max-height: 100%;
  }
  .line_up {
    display: block;
    width: 90%;
    margin: 20px auto;
  }
  .line_up > div {
    display: block;
  }
  .line_up > div:nth-child(n+2) {
    margin-top: 40px;
  }
  .line_up_img {
    width: 100%;
    text-align: center;
  }
  .line_up_img img {
    width: 100%;
    max-width: 180px;
    height: auto;
  }
  .line_up_text {
    width: 100%;
    margin-top: 20px;
    text-align: center;
  }
  .line_up_text .eng {
    font-size: 20px;
    line-height: 1.5em;
  }
  .line_up_text h3 {
    font-size: 16px;
    margin-top: 5px;
  }
  .line_up_text .text {
    margin-top: 15px;
  }
  /*********/
  .bean05_img img {
    width: 100%;
    height: 300px;
  }
  /**************************************************************

    GIFT

**************************************************************/
  .gift_left {
    width: 90%;
    margin: 0 auto;
    padding: 80px 0;
  }
  .gift_right {
    width: 100%;
  }
  .gift_right img {
    width: 100%;
    max-height: 300px;
    height: 300px;
  }
  /*********/
  .gift03_cont {
    width: 100%;
    height: auto;
  }
  .gift03_flex {
    display: block;
    max-width: 100%;
    margin: 0 auto;
  }
  .gift03_right {
    order: 2;
    width: 90%;
    margin: 0 auto;
    display: block;
    padding-top: 0;
    padding: 80px 0;
  }
  .title_33 {
    font-size: 23px;
    line-height: 1.5em;
  }
  .gift03_left {
    width: 100%;
  }
  .gift03_left img {
    width: 100%;
    height: 300px;
    object-fit: cover;
  }
  /*********/
  .gift04_cont {
    width: 100%;
    height: auto;
  }
  .gift04_flex {
    display: block;
    justify-content: space-between;
    margin: 0 auto;
  }
  /**************************************************************

    RECRUIT

**************************************************************/
  .rec_right img {
    max-height: 300px;
    height: 300px;
  }
  /***************/
  .rec03_cont {
    width: 100%;
    min-width: 100%;
    height: auto;
    display: block;
  }
  .rec03_flex > div {
    display: block;
    width: 100%;
    margin: 80px 0;
  }
  .rec03_left {
    width: 100%;
    padding-top: 0;
  }
  .rec03_right {
    width: 100%;
    margin-top: 40px;
  }
  .rec03_right img {
    width: 100%;
    max-height: 300px;
    height: 300px;
    object-fit: cover;
  }
  /*********************/
  .rec_cell1 {
    width: 120px;
  }
  .rec_cell2 {
    width: calc(100% - 120px);
  }
  /**************************************************************

    SHOP

**************************************************************/
  .shop_right iframe {
    height: 300px;
    max-height: 300px;
  }
  /*****************/
  .calendar {
    margin-top: 40px;
  }
  .calendar iframe {
    max-height: 400px;
    height: 400px;
  }
}

/* スマートフォン 縦(ポートレート) */