.ul01 { margin: 0px; padding: 0px 0px 20px; list-style-type: none; text-align: center; flex-flow: wrap; justify-content: space-between; }
.ul01 a { position: relative; display: block; margin: 20px 0px 0px; padding: 10px; flex-basis: 31%; border: 1px solid #c4c3b9; outline: #908318 solid 1px; outline-offset: -10px; box-sizing: border-box; text-decoration: none; color: #47410b; background-color: #fcfbf4; }
.ul01 .d1 { position: relative; padding: 20px 0px 10px; width: 100%; font-size: 1.8rem; line-height: 150%; box-sizing: border-box; }
.ul01 img { margin: 0px auto; width: 100px; }
.ul01 .d2 { font-weight: bold; font-size: 0.9rem; }
.ul01 .d3 { padding: 20px 10px; line-height: 175%; }
@media screen and (min-width: 500px) and (max-width: 768px) {
  .ul01 .d1 br { display: none; }
}
@media print, screen and (min-width: 768px) {
  .ul01 { display: flex; }
  .ul01 .d1 { padding: 0px; height: 130px; font-size: calc(0.296rem + 2vw); line-height: 150%; }
  .ul01 .d1 div { position: absolute; top: 50%; left: 0px; width: 100%; transform: translateY(-50%); }
  .ul01 .d3 { font-size: 0.8rem; line-height: 175%; }
}
@media print, screen and (min-width: 900px) {
  .ul01 a { padding: 20px; }
}
@media print, screen and (min-width: 1200px) {
  .ul01 .d1 { font-size: 1.6rem; line-height: 150%; }
}