@charset "utf-8";

/*========
  ヘッダー
  ========*/


/*====================↓ヘッダー====================


  /*-----------------------------------------------------------------------------------------------------
    ヘッダーの固定について
    ヘッダーを固定したいときはheader要素のpositionプロパティ（style属性）に『fixed』を設定する。
    JavaScriptのプログラムがヘッダーの高さを自動で計算し、ヘッダーと同じ高さの「天井要素（id="ceiling"）」が追加される。
    ------------------------------------------------------------------------------------------------------*/

  header{
    width: 100%;
    top: 0px;
    left: 0px;
    background: #FFF;
    z-index:1;

    border-bottom: 10px solid #01BCAA;/*ヘッダー下部境界線*/

    position: fixed; /*ヘッダーを固定*/
  }


  /*------------------------
    ウィンドウサイズ：834px以下
    ------------------------*/
  @media print, screen and (max-width: 834px) {


    /*ヘッダー*/
    header{
      position: static; /*ヘッダーの固定を解除*/
    }


  }


/*====================↑ヘッダー====================*/







/*====================↓PCサイズのヘッダー====================*/


  #header_pc{
    display: block;
  }


  /*------------------------
    ウィンドウサイズ：834px以下
    ------------------------*/
  @media print, screen and (max-width: 834px) {


    #header_pc{
      display: none;
    }


  }


  /*ヘッダーメニュー（ロゴ画像）*/
  #header_pc #header_menu .header_menu_logo{
    flex-basis: 20%;
    align-self: flex-end;
  }
  #header_pc #header_menu .header_menu_logo a{
    display: block;
  }
  #header_pc #header_menu .header_menu_logo a:hover img{
	  opacity: 1;
  }


/*====================↑PCサイズのヘッダー====================*/








/*====================↓モバイルサイズのヘッダー====================*/


  #header_mobile{
        display: none;
  }

  /*------------------------
    ウィンドウサイズ：834px以下
    ------------------------*/
  @media print, screen and (max-width: 834px) {


    #header_mobile{
      display: block;
    }


  }


  #header_mobile .header_mobile_frame{
    max-width: 360px;
    height: 90px;
    margin :auto;
    display: flex;
  }

  #header_mobile .header_mobile_frame .header_mobile_logo a:hover img{
	  opacity: 1;
  }


/*====================↑モバイルサイズのヘッダー====================*/