@charset "UTF-8";

/* =============================================
 Products CSS
============================================= */

/* ================ page main image ================ */

.page_main_img{
    background-color: #EEE;
    background-image: url(../img/main_img.jpg?20241211);
}

/* ================  ================ */
.fix{
  display: flex;
  flex-wrap: wrap;
  }
h1.contents_title {
  color: #886b3d;
  font-size: 24px;
  margin-bottom: 20px;
}

.products ul{
  margin: 10px 10px 30px;
}

.products ul li{
  /* height: 60px; */
  border-bottom: dotted #ddd 1px;
  padding: 1.2rem 0 1.2rem;
  clear: both;
}
.products ul li i{
  float: right;
}
.products .float_box_md{
  padding: 0 10px;
  position: relative;
  z-index: 10;
  width: 50%;
}

.products_tag{
  position: absolute;
  z-index: 20;
  left: 0;
  padding: 10px 20px;
  background-color: #f18a83;
  top: 15px;
  color: #FFF;
}
.products_tag::before{
  position: absolute;
  content: '';
  top: 100%;
  left: 0;
  border: none;
  border-bottom: solid 10px transparent;
  border-right: solid 10px #da8e89;
}
.products_noimg::before{
  display: none;
}

.unl{
  text-decoration: underline;
}
/* ======= テーブル ======= */
table{
  width: 100%;
  max-width: 1100px;
  border-collapse:collapse;
  /* border: 1px solid black; */
}

th,td{
  border: solid #dfdfdf 1px;
  padding: 10px;
}

.data_content,.data_notice{
  text-align: right;
}
/* ============================ SP ============================ */

@media only screen and (max-width: 600px) {
  .fix {
    flex-direction: column;  /* 縦並びに変更 */
  }
  .products .float_box_md{
    width: 100%;
  }

  .data_notice{
    text-align: left;
  }

  .products ul li.detail_2line{
    /* padding: 1rem 0 5.5rem; */
  }

  .products ul li.detail_3line{
    /* padding: 1rem 0 7rem; */
  }
}

/* ============================ MD ============================ */

@media only screen and (min-width: 768px) {

  h1.contents_title {
    font-size: 30px;
    margin-top: 60px;
  }

  .products ul li.detail_2line{
    /* padding: 1rem 0 6rem; */
  }

  .products ul li.detail_3line{
    /* padding: 1rem 0 7rem; */
  }

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

}
/* ============================ PC ============================ */

@media only screen and (min-width: 1024px) {

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

}
