@charset "utf-8";

/* visual area */
.wrap_con_visual{width:100%;background:url(../img/main/img_main_visual.jpg) no-repeat;background-position:50% 0;background-repeat:no-repeat;background-attachment:fixed;}
.con_visual{position:relative;width:1000px;margin:auto;height:720px;}
.con_visual .top_text{padding-top:190px;font-size:43px;line-height:40px;font-weight: 100; text-align:center;color:#fff;}
.con_visual .main_text{padding-top:30px;font-size:45px;line-height:135%;font-weight: 400;text-align:center;color:#fff;}
.con_visual .main_text:lang(ko){letter-spacing:-2px;}
.con_visual .main_text:lang(en){font-size:44px;line-height:44px;letter-spacing:-2px;}
.con_visual .btn_area{padding-top:60px;text-align:center;}
.con_visual .btn_area .btn_go{min-width:200px;}

.visual_list_area{width:670px;margin:165px auto 0;}
.visual_list_area ul.list_area:after{content:"";display:block;clear:both;}
.visual_list_area ul.list_area li{display:inline-block;padding:0 20px;}
.visual_list_area ul.list_area li a{display:inline-block;width:125px;height:125px;opacity:0.9;color:#fff;text-align:center;
-webkit-transition: background-color ease-in-out 0.3s, color ease-in-out 0.3s, border ease-in-out 0.3s;
transition: background-color ease-in-out 0.3s, color ease-in-out 0.3s, border ease-in-out 0.3s;}
.visual_list_area ul.list_area li a span{display:block;}
.visual_list_area ul.list_area li a span.img{width:60px;height:60px;margin:18px 0 6px;display:inline-block;background-image:url(../img/main/btn_top_sublist.png);background-repeat:no-repeat;}
.visual_list_area ul.list_area li a span.text{font-size:16px;line-height:16px;}

.visual_list_area ul.list_area li.list01 a{background:#2b4269;}
.visual_list_area ul.list_area li.list01 a span.img{background-position:0 0;}
.visual_list_area ul.list_area li.list01 a:hover{background:#253859;}

.visual_list_area ul.list_area li.list02 a{background:#5b80bf;}
.visual_list_area ul.list_area li.list02 a span.img{background-position:0 -60px;}
.visual_list_area ul.list_area li.list02 a:hover{background:#4e6ea4;}

.visual_list_area ul.list_area li.list03 a{background:#697a96;}
.visual_list_area ul.list_area li.list03 a span.img{background-position:0 -120px;}
.visual_list_area ul.list_area li.list03 a:hover{background:#596880;}

.visual_list_area ul.list_area li.list04 a{background:#1f2e47;}
.visual_list_area ul.list_area li.list04 a span.img{background-position:0 -180px;}
.visual_list_area ul.list_area li.list04 a:hover{background:#182337;}

.view_video{position:absolute;}

/* contents */
.main_row{width:100%;padding:90px 0;}
.main_row h2{font-size:45px;line-height:45px;text-align:center;font-weight:500;}
.main_row h2:lang(ko){letter-spacing:-2px;}
.main_row h2:lang(en){letter-spacing:-1px;}
.main_row .sub_text{text-align:center;padding-top:22px;font-size:19px;line-height:19px;color:#333;font-weight:400;}
.main_row .sub_text:lang(ko){letter-spacing:-1px;}
.main_row .sub_text:lang(en){letter-spacing:0;}

/* 01 */
.wrap_con_introduce{background:#f1f1f1;}
.wrap_con_introduce .con_introduce{width:1000px;margin:0 auto;padding-top:120px;}
.wrap_con_introduce .con_introduce h2{color:#003767;}

ul.introduce_list{padding-top:90px;}
ul.introduce_list:after{content:"";display:block;clear:both;}
ul.introduce_list li{float:left;width:200px;text-align:center;}
ul.introduce_list li .img_area{display:inline-block;width:90px;height:80px;background-image:url(../img/main/icon_main_introducelist.png);background-repeat:no-repeat;}
ul.introduce_list li .title{text-align:center;font-size:21px;line-height:22px;margin-top:25px;color:#333;font-weight:500;letter-spacing: -1.5px;}
ul.introduce_list li .text{text-align:center;font-size:15px;line-height:20px;margin-top:14px;color:#333;}

ul.introduce_list li.list01 .img_area{background-position:0 0;}
ul.introduce_list li.list02 .img_area{background-position:0 -80px;}
ul.introduce_list li.list03 .img_area{background-position:0 -160px;}
ul.introduce_list li.list04 .img_area{background-position:0 -240px;}
ul.introduce_list li.list05 .img_area{background-position:0 -320px;}
ul.introduce_list li.list06 .img_area{background-position:0 -400px;}

ul.introduce_list_re{padding-top:90px; width: 1000px; margin: 0 auto;}
ul.introduce_list_re:after{content:"";display:block;clear:both;}
ul.introduce_list_re li{float:left;width:330px;text-align:center;}
ul.introduce_list_re li .title{text-align:center;font-size:45px;line-height:22px;margin-top:22px;color:#003767;font-weight:600;letter-spacing: -1.5px;}
ul.introduce_list_re li .text_top{text-align:center;font-size:25px;line-height:28px;color:#333;}
ul.introduce_list_re li .text_btm{text-align:center;font-size:15px;line-height:20px;margin-top:26px;color:#333;}

/* 02 */
.wrap_con_function .con_function{width:1000px;margin:0 auto;position:relative;}
.wrap_con_function .con_function h2{color:#003767;}

.wrap_con_function .con_function ul.function_menu{ width: 780px;margin:0 auto; margin-top:85px;}
.wrap_con_function .con_function ul.function_menu:after{content:"";display:block;clear:both;}
.wrap_con_function .con_function ul.function_menu li {width:111px;float:left;text-align:center; box-sizing: border-box;}
.wrap_con_function .con_function ul.function_menu li a{position:relative;display:block;width:111px;height:104px;border-left:1px solid #d0d0d0;border-top:1px solid #d0d0d0;border-bottom:1px solid #d0d0d0;}
/* .wrap_con_function .con_function ul.function_menu li + li + li + li + li + li + li  {border-right:1px solid #d0d0d0;} */
.wrap_con_function .con_function ul.function_menu li:last-of-type {border-right: 1px solid #d0d0d0;}
.wrap_con_function .con_function ul.function_menu li a span.img{display:block;width:120px;height:70px;}

.wrap_con_function .con_function ul.function_menu li a.on{background:#003767;}
.wrap_con_function .con_function ul.function_menu li a.on span.img{background:url(../img/main/icon_main_functionlist_on.png) no-repeat;}
.wrap_con_function .con_function ul.function_menu li a.on:after{content:"";position:absolute;bottom:-44px;display:block;border-top:22px solid #003767;border-left:56px solid transparent;border-right:56px solid transparent;border-bottom:22px solid transparent;}
.wrap_con_function .con_function ul.function_menu li a.on span.text{display:inline-block;margin-top:8px;line-height:14px;color:#fff;}
.wrap_con_function .con_function ul.function_menu li a.on span.text:lang(ko){font-size:14px;}
.wrap_con_function .con_function ul.function_menu li a.on span.text:lang(en){font-size:11px;}
.wrap_con_function .con_function ul.function_menu li a.off:hover{background:#f6f6f6;}

.wrap_con_function .con_function ul.function_menu li a.off span.img{background:url(../img/main/icon_main_functionlist_off.png) no-repeat;margin-top:10px;}
.wrap_con_function .con_function ul.function_menu li a.off span.text{display:none;}

.wrap_con_function .con_function ul.function_menu li.list01 a span.img{background-position:15px 5px;}
.wrap_con_function .con_function ul.function_menu li.list02 a span.img{background-position:13px -66px;}
.wrap_con_function .con_function ul.function_menu li.list03 a span.img{background-position:15px -276px;}
.wrap_con_function .con_function ul.function_menu li.list04 a span.img{background-position:15px -136px;}
.wrap_con_function .con_function ul.function_menu li.list05 a span.img{background-position:13px -206px;}
.wrap_con_function .con_function ul.function_menu li.list06 a span.img{background-position:16px -346px;}
.wrap_con_function .con_function ul.function_menu li.list07 a span.img{background-position:15px -418px;}
.wrap_con_function .con_function ul.function_menu li.list08 a span.img{background-position:15px -485px;}
.wrap_con_function .con_function ul.function_menu li.list09 a span.img{background-position:14px -555px;}
.wrap_con_function .con_function ul.function_menu li.list10 a span.img{background-position:14px -625px;}

.wrap_function_view{padding-top:90px;height:460px;}
.function_view{position:relative;}
.function_view .view_left{padding-left:70px;}
.function_view .view_left span{vertical-align:middle;}
.function_view .view_left span.text01{position:relative;display:inline-block;font-size:15px;line-height:15px;font-weight:500;padding:6px 12px;background:#003767;color:#fff;}
.function_view .view_left span.text01:after{content:"";position:absolute;top:0;right:-25px;display:block;border-top:14px solid transparent;border-right:14px solid transparent;border-left:11px solid #003767;border-bottom:14px solid transparent;}
.function_view .view_left span.text02{color:#003767;font-weight:500;padding-left:20px;}
.function_view .view_left span.text02:lang(ko){font-size:35px;line-height:35px;letter-spacing:-2px;}
.function_view .view_left span.text02:lang(en){font-size:30px;line-height:35px;letter-spacing:-1px;}

.function_view .view_left .function_text_area{padding-top:40px;}
.function_view .view_left .function_text_area:lang(ko){font-size:18px;line-height:26px;letter-spacing:-1px;}
.function_view .view_left .function_text_area:lang(en){font-size:15px;line-height:24px;}
.function_view .view_left .btn_area{margin-top:35px;}
.function_view .view_left .btn_area .btn_more{min-width:130px;}
.function_view .view_left .btn_area .btn_more:lang(en){min-width:100px;}
.function_view .view_left .btn_area .btn_more span.text{font-size:16px;line-height:16px;}
.function_view .view_right{position:absolute;top:0;right:50px;}

.wrap_con_function .con_function .btn_nav_slide{width:100%;position:absolute;top:460px;left:0;}
.wrap_con_function .con_function .btn_nav_slide a{display:block;overflow:hidden;text-indent:-9999px;width:24px;height:42px;background:url(../img/common/btn_slide_leftright.png) no-repeat;}
.wrap_con_function .con_function .btn_nav_slide a.go_prev{background-position:0 0;position:absolute;top:0;left:0;}
.wrap_con_function .con_function .btn_nav_slide a.go_next{background-position:0 -42px;position:absolute;top:0;right:0;}


.wrap_con_function .con_function .tab_area_type02{padding-top:80px;width:900px;margin:0 auto;}
/* 03 */
.wrap_con_service{background:#eceded;}
.wrap_con_service .con_service{width:940px;margin:0 auto;position:relative;}
.wrap_con_service .con_service h2{color:#003767;}

.wrap_con_service .con_service ul.service_list{padding-top:70px;}
.wrap_con_service .con_service ul.service_list:after{content:"";display:block;clear:both;}
.wrap_con_service .con_service ul.service_list > li{float:left;width:230px;margin-right:20px;text-align:center;background:#fff;height:250px;}
.wrap_con_service .con_service ul.service_list > li.list_two {width:47% !important;}
.wrap_con_service .con_service ul.service_list > li.list_three {width:30% !important;}
.wrap_con_service .con_service ul.service_list > li h3{font-size:21px;line-height:21px;padding:12px 0 14px;color:#fff;font-weight: 500;}
.wrap_con_service .con_service ul.service_list > li + li + li + li{margin-right:0;}
.wrap_con_service .con_service ul.service_list > li.list01{border:4px solid #5b95c8;}
.wrap_con_service .con_service ul.service_list > li.list01 h3{background:#5b95c8;}
.wrap_con_service .con_service ul.service_list > li.list02{border:4px solid #3e7aaf;}
.wrap_con_service .con_service ul.service_list > li.list02 h3{background:#3e7aaf;}
.wrap_con_service .con_service ul.service_list > li.list03{border:4px solid #215c90;}
.wrap_con_service .con_service ul.service_list > li.list03 h3{background:#215c90;}
.wrap_con_service .con_service ul.service_list > li.list04{border:4px solid #144b7c;}
.wrap_con_service .con_service ul.service_list > li.list04 h3{background:#144b7c;}
.wrap_con_service .con_service ul.service_list > li.list01 .price_area > p{color:#5b95c8;}
.wrap_con_service .con_service ul.service_list > li.list02 .price_area > p{color:#3e7aaf;}
.wrap_con_service .con_service ul.service_list > li.list03 .price_area > p{color:#215c90;}

.con_service ul.service_list > li .detail_area{padding-top:40px;}
.con_service ul.service_list > li .detail_area .price_area{display:inline-block;text-align:left;min-height:53px;}
.con_service ul.service_list > li .detail_area .price_area > p{font-size:20px;line-height:20px;padding:3px 0;}
.con_service ul.service_list > li .detail_area .price_area > p > span{display:inline-block;min-width:70px;}
.con_service ul.service_list > li .detail_area p.period_text{font-size:16px;line-height:23px;color:#003767;font-weight:400;text-align:center;padding-top:18px;}

.con_service ul.service_list > li .detail_area > ul{display:inline-block;padding-top:18px;}
.con_service ul.service_list > li .detail_area > ul > li{font-size:15px;line-height:20px;text-align:left;margin:8px 0;color:#333;padding-left:8px;}

.con_service ul.service_list > li.list01 .detail_area > ul > li{background:url(../img/common/icon_bullet_blue01.png) no-repeat 0 9px;}
.con_service ul.service_list > li.list02 .detail_area > ul > li{background:url(../img/common/icon_bullet_blue02.png) no-repeat 0 9px;}
.con_service ul.service_list > li.list03 .detail_area > ul > li{background:url(../img/common/icon_bullet_blue03.png) no-repeat 0 9px;}

.con_service .btn_area{padding-top:70px;text-align:center;}
.con_service .btn_area a{min-width:200px;margin:0 2px;}
.con_service .btn_area a{min-width:200px;}

/* 04 */
.wrap_con_support{}
.wrap_con_support .con_support{width:1000px;margin:0 auto;position:relative;}
.wrap_con_support .con_support h2{color:#003767;}

.con_support ul.support_list{padding-top:90px;}
.con_support ul.support_list:after{content:"";display:block;clear:both;}
.con_support ul.support_list li{position:relative;float:left;width:235px;margin-right:20px;height:252px;}
.con_support ul.support_list li + li + li + li{margin-right:0;}
.con_support ul.support_list li a{cursor:pointer;}

.con_support ul.support_list li .over{position:absolute;width:100%;height:100%;}
.con_support ul.support_list li .over .title{font-size:18px;line-height:18px;color:#fff;text-align:center;padding-top:48px;}
.con_support ul.support_list li .over .text{font-size:14px;line-height:22px;color:#fff;text-align:center;padding-top:18px;font-weight:300;}
.con_support ul.support_list li.list01 .over{background:#4d3826;}
.con_support ul.support_list li.list02 .over{background:#5f6032;}
.con_support ul.support_list li.list03 .over{background:#214f4a;}
.con_support ul.support_list li.list04 .over{background:#00396b;}

.con_support ul.support_list li .normal{width:100%;height:100%;}
.con_support ul.support_list li.list01 .normal{background:url(../img/main/img_main_support01.jpg) no-repeat;background-size:cover;}
.con_support ul.support_list li.list02 .normal{background:url(../img/main/img_main_support02.jpg) no-repeat;background-size:cover;}
.con_support ul.support_list li.list03 .normal{background:url(../img/main/img_main_support03.jpg) no-repeat;background-size:cover;}
.con_support ul.support_list li.list04 .normal{background:url(../img/main/img_main_support04.jpg) no-repeat;background-size:cover;}

.con_support ul.support_list li.list01 .normal .title{width:100%;position:absolute;bottom:0;font-size:18px;line-height:18px;color:#fff;text-align:center;padding:25px 0;background:#4d3826;opacity:.8;}
.con_support ul.support_list li.list02 .normal .title{width:100%;position:absolute;bottom:0;font-size:18px;line-height:18px;color:#fff;text-align:center;padding:25px 0;background:#5f6032;opacity:.8;}
.con_support ul.support_list li.list03 .normal .title{width:100%;position:absolute;bottom:0;font-size:18px;line-height:18px;color:#fff;text-align:center;padding:25px 0;background:#214f4a;opacity:.8;}
.con_support ul.support_list li.list04 .normal .title{width:100%;position:absolute;bottom:0;font-size:18px;line-height:18px;color:#fff;text-align:center;padding:25px 0;background:#00396b;opacity:.8;}

/* 05 */
.wrap_con_notice{border-top:1px solid #ddd;}
.wrap_con_notice .con_notice{width:1000px;margin:0 auto;}
.wrap_con_notice .con_notice h2{color:#003767;}
.wrap_con_notice .con_notice > ul{padding-top:70px;}
.wrap_con_notice .con_notice > ul:after{content:"";display:block;clear:both;}
.wrap_con_notice .con_notice > ul > li{margin-right:22px;float:left;}
.wrap_con_notice .con_notice > ul > li + li + li{margin-right:0;}
.wrap_con_notice .con_notice > ul > li > a{display:block;width:318px;}
.wrap_con_notice .con_notice > ul > li > a:hover .img_area:after{opacity:1;}

.wrap_con_notice .con_notice > ul > li .img_area{width:319px;height:175px;background:#333;}
.wrap_con_notice .con_notice > ul > li.list01 .img_area:after{content:"";display:block;width:319px;height:175px;background-image:url(../img/main/img_main_eventlist04.png);background-size:cover;opacity:.7;}
.wrap_con_notice .con_notice > ul > li.list02 .img_area:after{content:"";display:block;width:319px;height:175px;background-image:url(../img/main/img_main_eventlist01.jpg);background-size:cover;opacity:.7;}
.wrap_con_notice .con_notice > ul > li.list03 .img_area:after{content:"";display:block;width:319px;height:175px;background-image:url(../img/main/img_main_eventlist02.jpg);background-size:cover;opacity:.7;}

.wrap_con_notice .con_notice > ul > li a .text{font-size:14px;line-height:14px;padding-top:18px;color:#333;}
.wrap_con_notice .con_notice > ul > li a .title_text{font-size:18px;line-height:18px;padding-top:5px;color:#333;letter-spacing:-1px;font-weight:400;}
.wrap_con_notice .con_notice > ul > li a:hover .text{color:#003767;}
.wrap_con_notice .con_notice > ul > li a:hover .title_text{color:#003767;}

/* 06 */
.wrap_con_customer{background:#eceded;}
.wrap_con_customer .con_customer{width:1000px;margin:0 auto;position:relative;}
.wrap_con_customer .con_customer h2{color:#003767;}

.customer_list_area{padding-top:80px;position:relative;height:340px;text-align:center;}
.customer_list_area ul.customer_list{text-align:center;}
.customer_list_area ul.customer_list:after{content:"";display:block;clear:both;}
.customer_list_area ul.customer_list li{float:left;width:100%;}
.customer_list_area ul.customer_list li .logo{padding-bottom:35px;}
.customer_list_area ul.customer_list li .text{font-size:17px;line-height:34px;letter-spacing:-1px;font-weight:400;color:#333;}

.con_customer .btn_nav_slide{width:100%;position:absolute;top:160px;left:0;}
.con_customer .btn_nav_slide a{display:block;overflow:hidden;text-indent:-9999px;width:24px;height:42px;background:url(../img/common/btn_slide_leftright.png) no-repeat;}
.con_customer .btn_nav_slide a.go_prev{background-position:0 0;position:absolute;top:0;left:0;}
.con_customer .btn_nav_slide a.go_next{background-position:0 -42px;position:absolute;top:0;right:0;}

.con_customer ul.list_nav{display:inline-block;padding-top:62px;}
.con_customer ul.list_nav:after{content:"";display:block;clear:both;}
.con_customer ul.list_nav li{float:left;display:inline-block;padding:0 6px;}
.con_customer ul.list_nav li > a{display:inline-block;width:12px;height:12px;border-radius:12px;-webkit-border-radius:12px;}
.con_customer ul.list_nav li.on > a{background:#003767;}
.con_customer ul.list_nav li.off > a{background:#ddd;}

.con_customer .btn_area{padding:90px 0 0;text-align:center;}
.con_customer .btn_area .btn_more{min-width:200px;}

/* 최상단 이벤트 배너 - 2018/02/06 추가 */
.wrap_top_banner{position:relative;width:100%;height:80px;border-bottom:1px solid #eee; background-color: #4f465c;}
.wrap_top_banner .con_topbanner{position:relative;width:1000px;height:79px;margin:0 auto;}
.wrap_top_banner .con_topbanner a.link{display:block;position:absolute;top:0;width:1000px;height:79px;}
.wrap_top_banner .con_topbanner a.btn_close{display:block;position:absolute;top:4px;right:4px;width:30px;height:30px;}
.wrap_top_banner .con_topbanner a.nomore{display:block;position:absolute;bottom:6px;right:1px;width:136px;height:16px; }
.wrap_top_banner .con_topbanner a.nomore div img{ float: left; margin-left:10px; vertical-align:middle; width: 101px; height: 16px;}
.wrap_top_banner .con_topbanner a.nomore div label{ display: block; margin-left: 10px;}


/*  221214 메인 조달청 추가*/
#con07 {border-top: 1px solid #ddd;}
#con07 .box07_inner {margin-top: 90px; display: flex; align-items: center;}
#con07 .box07_img {width: 540px;}
#con07 .box07_img img {width: 100%;}
#con07 .box07_txt {width: calc(100% - 540px); padding-left: 68px;}
#con07 .box07_txt ul {font-size: 17px; line-height: 1.8rem;}
#con07 .btn_area {margin-top: 25px;}

.txt_list li {position: relative; padding-left: 10px;}
.txt_list li::before {content: ""; width: 3px; height: 3px; background: #575757; position: absolute; left: 0; top: 12px;}

@media(max-width:1024px) {
    #con07 .box07_img {width: 350px;}
    #con07 .box07_txt {width: calc(100% - 350px); padding-left: 50px;}
}
@media(max-width:640px) {
    #con07 .box07_inner {flex-direction: column;}
    #con07 .box07_img {width: 100%;}
    #con07 .box07_txt {width: 100%; padding-left: 0; margin-top: 30px;}
}


@media (max-width:1024px) {

    .wrap_con_visual {
        margin-top: 0 !important;
    }
    .con_visual {
        width: 100%;
        padding: 0 40px;
    }

    /* visual */
    .con_visual .top_text {
        font-size: 35px;
        padding-top: 20%;
        word-break: keep-all;
    }

    .con_visual .main_text {
        font-size: 35px;
        word-break: keep-all;
    }

    .visual_list_area {
        margin: 0;
        position: absolute;
        bottom: -62.5px;
        left: 50%;
        transform: translateX(-50%);
    }

    .visual_list_area ul.list_area {
        margin: 0 -20px;
    }
    
    .visual_list_area ul.list_area::after {
        display: block;
        content: "";
        clear: both;
    }

    .visual_list_area ul.list_area li {
        display: block;
        width: 25%;
        padding: 0 20px;
        float: left;
        box-sizing: border-box;
    }

    .visual_list_area ul.list_area li a {
        display: block;
        width: 100%;
    }

    /* main-contents */

    .main_row {
        padding: 90px 40px;
    }

    .main_row .sub_text {
        line-height: 25px;
    }

    .wrap_con_introduce .con_introduce {
        width: 100%;
        padding-top: 120px;
    }

    .wrap_con_function .con_function {
        width: 100%;
    }

    .function_view .view_left {
        padding-left: 0;
    }

    /* con1 */

    ul.introduce_list_re {
        width: 100%;
    }
    
    ul.introduce_list_re li {
        width: 33.3333%;
    }

    /* con2 */
    .wrap_function_view {
        height: auto;
    }

    .function_view .view_left .function_text_area:lang(ko) br {
        display: none;
    }

    .function_view .view_right {
        position: relative;
        right: auto;
        text-align: center;
        margin-top: 20px;
    }

    .function_view .view_right img {
        max-width: 100%;
    }

    /* con2-1 */
    .wrap_con_function .con_function .tab_area_type02 {
        width: 100%;
    }

    /* con3 */
    .wrap_con_service .con_service {
        width: 100%;
    }

    .wrap_con_service .con_service ul.service_list > li.list_two {
        width: 48% !important;
        margin-right: 4%;
        box-sizing: border-box;
    }
    
    .wrap_con_service .con_service ul.service_list > li.list_two:last-of-type {
        margin-right: 0;
    }

    /* con4 */
    .wrap_con_support .con_support {
        width: 100%;
    }

    .con_support ul.support_list {
        margin: -10px;
    }

    .con_support ul.support_list li {
        width: 50%;
        padding:10px;
        box-sizing: border-box;
        margin-right: 0;
    }

    .con_support ul.support_list li .over {
        width: calc(100% - 20px);
        height: calc(100% - 20px);
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .con_support ul.support_list li .over .title {
        padding-top: 35px;
    }

    .con_support ul.support_list li .normal .title {
        width: calc(100% - 20px) !important;
        left: 10px;
        bottom: 10px !important;
    }

    /* con5 */
    .wrap_con_notice .con_notice {
        width: 100%;
    }

    .wrap_con_notice .con_notice > ul {
        margin: 0 -10px;
    }

    .wrap_con_notice .con_notice > ul > li {
        width: 33.3333%;
        padding: 0 10px;
        margin-right: 0;
        box-sizing: border-box;
    }

    .wrap_con_notice .con_notice > ul > li > a {
        width: 100%;
    }

    .wrap_con_notice .con_notice > ul > li .img_area {
        width: 100%;
    }

    .wrap_con_notice .con_notice > ul > li.list01 .img_area:after,
    .wrap_con_notice .con_notice > ul > li.list02 .img_area:after,
    .wrap_con_notice .con_notice > ul > li.list03 .img_area:after {
        width: 100%;
        background-position: center;
    }

    /* con6 */
    .wrap_con_customer .con_customer {
        width: 100%;
    }
}

@media (max-width:800px) {

    /* con2 */
    .wrap_con_function .con_function ul.function_menu {
        width: 100%;
        text-align: center;
        background: #fafafa;
        border: 1px solid #d0d0d0;
    }


    .wrap_con_function .con_function ul.function_menu::after {
        display: block;
        content: "";
        clear: both;
    }

    .wrap_con_function .con_function ul.function_menu li {
        display: block;
        width: 33.3333%;
        float: left;
        margin: 0;
        border-bottom: 1px solid #d0d0d0;
        border-right: 1px solid #d0d0d0;
        margin-top: 0;
        box-sizing: border-box;
        border-top: none;
        border-collapse: collapse;
    }

    .wrap_con_function .con_function ul.function_menu li:nth-of-type(3n) {
        border-right: none;
    }

    .wrap_con_function .con_function ul.function_menu li:last-of-type {
        border-bottom: none;
    }
/* 
    .wrap_con_function .con_function ul.function_menu li:nth-of-type(1), .wrap_con_function .con_function ul.function_menu li:nth-of-type(3n + 1) {
        border-left: none;
    }

    .wrap_con_function .con_function ul.function_menu li:last-of-type {
        border-bottom: none;
    } */
/* 
    .wrap_con_function .con_function ul.function_menu li:nth-of-type(n - 4) {
        border-top: none;
    }  */

    .wrap_con_function .con_function ul.function_menu li a {
        display: table;
        width: 100%;
        height: auto;
        border: none;
        table-layout: fixed;
        background: #fff;
    }

    .wrap_con_function .con_function ul.function_menu li a span.img {
        display: none;
    }

    .wrap_con_function .con_function ul.function_menu li a span.text,
    .wrap_con_function .con_function ul.function_menu li a.on span.text,
    .wrap_con_function .con_function ul.function_menu li a.off span.text {
        display: table-cell;
        line-height: 1.3;
        height: 50px;
        padding: 0 10px;
        font-size: 14px;
        vertical-align: middle;
    }
/* 
    .wrap_con_function .con_function ul.function_menu li a.off span.text {
        display: table-cell;
        line-height: 1.3;
        height: 50px;
        padding: 0 10px;
        font-size: 14px;
        vertical-align: middle;
    }

    .wrap_con_function .con_function ul.function_menu li a.on span.text {
        margin-top: 0;
        display: block;
        line-height: 1.3;
    } */

    .wrap_con_function .con_function ul.function_menu li a.on span.text:lang(ko) {
        font-size: 14px;
    }

    .wrap_con_function .con_function ul.function_menu li a.on:after {
        display: none;
    }

}

@media (max-width:768px) {
    .con_visual {
        padding: 100px 20px;
        height: auto;
    }
    
    #wrapper .con_visual .main_text br {
        display: block;
    }

    #wrapper .con_visual .main_text br.block {
        display: none;
    }
    
    /* visual */
    .con_visual .top_text {
        padding-top: 0;
        font-size: 23px;
    }

    .con_visual .main_text {
        padding-top: 15px;
        line-height: 1.5;
    }

    .con_visual .main_text br.block {
        display: block;
    }

    .con_visual .btn_area {
        display: none;
    }

    .visual_list_area {
        width: 100%;
        padding: 0;
        position: relative;
        left: auto;
        transform: none;
        bottom: auto;
        margin-top: 40px;
    }
    
    .visual_list_area ul.list_area {
        margin: 0;
    }

    .visual_list_area ul.list_area li {
        padding: 0;
        width: 50%;
    }

    .visual_list_area ul.list_area li a {
        height: auto;
    }

    .visual_list_area ul.list_area li a span.img {
        display: inline-block;
        width: 33px;
        height: 33px;
        margin:0;
        margin-right: 8px;
        vertical-align: middle;    
        background-size: cover;
        background-position: 0;
    } 

    .visual_list_area ul.list_area li.list01 a span.img {
        background-position-y: 0;
    }

    .visual_list_area ul.list_area li.list02 a span.img {
        background-position-y: -33px;
    }

    .visual_list_area ul.list_area li.list03 a span.img {
        background-position-y: -66px;
    }

    .visual_list_area ul.list_area li.list04 a span.img {
        background-position-y: -99px;
    }

    .visual_list_area ul.list_area li a span.text {
        padding: 30px 0;
        font-size: 18px;
        line-height: 1.3;
        display: inline-block;
        vertical-align: middle;
    }


    /* main-contents */
    
    .main_row {
        padding: 60px 20px;
    }
    
    .main_row h2 {
        font-size: 35px;
        line-height: 40px;
    }


    /* con1 */

    .wrap_con_introduce .con_introduce {
        padding-top: 0px;
    }

    ul.introduce_list_re {
        padding-top: 0;
    }
    
    ul.introduce_list_re li {
        width: 100%;
        padding: 30px 0;
        border-bottom: 2px dashed #ddd;
    }

    ul.introduce_list_re li:last-of-type {
        border-bottom: none;
        padding-bottom: 0;
    }
    
    ul.introduce_list_re li .text_top {
        font-size: 20px;
    }

    ul.introduce_list_re li .title {
        font-size: 35px;
        margin-top: 15px;
    }

    ul.introduce_list_re li .text_btm {
        margin-top: 20px;
    }
    

    /* con2 */


    .wrap_function_view {
        padding-top: 60px;
    }

    .wrap_con_function .con_function ul.function_menu {
        margin-top: 30px;
    }

    .function_view .view_left span.text02:lang(ko) {
        font-size: 23px;
    } 

    .function_view .view_left .function_text_area:lang(ko) {
        font-size: 16px;
        padding-top: 5px;
    }

    .function_view .view_left span.text02:lang(ko) {
        display: block;
        padding-left: 0;
        margin-top: 20px;
    }

    .function_view .view_left .btn_area {
        margin-top: 20px;
    }

    .function_view .view_left .btn_area .btn_more {
        min-width: 160px;
        text-align: center;
    }

    /* con2-1 */
    .wrap_con_function .con_function .tab_area_type02 {
        padding-top: 30px;
    }

    /* con3 */
    .main_row .sub_text {
        font-size: 17px;
    }

    .wrap_con_service .con_service ul.service_list {
        padding-top: 30px;
    }

    .con_service .btn_area {
        padding: 0 20px;
        padding-top: 30px;
        overflow: hidden;
    }

    .con_service .btn_area > a {
        width: 48%;
        margin: 0;
        margin-right: 4%;
        float: left;
        min-width: auto;
    }

    .con_service .btn_area > a:last-of-type {
        margin-right: 0;
    }

    .wrap_con_service .con_service ul.service_list > li {
        height: auto;
    }

    .con_service ul.service_list > li .detail_area {
        display: table;
        table-layout: fixed;
        padding-top: 0;
        width: 100%;
    }

    .con_service ul.service_list > li .detail_area p.period_text {
        display: table-cell;
        padding-top: 0;
        vertical-align: middle;
        min-height: 140px;
        text-align: center;
        padding: 20px;
    }

    /* con4 */
    .con_support ul.support_list {
        padding-top: 30px;
    }

    .con_support ul.support_list li .over .text {
        padding: 18px 15px;
    }
    .con_support ul.support_list li .normal .title {
        padding: 17px 0 !important;
        font-size: 16px !important;
    }

    /* con5 */
    .wrap_con_notice .con_notice > ul {
        padding-top: 30px;
    }

    .wrap_con_notice .con_notice > ul > li a .title_text {
        font-size: 16px;
    }
    
    .wrap_con_notice .con_notice > ul {
        margin: 0;
    }

    .wrap_con_notice .con_notice > ul > li {
        display: block;
        width: 100%;
        padding: 0;
        float: none;
        border-bottom: 1px solid #ddd;
        padding: 15px 0;
    }

    .wrap_con_notice .con_notice > ul > li:last-of-type {
        border-bottom: none;
    }

    .wrap_con_notice .con_notice > ul > li > a {
        display: block;
        position: relative;
        padding: 20px 0;
        padding-left: 170px;
        min-height: auto;
    }

    .wrap_con_notice .con_notice > ul > li .img_area {
        position: absolute;
        top: 0;
        left: 0;
        width: 150px;
        height: 100%;
        overflow: hidden;
        background: transparent;
        border: 1px solid #ddd;
    }

    .wrap_con_notice .con_notice > ul > li .img_area::after {
        height: 100% !important;
    }

    .wrap_con_notice .con_notice > ul > li a .text {
        margin-bottom: 3px;
        padding-top: 0;
    }

    .wrap_con_notice .con_notice > ul > li a .title_text {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        max-height: 41px;
        overflow: hidden;
        text-overflow: ellipsis;

    }
 
    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
        .wrap_con_notice .con_notice > ul > li a .title_text {
            display: block;
        }   
    } 

    .customer_list_area {
        padding-top: 50px;
    }

    .con_customer .btn_area {
        padding: 45px 0 0;
    }

    .con_customer .btn_area .btn_more {
        min-width: auto;
    }
}

@media (max-width:587px) {
  /* .con_visual .top_text,
  .con_visual .main_text {
        font-size: 30px;
    } */

    .con_visual .main_text {
        font-size: 24px;
    }

    
    .visual_list_area ul.list_area li {
        width: 50%;
    }
    /* main-contents */

    .main_row h2 {
        font-size: 25px;
        line-height: 1.3;
    }

    /* con1 */

    ul.introduce_list_re li {
        width: 100%;
    }

    ul.introduce_list_re li:last-of-type {
        margin-bottom: 0;
    }

    ul.introduce_list_re li .text_btm {
        padding: 0 10px;
    }

    /* con2-1 */
    .tab_area_type02 ul > li > a {
        font-size: 14px;
    }

    /* con3 */
    .wrap_con_service .con_service ul.service_list > li.list_two {
        width: 100% !important;
        margin-right: 0;
        margin-bottom: 20px;
    }

    .wrap_con_service .con_service ul.service_list > li.list_two:last-of-type {
        margin-bottom: 0;
    }

    .wrap_con_service .con_service ul.service_list > li h3 {
        font-size: 18px;
        line-height: 18px;
        padding: 10px;
    }

    .con_service ul.service_list > li .detail_area p.period_text {
        font-size: 15px;
        line-height: 1.35;
    }
    
    .con_service ul.service_list > li .detail_area p.period_text br {
        display: none;
    } 

    /* con4 */

    .con_support ul.support_list {
        margin: -5px;
    }

    .con_support ul.support_list li {
        padding: 5px;
        height: 200px;
    }

    .con_support ul.support_list li .over {
        width: calc(100% - 10px);
        height: calc(100% - 10px);
    }

    .con_support ul.support_list li .over .text {
        padding: 8px;
    }

    .con_support ul.support_list li .over .title {
        padding-top: 20px; 
        font-size: 16px;
        line-height: 16px;
    }

    .con_support ul.support_list li .over .text {
        font-size: 12px;
        line-height: 1.35;
    }

    .con_support ul.support_list li .normal .title {
        width: calc(100% - 10px) !important;
        left: 5px;
        bottom: 5px !important;
    }
    /* con5 */

    /* con6 */
    .customer_list_area {
        height: auto;
    }

    .customer_list_area ul.customer_list li .text {
        padding: 0 40px;
        font-size: 15px;
        line-height: 25px;
    }

    .customer_list_area ul.customer_list li .text br {
        display: none;
    }
/* 
    .con_customer .btn_nav_slide {
        top: 374px;
    } */
}

@media (max-width:530px) {
    .wrap_con_function .con_function ul.function_menu br.block {
        display: none;
    }
}

@media (max-width:487px) {

    .con_visual {
        padding: 75px 20px;
    }
/* 
    .con_service .btn_area a {
        width: 100%;
        margin: 0;
        margin-bottom: 10px;
    } */

    .visual_list_area ul.list_area li a span.text {
        font-size: 16px;
        padding: 25px 0;
    }

/* 
    .wrap_con_notice .con_notice > ul > li > a {
        min-height: 90px;
    } */
}

@media (max-width:450px) {
    

    /* main-contents */
    /* con1*/

}

@media (max-width:400px) {
    
    .con_visual .top_text {
        font-size: 20px;
    }
    
    .con_visual .main_text {
        font-size: 20px;
    }

    .main_row h2 {
        font-size: 20px;
    }
    
}

@media (max-width:360px) {
    .wrap_con_function .con_function ul.function_menu li a.on span.text,
    .wrap_con_function .con_function ul.function_menu li a.off span.text {
        font-size: 13px;
    }
}

.wrap_con_visual .logo_wrap {display: flex; position: absolute; top: 90px; right: 12%; align-items: center;}
.wrap_con_visual .logo_wrap > div {margin-left:16px;}
.wrap_con_visual .logo_wrap .logo1 {width:50px ;}
.wrap_con_visual .logo_wrap .logo2 {width:88px ;}
.wrap_con_visual .logo_wrap .logo3 {width:50px ;}
.wrap_con_visual .logo_wrap img {width: 100%;}

@media(max-width:1950px){
    .wrap_con_visual .logo_wrap {right: 2%}
}
@media(max-width:786px){
    .wrap_con_visual .logo_wrap {top: 75px;}
    .wrap_con_visual .logo_wrap > div {margin-left:7px;}
    .wrap_con_visual .logo_wrap .logo1,.wrap_con_visual .logo_wrap .logo3 {width:35px ;}
    .wrap_con_visual .logo_wrap .logo2 {width:65px ;}
}
#popupzone .popupzone_wrap .popupzone_chk {right: 42% ; width: 130px;}





