@charset "utf-8";
#body,
#body input {
   font-size: 12px;
}
#body input::placeholder {
   color: #aaa;
}
#body button,
#body select {
   font-family: unset;
}
#body .ui-btn.sm {
   height: 20px;
   line-height: 5px;
   padding: 7px;
   font-size: 12px;
}
#body *::-webkit-scrollbar-thumb {
   -webkit-box-shadow: none;
   border-radius: unset;
}
#body *::-webkit-scrollbar-track {
   background-color: transparent;
   box-shadow: unset;
}

#body .article-container {
   animation: fadeInUp;
   animation-duration: 0.4s;
   animation-timing-function: ease-out;
}
#body .theme-header {
   display: flex;
   align-items: center;
   justify-content: end;
   padding: 4px 10px;
}
#body .theme-header > *:not(:last-child) {
   margin-right: 5px;
}

#body .theme-header .cate {
   flex: 1;
}
.board-notice {
   width: 264px;
   padding: 10px;
   margin: 0 auto;
   text-align: center;
   box-sizing: border-box;
}

.avocado-list {
   display: block;
   position: relative;
   margin: 0;
   padding: 0;
}

.avocado-list li {
   display: flex;
   position: relative;
   padding: 15px;
   margin-bottom: 15px;
   max-height: 200px;
}
.avocado-list li > div {
   padding: 0 10px;
   overflow-y: auto;
   flex: 0 0 100%;
   box-sizing: border-box;
}
.avocado-list li .img-box {
   display: flex;
   align-items: center;
   justify-content: center;
   flex: 35% 0 0;
}
.avocado-list li .img-box img {
   max-height: 100%;
}
.avocado-list li .subject {
   font-size: 16px;
}
.avocado-list li .tag {
   margin: 5px 0;
}
.avocado-list li.bo_notice {
}
.avocado-list li.no-data {
   text-align: center;
   line-height: 200px;
}

.bo_fx {
   position: relative;
   padding: 20px 0;
}
.bo_fx .chk_all {
   position: absolute;
   left: 5px;
   top: 20px;
}

.board-category {
   display: block;
   position: relative;
   margin-bottom: 10px;
}

@media all and (max-width: 640px) {
   #bo_v_con * {
      max-width: 100%;
   }

   .board-category {
      display: block;
      width: 100%;
      box-sizing: border-box;
      padding: 0 10px;
   }
   .board-category select {
      width: 100%;
   }

   .bo_fx {
      display: block;
      width: 100%;
      box-sizing: border-box;
      padding: 20px 10px !important;
   }
   .bo_fx a {
      display: block;
      width: 100%;
   }
}

.board-write {
   padding: 0 10px;
}

.board-write h3 {
   font-size: 26px;
   text-align: center;
   padding: 30px 0 20px;
}
.board-write .write-notice {
   padding: 10px;
   font-size: 11px;
}
.board-write > dl {
   position: relative;
}
.board-write > dl > dt {
   width: 70px;
   position: absolute;
   line-height: 32px;
   text-align: center;
}
.board-write > dl > dd {
   width: 100%;
   margin-left: 0;
   padding-left: 80px;
   box-sizing: border-box;
   line-height: 32px;
}
.board-write input.frm_input.full {
   width: 100%;
   display: block;
   margin: 1px 0;
}

.board-viewer.theme-box {
   display: block;
   position: relative;
   padding: 20px;
}

.board-viewer .subject {
   text-align: center;
}
.board-viewer .subject em {
   display: block;
   position: relative;
   font-size: 14px;
   line-height: 1.2em;
   padding-bottom: 10px;
}
.board-viewer .subject strong {
   display: block;
   position: relative;
   font-size: 22px;
   line-height: 1.2em;
}

.board-viewer .info {
   margin-top: 20px;
   padding: 8px 10px;
   text-align: center;
}
.board-viewer .info span {
   display: inline-block;
   opacity: 0.8;
}
.board-viewer .info span + span:before {
   content: '';
   display: inline-block;
   width: 1px;
   height: 8px;
   vertical-align: middle;
   margin: 0 10px;
}

.board-viewer .contents {
   display: block;
   position: relative;
   margin: 20px 0;
   padding: 40px 15px;
   border-left-width: 0;
   border-right-width: 0;
}

#bo_v_bot {
   padding: 20px 0;
   overflow: hidden;
}
.bo_v_nb {
   float: left;
}
.bo_v_com {
   float: right;
}

.board-comment-list {
   position: relative;
}
.board-comment-list .co-line {
   display: block;
   position: relative;
   clear: both;
   width: 100%;
   height: 1px;
   margin: 0;
   padding: 0;
   border: none;
}
.board-comment-list .item {
   position: relative;
   padding: 10px 10px 10px 100px;
}
.board-comment-list .co-name {
   position: absolute;
   top: 0px;
   left: 0;
   bottom: 0;
   width: 90px;
   padding: 10px 10px;
   box-sizing: border-box;
}
.board-comment-list .co-info {
   display: block;
   text-align: right;
   padding-top: 15px;
   font-size: 11px;
   opacity: 0.7;
}
.board-comment-list .co-info span {
   display: inline-block;
   opacity: 0.8;
}
.board-comment-list .co-info span + span:before {
   content: '';
   display: inline-block;
   width: 1px;
   height: 8px;
   vertical-align: middle;
   margin: 0 10px;
}

.board-comment-list .item.reply {
   border-left: 5px solid rgba(255, 255, 255, 0.1);
}
.board-comment-list .item.reply .co-name {
   background: none;
}

.board-comment-list + .board-comment-write {
   margin-top: 20px;
}

.board-comment-form {
   position: relative;
   padding-right: 80px;
}
.board-comment-form .btn_confirm {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 29px;
   width: 80px;
}
.board-comment-form .btn_confirm .ui-btn {
   width: 100%;
   height: 100%;
}
.board-comment-form p {
   margin: 0;
   padding: 5px 10px;
}
.board-comment-form textarea {
   display: block;
   height: 100px;
   resize: none;
   border: none;
}

.link_hash_tag {
   font-size: 11px;
   position: relative;
   padding: 1px 4px;
   filter: drop-shadow(0px 0px 1px rgba(0, 0, 0, 0.3));
   transition-duration: 0.2s;
}

@media all and (max-width: 640px) {
}
