@charset "utf-8";

/* reset */
html, body, p, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, table, th, td, form, fieldset, legend, input, textarea, button, select, menu, a {margin:0; padding:0}
body, input, textarea, select, button, table {font-family:'Noto Sans KR', roboto, sans-serif; font-weight:400; color:#333}
article, aside, footer, header, hgroup, menu, nav, section, address {display:block}
img, fieldset, button {border:0}
img {vertical-align:top}
svg {vertical-align:top}
menu, nav, ul, ol {list-style:none}
em, address, cite {font-style:normal}
mark {font-weight:bold; background:none}
input, select {vertical-align:middle}
a {color:#279adc; text-decoration:none}
a:hover {text-decoration:none}
table {border-collapse:collapse; border-spacing:none}
legend, hr, caption{display:none}
label, button {cursor:pointer}

/* common */
.blind {visibility:hidden; overflow:hidden; position:absolute; top:0; left:0; width:0; height:0; font-size:0; line-height:0}
.show {display:block !important}
.hide {display:none !important}
#tistorytoolbarid, .tistoryProfileLayerTrigger {display:none!important}

.center {text-align:center}

.spot_left { background: #f62459;}

.strong,
.gnb li>a:hover,
.spot_right .tit_subject:hover .text,
.tpl_search .list_category .cnt,
.article_desc .title_category,
.article_desc .sec_desc h3,
.article_desc .sec_desc ul li .strong,
.c_paging .num .selected,
aside .h_group a h3,
.s_category>ul>li>a,
.s_category>ul>li>a>.c_cnt,
.s_category>ul>li>ul>li>a,
.s_category>ul>li>ul>li>a>.c_cnt {color:#000}

/* Q.관리자 댓글 이름 색을 변경하고 싶어요. */
.tpl_cmt .cmt_list .rp_admin .author_name a,
.tpl_cmt .cmt_list .guest_admin .author_name a {color:#0fc300}

/* Q. 아이콘의 색을 바꾸고 싶어요. */
.c_paging .paging_nav svg path,
.side_menu .btn_top svg path {fill:#f62459}

/* Q. 배경색을 바꾸고 싶어요. */
.gnb li.active>a,
.c_tpl .h_group .admin a:hover,
.tpl_cmt .cmt_write .btn_area .btn_ok,
.article_desc .sec_desc h4.circle,
.tag_body li>a.cloud1,
.tag_body li>a.cloud5:hover,
.tag_body li>a.cloud4:hover,
.tag_body li>a.cloud3:hover,
.tag_body li>a.cloud2:hover,
.c_article .sec_tag .tag_desc a:hover,
.c_article .btn_cmt_open:hover,
.c_article .btn_cmt_open.active,
.m_btn_top a {background-color:#f62459}

/* layout */
body {background-color:#f7f7f7}
.wrap {width:100%}
.wrap:after {content:''; display:block; clear:both}
#container {position:relative; margin:0 auto; margin-top:15px; width:1070px}
#container:after {content:''; display:block; clear:both}
#content {float:left; width:806px}
aside {float:right; width:254px}
footer {clear:both; float:left; margin-top:50px}

/* sta */
.sta {height:50px; background-color:#fff}
.sta_wrap {position:absolute; top:12px; left:15px}

.designby {float:left}
.designby .logo_s {display:block; float:left; width:18px; height:26px; background-image:url(./images/logo_s.png)}
.designby .text {float:left; padding:5px 0 3px 5px; font-size:14px; color:#000}
.designby:hover .text {text-decoration:underline}
.twitter {float:left; margin-left:5px; padding:5px 0 3px; font-size:14px; color:#f62459}
.twitter:hover {text-decoration:underline}

/* gnb */
.gnb {margin:0 auto; margin-top:30px; margin-bottom:15px; width:1070px}
.gnb_wrap {width:1066px; height:36px; background-color:#fff; border:0px}
.gnb menu:after {content:''; display:block; clear:both}
.gnb li {float:left}
.gnb li>a {display:block; padding:9px 0 6px; width:90px; font-size:14px; font-weight:400; color:#000; text-align:center; line-height:21px}
.gnb li.active>a {font-weight:400; color:#fff; letter-spacing:-1px}
.gnb li.active>a:hover {text-decoration:none}

/* spot */
.spot {margin:0 auto; width:100%}
.spot:after {content:''; display:block; clear:both}

/* spot_left */
.spot_left {float:left; position:relative; width:100%; height:250px; border:0px}
.spot_left h1.text {display:block; padding-top:110px; text-align:center}
.spot_left h1.text a {display:inline-block; font-size:48px; font-weight:700; color:#fff; line-height:52px;}
.spot_left h1.logo {display:block; margin-top:52px; text-align:center}
.spot_left h1.logo a {display:inline-block; width:350px; height:156px; background-image:url(./images/logo.png)}berabiit

.spot_left .square_lt {position:absolute; top:-7px; left:-7px; width:8px; height:8px; background-color:#41b3f4; border:1px solid #000}
.spot_left .square_lb {position:absolute; left:-7px; bottom:-7px; width:8px; height:8px; background-color:#41b3f4; border:1px solid #000}
.spot_left .square_rt {position:absolute; top:-7px; right:-7px; width:8px; height:8px; background-color:#41b3f4; border:1px solid #000}
.spot_left .square_rb {position:absolute; right:-7px; bottom:-7px; width:8px; height:8px; background-color:#41b3f4; border:1px solid #000}

/* c_tpl */
.c_tpl {width:802px; background-color:#fff; border:0px}
.c_tpl:after {content:''; display:block; clear:both}
.c_tpl section {padding-left:15px; padding-right:15px}
.c_tpl .c_title {font-size:23px; font-weight:400; color:#000}

/* c_tpl - h_group */
.c_tpl .h_group {padding-top:18px}
.c_tpl .h_group h2 {font-size:24px; font-weight:700; color:#000; line-height:32px}
.c_tpl .h_group h2 a {font-size:24px; font-weight:700; color:#000}
.c_tpl .h_group h2 a:hover {text-decoration:underline}
.c_tpl .h_group .sub {display:block; font-size:14px; font-weight:400; color:#c4c4c4}

.c_tpl .h_group .admin {padding-top:8px}
.c_tpl .h_group .admin a {display:inline-block; padding:4px 7px; font-size:14px; font-weight:400; color:#000; background-color:#eceef2}
.c_tpl .h_group .admin a:hover {color:#fff}

/* c_tpl - search_none */
.c_tpl .search_none {display:block; margin-top:30px; padding-bottom:15px}
.c_tpl .search_none h3 {padding-bottom:5px; font-size:20px; font-weight:400; color:#000}
.c_tpl .search_none .desc li {margin-top:3px; font-size:14px; font-weight:400; color:#c4c4c4}

/* tpl_search */
.tpl_search {margin-top:30px; padding-bottom:15px}
.tpl_search .list_category:after {content:''; display:block; clear:both}

.tpl_search .list_category li {border-top:1px solid #e0e0e0}
.tpl_search .list_category li:first-child {border-top:0}
.tpl_search .list_category li>a {display:block; position:relative}
.tpl_search .list_category li>a:hover .tit_subject {text-decoration:underline}

.tpl_search .list_category .thmb {position:absolute; top:0; left:0; vertical-align:top}
.tpl_search .list_category .thmb_img {width:72px; height:72px}

.tpl_search .list_category .desc {padding-left:82px; height:72px}
.tpl_search .list_category .desc>span {display:inline-block; padding-top:24px; line-height:25px; vertical-align:top}
.tpl_search .list_category .tit_subject {display:block; overflow:hidden; width:512px; font-size:16px; color:#000; line-height:25px; text-overflow:ellipsis; white-space:nowrap}
.tpl_search .list_category .tit_subject img {display:none}
.tpl_search .list_category .tit_subject .new {font-size:14px; color:#f1631b}
.tpl_search .list_category .cnt {width:70px; font-size:14px}
.tpl_search .list_category .date {display:block; font-size:14px; font-weight:400;  color:#c4c4c4; line-height:17px; width:100px; text-align:right}

/* tpl_tag */
.tpl_tag .tag_desc {overflow:hidden}
.tpl_tag .tag_wrap {margin-right:-7px}
.tpl_tag .tag_wrap:after {content:''; display:block; clear:both}

/* tpl_cmt - cmt_list */
.tpl_cmt .cmt_list li {position:relative}
.tpl_cmt .cmt_list .author_date {font-size:14px; color:#c4c4c4}
.tpl_cmt .cmt_list .author_wrap {display:block; position:absolute; top:0; left:0; width:42px; height:42px; background-image:url(./images/author_wrap.png)}

.tpl_cmt .cmt_list p {margin-top:5px; font-size:14px; font-weight:400; color:#000; line-height:21px}

/* tpl_cmt - cmt_list - li */
.tpl_cmt .cmt_general>li {margin-top:20px; padding-left:50px}
.tpl_cmt .cmt_general>li:first-child {margin-top:0}
.tpl_cmt .cmt_reply {margin-top:12px; padding-top:12px; border-top:1px solid #e0e0e0}
.tpl_cmt .cmt_reply>li {margin-top:15px; padding-left:50px}
.tpl_cmt .cmt_reply>li:first-child {margin-top:0}

/* tpl_cmt - cmt_list - author_name */
.tpl_cmt .cmt_list .author_name:before {content:''; display:block; position:absolute; top:0; left:0; width:42px; height:42px; background-image:url(./images/img_guest.svg)}
.tpl_cmt .cmt_list .author_name {margin-bottom:2px; font-size:14px; font-weight:400; color:#000}
.tpl_cmt .cmt_list .author_name a {font-size:17px; font-weight:400; color:#279adc}
.tpl_cmt .cmt_list .author_name a:hover {text-decoration:underline}
.tpl_cmt .cmt_list .author_name img {position:absolute; top:0; left:0; width:42px; height:42px; background-color:#fff}

/* tpl_cmt - cmt_list - btn_area */
.tpl_cmt .cmt_list .btn_area {clear:both; margin-top:10px}
.tpl_cmt .cmt_list .btn_area:after {content:""; display:block; clear:both}

.tpl_cmt .cmt_list .btn_area a {display:block; float:left; margin-left:5px; font-size:13px; color:#c4c4c4}
.tpl_cmt .cmt_list .btn_area a:first-child {margin-left:0}
.tpl_cmt .cmt_list .btn_area a:hover {text-decoration:underline}

/* tpl_cmt - cmt_write */
.tpl_cmt .cmt_write {position:relative}
.tpl_cmt .cmt_write .author_area {padding-bottom:8px}
.tpl_cmt .cmt_write .txtarea_area {padding:10px; background-color:#fff; border:1px solid #bbb}
.tpl_cmt .cmt_write .btn_area {margin-top:7px}

.tpl_cmt .cmt_write .author_area:after {content:""; display:block; clear:both}
.tpl_cmt .cmt_write .txtarea_area:after {content:""; display:block; clear:both}
.tpl_cmt .cmt_write .btn_area:after {content:""; display:block; clear:both}

.tpl_cmt .cmt_write .input_group {float:left; margin-left:8px}
.tpl_cmt .cmt_write .input_group:first-child {margin-left:0}
.tpl_cmt .cmt_write .input_group:after {content:""; display:block; clear:both}

.tpl_cmt .cmt_write .input_group input {padding:5px; width:150px; height:20px; font-size:14px; font-weight:400; background-color:#fff; line-height:19px; border:1px solid #bbb; outline:none}
.tpl_cmt .cmt_write .input_group input:-ms-placeholder {color:#aaa; line-height:19px}
.tpl_cmt .cmt_write .input_group input::-moz-placeholder {color:#aaa; line-height:19px}
.tpl_cmt .cmt_write .input_group input:-webkit-placeholder {color:#aaa; line-height:19px}
.sec_cmt .cmt_write .input_group input:focus {border:1px solid #20bc01}

.tpl_cmt .cmt_write .toggle_secret {position:absolute; left:0; bottom:0}
.tpl_cmt .cmt_write .toggle_secret input {display:none}
.tpl_cmt .cmt_write .toggle_secret input[type=checkbox]:checked+label .ic_lock {background-image:url(./images/ic_lock.svg)}
.tpl_cmt .cmt_write .toggle_secret label .ic_lock {display:block; width:24px; height:24px; background-image:url(./images/ic_lock_open.svg)}

.tpl_cmt .cmt_write .txtarea_area textarea {overflow:hidden; float:left; width:100%; height:150px; font-size:14px; font-weight:400; line-height:22px; background:none; border:0; outline:none; resize:none}
.tpl_cmt .cmt_write .txtarea_area textarea:-ms-placeholder {color:#aaa; line-height:22px}
.tpl_cmt .cmt_write .txtarea_area textarea::-moz-placeholder {color:#aaa; line-height:22px}
.tpl_cmt .cmt_write .txtarea_area textarea:-webkit-placeholder {color:#aaa; line-height:22px}
.tpl_cmt .cmt_write .btn_area .btn_ok {float:right; padding:5px 12px; font-size:14px; font-weight:400; color:#fff; outline:none}

/* article_desc */
.article_desc .h_group {margin-bottom:22px; padding-bottom: 10px; border-bottom: 3px dotted #f7f7f7}
.article_desc .category {display:block; margin-bottom:2px}
.article_desc .category a:hover {text-decoration:underline}
.article_desc .title_category {font-size:14px; font-weight:400}
.article_desc .sub_category {margin-left:5px; font-size:14px; font-weight:400; color:#c4c4c4}

/* article_desc - style */
.article_desc .sec_desc p+h3 {margin-top:25px}
.article_desc .sec_desc h3 {font-size:25px; font-weight:400}

.article_desc .sec_desc h4 {font-size:17px; font-weight:600; color:#000}
.article_desc .sec_desc h3+h4 {margin-top:5px; color:#000}
.article_desc .sec_desc p+h4 {margin-top:15px}

.article_desc .sec_desc p {margin-top:15px; font-size:14px; font-weight:400; color:#333; line-height:26px}
.article_desc .sec_desc p:first-child {margin-top:15px; font-size:14px; font-weight:400; color:#000; line-height:26px}
.article_desc .sec_desc h3+p {margin-top:5px}
.article_desc .sec_desc h4+p {margin-top:5px}

.article_desc .sec_desc a {color:#f62459}
.article_desc .sec_desc a:hover {text-decoration:underline}

.article_desc .sec_desc pre {padding:10px; background:#f1f1f1}
.article_desc .sec_desc code {font-size:14px; font-weight:400; font-family:'Noto Sans KR', roboto, sans-serif; white-space:pre-wrap}
.article_desc .sec_desc blockquote {margin:0; margin-top:10px; padding:10px; background-color:#f5f5f5; font-size:14px; font-weight:400; color:#000}
.article_desc .sec_desc blockquote p:first-child {margin-top:0}

/* article_desc - custom */
.article_desc .sec_desc h3+h4.circle {margin-top:20px}
.article_desc .sec_desc h4.circle {margin-bottom:8px; width:36px; font-size:20px; font-weight:300; color:#fff; text-align:center; line-height:36px; border-radius:50%}

.article_desc .sec_desc ul li {margin-top:5px; line-height:18px}
.article_desc .sec_desc ul li .strong {font-size:14px; font-weight:400}
.article_desc .sec_desc ul li .text {margin-left:3px; font-size:14px; font-weight:400; color:#000}

/* sub_desc */
.sub_desc .h_group {text-align:center}

/* c_tag */
.c_tag .h_group {margin-bottom:13px}

.tag_body {padding-bottom:15px}
.tag_body ul:after {content:''; display:block; clear:both}
.tag_body li>a {float:left; margin-right:7px; margin-top:7px; padding:6px 8px 4px; font-size:14px; font-weight:400; line-height:20px}

.tag_body li>a.cloud5 {color:#000; background-color:#eceef2}
.tag_body li>a.cloud4 {color:#000; background-color:#eceef2}
.tag_body li>a.cloud3 {color:#fff; background-color:#8893a5}
.tag_body li>a.cloud2 {color:#fff; background-color:#8893a5}
.tag_body li>a.cloud1 {color:#fff}

.tag_body li>a.cloud5:hover {color:#fff}
.tag_body li>a.cloud4:hover {color:#fff}
.tag_body li>a.cloud3:hover {color:#fff}
.tag_body li>a.cloud2:hover {color:#fff}

/* c_guest */ 
.c_guest .h_group {margin-bottom:30px}

.guest_body {padding-bottom:15px}
.guest_body .cmt_list {padding-top:25px; padding-bottom:5px}

/* c_notice */
.c_notice .sec_notice {padding-bottom:15px}

/* c_article */
.c_article .sec_article .daum_like_wrapper {margin-top:30px}

/* c_article - sec_tag */
.c_article .sec_tag {clear:both; margin-top:22px; padding-top:20px; border-top:1px solid #e0e0e0}
.c_article .sec_tag .c_desc {padding-top:5px}
.c_article .sec_tag .tag_desc {font-size:0}
.c_article .sec_tag .tag_desc a {float:left; margin-right:7px; margin-top:7px; padding:6px 8px 4px; font-size:14px; font-weight:400; color:#000; background-color:#eceef2; line-height:19px}
.c_article .sec_tag .tag_desc a:hover {color:#fff}

/* c_article - sec_cmt */
.c_article .sec_cmt {clear:both; margin-top:20px; padding-top:20px; padding-bottom:15px; border-top:1px solid #e0e0e0}
.c_article .sec_cmt .c_desc {display:none; padding-top:12px}
.c_article .sec_cmt .c_desc.m_hide {display:block}
.c_article .cmt_list {padding-bottom:25px}

/* c_article - btn_cmt_open */
.c_article .btn_cmt_open {display:block; clear:both; margin-top:20px; padding:9px 0; width:772px; font-size:16px; font-weight:400; color:#000; text-align:center; background-color:#eceef2; outline:none}
.c_article .btn_cmt_open.m_show {display:none}
.c_article .btn_cmt_open:hover {color:#fff}
.c_article .btn_cmt_open.active {color:#fff}

/* c_paging */
.c_paging {margin-top:20px; text-align:center}
.c_paging .paging_nav {display:inline-block; padding:3px 10px 2px; font-size:0; vertical-align:top}
.c_paging .paging_nav svg {display:inline-block; width:24px; height:24px; background-size:24px 24px; vertical-align:top}
.c_paging .no-more-prev svg {opacity:.15}
.c_paging .no-more-prev svg path {fill:#000}
.c_paging .no-more-next svg {opacity:.15}
.c_paging .no-more-next svg path {fill:#000}

.c_paging a {font-size:23px; font-weight:400; color:#000}
.c_paging .num span {display:inline-block; padding:0 5px; font-size:24px; font-weight:300; color:#888; vertical-align:top}
.c_paging .num:hover span {text-decoration:underline}

/* side_menu */
.side_menu {position:absolute; top:0; left:-50px; padding:6px 0; background-color:#fff; border:0px}
.side_menu.fixed {position:fixed; top:20px; left:50%; margin-left:-585px}

.side_menu li {padding:2px 5px}
.side_menu li>a {display:block; padding:5px; width:16px; height:16px}
.side_menu .btn_top svg {display:block; width:16px; height:16px}

/* m_btn_top */
.m_btn_top {display:none; margin-top:12px}
.m_btn_top a {display:block; padding:6px 0; font-size:17px; font-weight:400; color:#fff; text-align:center}

/* aside */
aside .s_card {margin-top:12px; width:250px; background-color:#fff; border:0px}
aside .s_card:first-child {margin-top:0}
aside .g_ad {margin-top: 12px; background-color: #fff;}
aside .module {text-align:center; margin-top: 12px; background-color:#fff;}

aside .h_group {padding:8px 0; text-align:center}
aside .h_group h3 {display:inline-block; font-size:16px; font-weight:400; color:#000}
aside .h_group a {display:inline-block}
aside .h_group a h3 {font-size:16px; font-weight:400}
aside .h_group a:hover h3 {text-decoration:underline}

aside .sec_article {border-top:1px solid #e0e0e0}
aside .s_list {padding:8px 10px}
aside .s_list li {margin-top:6px}
aside .s_list li:first-child {margin-top:0}
aside .s_list a {overflow:hidden; display:block; font-size:14px; font-weight:400; color:#000; letter-spacing:-1px; text-overflow:ellipsis; white-space:nowrap}
aside .s_list a:hover {text-decoration:underline}

/* s_category */
.s_category a {line-height:20px; letter-spacing:-1px}
.s_category a:hover {text-decoration:underline}
.s_category a img {display:none}
.s_category a .new {font-size:14px; color:#f1631b}

/* s_category - 전체보기 */
.s_category>ul>li {padding-top:8px; text-align:center}
.s_category>ul>li>a {font-size:16px; text-align:center}

/* s_category - 카테고리/일상 */
.s_category>ul>li>ul {margin-top:8px}
.s_category>ul>li>ul>li {padding:8px 10px; text-align:left; border-top:1px solid #e0e0e0}
.s_category>ul>li>ul>li>a {display:block; font-size:14px; font-weight:400}

/* s_category - 카테고리/일상/근황 */
.s_category>ul>li>ul>li>ul>li>a {display:block; margin-top:5px; font-size:14px; font-weight:400; color:#000}
.s_category>ul>li>ul>li>ul>li>a>.c_cnt {color:#c4c4c4}

/* s_search */
.s_search .sec_search {position:relative; padding:7px 32px 6px 7px}
.s_search .sec_search:after {content:''; display:block; clear:both}

.s_search .input_text {float:left; width:100%; font-size:14px; font-weight:400; color:#000; line-height:19px; border:0; outline:none}
.s_search .input_text:-ms-placeholder {color:#aaa; line-height:19px}
.s_search .input_text::-moz-placeholder {color:#aaa; line-height:19px}
.s_search .input_text:-webkit-placeholder {color:#aaa; line-height:19px}
.s_search .submit {display:block; position:absolute; top:5px; right:3px; width:24px; height:24px; background:none; border:0}

/* s_rct_cmt */
.s_rct_cmt li {padding:8px 10px; border-top:1px solid #e0e0e0}
.s_rct_cmt li:first-child {border-top:0}
.s_rct_cmt li>a {display:block; color:#000; letter-spacing:-1px}
.s_rct_cmt li>a:hover .title {text-decoration:underline}

.s_rct_cmt .title {overflow:hidden; display:block; font-size:14px; font-weight:400; color:#000; line-height:21px; text-overflow:ellipsis; white-space:nowrap}
.s_rct_cmt .sub {overflow:hidden; display:block; margin-top:2px; font-size:13px; font-weight:400; color:#c4c4c4; line-height:15px; letter-spacing:0; text-overflow:ellipsis; white-space:nowrap}

/* s_visit */
.visit_total {padding:20px 10px; font-size:20px; font-weight:400; color:#000; text-align:center}
.visit_all {padding:6px 10px; font-size:14px; font-weight:400; color:#c4c4c4; text-align:center; border-top:1px solid #e0e0e0}

/* footer */
footer {width:100%; background-color:#fff}
.footer_wrap {margin:0 auto; padding:35px 0; width:1070px; text-align:center}
.footer_wrap p {font-size:17px; font-weight:400; color:#000; line-height:26px}
.footer_wrap p+p {margin-top:10px}
.footer_wrap address {margin-top:5px}