@charset "utf-8";
/* CSS Document */
@media only screen and (max-width: 980px) {
  img {
    max-width: 100%;
    height: auto;
  }
  body {
    font-size: 1.3rem;
    line-height: 1.8;
  }
  .pc_none {
    display: block;
  }
  .br {
    display: none;
  }
  /* ロゴ
------------------------------------------------- */
  h1.logo_m78 {
    padding: 25px 5%;
  }
  h1.logo_m78 img {
    width: 243px;
  }
  /* main
------------------------------------------------- */
  .ultra_copy {
    bottom: 10px;
    right: 10px;
    width: 70px;
  }
  /* コンセプト
------------------------------------------------- */
  section.concept {
    padding: 8% 5% 17%;
  }

  .comment {
    flex-direction: column;
  }
  .comment img {
    max-width: 100%;
    height: auto;
  }
  .comment picture {
    width: 185px;
    margin-bottom: 50px;
  }
  .comment div {
    width: 90%;
    margin: auto;
    letter-spacing: 0.1em;
  }
  .comment h1 {
    text-align: center;
    margin-bottom: 10px;
  }
  .red_btn a {
    padding: 8px 20px;
    border: solid 2px #FFF;
    border-radius: 5px;
    width: 90%;
    margin: 30px auto 0;
    box-shadow: 8px 8px 3px 0px rgba(4, 0, 0, 0.34);
  }
  .soon {
    padding: 8px 20px;
    border: solid 2px #d52430;
    border-radius: 5px;
    width: 90%;
    margin: 30px auto 0;
  }
  /* アイコンのスタイル */
  .red_btn a::after {
    right: 17px;
    border-top: 5px solid transparent;
    border-left: 8px solid #fff;
    border-bottom: 5px solid transparent;
  }
  .xred_btn a:hover::after {
    right: 10px;
  }
  section.concept dl {
    text-align: left;
    letter-spacing: -0.05em;
  }
  section.concept dl dt {
    margin-bottom: 20px;
  }
  section.concept dl dd {
    margin-top: 0;
  }
  section.concept dl dd strong {
    font-size: 125%;
  }
  /* 商品詳細
------------------------------------------------- */
  section.products {
    padding: 30px 5% 20px;
  }
  .products_in h1 {
    font-size: 33px;
    margin-bottom: 0px;
  }
  /* 線全体の設定 */
  .products_in h1::before, .products_in h1::after {
    height: 2px; /* 線の太さ */
  }
  /* 左の線：右に向かって薄く */
  .products_in h1::before {
    background-color: #a42c3e;
    margin-right: 30px;
  }
  /* 右の線：左に向かって薄く */
  .products_in h1::after {
    margin-left: 12px;
  }
  .white_box {
    border-radius: 10px;
    padding: 5%;
    flex-direction: column;
    margin-bottom: 30px;
    box-shadow: 10px 10px 3px 0px rgba(4, 0, 0, 0.1);
  }
  .white_box picture {
    display: block;
    width: 100%;
    font-size: 1rem;
    text-align: center;
    margin-bottom: 30px;
  }
  .white_box picture img {
    width: 25%;
    margin: auto;
    margin-bottom: 5px;
  }
  .white_box .dtl {
    width: 100%;
    text-align: center;
  }
  .border_box {
    border: solid 2px #a42c3e;
    padding: 10px 10px 10px;
    margin-bottom: 25px;
  }
  .border_box + .border_box {
    margin-bottom: 10px;
  }
  .border_box h2 {
    top: -12px;
    left: 10px;
    padding: 0 5px;
    font-size: 17px;
  }
  .border_box p {
    margin-bottom: 0;
    font-size: 1.5rem;
  }
  .border_box p + p {
    margin-bottom: 0;
  }
  .border_box p span {
    margin-top: 15px;
  }
  .border_box p span::before, .border_box p span::after {
    width: 1px;
    height: 10px;
  }
  .border_box p img {
    width: 50%;
    display: block;
    margin: 10px auto 0;
  }
  .dtl_txt {
    font-size: 1rem;
  }
  .ultra_copyblack{
	margin: 30px auto 0;
	width: 100px;
}
}