@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 .zentai_background {
  background-color: #2A0859;
  height: 15153px;
}

#monthly #profile_page {
  margin-top: 67px;
}

#monthly .derby_profile {
  background-color: #006399;
  color: #fff;
  width: 697px;
  text-align: center;
  margin: auto;
  margin-bottom: 30px;
  position: relative;
  top: 60px;
  padding-bottom: 8px;
}

#monthly .profile_title {
  font-size: 45px;
  color: #fff;
  font-weight: bold;
  top: -20px;
  position: relative;
  padding: 10px;
  font-weight: bold;
  text-shadow:
          6px 6px 6px #006399, -6px -6px 6px #006399,
         -6px 6px 6px #006399,  6px -6px 6px #006399,
          6px 0px 6px #006399, -6px -0px 6px #006399,
          0px 6px 6px #006399,  0px -6px 6px #006399;
  margin: 0;  
}

#monthly .profile_text1 {
  position: relative;
  top: -15px;
  font-size: 18px;
}

#monthly .profile_data_view {
  background-color: #fff;
  width: 680px;
  color: black;
  margin: auto;
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  height: 371px;
}

#monthly .profile_data_title {
  writing-mode: vertical-rl;
  font-size: 30px;
  font-weight: bold;
  position: relative;
  top: 28px;
}

#monthly .profile_image {
  position: relative;
  top: 30px;
  left: 1px;
}

#monthly .sensyutsu {
  font-size: 25px;
  position: relative;
  top: 30px;
  left: 10px;
}

#monthly .zenkoku {
  text-align: center;
  font-size: 25px;
  background-color: #007774;
  color: #ffffff;
  width: 124px;
  position: relative;
  top: 38px;
  left: 0;
  overflow: hidden;
  height: 54px;
}

#monthly .zenkoku:after {
	position: absolute;
	content: '';
	right: 0px;
	top: 0;
	width: 0;
	height: 0;
	border: none;
	border-left: solid 40px transparent;
	border-bottom: solid 55px white;
  transform: skewX(30deg);
  transform-origin: 100% 0;
}

#monthly .zenkoku_explanation {
  position: relative;
  top: -16px;
  left: 127px;
}

#monthly .zenkoku_omoji {
  font-size: 20px;
  left: 8px;
  position: relative;  
}

#monthly .gamagori {
  text-align: center;
  font-size: 25px;
  background-color: #BD7200;
  color: #ffffff;
  width: 124px;
  position: relative;
  top: -16px;
  left: 0;
  overflow: hidden;
  height: 54px;
}

#monthly .gamagori:after {
	position: absolute;
	content: '';
  right: 0;
  top: 0;
  width: 0;
	height: 0;
	border: none;
	border-left: solid 40px transparent;
	border-bottom: solid 55px white;
  transform: skewX(30deg);
  transform-origin: 100% 0;
}

#monthly .gamagori_explanation {
  position: relative;
  top: -69px;
  left: 127px;
}

#monthly .nighter {
  text-align: center;
  font-size: 25px;
  background-color: #0C0159;
  color: #ffffff;
  width: 124px;
  position: relative;
  top: -71px;
  left: 0;
  overflow: hidden;
  height: 54px;
}

#monthly .nighter:after {
	position: absolute;
	content: '';
  right: 0;
  top: 0;
  width: 0;
	height: 0;
	border: none;
	border-left: solid 40px transparent;
	border-bottom: solid 55px white;
  transform: skewX(30deg);
  transform-origin: 100% 0;
}

#monthly .nighter_explanation {
  position: relative;
  top: -121px;
  left: 127px;
}

#monthly .profile_text3 {
  position: relative;
  top: -108px;
  font-size: 23px;
  left: 10px;
}

#monthly .profile_text3 span {
  font-size:20px;
}

#monthly .profile_data_explanation {
  text-align: left;
}

#monthly .profile_data_view_text {
  width: 100%;
}

#monthly #profile_data_view_contents {
  text-align: center;
}

#monthly .profile_data_title_text {
  clip-path: polygon(7% 0, 100% 0, 100% 100%, 0 100%, 0 15%);
}


#monthly .flex1 {
  display: flex;
}


/* 個別ページ */
#monthly .flex2 {
  display: flex;
  justify-content: space-evenly;
}

/* グランプリ優出者 */
#monthly .derby_profile_contents {
  width: 397px;
  position: relative;
  top: -178px;
  height: 400px;
  display: block;
  margin-top: 110px;
  left: -10px;
}

#monthly .derby_profile_contents_background {
  background-color: #fff;
  margin-top: 113px;
}


/* 勝率 */
#monthly .derby_profile_contents2 {
  width: 397px;
  position: relative;
  top: -167px;
  height: 423px;
  display: block;
  margin-top: 110px;
  left: -10px;
}

#monthly .derby_profile_contents2_background {
  background-color: #fff;
  margin-top: 102px;
}

#monthly .touban_grandprix {
  background-color: #006399;
  width: 123px;
  color: #fff;
  text-align: right;
  font-weight: bold;
  border-bottom-left-radius: 30px;
  font-size: 32px;
  position: relative;
  top: -165px;
  z-index: 3;
  padding-right: 16px;
}

#monthly .touban {
  background-color: #006399;
  width: 123px;
  color: #fff;
  text-align: right;
  font-weight: bold;
  border-bottom-left-radius: 30px;
  font-size: 32px;
  position: relative;
  top: -152px;
  z-index: 3;
  padding-right: 16px;
}


#monthly .lady {
  background-color: #b94b78;
}


#monthly .profile_gray_border {
  background-color: #B9BABA;
  width: 230px;
  height: 68px;
  position: relative;
  top: -279px;
  border-bottom-left-radius: 62px;
  clip-path: polygon(0% 0%, 0% 0%, 0% 0%, 100% 0%, 100% 80%, 95% 100%, 0 100%);
  z-index: 3;
  opacity: 0.6;
}

#monthly .profile_gray_border2 {
  background-color: #B9BABA;
  width: 230px;
  height: 68px;
  position: relative;
  top: -267px;
  border-bottom-left-radius: 62px;
  clip-path: polygon(0% 0%, 0% 0%, 0% 0%, 100% 0%, 100% 80%, 95% 100%, 0 100%);
  z-index: 3;
  opacity: 0.6;  
}

#monthly .grandprix {
  position: relative;
  top: -306px;
  left: 298px;
  font-size: 21px;
  color: #fff;
}

#monthly .profile_contents_background {
  background-color: gray;
  position: relative;
  top: 300px;
}

#monthly .profile_photo {
  position: relative;
  top: -17px;
  border-bottom-left-radius: 70px;
  border-top-right-radius: 70px;
  z-index: 5;
}

#monthly .name_men_grandprix {
  color: #0C0159;
  font-weight: bold;
  font-size: 50px;
  position: relative;
  top: -540px;
  left: 60px;
}

#monthly .name_men {
  color: #0C0159;
  font-weight: bold;
  font-size: 50px;
  position: relative;
  top: -527px;
  left: 60px;
}


#monthly .name_women {
  color:#9f0a5a;
  font-weight: bold;
  font-size: 50px;
  position: relative;
  top: -527px;
  left: 60px;
}

#monthly a {
  color: #0C0159;
}

#monthly .name_women a {
  color:#9f0a5a;
}

#monthly .yomigana {
  position:absolute;
  top: 324px;
  right: 37px;
  font-weight: bold;
  font-size: 15px;
}

#monthly .oukan {
  position: relative;
  top: -129px;
  left: -10px;
}

#monthly .komento_grandprix {
  font-size: 32px;
  position: relative;
  top: -540px;
  left: 57px;
  width:305px;
  text-align: justify;
}

#monthly .komento {
  font-size: 32px;
  position: relative;
  top: -523px;
  left: 57px;
  width:305px;
  text-align: justify;
}

#monthly .zenkoku_Individual {
  text-align: center;
  font-size: 25px;
  background-color: #007774;
  color: #ffffff;
  width: 90px;
  position: relative;
  top: -509px;
  left: 230px;
  overflow: hidden;
  height: 47.5px;
}

#monthly .zenkoku_Individual:after {
	position: absolute;
	content: '';
	right: 0px;
	top: 0;
	width: 0;
	height: 0;
	border: none;
	border-left: solid 40px transparent;
	border-bottom: solid 55px white;
  transform: skewX(30deg);
  transform-origin: 100% 0;
}

#monthly .profile_text2 {
  position: relative;
  top: 15%;
}

#monthly .profile_text2_nighter {
  position: relative;
  top: 11px;
}

#monthly .zenkoku_number {
  font-weight: bold;
  font-size: 25px;
  position: relative;
  top: -551px;
  left: 321px;
  border-bottom: 1px dashed;
  width: 72px;
  padding-bottom: 4px;
  padding-left: 8px;
}

#monthly .zenkoku_number::before{
  content: '';
  position: absolute;
  left: 50%;
  bottom: -10px; /*下線の上下位置調整*/
  display: inline-block;
}


#monthly .gamagori_Individual {
  text-align: center;
  font-size: 25px;
  background-color: #BD7200;
  color: #ffffff;
  width: 90px;
  position: relative;
  top: -552px;
  left: 230px;
  overflow: hidden;
  height: 47.5px;
}

#monthly .gamagori_Individual:after {
	position: absolute;
	content: '';
	right: 0px;
	top: 0;
	width: 0;
	height: 0;
	border: none;
	border-left: solid 40px transparent;
	border-bottom: solid 55px white;
  transform: skewX(30deg);
  transform-origin: 100% 0;
}

#monthly .gamagori_text {
  position: relative;
  top: 15%;
}

#monthly .gamagori_number {
  font-weight: bold;
  font-size: 25px;
  position: relative;
  top: -593px;
  left: 321px;
  border-bottom: 1px dashed;
  width: 72px;
  padding-bottom: 4px;
  padding-left: 8px;
}  


#monthly .nighter_Individual {
  text-align: center;
  font-size: 19px;
  background-color: #29106E;
  color: #ffffff;
  width: 90px;
  position: relative;
  top: -595px;
  left: 230px;
  overflow: hidden;
  height: 47.5px;
}

#monthly .nighter_Individual:after {
	position: absolute;
	content: '';
	right: 0px;
	top: 0;
	width: 0;
	height: 0;
	border: none;
	border-left: solid 40px transparent;
	border-bottom: solid 55px white;
  transform: skewX(30deg);
  transform-origin: 100% 0;
}

#monthly .nighter_text {
  position: relative;
  top: 15%;
}

#monthly .nighter_number {
  font-weight: bold;
  font-size: 25px;
  position: relative;
  top: -634px;
  left: 326px;
  padding-left: 2px;
}

#monthly .profile_box {
  position: relative;
  top: -619px;
  font-size: 23px;
  left: 223px;
  width: 173px;
  border: 2px solid;
  border-radius: 10px;
  border-collapse: separate;
}

#monthly .profile_box td {
  padding-left: 8px;
  border-left: 1px dashed;
  padding-top: 5px;
  padding-bottom: 5px;
}

#monthly .syouritsu_text {
  position: relative;
  top: -309px;
  font-size: 25px;
  left: 241px;
  color: #fff;
}

#monthly .number_omoji {
  position: relative;
  top: -307px;
  left: 238px;
  color: #fff;
  font-size: 35px;
}