@charset "utf-8";

/*全端末（PC・タブレット・スマホ）共通設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*全体の設定
---------------------------------------------------------------------------*/
.header_contents {
  min-width: 1300px;
  /* margin: 0px calc(50% - 50vw); */
  padding: 0px 0 20px 0;
  color: #666; /*全体の文字色*/
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ",
    Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; /*フォント種類*/
  font-size: 15px; /*文字サイズ*/
  line-height: 2; /*行間*/
  background: #fff; /*背景色*/
  -webkit-text-size-adjust: none;
  border-top: 4px solid #0066b5;
  /*上の線の幅、線種、色*/
}
/* @media screen and (max-width: 480px) {
  .header_contents {
    min-width: 0px;
  }
} */

.header_contents ul {
  list-style-type: none;
}
/*inner共通
---------------------------------------------------------------------------*/
.header_contents .inner {
  max-width: 1200px; /*サイトの最大幅。「#mainimg」のmax-widthと揃える。*/
  min-width: 1200px;
  margin: 0 auto;
  padding: 0 3%;
}

/* @media screen and (max-width: 480px) {
  .header_contents .inner {
    min-width: 0px;
  }
} */

/*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
.header_contents header {
  max-width: 1200px;
  margin: auto;
}

.header_contents header .inner {
  height: 100px; /*高さ*/
  margin-left: -35px;
}

/*ロゴ画像*/
.header_contents header a {
  display: block;
  width: 280px;
  text-decoration: none;
  color: #333;
}

.header_contents header a:hover {
  color: #333;
}

.header_contents header #logo {
  margin: 0;
  line-height: 1.3;
  padding: 35px 0 10px 80px;
  font-size: 15pt;
  font-weight: bold;
  background: no-repeat url(/images/JFRCA_logo.jpeg);
  background-position: left bottom 10%;
  background-size: 25%;
}

.header_contents header a #logo .small {
  font-size: 11pt;
}

.header_contents header a #logo .small::after {
  content: "\A";
  white-space: pre;
}

/* @media screen and (max-width: 480px) {
  .header_contents header .inner {
    margin-left: 0px;
  }
} */

/*メインメニュー
---------------------------------------------------------------------------*/
/*メニューブロック*/
.header_contents #menubar {
  clear: both;
  overflow: hidden;
  background: #0066b5; /*背景色*/
}
/*メニュー１個あたりの設定*/
.header_contents #menubar li {
  float: left; /*左に回り込み*/
  width: 14.28%; /*メニュー幅（100÷7個=14.28%）　もし４個にするなら100÷4=25%になる。*/
  padding-top: 5px; /*この数字と「#menubar li a」のpaddingの１つ目(7px)の数字を足した合計が「#menubar li a」の３つ目の数字(12px)になるようにする。*/
}
.header_contents #menubar li a {
  display: block;
  text-decoration: none;
  text-align: center;
  color: #fff; /*文字色*/
  padding: 7px 0px 12px; /*上、左右、下への余白。上の「#menubar li」のpadding-topの解説と合わせて読んで下さい。*/
}
/*マウスオン時、現在表示中メニュー*/
.header_contents #menubar li a:hover,
.header_contents #menubar li.current a {
  background: #fff; /*背景色*/
  color: #0066b5; /*文字色*/
  border-radius: 8px 8px 0px 0px; /*角丸のサイズ。左上、右上、右下、左下への順。*/
}
/*スマホ用メニューを表示させない*/
.header_contents #menubar-s {
  display: none;
}
/*３本バーアイコンを表示させない*/
.header_contents #menubar_hdr {
  display: none;
}

/*画面幅1200px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
/* @media screen and (max-width: 480px) { */
  /*inner共通
---------------------------------------------------------------------------*/
  /* .header_contents .inner {
    width: auto;
  }
 */
  /*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
  /*ヘッダーブロック*/
  /*.header_contents header {
    border-bottom: 1px solid #dcdcdc; /*下の線の幅、線種、色*/
  /*}

  /*メインメニュー
---------------------------------------------------------------------------*/
  /*スマホ用メニューを非表示から表示に切り替える*/
  /* .header_contents #menubar-s {
    display: block;
  } */
  /*メニュー１個あたりの設定*/
  /*.header_contents #menubar-s li {
    float: left; /*左に回り込み*/
  /*  width: 50%; /*メニュー幅*/
  /*}
  .header_contents #menubar-s li a {
    display: block;
    text-decoration: none;
    text-align: center; /*文字をセンタリング*/
  /*  padding: 15px 0; /*上下、左右へのメニュー内の余白*/
    /*border-bottom: 1px solid #dcdcdc; /*下線の幅、線種、色*/
    /*border-right: 1px solid #dcdcdc; /*右線の幅、線種、色*/
    /*color: #4c4c4c;
    font-size: min(4vw, 16px);
  }
  /*偶数番目のメニューの右側の線を消す*/
  /*.header_contents #menubar-s li:nth-child(even) a {
    border-right: none;
  }
  /*PC用メニューを非表示にする*/
  /*.header_contents #menubar {
    display: none;
  }

  /*３本バーアイコン設定
---------------------------------------------------------------------------*/
  /*３本バーブロック*/
  /*.header_contents #menubar_hdr {
    display: block;
    position: absolute;
    top: 28px; /*上から28pxの場所に配置*/
    /*right: 5%; /*右から5%の場所に配置*/
    /*width: 30px; /*幅*/
    /*border: 1px solid #000; /*枠線の幅、線種、色*/
    /*padding: 12px 10px 5px; /*上、左右、下へのボックス内余白*/
    /*background: #fff; /*背景色*/
  /*}
  /*３本のバー（1本あたり）*/
  /*.header_contents #menubar_hdr span {
    display: block;
    border-top: 3px solid #000; /*枠線の幅、線種、色*/
  /*  margin-bottom: 7px; /*バー同士の余白*/
  /*}
}