@charset "UTF-8";
@import url(../config/base.scss);
header { position: fixed; top: 0; right: 0; left: 0; z-index: 1030; font-family: font-family YuMincho, "Yu Mincho", serif; }
header nav { display: block; }
header nav a:hover { color: #0E4C8C; text-decoration: none; }
header nav .cp_name { width: 100%; display: flex; padding: 0px 30px; background-color: rgba(255, 255, 255, 0.1); }
@media (max-width: 575.98px) { header nav .cp_name { padding: 0px 10px; background-color: rgba(255, 255, 255, 0.658); } }
header nav .cp_name img { height: 30px; width: auto; margin: auto 0px; }
header nav .cp_name p { font-size: 30px; color: #0E4C8C; margin-bottom: 0px; font-weight: 500; margin-left: 10px; margin-top: 1px; }
@media (max-width: 575.98px) { header nav .cp_name p { font-size: 26px; } }
header nav ul { display: flex; list-style: none; justify-content: center; margin-bottom: 0px; background-color: #0E4C8C; padding: 0%; }
@media (max-width: 575.98px) { header nav ul { display: none; } }
header nav ul li { padding: 10px; width: 13.3%; text-align: center; }
header nav ul li a { font-weight: 400; font-size: 18px; color: white; }
header nav ul li a:hover { color: white; text-decoration: none; border-bottom: #CFEAF4 1px solid; }

/* end of fix propatys */
@media (min-width: 0.08px) { .sp-menu { display: none; }
  .menu-btn { position: fixed; top: 0px; right: 0px; display: flex; height: 40px; width: 40px; justify-content: center; align-items: center; z-index: 90; background-color: rgba(0, 0, 0, 0); margin-bottom: 0px; }
  .menu-btn span { content: ''; display: block; height: 3px; width: 25px; border-radius: 3px; background-color: black; position: absolute; }
  .menu-btn span:before, .menu-btn span:after { content: ''; display: block; height: 3px; width: 25px; border-radius: 3px; background-color: black; position: absolute; }
  .menu-btn span:before { bottom: 8px; }
  .menu-btn span:after { top: 8px; }
  #menu-btn-check { display: none; }
  #menu-btn-check:checked ~ .menu-btn span { background-color: rgba(255, 255, 255, 0); }
  #menu-btn-check:checked ~ .menu-btn span::before { bottom: 0; transform: rotate(45deg); }
  #menu-btn-check:checked ~ .menu-btn span::after { top: 0; transform: rotate(-45deg); }
  #menu-btn-check:checked ~ .menu-content { left: 0; /*メニューを画面内へ*/ }
  .menu-content { width: 100%; height: 100%; position: fixed; top: 0; left: 100%; /*leftの値を変更してメニューを画面外へ*/ z-index: 80; background-color: rgba(255, 255, 255, 0.8); transition: all 0.5s; /*アニメーション設定*/ }
  .menu-content ul { padding: 70px 10px 0; }
  .menu-content ul li { border-bottom: solid 1px black; list-style: none; }
  .menu-content ul li a { display: block; width: 100%; font-size: 15px; box-sizing: border-box; color: black; text-decoration: none; padding: 9px 15px 10px 0; position: relative; }
  .menu-content ul li a::before { content: ""; width: 7px; height: 7px; border-top: solid 2px black; border-right: solid 2px black; transform: rotate(45deg); position: absolute; right: 11px; top: 16px; } }
@media (min-width: 0.08px) and (max-width: 1024.98px) and (max-width: 991.98px) and (max-width: 960.98px) { .sp-menu { display: block; }
  .menu-btn { z-index: 90; background-color: rgba(0, 0, 0, 0); margin-bottom: 0px; top: -1px; right: 10px; } }
@media screen and (min-width: 0.08px) and (max-width: 1024.98px) and (max-width: 991.98px) and (max-width: 960.98px) and (max-width: 900.98px) and (max-width: 768.98px) and (max-width: 575.98px) { .menu-content { background-color: rgba(255, 255, 255, 0.94); }
  .menu-content li { margin-bottom: 20px; }
  .menu-content ul li a { font-size: 20px; font-weight: bold; }
  .menu-btn { top: -2px; right: 3px; } }
@media screen and (min-width: 0.08px) and (max-width: 1024.98px) and (max-width: 991.98px) and (max-width: 960.98px) and (max-width: 900.98px) and (max-width: 768.98px) and (max-width: 575.98px) and (max-width: 540.98px) and (max-width: 414.98px) and (max-width: 411.98px) and (max-width: 375.98px) and (max-width: 360.98px) and (max-width: 320.98px) { .menu-btn { top: -2px; right: 3px; } }
@media screen and (min-width: 0.08px) and (max-width: 1024.98px) and (max-width: 991.98px) and (max-width: 960.98px) and (max-width: 900.98px) and (max-width: 768.98px) and (max-width: 575.98px) and (max-width: 540.98px) and (max-width: 414.98px) and (max-width: 411.98px) and (max-width: 375.98px) and (max-width: 360.98px) and (max-width: 320.98px) and (max-width: 280.98px) { .menu-btn { top: -2px; right: -2px; }
  .menu-btn span { content: ''; display: block; height: 2px; width: 20px; border-radius: 3px; background-color: black; position: absolute; }
  .menu-btn span:before, .menu-btn span:after { content: ''; display: block; height: 2px; width: 20px; border-radius: 3px; background-color: black; position: absolute; }
  .menu-btn span:before { bottom: 6px; }
  .menu-btn span:after { top: 6px; } }

/*# sourceMappingURL=header.css.map */
