/* CSS Document */
#character {
  /*------------ moomin------------ */
  /*--------------- peanuts ------------*/
  /*--------------- other ------------*/
  /*-------------------------------responsive---------------------------*/
}
#character.container {
  background-color: #c7d9db;
}
#character .spec_box {
  color: #543f31;
}
#character section.moomin .mainA {
  padding-right: 10%;
}
#character section.moomin .mainB {
  padding: 2% 0 3% 10%;
}
#character section.moomin .mainC {
  padding: 0 3% 3%;
}
#character section.moomin .spec_box, #character section.peanuts .spec_box {
  padding: 0 7% 1%;
}
#character section.moomin .spec_box div, #character section.peanuts .spec_box div {
  padding: 3%;
}
#character section.peanuts .mainA {
  padding-right: 2%;
}
#character section.peanuts .mainB {
  padding: 3% 0 4% 5%;
}
#character p.cara_btn:hover {
  opacity: 0.7;
}
#character p.cara_btn {
  width: 70%;
  margin: 10% auto 24%;
  background-color: #80613a;
  border-radius: 45px;
  text-align: center;
}
#character p.cara_btn a {
  display: block;
  text-decoration: none;
  color: #fff;
  font-size: clamp(11px, 3vmin, 24px);
  font-weight: bold;
  letter-spacing: 0.1em;
  padding: 5% 2%;
}
#character p.dora {
  background-color: #2a80b9;
  margin: 0 auto 24%;
}
@media screen and (max-width: 500px) {
  #character p.cara_btn a {
    padding: 6% 2%;
  }
  #character section.moomin .spec_box, #character section.peanuts .spec_box {
    padding: 0 3% 1%;
  }
}/*# sourceMappingURL=caracter.css.map */