/*=========================================
打ち消し
=========================================*/
.prose :where(:not(meta,span)+*) {
    margin-block-start: 0;
}
.prose :is(p img:not([style*="float"]):only-child, div img:not([style*="float"]):only-child, figure, video, object, blockquote, table) {
  margin-block: 0;
}

@supports (height: 1lh) {
  .prose a:not(.h1, .h2, .h3, .h4, .h5, .h6, .button, .link-faded, .link-faded-reverse, :has(img)) {
    background: none;
  }
}
.prose p {
    line-height: 1;
}
.prose :is(ul, ol) {
  display: block;
  row-gap: normal;
  margin-inline-start: 0;
}
li{
  display: block;
  line-height: 1;
}
:where(ol,ul):not(.unstyled-list) li {
    padding-inline-start: 0;
    margin-block-start: 0 !important;
}
@media screen and (min-width: 1000px) {
    .prose:not(.prose--tight) :where(:not(meta,span)+*) {
        margin-block-start: 0;
    }
}
/*=========================================
共通
=========================================*/
.sp_view{
  display: block;
}
.pc_view{
  display: none;
}
@media screen and (min-width: 1000px) {
  .sp_view{
    display: none;
  }
  .pc_view{
    display: block;
  }
}
/*=========================================
本体
=========================================*/
.container--xs{
  margin: 0;
}
.section-header{
  display:none;
  margin: auto;
}
.lp-netkeiba{
  padding: 0 5.333333333333334vw;
}
.lp-header{
  width: 29.8667vw;
  margin:0 auto 5.3333vw;
}
.lp-kv{
  margin-bottom: 8vw;
}
.lp-point{
  position: relative;
  margin-bottom: 8vw;
}
.lp-point::after {
  content: "";
  display: block;
  height: 1.8667vw;
  background-image: radial-gradient(circle, #ccc 0.5333vw, transparent 0.5333vw);
  background-size: 2.6667vw 2.6667vw; 
  background-repeat: repeat-x;
  margin-top: 6.1333vw;
}
.lp-point-title{
  margin-bottom: 2.6667vw;
  letter-spacing: -0.1vw;
}
.lp-point-title + p{
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1.3;
  gap: 1.3667vw;
  margin-bottom: 5.3333vw;
  letter-spacing: -0.12vw;
}
.lp-point-title + p span{
  font-size: 4.2667vw;
  font-weight: bold;
  color: #444444;
}
.lp-point-title + p + figure{
  width: 68.2667vw;
  margin: 0 auto 2.6667vw;
}
.lp-point-note {
  font-size: 3.7333vw;
  line-height: 1.3;
  font-weight: bold;
  color: #666666;
  text-align: center;
  margin: 0 auto 2.6667vw;
  display: block;
  width: fit-content;
}
.lp-point-note.link-line{
  position: relative;
  padding: 0px 9.9667vw;
}
.lp-point-note.link-line::before,
.lp-point-note.link-line::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 8vw;
  height: 0.8vw;
  background: #ddd;
  border-radius: 0.8vw;
}
.lp-point-note.link-line::before {
  left: 0;
  transform: translateY(-50%) rotate(45deg);
}
.lp-point-note.link-line::after {
  right: 0;
  transform: translateY(-50%) rotate(-45deg);
}
.lp-point-note span{
  position: relative;
  display: inline-block;
  z-index: 1;
}
.lp-point-note span:before{
  position: absolute;
  bottom: 0.5333vw;
  display: block;
  content: '';
  width: 100%;
  height: 1.8667vw;
  background-color: #F7EB6F;
  z-index: -1;
}
.lp-point-note + a{
  position: relative;
  display: block;
  width: 78.6667vw;
  height: 9.6vw;
  line-height: 9.6vw;
  margin: auto;
  border-radius: 9.6vw;
  color: #fff !important;
  font-size: 4vw;
  font-weight: bold;
  text-align: center;
  background-color: #444444 !important;
}
.lp-point-note + a:after{
  content: "";
  position: absolute;
  right: 3.2vw;
  top: 50%;
  transform: translateY(-50%);
  width: 2.1333vw;
  height: 4vw;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8.128' height='15'><path fill='%23fff' d='m5.672 7.501-5.382 5.7a1.091 1.091 0 0 0 0 1.479.99.99 0 0 0 .693.321.944.944 0 0 0 .773-.318l6.084-6.44a1.09 1.09 0 0 0 0-1.481L1.767.331a.988.988 0 0 0-.69-.326h-.049a.984.984 0 0 0-.666.256L.295.327a1.09 1.09 0 0 0 0 1.483Z'/></svg>") no-repeat center;
  background-size: contain;
}
.lp-point-rank{
  margin-bottom: 8.5333vw;
}
.lp-point-rank li{
  position: relative;
  border-radius: 2.6667vw;
  color: #fff;
  margin-bottom: 4.8vw;
  padding: 4.2667vw 2.6667vw 2.6667vw;
}
.lp-point-rank li.rank01{
  color: #FADC01;
  background-color: #1716CC;
}
.lp-point-rank li.rank02{
  background-color: #651B02;
}
.lp-point-rank li.rank03{
  background-color: #277227;
}
.rank-label {
  position: absolute;
  height: 4.8vw;
  line-height: 4.8vw;
  border-radius: 4.8vw;
  left: 50%;
  top: -2.4vw;
  font-size: 3.2vw;
  font-weight: bold;
  padding: 0 3.4667vw;
  transform: translateX(-50%);
}
.lp-point-rank li.rank01 .rank-label{
  color: #1716CC;
  background-color: #FED900;
}
.lp-point-rank li.rank02 .rank-label{
  color: #651B02;
  background-color: #F3F3F3;
}
.lp-point-rank li.rank03 .rank-label{
  color: #277227;
  background-color: #F3F3F3;
}
.rank-condition{
  display: block;
  font-size: 3.4667vw;
  text-align: center;
  margin-bottom: 1.8667vw;
}
.rank-benefit-label{
  display: block;
  width: 100%;
  height: 5.3333vw;
  border-radius: 5.3333vw;
  color:#fff;
  font-weight: bold;
  text-align: center;
  font-size: 4.2667vw;
  margin-bottom: 2.1333vw;
  background-color: rgba(255,255,255,0.3);
}
.rank-benefit-desc{
  display: block;
  text-align: center;
  font-size: 4.0667vw;
  font-weight: bold;
}
.lp-icon01 {
  width: 6vw;
  height: auto;
  display: inline-block;
}
.lp-icon02 {
  width: 6vw;
  height: auto;
  display: inline-block;
}
.lp-icon03 {
  width: 6vw;
  height: auto;
  display: inline-block;
}
@media screen and (min-width: 1000px) {
  .container--xs{
    max-width: 620px;
    margin: auto;
  }
  .lp-netkeiba{
    padding: 0;
  }
  .lp-header{
    width: 120px;
        margin: 0 auto 20px;
  }
  .lp-kv{
    margin-bottom: 30px;
  }
  .lp-point{
    margin-bottom: 30px;
  }
  .lp-point::after {
    height: 10px;
    background-image: radial-gradient(circle, #ccc 2px, transparent 2px);
    background-size: 10px 10px;
    background-repeat: repeat-x;
    margin-top: 30px;
  }
  .lp-point-title{
    width: 382px;
    margin:0 auto 10px;
  }
  .lp-point-title + p{
    margin-bottom: 20px;
    letter-spacing: normal;
  }
  .lp-point-title + p span{
    font-size: 16px;
  }
  .lp-point-title + p + figure{
    width: 100%;
    margin-bottom: 20px !important;
  }
  .lp-point-note{
    font-size: 15px;
  }
  .lp-point-note span:before{
    height: 9px;
    bottom: 3px;
  }
  .lp-point-note.link-line::before,
  .lp-point-note.link-line::after {
    width: 32px;
    height: 3px;
    border-radius: 3px;
  }
  .lp-point-note + a{
    width: 382px;
    height: 50px;
    line-height: 50px;
    font-size: 18px;
  }
  .lp-point-note + a:after {
    right: 20px;
    width: 8px;
    height: 15px;
  }
  .lp-point-rank{
    margin-bottom: 30px;
  }
  .lp-point-note.link-line{
    padding: 0 39px;
    margin-bottom: 10px;
  }

  .lp-point-rank li{
    width: 382px;
    padding: 13px 10px 10px;
    margin:0 auto 18px;
    border-radius: 10px;

  }
  .rank-label{
    font-size: 12px;
    height: 19px;
    line-height: 19px;
    top: -9px;
    padding: 0 5px;
  }
  .rank-condition{
    font-size: 13px;
    margin-bottom: 3px;
  }
  .rank-benefit-label{
    font-size: 13px;
    height: 20px;
    line-height: 20px;
    margin-bottom: 5px;
  }
  .rank-benefit-desc{
    font-size: 16px;
  }
  .lp-icon01 {
    width: 32px;
    height: auto;
    display: inline-block;
  }
  .lp-icon02 {
    width: 32px;
    height: auto;
    display: inline-block;
  }
  .lp-icon03 {
    width: 32px;
    height: auto;
    display: inline-block;
  }
}