:root { --width: 780 / 375 * 1px; }
@media (max-width: 780px) { :root { --width: 1 / 375 * 100vw; } }

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Noto Sans JP", sans-serif;
}
body {
    overflow-x: hidden;
}
header,
footer,
main {
    max-width: 780px;
    margin: 0 auto;
}
section {
    width: 100%;
    position: relative;
}
img {
    width: 100%;
    height: auto;
    display: block;
}

.img01 {
    padding-top: calc(28 * var(--width));
}
.img01-title {
    max-width: calc(305 * var(--width));
    margin: 0 auto;
}
.img01-slider {
    padding-top: calc(13 * var(--width));
}
.img01-slider .swiper-wrapper {
    display: flex;
    justify-content: start;
    align-items: center;
    overflow-x: scroll;
    width: 100%;
    gap: calc(20 * var(--width));
    padding-left: calc(24 * var(--width));
    padding-right: calc(24 * var(--width));
    box-sizing: border-box;
}
.img01-slider-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: start;
    background-color: #FFFFFF;
    border-radius: calc(8 * var(--width));
    position: relative;
    z-index: 1;
    border: 1px solid #3D3D3D;
    width: calc(211 * var(--width));
    padding: calc(10 * var(--width)) calc(18 * var(--width)) calc(21 * var(--width));
    user-select: none;
}
.img01-slider-item01 {
    padding: calc(13 * var(--width)) calc(15 * var(--width)) calc(25 * var(--width)) calc(17 * var(--width));
    border: none;
}
.img01-slider-item01::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: calc(3 * var(--width)); /* ボーダーの太さ */
    border-radius: calc(8 * var(--width));
    background: linear-gradient(170.04deg, #D84D79 1.84%, #7476CB 92.53%);
    -webkit-mask:
      linear-gradient(#fff 0 0) content-box,
      linear-gradient(#fff 0 0);
    -webkit-mask-composite: destination-out;
    mask-composite: exclude;
    z-index: -1;
}
.img01-slider-item-ranking {
    width: calc(49 * var(--width));
    padding-bottom: calc(6 * var(--width));
}
.img01-slider-item01 .img01-slider-item-ranking {
    width: calc(94 * var(--width));
}
.img01-slider-item-title {
    font-size: calc(17 * var(--width));
    font-weight: 700;
    color: #CC2B5E;
    text-align: center;
    line-height: 1;
    text-decoration: none;
    padding-bottom: calc(4 * var(--width));
    border-bottom: 2px solid #CC2B5E;
}
.img01-slider-item01 .img01-slider-item-title {
    font-size: calc(18 * var(--width));
}
.img01-slider-item-img {
    margin-top: calc(15 * var(--width));
}
.btn01 {
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: calc(175 * var(--width));
    height: calc(42 * var(--width));
    border-radius: calc(8 * var(--width));
    background-color: #12BB54;
    box-shadow: 2px 2px 0 0px #048436;
    margin-top: calc(24 * var(--width));
}
.btn01-headline {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #FFFFFF;
    border: 1px solid #12BB54;
    border-radius: calc(12 * var(--width));
    padding: calc(3 * var(--width)) calc(8 * var(--width));
    white-space: nowrap;
}
.btn01-headline-img {
    width: calc(8 * var(--width));
}
.btn01-headline-text {
    font-size: calc(11 * var(--width));
    font-weight: 500;
    color: #4B4B4B;
    margin: 0 calc(2 * var(--width));
    line-height: 1;
}
.btn01-body {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
    height: 100%;
    padding-right: calc(2 * var(--width));
    overflow: hidden;
}
.btn01-body-text {
    font-size: calc(16 * var(--width));
    font-weight: 700;
    color: #F2F66F;
    line-height: 1;
    padding-top: calc(4 * var(--width));
    padding-bottom: calc(2 * var(--width));
    border-bottom: 2px solid #F2F66F;
}
.btn01-body-img { 
    position: absolute;
    right: calc(29 * var(--width));
    top: calc(19 * var(--width));
    width: calc(5 * var(--width));
    -webkit-animation-name: btnArrow01;
    animation-name: btnArrow01;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
.btn01-click {
    position: absolute;
    top: calc(16 * var(--width));
    right: calc(-16 * var(--width));
    width: calc(42 * var(--width));
    -webkit-animation-name: btn01-click;
    animation-name: btn01-click;
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
@keyframes btn01-click {
    0% { transform: translate(calc(4 * var(--width)), calc(4 * var(--width))); }
    33% {  transform: translate(0, 0); }
    66% {  transform: translate(0, 0); }
    100% { transform: translate(calc(4 * var(--width)), calc(4 * var(--width))); }
}
.btn02 {
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: calc(150 * var(--width));
    height: calc(35 * var(--width));
    border-radius: calc(8 * var(--width));
    background-color: #12BB54;
    box-shadow: 2px 2px 0 0px #048436;
    margin-top: calc(24 * var(--width));
    overflow: hidden;
}
.btn01-body::after,
.btn02::after {
    -moz-animation: reflection 3s ease-in-out infinite;
    -moz-transform: rotate(45deg);
    -ms-animation: reflection 3s ease-in-out infinite;
    -ms-transform: rotate(45deg);
    -o-animation: reflection 3s ease-in-out infinite;
    -o-transform: rotate(45deg);
    -webkit-animation: reflection 3s ease-in-out infinite;
    -webkit-transform: rotate(45deg);
    animation: reflection 3s ease-in-out infinite;
    background-color: #fff;
    content: " ";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    /* top: -180px; */
    top: -80%;
    transform: rotate(45deg);
    width: 3.4%;
}
.btn02-body {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
    height: 100%;
}
.btn02-body-text {
    font-size: calc(15 * var(--width));
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1;
}
.btn02-body-img {
    position: absolute;
    right: calc(11 * var(--width));
    top: calc(13 * var(--width));
    width: calc(5 * var(--width));
    -webkit-animation-name: btnArrow01;
    animation-name: btnArrow01;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
@keyframes btnArrow01 {
    0% { opacity: 0; transform: translateX(calc(-8 * var(--width))); }
    50% { opacity: 1; transform: translateX(calc(5 * var(--width))); }
    100% { opacity: 0; transform: translateX(calc(8 * var(--width))); }
}

.img02 {
    padding-top: calc(30 * var(--width));
    padding-bottom: calc(20 * var(--width));
    background: center calc(100 * var(--width)) / contain no-repeat url(../images/img02-bg.webp);
}
.img02-table {
    overflow-y: hidden;
    overflow-x: scroll;
    width: 100%;
    padding-left: calc(16 * var(--width));
}
.img02-table table {
    width: calc(534 * var(--width));
    border-collapse: collapse;
}
.img02-table th {
    width: calc(72 * var(--width));
    background-color: #DFE5FF;
    border-right: 2px solid #FFFFFF;
    border-bottom: 2px solid #FFFFFF;
    font-size: calc(12 * var(--width));
    font-weight: 500;
    color: #363A3C;
    line-height: 1;
    vertical-align: middle;
}
.img02-table th span {
    font-size: calc(7 * var(--width));
    font-weight: 500;
    color: #363A3C;
    line-height: 1;
}
.img02-table td {
    border-top: 2px solid #B9B9B9;
    border-right: 2px solid #B9B9B9;
    border-bottom: 2px solid #B9B9B9;
    background-color: #FFFFFF;
}
.img02-table td:nth-of-type(1) {
    background-color: #FFFCE0;
}
.img02-table tr:not(:first-of-type) td {
    padding-top: calc(15 * var(--width));
    padding-bottom: calc(10 * var(--width));
}
.img02-table-ranking {
    display: block;
    width: calc(36 * var(--width));
    margin: 0 auto calc(6 * var(--width));
    padding-top: calc(7 * var(--width));
}
.img02-table-title {
    display: block;
    font-size: calc(13 * var(--width));
    font-weight: 700;
    color: #082B9D;
    line-height: 1;
    margin: 0 auto calc(13 * var(--width));
    text-align: center;
}
.img02-table-img {
    display: block;
    width: calc(109 * var(--width));
    margin: 0 auto calc(14 * var(--width));
}
.img02-table-rating {
    display: block;
    width: calc(17 * var(--width));
    margin: 0 auto calc(2 * var(--width));
}
.img02-table-price {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.img02-table-price p {
    display: flex;
    justify-content: center;
    align-items: baseline;
    font-size: calc(12 * var(--width));
    font-weight: 500;
    color: #363A3C;
    line-height: 1.5;
    text-align: center;
}
.img02-table-price p .bold {
    font-weight: 700;
}
.img02-table-price p .remove-line {
    position: relative;
    z-index: 1;
}
.img02-table-price p .remove-line::before {
    position: absolute;
    content: "";
    bottom: 20%;
    left: 50%;
    width: 100%;
    height: 2px;
    background-color: #F7553D;
    transform: rotate(10deg) translateX(-50%);
    z-index: -1;
}
.img02-table-price p .triangle {
    font-size: calc(8 * var(--width));
    align-self: center;
    padding-left: calc(4 * var(--width));
}
.img02-table-price p .red {
    color: #F7553D;
}
.img02-table-price p .small {
    font-size: calc(9 * var(--width));
}
.img02-table-price p .normal {
    font-weight: 400;
}
.img02-table .btn02 {
    margin: 0 auto;
    width: calc(107 * var(--width));
}
.img02-table .btn02-body-text {
    font-size: calc(13 * var(--width));
    padding-right: calc(8 * var(--width));
}
.img02-table-note {
    width: 100%;
    padding-left: calc(16 * var(--width));
    font-size: calc(7 * var(--width));
    font-weight: 400;
    color: #000000;
    line-height: 1.5;
    padding-top: calc(8 * var(--width));
}
.img03-point {
    padding-top: calc(30 * var(--width));
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: start;
}
.img03-point-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;position: relative;
    border: 2px solid #544F67;
    width: calc(344 * var(--width));
    border-top-left-radius: calc(4 * var(--width));
    border-top-right-radius: calc(30 * var(--width));
    border-bottom-left-radius: calc(30 * var(--width));
    border-bottom-right-radius: calc(4 * var(--width));
    padding-top: calc(36 * var(--width));
    padding-bottom: calc(22 * var(--width));
    box-shadow: 4px 4px 9px 0px #B59EC2;
    margin-bottom: calc(60 * var(--width));
}
.img03-point-item.img03-point-item03 {
    margin-bottom: calc(30 * var(--width));
}
.img03-point-item-title {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #FFFFFF;
    border-radius: calc(29 * var(--width));
    background: linear-gradient(90deg, #9087BE 0%, #5C55A5 100%);
    width: calc(174 * var(--width));
    height: calc(38 * var(--width));
}
.img03-point-item-title-text {
    font-size: calc(22 * var(--width));
    font-weight: 400;
    color: #FFFFFF;
    line-height: 1;
    font-family: "Brygada 1918", serif;
    padding-right: calc(4 * var(--width));
}
.img03-point-item-title-number {
    font-size: calc(27 * var(--width));
    font-weight: 400;
    color: #FFFFFF;
    line-height: 1;
    font-family: "Brygada 1918", serif;
}
.img03-point-item-subtitle {
    width: calc(303 * var(--width));
    font-size: calc(22 * var(--width));
    font-weight: 700;
    color: #5A439A;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
    position: relative;
    padding: calc(11 * var(--width)) 0;
}
.img03-point-item-subtitle::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, #9087BE 0%, #5C55A5 100%);
}
.img03-point-item-subtitle::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, #9087BE 0%, #5C55A5 100%);
}
.img03-point-item-subtitle-img-line01 {
    position: absolute;
    left: 0;
    bottom: calc(-6 * var(--width));
    width: calc(134 * var(--width));
}
.img03-point-item-subtitle-img-arrow {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    height: calc(18 * var(--width));
    width: auto;
}
.img03-point-item-subtitle-img-line02 {
    position: absolute;
    right: 0;
    bottom: calc(-6 * var(--width));
    width: calc(134 * var(--width));
}
.img03-point-item-img {
    margin-top: calc(13 * var(--width));
    width: calc(116 * var(--width));
}
.img03-point-item-box {
    width: calc(322 * var(--width));
    background: linear-gradient(90deg, #A4B7D900 0%, #CDD5FF 50%, #C6BFDE00 100%);
    padding: calc(8 * var(--width)) calc(14 * var(--width)) calc(8 * var(--width));
    border-radius: calc(8 * var(--width));
}
.img03-point-item-box p {
    font-size: calc(14 * var(--width));
    font-weight: 500;
    color: #3D3D3D;
    line-height: 1.5;
}
.img03-point-item-text {
    font-size: calc(15 * var(--width));
    font-weight: 500;
    color: #3D3D3D;
    line-height: 1.5;
    width: calc(300 * var(--width));
}
.img03-point-item01 .img03-point-item-text {
    padding-top: calc(17 * var(--width));
    padding-bottom: calc(17 * var(--width));
}
.img03-point-item03 .img03-point-item-text {
    width: calc(310 * var(--width));
    font-size: calc(17 * var(--width));
    white-space: nowrap;
}
.img03-point-item-text.normal {
    font-weight: 400;
}
.img03-point-item-text .bold {
    font-weight: 700;
}
.img03-point-item-text .red {
    color: #CC2B5E;
}
.img03-point-item-text span {
    position: relative;
}
.light {
    position: absolute;
    left: 100%;
    bottom: 0;
    display: block;
    width: calc(16 * var(--width));
}
.img03-point-item-serif {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: calc(326 * var(--width));
}
.img03-point-item-serif-icon {
    width: calc(72 * var(--width));
}
.img03-point-item-serif-text {
    width: calc(250 * var(--width));
    padding-top: calc(12 * var(--width));
    padding-bottom: calc(15 * var(--width));
    padding-left: calc(19 * var(--width));
    background: center left / contain no-repeat url(../images/serif-text.webp);
}
.img03-point-item-serif-text p {

    font-size: calc(12 * var(--width));
    font-weight: 400;
    color: #3D3D3D;
    line-height: 1.5;
}
.img03-point-item-serif-text p span {
    position: relative;
}
.img03-point-item-serif-text .red {
    color: #AE0C42;
}
.shine {
    position: absolute;
    left: 100%;
    bottom: 0;
    display: block;
    width: calc(14 * var(--width)); 
}
.img03-point-item-imgs {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: calc(165 * var(--width));
    width: 100%;
    margin-top: calc(18 * var(--width));
}
.img03-point-item-img01 {
    position: absolute;
    right: 54%;
    top: 0;
    width: calc(165 * var(--width));
}
.img03-point-item-img02 {
    position: absolute;
    left: 52%;
    top: 0;
    width: calc(165 * var(--width));
}
.img03-point-item-img03 {
    position: absolute;
    top: 52%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: calc(68 * var(--width));
}
.img03-point-item-box02 {
    background: center center / contain no-repeat url(../images/bg01.webp);
    width: calc(315 * var(--width));
    height: calc(92 * var(--width));
    padding-left: calc(38 * var(--width));
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: start;
    padding-top: calc(12 * var(--width));
    margin-top: calc(15 * var(--width));
    margin-bottom: calc(10 * var(--width));
}
.img03-point-item-box02 p {
    font-size: calc(16 * var(--width));
    font-weight: 400;
    color: #FFFFFF;
    line-height: 1.5;
}
.img03-point-item-box02 .red {
    position: relative;
    padding-bottom: calc(2 * var(--width));
    border-bottom: 1px solid #D93757;
    margin-bottom: calc(6 * var(--width));
}
.img03-point-item-box02 .red::before {
    position: absolute;
    content: "";
    top: calc(7 * var(--width));
    left: calc(-18 * var(--width));
    background: #D93757;
    border-radius: 50%;
    width: calc(12 * var(--width));
    height: calc(12 * var(--width));
}
.img03-point-item-box02 .red::after {
    position: absolute;
    content: "";
    top: calc(5 * var(--width));
    left: calc(-20 * var(--width));
    border: 1px solid #D93757;
    border-radius: 50%;
    width: calc(15 * var(--width));
    height: calc(15 * var(--width));
}
.img03-point-item-box02 .blue {
    position: relative;
    padding-bottom: calc(2 * var(--width));
    border-bottom: 1px solid #4875B3;
}
.img03-point-item-box02 .blue::before {
    position: absolute;
    content: "";
    top: calc(7 * var(--width));
    left: calc(-18 * var(--width));
    background: #4875B3;
    border-radius: 50%;
    width: calc(12 * var(--width));
    height: calc(12 * var(--width));
}
.img03-point-item-box02 .blue::after {
    position: absolute;
    content: "";
    top: calc(5 * var(--width));
    left: calc(-20 * var(--width));
    border: 1px solid #4875B3;
    border-radius: 50%;
    width: calc(15 * var(--width));
    height: calc(15 * var(--width));
}
.img03-point-item-box03 {
    position: relative;
    border: 1px solid #AE0C42;
    width: calc(316 * var(--width));
    padding-top: calc(35 * var(--width));
    padding-bottom: calc(6 * var(--width));
    padding-left: calc(6 * var(--width));
    margin-top: calc(12 * var(--width));
    margin-bottom: calc(12 * var(--width));
}
.img03-point-item-box03-check {
    position: absolute;
    top: 0;
    left: 0;
    width: calc(66 * var(--width));
    height: calc(20 * var(--width));
    background: #AE0C42;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding-left: calc(6 * var(--width));
}
.img03-point-item-box03-check img {
    width: calc(12 * var(--width));
}
.img03-point-item-box03-check p {
    font-size: calc(11 * var(--width));
    font-weight: 400;
    color: #FFFFFF;
    line-height: 1;
    padding-left: calc(2 * var(--width));
}
.img03-point-item-box03-text {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-bottom: calc(6 * var(--width));
}
.img03-point-item-box03-text img {
    width: calc(10 * var(--width));
}
.img03-point-item-box03-text p {
    font-size: calc(17 * var(--width));
    font-weight: 700;
    color: #AE0C42;
    padding-left: calc(3 * var(--width));
}
.img04 {
    background: center calc(136 * var(--width)) / cover no-repeat url(../images/bg02.webp);
    padding-bottom: calc(10 * var(--width));
}
.img05 {
    background: #FFE0AB;
    padding-top: calc(10 * var(--width));
    padding-bottom: calc(10 * var(--width));
}
.img06 {
    background: #ADADAD;
    padding-top: calc(10 * var(--width));
    padding-bottom: calc(10 * var(--width));
}
.img04-box ,
.img05-box,
.img06-box,
.img09-box {
    background: #FFFFFF;
    width: calc(355 * var(--width));
    margin: 0 auto;
    padding-top: calc(20 * var(--width));
}
.img05-box,
.img06-box {
    padding-bottom: calc(35 * var(--width));
}
.img09-box {
    padding-bottom: calc(25 * var(--width));
    position: relative;
}
.img04-box-title ,
.img05-box-title ,
.img06-box-title ,
.img09-box-title {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    padding-left: calc(22 * var(--width));
    padding-bottom: calc(30 * var(--width));
}
.img09-box-title {
    align-items: center;
    padding-bottom: calc(14 * var(--width));
}
.img04-box-title img ,
.img05-box-title img ,
.img06-box-title img {
    width: calc(36 * var(--width));
}
.img09-box-title img {
    width: calc(54 * var(--width));
}
.img04-box-title-text ,
.img05-box-title-text ,
.img06-box-title-text ,
.img09-box-title-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding-left: calc(7 * var(--width));
}
.img09-box-title-text {
    padding-top: calc(10 * var(--width));
    padding-left: calc(13 * var(--width));
}
.img04-box-title-text p {
    font-size: calc(12 * var(--width));
    font-weight: 700;
    color: #AE0C42;
    line-height: 1.2;
    letter-spacing: 0.05em;
    padding-bottom: calc(4 * var(--width));
}
.img04-box-title-text h3 ,
.img05-box-title-text h3 ,
.img06-box-title-text h3 ,
.img09-box-title-text h3 {
    font-size: calc(24 * var(--width));
    font-weight: 700;
    color: #0000EE;
    line-height: 1.2;
}
.img04-box-title-text h3 a ,
.img05-box-title-text h3 a ,
.img06-box-title-text h3 a ,
.img09-box-title-text h3 a {
    border-bottom: 2px solid #0000EE;
    text-decoration: none;
    font-size: calc(24 * var(--width));
    font-weight: 700;
    color: #0000EE;
    line-height: 1.2;
}
.img04-box-img ,
.img05-box-img ,
.img06-box-img ,
.img09-box-img {
    width: calc(310 * var(--width));
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto calc(55 * var(--width));
}
.img09-box-img {
    margin-bottom: 0;
}
.img04-box-recommend ,
.img05-box-recommend ,
.img06-box-recommend {
    position: relative;
    width: calc(311 * var(--width));
    margin: 0 auto;
    border: 1px solid #3D3D3D;
    background: center center / cover no-repeat url(../images/bg03.webp);
    padding-top: calc(34 * var(--width));
    padding-bottom: calc(17 * var(--width));
    z-index: 1;
}
.img04-box-recommend::before ,
.img05-box-recommend::before ,
.img06-box-recommend::before {
    position: absolute;
    content: "";
    top: calc(-9 * var(--width));
    left: calc(-9 * var(--width));
    right: calc(-9 * var(--width));
    bottom: calc(-9 * var(--width));
    box-shadow: 2px 2px 4px 0 #00000040;
    z-index: -1;
}
.corner01 {
    position: absolute;
    top: 0;
    left: 0;
    width: calc(7 * var(--width));
}
.corner02 {
    position: absolute;
    top: 0;
    right: 0;
    width: calc(7 * var(--width));
}
.corner03 {
    position: absolute;
    bottom: 0;
    left: 0;
    width: calc(7 * var(--width));
}
.corner04 {
    position: absolute;
    bottom: 0;
    right: 0;
    width: calc(7 * var(--width));
}
.img04-box-recommend-title ,
.img05-box-recommend-title ,
.img06-box-recommend-title {
    width: calc(186 * var(--width));
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -38%);
}
.img04-box-recommend-body ,
.img05-box-recommend-body ,
.img06-box-recommend-body {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: start;
    margin: 0 auto;
    padding-left: calc(10 * var(--width));
    padding-right: calc(13 * var(--width));
    position: relative;
    z-index: 1;
}
.img04-box-recommend-body-item ,
.img05-box-recommend-body-item ,
.img06-box-recommend-body-item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-top: calc(9 * var(--width));
    padding-bottom: calc(9 * var(--width));
    position: relative;
    width: 100%;
}
.img04-box-recommend-body-item::before ,
.img05-box-recommend-body-item::before ,
.img06-box-recommend-body-item::before {
    position: absolute;
    content: "";
    top: 100%;
    left: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(to right, #C6C3FC 0%, #746EC9 100%);
}
.img04-box-recommend-body-item img ,
.img05-box-recommend-body-item img ,
.img06-box-recommend-body-item img {
    width: calc(27 * var(--width));
}
.img04-box-recommend-body-item p ,
.img05-box-recommend-body-item p ,
.img06-box-recommend-body-item p {
    font-size: calc(13 * var(--width));
    font-weight: 500;
    color: #3D3D3D;
    line-height: 1.5;
    padding-left: calc(6 * var(--width));
}
.img04-box-recommend-body-item p .bold ,
.img05-box-recommend-body-item p .bold ,
.img06-box-recommend-body-item p .bold {
    font-weight: 700;
}
.img04-box-recommend-body-item p .marker ,
.img05-box-recommend-body-item p .marker ,
.img06-box-recommend-body-item p .marker {
    background: linear-gradient(transparent 70%, #FFEC40 70%);
}
.img04-box-recommend-note ,
.img05-box-recommend-note ,
.img06-box-recommend-note {
    text-align: right;
    font-size: calc(9 * var(--width));
    font-weight: 500;
    color: #000000;
    line-height: 1.2;
    padding-right: calc(13 * var(--width));
    padding-top: calc(12 * var(--width));
}
.img04-box-table ,
.img05-box-table ,
.img06-box-table {
    width: calc(328 * var(--width));
    margin: 0 auto;
    padding-top: calc(35 * var(--width));
    padding-bottom: calc(50 * var(--width));
}
.img05-box-table ,
.img06-box-table {
    padding-bottom: calc(25 * var(--width));
}
.img04-box-table table ,
.img05-box-table table ,
.img06-box-table table {
    width: 100%;
    border-collapse: collapse;
}
.img04-box-table th ,
.img05-box-table th ,
.img06-box-table th {
    width: calc(87 * var(--width));
    height: calc(82 * var(--width));
    background-color: #E0DEEF;
    border-right: 2px solid #FFFFFF;
    border-bottom: 2px solid #FFFFFF;
    font-size: calc(11 * var(--width));
    font-weight: 700;
    color: #363A3C;
    line-height: 1;
}
.img04-box-table th span ,
.img05-box-table th span ,
.img06-box-table th span {
    font-size: calc(7 * var(--width));
    font-weight: 500;
    color: #363A3C;
}
.img04-box-table td ,
.img05-box-table td ,
.img06-box-table td {
    border-top: 2px solid #B9B9B9;
    border-right: 2px solid #B9B9B9;
    border-bottom: 2px solid #B9B9B9;
    background-color: #FFFFFF;
    font-size: calc(12 * var(--width));
    text-align: center;
}
.img04-box-table td .red ,
.img05-box-table td .red ,
.img06-box-table td .red {
    color: #F7553D;
}
.img04-box-table td .large ,
.img05-box-table td .large ,
.img06-box-table td .large {
    font-size: calc(16 * var(--width));
}
.img04-box-table td .small ,
.img05-box-table td .small ,
.img06-box-table td .small {
    font-size: calc(10 * var(--width));
}
.img04-box-table td .bold ,
.img05-box-table td .bold ,
.img06-box-table td .bold {
    font-weight: 700;
}
.img04-box-graph {
    position: relative;
    width: calc(329 * var(--width));
    margin: 0 auto calc(30 * var(--width));
    padding-top: calc(24 * var(--width));
    padding-bottom: calc(19 * var(--width));
    padding-left: calc(7 * var(--width));
    padding-right: calc(7 * var(--width));
    border: 1px solid #000000;
}
.img04-box-graph-title {
    width: calc(191 * var(--width));
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
}
.img04-box-graph-img01 {
    position: relative;
    width: 100%;
}
.img04-box-graph-img01 p {
    position: absolute;
    font-size: calc(11 * var(--width));
    font-weight: 500;
    color: #3D3D3D;
    line-height: 1.3;
}
.img04-box-graph-img01 p span {
    color: #AE0C42;
}
.img04-box-graph-img01-text01 {
    top: calc(65 * var(--width));
    left: calc(24 * var(--width));
}
.img04-box-graph-img01-text02 {
    top: calc(30 * var(--width));
    right: calc(8 * var(--width));
}
.img04-box-graph-img01-text03 {
    bottom: calc(19 * var(--width));
    left: calc(28 * var(--width));
}
.img04-box-graph-img01-text04 {
    bottom: calc(24 * var(--width));
    right: calc(8 * var(--width));
}
.img04-box-graph-img01 p.img04-box-graph-img01-text05 {
    font-size: calc(4 * var(--width));
    color: #000000;
    line-height: 1.5;
    text-align: center;
    bottom: calc(65 * var(--width));
    left: calc(120 * var(--width));
}
.img04-box-graph-text01 {
    padding-left: calc(60 * var(--width));
    font-size: calc(8 * var(--width));
    color: #000000;
    padding-top: calc(10 * var(--width));
    padding-bottom: calc(35 * var(--width));
}
.img04-box-graph-img02 {
    position: relative;
    width: calc(289 * var(--width));
    margin: 0 auto;
}
.img04-box-graph-img02 p {
    position: absolute;
    font-size: calc(14 * var(--width));
    color: #FFFFFF;
    line-height: 1.4;
    text-align: center;
}
.img04-box-graph-img02-text01 {
    top: calc(4 * var(--width));
    left: calc(18 * var(--width));
}
.img04-box-graph-img02-text02 {
    top: calc(4 * var(--width));
    right: calc(33 * var(--width));
}
.img04-box-graph-text02 {
    padding-left: calc(50 * var(--width));
    font-size: calc(8 * var(--width));
    color: #000000;
    padding-top: calc(20 * var(--width));
}
.img04-box-dots {
    width: calc(3 * var(--width));
    margin: 0 auto calc(30 * var(--width));
}
.img04-box-pickup {
    padding-bottom: calc(25 * var(--width));
}
.img04-box-pickup-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: start;
}
.img04-box-pickup-title h3 {
    font-size: calc(21 * var(--width));
    font-weight: 400;
    font-family: "Quicksand", sans-serif;
    text-align: center;
    letter-spacing: 0.1em;
    color: #000000;
    line-height: 1.2;
    padding-bottom: calc(4 * var(--width));
}
.img04-box-pickup-title p {
    font-size: calc(9 * var(--width));
    font-weight: 400;
    font-family: "Quicksand", sans-serif;
    text-align: center;
    letter-spacing: 0.1em;
    color: #000000;
    line-height: 1.2;
    padding-bottom: calc(4 * var(--width));
}
.img04-box-pickup-slider-box {
    width: calc(291 * var(--width));
    margin: 0 auto;
    position: relative;
}
.img04-box-pickup-slider {
    width: 100%;
    overflow: hidden;
    border-top-right-radius: calc(30 * var(--width));
    border-bottom-left-radius: calc(30 * var(--width));
    box-shadow: 3px 4px 4px 0 #0000000F;
}
.img04-box-pickup-slider .swiper-wrapper {
    display: flex;
    justify-content: start;
    align-items: center;
    width: 100%;
}
.img04-box-pickup-slider-item {
    background: linear-gradient(to right, #F3F7FF 0%,#DBE0FF 50%, #FEFEFF 100%);
    border-top-right-radius: calc(30 * var(--width));
    border-bottom-left-radius: calc(30 * var(--width));
    padding-bottom: calc(20 * var(--width));
}
.img04-box-pickup-slider-item p {
    font-size: calc(6 * var(--width));
    font-weight: 400;
    color: #000000;
    line-height: 1.5;
    padding-left: calc(55 * var(--width));
    padding-top: calc(6 * var(--width));
}
.swiper-button-prev02 {
    position: absolute;
    width: calc(8 * var(--width));
    top: 50%;
    left: calc(-12 * var(--width));
    transform: translateY(-50%);
    outline: none;
    cursor: pointer;
}
.swiper-button-next02 {
    position: absolute;
    width: calc(8 * var(--width));
    top: 50%;
    right: calc(-12 * var(--width));
    transform: translateY(-50%);
    outline: none;
    cursor: pointer;
}
.swiper-pagination02 {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: calc(14 * var(--width));
    padding-top: calc(14 * var(--width));
    position: relative;
    z-index: 1;
}
.swiper-pagination02 span {
    width: calc(5 * var(--width));
    height: calc(5 * var(--width));
    background-color: #D9D9D9;
    border-radius: 50%;
    opacity: 1;
    cursor: pointer;
    transition: all 0.3s ease;
    margin: 0 !important;
}
.swiper-pagination02 span.swiper-pagination-bullet-active {
    background-color: #3D3D3D;
}
.img04-box-campaign {
    background: linear-gradient(to bottom, #CC2B5E 0%, #6A78D4 100%);
    padding-top: calc(16 * var(--width));
    padding-bottom: calc(6 * var(--width));
}
.img04-box-campaign-title {
    display: flex;
    align-items: center;
    justify-content: start;
    padding-bottom: calc(16 * var(--width));
}
.img04-box-campaign-title .star01 {
    width: calc(14 * var(--width));
    margin: 0 auto;
}
.img04-box-campaign-title .line02 {
    width: calc(75 * var(--width));
}
.img04-box-campaign-title h3 {
    font-size: calc(21 * var(--width));
    color: #FFFFFF;
    font-weight: 700;
    letter-spacing: 0.1em;
    line-height: 1.2;
    padding-left: calc(12 * var(--width));
    padding-right: calc(12 * var(--width));
    white-space: nowrap;
}
.img04-box-campaign-body {
    background: top center / cover no-repeat url(../images/bg04.webp);
    width: calc(342 * var(--width));
    margin: 0 auto;
    padding-bottom: calc(50 * var(--width));
    position: relative;
}
.img04-box-campaign-body-link {
    width: 100%;
}
.img04-box-campaign-body-item {
    padding-left: calc(22 * var(--width));
    padding-right: calc(22 * var(--width));
    padding-top: calc(3 * var(--width));
    padding-bottom: calc(24 * var(--width));
    display: flex;
    align-items: start;
    justify-content: flex-start;
}
.img04-box-campaign-body-item-img {
    width: calc(48 * var(--width));
}
.img04-box-campaign-body-item-text {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: flex-start;
    padding-left: calc(20 * var(--width));
    padding-top: calc(8 * var(--width));
}
.img04-box-campaign-body-item-text-title {
    font-size: calc(23 * var(--width));
    font-weight: 500;
    color: #363A3C;
    line-height: 1;
}
.img04-box-campaign-body-item-text-box01 {
    display: flex;
    align-items: baseline;
    justify-content: flex-start;
}
.img04-box-campaign-body-item-text-box01-text01 {
    font-size: calc(14 * var(--width));
    font-weight: 400;
    color: #000000;
    line-height: 1.5;
    font-family: "Quicksand", sans-serif;
    padding-right: calc(3 * var(--width));
}
.img04-box-campaign-body-item-text-box01-text02 {
    font-size: calc(30 * var(--width));
    font-weight: 400;
    color: #000000;
    line-height: 1.5;
    position: relative;
    z-index: 1;
}
.img04-box-campaign-body-item-text-box01-text02::before {
    position: absolute;
    content: "";
    bottom: 20%;
    left: 50%;
    width: 100%;
    height: 2px;
    background-color: #CD1050;
    transform: rotate(10deg) translateX(-50%);
    z-index: -1;
}
.img04-box-campaign-body-item-text-box01-text02 span:nth-of-type(1) {
    font-size: calc(17 * var(--width));
    font-weight: 400;
    color: #000000;
    line-height: 1.5;
}
.img04-box-campaign-body-item-text-box01-text02 span:nth-of-type(2) {
    font-size: calc(11 * var(--width));
    font-weight: 400;
    color: #000000;
    line-height: 1.5;
}
.img04-box-campaign-body-item-text-arrow {
    width: calc(54 * var(--width));
    margin: 0 auto;
    padding-top: calc(2 * var(--width));
    padding-bottom: calc(6 * var(--width));
}
.img04-box-campaign-body-item-text-box02 {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    position: relative;
    width: 100%;
}
.img04-box-campaign-body-item-text-box02-text01 {
    border-top: 1px solid #BF4555;
    border-bottom: 1px solid #BF4555;
    padding-top: calc(6 * var(--width));
    padding-bottom: calc(6 * var(--width));
    color: #BF4555;
    font-size: calc(16 * var(--width));
    font-weight: 700;
    line-height: 1;
    text-align: center;
    width: calc(222 * var(--width));
    letter-spacing: 0.1em;
}
.img04-box-campaign-body-item-text-box02-text02 {
    font-size: calc(50 * var(--width));
    font-weight: 700;
    color: #CD1050;
    line-height: 1;
}
.img04-box-campaign-body-item-text-box02-text02 span {
    font-size: calc(33 * var(--width));
    font-weight: 700;
    color: #CD1050;
    line-height: 1;
}
.img04-box-campaign-body-item-text-box02-text03 {
    position: absolute;
    bottom: calc(33 * var(--width));
    right: calc(16 * var(--width));
    font-size: calc(10 * var(--width));
    font-weight: 400;
    color: #CD1050;
    line-height: 1;
}
.img04-box-campaign-body-bottom {
    width: calc(304 * var(--width));
    margin: 0 auto;
    border: 2px solid #363A3C;
}
.img04-box-campaign-body-bottom-title {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-color: #363A3C;
    width: 100%;
    padding-top: calc(6 * var(--width));
    padding-bottom: calc(8 * var(--width));
    position: relative;
}
.img04-box-campaign-body-bottom-title h4 {
    font-size: calc(14 * var(--width));
    font-weight: 400;
    color: #FFFFFF;
    letter-spacing: 0.1em;
}
.img04-box-campaign-body-bottom-title span {
    font-size: calc(8 * var(--width));
    font-weight: 400;
    color: #FFFFFF;
    letter-spacing: 0.1em;
}
.img04-box-campaign-body-bottom-title-img {
    position: absolute;
    top: 90%;
    left: 50%;
    transform: translateX(-50%);
    width: calc(20 * var(--width));
}
.img04-box-campaign-body-bottom-body {
    padding-top: calc(11 * var(--width));
    padding-bottom: calc(11 * var(--width));
    padding-left: calc(28 * var(--width));
    padding-right: calc(28 * var(--width));
    background-color: #FFFFFF;
}
.img04-box-campaign-body-bottom-body-text01 {
    font-size: calc(11 * var(--width));
    font-weight: 700;
    color: #CD1050;
    line-height: 1;
    letter-spacing: 0.1em;
    text-align: center;
    border-bottom: 1px solid #BF4555;
    padding-bottom: calc(4 * var(--width));
    padding-right: calc(10 * var(--width));
}
.img04-box-campaign-body-bottom-body-text02 {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding-left: calc(10 * var(--width));
}
.img04-box-campaign-body-bottom-body-text02-text01 {
    font-size: calc(17 * var(--width));
    font-weight: 700;
    color: #CD1050;
    line-height: 1;
    letter-spacing: 0.1em;
    writing-mode: vertical-rl;
    padding-top: calc(12 * var(--width));
    padding-right: calc(5 * var(--width));
}
.img04-box-campaign-body-bottom-body-text02-text02 {
    font-size: calc(50 * var(--width));
    font-weight: 700;
    color: #CD1050;
    line-height: 1;
}
.img04-box-campaign-body-bottom-body-text02-text02 span:nth-of-type(1) {
    font-size: calc(33 * var(--width));
    font-weight: 700;
    color: #CD1050;
    line-height: 1;
}
.img04-box-campaign-body-bottom-body-text02-text02 span:nth-of-type(2) {
    font-size: calc(28 * var(--width));
    font-weight: 700;
    color: #CD1050;
    line-height: 1;
}
.img04-box-campaign-body-bottom-body-text02-text02 span:nth-of-type(3) {
    font-size: calc(10 * var(--width));
    font-weight: 400;
    color: #CD1050;
    line-height: 1;
}
.img04-box-campaign-body-bottom-body-text02-text03 {
    position: absolute;
    bottom: calc(32 * var(--width));
    right: calc(41 * var(--width));
    font-size: calc(10 * var(--width));
    font-weight: 400;
    color: #CD1050;
    line-height: 1;
}
.img04-box-campaign-body-bottom-body-text03 {
    font-size: calc(12 * var(--width));
    font-weight: 400;
    color: #BF4555;
    line-height: 1;
    text-align: end;
    padding-right: calc(10 * var(--width));
    padding-top: calc(2 * var(--width));
}
.img04-box-campaign-body-bottom-body-text04 {
    font-size: calc(24 * var(--width));
    font-weight: 400;
    color: #363A3C;
    line-height: 1;
    text-align: center;
    padding-top: calc(4 * var(--width));
}
.img04-box-campaign-body-note ,
.img05-box-campaign-body-note ,
.img06-box-campaign-body-note {
    padding-top: calc(12 * var(--width));
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
}
.img04-box-campaign-body-note p ,
.img05-box-campaign-body-note p ,
.img06-box-campaign-body-note p {
    font-size: calc(8 * var(--width));
    font-weight: 400;
    color: #000000;
    line-height: 1.5;
}
.img05-box-campaign-body-note p {
    font-size: calc(9 * var(--width));
}
.img04-box-campaign-body-img {
    position: absolute;
    bottom: calc(0 * var(--width));
    left: 50%;
    transform: translateX(-50%);
    width: 99%;
}
.img04-box-campaign-footer {
    width: 100%;
    background-color: #FFFFFF;
    padding-top: calc(24 * var(--width));
    padding-bottom: calc(20 * var(--width));
    display: flex;
    align-items: center;
    justify-content: start;
    flex-direction: column;
}
.img04-box-campaign-footer-serif {
    width: calc(192 * var(--width));
    height: calc(56 * var(--width));
    background: center center / contain no-repeat url(../images/serif02.webp);
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: start;
    flex-direction: column;
    padding-top: calc(6 * var(--width));
    margin-bottom: calc(6 * var(--width));
}
.img04-box-campaign-footer-serif p {
    font-size: calc(13 * var(--width));
    font-weight: 400;
    color: #000000;
    line-height: 1;
    text-align: center;
}
.img04-box-campaign-footer-serif h3 {
    font-size: calc(23 * var(--width));
    font-weight: 500;
    color: #CD1050;
    line-height: 1;
    text-align: center;
}
.img04-box-campaign-footer-btn,
.img05-box-campaign-footer-btn,
.img06-box-campaign-footer-btn {
    background-color: #12BB54;
    box-shadow: 3px 3px 0 0 #008038;
    width: calc(324 * var(--width));
    height: calc(70 * var(--width));
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    border-radius: calc(17 * var(--width));
    text-decoration: none;
    overflow: hidden;
}
.img04-box-campaign-footer-btn::after,
.img05-box-campaign-footer-btn::after,
.img06-box-campaign-footer-btn::after {
    -moz-animation: reflection 3s ease-in-out infinite;
    -moz-transform: rotate(45deg);
    -ms-animation: reflection 3s ease-in-out infinite;
    -ms-transform: rotate(45deg);
    -o-animation: reflection 3s ease-in-out infinite;
    -o-transform: rotate(45deg);
    -webkit-animation: reflection 3s ease-in-out infinite;
    -webkit-transform: rotate(45deg);
    animation: reflection 3s ease-in-out infinite;
    background-color: #fff;
    content: " ";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    /* top: -180px; */
    top: -80%;
    transform: rotate(45deg);
    width: 3.4%;
}
@keyframes reflection {
    0% {transform: scale(0) rotate(45deg);opacity: 0;}
    80% {transform: scale(0) rotate(45deg);opacity: 0.5;}
    81% {transform: scale(4) rotate(45deg);opacity: 1;}
    100% {transform: scale(50) rotate(45deg);opacity: 0;}
}
.img04-box-campaign-footer-btn p ,
.img05-box-campaign-footer-btn p ,
.img06-box-campaign-footer-btn p {
    font-size: calc(17 * var(--width));
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1.5;
    text-align: center;
}
.img04-box-campaign-footer-btn p span ,
.img05-box-campaign-footer-btn p span ,
.img06-box-campaign-footer-btn p span {
    color: #FFF677;
}
.img04-box-campaign-footer-btn-arrow ,
.img05-box-campaign-footer-btn-arrow ,
.img06-box-campaign-footer-btn-arrow {
    position: absolute;
    top: 50%;
    right: calc(40 * var(--width));
    transform: translateY(-50%);
    width: calc(21 * var(--width));
    -webkit-animation-name: btnArrow02;
    animation-name: btnArrow02;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
@keyframes btnArrow02 {
    0% { opacity: 0; transform: translateX(calc(-10 * var(--width))) translateY(-50%); }
    50% { opacity: 1; transform: translateX(calc(-2 * var(--width))) translateY(-50%); }
    100% { opacity: 0; transform: translateX(calc(8 * var(--width))) translateY(-50%); }
}
.img04-box-campaign-footer-text {
    font-size: calc(17 * var(--width));
    font-weight: 400;
    color: #3D3D3D;
    line-height: 1;
    text-align: center;
    padding-top: calc(8 * var(--width));
    padding-bottom: calc(3 * var(--width));
    border-bottom: 1px solid #3D3D3D;
}
.img07 {
    background: center calc(20 * var(--width)) / cover no-repeat url(../images/bg05.webp);
    padding-bottom: calc(2 * var(--width));
}
.img07-title {
    margin-bottom: calc(15 * var(--width));
}
.img07-box {
    background-color: #FFFFFF;
    width: calc(349 * var(--width));
    margin: 0 auto;
    padding-top: calc(20 * var(--width));
    padding-bottom: calc(20 * var(--width));
    margin-bottom: calc(10 * var(--width));
}
.img07-box01 {
    background: center top / cover no-repeat url(../images/step-bg01.webp);
    padding-bottom: calc(56 * var(--width));
}
.img07-box02 {
    background: center top / cover no-repeat url(../images/step-bg02.webp);
    padding-bottom: calc(30 * var(--width));
}
.img07-box-title {
    display: flex;
    justify-content: start;
    align-items: start;
    padding-left: calc(20 * var(--width));
    padding-bottom: calc(27 * var(--width));
}
.img07-box-title-img {
    width: calc(49 * var(--width));
}
.img07-box-title h3 {
    padding-left: calc(20 * var(--width));
    font-size: calc(24 * var(--width));
    font-weight: 700;
    color: #5A439A;
    line-height: 1.2;
}
.img07-box-img {
    width: calc(289 * var(--width));
    margin: 0 auto;
    padding-bottom: calc(20 * var(--width));
}
.img07-box-text {
    padding-left: calc(17 * var(--width));
    font-size: calc(15 * var(--width));
    font-weight: 400;
    color: #000000;
    line-height: 1.5;
    padding-bottom: calc(20 * var(--width));
}
.img07-box-text span {
    position: relative;
}
.img07-box-text .red {
    color: #AE0C42;
}
.img07-box-text .bold {
    font-weight: 700;
}
.img07-box02 .img07-box-text {
    line-height: 1.8;
}
.img07-box01 .img03-point-item-serif-text {
    background-image: url(../images/serif-text02.webp);
}
.img07-box02 .img03-point-item-serif-text {
    width: calc(252 * var(--width));
    padding-left: calc(10 * var(--width));
}
.img07-box-video {
    width: calc(300 * var(--width));
    margin: 0 auto;
    padding-bottom: calc(20 * var(--width));
    display: block;
}
.img07-box-video04 {
    width: calc(237 * var(--width));
    margin: 0 auto;
    padding-bottom: calc(20 * var(--width));
    display: block;
}
.img07-box-video05 {
    width: calc(243 * var(--width));
    margin: 0 auto;
    padding-bottom: calc(20 * var(--width));
    display: block;
}
.img07-box02 .img03-point-item-serif {
    padding-bottom: calc(12 * var(--width));
}
.img07-box-footer {
    padding-top: calc(10 * var(--width));
    padding-bottom: calc(20 * var(--width));
}
.img07-box-footer-title {
    font-size: calc(16 * var(--width));
    font-weight: 700;
    color: #3D3D3D;
    line-height: 1;
    text-align: center;
    padding-bottom: calc(10 * var(--width));
}
.img07-box-footer-text {
    font-size: calc(10 * var(--width));
    font-weight: 400;
    color: #3D3D3D;
    line-height: 1;
    text-align: center;
    padding-top: calc(10 * var(--width));
}
.img08 {
    background-color: #F5F4ED;
    padding-top: calc(34 * var(--width));
    padding-bottom: calc(30 * var(--width));
}
.img08-title {
    width: calc(316 * var(--width));
    margin-left: calc(18 * var(--width));
    padding-bottom: calc(21 * var(--width));
}
.img08-box-accordion {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: start;
    width: calc(355 * var(--width));
    margin: 0 auto;
}
.img08-box-accordion-item {
    background-color: #FFFFFF;
    width: 100%;
    padding-left: calc(8 * var(--width));
    padding-right: calc(8 * var(--width));
    padding-top: calc(14 * var(--width));
    box-shadow: 2px 4px 4px 0 #00000024;
    margin-bottom: calc(30 * var(--width));
}
.img08-box-accordion-item-title {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: start;
    padding-bottom: calc(10 * var(--width));
    cursor: pointer;
}
.img08-box-accordion-item-title-icon {
    font-size: calc(14 * var(--width));
    font-weight: 400;
    color: #CD1050;
    line-height: 1;
    width: calc(30 * var(--width));
    height: calc(30 * var(--width));
    border: 1px solid #CD1050;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.img08-box-accordion-item-title-text {
    font-size: calc(14 * var(--width));
    font-weight: 500;
    color: #3D3D3D;
    line-height: 1.4;
    padding-left: calc(6 * var(--width));
}
.img08-box-accordion-item-title-btn {
    position: absolute;
    top: calc(6 * var(--width));
    right: calc(6 * var(--width));
    width: calc(16 * var(--width));
    height: calc(16 * var(--width));
}
.img08-box-accordion-item-title-btn-icon01 {
    position: absolute;
}
.img08-box-accordion-item-title-btn-icon02 {
    position: absolute;
    opacity: 0;
    transition: opacity 0.3s;
}
.img08-box-accordion-item-title-btn-icon02.open {
    opacity: 1;
}
.img08-box-accordion-item-body {
    width: 100%;
    max-height: 0px;
    overflow-y: hidden;
    position: relative;
    transition: max-height 0.5s;
}
.img08-box-accordion-item-body.open {
    max-height: calc(400 * var(--width));
}
.img08-box-accordion-item-body::before {
    position: absolute;
    content: "";
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: calc(325 * var(--width));
    height: 1px;
    background-color: #3D3D3D;
}
.img08-box-accordion-item-body-wrapper {
    display: flex;
    align-items: start;
    justify-content: start;
    width: 100%;
    padding-top: calc(10 * var(--width));
    padding-bottom: calc(10 * var(--width));
}
.img08-box-accordion-item-body-wrapper-icon {
    font-size: calc(14 * var(--width));
    font-weight: 400;
    color: #FFFFFF;
    line-height: 1;
    width: calc(30 * var(--width));
    height: calc(30 * var(--width));
    background: #CD1050;
    border: 1px solid #CD1050;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.img08-box-accordion-item-body-wrapper-text {
    width: calc(305 * var(--width));
    font-size: calc(14 * var(--width));
    font-weight: 400;
    color: #3D3D3D;
    line-height: 1.5;
    padding-left: calc(6 * var(--width));
}
.img08-box-accordion-item-body-wrapper-text .red {
    color: #AE0C42;
}
.img08-box-accordion-item-body-wrapper-text a {
    color: #0000EE;
    font-weight: 700;
}
.img08-box-accordion-item-body-wrapper-text .small {
    font-size: calc(7 * var(--width));
}
.img09 {
    position: relative;
    z-index: 1;
    padding-bottom: calc(10 * var(--width));
}
.img09::before {
    position: absolute;
    content: "";
    top: calc(20 * var(--width));
    bottom: 0;
    width: 100%;
    background: #AE0C42;
    z-index: -1;
}
.img09-title {
    margin-top: calc(-18 * var(--width));
}
.img09-box-arrow {
    position: absolute;
    top: 98.5%;
    left: 50%;
    transform: translateX(-50%);
    width: calc(30 * var(--width));
}
.img09-box02 {
    width: calc(355 * var(--width));
    margin: 0 auto;
    padding-top: calc(30 * var(--width));
    padding-bottom: calc(15 * var(--width));
    background-color: #E9E9E9;
}
.img09-box02-item {
    background-color: #FFFFFF;
    width: calc(320 * var(--width));
    height: calc(64 * var(--width));
    margin: 0 auto calc(15 * var(--width));
    display: flex;
    align-items: center;
    justify-content: start;
}
.img09-box02-item-title {
    background-color: #3D3D3D;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-bottom: calc(10 * var(--width));
    height: 100%;
    width: calc(39 * var(--width));
}
.img09-box02-item-title-point {
    font-size: calc(6 * var(--width));
    font-weight: 400;
    color: #FFFFFF;
    line-height: 1;
}
.img09-box02-item-title-number {
    font-size: calc(23 * var(--width));
    font-weight: 400;
    color: #FFFFFF;
    line-height: 1;
}
.img09-box02-item-body {
    padding-left: calc(12 * var(--width));
}
.img09-box02-item-body-text {
    color: #BF4555;
    font-size: calc(14 * var(--width));
    font-weight: 700;
    line-height: 1.5;
}
.img09-box02-item-body-text .large {
    font-size: calc(18 * var(--width));
}
.img09-box02-item-body-text .marker {
    background: linear-gradient(transparent 80%, #FFEC40 80%);
}
.img09-box02-item-body-text .small {
    font-size: calc(7 * var(--width));
}
.img09-box02-item-body-text .plus {
    padding: 0 calc(5 * var(--width));
}
.img09-box02-item-body-text-small {
    font-size: calc(12 * var(--width));
    font-weight: 700;
    color: #BF4555;
    line-height: 1;
    text-align: right;
}
.img09-box02-item-body-text-small .small {
    font-size: calc(10 * var(--width));
}
.img09-box03 {
    width: calc(355 * var(--width));
    margin: 0 auto;
    background-color: #FFFFFF;
}
.img09-box03-note {
    font-size: calc(6 * var(--width));
    font-weight: 500;
    color: #3D3D3D;
    line-height: 1.5;
    padding-left: calc(88 * var(--width));
    padding-bottom: calc(27 * var(--width));
}
.footer-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: start;
    width: calc(355 * var(--width));
    margin: 0 auto;
    padding-top: calc(16 * var(--width));
    padding-bottom: calc(16 * var(--width));
}
.footer-box-text {
    font-size: calc(8 * var(--width));
    font-weight: 500;
    color: #3D3D3D;
    line-height: 1;
    text-align: center;
    padding-bottom: calc(8 * var(--width));
}
.footer-box-link {
    font-size: calc(12 * var(--width));
    font-weight: 500;
    color: #3D3D3D;
    line-height: 1;
}