@charset "UTF-8";

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

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

.page_main_img{
    background-color: #EEE;
    background-image: url(../img/main_img.jpg);
    padding: 50vw 0 10vw;
}
.main {
    padding: 10px;
}

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

h1.contents_title {
  color: #886b3d;
  font-size: 24px;
  margin-bottom: 40px;
}

.concept{
  background-color: #f0e7db;
}

.concept_txt{
  text-align: center;
  line-height: 2;
  letter-spacing: 1px;
  margin-bottom: 40px;
}

.concept_box{
  width: 100%;
  background-image: url(../img/concept_img_bg.png);
  background-repeat: no-repeat;
  background-position: top center;
  padding-top: 70vw;
  background-size: contain;
}
.choco h3{
  padding: 15px;
  font-size: 130%;
  color: #360b0a;
}

.choco p{
  padding: 0 15px 15px;
}


/* ============================ SP ============================ */

@media only screen and (max-width: 600px) {


}

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

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

  #scene .main{padding: 15px;}

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

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

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

  .choco > div{
    margin-bottom: 60px;
  }


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

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

  /* ================ page main image ================ */
  .page_main_img {
      padding: 22vw 0 4vw;
      max-width: 2500px;
  }

  /* ================  ================ */
    
  .concept_box{
    width: 100%;
    background-position: center left;
    padding: 100px 0;
    background-size: cover;
  }

  .concept_box_txt{
    max-width: 340px;
    width: fit-content;
    margin-top: 40px;
    margin-left: 70px;
    margin-right: auto;
  }

}
