@charset "UTF-8";
/********************************************/
/*layout Base */
/********************************************/
/***************************/
/**Color */
/***************************/
.co_red {
  color: #ff0000;
}

/***************************/
/**bg */
/***************************/
.bg_texture {
  background: url(../img/brand/pattern-texture.png) repeat;
}

/********************************************/
/* ttl */
/********************************************/
.center_ttl {
  position: relative;
  margin-bottom: 1.5em;
  text-align: center;
}
.center_ttl span {
  display: inline-block;
  min-width: 280px;
  padding: 1em 1em 1em;
  background: #502d14;
  color: #fff;
  text-align: center;
  font-size: clamp(2rem, 2vw, 2.4rem);
}
@media (max-width: 768px) {
  .center_ttl span {
    min-width: 210px;
    padding: 1em 0.5em 0.5em;
  }
}
.center_ttl.position_ttl {
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 2;
}

.sp_ttl_block {
  position: relative;
}
.sp_ttl_block .center_ttl {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(100% - 30px);
  text-align: center;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 2;
}
.sp_ttl_block .center_ttl span {
  display: inline-block;
  min-width: 50vw;
  padding: 2em 1em;
  background: rgba(80, 45, 20, 0.85);
}

/********************************************/
/* btn */
/********************************************/
.arr_btn a {
  position: relative;
  display: block;
  width: 100%;
  max-width: 300px;
  margin: auto;
  padding: 0.85em 2em 0.85em 1em;
  background-color: #fff;
  border: solid 1px #502d14;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
@media (max-width: 768px) {
  .arr_btn a {
    max-width: 270px;
  }
}
.arr_btn a:after {
  position: absolute;
  top: calc(50% - 0.5em);
  right: 15px;
  content: "▶";
  line-height: 1;
  color: inherit;
  font-size: 1.3rem;
}
.arr_btn a:hover {
  background-color: #502d14;
  color: #fff;
}

/********************************************/
/* 追加 */
/********************************************/
.object_fit {
  position: relative;
}
.object_fit img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  font-family: "object-fit: cover;"; /*IE対策*/
}

/*=============================================*/
/*media query    SmartPhone */
/*=============================================*/
@media screen and (max-width: 767px) {
  /********************************************/
  /* ttl */
  /********************************************/
  .border_left_ttl {
    font-size: 2.3rem;
  }
  .border_left_ttl:after {
    height: 3px;
  }
  .center_bottom_ttl {
    font-size: 2.3rem;
  }
  .center_bottom_ttl:after {
    height: 3px;
  }
  /********************************************/
  /* btn */
  /********************************************/
  .red_btn a {
    font-size: 1.5rem;
  }
}/*# sourceMappingURL=component.css.map */