/* LifeLog Category Sidebar v1.1.3 */
.llcs-category-guide{
  width:100%;
  max-width:100%;
  background:#fff;
  border:1px solid #e5e5e5;
  border-radius:0;
  overflow:hidden;
  box-shadow:0 2px 9px rgba(0,0,0,.035);
  color:#2f3135;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
}
.llcs-category-guide *{box-sizing:border-box}

.llcs-category-guide__title{
  min-height:58px;
  padding:14px 16px;
  background:#303338;
  color:#fff;
  display:flex;
  align-items:center;
  gap:10px;
  font-size:19px;
  line-height:1;
  font-weight:800;
  letter-spacing:.02em;
}
.llcs-category-guide__title-mark{
  width:4px;
  height:24px;
  background:var(--llcs-accent);
  flex:0 0 4px;
}
.llcs-category-guide__title-sub{
  margin-left:auto;
  color:rgba(255,255,255,.5);
  font-size:9px;
  font-weight:700;
  letter-spacing:.18em;
}

.llcs-category-guide__group{padding:13px 12px 14px}
.llcs-category-guide__group-title{
  min-height:42px;
  padding:8px 9px;
  margin-bottom:8px;
  display:flex;
  align-items:center;
  gap:8px;
  border-bottom:1px solid #e8e8e8;
}
.llcs-category-guide__group-icon{
  width:21px;
  height:21px;
  flex:0 0 21px;
  display:grid;
  place-items:center;
  color:var(--llcs-accent);
}
.llcs-category-guide__group-icon svg,
.llcs-category-guide__item-icon svg{
  width:100%;
  height:100%;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.llcs-category-guide__group-title strong{
  white-space:nowrap;
  font-size:14px;
  font-weight:800;
  color:#36383d;
}
.llcs-category-guide__line{
  height:1px;
  flex:1 1 auto;
  min-width:10px;
  background:linear-gradient(90deg,var(--llcs-accent),transparent);
  opacity:.45;
  margin-left:2px;
}

.llcs-category-guide__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:6px;
}
.llcs-category-guide__item{
  position:relative;
  min-width:0;
  min-height:46px;
  padding:7px 8px 7px 9px;
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid #e8e8e8;
  border-left:3px solid #ececec;
  border-radius:3px;
  background:#fff;
  color:#303338!important;
  text-decoration:none!important;
  box-shadow:none;
  transition:background .15s ease,border-color .15s ease,transform .15s ease;
}
a.llcs-category-guide__item:hover{
  background:#fff8f7;
  border-color:#ead1ce;
  border-left-color:var(--llcs-accent);
  transform:translateX(1px);
}
.llcs-category-guide__item.is-disabled{opacity:.48;cursor:default}
.llcs-category-guide__item-icon{
  width:22px;
  height:22px;
  flex:0 0 22px;
  display:grid;
  place-items:center;
  color:var(--llcs-accent);
}
.llcs-category-guide__label{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12.5px;
  line-height:1.25;
  font-weight:700;
}
.llcs-category-guide__count{
  margin-left:auto;
  flex:0 0 auto;
  min-width:24px;
  height:20px;
  padding:0 6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#f2f2f2;
  color:#777b82;
  font-size:10px;
  line-height:1;
  font-weight:700;
}
.llcs-category-guide__arrow{
  flex:0 0 auto;
  color:#a0a3a8;
  font-size:18px;
  line-height:1;
  font-weight:300;
}

@media (max-width:360px){
  .llcs-category-guide__title{font-size:18px;padding-left:14px;padding-right:14px}
  .llcs-category-guide__title-sub{font-size:8px}
  .llcs-category-guide__group-title strong{font-size:13.5px}
  .llcs-category-guide__label{font-size:12px}
  .llcs-category-guide__item{padding-left:8px;padding-right:6px;gap:6px}
  .llcs-category-guide__count{padding:0 5px;min-width:21px;font-size:9.5px}
}

/* Popular posts v1.1.0 */
.llcs-popular{
  padding:0 12px 14px;
  border-top:1px solid #ededed;
  background:#fff;
}
.llcs-popular__heading{
  min-height:48px;
  padding:11px 9px 8px;
  margin-bottom:5px;
  display:flex;
  align-items:center;
  gap:8px;
  border-bottom:1px solid #e8e8e8;
}
.llcs-popular__heading-icon{
  width:21px;
  height:21px;
  flex:0 0 21px;
  display:grid;
  place-items:center;
  color:var(--llcs-accent);
}
.llcs-popular__heading-icon svg,
.llcs-popular__thumb--empty svg{
  width:100%;
  height:100%;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.llcs-popular__heading strong{
  white-space:nowrap;
  font-size:14px;
  font-weight:800;
  color:#36383d;
}
.llcs-popular__list{
  list-style:none!important;
  margin:0!important;
  padding:0!important;
}
.llcs-popular__item{
  list-style:none!important;
  margin:0!important;
  padding:0!important;
  border-bottom:1px solid #ececec;
}
.llcs-popular__item:last-child{border-bottom:0}
.llcs-popular__link{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 3px;
  color:#303338!important;
  text-decoration:none!important;
  background:#fff;
  transition:background .15s ease,transform .15s ease;
}
.llcs-popular__link:hover{
  background:#fff8f7;
  transform:translateX(1px);
}
.llcs-popular__thumb-wrap{
  position:relative;
  width:92px;
  height:61px;
  flex:0 0 92px;
  overflow:hidden;
  background:#f0f0f0;
}
.llcs-popular__thumb{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.llcs-popular__thumb--empty{
  display:grid;
  place-items:center;
  color:#b8babd;
  background:#f1f2f3;
}
.llcs-popular__thumb--empty svg{width:25px;height:25px}
.llcs-popular__rank{
  position:absolute;
  top:0;
  left:0;
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  background:var(--llcs-accent);
  color:#fff;
  font-size:12px;
  line-height:1;
  font-weight:900;
  box-shadow:1px 1px 4px rgba(0,0,0,.18);
}
.llcs-popular__content{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  gap:5px;
}
.llcs-popular__title{
  display:-webkit-box;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  font-size:12.5px;
  line-height:1.48;
  font-weight:700;
  color:#34363a;
}
.llcs-popular__meta{
  color:var(--llcs-accent);
  font-size:8.5px;
  line-height:1;
  font-weight:800;
  letter-spacing:.12em;
}

@media (max-width:360px){
  .llcs-popular__thumb-wrap{width:84px;height:56px;flex-basis:84px}
  .llcs-popular__title{font-size:12px}
}