@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;
;}
*/

/* header */
.header .inner .areaLogo {z-index: 1;}
.header .inner nav .gnb {width: 100%; justify-content: center;}
.header .inner nav .utilArea {position: relative; z-index: 1;}

@media screen and (max-width: 1478px) {
    .header .inner nav {display: none; position: absolute; top: 60px; left: 0; width: 100%; background: #fff;}
    .header .inner nav .gnb {position: static; display: block; padding-top: 17px; height: auto; transform: initial;}
    .header .inner nav .gnb > li {padding: 0 17px;}
    .header .inner nav .gnb > li + li {margin-top: 12px;}
    .header .inner nav .gnb > li a {width: 100%; justify-content: start;}
    .header .inner nav .utilArea .smallGrayBtn {justify-content: start; width: 100%; padding-left: 34px; background: none;}
    .header .inner nav .utilArea .smallPrimaryBtn {display: flex; margin: 20px 17px 17px;}
    .header .inner .trigger {display: block;}
    .header .inner.active nav {display: block;}
}

/* common */
.instHpCustom section, .instHpCustom .footer {min-width: 32rem;}
.instHpCustom section .inner, .instHpCustom footer .inner {max-width: 104rem; padding-left: 1.6rem; padding-right: 1.6rem;}
section .inner.between {display: flex; align-items: center; justify-content: space-between;}
.instHpCustom section .inner .areaCont {margin-top: 4rem;}
section .inner.between .areaCont {margin-top: 0;}
.instHpCustom section .inner .areaTxt .sectionTit {margin-top: 1.2rem; margin-bottom: 2rem;}

/* sectionVisual01 */
.sectionVisual01 {background-image: url(../images/bg/corporation_visual.png); background-repeat: no-repeat; background-position: center; background-size: cover; padding: 19rem 0; display: flex; align-items: center; justify-content: center; position: relative;}
.sectionVisual01 .bgShadow {position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(255, 255, 255, 0.45);}
.sectionVisual01 .visualTitWrap {z-index: 1; display: flex; flex-direction: column; align-items: center;}
.sectionVisual01 .visualTit {font-size: 6.6rem; font-weight: 700; text-align: center; z-index: 1; margin-bottom: 2rem;}
.sectionVisual01 .visualTitWrap .headingBtn {width: fit-content;}

/* sectionList01 */
.sectionList01 .inner .areaCont .list.typeDivide01 {display: flex; flex-direction: column; gap: 1.2rem;}
.sectionList01 .inner .areaCont .list.typeDivide01 .listItem {display: flex; padding: 2rem; border: 1px solid #E4E7EC; border-radius: 1.6rem; background-color: #FCFCFD; gap: 1.2rem; align-items: center; height: 10rem;}
.sectionList01 .inner .areaCont .list.typeDivide01 .listItem .listNum {padding: 0.6rem 1rem; display: flex; align-items: center; border-radius: 0.8rem; background-color: var(--primary); color: #fff; font-size: 1.6rem; font-weight: 700; line-height: 2rem;}
.sectionList01 .inner .areaCont .list.typeDivide01 .listItem .listTit {font-size: 2.4rem; font-weight: 700; line-height: 2.4rem; color: #98A2B3;}
.sectionList01 .inner .areaCont .list.typeDivide01 .listItem .listTit span {color: #344054;}

/* sectionList02 */
.sectionList02 .inner .areaCont .list {display: flex; flex-direction: column; gap: 2.4rem; padding: 4rem 5rem; border-radius: 2rem; border: 1px solid #E4E7EC; background-color: #fff;}
.sectionList02 .inner .areaCont .list .listItem {display: flex; align-items: center; gap: 2rem; }
.sectionList02 .inner .areaCont .list .listItem .listNum {padding: 0.95rem 0; border-radius: 0.8rem; background-color: #F2F4F7; color: #344054; width: 3.2rem; height: 3.2rem; display: flex; align-items: center; justify-content: center; font-size: 2rem; font-weight: 700;}
.sectionList02 .inner .areaCont .list .listItem .listTit {font-size: 2.4rem; font-weight: 700; color: #98A2B3;}
.sectionList02 .inner .areaCont .list .listItem .listTit span {color: #344054;}

/* sectionSlide01 */
.sectionSlide01 {overflow: hidden;}
.sectionSlide01 .areaCont {display: block; margin-top: 6rem;}
.sectionSlide01 .areaCont .areaContBoxWrap {gap: 2rem;}
.sectionSlide01 .areaCont .swiper-slide {flex: 1 0 0; display: flex;}
.sectionSlide01 .areaCont .areaContBox {display: flex; gap: 2rem; padding: 3rem 2rem; border-radius: 2.4rem; box-shadow: 5px 4px 24px 0 rgba(119, 119, 119, 0.08); background-color: #fff; flex-direction: column; width: 100%;}
.sectionSlide01 .areaCont .areaContBox .areaContBoxTit {display: flex; align-items: center; gap: 2.4rem;}
.sectionSlide01 .areaCont .areaContBox .areaContBoxTit .areaNum {background-color: var(--secandary); font-size: 2rem; padding: 0.2rem 1.2rem; color: var(--primary); border-radius: 0.6rem;}
.sectionSlide01 .areaCont .areaContBox .areaContBoxTit .areaTit {font-size: 2.4rem; font-weight: 700;}
.sectionSlide01 .areaCont .areaContBox .areaContBoxTxt {font-size: 1.6rem; color: #667085; letter-spacing: -0.4px;}

/* sectionBox01 */
.sectionBox01.bgGray .inner .areaCont .contBox {border-color: #E4E7EC; background-color: #fff;}
.sectionBox01 .inner .areaCont {display: flex; align-items: center; gap: 1.6rem; align-self: stretch;}
.sectionBox01 .inner .areaCont .contBox {background-color: #F9FAFB; border: 2px solid #F2F4F7; border-radius: 2rem; padding: 3.6rem 5rem; display: flex; align-items: center; justify-content: space-between; flex: 1; gap: 1.6rem;}
.sectionBox01 .inner .areaCont .contBox .contBoxTit {font-size: 2.4rem; font-weight: 700; line-height: 3.2rem; letter-spacing: -0.04rem; color: #344054;}

/* sectionBox02 */
.sectionBox02 .inner {display: flex; justify-content: space-between; gap: 4rem;}
.sectionBox02 .inner .areaCont {display: flex; gap: 1.6rem;}
.sectionBox02 .inner .areaCont .contBox {display: flex; flex-direction: column; gap: 2rem; border: 2px solid #eeeeee; border-radius: 2rem; align-items: center; justify-content: center; width: 26rem; background-color: #fff;}
.sectionBox02 .inner .areaCont .contBox p {color: #485261; font-size: 2rem; font-weight: 700; text-align: center;}

/* sectionVdiagram01 */
.sectionVdiagram01 .inner .areaTxt .graysubTit {display: flex; flex-direction: column;}
.sectionVdiagram01 .inner .areaCont .circleWrap {position: relative; width: 40rem;  max-width: 40rem; height: 36rem; transform-origin: top center;}
.sectionVdiagram01 .inner .areaCont .circleWrap > div {position: absolute; width: 22rem; aspect-ratio: 1/1;}
.sectionVdiagram01 .inner .areaCont .circleWrap .top {top: 0; left: 50%; transform: translateX(-50%);}
.sectionVdiagram01 .inner .areaCont .circleWrap .left {bottom: 0; left: 0;}
.sectionVdiagram01 .inner .areaCont .circleWrap .right {bottom: 0; right: 0;}
.sectionVdiagram01 .inner .areaCont .circleWrap svg { width: 100%; height: 100%; }
.sectionVdiagram01 .inner .areaCont .circleWrap .txt {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 2rem; color: var(--primary); font-size: 3.2rem; font-weight: 600;}

/* sectionCheckPoint01 */
.sectionCheckPoint01 .inner {display: flex; flex-direction: column; gap: 6rem;}
.sectionCheckPoint01 .inner .sectionTit .title-second {display: inline-block;}
.sectionCheckPoint01 .inner .checkPointBox {padding: 4rem; background: #F9FAFB; border: 1px solid #E4E7EC; border-radius: 3.2rem;}
.sectionCheckPoint01 .inner .checkPointBox .label {width: fit-content; padding: 1.2rem 2rem; margin-bottom: 3.2rem; background: var(--primary); border-radius: 3.8rem;}
.sectionCheckPoint01 .inner .checkPointBox .label span {font-size: 2.4rem; font-weight: 600; color: #fff;}
.sectionCheckPoint01 .inner .checkPointBox .checkList > li {display: flex; align-items: center; gap: 1rem;}
.sectionCheckPoint01 .inner .checkPointBox .checkList > li + li {margin-top: 1.4rem;}
.sectionCheckPoint01 .inner .checkPointBox .checkList > li p {font-size: 2rem; font-weight: 600; color: #4e5968;}
.sectionCheckPoint01 .inner .areaBtn {text-align: center;}

/* sectionFaq01 */
.sectionFaq01 .inner {display: flex; flex-direction: column; gap: 8rem;}
.sectionFaq01 .inner .sectionTit {text-align: center;}
.sectionFaq01 .inner .faqListWrap {display: flex; flex-direction: column; gap: 1.2rem;}
.sectionFaq01 .inner .faqListWrap .faqList {width: 100%; padding: 2.4rem 3.6rem; border: 1px solid #F2F4F7; background-color: #F9FAFB; border-radius: 2.4rem;}
.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.4rem; 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 p {color: #667085; font-size: 1.6rem; font-weight: 500; line-height: 2.4rem;}
.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: 1440px) {
    .sectionVisual01 {padding: 15rem 0 10rem 0;}
}

@media screen and (max-width: 1023px) {
    .instHpCustom section .inner {padding: 12rem 8rem;}
    .instHpCustom section .inner .areaCont {margin-top: 4rem; display: flex; justify-content: end;}
    .instHpCustom section .inner .areaCont.center {justify-content: center;}
    section .inner.between {display: block;}

    /* sectionVisual01 */
    .sectionVisual01 {background-image: url(../images/bg/corporation_m_visual.png); justify-content: start;}
    .sectionVisual01 .visualTitWrap {padding-left: 8rem;}
    .sectionVisual01 .visualTit {font-size: 4.2rem; text-align: left;}

    /* sectionList01 */
    .sectionList01 .inner .areaCont {display: flex; justify-content: center; width: 100%;}
    .sectionList01 .inner .areaCont .list.typeDivide01 {max-width: 50rem; width: 100%;}

    /* sectionList02 */
    .sectionList02 .inner .areaCont .list {width: 100%;}

    /* sectionSlide01 */
    .sectionSlide01 .areaCont {margin: 0;}
    .sectionSlide01 .areaCont .swiper-slide {flex: 0 0 auto;}
    .sectionSlide01 .areaCont .areaContBoxWrap {gap: 0;}
    .sectionSlide01 .areaCont .areaContBox {min-width: 30rem;}

    /* sectionBox01 */
    .sectionBox01 .inner .areaCont {flex-direction: column;}
    .sectionBox01 .inner .areaCont .contBox {max-width: 50rem; width: 100%;}

    /* sectionBox02 */
    .sectionBox02 .inner {flex-direction: column; gap: 0;}
    .sectionBox02 .inner .areaTxt .sectionTit br {display: none;}
    .sectionBox02 .inner .areaTxt .graysubTit br {display: none;}
    .sectionBox02 .inner .areaCont {justify-content: center;}
    .sectionBox02 .inner .areaCont .contBox {padding: 2rem;}

    /* sectionVdiagram01 */
    .sectionVdiagram01 .inner .areaTxt .sectionTit span br {display: none;}
    .sectionVdiagram01 .inner .areaTxt .graysubTit {display: flex;}
    .sectionVdiagram01 .inner .areaTxt .graysubTit span br {display: none;}
    .sectionVdiagram01 .inner .areaCont {display: flex; justify-content: center; align-items: center; width: 100%;}

    /* sectionCheckPoint01 */
    .sectionCheckPoint01 .inner .checkPointBox {padding: 2rem; border-radius: 2.4rem;}
    .sectionCheckPoint01 .inner .checkPointBox .label {margin-bottom: 1.6rem;}
    .sectionCheckPoint01 .inner .checkPointBox .label span {font-size: 1.8rem;}

    /* sectionFaq01 */
    .sectionFaq01 .inner {gap: 4rem;}
}

@media screen and (max-width: 767px) {
    .instHpCustom section .inner {padding: 6rem 2rem;}
    .instHpCustom section .inner .areaTxt .sectionTit {margin-bottom: 0.4rem;}
    .instHpCustom section .inner .pointLabel {font-size: 1.6rem;}

    /* sectionVisual01 */
    .sectionVisual01 .visualTitWrap {align-items: start; padding-left: 2rem;}
    .sectionVisual01 .visualTit {font-size: 2.8rem;}

    /* sectionIntro01 */
    .sectionIntro01 .inner {padding-top: 10rem !important;}
    .sectionList01 .inner .areaCont .list.typeDivide01 .listItem .listNum {font-size: 1.4rem; width: 3.8rem;}
    .sectionList01 .inner .areaCont .list.typeDivide01 .listItem .listTit {font-size: 1.8rem;}

    /* sectionList01 */
    .sectionList01 .inner .areaCont {display: block;}
    .sectionList01 .inner .areaCont .list.typeDivide01 {width: 100%; max-width: 100%;}
    .sectionList01 .inner .areaCont .list.typeDivide01 .listItem {max-width: 100%; height: 7rem;}

    /* sectionList02 */
    .sectionList02 .inner .areaCont .list {padding: 2rem;}
    .sectionList02 .inner .areaCont .list .listItem {gap: 1.2rem;}
    .sectionList02 .inner .areaCont .list .listItem .listNum {font-size: 1.8rem;}
    .sectionList02 .inner .areaCont .list .listItem .listTit {font-size: 1.8rem;}

    /* sectionSlide01 */
    .sectionSlide01 .areaCont .areaContBox .areaContBoxTit {gap: 1.6rem;}

    /* sectionBox01 */
    .sectionBox01 .inner .areaCont .contBox {padding: 2rem; width: 100%; max-width: 100%;}
    .sectionBox01 .inner .areaCont .contBox .contBoxTit {font-size: 1.8rem;}
    .sectionBox01 .inner .areaCont .contBox .contBoxImg {width: 6.2rem; height: 6.2rem;}

    /* sectionVdiagram01 */
    .sectionVdiagram01 .inner .areaTxt .graysubTit {display: inline;}
    .sectionVdiagram01 .inner .areaTxt .graysubTit span br {display: none;}
    .sectionVdiagram01 .inner .areaCont .circleWrap {height: 22rem; width: 24rem; max-width: 100%; margin: 0 auto;}
    .sectionVdiagram01 .inner .areaCont .circleWrap > div {width: auto; max-width: 13rem;}
    .sectionVdiagram01 .inner .areaCont .circleWrap .txt {font-size: 2rem;}

    /* sectionCheckPoint01 */
    .sectionCheckPoint01 .inner {gap: 4rem;}
    .sectionCheckPoint01 .inner .sectionTit {margin-top: 1.2rem;}
    .sectionCheckPoint01 .inner .sectionTit span {display: inline-block;}
    .sectionCheckPoint01 .inner .checkPointBox {padding: 2rem;}
    .sectionCheckPoint01 .inner .checkPointBox .label {margin-bottom: 2rem; padding: 0.8rem 1.2rem;}
    .sectionCheckPoint01 .inner .checkPointBox .label span {font-size: 1.5rem;}
    .sectionCheckPoint01 .inner .checkPointBox .checkList > li svg {width: 1.6rem; height: 1.6rem;}
    .sectionCheckPoint01 .inner .checkPointBox .checkList > li p {font-size: 1.4rem;}
    .sectionCheckPoint01 .inner .areaBtn .primaryBtn {max-width: 100%;}

    /* sectionFaq01 */
    .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: 520px) {
    /* sectionSlide01 */
    .sectionSlide01 .areaCont .areaContBox {min-width: auto; gap: 0.8rem;}

    /* sectionBox02 */
    .sectionBox02 .inner .areaCont {flex-direction: column; align-items: center;}
}

@media screen and (max-width: 400px) {
    /* sectionSlide01 */
    .sectionSlide01 .areaCont .areaContBox {padding: 1.6rem; border-radius: 1.6rem; gap: 1rem;}
    .sectionSlide01 .areaCont .areaContBox .areaContBoxTit .areaNum {font-size: 1.4rem;}
    .sectionSlide01 .areaCont .areaContBox .areaContBoxTit .areaTit {font-size: 1.8rem;}
    .sectionSlide01 .areaCont .areaContBox .areaContBoxTxt {font-size: 1.4rem;}
}

@media screen and (max-width: 386px) {
    /* sectionSlide01 */
    .sectionSlide01 .areaCont .areaContBox {height: 100%;}
    .sectionSlide01 .areaCont .areaContBox .areaContBoxTxt {display: inline;}

    /* 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;}
}

/* 법인컨설팅 */
.corpProcess .inner .areaCont .areaContBoxWrap {gap: 1.2rem; align-items: stretch;}
.corpProcess .inner .areaCont .swiper-slide {display: flex; max-width: 25rem; flex: 1;}
.corpProcess .inner .areaCont .areaContBox {height: 100%;}
.corpProcess .inner .areaCont .areaContBox .areaContBoxTxt {font-size: 1.6rem; color: #667085;}

@media screen and (max-width: 1140px) {
    .corpProcess .inner .areaCont .areaContBoxWrap {gap: 0;}
    .corpProcess .inner .areaCont .swiper-slide {max-width: 100%; flex: none;}
}
@media screen and (max-width: 1023px) {
    .corpProcess .inner .areaCont .areaContBox {min-width: auto;}
}
@media screen and (max-width: 767px) {    
    .corpProcess .inner .areaTxt .sectionTit p {display: flex; gap: 0.6rem;}
}
@media screen and (max-width: 570px) {
    .corpProcess .inner .areaCont .areaContBox .areaContBoxTxt {font-size: 1.4rem;}
}
@media screen and (max-width: 386px) {
    .corpProcess .areaCont .areaContBox .areaContBoxTit .areaTit {font-size: 1.8rem;}
    .corpProcess .inner .areaCont .areaContBox {min-height: auto;}
}

/* 양도/상속/증여 */
.inhSpecial .inner .areaTxt .graysubTit .graysubTitSpace {display: none;}

@media screen and (max-width: 1023px) {
    .inhSpecial .inner .areaTxt .graysubTit .graysubTitSpace {display: block;}
}

@media screen and (max-width: 767px) {
    .inhIntro .inner .areaCont img {width: 28rem;}
    .inhSpecial .inner .areaTxt .sectionTit span br {display: block;}
}

@media screen and (max-width: 520px) {
    .inhService .areaCont .areaContBox {min-width: auto;}
    .inhSpecial .inner .areaTxt .graysubTit .graysubTitSpace {display: none;}
}

@media screen and (max-width: 386px) {
    .inhIntro .inner .areaTxt .graysubTit br {display: none;}
    .inhService .areaCont .areaContBox {min-height: 17.4rem;}
}

/* 경리아웃소싱  */
.outsPay .inner .areaTxt .graysubTit span {display: inline-block;  width: 36.2rem;}
.outsPay .inner .areaTxt .graysubTit br {display: none;}

@media screen and (max-width: 1023px) {
    .outsPay .inner .areaTxt .graysubTit span {width: 100%;}
    .outsPay .inner .areaTxt .graysubTit br {display: block;}
}

@media screen and (max-width: 520px) {
    .outsIntro .inner .areaTxt .graysubTit br, .outsPay .inner .areaTxt .graysubTit br, .outsBenefit .inner .areaTxt .graysubTit br {display: none;}
}

/* 세무조사/불복대응 */
@media screen and (max-width: 520px) {
    .taxaIntro .inner .areaTxt .graysubTit br, .taxaRefund .inner .areaTxt .graysubTit br {display: none;}
}