/*
Theme Name: NEGB English
Theme URI: https://www.negb.co.jp/en/
Description: NEGB English site with the corporate header and footer.
Template: negb2026
Version: 0.1.0
Text Domain: negb-en
*/

/* Keep the fixed corporate menu above the legacy #top (z-index: 3000). */
.l-header {
  z-index: 3001;
}

@media screen and (max-width: 1079px) {
  .l-header {
    height: 64px;
  }
  .l-header__logo {
    width: min(466px, calc(100vw - 60px));
    top: 50%;
    transform: translateY(-50%);
  }
  .l-header__menu-block {
    top: 64px;
  }
  .l-header .hamburger {
    top: 12px;
  }
  .l-container {
    padding-top: 64px;
  }
}

@media screen and (min-width: 1080px) {
  .l-header__logo {
    width: 466px;
  }
  .l-header__menu-block {
    width: auto;
  }
}

@media screen and (min-width: 1080px) and (max-width: 1199px) {
  .l-header {
    height: 120px;
  }
  .l-header__logo {
    top: 8px;
  }
  .l-header__menu-block {
    top: 74px;
  }
  .l-container {
    padding-top: 120px;
  }
}

@media screen and (min-width: 1200px) and (max-width: 1280px) {
  .l-header__logo {
    top: 27px;
  }
}

.negb-en-main {
  font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
  color: #666;
  font-size: 13px;
  line-height: 1.6;
  /* The legacy body sets this at 13px, so children inherit -0.013px (the corporate body would give -0.016px). */
  letter-spacing: -0.001em;
}


/* The legacy CSS was written for content-box; the corporate CSS sets border-box on every element. */
.negb-en-main,
.negb-en-main *,
.negb-en-main *::before,
.negb-en-main *::after {
  box-sizing: content-box;
}

/* Fancybox is appended to body, outside .negb-en-main, and uses content-box dimensions. */
#fancybox-wrap,
#fancybox-wrap *,
#fancybox-tmp {
  box-sizing: content-box;
}

/* The browser default for tables is border-box; the rule above would turn every table into content-box and make width: 500px tables 1px wider. */
.negb-en-main #content table {
  box-sizing: border-box;
}

/* The corporate CSS pads #content for the Japanese legacy pages; the English main already sits below the header. */
.negb-en-main #content {
  padding-top: 0;
  /* The corporate CSS gives body #content line-height: 140%; the legacy page inherits the body's 160%. */
  line-height: inherit;
}

/* The legacy title banner reached under the old 120px header (70px padding and a 50px nav band).
   With the corporate fixed header the banner starts below it, so drop that space and band. */
@media screen and (min-width: 681px) {
  .negb-en-main #titleimage {
    position: relative;
    padding-top: 0;
  }
  .negb-en-main #titleimage .back {
    display: none;
  }
  .negb-en-main #titleimage p {
    top: 34px;
  }
}

.negb-en-main .en-contact {
  max-width: 960px;
  margin: 0 auto;
  padding: 160px 24px 100px;
  box-sizing: border-box;
}
.negb-en-main .en-contact h1 {
  margin-bottom: 30px;
  font-size: 28px;
  color: #004da1;
}
.negb-en-main .en-contact p {
  margin-bottom: 20px;
  font-size: 16px;
  line-height: 1.8;
}
.negb-en-main .en-contact a {
  color: #004da1;
  text-decoration: underline;
}
.negb-en-main .en-contact .negb-form {
  margin-top: 40px;
}
/* Restore the form's English label instead of the shared CSS's Japanese replacement. */
.en-contact #recef .rectusenq_cusinfo_item_name {
  font-size: 1.5rem;
}
.en-contact #recef .rectusenq_cusinfo_item_name::before,
.en-contact #recef .rectusenq_cusinfo_item_name::after {
  content: none;
}
.en-contact #recef .rectusenq_cusinfo_fm_kaisha::after {
  content: 'If you are an individual, please enter "Individual".';
}
@media screen and (max-width: 680px) {
  .negb-en-main .en-contact {
    padding: 100px 16px 60px;
  }
}

/* Desktop only: the legacy mobile CSS makes images fluid with img { max-width: 100% }. */
@media screen and (min-width: 681px) {
  /* The corporate CSS caps every img at max-width: 100%; the legacy pages let width/height attributes overflow their column. */
  .negb-en-main img {
    max-width: none;
  }

  /* The corporate CSS also sets img { height: auto }, which ignores the height attribute (the legacy pages
     sometimes stretch images to a different ratio than the file). Restore the attribute where the browser supports typed attr(). */
  @supports (height: attr(height px)) {
    .negb-en-main img[height] {
      height: attr(height px);
    }
  }
}