@charset "UTF-8";
.p-safetyservice-upgrade {
  overflow: hidden;
  font-size: clamp(14px, 3.4vw, 17px);
  font-family: "Noto Sans JP", roboto, sans-serif;
  line-height: 1.66;
  letter-spacing: 0.05em; }
  .p-safetyservice-upgrade img {
    max-width: 100%;
    height: auto; }
  .p-safetyservice-upgrade .btn {
    display: block;
    margin-top: 2em; }
    .p-safetyservice-upgrade .btn a {
      margin: 0 auto; }
    .p-safetyservice-upgrade .btn .comment {
      margin-top: .5em; }
  .p-safetyservice-upgrade--kv {
    overflow: hidden;
    background: #e5f6fc;
    padding-top: 2.5em; }
    .p-safetyservice-upgrade--kv--inner .visual {
      width: 100%; }
    .p-safetyservice-upgrade--kv--inner--text {
      text-align: center; }
      .p-safetyservice-upgrade--kv--inner--text h1 {
        font-size: clamp(26px, 7.2vw, 40px);
        font-weight: bold;
        line-height: 1.4;
        margin-top: 1em; }
      .p-safetyservice-upgrade--kv--inner--text p {
        font-size: clamp(14px, 3.9vw, 20px);
        font-weight: bold;
        margin-top: 2em; }
        .p-safetyservice-upgrade--kv--inner--text p.comment {
          font-size: clamp(12px, 3vw, 12px);
          font-weight: 400; }
          .p-safetyservice-upgrade--kv--inner--text p.comment:nth-of-type(2) {
            margin-top: 3em; }
  .p-safetyservice-upgrade--section {
    margin: 0 calc(50% - 50vw);
    padding: 5em calc(50vw - 50%); }
    .p-safetyservice-upgrade--section h2 {
      font-size: clamp(20px, 4.8vw, 26px); }
    .p-safetyservice-upgrade--section .more-btn {
      width: 80%;
      margin: 2em auto 0; }
      .p-safetyservice-upgrade--section .more-btn a,
      .p-safetyservice-upgrade--section .more-btn label {
        width: 100%; }
    .p-safetyservice-upgrade--section.no-pad-btm {
      padding-bottom: 0; }
    .p-safetyservice-upgrade--section--box {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      background: #f7f7f7;
      box-shadow: 4px 4px 0 0 rgba(72, 72, 72, 0.1);
      padding: 2.5em; }
      .p-safetyservice-upgrade--section--box:nth-of-type(n+2) {
        margin-top: 2.5em; }
      .p-safetyservice-upgrade--section--box--category {
        width: 42.5%; }
        .p-safetyservice-upgrade--section--box--category.full {
          width: 100% !important; }
          .p-safetyservice-upgrade--section--box--category.full p,
          .p-safetyservice-upgrade--section--box--category.full .comment {
            width: fit-content;
            margin: 1em auto 0; }
        .p-safetyservice-upgrade--section--box--category--heading {
          display: flex;
          justify-content: space-between;
          align-items: center;
          font-weight: bold;
          line-height: 1.4;
          letter-spacing: .05em;
          color: #000; }
          .p-safetyservice-upgrade--section--box--category--heading .icon {
            width: 15%; }
          .p-safetyservice-upgrade--section--box--category--heading span {
            width: 80%;
            text-align: justify; }
        .p-safetyservice-upgrade--section--box--category--point {
          background: repeat url(../../img/safetyservice-upgrade/bg-pattern1.png) left top/auto #fff;
          border: 2px solid #f1f1f1;
          padding: 1.5em 1.1em 2em;
          margin-top: 1em; }
          .p-safetyservice-upgrade--section--box--category--point--point-list {
            text-align: center;
            position: relative; }
            .p-safetyservice-upgrade--section--box--category--point--point-list--prev, .p-safetyservice-upgrade--section--box--category--point--point-list--next {
              width: 14px;
              height: 21px;
              background: no-repeat url(../../img/safetyservice-upgrade/arrow-right.webp) center/contain;
              position: absolute;
              top: 50%;
              transform: translateY(-50%);
              z-index: 9;
              cursor: pointer; }
              .p-safetyservice-upgrade--section--box--category--point--point-list--prev.swiper-button-disabled, .p-safetyservice-upgrade--section--box--category--point--point-list--next.swiper-button-disabled {
                opacity: 0.3;
                cursor: none;
                pointer-events: none; }
            .p-safetyservice-upgrade--section--box--category--point--point-list--prev {
              left: 1em;
              transform: rotateY(180deg); }
            .p-safetyservice-upgrade--section--box--category--point--point-list--next {
              right: 1em; }
            .p-safetyservice-upgrade--section--box--category--point--point-list--balloon {
              position: relative;
              background: #004da1;
              color: #fff;
              font-weight: bold;
              padding: .5em 1em;
              text-align: center;
              width: 100%;
              max-width: 300px;
              border-radius: 20px / 50%;
              margin: 0 auto 2em; }
              .p-safetyservice-upgrade--section--box--category--point--point-list--balloon::after {
                content: "";
                position: absolute;
                bottom: -.7em;
                left: 50%;
                transform: translateX(-50%);
                width: 1em;
                height: .8em;
                clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
                background: #004da1; }
        .p-safetyservice-upgrade--section--box--category .ttl h3 {
          font-weight: bold; }
        .p-safetyservice-upgrade--section--box--category .bnr {
          font-size: clamp(12px, 3.2vw, 14px);
          font-weight: 400;
          background-color: #fff;
          padding: .8em 1.3em;
          margin-top: 1em; }
          .p-safetyservice-upgrade--section--box--category .bnr em {
            display: inline-block;
            font-style: normal;
            font-weight: bold;
            line-height: 1;
            background: linear-gradient(to top, rgba(250, 208, 98, 0.5) 0%, rgba(250, 208, 98, 0.5) 30%, transparent 30%);
            margin-bottom: .5em; }
          .p-safetyservice-upgrade--section--box--category .bnr span {
            display: block;
            text-indent: -1em;
            padding-left: 1em;
            text-align: justify; }
        .p-safetyservice-upgrade--section--box--category .comment {
          margin-top: 1em; }
          .p-safetyservice-upgrade--section--box--category .comment li {
            font-size: clamp(12px, 3vw, 12px);
            display: block;
            text-indent: -1em;
            padding-left: 1em; }
            .p-safetyservice-upgrade--section--box--category .comment li span {
              background: -webkit-linear-gradient(bottom, rgba(250, 208, 98, 0.5) 0%, rgba(250, 208, 98, 0.5) 30%, transparent 30%); }
        .p-safetyservice-upgrade--section--box--category.img-cnt {
          width: 52.5%;
          padding-right: 2.5em;
          border-right: 1px dashed #b3b3b3; }
        .p-safetyservice-upgrade--section--box--category.voice {
          overflow: hidden;
          width: 100%;
          border: 2px solid #004da1;
          border-radius: 1.5rem;
          padding: 1.5em 2em;
          margin-top: 3em;
          background-color: #fff;
          position: relative;
          z-index: 1; }
          .p-safetyservice-upgrade--section--box--category.voice .image {
            width: 100%;
            position: absolute;
            bottom: 0;
            left: 0;
            opacity: .85;
            z-index: -1; }
            .p-safetyservice-upgrade--section--box--category.voice .image img {
              width: 55%;
              max-width: inherit;
              margin: 0 0 0 24em; }
          .p-safetyservice-upgrade--section--box--category.voice h3 {
            display: inline-block;
            width: 70%;
            font-size: clamp(16px, 4.2vw, 21px);
            font-weight: bold;
            letter-spacing: .1em;
            color: #00a2e6;
            background-color: #FFD75A;
            padding: .2em 2em;
            /*background: -webkit-linear-gradient(bottom, rgba(250, 208, 98, 0.5) 0%, rgba(250, 208, 98, 0.5) 30%, transparent 30%);
            padding: 1em .5em 0;*/
            clip-path: polygon(0 0, 95% 0, 100% 100%, 0% 100%);
            margin: 0 auto 0 -2em; }
          .p-safetyservice-upgrade--section--box--category.voice .voice--wrap {
            display: flex;
            justify-content: space-between;
            flex-wrap: wrap; }
            .p-safetyservice-upgrade--section--box--category.voice .voice--wrap--content {
              width: 85%;
              background-color: rgba(255, 255, 255, 0.9);
              border: 2px solid #c1c1c1;
              border-radius: 1rem;
              padding: 1em;
              margin-top: 1em;
              /*&:nth-of-type(n+2){
                margin-top: 1em;
              }*/ }
              .p-safetyservice-upgrade--section--box--category.voice .voice--wrap--content dl {
                width: 100%;
                display: flex;
                justify-content: space-between;
                align-items: center; }
                .p-safetyservice-upgrade--section--box--category.voice .voice--wrap--content dl dt {
                  width: 5%; }
                .p-safetyservice-upgrade--section--box--category.voice .voice--wrap--content dl dd {
                  width: 92.5%;
                  font-size: clamp(12px, 3vw, 12px);
                  font-weight: 400;
                  text-align: justify; }
              .p-safetyservice-upgrade--section--box--category.voice .voice--wrap--content:nth-of-type(even) {
                margin-left: auto; }
                .p-safetyservice-upgrade--section--box--category.voice .voice--wrap--content:nth-of-type(even) dl {
                  flex-direction: row-reverse; }
          .p-safetyservice-upgrade--section--box--category.voice .more-btn {
            width: 40%;
            margin: 1.5em 0 0; }
    .p-safetyservice-upgrade--section.pale {
      background: #e5f6fc;
      padding-top: 1em; }
    .p-safetyservice-upgrade--section.pattern {
      background: repeat url(../../img/safetyservice-upgrade/bg-pattern2.png) left top/auto #f2fafe; }
      .p-safetyservice-upgrade--section.pattern h2 {
        color: #000;
        margin-bottom: 0; }
      .p-safetyservice-upgrade--section.pattern .p-safetyservice-upgrade--section--box {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        background: inherit;
        box-shadow: none;
        padding: 0;
        margin-top: 0; }
        .p-safetyservice-upgrade--section.pattern .p-safetyservice-upgrade--section--box--category {
          width: 48.5%;
          background: #fff;
          box-shadow: 4px 4px 0 0 rgba(72, 72, 72, 0.1);
          padding: 2.5em;
          margin-top: 2.5em; }
          .p-safetyservice-upgrade--section.pattern .p-safetyservice-upgrade--section--box--category h2 {
            color: #484848; }
          .p-safetyservice-upgrade--section.pattern .p-safetyservice-upgrade--section--box--category .image {
            width: 45%;
            margin: 1em auto 0; }
          .p-safetyservice-upgrade--section.pattern .p-safetyservice-upgrade--section--box--category p {
            font-weight: bold;
            text-align: justify;
            margin-top: 1em; }
  .p-safetyservice-upgrade .link-list {
    margin-bottom: 5em; }
    .p-safetyservice-upgrade .link-list ul {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap; }
      .p-safetyservice-upgrade .link-list ul li {
        width: 24%; }
        .p-safetyservice-upgrade .link-list ul li a {
          width: 100%;
          height: 100%;
          padding: .3em; }
          .p-safetyservice-upgrade .link-list ul li a span {
            line-height: 1.4; }
          .p-safetyservice-upgrade .link-list ul li a:after {
            right: 1em; }

.u-text-center {
  text-align: center; }

@media screen and (max-width: 767px) {
  .p-safetyservice-upgrade--kv {
    padding: 0 5%; }
    .p-safetyservice-upgrade--kv--inner--text p {
      text-align: justify; }
  .p-safetyservice-upgrade--section {
    padding: 2.5em calc(50vw - 50%); }
    .p-safetyservice-upgrade--section .more-btn {
      width: 100%; }
    .p-safetyservice-upgrade--section--box--category {
      width: 100% !important; }
      .p-safetyservice-upgrade--section--box--category:nth-of-type(n+2) {
        margin-top: 2em; }
      .p-safetyservice-upgrade--section--box--category--heading {
        flex-wrap: wrap; }
        .p-safetyservice-upgrade--section--box--category--heading .icon {
          width: 25%;
          margin: 0 auto; }
        .p-safetyservice-upgrade--section--box--category--heading span {
          width: 100%;
          margin-top: .5em; }
      .p-safetyservice-upgrade--section--box--category.img-cnt {
        padding-right: 0em;
        border-right: none; }
      .p-safetyservice-upgrade--section--box--category.voice {
        padding-bottom: 18em; }
        .p-safetyservice-upgrade--section--box--category.voice .image img {
          width: 95%;
          margin: 0 0 0 5%; }
        .p-safetyservice-upgrade--section--box--category.voice h3 {
          width: 100%; }
        .p-safetyservice-upgrade--section--box--category.voice .voice--wrap--content {
          width: 100%; }
          .p-safetyservice-upgrade--section--box--category.voice .voice--wrap--content dl {
            flex-wrap: wrap; }
            .p-safetyservice-upgrade--section--box--category.voice .voice--wrap--content dl dt {
              width: 20%;
              margin: 0 auto; }
            .p-safetyservice-upgrade--section--box--category.voice .voice--wrap--content dl dd {
              width: 100%;
              margin-top: .5em; }
        .p-safetyservice-upgrade--section--box--category.voice .more-btn {
          width: 100%; }
    .p-safetyservice-upgrade--section.pattern .p-safetyservice-upgrade--section--box--category {
      width: 100%; }
      .p-safetyservice-upgrade--section.pattern .p-safetyservice-upgrade--section--box--category .image {
        width: 50%; }
  .p-safetyservice-upgrade .link-list ul li {
    width: 80%;
    margin: 2em auto 0; }
    .p-safetyservice-upgrade .link-list ul li a {
      padding: 1em; } }
/*.p-safetyservice-upgrade__benefit-list {
  display: grid;
  justify-content: center;
  grid-template-columns: repeat(auto-fit, minmax(500px, calc(50% - 15px)));
  gap: 34px 30px;
  margin-bottom: 33px;
}

@media screen and (max-width: 767px) {
  .p-safetyservice-upgrade__benefit-list {
    grid-template-columns: auto;
    margin-bottom: 20px;
    gap: 20px;
  }
}*/
/*.p-safetyservice-upgrade__benefit {
  display: grid;
  grid-template-columns: min(22.8%, 120px) 1fr;
  grid-template-rows: auto 1fr;
  background: #fff;
  box-shadow: 4px 4px 0 0 rgba(72, 72, 72, 0.1);
  text-align: left;
}

.p-safetyservice-upgrade__benefit__img {
  grid-area: 1/1/3/2;
}

.p-safetyservice-upgrade__benefit__header {
  grid-area: 1/2/2/3;
  font-size: 20px;
  color: #004da1;
  font-weight: bold;
  font-style: italic;
  border-bottom: 1px solid #dfdfdf;
  padding: 4px 16px;
}

.p-safetyservice-upgrade__benefit__body {
  grid-area: 2/2/3/3;
  padding: 4px 16px;
  line-height: 2;
  align-self: center;
  font-size: 14px;
}

@media screen and (max-width: 767px) {
  .p-safetyservice-upgrade__benefit__header {
    font-size: 17px;
    line-height: 1.1;
    padding-left: 10px;
    padding-right: 10px;
  }

  .p-safetyservice-upgrade__benefit__body {
    font-size: 10px;
    padding-left: 10px;
    padding-right: 10px;
  }
}
*/
/*.p-safetyservice-upgrade__how-to-select {
  text-align: center;
}

.p-safetyservice-upgrade__how-to-select__header {
  background: #000;
  color: #fff;
  font-weight: bold;
  font-size: 34px;
  font-style: italic;
  padding: 24px;
  margin: 0;
}

@media screen and (max-width: 767px) {
  .p-safetyservice-upgrade__how-to-select__header {
    font-size: 22px;
    padding: 15px;
  }
}

.p-safetyservice-upgrade__how-to-select__body {
  background: #fff;
  padding: 20px;
}

@media screen and (max-width: 767px) {
  .p-safetyservice-upgrade__how-to-select__body {
    padding: 15px;
  }
}

.p-safetyservice-upgrade__how-to-select__img {
  position: relative;
  margin-top: 40px;

  &::after {
    position: absolute;
    top: 25.866%;
    left: 0;
    content: "";
    border: 9px solid #e63349;
    width: 100%;
    height: 42.666%;
  }

  figcaption {
    position: absolute;
    top: calc(25.866% - 30px);
    transform: translateY(-100%);
    right: 24px;
    background: #bfe8f9;
    border: 4px solid #e63349;
    padding: 20px 30px;
    width: fit-content;
    max-width: 100%;

    &::before {
      content: "";
      position: absolute;
      top: 100%;
      left: 50%;
      transform: translate(-50%, 3px);
      width: 30px;
      height: 27px;
      clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
      background: #e63349;
      z-index: 1;
    }

    &::after {
      content: "";
      position: absolute;
      top: 100%;
      left: 50%;
      transform: translate(-50%, 3px);
      width: 30px;
      height: 27px;
      clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
      background: #e63349;
      z-index: 1;
      background: #bfe8f9;
      margin-top: -8px;
    }
  }
}

@media screen and (max-width: 767px) {
  .p-safetyservice-upgrade__how-to-select__img::after {
    height: 66.04%;
    top: 21.2%;
  }
}

@media screen and (max-width: 767px) {
  .p-safetyservice-upgrade__how-to-select__img figcaption {
    top: calc(21.2% - 30px);
    padding: 12px 24px;
  }
}
*/
.p-safetyservice-upgrade__heading {
  font-size: 28px;
  font-weight: bold;
  text-align: center;
  color: #004da1;
  letter-spacing: 0;
  margin-bottom: 1.3em; }

@media screen and (max-width: 767px) {
  .p-safetyservice-upgrade__heading {
    font-size: 22px; } }
.p-safetyservice-upgrade__faq {
  border-top: 1px dotted #c8c8c8;
  padding-bottom: 30px;
  font-size: 14px; }
  .p-safetyservice-upgrade__faq:last-child {
    border-bottom: 1px dotted #c8c8c8; }

.p-safetyservice-upgrade__faq__num {
  color: #004da1;
  font-family: roboto, sans-serif;
  font-size: 20px;
  margin-right: 28px; }

.p-safetyservice-upgrade__faq__q {
  padding: 22px 30px;
  display: flex;
  align-items: center; }

.p-safetyservice-upgrade__faq__a {
  padding: 21px 30px;
  background: #f6f6f6; }

@media screen and (max-width: 767px) {
  .p-safetyservice-upgrade__faq:not(.is-open) {
    padding-bottom: 0; }

  .p-safetyservice-upgrade__faq__num {
    margin-right: 15px; }

  .p-safetyservice-upgrade__faq__q {
    position: relative;
    padding-left: 15px;
    padding-right: 40px; }
    .p-safetyservice-upgrade__faq__q::before {
      position: absolute;
      display: block;
      top: 50%;
      right: 20px;
      transform: translateY(-50%);
      content: "";
      width: 2px;
      height: 12px;
      background: #004da1; }
    .p-safetyservice-upgrade__faq__q::after {
      position: absolute;
      display: block;
      top: 50%;
      right: 20px;
      transform: translateY(-50%);
      content: "";
      width: 2px;
      height: 12px;
      background: #004da1;
      transform: translateY(-50%) rotateZ(90deg); }

  .p-safetyservice-upgrade__faq.is-open .p-safetyservice-upgrade__faq__q::before {
    display: none; }

  .p-safetyservice-upgrade__faq__a {
    display: none;
    padding-left: 15px;
    padding-right: 15px; } }
@media screen and (min-width: 768px), print {
  .p-safetyservice-upgrade__faq__a {
    display: block !important; } }
.p-safetyservice-upgrade__terms {
  line-height: 1.7;
  text-align: left;
  font-size: 14px;
  max-width: 1080px;
  margin: 0 auto;
  letter-spacing: 0; }
  .p-safetyservice-upgrade__terms h3, .p-safetyservice-upgrade__terms h4 {
    margin-top: 1.7em; }
  .p-safetyservice-upgrade__terms h3 + h4 {
    margin-top: 0; }

.p-safetyservice-upgrade__toggle-terms-button {
  max-width: 80%;
  width: 400px;
  margin: 0 auto;
  font-size: 16px; }
  .p-safetyservice-upgrade__toggle-terms-button::after {
    transform: rotate(45deg); }
  .p-safetyservice-upgrade__toggle-terms-button.is-open::after {
    transform: rotate(-135deg); }

/*240730 お客様の声追加*/
.customer-voice {
  margin-top: 40px;
}

/*250307 お客様の声にPR文言追加*/
.customer-voice-pr {
  font-size: 1rem;
  letter-spacing: 0.05em;
}
  
