/** {font-family: 'Noto Sans KR', sans-serif; font-family: 'Roboto', sans-serif;}*/
html {font-size:10px;}
body {overflow-x:hidden;}
#wrap {}

/*side_menu*/
#wrap .side_menu {
    position:absolute; left:0; top:0;
    width:100%; height:100vh;
    background:rgba(0, 0, 0, 0.5); z-index:9999;
}
#wrap .side_menu ul {
    width:280px; height:100vh; background:#f7f7f7;
    position:absolute; right:-280px; top:0;
    text-align:center;
}
#wrap .side_menu ul li {}
#wrap .side_menu ul .side_logo {margin:50px 0;}
#wrap .side_menu ul .side_exit {
    font-size:2.5rem; font-weight:700; position:absolute; right:30px; top:20px; cursor:pointer; padding:0;
}
#wrap .side_menu ul .side_exit:hover {color:#4a90f9;}
#wrap .side_menu ul .side_item {margin-bottom:30px;}
#wrap .side_menu ul li a {
    font-family: 'Roboto', sans-serif;
    font-size:2.0rem; font-weight:500;
}
#wrap .side_menu ul li a:hover {color:#4a90f9;}

/*header 영역*/
#wrap header {
    width:100%; height:85px;
    position:absolute; top:0; left:0; z-index:999;
}
#wrap header .h_inner {
    position:relative;
    width:1320px; font-size:1.2rem; font-family: 'Roboto', sans-serif; height:100%;
    margin:0 auto; display:flex; justify-content:space-between;
    align-items:center;
}
#wrap header .h_inner .h_left {display:flex;}
#wrap header .h_inner .h_left .mainLogo {}
#wrap header .h_inner .h_left .mainLogo a {display:inline-block; height:85px;}
#wrap header .h_inner .h_left .mainLogo a img {padding-top:21px;}
#wrap header .h_inner .h_left nav {margin-left:122px; width:395px;}
#wrap header .h_inner .h_left nav ul {display:flex; justify-content:space-between; align-items:center; height:85px;}
#wrap header .h_inner .h_left nav ul li {}
#wrap header .h_inner .h_left nav ul li a {
    color:#fff; font-weight:700; height:100%;
    display:inline-block; height:85px; line-height:85px;
}
#wrap header .h_inner .h_left nav ul li a:hover {color:#4a90f9;}
#wrap header .h_inner .h_right {
    display:flex; justify-content:flex-end;
    align-items:center;
}
#wrap header .h_inner .h_right button {
    color:#fff; font-weight:500;
    font-size:1.2rem; background:none;
    border:0; height:85px; line-height:85px;
}
#wrap header .h_inner .h_right button img {margin-right:16px;}

/*hambuger menu*/
#wrap header .h_inner .h_right .hambuger {
    cursor:pointer; margin-left:20px; display:none;
}
#wrap header .h_inner .h_right .hambuger:hover span {background:#4a90f9;}
#wrap header .h_inner .h_right .hambuger span {
    display:block;
    width:25px; height:3px; background:#fff;
}
#wrap header .h_inner .h_right .hambuger .bar2 {margin:5px 0;}

/*콘텐츠 영역*/
#wrap #container {width:100%;}

/*section1*/
#wrap #container #s1 {font-family: 'Roboto', sans-serif; position:relative; width:100%;}
#wrap #container #s1 .s1_txt {
    font-size:3.688rem; color:#fff; font-weight:700;
    text-align:right; width:1320px;
    position:absolute; left:50%; transform:translateX(-50%);
    bottom:168px; line-height:1.3;
}

/*section2*/
#wrap #container #s2 {
    font-family: 'Roboto', sans-serif; text-align:center;
    padding:127px 0 120px;
}
#wrap #container #s2 h2 {color:#131313; font-size:3.0rem; font-weight:500;}
#wrap #container #s2 p {color:#5d5d5d; font-size:1.5rem; font-weight:400; margin:16px 0 77px;}
#wrap #container #s2 .s2_item {width:660px; margin:0 auto;}
#wrap #container #s2 .s2_item:after {content:''; clear:both; display:block;}
#wrap #container #s2 .s2_item div {
    width:calc(100% / 4); float:left;
    margin-bottom:69px; position:relative;
}
#wrap #container #s2 .s2_item div a {height:110px; display:inline-block;}
#wrap #container #s2 .s2_item div a img {width:110px; height:110px;}
#wrap #container #s2 .s2_item div a span {
    position:absolute; left:50%; transform:translateX(-50%); top:122px;
    color:#3a3a3a; font-size:1.5rem; font-weight:500;
    line-height:1.1;
}

/*section3*/
#wrap #container #s3 {font-family: 'Roboto', sans-serif; height:420px; background:#f7f7f7;}
#wrap #container #s3 .s3_inner {
    width:1278px; height:100%; display:flex; justify-content:flex-start; position:relative; align-items:center; margin:0 auto;}
#wrap #container #s3 .s3_inner .s3_l_img {position:relative; top:58px; left:0;}
#wrap #container #s3 .s3_inner .s3_right {width:425px;}
#wrap #container #s3 .s3_inner .s3_right .s3_tit {
    font-size:3.0rem; font-weight:500; color:#3a3a3a;
}
#wrap #container #s3 .s3_inner .s3_right .s3_tit span {
    font-size:2.0rem; font-weight:500;
}
#wrap #container #s3 .s3_inner .s3_right .s3_txt {
    font-size:1.5rem; font-weight:400; color:#5d5d5d;
    margin:31px 0 36px; line-height:1.4;
    
}
#wrap #container #s3 .s3_inner .s3_right .s3_link {display:block; text-align:right; font-size:1.3rem; font-weight:500; color:#434343;}
#wrap #container #s3 .s3_inner .s3_right .s3_link img {position:relative; bottom:-1px; margin-left:10px;}
#wrap #container #s3 .s3_inner .s3_r_img {
    position:absolute; right:0; top:-24px;
}

/*section4*/
#wrap #container #s4 {
    font-family: 'Roboto', sans-serif;
    width:100%; background:gray;
    background:url(../img/s4_bg.png) no-repeat center bottom 33px; padding:185px 0 177px; height:1055px;
}
#wrap #container #s4 .s4_inner {
    width:1320px; margin:0 auto; text-align:center;
    height:100%; position:relative;
}
#wrap #container #s4 .s4_inner h2 {
    font-size:3.0rem; font-weight:500; color:#3a3a3a;
}
#wrap #container #s4 .s4_inner p {
    font-size:1.5rem; font-weight:400; color:#3a3a3a;
    margin:17px 0 87px;
}
#wrap #container #s4 .s4_inner .s4_item {position:relative;}
#wrap #container #s4 .s4_inner .s4_item img {position:absolute; transition:.7s linear;}
.active_l {left:0; top:0; z-index:2}
.active_c {left:50%; top:24px; transform:translateX(-50%); z-index:3;}
.active_r {left:742px; top:0; z-index:2}
#wrap #container #s4 .s4_inner .s4_link {
    font-size:1.3rem; font-weight:700; color:#434343;
    position:absolute; bottom:0; width:209px; height:42px;
    border-radius:21px; border:1.3px solid #434343;
    display:inline-block; line-height:42px; background:#fff;
    left:50%; transform:translateX(-50%);
}
#wrap #container #s4 .s4_inner .s4_link img {
    margin-left:10px; position:relative;
}

/*section5*/
#wrap #container #s5 {font-family: 'Roboto', sans-serif; width:100%; background:#f7f7f7; padding:76px 0 48px;}
#wrap #container #s5 .s5_inner {
    width:1142px; display:flex; justify-content:space-between;
    margin:0 auto;
}
#wrap #container #s5 .s5_inner .s5_left {width:550px;}
#wrap #container #s5 .s5_inner .s5_left .s5_tit {
    font-size:3.0rem; font-weight:700; color:#434343;
    margin-bottom:39px;
}
#wrap #container #s5 .s5_inner .s5_left .s5_txt {
    font-size:1.5rem; font-weight:400; color:#434343;
    line-height:1.4;
}
#wrap #container #s5 .s5_inner .s5_right {
    display:flex; flex-flow:wrap column; align-items:flex-end;
    justify-content:flex-end;
}
#wrap #container #s5 .s5_inner .s5_right > img {
    position:relative; right:-20px;
}
#wrap #container #s5 .s5_inner .s5_right .s5_link {
    font-size:1.3rem; font-weight:500; color:#434343; position:absolute;
}
#wrap #container #s5 .s5_inner .s5_right .s5_link img {
    margin-left:10px; position:relative; top:1px;
}

/*section6*/
#wrap #container #s6 {font-family: 'Roboto', sans-serif; width:100%; height:517px; display:flex; align-items: center;}
#wrap #container #s6 ul {
    margin:0 auto; width:790px;
    display:flex; justify-content:space-between;
}
#wrap #container #s6 ul li {position:relative; text-align:center;}
#wrap #container #s6 ul li img {height:68px; margin-bottom:20px;}
#wrap #container #s6 ul li span {
    display:block;
    font-size:2.0rem; font-weight:500; color:#3a3a3a;
}

/*footer 영역*/
#wrap footer {width:100%; height:708px; background:#555; font-family: 'Roboto', sans-serif;}
#wrap footer .f_inner {
    width:1320px; height:100%;
    margin:0 auto; padding:146px 0 148px;
    display:flex; flex-flow:wrap column;
    justify-content:space-between;
}
#wrap footer .f_inner .f_top {
    font-size:2.0rem; color:#fff;
    display:flex; justify-content:flex-start;
}
#wrap footer .f_inner .f_top .f_follow {}
#wrap footer .f_inner .f_top .f_follow p {font-weight:500;}
#wrap footer .f_inner .f_top .f_follow .social_link {
    margin-top:36px; width:130px;
    display:flex; justify-content:space-between;
    align-items:center;
}
#wrap footer .f_inner .f_top .f_follow .social_link a {}
#wrap footer .f_inner .f_top .f_follow .social_link a img {}
#wrap footer .f_inner .f_top .f_about {margin-left:416px;}
#wrap footer .f_inner .f_top .f_about p {font-weight:500;}
#wrap footer .f_inner .f_btm {}
#wrap footer .f_inner .f_btm p {font-size:1.3rem; font-weight:500; color:#fff;}