@charset "UTF-8";

/* reset */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, textarea, p, blockquote, th, td, input, select, textarea, button {
  margin: 0;
  padding: 0;
  outline: none
}
fieldset, img { border: 0 none }
dl, ul, ol, menu, li { list-style: none }
blockquote, q { quotes: none }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none }
input, select, textarea, button { vertical-align: middle }
input::-ms-clear { display: none }
button { border: 0 none; background-color: transparent; cursor: pointer }
body { background: #fff }
body, th, td, input, select, textarea, button {
  font-size: 14px;
  line-height: 1.5;
  font-family: Pretendard-Regular, sans-serif;
  color: #666
}

/* links */
a { color: #333; text-decoration: none }
a:active, a:hover { text-decoration: underline }
a:active { background-color: transparent }

address, caption, cite, code, dfn, em, var { font-style: normal; font-weight: normal }

#tistorytoolbarid { display: none }

/* global */
#dkIndex {
  overflow: hidden; position: absolute; left: -9999px; width: 0; height: 1px; margin: 0; padding: 0
}
.ir_pm { display: block; overflow: hidden; font-size: 0px; line-height: 0; text-indent: -9999px }
.ir_wa { display: block; overflow: hidden; position: relative; z-index: -1; width: 100%; height: 100% }
.screen_out { overflow: hidden; position: absolute; width: 0; height: 0; line-height: 0; text-indent: -9999px }
.show { display: block }
.hide { display: none }
.emph_t { color: #3db39e }

.cont_skin { margin-top: 80px }
.article_skin { width: 820px; margin: 0 auto }
.txt_bar { display: inline-block; width: 1px; height: 9px; margin: 0 5px; background-color: #ebebeb }
.img_profile { float: left; margin-right: 16px; border-radius: 50px }
.ico_focused { outline: 1px dotted #000; outline: -webkit-focus-ring-color auto 5px }

/* common sprite */
.ico_skin {
  display: inline-block; overflow: hidden; font-size: 0; line-height: 0;
  background: url("images/ico_skin.gif") 0 0 no-repeat; text-indent: -9999px
}

/* header */
.wrap_skin { position: relative }
.area_head {
  position: fixed; top: 0; left: 0; z-index: 10; width: 100%; height: 80px;
  border-bottom: 1px solid #ebebeb; background-color: rgba(255,255,255,.95)
}
.area_head:after { display: block; visibility: hidden; height: 0; font-size: 0; clear: both; content: '' }
.area_head .area_profile { position: relative; float: left; padding: 15px 0 0 30px }
.area_head .area_profile .link_profile { float: left }
.area_head .area_profile .info_profile { float: left; max-width: 270px }
.area_head .btn_name { margin-top: 5px; font-weight: bold; margin-bottom: 2px }
.area_head .ico_name { width: 10px; height: 6px; margin: 7px 0 0 6px; vertical-align: top }
.area_head .txt_condition {
  width: 100%; font-size: 12px; color: #aaa; white-space: nowrap; text-overflow: ellipsis; overflow: hidden
}
.area_head .list_name {
  display: none; position: absolute; top: 44px; left: 92px; border: 1px solid #dcdcdc;
  border-radius: 2px; background-color: #fff
}
.area_head .on .list_name { display: block; width: 112px; padding: 13px 0 2px }
.area_head .on .ico_name { background-position: 0 -632px; }
.area_head .link_name { display: block; padding-left: 15px; margin-bottom: 7px; text-decoration: none; color: #666 }
.area_head .link_name:hover { text-decoration: underline; color: #3db39e }
.area_head .box_division { padding-top: 13px; border-top: 1px solid #f4f4f4; margin-top: 9px }

.area_menu { position: fixed; right: 15px; top: 21px; z-index: 31 }
.area_menu .area_search { display: inline-block; margin: 0 2px; border: 1px solid #ddd; border-radius: 3px; vertical-align: top }
.area_menu .on.area_search { border: 1px solid #aaa }
.area_menu .btn_search { width: 40px; height: 36px }
.area_menu .on .btn_search { display: none }
.area_menu .ico_search { width: 16px; height: 16px; margin-top: -1px; background-position: 0 -25px; vertical-align: middle }
.area_menu .frm_search { display: none; overflow: hidden; width: 210px; height: 36px }
.area_menu .on .frm_search { display: block }
.area_menu .lab_search { float: left; width: 16px; height: 16px; margin: 10px 9px 0 12px; background-position: 0 -400px }
.area_menu .tf_search { float: left; width: 150px; margin-top: 9px; border: 0 none; vertical-align: top; color: #333 }

.area_menu .area_navi { display: inline-block; position: relative; margin: 0 2px 0 3px }
.area_menu .btn_cate {
  width: 160px; height: 38px; border: 1px solid #3db39e; border-radius: 3px;
  font-weight: bold; font-size: 12px; line-height: 38px; color: #3db39e; padding: 0 1px 0 5px
}
.btn_close { display: none }
.area_menu .ico_cate { width: 10px; height: 6px; margin: -2px 0 0 53px; background-position: 0 -50px; vertical-align: middle }
.area_menu .list_cate {
  display: none; position: absolute; top: 37px; left: 0; width: 158px; padding: 18px 0 10px;
  border: 1px solid #3db39e; border-radius: 0 0 3px 3px; background-color: #fff
}
.area_menu .on .list_cate { display: block }
.area_menu .on .ico_cate { background-position: 0 -658px; }
.area_menu .link_cate { display: block; padding-left: 17px; margin-bottom: 12px; font-size: 12px; color: #333 }
.area_navi .list_cate ul li { line-height: 18px }
.area_navi .list_cate ul li a {
  display: block; padding-left: 17px; margin-bottom: 12px; font-size: 12px; color: #333; height: 17px
}
.area_navi .list_cate ul li.selected>a, .area_navi .list_cate ul li a:hover { text-decoration: underline; color: #3db39e }
.area_navi .list_cate .c_cnt, .area_navi .list_cate img { display: none }
.area_navi .list_cate ul li ul li ul { padding-bottom: 6px; margin-top: -6px }
.area_navi .list_cate ul li ul li ul li { color: #b4b4b4; padding-left: 21px }
.area_navi .list_cate ul li ul li ul li a { padding-left: 0; margin-bottom: 6px; font-size: 12px; color: #666 }
.area_navi .list_cate ul li ul li ul li a::before { content: '· ' }
.area_navi .list_cate .menu_profile { display: none }

.area_list .tit_category {
  position: fixed; top: 1px; width: 50%; left: 25%; line-height: 80px; text-align: center;
  text-overflow: ellipsis; overflow: hidden; white-space: nowrap; z-index: 21
}
.tit_category .link_category { font-size: 20px; font-weight: bold; color: #3db39e }
.tit_category .link_category:hover { text-decoration: none }

.dimmed_layer { position: fixed; top: 0; bottom: 0; left: 0; right: 0; display: none; z-index: 30 }
.area_head .btn_menu { display: none }

/* footer */
.wrap_etc { padding-top: 48px; padding-bottom: 5px; border-top: 1px solid #ebebeb }
.wrap_etc .inner_aside { overflow: hidden; width: 820px; margin: 0 auto }
.wrap_etc .box_aside { float: left; position: relative; width: 190px; min-height: 135px; margin: 0 20px 33px 0 }
.wrap_etc .lst { margin-right: 0 }
.wrap_etc .list_board { padding-top: 8px }
.wrap_etc .list_board li { margin-bottom: 8px }
.wrap_etc .link_board {
  display: block; overflow: hidden; width: 170px; font-size: 12px; color: #aaa; white-space: nowrap; text-overflow: ellipsis
}
.wrap_etc .list_total dt { font-weight: bold }
.wrap_etc .list_total dd { font-weight: bold; font-size: 22px }
.wrap_etc .list_visitor { overflow: hidden; margin-top: 8px; font-size: 12px }
.wrap_etc .list_visitor dt { float: left; color: #aaa }
.wrap_etc .list_visitor dd { float: right; color: #aaa }
.wrap_etc .link_more {
  position: absolute; top: 3px; right: 10px; font-size: 12px; text-decoration: underline; color: #aaa
}
.wrap_etc .list_tag { overflow: hidden; margin-top: 10px }
.wrap_etc .list_tag li { float: left }
.wrap_etc .list_tag .link_tag {
  display: block; height: 24px; padding: 0 10px; margin: 0 6px 6px 0; border-radius: 26px;
  font-size: 11px; line-height: 26px; border: 1px solid #f0f0f0; background-color: #f0f0f0; color: #999;
  max-width: 65px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;
}
.wrap_etc .list_tag .link_tag:hover { border: 1px solid #3db39e; background-color: #fff; text-decoration: none; color: #3db39e }

.tt-calendar { width: 176px !important; border-collapse: collapse; border-spacing: 0; margin-left: -8px }
.tt-calendar .cal_month { height: 20px; font-weight: bold; text-align: center; margin-bottom: 5px }
.tt-calendar .cal_month a { font-weight: bold; color: #666 }
.tt-calendar .cal_month a:first-child, .tt-calendar .cal_month a:last-child {
  height: 17px; padding: 0 10px; vertical-align: top; color: #ccc
}
.tt-calendar td, th { height: 17px; vertical-align: middle; width: 14.28%; text-align: center; font-size: 10px }
.tt-calendar thead th { color: #ccc; margin-bottom: 2px }
.tt-calendar tbody td { color: #aaa }
.tt-calendar tbody td .cal_click { font-weight: bold; color: #777 }

.wrap_etc .tbl_calendar { border-collapse: collapse; border-spacing: 0; width: 185px; margin-top: 5px }
.wrap_etc .tbl_calendar td { height: 17px; vertical-align: middle }
.wrap_etc .col_day { width: 14.28% }
.wrap_etc .tit_week { font-weight: normal; font-size: 10px; text-align: center; color: #ccc }
.wrap_etc .link_day { display: block; font-size: 10px; text-align: center; color: #aaa }
.wrap_etc .day_event { font-weight: bold; color: #777 }
.wrap_etc .list_keep { margin-top: 10px }
.wrap_etc .list_keep li { overflow: hidden; margin-bottom: 8px; font-size: 12px; color: #aaa }
.wrap_etc .link_keep { font-size: 12px; color: #aaa }

.area_foot { height: 50px; font-size: 12px; line-height: 50px; text-align: center; background-color: #f0f0f0; color: #aaa }

/* paging */
.area_paging_simple { display: none }
.area_paging { margin: 30px 0 93px; text-align: center }
.area_paging .inner_paging { display: inline-block; overflow: hidden }
.area_paging .ico_skin { float: left; width: 24px; height: 24px; margin-top: 6px }
.area_paging .li_prev { margin-right: 20px; background-position: 0 -100px }
.area_paging .link_prev { margin-right: 20px; background-position: 0 -100px }
.area_paging .link_next { margin-left: 20px; background-position: 0 -150px }
.area_paging .no-more-prev { background-position: 0 -75px }
.area_paging .no-more-next { background-position: 0 -125px }
.area_paging .interword { float: left; padding: 6px 12px 0 }
.area_paging .link_page { float: left }
.area_paging .link_page span { display: block; padding: 9px 14px 5px; color: #666 }
.area_paging .link_page span.selected {
  border-radius: 3px; background-color: #3db39e; color: #fff; font-weight: bold; padding: 8px 14px 6px;
}

/* view */
.skin_view .area_title {
  margin-bottom: 29px; padding: 68px 0 45px; border-bottom: 1px solid #ebebeb; text-align: center
}
.skin_view .area_title a { text-decoration: none }
.skin_view .tit_category a { font-weight: bold; color: #3db39e }
.skin_view .tit_post { margin-top: 7px; font-size: 40px; font-weight: bold; color: #000; line-height: 50px }
.skin_view .tit_post a { color: #000 }
.skin_view .txt_detail { display: block; margin-top: 20px; font-size: 12px; color: #aaa }
.skin_view .txt_detail .txt_bar { margin: 0 7px 0 5px; }
.skin_view .txt_detail .my_edit { display: none }
.skin_view .my_post .my_edit { display: inline-block }
.skin_view .link_detail { font-size: 12px; color: #aaa }
.skin_view .link_detail:hover { text-decoration: none }

.skin_view .area_view { padding: 20px 0; font-size: 16px; }
.skin_view .area_view p { font-size: 16px; line-height: 28px; }
.skin_view .area_view a { color: #3db39e }

.skin_view .area_view h1,
.skin_view .area_view h2,
.skin_view .area_view h3,
.skin_view .area_view h4 {
  line-height: 1.2em; margin: 1.5em auto 1em
}
.skin_view .area_view h1 { font-size: 28px; }
.skin_view .area_view h2{
  font-size:24px; margin-bottom:2px; margin-top:15px; padding-left:.75rem; font-weight:600 !important;
  line-height:1.9; word-break:normal; word-wrap:break-word; color:rgb(8,8,8);
  background: linear-gradient(to right, #f8b7b7 50%, #f94646);
  border-radius:15px 15px 0 0; border-left:0; border-bottom:3px solid #e93838;
}
.skin_view .area_view h3 { font-size: 20px; }
.skin_view .area_view h4 { font-size: 16px; }

.skin_view .area_view ul, .skin_view .area_view ol { margin: 0 auto 32px; padding: 0 0 0 10px; }
.skin_view .area_view ul li, .skin_view .area_view ol li { margin-left: 24px; margin-bottom: 10px; }
.skin_view .area_view ul li { list-style: disc }
.skin_view .area_view ol li { list-style: decimal }

.skin_view .area_view blockquote {
  padding: 10px 20px; margin: 0 auto 28px; border-left: 5px solid #eee
}
.skin_view .area_view blockquote, .skin_view .area_view blockquote p { font-size: 18px; line-height: 30px }
.skin_view .area_view blockquote ol:last-child,
.skin_view .area_view blockquote ul:last-child,
.skin_view .area_view blockquote p:last-child { margin-bottom: 0 }

.skin_view .area_view pre {
  background-color: #F6F7F8; margin: 28px auto; word-wrap: break-word;
  font-family: Menlo, Consolas, Monaco, monospace; font-size: 14px; line-height: 20px
}
.skin_view .area_view pre code.hljs { padding: 16px; }
.skin_view .area_view iframe { max-width: 100% }
.skin_view .area_view img { max-width: 100%; height: auto }
.skin_view .area_view .imageblock { width: auto !important; height: auto !important }

.skin_view .area_view .protected_form {
  text-align: center; padding: 100px 0 150px; border-bottom: 1px solid #ebebeb; margin-bottom: -20px
}
.skin_view .area_view .protected_form input {
  -webkit-appearance: none; padding: 0 15px; border: 1px solid #eee; height: 38px; line-height: 38px; font-size: 12px; box-sizing: border-box;
}
.skin_view .area_view .protected_form button {
  border-radius: 4px; font-size: 12px; line-height: 38px; background-color: #3db39e; color: #fff; font-weight: bold; padding: 0 16px
}

.skin_view .area_etc { overflow: hidden; min-height: 29px; margin-top: 20px }
.skin_view .area_etc .list_tag { float: left; margin-top: 5px; font-weight: bold; }
.skin_view .list_tag .tit_tag { float: left; margin-right: 8px; font-weight: bold; font-size: 12px; color: #3db39e }
.skin_view .list_tag .desc_tag { float: left; margin-right: 2px; font-weight: bold; font-size: 12px; color: #aaa; max-width: 630px }
.skin_view .list_tag .desc_tag a { color: #aaa }
.skin_view .list_tag .link_tag { font-weight: bold; font-size: 12px; color: #aaa }
.skin_view .list_tag .link_tag:hover { text-decoration: none }

.skin_view .another_category { overflow: hidden; width: 100%; margin: 90px 0 0; border: 0; padding: 0 }
.skin_view .another_category h4 {
  float: left; width: 100%; padding: 0 0 7px !important; border-bottom: 1px solid #eee !important;
  font-weight: normal; font-size: 14px !important; line-height: 1.5; color: #666 !important
}
.skin_view .another_category h4 a { color: #3db39e !important; font-weight: bold }
.skin_view .another_category table { float: left; width: 100%; margin-top: 15px !important }
.skin_view .another_category table tr { float: left; width: 50%; margin-bottom: 8px; }
.skin_view .another_category table tr:nth-child(even) th { padding-left: 10px !important }
.skin_view .another_category table th { width: 100%; font-size: 12px; color: #aaa; padding: 0 !important }
.skin_view .another_category table th a {
  overflow: hidden; max-width: 255px; font-size: 12px; white-space: nowrap; text-overflow: ellipsis;
  color: #666 !important; border: 0 !important; display: inline-block; float: left
}
.skin_view .another_category table th a.current { text-decoration: underline !important }
.skin_view .another_category table th span { font-size: 12px }
.skin_view .another_category table td { display: none }

/* reply */
.skin_view .area_reply { margin-top: 40px }
.area_reply .tit_reply { font-weight: normal }
.area_reply .btn_reply { font-weight: bold; line-height: 18px; color: #3db39e }
.area_reply .btn_reply .ico_reply { width: 8px; height: 5px; margin: 5px 0 0 3px; background-position: 0 -425px; vertical-align: top }
.btn_reply.on .ico_reply { background-position: 0 -450px }
.area_reply .reply_write { position: relative; margin-top: 5px }
.area_reply .lab_write { position: absolute; top: 13px; left: 16px; font-size: 12px }
.area_reply .on_box .lab_write { display: none }
.area_reply .tf_reply {
  width: 820px; height: 102px; padding: 13px 15px 10px; border: 1px solid #eee; font-size: 12px; resize: none; box-sizing: border-box
}
.area_reply .reply_writer { margin-top: 10px; position: relative; height: 36px }
.area_reply .writer_info { float: left }
.area_reply .writer_info .info_name { display: inline-block; position: relative; margin-right: 8px }
.area_reply .writer_info .info_pw { display: inline-block; position: relative }
.area_reply .writer_info .lab_info { position: absolute; top: 10px; left: 16px; font-size: 12px }
.area_reply .on_box .lab_info { display: none }
.area_reply .writer_info .inp_info {
  width: 120px; height: 36px; padding: 0 15px; border: 1px solid #eee; font-size: 12px; box-sizing: border-box
}
.area_reply .writer_info .inp_info::-webkit-input-placeholder { padding-top: 2px }
.area_reply .writer_check { position: absolute; right: 70px }
.area_reply .writer_check .check_secret {
  display: inline-block; position: relative; height: 36px; margin-right: 18px; line-height: 36px
}
.area_reply .writer_check .inp_secret { display: none }
.area_reply .writer_check .lab_secret { position: relative; padding-left: 20px; font-size: 12px; cursor: pointer }
.area_reply .writer_check .ico_check {
  position: absolute; top: -2px; left: 0; width: 16px; height: 16px; background-position: 0 -500px
}
.area_reply .writer_check .inp_secret:checked+.lab_secret .ico_check { background-position: 0 -525px }
.area_reply .writer_check .inp_secret:focus+.lab_secret .ico_check { outline: 1px dotted #000; outline: -webkit-focus-ring-color auto 5px }
.area_reply .on .ico_check { background-position: 0 -525px }
.area_reply .writer_btn { position: absolute; right: 0 }
.area_reply .writer_btn .btn_enter {
  width: 70px; height: 36px; border-radius: 4px; font-size: 12px; line-height: 38px; background-color: #3db39e; color: #fff; font-weight: bold
}
.area_reply .btn_replymore {
  display: none; width: 100%; height: 42px; margin-top: 3px; border-top: 1px solid #eee; font-size: 12px; line-height: 44px; color: #aaa
}
.on .btn_replymore { display: block }
.area_reply .list_reply { margin-bottom: 20px; margin-top: 5px; border-top: 1px solid #e0e0e0; }
.on .list_reply { display: block; margin-bottom: 18px }
.area_reply .list_reply li.tt_more_preview_comments_wrap { padding: 10px 20px }
.area_reply .list_reply .tt_more_preview_comments_text { font-size: 12px; color: #aaa }
.area_reply .list_reply li {
  overflow: hidden; position: relative; padding: 23px 20px 24px; border-bottom: 1px solid #eee
}
.area_reply .list_reply li:hover { background-color: #fcfcfc }
.area_reply .list_reply .my_reply { background-color: #fcfcfc }
.area_reply .list_reply .re_reply { padding-left: 86px }
.area_reply .reply_content { float: left }
.area_reply .list_reply .img_profile { margin-top: 2px }
.area_reply .tit_nickname {
  display: block; overflow: hidden; max-width: 515px; margin: 4px 5px 0 0; font-weight: bold; color: #333; white-space: nowrap
}
.area_reply .my_reply .tit_nickname { color: #3db39e }
.area_reply .tit_nickname:hover { text-decoration: none }
.area_reply .ico_secret { width: 10px; height: 12px; margin-top: 4px; background-position: 0 -475px; vertical-align: top; display: none }
.area_reply .rp_secret .ico_secret { display: inline-block }
.area_reply .txt_reply { display: block; width: 704px; margin-top: 3px; font-size: 12px }
.area_reply .re_reply .txt_reply { display: block; width: 627px; margin-top: 3px; font-size: 12px }
.area_reply .txt_date { display: block; margin-top: 7px; font-size: 12px; color: #aaa }
.area_reply .btn_replymenu { display: none }
.area_reply .list_reply li .my_edit { display: none; position: absolute; top: 27px; right: 16px }
.area_reply .list_reply li:hover .my_edit { display: block }
.area_reply .my_edit .link_edit { margin: 0 2px; font-size: 12px; color: #3db39e }
.area_reply .my_edit .link_edit:hover { text-decoration: none }
.area_reply .hiddenComment .tit_nickname { display: none }
.area_reply .hiddenComment .txt_reply { font-weight: bold; font-size: 14px }

/* list */
.list_content { padding: 35px 0; border-bottom: 1px solid #ebebeb }
.list_content::after { content: ''; clear: both; display: block }
.list_content .thumbnail_post { float: right; height: 148px; width: 148px; margin: 4px 0 4px 30px }
.list_content .link_post { display: block; overflow: hidden; text-decoration: none }
.list_content .link_post:hover .tit_post { text-decoration: underline; color: #3db39e }
.list_content .tit_post {
  display: block; font-weight: normal; font-size: 28px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap
}
.list_content .txt_post {
  display: -webkit-box; display: -ms-flexbox; display: box; overflow: hidden; max-height: 80px; margin-top: 1px;
  font-size: 16px; line-height: 28px; color: #666; vertical-align: top; word-break: break-all;
  -webkit-box-orient: vertical; -webkit-line-clamp: 3
}
.list_content .detail_info { margin-top: 16px; font-size: 12px; color: #aaa; }
.list_content .detail_info .link_cate { font-size: 12px; text-decoration: none; color: #3db39e }

/* guestbook */
.skin_visitor { padding-bottom: 40px; }
.skin_visitor .area-reply { padding-top: 40px; }
.skin_visitor .area_reply .list_reply { display: block; margin-top: 30px; border-top: 1px solid #eee }
.skin_visitor .area_reply .reply_write { margin-top: 32px }
.skin_visitor .area_reply .ico_secret { background-position: 0 -600px }

/* tags */
.skin_tag .list_tag { overflow: hidden; padding: 30px 0 90px }
.skin_tag .list_tag li { float: left; margin: 0 10px 10px 0 }
.skin_tag .link_tag {
  display: block; height: 32px; padding: 0 13px; border-radius: 34px; line-height: 34px;
  border: 1px solid #f0f0f0; background-color: #f0f0f0; font-weight: 100; color: #666
}

/* responsive ≤ 820 */
@media only screen and (max-width:820px){
  body, th, td, input, select, textarea, button, p, span{
    font-family: applesdgothicneo-ultralight; font-weight: 100
  }
  .ico_skin { background: url("images/ico_skin_320.png") 0 0 no-repeat }
  .img_profile { width: 40px; height: 40px; border-radius: 40px }

  .area_head { z-index: 20; height: 60px }
  .area_head .area_profile { overflow: hidden; float: none; padding: 10px 65px 0 15px }
  .area_head .area_profile .info_profile { max-width: 180px }
  .area_head .img_profile { margin-right: 8px }
  .area_list .tit_category { line-height: 60px }
  .area_list .tit_category .link_category { font-size: 16px; font-family: applesdgothicneo-semibold; font-weight: bold }
  .area_head .on .list_name { display: none }
  .area_head .btn_name { margin-top: 2px; color: #333; font-family: applesdgothicneo-bold; margin-bottom: 0px }
  .area_head .ico_name { display: none }
  .area_head .txt_condition { overflow: hidden; width: auto; line-height: 16px }

  .area_menu { display: none; right: 0; top: 0; bottom: 0; overflow-y: auto; overflow-x: hidden; width: 200px; background-color: #fff }
  .area_menu .area_search { display: none; width: 168px; height: 30px; margin: 15px 0 0 15px; border: 1px solid #dcdcdc; border-radius: 31px }
  .area_menu .frm_search { width: 168px; height: 30px }
  .area_menu .lab_search { margin: 8px 0 0 16px; background-position: -70px -110px }
  .area_menu .tf_search { width: 115px; margin: 7px 0 3px 8px; outline: none }
  .dimmed_layer { background-color: #000; opacity: 0.7 }
  .area_menu .btn_search { display: none }
  .area_menu .area_navi { display: block; position: static; margin: 0 }
  .area_head .btn_menu {
    display: block; overflow: hidden; position: absolute; right: 15px; top: 0; width: 40px; height: 35px; margin-top: 13px; border: 0 none
  }
  .area_head .ico_menu { display: block; width: 40px; height: 31px; margin: 0; background-position: 0 -80px; text-indent: 0 }
  .area_menu .btn_cate { display: none }
  .area_menu .list_cate { position: static; width: 200px; padding: 13px 0 15px; border: 0 none; border-radius: 0 }

  .area_navi .list_cate ul li { line-height: 18px }
  .area_navi .list_cate ul li a {
    margin-bottom: 0; padding: 7px 0 15px 30px; font-size: 15px; line-height: 22px; font-family: applesdgothicneo-semibold; font-weight: bold
  }
  .area_navi .list_cate ul li ul li a { padding: 4px 0 15px 30px }
  .area_navi .list_cate ul li ul li ul { padding-bottom: 3px; margin-top: -3px }
  .area_navi .list_cate ul li ul li ul li { padding-left: 0; list-style: none; margin-bottom: 1px }
  .area_navi .list_cate ul li ul li ul li a {
    margin-bottom: 0; padding: 4px 0 11px 37px; font-size: 15px; font-family: applesdgothicneo-ultralight; font-weight: normal;
  }
  .area_navi .list_cate ul li ul li ul li a::before { content: '· ' }
  .area_navi .list_cate .menu_profile { display: block; margin-top: 14px; padding-top: 20px; border-top: 1px solid #e5e5e5 }

  .btn_close { position: fixed; right: 210px; top: 11px; width: 30px; height: 30px; z-index: 31 }
  .on .btn_close { display: block }
  .ico_close { display: inline-block; width: 18px; height: 18px; background-position: -50px -110px; vertical-align: middle }

  .wrap_etc { display: none }
  .area_foot { height: 42px; font-size: 11px; line-height: 42px; color: #999 }
  .area_foot .emph_t { font-weight: bold; color: #999; font-family: applesdgothicneo-bold }

  .area_paging_list { display: none }
  .area_paging_simple { display: block }
  .area_paging { padding: 20px 0 10px; margin: 0; position: static }
  .area_paging .inner_paging { display: block; padding: 0 20px }
  .area_paging .inner_paging a { display: block; line-height: 20px; font-size: 15px }
  .area_paging .inner_paging a.link_prev { float: left }
  .area_paging .inner_paging a.link_next { float: right }
  .area_paging .ico_skin { width: 10px; height: 18px; margin-top: 0 }
  .area_paging .ico_prev { float: left; margin-right: 11px; background-position: -130px -80px }
  .area_paging .ico_next { float: right; margin-left: 11px; background-position: -130px -100px }
  .area_paging .no-more-prev, .area_paging .no-more-next { text-decoration: none; color: #999 }
  .area_paging .no-more-prev .ico_prev { background-position: -110px -80px }
  .area_paging .no-more-next .ico_next { background-position: -110px -100px }
  #tt-body-page .area_more { display: none }

  .article_skin { position: relative; width: 100% }
  .skin_view .area_title { margin: 0 15px; padding: 44px 0 20px }
  .skin_view .area_title .my_edit { display: none }
  .skin_view .tit_category { font-size: 13px }
  .skin_view .tit_category a { font-family: applesdgothicneo-semibold; font-weight: bold }
  .skin_view .tit_post {
    margin-top: 3px; padding: 0 8px; font-family: applesdgothicneo-semibold; font-weight: bold; font-size: 26px; line-height: 31px
  }
  .skin_view .txt_detail { margin-top: 18px; word-break: break-all }
  .skin_view .txt_detail .txt_bar { margin: 0 8px }
  .skin_view .area_view { padding: 22px 15px 22px }
  .skin_view .area_view p { font-size: 17px; line-height: 24px; color: #333 }
  .skin_view .img_view { width: 100%; height: auto; margin: 11px 0 6px }

  .skin_view .area_etc { position: relative; height: auto; margin: 0; }
  .skin_view .area_etc .list_tag { margin-top: 0; padding: 0 15px; float: none; margin-bottom: 22px }
  .skin_view .list_tag .tit_tag {
    margin-right: 3px; font-family: applesdgothicneo-ultralight; font-size: 13px; float: none; display: inline
  }
  .skin_view .list_tag .desc_tag { margin: 0; float: none; display: inline; font-weight: bold; font-family: applesdgothicneo-semibold; }
  .skin_view .list_tag .link_tag { font-weight: normal; font-size: 13px }

  .skin_view .area_reply { margin-top: 0; padding-bottom: 24px; border-bottom: 1px solid #ebebeb }
  .area_reply .tit_reply {
    padding-left: 15px; color: #333; font-family: applesdgothicneo-semibold; font-weight: bold; display: block; padding-bottom: 1px;
  }
  .area_reply .btn_reply { margin-top: 0; line-height: 20px; vertical-align: top; }
  .area_reply .btn_reply span { font-family: applesdgothicneo-semibold; font-weight: bold }
  .area_reply .btn_reply .ico_reply { margin: 6px 0 0 0px; background-position: -150px -80px }
  .btn_reply.on .ico_reply { background-position: -150px -90px }
  .area_reply .list_reply { margin-bottom: 0px }
  .area_reply .list_reply .tt_more_preview_comments_text { font-size: 14px; color: #666 }
  .area_reply .list_reply li { overflow: visible; padding: 20px 15px 16px; border-bottom: 1px solid #efefef }
  .area_reply .list_reply li.tt_more_preview_comments_wrap { height: 20px }
  .area_reply .list_reply li:hover { background-color: #fff }
  .area_reply .list_reply li:last-child { border: 0; padding-bottom: 14px }
  .area_reply .list_reply .my_reply { background-color: #f8f8f8 }
  .area_reply .list_reply .my_reply:hover { background-color: #f8f8f8 }
  .area_reply .list_reply .re_reply { padding-left: 60px }
  .area_reply .list_reply .prev_reply:before {
    content: ''; position: absolute; left: 31px; top: 48px; width: 1px; height: 100%; background-color: #ccc
  }
  .area_reply .reply_content { display: block; float: none; padding: 0 28px 0 45px }
  .area_reply .list_reply .img_profile { width: 33px; height: 33px; border-radius: 33px; margin: 0 }
  .area_reply .list_reply .tit_nickname {
    font-size: 13px; overflow: visible; margin: 0px 5px 2px 0; color: #333; vertical-align: top; white-space: normal;
    font-family: applesdgothicneo-semibold
  }
  .area_reply .re_reply .tit_nickname { color: #3db39e }
  .area_reply .reply_secret .tit_nickname { margin-top: 0; vertical-align: top }
  .area_reply .ico_secret, .skin_visitor .area_reply .ico_secret { margin-top: 3px; background-position: -90px -110px }
  .area_reply .txt_reply, .area_reply .re_reply .txt_reply { width: 100%; margin-top: 0; line-height: 20px; font-size: 14px; color: #333 }
  .area_reply .txt_date { margin-top: 4px }
  .area_reply .reply_secret .txt_date { margin-top: 0 }
  .area_reply .btn_replymenu {
    display: block; position: absolute; right: 2px; top: 12px; width: 30px; height: 30px
  }
  .area_reply .btn_replymenu .ico_replymenu { display: inline-block; width: 3px; height: 13px; background-position: -150px -100px; vertical-align: middle }
  .area_reply .list_reply li .my_edit {
    right: 10px; top: 20px; z-index: 10; width: 95px; padding: 10px 0; border: 1px solid #dcdcdc; background-color: #fff
  }
  .area_reply .list_reply li .my_edit .link_edit { display: block; font-size: 14px; line-height: 32px; color: #333; text-align: center }

  .area_reply .fld_reply { padding: 0 15px }
  .area_reply .btn_replymore {
    margin-top: 5px; border-top: 1px solid #e0e0e0; border-bottom: 1px solid #efefef; font-size: 13px; color: #666
  }
  .area_reply .reply_write { margin-top: 4px; padding: 7px 8px; border: 1px solid #e0e0e0 }
  .area_reply .tf_reply {
    width: 100%; height: 67px; padding: 0; border: 0 none; font-size: 14px; outline: none
  }
  .area_reply .lab_write { left: 10px; top: 8px; font-size: 14px; color: #999 }
  .area_reply .reply_writer { margin-top: 8px }
  .area_reply .writer_info { overflow: hidden; float: none; width: 100% }
  .area_reply .writer_info .info_name { display: block; float: left; width: 50%; margin-right: 0 }
  .area_reply .writer_info .info_pw { display: block; float: left; width: 50% }
  .area_reply .writer_info .wrap_info { display: block }
  .area_reply .info_name .wrap_info { margin-right: 5px }
  .area_reply .info_pw .wrap_info { margin-left: 5px }
  .area_reply .writer_info .lab_info { left: 11px; top: 7px; font-size: 14px; color: #999 }
  .area_reply .info_pw .lab_info { left: 16px }
  .area_reply .writer_info .inp_info {
    width: 100%; height: 35px; font-size: 14px; outline: none; padding: 3px 10px 0;
    -webkit-appearance: none; border-radius: 0; border: 1px solid #e0e0e0;
  }
  .area_reply .writer_info .inp_info::-webkit-input-placeholder { padding-top: 0 }
  .area_reply .writer_check { overflow: hidden; float: left; padding-top: 10px; position: inherit; right: inherit }
  .area_reply .writer_check .check_secret { display: block; float: left; width: 75px; height: 33px; line-height: 35px }
  .area_reply .writer_check .inp_secret { width: 75px; height: 33px }
  .area_reply .writer_check .lab_secret { position: static; padding-left: 33px; font-size: 14px; color: #666 }
  .area_reply .writer_check .ico_check { left: 0; top: 3px; width: 26px; height: 26px; background-position: -50px -80px }
  .area_reply .on .ico_check, .area_reply .writer_check .inp_secret:checked+.lab_secret .ico_check { background-position: -80px -80px }
  .area_reply .writer_check .inp_secret:checked+.lab_secret { font-weight: bold }
  .area_reply .writer_btn { float: right; padding-top: 10px; position: inherit; right: inherit }
  .area_reply .writer_btn .btn_enter { width: 62px; height: 33px; font-size: 15px; line-height: 34px; padding-top: 1px }
  .area_reply .hiddenComment .txt_reply { font-family: applesdgothicneo-semibold }
  .area_reply .hiddenComment .txt_date { margin-top: 0px }

  .skin_view .another_category {
    margin: 20px -15px 4px; border-top: 1px solid #ebebeb; border-bottom: 1px solid #eee; padding: 23px 0; width: auto
  }
  .skin_view .another_category h4 { float: none; padding: 0 15px !important; width: auto; border: 0 !important }
  .skin_view .another_category table {
    float: none; margin-top: 10px !important; max-height: 145px; overflow: hidden; display: block
  }
  .skin_view .another_category table tr { width: 100%; margin-bottom: 9px; padding: 0 15px !important }
  .skin_view .another_category table tr:nth-child(even) th { padding: 0 !important }
  .skin_view .another_category table th { font-size: 14px; color: #999 }
  .skin_view .another_category table th a { font-size: 15px; color: #333 !important; max-width: 230px }
  .skin_view .another_category table th a.current { font-weight: bold; font-family: applesdgothicneo-bold }
  .skin_view .another_category table th span {
    font-size: 15px; display: inline-block; font-family: applesdgothicneo-ultralight; line-height: 1.5
  }

  .skin_view .area_other {
    position: absolute; left: 0; bottom: -218px; width: 100%; height: 178px; margin: 0 0 22px; padding: 21px 0 0;
    border-top: 1px solid #ebebeb
  }
  .skin_view .tit_other {
    display: block; overflow: hidden; float: none; width: auto; padding: 0 15px; border-bottom: 0 none;
    white-space: nowrap; text-overflow: ellipsis
  }
  .skin_view .list_other { float: none; width: 100%; margin-top: 12px }
  .skin_view .list_other li {
    overflow: hidden; width: 100%; margin-bottom: 9px; padding: 0 15px; font-size: 14px; color: #999
  }
  .skin_view .list_other .link_other { font-size: 15px; color: #333 }

  .cont_skin { margin-top: 63px }
  #tt-body-search .area_head .btn_name,
  #tt-body-search .area_head .txt_condition,
  #tt-body-tag .area_head .btn_name,
  #tt-body-tag .area_head .txt_condition,
  #tt-body-category .area_head .btn_name,
  #tt-body-category .area_head .txt_condition,
  #tt-body-guestbook .area_head .btn_name,
  #tt-body-guestbook .area_head .txt_condition { display: none }
  .area_foot { margin-top: 21px }

  .list_content { max-height: 113px; padding: 21px 15px 20px }
  .list_content .thumbnail_post, .list_content .thumbnail_post img { width: 76px; height: 76px }
  .list_content .thumbnail_post { margin: 8px 0 8px 30px }
  .list_content .tit_post { font-size: 18px; font-family: applesdgothicneo-semibold; font-weight: bold }
  .list_content .txt_post {
    max-height: 37px; margin-top: 2px; font-size: 14px; line-height: 19px; color: #6b6b6b; -webkit-line-clamp: 2
  }
  .list_content .detail_info { margin-top: 8px; font-size: 13px; color: #bbb }
  .list_content .detail_info .link_cate { font-size: 13px }
  .list_content .detail_info .txt_bar { margin: 0 5px }

  .skin_visitor .area_reply .fld_reply { padding-top: 12px }
  .skin_visitor .area_reply .reply_write { margin-top: 0 }
  .skin_visitor .area_reply .reply_writer { margin-top: 10px }
  .skin_visitor .area_reply .list_reply { margin-top: 25px }
  .skin_tag .list_tag { overflow: hidden; padding: 30px 20px 90px }

  .layer_on { overflow: hidden }
  .layer_on .cont_skin { margin-top: 0; padding-top: 61px }
  .layer_on .dimmed_layer { display: block }
  .layer_on .area_head .btn_menu { display: none }
  .layer_on .area_menu { display: block }
  .layer_on .area_menu .area_search { display: block }
  .layer_on .area_menu .frm_search { display: block }
  .layer_on .area_menu .list_cate { display: block }
  .layer_on .btn_close { display: block }
}

/* retina */
@media only screen and (max-width:820px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width:820px) and (min-device-pixel-ratio: 1.5),
only screen and (max-width:820px) and (min-resolution: 1.5dppx) {
  .ico_skin { background-image: url("images/ico_skin_640.png"); -webkit-background-size: 160px 160px; background-size: 160px 160px }
}

/* comment widget */
@media only screen and (max-width: 800px) { .tt-comment-cont { padding: 0 15px; } }
.tt-comment-cont .tt-box-total .tt_txt_g { font-size: 15px; }
.tt-comment-cont .tt-box-total .tt_num_g { font-size: 15px; color: #61B19F; }
.tt-comment-cont .tt-wrap-cmt .tt-link-user { font-size: 15px; }
.tt-comment-cont .tt-wrap-cmt .tt_desc { font-size: 15px; color: #666; }
.tt-comment-cont .tt-txt-mention { color: #666; }
.tt-comment-cont .tt-wrap-cmt .tt_txt_g { color: #61B19F; }
.tt-comment-cont .tt-link-comment .tt_num_g { color: #61B19F; }
.tt-comment-cont .tt-btn_register {
  width: 77px; height: 36px; background-color: #3DB39E; color: #fff; border-radius: 4px; border-color: #3DB39E;
}
.tt-comment-cont .tt-btn_register:hover,
.tt-comment-cont .tt-btn_register:focus { background-color: #3DB39E; border-color: #3DB39E; }

/* editor content */
#article-view {
  margin: 0; padding: 20px 20px 50px; word-wrap: break-word; color: #333; min-height: 370px;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Apple SD Gothic Neo", Arial, sans-serif;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; letter-spacing: 0;
}
.contents_style>* { margin: 20px 0 0 0; }

/* text sizes */
#article-view h2[data-ke-size]{ font-size: 1.62em; line-height: 1.46; }
#article-view h3[data-ke-size]{ font-size: 1.44em; line-height: 1.48; }
#article-view h4[data-ke-size]{ font-size: 1.25em; line-height: 1.55; }
#article-view p[data-ke-size='size18']{ font-size: 1.12em; line-height: 1.67; }
#article-view p[data-ke-size='size16']{ line-height: 1.75; }
#article-view p[data-ke-size='size14']{ font-size: 0.87em; line-height: 1.71; }

#article-view h2, #article-view h3, #article-view h4 {
  font-weight: normal; letter-spacing: -1px; color: #000; margin: 1em 0 20px;
}
#article-view p+p, #article-view p { margin-bottom: 30px; }
#article-view h2+h2, #article-view h3+h3, #article-view h4+h4 { margin: 0; }
#article-view h2+h3, #article-view h2+h4, #article-view h3+h4 { margin-top: 10px; }
#article-view h2+p, #article-view h3+p, #article-view h4+p, #article-view h5+p, #article-view h6+p { margin-top: 10px; }

#article-view div[data-ke-type='moreLess'] {
  caret-color: auto; background-color: #fafafa; padding: 20px 20px 22px; margin: 20px 0; border: 1px dashed #dddddd; color: #333333;
}
#article-view a { color: #0070d1; text-decoration: underline; }
#article-view figure[data-ke-type='contentSearch'] a { text-decoration: none; }

/* blockquotes */
#article-view blockquote[data-ke-style='style1']{
  text-align:center;background:url(https://t1.daumcdn.net/keditor/dist/0.7.21/image/blockquote-style1.svg) no-repeat 50% 0;
  padding:34px 0 0 0; font-size:1.12em; color:#333; line-height:1.67; border:0 none; font-family:"Noto Serif KR";
}
#article-view blockquote[data-ke-style='style2']{
  border-color:#d0d0d0; border-width:0 0 0 4px; border-style:solid; padding:1px 0 0 12px; color:#666; line-height:1.75; font-size:1em; text-align:left;
}
#article-view blockquote[data-ke-style='style3']{
  border:1px solid #dddddd;background-color:#fcfcfc;text-align:left;padding:21px 25px 20px 25px;color:#666;font-size:1em;line-height:1.75;
}
#article-view blockquote{ display:block; margin:20px auto 0; letter-spacing:0px; }

/* files */
#article-view span[data-lightbox]{ cursor:pointer; }
#article-view figure.fileblock{
  width:470px; height:73px; box-sizing:border-box; position:relative; border-radius:1px; margin-top:20px; margin-bottom:0;
  box-shadow:0 1px 4px 0 rgb(0 0 0 / 7%); border:solid 1px rgba(0,0,0,0.1);
}
#article-view figure.fileblock a{ display:block; }
#article-view figure.fileblock .image{
  float:left; width:30px; height:30px;
  background-image:url('https://t1.daumcdn.net/tistory_admin/static/manage/post-editor/img_editor_content.svg');
  margin:22px 17px 21px 22px; background-position:0 0;
}
#article-view figure.fileblock .desc{ position:absolute; left:70px; right:60px; top:4px; bottom:0; }
#article-view figure.fileblock .filename{ color:#333333; font-size:14px; text-overflow:ellipsis; width:100%; height:20px; margin:16px 0 0; }
#article-view figure.fileblock .size{ font-family:Pretendard-Regular; font-size:12px; color:#777; height:16px; }
#article-view figure[data-ke-align=alignCenter].fileblock{ margin-left:auto; margin-right:auto; }
#article-view figure[data-ke-align=alignRight].fileblock{ margin-left:auto; }
#article-view figure.fileblock .name{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:272px; height:20px; display:block; }
#article-view figure.fileblock a::after{
  content:''; background-image:url('https://t1.daumcdn.net/tistory_admin/static/manage/post-editor/img_editor_content.svg');
  background-position:-40px 0; width:30px; height:30px; position:absolute; right:24px; top:19px;
}

/* images */
#article-view figure.imageblock{ display:table; position:relative; }
#article-view figure.imageblock.alignLeft{ text-align:left; }
#article-view figure.imageblock.alignCenter{ margin:20px auto 0; text-align:center; }
#article-view figure.imageblock.alignRight{ text-align:right; margin-left:auto; }
#article-view figure.imageblock.floatLeft{ float:left; margin-right:20px; }
#article-view figure.imageblock.floatRight{ float:right; margin-left:20px; }
#article-view figure.imageblock.widthContent{ display:block; }
#article-view figure.imageblock.widthContent img{ width:100%; }
#article-view figure.imageblock.floatLeft figcaption, #article-view figure.imageblock.floatRight figcaption{ text-align:left; }
#article-view figure.imageblock img{ display:inline-block; max-width:100%; margin:0; height:auto; }
#article-view iframe, #article-view figure img, #article-view figure iframe{ max-width:100%; }
#article-view figure img:not([width]), #article-view figure iframe:not([width]){ width:100%; }
#article-view figure{ max-width:100%; clear:both; }
#article-view figure img{ display:inline-block; }
#article-view figure.imagegridblock+figure.imagegridblock,
#article-view figure.imagegridblock+figure.imageblock,
#article-view figure.imageblock+figure.imagegridblock{ margin-top:10px; }
#article-view figure figcaption{
  font-size:13px; color:#777; word-break:break-word; padding-top:10px; min-height:20px; caption-side:bottom; text-align:center; caret-color:auto; width:100%; box-sizing:content-box;
}

/* image grid */
#article-view figure.imagegridblock{
  position:relative; caret-color:transparent; background-color:transparent; width:100%; height:auto; margin:20px 0 0 0;
}
#article-view figure.imagegridblock .image-container{ display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; }
#article-view figure.imagegridblock .image-container>span{ margin-right:0; margin-top:2px; }
#article-view figure.imagegridblock img{ margin:0; height:inherit; }
#article-view figure.imagegridblock span img{ width:100%; }

/* dividers */
hr[data-ke-style], #article-view hr[data-ke-style]{
  border:none; font-size:0; line-height:0; margin:20px auto 0;
  background:url(https://t1.daumcdn.net/keditor/dist/0.7.21/image/divider-line.svg); background-size:200px 420px; cursor:default !important;
}
hr[data-ke-style='style1'], #article-view hr[data-ke-style='style1']{ background-position:center 0; width:64px; height:4px; padding:20px; }
hr[data-ke-style='style2'], #article-view hr[data-ke-style='style2']{ background-position:center -48px; width:64px; height:3px; padding:20px; }
hr[data-ke-style='style3'], #article-view hr[data-ke-style='style3']{ background-position:center -96px; width:64px; height:8px; padding:18px 20px; }
hr[data-ke-style='style4'], #article-view hr[data-ke-style='style4']{ background-position:center -144px; width:2px; height:60px; padding:0 51px; }
hr[data-ke-style='style4']+hr[data-ke-style='style4'], #article-view hr[data-ke-style='style4']+hr[data-ke-style='style4']{ margin-top:0; }
hr[data-ke-style='style5'], #article-view hr[data-ke-style='style5']{ background-position:center -208px; background-repeat:repeat-x; height:2px; padding:21px 0; }
hr[data-ke-style='style6'], #article-view hr[data-ke-style='style6']{ background-position:center -256px; background-repeat:repeat-x; height:2px; padding:21px 0; }
hr[data-ke-style='style7'], #article-view hr[data-ke-style='style7']{ background-position:center -304px; width:200px; height:19px; padding:18px 20px 17px 20px; }
hr[data-ke-style='style8'], #article-view hr[data-ke-style='style8']{ background-position:center -362px; width:200px; height:19px; padding:18px 20px 17px 20px; }

/* tables */
#article-view table[data-ke-style]{ margin-bottom:0px; }
#article-view table{ margin-bottom:0px; border-color:#ddd; }
#article-view table tbody tr{ box-sizing:content-box; }
#article-view table td{ word-break:break-word; padding:8px; font-size:15px; line-height:normal; color:#333; }
#article-view table[data-ke-style='style1'] tr:first-child td{ border-bottom:1px solid #6ed3d8; }
#article-view table[data-ke-style='style2'] tr:first-child td{ border-bottom:1px solid #008300; }
#article-view table[data-ke-style='style3'] tr:first-child td{ border-bottom:1px solid #006dbe; }
#article-view table[data-ke-style='style4'] tr:nth-child(2n) td{ background-color:#f9f9f9; }
#article-view table[data-ke-style='style5'] tr:nth-child(2n) td{ background-color:#f8fbfb; }
#article-view table[data-ke-style='style6'] tr:nth-child(2n) td{ background-color:#f5f7f5; }
#article-view table[data-ke-style='style7'] tr:nth-child(2n) td{ background-color:#f6f8fb; }
#article-view table[data-ke-style='style8'] tr:first-child td{ border-bottom:2px solid #797979; }
#article-view table[data-ke-style='style8']{ border-left:0 none; border-right:0 none; }
#article-view table[data-ke-style='style8'] td{ border-right-color:transparent; border-left-color:transparent; }
#article-view table[data-ke-style='style9'] tr:first-child td{ border-bottom:2px solid #6ed3d8; }
#article-view table[data-ke-style='style9']{ border-left:0 none; border-right:0 none; }
#article-view table[data-ke-style='style9'] td{ border-right-color:transparent; border-left-color:transparent; }
#article-view table[data-ke-style='style10'] tr:first-child td{ border-bottom:2px solid #008300; }
#article-view table[data-ke-style='style10']{ border-left:0 none; border-right:0 none; }
#article-view table[data-ke-style='style10'] td{ border-right-color:transparent; border-left-color:transparent; }
#article-view table[data-ke-style='style11'] tr:first-child td{ border-bottom:2px solid #2780d4; }
#article-view table[data-ke-style='style11']{ border-left:0 none; border-right:0 none; }
#article-view table[data-ke-style='style11'] td{ border-right-color:transparent; border-left-color:transparent; }
#article-view table[data-ke-style='style12'] tr:nth-child(odd) td{ background-color:#f9f9f9; }
#article-view table[data-ke-style='style12'] tr td:first-child{ background-color:#efefef; }
#article-view table[data-ke-style='style12'] tr:first-child td{
  background-color:#9b9b9b; border:1px solid #888; color:#fff;
}
#article-view table[data-ke-style='style13'] tr:nth-child(odd) td{ background-color:#f9f9f9; }
#article-view table[data-ke-style='style13'] tr td:first-child{ background-color:#efefef; }
#article-view table[data-ke-style='style13'] tr:first-child td{
  background-color:#6ed3d8; border:1px solid #5cbcc1; color:#fff;
}
#article-view table[data-ke-style='style14'] tr:nth-child(odd) td{ background-color:#f9f9f9; }
#article-view table[data-ke-style='style14'] tr td:first-child{ background-color:#efefef; }
#article-view table[data-ke-style='style14'] tr:first-child td{
  background-color:#008300; border:1px solid #006d00; color:#fff;
}
#article-view table[data-ke-style='style15'] tr:nth-child(odd) td{ background-color:#f9f9f9; }
#article-view table[data-ke-style='style15'] tr td:first-child{ background-color:#efefef; }
#article-view table[data-ke-style='style15'] tr:first-child td{
  background-color:#2780d4; border:1px solid #1568b7; color:#fff;
}
#article-view table[data-ke-style='style16'], #article-view table[data-ke-style='style16'] tr, #article-view table[data-ke-style='style16'] tr td{ border-color:transparent; }

/* opengraph */
#article-view figure[data-ke-type='opengraph']{ margin:10px 0; }
#article-view figure[data-ke-type='opengraph'] a{
  box-sizing:initial; width:100%; display:flex; justify-content:center; align-items:center;
  box-shadow:0 1px 4px 0 rgba(0,0,0,0.07); border:solid 1px rgba(0,0,0,0.1); text-decoration:none; color:#000;
}
#article-view figure[data-ke-type='opengraph'] a:hover{ opacity:1; }
#article-view figure[data-ke-type='opengraph'] div.og-image{
  border-right:solid 1px rgba(0,0,0,0.06); width:200px; height:200px; background-size:cover; background-position:center;
}
#article-view figure[data-ke-type='opengraph'] div.og-image button{ display:none; }
#article-view figure[data-ke-type='opengraph']:hover div.og-image button{
  cursor:pointer; border:none; display:block; position:absolute; top:0px; right:0px; background-color:#000; width:15px; height:15px;
}
#article-view figure[data-ke-type='opengraph'] p.og-title{
  color:#000000; font-size:22px; padding-bottom:10px; max-width:467px; text-overflow:ellipsis; white-space:nowrap;
  margin:0px; overflow:hidden; font-family:Pretendard-Regular;
}
#article-view figure[data-ke-type='opengraph'] .og-desc{
  margin:0px; max-width:467px; text-overflow:ellipsis; overflow:hidden; font-family:Pretendard-Regular; font-size:14px;
  font-weight:300; font-style:normal; font-stretch:normal; line-height:normal; letter-spacing:normal; color:#909090;
  max-height:42px; -webkit-line-clamp:2; -webkit-box-orient:vertical; display:-webkit-box;
}
@media (max-width: 600px){
  #article-view figure[data-ke-type='opengraph'] a{ height:90px; }
  #article-view figure[data-ke-type='opengraph'] a::before{ left:44px; }
  #article-view figure[data-ke-type='opengraph'] div.og-image{ width:90px; height:90px; }
  #article-view figure[data-ke-type='opengraph'] div.og-text{ padding:13px 12px 0 20px; height:90px; }
  #article-view figure[data-ke-type='opengraph'] div.og-text p.og-title{ font-size:16px; -webkit-line-clamp:1; }
  #article-view figure[data-ke-type='opengraph'] div.og-text p.og-desc{ display:none; }
  #article-view figure[data-ke-type='opengraph'] div.og-text p.og-host{ bottom:10px; }
}

/* video */
#article-view figure[data-ke-type='video']{
  display:block; table-layout:fixed; justify-content:center; align-items:center; position:relative; text-align:center; color:#bdbdbd; font-size:16px; line-height:30px;
}
#article-view figure[data-ke-type='video'][data-ke-style='alignLeft']{ text-align:left; }
#article-view figure[data-ke-type='video'][data-ke-style='alignCenter']{ margin:20px auto 0; text-align:center; }
#article-view figure[data-ke-type='video'][data-ke-style='alignRight']{ text-align:right; margin-left:auto; }
#article-view figure[data-ke-type='video'] img{ display:block; max-width:100%; margin:0 auto; }
#article-view figure[data-ke-type='video'][data-video-host] iframe{ margin:0px; display:block; }
#article-view figure[data-ke-type='video']>iframe[width='0'][height='0']{ width:860px; height:484px; max-width:100%; }

/* code block */
#article-view pre code.hljs{
  font-size:14px; padding:20px; font-family:SF Mono, Menlo, Consolas, Monaco, monospace;
  border:solid 1px #ebebeb; line-height:1.71; overflow:auto;
}

/* more/less (old editor) */
#article-view .moreless-content :first-child{ margin-top:0; margin-bottom:0; }
#article-view div[data-ke-type='moreLess'] .moreless-content{ display:none; }
#article-view div[data-ke-type='moreLess'].open .moreless-content{ display:block; }
#article-view div[data-ke-type='moreLess'] .btn-toggle-moreless{
  color:#909090; font-size:16px; line-height:26px; font-family:Pretendard-Regular, sans-serif; cursor:pointer; text-decoration:none;
}

/* lists inside article */
#article-view ul li, #article-view ol li{ margin:0 0 3px 22px; line-height:1.7; }
#article-view ul, #article-view ol{ margin:14px auto 24px; padding:0 0 0 10px; }

/* emoticons */
#article-view figure[data-ke-type=emoticon][data-ke-align=alignCenter]{ text-align:center; }
#article-view figure[data-ke-type=emoticon][data-ke-align=alignLeft]{ text-align:left; }
#article-view figure[data-ke-type=emoticon][data-ke-align=alignRight]{ text-align:right; }

/* maps */
#article-view figure[data-ke-type='map'], #article-view iframe[data-ke-type='map']{ display:block; margin:0 auto; }

/* image slide */
#article-view figure.imageslideblock{ clear:both; position:relative; font-size:0; outline:0 none; }
#article-view figure.imageslideblock .btn{ display:none; outline:none; }
#article-view figure.imageslideblock.ready .btn{ display:inline-block; }
#article-view figure.imageslideblock.ready .mark{ opacity:1; }
#article-view figure.imageslideblock div.image-container{
  position:relative; min-width:480px; max-width:100%; min-height:300px; max-height:860px; background-color:#000;
  display:flex; align-items:center; justify-content:center; overflow:hidden; margin:0 auto;
}
#article-view figure.imageslideblock div.image-container span.image-wrap{ display:none; }
#article-view figure.imageslideblock div.image-container span.image-wrap.selected{ display:inline; }
#article-view figure.imageslideblock div.image-container img{ max-width:100%; max-height:100%; }
#article-view figure.imageslideblock div.image-container .btn{
  position:absolute; border:0; background:transparent; width:60px; height:60px; top:50%; margin-top:-20px;
}
#article-view figure.imageslideblock div.image-container .btn-prev{ left:0; }
#article-view figure.imageslideblock div.image-container .btn-next{ right:0; }
#article-view figure.imageslideblock div.image-container:hover .btn span{ opacity:0.3; }
#article-view figure.imageslideblock div.image-container .btn span{
  background-image:url('https://t1.daumcdn.net/tistory_admin/static/manage/post-editor/img_editor_content.svg');
  text-indent:-10000px; overflow:hidden; width:40px; height:40px; opacity:0; transition:opacity ease-in-out 0.2s; display:inline-block;
}
#article-view figure.imageslideblock div.image-container .btn:hover span{ opacity:1; }
#article-view figure.imageslideblock div.image-container .btn .ico-prev{ background-position:-220px 0; }
#article-view figure.imageslideblock div.image-container .btn .ico-next{ background-position:-260px 0; }
#article-view figure.imageslideblock div.mark{
  display:block; height:44px; text-align:center; opacity:0; transition:opacity ease-in-out 0.2s;
}
#article-view figure.imageslideblock div.mark span{
  width:30px; height:4px; display:inline-block; margin:20px 1px; background-color:#d6d6d6; text-indent:-10000px; overflow:hidden; cursor:pointer;
}
#article-view figure.imageslideblock div.mark span:first-child{ background-color:#000; margin-left:0; }
#article-view figure.imageslideblock div.mark span:last-child{ margin-right:0; }
#article-view figure.imageslideblock figcaption{ text-align:center; color:#666; font-size:14px; }
#article-view figure.imageslideblock.alignLeft{ text-align:left; }
#article-view figure.imageslideblock.alignCenter{ margin:0 auto 20px; text-align:center; }
#article-view figure.imageslideblock.alignRight{ text-align:right; margin-left:auto; }
@media (max-width: 600px){
  #article-view figure.imageslideblock div.image-container{ min-width:100%; width:100%; max-height:100%; }
  #article-view figure.imageslideblock div.image-container .btn span{ opacity:0.3; }
}

/* old editor buttons */
.btn_more, .btn_less{
  border:0; background:transparent; display:block; height:21px; margin:20px 0; font-size:14px; line-height:14px; color:#888; position:relative; width:100%; text-align:left;
}
.btn_less::before, .btn_more::before{
  content:"..."; display:inline-block; padding-right:5px; font-size:14px; line-height:6px; vertical-align:top;
}
.box-timeline-content{ word-break: break-all; }

/* =========================================================
   READABILITY PATCH — 가독성 강화(목록/본문/모바일 폰트 두께/색상)
   (이 아래만 수정해도 충분)
   ========================================================= */
:root{
  --body-font: "Pretendard", "Noto Sans KR", system-ui, -apple-system, "Apple SD Gothic Neo", Arial, sans-serif;
  --body-color: #222;
  --title-color:#111;
  --link-color:#0b72d7;
}

/* 본문 컨텐츠 */
#article-view, .skin_view .area_view{
  color: var(--body-color) !important;
  font-family: var(--body-font) !important;
  font-weight: 400 !important;
  font-size: 16px;
  line-height: 1.75;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
  text-rendering: optimizeLegibility;
  letter-spacing: 0;
}
#article-view p, .skin_view .area_view p{ color: var(--body-color) !important; }

/* 제목(본문) */
#article-view h2, #article-view h3, #article-view h4{
  letter-spacing: -0.2px;
  font-weight: 700;
  color: #000;
}

/* 링크 대비 */
#article-view a, .skin_view .area_view a{ color: var(--link-color); text-decoration: underline; }

/* 목록 카드 가독성 */
.list_content .tit_post{
  color: var(--title-color) !important;
  font-weight: 700 !important;
}
.list_content .txt_post{
  color: var(--body-color) !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}
.list_content .detail_info{ color:#888 !important; }

/* 모바일에서 초얇은 폰트 강제 해제 + 텍스트 크기 보정 */
@media only screen and (max-width:820px){
  body, th, td, input, select, textarea, button, p, span{
    font-family: var(--body-font) !important;
    font-weight: 400 !important; /* 100 → 400 */
  }
  .list_content .tit_post{ font-size: 19px; }
  .list_content .txt_post{
    font-size: 15px !important;
    -webkit-text-size-adjust: 100%;
  }
  #article-view h2, #article-view h3, #article-view h4{ letter-spacing: 0; }
}

/* 가변 폰트 사용 시 살짝 두껍게 */
@supports (font-variation-settings: normal){
  #article-view, .skin_view .area_view, .list_content .txt_post{
    font-variation-settings: "wght" 450;
  }
}

/* 표/리스트 글자색 통일 */
#article-view table td, #article-view ul li, #article-view ol li{ color: var(--body-color); }