@import"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&family=Noto+Sans:wght@100&display=swap";
* {
  list-style: none;
  padding: 0;
  margin: 0;
  letter-spacing: 0.02rem;
  word-wrap: break-word box-sizing:border-box;
}

.flexbox {
  justify-content: space-between;
}

.flexbox a {
  margin-left: 6px !important;
}

h1, h2 {
  margin: 0;
}

.mb10 {
  margin-bottom: 10px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.mb50 {
  margin-bottom: 50px !important;
}

.mb100 {
  margin-bottom: 100px !important;
}

.pt100 {
  padding-top: 100px !important;
}

.bold {
  font-weight: bold !important;
}

.txt_c {
  text-align: center;
}

.border_t {
  border-top: 1px solid #000000;
}

.main img {
  width: 100%;
  height: auto;
}

.main {
  padding: 0 0 50px 0;
  background-image: url(../assets/character/sud_bg.png);
  background-size: auto;
  background-position: center;
  background-repeat: repeat;
  background-color: #FFFFFF;
}

#chara_select {
  padding-top:42px;
}
#chara_select_ttl {
  width:100%;
  margin-bottom:30px;
}
.charalists {
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.charalists li {
  width:32%;
  margin:0 12px;
}
.charalists li a{
  display:block;
  width:100%;
  opacity:1;
}
.charalists li a .chara_names{
  width:100%;
  margin-bottom:12px;
  text-align:center;
}
.charalists li a img{
  display:block;
  opacity:1;
}
@media (min-width: 1069.98px) {
.charalists li a:hover img{
  display:block;
  opacity:0.7;
}
}
@media (max-width: 770px) {
.charalists {
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
}
.charalists li {
  width:48%;
  margin: 0 0 4% 0;
}
.charalists li:first-child {
  margin-right:4%;
}
.charalists li a .chara_names{
  margin-bottom:6px;
}
}