@charset "utf-8";
/* CSS Document */

/* ------------------------- Reset : Start ------------------------- */
html { font-size: 10px; }
html, body { height: 100%; font-family: 'GmarketSans', 'Pretendard Variable', 'MalgunGothic', sans-serif; line-height: 1; letter-spacing: -0.05em; color: #000; background-color: #FFF; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size-adjust: 0.5; }
a { text-decoration: none; color: inherit; -webkit-tap-highlight-color: transparent; }
ul, ol { list-style: none; }
img, video { max-width: 100%;  height: auto; display: block; }
input, button, textarea, select { font: inherit; color: inherit; background: none; border: none; outline: none; appearance: none; }
button { cursor: pointer; }
table { border-collapse: collapse; border-spacing: 0; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
strong { font-weight: bold; }
em { font-style: italic; }
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
/* ------------------------- Reset : End ------------------------- */





/* ------------------------- Common : Start ------------------------- */
.wrap {
    overflow: hidden;
    position: relative;
}
.group {
    display: flex;
}
.fw-light {
    font-weight: 300;
}
.fw-medium {
    font-weight: 500;
}
.fw-bold {
    font-weight: 700;
}
/* ------------------------- Common : End ------------------------- */





/* ------------------------- Header : Start ------------------------- */
.wrap > .header {
    display: flex;
    padding: 3.89vw 0;
    margin: 0 3.33vw;
    background-color: #FFF;
    border-bottom: 1px solid rgba(201 , 201, 201, 0.3);
}
.header .logo {
    width: 43.61vw;
    height: 7.78vw;
    margin: auto;
    background: url(../images/logo.png) no-repeat center / 100%;
    text-indent: -9999px;
    cursor: pointer;
}
/* ------------------------- Header : End ------------------------- */





/* ------------------------- Visual : Start ------------------------- */
.visual {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 124.72vw;
    padding: 8.61vw 0 3.89vw;
    text-align: center;
}
.visual .tit {
    font-size: 10vw;
    background: linear-gradient(180deg,rgba(53, 157, 85, 1) 0%, rgba(0, 133, 74, 1) 100%);
    background-clip: text;
    letter-spacing: -0.07em;
    color: transparent;
}
.visual .txt-sub {
    margin-top: 4.44vw;
    font-size: 5.56vw;
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -0.05em;
    color: #494949;
}
.visual .box-bg {
    position: relative;
    width: 77.78vw;
    height: 50vw;
    margin: 5.56vw 0;
}
.visual .bg {
    position: absolute;
}
.visual .building {
    left: 0;
    right: 0;
    margin: auto;
    width: 65.28vw;
    height: 45.56vw;
    background: url(../images/building@2x.png) no-repeat center / 100%;
}
.visual .man {
    bottom: 0;
    width: 15vw;
    height: 33.33vw;
    background: url(../images/man@2x.png) no-repeat center / 100%;
}
.visual .car {
    right: 0;
    bottom: 0;
    width: 68.61vw;
    height: 28.89vw;
    background: url(../images/car@2x.png) no-repeat center / 100%;
}
.visual .car.show {
    opacity: 1;
    animation: compare 2s alternate;
    animation-duration: 2s;
}




.visual .btn {
    display: flex;
    justify-content: center;
    gap: 1.67vw;
    width: 88.89vw;
    height: 17.5vw;
    padding: 6.11vw 0 5.56vw;
    background: linear-gradient(180deg,rgba(243, 143, 43, 1) 0%, rgba(233, 110, 24, 1) 100%);
    border-radius: 2.78vw;
    box-shadow: 0 0.56vw 0 0 rgba(0, 0, 0, 0.11);
}
.visual .btn span {
    font-size: 6.11vw;
    font-weight: 500;
    color: #FFFFFF;
}
.visual .btn .ico {
    width: 3.89vw;
    height: 4.44vw;
    background: url(../images/btn-ico-arrow@2x.png) no-repeat center / 100%;
}
/* ------------------------- Visual : End ------------------------- */





/* ------------------------- Section : Start ------------------------- */
/* Section-01 : Start */
.section-01 {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 3.33vw 8.33vw;
    background: #F2F2F2;
}
.section-01 .list {
    padding-top: 9.44vw;
}
.section-01 .list .tit {
    margin-bottom: 4.44vw;
    font-size: 7.22vw;
    font-weight: 700;
    text-align: center;
    color: #494949;
}
.section-01 .list .box-list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 5.56vw 0 5.56vw 2.78vw;
    background: url(../images/underline.png) no-repeat 0 100% / 100% auto;
}
.section-01 .list .box-list li:last-child {
    background: none;
}
.section-01 .list .box-list .box-txt {
    display: flex;
    gap: 4.17vw;
    line-height: 1.25;
    text-align: left;
}
.section-01 .list .box-list .box-txt .num {
    font-size: 5vw;
    font-weight: 500;
    color: #D3D3D3;
}
.section-01 .list .box-list .box-txt .txt-sub {
    font-size: 5.56vw;
    font-weight: 300;
    color: #494949;
}
.section-01 .list .box-list .box-ico {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 23.89vw;
    height: 100%;
}
.section-01 .list .box-list .box-ico .ico-01 {
    width: 10vw;
    height: 12.22vw;
    background: url(../images/box-ico-01@2x.png) no-repeat center / 100%;
}
.section-01 .list .box-list .box-ico .ico-02 {
    width: 23.89vw;
    height: 16.94vw;
    background: url(../images/box-ico-02@2x.png) no-repeat center / 100%;
}
.section-01 .list .box-list .box-ico .ico-03 {
    width: 10.56vw;
    height: 13.06vw;
    background: url(../images/box-ico-03@2x.png) no-repeat center / 100%;
}
.section-01 .list .box-list .box-ico .ico-04 {
    width: 10.83vw;
    height: 12.78vw;
    background: url(../images/box-ico-04@2x.png) no-repeat center / 100%;
}
.section-01 .list .box-list .box-ico .ico-05 {
    width: 12.78vw;
    height: 13.06vw;
    background: url(../images/box-ico-05@2x.png) no-repeat center / 100%;
}
.section-01 .list .box-list .box-ico .ico-06 {
    width: 12.22vw;
    height: 12.78vw;
    background: url(../images/box-ico-06@2x.png) no-repeat center / 100%;
}
.section-01 .list .box-list .box-ico .ico-07 {
    width: 12.5vw;
    height: 10.28vw;
    background: url(../images/box-ico-07@2x.png) no-repeat center / 100%;
}




.section-01  .btn-group {
    display: flex;
    justify-content: space-between;
    gap: 0.83vw;
    width: 100%;
    margin: 3.89vw 0 6.39vw;
}
.section-01  .btn-group .btn {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: calc(33% - 1.67vw);
    height: 31.11vw;
    padding: 4.44vw;
    background: linear-gradient(180deg,rgba(122, 182, 67, 1) 0%, rgba(66, 151, 63, 1) 100%);
    box-shadow: 0 0.56vw 0 0 rgba(0, 0, 0, 0.18);
    border-radius: 2.78vw;
}
.section-01  .btn-group .tit {
    font-size: 3.89vw;
    font-weight: 500;
    line-height: 1.2;
    text-align: left;
    color: #FFFFFF;
}
.section-01  .btn-group .group {
    justify-content: space-between;
    align-items: flex-end;
}
.section-01  .btn-group .group .ico-arrow {
    width: 2.22vw;
    height: 3.89vw;
    margin-bottom: 1.11vw;
    background: url(../images/btn-group-ico-arrow@2x.png) no-repeat center / 100%;
}
.section-01  .btn-group .group .ico-01 {
    width: 7.5vw;
    height: 10vw;
    background: url(../images/btn-group-ico-01@2x.png) no-repeat center / 100%;
}
.section-01  .btn-group .group .ico-02 {
    width: 14.17vw;
    height: 7.5vw;
    background: url(../images/btn-group-ico-02@2x.png) no-repeat center / 100%;
}
.section-01  .btn-group .group .ico-03 {
    width: 9.72vw;
    height: 9.72vw;
    background: url(../images/btn-group-ico-03@2x.png) no-repeat center / 100%;
}


/* Accordion Common (Bootstrap) : Start */
.collapse {
    display: none;
}
.collapse.in {
    display: block;
}
.collapsing {
    overflow: hidden;
    position: relative;
    height: 0;
    transition-timing-function: ease;
    transition-duration: .3s;
    transition-property: height, visibility;
}
.comp-accordion .panel {
    margin-bottom: 5.33vw;
}
.comp-accordion .panel:last-child {
    margin-bottom: 0;
}
.comp-accordion .panel-title {
    overflow: hidden;
    min-height: auto;
    padding: 0;
    border: none;
    text-align: left;
    border-radius: 2.78vw;
    box-shadow: 0 14px 20px 0 rgba(0,0,0,0.15);
}
.comp-accordion .panel-title > a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    background-color: #FFFFFF;
}
.comp-accordion .panel-body {
    overflow: hidden;
    position: relative;
    padding: 4.72vw;
    background-color: #FFFFFF;
    border-radius: 2.78vw;
    box-shadow: 0 14px 20px 0 rgba(0,0,0,0.15);
}
.comp-accordion .collapse.in .panel-body::before {
    content: '';
    display: inline-block;
    position: absolute;
    top: 0;
    left: 3.61vw;
    right: 3.61vw;
    width: calc(100% - 7.22vw);
    border-top: 0.83vw dotted #92ec8a;
}
.comp-accordion .panel-title > a > .ico-arrow {
    width: 4.93vw;
    height: 4.93vw;
    background: url(../images/ico-arrow.png) no-repeat 0 0 / 100%;
}
.comp-accordion .panel-title > a[aria-expanded="true"]:not([class]) > .ico-arrow,
.comp-accordion .panel-title > a[aria-expanded="true"][class] > .ico-arrow {
    transform: rotate(180deg);
}
/* Accordion Common (Bootstrap) : End */


/* Accordion : Start */
.comp-accordion {
    width: 100%;
}
.comp-accordion .panel-title > a {
    height: 16.67vw;
    padding-left: 3.89vw;
    padding-right: 3.89vw;
}
.comp-accordion .panel-title .tit {
    display: flex;
    align-items: center;
    gap: 0.56vw;
    padding-top: 1.28vw;
    font-weight: 700;
    font-size: 5vw;
    letter-spacing: -0.03em;
    vertical-align: middle;
}
.comp-accordion .panel-title .tit .point {
    padding-top: 2.22vw;
    line-height: 0.5;
    color: #009A56;
}
.comp-accordion .panel-body .box-list {
    display: flex;
    flex-direction: column;
    gap: 5.33vw;
}
.comp-accordion .panel-body .tit {
    margin-bottom: 0.53vw;
    font-weight: 700;
    font-size: 5.07vw;
    line-height: 1.2;
    letter-spacing: -0.005em;
    color: #009D59;
}
.comp-accordion .panel-body .txt-sub {
    font-weight: 500;
    font-size: 3.89vw;
    line-height: 1.4;
    letter-spacing: -0.045em;
    color: #1D1D1D;
}
/* Accordion : End */

/* Section-01 : End */
/* ------------------------- Section : End ------------------------- */





/* ------------------------- Footer : Start ------------------------- */
.footer {
    font-family: 'Pretendard Variable';
    background: #E1E1E1;
}
.footer .inner {
    display: flex;
    flex-direction: column;
}
.footer .btn-term {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 10.56vw;
    margin: 5.56vw 5.56vw 0;
    border: 1px solid #777;
    font-weight: 700;
    font-size: 4.40vw;
    color: #777;
    border-radius: 1.33vw;
}
.footer .top {
    display: flex;
    flex-direction: column;
    padding: 0 5.56vw 5.56vw;
    background: #E1E1E1;
}
.footer .box-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 6.67vw;
    margin-bottom: 2.4vw;
}
.footer .title {
    flex-shrink: 0;
    font-weight: 800;
    font-size: 4vw;
    color: #47484E;
    vertical-align: middle;
    letter-spacing: -0.05em;
}
.footer .box-title .number {
    font-size: 2vw;
    color: #8E8E8E;
    letter-spacing: 0;
}
.footer .dot {
    position: relative;
    padding-left: 1.8vw;
    font-weight: 500;
    font-size: 2.7vw;
    line-height: 5vw;
    color: #47484E;
    letter-spacing: -0.05em;
}
.footer .dot::after {
    content: "";
    display: block;
    position: absolute;
    top: 2.3vw;
    left: 0;
    width: 0.3vw;
    height: 0.3vw;
    background-color: #47484E;
    border-radius: 50%;
}
.footer .bottom {
    padding: 5.56vw;
    background: #565656;
    color: #C0C0C0;
}
.footer .bottom > strong {
    font-weight: 800;
    font-size: 4vw;
    color: #C0C0C0;
}
.footer .bottom p {
    margin-top: 2.8vw;
    font-weight: 400;
    font-size: 2.7vw;
    line-height: 4.5vw;
    letter-spacing: -0.05em;
}
.footer .bottom .text-list {
    margin-top: 4.2vw;
}
.footer .bottom .text-list span {
    display: inline-block;
    margin: 0.5vw 0;
    font-weight: 400;
    font-size: 2.7vw;
    line-height: 4.5vw;
    letter-spacing: -0.05em;
}
.footer .bottom .text-list span.bold {
    font-weight: 800;
    font-size: 3.3vw;
}
.footer .bottom .text-list span + span {
    margin-left: 2.7vw;
}
.footer .bottom .text-list span:last-child {
    margin: 0;
}
/* ------------------------- Footer : End ------------------------- */





/* ------------------------- Animation : Start ------------------------- */
.icon-animation {
    position: relative;
    animation-play-state: paused;
    opacity: 0;
}
.rorate {
    /* transform: rotate(160deg) translate(-6rem); */
    transform: rotate(160deg) translate(-26.67vw);
}
.up {
    /* transform: translate(0, -11rem); */
    transform: translate(0, -48.89vw);
}
.shake {
    animation: shake 0.5s;
    animation-iteration-count: 2;
}
.left {
    /* transform: translate(11rem, 0); */
    transform: translate(48.89vw, 0);
}
.scale {
    transform: scale(2, 3);
}
.icon-animation.show {
    opacity: 1;
    animation-duration: 1s;
    transition-duration: 1s;
    transform: none;
}
@keyframes shake {
    0% {
        transform: translate(0.1rem, 0.1rem) rotate(0deg);
    }
    10% {
        transform: translate(0.1rem, -0.1rem) rotate(1deg);
    }
    20% {
        transform: translate(-0.2rem, 0.1rem) rotate(-1deg);
    }
    30% {
        transform: translate(0.1rem, 0.2rem) rotate(0deg);
    }
    40% {
        transform: translate(-0.1rem, 0.1rem) rotate(1deg);
    }
    50% {
        transform: translate(0.1rem, -0.1rem) rotate(-2deg);
    }
    60% {
        transform: translate(0.2rem, 0.1rem) rotate(1deg);
    }
    70% {
        transform: translate(-0.1rem, 0.2rem) rotate(2deg);
    }
    80% {
        transform: translate(0.2rem, -0.1rem) rotate(1deg);
    }
    90% {
        transform: translate(-0.1rem, 0.2rem) rotate(0deg);
    }
    100% {
        transform: translate(0.2rem, 0.1rem) rotate(-1deg);
    }
}
@keyframes compare {
    from {
        left: 244.44vw;
    }
    to {
        left: 8.89vw;
    }
}
/* ------------------------- Animation : End ------------------------- */