﻿/***** Start of Common using class *****/
.clearFix:after{ content: ''; display: block; clear: both; }
.page_width{position:relative;width:1200px;max-width:100%;margin:0 auto}
#content{width:100%;margin:0 auto}
.page_main_in{padding:50px 0;min-height:500px}
.group_tab>ul>li>a[class='selected'], .group_tab>ul>li>a:hover, .group_tab>ul>li>a:focus{background:#622b7e;border-color:#622b7e}
.page_width{position:relative;width:1200px;max-width:100%;margin:0 auto}
.page_top_menu{position:relative;z-index:1000;display:none}
body{ margin-left: 260px; }
/* 1. Style the overlay & navigation. */
.overlay{position:fixed;z-index:9;background:#000;top:0;left:0;width:100%;height:100%;opacity:0;visibility:hidden;transform:scale(0.5);transition:opacity .3s, visibility .3s, height .3s, transform .3s ;display:flex;align-items:center;justify-content:center;text-align:left}
.overlay.visible{opacity:1;visibility: visible;height: 100%;transform:scale(1)}
/***** End of Common using class *****/

/***** Start of Header *****/
#header .header-top{ position: fixed; width: 260px; height: 100%; left: 0; z-index: 9999; background: #D01C24; font-family: 'Raleway', 'Noto sans CJK KR', 'sans-serif'; }
#header .header-top.m9Fixed{ margin-top: 0; transition: all 0.3s; }
#header .header-top .logo-image{ display: block; position: relative; z-index: 6000; width: 139px; height: 66px; margin: 40px 0 0 50px; background: url(/etc_img/logo/_logo_m_off.png) no-repeat 100% 100%; }
#header .lnb .page_up_link::after{ display: block; content: ""; clear: both; }
#header .lnb .page_up_link_box .lnb-fnc-2,
#header .lnb .page_up_link_box .lnb-fnc{ display: none; }
#header .lnb .page_up_link_box .lnb-fnc{ position: absolute; top: 25px; left: 20px; font-size: 25px; color: #FFF; }
#header .lnb .page_up_link_box .lnb-fnc .hamburger, #header .lnb .page_up_link_box .lnb-fnc-2 .close-btn{ font-family: 'axicon'; font-style: normal; font-size: 30px; }
#header .lnb .page_up_link_box .lnb-fnc .hamburger::after{ content: "\f0c9"; }
#header .lnb .page_up_link_box .lnb-fnc-2 .close-btn::after{ content: "\e937"; }
#header .lnb .page_up_link .mong9menu > ul{ margin: 60px 0 0 50px; }
#header .lnb .page_up_link .mong9menu > ul > li > a{ display: block; margin: 0 0 16px 0; color: #FFF; font-size: 1.3em; font-weight: 400; }
#header .lnb .page_up_link .mong9menu > ul > li > a:after{ display: block; position: relative; top:3px; content: ""; width: 15px; height: 1px; border-bottom: 2px solid #FFF; transition: all 0.3s; }
#header .lnb .page_up_link .mong9menu > ul > li > a:hover:after{ width: 60px; transition: all 0.3s; }
#header .lnb .has-down.on .mong9menu-sub > ul{ max-height: 500px; transition: all 1s; }
#header .lnb .page_up_link .mong9menu-sub > ul > li:last-child{ border-bottom: 0; }
#header .lnb .page_up_link .mong9menu-sub > ul > li{ border-bottom: 1px solid #C9C9C9; }
#header .lnb .page_up_link .mong9menu-sub > ul > li > a{ display: block; padding: 10px 0 10px 10px; font-family: 'NanumSquare', 'sans-serif'; font-size: 0.8em; }
#header .lnb .page_up_link .mong9menu-sub > ul > li > a:hover{ background: rgba(0,0,0,0.1); font-weight: 600; transition: all 0.5s; }
#header .lnb .page_up_link .mong9menu-sub{ margin-bottom: 15px; }
#header .lnb .page_up_link .mong9menu-sub > ul{ position: relative; top: -5px; left: -5px; overflow: hidden; max-height: 0; margin-right: 20px; background: #EDEDED; border-radius: 2px; }
/***** End of Header *****/

/***** Start of SubPage Header *****/
.header-background-home{background:url(http://blustart.co.kr/etc_img/otherpage/bg/product.jpg)}
.header-background-company,.header-background-sitemap,.header-background-home{background-image:url(/etc_img/otherpage/bg/company.jpg); background-position:0% 0%; background-attachment:fixed}
.header-background-business,.header-background-091610396,.header-background-091615925,.header-background-community{ background-position: 0 0%;background-attachment:fixed }
.header-background-business{ background-image:url(/etc_img/otherpage/bg/business.jpg); }
.header-background-091610396{ background-image:url(/etc_img/otherpage/bg/service.jpg); }
.header-background-091615925{ background-image:url(/etc_img/otherpage/bg/instrument.jpg); }
.header-background-community{ background-image:url(/etc_img/otherpage/bg/community.jpg); }

/*!* 탭 메뉴 *!*/
.page_tab_div{position:relative;z-index:199;padding-top:5px;margin-top:30px}
.page_tab_div>div{position:relative;width:1200px;max-width:100%;margin:0 auto;overflow:hidden;padding-bottom:10px;bac1kground:#f5f5f5}
.page_tab{position:relative;display:block;white-space:nowrap;text-align:left;background:#fff;border:1px solid #ddd;border-bottom-color:#858585}
.page-tab-one{display:inline-block;*display:inline;*zoom:1}
.page_tab .slick-slide{display:inline-block;*display:inline;*zoom:1;padding:0}
.page-tab-one>a{display:inline-block;*display:inline;*zoom:1;min-width:150px;padding:15px;margin:0;border:1px solid #ccc;border-top:none;border-bottom:none;margin-left:-1px;margin-top:-1px;text-align:center;font-we1ight:bold}
.page-tab-one>a.selected,.page-tab-one>a:hover,.page-tab-one>a:focus{position:relative;background:#1d1c6d;color:#fff}
.page-tab-one>a.selected::before{content:'';position:absolute;left:0;bottom:-1px;z-index:1;width:100%;height:2px;background:inherit}
.page-tab-one>a.selected::after{content:'';position:absolute;left:50%;bottom:-7px;z-index:-1;width:15px;height:15px;transform:rotate(45deg);margin-left:-7px;background:inherit}
.page_tab_div.m9Fixed{position:fixed;top:77px;left:0;width:100%;background:#fff;margin-top:0}

/***** Start of Container *****/
#container{ background: url(img/003/main-01.jpg); }
/***** End of Container *****/

/***** Start of Mobile View  439(Smartphone), 683(Smartphone portrait)  *****/
@media screen and (max-width: 439px){
    #header .header-top { position: relative; width: 100%; height: 80px; }
    #header .header-top.m9Fixed{ position: fixed; }
    #header .header-top .logo-image { top: 15px; width: 150px; height: 45px; margin: 0 auto; background-size: contain; }
    #header .lnb .page_up_link { position: fixed; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0); }
    #header .lnb .page_up_link .mong9menu { position: fixed; top: 0; left: -100%; z-index: 7000; width: 65%; height: 100%; background: #D01C24; box-shadow: 6px 0 6px rgba(0, 0, 0, 0.3); transition: all 0.5s; }
    #header .lnb .page_up_link .lnb-fnc-2 { position: absolute; top: 5px; right: -35px; color: #FFF; font-size: 2em; }
    #header .lnb .mong9menu > ul { margin: 50px 0 0 40px; }
    #header .lnb .page_up_link_box .lnb-fnc-2, #header .lnb .page_up_link_box .lnb-fnc{ display: block; z-index: 5000; }
    #header .lnb.on_side .page_up_link{ z-index: 6000; background: rgba(0,0,0,0.5); transition: all 0.5s; }
    #header .lnb.on_side .page_up_link .mong9menu{ left: 0; transition: all 0.5s; }
    /*
    #header .header-top{ margin-top: 0; }
    #header .logo-image{ top: 10px; left: 5px; width: 150px; height: 45px; background: url(/etc_img/logo/logo_m_off.png) no-repeat 100% 100%; background-size: contain; }
    #header .page_banner{ left: 0; top: 10px; }
    #header .lnb{ width: 100%; height: 65px; }
    #header .lnb.on_side .page_up_link{ right: 0; transition: all 0.5s; }
    #header .lnb .page_up_link_box{ left: 0; width: 100%; }
    #header .lnb .page_up_link_box .lnb-fnc, #header .lnb .page_up_link_box .lnb-fnc-2{ display: block; }
    #header .lnb .page_up_link_box .lnb-fnc{ position: absolute; top: 10px; right: 15px; font-size: 1.5em; }
    #header .lnb .page_up_link .lnb-fnc-2{ position: absolute; top: 0; left:0; width: 100%; height: 60px; background: #171750; }
    #header .lnb .page_up_link .lnb-fnc-2:before { content: "Menu"; display: block; position: absolute; top: 17px; left: 15px; font-size: 1.3em; font-family: "helvetica", 'Noto sans CJK KR', 'sans-serif'; }
    #header .lnb .page_up_link .mong9menu{ position: absolute; right: 0; width: 70%; height: 100%; padding-top: 60px; background: #F3F3F3; }
    #header .lnb .page_up_link .mong9menu > ul > li > a{ padding: 18px 20px; font-size: 0.9em; color: #2F2F2F; font-weight: 300; border-bottom: 1px solid #CECECE; }
    #header .lnb .page_up_link .mong9menu .has-down.on > a{ background: #63B635; color: #FFF; }
    #header .lnb .page_up_link .mong9menu .has-down > a:after{ display: block; position: absolute; top: 20px; right: 10px; content: "\f107"; font-family: 'axicon'; font-style: normal; font-weight: bold; text-decoration: inherit; transition: all 0.5s; }
    #header .lnb .page_up_link .mong9menu .has-down.on > a:after{ transform: rotate(180deg); transition: all 0.5s; }
    #header .lnb .page_up_link .mong9menu > ul > li{ float: none; }
    #header.on .lnb .mong9menu > ul > li:hover .mong9menu-sub{ display: none; }
    #header .lnb .page_up_link .mong9menu .has-down.on .mong9menu-sub{ display: block; height: auto; }
    #header .lnb .page_up_link .mong9menu .mong9menu-sub{ position: relative; }
    #header .lnb .page_up_link .mong9menu .mong9menu-sub > ul > li > a{ padding: 10px 0 10px 25px; background: #EDEDED; color: #777; }
    #header .lnb .page_up_link .lnb-fnc-2 .close-btn{ position: absolute; top: 15px; right: 10px; width: 30px; height: 30px; text-align: center; font-size: 24px; border: 2px solid #FFF; border-radius: 50%; }
    #header .lnb .page_up_link .lnb-fnc-2 .close-btn > i{ vertical-align: middle; }
    #header .lnb .page_up_link .lnb-fnc-2 .close-btn:before{ position: relative; top: 5px; }
    */
}
/***** End of Mobile View *****/

/***** 페이지 상단 유저기능메뉴 *****/
.page_top_menu{position:relative;z-index:1000;display:none}

/*!* 현재위치 메뉴 *!*/
.current-cate{border:1px solid #ccc;border-left:none;border-right:none;font-size:15px;background:#fff;border-top:0}
.current-cate>div{position:relative;width:1200px;max-width:100%;margin:0 auto}
.current-cate-home{display:inline-block;*display:inline;*zoom:1;height:50px;line-height:50px;font-family:'axicon';color:#666;font-size:20px;padding:0 20px;vertical-align:bottom;bo1rder-right:1px solid #ccc}
.current-cate-home:before{content:'\e6c3'}
.current-root:before{content:'\e6c3 ~ '}
.current-cate-url{display:inline-block;*display:inline;*zoom:1}
.current-cate-url>li{display:inline-block;margin-right:-1px}
.current-cate-btn{position:relative;display:inline-block;*display:inline;*zoom:1;min-width:220px;height:50px;line-height:50px;padding:0 40px 0 10px;border-right:1px solid #ccc;border-left:1px solid #ccc;background:#fff;white-space:nowrap}
.current-cate-btn.current-empty{background:#e1f8fd}
.current-cate-btn::before{content:' ';position:absolute;top:0;bottom:0;right:0;width:30px;background:inherit}
.current-cate-btn::after{content:'\e84e';position:absolute;right:10px;font-family:'axicon';-webkit-transition:all 0.2s;-moz-transition:all 0.2s;-o-transition:all 0.2s;-ms-transition:all 0.2s;transition:all 0.2s}
.current-cate-btn.on{background:#f5f5f5}
.current-cate-btn.on::after{transform:rotate(180deg)}
.current-cate-btn:hover,.current-cate-btn:focus{color:#1d1c6d}
.current-cate-url>li>dl>dd{position:relative}
.current-cate-sub{position:absolute;z-index:200;width:100%;display:none;margin-top:1px}
.current-cate-sub>ul>li>a{display:block;*display:inline;*zoom:1;width:100%;height:50px;line-height:50px;padding:0 10px;border:1px solid #ccc;margin-top:-1px;background:#fff;position:relative;z-index:1;white-space:nowrap;overflow:hidden}
.current-cate-sub>ul>li>a:hover,.current-cate-sub>ul>li>a:focus,.current-cate-sub>ul>li>a.active{color:#1d1c6d}

/*!* 하단 메뉴 *!*/
.page_down_link{border-top:1px solid #eaeaea;border-right:none;border-left:none;background:#5a5a5a}
.page_down_menu{position:relative;width:1200px;max-width:100%;margin:0 auto;text-align:right;font-size:15px}
.page_down_menu>ul{display:inline-block;*display:inline;*zoom:1}
.page_down_menu>ul>li{display:inline-block;*display:inline;*zoom:1}
.page_down_menu>ul>li>a{display:inline-block;*display:inline;*zoom:1;padding:13px 20px;color:#fff}
.page_down_menu>ul>li>a:hover,.page_down_menu>ul>li>a:focus,.page_down_menu>ul>li>a.selected{color:#381b51}
.page_down{background-color:#5a5a5a;color:#fff}

/*!* goTop 가기 *!*/
.goTop{position:fixed;right:0;bottom:50px;background:rgba(0,0,0,0.5);padding:10px;color:#fff;cursor:pointer;text-decoration:none;opacity:0;border-radius:5px;border:2px solid #fff;-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s}
.goTop.on{right:50px;opacity:1}

/*!* 헤더 *!*/
.header-group{position:relative;background-color:#fff;background-repeat:no-repeat;backgr1ound-size:cover}
.header-group::before{content:'';position:absolute;top:0;bottom:0;display:block;width:100%;background-color: rgba(0,0,0,0,0);displ1ay:none}
/*!* === .header-background- + 코드값으로 상단 이미지 변경함 === *!*/
/*!* header-background-home 은 나머지 기타 *!*/
.header-background-home{backgroun1d-image:url(http://blustart.co.kr/etc_img/otherpage/bg/product.jpg)}
.header-background-company,.header-background-sitemap,.header-background-home{background-image:url(/etc_img/otherpage/bg/company.jpg); background-position:0% 0%; background-attachment:fixed}
.header-background-business{ background-image:url(/etc_img/otherpage/bg/business.jpg); }
.header-background-091610396{ background-image:url(/etc_img/otherpage/bg/service.jpg); }
.header-background-091615925{ background-image:url(/etc_img/otherpage/bg/instrument.jpg); }
.header-background-community{ background-image:url(/etc_img/otherpage/bg/community.jpg); }
.header-background-online{ background-image:url(/etc_img/otherpage/bg/community.jpg); }

/***** 모바일 세로 *****/
@media screen and (max-width:439px)
{
    body{ margin-left: 0; }
    #header .lnb .page_up_link_box .lnb-fnc{ top: calc(50% - 16px); right: 15px; color: #FFF; }
    #header .lnb .page_up_link_box .lnb-fnc, #header .lnb .page_up_link_box .lnb-fnc-2{ display: block; }
    #header .lnb .page_up_link .mong9menu .mong9menu-sub > ul > li > a:hover{ color: #333; transition: all 0.3s; }
    /*!* 현재위치 메뉴 *!*/
    .current-cate{font-size:12px}
    .current-cate-url{display:block}
    .current-cate-url>li{width:50%}
    .current-cate-home{display:none}
    .current-cate-btn{width:100%;min-width:auto;height:40px;line-height:40px}
    .current-cate-sub>ul>li>a{height:40px;line-height:40px}
}

/***** 모바일 가로 *****/
@media screen and (max-width:638px)
{
    .header-group{background:#1D1C6D}
    #header.on .lnb:after{border:0.5px solid rgba(80,80,80,0);}
    #header .lnb:after{display:block;content:'';border:0.5px solid rgba(255,255,255,0);width:100%;position:absolute;top:90px}

    /* 탭 메뉴 */
    .page_tab_div{font-size:12px;margin-top:0}
    .page-tab-one>a{min-width:auto;padding:10px 20px}
    .page_tab_div.m9Fixed{position:fixed;top:60px}
    .gnb{display:none}
    .page_main_in{padding:10px;min-height:auto}
    .header-background-company  {background-position:50% 50%; background-attachment:local;background-size:cover}
    .header-background-business {background-position:50% 0%; background-attachment:local;background-size:cover}
    .header-background-091610396{background-position:60% 0%; background-attachment:local;background-size:cover}
    .header-background-091615925{background-position:50% 0%; background-attachment:local;background-size:cover}
    .header-background-community{background-position:50% 0%; background-attachment:local;background-size:cover}
}