@charset "utf-8";
/* ==========================================================================
	CONTENTS
========================================================================== */
/*TABLE*/
.cmn-table01 {
  font-size: 90%;
  margin-bottom: 15px;
}
.cmn-table01 th {
  width: 50%;
  box-sizing: border-box;
  text-align: left;
  vertical-align: top;
  border: solid 1px #ccc;
  background-color: var(--color04);
  padding: 10px 15px;
}
.cmn-table01 td {
  width: 50%;
  box-sizing: border-box;
  vertical-align: top;
  text-align: right;
  border: solid 1px #ccc;
  background-color: #fff;
  padding: 10px 15px;
}
.cmn-table01 tr:first-child th {
  color: #fff;
  background-color: var(--color01);
}
.cmn-table01 tr:first-child td {
  color: #fff;
  background-color: var(--color01);
}

.cmn-table02 {
  font-size: 90%;
}
.cmn-table02 th {
  width: 25%;
  box-sizing: border-box;
  text-align: left;
  vertical-align: top;
  border: solid 1px #ccc;
  background-color: var(--color03);
  padding: 10px 15px;
}
.cmn-table02 td {
  vertical-align: top;
  text-align: left;
  border: solid 1px #ccc;
  background-color: #fff;
  padding: 10px 15px;
}

.cmn-table03 {
  font-size: 90%;
}
.cmn-table03 th {
  width: 10em;
  box-sizing: border-box;
  text-align: center;
  vertical-align: top;
  border: solid 1px #ccc;
  background-color: var(--color03);
  padding: 10px 15px;
}
.cmn-table03 td {
  vertical-align: top;
  text-align: left;
  border: solid 1px #ccc;
  background-color: #fff;
  padding: 10px 15px;
}

.cmn-table04 {
  font-size: 90%;
  border-top: solid 1px #ccc;
}
.cmn-table04 th {
  width: 10em;
  box-sizing: border-box;
  text-align: left;
  vertical-align: top;
  border-bottom: solid 1px #ccc;
  padding: 15px 15px;
}
.cmn-table04 td {
  vertical-align: top;
  text-align: left;
  border-bottom: solid 1px #ccc;
  padding: 15px 15px;
}

.layout-disease {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.layout-disease .box01 {
  width: 15%;
}
.layout-disease .box02 {
  width: 80%;
}

.li-need{
  display: flex;
  flex-wrap: wrap;
}
.li-need li{
  width: 30%;
  border: 3px solid var(--color01);
  background-color: #fff;
  border-radius: 10px;
  box-sizing: border-box;
  padding: 20px 10px;
  margin-right: 5%;
}
.li-need li:nth-child(3n){
  margin-right: 0;
}
.li-need li div{
  width: 40%;
  margin: 0 auto 15px auto;
}
.li-need li .tit{
  color: var(--color01);
  font-family: var(--font01);
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 10px;
}
.li-need li .txt{
  font-size: 90%;
  width: 90%;
  margin: 0 auto;
}

.li-equip{
  display: flex;
  flex-wrap: wrap;
  margin-bottom: -30px;
}
.li-equip li{
  width: 30%;
  font-weight: 700;
  text-align: center;
  margin-right: 5%;
  margin-bottom: 30px;
}
.li-equip li:nth-child(3n){
  margin-right: 0;
}
.li-equip li div{
  margin-bottom: 10px;
}

/* ==========================================================================
	PC 1025px -
	========================================================================== */
@media screen and (min-width: 1025px) {}
@media screen and (max-width: 1200px) { /*1200以下*/
}
/* ==========================================================================
	TABLET - 1024px
	========================================================================== */
@media screen and (max-width:1024px) {


}
/* ==========================================================================
	SP - 640px
	========================================================================== */
@media screen and (max-width: 800px) {
.layout-disease {
  display: block;
}
.layout-disease .box01 {
  width: 20%;
  margin: 0 auto 10px auto;
}
.layout-disease .box02 {
  width: 100%;
}
#profile .box02{
  width: 50%;
  margin: 0 auto;
}

.li-need{
  display: block;
}
.li-need li{
  width: 100%;
  max-width: 300px;
  border: 2px solid var(--color01);
  padding: 20px 10px;
  margin : 0 auto 20px auto;
}
.li-need li:nth-child(3n){
  margin : 0 auto 20px auto;
}
.li-need li div{
  width: 40%;
  margin: 0 auto 15px auto;
}
.li-need li .tit{
  font-size: 1.8rem;
  margin-bottom: 10px;
}

.li-equip{
  margin-bottom: -20px;
}
.li-equip li{
  width: 48%;
  margin-right: 4%;
  margin-bottom: 20px;
}
.li-equip li:nth-child(3n){
  margin-right: 4%;
}
.li-equip li:nth-child(2n){
  margin-right: 0;
}


}