@charset "UTF-8";
/* *** variables model *** */
/* color */
/* *** common variables *** */
/* break point */
/* hover style */
/* color */
/* One-Tone */
/* Two-Tone */
/* *** mixins *** */
/* break point */
/* hover */
/* --- 10px = 1rem --- */
/* プレサイト非表示アイテム */
#grade_compare .grade_block li p.price,
#grade_compare .grade_block li .btn_area {
  display: none !important;
}

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

/* Safari/Opera */
.is-fixed {
  display: none;
}

button.enlarge-triggle {
  overflow: hidden;
}

.modal-win.img-modal-win {
  height: auto;
  width: min(100%, 1400px);
}
.modal-win.img-modal-win .modal-win-body {
  width: min(90%, 1400px);
  margin: 0 auto;
  display: block;
}
.modal-win.img-modal-win .modal-win-body img {
  width: 100%;
  aspect-ratio: 16/9;
}
.modal-win.img-modal-win .modal-close-btn {
  top: -20px;
  bottom: auto;
  right: 4px;
}

@media screen and (min-width: 769px) {
  .modal-win.img-modal-win .modal-close-btn {
    right: 3%;
  }
}
#grade_compare {
  width: min(100%, 1400px);
  margin: 6rem auto;
}
#grade_compare a[target=_blank]:not(.icn-none):after, #grade_compare a[href*=".pdf"]:not(.icn-none):after {
  position: absolute;
  right: 1rem;
  top: 33%;
}
#grade_compare .nav_outer {
  padding: 0 0 4rem;
  background: #fff;
}
#grade_compare .nav_outer .grade_nav {
  width: min(100%, 1400px);
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-around;
}
#grade_compare .nav_outer .grade_nav select {
  width: min(48%, 400px);
  padding: 0 1rem;
  font-size: min(7vw, 1.2rem);
  color: #000;
}
#grade_compare .nav_outer.navfixed {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1001;
  padding: 0.5rem 0;
  box-sizing: border-box;
}
#grade_compare .nav_outer.navfixed .grade_nav {
  margin: 0 auto;
}
#grade_compare .grade_block {
  display: flex;
  flex-wrap: wrap;
  gap: 0 1.2rem;
  margin: 0 0 8rem;
  justify-content: space-around;
}
#grade_compare .grade_block li {
  width: 48%;
}
#grade_compare .grade_block li figure {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
#grade_compare .grade_block li div {
  width: min(100%, 500px);
  margin: 0 auto;
}
#grade_compare .grade_block li div.mlt_price {
  font-size: min(4.6vw, 2.4rem);
}
#grade_compare .grade_block li p {
  text-align: center;
  padding: 1rem 3rem 1rem 1rem;
}
#grade_compare .grade_block li .btn_area {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 0;
  margin: 2rem 0 0;
}
#grade_compare .grade_block li .btn_area li {
  width: 100% !important;
}
#grade_compare .grade_block li .btn_area li a {
  display: block;
  font-size: min(3vw, 1.6rem);
  box-sizing: border-box;
  padding: 0.5rem;
  width: min(94%, 400px);
  margin: 0 auto;
  position: relative;
}
#grade_compare .grade_block li .btn_area li a.btn-testdrive {
  background: #db5f00;
  border: 1px solid #db5f00;
  border: none;
  color: #fff;
}
#grade_compare .grade_block li .btn_area li a.btn-testdrive:after {
  background: url(/assets/images/icn_blank_white.svg) no-repeat center center/contain;
}
#grade_compare .grade_block li .btn_area li a.btn-testdrive:hover {
  border: 1px solid #db5f00;
  background: var(--white);
  color: #db5f00;
}
#grade_compare .grade_block li .btn_area li a.btn-testdrive:hover::after {
  filter: invert(42%) sepia(79%) saturate(3273%) hue-rotate(11deg) brightness(95%) contrast(101%);
}
#grade_compare .grade_block li .btn_area li a p {
  text-align: start;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
#grade_compare .compare_area #item_equipment .equip_area .note {
  margin: 0 0 0 2rem;
}
#grade_compare .compare_area .eqh_box {
  margin: 4rem 0 2rem;
}
#grade_compare .compare_area .eqh_box h4 {
  margin: 0 auto;
  text-align: start;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 1rem;
  font-size: min(7vw, 1.6rem);
}
#grade_compare .compare_area .equip_block {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  gap: 0 1rem;
  width: min(96%, 1400px);
  margin: 0 auto;
}
#grade_compare .compare_area .equip_block li {
  width: 48%;
  margin: 2rem 0;
}
#grade_compare .compare_area .equip_block li figure {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
#grade_compare .compare_area .equip_block li figure a {
  display: block;
}
#grade_compare .compare_area .equip_block li figure img {
  aspect-ratio: 16/9;
}
#grade_compare .compare_area .equip_block li div {
  width: min(100%, 500px);
  margin: 1rem auto;
  text-align: start;
  padding: 0 1rem;
  box-sizing: border-box;
  word-break: break-all;
}
#grade_compare .compare_area .equip_block li div p.txt1, #grade_compare .compare_area .equip_block li div p.txt2 {
  color: var(--greyK60);
  font-size: min(7vw, 1.5rem);
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
#grade_compare .compare_area .equip_block li div .circle {
  font-size: min(16vw, 3rem);
}
#grade_compare .compare_area .equip_block li figcaption div {
  text-align: start;
}
#grade_compare .compare_area .equip_block li figcaption div p.txt1, #grade_compare .compare_area .equip_block li figcaption div p.txt2 {
  color: var(--greyK60);
  font-size: min(6vw, 1.4rem);
}
#grade_compare .compare_area .equip_block li .option {
  padding: 0.5rem;
  background: #000;
  color: #fff;
  box-sizing: border-box;
  font-size: min(5.5vw, 1.2rem);
  width: min(100%, 500px);
  margin: 1rem auto;
}
#grade_compare .compare_area .equip_block li.empty {
  position: relative;
}
#grade_compare .compare_area .equip_block li.empty p.txt1 {
  font-size: 4rem;
  margin: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#grade_compare.double .nav_outer .grade_nav div, #grade_compare.single .nav_outer .grade_nav div {
  padding: 1rem;
  font-size: min(7vw, 1.2rem);
  color: #000;
}
#grade_compare.double .nav_outer.navfixed, #grade_compare.single .nav_outer.navfixed {
  border: 1px solid #ccc;
}

@media screen and (min-width: 769px) {
  #grade_compare .nav_outer .grade_nav select {
    font-size: 1.8rem;
  }
}
@media screen and (min-width: 769px) {
  #grade_compare .compare_area .eqh_box h4 {
    font-size: 2rem;
  }
}
@media screen and (min-width: 769px) {
  #grade_compare .compare_area .equip_block {
    width: min(100%, 1400px);
  }
}
@media screen and (min-width: 769px) {
  #grade_compare .compare_area .equip_block li div p.txt1, #grade_compare .compare_area .equip_block li div p.txt2 {
    font-size: 1.8rem;
  }
}
@media screen and (min-width: 769px) {
  #grade_compare.double .nav_outer .grade_nav div, #grade_compare.single .nav_outer .grade_nav div {
    font-size: 1.8rem;
  }
}/*# sourceMappingURL=grade-comparison.css.map */


