@charset "utf-8";
 
button {
    outline:none;
}
/* main section style */
.section .section_wrap {
    width:1200px;
    margin:0 auto;
}
.section .section_wrap .text_box p,
.section .section_wrap .text_box h2,
.section .section_wrap .text_box h3 {
    letter-spacing:-0.04em;
    color:#252525;
} 
.section .section_wrap .text_box .sub_text {
    font-size:18px; font-weight:400;
}
.section .section_wrap .text_box .main_text {
    font-family: 'Gmarket Sans'; font-style: normal; font-weight: 700;
    font-size:58px; line-height:1.275;
    padding-bottom:30px;
}
.section .section_wrap .scroll_box {
    position:absolute; width:100%; left:0; bottom:30px;
    text-align:center;
    color:#000; font-weight:700;
}
.section .section_wrap .scroll_box a .scroll_move {
    position:relative;
    display:block; width:48px; height:48px;
    margin:0 auto;
    background:url(../img/ico/ico_scroll_move_bg.png);
    margin-bottom:10px;
}
.section .section_wrap .scroll_box a p {
    font-size:14px;
}
.section .section_wrap .scroll_box a .scroll_move span {
    position:absolute; display:inline-block;
    background:url(../img/ico/ico_scroll_move.png);
    width:26px; height:14px;
    top:10px; left:50%; margin-left:-13px;
    -webkit-animation: slide-bottom linear 0.8s infinite alternate;
	        animation: slide-bottom linear 0.8s infinite alternate;
}
/* scroll move span animation */
@-webkit-keyframes slide-bottom {
    0% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
    }
    100% {
      -webkit-transform: translateY(10px);
              transform: translateY(10px);
    }
  }
  @keyframes slide-bottom {
    0% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
    }
    100% {
      -webkit-transform: translateY(10px);
              transform: translateY(10px);
    }
  }
.section .section_wrap .scroll_box a {
    display:inline-block; color:#000;
}
input[type="text"], input[type="password"], textarea, select { 
    outline: none;
}

/* section1 */
#section1 {
    background:#dad8da url(../img/main/main_bg01.jpg) right top no-repeat;
    background-size:auto 100%; position:relative;
}


/* section2 */

#section2 {
    background: #f8f8f8 url(../img/main/main_bg02.png) 90% 55% no-repeat;
    position:relative; background-size:43.385%;
}
#section2 .section_wrap .text_box .main_text {
    font-family: 'Gmarket Sans'; font-style: normal; font-weight: 700;
    font-size:58px; line-height:1.275;
    padding-bottom:30px;
}
#section2 .section_wrap .text_box .sub_text {
    letter-spacing:normal; color:#757575;
    line-height:1.5; font-weight:400;
    margin-bottom:66px;
}
#section2 .section_wrap .text_box a {
    display:inline-block; background-color:#d21f1e;
    color:#ffffff;
    padding:14px 26px;
    border-radius:21px;
    padding-right:56px;
    -webkit-box-shadow: 0px 16px 27px 0px rgba(0, 0, 0, 0.24);
    -moz-box-shadow: 0px 16px 27px 0px rgba(0, 0, 0, 0.24);
    -o-box-shadow: 0px 16px 27px 0px rgba(0, 0, 0, 0.24);
    box-shadow: 0px 16px 27px 0px rgba(0, 0, 0, 0.24);
    font-size:18px; letter-spacing: -0.04em;
    background:#d21f1e url(../img/ico/ico_arrow_right.png) 126px center no-repeat;
}

/* section3 */

#section3 {
    background: #f8f8f8 url(../img/main/main_bg03.png) center no-repeat;
    position:relative;
    background-size:cover;
}
#section3 .section_inner_wrap p,
#section3 .section_inner_wrap a,
#section3 .tec_count a,
#section3 .tec_count p {
    color:#f8f8f8;
} 
#section3 .section_wrap {
    width:100%;
    text-align:center;
    margin-top:50px;
}
#section3 .section_wrap .section_inner_wrap {
    width:1200px; margin:0 auto;
}
#section3 .section_wrap .section_inner_wrap .text_box {
    display:table; margin:0 auto;
}
#section3 .section_wrap .text_box .main_text {
    padding-bottom:15px;
    color:#f8f8f8;
}
#section3 .section_wrap .text_box .sub_text {
    letter-spacing:normal; color:#fff;
    line-height:1.5;
    margin-bottom:30px;
    text-align:left;
}
#section3 .tec_box ul li {
    display:inline-block;
    float:left;
    width:25%;
    text-align:center;
}
#section3 .tec_box:after {
    content:""; display:block; clear:both;
}
.tec_box a {
    display:inline-block; width:100%;
    cursor:default;

}
.tec_box span {
    display:block;
}
.tec_box .icon {
    height:110px; position:relative;
}
.tec_box .icon:after {
    content:""; width:1px; height:20px;
    background-color: #fff;
    position: absolute; top:132px; left:50%;
}
.tec_box .text {
    margin-top:65px;
    font-weight:500;
    font-size:22px;
    -webkit-text-shadow: 1px 2px 3px rgba(0, 0, 0, 0.33);
    -o-text-shadow: 1px 2px 3px rgba(0, 0, 0, 0.33);
    -moz-text-shadow: 1px 2px 3px rgba(0, 0, 0, 0.33);
    text-shadow: 1px 2px 3px rgba(0, 0, 0, 0.33);
}
.tec_box .led .icon {
    background:url(../img/ico/ico_led.svg) center no-repeat;
    background-size:92px 93px;
}
.tec_box .data .icon {
    background:url(../img/ico/ico_data.svg) center no-repeat;
    background-size:65px 88.6px;
}
.tec_box .auto .icon {
    background:url(../img/ico/ico_auto.svg) center no-repeat;
    background-size:139px 183.5px;
}
.tec_box .smart .icon {
    background:url(../img/ico/ico_smart.svg) center no-repeat;
    background-size:107px 104.1px;
}
.tec_count {
    background-color:rgba(255,255,255,.4);
    width:100%; left:0;
    margin-top:50px; padding:20px 0;
}
.tec_count_wrap {
    width:1200px; margin:0 auto;
}
.tec_count_wrap:after {
    content:""; display:block; clear:both;
}
.tec_count_wrap .count {
    display:inline-block; float:left;
    width:50%; text-align:center;
}
.tec_count_wrap .count #count01 {
    width:170px;
}
.tec_count_wrap .count #count02 {
    width:60px;
}
.tec_count_wrap .count p:first-child span {
    display:inline-block;
    font-family: 'Gmarket Sans'; font-style: normal; font-weight: 700;
    -webkit-text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.33);
    -moz-text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.33);
    -o-text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.33);
    text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.33);
}
.tec_count_wrap .count p:first-child {
    font-family: 'Gmarket Sans'; font-style: normal; font-weight: 700;
    font-size:58px; letter-spacing: -0.04em;
    -webkit-text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.33);
    -moz-text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.33);
    -o-text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.33);
    text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.33);
    margin-bottom:10px;
}
.tec_count_wrap .count p:last-child {
    text-shadow: 1px 2px 3px rgba(0, 0, 0, 0.33);
    font-size:22px; letter-spacing: -0.04em; font-weight:400;
}

/* section4 */
#section4 {
    background: #f8f8f8 url(../img/main/main_bg04.png) 110% 60% no-repeat;
    position:relative;
}
#section4 .section_wrap .text_box .main_text {
    padding-bottom:22px;
}
#section4 .section_wrap .contact {
    float:left;
}
#section4 .fp-table-cell:after {
    content:""; display:block; clear:both;
}
#section4 .map {
    float:right; position:relative;
    right:60px; margin-top:15px;
}
#section4 #map {
    margin-top:0;
}
#section4 #map iframe {
    width:100%; height:49.092vh;
}
#section4 .main_question form {
    margin-bottom:32px;
}
#section4 .main_question input,
#section4 .main_question textarea {
    display:block;
    width:430px; height:46px;
    border:1px solid #dbdbdb;
    box-sizing:border-box;
    font-size:16px; font-weight:400;
    padding-left:15px;
    margin-bottom:10px;
}
#section4 .main_question textarea {
    height:126px; margin-bottom:20px;
    resize:none;
}
#section4 .main_question input::placeholder {
    color:#bbb;
}
#section4 .main_question input[type=checkbox] {
    visibility: hidden; width:0; height:0;
}
#section4 .main_question label {
    font-size:16px; color:#757575;
    padding-left:22px;
    background:url(../img/ico/ico_checkbox.png) left center no-repeat;
}
#section4 .main_question input:checked + label {
    background: url(../img/ico/ico_checkbox_checked.png) left center no-repeat;
}
#section4 .main_question button {
    background-color:#d21f1e;
    width:130px; height:42px;
    border-radius: 21px;
    font-size:18px; 
    letter-spacing: -0.04em;
    color:#ffffff;
    -webkit-box-shadow: 0px 16px 27px 0px rgba(0, 0, 0, 0.24);
    -o-box-shadow: 0px 16px 27px 0px rgba(0, 0, 0, 0.24);
    -moz-box-shadow: 0px 16px 27px 0px rgba(0, 0, 0, 0.24);
    box-shadow: 0px 16px 27px 0px rgba(0, 0, 0, 0.24);
    outline:none;
}
#section4 .move_top {
    position:absolute; bottom:30px; right:60px;
    width:72px; height:72px;
    background-color:#d21f1e;
    border-radius:10px;
    text-align:center;
    background:#d21f1e url(../img/ico/ico_move_top.png) center 15px no-repeat;
    -webkit-box-shadow: 0px 28px 27px 0px rgba(0, 0, 0, 0.24);
    -moz-box-shadow: 0px 28px 27px 0px rgba(0, 0, 0, 0.24);
    -o-box-shadow: 0px 28px 27px 0px rgba(0, 0, 0, 0.24);
    box-shadow: 0px 28px 27px 0px rgba(0, 0, 0, 0.24);
    z-index:99;
}
#section4 .move_top a {
    display:inline-block; width:100%; height:100%;
    color:#ffffff;
    font-size:18px; font-weight:500; letter-spacing: -0.04em;
    position:relative;
}
#section4 .move_top a span {
    display:inline-block;
    position:absolute; bottom:20px; left:0; right:0;
}
#section4 .map {
    width:46.875%;
}
#section4 .map .text_box {
    margin-top:9px;
    font-size:16px;
}
#section4 .map .text_box p {
    line-height:1.625;
    color:#252525;
    font-weight: 400;
}
#section4 .map .text_box p:last-child {
    font-weight:600;
}
#section4 .agree_wrap {
    position:absolute; top:0; left:0;
    width:100%; height:100%; display:none;
}
#section4 .agree_wrap.on {
    display:block;
}
#section4 .agree_wrap .bg {
    width:100%; height:100%; background:rgba(0,0,0,.5);
    position:absolute; top:0; left:0; z-index:99999;
}
#section4 .agree_wrap .agree {
    position:absolute; top:50%; left:50%;
    transform:translate(-50%,-40%);
    width:640px; height:640px;
    z-index:100000;
}
#section4 .agree_wrap .agree .top {
    height: 50px;
    line-height: 24px;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    background: #d21f1e;
    padding: 12px 12px 12px 15px;
    box-sizing:border-box;
}
#section4 .agree .top p {
    float:left; line-height:1.5;
}
#section4 .agree .top .close {
    float:right; cursor:pointer;
}
#section4 .agree .top .close img {
    width:25px;
}
#section4 .agree .content {
    height:570px; background:#fff;
    padding:15px; font-size:14px;
    line-height:1.5; box-sizing:border-box;
}
#section4 .agree .content .content_inner {
    height:100%; overflow-y:auto;
}

/* 익스 호완 */
@media screen and (min-width:0\0){
}

@media screen and (max-width : 1600px) {
    .section .section_wrap {
        width:75%;
    }
    .tec_box .led .icon {
        background-size:82px 82.492px;
    }
    .tec_box .data .icon {
        background-size:55px 74.97px;
    }
    .tec_box .auto .icon {
        background-size:119px 157.08px;
    }
    .tec_box .smart .icon {
        background-size:97px 94.38px;
    }
    .tec_box .text {
        margin-top:40px;
    }
    .tec_box .icon:after {
        top:118px;
    }
    .tec_count {
        margin-top:30px; padding:15px 0;
    }
    .tec_box .text {
        font-size:20px;
    }
    #section4 .main_question input {
        height:40px;
    }
    #section4 .main_question textarea {
        height:106px;
    }
    #section4 .map .text_box {
        font-size:15px;
    }
    #section4 .fp-tableCell {
        padding-top:20px;
    }
    #section4 .main_question form {
        margin-bottom:22px;
    }
    #section4 .main_question textarea {
        margin-bottom:15px;
    }
    #section4 .move_top {
        bottom:50px;
    }
}
@media screen and (max-width : 1440px) {
    #section2 {
        background-position:95% 55%;
    }
    .section .section_wrap .text_box .main_text {
        font-size:48px;
    }
    .section .section_wrap .text_box .sub_text {
        font-size:16px;
    }
    #section2 .section_wrap .text_box a {
        font-size:16px;
        background-size: 18px;
    }
    .tec_box {
        width:85%; margin:0 auto;
    }
    .tec_box .text {
        font-size:16px;
    }
    #section4 .main_question input, #section4 .main_question textarea {
        width:380px;
        font-size:14px;
    }
    #section4 .main_question button {
        font-size:16px;
    }
    #section4 .map {
        float:right;
    }

}
@media screen and (max-width : 1200px) {
    #section1 {
        background-position:center center;
    }
    .section .section_wrap {
        width:calc(100% - 60px);
        margin-top:50px;
    }
    #section3 .section_wrap .section_inner_wrap {
        width:calc(100% - 60px);
    }
    .tec_box {
        width:95%;
    }
    .tec_count_wrap {
        width:calc(100% - 60px);
    }
    #section4 .agree_wrap .agree {
        transform: translate(-50%,-50%);
    }
}
@media screen and (max-width : 1024px) {
    #section4 .section_wrap .contact,
    #section4 .map {
        float:none;
    }
    #section4 .map {
        width:calc(100% - 60px); margin:0 auto;
        right:0;  margin-top:40px; margin-bottom:60px;
    }
    #section4 .main_question fieldset {
        font-size:0;
    }
    #section4 .main_question input {
        width:calc(50% - 5px); display:inline-block;
    }
    #section4 .main_question input#region {
        margin-left:10px;
    }
    #section4 .main_question input#email {
        margin-left:10px;
    }
    #section4 .main_question textarea {
        width:100%; display:inline-block;
    }
    #section4 .main_question input[type=checkbox] {
        display:block;
    }
}


/* // mobile // */

@media screen and (max-width : 850px) {
    .section .section_wrap {
        width:calc(100% - 32px);
    }
    .section .section_wrap .text_box .main_text {
        line-height:1.193; padding-bottom:18px;
    }
    .section .section_wrap .text_box .sub_text {
        font-weight:400; margin-bottom:30px;
    }

    /* section1 */
    #section1 {
        background: #dad8da url(../img/mobile/main_bg01.jpg) right bottom no-repeat;
        background-size:contain;
    }
    #section1 .section_wrap .text_box a {
        display:inline-block; background-color:#d21f1e;
        color:#ffffff;
        padding:14px 26px;
        border-radius:21px;
        padding-right:56px;
        -webkit-box-shadow: 0px 16px 27px 0px rgba(0, 0, 0, 0.24);
        -moz-box-shadow: 0px 16px 27px 0px rgba(0, 0, 0, 0.24);
        -o-box-shadow: 0px 16px 27px 0px rgba(0, 0, 0, 0.24);
        box-shadow: 0px 16px 27px 0px rgba(0, 0, 0, 0.24);
        font-size:18px; letter-spacing: -0.04em;
        background:#d21f1e url(../img/ico/ico_arrow_right.png) 126px center no-repeat;
        display:inline-block !important;
    }

    /* section2 */
    #section2 {
        background:#f8f8f8;
    }
    #section2 .section_wrap .bg {
        margin-top:9px; margin-bottom:50px;
        text-align:center;
    }
    #section2 .section_wrap .text_box .main_text {
        margin-top:60px; padding-bottom:15px;
    }
    #section2 .section_wrap .text_box .sub_text {
        margin-bottom:28px;
    }

    /* section3 */
    #section3 .section_wrap .section_inner_wrap {
        width:calc(100% - 32px);
    }
    .tec_count_wrap {
        width:100%;
    }
    #section3 .tec_box ul li {
        width:50%;
    }
    .tec_box {
        width:100%;
    }
    .tec_box .icon {
        height:18.056vw;
    }
    .tec_box .icon:after {
        top:19vw; height:10px;
    }
    .tec_box .text {
        font-size:3.056vw; font-weight:500; margin-top:5.278vw;
        margin-bottom:33px;
    }
    .tec_box .led .icon {
        background-size:12.778vw 12.778vw;
    }
    .tec_box .data .icon {
        background-size:9.028vw 12.500vw;
    }
    .tec_box .auto .icon {
        background-size:19.306vw 14.722vw;
    }
    .tec_box .smart .icon {
        background-size:14.861vw 15.278vw;
    }
    .tec_count_wrap .count #count01 {
        padding-right:10px; width:auto;
    }
    .tec_count_wrap .count #count02 {
        padding-right:5px; width:auto;
    }
    .tec_count_wrap .count p:first-child {
        font-size:8.056vw;
    }
    .tec_count_wrap .count p:last-child {
        font-size:3.056vw;
    }
    .tec_count {
        margin-top:0; margin-bottom:60px;
    }
    .tec_count_wrap {
        width:calc(100% - 32px);
    }
    /* section4 */
    #section4 .main_question input, #section4 .main_question textarea {
        width:100%;
    }
    #section4 .section_wrap .contact {
        float: none;
    }
    #section4 .main_question input, #section4 .main_question textarea {
        font-size:13px;
    }
    #section4 .main_question label {
        font-size:13px;
    }
    #section4 .main_question button {
        width:90px; height:35px;
    }
    #section4 .map {
        float:none; width:calc(100% - 32px); margin:0 auto;
        right:0; margin-top:40px; margin-bottom:60px;
    }
    #section4 #map iframe {
        height:55.556vw;
    }
    #section4 .move_top {
        z-index:10; right:16px; bottom:-23px;
        width:11.944vw; height:11.944vw;
        background-position:center 20%;
    }
    #section4 .move_top a {
        font-size:13px; font-size:3.611vw;
    }
    #section4 .move_top a span {
        bottom:20%;
    }
    #section4 .map .text_box {
        font-size:13px;
    }
    #section4 .main_question input, #section4 .main_question textarea {
        -webkit-appearance:none;
        -moz-appearance:none;
        appearance:none;
        border-radius: 0;
    }
    #section4 .main_question input {
        line-height:40px;
    }
    #section4 .main_question input#region,
    #section4 .main_question input#email {
        margin-left:0;
    }
    #section4 .agree_wrap .agree {
        width:90vw; height:50%;
    }

}
@media screen and (max-width : 768px) {
    #section1 .section_wrap .text_box a {
        display:inline-block !important;
        font-size:14px;
        width:120px; height:35px; line-height:35px;
        padding:0 0 0 16px; 
        border-radius: 18px;
        background: #d21f1e url(../img/ico/ico_arrow_right.png) 105px center no-repeat;
        background-size:18px;
    }
    #section2 .section_wrap .text_box a {
        font-size:14px;
        width:120px; height:35px; line-height:35px;
        padding:0 0 0 16px; 
        border-radius: 18px;
        background: #d21f1e url(../img/ico/ico_arrow_right.png) 105px center no-repeat;
        background-size:18px;
    }
}
@media screen and (max-width : 640px) {
    .fp-section,
    .fp-slide,
    .fp-tableCell{
        height: auto !important;
    }
    #section1 {
        height:500px !important;
    }
    .section .section_wrap .text_box .main_text {
        font-size:8.611vw;
    }
    .section .section_wrap .text_box .sub_text {
        font-size:3.889vw;
    }
    #section2 .section_wrap .text_box .main_text {
        font-size:8.611vw;
    }
    #section2 .section_wrap .text_box .sub_text {
        font-size:3.611vw; line-height:1.307;
    }
    #section3 .section_wrap .text_box .sub_text {
        text-align:left; font-size:3.611vw; font-weight:400;
    }
}
