@charset "UTF-8";
/* CSS Document */
.notes-area {
  margin: 0% auto 0;
}
#contentWrap {
  color: #000;
}
#contentWrap .boxWidth {
  background-color: #d8d8d9;
  box-shadow: 2px 6px 6px rgba(0, 0, 0, 0.2);
  padding-bottom: 3%;
  position: relative;
  z-index: 1;
  padding: 30px 50px;
}
h3.h3-02 {
  width: 96%;
}
#sec01 {
  padding: 20px;
  /*margin: 0 4% 0;*/
  background-color: #fff;
  h4 {
    width: 100%;
    padding-bottom: 1em;
    font-size: 20px;
  }
}
#sec01 .leftBox {
	width: 60%;
}
#sec01 .leftBox .box01 {
	width: 50%;
	align-content: space-between;
	p {
		width: 65%;
		line-height: 1.4;
		font-size: 12px;
	}
	.img01 {
		width: 33%;
	}
	.imgBox {
		width: 100%;
		margin-top: 10px;
	}
}
#sec01 .leftBox .box02 {
	width: 46%;
	display: flex;
	flex-wrap: wrap;
	align-content: space-between;
}
#sec01 .leftBox .box02 .item {
	.imgBox {
		width: 50%;
	}
	p {
		width: 47%;
		line-height: 1.5;
		font-size: 12px;
	}
}
#sec01 .itemBox {
	width: 17%;
	dt {
		border: none;
		height: 1.5em;
	}
}
#sec01 .line {
	width: 1px;
	background-color: #000;
}

#sec03 {
  margin: 3% 0 0;
}
#sec03 .itemBox {
  align-items: flex-start;
  width: 31%;
  .imgBox {
    width: 53%;
    .caption {
      font-size: 10px;
    }
  }
  dl {
    width: 44%;
  }
}
@media screen and (max-width: 959px) {
	#contentWrap .boxWidth {
    padding: 3%;
	}
	#sec01 .leftBox {
    width: 100%;
	}
	#sec01 .itemBox {
    width: 48%;
		.imgBox {
			max-width: 200px;
			margin: 0 auto;
		}
	}
	#sec01 .line01 {
		width: 100%;
		height: 1px;
		margin: 20px 0;
	}
	#sec03 .itemBox {
		width: 30%;
		.imgBox {
			width: 100%;
		}
		dl {
			width: 100%;
		}
	}
  
}
@media screen and (max-width: 599px) {
	h3.h3-02, .boxWidth {
	  width: 100%;
	}
	h3.h3-02 .jp {
	  position: static;
	  display: block;
	  padding-top: 0.3em;
		line-height: 1.4;
	}
  #sec01 {
    h4 {
			font-size: clamp(13px, 4.3cqw, 20px);
    }
	}
	#sec01 .leftBox .box01 {
    width: 100%;
	}
	#sec01 .leftBox .box02 {
		width: 100%;
		.item {
			padding: 15px 0;
		}
	}
	    #sec01 .itemBox {
        width: 100%;
    }
	#sec01 .line {
		width: 100%;
		height: 1px;
		margin: 20px 0;
	}
	#sec03 .itemBox {
        width: 90%;
		max-width: 300px;
		padding: 20px 0;
		margin: 0 auto;
		.imgBox {
			max-width: 250px;
			margin: 0 auto;
			
		}
    }
}