@charset "UTF-8";

/*header*/
header {background: #fff;}
header .header-inner {display: flex; max-width: 1560px; margin: 0 auto; padding: 40px 20px; align-items: center; justify-content: space-between;}
header .header-inner h1 {width: 290px;}
header .header-inner h1 img {max-width: 100%;}
header .header-inner ul.gnb-area {display: flex; align-items: center;}
header .header-inner ul.gnb-area li {padding-right: 68px;}
header .header-inner ul.gnb-area li:last-child {padding-right: 0px;}
header .header-inner ul.gnb-area li a {font-size: 1.7rem; font-weight: 300; color: #1A1A1A; transition: all 0.5s;}
header .header-inner ul.gnb-area li a:hover {font-weight: 500; transition: all 0.5s;}
header .header-inner .util {display: flex; align-items: center; justify-content: center;}
header .header-inner .util p {}
header .header-inner .util  a.util-search {display: block; width: 32px; height: 32px; background: url(/common/images/user/btn/btn_search.png) no-repeat center; transition: all 0.5s; background-size: 32px;}
header .header-inner .util ul.util-box {display: flex; margin-left: 20px;}
header .header-inner .util ul.util-box li {position: relative;}
header .header-inner .util ul.util-box li:nth-child(2) {padding: 0 10px;}
header .header-inner .util ul.util-box li:first-child {padding-right: 12px; padding-left: 0;}
header .header-inner .util ul.util-box li:last-child {padding-right: 0; padding-left: 12px;}
header .header-inner .util ul.util-box li:not(:first-child):after {content: ""; display: block; width: 1px; height: 12px; background: #D4D4D4; position: absolute; left: 0; top: 5px;}
header .header-inner .util ul.util-box li a {color: #666;}


.search-wrap {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); z-index: 99;}
.search-wrap .search-inner {height: 332px; background: #F3F3F3;}
.search-wrap .search-inner .search-box {max-width: 1570px; margin: 0 auto; padding: 0 15px; padding-top: 106px; position: relative;}
.search-wrap .search-inner .search-box button.btn-search-close {width: 40px; height: 40px; display: block; background: url('/common/images/user/btn/btn_close_off_01.png')no-repeat center; background-size: 40px; position: absolute; top: 30px; right: 15px; z-index: 10; transition: all 0.3s;}
.search-wrap .search-inner .search-box button.btn-search-close:hover {width: 40px; height: 40px; display: block; background: url('/common/images/user/btn/btn_close_on_01.png')no-repeat center; background-size: 40px; transition: all 0.3s;}


button.m-menu-btn {display: none;}
.m-gnb-area {display: none;}


/* content */
/* .page-wrap{padding:0 1.6rem} */
.page-cont-tit {padding:0 1.6rem}
.page-cover {padding: 0 1.6rem;}

/* footer */
#footer{background: #222222;}
.m-inner-footer {display: none;}
.pc-inner-footer {display: flex;  max-width: 1600px; margin: 0 auto; padding: 40px 20px 80px 20px; box-sizing: border-box; justify-content: space-between;}
.footer-left ul.footer-logo {display: flex; align-items: center;}
.footer-left ul.footer-logo > li:not(:last-child) {margin-right: 20px;}
.footer-left ul.footer-logo > li:first-child {max-width: 144px;}
.footer-left ul.footer-logo > li:nth-child(2) {max-width: 207px}
.footer-left ul.footer-logo > li:last-child {max-width: 55px;}
.footer-left ul.footer-address {margin-top: 50px;}
.footer-left ul.footer-address > li {color: #fff;}
ul.footer-address > li ul.footer-link {display: flex; margin-top: 15px;}
ul.footer-address > li ul.footer-link li {color: #b2b2b2; position: relative;}
ul.footer-address > li ul.footer-link li:not(:last-child) {padding-right: 12px;}
ul.footer-address > li ul.footer-link li:not(:first-child) {padding-left: 12px;}
ul.footer-address > li ul.footer-link li:nth-child(2)::before {content: ""; display: block; width: 1px; height: 14px; background: #b2b2b2; position: absolute; left: 0px; top: 4px;}
ul.footer-address > li ul.footer-link li:last-child:before {content: ""; display: block; width: 1px; height: 14px; background: #b2b2b2; position: absolute; left: 0px; top: 4px;}

ul.footer-address > li ul.footer-link li span {margin-left: 7px; color: #fff;}
.footer-left p.sub-txt {margin-top: 60px; color: #fff;}

.footer-right {display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end;}
.footer-right ul.footer-link {display: flex;}
.footer-right ul.footer-link li {position: relative;}
.footer-right ul.footer-link li:first-child,.footer-right ul.footer-link li:nth-child(2) {padding-right: 30px;}
.footer-right ul.footer-link li:first-child::after {content: ""; display: block; width: 1px; height: 16px; background: #b2b2b2; position: absolute; left: 78px; top: 4px;}
.footer-right ul.footer-link li:nth-child(2)::after {content: ""; display: block; width: 1px; height: 16px; background: #b2b2b2; position: absolute; left: 138px; top: 4px;}
.footer-right ul.footer-link li:last-child::after {display: none;}
.footer-right ul.footer-link li a {color: #fff; font-size: 1.6rem; font-weight: 300;}
.footer-right ul.footer-link li:last-child a {color: #1E90FF; font-weight: 400;}
.footer-right p.copyright {color: #B2B2B2; font-size: 1.3rem; font-weight: 300;}


@media all and (max-width: 1300px) {
header .header-inner ul.gnb-area li {padding-right: 50px;}
}

@media all and (max-width: 1200px) {
header .header-inner ul.gnb-area li {padding-right: 20px;}
header .header-inner .util ul.util-box {margin-left: 15px;}
}

@media (min-width: 991px) and (max-width: 1100px) {
header .header-inner h1 {width: 245px;}
header .header-inner ul.gnb-area li {padding-right: 20px;}
header .header-inner ul.gnb-area li a {font-size: 1.6rem;}
header .header-inner .util a.util-search {width: 20px; height: 20px; background-size: 20px;}
header .header-inner .util ul.util-box {margin-left: 10px;}

}

@media (min-width: 1041px) and (max-width: 1140px) {
h1.logo img{width:280px;}
.gnb-wrap .gnb-area li a{font-size:1.8rem}
.gnb-wrap .gnb-area li{padding-right:3vw}
}

@media (min-width: 992px) and (max-width: 1070px) {
.pc-inner-footer .footer-left {width: 606px;}
.pc-inner-footer .footer-right {width: calc(100% - 606px);}
}



@media all and (max-width:991px){

.pc-inner-footer {display: none;}
/*header*/
header .header-inner ul.gnb-area{display: none}
header .header-inner .util ul.util-box{display: none;}
button.m-menu-btn {display: block; width: 32px;  height: 32px; margin-left: 20px; background: url(/common/images/user/btn/btn_m_menu.png) no-repeat center; background-size: 32px;}

/* m-gnb-area */
.m-gnb-area{position: fixed; width:100%; top: 0; padding: 0; height: 100%; background: #F3F3F3; z-index:100}
.m-gnb-top{position: relative; display:flex; justify-content: space-between; padding:22px 16px; align-items: center;}
h1.logo img{width:210px}

.m-topmenu{background: #fff; border-bottom:1px solid #E1E1E1;}
.m-topmenu > ul{display: flex; padding-left: 15px; padding-bottom: 15px;}
.m-topmenu > ul > li {position: relative;}
.m-topmenu > ul > li a {font-size: 1.4rem; color: #666;}
.m-topmenu > ul > li:first-child {padding-right: 12px; padding-left: 0;}
.m-topmenu > ul > li:nth-child(2) {padding:0 12px;}
.m-topmenu > ul > li:last-child {padding-right: 0; padding-left: 12px;}
.m-topmenu > ul > li:not(:first-child)::after {content: ""; display: block; width: 1px; height: 12px; background: #D4D4D4; position: absolute; left: 0; top: 6px;}
.menu-close{width:28px; height:28px;display:block; background:url(/common/images/user/btn/btn_m_close.png) no-repeat center; background-size:28px;}

.m-gnb{padding: 40px 0 0 0; height: calc(100vh - 126px);overflow-y: auto; box-sizing: border-box;}
.m-gnb ul.depth1 {padding-left: 15px;}
.m-gnb ul.depth1 li {padding-bottom: 48px; color: #1A1A1A; font-size: 24px; font-weight: 500; }
.m-gnb ul.depth1 li:last-child {padding-bottom: 0px;}
.m-gnb ul.depth1 li a {display: flex; align-items: center; justify-content: flex-start;}
.m-gnb ul.depth1 li a i.ico-data {margin-right: 15px; width: 35px; height: 35px;  background: url(/common/images/user/ico/ico_m_menu_01.png) no-repeat center; background-size: 22px 35px;}
.m-gnb ul.depth1 li a i.ico-company {margin-right: 15px; width: 35px; height: 35px;  background: url(/common/images/user/ico/ico_m_menu_02.png) no-repeat center; background-size: 35px 35px;}
.m-gnb ul.depth1 li a i.ico-library {margin-right: 15px; width: 35px; height: 35px;  background: url(/common/images/user/ico/ico_m_menu_03.png) no-repeat center; background-size: 32px 35px;}
.m-gnb ul.depth1 li a i.ico-center {margin-right: 15px; width: 35px; height: 35px;  background: url(/common/images/user/ico/ico_m_menu_04.png) no-repeat center; background-size: 35px 35px;}


/* footer */
.m-inner-footer {display: block; padding: 40px 15px 40px 15px;}
.m-inner-footer ul.footer-link > li {margin-bottom: 17px; text-align: center;}
.m-inner-footer ul.footer-link > li:last-child {margin-bottom: 0px;}
.m-inner-footer ul.footer-link > li > a {color: #fff; font-size: 1.6rem; font-weight: 300;}
.m-inner-footer ul.footer-link > li:last-child > a {color: #1E90FF; font-weight: 400;}
.m-inner-footer ul.footer-logo {display: flex; margin-top: 30px; align-items: center; justify-content: center;}
.m-inner-footer ul.footer-logo > li {margin-right: 13px;}
.m-inner-footer ul.footer-logo > li:last-child {margin-right: 0px;}
.m-inner-footer ul.footer-logo > li > a {}
.m-inner-footer ul.footer-logo > li:first-child > a img {max-width: 144px;}
.m-inner-footer ul.footer-logo > li:nth-child(2) > a img {max-width: 207px;}
.m-inner-footer ul.footer-logo > li:last-child > a img {max-width: 55px;}
.m-inner-footer ul.footer-address {margin-top: 30px; text-align: center;}
.m-inner-footer ul.footer-address > li:first-child {color: #ffff;}
.m-inner-footer ul.footer-address > li {color: #b2b2b2;; font-size: 1.6rem; font-weight: 300;}
.m-inner-footer ul.footer-address > li span{color: #fff; margin-left: 5px;}
.m-inner-footer ul.footer-address > li > ul {display: flex; margin-top: 20px; justify-content: center;}
.m-inner-footer ul.footer-address > li > ul > li {position: relative;}
.m-inner-footer ul.footer-address > li > ul > li:not(:last-child) {padding-right: 12px;}
.m-inner-footer ul.footer-address > li > ul > li:not(:first-child) {padding-left: 12px; }
.m-inner-footer ul.footer-address > li > ul > li:not(:first-child)::before {content: ""; display: block; width: 1px; height: 14px; background: #b2b2b2; position: absolute; left: 0; top: 5px;}
.m-inner-footer p.sub-txt {margin-top: 40px; text-align: center; color: #fff;}
.m-inner-footer p.copyright {margin-top: 40px; text-align: center; color: #B2B2B2; font-size: 1.3rem; font-weight: 300;}
.m-inner-footer .info-detail {margin-top: 15px; text-align: center;}
.m-inner-footer .info-detail p {display: inline-block; font-size: 1.6rem; color: #fff; position: relative;}
.m-inner-footer .info-detail p:not(:last-child) {padding-right: 24px;}
.m-inner-footer .info-detail p span {color: #b2b2b2; padding-right: 5px;}
.m-inner-footer .info-detail p.tel::before {content: ""; display: block; width: 1px; height: 14px; background: #b2b2b2; position: absolute; right: 10px; top: 5px;}
.m-inner-footer .info-detail p.mail::before {content: ""; display: block; width: 1px; height: 14px; background: #b2b2b2; position: absolute; right: 10px; top: 5px;}
}

/* 모바일 */
@media all and (max-width:767px){    
/* header */
header .header-inner {padding: 22px 16px;}
header .header-inner h1 {width: 200px;}
header .header-inner .util a.util-search {width: 28px; height: 28px; background-size: 28px;}
button.m-menu-btn {width: 28px; height: 28px; background-size: 28px; margin-left: 20px;}
/* search-area */
.search-wrap .search-inner {height: 212px;}
.search-wrap .search-inner .search-box button.btn-search-close {width: 24px; height: 24px; background-size: 24px;}
.search-wrap .search-inner .search-box button.btn-search-close:hover {width: 24px; height: 24px; background-size: 24px;}

.main-container {padding-top: 23px;}

/* footer */
.m-inner-footer ul.footer-link > li > a{font-size: 1.4rem;}
.m-inner-footer ul.footer-address > li:first-child {font-size: 1.3rem;}
.m-inner-footer ul.footer-address > li > ul > li {font-size: 1.3rem;}
.m-inner-footer p.sub-txt {font-size: 1.3rem;}
.m-inner-footer p.copyright {font-size: 1.2rem;}
.m-inner-footer ul.footer-logo > li:first-child > a img {max-width: 100%;}
.m-inner-footer ul.footer-logo > li:nth-child(2) > a img {max-width: 100%;}
.m-inner-footer ul.footer-logo > li:last-child > a img {max-width: 100%;}
.m-inner-footer .info-detail {}
.m-inner-footer .info-detail p {font-size: 1.3rem;}
}