@charset "utf-8";

#hd_login_msg {position:absolute;top:0;left:0;width:1px;height:1px;overflow:hidden;}
/* body */
body.lock {overflow:hidden}
/* 브라우저 업데이트 권장 팝업 */
#browserUpdate {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#111; z-index:9999}
#browserUpdate .inner {position:absolute; top:50%; left:50%; width:800px; margin:-275px 0 0 -400px; padding:100px 70px; text-align:center; background:#fff}
#browserUpdate .inner h2 {font-size:42px; margin-bottom:30px}
#browserUpdate .inner p {color:#777; line-height:1.8; margin-bottom:40px}
#browserUpdate .inner ul {text-align:justify}
#browserUpdate .inner ul:after {display:inline-block; width:100%; content:''}
#browserUpdate .inner ul li {display:inline-block; width:24%; padding:20px; border:1px solid #e8e8e8; vertical-align:top}
#browserUpdate .inner ul li:hover {background:#fafafa}
#browserUpdate .inner ul li .icon {width:48px; height:48px; margin:0 auto 25px auto}
#browserUpdate .inner ul li .icon img {display:block; width:100%}
#browserUpdate .inner ul li a {display:block; height:35px; font-family:'돋움','Dotum'; font-size:12px; color:#444; text-align:center; line-height:31px; border:1px solid #dedede; border-bottom:3px solid #dadada; background:#f9f9f9}
#browserUpdate .inner ul li a:hover {background:#fff}
#browserUpdate .inner ul li a:active {border-top:1px solid #dadada; border-bottom:1px solid #dedede; background:#f4f4f4}

/* 헤더 */
#header {position:fixed; top:20px; left:0; width:100%; z-index:990; transition:all .4s ease}
#header:before {position:absolute; top:-20px; left:0; width:100%; height:0; content:''; background:#fff; box-shadow:0 2px 2px rgba(0, 0, 0, .04); z-index:10; transition:all .4s ease}
#header > .inner {position:relative; max-width:1400px; margin:0 auto; padding:0 50px; z-index:30}
#logo {float:left; width:180px; padding-top:20px}
#logo a img {display:block;}

/* 헤더로고컨트롤 */
#logo.add-fixed {display:none;}
#header.fixed #logo.no-fixed {display:none;}
#header.fixed #logo.add-fixed {display:block;}

#gnb {float:right; padding-right:80px}
#gnb > li {position:relative; display:inline-block; vertical-align:top}
#gnb > li > a {display:block; padding:35px 35px; font-size:18px; color:#fff; font-weight:600;}
#gnb > li > ul {display:none; position:absolute; top:80px; left:50%; width:180px; margin-left:-90px; padding:0 20px; background:#fff; box-shadow:0 4px 20px rgba(0, 0, 0, .08)}
#gnb > li > ul:before {position:absolute; top:-12px; left:50%; content:''; margin-left:-6px; border-style:solid; border-width:6px; border-color:transparent transparent #fff transparent}
#gnb > li > ul > li {position:relative}
#gnb > li > ul > li > a {position:relative; display:block; padding:15px 0; border-bottom:1px solid #e0e0e0}
#gnb > li > ul > li:last-child > a {border-bottom:none}
#header.fixed {top:0}
#header.fixed:before {top:0; height:100%}
#header.fixed #gnb > li > a {color:#333}
#header.fixed #gnb > li > a:after {display:none}
#gnbTrigger {display:none; position:fixed; top:0; left:0; width:50px; height:50px; border:none; background:#fff; cursor:pointer; outline:none; z-index:1100}
#gnbTrigger > span {display:block; position:absolute; left:50%; width:30px; height:3px; margin-left:-15px; background:#000; transition:all .3s ease-in-out; transform:rotate(0deg); opacity:1}
#gnbTrigger > .bar1 {top:16px}
#gnbTrigger > .bar2 {top:24px}
#gnbTrigger > .bar3 {top:32px}
#gnbTrigger.open {background:#000}
#gnbTrigger.open > span {background:#fff}
#gnbTrigger.open > .bar1 {top:24px; transform:rotate(135deg)}
#gnbTrigger.open > .bar2 {opacity:0; left:-30px}
#gnbTrigger.open > .bar3 {top:24px; transform:rotate(-135deg)}
/* 상단으로 스크롤 */
#scrollTop {display:none; position:fixed; bottom:30px; right:30px; display:inline-block; width:45px; height:45px; text-align:center; color:#fff; line-height:45px; border-radius:50%; background:#555; transition:none !important; z-index:900}
#scrollTop i {position:absolute; top:35%; left:35%; transition:all .4s ease}
#scrollTop span {position:absolute; width:100%; top:0; left:50%; font-weight:600; margin-left:-22px; line-height:45px; opacity:0; filter:alpha(opacity='0'); transform:rotate(-360deg); transition:all .4s ease}
#scrollTop.on i {opacity:0; filter:alpha(opacity='0'); transform:rotate(360deg)}
#scrollTop.on span {display:block; opacity:1; filter:alpha(opacity='100'); transform:rotate(0deg)}
/* 문단 */
#container p {line-height:1.75}
/* 폼메일 */
.tbl_formmail {width:100%; margin-bottom:40px}
.tbl_formmail:before {display:block; width:100%; height:1px; margin-bottom:40px; content:''; background:#e8e8e8}
.tbl_formmail input {font:inherit !important}
.tbl_formmail input[type=file] {width:100%}
.tbl_formmail input[type=text], .tbl_formmail input[type=password] {width:100%; height:60px; font-size:14px !important; color:#666; padding-left:20px; border:none; border-radius:4px; background:#f0f0f0}
.tbl_formmail input[name^=phone] {width:80px !important}
.tbl_formmail select {height:40px; line-height:38px; padding:0 10px; border:1px solid #e0e0e0; cursor:pointer}
.tbl_formmail textarea {font:inherit !important; font-size:14px !important; line-height:1.75; width:100%; min-height:150px; padding:20px; border:none; border-radius:4px; background:#f0f0f0}
.tbl_formmail select:focus, .tbl_formmail select:hover {border-color:#d8d8d8}
.tbl_formmail tbody td {font:inherit !important; font-size:0 !important; padding:3px 0}
.tbl_formmail tbody td br {display:none}
.tbl_formmail tbody td font, .tbl_formmail tbody td span, .tbl_formmail tbody td a {font:inherit !important; font-size:14px !important}
.formmail_title_bgcolor {display:none}
/* 공통 UI */
.wr_btn {display:inline-block; height:40px; margin:0 1px; padding:0 30px !important; font:inherit !important; color:#666; line-height:38px !important; text-decoration:none !important; border:1px solid #d8d8d8; border-radius:3px; background:#fff; cursor:pointer; vertical-align:middle}
.btn {display:inline-block; height:40px; margin:0 1px; padding:0 30px !important; font:inherit !important; color:#666; line-height:38px !important; text-decoration:none !important; border:1px solid #d8d8d8; border-radius:3px; background:#fff; cursor:pointer; vertical-align:middle}
.btn-default {border-color:#ddd}
.btn-default:hover {color:inherit !important; border-color:#cdcdcd; background:#f4f4f4}
.btn-primary {color:#fff !important; border-color:#93bd93; background:#92bd92}
.btn-primary:hover {border-color:#86b186 !important; background:#86b886 !important}
.btn-danger {color:#fff !important; border-color:#c14646; background:#cc4a4a}
.btn-danger:hover {border-color:#ad4444 !important; background:#b44b4b !important}
.btn i {margin-right:10px; vertical-align:-1px}
.btn i.right {margin:0 0 0 10px}
.btn-sm {height:35px; padding:0 20px !important; border-radius:2px; line-height:33px !important}
.btn-lg {height:50px; line-height:48px !important}
/* 푸터 */
#footer {background:#fff; height:154px}
#footer > .inner {max-width:1400px; margin:auto; padding:30px 50px}
#footer > .inner a {font-size:15px; color:#262626 !important}
#footer > .inner .ft_logo {float:left; width:180px; margin-right:150px; margin-top:20px}
#footer > .inner .companyInfo {float:left}
#footer > .inner .companyInfo p {font-size:15px; color:#262626; line-height:1.75}
#footer > .inner .companyInfo ul li {display:inline-block; font-size:15px; color:#262626; line-height:1.75; margin-right:10px}
#footer > .inner .copyright {font-size:15px; color:#656565; line-height:1.75; padding-top:15px}
.ft_menu {width:100%; height:70px; background:#5e5e5e}
.ft_menu ul {max-width:1350px; margin:auto}
.ft_menu li a {float:left; font-size:16px; line-height:70px; color:#fff; margin:0px 27px}
.ft_menu li a:hover {color:#92e28b}

/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;width:1px;height:1px;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}

/* 본문 바로가기 */
#skip_to_container a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skip_to_container a:focus, #skip_to_container a:active {width:100%;height:75px;background:#21272e;color:#fff;font-size:2em;font-weight:bold;text-align:center;text-decoration:none;line-height:3.3em}

/* 이미지 등비율 리사이징 */
.img_fix {width:100%;height:auto}

/* 캡챠 자동등록(입력)방지 기본 */
#captcha {display:inline-block;position:relative}
#captcha legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
#captcha #captcha_img {width:100px;height:41px;border:1px solid #e9e9e9}
#captcha #captcha_mp3 {position:absolute;top:0;left:101px;;margin:0;padding:0;width:23px;height:22px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer}
#captcha #captcha_mp3 span {position:absolute;top:0;left:0;width:23px;height:22px;background:url('../../../plugin/kcaptcha/img/sound.gif')}
#captcha #captcha_reload {position:absolute;top:21px;left:101px;margin:0;padding:0;width:23px;height:22px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer}
#captcha #captcha_reload span {position:absolute;top:0;left:0;width:23px;height:22px;background:url('../../../plugin/kcaptcha/img/reload.gif')}
#captcha #captcha_key {margin:0 0 0 25px;padding:0 5px;width:70px;height:41px;border:1px solid #b8c9c2;background:#f7f7f7;font-size:1.333em;font-weight:bold;text-align:center;line-height:2.8em}
#captcha #captcha_info {display:block;margin:5px 0 0;font-size:0.95em;letter-spacing:-0.1em}

/* ckeditor 단축키 */
.cke_sc {margin:0 0 5px;text-align:right}
.btn_cke_sc{display:inline-block;padding:0 10px;height:23px;border:1px solid #ccc !important;background:#fafafa !important;color:#000 !important;text-decoration:none !important;line-height:1.9em;vertical-align:middle}
.cke_sc_def {margin:0 0 5px;padding:10px;border:1px solid #ccc;background:#f2f5f9;text-align:center}
.cke_sc_def dl {margin:0 0 5px;text-align:left;zoom:1}
.cke_sc_def dl:after {display:block;visibility:hidden;clear:both;content:""}
.cke_sc_def dt, .cke_sc_def dd {float:left;margin:0;padding:5px 0;border-bottom:1px solid #e9e9e9}
.cke_sc_def dt {width:20%;font-weight:bold}
.cke_sc_def dd {width:30%}

 /* ckeditor 태그 기본값 */
#bo_v_con ul{display: block;list-style-type: disc;margin-top: 1em;margin-bottom: 1em;margin-left: 0;margin-right: 0;padding-left: 40px;}
#bo_v_con ol{display: block;list-style-type: decimal;margin-top: 1em;margin-bottom: 1em;margin-left: 0;margin-right: 0;padding-left: 40px;}
#bo_v_con li{display: list-item;}

/* Mobile화면으로 */
#mobile_cng {display:block;margin:0.3em;padding:0.5em 0;border:1px solid #eee;border-radius:2em;background:#fff;color:#000;font-size:2em;text-decoration:none;text-align:center}

/* 목록 바로가기 */
.sanchor {margin:30px 0 20px ;padding:0;zoom:1}
.sanchor:after {display:block;visibility:hidden;clear:both;content:""}
.sanchor li {float:left;width:20%;text-align:center;;list-style:none}
.sanchor li a{display:block;position:relative;height:60px;margin-left:-1px;background-color:#f7f7f7;border:1px solid #cdcdcd;border-bottom:1px solid #000;font-size: 1.25em;
color: #666;line-height: 58px;text-align: center;z-index:1}
.sanchor li .sanchor_on{margin:0 0 0 -1px;border:1px solid #000;background:#fff;z-index:2;border-bottom-color:#fff;color:#000;font-weight:bold}
.sanchor li a .item_qa_count,.sanchor li a .item_use_count{display:inline-block;background:#aaa;padding:0 5px;line-height:23px;border-radius:15px;color:#fff;min-width:23px;font-size:12px}
.sanchor li .sanchor_on .item_qa_count,.sanchor li .sanchor_on .item_use_count{background:#55bfb1}

/* 콘텐츠별 스타일 */
.cnt_cmt {display:inline-block;margin:0 0 0 3px;font-weight:bold}

/* 버튼 */
/*a.btn,.btn{line-height:35px;height:35px;padding:0 10px;text-align:center;border-radius:3px;font-weight:bold;border:0;}*/

a.btn01 {display:inline-block;padding:0 7px;border:1px solid #ccc;border-bottom:1px solid #aaa;background:#fff;color:#333;text-decoration:none;vertical-align:middle}
a.btn01:focus, a.btn01:hover,button.btn01:hover {text-decoration:none;background:#f3f3f3}
button.btn01 {display:inline-block;margin:0;padding:0 7px;border:1px solid #b3b3b3;background:#fff;color:#333;text-decoration:none}
a.btn02 {display:inline-block;padding:0 7px;border:1px solid #d50c0c;background:#d50c0c;color:#fff;text-decoration:none;vertical-align:middle}
a.btn02:focus, .btn02:hover {text-decoration:none;background:#fd0f0f}
button.btn02 {display:inline-block;margin:0;padding:0 7px;border:1px solid #d50c0c;background:#d50c0c;color:#fff;text-decoration:none}
.btn_confirm {text-align:center} /* 서식단계 진행 */
.btn_submit {background:#d50c0c;color:#fff;border:0;}
.btn_submit:hover{background:#fd0f0f}
.btn_address{background:#70aff2;border:1px solid #3476be;height:40px;color:#fff;padding:0 10px;font-size:1.083em;font-weight:bold;}
fieldset .btn_submit {padding:0 7px;height:24px;line-height:1em}
a.btn_cancel {display:inline-block;padding:7px;border:1px solid #ccc;background:#fafafa;color:#000;text-decoration:none;vertical-align:middle}
button.btn_cancel {display:inline-block;padding:7px;border:1px solid #ccc;background:#fafafa;color:#000;vertical-align:top;text-decoration:none}
a.btn_frmline, button.btn_frmline {display:inline-block;padding:0 10px;height:30px;border:1px solid #3476be;color:#3476be;background:#fff;letter-spacing:-0.1em;text-decoration:none;vertical-align:middle} /* 우편번호검색버튼 등 */
a.btn_frmline {line-height:24px}
button.btn_frmline {font-size:1em}
.global {position:absolute;right:0px;top:35px;}
.global > a {font-size:13px;color:#fff;border:solid 1px #fff;padding:5px 10px;}
/* 미디어쿼리 */
@media screen and (min-width:1025px) {
 /* 헤더 */
 #gnb {float:right; padding-right:100px}
 #gnb > li > a:after {display:none; margin-top:5px; height:1px; content:''; background:#fff}
 #gnb > li.on > a:after, #gnb > li.open > a:after, #gnb > li > a:hover:after {display:block}
 #gnb > li > ul > li > a:hover {color:#48d03c}
 #gnb > li > ul > li:after {position:absolute; bottom:0; left:0; width:0; height:1px; content:'' !important; background:#48d03c; transition:all .4s ease}
 #gnb > li > ul > li:hover:after {width:100%}
 #gnb > li > ul > li:last-child:after {display:none}
 #header.fixed #gnb > li > a:hover, #header.fixed #gnb > li.on > a {color:#92bd92}
}
@media screen and (max-width:1024px) {
 /* 헤더 */
 #header.fixed #logo.add-fixed {display:none;}
 #header.fixed {top:20px;}
 #logo {display:none; position:relative; float:none; margin:15px auto 0 auto; padding:0; z-index:1100;text-align:center;}
 #logo a img {width:80px;}
 #gnbWrapper {position:fixed; top:0; left:-100%; width:100%; height:100%; background:#fff; z-index:1010}
 #gnbTrigger {display:block !important}
 #gnb {float:none; margin-top:120px; text-align:center}
 #gnb > li {display:block}
 #gnb > li > a {display:inline-block; font-size:48px; padding:8px 15px !important; color:#333}
 #gnb > li.open > a {color:#fff !important; background:#333}
 #gnb > li > ul {position:static; margin:0 !important; width:auto; text-align:center; background:transparent; box-shadow:none}
 #gnb > li > ul:before {display:none}
 #gnb > li > ul > li > a {font-size:24px; padding:8px 0; border-bottom:none}
 .global {position:absolute;right:10px;top:0px;}
}


@media screen and (max-width:768px) {
 /* 헤더 */
 #gnb > li > a {font-size:22px !important}
 #gnb > li > ul > li > a {font-size:18px}
 /* 푸터 */
 #footer > .inner {padding:25px; text-align:center}
 #footer > .inner p {font-size:11px}
 #footer > .inner .companyInfo {float:none}
 #footer > .inner .companyInfo ul li {font-size:11px}
 #footer > .inner .copyright {float:none; padding-top:0}
}
@media screen and (max-width:640px) {
 /* 폼메일 */
 .tbl_formmail input {font:inherit !important; font-size:12px !important}
 .tbl_formmail input[type=text], .tbl_formmail input[type=password] {font-size:12px !important}
 .tbl_formmail input[name^=phone] {width:50px !important}
 .tbl_formmail select {font-size:12px !important}
 .tbl_formmail textarea {font-size:12px !important}
}