@charset "utf-8";

/************************************
responsive
************************************/
@media screen and (min-width: 768px) {
  .sp {
    display: none !important;
  }
}

/************************************
price prefix (CMS)
************************************/
#price_sougou .price_list ul li.pair a .price_hours .price::before,
#price_sougou .price_list ul li.group a .price_hours .price::before,
#price ul li.pair a .price_hours .price::before,
#price ul li.group a .price_hours .price::before {
  content: none !important;
}

#price_sougou .price_list ul li a .price_hours .price .price-prefix,
#price ul li a .price_hours .price .price-prefix {
  position: absolute;
  display: block;
  white-space: pre-line;
  color: #626262;
  font-size: 0.3125em;
  line-height: 1.2;
  font-weight: var(--regular);
  text-align: left;
  top: 10px;
  left: 8px;
}

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

/*---------------------------------
root
---------------------------------*/
:root {
  --pc: 1.14;
  --tablet: 13.66;
  --sp: 3.9;

  --regular: 400;
  --bold: 700;

  --hover_opacity: 0.7;
  --hover_transition: 0.3s ease-in-out;

  --popup_transition: 0.5s ease-in-out;

  --bw1: #333333;
  --bw2: #5f5d5d;
  --bw3: #bebebe;
  --bw4: #e1e1e1;
  --bw5: #f4f4f4;
  --bw6: #ffffff;

  --holiday1: #004da5;
  --holiday2: #0075c1;
  --holiday3: #e50012;

  --entry: #eb6d00;

  --gym: #ff4357;
  --studio: #16b651;
  --hotstudio: #f05a7e;
  --pool: #00afec;
  --relax: #eea22f;
  --other: #0061b8;

  --review: #03b8df;
  --otameshi: #e01616;
  --master: #e7317d;
  --friend: #f7811e;
  --pair: #f7811e;
  --group: #55c31f;
  --day: #219bd0;
  --night: #004ea2;
  --super_night: #661793;
  --morning: #008f6c;
  --week_end: #007c36;
  --day2: #219bd0;
  --morning2: #008f6c;
  --under29: #009f9c;
  --under39: #0090a8;
  --start: #2b94dd;
  --spa: #846914;
  --pair-a: #f7811e;
  --pair-b: #f7a616;
  --corp: #b6816d;
  --kosodate: #00a63c;
}

/************************************
.gray
************************************/
.gray {
  background: var(--bw5);
}

@media screen and (min-width: 1366px) {
  .gray {
    padding-top: 70px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  .gray {
    padding-top: calc(70vw / var(--tablet)) !important;
  }
}

/************************************
.white
************************************/
.white {
  background: var(--bw6);
}

/************************************
body
************************************/
body {
  overflow-x: hidden;
  background: #ffffff;
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  letter-spacing: 0.02em;
}

/************************************
header
************************************/
@media screen and (min-width: 1366px) {
  header {
    position: relative;
    background: var(--bw6);
    width: 100%;
    height: 80px;
  }

  header h1 {
    position: relative;
    height: 100%;
  }

  header h1 .logo {
    display: block;
    align-content: center;
    background: rgba(81, 75, 74, 0.85);
    width: 160px;
    height: 100%;
  }

  header h1 .logo img {
    display: block;
    width: 120px;
    margin: 0 auto;
  }

  header h1 .shopname {
    position: absolute;
    color: var(--bw2);
    font-size: 18px;
    line-height: 28px;
    font-weight: var(--bold);
    text-align: left;
    top: 50%;
    left: 175px;
    transform: translateY(-50%);
  }

  header h1 .shopname span {
    font-size: 22px;
  }

  header .member {
    position: absolute;
    background: var(--bw6);
    border: 2px solid var(--bw3);
    border-radius: 5px;
    width: 120px;
    height: 40px;
    top: 50%;
    right: 300px;
    transform: translateY(-50%);
  }

  header .member.sougou {
    right: 440px;
  }

  header .member img {
    position: absolute;
    width: 20px;
    top: 50%;
    left: 7px;
    transform: translateY(-50%);
  }

  header .member p {
    position: absolute;
    color: var(--holiday2);
    font-size: 14px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    bottom: 11px;
    left: 37px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  header {
    position: relative;
    background: var(--bw6);
    width: 100%;
    height: calc(80vw / var(--tablet));
  }

  header h1 {
    position: relative;
    height: 100%;
  }

  header h1 .logo {
    display: block;
    align-content: center;
    background: rgba(81, 75, 74, 0.85);
    width: calc(160vw / var(--tablet));
    height: 100%;
  }

  header h1 .logo img {
    display: block;
    width: calc(120vw / var(--tablet));
    margin: 0 auto;
  }

  header h1 .shopname {
    position: absolute;
    color: var(--bw2);
    font-size: calc(18vw / var(--tablet));
    line-height: calc(28vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    top: 50%;
    left: calc(175vw / var(--tablet));
    transform: translateY(-50%);
  }

  header h1 .shopname span {
    font-size: calc(22vw / var(--tablet));
  }

  header .member {
    position: absolute;
    background: var(--bw6);
    border: calc(2vw / var(--tablet)) solid var(--bw3);
    border-radius: calc(5vw / var(--tablet));
    width: calc(120vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: 50%;
    right: calc(300vw / var(--tablet));
    transform: translateY(-50%);
  }

  header .member.sougou {
    right: calc(440vw / var(--tablet));
  }

  header .member img {
    position: absolute;
    width: calc(20vw / var(--tablet));
    top: 50%;
    left: calc(7vw / var(--tablet));
    transform: translateY(-50%);
  }

  header .member p {
    position: absolute;
    color: var(--holiday2);
    font-size: calc(14vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    bottom: calc(11vw / var(--tablet));
    left: calc(37vw / var(--tablet));
  }
}

@media screen and (max-width: 767px) {
  header {
    position: relative;
    background: var(--bw6);
    width: 100%;
    height: calc(68vw / var(--sp));
  }

  header h1 {
    position: relative;
    height: 100%;
  }

  header h1 .logo {
    display: block;
    align-content: center;
    background: rgba(81, 75, 74, 0.85);
    width: calc(88vw / var(--sp));
    height: 100%;
  }

  header h1 .logo img {
    display: block;
    width: calc(70vw / var(--sp));
    margin: 0 auto;
  }

  header h1 .shopname {
    position: absolute;
    color: var(--bw2);
    font-size: calc(18vw / var(--sp));
    line-height: calc(28vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    top: 50%;
    left: calc(97vw / var(--sp));
    transform: translateY(-50%);
  }

  header h1 .shopname span {
    font-size: calc(22vw / var(--sp));
  }

  header .member {
    position: absolute;
    background: var(--bw6);
    border: calc(2vw / var(--sp)) solid var(--bw3);
    border-radius: calc(6vw / var(--sp));
    width: calc(60vw / var(--sp));
    height: calc(60vw / var(--sp));
    top: 50%;
    right: calc(10vw / var(--sp));
    transform: translateY(-50%);
  }

  header .member img {
    position: absolute;
    width: calc(15vw / var(--sp));
    top: calc(6vw / var(--sp));
    left: 50%;
    transform: translateX(-50%);
  }

  header .member p {
    position: absolute;
    color: var(--holiday2);
    font-size: calc(14vw / var(--sp));
    line-height: calc(15vw / var(--sp));
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    bottom: calc(2vw / var(--sp));
  }
}

/************************************
#main
************************************/
@media screen and (min-width: 1366px) {
  #main {
    position: relative;
    background: var(--bw3);
    width: 100%;
    height: calc(581vw / var(--tablet));
    overflow: hidden;
  }

  #main video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  #main .cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  #main .morefun_logo {
    position: absolute;
    width: calc(239vw / var(--tablet));
    bottom: calc(50vw / var(--tablet));
    right: calc(60vw / var(--tablet));
    z-index: 1;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #main {
    position: relative;
    background: var(--bw3);
    width: 100%;
    height: calc(581vw / var(--tablet));
    overflow: hidden;
  }

  #main video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  #main .cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  #main .morefun_logo {
    position: absolute;
    width: calc(239vw / var(--tablet));
    bottom: calc(50vw / var(--tablet));
    right: calc(60vw / var(--tablet));
    z-index: 1;
  }
}

@media screen and (max-width: 767px) {
  #main {
    position: relative;
    background: var(--bw3);
    width: 100%;
    height: calc(488vw / var(--sp));
    overflow: hidden;
  }

  #main video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  #main .cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  #main .morefun_logo {
    position: absolute;
    width: calc(139vw / var(--sp));
    bottom: calc(20vw / var(--sp));
    right: calc(25vw / var(--sp));
    z-index: 1;
  }
}

/************************************
#menu_pc, #menu
************************************/
@media screen and (min-width: 1366px) {
  #menu_pc {
    position: absolute;
    width: 390px;
    height: 100%;
    top: 0;
    right: 440px;
    z-index: 97;
    transition: var(--hover_transition);
  }

  #menu_pc.sougou {
    right: 580px;
  }

  #menu_pc ul {
    display: flex;
    flex-wrap: wrap;
    background: var(--bw6);
    width: 100%;
    height: 100%;
  }

  #menu_pc ul li {
    flex-grow: 1;
    height: 100%;
  }

  #menu_pc ul li a {
    position: relative;
    background: var(--bw6);
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  #menu_pc ul li a:hover {
    background: rgba(0, 117, 193, 0.75);
    transition: var(--hover_transition);
  }

  #menu_pc ul li a p {
    color: var(--bw1);
    font-size: 14px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    height: 100%;
    padding-top: 25px;
    transition: var(--hover_transition);
  }

  #menu_pc ul li a:hover p {
    color: var(--bw6);
    transition: var(--hover_transition);
  }

  #menu_pc ul li a i {
    position: absolute;
    color: var(--bw1);
    font-size: 10px;
    text-align: center;
    bottom: 22px;
    left: 50%;
    transform: translateX(-50%);
    transition: var(--hover_transition);
  }

  #menu_pc ul li a:hover i {
    color: var(--bw6);
    transition: var(--hover_transition);
  }

  .fa-chevron-down:before {
    content: "\f078";
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #menu_pc {
    position: absolute;
    width: calc(390vw / var(--tablet));
    height: 100%;
    top: 0;
    right: calc(440vw / var(--tablet));
    z-index: 97;
    transition: var(--hover_transition);
  }

  #menu_pc.sougou {
    right: calc(580vw / var(--tablet));
  }

  #menu_pc ul {
    display: flex;
    flex-wrap: wrap;
    background: var(--bw6);
    width: 100%;
    height: 100%;
  }

  #menu_pc ul li {
    flex-grow: 1;
    height: 100%;
  }

  #menu_pc ul li a {
    position: relative;
    background: var(--bw6);
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  #menu_pc ul li a:hover {
    background: rgba(0, 117, 193, 0.75);
    transition: var(--hover_transition);
  }

  #menu_pc ul li a p {
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    height: 100%;
    padding-top: calc(25vw / var(--tablet));
    transition: var(--hover_transition);
  }

  #menu_pc ul li a:hover p {
    color: var(--bw6);
    transition: var(--hover_transition);
  }

  #menu_pc ul li a i {
    position: absolute;
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    text-align: center;
    bottom: calc(22vw / var(--tablet));
    left: 50%;
    transform: translateX(-50%);
    transition: var(--hover_transition);
  }

  #menu_pc ul li a:hover i {
    color: var(--bw6);
    transition: var(--hover_transition);
  }

  .fa-chevron-down:before {
    content: "\f078";
  }
}

@media screen and (max-width: 767px) {
  #menu {
    width: 100%;
    height: calc(50vw / var(--sp));
    z-index: 97;
    transition: var(--hover_transition);
  }

  #menu.fixed {
    position: fixed;
    top: 0;
  }

  #menu.none {
    opacity: 0;
    pointer-events: none;
    transition: var(--hover_transition);
  }

  #menu ul {
    display: flex;
    flex-wrap: wrap;
    background: var(--bw6);
    width: 100%;
    height: 100%;
  }

  #menu ul li {
    flex: 1;
    border-bottom: calc(1vw / var(--sp)) solid rgba(232, 232, 232, 0.9);
    height: 100%;
  }

  #menu ul li a {
    position: relative;
    background: var(--bw6);
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  #menu ul li a:hover {
    background: rgba(0, 117, 193, 0.75);
    transition: var(--hover_transition);
  }

  #menu ul li a p {
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    height: 100%;
    padding-top: calc(10vw / var(--sp));
    transition: var(--hover_transition);
  }

  #menu ul li a:hover p {
    color: var(--bw6);
    transition: var(--hover_transition);
  }

  #menu ul li a p span {
    font-size: calc(12vw / var(--sp));
  }

  #menu ul li a i {
    position: absolute;
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    text-align: center;
    bottom: calc(7vw / var(--sp));
    left: 50%;
    transform: translateX(-50%);
    transition: var(--hover_transition);
  }

  #menu ul li a:hover i {
    color: var(--bw6);
    transition: var(--hover_transition);
  }

  .fa-chevron-down:before {
    content: "\f078";
  }
}

/************************************
#banner
************************************/
@media screen and (min-width: 1366px) {
  #banner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 1200px;
    margin: 0 auto 60px;
  }

  #banner .campaign {
    width: 600px;
    height: 314px;
  }

  #banner .campaign a {
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  #banner .campaign a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #banner .campaign a img {
    width: 100%;
  }

  #banner ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 30px;
    width: 552px;
  }

  #banner ul li {
    overflow: hidden;
    width: 164px;
    height: 123px;
  }

  #banner ul li a {
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  #banner ul li a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #banner ul li a img {
    width: 100%;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #banner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: calc(1200vw / var(--tablet));
    margin: 0 auto calc(60vw / var(--tablet));
  }

  #banner .campaign {
    width: calc(600vw / var(--tablet));
    height: calc(314vw / var(--tablet));
  }

  #banner .campaign a {
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  #banner .campaign a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #banner .campaign a img {
    width: 100%;
  }

  #banner ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: calc(30vw / var(--tablet));
    width: calc(552vw / var(--tablet));
  }

  #banner ul li {
    overflow: hidden;
    width: calc(164vw / var(--tablet));
    height: calc(123vw / var(--tablet));
  }

  #banner ul li a {
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  #banner ul li a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #banner ul li a img {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  #banner {
    width: calc(340vw / var(--sp));
    padding-top: calc(35vw / var(--sp));
    margin: 0 auto calc(25vw / var(--sp));
  }

  #banner .campaign {
    width: 100%;
    height: calc(255vw / var(--sp));
    margin: 0 auto calc(25vw / var(--sp));
  }

  #banner .campaign a {
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  #banner .campaign a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #banner .campaign a img {
    width: 100%;
  }

  #banner ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: calc(12vw / var(--sp));
    width: 100%;
  }

  #banner ul li {
    overflow: hidden;
    width: calc(164vw / var(--sp));
    height: calc(123vw / var(--sp));
  }

  #banner ul li a {
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  #banner ul li a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #banner ul li a img {
    width: 100%;
  }
}

/************************************
#info
************************************/
@media screen and (min-width: 1366px) {
  #info {
    width: 960px;
    margin: 0 auto;
  }

  #info .title {
    width: 100%;
    margin-bottom: 10px;
  }

  #info .title h2 {
    color: var(--holiday2);
    font-size: 34px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 10px;
  }

  #info .title p.en {
    font-family: "Barlow", sans-serif;
    font-style: normal;
    color: var(--bw2);
    font-size: 12px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
  }

  #info ul {
    display: flex;
    flex-direction: column;
    width: 100%;
  }

  #info ul li {
    border-bottom: 1px solid var(--bw3);
    width: 100%;
    padding: 20px 0;
  }

  #info ul li a {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  #info ul li a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #info ul li a .thumbnail {
    width: 120px;
  }

  #info ul li a .text {
    width: 820px;
  }

  #info ul li a p.date {
    position: relative;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    color: var(--bw1);
    font-size: 14px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    margin-bottom: 5px;
  }

  #info ul li.new a p.date::after {
    position: absolute;
    display: block;
    content: "";
    background: #f60000;
    border-radius: calc(13px / 2);
    width: 13px;
    height: 13px;
    top: 50%;
    left: 75px;
    transform: translateY(-50%);
  }

  #info ul li a h3 {
    color: var(--bw1);
    font-size: 20px;
    line-height: 26px;
    font-weight: var(--bold);
    text-align: left;
    margin-bottom: 5px;
  }

  #info ul li a p.content {
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: justify;
    text-decoration: underline;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #info {
    width: calc(960vw / var(--tablet));
    margin: 0 auto;
  }

  #info .title {
    width: 100%;
    margin-bottom: calc(10vw / var(--tablet));
  }

  #info .title h2 {
    color: var(--holiday2);
    font-size: calc(34vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(10vw / var(--tablet));
  }

  #info .title p.en {
    font-family: "Barlow", sans-serif;
    font-style: normal;
    color: var(--bw2);
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
  }

  #info ul {
    display: flex;
    flex-direction: column;
    width: 100%;
  }

  #info ul li {
    border-bottom: calc(1vw / var(--tablet)) solid var(--bw3);
    width: 100%;
    padding: calc(20vw / var(--tablet)) 0;
  }

  #info ul li a {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  #info ul li a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #info ul li a .thumbnail {
    width: calc(120vw / var(--tablet));
  }

  #info ul li a .text {
    width: calc(820vw / var(--tablet));
  }

  #info ul li a p.date {
    position: relative;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    margin-bottom: calc(5vw / var(--tablet));
  }

  #info ul li.new a p.date::after {
    position: absolute;
    display: block;
    content: "";
    background: #f60000;
    border-radius: calc((13vw / 2) / var(--tablet));
    width: calc(13vw / var(--tablet));
    height: calc(13vw / var(--tablet));
    top: 50%;
    left: calc(75vw / var(--tablet));
    transform: translateY(-50%);
  }

  #info ul li a h3 {
    color: var(--bw1);
    font-size: calc(20vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    margin-bottom: calc(5vw / var(--tablet));
  }

  #info ul li a p.content {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: justify;
    text-decoration: underline;
  }
}

@media screen and (max-width: 767px) {
  #info {
    width: calc(340vw / var(--sp));
    margin: 0 auto;
  }

  #info .title {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 0 calc(10vw / var(--sp));
    box-sizing: border-box;
    width: 100%;
    height: calc(26vw / var(--sp));
    padding-left: calc(20vw / var(--sp));
    margin-bottom: calc(3vw / var(--sp));
  }

  #info .title::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--holiday2);
    width: calc(7vw / var(--sp));
    height: 100%;
    left: 0;
  }

  #info .title h2 {
    color: var(--holiday2);
    font-size: calc(22vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
  }

  #info .title p.en {
    font-family: "Barlow", sans-serif;
    font-style: normal;
    color: var(--bw2);
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    padding-top: calc(11vw / var(--sp));
  }

  #info ul {
    display: flex;
    flex-direction: column;
    width: 100%;
  }

  #info ul li {
    border-bottom: calc(1vw / var(--sp)) solid var(--bw3);
    width: 100%;
    padding: calc(13vw / var(--sp)) 0 calc(20vw / var(--sp));
  }

  #info ul li a {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  #info ul li a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #info ul li a .thumbnail {
    width: calc(80vw / var(--sp));
  }

  #info ul li a .text {
    width: calc(246vw / var(--sp));
  }

  #info ul li a p.date {
    position: relative;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    margin-bottom: calc(5vw / var(--sp));
  }

  #info ul li.new a p.date::after {
    position: absolute;
    display: block;
    content: "";
    background: #f60000;
    border-radius: calc((13vw / 2) / var(--sp));
    width: calc(13vw / var(--sp));
    height: calc(13vw / var(--sp));
    top: 50%;
    left: calc(75vw / var(--sp));
    transform: translateY(-50%);
  }

  #info ul li a h3 {
    color: var(--bw1);
    font-size: calc(20vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    margin-bottom: calc(5vw / var(--sp));
  }

  #info ul li a p.content {
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    line-height: calc(20vw / var(--sp));
    font-weight: var(--regular);
    text-align: justify;
    text-decoration: underline;
  }
}

/************************************
#about
************************************/
@media screen and (min-width: 1366px) {
  #about {
    position: relative;
    box-sizing: unset;
    width: 100%;
    height: 480px;
    padding: 70px 0 50px;
  }

  #about .swiper {
    position: relative;
    width: 100%;
  }

  #about .swiper::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(
      to left,
      var(--bw5) 0%,
      var(--bw5) 83px,
      transparent 100%
    );
    width: 143px;
    height: 100%;
    top: 0;
    right: 0;
    z-index: 1;
  }

  #about .swiper ul {
    overflow-x: scroll;
    overflow-y: hidden;
    -ms-overflow-style: none;
    scrollbar-width: none;
    display: flex;
    gap: 0 20px;
    box-sizing: border-box;
    width: 100%;
    padding: 0 calc((100% - 1200px) / 2);
  }

  #about .swiper ul::-webkit-scrollbar {
    display: none;
  }

  #about .swiper ul li {
    position: sticky;
    display: block;
    min-width: 244px;
    width: 244px;
    height: 420px;
  }

  #about .swiper ul li:nth-child(1) {
    left: 0;
    z-index: 100;
  }

  #about .swiper ul li:nth-child(2) {
    left: calc(20px * 1);
    z-index: 99;
  }

  #about .swiper ul li:nth-child(3) {
    left: calc(20px * 2);
    z-index: 98;
  }

  #about .swiper ul li:nth-child(4) {
    left: calc(20px * 3);
    z-index: 97;
  }

  #about .swiper ul li:nth-child(5) {
    left: calc(20px * 4);
    z-index: 96;
  }

  #about .swiper ul li:nth-child(6) {
    left: calc(20px * 5);
    z-index: 95;
  }

  #about .swiper ul li:nth-child(7) {
    left: calc(20px * 6);
    z-index: 94;
  }

  #about .swiper ul li:nth-child(8) {
    left: calc(20px * 7);
    z-index: 93;
  }

  #about .swiper ul li:nth-child(9) {
    left: calc(20px * 8);
    z-index: 92;
  }

  #about .swiper ul li:nth-child(10) {
    left: calc(20px * 9);
    z-index: 91;
  }

  #about .swiper ul li img {
    width: 100%;
    height: 100%;
  }

  #about .kokogaii_btn {
    position: absolute;
    bottom: 50px;
    left: calc(50% - 158px);
  }

  #about .kokogaii_btn ul {
    display: inline-flex;
    gap: 0 16px;
    box-sizing: border-box;
    background: var(--bw6);
    border: 2px solid #808080;
    border-radius: calc(38px / 2);
    padding: 14px 18px;
    margin: 0 auto;
  }

  #about .kokogaii_btn ul li {
    display: block;
    background: var(--bw3);
    border-radius: calc(9px / 2);
    width: 9px;
    height: 9px;
    transition: var(--hover_transition);
  }

  #about .kokogaii_btn ul li.active,
  #about .kokogaii_btn ul li:hover {
    background: var(--holiday2);
    transition: var(--hover_transition);
  }

  #about .swiper_pause {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: 2px solid var(--bw2);
    border-radius: calc(38px / 2);
    width: 38px;
    height: 38px;
    bottom: 50px;
    left: calc(50% + 154px);
  }

  #about .swiper_pause i {
    position: absolute;
    color: var(--bw2);
    font-size: 17px;
    text-align: left;
    top: 50%;
    left: 12px;
    transform: translateY(-50%);
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #about {
    position: relative;
    box-sizing: unset;
    width: 100%;
    height: calc(480vw / var(--tablet));
    padding: calc(70vw / var(--tablet)) 0 calc(50vw / var(--tablet));
  }

  #about .swiper {
    position: relative;
    width: 100%;
  }

  #about .swiper::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(
      to left,
      var(--bw5) 0%,
      var(--bw5) calc(83vw / var(--tablet)),
      transparent 100%
    );
    width: calc(143vw / var(--tablet));
    height: 100%;
    top: 0;
    right: 0;
    z-index: 1;
  }

  #about .swiper ul {
    overflow-x: scroll;
    overflow-y: hidden;
    -ms-overflow-style: none;
    scrollbar-width: none;
    display: flex;
    gap: 0 calc(20vw / var(--tablet));
    box-sizing: border-box;
    width: 100%;
    padding: 0 calc((100% - (1200vw / var(--tablet))) / 2);
  }

  #about .swiper ul::-webkit-scrollbar {
    display: none;
  }

  #about .swiper ul li {
    position: sticky;
    display: block;
    min-width: calc(244vw / var(--tablet));
    width: calc(244vw / var(--tablet));
    height: calc(420vw / var(--tablet));
  }

  #about .swiper ul li:nth-child(1) {
    left: 0;
    z-index: 100;
  }

  #about .swiper ul li:nth-child(2) {
    left: calc((20vw / var(--tablet)) * 1);
    z-index: 99;
  }

  #about .swiper ul li:nth-child(3) {
    left: calc((20vw / var(--tablet)) * 2);
    z-index: 98;
  }

  #about .swiper ul li:nth-child(4) {
    left: calc((20vw / var(--tablet)) * 3);
    z-index: 97;
  }

  #about .swiper ul li:nth-child(5) {
    left: calc((20vw / var(--tablet)) * 4);
    z-index: 96;
  }

  #about .swiper ul li:nth-child(6) {
    left: calc((20vw / var(--tablet)) * 5);
    z-index: 95;
  }

  #about .swiper ul li:nth-child(7) {
    left: calc((20vw / var(--tablet)) * 6);
    z-index: 94;
  }

  #about .swiper ul li:nth-child(8) {
    left: calc((20vw / var(--tablet)) * 7);
    z-index: 93;
  }

  #about .swiper ul li:nth-child(9) {
    left: calc((20vw / var(--tablet)) * 8);
    z-index: 92;
  }

  #about .swiper ul li:nth-child(10) {
    left: calc((20vw / var(--tablet)) * 9);
    z-index: 91;
  }

  #about .swiper ul li img {
    width: 100%;
    height: 100%;
  }

  #about .kokogaii_btn {
    position: absolute;
    bottom: calc(50vw / var(--tablet));
    left: calc(50% - (158vw / var(--tablet)));
  }

  #about .kokogaii_btn ul {
    display: inline-flex;
    gap: 0 calc(16vw / var(--tablet));
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(2vw / var(--tablet)) solid #808080;
    border-radius: calc((38vw / 2) / var(--tablet));
    padding: calc(14vw / var(--tablet)) calc(18vw / var(--tablet));
    margin: 0 auto;
  }

  #about .kokogaii_btn ul li {
    display: block;
    background: var(--bw3);
    border-radius: calc((9vw / 2) / var(--tablet));
    width: calc(9vw / var(--tablet));
    height: calc(9vw / var(--tablet));
    transition: var(--hover_transition);
  }

  #about .kokogaii_btn ul li.active,
  #about .kokogaii_btn ul li:hover {
    background: var(--holiday2);
    transition: var(--hover_transition);
  }

  #about .swiper_pause {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(2vw / var(--tablet)) solid var(--bw2);
    border-radius: calc((38vw / 2) / var(--tablet));
    width: calc(38vw / var(--tablet));
    height: calc(38vw / var(--tablet));
    bottom: calc(50vw / var(--tablet));
    left: calc(50% + (154vw / var(--tablet)));
  }

  #about .swiper_pause i {
    position: absolute;
    color: var(--bw2);
    font-size: calc(17vw / var(--tablet));
    text-align: left;
    top: 50%;
    left: calc(12vw / var(--tablet));
    transform: translateY(-50%);
  }
}

@media screen and (max-width: 767px) {
  #about {
    position: relative;
    width: 100%;
    padding: calc(30vw / var(--sp)) calc(25vw / var(--sp))
      calc(45vw / var(--sp));
  }

  #about .swiper {
    position: relative;
    width: 100%;
    padding-bottom: calc(48vw / var(--sp));
  }

  #about .swiper ul {
    width: 100%;
    height: calc(584vw / var(--sp));
  }

  #about .swiper ul li {
    overflow: hidden;
    width: 100%;
    height: 100%;
  }

  #about .swiper ul li img {
    width: 100%;
    height: 100%;
  }

  #about .swiper .swiper-pagination {
    position: absolute;
    display: flex;
    align-items: center;
    background: var(--bw6);
    border: calc(2vw / var(--sp)) solid #949494;
    border-radius: calc(((14vw * 2) + 9vw) / var(--sp) / 2);
    width: auto;
    height: calc(38vw / var(--sp));
    padding: 0 calc(19vw / var(--sp));
    bottom: 0;
    left: calc(13vw / var(--sp));
  }

  #about .swiper .swiper-pagination .swiper-pagination-bullet {
    background: var(--bw3);
    border-radius: calc(9vw / var(--sp) / 2);
    width: calc(9vw / var(--sp));
    height: calc(9vw / var(--sp));
    opacity: 1;
    transition: var(--hover_transition);
  }

  #about .swiper .swiper-pagination .swiper-pagination-bullet:hover,
  #about
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--holiday2);
    transition: var(--hover_transition);
  }

  #about .swiper_pause {
    position: absolute;
    background: var(--bw6);
    border: calc(2vw / var(--sp)) solid var(--bw2);
    border-radius: calc(38vw / var(--sp) / 2);
    width: calc(38vw / var(--sp));
    height: calc(38vw / var(--sp));
    bottom: calc(45vw / var(--sp));
    right: calc(36vw / var(--sp));
    z-index: 1;
  }

  #about .swiper_pause:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #about .swiper_pause i {
    position: absolute;
    color: var(--bw2);
    font-size: calc(17vw / var(--sp));
    text-align: left;
    top: 50%;
    left: calc(12vw / var(--sp));
    transform: translateY(-50%);
  }

  #about .swiper_pause i.fa-play:before {
    content: "\f04b";
  }

  #about .swiper_pause i.fa-pause:before {
    content: "\f04c";
  }
}

/************************************
#facility
************************************/
@media screen and (min-width: 1366px) {
  #facility {
    width: 100%;
    padding: 60px 0;
  }

  #facility.sougou {
    padding-bottom: 0;
  }

  #facility > h2 {
    color: var(--bw1);
    font-size: 34px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 20px;
  }

  #facility .menu {
    display: flex;
    flex-wrap: wrap;
    width: 1000px;
    height: 70px;
    margin: 0 auto 20px;
  }

  #facility .menu li {
    flex-grow: 1;
    box-sizing: border-box;
    border-bottom: 6px solid transparent;
    height: 100%;
    transition: var(--hover_transition);
  }

  #facility .menu li.gym:hover {
    border-bottom: 6px solid var(--gym);
    transition: var(--hover_transition);
  }

  #facility .menu li.studio:hover {
    border-bottom: 6px solid var(--studio);
    transition: var(--hover_transition);
  }

  #facility .menu li.hotstudio:hover {
    border-bottom: 6px solid var(--hotstudio);
    transition: var(--hover_transition);
  }

  #facility .menu li.pool:hover {
    border-bottom: 6px solid var(--pool);
    transition: var(--hover_transition);
  }

  #facility .menu li.relax:hover {
    border-bottom: 6px solid var(--relax);
    transition: var(--hover_transition);
  }

  #facility .menu li a {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
  }

  #facility .menu li img {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  #facility .menu li.gym img {
    width: 30px;
    top: 3px;
  }

  #facility .menu li.studio img {
    width: 37px;
    top: 5px;
  }

  #facility .menu li.hotstudio img {
    width: 27px;
    top: 7px;
  }

  #facility .menu li.pool img {
    width: 29px;
    top: 7px;
  }

  #facility .menu li.relax img {
    width: 45px;
    top: 5px;
  }

  #facility .menu li a p {
    position: absolute;
    color: var(--bw1);
    font-size: 11px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    bottom: 14px;
    left: 0;
  }

  #facility .attention {
    color: var(--bw1);
    font-size: 10px;
    line-height: 16px;
    font-weight: var(--regular);
    text-align: justify;
    width: 1200px;
    margin: 0 auto;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #facility {
    width: 100%;
    padding: calc(60vw / var(--tablet)) 0;
  }

  #facility.sougou {
    padding-bottom: 0;
  }

  #facility > h2 {
    color: var(--bw1);
    font-size: calc(34vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(20vw / var(--tablet));
  }

  #facility .menu {
    display: flex;
    flex-wrap: wrap;
    width: calc(1000vw / var(--tablet));
    height: calc(70vw / var(--tablet));
    margin: 0 auto calc(20vw / var(--tablet));
  }

  #facility .menu li {
    flex-grow: 1;
    box-sizing: border-box;
    border-bottom: calc(6vw / var(--tablet)) solid transparent;
    height: 100%;
    transition: var(--hover_transition);
  }

  #facility .menu li.gym:hover {
    border-bottom: calc(6vw / var(--tablet)) solid var(--gym);
    transition: var(--hover_transition);
  }

  #facility .menu li.studio:hover {
    border-bottom: calc(6vw / var(--tablet)) solid var(--studio);
    transition: var(--hover_transition);
  }

  #facility .menu li.hotstudio:hover {
    border-bottom: calc(6vw / var(--tablet)) solid var(--hotstudio);
    transition: var(--hover_transition);
  }

  #facility .menu li.pool:hover {
    border-bottom: calc(6vw / var(--tablet)) solid var(--pool);
    transition: var(--hover_transition);
  }

  #facility .menu li.relax:hover {
    border-bottom: calc(6vw / var(--tablet)) solid var(--relax);
    transition: var(--hover_transition);
  }

  #facility .menu li a {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
  }

  #facility .menu li img {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  #facility .menu li.gym img {
    width: calc(30vw / var(--tablet));
    top: calc(3vw / var(--tablet));
  }

  #facility .menu li.studio img {
    width: calc(37vw / var(--tablet));
    top: calc(5vw / var(--tablet));
  }

  #facility .menu li.hotstudio img {
    width: calc(27vw / var(--tablet));
    top: calc(7vw / var(--tablet));
  }

  #facility .menu li.pool img {
    width: calc(29vw / var(--tablet));
    top: calc(7vw / var(--tablet));
  }

  #facility .menu li.relax img {
    width: calc(45vw / var(--tablet));
    top: calc(5vw / var(--tablet));
  }

  #facility .menu li a p {
    position: absolute;
    color: var(--bw1);
    font-size: calc(11vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    bottom: calc(14vw / var(--tablet));
    left: 0;
  }

  #facility .attention {
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    line-height: calc(16vw / var(--tablet));
    font-weight: var(--regular);
    text-align: justify;
    width: calc(1200vw / var(--tablet));
    margin: 0 auto;
  }
}

@media screen and (max-width: 767px) {
  #facility {
    width: 100%;
    padding-top: calc(40vw / var(--sp));
  }

  #facility > h2 {
    color: var(--bw1);
    font-size: calc(34vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(20vw / var(--sp));
  }

  #facility .menu {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: calc(70vw / var(--sp));
  }

  #facility .menu li {
    flex-grow: 1;
    box-sizing: border-box;
    border-bottom: calc(6vw / var(--sp)) solid transparent;
    height: 100%;
    transition: var(--hover_transition);
  }

  #facility .menu li.gym:hover {
    border-bottom: calc(6vw / var(--sp)) solid var(--gym);
    transition: var(--hover_transition);
  }

  #facility .menu li.studio:hover {
    border-bottom: calc(6vw / var(--sp)) solid var(--studio);
    transition: var(--hover_transition);
  }

  #facility .menu li.hotstudio:hover {
    border-bottom: calc(6vw / var(--sp)) solid var(--hotstudio);
    transition: var(--hover_transition);
  }

  #facility .menu li.pool:hover {
    border-bottom: calc(6vw / var(--sp)) solid var(--pool);
    transition: var(--hover_transition);
  }

  #facility .menu li.relax:hover {
    border-bottom: calc(6vw / var(--sp)) solid var(--relax);
    transition: var(--hover_transition);
  }

  #facility .menu li a {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
  }

  #facility .menu li img {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  #facility .menu li.gym img {
    width: calc(30vw / var(--sp));
    top: calc(3vw / var(--sp));
  }

  #facility .menu li.studio img {
    width: calc(37vw / var(--sp));
    top: calc(5vw / var(--sp));
  }

  #facility .menu li.hotstudio img {
    width: calc(27vw / var(--sp));
    top: calc(7vw / var(--sp));
  }

  #facility .menu li.pool img {
    width: calc(29vw / var(--sp));
    top: calc(7vw / var(--sp));
  }

  #facility .menu li.relax img {
    width: calc(45vw / var(--sp));
    top: calc(5vw / var(--sp));
  }

  #facility .menu li a p {
    position: absolute;
    color: var(--bw1);
    font-size: calc(11vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    bottom: calc(14vw / var(--sp));
    left: 0;
  }

  #facility .attention {
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    line-height: calc(16vw / var(--sp));
    font-weight: var(--regular);
    text-align: justify;
    padding: calc(10vw / var(--sp)) calc(20vw / var(--sp));
    background: var(--bw5);
  }
  .sougou#facility .attention {
    background: var(--bw6);
  }
}

/************************************
.facility_main
************************************/
@media screen and (min-width: 1366px) {
  .facility_main {
    position: relative;
    box-sizing: border-box;
    width: 1200px;
    height: 600px;
    padding: 55px 50px 0;
    margin: 0 auto 20px;
  }

  .facility_main:last-child {
    margin-bottom: 0;
  }

  .facility_main#gym {
    background-size: 100% 100%;
  }

  .facility_main#studio {
    background-size: 100% 100%;
  }

  .facility_main#hotstudio {
    background-size: 100% 100%;
  }

  .facility_main#pool {
    background-size: 100% 100%;
  }

  .facility_main#relax {
    background-size: 100% 100%;
  }

  .facility_main::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(
      to top,
      rgba(0, 0, 0, 0.25) 0%,
      rgba(0, 0, 0, 0) 100%
    );
    width: 100%;
    height: 244px;
    bottom: 0;
    left: 0;
    z-index: 0;
  }

  .facility_main h3 {
    color: var(--bw2);
    font-size: 28px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    margin-bottom: 15px;
  }

  .facility_main h3 span {
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: 56px;
    line-height: 1.1em;
  }

  .facility_main#gym h3 span {
    color: var(--gym);
  }

  .facility_main#studio h3 span {
    color: var(--studio);
  }

  .facility_main#hotstudio h3 span {
    color: var(--hotstudio);
  }

  .facility_main#pool h3 span {
    color: var(--pool);
  }

  .facility_main#relax h3 span {
    color: var(--relax);
  }

  .facility_main .about {
    color: var(--bw2);
    font-size: 18px;
    line-height: 28px;
    font-weight: var(--bold);
    text-align: left;
  }

  .facility_main#gym .wifi {
    position: absolute;
    width: 45px;
    top: 55px;
    right: 50px;
  }

  .facility_main .button {
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 620px;
    height: 48px;
    bottom: 100px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
  }

  .facility_main .button.button_sougou {
    bottom: 30px;
  }

  .facility_main#gym .button,
  .facility_main#pool .button {
    justify-content: space-between;
  }

  .facility_main#relax .button {
    bottom: 30px;
  }

  .facility_main .button li {
    background: rgba(255, 255, 255, 0.9);
    border-radius: calc(48px / 2);
    width: 300px;
    height: 100%;
  }

  .facility_main .button li.point {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    line-height: 18px;
    font-weight: var(--bold);
    text-align: center;
    width: 300px;
    height: 100%;
    transition: var(--hover_transition);
  }

  .facility_main .button li.point:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_main#gym .button li.point {
    color: var(--gym);
  }

  .facility_main#studio .button li.point {
    color: var(--studio);
  }

  .facility_main#hotstudio .button li.point {
    color: var(--hotstudio);
  }

  .facility_main#pool .button li.point {
    color: var(--pool);
  }

  .facility_main#relax .button li.point {
    color: var(--relax);
  }

  .facility_main .button li.point i {
    position: absolute;
    font-size: 22px;
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: 13px;
    transform: translateY(-50%);
  }

  .facility_main#gym .button li.point i {
    color: var(--gym);
  }

  .facility_main#studio .button li.point i {
    color: var(--studio);
  }

  .facility_main#hotstudio .button li.point i {
    color: var(--hotstudio);
  }

  .facility_main#pool .button li.point i {
    color: var(--pool);
  }

  .facility_main#relax .button li.point i {
    color: var(--relax);
  }

  .facility_main .button li.more {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    font-size: 16px;
    line-height: 18px;
    font-weight: var(--bold);
    text-align: center;
    width: 300px;
    height: 100%;
  }

  .facility_main#gym .button li.more {
    flex-direction: column;
    padding: 0;
  }

  .facility_main .button li.more:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
    cursor: pointer;
  }

  .facility_main#gym .button li.more.machine_sougou {
    color: var(--gym);
    font-size: 14px;
    line-height: 17px;
  }

  .facility_main#gym .button li.more.machine_shops p {
    align-items: baseline;
    color: var(--gym);
    width: 100%;
  }

  .facility_main#gym .button li.more.machine_shops p span {
    font-size: 1.5em;
  }

  .facility_main#pool .button li.more.effect {
    color: var(--pool);
    font-size: calc(16px * 0.96);
  }

  .facility_main .button li.point:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_main .more i {
    position: absolute;
    font-size: 22px;
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: 13px;
    transform: translateY(-50%);
  }

  .facility_main#gym .more i {
    color: var(--gym);
  }

  .facility_main#pool .more i {
    color: var(--pool);
  }

  .facility_main .button.button_shops,
  .facility_main#relax .button {
    justify-content: center;
  }

  .facility_main .pdf {
    position: absolute;
    width: 300px;
    height: 48px;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
  }

  .facility_main .pdf a {
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(255, 255, 255, 0.9);
    color: var(--bw2);
    font-size: 16px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc(48px / 2);
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  .facility_main .pdf a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_main .pdf img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }

  .facility_main .pdf img.icon_pdf {
    width: 20px;
    left: 17px;
  }

  .facility_main .pdf img.icon_schedule {
    width: 22px;
    left: 21px;
  }

  .facility_main .pdf a i {
    position: absolute;
    font-size: 22px;
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: 13px;
    transform: translateY(-50%);
  }

  .facility_main#gym .pdf a i {
    color: var(--gym);
  }

  .facility_main#studio .pdf a i {
    color: var(--studio);
  }

  .facility_main#hotstudio .pdf a i {
    color: var(--hotstudio);
  }

  .facility_main#pool .pdf a i {
    color: var(--pool);
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  .facility_main {
    position: relative;
    box-sizing: border-box;
    width: calc(1200vw / var(--tablet));
    height: calc(600vw / var(--tablet));
    padding: calc(55vw / var(--tablet)) calc(50vw / var(--tablet)) 0;
    margin: 0 auto calc(20vw / var(--tablet));
  }

  .facility_main:last-child {
    margin-bottom: 0;
  }

  .facility_main#gym {
    background-size: 100% 100%;
  }

  .facility_main#studio {
    background-size: 100% 100%;
  }

  .facility_main#hotstudio {
    background-size: 100% 100%;
  }

  .facility_main#pool {
    background-size: 100% 100%;
  }

  .facility_main#relax {
    background-size: 100% 100%;
  }

  .facility_main::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(
      to top,
      rgba(0, 0, 0, 0.25) 0%,
      rgba(0, 0, 0, 0) 100%
    );
    width: 100%;
    height: calc(244vw / var(--tablet));
    bottom: 0;
    left: 0;
    z-index: 0;
  }

  .facility_main h3 {
    color: var(--bw2);
    font-size: calc(28vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    margin-bottom: calc(15vw / var(--tablet));
  }

  .facility_main h3 span {
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: calc(56vw / var(--tablet));
    line-height: 1.1em;
  }

  .facility_main#gym h3 span {
    color: var(--gym);
  }

  .facility_main#studio h3 span {
    color: var(--studio);
  }

  .facility_main#hotstudio h3 span {
    color: var(--hotstudio);
  }

  .facility_main#pool h3 span {
    color: var(--pool);
  }

  .facility_main#relax h3 span {
    color: var(--relax);
  }

  .facility_main .about {
    color: var(--bw2);
    font-size: calc(18vw / var(--tablet));
    line-height: calc(28vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
  }

  .facility_main#gym .wifi {
    position: absolute;
    width: calc(45vw / var(--tablet));
    top: calc(55vw / var(--tablet));
    right: calc(50vw / var(--tablet));
  }

  .facility_main .button {
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: calc(620vw / var(--tablet));
    height: calc(48vw / var(--tablet));
    bottom: calc(100vw / var(--tablet));
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
  }

  .facility_main .button.button_sougou {
    bottom: calc(30vw / var(--tablet));
  }

  .facility_main#gym .button,
  .facility_main#pool .button {
    justify-content: space-between;
  }

  .facility_main#relax .button {
    bottom: calc(30vw / var(--tablet));
  }

  .facility_main .button li {
    background: rgba(255, 255, 255, 0.9);
    border-radius: calc((48vw / 2) / var(--tablet));
    width: calc(300vw / var(--tablet));
    height: 100%;
  }

  .facility_main .button li.point {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: calc(16vw / var(--tablet));
    line-height: calc(18vw / var(--tablet));
    font-weight: var(--bold);
    text-align: center;
    width: calc(300vw / var(--tablet));
    height: 100%;
    transition: var(--hover_transition);
  }

  .facility_main .button li.point:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_main#gym .button li.point {
    color: var(--gym);
  }

  .facility_main#studio .button li.point {
    color: var(--studio);
  }

  .facility_main#hotstudio .button li.point {
    color: var(--hotstudio);
  }

  .facility_main#pool .button li.point {
    color: var(--pool);
  }

  .facility_main#relax .button li.point {
    color: var(--relax);
  }

  .facility_main .button li.point i {
    position: absolute;
    font-size: calc(22vw / var(--tablet));
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: calc(13vw / var(--tablet));
    transform: translateY(-50%);
  }

  .facility_main#gym .button li.point i {
    color: var(--gym);
  }

  .facility_main#studio .button li.point i {
    color: var(--studio);
  }

  .facility_main#hotstudio .button li.point i {
    color: var(--hotstudio);
  }

  .facility_main#pool .button li.point i {
    color: var(--pool);
  }

  .facility_main#relax .button li.point i {
    color: var(--relax);
  }

  .facility_main .button li.more {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    font-size: calc(16vw / var(--tablet));
    line-height: calc(18vw / var(--tablet));
    font-weight: var(--bold);
    text-align: center;
    width: calc(300vw / var(--tablet));
    height: 100%;
  }

  .facility_main#gym .button li.more {
    flex-direction: column;
    padding: 0;
  }

  .facility_main .button li.more:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
    cursor: pointer;
  }

  .facility_main#gym .button li.more.machine_sougou {
    color: var(--gym);
    font-size: calc(14vw / var(--tablet));
    line-height: calc(17vw / var(--tablet));
  }

  .facility_main#gym .button li.more.machine_shops p {
    align-items: baseline;
    color: var(--gym);
    width: 100%;
  }

  .facility_main#gym .button li.more.machine_shops p span {
    font-size: 1.5em;
  }

  .facility_main#pool .button li.more.effect {
    color: var(--pool);
    font-size: calc((16vw * 0.96) / var(--tablet));
  }

  .facility_main .button li.point:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_main .more i {
    position: absolute;
    font-size: calc(22vw / var(--tablet));
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: calc(13vw / var(--tablet));
    transform: translateY(-50%);
  }

  .facility_main#gym .more i {
    color: var(--gym);
  }

  .facility_main#pool .more i {
    color: var(--pool);
  }

  .facility_main .button.button_shops,
  .facility_main#relax .button {
    justify-content: center;
  }

  .facility_main .pdf {
    position: absolute;
    width: calc(300vw / var(--tablet));
    height: calc(48vw / var(--tablet));
    bottom: calc(30vw / var(--tablet));
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
  }

  .facility_main .pdf a {
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(255, 255, 255, 0.9);
    color: var(--bw2);
    font-size: calc(16vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((48vw / 2) / var(--tablet));
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  .facility_main .pdf a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_main .pdf img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }

  .facility_main .pdf img.icon_pdf {
    width: calc(20vw / var(--tablet));
    left: calc(17vw / var(--tablet));
  }

  .facility_main .pdf img.icon_schedule {
    width: calc(22vw / var(--tablet));
    left: calc(21vw / var(--tablet));
  }

  .facility_main .pdf a i {
    position: absolute;
    font-size: calc(22vw / var(--tablet));
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: calc(13vw / var(--tablet));
    transform: translateY(-50%);
  }

  .facility_main#gym .pdf a i {
    color: var(--gym);
  }

  .facility_main#studio .pdf a i {
    color: var(--studio);
  }

  .facility_main#hotstudio .pdf a i {
    color: var(--hotstudio);
  }

  .facility_main#pool .pdf a i {
    color: var(--pool);
  }
}

@media screen and (max-width: 767px) {
  .facility_main {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: calc(630vw / var(--sp));
    padding: calc(30vw / var(--sp)) calc(25vw / var(--sp)) 0;
  }

  .facility_main#gym {
    background-size: 100% 100%;
  }

  .facility_main#studio {
    background-size: 100% 100%;
  }

  .facility_main#hotstudio {
    background-size: 100% 100%;
  }

  .facility_main#pool {
    background-size: 100% 100%;
  }

  .facility_main#relax {
    background-size: 100% 100%;
  }

  .facility_main::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(
      to top,
      rgba(0, 0, 0, 0.25) 0%,
      rgba(0, 0, 0, 0) 100%
    );
    width: 100%;
    height: calc(244vw / var(--sp));
    bottom: 0;
    left: 0;
    z-index: 0;
  }

  .facility_main h3 {
    color: var(--bw2);
    font-size: calc(28vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    margin-bottom: calc(10vw / var(--sp));
  }

  .facility_main h3 span {
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: calc(56vw / var(--sp));
    line-height: 1.1em;
  }

  .facility_main#gym h3 span {
    color: var(--gym);
  }

  .facility_main#studio h3 span {
    color: var(--studio);
  }

  .facility_main#hotstudio h3 span {
    color: var(--hotstudio);
  }

  .facility_main#pool h3 span {
    color: var(--pool);
  }

  .facility_main#relax h3 span {
    color: var(--relax);
  }

  .facility_main .about {
    color: var(--bw2);
    font-size: calc(18vw / var(--sp));
    line-height: calc(28vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
  }

  .facility_main#gym .wifi {
    position: absolute;
    width: calc(45vw / var(--sp));
    top: calc(100vw / var(--sp));
    right: calc(37vw / var(--sp));
  }

  .facility_main .more {
    position: absolute;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.9);
    font-size: calc(16vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((48vw / 2) / var(--sp));
    box-shadow: 0 0 calc(4vw / var(--sp)) rgba(0, 0, 0, 0.5);
    height: calc(48vw / var(--sp));
    padding-left: calc(15vw / var(--sp));
    top: calc(40vw / var(--sp));
    right: calc(25vw / var(--sp));
    transition: var(--hover_transition);
  }

  .facility_main .more:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
    cursor: pointer;
  }

  .facility_main#gym .more.machine_sougou {
    color: var(--gym);
    font-size: calc(14vw / var(--sp));
    line-height: calc(17vw / var(--sp));
    width: calc(162vw / var(--sp));
    padding-left: calc(30vw / var(--sp));
  }

  .facility_main#gym .more.machine_shops {
    align-items: baseline;
    color: var(--gym);
    width: calc(162vw / var(--sp));
    padding-top: calc(14vw / var(--sp));
  }

  .facility_main#gym .more.machine_shops span {
    font-size: 1.5em;
  }

  .facility_main#pool .more.effect {
    color: var(--pool);
    font-size: calc((16vw * 0.96) / var(--sp));
    width: calc(190vw / var(--sp));
  }

  .facility_main .more i {
    position: absolute;
    font-size: calc(22vw / var(--sp));
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: calc(13vw / var(--sp));
    transform: translateY(-50%);
  }

  .facility_main#gym .more i {
    color: var(--gym);
  }

  .facility_main#pool .more i {
    color: var(--pool);
  }

  .facility_main .button {
    position: absolute;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    width: calc(300vw / var(--sp));
    height: calc(106vw / var(--sp));
    bottom: calc(24vw / var(--sp));
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
  }

  .facility_main .button.button_sougou {
    justify-content: center;
  }

  .facility_main .button.button_shops,
  .facility_main#relax .button {
    justify-content: center;
  }

  .facility_main .button li {
    background: rgba(255, 255, 255, 0.9);
    border-radius: calc((48vw / 2) / var(--sp));
    width: 100%;
    height: calc(48vw / var(--sp));
  }

  .facility_main .button li.point {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: calc(16vw / var(--sp));
    line-height: calc(18vw / var(--sp));
    font-weight: var(--bold);
    text-align: center;
    transition: var(--hover_transition);
  }

  .facility_main .button li.point:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_main#gym .button li.point {
    color: var(--gym);
  }

  .facility_main#studio .button li.point {
    color: var(--studio);
  }

  .facility_main#hotstudio .button li.point {
    color: var(--hotstudio);
  }

  .facility_main#pool .button li.point {
    color: var(--pool);
  }

  .facility_main#relax .button li.point {
    color: var(--relax);
  }

  .facility_main .button li.point i {
    position: absolute;
    font-size: calc(22vw / var(--sp));
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: calc(13vw / var(--sp));
    transform: translateY(-50%);
  }

  .facility_main#gym .button li.point i {
    color: var(--gym);
  }

  .facility_main#studio .button li.point i {
    color: var(--studio);
  }

  .facility_main#hotstudio .button li.point i {
    color: var(--hotstudio);
  }

  .facility_main#pool .button li.point i {
    color: var(--pool);
  }

  .facility_main#relax .button li.point i {
    color: var(--relax);
  }

  .facility_main .button li.pdf a {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--bw2);
    font-size: calc(16vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  .facility_main .button li.pdf a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_main .button li.pdf img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }

  .facility_main .button li.pdf img.icon_pdf {
    width: calc(20vw / var(--sp));
    left: calc(17vw / var(--sp));
  }

  .facility_main .button li.pdf img.icon_schedule {
    width: calc(22vw / var(--sp));
    left: calc(21vw / var(--sp));
  }

  .facility_main .button li.pdf a i {
    position: absolute;
    font-size: calc(22vw / var(--sp));
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: calc(13vw / var(--sp));
    transform: translateY(-50%);
  }

  .facility_main#gym .button li.pdf a i {
    color: var(--gym);
  }

  .facility_main#studio .button li.pdf a i {
    color: var(--studio);
  }

  .facility_main#hotstudio .button li.pdf a i {
    color: var(--hotstudio);
  }

  .facility_main#pool .button li.pdf a i {
    color: var(--pool);
  }
}

/************************************
.popup_back_pc
************************************/
@media screen and (min-width: 1366px) {
  .popup_back_pc {
    position: fixed;
    display: none;
    width: 100%;
    height: 100vh;
    top: 0;
    z-index: 99;
  }

  .popup_back_pc .left {
    position: absolute;
    width: calc(50% + 227px);
    height: 100%;
    top: 0;
    left: 0;
  }

  .popup_back_pc.gymmachine .left {
    background: linear-gradient(to bottom, #ff5f3e 0%, #ff5f69 100%);
  }

  .popup_back_pc.gym .left {
    background: linear-gradient(to bottom, #ff5381 0%, #ff4357 100%);
  }

  .popup_back_pc.studio .left {
    background: linear-gradient(to bottom, #16c196 0%, #16b651 100%);
  }

  .popup_back_pc.hotstudio .left {
    background: var(--hotstudio);
  }

  .popup_back_pc.pooleffect .left {
    background: #00b9ce;
  }

  .popup_back_pc.pool .left {
    background: var(--pool);
  }

  .popup_back_pc.relax .left {
    background: linear-gradient(to bottom, #eec42f 0%, #eea22f 100%);
  }

  .popup_back_pc.guide .left,
  .popup_back_pc.faq .left,
  .popup_back_pc.voice .left {
    background: linear-gradient(to bottom, #0075c1 0%, #004da5 100%);
  }

  .popup_back_pc.gymmachine .left::before,
  .popup_back_pc.gym .left::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/popup_back_gym.webp") no-repeat;
    background-size: 691px 823px;
    background-position: top -75px right 313px;
    width: 100%;
    height: 100%;
  }

  .popup_back_pc.studio .left::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/popup_back_studio.webp") no-repeat;
    background-size: 1052px 867px;
    background-position: top 28px right -24px;
    width: 100%;
    height: 100%;
  }

  .popup_back_pc.hotstudio .left::before {
    position: absolute;
    display: block;
    content: "";
    background:
      url("../img/popup/popup_back_hotstudio_1.webp") repeat-x,
      url("../img/popup/popup_back_hotstudio_2.webp") repeat-x;
    background-size:
      1366px 309px,
      1366px 408px;
    background-position:
      top right -455px,
      bottom right -455px;
    width: 100%;
    height: 100%;
  }

  .popup_back_pc.pooleffect .left::before,
  .popup_back_pc.pool .left::before {
    position: absolute;
    display: block;
    content: "";
    background:
      url("../img/popup/popup_back_pool_1.webp") no-repeat,
      url("../img/popup/popup_back_pool_2.webp") repeat-x;
    background-size:
      100% 323px,
      1920px 254px;
    background-position:
      top right,
      bottom right -724px;
    width: 100%;
    height: 100%;
  }

  .popup_back_pc.relax .left::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/popup_back_relax.webp") repeat-x;
    background-size: 1403px 576px;
    background-position: bottom right -455px;
    width: 100%;
    height: 100%;
  }

  .popup_back_pc.guide .left::before,
  .popup_back_pc.faq .left::before,
  .popup_back_pc.voice .left::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/popup_back_guide.webp") no-repeat;
    background-size: 438px 522px;
    background-position: top 238px right 520px;
    width: 100%;
    height: 100%;
  }

  .popup_back_pc .left .title {
    position: absolute;
    box-sizing: border-box;
    width: 488px;
    height: 100%;
    padding-top: 30px;
    top: 0;
    right: 422px;
  }

  .popup_back_pc .left .title h2 {
    font-family: "Barlow", sans-serif;
    font-style: normal;
    color: var(--bw6);
    font-size: 90px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 25px;
  }

  .popup_back_pc .left .title h3 {
    color: var(--bw6);
    font-size: 28px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 10px;
  }

  .popup_back_pc .left .title p {
    color: var(--bw6);
    font-size: 18px;
    line-height: 28px;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
  }

  .popup_back_pc .left .title .swiper {
    position: absolute;
    width: 100%;
    height: 488px;
    top: 232px;
  }

  .popup_back_pc .left .title .swiper ul {
    width: 100%;
    height: 100%;
  }

  .popup_back_pc .left .title .swiper ul li {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
  }

  .popup_back_pc .left .title .swiper ul li img {
    margin: 0 auto;
  }

  .popup_back_pc .left .title .swiper ul li:nth-child(odd) img {
    width: 389px;
  }

  .popup_back_pc .left .title .swiper ul li:nth-child(even) img {
    width: 334px;
  }

  .popup_back_pc .right {
    position: absolute;
    box-sizing: border-box;
    width: 455px;
    height: 100%;
    padding-top: 76px;
    top: 0;
    left: calc(50% + 227px);
  }

  .popup_back_pc .right .photo {
    width: 203px;
    padding-left: 30px;
    margin-bottom: 48px;
  }

  .popup_back_pc .right .entry {
    width: 100%;
  }

  .popup_back_pc .right .entry h2 {
    width: 300px !important;
    margin: 0 auto 15px;
  }

  .popup_back_pc .right .entry h2 img {
    width: 100%;
  }

  .popup_back_pc .right .entry .campaign {
    width: 340px;
    height: 255px;
    margin: 0 auto 20px;
  }

  .popup_back_pc .right .entry .campaign a {
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  .popup_back_pc .right .entry .campaign a img {
    width: 100%;
  }

  .popup_back_pc .right .entry .button {
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: var(--entry);
    border-radius: calc(58px / 2);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    width: 340px;
    height: 58px;
    padding: 8px 0;
    margin: 0 auto;
  }

  .popup_back_pc .right .entry .button p {
    color: var(--bw6);
    font-size: 12px;
    line-height: 1em;
    text-align: center;
    font-weight: var(--regular);
    width: 100%;
  }

  .popup_back_pc .right .entry .button p.bold {
    font-size: calc(24px * 0.8);
    font-weight: var(--bold);
  }

  .popup_back_pc .right .entry .button p.bold span {
    font-size: 24px;
  }

  .popup_back_pc .right .entry .button i {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    color: var(--bw6);
    font-size: 11px;
    text-align: center;
    border: 1px solid var(--bw6);
    border-radius: calc(22px / 2);
    width: 22px;
    height: 22px;
    top: 50%;
    right: 14px;
    transform: translateY(-50%);
  }

  .popup_back_pc .close {
    position: absolute;
    overflow: hidden;
    display: flex;
    align-items: center;
    width: 30px;
    height: 30px;
    top: 50px;
    left: calc(50% + 600px);
    transition: var(--popup_transition);
  }

  .popup_back_pc .close i {
    color: #808080;
    font-size: 42px;
    text-align: center;
    width: 100%;
  }

  .popup_back_pc .close:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  .popup_back_pc {
    position: fixed;
    display: none;
    width: 100%;
    height: 100vh;
    top: 0;
    z-index: 99;
  }

  .popup_back_pc .left {
    position: absolute;
    width: calc(50% + (227vw / var(--tablet)));
    height: 100%;
    top: 0;
    left: 0;
  }

  .popup_back_pc.gymmachine .left {
    background: linear-gradient(to bottom, #ff5f3e 0%, #ff5f69 100%);
  }

  .popup_back_pc.gym .left {
    background: linear-gradient(to bottom, #ff5381 0%, #ff4357 100%);
  }

  .popup_back_pc.studio .left {
    background: linear-gradient(to bottom, #16c196 0%, #16b651 100%);
  }

  .popup_back_pc.hotstudio .left {
    background: var(--hotstudio);
  }

  .popup_back_pc.pooleffect .left {
    background: #00b9ce;
  }

  .popup_back_pc.pool .left {
    background: var(--pool);
  }

  .popup_back_pc.relax .left {
    background: linear-gradient(to bottom, #eec42f 0%, #eea22f 100%);
  }

  .popup_back_pc.guide .left,
  .popup_back_pc.faq .left,
  .popup_back_pc.voice .left {
    background: linear-gradient(to bottom, #0075c1 0%, #004da5 100%);
  }

  .popup_back_pc.gymmachine .left::before,
  .popup_back_pc.gym .left::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/popup_back_gym.webp") no-repeat;
    background-size: calc(691vw / var(--tablet)) calc(823vw / var(--tablet));
    background-position: top calc(-75vw / var(--tablet)) right
      calc(313vw / var(--tablet));
    width: 100%;
    height: 100%;
  }

  .popup_back_pc.studio .left::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/popup_back_studio.webp") no-repeat;
    background-size: calc(1052vw / var(--tablet)) calc(867vw / var(--tablet));
    background-position: top calc(28vw / var(--tablet)) right
      calc(-24vw / var(--tablet));
    width: 100%;
    height: 100%;
  }

  .popup_back_pc.hotstudio .left::before {
    position: absolute;
    display: block;
    content: "";
    background:
      url("../img/popup/popup_back_hotstudio_1.webp") repeat-x,
      url("../img/popup/popup_back_hotstudio_2.webp") repeat-x;
    background-size:
      calc(1366vw / var(--tablet)) calc(309vw / var(--tablet)),
      calc(1366vw / var(--tablet)) calc(408vw / var(--tablet));
    background-position:
      top right calc(-455vw / var(--tablet)),
      bottom right calc(-455vw / var(--tablet));
    width: 100%;
    height: 100%;
  }

  .popup_back_pc.pooleffect .left::before,
  .popup_back_pc.pool .left::before {
    position: absolute;
    display: block;
    content: "";
    background:
      url("../img/popup/popup_back_pool_1.webp") no-repeat,
      url("../img/popup/popup_back_pool_2.webp") repeat-x;
    background-size:
      100% calc(323vw / var(--tablet)),
      calc(1920vw / var(--tablet)) calc(254vw / var(--tablet));
    background-position:
      top right,
      bottom right calc(-724vw / var(--tablet));
    width: 100%;
    height: 100%;
  }

  .popup_back_pc.relax .left::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/popup_back_relax.webp") repeat-x;
    background-size: calc(1403vw / var(--tablet)) calc(576vw / var(--tablet));
    background-position: bottom right calc(-455vw / var(--tablet));
    width: 100%;
    height: 100%;
  }

  .popup_back_pc.guide .left::before,
  .popup_back_pc.faq .left::before,
  .popup_back_pc.voice .left::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/popup_back_guide.webp") no-repeat;
    background-size: calc(438vw / var(--tablet)) calc(522vw / var(--tablet));
    background-position: top calc(28vw / var(--tablet)) right
      calc(520vw / var(--tablet));
    width: 100%;
    height: 100%;
  }

  .popup_back_pc .left .title {
    position: absolute;
    box-sizing: border-box;
    width: calc(488vw / var(--tablet));
    height: 100%;
    padding-top: calc(30vw / var(--tablet));
    top: 0;
    right: calc(422vw / var(--tablet));
  }

  .popup_back_pc .left .title h2 {
    font-family: "Barlow", sans-serif;
    font-style: normal;
    color: var(--bw6);
    font-size: calc(90vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(25vw / var(--tablet));
  }

  .popup_back_pc .left .title h3 {
    color: var(--bw6);
    font-size: calc(28vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(10vw / var(--tablet));
  }

  .popup_back_pc .left .title p {
    color: var(--bw6);
    font-size: calc(18vw / var(--tablet));
    line-height: calc(28vw / var(--tablet));
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
  }

  .popup_back_pc .left .title .swiper {
    position: absolute;
    width: 100%;
    height: calc(488vw / var(--tablet));
    top: calc(232vw / var(--tablet));
  }

  .popup_back_pc .left .title .swiper ul {
    width: 100%;
    height: 100%;
  }

  .popup_back_pc .left .title .swiper ul li {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
  }

  .popup_back_pc .left .title .swiper ul li img {
    margin: 0 auto;
  }

  .popup_back_pc .left .title .swiper ul li:nth-child(odd) img {
    width: calc(389vw / var(--tablet));
  }

  .popup_back_pc .left .title .swiper ul li:nth-child(even) img {
    width: calc(334vw / var(--tablet));
  }

  .popup_back_pc .right {
    position: absolute;
    box-sizing: border-box;
    width: calc(455vw / var(--tablet));
    height: 100%;
    padding-top: calc(76vw / var(--tablet));
    top: 0;
    left: calc(50% + (227vw / var(--tablet)));
  }

  .popup_back_pc .right .photo {
    width: calc(203vw / var(--tablet));
    padding-left: calc(30vw / var(--tablet));
    margin-bottom: calc(48vw / var(--tablet));
  }

  .popup_back_pc .right .entry {
    width: 100%;
  }

  .popup_back_pc .right .entry h2 {
    width: calc(300vw / var(--tablet)) !important;
    margin: 0 auto calc(15vw / var(--tablet));
  }

  .popup_back_pc .right .entry h2 img {
    width: 100%;
  }

  .popup_back_pc .right .entry .campaign {
    width: calc(340vw / var(--tablet));
    height: calc(255vw / var(--tablet));
    margin: 0 auto calc(20vw / var(--tablet));
  }

  .popup_back_pc .right .entry .campaign a {
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  .popup_back_pc .right .entry .campaign a img {
    width: 100%;
  }

  .popup_back_pc .right .entry .button {
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: var(--entry);
    border-radius: calc((58vw / 2) / var(--tablet));
    box-shadow: 0 0 calc(10vw / var(--tablet)) rgba(0, 0, 0, 0.3);
    width: calc(340vw / var(--tablet));
    height: calc(58vw / var(--tablet));
    padding: calc(8vw / var(--tablet)) 0;
    margin: 0 auto;
  }

  .popup_back_pc .right .entry .button p {
    color: var(--bw6);
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    text-align: center;
    font-weight: var(--regular);
    width: 100%;
  }

  .popup_back_pc .right .entry .button p.bold {
    font-size: calc((24vw * 0.8) / var(--tablet));
    font-weight: var(--bold);
  }

  .popup_back_pc .right .entry .button p.bold span {
    font-size: calc(24vw / var(--tablet));
  }

  .popup_back_pc .right .entry .button i {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    color: var(--bw6);
    font-size: calc(11vw / var(--tablet));
    text-align: center;
    border: calc(1vw / var(--tablet)) solid var(--bw6);
    border-radius: calc((22vw / 2) / var(--tablet));
    width: calc(22vw / var(--tablet));
    height: calc(22vw / var(--tablet));
    top: 50%;
    right: calc(14vw / var(--tablet));
    transform: translateY(-50%);
  }

  .popup_back_pc .close {
    position: absolute;
    overflow: hidden;
    display: flex;
    align-items: center;
    width: calc(30vw / var(--tablet));
    height: calc(30vw / var(--tablet));
    top: calc(50vw / var(--tablet));
    left: calc(50% + (600vw / var(--tablet)));
    transition: var(--popup_transition);
  }

  .popup_back_pc .close i {
    color: #808080;
    font-size: calc(42vw / var(--tablet));
    text-align: center;
    width: 100%;
  }

  .popup_back_pc .close:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }
}

/************************************
.facility_popup
************************************/
@media screen and (min-width: 1366px) {
  .popup_back {
    position: fixed;
    display: none;
    z-index: 98;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    background: rgba(255, 255, 255, 0.65);
    width: 100%;
    height: 100vh;
    top: 0;
  }

  .facility_popup .nav {
    position: fixed;
    overflow: hidden;
    display: flex;
    z-index: 2;
    background: var(--bw6);
    border-radius: 10px;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
    width: 360px;
    height: 50px;
    top: calc(100vh + 16px);
    left: 50%;
    transform: translateX(-50%);
    transition: var(--popup_transition);
  }

  .facility_popup .nav.active {
    top: 16px;
    transition: var(--popup_transition);
  }

  .facility_popup .nav h2 {
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--bw5);
    font-size: 16px;
    font-weight: var(--bold);
    line-height: 1em;
    text-align: center;
    width: 90px;
    height: 100%;
  }

  .facility_popup#gym_popup .nav h2 {
    color: var(--gym);
  }

  .facility_popup#studio_popup .nav h2 {
    color: var(--studio);
  }

  .facility_popup#hotstudio_popup .nav h2 {
    color: var(--hotstudio);
  }

  .facility_popup#pooleffect_popup .nav h2,
  .facility_popup#pool_popup .nav h2 {
    color: var(--pool);
  }

  .facility_popup#relax_popup .nav h2 {
    color: var(--relax);
  }

  .facility_popup .nav ul {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    flex: 1;
    overflow-x: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .facility_popup .nav ul li {
    background: var(--bw6);
    width: 90px;
    height: 100%;
  }

  .facility_popup#studio_popup .nav ul li {
    width: auto;
    min-width: 90px;
  }

  .facility_popup .nav ul li a {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--bw6);
    color: var(--bw1);
    font-size: 14px;
    font-weight: var(--bold);
    line-height: 1em;
    text-align: center;
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  .facility_popup .nav ul li a i {
    position: absolute;
    color: var(--bw1);
    font-size: 10px;
    text-align: center;
    bottom: 1px;
    left: 50%;
    transform: translateX(-50%);
    transition: var(--hover_transition);
  }

  .facility_popup .nav ul li a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_popup {
    position: fixed;
    overflow-y: scroll;
    z-index: 99;
    background: var(--bw6);
    width: 390px;
    height: 100vh;
    top: 100vh;
    left: calc(50% - (390px / 2));
    transition: var(--popup_transition);
  }

  .facility_popup.active {
    top: 0;
    transition: var(--popup_transition);
  }

  .facility_popup .area {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 693px;
    transition: all 1s;
  }

  .facility_popup#gym_popup .area::after {
    position: absolute;
    z-index: 0;
    display: block;
    content: "";
    background: linear-gradient(
      to top,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0) 100%
    );
    width: 100%;
    height: 160px;
    bottom: 0;
    left: 0;
    pointer-events: none;
  }

  .facility_popup#gym_popup .area ul.swiper-wrapper,
  .facility_popup#studio_popup .area ul.swiper-wrapper {
    width: 100%;
    height: 693px;
  }

  .facility_popup#gym_popup .area ul.swiper-wrapper li,
  .facility_popup#studio_popup .area ul.swiper-wrapper li {
    position: relative;
    list-style-type: none;
    width: 100%;
    height: 100%;
  }

  .facility_popup .area h3 {
    position: absolute;
    display: flex;
    align-items: flex-end;
    gap: 0 25px;
    padding-top: 12px;
    top: 80px;
    left: 25px;
  }

  .facility_popup .area h3 .en {
    position: absolute;
    font-family: "copperplate", serif;
    font-size: 15.7px;
    font-weight: 700;
    line-height: 0.55em;
    letter-spacing: -0.025em;
    top: 0;
    left: 5px;
  }

  .facility_popup#gym_popup .area h3 .en,
  .facility_popup#relax_popup .area#spa h3 .en,
  .facility_popup#relax_popup .area#lounge h3 .en,
  .facility_popup#relax_popup .area#locker h3 .en {
    color: var(--bw2);
  }

  .facility_popup#studio_popup .area h3 .en,
  .facility_popup#hotstudio_popup .area h3 .en,
  .facility_popup#pool_popup .area h3 .en,
  .facility_popup#pooleffect_popup .area h3 .en,
  .facility_popup#relax_popup .area#sauna h3 .en,
  .facility_popup#relax_popup .area#mizuburo h3 .en,
  .facility_popup#relax_popup .area#araiba h3 .en {
    color: var(--bw6);
  }

  .facility_popup .area h3 .number {
    position: relative;
    font-family: "copperplate", serif;
    font-size: 35px;
    font-weight: 700;
    line-height: 0.55em;
    letter-spacing: -0.05em;
  }

  .facility_popup#gym_popup .area h3 .number,
  .facility_popup#relax_popup .area#spa h3 .number,
  .facility_popup#relax_popup .area#lounge h3 .number,
  .facility_popup#relax_popup .area#locker h3 .number {
    color: var(--bw2);
  }

  .facility_popup#studio_popup .area h3 .number,
  .facility_popup#hotstudio_popup .area h3 .number,
  .facility_popup#pool_popup .area h3 .number,
  .facility_popup#pooleffect_popup .area h3 .number,
  .facility_popup#relax_popup .area#sauna h3 .number,
  .facility_popup#relax_popup .area#mizuburo h3 .number,
  .facility_popup#relax_popup .area#araiba h3 .number {
    color: var(--bw6);
  }

  .facility_popup .area h3 .number::after {
    position: absolute;
    display: block;
    content: "";
    width: 1px;
    height: 15px;
    bottom: 4px;
    right: -12.5px;
  }

  .facility_popup#gym_popup .area h3 .number::after,
  .facility_popup#relax_popup .area#spa h3 .number::after,
  .facility_popup#relax_popup .area#lounge h3 .number::after,
  .facility_popup#relax_popup .area#locker h3 .number::after {
    background: var(--bw2);
  }

  .facility_popup#studio_popup .area h3 .number::after,
  .facility_popup#hotstudio_popup .area h3 .number::after,
  .facility_popup#pool_popup .area h3 .number::after,
  .facility_popup#pooleffect_popup .area h3 .number::after,
  .facility_popup#relax_popup .area#sauna h3 .number::after,
  .facility_popup#relax_popup .area#mizuburo h3 .number::after,
  .facility_popup#relax_popup .area#araiba h3 .number::after {
    background: var(--bw6);
  }

  .facility_popup .area h3 .name {
    font-size: 27px;
    font-weight: 700;
    line-height: 1em;
  }

  .facility_popup#gym_popup .area h3 .name,
  .facility_popup#relax_popup .area#spa h3 .name,
  .facility_popup#relax_popup .area#lounge h3 .name,
  .facility_popup#relax_popup .area#locker h3 .name {
    color: var(--bw2);
  }

  .facility_popup#studio_popup .area h3 .name,
  .facility_popup#hotstudio_popup .area h3 .name,
  .facility_popup#pool_popup .area h3 .name,
  .facility_popup#pooleffect_popup .area h3 .name,
  .facility_popup#relax_popup .area#sauna h3 .name,
  .facility_popup#relax_popup .area#mizuburo h3 .name,
  .facility_popup#relax_popup .area#araiba h3 .name {
    color: var(--bw6);
  }

  .facility_popup#gym_popup .area ul.swiper-wrapper li > p,
  .facility_popup#relax_popup .area#spa > p,
  .facility_popup#relax_popup .area#lounge > p,
  .facility_popup#relax_popup .area#locker > p {
    position: absolute;
    color: var(--bw2);
    font-size: 20px;
    font-weight: 400;
    line-height: 28px;
    top: 143px;
    left: 25px;
    width: 340px;
  }

  .facility_popup#studio_popup .area ul.swiper-wrapper li > p,
  .facility_popup#hotstudio_popup .area > p,
  .facility_popup#pool_popup .area > p,
  .facility_popup#pooleffect_popup .area > p,
  .facility_popup#relax_popup .area#sauna > p,
  .facility_popup#relax_popup .area#mizuburo > p,
  .facility_popup#relax_popup .area#araiba > p {
    position: absolute;
    color: var(--bw6);
    font-size: 19px;
    font-weight: 400;
    line-height: 28px;
    top: 143px;
    left: 25px;
    width: 340px;
  }

  .facility_popup .area .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: calc(40px / 2);
    width: 40px;
    height: 40px;
    top: auto;
    bottom: 40px;
    left: auto;
    right: 80px;
  }

  .facility_popup .area .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: calc(40px / 2);
    width: 40px;
    height: 40px;
    top: auto;
    bottom: 40px;
    left: auto;
    right: 25px;
  }

  .facility_popup .area .swiper-button-prev i,
  .facility_popup .area .swiper-button-next i {
    color: var(--bw1);
    font-size: 14px;
  }

  .facility_popup .area .swiper-button-prev::after,
  .facility_popup .area .swiper-button-next::after {
    display: none;
  }

  .facility_popup .entry {
    background: var(--bw6);
    width: 100%;
    padding: 30px 0 70px;
  }

  .facility_popup .entry > h2 {
    width: 300px !important;
    margin: 0 auto 10px;
  }

  .facility_popup .entry > h2 img {
    width: 100%;
  }

  .facility_popup .entry .campaign {
    width: 340px;
    height: 255px;
    margin: 0 auto 25px;
  }

  .facility_popup .entry .campaign a {
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  .facility_popup .entry .campaign a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_popup .entry .campaign a img {
    width: 100%;
  }

  .facility_popup .entry a.entry {
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: var(--entry);
    border-radius: calc(58px / 2);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    width: 340px;
    height: 58px;
    padding: 8px 0;
    margin: 0 auto;
  }

  .facility_popup .entry a.entry p {
    color: var(--bw6);
    font-size: 12px;
    line-height: 1em;
    text-align: center;
    font-weight: var(--regular);
    width: 100%;
  }

  .facility_popup .entry a.entry p.bold {
    font-size: calc(24px * 0.8);
    font-weight: var(--bold);
  }

  .facility_popup .entry a.entry p.bold span {
    font-size: 24px;
  }

  .facility_popup .entry a.entry i {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    color: var(--bw6);
    font-size: 11px;
    text-align: center;
    border: 1px solid var(--bw6);
    border-radius: calc(22px / 2);
    width: 22px;
    height: 22px;
    top: 50%;
    right: 14px;
    transform: translateY(-50%);
  }

  .facility_popup .area .area_notice {
    position: absolute;
    z-index: 1;
    color: var(--bw2);
    font-size: 12px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    bottom: 10px;
    left: 10px;
  }

  .facility_popup .area .area_notice.text-white {
    color: var(--bw6);
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  .popup_back {
    position: fixed;
    display: none;
    z-index: 98;
    -webkit-backdrop-filter: blur(calc(5vw / var(--tablet)));
    backdrop-filter: blur(calc(5vw / var(--tablet)));
    background: rgba(255, 255, 255, 0.65);
    width: 100%;
    height: 100vh;
    top: 0;
  }

  .facility_popup .nav {
    position: fixed;
    overflow: hidden;
    display: flex;
    z-index: 2;
    background: var(--bw6);
    border-radius: calc(10vw / var(--tablet));
    box-shadow: 0 0 calc(4vw / var(--tablet)) rgba(0, 0, 0, 0.5);
    width: calc(360vw / var(--tablet));
    height: calc(50vw / var(--tablet));
    top: calc(100vh + (16vw / var(--tablet)));
    left: 50%;
    transform: translateX(-50%);
    transition: var(--popup_transition);
  }

  .facility_popup .nav.active {
    top: calc(16vw / var(--tablet));
    transition: var(--popup_transition);
  }

  .facility_popup .nav h2 {
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--bw5);
    font-size: calc(16vw / var(--tablet));
    font-weight: var(--bold);
    line-height: 1em;
    text-align: center;
    width: calc(90vw / var(--tablet));
    height: 100%;
  }

  .facility_popup#gym_popup .nav h2 {
    color: var(--gym);
  }

  .facility_popup#studio_popup .nav h2 {
    color: var(--studio);
  }

  .facility_popup#hotstudio_popup .nav h2 {
    color: var(--hotstudio);
  }

  .facility_popup#pooleffect_popup .nav h2,
  .facility_popup#pool_popup .nav h2 {
    color: var(--pool);
  }

  .facility_popup#relax_popup .nav h2 {
    color: var(--relax);
  }

  .facility_popup .nav ul {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    flex: 1;
    overflow-x: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .facility_popup .nav ul li {
    background: var(--bw6);
    width: calc(90vw / var(--tablet));
    height: 100%;
  }

  .facility_popup#studio_popup .nav ul li {
    width: auto;
    min-width: calc(90vw / var(--tablet));
  }

  .facility_popup .nav ul li a {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--bw6);
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    font-weight: var(--bold);
    line-height: 1em;
    text-align: center;
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  .facility_popup .nav ul li a i {
    position: absolute;
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    text-align: center;
    bottom: calc(1vw / var(--tablet));
    left: 50%;
    transform: translateX(-50%);
    transition: var(--hover_transition);
  }

  .facility_popup .nav ul li a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_popup {
    position: fixed;
    overflow-y: scroll;
    z-index: 99;
    background: var(--bw6);
    width: calc(390vw / var(--tablet));
    height: 100vh;
    top: 100vh;
    left: calc(50% - ((390vw / 2) / var(--tablet)));
    transition: var(--popup_transition);
  }

  .facility_popup.active {
    top: 0;
    transition: var(--popup_transition);
  }

  .facility_popup .area {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: calc(693vw / var(--tablet));
    transition: all 1s;
  }

  .facility_popup#gym_popup .area::after {
    position: absolute;
    z-index: 0;
    display: block;
    content: "";
    background: linear-gradient(
      to top,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0) 100%
    );
    width: 100%;
    height: calc(160vw / var(--tablet));
    bottom: 0;
    left: 0;
    pointer-events: none;
  }

  .facility_popup#gym_popup .area ul.swiper-wrapper,
  .facility_popup#studio_popup .area ul.swiper-wrapper {
    width: 100%;
    height: calc(693vw / var(--tablet));
  }

  .facility_popup#gym_popup .area ul.swiper-wrapper li,
  .facility_popup#studio_popup .area ul.swiper-wrapper li {
    position: relative;
    list-style-type: none;
    width: 100%;
    height: 100%;
  }

  .facility_popup .area h3 {
    position: absolute;
    display: flex;
    align-items: flex-end;
    gap: 0 calc(25vw / var(--tablet));
    padding-top: calc(12vw / var(--tablet));
    top: calc(80vw / var(--tablet));
    left: calc(25vw / var(--tablet));
  }

  .facility_popup .area h3 .en {
    position: absolute;
    font-family: "copperplate", serif;
    font-size: calc(15.7vw / var(--tablet));
    font-weight: 700;
    line-height: 0.55em;
    letter-spacing: -0.025em;
    top: 0;
    left: calc(5vw / var(--tablet));
  }

  .facility_popup#gym_popup .area h3 .en,
  .facility_popup#relax_popup .area#spa h3 .en,
  .facility_popup#relax_popup .area#lounge h3 .en,
  .facility_popup#relax_popup .area#locker h3 .en {
    color: var(--bw2);
  }

  .facility_popup#studio_popup .area h3 .en,
  .facility_popup#hotstudio_popup .area h3 .en,
  .facility_popup#pool_popup .area h3 .en,
  .facility_popup#pooleffect_popup .area h3 .en,
  .facility_popup#relax_popup .area#sauna h3 .en,
  .facility_popup#relax_popup .area#mizuburo h3 .en,
  .facility_popup#relax_popup .area#araiba h3 .en {
    color: var(--bw6);
  }

  .facility_popup .area h3 .number {
    position: relative;
    font-family: "copperplate", serif;
    font-size: calc(35vw / var(--tablet));
    font-weight: 700;
    line-height: 0.55em;
    letter-spacing: -0.05em;
  }

  .facility_popup#gym_popup .area h3 .number,
  .facility_popup#relax_popup .area#spa h3 .number,
  .facility_popup#relax_popup .area#lounge h3 .number,
  .facility_popup#relax_popup .area#locker h3 .number {
    color: var(--bw2);
  }

  .facility_popup#studio_popup .area h3 .number,
  .facility_popup#hotstudio_popup .area h3 .number,
  .facility_popup#pool_popup .area h3 .number,
  .facility_popup#pooleffect_popup .area h3 .number,
  .facility_popup#relax_popup .area#sauna h3 .number,
  .facility_popup#relax_popup .area#mizuburo h3 .number,
  .facility_popup#relax_popup .area#araiba h3 .number {
    color: var(--bw6);
  }

  .facility_popup .area h3 .number::after {
    position: absolute;
    display: block;
    content: "";
    width: calc(1vw / var(--tablet));
    height: calc(15vw / var(--tablet));
    bottom: calc(4vw / var(--tablet));
    right: calc(-12.5vw / var(--tablet));
  }

  .facility_popup#gym_popup .area h3 .number::after,
  .facility_popup#relax_popup .area#spa h3 .number::after,
  .facility_popup#relax_popup .area#lounge h3 .number::after,
  .facility_popup#relax_popup .area#locker h3 .number::after {
    background: var(--bw2);
  }

  .facility_popup#studio_popup .area h3 .number::after,
  .facility_popup#hotstudio_popup .area h3 .number::after,
  .facility_popup#pool_popup .area h3 .number::after,
  .facility_popup#pooleffect_popup .area h3 .number::after,
  .facility_popup#relax_popup .area#sauna h3 .number::after,
  .facility_popup#relax_popup .area#mizuburo h3 .number::after,
  .facility_popup#relax_popup .area#araiba h3 .number::after {
    background: var(--bw6);
  }

  .facility_popup .area h3 .name {
    font-size: calc(27vw / var(--tablet));
    font-weight: 700;
    line-height: 1em;
  }

  .facility_popup#gym_popup .area h3 .name,
  .facility_popup#relax_popup .area#spa h3 .name,
  .facility_popup#relax_popup .area#lounge h3 .name,
  .facility_popup#relax_popup .area#locker h3 .name {
    color: var(--bw2);
  }

  .facility_popup#studio_popup .area h3 .name,
  .facility_popup#hotstudio_popup .area h3 .name,
  .facility_popup#pool_popup .area h3 .name,
  .facility_popup#pooleffect_popup .area h3 .name,
  .facility_popup#relax_popup .area#sauna h3 .name,
  .facility_popup#relax_popup .area#mizuburo h3 .name,
  .facility_popup#relax_popup .area#araiba h3 .name {
    color: var(--bw6);
  }

  .facility_popup#gym_popup .area ul.swiper-wrapper li > p,
  .facility_popup#relax_popup .area#spa > p,
  .facility_popup#relax_popup .area#lounge > p,
  .facility_popup#relax_popup .area#locker > p {
    position: absolute;
    color: var(--bw2);
    font-size: calc(20vw / var(--tablet));
    font-weight: 400;
    line-height: calc(28vw / var(--tablet));
    top: calc(143vw / var(--tablet));
    left: calc(25vw / var(--tablet));
    width: calc(340vw / var(--tablet));
  }

  .facility_popup#studio_popup .area ul.swiper-wrapper li > p,
  .facility_popup#hotstudio_popup .area > p,
  .facility_popup#pool_popup .area > p,
  .facility_popup#pooleffect_popup .area > p,
  .facility_popup#relax_popup .area#sauna > p,
  .facility_popup#relax_popup .area#mizuburo > p,
  .facility_popup#relax_popup .area#araiba > p {
    position: absolute;
    color: var(--bw6);
    font-size: calc(19vw / var(--tablet));
    font-weight: 400;
    line-height: calc(28vw / var(--tablet));
    top: calc(143vw / var(--tablet));
    left: calc(25vw / var(--tablet));
    width: calc(340vw / var(--tablet));
  }

  .facility_popup .area .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--tablet));
    width: calc(40vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: auto;
    bottom: calc(40vw / var(--tablet));
    left: auto;
    right: calc(80vw / var(--tablet));
  }

  .facility_popup .area .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--tablet));
    width: calc(40vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: auto;
    bottom: calc(40vw / var(--tablet));
    left: auto;
    right: calc(25vw / var(--tablet));
  }

  .facility_popup .area .swiper-button-prev i,
  .facility_popup .area .swiper-button-next i {
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
  }

  .facility_popup .area .swiper-button-prev::after,
  .facility_popup .area .swiper-button-next::after {
    display: none;
  }

  .facility_popup .entry {
    background: var(--bw6);
    width: 100%;
    padding: calc(30vw / var(--tablet)) 0 calc(70vw / var(--tablet));
  }

  .facility_popup .entry > h2 {
    width: calc(300vw / var(--tablet)) !important;
    margin: 0 auto calc(10vw / var(--tablet));
  }

  .facility_popup .entry > h2 img {
    width: 100%;
  }

  .facility_popup .entry .campaign {
    width: calc(340vw / var(--tablet));
    height: calc(255vw / var(--tablet));
    margin: 0 auto calc(25vw / var(--tablet));
  }

  .facility_popup .entry .campaign a {
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  .facility_popup .entry .campaign a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_popup .entry .campaign a img {
    width: 100%;
  }

  .facility_popup .entry a.entry {
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: var(--entry);
    border-radius: calc((58vw / 2) / var(--tablet));
    box-shadow: 0 0 calc(10vw / var(--tablet)) rgba(0, 0, 0, 0.3);
    width: calc(340vw / var(--tablet));
    height: calc(58vw / var(--tablet));
    padding: calc(8vw / var(--tablet)) 0;
    margin: 0 auto;
  }

  .facility_popup .entry a.entry p {
    color: var(--bw6);
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    text-align: center;
    font-weight: var(--regular);
    width: 100%;
  }

  .facility_popup .entry a.entry p.bold {
    font-size: calc((24vw * 0.8) / var(--tablet));
    font-weight: var(--bold);
  }

  .facility_popup .entry a.entry p.bold span {
    font-size: calc(24vw / var(--tablet));
  }

  .facility_popup .entry a.entry i {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    color: var(--bw6);
    font-size: calc(11vw / var(--tablet));
    text-align: center;
    border: calc(1vw / var(--tablet)) solid var(--bw6);
    border-radius: calc((22vw / 2) / var(--tablet));
    width: calc(22vw / var(--tablet));
    height: calc(22vw / var(--tablet));
    top: 50%;
    right: calc(14vw / var(--tablet));
    transform: translateY(-50%);
  }

  .facility_popup .area .area_notice {
    position: absolute;
    z-index: 1;
    color: var(--bw2);
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    bottom: calc(10vw / var(--tablet));
    left: calc(10vw / var(--tablet));
  }

  .facility_popup .area .area_notice.text-white {
    color: var(--bw6);
  }
}

@media screen and (max-width: 767px) {
  .popup_back {
    position: fixed;
    display: none;
    z-index: 98;
    background: var(--bw1);
    opacity: 0.5;
    width: 100%;
    height: 100vh;
    top: 0;
  }

  .facility_popup .nav {
    position: fixed;
    overflow: hidden;
    display: flex;
    z-index: 2;
    background: var(--bw6);
    border-radius: calc(10vw / var(--sp));
    box-shadow: 0 0 calc(4vw / var(--sp)) rgba(0, 0, 0, 0.5);
    width: calc(360vw / var(--sp));
    height: calc(50vw / var(--sp));
    bottom: calc((628vw - 693vw) / var(--sp));
    left: 50%;
    transform: translateX(-50%);
    transition: var(--popup_transition);
  }

  .facility_popup .nav.active {
    bottom: calc(628vw / var(--sp));
    transition: var(--popup_transition);
  }

  .facility_popup .nav h2 {
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--bw5);
    font-size: calc(16vw / var(--sp));
    font-weight: var(--bold);
    line-height: 1em;
    text-align: center;
    width: calc(90vw / var(--sp));
    height: 100%;
  }

  .facility_popup#gym_popup .nav h2 {
    color: var(--gym);
  }

  .facility_popup#studio_popup .nav h2 {
    color: var(--studio);
  }

  .facility_popup#hotstudio_popup .nav h2 {
    color: var(--hotstudio);
  }

  .facility_popup#pooleffect_popup .nav h2,
  .facility_popup#pool_popup .nav h2 {
    color: var(--pool);
  }

  .facility_popup#relax_popup .nav h2 {
    color: var(--relax);
  }

  .facility_popup .nav ul {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    flex: 1;
    overflow-x: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .facility_popup .nav ul li {
    background: var(--bw6);
    width: calc(90vw / var(--sp));
    height: 100%;
  }

  .facility_popup#studio_popup .nav ul li {
    width: auto;
    min-width: calc(90vw / var(--sp));
  }

  .facility_popup .nav ul li a {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--bw6);
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    font-weight: var(--bold);
    line-height: 1em;
    text-align: center;
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  .facility_popup .nav ul li a i {
    position: absolute;
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    text-align: center;
    bottom: calc(1vw / var(--sp));
    left: 50%;
    transform: translateX(-50%);
    transition: var(--hover_transition);
  }

  .facility_popup .nav ul li a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_popup .close {
    position: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 99;
    box-sizing: border-box;
    background: var(--bw1);
    border: calc(2vw / var(--sp)) solid var(--bw6);
    border-radius: calc((48vw / 2) / var(--sp));
    width: calc(48vw / var(--sp));
    height: calc(48vw / var(--sp));
    bottom: calc((10vw - 693vw) / var(--sp));
    left: 50%;
    transform: translateX(-50%);
    transition: var(--popup_transition);
  }

  .facility_popup .close i {
    color: var(--bw6);
    font-size: calc(25vw / var(--sp));
  }

  .facility_popup .close.active {
    bottom: calc(10vw / var(--sp));
    transition: var(--popup_transition);
  }

  .facility_popup .close:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_popup {
    position: fixed;
    overflow-y: scroll;
    z-index: 99;
    background: var(--bw6);
    border-radius: calc(20vw / var(--sp)) calc(20vw / var(--sp)) 0 0;
    width: 100%;
    height: calc(693vw / var(--sp));
    bottom: calc(-693vw / var(--sp));
    transition: var(--popup_transition);
  }

  .facility_popup.active {
    bottom: 0;
    transition: var(--popup_transition);
  }

  .facility_popup .area {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: calc(693vw / var(--sp));
    transition: all 1s;
  }

  .facility_popup#gym_popup .area::after {
    position: absolute;
    z-index: 0;
    display: block;
    content: "";
    background: linear-gradient(
      to top,
      rgba(0, 0, 0, 0.2) 0%,
      rgba(0, 0, 0, 0) 100%
    );
    width: 100%;
    height: calc(160vw / var(--sp));
    bottom: 0;
    left: 0;
    pointer-events: none;
  }

  .facility_popup#gym_popup .area ul.swiper-wrapper,
  .facility_popup#studio_popup .area ul.swiper-wrapper {
    width: 100%;
    height: calc(693vw / var(--sp));
  }

  .facility_popup#gym_popup .area ul.swiper-wrapper li,
  .facility_popup#studio_popup .area ul.swiper-wrapper li {
    position: relative;
    list-style-type: none;
    width: 100%;
    height: 100%;
  }

  .facility_popup .area h3 {
    position: absolute;
    display: flex;
    align-items: flex-end;
    gap: 0 calc(25vw / var(--sp));
    padding-top: calc(12vw / var(--sp));
    top: calc(80vw / var(--sp));
    left: calc(25vw / var(--sp));
  }

  .facility_popup .area h3 .en {
    position: absolute;
    font-family: "copperplate", serif;
    font-size: calc(15.7vw / var(--sp));
    font-weight: 700;
    line-height: 0.55em;
    letter-spacing: -0.025em;
    top: 0;
    left: calc(5vw / var(--sp));
  }

  .facility_popup#gym_popup .area h3 .en,
  .facility_popup#relax_popup .area#spa h3 .en,
  .facility_popup#relax_popup .area#lounge h3 .en,
  .facility_popup#relax_popup .area#locker h3 .en {
    color: var(--bw2);
  }

  .facility_popup#studio_popup .area h3 .en,
  .facility_popup#hotstudio_popup .area h3 .en,
  .facility_popup#pool_popup .area h3 .en,
  .facility_popup#pooleffect_popup .area h3 .en,
  .facility_popup#relax_popup .area#sauna h3 .en,
  .facility_popup#relax_popup .area#mizuburo h3 .en,
  .facility_popup#relax_popup .area#araiba h3 .en {
    color: var(--bw6);
  }

  .facility_popup .area h3 .number {
    position: relative;
    font-family: "copperplate", serif;
    font-size: calc(35vw / var(--sp));
    font-weight: 700;
    line-height: 0.55em;
    letter-spacing: -0.05em;
  }

  .facility_popup#gym_popup .area h3 .number,
  .facility_popup#relax_popup .area#spa h3 .number,
  .facility_popup#relax_popup .area#lounge h3 .number,
  .facility_popup#relax_popup .area#locker h3 .number {
    color: var(--bw2);
  }

  .facility_popup#studio_popup .area h3 .number,
  .facility_popup#hotstudio_popup .area h3 .number,
  .facility_popup#pool_popup .area h3 .number,
  .facility_popup#pooleffect_popup .area h3 .number,
  .facility_popup#relax_popup .area#sauna h3 .number,
  .facility_popup#relax_popup .area#mizuburo h3 .number,
  .facility_popup#relax_popup .area#araiba h3 .number {
    color: var(--bw6);
  }

  .facility_popup .area h3 .number::after {
    position: absolute;
    display: block;
    content: "";
    width: calc(1vw / var(--sp));
    height: calc(15vw / var(--sp));
    bottom: calc(4vw / var(--sp));
    right: calc(-12.5vw / var(--sp));
  }

  .facility_popup#gym_popup .area h3 .number::after,
  .facility_popup#relax_popup .area#spa h3 .number::after,
  .facility_popup#relax_popup .area#lounge h3 .number::after,
  .facility_popup#relax_popup .area#locker h3 .number::after {
    background: var(--bw2);
  }

  .facility_popup#studio_popup .area h3 .number::after,
  .facility_popup#hotstudio_popup .area h3 .number::after,
  .facility_popup#pool_popup .area h3 .number::after,
  .facility_popup#pooleffect_popup .area h3 .number::after,
  .facility_popup#relax_popup .area#sauna h3 .number::after,
  .facility_popup#relax_popup .area#mizuburo h3 .number::after,
  .facility_popup#relax_popup .area#araiba h3 .number::after {
    background: var(--bw6);
  }

  .facility_popup .area h3 .name {
    font-size: calc(27vw / var(--sp));
    font-weight: 700;
    line-height: 1em;
  }

  .facility_popup#gym_popup .area h3 .name,
  .facility_popup#relax_popup .area#spa h3 .name,
  .facility_popup#relax_popup .area#lounge h3 .name,
  .facility_popup#relax_popup .area#locker h3 .name {
    color: var(--bw2);
  }

  .facility_popup#studio_popup .area h3 .name,
  .facility_popup#hotstudio_popup .area h3 .name,
  .facility_popup#pool_popup .area h3 .name,
  .facility_popup#pooleffect_popup .area h3 .name,
  .facility_popup#relax_popup .area#sauna h3 .name,
  .facility_popup#relax_popup .area#mizuburo h3 .name,
  .facility_popup#relax_popup .area#araiba h3 .name {
    color: var(--bw6);
  }

  .facility_popup#gym_popup .area ul.swiper-wrapper li > p,
  .facility_popup#relax_popup .area#spa > p,
  .facility_popup#relax_popup .area#lounge > p,
  .facility_popup#relax_popup .area#locker > p {
    position: absolute;
    color: var(--bw2);
    font-size: calc(19vw / var(--sp));
    font-weight: 400;
    line-height: calc(28vw / var(--sp));
    top: calc(143vw / var(--sp));
    left: calc(25vw / var(--sp));
    width: calc(340vw / var(--sp));
  }

  .facility_popup#studio_popup .area ul.swiper-wrapper li > p,
  .facility_popup#hotstudio_popup .area > p,
  .facility_popup#pool_popup .area > p,
  .facility_popup#pooleffect_popup .area > p,
  .facility_popup#relax_popup .area#sauna > p,
  .facility_popup#relax_popup .area#mizuburo > p,
  .facility_popup#relax_popup .area#araiba > p {
    position: absolute;
    color: var(--bw6);
    font-size: calc(20vw / var(--sp));
    font-weight: 400;
    line-height: calc(28vw / var(--sp));
    top: calc(143vw / var(--sp));
    left: calc(25vw / var(--sp));
  }

  .facility_popup .area .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--sp));
    width: calc(40vw / var(--sp));
    height: calc(40vw / var(--sp));
    top: auto;
    bottom: calc(40vw / var(--sp));
    left: auto;
    right: calc(80vw / var(--sp));
  }

  .facility_popup .area .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--sp));
    width: calc(40vw / var(--sp));
    height: calc(40vw / var(--sp));
    top: auto;
    bottom: calc(40vw / var(--sp));
    left: auto;
    right: calc(25vw / var(--sp));
  }

  .facility_popup .area .swiper-button-prev i,
  .facility_popup .area .swiper-button-next i {
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
  }

  .facility_popup .area .swiper-button-prev::after,
  .facility_popup .area .swiper-button-next::after {
    display: none;
  }

  .facility_popup .entry {
    background: var(--bw6);
    width: 100%;
    padding: calc(30vw / var(--sp)) 0 calc(70vw / var(--sp));
  }

  .facility_popup .entry > h2 {
    width: calc(300vw / var(--sp)) !important;
    margin: 0 auto calc(10vw / var(--sp));
  }

  .facility_popup .entry > h2 img {
    width: 100%;
  }

  .facility_popup .entry .campaign {
    width: calc(340vw / var(--sp));
    height: calc(255vw / var(--sp));
    margin: 0 auto calc(25vw / var(--sp));
  }

  .facility_popup .entry .campaign a {
    width: 100%;
    height: 100%;
    transition: var(--hover_transition);
  }

  .facility_popup .entry .campaign a:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  .facility_popup .entry .campaign a img {
    width: 100%;
  }

  .facility_popup .entry a.entry {
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: var(--entry);
    border-radius: calc((58vw / 2) / var(--sp));
    box-shadow: 0 0 calc(10vw / var(--sp)) rgba(0, 0, 0, 0.3);
    width: calc(340vw / var(--sp));
    height: calc(58vw / var(--sp));
    padding: calc(8vw / var(--sp)) 0;
    margin: 0 auto;
  }

  .facility_popup .entry a.entry p {
    color: var(--bw6);
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    text-align: center;
    font-weight: var(--regular);
    width: 100%;
  }

  .facility_popup .entry a.entry p.bold {
    font-size: calc((24vw * 0.8) / var(--sp));
    font-weight: var(--bold);
  }

  .facility_popup .entry a.entry p.bold span {
    font-size: calc(24vw / var(--sp));
  }

  .facility_popup .entry a.entry i {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    color: var(--bw6);
    font-size: calc(11vw / var(--sp));
    text-align: center;
    border: calc(1vw / var(--sp)) solid var(--bw6);
    border-radius: calc((22vw / 2) / var(--sp));
    width: calc(22vw / var(--sp));
    height: calc(22vw / var(--sp));
    top: 50%;
    right: calc(14vw / var(--sp));
    transform: translateY(-50%);
  }

  .facility_popup .area .area_notice {
    position: absolute;
    z-index: 1;
    color: var(--bw2);
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    bottom: calc(10vw / var(--sp));
    left: calc(10vw / var(--sp));
  }

  .facility_popup .area .area_notice.text-white {
    color: var(--bw6);
  }
}

/************************************
#gymmachine_popup
************************************/
@media screen and (min-width: 1366px) {
  #gymmachine_popup {
    background: var(--bw5);
  }

  #gymmachine_popup .nav {
    position: relative;
    display: block;
    align-content: center;
    background: var(--bw6);
    border-radius: 0;
    box-shadow: none;
    width: 100%;
    height: 100px;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
  }

  #gymmachine_popup .nav ul {
    gap: 0 3px;
    height: 60px;
    padding: 0 25px;
  }

  #gymmachine_popup .nav ul li {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--bw6);
    color: var(--bw1);
    font-size: 16px;
    font-weight: var(--bold);
    line-height: 1em;
    text-align: center;
    width: 78px;
    height: 100%;
    transition: var(--hover_transition);
  }

  #gymmachine_popup .nav ul li:hover {
    cursor: pointer;
  }

  #gymmachine_popup .nav ul li:hover,
  #gymmachine_popup .nav ul li.current {
    background: linear-gradient(
      to top,
      var(--holiday2) 0,
      var(--holiday2) 6px,
      transparent 6px,
      transparent 100%
    );
    color: var(--holiday2);
    transition: var(--hover_transition);
  }

  #gymmachine_popup .machine {
    display: none;
    box-sizing: border-box;
    background: var(--bw5);
    width: 100%;
  }

  #gymmachine_popup .machine .swiper {
    width: 100%;
    height: 560px;
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper {
    width: 100%;
    height: 500px;
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide {
    position: relative;
    width: 100%;
    height: 100%;
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide img {
    width: 100%;
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide h2 {
    color: var(--bw1);
    font-size: 22px;
    font-weight: var(--bold);
    line-height: 1em;
    text-align: left;
    border-bottom: 2px solid var(--bw3);
    width: 340px;
    padding-bottom: 15px;
    margin: 0 auto;
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide .info {
    position: absolute;
    display: flex;
    justify-content: space-between;
    width: 340px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    .number {
    font-family: "Barlow", sans-serif;
    font-style: normal;
    color: var(--bw1);
    font-size: 42px;
    line-height: 1em;
    font-weight: 600;
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide .info a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 145px;
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    a
    .watch {
    color: var(--bw2);
    font-size: 16px;
    font-weight: var(--regular);
    line-height: 1em;
    text-align: left;
    text-decoration: underline;
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    a
    .play {
    position: relative;
    background: var(--holiday2);
    border-radius: calc(40px / 2);
    width: 40px;
    height: 40px;
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    a
    .play
    i {
    position: absolute;
    color: var(--bw6);
    font-size: 18px;
    text-align: center;
    top: 50%;
    left: 14px;
    transform: translateY(-50%);
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    .number
    span {
    font-size: 28px;
  }

  #gymmachine_popup .machine .swiper .swiper-pagination {
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    width: 120px;
    bottom: 0;
    left: 25px;
  }

  #gymmachine_popup .swiper .swiper-pagination .swiper-pagination-bullet {
    background: var(--bw3);
    border-radius: calc(16px / 2);
    width: 16px;
    height: 16px;
    margin: 0;
    opacity: 1;
    transition: var(--hover_transition);
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet:hover,
  #gymmachine_popup
    .machine
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--holiday2);
    transition: var(--hover_transition);
  }

  #gymmachine_popup .machine .swiper .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: calc(40px / 2);
    width: 40px;
    height: 40px;
    top: auto;
    bottom: 0;
    left: auto;
    right: 80px;
  }

  #gymmachine_popup .machine .swiper .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: calc(40px / 2);
    width: 40px;
    height: 40px;
    top: auto;
    bottom: 0;
    left: auto;
    right: 25px;
  }

  #gymmachine_popup .machine .swiper .swiper-button-prev i,
  #gymmachine_popup .machine .swiper .swiper-button-next i {
    color: var(--bw1);
    font-size: 14px;
  }

  #gymmachine_popup .machine .swiper .swiper-button-prev::after,
  #gymmachine_popup .machine .swiper .swiper-button-next::after {
    display: none;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #gymmachine_popup {
    background: var(--bw5);
  }

  #gymmachine_popup .nav {
    position: relative;
    display: block;
    align-content: center;
    background: var(--bw6);
    border-radius: 0;
    box-shadow: none;
    width: 100%;
    height: calc(100vw / var(--tablet));
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
  }

  #gymmachine_popup .nav ul {
    gap: 0 calc(3vw / var(--tablet));
    height: calc(60vw / var(--tablet));
    padding: 0 calc(25vw / var(--tablet));
  }

  #gymmachine_popup .nav ul li {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--bw6);
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    font-weight: var(--bold);
    line-height: 1em;
    text-align: center;
    width: calc(78vw / var(--tablet));
    height: 100%;
    transition: var(--hover_transition);
  }

  #gymmachine_popup .nav ul li:hover {
    cursor: pointer;
  }

  #gymmachine_popup .nav ul li:hover,
  #gymmachine_popup .nav ul li.current {
    background: linear-gradient(
      to top,
      var(--holiday2) 0,
      var(--holiday2) calc(6vw / var(--tablet)),
      transparent calc(6vw / var(--tablet)),
      transparent 100%
    );
    color: var(--holiday2);
    transition: var(--hover_transition);
  }

  #gymmachine_popup .machine {
    display: none;
    box-sizing: border-box;
    background: var(--bw5);
    width: 100%;
  }

  #gymmachine_popup .machine .swiper {
    width: 100%;
    height: calc(560vw / var(--tablet));
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper {
    width: 100%;
    height: calc(500vw / var(--tablet));
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide {
    position: relative;
    width: 100%;
    height: 100%;
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide img {
    width: 100%;
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide h2 {
    color: var(--bw1);
    font-size: calc(22vw / var(--tablet));
    font-weight: var(--bold);
    line-height: 1em;
    text-align: left;
    border-bottom: calc(2vw / var(--tablet)) solid var(--bw3);
    width: calc(340vw / var(--tablet));
    padding-bottom: calc(15vw / var(--tablet));
    margin: 0 auto;
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide .info {
    position: absolute;
    display: flex;
    justify-content: space-between;
    width: calc(340vw / var(--tablet));
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    .number {
    font-family: "Barlow", sans-serif;
    font-style: normal;
    color: var(--bw1);
    font-size: calc(42vw / var(--tablet));
    line-height: 1em;
    font-weight: 600;
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide .info a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: calc(145vw / var(--tablet));
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    a
    .watch {
    color: var(--bw2);
    font-size: calc(16vw / var(--tablet));
    font-weight: var(--regular);
    line-height: 1em;
    text-align: left;
    text-decoration: underline;
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    a
    .play {
    position: relative;
    background: var(--holiday2);
    border-radius: calc((40vw / 2) / var(--tablet));
    width: calc(40vw / var(--tablet));
    height: calc(40vw / var(--tablet));
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    a
    .play
    i {
    position: absolute;
    color: var(--bw6);
    font-size: calc(18vw / var(--tablet));
    text-align: center;
    top: 50%;
    left: calc(14vw / var(--tablet));
    transform: translateY(-50%);
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    .number
    span {
    font-size: calc(28vw / var(--tablet));
  }

  #gymmachine_popup .machine .swiper .swiper-pagination {
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: calc(8vw / var(--tablet));
    width: calc(120vw / var(--tablet));
    bottom: 0;
    left: calc(25vw / var(--tablet));
  }

  #gymmachine_popup .swiper .swiper-pagination .swiper-pagination-bullet {
    background: var(--bw3);
    border-radius: calc((16vw / 2) / var(--tablet));
    width: calc(16vw / var(--tablet));
    height: calc(16vw / var(--tablet));
    margin: 0;
    opacity: 1;
    transition: var(--hover_transition);
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet:hover,
  #gymmachine_popup
    .machine
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--holiday2);
    transition: var(--hover_transition);
  }

  #gymmachine_popup .machine .swiper .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--tablet));
    width: calc(40vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: auto;
    bottom: 0;
    left: auto;
    right: calc(80vw / var(--tablet));
  }

  #gymmachine_popup .machine .swiper .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--tablet));
    width: calc(40vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: auto;
    bottom: 0;
    left: auto;
    right: calc(25vw / var(--tablet));
  }

  #gymmachine_popup .machine .swiper .swiper-button-prev i,
  #gymmachine_popup .machine .swiper .swiper-button-next i {
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
  }

  #gymmachine_popup .machine .swiper .swiper-button-prev::after,
  #gymmachine_popup .machine .swiper .swiper-button-next::after {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  #gymmachine_popup {
    background: var(--bw5);
  }

  #gymmachine_popup .nav {
    position: relative;
    display: block;
    align-content: center;
    background: var(--bw6);
    border-radius: 0;
    box-shadow: none;
    width: 100%;
    height: calc(100vw / var(--sp));
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
  }

  #gymmachine_popup .nav ul {
    gap: 0 calc(3vw / var(--sp));
    height: calc(60vw / var(--sp));
    padding: 0 calc(25vw / var(--sp));
  }

  #gymmachine_popup .nav ul li {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--bw6);
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    font-weight: var(--bold);
    line-height: 1em;
    text-align: center;
    width: calc(78vw / var(--sp));
    height: 100%;
    transition: var(--hover_transition);
  }

  #gymmachine_popup .nav ul li:hover {
    cursor: pointer;
  }

  #gymmachine_popup .nav ul li:hover,
  #gymmachine_popup .nav ul li.current {
    background: linear-gradient(
      to top,
      var(--holiday2) 0,
      var(--holiday2) calc(6vw / var(--sp)),
      transparent calc(6vw / var(--sp)),
      transparent 100%
    );
    color: var(--holiday2);
    transition: var(--hover_transition);
  }

  #gymmachine_popup .machine {
    display: none;
    box-sizing: border-box;
    background: var(--bw5);
    width: 100%;
  }

  #gymmachine_popup .machine .swiper {
    width: 100%;
    height: calc(560vw / var(--sp));
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper {
    width: 100%;
    height: calc(500vw / var(--sp));
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide {
    position: relative;
    width: 100%;
    height: 100%;
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide img {
    width: 100%;
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide h2 {
    color: var(--bw1);
    font-size: calc(22vw / var(--sp));
    font-weight: var(--bold);
    line-height: 1em;
    text-align: left;
    border-bottom: calc(2vw / var(--sp)) solid var(--bw3);
    width: calc(340vw / var(--sp));
    padding-bottom: calc(15vw / var(--sp));
    margin: 0 auto;
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide .info {
    position: absolute;
    display: flex;
    justify-content: space-between;
    width: calc(340vw / var(--sp));
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    .number {
    font-family: "Barlow", sans-serif;
    font-style: normal;
    color: var(--bw1);
    font-size: calc(42vw / var(--sp));
    line-height: 1em;
    font-weight: 600;
  }

  #gymmachine_popup .machine .swiper .swiper-wrapper .swiper-slide .info a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: calc(145vw / var(--sp));
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    a
    .watch {
    color: var(--bw2);
    font-size: calc(16vw / var(--sp));
    font-weight: var(--regular);
    line-height: 1em;
    text-align: left;
    text-decoration: underline;
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    a
    .play {
    position: relative;
    background: var(--holiday2);
    border-radius: calc((40vw / 2) / var(--sp));
    width: calc(40vw / var(--sp));
    height: calc(40vw / var(--sp));
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    a
    .play
    i {
    position: absolute;
    color: var(--bw6);
    font-size: calc(18vw / var(--sp));
    text-align: center;
    top: 50%;
    left: calc(14vw / var(--sp));
    transform: translateY(-50%);
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-wrapper
    .swiper-slide
    .info
    .number
    span {
    font-size: calc(28vw / var(--sp));
  }

  #gymmachine_popup .machine .swiper .swiper-pagination {
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: calc(8vw / var(--sp));
    width: calc(120vw / var(--sp));
    bottom: 0;
    left: calc(25vw / var(--sp));
  }

  #gymmachine_popup .swiper .swiper-pagination .swiper-pagination-bullet {
    background: var(--bw3);
    border-radius: calc((16vw / 2) / var(--sp));
    width: calc(16vw / var(--sp));
    height: calc(16vw / var(--sp));
    margin: 0;
    opacity: 1;
    transition: var(--hover_transition);
  }

  #gymmachine_popup
    .machine
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet:hover,
  #gymmachine_popup
    .machine
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--holiday2);
    transition: var(--hover_transition);
  }

  #gymmachine_popup .machine .swiper .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--sp));
    width: calc(40vw / var(--sp));
    height: calc(40vw / var(--sp));
    top: auto;
    bottom: 0;
    left: auto;
    right: calc(80vw / var(--sp));
  }

  #gymmachine_popup .machine .swiper .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--sp));
    width: calc(40vw / var(--sp));
    height: calc(40vw / var(--sp));
    top: auto;
    bottom: 0;
    left: auto;
    right: calc(25vw / var(--sp));
  }

  #gymmachine_popup .machine .swiper .swiper-button-prev i,
  #gymmachine_popup .machine .swiper .swiper-button-next i {
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
  }

  #gymmachine_popup .machine .swiper .swiper-button-prev::after,
  #gymmachine_popup .machine .swiper .swiper-button-next::after {
    display: none;
  }
}

/************************************
#gym_popup
************************************/
@media screen and (min-width: 1366px) {
  #gym_popup .area#kintore {
    background-image: url("../img/popup/gym/kintore.webp");
    background-repeat: no-repeat;
    background-size: 320%;
    background-position: top -120px left -82px;
  }

  #gym_popup .area#yusanso {
    background-image: url("../img/popup/gym/yusanso.webp");
    background-repeat: no-repeat;
    background-size: 283%;
    background-position: top -22px left -63px;
  }

  #gym_popup .area#freeweight {
    background-image: url("../img/popup/gym/freeweight.webp");
    background-repeat: no-repeat;
    background-size: 318%;
    background-position: top -90px left -104px;
  }

  #gym_popup .area#dumbbell {
    background-image: url("../img/popup/gym/dumbbell.webp");
    background-repeat: no-repeat;
    background-size: 303%;
    background-position: top -90px left -139px;
  }

  #gym_popup .area#jiju {
    background-image: url("../img/popup/gym/jiju.webp");
    background-repeat: no-repeat;
    background-size: 325%;
    background-position: top -95px left -212px;
  }

  #gym_popup .area#stretch {
    background-image: url("../img/popup/gym/stretch.webp");
    background-repeat: no-repeat;
    background-size: 330%;
    background-position: top -160px left -49px;
  }

  #gym_popup .area#group {
    background-image: url("../img/popup/gym/group.webp");
    background-repeat: no-repeat;
    background-size: 345%;
    background-position: top -107px left -178px;
  }

  #gym_popup .area#josei {
    background-image: url("../img/popup/gym/josei.webp");
    background-repeat: no-repeat;
    background-size: 281%;
    background-position: top -28px left -58px;
  }

  #gym_popup .area::before {
    position: absolute;
    z-index: 1;
    display: block;
    content: "";
    background:
      linear-gradient(
        to bottom,
        rgba(255, 67, 87, 0.2) 0%,
        rgba(255, 67, 87, 0) 100%
      ),
      linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0.8) 0%,
        rgba(255, 255, 255, 0) 100%
      );
    width: 100%;
    height: 260px;
    top: 0;
    left: 0;
    pointer-events: none;
  }

  #gym_popup .area ul.swiper-wrapper li .gym_map {
    position: absolute;
    width: 144px;
    height: 70px;
    bottom: 40px;
    left: 25px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #gym_popup .area#kintore {
    background-image: url("../img/popup/gym/kintore.webp");
    background-repeat: no-repeat;
    background-size: 320%;
    background-position: top calc(-120vw / var(--tablet)) left
      calc(-82vw / var(--tablet));
  }

  #gym_popup .area#yusanso {
    background-image: url("../img/popup/gym/yusanso.webp");
    background-repeat: no-repeat;
    background-size: 283%;
    background-position: top calc(-22vw / var(--tablet)) left
      calc(-63vw / var(--tablet));
  }

  #gym_popup .area#freeweight {
    background-image: url("../img/popup/gym/freeweight.webp");
    background-repeat: no-repeat;
    background-size: 318%;
    background-position: top calc(-90vw / var(--tablet)) left
      calc(-104vw / var(--tablet));
  }

  #gym_popup .area#dumbbell {
    background-image: url("../img/popup/gym/dumbbell.webp");
    background-repeat: no-repeat;
    background-size: 303%;
    background-position: top calc(-90vw / var(--tablet)) left
      calc(-139vw / var(--tablet));
  }

  #gym_popup .area#jiju {
    background-image: url("../img/popup/gym/jiju.webp");
    background-repeat: no-repeat;
    background-size: 325%;
    background-position: top calc(-95vw / var(--tablet)) left
      calc(-212vw / var(--tablet));
  }

  #gym_popup .area#stretch {
    background-image: url("../img/popup/gym/stretch.webp");
    background-repeat: no-repeat;
    background-size: 330%;
    background-position: top calc(-160vw / var(--tablet)) left
      calc(-49vw / var(--tablet));
  }

  #gym_popup .area#group {
    background-image: url("../img/popup/gym/group.webp");
    background-repeat: no-repeat;
    background-size: 345%;
    background-position: top calc(-107vw / var(--tablet)) left
      calc(-178vw / var(--tablet));
  }

  #gym_popup .area#josei {
    background-image: url("../img/popup/gym/josei.webp");
    background-repeat: no-repeat;
    background-size: 281%;
    background-position: top calc(-28vw / var(--tablet)) left
      calc(-58vw / var(--tablet));
  }

  #gym_popup .area::before {
    position: absolute;
    z-index: 1;
    display: block;
    content: "";
    background:
      linear-gradient(
        to bottom,
        rgba(255, 67, 87, 0.2) 0%,
        rgba(255, 67, 87, 0) 100%
      ),
      linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0.8) 0%,
        rgba(255, 255, 255, 0) 100%
      );
    width: 100%;
    height: calc(260vw / var(--tablet));
    top: 0;
    left: 0;
    pointer-events: none;
  }

  #gym_popup .area ul.swiper-wrapper li .gym_map {
    position: absolute;
    width: calc(144vw / var(--tablet));
    height: calc(70vw / var(--tablet));
    bottom: calc(40vw / var(--tablet));
    left: calc(25vw / var(--tablet));
  }
}

@media screen and (max-width: 767px) {
  #gym_popup .area#kintore {
    background-image: url("../img/popup/gym/kintore.webp");
    background-repeat: no-repeat;
    background-size: 320%;
    background-position: top calc(-120vw / var(--sp)) left
      calc(-82vw / var(--sp));
  }

  #gym_popup .area#yusanso {
    background-image: url("../img/popup/gym/yusanso.webp");
    background-repeat: no-repeat;
    background-size: 283%;
    background-position: top calc(-22vw / var(--sp)) left
      calc(-63vw / var(--sp));
  }

  #gym_popup .area#freeweight {
    background-image: url("../img/popup/gym/freeweight.webp");
    background-repeat: no-repeat;
    background-size: 318%;
    background-position: top calc(-90vw / var(--sp)) left
      calc(-104vw / var(--sp));
  }

  #gym_popup .area#dumbbell {
    background-image: url("../img/popup/gym/dumbbell.webp");
    background-repeat: no-repeat;
    background-size: 303%;
    background-position: top calc(-90vw / var(--sp)) left
      calc(-139vw / var(--sp));
  }

  #gym_popup .area#jiju {
    background-image: url("../img/popup/gym/jiju.webp");
    background-repeat: no-repeat;
    background-size: 325%;
    background-position: top calc(-95vw / var(--sp)) left
      calc(-212vw / var(--sp));
  }

  #gym_popup .area#stretch {
    background-image: url("../img/popup/gym/stretch.webp");
    background-repeat: no-repeat;
    background-size: 330%;
    background-position: top calc(-160vw / var(--sp)) left
      calc(-49vw / var(--sp));
  }

  #gym_popup .area#group {
    background-image: url("../img/popup/gym/group.webp");
    background-repeat: no-repeat;
    background-size: 345%;
    background-position: top calc(-107vw / var(--sp)) left
      calc(-178vw / var(--sp));
  }

  #gym_popup .area#josei {
    background-image: url("../img/popup/gym/josei.webp");
    background-repeat: no-repeat;
    background-size: 281%;
    background-position: top calc(-28vw / var(--sp)) left
      calc(-58vw / var(--sp));
  }

  #gym_popup .area::before {
    position: absolute;
    z-index: 1;
    display: block;
    content: "";
    background:
      linear-gradient(
        to bottom,
        rgba(255, 67, 87, 0.2) 0%,
        rgba(255, 67, 87, 0) 100%
      ),
      linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0.8) 0%,
        rgba(255, 255, 255, 0) 100%
      );
    width: 100%;
    height: calc(260vw / var(--sp));
    top: 0;
    left: 0;
    pointer-events: none;
  }

  #gym_popup .area ul.swiper-wrapper li .gym_map {
    position: absolute;
    width: calc(144vw / var(--sp));
    height: calc(70vw / var(--sp));
    bottom: calc(40vw / var(--sp));
    left: calc(25vw / var(--sp));
  }
}

/************************************
#studio_popup
************************************/
@media screen and (min-width: 1366px) {
  #studio_popup #ejlight {
    background-image: url("../img/popup/studio/ejlight.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #ejlight .ejlight01 .copy {
    position: absolute;
    width: 306px;
    top: 130px;
    left: 15px;
  }

  #studio_popup #ejlight .ejlight01 .data {
    position: absolute;
    width: 179px;
    bottom: 50px;
    left: 8px;
    z-index: 1;
  }

  #studio_popup #ejlight .ejlight01 .next,
  #studio_popup #abs .abs01 .next,
  #studio_popup #zumba .zumba01 .next {
    position: absolute;
    background: rgba(255, 255, 255, 0.9);
    border-radius: calc(60px / 2) 0 0 calc(60px / 2);
    width: 250px;
    height: 60px;
    bottom: 45px;
    right: 0;
    transition: var(--hover_transition);
  }

  #studio_popup #ejlight .ejlight01 .next:hover,
  #studio_popup #abs .abs01 .next:hover,
  #studio_popup #zumba .zumba01 .next:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #studio_popup #ejlight .ejlight01 .next p,
  #studio_popup #abs .abs01 .next p,
  #studio_popup #zumba .zumba01 .next p {
    position: absolute;
    color: var(--bw1);
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    text-align: center;
    top: 50%;
    left: 44px;
    transform: translateY(-50%);
  }

  #studio_popup #ejlight .ejlight01 .next p span,
  #studio_popup #abs .abs01 .next p span,
  #studio_popup #zumba .zumba01 .next p span {
    font-size: 18px;
  }

  #studio_popup #ejlight .ejlight01 .next i,
  #studio_popup #abs .abs01 .next i,
  #studio_popup #zumba .zumba01 .next i {
    position: absolute;
    align-content: center;
    display: block;
    color: var(--bw6);
    font-size: 20px;
    line-height: 1em;
    text-align: center;
    border-radius: 4px;
    width: 40px;
    height: 40px;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
  }

  #studio_popup #ejlight .ejlight01 .next i {
    background: #fb3390;
  }

  #studio_popup #abs .abs01 .next i {
    background: #ff0000;
  }

  #studio_popup #zumba .zumba01 .next i {
    background: #ff6d00;
  }

  #studio_popup #ejlight .ejlight02 .point,
  #studio_popup #abs .abs02 .point,
  #studio_popup #zumba .zumba02 .point {
    position: absolute;
    overflow: hidden;
    border-radius: 10px;
    width: 340px;
    bottom: 100px;
    left: 50%;
    transform: translateX(-50%);
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun,
  #studio_popup #abs .abs02 .point .kokogamorefun,
  #studio_popup #zumba .zumba02 .point .kokogamorefun {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.7);
    width: 100%;
    padding: 23px 20px 20px;
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .instructor,
  #studio_popup #abs .abs02 .point .kokogamorefun .instructor,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .instructor {
    width: 80px;
    height: auto;
    object-fit: contain;
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi {
    position: relative;
    box-sizing: border-box;
    background: var(--holiday2);
    border-radius: 10px;
    width: 210px;
    height: 120px;
    padding-top: 32px;
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi::before,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi::before,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/studio_kokogamorefun_fukidashi.webp")
      no-repeat;
    background-size: 100% 100%;
    width: 18.6px;
    height: 17.4px;
    top: 50%;
    left: calc(-18.6px / 2);
    transform: translateY(-50%);
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi h4,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi h4,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi h4 {
    position: absolute;
    width: 157px;
    top: -8px;
    left: 11px;
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi h4 img,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi h4 img,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi h4 img {
    width: 100%;
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi p,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi p,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi p {
    position: relative;
    z-index: 1;
    color: var(--bw6);
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    text-align: justify;
    width: 190px;
    margin: 0 auto;
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi p span,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi p span,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi p span {
    font-weight: 600;
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku,
  #studio_popup #abs .abs02 .point .keizoku,
  #studio_popup #zumba .zumba02 .point .keizoku {
    background: var(--bw6);
    width: 100%;
    padding: 10px 0 15px;
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku h4,
  #studio_popup #abs .abs02 .point .keizoku h4,
  #studio_popup #zumba .zumba02 .point .keizoku h4 {
    display: inline-block;
    background: linear-gradient(
      to top,
      var(--studio) 0%,
      var(--studio) 2px,
      transparent 2px,
      transparent 100%
    );
    color: var(--studio);
    font-size: 20px;
    font-weight: 600;
    line-height: 30px;
    text-align: left;
    margin: 0 0 13px 15px;
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku h4 span,
  #studio_popup #abs .abs02 .point .keizoku h4 span,
  #studio_popup #zumba .zumba02 .point .keizoku h4 span {
    font-size: 18px;
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku ol,
  #studio_popup #abs .abs02 .point .keizoku ol,
  #studio_popup #zumba .zumba02 .point .keizoku ol {
    display: flex;
    flex-direction: column;
    gap: 19px 0;
    width: 305px;
    margin: 0 auto;
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku ol li,
  #studio_popup #abs .abs02 .point .keizoku ol li,
  #studio_popup #zumba .zumba02 .point .keizoku ol li {
    position: relative;
    box-sizing: border-box;
    color: var(--bw1);
    font-size: 16px;
    font-weight: 600;
    line-height: 30px;
    text-align: left;
    width: 100%;
    height: 30px;
    padding-left: 40px;
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku ol li::before,
  #studio_popup #abs .abs02 .point .keizoku ol li::before,
  #studio_popup #zumba .zumba02 .point .keizoku ol li::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--studio);
    border-radius: calc(30px / 2);
    width: 30px;
    height: 30px;
    top: 0;
    left: 0;
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku ol li::after,
  #studio_popup #abs .abs02 .point .keizoku ol li::after,
  #studio_popup #zumba .zumba02 .point .keizoku ol li::after {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/studio_kokogamorefun_keizoku.webp")
      no-repeat;
    background-size: 100% 100%;
    width: 24.5px;
    height: 32px;
    top: -6px;
    left: 2px;
  }

  #studio_popup #ejlight .ejlight02 .prev,
  #studio_popup #abs .abs02 .prev,
  #studio_popup #zumba .zumba02 .prev {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: calc(40px / 2);
    width: 40px;
    height: 40px;
    top: auto;
    bottom: 40px;
    left: auto;
    right: 25px;
    transition: var(--hover_transition);
  }

  #studio_popup #ejlight .ejlight02 .prev i,
  #studio_popup #abs .abs02 .prev i,
  #studio_popup #zumba .zumba02 .prev i {
    color: var(--bw1);
    font-size: 14px;
  }

  #studio_popup #ejlight .ejlight02 .prev:hover,
  #studio_popup #abs .abs02 .prev:hover,
  #studio_popup #zumba .zumba02 .prev:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #studio_popup #abs {
    background-image: url("../img/popup/studio/abs.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #abs .abs01 .copy {
    position: absolute;
    width: 178px;
    top: 145px;
    left: 20px;
  }

  #studio_popup #abs .abs01 .data {
    position: absolute;
    width: 188px;
    bottom: 50px;
    left: 8px;
    z-index: 1;
  }

  #studio_popup #zumba {
    background-image: url("../img/popup/studio/zumba.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #zumba .zumba01 .copy {
    position: absolute;
    width: 251px;
    top: 122px;
    left: 20px;
  }

  #studio_popup #zumba .zumba01 .data {
    position: absolute;
    width: 173px;
    bottom: 50px;
    left: 17px;
    z-index: 1;
  }

  #studio_popup #beast .beast01 {
    background-image: url("../img/popup/studio/beast.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #beast .beast02 {
    background-image: url("../img/popup/studio/beast_blue.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #beast .beast03 {
    background-image: url("../img/popup/studio/beast_red.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #beast .beast04 {
    background-image: url("../img/popup/studio/beast_yellow.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #beast .beast05 {
    background-image: url("../img/popup/studio/beast_cmf.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup .area .blur {
    position: absolute;
    z-index: 1;
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    pointer-events: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transition: var(--hover_transition);
  }

  #studio_popup #other {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    background-image: url("../img/popup/studio/program_back.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: 733px;
    padding-top: 24px;
  }

  #studio_popup #other::after {
    position: absolute;
    display: block;
    content: "";
    background-image: url("../img/popup/studio/program_back_fukidashi.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: 40px;
    bottom: 0;
  }

  #studio_popup #other h3 {
    width: 260px;
    margin: 0 auto;
  }

  #studio_popup #other h3 img {
    width: 100%;
  }

  #studio_popup #other .floric {
    position: absolute;
    width: 235px;
    top: 144px;
    left: 22px;
  }

  #studio_popup #other .fitabody {
    position: absolute;
    width: 177px;
    top: 155px;
    right: 3px;
  }

  #studio_popup #other .finepilates {
    position: absolute;
    width: 319px;
    top: 240px;
    left: -14px;
  }

  #studio_popup #other .rockkintore {
    position: absolute;
    width: 309px;
    bottom: 80px;
    right: -78px;
  }

  #studio_popup #other .z180 {
    position: absolute;
    width: 470px;
    bottom: -19px;
    left: -139px;
  }

  #studio_popup #program_search {
    width: 100%;
    margin-bottom: 10px;
  }

  #studio_popup #program_search .search {
    background: var(--bw6);
    width: 100%;
    padding: 40px 0 20px;
  }

  #studio_popup #program_search .search h3 {
    position: relative;
    color: var(--bw1);
    font-size: 14px;
    font-weight: 400;
    line-height: 26px;
    text-align: center;
    width: 100%;
    margin-bottom: 20px;
  }

  #studio_popup #program_search .search h3::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/search_1.webp") no-repeat;
    background-size: 100% 100%;
    width: 43px;
    height: 106px;
    bottom: 0;
    left: 25px;
  }

  #studio_popup #program_search .search h3::after {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/search_2.webp") no-repeat;
    background-size: 100% 100%;
    width: 44px;
    height: 98px;
    bottom: 0;
    right: 25px;
  }

  #studio_popup #program_search .search h3 span {
    font-size: 22px;
    font-weight: 600;
  }

  #studio_popup #program_search .search .checklist {
    width: 340px;
    margin: 0 auto;
  }

  #studio_popup #program_search .search .checklist h4 {
    align-content: center;
    background: #45c574;
    color: var(--bw6);
    font-size: 22px;
    font-weight: 600;
    line-height: 1em;
    text-align: center;
    width: 100%;
    height: 36px;
  }

  #studio_popup #program_search .search .checklist .select {
    background: #f3fbf6;
    width: 100%;
    padding: 25px 0;
  }

  #studio_popup #program_search .search .checklist .select ul {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 60px;
    width: 280px;
    margin: 0 auto;
  }

  #studio_popup #program_search .search .checklist .select ul li {
    width: auto;
    height: 20px;
  }

  #studio_popup #program_search .search .checklist .select ul li label {
    display: flex;
    color: var(--bw1);
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    text-align: left;
  }

  #studio_popup #program_search .search .checklist .select ul li label input {
    appearance: none;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid #c5c5c5;
    border-radius: 2px;
    width: 20px;
    height: 20px;
    margin-right: 10px;
  }

  #studio_popup
    #program_search
    .search
    .checklist
    .select
    ul
    li
    label
    input:checked {
    position: relative;
    background: #c5c5c5;
  }

  #studio_popup
    #program_search
    .search
    .checklist
    .select
    ul
    li
    label
    input:checked::after {
    position: absolute;
    content: "";
    top: 5px;
    left: 3px;
    width: 12px;
    height: 6px;
    border-bottom: 2px solid var(--bw6);
    border-left: 2px solid var(--bw6);
    transform: rotate(-45deg);
  }

  #studio_popup #program_search .result {
    background: var(--bw5);
    width: 100%;
    padding: 45px 0 30px;
  }

  #studio_popup #program_search .result .swiper {
    position: relative;
    width: 100%;
    height: 680px;
    padding: 0 24px;
    margin-bottom: 12px;
  }

  #studio_popup #program_search .result .swiper .result_wrapper {
    width: 340px;
    height: 630px;
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li {
    background: var(--bw6);
    border-radius: 0 0 20px 20px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    margin-right: 15px;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li:last-child {
    margin-right: 0;
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .movie {
    position: relative;
    width: 100% !important;
    height: calc(340px / 16 * 9) !important;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .new_program {
    position: absolute;
    z-index: 1;
    display: block;
    box-sizing: border-box;
    background: #f60000;
    border: 1px solid var(--bw6);
    color: #ffffff;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: 13px;
    line-height: 16px;
    font-weight: 700;
    text-align: center;
    width: 110px;
    height: 18px;
    border-radius: 9px;
    top: 10px;
    left: 10px;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .play {
    position: absolute;
    z-index: 1;
    display: block;
    box-sizing: border-box;
    border: 6.6px solid #ffffff;
    border-radius: 33px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.9);
    width: 66px;
    height: 66px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .play::after {
    position: absolute;
    z-index: 1;
    display: block;
    content: "";
    filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.9));
    border-top: 13px solid transparent;
    border-bottom: 13px solid transparent;
    border-left: 20px solid #ffffff;
    width: 0;
    height: 0;
    top: 50%;
    left: 36%;
    transform: translateY(-50%);
    pointer-events: none;
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .movie a {
    width: 100%;
    height: 100%;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    a
    img {
    width: 100%;
    height: 100%;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    iframe {
    width: 100%;
    height: 100%;
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .title {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    background: #f2f8fc;
    width: 100%;
    height: 45px;
    padding: 0 15px 0 25px;
    margin-bottom: 23px;
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .title h4 {
    color: var(--bw1);
    font-size: 22px;
    line-height: 1em;
    font-weight: 600;
    text-align: left;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time {
    color: var(--bw1);
    font-size: 12px;
    line-height: 15px;
    font-weight: 400;
    text-align: left;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time
    span.bold {
    font-weight: 600;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time
    span.big {
    font-size: 16px;
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .point {
    width: 100%;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.7);
    width: 100%;
    padding: 0 20px 0;
    margin-bottom: 20px;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .instructor {
    width: 80px;
    height: auto;
    object-fit: contain;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi {
    position: relative;
    box-sizing: border-box;
    background: var(--holiday2);
    border-radius: 10px;
    width: 210px;
    height: 130px;
    padding-top: 32px;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/studio_kokogamorefun_fukidashi.webp")
      no-repeat;
    background-size: 100% 100%;
    width: 18.6px;
    height: 17.4px;
    top: 50%;
    left: calc(-18.6px / 2);
    transform: translateY(-50%);
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    h4 {
    position: absolute;
    width: 157px;
    top: -8px;
    left: 11px;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    h4
    img {
    width: 100%;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    p {
    position: relative;
    z-index: 1;
    color: var(--bw6);
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    text-align: justify;
    width: 190px;
    margin: 0 auto;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    p
    span {
    font-weight: 600;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .text {
    color: var(--bw1);
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    text-align: justify;
    width: 290px;
    border-bottom: 1px solid #7d7d7d;
    padding-bottom: 20px;
    margin: 0 auto 15px;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category {
    display: flex;
    flex-wrap: wrap;
    gap: 0 15px;
    width: 290px;
    margin: 0 auto;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li {
    position: relative;
    color: var(--bw2);
    font-size: 12px;
    font-weight: 400;
    line-height: 22px;
    text-align: left;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li::after {
    position: absolute;
    display: block;
    content: "／";
    color: var(--bw2);
    font-size: 12px;
    font-weight: 400;
    line-height: 22px;
    text-align: left;
    top: 0;
    right: -14px;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li:last-child::after {
    display: none;
  }

  #studio_popup #program_search .result .swiper .swiper-pagination {
    position: absolute;
    display: flex;
    gap: 8px;
    bottom: 0px;
    left: 24px;
    flex-wrap: wrap;
    width: 210px;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet {
    background: var(--bw3);
    border-radius: calc(16px / 2);
    width: 16px;
    height: 16px;
    margin: 0;
    opacity: 1;
    transition: var(--hover_transition);
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet:hover,
  #studio_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--holiday2);
    transition: var(--hover_transition);
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .thumb
    img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  #studio_popup #program_search .result .swiper .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: calc(40px / 2);
    width: 40px;
    height: 40px;
    top: auto;
    bottom: 0;
    left: auto;
    right: 79px;
  }

  #studio_popup #program_search .result .swiper .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: calc(40px / 2);
    width: 40px;
    height: 40px;
    top: auto;
    bottom: 0;
    left: auto;
    right: 24px;
  }

  #studio_popup #program_search .result .swiper .swiper-button-prev::after,
  #studio_popup #program_search .result .swiper .swiper-button-next::after {
    display: none;
  }

  #studio_popup #program_search .result .swiper .swiper-button-prev i,
  #studio_popup #program_search .result .swiper .swiper-button-next i {
    color: var(--bw1);
    font-size: 14px;
  }

  #studio_popup #program_search .result .pdf {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(255, 255, 255, 0.9);
    color: var(--bw2);
    font-size: 16px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc(48px / 2);
    width: 300px;
    height: 48px;
    margin: 0 auto;
    transition: var(--hover_transition);
  }

  #studio_popup #program_search .result .pdf i {
    position: absolute;
    color: var(--studio);
    font-size: 22px;
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: 13px;
    transform: translateY(-50%);
  }

  #studio_popup #beginner {
    background: var(--bw5);
    width: 100%;
    padding: 85px 0 40px;
  }

  #studio_popup #beginner .title {
    width: 340px;
    margin: 0 auto 20px;
  }

  #studio_popup #beginner .title img {
    width: 100%;
    margin-bottom: 35px;
  }

  #studio_popup #beginner .title .taipa {
    display: block;
    align-content: center;
    background: var(--studio);
    color: var(--bw6);
    font-size: 18px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 180px;
    height: 28px;
    clip-path: polygon(
      6px 0px,
      calc(100% - 6px) 0px,
      100% 6px,
      100% calc(100% - 6px),
      calc(100% - 6px) 100%,
      6px 100%,
      0px calc(100% - 6px),
      0px 6px
    );
    margin-bottom: 10px;
  }

  #studio_popup #beginner .title h3 {
    color: var(--studio);
    font-size: 28px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
  }

  #studio_popup #beginner .text {
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: left;
    width: 340px;
    margin: 0 auto 20px;
  }

  #studio_popup #beginner .text span {
    font-weight: var(--bold);
  }

  #studio_popup #beginner .enquete {
    background: var(--bw6);
    border-radius: 10px;
    width: 340px;
    padding: 25px 0 50px;
    margin: 0 auto;
  }

  #studio_popup #beginner .enquete h4 {
    color: var(--studio);
    font-size: 22px;
    line-height: 32px;
    font-weight: var(--bold);
    text-align: left;
    width: 290px;
    margin: 0 auto 20px;
  }

  #studio_popup #beginner .enquete .favorite {
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--bold);
    text-align: left;
    width: 290px;
    margin: 0 auto 30px;
  }

  #studio_popup #beginner .enquete .favorite span {
    color: var(--studio);
  }

  #studio_popup #beginner .enquete ul {
    display: flex;
    flex-direction: column;
    gap: 55px 0;
    width: 290px;
    margin: 0 auto;
  }

  #studio_popup #beginner .enquete ul li {
    position: relative;
    border-radius: 10px;
    width: 100%;
    padding: 30px 0;
  }

  #studio_popup #beginner .enquete ul li.kokogasuki_1 {
    background: #fff2f4;
  }

  #studio_popup #beginner .enquete ul li.kokogasuki_2 {
    background: #ebf5fb;
  }

  #studio_popup #beginner .enquete ul li h5 {
    position: absolute;
    width: 91px;
    top: -12px;
    left: -5px;
  }

  #studio_popup #beginner .enquete ul li h5 img {
    width: 100%;
  }

  #studio_popup #beginner .enquete ul li p {
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: left;
    width: 240px;
    margin: 0 auto;
  }

  #studio_popup #beginner .enquete ul li.kokogasuki_1 p {
    color: #fb5e77;
  }

  #studio_popup #beginner .enquete ul li.kokogasuki_2 p {
    color: #0084cb;
  }

  #studio_popup #beginner .enquete ul li .user {
    position: absolute;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    width: 128px;
    bottom: -26px;
    right: -35px;
  }

  #studio_popup #beginner .enquete ul li .user h6 {
    box-sizing: border-box;
    color: var(--bw2);
    font-size: 13px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    border-bottom: 2px solid var(--bw3);
    padding-bottom: 6px;
  }

  #studio_popup #beginner .enquete ul li .user img.female {
    width: 55px;
  }

  #studio_popup #beginner .enquete ul li .user img.male {
    width: 59px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #studio_popup #ejlight {
    background-image: url("../img/popup/studio/ejlight.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #ejlight .ejlight01 .copy {
    position: absolute;
    width: calc(306vw / var(--tablet));
    top: calc(130vw / var(--tablet));
    left: calc(15vw / var(--tablet));
  }

  #studio_popup #ejlight .ejlight01 .data {
    position: absolute;
    width: calc(179vw / var(--tablet));
    bottom: calc(50vw / var(--tablet));
    left: calc(8vw / var(--tablet));
    z-index: 1;
  }

  #studio_popup #ejlight .ejlight01 .next,
  #studio_popup #abs .abs01 .next,
  #studio_popup #zumba .zumba01 .next {
    position: absolute;
    background: rgba(255, 255, 255, 0.9);
    border-radius: calc((60vw / 2) / var(--tablet)) 0 0
      calc((60vw / 2) / var(--tablet));
    width: calc(250vw / var(--tablet));
    height: calc(60vw / var(--tablet));
    bottom: calc(45vw / var(--tablet));
    right: 0;
    transition: var(--hover_transition);
  }

  #studio_popup #ejlight .ejlight01 .next:hover,
  #studio_popup #abs .abs01 .next:hover,
  #studio_popup #zumba .zumba01 .next:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #studio_popup #ejlight .ejlight01 .next p,
  #studio_popup #abs .abs01 .next p,
  #studio_popup #zumba .zumba01 .next p {
    position: absolute;
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    font-weight: 600;
    line-height: calc(20vw / var(--tablet));
    text-align: center;
    top: 50%;
    left: calc(44vw / var(--tablet));
    transform: translateY(-50%);
  }

  #studio_popup #ejlight .ejlight01 .next p span,
  #studio_popup #abs .abs01 .next p span,
  #studio_popup #zumba .zumba01 .next p span {
    font-size: calc(18vw / var(--tablet));
  }

  #studio_popup #ejlight .ejlight01 .next i,
  #studio_popup #abs .abs01 .next i,
  #studio_popup #zumba .zumba01 .next i {
    position: absolute;
    align-content: center;
    display: block;
    color: var(--bw6);
    font-size: calc(20vw / var(--tablet));
    line-height: 1em;
    text-align: center;
    border-radius: calc(4vw / var(--tablet));
    width: calc(40vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: 50%;
    right: calc(10vw / var(--tablet));
    transform: translateY(-50%);
  }

  #studio_popup #ejlight .ejlight01 .next i {
    background: #fb3390;
  }

  #studio_popup #abs .abs01 .next i {
    background: #ff0000;
  }

  #studio_popup #zumba .zumba01 .next i {
    background: #ff6d00;
  }

  #studio_popup #ejlight .ejlight02 .point,
  #studio_popup #abs .abs02 .point,
  #studio_popup #zumba .zumba02 .point {
    position: absolute;
    overflow: hidden;
    border-radius: calc(10vw / var(--tablet));
    width: calc(340vw / var(--tablet));
    bottom: calc(100vw / var(--tablet));
    left: 50%;
    transform: translateX(-50%);
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun,
  #studio_popup #abs .abs02 .point .kokogamorefun,
  #studio_popup #zumba .zumba02 .point .kokogamorefun {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.7);
    width: 100%;
    padding: calc(23vw / var(--tablet)) calc(20vw / var(--tablet))
      calc(20vw / var(--tablet));
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .instructor,
  #studio_popup #abs .abs02 .point .kokogamorefun .instructor,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .instructor {
    width: calc(80vw / var(--tablet));
    height: auto;
    object-fit: contain;
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi {
    position: relative;
    box-sizing: border-box;
    background: var(--holiday2);
    border-radius: calc(10vw / var(--tablet));
    width: calc(210vw / var(--tablet));
    height: calc(120vw / var(--tablet));
    padding-top: calc(32vw / var(--tablet));
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi::before,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi::before,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/studio_kokogamorefun_fukidashi.webp")
      no-repeat;
    background-size: 100% 100%;
    width: calc(18.6vw / var(--tablet));
    height: calc(17.4vw / var(--tablet));
    top: 50%;
    left: calc((-18.6vw / var(--tablet)) / 2);
    transform: translateY(-50%);
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi h4,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi h4,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi h4 {
    position: absolute;
    width: calc(157vw / var(--tablet));
    top: calc(-8vw / var(--tablet));
    left: calc(11vw / var(--tablet));
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi h4 img,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi h4 img,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi h4 img {
    width: 100%;
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi p,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi p,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi p {
    position: relative;
    z-index: 1;
    color: var(--bw6);
    font-size: calc(14vw / var(--tablet));
    font-weight: 400;
    line-height: calc(20vw / var(--tablet));
    text-align: justify;
    width: calc(190vw / var(--tablet));
    margin: 0 auto;
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi p span,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi p span,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi p span {
    font-weight: 600;
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku,
  #studio_popup #abs .abs02 .point .keizoku,
  #studio_popup #zumba .zumba02 .point .keizoku {
    background: var(--bw6);
    width: 100%;
    padding: calc(10vw / var(--tablet)) 0 calc(15vw / var(--tablet));
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku h4,
  #studio_popup #abs .abs02 .point .keizoku h4,
  #studio_popup #zumba .zumba02 .point .keizoku h4 {
    display: inline-block;
    background: linear-gradient(
      to top,
      var(--studio) 0%,
      var(--studio) calc(2vw / var(--tablet)),
      transparent calc(2vw / var(--tablet)),
      transparent 100%
    );
    color: var(--studio);
    font-size: calc(20vw / var(--tablet));
    font-weight: 600;
    line-height: calc(30vw / var(--tablet));
    text-align: left;
    margin: 0 0 calc(13vw / var(--tablet)) calc(15vw / var(--tablet));
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku h4 span,
  #studio_popup #abs .abs02 .point .keizoku h4 span,
  #studio_popup #zumba .zumba02 .point .keizoku h4 span {
    font-size: calc(18vw / var(--tablet));
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku ol,
  #studio_popup #abs .abs02 .point .keizoku ol,
  #studio_popup #zumba .zumba02 .point .keizoku ol {
    display: flex;
    flex-direction: column;
    gap: calc(19vw / var(--tablet)) 0;
    width: calc(305vw / var(--tablet));
    margin: 0 auto;
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku ol li,
  #studio_popup #abs .abs02 .point .keizoku ol li,
  #studio_popup #zumba .zumba02 .point .keizoku ol li {
    position: relative;
    box-sizing: border-box;
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    font-weight: 600;
    line-height: calc(30vw / var(--tablet));
    text-align: left;
    width: 100%;
    height: calc(30vw / var(--tablet));
    padding-left: calc(40vw / var(--tablet));
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku ol li::before,
  #studio_popup #abs .abs02 .point .keizoku ol li::before,
  #studio_popup #zumba .zumba02 .point .keizoku ol li::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--studio);
    border-radius: calc((30vw / 2) / var(--tablet));
    width: calc(30vw / var(--tablet));
    height: calc(30vw / var(--tablet));
    top: 0;
    left: 0;
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku ol li::after,
  #studio_popup #abs .abs02 .point .keizoku ol li::after,
  #studio_popup #zumba .zumba02 .point .keizoku ol li::after {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/studio_kokogamorefun_keizoku.webp")
      no-repeat;
    background-size: 100% 100%;
    width: calc(24.5vw / var(--tablet));
    height: calc(32vw / var(--tablet));
    top: calc(-6vw / var(--tablet));
    left: calc(2vw / var(--tablet));
  }

  #studio_popup #ejlight .ejlight02 .prev,
  #studio_popup #abs .abs02 .prev,
  #studio_popup #zumba .zumba02 .prev {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--tablet));
    width: calc(40vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: auto;
    bottom: calc(40vw / var(--tablet));
    left: auto;
    right: calc(25vw / var(--tablet));
    transition: var(--hover_transition);
  }

  #studio_popup #ejlight .ejlight02 .prev i,
  #studio_popup #abs .abs02 .prev i,
  #studio_popup #zumba .zumba02 .prev i {
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
  }

  #studio_popup #ejlight .ejlight02 .prev:hover,
  #studio_popup #abs .abs02 .prev:hover,
  #studio_popup #zumba .zumba02 .prev:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #studio_popup #abs {
    background-image: url("../img/popup/studio/abs.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #abs .abs01 .copy {
    position: absolute;
    width: calc(178vw / var(--tablet));
    top: calc(145vw / var(--tablet));
    left: calc(20vw / var(--tablet));
  }

  #studio_popup #abs .abs01 .data {
    position: absolute;
    width: calc(188vw / var(--tablet));
    bottom: calc(50vw / var(--tablet));
    left: calc(8vw / var(--tablet));
    z-index: 1;
  }

  #studio_popup #zumba {
    background-image: url("../img/popup/studio/zumba.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #zumba .zumba01 .copy {
    position: absolute;
    width: calc(251vw / var(--tablet));
    top: calc(122vw / var(--tablet));
    left: calc(20vw / var(--tablet));
  }

  #studio_popup #zumba .zumba01 .data {
    position: absolute;
    width: calc(173vw / var(--tablet));
    bottom: calc(50vw / var(--tablet));
    left: calc(17vw / var(--tablet));
    z-index: 1;
  }

  #studio_popup #beast .beast01 {
    background-image: url("../img/popup/studio/beast.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #beast .beast02 {
    background-image: url("../img/popup/studio/beast_blue.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #beast .beast03 {
    background-image: url("../img/popup/studio/beast_red.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #beast .beast04 {
    background-image: url("../img/popup/studio/beast_yellow.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #beast .beast05 {
    background-image: url("../img/popup/studio/beast_cmf.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup .area .blur {
    position: absolute;
    z-index: 1;
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    pointer-events: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transition: var(--hover_transition);
  }

  #studio_popup #other {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    background-image: url("../img/popup/studio/program_back.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: calc(733vw / var(--tablet));
    padding-top: calc(24vw / var(--tablet));
  }

  #studio_popup #other::after {
    position: absolute;
    display: block;
    content: "";
    background-image: url("../img/popup/studio/program_back_fukidashi.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: calc(40vw / var(--tablet));
    bottom: 0;
  }

  #studio_popup #other h3 {
    width: calc(260vw / var(--tablet));
    margin: 0 auto;
  }

  #studio_popup #other h3 img {
    width: 100%;
  }

  #studio_popup #other .floric {
    position: absolute;
    width: calc(235vw / var(--tablet));
    top: calc(144vw / var(--tablet));
    left: calc(22vw / var(--tablet));
  }

  #studio_popup #other .fitabody {
    position: absolute;
    width: calc(177vw / var(--tablet));
    top: calc(155vw / var(--tablet));
    right: calc(3vw / var(--tablet));
  }

  #studio_popup #other .finepilates {
    position: absolute;
    width: calc(319vw / var(--tablet));
    top: calc(240vw / var(--tablet));
    left: calc(-14vw / var(--tablet));
  }

  #studio_popup #other .rockkintore {
    position: absolute;
    width: calc(309vw / var(--tablet));
    bottom: calc(80vw / var(--tablet));
    right: calc(-78vw / var(--tablet));
  }

  #studio_popup #other .z180 {
    position: absolute;
    width: calc(470vw / var(--tablet));
    bottom: calc(-19vw / var(--tablet));
    left: calc(-139vw / var(--tablet));
  }

  #studio_popup #program_search {
    width: 100%;
    margin-bottom: calc(10vw / var(--tablet));
  }

  #studio_popup #program_search .search {
    background: var(--bw6);
    width: 100%;
    padding: calc(40vw / var(--tablet)) 0 calc(20vw / var(--tablet));
  }

  #studio_popup #program_search .search h3 {
    position: relative;
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    font-weight: 400;
    line-height: calc(26vw / var(--tablet));
    text-align: center;
    width: 100%;
    margin-bottom: calc(20vw / var(--tablet));
  }

  #studio_popup #program_search .search h3::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/search_1.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(43vw / var(--tablet));
    height: calc(106vw / var(--tablet));
    bottom: 0;
    left: calc(25vw / var(--tablet));
  }

  #studio_popup #program_search .search h3::after {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/search_2.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(44vw / var(--tablet));
    height: calc(98vw / var(--tablet));
    bottom: 0;
    right: calc(25vw / var(--tablet));
  }

  #studio_popup #program_search .search h3 span {
    font-size: calc(22vw / var(--tablet));
    font-weight: 600;
  }

  #studio_popup #program_search .search .checklist {
    width: calc(340vw / var(--tablet));
    margin: 0 auto;
  }

  #studio_popup #program_search .search .checklist h4 {
    align-content: center;
    background: #45c574;
    color: var(--bw6);
    font-size: calc(22vw / var(--tablet));
    font-weight: 600;
    line-height: 1em;
    text-align: center;
    width: 100%;
    height: calc(36vw / var(--tablet));
  }

  #studio_popup #program_search .search .checklist .select {
    background: #f3fbf6;
    width: 100%;
    padding: calc(25vw / var(--tablet)) 0;
  }

  #studio_popup #program_search .search .checklist .select ul {
    display: flex;
    flex-wrap: wrap;
    gap: calc(20vw / var(--tablet)) calc(60vw / var(--tablet));
    width: calc(280vw / var(--tablet));
    margin: 0 auto;
  }

  #studio_popup #program_search .search .checklist .select ul li {
    width: auto;
    height: calc(20vw / var(--tablet));
  }

  #studio_popup #program_search .search .checklist .select ul li label {
    display: flex;
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    font-weight: 400;
    line-height: calc(20vw / var(--tablet));
    text-align: left;
  }

  #studio_popup #program_search .search .checklist .select ul li label input {
    appearance: none;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid #c5c5c5;
    border-radius: calc(2vw / var(--tablet));
    width: calc(20vw / var(--tablet));
    height: calc(20vw / var(--tablet));
    margin-right: calc(10vw / var(--tablet));
  }

  #studio_popup
    #program_search
    .search
    .checklist
    .select
    ul
    li
    label
    input:checked {
    position: relative;
    background: #c5c5c5;
  }

  #studio_popup
    #program_search
    .search
    .checklist
    .select
    ul
    li
    label
    input:checked::after {
    position: absolute;
    content: "";
    top: calc(5vw / var(--tablet));
    left: calc(3vw / var(--tablet));
    width: calc(12vw / var(--tablet));
    height: calc(6vw / var(--tablet));
    border-bottom: calc(2vw / var(--tablet)) solid var(--bw6);
    border-left: calc(2vw / var(--tablet)) solid var(--bw6);
    transform: rotate(-45deg);
  }

  #studio_popup #program_search .result {
    background: var(--bw5);
    width: 100%;
    padding: calc(45vw / var(--tablet)) 0 calc(30vw / var(--tablet));
  }

  #studio_popup #program_search .result .swiper {
    position: relative;
    width: 100%;
    height: calc(680vw / var(--tablet));
    padding: 0 calc(24vw / var(--tablet));
    margin-bottom: calc(12vw / var(--tablet));
  }

  #studio_popup #program_search .result .swiper .result_wrapper {
    width: calc(340vw / var(--tablet));
    height: calc(630vw / var(--tablet));
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li {
    background: var(--bw6);
    border-radius: 0 0 calc(20vw / var(--tablet)) calc(20vw / var(--tablet));
    box-shadow: 0 0 calc(10vw / var(--tablet)) rgba(0, 0, 0, 0.3);
    margin-right: calc(15vw / var(--tablet));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li:last-child {
    margin-right: 0;
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .movie {
    position: relative;
    width: 100% !important;
    height: calc((340vw / var(--tablet)) / 16 * 9) !important;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .new_program {
    position: absolute;
    z-index: 1;
    display: block;
    box-sizing: border-box;
    background: #f60000;
    border: calc(1vw / var(--tablet)) solid var(--bw6);
    color: #ffffff;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: calc(13vw / var(--tablet));
    line-height: calc(16vw / var(--tablet));
    font-weight: 700;
    text-align: center;
    width: calc(110vw / var(--tablet));
    height: calc(18vw / var(--tablet));
    border-radius: calc(9vw / var(--tablet));
    top: calc(10vw / var(--tablet));
    left: calc(10vw / var(--tablet));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .play {
    position: absolute;
    z-index: 1;
    display: block;
    box-sizing: border-box;
    border: calc(6.6vw / var(--tablet)) solid #ffffff;
    border-radius: calc(33vw / var(--tablet));
    box-shadow: 0 calc(2vw / var(--tablet)) calc(2vw / var(--tablet))
      rgba(0, 0, 0, 0.9);
    width: calc(66vw / var(--tablet));
    height: calc(66vw / var(--tablet));
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .play::after {
    position: absolute;
    z-index: 1;
    display: block;
    content: "";
    filter: drop-shadow(
      0 calc(2vw / var(--tablet)) calc(2vw / var(--tablet)) rgba(0, 0, 0, 0.9)
    );
    border-top: calc(13vw / var(--tablet)) solid transparent;
    border-bottom: calc(13vw / var(--tablet)) solid transparent;
    border-left: calc(20vw / var(--tablet)) solid #ffffff;
    width: 0;
    height: 0;
    top: 50%;
    left: 36%;
    transform: translateY(-50%);
    pointer-events: none;
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .movie a {
    width: 100%;
    height: 100%;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    a
    img {
    width: 100%;
    height: 100%;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    iframe {
    width: 100%;
    height: 100%;
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .title {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    background: #f2f8fc;
    width: 100%;
    height: calc(45vw / var(--tablet));
    padding: 0 calc(15vw / var(--tablet)) 0 calc(25vw / var(--tablet));
    margin-bottom: calc(23vw / var(--tablet));
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .title h4 {
    color: var(--bw1);
    font-size: calc(22vw / var(--tablet));
    line-height: 1em;
    font-weight: 600;
    text-align: left;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time {
    color: var(--bw1);
    font-size: calc(12vw / var(--tablet));
    line-height: calc(15vw / var(--tablet));
    font-weight: 400;
    text-align: left;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time
    span.bold {
    font-weight: 600;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time
    span.big {
    font-size: calc(16vw / var(--tablet));
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .point {
    width: 100%;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.7);
    width: 100%;
    padding: 0 calc(20vw / var(--tablet)) 0;
    margin-bottom: calc(20vw / var(--tablet));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .instructor {
    width: calc(80vw / var(--tablet));
    height: auto;
    object-fit: contain;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi {
    position: relative;
    box-sizing: border-box;
    background: var(--holiday2);
    border-radius: calc(10vw / var(--tablet));
    width: calc(210vw / var(--tablet));
    height: calc(130vw / var(--tablet));
    padding-top: calc(32vw / var(--tablet));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/studio_kokogamorefun_fukidashi.webp")
      no-repeat;
    background-size: 100% 100%;
    width: calc(18.6vw / var(--tablet));
    height: calc(17.4vw / var(--tablet));
    top: 50%;
    left: calc((-18.6vw / var(--tablet)) / 2);
    transform: translateY(-50%);
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    h4 {
    position: absolute;
    width: calc(157vw / var(--tablet));
    top: calc(-8vw / var(--tablet));
    left: calc(11vw / var(--tablet));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    h4
    img {
    width: 100%;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    p {
    position: relative;
    z-index: 1;
    color: var(--bw6);
    font-size: calc(14vw / var(--tablet));
    font-weight: 400;
    line-height: calc(18vw / var(--tablet));
    text-align: justify;
    width: calc(190vw / var(--tablet));
    margin: 0 auto;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    p
    span {
    font-weight: 600;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .text {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    font-weight: 400;
    line-height: calc(26vw / var(--tablet));
    text-align: justify;
    width: calc(290vw / var(--tablet));
    border-bottom: calc(1vw / var(--tablet)) solid #7d7d7d;
    padding-bottom: calc(20vw / var(--tablet));
    margin: 0 auto calc(15vw / var(--tablet));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category {
    display: flex;
    flex-wrap: wrap;
    gap: 0 calc(15vw / var(--tablet));
    width: calc(290vw / var(--tablet));
    margin: 0 auto;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li {
    position: relative;
    color: var(--bw2);
    font-size: calc(12vw / var(--tablet));
    font-weight: 400;
    line-height: calc(22vw / var(--tablet));
    text-align: left;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li::after {
    position: absolute;
    display: block;
    content: "／";
    color: var(--bw2);
    font-size: calc(12vw / var(--tablet));
    font-weight: 400;
    line-height: calc(22vw / var(--tablet));
    text-align: left;
    top: 0;
    right: calc(-14vw / var(--tablet));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li:last-child::after {
    display: none;
  }

  #studio_popup #program_search .result .swiper .swiper-pagination {
    position: absolute;
    display: flex;
    gap: calc(8vw / var(--tablet));
    bottom: calc(0vw / var(--tablet));
    left: calc(24vw / var(--tablet));
    width: calc(210vw / var(--tablet));
    flex-wrap: wrap;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet {
    background: var(--bw3);
    border-radius: calc((16vw / 2) / var(--tablet));
    width: calc(16vw / var(--tablet));
    height: calc(16vw / var(--tablet));
    margin: 0;
    opacity: 1;
    transition: var(--hover_transition);
  }
  
  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .thumb
    img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet:hover,
  #studio_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--holiday2);
    transition: var(--hover_transition);
  }

  #studio_popup #program_search .result .swiper .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--tablet));
    width: calc(40vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: auto;
    bottom: 0;
    left: auto;
    right: calc(79vw / var(--tablet));
  }

  #studio_popup #program_search .result .swiper .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--tablet));
    width: calc(40vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: auto;
    bottom: 0;
    left: auto;
    right: calc(24vw / var(--tablet));
  }

  #studio_popup #program_search .result .swiper .swiper-button-prev::after,
  #studio_popup #program_search .result .swiper .swiper-button-next::after {
    display: none;
  }

  #studio_popup #program_search .result .swiper .swiper-button-prev i,
  #studio_popup #program_search .result .swiper .swiper-button-next i {
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
  }

  #studio_popup #program_search .result .pdf {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(255, 255, 255, 0.9);
    color: var(--bw2);
    font-size: calc(16vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((48vw / 2) / var(--tablet));
    width: calc(300vw / var(--tablet));
    height: calc(48vw / var(--tablet));
    margin: 0 auto;
    transition: var(--hover_transition);
  }

  #studio_popup #program_search .result .pdf i {
    position: absolute;
    color: var(--studio);
    font-size: calc(22vw / var(--tablet));
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: calc(13vw / var(--tablet));
    transform: translateY(-50%);
  }

  #studio_popup #beginner {
    background: var(--bw5);
    width: 100%;
    padding: calc(85vw / var(--tablet)) 0 calc(40vw / var(--tablet));
  }

  #studio_popup #beginner .title {
    width: calc(340vw / var(--tablet));
    margin: 0 auto calc(20vw / var(--tablet));
  }

  #studio_popup #beginner .title img {
    width: 100%;
    margin-bottom: calc(35vw / var(--tablet));
  }

  #studio_popup #beginner .title .taipa {
    display: block;
    align-content: center;
    background: var(--studio);
    color: var(--bw6);
    font-size: calc(18vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: calc(180vw / var(--tablet));
    height: calc(28vw / var(--tablet));
    clip-path: polygon(
      calc(6vw / var(--tablet)) 0px,
      calc(100% - (6vw / var(--tablet))) 0px,
      100% calc(6vw / var(--tablet)),
      100% calc(100% - (6vw / var(--tablet))),
      calc(100% - (6vw / var(--tablet))) 100%,
      calc(6vw / var(--tablet)) 100%,
      0px calc(100% - (6vw / var(--tablet))),
      0px calc(6vw / var(--tablet))
    );
    margin-bottom: calc(10vw / var(--tablet));
  }

  #studio_popup #beginner .title h3 {
    color: var(--studio);
    font-size: calc(28vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
  }

  #studio_popup #beginner .text {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    width: calc(340vw / var(--tablet));
    margin: 0 auto calc(20vw / var(--tablet));
  }

  #studio_popup #beginner .text span {
    font-weight: var(--bold);
  }

  #studio_popup #beginner .enquete {
    background: var(--bw6);
    border-radius: calc(10vw / var(--tablet));
    width: calc(340vw / var(--tablet));
    padding: calc(25vw / var(--tablet)) 0 calc(50vw / var(--tablet));
    margin: 0 auto;
  }

  #studio_popup #beginner .enquete h4 {
    color: var(--studio);
    font-size: calc(22vw / var(--tablet));
    line-height: calc(32vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    width: calc(290vw / var(--tablet));
    margin: 0 auto calc(20vw / var(--tablet));
  }

  #studio_popup #beginner .enquete .favorite {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    width: calc(290vw / var(--tablet));
    margin: 0 auto calc(30vw / var(--tablet));
  }

  #studio_popup #beginner .enquete .favorite span {
    color: var(--studio);
  }

  #studio_popup #beginner .enquete ul {
    display: flex;
    flex-direction: column;
    gap: calc(55vw / var(--tablet)) 0;
    width: calc(290vw / var(--tablet));
    margin: 0 auto;
  }

  #studio_popup #beginner .enquete ul li {
    position: relative;
    border-radius: calc(10vw / var(--tablet));
    width: 100%;
    padding: calc(30vw / var(--tablet)) 0;
  }

  #studio_popup #beginner .enquete ul li.kokogasuki_1 {
    background: #fff2f4;
  }

  #studio_popup #beginner .enquete ul li.kokogasuki_2 {
    background: #ebf5fb;
  }

  #studio_popup #beginner .enquete ul li h5 {
    position: absolute;
    width: calc(91vw / var(--tablet));
    top: calc(-12vw / var(--tablet));
    left: calc(-5vw / var(--tablet));
  }

  #studio_popup #beginner .enquete ul li h5 img {
    width: 100%;
  }

  #studio_popup #beginner .enquete ul li p {
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    width: calc(240vw / var(--tablet));
    margin: 0 auto;
  }

  #studio_popup #beginner .enquete ul li.kokogasuki_1 p {
    color: #fb5e77;
  }

  #studio_popup #beginner .enquete ul li.kokogasuki_2 p {
    color: #0084cb;
  }

  #studio_popup #beginner .enquete ul li .user {
    position: absolute;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    width: calc(128vw / var(--tablet));
    bottom: calc(-26vw / var(--tablet));
    right: calc(-35vw / var(--tablet));
  }

  #studio_popup #beginner .enquete ul li .user h6 {
    box-sizing: border-box;
    color: var(--bw2);
    font-size: calc(13vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    border-bottom: calc(2vw / var(--tablet)) solid var(--bw3);
    padding-bottom: calc(6vw / var(--tablet));
  }

  #studio_popup #beginner .enquete ul li .user img.female {
    width: calc(55vw / var(--tablet));
  }

  #studio_popup #beginner .enquete ul li .user img.male {
    width: calc(59vw / var(--tablet));
  }
}

@media screen and (max-width: 767px) {
  #studio_popup #ejlight {
    background-image: url("../img/popup/studio/ejlight.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #ejlight .ejlight01 .copy {
    position: absolute;
    width: calc(306vw / var(--sp));
    top: calc(130vw / var(--sp));
    left: calc(15vw / var(--sp));
  }

  #studio_popup #ejlight .ejlight01 .data {
    position: absolute;
    width: calc(179vw / var(--sp));
    bottom: calc(50vw / var(--sp));
    left: calc(8vw / var(--sp));
    z-index: 1;
  }

  #studio_popup #ejlight .ejlight01 .next,
  #studio_popup #abs .abs01 .next,
  #studio_popup #zumba .zumba01 .next {
    position: absolute;
    background: rgba(255, 255, 255, 0.9);
    border-radius: calc((60vw / 2) / var(--sp)) 0 0 calc((60vw / 2) / var(--sp));
    width: calc(250vw / var(--sp));
    height: calc(60vw / var(--sp));
    bottom: calc(45vw / var(--sp));
    right: 0;
    transition: var(--hover_transition);
  }

  #studio_popup #ejlight .ejlight01 .next:hover,
  #studio_popup #abs .abs01 .next:hover,
  #studio_popup #zumba .zumba01 .next:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #studio_popup #ejlight .ejlight01 .next p,
  #studio_popup #abs .abs01 .next p,
  #studio_popup #zumba .zumba01 .next p {
    position: absolute;
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    font-weight: 600;
    line-height: calc(20vw / var(--sp));
    text-align: center;
    top: 50%;
    left: calc(44vw / var(--sp));
    transform: translateY(-50%);
  }

  #studio_popup #ejlight .ejlight01 .next p span,
  #studio_popup #abs .abs01 .next p span,
  #studio_popup #zumba .zumba01 .next p span {
    font-size: calc(18vw / var(--sp));
  }

  #studio_popup #ejlight .ejlight01 .next i,
  #studio_popup #abs .abs01 .next i,
  #studio_popup #zumba .zumba01 .next i {
    position: absolute;
    align-content: center;
    display: block;
    color: var(--bw6);
    font-size: calc(20vw / var(--sp));
    line-height: 1em;
    text-align: center;
    border-radius: calc(4vw / var(--sp));
    width: calc(40vw / var(--sp));
    height: calc(40vw / var(--sp));
    top: 50%;
    right: calc(10vw / var(--sp));
    transform: translateY(-50%);
  }

  #studio_popup #ejlight .ejlight01 .next i {
    background: #fb3390;
  }

  #studio_popup #abs .abs01 .next i {
    background: #ff0000;
  }

  #studio_popup #zumba .zumba01 .next i {
    background: #ff6d00;
  }

  #studio_popup #ejlight .ejlight02 .point,
  #studio_popup #abs .abs02 .point,
  #studio_popup #zumba .zumba02 .point {
    position: absolute;
    overflow: hidden;
    border-radius: calc(10vw / var(--sp));
    width: calc(340vw / var(--sp));
    bottom: calc(100vw / var(--sp));
    left: 50%;
    transform: translateX(-50%);
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun,
  #studio_popup #abs .abs02 .point .kokogamorefun,
  #studio_popup #zumba .zumba02 .point .kokogamorefun {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.7);
    width: 100%;
    padding: calc(23vw / var(--sp)) calc(20vw / var(--sp))
      calc(20vw / var(--sp));
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .instructor,
  #studio_popup #abs .abs02 .point .kokogamorefun .instructor,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .instructor {
    width: calc(80vw / var(--sp));
    height: auto;
    object-fit: contain;
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi {
    position: relative;
    box-sizing: border-box;
    background: var(--holiday2);
    border-radius: calc(10vw / var(--sp));
    width: calc(210vw / var(--sp));
    height: calc(120vw / var(--sp));
    padding-top: calc(32vw / var(--sp));
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi::before,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi::before,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/studio_kokogamorefun_fukidashi.webp")
      no-repeat;
    background-size: 100% 100%;
    width: calc(18.6vw / var(--sp));
    height: calc(17.4vw / var(--sp));
    top: 50%;
    left: calc((-18.6vw / 2) / var(--sp));
    transform: translateY(-50%);
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi h4,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi h4,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi h4 {
    position: absolute;
    width: calc(157vw / var(--sp));
    top: calc(-8vw / var(--sp));
    left: calc(11vw / var(--sp));
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi h4 img,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi h4 img,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi h4 img {
    width: 100%;
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi p,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi p,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi p {
    position: relative;
    z-index: 1;
    color: var(--bw6);
    font-size: calc(14vw / var(--sp));
    font-weight: 400;
    line-height: calc(20vw / var(--sp));
    text-align: justify;
    width: calc(190vw / var(--sp));
    margin: 0 auto;
  }

  #studio_popup #ejlight .ejlight02 .point .kokogamorefun .fukidashi p span,
  #studio_popup #abs .abs02 .point .kokogamorefun .fukidashi p span,
  #studio_popup #zumba .zumba02 .point .kokogamorefun .fukidashi p span {
    font-weight: 600;
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku,
  #studio_popup #abs .abs02 .point .keizoku,
  #studio_popup #zumba .zumba02 .point .keizoku {
    background: var(--bw6);
    width: 100%;
    padding: calc(10vw / var(--sp)) 0 calc(15vw / var(--sp));
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku h4,
  #studio_popup #abs .abs02 .point .keizoku h4,
  #studio_popup #zumba .zumba02 .point .keizoku h4 {
    display: inline-block;
    background: linear-gradient(
      to top,
      var(--studio) 0%,
      var(--studio) calc(2vw / var(--sp)),
      transparent calc(2vw / var(--sp)),
      transparent 100%
    );
    color: var(--studio);
    font-size: calc(20vw / var(--sp));
    font-weight: 600;
    line-height: calc(30vw / var(--sp));
    text-align: left;
    margin: 0 0 calc(13vw / var(--sp)) calc(15vw / var(--sp));
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku h4 span,
  #studio_popup #abs .abs02 .point .keizoku h4 span,
  #studio_popup #zumba .zumba02 .point .keizoku h4 span {
    font-size: calc(18vw / var(--sp));
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku ol,
  #studio_popup #abs .abs02 .point .keizoku ol,
  #studio_popup #zumba .zumba02 .point .keizoku ol {
    display: flex;
    flex-direction: column;
    gap: calc(19vw / var(--sp)) 0;
    width: calc(305vw / var(--sp));
    margin: 0 auto;
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku ol li,
  #studio_popup #abs .abs02 .point .keizoku ol li,
  #studio_popup #zumba .zumba02 .point .keizoku ol li {
    position: relative;
    box-sizing: border-box;
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    font-weight: 600;
    line-height: calc(30vw / var(--sp));
    text-align: left;
    width: 100%;
    height: calc(30vw / var(--sp));
    padding-left: calc(40vw / var(--sp));
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku ol li::before,
  #studio_popup #abs .abs02 .point .keizoku ol li::before,
  #studio_popup #zumba .zumba02 .point .keizoku ol li::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--studio);
    border-radius: calc((30vw / 2) / var(--sp));
    width: calc(30vw / var(--sp));
    height: calc(30vw / var(--sp));
    top: 0;
    left: 0;
  }

  #studio_popup #ejlight .ejlight02 .point .keizoku ol li::after,
  #studio_popup #abs .abs02 .point .keizoku ol li::after,
  #studio_popup #zumba .zumba02 .point .keizoku ol li::after {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/studio_kokogamorefun_keizoku.webp")
      no-repeat;
    background-size: 100% 100%;
    width: calc(24.5vw / var(--sp));
    height: calc(32vw / var(--sp));
    top: calc(-6vw / var(--sp));
    left: calc(2vw / var(--sp));
  }

  #studio_popup #ejlight .ejlight02 .prev,
  #studio_popup #abs .abs02 .prev,
  #studio_popup #zumba .zumba02 .prev {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--sp));
    width: calc(40vw / var(--sp));
    height: calc(40vw / var(--sp));
    top: auto;
    bottom: calc(40vw / var(--sp));
    left: auto;
    right: calc(25vw / var(--sp));
    transition: var(--hover_transition);
  }

  #studio_popup #ejlight .ejlight02 .prev i,
  #studio_popup #abs .abs02 .prev i,
  #studio_popup #zumba .zumba02 .prev i {
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
  }

  #studio_popup #ejlight .ejlight02 .prev:hover,
  #studio_popup #abs .abs02 .prev:hover,
  #studio_popup #zumba .zumba02 .prev:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #studio_popup #abs {
    background-image: url("../img/popup/studio/abs.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #abs .abs01 .copy {
    position: absolute;
    width: calc(178vw / var(--sp));
    top: calc(145vw / var(--sp));
    left: calc(20vw / var(--sp));
  }

  #studio_popup #abs .abs01 .data {
    position: absolute;
    width: calc(188vw / var(--sp));
    bottom: calc(50vw / var(--sp));
    left: calc(8vw / var(--sp));
    z-index: 1;
  }

  #studio_popup #zumba {
    background-image: url("../img/popup/studio/zumba.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #zumba .zumba01 .copy {
    position: absolute;
    width: calc(251vw / var(--sp));
    top: calc(122vw / var(--sp));
    left: calc(20vw / var(--sp));
  }

  #studio_popup #zumba .zumba01 .data {
    position: absolute;
    width: calc(173vw / var(--sp));
    bottom: calc(50vw / var(--sp));
    left: calc(17vw / var(--sp));
    z-index: 1;
  }

  #studio_popup #beast .beast01 {
    background-image: url("../img/popup/studio/beast.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #beast .beast02 {
    background-image: url("../img/popup/studio/beast_blue.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #beast .beast03 {
    background-image: url("../img/popup/studio/beast_red.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #beast .beast04 {
    background-image: url("../img/popup/studio/beast_yellow.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup #beast .beast05 {
    background-image: url("../img/popup/studio/beast_cmf.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #studio_popup .area .blur {
    position: absolute;
    z-index: 1;
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    pointer-events: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transition: var(--hover_transition);
  }

  #studio_popup #other {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    background-image: url("../img/popup/studio/program_back.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: calc(733vw / var(--sp));
    padding-top: calc(24vw / var(--sp));
  }

  #studio_popup #other::after {
    position: absolute;
    display: block;
    content: "";
    background-image: url("../img/popup/studio/program_back_fukidashi.webp");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: calc(40vw / var(--sp));
    bottom: 0;
  }

  #studio_popup #other h3 {
    width: calc(260vw / var(--sp));
    margin: 0 auto;
  }

  #studio_popup #other h3 img {
    width: 100%;
  }

  #studio_popup #other .floric {
    position: absolute;
    width: calc(235vw / var(--sp));
    top: calc(144vw / var(--sp));
    left: calc(22vw / var(--sp));
  }

  #studio_popup #other .fitabody {
    position: absolute;
    width: calc(177vw / var(--sp));
    top: calc(155vw / var(--sp));
    right: calc(3vw / var(--sp));
  }

  #studio_popup #other .finepilates {
    position: absolute;
    width: calc(319vw / var(--sp));
    top: calc(240vw / var(--sp));
    left: calc(-14vw / var(--sp));
  }

  #studio_popup #other .rockkintore {
    position: absolute;
    width: calc(309vw / var(--sp));
    bottom: calc(80vw / var(--sp));
    right: calc(-78vw / var(--sp));
  }

  #studio_popup #other .z180 {
    position: absolute;
    width: calc(470vw / var(--sp));
    bottom: calc(-19vw / var(--sp));
    left: calc(-139vw / var(--sp));
  }

  #studio_popup #program_search {
    width: 100%;
    margin-bottom: calc(10vw / var(--sp));
  }

  #studio_popup #program_search .search {
    background: var(--bw6);
    width: 100%;
    padding: calc(40vw / var(--sp)) 0 calc(20vw / var(--sp));
  }

  #studio_popup #program_search .search h3 {
    position: relative;
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    font-weight: 400;
    line-height: calc(26vw / var(--sp));
    text-align: center;
    width: 100%;
    margin-bottom: calc(20vw / var(--sp));
  }

  #studio_popup #program_search .search h3::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/search_1.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(43vw / var(--sp));
    height: calc(106vw / var(--sp));
    bottom: 0;
    left: calc(25vw / var(--sp));
  }

  #studio_popup #program_search .search h3::after {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/search_2.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(44vw / var(--sp));
    height: calc(98vw / var(--sp));
    bottom: 0;
    right: calc(25vw / var(--sp));
  }

  #studio_popup #program_search .search h3 span {
    font-size: calc(22vw / var(--sp));
    font-weight: 600;
  }

  #studio_popup #program_search .search .checklist {
    width: calc(340vw / var(--sp));
    margin: 0 auto;
  }

  #studio_popup #program_search .search .checklist h4 {
    align-content: center;
    background: #45c574;
    color: var(--bw6);
    font-size: calc(22vw / var(--sp));
    font-weight: 600;
    line-height: 1em;
    text-align: center;
    width: 100%;
    height: calc(36vw / var(--sp));
  }

  #studio_popup #program_search .search .checklist .select {
    background: #f3fbf6;
    width: 100%;
    padding: calc(25vw / var(--sp)) 0;
  }

  #studio_popup #program_search .search .checklist .select ul {
    display: flex;
    flex-wrap: wrap;
    gap: calc(20vw / var(--sp)) calc(60vw / var(--sp));
    width: calc(280vw / var(--sp));
    margin: 0 auto;
  }

  #studio_popup #program_search .search .checklist .select ul li {
    width: auto;
    height: calc(20vw / var(--sp));
  }

  #studio_popup #program_search .search .checklist .select ul li label {
    display: flex;
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    font-weight: 400;
    line-height: calc(20vw / var(--sp));
    text-align: left;
  }

  #studio_popup #program_search .search .checklist .select ul li label input {
    appearance: none;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid #c5c5c5;
    border-radius: calc(2vw / var(--sp));
    width: calc(20vw / var(--sp));
    height: calc(20vw / var(--sp));
    margin-right: calc(10vw / var(--sp));
  }

  #studio_popup
    #program_search
    .search
    .checklist
    .select
    ul
    li
    label
    input:checked {
    position: relative;
    background: #c5c5c5;
  }

  #studio_popup
    #program_search
    .search
    .checklist
    .select
    ul
    li
    label
    input:checked::after {
    position: absolute;
    content: "";
    top: calc(5vw / var(--sp));
    left: calc(3vw / var(--sp));
    width: calc(12vw / var(--sp));
    height: calc(6vw / var(--sp));
    border-bottom: calc(2vw / var(--sp)) solid var(--bw6);
    border-left: calc(2vw / var(--sp)) solid var(--bw6);
    transform: rotate(-45deg);
  }

  #studio_popup #program_search .result {
    background: var(--bw5);
    width: 100%;
    padding: calc(45vw / var(--sp)) 0 calc(30vw / var(--sp));
  }

  #studio_popup #program_search .result .swiper {
    position: relative;
    width: 100%;
    height: calc(680vw / var(--sp));
    padding: 0 calc(24vw / var(--sp));
    margin-bottom: calc(12vw / var(--sp));
  }

  #studio_popup #program_search .result .swiper .result_wrapper {
    width: calc(340vw / var(--sp));
    height: calc(630vw / var(--sp));
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li {
    background: var(--bw6);
    border-radius: 0 0 calc(20vw / var(--sp)) calc(20vw / var(--sp));
    box-shadow: 0 0 calc(10vw / var(--sp)) rgba(0, 0, 0, 0.3);
    margin-right: calc(15vw / var(--sp));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li:last-child {
    margin-right: 0;
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .movie {
    position: relative;
    width: 100% !important;
    height: calc(340vw / var(--sp) / 16 * 9) !important;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .new_program {
    position: absolute;
    z-index: 1;
    display: block;
    box-sizing: border-box;
    background: #f60000;
    border: calc(1vw / var(--sp)) solid var(--bw6);
    color: #ffffff;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: calc(13vw / var(--sp));
    line-height: calc(16vw / var(--sp));
    font-weight: 700;
    text-align: center;
    width: calc(110vw / var(--sp));
    height: calc(18vw / var(--sp));
    border-radius: calc(9vw / var(--sp));
    top: calc(10vw / var(--sp));
    left: calc(10vw / var(--sp));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .play {
    position: absolute;
    z-index: 1;
    display: block;
    box-sizing: border-box;
    border: calc(6.6vw / var(--sp)) solid #ffffff;
    border-radius: calc(33vw / var(--sp));
    box-shadow: 0 calc(2vw / var(--sp)) calc(2vw / var(--sp)) rgba(0, 0, 0, 0.9);
    width: calc(66vw / var(--sp));
    height: calc(66vw / var(--sp));
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .play::after {
    position: absolute;
    z-index: 1;
    display: block;
    content: "";
    filter: drop-shadow(
      0 calc(2vw / var(--sp)) calc(2vw / var(--sp)) rgba(0, 0, 0, 0.9)
    );
    border-top: calc(13vw / var(--sp)) solid transparent;
    border-bottom: calc(13vw / var(--sp)) solid transparent;
    border-left: calc(20vw / var(--sp)) solid #ffffff;
    width: 0;
    height: 0;
    top: 50%;
    left: 36%;
    transform: translateY(-50%);
    pointer-events: none;
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .movie a {
    width: 100%;
    height: 100%;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    a
    img {
    width: 100%;
    height: 100%;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .thumb
    img {
    width: 100%;
    height: 100%;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    iframe {
    width: 100%;
    height: 100%;
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .title {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    background: #f2f8fc;
    width: 100%;
    height: calc(45vw / var(--sp));
    padding: 0 calc(15vw / var(--sp)) 0 calc(25vw / var(--sp));
    margin-bottom: calc(23vw / var(--sp));
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .title h4 {
    color: var(--bw1);
    font-size: calc(22vw / var(--sp));
    line-height: 1em;
    font-weight: 600;
    text-align: left;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time {
    color: var(--bw1);
    font-size: calc(12vw / var(--sp));
    line-height: calc(15vw / var(--sp));
    font-weight: 400;
    text-align: left;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time
    span.bold {
    font-weight: 600;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time
    span.big {
    font-size: calc(16vw / var(--sp));
  }

  #studio_popup #program_search .result .swiper .result_wrapper > li .point {
    width: 100%;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.7);
    width: 100%;
    padding: 0 calc(20vw / var(--sp)) 0;
    margin-bottom: calc(20vw / var(--sp));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .instructor {
    width: calc(80vw / var(--sp));
    height: auto;
    object-fit: contain;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi {
    position: relative;
    box-sizing: border-box;
    background: var(--holiday2);
    border-radius: calc(10vw / var(--sp));
    width: calc(210vw / var(--sp));
    height: calc(130vw / var(--sp));
    padding-top: calc(32vw / var(--sp));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/studio_kokogamorefun_fukidashi.webp")
      no-repeat;
    background-size: 100% 100%;
    width: calc(18.6vw / var(--sp));
    height: calc(17.4vw / var(--sp));
    top: 50%;
    left: calc((-18.6vw / 2) / var(--sp));
    transform: translateY(-50%);
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    h4 {
    position: absolute;
    width: calc(157vw / var(--sp));
    top: calc(-8vw / var(--sp));
    left: calc(11vw / var(--sp));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    h4
    img {
    width: 100%;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    p {
    position: relative;
    z-index: 1;
    color: var(--bw6);
    font-size: calc(14vw / var(--sp));
    font-weight: 400;
    line-height: calc(18vw / var(--sp));
    text-align: justify;
    width: calc(190vw / var(--sp));
    margin: 0 auto;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    p
    span {
    font-weight: 600;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .text {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    font-weight: 400;
    line-height: calc(26vw / var(--sp));
    text-align: justify;
    width: calc(290vw / var(--sp));
    border-bottom: calc(1vw / var(--sp)) solid #7d7d7d;
    padding-bottom: calc(20vw / var(--sp));
    margin: 0 auto calc(15vw / var(--sp));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category {
    display: flex;
    flex-wrap: wrap;
    gap: 0 calc(15vw / var(--sp));
    width: calc(290vw / var(--sp));
    margin: 0 auto;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li {
    position: relative;
    color: var(--bw2);
    font-size: calc(12vw / var(--sp));
    font-weight: 400;
    line-height: calc(22vw / var(--sp));
    text-align: left;
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li::after {
    position: absolute;
    display: block;
    content: "／";
    color: var(--bw2);
    font-size: calc(12vw / var(--sp));
    font-weight: 400;
    line-height: calc(22vw / var(--sp));
    text-align: left;
    top: 0;
    right: calc(-14vw / var(--sp));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li:last-child::after {
    display: none;
  }

  #studio_popup #program_search .result .swiper .swiper-pagination {
    position: absolute;
    display: flex;
    gap: calc(8vw / var(--sp));
    bottom: calc(0vw / var(--sp));
    left: calc(24vw / var(--sp));
    flex-wrap: wrap;
    width: calc(232vw / var(--sp));
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet {
    background: var(--bw3);
    border-radius: calc((16vw / 2) / var(--sp));
    width: calc(16vw / var(--sp));
    height: calc(16vw / var(--sp));
    margin: 0;
    opacity: 1;
    transition: var(--hover_transition);
  }

  #studio_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet:hover,
  #studio_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--holiday2);
    transition: var(--hover_transition);
  }

  #studio_popup #program_search .result .swiper .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--sp));
    width: calc(40vw / var(--sp));
    height: calc(40vw / var(--sp));
    top: auto;
    bottom: 0;
    left: auto;
    right: calc(79vw / var(--sp));
  }

  #studio_popup #program_search .result .swiper .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--sp));
    width: calc(40vw / var(--sp));
    height: calc(40vw / var(--sp));
    top: auto;
    bottom: 0;
    left: auto;
    right: calc(24vw / var(--sp));
  }

  #studio_popup #program_search .result .swiper .swiper-button-prev::after,
  #studio_popup #program_search .result .swiper .swiper-button-next::after {
    display: none;
  }

  #studio_popup #program_search .result .swiper .swiper-button-prev i,
  #studio_popup #program_search .result .swiper .swiper-button-next i {
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
  }

  #studio_popup #program_search .result .pdf {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(255, 255, 255, 0.9);
    color: var(--bw2);
    font-size: calc(16vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((48vw / 2) / var(--sp));
    width: calc(300vw / var(--sp));
    height: calc(48vw / var(--sp));
    margin: 0 auto;
    transition: var(--hover_transition);
  }

  #studio_popup #program_search .result .pdf i {
    position: absolute;
    color: var(--studio);
    font-size: calc(22vw / var(--sp));
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: calc(13vw / var(--sp));
    transform: translateY(-50%);
  }

  #studio_popup #beginner {
    background: var(--bw5);
    width: 100%;
    padding: calc(85vw / var(--sp)) 0 calc(40vw / var(--sp));
  }

  #studio_popup #beginner .title {
    width: calc(340vw / var(--sp));
    margin: 0 auto calc(20vw / var(--sp));
  }

  #studio_popup #beginner .title img {
    width: 100%;
    margin-bottom: calc(35vw / var(--sp));
  }

  #studio_popup #beginner .title .taipa {
    display: block;
    align-content: center;
    background: var(--studio);
    color: var(--bw6);
    font-size: calc(18vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: calc(180vw / var(--sp));
    height: calc(28vw / var(--sp));
    clip-path: polygon(
      calc(6vw / var(--sp)) 0px,
      calc(100% - (6vw / var(--sp))) 0px,
      100% calc(6vw / var(--sp)),
      100% calc(100% - (6vw / var(--sp))),
      calc(100% - (6vw / var(--sp))) 100%,
      calc(6vw / var(--sp)) 100%,
      0px calc(100% - (6vw / var(--sp))),
      0px calc(6vw / var(--sp))
    );
    margin-bottom: calc(10vw / var(--sp));
  }

  #studio_popup #beginner .title h3 {
    color: var(--studio);
    font-size: calc(28vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
  }

  #studio_popup #beginner .text {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    width: calc(340vw / var(--sp));
    margin: 0 auto calc(20vw / var(--sp));
  }

  #studio_popup #beginner .text span {
    font-weight: var(--bold);
  }

  #studio_popup #beginner .enquete {
    background: var(--bw6);
    border-radius: calc(10vw / var(--sp));
    width: calc(340vw / var(--sp));
    padding: calc(25vw / var(--sp)) 0 calc(50vw / var(--sp));
    margin: 0 auto;
  }

  #studio_popup #beginner .enquete h4 {
    color: var(--studio);
    font-size: calc(22vw / var(--sp));
    line-height: calc(32vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    width: calc(290vw / var(--sp));
    margin: 0 auto calc(20vw / var(--sp));
  }

  #studio_popup #beginner .enquete .favorite {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    width: calc(290vw / var(--sp));
    margin: 0 auto calc(30vw / var(--sp));
  }

  #studio_popup #beginner .enquete .favorite span {
    color: var(--studio);
  }

  #studio_popup #beginner .enquete ul {
    display: flex;
    flex-direction: column;
    gap: calc(55vw / var(--sp)) 0;
    width: calc(290vw / var(--sp));
    margin: 0 auto;
  }

  #studio_popup #beginner .enquete ul li {
    position: relative;
    border-radius: calc(10vw / var(--sp));
    width: 100%;
    padding: calc(30vw / var(--sp)) 0;
  }

  #studio_popup #beginner .enquete ul li.kokogasuki_1 {
    background: #fff2f4;
  }

  #studio_popup #beginner .enquete ul li.kokogasuki_2 {
    background: #ebf5fb;
  }

  #studio_popup #beginner .enquete ul li h5 {
    position: absolute;
    width: calc(91vw / var(--sp));
    top: calc(-12vw / var(--sp));
    left: calc(-5vw / var(--sp));
  }

  #studio_popup #beginner .enquete ul li h5 img {
    width: 100%;
  }

  #studio_popup #beginner .enquete ul li p {
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    width: calc(240vw / var(--sp));
    margin: 0 auto;
  }

  #studio_popup #beginner .enquete ul li.kokogasuki_1 p {
    color: #fb5e77;
  }

  #studio_popup #beginner .enquete ul li.kokogasuki_2 p {
    color: #0084cb;
  }

  #studio_popup #beginner .enquete ul li .user {
    position: absolute;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    width: calc(128vw / var(--sp));
    bottom: calc(-26vw / var(--sp));
    right: calc(-35vw / var(--sp));
  }

  #studio_popup #beginner .enquete ul li .user h6 {
    box-sizing: border-box;
    color: var(--bw2);
    font-size: calc(13vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    border-bottom: calc(2vw / var(--sp)) solid var(--bw3);
    padding-bottom: calc(6vw / var(--sp));
  }

  #studio_popup #beginner .enquete ul li .user img.female {
    width: calc(55vw / var(--sp));
  }

  #studio_popup #beginner .enquete ul li .user img.male {
    width: calc(59vw / var(--sp));
  }
}

/************************************
#hotstudio_popup
************************************/
@media screen and (min-width: 1366px) {
  #hotstudio_popup .area#wonnetsu {
    background: url("../img/popup/hotstudio/wonnetsu.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#hikari {
    background: url("../img/popup/hotstudio/hikari.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#program {
    background: url("../img/popup/hotstudio/program.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#juunansei {
    background: url("../img/popup/hotstudio/juunansei.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#hakkan {
    background: url("../img/popup/hotstudio/hakkan.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#rouhaibutsu {
    background: url("../img/popup/hotstudio/rouhaibutsu.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#kekkou {
    background: url("../img/popup/hotstudio/kekkou.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup #howto {
    background: var(--bw6);
    width: 100%;
    padding: 50px 0;
  }

  #hotstudio_popup #howto .reserve {
    position: relative;
    background: #fff5f9;
    width: 340px;
    padding: 25px 0;
    margin: 0 auto 25px;
  }

  #hotstudio_popup #howto .reserve .photo {
    display: block;
    border-radius: 10px;
    width: 280px;
    margin: 0 auto 15px;
  }

  #hotstudio_popup #howto .reserve h3 {
    color: var(--hotstudio);
    font-size: 22px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 280px;
    margin: 0 auto 10px;
  }

  #hotstudio_popup #howto .reserve .illust {
    position: absolute;
    width: 40px;
    top: 132px;
    right: 32px;
  }

  #hotstudio_popup #howto .reserve p {
    color: var(--bw1);
    font-size: 14px;
    line-height: 20px;
    font-weight: var(--regular);
    text-align: justify;
    width: 280px;
    margin: 0 auto 10px;
  }

  #hotstudio_popup #howto .reserve ul {
    display: flex;
    flex-direction: column;
    gap: 10px 0;
    box-sizing: border-box;
    width: 280px;
    padding-left: 10px;
    margin: 0 auto;
  }

  #hotstudio_popup #howto .reserve ul li {
    position: relative;
    color: var(--bw1);
    font-size: 14px;
    line-height: 20px;
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
  }

  #hotstudio_popup #howto .reserve ul li::before {
    position: absolute;
    display: block;
    content: "・";
    color: var(--bw1);
    font-size: 14px;
    line-height: 20px;
    font-weight: var(--regular);
    text-align: left;
    top: 0;
    left: -10px;
  }

  #hotstudio_popup #howto .mochimono {
    position: relative;
    width: 340px;
    margin: 0 auto;
  }

  #hotstudio_popup #howto .mochimono h3 {
    display: block;
    box-sizing: border-box;
    align-content: center;
    color: var(--hotstudio);
    font-size: 22px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    border-left: 7px solid var(--hotstudio);
    width: 100%;
    height: 30px;
    padding-left: 15px;
    margin-bottom: 20px;
  }

  #hotstudio_popup #howto .mochimono img {
    position: absolute;
    width: 93px;
    top: -20px;
    right: 0;
  }

  #hotstudio_popup #howto .mochimono ul {
    display: flex;
    flex-direction: column;
    gap: 15px 0;
    width: 100%;
  }

  #hotstudio_popup #howto .mochimono ul li {
    width: 100%;
  }

  #hotstudio_popup #howto .mochimono ul li h4 {
    color: var(--hotstudio);
    font-size: 16px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: 8px;
  }

  #hotstudio_popup #howto .mochimono ul li p {
    box-sizing: border-box;
    color: var(--bw2);
    font-size: 16px;
    line-height: 22px;
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
    padding-left: 20px;
    margin-bottom: 8px;
  }

  #hotstudio_popup #howto .mochimono ul li small {
    display: block;
    box-sizing: border-box;
    color: var(--bw2);
    font-size: 12px;
    line-height: 16px;
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
    padding-left: 20px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #hotstudio_popup .area#wonnetsu {
    background: url("../img/popup/hotstudio/wonnetsu.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#hikari {
    background: url("../img/popup/hotstudio/hikari.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#program {
    background: url("../img/popup/hotstudio/program.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#juunansei {
    background: url("../img/popup/hotstudio/juunansei.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#hakkan {
    background: url("../img/popup/hotstudio/hakkan.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#rouhaibutsu {
    background: url("../img/popup/hotstudio/rouhaibutsu.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#kekkou {
    background: url("../img/popup/hotstudio/kekkou.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup #howto {
    background: var(--bw6);
    width: 100%;
    padding: calc(50vw / var(--tablet)) 0;
  }

  #hotstudio_popup #howto .reserve {
    position: relative;
    background: #fff5f9;
    width: calc(340vw / var(--tablet));
    padding: calc(25vw / var(--tablet)) 0;
    margin: 0 auto calc(25vw / var(--tablet));
  }

  #hotstudio_popup #howto .reserve .photo {
    display: block;
    border-radius: calc(10vw / var(--tablet));
    width: calc(280vw / var(--tablet));
    margin: 0 auto calc(15vw / var(--tablet));
  }

  #hotstudio_popup #howto .reserve h3 {
    color: var(--hotstudio);
    font-size: calc(22vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: calc(280vw / var(--tablet));
    margin: 0 auto calc(10vw / var(--tablet));
  }

  #hotstudio_popup #howto .reserve .illust {
    position: absolute;
    width: calc(40vw / var(--tablet));
    top: calc(132vw / var(--tablet));
    right: calc(32vw / var(--tablet));
  }

  #hotstudio_popup #howto .reserve p {
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    line-height: calc(20vw / var(--tablet));
    font-weight: var(--regular);
    text-align: justify;
    width: calc(280vw / var(--tablet));
    margin: 0 auto calc(10vw / var(--tablet));
  }

  #hotstudio_popup #howto .reserve ul {
    display: flex;
    flex-direction: column;
    gap: calc(10vw / var(--tablet)) 0;
    box-sizing: border-box;
    width: calc(280vw / var(--tablet));
    padding-left: calc(10vw / var(--tablet));
    margin: 0 auto;
  }

  #hotstudio_popup #howto .reserve ul li {
    position: relative;
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    line-height: calc(20vw / var(--tablet));
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
  }

  #hotstudio_popup #howto .reserve ul li::before {
    position: absolute;
    display: block;
    content: "・";
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    line-height: calc(20vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    top: 0;
    left: calc(-10vw / var(--tablet));
  }

  #hotstudio_popup #howto .mochimono {
    position: relative;
    width: calc(340vw / var(--tablet));
    margin: 0 auto;
  }

  #hotstudio_popup #howto .mochimono h3 {
    display: block;
    box-sizing: border-box;
    align-content: center;
    color: var(--hotstudio);
    font-size: calc(22vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    border-left: calc(7vw / var(--tablet)) solid var(--hotstudio);
    width: 100%;
    height: calc(30vw / var(--tablet));
    padding-left: calc(15vw / var(--tablet));
    margin-bottom: calc(20vw / var(--tablet));
  }

  #hotstudio_popup #howto .mochimono img {
    position: absolute;
    width: calc(93vw / var(--tablet));
    top: calc(-20vw / var(--tablet));
    right: 0;
  }

  #hotstudio_popup #howto .mochimono ul {
    display: flex;
    flex-direction: column;
    gap: calc(15vw / var(--tablet)) 0;
    width: 100%;
  }

  #hotstudio_popup #howto .mochimono ul li {
    width: 100%;
  }

  #hotstudio_popup #howto .mochimono ul li h4 {
    color: var(--hotstudio);
    font-size: calc(16vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: calc(8vw / var(--tablet));
  }

  #hotstudio_popup #howto .mochimono ul li p {
    box-sizing: border-box;
    color: var(--bw2);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(22vw / var(--tablet));
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
    padding-left: calc(20vw / var(--tablet));
    margin-bottom: calc(8vw / var(--tablet));
  }

  #hotstudio_popup #howto .mochimono ul li small {
    display: block;
    box-sizing: border-box;
    color: var(--bw2);
    font-size: calc(12vw / var(--tablet));
    line-height: calc(16vw / var(--tablet));
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
    padding-left: calc(20vw / var(--tablet));
  }
}

@media screen and (max-width: 767px) {
  #hotstudio_popup .area#wonnetsu {
    background: url("../img/popup/hotstudio/wonnetsu.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#hikari {
    background: url("../img/popup/hotstudio/hikari.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#program {
    background: url("../img/popup/hotstudio/program.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#juunansei {
    background: url("../img/popup/hotstudio/juunansei.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#hakkan {
    background: url("../img/popup/hotstudio/hakkan.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#rouhaibutsu {
    background: url("../img/popup/hotstudio/rouhaibutsu.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup .area#kekkou {
    background: url("../img/popup/hotstudio/kekkou.webp") no-repeat;
    background-size: 100% 100%;
  }

  #hotstudio_popup #howto {
    background: var(--bw6);
    width: 100%;
    padding: calc(50vw / var(--sp)) 0;
  }

  #hotstudio_popup #howto .reserve {
    position: relative;
    background: #fff5f9;
    width: calc(340vw / var(--sp));
    padding: calc(25vw / var(--sp)) 0;
    margin: 0 auto calc(25vw / var(--sp));
  }

  #hotstudio_popup #howto .reserve .photo {
    display: block;
    border-radius: calc(10vw / var(--sp));
    width: calc(280vw / var(--sp));
    margin: 0 auto calc(15vw / var(--sp));
  }

  #hotstudio_popup #howto .reserve h3 {
    color: var(--hotstudio);
    font-size: calc(22vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: calc(280vw / var(--sp));
    margin: 0 auto calc(10vw / var(--sp));
  }

  #hotstudio_popup #howto .reserve .illust {
    position: absolute;
    width: calc(40vw / var(--sp));
    top: calc(132vw / var(--sp));
    right: calc(32vw / var(--sp));
  }

  #hotstudio_popup #howto .reserve p {
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    line-height: calc(20vw / var(--sp));
    font-weight: var(--regular);
    text-align: justify;
    width: calc(280vw / var(--sp));
    margin: 0 auto calc(10vw / var(--sp));
  }

  #hotstudio_popup #howto .reserve ul {
    display: flex;
    flex-direction: column;
    gap: calc(10vw / var(--sp)) 0;
    box-sizing: border-box;
    width: calc(280vw / var(--sp));
    padding-left: calc(10vw / var(--sp));
    margin: 0 auto;
  }

  #hotstudio_popup #howto .reserve ul li {
    position: relative;
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    line-height: calc(20vw / var(--sp));
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
  }

  #hotstudio_popup #howto .reserve ul li::before {
    position: absolute;
    display: block;
    content: "・";
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    line-height: calc(20vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    top: 0;
    left: calc(-10vw / var(--sp));
  }

  #hotstudio_popup #howto .mochimono {
    position: relative;
    width: calc(340vw / var(--sp));
    margin: 0 auto;
  }

  #hotstudio_popup #howto .mochimono h3 {
    display: block;
    box-sizing: border-box;
    align-content: center;
    color: var(--hotstudio);
    font-size: calc(22vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    border-left: calc(7vw / var(--sp)) solid var(--hotstudio);
    width: 100%;
    height: calc(30vw / var(--sp));
    padding-left: calc(15vw / var(--sp));
    margin-bottom: calc(20vw / var(--sp));
  }

  #hotstudio_popup #howto .mochimono img {
    position: absolute;
    width: calc(93vw / var(--sp));
    top: calc(-20vw / var(--sp));
    right: 0;
  }

  #hotstudio_popup #howto .mochimono ul {
    display: flex;
    flex-direction: column;
    gap: calc(15vw / var(--sp)) 0;
    width: 100%;
  }

  #hotstudio_popup #howto .mochimono ul li {
    width: 100%;
  }

  #hotstudio_popup #howto .mochimono ul li h4 {
    color: var(--hotstudio);
    font-size: calc(16vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: calc(8vw / var(--sp));
  }

  #hotstudio_popup #howto .mochimono ul li p {
    box-sizing: border-box;
    color: var(--bw2);
    font-size: calc(16vw / var(--sp));
    line-height: calc(22vw / var(--sp));
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
    padding-left: calc(20vw / var(--sp));
    margin-bottom: calc(8vw / var(--sp));
  }

  #hotstudio_popup #howto .mochimono ul li small {
    display: block;
    box-sizing: border-box;
    color: var(--bw2);
    font-size: calc(12vw / var(--sp));
    line-height: calc(16vw / var(--sp));
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
    padding-left: calc(20vw / var(--sp));
  }
}

/************************************
#pooleffect_popup
************************************/
@media screen and (min-width: 1366px) {
  #pooleffect_popup .area#suiatsu {
    background: url("../img/popup/pooleffect/suiatsu.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#furyoku {
    background: url("../img/popup/pooleffect/furyoku.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#teikou {
    background: url("../img/popup/pooleffect/teikou.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#suion {
    background: url("../img/popup/pooleffect/suion.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#suishitsu {
    background: url("../img/popup/pooleffect/suishitsu.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#anshin {
    background: url("../img/popup/pooleffect/anshin.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#otona {
    background: url("../img/popup/pooleffect/otona.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area h4 {
    position: absolute;
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: linear-gradient(
      to right,
      rgba(255, 255, 255, 0.9) 0,
      rgba(255, 255, 255, 0.9) 70%,
      transparent 100%
    );
    color: var(--bw2);
    font-size: 18px;
    line-height: 28px;
    font-weight: var(--bold);
    text-align: left;
    width: 300px;
    height: 76px;
    padding-left: 45px;
    bottom: 40px;
    left: 0;
  }

  #pooleffect_popup .area h4::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--pool);
    border-radius: calc(5px / 2);
    width: 5px;
    height: 40px;
    top: 50%;
    left: 27px;
    transform: translateY(-50%);
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #pooleffect_popup .area#suiatsu {
    background: url("../img/popup/pooleffect/suiatsu.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#furyoku {
    background: url("../img/popup/pooleffect/furyoku.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#teikou {
    background: url("../img/popup/pooleffect/teikou.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#suion {
    background: url("../img/popup/pooleffect/suion.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#suishitsu {
    background: url("../img/popup/pooleffect/suishitsu.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#anshin {
    background: url("../img/popup/pooleffect/anshin.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#otona {
    background: url("../img/popup/pooleffect/otona.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area h4 {
    position: absolute;
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: linear-gradient(
      to right,
      rgba(255, 255, 255, 0.9) 0,
      rgba(255, 255, 255, 0.9) 70%,
      transparent 100%
    );
    color: var(--bw2);
    font-size: calc(18vw / var(--tablet));
    line-height: calc(28vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    width: calc(300vw / var(--tablet));
    height: calc(76vw / var(--tablet));
    padding-left: calc(45vw / var(--tablet));
    bottom: calc(40vw / var(--tablet));
    left: 0;
  }

  #pooleffect_popup .area h4::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--pool);
    border-radius: calc((5vw / 2) / var(--tablet));
    width: calc(5vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: 50%;
    left: calc(27vw / var(--tablet));
    transform: translateY(-50%);
  }
}

@media screen and (max-width: 767px) {
  #pooleffect_popup .area#suiatsu {
    background: url("../img/popup/pooleffect/suiatsu.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#furyoku {
    background: url("../img/popup/pooleffect/furyoku.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#teikou {
    background: url("../img/popup/pooleffect/teikou.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#suion {
    background: url("../img/popup/pooleffect/suion.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#suishitsu {
    background: url("../img/popup/pooleffect/suishitsu.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#anshin {
    background: url("../img/popup/pooleffect/anshin.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area#otona {
    background: url("../img/popup/pooleffect/otona.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pooleffect_popup .area h4 {
    position: absolute;
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: linear-gradient(
      to right,
      rgba(255, 255, 255, 0.9) 0,
      rgba(255, 255, 255, 0.9) 70%,
      transparent 100%
    );
    color: var(--bw2);
    font-size: calc(18vw / var(--sp));
    line-height: calc(28vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    width: calc(300vw / var(--sp));
    height: calc(76vw / var(--sp));
    padding-left: calc(45vw / var(--sp));
    bottom: calc(40vw / var(--sp));
    left: 0;
  }

  #pooleffect_popup .area h4::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--pool);
    border-radius: calc((5vw / 2) / var(--sp));
    width: calc(5vw / var(--sp));
    height: calc(40vw / var(--sp));
    top: 50%;
    left: calc(27vw / var(--sp));
    transform: translateY(-50%);
  }
}

/************************************
#pool_popup
************************************/
@media screen and (min-width: 1366px) {
  #pool_popup .area#swimming {
    background: url("../img/popup/pool/swimming.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area#walking {
    background: url("../img/popup/pool/walking.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area#poolprogram {
    background: url("../img/popup/pool/poolprogram.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area h4 {
    position: absolute;
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: linear-gradient(
      to right,
      rgba(255, 255, 255, 0.9) 0,
      rgba(255, 255, 255, 0.9) 70%,
      transparent 100%
    );
    color: var(--bw2);
    font-size: 18px;
    line-height: 28px;
    font-weight: var(--bold);
    text-align: left;
    width: 300px;
    height: 76px;
    padding-left: 45px;
    bottom: 40px;
    left: 0;
  }

  #pool_popup .area h4::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--pool);
    border-radius: calc(5px / 2);
    width: 5px;
    height: 40px;
    top: 50%;
    left: 27px;
    transform: translateY(-50%);
  }

  #pool_popup .area .course_5 {
    position: absolute;
    width: 112px;
    height: 124px;
    bottom: 40px;
    left: 25px;
  }

  #pool_popup .area#swimming .course_5 {
    background: url("../img/popup/pool/course/5_swimming.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area#walking .course_5 {
    background: url("../img/popup/pool/course/5_walking.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area#poolprogram .course_5 {
    background: url("../img/popup/pool/course/5_poolprogram.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup #program_search {
    width: 100%;
    margin-bottom: 10px;
  }

  #pool_popup #program_search .result {
    background: var(--bw5);
    width: 100%;
    padding: 45px 0 30px;
  }

  #pool_popup #program_search .result .swiper {
    position: relative;
    width: 100%;
    height: 675px;
    padding: 0 24px;
    margin-bottom: 12px;
  }

  #pool_popup #program_search .result .swiper .result_wrapper {
    width: 340px;
    height: 624px;
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li {
    background: var(--bw6);
    border-radius: 0 0 20px 20px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    margin-right: 15px;
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li:last-child {
    margin-right: 0;
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .movie {
    position: relative;
    width: 100% !important;
    height: calc(340px / 16 * 9) !important;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .thumb
    img {
    width: 100%;
    height: 100%;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .new_program {
    position: absolute;
    z-index: 1;
    display: block;
    box-sizing: border-box;
    background: #f60000;
    border: 1px solid var(--bw6);
    color: #ffffff;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: 13px;
    line-height: 16px;
    font-weight: 700;
    text-align: center;
    width: 110px;
    height: 18px;
    border-radius: 9px;
    top: 10px;
    left: 10px;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .play {
    position: absolute;
    z-index: 1;
    display: block;
    box-sizing: border-box;
    border: 6.6px solid #ffffff;
    border-radius: 33px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.9);
    width: 66px;
    height: 66px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .play::after {
    position: absolute;
    z-index: 1;
    display: block;
    content: "";
    filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.9));
    border-top: 13px solid transparent;
    border-bottom: 13px solid transparent;
    border-left: 20px solid #ffffff;
    width: 0;
    height: 0;
    top: 50%;
    left: 36%;
    transform: translateY(-50%);
    pointer-events: none;
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .movie a {
    width: 100%;
    height: 100%;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    a
    img {
    width: 100%;
    height: 100%;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    iframe {
    width: 100%;
    height: 100%;
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .title {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    background: #f2f8fc;
    width: 100%;
    height: 45px;
    padding: 0 15px 0 25px;
    margin-bottom: 23px;
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .title h4 {
    color: var(--bw1);
    font-size: 22px;
    line-height: 1em;
    font-weight: 600;
    text-align: left;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time {
    color: var(--bw1);
    font-size: 12px;
    line-height: 15px;
    font-weight: 400;
    text-align: left;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time
    span.bold {
    font-weight: 600;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time
    span.big {
    font-size: 16px;
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .point {
    width: 100%;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.7);
    width: 100%;
    padding: 0 20px 0;
    margin-bottom: 20px;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .instructor {
    width: 80px;
    height: auto;
    object-fit: contain;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi {
    position: relative;
    box-sizing: border-box;
    background: var(--holiday2);
    border-radius: 10px;
    width: 210px;
    height: 130px;
    padding-top: 32px;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/studio_kokogamorefun_fukidashi.webp")
      no-repeat;
    background-size: 100% 100%;
    width: 18.6px;
    height: 17.4px;
    top: 50%;
    left: calc(-18.6px / 2);
    transform: translateY(-50%);
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    h4 {
    position: absolute;
    width: 157px;
    top: -8px;
    left: 11px;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    h4
    img {
    width: 100%;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    p {
    position: relative;
    z-index: 1;
    color: var(--bw6);
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    text-align: justify;
    width: 190px;
    margin: 0 auto;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    p
    span {
    font-weight: 600;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .text {
    color: var(--bw1);
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    text-align: justify;
    width: 290px;
    border-bottom: 1px solid #7d7d7d;
    padding-bottom: 20px;
    margin: 0 auto 15px;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category {
    display: flex;
    flex-wrap: wrap;
    gap: 0 15px;
    width: 290px;
    margin: 0 auto;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li {
    position: relative;
    color: var(--bw2);
    font-size: 12px;
    font-weight: 400;
    line-height: 22px;
    text-align: left;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li::after {
    position: absolute;
    display: block;
    content: "／";
    color: var(--bw2);
    font-size: 12px;
    font-weight: 400;
    line-height: 22px;
    text-align: left;
    top: 0;
    right: -14px;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li:last-child::after {
    display: none;
  }

  #pool_popup #program_search .result .swiper .swiper-pagination {
    position: absolute;
    display: flex;
    gap: 0 8px;
    bottom: 11px;
    left: 24px;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet {
    background: var(--bw3);
    border-radius: calc(16px / 2);
    width: 16px;
    height: 16px;
    margin: 0;
    opacity: 1;
    transition: var(--hover_transition);
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet:hover,
  #pool_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--holiday2);
    transition: var(--hover_transition);
  }

  #pool_popup #program_search .result .swiper .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: calc(40px / 2);
    width: 40px;
    height: 40px;
    top: auto;
    bottom: 0;
    left: auto;
    right: 79px;
  }

  #pool_popup #program_search .result .swiper .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: calc(40px / 2);
    width: 40px;
    height: 40px;
    top: auto;
    bottom: 0;
    left: auto;
    right: 24px;
  }

  #pool_popup #program_search .result .swiper .swiper-button-prev::after,
  #pool_popup #program_search .result .swiper .swiper-button-next::after {
    display: none;
  }

  #pool_popup #program_search .result .swiper .swiper-button-prev i,
  #pool_popup #program_search .result .swiper .swiper-button-next i {
    color: var(--bw1);
    font-size: 14px;
  }

  #pool_popup #kaiteki {
    background: var(--bw6);
    width: 100%;
    padding: 50px 0 10px;
  }

  #pool_popup #kaiteki h3 {
    color: var(--pool);
    font-size: 28px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 40px;
  }

  #pool_popup #kaiteki ul {
    display: flex;
    flex-direction: column;
    gap: 40px 0;
    width: 340px;
    margin: 0 auto;
  }

  #pool_popup #kaiteki ul li {
    width: 100%;
  }

  #pool_popup #kaiteki ul li img {
    border-radius: 30px;
    width: 100%;
    margin-bottom: 20px;
  }

  #pool_popup #kaiteki ul li h4 {
    color: var(--pool);
    font-size: 22px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: 15px;
  }

  #pool_popup #kaiteki ul li p {
    color: var(--bw2);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #pool_popup .area#swimming {
    background: url("../img/popup/pool/swimming.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area#walking {
    background: url("../img/popup/pool/walking.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area#poolprogram {
    background: url("../img/popup/pool/poolprogram.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area h4 {
    position: absolute;
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: linear-gradient(
      to right,
      rgba(255, 255, 255, 0.9) 0,
      rgba(255, 255, 255, 0.9) 70%,
      transparent 100%
    );
    color: var(--bw2);
    font-size: calc(18vw / var(--tablet));
    line-height: calc(28vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    width: calc(300vw / var(--tablet));
    height: calc(76vw / var(--tablet));
    padding-left: calc(45vw / var(--tablet));
    bottom: calc(40vw / var(--tablet));
    left: 0;
  }

  #pool_popup .area h4::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--pool);
    border-radius: calc((5vw / 2) / var(--tablet));
    width: calc(5vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: 50%;
    left: calc(27vw / var(--tablet));
    transform: translateY(-50%);
  }

  #pool_popup .area .course_5 {
    position: absolute;
    width: calc(112vw / var(--tablet));
    height: calc(124vw / var(--tablet));
    bottom: calc(40vw / var(--tablet));
    left: calc(25vw / var(--tablet));
  }

  #pool_popup .area#swimming .course_5 {
    background: url("../img/popup/pool/course/5_swimming.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area#walking .course_5 {
    background: url("../img/popup/pool/course/5_walking.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area#poolprogram .course_5 {
    background: url("../img/popup/pool/course/5_poolprogram.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup #program_search {
    width: 100%;
    margin-bottom: calc(10vw / var(--tablet));
  }

  #pool_popup #program_search .result {
    background: var(--bw5);
    width: 100%;
    padding: calc(45vw / var(--tablet)) 0 calc(30vw / var(--tablet));
  }

  #pool_popup #program_search .result .swiper {
    position: relative;
    width: 100%;
    height: calc(675vw / var(--tablet));
    padding: 0 calc(24vw / var(--tablet));
    margin-bottom: calc(12vw / var(--tablet));
  }

  #pool_popup #program_search .result .swiper .result_wrapper {
    width: calc(340vw / var(--tablet));
    height: calc(624vw / var(--tablet));
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li {
    background: var(--bw6);
    border-radius: 0 0 calc(20vw / var(--tablet)) calc(20vw / var(--tablet));
    box-shadow: 0 0 calc(10vw / var(--tablet)) rgba(0, 0, 0, 0.3);
    margin-right: calc(15vw / var(--tablet));
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li:last-child {
    margin-right: 0;
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .movie {
    position: relative;
    width: 100% !important;
    height: calc((340vw / var(--tablet)) / 16 * 9) !important;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .new_program {
    position: absolute;
    z-index: 1;
    display: block;
    box-sizing: border-box;
    background: #f60000;
    border: 1px solid var(--bw6);
    color: #ffffff;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: calc(13vw / var(--tablet));
    line-height: calc(16vw / var(--tablet));
    font-weight: 700;
    text-align: center;
    width: calc(110vw / var(--tablet));
    height: calc(18vw / var(--tablet));
    border-radius: calc(9vw / var(--tablet));
    top: calc(10vw / var(--tablet));
    left: calc(10vw / var(--tablet));
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .play {
    position: absolute;
    z-index: 1;
    display: block;
    box-sizing: border-box;
    border: calc(6.6vw / var(--tablet)) solid #ffffff;
    border-radius: calc(33vw / var(--tablet));
    box-shadow: 0 calc(2vw / var(--tablet)) calc(2vw / var(--tablet))
      rgba(0, 0, 0, 0.9);
    width: calc(66vw / var(--tablet));
    height: calc(66vw / var(--tablet));
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .play::after {
    position: absolute;
    z-index: 1;
    display: block;
    content: "";
    filter: drop-shadow(
      0 calc(2vw / var(--tablet)) calc(2vw / var(--tablet)) rgba(0, 0, 0, 0.9)
    );
    border-top: calc(13vw / var(--tablet)) solid transparent;
    border-bottom: calc(13vw / var(--tablet)) solid transparent;
    border-left: calc(20vw / var(--tablet)) solid #ffffff;
    width: 0;
    height: 0;
    top: 50%;
    left: 36%;
    transform: translateY(-50%);
    pointer-events: none;
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .movie a {
    width: 100%;
    height: 100%;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    a
    img {
    width: 100%;
    height: 100%;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    iframe {
    width: 100%;
    height: 100%;
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .title {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    background: #f2f8fc;
    width: 100%;
    height: calc(45vw / var(--tablet));
    padding: 0 calc(15vw / var(--tablet)) 0 calc(25vw / var(--tablet));
    margin-bottom: calc(23vw / var(--tablet));
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .title h4 {
    color: var(--bw1);
    font-size: calc(22vw / var(--tablet));
    line-height: 1em;
    font-weight: 600;
    text-align: left;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time {
    color: var(--bw1);
    font-size: calc(12vw / var(--tablet));
    line-height: calc(15vw / var(--tablet));
    font-weight: 400;
    text-align: left;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time
    span.bold {
    font-weight: 600;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time
    span.big {
    font-size: calc(16vw / var(--tablet));
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .point {
    width: 100%;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.7);
    width: 100%;
    padding: 0 calc(20vw / var(--tablet)) 0;
    margin-bottom: calc(20vw / var(--tablet));
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .instructor {
    width: calc(80vw / var(--tablet));
    height: auto;
    object-fit: contain;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi {
    position: relative;
    box-sizing: border-box;
    background: var(--holiday2);
    border-radius: calc(10vw / var(--tablet));
    width: calc(210vw / var(--tablet));
    height: calc(130vw / var(--tablet));
    padding-top: calc(32vw / var(--tablet));
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/studio_kokogamorefun_fukidashi.webp")
      no-repeat;
    background-size: 100% 100%;
    width: calc(18.6vw / var(--tablet));
    height: calc(17.4vw / var(--tablet));
    top: 50%;
    left: calc((-18.6vw / var(--tablet)) / 2);
    transform: translateY(-50%);
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    h4 {
    position: absolute;
    width: calc(157vw / var(--tablet));
    top: calc(-8vw / var(--tablet));
    left: calc(11vw / var(--tablet));
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    h4
    img {
    width: 100%;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    p {
    position: relative;
    z-index: 1;
    color: var(--bw6);
    font-size: calc(14vw / var(--tablet));
    font-weight: 400;
    line-height: calc(18vw / var(--tablet));
    text-align: justify;
    width: calc(190vw / var(--tablet));
    margin: 0 auto;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    p
    span {
    font-weight: 600;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .text {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    font-weight: 400;
    line-height: calc(26vw / var(--tablet));
    text-align: justify;
    width: calc(290vw / var(--tablet));
    border-bottom: calc(1vw / var(--tablet)) solid #7d7d7d;
    padding-bottom: calc(20vw / var(--tablet));
    margin: 0 auto calc(15vw / var(--tablet));
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category {
    display: flex;
    flex-wrap: wrap;
    gap: 0 calc(15vw / var(--tablet));
    width: calc(290vw / var(--tablet));
    margin: 0 auto;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li {
    position: relative;
    color: var(--bw2);
    font-size: calc(12vw / var(--tablet));
    font-weight: 400;
    line-height: calc(22vw / var(--tablet));
    text-align: left;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li::after {
    position: absolute;
    display: block;
    content: "／";
    color: var(--bw2);
    font-size: calc(12vw / var(--tablet));
    font-weight: 400;
    line-height: calc(22vw / var(--tablet));
    text-align: left;
    top: 0;
    right: calc(-14vw / var(--tablet));
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li:last-child::after {
    display: none;
  }

  #pool_popup #program_search .result .swiper .swiper-pagination {
    position: absolute;
    display: flex;
    gap: 0 calc(8vw / var(--tablet));
    bottom: calc(11vw / var(--tablet));
    left: calc(24vw / var(--tablet));
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet {
    background: var(--bw3);
    border-radius: calc((16vw / 2) / var(--tablet));
    width: calc(16vw / var(--tablet));
    height: calc(16vw / var(--tablet));
    margin: 0;
    opacity: 1;
    transition: var(--hover_transition);
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet:hover,
  #pool_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--holiday2);
    transition: var(--hover_transition);
  }

  #pool_popup #program_search .result .swiper .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--tablet));
    width: calc(40vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: auto;
    bottom: 0;
    left: auto;
    right: calc(79vw / var(--tablet));
  }

  #pool_popup #program_search .result .swiper .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--tablet));
    width: calc(40vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: auto;
    bottom: 0;
    left: auto;
    right: calc(24vw / var(--tablet));
  }

  #pool_popup #program_search .result .swiper .swiper-button-prev::after,
  #pool_popup #program_search .result .swiper .swiper-button-next::after {
    display: none;
  }

  #pool_popup #program_search .result .swiper .swiper-button-prev i,
  #pool_popup #program_search .result .swiper .swiper-button-next i {
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
  }

  #pool_popup #kaiteki {
    background: var(--bw6);
    width: 100%;
    padding: calc(50vw / var(--tablet)) 0 calc(10vw / var(--tablet));
  }

  #pool_popup #kaiteki h3 {
    color: var(--pool);
    font-size: calc(28vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(40vw / var(--tablet));
  }

  #pool_popup #kaiteki ul {
    display: flex;
    flex-direction: column;
    gap: calc(40vw / var(--tablet)) 0;
    width: calc(340vw / var(--tablet));
    margin: 0 auto;
  }

  #pool_popup #kaiteki ul li {
    width: 100%;
  }

  #pool_popup #kaiteki ul li img {
    border-radius: calc(30vw / var(--tablet));
    width: 100%;
    margin-bottom: calc(20vw / var(--tablet));
  }

  #pool_popup #kaiteki ul li h4 {
    color: var(--pool);
    font-size: calc(22vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: calc(15vw / var(--tablet));
  }

  #pool_popup #kaiteki ul li p {
    color: var(--bw2);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  #pool_popup .area#swimming {
    background: url("../img/popup/pool/swimming.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area#walking {
    background: url("../img/popup/pool/walking.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area#poolprogram {
    background: url("../img/popup/pool/poolprogram.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area h4 {
    position: absolute;
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: linear-gradient(
      to right,
      rgba(255, 255, 255, 0.9) 0,
      rgba(255, 255, 255, 0.9) 70%,
      transparent 100%
    );
    color: var(--bw2);
    font-size: calc(18vw / var(--sp));
    line-height: calc(28vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    width: calc(300vw / var(--sp));
    height: calc(76vw / var(--sp));
    padding-left: calc(45vw / var(--sp));
    bottom: calc(40vw / var(--sp));
    left: 0;
  }

  #pool_popup .area h4::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--pool);
    border-radius: calc((5vw / 2) / var(--sp));
    width: calc(5vw / var(--sp));
    height: calc(40vw / var(--sp));
    top: 50%;
    left: calc(27vw / var(--sp));
    transform: translateY(-50%);
  }

  #pool_popup .area .course_5 {
    position: absolute;
    width: calc(112vw / var(--sp));
    height: calc(124vw / var(--sp));
    bottom: calc(40vw / var(--sp));
    left: calc(25vw / var(--sp));
  }

  #pool_popup .area#swimming .course_5 {
    background: url("../img/popup/pool/course/5_swimming.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area#walking .course_5 {
    background: url("../img/popup/pool/course/5_walking.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup .area#poolprogram .course_5 {
    background: url("../img/popup/pool/course/5_poolprogram.webp") no-repeat;
    background-size: 100% 100%;
  }

  #pool_popup #program_search {
    width: 100%;
    margin-bottom: calc(10vw / var(--sp));
  }

  #pool_popup #program_search .result {
    background: var(--bw5);
    width: 100%;
    padding: calc(45vw / var(--sp)) 0 calc(30vw / var(--sp));
  }

  #pool_popup #program_search .result .swiper {
    position: relative;
    width: 100%;
    height: calc(675vw / var(--sp));
    padding: 0 calc(24vw / var(--sp));
    margin-bottom: calc(12vw / var(--sp));
  }

  #pool_popup #program_search .result .swiper .result_wrapper {
    width: calc(340vw / var(--sp));
    height: calc(624vw / var(--sp));
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li {
    background: var(--bw6);
    border-radius: 0 0 calc(20vw / var(--sp)) calc(20vw / var(--sp));
    box-shadow: 0 0 calc(10vw / var(--sp)) rgba(0, 0, 0, 0.3);
    margin-right: calc(15vw / var(--sp));
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li:last-child {
    margin-right: 0;
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .movie {
    position: relative;
    width: 100% !important;
    height: calc(340vw / var(--sp) / 16 * 9) !important;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .new_program {
    position: absolute;
    z-index: 1;
    display: block;
    box-sizing: border-box;
    background: #f60000;
    border: calc(1vw / var(--sp)) solid var(--bw6);
    color: #ffffff;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: calc(13vw / var(--sp));
    line-height: calc(16vw / var(--sp));
    font-weight: 700;
    text-align: center;
    width: calc(110vw / var(--sp));
    height: calc(18vw / var(--sp));
    border-radius: calc(9vw / var(--sp));
    top: calc(10vw / var(--sp));
    left: calc(10vw / var(--sp));
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .play {
    position: absolute;
    z-index: 1;
    display: block;
    box-sizing: border-box;
    border: calc(6.6vw / var(--sp)) solid #ffffff;
    border-radius: calc(33vw / var(--sp));
    box-shadow: 0 calc(2vw / var(--sp)) calc(2vw / var(--sp)) rgba(0, 0, 0, 0.9);
    width: calc(66vw / var(--sp));
    height: calc(66vw / var(--sp));
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    .play::after {
    position: absolute;
    z-index: 1;
    display: block;
    content: "";
    filter: drop-shadow(
      0 calc(2vw / var(--sp)) calc(2vw / var(--sp)) rgba(0, 0, 0, 0.9)
    );
    border-top: calc(13vw / var(--sp)) solid transparent;
    border-bottom: calc(13vw / var(--sp)) solid transparent;
    border-left: calc(20vw / var(--sp)) solid #ffffff;
    width: 0;
    height: 0;
    top: 50%;
    left: 36%;
    transform: translateY(-50%);
    pointer-events: none;
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .movie a {
    width: 100%;
    height: 100%;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    a
    img {
    width: 100%;
    height: 100%;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .movie
    iframe {
    width: 100%;
    height: 100%;
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .title {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    background: #f2f8fc;
    width: 100%;
    height: calc(45vw / var(--sp));
    padding: 0 calc(15vw / var(--sp)) 0 calc(25vw / var(--sp));
    margin-bottom: calc(23vw / var(--sp));
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .title h4 {
    color: var(--bw1);
    font-size: calc(22vw / var(--sp));
    line-height: 1em;
    font-weight: 600;
    text-align: left;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time {
    color: var(--bw1);
    font-size: calc(12vw / var(--sp));
    line-height: calc(15vw / var(--sp));
    font-weight: 400;
    text-align: left;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time
    span.bold {
    font-weight: 600;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .title
    .time
    span.big {
    font-size: calc(16vw / var(--sp));
  }

  #pool_popup #program_search .result .swiper .result_wrapper > li .point {
    width: 100%;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.7);
    width: 100%;
    padding: 0 calc(20vw / var(--sp)) 0;
    margin-bottom: calc(20vw / var(--sp));
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .instructor {
    width: calc(80vw / var(--sp));
    height: auto;
    object-fit: contain;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi {
    position: relative;
    box-sizing: border-box;
    background: var(--holiday2);
    border-radius: calc(10vw / var(--sp));
    width: calc(210vw / var(--sp));
    height: calc(130vw / var(--sp));
    padding-top: calc(32vw / var(--sp));
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/popup/studio/studio_kokogamorefun_fukidashi.webp")
      no-repeat;
    background-size: 100% 100%;
    width: calc(18.6vw / var(--sp));
    height: calc(17.4vw / var(--sp));
    top: 50%;
    left: calc((-18.6vw / 2) / var(--sp));
    transform: translateY(-50%);
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    h4 {
    position: absolute;
    width: calc(157vw / var(--sp));
    top: calc(-8vw / var(--sp));
    left: calc(11vw / var(--sp));
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    h4
    img {
    width: 100%;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    p {
    position: relative;
    z-index: 1;
    color: var(--bw6);
    font-size: calc(14vw / var(--sp));
    font-weight: 400;
    line-height: calc(18vw / var(--sp));
    text-align: justify;
    width: calc(190vw / var(--sp));
    margin: 0 auto;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .kokogamorefun
    .fukidashi
    p
    span {
    font-weight: 600;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .text {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    font-weight: 400;
    line-height: calc(26vw / var(--sp));
    text-align: justify;
    width: calc(290vw / var(--sp));
    border-bottom: calc(1vw / var(--sp)) solid #7d7d7d;
    padding-bottom: calc(20vw / var(--sp));
    margin: 0 auto calc(15vw / var(--sp));
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category {
    display: flex;
    flex-wrap: wrap;
    gap: 0 calc(15vw / var(--sp));
    width: calc(290vw / var(--sp));
    margin: 0 auto;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li {
    position: relative;
    color: var(--bw2);
    font-size: calc(12vw / var(--sp));
    font-weight: 400;
    line-height: calc(22vw / var(--sp));
    text-align: left;
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li::after {
    position: absolute;
    display: block;
    content: "／";
    color: var(--bw2);
    font-size: calc(12vw / var(--sp));
    font-weight: 400;
    line-height: calc(22vw / var(--sp));
    text-align: left;
    top: 0;
    right: calc(-14vw / var(--sp));
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .result_wrapper
    > li
    .point
    .category
    li:last-child::after {
    display: none;
  }

  #pool_popup #program_search .result .swiper .swiper-pagination {
    position: absolute;
    display: flex;
    gap: 0 calc(8vw / var(--sp));
    bottom: calc(11vw / var(--sp));
    left: calc(24vw / var(--sp));
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet {
    background: var(--bw3);
    border-radius: calc((16vw / 2) / var(--sp));
    width: calc(16vw / var(--sp));
    height: calc(16vw / var(--sp));
    margin: 0;
    opacity: 1;
    transition: var(--hover_transition);
  }

  #pool_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet:hover,
  #pool_popup
    #program_search
    .result
    .swiper
    .swiper-pagination
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--holiday2);
    transition: var(--hover_transition);
  }

  #pool_popup #program_search .result .swiper .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--sp));
    width: calc(40vw / var(--sp));
    height: calc(40vw / var(--sp));
    top: auto;
    bottom: 0;
    left: auto;
    right: calc(79vw / var(--sp));
  }

  #pool_popup #program_search .result .swiper .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--sp));
    width: calc(40vw / var(--sp));
    height: calc(40vw / var(--sp));
    top: auto;
    bottom: 0;
    left: auto;
    right: calc(24vw / var(--sp));
  }

  #pool_popup #program_search .result .swiper .swiper-button-prev::after,
  #pool_popup #program_search .result .swiper .swiper-button-next::after {
    display: none;
  }

  #pool_popup #program_search .result .swiper .swiper-button-prev i,
  #pool_popup #program_search .result .swiper .swiper-button-next i {
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
  }

  #pool_popup #kaiteki {
    background: var(--bw6);
    width: 100%;
    padding: calc(50vw / var(--sp)) 0 calc(10vw / var(--sp));
  }

  #pool_popup #kaiteki h3 {
    color: var(--pool);
    font-size: calc(28vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(40vw / var(--sp));
  }

  #pool_popup #kaiteki ul {
    display: flex;
    flex-direction: column;
    gap: calc(40vw / var(--sp)) 0;
    width: calc(340vw / var(--sp));
    margin: 0 auto;
  }

  #pool_popup #kaiteki ul li {
    width: 100%;
  }

  #pool_popup #kaiteki ul li img {
    border-radius: calc(30vw / var(--sp));
    width: 100%;
    margin-bottom: calc(20vw / var(--sp));
  }

  #pool_popup #kaiteki ul li h4 {
    color: var(--pool);
    font-size: calc(22vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: calc(15vw / var(--sp));
  }

  #pool_popup #kaiteki ul li p {
    color: var(--bw2);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
  }
}

/************************************
#relax_popup
************************************/
@media screen and (min-width: 1366px) {
  #relax_popup .area#spa {
    background: url("../img/popup/relax/spa.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#sauna {
    background: url("../img/popup/relax/sauna.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#mizuburo {
    background: url("../img/popup/relax/mizuburo.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#araiba {
    background: url("../img/popup/relax/araiba.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#lounge {
    background: url("../img/popup/relax/lounge.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#locker {
    background: url("../img/popup/relax/locker.webp") no-repeat;
    background-size: 100% 100%;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #relax_popup .area#spa {
    background: url("../img/popup/relax/spa.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#sauna {
    background: url("../img/popup/relax/sauna.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#mizuburo {
    background: url("../img/popup/relax/mizuburo.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#araiba {
    background: url("../img/popup/relax/araiba.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#lounge {
    background: url("../img/popup/relax/lounge.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#locker {
    background: url("../img/popup/relax/locker.webp") no-repeat;
    background-size: 100% 100%;
  }
}

@media screen and (max-width: 767px) {
  #relax_popup .area#spa {
    background: url("../img/popup/relax/spa.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#sauna {
    background: url("../img/popup/relax/sauna.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#mizuburo {
    background: url("../img/popup/relax/mizuburo.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#araiba {
    background: url("../img/popup/relax/araiba.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#lounge {
    background: url("../img/popup/relax/lounge.webp") no-repeat;
    background-size: 100% 100%;
  }

  #relax_popup .area#locker {
    background: url("../img/popup/relax/locker.webp") no-repeat;
    background-size: 100% 100%;
  }
}

/************************************
#voice
************************************/
@media screen and (min-width: 1366px) {
  #voice {
    position: relative;
    background: var(--bw5);
    width: 100%;
    padding: 60px 0 50px;
  }

  #voice h2 {
    color: var(--bw1);
    font-size: 34px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 15px;
  }

  #voice .info {
    color: var(--bw1);
    font-size: 16px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 30px;
  }

  #voice ul {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 40px;
    width: 1100px;
    margin: 0 auto 25px;
  }

  #voice ul li {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid #f3ad7d;
    border-radius: 10px;
    width: 340px;
  }

  #voice ul li .title {
    position: relative;
    box-sizing: border-box;
    background: #fef7f2;
    width: 100%;
    padding: 5px 0 10px;
  }

  #voice ul li .title h3 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    color: var(--bw1);
    font-size: 22px;
    line-height: 32px;
    font-weight: var(--bold);
    text-align: justify;
    width: 300px;
    min-height: calc(32px * 2);
    margin: 0 auto 5px;
  }

  #voice ul li.open .title h3 {
    display: block;
  }

  #voice ul li .title .user {
    display: flex;
    width: 300px;
    bottom: 10px;
    margin: 0 auto;
  }

  #voice ul li .title .user p {
    position: relative;
    color: #615d5d;
    font-size: 12px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    padding-left: 1em;
  }

  #voice ul li .title .user p::before {
    position: absolute;
    display: block;
    content: "・";
    color: #f3ad7d;
    font-size: 12px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: 1em;
    top: 0;
    left: 0;
  }

  #voice ul li .text {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: 60px;
    padding-top: 8px;
  }

  #voice ul li.open .text {
    height: auto;
    padding-bottom: 8px;
  }

  #voice ul li .text::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(
      to top,
      var(--bw6) 0%,
      var(--bw6) 15%,
      rgba(255, 255, 255, 0) 100%
    );
    width: 100%;
    height: 100%;
    bottom: 0;
  }

  #voice ul li.open .text::after {
    display: none;
  }

  #voice ul li .text p {
    color: var(--bw2);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: justify;
    width: 300px;
    margin: 0 auto;
  }

  #voice ul li i {
    position: absolute;
    color: var(--bw1);
    font-size: 16px;
    text-align: center;
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
  }

  #voice ul li.open i {
    display: none;
  }

  #voice .more {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--bw6);
    color: var(--bw2);
    font-size: 18px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc(48px / 2);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
    width: 450px;
    height: 48px;
    margin: 0 auto;
    transition: var(--hover_transition);
  }

  #voice .more:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #voice .more i {
    position: absolute;
    color: #f3ad7d;
    font-size: 22px;
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: 13px;
    transform: translateY(-50%);
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #voice {
    position: relative;
    background: var(--bw5);
    width: 100%;
    padding: calc(60vw / var(--tablet)) 0 calc(50vw / var(--tablet));
  }

  #voice h2 {
    color: var(--bw1);
    font-size: calc(34vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(15vw / var(--tablet));
  }

  #voice .info {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(30vw / var(--tablet));
  }

  #voice ul {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: calc(40vw / var(--tablet));
    width: calc(1100vw / var(--tablet));
    margin: 0 auto calc(25vw / var(--tablet));
  }

  #voice ul li {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid #f3ad7d;
    border-radius: calc(10vw / var(--tablet));
    width: calc(340vw / var(--tablet));
  }

  #voice ul li .title {
    position: relative;
    box-sizing: border-box;
    background: #fef7f2;
    width: 100%;
    padding: calc(5vw / var(--tablet)) 0 calc(10vw / var(--tablet));
  }

  #voice ul li .title h3 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    color: var(--bw1);
    font-size: calc(22vw / var(--tablet));
    line-height: calc(32vw / var(--tablet));
    font-weight: var(--bold);
    text-align: justify;
    width: calc(300vw / var(--tablet));
    min-height: calc((32vw * 2) / var(--tablet));
    margin: 0 auto calc(5vw / var(--tablet));
  }

  #voice ul li.open .title h3 {
    display: block;
  }

  #voice ul li .title .user {
    display: flex;
    width: calc(300vw / var(--tablet));
    bottom: calc(10vw / var(--tablet));
    margin: 0 auto;
  }

  #voice ul li .title .user p {
    position: relative;
    color: #615d5d;
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    padding-left: 1em;
  }

  #voice ul li .title .user p::before {
    position: absolute;
    display: block;
    content: "・";
    color: #f3ad7d;
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: 1em;
    top: 0;
    left: 0;
  }

  #voice ul li .text {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: calc(60vw / var(--tablet));
    padding-top: calc(8vw / var(--tablet));
  }

  #voice ul li.open .text {
    height: auto;
    padding-bottom: calc(8vw / var(--tablet));
  }

  #voice ul li .text::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(
      to top,
      var(--bw6) 0%,
      var(--bw6) 15%,
      rgba(255, 255, 255, 0) 100%
    );
    width: 100%;
    height: 100%;
    bottom: 0;
  }

  #voice ul li.open .text::after {
    display: none;
  }

  #voice ul li .text p {
    color: var(--bw2);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: justify;
    width: calc(300vw / var(--tablet));
    margin: 0 auto;
  }

  #voice ul li i {
    position: absolute;
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    text-align: center;
    bottom: calc(5vw / var(--tablet));
    left: 50%;
    transform: translateX(-50%);
  }

  #voice ul li.open i {
    display: none;
  }

  #voice .more {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--bw6);
    color: var(--bw2);
    font-size: calc(18vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((48vw / 2) / var(--tablet));
    box-shadow: 0 0 calc(4vw / var(--tablet)) rgba(0, 0, 0, 0.5);
    width: calc(450vw / var(--tablet));
    height: calc(48vw / var(--tablet));
    margin: 0 auto;
    transition: var(--hover_transition);
  }

  #voice .more:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #voice .more i {
    position: absolute;
    color: #f3ad7d;
    font-size: calc(22vw / var(--tablet));
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: calc(13vw / var(--tablet));
    transform: translateY(-50%);
  }
}

@media screen and (max-width: 767px) {
  #voice {
    position: relative;
    background: var(--bw5);
    width: 100%;
    padding: calc(50vw / var(--sp)) 0;
  }

  #voice h2 {
    color: var(--bw1);
    font-size: calc(34vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(10vw / var(--sp));
  }

  #voice .info {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(15vw / var(--sp));
  }

  #voice ul {
    display: flex;
    flex-direction: column;
    gap: calc(10vw / var(--sp)) 0;
    width: calc(340vw / var(--sp));
    margin: 0 auto calc(25vw / var(--sp));
  }

  #voice ul li {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid #f3ad7d;
    border-radius: calc(10vw / var(--sp));
    width: 100%;
  }

  #voice ul li .title {
    position: relative;
    box-sizing: border-box;
    background: #fef7f2;
    width: 100%;
    padding: calc(5vw / var(--sp)) 0 calc(10vw / var(--sp));
  }

  #voice ul li .title h3 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    color: var(--bw1);
    font-size: calc(22vw / var(--sp));
    line-height: calc(32vw / var(--sp));
    font-weight: var(--bold);
    text-align: justify;
    width: calc(300vw / var(--sp));
    min-height: calc((32vw * 2) / var(--sp));
    margin: 0 auto calc(5vw / var(--sp));
  }

  #voice ul li.open .title h3 {
    display: block;
  }

  #voice ul li .title .user {
    display: flex;
    width: calc(300vw / var(--sp));
    bottom: calc(10vw / var(--sp));
    margin: 0 auto;
  }

  #voice ul li .title .user p {
    position: relative;
    color: #615d5d;
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    padding-left: 1em;
  }

  #voice ul li .title .user p::before {
    position: absolute;
    display: block;
    content: "・";
    color: #f3ad7d;
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: 1em;
    top: 0;
    left: 0;
  }

  #voice ul li .text {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: calc(60vw / var(--sp));
    padding-top: calc(8vw / var(--sp));
  }

  #voice ul li.open .text {
    height: auto;
    padding-bottom: calc(8vw / var(--sp));
  }

  #voice ul li .text::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(
      to top,
      var(--bw6) 0%,
      var(--bw6) 15%,
      rgba(255, 255, 255, 0) 100%
    );
    width: 100%;
    height: 100%;
    bottom: 0;
  }

  #voice ul li.open .text::after {
    display: none;
  }

  #voice ul li .text p {
    color: var(--bw2);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--regular);
    text-align: justify;
    width: calc(300vw / var(--sp));
    margin: 0 auto;
  }

  #voice ul li i {
    position: absolute;
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    text-align: center;
    bottom: calc(5vw / var(--sp));
    left: 50%;
    transform: translateX(-50%);
  }

  #voice ul li.open i {
    display: none;
  }

  #voice .more {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--bw6);
    color: var(--bw2);
    font-size: calc(16vw / var(--sp));
    line-height: calc(28vw / var(--sp));
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((70vw / 2) / var(--sp));
    box-shadow: 0 0 calc(4vw / var(--sp)) rgba(0, 0, 0, 0.5);
    width: calc(330vw / var(--sp));
    height: calc(70vw / var(--sp));
    margin: 0 auto;
    transition: var(--hover_transition);
  }

  #voice .more:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #voice .more i {
    position: absolute;
    color: #f3ad7d;
    font-size: calc(22vw / var(--sp));
    line-height: 1em;
    text-align: right;
    top: 50%;
    right: calc(13vw / var(--sp));
    transform: translateY(-50%);
  }
}

/************************************
#guide_popup
************************************/
@media screen and (min-width: 1366px) {
  #guide_popup > h2 {
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: #0060b6;
    color: var(--bw6);
    font-size: 28px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    height: 60px;
    padding-left: 25px;
  }

  #guide_popup .guide_menu {
    position: relative;
    background: var(--holiday2);
    width: 100%;
    padding: 30px 0;
    margin-bottom: 15px;
  }

  #guide_popup .guide_menu::before {
    position: absolute;
    display: block;
    content: "";
    aspect-ratio: 1;
    background: linear-gradient(
      45deg,
      rgba(255, 255, 255, 0.1),
      rgba(255, 255, 255, 0.1)
    );
    clip-path: polygon(100% 100%, 0% 0, 100% 0);
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
  }

  #guide_popup .guide_menu ul {
    display: flex;
    flex-wrap: wrap;
    background: var(--bw6);
    border-radius: 15px;
    width: 324px;
    height: 73px;
    margin: 0 auto 30px;
  }

  #guide_popup .guide_menu ul li {
    position: relative;
    box-sizing: border-box;
    flex-grow: 1;
    color: var(--bw2);
    font-size: 15px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    height: 100%;
    padding-top: 48px;
    transition: var(--hover_transition);
  }

  #guide_popup .guide_menu ul li::before {
    position: absolute;
    display: block;
    content: "";
    left: 50%;
    transform: translateX(-50%);
  }

  #guide_popup .guide_menu ul li.guide_entry::before {
    background: url("../img/guide/icon_entry.webp") no-repeat;
    background-size: 100% 100%;
    width: 33px;
    height: 30px;
    top: 9px;
  }

  #guide_popup .guide_menu ul li.guide_mochimono::before {
    background: url("../img/guide/icon_mochimono.webp") no-repeat;
    background-size: 100% 100%;
    width: 30px;
    height: 32px;
    top: 7px;
  }

  #guide_popup .guide_menu ul li.guide_howto::before {
    background: url("../img/guide/icon_howto.webp") no-repeat;
    background-size: 100% 100%;
    width: 34px;
    height: 23px;
    top: 15px;
  }

  #guide_popup .guide_menu ul li::after {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw3);
    border-radius: calc(2px / 2);
    width: 2px;
    height: 55px;
    top: 50%;
    right: calc(-2px / 2);
    transform: translateY(-50%);
  }

  #guide_popup .guide_menu ul li:last-child::after {
    display: none;
  }

  #guide_popup .guide_menu p {
    color: var(--bw6);
    font-size: 20px;
    line-height: 30px;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
  }

  #guide_popup .guide_detail {
    background: var(--bw5);
    width: 100%;
    margin-bottom: 15px;
  }

  #guide_popup .guide_detail > .title {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    padding: 30px 0 30px 46px;
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail > .title:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail > .title::before {
    position: absolute;
    display: block;
    content: "";
    border-radius: calc(6px / 2);
    width: 6px;
    height: 80px;
    top: 50%;
    left: 25px;
    transform: translateY(-50%);
  }

  #guide_popup .guide_detail#guide_entry > .title::before {
    background: var(--gym);
  }

  #guide_popup .guide_detail#guide_mochimono > .title::before {
    background: var(--studio);
  }

  #guide_popup .guide_detail#guide_howto > .title::before {
    background: var(--holiday2);
  }

  #guide_popup .guide_detail > .title h3 {
    display: flex;
    align-items: center;
    gap: 0 12px;
    width: 100%;
    margin-bottom: 10px;
  }

  #guide_popup .guide_detail#guide_entry > .title h3 img {
    width: 33px;
  }

  #guide_popup .guide_detail#guide_mochimono > .title h3 img {
    width: 30px;
  }

  #guide_popup .guide_detail#guide_howto > .title h3 img {
    width: 34px;
  }

  #guide_popup .guide_detail > .title h3 p {
    color: var(--bw1);
    font-size: 28px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
  }

  #guide_popup .guide_detail > .title .text {
    color: var(--bw2);
    font-size: 16px;
    line-height: 22px;
    font-weight: var(--regular);
    text-align: left;
  }

  #guide_popup .guide_detail > .title i {
    position: absolute;
    display: block;
    align-content: center;
    box-sizing: border-box;
    background: var(--bw6);
    font-size: 16px;
    line-height: 36px;
    text-align: center;
    border-radius: calc(36px / 2);
    width: 36px;
    height: 36px;
    top: 50%;
    right: 25px;
    transform: translateY(-50%);
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail > .title.open i {
    transform: translateY(-50%) rotate(180deg);
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail#guide_entry > .title i {
    color: var(--gym);
    border: 1px solid var(--gym);
  }

  #guide_popup .guide_detail#guide_mochimono > .title i {
    color: var(--studio);
    border: 1px solid var(--studio);
  }

  #guide_popup .guide_detail#guide_howto > .title i {
    color: var(--holiday2);
    border: 1px solid var(--holiday2);
  }

  #guide_popup .guide_detail .wrapper {
    display: none;
    width: 100%;
    padding-bottom: 50px;
  }

  #guide_popup .guide_detail .wrapper .detail_menu {
    display: flex;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: 10px;
    width: 340px;
    height: 60px;
    margin: 0 auto 30px;
  }

  #guide_popup .guide_detail .wrapper .detail_menu li {
    width: 50%;
    height: 100%;
  }

  #guide_popup .guide_detail .wrapper .detail_menu li a {
    position: relative;
    display: block;
    border-right: 1px solid var(--bw3);
    width: 100%;
    height: 100%;
  }

  #guide_popup .guide_detail .wrapper .detail_menu li:last-child a {
    border-right: none;
  }

  #guide_popup .guide_detail .wrapper .detail_menu li a p {
    display: block;
    align-content: center;
    font-size: 14px;
    line-height: 18px;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    height: 100%;
    padding-bottom: 10px;
  }

  #guide_popup .guide_detail#guide_entry .wrapper .detail_menu li a p {
    color: var(--gym);
  }

  #guide_popup .guide_detail#guide_mochimono .wrapper .detail_menu li a p {
    color: var(--studio);
  }

  #guide_popup .guide_detail .wrapper .detail_menu li a i {
    position: absolute;
    color: var(--bw1);
    font-size: 10px;
    line-height: 1em;
    text-align: center;
    bottom: 4px;
    left: 50%;
    transform: translateX(-50%);
  }

  #guide_popup .guide_detail .wrapper #guide_entry_choose {
    width: 100%;
    margin-bottom: 40px;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_choose h4,
  #guide_popup .guide_detail .wrapper #guide_entry_need h4,
  #guide_popup .guide_detail .wrapper #guide_mochimono_wear h4,
  #guide_popup .guide_detail .wrapper #guide_mochimono_other h4 {
    box-sizing: border-box;
    color: var(--bw1);
    font-size: 28px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    padding-left: 25px;
    margin-bottom: 25px;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_choose .guide_entry_wrapper {
    width: 100%;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web {
    margin-bottom: 30px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    h5 {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    padding-left: 25px;
    margin-bottom: 15px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    h5
    p {
    font-size: 24px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    h5
    p {
    color: var(--pair);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    h5
    p {
    color: var(--under29);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    h5
    small {
    position: absolute;
    display: block;
    align-content: center;
    background: var(--gym);
    color: var(--bw6);
    font-size: 12px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc(20px / 2);
    width: 226px;
    height: 20px;
    top: 50%;
    right: 5px;
    transform: translateY(-50%);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol {
    overflow-x: auto;
    display: flex;
    gap: 0 15px;
    width: 100%;
    padding: 0 25px 10px 25px;
  }



  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: 20px;
    width: 250px;
    padding: 3px;
    z-index: 0;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li {
    height: 240px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li {
    height: 220px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li::after {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw4);
    width: 50%;
    height: 30px;
    top: 50%;
    left: calc(100% + 1px);
    z-index: -1;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li:last-child::after {
    display: none;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .title {
    display: flex;
    align-items: center;
    gap: 0 12px;
    box-sizing: border-box;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    width: 100%;
    height: 76px;
    padding-left: 12px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li
    .title {
    background: #fef7f1;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li
    .title {
    background: #f0fafa;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .title
    .number {
    display: block;
    align-content: center;
    font-family: "Quicksand", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    color: var(--bw6);
    font-size: 18px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc(27px / 2);
    width: 27px;
    height: 27px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li
    .title
    .number {
    background: var(--pair);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li
    .title
    .number {
    background: var(--under29);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li:nth-child(1)
    .title
    img {
    width: 25px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li:nth-child(2)
    .title
    img {
    width: 34px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li:nth-child(3)
    .title
    img {
    width: 25px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li:nth-child(4)
    .title
    img {
    width: 34px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(1)
    .title
    img {
    width: 45px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(2)
    .title
    img {
    width: 34px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(3)
    .title
    img {
    width: 25px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(4)
    .title
    img {
    width: 40px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(5)
    .title
    img {
    width: 34px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .title
    h6 {
    color: var(--bw1);
    font-size: 18px;
    line-height: 28px;
    font-weight: var(--bold);
    text-align: left;
    padding-top: 7px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .text {
    flex-grow: 1;
    position: relative;
    box-sizing: border-box;
    padding-top: 15px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .text
    p {
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: left;
    width: 216px;
    margin: 0 auto;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .text
    .guide_slot_extra {
    width: 216px;
    margin: 8px auto 0;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .text
    small {
    position: absolute;
    color: var(--bw1);
    font-size: 10px;
    line-height: 12px;
    font-weight: var(--regular);
    text-align: left;
    width: 216px;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
  }

  #guide_popup .guide_detail .wrapper #guide_entry_choose > .entry {
    background: transparent;
    padding-bottom: 0;
  }

  #guide_popup .guide_detail .wrapper > hr {
    border-top: 1px solid var(--bw3);
    border-bottom: none;
    border-left: none;
    border-right: none;
    width: 340px;
    margin: 0 auto 30px;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need {
    width: 100%;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need {
    overflow-x: scroll;
    display: flex;
    gap: 0 15px;
    width: 100%;
    padding: 0 25px 10px 25px;
    margin-bottom: 30px;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: 20px;
    width: 320px;
    height: 190px;
    padding: 3px;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .title {
    display: flex;
    align-items: center;
    gap: 0 12px;
    box-sizing: border-box;
    background: #f3fcfc;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    width: 100%;
    height: 64px;
    padding-left: 12px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .need
    li
    .title
    .number {
    display: block;
    align-content: center;
    background: var(--holiday2);
    font-family: "Quicksand", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    color: var(--bw6);
    font-size: 18px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc(27px / 2);
    width: 27px;
    height: 27px;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .title h5 {
    color: var(--bw1);
    font-size: 18px;
    line-height: 28px;
    font-weight: var(--bold);
    text-align: left;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .text {
    flex-grow: 1;
    position: relative;
    box-sizing: border-box;
    padding-top: 10px;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .text p {
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: left;
    width: 283px;
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .text .guide_slot_extra {
    width: 283px;
    margin: 8px auto 0;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .text small {
    position: absolute;
    color: var(--bw1);
    font-size: 10px;
    line-height: 12px;
    font-weight: var(--regular);
    text-align: left;
    bottom: 10px;
    left: 13px;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need > h5 {
    box-sizing: border-box;
    color: var(--bw1);
    font-size: 24px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    padding-left: 25px;
    margin-bottom: 25px;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .requirements {
    display: flex;
    flex-direction: column;
    gap: 15px 0;
    width: 340px;
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .requirements li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: 20px;
    width: 100%;
    padding: 3px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .title {
    display: flex;
    align-items: center;
    gap: 0 12px;
    box-sizing: border-box;
    background: #f3fcfc;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    width: 100%;
    height: 46px;
    padding-left: 12px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .title
    .number {
    display: block;
    align-content: center;
    background: var(--holiday2);
    font-family: "Quicksand", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    color: var(--bw6);
    font-size: 18px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc(27px / 2);
    width: 27px;
    height: 27px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .title
    h6 {
    color: var(--bw1);
    font-size: 18px;
    line-height: 28px;
    font-weight: var(--bold);
    text-align: left;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .requirements li .text {
    flex-grow: 1;
    position: relative;
    box-sizing: border-box;
    padding: 10px 0 30px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .text
    p {
    position: relative;
    box-sizing: border-box;
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: left;
    width: 303px;
    padding-left: 20px;
    margin: 0 auto 20px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .text
    p:last-child {
    margin-bottom: 0;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .text
    p::before {
    position: absolute;
    display: block;
    content: "●";
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: left;
    top: 0;
    left: 0;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear {
    width: 100%;
    margin-bottom: 50px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear h4 {
    margin-bottom: 15px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear > p {
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: left;
    width: 340px;
    margin: 0 auto 20px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul {
    display: flex;
    flex-direction: column;
    gap: 15px 0;
    width: 340px;
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: 20px;
    width: 100%;
    padding: 25px 0;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul li h5 {
    box-sizing: border-box;
    color: var(--holiday2);
    font-size: 18px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-bottom: 2px solid var(--holiday2);
    padding: 0 4px 8px;
    margin: 0 auto 20px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul li img {
    margin: 0 auto 20px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_wear
    ul
    li:nth-child(1)
    img {
    width: 304px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_wear
    ul
    li:nth-child(2)
    img {
    width: 306px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul li small {
    color: var(--bw2);
    font-size: 10px;
    line-height: 14px;
    font-weight: var(--regular);
    text-align: left;
    width: 310px;
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other {
    width: 100%;
    margin-bottom: 50px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    gap: 15px 0;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: 20px;
    width: 340px;
    padding: 20px 0;
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    width: 132px;
    height: 190px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul li .illust {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(1)
    .illust
    img {
    width: 55px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(2)
    .illust
    img {
    width: 98px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(3)
    .illust
    img {
    width: 96px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(4)
    .illust
    img {
    width: 77px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(5)
    .illust
    img {
    width: 78px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(6)
    .illust
    img {
    width: 87px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(7)
    .illust
    img {
    width: 91px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(8)
    .illust
    img {
    width: 94px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul li h5 {
    color: var(--bw1);
    font-size: 20px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: 5px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul li p {
    color: var(--bw2);
    font-size: 14px;
    line-height: 22px;
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
    height: 70px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 210px;
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(to top, var(--bw6) 0%, transparent 100%);
    width: 340px;
    height: 150px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    transition: all 0.5s;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental.is_open::after {
    display: none;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental > h5 {
    box-sizing: border-box;
    color: var(--bw1);
    font-size: 24px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    padding-left: 25px;
    margin-bottom: 10px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .guide_rental_note {
    color: var(--bw1);
    font-size: 10px;
    line-height: 1em;
    font-weight: var(--regular);
    padding-left: 25px;
    margin-bottom: 25px;
    display: block;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup {
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: 20px;
    width: 340px;
    padding: 20px 0;
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup ul {
    width: 290px;
    margin: 0 auto 20px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup ul li {
    position: relative;
    display: flex;
    border-bottom: 1px solid var(--bw4);
    width: 100%;
    margin: 0 auto 20px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li:nth-child(1) {
    padding: 20px 0;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li:nth-child(2) {
    padding: 20px 0 35px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .photo {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li:nth-child(1)
    .photo
    img {
    width: 152px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li:nth-child(2)
    .photo
    img {
    width: 148px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text {
    width: 130px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text
    h6 {
    color: var(--bw1);
    font-size: 18px;
    line-height: 28px;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: 5px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text
    h6
    span {
    font-size: calc(18px * 0.8);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text
    p {
    display: block;
    align-content: center;
    background: var(--bw5);
    color: var(--bw1);
    font-size: 16px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    height: 27px;
    margin-bottom: 10px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text
    p
    span {
    font-size: calc(16px * 0.8);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    small {
    position: absolute;
    color: var(--bw1);
    font-size: 10px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    bottom: 20px;
    left: 0;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup > h6 {
    color: var(--bw1);
    font-size: 22px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 290px;
    margin: 0 auto 15px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup table {
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw4);
    width: 290px;
    margin: 0 auto 20px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup table tr {
    display: flex;
    border-bottom: 1px solid var(--bw4);
    width: 100%;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    table
    tr:last-child {
    border-bottom: none;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    table
    tr
    th {
    box-sizing: border-box;
    background: var(--bw5);
    color: var(--bw1);
    font-size: 14px;
    line-height: 20px;
    font-weight: var(--bold);
    text-align: left;
    width: 110px;
    padding: 15px 0 15px 10px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    table
    tr
    td {
    flex-grow: 1;
    box-sizing: border-box;
    color: var(--bw1);
    font-size: 14px;
    line-height: 20px;
    font-weight: var(--regular);
    text-align: left;
    padding: 15px 0 15px 10px;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup hr {
    border-top: 1px solid var(--bw4);
    border-bottom: none;
    border-left: none;
    border-right: none;
    width: 290px;
    margin: 0 auto 20px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other {
    position: relative;
    display: flex;
    width: 290px;
    margin: 0 auto;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .photo {
    flex-grow: 1;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .photo
    img {
    width: 137px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text {
    width: 130px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text
    h6 {
    color: var(--bw1);
    font-size: 18px;
    line-height: 28px;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: 5px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text
    h6
    span {
    font-size: calc(18px * 0.8);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text
    p {
    display: block;
    align-content: center;
    background: var(--bw5);
    color: var(--bw1);
    font-size: 16px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    height: 27px;
    margin-bottom: 10px;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text
    p
    span {
    font-size: calc(16px * 0.8);
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .readmore {
    position: absolute;
    display: block;
    box-sizing: border-box;
    background: var(--bw6);
    color: var(--bw1);
    font-size: 14px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    border: 2px solid #949494;
    border-radius: 4px;
    width: 150px;
    height: 32px;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    transition: var(--hover_transition);
    z-index: 1;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .readmore:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol {
    width: 340px;
    margin: 0 auto;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li {
    border-bottom: 2px solid #d4d4d4;
    width: 100%;
    padding: 40px 0;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li:last-child {
    border-bottom: none;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li h4 {
    display: flex;
    width: 100%;
    margin-bottom: 15px;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li h4 .number {
    position: relative;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    color: var(--holiday2);
    font-size: 32px;
    line-height: 1em;
    font-weight: var(--bold);
    width: 50px;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li h4 .number::after {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw1);
    width: 2px;
    height: 24px;
    top: 4px;
    right: 0;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li h4 .title {
    flex-grow: 1;
    box-sizing: border-box;
    color: var(--bw1);
    font-size: 22px;
    line-height: 32px;
    font-weight: var(--bold);
    text-align: left;
    padding-left: 20px;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .text {
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
    margin-bottom: 15px;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li small {
    display: block;
    color: var(--bw1);
    font-size: 10px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    margin-bottom: 15px;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .guide_slot_extra_note {
    display: block;
    color: var(--bw1);
    font-size: 10px;
    line-height: 1.6em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    margin-bottom: 15px;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store {
    display: flex;
    justify-content: center;
    gap: 0 12px;
    margin: 0 auto;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store .appstore {
    width: 136px;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store .googleplay {
    width: 171px;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store a {
    display: block;
    width: 100%;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store a img {
    width: 100%;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .photo {
    width: 100%;
  }

  #guide_popup .guide_notice {
    color: var(--bw2);
    font-size: 12px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 340px;
    margin: -10px auto 10px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #guide_popup > h2 {
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: #0060b6;
    color: var(--bw6);
    font-size: calc(28vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    height: calc(60vw / var(--tablet));
    padding-left: calc(25vw / var(--tablet));
  }

  #guide_popup .guide_menu {
    position: relative;
    background: var(--holiday2);
    width: 100%;
    padding: calc(30vw / var(--tablet)) 0;
    margin-bottom: calc(15vw / var(--tablet));
  }

  #guide_popup .guide_menu::before {
    position: absolute;
    display: block;
    content: "";
    aspect-ratio: 1;
    background: linear-gradient(
      45deg,
      rgba(255, 255, 255, 0.1),
      rgba(255, 255, 255, 0.1)
    );
    clip-path: polygon(100% 100%, 0% 0, 100% 0);
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
  }

  #guide_popup .guide_menu ul {
    display: flex;
    flex-wrap: wrap;
    background: var(--bw6);
    border-radius: calc(15vw / var(--tablet));
    width: calc(324vw / var(--tablet));
    height: calc(73vw / var(--tablet));
    margin: 0 auto calc(30vw / var(--tablet));
  }

  #guide_popup .guide_menu ul li {
    position: relative;
    box-sizing: border-box;
    flex-grow: 1;
    color: var(--bw2);
    font-size: calc(15vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    height: 100%;
    padding-top: calc(48vw / var(--tablet));
    transition: var(--hover_transition);
  }

  #guide_popup .guide_menu ul li::before {
    position: absolute;
    display: block;
    content: "";
    left: 50%;
    transform: translateX(-50%);
  }

  #guide_popup .guide_menu ul li.guide_entry::before {
    background: url("../img/guide/icon_entry.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(33vw / var(--tablet));
    height: calc(30vw / var(--tablet));
    top: calc(9vw / var(--tablet));
  }

  #guide_popup .guide_menu ul li.guide_mochimono::before {
    background: url("../img/guide/icon_mochimono.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(30vw / var(--tablet));
    height: calc(32vw / var(--tablet));
    top: calc(7vw / var(--tablet));
  }

  #guide_popup .guide_menu ul li.guide_howto::before {
    background: url("../img/guide/icon_howto.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(34vw / var(--tablet));
    height: calc(23vw / var(--tablet));
    top: calc(15vw / var(--tablet));
  }

  #guide_popup .guide_menu ul li::after {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw3);
    border-radius: calc((2vw / 2) / var(--tablet));
    width: calc(2vw / var(--tablet));
    height: calc(55vw / var(--tablet));
    top: 50%;
    right: calc(calc(-2vw / var(--tablet)) / 2);
    transform: translateY(-50%);
  }

  #guide_popup .guide_menu ul li:last-child::after {
    display: none;
  }

  #guide_popup .guide_menu p {
    color: var(--bw6);
    font-size: calc(20vw / var(--tablet));
    line-height: calc(30vw / var(--tablet));
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
  }

  #guide_popup .guide_detail {
    background: var(--bw5);
    width: 100%;
    margin-bottom: calc(15vw / var(--tablet));
  }

  #guide_popup .guide_detail > .title {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    padding: calc(30vw / var(--tablet)) 0 calc(30vw / var(--tablet))
      calc(46vw / var(--tablet));
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail > .title:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail > .title::before {
    position: absolute;
    display: block;
    content: "";
    border-radius: calc((6vw / 2) / var(--tablet));
    width: calc(6vw / var(--tablet));
    height: calc(80vw / var(--tablet));
    top: 50%;
    left: calc(25vw / var(--tablet));
    transform: translateY(-50%);
  }

  #guide_popup .guide_detail#guide_entry > .title::before {
    background: var(--gym);
  }

  #guide_popup .guide_detail#guide_mochimono > .title::before {
    background: var(--studio);
  }

  #guide_popup .guide_detail#guide_howto > .title::before {
    background: var(--holiday2);
  }

  #guide_popup .guide_detail > .title h3 {
    display: flex;
    align-items: center;
    gap: 0 calc(12vw / var(--tablet));
    width: 100%;
    margin-bottom: calc(10vw / var(--tablet));
  }

  #guide_popup .guide_detail#guide_entry > .title h3 img {
    width: calc(33vw / var(--tablet));
  }

  #guide_popup .guide_detail#guide_mochimono > .title h3 img {
    width: calc(30vw / var(--tablet));
  }

  #guide_popup .guide_detail#guide_howto > .title h3 img {
    width: calc(34vw / var(--tablet));
  }

  #guide_popup .guide_detail > .title h3 p {
    color: var(--bw1);
    font-size: calc(28vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
  }

  #guide_popup .guide_detail > .title .text {
    color: var(--bw2);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(22vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
  }

  #guide_popup .guide_detail > .title i {
    position: absolute;
    display: block;
    align-content: center;
    box-sizing: border-box;
    background: var(--bw6);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(36vw / var(--tablet));
    text-align: center;
    border-radius: calc((36vw / 2) / var(--tablet));
    width: calc(36vw / var(--tablet));
    height: calc(36vw / var(--tablet));
    top: 50%;
    right: calc(25vw / var(--tablet));
    transform: translateY(-50%);
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail > .title.open i {
    transform: translateY(-50%) rotate(180deg);
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail#guide_entry > .title i {
    color: var(--gym);
    border: calc(1vw / var(--tablet)) solid var(--gym);
  }

  #guide_popup .guide_detail#guide_mochimono > .title i {
    color: var(--studio);
    border: calc(1vw / var(--tablet)) solid var(--studio);
  }

  #guide_popup .guide_detail#guide_howto > .title i {
    color: var(--holiday2);
    border: calc(1vw / var(--tablet)) solid var(--holiday2);
  }

  #guide_popup .guide_detail .wrapper {
    display: none;
    width: 100%;
    padding-bottom: calc(50vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper .detail_menu {
    display: flex;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc(10vw / var(--tablet));
    width: calc(340vw / var(--tablet));
    height: calc(60vw / var(--tablet));
    margin: 0 auto calc(30vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper .detail_menu li {
    width: 50%;
    height: 100%;
  }

  #guide_popup .guide_detail .wrapper .detail_menu li a {
    position: relative;
    display: block;
    border-right: calc(1vw / var(--tablet)) solid var(--bw3);
    width: 100%;
    height: 100%;
  }

  #guide_popup .guide_detail .wrapper .detail_menu li:last-child a {
    border-right: none;
  }

  #guide_popup .guide_detail .wrapper .detail_menu li a p {
    display: block;
    align-content: center;
    font-size: calc(14vw / var(--tablet));
    line-height: calc(18vw / var(--tablet));
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    height: 100%;
    padding-bottom: calc(10vw / var(--tablet));
  }

  #guide_popup .guide_detail#guide_entry .wrapper .detail_menu li a p {
    color: var(--gym);
  }

  #guide_popup .guide_detail#guide_mochimono .wrapper .detail_menu li a p {
    color: var(--studio);
  }

  #guide_popup .guide_detail .wrapper .detail_menu li a i {
    position: absolute;
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    line-height: 1em;
    text-align: center;
    bottom: calc(4vw / var(--tablet));
    left: 50%;
    transform: translateX(-50%);
  }

  #guide_popup .guide_detail .wrapper #guide_entry_choose {
    width: 100%;
    margin-bottom: calc(40vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_choose h4,
  #guide_popup .guide_detail .wrapper #guide_entry_need h4,
  #guide_popup .guide_detail .wrapper #guide_mochimono_wear h4,
  #guide_popup .guide_detail .wrapper #guide_mochimono_other h4 {
    box-sizing: border-box;
    color: var(--bw1);
    font-size: calc(28vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    padding-left: calc(25vw / var(--tablet));
    margin-bottom: calc(25vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_choose .guide_entry_wrapper {
    width: 100%;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web {
    margin-bottom: calc(30vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    h5 {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    padding-left: calc(25vw / var(--tablet));
    margin-bottom: calc(15vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    h5
    p {
    font-size: calc(24vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    h5
    p {
    color: var(--pair);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    h5
    p {
    color: var(--under29);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    h5
    small {
    position: absolute;
    display: block;
    align-content: center;
    background: var(--gym);
    color: var(--bw6);
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((20vw / 2) / var(--tablet));
    width: calc(226vw / var(--tablet));
    height: calc(20vw / var(--tablet));
    top: 50%;
    right: calc(5vw / var(--tablet));
    transform: translateY(-50%);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol {
    overflow-x: scroll;
    display: flex;
    gap: 0 calc(15vw / var(--tablet));
    width: 100%;
    padding: 0 calc(25vw / var(--tablet)) calc(10vw / var(--tablet)) calc(25vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc(20vw / var(--tablet));
    width: calc(250vw / var(--tablet));
    padding: calc(3vw / var(--tablet));
    z-index: 0;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li {
    height: calc(240vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li {
    height: calc(220vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li::after {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw4);
    width: 50%;
    height: calc(30vw / var(--tablet));
    top: 50%;
    left: calc(100% + (1vw / var(--tablet)));
    z-index: -1;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li:last-child::after {
    display: none;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .title {
    display: flex;
    align-items: center;
    gap: 0 calc(12vw / var(--tablet));
    box-sizing: border-box;
    border-top-left-radius: calc(16vw / var(--tablet));
    border-top-right-radius: calc(16vw / var(--tablet));
    width: 100%;
    height: calc(76vw / var(--tablet));
    padding-left: calc(12vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li
    .title {
    background: #fef7f1;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li
    .title {
    background: #f0fafa;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .title
    .number {
    display: block;
    align-content: center;
    font-family: "Quicksand", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    color: var(--bw6);
    font-size: calc(18vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((27vw / 2) / var(--tablet));
    width: calc(27vw / var(--tablet));
    height: calc(27vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li
    .title
    .number {
    background: var(--pair);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li
    .title
    .number {
    background: var(--under29);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li:nth-child(1)
    .title
    img {
    width: calc(25vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li:nth-child(2)
    .title
    img {
    width: calc(34vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li:nth-child(3)
    .title
    img {
    width: calc(25vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li:nth-child(4)
    .title
    img {
    width: calc(34vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(1)
    .title
    img {
    width: calc(45vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(2)
    .title
    img {
    width: calc(34vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(3)
    .title
    img {
    width: calc(25vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(4)
    .title
    img {
    width: calc(40vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(5)
    .title
    img {
    width: calc(34vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .title
    h6 {
    color: var(--bw1);
    font-size: calc(18vw / var(--tablet));
    line-height: calc(28vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    padding-top: calc(7vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .text {
    flex-grow: 1;
    position: relative;
    box-sizing: border-box;
    padding-top: calc(15vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .text
    p {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    width: calc(216vw / var(--tablet));
    margin: 0 auto;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .text
    .guide_slot_extra {
    width: calc(216vw / var(--tablet));
    margin: calc(8vw / var(--tablet)) auto 0;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .text
    small {
    position: absolute;
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    line-height: calc(12vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    width: calc(216vw / var(--tablet));
    bottom: calc(10vw / var(--tablet));
    left: 50%;
    transform: translateX(-50%);
  }

  #guide_popup .guide_detail .wrapper #guide_entry_choose > .entry {
    background: transparent;
    padding-bottom: 0;
  }

  #guide_popup .guide_detail .wrapper > hr {
    border-top: calc(1vw / var(--tablet)) solid var(--bw3);
    border-bottom: none;
    border-left: none;
    border-right: none;
    width: calc(340vw / var(--tablet));
    margin: 0 auto calc(30vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need {
    width: 100%;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need {
    overflow-x: scroll;
    display: flex;
    gap: 0 calc(15vw / var(--tablet));
    width: 100%;
    padding: 0 calc(25vw / var(--tablet)) calc(10vw / var(--tablet)) calc(25vw / var(--tablet));
    margin-bottom: calc(30vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc(20vw / var(--tablet));
    width: calc(320vw / var(--tablet));
    height: calc(190vw / var(--tablet));
    padding: calc(3vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .title {
    display: flex;
    align-items: center;
    gap: 0 calc(12vw / var(--tablet));
    box-sizing: border-box;
    background: #f3fcfc;
    border-top-left-radius: calc(16vw / var(--tablet));
    border-top-right-radius: calc(16vw / var(--tablet));
    width: 100%;
    height: calc(64vw / var(--tablet));
    padding-left: calc(12vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .need
    li
    .title
    .number {
    display: block;
    align-content: center;
    background: var(--holiday2);
    font-family: "Quicksand", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    color: var(--bw6);
    font-size: calc(18vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((27vw / 2) / var(--tablet));
    width: calc(27vw / var(--tablet));
    height: calc(27vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .title h5 {
    color: var(--bw1);
    font-size: calc(18vw / var(--tablet));
    line-height: calc(28vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .text {
    flex-grow: 1;
    position: relative;
    box-sizing: border-box;
    padding-top: calc(10vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .text p {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    width: calc(283vw / var(--tablet));
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .text .guide_slot_extra {
    width: calc(283vw / var(--tablet));
    margin: calc(8vw / var(--tablet)) auto 0;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .text small {
    position: absolute;
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    line-height: calc(12vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    bottom: calc(10vw / var(--tablet));
    left: calc(13vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need > h5 {
    box-sizing: border-box;
    color: var(--bw1);
    font-size: calc(24vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    padding-left: calc(25vw / var(--tablet));
    margin-bottom: calc(25vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .requirements {
    display: flex;
    flex-direction: column;
    gap: calc(15vw / var(--tablet)) 0;
    width: calc(340vw / var(--tablet));
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .requirements li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc(20vw / var(--tablet));
    width: 100%;
    padding: calc(3vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .title {
    display: flex;
    align-items: center;
    gap: 0 calc(12vw / var(--tablet));
    box-sizing: border-box;
    background: #f3fcfc;
    border-top-left-radius: calc(16vw / var(--tablet));
    border-top-right-radius: calc(16vw / var(--tablet));
    width: 100%;
    height: calc(46vw / var(--tablet));
    padding-left: calc(12vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .title
    .number {
    display: block;
    align-content: center;
    background: var(--holiday2);
    font-family: "Quicksand", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    color: var(--bw6);
    font-size: calc(18vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((27vw / 2) / var(--tablet));
    width: calc(27vw / var(--tablet));
    height: calc(27vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .title
    h6 {
    color: var(--bw1);
    font-size: calc(18vw / var(--tablet));
    line-height: calc(28vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .requirements li .text {
    flex-grow: 1;
    position: relative;
    box-sizing: border-box;
    padding: calc(10vw / var(--tablet)) 0 calc(30vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .text
    p {
    position: relative;
    box-sizing: border-box;
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    width: calc(303vw / var(--tablet));
    padding-left: calc(20vw / var(--tablet));
    margin: 0 auto calc(20vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .text
    p:last-child {
    margin-bottom: 0;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .text
    p::before {
    position: absolute;
    display: block;
    content: "●";
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    top: 0;
    left: 0;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear {
    width: 100%;
    margin-bottom: calc(50vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear h4 {
    margin-bottom: calc(15vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear > p {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    width: calc(340vw / var(--tablet));
    margin: 0 auto calc(20vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul {
    display: flex;
    flex-direction: column;
    gap: calc(15vw / var(--tablet)) 0;
    width: calc(340vw / var(--tablet));
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc(20vw / var(--tablet));
    width: 100%;
    padding: calc(25vw / var(--tablet)) 0;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul li h5 {
    box-sizing: border-box;
    color: var(--holiday2);
    font-size: calc(18vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-bottom: calc(2vw / var(--tablet)) solid var(--holiday2);
    padding: 0 calc(4vw / var(--tablet)) calc(8vw / var(--tablet));
    margin: 0 auto calc(20vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul li img {
    margin: 0 auto calc(20vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_wear
    ul
    li:nth-child(1)
    img {
    width: calc(304vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_wear
    ul
    li:nth-child(2)
    img {
    width: calc(306vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul li small {
    color: var(--bw2);
    font-size: calc(10vw / var(--tablet));
    line-height: calc(14vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    width: calc(310vw / var(--tablet));
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other {
    width: 100%;
    margin-bottom: calc(50vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    gap: calc(15vw / var(--tablet)) 0;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc(20vw / var(--tablet));
    width: calc(340vw / var(--tablet));
    padding: calc(20vw / var(--tablet)) 0;
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    width: calc(132vw / var(--tablet));
    height: calc(190vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul li .illust {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(1)
    .illust
    img {
    width: calc(55vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(2)
    .illust
    img {
    width: calc(98vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(3)
    .illust
    img {
    width: calc(96vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(4)
    .illust
    img {
    width: calc(77vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(5)
    .illust
    img {
    width: calc(78vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(6)
    .illust
    img {
    width: calc(87vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(7)
    .illust
    img {
    width: calc(91vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(8)
    .illust
    img {
    width: calc(94vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul li h5 {
    color: var(--bw1);
    font-size: calc(20vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: calc(5vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul li p {
    color: var(--bw2);
    font-size: calc(14vw / var(--tablet));
    line-height: calc(22vw / var(--tablet));
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
    height: calc(70vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: calc(210vw / var(--tablet));
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(to top, var(--bw6) 0%, transparent 100%);
    width: calc(340vw / var(--tablet));
    height: calc(150vw / var(--tablet));
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    transition: all 0.5s;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental.is_open::after {
    display: none;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental > h5 {
    box-sizing: border-box;
    color: var(--bw1);
    font-size: calc(24vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    padding-left: calc(25vw / var(--tablet));
    margin-bottom: calc(10vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .guide_rental_note {
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    padding-left: calc(25vw / var(--tablet));
    margin-bottom: calc(25vw / var(--tablet));
    display: block;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup {
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc(20vw / var(--tablet));
    width: calc(340vw / var(--tablet));
    padding: calc(20vw / var(--tablet)) 0;
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup ul {
    width: calc(290vw / var(--tablet));
    margin: 0 auto calc(20vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup ul li {
    position: relative;
    display: flex;
    border-bottom: calc(1vw / var(--tablet)) solid var(--bw4);
    width: 100%;
    margin: 0 auto calc(20vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li:nth-child(1) {
    padding: calc(20vw / var(--tablet)) 0;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li:nth-child(2) {
    padding: calc(20vw / var(--tablet)) 0 calc(35vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .photo {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li:nth-child(1)
    .photo
    img {
    width: calc(152vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li:nth-child(2)
    .photo
    img {
    width: calc(148vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text {
    width: calc(130vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text
    h6 {
    color: var(--bw1);
    font-size: calc(18vw / var(--tablet));
    line-height: calc(28vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: calc(5vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text
    h6
    span {
    font-size: calc((18vw / var(--tablet)) * 0.8);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text
    p {
    display: block;
    align-content: center;
    background: var(--bw5);
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    height: calc(27vw / var(--tablet));
    margin-bottom: calc(10vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text
    p
    span {
    font-size: calc((16vw / var(--tablet)) * 0.8);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    small {
    position: absolute;
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    bottom: calc(20vw / var(--tablet));
    left: 0;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup > h6 {
    color: var(--bw1);
    font-size: calc(22vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: calc(290vw / var(--tablet));
    margin: 0 auto calc(15vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup table {
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw4);
    width: calc(290vw / var(--tablet));
    margin: 0 auto calc(20vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup table tr {
    display: flex;
    border-bottom: calc(1vw / var(--tablet)) solid var(--bw4);
    width: 100%;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    table
    tr:last-child {
    border-bottom: none;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    table
    tr
    th {
    box-sizing: border-box;
    background: var(--bw5);
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    line-height: calc(20vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    width: calc(110vw / var(--tablet));
    padding: calc(15vw / var(--tablet)) 0 calc(15vw / var(--tablet))
      calc(10vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    table
    tr
    td {
    flex-grow: 1;
    box-sizing: border-box;
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    line-height: calc(20vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    padding: calc(15vw / var(--tablet)) 0 calc(15vw / var(--tablet))
      calc(10vw / var(--tablet));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup hr {
    border-top: calc(1vw / var(--tablet)) solid var(--bw4);
    border-bottom: none;
    border-left: none;
    border-right: none;
    width: calc(290vw / var(--tablet));
    margin: 0 auto calc(20vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other {
    position: relative;
    display: flex;
    width: calc(290vw / var(--tablet));
    margin: 0 auto;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .photo {
    flex-grow: 1;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .photo
    img {
    width: calc(137vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text {
    width: calc(130vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text
    h6 {
    color: var(--bw1);
    font-size: calc(18vw / var(--tablet));
    line-height: calc(28vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: calc(5vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text
    h6
    span {
    font-size: calc((18vw / var(--tablet)) * 0.8);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text
    p {
    display: block;
    align-content: center;
    background: var(--bw5);
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    height: calc(27vw / var(--tablet));
    margin-bottom: calc(10vw / var(--tablet));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text
    p
    span {
    font-size: calc((16vw / var(--tablet)) * 0.8);
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .readmore {
    position: absolute;
    display: block;
    box-sizing: border-box;
    background: var(--bw6);
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    border: calc(2vw / var(--tablet)) solid #949494;
    border-radius: calc(4vw / var(--tablet));
    width: calc(150vw / var(--tablet));
    height: calc(32vw / var(--tablet));
    bottom: calc(15vw / var(--tablet));
    left: 50%;
    transform: translateX(-50%);
    transition: var(--hover_transition);
    z-index: 1;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .readmore:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol {
    width: calc(340vw / var(--tablet));
    margin: 0 auto;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li {
    border-bottom: calc(2vw / var(--tablet)) solid #d4d4d4;
    width: 100%;
    padding: calc(40vw / var(--tablet)) 0;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li:last-child {
    border-bottom: none;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li h4 {
    display: flex;
    width: 100%;
    margin-bottom: calc(15vw / var(--tablet));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li h4 .number {
    position: relative;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    color: var(--holiday2);
    font-size: calc(32vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    width: calc(50vw / var(--tablet));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li h4 .number::after {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw1);
    width: calc(2vw / var(--tablet));
    height: calc(24vw / var(--tablet));
    top: calc(4vw / var(--tablet));
    right: 0;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li h4 .title {
    flex-grow: 1;
    box-sizing: border-box;
    color: var(--bw1);
    font-size: calc(22vw / var(--tablet));
    line-height: calc(32vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    padding-left: calc(20vw / var(--tablet));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .text {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
    margin-bottom: calc(15vw / var(--tablet));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li small {
    display: block;
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    margin-bottom: calc(15vw / var(--tablet));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .guide_slot_extra_note {
    display: block;
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    line-height: 1.6em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    margin-bottom: calc(15vw / var(--tablet));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store {
    display: flex;
    justify-content: center;
    gap: 0 calc(12vw / var(--tablet));
    margin: 0 auto;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store .appstore {
    width: calc(136vw / var(--tablet));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store .googleplay {
    width: calc(171vw / var(--tablet));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store a {
    display: block;
    width: 100%;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store a img {
    width: 100%;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .photo {
    width: 100%;
  }

  #guide_popup .guide_notice {
    color: var(--bw2);
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: calc(340vw / var(--tablet));
    margin: calc(-10vw / var(--tablet)) auto calc(10vw / var(--tablet));
  }
}

@media screen and (max-width: 767px) {
  #guide_popup > h2 {
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: #0060b6;
    color: var(--bw6);
    font-size: calc(28vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    height: calc(60vw / var(--sp));
    padding-left: calc(25vw / var(--sp));
  }

  #guide_popup .guide_menu {
    position: relative;
    background: var(--holiday2);
    width: 100%;
    padding: calc(30vw / var(--sp)) 0;
    margin-bottom: calc(15vw / var(--sp));
  }

  #guide_popup .guide_menu::before {
    position: absolute;
    display: block;
    content: "";
    aspect-ratio: 1;
    background: linear-gradient(
      45deg,
      rgba(255, 255, 255, 0.1),
      rgba(255, 255, 255, 0.1)
    );
    clip-path: polygon(100% 100%, 0% 0, 100% 0);
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
  }

  #guide_popup .guide_menu ul {
    display: flex;
    flex-wrap: wrap;
    background: var(--bw6);
    border-radius: calc(15vw / var(--sp));
    width: calc(324vw / var(--sp));
    height: calc(73vw / var(--sp));
    margin: 0 auto calc(30vw / var(--sp));
  }

  #guide_popup .guide_menu ul li {
    position: relative;
    box-sizing: border-box;
    flex-grow: 1;
    color: var(--bw2);
    font-size: calc(15vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    height: 100%;
    padding-top: calc(48vw / var(--sp));
    transition: var(--hover_transition);
  }

  #guide_popup .guide_menu ul li::before {
    position: absolute;
    display: block;
    content: "";
    left: 50%;
    transform: translateX(-50%);
  }

  #guide_popup .guide_menu ul li.guide_entry::before {
    background: url("../img/guide/icon_entry.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(33vw / var(--sp));
    height: calc(30vw / var(--sp));
    top: calc(9vw / var(--sp));
  }

  #guide_popup .guide_menu ul li.guide_mochimono::before {
    background: url("../img/guide/icon_mochimono.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(30vw / var(--sp));
    height: calc(32vw / var(--sp));
    top: calc(7vw / var(--sp));
  }

  #guide_popup .guide_menu ul li.guide_howto::before {
    background: url("../img/guide/icon_howto.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(34vw / var(--sp));
    height: calc(23vw / var(--sp));
    top: calc(15vw / var(--sp));
  }

  #guide_popup .guide_menu ul li::after {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw3);
    border-radius: calc((2vw / 2) / var(--sp));
    width: calc(2vw / var(--sp));
    height: calc(55vw / var(--sp));
    top: 50%;
    right: calc((-2vw / 2) / var(--sp));
    transform: translateY(-50%);
  }

  #guide_popup .guide_menu ul li:last-child::after {
    display: none;
  }

  #guide_popup .guide_menu p {
    color: var(--bw6);
    font-size: calc(20vw / var(--sp));
    line-height: calc(30vw / var(--sp));
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
  }

  #guide_popup .guide_detail {
    background: var(--bw5);
    width: 100%;
    margin-bottom: calc(15vw / var(--sp));
  }

  #guide_popup .guide_detail > .title {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    padding: calc(30vw / var(--sp)) 0 calc(30vw / var(--sp))
      calc(46vw / var(--sp));
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail > .title:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail > .title::before {
    position: absolute;
    display: block;
    content: "";
    border-radius: calc((6vw / 2) / var(--sp));
    width: calc(6vw / var(--sp));
    height: calc(80vw / var(--sp));
    top: 50%;
    left: calc(25vw / var(--sp));
    transform: translateY(-50%);
  }

  #guide_popup .guide_detail#guide_entry > .title::before {
    background: var(--gym);
  }

  #guide_popup .guide_detail#guide_mochimono > .title::before {
    background: var(--studio);
  }

  #guide_popup .guide_detail#guide_howto > .title::before {
    background: var(--holiday2);
  }

  #guide_popup .guide_detail > .title h3 {
    display: flex;
    align-items: center;
    gap: 0 calc(12vw / var(--sp));
    width: 100%;
    margin-bottom: calc(10vw / var(--sp));
  }

  #guide_popup .guide_detail#guide_entry > .title h3 img {
    width: calc(33vw / var(--sp));
  }

  #guide_popup .guide_detail#guide_mochimono > .title h3 img {
    width: calc(30vw / var(--sp));
  }

  #guide_popup .guide_detail#guide_howto > .title h3 img {
    width: calc(34vw / var(--sp));
  }

  #guide_popup .guide_detail > .title h3 p {
    color: var(--bw1);
    font-size: calc(28vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
  }

  #guide_popup .guide_detail > .title .text {
    color: var(--bw2);
    font-size: calc(16vw / var(--sp));
    line-height: calc(22vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
  }

  #guide_popup .guide_detail > .title i {
    position: absolute;
    display: block;
    align-content: center;
    box-sizing: border-box;
    background: var(--bw6);
    font-size: calc(16vw / var(--sp));
    line-height: calc(36vw / var(--sp));
    text-align: center;
    border-radius: calc((36vw / 2) / var(--sp));
    width: calc(36vw / var(--sp));
    height: calc(36vw / var(--sp));
    top: 50%;
    right: calc(25vw / var(--sp));
    transform: translateY(-50%);
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail > .title.open i {
    transform: translateY(-50%) rotate(180deg);
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail#guide_entry > .title i {
    color: var(--gym);
    border: calc(1vw / var(--sp)) solid var(--gym);
  }

  #guide_popup .guide_detail#guide_mochimono > .title i {
    color: var(--studio);
    border: calc(1vw / var(--sp)) solid var(--studio);
  }

  #guide_popup .guide_detail#guide_howto > .title i {
    color: var(--holiday2);
    border: calc(1vw / var(--sp)) solid var(--holiday2);
  }

  #guide_popup .guide_detail .wrapper {
    display: none;
    width: 100%;
    padding-bottom: calc(50vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper .detail_menu {
    display: flex;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc(10vw / var(--sp));
    width: calc(340vw / var(--sp));
    height: calc(60vw / var(--sp));
    margin: 0 auto calc(30vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper .detail_menu li {
    width: 50%;
    height: 100%;
  }

  #guide_popup .guide_detail .wrapper .detail_menu li a {
    position: relative;
    display: block;
    border-right: calc(1vw / var(--sp)) solid var(--bw3);
    width: 100%;
    height: 100%;
  }

  #guide_popup .guide_detail .wrapper .detail_menu li:last-child a {
    border-right: none;
  }

  #guide_popup .guide_detail .wrapper .detail_menu li a p {
    display: block;
    align-content: center;
    font-size: calc(14vw / var(--sp));
    line-height: calc(18vw / var(--sp));
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    height: 100%;
    padding-bottom: calc(10vw / var(--sp));
  }

  #guide_popup .guide_detail#guide_entry .wrapper .detail_menu li a p {
    color: var(--gym);
  }

  #guide_popup .guide_detail#guide_mochimono .wrapper .detail_menu li a p {
    color: var(--studio);
  }

  #guide_popup .guide_detail .wrapper .detail_menu li a i {
    position: absolute;
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    line-height: 1em;
    text-align: center;
    bottom: calc(4vw / var(--sp));
    left: 50%;
    transform: translateX(-50%);
  }

  #guide_popup .guide_detail .wrapper #guide_entry_choose {
    width: 100%;
    margin-bottom: calc(40vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_choose h4,
  #guide_popup .guide_detail .wrapper #guide_entry_need h4,
  #guide_popup .guide_detail .wrapper #guide_mochimono_wear h4,
  #guide_popup .guide_detail .wrapper #guide_mochimono_other h4 {
    box-sizing: border-box;
    color: var(--bw1);
    font-size: calc(28vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    padding-left: calc(25vw / var(--sp));
    margin-bottom: calc(25vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_choose .guide_entry_wrapper {
    width: 100%;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web {
    margin-bottom: calc(30vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    h5 {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    padding-left: calc(25vw / var(--sp));
    margin-bottom: calc(15vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    h5
    p {
    font-size: calc(24vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    h5
    p {
    color: var(--pair);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    h5
    p {
    color: var(--under29);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    h5
    small {
    position: absolute;
    display: block;
    align-content: center;
    background: var(--gym);
    color: var(--bw6);
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((20vw / 2) / var(--sp));
    width: calc(226vw / var(--sp));
    height: calc(20vw / var(--sp));
    top: 50%;
    right: calc(25vw / var(--sp));
    transform: translateY(-50%);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol {
    overflow-x: scroll;
    display: flex;
    gap: 0 calc(15vw / var(--sp));
    width: 100%;
    padding: 0 calc(25vw / var(--sp)) calc(10vw / var(--sp)) calc(25vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc(20vw / var(--sp));
    width: calc(250vw / var(--sp));
    padding: calc(3vw / var(--sp));
    z-index: 0;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li {
    height: calc(240vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li {
    height: calc(220vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li::after {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw4);
    width: 50%;
    height: calc(30vw / var(--sp));
    top: 50%;
    left: calc(100% + (1vw / var(--sp)));
    z-index: -1;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li:last-child::after {
    display: none;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .title {
    display: flex;
    align-items: center;
    gap: 0 calc(12vw / var(--sp));
    box-sizing: border-box;
    border-top-left-radius: calc(16vw / var(--sp));
    border-top-right-radius: calc(16vw / var(--sp));
    width: 100%;
    height: calc(76vw / var(--sp));
    padding-left: calc(12vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li
    .title {
    background: #fef7f1;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li
    .title {
    background: #f0fafa;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .title
    .number {
    display: block;
    align-content: center;
    font-family: "Quicksand", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    color: var(--bw6);
    font-size: calc(18vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((27vw / 2) / var(--sp));
    width: calc(27vw / var(--sp));
    height: calc(27vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li
    .title
    .number {
    background: var(--pair);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li
    .title
    .number {
    background: var(--under29);
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li:nth-child(1)
    .title
    img {
    width: calc(25vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li:nth-child(2)
    .title
    img {
    width: calc(34vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li:nth-child(3)
    .title
    img {
    width: calc(25vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.web
    ol
    li:nth-child(4)
    .title
    img {
    width: calc(34vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(1)
    .title
    img {
    width: calc(45vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(2)
    .title
    img {
    width: calc(34vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(3)
    .title
    img {
    width: calc(25vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(4)
    .title
    img {
    width: calc(40vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper.shop
    ol
    li:nth-child(5)
    .title
    img {
    width: calc(34vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .title
    h6 {
    color: var(--bw1);
    font-size: calc(18vw / var(--sp));
    line-height: calc(28vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    padding-top: calc(7vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .text {
    flex-grow: 1;
    position: relative;
    box-sizing: border-box;
    padding-top: calc(15vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .text
    p {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    width: calc(216vw / var(--sp));
    margin: 0 auto;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .text
    .guide_slot_extra {
    width: calc(216vw / var(--sp));
    margin: calc(8vw / var(--sp)) auto 0;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_choose
    .guide_entry_wrapper
    ol
    li
    .text
    small {
    position: absolute;
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    line-height: calc(12vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    width: calc(216vw / var(--sp));
    bottom: calc(10vw / var(--sp));
    left: 50%;
    transform: translateX(-50%);
  }

  #guide_popup .guide_detail .wrapper #guide_entry_choose > .entry {
    background: transparent;
    padding-bottom: 0;
  }

  #guide_popup .guide_detail .wrapper > hr {
    border-top: calc(1vw / var(--sp)) solid var(--bw3);
    border-bottom: none;
    border-left: none;
    border-right: none;
    width: calc(340vw / var(--sp));
    margin: 0 auto calc(30vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need {
    width: 100%;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need {
    overflow-x: scroll;
    display: flex;
    gap: 0 calc(15vw / var(--sp));
    width: 100%;
    padding: 0 calc(25vw / var(--sp)) calc(10vw / var(--sp)) calc(25vw / var(--sp));
    margin-bottom: calc(30vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc(20vw / var(--sp));
    width: calc(320vw / var(--sp));
    height: calc(190vw / var(--sp));
    padding: calc(3vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .title {
    display: flex;
    align-items: center;
    gap: 0 calc(12vw / var(--sp));
    box-sizing: border-box;
    background: #f3fcfc;
    border-top-left-radius: calc(16vw / var(--sp));
    border-top-right-radius: calc(16vw / var(--sp));
    width: 100%;
    height: calc(64vw / var(--sp));
    padding-left: calc(12vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .need
    li
    .title
    .number {
    display: block;
    align-content: center;
    background: var(--holiday2);
    font-family: "Quicksand", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    color: var(--bw6);
    font-size: calc(18vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((27vw / 2) / var(--sp));
    width: calc(27vw / var(--sp));
    height: calc(27vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .title h5 {
    color: var(--bw1);
    font-size: calc(18vw / var(--sp));
    line-height: calc(28vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .text {
    flex-grow: 1;
    position: relative;
    box-sizing: border-box;
    padding-top: calc(10vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .text p {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    width: calc(283vw / var(--sp));
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .text .guide_slot_extra {
    width: calc(283vw / var(--sp));
    margin: calc(8vw / var(--sp)) auto 0;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .need li .text small {
    position: absolute;
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    line-height: calc(12vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    bottom: calc(10vw / var(--sp));
    left: calc(13vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need > h5 {
    box-sizing: border-box;
    color: var(--bw1);
    font-size: calc(24vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    padding-left: calc(25vw / var(--sp));
    margin-bottom: calc(25vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .requirements {
    display: flex;
    flex-direction: column;
    gap: calc(15vw / var(--sp)) 0;
    width: calc(340vw / var(--sp));
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .requirements li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc(20vw / var(--sp));
    width: 100%;
    padding: calc(3vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .title {
    display: flex;
    align-items: center;
    gap: 0 calc(12vw / var(--sp));
    box-sizing: border-box;
    background: #f3fcfc;
    border-top-left-radius: calc(16vw / var(--sp));
    border-top-right-radius: calc(16vw / var(--sp));
    width: 100%;
    height: calc(46vw / var(--sp));
    padding-left: calc(12vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .title
    .number {
    display: block;
    align-content: center;
    background: var(--holiday2);
    font-family: "Quicksand", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    color: var(--bw6);
    font-size: calc(18vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((27vw / 2) / var(--sp));
    width: calc(27vw / var(--sp));
    height: calc(27vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .title
    h6 {
    color: var(--bw1);
    font-size: calc(18vw / var(--sp));
    line-height: calc(28vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
  }

  #guide_popup .guide_detail .wrapper #guide_entry_need .requirements li .text {
    flex-grow: 1;
    position: relative;
    box-sizing: border-box;
    padding: calc(10vw / var(--sp)) 0 calc(30vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .text
    p {
    position: relative;
    box-sizing: border-box;
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    width: calc(303vw / var(--sp));
    padding-left: calc(20vw / var(--sp));
    margin: 0 auto calc(20vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .text
    p:last-child {
    margin-bottom: 0;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_entry_need
    .requirements
    li
    .text
    p::before {
    position: absolute;
    display: block;
    content: "●";
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    top: 0;
    left: 0;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear {
    width: 100%;
    margin-bottom: calc(50vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear h4 {
    margin-bottom: calc(15vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear > p {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    width: calc(340vw / var(--sp));
    margin: 0 auto calc(20vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul {
    display: flex;
    flex-direction: column;
    gap: calc(15vw / var(--sp)) 0;
    width: calc(340vw / var(--sp));
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc(20vw / var(--sp));
    width: 100%;
    padding: calc(25vw / var(--sp)) 0;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul li h5 {
    box-sizing: border-box;
    color: var(--holiday2);
    font-size: calc(18vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    border-bottom: calc(2vw / var(--sp)) solid var(--holiday2);
    padding: 0 calc(4vw / var(--sp)) calc(8vw / var(--sp));
    margin: 0 auto calc(20vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul li img {
    margin: 0 auto calc(20vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_wear
    ul
    li:nth-child(1)
    img {
    width: calc(304vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_wear
    ul
    li:nth-child(2)
    img {
    width: calc(306vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_wear ul li small {
    color: var(--bw2);
    font-size: calc(10vw / var(--sp));
    line-height: calc(14vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    width: calc(310vw / var(--sp));
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other {
    width: 100%;
    margin-bottom: calc(50vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    gap: calc(15vw / var(--sp)) 0;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc(20vw / var(--sp));
    width: calc(340vw / var(--sp));
    padding: calc(20vw / var(--sp)) 0;
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul li {
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    width: calc(132vw / var(--sp));
    height: calc(190vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul li .illust {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(1)
    .illust
    img {
    width: calc(55vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(2)
    .illust
    img {
    width: calc(98vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(3)
    .illust
    img {
    width: calc(96vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(4)
    .illust
    img {
    width: calc(77vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(5)
    .illust
    img {
    width: calc(78vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(6)
    .illust
    img {
    width: calc(87vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(7)
    .illust
    img {
    width: calc(91vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_other
    ul
    li:nth-child(8)
    .illust
    img {
    width: calc(94vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul li h5 {
    color: var(--bw1);
    font-size: calc(20vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: calc(5vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_other ul li p {
    color: var(--bw2);
    font-size: calc(14vw / var(--sp));
    line-height: calc(22vw / var(--sp));
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
    height: calc(70vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: calc(210vw / var(--sp));
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(to top, var(--bw6) 0%, transparent 100%);
    width: calc(340vw / var(--sp));
    height: calc(150vw / var(--sp));
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    transition: all 0.5s;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental.is_open::after {
    display: none;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental > h5 {
    box-sizing: border-box;
    color: var(--bw1);
    font-size: calc(24vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    padding-left: calc(25vw / var(--sp));
    margin-bottom: calc(10vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .guide_rental_note {
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    padding-left: calc(25vw / var(--sp));
    margin-bottom: calc(25vw / var(--sp));
    display: block;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup {
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc(20vw / var(--sp));
    width: calc(340vw / var(--sp));
    padding: calc(20vw / var(--sp)) 0;
    margin: 0 auto;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup ul {
    width: calc(290vw / var(--sp));
    margin: 0 auto calc(20vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup ul li {
    position: relative;
    display: flex;
    border-bottom: calc(1vw / var(--sp)) solid var(--bw4);
    width: 100%;
    margin: 0 auto calc(20vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li:nth-child(1) {
    padding: calc(20vw / var(--sp)) 0;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li:nth-child(2) {
    padding: calc(20vw / var(--sp)) 0 calc(35vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .photo {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li:nth-child(1)
    .photo
    img {
    width: calc(152vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li:nth-child(2)
    .photo
    img {
    width: calc(148vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text {
    width: calc(130vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text
    h6 {
    color: var(--bw1);
    font-size: calc(18vw / var(--sp));
    line-height: calc(28vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: calc(5vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text
    h6
    span {
    font-size: calc((18vw * 0.8) / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text
    p {
    display: block;
    align-content: center;
    background: var(--bw5);
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    height: calc(27vw / var(--sp));
    margin-bottom: calc(10vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    .text
    p
    span {
    font-size: calc((16vw * 0.8) / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    ul
    li
    small {
    position: absolute;
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    bottom: calc(20vw / var(--sp));
    left: 0;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup > h6 {
    color: var(--bw1);
    font-size: calc(22vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: calc(290vw / var(--sp));
    margin: 0 auto calc(15vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup table {
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw4);
    width: calc(290vw / var(--sp));
    margin: 0 auto calc(20vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup table tr {
    display: flex;
    border-bottom: calc(1vw / var(--sp)) solid var(--bw4);
    width: 100%;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    table
    tr:last-child {
    border-bottom: none;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    table
    tr
    th {
    box-sizing: border-box;
    background: var(--bw5);
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    line-height: calc(20vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    width: calc(110vw / var(--sp));
    padding: calc(15vw / var(--sp)) 0 calc(15vw / var(--sp))
      calc(10vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    table
    tr
    td {
    flex-grow: 1;
    box-sizing: border-box;
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    line-height: calc(20vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    padding: calc(15vw / var(--sp)) 0 calc(15vw / var(--sp))
      calc(10vw / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .lineup hr {
    border-top: calc(1vw / var(--sp)) solid var(--bw4);
    border-bottom: none;
    border-left: none;
    border-right: none;
    width: calc(290vw / var(--sp));
    margin: 0 auto calc(20vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other {
    position: relative;
    display: flex;
    width: calc(290vw / var(--sp));
    margin: 0 auto;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .photo {
    flex-grow: 1;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .photo
    img {
    width: calc(137vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text {
    width: calc(130vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text
    h6 {
    color: var(--bw1);
    font-size: calc(18vw / var(--sp));
    line-height: calc(28vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: calc(5vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text
    h6
    span {
    font-size: calc((18vw * 0.8) / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text
    p {
    display: block;
    align-content: center;
    background: var(--bw5);
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    height: calc(27vw / var(--sp));
    margin-bottom: calc(10vw / var(--sp));
  }

  #guide_popup
    .guide_detail
    .wrapper
    #guide_mochimono_rental
    .lineup
    .rental_other
    .text
    p
    span {
    font-size: calc((16vw * 0.8) / var(--sp));
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .readmore {
    position: absolute;
    display: block;
    box-sizing: border-box;
    background: var(--bw6);
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    border: calc(2vw / var(--sp)) solid #949494;
    border-radius: calc(4vw / var(--sp));
    width: calc(150vw / var(--sp));
    height: calc(32vw / var(--sp));
    bottom: calc(15vw / var(--sp));
    left: 50%;
    transform: translateX(-50%);
    transition: var(--hover_transition);
    z-index: 1;
  }

  #guide_popup .guide_detail .wrapper #guide_mochimono_rental .readmore:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol {
    width: calc(340vw / var(--sp));
    margin: 0 auto;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li {
    border-bottom: calc(2vw / var(--sp)) solid #d4d4d4;
    width: 100%;
    padding: calc(40vw / var(--sp)) 0;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li:last-child {
    border-bottom: none;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li h4 {
    display: flex;
    width: 100%;
    margin-bottom: calc(15vw / var(--sp));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li h4 .number {
    position: relative;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    color: var(--holiday2);
    font-size: calc(32vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    width: calc(50vw / var(--sp));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li h4 .number::after {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw1);
    width: calc(2vw / var(--sp));
    height: calc(24vw / var(--sp));
    top: calc(4vw / var(--sp));
    right: 0;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li h4 .title {
    flex-grow: 1;
    box-sizing: border-box;
    color: var(--bw1);
    font-size: calc(22vw / var(--sp));
    line-height: calc(32vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    padding-left: calc(20vw / var(--sp));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .text {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--regular);
    text-align: justify;
    width: 100%;
    margin-bottom: calc(15vw / var(--sp));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li small {
    display: block;
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    margin-bottom: calc(15vw / var(--sp));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .guide_slot_extra_note {
    display: block;
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    line-height: 1.6em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    margin-bottom: calc(15vw / var(--sp));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store {
    display: flex;
    justify-content: center;
    gap: 0 calc(12vw / var(--sp));
    margin: 0 auto;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store .appstore {
    width: calc(136vw / var(--sp));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store .googleplay {
    width: calc(171vw / var(--sp));
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store a {
    display: block;
    width: 100%;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .store a img {
    width: 100%;
  }

  #guide_popup .guide_detail#guide_howto .wrapper ol li .photo {
    width: 100%;
  }

  #guide_popup .guide_notice {
    color: var(--bw2);
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: calc(340vw / var(--sp));
    margin: calc(-10vw / var(--sp)) auto calc(10vw / var(--sp));
  }
}

/************************************
#voice_popup
************************************/
@media screen and (min-width: 1366px) {
  #voice_popup {
    background: var(--bw5);
  }

  #voice_popup > h2 {
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: #0060b6;
    color: var(--bw6);
    font-size: 28px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    height: 60px;
    padding-left: 25px;
    margin-bottom: 15px;
  }

  #voice_popup .info {
    width: 340px;
    margin: 0 auto 10px;
  }

  #voice_popup .info p {
    color: var(--bw1);
    font-size: 16px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: 5px;
  }

  #voice_popup .info small {
    display: block;
    color: var(--bw1);
    font-size: 14px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
  }

  #voice_popup ul {
    display: flex;
    flex-direction: column;
    gap: 10px 0;
    width: 340px;
    margin: 0 auto 25px;
  }

  #voice_popup ul li {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid #f3ad7d;
    border-radius: 10px;
    width: 100%;
  }

  #voice_popup ul li .title {
    position: relative;
    box-sizing: border-box;
    background: #fef7f2;
    width: 100%;
    padding: 5px 0 10px;
  }

  #voice_popup ul li .title h3 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    color: var(--bw1);
    font-size: 22px;
    line-height: 32px;
    font-weight: var(--bold);
    text-align: justify;
    width: 300px;
    min-height: calc(32px * 2);
    margin: 0 auto 5px;
  }

  #voice_popup ul li.open .title h3 {
    display: block;
  }

  #voice_popup ul li .title .user {
    display: flex;
    width: 300px;
    bottom: 10px;
    margin: 0 auto;
  }

  #voice_popup ul li .title .user p {
    position: relative;
    color: #615d5d;
    font-size: 12px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    padding-left: 1em;
  }

  #voice_popup ul li .title .user p::before {
    position: absolute;
    display: block;
    content: "・";
    color: #f3ad7d;
    font-size: 12px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: 1em;
    top: 0;
    left: 0;
  }

  #voice_popup ul li .text {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: 60px;
    padding-top: 8px;
  }

  #voice_popup ul li.open .text {
    height: auto;
    padding-bottom: 8px;
  }

  #voice_popup ul li .text::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(
      to top,
      var(--bw6) 0%,
      var(--bw6) 15%,
      rgba(255, 255, 255, 0) 100%
    );
    width: 100%;
    height: 100%;
    bottom: 0;
  }

  #voice_popup ul li.open .text::after {
    display: none;
  }

  #voice_popup ul li .text p {
    color: var(--bw2);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: justify;
    width: 300px;
    margin: 0 auto;
  }

  #voice_popup ul li i {
    position: absolute;
    color: var(--bw1);
    font-size: 16px;
    text-align: center;
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
  }

  #voice_popup ul li.open i {
    display: none;
  }

  #voice_popup .attention {
    display: block;
    color: var(--bw1);
    font-size: 10px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 340px;
    margin: 0 auto 25px;
  }

  #voice_popup ol {
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 228px;
    margin: 0 auto 15px;
  }

  #voice_popup ol::before {
    position: absolute;
    display: block;
    content: "前へ";
    color: var(--bw1);
    font-size: 14px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: right;
    top: 50%;
    left: -40px;
    transform: translateY(-50%);
  }

  #voice_popup ol::after {
    position: absolute;
    display: block;
    content: "次へ";
    color: var(--bw1);
    font-size: 14px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    top: 50%;
    right: -40px;
    transform: translateY(-50%);
  }

  #voice_popup ol li {
    display: block;
    align-content: center;
    width: 36px;
    height: 38px;
  }

  #voice_popup ol li.number {
    background: var(--bw6);
    color: var(--bw1);
    font-size: 14px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    transition: var(--hover_transition);
  }

  #voice_popup ol li.number.active,
  #voice_popup ol li.number:hover {
    background: var(--holiday2);
    color: var(--bw6);
    transition: var(--hover_transition);
  }

  #voice_popup ol li.dot {
    color: var(--bw1);
    font-size: 14px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
  }

  #voice_popup .count {
    color: var(--bw1);
    font-size: 16px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: 100%;
    margin-bottom: 50px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #voice_popup {
    background: var(--bw5);
  }

  #voice_popup > h2 {
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: #0060b6;
    color: var(--bw6);
    font-size: calc(28vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    height: calc(60vw / var(--tablet));
    padding-left: calc(25vw / var(--tablet));
    margin-bottom: calc(15vw / var(--tablet));
  }

  #voice_popup .info {
    width: calc(340vw / var(--tablet));
    margin: 0 auto calc(10vw / var(--tablet));
  }

  #voice_popup .info p {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: calc(5vw / var(--tablet));
  }

  #voice_popup .info small {
    display: block;
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
  }

  #voice_popup ul {
    display: flex;
    flex-direction: column;
    gap: calc(10vw / var(--tablet)) 0;
    width: calc(340vw / var(--tablet));
    margin: 0 auto calc(25vw / var(--tablet));
  }

  #voice_popup ul li {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid #f3ad7d;
    border-radius: calc(10vw / var(--tablet));
    width: 100%;
  }

  #voice_popup ul li .title {
    position: relative;
    box-sizing: border-box;
    background: #fef7f2;
    width: 100%;
    padding: calc(5vw / var(--tablet)) 0 calc(10vw / var(--tablet));
  }

  #voice_popup ul li .title h3 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    color: var(--bw1);
    font-size: calc(22vw / var(--tablet));
    line-height: calc(32vw / var(--tablet));
    font-weight: var(--bold);
    text-align: justify;
    width: calc(300vw / var(--tablet));
    min-height: calc((32vw * 2) / var(--tablet));
    margin: 0 auto calc(5vw / var(--tablet));
  }

  #voice_popup ul li.open .title h3 {
    display: block;
  }

  #voice_popup ul li .title .user {
    display: flex;
    width: calc(300vw / var(--tablet));
    bottom: calc(10vw / var(--tablet));
    margin: 0 auto;
  }

  #voice_popup ul li .title .user p {
    position: relative;
    color: #615d5d;
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    padding-left: 1em;
  }

  #voice_popup ul li .title .user p::before {
    position: absolute;
    display: block;
    content: "・";
    color: #f3ad7d;
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: 1em;
    top: 0;
    left: 0;
  }

  #voice_popup ul li .text {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: calc(60vw / var(--tablet));
    padding-top: calc(8vw / var(--tablet));
  }

  #voice_popup ul li.open .text {
    height: auto;
    padding-bottom: calc(8vw / var(--tablet));
  }

  #voice_popup ul li .text::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(
      to top,
      var(--bw6) 0%,
      var(--bw6) 15%,
      rgba(255, 255, 255, 0) 100%
    );
    width: 100%;
    height: 100%;
    bottom: 0;
  }

  #voice_popup ul li.open .text::after {
    display: none;
  }

  #voice_popup ul li .text p {
    color: var(--bw2);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: justify;
    width: calc(300vw / var(--tablet));
    margin: 0 auto;
  }

  #voice_popup ul li i {
    position: absolute;
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    text-align: center;
    bottom: calc(5vw / var(--tablet));
    left: 50%;
    transform: translateX(-50%);
  }

  #voice_popup ul li.open i {
    display: none;
  }

  #voice_popup .attention {
    display: block;
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: calc(340vw / var(--tablet));
    margin: 0 auto calc(25vw / var(--tablet));
  }

  #voice_popup ol {
    position: relative;
    display: flex;
    justify-content: space-between;
    width: calc(228vw / var(--tablet));
    margin: 0 auto calc(15vw / var(--tablet));
  }

  #voice_popup ol::before {
    position: absolute;
    display: block;
    content: "前へ";
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: right;
    top: 50%;
    left: calc(-40vw / var(--tablet));
    transform: translateY(-50%);
  }

  #voice_popup ol::after {
    position: absolute;
    display: block;
    content: "次へ";
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    top: 50%;
    right: calc(-40vw / var(--tablet));
    transform: translateY(-50%);
  }

  #voice_popup ol li {
    display: block;
    align-content: center;
    width: calc(36vw / var(--tablet));
    height: calc(38vw / var(--tablet));
  }

  #voice_popup ol li.number {
    background: var(--bw6);
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    transition: var(--hover_transition);
  }

  #voice_popup ol li.number.active,
  #voice_popup ol li.number:hover {
    background: var(--holiday2);
    color: var(--bw6);
    transition: var(--hover_transition);
  }

  #voice_popup ol li.dot {
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
  }

  #voice_popup .count {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: 100%;
    margin-bottom: calc(50vw / var(--tablet));
  }
}

@media screen and (max-width: 767px) {
  #voice_popup {
    background: var(--bw5);
  }

  #voice_popup > h2 {
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: #0060b6;
    color: var(--bw6);
    font-size: calc(28vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    height: calc(60vw / var(--sp));
    padding-left: calc(25vw / var(--sp));
    margin-bottom: calc(15vw / var(--sp));
  }

  #voice_popup .info {
    width: calc(340vw / var(--sp));
    margin: 0 auto calc(10vw / var(--sp));
  }

  #voice_popup .info p {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    margin-bottom: calc(5vw / var(--sp));
  }

  #voice_popup .info small {
    display: block;
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
  }

  #voice_popup ul {
    display: flex;
    flex-direction: column;
    gap: calc(10vw / var(--sp)) 0;
    width: calc(340vw / var(--sp));
    margin: 0 auto calc(25vw / var(--sp));
  }

  #voice_popup ul li {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid #f3ad7d;
    border-radius: calc(10vw / var(--sp));
    width: 100%;
  }

  #voice_popup ul li .title {
    position: relative;
    box-sizing: border-box;
    background: #fef7f2;
    width: 100%;
    padding: calc(5vw / var(--sp)) 0 calc(10vw / var(--sp));
  }

  #voice_popup ul li .title h3 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    color: var(--bw1);
    font-size: calc(22vw / var(--sp));
    line-height: calc(32vw / var(--sp));
    font-weight: var(--bold);
    text-align: justify;
    width: calc(300vw / var(--sp));
    min-height: calc((32vw * 2) / var(--sp));
    margin: 0 auto calc(5vw / var(--sp));
  }

  #voice_popup ul li.open .title h3 {
    display: block;
  }

  #voice_popup ul li .title .user {
    display: flex;
    width: calc(300vw / var(--sp));
    bottom: calc(10vw / var(--sp));
    margin: 0 auto;
  }

  #voice_popup ul li .title .user p {
    position: relative;
    color: #615d5d;
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    padding-left: 1em;
  }

  #voice_popup ul li .title .user p::before {
    position: absolute;
    display: block;
    content: "・";
    color: #f3ad7d;
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: 1em;
    top: 0;
    left: 0;
  }

  #voice_popup ul li .text {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: calc(60vw / var(--sp));
    padding-top: calc(8vw / var(--sp));
  }

  #voice_popup ul li.open .text {
    height: auto;
    padding-bottom: calc(8vw / var(--sp));
  }

  #voice_popup ul li .text::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(
      to top,
      var(--bw6) 0%,
      var(--bw6) 15%,
      rgba(255, 255, 255, 0) 100%
    );
    width: 100%;
    height: 100%;
    bottom: 0;
  }

  #voice_popup ul li.open .text::after {
    display: none;
  }

  #voice_popup ul li .text p {
    color: var(--bw2);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--regular);
    text-align: justify;
    width: calc(300vw / var(--sp));
    margin: 0 auto;
  }

  #voice_popup ul li i {
    position: absolute;
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    text-align: center;
    bottom: calc(5vw / var(--sp));
    left: 50%;
    transform: translateX(-50%);
  }

  #voice_popup ul li.open i {
    display: none;
  }

  #voice_popup .attention {
    display: block;
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: calc(340vw / var(--sp));
    margin: 0 auto calc(25vw / var(--sp));
  }

  #voice_popup ol {
    position: relative;
    display: flex;
    justify-content: space-between;
    width: calc(228vw / var(--sp));
    margin: 0 auto calc(15vw / var(--sp));
  }

  #voice_popup ol::before {
    position: absolute;
    display: block;
    content: "前へ";
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: right;
    top: 50%;
    left: calc(-40vw / var(--sp));
    transform: translateY(-50%);
  }

  #voice_popup ol::after {
    position: absolute;
    display: block;
    content: "次へ";
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    top: 50%;
    right: calc(-40vw / var(--sp));
    transform: translateY(-50%);
  }

  #voice_popup ol li {
    display: block;
    align-content: center;
    width: calc(36vw / var(--sp));
    height: calc(38vw / var(--sp));
  }

  #voice_popup ol li.number {
    background: var(--bw6);
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    transition: var(--hover_transition);
  }

  #voice_popup ol li.number.active,
  #voice_popup ol li.number:hover {
    background: var(--holiday2);
    color: var(--bw6);
    transition: var(--hover_transition);
  }

  #voice_popup ol li.dot {
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
  }

  #voice_popup .count {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: 100%;
    margin-bottom: calc(50vw / var(--sp));
  }
}

/************************************
#access
************************************/
@media screen and (min-width: 1366px) {
  #access {
    background: var(--bw6);
    padding: 60px 0 50px;
  }

  #access h2 {
    color: var(--bw1);
    font-size: 34px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 25px;
  }

  #access .gallery {
    position: relative;
    width: 1200px;
    margin: 0 auto 30px;
  }

  #access .gallery .slider {
    position: relative;
    width: 100%;
    margin-bottom: 20px;
  }

  #access .gallery .slider::before {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(to right, var(--bw6) 0%, transparent 100%);
    width: 60px;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 99;
  }

  #access .gallery .slider::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(to left, var(--bw6) 0%, transparent 100%);
    width: 60px;
    height: 100%;
    top: 0;
    right: 0;
    z-index: 99;
  }

  #access .gallery .slider ul li {
    overflow: hidden;
    border-radius: 20px;
    width: 510px;
    height: 340px;
    margin-right: 20px;
  }

  #access .gallery .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: calc(40px / 2);
    width: 40px;
    height: 40px;
    top: auto;
    bottom: 0;
    left: auto;
    right: 50px;
  }

  #access .gallery .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: calc(40px / 2);
    width: 40px;
    height: 40px;
    top: auto;
    bottom: 0;
    left: auto;
    right: 0;
  }

  #access .gallery .swiper-button-prev i,
  #access .gallery .swiper-button-next i {
    color: var(--bw1);
    font-size: 14px;
  }

  #access .gallery .swiper-button-prev::after,
  #access .gallery .swiper-button-next::after {
    display: none;
  }

  #access .gallery .thumbnail {
    width: 640px;
    height: 40px;
    margin: 0 auto;
  }

  #access .gallery .thumbnail ul {
    width: 100%;
    height: 100%;
  }

  #access .gallery .thumbnail ul li {
    width: 60px;
    margin: 0 2px;
  }

  #access .gallery .thumbnail ul li.swiper-slide-thumb-active {
    opacity: 0.6;
  }

  #access .gallery .slider ul li img,
  #access .gallery .thumbnail ul li img {
    width: 100%;
  }

  #access h3 {
    color: var(--holiday1);
    font-size: 18px;
    line-height: 28px;
    font-weight: var(--bold);
    text-align: center;
    margin-bottom: 30px;
  }

  #access h3 span {
    font-size: 28px;
  }

  #access .access_wrapper {
    display: flex;
    justify-content: space-between;
    width: 1100px;
    margin: 0 auto 40px;
  }

  #access .info {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    width: 520px;
  }

  #access .info .hours {
    margin-bottom: 30px;
  }

  #access .info .location {
    flex-grow: 1;
    border-bottom: 1px solid var(--bw4);
  }

  #access .info .hours h4,
  #access .info .location h4 {
    position: relative;
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--bold);
    text-align: left;
    border-top: 1px solid var(--bw4);
    width: 100%;
    padding: 25px 0 0 22px;
  }

  #access .info .hours h4::before,
  #access .info .location h4::before {
    position: absolute;
    display: block;
    content: "●";
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--bold);
    text-align: left;
    top: 25px;
    left: 0;
  }

  #access .info .hours p,
  #access .info .location p {
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    padding-left: 22px;
  }

  #access .info .hours .business-hours-note a {
    display: inline-block;
  }

  #access .info .hours .business-hours-note iframe {
    width: 100%;
    padding-left: 22px;
    height: 300px;
  }

  #access .facility {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 10px 8px;
    width: 520px;
    margin: 0 auto;
    height: fit-content;
  }

  #access .facility li {
    position: relative;
    width: 50px;
    height: 85px;
  }

  #access .facility li .icon {
    width: 100%;
    height: 54px;
  }

  #access .facility li p {
    position: absolute;
    color: var(--bw1);
    font-size: 10px;
    line-height: 14px;
    font-weight: var(--regular);
    text-align: center;
    width: max-content;
    top: 54px;
    left: 50%;
    transform: translateX(-50%);
  }

  #access .map {
    width: 1100px;
    height: 400px;
    margin: 0 auto;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #access {
    background: var(--bw6);
    padding: calc(60vw / var(--tablet)) 0 calc(50vw / var(--tablet));
  }

  #access h2 {
    color: var(--bw1);
    font-size: calc(34vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(25vw / var(--tablet));
  }

  #access .gallery {
    position: relative;
    width: calc(1200vw / var(--tablet));
    margin: 0 auto calc(30vw / var(--tablet));
  }

  #access .gallery .slider {
    position: relative;
    width: 100%;
    margin-bottom: calc(20vw / var(--tablet));
  }

  #access .gallery .slider::before {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(to right, var(--bw6) 0%, transparent 100%);
    width: calc(60vw / var(--tablet));
    height: 100%;
    top: 0;
    left: 0;
    z-index: 99;
  }

  #access .gallery .slider::after {
    position: absolute;
    display: block;
    content: "";
    background: linear-gradient(to left, var(--bw6) 0%, transparent 100%);
    width: calc(60vw / var(--tablet));
    height: 100%;
    top: 0;
    right: 0;
    z-index: 99;
  }

  #access .gallery .slider ul li {
    overflow: hidden;
    border-radius: calc(20vw / var(--tablet));
    width: calc(510vw / var(--tablet));
    height: calc(340vw / var(--tablet));
    margin-right: calc(20vw / var(--tablet));
  }

  #access .gallery .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: 1px solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--tablet));
    width: calc(40vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: auto;
    bottom: 0;
    left: auto;
    right: calc(50vw / var(--tablet));
  }

  #access .gallery .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--tablet)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--tablet));
    width: calc(40vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    top: auto;
    bottom: 0;
    left: auto;
    right: 0;
  }

  #access .gallery .swiper-button-prev i,
  #access .gallery .swiper-button-next i {
    color: var(--bw1);
    font-size: calc(14vw / var(--tablet));
  }

  #access .gallery .swiper-button-prev::after,
  #access .gallery .swiper-button-next::after {
    display: none;
  }

  #access .gallery .thumbnail {
    width: calc(640vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    margin: 0 auto;
  }

  #access .gallery .thumbnail ul {
    width: 100%;
    height: 100%;
  }

  #access .gallery .thumbnail ul li {
    width: calc(60vw / var(--tablet));
    margin: 0 calc(2vw / var(--tablet));
  }

  #access .gallery .thumbnail ul li.swiper-slide-thumb-active {
    opacity: 0.6;
  }

  #access .gallery .slider ul li img,
  #access .gallery .thumbnail ul li img {
    width: 100%;
  }

  #access h3 {
    color: var(--holiday1);
    font-size: calc(18vw / var(--tablet));
    line-height: calc(28vw / var(--tablet));
    font-weight: var(--bold);
    text-align: center;
    margin-bottom: calc(30vw / var(--tablet));
  }

  #access h3 span {
    font-size: calc(28vw / var(--tablet));
  }

  #access .access_wrapper {
    display: flex;
    justify-content: space-between;
    width: calc(1100vw / var(--tablet));
    margin: 0 auto calc(40vw / var(--tablet));
  }

  #access .info {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    width: calc(520vw / var(--tablet));
  }

  #access .info .hours {
    margin-bottom: calc(30vw / var(--tablet));
  }

  #access .info .location {
    flex-grow: 1;
    border-bottom: calc(1vw / var(--tablet)) solid var(--bw4);
  }

  #access .info .hours h4,
  #access .info .location h4 {
    position: relative;
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    border-top: calc(1vw / var(--tablet)) solid var(--bw4);
    width: 100%;
    padding: calc(25vw / var(--tablet)) 0 0 calc(22vw / var(--tablet));
  }

  #access .info .hours h4::before,
  #access .info .location h4::before {
    position: absolute;
    display: block;
    content: "●";
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    top: calc(25vw / var(--tablet));
    left: 0;
  }

  #access .info .hours p,
  #access .info .location p {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    padding-left: calc(22vw / var(--tablet));
  }

  #access .info .hours .business-hours-note a {
    display: inline-block;
  }

  #access .info .hours .business-hours-note iframe {
    width: 100%;
    padding-left: calc(22vw / var(--tablet));
    height: calc(350vw / var(--tablet));
  }

  #access .facility {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: calc(10vw / var(--tablet)) calc(8vw / var(--tablet));
    width: calc(520vw / var(--tablet));
    margin: 0 auto;
    height: fit-content;
  }

  #access .facility li {
    position: relative;
    width: calc(50vw / var(--tablet));
    height: calc(85vw / var(--tablet));
  }

  #access .facility li .icon {
    width: 100%;
    height: calc(54vw / var(--tablet));
  }

  #access .facility li p {
    position: absolute;
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    line-height: calc(14vw / var(--tablet));
    font-weight: var(--regular);
    text-align: center;
    width: max-content;
    top: calc(54vw / var(--tablet));
    left: 50%;
    transform: translateX(-50%);
  }

  #access .map {
    width: calc(1100vw / var(--tablet));
    height: calc(400vw / var(--tablet));
    margin: 0 auto;
  }
}

@media screen and (max-width: 767px) {
  #access {
    background: var(--bw6);
    padding-top: calc(50vw / var(--sp));
  }

  #access h2 {
    color: var(--bw1);
    font-size: calc(34vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(25vw / var(--sp));
  }

  #access .gallery {
    width: calc(340vw / var(--sp));
    margin: 0 auto calc(50vw / var(--sp));
  }

  #access .gallery .slider {
    position: relative;
    overflow: hidden;
    width: 100%;
    margin-bottom: calc(10vw / var(--sp));
  }

  #access .gallery .slider ul {
    width: 100%;
    height: calc(226vw / var(--sp));
  }

  #access .gallery .slider ul li {
    overflow: hidden;
    border-radius: calc(20vw / var(--sp));
    width: 100%;
    height: 100%;
  }

  #access .gallery .slider .swiper-button-prev {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--sp));
    width: calc(40vw / var(--sp));
    height: calc(40vw / var(--sp));
    top: auto;
    bottom: calc(-100vw / var(--sp));
    left: auto;
    right: calc(55vw / var(--sp));
  }

  #access .gallery .slider .swiper-button-next {
    position: absolute;
    box-sizing: border-box;
    background: var(--bw6);
    border: calc(1vw / var(--sp)) solid var(--bw3);
    border-radius: calc((40vw / 2) / var(--sp));
    width: calc(40vw / var(--sp));
    height: calc(40vw / var(--sp));
    top: auto;
    bottom: calc(-100vw / var(--sp));
    left: auto;
    right: 0;
  }

  #access .gallery .slider .swiper-button-prev i,
  #access .gallery .slider .swiper-button-next i {
    color: var(--bw1);
    font-size: calc(14vw / var(--sp));
  }

  #access .gallery .slider .swiper-button-prev::after,
  #access .gallery .slider .swiper-button-next::after {
    display: none;
  }

  #access .gallery .thumbnail {
    width: calc(340vw / var(--sp));
    height: calc(40vw / var(--sp));
    margin: 0 auto;
  }

  #access .gallery .thumbnail ul {
    width: 100%;
    height: 100%;
  }

  #access .gallery .thumbnail ul li {
    width: calc(60vw / var(--sp));
    margin: 0 calc(2.5vw / var(--sp));
  }

  #access .gallery .thumbnail ul li.swiper-slide-thumb-active {
    opacity: 0.6;
  }

  #access .gallery .slider ul li img,
  #access .gallery .thumbnail ul li img {
    width: 100%;
  }

  #access h3 {
    color: var(--holiday1);
    font-size: calc(18vw / var(--sp));
    line-height: calc(28vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    width: calc(340vw / var(--sp));
    margin: 0 auto calc(15vw / var(--sp));
  }

  #access h3 span {
    font-size: calc(28vw / var(--sp));
  }

  #access .info {
    display: flex;
    flex-direction: column;
    gap: calc(20vw / var(--sp)) 0;
    box-sizing: border-box;
    width: calc(340vw / var(--sp));
    padding-left: calc(22vw / var(--sp));
    margin: 0 auto calc(30vw / var(--sp));
  }

  #access .info .hours h4,
  #access .info .location h4 {
    position: relative;
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
  }

  #access .info .hours h4::before,
  #access .info .location h4::before {
    position: absolute;
    display: block;
    content: "●";
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    top: 0;
    left: calc(-22vw / var(--sp));
  }

  #access .info .hours p,
  #access .info .location p {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(22vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
  }

  #access .info .hours .business-hours-note a {
    display: inline-block;
  }

  #access .info .hours .business-hours-note iframe {
    width: 100%;
  }

  #access .facility {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: calc(10vw / var(--sp)) calc(8vw / var(--sp));
    width: calc(340vw / var(--sp));
    margin: 0 auto calc(35vw / var(--sp));
  }

  #access .facility li {
    position: relative;
    width: calc(50vw / var(--sp));
    height: calc(85vw / var(--sp));
  }

  #access .facility li .icon {
    width: 100%;
    height: calc(54vw / var(--sp));
  }

  #access .facility li p {
    position: absolute;
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    line-height: calc(14vw / var(--sp));
    font-weight: var(--regular);
    text-align: center;
    width: max-content;
    top: calc(54vw / var(--sp));
    left: 50%;
    transform: translateX(-50%);
  }

  #access .map {
    width: 100%;
    height: calc(260vw / var(--sp));
  }
}

/************************************
#price_sougou
************************************/
@media screen and (min-width: 1366px) {
  #price_sougou {
    background: var(--bw6);
    width: 100%;
    padding: 60px 0 35px;
  }

  #price_sougou h2 {
    color: var(--bw1);
    font-size: 34px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 10px;
  }

  #price_sougou .info {
    color: var(--bw1);
    font-size: 16px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 25px;
  }

  #price_sougou .example {
    width: 680px;
    margin: 0 auto 40px;
  }

  #price_sougou .example ul {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 12px;
  }

  #price_sougou .example ul li {
    width: 164px;
  }

  #price_sougou .example ul li img {
    width: 100%;
  }

  #price_sougou .example small {
    display: block;
    color: #1e1e1e;
    font-size: 10px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    margin-bottom: 25px;
  }

  #price_sougou .example h3 {
    color: var(--bw1);
    font-size: 28px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
  }

  #price_sougou .check {
    text-align: center;
    width: 100%;
    margin: 0 auto 30px;
  }

  #price_sougou .check p {
    display: inline;
    background: linear-gradient(
      to top,
      #ffea00 0%,
      #ffea00 6px,
      transparent 6px,
      transparent 100%
    );
    color: var(--holiday2);
    font-size: 28px;
    line-height: 33px;
    font-weight: var(--bold);
    text-align: center;
  }

  #price_sougou .selected-store-name {
    color: var(--bw1);
    font-size: 28px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 25px;
  }

  #price_sougou .price_sougou_wrapper {
    display: flex;
    justify-content: space-between;
    width: 700px;
    margin: 0 auto 45px;
  }

  #price_sougou #prefecture {
    display: block;
    box-sizing: border-box;
    background: #ebf6fc;
    color: var(--bw1);
    font-size: 16px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    border: 1px solid #0096dc;
    border-radius: 10px;
    width: 340px;
    padding: 16px;
    cursor: pointer;
  }

  #price_sougou #shops {
    display: block;
    box-sizing: border-box;
    background: #ebf6fc;
    color: var(--bw1);
    font-size: 16px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    border: 1px solid #0096dc;
    border-radius: 10px;
    width: 340px;
    padding: 16px;
    cursor: pointer;
  }

  #price_sougou .price_list {
    width: 100%;
    padding-bottom: 40px;
  }

  #price_sougou .price_list ul {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 30px;
    width: 710px;
    margin: 0 auto 15px;
  }

  #price_sougou .price_list ul li {
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bw6);
    border-radius: 6px;
    width: 340px;
  }

  #price_sougou .price_list ul li a {
    width: 100%;
    height: 100%;
  }

  #price_sougou .price_list ul li a .planname {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: 42px;
    padding-top: 2px;
  }

  #price_sougou .price_list ul li a .planname::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw6);
    width: 1px;
    height: 34px;
    top: 50%;
    left: 35px;
    transform: translateY(-50%);
  }

  #price_sougou .price_list ul li a .planname .icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 19px;
    left: 9px;
  }

  #price_sougou .price_list ul li.master a .planname .icon {
    width: 10px;
    left: 13px;
  }

  #price_sougou .price_list ul li.pair a .planname .icon {
    width: 19px;
    left: 9px;
  }

  #price_sougou .price_list ul li.group a .planname .icon {
    width: 22px;
    left: 6px;
  }

  #price_sougou .price_list ul li.morning a .planname .icon {
    width: 15px;
    left: 10px;
  }

  #price_sougou .price_list ul li.day a .planname .icon {
    width: 18px;
    left: 8px;
  }

  #price_sougou .price_list ul li.super_night a .planname .icon {
    width: 18px;
    left: 8px;
  }

  #price_sougou .price_list ul li.week_end a .planname .icon {
    width: 21px;
    left: 7px;
  }

  #price_sougou .price_list ul li.under29 a .planname .icon {
    width: 23px;
    left: 6px;
  }

  #price_sougou .price_list ul li a .planname h3 {
    color: var(--bw6);
    font-size: 20px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    padding-left: 44px;
    margin-bottom: 3px;
  }

  #price_sougou .price_list ul li a .planname .planinfo {
    color: var(--bw6);
    font-size: 12px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    padding-left: 44px;
  }

  #price_sougou .price_list ul li a .planname i {
    position: absolute;
    background: var(--bw6);
    color: #ff8900;
    font-size: 10px;
    line-height: 20px;
    text-align: center;
    border-radius: calc(20px / 2);
    width: 20px;
    height: 20px;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
  }

  #price_sougou .price_list ul li a .price_hours {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: 50px;
  }

  #price_sougou .price_list ul li a .price_hours .price {
    position: relative;
    box-sizing: border-box;
    flex-grow: 1;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: 32px;
    line-height: 1em;
    font-weight: var(--bold);
    padding: 9px 0 0 44px;
  }

  #price_sougou .price_list ul li.pair a .price_hours .price::before,
  #price_sougou .price_list ul li.group a .price_hours .price::before {
    position: absolute;
    display: block;
    white-space: pre;
    content: "一人\Aあたり";
    color: #626262;
    font-size: 10px;
    line-height: 12px;
    font-weight: var(--regular);
    text-align: left;
    top: 10px;
    left: 8px;
  }

  #price_sougou .price_list ul li a .price_hours .price span {
    font-family: "Noto Sans JP", sans-serif;
    font-size: 14px;
  }

  #price_sougou .price_list ul li a .price_hours .hours {
    display: flex;
    flex-direction: column;
    gap: 5px 0;
    width: 155px;
    height: 100%;
    padding: 9px 7px 0;
  }

  #price_sougou .price_list ul li.night a .price_hours .hours {
    padding: 5px 7px 0;
    gap: 0;
  }

  #price_sougou .price_list ul li a .price_hours .hours .weekday,
  #price_sougou .price_list ul li a .price_hours .hours .holiday {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #price_sougou .price_list ul .night a .price_hours .hours .weekday {
    flex-wrap: nowrap;
  }

  #price_sougou .price_list ul li a .price_hours .hours .weekday h4,
  #price_sougou .price_list ul li a .price_hours .hours .holiday h4 {
    color: #626262;
    font-size: 11px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: 55px;
    flex-shrink: 0;
  }

  #price_sougou .price_list ul li a .price_hours .hours .holiday h4.except {
    font-size: 10px;
    width: 100%;
  }

  #price_sougou .price_list ul li a .price_hours .hours .weekday .weekday_hours,
  #price_sougou
    .price_list
    ul
    li
    a
    .price_hours
    .hours
    .holiday
    .holiday_hours {
    color: #626262;
    font-size: 12px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
  }

  #price_sougou .price_list ul li.master {
    border: 2px solid var(--master);
  }

  #price_sougou .price_list ul li.master a .planname {
    background: var(--master);
  }

  #price_sougou .price_list ul li.master a .price_hours .price {
    color: var(--master);
  }

  #price_sougou .price_list ul li.master a .price_hours .hours {
    background: #fee5f4;
  }

  #price_sougou .price_list ul li.pair {
    border: 2px solid var(--pair);
  }

  #price_sougou .price_list ul li.pair a .planname {
    background: var(--pair);
  }

  #price_sougou .price_list ul li.pair a .price_hours .price {
    color: var(--pair);
  }

  #price_sougou .price_list ul li.pair a .price_hours .hours {
    background: #fef2e8;
  }

  #price_sougou .price_list ul li.group {
    border: 2px solid var(--group);
  }

  #price_sougou .price_list ul li.group a .planname {
    background: var(--group);
  }

  #price_sougou .price_list ul li.group a .price_hours .price {
    color: var(--group);
  }

  #price_sougou .price_list ul li.group a .price_hours .hours {
    background: #ecfbe5;
  }

  #price_sougou .price_list ul li.day {
    border: 2px solid var(--day);
  }

  #price_sougou .price_list ul li.day a .planname {
    background: var(--day);
  }

  #price_sougou .price_list ul li.day a .price_hours .price {
    color: var(--day);
  }

  #price_sougou .price_list ul li.day a .price_hours .hours {
    background: #e9f5fa;
  }

  #price_sougou .price_list ul li.super_night {
    border: 2px solid var(--super_night);
  }

  #price_sougou .price_list ul li.super_night a .planname {
    background: var(--super_night);
  }

  #price_sougou .price_list ul li.super_night a .price_hours .price {
    color: var(--super_night);
  }

  #price_sougou .price_list ul li.super_night a .price_hours .hours {
    background: #f1e8f5;
  }

  #price_sougou .price_list ul li.morning {
    border: 2px solid var(--morning);
  }

  #price_sougou .price_list ul li.morning a .planname {
    background: var(--morning);
  }

  #price_sougou .price_list ul li.morning a .price_hours .price {
    color: var(--morning);
  }

  #price_sougou .price_list ul li.morning a .price_hours .hours {
    background: #e5f6f2;
  }

  #price_sougou .price_list ul li.week_end {
    border: 2px solid var(--week_end);
  }

  #price_sougou .price_list ul li.week_end a .planname {
    background: var(--week_end);
  }

  #price_sougou .price_list ul li.week_end a .price_hours .price {
    color: var(--week_end);
  }

  #price_sougou .price_list ul li.week_end a .price_hours .hours {
    background: #e6f4ec;
  }

  #price_sougou .price_list ul li.under29 {
    border: 2px solid var(--under29);
  }

  #price_sougou .price_list ul li.under29 a .planname {
    background: var(--under29);
  }

  #price_sougou .price_list ul li.under29 a .price_hours .price {
    color: var(--under29);
  }

  #price_sougou .price_list ul li.under29 a .price_hours .hours {
    background: #e5f7f6;
  }

  #price_sougou .price_list .attention {
    color: var(--bw1);
    font-size: 10px;
    line-height: 16px;
    font-weight: var(--regular);
    text-align: justify;
    width: 710px;
    margin: 0 auto;
  }

  #price_sougou > h3 {
    color: var(--holiday2);
    font-size: 22px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 20px;
  }

  #price_sougou .campaign {
    width: 600px;
    height: 314px;
    margin: 0 auto;
  }

  #price_sougou .campaign img {
    width: 100%;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #price_sougou {
    background: var(--bw6);
    width: 100%;
    padding: calc(60vw / var(--tablet)) 0 calc(35vw / var(--tablet));
  }

  #price_sougou h2 {
    color: var(--bw1);
    font-size: calc(34vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(10vw / var(--tablet));
  }

  #price_sougou .info {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(25vw / var(--tablet));
  }

  #price_sougou .example {
    width: calc(680vw / var(--tablet));
    margin: 0 auto calc(40vw / var(--tablet));
  }

  #price_sougou .example ul {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-bottom: calc(12vw / var(--tablet));
  }

  #price_sougou .example ul li {
    width: calc(164vw / var(--tablet));
  }

  #price_sougou .example ul li img {
    width: 100%;
  }

  #price_sougou .example small {
    display: block;
    color: #1e1e1e;
    font-size: calc(10vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    margin-bottom: calc(25vw / var(--tablet));
  }

  #price_sougou .example h3 {
    color: var(--bw1);
    font-size: calc(28vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
  }

  #price_sougou .check {
    text-align: center;
    width: 100%;
    margin: 0 auto calc(30vw / var(--tablet));
  }

  #price_sougou .check p {
    display: inline;
    background: linear-gradient(
      to top,
      #ffea00 0%,
      #ffea00 6px,
      transparent 6px,
      transparent 100%
    );
    color: var(--holiday2);
    font-size: calc(28vw / var(--tablet));
    line-height: calc(33vw / var(--tablet));
    font-weight: var(--bold);
    text-align: center;
  }

  #price_sougou .selected-store-name {
    color: var(--bw1);
    font-size: calc(28vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(25vw / var(--tablet));
  }

  #price_sougou .price_sougou_wrapper {
    display: flex;
    justify-content: space-between;
    width: calc(700vw / var(--tablet));
    margin: 0 auto calc(45vw / var(--tablet));
  }

  #price_sougou #prefecture {
    display: block;
    box-sizing: border-box;
    background: #ebf6fc;
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    border: calc(1vw / var(--tablet)) solid #0096dc;
    border-radius: calc(10vw / var(--tablet));
    width: calc(340vw / var(--tablet));
    padding: calc(16vw / var(--tablet));
    cursor: pointer;
  }

  #price_sougou #shops {
    display: block;
    box-sizing: border-box;
    background: #ebf6fc;
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    border: calc(1vw / var(--tablet)) solid #0096dc;
    border-radius: calc(10vw / var(--tablet));
    width: calc(340vw / var(--tablet));
    padding: calc(16vw / var(--tablet));
    cursor: pointer;
  }

  #price_sougou .price_list {
    width: 100%;
    padding-bottom: calc(40vw / var(--tablet));
  }

  #price_sougou .price_list ul {
    display: flex;
    flex-wrap: wrap;
    gap: calc(20vw / var(--tablet)) calc(30vw / var(--tablet));
    width: calc(710vw / var(--tablet));
    margin: 0 auto calc(15vw / var(--tablet));
  }

  #price_sougou .price_list ul li {
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bw6);
    border-radius: calc(6vw / var(--tablet));
    width: calc(340vw / var(--tablet));
  }

  #price_sougou .price_list ul li a {
    width: 100%;
    height: 100%;
  }

  #price_sougou .price_list ul li a .planname {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: calc(42vw / var(--tablet));
    padding-top: calc(2vw / var(--tablet));
  }

  #price_sougou .price_list ul li a .planname::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw6);
    width: calc(1vw / var(--tablet));
    height: calc(34vw / var(--tablet));
    top: 50%;
    left: calc(35vw / var(--tablet));
    transform: translateY(-50%);
  }

  #price_sougou .price_list ul li a .planname .icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: calc(19vw / var(--tablet));
    left: calc(9vw / var(--tablet));
  }

  #price_sougou .price_list ul li.master a .planname .icon {
    width: calc(10vw / var(--tablet));
    left: calc(13vw / var(--tablet));
  }

  #price_sougou .price_list ul li.pair a .planname .icon {
    width: calc(19vw / var(--tablet));
    left: calc(9vw / var(--tablet));
  }

  #price_sougou .price_list ul li.group a .planname .icon {
    width: calc(22vw / var(--tablet));
    left: calc(6vw / var(--tablet));
  }

  #price_sougou .price_list ul li.morning a .planname .icon {
    width: calc(15vw / var(--tablet));
    left: calc(10vw / var(--tablet));
  }

  #price_sougou .price_list ul li.day a .planname .icon {
    width: calc(18vw / var(--tablet));
    left: calc(8vw / var(--tablet));
  }

  #price_sougou .price_list ul li.super_night a .planname .icon {
    width: calc(18vw / var(--tablet));
    left: calc(8vw / var(--tablet));
  }

  #price_sougou .price_list ul li.week_end a .planname .icon {
    width: calc(21vw / var(--tablet));
    left: calc(7vw / var(--tablet));
  }

  #price_sougou .price_list ul li.under29 a .planname .icon {
    width: calc(23vw / var(--tablet));
    left: calc(6vw / var(--tablet));
  }

  #price_sougou .price_list ul li a .planname h3 {
    color: var(--bw6);
    font-size: calc(20vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    padding-left: calc(44vw / var(--tablet));
    margin-bottom: calc(3vw / var(--tablet));
  }

  #price_sougou .price_list ul li a .planname .planinfo {
    color: var(--bw6);
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    padding-left: calc(44vw / var(--tablet));
  }

  #price_sougou .price_list ul li a .planname i {
    position: absolute;
    background: var(--bw6);
    color: #ff8900;
    font-size: calc(10vw / var(--tablet));
    line-height: calc(20vw / var(--tablet));
    text-align: center;
    border-radius: calc((20vw / 2) / var(--tablet));
    width: calc(20vw / var(--tablet));
    height: calc(20vw / var(--tablet));
    top: 50%;
    right: calc(8vw / var(--tablet));
    transform: translateY(-50%);
  }

  #price_sougou .price_list ul li a .price_hours {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: calc(50vw / var(--tablet));
  }

  #price_sougou .price_list ul li a .price_hours .price {
    position: relative;
    box-sizing: border-box;
    flex-grow: 1;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: calc(32vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    padding: calc(9vw / var(--tablet)) 0 0 calc(44vw / var(--tablet));
  }

  #price_sougou .price_list ul li.pair a .price_hours .price::before,
  #price_sougou .price_list ul li.group a .price_hours .price::before {
    position: absolute;
    display: block;
    white-space: pre;
    content: "一人\Aあたり";
    color: #626262;
    font-size: calc(10vw / var(--tablet));
    line-height: calc(12vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    top: calc(10vw / var(--tablet));
    left: calc(8vw / var(--tablet));
  }

  #price_sougou .price_list ul li a .price_hours .price span {
    font-family: "Noto Sans JP", sans-serif;
    font-size: calc(14vw / var(--tablet));
  }

  #price_sougou .price_list ul li a .price_hours .hours {
    display: flex;
    flex-direction: column;
    gap: calc(5vw / var(--tablet)) 0;
    width: calc(155vw / var(--tablet));
    height: 100%;
    padding: calc(9vw / var(--tablet)) calc(7vw / var(--tablet)) 0;
  }

  #price_sougou .price_list ul li.night a .price_hours .hours {
    padding: calc(5vw / var(--tablet)) calc(7vw / var(--tablet)) 0;
    gap: 0;
  }

  #price_sougou .price_list ul li a .price_hours .hours .weekday,
  #price_sougou .price_list ul li a .price_hours .hours .holiday {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #price_sougou .price_list ul .night a .price_hours .hours .weekday {
    flex-wrap: nowrap;
  }

  #price_sougou .price_list ul li a .price_hours .hours .weekday h4,
  #price_sougou .price_list ul li a .price_hours .hours .holiday h4 {
    color: #626262;
    font-size: calc(11vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: calc(55vw / var(--tablet));
    flex-shrink: 0;
  }

  #price_sougou .price_list ul li a .price_hours .hours .holiday h4.except {
    font-size: calc(10vw / var(--tablet));
    width: 100%;
  }

  #price_sougou .price_list ul li a .price_hours .hours .weekday .weekday_hours,
  #price_sougou
    .price_list
    ul
    li
    a
    .price_hours
    .hours
    .holiday
    .holiday_hours {
    color: #626262;
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
  }

  #price_sougou .price_list ul li.master {
    border: calc(2vw / var(--tablet)) solid var(--master);
  }

  #price_sougou .price_list ul li.master a .planname {
    background: var(--master);
  }

  #price_sougou .price_list ul li.master a .price_hours .price {
    color: var(--master);
  }

  #price_sougou .price_list ul li.master a .price_hours .hours {
    background: #fee5f4;
  }

  #price_sougou .price_list ul li.pair {
    border: calc(2vw / var(--tablet)) solid var(--pair);
  }

  #price_sougou .price_list ul li.pair a .planname {
    background: var(--pair);
  }

  #price_sougou .price_list ul li.pair a .price_hours .price {
    color: var(--pair);
  }

  #price_sougou .price_list ul li.pair a .price_hours .hours {
    background: #fef2e8;
  }

  #price_sougou .price_list ul li.group {
    border: calc(2vw / var(--tablet)) solid var(--group);
  }

  #price_sougou .price_list ul li.group a .planname {
    background: var(--group);
  }

  #price_sougou .price_list ul li.group a .price_hours .price {
    color: var(--group);
  }

  #price_sougou .price_list ul li.group a .price_hours .hours {
    background: #ecfbe5;
  }

  #price_sougou .price_list ul li.day {
    border: calc(2vw / var(--tablet)) solid var(--day);
  }

  #price_sougou .price_list ul li.day a .planname {
    background: var(--day);
  }

  #price_sougou .price_list ul li.day a .price_hours .price {
    color: var(--day);
  }

  #price_sougou .price_list ul li.day a .price_hours .hours {
    background: #e9f5fa;
  }

  #price_sougou .price_list ul li.super_night {
    border: calc(2vw / var(--tablet)) solid var(--super_night);
  }

  #price_sougou .price_list ul li.super_night a .planname {
    background: var(--super_night);
  }

  #price_sougou .price_list ul li.super_night a .price_hours .price {
    color: var(--super_night);
  }

  #price_sougou .price_list ul li.super_night a .price_hours .hours {
    background: #f1e8f5;
  }

  #price_sougou .price_list ul li.morning {
    border: calc(2vw / var(--tablet)) solid var(--morning);
  }

  #price_sougou .price_list ul li.morning a .planname {
    background: var(--morning);
  }

  #price_sougou .price_list ul li.morning a .price_hours .price {
    color: var(--morning);
  }

  #price_sougou .price_list ul li.morning a .price_hours .hours {
    background: #e5f6f2;
  }

  #price_sougou .price_list ul li.week_end {
    border: calc(2vw / var(--tablet)) solid var(--week_end);
  }

  #price_sougou .price_list ul li.week_end a .planname {
    background: var(--week_end);
  }

  #price_sougou .price_list ul li.week_end a .price_hours .price {
    color: var(--week_end);
  }

  #price_sougou .price_list ul li.week_end a .price_hours .hours {
    background: #e6f4ec;
  }

  #price_sougou .price_list ul li.under29 {
    border: calc(2vw / var(--tablet)) solid var(--under29);
  }

  #price_sougou .price_list ul li.under29 a .planname {
    background: var(--under29);
  }

  #price_sougou .price_list ul li.under29 a .price_hours .price {
    color: var(--under29);
  }

  #price_sougou .price_list ul li.under29 a .price_hours .hours {
    background: #e5f7f6;
  }

  #price_sougou .price_list .attention {
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    line-height: calc(16vw / var(--tablet));
    font-weight: var(--regular);
    text-align: justify;
    width: calc(710vw / var(--tablet));
    margin: 0 auto;
  }

  #price_sougou > h3 {
    color: var(--holiday2);
    font-size: calc(22vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(20vw / var(--tablet));
  }

  #price_sougou .campaign {
    width: calc(600vw / var(--tablet));
    height: calc(314vw / var(--tablet));
    margin: 0 auto;
  }

  #price_sougou .campaign img {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  #price_sougou {
    background: var(--bw6);
    width: 100%;
    padding: calc(60vw / var(--sp)) 0 calc(35vw / var(--sp));
  }

  #price_sougou h2 {
    color: var(--bw1);
    font-size: calc(34vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(10vw / var(--sp));
  }

  #price_sougou .info {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(25vw / var(--sp));
  }

  #price_sougou .example {
    width: 100%;
    margin-bottom: calc(30vw / var(--sp));
  }

  #price_sougou .example ul {
    overflow-x: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
    display: flex;
    gap: 0 calc(7vw / var(--sp));
    width: 100%;
    padding: 0 calc(25vw / var(--sp));
    margin-bottom: calc(12vw / var(--sp));
  }

  #price_sougou .example ul li {
    flex-shrink: 0;
    width: calc(164vw / var(--sp));
  }

  #price_sougou .example ul li img {
    width: 100%;
  }

  #price_sougou .example small {
    display: block;
    box-sizing: border-box;
    color: #1e1e1e;
    font-size: calc(10vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    padding-left: calc(25vw / var(--sp));
    margin-bottom: calc(30vw / var(--sp));
  }

  #price_sougou .example h3 {
    color: var(--bw1);
    font-size: calc(28vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
  }

  #price_sougou .check {
    text-align: center;
    width: 100%;
    margin-bottom: calc(30vw / var(--sp));
  }

  #price_sougou .check p {
    display: inline;
    background: linear-gradient(
      to top,
      transparent 0%,
      transparent calc(3vw / var(--sp)),
      #ffea00 calc(3vw / var(--sp)),
      #ffea00 calc(9vw / var(--sp)),
      transparent calc(9vw / var(--sp)),
      transparent 100%
    );
    color: var(--holiday2);
    font-size: calc(28vw / var(--sp));
    line-height: calc(38vw / var(--sp));
    font-weight: var(--bold);
    text-align: center;
  }

  #price_sougou .selected-store-name {
    color: var(--bw1);
    font-size: calc(28vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(25vw / var(--sp));
  }

  #price_sougou #prefecture {
    display: block;
    box-sizing: border-box;
    background: #ebf6fc;
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    border: calc(1vw / var(--sp)) solid #0096dc;
    border-radius: calc(10vw / var(--sp));
    width: calc(340vw / var(--sp));
    padding: calc(16vw / var(--sp));
    margin: 0 auto calc(20vw / var(--sp));
    cursor: pointer;
  }

  #price_sougou #shops {
    display: block;
    box-sizing: border-box;
    background: #ebf6fc;
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    border: calc(1vw / var(--sp)) solid #0096dc;
    border-radius: calc(10vw / var(--sp));
    width: calc(340vw / var(--sp));
    padding: calc(16vw / var(--sp));
    margin: 0 auto calc(30vw / var(--sp));
    cursor: pointer;
  }

  #price_sougou .price_list {
    width: 100%;
    padding-bottom: calc(40vw / var(--sp));
  }

  #price_sougou .price_list ul {
    display: flex;
    flex-direction: column;
    gap: calc(6vw / var(--sp)) 0;
    width: calc(340vw / var(--sp));
    margin: 0 auto calc(10vw / var(--sp));
  }

  #price_sougou .price_list ul li {
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bw6);
    border-radius: calc(6vw / var(--sp));
    width: 100%;
  }

  #price_sougou .price_list ul li a {
    width: 100%;
    height: 100%;
  }

  #price_sougou .price_list ul li a .planname {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: calc(42vw / var(--sp));
    padding-top: calc(2vw / var(--sp));
  }

  #price_sougou .price_list ul li a .planname::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw6);
    width: calc(1vw / var(--sp));
    height: calc(34vw / var(--sp));
    top: 50%;
    left: calc(35vw / var(--sp));
    transform: translateY(-50%);
  }

  #price_sougou .price_list ul li a .planname .icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: calc(19vw / var(--sp));
    left: calc(9vw / var(--sp));
  }

  #price_sougou .price_list ul li.master a .planname .icon {
    width: calc(10vw / var(--sp));
    left: calc(13vw / var(--sp));
  }

  #price_sougou .price_list ul li.pair a .planname .icon {
    width: calc(19vw / var(--sp));
    left: calc(9vw / var(--sp));
  }

  #price_sougou .price_list ul li.group a .planname .icon {
    width: calc(22vw / var(--sp));
    left: calc(6vw / var(--sp));
  }

  #price_sougou .price_list ul li.morning a .planname .icon {
    width: calc(15vw / var(--sp));
    left: calc(10vw / var(--sp));
  }

  #price_sougou .price_list ul li.day a .planname .icon {
    width: calc(18vw / var(--sp));
    left: calc(8vw / var(--sp));
  }

  #price_sougou .price_list ul li.super_night a .planname .icon {
    width: calc(18vw / var(--sp));
    left: calc(8vw / var(--sp));
  }

  #price_sougou .price_list ul li.week_end a .planname .icon {
    width: calc(21vw / var(--sp));
    left: calc(7vw / var(--sp));
  }

  #price_sougou .price_list ul li.under29 a .planname .icon {
    width: calc(23vw / var(--sp));
    left: calc(6vw / var(--sp));
  }

  #price_sougou .price_list ul li a .planname h3 {
    color: var(--bw6);
    font-size: calc(20vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    padding-left: calc(44vw / var(--sp));
    margin-bottom: calc(3vw / var(--sp));
  }

  #price_sougou .price_list ul li a .planname .planinfo {
    color: var(--bw6);
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    padding-left: calc(44vw / var(--sp));
  }

  #price_sougou .price_list ul li a .planname i {
    position: absolute;
    background: var(--bw6);
    color: #ff8900;
    font-size: calc(10vw / var(--sp));
    line-height: calc(20vw / var(--sp));
    text-align: center;
    border-radius: calc((20vw / 2) / var(--sp));
    width: calc(20vw / var(--sp));
    height: calc(20vw / var(--sp));
    top: 50%;
    right: calc(8vw / var(--sp));
    transform: translateY(-50%);
  }

  #price_sougou .price_list ul li a .price_hours {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: calc(50vw / var(--sp));
  }

  #price_sougou .price_list ul li a .price_hours .price {
    position: relative;
    box-sizing: border-box;
    flex-grow: 1;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: calc(32vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    padding: calc(9vw / var(--sp)) 0 0 calc(44vw / var(--sp));
  }

  #price_sougou .price_list ul li.pair a .price_hours .price::before,
  #price_sougou .price_list ul li.group a .price_hours .price::before {
    position: absolute;
    display: block;
    white-space: pre;
    content: "一人\Aあたり";
    color: #626262;
    font-size: calc(10vw / var(--sp));
    line-height: calc(12vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    top: calc(10vw / var(--sp));
    left: calc(8vw / var(--sp));
  }

  #price_sougou .price_list ul li a .price_hours .price span {
    font-family: "Noto Sans JP", sans-serif;
    font-size: calc(14vw / var(--sp));
  }

  #price_sougou .price_list ul li a .price_hours .hours {
    display: flex;
    flex-direction: column;
    gap: calc(5vw / var(--sp)) 0;
    width: calc(155vw / var(--sp));
    height: 100%;
    padding: calc(9vw / var(--sp)) calc(7vw / var(--sp)) 0;
  }

  #price_sougou .price_list ul li.night a .price_hours .hours {
    padding: calc(5vw / var(--sp)) calc(7vw / var(--sp)) 0;
    gap: 0;
  }

  #price_sougou .price_list ul li a .price_hours .hours .weekday,
  #price_sougou .price_list ul li a .price_hours .hours .holiday {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #price_sougou .price_list ul .night a .price_hours .hours .weekday {
    flex-wrap: nowrap;
  }

  #price_sougou .price_list ul li a .price_hours .hours .weekday h4,
  #price_sougou .price_list ul li a .price_hours .hours .holiday h4 {
    color: #626262;
    font-size: calc(11vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: calc(55vw / var(--sp));
    flex-shrink: 0;
  }

  #price_sougou .price_list ul li a .price_hours .hours .holiday h4.except {
    font-size: calc(10vw / var(--sp));
    width: 100%;
  }

  #price_sougou .price_list ul li a .price_hours .hours .weekday .weekday_hours,
  #price_sougou
    .price_list
    ul
    li
    a
    .price_hours
    .hours
    .holiday
    .holiday_hours {
    color: #626262;
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
  }

  #price_sougou .price_list ul li.master {
    border: calc(2vw / var(--sp)) solid var(--master);
  }

  #price_sougou .price_list ul li.master a .planname {
    background: var(--master);
  }

  #price_sougou .price_list ul li.master a .price_hours .price {
    color: var(--master);
  }

  #price_sougou .price_list ul li.master a .price_hours .hours {
    background: #fee5f4;
  }

  #price_sougou .price_list ul li.pair {
    border: calc(2vw / var(--sp)) solid var(--pair);
  }

  #price_sougou .price_list ul li.pair a .planname {
    background: var(--pair);
  }

  #price_sougou .price_list ul li.pair a .price_hours .price {
    color: var(--pair);
  }

  #price_sougou .price_list ul li.pair a .price_hours .hours {
    background: #fef2e8;
  }

  #price_sougou .price_list ul li.group {
    border: calc(2vw / var(--sp)) solid var(--group);
  }

  #price_sougou .price_list ul li.group a .planname {
    background: var(--group);
  }

  #price_sougou .price_list ul li.group a .price_hours .price {
    color: var(--group);
  }

  #price_sougou .price_list ul li.group a .price_hours .hours {
    background: #ecfbe5;
  }

  #price_sougou .price_list ul li.day {
    border: calc(2vw / var(--sp)) solid var(--day);
  }

  #price_sougou .price_list ul li.day a .planname {
    background: var(--day);
  }

  #price_sougou .price_list ul li.day a .price_hours .price {
    color: var(--day);
  }

  #price_sougou .price_list ul li.day a .price_hours .hours {
    background: #e9f5fa;
  }

  #price_sougou .price_list ul li.super_night {
    border: calc(2vw / var(--sp)) solid var(--super_night);
  }

  #price_sougou .price_list ul li.super_night a .planname {
    background: var(--super_night);
  }

  #price_sougou .price_list ul li.super_night a .price_hours .price {
    color: var(--super_night);
  }

  #price_sougou .price_list ul li.super_night a .price_hours .hours {
    background: #f1e8f5;
  }

  #price_sougou .price_list ul li.morning {
    border: calc(2vw / var(--sp)) solid var(--morning);
  }

  #price_sougou .price_list ul li.morning a .planname {
    background: var(--morning);
  }

  #price_sougou .price_list ul li.morning a .price_hours .price {
    color: var(--morning);
  }

  #price_sougou .price_list ul li.morning a .price_hours .hours {
    background: #e5f6f2;
  }

  #price_sougou .price_list ul li.week_end {
    border: calc(2vw / var(--sp)) solid var(--week_end);
  }

  #price_sougou .price_list ul li.week_end a .planname {
    background: var(--week_end);
  }

  #price_sougou .price_list ul li.week_end a .price_hours .price {
    color: var(--week_end);
  }

  #price_sougou .price_list ul li.week_end a .price_hours .hours {
    background: #e6f4ec;
  }

  #price_sougou .price_list ul li.under29 {
    border: calc(2vw / var(--sp)) solid var(--under29);
  }

  #price_sougou .price_list ul li.under29 a .planname {
    background: var(--under29);
  }

  #price_sougou .price_list ul li.under29 a .price_hours .price {
    color: var(--under29);
  }

  #price_sougou .price_list ul li.under29 a .price_hours .hours {
    background: #e5f7f6;
  }

  #price_sougou .price_list .attention {
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    line-height: calc(16vw / var(--sp));
    font-weight: var(--regular);
    text-align: justify;
    width: calc(340vw / var(--sp));
    margin: 0 auto;
  }

  #price_sougou > h3 {
    color: var(--holiday2);
    font-size: calc(22vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(20vw / var(--sp));
  }

  #price_sougou .campaign {
    width: calc(340vw / var(--sp));
    height: calc(255vw / var(--sp));
    margin: 0 auto;
  }

  #price_sougou .campaign img {
    width: 100%;
  }
}

/************************************
#price
************************************/
@media screen and (min-width: 1366px) {
  #price {
    background: var(--bw5);
    width: 100%;
    padding: 60px 0 50px;
  }

  #price h2 {
    color: var(--bw1);
    font-size: 34px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 15px;
  }

  #price .info {
    color: var(--bw1);
    font-size: 16px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 30px;
  }

  #price ul {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 30px;
    width: 710px;
    margin: 0 auto 15px;
  }

  #price ul li {
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bw6);
    border-radius: 6px;
    width: 340px;
    height: 90px;
  }

  #price ul li a {
    width: 100%;
    height: 100%;
  }

  #price ul li a .planname {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: 42px;
    padding-top: 2px;
  }

  #price ul li a .planname::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw6);
    width: 1px;
    height: 34px;
    top: 50%;
    left: 35px;
    transform: translateY(-50%);
  }

  #price ul li a .planname .icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 19px;
    left: 9px;
  }

  #price ul li.master a .planname .icon {
    width: 10px;
    left: 13px;
  }

  #price ul li.pair a .planname .icon {
    width: 19px;
    left: 9px;
  }

  #price ul li.group a .planname .icon {
    width: 22px;
    left: 6px;
  }

  #price ul li.morning a .planname .icon {
    width: 15px;
    left: 10px;
  }

  #price ul li.day a .planname .icon {
    width: 18px;
    left: 8px;
  }

  #price ul li.super_night a .planname .icon {
    width: 18px;
    left: 8px;
  }

  #price ul li.week_end a .planname .icon {
    width: 21px;
    left: 7px;
  }

  #price ul li.under29 a .planname .icon {
    width: 23px;
    left: 6px;
  }

  #price ul li a .planname h3 {
    color: var(--bw6);
    font-size: 20px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    padding-left: 44px;
    margin-bottom: 3px;
  }

  #price ul li a .planname .planinfo {
    color: var(--bw6);
    font-size: 12px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    padding-left: 44px;
  }

  #price ul li a .planname i {
    position: absolute;
    background: var(--bw6);
    color: #ff8900;
    font-size: 10px;
    line-height: 20px;
    text-align: center;
    border-radius: calc(20px / 2);
    width: 20px;
    height: 20px;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
  }

  #price ul li a .price_hours {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: 50px;
  }

  #price ul li a .price_hours .price {
    position: relative;
    box-sizing: border-box;
    flex-grow: 1;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: 32px;
    line-height: 1em;
    font-weight: var(--bold);
    padding: 4px 0 0 44px;
  }

  #price ul li.pair a .price_hours .price::before,
  #price ul li.group a .price_hours .price::before {
    position: absolute;
    display: block;
    white-space: pre;
    content: "一人\Aあたり";
    color: #626262;
    font-size: 10px;
    line-height: 12px;
    font-weight: var(--regular);
    text-align: left;
    top: 10px;
    left: 8px;
  }

  #price ul li a .price_hours .price span {
    font-family: "Noto Sans JP", sans-serif;
    font-size: 14px;
  }

  #price ul li a .price_hours .hours {
    display: flex;
    flex-direction: column;
    gap: 5px 0;
    width: 155px;
    height: 100%;
    padding: 9px 7px 0;
  }

  #price ul li.night a .price_hours .hours {
    padding: 5px 7px 0;
    gap: 0;
  }

  #price ul li a .price_hours .hours .weekday,
  #price ul li a .price_hours .hours .holiday {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #price ul .night a .price_hours .hours .weekday {
    flex-wrap: nowrap;
  }

  #price ul li a .price_hours .hours .weekday h4,
  #price ul li a .price_hours .hours .holiday h4 {
    color: #626262;
    font-size: 11px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: 55px;
    flex-shrink: 0;
  }

  #price ul li a .price_hours .hours .holiday h4.except {
    font-size: 10px;
    width: 100%;
  }

  #price ul li a .price_hours .hours .weekday .weekday_hours,
  #price ul li a .price_hours .hours .holiday .holiday_hours {
    color: #626262;
    font-size: 12px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
  }

  #price ul li.master {
    border: 2px solid var(--master);
  }

  #price ul li.master a .planname {
    background: var(--master);
  }

  #price ul li.master a .price_hours .price {
    color: var(--master);
  }

  #price ul li.master a .price_hours .hours {
    background: #fee5f4;
  }

  #price ul li.pair {
    border: 2px solid var(--pair);
  }

  #price ul li.pair a .planname {
    background: var(--pair);
  }

  #price ul li.pair a .price_hours .price {
    color: var(--pair);
  }

  #price ul li.pair a .price_hours .hours {
    background: #fef2e8;
  }

  #price ul li.group {
    border: 2px solid var(--group);
  }

  #price ul li.group a .planname {
    background: var(--group);
  }

  #price ul li.group a .price_hours .price {
    color: var(--group);
  }

  #price ul li.group a .price_hours .hours {
    background: #ecfbe5;
  }

  #price ul li.day {
    border: 2px solid var(--day);
  }

  #price ul li.day a .planname {
    background: var(--day);
  }

  #price ul li.day a .price_hours .price {
    color: var(--day);
  }

  #price ul li.day a .price_hours .hours {
    background: #e9f5fa;
  }

  #price ul li.super_night {
    border: 2px solid var(--super_night);
  }

  #price ul li.super_night a .planname {
    background: var(--super_night);
  }

  #price ul li.super_night a .price_hours .price {
    color: var(--super_night);
  }

  #price ul li.super_night a .price_hours .hours {
    background: #f1e8f5;
  }

  #price ul li.morning {
    border: 2px solid var(--morning);
  }

  #price ul li.morning a .planname {
    background: var(--morning);
  }

  #price ul li.morning a .price_hours .price {
    color: var(--morning);
  }

  #price ul li.morning a .price_hours .hours {
    background: #e5f6f2;
  }

  #price ul li.week_end {
    border: 2px solid var(--week_end);
  }

  #price ul li.week_end a .planname {
    background: var(--week_end);
  }

  #price ul li.week_end a .price_hours .price {
    color: var(--week_end);
  }

  #price ul li.week_end a .price_hours .hours {
    background: #e6f4ec;
  }

  #price ul li.under29 {
    border: 2px solid var(--under29);
  }

  #price ul li.under29 a .planname {
    background: var(--under29);
  }

  #price ul li.under29 a .price_hours .price {
    color: var(--under29);
  }

  #price ul li.under29 a .price_hours .hours {
    background: #e5f7f6;
  }

  #price .attention {
    color: var(--bw1);
    font-size: 10px;
    line-height: 16px;
    font-weight: var(--regular);
    text-align: justify;
    width: 710px;
    margin: 0 auto;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #price {
    background: var(--bw5);
    width: 100%;
    padding: calc(60vw / var(--tablet)) 0 calc(50vw / var(--tablet));
  }

  #price h2 {
    color: var(--bw1);
    font-size: calc(34vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(15vw / var(--tablet));
  }

  #price .info {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(30vw / var(--tablet));
  }

  #price ul {
    display: flex;
    flex-wrap: wrap;
    gap: calc(20vw / var(--tablet)) calc(30vw / var(--tablet));
    width: calc(710vw / var(--tablet));
    margin: 0 auto calc(15vw / var(--tablet));
  }

  #price ul li {
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bw6);
    border-radius: calc(6vw / var(--tablet));
    width: calc(340vw / var(--tablet));
    height: calc(90vw / var(--tablet));
  }

  #price ul li a {
    width: 100%;
    height: 100%;
  }

  #price ul li a .planname {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: calc(42vw / var(--tablet));
    padding-top: calc(2vw / var(--tablet));
  }

  #price ul li a .planname::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw6);
    width: calc(1vw / var(--tablet));
    height: calc(34vw / var(--tablet));
    top: 50%;
    left: calc(35vw / var(--tablet));
    transform: translateY(-50%);
  }

  #price ul li a .planname .icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: calc(19vw / var(--tablet));
    left: calc(9vw / var(--tablet));
  }

  #price ul li.master a .planname .icon {
    width: calc(10vw / var(--tablet));
    left: calc(13vw / var(--tablet));
  }

  #price ul li.pair a .planname .icon {
    width: calc(19vw / var(--tablet));
    left: calc(9vw / var(--tablet));
  }

  #price ul li.group a .planname .icon {
    width: calc(22vw / var(--tablet));
    left: calc(6vw / var(--tablet));
  }

  #price ul li.morning a .planname .icon {
    width: calc(15vw / var(--tablet));
    left: calc(10vw / var(--tablet));
  }

  #price ul li.day a .planname .icon {
    width: calc(18vw / var(--tablet));
    left: calc(8vw / var(--tablet));
  }

  #price ul li.super_night a .planname .icon {
    width: calc(18vw / var(--tablet));
    left: calc(8vw / var(--tablet));
  }

  #price ul li.week_end a .planname .icon {
    width: calc(21vw / var(--tablet));
    left: calc(7vw / var(--tablet));
  }

  #price ul li.under29 a .planname .icon {
    width: calc(23vw / var(--tablet));
    left: calc(6vw / var(--tablet));
  }

  #price ul li a .planname h3 {
    color: var(--bw6);
    font-size: calc(20vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    padding-left: calc(44vw / var(--tablet));
    margin-bottom: calc(3vw / var(--tablet));
  }

  #price ul li a .planname .planinfo {
    color: var(--bw6);
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    padding-left: calc(44vw / var(--tablet));
  }

  #price ul li a .planname i {
    position: absolute;
    background: var(--bw6);
    color: #ff8900;
    font-size: calc(10vw / var(--tablet));
    line-height: calc(20vw / var(--tablet));
    text-align: center;
    border-radius: calc((20vw / 2) / var(--tablet));
    width: calc(20vw / var(--tablet));
    height: calc(20vw / var(--tablet));
    top: 50%;
    right: calc(8vw / var(--tablet));
    transform: translateY(-50%);
  }

  #price ul li a .price_hours {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: calc(50vw / var(--tablet));
  }

  #price ul li a .price_hours .price {
    position: relative;
    box-sizing: border-box;
    flex-grow: 1;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: calc(32vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    padding: calc(4vw / var(--tablet)) 0 0 calc(44vw / var(--tablet));
  }

  #price ul li.pair a .price_hours .price::before,
  #price ul li.group a .price_hours .price::before {
    position: absolute;
    display: block;
    white-space: pre;
    content: "一人\Aあたり";
    color: #626262;
    font-size: calc(10vw / var(--tablet));
    line-height: calc(12vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    top: calc(10vw / var(--tablet));
    left: calc(8vw / var(--tablet));
  }

  #price ul li a .price_hours .price span {
    font-family: "Noto Sans JP", sans-serif;
    font-size: calc(14vw / var(--tablet));
  }

  #price ul li a .price_hours .hours {
    display: flex;
    flex-direction: column;
    gap: calc(5vw / var(--tablet)) 0;
    width: calc(155vw / var(--tablet));
    height: 100%;
    padding: calc(9vw / var(--tablet)) calc(7vw / var(--tablet)) 0;
  }

  #price ul li.night a .price_hours .hours {
    padding: calc(5vw / var(--tablet)) calc(7vw / var(--tablet)) 0;
    gap: 0;
  }

  #price ul li a .price_hours .hours .weekday,
  #price ul li a .price_hours .hours .holiday {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #price ul .night a .price_hours .hours .weekday {
    flex-wrap: nowrap;
  }

  #price ul li a .price_hours .hours .weekday h4,
  #price ul li a .price_hours .hours .holiday h4 {
    color: #626262;
    font-size: calc(11vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: calc(55vw / var(--tablet));
    flex-shrink: 0;
  }

  #price ul li a .price_hours .hours .holiday h4.except {
    font-size: calc(10vw / var(--tablet));
    width: 100%;
  }

  #price ul li a .price_hours .hours .weekday .weekday_hours,
  #price ul li a .price_hours .hours .holiday .holiday_hours {
    color: #626262;
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
  }

  #price ul li.master {
    border: calc(2vw / var(--tablet)) solid var(--master);
  }

  #price ul li.master a .planname {
    background: var(--master);
  }

  #price ul li.master a .price_hours .price {
    color: var(--master);
  }

  #price ul li.master a .price_hours .hours {
    background: #fee5f4;
  }

  #price ul li.pair {
    border: calc(2vw / var(--tablet)) solid var(--pair);
  }

  #price ul li.pair a .planname {
    background: var(--pair);
  }

  #price ul li.pair a .price_hours .price {
    color: var(--pair);
  }

  #price ul li.pair a .price_hours .hours {
    background: #fef2e8;
  }

  #price ul li.group {
    border: calc(2vw / var(--tablet)) solid var(--group);
  }

  #price ul li.group a .planname {
    background: var(--group);
  }

  #price ul li.group a .price_hours .price {
    color: var(--group);
  }

  #price ul li.group a .price_hours .hours {
    background: #ecfbe5;
  }

  #price ul li.day {
    border: calc(2vw / var(--tablet)) solid var(--day);
  }

  #price ul li.day a .planname {
    background: var(--day);
  }

  #price ul li.day a .price_hours .price {
    color: var(--day);
  }

  #price ul li.day a .price_hours .hours {
    background: #e9f5fa;
  }

  #price ul li.super_night {
    border: calc(2vw / var(--tablet)) solid var(--super_night);
  }

  #price ul li.super_night a .planname {
    background: var(--super_night);
  }

  #price ul li.super_night a .price_hours .price {
    color: var(--super_night);
  }

  #price ul li.super_night a .price_hours .hours {
    background: #f1e8f5;
  }

  #price ul li.morning {
    border: calc(2vw / var(--tablet)) solid var(--morning);
  }

  #price ul li.morning a .planname {
    background: var(--morning);
  }

  #price ul li.morning a .price_hours .price {
    color: var(--morning);
  }

  #price ul li.morning a .price_hours .hours {
    background: #e5f6f2;
  }

  #price ul li.week_end {
    border: calc(2vw / var(--tablet)) solid var(--week_end);
  }

  #price ul li.week_end a .planname {
    background: var(--week_end);
  }

  #price ul li.week_end a .price_hours .price {
    color: var(--week_end);
  }

  #price ul li.week_end a .price_hours .hours {
    background: #e6f4ec;
  }

  #price ul li.under29 {
    border: calc(2vw / var(--tablet)) solid var(--under29);
  }

  #price ul li.under29 a .planname {
    background: var(--under29);
  }

  #price ul li.under29 a .price_hours .price {
    color: var(--under29);
  }

  #price ul li.under29 a .price_hours .hours {
    background: #e5f7f6;
  }

  #price .attention {
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    line-height: calc(16vw / var(--tablet));
    font-weight: var(--regular);
    text-align: justify;
    width: calc(710vw / var(--tablet));
    margin: 0 auto;
  }
}

@media screen and (max-width: 767px) {
  #price {
    background: var(--bw5);
    width: 100%;
    padding: calc(50vw / var(--sp)) 0;
  }

  #price h2 {
    color: var(--bw1);
    font-size: calc(34vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(10vw / var(--sp));
  }

  #price .info {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(25vw / var(--sp));
  }

  #price ul {
    display: flex;
    flex-direction: column;
    gap: calc(6vw / var(--sp)) 0;
    width: calc(340vw / var(--sp));
    margin: 0 auto calc(10vw / var(--sp));
  }

  #price ul li {
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bw6);
    border-radius: calc(6vw / var(--sp));
    width: 100%;
  }

  #price ul li a {
    width: 100%;
    height: 100%;
  }

  #price ul li a .planname {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: calc(42vw / var(--sp));
    padding-top: calc(2vw / var(--sp));
  }

  #price ul li a .planname::before {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw6);
    width: calc(1vw / var(--sp));
    height: calc(34vw / var(--sp));
    top: 50%;
    left: calc(35vw / var(--sp));
    transform: translateY(-50%);
  }

  #price ul li a .planname .icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: calc(19vw / var(--sp));
    left: calc(9vw / var(--sp));
  }

  #price ul li.master a .planname .icon {
    width: calc(10vw / var(--sp));
    left: calc(13vw / var(--sp));
  }

  #price ul li.pair a .planname .icon {
    width: calc(19vw / var(--sp));
    left: calc(9vw / var(--sp));
  }

  #price ul li.group a .planname .icon {
    width: calc(22vw / var(--sp));
    left: calc(6vw / var(--sp));
  }

  #price ul li.morning a .planname .icon {
    width: calc(15vw / var(--sp));
    left: calc(10vw / var(--sp));
  }

  #price ul li.day a .planname .icon {
    width: calc(18vw / var(--sp));
    left: calc(8vw / var(--sp));
  }

  #price ul li.super_night a .planname .icon {
    width: calc(18vw / var(--sp));
    left: calc(8vw / var(--sp));
  }

  #price ul li.week_end a .planname .icon {
    width: calc(21vw / var(--sp));
    left: calc(7vw / var(--sp));
  }

  #price ul li.under29 a .planname .icon {
    width: calc(23vw / var(--sp));
    left: calc(6vw / var(--sp));
  }

  #price ul li a .planname h3 {
    color: var(--bw6);
    font-size: calc(20vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    padding-left: calc(44vw / var(--sp));
    margin-bottom: calc(3vw / var(--sp));
  }

  #price ul li a .planname .planinfo {
    color: var(--bw6);
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
    padding-left: calc(44vw / var(--sp));
  }

  #price ul li a .planname i {
    position: absolute;
    background: var(--bw6);
    color: #ff8900;
    font-size: calc(10vw / var(--sp));
    line-height: calc(20vw / var(--sp));
    text-align: center;
    border-radius: calc((20vw / 2) / var(--sp));
    width: calc(20vw / var(--sp));
    height: calc(20vw / var(--sp));
    top: 50%;
    right: calc(8vw / var(--sp));
    transform: translateY(-50%);
  }

  #price ul li a .price_hours {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: calc(50vw / var(--sp));
  }

  #price ul li a .price_hours .price {
    position: relative;
    box-sizing: border-box;
    flex-grow: 1;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: calc(32vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    padding: calc(4vw / var(--sp)) 0 0 calc(44vw / var(--sp));
  }

  #price ul li.pair a .price_hours .price::before,
  #price ul li.group a .price_hours .price::before {
    position: absolute;
    display: block;
    white-space: pre;
    content: "一人\Aあたり";
    color: #626262;
    font-size: calc(10vw / var(--sp));
    line-height: calc(12vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    top: calc(10vw / var(--sp));
    left: calc(8vw / var(--sp));
  }

  #price ul li a .price_hours .price span {
    font-family: "Noto Sans JP", sans-serif;
    font-size: calc(14vw / var(--sp));
  }

  #price ul li a .price_hours .hours {
    display: flex;
    flex-direction: column;
    gap: calc(5vw / var(--sp)) 0;
    width: calc(155vw / var(--sp));
    height: 100%;
    padding: calc(9vw / var(--sp)) calc(7vw / var(--sp)) 0;
  }

  #price ul li.night a .price_hours .hours {
    padding: calc(5vw / var(--sp)) calc(7vw / var(--sp)) 0;
    gap: 0;
  }

  #price ul li a .price_hours .hours .weekday,
  #price ul li a .price_hours .hours .holiday {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #price ul .night a .price_hours .hours .weekday {
    flex-wrap: nowrap;
  }

  #price ul li a .price_hours .hours .weekday h4,
  #price ul li a .price_hours .hours .holiday h4 {
    color: #626262;
    font-size: calc(11vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: calc(55vw / var(--sp));
    flex-shrink: 0;
  }

  #price ul li a .price_hours .hours .holiday h4.except {
    font-size: calc(10vw / var(--sp));
    width: 100%;
  }

  #price ul li a .price_hours .hours .weekday .weekday_hours,
  #price ul li a .price_hours .hours .holiday .holiday_hours {
    color: #626262;
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
  }

  #price ul li.master {
    border: calc(2vw / var(--sp)) solid var(--master);
  }

  #price ul li.master a .planname {
    background: var(--master);
  }

  #price ul li.master a .price_hours .price {
    color: var(--master);
  }

  #price ul li.master a .price_hours .hours {
    background: #fee5f4;
  }

  #price ul li.pair {
    border: calc(2vw / var(--sp)) solid var(--pair);
  }

  #price ul li.pair a .planname {
    background: var(--pair);
  }

  #price ul li.pair a .price_hours .price {
    color: var(--pair);
  }

  #price ul li.pair a .price_hours .hours {
    background: #fef2e8;
  }

  #price ul li.group {
    border: calc(2vw / var(--sp)) solid var(--group);
  }

  #price ul li.group a .planname {
    background: var(--group);
  }

  #price ul li.group a .price_hours .price {
    color: var(--group);
  }

  #price ul li.group a .price_hours .hours {
    background: #ecfbe5;
  }

  #price ul li.day {
    border: calc(2vw / var(--sp)) solid var(--day);
  }

  #price ul li.day a .planname {
    background: var(--day);
  }

  #price ul li.day a .price_hours .price {
    color: var(--day);
  }

  #price ul li.day a .price_hours .hours {
    background: #e9f5fa;
  }

  #price ul li.super_night {
    border: calc(2vw / var(--sp)) solid var(--super_night);
  }

  #price ul li.super_night a .planname {
    background: var(--super_night);
  }

  #price ul li.super_night a .price_hours .price {
    color: var(--super_night);
  }

  #price ul li.super_night a .price_hours .hours {
    background: #f1e8f5;
  }

  #price ul li.morning {
    border: calc(2vw / var(--sp)) solid var(--morning);
  }

  #price ul li.morning a .planname {
    background: var(--morning);
  }

  #price ul li.morning a .price_hours .price {
    color: var(--morning);
  }

  #price ul li.morning a .price_hours .hours {
    background: #e5f6f2;
  }

  #price ul li.week_end {
    border: calc(2vw / var(--sp)) solid var(--week_end);
  }

  #price ul li.week_end a .planname {
    background: var(--week_end);
  }

  #price ul li.week_end a .price_hours .price {
    color: var(--week_end);
  }

  #price ul li.week_end a .price_hours .hours {
    background: #e6f4ec;
  }

  #price ul li.under29 {
    border: calc(2vw / var(--sp)) solid var(--under29);
  }

  #price ul li.under29 a .planname {
    background: var(--under29);
  }

  #price ul li.under29 a .price_hours .price {
    color: var(--under29);
  }

  #price ul li.under29 a .price_hours .hours {
    background: #e5f7f6;
  }

  #price .attention {
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    line-height: calc(16vw / var(--sp));
    font-weight: var(--regular);
    text-align: justify;
    width: calc(340vw / var(--sp));
    margin: 0 auto;
  }
}

/************************************
#guide
************************************/
@media screen and (min-width: 1366px) {
  #guide {
    width: 100%;
    padding: 50px 0;
  }

  #guide .menu {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    background: var(--holiday2);
    border-radius: 16px;
    width: 710px;
    height: 100px;
    margin: 0 auto;
  }

  #guide .menu::before {
    position: absolute;
    display: block;
    content: "";
    aspect-ratio: 1;
    background: linear-gradient(
      -45deg,
      rgba(255, 255, 255, 0.1),
      rgba(255, 255, 255, 0.1)
    );
    clip-path: polygon(100% 100%, 0 0, 100% 0);
    width: 679px;
    height: 85px;
    top: 0;
    right: 0;
  }

  #guide .menu .icon_beginner {
    position: absolute;
    width: 32px;
    top: 50px;
    left: 96px;
    transform: translateY(-50%);
  }

  #guide .menu .photo_beginner {
    position: absolute;
    width: 63px;
    bottom: 0;
    left: 17px;
  }

  #guide .menu h2 {
    color: var(--bw6);
    font-size: 32px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    padding: 38px 0 0 135px;
  }

  #guide .menu ul {
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    background: var(--bw6);
    border-radius: 15px;
    width: 324px;
    height: 73px;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
  }

  #guide .menu ul li {
    position: relative;
    box-sizing: border-box;
    flex-grow: 1;
    color: var(--bw2);
    font-size: 15px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    height: 100%;
    padding-top: 48px;
    transition: var(--hover_transition);
  }

  #guide .menu ul li::before {
    position: absolute;
    display: block;
    content: "";
    left: 50%;
    transform: translateX(-50%);
  }

  #guide .menu ul li.entry::before {
    background: url("../img/guide/icon_entry.webp") no-repeat;
    background-size: 100% 100%;
    width: 33px;
    height: 30px;
    top: 9px;
  }

  #guide .menu ul li.mochimono::before {
    background: url("../img/guide/icon_mochimono.webp") no-repeat;
    background-size: 100% 100%;
    width: 30px;
    height: 32px;
    top: 7px;
  }

  #guide .menu ul li.howto::before {
    background: url("../img/guide/icon_howto.webp") no-repeat;
    background-size: 100% 100%;
    width: 34px;
    height: 23px;
    top: 15px;
  }

  #guide .menu ul li::after {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw3);
    border-radius: calc(2px / 2);
    width: 2px;
    height: 55px;
    top: 50%;
    right: calc(-2px / 2);
    transform: translateY(-50%);
  }

  #guide .menu ul li:last-child::after {
    display: none;
  }

  #guide .menu ul li:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #guide {
    width: 100%;
    padding: calc(50vw / var(--tablet)) 0;
  }

  #guide .menu {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    background: var(--holiday2);
    border-radius: calc(16vw / var(--tablet));
    width: calc(710vw / var(--tablet));
    height: calc(100vw / var(--tablet));
    margin: 0 auto;
  }

  #guide .menu::before {
    position: absolute;
    display: block;
    content: "";
    aspect-ratio: 1;
    background: linear-gradient(
      -45deg,
      rgba(255, 255, 255, 0.1),
      rgba(255, 255, 255, 0.1)
    );
    clip-path: polygon(100% 100%, 0 0, 100% 0);
    width: calc(679vw / var(--tablet));
    height: calc(85vw / var(--tablet));
    top: 0;
    right: 0;
  }

  #guide .menu .icon_beginner {
    position: absolute;
    width: calc(32vw / var(--tablet));
    top: calc(50vw / var(--tablet));
    left: calc(96vw / var(--tablet));
    transform: translateY(-50%);
  }

  #guide .menu .photo_beginner {
    position: absolute;
    width: calc(63vw / var(--tablet));
    bottom: 0;
    left: calc(17vw / var(--tablet));
  }

  #guide .menu h2 {
    color: var(--bw6);
    font-size: calc(32vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    padding: calc(38vw / var(--tablet)) 0 0 calc(135vw / var(--tablet));
  }

  #guide .menu ul {
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    background: var(--bw6);
    border-radius: calc(15vw / var(--tablet));
    width: calc(324vw / var(--tablet));
    height: calc(73vw / var(--tablet));
    top: 50%;
    right: calc(15vw / var(--tablet));
    transform: translateY(-50%);
  }

  #guide .menu ul li {
    position: relative;
    box-sizing: border-box;
    flex-grow: 1;
    color: var(--bw2);
    font-size: calc(15vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    height: 100%;
    padding-top: calc(48vw / var(--tablet));
    transition: var(--hover_transition);
  }

  #guide .menu ul li::before {
    position: absolute;
    display: block;
    content: "";
    left: 50%;
    transform: translateX(-50%);
  }

  #guide .menu ul li.entry::before {
    background: url("../img/guide/icon_entry.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(33vw / var(--tablet));
    height: calc(30vw / var(--tablet));
    top: calc(9vw / var(--tablet));
  }

  #guide .menu ul li.mochimono::before {
    background: url("../img/guide/icon_mochimono.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(30vw / var(--tablet));
    height: calc(32vw / var(--tablet));
    top: calc(7vw / var(--tablet));
  }

  #guide .menu ul li.howto::before {
    background: url("../img/guide/icon_howto.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(34vw / var(--tablet));
    height: calc(23vw / var(--tablet));
    top: calc(15vw / var(--tablet));
  }

  #guide .menu ul li::after {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw3);
    border-radius: calc((2vw / 2) / var(--tablet));
    width: calc(2vw / var(--tablet));
    height: calc(55vw / var(--tablet));
    top: 50%;
    right: calc((-2vw / 2) / var(--tablet));
    transform: translateY(-50%);
  }

  #guide .menu ul li:last-child::after {
    display: none;
  }

  #guide .menu ul li:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }
}

@media screen and (max-width: 767px) {
  #guide {
    width: 100%;
    padding-top: calc(85vw / var(--sp));
  }

  #guide .menu {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    background: var(--holiday2);
    border-radius: calc(20vw / var(--sp));
    width: calc(340vw / var(--sp));
    height: calc(170vw / var(--sp));
    margin: 0 auto;
  }

  #guide .menu::before {
    position: absolute;
    display: block;
    content: "";
    aspect-ratio: 1;
    background: linear-gradient(
      -45deg,
      rgba(255, 255, 255, 0.1),
      rgba(255, 255, 255, 0.1)
    );
    clip-path: polygon(100% 100%, 0 0, 100% 0);
    width: calc(316vw / var(--sp));
    height: calc(100vw / var(--sp));
    top: 0;
    right: 0;
  }

  #guide .menu .icon_beginner {
    position: absolute;
    width: calc(32vw / var(--sp));
    top: calc(30vw / var(--sp));
    left: calc(13vw / var(--sp));
  }

  #guide .menu .photo_beginner {
    position: absolute;
    width: calc(63vw / var(--sp));
    top: calc(12vw / var(--sp));
    right: calc(18vw / var(--sp));
  }

  #guide .menu h2 {
    color: var(--bw6);
    font-size: calc(32vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    padding: calc(35vw / var(--sp)) 0 0 calc(50vw / var(--sp));
  }

  #guide .menu ul {
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    background: var(--bw6);
    border-radius: calc(15vw / var(--sp));
    width: calc(324vw / var(--sp));
    height: calc(73vw / var(--sp));
    bottom: calc(6vw / var(--sp));
    left: 50%;
    transform: translateX(-50%);
  }

  #guide .menu ul li {
    position: relative;
    box-sizing: border-box;
    flex-grow: 1;
    color: var(--bw2);
    font-size: calc(15vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    height: 100%;
    padding-top: calc(48vw / var(--sp));
    transition: var(--hover_transition);
  }

  #guide .menu ul li::before {
    position: absolute;
    display: block;
    content: "";
    left: 50%;
    transform: translateX(-50%);
  }

  #guide .menu ul li.entry::before {
    background: url("../img/guide/icon_entry.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(33vw / var(--sp));
    height: calc(30vw / var(--sp));
    top: calc(9vw / var(--sp));
  }

  #guide .menu ul li.mochimono::before {
    background: url("../img/guide/icon_mochimono.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(30vw / var(--sp));
    height: calc(32vw / var(--sp));
    top: calc(7vw / var(--sp));
  }

  #guide .menu ul li.howto::before {
    background: url("../img/guide/icon_howto.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(34vw / var(--sp));
    height: calc(23vw / var(--sp));
    top: calc(15vw / var(--sp));
  }

  #guide .menu ul li::after {
    position: absolute;
    display: block;
    content: "";
    background: var(--bw3);
    border-radius: calc((2vw / 2) / var(--sp));
    width: calc(2vw / var(--sp));
    height: calc(55vw / var(--sp));
    top: 50%;
    right: calc((-2vw / 2) / var(--sp));
    transform: translateY(-50%);
  }

  #guide .menu ul li:last-child::after {
    display: none;
  }

  #guide .menu ul li:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }
}

/************************************
.morefun
************************************/
@media screen and (min-width: 1366px) {
  .morefun {
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    background-color: #f7f7f7;
    width: 100%;
    height: 560px;
  }

  .morefun::before {
    position: absolute;
    display: block;
    content: "";
    aspect-ratio: 1;
    background: linear-gradient(45deg, var(--bw6), var(--bw6));
    clip-path: polygon(0 0, 100% 0, 0 100%);
    width: 120%;
    height: 240px;
    top: 0;
    left: 0;
  }

  .morefun .morefun_logo {
    position: absolute;
    width: 233px;
    top: 90px;
    left: calc(50% - 314px);
  }

  .morefun p {
    position: absolute;
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: center;
    width: 360px;
    bottom: 110px;
    left: calc(50% - 377px);
  }

  .morefun p.start {
    font-weight: var(--bold);
    bottom: calc(110px - 26px);
  }

  .morefun .morefun_back {
    position: absolute;
    width: 432px;
    bottom: 0;
    left: calc(50% - 25px);
  }

  .facility_popup .morefun {
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    background-color: #f7f7f7;
    width: 100%;
    height: 520px;
    padding-top: 232px;
  }

  .facility_popup .morefun::before {
    position: absolute;
    display: block;
    content: "";
    aspect-ratio: 1;
    background: linear-gradient(45deg, var(--bw6), var(--bw6));
    clip-path: polygon(0 0, 100% 0, 0 100%);
    width: 450px;
    height: 224px;
    top: 0;
    left: 0;
  }

  .facility_popup .morefun .morefun_logo {
    position: absolute;
    width: 192px;
    top: 33px;
    left: 30px;
  }

  .facility_popup .morefun p {
    position: relative;
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: left;
    width: 340px;
    margin: 0 auto;
    bottom: auto;
    left: auto;
  }

  .facility_popup .morefun p:first-child {
    margin-bottom: 10px;
  }

  .facility_popup .morefun p.start {
    font-weight: var(--bold);
  }

  .facility_popup .morefun .morefun_back {
    position: absolute;
    width: 377px;
    bottom: 0;
    left: auto;
    right: -130px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  .morefun {
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    background-color: #f7f7f7;
    width: 100%;
    height: calc(560vw / var(--tablet));
  }

  .morefun::before {
    position: absolute;
    display: block;
    content: "";
    aspect-ratio: 1;
    background: linear-gradient(45deg, var(--bw6), var(--bw6));
    clip-path: polygon(0 0, 100% 0, 0 100%);
    width: 120%;
    height: calc(240vw / var(--tablet));
    top: 0;
    left: 0;
  }

  .morefun .morefun_logo {
    position: absolute;
    width: calc(233vw / var(--tablet));
    top: calc(90vw / var(--tablet));
    left: calc(50% - (314vw / var(--tablet)));
  }

  .morefun p {
    position: absolute;
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: center;
    width: calc(360vw / var(--tablet));
    bottom: calc(110vw / var(--tablet));
    left: calc(50% - (377vw / var(--tablet)));
  }

  .morefun p.start {
    font-weight: var(--bold);
    bottom: calc((110vw - 26vw) / var(--tablet));
  }

  .morefun .morefun_back {
    position: absolute;
    width: calc(432vw / var(--tablet));
    bottom: 0;
    left: calc(50% - (25vw / var(--tablet)));
  }

  .facility_popup .morefun {
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    background-color: #f7f7f7;
    width: 100%;
    height: calc(520vw / var(--tablet));
    padding-top: calc(232vw / var(--tablet));
  }

  .facility_popup .morefun::before {
    position: absolute;
    display: block;
    content: "";
    aspect-ratio: 1;
    background: linear-gradient(45deg, var(--bw6), var(--bw6));
    clip-path: polygon(0 0, 100% 0, 0 100%);
    width: calc(450vw / var(--tablet));
    height: calc(224vw / var(--tablet));
    top: 0;
    left: 0;
  }

  .facility_popup .morefun .morefun_logo {
    position: absolute;
    width: calc(192vw / var(--tablet));
    top: calc(33vw / var(--tablet));
    left: calc(30vw / var(--tablet));
  }

  .facility_popup .morefun p {
    position: relative;
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    width: calc(340vw / var(--tablet));
    margin: 0 auto;
    bottom: auto;
    left: auto;
  }

  .facility_popup .morefun p:first-child {
    margin-bottom: calc(10vw / var(--tablet));
  }

  .facility_popup .morefun p.start {
    font-weight: var(--bold);
  }

  .facility_popup .morefun .morefun_back {
    position: absolute;
    width: calc(377vw / var(--tablet));
    bottom: 0;
    left: auto;
    right: calc(-130vw / var(--tablet));
  }
}

@media screen and (max-width: 767px) {
  .morefun {
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    background-color: #f7f7f7;
    width: 100%;
    height: calc(520vw / var(--sp));
    padding-top: calc(232vw / var(--sp));
  }

  .morefun::before {
    position: absolute;
    display: block;
    content: "";
    aspect-ratio: 1;
    background: linear-gradient(45deg, var(--bw6), var(--bw6));
    clip-path: polygon(0 0, 100% 0, 0 100%);
    width: calc(450vw / var(--sp));
    height: calc(224vw / var(--sp));
    top: 0;
    left: 0;
  }

  .morefun .morefun_logo {
    position: absolute;
    width: calc(192vw / var(--sp));
    top: calc(33vw / var(--sp));
    left: calc(30vw / var(--sp));
  }

  .morefun p {
    position: relative;
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    width: calc(340vw / var(--sp));
    margin: 0 auto;
  }

  .morefun p:first-child {
    margin-bottom: calc(10vw / var(--sp));
  }

  .morefun p.start {
    font-weight: var(--bold);
  }

  .morefun .morefun_back {
    position: absolute;
    width: calc(377vw / var(--sp));
    bottom: 0;
    right: calc(-130vw / var(--sp));
  }
}

/************************************
#instagram
************************************/
@media screen and (min-width: 1366px) {
  #instagram {
    position: relative;
    max-width: 660px;
    margin: 0 auto;
    padding: 100px 0 35px;
  }

  #instagram::after {
    position: relative;
    display: block;
    content: "";
    background: var(--bw3);
    width: 660px;
    height: 2px;
    bottom: -35px;
    left: 50%;
    transform: translateX(-50%);
  }

  #instagram h2 {
    color: var(--holiday1);
    font-size: 28px;
    line-height: 38px;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 25px;
  }

  #instagram h2 span {
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
  }

  #instagram ul {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    width: 660px;
    margin: 0 auto 30px;
  }

  #instagram ul li {
    background: var(--bw5);
    width: 96px;
    height: 96px;
  }

  #instagram .button {
    position: relative;
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: #008bd4;
    border-radius: 4px;
    width: 130px;
    height: 30px;
    padding-left: 38px;
    margin: 0 auto;
  }

  #instagram .button img {
    position: absolute;
    width: 14px;
    height: 14px;
    top: 50%;
    left: 13px;
    transform: translateY(-50%);
  }

  #instagram .button p {
    color: var(--bw6);
    font-size: 13px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #instagram {
    position: relative;
    max-width: calc(660vw / var(--tablet));
    margin: 0 auto;
    padding: calc(100vw / var(--tablet)) 0 calc(35vw / var(--tablet));
  }

  #instagram::after {
    position: relative;
    display: block;
    content: "";
    background: var(--bw3);
    width: calc(660vw / var(--tablet));
    height: calc(2vw / var(--tablet));
    bottom: calc(-35vw / var(--tablet));
    left: 50%;
    transform: translateX(-50%);
  }

  #instagram h2 {
    color: var(--holiday1);
    font-size: calc(28vw / var(--tablet));
    line-height: calc(38vw / var(--tablet));
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(25vw / var(--tablet));
  }

  #instagram h2 span {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
  }

  #instagram ul {
    display: flex;
    flex-wrap: wrap;
    gap: calc(16vw / var(--tablet));
    width: calc(660vw / var(--tablet));
    margin: 0 auto calc(30vw / var(--tablet));
  }

  #instagram ul li {
    background: var(--bw5);
    width: calc(96vw / var(--tablet));
    height: calc(96vw / var(--tablet));
  }

  #instagram .button {
    position: relative;
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: #008bd4;
    border-radius: calc(4vw / var(--tablet));
    width: calc(130vw / var(--tablet));
    height: calc(30vw / var(--tablet));
    padding-left: calc(38vw / var(--tablet));
    margin: 0 auto;
  }

  #instagram .button img {
    position: absolute;
    width: calc(14vw / var(--tablet));
    height: calc(14vw / var(--tablet));
    top: 50%;
    left: calc(13vw / var(--tablet));
    transform: translateY(-50%);
  }

  #instagram .button p {
    color: var(--bw6);
    font-size: calc(13vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
  }
}

@media screen and (max-width: 767px) {
  #instagram {
    position: relative;
    max-width: calc(340vw / var(--sp));
    margin: 0 auto;
    padding: calc(50vw / var(--sp)) 0 calc(30vw / var(--sp));
  }

  #instagram::after {
    position: relative;
    display: block;
    content: "";
    background: var(--bw3);
    width: calc(340vw / var(--sp));
    height: calc(2vw / var(--sp));
    bottom: calc(-30vw / var(--sp));
    left: 50%;
    transform: translateX(-50%);
  }

  #instagram h2 {
    color: var(--holiday1);
    font-size: calc(28vw / var(--sp));
    line-height: calc(38vw / var(--sp));
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(30vw / var(--sp));
  }

  #instagram h2 span {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
  }

  #instagram ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: calc(16vw / var(--sp));
    margin: 0 auto calc(30vw / var(--sp));
  }

  #instagram ul li {
    background: var(--bw5);
    width: calc(96vw / var(--sp));
    height: calc(96vw / var(--sp));
  }

  #instagram .button {
    position: relative;
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: #008bd4;
    border-radius: calc(4vw / var(--sp));
    width: calc(130vw / var(--sp));
    height: calc(30vw / var(--sp));
    padding-left: calc(38vw / var(--sp));
    margin: 0 auto;
  }

  #instagram .button img {
    position: absolute;
    width: calc(14vw / var(--sp));
    height: calc(14vw / var(--sp));
    top: 50%;
    left: calc(13vw / var(--sp));
    transform: translateY(-50%);
  }

  #instagram .button p {
    color: var(--bw6);
    font-size: calc(13vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: left;
  }
}

/************************************
#search
************************************/
@media screen and (min-width: 1366px) {
  #search {
    width: 100%;
    padding-top: 60px;
  }

  #search.sougou {
    background: url("../img/index/search_back.webp") no-repeat;
    background-size: 390px 290px;
    background-position: top 20px center;
    padding-top: 80px;
  }

  #search h2 {
    color: #1a1a1a;
    font-size: 26px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 25px;
  }

  #search.sougou h2 {
    margin-bottom: 20px;
  }

  #search.sougou .start {
    color: var(--holiday2);
    font-size: 34px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: 45px;
  }

  #search #gpsBtn {
    position: relative;
    background: #e43b4d;
    color: var(--bw6);
    font-size: 21px;
    line-height: 60px;
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc(60px / 2);
    width: 340px;
    height: 60px;
    margin: 0 auto 30px;
  }

  #search.sougou #gpsBtn {
    margin-bottom: 65px;
  }

  #search #gpsBtn::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/common/icon_gps.webp") no-repeat;
    background-size: 100% 100%;
    width: 19px;
    height: 28px;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
  }

  #search .shops {
    display: flex;
    flex-direction: column;
    gap: 1px 0;
    width: 960px;
    margin: 0 auto;
  }

  #search .shops h3 {
    position: relative;
    box-sizing: border-box;
    background: #e3e3e3;
    color: #595757;
    font-size: 18px;
    line-height: 60px;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    height: 60px;
    padding-left: 30px;
    transition: var(--hover_transition);
  }

  #search .shops h3:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #search .shops h3 i {
    position: absolute;
    color: #6f6d6d;
    font-size: 16px;
    text-align: center;
    top: 50%;
    right: 24px;
    transform: translateY(-50%);
    transition: var(--hover_transition);
  }

  #search .shops h3.open i {
    transform: translateY(-50%) rotate(180deg);
    transform-origin: center center;
    transition: var(--hover_transition);
  }

  #search .shops ul {
    display: none;
  }

  #search .shops ul li {
    width: 100%;
  }

  #search .shops ul li.prefecture h4 {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #eff2f4;
    color: #7d7d7d;
    font-size: 14.5px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    letter-spacing: 0.2em;
    border-top: 2px solid #bbc7cc;
    width: 100%;
    height: 25px;
  }

  #search .shops ul li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    background: var(--bw6);
    border-bottom: 1px solid #d2d2d2;
    width: 100%;
    height: 50px;
    padding: 0 30px;
  }

  #search .shops ul li a p.shopname {
    color: #6f6d6d;
    font-size: 16px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
  }

  #search .shops ul li a p.access {
    color: #7d7d7d;
    font-size: 14.5px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: right;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #search {
    width: 100%;
    padding-top: calc(60vw / var(--tablet));
  }

  #search.sougou {
    background: url("../img/index/search_back.webp") no-repeat;
    background-size: calc(390vw / var(--tablet)) calc(290vw / var(--tablet));
    background-position: top calc(20vw / var(--tablet)) center;
    padding-top: calc(80vw / var(--tablet));
  }

  #search h2 {
    color: #1a1a1a;
    font-size: calc(26vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(25vw / var(--tablet));
  }

  #search.sougou h2 {
    margin-bottom: calc(20vw / var(--tablet));
  }

  #search.sougou .start {
    color: var(--holiday2);
    font-size: calc(34vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(45vw / var(--tablet));
  }

  #search #gpsBtn {
    position: relative;
    background: #e43b4d;
    color: var(--bw6);
    font-size: calc(21vw / var(--tablet));
    line-height: calc(60vw / var(--tablet));
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((60vw / 2) / var(--tablet));
    width: calc(340vw / var(--tablet));
    height: calc(60vw / var(--tablet));
    margin: 0 auto calc(30vw / var(--tablet));
  }

  #search.sougou #gpsBtn {
    margin-bottom: calc(65vw / var(--tablet));
  }

  #search #gpsBtn::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/common/icon_gps.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(19vw / var(--tablet));
    height: calc(28vw / var(--tablet));
    top: 50%;
    left: calc(20vw / var(--tablet));
    transform: translateY(-50%);
  }

  #search .shops {
    display: flex;
    flex-direction: column;
    gap: calc(1vw / var(--tablet)) 0;
    width: calc(960vw / var(--tablet));
    margin: 0 auto;
  }

  #search .shops h3 {
    position: relative;
    box-sizing: border-box;
    background: #e3e3e3;
    color: #595757;
    font-size: calc(18vw / var(--tablet));
    line-height: calc(60vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    height: calc(60vw / var(--tablet));
    padding-left: calc(30vw / var(--tablet));
    transition: var(--hover_transition);
  }

  #search .shops h3:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #search .shops h3 i {
    position: absolute;
    color: #6f6d6d;
    font-size: calc(16vw / var(--tablet));
    text-align: center;
    top: 50%;
    right: calc(24vw / var(--tablet));
    transform: translateY(-50%);
    transition: var(--hover_transition);
  }

  #search .shops h3.open i {
    transform: translateY(-50%) rotate(180deg);
    transform-origin: center center;
    transition: var(--hover_transition);
  }

  #search .shops ul {
    display: none;
  }

  #search .shops ul li {
    width: 100%;
  }

  #search .shops ul li.prefecture h4 {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #eff2f4;
    color: #7d7d7d;
    font-size: calc(14.5vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    letter-spacing: 0.2em;
    border-top: calc(2vw / var(--tablet)) solid #bbc7cc;
    width: 100%;
    height: calc(25vw / var(--tablet));
  }

  #search .shops ul li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    background: var(--bw6);
    border-bottom: calc(1vw / var(--tablet)) solid #d2d2d2;
    width: 100%;
    height: calc(50vw / var(--tablet));
    padding: 0 calc(30vw / var(--tablet));
  }

  #search .shops ul li a p.shopname {
    color: #6f6d6d;
    font-size: calc(16vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
  }

  #search .shops ul li a p.access {
    color: #7d7d7d;
    font-size: calc(14.5vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: right;
  }
}

@media screen and (max-width: 767px) {
  #search {
    width: 100%;
    padding-top: calc(45vw / var(--sp));
  }

  #search.sougou {
    background: url("../img/index/search_back.webp") no-repeat;
    background-size: calc(290vw / var(--sp)) calc(290vw / var(--sp));
    background-position: top center;
    padding-top: calc(60vw / var(--sp));
  }

  #search h2 {
    color: #1a1a1a;
    font-size: calc(26vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(25vw / var(--sp));
  }

  #search.sougou h2 {
    margin-bottom: calc(15vw / var(--sp));
  }

  #search.sougou .start {
    color: var(--holiday2);
    font-size: calc(34vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    width: 100%;
    margin-bottom: calc(45vw / var(--sp));
  }

  #search #gpsBtn {
    position: relative;
    background: #e43b4d;
    color: var(--bw6);
    font-size: calc(21vw / var(--sp));
    line-height: calc(60vw / var(--sp));
    font-weight: var(--bold);
    text-align: center;
    border-radius: calc((60vw / 2) / var(--sp));
    width: calc(340vw / var(--sp));
    height: calc(60vw / var(--sp));
    margin: 0 auto calc(30vw / var(--sp));
  }

  #search.sougou #gpsBtn {
    margin-bottom: calc(55vw / var(--sp));
  }

  #search #gpsBtn::before {
    position: absolute;
    display: block;
    content: "";
    background: url("../img/common/icon_gps.webp") no-repeat;
    background-size: 100% 100%;
    width: calc(19vw / var(--sp));
    height: calc(28vw / var(--sp));
    top: 50%;
    left: calc(20vw / var(--sp));
    transform: translateY(-50%);
  }

  #search .shops {
    display: flex;
    flex-direction: column;
    gap: calc(1vw / var(--sp)) 0;
    width: 100%;
  }

  #search .shops h3 {
    position: relative;
    box-sizing: border-box;
    background: #e3e3e3;
    color: #595757;
    font-size: calc(18vw / var(--sp));
    line-height: calc(60vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    height: calc(60vw / var(--sp));
    padding-left: calc(30vw / var(--sp));
    transition: var(--hover_transition);
  }

  #search .shops h3:hover {
    cursor: pointer;
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #search .shops h3 i {
    position: absolute;
    color: #6f6d6d;
    font-size: calc(16vw / var(--sp));
    text-align: center;
    top: 50%;
    right: calc(24vw / var(--sp));
    transform: translateY(-50%);
    transition: var(--hover_transition);
  }

  #search .shops h3.open i {
    transform: translateY(-50%) rotate(180deg);
    transform-origin: center center;
    transition: var(--hover_transition);
  }

  #search .shops ul {
    display: none;
  }

  #search .shops ul li {
    width: 100%;
  }

  #search .shops ul li.prefecture h4 {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #eff2f4;
    color: #7d7d7d;
    font-size: calc(14.5vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: center;
    letter-spacing: 0.2em;
    border-top: calc(2vw / var(--sp)) solid #bbc7cc;
    width: 100%;
    height: calc(25vw / var(--sp));
  }

  #search .shops ul li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    background: var(--bw6);
    border-bottom: calc(1vw / var(--sp)) solid #d2d2d2;
    width: 100%;
    height: calc(50vw / var(--sp));
    padding: 0 calc(30vw / var(--sp));
    gap: calc(36vw / var(--sp));
  }

  #search .shops ul li a p.shopname {
    color: #6f6d6d;
    font-size: calc(16vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    flex-shrink: 0;
  }

  #search .shops ul li a p.access {
    color: #7d7d7d;
    font-size: calc(12vw / var(--sp));
    line-height: 1.2em;
    font-weight: var(--regular);
    text-align: right;
  }
}

/************************************
#other
************************************/
@media screen and (min-width: 1366px) {
  #other {
    position: relative;
    width: 100%;
    padding: 30px 0 130px;
  }

  #other ul {
    display: flex;
    border-top: 1px solid #e2e2e2;
    border-bottom: 1px solid #e2e2e2;
    width: 960px;
    height: 50px;
    margin: 0 auto;
  }

  #other ul li {
    flex-grow: 1;
    position: relative;
    color: #595757;
    font-size: 16px;
    line-height: 50px;
    font-weight: var(--regular);
    text-align: center;
    height: 100%;
    transition: var(--hover_transition);
  }

  #other ul li::after {
    position: absolute;
    display: block;
    content: "";
    background: #e2e2e2;
    width: 1px;
    height: 30px;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
  }

  #other ul li:last-child::after {
    display: none;
  }

  #other ul li:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #other ul li a {
    position: relative;
    color: #595757;
    font-size: 16px;
    line-height: 50px;
    font-weight: var(--regular);
    text-align: center;
    width: 100%;
    height: 100%;
  }

  #other ul li i,
  #other ul li a i {
    position: absolute;
    color: #595757;
    font-size: 16px;
    text-align: right;
    top: 50%;
    right: 55px;
    transform: translateY(-50%);
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #other {
    position: relative;
    width: 100%;
    padding: calc(30vw / var(--tablet)) 0 calc(130vw / var(--tablet));
  }

  #other ul {
    display: flex;
    border-top: calc(1vw / var(--tablet)) solid #e2e2e2;
    border-bottom: calc(1vw / var(--tablet)) solid #e2e2e2;
    width: calc(960vw / var(--tablet));
    height: calc(50vw / var(--tablet));
    margin: 0 auto;
  }

  #other ul li {
    flex-grow: 1;
    position: relative;
    color: #595757;
    font-size: calc(16vw / var(--tablet));
    line-height: calc(50vw / var(--tablet));
    font-weight: var(--regular);
    text-align: center;
    height: 100%;
    transition: var(--hover_transition);
  }

  #other ul li::after {
    position: absolute;
    display: block;
    content: "";
    background: #e2e2e2;
    width: calc(1vw / var(--tablet));
    height: calc(30vw / var(--tablet));
    top: 50%;
    right: 0;
    transform: translateY(-50%);
  }

  #other ul li:last-child::after {
    display: none;
  }

  #other ul li:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #other ul li a {
    position: relative;
    color: #595757;
    font-size: calc(16vw / var(--tablet));
    line-height: calc(50vw / var(--tablet));
    font-weight: var(--regular);
    text-align: center;
    width: 100%;
    height: 100%;
  }

  #other ul li i,
  #other ul li a i {
    position: absolute;
    color: #595757;
    font-size: calc(16vw / var(--tablet));
    text-align: right;
    top: 50%;
    right: calc(55vw / var(--tablet));
    transform: translateY(-50%);
  }
}

@media screen and (max-width: 767px) {
  #other {
    position: relative;
    width: 100%;
    padding: calc(30vw / var(--sp)) 0;
  }

  #other ul {
    border-top: calc(1vw / var(--sp)) solid #e2e2e2;
    width: calc(340vw / var(--sp));
    margin: 0 auto;
  }

  #other ul li {
    position: relative;
    color: #595757;
    font-size: calc(16vw / var(--sp));
    line-height: calc(50vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    border-bottom: calc(1vw / var(--sp)) solid #e2e2e2;
    width: 100%;
    height: calc(50vw / var(--sp));
    transition: var(--hover_transition);
  }

  #other ul li:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #other ul li a {
    position: relative;
    color: #595757;
    font-size: calc(16vw / var(--sp));
    line-height: calc(50vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    height: calc(50vw / var(--sp));
  }

  #other ul li i,
  #other ul li a i {
    position: absolute;
    color: #595757;
    font-size: calc(16vw / var(--sp));
    text-align: right;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
  }
}

/************************************
#faq_popup
************************************/
@media screen and (min-width: 1366px) {
  #faq_popup > h2 {
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: #0060b6;
    color: var(--bw6);
    font-size: 28px;
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    height: 60px;
    padding-left: 25px;
  }

  #faq_popup ol {
    display: flex;
    flex-direction: column;
    gap: 4px 0;
    background: var(--bw6);
    width: 100%;
  }

  #faq_popup ol li {
    background: var(--bw5);
    width: 100%;
  }

  #faq_popup ol li .question,
  #faq_popup ol li .answer {
    box-sizing: border-box;
    width: 100%;
    padding: 15px 0;
  }

  #faq_popup ol li .question {
    transition: var(--hover_transition);
  }

  #faq_popup ol li .question:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #faq_popup ol li .answer {
    display: none;
  }

  #faq_popup ol li .question .wrapper,
  #faq_popup ol li .answer .wrapper {
    display: flex;
    gap: 0 8px;
    width: 340px;
    margin: 0 auto;
  }

  #faq_popup ol li .question .wrapper {
    position: relative;
  }

  #faq_popup ol li .answer .wrapper {
    background: var(--bw6);
    border-radius: 10px;
  }

  #faq_popup ol li .question .wrapper h3,
  #faq_popup ol li .answer .wrapper h3 {
    display: block;
    align-content: center;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: 32px;
    line-height: 1em;
    font-weight: 500;
    text-align: center;
    width: 50px;
    height: 50px;
  }

  #faq_popup ol li .question .wrapper h3 {
    background: var(--bw6);
    color: var(--holiday2);
    border-radius: 10px;
  }

  #faq_popup ol li .answer .wrapper h3 {
    color: var(--holiday3);
  }

  #faq_popup ol li .question .wrapper p {
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--bold);
    text-align: left;
    width: 240px;
  }

  #faq_popup ol li .question .wrapper i {
    position: absolute;
    color: var(--bw1);
    font-size: 20px;
    text-align: center;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
  }

  #faq_popup ol li .question.open .wrapper i {
    transform: translateY(-50%) rotate(180deg);
    transform-origin: center center;
    transition: var(--hover_transition);
  }

  #faq_popup ol li .answer .wrapper .text {
    width: 250px;
    padding: 10px 0;
  }

  #faq_popup ol li .answer .wrapper .text p {
    color: var(--bw1);
    font-size: 16px;
    line-height: 26px;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
  }

  #faq_popup ol li .answer .wrapper small {
    display: block;
    color: var(--bw1);
    font-size: 10px;
    line-height: 16px;
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    margin-top: 5px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #faq_popup > h2 {
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: #0060b6;
    color: var(--bw6);
    font-size: calc(28vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    height: calc(60vw / var(--tablet));
    padding-left: calc(25vw / var(--tablet));
  }

  #faq_popup ol {
    display: flex;
    flex-direction: column;
    gap: calc(4vw / var(--tablet)) 0;
    background: var(--bw6);
    width: 100%;
  }

  #faq_popup ol li {
    background: var(--bw5);
    width: 100%;
  }

  #faq_popup ol li .question,
  #faq_popup ol li .answer {
    box-sizing: border-box;
    width: 100%;
    padding: calc(15vw / var(--tablet)) 0;
  }

  #faq_popup ol li .question {
    transition: var(--hover_transition);
  }

  #faq_popup ol li .question:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #faq_popup ol li .answer {
    display: none;
  }

  #faq_popup ol li .question .wrapper,
  #faq_popup ol li .answer .wrapper {
    display: flex;
    gap: 0 calc(8vw / var(--tablet));
    width: calc(340vw / var(--tablet));
    margin: 0 auto;
  }

  #faq_popup ol li .question .wrapper {
    position: relative;
  }

  #faq_popup ol li .answer .wrapper {
    background: var(--bw6);
    border-radius: calc(10vw / var(--tablet));
  }

  #faq_popup ol li .question .wrapper h3,
  #faq_popup ol li .answer .wrapper h3 {
    display: block;
    align-content: center;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: calc(32vw / var(--tablet));
    line-height: 1em;
    font-weight: 500;
    text-align: center;
    width: calc(50vw / var(--tablet));
    height: calc(50vw / var(--tablet));
  }

  #faq_popup ol li .question .wrapper h3 {
    background: var(--bw6);
    color: var(--holiday2);
    border-radius: calc(10vw / var(--tablet));
  }

  #faq_popup ol li .answer .wrapper h3 {
    color: var(--holiday3);
  }

  #faq_popup ol li .question .wrapper p {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--bold);
    text-align: left;
    width: calc(240vw / var(--tablet));
  }

  #faq_popup ol li .question .wrapper i {
    position: absolute;
    color: var(--bw1);
    font-size: calc(20vw / var(--tablet));
    text-align: center;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
  }

  #faq_popup ol li .question.open .wrapper i {
    transform: translateY(-50%) rotate(180deg);
    transform-origin: center center;
    transition: var(--hover_transition);
  }

  #faq_popup ol li .answer .wrapper .text {
    width: calc(250vw / var(--tablet));
    padding: calc(10vw / var(--tablet)) 0;
  }

  #faq_popup ol li .answer .wrapper .text p {
    color: var(--bw1);
    font-size: calc(16vw / var(--tablet));
    line-height: calc(26vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
  }

  #faq_popup ol li .answer .wrapper small {
    display: block;
    color: var(--bw1);
    font-size: calc(10vw / var(--tablet));
    line-height: calc(16vw / var(--tablet));
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    margin-top: calc(5vw / var(--tablet));
  }
}

@media screen and (max-width: 767px) {
  #faq_popup > h2 {
    display: block;
    box-sizing: border-box;
    align-content: center;
    background: #0060b6;
    color: var(--bw6);
    font-size: calc(28vw / var(--sp));
    line-height: 1em;
    font-weight: var(--bold);
    text-align: left;
    width: 100%;
    height: calc(60vw / var(--sp));
    padding-left: calc(25vw / var(--sp));
  }

  #faq_popup ol {
    display: flex;
    flex-direction: column;
    gap: calc(4vw / var(--sp)) 0;
    background: var(--bw6);
    width: 100%;
  }

  #faq_popup ol li {
    background: var(--bw5);
    width: 100%;
  }

  #faq_popup ol li .question,
  #faq_popup ol li .answer {
    box-sizing: border-box;
    width: 100%;
    padding: calc(15vw / var(--sp)) 0;
  }

  #faq_popup ol li .question {
    transition: var(--hover_transition);
  }

  #faq_popup ol li .question:hover {
    opacity: var(--hover_opacity);
    transition: var(--hover_transition);
  }

  #faq_popup ol li .answer {
    display: none;
  }

  #faq_popup ol li .question .wrapper,
  #faq_popup ol li .answer .wrapper {
    display: flex;
    gap: 0 calc(8vw / var(--sp));
    width: calc(340vw / var(--sp));
    margin: 0 auto;
  }

  #faq_popup ol li .question .wrapper {
    position: relative;
  }

  #faq_popup ol li .answer .wrapper {
    background: var(--bw6);
    border-radius: calc(10vw / var(--sp));
  }

  #faq_popup ol li .question .wrapper h3,
  #faq_popup ol li .answer .wrapper h3 {
    display: block;
    align-content: center;
    font-family: "Barlow", sans-serif;
    font-style: normal;
    font-size: calc(32vw / var(--sp));
    line-height: 1em;
    font-weight: 500;
    text-align: center;
    width: calc(50vw / var(--sp));
    height: calc(50vw / var(--sp));
  }

  #faq_popup ol li .question .wrapper h3 {
    background: var(--bw6);
    color: var(--holiday2);
    border-radius: calc(10vw / var(--sp));
  }

  #faq_popup ol li .answer .wrapper h3 {
    color: var(--holiday3);
  }

  #faq_popup ol li .question .wrapper p {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--bold);
    text-align: left;
    width: calc(240vw / var(--sp));
  }

  #faq_popup ol li .question .wrapper i {
    position: absolute;
    color: var(--bw1);
    font-size: calc(20vw / var(--sp));
    text-align: center;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
  }

  #faq_popup ol li .question.open .wrapper i {
    transform: translateY(-50%) rotate(180deg);
    transform-origin: center center;
    transition: var(--hover_transition);
  }

  #faq_popup ol li .answer .wrapper .text {
    width: calc(250vw / var(--sp));
    padding: calc(10vw / var(--sp)) 0;
  }

  #faq_popup ol li .answer .wrapper .text p {
    color: var(--bw1);
    font-size: calc(16vw / var(--sp));
    line-height: calc(26vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
  }

  #faq_popup ol li .answer .wrapper small {
    display: block;
    color: var(--bw1);
    font-size: calc(10vw / var(--sp));
    line-height: calc(16vw / var(--sp));
    font-weight: var(--regular);
    text-align: left;
    width: 100%;
    margin-top: calc(5vw / var(--sp));
  }
}

/************************************
#floating_pc, #floating
************************************/
@media screen and (min-width: 1366px) {
  #floating_pc {
    position: absolute;
    display: flex;
    width: 280px;
    height: 100%;
    top: 0;
    right: 0;
  }

  #floating_pc.sougou {
    width: 420px;
  }

  #floating_pc a.search,
  #floating_pc a.entry {
    flex-grow: 1;
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    width: 210px;
    height: 100%;
    padding: 19px 0;
    margin: 0 auto;
  }

  #floating_pc a.search {
    background: #e43b4d;
  }

  #floating_pc a.entry {
    background: var(--entry);
  }

  #floating_pc a.search p,
  #floating_pc a.entry p {
    box-sizing: border-box;
    color: var(--bw6);
    font-size: 12px;
    line-height: 1em;
    text-align: center;
    font-weight: var(--regular);
    width: 100%;
  }

  #floating_pc.sougou a.search p,
  #floating_pc.sougou a.entry p {
    text-align: left;
    padding-left: 12px;
  }

  #floating_pc a.search p.bold,
  #floating_pc a.entry p.bold {
    font-size: calc(24px * 0.8);
    font-weight: var(--bold);
  }

  #floating_pc.sougou a.search p.bold,
  #floating_pc.sougou a.entry p.bold {
    font-size: calc(22px * 0.8);
    font-weight: var(--bold);
  }

  #floating_pc a.search p.bold span,
  #floating_pc a.entry p.bold span {
    font-size: 24px;
  }

  #floating_pc.sougou a.search p.bold span,
  #floating_pc.sougou a.entry p.bold span {
    font-size: 22px;
  }

  #floating_pc a.search i,
  #floating_pc a.entry i {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    color: var(--bw6);
    font-size: 11px;
    text-align: center;
    border: 1px solid var(--bw6);
    border-radius: calc(22px / 2);
    width: 22px;
    height: 22px;
    top: 50%;
    right: 19px;
    transform: translateY(-50%);
  }

  #floating_pc.sougou a.search i,
  #floating_pc.sougou a.entry i {
    right: 8px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  #floating_pc {
    position: absolute;
    display: flex;
    width: calc(280vw / var(--tablet));
    height: 100%;
    top: 0;
    right: 0;
  }

  #floating_pc.sougou {
    width: calc(420vw / var(--tablet));
  }

  #floating_pc a.search,
  #floating_pc a.entry {
    flex-grow: 1;
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    width: calc(210vw / var(--tablet));
    height: 100%;
    padding: calc(19vw / var(--tablet)) 0;
    margin: 0 auto;
  }

  #floating_pc a.search {
    background: #e43b4d;
  }

  #floating_pc a.entry {
    background: var(--entry);
  }

  #floating_pc a.search p,
  #floating_pc a.entry p {
    box-sizing: border-box;
    color: var(--bw6);
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    text-align: center;
    font-weight: var(--regular);
    width: 100%;
  }

  #floating_pc.sougou a.search p,
  #floating_pc.sougou a.entry p {
    text-align: left;
    padding-left: calc(12vw / var(--tablet));
  }

  #floating_pc a.search p.bold,
  #floating_pc a.entry p.bold {
    font-size: calc((24vw * 0.8) / var(--tablet));
    font-weight: var(--bold);
  }

  #floating_pc.sougou a.search p.bold,
  #floating_pc.sougou a.entry p.bold {
    font-size: calc((22vw * 0.8) / var(--tablet));
    font-weight: var(--bold);
  }

  #floating_pc a.search p.bold span,
  #floating_pc a.entry p.bold span {
    font-size: calc(24vw / var(--tablet));
  }

  #floating_pc.sougou a.search p.bold span,
  #floating_pc.sougou a.entry p.bold span {
    font-size: calc(22vw / var(--tablet));
  }

  #floating_pc a.search i,
  #floating_pc a.entry i {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    color: var(--bw6);
    font-size: calc(11vw / var(--tablet));
    text-align: center;
    border: calc(1vw / var(--tablet)) solid var(--bw6);
    border-radius: calc((22vw / 2) / var(--tablet));
    width: calc(22vw / var(--tablet));
    height: calc(22vw / var(--tablet));
    top: 50%;
    right: calc(19vw / var(--tablet));
    transform: translateY(-50%);
  }

  #floating_pc.sougou a.search i,
  #floating_pc.sougou a.entry i {
    right: calc(8vw / var(--tablet));
  }
}

@media screen and (max-width: 767px) {
  #floating {
    position: fixed;
    z-index: 97;
    background: linear-gradient(
      to top,
      rgba(255, 255, 255, 0.8) 0%,
      rgba(255, 255, 255, 0) 100%
    );
    width: 100%;
    height: auto;
    padding: calc(20vw / var(--sp)) 0;
    bottom: 0;
  }

  #floating a.entry {
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
    background: var(--entry);
    border-radius: calc((58vw / 2) / var(--sp));
    box-shadow: 0 0 calc(10vw / var(--sp)) rgba(0, 0, 0, 0.3);
    width: calc(340vw / var(--sp));
    height: calc(58vw / var(--sp));
    padding: calc(8vw / var(--sp)) 0;
    margin: 0 auto;
  }

  #floating a.entry p {
    color: var(--bw6);
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    text-align: center;
    font-weight: var(--regular);
    width: 100%;
  }

  #floating a.entry p.bold {
    font-size: calc((24vw * 0.8) / var(--sp));
    font-weight: var(--bold);
  }

  #floating a.entry p.bold span {
    font-size: calc(24vw / var(--sp));
  }

  #floating a.entry i {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    color: var(--bw6);
    font-size: calc(11vw / var(--sp));
    text-align: center;
    border: calc(1vw / var(--sp)) solid var(--bw6);
    border-radius: calc((22vw / 2) / var(--sp));
    width: calc(22vw / var(--sp));
    height: calc(22vw / var(--sp));
    top: 50%;
    right: calc(14vw / var(--sp));
    transform: translateY(-50%);
  }
}

/************************************
footer
************************************/
@media screen and (min-width: 1366px) {
  footer {
    background: #f2f2f2;
    width: 100%;
    padding-top: 30px;
  }

  footer .recruit {
    display: block;
    box-sizing: border-box;
    width: 340px;
    margin: 0 auto 30px;
  }

  footer .recruit img {
    width: 100%;
  }

  footer .holiday_top {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    background: var(--bw6);
    color: #004ea2;
    font-size: 14px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    border: 1px solid #004ea2;
    border-radius: 10px;
    width: 275px;
    height: 40px;
    margin: 0 auto 30px;
  }

  footer .holiday_top i {
    position: absolute;
    color: #004ea2;
    font-size: 14px;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
  }

  footer .sns {
    display: flex;
    justify-content: center;
    margin: 0 auto 30px;
  }

  footer .sns table {
    display: block;
    box-sizing: content-box;
    width: 115px;
    padding: 0 25px 20px;
  }

  footer .sns table.shop {
    border-right: 1px solid #c8c8c8;
  }

  footer .sns table tbody {
    display: block;
    box-sizing: content-box;
  }

  footer .sns table tr.text {
    color: #4c4948;
    font-size: 12px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    margin-bottom: 5px;
  }

  footer .sns table.shop tr.text {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }

  footer .sns table.holiday tr.text {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  footer .sns table.shop tr.text th {
    width: 100%;
  }

  footer .sns table.holiday tr.text th {
    width: 45px;
  }

  footer .sns table tr.icon {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  footer .sns table tr.icon td {
    position: relative;
    background: var(--bw6);
    border-radius: 5px;
    width: 45px;
    height: 45px;
  }

  footer .sns table tr.icon td::after {
    position: absolute;
    display: block;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  footer .sns table tr.icon td.line::after {
    background: url("../img/common/line.svg") no-repeat;
    width: 30px;
    height: 30px;
  }

  footer .sns table tr.icon td.youtube::after {
    background: url("../img/common/youtube.svg") no-repeat;
    width: 25px;
    height: 17px;
  }

  footer .sns table tr.icon td.instagram::after,
  footer .sns table tr.icon td.hop::after {
    background: url("../img/common/instagram_c.webp") no-repeat;
    width: 25px;
    height: 25px;
    background-size: contain;
  }

  footer .sns table tr.icon td a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
  }

  footer .info {
    background: #0080cb;
    width: 100%;
    padding: 55px 0 50px;
  }

  footer .info h2 {
    width: 200px;
    margin: 0 auto 35px;
  }

  footer .info h2 img {
    width: 100%;
  }

  footer .info ul {
    display: flex;
    justify-content: center;
    margin: 0 auto 35px;
  }

  footer .info ul li {
    border-right: 1px solid var(--bw6);
    padding: 0 20px;
  }

  footer .info ul li:last-child {
    border-right: none;
  }

  footer .info ul li a {
    color: var(--bw6);
    font-size: 13px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
  }

  footer .info small {
    display: block;
    color: var(--bw6);
    font-size: 10px;
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: 100%;
  }
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
  footer {
    background: #f2f2f2;
    width: 100%;
    padding-top: calc(30vw / var(--tablet));
  }

  footer .recruit {
    display: block;
    box-sizing: border-box;
    width: calc(340vw / var(--tablet));
    margin: 0 auto calc(30vw / var(--tablet));
  }

  footer .recruit img {
    width: 100%;
  }

  footer .holiday_top {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    background: var(--bw6);
    color: #004ea2;
    font-size: calc(14vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    border: calc(1vw / var(--tablet)) solid #004ea2;
    border-radius: calc(10vw / var(--tablet));
    width: calc(275vw / var(--tablet));
    height: calc(40vw / var(--tablet));
    margin: 0 auto calc(30vw / var(--tablet));
  }

  footer .holiday_top i {
    position: absolute;
    color: #004ea2;
    font-size: calc(14vw / var(--tablet));
    top: 50%;
    right: calc(10vw / var(--tablet));
    transform: translateY(-50%);
  }

  footer .sns {
    display: flex;
    justify-content: center;
    margin: 0 auto calc(30vw / var(--tablet));
  }

  footer .sns table {
    display: block;
    box-sizing: content-box;
    width: calc(115vw / var(--tablet));
    padding: 0 calc(25vw / var(--tablet)) calc(20vw / var(--tablet));
  }

  footer .sns table.shop {
    border-right: calc(1vw / var(--tablet)) solid #c8c8c8;
  }

  footer .sns table tbody {
    display: block;
    box-sizing: content-box;
  }

  footer .sns table tr.text {
    color: #4c4948;
    font-size: calc(12vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    margin-bottom: calc(5vw / var(--tablet));
  }

  footer .sns table.shop tr.text {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }

  footer .sns table.holiday tr.text {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  footer .sns table.shop tr.text th {
    width: 100%;
  }

  footer .sns table.holiday tr.text th {
    width: calc(45vw / var(--tablet));
  }

  footer .sns table tr.icon {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  footer .sns table tr.icon td {
    position: relative;
    background: var(--bw6);
    border-radius: calc(5vw / var(--tablet));
    width: calc(45vw / var(--tablet));
    height: calc(45vw / var(--tablet));
  }

  footer .sns table tr.icon td::after {
    position: absolute;
    display: block;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  footer .sns table tr.icon td.line::after {
    background: url("../img/common/line.svg") no-repeat;
    width: calc(30vw / var(--tablet));
    height: calc(30vw / var(--tablet));
  }

  footer .sns table tr.icon td.youtube::after {
    background: url("../img/common/youtube.svg") no-repeat;
    width: calc(25vw / var(--tablet));
    height: calc(17vw / var(--tablet));
  }

  footer .sns table tr.icon td.instagram::after,
  footer .sns table tr.icon td.hop::after {
    background: url("../img/common/instagram_c.webp") no-repeat;
    width: calc(25vw / var(--tablet));
    height: calc(25vw / var(--tablet));
    background-size: contain;
  }

  footer .sns table tr.icon td a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
  }

  footer .info {
    background: #0080cb;
    width: 100%;
    padding: calc(55vw / var(--tablet)) 0 calc(50vw / var(--tablet));
  }

  footer .info h2 {
    width: calc(200vw / var(--tablet));
    margin: 0 auto calc(35vw / var(--tablet));
  }

  footer .info h2 img {
    width: 100%;
  }

  footer .info ul {
    display: flex;
    justify-content: center;
    margin: 0 auto calc(35vw / var(--tablet));
  }

  footer .info ul li {
    border-right: calc(1vw / var(--tablet)) solid var(--bw6);
    padding: 0 calc(20vw / var(--tablet));
  }

  footer .info ul li:last-child {
    border-right: none;
  }

  footer .info ul li a {
    color: var(--bw6);
    font-size: calc(13vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
  }

  footer .info small {
    display: block;
    color: var(--bw6);
    font-size: calc(10vw / var(--tablet));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  footer {
    background: #f2f2f2;
    width: 100%;
    padding-top: calc(30vw / var(--sp));
  }

  footer .recruit {
    display: block;
    box-sizing: border-box;
    width: calc(340vw / var(--sp));
    margin: 0 auto calc(30vw / var(--sp));
  }

  footer .recruit img {
    width: 100%;
  }

  footer .holiday_top {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    background: var(--bw6);
    color: #004ea2;
    font-size: calc(14vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    border: calc(1vw / var(--sp)) solid #004ea2;
    border-radius: calc(10vw / var(--sp));
    width: calc(275vw / var(--sp));
    height: calc(40vw / var(--sp));
    margin: 0 auto calc(30vw / var(--sp));
  }

  footer .holiday_top i {
    position: absolute;
    color: #004ea2;
    font-size: calc(14vw / var(--sp));
    top: 50%;
    right: calc(10vw / var(--sp));
    transform: translateY(-50%);
  }

  footer .sns {
    display: flex;
    justify-content: center;
    margin: 0 auto calc(30vw / var(--sp));
  }

  footer .sns table {
    display: block;
    box-sizing: content-box;
    width: calc(115vw / var(--sp));
    padding: 0 calc(25vw / var(--sp)) calc(20vw / var(--sp));
  }

  footer .sns table.shop {
    border-right: calc(1vw / var(--sp)) solid #c8c8c8;
  }

  footer .sns table tbody {
    display: block;
    box-sizing: content-box;
  }

  footer .sns table tr.text {
    color: #4c4948;
    font-size: calc(12vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    margin-bottom: calc(5vw / var(--sp));
  }

  footer .sns table.shop tr.text {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }

  footer .sns table.holiday tr.text {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  footer .sns table.shop tr.text th {
    width: 100%;
  }

  footer .sns table.holiday tr.text th {
    width: calc(45vw / var(--sp));
  }

  footer .sns table tr.icon {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  footer .sns table tr.icon td {
    position: relative;
    background: var(--bw6);
    border-radius: calc(5vw / var(--sp));
    width: calc(45vw / var(--sp));
    height: calc(45vw / var(--sp));
  }

  footer .sns table tr.icon td::after {
    position: absolute;
    display: block;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  footer .sns table tr.icon td.line::after {
    background: url("../img/common/line.svg") no-repeat;
    width: calc(30vw / var(--sp));
    height: calc(30vw / var(--sp));
  }

  footer .sns table tr.icon td.youtube::after {
    background: url("../img/common/youtube.svg") no-repeat;
    width: calc(25vw / var(--sp));
    height: calc(17vw / var(--sp));
  }

  footer .sns table tr.icon td.instagram::after,
  footer .sns table tr.icon td.hop::after {
    background: url("../img/common/instagram_c.webp") no-repeat;
    width: calc(25vw / var(--sp));
    height: calc(25vw / var(--sp));
    background-size: contain;
  }

  footer .sns table tr.icon td a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
  }

  footer .info {
    background: #0080cb;
    width: 100%;
    padding: calc(55vw / var(--sp)) 0 calc((50vw + 90vw) / var(--sp));
  }

  footer .info h2 {
    width: calc(200vw / var(--sp));
    margin: 0 auto calc(35vw / var(--sp));
  }

  footer .info h2 img {
    width: 100%;
  }

  footer .info ul {
    display: flex;
    justify-content: center;
    margin: 0 auto calc(35vw / var(--sp));
  }

  footer .info ul li {
    border-right: calc(1vw / var(--sp)) solid var(--bw6);
    padding: 0 calc(20vw / var(--sp));
  }

  footer .info ul li:last-child {
    border-right: none;
  }

  footer .info ul li a {
    color: var(--bw6);
    font-size: calc(13vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
  }

  footer .info small {
    display: block;
    color: var(--bw6);
    font-size: calc(10vw / var(--sp));
    line-height: 1em;
    font-weight: var(--regular);
    text-align: center;
    width: 100%;
  }
}