@charset "UTF-8";
@import "top_2023.css";
/* CSS Document */

.br_sp {
  display: none;
}

/*-----------
KV
-----------*/
@media screen and (min-width: 1440px) {
  #key_visual {
    background: #f4d350;
  }

  #key_visual h1 {
    width: 1440px;
    margin-left: auto;
    margin-right: auto;
  }
}







/*----race_next ----*/

#race_next {
  text-align: center;
}

#race_next .inner {
  width: 1000px;
  padding: 70px 35px 0 25px;
  margin: 0 auto;
}

#race_next .race_next_txt {
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 0px auto 0;
  /* background-color: #fff; */
  border-radius: 5px;
}

#race_next .race_next_txt img {
  width: 766px;
  padding: 30px 0 45px;
  margin: 0 auto;
}



/*----about ----*/


/*----jockey----*/

#jockey {
  width: 840px;
  margin: 80px auto 60px;
}

#jockey .jocky_ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  width: 720px;
  margin: 30px auto 30px;
}

#jockey p {
  font-size: 14px;
}



/* racelist */

#racelist .racelist_ul li > a {
  background-image: url("../img/top/icon_arrow_color.svg");
}

#racelist .racelist_ul li > a[target="_blank"] {
  background-image: url("../img/top/icon_blank_color.svg");
}

#racelist .racelist_ul {
  margin: 0 auto 20px;
}

#racelist .racelist_ul .line_2 .li_inner:first-child {
  padding-bottom: 6px;
}

#racelist .racelist_ul .line_2 .li_inner:last-child {
  padding-top: 0;
}



/* point_ranking */

#point_ranking table tr td.color {
  background-color: #fff1f8;
}

#point_ranking table th {
  background-color: #e61673;
}


/*----news----*/



#news #news_list li a::after {
  background-image: url("../img/top/icon_arrow_color.svg");
}

#news #news_list li a[target="_blank"]::after {
  background-image: url("../img/top/icon_blank_color.svg");
}



/*----link----*/
#link .bnr_slider .slick-prev{
  background-image: url("../img/top/link_arrow_prev.svg");
}

#link .bnr_slider .slick-next{
  background-image: url("../img/top/link_arrow_next.svg");
}


/*----gallery----*/

#gallery {
  position: relative;
  padding-top: 35px;
}

/* #gallery::before {
  content: "";
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background:linear-gradient( -90deg, #feefa6 0%, #fffdf2 100%);
  transform: skewY(-3deg);
} */

#gallery ul {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 840px;
  margin: 40px auto 0;
}

#gallery ul .movie {
  width: 100%;
  margin-bottom: 65px;
}

#gallery ul .movie .movie_box {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
}

#gallery ul .movie .movie_box iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#gallery ul .photo_gallery {
  margin-bottom: 80px;
}

#gallery ul .photo_gallery .btn {
  padding: 20px 0 24px;
  text-align: center;
  background: linear-gradient( 90deg, #f8c6db 0%, #ffedf4 100%);
}

#gallery ul .photo_gallery .btn a {
  display: inline-block;
  background-color: #222;
  width: 260px;
  padding: 8px 45px;
  margin: 0 18px;
  border-radius: 4px;
  color: #fff;
  font-size: 19px;
  text-align: center;
  background: #222 url(../common/img/icon_arrow_btn_black01.svg) right 12px top 46% no-repeat;
  background-size: 26px;
  box-sizing: border-box;
}

#gallery ul .poster {
  width: 320px;
}

#gallery ul img {
  width: 100%;
}

#gallery ul .cap {
  margin-top: 4px;
  text-align: center;
}




@media screen and ( max-width:767px) {

  .br_pc {
    display: none;
  }

  .br_sp {
    display: inline;
  }

  /*----race_next ----*/

  #race_next {
    /* background: none; */
  }

  #race_next .inner {
    width: auto;
    padding: 28px 0 20px;
  }

  #race_next .race_next_txt {
    width: 92%;
    margin: 20px auto 0;
  }

  #race_next .race_next_txt img {
    width: 100%;
    padding: 0 0 15px;
  }


  /*----about ----*/

  #about .about_series .br_sp {
    display: inline;
  }

  #about .about_series .title h2 {
    padding-left: 1%;
    padding-right: 1%;
  }


  /*----jockey----*/

  #jockey {
  width: 94%;
  margin: 0 auto 30px;
  }

  #jockey .jocky_ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: auto;
  margin: 20px 0 0;
  }

  #jockey li {
  width: 48%;
  margin-right: 4%;
  margin-bottom: 4%;
  }

  #jockey li:nth-child(4n) {
    margin-right: 4%;
  }

  #jockey li:nth-child(2n) {
    margin-right: 0;
  }


  /* racelist */

  #racelist .racelist_ul li > a {
    background-image: url(../img/top/icon_arrow_color_sp.svg);
  }

  #racelist .racelist_ul li > a[target="_blank"] {
    background-image: url(../img/top/icon_blank_color_sp.svg);
  }


  /*----news----*/

  #news #news_list li a::after {
    background-image: url("../img/top/icon_arrow_color_sp.svg");
  }

  #news #news_list li a[target="_blank"]::after {
    background-image: url("../img/top/icon_blank_color_sp.svg");
  }



  /*----gallery----*/

  #gallery {
    padding: 7% 0 7%;
  }

  #gallery ul {
    justify-content: center;
    width: auto;
    margin: 20px auto 0;
  }

  #gallery ul .movie {
    padding: 0 4%;
    margin-bottom: 10%;
  }

  #gallery ul .photo_gallery {
    padding: 0;
    margin-bottom: 10%;
  }

  #gallery ul .photo_gallery .btn {
    padding: 5.5% 0 7%;
  }

  #gallery ul .photo_gallery .btn a {
    width: 43.6%;
    padding: 1.5% 10px 2%;
    margin: 0 1%;
    border-radius: 3px;
    font-size: 16px;
    background: #222 url(../common/img/icon_arrow_btn_black01_sp.svg) right 10px top 46% no-repeat;
    background-size: 18px;
  }

  #gallery ul .poster {
    width: 56%;
    margin-bottom: 6%;
  }

  #gallery ul img {
    width: 100%;
  }

  #gallery ul .cap {
    margin-top: 4px;
    text-align: center;
    font-size: 13px;
  }


  /*----victory_horse----*/

  #victory_horse {
    padding-bottom: 5%;
  }


  /*----link----*/
  #link .bnr_slider .slick-prev{
    background-image: url("../img/top/link_arrow_prev_sp.svg");
  }

  #link .bnr_slider .slick-next{
    background-image: url("../img/top/link_arrow_next_sp.svg");
  }


  /*---- twitter_cp ----*/
  #twitter_cp {
    width: 93%;
    margin: -8px auto 13%;
  }

  #twitter_cp .twitter_cp_inner {
    padding-bottom: 35px;
    border-width: 3px;
    border-top-width: 0;
  }

  #twitter_cp .sp_br {
    display: inline;
  }

  #twitter_cp #cp_cnt {
    padding: 0 3.7%;
  }

  #twitter_cp .read {
    padding: 8% 0 20px;
    font-size: calc(100vw / ( 375 / 14 ));
  }

  #twitter_cp .title_line {
    margin-bottom: 5%;
    font-size: calc(100vw / ( 375 / 21 ));
  }

  #twitter_cp .title_line .txt_wrap {
    padding: 1px 3.5%;
  }

  #twitter_cp .sec_prize {
    margin-top: 11%;
  }

  #twitter_cp .sec_prize .prize {
    padding: 8.5% 0 10.5%;
    border-radius: 8px;
  }

  #twitter_cp .sec_prize .prize .txt {
    margin-left: 4%;
  }

  #twitter_cp .sec_prize .prize .txt p {
    font-size: calc(100vw / ( 375 / 17 ));
    text-align: left;
  }

  #twitter_cp .sec_prize .prize .txt .small {
    margin-top: 8%;
    font-size: calc(100vw / ( 375 / 10 ));
  }

  #twitter_cp .sec_prize .prize .img {
    right: 6%;
    bottom: 0;
    width: 30.77%;
  }

  #twitter_cp .sec_howto {
    margin-top: 13%;
  }

  #twitter_cp .sec_howto .step_list li {
    width: 100%;
    margin-bottom: 34px;
    border-width: 4px;
    border-radius: 8px;
  }

  #twitter_cp .sec_howto .step_list li:last-child {
    margin-bottom: 0;
  }

  #twitter_cp .sec_howto .step_list li h4 {
    padding: 2px 0 6px;
    line-height: 1;
  }

  #twitter_cp .sec_howto .step_list li h4 img {
    width: 20%;
  }

  #twitter_cp .sec_howto .step_list li .flex {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
  }

  #twitter_cp .sec_howto .step_list li .illust {
    order: 2;
    width: 31.8%;
    margin: 3% 2% 6% 0;
  }

  #twitter_cp .sec_howto .step_list li .txt {
    order: 1;
    width: 56.5%;
    padding: 3% 0 4.5% 5%;
    font-size: calc(100vw / ( 375 / 13 ));
  }

  #twitter_cp .sec_howto .step_list li .txt_gray {
    padding-top: 8px;
    font-size: calc(100vw / ( 375 / 12 ));
  }

  #twitter_cp .sec_howto .step_list li:nth-child(1)::after,
  #twitter_cp .sec_howto .step_list li:nth-child(2)::after {
    right: auto;
    left: 50%;
    top: auto;
    bottom: -30px;
    width: 20px;
    height: 27px;
    margin: 0 0 0 -13px;
    transform: rotate(90deg);
  }

  #twitter_cp .btn_agreement {
    margin: 12% 0 0%;
  }

  #twitter_cp .btn_agreement .btn {
    width: 89.5%;
  }

  #twitter_cp .btn_agreement .notes {
    margin-top: 2.5%;
    font-size: 11px;
  }

  #twitter_cp .btn_agreement .manga_link {
    margin-top: 9%;
    font-size: calc(100vw / ( 375 / 13 ));
    line-height: 1.9;
  }

  #twitter_cp .ac_trigger a {
    width: 60%;
    padding: 11px 0;
    font-size: 15px;
    border-bottom: none;
  }

  #twitter_cp .ac_trigger a::after {
    top: calc(50% - 8px);
    width: 12px;
    height: 16px;
  }

  .fancybox-slide {
    padding: 50px 5%;
  }


  /*---- cp_202302_1 ----*/
  #cp_202302_1 {
    width: 93%;
    margin: -8px auto 13%;
  }

  #cp_202302_1 a {
    color: #e61673;
    border-bottom: 1px dotted #e61673;
  }

  #cp_202302_1 .cp_ribbon {
    width: 74%;
    margin: 0 auto 10px;
  }

  #cp_202302_1 .cp_202302_1_inner {
    border-width: 6px;
    background: #fff linear-gradient(180deg, rgba(255,255,255,1) 93%, rgba(255,210,0,1) 100%);

  }

  #cp_202302_1 .read {
    padding: 18px 5% 40px 6%;
    font-size: 14px;
    line-height: 1.7;
  }

  #cp_202302_1 .read .pink {
    font-size: 15px;
  }

  #cp_202302_1 .read .orange {
    font-size: 15px;
  }

  #cp_202302_1 .prize {
    width: 90%;
  }

  #cp_202302_1 .prize .prize_h {
    margin-bottom: 15px;
  }

  #cp_202302_1 .prize li {
    position: relative;
    padding: 15px 0 24px 24%;
    background-size: 75px;
  }

  #cp_202302_1 .prize li .icon {
    top: -1px;
    left: -1px;
    width: 26%;
  }

  #cp_202302_1 .prize li .name {
    font-size: calc(100vw / ( 390 / 20 ));
    line-height: 1.3;
  }

  #cp_202302_1 .prize li .name .small {
    font-size: calc(100vw / ( 390 / 16 ));
  }

  #cp_202302_1 .prize li .name_sub {
    padding-bottom: 5px;
    line-height: 1;
  }

  #cp_202302_1 .prize li .winners {
    font-size: calc(100vw / ( 390 / 16 ));
  }

  #cp_202302_1 .prize li .winners span {
    font-size: calc(100vw / ( 390 / 18 ));
  }

  #cp_202302_1 .prize .prize_A {
    padding-bottom: 28%;
    margin-bottom: 22%;
  }

  #cp_202302_1 .prize .prize_A .photo {
    right: 15px;
    bottom: 0;
    margin-bottom: -12%;
    width: 80%;
  }

  #cp_202302_1 .prize .prize_B {
    padding-bottom: 20%;
    margin-bottom: 20%;
  }

  #cp_202302_1 .prize .prize_B .photo {
    right: 15px;
    bottom: 0;
    margin-bottom: -12%;
    width: 56%;
  }

  #cp_202302_1 .prize .prize_W {
    padding-bottom: 28%;
    margin-bottom: 26%;
  }

  #cp_202302_1 .prize .prize_W .photo {
    right: 15px;
    bottom: 0;
    margin-bottom: -14%;
    width: 58%;
  }

  #cp_202302_1 .btn_entry {
    margin-bottom: 0px;
  }

  #cp_202302_1 .btn_entry .btn {
    width: 89.5%;
  }

  #cp_202302_1 .btn_agreement {
    margin: 5% 0 10%;
  }

  #cp_202302_1 .btn_agreement .btn {
    width: 80.5%;
  }

  #cp_202302_1 .btn_agreement .notes {
    margin-top: 2.5%;
    font-size: 11px;
  }


  /*---- cp_202302_2 ----*/
  #cp_202302_2 {
    width: 93%;
    margin: -8px auto 10%;
  }

  #cp_202302_2 a {
    color: #e61673;
    border-bottom: 1px dotted #e61673;
  }

  #cp_202302_2 .cp_ribbon {
    width: 74%;
    margin: 0 auto 10px;
  }

  #cp_202302_2 .cp_202302_2_inner {
    border-width: 6px;
    background: #fff linear-gradient(180deg, rgba(255,255,255,1) 93%, rgba(121,200,28,1) 100%);

  }

  #cp_202302_2 .read {
    padding: 18px 5% 20px 6%;
    font-size: 14px;
    line-height: 1.7;
  }

  #cp_202302_2 .read .pink {
    font-size: 15px;
  }

  #cp_202302_2 .read .orange {
    font-size: 15px;
  }

  #cp_202302_2 .ac_trigger a {
    width: 60%;
    padding: 11px 0;
    font-size: 15px;
    border-bottom: none;
  }

  #cp_202302_2 .ac_trigger a::after {
    top: calc(50% - 8px);
    width: 12px;
    height: 16px;
  }

  #cp_202302_2 .prize {
    width: 90%;
  }

  #cp_202302_2 .prize .prize_h {
    margin-bottom: 15px;
  }

  #cp_202302_2 .prize .prize_list {
    flex-wrap: wrap;
    padding-bottom: 10px;
  }

  #cp_202302_2 .prize .prize_list > li {
    width: 100%;
    margin-bottom: 30px;
    background-size: 75px;
  }

  #cp_202302_2 .prize .prize_list > li::before {
    border-left: 140px solid #fff;
    border-bottom: 140px solid transparent;
  }

  #cp_202302_2 .prize .prize_list .li_inner {
    padding-bottom: 38px;
  }

  #cp_202302_2 .prize .prize_list .title {
    width: 60%;
    padding-left: 10px;
    margin-bottom: 8px;
  }

  #cp_202302_2 .prize .prize_list .txt {
    min-height: 0;
    padding: 0 10px;
    margin-bottom: 6px;
    font-size: 14px;
  }

  #cp_202302_2 .prize .prize_list .name {
    padding-left: 10px;
    font-size: 17px;
  }

  #cp_202302_2 .prize .prize_list .prize_1st .photo {
    width: 42.3%;
    padding-top: 15px;
  }

  #cp_202302_2 .prize .prize_list .prize_higher {
    margin-bottom: 70px;
  }

  #cp_202302_2 .prize .prize_list .prize_higher .photo {
    width: 68.3%;
    padding-top: 20px;
  }

  #cp_202302_2 .prize .prize_list .prize_w .photo {
    width: 36.7%;
    padding-top: 10px;
  }

  #cp_202302_2 .prize .prize_list .winners {
    padding: 2px 10px;
    font-size: 16px;
  }

  #cp_202302_2 .prize .prize_list .winners span {
    margin-right: 2px;
    font-size: 21px;
  }

  #cp_202302_2 .prize .annotation {
    position: absolute;
    padding-top: 4px;
    font-size: 11px;
  }

  #cp_202302_2 .btn_entry {
    margin-bottom: 0px;
  }

  #cp_202302_2 .btn_entry .btn {
    width: 86%;
  }

  #cp_202302_2 .btn_agreement {
    margin: 5% 0 8%;
  }

  #cp_202302_2 .btn_agreement .btn {
    width: 80.5%;
  }

  #cp_202302_2 .btn_agreement .notes {
    margin-top: 2.5%;
    font-size: 11px;
  }

  #cp_202302_2 .btn_pointranking {
    width: 90%;
  }

  #cp_202302_2 .btn_pointranking .icon {
    width: 50px;
  }

  #cp_202302_2 .btn_pointranking .icon img {
    width: 34px;
  }

  #cp_202302_2 .btn_pointranking .txt {
    width: calc(100% - 50px);
    padding: 10px 35px 12px 14px;
    background-position: right 8px center;
    background-size: 24px;
    font-size: 14px;
    line-height: 1.4;
  }

  #cp_202302_2 .btn_pointranking .txt .bold {
    padding-bottom: 2px;
  }

  #cp_202302_2 .btn_pointranking .txt .pink {
    margin-right: 5px;
    font-size: 20px;
  }


}