@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url('https://cdn.rawgit.com/innks/NanumSquareRound/master/nanumsquareround.min.css');
body,html { font-family: 'Noto Sans KR',sans-serif; color: #1b1d1f; line-height: 1.2 !important; box-sizing: border-box;} 
html { font-size: 10px !important; } 
body { font-size: 1.6rem !important; font-weight: 400;}
article {width: 100%;}
input[type='text'], input[type='password'], input[type='submit'], input[type='search'] {
	line-height: 1;
}
input[type='text']::placeholder {col}
.txtUnder { text-decoration: underline } 
.innerSection { max-width: 1200px; width: calc(100% - 40px); margin: 0 auto; } 
.border_none { border: none !important } 
.bold { font-weight: bold; } 
.bold02 { font-weight: 500; } 
.block { display: block !important } 
.normal { font-weight: normal !important } 
.f30 { font-size: 3rem !important } 
.f20 { font-size: 2rem !important } 
.f18 { font-size: 1.8rem !important } 
.f14 { font-size: 1.4rem !important } 
.f13 { font-size: 1.3rem !important } 
.f12 { font-size: 1.2rem !important } 
.blue { color: #36ace3; } 
.gray { color: #72787f } 
.gray02 { color: #9ea4aa } 
.black { color: #1b1d1f !important } 
.orange { color: #f09338 !important } 
.red { color: #ff0000 } 
.navy { color: #454c53 !important } 
.mla { margin-left: auto } 
.mh60 { max-height: 60px } 
.mb50 { margin-bottom: 5rem } 
.mr10 { margin-right: 1rem } 
.mg15 { margin: 1.5rem 0 } 
.mg50 { margin: 5rem 0 } 
.mgw50 { margin: 5rem } 
.ml0 { margin-left: 0 !important } 
.mt0 { margin-top:0rem !important } 
.mt5 { margin-top: 0.5rem !important } 
.mt10 { margin-top: 1rem } 
.mt15 { margin-top: 1.5rem } 
.mt40 { margin-top: 4rem !important } 
.mt20 { margin-top: 2rem } 
.mt30 { margin-top: 3rem } 
.mt50 { margin-top: 5rem !important } 
.mt60 { margin-top: 6rem } 
.mt70 { margin-top: 7rem } 
.ml15 { margin-left: 1.5rem } 
.ml5 { margin-left: .5rem } 
.mb5 { margin-bottom: 0.5rem !important } 
.mb10 { margin-bottom: 1rem !important } 
.mb15 { margin-bottom: 1.5rem !important } 
.mb20 { margin-bottom: 2rem !important } 
.mb30 { margin-bottom: 3rem !important } 
.mb40 { margin-bottom: 4rem !important } 
.mb10 { margin-bottom: 1rem !important } 
.w100 { width: 100% !important; } 
.wd100 { width: 100px } 
.mw250 { max-width: 250px; width: 100% } 
.w210 { width: 210px; } 
.w130 { width: 130px; } 
.w280 { max-width: 280px; width: 100% } 
.w380 { max-width: 380px; width: 100% } 
.w500 { max-width: 500px; width: 100% } 
.w800 { max-width: 800px !important } 
.w760 { max-width: 760px !important } 
.w700 { max-width: 700px !important } 
.w600 { max-width: 600px !important } 
.w960 { max-width: 960px !important } 
.mw150 { max-width: 150px } 
.w120 { max-width: 120px; width: 100% } 
.pd0 { padding:0 !important } 
.pl15 { padding-left: 15px } 
.pl10 { padding-left: 10px !important } 
.pl20 { padding-left: 20px !important } 
.pl30 { padding-left: 30px !important } 
.pl40 { padding-left: 40px !important } 
.pd10 { padding: 10px !important } 
.pd20 { padding: 2rem !important } 
.pd10_02 { padding: 10px 0!important } 
.pd20_02 { padding: 0 20px } 
.pr0 { padding-right: 0 !important } 
.f14 { font-size: 1.4rem } 
.fl { float: left } 
.fr { float: right } 
.tct { text-align: center !important } 
.tlt { text-align: left !important } 
.trt { text-align: right !important } 
.clear:after { content: ''; display: block; clear: both; } 
.txtCut1 { width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; } 
td.txtCut1 { display: table-cell } 
.txtCut2 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 2rem; height: 4rem; } 
.dotlist li + li { margin-top: .5rem } 
.ir_pm { display:block; overflow:hidden; font-size:0; line-height:0; text-indent:-9999px; } 

/* header */
#header {position: relative; width: 100% !important; border-bottom: 1px solid #dadada;}
#header.main_header {border-bottom: 0;}
#header .top { display: flex; padding-top: 3rem; margin-top: 1rem; justify-content: space-between; align-items: center; box-sizing: border-box; } 
#header .top .logo img {display: block;}
#header .top .right_box { display: flex; position: relative; align-items: center; } 
#header .top .logo a {display: block;}
#header .top .seach_area { position: relative; width: 230px; } 
#header .top .seach_area .input_wrap { display: flex; width: 100%; padding: 10px 10px; margin-left: 0; border: 1px solid #373737; border-radius: 30px; justify-content: space-between; overflow: hidden; box-sizing: border-box;} 
#header .top .seach_area .input_wrap input { width: calc(100% - 30px); border: 0; font-size: 1.4rem; } 
#header .top .seach_area .input_wrap input:focus { outline: none; } 
#header .top .seach_area .input_wrap input::placeholder { color: #bcbcbc; font-size: 1.4rem; opacity: initial;} 
#header .top .seach_area .input_wrap button { width: 20px; height: 19px; background: url(../../images/hanmi/seach_ico.png) center / contain no-repeat; border: 0; text-indent: -99999px; } 
#header .member_box { display: flex; position: absolute; top: -30px; right: 0; } 
#header .member_box li { position: relative; } 
#header .member_box li + li::before { content: ''; width: 1px; height: 14px; position: absolute; left: 0; top: 50%; transform: translateY(-40%); background: #636363; } 
#header .member_box li + li { margin-left: 8px; padding-left: 8px; } 
#header .member_box li a { color: #636363; font-size: 1.3rem; } 
#header .member_box li.login a { color: #064a84; font-weight: 500; } 
#header .header_gnb { display: flex; height: 9rem; margin-left: 50px;} 
#header .header_gnb::before { content: ''; height: 0; background-color: #f9f9f9; position: absolute; top: 12rem; left: 0; right: 0; z-index: 5; transition: 0.4s ease; box-shadow: 0 0.8rem 1rem 0 rgba(80, 80, 80, 0.1); } 
#header .header_gnb.on::before { height: 38rem; border-top: 1px solid #dadada; } 
#header .header_gnb .gnb_wrap { height: 100%; position: relative; } 
#header .header_gnb .gnb_wrap + .gnb_wrap { margin-left: 6rem; } 
#header .header_gnb .gnb_wrap .balloon { display: none; padding: 4px 4px; position: absolute; top: 6px; left: 0; background: #eef2f5; border-radius: 20px; } 
#header .header_gnb .gnb_wrap .balloon::after { content: ''; position:absolute; bottom: -6px; left: 10px; border-top: 6px solid #eef2f5; border-left: 6px solid transparent; border-right: 0px solid transparent; border-bottom: 0px solid transparent; } 
#header .header_gnb .gnb_wrap .balloon span { display: block; color: #346c9b; font-size: 10px; } 
#header .header_gnb .gnb_wrap:hover .balloon {display: block;}
#header .header_gnb .gnb_item { display: flex; height: 100%; position: relative; color: #373737; font-size: 1.8rem; font-weight: 500; align-items: center; } 
#header .header_gnb .gnb_wrap:hover .gnb_item:after { width: 100%; } 
#header .header_gnb .gnb_item:after { content: ''; display: block; width: 0; height: 5px; position: absolute; left: 0; bottom: 0; background: #064a84; transition: 0.6s; } 
#header .header_gnb .drop_wrap { max-height: 0; width: 12rem; padding: 0; position: absolute; left: 0; right: 0; z-index: 6; overflow: hidden; } 
#header .header_gnb.on .drop_wrap { max-height: 40rem; padding-top: 32px; } 
#header .header_gnb.on .drop_wrap li + li { margin-top: 2rem; } 
#header .header_gnb .drop_item { display: block; color: #666666; font-size: 1.5rem; text-align: left;} 
#header .header_gnb .drop_item:hover { color: #373737; font-weight: bold; } 
#header .header_gnb .gnb_banner { max-height: 0; width: 220px; position: absolute; top: 15rem; left: 50%; transform: translateX(-600px); border-radius: 10px; z-index: 6; overflow: hidden; } 
#header .header_gnb .gnb_banner a {display: block; }
#header .header_gnb .gnb_banner img { width: 100%; height: 100%;} 
#header .header_gnb.on .gnb_banner { max-height: 100%; } 

#header .m_gnb {display: none;}
#header .m_gnb ul { display: flex; height: 8rem; margin-top: 2rem; justify-content: center; border-top: 1px solid #dadada; }
#header .m_gnb ul li { height: 100%; } 
#header .m_gnb ul li a { display: flex; width: 100%; height: 100%; padding: 0 30px; color: #373737; font-size: 1.8rem; font-weight: 500; align-items: center; box-sizing: border-box; justify-content: center;} 
#header .m_menu {display: none;}
/* #header .m_menu .search_btn { display: block; width: 20px; height: 20px; background: url(../../images/hanmi/seach_ico.png) center / 16px 16px no-repeat; } 
#header .m_menu .search_btn.active { background: url(../../images/hanmi/close_btn.png) center no-repeat; } 
#header .m_menu .seach_area { display: none; width: 100%; padding: 2rem; position: absolute; left: 0; top: 68px; background: #f5f5f5; box-sizing: border-box; z-index: 10; } 
#header .m_menu .seach_area .input_wrap { width: 100%; background: #fff; box-sizing: border-box; } 
#header .m_menu .login_btn { display: block; width: 20px; height: 20px; margin-left: 1rem; background: url(../../images/hanmi/mbtn_icon.png) center / contain no-repeat; }  */

#header .m_menu .m_search { display: flex; width: 100%; padding: 10px 10px; margin-left: 0; border: 1px solid #373737; border-radius: 30px; justify-content: space-between; overflow: hidden; box-sizing: border-box; } 
#header .m_menu .m_search input { width: calc(100% - 30px); border: 0; font-size: 1.1rem; } 
#header .m_menu .search_btn { display: block; width: 20px; height: 20px; background: url(../../images/hanmi/seach_ico.png) center / 16px 16px no-repeat; }
#header .m_menu .login_btn { display: block; width: 20px; height: 20px; margin-left: 1rem; background: url(../../images/hanmi/mbtn_icon.png) center / contain no-repeat; }

/* footer */
.footer { padding: initial !important; text-align: initial !important; font-size: initial !important; display: initial !important; color: initial !important; border-top: 0 !important; position: initial !important; } 
.footer .f_top { background: #f7f7f7; } 
.footer .f_top ul { display: flex; } 
.footer .f_top ul li + li { margin-left: 32px; } 
.footer .f_top ul li a { display: block; padding: 2.6rem 0; color: #373737; font-size: 1.5rem; font-weight: 500; } 
.footer .f_bottom { padding: 32px 0; background: #ffffff; } 
.footer .f_bottom .txt p { margin-top: 12px; color: #666666; font-size: 1.3rem; } 
.footer .f_bottom .txt p.copy { color: #a3a3a3; } 


@media all and (max-width:1024px){
    #header .header_gnb {display: none;}
    #header .m_gnb {display: block;}
}
@media all and (max-width:768px){
    html {font-size: 8px !important;}
    .innerSection {
        width: calc(100% - 20px);
        padding: 0 !important;
    }
    .footer .f_top ul {
        justify-content: center;
    }
}
@media all and (max-width:640px){
    #header .top .logo a img {
        width: 80px;
    }
    #header .top .right_box {
        display: none;
    }
    #header .m_menu {
        display: flex;
        align-items: center;
    }
    #header .m_gnb ul {
        height: 6rem;
    }
    #header .m_gnb ul li {
        width: 100%;
    }
    #header .m_gnb ul li a {
        padding: 0;
        font-size: 1.6rem;
    }

    .footer .f_top ul li + li {
        margin-left: 0;
    }
    .footer .f_top ul li a {
        padding: 2rem 1rem;
    }
    .footer .f_bottom {
        padding: 2rem 0;
    }
    .footer .f_logo img {
        width: 80px;
    }
}

@media all and (max-width:480px){ 
    .footer .f_top ul {
        justify-content: flex-start;
        white-space: nowrap;
        overflow-x: auto;
    }
}