/* -------------------------------------------------- */
/* headimage */

.buylist-headimage {
  background-image: url(../images/buylist/buylist-headimage.webp);
}

/* -------------------------------------------------- */
/* breadcrumb */

.breadcrumb .wrapper {
  left: 0;
  position: static;
  padding-bottom: 30px;
  padding-top: 30px;
  top: 0;
  transform: none;
  z-index: 1;
}

/* -------------------------------------------------- */
/* category */

.buylist-category h2.global,
.buylist-category h3.global {
  margin-bottom: 30px;
}
.buylist-category p {
  line-height: 1.8;
  margin-bottom: 60px;
  text-align: center;
}
.buylist-category .category-model {
  margin-bottom: 80px;
}
.buylist-category .category-maker {
  left: -16px;
  position: relative;
  top: -20px;
  width: calc(100% + 32px);
}
.buylist-category .category-maker ul.grid {
  justify-content: center;
}
.buylist-category .category-maker ul li {
  margin: 20px 15px;
  width: 263px;
}
.buylist-category .category-button {
  margin-bottom: 20px;
}

/* -------------------------------------------------- */
/* intro */

.intro {
  background: linear-gradient(180deg, var(--gradient1), var(--gradient2));
}
.intro h2.global {
  color: #fff;
}
.intro p {
  color: #fff;
}
.intro-name {
  color: #fff;
}
.intro-button a {
  background-image: url(../images/arrow-right-white.webp);
  border-color: #fff;
  color: #fff;
}
.intro-button a:hover {
  background-color: var(--text-color1);
  border-color: var(--text-color1);
}

/* -------------------------------------------------- */
/* model */

.breadcrumb-model .wrapper {
  left: 50%;
  position: absolute;
  padding-bottom: 30px;
  padding-top: 30px;
  top: 0;
  transform: translateX(-50%);
  z-index: 1;
}
.model {
  padding-bottom: 0;
  padding-top: 0;
}
.model-content {
  position: relative;
}
.model-image {
  height: 700px;
  padding: 0 30px;
}
.model-image img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}
.model-text {
  background: rgba(255,255,255,.71);
  border-radius: 10px;
  box-shadow: 8px 8px 16px rgba(0,0,0,.16);
  padding: 30px 30px 20px;
  position: absolute;
  right: 0;
  top: -60px;
  width: 570px;
}
.model-title,
.maker-title {
  font-size: 3.6rem;
  font-weight: 700;
  margin-bottom: 20px;
}
.model-title strong,
.maker-title strong {
  color: var(--main-color2);
}
.model-text p,
.maker-text p {
  line-height: 1.8;
}

/* -------------------------------------------------- */
/* maker */

.maker {
  padding-top: 20px;
}
.maker-image img {
  border: 1px solid #ccc;
}

/* -------------------------------------------------- */
/* list */

.list h2.global {
  margin-bottom: 30px;
}
.list-content ul {
  margin-bottom: 30px;
}

/* -------------------------------------------------- */
/* voice */

.voice {
  background-image: none;
}

/* -------------------------------------------------- */
/* check */

.check {
  background: #fff url(../images/buylist/check-bg01.webp) no-repeat top right -80px / 960px 600px;
  min-height: 638px;
  padding: 60px 0;
}
.check::before,
.check::after {
  background: linear-gradient(180deg, var(--gradient1), var(--gradient2));
  content: '';
  height: 100%;
  position: absolute;
  z-index: 1;
}
.check::before {
  left: 0;
  top: 0;
  width: 50%;
}
.check::after {
  left: 50%;
  top: 0;
  transform: skewX(-20deg) translateX(-50%);
  width: 33%;
}
.check .wrapper {
  position: relative;
  z-index: 2;
}
.check .title {
  color: #fff700;
  left: -150px;
  position: absolute;
  top: 0;
  writing-mode: vertical-rl;
}
.check-content {
  min-height: 546.28px;
}
.check h2.global {
  color: #fff;
  line-height: 1.25;
  margin-bottom: 30px;
  text-align: left;
}
.check-text p {
  color: #fff;
  font-size: 1.8rem;
  line-height: 1.8;
}
.check-image-outer {
  background: linear-gradient(0deg, var(--gradient1), var(--gradient2));
  border-radius: 12px;
  height: 313px;
  padding: 12px;
  width: 409px;
}
.check-image-inner {
  align-items: center;
  background: #fff;
  border-radius: 12px;
  display: flex;
  height: 100%;
  justify-content: center;
  padding: 15px;
  width: 100%;
}
.check-bg {
  background: url(../images/buylist/check-bg02.webp) no-repeat 0 0 / 429px 534px;
  bottom: -60px;
  height: 534px;
  position: absolute;
  right: 0;
  width: 429px;
}
.check-bg p {
  bottom: 10px;
  font-size: 1.2rem;
  margin: 0;
  padding: 0;
  position: absolute;
  right: 30px;
}
