@charset "utf-8";
/* CSS Document */
@media screen and (max-width: 959px) {
	/* 959px以下に適用されるCSS（タブレット用）*/
    .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_bg1.jpg?v=1) center center / cover no-repeat;
      position: relative;
     }
    .main_visual_image {
        width: 100%;
        right: 0px;
        bottom: 0px;   
    }
    .top_title_box{
        position: absolute;display: flex;top:0.5rem;flex-wrap: wrap; width: 100%;
        text-align: center; align-content: center;justify-content: center;
    }
    .top_title_box{
        position: absolute;display: flex;bottom:1rem;
        flex-wrap: wrap; width: 100%;
        text-align: center; justify-content: center;
            align-content: flex-end;
    }
    .top_center_logo {
	width:60%;
    }
    .top_center_logo img {
	width:100%;
	padding:0;
    }

    .top_left_text {
        position: absolute;
        top: 6rem;
        left: 1rem;
        width:25%;
        display: flex;
    }

    .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);
      }
    }


    .top_title_box img.race_title {
        width:90%;
    }
    .top_title_box img.race_day {
        width:90%;
    }    
    .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;
    }
    
        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 auto 0px;
        }   
        .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;            
        }
        
        
        .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;
        }


.movie_single_item {
    width: 100%;
    margin: 0 auto;
    margin-top: 1rem;
}

.movie_single_title {
    width: 100%;
    padding: 1rem;
    font-size: 1.2rem;
}
.youtube_responsive {
    width: 90%;
    margin: auto;
    margin-top: 1rem;
    margin-bottom: 1rem;
    aspect-ratio: 16 / 9;
}

        .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 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;
        }
        
        /* 展望 */
        .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;
        }
}


@media screen and (max-width: 959px){
    .main_visual_image img {
        bottom:auto; 
        width:100%;
    }
    .main_visual_image {
        width: 100%;
        right: 0px;
        top: -10px;
        display: flex;
        align-items:flex-start;
    }
}