.logo {
  display: inline-block;
  width: 282px;
  height: 166px;
  position: relative;
}
.logo img {
  position: absolute;
  width: 100%;
  height: 100%;
}
ul.name {
  text-align: center;
}
ul.name li {
  margin: 0 0.5em;
}
ul.name li::before {
  display: inline-block;
  content: "";
  width: 2em;
  height: 1em;
  margin-right: 0.5em;
}
ul.name li.kurosu::before {  background-color: #e92828;}
ul.name li.iga::before {  background-color: #005bac;}
ul.name li.kawai::before {  background-color: #ffac3b;}
ul.name li.kokoro::before {  background-color: #8f00db;}
ul.name li.kime::before {  background-color: #009944;}
ul.name li.boke::before {  background-color: #009ce6;}
ul.name li.tsukkomi::before {  background-color: #e93e95;}

ul.douga {
  text-align: center;
}
ul.douga li a,
ul.douga li a span,
ul.douga li a span img {
  display: block;
}
ul.douga li a {
  position: relative;
}
ul.douga li a span {
  background-position: center;
  background-size: 100%;
}
ul.douga li {
  display: inline-block;
}
p.ep {
  padding: 0.5em;
  border-bottom: 1px solid #000;
  margin-bottom: 0.5em;
}
@media all and (min-width: 768px) {
  ul.name li {
    display: inline-block;
  }
  div.ep {
    margin: 2em 0;
  }
  ul.douga li a,
  ul.douga li a span,
  ul.douga li a span img {
    width: 260px;
    height: 146px;
  }
  ul.douga li.kurosu { border: solid 4px #e92828;}
  ul.douga li.iga { border: solid 4px #005bac;}
  ul.douga li.kawai { border: solid 4px #ffac3b;}
  ul.douga li.kokoro { border: solid 4px #8f00db;}
  ul.douga li.kime { border: solid 4px #009944;}
  ul.douga li.boke { border: solid 4px #009ce6;}
  ul.douga li.tsukkomi { border: solid 4px #e93e95;}
}
@media all and (max-width: 767px) {
  div.ep {
    margin: 0.5em 0;
  }
  ul.name li {
    font-size: 90%;
    display: block;
  }
  ul.douga li {
    width: 32%;
    box-sizing: border-box;
  }
  ul.douga li a {
    width: 100%;
    height: auto;
    padding: 56.25% 0 0;
    display: block;
    position: relative;
  }
  ul.douga li a span {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
  ul.douga li.kurosu {border: solid 4px #e92828;}
  ul.douga li.iga { border: solid 4px #005bac;}
  ul.douga li.kawai { border: solid 4px #ffac3b;}
  ul.douga li.kokoro { border: solid 4px #8f00db;}
  ul.douga li.kime { border: solid 4px #009944;}
  ul.douga li.boke { border: solid 4px #009ce6;}
  ul.douga li.tsukkomi { border: solid 4px #e93e95;}
}