@charset "UTF-8";
/* CSS Document */
html{
     scroll-behavior: smooth;
}




/* -------------------------------------------------------------------------------------------------------------------
SP 縦-                                                                                                           
------------------------------------------------------------------------------------------------------------------- */
@media (orientation: portrait) {
  .pc {
    display:none;
  }
  .tb {
    display: block;
  }
  .sp {
    display: block;
  }
  .pcBr {
    display: none;
  }
  .spBr {
    display: block;
  }
    
        #header_titl{
            widows: 100%;
        background-color: #000;
    }
    

    
                /* 記事リスト =================================== */
    .news_list{

        display: flex;
        flex-direction: row;
    flex-wrap: wrap;

    }
    
    .news_list_box{
        border: solid 3px;
        width: 45%;
        background-color: #fff;
        margin: 5px;
        display: flex;
    }
    
        .comingsoon{
        background-color: #9D9D9D;
    }
    
    .comingsoon p{
        font-weight: bold;
        font-size: 2rem;
        color: #FFFFFF;
            margin: 0 auto;
            margin-top: 50%;
    }
    
    .comingsoon2{
        display: none;
    }
    
    .news_list_titl{
        margin: 10px;
        text-align: left;
    }
    

    
    .news_list_titl p{
        font-size: 1.2rem;
    }
    
    .category_time{
        font-size: 1rem;
        color: #3281f6;
    }


            /* 記事 =================================== */
        #article{
        width: 100%;
         padding: 30px 0;
     background-color: #ffffff7a;
        margin: 0 auto;
        
    }
    
    .article_titl{
        text-align: left;
    }
    
    .article_category{
            background-color: #3281f6;
    color: #FFFFFF;
    padding: 2px;
    font-size: 1.2rem;
    display: inline-block;
    margin-right: 5px;
        margin-top: 20px;
    }
    
    .article_time{
        margin-bottom: 20px;
        color: #3281f6;
        display: inline-block;
        font-size: 1rem;
    }
    
    
    .article_titl p{
        font-size: 1.5rem;
        font-weight: bold;
        margin: 10px 0;
    }
    
    .article_titl img{
        margin: 0 auto;
            width: 100%;
    }
    
    .article_info{
                width: 90%;
        margin: 0 auto;
        margin-top: 30px;
    }
    
    .article_info img{
        margin: 0 auto;
    }
    
    .article_text img{
        width: 50%;
            margin: 20px 10px;
    }
    
    .article_text p{
        text-align: left;
            line-height: 2.8rem;
    font-size: 1.4rem;
    }
    
    .article_text a{
        text-decoration:underline;
    }

    .list_titl{
        font-weight: bold;
        text-decoration:underline;
    }

    .chart_banner img{
        width: 100%;
        margin: 0 auto;
    }
    
        .width_beside img{
        width: 80%;
    }

    
        #official{
        padding: 10px 0;
        width: 95%;
            margin: 0 auto;
        
    }
    
    .topics_bg{
                padding: 10px 0;
/*        width: 95%;*/
       

    }
    

}

/* -------------------------------------------------------------------------------------------------------------------
SP 横-                                                                                                           
------------------------------------------------------------------------------------------------------------------- */
@media (orientation: landscape) {
  .pc {
    display:none;
  }
  .tb {
    display: block;
  }
  .sp {
    display: block;
      margin: 0 auto;
  }
  .pcBr {
    display: none;
  }
  .spBr {
    display: block;
  }
    
    
}

/* -------------------------------------------------------------------------------------------------------------------
iPad 縦-                                                                                                           
------------------------------------------------------------------------------------------------------------------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {
  .pc {
    display:none;
  }
  .tb {
    display: block;
  }
  .sp {
    display: block;
  }
  .pcBr {
    display: none;
  }
  .spBr {
    display: block;
  }
    

}






/* -------------------------------------------------------------------------------------------------------------------
961px-                                                                                                           
------------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width: 960px) {
	.pc {
		display: block;
	}
  .sp {
	  display: none;
	}
	
  .f-small {
	  font-size: 1.4rem;
	}
	
  .f-middle {
	  font-size: 1.6rem;
	}
    
    #header_titl{
        width: 100%;
        background-color: #000;
    }
    
    #header_titl img{
        width: 100%;
    }
    
            /* 記事リスト =================================== */

            #articles{
            margin-top: 50px;
            margin-bottom: 100px;
            }
    
        .article_list_info{
                width: 100%;
        margin: 0 auto;
        margin-top: 30px;
    }
/*
    .news_list{
        display: flex;
        flex-direction: row;
    flex-wrap: wrap;
    }
    
    .news_list_box{
        border: solid 3px;
        width: 30%;
        background-color: #fff;
        margin: 10px;
    }
    
    .comingsoon{
        background-color: #9D9D9D;
    }
    
    .comingsoon p{
        font-weight: bold;
        font-size: 2rem;
        color: #FFFFFF;
            margin-top: 50%;
    }
    
        .comingsoon2{
        background-color: #9D9D9D;
    }
    
    .comingsoon2 p{
        font-weight: bold;
        font-size: 2rem;
        color: #FFFFFF;
            margin-top: 50%;
    }
    
    .news_list_titl{
        margin: 10px;
        text-align: left;
    }
    
    .news_list_titl p{
        font-size: 1.8rem;
    }
    
    .category_time{
        font-size: 1rem;
        color: #3281f6;
    }
*/
    
        #official{
        padding: 50px 0;
        /* width: 65%; */
       
        margin: 0 auto;
    }
    
    
        /* 記事 =================================== */
        #article{
        width: 65%;
         padding: 50px 0;

        margin: 0 auto;
        
    }
    
    .article_titl{
        text-align: left;
    }
    
    .article_category{
            background-color: #3281f6;
    color: #FFFFFF;
    padding: 2px;
    font-size: 1.5rem;
    display: inline-block;
    margin-right: 5px;
        margin-top: 20px;
    }
    
    .article_time{
        margin-bottom: 20px;
        color: #3281f6;
        display: inline-block;
    }
    
    
    .article_titl p{
        font-size: 2.5rem;
        font-weight: bold;
        margin: 20px 0;
    }
    
    .article_titl img{
        margin: 0 auto;
            width: 100%;
    }
    
    .article_info{
                width: 80%;
        margin: 0 auto;
        margin-top: 30px;
    }
    
    .article_info img{
        margin: 0 auto;
    }
    
    .article_text img{
        width: 30%;
            margin: 30px 20px;
    }
    
    .article_text p{
        text-align: left;
            line-height: 3rem;
    font-size: 1.5rem;
    }
    
    .article_text a{
        text-decoration:underline;
    }

    .list_titl{
        font-weight: bold;
        text-decoration:underline;
    }
    
    .chart_banner p{
        
    }

    .chart_banner img{
        width: 100%;
        margin: 0 auto;
    }
    
    .width_beside img{
        width: 50%;
    }

    .topics_bg{
         width: 65%;
            background-color: #ffffffad;
        margin: 0 auto;
    }

    
}