﻿/*---br管理--*/
/*---スマホ時改行--*/
@media screen and (max-width : 480px) 
{
    .pc-br{display : none;}
    .tb-br{display : none;}
    .sp-br{display : block;}
}
/*---タブレット時改行--*/
@media screen and (min-width : 481px) and (max-width : 1020px) 
{
    .pc-br{display : none;}
    .tb-br{display : block;}
    .sp-br{display : none;}
}
/*---PC時改行--*/
@media screen and (min-width : 1021px)
{
    .pc-br{display : block;}
    .tb-br{display : none;}
    .sp-br{display : none;}
}
/*追加分=============================================*/
/*@media screen and (min-width: 1440px) {
    #wrapper {
        max-width: 1400px; 
        margin: 0 auto;    
    }
}*/
/*==================================================*/
@media (max-width: 1180px) 
{
    main #slideshow 
    {
        position:relative;
        margin : 0 auto;
        width : 450px;
        right:140px;
    }

    #mes-top {
        position: absolute;
        top:  25%;
        left: 50%; /* 中央寄せ */
        transform: translateX(-50%); /* 中央寄せを確実にする */
        font-size: 16px;
    }

}

@media (max-width: 767px) 
{
    header
    {
        width : 100%;
        height : auto;
    }
    
    #top_mes 
    {
        margin-left : 32px;
        margin-top  : 32px; /* スマホ用に余白を調整 */
    }

    #logo
    {
        float : right;
    }

    header h5
    {
        display : none;
    }
    
    #menu li
    {
      display : none;
      list-style : none;
    }

    main
    {
        left : 0px;
    }

    main #slideshow 
    {
        margin : 0 auto;
        width : 400px;
        left : 14px;
    }

    #mes-top
    {
      
        top : 25%;
        left : 40%;
        font-size : 16px;
    }
   
    .picture
    {
        display: block;
        width:100%; 
    }
    #top_mes {
        width: 100%; /* 幅を画面幅に合わせる */
        max-width: 100%; /* 最大幅を画面幅に制限 */
        margin: 0 auto; /* 左右の余白を自動で設定 */
        padding: 0 10px; /* 左右に余白を追加 */
        text-align: center; /* テキストを中央寄せ */
        box-sizing: border-box; /* パディングを幅に含める */
    }
}
@media screen and (max-width: 480px) 
{
    table
    {
        margin-left : 32px;
    }
}

.movie
{
    max-width: 320px;
    margin-left: 5%;
}

.movie-type2
{
    max-width: 200px;
    margin-left: 5%;
}