@charset "UTF-8";
#main img {
  max-width: 100%;
}
.face-periodic p {
  font-size: 3.8vw;
  margin: 0;
}
.face-periodic .intro {
  width: 94vw;
  margin: 0 auto;
  padding: 0 0 10vw;
}
.face-periodic .intro strong {
  display: block;
  font-size: 4vw;
  padding-bottom: .5em;
}
.face-periodic .flow {
  padding: 0 0 10vw;
}
.face-periodic .flow ul {
  width: 94vw;
  margin: 0 auto !important;
  padding: 0 0 4vw;
}
.face-periodic .flow ul li {
  list-style: none;
  margin: 0;
  padding: 0 0 15px;
}
.face-periodic .flow ul li em {
  display: block;
  font-size: 4.4vw;
  font-style: normal;
  font-weight: normal;
  text-align: center;
}
.face-periodic .flow div {
  width: 94vw;
  background: rgba(120,150,165, .1);
  margin: 0 auto 8vw;
  padding: 2vw;
}
.face-periodic .flow div h4 {
  padding: 0 0 4vw;
}
.face-periodic .flow div h4 b {
  display: inline-block;
  background: url(/menu/_img/face_periodic-img-icon-34.webp) no-repeat;
  background-size: contain;
  font-size: 6vw;
  font-weight: normal;
  color: rgb(120,150,165);
  line-height: 10vw;
  padding: 0 0 0 24vw;
}
.face-periodic .flow div h4 span {
  display: block;
  font-size: 3.8vw;
  font-weight: normal;
  text-align: center;
  padding: .5em 0 0;
}
.face-periodic .flow div dl {
  padding: 0 0 0 42vw;
  min-height: 30vw;
}
.face-periodic .flow div dl dt {
  font-size: 4.4vw;
  padding: 0 0 .5em;
}
.face-periodic .flow div dl:nth-of-type(1) {
  background: url(/menu/_img/face_periodic-img-03.webp) no-repeat;
  background-size: 39vw;
}
.face-periodic .flow div dl:nth-of-type(2) {
  background: url(/menu/_img/face_periodic-img-04.webp) no-repeat;
  background-size: 39vw;
}
.face-periodic .flow div dl:nth-of-type(3) {
  background: url(/menu/_img/face_periodic-img-05.webp) no-repeat;
  background-size: 39vw;
}
.face-periodic .flow div dl:nth-of-type(4) {
  background: url(/menu/_img/face_periodic-img-06.webp) no-repeat;
  background-size: 39vw;
}
.face-periodic .flow div dl dd {
  margin: 0;
  padding: 0;
}