@charset "utf-8";

:root {
  --main02: #d3233a;

  --red01: #ff4631;
  --red02: #f43142;
  --red03: #ffedec;
  --red04: #ff0038;
  --red05: #d3233a;

  --blk02: #e1e1e1;
  --blk02-1: #f8f8f8;
  --blk03: #c2c2c2;
  --blk04: #a3a3a3;
  --blk05: #808080;
  --blk06: #5e5e5e;
  --blk08: #2e2e2e;
  --blk09: #141414;
}

@media screen and (max-width: 1919px) {
  .mainGrpWrap {
    padding: 0 calc((100% - 1759px) / 2);
  }
}

@media screen and (max-width: 1824px) {
  .mainGrpWrap {
    padding: 0 32px;
  }
  .mainGrp > li {
    width: calc((100% - 6vw) / 4);
    margin: 0 2vw 0 0;
  }
}

@media screen and (max-width: 1580px) {
}

@media screen and (max-width: 1414px) {
  .mainGrp > li section .sectionTxt strong {
    font-size: 21px;
  }
}
@media screen and (max-width: 1380px) {
}
@media screen and (max-width: 1280px) {
  .wrap {
    padding: 0 20px;
  }

  .sub01Top .topBg,
  .sub02Top .topBg {
    height: 312px;
    padding: 40px 0 0;
  }
  .sub01Top .topBg::after {
    width: 550px;
    height: 272px;
    background-size: contain;
  }
  .sub02Wrap.contnt02 .srv .topBg::after {
    transform: scale(0.8);
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform-origin: bottom right;
    top: unset;
    bottom: 0;
  }
  .sub02Wrap.contnt02 .consult .topBg::after {
    transform: scale(0.8);
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform-origin: bottom right;
  }
  .sub02Wrap.contnt03 .solu .topBg::after {
    transform: scale(0.8);
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform-origin: bottom right;
    top: unset;
    bottom: 0;
  }
  .sub02Wrap.contnt04 .solu .topBg::after {
    transform: scale(0.8);
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform-origin: bottom right;
    top: unset;
    bottom: 0;
  }
  .sub01Top .topBg strong .sub02Top .topBg strong {
    line-height: 1.2;
    font-size: 36px;
  }
  .sub01Top .topBg strong br,
  .sub02Top .topBg strong br {
    display: inline-block;
  }
  .sub01Top .topBg span,
  .sub02Top .topBg span {
    font-size: 18px;
  }

  .sub01Bttm .redBox {
    margin: 0 0 32px;
  }
}

@media screen and (max-width: 1199px) {
  .mainGrp > li:nth-child(2n) {
    top: 5%;
  }
  .mainGrp > li section .sectionTxt strong {
    font-size: 23px;
  }

  .sub02Bttm .optionGrp {
    width: 100%;
  }
  .sub02Bttm .optionGrp > ul {
    height: 340px;
  }
  .sub02Bttm .optionGrp > ul > li {
    padding: 30px 30px 20px;
  }
  .sub02Bttm .optionGrp > ul > li:hover {
    border: 1px solid var(--blk02);
  }
  .sub02Bttm .optionGrp > ul > li.swiper-slide-active {
    border: 1px solid var(--red05);
  }
  .sub02Bttm .optionGrp > ul > li .srvGrade {
    margin: 0 0 12px;
  }
  .sub02Bttm .optionGrp > ul > li .monthCost {
    margin: 0 0 10px;
  }
  .optionSwiper .swiper-pagination {
    display: inline-block;
  }
  .optionSwiper .swiper-pagination {
    bottom: 10px;
  }
  .optionSwiper .swiper-pagination .swiper-pagination-bullet {
    background: #eee;
    opacity: 1;
  }
  .optionSwiper .swiper-pagination .swiper-pagination-bullet-active {
    background: #141414;
  }

  .sub02Bttm .consltGrp {
    height: 280px;
  }
  .sub02Bttm .consltGrp > ul > li,
  .sub02Bttm .soluGrp > ul > li {
    padding: 30px;
  }
  .sub02Bttm .consltGrp > ul > li.rght {
    padding: 30px;
  }
  .sub02Bttm .consltGrp > ul > li.rght ul {
    height: 153px;
  }
  .sub02Bttm .consltGrp > ul > li.rght ul li {
    padding: 16px 12px;
  }
  .sub02Bttm .consltGrp > ul > li.rght ul li br {
    display: none;
  }
}

@media screen and (max-width: 1120px) {
  .sub02Wrap {
    padding: 0 0 160px;
  }

  .sub01Bttm .redBox {
    padding: 28px 30px 28px 24px;
    margin: 0 0 32px;
  }
  .sub01Bttm .redBox > ul {
    display: inline-block;
  }
  .sub01Bttm .redBox > ul > li.subj {
    width: 100%;
    margin: 0 0 20px;
  }
  .sub01Bttm .redBox > ul > li:not(.subj) {
    width: 50%;
  }

  .sub02Bttm .soluGrp > ul > li > strong {
    margin: 0 0 16px;
  }
  .sub02Bttm .soluGrp > ul > li > ul {
    height: calc(100% - 44px);
    flex-flow: column;
  }
  .sub02Bttm .soluGrp > ul > li.lft > ul > li {
    position: relative;
    padding: 20px 0 !important;
    border-width: 0 0 1px;
  }
  .sub02Bttm .soluGrp > ul > li.lft > ul > li > span {
    text-align: left;
    background: transparent !important;
  }
  .sub02Bttm .soluGrp > ul > li.lft > ul > li::after {
    content: '';
    width: 36px;
    height: 36px;
    border-radius: 100%;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    -ms-border-radius: 100%;
    -o-border-radius: 100%;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
  }
  .sub02Bttm .soluGrp > ul > li.lft > ul > li:nth-child(1)::after {
    background: #eff0ff url(/images/solu_lft01_m.png) no-repeat center;
  }
  .sub02Bttm .soluGrp > ul > li.lft > ul > li:nth-child(2)::after {
    background: #eff0ff url(/images/solu_lft02_m.png) no-repeat center;
  }
  .sub02Bttm .soluGrp > ul > li.lft > ul > li:nth-child(3)::after {
    background: #eff0ff url(/images/solu_lft03_m.png) no-repeat center;
  }

  .contnt04 .sub02Bttm .soluGrp > ul > li.lft > ul > li:nth-child(1)::after {
    background: #eff0ff url(/images/solu_lft01_2_m.png) no-repeat center;
  }
  .contnt04 .sub02Bttm .soluGrp > ul > li.lft > ul > li:nth-child(2)::after {
    background: #eff0ff url(/images/solu_lft02_2_m.png) no-repeat center;
  }
  .contnt04 .sub02Bttm .soluGrp > ul > li.lft > ul > li:nth-child(3)::after {
    background: #eff0ff url(/images/solu_lft03_2_m.png) no-repeat center;
  }

  .sub02Bttm .soluGrp > ul > li.lft > ul > li > span > b br {
    display: none;
  }
  .sub02Bttm .soluGrp > ul > li.lft > ul > li:last-child > span br {
    display: none;
  }
  .sub02Bttm
    .soluGrp
    > ul
    > li.lft
    > ul
    > li:last-child
    > span
    br:nth-child(2) {
    display: inline-block;
  }
}

@media screen and (max-width: 940px) {
  .sub02Bttm .consltGrp > ul > li.rght > span {
    margin: 6px 0 8px;
  }
  .sub02Bttm .consltGrp > ul > li.rght ul {
    height: auto;
  }
  .sub02Bttm .consltGrp > ul > li.rght ul li {
    width: 100%;
    height: auto;
    margin: 0 0 10px;
  }
  .sub02Bttm .consltGrp > ul > li.rght ul li::after {
    bottom: 6px;
  }
}

@media screen and (max-width: 924px) {
  .sub01Bttm .redBox {
    padding: 20px 24px 20px 16px;
    margin: 0 0 16px;
  }
  .sub01Bttm .serviceGrp > ul > li {
    width: calc((100% - 32px) / 3);
    margin: 0 16px 0 0;
  }
  .sub01Bttm .serviceGrp > ul > li strong {
    font-size: 16px;
    margin: 0 0 4px;
  }
  .sub01Bttm .serviceGrp > ul > li span {
    font-size: 13px;
  }
}
@media screen and (max-width: 900px) {
  .sub02Bttm .consltGrp > ul > li.lft strong br {
    display: inline-block;
  }
}
@media screen and (max-width: 888px) {
  .sub01Bttm .serviceGrp > ul > li {
    padding: 16px 22px;
  }
}
@media screen and (max-width: 877px) {
  .sub02Bttm .consltGrp {
    height: auto;
  }
  .sub02Bttm .consltGrp > ul > li {
    width: 100%;
  }
  .sub02Bttm .consltGrp > ul > li.lft {
    height: auto;
    margin: 0 0 20px;
    background: #fff4f6;
  }
  .sub02Bttm .consltGrp > ul > li.lft::after {
    background: #fff url(/images/consult_lft.png) no-repeat center;
    bottom: 28px;
  }
  .sub02Bttm .consltGrp > ul > li.lft strong {
    margin: 0 0 40px;
  }
  .sub02Bttm .consltGrp > ul > li.rght {
    height: auto;
  }
  .sub02Bttm .consltGrp > ul > li.rght > span {
    margin: 6px 0 16px;
  }
}
@media screen and (max-width: 760px) {
  .sub01Wrap {
    padding: 0;
  }

  .sub01Top .topBg::after {
    width: 505px;
    height: 250px;
  }

  .sub01Bttm .serviceGrp > ul > li {
    width: 100%;
    height: 88px;
    margin: 0 0 16px;
  }
  .sub01Bttm .serviceGrp > ul > li::after {
    height: 44px;
    bottom: 22px;
  }
  .sub01Bttm .serviceGrp > ul > li strong {
    font-size: 18px;
  }
  .sub01Bttm .serviceGrp > ul > li span {
    font-size: 14px;
  }
  .sub01Bttm .redBox > ul > li.tmt,
  .sub01Bttm .redBox > ul > li.lowCost {
    display: none;
  }
  .sub01Bttm .redBox > ul > li.mobileTxt {
    display: inline-block;
    width: 100%;
    padding: 0;
    margin: 0;
  }
  .sub01Bttm .redBox > ul > li.mobileTxt p {
    color: #fff;
    font-size: 18px;
    text-align: right;
    letter-spacing: 1px;
  }
  .sub01Bttm .redBox > ul > li.mobileTxt p strong {
    font-size: 24px;
    font-weight: 500;
  }
  .sub01Bttm .redBox > ul > li.mobileTxt p span {
    position: relative;
    height: auto;
    padding: 0;
    top: unset;
    left: unset;
    transform: unset;
    opacity: 0.8;
    -webkit-transform: unset;
    -moz-transform: unset;
    -ms-transform: unset;
    -o-transform: unset;
    border: 0;
  }

  .sub02Wrap {
    padding: 0 0 20px;
  }
  .contnt04 .sub02Top .topBg strong br {
    display: inline-block;
  }
  .sub02Bttm .soluGrp {
    height: auto;
  }
  .sub02Bttm .soluGrp > ul > li {
    width: 100%;
    margin: 0 0 20px;
  }

  .sub02Bttm .soluGrp > ul > li > ul {
    height: auto;
  }
  .sub02Bttm .soluGrp > ul > li.rght > ul > li {
    padding: 20px 20px 20px 62px;
  }
  .sub02Bttm .soluGrp > ul > li.rght > ul > li > strong {
    left: 20px;
  }

  .contnt04 .sub02Bttm .soluGrp > ul > li.lft > ul > li > span br {
    display: none;
  }

  .sub02Wrap .contct_btn button {
    background: var(--main02);
  }
  .sub02Wrap .contct_btn button span {
    color: #fff;
  }
  .sub02Wrap .contct_btn button span::after {
    background: url(/images/contct_btn_2.png) no-repeat center;
  }
}

@media screen and (max-width: 700px) {
  .sub01Top .topBg {
    height: 380px;
  }
  .sub02Top .topBg {
    height: 410px;
  }
  .sub01Top .topBg::after,
  .sub02Wrap.contnt02 .srv .topBg::after,
  .sub02Wrap.contnt02 .consult .topBg::after,
  .sub02Wrap.contnt03 .solu .topBg::after,
  .sub02Wrap.contnt04 .solu .topBg::after {
    width: 100%;
    height: 248px;
  }
  .sub02Wrap.contnt02 .srv .topBg::after,
  .sub02Wrap.contnt02 .consult .topBg::after,
  .sub02Wrap.contnt03 .solu .topBg::after,
  .sub02Wrap.contnt04 .solu .topBg::after {
    height: 220px;
    transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
  }
}

@media screen and (max-width: 556px) {
  .sub01Top .topBg {
    height: 323px;
  }
  .sub02Top .topBg {
    height: 420px;
  }
  .sub01Top .topBg strong,
  .sub02Top .topBg strong {
    font-size: 30px;
  }
  .sub01Top .topBg span,
  .sub02Top .topBg span {
    font-size: 16px;
  }
  .sub01Top .topBg::after {
    height: 198px;
  }

  .sub02Top.consult .topBg strong br {
    display: none;
  }

  .sub02Wrap.contnt02 .srv .topBg::after {
  }
  .sub02Wrap.contnt02 .consult .topBg::after {
  }
  .sub02Wrap.contnt03 .solu .topBg::after {
  }
  .sub02Wrap.contnt04 .solu .topBg::after {
  }
}

@media screen and (max-width: 521px) {
  .mainGrp > li {
    min-width: 0;
  }
}

@media screen and (max-width: 520px) {
  html {
    font-size: 4.2vw;
  }

  header {
    height: 3.7125rem;
  }
  header h1 {
    width: 1.7625rem;
    height: 1.125rem;
    top: 1.25rem;
    left: 1.325rem;
    z-index: 1;
  }
  header h2 {
    font-size: 1.125rem;
    width: 100%;
    text-align: center;
  }

  .wrap {
    padding: 0 1rem;
  }
  .sub02Bttm.wrap.srv {
  }
  .sub02Bttm .optionGrp .swiper-wrapper {
  }

  .mainGrpWrap {
    padding: 0 3.5rem;
  }
  .mainGrp > li.swiper-slide-active {
  }
  .mainGrp > li:hover {
    box-shadow: none;
  }
  .mainGrp > li section .sectionTxt {
    padding: 1.5625rem 1.25rem;
  }
  .mainGrp > li section .sectionTxt strong {
    font-size: 1.25rem;
    padding: 0 0 1.35rem;
  }
  .mainGrp > li section .sectionTxt .moreView {
    width: 2.25rem;
    height: 2.25rem;
  }
  .mainGrp > li.swiper-slide {
    transform: translateZ(0) scale(0.9);
    -webkit-transform: translateZ(0) scale(0.9);
    -moz-transform: translateZ(0) scale(0.9);
    -ms-transform: translateZ(0) scale(0.9);
    -o-transform: translateZ(0) scale(0.9);
  }
  .mainGrp > li.swiper-slide-active {
    transform: translateZ(0) scale(1);
    -webkit-transform: translateZ(0) scale(1);
    -moz-transform: translateZ(0) scale(1);
    -ms-transform: translateZ(0) scale(1);
    -o-transform: translateZ(0) scale(1);
  }
  .mainGrp > li.swiper-slide-active section .sectionTxt .moreView {
    background: var(--red05);
  }
  .mainGrp > li section .sectionTxt .moreView a::before {
    width: 0.625rem;
    height: 0.865rem;
    background-size: contain;
    top: 0.725rem;
    left: 0.875rem;
  }
  .mainGrp > li.swiper-slide-active section .sectionTxt .moreView a::before {
    background: url(/images/mainArrw02_btn.png) no-repeat center;
  }

  .sub01Top .topBg {
    height: 21.85rem;
  }
  .sub02Top .topBg {
    height: 26.25rem;
  }
  .sub02Top.solu .topBg {
    height: 22.25rem;
  }
  .contnt04 .sub02Top.solu .topBg {
    height: 23.5rem;
  }
  .sub02Top.consult .topBg {
    height: 21rem;
  }
  .sub01Top .topBg strong,
  .sub02Top .topBg strong {
    line-height: 1.15;
    font-size: 1.6rem;
    padding: 0 0 1.125rem;
  }
  .sub01Top .topBg span,
  .sub02Top .topBg span {
    font-size: 0.925rem;
    margin: 0 0 2.5rem;
  }

  .sub02Wrap.contnt02 .srv .topBg::after {
    height: 11rem;
    bottom: 2.5rem;
  }

  .sub01Bttm .redBox > ul > li.subj strong {
    font-size: 1.2rem;
  }
  .sub01Bttm .redBox > ul > li.subj span {
    font-size: 0.8rem;
  }
  .sub01Top .topBg::after {
    height: 13.25rem;
    background: url(/images/topBg_sub01_m.png) no-repeat center;
    background-size: cover;
    bottom: -2px;
  }
  .sub01Bttm .redBox > ul > li.mobileTxt p {
    font-size: 0.875rem;
  }
  .sub01Bttm .redBox > ul > li.mobileTxt p strong {
    font-size: 1.4625rem;
  }
  .sub01Bttm .redBox > ul > li.mobileTxt p span {
    font-size: 0.925rem;
    font-weight: 300;
  }

  .sub01Bttm .serviceGrp {
    margin: 0;
  }
  .sub01Bttm .serviceGrp > ul > li {
    height: 5.825rem;
    padding: 1.6rem 1.525rem;
  }
  .sub01Bttm .serviceGrp > ul > li strong,
  .sub01Bttm .serviceGrp > ul > li span {
    font-size: 0.8rem;
  }
  .sub01Bttm .serviceGrp > ul > li strong {
    margin: 0;
  }
  .sub01Bttm .serviceGrp > ul > li span {
    font-weight: 100;
  }
  .sub01Bttm .serviceGrp > ul > li::after {
    width: 1.75rem;
    height: 1.75rem;
    bottom: 2rem;
  }

  .sub02Bttm .optionGrp > ul {
    height: 20rem;
  }
  .sub02Bttm .optionGrp > ul > li {
    padding: 1.75rem 1.25rem;
  }
  .sub02Bttm .optionGrp > ul > li .srvGrade {
    height: 1.625rem;
    line-height: 1.625rem;
    font-size: 0.95rem;
    padding: 0 0.825rem;
    margin: 0 0 0.85rem;
  }
  .sub02Bttm .optionGrp > ul > li .monthCost strong {
    font-size: 1.5rem;
  }
  .sub02Bttm .optionGrp > ul > li .srvTxt > li {
    font-size: 1rem;
  }

  .sub02Wrap.contnt02 .consult .topBg::after {
    width: 100%;
    height: 11.5rem;
    background: url(/images/topBg_sub02_2_m.png) no-repeat center;
    background-size: contain;
  }

  .sub02Bttm .consltGrp > ul > li.lft {
    padding: 1.75rem 1.35rem;
    margin: 0 0 1.35rem;
  }
  .sub02Bttm .consltGrp > ul > li.lft span {
    height: 1.625rem;
    line-height: 1.625rem;
    font-size: 0.8625rem;
    padding: 0 1.125rem;
  }
  .sub02Bttm .consltGrp > ul > li.lft strong {
    font-size: 1.125rem;
  }
  .sub02Bttm .consltGrp > ul > li.lft::after {
    width: 4.25rem;
    height: 4.25rem;
    background-size: 55%;
    right: 1.25rem;
    bottom: 1.8625rem;
  }
  .sub02Bttm .consltGrp > ul > li.rght {
    padding: 1.55rem 1.35rem;
  }
  .sub02Bttm .consltGrp > ul > li.rght > span {
    font-size: 1.19rem;
    margin: 0 0 1.85rem;
  }
  .sub02Bttm .consltGrp > ul > li.rght ul li {
    padding: 1.72rem 1.35rem;
    margin: 0 0 0.875rem;
  }
  .sub02Bttm .consltGrp > ul > li.rght ul li:last-child {
    padding: 1rem 1.35rem;
  }
  .sub02Bttm .consltGrp > ul > li.rght ul li:last-child br:nth-child(1) {
    display: inline-block;
  }
  .sub02Bttm .consltGrp > ul > li.rght ul li::after {
    width: 2.6rem;
    height: 2.6rem;
    bottom: 1.125rem;
    right: 1.75rem;
  }

  .sub02Wrap.contnt03 .solu .topBg::after {
    height: 10.5rem;
    background: url(/images/topBg_sub03_m.png) no-repeat center;
    bottom: 2rem;
  }
  .sub02Wrap.contnt04 .solu .topBg::after {
    height: 13rem;
    background: url(/images/topBg_sub04_m.png) no-repeat center;
    background-size: contain;
  }
  .sub02Bttm .soluGrp > ul > li {
    padding: 1.55rem 1.35rem;
    margin: 0 0 1.35rem;
  }
  .sub02Bttm .soluGrp > ul > li > strong {
    font-size: 1.2rem;
    margin: 0 0 0.625rem;
  }
  .sub02Bttm .soluGrp > ul > li.rght > strong {
    margin: 0 0 1.625rem;
  }
  .sub02Bttm .soluGrp > ul > li.rght > ul > li {
    padding: 1.3rem 1.3rem 1.3rem 5rem;
    margin: 0 0 0.75rem;
  }
  .sub02Bttm .soluGrp > ul > li.rght > ul > li > strong {
    font-size: 1.45rem;
    left: 1.75rem;
  }
  .sub02Bttm .soluGrp > ul > li.rght > ul > li > span br {
    display: inline-block;
  }
}