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

#header-container {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 90px;
  /*background-color: #00a1e4;*/
  background-color: #fff;
  /*color: #fff;*/
  z-index: 100;
}

#header-container h2 {
  position: relative;
  top: 0px;
  left: 20px;
  font-size: 1.5em;
  font-weight: bold;
}

#header-container-no-top {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 0px;
  background-color: #fff;
  z-index: 100;
}

#menu-container {
  position: fixed;
  top: 85px;
  left: 0px;
  width: 100%;
  height: 30px;
  padding-left: 20px;
  padding-top: 5px;
  box-sizing: border-box;
  background-color: #3a3b40;
  z-index: 200;
  -webkit-transition: padding-left 200ms linear;
  -moz-transition: padding-left 200ms linear;
  -ms-transition: padding-left 200ms linear;
  -o-transition: padding-left 200ms linear;
  transition: padding-left 200ms linear;
}

#menu-container.fixed {
  padding-left: 120px;
  opacity: 0.95;
  -webkit-box-shadow: 0 1px 5px 1px rgba(0, 0, 0, 0.2);
  box-shadow: 0 1px 5px 1px rgba(0, 0, 0, 0.2);
}

#menu-container .menu-item {
  font-size: 1.1em;
  font-weight: normal;
  color: #fff;
}

#menu-container .menu-icon {
  display: block !important;
  position: absolute;
  left: -100px;
  /*top: 14px;*/
  font-size: 1.1em;
  font-weight: normal;
  color: #fff;
  -webkit-transition: left 300ms linear;
  -moz-transition: left 300ms linear;
  -ms-transition: left 300ms linear;
  -o-transition: left 300ms linear;
  transition: left 300ms linear;
}

#menu-container .menu-icon.on {
  left: 15px;
}

#menu-container a:visited {
  color: #ffffff;
}

#menu-container a:link {
  color: #ffffff;
}

/*#blog-container {*/

/*margin-top:130px;*/

/*padding: 20px;*/

/*padding-left: 70px;*/

/*}*/

/* schedule*/

input.sch_radio {
  margin: 0px;
}

input[type='radio'] {
  margin: 0px;
}

/* help */

img.help {
  padding-top: 10px;
  padding-bottom: 10px;
  width: 96%;
  max-width: 500px;
}

img.help_half {
  padding-top: 10px;
  padding-bottom: 10px;
  width: 96%;
  max-width: 250px;
}

/* relation */

th.rel {
  text-align: center;
}

div.page_nav {
  text-align: center;
}

/* 정보 없음 */

i.c_pre {
  color: #655a61;
}

i.c_na {
  color: #cccccc;
}

i.c_unlink {
  color: #888888;
}

i.c_pair {
  color: #fa6a09;
}

/*나를 팔로잉 - 나의 팔로워*/

i.c_follower {
  color: #2879e4;
}

/*내가 팔로잉*/

i.c_following {
  color: #30b07f;
}

/* 앱 가입 버튼 */

div.small_grid {
  padding: 0px 10px 0px 0px;
}

button.small_grid {
  margin-left: 10px;
  margin-right: 10px;
  padding: 4px 12.5px 4px 12.5px;
}

button.small {
  margin: 0px;
  padding: 6px 12.5px 6px 12.5px;
}

button.small_v {
  width: 100%;
  /*margin:0px;*/
  margin-left: 10px;
  margin-right: 10px;
  padding: 6px 0px 6px 0px;
}

/**
    table default
 */

.table_noborder td,
.table_noborder th {
  border: 1px solid #e2e2e2 !important;
  border-left: 1px solid #e2e2e2 !important;
  border-right: 1px solid #e2e2e2 !important;
}

/** table mouse over */

.mytable {
  /*background-color: #b7b7b7;*/
  font-weight: normal;
}

.mytable:hover {
  background-color: rgba(103, 195, 168, 0.47);
}

.table_noborder2 td,
.table_noborder2 th {
  border: 0px solid #e2e2e2 !important;
  border-left: 0px solid #e2e2e2 !important;
  border-right: 0px solid #e2e2e2 !important;
}

/* tag style */

/*
 * ----------------------------------------
 */

/* join app tag */

#post-list-section {
  padding: 0;
}

.isMobile #post-list-section {
  padding-bottom: 54px;
}

/* @ tag */

#post-list-section .tag-section {
  background: #eee;
}

#post-list-section .tag-section .tag-filter-list {
  color: #000000;
  font-size: 16px;
  height: 24px;
  padding: 4px 15px 0 15px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#post-list-section .tag-section .tag-filter-list > span {
  display: inline-block;
}

#post-list-section .tag-section .tag-filter-list #stag_filter {
  vertical-align: middle;
}

#post-list-section .tag-section .tag-filter-list #filter_text {
  margin-right: 10px;
  padding-left: 17px;
  position: relative;
  vertical-align: middle;
}

#post-list-section .tag-section .tag-filter-list #filter_text:before {
  position: absolute;
  left: 8px;
  content: '';
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  height: 100%;
  display: block;
  background: #ffc4be;
  width: 1px;
}

#post-list-section .tag-section .tag-list {
  padding: 5px 8px 5px 8px;
  overflow: hidden;
  max-height: 70px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 1;
}

#post-list-section .tag-section .tag-list .tag-desc {
  float: left;
  /*border:1px solid #fe6658;*/
  margin: 5px 2px 5px 2px;
  padding: 3px 10px 0 10px;
  font-size: 14px;
  font-weight: 500;
  background: #fe574a;
  -webkit-border-radius: 10px;
  /*border-radius:10px;*/
  color: #fff;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  height: 22px;
  overflow: hidden;
}

#post-list-section .tag-section .tag-list .tag-desc2 {
  float: left;
  /*border:1px solid #fe6658;*/
  margin: 5px 2px 5px 2px;
  padding: 3px 10px 0 10px;
  font-size: 14px;
  font-weight: 500;
  background: #fff;
  -webkit-border-radius: 10px;
  /*border-radius:10px;*/
  color: #9a9a9a;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  height: 22px;
  overflow: hidden;
}

#post-list-section .tag-section .tag-list .tag-desc-popular {
  float: left;
  /*border:1px solid #fe6658;*/
  margin: 5px 2px 5px 2px;
  padding: 3px 10px 0 10px;
  font-size: 14px;
  font-weight: 500;
  background: #fff;
  -webkit-border-radius: 10px;
  /*border-radius:10px;*/
  color: #5cc3a7;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  height: 22px;
  overflow: hidden;
}

#post-list-section .tag-section .tag-list .tag-item {
  float: left;
  border: 1px solid #fe6658;
  margin: 5px 2px 5px 2px;
  padding: 3px 10px 0 10px;
  font-size: 14px;
  font-weight: 500;
  background: #fff;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  color: #fe6658;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  height: 22px;
  overflow: hidden;
}

#post-list-section .tag-section .tag-list .tag-item2 {
  float: left;
  border: 1px solid #86bde4;
  margin: 5px 2px 5px 2px;
  padding: 3px 10px 0 10px;
  font-size: 14px;
  font-weight: 500;
  background: #fff;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  color: #86bde4;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  height: 22px;
  overflow: hidden;
}

#post-list-section .tag-section .tag-list .tag-item-popular {
  float: left;
  border: 1px solid #5cc3a7;
  margin: 5px 2px 5px 2px;
  padding: 3px 10px 0 10px;
  font-size: 14px;
  font-weight: 500;
  background: #fff;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  color: #5cc3a7;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  height: 22px;
  overflow: hidden;
}

li.ui-field-contain.right_button {
  display: flex;
  align-items: center; /* 요소들을 수직 방향으로 중앙에 위치시킵니다. */
  justify-content: space-between; /* 요소들 사이에 공간을 균등하게 배분합니다. */
}

li.ui-field-contain.right_button label {
  flex: 1; /* label 요소가 차지할 수 있는 공간을 최대한 활용하도록 합니다. */
  flex-basis: 23%; /* label 요소의 기본 크기를 20%로 설정 */
}

li.ui-field-contain.right_button input {
  flex: 1; /* input과 button 요소가 차지할 수 있는 공간을 조정합니다. */
  flex-basis: 40%; /* label 요소의 기본 크기를 20%로 설정 */
}
li.ui-field-contain.right_button button {
  flex: 1; /* input과 button 요소가 차지할 수 있는 공간을 조정합니다. */
  flex-basis: 10%; /* label 요소의 기본 크기를 20%로 설정 */
  margin: 5px;
}

ul.sub {
  float: right;
  width: 80%;
  padding: 0;
  list-style: none;
}