@charset "UTF-8";
/* ==========================================================

title : 刀剣ワールド／刀剣広場 イラスト・写真投稿 投稿イラストの一覧ページ
scope : 刀剣ワールド／刀剣広場 イラスト・写真投稿 投稿イラストの一覧ページ

memo：

last modify : 2020/10/29 TCI福岡／WEB2TCI-14309
2020/01/24 TCI福岡／新規作成

========================================================== */

/* ------------------------------------ */
/* ▼ link banner */
/* ------------------------------------ */
.link_single_bnr {
  margin: 0 auto;
  max-width: 400px;
  width: 100%;
}

.link_single_bnr>a {
  display: block;
  position: relative;
  width: 100%;
}

.link_single_bnr_ttl {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  width: 100%;
}

.link_single_bnr_ttl>span {
  border-radius: 25px;
  background-color: #000;
  color: #fff;
  display: inline-block;
  font-size: 2.4rem;
  line-height: 1.1;
  padding: .6rem 2.5rem;
}

.link_single_bnr>figcaption {
  font-size: 1.7rem;
  line-height: 1.4;
  margin-top: .7rem;
}

.link_single_bnr>figcaption>a {
  text-decoration: underline;
}

@media (min-width: 768px) {
  .link_single_bnr_top_wrap {
    margin: 2rem auto 0;
  }

  .link_single_bnr_bottom_wrap {
    margin-top: 6rem;
  }

  .link_single_bnr_bottom_inner {
    background-image:
      url(../image/bg-spacer-bnr-01.png),
      url(../image/bg-spacer-bnr-02.png);
    background-position: right top, left bottom;
    background-repeat: no-repeat, no-repeat;
    background-size: 84px auto, 94px auto;
    background-color: #fbe9ed;
    margin: 0 auto;
    max-width: 600px;
    padding: 3.5rem 0;
    width: 100%;
  }
}

@media (max-width: 767px) {
  .link_single_bnr_top_wrap {
    margin: 2rem auto 0;
    padding: 0 2rem;
  }

  .link_single_bnr_bottom_wrap {
    margin: 6rem auto 0;
    padding: 0 2rem;
  }

  .link_single_bnr_ttl>span {
    border-radius: 25px;
    font-size: 1.8rem;
    padding: .6rem 2rem;
  }

  .link_single_bnr>figcaption {
    font-size: 1.4rem;
    margin-top: .5rem;
  }
}

/* ------------------------------------ */
/* ▼ wrap */
/* ------------------------------------ */
@media (min-width: 768px) {
  .cmn_contents_wrap {
    margin-top: 4.5rem;
    padding-bottom: 4.5rem;
  }
}

@media (max-width: 767px) {}



/* ------------------------------------ */
/* ▼ title text */
/* ------------------------------------ */
@media (min-width: 768px) {
  .cmn_h1_title01 {
    max-width: 970px;
  }

  .h2_sub_title {
    margin: 2.4rem auto 0;
    max-width: 700px;
    width: 100%;
  }
}

@media (max-width: 767px) {
  .h2_sub_title {
    margin: 1.4rem auto 0;
    max-width: 600px;
    padding: 0 1rem;
    width: 100%;
  }
}

/* ------------------------------------ */
/* ▼ theme link */
/* ------------------------------------ */
.theme_link_wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 2.2rem auto 0;
  max-width: 869px;
  width: 100%;
}

.theme_link_col {
  width: 49.483%;
}

.is_illust.theme_link_col {
  background-color: #fdeded;
  border: solid 1px #cb2929;
}

.is_photo.theme_link_col {
  background-color: #f8ecdc;
  border: solid 1px #9f7943;
}

.theme_link_title {
  background-image: url(/app/themes/wp-templ/image-cmn/title/bg-title-pattern01.png);
  background-repeat: repeat;
  background-size: 160px auto;
  color: #fff;
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 1;
  padding: 1.05rem 0;
  text-align: center;
}

.is_illust .theme_link_title {
  background-color: #cb2929;
}

.is_photo .theme_link_title {
  background-color: #9f7943;
}

.theme_link_sub_title{
  background: #000;
  border-radius: 50px;
  padding: 3px 18px;
  margin: 0 10px;
}

.is_photo .theme_link_sub_title{
  padding: 2px 33px;
}

.theme_link_list {
  display: flex;
  flex-wrap: wrap;
  padding: .9rem 1rem .9rem 1.5rem;
}

.theme_link_list>li {
  line-height: 1;
  padding: .5rem .2rem;
}

.theme_link_list>li>a,
.theme_link_list>li>span {
  background-color: #fff;
  border-radius: 25px;
  display: inline-block;
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1;
  padding: .7rem 1.95rem .6rem 1.4rem;
  position: relative;
}

.theme_link_list>li>a::after,
.theme_link_list>li>span::after {
  border-style: solid;
  border-width: 4px 0 4px 6px;
  content: "";
  display: block;
  height: 0;
  position: absolute;
  right: 8px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 0;
}

.is_illust .theme_link_list>li>a::after,
.is_illust .theme_link_list>li>span::after {
  border-color: transparent transparent transparent #cb2929;
}

.is_photo .theme_link_list>li>a::after,
.is_photo .theme_link_list>li>span::after {
  border-color: transparent transparent transparent #9f7943;
}

.is_illust .theme_link_list>li>a,
.is_illust .theme_link_list>li>span {
  border: solid 1px #d87d92;
  min-width: 105px;
  text-align: center;
}

.is_photo .theme_link_list>li>a,
.is_photo .theme_link_list>li>span {
  border: solid 1px #a88551;
  min-width: 105px;
  text-align: center;
}

/* all */
.is_illust .theme_link_list>li>a.is_all,
.is_illust .theme_link_list>li>span.is_all {
  background-color: #d87d92;
  color: #fff;
}

.is_photo .theme_link_list>li>a.is_all,
.is_photo .theme_link_list>li>span.is_all {
  background-color: #c49f69;
  color: #fff;
}

.is_illust .theme_link_list>li>a.is_all::after,
.is_illust .theme_link_list>li>span.is_all::after {
  border-color: transparent transparent transparent #fff;
}

.is_photo .theme_link_list>li>a.is_all::after,
.is_photo .theme_link_list>li>span.is_all::after {
  border-color: transparent transparent transparent #fff;
}

/* current */
.is_illust .theme_link_list>li>a.is_current,
.is_illust .theme_link_list>li>span.is_current {
  background-color: #cb2929;
  color: #fff;
}

.is_photo .theme_link_list>li>a.is_current,
.is_photo .theme_link_list>li>span.is_current {
  background-color: #7d5319;
  color: #fff;
}

.is_illust .theme_link_list>li>a.is_current::after,
.is_illust .theme_link_list>li>span.is_current::after,
.is_photo .theme_link_list>li>a.is_current::after,
.is_photo .theme_link_list>li>span.is_current::after {
  border: none;
  background-image: url(/app/themes/wp-templ/image-cmn/icon/ico-star01.png);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center center;
  width: 14px;
  height: 14px;
}
.is_illust .theme_link_list>li>span.is_current,
.is_photo .theme_link_list>li>span.is_current {
  padding: .7rem 2.4rem .6rem 1rem;
}
/* no link */
.is_illust .theme_link_list>li>a.no_link,
.is_illust .theme_link_list>li>span.no_link {
  background-color: #bbb;
  border-color: #bbb;
  color: #fff;
}

.is_photo .theme_link_list>li>a.no_link,
.is_photo .theme_link_list>li>span.no_link {
  background-color: #bbb;
  border-color: #bbb;
  color: #fff;
}

.is_illust .theme_link_list>li>a.no_link::after,
.is_illust .theme_link_list>li>span.no_link::after {
  border-color: transparent transparent transparent #fff;
}

.is_photo .theme_link_list>li>a.no_link::after,
.is_photo .theme_link_list>li>span.no_link::after {
  border-color: transparent transparent transparent #fff;
}

@media (min-width: 768px) {}

@media (max-width: 767px) {
  .theme_link_wrap {
    margin: 2rem auto 0;
    padding: 0 1rem;
    width: 100%;
  }

  .theme_link_col {
    width: 100%;
  }

  .theme_link_col:nth-of-type(2) {
    margin-top: 1rem;
  }

  .theme_link_title {
    font-size: 1.6rem;
    padding: .9rem .5rem;
  }

  .theme_link_list {
    padding: .5rem;
  }

  .theme_link_list>li {
    padding: .3rem .4rem;
  }

  .theme_link_list>li>a,
  .theme_link_list>li>span {
    font-size: 1.4rem;
    padding: .7rem 2.6rem .6rem 1.6rem;
  }
}

/* ------------------------------------ */
/* ▼ post area */
/* ------------------------------------ */
.post_area_wrap {
  margin: 4.5rem auto 0;
  max-width: 865px;
  width: 100%;
}

.post_item_wrap {
  margin: 2.3rem auto 0;
  max-width: 860px;
}

.post_item {
  background: url(/app/themes/wp-templ/image-cmn/spacer/bg-spacer-col4-01.png) no-repeat bottom 100px left 0;
  background-size: 100% auto;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.post_item>li {
  background-color: #fff;
  width: 31.784%;
}

.post_item_image {
  border: solid 1px #b7914f;
  display: block;
  overflow: hidden;
  padding-top: 99%;
  position: relative;
}

.post_item_image>img {
  position: absolute;
  top: 0;
  left: 0;
}

.post_item_info {
  line-height: 1.2;
  margin-top: .9rem;
  padding-left: .5rem;
}

.post_item_date {
  font-size: 1.5rem;
  letter-spacing: .04em;
}

.post_item_nickname {
  font-size: 1.7rem;
  margin-top: .3rem;
  letter-spacing: .04em;
}

.post_item_nickname .t_small {
  font-size: 1.4rem;
}

.post_item_note {
  border-top: solid 1px #b7914f;
  margin-top: .5rem;
  padding: .8rem 0 0 .5rem;
}

.post_item_title {
  font-size: 1.7rem;
  font-weight: 600;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.post_item_text {
  font-size: 1.7rem;
  line-height: 1.5;
  margin-top: .3rem;
  height: 3em;
  overflow: hidden;
}

.post_item_comment {
  font-size: 1.5rem;
  letter-spacing: .06em;
  margin-top: .1rem;
  padding-right: .4rem;
  text-align: right;
}

.post_item_link_wrap {
  margin-top: 1.1rem;
}

.post_item_link {
  max-width: 140px;
}

.post_item_link .cmn_normal_btn_inner {
  padding: 4px 2px;
}

.post_item_link .cmn_normal_btn_text {
  font-size: 1.5rem;
  letter-spacing: 0;
  padding: 0 2.1rem 0 1rem;
}

.post_item_link .cmn_normal_btn_text::after {
  right: 1.3rem;
}

@media (min-width: 768px) {
  .post_item>li {
    margin-left: 2.324%;
    position: relative;
  }

  .post_item>li:nth-of-type(n+4) {
    margin-top: 4rem;
  }

  .post_item>li:nth-of-type(3n+1) {
    margin-left: 0;
  }

  /* 隙間画像の1つ目を非表示
  .post_item>li:nth-of-type(4n+1):last-of-type:after,
  .post_item>li:nth-of-type(4n+2):last-of-type:after {
    background: #fff;
    content: "";
    display: block;
    height: 100%;
    position: absolute;
    left: 110%;
    top: 0;
    width: 100%;
  } */

}

@media (max-width: 767px) {
  .post_item_wrap {
    margin-top: 1rem;
    max-width: 600px;
  }

  .post_item {
    background: url(/app/themes/wp-templ/image-cmn/spacer/bg-spacer-col1-01.png) no-repeat bottom 100px left 0;
    background-size: 35% auto;
    background-position: right 12% bottom 100px;
    padding: 0 1.5rem;
  }

  .post_item>li {
    width: 47%;
  }

  .post_item>li:nth-of-type(even) {
    margin-left: 6%;
  }

  .post_item>li:nth-of-type(n+3) {
    margin-top: 2.5rem;
  }

  .post_item_date {
    font-size: 1.2rem;
  }

  .post_item_nickname {
    font-size: 1.4rem;
  }

  .post_item_nickname .t_small {
    font-size: 1.2rem;
  }

  .post_item_title {
    font-size: 1.4rem;
  }

  .post_item_text {
    font-size: 1.4rem;
  }

  .post_item_comment {
    font-size: 1.4rem;
    margin-top: .5rem;
  }

  .post_item_link_wrap {
    margin-top: .5rem;
  }

  .post_item_link .cmn_normal_btn_text {
    font-size: 1.4rem;
  }
}

