@charset "UTF-8";



/*------------------
about
---------------------*/
/*サブページのヘッダがかぶらないように*/
.margin-top200{
  margin-top:200px;
}
.about{
  display:flex;
  flex-wrap: wrap;
  justify-content: center;
}
.about:nth-child(2n){
  flex-direction: row-reverse;
}
.abaut_toptext{
  margin:100px auto;
  line-height:2;
  text-align: center;
}
.abaut_toptext p{
  margin: auto;
  font-size: 1.2em;

}

.abaut_toptext img{
margin:100px auto 20px auto;
  width:600px;
}

.about_conA{
  width:50%;
  max-width:500px;
  min-width:350px;
/*  background-color:aquamarine;*/
  line-height: 1.7;
  letter-spacing: 0.06em;
  padding:0 30px ;
  margin-bottom:100px;
}

.about_conA h2{
  font-size:1.8em;
  font-weight: 400;
  border-bottom:solid 1px #D0A96C;
  margin-bottom: 10px;

}


.about_conA p{
  font-weight: 300;
}
.about_conB{
  width:50%;
  max-width:500px;
  min-width:350px;
  min-height:300px;
/*  background-color:#e6ffb6;*/
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center bottom;
  margin-bottom:100px;
}

.about_img{
  background-image:url("../img/PerfectMeal_package2.png");
}

.role_img{
  background-image:url("../img/role.svg");
}
.feature_img{
  background-image:url("../img/feature.svg");
}
.amino_img{
  background-image:url("../img/amino.svg");
}
.graph_img{
  background-image:url("../img/graph.svg");
}
.protein_img{
  background-image:url("../img/protein.svg");
}


.lack_protein h3{
  color:#D0A96C;
}


.target{
  margin-bottom:50px;
  padding:0 30px ;
}


.about_target{
  display:flex;
  flex-wrap: wrap;
  justify-content:space-between;
}
.about_target img{
  width:100%;
  max-height:200px;
}
.target_con{
  width:20%;
  margin-bottom:50px;
  
}
.target_con p{
  margin-bottom: 10px;
  height: 80px;
  text-align: center;
  line-height: 1.5;
  font-size:1.1em;
}
.target h2{
  font-size:1.8em;
  padding-bottom:10px;
  border-bottom:solid 1px #D0A96C;
  font-weight: 400;
  margin-bottom: 50px;
}





/*---------------------------
media Queries 767
-----------------------------*/
@media screen and (max-width: 767px) {
  .abaut_toptext p{
    margin: auto;
    font-size: 1em;

  }
  .about_conA{
    width:100%;
    max-width:800px;
    min-width:auto;
    /*  background-color:aquamarine;*/
    margin-bottom:20px;
    font-size:0.9em;
  }
  .about_conB{
    width:100%;
    max-width:800px;
    min-width:auto;
    min-height:300px;
    /*  background-color:#e6ffb6;*/
    margin-bottom:100px;
  }
  .target{
    padding:0 ;
  }
  
  .target_con{
    width:50%;
  }

}


/*===============================
media Queries 415
==========================*/
@media (max-width: 415px) {
  .about_conA h2,.target h2{
    font-size:1.4em;
  }
}