/* --------------------------------------------------------------------------
   .category-navigation
--------------------------------------------------------------------------- */
.category-navigation {
  position: relative;
  background: url("/komachi-official/assets/images/teinei-tsushin/bg_pattern01.jpg");
  background-size: 330px;
}

.category-navigation::after {
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 12px;
  background: url("/komachi-official/assets/images/teinei-tsushin/border_pattern01_md.png") repeat-x;
  content: '';
}

/* --------------------------------------------------------------------------
   .category-navigation .nav
--------------------------------------------------------------------------- */

.category-navigation .nav__item {
  border-bottom: 1px dashed #ead4a2;
}

.category-navigation .nav__item:last-child {
  border-bottom: 0;
}

/* --------------------------------------------------------------------------
   .category-navigation .item
--------------------------------------------------------------------------- */
.category-navigation .item {
  position: relative;
  display: flex;
  align-items: center;
  padding: 15px 20px;
}

.category-navigation .item__label {
  position: relative;
  top: -4px;
  margin-left: 15px;
}

.category-navigation .item .i-arrow-r {
  position: absolute;
  top: 0;
  right: 23px;
  bottom: 0;
  margin: auto 0;
  width: 8px;
  height: 16px;
  font-size: 1.6rem;
}

.category-navigation .item--category01 .i-arrow-r {
  color: #cbab61;
}

.category-navigation .item--category02 .i-arrow-r {
  color: #80b75e;
}

.category-navigation .item--category03 .i-arrow-r {
  color: #ff7e7e;
}

.category-navigation .item--category04 .i-arrow-r {
  color: #70a1e7;
}

.category-navigation .item--category05 .i-arrow-r {
  color: #f6a74f;
}

/* --------------------------------------------------------------------------
   .category-navigation .back-to-top
--------------------------------------------------------------------------- */
.category-navigation .back-to-top {
  padding: 30px 0 40px;
  border-top: 1px dashed #ead4a2;
  text-align: center;
}

.category-navigation .back-to-top .c-btn .i-arrow-r,
.category-navigation .back-to-top .c-btn .i-arrow-l {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
}

.category-navigation .back-to-top .c-btn img {
  width: 193px;
  height: 15px;
}

/* --------------------------------------------------------------------------
   .category-navigation-accordion
--------------------------------------------------------------------------- */

.category-navigation-accordion .accordion-toggler {
  display: block;
  width: 100%;
  height: 65px;
  background-color: #ff8292;
  background-image: url("/komachi-official/assets/images/teinei-tsushin/category-nav_pattern.png");
  background-size: 66px;
  background-repeat: repeat;
}

.category-navigation-accordion .accordion-toggler__inner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.category-navigation-accordion .accordion-toggler__inner::before, .category-navigation-accordion .accordion-toggler__inner::after {
  position: absolute;
  top: 0;
  right: 20px;
  bottom: 0;
  display: block;
  margin: auto 0;
  width: 15px;
  height: 2px;
  border-radius: 2px;
  background-color: #fff;
  content: '';
  -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
}

.category-navigation-accordion .accordion-toggler__inner::after {
  transition: -webkit-transform .4s;
  transition: transform .4s;
  transition: transform .4s, -webkit-transform .4s;
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
}

.category-navigation-accordion .accordion-toggler.is-expanded .accordion-toggler__inner::after {
  -webkit-transform: rotate(0);
          transform: rotate(0);
}

.category-navigation-accordion .category-navigation-wrapper {
  overflow: hidden;
  height: 0;
  transition: height 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.category-navigation-accordion .close {
  padding: 30px 25px;
  border-top: 1px dashed #ead4a2;
  text-align: center;
}

/* --------------------------------------------------------------------------
   .category-navigation-bar
--------------------------------------------------------------------------- */

/* .category-navigation-bar .nav
----------------------------------------------------------------- */
.category-navigation-bar .nav {
  display: flex;
}

.category-navigation-bar .nav__item {
  position: relative;
  width: 20%;
}

.category-navigation-bar .nav__item::before, .category-navigation-bar .nav__item::after {
  position: absolute;
  top: 0;
  bottom: 0;
  display: block;
  margin: auto 0;
  width: 2px;
  height: 43px;
  background-image: linear-gradient(0deg, #fff 20%, #e8e0cc 20%, #e8e0cc 50%, #fff 50%, #fff 70%, #e8e0cc 70%, #e8e0cc 100%);
  background-size: 10px 10px;
  background-repeat: repeat-y;
  content: '';
}

.category-navigation-bar .nav__item::before {
  left: -2px;
}

.category-navigation-bar .nav__item::after {
  right: 0;
}

.category-navigation-bar .nav__item:not(:last-child)::after {
  display: none;
}

/* .category-navigation-bar .item
----------------------------------------------------------------- */
.category-navigation-bar .item {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 89px;
}

.category-navigation-bar .item img {
  position: relative;
  z-index: 1;
  display: block;
}

.category-navigation-bar .item__inner {
  position: relative;
  display: block;
}

.category-navigation-bar .item__inner::before {
  position: absolute;
  bottom: -7px;
  left: 50%;
  display: block;
  content: '';
  opacity: 0;
  transition: opacity 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
}

.category-navigation-bar .item:hover .item__inner::before {
  opacity: 1;
}

.category-navigation-bar .item--category1 .item__inner::before {
  width: 131px;
  height: 15px;
  background-image: url("/komachi-official/assets/images/teinei-tsushin/category_active01.png");
}

.category-navigation-bar .item--category2 .item__inner::before {
  width: 114px;
  height: 15px;
  background-image: url("/komachi-official/assets/images/teinei-tsushin/category_active02.png");
}

.category-navigation-bar .item--category3 .item__inner::before {
  width: 156px;
  height: 15px;
  background-image: url("/komachi-official/assets/images/teinei-tsushin/category_active03.png");
}

.category-navigation-bar .item--category4 .item__inner::before {
  width: 100px;
  height: 15px;
  background-image: url("/komachi-official/assets/images/teinei-tsushin/category_active04.png");
}

.category-navigation-bar .item--category5 .item__inner::before {
  width: 111px;
  height: 15px;
  background-image: url("/komachi-official/assets/images/teinei-tsushin/category_active05.png");
}

/* --------------------------------------------------------------------------
   .list-header
--------------------------------------------------------------------------- */
.list-header {
  position: relative;
  background: url("/komachi-official/assets/images/teinei-tsushin/bg_pattern01.jpg");
  background-size: 330px;
}

.list-header::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 12px;
  background-image: url("/komachi-official/assets/images/teinei-tsushin/border_pattern01_md.png");
  background-size: auto;
  background-repeat: repeat-x;
  content: '';
}

/* .list-header .headings
----------------------------------------------------------------- */
.list-header .headings {
  display: flex;
  align-items: center;
  padding: 16px 0 19px;
}

.list-header .headings__icon img {
  width: 75px;
  height: 75px;
}

.list-header .headings__text {
  margin-left: 15px;
}

.list-header .headings__text img {
  width: 158px;
  height: 21px;
}

.list-header .headings--tag {
  padding: 27px 0 32px;
}

.list-header .headings--tag .headings__icon {
  margin-left: -1px;
}

.list-header .headings--tag .headings__icon img {
  width: 20px;
  height: 20px;
}

.list-header .headings--tag .headings__text {
  margin-left: 10px;
  color: #372300;
  font-weight: 500;
  font-size: 1.7rem;
}

.list-header .headings--tag .headings__text span {
  position: relative;
  top: 2px;
}

/* --------------------------------------------------------------------------
   .recent-articles
--------------------------------------------------------------------------- */
.recent-articles {
  position: relative;
  padding: 7px 0 0;
}

.recent-articles::before, .recent-articles::after {
  position: absolute;
  left: 0;
  display: block;
  width: 100%;
  height: 12px;
  background: url("/komachi-official/assets/images/teinei-tsushin/border_pattern01_md.png") repeat-x;
  content: '';
}

.recent-articles::before {
  top: 0;
}

.recent-articles::after {
  bottom: 0;
}

/* --------------------------------------------------------------------------
   .recent-articles .grid
--------------------------------------------------------------------------- */

.recent-articles .grid__item {
  position: relative;
}

.recent-articles .grid__item::before {
  position: absolute;
  top: -7px;
  left: 0;
  display: block;
  width: 100%;
  height: 7px;
  background-image: url("/komachi-official/assets/images/teinei-tsushin/border_pattern01_sm.png");
  background-size: 17px 7px;
  background-repeat: repeat-x;
  content: '';
}

/* --------------------------------------------------------------------------
   .recent-articles .article
--------------------------------------------------------------------------- */
.recent-articles .article {
  position: relative;
}

.recent-articles .article > a {
  position: relative;
  display: block;
  overflow: hidden;
}

.recent-articles .article__image {
  position: relative;
  background-position: 50% 50%;
  background-size: cover;
  transition: -webkit-transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.recent-articles .article__image::before {
  display: block;
  padding-top: 62.67%;
  content: '';
}

.recent-articles .article__image::after {
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 71%;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.5));
  content: '';
}

.recent-articles .article__image img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: auto;
}

.recent-articles .article__body {
  position: relative;
  padding: 26px 24px 35px;
  letter-spacing: -.001em;
}

.recent-articles .article__tag {
  position: absolute;
  top: -14px;
  left: 0;
}

.recent-articles .article__heading {
  color: #372300;
  font-weight: 300;
  font-size: 1.6rem;
  line-height: 1.53;
}

.recent-articles .article__date {
  display: block;
  margin-top: 15px;
  color: #a59178;
  font-weight: 300;
  font-size: 1.2rem;
  line-height: 1;
}

/* --------------------------------------------------------------------------
	 .sec-list
--------------------------------------------------------------------------- */
.sec-list {
  position: relative;
  padding: 31px 0 50px;
  background: url("/komachi-official/assets/images/bg_pattern01.png");
  background-size: 100px;
}

.sec-list--no-heading {
  padding: 30px 0 40px;
}

.sec-list__heading {
  margin-bottom: 4px;
  text-align: center;
}

.sec-list::before, .sec-list::after {
  position: absolute;
  left: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 9px;
  content: '';
}

.sec-list::before {
  top: -4px;
  background: url("/komachi-official/assets/images/teinei-tsushin/list_wave_top.png") repeat-x;
  background-size: 52px 4px;
}

.sec-list::after {
  bottom: -4px;
  background: url("/komachi-official/assets/images/teinei-tsushin/list_wave_bottom.png") repeat-x;
  background-size: 53px 4px;
}

/* --------------------------------------------------------------------------
	 .sec-list .grid
--------------------------------------------------------------------------- */

.sec-list .grid__item.is-added {
  -webkit-animation-name: articleFadeIn;
          animation-name: articleFadeIn;
  -webkit-animation-duration: .6s;
          animation-duration: .6s;
  -webkit-animation-timing-function: ease;
          animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

@-webkit-keyframes articleFadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes articleFadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* --------------------------------------------------------------------------
	 .sec-list .article
--------------------------------------------------------------------------- */
.sec-list .article {
  position: relative;
}

.sec-list .article__image {
  position: relative;
}

.sec-list .article__image::before {
  position: absolute;
  top: 2px;
  left: 2px;
  display: block;
  width: 100%;
  height: 100%;
  background-size: cover;
  content: '';
}

.sec-list .article__image::after {
  display: block;
  padding-top: 62.67%;
  content: '';
}

.sec-list .article__image img,
.sec-list .article__image svg {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  transition: -webkit-transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.sec-list .article__body {
  margin-top: -2px;
  padding-left: 13px;
  letter-spacing: -.001em;
}

.sec-list .article__heading {
  margin-top: 9px;
  color: #372300;
  font-weight: 300;
  font-size: 1.6rem;
  line-height: 1.58;
}

.sec-list .article__date {
  display: block;
  color: #a59178;
  font-weight: 300;
  font-size: 1.2rem;
  line-height: 1;
}

.sec-list .article__date::before {
  display: block;
  padding-top: 62.67%;
  content: '';
}

.sec-list .article--category1 .article__image::before {
  background-image: url("/komachi-official/assets/images/teinei-tsushin/article_back01.png");
}

.sec-list .article--category2 .article__image::before {
  background-image: url("/komachi-official/assets/images/teinei-tsushin/article_back02.png");
}

.sec-list .article--category3 .article__image::before {
  background-image: url("/komachi-official/assets/images/teinei-tsushin/article_back03.png");
}

.sec-list .article--category4 .article__image::before {
  background-image: url("/komachi-official/assets/images/teinei-tsushin/article_back04.png");
}

.sec-list .article--category5 .article__image::before {
  background-image: url("/komachi-official/assets/images/teinei-tsushin/article_back05.png");
}

/* --------------------------------------------------------------------------
	 .sec-list .navigation
--------------------------------------------------------------------------- */
.sec-list .navigation {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 30px;
  border-top: 1px dashed #e4ddce;
}

.sec-list .navigation__prev .c-btn img {
  left: 2px;
}

.sec-list .navigation__next .c-btn img {
  right: 3px;
}

.sec-list .navigation .c-btn {
  width: 100%;
  height: 55px;
  border-radius: 28px;
}

.sec-list .navigation .c-btn img {
  position: relative;
  width: 33px;
  height: 14px;
}

.sec-list .navigation .c-btn .i-arrow-r,
.sec-list .navigation .c-btn .i-arrow-l {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  width: 8px;
  height: 16px;
  font-size: 1.6rem;
}

.sec-list .navigation .c-btn .i-arrow-l {
  left: 15px;
}

.sec-list .navigation .c-btn .i-arrow-r {
  right: 15px;
}

.sec-list .navigation .c-btn.is-disabled {
  visibility: hidden;
}

/* .sec-list .navigation .page-numbers
----------------------------------------------------------------- */
.sec-list .navigation .page-numbers {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  margin: -10px -5px;
  padding: 0 30px;
}

.sec-list .navigation .page-numbers li {
  padding: 10px 5px;
}

.sec-list .navigation .page-numbers .item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background-color: #fff;
  font-size: 1.8rem;
}

.sec-list .navigation .page-numbers .item span {
  position: relative;
  z-index: 1;
}

.sec-list .navigation .page-numbers .item:hover, .sec-list .navigation .page-numbers .item.is-current {
  color: #fff;
}

.sec-list .navigation .page-numbers .item:hover::after, .sec-list .navigation .page-numbers .item.is-current::after {
  opacity: 1;
}

.sec-list .navigation .page-numbers .item.is-current {
  pointer-events: none;
}

.sec-list .navigation .page-numbers .item::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 1px solid #e3d7d7;
  border-radius: 50%;
  content: '';
}

.sec-list .navigation .page-numbers .item::after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-image: url("/komachi-official/assets/images/btn_color01_bg.png");
  background-size: 15px;
  background-repeat: repeat;
  box-shadow: inset 0 0 33px rgba(217, 8, 27, 0.5);
  color: #fff;
  content: '';
  opacity: 0;
}

.sec-list .navigation .page-numbers .ellipsis {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
}

.sec-list .navigation .page-numbers .ellipsis::before {
  display: block;
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20218.95%20218.94%22%3E%20%3Cpath%20fill%3D%22%23040000%22%20d%3D%22M23.19%2088.64A21.78%2021.78%200%201%200%2043.51%20109a21.78%2021.78%200%200%200-20.32-20.36zM218.9%20109a21.78%2021.78%200%201%200-23.14%2023.14A21.85%2021.85%200%200%200%20218.9%20109zM110.88%2088.66A21.77%2021.77%200%201%200%20131.19%20109a21.74%2021.74%200%200%200-20.31-20.34z%22%20style%3D%22fill%3A%23372300%22%2F%3E%3C%2Fsvg%3E");
  background-size: 24px;
  content: '';
}

/* --------------------------------------------------------------------------
	 .sec-list .more
--------------------------------------------------------------------------- */
.sec-list .more {
  padding-top: 30px;
  border-top: 1px dashed #e4ddce;
  text-align: center;
}

.sec-list .more.is-hidden {
  display: none;
}

/* --------------------------------------------------------------------------
	 .sec-list .blank
--------------------------------------------------------------------------- */
.sec-list .blank {
  position: relative;
  margin: 0 -25px -35px;
  padding: 25px 0 15px;
  color: #372300;
  text-align: center;
  font-weight: 300;
  font-size: 1.6rem;
  line-height: 1.5;
}

.sec-list--no-heading .blank {
  margin-bottom: -20px;
  padding: 2px 0 0;
}

/* --------------------------------------------------------------------------
   .sec-ranking
--------------------------------------------------------------------------- */
.sec-ranking {
  padding: 36.5px 0 44px;
  background: url("/komachi-official/assets/images/teinei-tsushin/bg_pattern01.jpg");
  background-size: 330px;
}

.sec-ranking__heading {
  margin-bottom: 36.5px;
  text-align: center;
}

/* --------------------------------------------------------------------------
   .sec-ranking .grid
--------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   .sec-ranking
--------------------------------------------------------------------------- */

.sec-ranking .article__top {
  position: relative;
}

.sec-ranking .article__image {
  position: relative;
}

.sec-ranking .article__image::before {
  position: absolute;
  top: 3px;
  left: 3px;
  display: block;
  width: 100%;
  height: 100%;
  background-size: cover;
  content: '';
}

.sec-ranking .article__image::after {
  display: block;
  padding-top: 62.67%;
  content: '';
}

.sec-ranking .article__image img,
.sec-ranking .article__image svg {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  transition: -webkit-transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.sec-ranking .article__rank {
  position: absolute;
  top: -9px;
  left: -3px;
}

.sec-ranking .article__body {
  position: relative;
  padding-top: 17px;
  letter-spacing: -.001em;
}

.sec-ranking .article__tag {
  position: absolute;
  top: -23px;
  left: 0;
}

.sec-ranking .article__heading {
  color: #372300;
  font-weight: 300;
  font-size: 1.6rem;
  line-height: 1.53;
}

.sec-ranking .article__date {
  display: block;
  margin-top: 13px;
  color: #a59178;
  font-weight: 300;
  font-size: 1.2rem;
  line-height: 1;
}

.sec-ranking .article--category1 .article__image::before {
  background-image: url("/komachi-official/assets/images/teinei-tsushin/article_back01.png");
}

.sec-ranking .article--category2 .article__image::before {
  background-image: url("/komachi-official/assets/images/teinei-tsushin/article_back02.png");
}

.sec-ranking .article--category3 .article__image::before {
  background-image: url("/komachi-official/assets/images/teinei-tsushin/article_back03.png");
}

.sec-ranking .article--category4 .article__image::before {
  background-image: url("/komachi-official/assets/images/teinei-tsushin/article_back04.png");
}

.sec-ranking .article--category5 .article__image::before {
  background-image: url("/komachi-official/assets/images/teinei-tsushin/article_back05.png");
}

@media (min-width: 768px) {
  body {
    width: auto;
  }
  .category-navigation {
    padding: 68px 0 90px;
    background-size: auto;
  }
  .category-navigation .nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: -42px -29px 0;
    border-top: 0;
  }
  .category-navigation .nav__item {
    padding: 42px 29px 0;
    border-bottom: 0;
  }
  .category-navigation .item {
    display: block;
    padding: 0;
    transition: -webkit-transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  }
  .category-navigation .item:hover {
    transition: -webkit-transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -webkit-transform: scale(1.04);
            transform: scale(1.04);
  }
  .category-navigation .item__image img {
    width: 182px;
    height: 182px;
  }
  .category-navigation .item__label {
    top: 0;
    margin: -24px 0 0;
    text-align: center;
  }
  .category-navigation .item__label img {
    width: 157px;
    height: 43px;
  }
  .category-navigation .item .i-arrow-r {
    display: none;
  }
  .category-navigation .back-to-top {
    margin-top: 62px;
    padding: 0;
    border-top: 0;
  }
  .category-navigation .back-to-top .c-btn {
    width: 300px;
    height: 60px;
  }
  .category-navigation .back-to-top .c-btn .i-arrow-r,
  .category-navigation .back-to-top .c-btn .i-arrow-l {
    width: 8px;
    height: 15px;
    font-size: 1.53rem;
  }
  .category-navigation .back-to-top .c-btn img {
    width: 188px;
    height: 16px;
  }
  .category-navigation-accordion {
    display: none;
  }
  .list-header {
    background-size: auto;
  }
  .list-header .headings {
    padding: 48px 0 49px;
  }
  .list-header .headings__icon img {
    width: 111px;
    height: 111px;
  }
  .list-header .headings__text {
    margin-left: 28px;
  }
  .list-header .headings__text img {
    width: 445px;
    height: 33px;
  }
  .list-header .headings--tag {
    padding: 63px 0 64px;
  }
  .list-header .headings--tag .headings__icon {
    margin-left: 0;
  }
  .list-header .headings--tag .headings__icon img {
    width: 28px;
    height: 28px;
  }
  .list-header .headings--tag .headings__text {
    margin-left: 16px;
    font-size: 2.8rem;
  }
  .list-header .headings--tag .headings__text span {
    top: 0;
  }
  .recent-articles {
    padding: 12px 0;
  }
  .recent-articles .grid {
    display: flex;
  }
  .recent-articles .grid__item {
    width: 50%;
  }
  .recent-articles .grid__item::before {
    display: none;
  }
  .recent-articles .grid__item:last-child::after {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 1px;
    height: 100%;
    background-color: #fff;
    content: '';
  }
  .recent-articles .article > a:hover .article__image {
    transition: -webkit-transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    -webkit-transform: scale(1.03);
            transform: scale(1.03);
  }
  .recent-articles .article__body {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 0 40px 28px;
    width: 100%;
  }
  .recent-articles .article__tag {
    top: -62px;
  }
  .recent-articles .article__tag img {
    width: 157px;
    height: 43px;
  }
  .recent-articles .article__heading {
    color: #fff;
    font-weight: 500;
    font-size: 2.6rem;
    line-height: 1.5;
  }
  .recent-articles .article__date {
    margin: 13px 0 0 5px;
    color: #fff;
    letter-spacing: .06em;
    font-size: 1.3rem;
  }
  .sec-list {
    padding: 60px 0 80px;
    background-size: auto;
  }
  .sec-list--no-heading {
    padding: 66px 0 80px;
  }
  .sec-list__heading {
    margin-bottom: 50px;
  }
  .sec-list__heading img {
    position: relative;
    left: 3px;
    width: 246px;
    height: 40px;
  }
  .sec-list::before {
    top: -9px;
    background-size: auto;
  }
  .sec-list::after {
    bottom: -9px;
    background-size: auto;
  }
  .sec-list .article__image::before {
    top: 5px;
    left: 5px;
  }
  .sec-list .article__tag img {
    width: 157px;
    height: 43px;
  }
  .sec-list .article__heading {
    margin-top: 0;
    line-height: 1.84;
    transition: color .3s;
  }
  .sec-list .article__date {
    margin-top: 10px;
    font-weight: 500;
    font-size: 1.3rem;
  }
  .sec-list .article__date::before {
    display: none;
  }
  .sec-list .article a:hover .article__image svg {
    -webkit-transform: translate3d(-3px, -3px, 0);
            transform: translate3d(-3px, -3px, 0);
  }
  .sec-list .article--category1 a:hover .article__heading {
    color: #957a33;
  }
  .sec-list .article--category2 a:hover .article__heading {
    color: #4e7630;
  }
  .sec-list .article--category3 a:hover .article__heading {
    color: #ff4a4a;
  }
  .sec-list .article--category4 a:hover .article__heading {
    color: #2166c0;
  }
  .sec-list .article--category5 a:hover .article__heading {
    color: #c57111;
  }
  .sec-list .navigation {
    margin-top: 50px;
    padding-top: 0;
    border-top: 0;
  }
  .sec-list .navigation__prev .c-btn img {
    top: -1px;
    left: 6px;
  }
  .sec-list .navigation__next .c-btn img {
    top: -1px;
    right: 4px;
  }
  .sec-list .navigation .c-btn {
    width: 140px;
    height: 50px;
    border-radius: 25px;
  }
  .sec-list .navigation .c-btn img {
    width: 36px;
    height: 16px;
  }
  .sec-list .navigation .c-btn .i-arrow-r,
  .sec-list .navigation .c-btn .i-arrow-l {
    width: 8px;
    height: 15px;
    font-size: 1.53rem;
  }
  .sec-list .navigation .c-btn .i-arrow-l {
    left: 26px;
  }
  .sec-list .navigation .c-btn .i-arrow-r {
    right: 26px;
  }
  .sec-list .navigation .page-numbers .item::after {
    background-size: 30px;
    box-shadow: inset 0 0 38px rgba(217, 8, 27, 0.5);
  }
  .sec-list .more {
    margin-top: 28px;
    padding-top: 0;
    border-top: 0;
  }
  .sec-list .blank {
    margin: 0;
    padding: 15px 0 15px 16px;
    font-weight: 500;
    font-size: 1.8rem;
    line-height: 1.45;
  }
  .sec-list .blank img {
    width: 579px;
    height: 146px;
  }
  .sec-list--no-heading .blank {
    margin-bottom: 0;
    padding: 17px 0 1px;
  }
  .sec-ranking {
    padding: 52px 0 73px;
    border-top: 1px solid #f2e8cf;
    background-size: auto;
  }
  .sec-ranking__heading {
    margin-bottom: 11px;
  }
  .sec-ranking__heading img {
    width: 281px;
    height: 69px;
  }
  .sec-ranking .article__image::before {
    top: 5px;
    left: 5px;
  }
  .sec-ranking .article__rank {
    top: -12px;
    left: 17px;
  }
  .sec-ranking .article__rank img {
    width: 49px;
    height: 57px;
  }
  .sec-ranking .article__tag img {
    width: 157px;
    height: 43px;
  }
  .sec-ranking .article__heading {
    line-height: 1.81;
    transition: color .3s;
  }
  .sec-ranking .article__date {
    font-weight: 500;
    font-size: 1.3rem;
  }
  .sec-ranking .article a:hover .article__image svg {
    -webkit-transform: translate3d(-3px, -3px, 0);
            transform: translate3d(-3px, -3px, 0);
  }
  .sec-ranking .article--category1 a:hover .article__heading {
    color: #957a33;
  }
  .sec-ranking .article--category2 a:hover .article__heading {
    color: #4e7630;
  }
  .sec-ranking .article--category3 a:hover .article__heading {
    color: #ff4a4a;
  }
  .sec-ranking .article--category4 a:hover .article__heading {
    color: #2166c0;
  }
  .sec-ranking .article--category5 a:hover .article__heading {
    color: #c57111;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  body {
    width: auto;
  }
  .recent-articles .article__body {
    padding: 0 30px 25px;
  }
  .recent-articles .article__tag {
    top: -52px;
  }
  .recent-articles .article__heading {
    font-size: 2.2rem;
  }
  .recent-articles .article__date {
    margin: 6px 0 0;
  }
}

@media (min-width: 1280px) {
  body {
    width: auto;
  }
  .recent-articles .article__body {
    padding: 0 170px 37px 46px;
  }
  .recent-articles .article__date {
    position: absolute;
    right: 38px;
    bottom: 44px;
    margin: 0;
  }
  .sec-list .grid {
    display: flex;
    flex-wrap: wrap;
    margin: -23px -16px 0;
  }
  .sec-list .grid__item {
    padding: 23px 16px 0;
    width: 25%;
  }
  .sec-list .article__body {
    position: relative;
    margin-top: 0;
    padding: 33px 15px 20px;
  }
  .sec-list .article__tag {
    position: absolute;
    top: -21px;
    left: 8px;
  }
  .sec-ranking__heading {
    margin-bottom: 45px;
  }
  .sec-ranking .grid {
    display: flex;
    justify-content: center;
    margin: 0 -32px;
  }
  .sec-ranking .grid__item {
    padding: 0 32px;
    width: 33.33333333%;
  }
  .sec-ranking .article__rank {
    top: -7px;
    left: 4px;
  }
  .sec-ranking .article__body {
    padding: 22px 14px 0;
  }
  .sec-ranking .article__tag {
    top: -31px;
    left: 15px;
  }
}

@media (max-width: 767px) {
  .category-navigation::after {
    display: none;
  }
  .category-navigation-bar {
    display: none;
  }
  .list-header::before {
    display: none;
  }
  .recent-articles::before, .recent-articles::after {
    display: none;
  }
  .sec-list::after {
    display: none;
  }
  .sec-list .grid__item + .grid__item {
    border-top: 1px dashed #e4ddce;
  }
  .sec-list--ex-layout .grid__item:nth-child(4) {
    margin-top: 9px;
  }
  .sec-list .article > a {
    display: flex;
    padding: 30px 0 19px;
  }
  .sec-list .article__top {
    flex: 0 0 auto;
    padding-bottom: 20px;
    width: 38.46%;
  }
  .sec-list .article__date {
    position: absolute;
    top: 0;
    left: 0;
    padding-top: 30px;
    width: 38.46%;
  }
  .sec-list .article__date span {
    display: block;
    margin-top: 8px;
  }
  .sec-list--ex-layout .grid__item:nth-child(-n + 3) {
    border-top: 0;
  }
  .sec-list--ex-layout .grid__item:nth-child(-n + 3) .article > a {
    display: block;
    padding-top: 0;
    padding-bottom: 30px;
  }
  .sec-list--ex-layout .grid__item:nth-child(-n + 3) .article__top {
    padding-bottom: 0;
    width: auto;
  }
  .sec-list--ex-layout .grid__item:nth-child(-n + 3) .article__body {
    position: relative;
    margin-top: 0;
    padding-top: 17px;
    padding-left: 0;
  }
  .sec-list--ex-layout .grid__item:nth-child(-n + 3) .article__tag {
    position: absolute;
    top: -23px;
    left: 0;
  }
  .sec-list--ex-layout .grid__item:nth-child(-n + 3) .article__tag img {
    width: 120px;
    height: 32px;
  }
  .sec-list--ex-layout .grid__item:nth-child(-n + 3) .article__heading {
    margin-top: auto;
    line-height: 1.53;
  }
  .sec-list--ex-layout .grid__item:nth-child(-n + 3) .article__date {
    position: static;
    display: block;
    margin-top: 13px;
    padding-top: 0;
  }
  .sec-list--ex-layout .grid__item:nth-child(-n + 3) .article__date::before {
    display: none;
  }
  .sec-list .navigation__prev {
    padding-right: 10px;
    width: 50%;
  }
  .sec-list .navigation__next {
    padding-left: 10px;
    width: 50%;
  }
  .sec-list .navigation .page-numbers {
    display: none;
  }
  .sec-ranking .grid__item + .grid__item {
    margin-top: 39px;
  }
}

@media (max-width: 374px) {
  .category-navigation .nav {
    margin: 0 -25px;
  }
  .category-navigation .item__image img {
    width: 70px;
    height: 70px;
  }
  .category-navigation-accordion .close {
    margin: 0 -25px;
  }
}

@media (min-width: 768px) and (max-width: 1279px) {
  .category-navigation-bar .item img {
    width: 90px;
    height: 37px;
  }
  .category-navigation-bar .item--category1 .item__inner::before {
    width: 80px;
    height: 15px;
    background-image: url("/komachi-official/assets/images/teinei-tsushin/category_active01_md.png");
  }
  .category-navigation-bar .item--category2 .item__inner::before {
    width: 72px;
    height: 15px;
    background-image: url("/komachi-official/assets/images/teinei-tsushin/category_active02_md.png");
  }
  .category-navigation-bar .item--category3 .item__inner::before {
    width: 94px;
    height: 15px;
    background-image: url("/komachi-official/assets/images/teinei-tsushin/category_active03_md.png");
  }
  .category-navigation-bar .item--category4 .item__inner::before {
    bottom: 2px;
    width: 100px;
    height: 15px;
    background-image: url("/komachi-official/assets/images/teinei-tsushin/category_active04_md.png");
  }
  .category-navigation-bar .item--category5 .item__inner::before {
    width: 72px;
    height: 15px;
    background-image: url("/komachi-official/assets/images/teinei-tsushin/category_active05_md.png");
  }
  .sec-list .grid {
    display: flex;
    flex-wrap: wrap;
    margin: -27px -20px 0;
  }
  .sec-list .grid__item {
    padding: 20px 20px 0;
    width: 50%;
  }
  .sec-list .article__body {
    position: relative;
    margin-top: 0;
    padding: 33px 0 20px;
  }
  .sec-list .article__tag {
    position: absolute;
    top: -30px;
    left: -1px;
  }
  .sec-ranking .l-container {
    min-width: 720px;
  }
  .sec-ranking .grid__item + .grid__item {
    border-top: 2px dashed #e8d6ab;
  }
  .sec-ranking .article > a {
    display: flex;
    align-items: center;
    padding: 30px 0 34px;
  }
  .sec-ranking .article__top {
    padding: 0 20px;
    width: 50%;
  }
  .sec-ranking .article__body {
    padding: 0 20px 6px 10px;
    width: 50%;
  }
  .sec-ranking .article__tag {
    position: static;
  }
  .sec-ranking .article__heading {
    margin-top: 13px;
  }
}

/*# sourceMappingURL=../../../../maps/komachi-official/assets/styles/teinei-tsushin/index.css.map */