@charset "utf-8";
/* 사용 color 수정 */
:root {
    --primary: #207FFC;
    --primary-hover: #4A98FF;
    --secandary: #f3f9ff;
;}

/* 사용 color 수정 */

/*
01 에메랄드 그린
:root {
    --primary: #00A876;
    --primary-hover: #0cc28c;
    --secandary: #f4fffa;
;}

02 선샤인 오렌지
:root {
    --primary: #ff9d00;
    --primary-hover: #ffba4c;
    --secandary: #fffaf1;
;}

03 코발트 블루
:root {
    --primary: #207FFC;
    --primary-hover: #4A98FF;
    --secandary: #f3f9ff;
;}

04 라벤터 퍼블
:root {
    --primary: #814cff;
    --primary-hover: #996eff;
    --secandary: #f2edff;
;}

05 버건디 레드
:root {
    --primary: #ff4e48;
    --primary-hover: #ff6b66;
    --secandary: #fff4f4;
;}

/* 2026-03-04 */
.ratePlan .inner .serviceBox.outsourcingBox {background-color: #fff; border: 1px solid #e4e7ec; margin-top: 2rem; flex-direction: column; width: 100%;}
.ratePlan .inner .serviceBox.outsourcingBox .top {display: flex; align-items: center; justify-content: center; gap: 2.8rem; width: 100%;}
.ratePlan .inner .serviceBox.outsourcingBox .top > * {flex: 1;}
/* .ratePlan .inner .serviceBox.outsourcingBox .descBox {width: 100%;} */
.ratePlan .inner .serviceBox.outsourcingBox .descBox {width: 100%; padding: 2rem; background: #f9fafb; border: 1px solid #e4e7ec; border-radius: 1.2rem;}
.ratePlan .inner .serviceBox.outsourcingBox .descBox p {text-align: center; font-size: 18px; font-weight: 500; color: #667085;}
.ratePlan .inner .serviceBoxAdd {margin-top: 4rem;}
.ratePlan .inner .serviceBoxAdd .graysubTit {margin-bottom: 1.4rem;}
.ratePlan .inner .serviceBoxAdd .serviceBox {margin-top: 0;}
.ratePlan .inner .serviceBox.gray {border: 1px solid #e4e7ec; background: #f9fafb;}
.ratePlan .inner .serviceBoxAdd .serviceBoxContent {font-size: 1.2rem;}
.ratePlan .inner .serviceBoxAdd .serviceBoxContent + .serviceBoxContent {margin-top: 1rem;}
.ratePlan .inner .serviceBoxAdd .serviceBoxContent strong {font-size: 1.4rem;}
.ratePlan .inner .serviceBoxAdd .serviceBoxContent li {margin-left: 1rem;}

@media screen and (max-width: 1023px) {
    .ratePlan .inner .serviceBox.outsourcingBox .top {margin-bottom: 2rem;}
}
@media screen and (max-width: 767px) {
    .ratePlan .inner .serviceBox.outsourcingBox {border: 0 none; padding: 0;}
    .ratePlan .inner .serviceBox.outsourcingBox .top {flex-direction: column; margin-top: 4rem; margin-bottom: 1.2rem;}
    .ratePlan .inner .serviceBox.outsourcingBox .top .benefitList {max-width: 26rem; width: 100%;}
}

/* sectionFaq01 */
.sectionFaq01 .inner {display: flex; flex-direction: column; padding: 0; padding-top: 2rem;}
.sectionFaq01 .inner .sectionTit {text-align: center;}
.sectionFaq01 .inner .faqListWrap {display: flex; flex-direction: column; gap: 1.2rem;}
.sectionFaq01 .inner .faqListWrap .faqList {width: 100%; padding: 1.6rem 3rem; border: 1px solid #F2F4F7; background-color: #F9FAFB; border-radius: 1.6rem;}
.sectionFaq01 .inner .faqListWrap .faqList .faqListBtn {display: flex; gap: 1.2rem; align-items: center; justify-content: space-between; width: 100%;}
.sectionFaq01 .inner .faqListWrap .faqList .faqListBtn p {font-size: 2.2rem; font-weight: 700; line-height: 4.2rem; transition: 0.2s;}
.sectionFaq01 .inner .faqListWrap .faqList .faqListBtn:hover p {color: #485261; transition: 0.2s;}
.sectionFaq01 .inner .faqListWrap .faqList .faqCont {display: none; margin-top: 1.6rem;}
.sectionFaq01 .inner .faqListWrap .faqList .faqCont ul.faqContList + ul.faqContList {margin-top: 10px;}
.sectionFaq01 .inner .faqListWrap .faqList .faqCont ul.faqContList strong {color: #667085; font-size: 1.6rem; font-weight: 700; line-height: 2.8rem; color: #485261;}
.sectionFaq01 .inner .faqListWrap .faqList .faqCont ul.faqContList li {color: #667085; font-size: 1.6rem; font-weight: 500; line-height: 2.8rem;}
.sectionFaq01 .inner .faqListWrap .faqList .faqListBtn img {transform: rotate(0); transition: 0.2s;}
.sectionFaq01 .inner .faqListWrap .faqList.active .faqListBtn img {transform: rotate(180deg); transition: 0.2s;}
.sectionFaq01 .inner .areaBtn {text-align: center;}

@media screen and (max-width: 1023px) {
    /* sectionFaq01 */
    .sectionFaq01 .inner {gap: 4rem;}
}

@media screen and (max-width: 767px) {
    /* sectionFaq01 */
    .sectionFaq01 .inner {padding-top: 4rem !important;}
    .sectionFaq01 .inner .faqListWrap .faqList {padding: 1.2rem 2rem; border-radius: 1.2rem;}
    .sectionFaq01 .inner .faqListWrap .faqList .faqListBtn p {font-size: 1.8rem;}
    .sectionFaq01 .inner .faqListWrap .faqList .faqCont {margin-top: 0.4rem;}
    .sectionFaq01 .inner .faqListWrap .faqList .faqCont p br {display: none;}
}

@media screen and (max-width: 386px) {
    /* sectionFaq01 */
    .sectionFaq01 .inner .faqListWrap .faqList {padding: 1.2rem;}
    .sectionFaq01 .inner .faqListWrap .faqList .faqListBtn p {font-size: 1.6rem;}
    .sectionFaq01 .inner .faqListWrap .faqList .faqListBtn img {width: 1.6rem; height: 1.6rem;}
    .sectionFaq01 .inner .faqListWrap .faqList .faqCont p {font-size: 1.4rem;}
}