@charset "UTF-8";
/* CSS Document */
/* 印刷用 */
@media print {
  body {
    overflow-y: visible;
    overflow-x: visible;
  }
  .divMain {
    overflow-y: visible;
  }
}
/*ベース*/
html {
  overflow-y: scroll;
}

body {
  font-family: "kozuka-mincho-pro", serif;
  font-weight: 400;
  font-style: normal;
  background-image: url(../img/gion/bg01.jpg?12);
  max-width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  position: relative;
}
body:before {
  background-image: url(../img/gion/bg11@2x.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  content: "";
  display: block;
  height: 15.2vw;
  position: absolute;
  right: 0;
  top: 0;
  width: 55vw;
  z-index: -1;
}
body:after {
  background-image: url(../img/gion/bg10@2x.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  content: "";
  display: block;
  height: 29vw;
  left: 0;
  position: absolute;
  top: 35.6vw;
  width: 100%;
  z-index: -1;
}

img {
  height: auto;
  max-width: 100%;
  pointer-events: none;
}

a {
  text-decoration: none;
}

.clear {
  clear: both;
}

.font_12 {
  font-size: 12px;
}

.font_14 {
  font-size: 14px;
}

.obj-fit-img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  font-family: "object-fit: cover; object-position: 0 100%;";
}

.sp,
.none,
.spmb {
  display: none;
}

ruby {
  ruby-position: under;
}

.scroll-container {
  scroll-behavior: smooth;
}

.news_more a:hover {
  color: #000;
}

.bold {
  font-weight: 500;
}

.contact_name_about {
  font-family: "kozgo", sans-serif !important;
}

.engageinner:hover {
  opacity: 0.6;
}
.engageinner a {
  display: block;
}

/**********************パソコン**********************/
/*メイン*/
.main_topbox {
  background: url("../img/gion/main_img4_pc.jpg");
  background-repeat: no-repeat;
  background-position: right 145px;
  position: relative;
  background-size: 83%;
  padding-bottom: 40%;
}

/*お店リンク*/
.shop_linkbox {
  align-items: center;
  background-color: #fff;
  color: #1D2734;
  display: flex;
  float: right;
  height: 84px;
  justify-content: center;
  margin-top: 130px;
  padding: 0;
  position: fixed;
  right: 0;
  width: 84px;
}
.shop_linkbox a {
  align-items: center;
  display: flex;
  justify-content: center;
}
.shop_linkbox a img {
  margin: auto;
  width: 100%;
}
.shop_linkbox p {
  color: #fff;
}

.menu_box {
  background: #ff977a;
  float: right;
  margin-top: 100px;
  padding: 10px 1000px;
}

/*ロゴマーク*/
.img_logo {
  padding-top: 8.3vw;
  padding-left: 10vw;
  width: 22.6vw;
}
.img_logo img {
  width: 100%;
}
.img_logo p {
  font-size: 3vw;
  font-weight: 600;
  text-align: center;
  line-height: 4vw;
  margin: 0;
}

.scrollbtn {
  position: absolute;
  width: 20%;
  bottom: 14%;
  left: 39.5%;
  opacity: 0.75;
}
.scrollbtn img {
  width: 100%;
  opacity: 0.75;
}

/*タブリンク*/
.site-header {
  position: fixed;
  bottom: 0;
  transition: 0.5s;
  width: 55%;
  z-index: 800;
  height: 6vw;
  margin-left: 22.28vw;
}
.site-header.hide {
  transform: translateY(100%);
}

.gnav_menu_li {
  text-align: center;
  margin: 0 auto;
}

.access p,
.receive p,
.instagram p {
  text-align: center;
  color: #fff;
  width: 70%;
  font-size: 1.25vw;
  font-weight: 500;
  text-align: center;
  padding: 5px 0px;
  margin-top: 2vw;
  font-family: serif;
  margin-left: 14%;
}

.access {
  background: url(../img/gion/moyou@2x.png);
  background-repeat: repeat;
  background-size: cover;
  width: 30%;
  margin: 0 auto;
  height: 12vw;
  float: left;
}

.receive {
  background: url(../img/gion/moyou@2x.png);
  background-repeat: repeat;
  background-size: cover;
  width: 30%;
  height: 12vw;
  margin-left: 5.5%;
  float: left;
}

.instagram {
  background: url(../img/gion/moyou@2x.png);
  background-repeat: repeat;
  background-size: cover;
  width: 30%;
  height: 13vw;
  float: right;
}

/*京都*/
.kyotoBox {
  background-image: url(../img/gion/bg01.jpg?12);
  overflow: hidden;
  padding: 50px 0px 40%;
  position: relative;
}
.kyotoBox:before {
  background-image: url(../img/gion/bg02@2x.jpg);
  bottom: 0;
  content: "";
  display: none;
  height: 10%;
  left: 0;
  position: absolute;
  width: 100%;
  z-index: 0;
}
.kyotoBox .marker-animation {
  background-image: -webkit-linear-gradient(top, transparent 50%, #CA4941 50%);
}
.kyotoBox .marker-animation.active {
  color: #fff;
}

.sub01 {
  background-image: url(../img/gion/bg02@2x.jpg);
  padding-bottom: 200px;
  position: relative;
  text-align: center;
}
.sub01 .group {
  display: flex;
  justify-content: space-between;
  padding: 0 16vw 4vw 0;
}
.sub01 .group .slider {
  width: 77.5%;
}
.sub01 .group .header {
  padding-top: 6.5vw;
  width: 15.5%;
}
.sub01 .block01,
.sub01 .block02 {
  margin: 0 auto;
  position: relative;
  width: 60%;
}
.sub01 .block01 {
  padding-bottom: 120px;
}
.sub01 .block01 a {
  display: block;
}

.kyoto_back {
  width: 100%;
  margin: 0;
  transform: skewY(-25deg);
  overflow: hidden;
  background-position: bottom;
  position: relative;
  z-index: 1;
}

.kyoto_back_img img {
  width: 100%;
  margin-top: -20px;
  transform: skewY(25deg) scale(1.4);
}

.cover1 {
  width: 100%;
  margin: -0.05% 0px 0px;
  overflow: hidden;
  background-position: bottom;
  position: relative;
  z-index: 10;
}

.cover1_on {
  position: absolute;
  top: -100%;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  transition: 0.3s;
}

.cover1 .cover1_on {
  right: 0;
  top: 0;
}

.green_box {
  background-image: url(../img/gion/bg01.jpg?12);
  width: 100%;
  height: 16%;
  position: absolute;
  z-index: 0;
  top: 38%;
}

.take_icon {
  position: absolute;
  z-index: 50;
  width: 15%;
  top: 64%;
  left: 18%;
}
.take_icon img {
  width: 100%;
}

.kyoto_massage {
  margin: 0 auto;
  position: relative;
  text-align: center;
  z-index: 5;
  width: 54%;
}
.kyoto_massage img:first-child {
  margin: 10% auto 0;
}
.kyoto_massage p {
  padding: 5% 0px;
  text-align: center;
  margin: 0 auto;
  color: #000;
  font-family: "serif";
  font-size: 1.25vw;
  line-height: 2.75vw;
  font-weight: 500;
}
.kyoto_massage p a {
  display: block;
}

.kyoto_title {
  position: relative;
  z-index: 10;
  text-align: center;
  margin: -85% auto 0;
  width: -moz-fit-content;
  width: fit-content;
}
.kyoto_title h2 {
  color: #fff;
  writing-mode: vertical-rl;
  font-size: 10vw;
  font-family: kozuka-mincho-pro, serif;
  font-weight: 500;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.3em;
  left: 50%;
  line-height: 1.2;
  margin: 0 auto;
  position: absolute;
  text-align: left;
  transform: translateX(-50%);
  white-space: nowrap;
}

.kyoto_name {
  position: relative;
  z-index: 10;
  width: 50%;
  text-align: center;
  margin: 54vw auto 0;
}
.kyoto_name p {
  color: #fff;
  font-family: "serif";
  font-size: 2.75vw;
  font-weight: 500;
  line-height: 5vw;
  font-family: kozuka-mincho-pro, serif;
  font-weight: 500;
  font-style: normal;
}

.kyoto_name2 {
  position: relative;
  z-index: 10;
  width: 100%;
  height: auto;
  text-align: center;
  margin: 0 auto;
}
.kyoto_name2 p {
  color: #fff;
  font-family: "serif";
  font-size: 1.5vw;
  font-weight: 500;
}

.read {
  float: right;
  position: absolute;
  z-index: 9;
  height: auto;
  right: 20%;
  top: 56%;
  writing-mode: vertical-rl;
}
.read h3 {
  font-size: 2vw;
  font-family: kozuka-mincho-pro, serif;
  font-weight: 500;
  font-style: normal;
  margin: 0;
  color: transparent;
  letter-spacing: 0.65vw;
}

.read2 {
  position: absolute;
  z-index: 9;
  height: auto;
  left: 21%;
  top: 7%;
  writing-mode: vertical-rl;
}
.read2 h3 {
  font-size: 2vw;
  font-family: kozuka-mincho-pro, serif;
  font-weight: 500;
  font-style: normal;
  margin: 0;
  color: transparent;
  letter-spacing: 0.65vw;
}

.read_coment {
  padding: 20px 20px 0px;
  float: right;
  position: absolute;
  z-index: 9;
  height: auto;
  right: 30.5%;
  top: 56%;
  line-height: 4vw;
  writing-mode: vertical-rl;
}
.read_coment p {
  font-size: 1.25vw;
  font-weight: 500;
}

/*メニュー背景*/
.menuBox {
  position: relative;
}
.menuBox:before {
  background: url(../img/gion/bg03.jpg?121);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  display: block;
  height: 10000px;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.menuBox_nner {
  padding: 30px 0;
  overflow: hidden;
  background-size: 100%;
  background-position: top;
  background-repeat: no-repeat;
  height: 100%;
}

.menu_back_img1 {
  margin-top: -290px;
  padding: 30% 80%;
  background: #b4cc31;
}

.menu_back_img2 {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 100vw 35vw 0;
  border-color: transparent #b4cc31 transparent transparent;
}

.menu_back_img3 {
  margin-top: -450px;
  padding: 300vw 55vw;
  width: 100%;
  background: url(../img/arashiyama/back_img1.jpg);
  background-repeat: repeat;
  transform: skewY(-30deg);
}

.menu_back_img {
  width: 80%;
  float: right;
  position: absolute;
  z-index: 2;
  top: 10%;
  right: -20%;
}
.menu_back_img img {
  width: 100%;
  text-align: right;
}

.menu_back_img4 {
  width: 0;
  height: 0;
  position: relative;
  z-index: 3;
  border-style: solid;
  border-width: 90vw 30vw 0vw 60vw;
  margin: 1% 10px;
  border-color: #95b173 transparent transparent transparent;
  transform: rotate(-40deg);
}

.menu_back_img5 {
  width: 0;
  height: 0;
  margin: -65% 0px 10px 0px;
  border-style: solid;
  border-width: 44vw 0 90vw 99vw;
  border-color: transparent transparent transparent #b4cc31;
  position: relative;
  z-index: 4;
}

.menu_back_img6 {
  width: 100%;
  margin-top: -92%;
  height: 180vh;
  position: relative;
  z-index: 3;
  background: #95b173;
}

/*ドリンクメニュー*/
.drink_set {
  background: #5D6D83;
  padding: 5px 15px;
  color: #fff;
}

.drink_set2 {
  background: #fff;
  padding: 5px 15px;
  color: #000;
}

.drinkbox {
  margin-top: 80px;
  background: #dbe7ae;
  position: relative;
}

.drink_in {
  background: #1D2734;
  color: #fff;
  position: relative;
  margin-bottom: -10px;
  overflow: hidden;
  padding: 30px 0px 40px;
}

.drink_img {
  width: 45%;
  float: left;
}

.drink_list {
  width: 45%;
  float: left;
  padding: 0px 0px 0px 60px;
}

.drink_list p {
  font-size: 16px;
  font-weight: 500;
}
.drink_list ul {
  text-align: left;
}

.drink_img img {
  width: 100%;
}

.drinkinner {
  position: relative;
  z-index: 3;
  width: 80%;
  text-align: center;
  padding-top: 20px;
  margin: 0 auto;
}

.drink_back {
  position: absolute;
  width: 25%;
  bottom: -8px;
  z-index: 2;
}
.drink_back img {
  width: 100%;
}

.drink_name p {
  color: transparent;
  font-family: "DIN", sans-serif;
  width: 30%;
  text-align: center;
  letter-spacing: 5px;
  font-size: 2vw;
  position: absolute;
  z-index: 11;
  top: -4vw;
  left: 33.5%;
  width: -moz-fit-content;
  width: fit-content;
}
.drink_name p.marker-animation {
  background-image: -webkit-linear-gradient(top, transparent 50%, #CA4941 50%);
}
.drink_name p.marker-animation.active {
  color: #fff;
}

/*メニュー文字*/
.menu_list_mb {
  z-index: 9;
  text-align: center;
  margin: 0 auto;
  background: #fff;
  width: 55%;
  margin-top: 90px;
  padding: 50px 0px;
  position: relative;
}

.menu_listBox2 {
  z-index: 10;
  background: #fff;
  text-align: center;
  margin: 0 auto;
  width: 55%;
  margin-top: 8.5%;
  padding: 10px 0px 0px;
  position: relative;
}

.menu_list_mb h3 {
  font-size: 6vw;
  font-size: 4vw;
  font-size: clamp(32px, 4vw, 80px);
  color: #fff;
  font-family: "kozuka-mincho-pro", serif;
  font-weight: 400;
  font-style: normal;
  color: #000;
  text-align: center;
  margin: 0 auto;
  position: absolute;
  index: 11;
  top: -4.5%;
  left: 34%;
}

.menu_text p {
  padding: 4% 0px 0px;
  text-align: center;
  line-height: 24px;
}

.menu_img_miyabi p {
  color: transparent;
  font-family: "kozuka-mincho-pro", serif;
  font-weight: 400;
  font-style: normal;
  width: 33%;
  text-align: center;
  letter-spacing: 5px;
  font-size: 2.3vw;
  font-size: clamp(18px, 2.3vw, 45px);
  position: absolute;
  z-index: 11;
  top: 7%;
  left: 18%;
}

.miyabi_photo {
  position: absolute;
  z-index: 12;
  top: 5%;
  left: -10%;
  width: 30%;
}

.menu_img_miyabi {
  width: 25%;
  float: left;
}
.menu_img_miyabi img {
  width: 100%;
}

.menu_name_miyabi {
  width: 20%;
  float: right;
  margin-top: -10%;
  padding: 0px 13% 0px 0px;
  position: relative;
}
.menu_name_miyabi p {
  color: #000;
  font-family: kozuka-mincho-pro, serif;
  font-weight: 500;
  font-style: normal;
  font-size: 16vw;
  margin: 0;
  line-height: 26vw;
}

.menu_img_zen p {
  color: transparent;
  width: 30%;
  text-align: center;
  letter-spacing: 5px;
  font-size: 2.5vw;
  position: absolute;
  z-index: 11;
  top: 79%;
  right: 18%;
}

.zen_phpto {
  position: absolute;
  z-index: 12;
  top: 75%;
  right: -10%;
  width: 30%;
}

.menu_img_zen {
  width: 25%;
  float: left;
}
.menu_img_zen img {
  width: 100%;
}

.menu_name_zen {
  width: 20%;
  float: left;
  padding: 0px 0px 0px 5%;
}
.menu_name_zen p {
  color: #000;
  font-family: kozuka-mincho-pro, serif;
  font-weight: 500;
  font-style: normal;
  font-size: 16vw;
  margin: 0;
  margin-top: -10%;
  line-height: 22vw;
}

.menu_right {
  padding: 0;
}

.menu_courseBox {
  padding: 30px 0 10px 0;
  width: 70%;
  margin: -10% auto auto;
}

.menu_courseBox2 {
  float: right;
  padding: 10vw 50px 20px 0px;
  width: 70%;
}

.p_border {
  border-bottom: 1px solid #000;
  clear: both;
  font-size: 2vw;
  font-weight: 500;
}

.menu_courseBox_w {
  z-index: 7;
  text-align: center;
  padding: 20px 0px 20px 25%;
  width: 40%;
}

.menu_courseBox p {
  text-align: left;
}

.sub02 {
  margin: 0 auto 18%;
  width: 55%;
}

.menu_courseBox2 p,
.menu_courseBox_c p {
  text-align: left;
}

.menu_courseBox_w p {
  text-align: left;
  color: #fff;
  text-align: left;
}

.p_border_w {
  border-bottom: 1px solid #fff;
  font-size: 2vw;
  font-weight: 500;
}

.menu_img_misogi p {
  color: transparent;
  width: 30%;
  text-align: center;
  letter-spacing: 5px;
  font-size: 2.5vw;
  position: absolute;
  z-index: 11;
  top: -2%;
  left: 18%;
  margin: 0;
  padding: 0;
}

.misogi_photo {
  position: absolute;
  z-index: 12;
  top: -4%;
  left: -10%;
  width: 30%;
}

.misogi_plate {
  width: 12%;
  position: absolute;
  z-index: 17;
  top: 11%;
  left: 3%;
}
.misogi_plate img {
  width: 100%;
}

.menu_img_misogi {
  width: 25%;
  float: left;
}
.menu_img_misogi img {
  width: 100%;
}

.menu_name_misogi {
  position: absolute;
  z-index: 12;
  top: -12vw;
  right: -5%;
  width: 20%;
  padding: 0px 110px 0px 0px;
}
.menu_name_misogi p {
  color: #000;
  font-family: kozuka-mincho-pro, serif;
  font-weight: 500;
  font-style: normal;
  font-size: 16vw;
  margin: 0;
}

.menu_img_cha p {
  color: transparent;
  font-family: "kozuka-mincho-pro", serif;
  font-weight: 400;
  font-style: normal;
  width: 30%;
  text-align: center;
  letter-spacing: 5px;
  font-size: 2.3vw;
  font-size: clamp(18px, 2.3vw, 45px);
  position: absolute;
  z-index: 11;
  top: 25%;
  right: 18%;
}

.menu_img_hyakka p {
  color: transparent;
  font-family: "kozuka-mincho-pro", serif;
  font-weight: 400;
  font-style: normal;
  width: 50%;
  text-align: center;
  letter-spacing: 5px;
  font-size: 2.3vw;
  font-size: clamp(18px, 2.3vw, 45px);
  position: absolute;
  z-index: 11;
  top: -2%;
  right: auto;
  left: 0;
  margin-top: 3vw;
}

.cha_photo {
  width: 30%;
  position: absolute;
  z-index: 12;
  top: 15%;
  right: -10%;
}

.hyakka_photo {
  width: 11vw;
  position: absolute;
  z-index: 12;
  top: -10%;
  right: 5%;
  margin-top: -20%;
}

.menu_img_cha {
  width: 25%;
  float: left;
}
.menu_img_cha img {
  width: 100%;
}

.menu_name_cha {
  width: 70%;
  float: left;
  margin-left: -10%;
  margin-top: -23%;
}
.menu_name_cha p {
  color: #000;
  writing-mode: lr-tb;
  font-family: kozuka-mincho-pro, serif;
  font-weight: 500;
  font-style: normal;
  font-size: 16vw;
  margin: 0;
  line-height: 23vw;
  float: left;
  margin-top: 35%;
}

.menu_name_hyakka {
  width: -moz-fit-content;
  width: fit-content;
  float: left;
  margin-left: -10%;
  position: relative;
}
.menu_name_hyakka p {
  color: #000;
  writing-mode: lr-tb;
  font-family: kozuka-mincho-pro, serif;
  font-weight: 500;
  font-style: normal;
  font-size: 10vw;
  margin: 0;
  line-height: 1;
  float: left;
  margin: 1% 0;
}
.menu_name_hyakka span {
  display: block;
  text-align: left;
}

.sub03 {
  margin-bottom: 120px;
}
.sub03 .menu_list_mb {
  padding-top: 10px;
}
.sub03 .gion01 {
  padding: 3.5vw 2vw 2vw;
}
.sub03 .gion02 {
  margin: 0 auto;
  padding: 0 0 3vw;
  width: 70%;
}
.sub03 .gion02 .desc {
  font-size: 0.94vw;
  font-size: clamp(8px, 0.94vw, 18px);
  letter-spacing: 0.05em;
  line-height: 2;
  text-align: left;
  width: 100%;
}
.sub03 .menu_courseBox_c {
  margin: 0 auto;
}
.sub03 .menu_courseBox_c .p_border_c.p_border_d {
  display: flex;
  justify-content: space-between;
}
.sub03 .menu_courseBox_c .p_border_c.p_border_d .narrow {
  display: block;
  transform: scale(0.85, 1);
  transform-origin: left;
  white-space: nowrap;
  width: 80%;
}
.sub03 .menu_courseBox_c h5 {
  color: #000;
  font-size: 2vw;
  font-weight: normal;
  margin-bottom: 0;
  text-align: left;
}

.sub04 {
  margin: 0 auto;
  position: relative;
  width: 55%;
}
.sub04 .meni_iconBox {
  display: flex;
  justify-content: center;
}

.menu_courseBox_c {
  margin: 0 auto;
  text-align: center;
  padding: 0px 0px 20px;
  width: 70%;
}
.menu_courseBox_c p {
  text-align: left;
  color: #000;
}

.p_border_c {
  border-bottom: 1px solid #000;
  font-size: 2vw;
  font-weight: 500;
}

/*コースアイコン*/
.menu_icon_left,
.menu_icon_right {
  width: -moz-fit-content;
  width: fit-content;
  padding: 0px 1.5vw;
}

.menu_icon_left img,
.menu_icon_right img {
  width: 67px;
}

.meni_iconBox {
  display: flex;
  justify-content: center;
  width: -moz-fit-content;
  width: fit-content;
  text-align: center;
  margin: 0 auto;
  padding: 10% 0px 5%;
}
.meni_iconBox p {
  font-size: 1.2vw;
}

.receive_btn {
  width: 35%;
  text-align: center;
  margin: 0 auto;
  padding-top: 32px;
}

.receive_btnimg {
  height: 7vw;
  text-align: center;
  margin: 0 auto;
  background: url("../img/Receive_on.jpg");
  background-size: 100% auto;
  background-repeat: no-repeat;
}
.receive_btnimg:hover {
  background: url(../img/Receive_off.jpg);
  background-position: top;
  background-size: 100% auto;
  background-repeat: no-repeat;
}

/*アクセス*/
.accessBox {
  padding-top: 0;
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.accessBox:before {
  background-image: url(../img/gion/bg12@2x.jpg);
  background-position: center;
  background-size: cover;
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 35vw;
  width: 100%;
}

.acces_inner {
  position: relative;
  overflow: hidden;
  z-index: 1;
  padding: 4% 0px 25%;
}

.access_inner_img1 {
  overflow: hidden;
  padding: 0 0px 20%;
  position: relative;
  z-index: 10;
}
.access_inner_img1 img {
  width: 100%;
}

.access_inner_img2 {
  width: 50%;
  float: right;
  position: absolute;
  z-index: 11;
  top: 1.55%;
  right: 0;
}

.access_backimg2 img {
  width: 100%;
  right: 0;
}

.acces_title {
  position: absolute;
  z-index: 12;
  width: 20%;
  top: 60%;
  left: 19%;
  writing-mode: vertical-rl !important;
}
.acces_title p {
  color: #000;
  font-family: kozuka-mincho-pro, serif;
  font-weight: 500;
  font-style: normal;
  font-size: 10.5vw;
  line-height: 1.1;
  margin: 0;
}

/*嵐山*/
.acces_arasshiyama {
  position: absolute;
  z-index: 11;
  width: 100%;
  top: 75%;
  left: 0;
}

.arashiyama p {
  color: transparent;
  width: -moz-fit-content;
  width: fit-content;
  text-align: center;
  letter-spacing: 5px;
  font-size: 2.3vw;
  position: absolute;
  z-index: 14;
  left: 40%;
  margin-top: 0%;
}

.cover2_on {
  position: absolute;
  top: -100%;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  background: rgba(112, 112, 112, 0.3);
  transition: 0.3s;
}

.cover2 .cover2_on {
  right: 0;
  top: 0;
}

.arashiyama_img1 {
  width: 45%;
  position: absolute;
  z-index: 13;
  right: 0;
  margin-top: -22%;
}
.arashiyama_img1 p {
  font-size: 1.25vw;
  line-height: 3vw;
  font-weight: 500;
}
.arashiyama_img1 img {
  width: 100%;
}

/*嵐山・お店の概要*/
.acces_photoBox {
  width: 100%;
  text-align: center;
  margin: 50px 0px;
  overflow: hidden;
}

.acces_photoBox1 {
  width: 100%;
  padding: 0;
  margin: 0;
}
.acces_photoBox1 img {
  width: 100%;
}

.acces_photoBox2 {
  width: 36.35%;
  float: left;
  padding: 0;
  margin: 0;
}

.acces_name h3 {
  font-size: 6vw;
  color: #fff;
  text-align: center;
  margin: 0;
  position: absolute;
  z-index: 12;
  top: 23%;
  left: 40%;
}

.acces_photoBox img {
  width: 100%;
  padding: 0;
  margin: 0;
}

.acces_photoBox2 img {
  width: 100%;
  margin-bottom: -10px;
}

.acces_textBox1 {
  text-align: center;
  margin: 0 auto;
  width: 80%;
}
.acces_textBox1 p {
  padding: 2% 0px;
  text-align: center;
  margin: 0 auto;
  color: #000;
  font-size: 1.1vw;
  font-size: clamp(8px, 1.1vw, 21px);
  line-height: 4vw;
  font-weight: 400;
}

.access_greenback {
  background: #d5de98;
  position: absolute;
  z-index: -1;
  width: 70%;
  margin-top: -17.5%;
  height: 34%;
}

.acces_inner2 {
  position: relative;
  margin-top: -10%;
}

.acces_inner3 {
  position: relative;
}

/*住所・電話番号*/
.acces_about {
  width: 55%;
  text-align: center;
  margin: 0 auto;
  padding: 50px 0px 80px;
}
.acces_about p {
  text-align: left;
}

.telnumber p {
  color: #000;
  font-size: 5.5vw;
  font-weight: 300;
  margin: 0;
}

.access_inner_img3 {
  position: relative;
}

.about_back {
  width: 50%;
  float: right;
  position: absolute;
  z-index: -1;
  bottom: -1.5%;
  right: 0;
}
.about_back img {
  width: 100%;
  right: 0;
}

.ggmap {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 10px;
  height: 0;
  overflow: hidden;
}
.ggmap iframe,
.ggmap object,
.ggmap embed {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

/*ギャラリー*/
.gallery {
  background: #fff;
  overflow: hidden;
  padding: 0px 0px;
  position: relative;
  z-index: 1;
}
.gallery:before {
  background-image: url(../img/gion/bg11@2x.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  content: "";
  display: block;
  height: 15.2vw;
  position: absolute;
  right: 0;
  top: 45%;
  width: 55vw;
  z-index: 0;
}

.gallery_innner1 {
  z-index: 1;
  position: relative;
}

.gallery_back1 {
  width: 100%;
  padding: 0;
  margin: 0;
  z-index: -10;
}
.gallery_back1 img {
  width: 100%;
}

.gallery_back12 {
  width: 100%;
  background: #b4cc31;
  height: 25vw;
  position: absolute;
  z-index: -1;
  top: 36.5%;
}

.gallery_backimg {
  width: 100%;
}

.gallery_name {
  position: absolute;
  z-index: 12;
  top: 0;
  left: 33.5%;
  padding: 30% 0px;
}
.gallery_name h3 {
  font-size: 6.2vw;
  color: #fff;
  letter-spacing: 0.06em;
  width: -moz-fit-content;
  width: fit-content;
  text-align: center;
  margin: 0 auto;
  padding: 0px 15px;
}

.gallery_insta p {
  color: transparent;
  width: 25%;
  text-align: center;
  letter-spacing: 1px;
  font-size: 2.5vw;
  position: relative;
  z-index: 12;
  left: 22.5%;
  margin-top: -3vw;
}

.gallery_tag {
  width: 30%;
  position: absolute;
  right: 0;
  margin-top: 18%;
}
.gallery_tag img {
  width: 100%;
}

.gallery_check {
  width: 30%;
  position: absolute;
  z-index: 16;
  right: 0;
  margin-top: 50%;
}
.gallery_check img {
  width: 100%;
}

/*instagram*/
.instagramBox {
  width: 55%;
  padding: 0;
  position: relative;
  text-align: center;
  margin: 0 auto;
}

.gallery_btn {
  padding: 0px;
  width: 19%;
  text-align: center;
  margin: 0 auto;
  z-index: 50;
}

.gallery_btnimg {
  height: 7vw;
  text-align: center;
  margin: 0 auto;
  background: url("../img/viewmore.jpg");
  background-size: 100% auto;
  background-repeat: no-repeat;
}
.gallery_btnimg:hover {
  background: url(../img/viewmore_hover.jpg);
  background-position: top;
  background-size: 100% auto;
  background-repeat: no-repeat;
}

.gallery_btn img {
  width: 100%;
}

.insta_id {
  background-repeat: no-repeat;
  content: "";
  /*何も入れない*/
  display: inline-block;
  /*忘れずに！*/
  width: 40px;
  /*画像の幅*/
  height: 40px;
  /*画像の高さ*/
  background-image: url(../img/insta_icon.png);
  background-size: contain;
  vertical-align: middle;
  margin-left: -12%;
  margin-top: 0%;
}
.insta_id p {
  padding: 15% 0px 0px 140%;
  text-align: center;
  margin: 0 auto;
}

.insta_icon img {
  width: 100%;
}

.gallery_link {
  position: relative;
  text-align: center;
  margin: 0 auto;
  padding: 20px 0px;
  z-index: 50;
}

/*ニュースQ&A背景*/
.news_qaBox {
  background: url(../img/gion/back_6_pc.jpg);
  background-size: cover;
  height: auto;
  padding-bottom: 12%;
  padding-top: 12%;
  position: relative;
}

/*ニュース*/
.news_name h3 {
  color: #fff;
  font-size: 4vw;
  text-align: center;
  letter-spacing: 0.07em;
  margin: 0 auto;
  position: absolute;
  index: 12;
  top: 4%;
  left: 42%;
}

.news_Box {
  position: relative;
  width: 55%;
  padding-top: 10%;
  margin: 0 auto;
}

.news_list {
  display: flex;
  justify-content: space-between;
  padding: 15px;
  width: 100%;
  text-align: center;
  margin: 0 0 5px;
  background: #fff;
  border: 2px #251e1c solid;
}
.news_list a {
  width: 28%;
}
.news_list .news_text {
  padding-right: 30px;
  text-align: left;
  width: 65%;
}
.news_list .news_text .news_more {
  margin: 0;
  padding: 0;
  text-align: right;
}

/*Q%A*/
.qa_title h3 {
  color: #000;
  font-size: 6vw;
  text-align: center;
  margin: 0 auto;
  position: absolute;
  index: 12;
  top: -6%;
  left: 39.5%;
}

.qa_titleposition {
  text-align: center;
  margin: 0 auto;
  width: 20%;
  margin-top: 0%;
}

.q_icon {
  margin-top: -30px;
  position: absolute;
  z-index: 23;
  margin-left: -4vw;
}
.q_icon p {
  color: #1D2734;
  font-size: 3.5vw;
  text-align: center;
  margin: 0 auto;
  line-height: 5vw;
}

.qa_Boxinner {
  width: 55%;
  text-align: center;
  margin: 0 auto;
  padding: 10% 0px;
}

.questionBox {
  height: auto;
  text-align: center;
  margin: 0 auto;
  padding: 14% 0 10%;
  position: relative;
}

.question_text {
  padding: 1px 0px 1px;
  margin-left: 8%;
  float: left;
  z-index: 25;
}
.question_text p {
  font-size: 0.94vw;
  font-size: clamp(8px, 0.94vw, 18px);
  letter-spacing: 0.05em;
  line-height: 2;
}

.question_text2 {
  padding: 1px;
  margin-left: 7%;
  float: left;
  z-index: 25;
}
.question_text2 p {
  font-size: 14px;
}

.question {
  height: auto;
  overflow: hidden;
  text-align: center;
  margin: 0 auto;
  border: none;
  background: #fff;
}

.acd-label {
  text-align: center;
  margin: 0 auto;
  width: 80%;
}

.question2 {
  overflow: hidden;
  width: 80%;
  height: auto;
  text-align: center;
  margin: 0 auto;
  border: none;
  background: #fff;
  border: 2.5px #000 solid;
  position: relative;
}

.question_open {
  background: #1D2734;
  float: right;
  width: 8%;
  padding: 2.7% 10px;
  border: none;
}
.question_open img {
  margin: 1.2vw 3px 3px;
  width: 80%;
}

.question_open2 {
  background: #1D2734;
  float: right;
  width: 8%;
  padding: 3vw 10px;
  border: none;
}
.question_open2 img {
  margin: 4px 3px 3px;
  width: 80%;
}

/*Q%A アコーディオンボックス*/
/*ラベル*/
.open_box {
  margin-top: 0%;
}

.open_box2,
.open_box3 {
  margin-top: 7vw;
}

.questionBox label {
  display: block;
  margin: 1.5px 0;
  padding: 11px 10px;
  font-weight: bold;
  margin: 0;
  padding: 0;
  cursor: pointer;
  transition: all 0.5s;
  text-align: center;
  margin: 0 auto;
}
.questionBox input {
  display: none;
}

/*クリックで中身表示*/
.cssacc:checked + .accshow {
  height: auto;
  max-height: auto;
  padding: 0% 5% 0% 10%;
  opacity: 1;
}

.accshowinner {
  position: absolute;
  margin: -3% 0% 0% 20%;
  padding: 5px 5px;
  width: 80%;
  z-index: 1;
  background: #1D2734;
  position: relative;
}

.accshowinner2 {
  position: absolute;
  margin: -3% 0% 5% 20%;
  padding: 5px;
  width: 80%;
  z-index: 1;
  background: #1D2734;
  position: relative;
}

.accshow p {
  margin: 30px 10px 20px;
  line-height: 18px;
  color: #fff;
}

.accshow_a {
  float: left;
  width: 10%;
}
.accshow_a p {
  color: #fff;
  font-size: 22px;
  padding-left: 1px;
}

.accshow_text {
  float: left;
  width: 85%;
}
.accshow_text p {
  font-size: 0.94vw;
  font-size: clamp(8px, 0.94vw, 18px);
  line-height: 2;
  text-align: left;
}

/*VOICE*/
.voice_Box {
  padding: 85px 0px 38%;
  overflow: hidden;
  position: relative;
}

.voice_inner1 {
  position: relative;
  z-index: 10;
}

.voice_back1 {
  margin-top: -28%;
  margin-bottom: 260px;
  padding: 50vw 0;
  transform: skew(0deg, -20deg);
  background-image: url(../img/gion/bg04.jpg);
  background-position: center top;
  z-index: 10;
}

.voice_back2 {
  margin-top: 20%;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 60vw 30vw 0;
  border-color: transparent #1D2734 transparent transparent;
  position: absolute;
  top: -1%;
  right: 0;
  z-index: 11;
}

.voice_back3 {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 48vw 0vw 0vw 88vw;
  border-color: transparent transparent transparent #1D2734;
  position: absolute;
  bottom: 0;
  left: 0;
  top: 112%;
  z-index: 11;
}

.voice_back4 {
  height: auto;
}
.voice_back4 img {
  width: 35%;
  right: 0;
  position: absolute;
  bottom: 0;
  right: 0;
  top: 114.7%;
  z-index: 13;
}

.voice_back5 {
  display: none;
  width: 0;
  height: 0;
  opacity: 0.5;
  border-style: solid;
  border-width: 0 0 110vw 60vw;
  border-color: transparent transparent #ffffff transparent;
  position: absolute;
  bottom: 0;
  right: 0;
  top: 50%;
  z-index: 12;
}

/*voice title*/
.line_wave {
  padding: 10px;
  background: url(../img/more.png) bottom repeat-x;
  background-size: 20px;
}

.voice_name {
  background-size: 20px;
  position: absolute;
  right: 7%;
  margin-top: 9%;
  transform: skew(-30deg, 30deg);
  position: absolute;
  top: 20%;
  z-index: 13;
}
.voice_name h3 {
  font-size: 5vw;
  color: #fff;
  text-align: center;
  margin: 0;
}

/*voice 写真*/
.voice_photobox {
  position: relative;
  z-index: 16;
  top: 0;
  left: 0%;
  background: #fff;
}

.voice_photo1 {
  position: absolute;
  z-index: 16;
  margin-top: -10%;
  width: 59%;
  margin-left: 0%;
}
.voice_photo1 img {
  width: 100%;
}

.voice_photo2 {
  position: absolute;
  margin-top: -2%;
  left: 16%;
  width: 14%;
  z-index: 17;
}

.voice_photo3 {
  position: absolute;
  z-index: 17;
  right: 0%;
  width: 33.5vw;
  margin-top: -39%;
}

.voice_photo4 {
  position: absolute;
  z-index: 17;
  right: 17.5%;
  width: 17.2vw;
  margin-top: -19%;
}

.voice_photo2 img,
.voice_photo3 img,
.voice_photo4 img {
  width: 100%;
}

.voice_okyakusama {
  float: right;
  position: absolute;
  z-index: 17;
  height: auto;
  right: 46%;
  margin-top: 7%;
}
.voice_okyakusama p {
  letter-spacing: 0.5vw;
  font-size: 1.75vw;
  margin: 0;
  color: transparent;
  writing-mode: vertical-rl;
}

/*VOICE 写真*/
.coment_img1 {
  position: absolute;
  width: 15%;
  z-index: 21;
  margin-top: 28%;
  left: 16%;
}

.coment_img2 {
  position: absolute;
  width: 13%;
  z-index: 21;
  margin-top: 35%;
  right: 20%;
}

.coment_img4 {
  position: absolute;
  width: 14%;
  z-index: 21;
  margin-top: 48%;
  left: 28%;
}

.coment_img5 {
  position: absolute;
  width: 15%;
  z-index: 21;
  margin-top: 70%;
  left: 12%;
}

.coment_img6 {
  position: absolute;
  width: 12%;
  z-index: 21;
  margin-top: 82%;
  left: 40%;
}

.coment_img7 {
  position: absolute;
  width: 15%;
  z-index: 21;
  margin-top: 110%;
  left: 16%;
}

.coment_img8 {
  position: absolute;
  width: 12%;
  z-index: 21;
  margin-top: 100%;
  left: 46%;
}

.coment_img1 img,
.coment_img2 img,
.coment_img3 img,
.coment_img4 img,
.coment_img5 img,
.coment_img6 img,
.coment_img7 img,
.coment_img8 img {
  width: 100%;
}

.motto {
  position: absolute;
  width: 25%;
  z-index: 21;
  margin-top: 123%;
  left: 37.8%;
}
.motto p {
  color: #000000;
  background: #fff;
  padding: 10px;
  text-align: center;
  border: 2px solid #000;
  font-size: 16px;
}
.motto p:hover {
  color: #fff;
  background: #000;
  text-align: center;
  border: 2px solid #000;
}

/*footer*/
.form_btn {
  text-align: left;
}

.footer_box {
  position: relative;
  height: 54vw;
  margin-top: -1%;
}
.footer_box .marker-animation {
  background-image: -webkit-linear-gradient(top, transparent 50%, #CA4941 50%);
}
.footer_box .marker-animation.active {
  color: #fff;
}

.footer_inner {
  width: 100%;
  margin-top: -5%;
  height: 50%;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 20%, 0 77%);
  clip-path: polygon(0 0, 100% 0, 100% 20%, 0 77%);
}

.footer_inner2 {
  width: 20vw;
  position: absolute;
  top: 5vw;
  right: 12%;
  z-index: 10;
}
.footer_inner2 p {
  font-size: 2.5vw;
  font-weight: 600;
  text-align: center;
  line-height: 3vw;
  margin: 0;
}
.footer_inner2 img {
  width: 100%;
}

.footer_inner3 {
  width: 80%;
  text-align: center;
  margin: 0 auto;
}

.footer_name {
  position: absolute;
  z-index: 20;
  top: 0%;
  left: 28%;
}
.footer_name p {
  letter-spacing: 0.5vw;
  font-size: 1.5vw;
  margin: 0;
  color: transparent;
  writing-mode: vertical-rl;
}

.footer_name2 {
  position: absolute;
  z-index: 20;
  top: 0%;
  left: 21%;
}
.footer_name2 p {
  letter-spacing: 0.5vw;
  font-size: 1.5vw;
  margin: 0;
  color: transparent;
  writing-mode: vertical-rl;
}

.footer_link {
  position: absolute;
  z-index: 20;
  bottom: 14%;
  left: 20%;
}
.footer_link p {
  color: #fff;
  font-size: 18px;
  text-align: left;
  line-height: 26px;
  letter-spacing: 0.25vw;
}

.copyright {
  color: #fff;
  position: absolute;
  z-index: 20;
  bottom: 10%;
  right: 0;
  left: 0;
  text-align: center;
  margin: 0 auto;
}

.footer_sns {
  width: 30%;
}
.footer_sns img {
  width: 100%;
}

.footer01 .footer_box {
  z-index: 1;
  width: 100%;
  height: 54vw;
  background-position: bottom;
  background: url(../img/gion/bg09.png);
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: 100%;
  position: relative;
}

/*オリジナルグッズ*/
.goodsbox {
  background: #fff;
  width: 100%;
  padding: 10% 0px 10%;
  position: relative;
}

.goodstrans {
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 45vw 0 0 50vw;
  border-color: transparent transparent transparent #95b173;
  bottom: 0;
  left: 0;
  z-index: 1;
}

.goodsborder {
  margin: 0px 20px;
  border: 4px #fff solid;
  position: relative;
  z-index: 3;
}

.goodsinner {
  background: #d3df95;
  padding: 30px 10px;
  text-align: center;
  width: 55%;
  margin: 0 auto;
}

.goods_left {
  float: left;
  width: 45%;
  position: relative;
}

.goods_right {
  float: left;
  width: 48%;
  padding-bottom: 20px;
  margin-left: 3%;
}

.goods_img {
  width: 100%;
  padding: 10px 0px;
  float: left;
}
.goods_img img {
  width: 100%;
  left: -20%;
  position: absolute;
}

.goods_ryokin {
  width: 100%;
  margin-top: 90%;
}
.goods_ryokin p {
  text-align: right;
  color: #000;
}

.goods_font1 {
  font-size: 2vw;
  font-weight: 400;
  line-height: 3.5vw;
  margin: 0;
}

.goods_font2 {
  margin-top: 0;
  line-height: 2.5vw;
  font-size: 1.5vw;
  font-weight: 400;
}

.goods_name h2 {
  font-size: 6vw;
  line-height: 5.25vw;
  text-align: right;
  margin-top: 8%;
}

.goods_back {
  margin-top: -10%;
}
.goods_back p {
  text-align: right;
}
.goods_back span {
  color: #fff;
  background: #000;
  text-align: center;
  padding: 8px 15px;
  font-size: 1.5vw;
}

.goods_text p {
  text-align: right;
  font-size: 1.3vw;
  line-height: 2.25vw;
}

.goods_btn {
  width: 100%;
  text-align: right;
  height: 6vw;
  background: url("../img/shopping.jpg");
  background-size: 70% auto;
  background-repeat: no-repeat;
  background-position: right;
}
.goods_btn:hover {
  text-align: right;
  background: url(../img/shopping_hover.jpg);
  background-position: top;
  background-size: 70% auto;
  background-repeat: no-repeat;
  background-position: right;
}

/*取材依頼*/
.mediabox {
  padding: 5% 0px;
}

.mediaboxinner {
  border: #000 2px solid;
  width: 55%;
  text-align: center;
  margin: 0 auto;
}

.media_name {
  background: #1D2734;
  color: #fff;
  padding: 0.5px 0px;
}
.media_name p {
  font-size: 1.8vw;
  margin: 0.5vw auto;
}

.media_font {
  font-size: 1.6vw;
  font-size: clamp(12px, 1.6vw, 30px);
  font-weight: 400;
  letter-spacing: 0.2em;
}

.media_font2 {
  font-size: 3vw;
  font-weight: 600;
  letter-spacing: 0.075em;
}

.contact_box {
  background-color: #fff;
  margin: 0;
  padding: 10vw 0 0 0;
  position: relative;
}
.contact_box:before {
  background-color: #F7F5F0;
  content: "";
  display: block;
  left: 0;
  height: 2000px;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 0;
}
.contact_box .contact_inner,
.contact_box .contact_inner2 {
  margin: 0 auto;
  position: relative;
  width: 75%;
}
.contact_box .contact_inner {
  text-align: center;
}
.contact_box .contact_inner h3 {
  font-size: 3.1vw;
  font-size: clamp(24px, 3.1vw, 60px);
  letter-spacing: 0.07em;
  margin: 0;
  padding: 0 0 2vw;
}
.contact_box .contact_inner p {
  line-height: 2;
}

.engageinner {
  width: 400px;
  text-align: center;
  margin: 0 auto;
  padding: 0% 0;
}
.engageinner img {
  width: 100%;
}

/*COMPANY*/
.company_inner p {
  text-align: left;
}

.company_mainimg {
  width: 100%;
  height: 45vw;
  margin: 0;
  padding: 0;
  background: url(../img/company/mainimg.jpg);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: top 0px;
}

.company_title {
  text-align: center;
  margin: 0 auto;
  padding: 12% 0px 5%;
}
.company_title h3 {
  font-size: 6vw;
  color: #fff;
  text-align: center;
}

.company_inner {
  width: 942px;
  text-align: center;
  margin: 0 auto;
  padding: 10% 0px 10%;
}

.company_title p {
  font-size: 1.75vw;
  color: #fff;
  text-align: center;
  margin-top: -5%;
}

.company_name p {
  color: #95b173;
  font-size: 20px;
}

.company_text p {
  color: #000;
  font-size: 16px;
}

.company_listinner {
  border-bottom: 1px solid #000;
  padding-bottom: 5px;
  margin-bottom: 5%;
}

.company_listinner2 {
  border: none;
  padding-bottom: 5px;
  margin-bottom: 5%;
}

.company_map {
  margin: 5px 0px 10px;
  position: relative;
  padding-bottom: 48%;
  padding-top: 10px;
  height: 0;
  overflow: hidden;
}

.company_tableleft {
  padding: 0px 0px;
  width: 150px;
}

.company_tableright {
  padding: 0px 0px;
  width: 600px;
}

/*追加*/
.miyabi_read2 p,
.misogi_read2 p,
.zen_read2 p,
.cha_read2 p {
  font-size: 18px;
  font-style: bold;
  line-height: 30px;
  text-align: left;
}

.miyabi_read2 {
  width: 55%;
  left: 19%;
  top: 25%;
  position: absolute;
}

.misogi_read2 {
  width: 55%;
  left: 22%;
  top: 3%;
  position: absolute;
}

.zen_read2 {
  width: 55%;
  left: 28vw;
  bottom: 2vw;
  position: absolute;
}

.cha_read2 {
  width: 55%;
  left: 29vw;
  bottom: 2vw;
  position: absolute;
}

.position_cha {
  position: relative;
}

.attention {
  padding: 60px 0 30px;
  position: relative;
  text-align: center;
  margin: 0 auto;
}
.attention p {
  font-size: 16px;
}
.attention h3 {
  font-size: 22px;
}

.illust01 {
  position: absolute;
  right: 1.8vw;
  top: 3.5vw;
  width: 30.8vw;
  z-index: 10;
}

.illust02 {
  left: 0;
  position: absolute;
  top: 51vw;
  width: 40.3vw;
  z-index: 10;
}

.illust03 {
  position: absolute;
  right: 0;
  top: -6vw;
  width: 35vw;
  z-index: 10;
}

.illust04 {
  bottom: -12%;
  left: -40%;
  position: absolute;
  width: 31vw;
  z-index: 10;
}

.illust05 {
  bottom: -5vw;
  position: absolute;
  right: -40%;
  width: 28.8vw;
  z-index: 10;
}

.illust06 {
  position: absolute;
  right: 0vw;
  top: 94vw;
  width: 22.5%;
  z-index: 10;
}
.illust06 img {
  width: 100%;
}

.flower01 {
  position: absolute;
  right: -11vw;
  top: -2vw;
  width: 10vw;
  z-index: 10;
}

.flower02 {
  position: absolute;
  right: -7vw;
  top: 2vw;
  width: 10vw;
  z-index: 10;
}

.flower03 {
  position: absolute;
  left: -7vw;
  top: 14vw;
  width: 10vw;
  z-index: 10;
}

.drawer-hamburger {
  background-color: #fff;
  color: #1D2734;
  width: 60px;
}

.drawer-hamburger-icon,
.drawer-hamburger-icon:after,
.drawer-hamburger-icon:before {
  background-color: #1D2734 !important;
}

.drawer-open .drawer-hamburger-icon:after,
.drawer-open .drawer-hamburger-icon:before {
  background-color: #fff !important;
}

.drawer-open .drawer-hamburger-icon {
  background-color: #1D2734 !important;
}

.drawer-hamburger:hover {
  cursor: pointer;
  background-color: #1D2734;
  color: #fff;
}
.drawer-hamburger:hover .drawer-hamburger-icon:after,
.drawer-hamburger:hover .drawer-hamburger-icon:before {
  background-color: #fff !important;
}
.drawer-hamburger:hover .drawer-hamburger-icon {
  background-color: #fff !important;
}

.drawer-open .drawer-hamburger:hover {
  cursor: pointer;
  background-color: #1D2734;
  color: #fff;
}
.drawer-open .drawer-hamburger:hover .drawer-hamburger-icon:after,
.drawer-open .drawer-hamburger:hover .drawer-hamburger-icon:before {
  background-color: #fff !important;
}
.drawer-open .drawer-hamburger:hover .drawer-hamburger-icon {
  background-color: #1D2734 !important;
}

.drawer-nav {
  background-color: #fff;
  color: #1D2734;
}

.drawer-menu-item-shop a {
  align-items: center;
  background-color: #fff;
  border: 1px solid #1D2734;
  color: #1D2734;
  display: flex;
  font-family: sans-serif;
  height: 30px;
  justify-content: center;
  margin: 0 auto 10px;
  width: 80%;
}

.drawer-menu-item-shop a:hover {
  background-color: #1D2734;
  color: #fff;
}

.drawer-menu-item-media a {
  align-items: center;
  background-color: #fff;
  color: #1D2734;
  display: flex;
  font-family: sans-serif;
  height: 36px;
  justify-content: center;
  margin: 0 auto 10px;
  width: 80%;
}

.drawer-menu-item-media a:hover {
  background-color: #1D2734;
  color: #fff;
}

@media screen and (max-width: 767px) {
  .siderecruit {
    display: none;
  }
  .sidelossflower {
    bottom: 125px;
    position: fixed;
    right: 0;
    width: 180px;
    z-index: 150;
  }
  .sidelossflower a {
    cursor: pointer;
    position: relative;
  }
}
@media screen and (min-width: 768px) {
  .siderecruit {
    bottom: 250px;
    line-height: 0;
    position: fixed;
    right: 0;
    width: 200px;
    z-index: 150;
  }
  .siderecruit a {
    display: block;
    margin: 0;
  }
  .sidelossflower {
    bottom: 100px;
    position: fixed;
    right: 0;
    width: 200px;
    z-index: 150;
  }
  .sidelossflower a {
    cursor: pointer;
    position: relative;
  }
}
@media screen and (min-width: 768px) {
  .visible-xs {
    display: none;
  }
  .modaal-content-container {
    align-items: center;
    background-color: #E0E0E0;
    display: flex;
    justify-content: center;
    margin: auto;
  }
  .modaal-content-container .inner {
    margin: auto;
    padding: 70px 0;
    width: 80%;
  }
  .modaal-content-container .inner h4 {
    margin: 0 auto 40px;
    text-align: center;
  }
  .modaal-content-container .inner .desc01 {
    border-bottom: 1px solid #000;
    font-size: 22px;
    font-weight: 500;
    letter-spacing: 0.01em;
    line-height: 2;
    margin-bottom: 43px;
    padding-bottom: 26px;
    text-align: center;
  }
  .modaal-content-container .inner .desc02 {
    font-size: 20px;
    letter-spacing: 0.01em;
    line-height: 2;
    padding-bottom: 46px;
  }
  .modaal-content-container .inner .link {
    text-align: center;
  }
  .modaal-content-container .inner .link a {
    display: block;
    margin: 0 auto;
  }
}
/*全て共通：hideエリアをはじめは非表示*/
.hide-area {
  display: none;
}

/*全て共通：モーダルのボタンの色を変更したい場合*/
.modaal-close:after,
.modaal-close:before {
  background: #ccc;
}

.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before {
  background: #666;
}

/*確認を促すモーダル：タイトルの色を変更したい場合*/
#modaal-title {
  font-size: 1.2rem;
  text-align: center;
  margin: 0 0 20px 0;
}

/*動画表示のモーダル：余白を変更したい場合*/
.modaal-video .modaal-inner-wrapper {
  padding: 0;
}/*# sourceMappingURL=style.css.map */