p.바탕글 {
      margin-bottom: 15px;
    }

    .spacer {
      height: 1.5px;
    }

    html {
      -webkit-text-size-adjust: none;
      -moz-text-size-adjust: none;
      -ms-text-size-adjust: none;
      text-size-adjust: none;
    }

    html, body {
      margin: 0;
      padding: 0;
      background-color: #f1f1f1;
      overflow-x: hidden;
    }

    body,
    input,
    textarea {
      font-size: 14px;
      font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Apple SD Gothic Neo", Arial, sans-serif;
    }

    img {
      max-width: 100%;
      height: auto;
    }

    .image-container {
      width: 100%;
      overflow: hidden;
      margin-bottom: 15px;
    }

    fieldset {
      border: 1px solid #ddd;
      padding: 2%;
    }

    sup, sub {
      height: 0;
      line-height: 0;
      font-size: 10px;
    }

    iframe, video, embed, object {
      max-width: 100%;
    }

    abbr, acronym {
      border-bottom: 1px dotted #999;
      cursor: help;
    }

    cite, em {
      font-style: italic;
    }

    hr {
      margin: 0;
      padding: 0;
      border: none;
      border-top: 1px solid #ccc;
      height: 0;
      overflow: hidden;
    }

    code.red {
      border: 1px solid #F6CECE;
      background-color: #FFF4F4;
      color: #BE0D0D;
    }

    code.blue {
      border: 1px solid #B7D9F2;
      background-color: #F4FCFF;
      color: #4570CD;
    }

    code.green {
      border: 1px solid #B7F2C7;
      background-color: #F4FFF7;
      color: #267C45;
    }

    input, textarea {
      outline: none;
    }

    ::selection {
      background: #888;
      color: #fff;
    }

    div, span, input, textarea {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      -ms-box-sizing: border-box;
      -o-box-sizing: border-box;
      box-sizing: border-box;
    }

    #tistoryProfileLayer div {
      -webkit-box-sizing: content-box;
      -moz-box-sizing: content-box;
      -ms-box-sizing: content-box;
      -o-box-sizing: content-box;
      box-sizing: content-box;
    }

    a, input, textarea, li {
      -webkit-transition: all 0.3s;
      -moz-transition: all 0.3s;
      -ms-transition: all 0.3s;
      -o-transition: all 0.3s;
      transition: all 0.3s;
    }

    .clear {
      clear: both;
      width: 100%;
    }

    .text-center {
      text-align: center;
    }

    .mCSB_inside>.mCSB_container {
      margin-right: 0 !important;
    }

    /*
     * sidebar
     */
    #sidebar {
      position: fixed;
      top: 0;
      left: 0;
      bottom: 0;
      padding: 0;
      width: 250px;
      height: 100%;
      background-color: #fff;
      border-right: 1px solid #ddd;
      cursor: default;
      z-index: 100;
      overflow-y: auto;
    }

    #sidebar a {
      color: #333;
      text-decoration: none;
    }

    #sidebar a:hover {
      color: #07a;
    }

    #sidebar .blank {
      clear: both;
      width: 100%;
      height: 100px;
    }

    #sidebar h1 {
      margin: 0;
      padding: 0 10px;
      text-align: center;
      font-size: 20px;
      font-weight: 400;
      line-height: 200%;
      color: #666;
    }

    #sidebar .widget {
      margin-top: 30px;
      padding: 0;
      line-height: 200%;
    }

    #sidebar .widget li {
      list-style: none;
      padding-right: 30px;
      word-break: break-word;
    }

    #sidebar .category>ul {
      margin: 0;
      padding: 0;
    }

    #sidebar .category ul li {
      list-style: none;
    }

    #sidebar .category>ul>li>a {
      display: none;
    }

    #sidebar .category ul li ul li ul {
      margin: 0 0 0 15px;
      padding: 0;
    }

    #sidebar .category ul li ul li ul li:before {
      content: "\f0da";
      font-family: "FontAwesome";
      font-size: 10px;
      padding-right: 5px;
    }

    #sidebar .counter {
      font-size: 13px;
    }

    #sidebar .counter .yesterday {
      color: #6a6;
    }

    #sidebar .counter .today {
      color: #07a;
    }

    #sidebar .counter .total {
      color: #e55;
    }

    #sidebar .search input {
      padding: 10px;
      width: 60%;
      border: none;
      border-bottom: 1px dashed #ccc;
    }

    #sidebar .search input:focus {
      border-color: #B7CFF1;
    }

    #sidebar .blogger {
      line-height: 100%;
      color: #666;
    }

    /*
     * content
     */
    #content {
      margin: 0 0 0 330px;
      padding: 0;
      transition: margin 0.3s ease;
    }

    #content-inner {
      max-width: 1030px;
      width: 100%;
      padding-right: 30px;
    }

    #head {
      position: relative;
      padding-top: 100px;
      width: 100%;
      text-align: center;
    }

    #head h2 {
      display: inline-block;
      margin: 0 0 50px;
      padding: 0 5px 3px;
      font-size: 20px;
      font-weight: 400;
      color: #444;
      line-height: 200%;
      border-bottom: 1px dashed #ddd;
      text-shadow: 1px 1px #dedede;
      word-break: break-word;
    }

    #head h2 a {
      color: #444;
    }

    #head h2 a:hover {
      color: #888;
    }

    #head .date {
      position: absolute;
      bottom: -44px;
      left: -10px;
      padding: 10px;
      font-size: 13px;
      color: #fff;
      background-color: #555;
      cursor: default;
    }

    #head .date:before {
      position: absolute;
      top: 0;
      left: -6px;
      width: 0;
      height: 0;
      content: " ";
      border-top: 20px solid #555;
      border-left: 6px solid transparent;
    }

    #head .date:after {
      position: absolute;
      bottom: 0;
      left: -6px;
      width: 0;
      height: 0;
      content: " ";
      border-bottom: 20px solid #555;
      border-left: 6px solid transparent;
    }

    #body {
      padding: 20px 15px 18px;
      background-color: #fff;
      border: 1px solid #ddd;
      word-break: break-all;
    }

    a {
      color: #333;
      text-decoration: none;
    }

    a:hover {
      color: #07a;
    }

    /*
     * tag
     */
    .tag {
      word-break: break-word;
    }

    .tag a {
      display: inline-block;
      margin-right: 10px;
      padding: 0 3px;
    }

    .tag a:hover {
      background-color: #f5f5f5;
    }

    .tag .cloud5 {
      color: #999 !important;
      font-size: 13px !important;
    }

    .tag .cloud5:hover {
      color: #000 !important;
    }

    .tag .cloud4 {
      color: #157586 !important;
      font-size: 15px !important;
    }

    .tag .cloud3 {
      color: #333 !important;
      font-size: 18px !important;
    }

    .tag .cloud2 {
      color: #07a !important;
      font-size: 20px !important;
      line-height: 150%;
    }

    .tag .cloud1 {
      color: #f55 !important;
      font-size: 22px !important;
      line-height: 200%;
    }

    /*
     * list
     */
    .list ul {
      margin: 0;
      padding: 0;
      border-top: 1px dotted #ddd;
    }

    .list ul li {
      padding: 12px 10px 9px;
      list-style: none;
      font-size: 14px;
      border-bottom: 1px dotted #ddd;
    }

    .list span {
      float: right;
      font-size: 13px;
    }

    .list span.cnt {
      margin-right: 11px;
      color: #07a;
    }

    .list span.date {
      color: #666;
    }

    /*
     * protected
     */

    .protected p {
      text-align: center;
    }

    .protected i {
      font-size: 20px;
      color: #555;
    }

    .protected input[type="password"] {
      margin-top: 10px;
      padding: 20px 10px;
      width: 300px;
      font-size: 13px;
      border: none;
      border-top: 1px dashed #ddd;
      border-bottom: 1px dashed #ddd;
    }

    .protected input[type="button"] {
      margin-top: 20px;
      font-size: 15px;
      border: none;
      background-color: transparent;
      cursor: pointer;
    }

    /*
     * entry
     */
    .entry {
      font-size: 16px;
    }

    .entry table {
      max-width: 100% !important;
      width: 100% !important;
    }

    .entry table.dual td {
      width: 50% !important;
      vertical-align: top;
    }

    .entry table.dual td .imageblock {
      width: 100% !important;
    }

    .entry table.dual td .imageblock span img {
      width: 100% !important;
    }

    .entry table.triple td {
      width: 33% !important;
      vertical-align: top;
    }

    .entry table.triple td .imageblock {
      width: 100% !important;
    }

    .entry table.triple td .imageblock span img {
      width: 100% !important;
    }

    .entry .imageblock {
      max-width: 100% !important;
      height: auto;
    }

    .entry .imageblock img {
      max-width: 100% !important;
      height: auto;
      vertical-align: middle;
    }

    .entry .imageblock span {
      max-width: 100% !important;
      width: 100% !important;
    }

    .entry table td .imageblock {
      width: 100% !important;
    }

    .entry .galleryControl {
      font-family: inherit !important;
    }

    .entry .tt-gallery-box {
      margin-bottom: 10px;
    }

    .entry .tt-gallery-box img {
      max-width: 100%;
      height: auto !important;
    }

    .entry .txc-info-wrap {
      overflow-x: auto;
      overflow-y: hidden;
      max-width: 500px;
      width: 100%;
      clear: both;
    }

    .entry .txc-info {
      font-size: 13px !important;
      width: 500px !important;
    }

    .entry .txc-info hr {
      max-width: 100%;
      width: 100% !important;
    }

    .entry .txc-info h3 {
      border-left: none;
      background-color: transparent;
      color: inherit;
    }

    .entry .txc-info img {
      padding: 0;
      box-shadow: none;
      border: none;
    }

    .entry .moreless_fold {
      border-top: 1px solid #eee;
      border-bottom: 1px solid #eee;
      background-color: #fcfcfc;
    }

    .entry .moreless_fold span:before {
      padding: 0 10px 0 5px;
      content: "\f107";
      font-family: "FontAwesome";
      color: #aaa;
    }

    .entry .moreless_fold span {
      display: block;
      padding: 10px 10px 8px;
    }

    .entry .moreless_top {
      border-top: 1px solid #eee;
      border-bottom: 1px solid #eee;
      background-color: #fcfcfc;
    }

    .entry .moreless_top span:before {
      padding: 0 10px 0 5px;
      content: "\f106";
      font-family: "FontAwesome";
      color: #aaa;
    }

    .entry .moreless_top span {
      display: block;
      padding: 10px 10px 8px;
    }

    .entry .moreless_content {
      padding: 10px;
      border-bottom: 1px solid #eee;
    }

    .entry .moreless_bottom {
      display: none;
    }

    .entry a.tx-link,
    .entry a.key1 {
      font-weight: 600;
      cursor: pointer;
    }

    .entry .cap1,
    .entry .galleryCaption {
      margin: 0 !important;
      padding: 0;
      max-width: 100%;
      text-align: center;
      color: #555;
      font-style: italic;
      word-break: break-all;
    }

    .entry div.footnotes {
      margin-top: 30px;
      font-size: 12px;
      border-top: 1px solid #ddd;
    }

    .entry div.footnotes ol {
      padding: 0;
      margin: 10px 0 0 30px;
      list-style: decimal-leading-zero;
    }

    .entry div.footnotes ol li a {
      color: #888;
      font-weight: 400;
    }

    .entry .entry-ccl {
      margin-top: 15px;
      margin-bottom: 0 !important;
      line-height: 0;
    }

    .entry a[href*="attachment/cfile"] {
      display: inline-block;
      position: relative;
      padding: 6px 10px 3px;
      font-size: 13px;
      color: #fafafa;
      background-color: #555;
      box-shadow: 0 0 5px #222;
    }

    .entry a[href*="attachment/cfile"]:hover {
      background-color: #444;
      text-decoration: none;
    }

    .entry a[href*="attachment/cfile"]>img {
      display: none;
    }

    .entry .another_category h4 {
      font-size: 14px !important;
    }

    .entry .another_category table th,
    .entry .another_category table td {
      font-size: 13px !important;
    }

    /*
     * tag_label
     */
    .tag_label {
      padding: 0 0 10px 70px;
      min-height: 31px;
      line-height: 100%;
      text-align: right;
      word-break: break-word;
    }

    .tag_label span {
      font-size: 0;
    }

    .tag_label a {
      margin: 0 0 0 10px;
      font-size: 13px;
      color: #777;
    }

    .tag_label a:before {
      content: "#";
    }

    .tag_label a:hover {
      color: #000;
    }

    .tag_label .locationTag {
      font-size: 13px;
    }

    /*
     * admin
     */
    .admin {
      margin-bottom: 10px;
      font-size: 11px;
      text-align: center;
      letter-spacing: 2px;
    }

    .admin a {
      color: #777;
    }

    .admin a:hover {
      color: #e55;
    }

    .admin .line {
      padding: 0 5px;
      font-size: 9px;
      color: #ddd;
    }

    /*
     * communicate
     */
    #communicate {
      margin: 0;
      padding: 0;
      clear: both;
    }

    #communicate .communicateWrite {
      margin: 0;
      padding: 0;
    }

    #communicate .communicateWrite .name {
      margin-top: 20px;
    }

    #communicate .communicateWrite .no-margin {
      margin: 0;
    }

    #communicate .communicateWrite .guest {
      margin-bottom: 20px;
    }

    #communicate .communicateWrite .guest label {
      display: block;
      padding-top: 6.5px;
      float: left;
      width: 100px;
    }

    #communicate .communicateWrite .guest input {
      padding: 10px;
      width: 300px;
      border: 1px solid #ddd;
      cursor: pointer;
    }

    #communicate .communicateWrite .textarea {
      margin-bottom: 0;
      line-height: 0;
    }

    #communicate .communicateWrite .textarea textarea {
      padding: 10px;
      width: 100%;
      height: 200px;
      line-height: 160%;
      border: 1px solid #ddd;
    }

    #communicate .communicateWrite .submit {
      margin: 0;
      float: right;
    }

    #communicate .communicateWrite .submit input {
      margin: 0;
      padding: 20px 10px 15px;
      color: #333;
      line-height: 15px;
      letter-spacing: 4px;
      background: none;
      border: none;
      border-bottom: 1px solid #ddd;
      cursor: pointer;
    }

    #communicate .communicateWrite .secret {
      position: relative;
      float: right;
      margin: 0 5px 0 0;
      padding: 20px 25px 15px 10px;
      line-height: 15px;
      letter-spacing: 2px;
      border-bottom: 1px solid #ddd;
    }

    #communicate .communicateWrite .secret label {
      cursor: pointer;
    }

    #communicate .communicateWrite .secret input {
      position: absolute;
      top: 5px;
      bottom: 0;
      left: 65px;
      margin: auto 0;
      cursor: pointer;
    }

    #communicate .communicateWrite .secret input:focus {
      border: none;
      outline: none;
    }

    #communicate .communicateWrite .guest input:focus,
    #communicate .communicateWrite .textarea textarea:focus,
    #communicate .communicateWrite .submit input:hover,
    #communicate .communicateWrite .submit input:focus {
      border-color: #B7CFF1;
    }

    #communicate .communicateList {
      margin: 0;
      padding: 0;
    }

    #communicate .communicateList ol {
      list-style: none;
      padding: 0;
      margin: 0;
    }

    #communicate .communicateList ol>li {
      border-top: 2px solid #555;
      padding: 15px 0 6px;
      border-bottom: 1px solid #ddd;
      margin-top: 20px;
    }

    #communicate .communicateList ol li>div {
      position: relative;
    }

    #communicate .communicateList ol li {
      background-color: #fff;
    }

    #communicate .communicateList ul {
      margin: 0;
      padding: 0;
    }

    #communicate .communicateList ul li {
      list-style: none;
      padding: 15px 0 0;
      margin-top: 10px;
      border-top: 1px dotted #ddd;
    }

    #communicate .communicateList li>div {
      padding: 0 10px;
    }

    #communicate .communicateList li .rp_secret p,
    #communicate .communicateList li .guest_secret p {
      color: #6C75AD;
    }

    #communicate .communicateList div img[src*="index"] {
      border-radius: 10px;
      width: 30px;
      height: 30px;
      z-index: 2;
      background-color: #f9f9f9;
      vertical-align: middle;
    }

    #communicate .communicateList div img[src*="favicon"] {
      vertical-align: middle;
      margin-top: -2px;
    }

    #communicate .communicateList .name {
      font-weight: 400;
      float: left;
    }

    #communicate .communicateList .date {
      font-size: 13px;
      float: right;
      font-style: italic;
      color: #777;
    }

    #communicate .communicateList p {
      margin: 10px 0;
      padding: 0;
      line-height: 180%;
    }

    #communicate .communicateList .control {
      width: 100%;
      text-align: right;
      font-style: italic;
      font-size: 13px;
      line-height: 100%;
    }

    #communicate .communicateList .control a {
      margin: 0 0 0 5px;
      color: #555;
      display: inline-block;
      padding: 10px 5px;
    }

    #communicate .communicateList .tistoryProfileLayerTrigger {
      margin-bottom: -1px;
    }

    #communicate .communicateList .tt_more_preview_comments_wrap {
      text-align: center;
      cursor: pointer;
      padding: 17px 0 15px;
      font-weight: 400;
      color: #333;
    }

    /*
     * paging
     */
    #paging {
      padding: 30px 0 20px;
      line-height: 200%;
      text-align: center;
      cursor: default;
    }

    #paging a {
      display: inline-block;
      margin: 0 5px 10px;
      padding: 0 5px;
    }

    #paging .no-more-prev,
    #paging .no-more-next {
      color: #aaa;
      cursor: default;
    }

    #paging .selected {
      cursor: default;
      color: #07a;
    }

    /*
     * recent-post
     */
    #recent-post {
      padding: 70px 0 30px;
    }

    #recent-post h4 {
      margin: 0 1% 10px;
      padding: 0;
      font-size: 16px;
      font-weight: 400;
    }

    #recent-post ul {
      margin: 0;
      padding: 0;
      list-style: none;
    }

    #recent-post ul li {
      position: relative;
      float: left;
      margin: 0;
      width: 25%;
      height: 150px;
      overflow: hidden;
      background-image: url('./images/recent-post-bg.png');
      background-color: #eee;
    }

    #recent-post ul li img {
      max-width: 100%;
      width: 100%;
      min-height: 100%;
      vertical-align: middle;
      object-fit: cover;
    }

    #recent-post ul li img[src*="common_icon"] {
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
      /* IE 8 */
      filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
      /* IE 7 and olders */
      opacity: 0.5;
      -webkit-filter: grayscale(1);
      -moz-filter: grayscale(1);
      -ms-filter: grayscale(1);
      -o-filter: grayscale(1);
      filter: grayscale(1);
    }

    #recent-post ul li .title {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      text-align: center;
      line-height: 155px;
      background-color: #555;
      color: #fff;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
      /* IE 8 */
      filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
      /* IE 7 and olders */
      opacity: 0;
      -webkit-transition: opacity 0.2s;
      -moz-transition: opacity 0.2s;
      -ms-transition: opacity 0.2s;
      -o-transition: opacity 0.2s;
      transition: opacity 0.2s;
    }

    #recent-post ul li:hover .title {
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
      /* IE 8 */
      filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
      /* IE 7 and olders */
      opacity: 0.9;
    }

    /*
     * foot
     */
    #foot {
      position: relative;
      width: 100%;
      height: 100px;
      text-shadow: 1px 1px #fff;
      cursor: default;
    }

    #foot a {
      color: #000;
      text-decoration: none;
      border-bottom: 1px dotted #aaa;
    }

    #foot a:hover {
      color: #888;
    }

    #foot .powered,
    #foot .social {
      position: absolute;
      bottom: 20px;
      font-size: 12px;
    }

    #foot .powered {
      right: 1%;
    }

    #foot .social {
      left: 1%;
    }

    /*
     * responsive
     */
    .responsive-video {
      position: relative;
      padding-bottom: 56.25%;
      width: 100%;
    }

    .responsive-video iframe,
    .responsive-video video {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
    }

    #sidebar-toggle {
      display: none;
    }

    @media all and (max-width: 959px) {
      #sidebar {
        z-index: 100;
        -webkit-transform: translate3d(-300px, 0, 0);
        -moz-transform: translate3d(-300px, 0, 0);
        transform: translate3d(-300px, 0, 0);
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
      }

      #recent-post ul li .title {
        opacity: 0.9;
        top: inherit;
        bottom: 0;
        height: 50px;
        line-height: 53px;
      }

      #recent-post ul li:nth-child(2n+0) .title {
        background-color: #333;
      }

      #sidebar-toggle {
        display: block;
        position: fixed;
        left: 15px;
        bottom: 15px;
        width: 50px;
        height: 50px;
        line-height: 50px;
        text-align: center;
        color: #fff;
        background-color: #07a;
        border-radius: 50%;
        opacity: 0.9;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
        z-index: 101;
        cursor: pointer;
      }

      #sidebar-toggle:hover {
        opacity: 1;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
      }

      html.open #sidebar {
        overflow-y: auto;
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
      }

      html.open,
      html.open body {
        overflow: hidden;
      }

      #content {
        margin: 0 auto;
        padding: 0 15px;
      }

      #content-inner {
        padding: 0;
        width: 100%;
      }

      #head .date {
        bottom: -10px;
        right: 0;
        left: inherit;
        padding: 8px 5px 6px;
        font-size: 11px;
      }

      .tag_label {
        padding: 0 0 10px 0;
      }
    }

    @media all and (max-width: 639px) {
      .list ul li a {
        display: block;
      }

      #communicate .communicateWrite .guest label {
        padding: 0 0 5px 0;
        float: none;
        width: 100%;
      }

      #communicate .communicateWrite .guest input {
        width: 100%;
      }

      #communicate .communicateList .control {
        font-size: 12px;
      }

      #recent-post ul li {
        width: 100%;
        height: 200px;
      }

      #foot .powered {
        position: absolute;
        right: 0;
        bottom: 45px;
        width: 100%;
        text-align: center;
      }

      #foot .social {
        position: absolute;
        left: 0;
        bottom: 20px;
        width: 100%;
        text-align: center;
      }
    }

    @media all and (min-width: 960px) {
      #sidebar-toggle {
        display: none;
      }
    }

    .tt-comment-cont .tt-box-total .tt_txt_g {
      font-size: 14px;
    }

    .tt-comment-cont .tt-box-total .tt_num_g {
      font-size: 14px;
      color: #222;
    }

    .tt-comment-cont .tt-wrap-cmt .tt-link-user {
      font-size: 14px;
    }

    .tt-comment-cont .tt-wrap-cmt .tt_desc {
      font-size: 14px;
      color: #000;
    }

    .tt-comment-cont .tt-txt-mention {
      color: #000;
    }

    .tt-comment-cont .tt-btn_register {
      width: 100px;
      height: 36px;
      background-color: #fff;
      font-size: 14px;
      color: #222;
      border-radius: 0;
      border-color: #dcdcdc;
    }

    .tt-comment-cont .tt-btn_register:hover {
      background-color: #fff;
      border-color: #222;
    }

    .tt-comment-cont .tt-btn_register:focus {
      background-color: #fff;
      border-color: #222;
    }

    #article-view p a {
      color: #0070d1;
      text-decoration: underline;
    }

    /* 전체 공통 */
    #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;
    }

    /* 텍스트 관련 */
    #article-view h2[data-ke-size] {
      font-size: 1.62em;
      line-height: 2.5;
      margin-bottom: 10px;
    }

    #article-view h3[data-ke-size] {
      font-size: 1.44em;
      line-height: 2.5;
      margin-bottom: 10px;
    }

    #article-view h4[data-ke-size] {
      font-size: 1.25em;
      line-height: 2.5;
      margin-bottom: 10px;
    }

    #article-view p[data-ke-size='size18'] {
      font-size: 1.12em;
      line-height: 2.5;
      margin-bottom: 10px;
    }

    #article-view p[data-ke-size='size16'] {
      line-height: 2.5;
      margin-bottom: 10px;
    }

    #article-view p[data-ke-size='size14'] {
      font-size: 0.87em;
      line-height: 2.5;
      margin-bottom: 10px;
    }

    #article-view h2,
    #article-view h3,
    #article-view h4 {
      font-weight: normal;
      letter-spacing: -1px;
      color: #000;
      margin: 1em 0 20px;
    }

    #article-view p {
      margin-bottom: 20px;
      line-height: 1.8;
    }

    #article-view p+p {
      margin-top: 0;
    }

    #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;
    }

    /* 인용문 */
    #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;
    }

    /* 첨부: 공통 */

    /* 이미지 클릭 관련 - lightbox */
    #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: 0px;
      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: pre-wrap;
      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;
    }

    /* 첨부: 이미지 */
    #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;
    }

    /* 첨부: 이미지 그리드 */
    #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%;
    }

    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;

    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;
    }

    /* 테이블 */
    #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;
    }

    #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;
    }

    /* 오픈 그래프 */
    #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: pre-wrap;
      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;
      }
    }

    /* 비디오 첨부 */
    #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%;
    }

    /* 코드 블럭 */
    #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;
    }

    /* 접은 글 */
    #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;
    }

    /* 리스트 */
    #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;
    }

    /* 이모티콘 */
    #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;
    }

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

    /* 첨부: 이미지 슬라이드 */
    #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;
      width: 100%;
      max-width: 100%;
      min-height: 200px;
      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-height: 150px;
      }

      #article-view figure.imageslideblock div.image-container .btn {
        width: 40px;
      }

      #article-view figure.imageslideblock div.image-container .btn span {
        opacity: 0.5;
      }
    }

    /* 구 에디터 속성 */
    .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;
    }
    /* 라이트박스 스타일 */
    .lightbox {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.8);
      z-index: 1000;
      display: none;
    }

    .lightbox-content {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      max-width: 90%;
      max-height: 90%;
    }

    .lightbox-content img {
      max-width: 100%;
      max-height: 90vh;
      border: 5px solid #fff;
      box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
    }

    .lightbox-close {
      position: absolute;
      top: 20px;
      right: 20px;
      color: #fff;
      font-size: 30px;
      cursor: pointer;
      width: 40px;
      height: 40px;
      line-height: 40px;
      text-align: center;
      background-color: rgba(0, 0, 0, 0.5);
      border-radius: 50%;
    }

    .lightbox-close:hover {
      background-color: rgba(0, 0, 0, 0.8);
    }

    /* 테이블 반응형 처리 */
    .table-responsive {
      width: 100%;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
      margin: 20px 0;
    }

    /* FontAwesome 아이콘 업데이트 */
    .entry .moreless_fold span:before {
      font-family: "Font Awesome 6 Free";
      content: "\f107";
      font-weight: 900;
    }

    .entry .moreless_top span:before {
      font-family: "Font Awesome 6 Free";
      content: "\f106";
      font-weight: 900;
    }

    #sidebar .category ul li ul li ul li:before {
      font-family: "Font Awesome 6 Free";
      content: "\f0da";
      font-weight: 900;
    }

    /* 이미지 개선 스타일 */
    #article-view figure.imageblock img {
      transition: transform 0.3s ease;
      cursor: pointer;
    }

    #article-view figure.imageblock img:hover {
      transform: scale(1.02);
    }

    #article-view figure.imageblock.alignCenter {
      margin: 20px auto;
    }

    /* 사이드바 개선 */
    #sidebar::-webkit-scrollbar {
      width: 6px;
    }

    #sidebar::-webkit-scrollbar-track {
      background: #f1f1f1;
    }

    #sidebar::-webkit-scrollbar-thumb {
      background: #888;
      border-radius: 10px;
    }

    #sidebar::-webkit-scrollbar-thumb:hover {
      background: #555;
    }

    /* 모바일 메뉴 개선 */
    @media (max-width: 959px) {
      /* 사이드바 개선 */
      html.open #sidebar {
        box-shadow: 2px 0 10px rgba(0, 0, 0, 0.2);
      }

      /* 토글 버튼 효과 */
      #sidebar-toggle {
        transition: all 0.3s ease;
      }

      #sidebar-toggle:active {
        transform: scale(0.95);
      }

      /* 모바일 메뉴 선택 효과 개선 */
      #sidebar .category ul li a:active {
        background-color: #f8f8f8;
      }

      /* 모바일에서 링크 탭 영역 확장 */
      #sidebar .widget li a {
        display: block;
        padding: 5px 0;
      }

      /* 사이드바 열렸을 때 본문 어둡게 */
      html.open:before {
        content: "";
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: rgba(0, 0, 0, 0.5);
        z-index: 99;
      }
    }

    /* 태그 및 카테고리 개선 */
    .tag a {
      transition: all 0.3s ease;
      border-radius: 3px;
    }

    .tag a:hover {
      background-color: #07a;
      color: #fff !important;
      padding: 0 6px;
    }

    /* 검색 입력 필드 개선 */
    #sidebar .search input {
      transition: all 0.3s ease;
      border-radius: 0;
      padding: 10px;
      width: 80%;
    }

    #sidebar .search input:focus {
      border-color: #07a;
      width: 90%;
    }

    /* 이미지 및 비디오 개선 */
    .responsive-video {
      border-radius: 5px;
      overflow: hidden;
      box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    }

    /* 코드 블록 개선 */
    #article-view pre code.hljs {
      border-radius: 5px;
      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    }

    /* 버튼 스타일 개선 */
    .protected input[type="button"] {
      transition: all 0.3s ease;
      padding: 10px 20px;
      border-radius: 3px;
      background-color: #07a;
      color: #fff;
    }

    .protected input[type="button"]:hover {
      background-color: #058;
    }

    /* 댓글 영역 개선 */
    #communicate .communicateWrite .textarea textarea {
      border-radius: 3px;
      transition: all 0.3s ease;
    }

    #communicate .communicateWrite .guest input {
      border-radius: 3px;
      transition: all 0.3s ease;
    }

    #communicate .communicateWrite .submit input {
      transition: all 0.3s ease;
      color: #07a;
    }

    #communicate .communicateWrite .submit input:hover {
      color: #058;
    }

    /* 페이지네이션 개선 */
    #paging a {
      transition: all 0.3s ease;
      border-radius: 3px;
      padding: 3px 10px;
    }

    #paging a:hover:not(.no-more-prev):not(.no-more-next) {
      background-color: #f5f5f5;
    }

    #paging .selected {
      background-color: #07a;
      color: #fff !important;
    }

    /* 접은 글 버튼 개선 */
    .btn-toggle-moreless {
      display: inline-block;
      padding: 5px 15px;
      border-radius: 3px;
      background-color: #f8f8f8;
      transition: all 0.3s ease;
    }

    .btn-toggle-moreless:hover {
      background-color: #eee;
    }

    /* 이미지 슬라이드 개선 */
    #article-view figure.imageslideblock div.image-container {
      border-radius: 5px;
      overflow: hidden;
    }

    #article-view figure.imageslideblock div.image-container .btn span {
      border-radius: 50%;
      background-color: rgba(255, 255, 255, 0.3);
    }

    /* 최근 게시물 섹션 개선 */
    #recent-post ul li {
      transition: all 0.3s ease;
      border-radius: 5px;
      overflow: hidden;
    }

    #recent-post ul li:hover {
      transform: translateY(-5px);
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    }

    /* 인용구 개선 */
    #article-view blockquote[data-ke-style='style2'],
    #article-view blockquote[data-ke-style='style3'] {
      border-radius: 3px;
    }

    /* 푸터 링크 개선 */
    #foot a {
      transition: all 0.3s ease;
    }

    #foot a:hover {
      border-color: #07a;
    }

    /* 헤더 개선 */
    #head h2 {
      transition: all 0.3s ease;
    }

    #head h2:hover {
      border-color: #07a;
    }

    /* 애니메이션 효과 */
    @keyframes fadeIn {
      from { opacity: 0; }
      to { opacity: 1; }
    }

    #content-inner {
      animation: fadeIn 0.5s ease-in-out;
    }

    /* 접근성 개선 */
    a:focus {
      outline: 2px solid #07a;
      outline-offset: 2px;
    }

    input:focus, textarea:focus {
      outline: 2px solid #07a;
      outline-offset: 2px;
    }

    /* 다크 모드 지원 (선택적) */
    @media (prefers-color-scheme: dark) {
      .dark-mode-enabled {
        /* 다크 모드가 활성화된 경우에만 적용될 스타일 */
        /* 예:
        html, body {
          background-color: #222;
          color: #eee;
        }
        */
      }
    }

    /* 이미지 확대 시 다크 오버레이 */
    .entry .imageblock:hover::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: rgba(0, 0, 0, 0.1);
      pointer-events: none;
    }

    /* 모바일에서 테이블 스크롤 표시 */
    @media (max-width: 639px) {
      .table-responsive::after {
        content: '\f0ec';
        font-family: "Font Awesome 6 Free";
        font-weight: 900;
        position: absolute;
        right: 10px;
        bottom: 10px;
        color: #07a;
        background: rgba(255, 255, 255, 0.8);
        padding: 5px;
        border-radius: 50%;
        font-size: 12px;
        opacity: 0.7;
        animation: fadeInOut 2s infinite;
      }

      @keyframes fadeInOut {
        0%, 100% { opacity: 0.3; }
        50% { opacity: 0.8; }
      }