@charset "utf-8";

@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);
* { font-family: 'Noto Sans KR', sans-serif!important; }


html,body {
    width: 100vw;
    overflow: visible;
    overflow-x: hidden;
}
body {
    -webkit-overflow-scrolling: touch;
    -webkit-text-size-adjust:none;
    /* 아이폰 스크롤 동작 */
} 
.scroll {
    position: fixed;
    width: 4.95vw;
    height: 16vw;
    top: 10vw;
    right: 2vw;
    z-index: 99999;
    text-align: center;
}
.scroll ul li:not(:last-child) {
    background-color: #67686d;
    width: 4.43vw;
    height: 3.65vw;
    margin-top: 1px;
    margin-left: 5px;
}
.scroll ul li:first-child {
    margin-top: 5px;
}
.scroll ul li{
    cursor: pointer;
}
.scroll ul li img {
    text-align: center;
    padding: 16px 6px;
}
.scroll ul li:not(:last-child):hover {
    background-color: #00205c;
}
.m_scroll {
    display: none;
}
/* 헤더 */
.banner {
    height: 45px;
    background-color: #00205c;
    overflow: hidden;
    position: relative;
    width: 100%;
}
.banner  img {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.banner span {
    position: absolute;
    font-size: 25px;
    color:#333;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(255,255,255,0.5);
    border-radius: 50px;
    text-align: center;
    line-height: 25px;
    right:2%;
    cursor: pointer;
    width: 30px; height: 30px;
}
.head {
    width: 100%;
    height: 100px;
    overflow: hidden;
    z-index: 9;
    box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.1);
    position: relative;
    background-color: #fff;
}
.head.fixed {
    position: fixed;
    top: 0;
    z-index: 9999;
}
.head img {
    position: absolute;
    top: 50%;
    left: 18.75vw;
    transform: translateY(-50%);
    cursor: pointer;
    width: 3vw;
}
.head > ul {
    display: none;
    overflow: hidden;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 18.75vw;
    height: 100%;
}
.head > ul li {
    float: left;
    font-weight: bold;
    font-size: 0.93vw;
    margin-left: 4.58vw;
    height: 100%;
    line-height: 100px;
}
.head > ul li a:hover {
    color: #00205c;
    font-weight: bold;
}
.head > ul li.on {
    font-weight: bold;
    box-sizing: border-box;
}
.head > ul li.on a {
    color: #00205c;
}
/* 헤더 */
/* 슬라이드 */
.section {
    width: 100vw;
    overflow: hidden;
}
.slide .swiper-container .swiper-wrapper .swiper-slide {
    position: relative;
    width: 100vw;
    height: 690px;
    margin-top: -100px;
    margin-top: -140px;
    overflow: hidden;
}
.slide .swiper-container .swiper-wrapper .swiper-slide img{
    filter: brightness(50%);
}
.slide .text {
    position: absolute;
    z-index: 9;
    color: #ffffff;
    top: 24.6vh;
    text-align: center;
    width: 100%;
    height: auto;
    text-shadow: 3px 4px 5px rgba(0, 0, 0, 0.1);
}
.slide .text h1 {
    font-size: 3vw;
    font-weight: 200;
}
.slide .text h1 ul li:nth-child(1) {
    margin-bottom: 0.6vw;
}
.slide .text h1 ul li:nth-child(2) {
    margin-bottom: 1.25vw;
    font-weight: 400;
}
.slide .text h1 ul li span {
    font-weight: 400;
}
.slide .text > ul {
    font-size: 1.04vw;
    margin-bottom: 2.08vw;
    width: 79.55vw;
    margin: 0 auto;
}
.slide .text h2 {
    margin: 0 auto;
    margin-bottom: 2.03vw;
    line-height: 1.56vw;
    font-weight: 200;
    width: 27.76vw;
}
.slide .text .link {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    text-shadow: none;
}
.slide .text .link .click {
    width: 10vw;
    height: 2.2vw;
    border-radius: 25px;
    border: 1px solid #fff;
    background-color: transparent;
    font-size: 0.83vw;
    line-height: 2.2vw;
}
.slide .text .link .click a {
    color: #fff;
    font-weight: 500;
    text-align: center;
}
.slide .main {
    position: absolute;
    bottom: 19%;
    left: 50%;
    transform: translateX(-50%);
    width: 62.5vw;
    height: 7.29vw;
    background-color: #fff;
    z-index: 99;
}
.slide .main .main_list {
    padding: 2.29vw 2vw;
    height: 100%;
}
.slide .main ul {
    padding: 0 0.9vw;
    float: left;
}
.slide .main ul:last-child {
    margin-right: 0;
}
.slide .main ul li {
    font-size: 0.72vw;
    float: left;
    line-height: 1vw;
}
.slide .main ul li span {
    font-weight: bold;
}
.slide .main ul li img {
    height: 1.51vw;
    margin-right: 1vw;
    margin-top: 0.6vw;
}
/* 슬라이드 */
/* 인트로 */
.intro {
    background-color: #f2f2f2;
    height: 590px;
    width: 100vw;
}
.intro .box {
    width: 62.5vw;
    height: 20.83vw;
    margin-left: 18.75vw;
    margin-top: 5.72vw;
    overflow: hidden;
}
.intro .box > div {
    width: 50%;
    height: 100%;
    float: left;
}
.intro .box .img {
    width: 50%;
    float: left;
}
.intro .box .img img {
    width: 100%;
    font-size: 0;
}
.intro .box .text {
    color: #494848;
    background-color: #fff;
    width: 50%;
}
.intro .box .text ul {
    margin-left: 3.95vw;
    font-size: 0.83vw;
    font-weight: 400;
}
.intro .box .text h1 {
    font-size: 1.14vw;
    margin-top: 4.47vw;
    margin-bottom: 1.56vw;
    font-weight: 600;
}
.intro .box .text ul li {
    line-height: 1.4vw;
}

.intro .box .text ul li a {
    color: #fff;
    background-color: #192e59;
    width: 8.33vw;
    text-align: center;
    height: 2.29vw;
    line-height: 2.29vw;
    margin-top: 1.66vw;
    display: block;
}
.intro .box .m_intro {
    display: none;
}
/* 인트로 */
/* 서비스 */
.service h1 {
    font-size: 1.82vw;
    color: #00205c;
    text-align: center;
    margin-top: 4.94vw;
    font-weight: 600;
}
.service > ul {
    margin-bottom: 1.82vw;
    text-align: center;
    margin-top: 1.82vw;
    font-size: 0.93vw;
}
.service ul li {
    line-height: 1.5vw;
}
.service .swiper2 {
    width: 62.5vw;
    margin-bottom: 4.94vw;
}
.service .swiper2 .swiper-wrapper .swiper-slide .content {
    width: 11.6vw;
    height: 11.6vw;
    cursor: pointer;
    position: relative;
}
.service .swiper2 .swiper-wrapper .swiper-slide .content1 {
    background-image: url(../images/service/service1.png);
}
.service .swiper2 .swiper-wrapper .swiper-slide .content2 {
    background-image: url(../images/service/service2.png);
}
.service .swiper2 .swiper-wrapper .swiper-slide .content3 {
    background-image: url(../images/service/service3.png);
}
.service .swiper2 .swiper-wrapper .swiper-slide .content4 {
    background-image: url(../images/service/service4.png);
}
.service .swiper2 .swiper-wrapper .swiper-slide .content5 {
    background-image: url(../images/service/service5.png);
}
.service .swiper2 .swiper-wrapper .swiper-slide .content > ul{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    text-align: center;
    color: #fff;
    width: 100%;
    height: 100%;
}
.service .swiper2 .swiper-wrapper .swiper-slide .content ul li:nth-child(1) {
    font-size: 1.15vw;
    font-weight: 400;
    margin-top: 4.47vw;
}
.service .swiper2 .swiper-wrapper .swiper-slide .content ul li:nth-child(2) {
    font-size: 0.66vw;
    font-weight: 100;
}
.service .swiper2 .swiper-wrapper .swiper-slide .content:hover {
    background-image: none;
    background-color: #00205c;
    animation: hover 2s linear;
}
@keyframes hover {
    0%{transform:translateY(0);}
    25%{transform:translateY(-10px);}
    50%{transform:translateY(-20px);}
    75%{transform:translateY(-10px);}
    100%{transform:translateY(0);}
}

.service .swiper3 {
    display: none;
}
/* 서비스 */
/* 진행절차 */
.process {
    background-color: #f2f5fb;
}
.process h1 {
    font-size: 1.82vw;
    color: #00205c;
    text-align: center;
    margin-top: 4.94vw;
    font-weight: 600;
}
.process h2 {
    text-align: center;
    margin: 0 auto;
    margin-top: 1.82vw;
    font-size: 0.93vw;
    width: 48vw;
    line-height: 1.5vw;
}
.process .swiper3 {
    display: none;
    /*모바일 슬라이드*/
}
.process .tabmenu {
    display: none;
}
.process .box {
    width: 62.5vw;
    margin-left: 18.75vw;
}
.process .box > ul {
    clear: both;
    margin: 1.82vw 0;
    height: 100%;
}
.process .box > ul > li {
    float: left;
    text-align: center;
    width: 25%;
    font-size: 0.83vw;
    line-height: 1.5vw;
}
.process .box > ul:nth-child(1) > li {
    margin-bottom: 2.6vw;
}
.process .box > ul:last-child > li {
    margin-bottom: 4.94vw;
}
.process .box > ul > li img {
    margin-bottom: 1.56vw;
}

/* 진행절차 */
/* 지도 */
.map {
    position: relative;
    background-image: url(../images/center_bg.png);
}
.map h1 {
    font-size: 1.82vw;
    color: #00205c;
    text-align: center;
    margin-top: 4.94vw;
    font-weight: 600;
}
.map h2 > ul {
    text-align: center;
    margin-top: 1.82vw;
    font-size: 0.93vw;
}
.map h2 > ul li {
    line-height: 1.5vw;
}
.map img {
    margin-left: 26.02vw;
    margin-bottom: 4.94vw;
    margin-top: 2.6vw;
    text-align: center;
    width: 52.86vw;
}
/* 지도 */
/* 견적문의 */
iframe {
    width: 100vw;
    height: 33.43vw;
}
.footer {
    width: 100vw;
    height: 15.93vw;
    background-color: #00205c;
}
.footer .box {
    width: 62.5vw;
    margin-left: 18.75vw;
}
.footer ul {
    float: left;
    color: #fff;
    margin-top: 3.48vw;
}
.footer ul:first-child {
    margin-right: 16.04vw;
}
.footer ul:nth-child(2) li:nth-child(1) {
    font-size: 1.56vw;
    font-weight: 600;
    margin-bottom: 0.625vw;
}
.footer ul:nth-child(2) li:nth-child(1) span {
    color: #3db166;
}
.footer ul:nth-child(2) li:last-child a {
    width: 9.375vw;
    font-weight: 600;
    font-size: 0.93vw;
    height: 2.08vw;
    display: block;
    text-align: center;
    line-height: 2.08vw;
    float: left;
    margin-top: 1.56vw;
}
.footer ul:nth-child(2) li:last-child a:nth-child(1) {
    color: #3db166;
    background-color: #fff;
    margin-right: 1.51vw;
}
.footer ul:nth-child(2) li:last-child a:nth-child(2) {
    color: #fff;
    background-color: #3db166;
}
.footer ul li {
    font-size: 0.93vw;
    font-weight: 300;
    line-height: 1.56vw;
}
.footer ul li img {
    margin-bottom: 0.72vw;
}
.footer ul li a {
    color: #fff;
}

/* 견적문의 */
/* 태블릿 환경 */
@media screen and (min-width: 375px) and (max-width:768px) {
    *:focus {
        outline: none;
    }
    html,body {
        width: 100vw;
        overflow: visible;
        overflow-x: hidden;
    }
    body {
        -webkit-overflow-scrolling: touch;
        -webkit-text-size-adjust:none;
        /* 아이폰 스크롤 동작 */
    }
    .full_bg {
        width: 100vw;
        height: 100vh;
        position: fixed;
        display: none;
    }
    .full_bg.full_bg.background {
        background-color: rgba(0,0,0,0.5);
        z-index: 9999;
        display: block;
    }
    .scroll {
        display: none!important;
    }
    .m_scroll {
        position: fixed;
        right: 10vw;
        bottom: 15vw;
        display: block;
        z-index: 99999!important;
        border: none;
    }
    .m_scroll ul {
        height: auto;
        z-index: -9;
    }
    .m_scroll .m_scroll_menu {
        display: none;
    }
    .m_scroll .m_scroll_menu.none {
        display: block;
    }
    .m_scroll .m_scroll_menu > li {
        text-align: right;
        cursor: pointer;
        margin-bottom: 2vw;
        border: none;
    }
    .m_scroll .m_scroll_menu > li img {
        width: 15vw;
    }
    .m_scroll .m_scroll_menu > li p {
        float: left;
        color: #fff;
        line-height: 15vw;
        margin: 0;
        font-weight: bold;
        margin-right: 5vw;
    }
    .m_scroll > ul > li {
        text-align: right;
        cursor: pointer;
        margin-bottom: 2vw;
        border: none;
    }
    .m_scroll > ul > li:nth-child(2) {
        border: none;
    }
    .m_scroll > ul > li:nth-child(2) button.rotate {
        transform: rotate(135deg);
        background-color: #00205c;
        margin: 0;
        padding: 0;
        border: none;
    }
    .m_scroll > ul > li:nth-child(2) button {
        text-align: center;
        font-size: 8vw;
        width: 15vw;
        height: 15vw;
        background-color: #222222;
        border-radius: 100%;
        color: #fff;
        border: none;
        padding: 0;
        text-align: center;
        line-height: 15vw;
    }
    .m_scroll > ul > li:nth-child(3) img{
        width: 15vw;
    }
    /* 태블릿헤더 */
    .banner {
        display: none;
    }
    .head {
        width: 100%;
        height: 14.58vw;
        overflow: hidden;
        z-index: 9;
        box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.1);
        position: absolute;
        background-color: transparent!important;
    }
    .head img {
        position: absolute;
        top: 50%;
        left: 8.85vw;
        transform: translate(-50%,-50%);
        cursor: pointer;
        width: 9.76vw;
    }
    .head > ul {
        display: none;
    }
    /* 태블릿헤더 */
    /* 태블릿슬라이드 */
    .section {
        width: 100vw;
        overflow: hidden;
    }
    .slide .swiper-container .swiper-wrapper .swiper-slide {
        position: relative;
        width: 100vw;
        height: 100vh;
        margin-top: 0;
        overflow: hidden;
    }
    .slide .swiper-container .swiper-wrapper .swiper-slide img {
        height: 100vh;
        width: auto;
        filter: brightness(50%);
    }
    .slide .text {
        position: absolute;
        z-index: 9;
        color: #ffffff;
        top: 37.89vh;
        text-align: center;
        width: 100%;
        height: auto;
        text-shadow: 3px 4px 5px rgba(0, 0, 0, 0.1);
    }
    .slide .text h1 {
        font-size: 8.3vw;
        font-weight: 200;
    }
    .slide .text h1 ul li:nth-child(1) {
        line-height: 11.71vw;
    }
    .slide .text h1 ul li:nth-child(2) {
        margin-bottom: 9.5vw;
        font-weight: 400;
    }
    .slide .text h1 ul li span {
        font-weight: 400;
    }
    .slide .text h2 {
        font-size: 3.51vw;
        margin-bottom: 2.08vw;
        width: 79.55vw;
    }
    .slide .text h2 {
        margin-bottom: 6.38vw;
        line-height: 6.38vw;
        font-weight: 200;
    }
    .slide .text .link {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        text-shadow: none;
    }
    .slide .text .link .click {
        width: 34.27vw;
        height: 10.02vw;
        border-radius: 4.88vw;
        background-color: transparent;
        font-size: 3.51vw;
        line-height: 10.02vw;
        text-align: center;
        padding-left: 0;                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               
    }
    .slide .text .link .click a {
        color: #fff;
        font-weight: 500;
    }
    .slide .text .link .click img {
        margin-left: 2.44vw;
        vertical-align: middle;
    }
    .slide .main {
        display: none;
    }
    /* 태블릿슬라이드 */
    /* 태블릿인트로 */
    .intro {
        background-color: transparent;
        width: 100vw;
        height: auto;
    }
    .intro .box {
        width: 100%;
        height: auto;
        margin: 0;
        overflow: hidden;
    }
    .intro .box > div {
        width: 100%;
        height: 100%;
        clear: both;
    }
    .intro .box .img {
        display: none;
    }
    .intro .box .m_intro {
        display: block;
        width: 100vw;
        height: auto;
        text-align: center;
        background-color: #f1f1f1;
    }
    .intro .box .m_intro ul:first-child li,
    .intro .box .m_intro ul:last-child li {
        font-size: 4.39vw;
        line-height: 7.94vw;
        color: #666464;    
    }
    .intro .box .m_intro ul:not(:first-child) li {
        font-size: 3.81vw;
    }
    .intro .box .m_intro ul:nth-child(2),
    .intro .box .m_intro ul:nth-child(3),
    .intro .box .m_intro ul:nth-child(4),
    .intro .box .m_intro ul:nth-child(5){
        margin: 24.15vw auto;
        line-height: 5.98vw;
    }
    .intro .box .m_intro ul:nth-child(2) > li:nth-child(2),
    .intro .box .m_intro ul:nth-child(3) > li:nth-child(2),
    .intro .box .m_intro ul:nth-child(4) > li:nth-child(2),
    .intro .box .m_intro ul:nth-child(5) > li:nth-child(2) {
        color:#00205c;
        font-weight: 600;
        margin-top: 5.07vw;
    }
    .intro .box .m_intro ul:nth-child(6){
        margin-bottom: 12.53vw;
    }

    .intro .box .m_intro ul li h1 {
        font-size: 6.35vw;
        color:#00205c;
        margin-top: 12.53vw;
        margin-bottom: 5.33vw;
        font-weight: 600;
        line-height: 6.35vw;
    }
    .intro .box .text {
        background-color: transparent;
        background-image: url(../images/intro_m.png);
        color: #fff;
        width: 100%;
        height: 29.68vw;
    }
    .intro .box .text ul {
        margin: 0 auto;
    }
    .intro .box .text ul li h1 {
        font-size: 5.2vw;
        font-weight: 400;
        width: 53vw;
        text-align: center;
        line-height: 7.81vw;
        margin: auto;
        margin-top: 8.72vw;
    }
    .intro .box .text ul li:not(:first-child) {
        display: none;
    }
    /* 태블릿인트로 */
    /* 태블릿서비스 */
    .service h1 {
        font-size: 6.35vw;
        color: #140a0a;
        text-align: center;
        margin-top: 13.8vw;
        font-weight: 600;
    }
    .service > ul {
        margin-bottom: 1.82vw;
        text-align: center;
        margin-top: 5.46vw;
        font-size: 3.6vw;
        color: #666464;
        letter-spacing: -3px;
    }
    .service > ul li {
        line-height: 7.42vw;
    }
    .service .swiper2 {
        display: none;
    }
    .service .swiper3 {
        display: block;
        margin-top: 12.10vw;
        z-index: -999;
    }
    .service .swiper3 .swiper-wrapper .swiper-slide {
        display: flex;
        align-items:center; /* 위아래 기준 중앙정렬 */
        justify-content:center; /* 좌우 기준 중앙정렬 */
        margin: 0;
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content {
        width: 74.86vw;
        height: 69.4vw;
        position: relative;
        margin-bottom: 10.67vw;
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content1 {
        background-image: url(../images/service/mobile/service1.png);
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content2 {
        background-image: url(../images/service/mobile/service2.png);
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content3 {
        background-image: url(../images/service/mobile/service3.png);
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content4 {
        background-image: url(../images/service/mobile/service4.png);
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content5 {
        background-image: url(../images/service/mobile/service5.png);
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content ul {
        background-color: #fff;
        text-align: center;
        position: absolute;
        width: 66.92vw;
        height: 20.31vw;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content ul li:nth-child(1) {
        font-size: 5.72vw;
        line-height: 5.72vw;
        color: #404040;
        margin-top: 12%;
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content ul li:nth-child(2) {
        font-size: 4.09vw;
        line-height: 4.09vw;
        color: #9b9a99;
    }
    /* 태블릿서비스 */
    /* 태블릿진행절차 */
    .process {
        background-color: transparent;
        width: 100vw;
        height: auto;
    }
    .process h1 {
        font-size: 6.35vw;
        color: #140a0a;
        text-align: center;
        margin-top: 13.8vw;
        font-weight: 600;
        line-height: 11.06vw;
    }
    .process h2 {
        text-align: center;
        margin: 0 auto;
        margin-top: 1.82vw;
        font-size: 3.71vw;
        width: 86.06vw;
        margin-bottom: 1.76vw;
    }
    .process h2 {
        line-height: 6.64vw;
    } 
    .process .swiper4 {
        /*모바일 슬라이드*/
        display: block;
        z-index: 0;
    }

    .process .tabmenu {
        display: block;
    }
    .process .tabmenu input, .tab {
        display: none;
    }
    .process .tabmenu .swiper4 .swiper-wrapper .swiper-slide {
        position: relative;
    }
    .process .tabmenu .swiper4 .swiper-wrapper .swiper-slide li:first-child {
        background-color: #f1f1f1;
        width: 15.11vw;
        height: 15.11vw;
        border-radius: 100%;
        position: relative;
        font-size: 0;
        margin: 0 auto;
        margin-bottom: 3vw;
        margin-top: 3.9vw;
    }
    .process .tabmenu .swiper4 .swiper-wrapper .swiper-slide li:nth-child(2) {
        text-align: center;
        font-size: 3.9vw;
        color: #666;
    }
    .process .tabmenu .swiper4 .swiper-wrapper .swiper-slide li:nth-child(3) {
        display: none;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        }
    .process .tabmenu .swiper4 .swiper-wrapper .swiper-slide li.bg {
        background-color: #00205c;
    }
    .process .tabmenu .swiper4 .swiper-wrapper .swiper-slide li:first-child img {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        height: 6.51vw;
    }
    .process .tabmenu input:nth-child(1):checked ~.tab1-content,
    .process .tabmenu input:nth-child(2):checked ~.tab2-content,
    .process .tabmenu input:nth-child(3):checked ~.tab3-content,
    .process .tabmenu input:nth-child(4):checked ~.tab4-content, 
    .process .tabmenu input:nth-child(5):checked ~.tab5-content, 
    .process .tabmenu input:nth-child(6):checked ~.tab6-content, 
    .process .tabmenu input:nth-child(7):checked ~.tab7-content, 
    .process .tabmenu input:nth-child(8):checked ~.tab8-content {
        display: block;
        background-color: #00205c;
    }
    .process .tabmenu .tab1-content,
    .process .tabmenu .tab2-content,
    .process .tabmenu .tab3-content,
    .process .tabmenu .tab4-content,
    .process .tabmenu .tab5-content,
    .process .tabmenu .tab6-content,
    .process .tabmenu .tab7-content,
    .process .tabmenu .tab8-content {
        width: 88.76vw;
        height: 16.14vw;
        font-size: 3.71vw;
        line-height: 16.14vw;
        padding-left: 5.59vw;
        background-color: #00205c;
        color: #fff;
        margin: 0 auto;
    }
    .process .box {
        display: none;
    }

    
    /* 태블릿진행절차 */
    /* 태블릿지도 */
    .map {
        display: none;
    }
    /* 태블릿지도 */
    /* 태블릿견적문의 */
    iframe {
        width: 100vw;
        height: 64.58vw;
        margin-top: 13.67vw;
    }
    .footer {
        width: 100vw;
        height: 126.95vw;
        background-color: #00205c;
    }
    .footer .box {
        width: 86.19vw;
        margin: 0 auto;
    }
    .footer ul {
        clear: both;
        color: #fff;
        text-align: center;
        width: 100%;
        margin-top: 3.48vw;
    }
    .footer ul:first-child {
        margin-right: 16.04vw;
        margin-top: 73vw;
        margin-bottom: -7.81vw;
    }
    .footer ul:first-child li {
        font-size: 3.71vw;
        line-height: 6.77vw;
    }
    .footer ul:first-child li img {
        height: 4.68vw;
    }
    .footer ul:nth-child(2) {
        margin-top: -87vw;
        position: relative;
    }
    .footer ul:nth-child(2) li:nth-child(2),
    .footer ul:nth-child(2) li:nth-child(3){
        font-size: 3.71vw;
        line-height: 6.77vw;
        width: 59vw;
        margin: 0 auto;

    }
    .footer ul:nth-child(2) li:nth-child(1) {
        font-size: 1.56vw;
        font-weight: 600;
        margin-bottom: 3.9vw;
        font-size: 6.34vw;
    }
    .footer ul:nth-child(2) li:nth-child(1) span {
        color: #3db166;
        width: 100%;
        height: 4.55vw;
        position: absolute;
        top: 32vw;
        left: 50%;
        transform: translate(-50%,-50%);
    }
    .footer ul:nth-child(2) li:last-child {
        margin: 0 auto;
        margin-left: 2.5vw;
    }
    .footer ul:nth-child(2) li:last-child a {
        width: 39.84vw;
        font-weight: 600;
        font-size: 3.9vw;
        height: 9.04vw;
        display: block;
        text-align: center;
        line-height: 9.04vw;
        float: left;
        margin-top: 13.02vw;
    }
    .footer ul:nth-child(2) li:last-child a:nth-child(1) {
        color: #3db166;
        background-color: #fff;
        margin-right: 1.51vw;
    }
    .footer ul:nth-child(2) li:last-child a:nth-child(2) {
        color: #fff;
        background-color: #3db166;
    }
    .footer ul li {
        font-size: 0.93vw;
        font-weight: 300;
        line-height: 1.56vw;
    }
    .footer ul li img {
        margin-bottom: 0.72vw;
    }
    .footer ul li a {
        color: #fff;
    }
    
    /* 태블릿견적문의 */
}
/* 태블릿 환경 */

/* 모바일 환경 */
@media screen and (max-width: 375px) {
     
    html,body {
        width: 100vw;
        overflow: visible;
        overflow-x: hidden;
    }
    body {
        -webkit-overflow-scrolling: touch;
        -webkit-text-size-adjust:none;
        /* 아이폰 스크롤 동작 */
    } 
    .full_bg {
        width: 100vw;
        height: 100vh;
        position: fixed;
        display: none;
    }
    .full_bg.background {
        background-color: rgba(0,0,0,0.5);
        display: block;
    }
    .scroll {
        display: none!important;
    }
    .m_scroll {
        position: fixed;
        right: 10vw;
        bottom: 15vw;
        display: block;
        z-index: 99999!important;
        border: none;
    }
    .m_scroll ul {
        height: auto;
    }
    .m_scroll .m_scroll_menu {
        display: none;
    }
    .m_scroll .m_scroll_menu.none {
        display: block;
    }
    .m_scroll .m_scroll_menu > li {
        text-align: right;
        cursor: pointer;
        margin-bottom: 2vw;
        border: none;
    }
    .m_scroll .m_scroll_menu > li img {
        width: 15vw;
    }
    .m_scroll .m_scroll_menu > li p {
        float: left;
        color: #fff;
        line-height: 15vw;
        margin: 0;
        font-weight: bold;
        margin-right: 5vw;
    }
    .m_scroll > ul > li {
        text-align: right;
        cursor: pointer;
        margin-bottom: 2vw;
        border: none;
    }
    .m_scroll > ul > li:nth-child(2) {
        border: none;
    }
    .m_scroll > ul > li:nth-child(2) button.rotate {
        transform: rotate(135deg);
        background-color: #00205c;
        margin: 0;
        padding: 0;
        border: none;
    }
    .m_scroll > ul > li:nth-child(2) button {
        text-align: center;
        font-size: 8vw;
        width: 15vw;
        height: 15vw;
        background-color: #222222;
        border-radius: 100%;
        color: #fff;
        border: none;
        padding: 0;
        text-align: center;
        line-height: 15vw;
        position: relative;
        z-index: 999999;
    }
    .m_scroll > ul > li:nth-child(3) img{
        width: 15vw;
        z-index: 99999;
    }
    /* 모바일 헤더 */
    .banner {
        display: none;
    }
    .head {
        width: 100%;
        height: 14.66vw;
        overflow: hidden;
        z-index: 9;
        box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.1);
        position: absolute;
        background-color: transparent!important;
    }
    .head img {
        position: absolute;
        top: 50%;
        left: 5.6vw;
        transform: translateY(-50%);
        cursor: pointer;
        width: 9.86vw;
    }
    .head > ul {
        display: none;
    }
    /* 모바일 헤더 */
    /* 모바일 슬라이드 */
    .section {
        width: 100vw;
        overflow: hidden;
    }
    .slide .swiper-container .swiper-wrapper .swiper-slide {
        position: relative;
        width: 100vw;
        height: 133.432vw;
        margin-top: 0;
        overflow: hidden;
    }
    .slide .swiper-container .swiper-wrapper .swiper-slide .item img {
        height: 133.432vw;
        width: auto;
        filter: brightness(50%);
    }
    .slide .text {
        position: absolute;
        z-index: 9;
        color: #ffffff;
        top: 37.86vw;
        text-align: center;
        width: 100%;
        height: auto;
        text-shadow: 3px 4px 5px rgba(0, 0, 0, 0.1);
    }
    .slide .text h1 {
        font-size: 8.3vw;
        font-weight: 400;
    }
    .slide .text h1 ul li:nth-child(1) {
        line-height: 11.71vw;
    }
    .slide .text h1 ul li:nth-child(2) {
        margin-bottom: 9.6vw;
        font-weight: 400;
    }
    .slide .text h1 ul li span {
        font-weight: 400;
    }
    .slide .text h2 {
        font-size: 3.51vw;
        margin-bottom: 2.08vw;
        width: 75vw;
    }
    .slide .text h2 {
        margin-bottom: 6.38vw;
        line-height: 6.38vw;
        font-weight: 400;
    }
    .slide .text .link {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        text-shadow: none;
    }
    .slide .text .link .click {
        width: 34.53vw;
        border-radius: 30px;
        background-color: transparent;
        font-size: 3.51vw;
        line-height: 10.02vw;
        text-align: center;
        padding-left: 0;   
        padding: 1.5vw 5.33vw;                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            
    }
    .slide .text .link .click a {
        color: #fff;
        font-weight: 500;
    }
    .slide .text .link .click img {
        margin-left: 2.44vw;
        vertical-align: middle;
    }
    .slide .main {
        display: none;
    }
    /* 슬라이드 */
    /* 인트로 */
    .intro {
        background-color: transparent;
        width: 100vw;
        height: auto;
    }
    .intro .box {
        width: 100%;
        height: auto;
        margin: 0;
        overflow: hidden;
    }
    .intro .box > div {
        width: 100%;
        height: 100%;
        clear: both;
    }
    .intro .box .img {
        display: none;
    }
    .intro .box .m_intro {
        display: block;
        width: 100vw;
        height: auto;
        text-align: center;
        background-color: #f1f1f1;
    }
    .intro .box .m_intro ul {
        width: 90vw;
        margin: 0 auto;
    }
    .intro .box .m_intro ul:first-child li,
    .intro .box .m_intro ul:last-child li {
        font-size: 4.39vw;
        line-height: 7.94vw;
        color: #666464;    
    }
    .intro .box .m_intro ul:not(:first-child) li {
        font-size: 3.81vw;
    }
    .intro .box .m_intro ul:nth-child(2),
    .intro .box .m_intro ul:nth-child(3),
    .intro .box .m_intro ul:nth-child(4),
    .intro .box .m_intro ul:nth-child(5){
        margin: 24.15vw auto;
        line-height: 5.98vw;
    }
    .intro .box .m_intro ul:nth-child(2) > li:nth-child(2),
    .intro .box .m_intro ul:nth-child(3) > li:nth-child(2),
    .intro .box .m_intro ul:nth-child(4) > li:nth-child(2),
    .intro .box .m_intro ul:nth-child(5) > li:nth-child(2) {
        color:#00205c;
        font-weight: 600;
        margin-top: 5.07vw;
    }
    .intro .box .m_intro ul:nth-child(6){
        margin-bottom: 12.53vw;
    }

    .intro .box .m_intro ul li h1 {
        font-size: 6.35vw;
        color:#00205c;
        margin: 0;
        margin-top: 12.53vw;
        margin-bottom: 5.33vw;
        font-weight: 600;
        line-height: 6.35vw;
        width: 100%;
    }
    .intro .box .text {
        background-color: transparent;
        background-image: url(../images/intro_m.png) center center no-repeat;
        background-size: cover;
        color: #fff;
        width: 100%;
        height: 29.68vw;
    }
    .intro .box .text ul {
        margin: 0 auto;
    }
    .intro .box .text ul li h1 {
        font-size: 5.2vw;
        font-weight: 400;
        width: 54vw;
        text-align: center;
        line-height: 7.81vw;
        margin: auto;
        margin-top: 8.72vw;
    }
    .intro .box .text ul li:not(:first-child) {
        display: none;
    }
    /* 모바일 인트로 */
    /* 모바일 서비스 */
    .service h1 {
        font-size: 6.35vw;
        color: #140a0a;
        text-align: center;
        margin-top: 13.8vw;
        font-weight: 600;
    }
    .service > ul {
        margin-bottom: 1.82vw;
        text-align: center;
        margin-top: 5.46vw;
        font-size: 3.6vw;
        color: #666464;
        letter-spacing: -2px;
    }
    .service > ul li {
        line-height: 7.42vw;
    }
    .service .swiper2 {
        display: none;
    }
    .service .swiper3 {
        display: block;
        z-index: -999;
        margin-top: 12.10vw;
    }
    .service .swiper3 .swiper-wrapper .swiper-slide {
        display:flex;
        align-items:center; /* 위아래 기준 중앙정렬 */
        justify-content:center; /* 좌우 기준 중앙정렬 */
        margin: 0;
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content {
        width: 74.86vw;
        height: 69.4vw;
        position: relative;
        margin-bottom: 10.67vw;
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content1 {
        background-image: url(../images/service/mobile/service1.png);
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content2 {
        background-image: url(../images/service/mobile/service2.png);
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content3 {
        background-image: url(../images/service/mobile/service3.png);
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content4 {
        background-image: url(../images/service/mobile/service4.png);
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content5 {
        background-image: url(../images/service/mobile/service5.png);
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content ul {
        background-color: #fff;
        text-align: center;
        position: absolute;
        width: 66.92vw;
        height: 20.31vw;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content ul li:nth-child(1) {
        font-size: 5.72vw;
        line-height: 5.72vw;
        color: #404040;
        margin-top: 12%;
    }
    .service .swiper3 .swiper-wrapper .swiper-slide .content ul li:nth-child(2) {
        font-size: 4.09vw;
        line-height: 4.09vw;
        color: #9b9a99;
    }
    /* 모바일 서비스 */
    /* 모바일 진행절차 */
    .process {
        background-color: transparent;
        width: 100vw;
        height: auto;
    }
    .process h1 {
        font-size: 6.35vw;
        color: #140a0a;
        text-align: center;
        margin-top: 13.8vw;
        font-weight: 600;
        line-height: 11.06vw;
    }
    .process h2 {
        text-align: center;
        margin: 0 auto;
        margin-top: 1.82vw;
        font-size: 3.71vw;
        width: 86.06vw;
        margin-bottom: 12.10vw;
        line-height: 7.42vw;
        letter-spacing: -2px;
    }
    .process .swiper4 {
        /*모바일 슬라이드*/
        display: block;
    }
    .process .tabmenu {
        display: block;
    }
    .process .tabmenu input, .tab {
        display: none;
    }
    .process .tabmenu .swiper4 .swiper-wrapper .swiper-slide {
        position: relative;
        padding: 0 0.5vw;
    }
    .process .tabmenu .swiper4 .swiper-wrapper .swiper-slide li:first-child {
        background-color: #f1f1f1;
        width: 15.11vw;
        height: 15.11vw;
        border-radius: 100%;
        position: relative;
        font-size: 0;
        margin: 0 auto;
        margin-bottom: 3vw;
        margin-top: 8.16vw;
    }
    .process .tabmenu .swiper4 .swiper-wrapper .swiper-slide li:nth-child(2) {
        text-align: center;
        font-size: 3.9vw;
        color: #666;
    }
    .process .tabmenu .swiper4 .swiper-wrapper .swiper-slide li:nth-child(3) {
        display: none;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        }
    .process .tabmenu .swiper4 .swiper-wrapper .swiper-slide li.bg {
        background-color: #00205c;
    }
    .process .tabmenu .swiper4 .swiper-wrapper .swiper-slide li:first-child img {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        height: 6.51vw;
    }
    .process .tabmenu input:nth-child(1):checked ~.tab1-content,
    .process .tabmenu input:nth-child(2):checked ~.tab2-content,
    .process .tabmenu input:nth-child(3):checked ~.tab3-content,
    .process .tabmenu input:nth-child(4):checked ~.tab4-content, 
    .process .tabmenu input:nth-child(5):checked ~.tab5-content, 
    .process .tabmenu input:nth-child(6):checked ~.tab6-content, 
    .process .tabmenu input:nth-child(7):checked ~.tab7-content, 
    .process .tabmenu input:nth-child(8):checked ~.tab8-content {
        display: block;
        background-color: #00205c;
    }
    .process .tabmenu .tab1-content,
    .process .tabmenu .tab2-content,
    .process .tabmenu .tab3-content,
    .process .tabmenu .tab4-content,
    .process .tabmenu .tab5-content,
    .process .tabmenu .tab6-content,
    .process .tabmenu .tab7-content,
    .process .tabmenu .tab8-content {
        width: 88.76vw;
        height: 16.14vw;
        font-size: 3.71vw;
        line-height: 16.14vw;
        padding-left: 5.59vw;
        background-color: #00205c;
        color: #fff;
        margin: 0 auto;
    }
    .process .box {
        display: none;
    }
    /* 모바일 진행절차 */
    /* 모바일 지도 */
    .map {
        display: none;
    }
    /* 모바일 지도 */
    /* 모바일 견적문의 */
    iframe {
        width: 100vw;
        height: 64.58vw;
        margin-top: 13.67vw;
    }
    .footer {
        width: 100vw;
        height: 126.95vw;
        background-color: #00205c;
    }
    .footer .box {
        width: 86.19vw;
        margin: 0 auto;
    }
    .footer ul {
        clear: both;
        color: #fff;
        text-align: center;
        width: 100%;
        margin-top: 3.48vw;
    }
    .footer ul:first-child {
        margin-right: 16.04vw;
        margin-top: 73vw;
        margin-bottom: -7.81vw;
    }
    .footer ul:first-child li {
        font-size: 3.71vw;
        line-height: 6.77vw;
    }
    .footer ul:first-child li img {
        height: 4.68vw;
    }
    .footer ul:nth-child(2) {
        margin-top: -87vw;
        position: relative;
        width: 100%;
    }
    .footer ul:nth-child(2) li:nth-child(2),
    .footer ul:nth-child(2) li:nth-child(3){
        font-size: 3.71vw;
        line-height: 6.77vw;
        width: 64vw;
        margin: 0 auto;
    }
    .footer ul:nth-child(2) li:nth-child(1) {
        font-size: 1.56vw;
        font-weight: 600;
        margin-bottom: 3.9vw;
        font-size: 6.34vw;
    }
    .footer ul:nth-child(2) li:nth-child(1) span {
        color: #3db166;
        width: 100%;
        height: 4.55vw;
        position: absolute;
        top: 32vw;
        left: 50%;
        transform: translate(-50%,-50%);
    }
    .footer ul:nth-child(2) li:last-child {
        margin: 0 auto;
        margin-left: 2.5vw;
    }
    .footer ul:nth-child(2) li:last-child a {
        width: 39.84vw;
        font-weight: 600;
        font-size: 3.9vw;
        height: 9.04vw;
        display: block;
        text-align: center;
        line-height: 9.04vw;
        float: left;
        margin-top: 13.02vw;
    }
    .footer ul:nth-child(2) li:last-child a:nth-child(1) {
        color: #3db166;
        background-color: #fff;
        margin-right: 1.51vw;
    }
    .footer ul:nth-child(2) li:last-child a:nth-child(2) {
        color: #fff;
        background-color: #3db166;
    }
    .footer ul li {
        font-size: 0.93vw;
        font-weight: 300;
        line-height: 1.56vw;
    }
    .footer ul li img {
        margin-bottom: 0.72vw;
    }
    .footer ul li a {
        color: #fff;
    }
    
    /* 모바일 견적문의 */
}
/* 모바일 환경 */