@charset "UTF-8";
@import url('//fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900|Roboto:300,300i,400,400i,500,500i,700,700i,900,900i&display=swap&subset=korean');
/**********************************************
note : fonts set
## google fonts cdn이 변경됨. https://fonts.google.com/에 방문하여 폰트를 담아오면 됩니다.
## 예) @import url('https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700,800&subset=korean');
**********************************************/
body,th,td,input,select,textarea,button,
h1,h2,h3,h4,h5,h6 {font-family:'Roboto','Noto Sans KR','Malgun Gothic','돋움','dotum','Apple SD Gothic Neo','Helvetica Neue','Helvetica','Arial',sans-serif}

body { position: static !important; top:0px !important; }

/**********************************************
note : article box
name : 이경아
**********************************************/
.box-skin .header .skin-column > a, .box-skin .header .skin-column > strong, .box-skin .header > a, .box-skin .header > strong {margin-bottom:20px;font-size:20px;letter-spacing:-0.05em;font-weight:500;text-align:center}

/* 기본제목배경 */
.box-skin.box-custom {position:relative}
.box-skin.box-custom::before {content:'';position:absolute;top:0;z-index:-1;width:100%;height:200px;background:#eee}
.box-skin.box-custom .header {padding:20px 20px 0}
.box-skin.box-custom .content {padding:0 20px}

/* 기본제목배경02 */
.box-skin.box-custom.point::before {background:#333}
.box-skin.box-custom.point .header > a, .box-skin.box-custom.point .header > strong {color:#fefefe}

/* 배경박스-다크블루 */
.box-skin.mbox-bg-darkblue {background-color:#263238 !important}

/* 배경박스-그레이 */
.box-skin.mbox-bg-grey {background-color:#f0f1f3 !important}

/**********************************************
note : muti banner
name : 이경아
**********************************************/
#rollBanner-2.rolling-bn {margin-bottom:30px;padding-top:10px;border:1px solid rgba(0,0,0,.1)}

/**********************************************
note : mobile
name : 이경아
**********************************************/
/* 기사박스여백 */
.index-wrap.mobile .box-skin {padding-left:0;padding-right:0}

/* 모바일배너 */
.index-wrap.mobile .banner_box img, .mobile.list .banner_box img {width:100%}

/* 모바일 기사박스 타이틀 */
.mobile.list .box-skin .header > a, .mobile.list .box-skin .header > strong {margin-bottom:20px}

/**********************************************
note : article view
name : 이경아
**********************************************/
/* 상단제목부분(커스텀) */
.article-view-header.custom {position:relative;padding:100px 50px;background-position:center;background-color:#333;background-repeat:no-repeat;background-size:cover;color:#fefefe;text-align:center}
.article-view-header.custom::before {content:'';position:absolute;left:0;right:0;top:0;bottom:0;background:rgba(0,0,0,.5)}
.article-view-header.custom .article-head-nav,
.article-view-header.custom .article-header-wrap,
.article-view-header.custom .article-head-info {position:relative;z-index:1}
.article-view-header.custom .info-text {float:inherit;display:table;margin-left:auto;margin-right:auto}
.article-view-header.custom .article-head-sub {padding-left:0}
.article-view-header.custom .article-head-sub::before {border:0}
.article-view-header.custom .article-head-nav .fa,
.article-view-header.custom .article-head-sub {color:#fefefe}
.article-view-header.custom .info-text li,
.article-view-header.custom .info-text li::before,
.article-view-header.custom .article-head-nav a {color:rgba(255,255,255,.65)}
@media screen and (max-width: 63.9375em) {
.mobile.template.view .article-view-header.custom {padding:17% 5% !important}
}
@media screen and (max-width: 39.9375em) {
.row .article-view-header.custom .article-header-wrap .article-head-title {font-size:25px}
.article-view-header.custom .article-head-sub {font-size:16px;font-weight:400}
}

/* banner */
#rollBanner-1.rolling-bn {padding:15px 0;background:rgba(0,0,0,.03);border:1px solid rgba(0,0,0,.08)}
#rollBanner-1.rolling-bn .slick-slide img {max-height:120px;width:300px}
#rollBanner-1.rolling-bn .auto-pager li[id*="slick-"] button[data-role] {width:12px;height:12px;background:#fefefe;border:1px solid rgba(0,0,0,.12)}
#rollBanner-1.rolling-bn .auto-pager li[id*="slick-"].slick-active button[data-role] {background:#e73f72;border:transparent}

/* sns공유버튼-네이버포스트 */
.button.post {background:#03cf5d}

/* 기사뷰상단네비게이션 */
#article-header-title.default .aht-columns.aht-options {width:200px}

/* 기사본문내용 */
.article-veiw-body.view-page p {font-size:22px;font-weight:300}

/**********************************************
note : footer
name : 이경아
**********************************************/
#user-footer .footer-menu .user-nav a > strong,
#com-nav .menu li.is-accordion-submenu-parent > a > strong,
#com-nav .menu li.nav-only a > strong,
#com-nav .menu li.is-accordion-submenu-parent ul.menu.nested li.is-submenu-item.current-page a {font-weight:500}
#user-footer.skin-1 .footer-menu .footer-columns {position:relative}
#user-footer.skin-1 .footer-menu .footer-columns > .inc_banner {position:absolute;right:0;bottom:20px}
#user-footer.skin-1 .footer-menu .footer-columns > .inc_banner > .banner_box > a > img {width:150px}

.box-skin.design8{}
.box-skin.design8 .header a{text-align:left;margin-bottom:0;background:#000;color:#fff;padding:5px 10px;}

#admin-wrap .edit-level1 {min-height:10px}





/**********************************************
note : 추천반대
**********************************************/
@-webkit-keyframes bobble{0%,to{-webkit-transform:rotate(0);transform:rotate(0)}25%{-webkit-transform:rotate(-30deg);transform:rotate(-30deg)}50%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}90%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}}
@keyframes bobble{0%,to{-webkit-transform:rotate(0);transform:rotate(0)}25%{-webkit-transform:rotate(-30deg);transform:rotate(-30deg)}50%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}90%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}}

#emoji-for {padding:1.25rem 0;margin:1.25rem 0;border-top:1px solid rgba(0,0,0,.08);border-bottom:1px solid rgba(0,0,0,.08);text-align:center}
#emoji-for::after {content:'';display:table;clear:both}
#emoji-for .emoji-btns {display:inline-block;width:100px}
#emoji-for button.emoji-btns,#emoji-for a.emoji-btns {cursor:pointer}
#emoji-for .emoji-btns::before {content:'';display:block;overflow:hidden;width:50px;height:40px;margin-left:auto;margin-right:auto;background:url('/image/emojis-for.png') no-repeat;background-size:250px auto}
#emoji-for .emoji-btns[class*="recom_"]::before {background-image:url('/image/goodnbad-for.png');background-size:100px auto}
#emoji-for button.emoji-btns::before,#emoji-for a.emoji-btns::before {margin-bottom:.5rem}
#emoji-for button.emoji-btns:hover::before,#emoji-for a.emoji-btns:hover::before {-webkit-animation:bobble .5s 2;animation:bobble .5s 2}
#emoji-for .emoji-btns.good::before {background-position:0 0}
#emoji-for .emoji-btns.warm::before {background-position:-50px 0}
#emoji-for .emoji-btns.sad::before {background-position:-100px 0}
#emoji-for .emoji-btns.angry::before {background-position:-150px 0}
#emoji-for .emoji-btns.want::before {background-position:-200px 0}
#emoji-for .emoji-btns.joy::before {background-position:0 -40px}
#emoji-for .emoji-btns.cool::before {background-position:-50px -40px}
#emoji-for .emoji-btns.sleep::before {background-position:-100px -40px}
#emoji-for .emoji-btns.dissa::before {background-position:-150px -40px}
#emoji-for .emoji-btns.lovely::before {background-position:-200px -40px}
#emoji-for .emoji-btns.shadow_good::before {background-position:0 -80px}
#emoji-for .emoji-btns.shadow_warm::before {background-position:-50px -80px}
#emoji-for .emoji-btns.shadow_sad::before {background-position:-100px -80px}
#emoji-for .emoji-btns.shadow_angry::before {background-position:-150px -80px}
#emoji-for .emoji-btns.shadow_want::before {background-position:-200px -80px}
#emoji-for .emoji-btns.line_good::before {background-position:0 -120px}
#emoji-for .emoji-btns.line_warm::before {background-position:-50px -120px}
#emoji-for .emoji-btns.line_sad::before {background-position:-100px -120px}
#emoji-for .emoji-btns.line_angry::before {background-position:-150px -120px}
#emoji-for .emoji-btns.line_want::before {background-position:-200px -120px}
#emoji-for .emoji-btns.recom_good::before {background-position:0 0}
#emoji-for .emoji-btns.recom_bad::before {background-position:-50px 0}
#emoji-for .emoji-btns.recom_line_good::before {background-position:0 -40px}
#emoji-for .emoji-btns.recom_line_bad::before {background-position:-50px -40px}
#emoji-for .emoji-btns .text {display:block;overflow:hidden;font-size:.8rem;line-height:1.25em;letter-spacing:-0.05em;color:rgba(0,0,0,.45);text-overflow:ellipsis;white-space:nowrap}
#emoji-for .emoji-btns .number {font-size:.75rem;font-style:normal;line-height:1em;letter-spacing:-0.025em;color:rgba(0,0,0,.85)}

@media screen and (max-width: 63.9375em) {
    .row #emoji-for .emoji-btns:hover::before,.row #emoji-for .gb-btns:hover::before {-webkit-animation:initial;animation:initial}
}

@media screen and (max-width: 39.9375em) {
    #emoji-for .emoji-btns {width:60px}
    #emoji-for .emoji-btns .text {font-size:.7rem}
}


/* tabs */
.emoji-tabs .tabs {border:none}
.emoji-tabs .tabs-title {text-align:center}
.emoji-tabs .tabs-title:first-child:last-child {width:100%}
.emoji-tabs .tabs-title:first-child:nth-last-child(2), .emoji-tabs .tabs-title:first-child:nth-last-child(2):first-child:nth-last-child(2) ~ .tabs-title {display:inline-block;width:50%}
.emoji-tabs .tabs-title:first-child:nth-last-child(3), .emoji-tabs .tabs-title:first-child:nth-last-child(3):first-child:nth-last-child(3) ~ .tabs-title {display:inline-block;width:33.33333%}
.emoji-tabs .tabs-title:first-child:nth-last-child(4), .emoji-tabs .tabs-title:first-child:nth-last-child(4):first-child:nth-last-child(4) ~ .tabs-title {display:inline-block;width:25%}
.emoji-tabs .tabs-title:first-child:nth-last-child(5), .emoji-tabs .tabs-title:first-child:nth-last-child(5):first-child:nth-last-child(5) ~ .tabs-title {display:inline-block;width:20%}
.emoji-tabs .tabs-title:first-child:nth-last-child(6), .emoji-tabs .tabs-title:first-child:nth-last-child(6):first-child:nth-last-child(6) ~ .tabs-title {display:inline-block;width:16.66667%}
.emoji-tabs .tabs-title:first-child:nth-last-child(7), .emoji-tabs .tabs-title:first-child:nth-last-child(7):first-child:nth-last-child(7) ~ .tabs-title {display:inline-block;width:14.28571%}
.emoji-tabs .tabs-title:first-child:nth-last-child(8), .emoji-tabs .tabs-title:first-child:nth-last-child(8):first-child:nth-last-child(8) ~ .tabs-title {display:inline-block;width:12.5%}
.emoji-tabs .tabs-title:first-child:nth-last-child(9), .emoji-tabs .tabs-title:first-child:nth-last-child(9):first-child:nth-last-child(9) ~ .tabs-title {display:inline-block;width:11.11111%}
.emoji-tabs .tabs-title:first-child:nth-last-child(10), .emoji-tabs .tabs-title:first-child:nth-last-child(10):first-child:nth-last-child(10) ~ .tabs-title {display:inline-block;width:10%}
.emoji-tabs .tabs-title > a {display:block;overflow:hidden;font-size:1rem;line-height:1em;letter-spacing:-0.05em;color:rgba(0,0,0,.45);background-color:rgba(0,0,0,.025);border-top:1px solid rgba(0,0,0,.08);border-right:1px solid rgba(0,0,0,.08);text-decoration:none;text-overflow:ellipsis;white-space:nowrap}
.emoji-tabs .tabs-title:first-child > a {border-left:1px solid rgba(0,0,0,.08)}
.emoji-tabs .tabs-title > a:focus,.emoji-tabs .tabs-title > a[aria-selected="true"] {font-weight:700;color:rgba(0,0,0,.9);background-color:#fefefe}
.emoji-tabs .tabs-content {border:none}
.emoji-tabs .tabs-content .tabs-panel {padding:0}
.emoji-tabs table {margin-bottom:0}
.emoji-tabs table td,.emoji-tabs table th {font-size:80%}
.emoji-tabs table td .label,.emoji-tabs table th .label {font-size:.688rem}

/* 배진희 / 965083 / 20200709 메인-new */
.auto-tit-pho-vid{padding:0 25px 0 5px;border-bottom:2px solid #222;font-weight:normal;background:url('/image/auto-tit-bg.png') right 5px center no-repeat;}
.box-skin.auto-five-box .header a,
.box-skin.auto-five-box .header strong{text-align:left;font-size:16px;}
.box-skin.auto-five-box .header>a.btm-Kor{background-image:url('/image/auto-five-box-bg.png')}
.box-skin.auto-five-box.line-top-btm .header a{border-top:2px solid #ccc;border-bottom:1px solid #ccc;padding:10px 0;}
.box-skin.horizontal{}
.box-skin.horizontal .header{float:left;width:20%;}
.box-skin.horizontal .content{float:right;width:75%;background:#fff;padding:20px;}






#user-footer.skin-9 .footer-menu .footer-columns {position:relative;padding-left: 20px; border-left: 1px solid #adadad;}
#user-footer.skin-9 .footer-menu .user-logo { border:none;padding-left:0}
#user-footer.skin-9 .footer-menu .footer-columns > .inc_banner {position:absolute;right:0;bottom:20px}
#user-footer.skin-9 .footer-menu .footer-columns > .inc_banner > .banner_box > a > img {width:150px}
#user-footer.skin-9 .footer-add { overflow: hidden;  padding: 10px 0; height: 200px;}
#user-footer.skin-9 .footer-add .user-address {float:left; position: relative; font-size: .8rem;  text-align: left;  color: rgba(0,0,0,.55);  letter-spacing: -.05em; width: 45%;}

#user-footer.skin-9 .footer-add .copy{position: absolute; font-size: 0.8em; top: 180px; bottom: 0;  color: rgba(0,0,0,.55);}



/* 임희은 / 983026 / 20200907 */
/* dl04 */
.auto-dl04 .auto-column {position:relative;padding-left:30px}
.auto-dl04 .auto-column::before,.auto-dl04 .auto-column::after {content:'';position:absolute}
.auto-dl04 .auto-column::before {z-index:1;border-left:1px solid #ccc;left:10px;top:0;bottom:0}
.auto-dl04 .auto-column::after {z-index:2;width:5px;height:5px;background:#bdc3c7;left:5px;top:30px;border:3px solid #fefefe;border-radius:50%;box-sizing:content-box}


/**********************************************
note : 캡챠
**********************************************/
.captcha-new {margin-bottom:.75rem}
.captcha-new::after {content:'';display:table;clear:both}
.captcha-new .captcha-label {display:block;margin:0 0 .5rem;padding:0;font-size:.8rem;font-weight:700;line-height:1em;letter-spacing:-0.05em;color:#303030}
.captcha-new > img {display:inline-block;margin-right:.5rem}
.captcha-new #captcha_image_audio_div, .captcha-new #captcha_image_audio_controls, .captcha-new #captcha_image_audio_controls ~ a[onclick] {display:inline-block}
.captcha-new #captcha_image_audio_controls > a, .captcha-new #captcha_image_audio_controls ~ a[onclick] {font-size:.9rem;color:rgba(0,0,0,.35);-webkit-transition:color .25s;transition:color .25s}
.captcha-new #captcha_image_audio_controls > a:hover, .captcha-new #captcha_image_audio_controls ~ a[onclick]:hover {color:rgba(0,0,0,.9)}
.captcha-new br,.captcha-new [style*="clear"] {display:none !important}
.captcha-new label[for="captcha_code"] + input[id*="captcha_"] {display:inline-block;max-width:102px;height:35px;margin-left:1rem;margin-bottom:0;font-size:.8rem;letter-spacing:-0.025em;box-shadow:none;vertical-align:middle}
@media screen and (max-width: 39.9375em) {
.captcha-new label[for="captcha_code"] + input[id*="captcha_"] {display:block;max-width:100%;margin-top:.25rem;margin-left:0}
}



/* 윤미정 / 1032372 / 20210223 */
#user-footer .footer-menu .footer-columns.user-logo {width: 145px;padding-right: 1.075rem;}



/* 홍경아 / 1039799 / 20210319 */
.banner_box-list {display:inline-block;width:100%;margin:30px 0 20px;}
.banner_box-list ul {margin: 0;}
.banner_box-list ul li {float: left;margin-left:20px;list-style: none; width:273px}
.banner_box-list ul li:first-child {margin-left:0;}

/* 배진희 / 1041857 / 20210326 */
.tabs-wrap.type-G.custom .tabs-navs{float:none;text-align:left;width:100%;}
.tabs-wrap.type-G.custom .tabs-navs .tabs-item::before{display:none;}
.tabs-wrap.type-G.custom .tabs-navs .tabs-item a{padding:0 1rem;font-size:1.2rem;font-weight:normal;color:#000 !important;}
.tabs-wrap.type-G.custom .tabs-navs .tabs-item:first-child a{padding-left:0;}
.tabs-wrap.type-G.custom .tabs-navs .tabs-item.active a{font-weight:bold;color:#c30f24 !important;}
.tabs-wrap.type-G.custom .tabs-navs .tabs-item.active a span{position:relative;}
.tabs-wrap.type-G.custom .tabs-navs .tabs-item.active a span:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background:#c30f24;}
.tabs-wrap.type-G.custom .tabs-panel{border-top:0;}

/* 이승현 / 1066695 / 20210621 */
.auto-ha04-2 .auto-column {float:left;width:345px;padding-top:25px;padding-left:25px;border-left:1px solid #e7e7e7}
.auto-ha04-2 .auto-column:first-child {width:calc(100% - 345px);padding:0;border:none}
.auto-ha04-2 .auto-column:nth-child(2) {padding-top:0}
.auto-ha04-2 .auto-column:nth-child(2n + 1) .auto-fontA {font-weight:700}


/**********************************************
note : 리뉴얼(이전) 스타일
name : 김지수
date : 2021-12-30
**********************************************/

/* box skin */
.box-skin .header > a, .box-skin .header > strong {font-size:18px;letter-spacing:-0.05em;font-weight:500;text-align:left}
.box-skin.idx--more .header > a[class*="btm-"] {position:relative;background:none}
.box-skin.idx--more .header > a[class*="btm-"]::before, .box-skin.idx--more .header > a[class*="btm-"]::after {content:'';position:absolute;z-index:1;top:50%;right:0;font-size:.813rem;font-weight:300;transform:translateY(-50%)}
.box-skin.idx--more .header > a[class*="btm-"]::before {content:'더보기';right:15px;color:rgba(0,0,0,.5)}
.box-skin.idx--more .header > a[class*="btm-"]::after {content:'+';font-size:1.063rem;font-weight:500;color:#c9273a}
.box-skin.idx--more.for-plus .header > a[class*="btm-"]::before {display:none}
.box-skin.idx--box {padding-top:1rem;border-top:1px solid #c30f24}
.box-skin.idx--box .header > a[class*="btm-"] {position:relative;background:none}
.box-skin.idx--box .header > a[class*="btm-"]::before {content:"\f105";position:absolute;z-index:1;top:50%;right:0;font:14px/1 FontAwesome;font-size:1.25rem;color:rgba(0,0,0,.35);transform:translateY(-50%)}
.box-skin.bg-gray {background-color:rgba(0,0,0,.035)}

/* 날개배너 */
.view-aside.left-wing {right:calc(100% + 20px)}
.view-aside.right-wing {left:calc(100% + 20px)}

/* 기사뷰 */
#article-view.renewal .user-snb {padding-right:20px}
#article-view.renewal .user-snb .user-snb-wrapper {padding:0}
#article-view.renewal .user-aside {width:320px;padding-left:20px}

/* 기사리스트 */
#user-section.renewal .user-snb {padding-right:20px}
#user-section.renewal .user-snb .user-snb-wrapper {padding:0}
#user-section.renewal .user-aside {width:320px;padding-left:20px}
#user-section.renewal .article-list-header {padding-top:1rem;border-top:3px solid #222}