@charset "utf-8";

/*共通*/

.button--arrowRight {
  box-sizing: border-box;
}

#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 .dream_box{
  margin-top: 25px;
  display: flex;
  width: 900px;
  justify-content: space-evenly;
}

#monthly .dream_racer{
  height: 600px;
  width: 440px;
  position: relative;
}

#monthly .dream_top p ,#monthly .racer_win p ,#monthly .dream_footer p ,#monthly .dream_bottom p {
  text-indent: initial;
  line-height: 1 ;
}

#monthly .dream_top{
  width: 440px;
  position: absolute;
  bottom: 535px;
  right: 15px;
}

#monthly .dream_num{
border: solid 2px black;
border-radius: 30px;
background-color: #ffffff;
display: inline-block;
width: 100px;
height: 50px;
font-size: 25px; 
font-weight: bold;
}

#monthly .dream_num2{
  border: solid 2px black;
  border-radius: 30px;
  background-color: #6b6969;
  display: inline-block;
  width: 100px;
  height: 50px;
  font-size: 25px; 
  font-weight: bold;
  color: #ffffff;  
}

#monthly .dream_num3{
  border: solid 2px black;
  border-radius: 30px;
  background-color: #e7282e;
  display: inline-block;
  width: 100px;
  height: 50px;
  font-size: 25px; 
  font-weight: bold;
  color: #ffffff;  
}

#monthly .dream_num4{
  border: solid 2px black;
  border-radius: 30px;
  background-color: #3aa2c4;
  display: inline-block;
  width: 100px;
  height: 50px;
  font-size: 25px; 
  font-weight: bold;
  color: #ffffff;  
}

#monthly .dream_num5{
  border: solid 2px black;
  border-radius: 30px;
  background-color: #f4ec12;
  display: inline-block;
  width: 100px;
  height: 50px;
  font-size: 25px; 
  font-weight: bold;
  color: #231815;  
}

#monthly .dream_num6{
  border: solid 2px black;
  border-radius: 30px;
  background-color: #2ca045;
  display: inline-block;
  width: 100px;
  height: 50px;
  font-size: 25px; 
  font-weight: bold;
  color: #ffffff;  
}

#monthly .dream_bignum{
  font-size: 33px; 
  font-weight: 900;
}

#monthly .dream_timein
{
  position: relative;
  left: 180px;
  bottom: 17px;
  padding: 0 10px;
  background-color: #d8e473;
  color: #231815;
  font-weight: bold;
  font-size: 20px;
}

#monthly .dream_timein4
{
  position: relative;
  left: 165px;
  bottom: 17px;
  padding: 0 10px;
  background-color: #d8e473;
  color: #231815;
  font-weight: bold;
  font-size: 20px;
}

#monthly .dream_color1{
  background: linear-gradient(to bottom, #dfe3e6 , #ffffffd3 );
  border-radius: 30px 0 0 0;
  height: 600px;
  box-shadow: 2px 2px 4px gray;
}

#monthly .dream_color2{
  background: linear-gradient(to bottom, #251714 , #ffffffd3 );
  border-radius: 30px 0 0 0;
  height: 600px;
  box-shadow: 2px 2px 4px gray;
}

#monthly .dream_color3{
  background: linear-gradient(to bottom, #e5272d , #ffffffd3 );
  border-radius: 30px 0 0 0;
  height: 600px;
  box-shadow: 2px 2px 4px gray;
}

#monthly .dream_color4{
  background: linear-gradient(to bottom, #39a0c0 , #ffffffd3 );
  border-radius: 30px 0 0 0;
  height: 600px;
  box-shadow: 2px 2px 4px gray;
}

#monthly .dream_color5{
  background: linear-gradient(to bottom, #f5e911 , #ffffffd3);
  border-radius: 30px 0 0 0;
  height: 600px;
  box-shadow: 2px 2px 4px gray;
}

#monthly .dream_color6{
  background: linear-gradient(to bottom, #2b9d44 , #ffffffd3 );
  border-radius: 30px 0 0 0;
  height: 600px;
  box-shadow: 2px 2px 4px gray;
}

#monthly .dream_color1 img, #monthly .dream_color2 img,#monthly .dream_color3 img,#monthly .dream_color4 img,#monthly .dream_color5 img,#monthly .dream_color6 img{
  position: relative;
  left: 10px;
  top:  10px;
}

#monthly .racer_win{
  position: absolute;
  bottom:155px;
  transform: rotate(-3deg);
  padding: 0 5px;
}

#monthly .racer_win2{
  position: absolute;
  bottom:165px;
  left: -15px;
  transform: rotate(-3deg);
  padding: 0 5px;
}

#monthly .racer_win1{
  position: absolute;
  bottom:165px;
  left: -18px;
  transform: rotate(-3deg);
  padding: 0 5px;
}

#monthly .dream_win{
  background-color:#d8e473;
  color: #4c4398;
  font-weight: bold;
  padding: 0 5px;
  line-height: 1.2;
}

#monthly .dream_data{
  line-height: 1.3;
  text-align: center;
  width: 60px;
  height: 65px;
  background-color: #dcdddd;
  border-radius: 50%;
  border: 2px solid #000;
  position: absolute;
  right: 20px;
  bottom: 185px;
  font-weight: bold;
}

#monthly .dream_yomi{
  position: absolute;
  right: 20px;
  bottom: 150px;
  font-weight: bold;
  font-size: 18px;
}

#monthly .dream_bottom{
  display: flex;
  position: absolute;
  bottom: 25px;
  left: 20px;
  font-size: 25px;
  font-weight: bold;
  width: 400px;
  height: 100px;
}

#monthly .dream_bottom :nth-of-type(2){
  position: relative;
  left: 20px;
  bottom: 10px;
  font-size: 60px;

}

#monthly .dream_name{
  color: #ffffff;
  text-shadow    : 
  3px  3px 0px #000000,
 -3px  3px 0px #000000,
  3px -3px 0px #000000,
 -3px -3px 0px #000000,
  3px  0px 0px #000000,
  0px  3px 0px #000000,
 -3px  0px 0px #000000,
  0px -3px 0px #000000; 
}

#monthly .dream_name2{
  color: #140402;
  text-shadow    : 
  3px  3px 0px #ffffff,
 -3px  3px 0px #ffffff,
  3px -3px 0px #ffffff,
 -3px -3px 0px #ffffff,
  3px  0px 0px #ffffff,
  0px  3px 0px #ffffff,
 -3px  0px 0px #ffffff,
  0px -3px 0px #ffffff; 
}

#monthly .dream_name3{
  color: #e7282e;
  text-shadow    : 
  3px  3px 0px #ffffff,
 -3px  3px 0px #ffffff,
  3px -3px 0px #ffffff,
 -3px -3px 0px #ffffff,
  3px  0px 0px #ffffff,
  0px  3px 0px #ffffff,
 -3px  0px 0px #ffffff,
  0px -3px 0px #ffffff; 
}

#monthly .dream_name4{
  color: #3aa2c4;
  text-shadow    : 
  3px  3px 0px #ffffff,
 -3px  3px 0px #ffffff,
  3px -3px 0px #ffffff,
 -3px -3px 0px #ffffff,
  3px  0px 0px #ffffff,
  0px  3px 0px #ffffff,
 -3px  0px 0px #ffffff,
  0px -3px 0px #ffffff; 
}

#monthly .dream_name5{
  color: #f4ec12;
  text-shadow    : 
  3px  3px 0px #000000,
 -3px  3px 0px #000000,
  3px -3px 0px #000000,
 -3px -3px 0px #000000,
  3px  0px 0px #000000,
  0px  3px 0px #000000,
 -3px  0px 0px #000000,
  0px -3px 0px #000000;
}

#monthly .dream_name6{
  color: #2ca045;
  text-shadow    : 
  3px  3px 0px #ffffff,
 -3px  3px 0px #ffffff,
  3px -3px 0px #ffffff,
 -3px -3px 0px #ffffff,
  3px  0px 0px #ffffff,
  0px  3px 0px #ffffff,
 -3px  0px 0px #ffffff,
  0px -3px 0px #ffffff; 
}

#monthly .dream_yomi , #monthly .dream_touroku{
text-shadow: 2px 2px 2px #fff, 2px 2px 2px #fff, 2px -1px 2px #fff, -1px -1px 2px #fff, 2px 0px 2px #fff, 0px 2px 2px #fff, -1px 0px 2px #fff, 0px -1px 2px #fff;
}

#monthly .dream_footer{
  display: flex;
  position: absolute;
  bottom: 10px;
  left: 10px;
  font-weight: bold;
}

#monthly .dream_comment{
  width: 300px;
  font-size: 17px;
  font-weight: initial;
}

#monthly .dream_table{
  vertical-align: bottom;
  position: relative;
  left: 10px;
  bottom: 5px;
}

#monthly .dream_table th,td{
  border: 1px solid black;
  width: 55px;
  text-align: center;
}

#monthly .dream_table td {
  background-color:white;

}

#monthly .tablecolor_1 {
  background-color: #f08200;
  color: #fff;
}

#monthly .tablecolor_2 {
  background-color: #ca4484;
  color: #fff;
}