/* mobile menu */
#mobileMenu { position: sticky; bottom: 0; left: 0; width: 100%; z-index: 99; }

#mobileMenu .menu-box { border-radius: 3rem 3rem 0 0; overflow: hidden; box-shadow: 0 0 2rem rgba(0, 0, 0, .5); }
#mobileMenu .menu-box .d-flex { display: flex; }
#mobileMenu .menu-box a { display: block; width: 100%; padding: 4rem 2rem; font-size: 3.6rem; font-weight: 700; text-align: center; }
#mobileMenu .menu-box a > img { font-size: inherit; height: 1.7em; }
#mobileMenu .menu-box a > p { margin-top: .5em; }
#mobileMenu .menu-box a.inquiry-btn { background-color: #444444; color: #fff; }
#mobileMenu .menu-box a.mycar-btn { background-color: var(--main-color); color: #fff; }


/* section01 */
#main #section01 .text-box { text-align: center; padding: 10rem 0 7rem; }
#main #section01 .text-box h2 { font-size: 6.6rem; font-weight: 800; }
#main #section01 .text-box h3 { font-size: 7rem; }
#main #section01 .text-box h3 > b { font-weight: 600; color: var(--main-color); }
#main #section01 .text-box p { font-size: 3.4rem; font-weight: 500; color: #777e86; line-height: 1.4; margin-top: 6rem; }
#main #section01 .text-box p > span { color: #000; text-decoration: underline; text-underline-offset: .2em; }
#main #section01 .text-box p > b { font-weight: 700; color: var(--main-color); }


/* section02 */
#main #section02 { background-color: var(--main-color); padding: 6rem 0 8rem; }

#main #section02 .d-flex { display: flex; justify-content: space-around; }
#main #section02 .flex-item { text-align: center; }
#main #section02 .flex-item h5 { font-size: 3.4rem; font-weight: 500; color: #d5faff; }
#main #section02 .flex-item p { font-size: 4.4rem; font-weight: 600; color: #fffecb; }

#main #section02 h4 { font-size: 9rem; font-weight: 700; color: #fff; text-align: center; margin-top: 5rem; }


/* section03 */
#main #section03 { padding: 12rem 0 6rem; }

#main #section03 .img-box { text-align: center; }
#main #section03 .img-box img { width: 80%; }


/* section04 */
#main #section04 { padding: 2rem 0; }

#main #section04 .form-box { border: 1px solid #9bafc7; border-radius: 2rem; overflow: hidden; }
#main #section04 .form-box .form-header { background-color: #eef4fb; }
#main #section04 .form-box .form-header h4 { font-size: 3.6rem; font-weight: 600; color: var(--main-color); padding: 3rem 0; text-align: center; }

#main #section04 .form-box .form-body { padding: 4.5rem 3rem; }
#main #section04 .form-box .form-body table tbody th { font-size: 3rem; font-weight: 500; color: #333333; }
#main #section04 .form-box .form-body table tbody th:nth-of-type(n + 2) { padding-left: 3rem }
#main #section04 .form-box .form-body table tbody td { padding: 1.5rem 2rem; }
#main #section04 .form-box .form-body table tbody td input { border: 2px solid #9d9d9d; border-radius: .5rem; width: 100%; font-size: 3rem; padding: 2rem 1rem; }

#main #section04 .agree-box { text-align: center; padding: 2rem 0; }
#main #section04 .agree-box a { display: inline-block; padding: 0 0.2em; margin: 0 1rem; font-size: 2.4rem; font-weight: 500; color: #888888; text-decoration: underline; text-underline-offset: .3em; vertical-align: middle; }
#main #section04 .agree-box input[type=radio] { vertical-align: middle; margin-left: 3rem; }
#main #section04 .agree-box input[type=radio] { width: 3.4rem; height: 3.4rem; vertical-align: middle; background-color: #fff; background-repeat: no-repeat; background-position: center; background-size: contain; border: 1px solid #D3CFC8; appearance: none; print-color-adjust: exact; cursor: pointer; }
#main #section04 .agree-box input[type=radio] { border-radius: 50%; }

#main #section04 .agree-box input[type=radio]:hover { border-width: 2px; border-color: var(--main-color); }
#main #section04 .agree-box input[type=radio]:active { filter: brightness(90%) }
#main #section04 .agree-box input[type=radio]:checked { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 10l3 3l6-6'/%3e%3c/svg%3e") }
#main #section04 .agree-box input[type=radio]:disabled { background-color: #eceef1; pointer-events: none; filter: none; opacity: .5; }
#main #section04 .agree-box input[type=radio]:checked{ background-color: var(--main-color); border-color: var(--main-color); }
#main #section04 .agree-box input[type=radio]:disabled+label { cursor: default; opacity: .5 }
#main #section04 .agree-box input[type=radio]+label { font-size: 3.4rem; font-weight: 500; color: #474747; vertical-align: middle; margin-left: .5rem; cursor: pointer; }

#main #section04 .button-box { padding: 2rem 0; text-align: center; }
#main #section04 .button-box button { background-color: var(--main-color); color: #fff; font-size: 3.6rem; font-weight: 700; width: 75%; padding: 3.5rem 0; border-radius: 1rem; }


/* section05 */
#main #section05 { padding: 2rem 0; }

#main #section05 .content-box { border: 1px solid #9bafc7; border-radius: 2rem; overflow: hidden; padding: 5rem; }

#main #section05 .d-flex { display: flex; align-items: center; }
#main #section05 .d-flex .left-box { flex: 1 0 1; }
#main #section05 .d-flex .left-box p { font-size: 3.8rem; font-weight: 600; color: #302f2f; }
#main #section05 .d-flex .left-box p > b { font-size: 2.8rem; font-weight: 700; color: var(--main-color); }
#main #section05 .d-flex .left-box p > img { font-size: inherit; height: 1.8em; }
#main #section05 .d-flex .left-box p > strong { font-weight: 700; color: #1b1b1b; }
#main #section05 .d-flex .left-box p > * { vertical-align:sub; }
#main #section05 .d-flex .right-box { flex: 1 0 0; margin-left: 5rem; }
#main #section05 .d-flex .right-box img { width: 100%; }


/* section06 */
#main #section06 { padding: 2rem 0; }

#main #section06 .content-box { border: 1px solid #9bafc7; border-radius: 2rem; overflow: hidden; padding: 5rem; }

#main #section06 .img-box { text-align: center; }
#main #section06 .img-box img { width: 70%; }

#main #section06 .info-list ul > li { font-size: 4.2rem; font-weight: 500; color: #3f3e3e; background: url(../img/main/icon_listcheck.png) no-repeat left center/1.5em auto; padding: .25em 0; padding-left: 1.8em; }
#main #section06 .info-list ul > li span { font-weight: 700; color: #000; }

#main #section06 .info-table { margin-top: 10rem; }
#main #section06 .info-table table tbody th { background-color: #eef4f9; padding: 1rem 2rem; font-size: 3.2rem; height: 2.5em; font-weight: 500; color: #494949; border-top: 2px solid #dfdfdf; border-bottom: 2px solid #dfdfdf; border-right: 2px solid #dfdfdf; }
#main #section06 .info-table table tbody td { padding: 1rem 2rem; height: 2.5em;  font-size: 3.2rem; font-weight: 500; color: #757575; border-top: 2px solid #dfdfdf; border-bottom: 2px solid #dfdfdf; }
#main #section06 .info-table table tbody td > span { display: inline-block; background-color: #fed23e; padding: .2em; font-size: 3.4rem; font-weight: 800; color: #000; }
#main #section06 .info-table table tbody td > b { font-size: 4.2rem; font-weight: 700; color: var(--main-color); }

#main #section06 .checkpoint-box { margin-top: 10rem; }
#main #section06 .checkpoint-box .checkpoint-header h4 { font-size: 5rem; font-weight: 700; color: #000; background: url(../img/main/section06_img02.png) no-repeat left center/3em auto; padding: 1em 0 1em 4em; line-height: 1.4; }
#main #section06 .checkpoint-box .checkpoint-header h4 > span { color: var(--main-color); text-decoration: underline; text-underline-offset: .2em; }
#main #section06 .checkpoint-box .checkpoint-list { padding: 9rem 2rem; border: 2px solid #000; border-radius: 1rem; background-color: #f8f8f8; }
#main #section06 .checkpoint-box .checkpoint-list ul > li ~ li { margin-top: 5rem; }
#main #section06 .checkpoint-box .checkpoint-list ul > li p.question { font-size: 4rem; font-weight: 700; color: #000; text-indent: -.35em; margin-left: .7em; line-height: 1.3; }
#main #section06 .checkpoint-box .checkpoint-list ul > li p.question::before { content: '*'; display: inline-block; vertical-align: middle; margin-right: .15em; }
#main #section06 .checkpoint-box .checkpoint-list ul > li p.answer { font-size: 3.3rem; font-weight: 500; color: #727272; margin-left: .7em; margin-top: .2em; line-height: 1.3; }


/* section07 */
#main #section07 { padding: 2rem 0; }

#main #section07 .content-box { border: 1px solid #9bafc7; border-radius: 2rem; overflow: hidden; padding: 7rem 8rem; background-color: #f8f8f8; }

#main #section07 .content-box .content-header h3 { font-size: 5rem; font-weight: 700; color: #000; text-align: center; }
#main #section07 .content-box .content-header h3 > b { font-weight: inherit; color: var(--main-color); }

#main #section07 .content-box .content-body { position: relative; margin-top: 5rem; }
#main #section07 .content-box .content-body #reviewSlide { margin: 3rem -.5% 0 -.5%; }
#main #section07 .content-box .content-body #reviewSlide .swiper-slide { width: calc(100% / 2 - 1%); height: auto; margin: 0 .5%; border: 2px solid #9f9f9f; border-radius: 2rem; overflow: hidden; box-sizing: border-box; }
#main #section07 .content-box .content-body #reviewSlide .swiper-slide .item-box { width: 100%; height: 100%; background-color: #fff; }
#main #section07 .content-box .content-body #reviewSlide .swiper-slide figure.img-box { position: relative; padding-bottom: 80%; }
#main #section07 .content-box .content-body #reviewSlide .swiper-slide figure.img-box > img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
#main #section07 .content-box .content-body #reviewSlide .swiper-slide figcaption.text-box { padding: 3rem 1rem 4rem; text-align: center; }
#main #section07 .content-box .content-body #reviewSlide .swiper-slide figcaption.text-box p.name { font-size: 2.4rem; font-weight: 500; color: #999999; line-height: 1.4; }
#main #section07 .content-box .content-body #reviewSlide .swiper-slide figcaption.text-box p.subject { font-size: 2.6rem; font-weight: 700; color: #2d2d2d; margin-top: 2.5rem; line-height: 1.4; }
#main #section07 .content-box .content-body #reviewSlide .swiper-slide figcaption.text-box p.review { font-size: 2.4rem; font-weight: 500; color: #666666; margin-top: 1rem; line-height: 1.4; }
#main #section07 .content-box .content-body .swiper-button-custom { position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; width: 4rem; cursor: pointer; }
#main #section07 .content-box .content-body .swiper-button-custom img { width: 100%; }
#main #section07 .content-box .content-body .swiper-button-custom-next { left: calc(100% + 2rem); }
#main #section07 .content-box .content-body .swiper-button-custom-prev { right: calc(100% + 2rem); }

@media screen and (max-width: 640px) {
    #main #section07 .content-box .content-body #reviewSlide .swiper-slide { width: calc(100% / 1 - 1%); }
}


/* section08 */
#main #section08 { padding: 2rem 0 8rem; }

#main #section08 .content-box { background-color: #444444; border-radius: 2rem; }
#main #section08 .content-box > a { display: block; padding: 7rem 6rem; }
#main #section08 .content-box .d-flex { display: flex; justify-content: space-evenly; align-items: center; gap: 4rem; }
#main #section08 .content-box .left-box { flex: 1 0 0; max-width: 23%; }
#main #section08 .content-box .left-box img { width: 100%; }
#main #section08 .content-box .right-box { flex: 1 0 1; }
#main #section08 .content-box .right-box p { font-size: 6rem; font-weight: 700; color: #fff; text-align: center; }
#main #section08 .content-box .right-box p > b { font-size: 8rem; font-weight: 700; color: #ffea00; }