@media screen and (max-width: 767.9px) {
  ._none-sm {
    display: none; } }

@media screen and (min-width: 768px) and (max-width: 979.9px) {
  ._none-md {
    display: none; } }

@media print, screen and (min-width: 980px) {
  ._none-lg {
    display: none; } }

._nowrap {
  display: inline-block;
  white-space: nowrap; }

@keyframes _fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes _fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@keyframes _headerNavOpen {
  0% {
    visibility: hidden;
    pointer-events: none;
    opacity: 0;
    transform: translateY(-10%); }
  100% {
    visibility: visible;
    pointer-events: auto;
    opacity: 1;
    transform: translateY(0); } }
@keyframes _headerNavClose {
  0% {
    visibility: visible;
    pointer-events: auto;
    opacity: 1;
    transform: translateY(0); }
  100% {
    visibility: hidden;
    pointer-events: none;
    opacity: 0;
    transform: translateY(-10%); } }
@keyframes PageAnimeAppear {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
body {
  overflow-y: scroll; }
  body::after {
    content: '';
    display: block;
    background: url("../images/loading.gif") no-repeat 50% 50% #FFF;
    width: 26px;
    height: 26px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: fixed;
    opacity: 0; }
  body._isLoading {
    position: fixed; }
    body._isLoading::after {
      animation: _fadeIn 1000ms ease 1000ms forwards; }
    body._isLoading #Container {
      pointer-events: none;
      opacity: 0; }

body._isLoaded #Container {
  opacity: 0;
  animation-name: PageAnimeAppear;
  animation-duration: 1000ms;
  animation-fill-mode: forwards; }

#Container {
  min-width: 320px; }

.header {
  width: 100%;
  box-sizing: border-box;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 3000;
  transition: background-color 2000ms; }
  @media screen and (max-width: 767.9px) {
    .header {
      padding: clamp(16px, 2.66667vw, 24px) clamp(18.66667px, 3.11111vw, 28px); } }
  @media print, screen and (min-width: 768px) {
    .header {
      padding: clamp(16px, 2.66667vw, 24px) clamp(24px, 4vw, 36px) clamp(16px, 2.66667vw, 24px) clamp(18.66667px, 3.11111vw, 28px);
      display: -webkit-box;
      display: -moz-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -moz-box-pack: justify;
      -ms-flex-pack: justify;
      -webkit-justify-content: space-between;
      justify-content: space-between; } }
  .header.-isScrolled {
    background-color: #FFF; }
  .header #SiteId {
    position: relative;
    z-index: 3000; }
    @media screen and (max-width: 767.9px) {
      .header #SiteId {
        width: 48.53333vw;
        max-width: 200px; } }
    @media screen and (min-width: 768px) and (max-width: 979.9px) {
      .header #SiteId {
        width: 26.66667vw;
        max-width: 240px; } }
    @media print, screen and (min-width: 980px) {
      .header #SiteId {
        width: 240px; } }
  @media screen and (max-width: 767.9px) {
    .header .headerNav {
      width: 86.66667%;
      max-width: 420px;
      position: absolute;
      right: 6.66667%;
      pointer-events: none; } }
  @media screen and (max-width: 767.9px) {
    .header .headerNav_icon {
      position: fixed;
      z-index: 3000;
      top: min(11.25vw, 36px);
      right: min(5vw, 16px);
      cursor: pointer;
      transform: translateY(-50%);
      width: min(12.5vw, 40px);
      height: min(12.5vw, 40px);
      pointer-events: auto; }
      body:not([data-device="touchDevice"]) .header .headerNav_icon:hover {
        opacity: .7;
        transition: opacity 500ms; }
      .header .headerNav_icon span {
        width: min(8.75vw, 28px);
        height: min(0.78125vw, 2.5px);
        background: #504B3C;
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        transition: .2s;
        transform: translate(-50%, -50%); }
      .header .headerNav_icon span::before,
      .header .headerNav_icon span::after {
        background: #504B3C;
        width: min(8.75vw, 28px);
        height: min(0.78125vw, 2.5px);
        display: block;
        position: absolute;
        left: 0;
        content: "";
        transition: .3s;
        will-change: transform; }
      .header .headerNav_icon span::before {
        top: max(-3.4375vw, -11px); }
      .header .headerNav_icon span::after {
        bottom: max(-3.4375vw, -11px); } }
  @media print, screen and (min-width: 768px) {
    .header .headerNav_icon {
      display: none; } }
  @media screen and (max-width: 767.9px) {
    .header .headerNav ul {
      width: 100%;
      margin-top: min(8vw, 30px);
      padding: 7.46667% 0;
      background-color: rgba(255, 255, 255, 0.9);
      border-radius: min(13.33333vw, 50px);
      visibility: hidden; } }
  @media print, screen and (min-width: 768px) {
    .header .headerNav ul {
      width: 55.55556vw;
      max-width: 566px;
      display: -webkit-box;
      display: -moz-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -moz-box-pack: justify;
      -ms-flex-pack: justify;
      -webkit-justify-content: space-between;
      justify-content: space-between;
      -webkit-box-align: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center; } }
  @media screen and (max-width: 767.9px) {
    .header .headerNav.-isNavClosed ul {
      pointer-events: none;
      animation: _headerNavClose 400ms forwards; } }
  @media screen and (max-width: 767.9px) {
    .header .headerNav.-isNavOpened .headerNav_icon span {
      background: transparent; }
    .header .headerNav.-isNavOpened .headerNav_icon span::before {
      top: 0;
      transform: rotate(-45deg); }
    .header .headerNav.-isNavOpened .headerNav_icon span::after {
      bottom: 0;
      transform: rotate(-135deg); } }
  @media screen and (max-width: 767.9px) {
    .header .headerNav.-isNavOpened ul {
      pointer-events: auto;
      animation: _headerNavOpen 400ms forwards; } }
  .header .headerNav_item {
    line-height: 1.4; }
    @media screen and (max-width: 767.9px) {
      .header .headerNav_item {
        font-size: min(1.0625em, 4.53333vw);
        letter-spacing: .2em;
        margin-top: .8em; }
        .header .headerNav_item:first-child {
          margin-top: 0; } }
    @media print, screen and (min-width: 768px) {
      .header .headerNav_item {
        letter-spacing: .1em;
        font-size: min(1.0625em, 1.88889vw); } }
    .header .headerNav_item a {
      color: #504B3C;
      text-decoration: none; }
      @media screen and (max-width: 767.9px) {
        .header .headerNav_item a {
          width: 46.66667vw;
          max-width: 180px;
          box-sizing: border-box;
          display: block;
          border: 0.2vw solid #504B3C;
          border-radius: 2em;
          margin: 0 auto;
          padding: 1em;
          transition: border-color 400ms, background-color 400ms; } }
      @media screen and (max-width: 767.9px) {
        body:not([data-device="touchDevice"]) .header .headerNav_item a:hover {
          border-color: rgba(80, 75, 60, 0.5);
          background-color: #FFF; } }
      @media print, screen and (min-width: 768px) {
        body:not([data-device="touchDevice"]) .header .headerNav_item a:hover span {
          background: linear-gradient(#504B3C, #504B3C) 50% 100%/100% 1px no-repeat; } }
      @media print, screen and (min-width: 768px) {
        .header .headerNav_item a span {
          display: inline;
          background: linear-gradient(#504B3C, #504B3C) 50% 100%/0 1px no-repeat;
          padding-bottom: .15em;
          transition: background 400ms cubic-bezier(0.23, 1, 0.32, 1); } }
    @media screen and (max-width: 767.9px) {
      .header .headerNav_item-contact {
        margin-top: 1.2em; } }
    .header .headerNav_item-contact a {
      color: #FFF;
      display: block;
      border: none;
      background-color: rgba(100, 180, 210, 0.8);
      transition: background-color 400ms; }
      @media screen and (max-width: 767.9px) {
        .header .headerNav_item-contact a {
          width: 76vw;
          box-sizing: border-box;
          border-radius: 3em;
          max-width: 340px;
          padding: 1.8em 1em; } }
      @media print, screen and (min-width: 768px) {
        .header .headerNav_item-contact a {
          padding: 1em 1.8em;
          border-radius: 3em; } }
      body:not([data-device="touchDevice"]) .header .headerNav_item-contact a:hover {
        background-color: #64b4d2; }

#Contents {
  position: relative; }
  #Contents #ToPageTopButton {
    opacity: 0;
    pointer-events: none;
    transition: opacity 400ms;
    width: min(12vw, 60px);
    height: min(20vw, 100px);
    position: fixed;
    right: min(6vw, 30px);
    bottom: 0;
    z-index: 3000; }
    body:not([data-device="touchDevice"]) #Contents #ToPageTopButton:hover {
      opacity: .7;
      transition: opacity 500ms; }
    #Contents #ToPageTopButton.-isBasePosition {
      position: absolute;
      bottom: max(-14vw, -70px); }
    #Contents #ToPageTopButton.-isVisible {
      opacity: 1;
      pointer-events: auto; }

.footer {
  background-color: #64B4D2;
  position: relative; }
  @media screen and (max-width: 767.9px) {
    .footer {
      padding: min(10.66667vw, 40px) 0; } }
  @media print, screen and (min-width: 768px) {
    .footer {
      padding: 50px 0; } }
  @media screen and (max-width: 767.9px) {
    .footer .footerNav {
      margin: 0 auto; } }
  @media screen and (max-width: 767.9px) and (max-width: 640px) {
    .footer .footerNav {
      width: min(65.625vw, 420px); } }

  @media screen and (max-width: 767.9px) and (max-width: 640px) and (max-width: 440px) {
    .footer .footerNav {
      width: min(77.27273vw, 340px); } }

  .footer .footerNav ul {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .footer .footerNav li {
    line-height: 1.4;
    letter-spacing: .05em;
    margin-bottom: 1.2em;
    padding: 0 1.2em;
    border-left: 1px solid #FFF; }
    @media screen and (max-width: 767.9px) {
      .footer .footerNav li {
        font-size: min(0.875em, 3.64583vw); } }
  @media screen and (max-width: 767.9px) and (max-width: 640px) {
    .footer .footerNav li:nth-child(4) {
      border-left: none; } }

    @media print, screen and (min-width: 768px) {
      .footer .footerNav li {
        font-size: min(1em, 2.28571vw); } }
    .footer .footerNav li:first-child {
      border-left: none; }
    .footer .footerNav li a {
      color: #FFF;
      text-decoration: none; }
      body:not([data-device="touchDevice"]) .footer .footerNav li a:hover span {
        background: linear-gradient(#FFF, #FFF) 50% 100%/100% 1px no-repeat; }
      .footer .footerNav li a span {
        display: inline;
        background: linear-gradient(#FFF, #FFF) 50% 100%/0 1px no-repeat;
        padding-bottom: .15em;
        transition: background 400ms cubic-bezier(0.23, 1, 0.32, 1); }
  .footer .footer_logo {
    margin: 1.5em auto 0; }
    @media screen and (max-width: 767.9px) {
      .footer .footer_logo img {
        width: min(27.73333vw, 138px); } }
    @media print, screen and (min-width: 768px) {
      .footer .footer_logo img {
        width: 138px; } }
  .footer .footer_copyright {
    color: #FFF;
    letter-spacing: .05em;
    margin-top: 1.8em; }
    @media screen and (max-width: 767.9px) {
      .footer .footer_copyright {
        font-size: min(0.6875em, 2.86458vw); } }
    @media print, screen and (min-width: 768px) {
      .footer .footer_copyright {
        font-size: 0.875em; } }

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