
@charset "utf-8";

/*共通*/

#monthly {
  width: 900px;
  margin: 0px auto 0 auto;
  padding: 0px;
  font-size:16px;
}
#monthly p {
  line-height: 1.6;
  letter-spacing:0.05em;
  text-indent:1em;
  margin-bottom:0.6em;
}
#monthly p.ketujyo {
  margin-bottom:10px;
  text-align:left;
  text-indent:0;
}
#monthly .midashi{
  width:900px;
}

#monthly table {
  border-collapse:collapse;
}

#monthly br.clear {
  clear: both;}

#monthly .cf:before,
.cf:after {
    content: " ";
    display: table;
}

#monthly .cf:after {
    clear: both;
}

#monthly .cf {
    *zoom: 1;
}

#monthly a {
  text-decoration: underline;
}

#monthly a:hover {
  text-decoration: none;
}


/*各ページ*/

#monthly h3 {
  margin: 20px 0 10px 0;
}
#monthly #dream {
  width: 900px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#monthly .dream-racer {
  width: 286px;
  margin-bottom: 30px;
  padding-bottom: 10px;
}
#monthly .dream-racer img.face{
  margin-top: -4px;
  margin-left: -4px;
  margin-bottom: 10px;
}
#monthly .dream-racer > p {
  padding:0 10px;
}

#monthly .dream-racer div.name-data{
  display:flex;
}
#monthly .dream-racer div.name-data div:first-child{
  width:210px;
  text-align:right;

}

#monthly .dream-racer div.name-data span.yomi{
  display:block;
  font-size:12px;
}
#monthly .dream-racer div.name-data span.toban{
  font-size:16px;
  font-weight:bold;
  line-height:30px;
  vertical-align:middle;
  margin-right:6px;
}
#monthly .dream-racer div.name-data span.name{
  font-size:30px;
  font-weight:bold;
  vertical-align:middle;
}

#monthly .dream-racer div.name-data div:last-child{
  width:54px;
  margin-left:10px;
}

#monthly .text-box {
  //border:1px solid red;
  margin:4px;
  overflow: hidden;/*float解除*/
}

#monthly .text-box .space {
  float: right;
  height: 9.0em/*画像上の余白の高さ*/
}


#monthly .dream-tactics {
  margin: 10px 8px;
  background: #BFE6EB;
  border: solid 1px #BFE6EB;
  border-radius: 12px;
  background-image:url(img/dream_icon.png);
  background-repeat: no-repeat;
  background-position: 4px center;
}

#monthly .dream-tactics p {
  margin: 6px 4px 4px 8px;
  text-indent: 0em;
  padding-left:70px;
}



#monthly .rank {
  background:#DCDCDE;
  border-radius: 50%;
  width:50px;
  height:50px;
  text-align:center;
  vertical-align: bottom;
  line-height:1.3em;
  padding:2px;
  font-size:13px;
}


#monthly .dream-racer div.boat_syoritu{
  float:right;
  margin-left:4px;
  margin-right:6px;
  clear: both;/*.spaceのfloat解除*/
}

#monthly .dream-racer div.boat_syoritu img{
  width:160px;
  margin-left:0;
  margin-bottom:8px;
}

#monthly .dream-racer div.boat_syoritu table{
  width:160px;
  border:1px solid #000;
  font-size:14px;
}

#monthly .dream-racer div.boat_syoritu table td:first-child {
  background-color:#B9E6FB;
  border:1px solid #000;
  text-align:center;
}

#monthly .dream-racer div.boat_syoritu table td:last-child {
  background-color:#FACBDF;
  text-align:center;
}


#monthly .waku1 {  border:4px solid #BDBEC1;}
#monthly .waku2 {  border:4px solid #6D6E70;}
#monthly .waku3 {  border:4px solid #FCCCB8;}
#monthly .waku4 {  border:4px solid #BDD4EE;}
#monthly .waku5 {  border:4px solid #FFE7B0;}
#monthly .waku6 {  border:4px solid #C1E2CB;}

#monthly .waku1 .name {color:#77787A;}
#monthly .waku2 .name {color:#59595B;}
#monthly .waku3 .name {color:#F36F51;}
#monthly .waku4 .name {color:#3A99D4;}
#monthly .waku5 .name {color:#FFC44C;}
#monthly .waku6 .name {color:#70CC9E;}
