@charset "UTF-8";

/* ============================================================
   tab.css — タブレット対応（768px 〜 1024px）
   ============================================================ */
@media screen and (min-width: 768px) and (max-width: 1024px) {

body {
  font-size: 1rem;
  line-height: 2.3em;
}

/* ----- wrapper ----- */
.wrapper {
  padding: 80px 40px;
}

/* ----- headings ----- */
h2 {
  font-size: 1.5em;
  margin: 0 0 60px;
}
.h2_ttl {
  margin: 0 0 60px;
}
.h2_ttl-ja {
  padding: 0 160px;
}
.h2_ttl-ja::before,
.h2_ttl-ja::after {
  width: 145px;
}

/* ----- header / FV ----- */
header .fv_hero p {
  font-size: 1.8em;
}
header .fv_hero p:last-child {
  font-size: 1.2em;
}

/* ----- intro section (txtbox60 / imgbox40) ----- */
.txtbox60 {
  width: 58%;
  padding: 3em;
}
.imgbox40 {
  width: 42%;
}

.item .category {
  width: 30%;
}

.comparision dt {
  width: 16em;
}
.comparision dd {
  width: calc((100% - 16em) / 3);
  font-size: 0.82em;
}

.plan > li {
  width: calc(50% - 15px);
}
.plan > li:last-child {
  width: 100%;
  max-width: calc(50% - 15px);
  margin: 0 auto;
}

.flow > li {
  width: 44%;
  min-width: auto;
  margin: 0 2% 40px;
}
.flow li::after {
  right: -2.2em;
  width: 1.2em;
}

.w50 {
  width: 70%;
  min-width: auto;
}
.w70 {
  width: 85%;
  min-width: auto;
}

.contact_box {
  width: 90%;
  min-width: auto;
}
.contact_tel {
  font-size: 1.4em;
}

.fix_cam a {
  font-size: 0.7em;
  padding: 0.9em;
}

}