/* 메인*/
.main-sect {overflow: hidden;}
.main-swiper {overflow: visible;}
.main-swiper .swiper-wrapper {height: inherit;}
.main-swiper .swiper-wrapper .swiper-slide {overflow: hidden; background-color: #f0f0f0; border-radius: 12px;}
.main-sect .swiper .pagination {right: calc(10px + 5.357%);}


/* title */
.comm-sect {padding:30px 0;}
.comm-sect + .comm-sect {margin-top:0;}
.comm-sect .head {display: flex; align-items: flex-end; padding-bottom:22px; }
.comm-sect .head .title {flex: 1; font-size:22px; font-weight:700; letter-spacing:-.035em; text-align:left; line-height: 1.4; color:var(--font-color1); word-break:keep-all;}
.comm-sect .btn-more {position:relative; flex:none; padding-bottom:5px; font-size:13.5px; font-weight:400; color:var(--font-color3);}
.comm-sect .btn-more::after {content:""; display:inline-block; width:7px; height:7px; margin-left:3px; border-top:1px solid var(--font-color3); border-right:1px solid var(--font-color3); transform: rotate(45deg);}


/* 퀵메뉴 */
.quick-sect {padding: 8px 0 18px;}
.quick-wrap {display: flex; justify-content: center; align-items: flex-start; padding: 18px 6px 15px; border-radius: 18px;}
.quick-wrap .quick-slide a {display: flex; justify-content: center; flex-wrap: wrap;}
.quick-wrap .quick-slide .thumb {display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; background-color: var(--color-main-bg);}
.quick-wrap .quick-slide .thumb img {width: 26px; height: 26px;}
.quick-wrap .quick-slide .name {width: 100%; min-height: 2.8em; padding-top: 8px; text-align: center; font-size: 12.5px; font-weight: 500; line-height: 1.4; color: var(--font-color2); word-break: keep-all;}
.quick-wrap.quick-menu4 .quick-slide {flex: 1; width: auto;}

#main .plan-sect .tab-list {padding:4px; gap:4px; background-color:var(--color-gray-brighter1); border-radius:14px;}
#main .plan-sect .tab-list li {flex:1; width:auto; height:auto;}
#main .plan-sect .tab-list li::before {display:none;}
#main .plan-sect .tab-list li a {display:block; width:100%; height:auto; margin:0 auto; text-align:center;}
#main .plan-sect .tab-list li.active a::before {display:none;}
#main .plan-sect .tab-list li a > span {display:flex; align-items:center; justify-content:center; height:36px; padding:0 8px; text-align:center; font-size:14.5px; font-weight:600; background-color:transparent; color:var(--font-color3); border:0; border-radius:10px;}
#main .plan-sect .tab-list li.active a > span {background-color:var(--color-white); color:var(--font-color1); box-shadow:0 1px 3px rgba(0, 0, 0, .12);}

/* 요금제 */
.plan-swiper {margin-bottom: 0;}
.planSwiper .swiper-slide {display: block;}

.planSwiper .swiper-btn {display: flex; align-items: center; justify-content: center; width: 100%; margin-top: 10px;}
.planSwiper .swiper-btn .page-text {padding-right: 6px; color: var(--text-secondary); font-size: 15px; font-weight: 400;}
.planSwiper .swiper-btn .page-text .point {color: var(--color-main); font-weight: 600;}
.planSwiper .swiper-btn .swiper-pagination {bottom:inherit; width: auto; position: relative; text-align: inherit; color: var(--font-color3);}
.planSwiper .swiper-btn .swiper-pagination-current {font-weight: 600; color: var(--color-black);}

.planSwiper .swiper-button-next, 
.planSwiper .swiper-button-prev {display: flex;align-items: center;justify-content: center;margin: 0;position: relative;top: inherit;left: inherit;right: inherit;width:44px; height: 44px;background-color: #fff;border: 1px solid var(--color-gray-light); border-radius:8px;background-image:none;background-size: auto;}
.planSwiper .swiper-btn .swiper-button-prev {margin-right: 16px;}
.planSwiper .swiper-btn .swiper-button-next {margin-left: 16px;}
.planSwiper .swiper-button-next::after,
.planSwiper .swiper-button-prev::after {content:""; display: block; position:absolute; top:50%; width:6px; height:6px; font-size: 0; border:1px solid; border-width:2px 0 0 2px; color: var(--color-black);}
.planSwiper .swiper-button-prev::after {left:50%; transform:translate(-35%, -50%) rotate(-45deg);}
.planSwiper .swiper-button-next::after {right:50%; transform:translate(35%, -50%) rotate(135deg);}
.planSwiper .swiper-pagination {width: 100%; bottom: 8px; font-size: 16px;}

/* 고객 후기 */
.review-wrapper {padding: 0 0 10px 0;}
.review-card {overflow: hidden; flex-wrap: wrap; background-color: var(--color-white); border: 1px solid var(--color-gray-light); border-radius:18px; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .06);}
.review-card .stars {display: flex; align-items: center; padding: 16px 20px 12px;}
.review-card .stars .best {display: inline-block; margin-right: 8px; padding: 3px 9px; font-weight: 700; font-size: 11.5px; color: var(--color-lifetime); background-color: var(--color-lifetime-bg); border-radius: 20px;}
.review-card .stars .icon-star {display: inline-block; width:16px; height: 16px; font-size: 0; background: url(../img/icon/icon-star.png) no-repeat;}
.review-card .content {overflow: hidden; width: 100%; text-align: left;}
.review-card .content .bg-img {width: 100%;}
.review-card .content .badge-list {display: flex; flex-wrap: wrap; gap: 6px; padding: 16px 20px 12px;}
.review-card .content .badge-list li {display: inline-block; height: 24px; line-height: 24px; padding: 0 12px; font-weight: 500; font-size: 13px; letter-spacing: 0; background-color: var(--color-review-bg); color: var(--color-review); border-radius: 20px;}
.review-card .content .text {padding: 0 20px 20px; font-size: 15px; color: var(--font-color1); font-weight: 400; word-break: keep-all; overflow-wrap: break-word; line-height: 1.5; }

.review-swiper {margin-bottom: 0; padding: 0 30px;}
.review-swiper .swiper-slide-visible {opacity: 1; z-index: 1;}
.review-swiper .swiper-slide-prev,
.review-swiper .swiper-slide-next {opacity: 0.7; filter: blur(0); box-shadow: none; z-index: 0;}
.review-swiper .swiper-slide-prev {top:50%; transform: scale(0.85) translate(15%, -60%);}
.review-swiper .swiper-slide-next {top:50%; transform: scale(0.85) translate(-15%, -60%);}
.review-swiper.swiper-type-def .swiper-btn .swiper-button-next {right: 20px;}
.review-swiper.swiper-type-def .swiper-btn .swiper-button-prev {left: 20px;}
.review-swiper .swiper-slide-prev .stars,
.review-swiper .swiper-slide-prev .badge-list,
.review-swiper .swiper-slide-prev .text,
.review-swiper .swiper-slide-next .stars,
.review-swiper .swiper-slide-next .badge-list,
.review-swiper .swiper-slide-next .text {display: none;}
.review-swiper .swiper-btn .swiper-button-next, 
.review-swiper .swiper-btn .swiper-button-prev {display: flex; align-items: center; justify-content: center; margin: 0; position: absolute; top: 50%; left: inherit; right: inherit; width: 36px; height: 36px; background-color:var(--color-white); transform: translate(0, -50%); border: 1px solid var(--color-gray-light); border-radius:50%; background-image:none; background-size: auto;}
.review-swiper .swiper-btn .swiper-button-next {right: 10px;}
.review-swiper .swiper-btn .swiper-button-prev {left: 10px;}
.review-swiper .swiper-btn .swiper-button-next::after,
.review-swiper .swiper-btn .swiper-button-prev::after {content:""; display: block; position:absolute; top:50%; width:8px; height:8px; font-size: 0; border:1px solid; border-width:2px 0 0 2px; color: var(--color-black);}
.review-swiper .swiper-btn .swiper-button-next::after {right:50%; transform:translate(35%, -50%) rotate(135deg);}
.review-swiper .swiper-btn .swiper-button-prev::after {left:50%; transform:translate(-35%, -50%) rotate(-45deg);}
.review-swiper .swiper-btn .swiper-pagination {margin-top: 15px;}

.point-sect .point-list .point {position: relative; padding: 22px 20px 24px; background-color: var(--color-white); border: 1px solid var(--color-gray-light); border-radius: 18px; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .06);}
.point-sect .point-list .point + .point {margin-top: 12px;}
.point-sect .point-list .point01 {background-color: var(--color-white)}
.point-sect .point-list .point02 {background-color: var(--color-white)}
.point-sect .point-list .point03 {background-color: var(--color-white)}
.point-sect .point-list .title {display: inline; padding: 3px 7px; margin-left: -7px; font-size: 17px; font-weight: 700; letter-spacing: -.03em; line-height: 1.95; border-radius: 7px; -webkit-box-decoration-break: clone; box-decoration-break: clone;}
.point-sect .point-list .point01 .title {background-color: var(--bg-point1);}
.point-sect .point-list .point02 .title {background-color: var(--bg-point2);}
.point-sect .point-list .point03 .title {background-color: var(--bg-point3);}
.point-sect .point-list .desc {display: flex; align-items: start; gap: 12px; padding-top: 10px;}
.point-sect .point-list .desc .text {flex: 1; font-size: 14.5px; line-height: 1.65; color: var(--font-color2); word-break: normal;}
.point-sect .point-list .desc .bg-img {flex: none; width: 86px; height: 86px;}
.point-sect .point-list .point01 .desc .bg-img {filter: drop-shadow(0 9px 11px rgba(96, 150, 205, .32));}
.point-sect .point-list .point02 .desc .bg-img {filter: drop-shadow(0 9px 11px rgba(140, 175, 60, .30));}
.point-sect .point-list .point03 .desc .bg-img {filter: drop-shadow(0 9px 11px rgba(205, 110, 180, .30));}

@media (max-width: 390px) {
    /* title */
    .comm-sect .head {padding-bottom:5.6410vw;}
    .comm-sect .head .title {font-size:5.6410vw;}
    .comm-sect .btn-more {padding-bottom:1.2821vw; font-size:3.4615vw;}

    /* 요금제 탭 */
    #main .plan-sect .tab-list {padding:1.0256vw; gap:1.0256vw; border-radius:3.5897vw;}
    #main .plan-sect .tab-list li a > span {height:9.2308vw; padding:0 2.0513vw; font-size:3.7179vw; border-radius:2.5641vw;}
    #main .plan-sect .tab-list li.active a > span {box-shadow:0 0.2564vw 0.7692vw rgba(0, 0, 0, .12);}
}

@media (min-width: 480px) {
    /* title */
    .comm-sect .head .title {font-size:24px;}
}

@media (min-width: 520px) {
    /* 메인*/

    /* title */
    .comm-sect .head .title {font-size:26px;}

    /* 퀵메뉴 */
    .quick-wrap {padding: 22px 10px 19px;}
    .quick-wrap .quick-slide .thumb {width: 52px; height: 52px;}
    .quick-wrap .quick-slide .thumb img {width: 30px; height: 30px;}
    .quick-wrap .quick-slide .name {padding-top: 10px; font-size: 14px;}


    /* 고객 후기 */
    .review-card .stars {padding: 20px 25px 14px;}
    .review-card .content .badge-list {padding: 18px 25px 14px;}
    .review-card .content .badge-list li {height: 26px; padding: 25px 25px 20px; line-height: 26px; padding: 0 15px; font-size: 14px;}
    .review-card .content .text {padding: 0 25px 22px; font-size: 16px;}

    .review-swiper {padding: 0 40px;}
    .review-swiper .swiper-btn .swiper-button-next {right: 20px;}
    .review-swiper .swiper-btn .swiper-button-prev {left: 20px;}

    /* 장점 */
    .point-sect .point-list .point {padding: 26px 24px 28px;}
    .point-sect .point-list .point + .point {margin-top: 14px;}
    .point-sect .point-list .title {padding: 3px 8px; margin-left: -8px; font-size: 18.5px;}
    .point-sect .point-list .desc {gap: 14px; padding-top: 12px;}
    .point-sect .point-list .desc .text {font-size: 15.5px;}
    .point-sect .point-list .desc .bg-img {width: 98px; height: 98px;}


}

@media (min-width: 580px) {
    /* 고객 후기 */
    .review-swiper {padding: 0 80px;}
    .review-swiper .swiper-btn .swiper-button-next {right: 60px;}
    .review-swiper .swiper-btn .swiper-button-prev {left: 60px;}
}