:root {
  --height: calc(var(--vh, 1vh) * 100);
  
  --main-color: #ffbece;
  --bg-color: #fafafb;
  --font-color: #2F2F33;
  --border-color: #e9e9e9;
  --white: #fff;
  --black: #000;
  
  --font-family: 'Inter', pretendard, sans-serif;
  --font-size: 12px;
}

::selection {
  background-color: var(--main-color);
  color: var(--font-color);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent !important;
}

*:focus { 
  outline: none !important; 
}

body {
  width: 100vw;
  font-family: var(--font-family);
  font-size: var(--font-size);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  letter-spacing: -0.7px;
  background: var(--bg-color);
  scrollbar-width: none;
  -ms-overflow-style: none;
  color: var(--font-color);
  animation: fadein 1s;
}
body::-webkit-scrollbar {
  display: none;
}

body.ver1,
#tt-body-search {
  background: var(--white);
}

@media (max-width: 600px) {
  body {
    background: var(--white);
  }
  #tt-body-page {
    background: var(--white);
  }
}

.ver3#tt-body-search {
  background: var(--bg-color);
}

@keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/*Reset*/
ol, ul, li {
  margin: 0;
  padding: 0;
  list-style: none;
}

a {
  text-decoration: none;
  color: inherit;
}

figure {
  margin: 0;
}

button {
  background: none;
  border: none;
  font-family: var(--font-family);
}

input, textarea {
  font-family: var(--font-family);
}

/*Box*/
main {
  width: 100%;
  display: flex;
  margin: 0 auto;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  overflow: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
@media (max-width: 600px) {
  main {
    overflow-y: visible;
  }
}
main::-webkit-scrollbar {
  display: none;
}

.ver3 main{
  max-width: 800px;
  justify-content: center;
  background: var(--white);
}

.content {
  display: flex;
  position: relative;
  width: 100%;
  height: var(--height);
  padding: 0px;
  padding-left: 70px;
  overflow: hidden;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
@media (max-width: 600px) {
  .content {
    padding-left: 0;
    padding-top: 70px;
  }
  #tt-body-page .content {
    padding: 0px;
    padding-top: 70px;
  }
}
.content::-webkit-scrollbar {
  display: none;
}

.contentInner {
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
  width: 75%;
  height: var(--height);
  background-color: var(--white);
  padding: 40px;
  overflow-y: scroll;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
@media (max-width: 600px) {
  .contentInner {
    width: 100%;
    padding: 20px;
    height: auto;
  }
}
.contentInner::-webkit-scrollbar {
  display: none;
}

.ver3 .contentInner {
  width: 100%;
  height: auto;
}

#tt-body-page .contentInner {
  width: 100%;
  padding: 0;
}

.ver3 .content{
  padding: 0;
  padding-top: 70px;
}

/*header*/
header {
  z-index: 9999;
  position: fixed;
  top: 0;
  left: 0;
  bottom:0;
  width: 70px;
  height: var(--height);
  margin: 0 auto;
  padding: 20px 0;
  background-color: var(--white);
}
@media (max-width: 600px) {
  header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 70px;
    padding: 0 20px;
  }
}

header > div {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  height: 100%;
}
@media (max-width: 600px) {
  header > div {
    flex-direction: row;
    height: 70px;
  }
}

.ver1 header {
  background: linear-gradient(to left, var(--white), var(--main-color));
}
@media (max-width: 600px) {
  .ver1 header {
    background: linear-gradient(to top, var(--white), var(--main-color));
  }
}

.ver3 header {
  left: 0;
  right: 0;
  max-width: 800px;
  width: 100%;
  height: 70px;
  margin: 0 auto;
  z-index: 9999;
  padding: 0 40px;
}
@media (max-width: 600px) {
  .ver3 header {
    padding: 0 20px;
  }
}

.ver3 header > div {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

/* Menu Btn */
.openMenu {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  text-indent: -9999px;
  color: var(--font-color);
  cursor: pointer;
  font-weight: 900;
  font-size: 18px;
  font-family: serif;
  padding: 3px;
}

.ver1 .openMenu,
.ver3 .openMenu{
  border-radius: 50%;
  border: 1px solid var(--font-color);
  background: linear-gradient(to bottom, var(--white), var(--main-color));
}

#tt-body-page .openMenu {
  display: none;
}

.menu {
  opacity: 0;
}
@media (max-width: 600px) {
  .menu {
    opacity: 1;
  }
}

.ver3 .menu {
  opacity: 1;
}

.prev {
  display: none;
}

#tt-body-page .prev{
  display: flex;
}

/* Profile */
.profile a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  background: linear-gradient(to bottom, var(--white), var(--main-color));
  border-radius: 50%;
  border: 1px solid var(--font-color);
  box-sizing: content-box;
  cursor: pointer;
}

.profile img {
  width: 42px;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 50%;
  -webkit-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -ms-user-select: none;
}

/* blogTitle */
.blogTitle {
  display: none;
}

#tt-body-index .blogTitle {
  display: block;
}

#tt-body-index .blogTitle:empty {
  display: none;
}

/* pageTitle */
.pageTitle {
  margin-bottom: 40px;
  font-size: 24px;
  font-weight: bold;
  letter-spacing: -1px;
  word-break: break-all;
}

.ver3 .pageTitle {
  margin-top: -20px;
}

/*Cover*/
.cover {
  margin-bottom: 20px;
}

.coverTitle {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: -1px;
  word-break: break-all;
  margin-bottom: 40px;
}

.coverTitle:empty {
  margin-bottom: 0;
}

/*Cover list*/
.list_content img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.thumbnail_post + .link_post {
  display: none;
}

.link_post {
  aspect-ratio: 1 / 1;
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  padding: 20px;
  border: 1px solid #f3f3f3;
}

.tit_post {
  font-size: 13px;
  margin-bottom: 5px;
}

.link_post span {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 9;
  -webkit-box-orient: vertical;
}

/*Cover featured*/
.featured {
  word-break: break-all;
}

.featured-item {
  background: linear-gradient(to bottom, var(--white), var(--main-color));
  padding: 20px;
  border: 1px solid var(--font-color);
}

.featured-item + .featured-item {
  margin-top: 10px;
}

.featured .title + .desc {
  margin-top: 10px;
}

.featured img {
  width: 100%;
  border: 1px solid var(--font-color);
}

.featured img + div {
  margin-top: 10px;
}

@media (min-width: 1280px) {
  .featured-item {
    display: flex;
  }
  .featured-item img {
    width: 50%;
  }
  .featured-item img + div {
    margin-left: 20px;
  }
}

.featured .desc:empty {
  display: none;
}

/* List */
.list {
  display: flex;
  flex-direction: column;
  width: 100%;
  background: var(--white);
}
.list::-webkit-scrollbar {
  display: none;
}

.listItem {
  display: flex;
}

.summary {
  display: none;
}

/* Tumbnail Type1 */
.list.thumbnail-type ol {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(25%, 0.4fr));
  gap: 40px;
}

.list.thumbnail-type ol li {
  position: relative;
  aspect-ratio: 1 / 1;
}

.list.thumbnail-type img {
  width: 100%;
  aspect-ratio: 1 / 1;
  -o-object-fit: cover;
  object-fit: cover;
  border-width: 1px 1px 1px 1px;
}

.list.thumbnail-type .listDate {
  position: absolute;
  top: 5px;
  left: -5px;
  transform: rotateX(41deg);
  padding: 2px;
  font-weight: normal;
  font-size: 13px;
  display: none;
}

.list.thumbnail-type .listTitle {
  display: none;
}

@media (max-width: 836px) {
  .list.thumbnail-type ol {
    grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
    gap: 20px;
  }
  .list.thumbnail-type ol li {
    aspect-ratio: 16 / 9;
  }
  .list.thumbnail-type img {
    aspect-ratio: 16 / 9;
  }
}

/* List Type */
.list-type img {
  display: none;
}

.list-type ol{
  display: flex;
  flex-wrap: wrap;
}

.list-type li {
  width: 100%;
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--border-color);
}

.ver2 .list-type li,
.ver3 .list-type li {
  border-bottom: 1px solid var(--border-color);
}

.list-type .listItem {
  width: 100%;
  height: 100%;
}

.list-type .listInfo {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
}

.list-type .listDate {
  margin-bottom: 10px;
  font-weight: normal;
  font-size: 13px;
  background-color: var(--white);
  transform: rotateX(41deg);
}

.list-type .listTitle {
  font-size: 16px;
}

/* Thumbnail Type2 */
.thumbnail-type2 img {
  width: 35%;
  margin-left: 20px;
  object-fit: cover;
  aspect-ratio: 16 / 9;
}

.thumbnail-type2 ol{
  display: flex;
  flex-wrap: wrap;
}

.thumbnail-type2 li {
  width: 100%;
}

.thumbnail-type2 li:not(:last-child) {
  margin-bottom: 40px;
}

.thumbnail-type2 .listItem {
  flex-direction: row-reverse;
  justify-content: space-between;
  width: 100%;
  height: 100%;
}

.thumbnail-type2 .listInfo {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 60%;
}

.thumbnail-type2 .listTitle {
  font-size: 16px;
}

.thumbnail-type2 .listDate {
  font-weight: normal;
  font-size: 13px;
  margin-bottom: 10px;
  transform: rotateX(41deg);
}

@media (max-width: 600px) {
  .thumbnail-type2 img {
    width: 50%;
  }
  .thumbnail-type2 .listTitle {
    font-size: 14px;
  }
}

/* Protect */
.protected > img {
	display: none;
}

.protected .protectThumb {
	display: flex;
}

.protectThumb {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 35%;
  position: relative;
  display: none;
  overflow: hidden;
  aspect-ratio: 16 / 9;
}

.thumbnail-type2 .protectThumb {
  margin-left: 20px;
}

.thumbnail-type .protectThumb {
  aspect-ratio: 1 / 1;
  width: 100%;
  border: 1px solid #f3f3f3;
}

.list-type .protectThumb {
  display: none;
}

@media (max-width: 836px) {
  .thumbnail-type .protectThumb {
    aspect-ratio: 16/ 9;
  }
}

@media (max-width: 600px) {
  .protectThumb {
    width: 100%;
  }
}

.protectDate {
  display: none;
}

.protected .listDate {
  display: none;
}

.protected .protectDate {
  display: block;
}

.protectDate {
  background: linear-gradient(to left, var(--white), var(--main-color));
}

.list.thumbnail-type .protected .protectDate {
  display: block;
  top: 50%;
  left: 50%;
  transform: rotateX(41deg) translate(-50%, -50%);
}

.entryProtected {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  flex-direction: column;
  margin-bottom: 100px;
}
@media (max-width: 600px) {
  .entryProtected {
    margin-bottom: 200px;
  }
}

.protectForm {
  display: flex;
}

.entryProtected input[type="password"] {
  width: 100px;
  box-shadow: inset 1px 1px #a9a9a9;
  border: 1px solid var(--font-color);
  border-width: 0 0px 1px 0;
  padding: 6px 7px;
  line-height: 1;
  font-size: 10px;
  border-radius: 0;
  -webkit-box-shadow: inset 1px 1px #a9a9a9;
  -webkit-appearance:none;
}

.entryProtected input[type="button"] {
  font-weight: normal;
  border: none;
  cursor: pointer;
  border-radius: none 0!important;
  background: none 0;
  padding: 7px 7px;
  box-shadow: inset 1px 1px #a9a9a9;
  background: linear-gradient(to bottom, var(--white), var(--main-color));
  border: 1px solid var(--font-color);
  border-width: 0 1px 1px 0;
  color: var(--black);
  font-size: 10px;
  line-height: 1;
  border-radius: 0;
}

/* Notice */
#tt-body-page .entryNotice {
  padding: 40px;
}

.entryNotice {
  width: 100%;
  pointer-events: none;
}

.entryNotice .titleWrap {
  display: flex;
}

.entryNotice .container_postbtn {
  display: none;
}

.entryNotice .desc {
  margin-top: 20px;
}

.entryNotice + .entryNotice {
  border-top: 1px solid var(--border-color);
  padding-top: 20px;
  margin-top: 20px;
}

.entryNotice .date {
  font-size: 10px;
}

/* Article */
.article {
  display: flex;
  flex-direction: row-reverse;
  width: 100%;
  word-break: break-all;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
@media (max-width: 600px) {
  .article {
    flex-direction: column;
  }
}
.article::-webkit-scrollbar {
  display: none;
}

.article_info {
  width: 50%;
  height: var(--height);
  overflow-y: scroll;
  scrollbar-width: none;
  -ms-overflow-style: none;
  background-color: var(--bg-color);
}
@media (max-width: 600px) {
  .article_info {
    width: 100%;
    height: auto;
    overflow-y: visible;
    background-color: var(--white);
  }
}
.article_info::-webkit-scrollbar {
  display: none;
}

.article_info > div {
  padding: 40px;
}

.article_info > div > div > h4 {
  letter-spacing: -0.8px;
  font-size: 14px;
}

.article_info > div > div > p,
.article_info > div > div > a {
  display: block;
  font-size: 13px;
  margin-top: 10px;
}

.article_info > div > div:not(:first-child) {
  margin-top: 40px;
}

@media (max-width: 600px) {
  .article_info > div {
    padding-top: 20px;
  }
  .article_info > div > div > p,
  .article_info > div > div > a {
    font-size: 11px;
  }
}

.ver1 .article_info {
  background: linear-gradient(to left, var(--white), var(--main-color));
}
@media (max-width: 600px) {
  .ver1 .article_info {
    width: 100%;
    border-left: none;
    background: none;
  }
}

.ver3 .article_info {
  background-color: white;
}

.article_content {
  width: 75%;
  height: var(--height);
  padding: 40px;
  background: var(--white);
  overflow-y: scroll;
  font-size: 14px;
  line-height: 1.4;
}

.article_content > div {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
@media (max-width: 600px) {
  .article_content {
    width: 100%;
    padding: 0;
    overflow-y:visible;
    height: auto;
  }
  .article_content > div > div > *:not(figure) {
    padding: 0 20px;
  }
  .container_postbtn {
    padding: 35px 20px!important;
  }
}
.article_content::-webkit-scrollbar {
  display: none;
}

.ver3 .article {
  flex-direction: column;.ver3 .article_info
}

.ver3 .article_content,
.ver3 .article_info {
  width: 100%;
}

.ver3 .article_info {
  height: auto;
  overflow-y: visible;
  padding: 0;
}
@media (max-width: 600px) {
 .ver3 .article_info {
    padding: 0;
  }
}

.ver3 .article_content {
  height: auto;
  overflow-y: visible;
  padding: 0;
}

.ver3 .article_content > div > div > *:not(figure, button) {
  padding: 0 20px;
}

.ver3 .container_postbtn {
  padding: 35px 20px!important;
}

/* Taglog */
.taglog {
  width: 100%;
}
@media (max-width: 600px) {
  .taglog {
    width: 100%;
  }
}

.taglog ul {
  display: flex;
  flex-wrap: wrap;
}

.taglog ul li a {
  display: inline-block;
  font-size: 14px;
  margin-right: 16px;
  margin-bottom: 16px;
  font-weight: 300;
  background: var(--white);
  transition: background-color 0.5s ease-in-out;
}

.taglog ul li a:hover {
  background-color: var(--main-color);
}

/* Copyright */
.copyright {
  z-index: 99998;
  position: fixed;
  right: 20px;
  bottom: 20px;
  -webkit-writing-mode: vertical-lr;
  -ms-writing-mode: tb-lr;
  writing-mode: vertical-lr;
}

@media (max-width: 600px) {
 .copyright {
   font-size: 10px;
 }
  #tt-body-page .copyright, 
  #tt-body-page .object {
    display: none;
  }
}

/* Object */
.object {
  display: none;
  z-index: 99999;
  position: fixed;
  right: 30px;
  bottom: 1%;
  width: 100px;
  pointer-events: none;
}

@media (max-width: 600px) {
  .object {
    width: 100px;
  }
}

.objectDisplay {
  display: block;
}

/* Side 1 */
#tt-body-page .side {
  display: none;
}
.side::-webkit-scrollbar {
  display: none;
}

.side {
  display: block;
  width: 50%;
  background: var(--bg-color);
  overflow-y: scroll;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

@media (max-width: 600px) {
  .side {
    display: none;
    position: absolute;
    right: 0;
    bottom:0;
    width: 100%;
    height: calc( var(--height) - 70px);
    z-index: 9999;
  }
  .open {
    display: block;
  }
}

.ver1 .side {
  background: linear-gradient(to left, var(--white), var(--main-color));
}
@media (max-width: 600px) {
  .ver1 .side {
    background: linear-gradient(to bottom, var(--white), var(--main-color));
    border-left: none;
  }
}

.ver3 .side {
  display: none;
  width: 70%;
  background: linear-gradient(to bottom, var(--white), var(--main-color));
  position: absolute;
  right: 0;
  bottom:0;
  z-index: 9999;
  height: calc( var(--height) - 70px);
}
@media (max-width: 600px) {
  .ver3 .side {
    width: 100%;
  }
}

.ver3 .side.open {
  display: block;
}

/* Category */
.link_tit, .c_cnt {
  display: none!important;
}

.category {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 20px;
  font-size: 10px;
  text-align: center;
}
@media (max-width: 600px) {
  .category {
    padding: 20px;
  }
}

.category_list {
  display: flex;
  flex-wrap: wrap;
}

.category li {
  display: flex;
  align-items: flex-start;
}

.category a {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  width: 70px;
  margin-bottom: 20px;
  word-break: break-all;
}

.category ul > li > ul > li > ul {
  display: flex;
  flex-wrap: wrap;
}

.category .ac-toggle {
  display: none;
}

.ac-category {
  width: 100%;
}

.sns {
  display: flex;
  margin-top: auto;
  flex-wrap: wrap;
}

.sns svg {
  display: none;
}

.side2 .sns svg {
  display: inline-block;
}

.category .twitter,
.category .asked {
  display: none!important;
}

.category .twitterDisplay,
.category .askedDisplay {
  display: flex!important;
}

/* Search */
#tt-body-search .list > .pageTitle {
  display: none;
}

.search {
  display: none;
  margin-bottom: 40px;
}

.search input[type="text"] {
  width: 50%;
  box-shadow: inset 1px 1px #a9a9a9;
  -webkit-box-shadow: inset 1px 1px #a9a9a9;
  -webkit-appearance:none;
  border: 1px solid var(--font-color);
  border-width: 0 0px 1px 0;
  padding: 7px 5px;
}
@media (max-width: 600px) {
  .search input[type="text"] {
    width: 100%;
  }
}

.search input[type="button"] {
  background: none;
  padding: 7px;
  box-shadow: inset 1px 1px #a9a9a9;
  background: linear-gradient(to bottom, var(--white), var(--main-color));
  border: 1px solid var(--font-color);
  border-width: 0 1px 1px 0;
  color: var(--black);
}

.search input {
  border-radius: 0;
  border: none 0;
  outline: none;
}

#tt-body-search .search {
  display: flex;
}

/* Paging */
.paging {
  width: 80%;
  margin-top: auto;
  padding:80px 0 40px;
}

.paging .selected {
  font-weight: 900;
}

.paging .num span {
  padding: 10px;
  display: inline-block;
}

/* Side 2 */
.side2 .category {
  padding: 40px;
  text-align: left;
  font-size: 13px;
}

.side2 .ac-toggle {
  display: block;
  cursor: pointer;
  font-weight: bolder;
}

.side2 .ac-toggle::after {
  display: inline-block;
  content: "+";
  transition: all 0.3s ease-in-out;
}

.side2 .expanded .ac-toggle::after {
  opacity: 0;
}

.side2 .category a::before {
  display: none;
}

.side2 .category a {
  display: block;
  width: auto;
  letter-spacing: 0;
}

.side2 .category li {
  display: block;
}

.side2 .category ul > li > ul > li > ul {
  display: block;
}

.side2 .category_list {
  display: block;
}

.side2 .sns a {
  font-weight: normal;
  font-size: 13px;
  background: linear-gradient(to bottom, var(--white), var(--main-color));
  border: 1px solid var(--font-color);
  margin-right: 10px;
  padding: 2px 7px 3px;
  border-radius: 20px;
  flex-direction: row;
  letter-spacing: -0.8px;
}

.category > div > h4 {
  display: none;
  letter-spacing: -0.8px;
  font-size: 14px;
  margin-bottom: 20px;
  font-weight: 400;
  border: 1px solid var(--font-color);
  transform: rotateX(41deg);
  padding: 2px 4px 3px;
  border-radius: 20px;
  background: linear-gradient(to bottom, var(--white), var(--main-color));
}

.side2 .category > div > h4 {
  display: inline-block;
}

.side2 .category_list {
  font-size: 13px;
}

.side2 .category ul > li > ul > li > ul {
  display: none;
}

.side2 .openHome {
  display: none;
}

/* Guestbook */
.message {
  word-break: break-all;
}

.guestbookBox {
  width: 100%;
}
@media (max-width: 600px) {
  .guestbookBox {
    width: 100%;
  }
}
.guestbookBox::-webkit-scrollbar {
  display: none;
}

.ver3 .guestbookBox {
  width: 100%;
}

.guestbook {
	position: relative;
  display: flex;
  flex-direction: column;
  background: var(--white);
}

.openMenu.write {
  display: none;
}

.guestWriteBtn {
  cursor: pointer;
  padding: 2px 4px;
  font-weight: normal;
  font-size: 14px;
  background-color: var(--white);
  border: 1px solid var(--font-color);
  transform: rotateX(41deg);
  border-radius: 20px;
  background: linear-gradient(to bottom, var(--white), var(--main-color));
}

.guestbook .pageTitle {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* Guestlist */
.guestList {
	position: relative;
  width: 100%;
  font-size: 13px;
}
@media (max-width: 600px) {
  .guestList {
    font-size: 12px;
  }
}

.guestList ol {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	justify-content: space-between;
}

.guestList li {
	width:100%;
	word-break: break-all;
}

.guestList ol > li {
	padding: 30px 0px;
}

.guestList ol > li:not(:first-child) {
	border-top: 1px solid var(--border-color);
}

.ver2 .guestList ol > li:not(:first-child),
.ver3 .guestList ol > li:not(:first-child) {
	border-top: 1px solid var(--border-color);
}

.guestList ol > li:first-child {
  padding-top: 0;
}

.guestList ol > li > ul {
	margin-top: 20px;
}

.guestList ol > li > ul > li {
	width: 100%;
	padding-left: 10px;
	border-bottom: 0;
}

.guestList ol > li > ul > li + li {
	margin-top: 10px;
}

.guestList .message {
	margin-top: 10px;
	line-height: 1.4;
	letter-spacing: 0;
}

.guestList .name {
	margin-right: 5px;
	font-weight: bolder;
}

.guestList .control {
	display: inline-block;
	vertical-align: text-bottom;
	float: right;
}

.guestList .control a {
	display: inline-block;
	padding: 4px;
	line-height: 1;
}

.guestList .control a:first-child {
	vertical-align: super;
}

.guestList ol > li > div > .name {
	line-height: 1;
  transform: rotateX(41deg);
}

.tistoryProfileLayerTrigger {
  display: none;
}

/* Guestwrite */
.guestWrite {
  display: none;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  background: var(--white);
}

.guestWrite.open {
  display: flex;
}

.guestWriteBox {
  background-color: var(--white);
  box-shadow: inset 1px 1px #a9a9a9;
  border: 1px solid var(--font-color);
  border-width: 0 1px 1px 0;
  margin-bottom: 40px;
}

.guestWriteBox > div {
  padding: 20px;
}

.guestWriteBox h4 {
  font-size: 12px;
  margin-bottom: 10px;
}

.guestWrite input[type=text],  
.guestWrite input[type=password] {
	width: 100%;
	border-radius: 0;
	font-size: 11px;
	border: none 0;
}

.guestWrite input[type=password] {
	border-left: none;
	border-right: none;
}

.guestWrite textarea {
	width: 100%;
	min-height: 60px;
	border-radius: 0;
	resize: none;
	background: none;
  border: none 0;
  font-size: 11px;
}

textarea.auto {
	overflow-y: hidden;
}

.guestWriteInfo {
	display: flex;
	padding: 15px 0;
}

.guestWriteInfo span {
	padding: 5px;
}

.guestWrite input[type=submit] {
	font-weight: normal;
	border: none;
	cursor: pointer;
	border-radius: 0!important;
  background: none 0;
  padding: 7px 7px;
  box-shadow: inset 1px 1px #a9a9a9;
  background: linear-gradient(to bottom, var(--white), var(--main-color));
  border: 1px solid var(--font-color);
  border-width: 0 1px 1px 0;
  color: var(--black);
  font-size: 10px;
  line-height: 1;
}

.guestWriteSend {
  display: flex;
  align-items: center;
  justify-content: flex-end;
	width: 100%;
}

.guestSecret {
	position: relative;
	transition: 0.3 ease-in-out;
  padding-bottom: 0!important;
}

.guestSecret label {
  position: relative;
  display: inline-block;
  width: 47px;
  cursor: pointer;
  font-size: 10px;
  border-radius: 50px;
  padding: 4px 0 3px;
  text-align: center;
  background: var(--bg-color);
  border: 1px solid #646464;
}

#guestsecret {
	display: none;
}

#guestsecret:checked ~ label {
  background: linear-gradient(to bottom, var(--white), var(--main-color));
}

.ver3 .guestbook > div {
  width: 100%;
}

/* Comment */
.commentBox {
  width: 100%;
}
.article_content + .commentBox {
  padding: 20px;
}

.comment > h4 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  margin-bottom: 40px;
}

.comment > h4 .writeBtn {
  cursor: pointer;
  padding: 2px 4px;
  font-weight: normal;
  font-size: 14px;
  background-color: var(--white);
  border: 1px solid var(--font-color);
  transform: rotateX(41deg);
  border-radius: 20px;
  background: linear-gradient(to bottom, var(--white), var(--main-color));
}

.commentList .name {
  font-weight: bolder;
}

.commentList .message {
  margin-top: 10px;
  line-height: 1.4;
  letter-spacing: 0;
}

.commentList li {
  width: 100%;
  word-break: break-all;
}

.commentList ol > li {
  padding: 20px 0px;
}

.commentList ol > li:first-child {
  padding-top: 0;
}

.commentList ol > li > ul {
  margin-top: 20px;
}

.commentList ol > li > ul > li {
  width: 100%;
  padding-left: 10px;
  border-bottom: 0;
}

.commentList ol > li > ul > li + li {
    margin-top: 10px;
}

.commentList ol > li:not(:first-child) {
  border-top: 1px solid var(--border-color);
}

.commentList .control {
  display: inline-block;
  vertical-align: text-bottom;
  float: right;
}

.commentWrite {
  display: none;
  padding: 20px;
  margin-bottom: 40px;
  background-color: var(--white);
  box-shadow: inset 1px 1px #a9a9a9;
  border: 1px solid var(--font-color);
  border-width: 0 1px 1px 0;
}
.commentWrite.open {
  display: block;
}

.commentWrite div + div {
  margin-top: 20px;
}

.commentSecret {
	position: relative;
	transition: 0.3 ease-in-out;
  padding-bottom: 0!important;
}

.commentSecret label {
  position: relative;
  display: inline-block;
  width: 47px;
  cursor: pointer;
  font-size: 10px;
  border-radius: 50px;
  padding: 4px 0 3px;
  text-align: center;
  background: var(--bg-color);
  border: 1px solid #646464;
}

#commentSecret {
	display: none;
}

#commentSecret:checked ~ label {
  background: linear-gradient(to bottom, var(--white), var(--main-color));
}

.commentWrite textarea {
  width: 100%;
  min-height: 60px;
  border-radius: 0;
  resize: none;
  background: none;
  border: none 0;
  font-size: 11px;
}

.commentWrite input[type=submit] {
  font-weight: normal;
  border: none;
  cursor: pointer;
  border-radius: 0!important;
  background: none 0;
  padding: 7px 7px;
  box-shadow: inset 1px 1px #a9a9a9;
  background: linear-gradient(to bottom, var(--white), var(--main-color));
  border: 1px solid var(--font-color);
  border-width: 0 1px 1px 0;
  color: var(--black);
  font-size: 10px;
  line-height: 1;
}

.commentWrite input[type=text], .commentWrite input[type=password] {
  border-radius: 0;
  font-size: 11px;
  border: none 0;
}

.commentWrite h4 {
  font-size: 12px;
  margin-bottom: 10px;
}

/* postbtn */
.bundle_ccl {
  display: none!important;
}

.postbtn_ccl, 
.btn_share {
	display: none;
}

.container_postbtn .postbtn_like {
	border: none 0!important;
	padding: 0!important;
}

.uoc-icon {
	padding: 0 2px 0 0!important;
}

.container_postbtn .btn_post {
	outline: none;
}

.container_postbtn .btn_post .ico_etc {
	background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-more-horizontal'%3E%3Ccircle cx='12' cy='12' r='1'%3E%3C/circle%3E%3Ccircle cx='19' cy='12' r='1'%3E%3C/circle%3E%3Ccircle cx='5' cy='12' r='1'%3E%3C/circle%3E%3C/svg%3E");
	background-position: center!important;
	width: 16px!important;
	height: 16px!important;
	background-size: cover!important;
}

.container_postbtn .btn_post .ico_like {
	background-image: url("data:image/svg+xml,%0A%3Csvg width='12' height='12' viewBox='0 0 12 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.4457 1.97011C10.1903 1.71918 9.8871 1.52012 9.55337 1.3843C9.21964 1.24849 8.86194 1.17859 8.5007 1.17859C8.13945 1.17859 7.78175 1.24849 7.44802 1.3843C7.11429 1.52012 6.81107 1.71918 6.55569 1.97011L6.02569 2.49065L5.49569 1.97011C4.97985 1.46348 4.28021 1.17885 3.55069 1.17885C2.82118 1.17885 2.12154 1.46348 1.60569 1.97011C1.08985 2.47675 0.800049 3.16389 0.800049 3.88038C0.800049 4.59687 1.08985 5.28401 1.60569 5.79065L2.13569 6.31118L6.02569 9.82145L9.91569 6.31118L10.4457 5.79065C10.7012 5.53983 10.9039 5.24203 11.0422 4.91426C11.1804 4.58649 11.2516 4.23517 11.2516 3.88038C11.2516 3.52559 11.1804 3.17427 11.0422 2.8465C10.9039 2.51873 10.7012 2.22093 10.4457 1.97011Z' fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
	background-position: center!important;
	background-repeat: no-repeat!important;
	background-size: auto!important;
	margin: 2px 4px 0 0!important;
}

.container_postbtn .btn_post .like_on .ico_like {
	background-image: url("data:image/svg+xml,%0A%3Csvg width='12' height='12' viewBox='0 0 12 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.4457 1.97011C10.1903 1.71918 9.8871 1.52012 9.55337 1.3843C9.21964 1.24849 8.86194 1.17859 8.5007 1.17859C8.13945 1.17859 7.78175 1.24849 7.44802 1.3843C7.11429 1.52012 6.81107 1.71918 6.55569 1.97011L6.02569 2.49065L5.49569 1.97011C4.97985 1.46348 4.28021 1.17885 3.55069 1.17885C2.82118 1.17885 2.12154 1.46348 1.60569 1.97011C1.08985 2.47675 0.800049 3.16389 0.800049 3.88038C0.800049 4.59687 1.08985 5.28401 1.60569 5.79065L2.13569 6.31118L6.02569 9.82145L9.91569 6.31118L10.4457 5.79065C10.7012 5.53983 10.9039 5.24203 11.0422 4.91426C11.1804 4.58649 11.2516 4.23517 11.2516 3.88038C11.2516 3.52559 11.1804 3.17427 11.0422 2.8465C10.9039 2.51873 10.7012 2.22093 10.4457 1.97011Z' fill='%23f15757' stroke='%23000' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
}

.article .container_postbtn .btn_post .txt_like {
	font-family: var(--font-family)!important;
	font-size: 11px!important;
	margin: 0!important;
	color: var(--black)!important;
}

/* fileblock */
#tt-body-page figure.fileblock a::after {
	display: none;
}

#tt-body-page figure.fileblock {
	border-radius: 0;
	font-size: 12px;
	width: 250px;
  height: auto;
	border: none 0;
  box-shadow: inset 1px 1px #a9a9a9;
  border: 1px solid var(--font-color);
  border-width: 0 1px 1px 0;
  background: linear-gradient(to bottom, var(--white), var(--main-color));
}

#tt-body-page figure.fileblock .desc {
	position: static!important;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#tt-body-page figure.fileblock .filename {
	margin: 0!important;
  height: auto;
  width: 70%;
  font-size: 12px;
}

#tt-body-page figure.fileblock .name {
  height: auto;
}

#tt-body-page figure.fileblock .size {
	margin: 0;
  font-size: 10px;
}

#tt-body-page figure.fileblock .image {
	display: none;
}

#tt-body-page figure.fileblock a {
  height: auto!important;
  padding: 13px 16px;
}

#tt-body-page figure.fileblock .name {
  max-width: none;
  line-height: 1;
}

/* blockquote */
#tt-body-page blockquote[data-ke-style='box'], blockquote[data-ke-style='style3'], #tt-body-page blockquote[data-ke-style='style3'] {
	background-color: var(--white);
}

#tt-body-page.ver3 blockquote {
  margin: 20px!important;
}

/* code */
code {
	font-family: var(--font-family);
}

/* moreless */
.btn-toggle-moreless {
	font-family: var(--font-family)!important;
  font-size: 12px!important;
}

.btn-toggle-moreless::after {
	content: "";
	display: inline-block;
	vertical-align: middle;
	width: 10px;
	height: 10px;
	background-size: cover;
	background-position: center;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23909090' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
}

.moreless-content {
	padding: 8px;
	border-left: 3px solid var(--main-color);
}

/*slick*/
.slick-slider {
  padding: 0 22px;
}

.slick-slide {
  margin: 20px;
}

.slick-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  text-indent: -9999px;
  cursor: pointer;
}

.slick-prev {
  z-index: 3;
  left: 0px;
  width: 32px;
  height: 32px;
  background: linear-gradient(to top, var(--white), var(--main-color));
  border-radius: 50%;
  border: 1px solid var(--font-color);
}

.slick-prev::before {
  z-index: 2;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1' stroke-linecap='round' stroke-linejoin='round' class='feather feather-arrow-left'%3E%3Cline x1='19' y1='12' x2='5' y2='12'%3E%3C/line%3E%3Cpolyline points='12 19 5 12 12 5'%3E%3C/polyline%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 50%;
}

.slick-next {
  z-index: 3;
  right: 0px;
  width: 32px;
  height: 32px;
  background: linear-gradient(to top, var(--white), var(--main-color));
  border-radius: 50%;
  border: 1px solid var(--font-color);
}

.slick-next::before {
  z-index: 2;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 50%;
  background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1' stroke-linecap='round' stroke-linejoin='round' class='feather feather-arrow-right'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3Cpolyline points='12 5 19 12 12 19'%3E%3C/polyline%3E%3C/svg%3E");
}