@charset "utf-8";

.con_footer .service_area .sub_text {letter-spacing:-0.8px;}

/* -----------------------------------------------------------  landing 01 디자인 변경 201007 */
/* ------------------------ 공통 */
.wrap {position:relative;min-width:1100px;overflow:hidden;background:#fff;-webkit-overflow-scrolling:auto;}

.wrap_landing {width:100%;-webkit-text-size-adjust:none;background:#efefef;}
.wrap_landing  img {max-width:100%;}
.wrap_landing h1, h2, h3, h4, h5 {line-height:110%;font-weight:bold;}
.wrap_landing p {line-height:150%;font-size:18.5px;}
.wrap_landing p.lv2 {color:#4c565e;}
.wrap_landing p b {font-weight:500;}
.wrap_landing p b.lv2 {color:#0059a6;font-size:23px;font-weight:bold;line-height:145%;}
.wrap_landing p.info {font-size:17px;}
.wrap_landing p.info::before {content: '!';display:inline-block;width:19px;height:19px;line-height:19px;margin-right:6px;font-size:14px;font-weight:bold;border-radius:100px;color:#6c7f94;border:1px solid#6c7f94;}

.wrap_footer {min-width:1280px;}

/* title & simbol & txt */
.section_tit {font-size:37px;text-align:center;color:#002246;line-height:130% !important;padding:0 0 25px 0;letter-spacing:-3px;}
.section_tit b {color:#0059a6;}
.section_tit .thin_txt {font-size:32px;font-weight:300;letter-spacing:-2px;}
.section_tit span {padding:0 5px;font-weight:500;}

.simbol_ok:before {display:inline-block;content:'';width:46px;height:42px;background:url('/assets/img/landing/001/icon.png') no-repeat;background-position:-4px -330px;margin:0 8px 0 0;vertical-align:bottom;}
.simbol_om:before {display:inline-block;content:'';width:46px;height:46px;background:url('/assets/img/landing/001/icon.png') no-repeat;background-position:-4px -381px;margin:0 6px 0 0;vertical-align:bottom;}
.simbol_ob:before {display:inline-block;content:'';width:34px;height:46px;background:url('/assets/img/landing/001/icon.png') no-repeat;background-position:-10px -868px;margin:0 8px 0 0;vertical-align:bottom;}

.om_color {color:#1776bc !important;}

/* display */
.d_block {display:block;}

/* margin top value */
.mt5 {margin-top:5px;}
.mt10 {margin-top:10px;}
.mt20 {margin-top:20px;}
.mt30 {margin-top:30px;}
.mt40 {margin-top:40px;}
.mt50 {margin-top:50px;}

/* margin bottom value */
.mb20 {margin-bottom:20px;}
.mb30 {margin-bottom:30px;}
.mb40 {margin-bottom:40px;}
.mb50 {margin-bottom:50px;}
.mb60 {margin-bottom:60px;}

/* padding bottom value */
.pd00 {padding:0 !important;}
.pt20 {padding-top:20px;}

/* btn_link */
.btn_link {position:relative;display:block;width:300px;height:55px;line-height:55px;margin:40px auto;padding:0 20px;background:#212c35;letter-spacing:-1.2px;font-weight:normal !important;font-size:20px;text-align:center;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.btn_link:hover {background:#4c565e;color:#fff;transition:all 200ms ease-in-out;}
.btn_link span:after {content:"";display:inline-block;width:9px;height:9px;border-top:2px solid #fff;border-right:2px solid #fff;-webkit-transform: rotate(45deg);transform: rotate(45deg);vertical-align:middle;margin:0 0 3px 13px;}

/* text color */
.txt_dark {color:#212c35 !important;}
.txt_fff {color:#ffffff !important;}
.txt_danger {color:#ee334e !important;}
.txt_orange {color:#ff8300;}

/* ------------------------ 섹션별 */
/* section01 */
.section01_1 {position:relative;height:840px;background:url('/assets/img/landing/001/bg_section01.jpg') no-repeat center #fff;text-align:center;padding:100px 0 0 0;}
.section01_1 p.info {font-size:16px;line-height:135%;color:#8b959c;letter-spacing:-0.5px;}
.section01_1 p.info::before {width:16px;height:16px;line-height:16px;margin:0 4px 4px 0;font-size:11px;color:#8b959c;border:1px solid #8b959c;vertical-align:middle;}

.section01_2 {width:100%;background:#212c35; padding:0 0 110px 0;text-align:center;}
.section01_2 .section_tit {padding:110px 0 0 0;font-size:35px;line-height:138% !important;}
.section01_2 > ul {position:relative;width:1000px;margin:-75px auto 0 auto;color:#212c35;z-index:1000 !important}
.section01_2 > ul:after {display:block;content:'';clear:both;}
.section01_2 > ul > li {float:left;width:477px;min-height:228px;margin-right:46px;background:#fff;border:3px solid #ff8300;text-align:center;box-sizing:border-box;-webkit-box-sizing:border-box;border-radius:15px 15px;}
.section01_2 > ul > li:last-child {margin:0;}

.section01_2 > ul > li .title_bx {padding:13px 0 17px 0;background:#ff7f00;color:#fff;font-size:21px;line-height:100%;font-weight:bold;border-radius:8px 8px 0 0;}
.section01_2 > ul > li h2 {font-size:28px;font-weight:800;letter-spacing:-1px;padding-top:50px;}
.section01_2 > ul > li:last-child h2 {padding-top:29px;}
.section01_2 > ul > li p {font-size:19px;padding-top:10px;letter-spacing:-0.8px;}
.section01_2 > ul > li span::before {display:inline-block;content:'+';width:18px;height:18px;line-height:16px;font-size:18px;font-weight:bold;border:2px solid #ff8300;margin:0 7px 4px 0;border-radius:50px 50px;vertical-align:middle;}


/* 타사 비교 테이블 */
.section01_2 .vs_table {display:table; width:1000px;margin:55px auto 0 auto; color:#fff;}
.section01_2 .vs_table::after {display:block;content:'';clear:both;}
.section01_2 .vs_table .row1, .section01_2 .vs_table .row2, .section01_2 .vs_table .row3 {display:table-row;}
.section01_2 .vs_table .cell {display:table-cell;width:19.5%;height:120px;line-height:120%;font-size:20px;text-align:center;padding:0 10px;vertical-align:middle;font-weight:500;}
.section01_2 .vs_table .cell b {font-size:26px;font-weight:700;}
.section01_2 .vs_table .cell span {display:block;font-size:15px;font-weight:300;}
.section01_2 .vs_table .th_cell {position:relative;width:22%;font-size:20px;font-weight:bold;background:#19232c !important;border-top:1px solid #212c35;}
.section01_2 .vs_table .round_vs:before {position:absolute;top:-28px;left:50%;margin-left:-28px;display:block;content:'VS';width:52px;height:52px;line-height:52px;font-size:20px;font-weight:800;background:#19232c;border:2px dotted #ff8300;border-radius:50px 50px;}

.section01_2 .vs_table .row1 {background:#323d45 !important;}
.section01_2 .vs_table .row1 .cell {height:70px;font-size:15px;font-weight:500;border-right:1px solid #242e36;}
.section01_2 .vs_table .row1 .cell span {font-size:13px;padding-top:1px;font-weight:300;}
.section01_2 .vs_table .row2 .cell {background:#424e57;border-right:1px solid #38444d;}
.section01_2 .vs_table .row3 .cell{background:#ff8610;border-right:1px solid #bc6b1b;}

.round_t_left {border-radius:15px 0 0 0;-webkit-border-radius:15px 0 0 0;}
.round_t_right {border-radius:0 15px 0 0;-webkit-border-radius:0 15px 0 0;}
.round_b_left {border-radius:0 0 0 15px;-webkit-border-radius:0 0 0 15px;}
.round_b_right {border-radius:0 0 15px 0;-webkit-border-radius:0 0 15px 0;}


/* section02 */
.section02 {position:relative;width:1000px;margin:120px auto 0 auto;background:#fff;color:#4c565e;font-size:18px;text-align:center;letter-spacing:-1px;border-top:1px solid #eee;box-shadow:0 5px 5px 0.1px #ccc;}
.section02 .bg_news {padding:95px 0 105px 0; background: url('/assets/img/landing/001/bg_news.jpg') center no-repeat;background-size:cover;}

/* 뉴스기사 */
.news_grp {padding:0 50px;margin:20px 0 0 0;}
.news_grp:after {display:block;content:'';clear:both;}
.news_grp > li {float:left;width:48%;line-height:150%;font-size:16px;margin-right:4%;box-sizing:border-box;}
.news_grp > li:last-child {margin:0;}
.news_grp > li h5 {color:#11a0a5;font-size:21px;line-height:150%;font-weight:700;padding:0 0 8px 0;box-sizing:border-box;}
.news_grp > li:last-child h5 {color:#1776bc;}
.news_grp > li b {font-weight:500;color:#212c35;}

.news_grp > li .news_bx {background:url('/assets/img/landing/001/bg_paper.svg') no-repeat;background-size:cover;}
.news_grp > li .news_bx ul {padding:40px 38px 36px 38px;}
.news_grp > li .news_bx ul:after {display:block;content:'';clear:both;}
.news_grp > li .news_bx ul li {position:relative;background:#fff;min-height:28px;line-height:28px;margin-bottom:12px;font-size:16px;font-weight:400;text-align:center;color:#888;padding:0 0 0 48px;}
.news_grp > li .news_bx ul li:last-child {margin:0;}
.news_grp > li .news_bx ul li:before {display:inline-block;content:'NEWS';position:absolute;top:0;left:0;width:48px;min-height:29px;background:#ee2e4d;font-size:12.5px;font-weight:500;color:#fff;letter-spacing:-0.5px;}

.news_grp > li .user_bx {padding:40px 20px 40px 120px;background:#fff;color:#4c565e;border:4px solid #e6e7e8;position:relative;text-align:left;}
.news_grp > li.r_bx .user_bx:before {display:inline-block;content:'';position:absolute;top:50%;margin-top:-35px;left:32px;width:70px;height:70px;background:url('/assets/img/landing/001/user_oldboy.png') center left no-repeat;background-size:70px 70px;}
.news_grp > li.l_bx .user_bx:before {display:inline-block;content:'';position:absolute;top:50%;margin-top:-35px;left:32px;width:70px;height:70px;background:url('/assets/img/landing/001/user_woman.png') center left no-repeat;background-size:70px 70px;}


/* 오피스키퍼 */
.content02 {padding:90px 0 70px;background:#f4f4f4;}
.content02 .ok_feature {position:relative;width:831px;height:253px;margin:0 auto 60px auto;background:url('/assets/img/landing/001/ok_feature.png') no-repeat;}
.content02 .ok_feature::after {display:block;content:'';clear:both;}
.content02 .ok_feature ul {margin-left:223px;text-align:left;}
.content02 .ok_feature ul li {line-height:105%;font-size:14px;letter-spacing:-1px;font-weight:500;}
.content02 .ok_feature ul li span {display:inline-block;width:117px;margin-right:7px;text-align:center;vertical-align:text-top;}
.content02 .ok_feature ul li.first_line {padding-top:90px;}
.content02 .ok_feature ul li.second_line {padding:84px 0 0 62px;}

/* 오피스메신저 */
.content03 {padding:0 0 70px 0;}
.content03 .om_visual {position:relative;width:100%;height:475px;background:#1776bc;padding-top:100px;margin-bottom:185px;}
.content03 .om_visual:before {display:block;content:'';clear:both;position:absolute;top:33px;left:38px;width:180px;height:32px; background:url('/assets/img/landing/001/logo_om.svg') center left  no-repeat;background-size:100%;}
.content03 .om_visual h1.section_tit {padding-bottom:30px;font-size:40px;line-height:115% !important;}
.content03 .om_visual span.thin_txt {font-size:40px;}

.content03 .om_feature {width:840px;margin:20px auto 60px auto;border:1px solid #b3bdc9;border-top:0;}
.content03 .om_feature:after {display:block;content:'';clear:both;}
.content03 .om_feature li {float:left;width:50%;}
.content03 .om_feature li h1 {font-size:20px;font-weight:500;text-align:center;height:52px;line-height:50px;background:#1776bc;color:#fff;}
.content03 .om_feature li:first-child h1 {background:#11a0a5;}
.content03 .om_feature li > ul {padding:40px 35px 27px 35px;line-height:100%;color:#1776bc;}
.content03 .om_feature li > ul.first {color:#6e7b83;border-right:1px dotted #b3bdc9;box-sizing:border-box;}
.content03 .om_feature li > ul:after {display:block;content:'';clear:both;}
.content03 .om_feature li > ul > li {width:50%;font-size:16px;line-height:130%;font-weight:500;margin-bottom:30px;}
.content03 .om_feature li > ul > li em {display:block;font-size:14px;padding-top:6px;}
.content03 .om_feature li > ul > li span {display:block;width:54px;height:54px;background:url('/assets/img/landing/001/icon.png') no-repeat;margin:11px auto;}
.content03 .om_feature li > ul > li span.icon01 {background-position:0 -432px;}
.content03 .om_feature li > ul > li span.icon02 {background-position:0 -486px;}
.content03 .om_feature li > ul > li span.icon03 {background-position:0 -540px;}
.content03 .om_feature li > ul > li span.icon04 {background-position:0 -594px;}
.content03 .om_feature li > ul > li span.icon05 {background-position:0 -648px;}
.content03 .om_feature li > ul > li span.icon06 {background-position:0 -702px;}
.content03 .om_feature li > ul > li span.icon07 {background-position:0 -756px;}
.content03 .om_feature li > ul > li span.icon08 {background-position:0 -810px;}


/* 오피스밸런스 */
.content04 {padding:95px 0 70px 0;background:#f4f4f4;border-top:1px solid #ddd;border-bottom:1px solid #ddd;}
.content04 .section_tit {color:#06292b;padding-bottom:20px;}
.content04 .section_tit b {color:#00a551;}
.content04 .lv2 b {font-weight:bold;}

.content04 .ob_feature {position:relative;width:831px;height:253px;margin:0 auto 60px auto;background:url('/assets/img/landing/001/ob_feature.png') no-repeat;}
.content04 .ob_feature::after {display:block;content:'';clear:both;}
.content04 .ob_feature ul {width:100%;margin-left:224px;text-align:left;}
.content04 .ob_feature ul li {line-height:110%;font-size:14px;letter-spacing:-1px;font-weight:500;}
.content04 .ob_feature ul li span {display:inline-block;width:117px;margin-right:7px;text-align:center;vertical-align:text-top;}
.content04 .ob_feature ul li.first_line {padding-top:85px;}
.content04 .ob_feature ul li.second_line {padding:78px 0 0 62px;}


.content02 .ok_feature > img {display: none;}

/* section03 */
.section03 {padding-bottom:100px;border-bottom:1px solid #e6e6e6;text-align:center;padding:90px 0 110px 0;}
.section03 .section_tit, .thin_txt {font-size:33px;line-height:160%;padding:0;}

.section03 .logobx {display:inline-block;}
.section03 .logobx img {width:170px;vertical-align:middle;}
.section03 .logobx::after {content:"";display:inline-block;width:1px;height:22px;background:#bac3cd;margin:0 20px 0 25px;vertical-align:middle;}

.section03 .contact a {display:inline-block;font-size:23px;font-weight:300;color:#4c565e;line-height:150%;vertical-align:middle;}
.section03 .contact a.callbx {font-weight:bold;letter-spacing:-1px;margin-right:15px;}
.section03 .contact a.callbx::before, 
.section03 .contact a.mailbx::before {content:"";display:inline-block;width:35px;height:35px;margin-right:5px;vertical-align:middle;}
.section03 .contact a.callbx::before {background:url('/assets/img/landing/001/icon.png') no-repeat;background-position:-9px -170px;}
.section03 .contact a.mailbx::before {background:url('/assets/img/landing/001/icon.png') no-repeat;background-position:-9px -225px;}

/* 하단 정부지원사업 문의 버튼 */
.section03 .btn_link {background:#ff7f00;margin-bottom:50px;}
.section03 .btn_link:hover {background:#ff9c00;color:#fff;transition:all 200ms ease-in-out;}

@media (max-width:1024px) {
    .wrap_landing {
        padding: 0 40px;
    }

    /* section01 */
    .section01_1 {
        width: calc(100% + 80px);
        height: auto;
        margin-left: -40px;
        padding: 90px 60px 35%;
    }

    .section01_2 {
        width: calc(100% + 80px);
        margin-left: -40px;
        padding: 0 40px 110px;
    }

    .section01_2 > ul {
        width: 100%;
    }

    .section01_2 > ul > li {
        width: 49%;
        margin-right: 2%;
    }

    .section01_2 > ul > li h2 {
        font-size: 26px;
    }

    .section01_2 > ul > li p {
        font-size: 16px;
    }

    .section01_2 .vs_table {
        width: 100%;
    }

    /* section02 */

    .section02 {
        width: 100%;
    }

    .section02 .section_tit {
        padding: 0 40px 25px;
    }

    .section02 .section_tit br {
        display: block !important;
    }
    
    .bg_news {
        background-size: cover;
        padding: 0 40px;
    }

    .tlc_section_contents {
        width: 100%;
    }

    .news_grp {
        padding: 0;
    }

    .news_grp > li {
        float: none;
        margin: auto;
        margin-bottom: 20px;
        width: 418px;
    }

    .news_grp > li:last-child {
        margin:auto;
        margin-bottom: 0;
    }

    .content03 .om_feature {
        width: 100%;
        padding: 0 40px;
        border: none;
    }

    .content03 .om_feature > li {
        display: block;
        width: 400px;
        margin: auto;
        margin-bottom: 20px;
        float: none;
       border: 1px solid #b3bdc9;
       border-top: none;
    }

    .content03 .om_feature li:last-of-type {
        margin-bottom: 0;
    }

    .content03 .om_feature li > ul > li br {
        display: block !important;
    }

    /* contents02 */
    .content02 {
        padding: 90px 40px 70px;
    }
    
    .content02 .ok_feature {
        background: transparent;
        width: 100%;
        height: auto;
    }

    .content02 .ok_feature > ul {
        display: none;
    }

    .content02 .ok_feature > img {
        display: block;
        margin-top: 30px;
    }


}

@media (max-width:768px) {
    .wrap_landing {
        padding: 0 20px;
    } 

    .wrap_landing p {
        font-size: 16px;
    }

    .section_tit {
        font-size: 30px !important;
    }

    .section_tit .thin_txt {
        display: block;
        font-size: 25px !important;
    }

    .section02 .section_tit br  {
        display: none !important;
    }
    
    .section_tit .simbol_om {
        display: inline-block;
    }

    .section_tit .simbol_om::before {
        width: 36px;
        height: 35px;
        background-size: cover;
        background-position-x: 0;
        background-position-y: -252px;
    }

    
    .section_tit .simbol_ok {
        display: inline-block;
    }

    .section_tit .simbol_ok::before {
        width: 36px;
        height: 35px;
        background-size: cover;
        background-position-x: 0;
        background-position-y: -252px;
    }

    /* section01 */
   
    .section01_1 {
        width: calc(100% + 40px);
        margin-left: -20px;
        padding: 60px 20px 130px;
    }
/* 
    .section01_2 > ul {
        margin: -30px auto 0;
    } */

    .section01_2 {
        width: calc(100% + 40px);
        margin-left: -20px;
        padding: 0 20px 60px;
    }

    .section01_2 > ul > li {
        width: 100%;
        margin-right: 0;
        float: none;
        margin-bottom: 20px;
        height: auto;
        min-height: auto;
    }

    .section01_2 > ul > li:last-of-type {
        margin-bottom: 0;
    }
    
    .section01_2 > ul > li .title_bx {
        font-size: 18px;
    }   

    .section01_2 > ul > li .contents_bx {
        padding: 20px;
    }

    .section01_2 > ul > li h2 {
        padding: 0 !important;
        font-size: 22px;
    }

    .section01_2 > ul > li p {
        padding: 10px 0 7px;
    }

    .section01_2 .section_tit {
        padding: 60px 0 0;
        word-break: keep-all;
    }

    .section01_2 .section_tit br {
        display: block !important;
    }

    .section01_2 .vs_table .th_cell {
        font-size: 15px;
        word-break: break-all;
    }

    .section01_2 .vs_table .cell {
        font-size: 16px;
    }

    .section01_2 .vs_table .cell b {
        font-size: 18px;
    }

    .section01_2 .vs_table .row1 .cell {
        font-size: 14px;
    }

    /* section02 */
    .section02 {
        margin: 60px 0 0;
    }

    .section02 .bg_news {
        padding: 60px 20px;
    }

    /* contents03 */ 

    .section02 .section_tit {
        padding: 0 20px 25px;
    }

    .content03 {
        padding: 0 0 60px;
    }

    .content03 .om_visual {
        height: auto;
        margin-bottom: 60px;
    }

    .content03 .om_visual span.thin_txt {
        font-size: 32px;
        display: block;
    }

    .content03 .om_feature {
        padding: 0 20px;
    }

    /* contents02 */
    .content02 {
        padding: 60px 20px;
    }

    /*section03*/
    .btn_link {
        font-size: 16px;
        width: 250px;
        max-width: 100%;
        height: 50px;
        line-height: 50px;
        margin-bottom: 0;
    }
    
    /* section03 */

    .section03 {
        padding: 60px 0;
    }

    .section03 .section_tit .thin_txt {
        font-size: 25px !important;
    }
    
    .section03 .logobx {
        display: block;
        margin-bottom: 15px;
    }

    .section03 .logobx::after {
        display: none;
    }
}

@media (max-width:587px) {

    .section_tit .thin_txt {
        font-size: 20px !important;
    }

}

@media (max-width:487px) {
    .section_tit {
        font-size: 25px !important;
    }

    .section_tit span {
        display: block;
    }

    .section_tit .thin_txt {
        margin-bottom: 10px;
    }

    /* section01 */

    .section01_2 {
        padding: 0 20px 40px;
    }

    .section01_2 .section_tit {
        padding: 40px 0 0;
    }

    .section01_2 .mt50 {
        margin-top: 40px;
    }

    .vs_table_wrap {
        overflow: auto;
    }

    .vs_table_wrap .vs_table {
        width: 487px;
        margin: 40px auto 0;
    }

    /* section02 */

      .section02 {
        margin: 40px 0 0;
    }

    .section02 .bg_news {
        padding: 40px 20px;
    }
    
    .news_grp > li {
        width: 100%;
    }

    .news_grp > li .news_bx ul {
        padding: 20px;
    }

    .news_grp > li .news_bx ul li {
        padding: 35px 5px 5px 5px;
    }

    .news_grp > li .news_bx ul li:before {
        width: 100%;
    }

    .news_grp > li.l_bx .user_bx:before,
    .news_grp > li.r_bx .user_bx:before {
        display: block;
        position: relative;
        left:auto;
        margin: auto;
    }

    .news_grp > li .user_bx {
        padding: 40px 25px;
        text-align: center;
        font-size: 15px;
    }

    /* contents03 */
    
    .content03 {
        padding: 0 0 40px;
    }

    .content03 .om_feature > li {
        width: 100%;
    }

    .content03 .om_feature li > ul {
        padding: 25px 0;
    }

    .content03 .om_feature li > ul > li {
        font-size: 14px;
    }

    .content03 .om_feature li > ul > li:nth-of-type(n+3) {
        margin-bottom: 10px;
    }

    
    /* contents02 */
    .content02 {
        padding: 40px 20px;
    }

    /* section03 */
    
    .section03 {
        padding: 40px 0;
    } 
}

@media (max-width:440px) {
    

    /* section01 */
    .section01_2 > ul > li h2 {
        font-size: 20px;
    }
}