@charset "UTF-8";

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
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,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
a,
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%;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */

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

body {
  line-height: 1;
  font-family: Hiragino Sans, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

img {
  vertical-align: middle;
}

p {
  margin: 0 0 1em;
}

.plans__change {
  margin: 8px 0 0;
  text-align: right;
}

.plans__change .plans__change-btn {
  color: #000;
  font-size: 14px;
  padding: 8px;
  border-radius: 20px;
  background: #EFEFEF;
  border: solid 1px #CCC;
}

body {
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;
}

body.modal-open {
  overflow: hidden;
}

/* Safari用のハックは、Chromeに適用されないようにする */

@supports (-webkit-touch-callout: none) {
  body {
    /* Safari用のハック */
    height: -webkit-fill-available;
  }
}

.modal__bg {
  position: fixed;
  z-index: 1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
}

.modal {
  background-color: #FFF;
  position: fixed;
  z-index: 12;
  right: 0;
  left: 0;
  margin: auto;
  padding: 24px;
  box-shadow: 0 0 4px 4px rgba(0, 0, 0, 0.1);
  box-sizing: border-box;
}

.modal .modal__close,
.modal .modal__close--option {
  background: none;
  outline: none;
  border: none;
  position: fixed;
  top: 0;
  right: 0;
  font-family: sans-serif;
  font-size: 60px;
  font-weight: 400;
  line-height: 1;
  color: #FFF;
  cursor: pointer;
}

.modal .modal__inner {
  background-color: #FFF;
  box-sizing: border-box;
  position: relative;
}

.modal .modal__scroll {
  overflow-y: auto;
  padding-right: 16px;
}

.modal ::-webkit-scrollbar {
  width: 6px;
}

.modal ::-webkit-scrollbar-track {
  border-radius: 6px;
  background: #f2f2f2;
}

.modal ::-webkit-scrollbar-thumb {
  border-radius: 6px;
  background: #CCC;
}

.modal p {
  line-height: 1.5;
}

.fixed__block {
  position: absolute;
  bottom: 20px;
  left: 0;
  right: 0;
  width: 880px;
  border-top: 1px solid rgba(204, 204, 204, 0.8);
  padding: 16px 40px 0px;
  box-sizing: border-box;
}

.modal__title {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 8px;
}

.modal-grade {
  max-width: 900px;
  height: 100%;
  top: 0;
}

.modal-grade .modal__lead--red {
  color: #C00;
}

.modal-grade .modal__scroll {
  height: 100%;
  padding-bottom: 150px;
}

.modal-grade .modal__select {
  position: relative;
}

.modal-grade .total-price {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.modal-grade .total-price__data {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal-grade .total-price__data--monthly {
  margin-right: 12px;
}

.modal-grade .total-price__data--value {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 24px;
  font-weight: 700;
  margin: -6px 2px 0 0;
}

.modal-grade .total-price__data--unit {
  font-size: 12px;
  line-height: 1.5;
}

.modal-grade .modal__model--comment {
  color: #666;
  font-size: 12px;
  line-height: 1.5;
  margin-top: 8px;
}

.modal-grade .modal__model--heading {
  font-weight: 700;
}

.modal-grade .modal__model--list {
  position: relative;
  border-top: 1px solid #CCC;
}

.modal-grade .modal__model--list:not(:first-of-type) {
  margin: 0 0 0;
}

.modal-grade .modal__model--list input {
  display: none;
}

.modal-grade .modal__model--list label {
  position: relative;
  padding: 16px 10px 16px 100px;
  display: block;
  cursor: pointer;
}

.modal-grade .modal__model--list label::before {
  position: absolute;
  z-index: 1;
  top: 40%;
  left: 35px;
  content: "";
  width: 30px;
  height: 15px;
  border-top: 8px solid #C00;
  border-right: 8px solid #C00;
  transform: rotate(135deg);
  opacity: 0;
}

.modal-grade .modal__model--list label:hover {
  background-color: #F7F7F7;
}

.modal-grade .modal__model--list input[type=radio]:checked ~ label::before {
  opacity: 1;
}

.modal-grade .modal__model--list input[type=radio]:checked ~ label {
  background-color: #fff3f3;
}

.modal-grade .modal__model--icon {
  display: inline-block;
  background-color: #FF5E00;
  color: #FFF;
  padding: 3px 8px 2px;
  margin: 0 0 12px;
  border-radius: 4px;
}

.modal-grade .modal__order {
  display: flex;
  justify-content: space-between;
  margin: 0 0 16px;
}

.modal-grade .modal__model-name {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.modal-grade .modal__select--engine,
.modal-grade .modal__select--drive {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 13px;
}

.modal-grade .modal__select--engine .radio,
.modal-grade .modal__select--drive .radio {
  display: block;
  padding: 12px 0;
  text-align: center;
  background-color: #FFF;
  border: solid 2px #333;
  border-radius: 4px;
  box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.1);
  font-size: 14px;
  color: #333;
  cursor: pointer;
}

.modal-grade .modal__select--engine input[type=radio],
.modal-grade .modal__select--drive input[type=radio] {
  display: none;
}

.modal-grade .modal__select--engine input[type=radio]:checked + .radio,
.modal-grade .modal__select--drive input[type=radio]:checked + .radio {
  background-color: #333;
  color: #FFF;
  font-weight: 700;
}

.modal-grade .modal__select--drive {
  width: 39%;
}

.modal-grade .modal__select--engine {
  width: 59%;
}

.modal-grade .modal__engine--title {
  font-size: 16px;
  font-weight: 700;
  width: 5em;
}

.modal-grade .modal__engine--list {
  width: 120px;
}

.modal-grade .modal__engine--list:not(:last-child) {
  margin-right: 8px;
}

.modal-grade .modal__drive--title {
  font-size: 16px;
  font-weight: 700;
  width: 3em;
}

.modal-grade .modal__drive--list {
  width: 120px;
}

.modal-grade .modal__drive--list:not(:last-child) {
  margin-right: 8px;
}

.modal-grade .modal__price {
  font-size: 0;
  text-align: right;
}

.modal-grade .modal__price--value {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 24px;
  font-weight: 700;
  margin: 0 2px 0 0;
}

.modal-grade .modal__price--unit {
  font-size: 12px;
}

.modal-grade .modal__price--caption {
  font-size: 12px;
  display: block;
  margin: 4px -8px 0 0;
}

.modal-grade .modal__meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal-grade .modal__meta--attention {
  background-color: #F00;
  color: #FFF;
  font-size: 12px;
  font-weight: 700;
  padding: 8px;
  display: block;
  width: 120px;
  text-align: center;
}

.modal-grade .modal__meta--main {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  display: block;
}

.modal-grade .modal__meta--sub {
  font-size: 14px;
  line-height: 1.3;
  display: block;
  margin-left: 1em;
}

.modal-years {
  max-width: 900px;
  height: 100%;
  top: 0;
  /* 3つの場合 */
  /* 2つの場合 */
}

.modal-years .modal__heading {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 8px;
}

.modal-years .modal__scroll {
  height: 100%;
  padding-bottom: 150px;
}

.modal-years .modal__select--list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.modal-years .modal__select--list li {
  height: 400px;
  border: 1px solid #CCC;
  box-sizing: border-box;
}

.modal-years .modal__select--years {
  align-items: center;
  display: flex;
  gap: 8px;
  margin-top: 48px;
}

.modal-years .modal__select--recommend {
  background: #c00;
  border-radius: 1000px;
  color: #fff;
  display: grid;
  font-size: 12px;
  font-weight: 700;
  height: 20px;
  place-items: center;
  width: 70px;
}

.modal-years .modal__select--recommend.is-none {
  visibility: hidden;
}

.modal-years .modal__select--title {
  font-size: 18px;
  font-weight: 700;
}

.modal-years .modal__select--price {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: baseline;
  margin-top: 30px;
}

.modal-years .modal__select--price span {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 32px;
  font-weight: 700;
  margin-right: 4px;
}

.modal-years .modal__select--totalprice {
  font-size: 12px;
}

.modal-years .modal__select--totalprice span {
  font-size: 16px;
  font-weight: 700px;
}

.modal-years .modal__select--cap {
  font-size: 14px;
  line-height: 1.5;
  text-align: center;
  margin-top: 32px;
}

.modal-years .modal__select--campaign {
  background-color: #ffefd7;
  padding: 12px;
  border-radius: 8px;
}

.modal-years .modal__select--button {
  text-align: center;
  font-size: 16px;
  color: #FFF;
  background-color: #333;
  padding: 16px;
  margin-top: auto;
  width: 90%;
}

.modal-years .radio-plan::before {
  content: none;
}

.modal-years .radio-plan::after {
  position: absolute;
  left: 0;
  content: "";
  width: 35px;
  height: 12px;
  border-top: 8px solid #C00;
  border-right: 8px solid #C00;
  transform: rotate(135deg);
  right: 0;
  margin: auto;
}

.modal-bonus {
  max-width: 900px;
  height: 100%;
  top: 0;
}

.modal-bonus .modal__heading {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 8px;
}

.modal-bonus .modal__scroll {
  height: 100%;
  padding-bottom: 150px;
}

.modal-bonus .modal__select--list {
  display: flex;
  justify-content: center;
}

.modal-bonus .modal__select--list li {
  width: 50%;
  height: 230px;
  border: 1px solid #CCC;
  box-sizing: border-box;
}

.modal-bonus .modal__select--title {
  margin-top: 50px;
  font-size: 18px;
  font-weight: 700;
}

.modal-bonus .modal__select--small {
  font-size: 14px;
  margin-top: 8px;
}

.modal-bonus .modal__select--price {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: baseline;
  margin-top: 16px;
}

.modal-bonus .modal__select--price span {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 32px;
  font-weight: 700;
  margin-right: 4px;
}

.modal-bonus .modal__select--cap {
  font-size: 14px;
  line-height: 1.5;
  text-align: center;
  margin-top: 20px;
}

.modal-bonus .modal__select--button {
  text-align: center;
  font-size: 16px;
  color: #FFF;
  background-color: #333;
  padding: 16px;
  margin-top: auto;
  width: 90%;
}

.modal-bonus .radio-plan::before {
  content: none;
}

.modal-bonus .radio-plan::after {
  position: absolute;
  left: 0;
  content: "";
  width: 35px;
  height: 12px;
  border-top: 8px solid #C00;
  border-right: 8px solid #C00;
  transform: rotate(135deg);
  opacity: 0;
  right: 0;
  margin: auto;
}

.modal__cap {
  margin-top: 24px;
  font-size: 13px;
  line-height: 1.5;
  color: #666;
}

.modal-option {
  max-width: 900px;
  height: 100%;
  top: 0;
}

.modal-option .modal__scroll {
  height: 100%;
  padding-bottom: 200px;
}

.modal-option .modal__heading {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 8px;
}

.modal-option .modal__coupon {
  margin: 28px 0 0;
}

.modal-option .modal__coupon--title {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin: 0 0 8px;
  font-size: 18px;
  font-weight: 700;
}

.modal-option .modal__coupon--title span {
  margin-right: 4px;
  padding: 8px 4px;
  color: #FFF;
  font-size: 14px;
  text-align: center;
  background-color: #C00;
  border-radius: 4px;
}

.modal-option .modal__select--item {
  position: relative;
  width: 100%;
}

.modal-option .modal__select--item dt {
  font-size: 18px;
  font-weight: 700;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.modal-option .modal__select--item dd {
  margin-top: 12px;
}

.modal-option .modal__select--wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal-option .modal__select--wrap input {
  display: none;
}

.modal-option .modal__coupon--inner {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.modal-option .modal__coupon--item {
  position: relative;
}

.modal-option .modal__coupon--item dt {
  margin: 0 0 16px;
  text-align: center;
}

.modal-option .modal__couponsheet {
  margin: 20px 0 0;
  padding: 20px;
  background-color: #EFEFEF;
}

.modal-option .modal__coupon--table {
  width: 100%;
  margin: 20px 0 0;
}

.modal-option .modal__coupon--table .seven {
  padding: 8px 0;
  font-weight: 700;
  color: #FFF;
  background-color: #C00;
}

.modal-option .modal__coupon--table .coupon {
  padding: 12px 8px;
  text-align: left;
  border-top: solid 1px #CCC;
  border-bottom: solid 1px #CCC;
  background-color: #FFF;
}

.modal-option .modal__coupon--table .sheet {
  padding: 12px 0;
  font-weight: 700;
  text-align: center;
  border-top: solid 1px #CCC;
  border-bottom: solid 1px #CCC;
  background-color: #FFF;
}

.modal-option .modal__couponsheet--title {
  font-weight: 700;
}

.modal-option .modal__service--inner {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 16px 0 0;
}

.modal-option .modal__service--item {
  position: relative;
}

.modal-option .modal__service--item dt {
  padding: 16px 8px;
  text-align: center;
  color: #FFF;
  background-color: #333;
}

.modal-option .modal__service--item ul {
  padding: 16px;
}

.modal-option .modal__service--item ul li {
  margin: 0 0 12px 20px;
  list-style-type: disc;
  font-size: 14px;
  line-height: 1.3;
}

.modal-option .checkbox__label,
.modal-option .radiobox__label {
  background-color: #CCC;
  padding: 16px;
  color: #FFF;
  border-radius: 4px;
  display: block;
  width: 8em;
  text-align: center;
  cursor: pointer;
}

.modal-option .checkbox:checked + .checkbox__label,
.modal-option .radiobox:checked + .radiobox__label {
  background-color: #C00;
}

.modal-option .modal__select--cap {
  font-size: 12px;
  line-height: 1.6;
  margin-top: 12px;
  margin-bottom: 0;
}

.modal-option .modal__select--campaign {
  background-color: #ffefd7;
  padding: 12px;
  border-radius: 8px;
}

.modal-option .modal__select--price span {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 20px;
  font-weight: 700;
  margin: 0 2px;
}

.mt32 {
  margin-top: 32px;
}

.plans__explain {
  display: inline-block;
  background-color: #FF9800;
  color: #FFF;
  text-decoration: none;
  width: 1em;
  height: 1em;
  padding: 4px;
  border-radius: 1em;
  font-size: 10px;
  font-weight: 700;
  text-align: center;
  line-height: 1.1;
  margin: 0 0 0 4px;
  cursor: pointer;
}

.madal-plan {
  width: 960px;
  top: 10%;
}

.madal-plan .modal__title {
  font-size: 28px;
  font-weight: 700;
  text-align: center;
  margin: 0 0 32px;
  padding: 0 0 16px;
  border-bottom: 1px solid #333;
}

.madal-plan .modal__heading {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 8px;
}

.madal-plan .table {
  display: table;
  border-collapse: collapse;
  margin: 8px 0 0;
  width: 100%;
}

.madal-plan .table td {
  display: table-cell;
  vertical-align: middle;
  padding: 16px;
  border: solid 1px #CCC;
}

.madal-plan .table__select {
  width: 24px;
}

.madal-plan .table__name {
  width: 300px;
  font-size: 16px;
  font-weight: 700;
}

.madal-plan .table__image {
  width: 240px;
  display: flex;
  justify-content: flex-start;
}

.madal-plan .table__image img {
  width: 120px;
  height: auto;
}

.madal-plan .table__notes {
  font-size: 13px;
  line-height: 1.5;
}

.madal-plan .table__link {
  font-size: 12px;
  text-align: right;
  margin: 8px 0 0;
}

.radio-button {
  display: none;
}

.radio-button:checked + .radio-plan::before {
  background-color: #C00;
  border-color: #C00;
}

.radio-button:checked + .radio-plan::after {
  opacity: 1;
}

.radio-plan {
  position: relative;
  display: flex;
  align-items: center;
  cursor: pointer;
  flex-direction: column;
  padding: 20px;
  box-sizing: border-box;
  height: 100%;
}

.radio-plan::before {
  position: absolute;
  background-color: #FFF;
  border: 1px solid #CCC;
  border-radius: 18px;
  width: 24px;
  height: 24px;
  margin: 2px 0 0;
  content: "";
}

.radio-plan::after {
  position: absolute;
  left: 5px;
  content: "";
  width: 11px;
  height: 5px;
  border-top: 4px solid #FFF;
  border-right: 4px solid #FFF;
  transform: rotate(135deg);
  opacity: 0;
}

.check-box {
  display: none;
}

.check-box:checked + .check-plan::before {
  background-color: #FF5E00;
  border-color: #FF5E00;
}

.check-box:checked + .check-plan::after {
  opacity: 1;
}

.check-plan {
  position: relative;
  display: flex;
  align-items: center;
  margin: 6px 0 0;
  cursor: pointer;
}

.check-plan::before {
  position: absolute;
  top: 0;
  background-color: #FFF;
  border: 1px solid #CCC;
  border-radius: 4px;
  width: 24px;
  height: 24px;
  content: "";
  margin: 0 8px 0 0;
}

.check-plan::after {
  position: absolute;
  top: 7px;
  left: 5px;
  content: "";
  width: 11px;
  height: 5px;
  border-top: 4px solid #FFF;
  border-right: 4px solid #FFF;
  transform: rotate(135deg);
  opacity: 0;
}

.attention {
  font-size: 12px;
  line-height: 1.3;
}

.fixed-block {
  background-color: #fff;
  box-shadow: 0 -4px 4px 0 rgba(0, 0, 0, 0.2);
  width: 100%;
  box-sizing: border-box;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 100;
  padding-top: 16px;
}

.fixed-block__price {
  display: flex;
  justify-content: center;
  align-items: baseline;
}

.fixed-block__price--value {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 38px;
  font-weight: 700;
  line-height: 1;
  margin: 0 4px;
}

.fixed-block__price--bonus {
  margin-left: 1em;
}

.fixed-block__price--year {
  margin-left: 0.5em;
}

.fixed-block__price--unit {
  align-self: baseline;
}

.fixed-block__flex {
  line-height: 1.5;
  align-self: flex-end;
}

.fixed-block__flex .fixed-block__price--bonus,
.fixed-block__flex .fixed-block__price--year {
  display: block;
}

.modal__button {
  border: none;
  border-radius: 4px;
  outline: none;
  padding: 24px;
  font-size: 22px;
  line-height: 1;
  font-weight: 700;
  margin: 4px 0 16px;
  cursor: pointer;
  background-color: #C00;
  color: #FFF;
}

.modal__button__campaign {
  font-size: 12px;
  text-align: center;
  margin-top: 16px;
}

.modal__button__campaign dt {
  font-size: 16px;
  font-weight: 700;
}

.modal__button__campaign dd {
  margin-top: 8px;
  display: flex;
  justify-content: space-around;
}

.modal__button__campaign dd span {
  display: block;
  padding: 8px 24px;
  border-radius: 24px;
  background-color: #EFEFEF;
  border: 1px solid #EFEFEF;
  margin: 0 4px;
}

.modal__button__campaign dd .is-active {
  background-color: #FFF;
  color: #f44336;
  border: 1px solid #f44336;
}

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

.modal__button--close {
  width: 200px;
  text-align: center;
  box-shadow: 0 3px 0 0 #CCC;
  border: 1px solid #CCC;
  background-color: #FFF;
}

.modal__button--close:active {
  transform: translateY(4px);
  box-shadow: none;
}

.modal__button--prev {
  width: 200px;
  text-align: center;
  box-shadow: 0 3px 0 0 #CCC;
}

.modal__button--prev:active {
  transform: translateY(4px);
  box-shadow: none;
}

.modal__button--next {
  width: 50%;
  text-align: center;
  box-shadow: 0 3px 0 0 #CCC;
}

.modal__button--next:active {
  transform: translateY(4px);
  box-shadow: none;
}

.modal__button--next span {
  display: block;
  position: relative;
}

.modal__button--next span::after {
  position: absolute;
  top: 8%;
  right: 0;
  content: "";
  width: 12px;
  height: 12px;
  border-top: 2px solid #FFF;
  border-right: 2px solid #FFF;
  transform: rotate(45deg);
}

.modal__button--condition span {
  display: block;
  position: relative;
}

.modal__button--condition span::after {
  position: absolute;
  top: 20%;
  right: 0;
  content: "";
  width: 12px;
  height: 12px;
  border-top: 2px solid #FFF;
  border-right: 2px solid #FFF;
  transform: rotate(45deg);
}

.modal__button--return {
  color: #333;
  background-color: #FFF;
  text-align: center;
  box-shadow: 0 2px 0 0 #CCC;
  border: solid 2px #CCC;
  border-radius: 4px;
}

.modal__button--return:active {
  transform: translateY(4px);
  box-shadow: none;
}

.accordion .accordion__list {
  font-size: 13px;
  line-height: 1.5;
}

.accordion .accordion__list dt {
  font-size: 16px;
  font-weight: 700;
  padding: 12px 0;
  border-bottom: 1px solid #EFEFEF;
  position: relative;
}

.accordion .accordion__list dt::after {
  position: absolute;
  top: 38%;
  right: 3px;
  content: "";
  width: 8px;
  height: 8px;
  border-top: 2px solid #CCC;
  border-right: 2px solid #CCC;
  transform: rotate(135deg);
}

.accordion .accordion__list dd {
  display: none;
  padding: 12px;
  background-color: #F7F7F7;
}

.accordion .accordion__list--block:not(:first-of-type) {
  margin-top: 16px;
}

.accordion .accordion__heading {
  font-size: 16px !important;
  font-weight: 700 !important;
  margin: 0 0 8px;
}

.accordion table {
  border-collapse: collapse;
}

.accordion th,
.accordion td {
  border: 1px solid #999;
  padding: 4px;
}

.accordion th {
  width: 3em;
}

.accordion li {
  text-indent: -1em;
  padding-left: 1em;
}

.accordion li:not(:first-of-type) {
  margin-top: 8px;
}

.accordion__cap {
  font-size: 12px !important;
}

.accordion img {
  max-width: 100%;
  height: auto;
}

.modal-accessories {
  width: 980px;
  top: 10%;
  z-index: 102;
}

.modal-accessories .modal__title {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  margin: 0 0 32px;
  padding: 0 0 16px;
  border-bottom: 1px solid #333;
}

.modal-accessories .modal__scroll {
  height: 560px;
}

.modal-accessories .modal__heading {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 8px;
}

.modal-accessories .modal__attention {
  font-size: 13px;
  line-height: 1.3;
  margin: 16px 0 0;
}

.modal-accessories img {
  max-width: 100%;
  height: auto;
}

.modal-accessories__list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.modal-accessories__item {
  display: table;
  border: 1px solid #CCC;
  border-collapse: collapse;
  width: 49%;
}

.modal-accessories__item:not(:nth-child(-n+2)) {
  margin-top: 16px;
}

.modal-accessories__item--image {
  width: 120px;
}

.modal-accessories__item dt {
  display: table-cell;
  width: 100px;
  font-weight: 700;
  padding: 8px;
  box-sizing: border-box;
  border: 1px solid #CCC;
}

.modal-accessories__item dd {
  display: table-cell;
  padding: 8px;
  box-sizing: border-box;
  border: 1px solid #CCC;
}

.modal-accessories__item dd img {
  width: 120px;
  height: auto;
}

.modal-accessories .breakdown {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  font-size: 13px;
  margin: 4px 0 0;
}

.modal-accessories .breakdown dd {
  font-weight: 700;
}

.modal-accessories__banner {
  text-align: center;
  margin: 8px 0 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
  color: #FF5E00;
}

.modal-accessories__attention {
  text-align: center;
  margin: 16px 0 0;
  color: #FF5E00;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
}

.modal-warranty {
  width: 980px;
  top: 10%;
  z-index: 102;
}

.modal-warranty .modal__title {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  margin: 0 0 32px;
  padding: 0 0 16px;
  border-bottom: 1px solid #333;
}

.modal-warranty .modal__scroll {
  height: 560px;
}

.modal-warranty .modal__heading {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 8px;
}

.modal-warranty .modal__attention {
  font-size: 13px;
  line-height: 1.5;
  margin: 16px 0 0;
}

.modal-warranty img {
  max-width: 100%;
  height: auto;
}

.modal-warranty__list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  flex-direction: column;
  font-size: 14px;
  line-height: 1.5;
  margin-bottom: 16px;
}

.modal-warranty__list li {
  text-indent: -1em;
  padding-left: 1em;
}

.modal-warranty__item {
  display: table;
  border: 1px solid #CCC;
  border-collapse: collapse;
  width: 49%;
}

.modal-warranty__item:not(:nth-child(-n+2)) {
  margin-top: 16px;
}

.modal-warranty__item dt {
  display: table-cell;
  width: 100px;
  font-weight: 700;
  padding: 8px;
  box-sizing: border-box;
  border: 1px solid #CCC;
}

.modal-warranty__item dd {
  display: table-cell;
  padding: 8px;
  box-sizing: border-box;
  border: 1px solid #CCC;
}

.modal-warranty__item dd img {
  width: 120px;
  height: auto;
}

.modal-warranty .breakdown {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  font-size: 13px;
  margin: 4px 0 0;
}

.modal-warranty .breakdown dd {
  font-weight: 700;
}

.modal-warranty__banner {
  text-align: center;
  margin: 8px 0 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
  color: #FF5E00;
}

.modal-warranty__attention {
  text-align: center;
  margin: 16px 0 0;
  color: #FF5E00;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
}

.modal-warranty__point--title {
  font-size: 16px;
  font-weight: 700;
  margin: 0 0 8px;
}

.detail__header--icon:hover .tooltip,
.tooltip__table:hover + .tooltip,
.tooltip__trigger:hover + .tooltip {
  display: inline-block;
}

.tooltip {
  display: none;
  background-color: #777;
  width: 500px;
  text-align: left;
  position: absolute;
  top: 50px;
  left: 0;
  z-index: 100;
  color: #FFF;
}

.table .tooltip {
  left: 340px;
}

.lease-info .tooltip {
  top: 290px;
}

.tooltip__inner {
  padding: 16px;
}

.tooltip__title {
  font-size: 15px;
  font-weight: 700;
  text-indent: 0;
}

.tooltip__text {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  margin-top: 8px;
}

.tooltip__list li {
  text-indent: -1em;
  padding-left: 1em;
}

.modal__bg {
  z-index: 2;
}

.header {
  border-bottom: 1px solid #ccc;
  margin: 0 0 20px;
}

.header__inner {
  width: 1020px;
  margin: auto;
}

.header__title {
  display: flex;
  font-size: 24px;
  font-weight: 700;
  padding: 20px 0;
}

.header__logo img {
  width: auto;
  height: 25px;
}

.header__text {
  margin-left: 24px;
}

.footer {
  border-top: 1px solid #ccc;
  padding: 24px;
  margin: 24px 0 0;
  text-align: center;
}

.footer small {
  font-size: 12px;
}

.wrapper__inner {
  margin: auto;
  box-sizing: border-box;
  background-color: #fff;
  padding: 20px 0 60px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.select-model__title {
  font-size: 22px;
  font-weight: 700;
  display: flex;
  align-items: center;
  padding-bottom: 8px;
  margin-bottom: 16px;
  border-bottom: 2px solid #d8d8d8;
}

.select-model__think {
  font-size: 11px;
  font-weight: 400;
  background-color: #C00;
  color: #fff;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 5px;
  margin-left: 8px;
}

.select-model__image {
  max-width: 100%;
  height: auto;
}

.select-model__name {
  font-weight: 700;
  line-height: 1.3;
  border-bottom: 1px solid #ccc;
  position: relative;
}

.select-model__deta--toggle {
  background: none;
  outline: 0;
  border: 0;
  padding: 0;
  display: flex;
  align-items: center;
  margin-bottom: 8px;
}

.select-model__deta--toggle img {
  margin-right: 4px;
}

.select-model__basic {
  display: flex;
  justify-content: space-between;
  align-items: center;
  line-height: 1.4;
}

.select-model__basic dd {
  display: flex;
  align-items: center;
}

.select-model__basic + .bonus {
  margin-bottom: 8px;
  text-align: right;
}

.select-model__option {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  line-height: 1.4;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

.select-model__option:empty,
.select-model__option--empty {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}

.select-model__option dt {
  width: 80%;
}

.select-model__option dd {
  width: 20%;
  text-align: right;
}

.select-model__option img {
  width: 18px;
}

.select-model__cap {
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
  margin-top: 12px;
}

.select-model__value {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 700;
  margin-top: -2px;
}

.select-model__unit {
  margin-left: 2px;
}

.select-model__tax {
  margin-left: -0.5em;
  margin-right: -0.5em;
}

.page-title {
  font-size: 36px;
  font-weight: 700;
  margin: 0 0 16px;
  width: auto;
}

.input__flow {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  width: 70%;
  margin: 8px auto 16px;
}

.input__flow li {
  position: relative;
}

.input__flow li span {
  display: block;
  background-color: #e1e1e1;
  color: #fff;
  border-radius: 36px;
  width: 36px;
  height: 36px;
  text-align: center;
  font-size: 22px;
  line-height: 39px;
}

.input__flow li span.is-current {
  background-color: #c00;
}

.input__flow li:not(:last-child)::after {
  content: "";
  position: absolute;
  right: -15px;
  top: 33%;
  left: 40px;
  box-sizing: border-box;
  width: 6px;
  height: 6px;
  border: 6px solid transparent;
  border-left: 6px solid #e1e1e1;
}

.entry-form {
  font-size: 15px;
  line-height: 1.6;
  /*   .kakunin {
      margin       : auto auto 2em;
      text-align   : center;
      border       : 1px solid #CCC;
      border-radius: 6px;
      cursor       : pointer;
      width        : 100%;
      padding      : 16px 8px;
      box-sizing   : border-box;
      font-size    : 12px;
      position     : relative;
    }
    .licence {
      text-align   : center;
    }
    .attention {
      color        : #FF2C00;
    } */
}

.entry-form section:not(:first-of-type) {
  margin-top: 40px;
}

.entry-form section.entry-form__submit2next {
  margin-top: 30px;
}

.entry-form section p:last-child {
  margin-bottom: 0;
}

.entry-form__hide-block {
  margin: 16px 0 0;
}

.entry-form__header {
  background-color: #f7f7f7;
  border-top: solid 2px #c00;
  text-align: center;
  color: #333;
  padding: 20px;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.3;
}

.entry-form__block:not(:first-of-type) {
  margin: 16px 0 0;
}

.entry-form__block label {
  display: flex;
  align-items: center;
}

.entry-form__text--bold {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 4px;
}

.entry-form__heading {
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
  padding-bottom: 8px;
  margin-bottom: 16px;
  border-bottom: 2px solid #d8d8d8;
}

.entry-form__title {
  display: flex;
  align-items: center;
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
}

.entry-form__title--sub {
  margin-left: 1em;
  font-size: 12px;
  font-weight: normal;
}

.entry-form__flow {
  margin: 1em 0;
}

.entry-form__flow img {
  max-width: 100%;
  height: auto;
  text-align: center;
}

.entry-form__text--center {
  text-align: center;
}

.entry-form__attention {
  font-size: 17px;
  text-align: center;
  margin: 8px 0;
  background-color: #fffde8;
  padding: 8px;
}

.submit-button {
  display: block;
  text-decoration: none;
  text-align: center;
  width: 100%;
  padding: 16px;
  box-sizing: border-box;
  font-size: 18px;
  font-weight: 700;
}

.submit-button > span {
  font-size: 15px;
}

.submit-button--next {
  position: relative;
  color: #fff;
  background-color: #c00;
}

.submit-button--next::after {
  content: "▲";
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 50%;
  right: 16px;
  margin-top: -11px;
  width: 22px;
  height: 22px;
  color: #c00;
  background-color: #fff;
  font-size: 13px;
  border-radius: 50%;
  transform: rotate(90deg);
}

.submit-button--revise {
  color: #333;
  background-color: #fff;
  margin: 16px 0 0;
  border: 2px solid #222;
}

.submit-button--revise > span::before {
  content: "▲";
  display: inline-block;
  margin-top: -3px;
  margin-right: 3px;
  width: 22px;
  height: 22px;
  color: #999;
  font-size: 13px;
  vertical-align: middle;
  border-radius: 50%;
  transform: rotate(-90deg);
}

.submit-button--backtop {
  color: #fff;
  background-color: #999;
  margin: 16px 0 0;
}

.submit-button--backtop > span {
  position: relative;
  padding-left: 26px;
}

.submit-button--backtop > span::before {
  content: "▲";
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -12px;
  width: 22px;
  height: 22px;
  color: #999;
  background-color: #fff;
  font-size: 12px;
  border-radius: 50%;
  box-sizing: border-box;
}

.button__disables {
  background-color: #ccc;
  pointer-events: none;
}

.button__disables.submit-button--next::after {
  color: #ccc;
}

.submit-button__caption {
  font-size: 11px;
  line-height: 1.3;
  margin-top: 8px;
}

ul.submit-button__caption {
  margin-top: 15px;
}

.hide {
  display: none !important;
}

input[type=text],
input[type=tel],
input[type=email],
select,
.birth-button {
  border: 1px solid #ccc;
  border-radius: 6px;
  height: 48px;
  box-sizing: border-box;
  font-size: 16px;
  padding: 8px;
}

input[type=text].has-error,
input[type=tel].has-error,
input[type=email].has-error,
select.has-error {
  border: 1px solid #ff7f75;
  background-color: #f8ecec;
}

.birth-button {
  width: 100%;
}

.input__text--long {
  width: 100%;
}

.input__num--short {
  width: 30%;
}

.input__num--middle {
  width: 37%;
}

.input__num--long {
  width: calc(100% - 3.5em);
  margin: 0 0.3em;
}

.input__num--hyphen {
  margin: 0 4px;
}

.zip-button {
  width: 55%;
  margin-left: 13px;
  border: 1px solid #dedcd7;
  border-radius: 3px;
  background: linear-gradient(to bottom, #fff 85%, #f6f6f6 100%);
  color: #666;
  padding: 8px;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}

.zip-modal {
  display: flex;
  justify-content: center;
  overflow: hidden;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 310;
}

.zip-modal__contents {
  overflow: auto;
  position: relative;
  margin: auto;
  max-height: calc(100vh - 40px);
  width: 640px;
}

.zip-modal__innser {
  background-color: #fff;
  box-shadow: 0 0.125rem 0.1875rem rgba(10, 10, 10, 0.1), 0 0 0 0.0625rem rgba(10, 10, 10, 0.1);
  border-radius: 5px;
  padding: 16px;
}

.zip-modal__title {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 16px;
}

.zip-modal__close {
  position: absolute;
  right: 20px;
  top: 20px;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}

.zip-modal__select {
  border: 1px solid #ccc;
  width: 100%;
  box-sizing: border-box;
  margin-top: 8px;
  background-color: #f7f7f7;
}

.zip-modal__select dt {
  font-size: 13px;
  padding: 8px 8px 0;
}

.zip-modal__select dd {
  padding: 0 8px 0 0;
}

.zip-modal__select select {
  cursor: pointer;
}

.zip-modal__select select,
.zip-modal__select input {
  border: 0;
  padding: 8px;
  background: none;
  width: 100%;
  height: 38px;
  box-sizing: border-box;
  display: block;
  outline: 0;
}

.zip-modal__select input:-internal-autofill-selected {
  background: none;
}

.zip-modal__list {
  border-bottom: 1px solid #ccc;
}

.zip-modal__list--item:not(:first-of-type) {
  border-top: 1px solid #ccc;
}

.zip-modal__list--item a {
  padding: 8px 0;
  display: block;
  text-decoration: none;
  color: inherit;
}

.zip-modal__button {
  background-color: #ccc;
  color: #666;
  border: 0;
  width: 50%;
  margin: 16px auto 0;
  padding: 12px;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  display: block;
}

.zip-modal__button--focus {
  background-color: #ff9800;
  color: #fff;
}

.zip-modal__button--back {
  background-color: #fff;
  border: 2px solid #333;
  color: #333;
}

.zip-modal__message {
  margin: 20px 0;
  font-size: 16px;
  line-height: 1.5;
  text-align: center;
  background-color: #f7f7f7;
  padding: 60px 16px;
}

.zip-modal__pager {
  margin-top: 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
}

.zip-modal__pager--number {
  background-color: #666;
  color: #fff;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  padding: 4px;
}

.zip-modal__pager--prev a,
.zip-modal__pager--next a {
  color: inherit;
  text-decoration: none;
}

.zip-modal__pager--prev,
.zip-modal__pager--next {
  width: 5em;
}

input::-moz-placeholder {
  color: #ccc;
}

input::placeholder {
  color: #ccc;
}

.selModal .selModalInner ul li.selected::before,
.selModal .selModalInner ul li:hover::before {
  background-color: #fff;
  width: 0;
}

.selModal .selModalInner {
  width: 90%;
  max-height: 80%;
  border-radius: 0;
}

.selModalButton {
  height: 48px;
  font-size: 16px;
  padding: 8px;
  border: 1px solid #e1e1e1;
  border-radius: 6px;
}

.selModalButton::before {
  top: 35%;
}

.selModalButton::after {
  bottom: 35%;
}

.radio-button {
  display: none;
}

.radio-button__wrap {
  box-sizing: border-box;
  transition: background-color 0.2s linear;
  position: relative;
  display: block;
  padding: 14px 8px 13px 36px;
  vertical-align: middle;
  cursor: pointer;
}

.radio-button__wrap:hover:after {
  border-color: #c00;
}

.radio-button__wrap::after {
  transition: border-color 0.2s linear;
  position: absolute;
  top: 52%;
  left: 8px;
  display: block;
  margin-top: -12px;
  width: 22px;
  height: 22px;
  background-color: #ebebeb;
  border-radius: 2px;
  content: "";
}

input[type=checkbox]:checked + .radio-button__wrap::after {
  background-color: #c00;
}

.radio-button__wrap:before {
  transition: opacity 0.2s linear;
  position: absolute;
  top: 52%;
  left: 8px;
  z-index: 1;
  display: block;
  margin-top: -12px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background-color: #c00;
  content: "";
  opacity: 0;
}

input[type=radio]:checked + .radio-button__wrap:before {
  opacity: 1;
}

.radio-button__wrap::after {
  border-radius: 12px;
}

.select__wrap {
  margin: 8px 0 0;
}

.input__wrap {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: flex-start;
  margin: 8px 0 0;
}

.input__wrap--name li {
  width: 49%;
}

.input__wrap--name input {
  width: 100%;
}

.input__wrap--tel li {
  width: 30%;
  position: relative;
}

.input__wrap--tel li:nth-child(2)::before {
  content: "-";
  display: inline-block;
  position: absolute;
  top: 30%;
  left: -12%;
}

.input__wrap--tel li:nth-child(2)::after {
  content: "-";
  display: inline-block;
  position: absolute;
  top: 30%;
  right: -12%;
}

.input__wrap--post {
  justify-content: flex-start;
}

.input__wrap--post li {
  width: 30%;
  position: relative;
}

.input__wrap--post li:last-child {
  margin-left: 1.5em;
}

.input__wrap--post li:last-child::before {
  content: "-";
  display: inline-block;
  position: absolute;
  top: 30%;
  left: -12%;
}

.input__wrap--email li {
  width: 100%;
}

.input__wrap--birth li {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
}

.input__wrap--birth li:first-child {
  width: 46%;
}

.input__wrap--birth li:nth-child(2) {
  width: 25%;
}

.input__wrap--birth li:last-child {
  width: 25%;
}

.input__wrap--birth input {
  width: 100%;
}

.input__wrap--house li {
  width: 100%;
  box-sizing: border-box;
  border: solid 1px #e1e1e1;
  border-radius: 4px;
}

.input__wrap--house li:not(:first-child) {
  margin: 8px 0 0;
}

.input__wrap.has-error .radio-button__wrap {
  border: 1px solid #ff7f75;
  background-color: #f8ecec;
}

.message {
  color: #666;
  font-size: 11px;
  display: block;
  margin: 4px 0;
}

.error {
  color: #de071c;
  font-size: 11px;
  display: none;
}

.is-required {
  background-color: #fff;
  border: 1px solid #c00;
  border-radius: 4px;
  color: #c00;
  display: inline-block;
  width: 24px;
  padding: 4px 6px;
  font-size: 11px;
  margin: 0 4px 0 0;
}

.is-required.is-ok {
  content: "";
  background-color: #009245;
  border-radius: 4px;
  border: none;
  display: inline-block;
  width: 38px;
  height: 21px;
  margin: 0 4px 0 0;
  padding: 0;
  position: relative;
}

.is-required.is-ok:after {
  content: "";
  display: block;
  border-bottom: 3px solid #fff;
  border-left: 3px solid #fff;
  width: 10px;
  height: 6px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -80%) rotate(-45deg);
}

/*complete*/

.complete__heading {
  font-size: 24px;
  font-weight: 700;
}

.item {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.item.hr {
  border-bottom: 1px solid #ccc;
  padding: 12px 0;
}

.item dt {
  font-size: 14px;
  font-weight: 700;
  flex-basis: 45%;
}

.item dt br {
  display: none;
}

.item dd {
  font-size: 14px;
  line-height: 1.4;
}

.lease-car.hr {
  border-bottom: 1px solid #999;
  padding: 8px 0;
}

.lease-car dt {
  font-size: 12px;
  font-weight: 700;
}

.lease-car dd {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
}

.lease-car dd .__price {
  font-size: 12px;
  text-align: right;
  flex-basis: 35%;
  flex-grow: 1;
}

.lease-car dd .__price span {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 24px;
  font-weight: 700;
  margin: 0 2px 0 0;
}

.checkbox:checked ~ .checkbox__kakunin::before {
  background-color: #00b0f0;
  border-color: #00b0f0;
}

.checkbox:checked ~ .checkbox__kakunin::after {
  opacity: 1;
}

.checkbox__kakunin {
  position: relative;
  display: inline-flex;
  align-items: center;
  text-align: center;
  font-size: 14px;
  cursor: pointer;
  margin: auto;
  width: 210px;
}

.checkbox__kakunin::before {
  display: inline-block;
  position: relative;
  top: 0;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  width: 24px;
  height: 24px;
  content: "";
  margin: 0 8px 0 0;
}

.checkbox__kakunin::after {
  position: absolute;
  top: 6px;
  left: 6px;
  content: "";
  width: 11px;
  height: 5px;
  border-top: 4px solid #fff;
  border-right: 4px solid #fff;
  transform: rotate(135deg);
  opacity: 0;
}

.js-error {
  color: #de071c;
  font-size: 11px;
  margin-top: 4px;
}

input[type=text].next-input,
input[type=tel].next-input,
input[type=email].next-input,
select.next-input {
  border: 1px solid #00836b;
  background-color: #fcfade;
}

.input__wrap.next-input .radio-button__wrap {
  border: 1px solid #00836b;
  background-color: #fcfade;
}

.info-block {
  width: 100%;
  background-color: #feefc2;
  box-sizing: border-box;
  padding: 16px;
  margin: 16px 0 0;
}

.info-block.info-block__form {
  background-color: #fff8bd;
  margin: 0 0 16px;
}

.info-block.info-block__inquiry {
  background-color: #fff8bd;
  margin: 16px 0;
}

.info-block.info-block__footer {
  background-color: #fff8bd;
}

.info-block__title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 0.5em;
}

.info-block p {
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
}

.info-block span {
  color: #c00;
  font-weight: 700;
}

section .consent-text {
  font-size: 14px;
  margin: 0 0 0.6em;
}

.popup {
  width: 780px;
  height: 400px;
  position: fixed;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  margin: auto;
  z-index: 400;
  display: none;
}

.popup__close {
  border: 0;
  background: none;
  outline: 0;
  padding: 0;
  position: absolute;
  top: -20px;
  right: 100px;
  width: 36px;
  height: 36px;
  cursor: pointer;
}

.popup__close img {
  width: 100%;
  height: auto;
}

.popup__contents img {
  max-width: 100%;
  height: auto;
}

.popup__bg {
  position: fixed;
  z-index: 300;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.8);
  display: none;
}

.popup-open {
  overflow: hidden;
}

/*サジェスト調整*/

.ui-menu .ui-menu-item-wrapper {
  padding: 10px;
  font-size: 14px;
}

.ui-autocomplete.ui-widget-content {
  font-size: 14px;
  z-index: 10000;
}

.is-focus {
  border-color: #ffc107;
  border-width: 2px;
  background-color: #fffce0;
}

input:-webkit-autofill {
  -webkit-transition: background-color 5000s ease-in-out 0s !important;
  transition: background-color 5000s ease-in-out 0s !important;
}

.entry-form__campaign {
  padding: 16px;
  background-color: #fffce0;
  border: 1px solid #ffeb3b;
  border-radius: 8px;
  text-align: center;
  margin-bottom: 24px;
}

.entry-form__campaign--order {
  padding: 10px;
  background-color: #ffffff;
  border: 1px solid #ffeb3b;
  border-radius: 8px;
  text-align: center;
  margin-bottom: 24px;
  width: 100%;
}

.entry-form__campaign--order span {
  font-weight: 700;
}

.entry-form__complete--campaign {
  margin-top: 44px;
  margin-bottom: 44px;
}

.birth-button {
  line-height: 1.8;
  cursor: pointer;
}

.birthMonth-modal,
.birthDay-modal {
  display: flex;
  justify-content: center;
  overflow: hidden;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 101;
}

.birthdate-modal__close {
  position: absolute;
  right: 20px;
  top: 20px;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}

.birthMonth-modal,
.birthDay-modal {
  background: rgba(0, 0, 0, 0.8);
}

.birthdate-modal__contents {
  overflow: auto;
  position: relative;
  margin: auto;
  max-height: calc(100vh - 40px);
  width: 640px;
}

.birthdate-modal__inner {
  background-color: #fff;
  box-shadow: 0 0.125rem 0.1875rem rgba(10, 10, 10, 0.1), 0 0 0 0.0625rem rgba(10, 10, 10, 0.1);
  border-radius: 5px;
  padding: 16px;
}

.birthdate__title {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 16px;
}

.birthdate-month {
  display: flex;
  flex-wrap: wrap;
  max-width: 560px;
  margin: 0 auto;
}

.birthdate-month__btn {
  width: 21%;
  height: 50px;
  margin: 10px 2%;
  padding: 0;
  box-sizing: border-box;
  font-size: 30px;
  font-weight: 700;
  border: solid 1px #ffc107;
  border-radius: 4px;
  background-color: #fffce0;
  box-shadow: rgba(0, 0, 0, 0.5) 0px 2px 5px -1px;
  cursor: pointer;
}

.birthdate-month__btn:nth-child(4n) {
  margin-right: 0;
}

.birthdate-day__btn {
  width: 16%;
  height: 50px;
  margin: 10px 2%;
  padding: 0;
  box-sizing: border-box;
  font-size: 30px;
  font-weight: 700;
  border: solid 1px #ffc107;
  border-radius: 4px;
  background-color: #fffce0;
  box-shadow: rgba(0, 0, 0, 0.5) 0px 2px 5px -1px;
  cursor: pointer;
}

.birthdate-day__btn:nth-child(5n) {
  margin-right: 0;
}

.birthdate-day__btn:disabled {
  border: solid 1px #666;
  background-color: #ccc;
  color: #666;
  cursor: not-allowed;
}

.placeholder-txt {
  color: #ccc;
}

::-moz-placeholder {
  color: #ccc;
}

::placeholder {
  color: #ccc;
}

input,
select,
button {
  color: #000;
}

.entry-form__price {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.entry-form__price li {
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
}

.entry-form__price--text {
  cursor: pointer;
}

.entry-form__price--radio {
  opacity: 0;
}

.entry-form__price--radio:checked + .entry-form__price--text {
  background-color: #00836b;
}

.flow {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}

.flow ul {
  display: flex;
  justify-content: space-between;
  background-color: #efefef;
}

.flow li {
  box-sizing: border-box;
  width: 25%;
  height: 50px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
}

.flow li:not(:first-child):not(:last-child) {
  padding: 0 0 0 10px;
  /* 最初と最後以外には左に適度な余白を指定 */
}

.flow li::before,
.flow li::after {
  content: "";
  width: 0;
  height: 0;
  display: block;
  position: absolute;
}

.flow li::before {
  border: solid 32px transparent;
  border-right: solid 13px transparent;
  border-left: solid 13px #FFF;
  top: -7px;
  left: 0;
  z-index: 1;
}

.flow li::after {
  border: solid 25px transparent;
  border-left: solid 10px #EDEDED;
  border-right: solid 10px transparent;
  top: 0;
  right: -20px;
  z-index: 2;
}

.flow li:first-child::before,
.flow li:last-child::after {
  content: none;
  /* 最初のliの左と最後のliの右は作らない */
}

.flow .is-current {
  background-color: #C00;
  color: #fff;
}

.flow .is-current::after {
  border-left: solid 10px #C00;
}

.flow .step {
  line-height: 1;
  margin-bottom: 4px;
}

.flow .text {
  font-weight: 700;
}

.order-flow {
  position: relative;
  z-index: 0;
}

.progressbar {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.progressbar li {
  position: relative;
  list-style-type: none;
  text-align: center;
  text-transform: uppercase;
  width: 33.3333333333%;
  color: #999;
  counter-increment: steps;
}

.progressbar li:before {
  display: block;
  position: relative;
  width: 29px;
  height: 29px;
  margin: 7px auto 8px auto;
  content: "";
  line-height: 30px;
  color: #FFF;
  text-align: center;
  border-radius: 50%;
  background-color: #999;
  content: counter(steps);
  z-index: 1;
}

.progressbar li:after {
  position: absolute;
  top: 48%;
  left: -50%;
  width: 100%;
  height: 2px;
  content: "";
  background-color: #999;
}

.progressbar li:first-child:after {
  content: none;
}

.progressbar li.active,
.progressbar li.complete {
  color: #D90D0D;
}

.progressbar li.active:before,
.progressbar li.complete:before {
  background-color: #D90D0D;
  color: #FFF;
}

.progressbar li.active:after,
.progressbar li.complete:after {
  background-color: #D90D0D;
}

.progressbar li.activebar:after {
  background-color: #D90D0D;
}

.license-area {
  margin: 12px auto 12px;
  text-align: center;
}

.license-area .license-area__text {
  display: inline-block;
  margin: 0 auto;
  padding: 4px 16px;
  font-size: 13px;
  line-height: 1.5;
  text-align: center;
  background: #f7f7f7;
}

.license-area .license-area__image {
  margin: 0 auto 8px;
}

.license-area .license-area__image img {
  width: 100%;
  max-width: 100%;
  height: auto;
}

.addaboutOffice {
  margin-top: 40px;
}

.paymentlist {
  margin-top: 12px;
  padding: 8px 8px;
  background-color: #EFEFEF;
}

.paymentlist__kome {
  font-size: 12px;
}

.paymentlist__inner {
  padding: 8px;
  font-size: 14px;
  background-color: #EFEFEF;
  transition: transform 0.4s;
}

summary {
  display: block;
  position: relative;
}

summary::-webkit-details-marker {
  display: none;
}

.paymentlist__icon {
  display: block;
  position: absolute;
  width: 12px;
  margin-left: 6px;
  flex-shrink: 0;
  transform-origin: center 43%;
  transition: transform 0.4s;
  top: 45%;
  right: 8px;
}

details[open] .paymentlist__icon {
  transform: rotate(180deg);
}

.paymentlist__icon::before,
.paymentlist__icon::after {
  content: "";
  position: absolute;
  display: block;
  width: 8px;
  height: 3px;
  background-color: #666;
}

.paymentlist__icon::before {
  left: 0;
  transform: rotate(45deg);
}

.paymentlist__icon::after {
  right: 0;
  transform: rotate(-45deg);
}

.holiday__comment {
  width: 100%;
  border: 1px dashed #ffb400;
  border-radius: 12px;
  box-sizing: border-box;
  padding: 16px 25px;
  display: grid;
  place-items: center;
  line-height: 1.5;
  color: #24272a;
  margin: 32px auto 32px;
}

.holiday__comment p {
  font-size: 14px;
  margin: 0;
  margin-top: 8px;
}

.holiday__comment .holiday__comment-title {
  font-size: 18px;
  font-weight: 700;
}

@media screen and (min-width: 640px) {
  .plans__change .plans__change-btn {
    cursor: pointer;
  }

  .modal-years .modal__select--list li:first-child:nth-last-child(3),
  .modal-years .modal__select--list li:first-child:nth-last-child(3) ~ li {
    width: 33.4%;
  }

  .modal-years .modal__select--list li:first-child:nth-last-child(2),
  .modal-years .modal__select--list li:first-child:nth-last-child(2) ~ li {
    width: 50.1%;
  }

  .modal-years .modal-years .modal__select--list li:first-child:nth-last-child(2) ~ li {
    border-left: none;
  }

  .modal-years .modal__select--list li:not(:first-of-type) {
    margin-left: -2px;
  }

  .modal-bonus .modal__select--list li:not(:first-of-type) {
    margin-left: -1px;
  }

  .modal-option .modal__select--item {
    border: 1px solid #CCC;
    padding: 16px;
    box-sizing: border-box;
  }

  .modal-option .modal__coupon--item {
    width: 49%;
    border: 1px solid #CCC;
    padding: 16px;
    box-sizing: border-box;
  }

  .modal-option .modal__select--coupon:not(:nth-child(-n+2)) {
    margin-top: 16px;
  }

  .modal-option .modal__service--item {
    width: 49%;
    border: 1px solid #CCC;
    box-sizing: border-box;
  }

  .modal__button__campaign {
    margin-bottom: 32px;
  }

  .modal__button--return {
    width: 10%;
    margin-right: 12px;
    font-size: 22px;
    cursor: pointer;
  }

  .is-sp {
    display: none !important;
  }

  .select-model {
    width: 320px;
    height: 400px;
    position: sticky;
    top: 10px;
  }

  .select-model__name {
    font-size: 16px;
    padding-bottom: 12px;
    margin-top: 12px;
    margin-bottom: 12px;
  }

  .select-model__deta--toggle {
    cursor: pointer;
  }

  .select-model__basic {
    font-size: 15px;
  }

  .select-model__basic + .bonus {
    font-size: 12px;
  }

  .select-model__option {
    font-size: 15px;
    margin-top: 12px;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .select-model__value {
    font-size: 18px;
  }

  .select-model__unit {
    font-size: 11px;
  }

  .select-model__tax {
    font-size: 11px;
  }

  .entry-form {
    width: 620px;
    margin: auto;
  }

  .entry-form__heading br {
    display: none;
  }

  .popup__contents {
    width: 450px;
    height: auto;
    margin: 0 auto;
    cursor: pointer;
  }

  .entry-form__campaign br {
    display: none;
  }

  .entry-form__price li {
    width: 32%;
  }

  .entry-form__price li:not(:nth-child(-n+3)) {
    margin-top: 16px;
  }

  .flow {
    margin: 16px auto 32px;
  }

  .flow .step {
    font-size: 12px;
  }

  .flow .text {
    font-size: 14px;
  }

  .progressbar {
    margin: 16px auto 32px;
    padding: 0;
  }

  .progressbar li {
    font-size: 14px;
  }

  .progressbar li:before {
    font-size: 15px;
  }

  .license-area {
    width: 620px;
  }

  .license-area .license-area__image {
    width: 40%;
  }

  .paymentlist {
    cursor: pointer;
  }
}

@media screen and (max-width: 640px) {
  body {
    height: 100%;
  }

  .modal {
    padding: 0;
    font-size: 14px;
  }

  .modal .modal__close,
  .modal .modal__close--option {
    width: 60px;
    height: 40px;
    color: #333;
    z-index: 10;
    font-size: 40px;
  }

  .modal .modal__inner {
    padding: 16px;
    overflow-y: auto;
    height: 100%;
  }

  .modal .modal__scroll {
    overflow-y: auto;
    padding-right: 16px;
  }

  .modal__title {
    font-size: 20px;
  }

  .modal-grade {
    width: 100%;
    box-sizing: border-box;
    padding: 0;
    top: 0;
    bottom: 0;
    transform: translateY(0);
  }

  .modal-grade .modal__scroll {
    height: 100%;
    padding-bottom: 130px;
  }

  .modal-grade .modal__model--comment {
    font-size: 12px;
  }

  .modal-grade .modal__model--list label {
    padding: 12px 0 10px 60px;
  }

  .modal-grade .modal__model--list label::before {
    border-width: 6px;
    width: 22px;
    height: 10px;
    left: 10px;
  }

  .modal-grade .modal__order {
    flex-direction: column;
  }

  .modal-grade .modal__model-name {
    flex-direction: column;
    align-items: flex-start;
  }

  .modal-grade .modal__select--engine .radio,
  .modal-grade .modal__select--drive .radio {
    font-size: 12px;
  }

  .modal-grade .modal__select--drive {
    width: 100%;
    margin: 8px 0 0;
  }

  .modal-grade .modal__select--engine {
    width: 100%;
  }

  .modal-grade .modal__engine--title {
    font-size: 14px;
    width: 4.5em;
  }

  .modal-grade .modal__engine--list {
    width: 110px;
  }

  .modal-grade .modal__drive--title {
    font-size: 14px;
    width: 4.5em;
  }

  .modal-grade .modal__drive--list {
    width: 110px;
  }

  .modal-grade .modal__price {
    text-align: left;
    margin-top: 8px;
    display: flex;
    align-items: baseline;
  }

  .modal-grade .modal__price--unit {
    display: flex;
    align-items: baseline;
  }

  .modal-grade .modal__meta {
    flex-direction: column;
    align-items: flex-start;
    margin-top: 8px;
  }

  .modal-grade .modal__meta--sub {
    margin-left: 0;
  }

  .modal-years {
    width: 100%;
    box-sizing: border-box;
    padding: 0;
    top: 0;
    bottom: 0;
    transform: translateY(0);
    padding: 0;
  }

  .modal-years .modal__scroll {
    height: 100%;
    padding-bottom: 200px;
  }

  .modal-years .modal__select--list {
    flex-direction: column;
  }

  .modal-years .modal__select--list li {
    width: 100%;
    height: auto;
    border: none;
    border-bottom: 1px solid #CCC;
  }

  .modal-years .modal__select--list li:first-of-type {
    border-top: 1px solid #CCC;
  }

  .modal-years .modal__select--list li:not(:first-of-type) {
    margin-top: -1px;
  }

  .modal-years .modal__select--years {
    border-radius: 4px;
    gap: 4px;
    margin-top: 0;
    width: 170px;
  }

  .modal-years .modal__select--recommend {
    background: #fff;
    border: 2px solid #ccc;
    border-radius: 4px;
    color: #c00;
    font-size: 14px;
    height: auto;
    padding: 6px;
    width: auto;
  }

  .modal-years .modal__select--title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 14px;
    background: #333;
    border-radius: 4px;
    color: #fff;
    display: inline-block;
    padding: 8px;
  }

  .modal-years .modal__select--price {
    justify-content: flex-start;
    margin-top: 16px;
    line-height: 1;
  }

  .modal-years .modal__select--price span {
    font-size: 28px;
  }

  .modal-years .modal__select--cap {
    font-size: 14px;
    text-align: left;
    margin-top: 16px;
    margin-bottom: 0;
  }

  .modal-years .modal__select--cap br {
    display: none;
  }

  .modal-years .modal__select--button {
    display: none;
  }

  .modal-years .radio-plan {
    padding: 16px 0 16px 50px;
  }

  .modal-years .radio-plan::after {
    border-width: 6px;
    top: 40%;
    left: 0;
    right: auto;
    width: 22px;
    height: 10px;
  }

  .modal-bonus {
    top: 10%;
    bottom: 10%;
  }

  .modal-bonus .modal__scroll {
    height: 100%;
    padding-bottom: 130px;
  }

  .modal-bonus .modal__select--list {
    flex-direction: column;
  }

  .modal-bonus .modal__select--list li {
    border: none;
    border-bottom: 1px solid #CCC;
    width: 100%;
    height: auto;
  }

  .modal-bonus .modal__select--list li:first-of-type {
    border-top: 1px solid #CCC;
  }

  .modal-bonus .modal__select--list li:not(:first-of-type) {
    margin-left: 0;
    margin-top: -1px;
    border-width: 1px;
  }

  .modal-bonus .modal__select--title {
    margin-top: 0;
    font-size: 15px;
  }

  .modal-bonus .modal__select--button {
    display: none;
  }

  .modal-bonus .radio-plan {
    padding: 20px 0 20px 60px;
  }

  .modal-bonus .radio-plan::after {
    border-width: 6px;
    top: 30%;
    left: 0;
    right: auto;
    width: 22px;
    height: 10px;
  }

  .modal__cap {
    font-size: 12px;
    text-indent: -1em;
    padding-left: 1em;
  }

  .modal-option {
    width: 100%;
    top: 0;
  }

  .modal-option .modal__scroll {
    height: 100%;
    padding-bottom: 220px;
  }

  .modal-option .modal__select--item {
    border-top: 1px solid #CCC;
    border-bottom: 1px solid #CCC;
    padding: 16px 0;
  }

  .modal-option {
    font-size: 16px;
  }

  .modal-option .modal__coupon--inner {
    flex-direction: column;
  }

  .modal-option .modal__coupon--item {
    width: 100%;
    border-top: 1px solid #CCC;
    padding-top: 16px;
  }

  .modal-option .modal__coupon--table .seven {
    font-size: 14px;
  }

  .modal-option .modal__coupon--table .coupon {
    font-size: 14px;
  }

  .modal-option .modal__coupon--table .sheet {
    font-size: 14px;
  }

  .modal-option .modal__select--coupon:not(:first-of-type) {
    margin-top: 16px;
  }

  .modal-option .modal__select--coupon:not(:first-of-type) {
    margin-top: 16px;
  }

  .modal-option .modal__service--inner {
    flex-direction: column;
  }

  .modal-option .modal__service--item {
    width: 100%;
    margin: 0 0 8px;
    border: 1px solid #CCC;
  }

  .modal-option .checkbox__label,
  .modal-option .radiobox__label {
    padding: 8px 16px;
    width: 10em;
  }

  .madal-plan {
    width: 100%;
    height: 100%;
    top: 0;
    padding: 0;
  }

  .madal-plan .modal__title {
    font-size: 18px;
    margin: 0 0 16px;
    padding: 0 0 8px;
  }

  .madal-plan .modal__heading {
    font-size: 16px;
  }

  .madal-plan .table__name {
    width: auto;
  }

  .madal-plan .table__image {
    width: auto;
  }

  .radio-plan {
    min-height: 30px;
    display: block;
    padding: 12px 12px 12px 44px;
  }

  .radio-plan::before {
    top: 12px;
    left: 12px;
  }

  .radio-plan::after {
    top: 20px;
    left: 17px;
  }

  .check-plan {
    min-height: 30px;
    display: block;
    padding: 12px 12px 12px 44px;
    margin: 0;
  }

  .check-plan::before {
    position: absolute;
    top: 12px;
    left: 12px;
  }

  .check-plan::after {
    top: 19px;
    left: 17px;
  }

  .fixed-block {
    padding: 16px 0 24px;
  }

  .fixed-block .plans__price {
    padding-top: 0;
  }

  .fixed-block__price {
    font-size: 12px;
    margin-bottom: 8px;
  }

  .fixed-block__price--value {
    font-size: 22px;
  }

  .fixed-block__flex .fixed-block__price--bonus,
  .fixed-block__flex .fixed-block__price--year {
    font-size: 11px;
  }

  .modal__button {
    font-size: 18px;
    padding: 12px;
    margin: 0;
  }

  .modal__button__campaign dt {
    font-size: 14px;
  }

  .modal__button--center {
    padding: 0 12px;
  }

  .modal__button--close {
    width: 28%;
  }

  .modal__button--prev {
    width: 28%;
  }

  .modal__button--next {
    width: 78%;
    background-color: #C00;
    box-shadow: 0 3px 0 0 #CCC;
    color: #FFF;
  }

  .modal__button--condition {
    width: 68%;
    margin-left: 4%;
    background-color: #ff5e00;
    box-shadow: 0 3px 0 0 #c94e06;
    color: #FFF;
  }

  .modal__button--return {
    width: 20%;
    margin-right: 8px;
    font-size: 18px;
  }

  .accordion {
    margin: 16px 0 0;
  }

  .modal-accessories {
    width: 100%;
    top: 0;
  }

  .modal-accessories .modal__title {
    font-size: 20px;
    margin: 0 0 16px;
  }

  .modal-accessories .modal__scroll {
    height: 100vh;
    padding-bottom: 130px;
  }

  .modal-accessories .modal__select--list li {
    border: 4px solid #CCC;
  }

  .modal-accessories .modal__select--list li:not(:first-of-type) {
    margin: 8px 0 0;
  }

  .modal-accessories .modal__select--title {
    margin: 0 0 8px;
    padding: 6px 0 0;
    font-size: 15px;
    font-weight: 700;
  }

  .modal-accessories .modal__select--price {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
    margin: 8px 0;
  }

  .modal-accessories .modal__select--cap {
    font-size: 13px;
    line-height: 1.3;
    margin: 8px 0 0;
  }

  .modal-accessories .modal__select--image {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .modal-accessories .modal__select--image img {
    width: 49%;
  }

  .modal-warranty {
    width: 100%;
    height: 100%;
    top: 0;
  }

  .modal-warranty .modal__title {
    font-size: 20px;
    margin: 0 0 16px;
  }

  .modal-warranty .modal__scroll {
    height: 100%;
    padding-bottom: 130px;
  }

  .modal-warranty .modal__select--list li {
    border: 4px solid #CCC;
  }

  .modal-warranty .modal__select--list li:not(:first-of-type) {
    margin: 8px 0 0;
  }

  .modal-warranty .modal__select--title {
    margin: 0 0 8px;
    padding: 6px 0 0;
    font-size: 15px;
    font-weight: 700;
  }

  .modal-warranty .modal__select--price {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
    margin: 8px 0;
  }

  .modal-warranty .modal__select--cap {
    font-size: 13px;
    line-height: 1.3;
    margin: 8px 0 0;
  }

  .tooltip {
    width: 340px;
  }

  .table .tooltip {
    left: 0;
    top: 130px;
  }

  .lease-info .tooltip {
    top: 110px;
  }

  .tooltip__inner {
    padding: 10px;
  }

  .is-pc {
    display: none !important;
  }

  .header {
    margin: 0;
  }

  .header__inner {
    width: 100%;
    box-sizing: border-box;
    text-align: center;
  }

  .header__title {
    font-size: 18px;
    padding: 10px 10px;
  }

  .header__logo img {
    height: 20px;
  }

  .header__text {
    margin-left: 16px;
    line-height: 1.3;
  }

  .wrapper__inner {
    width: 100%;
    padding: 10px;
    border: none;
    flex-direction: column;
  }

  .select-model {
    margin-bottom: 32px;
  }

  .select-model__inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }

  .select-model__image {
    width: 35%;
    height: auto;
    margin-right: 4px;
  }

  .select-model__deta {
    width: 65%;
  }

  .select-model__name {
    font-size: 15px;
    padding-bottom: 6px;
    padding-right: 30px;
    margin-bottom: 6px;
  }

  .select-model__basic {
    font-size: 12px;
  }

  .select-model__basic dd {
    font-size: 12px;
  }

  .select-model__basic + .bonus {
    font-size: 10px;
  }

  .select-model__option {
    font-size: 12px;
    margin-top: 6px;
    margin-bottom: 6px;
    padding-top: 6px;
    padding-bottom: 6px;
  }

  .select-model__option img {
    width: 14px;
  }

  .select-model__value {
    font-size: 16px;
  }

  .select-model__unit {
    font-size: 10px;
  }

  .select-model__tax {
    font-size: 10px;
  }

  .page-title {
    font-size: 25px;
    margin: 0 0 8px;
  }

  .entry-form {
    width: 100%;
  }

  .entry-form__heading {
    font-size: 20px;
    line-height: 1.3;
  }

  .entry-form__title--sub {
    font-size: 10px;
  }

  br + .entry-form__title--sub {
    margin-left: 0;
  }

  .entry-form__attention {
    font-size: 14px;
    line-height: 1.3;
    text-align: left;
  }

  .zip-button {
    width: 59%;
    font-size: 15px;
    padding: 16px 0;
  }

  .zip-button span {
    transform: scale(0.8);
    display: block;
  }

  .zip-modal__contents {
    width: 100%;
    padding: 10px;
  }

  .zip-modal__button {
    width: 100%;
  }

  .zip-modal__message {
    font-size: 15px;
    text-align: left;
  }

  .item dt {
    font-size: 12px;
  }

  .item dt br {
    display: block;
  }

  .item dd {
    font-size: 12px;
  }

  .lease-car dd .__price span {
    font-size: 20px;
  }

  .info-block {
    width: auto;
    margin: 0 16px 16px;
  }

  .info-block.info-block__footer {
    margin: 16px 0 0;
  }

  .info-block__title {
    font-size: 13px;
  }

  .info-block p {
    font-size: 12px;
  }

  section .consent-text {
    font-size: 12px;
  }

  .popup {
    width: 320px;
    height: auto;
  }

  .popup__close {
    top: -17px;
    right: -6px;
  }

  .ui-menu .ui-menu-item-wrapper {
    padding: 10px 1em 10px 0.4em;
  }

  .entry-form__campaign {
    padding: 8px;
  }

  .entry-form__campaign--order {
    text-align: left;
    font-size: 13px;
  }

  .birthdate-modal__contents {
    width: 100%;
    padding: 10px;
  }

  .birthdate-month__btn {
    width: 45%;
    height: 40px;
    margin: 8px 2%;
    font-size: 20px;
  }

  .birthdate-month__btn:nth-child(2n) {
    margin-right: 0;
  }

  .birthdate-day__btn {
    margin: 8px 2%;
    height: 40px;
    font-size: 20px;
  }

  .entry-form__price li {
    width: 49%;
  }

  .entry-form__price li:not(:nth-child(-n+2)) {
    margin-top: 8px;
  }

  .flow {
    padding: 10px;
    margin-top: 10px;
  }

  .flow .step {
    font-size: 11px;
  }

  .flow .text {
    font-size: 12px;
  }

  .progressbar {
    padding: 10px;
    margin-top: 10px;
  }

  .progressbar li {
    font-size: 13px;
  }

  .progressbar li:before {
    font-size: 14px;
  }

  .license-area {
    padding: 0 16px;
  }

  .license-area .license-area__image {
    width: 50%;
  }

  .holiday__comment {
    margin: 20px auto 20px;
  }

  .holiday__comment .holiday__comment-title {
    font-size: 16px;
  }
}