body{word-break:keep-all;}

/* 서브페이지 키비쥬얼 */
#SUB_KEYVISUAL .gu_sub_top .kv_img_area{background-image: url('../../images/footer/KV_media.jpg')}

#HEADER #GNB .gnb_inner{border-bottom:1px solid rgba(0,0,0,.1); box-sizing:border-box;}

#SUB_KEYVISUAL .kv_inner {max-width: 1116px; margin: 0 auto;}

.gu_tab_depth3 {max-width: 1116px; text-align:left;}
.gu_tab_depth3 ul li{margin:0;}

#SUB_KEYVISUAL .gu_sub_top .sec_inner,#SUB_KEYVISUAL .gu_sub_top .kv_img_area {height: 244px; margin:0 auto;}
#SUB_KEYVISUAL .gu_sub_top{padding:0;}
#SUB_KEYVISUAL .gu_sub_top h1{left:0; font-size:46px;}
#SUB_KEYVISUAL .gu_sub_top .kv_img_area:before {background: rgba(255,255,255,1); }
#INDICATOR .indicator_inner a:before {color: rgba(0,0,0,.6);}
#SUB_KEYVISUAL .gu_sub_top h1, #INDICATOR .indicator_inner a{color: #000;}
#INDICATOR {bottom: -50px;  right:0; z-index:3;}


.gu_contents_depth3{display:block;}

#MEDIA .gu_contents_wrap .gu_grid_sm .gu_left_grid .gu_sort_area{font-size:18px;}
#MEDIA  .gu_contents_wrap .gu_grid_sm .gu_left_grid .sub_desc {font-size: 14px; color: #666; margin-bottom:16px;}

/* gu_right_grid */
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .sort_table{display:none;}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .on{display:block;}

#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li {border-bottom: 1px solid rgba(0, 0, 0, .1); padding-bottom: 70px}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .text{font-size:18px; line-height:32px; color:#444;}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .bold {color: #000; margin-bottom: 24px;}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul .signboard_install .text {margin-top: 39px;}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .title {font-size: 24px; line-height: 36px; padding: 70px 0 38px; }
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul .install_purpose .title {padding-top: 140px;}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .title_desc {font-size: 20px; line-height: 32px; margin-bottom: 39px;}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul .information_management .middle {margin-top: 71px;}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .num_text,
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section .hyphen_text,
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .dot_text{font-size:18px; line-height:32px;
    color:#444; position:relative; padding-left:20px;}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .dot_text:before{content:''; display:inline-block;
    position:absolute; left:0; top:14px; width:4px; height:4px; border-radius:2px; background-color:#444;}

#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .num_text {margin-bottom: 35px;}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .num_text.list2:before{content:'2.';}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .num_text.list3:before{content:'3.';}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .num_text.list4:before{content:'4.';}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .num_text.list5:before{content:'5.';}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .num_text:before{content:'1.'; display:inline-block;
    position:absolute; left:0; top:0;}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .num_text:last-child{margin-bottom:0;}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section .hyphen_text:before{content:'-'; display:inline-block;
    position:absolute; left:0; top:0;}

#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .btn_area {position: relative; width: 270px; height: 162px;}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .btn_area div{width:50%; position:absolute; top:50%; transform:translateY(-50%);}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .btn_area .desc{right:0; text-align:right;}

#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section .bottom_date_area{font-size:18px; line-height:36px; margin: 69px 0 161px;}
#MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section .bottom_date_area .hyphen_text{color:#000;}



/* ================================== Laptop css ================================== */
@media all and (max-width: 1280px){
    /**********************************************************************************************************************************************************************************************************
       기능
    */
    .gu_contents_wrap {padding-top: 116px;}

    #SUB_KEYVISUAL .gu_sub_top h1{padding: 0 42px; font-size:48px;}
    #SUB_KEYVISUAL .gu_sub_top .sec_inner, #SUB_KEYVISUAL .gu_sub_top .kv_img_area {height: 251px;}
    #SUB_KEYVISUAL .kv_inner {max-width: 1116px; margin: 0 auto; padding: 0 34px; }
    #SUB_WRAPPER .gu_tab_depth3{margin:0 56px;}
    .gu_contents_wrap .gu_grid_sm .gu_left_grid .sub_desc{margin-bottom:25px;}

    #INDICATOR {right:87px;}

}

/* ================================== Tablet css ================================== */
@media all and (max-width: 1080px){
    /**********************************************************************************************************************************************************************************************************
        기능
    */

    .gu_contents_wrap {padding-top: 69px;}
    #SUB_KEYVISUAL {margin: 0 16px;}

    #SUB_KEYVISUAL .gu_sub_top h1{font-size: 40px; line-height: 52px; padding:0;}
    #SUB_KEYVISUAL .gu_sub_top .sec_inner, #SUB_KEYVISUAL .gu_sub_top .kv_img_area {height: 171px;}
    #SUB_WRAPPER .gu_tab_depth3{margin:0 34px;}


    .gu_tab_depth3 ul{text-align:left;}

    .gu_grid .gu_title span{display:block;}
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .text {font-size:14px; line-height:24px;}
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul .install_purpose .title,
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .title {font-size: 18px; line-height: 26px; padding: 35px 0 19px; }

    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li {padding-bottom: 35px; }

    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .title_desc {font-size: 15px; line-height: 24px; margin-bottom: 19px;}
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .num_text, #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section .hyphen_text, #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .dot_text {
        font-size:14px; line-height:24px;}

    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .btn_area {width: 210px; }
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section .bottom_date_area {font-size: 14px; line-height: 26px; margin: 34px 0 80px;}


}

/* ================================== Mobile css ================================== */
@media all and (max-width: 766px){
    /**********************************************************************************************************************************************************************************************************
        기능
    */

    .gu_contents_wrap {padding-top: 50px;}
    #SUB_KEYVISUAL .gu_sub_top h1{font-size: 36px; line-height: 48px;}
    #SUB_KEYVISUAL .kv_inner{padding:0;}

    #SUB_WRAPPER .gu_tab_depth3 {margin: 0;}
    #SUB_KEYVISUAL .gu_sub_top .kv_img_box{right:inherit;}

    #MEDIA .gu_grid .gu_title {line-height:26px;}
    #MEDIA .gu_grid .gu_title span {display:inline;}
    #MEDIA .gu_title + .gu_sort_area:nth-child(2) {margin-top:50px;}
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_left_grid .sub_desc {font-size: 12px;}
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_left_grid .gu_sort_area{margin-bottom:44px;}
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li {padding-bottom: 40px;}
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul .install_purpose .title,
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .title {font-size: 21px; line-height: 31px; padding: 40px 0 23px;}
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul .install_purpose .title{padding-top:90px;}
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .btn_area {height: 133px;}
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .btn_area .desc{font-size:11px; line-height:16px;}
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul .information_management .middle {margin-top: 59px;}
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section ul li .num_text {margin-bottom: 24px;}
    #MEDIA .gu_contents_wrap .gu_grid_sm .gu_right_grid .form_section .bottom_date_area {margin: 39px 0 100px;}


}
