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

title : 刀剣ワールド浮世絵 景色・風景から浮世絵を検索ページ
scope : 刀剣ワールド浮世絵 景色・風景から浮世絵を検索ページ

memo：

last modify : 2021/04/02 319_shimizu 動画コンテンツ追加

modify :
2020/11/30 TCI_yoneshima ラベルcss共通化
2020/08/14 福岡_uesugi カテゴリ（分類）検索機能の追加／新規作成
2020/08/14 福岡_uesugi カテゴリ（分類）検索機能の追加／新規作成

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

/* ------------------------------------ */
/* ▼ .banner_h1 */
/* ------------------------------------ */
.banner_h1 .txth1 {
  letter-spacing: .06em;
  line-height: 1.4;
}

.banner_h1 .search_name {
  display: block;
  font-size: 22px;
  line-height: 1.5;
}

@media ( max-width: 767px ) {
  .banner_h1 .txth1 {
    text-shadow: 2px 2px 4px #000;
  }

  .banner_h1 .search_name {
    font-size: 18px;
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .banner_h1 .txth1 {
    margin-top: 5px;
  }
}
/* ------------------------------------ */
/* ▼ box_description */
/* ------------------------------------ */
.box_description {
  padding: 30px 0;
}

@media (max-width: 767px) {
  .box_description {
    padding: 0 15px 6%;
  }
}


/* ------------------------------------ */
/* ▼ cmn_h2_01 */
/* ------------------------------------ */
.cmn_h2_01::before,
.cmn_h2_01::after {
  opacity: .5;
  top: 50%;
  transform: translateY(-50%);
}
.cmn_h2_01 > span {
  font-size: 24px;
  line-height: 1.2;
}
.cmn_h2_01 > span > span {/*iOS12.4の改行対策（暫定）*/
  min-width: 5em;
}

@media (max-width: 767px) {
  .cmn_h2_01 > span {
    font-size: 21px;
    padding: 13px 0;
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .cmn_h2_01 > span {
    padding-bottom: 6px;
    padding-top: 14px;
  }
}

/* ------------------------------------ */
/* ▼ cmn_h2_ukiyoe */
/* ------------------------------------ */
.cmn_h2_ukiyoe {
  display: block;
  font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝体", "游明朝", "Yu Mincho", YuMincho, "ＭＳ Ｐ明朝", "HG明朝E", "ryo-display-plusn", serif;
  font-feature-settings: "pkna";
  margin: 0 auto;
  max-width: 830px;
  position: relative;
  overflow: hidden;
  text-align: center;
}
.cmn_h2_ukiyoe::before {
  background-image: url(../../image-cmn/titleh2/flw01_l.png?date=20210506);
  background-position: right center;
  background-repeat: no-repeat;
  content: '';
  display: block;
  height: 86px;
  left: 0;
  position: absolute;
  bottom: calc(50% - 43px);
  width: 90px;
}
.cmn_h2_ukiyoe::after {
  background-image: url(../../image-cmn/titleh2/flw01_r.png?date=20210506);
  background-position: left center;
  background-repeat: no-repeat;
  content: '';
  display: block;
  height: 86px;
  position: absolute;
  right: 0;
  top: calc(50% - 43px);
  width: 90px;
}
.cmn_h2_ukiyoe>span {
  display: block;
  font-weight: 600;
  letter-spacing: 0;
  background: url(../image/bg-ttl02.jpg);
  background-size: 52px;
  font-size: 24px;
  line-height: 1.2;
  padding: 10px 120px;
  color:#fff;
}
.cmn_h2_ukiyoe>span>span {
  display: inline-block;
  font-feature-settings: "palt";
  letter-spacing: .075em;
  padding: 2px 35px 0;
  position: relative;
}
.cmn_h2_ukiyoe>span>span::after,
.cmn_h2_ukiyoe>span>span::before {
  background-image: url(../../image-cmn/titleh2/ico01.png?date=20210506);
  background-repeat: no-repeat;
  content: '';
  display: block;
  height: 18px;
  left: 0;
  margin-top: -9px;
  position: absolute;
  top: 50%;
  width: 27px;
}
.cmn_h2_ukiyoe>span>span::after {
  left: auto;
  right: 0;
}
.cmn_h2_ukiyoe::before,
.cmn_h2_ukiyoe::after {
  background-size: 100%;
  height: 50px;
  opacity: .5;
  top: 50%;
  transform: translateY(-50%);
  width: 188px;
}
.cmn_h2_ukiyoe:before {
  background: url(../image/ico-ttl-flower01_l.png) no-repeat right;
}
.cmn_h2_ukiyoe:after {
  background: url(../image/ico-ttl-flower01_r.png) no-repeat left;
}
.cmn_h2_ukiyoe > span > span {/*iOS12.4の改行対策（暫定）*/
  min-width: 5em;
}

@media (min-width: 768px) {
  .cmn_h2_ukiyoe {
    max-width: 900px;
  }
}

@media (max-width: 767px) {
  .cmn_h2_ukiyoe:before {
    left: -50px;
  }
  .cmn_h2_ukiyoe:after {
    right: -50px;
  }
  .cmn_h2_ukiyoe > span {
    font-size: 21px;
    padding: 13px 0;
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .cmn_h2_ukiyoe > span {
    padding-bottom: 6px;
    padding-top: 14px;
  }
}

/* ------------------------------------ */
/* ▼ content_wrap */
/* ------------------------------------ */
.content_wrap {
  margin-top: 45px;
  padding-bottom: 20px;
}

@media (max-width: 767px) {
  .content_wrap {
    margin-top: 25px;
    padding-bottom: 0;
  }
}

/* ------------------------------------ */
/* ▼ s_content */
/* ------------------------------------ */
@media (min-width: 768px) {
  .s_content {
    margin-top: 22px;
    padding: 0 10px;
  }
}

@media (max-width: 767px) {
  .s_content {
    margin-top: 15px;
    padding: 0 10px 20px;
  }
}

/* ------------------------------------ */
/* ▼ s_box_wrap */
/* ------------------------------------ */
.s_box_wrap {
  margin: 30px auto 0;
  max-width: 940px;
}

/* ------------------------------------ */
/* ▼ s_box_list */
/* ------------------------------------ */
.s_box_list {
  align-content: flex-start;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.s_box_item_thum {
  align-items: center;
  display: flex;
  line-height: 0;
  width: 100%;
}

.s_box_item_thum_inner {
  display: block;
  text-align: center;
  width: 100%;
}

.s_box_list li a {
  display: block;
}

.s_box_list .deco {
  position: relative;
}

.s_box_list .deco .s_box_item_thum {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  width: 74%;
}

.deco .s_box_item_thum img {
  width: 100%;
}

/* ------------------------------------ */
/* ▼ s_box_list_col1 */
/* ------------------------------------ */
.s_box_list_col1 {
  justify-content: center;
  margin: 0 auto;
  max-width: 800px;
}

.s_box_list_col1 li {
  display: flex;
  justify-content: center;
  width: 100%;
}

.s_box_list_col1 li a {
  display:inline-block;
  max-width: 100%;
  width: 100%;
}

.s_box_list_col1 .s_box_item_thum {
  padding: 0 19px 15px;
  width: auto;
}

.s_box_list_col1 .s_box_item_txt_area {
  text-align: left;
}

@media (max-width: 767px){
  .s_box_list_col1 .s_box_item_ttl {
    display: inline-block;
  }
}

/* ------------------------------------ */
/* ▼ s_box_list_col2 */
/* ------------------------------------ */
.s_box_list_col2 {
  margin: 0 auto;
  max-width: 900px;
}

.s_box_list_col2 li {
  width: 48.88%;
}

.s_box_list_col2 li.deco .s_box_item_thum {
  width: 50%;
}

@media (max-width: 767px) {
  .s_box_list_col2 li {
    width: 48.94%;
  }
  .s_box_list_col2 li:nth-of-type(2n) + .deco {
    display: none;
  }
}

@media (max-width: 414px) {
  .s_box_list_col2 li.deco .s_box_item_thum {
    width: 70%;
  }
}

/* ------------------------------------ */
/* ▼ s_box_list_col2 */
/* ------------------------------------ */
.s_box_list_col2 img {
  max-height: 220px;
}

.s_box_list_col2 .type_vertically img {
  max-height: 288px;
}

.s_box_list_col2 .deco img {
  max-height: none;
  max-width: 100%;
  width: 100%;
}

.s_box_list_col2 li.deco .s_box_item_thum {
  width: 100%;
}

@media (max-width: 767px){
  .s_box_list_col2 img,
  .s_box_list_col2 .type_vertically img,
    .s_box_list_col2 .deco img {
    max-height: none;
  }
}

/* ------------------------------------ */
/* ▼ s_box_list */
/* ------------------------------------ */
.s_box_list li {
  margin-bottom: 5.889%;
  padding: 0 8px;
  position: relative;
  z-index: 1;
}

.s_box_list li a.roll {
  -webkit-transition: all 0s;
  -moz-transition: all 0s;
  -o-transition: all 0s;
  transition: all 0s;
}

.deco .s_box_item_thum {
  background: none;
  border: none;
}

.s_box_item_txt_area {
  border-bottom: 1px solid #b28e5f;
  display: flex;
  align-items: flex-start;
}

.s_box_item_ttl {
  color: #000;
  margin-left: 3%;
  max-width: 79%;
  width: 100%;
}

.s_box_list_col2 .s_box_item_ttl {
  max-width: 77.8%;
}

.s_box_list .deco .deco_item {
  align-items: center;
  display: flex;
  justify-content: center;
  text-align: center;
}

.s_box_list.s_box_list_col1 .deco {
  display: none;
}

.s_box_item_ttl span {
  display: inline-block;
  font-feature-settings: 'pkna';
  position: relative;
  padding-right: 15px;
}

.s_box_item_ttl span:after {
  border-left: 12px solid #0d53de;
  border-bottom: 7px solid transparent;
  border-top: 7px solid transparent;
  content: "";
  height: 0;
  position: absolute;
  top: calc(50% - 7px);
  right: 0;
  width: 0;
}

.s_box_item_tag_wrap {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.s_box_item_tag {
  color: #fff;
  font-size: 14px;
  display: block;
  padding: 0 5px;
  width: auto;
  margin-right: 5px;
}
.s_box_item_tag.kassen {
  border: 1px solid #af1212;
  color: #af1212;
}
.s_box_item_tag.armor {
  border: 1px solid #dd6e13;
  color: #dd6e13;
}
.s_box_item_tag.busyo {
  border: 1px solid #294c92;
  color: #294c92;
}
.s_box_item_tag.meisyo {
  border: 1px solid #518b51;
  color: #518b51;
}
.s_box_item_tag.kozoku {
  border: 1px solid #5f8990;
  color: #5f8990;
}
.s_box_item_tag.meiji_emperor {
  border: 1px solid #15899b;
  color: #15899b;
}
.s_box_item_tag.meiji {
  border: 1px solid #aa5c3f;
  color: #aa5c3f;
}
.s_box_item_tag.yakusya {
  border: 1px solid #846d0f;
  color: #846d0f;
}
.s_box_item_tag.war {
  border: 1px solid #52662c;
  color: #52662c;
}
.s_box_item_tag.queue {
  border: 1px solid #bb5494;
  color: #bb5494;
}
.s_box_item_tag.fukei  {
  border: 1px solid #24790d;
  color: #24790d;
}
.s_box_item_tag.other  {
  border: 1px solid #b28e5f;
  color: #b28e5f;
}
.s_box_item_tag.youkai  {
  border: 1px solid #4c457a;
  color: #4c457a;
}
.s_box_item_tag.sword  {
  border: 1px solid #aa9400;
  color: #aa9400;
}

@media (min-width: 768px){
  .s_box_item_thum {
    padding: 0 12px 15px;
  }

  .s_box_item_txt_area {
    padding: 0 3px 12px;
  }

  .s_box_item_txt_area p {
    display: inline-block;
  }

  .s_box_item_tag_wrap {
    max-width: 93px;
  }

  .s_box_item_tag {
    margin-top: 5px;
  }

  .s_box_item_tag:nth-of-type(even) {
    margin-right: 0;
  }
}

@media (max-width: 767px){
  .s_box_item_thum {
    padding: 10px;
  }

  .s_box_item_txt_area {
    flex-wrap: wrap;
    padding: 4px 10px 10px;
  }

  .s_box_item_tag {
    margin-right: 5px;
  }

  .s_box_item_ttl {
    font-size: 14px;
    margin: 5px 0 0;
    max-width: 100%;
  }

}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .s_box_item_tag {
    margin-top: 0;
    padding-top: 4px;
  }
}

/* ------------------------------------ */
/* ▼ row_change_btn */
/* ------------------------------------ */
.row_change_btn {
  font-weight: 600;
  margin: 0 auto;
  text-align: center;
  max-width: 900px;
}

.row_change_btn span {
  background: #b28e5f;
  color: #FFF;
  cursor: pointer;
  padding: 7px 40px 6px 34px;
  position: relative;
}

/* ボタンをグレーにしたいときは common.css のグレーボタンにするクラス（.gr）の使用を検討してみてください */

.row_change_btn span::after {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 8px solid #FFFFFF;
  bottom: 12px;
  right: 15px;
  content: '';
  height: 0;
  margin: 0 0 0 -5px;
  position: absolute;
  width: 0;
}

.row_change_btn span:hover {
  opacity: .8;
}


@media (max-width: 767px) {
  .row_change_btn span {
    font-size: 17px;
    padding: 7px 25px 6px 25px;
  }
}

/* ------------------------------------ */
/* ▼ back-top */
/* ------------------------------------ */
.back-top {
  margin-top: 15px;
  text-align: right;
}

.back-top .cmn_link_btn {
  display: inline-block;
  height: 100%;
  width: auto;
}

.back-top .cmn_link_btn_text {
  font-size: 16px;
  letter-spacing: 0;
  line-height: 1.25;
  min-width: 197px;
  padding: 4px 30px 4px 10px;
}

.back-top .cmn_link_btn_text::after {
  border-width: 5px 0 5px 7px;
  right: 11px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media (max-width: 767px){
  .back-top {
    margin-right: 10px;
  }

  .back-top .cmn_link_btn_text {
    font-size: 15px;
    width: auto;
  }

  .back-top .cmn_link_btn_text::after {
    border-width: 4px 0 4px 6px;
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .back-top .cmn_link_btn_text {
    padding-top: 10px;
  }
}

/*  WEB2TCI-15621 adj_portraitのclass追加
------------------------------------------*/
/* 次のnth-of-typeが.s_box_list_col2 li全要素にかかるため指定 */
@media screen and (min-width: 768px) {
  .s_box_list_col2 li {
    overflow: hidden;
  }
  .s_box_list_col2 li a {
    width: 100%;
  }
  .s_box_list_col2 li:nth-of-type(even) a {
    float: left;
  }
  .s_box_list_col2 li:nth-of-type(odd) a {
    float: right;
  }
  .s_box_list_col2 li.adj_portrait a {
    width: 78%;
  }
}

/* YouTube動画掲載
------------------------------------------*/
.box__video {
  max-width: 830px;
  margin: 0 auto;
}
.box_s .box__title {
  background: url(/app/themes/wp-templ/ukiyoe-works/common/image/bkg_title_top.jpg) no-repeat top center;
  color: #fff;
  display: table;
  font-size: 19px;
  line-height: 1.3em;
  font-weight: 600;
  height: 60px;
  margin: 0 auto 30px;
  padding-top: 19px;
  position: relative;
  text-align: center;
  width: 100%;
}
.box_s .box__title::before {
  background: #b28e5f;
  content: '';
  display: block;
  height: 2px;
  margin-top: -1px;
  position: absolute;
  top: 50%;
  width: 100%;
}
.box_s .box__title > span span {
  display: inline-block;
  max-width: 550px;
  padding: 2px 35px 0;
  position: relative;
}
.box_s .box__title > span {
  background: url(/app/themes/wp-templ/ukiyoe-works/common/image/bkg_title_bottom.png) no-repeat bottom center;
  display: table-cell;
  padding-bottom: 18px;
  position: relative;
  z-index: 1;
  vertical-align: middle;
}
.box_s .box__title > span span {
  display: inline-block;
  max-width: 550px;
  padding: 2px 35px 0;
  position: relative;
}
.box_s .box__title > span span::after,
.box_s .box__title > span span::before {
  background: url(/app/themes/wp-templ/tips/image/ico02.png) no-repeat;
  content: '';
  display: block;
  height: 16px;
  left: 0;
  margin-top: -7px;
  position: absolute;
  top: 50%;
  width: 22px;
}
.box_s .box__title > span span::after {
  left: auto;
  right: 0;
}

@media (max-width:767px) {
  .box_s .box__title {
    background: url(/app/themes/wp-templ/ukiyoe-works/common/image/title_photo_sp_t.png) no-repeat top center;
    display: block;
    font-size: 16px;
    letter-spacing: 0.95px;
    height: auto;
    margin: 0 -5px 50px;
    padding-top: 7px;
    width: auto;
  }
  .box__video.box_s .wcm {
    padding: 0 20px;
  }
  .box_s .box__title > span {
    background: url(/app/themes/wp-templ/ukiyoe-works/common/image/title_photo_sp_b.png) no-repeat bottom center;
    display: block;
    padding-bottom: 7px;
  }
  .box_s .box__title > span span {
    line-height: 1.3;
    max-width: 230px;
    padding: 3px 20px 1px;
  }
  .box_s .box__title > span span::before,
  .box_s .box__title > span span::after {
    background-size: 100%;
    height: 11px;
    margin-top: -6px;
    width: 17px;
  }

  .video-title__text {
    padding: 0 10px;
    font-size: 16px;
  }
}

.cmn_box_item_movie {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin: 0 auto;
  width: 100%;
}
.cmn_item_movie a {
  display: block;
}
.cmn_box_item_movie .cmn_item_movie_thum {
  position: relative;
  overflow: hidden;
}
.cmn_box_item_movie .cmn_item_movie_thum img {
  vertical-align: bottom;
}

@media (min-width: 768px) {
  .cmn_item_movie {
    background-color: #fff;
  }
  .cmn_box_item_movie.cmn_box_item_movie_treat {
    position: relative;
  }
  .cmn_box_item_movie.cmn_box_item_movie_treat::before,
  .cmn_box_item_movie.cmn_box_item_movie_treat::after {
    content: '';
    display: block;
    position: absolute;
  }
  .cmn_box_item_movie.cmn_box_item_movie_treat::before {
    background: url(/app/themes/wp-templ/ukiyoe-works/common/image/bkg_video_l.png) no-repeat 0 0;
    background-size: contain;
    height: 243px;
    left: -50px;
    top: -13px;
    width: 266px;
  }
  .cmn_box_item_movie.cmn_box_item_movie_treat::after {
    background: url(/app/themes/wp-templ/ukiyoe-works/common/image/bkg_video_r.png) no-repeat 0 0;
    background-size: contain;
    bottom: 0;
    height: 215px;
    right: -120px;
    width: 393px;
  }
  .cmn_box_item_movie.col01 .cmn_item_movie {
    width: 320px;
  }
}
@media (max-width: 767px) {
  .cmn_box_item_movie.col01 .cmn_item_movie {
    max-width: 320px;
    width: 100%;
  }
  .cmn_box_item_movie.col01 .cmn_item_movie_thum::after {
    height: 35%;
    width: 35%;
  }
}

/* ------------------------------------ */
/*  列表示ボタンレイアウト変更対応*/
/* ------------------------------------ */
.row_change_btn_wrap {
  display: flex;
  justify-content: center;
}
.row_change_btn {
  display: inline-block;
  margin: 0;
  opacity: .6;
}
.row_change_btn > span {
  width: 100%;
}
.row_change_btn.is_active {
  opacity: 1;
}
.row_change_btn + .row_change_btn {
  margin-left: 10px;
}
.row_change_btn_inner {
  display: inline-block;
}
/* 3列表示の場合のレイアウト調整 */
.s_box_list_col3 li {
  width: 31.91%;
}
@media (max-width: 767px) {
  .s_box_list_col3 li {
    width: 48.94%;
  }
  .row_change_btn_wrap {
    padding-left: 10px;
    padding-right: 10px;
  }
  .row_change_btn {
    width: 50%;
    max-width: 200px;
  }
}
.s_box_list_col3 .s_box_item_txt_area .s_box_item_ttl {
  align-items: flex-start;
  flex-direction: column;
}
.s_box_list_col3 .s_box_item_txt_area span.s_box_item_btn {
  margin-left: auto;
}
.s_box_list_col3 li:nth-of-type(3n) + li.deco {
  display: none;
}
.s_box_list_col3 li:nth-of-type(3n-1):not(.deco) {
  margin-right: auto;
  margin-left: calc((20 / 940) * 100%);
}
.s_box_list_col3 .deco .s_box_item_thum {
  padding: 0;
  width: 100%;
}
@media (max-width: 767px) {
  .s_box_list_col3 li:nth-of-type(3n-1):not(.deco) {
    margin-right: initial;
    margin-left: initial;
  }
  .s_box_list_col3 li:nth-of-type(3n) + li.deco {
    display: block;
  }
}

/* 別案件の対応による崩れを調整（後に削除） */
.content_wrap.active .row_change_btn{
  display: flex;
  justify-content: center;
  margin: 0 auto;
  opacity: 1;
}
.content_wrap.active .row_change_btn span {
  padding: 2px 40px 2px 34px;
}

/* ------------------------------------ */
/* ▼ 城の浮世絵 */
/* ------------------------------------ */
/*common打消し*/
.tabs .tab_item .cmn_link_btn_text::before,
.tabs .tab_item .cmn_link_btn_text::after {
  display: none;
}
.tabs .tab_item.cmn_link_btn::before,
.tabs .tab_item.cmn_link_btn::after,
.tabs .tab_item.cmn_link_btn .cmn_link_btn_inner::before,
.tabs .tab_item.cmn_link_btn .cmn_link_btn_inner::after,
.tabs .tab_item .cmn_link_btn_text {
  border:none;
}

/*  すべての城・城別で探すタブ */
.tabs {
  margin: 0 auto;
  max-width:900px;
}
@media (max-width: 767px) {
  .tabs {
    max-width:98%;
  }
}
.tab_item {
  display: inline-block;
  position: relative;
  cursor: pointer;
  width: 260px;
  height:37px;
  margin: 0 0 -5px auto;
  opacity: .6;
  border-radius: 12px 12px 0 0;
  float: right;
}
.tab_item:hover {
  opacity: 0.75;
}
.tab_item.cmn_link_btn {
  position: relative;
  cursor: pointer;
  width: 260px;
  height:37px;
  margin: 0 0 -5px auto;
  opacity: .6;
  border-radius: 12px 12px 0 0;
}
.tabs .tab_item.cmn_link_btn .cmn_link_btn_inner::before,
.tabs .tab_item.cmn_link_btn .cmn_link_btn_inner::after {
  content: "";
  display: block;
  position: absolute;
  height:100%;
  width:100%;
  transform: none;
  left:0;
}
.tab_item .cmn_link_btn_text {
  color:#8E3AAD;
}

/* 選択中タブ */
.tabs input:checked + .tab_item {
  opacity: 1;
  background-color: #8E3AAD;
  border:1px solid #8E3AAD;
  height:50px;
  margin: 0 0 -5px auto;
}
.tabs input:checked + .tab_item span {
  font-size: 17px;
  color:#fff;
  padding: 10px 0 0;
}
.tabs input:checked + .tab_item.cmn_link_btn .cmn_link_btn_inner::after {
  background-image: url(../image/bg-btn-flower-l.png);
  background-size: contain;
  background-repeat: no-repeat;
  content: "";
  display: block;
  position: absolute;
  height:100%;
  width:100%;
  transform: none;
  left:0;
}
/* 選択なしタブ */
.tabs input:not(:checked) + .tab_item span {
  font-size: 16px;
}
.tabs input:not(:checked) + .cmn_link_btn_text {
  color:#8E3AAD;
  padding:0;
}
.tabs input:not(:checked) + .tab_item.cmn_link_btn{
  background-color: #fff;
  border:2px solid #711294;
  border-bottom: none;
  margin-top:9px;
  width: 258px;
}
.tabs input:not(:checked) + .tab_item.cmn_link_btn .cmn_link_btn_inner::after {
  background-image: url(../image/bg-btn-flower-r.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top right;
  content: "";
  display: block;
  position: absolute;
  height:100%;
  width:100%;
  transform: none;
  top:0;
  border-radius: 0 12px 0 0;
}

input[name="tab_item"] {
  display: none;
}
.tab_content {
  display: none;
  padding: 10px 0 0;
  clear: both;
}
#all:checked ~ #all_content,
#castle:checked ~ #castle_content {
  display: block;
  border-top: 5px solid #DAD1E0;
  margin: 0 auto;
}

@media only screen and (max-width: 767px) {
  .tab_item.cmn_link_btn {
    width: calc(50% - 3px);
    height:50px;
    margin: 0 auto;
  }
  /* 選択中タブ */
  .tabs input:checked + .tab_item {
    height:50px;
    margin: 0 0 -5px auto;
  }
  .tabs input:checked + .tab_item span {
    font-size: 15px;
    color:#fff;
    padding: 10px 0 0;
  }
  /* 選択なしタブ */
  .tabs input:not(:checked) + .tab_item.cmn_link_btn{
    border-bottom: 1px solid #B6A2C2;
    height:41px;
    margin-top:8px;
    width: calc(50% - 3px);
  }
  /* flower */
  .tabs input:checked + .tab_item.cmn_link_btn .cmn_link_btn_inner::after,
  .tabs input:not(:checked) + .tab_item.cmn_link_btn .cmn_link_btn_inner::after {
    display: none;
  }
}

/*tab中身 padding調整*/
.tab_content ul.s_box_list li{
  padding: 0;
}
.btn_wrap {
  display: flex;
  justify-content: flex-end;
  margin: 0 auto 30px;
  border-bottom: 5px solid #DAD1E0;
  max-width:940px;
}
@media (max-width: 767px) {
  .btn_wrap {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    max-width:98%;
  }
}

.search_link_wrap {
  max-width: 820px;
  margin: 0 auto;
}
.search_link_list_wrap{
  margin: 0 auto 30px -80px;
  width: 980px;
  background: url(../image/bg-castle.jpg) repeat;
  padding:0 40px 20px;
}
.title_h2_link {
  background: url(../image/ico_ttl01.png) no-repeat left 6px center;
  border-bottom: 2px solid #97764b;
  color: #826846;
  padding: 7px 10px 7px 32px;
  position: relative;
}
.title_h2_link .title_sub {
  letter-spacing: .06em;
  position: absolute;
}
.search_link_list {
  display: flex;
  flex-wrap: wrap;
  width:100%;
}
.search_link_list li {
  width: calc(890px / 4 - 7.5px);
  margin-left:10px;
  display: block;
  background-color: #fff;
  border:1px #000 solid;
  border-left:3px #000 solid;
}
.search_link_list li:first-child,.search_link_list li:nth-child(4n+1) {
  margin-left:0;
}
.search_link_list li.active {
  font-weight: bold;
}
.search_link_list li.active a:before {
  border: none;
}
.search_link_list li a {
  display: block;
  padding: 0 5px 0 8px;
  position: relative;
  color:#000;
  font-weight: bold;
  letter-spacing:-0.05em;
}
.search_link_list li a:before {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 8px solid #000;
  content: "";
  height: 0;
  position: absolute;
  top: 10px;
  right: 5px;
  width: 0;
}
@media (min-width: 1030px) {
  .search_link_list li {
    margin-bottom: 5px;
    padding:10px 0;
  }
  .search_link_list_cat {
    padding-top: 25px;
  }
}
@media (max-width: 767px) {
  .search_link_wrap {
    max-width: 100%;
  }
  .search_link_list_wrap{
    margin: 0 auto 30px;
    width: 100%;
    background: url(../image/bg-castle.jpg) repeat;
    padding:0 0.1% 3px;
  }
  .search_link_list {
    padding: 0 10px;
  }
  .search_link_list li {
    margin-bottom: 10px;
    width: 49%;
    margin:3px auto;
    padding:5px 0;
  }
  .search_link_list li a {
    font-size: 14px;
  }
  .search_link_list li a:before {
    top: 6px;
  }
  .search_link_list_cat {
    padding-top: 20px;
  }
  .search_link_list li:first-child,.search_link_list li:nth-child(2n+1) {
    margin-left:0;
  }
}

@media (min-width: 768px) {
  .search_link_wrap {
    margin-bottom: 35px;
  }
  .title_h2_link {
    font-size: 25px;
    margin-bottom: 19px;
  }
  .title_h2_link .title_sub {
    font-size: 18px;
    bottom: 7px;
    right: 6px;
  }
}
@media (max-width: 767px) {
  .search_link_wrap {
    padding: 0 10px;
    margin-bottom: 30px;
  }
  .title_h2_link {
    font-size: 21px;
    margin-bottom: 10px;
  }
  .title_h2_link .title_sub {
    font-size: 15px;
    bottom: 4px;
    right: 3px;
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .title_h2_link {
    padding-bottom: 4px;
    padding-top: 10px;
  }
}