@charset "UTF-8";
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, main {
  display: block;
}

ol, ul {
  list-style: none;
}

html {
  font-size: 62.5%;
  scroll-padding-top: 8rem;
}
@media screen and (max-width: 767px) {
  html {
    scroll-padding-top: 12.4rem;
  }
}

body {
  padding-top: 6rem;
  font-family: "GenJyuuGothic", sans-serif;
  font-size: 1.4rem;
  font-weight: 500;
  color: #333;
  line-height: 1.5;
  overflow-x: hidden;
}
@media screen and (max-width: 767px) {
  body {
    padding-top: 10.4rem;
  }
}
@media print {
  body {
    zoom: 0.8;
  }
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  padding: 0;
  border: none;
  background: none;
  font: inherit;
  color: inherit;
  cursor: pointer;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

em,
i {
  font-style: normal;
}

.container {
  width: 100%;
  max-width: 107rem;
  margin: 0 auto;
  padding: 0 2rem;
}
@media screen and (max-width: 767px) {
  .container {
    padding: 0 2.5rem;
  }
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0 0 0 0);
  overflow: hidden;
  white-space: nowrap;
}

.d-inline-block {
  display: inline-block;
}

br.pc {
  display: none;
}
@media screen and (max-width: 1500px) {
  br.pc {
    display: block;
  }
}
br.xl {
  display: none;
}
@media screen and (max-width: 1300px) {
  br.xl {
    display: block;
  }
}
br.lg {
  display: none;
}
@media screen and (max-width: 991px) {
  br.lg {
    display: block;
  }
}
br.md {
  display: none;
}
@media screen and (max-width: 767px) {
  br.md {
    display: block;
  }
}
br.sm {
  display: none;
}
@media screen and (max-width: 574px) {
  br.sm {
    display: block;
  }
}
br.xs {
  display: none;
}
@media screen and (max-width: 389px) {
  br.xs {
    display: block;
  }
}

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

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

.marker {
  background: linear-gradient(transparent 50%, #FFE100 50%);
}

.header {
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 6rem;
  padding-left: 2rem;
  background: #fff;
  z-index: 100;
}
@media screen and (max-width: 767px) {
  .header {
    flex-wrap: wrap;
    height: 10.4rem;
    padding-left: 1.5rem;
  }
}
.header_logo {
  flex: none;
  width: 13rem;
}
@media screen and (max-width: 767px) {
  .header_logo {
    display: flex;
    align-items: center;
    width: 11.5rem;
    height: 4.6rem;
  }
}
.header_logo img {
  width: 12.5rem;
}
@media screen and (max-width: 767px) {
  .header_logo img {
    width: 11rem;
  }
}
.header_nav ul {
  display: flex;
  gap: 2rem;
}
@media screen and (max-width: 991px) {
  .header_nav ul {
    gap: 1.2rem;
  }
}
@media screen and (max-width: 767px) {
  .header_nav ul {
    justify-content: space-between;
    gap: 0;
    padding: 0 1.6rem 0 1.5rem;
  }
}
@media screen and (max-width: 767px) {
  .header_nav {
    order: 3;
    width: calc(100% + 1.5rem);
    margin-left: -1.5rem;
    background: #A082E6;
  }
}
.header_nav-btn {
  position: relative;
  display: flex;
  align-items: center;
  height: 6rem;
  font-size: 1.4rem;
  font-weight: 700;
  white-space: nowrap;
}
.header_nav-btn::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 1.2rem;
  width: 100%;
  height: 2px;
  background: #A082E6;
  transform: scaleX(0);
  transition: transform 0.3s;
}
.is-open > .header_nav-btn::after {
  transform: scaleX(1);
}
.header_nav-btn .icon {
  display: none;
}
@media screen and (max-width: 767px) {
  .header_nav-btn {
    flex-direction: column;
    justify-content: center;
    gap: 0.5rem;
    width: 6.8rem;
    height: 5rem;
    margin-top: 0.8rem;
    border-radius: 0.5rem 0.5rem 0 0;
    font-size: 1.1rem;
    color: #fff;
    transition: background 0.3s, color 0.3s;
  }
  .header_nav-btn::after {
    display: none;
  }
  .header_nav-btn .icon {
    display: block;
    width: 2.1rem;
    height: 2.1rem;
    background: currentColor;
    mask: no-repeat center/contain;
  }
  .header_nav-btn .icon.service {
    mask-image: url(../img/common/nav_service.svg);
  }
  .header_nav-btn .icon.procedure {
    mask-image: url(../img/common/nav_procedure.svg);
  }
  .header_nav-btn .icon.price {
    mask-image: url(../img/common/nav_price.svg);
  }
  .header_nav-btn .icon.news {
    mask-image: url(../img/common/nav_news.svg);
  }
  .header_nav-btn .icon.support {
    mask-image: url(../img/common/nav_support.svg);
  }
  .is-open > .header_nav-btn {
    background: #ECE6FA;
    color: #A082E6;
  }
}
.header_cta {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .header_cta {
    gap: 0.5rem;
    padding-right: 1.5rem;
  }
}
.header_tel {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  padding: 0 0.8rem;
}
@media screen and (max-width: 767px) {
  .header_tel {
    justify-content: center;
    align-items: center;
    width: 2.4rem;
    height: 2.4rem;
    margin-right: 0.2rem;
    padding: 0;
    border: 1px solid #333;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0.2rem 0.2rem 0 -1px #FF3250, 0.2rem 0.2rem 0 0 #333;
  }
}
.header_tel-num {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.2rem;
  padding: 0.2rem 0.4rem;
  border-radius: 1rem;
  background: #FF3250;
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
}
.header_tel-num img {
  width: 1rem;
}
@media screen and (max-width: 767px) {
  .header_tel-num {
    padding: 0;
    background: none;
    font-size: 0;
  }
  .header_tel-num img {
    width: 1.3rem;
  }
}
.header_tel-text {
  font-size: 1.1rem;
  font-weight: 700;
  color: #FF3250;
  text-align: center;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  .header_tel-text {
    display: none;
  }
}
.header_line, .header_apply {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.3rem;
  width: 7.5rem;
  height: 6rem;
  font-size: 1.1rem;
  font-weight: 700;
  color: #fff;
  transition: background 0.3s, color 0.3s, box-shadow 0.3s;
}
.header_line .hover_icon, .header_apply .hover_icon {
  display: none;
}
@media (hover: hover) and (min-width: 992px) {
  .header_line:hover, .header_apply:hover {
    background: #fff;
  }
  .header_line:hover picture, .header_apply:hover picture {
    display: none;
  }
  .header_line:hover .hover_icon, .header_apply:hover .hover_icon {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .header_line, .header_apply {
    flex-direction: row;
    gap: 0.3rem;
    height: 2.4rem;
    border: 1px solid #333;
    border-radius: 10rem;
  }
}
.header_line {
  background: #06C755;
}
.header_line img {
  width: 1.6rem;
}
@media (hover: hover) and (min-width: 992px) {
  .header_line:hover {
    color: #06C755;
    box-shadow: inset 0 0 0 2px #06C755;
  }
}
@media screen and (max-width: 767px) {
  .header_line {
    width: 7.1rem;
    margin-right: 0.2rem;
    background: #fff;
    color: #333;
    box-shadow: 0.2rem 0.2rem 0 -1px #06C755, 0.2rem 0.2rem 0 0 #333;
  }
  .header_line img {
    width: 1.7rem;
  }
}
.header_apply {
  gap: 0.4rem;
  background: #FF3250;
}
.header_apply img {
  width: 1.8rem;
}
@media (hover: hover) and (min-width: 992px) {
  .header_apply:hover {
    color: #FF3250;
    box-shadow: inset 0 0 0 2px #FF3250;
  }
}
@media screen and (max-width: 767px) {
  .header_apply {
    width: 8.8rem;
    gap: 0.8rem;
    box-shadow: 0.2rem 0.2rem 0 -1px #fff, 0.2rem 0.2rem 0 0 #333;
  }
  .header_apply img {
    width: 1.6rem;
  }
}

.menu {
  position: absolute;
  top: 6rem;
  left: 0;
  width: 100%;
  padding: 4rem 2rem;
  background: #fff;
  box-shadow: 0 1rem 1.6rem rgba(0, 0, 0, 0.08);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
}
.is-open > .menu {
  opacity: 1;
  visibility: visible;
}
@media screen and (max-width: 767px) {
  .menu {
    position: fixed;
    top: 10.4rem;
    max-height: calc(100dvh - 10.4rem);
    padding: 2.4rem 2.5rem;
    overflow-y: auto;
    box-shadow: 0 1rem 1.6rem rgba(0, 0, 0, 0.15);
  }
}
.menu_inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
  width: 70rem;
  max-width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .menu_inner {
    gap: 1.6rem;
    width: 100%;
  }
}
.menu_inner.news {
  width: 103rem;
  gap: 0;
}
.menu_grid {
  display: flex;
  gap: 2rem;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .menu_grid {
    flex-direction: column;
    gap: 1.6rem;
  }
}
.menu_grid + .menu_wide {
  margin-top: 2rem;
}
@media screen and (max-width: 767px) {
  .menu_grid + .menu_wide {
    margin-top: 0;
  }
}
.menu_col {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  width: 34rem;
}
@media screen and (max-width: 767px) {
  .menu_col {
    gap: 1.6rem;
    width: 100%;
  }
}
.menu_big {
  position: relative;
  display: flex;
  align-items: center;
  gap: 1.6rem;
  width: 100%;
  height: 10rem;
  padding: 0 1.6rem;
  border-radius: 0.5rem;
  background: #A082E6;
  color: #fff;
  transition: opacity 0.3s;
}
.menu_big::after {
  content: "";
  position: absolute;
  right: 0.6rem;
  bottom: 0.6rem;
  width: 1.36rem;
  height: 1.36rem;
  background: url(../img/menu/corner_white.svg) no-repeat center/contain;
}
@media (hover: hover) and (min-width: 992px) {
  .menu_big:hover {
    opacity: 0.85;
  }
}
.menu_big.full {
  width: 70rem;
  max-width: 100%;
}
@media screen and (max-width: 767px) {
  .menu_big.full {
    width: 100%;
  }
}
.menu_big-icon {
  display: flex;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 8rem;
  height: 8rem;
}
.menu_big-icon img {
  max-width: 7.8rem;
  max-height: 7.2rem;
}
.menu_big-text {
  display: flex;
  flex-direction: column;
  font-size: 1.8rem;
  font-weight: 900;
  line-height: 1.5;
}
.menu_big-text small {
  font-size: 1.2rem;
  font-weight: 700;
}
.menu_smalls {
  display: grid;
  grid-template-columns: repeat(2, 16rem);
  align-content: start;
  gap: 2rem;
}
@media screen and (max-width: 767px) {
  .menu_smalls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.6rem;
    width: 100%;
  }
}
.menu_smalls.four {
  grid-template-columns: repeat(4, 16rem);
}
@media screen and (max-width: 767px) {
  .menu_smalls.four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.menu_small {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
  height: 10rem;
  border: 2px solid #A082E6;
  border-radius: 0.5rem;
  background: #fff;
  transition: background 0.3s;
}
.menu_small::after {
  content: "";
  position: absolute;
  right: 0.6rem;
  bottom: 0.6rem;
  width: 1.36rem;
  height: 1.36rem;
  background: url(../img/menu/corner_purple.svg) no-repeat center/contain;
}
@media (hover: hover) and (min-width: 992px) {
  .menu_small:hover {
    background: #F6F2FF;
  }
}
.menu_small.long {
  background: #ECE6FA;
}
.menu_small.travel {
  border-color: #FFE100;
  background: #FFFADC;
}
.menu_small.travel::after {
  background-image: url(../img/menu/corner_yellow.svg);
}
.menu_small-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 3rem;
  height: 3rem;
}
.menu_small-icon img {
  max-width: 100%;
  max-height: 100%;
}
.menu_small-text {
  display: flex;
  align-items: center;
  min-height: 3.4rem;
  font-size: 1.4rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.7rem;
}
.menu_wide {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 5rem;
  padding: 0 1.6rem;
  border: 2px solid #A082E6;
  border-radius: 0.5rem;
  background: #fff;
  font-size: 1.6rem;
  font-weight: 700;
  transition: background 0.3s;
}
.menu_wide::after {
  content: "";
  position: absolute;
  right: 0.6rem;
  bottom: 0.6rem;
  width: 1.36rem;
  height: 1.36rem;
  background: url(../img/menu/corner_purple.svg) no-repeat center/contain;
}
@media (hover: hover) and (min-width: 992px) {
  .menu_wide:hover {
    background: #F6F2FF;
  }
}
.menu_wide-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 6rem;
}
.menu_wide-icon img {
  max-height: 2.4rem;
}
.menu_blog {
  display: flex;
  gap: 2rem;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .menu_blog {
    display: contents;
  }
}
.menu_blog-item {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  gap: 0.8rem;
  border-radius: 0.5rem;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
@media screen and (max-width: 767px) {
  .menu_blog-item {
    width: 100%;
    margin-bottom: 1.6rem;
  }
  .menu_blog-item:nth-child(1) {
    order: 1;
  }
  .menu_blog-item:nth-child(2) {
    order: 2;
  }
  .menu_blog-item:nth-child(3) {
    order: 4;
  }
}
.menu_blog-item h4 {
  display: flex;
  align-items: center;
  gap: 3.3rem;
  width: 30rem;
  font-size: 1.6rem;
  font-weight: 700;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  .menu_blog-item h4 {
    width: 100%;
  }
}
.menu_blog-item h4::before, .menu_blog-item h4::after {
  content: "";
  flex: 1;
  height: 2px;
  background: #A082E6;
}
.menu_blog-item img {
  width: 27.6rem;
  aspect-ratio: 276/156;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .menu_blog-item img {
    width: 100%;
  }
}
.menu_blog-item .date,
.menu_blog-item .title {
  width: 27.6rem;
}
@media screen and (max-width: 767px) {
  .menu_blog-item .date,
  .menu_blog-item .title {
    width: 100%;
  }
}
.menu_blog-item .title {
  margin-top: -0.8rem;
  font-size: 1.6rem;
}
.menu_blog-item .title::after {
  content: "";
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  margin-left: 0.4rem;
  background: url(../img/common/icon_external_dark.svg) no-repeat center/contain;
  vertical-align: -0.2rem;
}
@media (hover: hover) and (min-width: 992px) {
  .menu_blog-item:hover {
    transform: translateY(-0.2rem);
    box-shadow: 0 0.8rem 1.6rem rgba(0, 0, 0, 0.15);
  }
}
.menu_blog-links {
  display: flex;
  gap: 2rem;
  width: 100%;
  margin-top: 3.6rem;
}
@media screen and (max-width: 767px) {
  .menu_blog-links {
    display: contents;
  }
}
.menu_blog-links .articles {
  flex: 680;
}
@media screen and (max-width: 767px) {
  .menu_blog-links .articles {
    flex: none;
    order: 3;
    margin-bottom: 2.4rem;
  }
}
.menu_blog-links .latest {
  flex: 330;
}
@media screen and (max-width: 767px) {
  .menu_blog-links .latest {
    flex: none;
    order: 5;
  }
}
.menu_sns {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6.1rem;
  margin-top: 4rem;
}
@media screen and (max-width: 767px) {
  .menu_sns {
    order: 6;
    justify-content: space-between;
    gap: 0;
    width: 100%;
    margin-top: 1.6rem;
    padding: 0 1rem;
  }
}
.menu_sns a {
  display: block;
  transition: opacity 0.3s;
}
@media (hover: hover) and (min-width: 992px) {
  .menu_sns a:hover {
    opacity: 0.7;
  }
}
.menu_sns img {
  width: auto;
  height: 3rem;
}
.menu_close {
  display: none;
}
@media screen and (max-width: 767px) {
  .menu_close {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.8rem;
    width: 8rem;
    height: 2.4rem;
    margin: 1.6rem auto 0;
    border-radius: 10rem;
    background: #A082E6;
    font-size: 1.2rem;
    font-weight: 700;
    color: #fff;
  }
  .menu_close img {
    width: 1rem;
  }
}

.apply_modal {
  position: fixed;
  top: 6rem;
  left: 0;
  width: 100%;
  height: calc(100% - 6rem);
  background: rgba(0, 0, 0, 0.3);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
  z-index: 110;
}
.apply_modal.is-open {
  opacity: 1;
  visibility: visible;
}
@media screen and (max-width: 767px) {
  .apply_modal {
    top: 0;
    height: 100%;
  }
}
.apply_modal-inner {
  position: absolute;
  top: 2rem;
  right: 1.4rem;
  display: flex;
  gap: 0.8rem;
  padding: 1.6rem;
  border-radius: 1rem;
  background: #fff;
}
.apply_modal-inner::before {
  content: "";
  position: absolute;
  bottom: 100%;
  right: 2.7rem;
  border: 0 solid transparent;
  border-width: 0 1.05rem 1.6rem;
  border-bottom-color: #fff;
}
@media screen and (max-width: 767px) {
  .apply_modal-inner {
    top: 50%;
    left: 50%;
    right: auto;
    gap: 1.6rem;
    padding: 3.2rem;
    transform: translate(-50%, -50%);
  }
  .apply_modal-inner::before {
    display: none;
  }
}
.apply_modal-btn {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.4rem;
  width: 9.5rem;
  padding: 1rem 0;
  border: 2px solid #A082E6;
  border-radius: 0.5rem;
  font-size: 1.1rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.3;
  transition: background 0.3s;
}
@media screen and (max-width: 767px) {
  .apply_modal-btn {
    gap: 0.8rem;
    width: 12rem;
    height: 10rem;
    padding: 0;
    font-size: 1.4rem;
  }
}
.apply_modal-btn img {
  width: 1.5rem;
}
@media screen and (max-width: 767px) {
  .apply_modal-btn img {
    width: 2.4rem;
  }
}
.apply_modal-btn b {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 1.3rem;
}
@media screen and (max-width: 767px) {
  .apply_modal-btn b {
    font-size: 1.6rem;
  }
}
.apply_modal-btn.travel {
  border-color: #FFE100;
}
@media (hover: hover) and (min-width: 992px) {
  .apply_modal-btn:hover {
    background: #ECE6FA;
  }
}
@media (hover: hover) and (min-width: 992px) {
  .apply_modal-btn.travel:hover {
    background: #FFF9CC;
  }
}

.friend {
  --u: 1.2167px;
  width: calc(var(--u) * 300);
  padding-bottom: calc(var(--u) * 10);
  border: calc(var(--u) * 1.5) solid #333;
  border-radius: calc(var(--u) * 8);
  background: #fff;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .friend {
    --u: 1px;
  }
}
.friend_ttl {
  display: flex;
  justify-content: center;
  align-items: center;
  height: calc(var(--u) * 21.5);
  background: #06C755;
  font-size: calc(var(--u) * 12.4);
  font-weight: 900;
  color: #fff;
  line-height: 1;
}
.friend_body {
  display: flex;
  justify-content: center;
  gap: calc(var(--u) * 13.5);
  padding-top: calc(var(--u) * 8.5);
}
.friend_item {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: calc(var(--u) * 97.7);
}
.friend_label {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: calc(var(--u) * 16.7);
  border-radius: 10rem;
  background: #06C755;
  font-size: calc(var(--u) * 9.9);
  font-weight: 700;
  color: #fff;
  line-height: 1;
  white-space: nowrap;
}
.friend_label::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  width: calc(var(--u) * 6.3);
  height: calc(var(--u) * 4.2);
  margin-top: -1px;
  background: url(../img/common/friend_pointer.svg) no-repeat center/100% 100%;
  transform: translateX(-50%) rotate(180deg);
}
.friend_qr {
  width: calc(var(--u) * 64.9);
  margin-top: calc(var(--u) * 8.6);
  padding: calc(var(--u) * 2.1);
  border: 1px solid #06C755;
  border-radius: calc(var(--u) * 6);
}
.friend_or {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(var(--u) * 24.4);
  height: calc(var(--u) * 19.1);
  margin-top: calc(var(--u) * 39);
  padding-bottom: calc(var(--u) * 3);
  background: url(../img/common/friend_or.svg) no-repeat center/100% 100%;
  font-size: calc(var(--u) * 9.5);
  font-weight: 700;
  color: #fff;
  line-height: 1;
}
.friend_btn {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: calc(var(--u) * 2.5);
  width: calc(var(--u) * 61.6);
  height: calc(var(--u) * 49.3);
  margin-top: calc(var(--u) * 15.6);
  background: #06C755;
  font-size: calc(var(--u) * 9);
  font-weight: 700;
  color: #fff;
  line-height: 1;
}
.friend_btn img {
  width: calc(var(--u) * 13.3);
}
@media screen and (max-width: 767px) {
  .friend_btn {
    display: none;
  }
}
.friend_pill {
  display: none;
}
@media screen and (max-width: 767px) {
  .friend_pill {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: calc(var(--u) * 3);
    width: calc(var(--u) * 69.2);
    height: calc(var(--u) * 23.4);
    margin-top: calc(var(--u) * 28);
    border: 1px solid #333;
    border-radius: 10rem;
    background: #fff;
    box-shadow: calc(var(--u) * 2) calc(var(--u) * 2) 0 -1px #06C755, calc(var(--u) * 2) calc(var(--u) * 2) 0 0 #333;
    font-size: calc(var(--u) * 10.7);
    font-weight: 700;
    line-height: 1;
  }
  .friend_pill img {
    width: calc(var(--u) * 16.6);
  }
}
.friend.large {
  --u: 1px;
  width: 52.1rem;
  padding-bottom: 2.15rem;
  border: 0.24rem solid #fff;
  border-radius: 1rem;
}
@media screen and (max-width: 991px) {
  .friend.large {
    width: 100%;
  }
}
.friend.large .friend_ttl {
  height: 5.3rem;
  font-size: 2.18rem;
}
.friend.large .friend_body {
  gap: 2.35rem;
  padding-top: 2rem;
}
.friend.large .friend_item {
  width: 16.96rem;
}
.friend.large .friend_label {
  height: 2.91rem;
  border-radius: 1rem;
  font-size: 1.7rem;
}
.friend.large .friend_label::after {
  width: 1.09rem;
  height: 0.73rem;
}
.friend.large .friend_qr {
  width: 11.39rem;
  margin-top: 1.5rem;
  padding: 0;
  border-width: 0.12rem;
  border-radius: 1rem;
}
.friend.large .friend_or {
  width: 4.24rem;
  height: 3.33rem;
  margin-top: 6.8rem;
  padding-bottom: 0.5rem;
  font-size: 1.7rem;
}
.friend.large .friend_btn {
  display: flex;
  gap: 0.4rem;
  width: 10rem;
  height: 8rem;
  margin-top: 3.2rem;
  font-size: 1.47rem;
}
.friend.large .friend_btn img {
  width: 2.16rem;
}
.friend.large .friend_pill {
  display: none;
}

.ttl {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
  width: 100%;
  max-width: 70rem;
  margin: 0 auto;
}
.ttl_icon {
  width: 3rem;
  margin: 0 0 -0.2rem 9.7rem;
}
.ttl_en {
  display: flex;
  align-items: center;
  width: 100%;
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 2.5rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.36;
  white-space: nowrap;
}
.ttl_en::before, .ttl_en::after {
  content: "";
  flex: 1;
  height: 2px;
  background: #333;
}
.ttl_en::before {
  margin-right: 3.5rem;
}
.ttl_en::after {
  margin-left: 3.5rem;
}
@media screen and (max-width: 767px) {
  .ttl_en::before {
    margin-right: 2rem;
  }
  .ttl_en::after {
    margin-left: 2rem;
  }
}
.ttl h2,
.ttl h3 {
  font-size: 1.4rem;
  font-weight: 500;
  text-align: center;
}
.ttl.white {
  color: #fff;
}
.ttl.white .ttl_en::before, .ttl.white .ttl_en::after {
  background: #fff;
}

.badge {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 6rem;
  height: 6rem;
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-weight: 700;
  color: #fff;
  line-height: 1;
}
.badge::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 5.3rem;
  height: 5rem;
  background: url(../img/common/badge_point.svg) no-repeat center/contain;
  transform: translate(-50%, -50%) rotate(17deg);
}
.badge.step::before {
  background-image: url(../img/common/badge_step.svg);
}
.badge_label {
  position: relative;
  font-size: 1.05rem;
}
.large .badge_label {
  font-size: 1.13rem;
}
.xl .badge_label {
  font-size: 1.3rem;
}
.badge_num {
  position: relative;
  margin-top: 0.1rem;
  font-size: 2.52rem;
}
.large .badge_num {
  font-size: 2.72rem;
}
.xl .badge_num {
  font-size: 3.3rem;
}
.badge.large {
  width: 6.5rem;
  height: 6.5rem;
}
.badge.large::before {
  width: 5.74rem;
  height: 5.42rem;
}
.badge.xl {
  width: 7.6rem;
  height: 7.7rem;
}
.badge.xl::before {
  width: 6.05rem;
  height: 5.71rem;
}

.apply_pull {
  position: relative;
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
  z-index: 30;
}
.apply_pull::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s, visibility 0.3s;
}
.apply_pull-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 50%;
  z-index: 20;
  padding-top: 2.6rem;
  opacity: 0;
  visibility: hidden;
  transform: translateX(-50%);
  transition: opacity 0.3s, visibility 0.3s;
}
@media (hover: hover) and (min-width: 992px) {
  .apply_pull-menu {
    display: block;
  }
}
.apply_pull-menu .apply_modal-inner {
  position: relative;
  top: auto;
  right: auto;
  box-shadow: 0 0.6rem 1.6rem rgba(0, 0, 0, 0.12);
}
.apply_pull:focus-within .apply_pull-menu {
  opacity: 1;
  visibility: visible;
}
@media (hover: hover) and (min-width: 992px) {
  .apply_pull:hover .apply_pull-menu {
    opacity: 1;
    visibility: visible;
  }
}
@media (hover: hover) and (min-width: 992px) {
  .apply_pull:hover::before, .apply_pull:focus-within::before {
    opacity: 1;
    visibility: visible;
  }
}

.warp_note {
  padding: 0.8rem 1.6rem;
  border-radius: 1rem;
  background: #FF3250;
  font-size: 1.2rem;
  font-weight: 700;
  color: #fff;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .warp_note {
    padding: 1.6rem;
  }
}
.warp_note[hidden] {
  display: none;
}
.warp_note b {
  display: block;
  font-size: 1.4rem;
}
@media screen and (max-width: 767px) {
  .warp_note b {
    margin-bottom: 0.8rem;
    font-size: 1.6rem;
  }
}

.btn {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 28.2rem;
  max-width: calc(100% - 0.2rem);
  height: 4.8rem;
  margin: 0 auto 0.8rem;
  border: 2px solid #333;
  border-radius: 2.5rem;
  background: #fff;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0.2rem 0.5rem 0 -2px #FF3250, 0.2rem 0.5rem 0 0 #333;
  transition: transform 0.2s, box-shadow 0.2s;
}
.btn::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 1.9rem;
  width: 0.7rem;
  height: 1.2rem;
  background: url(../img/common/btn_arrow.svg) no-repeat center/contain;
  transform: translateY(-50%);
}
@media (hover: hover) and (min-width: 992px) {
  .btn:hover {
    transform: translate(0.2rem, 0.5rem);
    box-shadow: 0 0 0 -2px #FF3250, 0 0 0 0 #333;
  }
}
.btn.green {
  box-shadow: 0.2rem 0.5rem 0 -2px #06C755, 0.2rem 0.5rem 0 0 #333;
}
@media (hover: hover) and (min-width: 992px) {
  .btn.green:hover {
    box-shadow: 0 0 0 -2px #06C755, 0 0 0 0 #333;
  }
}
.btn.red {
  border-color: #000;
  background: #FF3250;
  color: #fff;
  box-shadow: 0.2rem 0.5rem 0 -2px #fff, 0.2rem 0.5rem 0 0 #000;
}
.btn.red::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 1rem;
  width: 3.2rem;
  height: 3.2rem;
  background: url(../img/common/icon_apply.svg) no-repeat center/2.95rem auto;
  transform: translateY(-50%);
}
.btn.red::after {
  background-image: url(../img/common/btn_arrow_white.svg);
}
@media (hover: hover) and (min-width: 992px) {
  .btn.red:hover {
    box-shadow: 0 0 0 -2px #fff, 0 0 0 0 #000;
  }
}

.cta {
  display: flex;
  justify-content: center;
}

.footer {
  position: relative;
  margin-top: 14.4rem;
  padding-top: 2.5rem;
}
@media screen and (max-width: 767px) {
  .footer {
    margin-top: 8rem;
  }
}
.footer::before {
  content: "";
  position: absolute;
  top: 2.5rem;
  left: 0;
  width: 100%;
  height: calc(100% - 2.5rem);
  background: #EDEDED;
  z-index: -1;
}
.footer_pagetop {
  position: absolute;
  top: 0;
  left: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.2rem;
  transform: translateX(-50%);
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 1.4rem;
  font-weight: 500;
  white-space: nowrap;
}
.footer_pagetop img {
  width: 5rem;
  transition: transform 0.3s;
}
@media (hover: hover) and (min-width: 992px) {
  .footer_pagetop:hover img {
    transform: translateY(-0.4rem);
  }
}
.footer_blog {
  display: flex;
  justify-content: space-between;
  max-width: 103rem;
  margin: 9.1rem auto 0;
}
@media screen and (max-width: 991px) {
  .footer_blog {
    gap: 2rem;
    padding: 0 2rem;
  }
}
@media screen and (max-width: 767px) {
  .footer_blog {
    flex-direction: column;
    gap: 5.8rem;
    margin-top: 8.6rem;
    padding: 0 3.5rem;
  }
}
.footer_blog-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 33rem;
  min-height: 41.5rem;
  padding: 2.4rem 2.7rem 3rem;
  border-radius: 1rem;
  background: #fff;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
@media screen and (max-width: 767px) {
  .footer_blog-item {
    width: 100%;
    min-height: 0;
    padding: 2.4rem 2.2rem;
  }
}
.footer_blog-item h3 {
  width: 100%;
  padding-bottom: 0.8rem;
  border-bottom: 1px solid #EDEDED;
  font-size: 2rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
}
.footer_blog-item img {
  width: 100%;
  aspect-ratio: 276/156;
  margin-top: 1.6rem;
  object-fit: cover;
}
.footer_blog-item .date {
  width: 100%;
  margin-top: 1.6rem;
}
.footer_blog-item .title {
  width: 100%;
  font-size: 1.6rem;
}
@media screen and (max-width: 767px) {
  .footer_blog-item .title {
    text-decoration: underline;
    text-underline-offset: 0.3rem;
  }
}
.footer_blog-item .title::after {
  content: "";
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  margin-left: 0.4rem;
  background: url(../img/common/icon_external_dark.svg) no-repeat center/contain;
  vertical-align: -0.2rem;
}
@media (hover: hover) and (min-width: 992px) {
  .footer_blog-item:hover {
    transform: translateY(-0.2rem);
    box-shadow: 0 0.8rem 1.6rem rgba(0, 0, 0, 0.15);
  }
}
.footer_info {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 3.5rem;
}
@media screen and (max-width: 767px) {
  .footer_info {
    margin-top: 5.4rem;
  }
}
.footer_info {
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.5;
}
.footer_logo {
  width: 22.1rem;
  margin-bottom: 1.2rem;
}
@media screen and (max-width: 767px) {
  .footer_logo {
    width: 21.9rem;
    margin: 0.1rem 0 1.1rem;
  }
}
.footer_tel {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-top: 0.4rem;
}
.footer_tel img {
  width: 1.5rem;
}
@media screen and (max-width: 767px) {
  .footer_tel {
    margin-top: 1rem;
    text-decoration: underline;
    text-underline-offset: 0.3rem;
  }
}
.footer_links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.8rem 2rem;
  margin-top: 3.5rem;
  padding: 0 2rem;
  font-size: 1.2rem;
  font-weight: 400;
}
@media screen and (max-width: 767px) {
  .footer_links {
    gap: 1.2rem;
    margin-top: 3rem;
  }
}
@media screen and (max-width: 767px) {
  .footer_links li:nth-child(2) {
    order: 3;
  }
  .footer_links li:nth-child(3) {
    order: 2;
  }
  .footer_links li:nth-child(n+4) {
    order: 4;
  }
}
.footer_links a {
  text-decoration: underline;
  text-underline-offset: 0.2rem;
}
@media (hover: hover) and (min-width: 992px) {
  .footer_links a:hover {
    text-decoration: none;
  }
}
.footer_copy {
  margin-top: 3.5rem;
  padding: 3rem 0 3.4rem;
}
@media screen and (max-width: 767px) {
  .footer_copy {
    margin-top: 3rem;
    padding: 2.4rem 0 2.5rem;
  }
}
.footer_copy {
  background: #FFE100;
  font-size: 1.2rem;
  text-align: center;
}

@keyframes chara-in {
  from {
    opacity: 0;
    transform: translateY(1rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
#top section + section {
  margin-top: 14.4rem;
}
@media screen and (max-width: 767px) {
  #top section + section {
    margin-top: 7.2rem;
  }
}
#top .mv_main {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 52rem;
  padding: 0 2rem;
}
@media screen and (max-width: 991px) {
  #top .mv_main {
    height: auto;
    padding: 4rem 2rem;
  }
}
@media screen and (max-width: 767px) {
  #top .mv_main {
    padding: 3.2rem 2.5rem;
  }
}
#top .mv_catch {
  width: 100%;
  max-width: 103rem;
}
@media screen and (max-width: 767px) {
  #top .mv_catch {
    max-width: 34rem;
  }
}
#top .mv_catch-pc, #top .mv_catch-sp {
  position: relative;
  display: block;
  width: 100%;
}
#top .mv_catch-pc img, #top .mv_catch-sp img {
  position: absolute;
}
#top .mv_line {
  position: absolute;
  left: 0;
  width: 100%;
  height: 1px;
  background: #A082E6;
}
#top .mv_chara {
  position: absolute;
  left: 85.495%;
  top: 52.625%;
  width: 12.874%;
  aspect-ratio: 132.6/131.9;
  z-index: 1;
}
#top .mv_chara img {
  position: absolute;
  top: -1.23%;
  left: -1.22%;
  width: 102.4%;
  max-width: none;
  animation: chara-in 0.6s 0.3s both;
}
#top .mv_chara-sp {
  left: 70.88%;
  top: 62.36%;
  width: 28.97%;
  aspect-ratio: 98.5/104.3;
}
#top .mv_chara-sp img {
  top: 5.85%;
}
#top .mv_logo {
  left: 1.233%;
  top: 2.247%;
  width: 39.32%;
}
#top .mv_logo-sp {
  left: 18.53%;
  top: 0;
  width: 62.65%;
}
#top .mv_usmobile {
  left: 42.388%;
  top: 2.652%;
  width: 35.92%;
}
#top .mv_usmobile-sp {
  left: 0.59%;
  top: 10.854%;
  width: 98.82%;
}
#top .mv_b {
  left: 64.17%;
  top: 2.76%;
  width: 3.98%;
}
#top .mv_choose {
  left: 42.388%;
  top: 17.101%;
  width: 35.92%;
}
#top .mv_badge-bg {
  left: 80.427%;
  top: 2.247%;
  width: 17.67%;
}
#top .mv_badge-text {
  left: 82.641%;
  top: 5.124%;
  width: 13.3%;
}
#top .mv_tel {
  left: 1.233%;
  top: 32.899%;
  width: 96.41%;
}
#top .mv_tel-sp {
  left: 0;
  top: 25.72%;
  width: 100%;
}
#top .mv_yen-lead {
  left: 1.456%;
  top: 56.539%;
  width: 21.75%;
}
#top .mv_yen {
  left: 1.728%;
  top: 63.82%;
  width: 21.36%;
}
#top .mv_yen-sp {
  left: 0.59%;
  top: 49.086%;
  width: 98.82%;
}
#top .mv_yen-icon {
  left: 24.561%;
  top: 57.034%;
  width: 8.54%;
}
#top .mv_travel {
  left: 35.01%;
  top: 56.382%;
  width: 20.39%;
}
#top .mv_off {
  left: 57.612%;
  top: 55.82%;
  width: 26.12%;
}
#top .mv_off-sp {
  left: 0;
  top: 63.343%;
  width: 67.21%;
}
#top .mv_unlimited {
  left: 1.262%;
  top: 84.045%;
  width: 96.6%;
}
#top .mv_unlimited-sp {
  left: 0;
  top: 81.781%;
  width: 100%;
}
#top .mv_catch-pc {
  aspect-ratio: 1030/445;
}
@media screen and (max-width: 767px) {
  #top .mv_catch-pc {
    display: none;
  }
}
#top .mv_catch-pc .line01 {
  top: 27.056%;
}
#top .mv_catch-pc .line02 {
  top: 50.966%;
}
#top .mv_catch-pc .line03 {
  top: 80.135%;
}
#top .mv_catch-sp {
  display: none;
  aspect-ratio: 340/590.6;
}
@media screen and (max-width: 767px) {
  #top .mv_catch-sp {
    display: block;
  }
}
#top .mv_catch-sp .line01 {
  top: 22.198%;
}
#top .mv_catch-sp .line02 {
  top: 45.665%;
}
#top .mv_catch-sp .line03 {
  top: 60.55%;
}
#top .mv_catch-sp .line04 {
  top: 79.005%;
}
#top .mv_support {
  padding: 3.4rem 2rem 2.6rem;
  background: #A082E6;
}
@media screen and (max-width: 767px) {
  #top .mv_support {
    padding: 2.4rem 2.75rem;
  }
}
#top .mv_support-box {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5.6rem;
  max-width: 103rem;
  margin: 0 auto;
  padding: 2.4rem 3.2rem;
  border-radius: 1rem;
  background: #fff;
}
@media screen and (max-width: 991px) {
  #top .mv_support-box {
    flex-direction: column;
    gap: 2.4rem;
    padding: 2.4rem;
  }
}
@media screen and (max-width: 767px) {
  #top .mv_support-box {
    gap: 1.6rem;
    max-width: 33.5rem;
    padding: 1.6rem;
  }
}
#top .mv_support-left {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.6rem;
}
@media screen and (max-width: 767px) {
  #top .mv_support-left {
    display: contents;
  }
}
#top .mv_support-head {
  display: flex;
  align-items: center;
  gap: 2.4rem;
}
#top .mv_support-head img {
  flex: none;
  width: 12.5rem;
}
@media screen and (max-width: 767px) {
  #top .mv_support-head img {
    width: 9.1rem;
  }
}
@media screen and (max-width: 389px) {
  #top .mv_support-head img {
    width: 7.6rem;
  }
}
@media screen and (max-width: 767px) {
  #top .mv_support-head {
    gap: 0.8rem;
  }
}
#top .mv_support-text h3 {
  font-size: 2.5rem;
  font-weight: 900;
  line-height: 1.45;
}
@media screen and (max-width: 767px) {
  #top .mv_support-text h3 {
    font-size: 1.8rem;
  }
}
#top .mv_support-text p {
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.5;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  #top .mv_support-text p {
    font-size: 1.1rem;
  }
}
@media screen and (max-width: 389px) {
  #top .mv_support-text p {
    white-space: normal;
  }
}
#top .mv_support-friend {
  width: 36.3rem;
}
@media screen and (max-width: 767px) {
  #top .mv_support-friend {
    order: 3;
    width: 30rem;
  }
}
@media screen and (max-width: 767px) {
  #top .mv_support-left .btn {
    order: 4;
    width: 100%;
  }
}
#top .campaign {
  margin-top: 14.4rem;
}
@media screen and (max-width: 767px) {
  #top .campaign {
    margin-top: 7.2rem;
  }
}
#top .campaign_slider .slick-list {
  padding: 0 !important;
}
#top .campaign_slider .slick-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
  height: 1.5rem;
  margin-top: 4rem;
}
#top .campaign_slider .slick-dots li {
  display: flex;
  align-items: center;
}
#top .campaign_slider .slick-dots button {
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  background: #E6E6E6;
  font-size: 0;
  transition: width 0.3s, height 0.3s;
}
#top .campaign_slider .slick-dots .slick-active button {
  width: 1.5rem;
  height: 1.5rem;
}
#top .campaign_item {
  width: 31rem;
  margin: 0 0.8rem;
}
@media screen and (max-width: 767px) {
  #top .campaign_item {
    width: 31rem;
  }
}
#top .campaign_item a {
  display: block;
  border-radius: 1rem;
  overflow: hidden;
  transition: opacity 0.3s;
}
@media (hover: hover) and (min-width: 992px) {
  #top .campaign_item a:hover {
    opacity: 0.8;
  }
}
#top .campaign_item img {
  width: 100%;
  aspect-ratio: 310/145;
  object-fit: cover;
}
#top .plan .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6.4rem;
}
@media screen and (max-width: 767px) {
  #top .plan .container {
    gap: 2.4rem;
  }
}
#top .plan_network {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.6rem;
  width: 100%;
  padding: 1.6rem 2.4rem 2.4rem;
  border: 2px solid #A082E6;
  border-radius: 1rem;
}
@media screen and (max-width: 767px) {
  #top .plan_network {
    padding: 1.6rem 0;
  }
}
#top .plan_network p {
  text-align: center;
}
@media screen and (max-width: 767px) {
  #top .plan_network p {
    padding: 0 2.4rem;
    text-align: left;
  }
}
@media screen and (max-width: 767px) {
  #top .plan_network p br {
    display: none;
  }
}
#top .plan_network strong {
  font-weight: 700;
  color: #A082E6;
}
#top .plan_network-head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
#top .plan_network-head img {
  width: 8rem;
}
#top .plan_network-head h4 {
  font-size: 1.8rem;
  font-weight: 900;
  color: #A082E6;
}
#top .plan_switch {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
#top .plan_tabs {
  display: flex;
  justify-content: center;
  gap: 0.8rem;
  width: 100%;
}
@media screen and (max-width: 767px) {
  #top .plan_tabs {
    position: sticky;
    top: 10.4rem;
    z-index: 10;
    gap: 0.9rem;
    width: calc(100% + 5rem);
    margin: 0 -2.5rem;
    padding: 0;
    background: #fff;
  }
}
#top .plan_tab {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 30rem;
  padding: 1.2rem 0;
  border-radius: 1rem 1rem 0 0;
  background: #FFF6B2;
  transition: background 0.3s;
}
@media screen and (max-width: 767px) {
  #top .plan_tab {
    flex: 1;
    justify-content: center;
    width: auto;
    height: 6.5rem;
    padding: 0;
  }
}
#top .plan_tab .name {
  font-size: 1.4rem;
  font-weight: 700;
}
#top .plan_tab .carrier {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 1.2rem;
}
#top .plan_tab .carrier img {
  width: 1.5rem;
}
#top .plan_tab.is-active {
  background: #FFE100;
}
@media (hover: hover) and (min-width: 992px) {
  #top .plan_tab:hover {
    background: #FFE100;
  }
}
#top .plan_panel {
  display: flex;
  flex-direction: column;
  gap: 3.2rem;
  width: calc(100% + 11.2rem);
  max-width: calc(100vw - 4rem);
  padding: 4.8rem 5.6rem;
  border: 2px solid #FFE100;
  border-radius: 1rem;
}
@media screen and (max-width: 1300px) {
  #top .plan_panel {
    padding: 4.8rem 3.2rem;
  }
}
@media screen and (max-width: 767px) {
  #top .plan_panel {
    gap: 1.6rem;
    width: calc(100% + 5rem);
    max-width: none;
    margin: 0 -2.5rem;
    padding: 2.4rem 2.5rem;
    border-width: 2px 0;
    border-radius: 0;
  }
}
#top .plan_panel-date {
  margin-bottom: -2.4rem;
  font-size: 1.2rem;
  color: #000;
  text-align: right;
}
@media screen and (max-width: 767px) {
  #top .plan_panel-date {
    margin-bottom: 0;
  }
}
#top .plan_cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3.2rem;
}
@media screen and (max-width: 1300px) {
  #top .plan_cards {
    gap: 1.6rem;
  }
}
@media screen and (max-width: 991px) {
  #top .plan_cards {
    grid-template-columns: minmax(0, 32.2rem);
    justify-content: center;
    gap: 2.4rem;
  }
}
@media screen and (max-width: 767px) {
  #top .plan_cards {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.6rem;
  }
}
#top .plan_card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding-top: 2.1rem;
}
@media screen and (max-width: 991px) {
  #top .plan_card.premium {
    order: 2;
  }
}
#top .plan_card.starter {
  order: 0;
}
@media screen and (max-width: 991px) {
  #top .plan_card.starter {
    order: 1;
  }
}
@media screen and (max-width: 991px) {
  #top .plan_card.light {
    order: 3;
  }
}
#top .plan_card-label {
  position: absolute;
  top: 0;
  left: 50%;
  display: flex;
  align-items: center;
  gap: 0.1rem;
  padding: 0.6rem 1.4rem;
  border: 2px solid #000;
  border-radius: 10rem;
  background: #fff;
  font-size: 1.4rem;
  font-weight: 700;
  white-space: nowrap;
  transform: translateX(-50%);
  z-index: 1;
}
#top .plan_card-label.popular {
  padding: 0.3rem 1.4rem;
  color: #A082E6;
}
#top .plan_card-label.popular img {
  width: 3.32rem;
  margin-right: 0.3rem;
}
#top .plan_card-label.popular b {
  margin-left: 0.4rem;
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 2.1rem;
  line-height: 1;
}
#top .plan_card-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  padding: 2.4rem 1.6rem 1.4rem;
  border: 2px solid #333;
  border-bottom: none;
  border-radius: 1rem 1rem 0 0;
  background: #FFE100;
  text-align: center;
}
#top .plan_card-head .tel {
  display: flex;
  align-items: center;
  gap: 0.2rem;
  padding: 0.4rem 0;
  font-size: 1.4rem;
  font-weight: 700;
}
#top .plan_card-head .tel img {
  width: 1.6rem;
}
#top .plan_card-head h4 {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 3rem;
  font-weight: 700;
  color: #fff;
  line-height: 1;
  white-space: nowrap;
  -webkit-text-stroke: 0.4rem #333;
  paint-order: stroke fill;
}
@media screen and (max-width: 1300px) {
  #top .plan_card-head h4 {
    font-size: 2.6rem;
  }
}
@media screen and (max-width: 767px) {
  #top .plan_card-head h4 {
    font-size: 3rem;
  }
}
#top .plan_card-head .catch {
  font-size: 1.4rem;
  font-weight: 700;
}
#top .plan_card-head.purple {
  background: #A082E6;
}
#top .plan_card-head.purple .tel,
#top .plan_card-head.purple .catch {
  color: #fff;
}
#top .plan_card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 1.6rem;
  padding: 2.2rem;
  border: 2px solid #333;
  border-radius: 0 0 1rem 1rem;
  background: #fff;
}
@media screen and (max-width: 1300px) {
  #top .plan_card-body {
    padding: 2.4rem 1.6rem;
  }
}
#top .plan_card-body .btn {
  width: 100%;
  margin-top: auto;
}
#top .plan_card-block {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}
#top .plan_card-block h5 {
  padding: 0.8rem;
  border-radius: 1rem;
  background: #333;
  font-size: 1.4rem;
  font-weight: 700;
  color: #fff;
  text-align: center;
}
#top .plan_card-block:nth-of-type(2) {
  padding-bottom: 1.6rem;
  background: radial-gradient(circle, #949494 1px, transparent 1.3px) left bottom/0.8rem 0.2rem repeat-x;
}
#top .plan_card-note {
  font-size: 1.2rem;
  text-align: center;
}
#top .plan_card-price {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0.8rem;
  min-height: 5rem;
}
#top .plan_card-price .tag {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.1rem;
  height: 5rem;
  margin-right: 1.5rem;
  padding: 0.5rem 0.4rem 0.2rem 1rem;
  border-radius: 0.3rem 0 0 0.3rem;
  background: #FFE100;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.45;
  white-space: nowrap;
}
#top .plan_card-price .tag::after {
  content: "";
  position: absolute;
  top: 0;
  left: 100%;
  width: 1.45rem;
  height: 5rem;
  background: url(../img/common/price_tag.svg) no-repeat left center/100% 100%;
}
#top .plan_card-price .tag span {
  display: flex;
  align-items: center;
  gap: 0.2rem;
}
#top .plan_card-price .tag b {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 2.1rem;
  color: #fff;
  line-height: 1;
  -webkit-text-stroke: 0.2rem #333;
  paint-order: stroke fill;
}
#top .plan_card-price .tag i {
  font-size: 1.4rem;
  font-weight: 900;
  color: #fff;
  -webkit-text-stroke: 0.2rem #333;
  paint-order: stroke fill;
}
#top .plan_card-price .price {
  display: flex;
  align-items: flex-end;
  line-height: 1.2;
  padding-bottom: 0.5rem;
}
#top .plan_card-price .price b {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 4rem;
  font-weight: 700;
  line-height: 1;
}
#top .plan_card-price .price span {
  width: 2.4rem;
  margin-left: 0.2rem;
  padding-bottom: 0.3rem;
  font-size: 2.1rem;
  font-weight: 900;
  text-align: center;
  line-height: 1;
}
#top .plan_card-ref {
  margin-top: -1.2rem;
  color: #949494;
  text-align: right;
  white-space: nowrap;
}
@media screen and (max-width: 1300px) {
  #top .plan_card-ref {
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 767px) {
  #top .plan_card-ref {
    font-size: 1.4rem;
  }
}
@media screen and (max-width: 389px) {
  #top .plan_card-ref {
    white-space: normal;
  }
}
#top .plan_card-data {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.6rem 0.8rem;
}
#top .plan_card-data dd {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 2.1rem;
  font-weight: 900;
  color: #A082E6;
  line-height: 1.45;
}
#top .plan_card-data dd img {
  width: 2.5rem;
}
#top .plan_notes {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: 100%;
  margin-top: -1.6rem;
  font-size: 1.2rem;
}
#top .plan_notes li {
  position: relative;
  padding-left: 1.5rem;
}
#top .plan_notes li::before {
  content: "※";
  position: absolute;
  top: 0.1rem;
  left: 0;
  font-size: 1.067rem;
}
#top .plan_warning {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.8rem;
  width: 100%;
  padding: 1.6rem;
  border-radius: 1rem;
  background: #FF3250;
  color: #fff;
  font-weight: 700;
  text-align: center;
}
#top .plan_warning h4 {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-size: 1.6rem;
}
@media screen and (max-width: 767px) {
  #top .plan_warning h4 {
    flex-direction: column;
    gap: 0.4rem;
  }
}
#top .plan_warning h4 img {
  width: 2.4rem;
}
#top .plan_warning p {
  font-size: 1.2rem;
}
#top .change {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5.6rem;
  padding: 2.4rem 3.2rem;
  border: 2px solid #A082E6;
  border-radius: 1rem;
  background: #fff;
}
@media screen and (max-width: 991px) {
  #top .change {
    flex-direction: column;
    gap: 1.6rem;
  }
}
@media screen and (max-width: 767px) {
  #top .change {
    padding: 2.4rem 1.6rem;
  }
}
#top .change_text {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  font-size: 1.2rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  #top .change_text {
    display: contents;
  }
}
#top .change_text h4 {
  font-size: 1.6rem;
  font-weight: 900;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  #top .change_text h4 {
    white-space: normal;
  }
}
#top .change_text h4 span {
  font-size: 1.8rem;
}
#top .change_text h4 em {
  background: linear-gradient(transparent 50%, #FFE100 50%);
}
#top .change_img {
  flex: none;
}
@media screen and (max-width: 767px) {
  #top .change_img {
    order: 3;
  }
}
@media screen and (max-width: 767px) {
  #top .change_note {
    order: 4;
  }
}
#top .plan_panel .change {
  gap: 3.2rem;
  width: fit-content;
  margin-inline: auto;
}
@media screen and (max-width: 991px) {
  #top .plan_panel .change {
    width: auto;
  }
}
@media screen and (max-width: 767px) {
  #top .plan_panel .change {
    gap: 1.6rem;
    padding: 2.2rem;
  }
}
@media screen and (max-width: 767px) {
  #top .plan_panel .change p:not(.change_note) {
    margin-top: -0.8rem;
  }
}
@media screen and (max-width: 767px) {
  #top .plan_panel .change_text {
    width: auto;
  }
}
#top .plan_panel .change_img img {
  width: 24.4rem;
}
#top .point {
  position: relative;
}
#top .point_bg {
  position: absolute;
  top: 2.4rem;
  left: 0;
  width: 100%;
  height: 216.3rem;
  overflow: hidden;
  z-index: -1;
  pointer-events: none;
}
#top .point_bg-left, #top .point_bg-right {
  position: absolute;
  top: 0;
  width: 50%;
  max-width: 72rem;
  height: 100%;
  background: url(../img/top/point_bg.svg) no-repeat;
  background-size: 182rem auto;
}
@media screen and (max-width: 767px) {
  #top .point_bg-left, #top .point_bg-right {
    max-width: 19.5rem;
    background-image: url(../img/top/point_bg_sp.svg);
    background-size: 39rem auto;
  }
}
#top .point_bg-left {
  left: 0;
  background-position: -18.9rem -3.1rem;
}
@media screen and (max-width: 767px) {
  #top .point_bg-left {
    background-position: left top;
  }
}
#top .point_bg-right {
  right: 0;
  background-position: right -19.1rem top -3.1rem;
}
@media screen and (max-width: 767px) {
  #top .point_bg-right {
    background-position: right top;
  }
}
@media screen and (max-width: 767px) {
  #top .point_bg {
    top: -4.8rem;
    height: 273.8rem;
  }
}
#top .point .container {
  display: flex;
  flex-direction: column;
  gap: 6.4rem;
}
@media screen and (max-width: 767px) {
  #top .point .container {
    gap: 2.4rem;
  }
}
#top .point_note {
  padding: 0.8rem 1.6rem;
  border-radius: 1rem;
  background: #A082E6;
  color: #fff;
  font-size: 1.2rem;
  text-align: center;
}
#top .point_note-ttl {
  font-size: 1.4rem;
  font-weight: 700;
}
#top .point_list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 44.4rem));
  justify-content: center;
  gap: 3.2rem;
}
@media screen and (max-width: 767px) {
  #top .point_list {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.6rem;
  }
}
#top .point_item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 3.2rem 5.6rem;
  border-radius: 1rem;
  text-align: center;
}
@media screen and (max-width: 991px) {
  #top .point_item {
    padding: 3.2rem 2.4rem;
  }
}
@media screen and (max-width: 767px) {
  #top .point_item {
    padding: 2.4rem;
  }
}
#top .point_item .badge {
  margin-bottom: 0.8rem;
}
#top .point_item h4 {
  font-size: 1.8rem;
  font-weight: 900;
}
#top .point_item h4 em {
  background: linear-gradient(transparent 50%, #FFE100 50%);
}
#top .point_item .tag {
  font-size: 1.2rem;
}
#top .point_item-img {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 13rem;
  margin-top: 1.6rem;
}
#top .point_item-img img {
  max-height: 100%;
  width: auto;
}
#top .point_item-text {
  width: 100%;
  margin-top: 1.6rem;
  color: #000;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #top .point_item-text br {
    display: none;
  }
}
#top .annual_box {
  border: 2px solid #333;
  border-radius: 1rem;
  background: #fff;
}
#top .annual_box > h3, #top .annual_list {
  position: relative;
}
#top .annual_box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.4rem;
  padding: 3.2rem;
  outline: 0.4rem solid #FFD30B;
  outline-offset: -0.6rem;
}
@media screen and (max-width: 767px) {
  #top .annual_box {
    gap: 1.6rem;
    padding: 2.4rem;
  }
}
#top .annual_box h3 {
  font-size: 2.1rem;
  font-weight: 900;
  text-align: center;
}
#top .annual_box h3 em {
  margin-left: 0.4rem;
  font-size: 2.6rem;
  background: linear-gradient(transparent 50%, #FFE100 50%);
}
@media screen and (max-width: 767px) {
  #top .annual_box h3 em {
    display: inline-block;
    margin-left: 0;
  }
}
#top .annual_list {
  display: flex;
  gap: 2.4rem;
  width: 100%;
}
@media screen and (max-width: 767px) {
  #top .annual_list {
    flex-direction: column;
    gap: 1.6rem;
  }
}
#top .annual_item {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  margin-top: 2.1rem;
  padding: 3.2rem 1rem 2.4rem;
  border: 2px solid #A082E6;
  border-radius: 1rem;
  background: #F6F2FF;
  text-align: center;
}
#top .annual_item h4 {
  position: absolute;
  top: -2.1rem;
  left: 50%;
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 0.4rem;
  width: 81.91%;
  height: 4.2rem;
  padding-top: 0.6rem;
  border-radius: 2.8rem;
  background: #A082E6;
  font-size: 2.1rem;
  font-weight: 900;
  color: #fff;
  line-height: 1.4;
  transform: translateX(-50%);
}
#top .annual_item h4 small {
  font-size: 1.4rem;
  font-weight: 700;
}
#top .annual_item.starter {
  border-color: #FFE100;
  background: #FFFADC;
}
#top .annual_item.starter h4 {
  background: #FFE100;
  color: #333;
}
#top .annual_item-lead {
  font-size: 1.9rem;
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  #top .annual_item-lead {
    font-size: 1.2rem;
  }
}
#top .annual_item-lead .dot {
  padding-top: 0.6rem;
  background: radial-gradient(circle, #333 0.2rem, transparent 0.21rem) left top/1em 0.4rem repeat-x;
}
#top .annual_item-price {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  line-height: 1;
}
#top .annual_item-price .year {
  position: relative;
  top: 0.27rem;
  font-size: 2.3rem;
  font-weight: 900;
  line-height: 0.9;
}
@media screen and (max-width: 767px) {
  #top .annual_item-price .year {
    top: 0.09rem;
    font-size: 1.6rem;
  }
}
#top .annual_item-price b {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 6.7rem;
  font-weight: 700;
  color: #A082E6;
  -webkit-text-stroke: 0.4rem #333;
  paint-order: stroke fill;
}
@media screen and (max-width: 767px) {
  #top .annual_item-price b {
    font-size: 5rem;
    -webkit-text-stroke-width: 0.2rem;
  }
}
#top .annual_item-price b.is-yellow {
  color: #FFE100;
}
#top .annual_item-price .unit {
  position: relative;
  top: 0.61rem;
  font-size: 2.9rem;
  font-weight: 900;
  line-height: 0.85;
}
@media screen and (max-width: 767px) {
  #top .annual_item-price .unit {
    top: 0.47rem;
    font-size: 2.2rem;
  }
}
#top .annual_item-price .unit i {
  font-size: 2rem;
}
@media screen and (max-width: 767px) {
  #top .annual_item-price .unit i {
    font-size: 1.3rem;
  }
}
#top .annual_item-text {
  font-size: 2.1rem;
  font-weight: 900;
  color: #A082E6;
}
@media screen and (max-width: 767px) {
  #top .annual_item-text {
    font-size: 1.4rem;
  }
}
#top .annual_item-text b {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 2.6rem;
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  #top .annual_item-text b {
    font-size: 1.9rem;
  }
}
#top .annual_item-text em {
  background: linear-gradient(transparent 55%, #FFE100 55%);
  color: #333;
}
#top .choose {
  padding: 6.4rem 0;
  background: #FFE100;
}
@media screen and (max-width: 767px) {
  #top .choose {
    padding: 4rem 0;
  }
}
#top .choose .container {
  display: flex;
  flex-direction: column;
  gap: 6.4rem;
}
@media screen and (max-width: 767px) {
  #top .choose .container {
    gap: 2.4rem;
  }
}
#top .choose_lead {
  font-size: 1.6rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  #top .choose_lead {
    padding: 0 2.4rem;
    text-align: left;
  }
}
@media screen and (max-width: 767px) {
  #top .choose_lead br {
    display: none;
  }
}
#top .choose_box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3.2rem;
  padding: 4rem;
  border-radius: 1rem;
  background: #fff;
}
@media screen and (max-width: 991px) {
  #top .choose_box {
    padding: 4rem 2.4rem;
  }
}
@media screen and (max-width: 767px) {
  #top .choose_box {
    gap: 2.4rem;
    padding: 2.4rem 2.7rem;
  }
}
#top .choose_box-head {
  display: flex;
  align-items: center;
  gap: 1.6rem;
}
@media screen and (max-width: 767px) {
  #top .choose_box-head {
    gap: 0.8rem;
  }
}
#top .choose_box-head h4 {
  font-size: 2.1rem;
  font-weight: 900;
}
#top .choose_term {
  display: flex;
  gap: 4rem;
  width: 100%;
}
@media screen and (max-width: 991px) {
  #top .choose_term {
    gap: 2.4rem;
  }
}
@media screen and (max-width: 767px) {
  #top .choose_term {
    flex-direction: column;
    gap: 1.6rem;
  }
}
#top .choose_term-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.8rem;
  padding: 2.4rem 3.2rem;
  border-radius: 0.8rem;
  background: #A082E6;
  color: #fff;
}
#top .choose_term-item.travel {
  background: #FFE100;
  color: #333;
}
@media screen and (max-width: 767px) {
  #top .choose_term-item {
    padding: 2.4rem;
  }
}
#top .choose_term-head {
  display: flex;
  align-items: center;
  gap: 2.4rem;
}
#top .choose_term-head img {
  width: 8.2rem;
}
#top .choose_term-head h5 {
  font-size: 1.8rem;
  font-weight: 900;
}
#top .choose_use {
  display: flex;
  justify-content: center;
  gap: 3.2rem;
  width: 100%;
}
@media screen and (max-width: 991px) {
  #top .choose_use {
    gap: 1.6rem;
  }
}
@media screen and (max-width: 767px) {
  #top .choose_use {
    flex-direction: column;
    align-items: center;
  }
}
#top .choose_use-item {
  display: flex;
  flex-direction: column;
  width: 29.5rem;
}
@media screen and (max-width: 767px) {
  #top .choose_use-item {
    width: 100%;
    max-width: none;
  }
}
#top .choose_use-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  padding: 1.6rem 2.4rem;
  border: 2px solid #333;
  border-bottom: none;
  border-radius: 1rem 1rem 0 0;
  background: #A082E6;
}
#top .choose_use-head img {
  width: 4rem;
}
#top .choose_use-head h5 {
  font-size: 1.8rem;
  font-weight: 900;
  color: #fff;
}
#top .choose_use-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.8rem;
}
@media screen and (max-width: 767px) {
  #top .choose_use-body {
    min-height: 29.7rem;
  }
}
#top .choose_use-body {
  padding: 2.4rem 3rem;
  border: 2px solid #333;
  border-radius: 0 0 1rem 1rem;
  background: #fff;
}
@media screen and (max-width: 991px) {
  #top .choose_use-body {
    padding: 2.4rem 1.6rem;
  }
}
@media screen and (max-width: 767px) {
  #top .choose_use-body {
    padding: 2.4rem 3rem;
  }
}
#top .choose_use-body .photo {
  width: 100%;
  aspect-ratio: 230/96;
  object-fit: cover;
}
#top .choose_use-body p {
  flex: 1;
}
#top .choose_use-body em {
  background: linear-gradient(transparent 50%, #FFE100 50%);
}
#top .choose_use-body .pill {
  padding: 0.4rem 1.6rem;
  border-radius: 10rem;
  background: #A082E6;
  font-size: 1.6rem;
  font-weight: 900;
  color: #fff;
  line-height: 1.45;
  transition: opacity 0.3s;
}
@media (hover: hover) and (min-width: 992px) {
  #top .choose_use-body .pill:hover {
    opacity: 0.8;
  }
}
@media screen and (max-width: 767px) {
  #top .choose .change h4 span {
    display: block;
  }
}
#top .choose .change_img img {
  width: 40rem;
}
@media screen and (max-width: 767px) {
  #top .choose .change_img img {
    width: 24.4rem;
  }
}
#top .consult {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.8rem;
}
#top .consult_lead {
  display: flex;
  align-items: flex-end;
  gap: 0.8rem;
  font-size: 1.4rem;
  font-weight: 700;
  text-align: center;
}
#top .consult_lead b {
  font-size: 1.6rem;
  font-weight: 900;
}
#top .consult_lead::before, #top .consult_lead::after {
  content: "";
  width: 1.3rem;
  height: 2.3rem;
  background: url(../img/top/consult_slash.svg) no-repeat center/contain;
}
#top .consult_lead::after {
  transform: scaleX(-1);
}
#top .consult_box {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: calc(100% + 1rem);
  padding: 1.1rem 1.1rem 1.2rem;
  border-radius: 1.4rem;
  background: #06C755;
}
@media screen and (max-width: 767px) {
  #top .consult_box {
    width: 100%;
    padding: 0.8rem;
  }
}
#top .consult_illust {
  width: 38.1rem;
  margin: 1.2rem 0 2.4rem;
}
@media screen and (max-width: 767px) {
  #top .consult_illust {
    width: 27.2rem;
    margin: 0.7rem 0 2rem;
  }
}
#top .consult_inner {
  display: flex;
  gap: 1.2rem;
  width: 100%;
}
@media screen and (max-width: 991px) {
  #top .consult_inner {
    flex-direction: column;
  }
}
#top .consult_contact {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 48.3rem;
  padding: 2.3rem 1rem 0;
  border-radius: 1rem;
  background: #fff;
}
@media screen and (max-width: 991px) {
  #top .consult_contact {
    width: 100%;
    padding-bottom: 1.6rem;
  }
}
@media screen and (max-width: 767px) {
  #top .consult_contact {
    padding: 1.5rem 0 0;
  }
}
#top .consult_contact-ttl {
  width: 30rem;
}
@media screen and (max-width: 767px) {
  #top .consult_contact-ttl {
    width: 21.4rem;
  }
}
#top .consult_contact-text {
  margin-top: 1.2rem;
  font-size: 1.96rem;
  font-weight: 900;
  line-height: 1.43;
}
@media screen and (max-width: 767px) {
  #top .consult_contact-text {
    margin-top: 0;
    font-size: 1.4rem;
  }
}
#top .consult_contact-btn {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.3rem;
  width: 28.2rem;
  height: 4.8rem;
  margin-top: 1rem;
  padding-right: 1rem;
  border: 2px solid #333;
  border-radius: 2.5rem;
  background: #fff;
  font-size: 1.8rem;
  font-weight: 900;
  color: #06C755;
  box-shadow: 0.2rem 0.5rem 0 -2px #06C755, 0.2rem 0.5rem 0 0 #333;
  transition: transform 0.2s, box-shadow 0.2s;
}
@media screen and (max-width: 767px) {
  #top .consult_contact-btn {
    margin-top: 0.1rem;
  }
}
#top .consult_contact-btn img {
  width: 3.36rem;
}
#top .consult_contact-btn::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 1.9rem;
  width: 0.7rem;
  height: 1.2rem;
  background: url(../img/common/btn_arrow.svg) no-repeat center/contain;
  transform: translateY(-50%);
}
@media (hover: hover) and (min-width: 992px) {
  #top .consult_contact-btn:hover {
    transform: translate(0.2rem, 0.5rem);
    box-shadow: 0 0 0 -2px #06C755, 0 0 0 0 #333;
  }
}
#top .consult_contact-id {
  margin-top: 0.2rem;
  line-height: 2.8;
}
@media screen and (max-width: 767px) {
  #top .consult_contact-id {
    margin-top: 0.5rem;
    font-size: 1.2rem;
    line-height: 2.8rem;
  }
}
#top .consult_friend {
  flex: 1;
  display: flex;
}
@media screen and (max-width: 767px) {
  #top .consult_friend {
    display: none;
  }
}
#top .flow .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6.4rem;
}
@media screen and (max-width: 767px) {
  #top .flow .container {
    gap: 2.4rem;
  }
}
#top .flow_catch {
  width: 100%;
  padding: 1.1rem 1rem;
  border-radius: 1rem;
  background: #FFE100;
  font-size: 2.1rem;
  font-weight: 900;
  text-align: center;
  line-height: 1.4;
}
@media screen and (max-width: 767px) {
  #top .flow_catch {
    padding: 0.8rem;
    font-size: 1.8rem;
    line-height: 3.4rem;
  }
}
#top .flow_catch small {
  font-size: inherit;
}
@media screen and (max-width: 767px) {
  #top .flow_catch small {
    display: block;
    font-size: 1.4rem;
    line-height: 2.1rem;
  }
}
#top .flow_catch span {
  color: #fff;
  -webkit-text-stroke: 0.4rem #333;
  paint-order: stroke fill;
}
#top .flow_catch b {
  font-size: 3.1rem;
}
@media screen and (max-width: 767px) {
  #top .flow_catch b {
    font-size: 2.7rem;
  }
}
#top .flow_list {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 92rem;
}
#top .flow_item {
  display: flex;
  align-items: center;
  gap: 13rem;
}
@media screen and (max-width: 991px) {
  #top .flow_item {
    gap: 2.4rem;
  }
}
#top .flow_item:not(:first-child) {
  margin-top: -2.4rem;
}
@media screen and (max-width: 767px) {
  #top .flow_item:not(:first-child) {
    margin-top: 1.6rem;
  }
}
#top .flow_item:nth-child(even) {
  flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
  #top .flow_item {
    flex-direction: column;
  }
  #top .flow_item:nth-child(even) {
    flex-direction: column;
  }
}
#top .flow_item-box {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.4rem;
  width: 48rem;
  padding: 3rem 3.8rem 3.8rem;
  border: 2px solid #A082E6;
  border-radius: 1rem;
  background: #fff;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  #top .flow_item-box {
    width: 100%;
    gap: 1.6rem;
    padding: 2.2rem;
  }
}
#top .flow_item-head {
  display: flex;
  align-items: center;
  gap: 1.6rem;
}
@media screen and (max-width: 767px) {
  #top .flow_item-head {
    flex-direction: column;
    gap: 0.8rem;
  }
}
#top .flow_item-head h4 {
  font-size: 1.8rem;
  font-weight: 900;
}
#top .flow_item-icon {
  width: 10rem;
}
@media screen and (max-width: 767px) {
  #top .flow_item-icon {
    width: 8.63rem;
    margin: -0.32rem 0;
  }
}
#top .flow_item-text {
  width: 100%;
}
#top .flow_item-text em {
  background: linear-gradient(transparent 50%, #FFE100 50%);
}
#top .flow_item-text .ext {
  color: #46C9F4;
  text-decoration: underline;
  text-underline-offset: 0.2rem;
}
#top .flow_item-text .ext::after {
  content: "";
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  margin-left: 0.2rem;
  background: url(../img/common/icon_external.svg) no-repeat center/contain;
  vertical-align: -0.2rem;
}
@media (hover: hover) and (min-width: 992px) {
  #top .flow_item-text .ext:hover {
    text-decoration: none;
  }
}
#top .flow_item-illust {
  flex: none;
}
#top .flow_item-illust img {
  width: 18rem;
}
@media screen and (max-width: 991px) {
  #top .flow_item-illust img {
    width: 14rem;
  }
}
#top .flow_item-illust.narrow img {
  width: 12.3rem;
}
@media screen and (max-width: 991px) {
  #top .flow_item-illust.narrow img {
    width: 9.6rem;
  }
}
@media screen and (max-width: 767px) {
  #top .flow_item-illust {
    display: none;
  }
}
#top .flow_support {
  width: 100%;
  margin-bottom: -2.4rem;
}
@media screen and (max-width: 767px) {
  #top .flow_support {
    margin-bottom: -0.8rem;
  }
}
#top .flow_support img {
  width: 100%;
}
#top .voice {
  padding: 6.4rem 0;
  background: #A082E6;
}
@media screen and (max-width: 767px) {
  #top .voice {
    padding: 4rem 0;
  }
}
#top .voice_slider {
  max-width: 107rem;
  margin: 6.4rem auto 0;
  padding: 0 2rem;
}
@media screen and (max-width: 767px) {
  #top .voice_slider {
    margin-top: 2.4rem;
    padding: 0 2.5rem;
  }
}
#top .voice_slider .slick-list {
  margin: 0 -1rem;
}
@media screen and (max-width: 767px) {
  #top .voice_slider .slick-list {
    margin: 0;
  }
}
#top .voice_slider .slick-track {
  display: flex;
}
#top .voice_slider .slick-slide {
  height: auto;
}
#top .voice_controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 29rem;
  margin: 4rem auto 0;
}
@media screen and (max-width: 767px) {
  #top .voice_controls {
    margin-top: 2.4rem;
  }
}
#top .voice_controls .slick-arrow {
  order: 1;
  width: 3rem;
  height: 3rem;
  background: url(../img/common/icon_slider_arrow.svg) no-repeat center/contain;
  font-size: 0;
  transition: opacity 0.3s;
}
@media (hover: hover) and (min-width: 992px) {
  #top .voice_controls .slick-arrow:hover {
    opacity: 0.8;
  }
}
#top .voice_controls .slick-arrow.slick-next {
  order: 3;
  transform: rotate(180deg);
}
#top .voice_controls .slick-dots {
  order: 2;
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
#top .voice_controls .slick-dots li {
  display: flex;
  align-items: center;
}
#top .voice_controls .slick-dots button {
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  background: #fff;
  font-size: 0;
  transition: width 0.3s, height 0.3s;
}
#top .voice_controls .slick-dots .slick-active button {
  width: 1.5rem;
  height: 1.5rem;
}
#top .voice_item {
  padding: 0 1rem;
}
@media screen and (max-width: 767px) {
  #top .voice_item {
    padding: 0;
  }
}
#top .voice_item-inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 41.5rem;
  padding: 2.4rem 2rem 3rem;
  border-radius: 1rem;
  background: #fff;
  color: #000;
}
#top .voice_item-num {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 2.1rem;
  font-style: italic;
  font-weight: 700;
  text-align: center;
  line-height: 2.9rem;
}
#top .voice_item-num b {
  font-size: 3.5rem;
  color: #FFE100;
  -webkit-text-stroke: 0.2rem #333;
  paint-order: stroke fill;
}
#top .voice_item-user {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  margin-top: 1.4rem;
  padding-left: 0.9rem;
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 2rem;
}
#top .voice_item-user img {
  width: 5rem;
}
#top .voice_item-star {
  width: 7.4rem;
  margin: 1.6rem 0 0 0.9rem;
}
#top .voice_item h4 {
  margin-top: 0.8rem;
  padding: 0 0 1.1rem;
  border-bottom: 2px solid #000;
  font-size: 1.65rem;
  line-height: 2.6rem;
}
#top .voice_item-text {
  margin-top: 1.4rem;
  font-size: 1.3rem;
  line-height: 2.3rem;
}

.ext {
  color: #46C9F4;
  text-decoration: underline;
  text-underline-offset: 0.2rem;
}
.ext::after {
  content: "";
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  margin-left: 0.2rem;
  background: url(../img/common/icon_external.svg) no-repeat center/contain;
  vertical-align: -0.2rem;
}
@media (hover: hover) and (min-width: 992px) {
  .ext:hover {
    text-decoration: none;
  }
}

.check {
  padding: 14.4rem 0;
}
.check .ttl_icon {
  margin-left: 16.5rem;
}
.check .btn {
  letter-spacing: -0.08em;
}
.check {
  background: radial-gradient(circle, #ECE6FA 0.3rem, transparent 0.31rem) 0 0/2.7rem 2.622rem, radial-gradient(circle, #ECE6FA 0.3rem, transparent 0.31rem) 1.3rem 1.311rem/2.7rem 2.622rem;
}
@media screen and (max-width: 767px) {
  .check {
    padding: 5.6rem 0;
  }
}
.check_lead {
  margin-top: 6.2rem;
  font-size: 1.6rem;
  text-align: center;
  text-decoration: underline;
  text-underline-offset: 0.3rem;
  line-height: 1.625;
}
@media screen and (max-width: 767px) {
  .check_lead {
    margin-top: 2.4rem;
    line-height: 1.5;
  }
}
.check_tags {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 1.6rem;
  margin-top: 6.2rem;
  list-style: none;
}
@media screen and (max-width: 991px) {
  .check_tags {
    flex-direction: column;
    align-items: center;
    gap: 2.8rem;
  }
}
@media screen and (max-width: 767px) {
  .check_tags {
    margin-top: 2.4rem;
  }
}
.check_tags li {
  position: relative;
  min-width: 26rem;
  margin: 0.8rem 0 0 3rem;
  padding: 0.6rem 3rem 0.6rem 4.6rem;
  border: 2px solid #333;
  border-radius: 0 0.5rem 0.5rem 0;
  background: #fff;
  font-size: 1.6rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
}
.check_badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 6.3rem;
  height: 6rem;
  padding-top: 1.1rem;
  background: url(../img/lineup/check_tag.svg) no-repeat center/contain;
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-weight: 700;
  color: #fff;
  line-height: 1;
}
.check_badge span {
  font-size: 1.2rem;
}
.check_badge b {
  margin-top: -0.4rem;
  font-size: 3.3rem;
}
.check_badge.tag {
  position: absolute;
  top: -1rem;
  left: -3.2rem;
}
.check_cards {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6rem;
  margin-top: 7rem;
}
@media screen and (max-width: 767px) {
  .check_cards {
    gap: 2.4rem;
    margin-top: 3.6rem;
  }
}
.check_card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.4rem;
  width: 100%;
  max-width: 70rem;
  padding: 3.8rem;
  border: 2px solid #333;
  border-radius: 1rem;
  background: #fff;
}
@media screen and (max-width: 767px) {
  .check_card {
    padding: 2.2rem;
  }
}
@media screen and (max-width: 389px) {
  .check_card {
    padding: 2.2rem 1.4rem;
  }
}
.check_card-head {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
}
.check_card-head.wide {
  gap: 1.6rem;
}
@media screen and (max-width: 767px) {
  .check_card-head.wide {
    gap: 0.8rem;
  }
}
@media screen and (max-width: 767px) {
  .check_card-head {
    flex-direction: column;
  }
}
.check_card-head h3 {
  font-size: 1.8rem;
  font-weight: 900;
  line-height: 1.5;
}
.check_card-text {
  max-width: 45.8rem;
  font-size: 1.6rem;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .check_card-text {
    max-width: 28rem;
  }
}
.check_card-bar {
  width: 100%;
  max-width: 58rem;
  padding: 0.8rem 1.6rem;
  border-radius: 1rem;
  background: #FFE100;
  font-size: 1.4rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
}
.check_card-bar small {
  display: block;
  font-size: 1.2rem;
}

.area {
  position: relative;
  max-width: 100%;
}
.area::before {
  content: "";
  position: fixed;
  top: 6rem;
  left: 0;
  width: 100%;
  height: calc(100% - 6rem);
  background: rgba(0, 0, 0, 0.3);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
  pointer-events: none;
  z-index: 110;
}
@media screen and (max-width: 767px) {
  .area::before {
    top: 0;
    height: 100%;
  }
}
.area_menu {
  position: absolute;
  top: calc(100% + 3.3rem);
  left: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.8rem;
  padding: 1.6rem 1.6rem 0.8rem;
  border-radius: 1rem;
  background: #fff;
  transform: translateX(calc(-100% + 5.4rem));
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
  z-index: 111;
}
@media screen and (max-width: 767px) {
  .area_menu {
    position: fixed;
    top: 50%;
    gap: 2.4rem;
    padding: 3.2rem;
    transform: translate(-50%, -50%);
  }
}
.area_menu::before {
  content: "";
  position: absolute;
  bottom: calc(100% - 0.5rem);
  right: 3.63rem;
  border: 0 solid transparent;
  border-width: 0 1.02rem 1.825rem;
  border-bottom-color: #fff;
}
@media screen and (max-width: 767px) {
  .area_menu::before {
    display: none;
  }
}
.area_menu::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 0;
  width: 100%;
  height: 3.4rem;
}
@media screen and (max-width: 767px) {
  .area_menu::after {
    display: none;
  }
}
.area.is-open .area_menu {
  opacity: 1;
  visibility: visible;
}
.area.is-open::before {
  opacity: 1;
  visibility: visible;
}
.area_list {
  display: flex;
  gap: 1.6rem;
}
@media screen and (max-width: 767px) {
  .area_list {
    flex-direction: column;
    gap: 2.4rem;
  }
}
.area_list a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.1rem;
  width: 12.3rem;
  height: 100%;
  padding: 1.1rem 0.9rem;
  border: 1px solid #A082E6;
  border-radius: 0.5rem;
}
@media screen and (max-width: 767px) {
  .area_list a {
    padding: 2.1rem 0.9rem 1.5rem;
    border-width: 2px;
  }
}
.area_list a {
  background: #fff;
  font-weight: 700;
  color: #A082E6;
  text-align: center;
  line-height: 1.2;
  white-space: nowrap;
  transition: background 0.3s;
}
@media (hover: hover) and (min-width: 992px) {
  .area_list a:hover {
    background: #F6F2FF;
  }
}
.area_list b {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 1.5rem;
}
.area_list span {
  font-size: 1.1rem;
}
.area_list em {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 1.3rem;
}
.area_note {
  font-size: 1.4rem;
  font-weight: 700;
  color: #949494;
  line-height: 1.86;
  white-space: nowrap;
}

.device {
  display: flex;
  gap: 1.6rem;
  width: 100%;
  max-width: 58rem;
}
@media screen and (max-width: 767px) {
  .device {
    flex-direction: column;
    align-items: center;
    gap: 2.4rem;
    max-width: 29rem;
  }
}
.device_col {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  gap: 1.6rem;
  min-width: 0;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .device_col {
    width: 100%;
  }
}
.device_col h4 {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 3.4rem;
  border-radius: 0.5rem;
  background: #A082E6;
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 2.1rem;
  font-weight: 700;
  color: #fff;
  line-height: 1;
}
.device_col u {
  text-decoration: underline;
  text-underline-offset: 0.2rem;
}
.device_model {
  font-size: 1.2rem;
}
.device_model b {
  display: block;
  font-size: 1.6rem;
  font-weight: 900;
  color: #A082E6;
}
.device_text {
  max-width: 28rem;
  font-size: 1.4rem;
}
.device_note {
  font-size: 1.2rem;
}

.recommend {
  flex: none;
  width: 29rem;
}
@media screen and (max-width: 767px) {
  .recommend {
    width: 100%;
    max-width: 29rem;
  }
}
.recommend {
  padding: 1.2rem 1.4rem 1rem 1.7rem;
  border-radius: 0.5rem;
  background: #ECE6FA;
}
.recommend_ttl {
  font-size: 1.4rem;
  font-weight: 700;
  text-align: center;
  white-space: nowrap;
}
@media screen and (max-width: 389px) {
  .recommend_ttl {
    white-space: normal;
  }
}
.recommend_ttl span {
  background: linear-gradient(transparent 60%, #FFE100 60%);
}
.recommend_body {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: 0.9rem;
}
.recommend_body p {
  width: 14.9rem;
  font-size: 1.2rem;
  line-height: 2rem;
}
@media screen and (max-width: 389px) {
  .recommend_body p {
    flex: 1;
    width: auto;
  }
}
.recommend_body strong {
  font-weight: 900;
  color: #FF3250;
}
.recommend_body img {
  width: 10.1rem;
}
@media screen and (max-width: 389px) {
  .recommend_body img {
    width: 8rem;
  }
}

.pay {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.6rem;
  width: 100%;
  max-width: 58rem;
  text-align: center;
  line-height: 1.5;
}
.pay_lead {
  font-size: 1.6rem;
}
.pay_cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  width: 25.6rem;
}
.pay_cards li:nth-child(1) img {
  width: 7.16rem;
}
.pay_cards li:nth-child(2) img {
  width: 7.29rem;
}
.pay_cards li:nth-child(3) img {
  width: 4.55rem;
}
.pay_cards li:nth-child(4) img {
  width: 5.8rem;
}
.pay_cards li:nth-child(5) img {
  width: 5.9rem;
}
.pay_brand {
  font-size: 1.4rem;
}

.apply_head {
  max-width: 70rem;
  margin: 9rem auto 0;
  padding-top: 4rem;
}
@media screen and (max-width: 767px) {
  .apply_head {
    max-width: 34rem;
    margin-top: 5.6rem;
    padding-top: 1.5rem;
  }
}
.apply_head-box {
  position: relative;
  display: flex;
  justify-content: center;
  height: 9.8rem;
  padding-top: 1.7rem;
  border-radius: 1rem;
  background: #A082E6;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .apply_head-box {
    justify-content: flex-end;
    height: 9.9rem;
    padding: 1rem 1.5rem;
    border-radius: 0.5rem;
  }
}
.apply_head-chara {
  position: absolute;
  top: -4rem;
  left: 2.3rem;
  width: 10.8rem;
}
@media screen and (max-width: 767px) {
  .apply_head-chara {
    top: -1.5rem;
    left: 0.9rem;
    width: 9.8rem;
  }
}
.apply_head-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.1rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .apply_head-text {
    gap: 0.4rem;
  }
}
.apply_head-lead {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .apply_head-lead {
    font-size: 1.2rem;
  }
}
.apply_head-lead::before, .apply_head-lead::after {
  content: "";
  width: 0.9rem;
  height: 1.4rem;
  background: url(../img/lineup/apply_slash.svg) no-repeat center/contain;
}
.apply_head-lead::after {
  transform: scaleX(-1);
}
.apply_head-ttl {
  font-weight: 900;
  line-height: 2.9rem;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  .apply_head-ttl {
    display: flex;
    flex-direction: column;
  }
}
.apply_head-ttl b {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-weight: 700;
  line-height: 1;
}
.apply_head-ttl small {
  font-size: 2.1rem;
  font-weight: 700;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .apply_head-ttl small {
    font-size: 1.6rem;
  }
}
.apply_head-ttl .days {
  font-size: 2.1rem;
}
@media screen and (max-width: 767px) {
  .apply_head-ttl .days {
    font-size: 1.6rem;
  }
}
.apply_head-ttl .days b {
  font-size: 3.2rem;
}
@media screen and (max-width: 767px) {
  .apply_head-ttl .days b {
    font-size: 2.7rem;
  }
}
@media screen and (max-width: 767px) {
  .apply_head-ttl .days small {
    font-weight: 900;
  }
}
.apply_head-ttl .sim {
  font-size: 2.6rem;
}
@media screen and (max-width: 767px) {
  .apply_head-ttl .sim {
    margin-top: -0.2rem;
    font-size: 2.1rem;
  }
}
.apply_head-ttl .sim b {
  font-size: 2.8rem;
}
@media screen and (max-width: 767px) {
  .apply_head-ttl .sim b {
    font-size: 2.3rem;
  }
}

.apply_link {
  margin-top: 1.8rem;
  font-size: 1.2rem;
  font-weight: 700;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .apply_link {
    margin-top: 0.8rem;
  }
}
.apply_link a {
  color: #46C9F4;
}
.apply_link a::after {
  content: "";
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  margin-left: 0.5rem;
  background: url(../img/common/icon_external.svg) no-repeat center/contain;
  vertical-align: -0.3rem;
}
.apply_link a {
  text-decoration: underline;
  text-underline-offset: 0.2rem;
}
@media (hover: hover) and (min-width: 992px) {
  .apply_link a:hover {
    text-decoration: none;
  }
}

.buy {
  padding: 6rem 0;
  background: #A082E6;
}
@media screen and (max-width: 767px) {
  .buy {
    padding: 2rem 0;
  }
}
@media screen and (max-width: 767px) {
  .buy .container {
    padding: 0 2rem;
  }
}
.buy_intro {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 0.5rem;
  width: fit-content;
  margin: 0 auto;
  font-size: 1.6rem;
  font-weight: 700;
  color: #fff;
  text-align: center;
  line-height: 1.5;
}
.buy_intro::after {
  content: "";
  flex: none;
  width: 2rem;
  height: 2.4rem;
  background: url(../img/common/icon_external_white.svg) no-repeat center bottom/2.4rem auto;
}
.buy_intro u {
  text-decoration: underline;
  text-underline-offset: 0.2rem;
}
@media (hover: hover) and (min-width: 992px) {
  .buy_intro:hover u {
    text-decoration: none;
  }
}
.buy_card {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 8.8rem;
  max-width: 103.1rem;
  margin: 4rem auto 0;
  padding: 6rem 2rem;
  border-radius: 1rem;
  background: #fff;
}
@media screen and (max-width: 991px) {
  .buy_card {
    gap: 4rem;
  }
}
@media screen and (max-width: 767px) {
  .buy_card {
    flex-direction: column;
    align-items: center;
    gap: 3rem;
    margin-top: 1rem;
    padding: 3rem 2rem;
  }
}
@media screen and (max-width: 389px) {
  .buy_card {
    padding: 3rem 1.6rem;
  }
}
.buy_left {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: none;
  gap: 2rem;
  width: 28.2rem;
  max-width: 100%;
}
@media screen and (max-width: 767px) {
  .buy_left {
    gap: 3rem;
  }
}
.buy_left .btn {
  letter-spacing: -0.08em;
}
.buy_left picture {
  width: 100%;
}
.buy_product {
  width: 28.2rem;
}
@media screen and (max-width: 767px) {
  .buy_product {
    width: 21.5rem;
  }
}
.buy_type {
  width: 100%;
}
.buy_right {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
  width: 42.2rem;
}
@media screen and (max-width: 767px) {
  .buy_right {
    gap: 3rem;
    width: 100%;
    max-width: 29.2rem;
  }
}
.buy_bar {
  width: 100%;
  padding: 0.8rem 1.6rem;
  border-radius: 1rem;
  background: #FFE100;
  font-size: 1.4rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .buy_bar br {
    display: none;
  }
}
.buy_selects {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .buy_selects {
    max-width: 28.5rem;
  }
}
.buy_select {
  position: relative;
  display: block;
}
.buy_select::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 1.75rem;
  width: 1.8rem;
  height: 1.1rem;
  background: url(../img/common/select_arrow.svg) no-repeat center/contain;
  transform: translateY(-50%);
  pointer-events: none;
}
.buy_select select {
  width: 100%;
  height: 4.5rem;
  padding: 0 5rem 0 1.9rem;
  border: 1px solid #333;
  border-radius: 0.5rem;
  background: #fff;
  font-family: "GenJyuuGothic", sans-serif;
  font-size: 1.4rem;
  font-weight: 500;
  color: #333;
  appearance: none;
  text-overflow: ellipsis;
  cursor: pointer;
}
.buy_select select:invalid {
  color: #949494;
}
.buy_select select option {
  color: #333;
}
.buy_select.fixed::after {
  display: none;
}
.buy_select.fixed select {
  pointer-events: none;
}
.buy_btn {
  border-color: #333;
  background: #949494;
  color: #fff;
  box-shadow: 0.2rem 0.5rem 0 -2px #fff, 0.2rem 0.5rem 0 0 #333;
}
.buy_btn b {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 2rem;
}
.buy_btn::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 1.2rem;
  width: 3.2rem;
  height: 3.2rem;
  background: url(../img/common/icon_cart.svg) no-repeat center/3.1rem auto;
  transform: translateY(-50%);
}
.buy_btn::after {
  background-image: url(../img/common/btn_arrow_white.svg);
}
.buy_btn:not(:disabled) {
  background: #FF3250;
}
@media (hover: hover) and (min-width: 992px) {
  .buy_btn:not(:disabled):hover {
    box-shadow: 0 0 0 -2px #fff, 0 0 0 0 #333;
  }
}
.buy_btn:disabled {
  cursor: default;
}
@media (hover: hover) and (min-width: 992px) {
  .buy_btn:disabled:hover {
    transform: none;
    box-shadow: 0.2rem 0.5rem 0 -2px #fff, 0.2rem 0.5rem 0 0 #333;
  }
}
.buy_notes {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .buy_notes {
    max-width: 28.2rem;
  }
}
.buy_notes {
  font-size: 1.2rem;
  line-height: 1.5;
}
.buy_notes li {
  position: relative;
  padding-left: 1.5rem;
}
.buy_notes li::before {
  content: "※";
  position: absolute;
  top: 0.2rem;
  left: 0;
  font-size: 1.07rem;
}
.buy_notes .pdf {
  color: #46C9F4;
  text-decoration: underline;
  text-underline-offset: 0.2rem;
}
@media (hover: hover) and (min-width: 992px) {
  .buy_notes .pdf:hover {
    text-decoration: none;
  }
}

@media screen and (max-width: 767px) {
  #lineup ~ .footer,
  #lineup30 ~ .footer,
  #theft ~ .footer,
  #compare ~ .footer,
  #network ~ .footer,
  #price ~ .footer,
  #call ~ .footer,
  #roaming ~ .footer {
    margin-top: 5.6rem;
  }
}

.notice {
  width: 100%;
  border-top: 1.5px solid #333;
  border-bottom: 1.5px solid #333;
}
.notice summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.9rem 1.2rem 1rem;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  list-style: none;
  cursor: pointer;
}
.notice summary::-webkit-details-marker {
  display: none;
}
.notice summary::after {
  content: "";
  width: 1.4rem;
  height: 1.4rem;
  background: linear-gradient(#333, #333) no-repeat center/1.3rem 0.3rem, linear-gradient(#333, #333) no-repeat center/0.3rem 1.3rem;
  transition: transform 0.3s;
}
.notice[open] summary::after {
  transform: rotate(45deg);
}
.notice_list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0 1.2rem 1rem;
  font-size: 1.2rem;
  line-height: 1.5;
}
.notice_list li {
  position: relative;
  padding-left: 2rem;
}
.notice_list li::before {
  content: "●";
  position: absolute;
  top: -0.1rem;
  left: 0;
  width: 1.8rem;
  font-size: 1.4rem;
  text-align: center;
}

#lineup30 .check {
  background: radial-gradient(circle, #FFF9CC 0.3rem, transparent 0.31rem) 0 0/2.7rem 2.622rem, radial-gradient(circle, #FFF9CC 0.3rem, transparent 0.31rem) 1.3rem 1.311rem/2.7rem 2.622rem;
}
#lineup30 .check_badge {
  background-image: url(../img/lineup/check_tag_dark.svg);
}
#lineup30 .check_card-bar {
  background: #A082E6;
  color: #fff;
}
#lineup30 .device_col h4 {
  background: #FFE100;
  color: #333;
}
@media screen and (max-width: 767px) {
  #lineup30 .apply_head {
    padding-top: 1.7rem;
  }
}
#lineup30 .apply_head-box {
  background: #FFE100;
  color: #333;
}
@media screen and (max-width: 767px) {
  #lineup30 .apply_head-box {
    height: 10.3rem;
  }
}
#lineup30 .apply_head-chara {
  top: -3.6rem;
  left: 2.6rem;
  width: 10.3rem;
}
@media screen and (max-width: 767px) {
  #lineup30 .apply_head-chara {
    top: -1.4rem;
    left: 0.8rem;
    width: 9.5rem;
  }
}
#lineup30 .apply_head-lead::before, #lineup30 .apply_head-lead::after {
  width: 0.8rem;
  height: 1.2rem;
  background-image: url(../img/lineup/apply_slash_dark.svg);
}
@media screen and (max-width: 767px) {
  #lineup30 .apply_head-ttl .sim b {
    font-size: 2.1rem;
  }
}
#lineup30 .buy {
  background: #FFE100;
}
#lineup30 .buy_intro {
  color: #333;
}
#lineup30 .buy_intro::after {
  background-image: url(../img/common/icon_external_large.svg);
}
#lineup30 .buy_bar {
  background: #A082E6;
  color: #fff;
}

#theft {
  line-break: strict;
}
#theft .theft {
  padding-top: 14.4rem;
}
@media screen and (max-width: 767px) {
  #theft .theft {
    padding-top: 5.6rem;
  }
}
#theft .theft .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4rem;
}
@media screen and (max-width: 767px) {
  #theft .theft .container {
    gap: 3rem;
  }
}
#theft .theft_head {
  display: flex;
  align-items: center;
  gap: 2.5rem;
}
@media screen and (max-width: 767px) {
  #theft .theft_head {
    gap: 1.6rem;
  }
}
#theft .theft_head img {
  width: 8.6rem;
}
@media screen and (max-width: 767px) {
  #theft .theft_head img {
    width: 6.6rem;
  }
}
#theft .theft_head h2 {
  font-size: 2.4rem;
  font-weight: 900;
  line-height: 4.35rem;
}
@media screen and (max-width: 767px) {
  #theft .theft_head h2 {
    font-size: 2.1rem;
  }
}
#theft .theft_bar {
  width: 100%;
  padding: 1.35rem 1.6rem;
  border-radius: 1rem;
  background: #A082E6;
  font-size: 2.1rem;
  font-weight: 700;
  color: #fff;
  text-align: center;
  line-height: 2.6rem;
}
@media screen and (max-width: 767px) {
  #theft .theft_bar {
    padding: 0.8rem 1.6rem;
    font-size: 1.4rem;
    line-height: 1.5;
  }
}
#theft .theft_lead {
  font-size: 2.1rem;
  font-weight: 700;
  text-align: center;
  line-height: 2.6rem;
}
@media screen and (max-width: 767px) {
  #theft .theft_lead {
    font-size: 1.6rem;
    line-height: 1.5;
  }
}
#theft .cover {
  position: relative;
  width: 100%;
  padding-top: 2.6rem;
}
@media screen and (max-width: 767px) {
  #theft .cover {
    padding-top: 2rem;
  }
}
#theft .cover_label {
  position: absolute;
  top: 0;
  left: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 5.6rem;
  padding: 0 3.1rem;
  border-radius: 10rem;
  background: #A082E6;
  font-size: 2.1rem;
  font-weight: 900;
  color: #fff;
  line-height: 2.9rem;
  white-space: nowrap;
  transform: translateX(-50%);
  z-index: 1;
}
@media screen and (max-width: 767px) {
  #theft .cover_label {
    height: 4rem;
    padding: 0 3.6rem;
  }
}
#theft .cover_label b {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 2.4rem;
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  #theft .cover_label b {
    font-size: 2.3rem;
  }
}
#theft .cover_label small {
  font-size: 1.6rem;
}
#theft .cover_body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3.5rem;
  padding: 5.4rem 4.8rem 3.8rem;
  border: 2px solid #A082E6;
  border-radius: 1rem;
  background: #fff;
}
@media screen and (max-width: 767px) {
  #theft .cover_body {
    gap: 2rem;
    padding: 3.8rem 3.2rem 1.8rem;
  }
}
@media screen and (max-width: 389px) {
  #theft .cover_body {
    padding: 3.8rem 1.6rem 1.8rem;
  }
}
#theft .cover_intro {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  font-size: 1.6rem;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  #theft .cover_intro {
    gap: 2rem;
  }
}
#theft .cover_intro .em {
  font-weight: 700;
  color: #A082E6;
}
#theft .cover_price {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  width: 100%;
  height: 13.5rem;
  padding: 0 2.3rem 0 1.7rem;
  border-radius: 1rem;
  background: #A082E6;
}
@media screen and (max-width: 991px) {
  #theft .cover_price {
    flex-direction: column;
    gap: 1rem;
    width: auto;
    max-width: 100%;
    height: auto;
    padding: 2.5rem 3rem;
  }
}
@media screen and (max-width: 389px) {
  #theft .cover_price {
    padding: 2.5rem 1.6rem;
  }
}
#theft .cover_price-pay {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: none;
  gap: 0.6rem;
  width: 21.2rem;
}
@media screen and (max-width: 991px) {
  #theft .cover_price-pay {
    gap: 1rem;
  }
}
#theft .cover_price-pay p {
  font-size: 1.7rem;
  font-weight: 700;
  color: #fff;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 991px) {
  #theft .cover_price-pay p {
    font-size: 1.8rem;
  }
}
#theft .cover_price-pay b {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 1.9rem;
}
@media screen and (max-width: 991px) {
  #theft .cover_price-pay b {
    font-size: 2rem;
  }
}
#theft .cover_price-pay span {
  display: block;
  width: 100%;
  height: 2.5rem;
  border-radius: 1.25rem;
  background: #FFE100;
  font-size: 1.4rem;
  font-weight: 700;
  text-align: center;
  line-height: 2.5rem;
}
#theft .cover_price-list {
  display: flex;
  gap: 1.6rem;
}
@media screen and (max-width: 991px) {
  #theft .cover_price-list {
    flex-direction: column;
    gap: 1rem;
  }
}
#theft .cover_price-list li {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
  width: 21rem;
  height: 8.4rem;
  padding-top: 1rem;
  border: 1px solid #333;
  border-radius: 1rem;
  background: #fff;
}
@media screen and (max-width: 991px) {
  #theft .cover_price-list li {
    gap: 0;
    width: 21.2rem;
    height: 7.1rem;
    padding-top: 0.7rem;
  }
}
#theft .cover_price-list .tags {
  display: flex;
  gap: 1rem;
}
#theft .cover_price-list .tags span {
  display: flex;
  justify-content: center;
  align-items: baseline;
  width: 9rem;
  height: 2rem;
  border-radius: 0.5rem;
  background: #333;
  font-size: 1.3rem;
  font-weight: 900;
  color: #fff;
  line-height: 1.8rem;
}
#theft .cover_price-list .tags b {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 2rem;
  font-weight: 700;
}
#theft .cover_price-list .tags small {
  margin-left: 0.2rem;
  font-size: 1rem;
}
#theft .cover_price-list .price {
  font-size: 1.9rem;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}
@media screen and (max-width: 991px) {
  #theft .cover_price-list .price {
    font-size: 1.6rem;
  }
}
#theft .cover_price-list .price b {
  margin-right: 0.3rem;
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 4.3rem;
  font-weight: 700;
  color: #A082E6;
  -webkit-text-stroke: 1.6px #333;
  paint-order: stroke fill;
}
@media screen and (max-width: 991px) {
  #theft .cover_price-list .price b {
    font-size: 3.3rem;
  }
}
#theft .cover_price-list .price small {
  font-size: 1.6rem;
}
@media screen and (max-width: 991px) {
  #theft .cover_price-list .price small {
    font-size: 1.2rem;
  }
}
#theft .cover_terms {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.8rem;
  width: 100%;
  text-align: center;
}
@media screen and (max-width: 767px) {
  #theft .cover_terms {
    gap: 2rem;
  }
}
#theft .cover_terms h4 {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 3.5rem;
  border: 1px solid #333;
  border-radius: 10rem;
  background: #ECE6FA;
  font-size: 1.6rem;
  font-weight: 700;
}
#theft .cover_terms h4 b {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 1.8rem;
}
#theft .cover_terms p {
  margin-top: 1.6rem;
  font-size: 1.6rem;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  #theft .cover_terms p {
    margin-top: 0;
  }
}
#theft .cover_terms-link {
  font-size: 1.6rem;
  color: #46C9F4;
  line-height: 1.5;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  #theft .cover_terms-link {
    font-size: 1.4rem;
  }
}
@media screen and (max-width: 389px) {
  #theft .cover_terms-link {
    white-space: normal;
  }
}
#theft .cover_terms-link::after {
  content: "";
  display: inline-block;
  width: 2rem;
  height: 2rem;
  background: url(../img/common/icon_external.svg) no-repeat center/1.47rem auto;
  vertical-align: -0.4rem;
}
@media screen and (max-width: 767px) {
  #theft .cover_terms-link::after {
    width: 1.5rem;
    height: 1.5rem;
    background-size: 1.1rem auto;
    vertical-align: -0.2rem;
  }
}
#theft .cover_terms-link {
  text-decoration: underline;
  text-underline-offset: 0.2rem;
}
@media (hover: hover) and (min-width: 992px) {
  #theft .cover_terms-link:hover {
    text-decoration: none;
  }
}
#theft .cover.phone {
  padding-top: 2.55rem;
}
@media screen and (max-width: 767px) {
  #theft .cover.phone {
    padding-top: 3rem;
  }
}
#theft .phone .cover_label {
  padding: 0 2.9rem;
  background: #FFE100;
  color: #333;
}
@media screen and (max-width: 767px) {
  #theft .phone .cover_label {
    flex-direction: column;
    gap: 0.2rem;
    height: 6rem;
    padding: 0 2.3rem;
    line-height: 1.2;
  }
}
#theft .phone .cover_label b {
  font-family: "GenJyuuGothic", sans-serif;
  font-size: 1.6rem;
  font-weight: 900;
}
@media screen and (max-width: 767px) {
  #theft .phone .cover_label b {
    font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
    font-size: 1.8rem;
    font-weight: 700;
  }
}
#theft .phone .cover_body {
  padding: 5.35rem 4.8rem 7.5rem;
  border-color: #FFE100;
  border-bottom: none;
  border-radius: 1rem 1rem 0 0;
}
@media screen and (max-width: 767px) {
  #theft .phone .cover_body {
    padding: 3.8rem 3.2rem 2rem;
  }
}
@media screen and (max-width: 389px) {
  #theft .phone .cover_body {
    padding: 3.8rem 1.6rem 2rem;
  }
}
#theft .phone .cover_intro {
  gap: 0.5rem;
  line-height: 2.6rem;
}
@media screen and (max-width: 767px) {
  #theft .phone .cover_intro {
    gap: 2rem;
    line-height: 1.5;
  }
}
#theft .phone .cover_price {
  background: #FFE100;
}
#theft .phone .cover_price-pay p {
  color: #333;
}
#theft .phone .cover_price-pay span {
  background: #A082E6;
  color: #fff;
}
#theft .phone .cover_price-list .price b {
  color: #FFE100;
}
#theft .phone .cover_terms h4 {
  background: #FFF6B2;
}
#theft .claim {
  padding: 4.7rem 5rem 4.4rem;
  border-radius: 0 0 1rem 1rem;
  background: #FFE100;
}
@media screen and (max-width: 767px) {
  #theft .claim {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem 2.5rem;
  }
}
@media screen and (max-width: 389px) {
  #theft .claim {
    padding: 2rem 1.5rem;
  }
}
#theft .claim_ttl {
  width: 100%;
  height: 3.57rem;
  border-radius: 10rem;
  background: #333;
  font-size: 1.6rem;
  font-weight: 700;
  color: #fff;
  text-align: center;
  line-height: 3.57rem;
}
@media screen and (max-width: 767px) {
  #theft .claim_ttl {
    max-width: 29rem;
    height: 3.5rem;
    line-height: 3.5rem;
  }
}
#theft .claim_list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 3rem;
  margin-top: 4rem;
}
@media screen and (max-width: 767px) {
  #theft .claim_list {
    display: block;
    width: 100%;
    max-width: 29rem;
    margin-top: 2rem;
  }
}
#theft .claim_list .slick-track {
  display: flex;
}
#theft .claim_list .slick-slide {
  height: auto;
}
#theft .claim_item {
  display: flex;
  flex-direction: column;
  min-height: 31.2rem;
  padding: 1.85rem 3.3rem 2.4rem;
  border: 2px solid #333;
  border-radius: 1rem;
  background: #fff;
}
@media screen and (max-width: 767px) {
  #theft .claim_item {
    align-items: center;
    min-height: 48rem;
    padding: 2.2rem;
  }
}
#theft .claim_item-head {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-left: -1.2rem;
}
@media screen and (max-width: 767px) {
  #theft .claim_item-head {
    flex-direction: column;
    gap: 0.4rem;
    margin-left: 0;
  }
}
#theft .claim_item-head h5 {
  font-size: 1.8rem;
  font-weight: 700;
  color: #A082E6;
  line-height: 2.6rem;
}
@media screen and (max-width: 767px) {
  #theft .claim_item-head h5 {
    text-align: center;
  }
}
#theft .claim_item-text {
  margin-top: 1.5rem;
  font-size: 1.6rem;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  #theft .claim_item-text {
    width: 23.3rem;
    max-width: 100%;
    margin-top: 1.6rem;
  }
}
#theft .claim_item-link {
  align-self: flex-start;
  margin-top: 2rem;
  font-size: 1.4rem;
  color: #46C9F4;
  line-height: 1.5;
}
#theft .claim_item-link::after {
  content: "";
  display: inline-block;
  width: 2rem;
  height: 2rem;
  margin-left: 0.5rem;
  background: url(../img/common/icon_external.svg) no-repeat center/1.47rem auto;
  vertical-align: -0.5rem;
}
#theft .claim_item-link {
  text-decoration: underline;
  text-underline-offset: 0.2rem;
}
@media (hover: hover) and (min-width: 992px) {
  #theft .claim_item-link:hover {
    text-decoration: none;
  }
}
#theft .claim_item-fee {
  display: flex;
  align-self: center;
  width: 30.45rem;
  max-width: 100%;
  height: 4rem;
  margin-top: 2rem;
}
@media screen and (max-width: 767px) {
  #theft .claim_item-fee {
    width: 22.7rem;
    margin-top: 1.6rem;
  }
}
#theft .claim_item-fee {
  border: 2px solid #333;
  border-radius: 0.5rem;
  overflow: hidden;
}
#theft .claim_item-fee dt {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: none;
  width: 11.9rem;
  border-right: 2px solid #333;
  background: #FFE100;
  font-size: 1.7rem;
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  #theft .claim_item-fee dt {
    width: 8.1rem;
    font-size: 1.6rem;
    font-weight: 500;
  }
}
#theft .claim_item-fee dd {
  flex: 1;
  font-size: 1.5rem;
  font-weight: 700;
  text-align: center;
  line-height: 3.6rem;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  #theft .claim_item-fee dd {
    font-size: 1.4rem;
  }
}
#theft .claim_item-fee b {
  margin-right: 0.1rem;
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 2.4rem;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  #theft .claim_item-fee b {
    font-size: 2.3rem;
  }
}
#theft .claim_item-fee small {
  font-size: 1.3rem;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  #theft .claim_item-fee small {
    font-size: 1.2rem;
  }
}
#theft .claim_item-note {
  margin-top: 1.5rem;
  font-size: 1.2rem;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  #theft .claim_item-note {
    width: 23.3rem;
    max-width: 100%;
    margin-top: 1.6rem;
  }
}
#theft .claim_item-note.far {
  margin-top: 2.3rem;
}
@media screen and (max-width: 767px) {
  #theft .claim_item-note.far {
    margin-top: 3.2rem;
  }
}
#theft .claim_controls {
  display: none;
}
@media screen and (max-width: 767px) {
  #theft .claim_controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 29rem;
    margin-top: 2rem;
  }
}
#theft .claim_controls .slick-arrow {
  order: 1;
  width: 3rem;
  height: 3rem;
  background: url(../img/common/icon_slider_arrow_yellow.svg) no-repeat center/contain;
  font-size: 0;
}
#theft .claim_controls .slick-arrow.slick-next {
  order: 3;
  transform: rotate(180deg);
}
#theft .claim_controls .slick-arrow.slick-disabled {
  opacity: 0.5;
  cursor: default;
}
#theft .claim_controls .slick-dots {
  order: 2;
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
#theft .claim_controls .slick-dots li {
  display: flex;
  align-items: center;
}
#theft .claim_controls .slick-dots button {
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  background: #fff;
  font-size: 0;
}
#theft .claim_controls .slick-dots .slick-active button {
  width: 1.5rem;
  height: 1.5rem;
}

#compare .compare {
  padding-top: 14.4rem;
}
@media screen and (max-width: 767px) {
  #compare .compare {
    padding-top: 5.6rem;
  }
}
#compare .compare .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6.4rem;
}
@media screen and (max-width: 767px) {
  #compare .compare .container {
    gap: 2.4rem;
  }
}
#compare .compare_lead {
  font-size: 1.6rem;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  #compare .compare_lead {
    padding: 0 2.4rem;
    text-align: left;
  }
}
#compare .compare_notes {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: 100%;
  font-size: 1.2rem;
  line-height: 1.5;
}
#compare .compare_notes li {
  position: relative;
  padding-left: 1.5rem;
}
#compare .compare_notes li::before {
  content: "※";
  position: absolute;
  top: 0.2rem;
  left: 0;
  font-size: 1.07rem;
}
#compare .network_box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.6rem;
  width: 100%;
  max-width: 92rem;
  padding: 2.4rem;
  border-radius: 1rem;
  background: #A082E6;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #compare .network_box {
    padding: 2.4rem 0;
  }
}
#compare .network_box-ttl {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  font-size: 2.1rem;
  font-weight: 900;
  text-align: center;
  line-height: 1.5;
}
#compare .network_box-ttl img {
  width: 9.3rem;
}
#compare .network_box-ttl b {
  font-size: 2.5rem;
  font-weight: 900;
}
#compare .network_box-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: 1fr auto auto auto 1fr;
  grid-template-areas: ". cards" "text cards" "note cards" "btn cards" ". cards";
  column-gap: 2.4rem;
  width: 100%;
}
@media screen and (max-width: 991px) {
  #compare .network_box-body {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.6rem;
  }
}
#compare .network_box-text {
  grid-area: text;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  #compare .network_box-text {
    padding: 0 2.4rem;
  }
}
#compare .network_box-text em {
  color: #FFE100;
}
#compare .network_box-note {
  grid-area: note;
  margin-top: 0.8rem;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (max-width: 991px) {
  #compare .network_box-note {
    margin-top: 0;
  }
}
@media screen and (max-width: 767px) {
  #compare .network_box-note {
    padding: 0 1.6rem;
  }
}
#compare .network_box-btn {
  grid-area: btn;
  margin-top: 0.8rem;
  font-size: 1.6rem;
  color: #333;
}
@media screen and (max-width: 991px) {
  #compare .network_box-btn {
    margin-top: 0;
  }
}
#compare .network_box-cards {
  grid-area: cards;
  display: flex;
  align-items: flex-end;
  gap: 1.6rem;
  padding-top: 1.3rem;
}
@media screen and (max-width: 767px) {
  #compare .network_box-cards {
    gap: 0.8rem;
    padding-top: 1rem;
  }
}
@media screen and (max-width: 389px) {
  #compare .network_box-cards {
    width: 100%;
    padding: 1rem 1.2rem 0;
  }
}
#compare .network_box-cards li {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.8rem;
  width: 15.2rem;
  height: 18.9rem;
  padding: 1.6rem;
  border-radius: 0.5rem;
  background: #fff;
  color: #333;
}
@media screen and (max-width: 767px) {
  #compare .network_box-cards li {
    width: 10rem;
    height: 19.5rem;
    padding: 1.2rem 0.8rem 0.8rem;
  }
}
@media screen and (max-width: 389px) {
  #compare .network_box-cards li {
    flex: 1;
    width: auto;
    min-width: 0;
    padding: 1.2rem 0.4rem 0.8rem;
  }
}
#compare .network_box-cards dl {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  width: 100%;
  text-align: center;
}
#compare .network_box-cards dt {
  width: 10rem;
  padding: 0.1rem 0;
  border-radius: 10rem;
  background: #949494;
  font-size: 1.2rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  #compare .network_box-cards dt {
    width: 8.5rem;
    max-width: 100%;
  }
}
#compare .network_box-cards dt:nth-of-type(2) {
  margin-top: 0.4rem;
}
@media screen and (max-width: 767px) {
  #compare .network_box-cards dt:nth-of-type(2) {
    width: 8rem;
  }
}
#compare .network_box-cards dd {
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.5;
}
#compare .network_box-cards dd.brand {
  font-size: 1.8rem;
  font-weight: 900;
  color: #A082E6;
}
@media screen and (max-width: 767px) {
  #compare .network_box-cards dd.brand {
    line-height: 1.2;
  }
}
#compare .network_box-icon {
  width: 4.5rem;
}
#compare .network_box-ribbon {
  position: absolute;
  top: -1.3rem;
  left: 1.7rem;
  width: 11.8rem;
}
@media screen and (max-width: 767px) {
  #compare .network_box-ribbon {
    top: -1rem;
    left: 0;
    width: 10rem;
  }
}
@media screen and (max-width: 389px) {
  #compare .network_box-ribbon {
    width: 100%;
  }
}
#compare .cmp {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6.4rem;
  width: 100%;
}
@media screen and (max-width: 767px) {
  #compare .cmp {
    gap: 2.4rem;
  }
}
#compare .cmp_tabs {
  display: flex;
  gap: 0.8rem;
  padding: 0.8rem;
  border: 2px solid #333;
  border-radius: 10rem;
  background: #fff;
}
@media screen and (max-width: 389px) {
  #compare .cmp_tabs {
    gap: 0.4rem;
    padding: 0.6rem;
  }
}
#compare .cmp_tab {
  padding: 0.8rem 1.6rem;
  border-radius: 10rem;
  background: #ECE6FA;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
  transition: background 0.3s, color 0.3s;
}
@media screen and (max-width: 389px) {
  #compare .cmp_tab {
    padding: 0.8rem 1.1rem;
    font-size: 1.3rem;
  }
}
#compare .cmp_tab.is-active {
  background: #A082E6;
  color: #fff;
}
@media (hover: hover) and (min-width: 992px) {
  #compare .cmp_tab:hover {
    background: #A082E6;
    color: #fff;
  }
}
#compare .cmp_body {
  display: flex;
  flex-direction: column;
  gap: 4rem;
  width: 100%;
}
@media screen and (max-width: 767px) {
  #compare .cmp_body {
    gap: 2.4rem;
  }
}
#compare .cmp_network {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2.4rem;
}
#compare .cmp_network img {
  width: 15rem;
}
#compare .cmp_network h3 {
  display: flex;
  flex-direction: column;
  font-size: 2.1rem;
  font-weight: 900;
  text-align: center;
  line-height: 1.5;
}
#compare .cmp_network small {
  font-size: 1.6rem;
  font-weight: 500;
}
#compare .cmp_plans {
  position: sticky;
  top: 6rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3.2rem;
  background: #fff;
  z-index: 5;
}
@media screen and (max-width: 767px) {
  #compare .cmp_plans {
    top: 10.4rem;
    gap: 0.8rem;
  }
}
#compare .cmp_plans li {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 1rem 0.4rem;
  border-radius: 1rem;
  background: #FFE100;
  font-size: 1.4rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  #compare .cmp_plans li {
    line-height: 1.25;
  }
}
#compare .cmp_plans small {
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1.5;
}
#compare .cmp_cat {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}
#compare .cmp_cat-ttl {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding-top: 0.8rem;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.5;
}
#compare .cmp_cat-ttl img {
  width: 2rem;
}
#compare .cmp_row {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}
#compare .cmp_row-label {
  padding: 0.8rem 1.6rem;
  border-radius: 0.5rem;
  background: #FFF6B2;
  font-size: 1.4rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
}
#compare .cmp_row-label small {
  font-size: 1.2rem;
}
#compare .cmp_row-vals {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3.2rem;
}
@media screen and (max-width: 767px) {
  #compare .cmp_row-vals {
    gap: 0.8rem;
  }
}
#compare .cmp_row-vals li {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}
#compare .cmp_row-vals li:not(:first-child)::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -1.65rem;
  width: 1px;
  background: #EDEDED;
}
@media screen and (max-width: 767px) {
  #compare .cmp_row-vals li:not(:first-child)::before {
    left: -0.45rem;
  }
}
#compare .cmp_val {
  font-size: 1.4rem;
  text-align: center;
  line-height: 1.5;
}
#compare .cmp_val small {
  display: block;
  margin-top: 0.2rem;
  font-size: 1.2rem;
  color: #949494;
}
#compare .cmp_notice {
  padding: 0.8rem 1.6rem;
  border-radius: 0.5rem;
  background: #A082E6;
  font-size: 1.4rem;
  font-weight: 700;
  color: #fff;
  text-align: center;
  line-height: 1.5;
}
#compare .cmp_notice small {
  display: block;
  font-size: 1.2rem;
}
#compare .cmp_deal {
  position: relative;
  flex: none;
  margin-right: 1.6rem;
  padding: 0.4rem 1.6rem;
  border-radius: 10rem;
  background: #FFE100;
  font-size: 1.2rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  #compare .cmp_deal {
    margin: 0;
    padding: 0.4rem 1.2rem;
  }
}
#compare .cmp_deal::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -0.58rem;
  border: 0 solid transparent;
  border-width: 0.53rem 0 0.53rem 0.95rem;
  border-left-color: #FFE100;
  transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
  #compare .cmp_deal::after {
    top: auto;
    right: auto;
    bottom: calc(100% - 1px);
    left: 50%;
    border-width: 0 0.55rem 0.7rem;
    border-left-color: transparent;
    border-bottom-color: #FFE100;
    transform: translateX(-50%);
  }
}
#compare .cmp_deal b {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 1.6rem;
}
#compare .cmp_deal em {
  font-weight: 900;
}
@media screen and (max-width: 767px) {
  #compare .yearly .cmp_row-vals {
    grid-template-rows: auto auto;
    row-gap: 1.6rem;
  }
}
#compare .yearly .cmp_row-vals li {
  align-items: center;
}
@media screen and (max-width: 767px) {
  #compare .yearly .cmp_row-vals li {
    display: contents;
  }
}
@media screen and (max-width: 767px) {
  #compare .yearly .cmp_row-vals li::before {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  #compare .yearly .cmp_row-vals li:nth-child(1) .cmp_val,
  #compare .yearly .cmp_row-vals li:nth-child(1) .cmp_deal {
    grid-column: 1;
  }
}
@media screen and (max-width: 767px) {
  #compare .yearly .cmp_row-vals li:nth-child(1) .cmp_val {
    position: relative;
    grid-row: 1;
  }
}
@media screen and (max-width: 767px) {
  #compare .yearly .cmp_row-vals li:nth-child(1) .cmp_deal {
    grid-row: 2;
    justify-self: center;
  }
}
@media screen and (max-width: 767px) {
  #compare .yearly .cmp_row-vals li:nth-child(2) .cmp_val,
  #compare .yearly .cmp_row-vals li:nth-child(2) .cmp_deal {
    grid-column: 2;
  }
}
@media screen and (max-width: 767px) {
  #compare .yearly .cmp_row-vals li:nth-child(2) .cmp_val {
    position: relative;
    grid-row: 1;
  }
}
@media screen and (max-width: 767px) {
  #compare .yearly .cmp_row-vals li:nth-child(2) .cmp_val::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -0.45rem;
    width: 1px;
    background: #EDEDED;
  }
}
@media screen and (max-width: 767px) {
  #compare .yearly .cmp_row-vals li:nth-child(2) .cmp_deal {
    grid-row: 2;
    justify-self: center;
  }
}
@media screen and (max-width: 767px) {
  #compare .yearly .cmp_row-vals li:nth-child(3) .cmp_val,
  #compare .yearly .cmp_row-vals li:nth-child(3) .cmp_deal {
    grid-column: 3;
  }
}
@media screen and (max-width: 767px) {
  #compare .yearly .cmp_row-vals li:nth-child(3) .cmp_val {
    position: relative;
    grid-row: 1;
  }
}
@media screen and (max-width: 767px) {
  #compare .yearly .cmp_row-vals li:nth-child(3) .cmp_val::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -0.45rem;
    width: 1px;
    background: #EDEDED;
  }
}
@media screen and (max-width: 767px) {
  #compare .yearly .cmp_row-vals li:nth-child(3) .cmp_deal {
    grid-row: 2;
    justify-self: center;
  }
}

#network .network {
  padding-top: 14.4rem;
}
@media screen and (max-width: 767px) {
  #network .network {
    padding-top: 5.6rem;
  }
}
#network .network .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6.4rem;
}
@media screen and (max-width: 767px) {
  #network .network .container {
    gap: 2.4rem;
  }
}
#network .network .ttl_icon {
  margin-left: 21rem;
}
#network .network_intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.4rem;
}
@media screen and (max-width: 767px) {
  #network .network_intro {
    gap: 1.6rem;
  }
}
#network .network_intro p {
  font-size: 1.6rem;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  #network .network_intro p {
    padding: 0 2.4rem;
    text-align: left;
  }
}
#network .network_intro .btn {
  letter-spacing: -0.08em;
}
#network .network_bar {
  width: 100%;
  padding: 0.8rem 1.6rem;
  border-radius: 1rem;
  background: #FFE100;
  font-size: 1.4rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
}
#network .network_notes {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: 100%;
  font-size: 1.2rem;
  line-height: 1.5;
}
#network .network_notes li {
  position: relative;
  padding-left: 1.5rem;
}
#network .network_notes li::before {
  content: "※";
  position: absolute;
  top: 0.2rem;
  left: 0;
  font-size: 1.07rem;
}
#network .net {
  position: relative;
  width: 100%;
}
@media screen and (max-width: 767px) {
  #network .net {
    align-self: flex-start;
    width: calc(100% + 2.5rem);
    margin-right: -2.5rem;
  }
}
@media screen and (max-width: 767px) {
  #network .net_scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
}
@media screen and (max-width: 767px) {
  #network .net_scroll::-webkit-scrollbar {
    display: none;
  }
}
#network .net_cols {
  display: flex;
  gap: 3.2rem;
}
@media screen and (max-width: 991px) {
  #network .net_cols {
    gap: 1.6rem;
  }
}
@media screen and (max-width: 767px) {
  #network .net_cols {
    width: max-content;
    padding-right: 2.5rem;
  }
}
#network .net_col {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  gap: 2.4rem;
  min-width: 0;
  padding: 2.4rem 2rem;
  border: 2px solid #A082E6;
  border-radius: 1rem;
  background: #fff;
}
@media screen and (max-width: 991px) {
  #network .net_col {
    padding: 2.4rem 1.2rem;
  }
}
@media screen and (max-width: 767px) {
  #network .net_col {
    flex: none;
    width: 17rem;
    padding: 1.6rem 0.3rem;
  }
}
#network .net_head {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
#network .net_head h3 {
  margin-top: 0.8rem;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
}
#network .net_badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}
#network .net_badge img {
  width: 5rem;
}
#network .net_badge span {
  font-size: 1.4rem;
  font-weight: 900;
  line-height: 1.5;
  text-decoration: underline;
  text-decoration-color: #FFE100;
  text-decoration-thickness: 0.4em;
  text-decoration-skip-ink: none;
  text-underline-offset: -0.3em;
}
#network .net_lead {
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.5;
}
#network .net_logo {
  width: 13.2rem;
  margin-top: 2.4rem;
}
#network .net_group {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  width: 100%;
}
#network .net_group h4 {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0 1.2rem;
  font-size: 1.4rem;
  font-weight: 700;
  color: #A082E6;
  line-height: 1.5;
}
#network .net_group h4 img {
  width: 2rem;
}
#network .net_group dl {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}
#network .net_group dt {
  padding: 0 1.6rem;
  font-size: 1.2rem;
  font-weight: 700;
  color: #949494;
  line-height: 1.5;
}
#network .net_group dd {
  padding: 0 1.2rem 0 1.6rem;
  font-size: 1.4rem;
  line-height: 1.5;
}
#network .net_more {
  display: block;
  font-size: 1.2rem;
}
#network .net_more a {
  color: #46C9F4;
  text-decoration: underline;
}
#network .net_more a::after {
  content: "";
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  margin-left: 0.3rem;
  background: url(../img/common/icon_external.svg) no-repeat center/contain;
  vertical-align: -0.3rem;
}
@media (hover: hover) and (min-width: 992px) {
  #network .net_more a:hover {
    text-decoration: none;
  }
}
#network .net_note {
  display: flex;
  align-items: center;
  min-height: 5.4rem;
  padding: 0 1.2rem;
  font-size: 1.2rem;
  line-height: 1.5;
}
#network .net_swipe {
  display: none;
}
@media screen and (max-width: 767px) {
  #network .net_swipe {
    position: absolute;
    top: 21.6rem;
    left: 13.2rem;
    display: block;
    width: 7.6rem;
    transition: opacity 0.3s;
    pointer-events: none;
  }
}
#network .net_swipe.is-hidden {
  opacity: 0;
}

.notice.large {
  max-width: 92rem;
  background: #fff;
}
.notice.large .notice_list {
  padding: 1rem 1.2rem 2rem;
  font-size: 1.4rem;
}
.notice.large .notice_list li {
  padding-left: 2.3rem;
}
.notice.large .notice_list li::before {
  top: 0;
  font-size: 1.6rem;
}

#price .price {
  padding-top: 14.4rem;
}
@media screen and (max-width: 767px) {
  #price .price {
    padding-top: 5.6rem;
  }
}
#price .price .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6.4rem;
}
@media screen and (max-width: 767px) {
  #price .price .container {
    gap: 2.4rem;
  }
}
#price .price .ttl_icon {
  margin-left: 4.9rem;
}
#price .price_lead {
  font-size: 1.6rem;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  #price .price_lead {
    padding: 0 2.4rem;
    text-align: left;
  }
}
#price .price_cta {
  display: none;
}
@media screen and (max-width: 767px) {
  #price .price_cta {
    display: flex;
    justify-content: center;
    margin-top: 2.4rem;
  }
}
#price .cycle {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.6rem;
  width: 100%;
  max-width: 66rem;
  padding: 1.4rem 3rem;
  border: 2px solid #A082E6;
  border-radius: 1rem;
}
@media screen and (max-width: 767px) {
  #price .cycle {
    padding: 1.4rem;
  }
}
#price .cycle_head {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.5;
}
#price .cycle_head img {
  flex: none;
  width: 3.5rem;
}
#price .cycle_btns {
  display: flex;
  justify-content: center;
  gap: 2.4rem;
  width: 100%;
}
@media screen and (max-width: 767px) {
  #price .cycle_btns {
    gap: 0.8rem;
  }
}
#price .cycle_btn {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  padding: 0.8rem 3.2rem 0.8rem 4.8rem;
  border-radius: 0.8rem;
  background: #A082E6;
  font-size: 1.2rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.5;
  flex: 1;
  transition: opacity 0.3s;
}
@media screen and (max-width: 767px) {
  #price .cycle_btn {
    flex-direction: column;
    gap: 0.8rem;
    padding: 0.8rem 0;
    text-align: center;
  }
}
#price .cycle_btn.travel {
  background: #FFE100;
  color: #333;
}
#price .cycle_btn img {
  flex: none;
  width: 6.4rem;
}
#price .cycle_btn span {
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 767px) {
  #price .cycle_btn span {
    display: contents;
  }
}
#price .cycle_btn b {
  font-size: 1.4rem;
}
@media screen and (max-width: 767px) {
  #price .cycle_btn b {
    order: -1;
  }
}
@media (hover: hover) and (min-width: 992px) {
  #price .cycle_btn:hover {
    opacity: 0.8;
  }
}
#price .flow {
  margin-top: 6.4rem;
}
@media screen and (max-width: 767px) {
  #price .flow {
    margin-top: 2.4rem;
  }
}
#price .flow_tabs {
  display: flex;
  justify-content: center;
  gap: 0.8rem;
}
@media screen and (max-width: 767px) {
  #price .flow_tabs {
    gap: 0.9rem;
  }
}
#price .flow_tab {
  flex: 0 1 30rem;
  padding: 1.4rem 0 1.3rem;
  border-radius: 1rem 1rem 0 0;
  background: #FFF6B2;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.5;
  transition: background 0.3s;
}
@media screen and (max-width: 767px) {
  #price .flow_tab {
    flex: 1;
  }
}
#price .flow_tab.is-active {
  background: #FFE100;
}
@media (hover: hover) and (min-width: 992px) {
  #price .flow_tab:hover {
    background: #FFE100;
  }
}
#price .flow_body {
  padding: 4.8rem 2rem;
  background: #FFE100;
}
@media screen and (max-width: 767px) {
  #price .flow_body {
    padding: 2.4rem 2.5rem;
  }
}
#price .flow_panel {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4rem;
}
@media screen and (max-width: 767px) {
  #price .flow_panel {
    gap: 1.6rem;
  }
}
#price .flow_panel[hidden] {
  display: none;
}
#price .flow_lead {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  #price .flow_lead {
    gap: 0.4rem;
    font-size: 1.4rem;
  }
}
#price .flow_lead em {
  font-size: 2.1rem;
  font-weight: 900;
}
@media screen and (max-width: 767px) {
  #price .flow_lead em {
    font-size: 1.6rem;
  }
}
#price .flow_lead::before, #price .flow_lead::after {
  font-size: 1.4rem;
}
#price .flow_lead::before {
  content: "\\";
}
#price .flow_lead::after {
  content: "/";
}
#price .flow_step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.4rem;
}
#price .flow_step:nth-child(2) {
  margin-top: -3.2rem;
}
@media screen and (max-width: 767px) {
  #price .flow_step:nth-child(2) {
    margin-top: 0;
  }
}
#price .flow_step {
  width: 100%;
  max-width: 92rem;
  padding: 3rem 3.8rem;
  border: 2px solid #333;
  border-radius: 1rem;
  background: #fff;
}
@media screen and (max-width: 767px) {
  #price .flow_step {
    align-items: flex-start;
    gap: 1.6rem;
    padding: 2.2rem;
  }
}
#price .flow_step-head {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
#price .flow_step-head h4 {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  font-size: 1.8rem;
  font-weight: 900;
  line-height: 1.45;
}
#price .flow_step-head small {
  font-size: 1.2rem;
  font-weight: 500;
}
#price .flow_step-text {
  max-width: 79.2rem;
  font-size: 1.4rem;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  #price .flow_step-text {
    text-align: left;
  }
}
#price .flow_step-text .mark {
  text-decoration: underline;
  text-decoration-color: #FFE100;
  text-decoration-thickness: 0.5em;
  text-decoration-skip-ink: none;
  text-underline-offset: -0.35em;
}
#price .flow_box {
  width: 100%;
  border: 2px solid #A082E6;
  border-radius: 1rem;
  background: #F6F2FF;
}
#price .flow_box.fee {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1.6rem;
  padding: 1.4rem;
}
@media screen and (max-width: 767px) {
  #price .flow_box.fee {
    flex-direction: column;
    gap: 1.2rem;
  }
}
#price .flow_box.plan {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.6rem;
  padding: 1.4rem 3rem;
}
@media screen and (max-width: 767px) {
  #price .flow_box.plan {
    gap: 1.2rem;
    padding: 1.4rem;
  }
}
#price .flow_box-ttl {
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.45;
}
#price .flow_box-sub {
  font-size: 1.2rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.45;
}
#price .flow_fee {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-size: 1.4rem;
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  #price .flow_fee {
    flex-direction: column;
    gap: 0;
  }
}
#price .flow_fee .yen {
  position: relative;
  top: -0.5rem;
}
@media screen and (max-width: 767px) {
  #price .flow_fee .yen {
    top: 0;
  }
}
#price .flow_opt {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-size: 1.6rem;
  font-weight: 700;
}
#price .flow_opt::before {
  content: "";
  width: 1.5rem;
  height: 1.5rem;
  margin-right: 0.6rem;
  background: linear-gradient(#333, #333) no-repeat center/100% 0.35rem, linear-gradient(#333, #333) no-repeat center/0.35rem 100%;
  border-radius: 0.1rem;
}
@media screen and (max-width: 767px) {
  #price .flow_opt::before {
    margin-right: 0;
  }
}
#price .flow_plans {
  display: flex;
  gap: 5.4rem;
  width: 100%;
  padding: 0.4rem 0;
}
@media screen and (max-width: 767px) {
  #price .flow_plans {
    flex-direction: column;
    align-items: center;
    gap: 0;
  }
}
#price .flow_plans li {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  gap: 1rem;
  min-width: 0;
}
#price .flow_plans li:not(:first-child)::before {
  content: "or";
  position: absolute;
  top: 50%;
  left: -2.7rem;
  padding-bottom: 0.4rem;
  font-size: 2.1rem;
  font-weight: 900;
  line-height: 1.45;
  transform: translate(-50%, -50%);
}
@media screen and (max-width: 767px) {
  #price .flow_plans li:not(:first-child)::before {
    position: static;
    order: -1;
    margin-bottom: -0.6rem;
    padding-bottom: 0;
    transform: none;
  }
}
#price .flow .yen {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: #A082E6;
}
#price .flow .yen b {
  padding-top: 0.6rem;
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 4rem;
  font-weight: 700;
  line-height: 1.25;
}
#price .flow .yen .unit {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 0.8rem;
  font-size: 2.1rem;
  font-weight: 900;
  line-height: 1.45;
}
#price .flow .yen small {
  margin-bottom: -0.6rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.45;
}
#price .flow_price {
  display: flex;
  align-items: baseline;
  gap: 0.4rem;
  padding: 0 0.8rem;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  #price .flow_price {
    padding: 0.4rem 0.8rem 0.6rem;
  }
}
#price .flow_price .yen {
  align-items: baseline;
}
#price .flow_price .yen b {
  padding-top: 0;
  line-height: 1;
}
#price .flow_price .yen .unit {
  align-self: flex-end;
  margin-top: 0;
}
#price .flow_price .per {
  position: relative;
  top: -0.5rem;
  font-size: 1.2rem;
  font-weight: 700;
  color: #A082E6;
}
#price .flow_price.dark .yen,
#price .flow_price.dark .per {
  color: #333;
}
#price .flow .tag {
  display: block;
  padding: 0.3rem 0.8rem;
  border-radius: 0.3rem;
  background: #A082E6;
  font-size: 1.2rem;
  font-weight: 700;
  color: #fff;
  text-align: center;
  line-height: 1.45;
  white-space: nowrap;
}
#price .flow_plans .tag {
  width: 100%;
}
#price .option {
  margin-top: 14.4rem;
}
@media screen and (max-width: 767px) {
  #price .option {
    margin-top: 6.4rem;
    padding-bottom: 3.2rem;
  }
}
#price .option .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6.4rem;
}
@media screen and (max-width: 767px) {
  #price .option .container {
    gap: 3.2rem;
  }
}
#price .option .ttl_icon {
  margin-left: 4.9rem;
}
#price .option_body {
  display: flex;
  flex-direction: column;
  gap: 3.2rem;
  width: 100%;
  max-width: 92rem;
}
@media screen and (max-width: 767px) {
  #price .option_body {
    gap: 1.6rem;
    padding: 0 1.6rem;
  }
}
#price .option_block {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}
#price .option_block:first-child {
  gap: 2.4rem;
}
@media screen and (max-width: 767px) {
  #price .option_block:first-child {
    gap: 1.6rem;
  }
}
#price .option_ttl {
  position: relative;
  padding-left: 2.6rem;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.45;
}
#price .option_ttl::before {
  content: "●";
  position: absolute;
  top: 0;
  left: 0;
  font-weight: 500;
}
#price .option_cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: minmax(14rem, auto) auto;
  gap: 2.4rem;
}
@media screen and (max-width: 991px) {
  #price .option_cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
  }
}
@media screen and (max-width: 767px) {
  #price .option_cards {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.6rem;
  }
}
#price .option_cards.single {
  grid-template-columns: minmax(0, 45.2rem);
  grid-template-rows: none;
}
@media screen and (max-width: 767px) {
  #price .option_cards.single {
    grid-template-columns: minmax(0, 1fr);
  }
}
#price .option_card {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  padding: 2.2rem;
  border: 2px solid #A082E6;
  border-radius: 1rem;
}
@media screen and (max-width: 767px) {
  #price .option_card {
    padding: 1.4rem;
    border-radius: 0.8rem;
  }
}
#price .option_card h4 {
  font-size: 1.6rem;
  font-weight: 700;
  color: #A082E6;
  line-height: 1.45;
}
#price .option_card-text {
  margin-top: -0.8rem;
  font-size: 1.2rem;
  line-height: 1.45;
}
#price .option_card-price {
  margin-top: auto;
  font-size: 2.1rem;
  font-weight: 900;
  text-align: right;
  line-height: 1.45;
}
#price .option_card-price b {
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 2.3rem;
  font-weight: 700;
}
#price .option_card-price small {
  font-size: 1.2rem;
  font-weight: 700;
}
#price .option_card-price:has(b) {
  font-size: 1.6rem;
}
#price .option_network {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}
#price .option_network > div {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  row-gap: 0.4rem;
}
#price .option_network dt {
  min-width: 13.3rem;
  padding: 0.3rem 0.8rem;
  border-radius: 0.3rem;
  background: #333;
  font-size: 1.2rem;
  font-weight: 700;
  color: #fff;
  text-align: center;
  line-height: 1.45;
}
#price .option_network dd {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 2.1rem;
  font-weight: 900;
  line-height: 1.45;
}
#price .option_network dd.note {
  width: 100%;
  justify-content: flex-end;
  font-size: 1.2rem;
  font-weight: 500;
}
#price .option_network small {
  font-size: 1.2rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.2;
}

#call .call_bg {
  position: fixed;
  top: 6rem;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 84rem;
  background: url(../img/call/bg_pc_left.svg) no-repeat left top/40rem 84rem, url(../img/call/bg_pc_right.svg) no-repeat right top/40rem 84rem;
  pointer-events: none;
}
@media screen and (max-width: 767px) {
  #call .call_bg {
    top: 14.2rem;
    height: 74rem;
    background-image: url(../img/call/bg_sp.svg);
    background-size: 100% auto;
  }
}
#call .ttl_icon {
  margin-left: 20.2rem;
}

.pagetop_fixed {
  position: fixed;
  right: 2rem;
  bottom: 2rem;
  z-index: 90;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.1rem;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background: #A082E6;
  font-size: 1.2rem;
  font-weight: 700;
  color: #fff;
  line-height: 1;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
}
@media screen and (max-width: 767px) {
  .pagetop_fixed {
    right: 1.2rem;
    bottom: 1.2rem;
  }
}
.pagetop_fixed.is-show {
  opacity: 1;
  visibility: visible;
}
@media (hover: hover) and (min-width: 992px) {
  .pagetop_fixed:hover {
    opacity: 0.8;
  }
}
.pagetop_fixed img {
  width: 1.25rem;
}

.country {
  padding-top: 14.4rem;
}
@media screen and (max-width: 767px) {
  .country {
    padding-top: 5.6rem;
  }
}
.country .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6.4rem;
}
@media screen and (max-width: 767px) {
  .country .container {
    gap: 2.4rem;
  }
}
.country_lead {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  line-height: 1.45;
}
@media screen and (max-width: 767px) {
  .country_lead {
    padding: 0 2.4rem;
    text-align: left;
  }
}
.country_lead p {
  font-size: 1.6rem;
  font-weight: 500;
  color: #040404;
}
.country_lead small {
  font-size: 1.2rem;
  font-weight: 500;
}
.country_grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: start;
  gap: 3.2rem;
  width: 100%;
}
@media screen and (max-width: 991px) {
  .country_grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 2.4rem;
  }
}
@media screen and (max-width: 767px) {
  .country_grid {
    grid-template-columns: 1fr;
    gap: 1.6rem;
  }
}
.country_card {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  padding: 2.4rem;
  border: 2px solid #333;
  border-radius: 1rem;
  background: #fff;
}
.country_card.domestic {
  gap: 1.2rem;
  padding: 2.4rem 2rem;
}
.country_name {
  display: flex;
  align-items: flex-start;
  gap: 0.8rem;
  font-size: 2.1rem;
  font-weight: 900;
  color: #040404;
  line-height: 1.45;
}
@media screen and (max-width: 767px) {
  .country_name.is-long {
    font-size: min(2.1rem, 5.3vw);
    white-space: nowrap;
  }
}
.country_name::before {
  content: "";
  flex: none;
  width: 2.78rem;
  height: 2.78rem;
  margin: 0.16rem 0.11rem 0;
  background: url(../img/common/country_globe.svg) no-repeat center/contain;
}
.country_plans {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}
.country_plans div {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}
.country_plans div + div {
  padding-top: 1.1rem;
  border-top: 1px solid #EDEDED;
}
.country_plans dt {
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.45;
}
.country_value {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  padding-left: 0.8rem;
}
.country_value.multi {
  gap: 0.8rem;
}
.country_update {
  margin-bottom: -0.4rem;
  font-size: 1.2rem;
  font-weight: 500;
  text-align: right;
  line-height: 1.5;
}
.country_specs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.8rem;
  padding-left: 0.2rem;
}
.country_specs span {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 1.4rem;
  font-weight: 700;
  color: #949494;
  line-height: 1.45;
}
.country_specs span::before {
  content: "";
  flex: none;
  width: 2rem;
  height: 2rem;
  background: no-repeat center/contain;
}
.country_specs span.data::before {
  background-image: url(../img/roaming/icon_wifi.svg);
}
.country_specs span.call::before {
  background-image: url(../img/roaming/icon_phone.svg);
}
.country_specs span.sms::before {
  background-image: url(../img/roaming/icon_sms.svg);
}
.country_domestic {
  font-size: 1.4rem;
  font-weight: 700;
  color: #949494;
  line-height: 1.45;
}
.country_mark {
  position: relative;
  flex: none;
  width: 2.3rem;
  height: 2.3rem;
}
.country_mark.ok::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 1.95rem;
  height: 1.95rem;
  border: 0.3rem solid #A082E6;
  border-radius: 50%;
  transform: translateY(-50%);
}
.country_mark.ng {
  font-size: 2.9rem;
  font-weight: 900;
  line-height: 2.3rem;
  text-align: center;
}
.country_note {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1.4rem;
  font-weight: 700;
  color: #ABABAB;
  line-height: 1.45;
}
.country_note::before {
  content: "";
  flex: none;
  width: 1.82rem;
  height: 1.83rem;
  background: url(../img/common/country_phone.svg) no-repeat center/contain;
}
.country_more {
  width: 100%;
  border-top: 2px solid #333;
  padding-top: 0.7rem;
}
@media screen and (max-width: 767px) {
  .country_more {
    margin-top: -0.8rem;
  }
}
.country_more:not(.is-open) {
  padding-bottom: 0.7rem;
  border-bottom: 2px solid #333;
}
.country_index {
  display: flex;
  flex-direction: column;
  gap: 4rem;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .country_index {
    gap: 1.6rem;
    margin-top: 1.6rem;
  }
}
.country_index[hidden] {
  display: none;
}
.country_tabs {
  position: sticky;
  top: 6rem;
  z-index: 5;
  display: flex;
  gap: 1.2rem;
  padding: 0.8rem;
  background: #fff;
}
@media screen and (max-width: 767px) {
  .country_tabs {
    top: 10.4rem;
    flex-wrap: wrap;
    justify-content: center;
    padding: 0.8rem 0.4rem;
  }
}
.country_tab {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 3rem;
  padding: 0 0.8rem;
  border: 2px solid #949494;
  border-radius: 0.4rem;
  background: #fff;
  font-size: 1.6rem;
  font-weight: 700;
  color: #949494;
  line-height: 1;
  white-space: nowrap;
  transition: background 0.3s, color 0.3s;
}
@media screen and (max-width: 767px) {
  .country_tab {
    flex: none;
  }
}
.country_tab.is-active {
  background: #949494;
  color: #fff;
}
.country_tab:disabled {
  border-color: #EDEDED;
  color: #EDEDED;
  cursor: default;
}
@media (hover: hover) and (min-width: 992px) {
  .country_tab:not(:disabled):hover {
    background: #949494;
    color: #fff;
  }
}
.country_panel {
  padding-bottom: 6.5rem;
  border-bottom: 1px solid #333;
  scroll-margin-top: 12rem;
}
@media screen and (max-width: 767px) {
  .country_panel {
    padding-bottom: 7.1rem;
  }
}
.country_more-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0 1.2rem;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: left;
}
.country_more-btn::after {
  content: "";
  flex: none;
  width: 1.5rem;
  height: 1.5rem;
  background: url(../img/common/country_close.svg) no-repeat center/contain;
  transform: rotate(45deg);
  transition: transform 0.3s;
}
.is-open > .country_more-btn::after {
  transform: rotate(0);
}

#roaming .ttl_icon {
  margin-left: 22.4rem;
}
#roaming .country_name {
  color: #333;
}
#roaming .country {
  display: flex;
  flex-direction: column;
  gap: 6.4rem;
}
@media screen and (max-width: 767px) {
  #roaming .country {
    gap: 2.4rem;
  }
}
#roaming .roam_tabs {
  display: flex;
  justify-content: center;
  gap: 0.8rem;
  border-bottom: 2px solid #A082E6;
}
@media screen and (max-width: 767px) {
  #roaming .roam_tabs {
    padding: 0 2.5rem;
  }
}
#roaming .roam_tab {
  display: flex;
  flex: 0 1 30rem;
  flex-direction: column;
  align-items: center;
  padding: 1.4rem 0.4rem 1.2rem;
  border-radius: 1rem 1rem 0 0;
  background: #ECE6FA;
  font-size: 1.4rem;
  font-weight: 700;
  color: #949494;
  line-height: 1.45;
  transition: background 0.3s, color 0.3s;
}
@media screen and (max-width: 767px) {
  #roaming .roam_tab {
    flex: 1;
  }
}
#roaming .roam_tab small {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 1.2rem;
  font-weight: 500;
}
#roaming .roam_tab small::before {
  content: "";
  width: 1.5rem;
  height: 1.5rem;
  background: url(../img/roaming/tab_wifi_gray.svg) no-repeat center/contain;
}
#roaming .roam_tab.is-active {
  background: #A082E6;
  color: #fff;
}
#roaming .roam_tab.is-active small::before {
  background-image: url(../img/roaming/tab_wifi_white.svg);
}
@media (hover: hover) and (min-width: 992px) {
  #roaming .roam_tab:hover {
    background: #A082E6;
    color: #fff;
  }
}
#roaming .roam_panel {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  gap: 3.2rem;
  margin-top: -3.2rem;
}
@media screen and (max-width: 767px) {
  #roaming .roam_panel {
    gap: 2.4rem;
    margin-top: 0;
  }
}
#roaming .roam_panel[hidden] {
  display: none;
}
#roaming .roam_panel .country_index {
  margin-top: 0;
}
@media screen and (max-width: 767px) {
  #roaming .roam_panel .country_index {
    margin-top: 1.6rem;
  }
}
#roaming .roam_coverage {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  padding: 1.6rem 2.4rem;
  border-radius: 1rem;
  background: #FFE100;
}
@media screen and (max-width: 767px) {
  #roaming .roam_coverage {
    justify-content: center;
    gap: 0.8rem;
    width: 100%;
    padding: 0.8rem 1.6rem;
  }
}
#roaming .roam_coverage img {
  width: 4.854rem;
}
#roaming .roam_coverage p {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.45;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  #roaming .roam_coverage p {
    flex-direction: column;
    gap: 0.3rem;
  }
}
#roaming .roam_coverage b {
  position: relative;
  top: -0.3rem;
  font-family: "sofia-pro-soft", "GenJyuuGothic", sans-serif;
  font-size: 4rem;
  font-weight: 700;
  line-height: 1;
}
#roaming .roam_coverage em {
  display: flex;
  align-items: center;
  font-size: 2.1rem;
  font-style: normal;
  font-weight: 900;
}
#roaming .roam_legend {
  display: flex;
  justify-content: center;
  gap: 1.6rem;
}
#roaming .roam_legend span {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 1.4rem;
  font-weight: 700;
  color: #949494;
  line-height: 1.45;
}
#roaming .roam_legend span::before {
  content: "";
  width: 2rem;
  height: 2rem;
  background: no-repeat center/contain;
}
#roaming .roam_legend span.data::before {
  background-image: url(../img/roaming/icon_wifi.svg);
}
#roaming .roam_legend span.call::before {
  background-image: url(../img/roaming/icon_phone.svg);
}
#roaming .roam_legend span.sms::before {
  background-image: url(../img/roaming/icon_sms.svg);
}

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