@charset "utf-8";

/*
 *
 * CSS CONTENTS:
 *
 * 01. Web Font
 * 02. Type Selector Reset
 * 03. Accessibility Navigation
 * 04. Layout Selector
 * 05. Components
 * 06. Entry Content
 * 07. Comment
 * 08. Widget & Template Page
 * 09. ETC
 * 10. Column & Color Type
 * 11. Retina Display
 * 12. Media Screen - Tablet
 * 13. Media Screen - Mobie
 *
 */


/* Type Selector Reset */
body {
  -webkit-text-size-adjust: 100%;
  font-weight: 400;
  font-family: Pretendard-Regular, sans-serif;
  font-size: 1em;
  line-height: 1.25;
}

html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  font-size: 100%;
}

div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, figure {
  margin: 0;
  padding: 0;
}

header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption {
  display: block;
}

button, input[type=submit], input[type=reset], input[type=button] {
  overflow: visible;
  cursor: pointer;
}

input[type=text], input[type=email], input[type=password], input[type=submit], textarea {
  -webkit-appearance: none;
}

input, select, textarea, button {
  font-family: Pretendard-Regular, sans-serif;
  font-size: 100%;
  border-radius: 0;
}

button {
  overflow: visible;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

ul li {
  list-style: none;
}

img, fieldset {
  border: none;
  vertical-align: top;
}

hr {
  display: none;
}

/* Accessibility Navigation */
#acc-nav {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100%;
  height: 0;
}

#acc-nav a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  width: 1px;
  height: 1px;
  margin-left: -1px;
  margin-bottom: -1px;
  text-align: center;
  font-weight: bold;
  font-size: 0.875em;
  color: #000;
  white-space: nowrap;
}

#acc-nav a:focus, #acc-nav a:hover, #acc-nav a:active {
  width: 100%;
  height: auto;
  padding: 10px 0;
  background: #000;
  color: #fff;
  z-index: 1000;
}

/* Layout Selector */
#wrap {
  position: relative;
}

#header {
  position: relative;
  border-bottom: 1px solid #e6e6e6;
}

#header .inner {
  max-width: 1200px;
  margin: 0 auto;
}

#header .inner:after {
  content: "";
  clear: both;
  display: block;
  height: 0;
  visibility: hidden;
}

#header h1 {
  float: left;
  max-width: 500px;
  overflow: hidden;
  padding: 26px 0;
  font-size: 1.25em;
  line-height: 28px;
  letter-spacing: 0.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#header h1 a {
  display: inline-block;
  vertical-align: top;
  text-decoration: none;
  color: #7a583a;
}

#header h1 img {
  width: auto;
  height: 28px;
}

#header .mobile-menu {
  display: none;
}

#gnb {
  position: relative;
  float: right;
}

#gnb ul li {
  float: left;
  padding: 26px 16px;
  font-size: 0.875em;
}

#gnb ul li a {
  display: block;
  position: relative;
  padding: 0 4px;
  text-decoration: none;
  line-height: 28px;
  color: #000;
}

#gnb ul li a:hover {
  color: #7a583a;
}

#gnb ul li a:hover:after {
  content: "";
  display: block;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 4px;
  margin-top: 22px;
  background-color: #7a583a;
}

#content .inner {
  overflow: hidden;
  max-width: 860px;
  margin: 0 auto;
}

#aside {
  margin-top: 120px;
  padding: 57px 0 24px;
  border-top: 1px solid #e6e6e6;
}

#aside .inner {
  overflow: hidden;
  max-width: 1200px;
  margin: 0 auto;
}

#aside h2 {
  margin-bottom: 6px;
  font-size: 1em;
  color: #666;
}

#aside .sidebar-1 {
  float: left;
  width: 25%;
  min-height: 10px;
  padding-right: 36px;
  box-sizing: border-box;
}

#aside .sidebar-2 {
  float: left;
  width: 50%;
  min-height: 10px;
  margin: 0 0 40px;
  padding: 0 12px;
  box-sizing: border-box;
}

#aside .sidebar-3 {
  float: left;
  width: 25%;
  min-height: 10px;
  padding-left: 36px;
  box-sizing: border-box;
}

#aside .posts {
  margin-bottom: 56px;
}

#aside .posts li {
  border-bottom: 1px solid #e6e6e6;
}

#aside .posts li a {
  display: block;
  overflow: hidden;
  width: 100%;
  padding: 8px 0;
  text-overflow: ellipsis;
  text-decoration: none;
  white-space: nowrap;
  font-size: 0.875em;
  line-height: 1.5714;
  color: #b2b2b2;
}

#aside .posts li a:hover {
  color: #7a583a;
}

#aside .tags {
  margin: 0 0 40px;
}

#aside .tags h2 {
  margin-bottom: 10px;
}

#aside .tags .items {
  margin-bottom: 5px;
}

#aside .tags .more {
  text-decoration: none;
  font-size: 12px;
  line-height: 2;
  color: #d4bca7;
}

#aside .tags .more:after {
  content: "";
  display: inline-block;
  width: 4px;
  height: 8px;
  margin-left: 6px;
  background: url(./images/ico_package.png) no-repeat 0 -300px;
  vertical-align: baseline;
}

#aside .tags .more:hover {
  color: #7a583a;
}

#aside .tags .more:hover:after {
  background-position-x: -50px;
}

#aside .search {
  margin-bottom: 57px;
}

#aside .search fieldset {
  position: relative;
  margin-top: 19px;
  padding-right: 38px;
  border: 1px solid #e6e6e6;
}

#aside .search input {
  width: 100%;
  height: 38px;
  padding: 0 10px;
  border: 0;
  font-size: 0.875em;
  line-height: 1.5714;
  color: #b2b2b2;
  box-sizing: border-box;
}

#aside .search input::-webkit-input-placeholder {
  color: #d6d6d6;
}

#aside .search button {
  position: absolute;
  top: 0;
  right: 0;
  width: 38px;
  height: 38px;
  background: url(./images/ico_package.png) no-repeat 13px -337px;
  text-align: left;
  text-indent: -999em;
}

#aside .search button:hover,
#aside .search button:focus,
#aside .search input:focus+button {
  background-position-x: -37px;
}

#aside .count {
  margin: 0 0 40px;
}

#aside .count .total {
  margin: 11px 0 2px;
  font-size: 1.875em;
  color: #7a583a;
}

#aside .count ul li {
  overflow: hidden;
  padding: 4px 0;
  border-bottom: 1px solid #e6e6e6;
  text-align: right;
  font-size: 0.875em;
  line-height: 2.1428;
  color: #b2b2b2;
}

#aside .count ul li strong {
  float: left;
  font-weight: normal;
}

#footer {
  padding: 18px 0;
  background-color: #f0f0f0;
}

#footer .copyright {
  text-align: center;
  font-size: 0.75em;
  color: #999;
}

#footer a {
  text-decoration: none;
  color: #7a583a;
}

#footer .admin:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 11px;
  margin: 1px 9px 2px;
  background-color: #b2b2b2;
  vertical-align: middle;
}

/* Components */
.btn, a.btn {
  display: inline-block;
  position: relative;
  width: 158px;
  padding: 0 10px;
  border: 1px solid #7a583a;
  text-decoration: none;
  text-align: left;
  font-size: 12px;
  line-height: 38px;
  color: #7a583a;
  -webkit-transition: color .2s, background-color .2s;
  transition: color .2s, background-color .2s;
}

.btn:hover {
  background-color: #7a583a;
  border-color: #7a583a;
  color: #fff;
}

.btn:hover:after {
  background-position-x: 0;
}

.cover-slider {
  position: relative;
  overflow: hidden;
  height: 0;
  padding-bottom: 40%;
  margin: -1px 0 80px;
  width: 100%;
}

.cover-slider .prev,
.cover-slider .next {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 20;
  width: 49px;
  height: 83px;
  margin-top: -42px;
  background-image: url(./images/ico_package.png);
  background-repeat: no-repeat;
  text-indent: -999em;
}

.cover-slider .prev {
  margin-left: -600px;
  background-position: 0 -200px;
}

.cover-slider .prev:hover {
  background-position-x: -100px
}

.cover-slider .next {
  margin-left: 551px;
  background-position: -50px -200px;
}

.cover-slider .next:hover {
  background-position-x: -150px
}

.cover-slider .paging {
  position: absolute;
  left: 0;
  bottom: 30px;
  z-index: 20;
  width: 100%;
  text-align: center;
}

.cover-slider .paging button {
  display: inline-block;
  overflow: hidden;
  width: 20px;
  height: 1px;
  margin: 0 5px;
  background-color: #b2b2b2;
  text-indent: -999em;
  vertical-align: bottom;
}

.cover-slider .paging .current {
  height: 5px;
  margin-top: 0;
  background-color: #333;
}

.cover-slider ul {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.cover-slider ul li {
  display: table;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: 50% 50%;
}

.cover-slider ul li .text-box {
  display: table-cell;
  background-color: rgba(0, 0, 0, 0.25);
  text-align: center;
  vertical-align: middle;
  font-weight: 100;
  text-decoration: none;
}

.cover-slider ul li .text-box strong {
  font-weight: 700;
}

.cover-slider ul li .text-box .title {
  display: block;
  margin-bottom: 40px;
  text-shadow: 0 0 24px rgba(0, 0, 0, 0.4);
  font-size: 3.75em;
  line-height: 1;
  color: #fff;
}

.cover-slider ul li .text-box .title em {
  display: block;
  margin-bottom: 15px;
  text-shadow: 0 0 24px rgba(0, 0, 0, 0.4);
  font-style: normal;
  font-size: 0.5em;
  line-height: 1;
  color: #fff;
}

.cover-slider ul li .text-box .btn {
  z-index: 10;
  border-color: #fff;
  color: #fff;
  background-color: rgba(170, 170, 170, 0.1);
  box-shadow: 0 0 24px rgba(170, 170, 170, 0.3);
}

.cover-slider ul li .text-box .btn:after {
  background-position-x: 0;
}

.cover-slider ul li .text-box .btn:hover {
  background-color: #fff;
  color: #7a583a;
}

.cover-slider ul li .text-box .btn:hover:after {
  background-position-x: -100px;
}

.cover-slider.slide-on ul li {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}

.cover-thumbnail-list-1 {
  overflow: hidden;
  max-width: 1200px;
  margin: 80px auto 71px;
  box-sizing: border-box;
}

.cover-thumbnail-list-1 h2 {
  float: left;
  width: 24%;
  font-weight: 300;
  font-size: 1.875em;
  line-height: 1.3333;
  color: #7a583a;
}

.cover-thumbnail-list-1 h2:after {
  content: "";
  display: block;
  width: 30px;
  height: 1px;
  margin-top: 31px;
  background-color: #7a583a;
}

.cover-thumbnail-list-1 h2 em {
  display: block;
  margin-bottom: 10px;
  font-style: normal;
  font-weight: 700;
  font-size: 0.4666em;
  color: #000;
}

.cover-thumbnail-list-1 ul {
  float: left;
  width: 76%;
}

.cover-thumbnail-list-1 ul li {
  float: left;
  width: 33.3333%;
  padding-left: 16px;
  text-align: center;
  font-size: 0.875em;
  line-height: 2.25;
  color: #666;
  box-sizing: border-box;
}

.cover-thumbnail-list-1 ul li a {
  display: block;
  text-decoration: none;
  color: #666;
  -webkit-transition: color .2s;
  transition: color .2s;
}

.cover-thumbnail-list-1 ul li .thum {
  display: block;
  margin-bottom: 7px;
  position: relative;
}

.cover-thumbnail-list-1 ul li .thum img {
  width: 100%;
  height: auto;
}

.cover-thumbnail-list-1 ul li .title {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.cover-thumbnail-list-1 ul li a:hover {
  color: #000;
}

.cover-thumbnail-list-1 ul li .thum:before {
  content: "";
  background-color: rgba(255, 255, 255, 0);
  -webkit-transition: background-color .5s;
  transition: background-color .5s;
}

.cover-thumbnail-list-1 ul li a:hover .thum:before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.5);
}

.cover-special-contents {
  max-width: 1200px;
  margin: 71px auto 80px;
}

.cover-special-contents ul li {
  position: relative;
  overflow: hidden;
  text-align: center;
}

.cover-special-contents ul li .thum {
  display: block;
  float: left;
  width: 50%;
}

.cover-special-contents ul li .thum img {
  max-width: 100%;
  height: auto;
}

.cover-special-contents ul li .box {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 50%;
  margin-top: -230px;
}

.cover-special-contents ul li:nth-child(even) .thum {
  float: right;
}

.cover-special-contents ul li:nth-child(even) .box {
  left: 0;
}

.cover-special-contents ul li .category {
  display: block;
  margin: 0 0 17px;
  font-weight: 700;
  font-size: 0.875em;
  color: #7a583a;
}

.cover-special-contents ul li .title {
  display: block;
  margin: 0 0 32px;
  font-weight: 300;
  font-size: 1.875em;
  line-height: 1.3333;
  color: #7a583a;
}

.cover-special-contents ul li .title:after {
  content: "";
  display: block;
  width: 40px;
  height: 1px;
  margin: 33px auto 0;
  background-color: #7a583a;
}

.cover-special-contents ul li .excerpt {
  display: block;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
  height: 12.8568em;
  margin-bottom: 51px;
  padding: 0 21%;
  font-size: 0.875em;
  line-height: 2.1428;
  text-overflow: ellipsis;
  color: #666;
}

.cover-wide-panel {
  max-width: 1200px;
  margin: 80px auto 120px;
}

.cover-wide-panel .bg {
  height: 300px;
  background-position: 50% 50%;
  background-size: cover;
}

.cover-wide-panel .box {
  max-width: 1000px;
  margin: -100px auto 0;
  padding-top: 58px;
  text-align: center;
  background-color: #fff;
}

.cover-wide-panel .category {
  display: block;
  margin-bottom: 9px;
  font-weight: 700;
  font-size: 0.875em;
  color: #7a583a;
}

.cover-wide-panel h2 {
  display: block;
  margin-bottom: 32px;
  padding: 2px 0 3px;
  font-weight: 300;
  font-size: 1.875em;
  line-height: 1.3333;
  color: #7a583a;
}

.cover-wide-panel h2:after {
  content: "";
  display: block;
  width: 40px;
  height: 1px;
  margin: 33px auto 0;
  background-color: #7a583a;
}

.cover-wide-panel p {
  display: block;
  margin-bottom: 48px;
  padding: 0 125px;
  font-size: 0.875em;
  line-height: 2.1428;
  color: #666;
}

.post-header {
  position: relative;
  z-index: 10;
  overflow: hidden;
  max-width: 860px;
  margin: 40px auto 0;
  border-bottom: 1px solid #7a583a;
  text-align: left;
  color: #7a583a;
}

.post-header:first-child {
  margin-top: 75px;
}

.post-header h2 {
  display: inline-block;
  font-size: 0.875em;
  line-height: 40px;
  vertical-align: top;
}

.post-header .list-type {
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -15px;
}

.post-header .list-type button {
  float: left;
  width: 30px;
  height: 30px;
  margin: 0 0 0 5px;
  border: 1px solid #D4BCA7;
  background-image: url(./images/ico_package.png);
  text-indent: -999em;
  box-sizing: border-box;
}

.post-header .list-type .thum {
  background-position: 0 -100px;
}

.post-header .list-type .thum:hover,
.post-header .list-type .thum.current {
  background-position: -100px -100px;
  outline: none;
}

.post-header .list-type .list {
  background-position: -50px -100px;
  outline: none;
}

.post-header .list-type .list:hover,
.post-header .list-type .list.current {
  background-position: -150px -100px;
  outline: none;
}

.post-item {
  float: left;
  width: 23.255813953488372%;
  padding: 20px 0 33px 2.325581395348837%;
  border-bottom: 1px solid #e6e6e6;
}

.post-item:nth-child(4n+1) {
  padding-left: 0;
}

.cover-thumbnail-list-2 {
  overflow: hidden;
  max-width: 1200px;
  margin: 0 auto 40px;
}

.cover-thumbnail-list-2 h2 {
  position: relative;
  z-index: 10;
  overflow: hidden;
  max-width: 1200px;
  margin: 0 auto;
  border-top: 1px solid #7a583a;
  border-bottom: 1px solid #7a583a;
  text-align: center;
  font-size: 0.875em;
  line-height: 40px;
  color: #7a583a;
}

.cover-thumbnail-list-2 ul {
  margin-left: -16px;
}

.cover-thumbnail-list-2 ul li {
  float: left;
  width: 25%;
  padding: 20px 0 33px 16px;
  box-sizing: border-box;
}

.post-item .thum,
.cover-thumbnail-list-2 ul li .thum {
  display: block;
  position: relative;
  overflow: hidden;
  height: 0;
  margin-bottom: 17px;
  padding-bottom: 98.4848%;
  background-color: #ebebeb;
}

.post-item .thum:before,
.cover-thumbnail-list-2 ul li .thum:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 0;
  width: 22px;
  height: 18px;
  margin: -9px 0 0 -11px;
  background: url(./images/ico_package.png) no-repeat -150px -300px;
}

.post-item .thum img,
.cover-thumbnail-list-2 ul li .thum img {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  height: 100%;
}

.post-item a,
.cover-thumbnail-list-2 ul li a {
  display: block;
  text-decoration: none;
}

.post-item .title,
.cover-thumbnail-list-2 ul li .title {
  display: block;
  overflow: hidden;
  width: 90%;
  margin-bottom: 2px;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 700;
  font-size: 1em;
  color: #000;
  -webkit-transition: color .2s;
  transition: color .2s;
}

.post-item .excerpt,
.cover-thumbnail-list-2 ul li .excerpt {
  display: block;
  display: -webkit-box;
  overflow: hidden;
  width: 90%;
  height: 4.125rem;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 16px;
  text-overflow: ellipsis;
  font-size: 0.875em;
  line-height: 1.375rem;
  color: #666;
  -webkit-transition: color .2s;
  transition: color .2s;
}

.post-item .excerpt.protected:before,
.cover-thumbnail-list-2 ul li .excerpt.protected:before {
  content: "";
  display: inline-block;
  width: 9px;
  height: 13px;
  margin-right: 10px;
  background: url(./images/ico_package.png) no-repeat -100px -350px;
  vertical-align: middle;
}

.post-item .more,
.cover-thumbnail-list-2 ul li .more {
  display: inline-block;
  font-size: 0.75em;
  color: #d4bca7;
  vertical-align: top;
}

.post-item .more:after,
.cover-thumbnail-list-2 ul li .more:after {
  content: "";
  display: inline-block;
  width: 4px;
  height: 8px;
  margin: 3px 0 4px 6px;
  background: url(./images/ico_package.png) no-repeat 0 -300px;
  vertical-align: top;
}

.post-item .thum:after,
.cover-thumbnail-list-2 ul li .thum:after {
  content: "";
  background-color: rgba(255, 255, 255, 0);
  -webkit-transition: background-color .5s;
  transition: background-color .5s;
}

.post-item a:hover .thum:after,
.cover-thumbnail-list-2 ul li a:hover .thum:after {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.5);
}

.post-item a:hover .title,
.cover-thumbnail-list-2 ul li a:hover .title {
  color: #7a583a;
}

.post-item a:hover .excerpt,
.cover-thumbnail-list-2 ul li a:hover .excerpt {
  color: #000;
}

.post-item a:hover .more,
.cover-thumbnail-list-2 ul li a:hover .more {
  color: #7A583A;
}

.post-item a:hover .more:after,
.cover-thumbnail-list-2 ul li a:hover .more:after {
  background-position-x: -50px;
}

.post-type-text .post-item {
  float: none;
  width: auto;
  margin-left: 0;
  padding: 28px 0;
}

.post-type-text .post-item a {
  overflow: hidden;
  width: 100%;
}

.post-type-text .post-item .thum {
  float: right;
  width: 210px;
  height: 148px;
  margin: 0 0 0 78px;
  padding-bottom: 0;
}

.post-type-text .post-item .thum:before {
  display: none;
}

.post-type-text .post-item .thum img {
  position: relative;
  width: 100%;
  height: auto;
  margin: -29px 0 0;
}

.post-type-text .post-item .title {
  width: auto;
  margin-bottom: 3px;
  padding: 10px 0 0;
  font-size: 1.125em;
}

.post-type-text .post-item .excerpt {
  width: auto;
}

.post-type-text .post-item .more {
  line-height: 1.25;
}

.hgroup {
  max-width: 1200px;
  margin: 0 auto 60px;
  padding: 78px 0 40px;
  border-bottom: 1px solid #7a583a;
}

.hgroup .category {
  margin-bottom: 8px;
  font-weight: 700;
  font-size: 0.875em;
  color: #000;
}

.hgroup h1 {
  font-size: 1.5em;
  font-weight: 400;
  line-height: 1.0666;
  color: #7a583a;
}

.hgroup .post-meta {
  margin: 18px 0 -2px;
  font-size: 0.75em;
  color: #b2b2b2;
}

.hgroup .post-meta a {
  text-decoration: none;
  color: #d4bca7;
}

.hgroup .post-meta a:hover {
  color: #7A583A;
}

.hgroup .post-meta span:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 9px;
  margin: 0 9px;
  background-color: #b3b3b3;
  vertical-align: middle;
}

.hgroup .post-meta span:first-child:before {
  content: none;
}

.hgroup.guest h2 {
  font-size: 0.875em;
  font-weight: bold;
  line-height: 40px;
  color: #7a583a;
}

.hgroup.guest {
  max-width: 860px;
  margin: 0 auto 60px;
  padding: 75px 0 0;
  border-bottom: 1px solid #7a583a;
}

.hgroup.tag {
  max-width: 860px;
  margin: 0 auto 60px;
  padding: 75px 0 0;
  border-bottom: 1px solid #7a583a;
}

.hgroup.tag h2 {
  font-size: 0.875em;
  font-weight: bold;
  line-height: 40px;
  color: #7a583a;
}


.post-btn {
  max-width: 1200px;
  margin: 200px auto 20px;
}

.post-btn button {
  display: inline-block;
  width: 30px;
  height: 30px;
  margin-right: 2px;
  text-align: left;
  text-indent: -999em;
  background-image: url(./images/ico_package.png);
  background-repeat: no-repeat;
  border: 1px solid #D4BCA7;
  box-sizing: border-box;
}

.post-btn .share {
  background-position: 0 -50px;
}

.post-btn .report {
  background-position: -50px -50px;
}

.post-btn .share:hover {
  background-position: -100px -50px;
}

.post-btn .report:hover {
  background-position: -150px -50px;
}

.another-category {
  max-width: 1200px;
  margin: 20px auto 36px;
  padding: 38px 0 0;
  border-top: 1px solid #7a583a;
}

.another-category h4 {
  margin-bottom: 10px;
  font-size: 1em;
  color: #666;
}

.another-category table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875em;
  color: #b2b2b2;
}

.another-category table th {
  padding: 8px 0 4px;
  border-bottom: 1px solid #e6e6e6;
  text-align: left;
  font-weight: 400;
}

.another-category table th a {
  text-decoration: none;
  color: #b2b2b2;
}

.another-category table th a:hover {
  color: #7A583A;
}

.another-category table th span {
  font-size: 0.75em;
}

.another-category td {
  width: 60px;
  padding: 8px 0 4px;
  border-bottom: 1px solid #e6e6e6;
  font-size: 0.75em;
  line-height: 1;
  color: #b2b2b2;
}

/* Style Important */
.another_category table {
  border: none !important;
}

.another_category td {
  border: none !important;
}

.tags {
  position: relative;
  overflow: hidden;
  max-width: 860px;
  margin: 35px auto 32px;
  color: #b2b2b2;
}

.tags h2 {
  margin-bottom: 10px;
  font-size: 1em;
  color: #666;
}

.tags .items {
  margin: 0 0 0 -18px;
}

.tags .items a {
  display: inline-block;
  margin-left: 18px;
  text-decoration: none;
  font-size: 0.875em;
  line-height: 2.1428;
  color: #b2b2b2;
}

.tags .items a:hover {
  color: #7a583a;
}

.tags .items a:before {
  content: "#";
}

#content .tags .items a {
  margin-left: 8px;
}

#content .tags .items {
  margin: 0 0 0 -18px;
  padding-left: 10px;
}


.related-articles {
  overflow: hidden;
  max-width: 1200px;
  margin: 40px auto 80px;
}

.related-articles h2 {
  margin-bottom: 28px;
  border-top: 1px solid #7a583a;
  border-bottom: 1px solid #7a583a;
  text-align: center;
  font-weight: 400;
  font-size: 0.875em;
  line-height: 40px;
  color: #666;
}

.related-articles h2 strong {
  font-weight: 700;
  color: #000;
}

.related-articles ul {
  margin-left: -20px;
  vertical-align: top;
}

.related-articles ul li {
  float: left;
  position: relative;
  width: 25%;
  padding: 0 0 0 20px;
  box-sizing: border-box;
}

.related-articles ul li a {
  overflow: hidden;
  display: block;
  position: relative;
}

.related-articles ul li .thum {
  display: block;
  position: relative;
  overflow: hidden;
  height: 0;
  padding-bottom: 98.4848%;
  background-color: #ebebeb;
}

.related-articles ul li .thum:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 0;
  width: 22px;
  height: 18px;
  margin: -9px 0 0 -11px;
  background: url(./images/ico_package.png) no-repeat -150px -300px;
}

.related-articles ul li .thum img {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  height: 100%;
}

.related-articles ul li .title {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 10;
  overflow: hidden;
  width: 100%;
  padding: 0 10px;
  background-color: rgba(0, 0, 0, 0.3);
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1em;
  line-height: 40px;
  color: #fff;
  box-sizing: border-box;
}

.comments {
  max-width: 860px;
  margin: 0 auto;
  border-bottom: 1px solid #e6e6e6;
}

.comments h2 {
  font-size: 1em;
  color: #666;
}

.comments h2 .count {
  color: #7a583a;
}

.comments .comment-list {
  font-size: 16px;
  margin-bottom: 6px;
  overflow: hidden;
}

.comments .comment-list ul li {
  padding: 30px 0 25px;
  border-top: 1px solid #e6e6e6;
  position: relative;
  min-height: 48px;
}

.comments .comment-list ul li:first-child {
  border: none;
}

.comments .comment-list ul li ul li {
  padding: 26px 0 0 60px;
  border-top: 0;
  border-bottom: 0;
}

.comments .comment-list ul li .author-meta {
  position: absolute;
  overflow: hidden;
  top: 30px;
  height: 48px;
  left: 0;
  right: 0;
  padding: 4px 0 0 60px;
}

.comments .comment-list ul li ul li .author-meta {
  top: 26px;
  left: 60px;
}

.comments .comment-list ul li .author-meta .avatar {
  position: absolute;
  left: 0;
  top: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
}

.comments .comment-list ul li .author-meta span {
  display: inline-block;
}

.comments .comment-list ul li .author-meta a {
  text-decoration: none;
  color: #000;
}

.comments .comment-list ul li .author-meta .nickname {
  float: left;
  font-size: 0.875em;
  line-height: 20px;
}

.comments .comment-list ul li .author-meta .nickname .tistoryProfileLayerTrigger {
  margin-bottom: 3px;
  margin-right: 0;
  vertical-align: bottom;
}

.comments .comment-list ul li .author-meta .date {
  float: left;
  margin-left: 10px;
  font-size: 0.75em;
  color: #999;
  line-height: 20px;
}

.comments .comment-list ul li .author-meta .date:before,
.comments .comment-list ul li .author-meta .date a:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 9px;
  margin-right: 10px;
  background-color: #b2b2b2;
}

.comments .comment-list ul li .author-meta .date a {
  margin-left: 10px;
}

.comments .comment-list ul li .control {
  position: absolute;
  top: 33px;
  right: 0;
}

.comments .comment-list ul li ul li .control {
  top: 29px;
}

.comments .comment-list ul li .control a {
  margin: 0 2px;
  text-decoration: none;
  font-size: 12px;
  color: #999;
}

.comments .comment-list ul li p {
  position: relative;
  margin: 29px 0 0 60px;
  font-size: 0.875em;
  line-height: 1.5714;
  color: #666;
}

.comments .comment-form .field {
  position: relative;
  overflow: hidden;
  width: 100%;
  margin-bottom: 10px;
}

.comments .comment-form input[type=text],
.comments .comment-form input[type=password],
.comments .comment-form textarea {
  border: 1px solid #e6e6e6;
  font-size: 0.875em;
  line-height: 1.25;
  color: #666;
}

.comments .comment-form input[type=text],
.comments .comment-form input[type=password] {
  width: 120px;
  height: 40px;
  padding: 10px;
  box-sizing: border-box;
}

.comments .comment-form input::-webkit-input-placeholder,
.comments .comment-form textarea::-webkit-input-placeholder {
  color: #d6d6d6;
}

.comments .comment-form textarea {
  display: block;
  width: 100%;
  margin-bottom: 10px;
  padding: 10px;
  resize: none;
  box-sizing: border-box;
}

.comments .comment-form .field .secret {
  float: right;
}

.comments .comment-form .field .secret input {
  display: none;
}

.comments .comment-form .field .secret label {
  font-size: 0.875em;
  line-height: 40px;
  color: #666;
  outline: none;
  cursor: pointer;
}

.comments .comment-form .field .secret label:before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-right: 9px;
  border: 1px solid #e1e1e1;
  vertical-align: middle;
  background-color: #fff;
}

.comments .comment-form .field .secret input[type=checkbox]:checked+label:before {
  background-image: url(./images/ico_package.png);
  background-repeat: no-repeat;
  background-position: -97px -295px;
}

.comments .comment-form .submit {
  margin-bottom: 10px;
  text-align: right;
}

.pagination {
  max-width: 860px;
  margin: 60px auto 160px;
  text-align: center;
}

.pagination a {
  display: inline-block;
  margin: 0 10px;
  text-decoration: none;
  font-size: 0.875em;
  line-height: 30px;
  color: #d4bca7;
  vertical-align: middle;
}

.pagination a:hover {
  color: #7A583A;
}

.pagination .selected {
  color: #000;
}

.pagination .prev,
.pagination .next {
  width: 30px;
  height: 30px;
  background-image: url(./images/ico_package.png);
  background-repeat: no-repeat;
  border: 1px solid #D4BCA7;
  text-indent: -999em;
  vertical-align: middle;
  box-sizing: border-box;
}

.pagination .prev {
  background-position: 0 -150px;
}

.pagination .prev:hover {
  background-position: -100px -150px;
}

.pagination .next {
  background-position: -50px -150px;
}

.pagination .next:hover {
  background-position: -150px -150px;
}

.pagination .no-more-prev,
.pagination .no-more-next {
  display: none;
}

.pagination .view-more {
  display: block;
  width: 100%;
  margin: 0;
  padding: 14px 0 11px;
  border: 1px solid #d4bca7;
  text-decoration: none;
  font-size: 12px;
  line-height: 1;
  color: #d4bca7;
}

.pagination .view-more:before {
  content: "";
  display: inline-block;
  width: 9px;
  height: 9px;
  margin-right: 9px;
  background: url(./images/ico_package.png) no-repeat 0 -400px;
}

.pagination .view-more:hover {
  background-color: #d4bca7;
  color: #fff;
}

.pagination .view-more:hover:before {
  background-position-x: -50px;
}

/* Entry Content */
.entry-content {
  max-width: 1200px;
  margin: 0 auto;
}

.entry-content h1 {
  clear: both;
  margin: 29px 0 22px;
  font-size: 1.6875em;
  line-height: 1.5;
  color: #000;
}

/* 상식한입 본문 제목 서식: H2~H4 */
.entry-content h2 {
  clear: both;
  margin: 44px 0 20px;
  padding: 0;
  font-size: 1.9em;
  font-weight: 900;
  line-height: 1.35;
  letter-spacing: -0.04em;
  color: #5B4636 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box;
}

.entry-content h2 *,
.entry-content h2 a,
.entry-content h2 span,
.entry-content h2 b,
.entry-content h2 strong {
  color: #5B4636 !important;
}

.entry-content h3 {
  clear: both;
  position: relative;
  margin: 28px 0 14px;
  padding: 10px 0 10px 18px;
  font-size: 1.22em;
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: -0.03em;
  color: #5B4636 !important;
  border-bottom: 2px solid #D8BE89;
  background: transparent;
  box-sizing: border-box;
}

.entry-content h3 *,
.entry-content h3 a,
.entry-content h3 span,
.entry-content h3 b,
.entry-content h3 strong {
  color: #5B4636 !important;
}

.entry-content h3:before {
  content: "";
  position: absolute;
  left: 0;
  top: 7px;
  width: 8px;
  height: calc(100% - 14px);
  background: #A8794A;
  clip-path: polygon(0 0, 100% 8px, 100% 100%, 0 100%);
}

.entry-content h4 {
  clear: both;
  margin: 22px 0 10px;
  padding: 0;
  font-size: 1.08em;
  font-weight: 800;
  line-height: 1.45;
  letter-spacing: -0.02em;
  color: #7A583A !important;
  background: transparent;
  border: 0;
}

.entry-content h4 *,
.entry-content h4 a,
.entry-content h4 span,
.entry-content h4 b,
.entry-content h4 strong {
  color: #7A583A !important;
}

.entry-content p {
  word-break: break-all;
}

.entry-content p img {
  max-width: 100%;
  height: auto;
}

.entry-content hr {
  display: block;
  height: 0;
  border: 0;
  border-bottom: 1px solid #000;
}

.entry-content pre {
  word-break: break-all;
  white-space: pre-wrap;
  word-wrap: break-word;
}

.entry-content pre code.hljs {
  padding: 20px;
}

.entry-content ul {
  list-style: disc inside;
  margin-bottom: 22px;
}

.entry-content ul li {
  position: relative;
}

.entry-content ol {
  list-style: decimal inside;
  margin-bottom: 22px;
}

.entry-content ol li {
  position: relative;
  list-style: decimal;
}

.entry-content a {
  color: #d4bca7;
}

.entry-content img.alignleft {
  float: left;
  margin: 0 22px 22px 0;
}

.entry-content img.aligncenter {
  display: block;
  margin: 0 auto 22px;
}

.entry-content img.alignright {
  float: right;
  margin: 0 0 22px 22px;
}

.entry-content blockquote {
  margin-top: 10px;
  padding: 16px 20px;
  border-left: 4px solid #e6e6e6;
}

.entry-content blockquote p {
  margin: 22px 0 0;
}

.entry-content blockquote p:first-child {
  margin-top: 0;
}

.entry-content table {
  width: 100%;
  border-collapse: collapse;
}

.entry-content table thead th {
  padding: 7px 0 11px;
  border-left: 1px solid #e6e6e6;
}

.entry-content input {
  height: 40px;
  padding: 0 10px;
  border: 1px solid #e6e6e6;
  font-size: 0.875em;
  line-height: 1.25;
  color: #666;
  box-sizing: border-box;
  vertical-align: middle;
}

.entry-content .protected_form {
  margin-bottom: 40px;
  padding: 120px 0 200px;
  border-bottom: 1px solid #7a583a;
  text-align: center;
}

.entry-content .protected_form input {
  width: 200px;
  margin-bottom: 10px;
  vertical-align: top;
}

.entry-content .cap1 {
  text-align: center;
  font-size: 0.875em;
  font-style: italic;
}

/* Comment */

/* Widget & Template Page */

/* ETC */
#dimmed {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 500;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
}

#mediaLogNest {
  max-width: 1200px;
  margin: 0 auto;
}

/* Column & Color Type */
.layout-float #wrap {
  padding-left: 240px;
}

.layout-float #header {
  float: left;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 200;
  width: 240px;
  height: 100%;
  border-bottom-width: 0;
  border-right: 1px solid #e6e6e6;
  background-color: #fff;
}

.layout-float #header h1 {
  float: none;
  padding: 80px 0 60px;
  text-align: center;
}

.layout-float #gnb {
  float: none;
  padding: 0 40px;
}

.layout-float #gnb ul li {
  float: none;
  padding: 0;
  border-bottom: 1px solid #e6e6e6;
  text-align: center;
}

.layout-float #gnb ul li a {
  padding: 10px 0 1px;
}

.layout-float #gnb ul li a:hover:after {
  margin: 0;
}

.layout-float #content {
  max-width: 900px;
  padding: 80px 0 0 60px;
}

.layout-float #aside {
  padding-left: 60px;
}

.layout-float #aside .inner {
  max-width: 900px;
  margin: 0;
}

.layout-float #footer .copyright {
  max-width: 900px;
  padding-left: 60px;
}

.layout-float .cover-slider {
  padding-bottom: 53.3333%;
}

.layout-float .cover-slider .prev {
  margin-left: -430px;
}

.layout-float .cover-slider .next {
  margin-left: 381px;
}

.layout-float .cover-slider ul li .text-box .title {
  font-size: 3em;
}

.layout-float .cover-thumbnail-list-1 ul li {
  padding-left: 36px;
}

.layout-float .cover-special-contents ul li .category {
  margin-top: 57px;
}

.layout-float .cover-special-contents ul li .title {
  margin-bottom: 26px;
  font-size: 1.5em;
}

.layout-float .cover-special-contents ul li .title:after {
  margin-top: 22px;
}

.layout-float .cover-special-contents ul li .excerpt {
  height: 10em;
  margin-bottom: 35px;
  padding: 0 55px;
  line-height: 1.7142;
}

.layout-float .cover-wide-panel .box {
  width: 800px;
  margin-top: -80px;
}

.layout-float .cover-wide-panel h2 {
  font-size: 1.5em;
}

.layout-float .cover-wide-panel p {
  padding: 0 60px;
}

.layout-float .post-item {
  width: 30.6666%;
}

.layout-float .post-item:nth-child(4n+1) {
  padding-left: 4%;
}

.layout-float .post-item:nth-child(3n+1) {
  padding-left: 0;
}

.layout-float.post-type-text .post-item {
  width: auto;
  padding-left: 0;
}

.layout-float .related-articles ul li .thum {
  padding-bottom: 100%;
}

.layout-float .cover-thumbnail-list-2 ul {
  margin-left: -36px;
}

.layout-float .cover-thumbnail-list-2 ul li {
  width: 33.3333%;
  padding-left: 36px;
}

.layout-float #aside .sidebar-1,
.layout-float #aside .sidebar-2,
.layout-float #aside .sidebar-3 {
  width: 33.3333%;
}

.layout-float #aside .sidebar-1 {
  padding-right: 24px;
}

.layout-float #aside .sidebar-3 {
  padding-left: 24px;
}

.layout-float .related-articles ul {
  margin-left: -36px;
}

.layout-float .related-articles ul li {
  padding-left: 36px;
}

/* Black Type */
.color-dark,
.color-dark #header,
.color-dark .cover-wide-panel .box,
.color-dark #aside .search input,
.color-dark .comments .comment-form input[type=text],
.color-dark .comments .comment-form input[type=password],
.color-dark .comments .comment-form textarea {
  background-color: #141414;
}

.color-dark .entry-content ul li:before {
  background-color: #333;
}

.color-dark #footer {
  background-color: #000;
}

.color-dark #gnb ul li a:hover:after,
.color-dark .cover-thumbnail-list-1 h2:after,
.color-dark .cover-special-contents ul li .title:after {
  background-color: #d4bca7;
}

.color-dark .btn:hover,
.color-dark .pagination .view-more:hover {
  background-color: #7A583A;
}

.color-dark #header,
.color-dark #aside,
.color-dark .post-item,
.color-dark .cover-thumbnail-list-2 ul li,
.color-dark .comments .comment-list ul li,
.color-dark .comments {
  border-color: #000;
}

.color-dark .hgroup,
.color-dark .another-category,
.color-dark .related-articles h2 {
  border-color: #d4bca7;
}

.color-dark #gnb ul li,
.color-dark #aside .posts li,
.color-dark #aside .count ul li,
.color-dark #aside .search fieldset,
.color-dark .entry-content blockquote,
.color-dark .entry-content table,
.color-dark .entry-content table thead th,
.color-dark .entry-content table tbody td,
.color-dark .another-category table th,
.color-dark .another-category table td,
.color-dark .comments .comment-form input[type=text],
.color-dark .comments .comment-form input[type=password],
.color-dark .comments .comment-form textarea,
.color-dark .comments .comment-form .field .secret label:before {
  border-color: #333;
}

.color-dark .btn,
.color-dark .pagination .view-more,
.color-dark .post-header .list-type button,
.color-dark .pagination .prev,
.color-dark .pagination .next,
.color-dark .entry-content a,
.color-dark .cover-thumbnail-list-2 h2,
.color-dark .post-header {
  border-color: #7A583A;
}

.color-dark .post-item .more,
.color-dark .cover-thumbnail-list-2 ul li .more,
.color-dark .pagination a,
.color-dark .entry-content a {
  color: #7a583a;
}

.color-dark #header h1 a {
  color: #d4bda9;
}

.color-dark #gnb ul li a:hover,
.color-dark #aside .posts li a:hover,
.color-dark #aside .tags .more:hover,
.color-dark #aside .count .total,
.color-dark #footer a,
.color-dark .tags .items a:hover,
.color-dark .cover-thumbnail-list-1 h2,
.color-dark .cover-special-contents ul li .title,
.color-dark .cover-wide-panel h2,
.color-dark .post-item a:hover .title,
.color-dark .post-item a:hover .more,
.color-dark .cover-thumbnail-list-2 ul li a:hover .title,
.color-dark .cover-thumbnail-list-2 ul li a:hover .more,
.color-dark .pagination a:hover,
.color-dark .hgroup h1,
.color-dark .pagination .selected,
.color-dark .comments h2 .count,
.color-dark .cover-thumbnail-list-1 ul li a:hover {
  color: #d4bca7;
}

.color-dark #gnb ul li a,
.color-dark #aside h2,
.color-dark .hgroup .category,
.color-dark .cover-thumbnail-list-1 h2 em,
.color-dark .cover-special-contents ul li .category,
.color-dark .cover-wide-panel .category,
.color-dark .entry-content h2,
.color-dark .post-item a:hover .excerpt,
.color-dark .cover-thumbnail-list-2 h2,
.color-dark .cover-thumbnail-list-2 ul li a:hover .excerpt,
.color-dark .post-header h2,
.color-dark .another-category h4,
.color-dark .tags h2,
.color-dark .related-articles h2 strong,
.color-dark .comments h2,
.color-dark .comments .comment-list ul li .author-meta .nickname,
.color-dark .comments .comment-list ul li .author-meta a,
.color-dark .btn:hover,
.color-dark .pagination .selected,
.color-dark .pagination .view-more:hover {
  color: #fff;
}

.color-dark #aside .posts li a,
.color-dark #aside .count ul li,
.color-dark #aside .search input,
.color-dark .cover-thumbnail-list-1 ul li a,
.color-dark .cover-special-contents ul li .excerpt,
.color-dark .cover-wide-panel p,
.color-dark .post-item .excerpt,
.color-dark .cover-thumbnail-list-2 ul li .excerpt,
.color-dark .entry-content p,
.color-dark .entry-content ul li,
.color-dark .entry-content ol li,
.color-dark .entry-content table,
.color-dark .tags .items a,
.color-dark .another-category table th a {
  color: #808080;
}

.color-dark #aside .search input::-webkit-input-placeholder,
.color-dark .comments .comment-form input::-webkit-input-placeholder,
.color-dark .comments .comment-form textarea::-webkit-input-placeholder {
  color: #333;
}

.color-dark #aside .tags .more,
.color-dark .btn,
.color-dark .pagination .view-more,
.color-dark .comments .comment-list ul li .author-meta .control a {
  color: #7a583a;
}

.color-dark .post-item .title,
.color-dark .cover-thumbnail-list-2 ul li .title {
  color: #ccc;
}

.color-dark #aside .search button {
  background-position-x: -37px;
}

.color-dark #aside .search button:hover,
.color-dark #aside .search button:focus,
.color-dark #aside .search input:focus+button {
  background-position-x: 13px;
}

.color-dark #aside .tags .more:after {
  background-position-x: -50px;
}

.color-dark #aside .tags .more:hover:after {
  background-position-x: 0;
}

.color-dark .pagination .prev {
  background-position-x: -100px;
}

.color-dark .pagination .next {
  background-position-x: -150px;
}

.color-dark .pagination .prev:hover {
  background-position-x: 0;
}

.color-dark .pagination .next:hover {
  background-position-x: -50px;
}

.color-dark .post-header .list-type .thum {
  background-position-x: -100px;
}

.color-dark .post-header .list-type .thum:hover,
.color-dark .post-header .list-type .thum.current {
  background-position-x: 0;
}

.color-dark .post-header .list-type .list {
  background-position-x: -150px;
}

.color-dark .post-header .list-type .list:hover,
.color-dark .post-header .list-type .list.current {
  background-position-x: -50px;
}

.color-dark .pagination .view-more:before {
  background-position-x: -100px;
}

.color-dark .pagination .view-more:hover:before {
  background-position-x: -50px;
}

.color-dark .btn:after {
  background-position-x: -100px;
}

.color-dark .btn:hover:after,
.color-dark .pagination .view-more:hover {
  background-position-x: 0;
}

.color-dark .post-item .more:after,
.color-dark .cover-thumbnail-list-2 ul li .more:after {
  background-position-x: -50px;
}

.color-dark .post-item a:hover .more:after,
.color-dark .cover-thumbnail-list-2 ul li a:hover .more:after {
  background-position-x: 0;
}

.color-dark #header .mobile-menu span,
.color-dark #header .mobile-menu:before,
.color-dark #header .mobile-menu:after {
  background-color: #D4BCA7;
}

.color-dark #gnb {
  background-color: #141414;
}

.color-dark .container_postbtn .postbtn_like .txt_like {
  color: #808080;
}

/* Retina Display */
@media only screen and (-webkit-min-device-pixel-ratio:1.5) {

  #aside .tags .more:after,
  #aside .search button,
  .cover-slider .prev,
  .cover-slider .next,
  .post-header .list-type button,
  .post-item .thum:before,
  .cover-thumbnail-list-2 ul li .thum:before,
  .post-item .more:after,
  .cover-thumbnail-list-2 ul li .more:after,
  .post-btn button,
  .related-articles ul li .thum:before,
  .comments .comment-form .field .secret input[type=checkbox]:checked+label:before,
  .pagination .prev,
  .pagination .next,
  .pagination .view-more:before {
    background-image: url(./images/ico_package_2x.png);
    background-size: 200px auto;
  }
}

/* Media Screen - Tablet */
@media screen and (max-width:1199px) {

  #header,
  #aside,
  #content .inner,
  .cover-thumbnail-list-1,
  .cover-special-contents,
  .cover-thumbnail-list-2,
  .pagination {
    padding-left: 34px;
    padding-right: 34px;
  }

  .cover-slider .prev {
    left: 20px;
    margin-left: 0;
  }

  .cover-slider .next {
    left: auto;
    right: 20px;
    margin-left: 0;
  }

  .cover-special-contents ul li .box {
    margin-top: -177px;
  }

  .cover-special-contents ul li .excerpt {
    height: 6.4284em;
    -webkit-line-clamp: 3;
  }

  .cover-wide-panel .box {
    max-width: none;
    margin-left: 50px;
    margin-right: 50px
  }

  .entry-content img.alignleft,
  .entry-content img.alignright {
    max-width: 50%;
  }

  .layout-float #header,
  .layout-float .cover-thumbnail-list-1,
  .layout-float .cover-special-contents,
  .layout-float .cover-wide-panel,
  .layout-float .cover-thumbnail-list-2,
  .layout-float .pagination,
  .layout-float #content .inner {
    padding-left: 0;
    padding-right: 0;
  }

  .layout-float .cover-thumbnail-list-1 h2,
  .layout-float .cover-special-contents ul li .title,
  .layout-float .cover-wide-panel h2 {
    font-size: 1.25em;
  }

  .layout-float .cover-thumbnail-list-1 ul li {
    padding-left: 20px;
  }

  .layout-float .cover-special-contents ul li .category {
    margin-top: 30px;
  }

  .layout-float .cover-special-contents ul li .title {
    margin-bottom: 17px;
  }

  .layout-float .cover-special-contents ul li .title:after {
    margin-top: 16px;
  }

  .layout-float .cover-special-contents ul li .excerpt {
    height: 5.1426em;
    margin-bottom: 21px;
    padding: 0 10%;
    font-size: 0.75em;
  }

  .layout-float .cover-wide-panel {
    margin-bottom: 80px;
  }

  .layout-float .cover-wide-panel p {
    padding: 0 10%;
    font-size: 0.75em;
  }

  .layout-float .cover-thumbnail-list-2 ul {
    margin-left: -20px;
  }

  .layout-float .cover-thumbnail-list-2 ul li {
    padding-left: 20px;
  }

  .layout-float .cover-thumbnail-list-2 ul li .title,
  .layout-float .post-item .title {
    font-size: 1em;
  }

  .layout-float .cover-thumbnail-list-2 ul li .excerpt,
  .layout-float .post-item .excerpt {
    height: 5em;
    font-size: 0.75em;
    line-height: 1.6666;
  }

  .layout-float .post-header {
    margin: 0;
  }

  .layout-float #content {
    padding: 80px 34px 0;
  }

  .layout-float .cover-wide-panel .box {
    width: auto;
  }

  .layout-float #aside {
    padding-left: 34px;
    padding-right: 34px;
  }

  .layout-float #aside .sidebar-1 {
    width: 50%;
    padding: 0 10px 0 0;
  }

  .layout-float #aside .sidebar-2 {
    width: 50%;
    margin: 0;
    padding: 0 0 0 10px;
  }

  .layout-float #aside .sidebar-3 {
    clear: both;
    float: none;
    width: auto;
    padding: 0;
  }

  .layout-float #aside .search {
    float: left;
    width: 50%;
    padding-right: 10px;
    box-sizing: border-box;
  }

  .layout-float #aside .count {
    float: right;
    width: 50%;
    margin: 0;
    padding-left: 10px;
    box-sizing: border-box;
  }
}

@media screen and (max-width:1023px) {
  #header h1 {
    float: none;
    padding: 20px 50px 20px 0;
  }

  #header h1 img {
    width: auto;
    height: 28px;
  }

  #header .mobile-menu {
    display: block;
    position: absolute;
    top: 50%;
    right: 19px;
    width: 48px;
    height: 48px;
    margin-top: -24px;
    text-indent: -999em;
    outline: none;
  }

  #header .mobile-menu span,
  #header .mobile-menu:before,
  #header .mobile-menu:after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 18px;
    height: 2px;
    margin-left: -9px;
    background-color: #7a583a;
    -webkit-transition: -webkit-transform .3s;
    transition: transform .3s;
  }

  #header .mobile-menu span {
    top: 50%;
    margin-top: -1px;
  }

  #header .mobile-menu:before {
    content: "";
    margin-top: -8px;
  }

  #header .mobile-menu:after {
    content: "";
    margin-top: 6px;
  }

  #header .mobile-menu.on {
    position: fixed;
    top: 10px;
    margin-top: 0;
    z-index: 610;
    outline: none;
  }

  #header .mobile-menu.on span {
    display: none;
  }

  #header .mobile-menu.on:before {
    margin-top: -1px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }

  #header .mobile-menu.on:after {
    margin-top: -1px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }

  #gnb {
    position: fixed;
    top: 0;
    right: -300px;
    z-index: 600;
    width: 300px;
    height: 100%;
    padding-top: 68px;
    background-color: #fff;
    box-sizing: border-box;
    -webkit-transition: right .3s;
    transition: right .3s;
  }

  #gnb ul {
    overflow-y: auto;
    height: 100%;
  }

  #gnb ul li {
    float: none;
    padding: 0;
    border-top: 1px solid #ebebeb;
    font-size: 1.125em;
  }

  #gnb ul li a {
    padding: 19px 30px 12px;
  }

  #gnb ul li a:hover:after {
    display: none;
  }

  #gnb.on {
    right: 0;
  }

  #aside {
    margin-top: 80px;
  }

  #aside .sidebar-1 {
    width: 50%;
    padding: 0 10px;
  }

  #aside .sidebar-2 {
    width: 50%;
    margin: 0;
    padding: 0 10px;
  }

  #aside .sidebar-3 {
    clear: both;
    float: none;
    width: auto;
    padding: 0;
  }

  #aside .search {
    float: left;
    width: 50%;
    padding-right: 10px;
    box-sizing: border-box;
  }

  #aside .count {
    float: right;
    width: 50%;
    margin: 0;
    padding-left: 10px;
    box-sizing: border-box;
  }

  #header,
  .cover-thumbnail-list-1,
  .cover-special-contents {
    padding: 0 34px;
  }

  .cover-slider {
    margin-bottom: 50px;
    padding-bottom: 39.0625%;
  }

  .cover-slider ul li .text-box .title {
    margin-bottom: 21px;
    font-size: 2.25em;
  }

  .cover-slider ul li .text-box .title em {
    margin-bottom: 8px;
    font-size: 0.5555em;
  }

  .btn, a.btn {
    width: 138px;
  }

  .cover-thumbnail-list-1 {
    margin-bottom: 41px;
  }

  .cover-thumbnail-list-1 h2 {
    font-size: 1.5em;
  }

  .cover-thumbnail-list-1 h2 em {
    margin-bottom: 3px;
    font-size: 0.5833em;
  }

  .cover-thumbnail-list-1 h2:after {
    width: 40px;
    margin-top: 24px;
  }

  .cover-thumbnail-list-1 ul li {
    padding-left: 20px;
    font-size: 0.75em;
  }

  .cover-special-contents {
    margin-bottom: 50px;
  }

  .cover-special-contents ul li .category {
    margin: 48px 0 -46px;
  }

  .cover-special-contents ul li .title {
    margin: 48px 0 26px;
    font-size: 1.5em;
  }

  .cover-special-contents ul li .title:after {
    margin-top: 21px;
  }

  .cover-special-contents ul li .excerpt {
    height: 5.1426em;
    margin-bottom: 38px;
    padding: 0 10%;
    line-height: 1.7142;
  }

  .cover-wide-panel {
    margin-bottom: 100px;
  }

  .cover-wide-panel .bg {
    height: 180px;
  }

  .cover-wide-panel .box {
    margin-top: -65px;
    padding-top: 48px;
  }

  .cover-wide-panel .category {
    margin-bottom: 0;
  }

  .cover-wide-panel h2 {
    margin-bottom: 20px;
    font-size: 1.5em;
  }

  .cover-wide-panel h2:after {
    margin-top: 24px;
  }

  .post-header:first-child {
    margin-top: 50px;
  }

  .cover-thumbnail-list-2 ul {
    margin-left: -20px;
  }

  .cover-thumbnail-list-2 ul li {
    padding: 20px 0 0 20px;
  }

  .post-header {
    margin: 0 34px;
  }

  .post-item .title,
  .cover-thumbnail-list-2 ul li .title {
    font-size: 1.125em;
  }

  .post-item {
    width: 22.75%;
    padding-left: 3%;
  }

  .post-type-text .post-item {
    padding: 30px 0 22px;
  }

  .post-type-text .post-item .title {
    margin: 0 0 2px;
    padding: 0;
    font-size: 1em;
  }

  .post-type-text .post-item .excerpt {
    margin-bottom: 9px;
    -webkit-line-clamp: 2;
    font-size: 0.75em;
  }

  .hgroup {
    margin-bottom: 50px;
    padding-bottom: 30px;
  }

  .related-articles {
    margin-bottom: 80px;
  }

  .related-articles ul {
    margin-left: -20px;
  }

  .related-articles ul li {
    padding-left: 20px;
  }

  .related-articles ul li .title {
    font-size: 0.75em;
  }

  .comments {
    margin-bottom: 40px;
  }

  .layout-float #wrap {
    padding-left: 180px;
  }

  .layout-float #header {
    width: 180px;
  }

  .layout-float #gnb {
    position: relative;
    width: auto;
    top: auto;
    right: auto;
    padding: 0 30px;
  }

  .layout-float #gnb ul li {
    font-size: 0.875em;
    border-top: 0;
  }

  .layout-float .post-item {
    padding-left: 4%;
  }

  .layout-float #header .mobile-menu {
    display: none;
  }

  .layout-float .cover-slider {
    padding-bottom: 57.6923%;
  }

  .layout-float .cover-slider ul li .text-box .title {
    font-size: 1.875em;
  }

  .layout-float .related-articles ul {
    margin-left: -20px;
  }

  .layout-float .related-articles ul li {
    padding-left: 20px;
  }
}

/* Media Screen - Mobie */
@media screen and (max-width:767px) {

  #header,
  #content .inner,
  .cover-thumbnail-list-1,
  .cover-thumbnail-list-2 {
    padding: 0 20px;
  }

  .pagination {
    padding: 0 20px;
    margin: 20px auto 60px;
  }

  .cover-special-contents {
    padding: 0;
  }

  #header h1 {
    line-height: 20px;
  }

  #header h1 img {
    height: 20px;
  }

  #header .mobile-menu {
    right: 0;
  }

  #header .mobile-menu.on {
    top: 6px;
  }

  #gnb {
    padding-top: 60px;
  }

  #aside {
    padding: 40px 20px;
  }

  #aside .sidebar-1,
  #aside .sidebar-2,
  #aside .sidebar-3,
  #aside .search,
  #aside .count {
    float: none;
    width: auto;
    padding: 0;
  }

  #aside .posts li a {
    padding: 7px 0 4px;
  }

  .cover-slider {
    padding-bottom: 75%;
  }

  .cover-slider .prev,
  .cover-slider .next {
    width: 24px;
    height: 42px;
    margin-top: -21px;
    background-size: 100px auto;
  }

  .cover-slider .prev {
    left: 10px;
    background-position: 0 -100px;
  }

  .cover-slider .prev:hover {
    background-position-x: -50px;
  }

  .cover-slider .next {
    right: 10px;
    background-position: -25px -100px;
  }

  .cover-slider .next:hover {
    background-position-x: -75px;
  }

  .cover-slider .paging {
    bottom: 20px;
  }

  .cover-slider ul li .text-box .title {
    margin-bottom: 28px;
    padding: 0 30px;
    font-size: 1.5em;
  }

  .cover-slider ul li .text-box .title em {
    margin-bottom: 10px;
    font-size: 0.75em;
  }

  .cover-thumbnail-list-1 {
    margin-bottom: 30px;
  }

  .cover-thumbnail-list-1 h2 {
    float: none;
    width: auto;
    margin-bottom: 20px;
    text-align: center;
  }

  .cover-thumbnail-list-1 h2 br {
    display: none;
  }

  .cover-thumbnail-list-1 h2:after {
    margin: 24px auto 0;
  }

  .cover-thumbnail-list-1 ul {
    float: none;
    width: auto;
  }

  .cover-thumbnail-list-1 ul li {
    float: none;
    width: auto;
    margin-bottom: 10px;
    padding: 0;
    font-size: 0.875em;
    line-height: 2.2857;
  }

  .cover-thumbnail-list-1 ul li .thum img {
    width: 100%;
  }

  .cover-special-contents {
    margin: 0;
  }

  .cover-special-contents ul li,
  .cover-special-contents ul li:nth-child(even) {
    width: auto;
    margin-bottom: 100px;
    padding: 0;
  }

  .cover-special-contents ul li .thum,
  .cover-special-contents ul li:nth-child(even) .thum {
    float: none;
    width: auto;
    margin: 0;
  }

  .cover-special-contents ul li .box {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    margin: 0;
  }

  .cover-special-contents ul li .category {
    margin: 28px 0 -25px;
  }

  .cover-special-contents ul li .title {
    margin: 28px 0 16px;
  }

  .cover-special-contents ul li .title:after {
    margin-top: 13px;
  }

  .cover-special-contents ul li .excerpt {
    margin-bottom: 46px;
  }

  .cover-wide-panel {
    margin-bottom: 80px;
  }

  .cover-wide-panel .bg {
    height: 100px;
  }

  .cover-wide-panel .box {
    margin: -20px 10px 0;
  }

  .cover-wide-panel p {
    padding: 0 10px;
  }

  .cover-thumbnail-list-2 {
    margin-bottom: 20px;
  }

  .cover-thumbnail-list-2 ul {
    margin-left: -10px;
  }

  .cover-thumbnail-list-2 ul li {
    width: 50%;
    margin-bottom: 20px;
    padding-left: 10px;
  }

  .post-item .title,
  .cover-thumbnail-list-2 ul li .title {
    padding-right: 10%;
    font-size: 1em;
    box-sizing: border-box;
  }

  .post-item .excerpt,
  .cover-thumbnail-list-2 ul li .excerpt {
    height: 2.5rem;
    margin-bottom: 8px;
    padding-right: 10%;
    font-size: 0.75em;
    line-height: 1.25rem;
  }

  .post-header {
    margin: 0 20px;
  }

  .post-item {
    width: 50%;
    padding-left: 0;
    box-sizing: border-box;
  }

  .post-type-thumbnail .post-item {
    border-bottom: none;
  }

  .post-item:nth-child(odd) {
    padding-right: 5px;
  }

  .post-item:nth-child(even) {
    padding-left: 5px;
  }

  .post-type-text .post-item .thum {
    width: 100px;
    height: 100px;
    margin-left: 28px;
  }

  .post-type-text .post-item .thum img {
    width: 100px;
    margin: 0;
  }

  .hgroup {
    padding: 49px 0 30px;
  }

  .hgroup.guest {
    margin: 0 20px 25px;
  }

  .hgroup.tag {
    margin: 0 20px;
  }

  #content .tags.section {
    padding: 0 20px;
  }

  /* 상식한입 본문 제목 모바일 보정 */
  .entry-content h2 {
    margin: 34px 0 16px;
    padding: 0;
    font-size: 1.48em;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  .entry-content h3 {
    margin: 24px 0 12px;
    padding: 9px 0 9px 16px;
    font-size: 1.12em;
  }

  .entry-content h3:before {
    top: 7px;
    width: 7px;
    height: calc(100% - 14px);
  }

  .entry-content h4 {
    margin: 20px 0 8px;
    font-size: 1.03em;
  }

  .entry-content .table-wrap {
    overflow: auto;
    width: 100%;
  }

  .entry-content table {
    width: 680px;
    table-layout: fixed;
    font-size: 0.75em;
  }

  .entry-content img.alignleft,
  .entry-content img.alignright {
    max-width: 100%;
  }

  .related-articles ul {
    margin-left: -10px;
  }

  .related-articles ul li {
    width: 50%;
    margin-bottom: 10px;
    padding-left: 10px;
  }

  .comments {
    margin-bottom: 20px;
  }

  .comments .comment-list {
    margin-bottom: 10px;
    border-top: 1px solid #e6e6e6;
  }

  .comments .comment-list ul li {
    padding-bottom: 0;
  }

  .comments .comment-list ul li ul {
    border-top: 1px solid #e6e6e6;
  }

  .comments .comment-list ul li ul li {
    padding: 20px 0 0 48px;
  }

  .comments .comment-list ul li .author-meta,
  .comments .comment-list ul li ul li .author-meta {
    position: relative;
    top: 0;
    left: 0;
  }

  .comments .comment-list ul li .author-meta img {
    position: absolute;
    top: 0;
    left: 0;
  }

  .comments .comment-list ul li .author-meta .nickname,
  .comments .comment-list ul li .author-meta .date {
    display: block;
    float: none;
    line-height: 1.5;
  }

  .comments .comment-list ul li .author-meta .nickname .tistoryProfileLayerTrigger {
    margin-bottom: 4px;
  }

  .comments .comment-list ul li .author-meta .date {
    margin-left: 0;
    margin-top: 2px;
  }

  .comments .comment-list ul li .author-meta .date::before {
    display: none;
  }

  .comments .comment-list ul li p {
    margin: 14px 0 0;
  }

  .comments .comment-list ul li .control {
    position: relative;
    top: auto;
    right: auto;
    display: block;
    margin: 9px 0 18px -2px;
  }

  .comments .comment-list ul li ul li .control {
    top: auto;
  }

  .comments .comment-form .field {
    width: auto;
    margin: 0;
    padding-right: 80px;
  }

  .comments .comment-form .field .secret {
    float: none;
    position: absolute;
    bottom: 10px;
    right: 0;
  }

  .comments .comment-form .field .secret label {
    line-height: 20px;
  }

  .comments .comment-form input[type=text],
  .comments .comment-form input[type=password] {
    display: block;
    width: 100%;
    margin-bottom: 10px;
  }

  .comments.guest {
    margin-bottom: 20px;
    padding: 0 20px;
  }

  .pagination a {
    margin: 0 5px;
  }

  .layout-float #wrap {
    padding: 0;
  }

  .layout-float #header {
    float: none;
    position: relative;
    z-index: auto;
    width: 100%;
    height: auto;
    padding: 0 10px;
    border-bottom-width: 1px;
    box-sizing: border-box;
  }

  .layout-float #header h1 {
    float: none;
    padding: 20px 0;
    text-align: left;
  }

  .layout-float #header .mobile-menu {
    display: block;
  }

  .layout-float #gnb {
    position: fixed;
    top: 0;
    right: -300px;
    z-index: 600;
    width: 300px;
    height: 100%;
    padding: 60px 0 0;
    background-color: #fff;
    box-sizing: border-box;
    -webkit-transition: right .3s;
    transition: right .3s;
    box-sizing: border-box;
  }

  .layout-float #gnb.on {
    right: 0;
  }

  .layout-float #gnb ul li {
    float: none;
    padding: 0;
    border-top: 1px solid #ebebeb;
    border-bottom: none;
    font-size: 1.125em;
    text-align: left;
  }

  .layout-float #gnb ul li a {
    padding: 19px 30px 12px;
  }

  .layout-float #content {
    padding: 0;
  }

  .layout-float .cover-thumbnail-list-1 ul li {
    padding: 0;
  }

  .layout-float #header,
  .layout-float .cover-thumbnail-list-1,
  .layout-float .cover-special-contents,
  .layout-float .cover-wide-panel,
  .layout-float .cover-thumbnail-list-2,
  .layout-float .pagination,
  .layout-float #content .inner {
    padding: 0 10px;
  }

  .layout-float .cover-slider {
    padding-bottom: 75%;
  }

  .layout-float .cover-slider .prev {
    left: 10px;
    margin-left: 0;
  }

  .layout-float .cover-slider ul li .text-box .title {
    margin-bottom: 28px;
    padding: 0 30px;
    font-size: 1.5em;
  }

  .layout-float .cover-slider ul li .text-box .title em {
    margin-bottom: 10px;
    font-size: 0.75em;
  }

  .layout-float .cover-thumbnail-list-1 h2,
  .layout-float .cover-special-contents ul li .title,
  .layout-float .cover-wide-panel h2 {
    font-size: 1.5em;
  }

  .layout-float .cover-special-contents ul li .excerpt {
    height: 5.1426em;
    margin-bottom: 46px;
    padding: 0 10%;
    line-height: 1.7142;
    font-size: 0.875em;
  }

  .layout-float .cover-wide-panel .box {
    margin: -20px 10px 0;
  }

  .layout-float .cover-wide-panel p {
    margin-bottom: 48px;
    padding: 0 10px;
    font-size: 0.875em;
    line-height: 2.1428;
  }

  .layout-float .cover-thumbnail-list-2 ul {
    margin-left: -10px;
  }

  .layout-float .cover-thumbnail-list-2 ul li {
    width: 50%;
    padding-left: 10px;
  }

  .layout-float .post-header {
    margin: 0 10px;
  }

  .layout-float .post-item {
    width: 50%;
    padding-left: 0;
  }

  .layout-float .post-item:nth-child(4n+1) {
    padding-left: 0;
  }

  .layout-float .post-item:nth-child(even) {
    padding-left: 5px;
  }

  .layout-float .related-articles ul {
    margin-left: -10px;
  }

  .layout-float .related-articles ul li {
    padding-left: 10px;
  }

  .layout-float #aside {
    padding: 40px 10px;
  }

  .layout-float #aside .sidebar-1,
  .layout-float #aside .sidebar-2,
  .layout-float #aside .sidebar-3,
  .layout-float #aside .search,
  .layout-float #aside .count {
    float: none;
    width: auto;
    padding: 0;
  }

  .layout-float.color-dark #gnb {
    background-color: #141414;
  }

  .layout-float.color-dark #gnb ul li {
    border-color: #333;
  }
}

.revenue_unit_wrap.position_list {
  max-width: 860px;
  margin: 30px auto
}

.guest .tt-comment-cont {
  padding-top: 40px;
  padding-bottom: 40px;
}

.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: #935F30;
}

.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: #935F30;
}

.tt-comment-cont .tt-link-comment .tt_num_g {
  color: #935F30;
}

.tt-comment-cont .tt-btn_register {
  width: 158px;
  height: 40px;
  background-color: #fff;
  color: #936030;
  border-radius: 0;
  border-color: #936030;
}

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

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

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

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

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

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

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

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

#article-view figure img {
  vertical-align: baseline;
}

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

/* 구 에디터 속성 */
.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;
}

/* =========================================================
   상식한입 Whatever 커스텀 최종 보정
   - 좌측 사이드바 고정
   - 본문 영역 확장
   - 본문 상단 Google 번역 버튼
   - PC 커버/리스트 카드 5열
   ========================================================= */

/* 좌측 메뉴 고정 */
.layout-float #header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 300;
  width: 240px;
  height: 100vh;
  overflow-y: auto;
  border-right: 1px solid #e6e6e6;
  background-color: #fff;
}

.layout-float #wrap {
  padding-left: 240px;
}

/* 본문 영역 확장 */
.layout-float #content {
  width: calc(100vw - 340px);
  max-width: 1360px;
  min-width: 900px;
  padding: 80px 0 0 60px;
  box-sizing: border-box;
}

.layout-float #content .inner,
.layout-float .post-header,
.layout-float .cover-slider,
.layout-float .cover-thumbnail-list-1,
.layout-float .cover-thumbnail-list-2,
.layout-float .cover-special-contents,
.layout-float .cover-wide-panel,
.layout-float .hgroup,
.layout-float .entry-content,
.layout-float .tags,
.layout-float .comments,
.layout-float .pagination,
.layout-float .related-articles,
.layout-float .post-btn,
.layout-float .another-category,
.layout-float .revenue_unit_wrap.position_list {
  max-width: 100% !important;
}

/* 번역 영역 */
.sneru-translate-bar {
  position: sticky;
  top: 0;
  z-index: 250;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  min-height: 42px;
  margin: 0 auto 16px;
  padding: 8px 0 10px;
  border-bottom: 1px solid #d4bca7;
  background: rgba(255, 255, 255, 0.96);
  box-sizing: border-box;
}

.sneru-lang-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 22px;
  padding: 0;
  border: 0;
  border-radius: 3px;
  background: transparent;
  line-height: 1;
  box-sizing: border-box;
  cursor: pointer;
  opacity: 0.92;
  transition: opacity .2s, transform .2s, box-shadow .2s;
}

.sneru-lang-btn img {
  display: block;
  width: 28px;
  height: 19px;
  object-fit: cover;
  border-radius: 2px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08);
}

.sneru-lang-btn:hover {
  opacity: 1;
  transform: translateY(-1px);
}

.sneru-lang-btn:hover img {
  box-shadow: 0 2px 8px rgba(122, 88, 58, 0.18);
}

#google_translate_element,
.goog-te-banner-frame,
.goog-te-gadget,
.goog-te-balloon-frame,
.goog-logo-link,
.goog-te-gadget span {
  display: none !important;
}

body {
  top: 0 !important;
}

/* 커버 슬라이더: 확장 영역 기준으로 균형 조정 */
.layout-float .cover-slider {
  padding-bottom: 53%;
  margin-bottom: 72px;
}

.layout-float .cover-slider .prev {
  left: 0;
  margin-left: 24px;
}

.layout-float .cover-slider .next {
  left: auto;
  right: 0;
  margin-left: 0;
  margin-right: 24px;
}

/* PC 카드 5열 */
.layout-float .cover-thumbnail-list-2 ul {
  margin-left: -18px;
}

.layout-float .cover-thumbnail-list-2 ul li {
  width: 20%;
  padding-left: 18px;
}

.layout-float .post-item {
  width: 18.4%;
  padding-left: 2%;
}

.layout-float .post-item:nth-child(3n+1),
.layout-float .post-item:nth-child(4n+1) {
  padding-left: 2%;
}

.layout-float .post-item:nth-child(5n+1) {
  padding-left: 0;
}

/* 관련글도 PC에서 5열 */
.layout-float .related-articles ul {
  margin-left: -18px;
}

.layout-float .related-articles ul li {
  width: 20%;
  padding-left: 18px;
}

/* 태블릿 이하에서는 원본 구조에 가깝게 복귀 */
@media screen and (max-width: 1280px) {
  .layout-float #content {
    width: calc(100vw - 300px);
    max-width: 1100px;
  }

  .layout-float .cover-thumbnail-list-2 ul li,
  .layout-float .related-articles ul li {
    width: 25%;
  }

  .layout-float .post-item {
    width: 23.255813953488372%;
  }

  .layout-float .post-item:nth-child(5n+1) {
    padding-left: 2%;
  }

  .layout-float .post-item:nth-child(4n+1) {
    padding-left: 0;
  }
}

@media screen and (max-width: 1023px) {
  .layout-float #header {
    position: relative;
    width: auto;
    height: auto;
    overflow: visible;
  }

  .layout-float #wrap {
    padding-left: 0;
  }

  .layout-float #content {
    width: auto;
    min-width: 0;
    max-width: none;
    padding: 0 20px;
  }

  .sneru-translate-bar {
    top: 0;
    flex-wrap: wrap;
    justify-content: center;
    padding: 8px 0;
  }

  .layout-float .cover-thumbnail-list-2 ul li,
  .layout-float .related-articles ul li {
    width: 50%;
  }
}

/* =========================================================
   상식한입 수정 최종 보정
   - Google 번역 상단 툴바 숨김
   - 태블릿 구간 좌측 사이드바 유지
   - PC 본문/커버 5열 확장 유지
   ========================================================= */

/* Google 번역 상단 바/말풍선 제거 */
iframe.goog-te-banner-frame,
.goog-te-banner-frame,
.goog-te-banner-frame.skiptranslate,
.goog-te-balloon-frame,
#goog-gt-tt,
.goog-tooltip,
.goog-tooltip:hover,
.goog-text-highlight {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  opacity: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

body {
  top: 0 !important;
}

body > .skiptranslate {
  display: none !important;
}

/* 번역 아이콘 중앙 고정형 정리 */
.sneru-translate-bar {
  position: sticky;
  top: 0;
  z-index: 260;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 9px;
  width: 100%;
  min-height: 38px;
  margin: 0 auto 14px;
  padding: 7px 0 9px;
  border-bottom: 1px solid #d4bca7;
  background: rgba(255,255,255,0.96);
  box-sizing: border-box;
}

.sneru-lang-btn {
  width: 27px;
  height: 20px;
}

.sneru-lang-btn img {
  width: 27px;
  height: 18px;
  object-fit: cover;
}

/* PC 확장 폭 보강 */
@media screen and (min-width: 1024px) {
  .layout-float #content {
    width: calc(100vw - 330px) !important;
    max-width: 1520px !important;
    min-width: 980px;
    padding: 80px 0 0 60px !important;
  }

  .layout-float .cover-thumbnail-list-2 ul li {
    width: 20% !important;
    padding-left: 18px;
  }

  .layout-float .cover-thumbnail-list-2 ul {
    margin-left: -18px;
  }

  .layout-float .post-item {
    width: 18.4% !important;
    padding-left: 2% !important;
  }

  .layout-float .post-item:nth-child(5n+1) {
    padding-left: 0 !important;
  }

  .layout-float .post-item:nth-child(3n+1),
  .layout-float .post-item:nth-child(4n+1) {
    padding-left: 2% !important;
  }

  .layout-float .post-item:nth-child(5n+1) {
    padding-left: 0 !important;
  }
}

/* 태블릿: 좌측 사이드바를 상단으로 올리지 않고 유지 */
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .layout-float #wrap {
    padding-left: 210px !important;
  }

  .layout-float #header {
    position: fixed !important;
    top: 0;
    left: 0;
    z-index: 300;
    width: 210px !important;
    height: 100vh !important;
    overflow-y: auto;
    border-right: 1px solid #e6e6e6;
    border-bottom: 0;
    background-color: #fff;
  }

  .layout-float #header .inner {
    max-width: none;
  }

  .layout-float #header h1 {
    float: none;
    max-width: none;
    padding: 70px 12px 48px;
    text-align: center;
    white-space: normal;
  }

  .layout-float #gnb {
    float: none;
    padding: 0 28px;
  }

  .layout-float #gnb ul li {
    float: none;
    padding: 0;
    border-bottom: 1px solid #e6e6e6;
    text-align: center;
  }

  .layout-float #gnb ul li a {
    padding: 10px 0 2px;
  }

  .layout-float #content {
    width: calc(100vw - 250px) !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 56px 20px 0 40px !important;
    box-sizing: border-box;
  }

  .layout-float .cover-slider {
    padding-bottom: 60%;
  }

  .layout-float .cover-slider ul li .text-box .title {
    font-size: 2.1em;
    line-height: 1.15;
  }

  .layout-float .cover-thumbnail-list-2 ul li,
  .layout-float .related-articles ul li {
    width: 33.3333% !important;
  }

  .sneru-translate-bar {
    top: 0;
    flex-wrap: nowrap;
    gap: 7px;
  }
}

/* 모바일: 이때만 사이드바 상단 배치 */
@media screen and (max-width: 767px) {
  .layout-float #wrap {
    padding-left: 0 !important;
  }

  .layout-float #header {
    position: relative !important;
    width: auto !important;
    height: auto !important;
    overflow: visible;
    border-right: 0;
    border-bottom: 1px solid #e6e6e6;
  }

  .layout-float #content {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 16px !important;
  }

  .sneru-translate-bar {
    position: sticky;
    top: 0;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px 0;
  }

  .layout-float .cover-thumbnail-list-2 ul li,
  .layout-float .related-articles ul li {
    width: 50% !important;
  }
}

/* 좌측 사이드바 번역 후 긴 메뉴명 줄바꿈 보정 */
.layout-float #gnb ul li a {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: keep-all !important;
  line-height: 1.45 !important;
  padding: 10px 4px 8px !important;
}

.layout-float #gnb ul li {
  min-height: auto !important;
}

.layout-float #gnb {
  box-sizing: border-box !important;
}

/* 번역 시 블로그명도 좌측 영역 안에서 줄바꿈 */
.layout-float #header h1,
.layout-float #header h1 a {
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: keep-all !important;
  line-height: 1.35 !important;
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
  .layout-float #gnb ul li a {
    padding: 9px 4px 7px !important;
    font-size: 0.92em !important;
  }
}


/* =========================================================
   상식한입 PC 목록 보기 고정
   - 리스트/썸네일 전환 버튼 숨김
   - PC 목록 화면을 썸네일 카드형으로 고정
   ========================================================= */
.post-header .list-type {
  display: none !important;
}

.post-type-text .post-item {
  float: left !important;
  width: 23.255813953488372% !important;
  padding: 20px 0 33px 2.325581395348837% !important;
}

.post-type-text .post-item:nth-child(4n+1) {
  padding-left: 0 !important;
}

.post-type-text .post-item .thum {
  float: none !important;
  display: block !important;
  position: relative !important;
  overflow: hidden !important;
  width: 100% !important;
  height: 0 !important;
  margin: 0 0 17px !important;
  padding-bottom: 98.4848% !important;
  background-color: #ebebeb;
}

.post-type-text .post-item .thum img {
  display: block !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 10 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  object-fit: cover;
}

.post-type-text .post-item .title {
  display: block !important;
  overflow: hidden !important;
  width: 90% !important;
  margin-bottom: 2px !important;
  padding: 0 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-weight: 700 !important;
  font-size: 1em !important;
  color: #000;
}

.post-type-text .post-item .excerpt {
  display: -webkit-box !important;
  overflow: hidden !important;
  width: 90% !important;
  height: 4.125rem !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  margin-bottom: 16px !important;
  text-overflow: ellipsis !important;
  font-size: 0.875em !important;
  line-height: 1.375rem !important;
  color: #666;
}

.post-type-text .post-item .more {
  display: inline-block !important;
  line-height: normal !important;
}

/* =========================================================
   상식한입 글 목록 카드 정렬 최종 수정본
   - float 구조 제거
   - 카드 높이 통일
   - 썸네일 16:9 통일
   - 제목/본문 줄 수 고정
   ========================================================= */

@media screen and (min-width: 1024px) {

  /* 글 목록 부모를 grid로 변경 */
  .layout-float.post-type-thumbnail #content .inner,
  .layout-float.post-type-text #content .inner {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    column-gap: 18px !important;
    row-gap: 34px !important;
    align-items: start !important;
    overflow: visible !important;
  }

  /* 상단 제목 영역은 전체 폭 사용 */
  .layout-float.post-type-thumbnail .post-header,
  .layout-float.post-type-text .post-header {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    margin: 0 !important;
  }

  /* 카드 */
  .layout-float.post-type-thumbnail .post-item,
  .layout-float.post-type-text .post-item {
    float: none !important;
    width: auto !important;
    height: 330px !important;
    padding: 0 0 18px 0 !important;
    margin: 0 !important;
    border-bottom: 1px solid #e6e6e6 !important;
    box-sizing: border-box !important;

    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }

  /* nth-child 기존 여백 전부 제거 */
  .layout-float .post-item:nth-child(3n+1),
  .layout-float .post-item:nth-child(4n+1),
  .layout-float .post-item:nth-child(5n+1),
  .post-type-text .post-item:nth-child(4n+1) {
    padding-left: 0 !important;
  }

  /* 링크도 카드 전체 높이 사용 */
  .layout-float.post-type-thumbnail .post-item a,
  .layout-float.post-type-text .post-item a {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    text-decoration: none !important;
  }

  /* 썸네일 16:9 고정 */
  .layout-float.post-type-thumbnail .post-item .thum,
  .layout-float.post-type-text .post-item .thum {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    padding-bottom: 56.25% !important;
    margin: 0 0 10px 0 !important;
    overflow: hidden !important;
    background-color: #ebebeb !important;
    flex: 0 0 auto !important;
  }

  .layout-float.post-type-thumbnail .post-item .thum img,
  .layout-float.post-type-text .post-item .thum img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    object-fit: cover !important;
  }

  /* 제목 2줄 고정 */
  .layout-float.post-type-thumbnail .post-item .title,
  .layout-float.post-type-text .post-item .title {
    width: 100% !important;
    height: 38px !important;
    margin: 0 0 6px 0 !important;
    padding: 0 !important;
    font-size: 13px !important;
    line-height: 19px !important;
    font-weight: 700 !important;
    color: #000 !important;

    white-space: normal !important;
    text-overflow: clip !important;
    overflow: hidden !important;

    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
  }

  /* 설명 3줄 고정 */
  .layout-float.post-type-thumbnail .post-item .excerpt,
  .layout-float.post-type-text .post-item .excerpt {
    width: 100% !important;
    height: 54px !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    font-size: 12px !important;
    line-height: 18px !important;
    color: #666 !important;

    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
  }

  /* 더보기 하단 정렬 */
  .layout-float.post-type-thumbnail .post-item .more,
  .layout-float.post-type-text .post-item .more {
    margin-top: auto !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
  }
}
/* =========================================================
   상식한입 PC 레이아웃 긴급 복구 FINAL
   - 좌측 세로 메뉴 유지
   - 홈 메인 썸네일 16:9 + 콘텐츠 폭 확장
   - 홈 인기글/목록 5열 카드 구성
   - 본문 상세 글이 카드 grid에 끼어 좁아지는 문제 차단
   ========================================================= */

@media screen and (min-width: 1024px) {
  html, body {
    overflow-x: hidden !important;
  }

  /* 좌측 세로 메뉴 원복 */
  .layout-float #wrap {
    padding-left: 240px !important;
  }

  .layout-float #header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    z-index: 300 !important;
    width: 240px !important;
    height: 100vh !important;
    overflow-y: auto !important;
    border-right: 1px solid #e6e6e6 !important;
    border-bottom: 0 !important;
    background: #fff !important;
  }

  .layout-float #header .inner {
    max-width: none !important;
    width: 100% !important;
  }

  .layout-float #header h1 {
    float: none !important;
    max-width: none !important;
    padding: 80px 12px 60px !important;
    text-align: center !important;
    white-space: normal !important;
  }

  .layout-float #gnb {
    float: none !important;
    padding: 0 36px !important;
  }

  .layout-float #gnb ul li {
    float: none !important;
    padding: 0 !important;
    border-bottom: 1px solid #e6e6e6 !important;
    text-align: center !important;
  }

  .layout-float #gnb ul li a {
    display: block !important;
    padding: 10px 4px 8px !important;
    line-height: 1.45 !important;
    white-space: normal !important;
    color: #000 !important;
  }

  .layout-float #gnb ul li a:hover:after {
    display: none !important;
  }

  /* PC 본문 영역: 너무 좁아지지 않게 고정 폭 복구 */
  .layout-float #content {
    width: min(calc(100vw - 340px), 1120px) !important;
    min-width: 980px !important;
    max-width: 1120px !important;
    margin: 0 !important;
    padding: 80px 0 0 60px !important;
    box-sizing: border-box !important;
  }

  .layout-float #content .inner,
  .layout-float .post-header,
  .layout-float .cover-slider,
  .layout-float .cover-thumbnail-list-1,
  .layout-float .cover-thumbnail-list-2,
  .layout-float .cover-special-contents,
  .layout-float .cover-wide-panel,
  .layout-float .hgroup,
  .layout-float .entry-content,
  .layout-float .tags,
  .layout-float .comments,
  .layout-float .pagination,
  .layout-float .related-articles,
  .layout-float .post-btn,
  .layout-float .another-category {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* 번역 아이콘 중앙 */
  .sneru-translate-bar {
    position: sticky !important;
    top: 0 !important;
    z-index: 260 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 9px !important;
    width: 100% !important;
    min-height: 38px !important;
    margin: 0 auto 14px !important;
    padding: 7px 0 9px !important;
    border-bottom: 1px solid #d4bca7 !important;
    background: rgba(255,255,255,0.96) !important;
    box-sizing: border-box !important;
  }

  /* 홈 메인 썸네일: 콘텐츠 폭 100%, 16:9 */
  .layout-float .cover-slider {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    padding-bottom: 0 !important;
    margin: 0 auto 72px !important;
    overflow: hidden !important;
    background: #eee !important;
  }

  .layout-float .cover-slider ul,
  .layout-float .cover-slider ul li {
    width: 100% !important;
    height: 100% !important;
  }

  .layout-float .cover-slider ul li {
    background-size: cover !important;
    background-position: center center !important;
  }

  .layout-float .cover-slider ul li .text-box .title {
    max-width: 92% !important;
    margin: 0 auto 24px !important;
    font-size: 2.15em !important;
    line-height: 1.22 !important;
    word-break: keep-all !important;
  }

  .layout-float .cover-slider .prev {
    left: 0 !important;
    margin-left: 24px !important;
  }

  .layout-float .cover-slider .next {
    left: auto !important;
    right: 0 !important;
    margin-left: 0 !important;
    margin-right: 24px !important;
  }

  /* 홈 인기글 5열 */
  .layout-float .cover-thumbnail-list-2 {
    margin: 0 auto 64px !important;
  }

  .layout-float .cover-thumbnail-list-2 h2,
  .layout-float .post-header {
    width: 100% !important;
    margin: 0 auto 20px !important;
    text-align: center !important;
    border-top: 1px solid #7a583a !important;
    border-bottom: 1px solid #7a583a !important;
    line-height: 40px !important;
    color: #7a583a !important;
    box-sizing: border-box !important;
  }

  .layout-float .cover-thumbnail-list-2 ul {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 38px 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .layout-float .cover-thumbnail-list-2 ul li {
    float: none !important;
    width: auto !important;
    padding: 0 0 18px 0 !important;
    margin: 0 !important;
    border-bottom: 1px solid #e6e6e6 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  /* 목록 페이지 5열: post-item이 있을 때만 grid 적용 */
  .layout-float #content .inner {
    display: block !important;
    overflow: visible !important;
  }

  .layout-float #content .inner:has(> .post-item) {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 38px 18px !important;
    align-items: start !important;
  }

  .layout-float #content .inner:has(> .post-item) > .post-header {
    grid-column: 1 / -1 !important;
  }

  .layout-float .post-item,
  .layout-float.post-type-text .post-item,
  .layout-float.post-type-thumbnail .post-item {
    float: none !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 0 18px 0 !important;
    margin: 0 !important;
    border-bottom: 1px solid #e6e6e6 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .layout-float .post-item:nth-child(n),
  .post-type-text .post-item:nth-child(n) {
    padding-left: 0 !important;
  }

  .layout-float .post-item a,
  .layout-float .cover-thumbnail-list-2 ul li a {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    text-decoration: none !important;
  }

  /* 카드 썸네일 16:9 꽉 채우기 */
  .layout-float .post-item .thum,
  .layout-float.post-type-text .post-item .thum,
  .layout-float.post-type-thumbnail .post-item .thum,
  .layout-float .cover-thumbnail-list-2 ul li .thum {
    float: none !important;
    display: block !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    padding-bottom: 0 !important;
    margin: 0 0 10px 0 !important;
    overflow: hidden !important;
    background-color: #ebebeb !important;
  }

  .layout-float .post-item .thum img,
  .layout-float.post-type-text .post-item .thum img,
  .layout-float.post-type-thumbnail .post-item .thum img,
  .layout-float .cover-thumbnail-list-2 ul li .thum img {
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  .layout-float .post-item .title,
  .layout-float .cover-thumbnail-list-2 ul li .title {
    display: -webkit-box !important;
    width: 100% !important;
    height: 38px !important;
    margin: 0 0 6px 0 !important;
    padding: 0 !important;
    font-size: 13px !important;
    line-height: 19px !important;
    font-weight: 700 !important;
    color: #000 !important;
    white-space: normal !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    word-break: keep-all !important;
  }

  .layout-float .post-item .excerpt,
  .layout-float .cover-thumbnail-list-2 ul li .excerpt {
    display: -webkit-box !important;
    width: 100% !important;
    height: 54px !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    font-size: 12px !important;
    line-height: 18px !important;
    color: #666 !important;
    overflow: hidden !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    word-break: keep-all !important;
  }

  .layout-float .post-item .more,
  .layout-float .cover-thumbnail-list-2 ul li .more {
    display: inline-block !important;
    margin-top: 0 !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
    color: #d4bca7 !important;
  }

  /* 본문 상세 페이지: grid 1칸으로 좁아지는 문제 강제 차단 */
  .layout-float #content .inner:has(> .entry-content) {
    display: block !important;
  }

  .layout-float #content .inner > .hgroup,
  .layout-float #content .inner > .entry-content,
  .layout-float #content .inner > .tags,
  .layout-float #content .inner > .related-articles,
  .layout-float #content .inner > .comments {
    display: block !important;
    width: 100% !important;
    max-width: 900px !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    grid-column: 1 / -1 !important;
    box-sizing: border-box !important;
  }

  .layout-float #content .inner > .entry-content,
  .layout-float .entry-content,
  .layout-float #article-view {
    min-width: 0 !important;
    word-break: keep-all !important;
    overflow-wrap: break-word !important;
  }

  .layout-float #article-view p,
  .layout-float #article-view div,
  .layout-float #article-view h1,
  .layout-float #article-view h2,
  .layout-float #article-view h3,
  .layout-float #article-view h4,
  .layout-float .entry-content p,
  .layout-float .entry-content li {
    max-width: 100% !important;
    word-break: keep-all !important;
    overflow-wrap: break-word !important;
    line-height: 1.8 !important;
  }

  .layout-float .hgroup {
    padding-top: 36px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
  .layout-float #wrap {
    padding-left: 210px !important;
  }

  .layout-float #header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 210px !important;
    height: 100vh !important;
    overflow-y: auto !important;
    border-right: 1px solid #e6e6e6 !important;
    background: #fff !important;
  }

  .layout-float #content {
    width: calc(100vw - 250px) !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 56px 20px 0 40px !important;
  }

  .layout-float #content .inner:has(> .post-item),
  .layout-float .cover-thumbnail-list-2 ul {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 30px 16px !important;
  }
}

@media screen and (max-width: 767px) {
  .layout-float #wrap {
    padding-left: 0 !important;
  }

  .layout-float #header {
    position: relative !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    border-right: 0 !important;
    border-bottom: 1px solid #e6e6e6 !important;
  }

  .layout-float #content {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 16px !important;
  }

  .layout-float #content .inner:has(> .post-item),
  .layout-float .cover-thumbnail-list-2 ul {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 26px 14px !important;
  }

  .layout-float .cover-slider {
    aspect-ratio: 16 / 9 !important;
    padding-bottom: 0 !important;
  }
}


/* =========================================================
   SNERU FINAL FIX 2026-05-21
   목적:
   1) 좌측 세로 메뉴 유지
   2) 홈 메인 배너 16:9, 본문 영역 폭 안에서 꽉 차게 표시
   3) 홈 인기글 / 목록 글 카드 썸네일 16:9 정상 표시
   4) PC 5열, 태블릿 3열, 모바일 2열 구성
   5) 본문 상세 내용이 모바일처럼 좁아지는 현상 차단
   ========================================================= */

/* 공통 이미지 비율 안정화 */
.layout-float .post-item .thum,
.layout-float.post-type-text .post-item .thum,
.layout-float.post-type-thumbnail .post-item .thum,
.layout-float .cover-thumbnail-list-1 ul li .thum,
.layout-float .cover-thumbnail-list-2 ul li .thum,
.layout-float .related-articles ul li .thum {
  float: none !important;
  display: block !important;
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  padding-bottom: 0 !important;
  margin: 0 0 10px 0 !important;
  overflow: hidden !important;
  background-color: #f2f2f2 !important;
}

.layout-float .post-item .thum img,
.layout-float.post-type-text .post-item .thum img,
.layout-float.post-type-thumbnail .post-item .thum img,
.layout-float .cover-thumbnail-list-1 ul li .thum img,
.layout-float .cover-thumbnail-list-2 ul li .thum img,
.layout-float .related-articles ul li .thum img {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
}

@media screen and (min-width: 1024px) {
  .layout-float #wrap {
    padding-left: 240px !important;
  }

  .layout-float #header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 240px !important;
    height: 100vh !important;
    overflow-y: auto !important;
    border-right: 1px solid #e6e6e6 !important;
    border-bottom: 0 !important;
    background: #fff !important;
  }

  .layout-float #header .inner {
    width: 100% !important;
    max-width: none !important;
  }

  .layout-float #header h1 {
    float: none !important;
    max-width: none !important;
    padding: 84px 20px 62px !important;
    text-align: center !important;
  }

  .layout-float #gnb {
    float: none !important;
    display: block !important;
    padding: 0 40px !important;
  }

  .layout-float #gnb ul li {
    float: none !important;
    display: block !important;
    padding: 0 !important;
    border-bottom: 1px solid #e6e6e6 !important;
    text-align: center !important;
  }

  .layout-float #gnb ul li a {
    display: block !important;
    padding: 10px 0 !important;
    line-height: 1.4 !important;
  }

  .layout-float #content {
    width: calc(100vw - 320px) !important;
    max-width: 1200px !important;
    min-width: 900px !important;
    margin: 0 auto !important;
    padding: 56px 40px 0 40px !important;
    box-sizing: border-box !important;
  }

  .layout-float #content .inner,
  .layout-float .cover-slider,
  .layout-float .cover-thumbnail-list-1,
  .layout-float .cover-thumbnail-list-2,
  .layout-float .hgroup,
  .layout-float .entry-content,
  .layout-float .post-header,
  .layout-float .tags,
  .layout-float .related-articles,
  .layout-float .comments {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* 홈 메인 배너: 본문 폭 기준 16:9 */
  .layout-float .cover-slider {
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    padding-bottom: 0 !important;
    margin: 0 auto 70px !important;
    overflow: hidden !important;
  }

  .layout-float .cover-slider ul,
  .layout-float .cover-slider ul li {
    width: 100% !important;
    height: 100% !important;
  }

  .layout-float .cover-slider ul li {
    background-size: cover !important;
    background-position: center center !important;
  }

  /* 홈 인기글/커버 목록: 5열 */
  .layout-float .cover-thumbnail-list-1,
  .layout-float .cover-thumbnail-list-2 {
    margin: 60px auto 70px !important;
    overflow: visible !important;
  }

  .layout-float .cover-thumbnail-list-1 h2,
  .layout-float .cover-thumbnail-list-2 h2,
  .layout-float .post-header {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 20px !important;
    padding: 0 !important;
    border-top: 1px solid #7a583a !important;
    border-bottom: 1px solid #7a583a !important;
    text-align: center !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 40px !important;
    color: #7a583a !important;
    box-sizing: border-box !important;
  }

  .layout-float .cover-thumbnail-list-1 h2:after {
    display: none !important;
  }

  .layout-float .cover-thumbnail-list-1 ul,
  .layout-float .cover-thumbnail-list-2 ul,
  .layout-float #content .inner:has(> .post-item) {
    float: none !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 38px 18px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    align-items: start !important;
  }

  .layout-float .cover-thumbnail-list-1 ul li,
  .layout-float .cover-thumbnail-list-2 ul li,
  .layout-float .post-item,
  .layout-float.post-type-text .post-item,
  .layout-float.post-type-thumbnail .post-item {
    float: none !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    padding: 0 0 18px 0 !important;
    margin: 0 !important;
    border-bottom: 1px solid #e6e6e6 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .layout-float .post-item:nth-child(n),
  .layout-float .cover-thumbnail-list-1 ul li:nth-child(n),
  .layout-float .cover-thumbnail-list-2 ul li:nth-child(n) {
    padding-left: 0 !important;
  }

  .layout-float .post-item .title,
  .layout-float .cover-thumbnail-list-1 ul li .title,
  .layout-float .cover-thumbnail-list-2 ul li .title {
    display: -webkit-box !important;
    width: 100% !important;
    height: 38px !important;
    margin: 0 0 6px 0 !important;
    padding: 0 !important;
    font-size: 13px !important;
    line-height: 19px !important;
    font-weight: 700 !important;
    color: #000 !important;
    white-space: normal !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    word-break: keep-all !important;
  }

  .layout-float .post-item .excerpt,
  .layout-float .cover-thumbnail-list-2 ul li .excerpt {
    display: -webkit-box !important;
    width: 100% !important;
    height: 54px !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    font-size: 12px !important;
    line-height: 18px !important;
    color: #666 !important;
    overflow: hidden !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    word-break: keep-all !important;
  }

  /* 본문 상세: 내용 폭 정상화 */
  .layout-float #content .inner:has(> .entry-content),
  .layout-float #content .inner:has(> .hgroup) {
    display: block !important;
  }

  .layout-float #content .inner > .hgroup,
  .layout-float #content .inner > .entry-content,
  .layout-float #content .inner > .tags,
  .layout-float #content .inner > .related-articles,
  .layout-float #content .inner > .comments,
  .layout-float #article-view {
    display: block !important;
    width: 100% !important;
    max-width: 900px !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  .layout-float .entry-content p,
  .layout-float #article-view p,
  .layout-float #article-view div,
  .layout-float #article-view li {
    max-width: 100% !important;
    word-break: keep-all !important;
    overflow-wrap: break-word !important;
    line-height: 1.8 !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
  .layout-float #wrap {
    padding-left: 210px !important;
  }

  .layout-float #header {
    position: fixed !important;
    width: 210px !important;
    height: 100vh !important;
    overflow-y: auto !important;
    border-right: 1px solid #e6e6e6 !important;
    background: #fff !important;
  }

  .layout-float #content {
    width: calc(100vw - 250px) !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 48px 20px 0 40px !important;
    box-sizing: border-box !important;
  }

  .layout-float .cover-slider {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    padding-bottom: 0 !important;
    margin: 0 auto 48px !important;
    overflow: hidden !important;
  }

  .layout-float .cover-slider ul li {
    background-size: cover !important;
    background-position: center center !important;
  }

  .layout-float .cover-thumbnail-list-1 ul,
  .layout-float .cover-thumbnail-list-2 ul,
  .layout-float #content .inner:has(> .post-item) {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 32px 16px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .layout-float .cover-thumbnail-list-1 h2,
  .layout-float .cover-thumbnail-list-2 h2,
  .layout-float .post-header {
    float: none !important;
    width: 100% !important;
    margin: 0 auto 20px !important;
    text-align: center !important;
    border-top: 1px solid #7a583a !important;
    border-bottom: 1px solid #7a583a !important;
    line-height: 40px !important;
    color: #7a583a !important;
  }

  .layout-float .cover-thumbnail-list-1 ul li,
  .layout-float .cover-thumbnail-list-2 ul li,
  .layout-float .post-item {
    float: none !important;
    width: auto !important;
    padding: 0 0 18px 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
  }
}

@media screen and (max-width: 767px) {
  .layout-float #wrap {
    padding-left: 0 !important;
  }

  .layout-float #header {
    position: relative !important;
    width: auto !important;
    height: auto !important;
    border-right: 0 !important;
    border-bottom: 1px solid #e6e6e6 !important;
  }

  .layout-float #content {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 0 14px !important;
    box-sizing: border-box !important;
  }

  .layout-float .cover-slider {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    padding-bottom: 0 !important;
    margin: 0 auto 36px !important;
    overflow: hidden !important;
  }

  .layout-float .cover-slider ul li {
    background-size: cover !important;
    background-position: center center !important;
  }

  .layout-float .cover-thumbnail-list-1 ul,
  .layout-float .cover-thumbnail-list-2 ul,
  .layout-float #content .inner:has(> .post-item) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 28px 14px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .layout-float .cover-thumbnail-list-1 h2,
  .layout-float .cover-thumbnail-list-2 h2,
  .layout-float .post-header {
    float: none !important;
    width: 100% !important;
    margin: 0 auto 18px !important;
    text-align: center !important;
    border-top: 1px solid #7a583a !important;
    border-bottom: 1px solid #7a583a !important;
    line-height: 38px !important;
    color: #7a583a !important;
  }

  .layout-float .cover-thumbnail-list-1 ul li,
  .layout-float .cover-thumbnail-list-2 ul li,
  .layout-float .post-item {
    float: none !important;
    width: auto !important;
    padding: 0 0 16px 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
  }

  .layout-float .post-item .title,
  .layout-float .cover-thumbnail-list-1 ul li .title,
  .layout-float .cover-thumbnail-list-2 ul li .title {
    font-size: 12px !important;
    line-height: 18px !important;
    height: 36px !important;
  }

  .layout-float .post-item .excerpt,
  .layout-float .cover-thumbnail-list-2 ul li .excerpt {
    font-size: 11px !important;
    line-height: 17px !important;
    height: 51px !important;
  }
}


/* =========================================================
   SNERU FINAL PATCH - MOBILE TABLE OVERFLOW FIX
   모바일 본문 표 잘림 방지: 표는 본문 폭 안에서 가로 스크롤 처리
   ========================================================= */
.entry-content,
#article-view {
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow-wrap: break-word !important;
}

.entry-content table,
#article-view table {
  max-width: 100% !important;
  border-collapse: collapse !important;
  box-sizing: border-box !important;
}

.entry-content table img,
#article-view table img {
  max-width: 100% !important;
  height: auto !important;
}

@media screen and (max-width: 767px) {
  .entry-content,
  #article-view {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  .entry-content table,
  #article-view table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    white-space: nowrap !important;
  }

  .entry-content table thead,
  .entry-content table tbody,
  .entry-content table tr,
  #article-view table thead,
  #article-view table tbody,
  #article-view table tr {
    width: max-content !important;
  }

  .entry-content table th,
  .entry-content table td,
  #article-view table th,
  #article-view table td {
    min-width: 86px !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    box-sizing: border-box !important;
  }
}

/* ==================================================
   상식한입 최종 본문 제목 서식
   - H2: 배경 없음 / 진한 브라운 / 대제목 크기 확대
   - H3: 브라운 소제목 / 좌측 포인트 / 하단 라인
   - H4: 브라운 Bold 강조 소제목
================================================== */

.entry-content h2,
.entry-content h2[data-ke-size="size26"],
.entry-content h2[style] {
  clear: both !important;
  margin: 50px 0 26px !important;
  padding: 0 !important;
  font-size: 34px !important;
  font-weight: 900 !important;
  line-height: 1.35 !important;
  letter-spacing: -1.2px !important;
  color: #5B4636 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

.entry-content h2 *,
.entry-content h2 a,
.entry-content h2 span,
.entry-content h2 b,
.entry-content h2 strong {
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  color: #5B4636 !important;
}

.entry-content h3,
.entry-content h3[data-ke-size="size23"],
.entry-content h3[style] {
  clear: both !important;
  position: relative !important;
  margin: 32px 0 16px !important;
  padding: 10px 0 10px 18px !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 1.4 !important;
  letter-spacing: -0.7px !important;
  color: #5B4636 !important;
  background: transparent !important;
  border-top: none !important;
  border-right: none !important;
  border-bottom: 2px solid #D8BE89 !important;
  border-left: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

.entry-content h3 *,
.entry-content h3 a,
.entry-content h3 span,
.entry-content h3 b,
.entry-content h3 strong {
  font-size: inherit !important;
  font-weight: inherit !important;
  color: #5B4636 !important;
}

.entry-content h3:before,
.entry-content h3[data-ke-size="size23"]:before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 8px !important;
  width: 7px !important;
  height: calc(100% - 16px) !important;
  background: #A8794A !important;
  clip-path: none !important;
}

.entry-content h4,
.entry-content h4[data-ke-size="size20"],
.entry-content h4[style] {
  clear: both !important;
  margin: 24px 0 12px !important;
  padding: 0 !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1.5 !important;
  letter-spacing: -0.4px !important;
  color: #7A583A !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.entry-content h4 *,
.entry-content h4 a,
.entry-content h4 span,
.entry-content h4 b,
.entry-content h4 strong {
  font-size: inherit !important;
  font-weight: inherit !important;
  color: #7A583A !important;
}

@media screen and (max-width:767px) {
  .entry-content h2,
  .entry-content h2[data-ke-size="size26"],
  .entry-content h2[style] {
    margin: 42px 0 22px !important;
    padding: 0 !important;
    font-size: 30px !important;
    line-height: 1.35 !important;
    letter-spacing: -1px !important;
  }

  .entry-content h3,
  .entry-content h3[data-ke-size="size23"],
  .entry-content h3[style] {
    margin: 30px 0 15px !important;
    padding: 9px 0 9px 16px !important;
    font-size: 21px !important;
    line-height: 1.4 !important;
    letter-spacing: -0.6px !important;
  }

  .entry-content h3:before,
  .entry-content h3[data-ke-size="size23"]:before {
    top: 8px !important;
    width: 6px !important;
    height: calc(100% - 16px) !important;
  }

  .entry-content h4,
  .entry-content h4[data-ke-size="size20"],
  .entry-content h4[style] {
    margin: 22px 0 10px !important;
    font-size: 18px !important;
    line-height: 1.45 !important;
  }
}

/* =========================================================
   HANIP ENCYCLOPEDIA SKIN v2
   상식한입 도감형 브랜드 스킨 최종 오버라이드
   - 번역/제목/본문 서식 유지
   - 홈: 브랜드 히어로 + 카테고리 카드 + 탐색 트랙
   - 목록: 16:9 카드형 도감 그리드
   - 본문: 읽기 폭 안정화 + 다른 카테고리 유도
   ========================================================= */

:root {
  --hanip-bg: #fbf4e7;
  --hanip-paper: #fffaf1;
  --hanip-paper-strong: #fff6df;
  --hanip-brown: #5b3f2d;
  --hanip-brown-2: #7a583a;
  --hanip-brown-3: #a8794a;
  --hanip-gold: #d8be89;
  --hanip-butter: #ffe7a3;
  --hanip-olive: #6f7b45;
  --hanip-red: #b7654d;
  --hanip-line: rgba(91, 63, 45, 0.16);
  --hanip-shadow: 0 18px 45px rgba(91, 63, 45, 0.12);
  --hanip-soft-shadow: 0 10px 26px rgba(91, 63, 45, 0.09);
  --hanip-radius-xl: 30px;
  --hanip-radius-lg: 22px;
  --hanip-radius-md: 16px;
}

html, body {
  min-width: 0 !important;
  background: var(--hanip-bg) !important;
  color: #2f241d !important;
  word-break: keep-all;
}

body {
  font-family: Pretendard-Regular, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", Arial, sans-serif !important;
  line-height: 1.65 !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 12% 8%, rgba(255, 231, 163, .72) 0, transparent 26%),
    radial-gradient(circle at 92% 16%, rgba(216, 190, 137, .34) 0, transparent 24%),
    linear-gradient(180deg, #fff7e7 0%, #fbf4e7 44%, #f5e8d1 100%);
}

#wrap {
  overflow: visible !important;
  padding-left: 0 !important;
}

.hanip-scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  width: 100%;
  height: 4px;
  background: rgba(91, 63, 45, .08);
}

.hanip-scroll-progress span {
  display: block;
  width: 0;
  height: 100%;
  background: linear-gradient(90deg, var(--hanip-brown), var(--hanip-gold));
  transition: width .12s linear;
}

/* Header */
#header.hanip-header,
.layout-float #header.hanip-header {
  position: sticky !important;
  top: 0 !important;
  left: auto !important;
  z-index: 9500 !important;
  width: 100% !important;
  height: auto !important;
  min-height: 76px !important;
  overflow: visible !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(91, 63, 45, .12) !important;
  background: rgba(255, 250, 241, .88) !important;
  backdrop-filter: blur(18px) saturate(1.2);
  -webkit-backdrop-filter: blur(18px) saturate(1.2);
  box-shadow: 0 12px 32px rgba(91, 63, 45, .07) !important;
}

#header.hanip-header.is-scrolled {
  box-shadow: 0 14px 35px rgba(91, 63, 45, .14) !important;
}

#header .hanip-header-inner,
.layout-float #header .hanip-header-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  width: min(1240px, calc(100% - 48px)) !important;
  max-width: 1240px !important;
  min-height: 76px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

#header .hanip-header-inner::after { display: none !important; }

.hanip-brand-block {
  flex: 0 0 auto;
  min-width: 180px;
}

#header h1,
.layout-float #header h1 {
  float: none !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 26px !important;
  line-height: 1.05 !important;
  letter-spacing: -1px !important;
  font-weight: 900 !important;
}

#header h1 a {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  color: var(--hanip-brown) !important;
  text-decoration: none !important;
}

#header h1 a::before {
  content: "";
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 36% 34%, #fff7d7 0 18%, transparent 19%),
    linear-gradient(135deg, var(--hanip-brown) 0%, var(--hanip-brown-3) 100%);
  box-shadow: inset 0 0 0 3px rgba(255,255,255,.42), 0 8px 18px rgba(91,63,45,.22);
}

#header h1 img {
  max-height: 34px !important;
  height: 34px !important;
  width: auto !important;
}

.hanip-brand-sub {
  margin-top: 6px !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  color: rgba(91, 63, 45, .66) !important;
  letter-spacing: -0.2px;
}

#gnb,
.layout-float #gnb {
  float: none !important;
  position: static !important;
  flex: 1 1 auto !important;
  display: flex !important;
  justify-content: flex-end !important;
  min-width: 0 !important;
}

#gnb ul,
.layout-float #gnb ul {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

#gnb ul li,
.layout-float #gnb ul li {
  float: none !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 14px !important;
}

#gnb ul li a,
.layout-float #gnb ul li a {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 34px;
  padding: 0 13px !important;
  border: 1px solid rgba(91, 63, 45, .12);
  border-radius: 999px;
  background: rgba(255,255,255,.38);
  color: var(--hanip-brown) !important;
  font-weight: 700;
  line-height: 1 !important;
  text-decoration: none !important;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}

#gnb ul li a:hover {
  transform: translateY(-1px);
  background: var(--hanip-brown) !important;
  color: #fffaf1 !important;
  box-shadow: 0 8px 18px rgba(91, 63, 45, .18);
}

#gnb ul li a:hover::after { display: none !important; }

#header .mobile-menu {
  display: none;
  position: relative;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background: var(--hanip-brown);
  color: #fff;
  text-indent: -9999px;
}

#header .mobile-menu::before,
#header .mobile-menu::after,
#header .mobile-menu span::before {
  content: "";
  position: absolute;
  left: 12px;
  width: 18px;
  height: 2px;
  border-radius: 2px;
  background: #fff;
}
#header .mobile-menu::before { top: 14px; }
#header .mobile-menu span::before { top: 20px; }
#header .mobile-menu::after { top: 26px; }

/* Layout reset */
.layout-float #content,
#content {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

.container {
  position: relative;
}

/* Translation bar */
.sneru-translate-bar {
  position: sticky !important;
  top: 76px !important;
  z-index: 9200 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: min(1240px, calc(100% - 48px)) !important;
  min-height: 48px !important;
  margin: 16px auto 18px !important;
  padding: 8px 14px !important;
  border: 1px solid rgba(91, 63, 45, .12) !important;
  border-radius: 999px !important;
  background: rgba(255, 250, 241, .92) !important;
  box-shadow: var(--hanip-soft-shadow) !important;
  backdrop-filter: blur(14px);
  box-sizing: border-box !important;
}

.sneru-translate-bar::before {
  content: "Language";
  margin-right: 4px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  color: rgba(91, 63, 45, .72);
  text-transform: uppercase;
}

.sneru-lang-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  border: 1px solid rgba(91, 63, 45, .14) !important;
  border-radius: 999px !important;
  background: #fff !important;
  box-shadow: 0 5px 12px rgba(91, 63, 45, .08) !important;
  transition: transform .16s ease, box-shadow .16s ease !important;
}

.sneru-lang-btn:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 18px rgba(91, 63, 45, .16) !important;
}

.sneru-lang-btn img {
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
}

#google_translate_element,
.goog-te-gadget,
.goog-te-banner-frame.skiptranslate,
body > .skiptranslate {
  display: none !important;
}

/* Home hub */
.hanip-home {
  display: none;
  width: min(1240px, calc(100% - 48px));
  margin: 0 auto 48px;
}

body#tt-body-index .hanip-home {
  display: block;
}

.hanip-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr);
  gap: 28px;
  overflow: hidden;
  min-height: 420px;
  padding: 46px;
  border: 1px solid rgba(91, 63, 45, .12);
  border-radius: var(--hanip-radius-xl);
  background:
    linear-gradient(135deg, rgba(255, 250, 241, .95) 0%, rgba(255, 242, 207, .92) 52%, rgba(229, 202, 151, .76) 100%);
  box-shadow: var(--hanip-shadow);
}

.hanip-hero::before,
.hanip-hero::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}
.hanip-hero::before {
  right: -80px;
  top: -90px;
  width: 300px;
  height: 300px;
  background: rgba(91, 63, 45, .09);
}
.hanip-hero::after {
  right: 32%;
  bottom: -120px;
  width: 230px;
  height: 230px;
  background: rgba(255, 231, 163, .58);
}

.hanip-hero-copy,
.hanip-hero-board {
  position: relative;
  z-index: 1;
}

.hanip-eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(91, 63, 45, .1);
  color: var(--hanip-brown);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .09em;
}

.hanip-hero h2 {
  margin: 24px 0 18px !important;
  color: var(--hanip-brown) !important;
  font-size: clamp(40px, 5vw, 72px) !important;
  font-weight: 950 !important;
  line-height: .98 !important;
  letter-spacing: -3.2px !important;
}

.hanip-hero p {
  max-width: 590px;
  margin: 0 !important;
  color: rgba(47, 36, 29, .72) !important;
  font-size: 18px !important;
  line-height: 1.75 !important;
  letter-spacing: -0.4px;
}

.hanip-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 30px;
}

.hanip-hero-actions a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 18px;
  border-radius: 999px;
  background: var(--hanip-brown);
  color: #fffaf1 !important;
  font-size: 14px;
  font-weight: 900;
  text-decoration: none !important;
  box-shadow: 0 10px 22px rgba(91, 63, 45, .22);
  transition: transform .18s ease, box-shadow .18s ease;
}

.hanip-hero-actions a:nth-child(2) { background: var(--hanip-olive); }
.hanip-hero-actions a:nth-child(3) { background: var(--hanip-red); }
.hanip-hero-actions a:hover { transform: translateY(-2px); box-shadow: 0 16px 28px rgba(91, 63, 45, .24); }

.hanip-hero-board {
  align-self: center;
  display: grid;
  gap: 14px;
}

.hanip-board-card {
  padding: 22px;
  border: 1px solid rgba(91, 63, 45, .12);
  border-radius: 24px;
  background: rgba(255, 255, 255, .5);
  box-shadow: 0 10px 26px rgba(91,63,45,.08);
}

.hanip-board-card.main {
  min-height: 166px;
  background: var(--hanip-brown);
  color: #fffaf1;
}

.hanip-board-card span {
  display: block;
  margin-bottom: 9px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .1em;
  opacity: .75;
}

.hanip-board-card strong {
  display: block;
  color: inherit;
  font-size: 25px;
  font-weight: 950;
  line-height: 1.25;
  letter-spacing: -1px;
}

.hanip-board-card p {
  margin-top: 10px !important;
  color: rgba(255, 250, 241, .72) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}

.hanip-category-deck {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 14px;
  margin-top: 18px;
}

.hanip-cat-card {
  position: relative;
  overflow: hidden;
  min-height: 160px;
  padding: 20px;
  border: 1px solid rgba(91, 63, 45, .12);
  border-radius: 24px;
  background: var(--hanip-paper);
  color: var(--hanip-brown) !important;
  text-decoration: none !important;
  box-shadow: var(--hanip-soft-shadow);
  transition: transform .18s ease, box-shadow .18s ease;
}

.hanip-cat-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--hanip-shadow);
}

.hanip-cat-card::after {
  content: "";
  position: absolute;
  right: -34px;
  bottom: -40px;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: rgba(216, 190, 137, .23);
}

.hanip-cat-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  margin-bottom: 24px;
  border-radius: 16px;
  background: rgba(91, 63, 45, .1);
  color: var(--hanip-brown);
  font-size: 18px;
  font-style: normal;
  font-weight: 950;
}

.hanip-cat-card strong {
  display: block;
  position: relative;
  z-index: 1;
  margin-bottom: 7px;
  font-size: 20px;
  font-weight: 950;
  line-height: 1.2;
  letter-spacing: -0.8px;
}

.hanip-cat-card em {
  display: block;
  position: relative;
  z-index: 1;
  color: rgba(47, 36, 29, .64);
  font-size: 13px;
  font-style: normal;
  line-height: 1.45;
  letter-spacing: -0.2px;
}

.hanip-cat-card.question { background: linear-gradient(180deg, #fff8df, #fffaf1); }
.hanip-cat-card.compare { background: linear-gradient(180deg, #fff3e7, #fffaf1); }
.hanip-cat-card.archive { background: linear-gradient(180deg, #f5f0df, #fffaf1); }
.hanip-cat-card.meat { background: linear-gradient(180deg, #f8e7dc, #fffaf1); }
.hanip-cat-card.ingredient { background: linear-gradient(180deg, #eef1dc, #fffaf1); }
.hanip-cat-card.place { background: linear-gradient(180deg, #f3e7d7, #fffaf1); }

.hanip-track-section {
  margin-top: 28px;
  padding: 30px;
  border: 1px solid rgba(91, 63, 45, .12);
  border-radius: var(--hanip-radius-xl);
  background: rgba(255, 250, 241, .72);
  box-shadow: var(--hanip-soft-shadow);
}

.hanip-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}

.hanip-section-head span {
  color: var(--hanip-brown-3);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .1em;
}

.hanip-section-head h3 {
  margin: 0 !important;
  color: var(--hanip-brown) !important;
  font-size: 28px !important;
  font-weight: 950 !important;
  letter-spacing: -1px !important;
}

.hanip-track-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.hanip-track-card {
  display: block;
  min-height: 120px;
  padding: 22px;
  border-radius: 20px;
  background: #fff;
  color: var(--hanip-brown) !important;
  text-decoration: none !important;
  box-shadow: 0 8px 20px rgba(91,63,45,.07);
}

.hanip-track-card b {
  display: block;
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 950;
  letter-spacing: -0.5px;
}

.hanip-track-card p {
  margin: 0 !important;
  color: rgba(47,36,29,.64) !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
}

/* Cover components */
.cover-slider,
.cover-thumbnail-list-1,
.cover-thumbnail-list-2,
.cover-special-contents,
.cover-wide-panel {
  width: min(1240px, calc(100% - 48px)) !important;
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.cover-slider {
  overflow: hidden !important;
  height: auto !important;
  min-height: 360px;
  padding-bottom: 0 !important;
  margin-top: 24px !important;
  margin-bottom: 42px !important;
  border-radius: var(--hanip-radius-xl);
  box-shadow: var(--hanip-shadow);
  background: var(--hanip-brown);
}

.cover-slider ul,
.cover-slider ul li {
  position: relative !important;
  min-height: 360px;
}

.cover-slider ul li .text-box {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  min-height: 360px;
  padding: 46px !important;
  background: linear-gradient(90deg, rgba(37,25,18,.76), rgba(37,25,18,.18)) !important;
  text-align: left !important;
  box-sizing: border-box;
}

.cover-slider ul li .text-box .title {
  max-width: 760px;
  margin: 0 0 24px !important;
  color: #fffaf1 !important;
  font-size: clamp(32px, 4.5vw, 58px) !important;
  font-weight: 950 !important;
  line-height: 1.08 !important;
  letter-spacing: -2.5px !important;
  text-shadow: 0 8px 24px rgba(0,0,0,.28) !important;
}

.cover-slider ul li .text-box .title em {
  display: inline-flex !important;
  width: auto;
  margin: 0 0 14px !important;
  padding: 7px 11px;
  border-radius: 999px;
  background: rgba(255, 231, 163, .9);
  color: var(--hanip-brown) !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  text-shadow: none !important;
}

.btn,
a.btn,
.cover-slider ul li .text-box .btn,
.cover-wide-panel .btn,
.cover-special-contents .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-height: 42px;
  padding: 0 18px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--hanip-brown) !important;
  color: #fffaf1 !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  box-shadow: 0 10px 20px rgba(91,63,45,.22) !important;
}

.cover-thumbnail-list-1,
.cover-thumbnail-list-2 {
  margin-top: 34px !important;
  margin-bottom: 42px !important;
  padding: 0 !important;
  overflow: visible !important;
}

.cover-thumbnail-list-1 h2,
.cover-thumbnail-list-2 h2,
.post-header h2 {
  float: none !important;
  width: auto !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--hanip-brown) !important;
  text-align: left !important;
  font-size: 28px !important;
  font-weight: 950 !important;
  line-height: 1.25 !important;
  letter-spacing: -1.1px !important;
}

.cover-thumbnail-list-1 h2::after,
.cover-thumbnail-list-2 h2::after,
.post-header h2::after {
  content: "" !important;
  display: block !important;
  width: 42px !important;
  height: 4px !important;
  margin-top: 10px !important;
  border-radius: 999px !important;
  background: var(--hanip-gold) !important;
}

.cover-thumbnail-list-1 ul,
.cover-thumbnail-list-2 ul {
  float: none !important;
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 18px !important;
  width: 100% !important;
  margin: 0 !important;
}

.cover-thumbnail-list-1 ul li,
.cover-thumbnail-list-2 ul li {
  float: none !important;
  width: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: left !important;
  box-sizing: border-box !important;
}

.cover-thumbnail-list-1 ul li a,
.cover-thumbnail-list-2 ul li a {
  display: block !important;
  height: 100% !important;
  padding: 12px 12px 18px !important;
  border: 1px solid rgba(91,63,45,.12);
  border-radius: 22px;
  background: var(--hanip-paper);
  box-shadow: var(--hanip-soft-shadow);
  text-decoration: none !important;
  transition: transform .18s ease, box-shadow .18s ease;
}

.cover-thumbnail-list-1 ul li a:hover,
.cover-thumbnail-list-2 ul li a:hover {
  transform: translateY(-4px);
  box-shadow: var(--hanip-shadow);
}

.cover-thumbnail-list-1 ul li .thum,
.cover-thumbnail-list-2 ul li .thum {
  display: block !important;
  position: relative !important;
  overflow: hidden !important;
  width: 100% !important;
  height: auto !important;
  padding-bottom: 56.25% !important;
  margin: 0 0 14px !important;
  border-radius: 16px;
  background: #eadcc3 !important;
}

.cover-thumbnail-list-1 ul li .thum img,
.cover-thumbnail-list-2 ul li .thum img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.cover-thumbnail-list-1 ul li .title,
.cover-thumbnail-list-2 ul li .title {
  display: -webkit-box !important;
  overflow: hidden !important;
  min-height: 48px;
  margin: 0 !important;
  color: var(--hanip-brown) !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  line-height: 1.42 !important;
  letter-spacing: -0.6px !important;
  text-overflow: ellipsis !important;
  white-space: normal !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

.cover-thumbnail-list-2 ul li .excerpt {
  display: -webkit-box !important;
  overflow: hidden !important;
  height: auto !important;
  min-height: 44px;
  margin: 8px 0 14px !important;
  color: rgba(47,36,29,.62) !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

.cover-thumbnail-list-2 ul li .more,
.post-item .more {
  display: inline-flex !important;
  align-items: center;
  color: var(--hanip-brown-2) !important;
  font-size: 12px !important;
  font-weight: 900;
}

/* Post list grid */
.post-header {
  width: min(1240px, calc(100% - 48px)) !important;
  max-width: 1240px !important;
  margin: 34px auto 18px !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: visible !important;
  color: var(--hanip-brown) !important;
}

body#tt-body-index #content > .inner,
body#tt-body-category #content > .inner,
body#tt-body-search #content > .inner,
body#tt-body-archive #content > .inner,
body#tt-body-tag #content > .inner,
.layout-float.post-type-thumbnail #content > .inner,
.layout-float.post-type-text #content > .inner {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 22px !important;
  width: min(1240px, calc(100% - 48px)) !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

.post-item,
.layout-float.post-type-thumbnail .post-item,
.layout-float.post-type-text .post-item,
.post-type-text .post-item {
  float: none !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.post-item:nth-child(odd),
.post-item:nth-child(even),
.post-item:nth-child(3n+1),
.post-item:nth-child(4n+1),
.post-item:nth-child(5n+1) {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.post-item a,
.layout-float.post-type-thumbnail .post-item a,
.layout-float.post-type-text .post-item a {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-height: 320px;
  padding: 12px 12px 18px !important;
  border: 1px solid rgba(91,63,45,.12);
  border-radius: 24px;
  background: var(--hanip-paper);
  color: var(--hanip-brown) !important;
  text-decoration: none !important;
  box-shadow: var(--hanip-soft-shadow);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.post-item a:hover {
  transform: translateY(-5px);
  border-color: rgba(91, 63, 45, .22);
  box-shadow: var(--hanip-shadow);
}

.post-item .thum,
.cover-thumbnail-list-2 ul li .thum,
.layout-float.post-type-thumbnail .post-item .thum,
.layout-float.post-type-text .post-item .thum,
.post-type-text .post-item .thum {
  display: block !important;
  position: relative !important;
  overflow: hidden !important;
  width: 100% !important;
  height: auto !important;
  flex: 0 0 auto !important;
  margin: 0 0 14px !important;
  padding-bottom: 56.25% !important;
  border-radius: 18px !important;
  background:
    linear-gradient(135deg, rgba(216,190,137,.5), rgba(255,246,223,.9)) !important;
}

.post-item .thum::before,
.cover-thumbnail-list-2 ul li .thum::before {
  content: "한입" !important;
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  background: none !important;
  color: rgba(91,63,45,.34) !important;
  font-size: 20px !important;
  font-weight: 950 !important;
  letter-spacing: -0.8px !important;
}

.post-item .thum img,
.cover-thumbnail-list-2 ul li .thum img,
.layout-float.post-type-thumbnail .post-item .thum img,
.layout-float.post-type-text .post-item .thum img,
.post-type-text .post-item .thum img {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  object-fit: cover !important;
  transition: transform .24s ease !important;
}

.post-item a:hover .thum img { transform: scale(1.035); }
.post-item .thum::after,
.cover-thumbnail-list-2 ul li .thum::after { display: none !important; }

.post-item .title,
.cover-thumbnail-list-2 ul li .title,
.layout-float.post-type-thumbnail .post-item .title,
.layout-float.post-type-text .post-item .title,
.post-type-text .post-item .title {
  display: -webkit-box !important;
  overflow: hidden !important;
  width: 100% !important;
  min-height: 52px !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  color: var(--hanip-brown) !important;
  font-size: 18px !important;
  font-weight: 950 !important;
  line-height: 1.45 !important;
  letter-spacing: -0.8px !important;
  text-overflow: ellipsis !important;
  white-space: normal !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

.post-item .excerpt,
.cover-thumbnail-list-2 ul li .excerpt,
.layout-float.post-type-thumbnail .post-item .excerpt,
.layout-float.post-type-text .post-item .excerpt,
.post-type-text .post-item .excerpt {
  display: -webkit-box !important;
  overflow: hidden !important;
  width: 100% !important;
  height: auto !important;
  min-height: 46px !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  color: rgba(47,36,29,.62) !important;
  font-size: 13.5px !important;
  line-height: 1.65 !important;
  text-overflow: ellipsis !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

.post-item .more {
  margin-top: auto !important;
}

/* Article page */
.hgroup,
.hgroup.guest,
.hgroup.tag,
.layout-float .hgroup {
  width: min(900px, calc(100% - 48px)) !important;
  max-width: 900px !important;
  margin: 34px auto 34px !important;
  padding: 38px 0 26px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(91,63,45,.14) !important;
  background: transparent !important;
}

.hgroup .category {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  margin: 0 0 14px !important;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(216,190,137,.28);
  color: var(--hanip-brown) !important;
  font-size: 13px !important;
  font-weight: 900 !important;
}

.hgroup h1 {
  max-width: 880px;
  color: var(--hanip-brown) !important;
  font-size: clamp(30px, 4.5vw, 50px) !important;
  font-weight: 950 !important;
  line-height: 1.16 !important;
  letter-spacing: -2px !important;
}

.hgroup .post-meta {
  margin-top: 18px !important;
  color: rgba(91,63,45,.48) !important;
  font-size: 13px !important;
}

.entry-content,
#article-view,
.layout-float .entry-content {
  width: min(900px, calc(100% - 48px)) !important;
  max-width: 900px !important;
  margin: 0 auto !important;
  padding: 34px 38px 60px !important;
  border: 1px solid rgba(91,63,45,.10);
  border-radius: var(--hanip-radius-xl);
  background: rgba(255,250,241,.82) !important;
  color: #2f241d !important;
  box-shadow: var(--hanip-soft-shadow);
  box-sizing: border-box !important;
}

#article-view p,
.entry-content p {
  color: #332820 !important;
  font-size: 17px !important;
  line-height: 1.86 !important;
  letter-spacing: -0.2px;
}

#article-view a,
.entry-content a {
  color: #7a4e29 !important;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

#article-view img,
.entry-content img {
  max-width: 100% !important;
  height: auto !important;
}

#article-view figure,
.entry-content figure {
  max-width: 100% !important;
}

#article-view table,
.entry-content table {
  max-width: 100% !important;
}

/* Keep agreed title hierarchy */
.entry-content h2,
.entry-content h2[data-ke-size="size26"],
.entry-content h2[style],
#article-view h2,
#article-view h2[data-ke-size="size26"],
#article-view h2[style] {
  clear: both !important;
  margin: 52px 0 26px !important;
  padding: 0 !important;
  color: var(--hanip-brown) !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 34px !important;
  font-weight: 950 !important;
  line-height: 1.35 !important;
  letter-spacing: -1.3px !important;
}

.entry-content h3,
.entry-content h3[data-ke-size="size23"],
.entry-content h3[style],
#article-view h3,
#article-view h3[data-ke-size="size23"],
#article-view h3[style] {
  clear: both !important;
  position: relative !important;
  margin: 34px 0 16px !important;
  padding: 10px 0 10px 18px !important;
  color: var(--hanip-brown) !important;
  background: transparent !important;
  border-top: none !important;
  border-right: none !important;
  border-bottom: 2px solid var(--hanip-gold) !important;
  border-left: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  line-height: 1.4 !important;
  letter-spacing: -0.7px !important;
}

.entry-content h3::before,
.entry-content h3[data-ke-size="size23"]::before,
#article-view h3::before,
#article-view h3[data-ke-size="size23"]::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 8px !important;
  width: 7px !important;
  height: calc(100% - 16px) !important;
  background: var(--hanip-brown-3) !important;
}

.entry-content h4,
.entry-content h4[data-ke-size="size20"],
.entry-content h4[style],
#article-view h4,
#article-view h4[data-ke-size="size20"],
#article-view h4[style] {
  clear: both !important;
  margin: 24px 0 12px !important;
  padding: 0 !important;
  color: var(--hanip-brown-2) !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 1.5 !important;
  letter-spacing: -0.4px !important;
}

.entry-content h2 *, .entry-content h3 *, .entry-content h4 *,
#article-view h2 *, #article-view h3 *, #article-view h4 * {
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}

/* After reading */
.hanip-after-reading,
.related-articles,
.tags,
.comments,
.pagination {
  width: min(900px, calc(100% - 48px)) !important;
  max-width: 900px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

.hanip-after-reading {
  margin-top: 24px !important;
  margin-bottom: 24px !important;
  padding: 26px;
  border: 1px solid rgba(91,63,45,.12);
  border-radius: 24px;
  background: rgba(255,250,241,.82);
  box-shadow: var(--hanip-soft-shadow);
}

.hanip-after-title {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 16px;
}

.hanip-after-title span {
  color: var(--hanip-brown-3);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .1em;
}

.hanip-after-title strong {
  color: var(--hanip-brown);
  font-size: 20px;
  font-weight: 950;
  letter-spacing: -0.7px;
}

.hanip-after-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.hanip-after-grid a {
  display: block;
  padding: 18px;
  border-radius: 18px;
  background: #fff;
  color: var(--hanip-brown) !important;
  text-decoration: none !important;
  box-shadow: 0 7px 16px rgba(91,63,45,.07);
}

.hanip-after-grid b {
  display: block;
  margin-bottom: 6px;
  font-size: 17px;
  font-weight: 950;
}

.hanip-after-grid em {
  display: block;
  color: rgba(47,36,29,.6);
  font-size: 13px;
  font-style: normal;
  line-height: 1.45;
}

.related-articles {
  margin-top: 24px !important;
  padding: 30px !important;
  border: 1px solid rgba(91,63,45,.12) !important;
  border-radius: 24px !important;
  background: rgba(255,250,241,.82) !important;
  box-shadow: var(--hanip-soft-shadow);
}

.related-articles h2,
.tags h2 {
  margin: 0 0 16px !important;
  color: var(--hanip-brown) !important;
  font-size: 22px !important;
  font-weight: 950 !important;
  letter-spacing: -0.7px !important;
}

.related-articles ul {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 14px !important;
  margin: 0 !important;
}

.related-articles li {
  width: auto !important;
  padding: 0 !important;
  margin: 0 !important;
}

.related-articles li a {
  display: block !important;
  padding: 10px 10px 14px;
  border-radius: 18px;
  background: #fff;
  color: var(--hanip-brown) !important;
  text-decoration: none !important;
  box-shadow: 0 7px 16px rgba(91,63,45,.07);
}

.related-articles li .thum {
  display: block !important;
  position: relative !important;
  overflow: hidden !important;
  width: 100% !important;
  height: auto !important;
  padding-bottom: 56.25% !important;
  margin-bottom: 10px;
  border-radius: 14px;
  background: #eadcc3;
}

.related-articles li .thum img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.related-articles li .title {
  display: -webkit-box !important;
  overflow: hidden;
  min-height: 42px;
  color: var(--hanip-brown) !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1.45 !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.tags {
  margin-top: 24px !important;
  padding: 24px !important;
  border-radius: 22px;
  background: rgba(255,250,241,.62);
}

.tags .items a,
#content .tags .items a {
  display: inline-flex !important;
  align-items: center;
  min-height: 32px;
  margin: 4px 5px 4px 0 !important;
  padding: 0 12px !important;
  border-radius: 999px;
  background: #fff;
  color: var(--hanip-brown-2) !important;
  font-size: 13px !important;
  font-weight: 800;
  text-decoration: none !important;
  box-shadow: 0 5px 12px rgba(91,63,45,.06);
}

/* Sidebar / footer */
#aside {
  width: min(1240px, calc(100% - 48px));
  margin: 70px auto 0 !important;
  padding: 34px 0 22px !important;
  border-top: 1px solid rgba(91,63,45,.14) !important;
}

#aside .inner {
  display: grid !important;
  grid-template-columns: 1fr 1.15fr 1fr;
  gap: 24px;
  max-width: none !important;
  overflow: visible !important;
}

#aside .sidebar-1,
#aside .sidebar-2,
#aside .sidebar-3 {
  float: none !important;
  width: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
}

#aside h2 {
  color: var(--hanip-brown) !important;
  font-size: 15px !important;
  font-weight: 950 !important;
}

#aside .posts,
#aside .tags,
#aside .search,
#aside .count {
  margin: 0 0 18px !important;
  padding: 20px;
  border: 1px solid rgba(91,63,45,.10);
  border-radius: 20px;
  background: rgba(255,250,241,.72);
  box-shadow: 0 8px 20px rgba(91,63,45,.06);
}

#aside .posts li { border-bottom: 1px solid rgba(91,63,45,.10) !important; }
#aside .posts li a { color: rgba(47,36,29,.62) !important; }
#aside .posts li a:hover { color: var(--hanip-brown) !important; }
#aside .count .total { color: var(--hanip-brown) !important; }

#footer {
  margin-top: 0;
  padding: 28px 0 !important;
  background: var(--hanip-brown) !important;
}

#footer .copyright {
  color: rgba(255,250,241,.74) !important;
  font-size: 13px !important;
}

#footer .copyright strong,
#footer a {
  color: #fffaf1 !important;
}

/* Admin / edit icon clipping defensive fix */
#wrap,
.container,
#content,
#content .inner,
.entry-content,
#article-view,
.post-item,
.post-item a,
.hgroup {
  overflow: visible !important;
}

/* Pagination */
.pagination {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 44px !important;
  padding: 0 !important;
}

.pagination a {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  height: 38px;
  padding: 0 12px;
  border-radius: 999px;
  background: #fff;
  color: var(--hanip-brown) !important;
  font-weight: 900;
  text-decoration: none !important;
  box-shadow: 0 6px 14px rgba(91,63,45,.08);
}

/* Responsive */
@media screen and (max-width: 1180px) {
  .hanip-category-deck { grid-template-columns: repeat(3, 1fr); }
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner,
  .layout-float.post-type-thumbnail #content > .inner,
  .layout-float.post-type-text #content > .inner {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .cover-thumbnail-list-1 ul,
  .cover-thumbnail-list-2 ul { grid-template-columns: repeat(3, 1fr) !important; }
}

@media screen and (max-width: 900px) {
  #header .hanip-header-inner,
  .layout-float #header .hanip-header-inner {
    width: calc(100% - 32px) !important;
    min-height: 70px !important;
  }
  #header .mobile-menu { display: block !important; flex: 0 0 auto; }
  .hanip-brand-sub { display: none !important; }
  #gnb,
  .layout-float #gnb {
    display: none !important;
    position: absolute !important;
    top: calc(100% + 8px);
    left: 16px;
    right: 16px;
    z-index: 9600;
    padding: 14px;
    border: 1px solid rgba(91,63,45,.12);
    border-radius: 22px;
    background: rgba(255,250,241,.98);
    box-shadow: var(--hanip-shadow);
  }
  body.hanip-menu-open #gnb { display: block !important; }
  #gnb ul { justify-content: flex-start !important; }
  #gnb ul li a { width: 100%; }
  .sneru-translate-bar {
    top: 70px !important;
    width: calc(100% - 32px) !important;
    overflow-x: auto !important;
    justify-content: flex-start !important;
    border-radius: 18px !important;
  }
  .hanip-hero {
    grid-template-columns: 1fr;
    min-height: 0;
    padding: 34px 26px;
  }
  .hanip-hero h2 { font-size: 42px !important; letter-spacing: -2px !important; }
  .hanip-hero p { font-size: 16px !important; }
  .hanip-track-grid,
  .hanip-after-grid,
  .related-articles ul,
  #aside .inner { grid-template-columns: 1fr !important; }
}

@media screen and (max-width: 767px) {
  .hanip-home,
  .cover-slider,
  .cover-thumbnail-list-1,
  .cover-thumbnail-list-2,
  .cover-special-contents,
  .cover-wide-panel,
  .post-header,
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner,
  .layout-float.post-type-thumbnail #content > .inner,
  .layout-float.post-type-text #content > .inner,
  #aside {
    width: calc(100% - 28px) !important;
  }

  .hanip-category-deck,
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner,
  .layout-float.post-type-thumbnail #content > .inner,
  .layout-float.post-type-text #content > .inner,
  .cover-thumbnail-list-1 ul,
  .cover-thumbnail-list-2 ul {
    grid-template-columns: 1fr !important;
  }

  #header h1 { font-size: 22px !important; }
  #header h1 a::before { width: 30px; height: 30px; }
  .sneru-translate-bar::before { display: none; }

  .hanip-hero {
    border-radius: 24px;
    padding: 30px 22px;
  }
  .hanip-hero h2 {
    margin-top: 18px !important;
    font-size: 36px !important;
    line-height: 1.05 !important;
  }
  .hanip-hero-actions a { width: 100%; justify-content: center; }
  .hanip-cat-card { min-height: 128px; }
  .hanip-track-section { padding: 22px; }
  .hanip-section-head { display: block; }
  .hanip-section-head h3 { margin-top: 6px !important; font-size: 24px !important; }

  .cover-slider,
  .cover-slider ul,
  .cover-slider ul li,
  .cover-slider ul li .text-box { min-height: 300px !important; }
  .cover-slider ul li .text-box { padding: 26px !important; }
  .cover-slider ul li .text-box .title { font-size: 30px !important; letter-spacing: -1.5px !important; }

  .post-item a { min-height: auto !important; }

  .hgroup,
  .entry-content,
  #article-view,
  .hanip-after-reading,
  .related-articles,
  .tags,
  .comments,
  .pagination {
    width: calc(100% - 28px) !important;
  }

  .entry-content,
  #article-view {
    padding: 26px 20px 48px !important;
    border-radius: 22px !important;
    overflow-x: hidden !important;
  }

  .hgroup h1 { font-size: 31px !important; letter-spacing: -1.3px !important; }
  #article-view p,
  .entry-content p { font-size: 16px !important; line-height: 1.82 !important; }

  .entry-content h2,
  .entry-content h2[data-ke-size="size26"],
  .entry-content h2[style],
  #article-view h2,
  #article-view h2[data-ke-size="size26"],
  #article-view h2[style] {
    margin: 42px 0 22px !important;
    font-size: 30px !important;
    line-height: 1.35 !important;
    letter-spacing: -1px !important;
  }

  .entry-content h3,
  .entry-content h3[data-ke-size="size23"],
  .entry-content h3[style],
  #article-view h3,
  #article-view h3[data-ke-size="size23"],
  #article-view h3[style] {
    margin: 30px 0 15px !important;
    padding: 9px 0 9px 16px !important;
    font-size: 21px !important;
  }

  .entry-content table,
  #article-view table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    white-space: nowrap !important;
  }
}


/* =========================================================
   HANIP v2 page-safe correction
   - 글 본문 상세페이지에서는 목록 grid가 .inner에 먹지 않도록 최종 차단
   ========================================================= */
body#tt-body-page #content > .inner,
body#tt-body-notice #content > .inner,
body#tt-body-guestbook #content > .inner {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  overflow: visible !important;
}

body#tt-body-page .hgroup,
body#tt-body-page .entry-content,
body#tt-body-page #article-view,
body#tt-body-page .hanip-after-reading,
body#tt-body-page .related-articles,
body#tt-body-page .tags,
body#tt-body-page .comments,
body#tt-body-page .pagination {
  grid-column: auto !important;
}


/* =========================================================
   HANIP v2.1 correction
   - 좌우 여백 축소: 홈/번역바/목록 폭 1440px로 확장
   - 방문자수/사이드바 위젯 완전 비활성화: 세로 그래프형 깨짐 방지
   - 콘텐츠 하단 이상 공백 방지
   ========================================================= */
:root {
  --hanip-wide: 1440px;
}

#header .hanip-header-inner,
.layout-float #header .hanip-header-inner,
.sneru-translate-bar,
.hanip-home,
.cover-slider,
.cover-thumbnail-list-1,
.cover-thumbnail-list-2,
.cover-special-contents,
.cover-wide-panel,
.post-header,
body#tt-body-index #content > .inner,
body#tt-body-category #content > .inner,
body#tt-body-search #content > .inner,
body#tt-body-archive #content > .inner,
body#tt-body-tag #content > .inner,
.layout-float.post-type-thumbnail #content > .inner,
.layout-float.post-type-text #content > .inner {
  width: min(var(--hanip-wide), calc(100% - 64px)) !important;
  max-width: var(--hanip-wide) !important;
}

.hanip-hero {
  grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr) !important;
}

.hanip-category-deck {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

.hanip-track-section {
  margin-top: 24px !important;
}

#aside,
#aside *,
.count,
.visitor-counter,
.visitor_graph,
.visit_graph,
.visitorGraph,
.blog-counter,
.blog_counter,
.tt-visitor,
.tt-counter,
.tt_count,
[id*="visitor"],
[class*="visitorGraph"],
[class*="visitGraph"] {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

.container,
#content {
  overflow: visible !important;
  min-height: 0 !important;
}

#footer {
  margin-top: 60px !important;
}

@media screen and (max-width: 1180px) {
  #header .hanip-header-inner,
  .layout-float #header .hanip-header-inner,
  .sneru-translate-bar,
  .hanip-home,
  .cover-slider,
  .cover-thumbnail-list-1,
  .cover-thumbnail-list-2,
  .cover-special-contents,
  .cover-wide-panel,
  .post-header,
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner,
  .layout-float.post-type-thumbnail #content > .inner,
  .layout-float.post-type-text #content > .inner {
    width: calc(100% - 40px) !important;
  }

  .hanip-category-deck {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .hanip-hero {
    grid-template-columns: 1fr !important;
  }
}

@media screen and (max-width: 767px) {
  #header .hanip-header-inner,
  .layout-float #header .hanip-header-inner,
  .sneru-translate-bar,
  .hanip-home,
  .cover-slider,
  .cover-thumbnail-list-1,
  .cover-thumbnail-list-2,
  .cover-special-contents,
  .cover-wide-panel,
  .post-header,
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner,
  .layout-float.post-type-thumbnail #content > .inner,
  .layout-float.post-type-text #content > .inner {
    width: calc(100% - 28px) !important;
  }

  .hanip-category-deck {
    grid-template-columns: 1fr !important;
  }
}

/* =========================================================
   HANIP v2.2 correction
   - 카테고리 URL: 실제 티스토리 경로 기준으로 HTML에서 수정 완료
   - 홈 전용 도감 허브가 카테고리/본문에 노출되는 문제 차단
   - 우측 잘림/가로 넘침 방지
   - PC 폭은 넓게 유지하되 안전 여백 확보
   ========================================================= */
:root {
  --hanip-wide: 1400px;
  --hanip-side-gap: 72px;
}

html,
body {
  max-width: 100% !important;
  overflow-x: hidden !important;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

/* 정적 도감 허브는 홈에서만 표시 */
.hanip-home {
  display: none !important;
}
body#tt-body-index .hanip-home {
  display: block !important;
}
body:not(#tt-body-index) .hanip-home,
body#tt-body-page .hanip-home,
body#tt-body-category .hanip-home,
body#tt-body-search .hanip-home,
body#tt-body-tag .hanip-home,
body#tt-body-archive .hanip-home,
body#tt-body-guestbook .hanip-home,
body#tt-body-notice .hanip-home {
  display: none !important;
}

/* 모든 큰 프레임은 화면 오른쪽에 붙지 않도록 안전폭 적용 */
#header .hanip-header-inner,
.layout-float #header .hanip-header-inner,
.sneru-translate-bar,
.hanip-home,
.cover-slider,
.cover-thumbnail-list-1,
.cover-thumbnail-list-2,
.cover-special-contents,
.cover-wide-panel,
.post-header,
body#tt-body-index #content > .inner,
body#tt-body-category #content > .inner,
body#tt-body-search #content > .inner,
body#tt-body-archive #content > .inner,
body#tt-body-tag #content > .inner,
.layout-float.post-type-thumbnail #content > .inner,
.layout-float.post-type-text #content > .inner,
#aside {
  width: min(var(--hanip-wide), calc(100% - var(--hanip-side-gap))) !important;
  max-width: var(--hanip-wide) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 본문 상세 페이지는 넓은 카드 그리드 규칙에서 분리 */
body#tt-body-page #content > .inner,
body#tt-body-notice #content > .inner,
body#tt-body-guestbook #content > .inner {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

body#tt-body-page .hgroup,
body#tt-body-page .entry-content,
body#tt-body-page #article-view,
body#tt-body-page .hanip-after-reading,
body#tt-body-page .related-articles,
body#tt-body-page .tags,
body#tt-body-page .comments,
body#tt-body-page .pagination,
body#tt-body-notice .hgroup,
body#tt-body-notice .entry-content,
body#tt-body-notice #article-view,
body#tt-body-notice .related-articles,
body#tt-body-notice .tags,
body#tt-body-notice .comments,
body#tt-body-guestbook .comments {
  width: min(900px, calc(100% - 72px)) !important;
  max-width: 900px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.hanip-hero,
.hanip-track-section,
.hanip-cat-card,
.hanip-board-card,
.post-item a,
.cover-thumbnail-list-1 ul li a,
.cover-thumbnail-list-2 ul li a,
.related-articles,
.entry-content,
#article-view {
  max-width: 100% !important;
}

.hanip-hero {
  grid-template-columns: minmax(0, 1.02fr) minmax(360px, .98fr) !important;
}

.hanip-hero h2 {
  font-size: clamp(38px, 4.3vw, 66px) !important;
  line-height: 1.02 !important;
  letter-spacing: -2.6px !important;
  word-break: keep-all !important;
}

/* 카테고리 카드가 폭을 밀어내지 않도록 보정 */
.hanip-category-deck {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}
.hanip-cat-card strong,
.hanip-cat-card em,
.hanip-track-card b,
.hanip-track-card p {
  word-break: keep-all !important;
  overflow-wrap: anywhere;
}

/* 상단 광고/반응형 광고가 번역 바 주변에서 화면을 밀어내는 경우 방어 */
.container ins,
.container iframe,
.revenue_unit_wrap,
.revenue_unit_item,
.revenue_unit_wrap * {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

@media screen and (max-width: 1500px) {
  :root { --hanip-wide: 1320px; --hanip-side-gap: 48px; }
  .hanip-hero { grid-template-columns: 1fr !important; }
  .hanip-category-deck { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

@media screen and (max-width: 900px) {
  :root { --hanip-side-gap: 32px; }
  .hanip-track-grid,
  .hanip-after-grid,
  .related-articles ul { grid-template-columns: 1fr !important; }
  body#tt-body-page .hgroup,
  body#tt-body-page .entry-content,
  body#tt-body-page #article-view,
  body#tt-body-page .hanip-after-reading,
  body#tt-body-page .related-articles,
  body#tt-body-page .tags,
  body#tt-body-page .comments,
  body#tt-body-page .pagination {
    width: calc(100% - 32px) !important;
  }
}

@media screen and (max-width: 767px) {
  :root { --hanip-side-gap: 28px; }
  .hanip-category-deck,
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner,
  .cover-thumbnail-list-1 ul,
  .cover-thumbnail-list-2 ul {
    grid-template-columns: 1fr !important;
  }
}


/* =========================================================
   HANIP v2.3 FINAL PATCH
   목적:
   1) 홈/목록/본문의 우측 잘림 방지
   2) 홈·본문 추천 카드 링크 클릭 보장
   3) 카테고리 목록 썸네일을 잘리지 않는 16:9 전체 표시 방식으로 보정
   4) 본문 하단 '다음 한입' 블록을 본문 폭 기준으로 정렬
   5) 기존 티스토리 layout-float 잔여 규칙 무력화
   ========================================================= */
:root {
  --hanip-wide: 1400px;
  --hanip-reading: 900px;
  --hanip-side-gap: 80px;
}

html,
body {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

#wrap,
.container,
#content,
.layout-float #wrap,
.layout-float #content {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  overflow: visible !important;
}

/* 공통 큰 프레임: 우측이 화면 밖으로 밀리지 않도록 안전 폭 적용 */
#header .hanip-header-inner,
.layout-float #header .hanip-header-inner,
.sneru-translate-bar,
.hanip-home,
.cover-slider,
.cover-thumbnail-list-1,
.cover-thumbnail-list-2,
.cover-special-contents,
.cover-wide-panel,
.post-header,
body#tt-body-index #content > .inner,
body#tt-body-category #content > .inner,
body#tt-body-search #content > .inner,
body#tt-body-archive #content > .inner,
body#tt-body-tag #content > .inner,
.layout-float.post-type-thumbnail #content > .inner,
.layout-float.post-type-text #content > .inner {
  width: min(var(--hanip-wide), calc(100% - var(--hanip-side-gap))) !important;
  max-width: var(--hanip-wide) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* 홈 허브는 홈에서만 표시 */
.hanip-home { display: none !important; }
body#tt-body-index .hanip-home { display: block !important; }
body:not(#tt-body-index) .hanip-home { display: none !important; }

/* 정적 카드 링크 클릭 영역 보정 */
.hanip-home a,
.hanip-hero-actions a,
.hanip-cat-card,
.hanip-track-card,
.hanip-after-reading a {
  position: relative !important;
  z-index: 5 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}
.hanip-home::before,
.hanip-home::after,
.hanip-hero::before,
.hanip-hero::after,
.hanip-cat-card::before,
.hanip-cat-card::after,
.hanip-track-section::before,
.hanip-track-section::after,
.hanip-after-reading::before,
.hanip-after-reading::after {
  pointer-events: none !important;
}

/* 홈 히어로: 큰 화면에서도 안정적으로 들어오게 조정 */
.hanip-hero {
  grid-template-columns: minmax(0, 1fr) minmax(340px, .86fr) !important;
  gap: 28px !important;
  max-width: 100% !important;
  overflow: hidden !important;
}
.hanip-hero h2 {
  max-width: 100% !important;
  font-size: clamp(38px, 4.1vw, 64px) !important;
  line-height: 1.04 !important;
  letter-spacing: -2.4px !important;
  word-break: keep-all !important;
  overflow-wrap: break-word !important;
}

/* 목록/카테고리 그리드: 기존 float/5열 잔여 규칙 제거 */
body#tt-body-index #content > .inner,
body#tt-body-category #content > .inner,
body#tt-body-search #content > .inner,
body#tt-body-archive #content > .inner,
body#tt-body-tag #content > .inner,
.layout-float.post-type-thumbnail #content > .inner,
.layout-float.post-type-text #content > .inner {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 30px 22px !important;
  align-items: start !important;
  overflow: visible !important;
}

.post-header {
  display: block !important;
  grid-column: 1 / -1 !important;
  width: min(var(--hanip-wide), calc(100% - var(--hanip-side-gap))) !important;
  max-width: var(--hanip-wide) !important;
  margin: 28px auto 18px !important;
  padding: 0 0 14px !important;
  border-top: 0 !important;
  border-bottom: 1px solid rgba(91,63,45,.32) !important;
  text-align: center !important;
  overflow: visible !important;
}

.post-header h2 {
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--hanip-brown) !important;
  font-size: 28px !important;
  font-weight: 950 !important;
  line-height: 1.25 !important;
  letter-spacing: -1px !important;
}
.post-header h2::after {
  content: "";
  display: block;
  width: 40px;
  height: 4px;
  margin: 10px auto 0;
  border-radius: 999px;
  background: var(--hanip-gold);
}

.post-item,
.layout-float .post-item,
.layout-float.post-type-thumbnail .post-item,
.layout-float.post-type-text .post-item,
.post-type-text .post-item {
  float: none !important;
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}
.post-item:nth-child(n) {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.post-item a,
.layout-float .post-item a,
.cover-thumbnail-list-2 ul li a,
.layout-float .cover-thumbnail-list-2 ul li a {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  padding: 14px 14px 18px !important;
  border: 1px solid rgba(91,63,45,.12) !important;
  border-radius: 24px !important;
  background: rgba(255,250,241,.86) !important;
  color: #2f241d !important;
  text-decoration: none !important;
  box-shadow: 0 12px 28px rgba(91,63,45,.08) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  transform: none !important;
}
.post-item a:hover,
.cover-thumbnail-list-2 ul li a:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 18px 36px rgba(91,63,45,.13) !important;
}

/* 썸네일: 더 이상 확대 크롭하지 않고 전체 이미지가 보이게 처리 */
.post-item .thum,
.layout-float .post-item .thum,
.layout-float.post-type-text .post-item .thum,
.layout-float.post-type-thumbnail .post-item .thum,
.cover-thumbnail-list-1 ul li .thum,
.cover-thumbnail-list-2 ul li .thum,
.layout-float .cover-thumbnail-list-2 ul li .thum,
.related-articles ul li .thum {
  float: none !important;
  display: block !important;
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  padding: 0 !important;
  margin: 0 0 14px !important;
  border-radius: 18px !important;
  background: #120f0c !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
.post-item .thum::before,
.post-item .thum::after,
.cover-thumbnail-list-2 ul li .thum::before,
.cover-thumbnail-list-2 ul li .thum::after,
.related-articles ul li .thum::before,
.related-articles ul li .thum::after {
  display: none !important;
}
.post-item .thum img,
.layout-float .post-item .thum img,
.layout-float.post-type-text .post-item .thum img,
.layout-float.post-type-thumbnail .post-item .thum img,
.cover-thumbnail-list-1 ul li .thum img,
.cover-thumbnail-list-2 ul li .thum img,
.layout-float .cover-thumbnail-list-2 ul li .thum img,
.related-articles ul li .thum img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
}

.post-item .title,
.layout-float .post-item .title,
.cover-thumbnail-list-2 ul li .title {
  display: -webkit-box !important;
  width: 100% !important;
  height: auto !important;
  min-height: 44px !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  color: #2f241d !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  line-height: 1.38 !important;
  letter-spacing: -0.55px !important;
  white-space: normal !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  word-break: keep-all !important;
  overflow-wrap: anywhere !important;
}
.post-item .excerpt,
.layout-float .post-item .excerpt,
.cover-thumbnail-list-2 ul li .excerpt {
  display: -webkit-box !important;
  width: 100% !important;
  height: auto !important;
  min-height: 46px !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  color: rgba(47,36,29,.62) !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  white-space: normal !important;
  overflow: hidden !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  word-break: keep-all !important;
  overflow-wrap: anywhere !important;
}
.post-item .more,
.cover-thumbnail-list-2 ul li .more {
  margin-top: auto !important;
  color: var(--hanip-brown-3) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

/* 본문 상세 페이지: 본문과 다음 한입 블록은 같은 축으로 정렬 */
body#tt-body-page #content > .inner,
body#tt-body-notice #content > .inner,
body#tt-body-guestbook #content > .inner {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  overflow: visible !important;
}
body#tt-body-page .hgroup,
body#tt-body-page .entry-content,
body#tt-body-page #article-view,
body#tt-body-page .hanip-after-reading,
body#tt-body-page .related-articles,
body#tt-body-page .tags,
body#tt-body-page .comments,
body#tt-body-page .pagination {
  width: min(var(--hanip-reading), calc(100% - 80px)) !important;
  max-width: var(--hanip-reading) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}
.hanip-after-reading {
  margin-top: 32px !important;
  margin-bottom: 40px !important;
  padding: 28px !important;
}
.hanip-after-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
.hanip-after-grid a {
  display: block !important;
  min-width: 0 !important;
  padding: 20px !important;
  border-radius: 18px !important;
}

/* 티스토리 버튼/공감 영역이 본문 폭을 밀지 않게 보정 */
.container_postbtn,
.postbtn_ccl,
.postbtn_like,
.postbtn_like * {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

@media screen and (min-width: 1501px) {
  :root { --hanip-wide: 1400px; --hanip-side-gap: 96px; }
}
@media screen and (max-width: 1500px) {
  :root { --hanip-wide: 1280px; --hanip-side-gap: 48px; }
  .hanip-hero { grid-template-columns: 1fr !important; }
  .hanip-category-deck { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner,
  .layout-float.post-type-thumbnail #content > .inner,
  .layout-float.post-type-text #content > .inner {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media screen and (max-width: 900px) {
  :root { --hanip-wide: 100%; --hanip-side-gap: 32px; }
  .hanip-category-deck,
  .hanip-track-grid,
  .hanip-after-grid,
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner {
    grid-template-columns: 1fr !important;
  }
  body#tt-body-page .hgroup,
  body#tt-body-page .entry-content,
  body#tt-body-page #article-view,
  body#tt-body-page .hanip-after-reading,
  body#tt-body-page .related-articles,
  body#tt-body-page .tags,
  body#tt-body-page .comments,
  body#tt-body-page .pagination {
    width: calc(100% - 32px) !important;
  }
}
@media screen and (max-width: 767px) {
  :root { --hanip-side-gap: 28px; }
  #header .hanip-header-inner,
  .sneru-translate-bar,
  .hanip-home,
  .cover-slider,
  .cover-thumbnail-list-1,
  .cover-thumbnail-list-2,
  .cover-special-contents,
  .cover-wide-panel,
  .post-header,
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner {
    width: calc(100% - 28px) !important;
  }
  .hanip-hero { padding: 28px 20px !important; }
  .hanip-hero h2 { font-size: 34px !important; letter-spacing: -1.4px !important; }
  .post-item a { padding: 12px !important; border-radius: 20px !important; }
  .post-item .title { font-size: 15px !important; }
}

/* =========================================================
   HANIP v2.4 REALIGN PATCH
   목적:
   - 기존 script.js 슬라이더 충돌 제거 후 인기글 커버를 정적 그리드로 표시
   - 본문/태그/관련글/다음 한입을 같은 중앙 축으로 정렬
   - 상세 본문 폭 확장
   - 카테고리 목록 썸네일 잘림 최소화
   ========================================================= */
:root {
  --hanip-wide: 1480px;
  --hanip-reading: 1040px;
  --hanip-side-gap: 72px;
  --hanip-cream: #f7efe1;
  --hanip-card: #fffaf1;
  --hanip-line: rgba(91,63,45,.16);
  --hanip-brown: #5b3f2d;
  --hanip-brown-2: #7a583a;
  --hanip-brown-3: #a77a54;
  --hanip-gold: #d9ad50;
}

html,
body,
#wrap,
.container,
#content {
  max-width: 100% !important;
  overflow-x: clip !important;
  box-sizing: border-box !important;
}

body {
  background: radial-gradient(circle at 10% 0%, rgba(255,245,214,.85), transparent 34%), #f7efe1 !important;
}

/* 상단/홈/목록 공통 폭 */
#header .hanip-header-inner,
.sneru-translate-bar,
.hanip-home,
.post-header,
.cover-slider,
.cover-thumbnail-list-1,
.cover-thumbnail-list-2,
.cover-special-contents,
.cover-wide-panel,
body#tt-body-index #content > .inner,
body#tt-body-category #content > .inner,
body#tt-body-search #content > .inner,
body#tt-body-archive #content > .inner,
body#tt-body-tag #content > .inner,
.layout-float.post-type-thumbnail #content > .inner,
.layout-float.post-type-text #content > .inner {
  width: min(var(--hanip-wide), calc(100% - var(--hanip-side-gap))) !important;
  max-width: var(--hanip-wide) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* 홈 히어로는 화면 밖으로 밀지 않음 */
.hanip-home,
.hanip-hero,
.hanip-category-deck,
.hanip-track-section {
  max-width: 100% !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
.hanip-hero {
  grid-template-columns: minmax(0, 1fr) minmax(360px, .82fr) !important;
  gap: 30px !important;
}
.hanip-hero h2 {
  font-size: clamp(42px, 4.2vw, 68px) !important;
  line-height: 1.02 !important;
  letter-spacing: -2.8px !important;
  word-break: keep-all !important;
  overflow-wrap: break-word !important;
}

/* 기존 Whatever script 슬라이더를 정적 인기글 그리드로 전환 */
.cover-slider,
.layout-float .cover-slider {
  position: relative !important;
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 30px 0 18px !important;
  margin-top: 34px !important;
  margin-bottom: 52px !important;
  overflow: visible !important;
  background: transparent !important;
}
.cover-slider .prev,
.cover-slider .next,
.cover-slider .paging {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.hanip-cover-head {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin: 0 0 16px !important;
  padding: 0 0 14px !important;
  border-bottom: 1px solid rgba(91,63,45,.25) !important;
}
.hanip-cover-head span {
  color: var(--hanip-brown-3) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
.hanip-cover-head strong {
  color: var(--hanip-brown) !important;
  font-size: 24px !important;
  font-weight: 950 !important;
  letter-spacing: -.8px !important;
}
.cover-slider ul,
.cover-slider.slide-on ul,
.layout-float .cover-slider ul {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  display: grid !important;
  width: 100% !important;
  height: auto !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 18px !important;
  transform: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
.cover-slider ul li,
.cover-slider.slide-on ul li,
.layout-float .cover-slider ul li {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 16 / 9 !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  background-color: #17110d !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  box-shadow: 0 14px 30px rgba(91,63,45,.10) !important;
  opacity: 1 !important;
  z-index: auto !important;
  transform: none !important;
}
.cover-slider ul li .text-box,
.layout-float .cover-slider ul li .text-box {
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  width: 100% !important;
  height: 100% !important;
  padding: 14px !important;
  box-sizing: border-box !important;
  background: linear-gradient(to top, rgba(0,0,0,.70), rgba(0,0,0,.12) 52%, rgba(0,0,0,0)) !important;
  text-align: left !important;
  text-decoration: none !important;
  color: #fff !important;
  cursor: pointer !important;
}
.cover-slider ul li .text-box .title,
.layout-float .cover-slider ul li .text-box .title {
  display: -webkit-box !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.55) !important;
  font-size: 15px !important;
  line-height: 1.34 !important;
  font-weight: 900 !important;
  letter-spacing: -.35px !important;
  overflow: hidden !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}
.cover-slider ul li .text-box .title em {
  display: inline-block !important;
  margin: 0 0 6px !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.88) !important;
  color: var(--hanip-brown) !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-style: normal !important;
  text-shadow: none !important;
}
.cover-slider ul li .text-box .btn,
.layout-float .cover-slider ul li .text-box .btn {
  display: none !important;
}

/* 목록 썸네일: Tistory 기존 크롭/절대배치 잔여값 제거 */
body#tt-body-index #content > .inner,
body#tt-body-category #content > .inner,
body#tt-body-search #content > .inner,
body#tt-body-archive #content > .inner,
body#tt-body-tag #content > .inner,
.layout-float.post-type-thumbnail #content > .inner,
.layout-float.post-type-text #content > .inner {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 32px 22px !important;
  align-items: start !important;
  overflow: visible !important;
}
.post-item,
.layout-float .post-item,
.layout-float.post-type-thumbnail .post-item,
.layout-float.post-type-text .post-item,
.post-type-text .post-item {
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  overflow: visible !important;
}
.post-item a,
.layout-float .post-item a,
.cover-thumbnail-list-2 ul li a,
.layout-float .cover-thumbnail-list-2 ul li a {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 14px 14px 18px !important;
  border: 1px solid rgba(91,63,45,.14) !important;
  border-radius: 24px !important;
  background: rgba(255,250,241,.90) !important;
  box-shadow: 0 12px 26px rgba(91,63,45,.08) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
}
.post-item .thum,
.layout-float .post-item .thum,
.layout-float.post-type-text .post-item .thum,
.cover-thumbnail-list-1 ul li .thum,
.cover-thumbnail-list-2 ul li .thum,
.related-articles ul li .thum {
  float: none !important;
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border-radius: 18px !important;
  background: #18120e !important;
  overflow: hidden !important;
}
.post-item .thum:before,
.post-item .thum:after,
.cover-thumbnail-list-1 ul li .thum:before,
.cover-thumbnail-list-1 ul li .thum:after,
.cover-thumbnail-list-2 ul li .thum:before,
.cover-thumbnail-list-2 ul li .thum:after,
.related-articles ul li .thum:before,
.related-articles ul li .thum:after {
  display: none !important;
}
.post-item .thum img,
.layout-float .post-item .thum img,
.layout-float.post-type-text .post-item .thum img,
.cover-thumbnail-list-1 ul li .thum img,
.cover-thumbnail-list-2 ul li .thum img,
.related-articles ul li .thum img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
}

/* 상세 페이지: 제목/본문/태그/관련글을 한 축으로 통일 */
body#tt-body-page #content > .inner,
body#tt-body-notice #content > .inner,
body#tt-body-guestbook #content > .inner,
#content > .inner:has(#article-view) {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
.hgroup,
body#tt-body-page .hgroup,
body#tt-body-notice .hgroup {
  width: min(var(--hanip-reading), calc(100% - var(--hanip-side-gap))) !important;
  max-width: var(--hanip-reading) !important;
  margin: 54px auto 26px !important;
  padding: 44px 0 26px !important;
  border-bottom: 1px solid rgba(91,63,45,.20) !important;
  box-sizing: border-box !important;
  text-align: left !important;
  overflow: visible !important;
}
.hgroup .category {
  display: inline-block !important;
  margin: 0 0 16px !important;
  padding: 7px 12px !important;
  border-radius: 999px !important;
  background: rgba(217,173,80,.28) !important;
  color: var(--hanip-brown-2) !important;
  font-size: 13px !important;
  font-weight: 900 !important;
}
.hgroup h1 {
  max-width: 100% !important;
  margin: 0 !important;
  color: var(--hanip-brown) !important;
  font-size: clamp(34px, 3.0vw, 50px) !important;
  line-height: 1.18 !important;
  font-weight: 950 !important;
  letter-spacing: -1.6px !important;
  word-break: keep-all !important;
  overflow-wrap: break-word !important;
}
.hgroup .post-meta {
  margin-top: 18px !important;
}
.entry-content,
#article-view,
body#tt-body-page .entry-content,
body#tt-body-page #article-view {
  width: min(var(--hanip-reading), calc(100% - var(--hanip-side-gap))) !important;
  max-width: var(--hanip-reading) !important;
  margin: 0 auto 34px !important;
  padding: 54px 58px !important;
  border: 1px solid rgba(91,63,45,.10) !important;
  border-radius: 30px !important;
  background: rgba(255,250,241,.88) !important;
  box-shadow: 0 18px 44px rgba(91,63,45,.08) !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}
.entry-content p {
  font-size: 17px !important;
  line-height: 1.88 !important;
  color: #2f241d !important;
}
.entry-content img,
#article-view img,
.entry-content iframe,
#article-view iframe {
  max-width: 100% !important;
  height: auto !important;
  box-sizing: border-box !important;
}

/* 티스토리 공감/공유/태그/댓글/관련글도 같은 폭 중앙 정렬 */
.container_postbtn,
.postbtn_ccl,
.hanip-after-reading,
.related-articles,
.comments,
.pagination,
#content > .tags,
body#tt-body-page .tags,
body#tt-body-page .related-articles,
body#tt-body-page .comments,
body#tt-body-page .pagination {
  width: min(var(--hanip-reading), calc(100% - var(--hanip-side-gap))) !important;
  max-width: var(--hanip-reading) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
  clear: both !important;
}
.container_postbtn {
  margin-top: 26px !important;
  margin-bottom: 26px !important;
}
.hanip-after-reading,
#content > .tags,
body#tt-body-page .tags,
.related-articles {
  padding: 28px !important;
  border: 1px solid rgba(91,63,45,.12) !important;
  border-radius: 26px !important;
  background: rgba(255,250,241,.88) !important;
  box-shadow: 0 12px 30px rgba(91,63,45,.06) !important;
}
.hanip-after-reading {
  margin-top: 28px !important;
  margin-bottom: 30px !important;
}
.hanip-after-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
.hanip-after-grid a {
  display: block !important;
  min-width: 0 !important;
  padding: 20px !important;
  border-radius: 18px !important;
  background: #fff !important;
  text-decoration: none !important;
}
#content > .tags,
body#tt-body-page .tags {
  margin-top: 28px !important;
  margin-bottom: 30px !important;
}
.tags .items,
#content .tags .items {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: center !important;
}
.tags .items a,
#content .tags .items a {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 34px !important;
  padding: 7px 13px !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: var(--hanip-brown-2) !important;
  box-shadow: 0 8px 18px rgba(91,63,45,.06) !important;
  text-decoration: none !important;
  font-weight: 800 !important;
}

/* Tistory 자동 '같은 카테고리 다른 글' 테이블 보정 */
.entry-content .another_category,
#article-view .another_category,
.another_category,
.another-category {
  width: 100% !important;
  max-width: 100% !important;
  margin: 44px 0 12px !important;
  padding: 24px !important;
  border: 1px solid rgba(91,63,45,.14) !important;
  border-radius: 22px !important;
  background: rgba(255,252,245,.92) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}
.entry-content .another_category h4,
#article-view .another_category h4,
.another_category h4,
.another-category h4 {
  margin: 0 0 14px !important;
  color: var(--hanip-brown) !important;
  font-size: 20px !important;
  font-weight: 950 !important;
  letter-spacing: -.6px !important;
}
.entry-content .another_category table,
#article-view .another_category table,
.another_category table,
.another-category table {
  width: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  table-layout: fixed !important;
}
.entry-content .another_category td,
#article-view .another_category td,
.another_category td,
.another-category td {
  padding: 6px 0 !important;
  border: 0 !important;
  color: rgba(47,36,29,.65) !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  vertical-align: top !important;
}
.entry-content .another_category a,
#article-view .another_category a,
.another_category a,
.another-category a {
  color: var(--hanip-brown-2) !important;
  text-decoration: none !important;
  font-weight: 800 !important;
}

/* 관련글 카드: 하단 캡션 겹침 제거 */
.related-articles ul {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
  margin: 18px 0 0 !important;
  padding: 0 !important;
}
.related-articles ul li {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.related-articles ul li a {
  display: block !important;
  padding: 12px !important;
  border-radius: 20px !important;
  background: #fff !important;
  color: #2f241d !important;
  text-decoration: none !important;
  overflow: hidden !important;
}
.related-articles ul li .title {
  position: static !important;
  display: -webkit-box !important;
  width: 100% !important;
  height: auto !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: #2f241d !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1.42 !important;
  overflow: hidden !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

/* 플로팅/관리 버튼은 화면을 밀지 않게 */
#tistoryEtcLayer,
#tt-body-page .tt_article_useless_p_margin,
.container ins,
.container iframe,
.revenue_unit_wrap,
.revenue_unit_item,
.revenue_unit_wrap * {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

@media screen and (max-width: 1500px) {
  :root { --hanip-wide: 1320px; --hanip-reading: 1000px; --hanip-side-gap: 48px; }
  .hanip-hero { grid-template-columns: 1fr !important; }
  .hanip-category-deck { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .cover-slider ul,
  .cover-slider.slide-on ul { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}
@media screen and (max-width: 1100px) {
  :root { --hanip-reading: 900px; --hanip-side-gap: 36px; }
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner,
  .layout-float.post-type-thumbnail #content > .inner,
  .layout-float.post-type-text #content > .inner,
  .cover-slider ul,
  .cover-slider.slide-on ul,
  .related-articles ul {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .entry-content,
  #article-view,
  body#tt-body-page .entry-content,
  body#tt-body-page #article-view {
    padding: 40px 34px !important;
  }
}
@media screen and (max-width: 760px) {
  :root { --hanip-wide: 100%; --hanip-reading: 100%; --hanip-side-gap: 28px; }
  #header .hanip-header-inner,
  .sneru-translate-bar,
  .hanip-home,
  .post-header,
  .cover-slider,
  .cover-thumbnail-list-1,
  .cover-thumbnail-list-2,
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner,
  .hgroup,
  .entry-content,
  #article-view,
  .container_postbtn,
  .hanip-after-reading,
  .related-articles,
  #content > .tags,
  body#tt-body-page .tags,
  .comments,
  .pagination {
    width: calc(100% - var(--hanip-side-gap)) !important;
  }
  .cover-slider ul,
  .cover-slider.slide-on ul,
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner,
  .hanip-after-grid,
  .related-articles ul {
    grid-template-columns: 1fr !important;
  }
  .entry-content,
  #article-view,
  body#tt-body-page .entry-content,
  body#tt-body-page #article-view {
    padding: 30px 20px !important;
    border-radius: 22px !important;
  }
  .hgroup h1 { font-size: 31px !important; letter-spacing: -1px !important; }
  .hanip-hero { padding: 28px 20px !important; }
  .hanip-hero h2 { font-size: 34px !important; letter-spacing: -1.2px !important; }
}


/* =========================================================
   HANIP v2.5 FINAL WIDE CENTER PATCH
   요청 반영:
   - 본문/태그/다음 한입/관련글 전체 중앙축 통일
   - 본문 폭 확장
   - 홈 커버 섹션 제목: 많이 본 한입 / 새로운 한입 / 음식비교 형태로 정리
   - 커버 썸네일 리스트2를 넓은 5열 카드형으로 고정
   ========================================================= */
:root {
  --hanip-wide: 1640px;
  --hanip-reading: 1220px;
  --hanip-side-gap: 64px;
  --hanip-cream: #f7efe1;
  --hanip-card: #fffaf1;
  --hanip-line: rgba(91,63,45,.16);
  --hanip-brown: #5b3f2d;
  --hanip-brown-2: #7a583a;
  --hanip-brown-3: #a77a54;
  --hanip-gold: #d9ad50;
}

html,
body {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

body {
  background: radial-gradient(circle at 10% 0%, rgba(255,244,209,.88), transparent 32%), #f7efe1 !important;
}

#wrap,
.container,
#content {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

#header .hanip-header-inner,
.sneru-translate-bar,
.hanip-home,
.post-header,
.cover-thumbnail-list-1,
.cover-thumbnail-list-2,
.cover-special-contents,
.cover-wide-panel,
body#tt-body-index #content > .inner,
body#tt-body-category #content > .inner,
body#tt-body-search #content > .inner,
body#tt-body-archive #content > .inner,
body#tt-body-tag #content > .inner,
.layout-float.post-type-thumbnail #content > .inner,
.layout-float.post-type-text #content > .inner {
  width: min(var(--hanip-wide), calc(100% - var(--hanip-side-gap))) !important;
  max-width: var(--hanip-wide) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* 상세 페이지는 내부 요소를 모두 같은 중앙 폭으로 정렬 */
body#tt-body-page #content > .inner,
body#tt-body-notice #content > .inner,
body#tt-body-page.layout-float #content > .inner,
body#tt-body-notice.layout-float #content > .inner,
#content > .inner:has(#article-view) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

.hgroup,
body#tt-body-page .hgroup,
body#tt-body-notice .hgroup,
body[id*="tt-body-page"] .hgroup,
body[id*="tt-body-notice"] .hgroup {
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  width: min(var(--hanip-reading), calc(100% - var(--hanip-side-gap))) !important;
  max-width: var(--hanip-reading) !important;
  margin: 58px auto 30px !important;
  padding: 48px 0 30px !important;
  border-top: 0 !important;
  border-bottom: 1px solid rgba(91,63,45,.22) !important;
  text-align: left !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.hgroup h1,
body#tt-body-page .hgroup h1,
body[id*="tt-body-page"] .hgroup h1 {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  color: var(--hanip-brown) !important;
  font-size: clamp(38px, 3.05vw, 58px) !important;
  line-height: 1.16 !important;
  font-weight: 950 !important;
  letter-spacing: -1.8px !important;
  word-break: keep-all !important;
  overflow-wrap: break-word !important;
}

.entry-content,
#article-view,
body#tt-body-page .entry-content,
body#tt-body-page #article-view,
body[id*="tt-body-page"] .entry-content,
body[id*="tt-body-page"] #article-view {
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  width: min(var(--hanip-reading), calc(100% - var(--hanip-side-gap))) !important;
  max-width: var(--hanip-reading) !important;
  margin: 0 auto 38px !important;
  padding: clamp(34px, 3.4vw, 64px) clamp(34px, 4.0vw, 72px) !important;
  border: 1px solid rgba(91,63,45,.11) !important;
  border-radius: 30px !important;
  background: rgba(255,250,241,.90) !important;
  box-shadow: 0 18px 44px rgba(91,63,45,.08) !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.entry-content > *,
#article-view > * {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.entry-content p,
#article-view p {
  font-size: 18px !important;
  line-height: 1.9 !important;
  color: #2f241d !important;
}

.entry-content img,
#article-view img,
.entry-content iframe,
#article-view iframe {
  max-width: 100% !important;
  height: auto !important;
  box-sizing: border-box !important;
}

/* 공감/태그/다음 한입/관련글/댓글/페이지네이션 모두 본문 폭 중앙 정렬 */
.container_postbtn,
.postbtn_ccl,
.hanip-after-reading,
.related-articles,
.comments,
.pagination,
#content .tags,
body#tt-body-page .tags,
body[id*="tt-body-page"] .tags,
body#tt-body-page .related-articles,
body[id*="tt-body-page"] .related-articles,
body#tt-body-page .comments,
body[id*="tt-body-page"] .comments,
body#tt-body-page .pagination,
body[id*="tt-body-page"] .pagination {
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  width: min(var(--hanip-reading), calc(100% - var(--hanip-side-gap))) !important;
  max-width: var(--hanip-reading) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
  clear: both !important;
}

.hanip-after-reading,
#content .tags,
body#tt-body-page .tags,
body[id*="tt-body-page"] .tags,
.related-articles {
  padding: 30px !important;
  border: 1px solid rgba(91,63,45,.13) !important;
  border-radius: 28px !important;
  background: rgba(255,250,241,.90) !important;
  box-shadow: 0 14px 34px rgba(91,63,45,.07) !important;
}

.container_postbtn { margin-top: 30px !important; margin-bottom: 30px !important; }
.hanip-after-reading { margin-top: 32px !important; margin-bottom: 32px !important; }
#content .tags, body#tt-body-page .tags, body[id*="tt-body-page"] .tags { margin-top: 32px !important; margin-bottom: 32px !important; }
.related-articles { margin-top: 32px !important; margin-bottom: 52px !important; }

.hanip-after-title {
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  margin: 0 0 18px !important;
}
.hanip-after-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

/* 홈 커버 섹션 제목: 첨부 2 형태 */
.cover-thumbnail-list-2,
.hanip-cover-grid {
  padding: 0 !important;
  margin-top: 52px !important;
  margin-bottom: 62px !important;
  background: transparent !important;
  overflow: visible !important;
}

.cover-thumbnail-list-2 h2,
.hanip-cover-grid h2 {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 28px !important;
  padding: 26px 0 24px !important;
  border: 0 !important;
  border-top: 1px solid rgba(91,63,45,.26) !important;
  border-bottom: 1px solid rgba(91,63,45,.26) !important;
  background: transparent !important;
  color: var(--hanip-brown) !important;
  text-align: right !important;
  font-size: clamp(24px, 2.0vw, 34px) !important;
  line-height: 1.1 !important;
  font-weight: 950 !important;
  letter-spacing: -1px !important;
}

.cover-thumbnail-list-2 h2::before,
.hanip-cover-grid h2::before {
  content: attr(data-hanip-subtitle) !important;
  display: block !important;
  min-width: max-content !important;
  color: var(--hanip-brown-3) !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

.cover-thumbnail-list-2 h2::after,
.hanip-cover-grid h2::after {
  content: none !important;
}

/* 홈 커버 카드: 첨부 3 형태 */
.cover-thumbnail-list-2 ul,
.hanip-cover-grid ul,
.cover-slider ul,
.cover-slider.slide-on ul {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 20px !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  overflow: visible !important;
}

.cover-thumbnail-list-2 ul li,
.hanip-cover-grid ul li,
.cover-slider ul li,
.cover-slider.slide-on ul li {
  float: none !important;
  position: relative !important;
  top: auto !important;
  left: auto !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  opacity: 1 !important;
  z-index: auto !important;
  transform: none !important;
  background: transparent !important;
  list-style: none !important;
}

.cover-thumbnail-list-2 ul li a,
.hanip-cover-grid ul li a,
.cover-slider ul li a,
.cover-slider ul li .text-box,
.cover-slider.slide-on ul li a {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 14px 14px 18px !important;
  border: 1px solid rgba(91,63,45,.14) !important;
  border-radius: 24px !important;
  background: rgba(255,250,241,.92) !important;
  box-shadow: 0 12px 26px rgba(91,63,45,.08) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  text-align: left !important;
  text-decoration: none !important;
  color: #2f241d !important;
}

.cover-thumbnail-list-2 ul li .thum,
.hanip-cover-grid ul li .thum,
.cover-slider ul li .thum {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border-radius: 18px !important;
  background: #18120e !important;
  overflow: hidden !important;
}

.cover-thumbnail-list-2 ul li .thum::before,
.cover-thumbnail-list-2 ul li .thum::after,
.hanip-cover-grid ul li .thum::before,
.hanip-cover-grid ul li .thum::after,
.cover-slider ul li .thum::before,
.cover-slider ul li .thum::after {
  display: none !important;
  content: none !important;
}

.cover-thumbnail-list-2 ul li .thum img,
.hanip-cover-grid ul li .thum img,
.cover-slider ul li .thum img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
  transform: none !important;
}

.cover-thumbnail-list-2 ul li .title,
.hanip-cover-grid ul li .title,
.cover-slider ul li .title {
  display: -webkit-box !important;
  width: 100% !important;
  min-height: 2.8em !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  color: #2f241d !important;
  text-shadow: none !important;
  font-size: 16px !important;
  line-height: 1.42 !important;
  font-weight: 950 !important;
  letter-spacing: -.35px !important;
  overflow: hidden !important;
  white-space: normal !important;
  text-overflow: clip !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

.cover-thumbnail-list-2 ul li .title em,
.hanip-cover-grid ul li .title em,
.cover-slider ul li .title em {
  display: none !important;
}

.cover-thumbnail-list-2 ul li .excerpt,
.hanip-cover-grid ul li .excerpt {
  display: -webkit-box !important;
  width: 100% !important;
  height: auto !important;
  min-height: 4.7em !important;
  margin: 0 0 12px !important;
  color: rgba(47,36,29,.66) !important;
  font-size: 14px !important;
  line-height: 1.58 !important;
  overflow: hidden !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
}

.cover-thumbnail-list-2 ul li .more,
.hanip-cover-grid ul li .more,
.cover-slider ul li .more {
  display: inline-flex !important;
  width: fit-content !important;
  margin-top: auto !important;
  color: var(--hanip-brown-3) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

.cover-slider,
.cover-slider.hanip-popular-cover,
.hanip-popular-list {
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
.cover-slider .prev,
.cover-slider .next,
.cover-slider .paging { display: none !important; }

/* 관련글도 본문 폭 안에서 자연스러운 카드 */
.related-articles ul {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
  margin: 20px 0 0 !important;
  padding: 0 !important;
}
.related-articles ul li { width: auto !important; margin: 0 !important; padding: 0 !important; list-style: none !important; }
.related-articles ul li a { display: block !important; padding: 14px !important; border-radius: 20px !important; background: #fff !important; overflow: hidden !important; }
.related-articles ul li .title { position: static !important; background: transparent !important; color: #2f241d !important; padding: 0 !important; margin-top: 10px !important; }

@media screen and (max-width: 1500px) {
  :root { --hanip-wide: 1360px; --hanip-reading: 1120px; --hanip-side-gap: 48px; }
  .cover-thumbnail-list-2 ul,
  .hanip-cover-grid ul,
  .cover-slider ul,
  .cover-slider.slide-on ul { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}

@media screen and (max-width: 1024px) {
  :root { --hanip-wide: 100%; --hanip-reading: 100%; --hanip-side-gap: 36px; }
  .cover-thumbnail-list-2 ul,
  .hanip-cover-grid ul,
  .cover-slider ul,
  .cover-slider.slide-on ul,
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .hanip-after-grid,
  .related-articles ul { grid-template-columns: 1fr !important; }
}

@media screen and (max-width: 640px) {
  :root { --hanip-side-gap: 24px; }
  .hgroup,
  .entry-content,
  #article-view,
  .hanip-after-reading,
  .related-articles,
  #content .tags,
  .container_postbtn,
  .comments,
  .pagination { width: calc(100% - var(--hanip-side-gap)) !important; }
  .entry-content,
  #article-view { padding: 28px 20px !important; border-radius: 24px !important; }
  .hgroup h1 { font-size: 31px !important; letter-spacing: -1px !important; }
  .cover-thumbnail-list-2 h2,
  .hanip-cover-grid h2 { font-size: 24px !important; padding: 20px 0 18px !important; }
  .cover-thumbnail-list-2 h2::before,
  .hanip-cover-grid h2::before { font-size: 11px !important; }
  .cover-thumbnail-list-2 ul,
  .hanip-cover-grid ul,
  .cover-slider ul,
  .cover-slider.slide-on ul { grid-template-columns: 1fr !important; }
}


/* =========================================================
   상식한입 v2.6 통합 보정
   - 본문/태그/관련글 중앙 정렬
   - 본문 폭 확대
   - 번역 바 항상 헤더와 함께 이동
   - 공감/공유/통계/관리 버튼 레이어 깨짐 보정
   - 커버 섹션 제목: ENGLISH _ 한글 형식
   - 커버/목록 좌우 여백 확보
   ========================================================= */
:root {
  --hanip-shell-v26: min(1560px, calc(100vw - 96px));
  --hanip-shell-v26-compact: min(1560px, calc(100vw - 64px));
  --hanip-article-v26: min(1180px, calc(100vw - 96px));
  --hanip-header-v26: 76px;
  --hanip-radius-v26: 30px;
}

html, body {
  max-width: 100% !important;
  overflow-x: hidden !important;
}

#wrap,
.container,
#content {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

/* 상단 헤더 + 번역 바 동시 고정 */
#header.hanip-header,
.layout-float #header.hanip-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 9500 !important;
  width: 100% !important;
  min-height: var(--hanip-header-v26) !important;
  overflow: visible !important;
}

#header .hanip-header-inner,
.layout-float #header .hanip-header-inner {
  width: var(--hanip-shell-v26) !important;
  max-width: 1560px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

.sneru-translate-bar,
.layout-float .sneru-translate-bar {
  position: sticky !important;
  top: var(--hanip-header-v26) !important;
  z-index: 9400 !important;
  width: var(--hanip-shell-v26) !important;
  max-width: 1560px !important;
  min-height: 48px !important;
  margin: 0 auto 38px !important;
  padding: 9px 22px !important;
  border: 1px solid rgba(91, 63, 45, .10) !important;
  border-radius: 999px !important;
  background: rgba(255, 250, 241, .94) !important;
  box-shadow: 0 14px 30px rgba(91, 63, 45, .08) !important;
  backdrop-filter: blur(16px) saturate(1.15) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.15) !important;
  overflow: visible !important;
}

/* 홈/목록/커버 공통 폭: 좌우 여백 확보 */
.hanip-home,
.cover-slider,
.cover-slider.hanip-popular-cover,
.cover-thumbnail-list-1,
.cover-thumbnail-list-2,
.hanip-cover-grid,
.cover-special-contents,
.cover-wide-panel,
.post-header,
body#tt-body-index #content > .inner,
body#tt-body-category #content > .inner,
body#tt-body-search #content > .inner,
body#tt-body-archive #content > .inner,
body#tt-body-tag #content > .inner,
.layout-float .hanip-home,
.layout-float .cover-slider,
.layout-float .cover-thumbnail-list-1,
.layout-float .cover-thumbnail-list-2,
.layout-float .hanip-cover-grid,
.layout-float .post-header,
.layout-float #content > .inner:has(> .post-item) {
  width: var(--hanip-shell-v26) !important;
  max-width: 1560px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

body#tt-body-index #content > .inner,
body#tt-body-category #content > .inner,
body#tt-body-search #content > .inner,
body#tt-body-archive #content > .inner,
body#tt-body-tag #content > .inner,
.layout-float #content > .inner:has(> .post-item) {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 34px 22px !important;
  align-items: start !important;
}

/* 커버 제목: ENGLISH _ 한글 */
.cover-thumbnail-list-1,
.cover-thumbnail-list-2,
.hanip-cover-grid {
  margin-top: 64px !important;
  margin-bottom: 76px !important;
}

.cover-thumbnail-list-1 h2,
.cover-thumbnail-list-2 h2,
.hanip-cover-grid h2,
.post-header h2 {
  float: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 66px !important;
  margin: 0 auto 24px !important;
  padding: 0 34px !important;
  border-top: 1px solid rgba(91, 63, 45, .50) !important;
  border-bottom: 1px solid rgba(91, 63, 45, .50) !important;
  background: rgba(255, 246, 225, .44) !important;
  color: #5b3f2d !important;
  text-align: left !important;
  font-size: clamp(24px, 2vw, 34px) !important;
  line-height: 1.2 !important;
  font-weight: 950 !important;
  letter-spacing: -1.1px !important;
  box-sizing: border-box !important;
}

.cover-thumbnail-list-1 h2::before,
.cover-thumbnail-list-2 h2::before,
.hanip-cover-grid h2::before {
  content: attr(data-hanip-subtitle) " _ " !important;
  flex: 0 0 auto !important;
  margin-right: 8px !important;
  color: #b77b51 !important;
  font-size: clamp(12px, .85vw, 15px) !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

.cover-thumbnail-list-1 h2:after,
.cover-thumbnail-list-2 h2:after,
.hanip-cover-grid h2:after,
.post-header h2:after {
  display: none !important;
}

.cover-thumbnail-list-1 ul,
.cover-thumbnail-list-2 ul,
.hanip-cover-grid ul,
.cover-slider ul,
.cover-slider.slide-on ul {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 34px 22px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  align-items: start !important;
}

.cover-thumbnail-list-1 ul li,
.cover-thumbnail-list-2 ul li,
.hanip-cover-grid ul li,
.cover-slider ul li,
.post-item,
.layout-float .post-item {
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

/* 본문 상세: 모든 하단 요소를 같은 중앙축으로 */
body#tt-body-page #content > .inner,
body#tt-body-article #content > .inner,
#content > .inner:has(> .entry-content),
.layout-float #content > .inner:has(> .entry-content) {
  display: block !important;
  width: var(--hanip-article-v26) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

.hgroup,
.entry-content,
#article-view,
.hanip-same-category,
.related-articles,
.hanip-article-tags,
#content .tags,
.hanip-after-reading,
.comments,
.pagination,
.container_postbtn,
.postbtn_area,
.post-btn,
.layout-float .hgroup,
.layout-float .entry-content,
.layout-float #article-view,
.layout-float .related-articles,
.layout-float #content .tags,
.layout-float .hanip-after-reading,
.layout-float .comments,
.layout-float .pagination,
.layout-float .container_postbtn {
  width: var(--hanip-article-v26) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.hgroup,
.layout-float .hgroup {
  margin-top: 52px !important;
  margin-bottom: 34px !important;
  padding: 52px 0 34px !important;
  border-bottom: 1px solid rgba(91, 63, 45, .18) !important;
  text-align: left !important;
}

.hgroup h1,
.layout-float .hgroup h1 {
  max-width: 100% !important;
  margin: 0 !important;
  color: #5b3f2d !important;
  font-size: clamp(38px, 4.2vw, 62px) !important;
  line-height: 1.12 !important;
  font-weight: 950 !important;
  letter-spacing: -2.8px !important;
  word-break: keep-all !important;
  overflow-wrap: break-word !important;
}

.entry-content,
#article-view,
.layout-float .entry-content,
.layout-float #article-view {
  margin-bottom: 42px !important;
  padding: 54px 54px !important;
  border: 1px solid rgba(91, 63, 45, .10) !important;
  border-radius: var(--hanip-radius-v26) !important;
  background: rgba(255, 252, 245, .82) !important;
  box-shadow: 0 22px 60px rgba(91, 63, 45, .08) !important;
  color: #2f241d !important;
}

.entry-content p,
#article-view p,
.entry-content li,
#article-view li,
.entry-content div,
#article-view div {
  max-width: 100% !important;
  word-break: keep-all !important;
  overflow-wrap: break-word !important;
  line-height: 1.82 !important;
}

.entry-content img,
#article-view img,
.entry-content iframe,
#article-view iframe {
  max-width: 100% !important;
}

/* 기존 플러그인형 다른글 리스트는 숨기고, 스킨형 카드 관련글만 사용 */
.another_category,
.entry-content .another_category,
#article-view .another_category,
div[class*="another_category"] {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.related-articles,
.hanip-same-category {
  margin-top: 46px !important;
  margin-bottom: 36px !important;
  padding: 34px 34px 38px !important;
  border: 1px solid rgba(91, 63, 45, .12) !important;
  border-radius: var(--hanip-radius-v26) !important;
  background: rgba(255, 252, 245, .80) !important;
  box-shadow: 0 18px 46px rgba(91, 63, 45, .06) !important;
  overflow: visible !important;
}

.related-articles h2,
.hanip-same-category h2 {
  display: flex !important;
  align-items: baseline !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 0 0 24px !important;
  padding: 0 0 16px !important;
  border-top: 0 !important;
  border-bottom: 1px solid rgba(91, 63, 45, .22) !important;
  color: #5b3f2d !important;
  text-align: left !important;
  font-size: clamp(22px, 1.7vw, 30px) !important;
  line-height: 1.25 !important;
  font-weight: 950 !important;
  letter-spacing: -1px !important;
}

.related-articles h2::before,
.hanip-same-category h2::before {
  content: attr(data-hanip-subtitle) " _ " !important;
  color: #b77b51 !important;
  font-size: 12px !important;
  letter-spacing: .09em !important;
  white-space: nowrap !important;
}

.related-articles h2 strong,
.hanip-same-category h2 strong {
  color: #5b3f2d !important;
  font-weight: 950 !important;
}

.related-articles ul,
.hanip-same-category ul {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 22px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

.related-articles ul li,
.hanip-same-category ul li {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  overflow: visible !important;
}

.related-articles ul li a,
.hanip-same-category ul li a {
  display: block !important;
  height: 100% !important;
  padding: 14px !important;
  border: 1px solid rgba(91, 63, 45, .08) !important;
  border-radius: 22px !important;
  background: #fff !important;
  color: #2f241d !important;
  text-decoration: none !important;
  overflow: hidden !important;
  box-shadow: 0 14px 30px rgba(91,63,45,.06) !important;
}

.related-articles ul li .thum,
.hanip-same-category ul li .thum {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 0 12px !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  background: #efe6d8 !important;
}

.related-articles ul li .thum img,
.hanip-same-category ul li .thum img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
}

.related-articles ul li .title,
.hanip-same-category ul li .title {
  position: static !important;
  display: -webkit-box !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: #2f241d !important;
  font-size: 15px !important;
  line-height: 1.46 !important;
  font-weight: 900 !important;
  letter-spacing: -.35px !important;
  white-space: normal !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

.hanip-article-tags,
#content .tags,
.layout-float #content .tags {
  margin-top: 0 !important;
  margin-bottom: 36px !important;
  padding: 32px 34px !important;
  border: 1px solid rgba(91, 63, 45, .10) !important;
  border-radius: var(--hanip-radius-v26) !important;
  background: rgba(255, 252, 245, .76) !important;
  text-align: center !important;
  box-shadow: 0 16px 42px rgba(91,63,45,.055) !important;
}

.hanip-article-tags h2,
#content .tags h2 {
  margin: 0 0 22px !important;
  color: #5b3f2d !important;
  text-align: center !important;
  font-size: 25px !important;
  font-weight: 950 !important;
  letter-spacing: -.8px !important;
}

.hanip-article-tags h2::before,
#content .tags h2::before {
  content: attr(data-hanip-subtitle) " _ " !important;
  display: inline !important;
  margin-right: 6px !important;
  color: #b77b51 !important;
  font-size: 12px !important;
  letter-spacing: .09em !important;
  vertical-align: middle !important;
}

.hanip-article-tags .items,
#content .tags .items {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 12px 14px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.hanip-article-tags .items a,
#content .tags .items a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 38px !important;
  padding: 0 17px !important;
  border-radius: 999px !important;
  background: #fff !important;
  box-shadow: 0 8px 18px rgba(91,63,45,.07) !important;
  color: #7a583a !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

.hanip-after-reading,
.layout-float .hanip-after-reading {
  margin-top: 0 !important;
  margin-bottom: 54px !important;
  padding: 34px !important;
  text-align: left !important;
  border: 1px solid rgba(91, 63, 45, .10) !important;
  border-radius: var(--hanip-radius-v26) !important;
  background: rgba(255, 252, 245, .76) !important;
  box-shadow: 0 16px 42px rgba(91,63,45,.055) !important;
}

.hanip-after-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

/* 티스토리 공감/공유/통계/관리 버튼 레이어 보정 */
.entry-content .container_postbtn,
#article-view .container_postbtn,
.container_postbtn,
.postbtn_area,
.postbtn_like,
.wrap_postbtn,
.wrap_btn,
.postbtn_ccl,
.btn_post,
.post-btn {
  overflow: visible !important;
  position: relative !important;
  z-index: 3000 !important;
  box-sizing: border-box !important;
}

.container_postbtn,
.postbtn_area,
.post-btn {
  display: block !important;
  min-height: 56px !important;
  margin-top: 30px !important;
  margin-bottom: 30px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.container_postbtn .postbtn_like,
.container_postbtn .wrap_btn,
.container_postbtn .postbtn_ccl,
.container_postbtn .postbtn_area,
.postbtn_area .postbtn_like {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 44px !important;
  overflow: visible !important;
}

.container_postbtn button,
.container_postbtn a,
.postbtn_area button,
.postbtn_area a {
  position: relative !important;
  z-index: 3100 !important;
}

.container_postbtn [class*="layer"],
.container_postbtn [class*="Layer"],
.container_postbtn [class*="menu"],
.container_postbtn [class*="Menu"],
.postbtn_area [class*="layer"],
.postbtn_area [class*="Layer"],
.postbtn_area [class*="menu"],
.postbtn_area [class*="Menu"],
.tistory_post_btn [class*="layer"],
.tistory_post_btn [class*="menu"] {
  z-index: 99999 !important;
  overflow: visible !important;
}

/* 관리자 메뉴 말풍선이 잘리지 않도록 */
#tt-body-page,
#tt-body-article,
#article-view,
.entry-content,
.hgroup,
.related-articles,
.tags {
  overflow: visible !important;
}

@media screen and (max-width: 1500px) {
  :root {
    --hanip-shell-v26: var(--hanip-shell-v26-compact);
    --hanip-article-v26: min(1120px, calc(100vw - 64px));
  }
  .cover-thumbnail-list-1 ul,
  .cover-thumbnail-list-2 ul,
  .hanip-cover-grid ul,
  .cover-slider ul,
  .cover-slider.slide-on ul,
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner,
  .layout-float #content > .inner:has(> .post-item) {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media screen and (max-width: 1024px) {
  :root {
    --hanip-shell-v26: calc(100vw - 40px);
    --hanip-article-v26: calc(100vw - 40px);
    --hanip-header-v26: 70px;
  }
  .cover-thumbnail-list-1 ul,
  .cover-thumbnail-list-2 ul,
  .hanip-cover-grid ul,
  .cover-slider ul,
  .cover-slider.slide-on ul,
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner,
  .layout-float #content > .inner:has(> .post-item) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 28px 16px !important;
  }
  .entry-content,
  #article-view,
  .layout-float .entry-content,
  .layout-float #article-view {
    padding: 38px 28px !important;
  }
  .related-articles ul,
  .hanip-same-category ul,
  .hanip-after-grid {
    grid-template-columns: 1fr !important;
  }
  .cover-thumbnail-list-1 h2,
  .cover-thumbnail-list-2 h2,
  .hanip-cover-grid h2,
  .post-header h2 {
    padding: 0 22px !important;
    min-height: 58px !important;
  }
}

@media screen and (max-width: 640px) {
  :root {
    --hanip-shell-v26: calc(100vw - 24px);
    --hanip-article-v26: calc(100vw - 24px);
    --hanip-header-v26: 64px;
  }
  .sneru-translate-bar,
  .layout-float .sneru-translate-bar {
    top: var(--hanip-header-v26) !important;
    gap: 7px !important;
    padding: 8px 12px !important;
  }
  .cover-thumbnail-list-1 ul,
  .cover-thumbnail-list-2 ul,
  .hanip-cover-grid ul,
  .cover-slider ul,
  .cover-slider.slide-on ul,
  body#tt-body-index #content > .inner,
  body#tt-body-category #content > .inner,
  body#tt-body-search #content > .inner,
  body#tt-body-archive #content > .inner,
  body#tt-body-tag #content > .inner,
  .layout-float #content > .inner:has(> .post-item) {
    grid-template-columns: 1fr !important;
  }
  .hgroup h1,
  .layout-float .hgroup h1 {
    font-size: 32px !important;
    letter-spacing: -1.2px !important;
  }
  .entry-content,
  #article-view,
  .layout-float .entry-content,
  .layout-float #article-view {
    padding: 28px 20px !important;
    border-radius: 22px !important;
  }
  .related-articles,
  .hanip-same-category,
  .hanip-article-tags,
  #content .tags,
  .hanip-after-reading {
    padding: 24px 18px !important;
    border-radius: 22px !important;
  }
}

/* =========================================================
   상식한입 v2.7 FINAL CENTER ALIGN PATCH
   목적:
   1) 본문 상세 페이지의 본문/공감버튼/같은 카테고리/태그/다음 한입을 모두 같은 중앙축으로 정렬
   2) 본문 가로 폭 확대
   3) 홈 커버 섹션 제목 좌우 여백 확보 + ENGLISH _ 한글 형식 유지
   4) 기존 고특이도 CSS의 margin-left:0 / max-width:900px 잔여값 최종 차단
   ========================================================= */
:root {
  --hanip-shell-v27: min(1500px, calc(100vw - 120px));
  --hanip-article-v27: min(1280px, calc(100vw - 140px));
  --hanip-header-v27: 76px;
}

/* 홈/목록 커버 영역: 화면 끝까지 붙지 않게 좌우 여백 확보 */
body#tt-body-index .cover-thumbnail-list-1,
body#tt-body-index .cover-thumbnail-list-2,
body#tt-body-index .hanip-cover-grid,
body#tt-body-index .cover-slider,
body#tt-body-category .post-header,
body#tt-body-category #content > .inner,
body#tt-body-search .post-header,
body#tt-body-search #content > .inner,
body#tt-body-archive .post-header,
body#tt-body-archive #content > .inner,
body#tt-body-tag .post-header,
body#tt-body-tag #content > .inner,
.layout-float body#tt-body-index .cover-thumbnail-list-1,
.layout-float body#tt-body-index .cover-thumbnail-list-2,
.layout-float body#tt-body-index .hanip-cover-grid {
  width: var(--hanip-shell-v27) !important;
  max-width: 1500px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

.cover-thumbnail-list-1,
.cover-thumbnail-list-2,
.hanip-cover-grid,
.post-header {
  width: var(--hanip-shell-v27) !important;
  max-width: 1500px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

.cover-thumbnail-list-1 h2,
.cover-thumbnail-list-2 h2,
.hanip-cover-grid h2,
.post-header h2 {
  justify-content: flex-start !important;
  width: 100% !important;
  padding-left: 38px !important;
  padding-right: 38px !important;
  box-sizing: border-box !important;
}

/* 상세 페이지 전체 컨테이너: 중앙축 강제 */
body#tt-body-page #content > .inner,
body#tt-body-article #content > .inner,
#content > .inner:has(> #article-view),
#content > .inner:has(> .entry-content),
.layout-float #content > .inner:has(> #article-view),
.layout-float #content > .inner:has(> .entry-content) {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: var(--hanip-article-v27) !important;
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

/* 상세 페이지 직계 요소: 모두 같은 폭 + 가운데 정렬 */
body#tt-body-page #content > .inner > .hgroup,
body#tt-body-page #content > .inner > .entry-content,
body#tt-body-page #content > .inner > #article-view,
body#tt-body-page #content > .inner > .related-articles,
body#tt-body-page #content > .inner > .hanip-same-category,
body#tt-body-page #content > .inner > .tags,
body#tt-body-page #content > .inner > .hanip-article-tags,
body#tt-body-page #content > .inner > .hanip-after-reading,
body#tt-body-page #content > .inner > .comments,
body#tt-body-page #content > .inner > .pagination,
body#tt-body-article #content > .inner > .hgroup,
body#tt-body-article #content > .inner > .entry-content,
body#tt-body-article #content > .inner > #article-view,
body#tt-body-article #content > .inner > .related-articles,
body#tt-body-article #content > .inner > .hanip-same-category,
body#tt-body-article #content > .inner > .tags,
body#tt-body-article #content > .inner > .hanip-article-tags,
body#tt-body-article #content > .inner > .hanip-after-reading,
body#tt-body-article #content > .inner > .comments,
body#tt-body-article #content > .inner > .pagination,
#content > .inner > .hgroup,
#content > .inner > .entry-content,
#content > .inner > #article-view,
#content > .inner > .related-articles.hanip-same-category,
#content > .inner > .hanip-same-category,
#content > .inner > .tags.hanip-article-tags,
#content > .inner > .hanip-article-tags,
#content > .inner > .hanip-after-reading,
#content > .inner > .comments,
#content > .inner > .pagination,
.layout-float #content .inner > .hgroup,
.layout-float #content .inner > .entry-content,
.layout-float #content .inner > #article-view,
.layout-float #content .inner > .related-articles.hanip-same-category,
.layout-float #content .inner > .hanip-same-category,
.layout-float #content .inner > .tags.hanip-article-tags,
.layout-float #content .inner > .hanip-article-tags,
.layout-float #content .inner > .hanip-after-reading,
.layout-float #content .inner > .comments,
.layout-float #content .inner > .pagination {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  grid-column: 1 / -1 !important;
}

body#tt-body-page .hgroup,
body#tt-body-article .hgroup,
#content > .inner > .hgroup,
.layout-float #content .inner > .hgroup {
  margin-top: 48px !important;
  margin-bottom: 32px !important;
  padding: 48px 0 32px !important;
}

body#tt-body-page .entry-content,
body#tt-body-page #article-view,
body#tt-body-article .entry-content,
body#tt-body-article #article-view,
#content > .inner > .entry-content,
#content > .inner > #article-view,
.layout-float #content .inner > .entry-content,
.layout-float #content .inner > #article-view {
  margin-top: 0 !important;
  margin-bottom: 34px !important;
  padding: 60px 68px !important;
  border-radius: 32px !important;
}

/* 본문 안에 삽입되는 티스토리 공감/공유/통계/관리 버튼: 가운데 정렬 */
.entry-content .container_postbtn,
#article-view .container_postbtn,
.entry-content .postbtn_area,
#article-view .postbtn_area,
.container_postbtn,
.postbtn_area,
.post-btn,
.layout-float .container_postbtn,
.layout-float .postbtn_area,
.layout-float .post-btn {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 58px !important;
  margin: 34px auto 36px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  position: relative !important;
  z-index: 7000 !important;
  box-sizing: border-box !important;
}

.container_postbtn .postbtn_like,
.container_postbtn .wrap_btn,
.container_postbtn .postbtn_ccl,
.container_postbtn .postbtn_area,
.postbtn_area .postbtn_like,
.wrap_postbtn,
.wrap_btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  width: auto !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.container_postbtn [class*="layer"],
.container_postbtn [class*="Layer"],
.container_postbtn [class*="menu"],
.container_postbtn [class*="Menu"],
.postbtn_area [class*="layer"],
.postbtn_area [class*="Layer"],
.postbtn_area [class*="menu"],
.postbtn_area [class*="Menu"],
#tistoryEtcLayer {
  z-index: 999999 !important;
  overflow: visible !important;
}

/* 같은 카테고리 다른 한입: 본문 바로 아래, 중앙 정렬 */
body#tt-body-page #content > .inner > .related-articles.hanip-same-category,
body#tt-body-article #content > .inner > .related-articles.hanip-same-category,
#content > .inner > .related-articles.hanip-same-category,
.layout-float #content .inner > .related-articles.hanip-same-category {
  margin-top: 10px !important;
  margin-bottom: 34px !important;
  padding: 36px 38px 40px !important;
  text-align: left !important;
  border-radius: 32px !important;
}

body#tt-body-page #content > .inner > .related-articles.hanip-same-category ul,
body#tt-body-article #content > .inner > .related-articles.hanip-same-category ul,
#content > .inner > .related-articles.hanip-same-category ul,
.layout-float #content .inner > .related-articles.hanip-same-category ul {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 22px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 태그: 같은 카테고리 아래 중앙 배치 */
body#tt-body-page #content > .inner > .tags.hanip-article-tags,
body#tt-body-article #content > .inner > .tags.hanip-article-tags,
#content > .inner > .tags.hanip-article-tags,
.layout-float #content .inner > .tags.hanip-article-tags {
  margin-top: 0 !important;
  margin-bottom: 34px !important;
  padding: 34px 38px !important;
  text-align: center !important;
  border-radius: 32px !important;
}

body#tt-body-page #content > .inner > .tags.hanip-article-tags .items,
body#tt-body-article #content > .inner > .tags.hanip-article-tags .items,
#content > .inner > .tags.hanip-article-tags .items,
.layout-float #content .inner > .tags.hanip-article-tags .items {
  justify-content: center !important;
}

/* 다른 카테고리도 이어서 보기: 태그 아래 중앙 배치 */
body#tt-body-page #content > .inner > .hanip-after-reading,
body#tt-body-article #content > .inner > .hanip-after-reading,
#content > .inner > .hanip-after-reading,
.layout-float #content .inner > .hanip-after-reading {
  margin-top: 0 !important;
  margin-bottom: 58px !important;
  padding: 36px 38px !important;
  border-radius: 32px !important;
}

/* 플러그인형 기존 리스트는 완전히 제거 */
.another_category,
.another-category,
.entry-content .another_category,
#article-view .another_category,
div[class*="another_category"] {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

@media screen and (max-width: 1500px) {
  :root {
    --hanip-shell-v27: min(1400px, calc(100vw - 80px));
    --hanip-article-v27: min(1180px, calc(100vw - 80px));
  }
  body#tt-body-page #content > .inner > .related-articles.hanip-same-category ul,
  body#tt-body-article #content > .inner > .related-articles.hanip-same-category ul,
  #content > .inner > .related-articles.hanip-same-category ul,
  .layout-float #content .inner > .related-articles.hanip-same-category ul {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media screen and (max-width: 1024px) {
  :root {
    --hanip-shell-v27: calc(100vw - 40px);
    --hanip-article-v27: calc(100vw - 40px);
    --hanip-header-v27: 70px;
  }
  body#tt-body-page .entry-content,
  body#tt-body-page #article-view,
  body#tt-body-article .entry-content,
  body#tt-body-article #article-view,
  #content > .inner > .entry-content,
  #content > .inner > #article-view,
  .layout-float #content .inner > .entry-content,
  .layout-float #content .inner > #article-view {
    padding: 40px 30px !important;
  }
  body#tt-body-page #content > .inner > .related-articles.hanip-same-category ul,
  body#tt-body-article #content > .inner > .related-articles.hanip-same-category ul,
  #content > .inner > .related-articles.hanip-same-category ul,
  .layout-float #content .inner > .related-articles.hanip-same-category ul,
  .hanip-after-grid {
    grid-template-columns: 1fr !important;
  }
}

@media screen and (max-width: 640px) {
  :root {
    --hanip-shell-v27: calc(100vw - 24px);
    --hanip-article-v27: calc(100vw - 24px);
    --hanip-header-v27: 64px;
  }
  .cover-thumbnail-list-1 h2,
  .cover-thumbnail-list-2 h2,
  .hanip-cover-grid h2,
  .post-header h2 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  body#tt-body-page .entry-content,
  body#tt-body-page #article-view,
  body#tt-body-article .entry-content,
  body#tt-body-article #article-view,
  #content > .inner > .entry-content,
  #content > .inner > #article-view,
  .layout-float #content .inner > .entry-content,
  .layout-float #content .inner > #article-view {
    padding: 28px 20px !important;
    border-radius: 24px !important;
  }
  #content > .inner > .related-articles.hanip-same-category,
  #content > .inner > .tags.hanip-article-tags,
  #content > .inner > .hanip-after-reading {
    padding: 24px 18px !important;
    border-radius: 24px !important;
  }
}


/* =========================================================
   상식한입 v2.8 FINAL ARTICLE WIDTH PATCH
   목적:
   1) 상세 본문 영역도 홈 화면 수준의 좌우 여백으로 통일
   2) 본문/공감/같은 카테고리/태그/다음 한입 전체를 동일한 중앙축 유지
   3) v2.7의 좁은 본문폭 잔여값 최종 상쇄
   ========================================================= */
:root {
  --hanip-shell-v28: min(1500px, calc(100vw - 120px));
  --hanip-article-v28: var(--hanip-shell-v28);
}

/* 상세 페이지 전체 폭: 홈 커버 섹션과 동일한 여백 기준 */
body#tt-body-page #content > .inner,
body#tt-body-article #content > .inner,
body#tt-body-page #content .inner:has(> #article-view),
body#tt-body-article #content .inner:has(> #article-view),
body#tt-body-page #content .inner:has(> .entry-content),
body#tt-body-article #content .inner:has(> .entry-content),
.layout-float body#tt-body-page #content > .inner,
.layout-float body#tt-body-article #content > .inner,
.layout-float #content > .inner:has(> #article-view),
.layout-float #content > .inner:has(> .entry-content) {
  width: var(--hanip-article-v28) !important;
  max-width: 1500px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

/* 상세 페이지 하위 블록 전체를 같은 폭으로 통일 */
body#tt-body-page #content > .inner > .hgroup,
body#tt-body-page #content > .inner > .entry-content,
body#tt-body-page #content > .inner > #article-view,
body#tt-body-page #content > .inner > .related-articles,
body#tt-body-page #content > .inner > .hanip-same-category,
body#tt-body-page #content > .inner > .hanip-article-tags,
body#tt-body-page #content > .inner > .tags,
body#tt-body-page #content > .inner > .hanip-after-reading,
body#tt-body-article #content > .inner > .hgroup,
body#tt-body-article #content > .inner > .entry-content,
body#tt-body-article #content > .inner > #article-view,
body#tt-body-article #content > .inner > .related-articles,
body#tt-body-article #content > .inner > .hanip-same-category,
body#tt-body-article #content > .inner > .hanip-article-tags,
body#tt-body-article #content > .inner > .tags,
body#tt-body-article #content > .inner > .hanip-after-reading,
.layout-float #content .inner > .hgroup,
.layout-float #content .inner > .entry-content,
.layout-float #content .inner > #article-view,
.layout-float #content .inner > .related-articles,
.layout-float #content .inner > .hanip-same-category,
.layout-float #content .inner > .hanip-article-tags,
.layout-float #content .inner > .tags,
.layout-float #content .inner > .hanip-after-reading {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
  grid-column: 1 / -1 !important;
}

/* 본문 카드: 넓게, 단 홈과 같은 외곽 여백 유지 */
body#tt-body-page .entry-content,
body#tt-body-page #article-view,
body#tt-body-article .entry-content,
body#tt-body-article #article-view,
.layout-float #content .inner > .entry-content,
.layout-float #content .inner > #article-view {
  padding: 64px 82px !important;
  border-radius: 34px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 본문 하단 세트: 본문 카드와 같은 외곽 폭 유지 */
body#tt-body-page #content > .inner > .related-articles.hanip-same-category,
body#tt-body-article #content > .inner > .related-articles.hanip-same-category,
.layout-float #content .inner > .related-articles.hanip-same-category,
body#tt-body-page #content > .inner > .tags.hanip-article-tags,
body#tt-body-article #content > .inner > .tags.hanip-article-tags,
.layout-float #content .inner > .tags.hanip-article-tags,
body#tt-body-page #content > .inner > .hanip-after-reading,
body#tt-body-article #content > .inner > .hanip-after-reading,
.layout-float #content .inner > .hanip-after-reading {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* 같은 카테고리 카드가 넓어진 본문 폭에 맞게 자연스럽게 채워지도록 */
body#tt-body-page #content > .inner > .related-articles.hanip-same-category ul,
body#tt-body-article #content > .inner > .related-articles.hanip-same-category ul,
.layout-float #content .inner > .related-articles.hanip-same-category ul {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 24px !important;
}

/* 공감/공유/통계/관리 버튼도 넓어진 본문 안에서 중앙 유지 */
body#tt-body-page .container_postbtn,
body#tt-body-page .postbtn_area,
body#tt-body-article .container_postbtn,
body#tt-body-article .postbtn_area,
.layout-float .container_postbtn,
.layout-float .postbtn_area {
  justify-content: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

@media screen and (max-width: 1500px) {
  :root {
    --hanip-shell-v28: min(1400px, calc(100vw - 80px));
    --hanip-article-v28: var(--hanip-shell-v28);
  }
  body#tt-body-page #content > .inner,
  body#tt-body-article #content > .inner,
  .layout-float #content > .inner:has(> #article-view),
  .layout-float #content > .inner:has(> .entry-content) {
    max-width: 1400px !important;
  }
  body#tt-body-page .entry-content,
  body#tt-body-page #article-view,
  body#tt-body-article .entry-content,
  body#tt-body-article #article-view,
  .layout-float #content .inner > .entry-content,
  .layout-float #content .inner > #article-view {
    padding: 56px 64px !important;
  }
  body#tt-body-page #content > .inner > .related-articles.hanip-same-category ul,
  body#tt-body-article #content > .inner > .related-articles.hanip-same-category ul,
  .layout-float #content .inner > .related-articles.hanip-same-category ul {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media screen and (max-width: 1024px) {
  :root {
    --hanip-shell-v28: calc(100vw - 40px);
    --hanip-article-v28: var(--hanip-shell-v28);
  }
  body#tt-body-page .entry-content,
  body#tt-body-page #article-view,
  body#tt-body-article .entry-content,
  body#tt-body-article #article-view,
  .layout-float #content .inner > .entry-content,
  .layout-float #content .inner > #article-view {
    padding: 40px 30px !important;
  }
  body#tt-body-page #content > .inner > .related-articles.hanip-same-category ul,
  body#tt-body-article #content > .inner > .related-articles.hanip-same-category ul,
  .layout-float #content .inner > .related-articles.hanip-same-category ul {
    grid-template-columns: 1fr !important;
  }
}

@media screen and (max-width: 640px) {
  :root {
    --hanip-shell-v28: calc(100vw - 24px);
    --hanip-article-v28: var(--hanip-shell-v28);
  }
  body#tt-body-page .entry-content,
  body#tt-body-page #article-view,
  body#tt-body-article .entry-content,
  body#tt-body-article #article-view,
  .layout-float #content .inner > .entry-content,
  .layout-float #content .inner > #article-view {
    padding: 28px 20px !important;
    border-radius: 24px !important;
  }
}

/* =========================================================
   상식한입 v2.9 COMMENT RESTORE PATCH
   목적:
   1) 댓글 영역은 도감형 카드/본문폭 강제 스타일에서 제외
   2) 티스토리 기본 댓글 UI에 가깝게 독립 배치
   3) 본문/같은 카테고리/태그/다음 한입 중앙축은 유지
   ========================================================= */

/* 댓글 영역은 본문 도감 카드 스타일을 먹지 않도록 원본형 폭으로 분리 */
body#tt-body-page #content > .inner > .comments,
body#tt-body-article #content > .inner > .comments,
#content > .inner > .comments,
.layout-float #content .inner > .comments,
.comments {
  float: none !important;
  display: block !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  width: min(860px, calc(100vw - 48px)) !important;
  max-width: 860px !important;
  min-width: 0 !important;
  margin: 72px auto 110px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  text-align: left !important;
  grid-column: 1 / -1 !important;
  box-sizing: border-box !important;
}

/* 티스토리 신형 댓글 모듈도 원본형처럼 전체 폭 사용 */
.comments .tt-comment-cont,
#content .comments .tt-comment-cont,
body#tt-body-page .comments .tt-comment-cont,
body#tt-body-article .comments .tt-comment-cont {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

/* 댓글 제목부 */
.comments h2,
.comments .tt-box-total {
  margin: 0 0 22px !important;
  padding: 0 0 18px !important;
  border-bottom: 1px solid rgba(91, 63, 45, .14) !important;
  color: var(--hanip-brown, #5f3d29) !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 1.4 !important;
  text-align: left !important;
}

.comments h2 .count,
.comments .tt-box-total .tt_num_g {
  color: var(--hanip-brown-3, #b67c4f) !important;
}

/* 댓글 입력 영역은 좁은 카드형으로 찌그러지지 않게 복구 */
.comments .comment-form,
.comments .tt-area-write,
.comments .tt-box-write,
.comments .tt-wrap-write,
.comments form {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.comments .comment-form textarea,
.comments textarea,
.comments .tt-cmt,
.comments .tt_area_reply,
.comments .tt-area-write textarea,
.comments .tt-box-write textarea,
.comments .tt_inp_g,
.comments .tt-input-g {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 110px !important;
  box-sizing: border-box !important;
}

.comments .comment-form .submit,
.comments .tt-wrap-cmt .tt-area-btn,
.comments .tt-box-write .tt-area-btn {
  text-align: right !important;
}

.comments .tt-btn_register,
.comments .comment-form .submit button,
.comments button[type="submit"] {
  min-width: 120px !important;
  height: 42px !important;
  border: 1px solid var(--hanip-brown-3, #b67c4f) !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: var(--hanip-brown-2, #6b432f) !important;
  font-weight: 700 !important;
}

.comments .tt-btn_register:hover,
.comments .comment-form .submit button:hover,
.comments button[type="submit"]:hover {
  background: var(--hanip-brown-2, #6b432f) !important;
  color: #fff !important;
}

/* 댓글 내부 요소에는 v2.8의 카드형 폭 강제를 더 이상 적용하지 않음 */
.comments *,
.comments *::before,
.comments *::after {
  box-sizing: border-box !important;
}

/* 모바일 댓글 폭 */
@media screen and (max-width: 640px) {
  body#tt-body-page #content > .inner > .comments,
  body#tt-body-article #content > .inner > .comments,
  #content > .inner > .comments,
  .layout-float #content .inner > .comments,
  .comments {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    margin-top: 48px !important;
    margin-bottom: 80px !important;
  }
}


/* =========================================================
   상식한입 v2.10 SAME CATEGORY MORE PATCH
   목적:
   1) 같은 카테고리 다른 한입을 데스크톱 4열로 고정
   2) 하단에 같은 카테고리 더보기 버튼 추가
   3) 기존 v2.9 댓글 복구 패치는 유지
   ========================================================= */
body#tt-body-page #content > .inner > .related-articles.hanip-same-category ul,
body#tt-body-article #content > .inner > .related-articles.hanip-same-category ul,
#content > .inner > .related-articles.hanip-same-category ul,
.layout-float #content .inner > .related-articles.hanip-same-category ul {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 24px !important;
  align-items: stretch !important;
}

body#tt-body-page #content > .inner > .related-articles.hanip-same-category ul li,
body#tt-body-article #content > .inner > .related-articles.hanip-same-category ul li,
#content > .inner > .related-articles.hanip-same-category ul li,
.layout-float #content .inner > .related-articles.hanip-same-category ul li {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

.hanip-same-more-wrap {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin: 30px auto 0 !important;
  padding: 0 !important;
  text-align: center !important;
}

.hanip-same-more {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 176px !important;
  height: 44px !important;
  padding: 0 24px !important;
  border: 1px solid rgba(95, 61, 41, .22) !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: var(--hanip-brown-2, #6b432f) !important;
  text-decoration: none !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  letter-spacing: -.02em !important;
  box-shadow: 0 12px 26px rgba(91, 63, 45, .08) !important;
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease !important;
}

.hanip-same-more::after {
  content: "→" !important;
  margin-left: 8px !important;
  font-size: 15px !important;
  line-height: 1 !important;
}

.hanip-same-more:hover {
  transform: translateY(-2px) !important;
  background: var(--hanip-brown-2, #6b432f) !important;
  color: #fff !important;
  box-shadow: 0 18px 34px rgba(91, 63, 45, .16) !important;
}

@media screen and (max-width: 1180px) {
  body#tt-body-page #content > .inner > .related-articles.hanip-same-category ul,
  body#tt-body-article #content > .inner > .related-articles.hanip-same-category ul,
  #content > .inner > .related-articles.hanip-same-category ul,
  .layout-float #content .inner > .related-articles.hanip-same-category ul {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media screen and (max-width: 640px) {
  body#tt-body-page #content > .inner > .related-articles.hanip-same-category ul,
  body#tt-body-article #content > .inner > .related-articles.hanip-same-category ul,
  #content > .inner > .related-articles.hanip-same-category ul,
  .layout-float #content .inner > .related-articles.hanip-same-category ul {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .hanip-same-more {
    width: 100% !important;
  }
}


/* =========================================================
   상식한입 v2.11 COMMENT FINAL RESTORE PATCH
   목적:
   1) 댓글창은 본문 중앙 정렬/카드형 강제 스타일에서 완전히 분리
   2) 댓글 입력창/버튼/관리 메뉴가 찌그러지지 않고 원본 댓글 UI처럼 출력
   3) 본문·같은 카테고리·태그·다음 한입의 중앙축은 유지
   ========================================================= */

/* 댓글 섹션 자체는 flex 중앙 정렬에서 제외하고, 현재 본문 쉘 안에서 온전한 한 줄 영역으로 사용 */
body#tt-body-page #content > .inner > .comments,
body#tt-body-article #content > .inner > .comments,
#content > .inner > .comments,
.layout-float #content .inner > .comments,
.comments {
  align-self: stretch !important;
  flex: none !important;
  float: none !important;
  display: block !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 56px 0 110px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  text-align: left !important;
  box-sizing: border-box !important;
  grid-column: 1 / -1 !important;
}

/* 티스토리 구형/신형 댓글 컨테이너 모두 전체 폭 사용 */
.comments .tt-comment-cont,
.comments .tt-comment,
.comments .tt-wrap-cmt,
.comments .tt-area-write,
.comments .tt-box-write,
.comments .comment-form,
.comments form,
#content .comments .tt-comment-cont,
#content .comments .comment-form,
body#tt-body-page .comments .tt-comment-cont,
body#tt-body-article .comments .tt-comment-cont {
  float: none !important;
  display: block !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-align: left !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

/* 댓글 제목은 원본처럼 단순 라인 구조 */
.comments h2,
.comments .tt-box-total {
  width: 100% !important;
  margin: 0 0 22px !important;
  padding: 0 0 18px !important;
  border-bottom: 1px solid #e6e6e6 !important;
  background: transparent !important;
  color: #5f3d29 !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1.4 !important;
  text-align: left !important;
  box-sizing: border-box !important;
}

/* 댓글 작성 영역: 프로필/입력창/버튼이 좁은 카드처럼 찌그러지지 않게 복구 */
.comments .comment-form .field,
.comments .tt-area-write,
.comments .tt-box-write,
.comments .tt-wrap-write,
.comments .tt-write,
.comments .tt-cmt,
.comments .tt-comment-write {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.comments textarea,
.comments .comment-form textarea,
.comments .tt-area-write textarea,
.comments .tt-box-write textarea,
.comments .tt_inp_g,
.comments .tt-input-g,
.comments .tt-cmt textarea,
.comments textarea.tt-cmt {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 120px !important;
  margin: 0 0 12px !important;
  padding: 12px 14px !important;
  border: 1px solid #d8d0c7 !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: #333 !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  resize: vertical !important;
  box-sizing: border-box !important;
}

.comments .comment-form input[type=text],
.comments .comment-form input[type=password],
.comments input[type=text],
.comments input[type=password] {
  width: 180px !important;
  max-width: 100% !important;
  height: 40px !important;
  padding: 10px !important;
  border: 1px solid #d8d0c7 !important;
  background: #fff !important;
  box-sizing: border-box !important;
}

/* 등록 버튼은 원본처럼 우측 배치 */
.comments .comment-form .submit,
.comments .tt-wrap-cmt .tt-area-btn,
.comments .tt-box-write .tt-area-btn,
.comments .tt-area-btn,
.comments .tt-btn-area {
  width: 100% !important;
  margin: 10px 0 0 !important;
  text-align: right !important;
  box-sizing: border-box !important;
}

.comments .tt-btn_register,
.comments .comment-form .submit button,
.comments button[type="submit"] {
  display: inline-block !important;
  width: auto !important;
  min-width: 120px !important;
  height: 42px !important;
  padding: 0 24px !important;
  border: 1px solid #b67c4f !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: #6b432f !important;
  font-weight: 700 !important;
  line-height: 40px !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

.comments .tt-btn_register:hover,
.comments .comment-form .submit button:hover,
.comments button[type="submit"]:hover {
  background: #6b432f !important;
  color: #fff !important;
}

/* 댓글 관리 드롭다운/수정 메뉴는 공감바처럼 잘리지 않게 레이어 우선 */
.comments .control,
.comments .tt_more_preview_comments_wrap,
.comments .tt_more_preview_comments_text,
.comments .tt-layer,
.comments .tt-list-more,
.comments .tt-menu,
.comments .tt-menu-list,
.comments [class*="menu"],
.comments [class*="Layer"],
.comments [class*="layer"] {
  overflow: visible !important;
  z-index: 9999 !important;
}

/* 댓글 영역 내부에는 상식한입 카드형 중앙정렬을 강제로 상속하지 않음 */
.comments * {
  max-width: none;
  box-sizing: border-box !important;
}

@media screen and (max-width: 640px) {
  body#tt-body-page #content > .inner > .comments,
  body#tt-body-article #content > .inner > .comments,
  #content > .inner > .comments,
  .layout-float #content .inner > .comments,
  .comments {
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 44px !important;
    margin-bottom: 80px !important;
  }
  .comments .comment-form input[type=text],
  .comments .comment-form input[type=password],
  .comments input[type=text],
  .comments input[type=password] {
    width: 100% !important;
    margin-bottom: 8px !important;
  }
}


/* =========================================================
   상식한입 v2.12 COMMENT POSITION PATCH
   목적: 댓글 영역만 본문 하단의 넓은 중앙 영역에 온전하게 배치
   기준: 본문 카드처럼 가운데로 축소하지 않고, 홈/본문과 같은 큰 폭 사용
   ========================================================= */

/* 댓글 그룹을 별도 쉘로 감싸 전체 폭/위치 고정 */
body#tt-body-page #content > .inner > .hanip-comment-shell,
body#tt-body-article #content > .inner > .hanip-comment-shell,
#content > .inner > .hanip-comment-shell,
.hanip-comment-shell {
  display: block !important;
  clear: both !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  width: min(1440px, calc(100vw - 320px)) !important;
  max-width: min(1440px, calc(100vw - 320px)) !important;
  min-width: 0 !important;
  min-height: 560px !important;
  margin: 72px auto 120px !important;
  padding: 72px 72px 88px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  text-align: left !important;
  box-sizing: border-box !important;
  grid-column: 1 / -1 !important;
  align-self: auto !important;
}

/* 티스토리가 생성하는 댓글 최상위 요소를 쉘 안에서만 전체폭으로 풀어줌 */
.hanip-comment-shell > *,
.hanip-comment-shell #entry0Comment,
.hanip-comment-shell [id*="Comment"],
.hanip-comment-shell .comments,
.hanip-comment-shell .comment,
.hanip-comment-shell .comment-list,
.hanip-comment-shell .comment-form,
.hanip-comment-shell .tt-comment-cont,
.hanip-comment-shell .tt-comment,
.hanip-comment-shell .tt-wrap-cmt,
.hanip-comment-shell .tt-area-write,
.hanip-comment-shell .tt-box-write,
.hanip-comment-shell .tt-wrap-write,
.hanip-comment-shell form {
  display: block !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-align: left !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

/* 기존 .comments 패치가 있더라도, 댓글 쉘 안에서는 작은 중앙 카드가 되지 않게 재고정 */
.hanip-comment-shell .comments {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* 댓글 입력창: 프로필 + 입력창 + 버튼이 한 영역 안에 온전하게 나오도록 */
.hanip-comment-shell textarea,
.hanip-comment-shell .comment-form textarea,
.hanip-comment-shell .tt-area-write textarea,
.hanip-comment-shell .tt-box-write textarea,
.hanip-comment-shell .tt_inp_g,
.hanip-comment-shell .tt-input-g,
.hanip-comment-shell .tt-cmt textarea,
.hanip-comment-shell textarea.tt-cmt {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 150px !important;
  margin: 0 0 14px !important;
  padding: 16px 18px !important;
  border: 1px solid rgba(95, 61, 41, .22) !important;
  border-radius: 0 !important;
  background: rgba(255,255,255,.72) !important;
  color: #333 !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  resize: vertical !important;
  box-sizing: border-box !important;
}

.hanip-comment-shell input[type="text"],
.hanip-comment-shell input[type="password"] {
  width: 220px !important;
  max-width: 100% !important;
  height: 42px !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(95, 61, 41, .22) !important;
  background: #fff !important;
  box-sizing: border-box !important;
}

.hanip-comment-shell .comment-form .submit,
.hanip-comment-shell .tt-wrap-cmt .tt-area-btn,
.hanip-comment-shell .tt-box-write .tt-area-btn,
.hanip-comment-shell .tt-area-btn,
.hanip-comment-shell .tt-btn-area {
  width: 100% !important;
  margin: 12px 0 0 !important;
  text-align: right !important;
  box-sizing: border-box !important;
}

.hanip-comment-shell .tt-btn_register,
.hanip-comment-shell .comment-form .submit button,
.hanip-comment-shell button[type="submit"] {
  display: inline-block !important;
  width: auto !important;
  min-width: 140px !important;
  height: 44px !important;
  padding: 0 28px !important;
  border: 1px solid #b67c4f !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: #6b432f !important;
  font-weight: 800 !important;
  line-height: 42px !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

/* 댓글 메뉴/관리 팝업이 잘리지 않도록 */
.hanip-comment-shell .control,
.hanip-comment-shell .tt-layer,
.hanip-comment-shell .tt-list-more,
.hanip-comment-shell .tt-menu,
.hanip-comment-shell .tt-menu-list,
.hanip-comment-shell [class*="menu"],
.hanip-comment-shell [class*="Layer"],
.hanip-comment-shell [class*="layer"] {
  overflow: visible !important;
  z-index: 99999 !important;
}

@media screen and (max-width: 1500px) {
  body#tt-body-page #content > .inner > .hanip-comment-shell,
  body#tt-body-article #content > .inner > .hanip-comment-shell,
  #content > .inner > .hanip-comment-shell,
  .hanip-comment-shell {
    width: calc(100vw - 96px) !important;
    max-width: calc(100vw - 96px) !important;
    padding-left: 48px !important;
    padding-right: 48px !important;
  }
}

@media screen and (max-width: 768px) {
  body#tt-body-page #content > .inner > .hanip-comment-shell,
  body#tt-body-article #content > .inner > .hanip-comment-shell,
  #content > .inner > .hanip-comment-shell,
  .hanip-comment-shell {
    width: calc(100vw - 28px) !important;
    max-width: calc(100vw - 28px) !important;
    min-height: auto !important;
    margin: 48px auto 80px !important;
    padding: 36px 0 56px !important;
  }

  .hanip-comment-shell input[type="text"],
  .hanip-comment-shell input[type="password"] {
    width: 100% !important;
    margin-bottom: 8px !important;
  }
}