@charset "utf-8";
/* CSS Document */
@media screen and (max-width: 959px) {
	/* 959px以下に適用されるCSS（タブレット用）*/
    .wrapper {
    	margin: 0px 0;
    	padding: 0px 0 0 0;
    	/* width: auto; */
    	position: relative;
	min-height: auto;
    }
    .omura_logo a {
        display:block;
        width:80%;
    }
    .sp_sns {
        width: 30%;
        height: 38px;
        display: block;
        position: absolute;
        right: 40px;
        top: 25px;
    }
    .sp_sns a{
        text-decoration: none;
    }
    .sp_sns img {
        width: 34px;
    }
    .visual_area{
      width: 100%;
      height: 0;
      padding-top: calc(1564 / 1200 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
      background: url(../images/sp_top_bg.jpg) center center / cover no-repeat;
      position: relative;
     }
    .visual_area04{
      width: 100%;
      height: 0;
      padding-top: calc(1000 / 750 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
      background: url(../images/sp_bg01.jpg?v=1) center center / cover no-repeat;
      position: relative;
     }
    .visual_area05{
      width: 100%;
      /*height: 0;*/
      /*padding-top: calc(1000 / 750 * 100%);*/ /* calc(画像高さ ÷ 画像横幅 × 100%) */
      /*background: url(../images/sp_bg01.jpg?v=1) center center / cover no-repeat;*/
      display: flex;
      flex-wrap: wrap;
      position: relative;
      z-index: 99;
    }

    .visual_area05 .areabox_left{
	width: 100%;
	padding: 0 11px;
	position: relative;
    }

    .visual_area05 .areabox_right{
	width: 100%;
        padding-top: 1rem;
    }

    .visual_area05 .areabox_right .ranking_title {
        top: 20px;
    }

    .visual_area05 .areabox_right .ranking_title img {
        width: 60%;
        height: auto;
    }

    .ranking_inner {
	margin:0 auto;
	top: 270px;
	width:90%;
        overflow-y: auto;
        padding-right: 10px;
        z-index: 1;
    }
    .ranking_title div.tarm{
      font-size:1.6rem;
      margin-top: -8px;
    }

    .prize_ranking_box {
        position: relative;
        margin: 0 auto;
        padding: 0;
        width: 56%;
        display: flex;
        background-color: #d7c561;
        margin-top: 0;
        margin-bottom: 2px;
    }

    .prize_ranking_box .item_info div.racer_info {
	font-size: 1.5rem;
    }
    .prize_ranking_box span  {
        font-size: clamp(20px, 3.5vw, 36px);
        font-weight: 800;
    }
    .prize_ranking_box .item_info div.racer_info span {
        color: black;
        font-weight: bold;
        font-size: 2rem;
        text-align: center;
    }
    .prize_ranking_box .item_photo div.prizemoney {
    	font-size: 1.9rem;
    	padding: 2px 0;
	font-family: 'Noto Sans JP', sans-serif !important;
    	font-weight: 700;
    	font-stretch: condensed;
    	transform: scaleY(1.2);
    	text-align: center;
    }

    div.prize_ranking_box_mini {
        width: 100%;
        padding: 1rem 0;
    }
    div.prize_ranking_box_mini table {
        width: 70%;
        margin: 0 auto;
        border-spacing: 0px;
    }
    .main_visual_image {
        width: 100%;
        right: 0px;
        bottom: 0px;   
    }
    div.prize_ranking_box_mini table td.tbl_rank div.rank {
        font-size: 1.2rem;
        top: 37%;
        color: #8e5311;
    }
    div.prize_ranking_box_mini table td.tbl_racer_info {
    width: 28%;
    color: black;
    font-weight: bold;
    font-size: 0.9rem;
    text-align: center;
    border-bottom: 2px solid black;
    }
    div.prize_ranking_box_mini table td.tbl_prizemoney div {
        font-size: 1rem;
        font-family: 'Noto Sans JP', sans-serif !important;
        font-weight: 700;
        font-stretch: condensed;
        transform: scaleY(1.2);
    }



/* 202607 選手swiper　対応　*/
    .main_racer {
        top: 0rem;
        width: 100%;
        height: auto;
        position: absolute;
    	margin-top: 25%;
    }
.racer-swiper img {
  height:  65vw;
  width: auto;
  object-fit: contain;
}


/* 202607 選手swiper　対応 */

    .top_title_box{
        position: absolute;
        display: flex;
        bottom: 0rem;
        flex-wrap: wrap;
        width: 100%;
        /* text-align: center; */
        align-content: center;
        justify-content: flex-start;
	z-index: 99;
    }
    .top_title_box img.race_title {
	width: 50%;
	padding-left:0rem;
	z-index: 99;
    }
    .top_title_box img.race_day {
	padding-top: 55%;
        width: 100%;
    }    
    .top_day_box{
        position: absolute;display: flex;bottom:0.5rem;flex-wrap: wrap; width: 100%;
        text-align: center; align-content: center;justify-content: center;
	height:18rem;
    }
    .top_day_box img.race_day {
        width:100%;
    }    
    .fadeDown{
        animation-name:fadeDownAnime;
        animation-duration:1s;
        animation-fill-mode:forwards;
        animation-delay: 1s;
        opacity:0;
    }
    @keyframes fadeDownAnime{
      from {
        opacity: 0;
      transform: translateY(-100px);
      }
      to {
        opacity: 1;
      transform: translateY(30px);
      }
    }

    
    .contents_area,
    .news_area,
    .movie_area,
    .sgwinner_area,
    .sns_area{
        /*background-image: url(../images/background_sp.jpg);*/
        background-repeat: no-repeat;
        background-position: center top;
        background-size: cover;
    }
    
    .ranking_area {
	margin: 0 auto;
	width: 100%;
	flex-wrap: wrap;
	margin-bottom:1rem;
    }

    .ranking_item, #news_pc {
	width: 100%;
	margin: 0;
	margin-top: 1rem;
    }

    div.sgwinner_racerbox{
		width: 100%;
		height: calc(100vw * 0.5625);  
                height:auto;
                justify-content: center;
        }
	.contents_area{
		width: 100vw;
		/*height: calc(100vh - 460px);*/
                height:auto;
		margin: 0.5rem auto 0px;
        	z-index: 10;
        }   
        .news_area{
		width: 100vw;
		height: calc(100vh + 100px);
                height:auto;
		margin: 0 auto 0px;
        }

        .top_info_box{
            max-height: 300px;
            overflow-y: scroll;
        }
        div.contents_btn_area{
		width: 100%;
		height: calc(100vw * 0.5625);
                height:auto;

		margin: 0 auto 8px;
                gap: 10px 1px;
	}
        .pickup_news_flex{
		width: 100%;
		height: calc(100vw * 0.5625);
                height:auto;

		margin: 0 auto 0px;            
        }
        .movie_area{
		width: 100vw;
		height: calc(100vh + 100px);
                height:auto;

		margin: 0 auto 0px;
        }   
        .sgwinner_area{
		width: 100vw;
		height: calc(100vh + 300px);
                height:auto;
		margin: 0 auto 0px;
        }
        .sns_area{
		width: 100vw;
		height: calc(100vh + 500px);
                height:auto;

		margin: 0 auto 0px;
        }
        .sns_flex{
		width: 100%;
		height: calc(100vw * 0.5625);
                height:auto;

		margin: 0 auto 10px;            
        }
        .contents_btn{
                margin: auto;
                font-size: 1rem;
        }
        .contents_btn_item01{
            position: relative;
            width: 95%;
        }
        .contents_btn_item02{
            position: relative;
            width: 45%;
        }
        .contents_btn_item03{
            font-size: 0.9rem;
            position: relative;
            width: 29%;
            height: 60px;
        } 
        .contents_btn_item03_1{
            font-size: 0.9rem;
            position: relative;
            width: 29%;
            /*height: 60px;*/
            padding:5px 0 0;
        }
        .contents_btn_item03 a,
        .contents_btn_item03_1 a {
            line-height: 1rem;
            display: block;
            width: 100%;
            height: auto;
            vertical-align: middle;            
        }
        
        
	.main_news1 {
	    width: 100%;
	    display: flex;
	    flex-wrap: wrap;
	    background-color: #e6759b5c;
	    margin: 1rem 0;
	}

        .single_item {
            width: 100%;
            height: 4rem;
            justify-content: center;
            align-items: center;
            font-size: 1.1rem;
            font-weight: 600;
        }
        .single_item_active span {
            font-style: italic;
            color: yellow;
        }
        .dream_item,.dream_item_2{
            width: 100%;
        }
        div.dream_item div.single_item {
            height: 4rem;            
            font-size: 1.1rem;
        }        
        .dream_table div.tei {
            text-align: center;
            font-size: 0.9rem;
            line-height: 1.1rem;
            padding:2px 0;
        }
        .top_dream p.text {
            padding: 0 10px;
            text-align: left;
            font-size: 0.9rem;
            line-height: 1rem;
        }
        .pn_item,
        .pn_item_pickup,
        .pn_item_news{
            width: 100%;
        }
        .pn_item_item02{
            height:auto;
	width:100%;
        }
        .swiper--wrapper {
          /* wrapperのサイズを調整 */
          width: 100%;
          height: 260px;
        }
        .swiper-slide {
          /* スライドのサイズを調整、中身のテキスト配置調整、背景色 */
          color: #ffffff;
          width: 100%;
          height: 100%;
        }   
        
        /* 過去優勝戦動画リスト */
        .movie_link_box ul.scroll_content { /* リスト全体のスタイル */
            display: flex;
            width: 100%;
            justify-content: unset;
        } 
        .movie_link_box ul.scroll_content li { /* 各リストのスタイル */
            width: 80px;
        }
        .movie_link_box ul.scroll_content li a{
            width: 100%;
        } 
        .scroll_content::-webkit-scrollbar {
            height: 15px; /* スクロールバーの高さ */
        }
        .acd-label{
            position: relative;
        }
            
        .acd-label:after{
            content: '▼';
            display: block;
            height: 20px;
            padding: 10px 20px;
            position: absolute;
            right: 0;
            top: 0px;
        }
        .acd-check:checked + .acd-label:after{
            content: '▲';
        }

        
        /* sgwinner 1行3列の場合（2列の場合下記をコメント）*/
        div.sgwinner_racerbox {
            margin: 0;
        }
        .racer_item {
            width:110px;
            height: 220px;
            margin: 4px;
        }
        .review_img {
            width: 100%;
            height: 149px;
        }
        /* sgwinner end */

        /* sns (twitter instagram 埋め込み個所) */
        .sns_item{
            width: 98%;
            justify-content: center;
        }
        .title_h{
            /*margin: 65px 0px 45px 0px;*/
            padding: 40px 0;
        }
        .sns_item_item02{
            height:355px;
            width: 100%;
        }
        .sns_item_item03{
            height:auto;
            background-image:none;
        }        
        .sns_pc_only,
        .pc_only{
            display:none;
        }
        .sp_only{
            display:block;
        }
        
        /* sns icon */
        .sp_sns{
            width:35%;
            height:36px;
            display:block;
            position: absolute; 
            right: 40px;
            top: 25px;
        }
        .sp_sns img{
            width: 20px;
        }
        .sp_sns a{
            text-decoration: none;
            width: 100%;
            height: 100%;
        }
        .pc_sns{
            display:none;
        }

        .cd_txt{
/*            width: 270px;
            height: 110px;   
            padding-right: 20px;*/
            
            width: 156px;
            height: 94px;
            padding-right: 0px;
        }
        .cd_txt span{   
            font-size:1rem;
            padding: 5px 0px 0 15px;    
        }
        .cd_txt ul {
/*          width: 180px;
          height: 57px;*/
            width: 140px;
            height: 48px;
            margin: 0 auto;
            top:2rem;
            left:2rem;            
        }
        .cd_txt_day{
            bottom:1px;
            font-size: 1rem;
            right: 4px;
        }
        
        /* タイトル */
.contents_area .title_h img{
    width:41%;
}
.movie_area .title_h img{
    width:50%;
}
.sgwinner_area .title_h img{
    width:41%;
}
.pickup{
    width:36%;
}
.news{
    width:31%;
}
.twitter{
    width:33%;
}
.instagram{
    width:41%;
}
.swiper_live_waku_flex{
    margin: 20px 0;
}
.top_live_movie_box {
    width: 100%;
}
}

/* ★ スマホ専用（余白を消す） */
@media (max-width: 768px) {
  .top_left_text {
/*
    width: 32%;
    height: 17%; 
    font-size: clamp(24px, 14vw, 70px);
    transform: translate(-50%, -50%) scaleY(1.20) scaleX(1.15);
*/
    top: 59%;          /* ← 少し下げて中央寄りに */
    left: 39%;         /* ← スマホは中央基準が安定 */
    width: 58%;        /* ← 枠を広げて数字を大きく見せる */
    height: 22%;       /* ← DAYS の余白を確保 */
    transform: translate(-50%, -50%) scaleY(1.15) scaleX(1.10);
  }
  .label {
    font-size: 0.9rem;
    line-height: 1.0;
  }

  .count_row {
    width: 100%;
    justify-content: center; /* ← akikoさんが入れた調整、スマホでも有効 */
    align-items: baseline;   /* ← DAYS が自然に数字の横に揃う */
  }

  .number {
/*    font-size: clamp(32px, 14vw, 70px);*/
    font-size: clamp(40px, 20vw, 100px);
  }
  .days {
    font-size: 1.2rem;
    padding-bottom: 0.1em;
  }


.ranking_inner {
  overflow-y: scroll;
  top: 230px;
}

/* スクロールバーを常時表示させる */
.ranking_inner::-webkit-scrollbar {
  width: 8px;          /* ← 太さを指定すると常時表示される */
}

.ranking_inner::-webkit-scrollbar-thumb {
  background-color: #d7c561; /* ← 色（お好みで） */
  border-radius: 4px;
}

.ranking_inner::-webkit-scrollbar-track {
  background-color: rgba(255,255,255,0.1); /* ← 背景（薄く） */
}


    .ranking_title div.tarm{
      font-size:1.5rem;
      margin-top: -8px;
    }
    .prize_ranking_box {
        position: relative;
        margin: 0 auto;
        padding: 0;
        width: 75%;
        display: flex;
        background-color: #d7c561;
        margin-top: 0;
        margin-bottom: 2px;
    }
    .prize_ranking_box .item_photo div.prizemoney {
    	font-size: 1.6rem;
    	font-stretch: condensed;
    	transform: scaleY(1.2);
    	text-align: center;
    }

    div.prize_ranking_box_mini table {
        width: 90%;
        margin: 0 auto;
        border-spacing: 0px;
    }


}

@media screen and (max-width: 560px) {
	/* 558px以下に適用されるCSS（スマホ用） */
    .prize_ranking_box {
        position: relative;
        margin: 0 auto;
        padding: 0;
        width: 95%;
    }
   .prize_ranking_box .item_info div.racer_info {
	font-size: 1.1rem;
    }
    .prize_ranking_box span  {
        font-size: clamp(20px, 3.5vw, 36px);
        font-weight: 800;
    }
    .prize_ranking_box .item_info div.racer_info span {
        color: black;
        font-weight: bold;
        font-size: 1.5rem;
        text-align: center;
    }
    .prize_ranking_box .item_photo div.prizemoney {
    	font-size: 1.4rem;
    	padding: 2px 0;
	font-family: 'Noto Sans JP', sans-serif !important;
    	font-weight: 700;
    	font-stretch: condensed;
    	transform: scaleY(1.2);
    	text-align: center;
    }

}

@media screen and (max-width: 480px) {
	/* 480px以下に適用されるCSS（スマホ用） */
        header {
            padding: 8px 0 3px;
        }
        .sp_sns {
            width: 40%;
            height: 38px;
            display: block;
            position: absolute;
            right: 40px;
            top: 25px;
        } 
        .sp_sns img {
            width: 23px;
        }  
        .top_enter_message{
            display: flex;
            justify-content: center;
            height:3rem;
            font-size:0.9rem;
            line-height: 1rem;
            align-items: center;
            text-align: left;
            padding: 0;
        }
        .ranking_inner {
		overflow-y: scroll;
		top: 160px;
	}

        /* 展望 */
        .top_tenbou_box h3 {
            color: #fffafa;
            font-size: 1rem;
            font-weight: bold;
            font-style: italic;
            text-shadow: 4px 2px 0 0000001a;
            line-height: 2rem;
            letter-spacing: 2;
            padding: 20px 0 20px 0;
        }
        .top_tenbou_box_fl img {
            width: 100%;
            padding-bottom: 5px;
        }
        .top_tenbou_box_fl_series .textmain {
            width: 100%;
        }
        .top_tenbou_box_fl_series .image {
            width: 100%;
        }
        .top_tenbou_box .text {
            padding: 1rem 0.5px 20px;
            font-size: 1rem;
            color: #0f0f0f;
            letter-spacing: 1;
            font-weight: 500;
            line-height: 1.5rem;
            text-align: left;
        }
        .pc_disp_only{
            display:none;
        }
        .sp_disp_only{
            display:block;
        }
        
}


