/* menu */
 /* 줄어드는 메뉴 */
.header-wrap.hide-menu {padding-top:0; height: 80px; }
.header-wrap.hide-menu a.logo { height:0; margin:0 auto; opacity:0; }
.header-wrap.hide-menu .gnb-bg { top:80px; }
.header-wrap.hide-menu .topmenu>li>a { height:78px; }
body.open { height: 100%; min-height: 100%; overflow: hidden !important; touch-action: none; }

body { min-width: 320px; }

body#body {padding-top:170px; }

header { width: 100%; position: relative; z-index: 999; min-width: 320px; }

header .header-wrap { width: 100%; text-align: center; height: 170px; background-color: #fff; position: relative; overflow: visible; border-bottom: 1px solid #dbdbdb; transition: all 0.2s; padding-top: 40px; }

#header.fixed { position: fixed; top: 0px; z-index: 999; transition: all 0.2s; }

header .logo { display: block; width: 356px; height: 30px; margin: 0 auto 18px; background-image: url(/img/logo.png); background-position: left top; background-size: 100% auto; background-repeat: no-repeat;text-indent: -9999px; }

header .gnb { width: 1340px; margin: 0 auto; display: inline-block; position: relative; }

header .topmenu { display: inline-block; }

header .topmenu>li { float: left; display: block; padding: 0 20px; }

header .topmenu>li>a { position: relative; display: block; height: 80px; font-size: 22px; font-weight: 500; font-stretch: normal; font-style: normal; line-height: 80px; letter-spacing: -0.66px; text-align: left; color: #56504b; }

header .topmenu>li>a:hover { font-weight: 700; }

header .topmenu>li:hover>a:after { content: ""; display: block; width: 100%; height: 4px; background-color: #f39938; position: absolute; left: 0; bottom: -2px; }

header .gnb .submenu { position: absolute; top: 80px; left: 0; width: 100%; height: 0px; visibility: hidden; overflow: hidden; opacity: 0; transition: all 0.2s; }

header .gnb .topmenu>li.active .submenu { border-bottom: 1px solid bottom; visibility: visible; overflow: visible; height: 260px; opacity: 1; z-index: 3; display: block; }

header .gnb .submenu .submenu-wrap { width: 1340px; height: 100%; max-width: 1740px; margin: 0 auto; display: block; }

header .gnb .menu3 .submenu .submenu-wrap { max-width: 1900px; }

header .gnb .submenu .submenu-title { float: left; width: 268px; height: 100%; text-align: right; }

header .gnb .submenu .submenu-title h4 { font-size: 28px; font-weight: bold; letter-spacing: -0.84px; padding: 60px 30px 0 0; line-height: 1; color: #57504a; }

header .gnb .submenu .sub { float: right; text-align: left; display: inline-block; width: calc(100% - 268px); margin: 0 auto; height: 100%;padding-top: 20px; padding-left: 0 !important; position: relative;font-size:0; }

header .gnb .submenu .sub>li { margin: 40px 0 0px 50px; display: inline-block; vertical-align: top; position: relative; }

header .gnb .submenu .sub>li>a { position: relative; background-color: #fff; display: block; width: auto; min-width: 307px; line-height: 1; font-size: 20px; font-weight: 500; letter-spacing: -0.6px; text-align: left; color: #57504a; padding: 0 0 0 28px; transition: all 0.2s; letter-spacing: -0.07em; }

header .gnb .submenu .sub>li>a:hover { color: #f49b35; }

/* header .gnb .submenu .sub>li>a:hover:before { background: url("/img/gradient_bg.png") 0 0; background-size: 100% auto; background-repeat: repeat-y; }  */

header .gnb .submenu .sub>li>ul { margin-top:20px; }

header .gnb .submenu .sub>li>ul>li>a { font-size: 16px; display: inline-block; padding-left: 28px; line-height: 1; text-align: left; color: #57504a; margin-bottom: 10px; }

header .gnb .submenu .sub>li>a:after { content: ""; display: block; width: 18px; height: 12px; background: url("/img/submenu_icon.png") 0 0 no-repeat; position: absolute; top: 2px; left: 0px; }

header .gnb .submenu .submenu-wrap:after,
header .gnb .submenu .sub:after,
header .gnb .submenu .sub>li:after { content: ""; display: table; width: 100%; height: 1px; clear: both; }

header .gnb-bg { width: 100%; height: 0px; position: absolute; top: 170px; background: #fff; border-bottom: 1px solid #ddd; transition: all 0.2s; opacity: 0; z-index: -1; }

header .gnb-bg>div { width: 1340px; margin: 0 auto; height: 100%; }

header .gnb-bg.active { opacity: 1; z-index: 2; display: block; height: 260px; }

header .gnb-bg .submenu-bg { width: 268px; max-width: 600px; height: 100%; background-color: #fff7e4; background-image: url("/img/submenu_bg.png"); background-size: 90%; background-position: left bottom; background-repeat: no-repeat; }

header .navbar { display: block; position: absolute; top: 40px; right: 0; transform: translateY(-50%); }

/* all menu */
.menu-all { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(64, 64, 64, 0.95); overflow-y: scroll; z-index: 9999; min-width: 360px; }

.menu-all.open { display: block; }

.menu-all .menu-close { width: 100%; height: 130px; background-color: transparent; background: url("/img/allmenu_close.png") center center no-repeat; border: none; text-indent: -9999px; }

.menu-all>ul { width: 100%; height: calc(100% - 180px); max-width: 1740px; margin: 0 auto; }

.menu-all>ul>li { float: left; width: calc(100% / 6); height: 100%; display: block; text-align: center; border-right: 1px solid #545656; }

.menu-all>ul>li:last-child { border-right: none; }

.menu-all>ul>li>a { font-size: 30px; font-weight: 700; color: #7bc908; }

.menu-all>ul>li>a .num { font-size: 18px; display: block; margin-bottom: 5px; }

.menu-all>ul>li>.sub { margin-top: 20px; }

.menu-all>ul>li>.sub>li { width: 100%; }

.menu-all>ul>li>.sub>li>a { font-size: 20px; line-height: 55px; color: #fff; }

/* .menu-all > ul > li > .sub > li.menu_conversion > a {line-height: 1.2em;position: relative;top: 0.6em; } */
.menu-all>ul>li>.sub>li>a:hover { text-decoration: underline; }

.menu-all>ul>li>.sub>li>ul a { font-size: 18px; line-height: 30px; color: #9a9a9a; }

/* footer */
.top-btn { display: inline-block; position: fixed; bottom: 0px; right: 0px; background: #56504b; color: #fff; padding: 8px; width: 70px; height: 70px; text-align: center; z-index: 25; }

.top-btn:hover { color: #fff; background: #423d38; }

.top-btn p { font-size: 15px; font-weight: normal; text-transform: uppercase; letter-spacing: -0.03px; }

.sub-top-btn { bottom: 0px; right: 0px; }

#section-footer.fp-section.fp-table, #section-footer .fp-tableCell { height: auto !important}


#section-footer footer { /*min-height: 300px; */}

footer { background-color: #f9f9f9; border-top: 1px solid #ddd; min-width: 320px; }

footer .footer-wrap { width: 100%; max-width: 1400px; margin: 0 auto; }

footer .footer-menu { width: 100%; border-bottom: 1px solid #ddd; }

footer .footer-menu:after { content: ""; clear: both; display: block; }

footer .footer-menu:after { content: ""; clear: both; display: block; }

footer .footer-utilmenu { float: left; padding: 25px 0 25px 30px; }

footer .footer-utilmenu li { float: left; }

footer .footer-utilmenu li a { display: block; border-right: 1px solid #999; font-size: 16px; padding: 0 15px; line-height:1; }

footer .footer-utilmenu li:last-child a { border-right: 0; }

footer .footer-utilmenu li a:hover { text-decoration: underline; }

footer .footer-partner { float: right; position: relative; }

footer .footer-partner .btn-partner { position: relative; display: block; width: 300px; border-left: 1px solid #ddd; border-right: 1px solid #ddd; font-size: 16px; line-height: 66px; text-align: left; padding: 0 30px; }

footer .footer-partner .btn-partner span { content: ""; display: block; width: 60px; height: 100%; border-left: 1px solid #ddd; position: absolute; top: 0; right: 0; }

footer .footer-partner .btn-partner span img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.2s; }

footer .footer-partner.active .btn-partner span img { transform: translate(-50%, -50%) rotate(180deg); }

footer .footer-partner ul { display: block; width: 100%; height: 0; background-color: #fff; border: 1px solid #ddd; border-bottom: none; overflow: auto; position: absolute; left: 0; bottom: 66px; z-index: 20; transition: all 0.2s; }

footer .footer-partner.active ul { height: 200px; padding: 5px 0; }

footer .footer-partner ul li { display: block; }

footer .footer-partner ul li a { display: block; padding: 10px 20px; }

footer .footer-info { width: 100%; padding: 50px; }

footer .footer-info:after { content: ""; clear: both; display: block; }

footer .footer-info .logo { float: left; padding-left: 30px; width: auto; height: 35px; }

footer .footer-info p { float: right; text-align: right; font-size: 14px; line-height: 1.7; }

footer .footer-info p.counter { line-height: 1; }

footer .footer-info b { display: inline-block; padding: 0 10px; }

footer .footer-info b span.material-icons-outlined { display: inline-block; font-size: 10px; margin-right: 5px; }

footer .footer-info span:not(.material-icons-outlined) { display: inline-block; padding-right: 10px; border-right: 1px solid #ccc; }

footer .footer-info span:last-child { border-right: none; padding-right: 0; }

/* 팝업 수정 */
#viewimg table td, #viewimg table td * { vertical-align: middle; }

/* 모바일, 태블릿, 768px 이상 */
@media (min-width: 768px) { }

/* 중간 기기들 (노트북 992px 이상) */
@media (min-width: 992px) { }

/* 큰 기기들 (큰 데스크탑, 1200px 이상) */
@media (min-width: 1200px){
 .main-top-btn { width: 80px;  height: 60px;  padding: 0;  line-height: 63px;}

 /* header .gnb .menu3 .submenu .sub > li.menu_conversion > a {font-size: 17px; } */}

/* 1400px 이상 */
@media (min-width: 1400px) { header .gnb .submenu .sub { padding-left: 100px; }

 /* header .gnb .menu3 .submenu .sub { padding-left: 70px; } */
 .right-menu .sns li { padding: 18px 15px; }
 }

/* max css */
/* gnb sm */
@media (max-width: 1740px) { header .gnb .submenu .sub>li { }
 }

@media (max-width: 1400px) {
 /* gnb */
 body.fixed { }

 body#body.sub { padding-top: 90px; }

 header .header-wrap { }

 header .logo { width: 240px; height: 20px; background-image: url("/img/logo_sm.png"); left: 30px; }

 header .topmenu>li>a { height: 90px; font-size: 16px; line-height: 90px; }

 header .gnb .submenu { height: 230px; top: 90px; }

 header .gnb .submenu .submenu-title,
 header .gnb .submenu .sub { padding-top: 20px; }

 header .gnb .submenu .submenu-title h4 { font-size: 22px; }

 header .gnb .submenu .submenu-title p { font-size: 15px; }

 header .gnb .submenu .sub>li { }

 /* header .gnb .submenu .sub>li>a, header .gnb .menu3 .submenu .sub>li>a { width: 210px; font-size: 16px; } */
 /* header .gnb .menu3 .submenu .sub>li>a { width: 225px; } */
 /* header .gnb .menu3 .submenu .sub > li.menu_conversion > a {width: 280px; } */
 header .gnb .submenu .sub>li>ul>li>a { font-size: 14px; line-height: 1; }

 header .gnb-bg { top: 90px; }

 /* header .gnb-bg.active { height: 230px; } */
 /* all menu */
 .menu-all .menu-close { height: 130px; background-image: url("/img/allmenu_close_sm.png"); }

 .menu-all>ul { height: calc(100% - 130px); }

 .menu-all>ul>li>a { font-size: 22px; }

 .menu-all>ul>li>a .num { font-size: 14px; line-height: 1.2em; margin-bottom: 0; }

 .menu-all>ul>li>.sub { margin-top: 15px; }

 .menu-all>ul>li>.sub>li>a { font-size: 14px; line-height: 38px; }

 .menu-all>ul>li>.sub>li>ul a { font-size: 13px; line-height: 21px; }
 }
/* gnb css */
@media (max-width: 1340px) {header .gnb .submenu .submenu-title, header .gnb-bg .submenu-bg { width:240px; }
header .gnb .submenu .sub>li {margin: 30px 0 0 30px; }
header .gnb .submenu .sub>li>a { min-width: 290px; font-size: 18px; }
header .gnb .submenu .sub { width: calc(100% - 240px); }
header .gnb .submenu .sub>li>ul>li>a { }
 }
/* 큰 기기들 (큰 데스크탑, 1200px 이하) */
@media (max-width: 1200px) { header .gnb .menu3 .submenu .sub { padding-left: 20px; }
}

/* gnb mobile */
@media (max-width: 1100px) {
 header .gnb-bg,
 .gnb { display: none; }
 }

/* 중간 기기들 (노트북 992px 이하) */
@media (max-width: 992px) {
 /* menu all */
 .menu-all { padding: 0 40px; }

 .menu-all .menu-close { height: 90px; }

 .menu-all>ul>li { width: 100%; height: auto; border-right: 0; border-top: 1px solid #545656; padding: 25px 0; }

 .menu-all>ul>li>.sub>li>a { font-size: 16px; }

 /* .menu-all > ul > li > .sub > li.menu_conversion > a {line-height: 38px;position: relative;top: 0; } */
 footer .footer-wrap { text-align: center; }

 footer .footer-info .logo { float: none; padding-left: 0px; margin-bottom: 30px; }

 footer .footer-info p { float: none; text-align: center; }
 }

/* 태블릿, 모바일 전용 (767px 이하) */
@media (max-width: 767px) { footer .footer-utilmenu { width: 100%; padding-left: 15px; }

 footer .footer-partner { float: left; width: 100%; }

 footer .footer-partner .btn-partner { width: 100%; border: none; }

 footer .footer-info img { float: none; padding: 0; margin-bottom: 20px; }

 footer .footer-info p { float: none; text-align: center; }

 .top-btn p { font-size: 13px; }
 }

/* 매우 작은 기기들 (모바일폰) */
@media (max-width: 480px) { header .logo { left: 10px; }

 header .navbar { right: 15px; }

 footer .footer-utilmenu li a { padding: 0px 10px; font-size: 14px; }

 footer .footer-info .logo { width: 244px; height: auto; }
 }
