@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 a {
  text-decoration: underline;
}

#monthly a:hover {
  text-decoration: none;
}


/*各ページ*/

#monthly .title{
  position: relative;
  display: flex;
  width: 900px;
  height: 160px;
  margin-bottom: 15px;
}

#monthly .head1{
  width: 150px;
  border-right: solid 2px #000;
  border-bottom: solid 2px #000;
  position: relative;
}


#monthly .month{
  font-size: 35px;
  vertical-align: super;
}

#monthly .day{
  font-size: 70px;
  text-align: right;
  position: absolute;
  top: 35px;
  right: 0;
}

#monthly .tue{
  text-align: center;
  font-size: 24px;
  background: linear-gradient(347deg, #00609e 0%, #00609e 50%, #0075c1 50%, #0075c1 100%);
  color: #fff;
  position: absolute;
  bottom: 0;
  width: 100%;
}

#monthly .head2{
  width: 150px;
  border-top: solid 2px #000;
  border-right: solid 2px #000;
  text-align: center;
  font-size: 24px;
}

#monthly .head2 div{
  height: 40px;
}

#monthly .back{
  border-radius: 20px;
  background-color: #066eb4;
  color: #fff;
  padding: 1px 25px 0 25px;
}

#monthly .endP{
  letter-spacing: -3px;
}

#monthly .head3{
  color: #e60012;
  font-size: 70px;
  padding-left: 30px;
  padding-top: 30px;
}

#monthly .hosoku{
  position: absolute;
  right: 0px;
  bottom: 0px;
}

#monthly .racer{
  display: flex;
  justify-content: space-around;
  width: 900px;
  height: 1225px;
  margin-bottom: 10px;
}

#monthly .racer1{
  display: flex;
  justify-content: space-around;
  width: 900px;
  height: 1160px;
}

#monthly .leftRacer, #monthly .midRacer, #monthly .rightRacer{
  width: 270px;
  position: relative;
}


#monthly .inner{
  position: absolute;
  width: 250px;
  height: 525px;
  top: 20px;
  left: 10px;
  border-radius: 10px 10px 0 0;
  overflow: hidden;
  z-index: 3;
}

#monthly .innerColor1{
  background: linear-gradient(to bottom, #e9f1f6, white);
}
#monthly .innerColor2{
  background: linear-gradient(to bottom, #4c4948, white);
}
#monthly .innerColor3{
  background: linear-gradient(to bottom, #d7633f, white);
}
#monthly .innerColor4{
  background: linear-gradient(to bottom, #6456a3, white);

}
#monthly .innerColor5{
  background: linear-gradient(to bottom, #fff096, white);

}
#monthly .innerColor6{
  background: linear-gradient(to bottom, #38a366, white);

}


#monthly .color1{
  background: linear-gradient(to bottom, #d0e2ec, white);
}

#monthly .color2{
  background: linear-gradient(to bottom, #231815, white);
}

#monthly .color3{
  background: linear-gradient(to bottom, #c7000a, white);

}

#monthly .color4{
  background: linear-gradient(to bottom, #1d2088, white);
}

#monthly .color5{
  background: linear-gradient(to bottom, #ffe100, white);
}

#monthly .color6{
  background: linear-gradient(to bottom, #00873b, white);
  
}

#monthly .num1{
  position: absolute;
  z-index: 5;
  top: 25px;
  left: -27px;
}

#monthly .num2{
  position: absolute;
  z-index: 5;
  top: 25px;
  left: -27px;
}

#monthly .num3{
  position: absolute;
  z-index: 5;
  top: 25px;
  left: -29px;
}

#monthly .num4{
  position: absolute;
  z-index: 5;
  top: 15px;
  left: -26px;
}

#monthly .num5{
  position: absolute;
  z-index: 5;
  top: 25px;
  left: -27px;
}

#monthly .num6{
  position: absolute;
  z-index: 5;
  top: 15px;
  left: -28px;
}
#monthly .leftimg1 img{
  position: absolute;
  top: 105px;
  width: 270px;
  z-index: 3;
}

#monthly .leftimg2{
  position: relative;
  top: 460px;
  width: 270px;
  height: 135px;
  z-index: 4;
}


#monthly .leftimg2 img{
  position: absolute;
  width: 270px;
  z-index: 4;
}

#monthly .lower{
  position: absolute;
  top: 50px;
  width: 270px;
}

#monthly .racerdata{
  position: absolute;
  width: 100%;
  top: 545px;
  color: #fff;
  background: linear-gradient(337deg, #005692 0%, #005692 50%, #0075c2 50%, #0075c2 100%);
  font-size: 40px;
  text-align: center;
  z-index: 3;
  padding: 15px 0;
}

#monthly .racerprof{
  font-size: 17px;
}

#monthly .ruby{
  font-size: 14px;
  letter-spacing: 1px;
  line-height: 0px;
}

#monthly .racedata{
  position: absolute;
  width: 200px;
  background:  linear-gradient(90deg, #000 0%, #000 50%, red 50%, red 100%);;
  color: #fff;
  font-size: 17px;
  font-weight: bold;
  left: 25px;
  top: 648px;
  text-align: center;
  border-radius: 20px;
  z-index: 4;
}

#monthly .solid{
  border-right: dotted 1px #fff;
  margin-right: 5px;
  padding-right: 5px;
}

#monthly .dot{
  border-right: dotted 1px #fff;
  margin-right: 5px;
  padding-right: 5px;
}

#monthly .word{
  position: absolute;
  top: 670px;
  color: #000;
  margin: 10px

}

#monthly .zisseki{
  text-align: center;
  position: absolute;
  width: 100%;
  left: 0px;
  top: 176px;
  color: #fff;
}

#monthly .zisseki span{
  background-color: #00a0e9;
  border-radius: 20px;
  padding: 0 65px;
}

#monthly .word2{
  margin-top: 20px;
  padding: 15px 10px 5px 10px;
  border: solid 2px #00a0e9;
}

#monthly .word3{
  margin-top: 20px;
  padding: 15px 0px 5px 0px;
  height: 145px;
  border: solid 2px #ea5514;
}

#monthly .word4{
  margin-top: 20px;
  padding: 15px 0px 5px 0px;
  height: 80px;
  border: solid 2px #ea5514;
}

#monthly .gradeRace, .kaigyo{
  letter-spacing: -1px;
  font-size: 14px;
  line-height: 17px;
  padding: 0px 10px;
}

#monthly .kaigyo{
  padding-left: 86px;
}

#monthly .kikan{
  position: absolute;
  text-align: center;
  width: 100%;
  left: 0;
  top: 315px;
  color: #fff;
}

#monthly .kikan span{
  background-color: #ea5514;
  border-radius: 20px;
  padding: 0 10px;
}

#monthly .orange{
  text-align: center;
  color: #ea5514;
  font-size: 20px;
}

#monthly .zenkoku{
  margin-top: 20px;
  font-size: 14px;
  color: #000;
}

#monthly .kuro{
  padding: 0px 10px 0px 15px;
  margin-right: 5px;
  color: #fff;
  background-color: #000;
  border-radius: 15px 0 0 15px;
}
#monthly .omura{
  padding: 0px 10px 0px 15px;
  margin-right: 5px;
  color: #fff;
  background-color: red;
  border-radius: 15px 0 0 15px;
}
#monthly .mini{
  letter-spacing: -1px;
}