@charset "UTF-8";

/*layout*/
html, body { height: 100%; min-height: 100%; min-width:320px; margin:0 auto; font-size:14px; font-family:'malgun gothic','맑은고딕','돋움','Sans-serif',arial; line-height: 1.4; color: #444; }
html.hidden, body.hidden { overflow: hidden; } 

.wrap {  letter-spacing: -0.8px; }
.header_wrap { position: relative; padding: 10px 20px; max-width: 1500px; border-bottom: 1px solid #e5e5e5; margin: 0 auto; }
.main_wrap { padding: 0; position: relative; }

/*header*/
.header_inner { display: flex; justify-content: space-between; max-width: 2560px; margin:0 auto; }
.header_inner .logo a { display: block; }
.header_etc {  }
.btn_favorite { display: inline-block; margin-right: 20px; background: #efb400; color: #fff; font-size: 16px; padding:4px 20px 6px; font-weight: 700; border-radius: 2px; }
.btn_favorite span { position: relative; top: -1px; }
.header_etc .btn_tel { display: none; }
.header_search { display: inline-block; position: relative; margin-top:30px; }
.header_search .form_input { height:42px; width: 250px; padding-right: 50px; border: 2px solid #006863; font-size:14px; line-height: 28px; }
.header_search .search_tit { display: inline-block; font-size: 18px; font-weight:700; padding-right:5px; color:#444; }
.header_search .search_btn { position: absolute; top:0; right:0;; width:42px; height:42px; font-size:0;  cursor: pointer;  }
.header_search .search_btn span { display: block; height: 100%; position: relative; position: relative;}
.header_search .search_btn span:before { content: ""; position: absolute; top: 9px; left: 7px; width:12px; height:12px; border:3px solid #006863; border-radius: 50%;}
.header_search .search_btn span:after { content: ""; position: absolute;  left: 24px; top: 21px; width: 1px; height: 6px; background: #006863; border-radius: 3px; transform: rotate(-52deg); border: 1px solid #006863;  }
.header_search > .search_btn { display: none; }
/*nav*/
.nav_wrap { height: 105px; }
.nav_wrap .nav_inner { background-color: #fff; }
.nav_wrap .nav {display: flex; max-width: 1460px;  margin: 0 auto; padding:20px 0 10px; border-bottom: 5px solid #006863;}
.nav_wrap .nav > a { display: inline-flex; align-items:center; justify-content:center;  width: calc(20% - 8px ); padding: 20px 10px; background: #e5e5e5;text-align:center; font-size:21px; color:#333; font-weight:700; line-height:30px;word-break: keep-all; }
.nav_wrap .nav > a + a { margin-left:10px; }
.nav_wrap .nav > a.on { background: #006863; color: #fff; }

.nav_wrap.fixed .nav_inner { position: fixed; left: 0; top:0; width: 100%; z-index: 20; }

/*container*/
.container { padding-top: 30px; }


/*footer*/
.footer_wrap { border-top: 1px solid #e5e5e5; }
.footer_wrap .inner { max-width: 2560px; margin: 0 auto; padding: 30px 10px 30px 19%; background: url(../img/common/logo_footer.jpg) no-repeat 3.5% 50%;  }
.footer_wrap .item { font-size:13px; line-height: 1.5em; letter-spacing:0; }
.footer_wrap .item p { display: inline-block; }
.footer_wrap .item a:hover { text-decoration: underline; }
.footer_wrap .item span { display: inline-block; }
.footer_wrap .item p + span:before, 
.footer_wrap .item strong + span:before,  
.footer_wrap .item span + span:before,
.footer_wrap .btn_footer:before { display: inline-block; position: relative; top: 1px; width: 1px; height:12px; margin: 0 5px 0 3px; background-color: #666; content: ""; }
.footer_wrap .btn_footer:before { margin-right:7px; }
.footer_wrap .btn_footer { display: inline-block; text-decoration: underline; font-weight: 700;  color: #000; }



/*common*/
.left { text-align: left; }
.right { text-align: right; }
.center { text-align: center; }
.blue { color:#0a5eea; }
.red { color:#e60012; }
/*button*/

/*form*/
.form_input, .form_select { padding:4px 8px; border: 1px solid #bbb; background-color: #fff; border-radius: 2px; line-height: 18px; font-size:13px; }
.form_select { height: 28px; padding-right:30px; line-height: 18px; background-image:url(../img/common/icon_select.png); background-repeat:no-repeat; background-position:calc(100% - 10px) 50%; }
.form_checkbox { display: block; padding: 5px 0;  }
.checkbox { width:16px; height:16px; margin:0; vertical-align: top; cursor: pointer; }
.checkbox + label { display: inline-block; position: relative; padding-left:3px; cursor: pointer; line-height: 16px; vertical-align: top; }

/*table*/
table { table-layout: fixed; width: 100%; }
table caption { width:0; height:0; font-size:0; line-height: 0; overflow: hidden; }

@media (max-width: 1500px){ 
    .nav_wrap .nav_inner { padding: 0 20px; }
}


@media (max-width: 1280px){ 

}

@media (max-width: 1024px){ 
    html, body { padding-bottom: env(safe-area-inset-bottom); }
    body { min-height: -webkit-fill-available; height: -webkit-fill-available; }
    .header_inner .logo a img { height: 62px; }
    .header_search { margin-top: 25px; }
    .header_search .search_tit { font-size: 16px; }
    .header_search .form_input { height: 36px; width: 200px; padding-right: 40px; font-size: 14px; }
    .header_search .search_btn { height:36px; }
    .header_search .search_btn:before { top: 6px; left: 9px; }
    .header_search .search_btn:after { top: 18px; left: 26px; }
    .btn_favorite {font-size: 14px; padding: 4px 10px 6px; }

    .nav_wrap { height: 76px; }
    .nav_wrap .nav { padding-top: 10px; border-bottom-width: 4px; }
    .nav_wrap .nav > a { height: 52px; padding: 15px 5px; font-size:17px; line-height: 1.1; }
    
    .footer_wrap .inner { padding: 20px 10px 90px; text-align:center; background-position: 50% calc(100% - 20px); background-size: 120px auto; }
    .footer_wrap .item { font-size:12px; }
    .footer_wrap .item strong + span:after  { content: ""; display: block; }
    .footer_wrap .item p { display: block; }
    .footer_wrap .item p + span:before { display: none; }
}

@media (max-width: 907px){
    .nav_wrap .nav > a { font-size: 16px; }
}


@media (max-width: 767px){
    .container { padding-top: 10px; }
}

@media (max-width: 640px){ 
    .header_wrap { padding: 10px; }
    .header_inner .logo a img { height: 42px; }
    .header_etc { white-space: nowrap; }
    .header_etc .header_search { display: inline-block; margin-top: 0; }
    .header_etc .header_search > .search_btn { display: inline-block; position: inherit; width: 40px; height:40px; padding:0; margin-left: 10px; vertical-align: top; }
    .header_search { position: inherit; }
    .header_search > .search_btn span:before { width: 18px; height: 18px; top:6px; left: 5px; }
    .header_search > .search_btn span:after { top: 22px; left: 28px; height: 10px; }
    .header_search .form_input { width: calc(100% - 63px); }
    .header_search .search_tit { font-size: 14px; }
    .header_search_inner { display: none; justify-content: space-between; align-items: center; position: absolute;  top:63px; left: 0; width: 100%; padding:10px 10px; background-color: #fff;}
    .header_search.on .header_search_inner { display: flex; }
    .header_search .header_search_inner .search_btn { height: auto; width: auto; right: 17px; top: 15px; padding:5px 10px; border-radius: 2px; font-size: 12px; background: #006863; color: #fff; }
    .header_search .header_search_inner .search_btn span::before,
    .header_search .header_search_inner .search_btn span::after { display: none; }
    .header_etc .btn_favorite { display: none; }
    .header_etc .btn_tel { position: relative; top:3px; display: inline-block; width: 36px; height: 36px; border-radius: 50%; background: #cf2b28 url(../img/common/icon_tel.png) no-repeat 50% 50%; background-size: 40px; font-size:0; vertical-align: top;  } 
    
    .nav_wrap { height: 53px; }
    .nav_wrap .nav_inner { padding: 0 10px; }
    .nav_wrap .nav { padding: 5px 0; border-bottom-width: 3px; }
    .nav_wrap .nav > a { padding:8px 5px; height: 40px; width: calc(20% - 2px); font-size: 14px;   }
    .nav_wrap .nav > a + a { margin-left:2px; }
    .footer_wrap .item { font-size: 11px; }
}

@media (max-width: 640px){ 
    .nav_wrap .nav > a { font-size: 13px; }
}