@charset "utf-8";

sup { line-height: 1; font-size: 0.65em; }
.tac { text-align: center; }
.page-note--komenum { padding-left: 2em; text-indent: -2em; }

.sct-l2 + .sct-l2 { margin-top: 80px; }

.sct-note { margin-top: 60px; padding: 30px; }
.sct-note.acco { padding: 0; }
.based .sct-note { background: #f9f3d9; }
.use .sct-note { background: #daf7d5; }
.saving .sct-note { background: #d3eff7; }
.based .sct-note.acco { border-top: 2px solid #f0c940; border-bottom: 2px solid #f0c940; }
.sct-note__label { text-align: center; font-weight: 700; font-size: 2.4rem; line-height: 1.31; margin-bottom: 15px; }
.use .sct-note__label { color: #2ba02e; }
.saving .sct-note__label { color: #23a4c9; }
.sct-note2 { background: #f4eed4; padding: 30px; margin-top: 30px; }
.sct-note__cap { margin-top: 15px; font-size: 1.3rem; line-height: 1.5; text-indent: -1em; padding-left: 1em; }
.sct-list { margin: 15px auto; }
.sct-item { position: relative; padding-left: 1em; line-height: 1.5; font-size: 1.6rem; }
.sct-item::before { position: absolute; content: ""; }
.sct-item:nth-child(n+2) { margin-top: 5px; }
.based .sct-item::before { background: #da7e25; }
.sct-item--minball { font-weight: 700; }
.sct-item--minball::before { inset: .55em auto auto .25em; border-radius: 100%; width: 0.4em; height: 0.4em; }
.sct-acco__title { position: relative; padding: 20px; text-align: center; font-size: 2.4rem; font-weight: 700; }
.sct-acco__title::after { position: absolute; content: ""; inset: 0 20px 0 auto; margin: auto 0; width: 20px; height: 4px; background: #000; }
.acco-wrap { padding: 0 clamp(20px,calc(3.43vw + -7px),30px); }
.acco-inner { margin-bottom: 20px; display: flex; flex-wrap: wrap; gap: 20px 30px; margin-top: 20px; }
.acco-ex { flex: 1; }
.sct-txt__label { position: relative; font-weight: 700; margin-bottom: 10px; line-height: 1.5; font-size: 1.8rem; }
.sct-txt__label--ball { padding-left: 1em; }
.sct-txt__label--ball::before { position: absolute; content: ""; inset: .55em auto auto .25em; border-radius: 100%; width: 0.4em; height: 0.4em; }
.saving .sct-txt__label--ball::before { background: #23a4c9; }
.sct-txt__item { position: relative; padding-left: 20px; font-size: 1.6rem; }
.sct-txt__item--star::before { position: absolute; content: "★"; inset: .25em auto auto 0; line-height: 1; }
.based .sct-txt__item--star::before { color: #d37f25; }
.sct-txt__item:nth-child(n+2) { margin-top: 10px; }

.sct-aside { background: #ffe5ec; padding: 30px; }
.sct-aside__label { text-align: center; color: #fa4e9e; font-size: 2.8rem; line-height: 1.5; }
.sct-aside__wrap { display: flex; flex-wrap: wrap; margin-top: 20px; gap: 20px 40px; }
.sct-aside__ex { flex: 1; }
.sct-aside__img { max-width: 320px; width: 100%; margin-inline-start: auto; margin-inline-end: auto; }
.sct-aside__btn { max-width: 350px; margin: 30px auto 0; font-size: 1.8rem; }

.sct-aside.color2 { background: #dbfaff; }
.sct-aside__label.color2 { color: #30b2ea; }



@media (max-width: 767px) {
   .tac { text-align: left; }
   .sct-note { margin-top: 30px; padding: 20px 15px; }
   .sct-note__label { text-align: left; font-size: 1.8rem; }
   .sct-note2 { padding: 20px 15px; }
   .acco-ex { flex: 0 1 auto; order: 1; }
   
   .sct-txt__label { font-size: 1.6rem; }
   .sct-aside { padding: 20px 15px; }
   .sct-aside__label { font-size: 2rem; text-align: left; }
   .sct-aside__ex { flex: 0 1 auto; }
}


.btn-iij { position: relative; padding: 0.75em 45px 0.75em 45px; text-align: center; border-radius: 50px; color: #fff; font-weight: 700; background: #f075bb; display: block; margin-top: 10px; }
.btn-iij::after { position: absolute; content: ""; inset: 0 .75em 0 auto; margin: auto 0; width: 0; height: 0; border-style: solid; border-width: .33em 0 .33em .58em; border-color: transparent transparent transparent #fff; }






.visual-part { max-width: 760px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 20px 30px; padding: 0 15px; }
.visual-part__item { inline-size: calc((100% - 30px) / 2); }



.sct-head { display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 50px; }
.sct-head--based { background: #f0c940; }
.sct-head--use { background: #5fc24e; }
.sct-head--saving { background: #36aed1; }
.sct-head__acce--based { width: 270px; }
.sct-head__acce--use { width: 210px; }
.sct-head__acce--saving { width: 210px; }
.sct-head__ex { flex: 1; }
.sct-head__ex--based { padding: 10px 25px; }
.sct-head__ex--use { text-align: center; padding: 5px 10px; }
.sct-head__ex--saving { text-align: center; padding: 5px 10px; }
.sct-head__label { font-weight: 700; color: #fff; font-size: clamp(2.2rem,calc(2.42vw + 15px),3.6rem); line-height: 1.31; }
.sct-head__copy { font-weight: 700; font-size: clamp(1.7rem,calc(1.72vw + 4px),2.2rem); line-height: 1.61; margin-top: 10px; }
.sct-head__batch { background: #fff; padding: 3px 20px; border-radius: 20px; border: 2px solid #000; display: inline-block; font-weight: 700; line-height: 1; margin-bottom: 5px; }


.sct1-fuki { max-width: 730px; margin: 0 auto; gap: 25px 15px; display: flex; flex-wrap: wrap; align-items: flex-start; }
.sct1-fuki__ex { position: relative; flex: 1; }
.sct1-fuki__ex::after { position: absolute; content: ""; inset: 0 -19px 0 auto; margin: auto 0; aspect-ratio: 68/20; width: 34px; background: url(../images/img_sct1_fuki_acce.webp) no-repeat center/contain; }
.sct1-fuki__prof { width: 200px; }
.sct1-fuki__prof-img { width: 140px; margin-inline-start: auto; margin-inline-end: auto; }
.sct1-fuki__prof { text-align: center; }
.sct1-fuki__prof-label { font-size: 1.4rem; margin-top: 10px; }
.sct1-fuki__prof-name { font-size: 1.4rem; margin-top: 5px; }
.sct1-fuki__prof-name span { font-size: 2.0rem; font-weight: 700; margin-left: 10px; }

.sct1-head { display: flex; flex-wrap: wrap; gap: 0 30px; align-items: flex-end; border-bottom: 2px solid #da7e25; margin-bottom: 40px; }
.sct1-head__img { width: 130px; }
.sct1-head__txt { flex: 1; max-width: 410px; margin-bottom: 20px; }
.sct1-img { max-width: 320px; inline-size: 100%; margin-inline-start: auto; margin-inline-end: auto; }
.sct1-img__item:nth-child(n+2) { margin-top: 40px; }
.sct1-see__year-item { display: flex; gap: 0 20px; line-height: 1.5; font-size: 1.8rem; }
.sct1-see__year-item:nth-child(n+2) { margin-top: 5px; }
.sct1-see__year-item span { font-weight: 700; color: #da7e25; }
.sct1-see__year-item span.normal { font-weight: 500; color: #000; }
.sct1-see__img { max-width: 350px; width: 100%; font-size: 1.8rem; margin-inline-start: auto; margin-inline-end: auto; }

.sct-q { position: relative; border-bottom: 2px solid #2ba02e; padding-top: 10px; padding-bottom: 15px; padding-left: 65px; color: #2ba02e; font-size: 2.6rem; line-height: 1.5; font-weight: 700; }
.sct-q::before { position: absolute; content: ""; inset: 0 auto auto 0; background: url(../images/icon_q.webp) no-repeat center/contain; aspect-ratio: 112/100; height: 50px; }

.sct-fuki { display: block; margin: 40px auto; max-width: 700px; }
.sct-fuki_sp { display: none; }
.sct2-2__img { margin-top: -20px; }
.sct2-2__img2 { margin-top: 15px; }
.sct3-1__note-copy { max-width: 366px; margin: -10px auto 20px; }
.sct3-1__1__note-img__btn { margin: 30px auto 0; max-width: 350px; font-size: 1.8rem; }
.sct3-1__note-img { background: #fff; margin: 30px auto; }
.sct3-1__note-img__area { margin: 0 auto; max-width: 500px; }
.sct3-1__note-img__btn { margin: 30px auto 0; max-width: 350px; font-size: 1.8rem; }
.sct3-1__img { display: flex; flex-wrap: wrap; gap: 20px 30px; margin-top: 40px; }
.sct3-1__img-item { inline-size: calc((100% - 30px) / 2); background: #d3eff7; }
.sct3-1__img-label { text-align: center; font-weight: 700; color: #23a4c9; font-size: 2.2rem; line-height: 1.5; padding: 12px 10px; }
.sct3-1__img-ex { padding: 15px 30px 25px; font-size: 1.3rem; }
.sct3-1__img-cap { margin-bottom: 15px; }
.sct3-1__img-btn { position: relative; padding: 0.75em 45px 0.75em 45px; text-align: center; border-radius: 50px; color: #fff; font-weight: 700; background: #23a4c9; display: block; font-size: 1.8rem; }
.sct3-1__img-btn + .sct3-1__img-btn { margin-top: 10px; }
.sct3-1__img-btn::after { position: absolute; content: ""; inset: 0 .75em 0 auto; margin: auto 0; width: 0; height: 0; border-style: solid; border-width: .33em 0 .33em .58em; border-color: transparent transparent transparent #fff; }
.sct3-1__img2 { margin-top: -20px; }


@media (max-width: 767px) {
   .visual-part { max-width: 450px; }
   .visual-part__item { inline-size: 100%; }
   .sct-head__ex { order: 1; flex: 0 1 auto; padding: 15px; }
   .sct-head__acce--based { order: 2; background: #f9f3d9; text-align: center; width: 100%; }
   .sct-head__acce--based img { width: 210px; }
   .sct-head__acce--use { width: 50%; order: 2; }
   .sct-head__acce--saving { width: 50%; order: 2; }
   .sct1-fuki { margin-bottom: 40px; }
   .sct1-fuki__ex { flex: 0 1 auto; order: 2; }
   .sct1-fuki__ex::after { inset: -8px 0 auto 0; margin: 0 auto; aspect-ratio: 68/20; width: 34px; transform: rotate(-90deg); }
   .sct1-fuki__prof {margin: 0 auto; }
   
   .sct1-head { gap: 0 15px; }
   .sct1-head__img { width: 90px; }
   .sct1-see__img { order: 2; }
   .sct1-see__year-item { font-size: 1.5rem; }
   .sct-q { padding-top: 0px; padding-bottom: 15px; padding-left: 40px; font-size: 1.8rem; }
   .sct-q::before { height: 30px; }
   
   .sct-fuki { display: none; }
   .sct-fuki_sp { display: block; margin: 30px auto; }
   .sct2-2__img { margin-top: 10px; }
   .sct2-2__img2 { margin-top: 10px; }
   .sct3-1__note-copy { margin: 10px auto }
   .sct3-1__1__note-img__btn { margin: 20px auto 0; font-size: 1.5rem; }
   .sct3-1__note-img__btn { margin: 20px auto 0; font-size: 1.5rem; }
   .sct3-1__img { margin-top: 30px; }
   .sct3-1__img-item { inline-size: 100%; }
   .sct3-1__img-label { font-size: 1.8rem; padding: 10px; }
   .sct3-1__img-ex { padding: 10px 15px 15px; }
   .sct3-1__img-cap { margin-bottom: 10px; }
   .sct3-1__img-btn { font-size: 1.5rem; }
   .sct3-1__img2 { margin-top: 10px; }
}
.kakomiArea3 .kakomiFrame { padding: 0px 40px 40px; }
.outlineFrame { margin-top: 60px; }

@media (max-width: 767px) {
   .kakomiArea3 .kakomiFrame { padding: 0px 15px 40px; }
}