@charset "utf-8";
/*************************************************************************
* @ 서비스명   : commonui
* @ 파일명     : /css/commonui.css
* @ 페이지설명  : commonui.css
**************************************************************************/

/* 가람 */

header{background:#fff;display:block;}
header .header-logo{width:1200px;margin:0 auto;display:flex;justify-content:center;;align-items:center;padding:10px 0px;}
header .header-logo .logo{width: 100px;text-align:center !important;}

header .header-navi{width:1200px;margin:0 auto;display:flex;justify-content:center;align-items:center;padding:5px 0px 10px 0px;}
header .header-navi .menu {display:flex;gap:64px;}
header .header-navi .menu a{font-size:17px;font-weight:600;color:#343434;}
header .header-navi .menu a:hover{color:#0083bd}

.header-m{display:none}
.header-m-navi{display:none}

footer {border-top: 1px solid #e5e5e5; background: #f9f9f9; padding: 30px 0;}
footer .footer-layout {width: 90%; max-width: 1200px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 20px;}
footer .footer-logo img {width: 120px;}
footer .footer-info {font-size: 14px; color: #6e6e6e; line-height: 1.6; text-align: left; display: flex; flex-direction: column; gap: 10px;}
footer .footer-info .company-name {font-size: 16px; font-weight: 600; margin-bottom: 10px; color: #333; text-align: center;}
footer .footer-info .info-row {display: flex; align-items: center; gap: 10px; font-size: 14px;}
footer .footer-info .info-row i {color: #0083bd; font-size: 16px;}
footer .footer-info .info-row span {line-height: 1.4;}
footer .footer-info .info-row span:first-child {font-weight: 600; color: #333;}
footer .footer-copyright {font-size: 13px; color: #aaa; margin-top: 10px;}


.no-data{text-align: center;padding:50px 0;font-size:16px;}
/* 가람 */

/* basic style */

body {overflow: inherit;width: 100%;height: 100%;}
body.on {overflow: hidden;}
#wrap {width: 100%;height: 100%;}

/* text style */
.font_l {text-align: left !important;}
.font_c {text-align: center !important;}
.font_r {text-align: right !important;}

.color_blue{color:#4a73f1 !important;}

/* tablet */
@media all and (max-width:1280px) {

    header{display:none}
    .m-navi-btn{display: block;font-size: 20px;}

    .header-m{display:block;background:#fff;padding:10px 20px;box-shadow:0 1px 4px 0px #f1f1f1;}
    .header-m .top{display:flex;justify-content:space-between;align-items:center;}
    .header-m .logo{display: inline-block;width:105px;}
    .header-m .logo img{display: block;}

    .header-m-navi .modal_popup .top{display:flex;justify-content:space-between;}
    .header-m-navi .modal_popup .top img{width:105px;}
    .header-m-navi .modal_popup .top-menu{margin-top:20px;line-height:2.5;}
    .header-m-navi .modal_popup .top-menu a{font-size: 16px;font-weight:500;display:flex;justify-content:space-between;align-items:center;}
    .header-m-navi .modal_popup .top-menu a span:nth-child(2){font-size:13px;font-weight:normal;}
    .header-m-navi .modal_popup .top-menu-01{margin-top:20px;line-height:2.5;border-top:1px solid#e5e5e5;padding-top:15px;}
    .header-m-navi .modal_popup .top-menu-01 a{font-size: 16px;font-weight:500;display:flex;justify-content:space-between;align-items:center;}
    .header-m-navi .modal_popup .top-menu-01 a span:nth-child(2){font-size:13px;font-weight:normal;}
    .header-m-navi .modal_popup .top-menu-02 {text-align: center;margin-top:25px;}
    .header-m-navi .modal_popup .top-menu-02 a {font-size: 15px;color: #fff;padding: 10px;border-radius: 5px;background:#92bf39;display:flex;justify-content:center;}
    .header-m-navi {display: none; /* 평소에는 보이지 않도록 */position: fixed; /* fixed로 변경 */top: 0;left: 0;width: 100%;height: 100vh;overflow: hidden;background: rgba(0, 0, 0, 0.5);z-index: 99999;}
    .header-m-navi.on {display: block;overflow:auto;}
    .header-m-navi .modal_popup {position: absolute;height:100%;width:100%;padding:10px 20px 20px 20px;background:#fff;overflow: auto; /* 팝업 내 스크롤 허용 */}
    .header-m-navi .close_btn{display: block;font-size: 20px;}
}


/* mobile */
@media all and (max-width:768px) {


}