@charset "UTF-8";
/* CSS Document */
/*ここからズッキーニ*/
.grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  margin-top:10px;
  padding-bottom:30px;
}
.item {
	border-radius: 20px 5px;
	background: #FC0;
	padding: 15px ;
	margin:20px 10px 20px 10px;
	text-align: center;
}
img {
  max-width: 100%;
  height: auto;
}
p {
  text-align: left;
}
#contents_inner{
	background-color:#CFFC;
}
.breadcrumb {
  margin: 10px;
  padding: 0;
  list-style: none;
}

.breadcrumb li {
  display: inline;/*横に並ぶように*/
  list-style: none;
  font-weight: bold;/*太字*/
}

.breadcrumb li:after {/* >を表示*/
  content: '>';
  padding: 0 0.2em;
  color: #555;
}


.breadcrumb li:last-child:after {
  content: '';
}

.breadcrumb li a {
  text-decoration: none;
  color: #600;/*色*/
}

.breadcrumb li a:hover {
  text-decoration: underline;
}
/*ここまでズッキーニ*/

article{
    padding: 30px;  /*余白の指定*/
}
article h3{
position: relative;
background-color: #F66;
padding: 10px;
color: #FFF;
font-weight:bold;
font-size:250%;
border-radius: 10px;
}
article h3:before {
content: "";
position: absolute;
border: 12px solid transparent;
border-top: 12px solid #F66;
top: 100%;
left: 5%;
}
article p{
	padding-top:20px;
    font-size: 150%;    /*フォントサイズの指定*/
    color: #313131; /*文字色の変更*/
    letter-spacing: 3px;    /*文字と文字の間隔をあける*/
    line-height: 400%;  /*行間をあける*/
}
.under {
  background: linear-gradient(transparent 0%, #FF0 0%);
}