@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900&display=swap');
@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);
/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small,
strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset,
label, legend, caption, button, article, aside, canvas, details, embed, figure, figcaption, footer, header, menu,
nav, output, ruby, section, summary, time, mark, audio, video
{margin:0;padding:0;border:0;}
article, aside, details, figcaption, figure, footer, header, menu, nav, section {display: block;}
html {height:auto;-webkit-text-size-adjust: none;-moz-text-size-adjust: none;-ms-text-size-adjust: none; }
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content:none;}
table {border-collapse:collapse;border-spacing:0;}
a {text-decoration:none;color:inherit;}
a:hover {text-decoration:none;}
legend, caption, hr {display:none;}
th {font-weight: inherit}
em {font-style:normal;}
img {vertical-align:top;}
input {vertical-align:middle;border-radius:0;}
p,h3,h2,h1{letter-spacing: normal;}
input,textarea,button,select{font-family:'Noto Sans KR', sans-serif; color: #000;border-radius:0;}
section{width:100%;}
body{font-family:'Noto Sans KR', sans-serif; width: 100%;height: 100%; color:#000;background-color: #fff;font-weight: 400;}
video{object-fit: fill;}
.blind, legend, caption {position: absolute !important;height: 1px;width: 1px;overflow: hidden; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px);}
/*팝업시 스크롤막기*/
body.stop {overflow-y: hidden}
/* font */
.kr_400{font-family:'Noto Sans KR', sans-serif;font-weight: 400}/* r */
.kr_500{font-family: 'Noto Sans KR', sans-serif;font-weight: 500}/* m */
.kr_700{font-family: 'Noto Sans KR', sans-serif;font-weight: 700}/* b */
.ns_300{font-family: 'NanumSquare', sans-serif; font-weight: 300}/* t */
.ns_400{font-family: 'NanumSquare', sans-serif; font-weight: 400}/* r */
.ns_700{font-family: 'NanumSquare', sans-serif;font-weight: 700}/* m */
.ns_800{font-family: 'NanumSquare', sans-serif;font-weight: 800}/* b */
.pc_hide{ display:none!important}

#WRAP {position:relative; width:100%; overflow:hidden;margin: 0 auto; min-width:1200px;max-width:1920px;margin: 0 auto;}
.wrap{width:1200px; position:relative; margin:0 auto;}
.table-layout{display:table; width:100%; height:100%;}
.table-cell-layout{display:table-cell; width:100%; height:100%; vertical-align:middle;}
.over-img{overflow:hidden;}
.clear{*zoom:1}
.clear:after{display:block;content:"";clear:both; visibility:hidden; height:0}
.ir_text {text-indent: -9999px;overflow: hidden;font-size: 0 ;height: 0;}
.ir_text >*{text-indent: -9999px;overflow: hidden;font-size: 0 ;height: 0;}
.taR{text-align:right!important;}
.taL{text-align:left!important;}
.taC{text-align:center!important;}
.f_left{float:left;}
.f_right{float:right;}
/* 간격 */
.p_n{ padding:0!important}
.mt0{margin-top:0px !important}
.mt4{margin-top:4px !important}
.mt5{margin-top:5px !important}
.mt10{margin-top:10px !important}
.mt12{margin-top:12px !important}
.mt15{margin-top:15px !important}
.mt17{margin-top:17px !important}
.mt18{margin-top:18px !important}
.mt20{margin-top:20px !important}
.mt22{margin-top:22px !important}
.mt25{margin-top:25px !important}
.mt27{margin-top:27px !important}
.mt30{margin-top:30px !important}
.mt34{margin-top:34px !important}
.mt35{margin-top:35px !important}
.mt40{margin-top:40px !important}
.mt45{margin-top:45px !important}
.mt47{margin-top:47px !important}
.mt48{margin-top:48px !important}
.mt49{margin-top:49px !important}
.mt50{margin-top:50px !important}
.mt55{margin-top:55px !important}
.mt60{margin-top:60px !important}
.mt65{margin-top:65px !important}
.mt69{margin-top:69px !important}
.mt70{margin-top:70px !important}
.mt76{margin-top:76px !important}
.mt80{margin-top:80px !important;}
.mt90{margin-top:90px !important;}
.mt95{margin-top:95px !important;}
.mt100{margin-top:100px !important;}
.mb10{margin-bottom:10px !important;}
.mb15{margin-bottom:15px !important;}
.mb20{margin-bottom:20px !important;}
.mb30{margin-bottom:30px !important;}
.mb40{margin-bottom:40px !important;}
.mb45{margin-bottom:45px !important;}
.mb50{margin-bottom:50px !important;}
.mb80{margin-bottom:80px !important;}
.mb100{margin-bottom:100px !important;}
.ml0{margin-left:0px !important;}
.ml5{margin-left:5px !important;}
.ml8{margin-left:8px !important;}
.ml10{margin-left:10px !important;}
.ml11{margin-left:11px !important;}
.ml12{margin-left:12px !important;}
.ml15{margin-left:15px !important;}
.ml20{margin-left:20px !important;}
.ml25{margin-left:25px !important;}
.ml30{margin-left:30px !important;}
.ml40{margin-left:40px !important;}
.mr5{margin-right:5px !important}
.pt0{padding-top:0px !important}
.pt15{padding-top:15px !important}
.pt25{padding-top:25px !important}
.pt30{padding-top:30px !important}
.pt47{padding-top:47px !important}
.pt50{padding-top:50px !important}
.pt60{padding-top:60px !important}
.pt85{padding-top:85px !important}
.pb0{padding-bottom:0px !important}
.pb15{padding-bottom:15px !important}
.pb45{padding-bottom:45px !important}
.pb110{padding-bottom:110px !important}
.pl15{padding-left:15px !important}
.pl18{padding-left:18px !important}
.pl30{padding-left:30px !important}
.pl35{padding-left:35px !important}
.cap{text-transform: uppercase !important;}

.mot2 {
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
.mot3 {
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
.mot4 {
	-webkit-transition: all 0.4s ease-out;
	-moz-transition: all 0.4s ease-out;
	-o-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;
}
.mot5 {
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}

.ellipsis {display: inline-block; max-width:100%;
	white-space: nowrap;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;}
.ellipsis_line{
	/* font-size, line-height, max-height,-webkit-line-clamp : 개별적용(2줄이상) */
	position: relative;
	/*font-size: 14px;*/
	transition: all 0.3s;
	white-space: normal;
	word-wrap: break-word;
	/*line-height: 25px;*/
	/*max-height: 50px;*/
	/*-webkit-line-clamp: 2;*/
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.block-lg {display: block !important;}
.text-hide {font: 0/0 a !important;color: transparent; text-shadow: none;background-color: transparent;border: 0;}
/* HEADER-GNB */
#main_head {position: fixed;top: 0;width: 100%;height: 90px;background-color: transparent;-webkit-transition: all 0.4s;transition: all 0.4s;border-bottom: 1px solid transparent;will-change: top;z-index: 700;max-width: 1920px;min-width: 1200px; z-index:9999}
#main_head .fixed-wrap {left: 0;padding: 0 15px;width: 100%;height:90px;transition: all 0.4s;}
/*2020-08-24 신규 추가*/
#main_head .fixed-wrap .contact_box{height: 90px; position: absolute; left: 0;top: 0;box-sizing: border-box;font-size: 15px; color: #fce83b; padding: 18px 20px; line-height: 1.8; font-weight: bold;}
#main_head.white .fixed-wrap .contact_box{color: #b01116; }
#main_head .fixed-wrap:hover .contact_box{color: #fce83b;}
#main_head .fixed-wrap .header-inner {display: flex;justify-content: space-between;margin: 0 auto;max-width:1200px;height: 100%;}
#main_head .logo {display: flex; flex-direction: column;width:200px;}
#main_head .logo .logo-img {display: flex;flex: 1 1 0%;align-items: center;background-image: url(../../img/logo.png);background-repeat: no-repeat;background-position: center left;}
#main_head .nav{display: flex;justify-content: flex-end;flex: 1 1 0%;}
#main_head .nav .menu-list-wrap {display: flex; justify-content: space-between;width: 100%;max-width:800px;}
#main_head .nav .menu-list {display: flex;position: relative;flex: 1 1 auto;justify-content: center;}
#main_head .nav .menu-list > a {position: relative;display: flex; align-items: center;justify-content: center;font-size:19px;font-weight:400;color: #fff;transition: color 0.4s;-webkit-transition: color 0.4s;cursor: pointer;}
.sub-menu-list-wrap {display: none;position: absolute;left: 0;top: 90px;width: 100%;height: 295px;text-align: center;z-index: 999;transition: top 0.4s;}
.sub-menu-list{ margin-top:15px}
.sub-menu-list-wrap li:first-child {margin-top: 40px;}
.sub-menu-list a {position: relative;display: block;font-size: 15px;color: #aaa; transition: color 0.4s;-webkit-transition: color 0.4s;}
.sub-menu-list .text {word-break: inherit;}
.header-right-wrap {display: flex;align-items: center;}
.header-right-wrap .btnPcNav {padding-left: 25px;height: 100%;display: flex;align-items: center;justify-content: center;cursor: pointer;}
#main_head .navBg {position: absolute;left: 0;top: 80px; display: none;width: 100%;height: 315px;background-color: rgba(30, 30, 30, 0.9);transition: top 0.4s;z-index: 400;}
.header-right-wrap .menu-btn .line, .header-right-wrap .menu-btn .line:before, .header-right-wrap .menu-btn .line:after {content: "";display: block;width: 26px;height: 2px;background-color: #fff;transition: transform 0.4s, background 0.4s;margin:6px 0;}
.header-right-wrap .menu-btn .line:before {transform: translateY(-8px);}
/*header 액션*/
#main_head.fixed {position: fixed;top: -100px;height: 80px;opacity: 0;}
#main_head.white {background-color: #fff;border-bottom: 1px solid #ddd;}
#main_head.white .logo .logo-img{background-image: url(../../img/logo_on.png);}
#main_head.white:hover .logo .logo-img, .nav-open #main_head.white .logo .logo-img{background-image: url(../../img/logo.png);}
#main_head:hover .fixed-wrap, .nav-open #main_head .fixed-wrap{ background-color:#1e1e1e!important}
#main_head .nav .menu-list:hover .menu-text{color:#f48b8e}
#main_head .nav .menu-list:after {content: "";display: inline-block;position: absolute; bottom: 0;left: 0;width: 100%;height: 3px;background: linear-gradient(to right, #fd767a, #b01116);opacity: 0;transition: opacity 0.4s;}
#main_head .nav .menu-list:hover:after{opacity:1}
.nav-open #main_head .menu-btn .line:before{-webkit-transform:translateY(0) rotateZ(135deg); transform:translateY(0) rotate(135deg)}
.nav-open #main_head .menu-btn .line:after{-webkit-transform: translateY(-8px) rotateZ(-135deg); transform: translateY(-8px) rotateZ(-135deg);}
.nav-open #main_head .menu-btn .line,  .nav-open #main_head.white .menu-btn .line, .nav-open #main_head.white:hover .menu-btn .line{background-color: transparent !important;}
.sub-menu-list:hover>a{ color:#fff}
/* 글씨색 검정색이 필요할 시 
#main_head:hover .menu-list>a, .nav-open #main_head .menu-list > a{ color:#fff;}
.sub-menu-list:hover>a{ color:#fff}
#main_head:hover, .menu-list>a, .nav-open #main_head .main-list >a{color:#fff!important} 
#main_head:hover .menu-btn .line, .nav-open #main_head .menu-btn .line, #main_head:hover .menu-btn .line:before, .nav-open #main_head .menu-btn .line:before,
#main_head:hover .menu-btn .line:after, .nav-open #main_head .menu-btn .line:after{background-color:#fff!important}
*/
#main_head.white .menu-list>a, #main_head.white .menu-list > a{ color:#222!important} 
#main_head.white .menu-btn .line, #main_head.white .menu-btn .line:before, #main_head.white .menu-btn .line:after{ background:#222!important}
#main_head.white:hover .menu-list>a, .nav-open #main_head.white .menu-list > a{ color:#fff!important}
#main_head.white:hover .menu-btn .line, #main_head.white:hover .menu-btn .line:before, 
.nav-open #main_head.white .menu-btn .line:before, #main_head.white:hover .menu-btn .line:after, .nav-open #main_head.white .menu-btn .line:after{background-color:#fff!important}



/* FOOTER */
#footer{width:100%; background-color:#4e4d4c; position:relative; z-index:124; padding:10px 0!important}
#footerTop{padding:14px 0;}
.footer-logo{float:left;}
#footerTop > ul{float:right; line-height:53px;}
#footerTop > ul li{display:inline-block; vertical-align:middle;}
#footerTop > ul li > a{font-size:15px; color:#aaa;}
#footerTop > ul li:first-child{margin-right:30px;}
#footerTop > ul li:first-child > a{color:#ccc;}
#footerBottom{width:100%; border-top:1px solid #777; padding:2% 0;}
.footer-bottom-inner > p{float:left; font-size:16px; line-height:25px; color:#aaa; }
.footer-bottom-inner > p .bar{display:inline-block; width:1px; background:#aaa; height:12px; margin:7px 10px}
.footer-bottom-inner > p span, .footer-bottom-inner > p a{display:inline-block; vertical-align:top; font-size:16px; line-height:25px; color:#aaa; margin-top:10px;margin-right:15px;}

.footer-bottom-inner > p span em, .footer-bottom-inner > p a em{color:#fb3239;}
.footer-bottom-inner > div{float:right;}
.sns-list{text-align:right; margin-bottom:15px;}
.sns-list li{display:inline-block; vertical-align:top; margin-left:10px;}
.copyright{font-size:14px; line-height:20px; color:#aaa; font-weight:300;font-style: normal;}
.copyright > span{color:#fb3239;letter-spacing: 1px;}


/* 공통 :: 버튼 */
a.btn-discover { position: relative; width: 48px; height: 48px; margin:0 auto; display: block; overflow: hidden; border: 4px solid; border-image: linear-gradient(to right, #fd767a 0%,#b01116 100%) 5; }
a.btn-discover span { position: absolute; left: 19px; top: 10px; width: 2px; height: 20px; background: #ccc; }
a.btn-discover span:before,
a.btn-discover span:after { position: absolute; left: 2px; top: 9px; width: 9px; height: 2px; content:''; background: #ccc; }
a.btn-discover .r { left: auto; right: 19px; }
a.btn-discover .r:before,
a.btn-discover .r:after { left: auto; right: 2px; }
a.btn-discover i { color: #aaa; text-align: center; font-size:16px; font-style: normal; letter-spacing: -0.35px; padding-top:8px; display: block; opacity: 0; }
a.btn-discover {
	transition: width 0.45s cubic-bezier(0.770, 0.000, 0.175, 1.000);
	-webkit-transition: width 0.45s cubic-bezier(0.770, 0.000, 0.175, 1.000);
	-moz-transition: width 0.45s cubic-bezier(0.770, 0.000, 0.175, 1.000);
	-o-transition: width 0.45s cubic-bezier(0.770, 0.000, 0.175, 1.000);
}
a.btn-discover span,
a.btn-discover span:before,
a.btn-discover span:after,
a.btn-discover i {
	transition: all 0.45s cubic-bezier(0.770, 0.000, 0.175, 1.000);
	-webkit-transition: all 0.45s cubic-bezier(0.770, 0.000, 0.175, 1.000);
	-moz-transition: all 0.45s cubic-bezier(0.770, 0.000, 0.175, 1.000);
	-o-transition: all 0.45s cubic-bezier(0.770, 0.000, 0.175, 1.000);
}
a.btn-discover:hover{ width: 150px; }
a.btn-discover:hover span {opacity:0;filter:Alpha(opacity=0);}
a.btn-discover:hover span:before,
a.btn-discover:hover span:after { width: 5px; }
a.btn-discover:hover span:before { top: 0; }
a.btn-discover:hover span:after { top: 34px; }
a.btn-discover:hover .l { left: 0; }
a.btn-discover:hover .r { right: 0; }
a.btn-discover:hover i { opacity: 1; }

.main-btn div{display:inline-block; position:relative; width:150px; height:46px; border-top:2px solid #E3E3E3; border-bottom:2px solid #E3E3E3; text-align:center;-webkit-transition-delay:0.8s;-moz-transition-delay:0.8s;-o-transition-delay:0.8s;-ms-transition-delay:0.8s;transition-delay:0.8s;}
.main-btn div p{position:relative; display:block; width:100%; height:100%; font-size:12px; line-height:45px; color:#444444; letter-spacing:2px; -webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s; }
.main-btn div p span{position:relative; display:block; width:100%; height:100%;}
.main-btn div p span em{position:relative; display:block; z-index:2; font-weight: 600;}
.main-btn a:hover p {letter-spacing: 3px;}
.btn-effect01 p:before, 
.btn-effect01 p:after,
.btn-effect01 span:before,
.btn-effect01 span:after{display:inline-block; content:""; position:absolute; -webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s}
.btn-effect01 p:before{
	top:-2px; bottom:-2px; left:0; border-top:2px solid #444444; border-bottom:2px solid #444444; width:12px;
}
.btn-effect01 p:after{
	top:-2px; bottom:-2px; right:0; border-top:2px solid #444444; border-bottom:2px solid #444444; width:12px;
}
.btn-effect01 span:before{
	top:-2px; bottom:-2px; left:0; width:2px; background-color:#444444;
}
.btn-effect01 span:after{
	top:-2px; bottom:-2px; right:0; width:2px; background-color:#444444;
}
.btn-effect01:hover p:before,
.btn-effect01:hover p:after{width:50%;}
/*탭버튼*/
#bo_cate {}
#bo_cate h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_cate ul {zoom:1;display: table;width: 100%;border-collapse: collapse;margin-bottom: 40px;}
#bo_cate ul:after {display:block;visibility:hidden;clear:both;content:""}
#bo_cate li {width:16.6%;display: table-cell; float:left;border: 1px solid #ddd;color: #666; margin:-1px 0 0 -1px; box-sizing:border-box;}
#bo_cate li:last-child{ border-right:1px solid #ddd}
#bo_cate a {display: block;font-size:16px; line-height: 58px;color: inherit;text-align: center;}
#bo_cate #bo_cate_on {color: #fff;background:#b01116;border-color:#b01116;font-weight: bold;}
/*넘버링 버튼*/
/* 페이징 */
.pg_wrap {width:100%; text-align:center; padding-top: 50px;}
.pg {text-align:center; display:block}
.pg_page, .pg_current {display:inline-block;vertical-align:middle;border:1px solid #eee}
.pg a:focus, .pg a:hover {text-decoration:none}
.pg_page { color:#333; width:35px; height:35px; text-align:center; line-height:35px; margin-right:5px}
.pg_page:hover {background-color:#fafafa}
.pg_start {text-indent:-999px;overflow:hidden;background:url('../../img/btn_first.gif') no-repeat 50% 50% #eee;padding:0;border:1px solid #eee}
.pg_prev {text-indent:-999px;overflow:hidden;background:url('../../img/btn_prev.gif') no-repeat 50% 50% #eee;padding:0;border:1px solid #eee}
.pg_end {text-indent:-999px;overflow:hidden;background:url('../../img/btn_end.gif') no-repeat 50% 50% #eee;padding:0;border:1px solid #eee}
.pg_next {text-indent:-999px;overflow:hidden;background:url('../../img/btn_next.gif') no-repeat 50% 50% #eee;padding:0;border:1px solid #eee}
.pg_start:hover,.pg_prev:hover,.pg_end:hover,.pg_next:hover {background-color:#fafafa}

.pg_current { width:35px; height:35px; background:#444; border:1px solid #444; color:#fff; line-height:35px; margin-right:5px}

/* ****************** MODAL LAYERPOPUP ********************** */
/* modal layer */
.modal-fixed-pop-wrapper{display:none; overflow-y:scroll; overflow-x:hidden;  position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:9999; background:#000; background:rgba(0,0,0,0.8);}
.modal-fixed-pop-inner{position:absolute; display:table; width:100%; height:100%; text-align:center;}
.modal-inner-box{ position:relative; display:table-cell; vertical-align:middle;}
.modal-loading{position:absolute; top:50%; left:50%; margin:-25px 0 0 -25px; z-index:10000;}
.modal-inner-content{text-align:left;}
.loading {
  display: inline-block;
  width: 50px;
  height: 50px;
  border: 8px solid rgba(255,255,255,.3);
  border-radius: 50%;
  border-top-color: #fff;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
}
@keyframes spin {
  to { -webkit-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
  to { -webkit-transform: rotate(360deg); }
}
/* modal layer content */
.footer-modal-content{position:relative; width:96%; max-width:1000px; margin:20px auto; background-color:#fff; }
.footer-modal-content h1{height:60px; line-height:60px; font-size:24px; font-weight:600; letter-spacing:-0.5px; text-align:center; padding:0; background-color:#b01116; color:#fff;}
.modal-close-btn{position:absolute; top:11px; right:10px; color:#fff; }
.modal-close-btn i{font-size:38px;}
.modal-close-btn i:hover {color:#fff}
.footer-inner-box{padding:30px; }
.footer-inner{height:400px; overflow-y:auto; overflow-x:hidden; }
.footer-inner textarea{padding:20px; display:block; width:100%; height:100%; font-size:13px; color:#666}
.close{display:none}




