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

title : 日本の博物館情報
scope : 日本の博物館情報

memo：

last modify : 2021/01/12 WEB2TCI-24407_igarashi 新規作成

========================================================== */
/* ------------------------------------ */
/* ▼ 共通 上書き */
/* ------------------------------------ */
/* - cmn_bnr_area -- */
.cmn_bnr_area.col01 {
  max-width: 520px;
}
.cmn_bnr_area a {
  font-size: 0;
}

.cmn_bnr_area.col02 {
  justify-content: center;
}

.cmn_disc_list_01,
.cmn_rhombus_list_01 {
  padding-left: 20px;
}

.cmn_h3_01 {
  border-radius: initial;
  border: initial;
  font-size: 23px;
  text-align: left;
}
.cmn_h3_01>span {
  border-radius: initial;
  background: url('../image/bg-heading-h3.png') no-repeat left;
  background-size: cover;
  padding: 0.66em 1.6em;
}
.banner_h1 .txth1 {
  background-color: inherit;
}
.section_facility_map .cmn_section_desc {
  margin-bottom: 0;
}
.box_seo {
  margin: 90px auto 0;
}

@media (min-width: 768px) {
  .pr_bnr_contents_block {
    margin-top: 20px;
  }
}

@media (max-width: 767px) {
  .box_seo {
    margin: 40px auto 0;
  }
}

/* ------------------------------------ */
/* ▼ h1 */
/* ------------------------------------ */
.banner_h1 {
  margin: 0 auto;
  max-width: 1000px;
  width: 100%;
}

/* ------------------------------------ */
/* ▼ h2 */
/* ------------------------------------ */
.cmn_h2_01 {
  max-width: 864px;
}

/* ------------------------------------ */
/* ▼ cmn_intro_read */
/* ------------------------------------ */
.cmn_intro_read {
  max-width: 820px;
}

/* ------------------------------------ */
/* ▼ section */
/* ------------------------------------ */
.mw_600 {
  max-width: 600px;
  margin: 0 auto;
}
.mt_1em {
  margin-top: 1em;
}
.mt_2_3rem {
  margin-top: 2.3rem!important;
}
.cmn_section_desc.mb_25 {
  margin-bottom: 25px;
}
@media (min-width: 768px) {
  .cmn_section {
    margin-top: 50px;
  }

  .cmn_section:first-of-type {
    margin-top: 55px;
  }
}

.section_facility_map_desc {
  max-width: 780px;
}

.cmn_section_desc {
  margin-bottom: 45px;
}

@media (max-width: 767px) {
  .cmn_section {
    margin-top: 25px;
  }
  .cmn_section_desc {
    margin-bottom: 25px;
  }
}

/* ------------------------------------ */
/* ▼ facility_map_block */
/* ------------------------------------ */
.box_map_under_bnr {
  margin-top: 3%;
}

.facility_map_block {
  margin: 0 auto;
  max-width: 865px;
}

.facility_map_block_list_inner {
  display: flex;
  flex-wrap: wrap;
}

.facility_map_block_item {
  font-weight: 600;
}

.facility_map_block_name_text.lts_0 {
  letter-spacing: 0;
}

.facility_map_region {
  position: relative;
  text-align: center;
}

.facility_map_region::before {
  border-style: solid;
  content: "";
  display: block;
  height: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
}

.facility_map_region.lts_0 {
  letter-spacing: 0;
}

.facility_map_region a,
.facility_map_region span {
  display: block;
}

@media (min-width: 768px) {
  .facility_map_block {
    background: url("../image/bg-facility-map.png") right -70px top 10px / cover no-repeat;
    padding: 45px 20px 20px;
  }

  .facility_map_block_inner {
    position: relative;
  }

  .facility_map_block_item {
    align-items: center;
    display: flex;
  }

  .facility_map_block_item:not(:first-of-type) {
    margin-top: 14px;
  }

  .facility_map_block_name {
    color: #fff;
    letter-spacing: .06em;
    min-width: 150px;
    padding: 3px 10px 2px;
    text-align: center;
  }

  .facility_map_block_list {
    display: block !important;
    margin-left: 25px;
  }

  .facility_map_region {
    letter-spacing: .06em;
  }

  .facility_map_region:not(:first-of-type) {
    margin-left: 12px;
  }

  .facility_map_region::before {
    border-width: 5px 0 5px 8px;
  }

  .facility_map_region a,
  .facility_map_region span {
    color: #000;
    padding: 2px 0 2px 15px;
  }

  .facility_map_block_item.region01 .facility_map_region::before {
    border-color: transparent transparent transparent #4e71a9;
  }

  .facility_map_block_item.region01 .facility_map_block_name {
    background: #4e71a9;
  }

  .facility_map_block_item.region02 .facility_map_region::before {
    border-color: transparent transparent transparent #5799a3;
  }

  .facility_map_block_item.region02 .facility_map_block_name {
    background: #5799a3;
  }

  .facility_map_block_item.region03 .facility_map_region::before {
    border-color: transparent transparent transparent #358f7d;
  }

  .facility_map_block_item.region03 .facility_map_block_name {
    background: #358f7d;
  }

  .facility_map_block_item.region04 .facility_map_region::before {
    border-color: transparent transparent transparent #779323;
  }

  .facility_map_block_item.region04 .facility_map_block_name {
    background: #779323;
  }

  .facility_map_block_item.region05 .facility_map_region::before {
    border-color: transparent transparent transparent #b8932f;
  }

  .facility_map_block_item.region05 .facility_map_block_name {
    background: #b8932f;
  }

  .facility_map_block_item.region06 .facility_map_region::before {
    border-color: transparent transparent transparent #b3573c;
  }

  .facility_map_block_item.region06 .facility_map_block_name {
    background: #b3573c;
  }

  .facility_map_block_item.region07 .facility_map_region::before {
    border-color: transparent transparent transparent #c05e71;
  }

  .facility_map_block_item.region07 .facility_map_block_name {
    background: #c05e71;
  }

  .facility_map_block_item.region08 .facility_map_region::before {
    border-color: transparent transparent transparent #845c8b;
  }

  .facility_map_block_item.region08 .facility_map_block_name {
    background: #845c8b;
  }

  .facility_map_block_item.region09 .facility_map_region::before {
    border-color: transparent transparent transparent #4a86a8;
  }

  .facility_map_block_item.region09 .facility_map_block_name {
    background: #4a86a8;
  }

  .facility_map_block_item.region10 .facility_map_region::before {
    border-color: transparent transparent transparent #498556;
  }

  .facility_map_block_item.region10 .facility_map_block_name {
    background: #498556;
  }
  

  .facility_map_block_item .facility_map_region.region_gr {
    background-color: #ccc;
  }
}

@media (min-width: 768px) and (max-width: 1000px) {
  .facility_map_block_item {
    font-size: 1.8vw;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .facility_map_region:hover::before {
    opacity: 1;
  }
}

@media (max-width: 767px) {
  .facility_map_block {
    width: 80%;
  }

  .facility_map_block_item {
    border-top: 1px solid #fff;
  }

  .facility_map_block_name .cmn_link_btn_text {
    font-size: 16px;
  }

  .facility_map_block_list {
    display: none;
  }

  .facility_map_region {
    border-top: 1px solid #fff;
    width: 50%;
  }

  .facility_map_region:nth-of-type(2n) {
    border-left: 1px solid #fff;
  }

  .facility_map_region::before {
    border-color: transparent transparent transparent #fff;
    border-width: 4px 0 4px 5px;
    right: 10px;
  }

  .facility_map_region a,
  .facility_map_region span {
    color: #fff;
    padding: 8px 30px;
  }

  .facility_map_block_item.region01 .facility_map_region {
    background: #4e71a9;
  }

  .facility_map_block_item.region02 .facility_map_region {
    background: #5799a3;
  }

  .facility_map_block_item.region03 .facility_map_region {
    background: #358f7d;
  }

  .facility_map_block_item.region04 .facility_map_region {
    background: #779323;
  }

  .facility_map_block_item.region05 .facility_map_region {
    background: #b8932f;
  }

  .facility_map_block_item.region06 .facility_map_region {
    background: #b3573c;
  }

  .facility_map_block_item.region07 .facility_map_region {
    background: #c05e71;
  }

  .facility_map_block_item.region08 .facility_map_region {
    background: #845c8b;
  }

  .facility_map_block_item.region09 .facility_map_region {
    background: #4a86a8;
  }

  .facility_map_block_item.region10 .facility_map_region {
    background: #498556;
  }

  .facility_map_block_item .facility_map_region.region_gr {
    background: #666;
  }
}


.note {
  font-size: 16px;
  margin-top: 0.5em;
}

.note span:first-child {
  margin-right: 20px;
}

.note a {
  position: relative;
}

.note a::before {
  border-color: transparent transparent transparent #2b519b;
  border-style: solid;
  border-width: 6px 0 6px 8px;
  content: "";
  display: inline-block;
  height: 0;
  position: absolute;
  left: -0.7em;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
}

@media (max-width: 768px) {
  .note span {
    display: block;
  }
}

.box_img_caption {
  margin: 5px auto 0;
  text-align: center;
  font-size: 16px;
}

.box_txt {
  max-width: 720px;
  margin: 0.8em auto 0;
  letter-spacing: 0.02em;
}

/* ------------------------------------ */
/* ▼ ttl_green_rhombus */
/* ------------------------------------ */
.content_inner {
  margin-top: 30px;
  padding: 0 7%;
}

.ttl_green_rhombus {
  background: url(../image/bg-item02.png) repeat 0 0;
  text-align: center;
}

.ttl_green_rhombus>span {
  color: #000;
  display: block;
  font-weight: 600;
  margin: 0 auto;
  padding: 0 20px;
  width: 100%;
}

.ttl_green_rhombus>span>span {
  background-color: #ddd4b2;
  display: inline-block;
  letter-spacing: .06em;
  max-width: 450px;
  padding: 0.417em 0;
  position: relative;
  width: 100%;
}

.ttl_green_rhombus>span>span::before {
  background-image: url(../image/bg-line.png);
  right: calc(100% - 1px);
}

.ttl_green_rhombus>span>span::after {
  background-image: url(../image/bg-line.png);
  left: calc(100% - 1px);
}

.ttl_green_rhombus>span>span::before, 
.ttl_green_rhombus>span>span::after {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  content: "";
  display: block;
  position: absolute;
  top: 0;
  height: 100%;
  width: 5px;
}

.box_handle_list {
  background: url(../image/bg-tosho-info.png) repeat top left;
  display: flex;
  flex-wrap: wrap;
  padding: 15px 10px 20px 40px;
}

.handle_list_item {
  background: url(../image/ico-brown.png) no-repeat top 5px left / 17px 18px;
  font-weight: 600;
  letter-spacing: .06em;
  padding-left: 25px;
  margin-left: 4%;
}

.handle_list_item:nth-of-type(3n+1) {
  margin-left: 0;
  width: 26.48%;
}

.handle_list_item:nth-of-type(3n+2) {
  width: 34%;
}

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

  .handle_list_item {
    font-size: 15px;
    width: 49%;
  }
  .handle_list_item:nth-of-type(3n+1) {
    width: 49%;
  }

  .handle_list_item {
    margin-left: 0;
  }

  .handle_list_item:nth-of-type(even) {
    margin-left: 2%;
  }

  .handle_list_item:nth-of-type(n+3) {
    margin-top: .3em;
  }
  .handle_list_item:nth-of-type(3n+2) {
    width: 49%;
  }
}

/* ------------------------------------ */
/* ▼ tosho_info */
/* ------------------------------------ */
/* 刀剣情報を見る */
.tosho_info {
  background: url(../image/bg-tosho-info.png) repeat top left;
  background-size: 100% auto;
  border-top: 2px solid #b08a57;
  margin-bottom: 60px;
}

.tosho_info.top {
  margin-top: 50px;
}

.tosho_info_inner {
  margin: 0 auto;
  padding: 35px 0 26px;
  width: 680px;
}

.tosho_info .ttl {
  padding-bottom: 10px;
  text-align: center;
}

.tosho_info .ttl span {
  font-size: 20px;
  font-weight: 600;
  position: relative;
  padding: 0 1.3em;
}

.tosho_info .ttl span::before {
  left: -6%;
}

.tosho_info .ttl span::after {
  right: -6%;
}

.tosho_info .ttl span::before, 
.tosho_info .ttl span::after {
  background: url(../image/t_ico.png) no-repeat top left;
  background-size: contain;
  content: "";
  display: block;
  height: 19px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 29px;
}

.tosho_info .tosho_list li {
  padding-left: 1em;
  position: relative;
  width: 48.215%;
}

.tosho_info .tosho_list li::before {
  border-color: transparent transparent transparent #8e4245;
  border-style: solid;
  border-width: 6px 0 6px 8px;
  content: "";
  display: block;
  height: 0;
  position: absolute;
  top: 6px;
  left: 0;
  width: 0;
}

@media (max-width: 767px) {
  .tosho_info_inner {
    padding: 3% 0 4%;
    width: 90%;
  }
}

/* ------------------------------------ */
/* ▼ その他調整 */
/* ------------------------------------ */
section p:not(:first-of-type) {
  margin-top: 1rem;
}

.header_ttl_auction {
  font-size: 20px;
  font-weight: 600;
  color: #8e4144;
  margin: 0 0 .5em;
}

.cmn_h3_01.bg-qa {
  text-align: center;
  max-width: 675px;
}
.cmn_h3_01.bg-qa>span {
  background: url(../image/bg-heading-qa.png) no-repeat center;
  background-size: 100% 100%;
  padding: 0.4em 1.6em;
}

.qa_wrap {
  margin: 0 auto;
  width: 79%;
}
.qa_header {
  font-size: 18px;
  font-weight: 600;
  padding-top: 10px;
  padding-bottom: 10px;
  border-bottom: 2px solid #67924a;
}
.qa_answer {
  margin: 0 auto;
  width: 90%;
}
.qa_answer__sub_txt {
  max-width: 92%;
  margin: 0 auto!important;
}

.txt_green {
  color: #67924a;
}

@media (max-width: 767px) {
  .header_ttl_auction {
    font-size: 1.1em;
  }
  .qa_answer {
    width: 100%;
  }
}


/* ------------------------------------ */
/* ▼ attention_word */
/* ------------------------------------ */
.attention_word {
  max-width: 680px;
  margin: 40px auto 0;
}

#not-found .attention_word {
  display: none;
}
.attention_word_ttl {
  margin: 0 auto 10px;
  max-width: 530px;
  text-align: center;
}

.attention_word_ttl>span {
  display: inline-block;
  padding-bottom: 3px;
}

.attention_word_ttl>span>span {
  background: url('../image/bkg-title-related-sub.png') no-repeat center;
  background-size: 100% auto;
  color: #fff;
  display: inline-block;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.3;
  padding: 10px 55px 10px;
  position: relative;
}

.attention_word ul {
  font-size: 0;
  margin: auto;
}

.attention_word ul li {
  display: inline-block;
  font-size: 16px;
  letter-spacing: .06em;
  margin-bottom: 5px;
  padding: 0 15px;
  position: relative;
  vertical-align: top;
}

.attention_word ul li::after {
  background: #0a0a0a;
  content: "";
  height: 11px;
  margin-top: -6px;
  right: 0;
  position: absolute;
  top: 50%;
  width: 1px;
}

.attention_word input,
.attention_word label {
  display: none;
}

@media screen and (max-width: 767px) {
  .attention_word {
    margin: 30px auto 0;
    padding: 0;
    position: relative;
    width: 90%;
  }
  
  .attention_word_ttl {
    margin-bottom: 14px;
    max-width: 350px;
  }

  .attention_word_ttl>span>span {
    font-size: 16px;
  }

  .attention_word_ttl>span>span::before,
  .attention_word_ttl>span>span::after {
    background-size: 22px auto;
    margin-top: -14px;
  }

  .attention_word_ttl>span>span::before {
    left: 10px;
  }
  
  .attention_word_ttl>span>span::after {
    right: 10px;
  }

  .attention_word ul {
    width: 100%;
  }

  .attention_word ul li {
    background: #fff;
    display: inline-block;
    letter-spacing: 0;
    margin-bottom: 10px;
    margin: 0 1% 2%;
    padding: 0;
    text-align: center;
    width: 31%;
  }

  .attention_word ul li::after {
    display: none;
  }

  .attention_word ul li span {
    border: 1px solid #b28e5f;
    display: block;
    padding: 5px 0;
  }

  /* CSSアコーディオン */
  .attention_word-hide {
    height: 0;
    opacity: 0;
  }
  
  .attention_word label {
    border: 1px solid #b28e5f;
    bottom: -27px;
    box-sizing: content-box;
    color: #0d53de;
    display: block;
    font-size: 14px;
    height: 26px;
    left: 1%;
    letter-spacing: 0;
    line-height: 1.9em;
    margin: 0;
    padding: 0;
    position: absolute;
    text-align: center;
    width: 97%;
    z-index: 100;
  }
  
  .attention_word label::after {
    content: '+';
    display: inline-block;
    -webkit-transition: all .5s;
    transition: all .5s;
  }

  .attention_word input[type=checkbox]:checked ~ .attention_word-hide {
    height: auto;
    opacity: 1;
    transition: all .5s;
  }

  .attention_word input[type=checkbox]:checked + label::after {
    transform: rotate(45deg);
  }
}

@media only screen and (max-width: 413px) {
  .attention_word ul li {
    font-size: 0;
  }

  .attention_word ul li span {
    font-size: 10px;
    padding: 5px 0;
  }
}

/* ------------------------------------ */
/* ▼ レスポンシブ */
/* ------------------------------------ */
@media (max-width:768px) {
  .japanese_map_block .region.region02 {
    top: 24%;
  }
}

@media (max-width:767px) {
  .museum-list-btn .cmn_link_btn {
    width: 45%;
  }

  .japanese_map_block {
    width: 90%;
  }
  .japanese_map_block_inner {
    background: none;
    margin: 0 auto;
    padding: 0;
  }
  .japanese_map_block .japanese_map_block_inner .region {
    position: relative;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    width: 100%;
    margin-top: 2px;
  }
  .japanese_map_block .japanese_map_block_inner .region dt {
    border-bottom: 2px solid #fff;
    letter-spacing: .06em;
    font-size: 17px;
    margin: 0;
    position: relative;
    box-shadow: none;
    text-align: center;
  }
  .japanese_map_block .japanese_map_block_inner .region dt a {
    background: url(../image/anchor_bg.png);
  }
  .japanese_map_block .region dt a {
    font-size: 18px;
  }
  .japanese_map_block .japanese_map_block_inner .region dt::after {
    border-style: solid;
    border-width: 5px 0 5px 8px;
    border-color: transparent transparent transparent #fff;
    content: "";
    height: 0;
    position: absolute;
    right: 10px;
    top: calc(50% - 4px);
    width: 0;
  }
  .japanese_map_block .region dd {
    font-size: 16px;
    width: 100%;
  }
  .japanese_map_block .region.region01 ul {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }
  .japanese_map_block .japanese_map_block_inner .region li:nth-child(odd) {
    border-right: 1px solid #fff;
  }
  .japanese_map_block .japanese_map_block_inner .region li:nth-child(even) {
    border-left: 1px solid #fff;
  }
  .japanese_map_block .japanese_map_block_inner .region li:first-child, 
  .japanese_map_block .japanese_map_block_inner .region li:nth-child(2) {
    border-top: none;
  }
  .japanese_map_block .japanese_map_block_inner .region li {
  border-top: 2px solid #fff;
  margin: 0;
  width: 50%;
  }
  .japanese_map_block .region.region01 li a {
    background: #235292;
  }
  .japanese_map_block .japanese_map_block_inner .region li a, 
  .japanese_map_block .japanese_map_block_inner .region li > span {
    box-shadow: none;
    color: #fff;
  }
  .japanese_map_block .japanese_map_block_inner .region li a::after,
  .japanese_map_block .japanese_map_block_inner .region li > span::after {
    border-width: 0.3em 0.4em;
  }
  .japanese_map_block .region.region01 li a {
    background-color: #4e71a9;
  }
  .japanese_map_block .region.region02 li a {
    background-color: #0c7097;
  }
  .japanese_map_block .region.region03 li a {
    background-color: #358f7d;
  }
  .japanese_map_block .region.region04 li a {
    background-color: #3f6d35;
  }
  .japanese_map_block .region.region05 li a {
    background-color: #928915;
  }
  .japanese_map_block .region.region06 li a {
    background-color: #0c7544;
  }
  .japanese_map_block .region.region07 li a {
    background-color: #8a2c23;
  }
  .japanese_map_block .region.region08 li a {
    background-color: #966716;
  }
  .japanese_map_block .region.region09 li a {
    background-color: #9b1e61;
  }
  .japanese_map_block .region.region10 li a {
    background-color: #498556;
  }
  .japanese_map_block .region.region01 li:not(:first-of-type), 
  .japanese_map_block .region.region04 li:not(:first-of-type), 
  .japanese_map_block .region.region05 li:not(:first-of-type) {
    margin-top: 0;
  }
  .japanese_map_block .region.region01 dt a, 
  .japanese_map_block .region.region04 dt a, 
  .japanese_map_block .region.region05 dt a {
    padding: 5%;
  }
  .cmn_disc_list_01, .cmn_rhombus_list_01 {
    padding-left: 10px;
  }
}

/* ------------------------------------ */
/* ▼ 日本刀流通のしくみ */
/* ------------------------------------ */
.distribution-img-box {
  max-width: 720px;
  width: 100%;
  margin: 0 auto;
  position: relative;
}
.distribution-img-box.rect {
  max-width: 600px;
}
.box__detail .distribution-img-box img {
  border: none;
}
.distribution-img-box figcaption {
  margin-top: 5px;
  text-align: center;
  font-size: 16px;
  color: #821e7f;
}
.distribution-img-box a {
  position: absolute;
  display: block;
  background: #fff;
  width: 110px;
  height: 110px;
  border-radius: 50%;
}
.distribution-img-box a img:hover {
  opacity: 0.7;
}
.distribution-img-box a.distribution-img-btn01 {
  top: 37px;
  left: 104px;
}
.distribution-img-box a.distribution-img-btn02 {
  top: 37px;
  left: 374px;
}
.distribution-img-box a.distribution-img-btn03 {
  top: 133px;
  left: 239px;
}
.distribution-img-box a.distribution-img-btn04 {
  top: 133px;
  left: 509px;
}
.distribution-img-box.rect a.distribution-img-btn01 {
  top: 33px;
  left: 172px;
}
.distribution-img-box.rect a.distribution-img-btn02 {
  top: 33px;
  left: 317px;
}
.distribution-img-box.rect a.distribution-img-btn03 {
  top: 175px;
  left: 172px;
}
.distribution-img-box.rect a.distribution-img-btn04 {
  top: 175px;
  left: 317px;
}
.distribution-img-box.purchase a.distribution-img-btn01 {
  display: none !important;
}
.distribution-img-box.marketing a.distribution-img-btn02 {
  display: none !important;
}
.distribution-img-box.sell a.distribution-img-btn03 {
  display: none !important;
}
.distribution-img-box.buy a.distribution-img-btn04 {
  display: none !important;
}

/* ------------------------------------ */
/* ▼ tosho_area_recommend */
/* ------------------------------------ */
/* おすすめの刀剣店・刀剣商 tokyo only WEB2TCI-48253 */
.tosho_area_recommend{
  margin: 40px auto 80px;
}
.tosho_area_recommend h3{
  background: url(../image/h3-bg.png) no-repeat;
  background-size: cover;
  color: #fff;
  width: 780px;
  height:43px;
  max-width: 100%;
  text-align: center;
  font-weight: 600;
  padding: 10px;
}
.tosho_area_recommend h3 span{
  position: relative;
}
.tosho_area_recommend h3 span::before,
.tosho_area_recommend h3 span::after {
  background: url(../image/h3-ico-ttl-gold.png) no-repeat top left;
  background-size: contain;
  background-position: center;
  content: "";
  display: block;
  height: 16px;
  width: 22px;
  position: absolute;
  top:20%;
  right:-15%;
}
.tosho_area_recommend h3 span::before {
  left: -15%;
}
ul.recommend_list{
  display: flex;
  flex-wrap: wrap;
  padding: 15px 20px 30px 50px;
  background: url(../image/bg_tosho_area_recommend.jpg);
}
ul.recommend_list li {
  padding-left: 1em;
  position: relative;
  width: 45%;
  margin-top: 10px;
  margin-left: 10%;
}
ul.recommend_list li:nth-child(2n+1){
  margin-left: 0;
}
ul.recommend_list li::before {
  border-color: transparent transparent transparent #8e4245;
  border-style: solid;
  border-width: 6px 0 6px 8px;
  content: "";
  display: block;
  height: 0;
  position: absolute;
  top: 6px;
  left: 0;
  width: 0;
}
@media (max-width:768px) {
  .tosho_area_recommend h3{
    background: url(../image/h3-bg.png) no-repeat;
    background-size: cover;
    background-position: center;
  }
  ul.recommend_list{
    padding: 15px 10px 30px;
  }
}