@charset "UTF-8";

/* CSS Document */
html {
  font-size: 62.5%;
  /* 16px * 62.5% = 10px */
  width: 100%;
  scroll-behavior: smooth;
}

:root {
  --gold: #B88B22;
  --d_gold: #9a9539;
  --gray: #c8d2da;
  --ja: "Zen Old Mincho", serif;
  --en: "EB Garamond", serif;
}

body {
  color: #ffffff;
  /* RGB */
  background-color: #2A2B2B;
  font-family: "Zen Old Mincho", serif;
  font-weight: 500;
  font-style: normal;
  font-size: clamp(1.2rem, 3.7vw, 2.0rem);
  line-height: 2;
  text-align: center;
}

h2,
h3,
h4 {
  font-weight: 400
}

.vertical {
  position: static;
  display: inline-block;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  letter-spacing: 0.01rem;
  line-height: 1.5;
  text-align: left;
}

.ja {
  font-family: var(--ja);
  font-weight: 800;
  font-style: normal;
  ;
}

.YuMincho {
  font-family: "游明朝体", "游明朝", YuMincho, "ヒラギノ明朝 Pro", " ヒラギノ明朝 Pro", "  MS P明朝", "MS P明朝", serif;
}

.en {
  font-family: "EB Garamond", serif;
}

a {
  color: #ffffff;
}

a:hover {
  opacity: 0.7;
}

.clarity a:hover {
  opacity: 1;
}

*,
*:before,
*:after {
  box-sizing: border-box;
}

img {
  width: 100%;
  display: block;
}

.pc_none {
  display: block;
}

.sp_none {
  display: none;
}

.is-hide {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.gold {
  color: var(--gold);
}

.white {
  color: #ffffff;
}

.center {
  text-align: center;
}

.left {
  text-align: justify;
}

.right {
  text-align: right;
}

.bold {
  font-weight: 700;
}

.fadeInUpTrigger,
.fadeInRightTrigger,
.fadeInleftTrigger {
  opacity: 0;
}

.flex {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.flex.row {
  flex-direction: row;
  flex-wrap: wrap;
}

.flex.sp_none {
  display: none;
}

header {}

/* ham_menu */
.ham_btn {
  position: fixed;
  cursor: pointer;
  width: 60px;
  height: 60px;
  z-index: 999;
  margin: 0;
  top: 0;
  right: 0;
}

.ham_btn span {
  display: inline-block;
  transition: all .4s;
  position: absolute;
  left: 10px;
  height: 1px;
  background: #ffffff;
  width: 40px;
}

.ham_btn span:nth-of-type(1) {
  top: 20px;
}

.ham_btn span:nth-of-type(2) {
  top: 30px;
  width: 25px;
}

.ham_btn.active span:nth-of-type(1) {
  top: 25px;
  left: 20px;
  transform: translateY(6px) rotate(-45deg);
  width: 30px;
}

.ham_btn.active span:nth-of-type(2) {
  top: 36px;
  left: 20px;
  transform: translateY(-6px) rotate(45deg);
  width: 30px;
}

.nav_wrap {
  position: fixed;
  z-index: 100;
  top: 0;
  right: -120%;
  width: 100%;
  height: 100%;
  transition: all 0.6s;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  background-color: #2A2B2B;
  background-image: url(../img/bg01.png);
  background-size: cover;
  padding: 60px;
  gap: 20px;
}

.nav_wrap .logo {
  width: 50%;
  max-width: 102px;
  margin: 0 auto;
}

.nav_wrap ul {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin: 40px 0;
  gap: 10px;
}

.nav_wrap li {
  list-style: none;
  text-align: center;
  font-size: 2.0rem;
  line-height: 1;
}

.nav_wrap li a {
  color: #ffffff;
  text-decoration: none;
  padding: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

.nav_wrap li.insta a {
  width: 10vw;
  max-width: 46px;
  margin: 0 auto;
  padding: 0;
}

.nav_wrap.show {
  right: 0;
}

/* MV */
.MV {
  position: relative;
  height: 95vh;
}

.MV .slide {
  height: 95vh;
  background-image: url(../img/MV_01.png);
  background-size: cover;
  background-position: center;
}

.MV .slide:nth-child(2) {
  height: 95vh;
  background-image: url(../img/MV_02.png);
}

.mv_textWrap {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5vh;
}

.mv_textWrap .logo {
  width: 50%;
  max-width: 224px;
}

.inner {
  width: 94%;
  max-width: 1280px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: min(10vw, 40px);
}

.scrolldown {
  position: absolute;
  bottom: 1%;
  right: 50%;
  transform: translateX(50%);
  animation: arrowmove 2s ease-in-out infinite;
}

/*下からの距離が変化して全体が下→上→下に動く*/
@keyframes arrowmove {
  0% {
    bottom: 1%;
  }

  50% {
    bottom: 3%;
  }

  100% {
    bottom: 1%;
  }
}

/* 共通 */
section {
  position: relative;
  padding: 80px 0 100px;
}

.section_ttl {
  font-size: clamp(2.4rem, 6.9vw, 4.7rem);
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}

.section_ttl span {
  font-size: clamp(1.6rem, 4.6vw, 3.0rem);
  font-family: var(--en);
  font-weight: 400;
}

.concept {
  background-image: url(../img/bg01.png);
  background-size: cover;
}

.concept_imgWrap {
  position: relative;
  padding-top: min(14vw, 107px);
}

.concept_imgWrap h3 {
  position: absolute;
  top: 0;
  left: 3vw;
  font-size: clamp(5rem, 14vw, 8.5rem);
  font-family: var(--ja);
}

.concept_imgWrap:nth-child(2) h3 {
  left: auto;
  right: 3vw;
}

.concept .content {
  background-color: #ffffff;
  padding: min(5%, 100px) min(5%, 140px) min(5%, 40px);
  margin-top: min(10vw, 40px);
  color: #2A2B2B;
}

.more {
  width: min(60vw, 420px);
  margin: 0 auto;
}

.bg {
  background-image: url(../img/bg02.png);
  background-size: cover;
}

#top_menu .content {
  background-image: url(../img/top_img04.png);
  background-size: cover;
  background-position: center;
  padding: min(10%, 40px) 5%;
}

#top_menu .content p {
  text-align: left;
}

.top_slide .slide {
  width: 90vw;
}

#top_course .content {
  background-image: url(../img/top_img05.png);
  background-size: cover;
  background-position: center;
  padding: min(10%, 40px) 5%;
}

#top_course .content p {
  text-align: left;
}

#top_message {
  background-color: #343434
}

#top_message .message_img {
  width: 100%;
  aspect-ratio: 400/165;
  background-image: url(../img/top_img06.png);
  background-size: cover;
  background-position: center;
}

.information {
  padding-bottom: 40px;
}

.information .inner {
  width: 100%;
}

.information .content_wrap {
  width: 94%;
  max-width: 660px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: min(10vw, 40px);
  text-align: left;
}

.information .content h3 {
  text-align: left;
  font-size: clamp(1.8rem, 4.6vw, 3.0rem);
  color: #9F9F9F;
  position: relative;
  padding-left: 1rem;
  padding-bottom: 4px;
  border-bottom: 1px solid #9F9F9F;
}

.information .content h3::before {
  content: "■";
  font-size: clamp(1.8rem, 4.6vw, 3.0rem);
  color: #9F9F9F;
  padding-right: 1rem;
}

dl {
  margin: 20px 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

dl .description-item {
  width: 100%;
  display: flex;
}

dl .description-item dt {
  width: 120px;
}

dl .description-item dd {
  width: calc(100% - 120px)
}

.map iframe {
  display: block;
  width: 100%;
  height: 360px;
}

.recruit {
  background-image: url(../img/recruit_bg.png);
  background-size: cover;
  background-position: 40% 60%;
  padding: 10vw 0 20px;
}

.recruit .content_textWrap {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  max-width: 680px;
  margin: 0 0 0 auto;
}

.recruit h3 {
  font-size: clamp(1.8rem, 4.8vw, 3.5rem);
  margin-bottom: min(10vw, 60px);
}

.recruit .more {
  width: 50%;
  margin: 0 0 0 auto;
}

.bg02 {
  background-image: url(../img/bg01.png);
  background-size: cover;
}

.contact {
  padding: 80px 0 40px;
}

.contact .logo {
  width: 40%;
  max-width: 173px;
  margin: 0 auto 40px;
}

.contact .content {
  background-color: #343434;
  gap: min(10vw, 40px);
  padding: min(5%, 40px);
}

.contact .content .flex {
  gap: min(5vw, 20px);
}

.contact_item {
  width: 90%;
  max-width: 331px;
  margin: 0 auto;
  font-size: clamp(1.8rem, 4.8vw, 2.0rem);
}

.contact dl .description-item dt {
  width: 80px;
}

.contact dl .description-item dd {
  width: calc(100% - 80px)
}

.cr {
  padding: 16px 0;
  font-size: 1.6rem;
  text-align: center;
}

#go_top {
  width: 40px;
  position: fixed;
  bottom: 5px;
  right: 5px;
  z-index: 900;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* pcスタイル */
@media screen and (min-width: 960px) {
  .sp_none {
    display: block;
  }

  .pc_none {
    display: none;
  }

  .flex.sp_none {
    display: flex;
  }

  .flex.pc_none {
    display: none;
  }

  .flex {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  .flex.reverse {
    flex-direction: row-reverse;
  }

  header {
    z-index: 10;
    width: 100%;
    position: fixed;
    z-index: 100;
    background-color: rgba(52, 52, 52, 0.4);
  }

  .header_inner {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 2%;
  }

  .header_left {
    display: flex;
  }

  .header_btnWrap {
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  header .logo {
    width: 100%;
    padding: 4px 0;
    max-width: 440px;
    margin-right: 2vw;
  }

  .header_right {
    width: calc(100% - 300px);
    max-width: 1200px;
    height: 100%;
    gap: 20px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    justify-content: space-between
  }

  .pc_nav {
    width: 100%;
  }

  .pc_nav ul {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0;
  }

  .pc_nav ul li a {
    color: #ffffff;
    line-height: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    font-weight: 700;
  }

  #top_section .content {
    gap: 20px;
  }

  #top_section .top_img {
    width: 27%;
  }

  #top_section .content p {
    text-align: center;
    width: 73%;
    line-height: 3;
  }

  .concept_imgouter {
    gap: 0;
    margin-top: 80px;
  }

  .concept_imgWrap h3 {
    left: 40%;
    transform: translateX(-50%);
  }

  .concept_imgWrap:nth-child(2) h3 {
    left: auto;
    right: 40%;
    transform: translateX(50%);
  }

  .concept .content {
    max-width: 985px;
    flex-direction: column;
    gap: 80px;
    margin-top: -40px;
    position: relative;
    z-index: 2;
  }

  .concept .content p {
    text-align: center;
  }

  #top_menu .content {
    width: 94%;
    max-width: 1280px;
    margin: 0 auto;
    flex-direction: column;
    padding: 80px 10px 40px;
    gap: 80px;
  }

  #top_menu .content p {
    text-align: center;
  }

  .top_slide .slide {
    width: 30vw;
  }

  #top_course .content {
    width: 94%;
    max-width: 1280px;
    margin: 0 auto;
    flex-direction: column;
    padding: 80px 10px 40px;
    gap: 80px;
  }

  #top_course .content p {
    text-align: center;
  }

  #top_message .content_textWrap {
    width: 60%;
    gap: 10vw;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
  }

  #top_message .message_img {
    width: 40%;
    aspect-ratio: 363/485;
    background-position: 60% center;
  }

  .information {
    padding: 100px 0 120px;
  }

  dl .description-item dt {
    width: 160px;
  }

  dl .description-item dd {
    width: calc(100% - 160px)
  }

  .information .more {
    margin: 60px auto 120px;
  }

  .map iframe {
    height: 740px;
  }

  .recruit .content_textWrap {
    align-items: flex-start;
  }

  .contact .content {
    padding-top: 80px;
    align-items: center;
    gap: 60px;
  }

  .contact .content .flex {
    width: 100%;
    max-width: 840px;
    justify-content: space-between;
  }

  .contact dl {
    margin: 0 auto;
    max-width: 500px;
    text-align: left;
  }

  .contact dl .description-item dt {
    width: 120px;
  }

  .contact dl .description-item dd {
    width: calc(100% - 120px)
  }

  footer .pc_nav {
    max-width: 890px;
    margin: 40px auto 20px;
  }

  footer .pc_nav .insta {
    width: 30px;
  }

  #go_top {
    width: 60px;
    bottom: 10px;
    right: 10px;
    z-index: 900;
  }
}
@media (max-width: 960px) {
  #go_top {
    width: 60px;
    bottom: 95px;
    right: 10px;
    z-index: 900;
  }
}
.MV.U_mv {
  height: 50vw;
  max-height: 600px;
}

#concept_wrapper .MV.U_mv {
  background-image: url(../img/MV_concept.png);
  background-size: cover;
  background-position: center;
}

.U_mv-ttl {
  position: absolute;
  width: 90%;
  font-size: clamp(3.4rem, 8vw, 6.3rem);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#concept_message {
  padding-top: 60px;
}

#concept_message .flex {
  gap: 0;
}

#concept_message .content_textWrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

#concept_message .name {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 90%;
  font-size: clamp(2.4rem, 5vw, 5.2rem);
  border-bottom: 1px solid #ffffff;
}

#concept_message .name span {
  font-size: clamp(1.4rem, 3.7vw, 3.0rem);
}

#concept_message .content {
  background-color: #ffffff;
  padding: min(5%, 40px);
  text-align: justify;
  color: #2A2B2B;
}

#concept_concept .inner {
  margin-bottom: min(10vw, 80px);
}

#concept_concept .content_text {
  background-color: #ffffff;
  color: #2A2B2B;
  padding: min(5%, 40px);
  width: 90%;
  margin: -20px 0 0 auto;
  position: relative;
  z-index: 2;
}

#concept_concept .concept_imgWrap:nth-of-type(2) .content_text {
  margin: -20px auto 0 0;
}

/* pcスタイル */
@media screen and (min-width: 960px) {
  #concept_message {
    padding: 80px 0 160px;
  }

  #concept_message .inner {
    max-width: 1686px;
  }

  #concept_message .flex {
    align-items: flex-start;
  }

  #concept_message .content_textWrap {
    margin-left: -5vw;
  }

  #concept_message .name {
    max-width: 790px;
  }

  #concept_concept .top_img {
    width: 27%;
  }

  #concept_concept .content01 p {
    text-align: center;
    width: 73%;
    line-height: 3;
  }

  #concept_concept .concept_imgouter {
    flex-direction: column;
  }

  #concept_concept .concept_imgWrap {
    width: 100%;
  }

  #concept_concept .concept_imgWrap .concept_img {
    width: 60%;
  }

  #concept_concept .concept_imgWrap h3 {
    left: 20%;
  }

  #concept_concept .concept_imgWrap .content_text {
    width: 60%;
    height: 290px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: left;
    margin: 0 0 0 auto;
    transform: translateY(-50%);
  }

  #concept_concept .concept_imgWrap:nth-of-type(2) .concept_img {
    margin: 0 0 0 auto;
  }

  #concept_concept .concept_imgWrap:nth-of-type(2) {
    margin: 0 0 0 auto;
  }

  #concept_concept .concept_imgWrap:nth-of-type(2) h3 {
    left: auto;
    right: 20%;
  }

  #concept_concept .concept_imgWrap .content_text {
    width: 60%;
    height: 290px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: left;
    margin: 0 0 0 auto;
    transform: translateY(-50%);
  }
}

#menu_wrapper .MV.U_mv {
  background-image: url(../img/MV_menu.png);
  background-size: cover;
  background-position: center;
}

.anchor_wrap {
  width: 90%;
  max-width: 914px;
  margin: 40px auto 60px;
  align-items: center;
}

.anchor {
  width: 100%;
  max-width: 330px;
  background-color: #B88B22;
}

.anchor a {
  display: flex;
  width: 100%;
  height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(1.6rem, 4.6vw, 3.0rem);
}

#menu_food {
  margin-top: -60px;
  padding-top: 60px;
}

#menu_food .content_wrap {
  background-color: #343434;
  padding: min(10vw, 80px) 5%;
  max-width: 1400px;
}

#menu_food .content {
  display: flex;
  flex-direction: column;
  text-align: left;
  width: 100%;
  max-width: 1060px;
  margin: 0 auto;
  line-height: 2.5
}

#menu_food .content h4 {
  font-size: clamp(3.2rem, 8vw, 6.0rem);
}

#menu_food .content h4 span {
  font-size: clamp(1.2rem, 3.7vw, 2.0rem);
  padding-left: 4rem;
}

.menu-wrap {
  max-width: 450px;
}

.menu-item {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.menu-item span {
  word-break: keep-all;
}

.menu-item.pl_1 {
  padding-left: 2rem;
}

#menu_drink {
  padding-top: 60px;
}

#menu_drink .content_wrap {
  background-color: #343434;
  padding: min(10vw, 80px) 5%;
  max-width: 1400px;
  line-height: 2.5
}

#menu_drink .content {
  display: flex;
  flex-direction: column;
  text-align: left;
  width: 100%;
  max-width: 1060px;
  margin: 0 auto;
}

#menu_drink .content h4 {
  font-size: clamp(3.2rem, 8vw, 6.0rem);
}

#menu_drink .content h4 span {
  font-size: clamp(1.2rem, 3.7vw, 2.0rem);
  padding-left: 4rem;
}

/* pcスタイル */
@media screen and (min-width: 960px) {
  .menu_lead {
    padding-bottom: 120px;
  }

  .menu_lead .inner {
    margin: 40px auto 80px;
  }

  #menu_food .content {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #menu_food .content h4 {
    width: 100%;
  }

  #menu_food .menu-wrap {
    width: 45%;
  }

  #menu_drink {
    padding: 120px 0;
  }

  #menu_drink .content_wrap {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #menu_drink .content_wrap h3 {
    width: 100%;
  }

  #menu_drink .content_wrap h4 {
    letter-spacing: -0.1em;
  }

  #menu_drink .content_wrap h4 span {
    letter-spacing: -0;
  }

  #menu_drink .content {
    width: 45%;
  }

  #menu_drink .content:nth-last-of-type(1) {
    width: 100%;
    margin: 0;
  }
}

#course_wrapper .MV.U_mv {
  background-image: url(../img/MV_course.png);
  background-size: cover;
  background-position: center;
}

#course .inner {
  margin-bottom: 80px;
}

#course .content_wrap {
  background-color: #343434;
  padding: min(10vw, 80px) 5%;
  max-width: 1400px;
  line-height: 2.5;
  display: flex;
  flex-direction: column;
  gap: min(10vw, 40px);
}

#course .course_ttl {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
}

#course .course_ttl h4 {
  display: flex;
  flex-direction: column;
  font-size: clamp(3.2rem, 8vw, 6.0rem);
  line-height: 1.2;
}

#course .course_ttl h4 span {
  font-size: clamp(1.2rem, 3.7vw, 2.0rem);
}

#course .course_ttl .price {
  padding-left: 10vw;
  font-size: clamp(3.2rem, 8vw, 6.0rem);
  line-height: 1.2;
}

#course .content p {
  text-align: left;
  line-height: 1.5;
  margin-top: min(2vw, 12px);
}

/* pcスタイル */
@media screen and (min-width: 960px) {
  #course .inner {
    gap: 100px;
    margin-bottom: 120px;
  }

  #course .content_wrap {
    gap: 100px;
  }

  #course .course_ttl .price {
    padding-left: 20vw;
  }
}

#information_wrapper .MV.U_mv {
  background-image: url(../img/MV_information.png);
  background-size: cover;
  background-position: center;
}

#information_01 {
  background-image: url(../img/bg02.png);
  background-size: cover;
  padding-top: 40px;
}

#information_01 .content_wrap {
  display: flex;
  flex-direction: column;
  gap: min(10vw, 140px);
  max-width: 1400px;
}

#information_01 .content {
  gap: min(5vw, 60px);
}

#information_01 .content h3 {
  font-size: clamp(3rem, 7vw, 6.0rem);
}

/* pcスタイル */
@media screen and (min-width: 960px) {
  #information_01 {
    padding-top: 120px;
  }

  #information_01 .content:nth-of-type(2) {
    flex-direction: row-reverse;
  }

  #information_01 .content_img {
    width: 40%;
  }

  #information_01 .content_textWrap {
    text-align: justify;
    width: 60%;
  }

  #information_01 .content_textWrap h3 {
    margin-bottom: 20px;
  }
}

#recruit_wrapper .MV.U_mv {
  background-image: url(../img/MV_information.png);
  background-size: cover;
  background-position: center;
}

#recruit .content_wrap {
  background-color: #343434;
  padding: min(10vw, 80px) 3% min(15vw, 120px);
  line-height: 2.5;
  display: flex;
  flex-direction: column;
  gap: min(10vw, 40px);
}

#recruit .content_wrap table {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto min(10vw, 120px);
  text-align: left;
  border: 1px solid #70563A;
  border-bottom: none;
}

#recruit .content_wrap table tr {
  display: flex;
  flex-wrap: wrap;
}

#recruit .content_wrap table th {
  width: 100%;
  padding: 2%;
  border-bottom: 1px solid #70563A;
  background-color: #7E8082;
}

#recruit .content_wrap table td {
  width: 100%;
  padding: 2%;
  border-bottom: 1px solid #70563A;
}

#recruit .contact_btn {
  max-width: 500px;
  margin: 0 auto;
}

/* pcスタイル */
@media screen and (min-width: 960px) {
  #recruit {
    padding-top: 120px;
    padding-bottom: 200px;
  }

  #recruit .inner {
    gap: 120px;
    max-width: 1520px;
  }

  #recruit .content_wrap table tr {
    display: flex;
    flex-wrap: nowrap;
  }

  #recruit .content_wrap table th {
    max-width: 262px;
  }


}

/* SPフローティングボタン */
.sp-fixed-buttons {
	display: none;
	width: 100%;
	height: 80px;
	position: fixed;
	z-index: 1;
	bottom: 0;
	/* display: grid; */
	grid-template-columns: repeat(3, 1fr);
	.button {
		background-color: #B88B22;
		color: #ffffff;
		width: 100%;
		display: flex;
		justify-content: center;
		flex-direction: column;
		border-top: 1px solid #ffffff;
		padding-top: 8px;
		&:not(:last-of-type) {
			border-right: 1px solid #ffffff;
		}
	}
	.icon-wrapper {
		width: 100%;
		display: grid;
		place-items: center;
	}
	.icon {
		width: 32px;
		margin-inline: auto;
		/*margin-bottom: 0.5rem;*/
	}
}
@media (max-width: 960px) {
	body {
		margin-bottom: 80px;
	}
	.sp-fixed-buttons {
		display: grid;
	}
}