body{
    margin: 0;
    font-size: 1rem;
    font-weight: 300;
    line-height: 1.5;
    color: #CFCFCF;
    text-align: start;
    background-color: #032859;
}
/*------ fontの設定（Roboto, Open Sansはheadで読み込んでいます）------*/
header, aside, footer, nav, h1, h2 ,h3 ,h4 ,h5, main{
    font-family: "Roboto", "Open Sans", system-ui, -apple-system, "Segoe UI","Helvetica Neue", Arial, "Noto Sans", sans-serif;
}
/*main{
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
}*/

/*------ 2025年度の国際シンポのポスターをベースにした場合のカラー ------*/
/*
  リンク #05C7F2
  ホバー/ボタン	#0540F2
  背景  #032859
  背景強調 rgba(0, 0, 0,0.1)
  罫線　rgba(255, 255, 255, 0.1)
  テキスト	#CFCFCF
  補足テキスト #BFBFBF

  スマホメニューの背景　#011C40　透過として使用＞rgba(1, 28, 64, 0.95)

  ランチ　カフェ　塗　rgba(2, 115, 62, 0.2)  ←#02733Eの20%透明
  ランチ　カフェ　縁  #02733E
  ランチ　カフェ　時間　#C8E6C9
  ランチ　カフェ　文字　#E8F5E9
*/

/*------ Webサイトの構成 ------*/
/*
｜header-sp(スマホ・タブレットのみ)｜
------------------------------
｜        container         ｜ 
------------------------------
｜ aside　 ｜  heade(PCのみ) ｜
｜ aside　 ｜  main　        ｜
｜ aside　 ｜    ｜_section  ｜
｜ aside　 ｜    ｜_section  ｜
｜(↑PCのみ)｜　 footer　     ｜
*/

/*------ PC ------*/
@media (min-width: 1025px) {

    .container {
        display: grid;
        width: 100%;
        grid-template-areas:
            "aside header"
            "aside main"
            "aside footer";
        grid-template-rows: auto 1fr auto;
        grid-template-columns: 1fr 3fr;
    }

    /* areaとタグの紐づけ */
    header {
        grid-area: header;
    }

    aside {
        grid-area: aside;
    }

    main {
        grid-area: main;
    }

    footer {
        grid-area: footer;
    }

    /* PCではスマホ専用ヘッダーは非表示 */
    .header-sp {
        width: 100%;
        padding: 0;
        display: none;
    }

    aside {
        min-height: 100vh; /* 縦方向画面いっぱい */
        background-color: rgba(0, 0, 0,0.1);
        padding: 1rem;
    }
    /* PC用ヘッダー */
    header{
        padding: 1.5rem;
    }
    main {
        padding: 1.5rem;
    }
    section {
        margin-bottom: 2rem;
    }
    footer {
        padding: 1.5rem;
    }
}

/*------ スマホ・タブレット------*/
@media (max-width: 1024px) {

    .container {
        display: block;
        width: 100%;
        padding: 0rem;
    }

    /* スマホ専用ヘッダーを表示 */
    .header-sp {
        display: block;
        height:auto;
        background-color: rgba(0, 0, 0,0.1);
    }
    /*  左メニュー 非表示*/
    aside {
        display: none !important;
    }
    /*  PC用ヘッダー 非表示*/
    header {
        display: none !important;
    }
    main {
        padding: 0.5rem;
    }
    footer {
        padding: 0.5rem;
    }
    section {
        margin-bottom: 1rem;
    }
}

/*------ PC スマホ　共通------*/

/* スマホ用のヘッダーの画像／PC用のサイドバーの最上部の画像 */
.header-img {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    margin-left: auto;
    margin-right: auto;
}
.header-img img{
    border-radius: 4px;
    max-width: 100%;
    height: auto;
}

/* すべての要素にボックスサイズを適用 */
* {
    box-sizing: border-box;
}