정세찬_우리산전

우리산전 css

1. atom 에디터의 사용: 여러 패키지 프로그램으로 빠른 코딩

2. 간단한 이팩트, 에니메이션 처리: 스크립트를 사용하지 않고 해결할 수 있는 이펙트는 css로 처리

3. 가상선택자와 가상클래스 사용

@charset "UTF-8";
        @import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900|Roboto:400,700|Oswald:300,400,500,700&display=swap');
        /* font-family: 'Roboto', sans-serif;
        font-family: 'Oswald', sans-serif;
        font-family: 'Noto Sans KR', sans-serif; */
        *{outline: none; text-decoration: none;}
        body{font-family: 'Noto Sans KR', sans-serif;max-width:1920px;overflow-x: hidden;margin:0 auto;}
        body.no_scroll{overflow: hidden;}
        ul{list-style: none; padding: 0; margin: 0;}
        a{text-decoration: none; color: #333;}a:focus{text-decoration: none; color:inherit;}
        h1,h2,h3,h4,h5,h6,p{margin: 0;padding: 0;word-break:keep-all;}
        a:hover{text-decoration: none; color: #333;}
        select { -webkit-appearance: none; -moz-appearance: none; appearance: none;}select::-ms-expand { display: none;}
        b{font-weight: normal;}
        .tt{text-transform: uppercase;}
        .ex_pop{width: 500px;height: 500px;background-color: #fff;position: fixed;top: 100px;left: 500px;}
        /* start_screen */
        .start_screen{position: relative;max-width:1920px;height: 100vh;font-size: 0;overflow: hidden;}
        .start_screen::after{content:'';display: block;position: absolute;width: 100%;height: 1px;top: 50%;left: 50%;transform:translate(-50%, -50%);background-color: #fff;}
        .start_screen>div{display: inline-block;width: 50%;height: 100%;vertical-align: top;}
        .start_screen .left_box{background-color: #dd3232;padding-left:calc(50% - 585px);}
        .start_screen .right_box{background: url('../images/start/start_right_back.png') no-repeat center / cover;padding-right:calc(50% - 585px);}
        .start_screen .link_box{position: relative;width: 585px;height: 100%;padding:110px 0px 110px 70px;}
        .start_screen .link_box::before{content: '';position: absolute;left: 50%;top: 0;width: 1px;height: 50%;transform:translateX(-50%);background-image: linear-gradient(to bottom, rgba(255,255,255,1) , rgba(255,255,255,0));}
        .start_screen .link_box::after{content: '';position: absolute;left: 50%;bottom: 0;width: 1px;height: 50%;transform:translateX(-50%);background-image: linear-gradient(to top, rgba(255,255,255,1) , rgba(255,255,255,0));}
        .start_screen .left_box .link_box{border-left:1px solid #fff;}
        .start_screen .right_box .link_box{border-right:1px solid #fff;}
        .start_screen .link_box h4{display: none;position: relative;font-family: NanumSquareRoundR;font-size: 24px;color: #fff;padding-left: 30px;}
        .start_screen .link_box h4::before{content:'';display: block;width: 5px;height: 23px;background-color: #fff;position: absolute;top: 50%;left: 0;transform: translateY(-50%);}
        .start_screen .link_box .link{display: none;position: absolute;top: 50%;left: 50%;transform:translate(-50%, -120px);text-align: center;z-index: 10;}
        .start_screen .link_box .link h2{font-size: 66px;color: #fff;margin-bottom: 15px;}
        .start_screen .link_box .link a{display: inline-block;width: 60px;height: 60px;text-align: center;line-height: 58px;background-color: #333;border:1px solid #fff;font-size: 24px;color: #fff;border-radius:100%;}
        .start_screen .right_box .link_box .link a{background-color: #dd3232;}
        .start_screen .link_box .text_box{display: none;position: absolute;left: 70px;bottom: 110px;}
        .start_screen .link_box .text_box p{font-family: NanumSquareRoundR;font-size:32px;color: #fff;word-break:keep-all;}
        /* header */
        header{position: absolute;width: 100%;height: 100px;background-color:rgba(255,255,255,.9);font-size: 0;top: 0;left: 0;transition: .3s;overflow: hidden;z-index: 100;user-select:none;}
        header .container{position: relative;}
        header.on{height: auto;transition:.3s;}
        header .logo_box{display: inline-block;width: 200px;height: 100px;vertical-align: top;padding:23px 0px;}
        header nav{display: inline-block;width:calc(100% - 200px);vertical-align: top;font-size: 0;}
        header nav>*{display: inline-block;vertical-align: middle;}
        header .navi{width:calc(100% - 100px);padding:0px 30px;}
        header .navi>li{position: relative;display: inline-block;width:16.666%;height: auto;padding-top: 35px;text-align: center;vertical-align: top;}
        header .navi>li>a{font-family:NanumSquareB;height: 100px;font-size: 19px;color: #333;transition: .3s;}
        header .navi>li:hover>a{color: #dd3232;transition:.3s;}
        header .lang_box{position: absolute;top: 33px;right:15px;width: 100px;height: 35px;border:1px solid #dcdcdc;background-color:#fff;border-radius:18px;text-align: center;overflow: hidden;transition: .3s;user-select:none;}
        header .lang_box.on{height:80px;transition:.3s;}
        header .lang_box p img{transition:.3s;}
        header .lang_box.on p img{transform:translateY(-2px) rotate(-180deg);transition:.3s;}
        header .lang_box ul li a{font-weight: 400;font-size: 14px;color: #666;line-height: 1.5;}
        header .lang_box ul li a:hover{color: #dd3232;}
        header .lang_box p{width: 100%;line-height: 33px;font-weight: 500;font-size: 16px;color: #dd3232;cursor: pointer;}
        header .sub_navi{width: 100%;padding:60px 0px 30px;}
        header .sub_navi>li{position: relative;margin-bottom: 15px;text-align: center;}
        /* header .sub_navi>li::before{display: inline-block;content:'-';font-size: 14px;margin-right: 5px;} */
        header .sub_navi>li:last-child{margin-bottom: 0;}
        header .sub_navi>li>a{font-size: 15px;letter-spacing: -1px;color: #333;}
        header .sub_navi>li>a:hover{color: #dd3232;}
        .header_space{padding-top: 100px;}
        .mobile_logo{display: none;}
        .m_navi_btn{display: none;}
        .mobile_navi{display: none;}
        /* main */
        .main_banner_section{position: relative;}
        .main_banner{height: 800px;}
        .main_banner1{background:url('../images/main/main_banner1.png') no-repeat center / cover;}
        .main_banner2{background:url('../images/main/main_banner2.png') no-repeat center / cover;}
        .main_banner3{background:url('../images/main/main_banner3.png') no-repeat center / cover;}
        .main_banner4{background:url('../images/main/main_banner4.png') no-repeat center / cover;}
        .main_banner .text_box{text-align: center;margin-top:230px;}
        .main_banner .text_box h3{font-family: 'Oswald', sans-serif;font-weight:400;font-size: 50px;color: #fff;text-transform: uppercase;letter-spacing: -1px;text-shadow:1px 1px 4px #aaa;}
        .main_banner .text_box h3 b{font-family: 'Oswald', sans-serif;font-weight:700;}
        .main_banner .text_box button{width: 170px;height: 50px;border:1px solid #f5f5f5;background-color:rgba(0,0,0,0);font-weight: 500;font-size: 16px;color: #f5f5f5;margin-top: 65px;transition: .3s;}
        .main_banner .text_box button:hover{background-color:rgba(221,50,50,0.7);transition: .3s;}
        .main_banner_arrow{position: absolute;width: 100%;bottom:80px;left: 0;}
        .main_banner_arrow ul{font-size: 0;text-align: right;}
        .main_banner_arrow ul li{display: inline-block;width: 45px;height: 45px;background-repeat: no-repeat;background-size:cover;background-position:center;cursor: pointer;transition: .3s;}
        .main_banner_arrow ul li:hover{background-color:rgba(221,50,50,1);transition:.3s;}
        .main_banner_arrow ul li.prev{background-image: url('../images/main/slide_left_arrow.png');}
        .main_banner_arrow ul li.next{background-image: url('../images/main/slide_right_arrow.png');}
        .main_banner_slider .slick-dots{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 1170px;text-align: left;padding:0px 30px;}
        .main_banner_slider .slick-dots button{display: inline-block;width: 7px;height: 7px;border: none;text-indent:-9999px;background-color:rgba(255,255,255,.5);vertical-align: middle;margin-right: 10px;padding: 0;}
        .main_banner_slider .slick-dots li.slick-active button{position: relative;width: 5px;height: 5px;background-color: #fff;}
        .main_banner_slider .slick-dots li.slick-active button::after{display: block;position: absolute;top:-5px;left:-5px;content: '';width: 15px;height: 15px;border:1px solid #fff;}
        .main_banner_slider .slick-dots li:after{display: inline-block;font-family: 'Roboto', sans-serif;font-size: 16px;color: #b1b1b1;vertical-align: middle;cursor: pointer;}
        .main_banner_slider .slick-dots li.slick-active:after{color: #fff;}
        .main_banner_slider .slick-dots li:nth-child(1):after{content:'01'}
        .main_banner_slider .slick-dots li:nth-child(2):after{content:'02'}
        .main_banner_slider .slick-dots li:nth-child(3):after{content:'03'}
        .main_banner_slider .slick-dots li:nth-child(4):after{content:'04'}
        .main_banner_video{display: none;position: fixed;width: 100vw;height: 100vh;top: 0;left: 0;background-color:rgba(0,0,0,.7);z-index: 1000;}
        .main_banner_video .video_popup{position: absolute;top: 50%;left: 50%;transform:translate(-50%, -50%);width: 60%;height: 0;padding-bottom:34%;}
        .main_banner_video .video_popup iframe{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
        .main_banner_video .video_popup .close_btn{position: absolute;top: -75px;right: -75px;cursor: pointer;transform:scale(0.7);transition: .3s;}
        .main_banner_video .video_popup .close_btn:hover{transform:scale(1) rotate(180deg);transition:.3s;}
        .main_intro .container{position: relative;font-size: 0;}
        .main_intro .title_box{position: absolute;top: 75px;left: 50%;transform: translateX(-50%);width:33.333%;z-index:10;text-align: center;}
        .main_intro .title_box:after{content:'';display: block;width: 1px;height: 60px;background-color: #dd3232;position: absolute;bottom: -75px;left: 50%;}
        .main_intro .title_box h2{font-family:NanumSquareB;font-size: 38px;color: #333;margin-bottom: 15px;}
        .main_intro .title_box p{font-size: 16px;color: #666;}
        .main_intro .container .intro_box{display: inline-block;vertical-align: top;width: 33.333%;border-left:1px solid #ccc;}
        .main_intro .container .intro_box:last-child{border-right:1px solid #ccc;}
        .main_intro .img_box{position: relative;overflow: hidden;}
        .main_intro .img_box img{transition:2s;}
        .main_intro .img_box:hover img{transform:scale(1.05);transition:2s;}
        .main_intro .intro_box{height: 1330px;}
        .main_intro .intro_box.box1{padding-top: 500px;}
        .main_intro .intro_box.box2{padding-top: 300px;}
        .main_intro .intro_box.box3{padding-top: 400px;}
        .main_intro .intro_box.box1 .img_box p{right: 15px;}
        .main_intro .intro_box.box2 .img_box p{left: 40px;}
        .main_intro .intro_box.box3 .img_box p{left: 15px;}
        .main_intro .img_box p{position: absolute;bottom: 60px;}
        .main_intro .img_box p::before{content: '';display: inline-block;width: 10px;height: 30px;background-color: #fff;margin-right:15px;vertical-align: middle;transition: .3s;}
        .main_intro .img_box p:hover::before{background-color: #dd3232;transition: .3s;}
        .main_intro .img_box p a{display: inline-block;font-family:NanumSquareRoundR;font-size:26px;line-height: 23px;color: #f5f5f5;vertical-align: middle;border-bottom:1px solid #fff;}
        .main_intro .text_box h3{font-family: 'Oswald', sans-serif;font-weight:500;font-size: 60px;color: #333;text-transform: uppercase;margin-top:55px;}
        .main_intro .intro_box.box1 .text_box h3{padding-left: 30px;}
        .main_intro .intro_box.box2 .text_box h3{padding-left: 100px;color: #dd3232;}
        .main_intro .intro_box.box3 .text_box h3{padding-left: 30px;}
        /* 메인배너 스크롤다운 */
        @keyframes scroll_down_effect {
          from{transform:translate(-50%, 0);}
          to{transform:translate(-50%, 45px);}
        }
        .scroll_down{width: 50px;height: 110px;position: absolute;left: 50%;bottom: 25px;transform: translateX(-50%);text-align: center;}
        .scroll_down span{position: relative;display: inline-block;width: 1px;height: 75px;background-color:rgba(255,255,255,.5);}
        .scroll_down span::after{display: block;content:'';position: absolute;top:10px;left: 50%;animation:scroll_down_effect 1s infinite;
        transform:translateX(-50%);background-color:rgba(0,0,0,0);width: 11px;height: 11px;background:url('../images/main/scroll_dot.png') no-repeat center / cover;border-radius:100%;box-shadow:1px 1px 16px #fff;}
        .scroll_down p{font-family: 'Roboto Condensed', sans-serif;font-weight: 700;font-size: 12px;color: #fff;text-transform: uppercase;line-height: 1.2;}
        /* sub_banner */
        @media all and (min-width:768px) {
        @keyframes banner_scale { from{transform: scale(1.1)}  to{transform: scale(1);}}
        @keyframes banner_text_move {from {opacity: 0;transform: translate3d(0, 100%, 0);} to {opacity: 1;transform: none;}}
        }
        .sub_banner_wrap{position: relative;height: 460px;}
        .sub_banner_wrap .sub_banner_inner{overflow: hidden;}
        .sub_banner{position: relative;height: 460px;user-select:none;animation-name: banner_scale;animation-duration: 2s;}
        .sub_banner .banner_text{position: absolute;top: 50%;left: 0;transform: translateY(-50%);width: 100%;text-align: center;}
        .sub_banner .banner_text h2{font-family: 'Oswald', sans-serif;font-weight: 700;font-size: 50px;color: #fff;margin-bottom: 15px;text-shadow:1px 1px 4px #fff;animation-name: banner_text_move;animation-duration:2s;}
        .sub_banner .banner_text p{font-family:NanumSquareR;font-size: 20px;color: #fff;text-shadow:1px 1px 2px #fff;animation-name: banner_text_move;animation-delay:1s;animation-duration: 2s;opacity: 0;animation-fill-mode: forwards;}
        .sub_banner_wrap .category{position: absolute;left: 0;bottom: 0;width: 100%;border-top:1px solid #fff;border-bottom:2px solid #dd3232;z-index: 100;}
        .sub_banner_wrap .category_ul{font-size: 0;border-left:1px solid #fff;}
        .sub_banner_wrap .category_ul>li{display: inline-block;position: relative;width: 50px;height: 50px;border-right:1px solid #fff;vertical-align: middle;font-size: 0;}
        .sub_banner_wrap .category_ul>li>a{font-family:NanumSquareL;font-size: 15px;color: #fff;transform:skew(-0.1deg)}
        .sub_banner_wrap .category_ul>li>button{display: inline-block;width: 50px;height: 50px;border: none;background:url('../images/icons/category_button.png') no-repeat center rgba(0,0,0,0);vertical-align: middle;transition: .3s;}
        .sub_banner_wrap .category_ul>li>button.on{transform:rotate(-180deg);transition:.3s;}
        .sub_banner_wrap .category_ul>li>button:hover{background-color:rgba(255,255,255,.3);transition: .3s;}
        .sub_banner_wrap .category_ul>li.depth>a{display: inline-block;width:calc(100% - 50px);line-height: 50px;vertical-align: middle;padding-left: 15px;}
        .sub_banner_wrap .category_ul>li.one_depth{width:200px;}
        .sub_banner_wrap .category_ul>li.two_depth{width: 230px;}
        .sub_banner_wrap .category_ul>li.home>a{display: inline-block;width: 100%;text-align: center;line-height: 50px;transition:.3s;}
        .sub_banner_wrap .category_ul>li.home>a:hover{background-color:#dd3232;transition: .3s;}
        .sub_banner_wrap .category_ul .sub_category_ul{display: none;position: absolute;top:52px;left: 0;width: 100%;border-left:1px solid #d9d9d9;border-right:1px solid #d9d9d9;}
        .sub_banner_wrap .category_ul .sub_category_ul li{background-color:#fff;border-bottom:1px solid #d9d9d9;}
        .sub_banner_wrap .category_ul .sub_category_ul li a{display: inline-block;padding:10px 15px;width: 100%;height: 100%;font-weight: 300;color: #333;font-size: 14px;}
        .sub_banner_wrap .category_ul .sub_category_ul li a:hover{background-color:#dd3232;color:#fff;}
        /* sub_page */
        .sub_page.sub_padding{padding:80px 0px 120px;}
        .sub_page .page_wrap{position: relative;}
        .sub_page .page_wrap .contents{position: relative;min-height: 500px;padding-top: 80px;padding-bottom: 115px;}
        .sub_page .page_wrap .contents::before{content:'';display: block;position: absolute;top: 0;left:390px;width: 1px;height: 100%;background-image:linear-gradient(to bottom, #a9a9a9, rgba(0,0,0,0));z-index:-1;}
        .sub_page .title_box{position: relative;text-align: center;padding-bottom: 120px;}
        .sub_page .title_box::after{content: '';display: block;position: absolute;bottom:40px;left: 50%;width: 1px;height: 60px;background-color: #dd3232;}
        .sub_page .title_box h2{font-family:NanumSquareB;font-size: 38px;color: #333;margin-bottom: 10px;}
        .sub_page .title_box p{font-size: 18px;color: #666;line-height: 1.3;}
        .sub_page .page_wrap .line_gradient{position: absolute;top: 0;height: 100%;}
        .sub_page .page_wrap .left_line{left: 0;}
        .sub_page .page_wrap .right_line{right: 0;}
        .sub_page .page_wrap .line_gradient::before{content: '';display: block;position: absolute;top: 0;left: 0;width: 1px;height:50%;background-image:linear-gradient(to bottom, #a9a9a9, rgba(255,255,255,0));}
        .sub_page .page_wrap .line_gradient::after{content: '';display: block;position: absolute;bottom: 0;left: 0;width: 1px;height:50%;background-image:linear-gradient(to top, #a9a9a9, rgba(255,255,255,0));}
        /* ceo */
        .ceo .contents .text_box{margin-top: 300px;padding-left: 30px;}
        .ceo .contents .text_box .ceo_logo{position: relative;padding-left: 45px;margin-bottom: 90px;}
        .ceo .contents .text_box .ceo_logo::before{content:'';display: block;position: absolute;left: 0;top:0;width: 10px;height: 100%;background-color: #dcdcdc;}
        .ceo .contents .text_box .ceo_logo h4{font-family:NanumSquareB;font-size: 24px;color: #333;margin-bottom: 5px;}
        .ceo .contents .text_box p{font-family:NanumSquareR;font-weight: 400;font-size: 18px;color: #666;}
        .ceo .contents .text_box p b{font-weight: 700;color: #333;}
        .ceo .contents .text_box .ceo_sign{margin-top: 60px;}
        .ceo .contents .text_box .ceo_sign h4{font-family:NanumSquareR;font-size: 18px;color: #333;}
        .ceo .contents .text_box .ceo_sign h4 span{font-family:NanumSquareB;color: #dd3232;}
        .ceo .contents .text_box .ceo_sign img{display: inline-block;vertical-align: bottom;margin-left: 15px;}
        /* management */
        .management_wrap>div{font-size: 0;}
        .management_wrap>div .box{display: inline-block;vertical-align: bottom;}
        .management_wrap>div .left_box{width:calc(50% - 15px);}
        .management_wrap>div .right_box{width:calc(50% + 15px);}
        .management_wrap>div .text_box h3{position: relative;font-family:NanumSquareB;font-size: 24px;color: #333;margin-bottom: 30px;}
        .management_wrap>div .text_box h3.red_top_line::before{content: '';display: block;position: absolute;width: 50px;height: 5px;background-color:#dd3232;top: -70px;}
        .management_wrap>div .text_box p{font-family:NanumSquareR;font-size: 18px;color: #666;word-break:keep-all;background-color: #fff;}
        .management_wrap .wrap1 .text_box{padding:0px 50px 0px 30px;}
        .management_wrap .wrap2{margin-top: 80px;}
        .management_wrap .wrap2 .text_box{text-align: right;padding-right: 50px;}
        .management_wrap .wrap2 .text_box h3.red_top_line::before{right: 0;}
        .management_wrap .wrap3 .text_box h3.red_top_line::before{left: 0;}
        .management_wrap .wrap3 .text_box{padding-left: 50px;padding-right: 30px;}
        .management_wrap .wrap3{margin-top: 80px;}
        /* history */
        .history_wrap{position: relative;min-height: 500px;padding:30px 0px 60px 50%;}
        .history_wrap::before{content: '';position: absolute;top: 0;left: 50%;transform:translateX(-50%);width: 4px;height: 100%;border-radius:2px;background-color: #dd3232;}
        .history_wrap .img_box{position: absolute;top: 0;left: 0;width: 390px;}
        .history_wrap .img_box p{position: relative;margin-top: 15px;}
        .history_wrap .img_box p::after{content: '';display: block;position: absolute;top:50%;transform: translateY(-50%);right: 15px;width:calc(100% - 100px);height:2px;background-color:#000;border-radius: 1px;}
        .history_wrap .img_box p span{display: inline-block;width: 70px;font-family: 'Oswald', sans-serif;font-weight: 400;font-size: 16px;color: #666;letter-spacing:1.5px;}
        .history_wrap .history_box{padding-left:80px;margin-bottom: 70px;}
        .history_wrap .history_box:last-child{margin-bottom: 0;}
        .history_wrap .history_box h3{position: relative;font-family: 'Oswald', sans-serif;font-weight:700;font-size: 24px;color: #333;margin-bottom: 20px;}
        .history_wrap .history_box h3::before{content: '';display: block;position: absolute;top: 50%;left:-90px;transform:translateY(-50%);width: 20px;height: 20px;border-radius:100%;border:2px solid #dd3232;background-color: #fff;z-index: 2;}
        .history_wrap .history_box table{width: 100%;table-layout: fixed;}
        .history_wrap .history_box table th{width: 25px;font-weight: 700;font-size: 16px;color: #dd3232;vertical-align: top;line-height: 1.5;}
        .history_wrap .history_box table td{font-size: 16px;font-weight: 500;color: #333;vertical-align: top;line-height: 1.5;letter-spacing:-0.5px;word-break:keep-all;}
        /* organization_page */
        .organization_wrap .table_box{width: 770px;margin:150px auto 0px;}
        .organization_wrap .table_box table{table-layout: fixed;width: 100%;}
        .organization_wrap .table_box table tr{border-bottom:1px solid #dcdcdc;}
        .organization_wrap .table_box table tr *{text-align: center;padding:7px 10px;}
        .organization_wrap .table_box table tr *:first-child{width: 500px;border-right:1px solid #dcdcdc;}
        .organization_wrap .table_box table tr th{background-color: #dd3232;font-family:NanumSquareB;font-size: 18px;color: #fff;}
        .organization_wrap .table_box table tr td{font-family:NanumSquareR;font-size: 18px;color: #333;}
        .organization_wrap .table_box table tr:last-child td{background-color:#f9f9f9;font-family:NanumSquareB;}
        /* directions */
        .directions .map{position: relative;width: 100%;height: 0;padding-bottom: 26%;}
        .directions .map iframe{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
        .directions .address_box{font-size: 0;padding:50px 70px;border:1px solid #a0a0a0; background-color: #fff;transform:translateY(-40px);}
        .directions .address_box>div{display: inline-block;vertical-align: top;margin-top: 10px;}
        .directions .address_box .left_box{width: 130px;}
        .directions .address_box .left_box h3{font-family:NanumSquareB;font-size: 36px;color: #000;}
        .directions .address_box .center_box{width:calc(100% - 400px);border-left:4px solid #dd3232;padding-left: 60px;}
        .directions .address_box .center_box h4{font-family:NanumSquareR;font-size: 24px;color: #333;margin-bottom: 25px;}
        .directions .address_box .center_box ul li{display: inline-block;position: relative;vertical-align: middle;font-family: 'Oswald', sans-serif;font-weight:400;font-size: 16px;color: #666;margin-right: 10px;padding-right: 10px;}
        .directions .address_box .center_box ul li:after{content: '';display: block;position: absolute;top: 50%;transform: translateY(-50%);right: 0;width: 1px;height:12px;background-color:#d9d9d9;}
        .directions .address_box .center_box ul li:last-child:after{display: none;}
        .directions .address_box .center_box ul li b{display: inline-block;font-weight: 700;color: #333;margin-right: 5px;}
        .directions .address_box .right_box{width: 270px;margin-top: 0;}
        .directions .address_box .right_box a{display: block;width: 100%;height: 50px;background-color: #f6f6f6;border:1px solid #eee;font-size: 15px;color: #333;line-height: 48px;padding-left: 15px;margin-bottom: 2px;}
        .directions .address_box .right_box a img{display: inline-block;vertical-align: middle;margin-right: 15px;margin-bottom: 2px;}
        /* product_page */
        .sub_page.product_group_page .page_wrap .contents::before{display: none;}
        .sub_page.product_group_page .page_wrap .line_gradient::after{display: none;}
        .sub_page.product_group_page .page_wrap .left_line.line_gradient::before{height: 100%;background-image:linear-gradient(to top, #a9a9a9, rgba(255,255,255,0));}
        .sub_page.product_group_page .page_wrap .right_line.line_gradient::before{height: 100%;background-image:linear-gradient(to bottom, #a9a9a9, rgba(255,255,255,0));}
        .product_group_page .group_list{position: relative;margin-bottom: 60px;}
        .product_group_page .group_list::after{content: '';display: block;clear: both;}
        .product_group_page .group_list .img_box{position: relative;width: 50%;overflow:hidden;}
        .product_group_page .group_list .img_box .img_text{position: absolute;top: 60px;left: 0;width: 100%;padding:0px 55px;}
        .product_group_page .group_list .img_box .img_text h3{font-family: 'Oswald', sans-serif;font-weight: 300;font-size: 36px;color: #fff;margin-bottom: 5px;text-transform: uppercase;}
        .product_group_page .group_list .img_box .img_text h4{position: relative;display: inline-block;font-family: 'Oswald', sans-serif;font-weight: 500;font-size: 36px;color: #fff;text-transform: uppercase;transition:1s;}
        .product_group_page .group_list .img_box .img_text h5{font-weight: 400;font-size: 24px;color: #f5f5f5;margin:20px 0px 15px;transition:.5s;}
        .product_group_page .group_list .img_box .img_text span{display: inline-block;width: 30px;height: 2px;background-color: #fff;}
        .product_group_page .group_list:hover .img_box .img_text h4{text-shadow:1px 1px 2px #fff;transition:1s;}
        .product_group_page .group_list:hover .img_box .img_text h5{text-shadow:1px 1px 8px #fff;transition:.5s;}
        .product_group_page .group_list .img_box.right .img_text{text-align: right;}
        .product_group_page .group_list.left .img_box{float: left;}
        .product_group_page .group_list.right .img_box{float: right;}
        .product_group_page .group_list.right .img_box .img_text{text-align: right;}
        .product_group_page .group_list .img_box img{transition:2s;}
        .product_group_page .group_list:hover .img_box img{transform:scale(1.05);transition:2s;}
        .product_group_page .group_list .text_box{position: absolute;bottom: 0;width:calc(50% + 50px);background-color: #fff;padding: 50px;padding-bottom: 0;}
        .product_group_page .group_list.left .text_box{right: 1px;}
        .product_group_page .group_list.right .text_box{left: 1px;}
        .product_group_page .group_list .text_box h3{position: relative;font-family: 'Oswald', sans-serif;font-weight: 300;font-size: 36px;color: #333;text-transform: uppercase;line-height: 1.1;margin-bottom: 20px;transition: .3s;}
        .product_group_page .group_list:hover .text_box h3{text-shadow:1px 1px 4px #999;transition: .3s;}
        .product_group_page .group_list .text_box h3::before{content:'';display: block;position: absolute;left: 0;top:-20px;width: 30px;height: 1px;background-color:#dd3232;}
        .product_group_page .group_list .text_box h3 b{font-weight:500;}
        .product_group_page .group_list .text_box ul li{display: inline-block;margin-right: 10px;margin-bottom: 5px;}
        .product_group_page .group_list .text_box ul li img{display: inline-block;vertical-align: middle;margin-right:10px;margin-bottom:5px;}
        .product_group_page .group_list .text_box ul li a{display: inline;font-family:NanumSquareR;font-size: 24px;color: #333;border-bottom:1px solid #333;transition:.3s;}
        .product_group_page .group_list .text_box ul li a:hover{color:#dd3232;border-bottom:1px solid #dd3232;transition:.3s;}
        .product_group_page .group_list .text_box .link_btn{display: inline-block;width: 150px;height: 40px;line-height: 38px;border:1px solid #333;margin-top:20px;text-align: center;border-radius:10px;font-family:NanumSquareB;font-size: 18px;color: #333;transition: .3s;}
        .product_group_page .group_list .text_box .link_btn:hover{border:1px solid #dd3232;color:#dd3232;transition: .3s;}
        /* product_list */
        .product_list_page .product_category{width: 800px;margin:0 auto 80px;font-size: 0;text-align:center;}
        .product_list_page .product_category li{display: inline-block;width:calc(20% - 4px);margin-right: 5px;vertical-align: top;height: 35px;line-height: 35px;background-color: #9b9b9b;font-weight: 500;font-size: 16px;color: #fff;text-align: center;overflow: hidden;cursor: pointer;user-select:none;margin-bottom: 5px;}
        .product_list_page .product_category li:nth-child(5n){margin-right: 0;}
        .product_list_page .product_category li:last-child{margin-right: 0;}
        .product_list_page .product_category li.on{background-color:#dd3232;}
        .product_list_page .title_box:nth-child(n+2){margin-top: 70px;}
        .product_list_page .product_list{display: none;font-size: 0;}
        .product_list_page .product_list1{display: block;}
        .product_list_page .product_box{display: inline-block;width:calc(33.333% - 20px);margin-right: 30px;margin-bottom: 40px;padding-top: 15px;border:1px solid #e6e6e6;vertical-align: top;}
        .product_list_page .product_box:nth-child(3n){margin-right: 0;}
        .product_list_page .product_box h3{position: relative;padding: 15px 25px;font-weight: 500;font-size: 20px;color: #333;line-height: 1.5;}
        .product_list_page .product_box h3::before{content:'';display: block;position: absolute;top: 0;left: 0;width: 10px;height: 100%;background-color:#dd3232;}
        .product_list_page .product_box .img_box{height: 0;padding-bottom: 100%;}
        .product_list_page .product_box .text_box table{table-layout: fixed;width: 100%;font-family:'돋움';font-size: 12px;border-top:1px solid #e6e6e6;}
        .product_list_page .product_box .text_box table tr{border-bottom:1px solid #e6e6e6;}
        .product_list_page .product_box .text_box table th{width: 150px;color:#dd3232;padding:8px 5px 8px 15px;line-height: 1.2;vertical-align: top;}
        .product_list_page .product_box .text_box table td{width: auto;color: #6f6f6f;vertical-align: top;padding:8px 15px 8px 10px;line-height: 1.2;word-break:break-all;}
        .product_list_page .product_box .text_box .pdf{display: inline-block;width: 100%;padding:8px 5px 8px 15px;border-bottom:1px solid #e6e6e6;line-height: 1.2;font-family:'돋움';font-size: 12px;color: #9b9b9b;font-weight:700;}
        .product_list_page .product_box .text_box .pdf span{border-bottom:1px solid #9b9b9b;}
        .product_list_page .product_box .text_box .pdf:hover{color: #dd3232;}
        .product_list_page .product_box .text_box .pdf:hover span{border-bottom:1px solid #dd3232;}
        .product_list_page .product_box .btn_box{padding-top: 40px;text-align: right;}
        .product_list_page .product_box .btn_box a{display: inline-block;position: relative;width: 150px;height: 30px;line-height: 30px;background-color:#dd3232;color: #fff;font-weight: 400;font-size: 13px;text-align: left;padding:0px 40px 0px 10px;}
        .product_list_page .product_box .btn_box a img{position: absolute;top: 50%;right: 15px;transform:translateY(-50%);}
        /* product_view */
        .product_view_page .product_info{font-size: 0;margin-top: 50px;}
        .product_view_page .product_info>div{display: inline-block;vertical-align: top;}
        .product_view_page .product_info .img_box{width: 770px;border:1px solid #d4d4d4;}
        .product_view_page .product_info .info_box{width:calc(100% - 770px);padding-left: 30px;}
        .product_view_page .product_info .info_box h2{position: relative;font-family:NanumSquareB;font-size: 36px;color: #333;padding-left: 25px;}
        .product_view_page .product_info .info_box h2::before{content: '';display: block;position: absolute;top:5px;left: 0;width: 5px;height: 27px;background-color:#dd3232;}
        .product_view_page .product_info .info_box h5{font-family:NanumSquareB;font-size: 18px;color:#dd3232;margin-bottom:10px;margin-top: 15px;}
        .product_view_page .product_info .info_box ul li{font-family:'돋움';font-size: 14px;color: #333;margin-bottom:10px;}
        .product_view_page .product_info .info_box ul li:last-child{margin-bottom: 0;}
        .product_view_page .product_info .info_box ul li::before{content: '- ';}
        .product_view_page .product_info .info_box .btn_box{margin-top: 30px;}
        .product_view_page .product_info .info_box .btn_box a{display: inline-block;width: 100%;height: 45px;line-height: 45px;text-align: center;background-color:#dd3232;color: #fff;font-family:NanumSquareB;font-size: 18px;color: #fff;margin-bottom: 10px;}
        .product_view_page .product_info .info_box .btn_box .page_link{background-color: #333;}
        .product_view_page .product_spec{margin-top: 80px;}
        .product_view_page .product_spec .table_box{overflow-x:auto;overflow-y: hidden;}
        .product_view_page .product_spec .table_box table{width: 100%;table-layout: fixed;border-top:4px solid #dd3232;border-bottom:2px solid #333;margin-bottom: 15px;}
        .product_view_page .product_spec .table_box table tr{border-bottom:1px solid #eee;}
        .product_view_page .product_spec .table_box table tr:last-child{border-bottom: none;}
        .product_view_page .product_spec .table_box table tr>*{border-right:1px solid #eee;word-break:break-all;}
        .product_view_page .product_spec .table_box table tr>*:last-child{border-right:none;}
        .product_view_page .product_spec .table_box table th{width: 300px;text-align: center;font-weight: 500;font-size: 16px;color:#555;padding:10px;background-color: #f8f9fb;}
        .product_view_page .product_spec .table_box table td{text-align: center;font-size: 16px;color:#333;padding:10px;background-color: #fff;}
        .product_view_page .product_spec .table_box table td img{max-width:100%;width:auto!important;height: auto!important;}
        .product_view_page .product_spec .table_box .ps_text p{font-weight: 300;font-size: 16px;color: #666;padding-right: 15px;}
        .product_view_page .product_order{margin-top: 80px;margin-bottom: 50px;}
        .product_view_page .product_order .order_box{width:100%;padding:60px 130px;border:1px solid #a0a0a0;background-color: #f8f9fb;border-radius:30px;margin-top: 30px;font-size: 0;text-align: center;}
        .product_view_page .product_order .order_box .img_box{display: inline-block;vertical-align: top;width:calc(25% - 22.5px);margin-right: 30px;}
        .product_view_page .product_order .order_box .img_box:last-child{margin-right: 0;}
        .product_view_page .product_order .order_box .img_box:nth-child(4n){margin-right: 0;}
        .product_view_page .product_order .order_box .img_box:nth-child(n+5){margin-top: 60px;}
        .product_view_page .to_list{display: block;width: 170px;height: 40px;line-height: 40px;text-align: center;margin:0 auto;background-color:#dd3232;color:#fff;}
        /* other_table */
        .product_view_page .product_spec .table_box .tmc_table th{width: auto;}
        .product_view_page .product_spec .table_box .tmc_table thead th{width: 150px;padding: 0;}
        .product_view_page .product_spec .table_box .tmc_table thead td{padding: 0;}
        .product_view_page .product_spec .table_box .sub_table{margin-top: 50px;}
        .product_view_page .product_spec .table_box .sub_table:first-child{margin-top: 0;}
        .product_view_page .product_spec .table_box .sub_table th{width: auto;}
        /* lab_page */
        .lab_wrap .title h2{position: relative;font-family:NanumSquareB;font-size: 30px;color: #dd3232;padding-bottom: 20px;margin-bottom: 20px;}
        .lab_wrap .title h2:after{content: '';display: block;position: absolute;left: 0;bottom: 0;width: 50px;height: 3px;background-color:#dd3232;}
        .lab_wrap .title p{font-family:NanumSquareR;font-size: 20px;color: #333;line-height: 1.4;}
        .lab_intro{position: relative;margin-bottom: 150px;}
        .lab_intro .container{position: relative;}
        .lab_intro .text_box{position: absolute;left: 45px;bottom: -150px;width: 900px;background-color:rgba(209,22,22,.9);padding: 50px;}
        .lab_intro .text_box h3{position: relative;font-family:NanumSquareB;font-size: 30px;color:#fff;padding-bottom: 20px;margin-bottom: 20px;}
        .lab_intro .text_box h3:after{content:'';display: block;position: absolute;left: 0;bottom: 0;width: 50px;height: 3px;background-color: #fff;}
        .lab_intro .text_box p{font-family:NanumSquareR;font-size: 18px;color:#fff;}
        .rnd_intro{padding-top: 130px;padding-bottom: 70px;}
        .rnd_intro .rnd_box{font-size: 0;margin-top: 40px;margin-bottom: 60px;}
        .rnd_intro .rnd_box>div{display: inline-block;vertical-align: top;height: 374px;}
        .rnd_intro .rnd_box .img_box{width: 370px;background-color:#dd3232;}
        .rnd_intro .rnd_box .img_box .img{transform:translate(-20px, -20px);transition:.5s;}
        .rnd_intro .rnd_box:hover .img_box .img{transform:perspective(700px) rotateY(15deg) translate(-20px, -20px);transition:.5s;}
        .rnd_intro .rnd_box2:hover .img_box .img{transform:perspective(700px) rotateY(-15deg) translate(-20px, -20px);transition:.5s;}
        .rnd_intro .rnd_box .text_box{position: relative;width:calc(100% - 370px);background-color:#fafafa;}
        .rnd_intro .rnd_box .text_box .text{position: absolute;width: 100%;left: 0;top: 50%;transform:translateY(-50%);padding:0px 60px;}
        .rnd_intro .rnd_box2 .text_box .text{right: 0;top: 50%;text-align: right;}
        .rnd_intro .rnd_box .text_box .text::before{content:'';display: block;position: absolute;left:60px;top:48px;background-image:linear-gradient(to right, #bfbfbf, rgba(255,255,255,0));width:calc(100% - 290px);height: 1px;z-index: -1;}
        .rnd_intro .rnd_box2 .text_box .text::before{left: auto;left:unset;right: 60px;background-image:linear-gradient(to left, #bfbfbf, rgba(255,255,255,0));}
        .rnd_intro .rnd_box .text_box .text h4{display: inline-block;font-weight: 500;font-size: 24px;color: #333;padding-bottom: 20px;margin-bottom: 20px;border-bottom:3px solid #dd3232;}
        .rnd_intro .rnd_box .text_box .text p{font-family:NanumSquareR;font-size: 18px;color:#666;}
        .lab_organization{height: 695px;background:url('../images/lab/lab_back1.png') no-repeat center /cover;padding-top: 65px;}
        .lab_organization .img_box{margin-top: 50px;}
        .lab_vision{padding-top: 75px;padding-bottom: 80px;}
        .lab_vision .img_box{margin-top: 80px;}
        /* certificate_page */
        .certificate_page{font-size: 0;}
        .certificate_box{display: inline-block;position: relative;width:calc(25% - 25px);vertical-align: top;margin-right: 30px;padding:40px;border:1px solid #e6e6e6;border-radius:10px;text-align: center;margin-bottom: 30px;overflow: hidden;}
        .certificate_box:hover .download_btn{opacity: 1;transition: .3s;}
        .certificate_box:nth-child(4n){margin-right: 0;}
        .certificate_box .download_btn{display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;z-index: 10;background-color:rgba(0,0,0,.3);opacity: 0;transition:.5s;}
        .certificate_box .download_btn .download{display: block;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width:calc(100% - 60px);height: 50px;line-height:50px;text-align: center; background-color:#dd3232;color:#fff;font-size:22px;border-radius:10px;font-family:'Oswald', sans-serif;}
        .certificate_box .img_box{width: 100%;height: 0;padding-bottom: 143%;border:1px solid #eee;}
        .certificate_box h4{font-weight: 500;font-size: 16px;color: #373737;margin:25px 0px 15px;padding-top: 15px;border-top:1px solid #e6e6e6;}
        .certificate_box p{font-weight: 400;font-size: 12px;color: #6f6f6f;min-height:15px;}
        /* drawing */
        .drawing_table .search_box{text-align: right;margin-bottom: 10px;}
        .drawing_table .search_box .search{display: inline-block;width: 270px;padding:8px 20px;background-color:#fff;border:1px solid #dd3232;border-radius:22.5px;}
        .drawing_table .search_box .search input{display: inline-block;height:30px;vertical-align: middle;border: none;font-size: 14px;color: #333;}
        .drawing_table .search_box .search .search_btn{display: inline-block;width: 21px;height: 21px;border: none;background-color:rgba(0,0,0,0);background:url('../images/icons/red_search_icon.png') no-repeat center / cover;padding: 0;vertical-align: middle;}
        .drawing_table .download_btn{display: inline-block;width: 140px;height: 35px;line-height: 35px;background-color:#999;color:#fff;font-size: 18px;text-align: center;border-radius:18.5px;}
        .drawing_table tbody tr:hover .download_btn{background-color:#dd3232;color: #fff;}
        /* board_table */
        .board_table table{width: 100%;table-layout: fixed;border-top:1px solid #333;}
        .board_table thead th{width: 200px;text-align: center;padding:20px 15px;background-color: #f9f9f9;font-family: 'Oswald', sans-serif;font-weight: 700;font-size: 18px;color: #333;}
        .board_table thead th:nth-child(2){width: auto;}
        .board_table tbody tr{border-bottom:1px solid #e5e5e5;}
        .board_table tbody tr:hover *{color:#dd3232;}
        .board_table tbody td{padding:20px 15px;font-family:NanumSquareR;font-size: 18px;color: #333;text-align: center;vertical-align: middle;}
        .board_table tbody td:first-child{font-family: 'Oswald', sans-serif;}
        .board_table tbody .re{background-color:#f5f5f5;}
        .board_table .re_icon{display: inline-block;width: 17px;height: 16px;background:url('../images/icons/re_png.png') no-repeat center / cover;}
        .board_table tbody .re:hover .re_icon{background:url('../images/icons/re_hover_png.png') no-repeat center / cover;}
        .board_table .lock_icon{display: inline-block;margin-right: 5px;margin-bottom: 3px;}
        .board_table .write_btn{text-align: right;margin-top: 30px;}
        .board_table .write_btn a{display: inline-block;width: 170px;height: 35px;line-height: 35px;color: #fff;font-weight: 400;font-size: 18px;border-radius:17.5px;background-color:#dd3232;text-align: center;}
        /* catalog_page */
        .catalog_page{font-size: 0;}
        .catalog_box{display: inline-block;width:calc(25% - 25px);vertical-align: top;margin-right: 30px;margin-bottom: 30px;}
        .catalog_box:nth-child(4n){margin-right: 0;}
        .catalog_box h4{font-weight: 700;font-size: 15px;color: #333;margin-bottom: 10px;}
        .catalog_box .img_box{width: 100%;height: 0;padding-bottom: 143%;}
        .catalog_box .btn_box{margin-top: 20px;}
        .catalog_box .btn_box a{display: inline-block;width:calc(50% - 15px);margin-right: 30px;background-color:#dd3232;color: #fff;font-family:NanumGothicBold;font-size: 13px;text-align: center;height: 25px;line-height: 25px;border-radius:13px;letter-spacing:-0.5px;user-select:none;}
        .catalog_box .btn_box a:last-child{margin-right: 0;}
        /* notice */
        .board_table tbody td:last-child{font-family: 'Oswald', sans-serif;}
        /* view_page */
        .view_wrap .title{padding:20px 100px;border-top:2px solid #333;border-bottom:1px solid #666;font-size: 0;}
        .view_wrap .title h2{display: inline-block;width:calc(100% - 90px);font-weight: 700;font-size: 24px;color: #333;vertical-align: middle;padding-right: 15px;}
        .view_wrap .title h6{display: inline-block;width: 90px;font-weight: 700;font-size: 16px;color: #333;vertical-align: middle;}
        .view_wrap .contents_box{padding:80px 100px;border-bottom:1px solid #ccc;}
        .view_wrap .contents_box *{margin-bottom: 5px;}
        .view_wrap .prev_next ul li{border-bottom:1px solid #ccc;padding:15px 100px;font-size: 0;}
        .view_wrap .prev_next ul li h5{display: inline-block;width: 100px;font-weight: 700;font-size: 16px;color: #333;vertical-align: middle;}
        .view_wrap .prev_next ul li h5 img{display: inline-block;margin-right: 30px;vertical-align: middle;}
        .view_wrap .prev_next ul li p{display: inline-block;vertical-align: middle;width:calc(100% - 100px);font-weight: 400;font-size: 16px;color: #333;padding-left: 45px;padding-right: 15px;}
        .view_wrap .prev_next ul li p.no_page{color: #999;}
        .view_wrap .btn_box{text-align: center;margin-top: 80px;}
        .view_wrap .btn_box a{display: inline-block;width: 230px;height: 50px;line-height: 50px;background-color: #dd3232;color: #fff;font-weight: 500;font-size: 16px;border-radius:25px;}
        /* agency */
        .agency .search_wrap{background-color: #f9f9f9;padding: 0px 70px;font-size: 0;}
        .agency .search_wrap .left_box{display: inline-block;width:calc(100% - 330px);margin:50px 0px;vertical-align: middle;margin-right:60px;}
        .agency .search_wrap .right_box{display: inline-block;width: 270px;vertical-align: middle;}
        .agency .search_wrap .search_box{border:1px solid #777;border-radius:10px;box-shadow:1px 1px 8px rgba(51,51,51,.4);background-color: #fff;padding:30px;}
        .agency .search_wrap .search_box h3{font-family:NanumSquareR;font-size: 24px;color: #333;margin-bottom: 20px;}
        .agency .search_wrap .search_box h3 b{font-family:NanumSquareB;color: #dd3232;}
        .agency .search_wrap .search_box p{font-size: 16px;color: #333;line-height: 1.5;}
        .agency .search_wrap .search_box ul{margin-top: 30px;}
        .agency .search_wrap .search_box ul li{margin-bottom: 20px;font-size: 0;}
        .agency .search_wrap .search_box ul li:last-child{text-align: right;margin-bottom: 0;}
        .agency .search_wrap .search_box ul li label{display: inline-block;position: relative;width: 200px;vertical-align: middle;font-family:NanumSquareB;font-size: 24px;color:#333;padding:0px 15px;margin-bottom: 0;}
        .agency .search_wrap .search_box ul li label::before{content: '';display: block;position: absolute;left: 0;top: 50%;transform:translateY(-50%);width:6px;height:6px;background-color: #dd3232;}
        .agency .search_wrap .search_box ul li input{display: inline-block;width:calc(100% - 200px);height: 45px;vertical-align: middle;background-color:#fff;border:1px solid #e3e3e3;font-family:NanumSquareB;font-size:18px;color:#333;padding:0px 20px;}
        .agency .search_wrap .search_box ul li input::placeholder{color: #999;}
        .agency .search_wrap .search_box .search_btn{width: 170px;height: 45px;background-color: #dd3232;color: #fff;font-family:NanumSquareB;font-size: 18px;border: none;border-radius:22.5px;}
        .agency .search_wrap .map_box .korea_map{position: relative;cursor: pointer;width: 270px;height: 445px;background:url('../images/korea_map/korea.png') no-repeat center / cover;}
        .agency .search_wrap .map_box .korea_map ul li{position: absolute;transform:scale(0.26);z-index: 10;opacity: 0;transition:.3s;}
        .agency .search_wrap .map_box .korea_map ul li.on{opacity: 1;}
        .agency .search_wrap .map_box .korea_map ul li .sound_only{position: absolute;top: 0;left: 0;font-size: 0;}
        .agency .search_wrap .map_box .korea_map ul li.city_1{top: 5px;left: -51px;}
        .agency .search_wrap .map_box .korea_map ul li.city_2{top:42px;left:15px;z-index: 13;}
        .agency .search_wrap .map_box .korea_map ul li.city_3{top:-123px;left:-71px;z-index: 12;}
        .agency .search_wrap .map_box .korea_map ul li.city_4{top:-205px;left:-127px;}
        .agency .search_wrap .map_box .korea_map ul li.city_5{top: 13px;left: -139px;}
        .agency .search_wrap .map_box .korea_map ul li.city_6{top:121px;left: 44px;z-index: 13;}
        .agency .search_wrap .map_box .korea_map ul li.city_7{top:132px;left:48px;z-index: 13;}
        .agency .search_wrap .map_box .korea_map ul li.city_8{top: -16px;left: -29px;z-index: 13;}
        .agency .search_wrap .map_box .korea_map ul li.city_9{top: -97px;left: -34px;}
        .agency .search_wrap .map_box .korea_map ul li.city_10{top: 174px;left: 120px;z-index: 13;}
        .agency .search_wrap .map_box .korea_map ul li.city_11{top: 199px;left: 168px;z-index: 13;}
        .agency .search_wrap .map_box .korea_map ul li.city_12{top: 113px;left: -116px;}
        .agency .search_wrap .map_box .korea_map ul li.city_13{top: 248px;left: 14px;z-index: 13;}
        .agency .search_wrap .map_box .korea_map ul li.city_14{top: 106px;left: -211px;}
        .agency .search_wrap .map_box .korea_map ul li.city_15{top: 92px;left: -39px;}
        .agency .search_wrap .map_box .korea_map ul li.city_16{top: 242px;left: 95px;}
        .agency .search_wrap .map_box .korea_map ul li.city_17{top: 338px;left: -76px;}
        .agency .result_wrap{margin-top: 80px;}
        .agency .result_wrap table{table-layout: fixed;width: 100%;text-align: center;border-top:1px solid #333;}
        .agency .result_wrap table thead th{background-color: #f9f9f9;padding:20px 15px;font-family:NanumSquareB;font-size: 18px;color: #333;text-align: center;}
        .agency .result_wrap table thead th:nth-child(1){width: 200px;}
        .agency .result_wrap table thead th:nth-child(2){width: 240px;}
        .agency .result_wrap table thead th:nth-child(3){width: auto;}
        .agency .result_wrap table thead th:nth-child(4){width: 270px;}
        .agency .result_wrap table tr{border-bottom:1px solid #d9d9d9;}
        .agency .result_wrap table tr td{padding:20px 15px;font-family: NanumSquareR;font-size: 18px;color: #333;}
        .agency .result_wrap table tr td:nth-child(2){font-family: NanumSquareB;}
        .list_num{margin-top: 40px;font-size: 0;text-align: center;}
        .list_num li{display: inline-block;margin:0px 2.5px;height: 35px;line-height: 33px;border-radius:3px;border:1px solid #e6e6e6;vertical-align: middle;}
        .list_num li.on{border:1px solid #dd3232;}
        .list_num li.on a{color: #dd3232;font-weight: 700;}
        .list_num li a{display: inline-block;width: 100%;height: 100%;font-size: 13px;color:#c7c7c7;padding:0px 5px;}
        /* inquiry_write */
        .write_wrap .secret_box{text-align: right;}
        .write_wrap .secret_box input{display: inline-block;width: 15px;height: 15px;vertical-align: middle;margin:0px 5px 3px 0px;}
        .write_wrap .secret_box label{display: inline-block;font-family:NanumSquareB;font-size: 20px;color: #666;vertical-align: middle;}
        .write_wrap .write_form{border-top:1px solid #333;border-bottom:1px solid #333;padding:20px 0px;}
        .write_wrap .write_form table{table-layout: fixed;width: 100%;}
        .write_wrap .write_form table tr{border-bottom:1px solid #eee;}
        .write_wrap .write_form table tr:last-child{border-bottom:none;}
        .write_wrap .write_form table tr th{width: 240px;font-family:NanumSquareB;font-size: 24px;color: #333;padding:20px 15px;}
        .write_wrap .write_form table tr td{width: auto;padding:20px 0px;}
        .write_wrap .write_form table tr td input{width: 100%;height: 50px;border:1px solid #a0a0a0;border-radius:5px;padding:0px 15px;font-size: 18px;transition:.3s;vertical-align: middle;}
        .write_wrap .write_form table tr td input:focus{transform:scale(1.02);background-color:#dd3232;color:#fff;transition:.3s;}
        .write_wrap .write_form table tr td input:focus::placeholder{color:#fff;}
        .write_wrap .write_form table tr td textarea{width: 100%;height: 280px;border:1px solid #a0a0a0;border-radius:5px;padding:15px;font-size: 18px;resize:none;}
        .write_wrap .write_form table tr td textarea:focus{transform:scale(1.02);background-color:#dd3232;color:#fff;transition:.3s;}
        .write_wrap .write_form table tr td .capcha_input{width:380px;margin-left:10px;}
        .write_wrap .btn_box{text-align: center;margin-top: 40px;}
        .write_wrap .btn_box input{width: 270px;height: 60px;background-color:#fff;border:1px solid #a0a0a0;font-family:NanumSquareB;font-size: 20px;color: #555;border-radius:30px;margin:0px 15px;}
        .write_wrap .btn_box input:last-child{background-color:#dd3232;color: #fff;border:1px solid #dd3232;}
        /* secret_check */
        .secret_check{padding:70px 370px;text-align: center;border:1px solid #ddd;}
        .secret_check h2{font-size:40px;color: #333;margin-bottom:15px;font-family:NanumSquareB;}
        .secret_check input{width: 100%;height: 50px;border:1px solid #a0a0a0;text-align:center;font-size:21px;border-radius:25px;}
        .secret_check input::placeholder{font-family:NanumSquareB;font-size: 18px;color:#666;}
        .secret_check .btn_box{font-size: 0;margin-top: 20px;}
        .secret_check .btn_box a{display: inline-block;vertical-align: middle;width:calc(50% - 15px);margin-right: 30px;text-align: center;line-height:48px;font-size: 18px;color: #333;border:1px solid #a0a0a0;border-radius:25px;font-family:NanumSquareB;}
        .secret_check .btn_box a:first-child{background-color:#dd3232;color: #fff;border:1px solid #dd3232;}
        .secret_check .btn_box a:last-child{margin-right: 0;}
        /* estimate */
        .estimate_wrap .estimate_table{margin-bottom: 40px;border-top:1px solid #333;border-bottom:1px solid #333;padding:15px 0px;}
        .estimate_wrap table{table-layout: fixed;width: 100%;}
        .estimate_wrap table tr{border-bottom:1px solid #eee;}
        .estimate_wrap table tr:last-child{border-bottom: none;}
        .estimate_wrap table tr th{width: 240px;font-family:NanumSquareB;font-size: 24px;color: #333;padding:20px 25px;}
        .estimate_wrap table tr td{width: auto;padding:20px 0px;}
        .estimate_wrap table tr td input{width: 100%;height: 50px;border:1px solid #a0a0a0;border-radius:5px;padding:5px 15px;font-size: 16px;transition: .3s;vertical-align: middle;}
        .estimate_wrap table tr td textarea{width: 100%;height: 280px;border:1px solid #a0a0a0;border-radius:5px;padding: 15px;font-size: 16px;transition: .3s;vertical-align: middle;resize:none;}
        .estimate_wrap table tr td input:focus{border:2px solid #dd3232;transition:.3s;}
        .estimate_wrap table tr td textarea:focus{border:2px solid #dd3232;transition:.3s;}
        .estimate_wrap table tr.mail_tr{font-size: 0;}
        .estimate_wrap table tr.mail_tr td input{width:calc(50% - 45px);}
        .estimate_wrap table tr.mail_tr td span{display: inline-block;width: 90px;font-family:NanumSquareR;font-size: 38px;color:#666;text-align: center;vertical-align: middle;}
        .estimate_wrap .btn_box{text-align: center;}
        .estimate_wrap .btn_box input{display: inline-block;background-color:#fff;border:1px solid #a0a0a0;width: 270px;height: 65px;border-radius:30px;font-family:NanumSquareB;font-size: 20px;color:#555;margin:0px 15px;}
        .estimate_wrap .btn_box input[type="submit"]{background-color:#dd3232;border:1px solid #dd3232;color: #fff;}
        .estimate_wrap .btn_box input[type="button"]{background-color:#dd3232;border:1px solid #dd3232;color: #fff;}

/* estimate_complete */
        .estimate_wrap .complete_box{text-align: center;}
        .estimate_wrap .complete_box .text_box{margin:50px auto 70px;}
        .estimate_wrap .complete_box .text_box h3{font-family:NanumSquareR;font-size: 38px;color: #333;line-height: 1.5;}
        .estimate_wrap .complete_box .text_box h3 b{font-family:NanumSquareB;}
        .estimate_wrap .complete_box a{display: inline-block;width: 270px;height: 65px;line-height: 65px;background-color:#dd3232;text-align: center;font-family:NanumSquareB;font-size: 20px;color: #fff;border-radius:30px;}
        /* footer */
        .footer_customer{height: 400px;background:url('../images/main/footer_customer.png') no-repeat center / cover;font-size: 0;user-select:none;}
        .footer_customer .text_box{display: inline-block;vertical-align: top;width: 520px;padding-top: 75px;}
        .footer_customer .icon_box{display: inline-block;vertical-align: top;width:calc(100% - 520px);}
        .footer_customer .text_box h2{font-family: 'Oswald', sans-serif;font-weight: 400;font-size: 54px;color: #fff;text-transform: uppercase;margin-bottom:20px;}
        .footer_customer .text_box h4{display: inline-block;width: auto;font-family:NanumSquareL;font-size: 24px;color:#fff;border-bottom:1px solid #fff;}
        .footer_customer .text_box a{display: inline-block;width:270px;height: 60px;line-height: 58px;border:1px solid #fff;text-align: center;font-weight: 300;font-size: 16px;color: #fff;margin-top: 80px;transition: .3s;}
        .footer_customer .text_box a:hover{background-color:#dd3232;box-shadow:2px 2px 4px #dd3232;transform:scale(1.02);transition: .3s;}
        .footer_customer .icon_wrap{display: inline-block;vertical-align: top;width:calc(100% - 520px);padding-top: 100px;}
        .footer_customer .icon_wrap .icon_box{position: relative;display: inline-block;width:calc(25% - 22.5px);height: 132px;margin-right: 30px;border: 1px solid #fff;border-radius:10px;transition: .3s;}
        .footer_customer .icon_wrap .icon_box:hover{background-color:#dd3232;transition: .3s;}
        .footer_customer .icon_wrap .icon_box a{display: inline-block;width: 100%;height: 100%;}
        .footer_customer .icon_wrap .icon_box .icon{width: 100%;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
        .footer_customer .icon_wrap .icon_box .icon p{text-align: center;font-size:16px;letter-spacing:-1px;color: #fff;margin-top: 5px;}
        .footer_customer .icon_wrap .icon_box:last-child{margin-right: 0;}
        footer{padding:30px 0px;background-color:#333;color: #fff;}
        footer .text_box{position: relative;}
        footer .text_box h4{font-family:NanumSquareB;font-size: 19px;color: #fff;margin-bottom:10px;}
        footer .text_box p{font-weight:300;font-size: 16px;color: #fff;line-height: 1.5;}
        footer .text_box b{font-weight:500;}
        footer .text_box .top_btn{display: inline-block;position: absolute;top: 50%;right:0;transform: translateY(-50%);text-align: center;width: 95px;height: 35px;line-height: 31px;border:2px solid #fafafa;font-family:'Roboto', sans-serif;font-weight: 700;font-size: 15px;color: #fff;border-radius:5px;}
        footer .text_box .top_btn img{display: inline-block;margin-left:15px;}
        .copyrights{text-align: center;font-weight: 300;font-size: 15px;color: #9b9b9b;padding:15px 0px;}

/* .. */