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

title : 天下三名槍 下層ページ 共通CSS
scope : 天下三名槍 下層ページ 共通CSS

memo： 接頭辞に「dcmn_」を付与する

last modify : 2020/11/17 TCI_福岡／WEB2TCI-14713

========================================================== */
/* ------------------------------------ */
/* ▼ ページ全体に影響する共通上書き */
/* ------------------------------------ */
img {
  vertical-align: bottom;
}

@media (min-width:768px) {
  .cmn_table_of_contents.adj_position {
    margin: 0 0 0 100px;
  }
}

/* ------------------------------------ */
/* ▼ 共通 */
/* ------------------------------------ */
@media (min-width: 768px) {
  .dcmn_pc_taC {
    text-align: center!important;
  }
}

@media screen and (max-width: 767px) {
  .dcmn_sp_taC {
    text-align: center!important;
  }
}

/* ------------------------------------ */
/* ▼ wrap */
/* ------------------------------------ */
.dcmn_contents_all_wrap {
  padding-right: 10px;
  padding-left: 10px;
}

.dcmn_contents_all_wrap .cmn_section {
  padding-right: 0;
  padding-left: 0;
}

/* ------------------------------------ */
/* ▼ MV */
/* ------------------------------------ */
.dcmn_mv_wrap {
  margin: auto;
  position: relative;
}

.dcmn_mv_text {
  color: #fff;
  font-weight: 600;
  letter-spacing: .06em;
  line-height: 1.5;
  position: absolute;
  top: 50%;
  left: 0;
  text-align: center;
  width: 100%;
  transform: translateY(-50%);
}

@media (min-width: 768px) {
  .dcmn_mv_text {
    font-size: 36px;
  }
}

@media screen and (max-width: 1000px) {
  .dcmn_mv_text {
    font-size: 3.6vw;
    line-height: 1.4;
  }
}

@media screen and (max-width: 767px) {
  .dcmn_mv_wrap {
    width: calc(100% - 20px);
  }

  .dcmn_mv_text {
    font-size: 5.5vw;
    line-height: 1.2;
  }
}

/* ------------------------------------ */
/* ▼ リード文 */
/* ------------------------------------ */
.dcmn_first_read.cmn_intro_read {
  max-width: 800px;
  padding: 0 10px;
}

/* ------------------------------------ */
/* ▼ h2 01 */
/* ------------------------------------ */
.dcmn_h2_01 {
  color: #000;
  font-weight: 600;
  letter-spacing: .06em;
  line-height: 1.2;
  overflow: hidden;
  text-align: center;
}

.dcmn_h2_01>span {
  display: inline-block;
  position: relative;
}

.dcmn_h2_01>span::before,
.dcmn_h2_01>span::after {
  background: url(/app/themes/wp-templ/replica-tenga-sanmeisou/image/detail/ttl-h2-01-line.png);
  content: "";
  display: block;
  height: 4px;
  position: absolute;
  top: calc(50% - 2px);
  width: 500px;
}

.dcmn_h2_01>span::before {
  right: 100%;
}

.dcmn_h2_01>span::after {
  left: 100%;
}

@media (min-width: 768px) {
  .dcmn_h2_01 {
    font-size: 1.111em;
    padding: 0 2em;
  }

  .dcmn_h2_01>span {
    padding: 0 1.4em;
  }
}

@media screen and (max-width: 767px) {
  .dcmn_h2_01 {
    font-size: 1.267em;
    padding: 0 1em;
  }

  .dcmn_h2_01>span {
    padding: 0 .6em;
  }
}

/* ------------------------------------ */
/* ▼ h2 02 */
/* ------------------------------------ */
.dcmn_h2_02 {
  background-color: #55462e;
  color: #fff;
  font-weight: 600;
  letter-spacing: .06em;
  line-height: 1.2;
  overflow: hidden;
  text-align: center;
}

.dcmn_h2_02>span {
  display: inline-block;
}

@media (min-width: 768px) {
  .dcmn_h2_02 {
    background-image:
      url(/app/themes/wp-templ/replica-tenga-sanmeisou/image/detail/ttl-h2-02-sword-left.png),
      url(/app/themes/wp-templ/replica-tenga-sanmeisou/image/detail/ttl-h2-02-sword-right.png);
    background-repeat: no-repeat, no-repeat;
    background-position: left center, right center;
    font-size: 1.222em;
    padding: .2278em 6.7em;
  }
}

@media screen and (max-width: 767px) {
  .dcmn_h2_02 {
    font-size: 1.267em;
    padding: .4em .5em;
  }
}

@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
  .dcmn_h2_02 {
    padding: .35em 6.7em .1056em;
  }
}

/* ------------------------------------ */
/* ▼ heading octa_01 */
/* ------------------------------------ */
.dcmn_h_octa_01 {
  font-size: 1.056em;
  max-width: 1000px;
  overflow: hidden;
  text-align: center;
}

.dcmn_h_octa_01_border {
  display: inline-block;
  position: relative;
}

.dcmn_h_octa_01_border::before,
.dcmn_h_octa_01_border::after {
  background-color: #9f792e;
  content: "";
  display: block;
  height: 2px;
  position: absolute;
  top: calc(50% - 1px);
  width: 400px;
}

.dcmn_h_octa_01_inner {
  background-image:
    url(/app/themes/wp-templ/replica-tenga-sanmeisou/image/detail/bg-h-octa-01-round-01.png),
    url(/app/themes/wp-templ/replica-tenga-sanmeisou/image/detail/bg-h-octa-01-round-02.png),
    url(/app/themes/wp-templ/replica-tenga-sanmeisou/image/detail/bg-h-octa-01-round-03.png),
    url(/app/themes/wp-templ/replica-tenga-sanmeisou/image/detail/bg-h-octa-01-round-04.png);
  background-position:
    left top,
    right top,
    right bottom,
    left bottom;
  background-repeat:
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat;
  background-size:
    12px 12px,
    12px 12px,
    12px 12px,
    12px 12px;
  display: block;
  padding: 5px 12px;
  position: relative;
}

.dcmn_h_octa_01_inner::before,
.dcmn_h_octa_01_inner::after {
  background-position: 0 0;
  background-repeat: repeat-x;
  background-size: 1px 5px;
  content: "";
  display: block;
  height: 5px;
  position: absolute;
  left: 50%;
  width: calc(100% - 22px);
  transform: translateX(-50%);
}

.dcmn_h_octa_01_inner::before {
  background-image: url(/app/themes/wp-templ/replica-tenga-sanmeisou/image/detail/bg-h-octa-01-top.png);
  top: 0;
}

.dcmn_h_octa_01_inner::after {
  background-image: url(/app/themes/wp-templ/replica-tenga-sanmeisou/image/detail/bg-h-octa-01-bottom.png);
  bottom: 0;
}

.dcmn_h_octa_01_txt {
  background-color: #9f792e;
  background-image:
    url(/app/themes/wp-templ/replica-tenga-sanmeisou/image/detail/bg-h-octa-01-spacer.png),
    url(/app/themes/wp-templ/replica-tenga-sanmeisou/image/detail/bg-h-octa-01-spacer.png);
  background-size: 21px 14px, 21px 14px;
  background-repeat: no-repeat, no-repeat;
  background-position: left 2.5em center, right 2.5em center;
  color: #fff;
  display: block;
  font-weight: 600;
  letter-spacing: .065em;
  line-height: 1.2;
  margin-right: -1px;
  margin-left: -1px;
  text-align: center;
}

.dcmn_h_octa_01_txt::before,
.dcmn_h_octa_01_txt::after {
  background-position: 0 0;
  background-repeat: repeat-y;
  background-size: 12px 1px;
  content: "";
  display: block;
  height: calc(100% - 22px);
  position: absolute;
  top: 50%;
  width: 12px;
  transform: translateY(-50%);
}

.dcmn_h_octa_01_txt::before {
  background-image: url(/app/themes/wp-templ/replica-tenga-sanmeisou/image/detail/bg-h-octa-01-left.png);
  left: 0;
}

.dcmn_h_octa_01_txt::after {
  background-image: url(/app/themes/wp-templ/replica-tenga-sanmeisou/image/detail/bg-h-octa-01-right.png);
  right: 0;
}

@media (min-width: 768px) {
  .dcmn_h_octa_01 {
    padding: 0 2em;
  }

  .dcmn_h_octa_01_border::before {
    right: calc(100% + 20px);
  }

  .dcmn_h_octa_01_border::after {
    left: calc(100% + 20px);
  }

  .dcmn_h_octa_01_txt {
    padding: .29em 4.2em;
  }
}

@media screen and (max-width: 767px) {
  .dcmn_h_octa_01 {
    font-size: 1.067em;
    padding: 0 1em;
  }

  .dcmn_h_octa_01_border::before {
    right: calc(100% + 10px);
  }

  .dcmn_h_octa_01_border::after {
    left: calc(100% + 10px);
  }

  .dcmn_h_octa_01_inner {
    min-width: 250px;
  }

  .dcmn_h_octa_01_txt {
    background-position: left center, right center;
    letter-spacing: .04em;
    line-height: 1.1;
    padding: .4em 1.5em;
  }
}

@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
  .dcmn_h_octa_01_txt {
    padding: .4em 4.2em .18em;
  }
}

/* ------------------------------------ */
/* ▼ contents text float image */
/* ------------------------------------ */
.dcmn_contents_wrap {
  margin-right: auto;
  margin-left: auto;
  max-width: 720px;
  padding-right: 20px;
  padding-left: 20px;
  width: 100%;
}

@media (min-width: 768px) {
  .dcmn_contents_wrap .cmn_text_block {
    line-height: 1.65;
  }

  .dcmn_contents_wrap .cmn_float_wrap_01 .cmn_text_block {
    margin-top: 0;
  }

  .dcmn_contents_wrap .cmn_float_wrap_01 .cmn_img_block {
    clear: both;
    margin-bottom: 1.3em;
    max-width: 302px;
    min-width: 302px;
  }

  .dcmn_contents_wrap .cmn_float_wrap_01.cmn_float_right .cmn_img_block {
    margin-left: 32px;
  }

  .dcmn_contents_wrap .cmn_float_wrap_01.cmn_float_left .cmn_img_block {
    margin-right: 32px;
  }

  .dcmn_contents_wrap .cmn_float_wrap_01 .cmn_img_block img {
    border: #888 solid 1px;
    text-align: center;
  }

  .cmn_img_block.dcmn_adjust_mt01 {
    margin-top: .3em;
  }

  .dcmn_contents_wrap .cmn_img_block>figcaption {
    margin-top: .1em;
  }
}

@media screen and (max-width: 767px) {
  .dcmn_contents_wrap .cmn_float_wrap_01 .cmn_img_block + .cmn_img_block {
    margin-top: 1em;
  }
}

/* ------------------------------------ */
/* ▼ column1 image large */
/* ------------------------------------ */
@media (min-width: 768px) {
  .dcmn_1col_large {
    margin-right: auto;
    margin-left: auto;
    max-width: 642px;
  }
}

/* ------------------------------------ */
/* ▼ text banner layout */
/* common.cssのテキストバナーレイアウトを調整 */
/* ------------------------------------ */
.bnr_line.dcmn_text_bnr {
  margin-top: 0;
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .dcmn_text_bnr.cmn_bnr_area.col01 {
    max-width: 504px;
  }

  .bnr_line.dcmn_text_bnr.in_contents {
    margin-right: -30px;
    margin-left: -30px;
  }

  .bnr_line.dcmn_text_bnr>ul {
    display: flex;
    flex-wrap: wrap;
  }
}

@media screen and (max-width: 767px) {
  .dcmn_text_bnr .bnr_line2 .cmn_bnr_cap {
    font-size: 1.4rem;
    margin-top: 7px;
  }

  .dcmn_text_bnr .bnr_single_line .cmn_bnr_cap {
    margin-right: auto;
    margin-left: auto;
    max-width: 504px;
  }

  .bnr_line.dcmn_text_bnr>ul {
    max-width: 500px;
    width: 100%;
  }

  .bnr_line.dcmn_text_bnr .bnr_line2 {
    max-width: 500px;
  }
}

/* ------------------------------------ */
/* ▼ text banner image */
/* common.cssのテキストバナー画像を調整 */
/* ------------------------------------ */
/* 1カラムバナーサイズの画像をSP時に600x300サイズに切り替える */
@media screen and (max-width: 767px) {
  /* 刀剣写真・日本刀画像一覧 */
  .dcmn_text_bnr .bnr_single_line .bnr_box.bf_search_link {
    background-image: url(https://webcdn.token.co.jp/www08/token/banner_all/touken-world/bnr-search-link-600x300.jpg);
  }

  /* 武将・歴史人の日本刀 */
  .dcmn_text_bnr .bnr_single_line .bnr_box.bf_sword_legend_link {
    background-image: url(https://webcdn.token.co.jp/www08/token/banner_all/touken-world/bnr-sword-legend-link-600x300.jpg);
  }
}

/* ------------------------------------ */
/* ▼ movie youtube */
/* ------------------------------------ */
.dcmn_movie_section .dcmn_h_octa_01 {
  max-width: 760px;
}

.dcmn_movie_wrap {
  padding-right: 20px;
  padding-left: 20px;
}

.dcmn_movie_link {
  background-color: #000;
  border: solid 1px #888;
  display: block;
  margin-right: auto;
  margin-left: auto;
  max-width: 322px;
  position: relative;
  width: 100%;
}

.dcmn_movie_link::before {
  background: url(/app/themes/wp-templ/replica-tenga-sanmeisou/image/detail/ico-play.png) no-repeat center center;
  background-size: 100% auto;
  content: "";
  display: block;
  padding-top: 46px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 46px;
}

@media (min-width: 768px) {
  .dcmn_movie_section.has_spacer {
    background-image:
      url(../image/detail/bg-spacer-flower-01.png),
      url(../image/detail/bg-spacer-flower-02.png);
    background-repeat: no-repeat;
    background-position:
      calc(50% - 373px) calc(100% - 14px),
      calc(50% + 392px) calc(100% - 11px);
  }
}

/* ------------------------------------ */
/* ▼ SNS */
/* ------------------------------------ */
.cmn_sns_box {
  max-width: 480px;
}

@media (min-width: 768px) {
  .cmn_sns_box_read_text {
    letter-spacing: 0;
    padding-right: 10px;
  }
}