@charset "UTF-8";
/*------------------------------------------------------------
	BASE
------------------------------------------------------------*/
/*------------------------------------------------------------
	COLOR
------------------------------------------------------------*/
/*------------------------------------------------------------
	FONT
------------------------------------------------------------*/
/*------------------------------------------------------------
	FUNCTION
------------------------------------------------------------*/
/*------------------------------------------------------------
	MIXIN
------------------------------------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Inter:opsz@14..32&family=Roboto:wght@100..900&display=swap");
/*------------------------------------------------------------
	FONT
------------------------------------------------------------*/
body {
  font-family: "yu-gothic-pr6n", sans-serif;
  font-weight: 400;
  font-style: normal;
}
body * {
  font-family: "yu-gothic-pr6n", sans-serif;
  font-weight: 400;
  font-style: normal;
}
body .-en * {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
}
body .-en br {
  display: none;
}
@media screen and (min-width: 768px) {
  body .-en br {
    display: block;
  }
}
body .-en {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
}
body .-number * {
  font-family: "Inter", sans-serif;
}
body .-number {
  font-family: "Inter", sans-serif;
}

/*------------------------------------------------------------
	STYLE
------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  img {
    max-width: 100%;
  }
}
body {
  overflow-x: hidden;
}
body * {
  box-sizing: border-box;
}
body img {
  max-width: 100%;
  vertical-align: middle;
}

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

.wrap {
  position: relative;
  width: 100%;
}

/*------------------------------
	COMMON
------------------------------*/
.pc_br {
  display: none;
}
@media screen and (min-width: 768px) {
  .pc_br {
    display: block;
  }
}

.sp_br {
  display: block;
}
@media screen and (min-width: 768px) {
  .sp_br {
    display: none;
  }
}

@media screen and (min-width: 768px) {
  .pc_hide {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .sp_hide {
    display: none;
  }
}

.-fadein {
  opacity: 0;
}

.-fadein.-animate {
  animation: fadeIn 0.5s ease-out forwards;
}

.wrap {
  background: #fff;
}

.-mask {
  mask-image: linear-gradient(-25deg, transparent, transparent 41.6666666667%, rgba(0, 0, 0, 0.02) 43.3333333333%, rgba(0, 0, 0, 0.08) 45%, rgba(0, 0, 0, 0.18) 46.6666666667%, rgba(0, 0, 0, 0.32) 48.3333333333%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.68) 51.6666666667%, rgba(0, 0, 0, 0.82) 53.3333333333%, rgba(0, 0, 0, 0.92) 55%, rgba(0, 0, 0, 0.98) 56.6666666667%, #000 58.3333333333%, #000);
  mask-size: 100% max(300%, 100vh);
  mask-position: center 100%;
  mask-repeat: none;
  transform: translateZ(0);
  transition: mask-position 1s linear;
}
@media screen and (min-width: 768px) {
  .-mask {
    transition: mask-position 1.4s linear;
  }
}
.-mask.-move {
  mask-position: center 0;
}

.-uptext_inner {
  display: inline-block;
  overflow: hidden;
}
.-uptext_inner * {
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
  transform: translateY(110%);
}
.-uptext.-move .-uptext_inner * {
  transform: translateY(0%);
}

.-delay050 {
  transition-delay: 500ms !important;
}

.-delay100 {
  transition-delay: 1000ms !important;
}

.-js_l .-js_trigger {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  pointer-events: none;
}
.-js_l.-t25 .-js_trigger {
  top: 25%;
}
.-js_l.-t50 .-js_trigger {
  top: 50%;
}

/*------------------------------
	HEADER
------------------------------*/
@media screen and (min-width: 768px) {
  .header .inner {
    transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
  }
}
.header_logo {
  position: fixed;
  z-index: 10000;
  top: 5.0890585242vw;
  left: 4.0712468193vw;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
@media screen and (min-width: 768px) {
  .header_logo {
    top: 4.1666666667vw;
    left: 3.3333333333vw;
  }
}
.header_logo.-open:before {
  opacity: 1;
}
.header_logo.-open:after {
  opacity: 0;
}
.header_logo_img {
  width: 8.6513994911vw;
}
@media screen and (min-width: 768px) {
  .header_logo_img {
    width: 2.9166666667vw;
  }
}
.header_logo:before {
  content: "";
  display: block;
  position: absolute;
  top: 22.1374045802vw;
  left: 0.5089058524vw;
  width: 7.3791348601vw;
  height: 6.6157760814vw;
  background: url("../img/common/ymy_gyokuro_r.svg") 0 0 no-repeat;
  background-size: 100% 100%;
  opacity: 0;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
@media screen and (min-width: 768px) {
  .header_logo:before {
    display: none;
  }
}
.header_logo:after {
  content: "";
  display: block;
  position: absolute;
  top: 22.1374045802vw;
  left: 0.5089058524vw;
  width: 7.3791348601vw;
  height: 6.6157760814vw;
  background: url("../img/common/ymy_gyokuro_r.svg") 0 0 no-repeat;
  background-size: 100% 100%;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
@media screen and (min-width: 768px) {
  .header_logo:after {
    top: 6.1805555556vw;
    left: 2.7777777778vw;
    width: 2.8472222222vw;
    height: 2.5694444444vw;
  }
}
@media screen and (min-width: 768px) {
  .header_navi {
    position: fixed;
    z-index: 10000;
    top: 2.7777777778vw;
    right: 0;
    width: 100%;
    mix-blend-mode: difference;
  }
}
.header_navi_switch {
  position: fixed;
  top: 5.0890585242vw;
  right: 4.3256997455vw;
  z-index: 10000;
  background: transparent;
  mix-blend-mode: difference;
  width: 7.1246819338vw;
  height: 7.1246819338vw;
  border: none;
}
@media screen and (min-width: 768px) {
  .header_navi_switch {
    display: none;
  }
}
.header_navi_switch.-open button span {
  width: 0%;
}
.header_navi_switch.-open button:before {
  top: 3.5623409669vw;
  transform: translate(-50%, 0) rotate(145deg);
}
.header_navi_switch.-open button:after {
  bottom: 3.5623409669vw;
  transform: translate(-50%, 0) rotate(-145deg);
}
.header_navi_switch button {
  position: relative;
  width: 7.6335877863vw;
  height: 7.6335877863vw;
  border: none;
  background: none;
}
.header_navi_switch button span {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 105%;
  height: 0.5089058524vw;
  background: #fff;
  transform: translate(-50%, -50%);
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
.header_navi_switch button:before, .header_navi_switch button:after {
  content: "";
  display: block;
  position: absolute;
  width: 105%;
  height: 0.5089058524vw;
  background: #fff;
  transform-origin: center center;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
.header_navi_switch button:before {
  top: 1.0178117048vw;
  left: 50%;
  transform: translate(-50%, 0) rotate(0deg);
}
.header_navi_switch button:after {
  bottom: 1.0178117048vw;
  left: 50%;
  transform: translate(-50%, 0) rotate(0deg);
}
.header_navi_children {
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100lvh;
  background: #FAECDF;
  opacity: 0;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
  pointer-events: none;
}
@media screen and (min-width: 768px) {
  .header_navi_children {
    position: relative;
    width: auto;
    height: auto;
    background: none;
    opacity: 1;
    pointer-events: auto;
  }
}
.header_navi_children.-open {
  opacity: 1;
  pointer-events: auto;
}
.header_navi_lang {
  display: none;
}
@media screen and (min-width: 768px) {
  .header_navi_lang {
    position: absolute;
    top: 3.1944444444vw;
    right: 6.25vw;
    display: flex;
  }
}
@media screen and (min-width: 768px) {
  .header_navi_lang li {
    font-size: 0.9722222222vw;
  }
}
.header_navi_lang li:last-child:before {
  content: "/";
  display: inline-block;
  padding: 0 0.3472222222vw;
  font-size: 0.9722222222vw;
  color: #fff;
}
.header_navi_lang li a:hover:after {
  opacity: 1;
}
@media screen and (min-width: 768px) {
  .header_navi_lang li a:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background: #fff;
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
  }
}
.header_navi_lang li .-current {
  font-weight: 600;
}
.header_navi_sns {
  position: absolute;
  display: flex;
  flex-flow: column;
  gap: 3.0534351145vw;
  top: 126.7175572519vw;
  right: 10.1781170483vw;
}
@media screen and (min-width: 768px) {
  .header_navi_sns {
    display: none;
  }
}
.header_navi_sns_item {
  width: 7.6335877863vw;
}
.header_navi .header_navi_children.-open + .header_navi_onlinestore {
  opacity: 1 !important;
}
.header_navi_onlinestore {
  position: fixed;
  top: 18.320610687vw;
  right: 4.0712468193vw;
  z-index: 10000;
  color: #fff;
  background: transparent;
  mix-blend-mode: difference;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
@media screen and (min-width: 768px) {
  .header_navi_onlinestore {
    display: none;
  }
}
.header_navi_onlinestore.-hide {
  opacity: 0;
  pointer-events: none;
}
.header_navi_onlinestore a {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 4.3256997455vw 0 8.3969465649vw;
  width: 7.6335877863vw;
  height: auto;
  border: 1px solid #fff;
  border-radius: 100px;
}
.header_navi_onlinestore a:after {
  content: "";
  display: block;
  position: absolute;
  bottom: 3.5623409669vw;
  left: 50%;
  width: 4.3256997455vw;
  height: 2.2900763359vw;
  background: url("../img/common/icon_arrow_w.svg") 0 0 no-repeat;
  background-size: contain;
  transform: translate(-50%, 0) rotate(-45deg);
}
.header_navi a {
  position: relative;
  color: #000;
}
@media screen and (min-width: 768px) {
  .header_navi a {
    padding: 0.3472222222vw 0 0.3472222222vw;
    color: #fff;
  }
}
.header_navi a.-other {
  padding-right: 5.0890585242vw;
}
@media screen and (min-width: 768px) {
  .header_navi a.-other {
    padding-right: 1.3888888889vw;
  }
}
.header_navi a.-other:before {
  content: "";
  display: block;
  position: absolute;
  top: 35%;
  right: 0;
  width: 4.3256997455vw;
  height: 2.2900763359vw;
  background: url("../img/common/icon_arrow_w.svg") 0 0 no-repeat;
  background-size: contain;
  transform: translate(0, -50%);
}
@media screen and (min-width: 768px) {
  .header_navi a.-other:before {
    width: 1.1805555556vw;
    height: 0.6944444444vw;
    transform: translate(0, -50%) rotate(-45deg);
  }
}
@media screen and (min-width: 768px) {
  .header_navi a:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background: #fff;
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
  }
}
.header_navi_list {
  position: absolute;
  top: 50%;
  display: flex;
  flex-flow: column;
  gap: 6.3613231552vw;
  padding: 0 10.1781170483vw 0;
  transform: translateY(-50%);
}
@media screen and (min-width: 768px) {
  .header_navi_list {
    position: relative;
    top: auto;
    flex-flow: row;
    justify-content: flex-end;
    padding: 0 6.9vw;
    gap: 2.8472222222vw;
    transform: none;
  }
}
.header_navi_list_item {
  position: relative;
  font-size: 4.0712468193vw;
  letter-spacing: 0.6106870229vw;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .header_navi_list_item {
    font-size: 0.9722222222vw;
    letter-spacing: 0.1458333333vw;
  }
}
.header_navi_list_item > a {
  display: block;
}
@media screen and (min-width: 768px) {
  .header_navi_list_item:hover > a:after {
    opacity: 1;
  }
  .header_navi_list_item:hover .-family .-parent > a:after {
    opacity: 1;
  }
}
.header_navi_list_item.-spc {
  padding-top: 5.0890585242vw;
}
@media screen and (min-width: 768px) {
  .header_navi_list_item.-spc {
    padding-top: 0;
    padding-left: 6.25vw;
  }
}
.header_navi_list_item:last-child a {
  margin-top: -0.2083333333vw;
  padding-left: 1.1111111111vw;
  padding-right: 2.5694444444vw;
  border: 1px solid rgba(255, 255, 255, 0);
  border-radius: 100px;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
@media screen and (min-width: 768px) {
  .header_navi_list_item:last-child a {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 2.3611111111vw;
    line-height: 1;
  }
}
.header_navi_list_item:last-child a:hover {
  border: 1px solid white;
}
.header_navi_list_item:last-child a:before {
  content: "";
  display: block;
  position: absolute;
  top: 45%;
  right: 1.0416666667vw;
  width: 1.1805555556vw;
  height: 0.6944444444vw;
  background: url("../img/common/icon_arrow_w.svg") 0 0 no-repeat;
  background-size: contain;
  transform: translate(0, -50%) rotate(-45deg);
}
.header_navi_list_item:last-child a:after {
  display: none;
}
.header_navi_list_item .-family {
  position: relative;
}
.header_navi_list_item .-family.-open .-children {
  opacity: 1;
}
.header_navi_list_item .-family.-open .-parent button:after {
  transform: rotate(0deg);
}
@media screen and (min-width: 768px) {
  .header_navi_list_item .-family:hover .-children {
    opacity: 1;
  }
}
.header_navi_list_item .-family .-parent {
  display: flex;
  align-items: center;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .header_navi_list_item .-family .-parent {
    display: block;
  }
}
.header_navi_list_item .-family .-parent a {
  display: inline-block;
}
.header_navi_list_item .-family .-parent button {
  position: relative;
  display: inline-block;
  margin-left: 4.0712468193vw;
  width: 5.0890585242vw;
  height: 5.0890585242vw;
  border: none;
  background: none;
}
@media screen and (min-width: 768px) {
  .header_navi_list_item .-family .-parent button {
    display: none;
  }
}
.header_navi_list_item .-family .-parent button:before, .header_navi_list_item .-family .-parent button:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  width: 3.8167938931vw;
  height: 0.2544529262vw;
  background: #331F07;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
@media screen and (min-width: 768px) {
  .header_navi_list_item .-family .-parent button:before, .header_navi_list_item .-family .-parent button:after {
    display: none;
  }
}
.header_navi_list_item .-family .-parent button:before {
  right: 0;
}
.header_navi_list_item .-family .-parent button:after {
  right: 0;
  transform-origin: center center;
  transform: rotate(90deg);
}
.header_navi_list_item .-family .-children {
  height: 0;
  opacity: 0;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
@media screen and (min-width: 768px) {
  .header_navi_list_item .-family .-children {
    position: absolute;
    padding: 0.3472222222vw 0 0;
    height: auto;
    overflow: visible;
  }
}
.header_navi_list_item .-family .-children .-child {
  padding: 3.8167938931vw 0 0 4.0712468193vw;
  font-size: 3.5623409669vw;
  letter-spacing: 0.534351145vw;
}
@media screen and (min-width: 768px) {
  .header_navi_list_item .-family .-children .-child {
    padding: 0.6944444444vw 0 0;
    font-size: 0.9722222222vw;
    letter-spacing: 0.1458333333vw;
  }
}
.header_navi_list_item .-family .-children .-child > a > span {
  position: relative;
  display: inline-block;
}
@media screen and (min-width: 768px) {
  .header_navi_list_item .-family .-children .-child > a > span:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background: #fff;
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
  }
}
.header_navi_list_item .-family .-children .-child:hover > a > span:after {
  opacity: 1;
}

/*------------------------------
	CONTENTS
------------------------------*/
/* スペースの幅を保持 */
.typing-text .space {
  display: inline-block;
  width: 0.3em;
}

/* 縦書きのspan要素 */
.typing-text.-ja > span {
  display: inline-block;
  opacity: 0;
  filter: blur(5px);
  transform: translateY(20px);
  transition: all 0.6s ease;
}

.typing-text.-ja > span.show {
  opacity: 1;
  filter: blur(0px);
  transform: translateY(0);
}

/* 横書き用 */
.typing-text.-en .word-item {
  display: inline-block;
  opacity: 0;
  filter: blur(5px);
  transform: translateY(20px);
  transition: all 0.6s ease;
  transition-delay: 500ms;
}

.typing-text.-en .word-item.show {
  opacity: 1;
  filter: blur(0px);
  transform: translateY(0);
}

.parallax {
  will-change: transform;
}

/* パララックス用のコンテナ */
.parallax-container {
  overflow: hidden;
  position: relative;
}

.parallax-container .parallax {
  width: 100%;
  height: 120%; /* 少し大きめにして動く余白を確保 */
  object-fit: cover;
  transition: all 1s cubic-bezier(0.21, 0.51, 0.51, 1);
}

.button_more {
  position: relative;
  display: inline-block;
  margin: 0 5.0890585242vw;
  padding: 1.7811704835vw 12.7226463104vw 1.7811704835vw 4.0712468193vw;
  width: fit-content;
  width: -webkit-fit-content;
  border: 1px solid #331F07;
  font-size: 3.0534351145vw;
  line-height: 2;
  letter-spacing: 0.2544529262vw;
  color: #331F07;
  text-align: left;
  transition: all 0.25s cubic-bezier(0.21, 0.51, 0.51, 1);
}
@media screen and (min-width: 768px) {
  .button_more {
    position: relative;
    margin: 0 5.5555555556vw;
    padding: 0.625vw 3.9583333333vw 0.625vw 1.6666666667vw;
    font-size: 0.9722222222vw;
    line-height: 2.1428571429;
    letter-spacing: 0.1388888889vw;
  }
}
.button_more.-outlink:after {
  transform: translate(0, -50%) rotate(-45deg);
}
.button_more:hover {
  color: #FAECDF;
}
.button_more:hover:before {
  width: 100%;
}
.button_more:hover:after {
  background: url("../img/common/icon_arrow_w.svg") 0 0 no-repeat;
  background-size: 100% 100%;
}
.button_more:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #331F07;
  transition: all 0.25s cubic-bezier(0.21, 0.51, 0.51, 1);
}
.button_more:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 4.3256997455vw;
  width: 4.3256997455vw;
  height: 2.2900763359vw;
  background: url("../img/common/icon_arrow.svg") 0 0 no-repeat;
  background-size: contain;
  transform: translate(0, -50%);
  transition: all 0.25s cubic-bezier(0.21, 0.51, 0.51, 1);
}
@media screen and (min-width: 768px) {
  .button_more:after {
    top: 50%;
    right: 1.3194444444vw;
    width: 1.1805555556vw;
    height: 0.6944444444vw;
  }
}
.button_more > span {
  position: relative;
  display: block;
  padding: 0 !important;
}

/*------------------------------
	FOOTER
------------------------------*/
.footer {
  position: relative;
  background: #97AA82;
}
.footer .inner {
  padding: 21.6284987277vw 7.6335877863vw 6.106870229vw;
}
@media screen and (min-width: 768px) {
  .footer .inner {
    padding: 2.7777777778vw 5.5555555556vw;
  }
}
.footer_logo {
  position: absolute;
  right: 1.5267175573vw;
  bottom: 31.5521628499vw;
  display: flex;
  flex-flow: column-reverse;
  align-items: center;
  gap: 8.1424936387vw;
  color: #fff;
}
@media screen and (min-width: 768px) {
  .footer_logo {
    flex-flow: row-reverse;
    align-items: flex-end;
    top: 1.8055555556vw;
    right: 0;
    bottom: auto;
    gap: 1.1111111111vw;
  }
}
.footer_logo img {
  width: 9.6692111959vw;
}
@media screen and (min-width: 768px) {
  .footer_logo img {
    margin-bottom: 0.6944444444vw;
    width: 3.2638888889vw;
  }
}
.footer_logo span {
  writing-mode: vertical-rl;
  font-size: 3.5623409669vw;
  letter-spacing: 0.5089058524vw;
}
@media screen and (min-width: 768px) {
  .footer_logo span {
    writing-mode: lr;
    font-size: 0.9722222222vw;
    letter-spacing: 0;
  }
}
.footer_navi {
  position: relative;
  font-size: 3.5623409669vw;
  letter-spacing: 0.3562340967vw;
}
@media screen and (min-width: 768px) {
  .footer_navi {
    font-size: 0.9722222222vw;
    letter-spacing: 0.0972222222vw;
  }
}
.footer_navi a {
  display: inline-block;
  color: #fff;
}
.footer_navi_main {
  position: relative;
  display: flex;
  flex-flow: column;
  gap: 5.0890585242vw;
  padding-left: 2.5445292621vw;
  padding-bottom: 8.9058524173vw;
}
@media screen and (min-width: 768px) {
  .footer_navi_main {
    flex-flow: row;
    gap: 2.5vw;
    min-height: 12.5vw;
    padding-left: 0;
    padding-bottom: 0;
  }
}
.footer_navi_main_item.-spc {
  padding-top: 5.0890585242vw;
}
@media screen and (min-width: 768px) {
  .footer_navi_main_item.-spc {
    padding-top: 0;
    padding-left: 1.0416666667vw;
  }
}
.footer_navi_main_item.-online {
  padding-top: 5.0890585242vw;
}
@media screen and (min-width: 768px) {
  .footer_navi_main_item.-online {
    position: absolute;
    left: 0;
    bottom: 3.125vw;
    padding-top: 0;
  }
}
.footer_navi_main_item.-online a {
  position: relative;
  padding-right: 8.6513994911vw;
}
@media screen and (min-width: 768px) {
  .footer_navi_main_item.-online a {
    padding-right: 2.3611111111vw;
  }
}
.footer_navi_main_item.-online a:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 0;
  width: 4.3256997455vw;
  height: 2.5445292621vw;
  background: url("../img/common/icon_arrow_w.svg") 0 0 no-repeat;
  background-size: 100% 100%;
  transform: translate(0, -50%) rotate(-45deg);
}
@media screen and (min-width: 768px) {
  .footer_navi_main_item.-online a:after {
    width: 1.1805555556vw;
    height: 0.6944444444vw;
  }
}
.footer_navi_main_item.-online a img {
  width: 40.7124681934vw;
}
@media screen and (min-width: 768px) {
  .footer_navi_main_item.-online a img {
    width: 14.7916666667vw;
  }
}
.footer_navi_main_item .-family.-open .-parent button:before {
  transform: translate(-50%, -50%) rotate(145deg);
}
.footer_navi_main_item .-family.-open .-parent button:after {
  transform: translate(-50%, -50%) rotate(125deg);
}
.footer_navi_main_item .-family .-parent {
  display: flex;
  align-items: center;
}
@media screen and (min-width: 768px) {
  .footer_navi_main_item .-family .-parent {
    display: block;
  }
}
.footer_navi_main_item .-family .-parent button {
  position: relative;
  margin-left: 4.0712468193vw;
  width: 3.0534351145vw;
  height: 3.0534351145vw;
  border: none;
  background: none;
}
@media screen and (min-width: 768px) {
  .footer_navi_main_item .-family .-parent button {
    display: none;
  }
}
.footer_navi_main_item .-family .-parent button:before, .footer_navi_main_item .-family .-parent button:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
.footer_navi_main_item .-family .-parent button:before {
  width: 3.0534351145vw;
  height: 1px;
}
.footer_navi_main_item .-family .-parent button:after {
  width: 1px;
  height: 12px;
}
.footer_navi_main_item .-family .-children {
  height: 0;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
@media screen and (min-width: 768px) {
  .footer_navi_main_item .-family .-children {
    display: none;
  }
}
.footer_navi_main_item .-family .-children ul {
  display: flex;
  flex-flow: column;
  gap: 5.0890585242vw;
  padding: 5.0890585242vw 0 0 4.0712468193vw;
}
.footer_navi_sub {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5.0890585242vw 2.5445292621vw 0;
  border-top: 1px solid #fff;
}
@media screen and (min-width: 768px) {
  .footer_navi_sub {
    padding: 1.0416666667vw 0 0;
  }
}
.footer_navi_sub_links {
  display: flex;
  gap: 4.0712468193vw;
  font-size: 3.0534351145vw;
}
@media screen and (min-width: 768px) {
  .footer_navi_sub_links {
    display: flex;
    gap: 2.7777777778vw;
    font-size: 0.9722222222vw;
  }
}
.footer_navi_sub_links a {
  position: relative;
}
.footer_navi_sub_sns {
  position: absolute;
  right: 1.5267175573vw;
  bottom: 17.8117048346vw;
  display: flex;
  gap: 3.0534351145vw;
}
@media screen and (min-width: 768px) {
  .footer_navi_sub_sns {
    position: absolute;
    right: 6.0416666667vw;
    bottom: 3.4722222222vw;
    gap: 1.1111111111vw;
  }
}
.footer_navi_sub_sns img {
  width: 7.1246819338vw;
}
@media screen and (min-width: 768px) {
  .footer_navi_sub_sns img {
    width: 2.2222222222vw;
  }
}
.footer p {
  padding: 10.1781170483vw 0 0;
  text-align: center;
  font-size: 2.5445292621vw;
  color: rgba(51, 31, 7, 0.5);
}
@media screen and (min-width: 768px) {
  .footer p {
    position: absolute;
    right: 5.5555555556vw;
    bottom: 3.125vw;
    padding: 0;
    font-size: 0.8333333333vw;
  }
}

/*# sourceMappingURL=common.css.map */
