@charset "utf-8";
.punctuation {
  letter-spacing: -0.1em;
}

.p-subscription-content {
  line-height: 1;
}

.p-page-subscription .bold {
  font-weight: bold;
}

.p-page-subscription .under-line {
  position: relative;
  color: #00ae00;

  text-decoration: underline;
  text-decoration-thickness: 5px;
  text-decoration-color: #ffd900;
  text-underline-offset: 5px;
}
@media screen and (max-width: 767px) {
  .p-page-subscription .under-line {
    text-underline-offset: 3px;
  }
}

.page-head-title {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 30px 0;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.15em;
}
@media screen and (max-width: 767px) {
  .page-head-title {
    margin: calc(16 / 425 * 100vw) 0;
    font-size: calc(24 / 425 * 100vw);
    letter-spacing: 0.085em;
  }
}

.page-head-title.long-car {
  position: relative;
  margin: 30px auto 48px;
  width: 860px;
}
@media screen and (max-width: 767px) {
  .page-head-title.long-car {
    width: 100%;
    margin: calc(24 / 425 * 100vw) auto calc(40 / 425 * 100vw);
    font-size: calc(24 / 425 * 100vw);
  }
}

.page-head-title.long-car::after {
  position: absolute;
  content: '';
  left: 0;
  bottom: 0;
  display: inline-block;
  width: 100%;
  height: 5px;
  background: #00ae00;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .page-head-title.long-car::after {
    font-size: calc(24 / 425 * 100vw);
    height: 3px;
  }
}

.page-head-title.long-car img {
  display: block;
  margin-right: 20px;
  width: 200px;
}
@media screen and (max-width: 767px) {
  .page-head-title.long-car img {
    margin-right: calc(10 / 425 * 100vw);
    width: calc(100 / 425 * 100vw);
  }
}

.kizon .page-head-title {
  position: relative;
  width: 860px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 30px auto 40px;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.15em;
}
@media screen and (max-width: 767px) {
  .kizon .page-head-title {
    margin: calc(16 / 425 * 100vw) 0 calc(24 / 425 * 100vw);
    width: 100%;
    font-size: calc(24 / 425 * 100vw);
    letter-spacing: 0.085em;
  }
}

.p-subscription-content .sub-head {
  margin: 0 auto 96px;
  width: 860px;
}
@media screen and (max-width: 767px) {
  .p-subscription-content .sub-head {
    margin: calc(0 / 425 * 100vw) 0 calc(60 / 425 * 100vw);
    width: 100%;
  }
}

.p-subscription-content .sub-head .mini {
  font-size: 16px;
}
@media screen and (max-width: 767px) {
  .p-subscription-content .sub-head .mini {
    font-size: calc(14 / 425 * 100vw);
  }
}

.p-subscription-content .sub-head p {
  font-size: 21px;
  line-height: 1.5;
  font-weight: bold;
  letter-spacing: 0.15em;
}
@media screen and (max-width: 767px) {
  .p-subscription-content .sub-head p {
    font-size: calc(18 / 425 * 100vw);
  }
}

.kizon .page-head-title::after {
  position: absolute;
  content: '';
  display: inline-block;
  bottom: -5px;
  left: 0;
  width: 100%;
  height: 5px;
  background: #00ae00;
}
@media screen and (max-width: 767px) {
  .kizon .page-head-title::after {
    bottom: 0;
    height: 3px;
  }
}

.page-head-title .f-green {
  font-weight: bold;
  color: #00ae00;
}
@media screen and (max-width: 767px) {
  .page-head-title .f-green {
  }
}

.page-head-title img {
  display: block;
  margin-right: 20px;
  width: 92px;
}
@media screen and (max-width: 767px) {
  .page-head-title img {
    margin-right: calc(10 / 425 * 100vw);
    width: calc(42 / 425 * 100vw);
  }
}

.p-subscription-content .text-list-head,
.p-subscription-content .bottom-link-text {
  width: 860px;
  margin: 0 auto 40px;
  font-size: 36px;
  color: #ffffff;
  background: #00ae00;
  text-align: center;
  letter-spacing: 0.2em;
  border-radius: 8px;
  line-height: 46px;
  padding-top: 6px;
}
@media screen and (max-width: 767px) {
  .p-subscription-content .text-list-head,
  .p-subscription-content .bottom-link-text {
    width: 100%;
    margin: 0 auto calc(22 / 425 * 100vw);
    padding-top: calc(6 / 425 * 100vw);
    font-size: calc(24 / 425 * 100vw);
    line-height: calc(36 / 425 * 100vw);
  }
}

.bottom-link-text {
  display: block;
  margin: 54px auto 40px;
  letter-spacing: 0.3em;
}
@media screen and (max-width: 767px) {
  .p-subscription-content .bottom-link-text {
    margin: 0 auto calc(32 / 425 * 100vw);
  }
}

.bottom-link-text.type-2 {
  width: 720px;
  letter-spacing: 0.03em;
  font-size: 24px;
}
@media screen and (max-width: 767px) {
  .bottom-link-text.type-2 {
    width: 100%;
    margin: 0 auto calc(80 / 425 * 100vw);
    font-size: calc(18 / 425 * 100vw);
  }
}

.kizon .text-list {
  width: 860px;
  margin: 0 auto 136px;
  letter-spacing: 0.15em;
}
@media screen and (max-width: 767px) {
  .kizon .text-list {
    width: 100%;
    margin: 0 auto calc(80 / 425 * 100vw);
  }
}

.kizon .text-list li {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  font-size: 40px;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .kizon .text-list li {
    gap: 8px;
  }
}

.kizon .text-list li + li {
  margin-top: 40px;
}
@media screen and (max-width: 767px) {
  .kizon .text-list li + li {
    margin-top: calc(20 / 425 * 100vw);
  }
}

.kizon .text-list .texts {
  width: calc(100% - 48px - 16px);
}
@media screen and (max-width: 767px) {
  .kizon .text-list .texts {
    width: calc(100% - calc(32 / 425 * 100vw) - 8px);
  }
}

.kizon .text-list .num {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  background: #00ae00;
  color: #ffffff;
  font-size: 30px;
  font-weight: bold;
  border-radius: 50%;
  width: 48px;
  height: 48px;
  padding-top: 4px;
  box-sizing: border-box;
}
@media screen and (max-width: 767px) {
  .kizon .text-list .num {
    width: calc(32 / 425 * 100vw);
    height: calc(32 / 425 * 100vw);
    padding-top: calc(4 / 425 * 100vw);
    box-sizing: border-box;
    font-size: calc(18 / 425 * 100vw);
  }
}

.kizon .text-list .title {
  margin: 10px 0 16px;
  font-size: 32px;
  color: #00ae00;
  line-height: 1.2;
}
@media screen and (max-width: 767px) {
  .kizon .text-list .title {
    margin: calc(8 / 425 * 100vw) 0;
    font-size: calc(18 / 425 * 100vw);
  }
}

.kizon .text-list .title .mini {
  font-size: 20px;
}
@media screen and (max-width: 767px) {
  .kizon .text-list .title .mini {
    font-size: calc(11 / 425 * 100vw);
  }
}

.kizon .text-list .text {
  font-size: 24px;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .kizon .text-list .text {
    font-size: calc(15 / 425 * 100vw);
  }
}

.kizon .text-list .text .mini {
  font-size: 20px;
}
@media screen and (max-width: 767px) {
  .kizon .text-list .text .mini {
    font-size: calc(11 / 425 * 100vw);
  }
}

.merit-list-wrap {
  position: relative;
  width: 860px;
  margin: 0 auto 40px;
  padding: 80px 32px 40px 32px;
  border: #00ae00 solid 5px;
  background: #fafdfa;
}
@media screen and (max-width: 767px) {
  .merit-list-wrap {
    width: 100%;
    margin: 0 auto calc(20 / 425 * 100vw);
    padding: calc(64 / 425 * 100vw) calc(16 / 425 * 100vw) calc(48 / 425 * 100vw) calc(16 / 425 * 100vw);
  }
}

.merit-list li {
  position: relative;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: column;
  width: 100%;
  min-height: 240px;
  padding: 16px;
  border: #00ae00 solid 5px;
  text-align: center;
  border-radius: 4px;
}
@media screen and (max-width: 767px) {
  .merit-list li {
    padding: calc(8 / 425 * 100vw);
    min-height: calc(160 / 425 * 100vw);
  }
}

.merit-title {
  position: absolute;
  content: '';
  display: inline-block;
  padding: 8px;
  top: 0;
  left: 50%;
  width: 730px;
  font-size: 32px;
  font-weight: bold;
  transform: translate(-50%,-60%);
  letter-spacing: 0.1em;

  background: #ffffff;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .merit-title {
    width: max-content;
    padding: calc(8 / 425 * 100vw);
    font-size: calc(24 / 425 * 100vw);
    transform: translate(-50%,-50%);
  }
}

.strong-merit-title {
  position: relative;
  font-size: 50px;
  color: #00ae00;

  background-image: radial-gradient(circle, #ffd900 4px, transparent 0);
  background-position: left bottom;
  background-repeat: repeat-x;
  background-size: 12px 28px;
}
@media screen and (max-width: 767px) {
  .strong-merit-title {
    font-size: calc(24 / 425 * 100vw);
    background-position: left calc(-2 / 425 * 100vw) bottom;
    background-size: calc(16 / 425 * 100vw) calc(8 / 425 * 100vw);
  }
}

.big-text {
  font-size: 60px;
}
@media screen and (max-width: 767px) {
  .big-text {
    font-size: calc(32 / 425 * 100vw);
  }
}

.strong-merit-title::after {
  position: absolute;
  content: '';
  display: inline-block;
  width: 88px;
  height: 40px;
  background: url(../../img/subsc/merit_01.svg) center center no-repeat;
  top: -45%;
  left: 50%;
  transform: translate(-50%, 0);
}
@media screen and (max-width: 767px) {
  .strong-merit-title::after {
    width: calc(70 / 425 * 100vw);
    height: calc(25 / 425 * 100vw);
    top: -75%;
    left: calc(40 / 425 * 100vw);
  }
}

.merit-list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px 16px;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .merit-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}

.merit-list-wrap .merit-list .num {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 2px;
  width: 60px;
  height: 60px;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #00ae00;
  font-size: 36px;
  font-weight: bold;
  color: #fff;
  border-radius: 50%;
}
@media screen and (max-width: 767px) {
  .merit-list-wrap .merit-list .num {
    width: calc(46 / 425 * 100vw);
    height: calc(46 / 425 * 100vw);
    font-size: calc(22 / 425 * 100vw);
  }
}

ul.merit-list .num + p {
  margin-top: 24px;
  margin-bottom: 8px;
  line-height: 1.28;
  font-size: 20px;
}
@media screen and (max-width: 767px) {
  ul.merit-list .num + p {
    margin-top: calc(16 / 425 * 100vw);
    margin-bottom: calc(6 / 425 * 100vw);
    font-size: calc(14 / 425 * 100vw);
  }
}

ul.merit-list .num + p.mb-l {
  margin-bottom: 14px;
}
@media screen and (max-width: 767px) {
  ul.merit-list .num + p.mb-l {
    margin-bottom: calc(10 / 425 * 100vw);
  }
}

ul.merit-list .strong-text {
  font-size: 40px;
  font-weight: bold;
  color: #00ae00;
}
@media screen and (max-width: 767px) {
  ul.merit-list .strong-text {
    font-size: calc(26 / 425 * 100vw);
  }
}

ul.merit-list .percent {
  font-size: 40px;
}
@media screen and (max-width: 767px) {
  ul.merit-list .percent {
    font-size: calc(26 / 425 * 100vw);
  }
}

ul.merit-list .strong-text.type-1 {
  font-size: 72px;
}
@media screen and (max-width: 767px) {
  ul.merit-list .strong-text.type-1 {
    font-size: calc(40 / 425 * 100vw);
  }
}

ul.merit-list .strong-text.type-2 {
  font-size: 64px;
}
@media screen and (max-width: 767px) {
  ul.merit-list .strong-text.type-2 {
    font-size: calc(32 / 425 * 100vw);
  }
}

ul.merit-list .type-1 {
  font-size: 42px;
}
@media screen and (max-width: 767px) {
  ul.merit-list .type-1 {
    font-size: calc(32 / 425 * 100vw);
  }
}

ul.merit-list .type-1 span {
  font-size: 22px;
}
@media screen and (max-width: 767px) {
  ul.merit-list .type-1 span {
    font-size: calc(18 / 425 * 100vw);
  }
}

ul.merit-list .green {
  color: #00ae00;
}

ul.merit-list .type-2 {
  font-size: 30px;
}
@media screen and (max-width: 767px) {
  ul.merit-list .type-2 {
    font-size: calc(20 / 425 * 100vw);
  }
}

ul.merit-list .small {
  font-size: 14px;
}
@media screen and (max-width: 767px) {
  ul.merit-list .small {
    font-size: calc(10 / 425 * 100vw);
  }
}

.merit-detail-list {
  width: 860px;
  margin: 40px auto 80px;
}
@media screen and (max-width: 767px) {
  .merit-detail-list {
    width: 100%;
    margin: 40px auto calc(24 / 425 * 100vw);
  }
}

.merit-detail-list li {
  display: flex;
  gap: 32px;
  padding: 40px 32px;
  background: #f7fdf7;
}
@media screen and (max-width: 767px) {
  .merit-detail-list li {
    padding: calc(24 / 425 * 100vw) calc(16 / 425 * 100vw);
    gap: 16px;
  }
}

.merit-detail-list li + li {
  margin-top: 32px;
}
@media screen and (max-width: 767px) {
  .merit-detail-list li + li {
    margin-top: calc(24 / 425 * 100vw);
  }
}

.merit-detail-list .img-box {
  width: 20%;
}

.merit-detail-list .top-img {
  margin: 0 auto 80px;
}
@media screen and (max-width: 767px) {
  .merit-detail-list .top-img {
  }
}

.merit-detail-list .bottom-img {
}
@media screen and (max-width: 767px) {
  .merit-detail-list .bottom-img {
  }
}

.merit-detail-list .text-box {
  width: calc(100% - 20% - 16px);
}
@media screen and (max-width: 767px) {
  .merit-detail-list .text-box {
    width: calc(100% - 20% - 8px);
  }
}

.merit-detail-list .top-text {
  margin: 54px 0 40px;
  font-size: 32px;
  font-weight: bold;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .merit-detail-list .top-text {
    margin: calc(8 / 425 * 100vw) 0 calc(40 / 425 * 100vw);
    font-size: calc(24 / 425 * 100vw);
  }
}

.merit-detail-list .top-text .db {
  display: block;
}
@media screen and (max-width: 767px) {
  .merit-detail-list .top-text .db {
  }
}

.merit-detail-list .top-text .tax {
  font-size: 20px;
}
@media screen and (max-width: 767px) {
  .merit-detail-list .top-text .tax {
    font-size: calc(16 / 425 * 100vw);
  }
}

.merit-detail-list .top-text .db.negative-margin {
  margin: -35px auto;
}
@media screen and (max-width: 767px) {
  .merit-detail-list .top-text .db.negative-margin {
    margin: 0;
  }
}

.merit-detail-list .bottom-text {
  font-size: 21px;
  font-weight: bold;
  line-height: 1.8;
  letter-spacing: 0.07em;
}
@media screen and (max-width: 767px) {
  .merit-detail-list .bottom-text {
    font-size: calc(18 / 425 * 100vw);
  }
}

.merit-detail-list .dot-under-line {
  margin-left: 8px;
  font-size: 58px;
  color: #00ae00;
  line-height: 1.6;

  background-image: radial-gradient(circle, #ffd900 6px, transparent 0);
  background-position: left -7px bottom;
  background-repeat: repeat-x;
  background-size: 25px 20px;
}
@media screen and (max-width: 767px) {
  .merit-detail-list .dot-under-line {
    margin-left: 0;
    background-image: radial-gradient(circle, #ffd900 calc(4 / 425 * 100vw), transparent 0);
    font-size: calc(32 / 425 * 100vw);
    background-position: left calc(1 / 425 * 100vw) bottom;
    background-size: calc(16 / 425 * 100vw) calc(10 / 425 * 100vw);
  }
}

.p-page-subscription .under-line.strong {
  position: relative;
  color: #00ae00;
  font-size: 40px;
  font-weight: bold;
  text-decoration: underline;
  text-decoration-thickness: 5px;
  text-decoration-color: #ffd900;
  text-underline-offset: 5px;
}
@media screen and (max-width: 767px) {
  .p-page-subscription .under-line.strong {
    font-size: calc(20 / 425 * 100vw);
    text-underline-offset: 3px;
  }
}

.p-page-subscription .under-line.bk {
  color: unset;
}


.class {
}
@media screen and (max-width: 767px) {
  .class {
  }
}