@charset "utf-8";
/* CSS Document */ :root {
  --thin-blue: #3074a7;
  --dark-blue: #1e537b;
  --back-black: #001e43;
  --header-height: 68px
}
*, *::before, *::after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box
}
html {
  font-size: .625rem
}
body {
  font-family: "Zen Kaku Gothic New", sans-serif;
}
body::-webkit-scrollbar {
  display: none
}
a {
  display: block;
  color: #000
}
button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  cursor: pointer;
  padding: 0;
  background-color: rgba(255, 255, 255, 0)
}
.js-focus-visible :focus:not(.focus-visible) {
  outline: 0
}
img {
  width: auto;
  height: auto
}

.container__inner {
  overflow: hidden
}
.lBackground {
  background-image: url("../img/back.jpg");
  background-size: 100% auto;
  background-position: 50% 0
}
@media screen and (min-width: 768px) {
  :root {
    --header-height: 110px
  }
  .lBackground {
    background-image: url("../img/back.jpg")
  }
  a[href^="tel:"] {
    pointer-events: none
  }
}
.lHeader {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: var(--header-height);
  z-index: 10
}
.lHeader__wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 100%;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding-left: 15px
}
.lHeader__logo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start
}
.lHeader__logo--text {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 12px;
  letter-spacing: .04em;
	color:#fff;
}

.lHeader__logo--text--b {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 12px;
  letter-spacing: .04em;
}
.lHeader__logo--image {
  width: 144px;
  height: 24px
}
.lHeader__logo--ie {
  display: none
}
.lHeader__logo--recruit {
  display: none
}
.lHeader__menuButton {
  position: relative;
  width: var(--header-height);
  height: var(--header-height);
  background-color: #fff;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: .05em
}
@media(hover) {
  .lHeader__menuButton:hover::before {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right
  }
  .lHeader__menuButton:hover > span {
    color: #000
  }
}
.lHeader__menuButton > span {
  position: relative;
  z-index: 1;
  color: #fff;
  -webkit-transition: color .3s ease;
  transition: color .3s ease
}
.lHeader__menuButton::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  inset: 0 0 0 0;
  background-color: #000;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  -webkit-transform-origin: bottom left;
  transform-origin: bottom left;
  -webkit-transition: -webkit-transform .3s ease;
  transition: -webkit-transform .3s ease;
  transition: transform .3s ease;
  transition: transform .3s ease, -webkit-transform .3s ease
}
.lHeader__menuButton--close {
  opacity: 0;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1
}
.lHeader__menuButton--close > span {
  pointer-events: none
}
.lHeader__menuButton--open, .lHeader__menuButton--close {
  -webkit-transition: opacity .4s cubic-bezier(0.19, 1, 0.22, 1);
  transition: opacity .4s cubic-bezier(0.19, 1, 0.22, 1)
}
.lHeader--fixed {
  position: fixed;
  background-color: rgba(0,30,67,0.7); /* 画像ではなく背景色に変更 */
  background-size: cover;
  background-position: top;
  border-bottom: 1px #dedede solid;
  z-index: 1000;
  visibility: hidden
}

.lHeader--menu {
  opacity: 0;
  background-color: rgba(0,30,67,1); /* 画像ではなく背景色に変更 */
  background-size: cover;
  background-position: top;
  border-bottom: 1px #dedede solid;
  -webkit-transition: opacity .4s cubic-bezier(0.19, 1, 0.22, 1);
  transition: opacity .4s cubic-bezier(0.19, 1, 0.22, 1)
}
.lHeader--recruit {
  --header-height: 55px;
  z-index: 1000
}
.lHeader--recruit.lHeader--fixed {
  background-color: #fff;
  background-image: none
}
.lHeader--recruit .lHeader__wrapper {
  padding-left: 20px
}
.lHeader--recruit .lHeader__menuButton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  overflow: hidden
}
.lHeader--recruit .lHeader__menuButton > span {
  position: absolute;
  left: 0;
  right: 0;
  top: calc((100% - 2px) / 2);
  display: block;
  width: 21px;
  height: 2px;
  margin: auto;
  background-color: #fff;
  -webkit-transition: margin-top .4s cubic-bezier(0.39, 0.575, 0.565, 1), background-color .3s ease, -webkit-transform .4s cubic-bezier(0.39, 0.575, 0.565, 1);
  transition: margin-top .4s cubic-bezier(0.39, 0.575, 0.565, 1), background-color .3s ease, -webkit-transform .4s cubic-bezier(0.39, 0.575, 0.565, 1);
  transition: transform .4s cubic-bezier(0.39, 0.575, 0.565, 1), margin-top .4s cubic-bezier(0.39, 0.575, 0.565, 1), background-color .3s ease;
  transition: transform .4s cubic-bezier(0.39, 0.575, 0.565, 1), margin-top .4s cubic-bezier(0.39, 0.575, 0.565, 1), background-color .3s ease, -webkit-transform .4s cubic-bezier(0.39, 0.575, 0.565, 1)
}
.lHeader--recruit .lHeader__menuButton > span:nth-child(1) {
  margin-top: -7px
}
.lHeader--recruit .lHeader__menuButton > span:nth-child(3) {
  margin-top: 7px
}
@media(hover) {
  .lHeader--recruit .lHeader__menuButton:hover > span {
    background-color: #000
  }
}
.lHeader--recruit .lHeader__logo--image {
  width: auto;
  height: auto
}
.menuOpen .lHeader__menuButton--close {
  opacity: 1
}
.menuOpen .lHeader--menu {
  opacity: 1
}
.menuOpen .lHeader--recruit .lHeader__menuButton > span {
  margin-top: 0
}
.menuOpen .lHeader--recruit .lHeader__menuButton > span:nth-child(1) {
  -webkit-transform: rotate(-315deg);
  transform: rotate(-315deg)
}
.menuOpen .lHeader--recruit .lHeader__menuButton > span:nth-child(2) {
  -webkit-transform: translateX(200%);
  transform: translateX(200%)
}
.menuOpen .lHeader--recruit .lHeader__menuButton > span:nth-child(3) {
  -webkit-transform: rotate(315deg);
  transform: rotate(315deg)
}
.js .ie {
  display: none
}
.no-js .lHeader--fixed {
  display: none
}
.no-js .lHeader__logo a {
  display: none
}
.no-js .lHeader__logo .ie {
  display: block
}
@media screen and (min-width: 768px) {
  .js .lHeader {
    mix-blend-mode: difference
  }
  .js .lHeader__logo--text {
    color: #fff
  }
  .js .lHeader__menuButton {
    background-color: #222
  }
  .js .lHeader__menuButton::before {
    background-color: #fff
  }
  .js .lHeader__menuButton > span {
    color: #000
  }
  .js .lHeader__menuButton:hover > span {
    color: #fff
  }
  .js .lHeader--recruit {
    mix-blend-mode: normal
  }
  .js .lHeader--recruit .lHeader__menuButton {
    background-color: #fff
  }
  .js .lHeader--recruit .lHeader__menuButton::before {
    background-color: #000
  }
  .lHeader {
    position: fixed;
    z-index: 1000
  }
  .lHeader__wrapper {
    padding-left: 40px;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
  }
  .lHeader__logo {
    margin-bottom: 8px
  }
  .lHeader__logo--text {
    font-size: 13px;
    letter-spacing: .08em
  }
  .lHeader__logo--image {
    width: 222px;
    height: 36px
  }
  .lHeader__logo--recruit {
    position: fixed;
    top: 23px;
    left: 30px;
    display: block;
    width: 211px;
    height: 32px;
    z-index: 1000;
    mix-blend-mode: difference
  }
  .lHeader__logo--recruit.is-mix {
    mix-blend-mode: normal
  }
  .lHeader--menu {
    display: none
  }
  .lHeader--recruit {
    --header-height: 77px
  }
  .lHeader--recruit .lHeader__wrapper {
    padding-left: 30px
  }
  .lHeader--recruit .lHeader__logo {
    visibility: hidden;
    pointer-events: none
  }
  .lHeader--recruit .lHeader__menuButton > span {
    width: 30px
  }
  .lHeader--recruit .lHeader__menuButton > span:nth-child(1) {
    margin-top: -9.5px
  }
  .lHeader--recruit .lHeader__menuButton > span:nth-child(3) {
    margin-top: 10.5px
  }
  .menuOpen .lHeader--recruit .lHeader__menuButton > span {
    margin-top: 0
  }
}
.lMenu {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 10000
}
.lMenu__inner {
  position: relative;
  width: 100%;
  height: calc(100% - var(--header-height));
  background-color: rgba(0, 0, 0, .54);
  margin-top: var(--header-height)
}
.lMenu__wrapper {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  max-width: 450px;
  height: 100%;
  background-color: rgba(0,30,67,0.65);
}
.lMenu__contents {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 0 30px
}
.lMenu__closeButton {
  display: none;
  position: absolute;
  top: 45px;
  right: 32px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: .05em;
  -webkit-transition: opacity .4s cubic-bezier(0.19, 1, 0.22, 1);
  transition: opacity .4s cubic-bezier(0.19, 1, 0.22, 1)
}
.lMenu__closeButton > span {
  pointer-events: none;
 color:#fff;
}
@media(hover) {
  .lMenu__closeButton:hover {
    opacity: .8
  }
}
.lMenu__navItem:nth-child(n+2) {
  margin-top: 3rem
}
.lMenu__navItem a {
  display: inline-block;
  font-size: 1.9rem;
  font-weight: 500;
  color:#fff;
  letter-spacing: .02em;
  -webkit-transition: color .6s cubic-bezier(0.19, 1, 0.22, 1);
  transition: color .6s cubic-bezier(0.19, 1, 0.22, 1)
}
@media(hover) {
  .lMenu__navItem a:hover {
    color: var(--dark-blue)
  }
}
.lMenu__recruitLink {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #fff;
  width: 100%;
  font-size: 1.7rem;
  font-weight: 500;
  letter-spacing: .02em;
  margin-top: 6rem;
  padding: 2rem 0 2.2rem
}
.lMenu__recruitLink > span {
  position: relative;
  color: #fff;
  -webkit-transition: color .3s cubic-bezier(1, 0, 0, 1);
  transition: color .3s cubic-bezier(1, 0, 0, 1);
  z-index: 1
}
.lMenu__recruitLink::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #001e43;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  -webkit-transform-origin: bottom left;
  transform-origin: bottom left;
  -webkit-transition: -webkit-transform .3s cubic-bezier(0.39, 0.575, 0.565, 1);
  transition: -webkit-transform .3s cubic-bezier(0.39, 0.575, 0.565, 1);
  transition: transform .3s cubic-bezier(0.39, 0.575, 0.565, 1);
  transition: transform .3s cubic-bezier(0.39, 0.575, 0.565, 1), -webkit-transform .3s cubic-bezier(0.39, 0.575, 0.565, 1)
}
@media(hover) {
  .lMenu__recruitLink:hover::before {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right
  }
  .lMenu__recruitLink:hover > span {
    color: #001e43
  }
}
.lMenu__snsLink {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  margin: 7rem 0 -3rem
}
.lMenu__facebookLink, .lMenu__instagramLink {
  display: inline-block;
  font-size: 1.4rem;
  letter-spacing: .02em;
  font-weight: 500;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: .6rem;
  -webkit-transition: color .3s cubic-bezier(0.19, 1, 0.22, 1), -webkit-text-decoration-color .6s cubic-bezier(0.19, 1, 0.22, 1);
  transition: color .3s cubic-bezier(0.19, 1, 0.22, 1), -webkit-text-decoration-color .6s cubic-bezier(0.19, 1, 0.22, 1);
  transition: color .3s cubic-bezier(0.19, 1, 0.22, 1), text-decoration-color .6s cubic-bezier(0.19, 1, 0.22, 1);
  transition: color .3s cubic-bezier(0.19, 1, 0.22, 1), text-decoration-color .6s cubic-bezier(0.19, 1, 0.22, 1), -webkit-text-decoration-color .6s cubic-bezier(0.19, 1, 0.22, 1);
  margin-bottom: 3rem
}
.lMenu__facebookLink--icon svg path, .lMenu__instagramLink--icon svg path {
  -webkit-transition: stroke .3s cubic-bezier(0.19, 1, 0.22, 1);
  transition: stroke .3s cubic-bezier(0.19, 1, 0.22, 1)
}
@media(hover) {
  .lMenu__facebookLink:hover, .lMenu__instagramLink:hover {
    color: var(--dark-blue);
    -webkit-text-decoration-color: var(--dark-blue);
    text-decoration-color: var(--dark-blue)
  }
  .lMenu__facebookLink:hover .lMenu__facebookLink--icon svg path, .lMenu__instagramLink:hover .lMenu__facebookLink--icon svg path {
    stroke: var(--dark-blue)
  }
}
.lMenu__facebookLink {
  margin-right: 3rem
}
.lMenu--recruit {
  --header-height: 55px
}
.lMenu--recruit .lMenu__closeButton {
  position: absolute;
  top: 0;
  right: 0;
  width: var(--header-height);
  height: var(--header-height);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #fff;
  overflow: hidden;
  z-index: 1
}
.lMenu--recruit .lMenu__closeButton::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  inset: 0 0 0 0;
  background-color: #001e43;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  -webkit-transform-origin: bottom left;
  transform-origin: bottom left;
  -webkit-transition: -webkit-transform .3s ease;
  transition: -webkit-transform .3s ease;
  transition: transform .3s ease;
  transition: transform .3s ease, -webkit-transform .3s ease
}
.lMenu--recruit .lMenu__closeButton > span {
  position: absolute;
  left: 0;
  right: 0;
  top: calc((100% - 2px) / 2);
  display: block;
  width: 21px;
  height: 2px;
  margin: auto;
  background-color: #fff;
  -webkit-transition: margin-top .4s cubic-bezier(0.39, 0.575, 0.565, 1), background-color .3s ease, -webkit-transform .4s cubic-bezier(0.39, 0.575, 0.565, 1);
  transition: margin-top .4s cubic-bezier(0.39, 0.575, 0.565, 1), background-color .3s ease, -webkit-transform .4s cubic-bezier(0.39, 0.575, 0.565, 1);
  transition: transform .4s cubic-bezier(0.39, 0.575, 0.565, 1), margin-top .4s cubic-bezier(0.39, 0.575, 0.565, 1), background-color .3s ease;
  transition: transform .4s cubic-bezier(0.39, 0.575, 0.565, 1), margin-top .4s cubic-bezier(0.39, 0.575, 0.565, 1), background-color .3s ease, -webkit-transform .4s cubic-bezier(0.39, 0.575, 0.565, 1)
}
.lMenu--recruit .lMenu__closeButton > span:nth-child(1) {
  margin-top: -5.5px
}
.lMenu--recruit .lMenu__closeButton > span:nth-child(3) {
  margin-top: 6.5px
}
@media(hover) {
  .lMenu--recruit .lMenu__closeButton:hover {
    opacity: 1
  }
  .lMenu--recruit .lMenu__closeButton:hover > span {
    background-color: #001e43
  }
  .lMenu--recruit .lMenu__closeButton:hover::before {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right
  }
}
.menuOpen .lMenu--recruit .lMenu__closeButton > span {
  margin-top: 0
}
.menuOpen .lMenu--recruit .lMenu__closeButton > span:nth-child(1) {
  -webkit-transform: rotate(-315deg);
  transform: rotate(-315deg)
}
.menuOpen .lMenu--recruit .lMenu__closeButton > span:nth-child(2) {
  -webkit-transform: translateX(200%);
  transform: translateX(200%)
}
.menuOpen .lMenu--recruit .lMenu__closeButton > span:nth-child(3) {
  -webkit-transform: rotate(315deg);
  transform: rotate(315deg)
}
.lMenu {
  visibility: hidden;
  pointer-events: none
}
.lMenu.is-open {
  visibility: visible;
  pointer-events: all
}
.lMenu__inner, .lMenu__wrapper {
  will-change: transform
}
.lMenu[aria-hidden=false] .lMenu__inner {
  -webkit-animation: mmfadeIn .3s cubic-bezier(0.39, 0.575, 0.565, 1);
  animation: mmfadeIn .3s cubic-bezier(0.39, 0.575, 0.565, 1)
}
.lMenu[aria-hidden=false] .lMenu__wrapper {
  -webkit-animation: mmslideIn .3s cubic-bezier(0.39, 0.575, 0.565, 1);
  animation: mmslideIn .3s cubic-bezier(0.39, 0.575, 0.565, 1)
}
.lMenu[aria-hidden=true] .lMenu__inner {
  -webkit-animation: mmfadeOut .6s cubic-bezier(0.39, 0.575, 0.565, 1);
  animation: mmfadeOut .6s cubic-bezier(0.39, 0.575, 0.565, 1)
}
.lMenu[aria-hidden=true] .lMenu__wrapper {
  -webkit-animation: mmslideOut .6s cubic-bezier(0.39, 0.575, 0.565, 1);
  animation: mmslideOut .6s cubic-bezier(0.39, 0.575, 0.565, 1)
}
@-webkit-keyframes mmfadeIn {
  from {
    background-color: rgba(0, 0, 0, 0)
  }
  to {
    background-color: rgba(0, 0, 0, .54)
  }
}
@keyframes mmfadeIn {
  from {
    background-color: rgba(0, 0, 0, 0)
  }
  to {
    background-color: rgba(0, 0, 0, .54)
  }
}
@-webkit-keyframes mmfadeOut {
  from {
    background-color: rgba(0, 0, 0, .54)
  }
  to {
    background-color: rgba(0, 0, 0, 0)
  }
}
@keyframes mmfadeOut {
  from {
    background-color: rgba(0, 0, 0, .54)
  }
  to {
    background-color: rgba(0, 0, 0, 0)
  }
}
@-webkit-keyframes mmslideIn {
  from {
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
  }
  to {
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}
@keyframes mmslideIn {
  from {
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
  }
  to {
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}
@-webkit-keyframes mmslideOut {
  from {
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
  to {
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
  }
}
@keyframes mmslideOut {
  from {
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
  to {
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
  }
}
@media screen and (min-width: 768px) {
  .lMenu__inner {
    height: 100%;
    margin-top: 0
  }
  .lMenu__wrapper {
    max-width: 31.6vw;
    background-image: url(../image/background-pc.jpg);
    background-size: 200% auto
  }
  .lMenu__contents {
    padding: 120px 80px 0;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
  }
  .lMenu__navItem:nth-child(n+2) {
    margin-top: 5rem
  }
  .lMenu__navLink {
    font-size: 2rem
  }
  .lMenu__recruitLink {
    font-size: 2rem;
    margin-top: 8rem
  }
  .lMenu__snsLink {
    position: absolute;
    left: 80px;
    bottom: 60px;
    margin-top: 0
  }
  .lMenu__closeButton {
    display: block
  }
  .lMenu--recruit .lMenu__closeButton {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    --header-height: 77px
  }
  .lMenu--recruit .lMenu__closeButton > span {
    width: 30px
  }
  .lMenu--recruit .lMenu__closeButton > span:nth-child(1) {
    margin-top: -9.5px
  }
  .lMenu--recruit .lMenu__closeButton > span:nth-child(3) {
    margin-top: 10.5px
  }
  .menuOpen .lMenu--recruit .lMenu__closeButton > span {
    margin-top: 0
  }
}
.no-js .lMenu__inner {
  height: 100% !important;
  margin-top: 0 !important
}
.lRecruitButton {
  position: fixed;
  right: 10px;
  bottom: 10px;
  width: 90px;
  height: 90px;
  z-index: 1000
}
@media(hover) {
  .lRecruitButton:hover::before {
    -webkit-transform: scale(1.25);
    transform: scale(1.25)
  }
  .lRecruitButton:hover::after {
    --rotate: 360deg;
    --scale: 1.3
  }
}
.lRecruitButton::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../image/recruitButton-background.png) no-repeat center/cover;
  -webkit-transition: -webkit-transform .6s ease-out;
  transition: -webkit-transform .6s ease-out;
  transition: transform .6s ease-out;
  transition: transform .6s ease-out, -webkit-transform .6s ease-out
}
.lRecruitButton::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 80%;
  height: 80%;
  background: url(../image/recruitButton-circle.svg) no-repeat center/cover;
  -webkit-transform: translate(-50%, -50%) rotate(var(--rotate, 0)) scale(var(--scale, 1));
  transform: translate(-50%, -50%) rotate(var(--rotate, 0)) scale(var(--scale, 1));
  -webkit-transition: -webkit-transform .6s ease;
  transition: -webkit-transform .6s ease;
  transition: transform .6s ease;
  transition: transform .6s ease, -webkit-transform .6s ease
}
.lRecruitButton__link {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 15px;
  line-height: 1.4;
  letter-spacing: .05em;
  color: #fff;
  z-index: 1
}
.lRecruitButton--recruit {
  width: 113px;
  height: 113px
}
.lRecruitButton--recruit::after {
  width: 85%;
  height: 85%
}
.lRecruitButton--recruit .lRecruitButton__link {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 14px
}
.lRecruitButton--recruit .lRecruitButton__link .en {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .11em;
  margin-top: 4px
}
@media screen and (min-width: 768px) {
  .lRecruitButton {
    right: 30px;
    bottom: 30px;
    width: 134px;
    height: 134px
  }
  .lRecruitButton__link {
    font-size: 16px
  }
  .lRecruitButton--recruit {
    width: 155px;
    height: 155px
  }
  .lRecruitButton--recruit .lRecruitButton__link {
    font-size: 15px
  }
}

.lTextContents {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center
}
.lTextContents__headline {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 2.8rem;
  letter-spacing: .05em;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  line-height: 0
}
.lTextContents__subHeadline {
  position: relative;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 1.8rem;
  letter-spacing: .05em;
  line-height: 1.7;
  text-align: center;
  z-index: 1
}
.lTextContents__subHeadline::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8.8rem;
  height: 8.8rem;
  border: 1px solid #000;
  border-radius: 0%;
  opacity: .08;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: -1
}
.lTextContents__text {
  font-size: 1.4rem;
  letter-spacing: .02em;
  line-height: 2.1
}
.lTextContents__link {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: #fff;
  padding: 1.6rem 2rem
}
.lTextContents__link::before {
  content: " ";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  inset: 0;
  background-color: var(--dark-blue);
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: bottom right;
  transform-origin: bottom right;
  -webkit-transition: -webkit-transform .4s cubic-bezier(0.39, 0.575, 0.565, 1);
  transition: -webkit-transform .4s cubic-bezier(0.39, 0.575, 0.565, 1);
  transition: transform .4s cubic-bezier(0.39, 0.575, 0.565, 1);
  transition: transform .4s cubic-bezier(0.39, 0.575, 0.565, 1), -webkit-transform .4s cubic-bezier(0.39, 0.575, 0.565, 1)
}
.lTextContents__link--text {
  position: relative;
  font-size: 1.5rem;
  letter-spacing: .02em;
  font-weight: 500;
  -webkit-transition: color .6s cubic-bezier(0.19, 1, 0.22, 1);
  transition: color .6s cubic-bezier(0.19, 1, 0.22, 1);
  z-index: 1
}
.lTextContents__link--icon {
  position: relative;
  width: 2.8rem;
  height: 2.8rem;
  z-index: 1
}
.lTextContents__link--icon::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../image/button-icon-blue.png) no-repeat top/cover;
  border-radius: 50%;
  -webkit-transition: opacity .8s cubic-bezier(0.19, 1, 0.22, 1);
  transition: opacity .8s cubic-bezier(0.19, 1, 0.22, 1)
}
.lTextContents__link--icon::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../image/button-icon-white.png) no-repeat top/contain;
  border-radius: 50%;
  opacity: 0;
  -webkit-transition: opacity .8s cubic-bezier(0.19, 1, 0.22, 1);
  transition: opacity .8s cubic-bezier(0.19, 1, 0.22, 1);
  -webkit-transform: translate(0);
  transform: translate(0)
}
@media(hover) {
  .lTextContents__link:hover::before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left
  }
  .lTextContents__link:hover .lTextContents__link--text {
    color: #fff
  }
  .lTextContents__link:hover .lTextContents__link--icon::before {
    opacity: 0
  }
  .lTextContents__link:hover .lTextContents__link--icon::after {
    opacity: 1
  }
}
@media screen and (min-width: 768px) {
  .lTextContents {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
  }
  .lTextContents__headline {
    font-size: 4.2rem;
    letter-spacing: .1em;
    line-height: 1
  }
  .lTextContents__subHeadline {
    font-size: 2.6rem;
    text-align: initial
  }
  .lTextContents__subHeadline::before {
    top: 30%;
    left: 1.5%;
    width: 9.5rem;
    height: 9.5rem
  }
  .lTextContents__text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 1.5rem;
    line-height: 2.5
  }
  .lTextContents__link--text {
    font-size: 1.6rem
  }
}
@media screen and (min-width: 1024px) {
  .no-js .lTextContents__subHeadline {
    text-align: left
  }
}
.lRecruitLink__wrapper {
  position: relative;
  background-image: url("../img/main/img02.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
	border-radius:100px 0 0 0;
  padding: 30px 30px 40px;
}

.lRecruitLink__wrapper__greeting {
  position: relative;
  background-image: url("../img/main/img04.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
	border-radius:100px 0 0 0;
  padding: 30px 30px 40px;
}
.lRecruitLink__wrapper::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--dark-blue);
border-radius:100px 0 0 0;
  opacity: .9;
}

.lRecruitLink__wrapper__greeting::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--dark-blue);
border-radius:100px 0 0 0;
  opacity: .9;
}

.lRecruitLink__image {
  position: relative;
  top: -20px;
  margin-left: calc(50% - 50vw);
  margin-bottom: -66px
}
.lRecruitLink__image img {
  width: 100%
}

.lRecruitLink__image__greeting {
  position: relative;
  top: -10px;
  margin-left: calc(50% - 50vw);
  margin-bottom: -66px
}
.lRecruitLink__image__greeting img {
  width: 80%
}

@media screen and (max-width: 767px) {
  .lRecruitLink__image__greeting {
    display: none;
  }
}


.lRecruitLink__contents {
  position: relative;
  margin-top: 4.1rem;
  color: #fff
}

.lRecruitLink__contents__greeting {
  position: relative;
  margin-top: 4.1rem;
  color: #fff;
  /* ↓以下を追加（最大幅を拡げる）*/
  max-width: 100%;
  width: 100%;
}

.lRecruitLink__headline {
  font-family: "Shippori Mincho", serif;
  font-size: 2.8rem;
  letter-spacing: .05em;
  line-height: 1.5;
  text-align: left
}
.lRecruitLink__headline::before {
  border: 1px solid #fff;
  left: 7%;
  opacity: .2
}
.lRecruitLink__subHeadline {
  font-family: "Shippori Mincho", serif;
  font-size: 2.2rem;
  letter-spacing: .05em;
  line-height: 1.5;
  margin-top: 4rem
}
.lRecruitLink__text {
  font-size: 1.6rem;
  letter-spacing: .02em;
  line-height: 2.1;
  margin-top: 2rem
}

.lRecruitLink__text__greeting {
	font-family: "Shippori Mincho", serif;
  font-size: 1.7rem;
  letter-spacing: .02em;
  line-height: 2.5;
  margin-top: 2rem;
	max-width: 80%;
  width: 100%;
}
/* スマホ用（768px以下）の幅調整 */
@media screen and (max-width: 767px) {
  .lRecruitLink__text__greeting {
    max-width: 100%;
  }
}
.lRecruitLink__text__messe {
font-family: 'Yuji Boku', serif;

  font-size: 2rem;
  text-align: right;         /* 右寄せ */
  margin-top: 2rem;
  margin-right: 1rem;
  letter-spacing: 0.1em;
  color: #fff;
	max-width: 80%;
}

@media screen and (max-width: 768px) {
  .lRecruitLink__text__messe {
    max-width: 100%; /* スマホ画面のみ幅100%にする */
  }
}
.lRecruitLink__link {
  max-width: 71.2vw;
  margin-top: 3rem
}

@media screen and (min-width: 768px) {
  .lRecruitLink__wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: url("../img/main/img02.jpg") no-repeat center/cover;
    margin-left: 13.2vw;
    padding: 13.2rem 0 12rem
  }
	
	.lRecruitLink__wrapper__greeting {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: url("../img/main/img04.jpg") no-repeat center/cover;
    margin-left: 13.2vw;
    padding: 13.2rem 0 12rem
  }

  .lRecruitLink__image {
    top: 0;
    left: -73px;
    margin: 0 -73px 0 0;
    width: 50%;
    max-width: 589px
  }
	
  .lRecruitLink__contents {
    margin-top: 0;
    margin-left: 100px;
    margin-left: min(7.3vw, 100px)
  }
  .lRecruitLink__headline {
    font-size: 4.2rem
  }
  .lRecruitLink__headline > span {
    display: block
  }
  .lRecruitLink__headline::before {
    top: 50%;
    width: 16.3rem;
    height: 16.3rem
  }
  .lRecruitLink__subHeadline {
    margin-top: 9.5rem
  }
  .lRecruitLink__text {
    max-width: 350px;
    font-size: 1.8rem;
    margin-top: 4.7rem
  }
	

	
  .lRecruitLink__link {
    max-width: 28.4rem;
    margin-top: 8rem
  }
  .lRecruitLink--about {
    margin-top: 1rem
  }
}
@media screen and (min-width: 1366px) {
  .lRecruitLink__wrapper {
    width: 1186px;
    width: clamp(1186px, calc(50vw + 503px), 1463px)
  }
}
@media screen and (min-width: 1920px) {
  .lRecruitLink__wrapper {
    margin: 0 auto
  }
}
.lBreadcrumbs__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start
}
.lBreadcrumbs__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  font-size: 1.2rem;
  margin-bottom: 1rem
}
.lBreadcrumbs__item:nth-last-child(n+2) {
  color: #919191
}
.lBreadcrumbs__item:nth-last-child(n+2) > a {
  color: #919191
}
.lBreadcrumbs__item:nth-last-child(n+2)::after {
  content: "��";
  font-size: 1.4rem;
  margin: 0 .8rem
}
.lBreadcrumbs--about, .lBreadcrumbs--contact {
  margin: 7rem 0 1.2rem;
  padding: 0 30px
}
@media screen and (min-width: 768px) {
  .lBreadcrumbs--about, .lBreadcrumbs--contact {
    margin: 14rem 0 3rem;
    padding: 0 40px
  }
}
.lFooter {
  position: relative;
  width: 100%;
  background-color: var(--back-black);
  color: #fff
}
.lFooter::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(../image/footer-filter.png);
  background-size: 100% auto;
  background-position: 50% 0;
  pointer-events: none
}
.lFooter__wrapper {
  padding: 5rem 30px 3.5rem
}
.lFooter__logo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center
}
.lFooter__logo a {
  display: block
}
.lFooter__logo--image {
  width: 167px;
  height: 96px
}
.lFooter__nav {
  margin-top: 4rem
}
.lFooter__navItem {
  padding: 2rem 0;
  border-top: 1px solid rgba(255, 255, 255, .05)
}
.lFooter__navItem:last-child {
  border-bottom: 1px solid rgba(255, 255, 255, .05)
}
.lFooter__navLink {
  display: inline-block;
  font-size: 1.3rem;
  letter-spacing: .02em;
  color: #fff;
  -webkit-transition: opacity .6s cubic-bezier(0.19, 1, 0.22, 1);
  transition: opacity .6s cubic-bezier(0.19, 1, 0.22, 1)
}
@media(hover) {
  .lFooter__navLink:hover {
    opacity: .7
  }
}
.lFooter__recruitLink {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: .02em;
  background-color: #c13e2c;
  margin-top: 4.2rem;
  padding: 2rem 0;
  -webkit-transition: color .3s cubic-bezier(1, 0, 0, 1);
  transition: color .3s cubic-bezier(1, 0, 0, 1)
}
.lFooter__recruitLink > span {
  position: relative;
  z-index: 1
}
.lFooter__recruitLink::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  background-color: #fff;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  -webkit-transform-origin: bottom left;
  transform-origin: bottom left;
  -webkit-transition: -webkit-transform .3s cubic-bezier(0.39, 0.575, 0.565, 1);
  transition: -webkit-transform .3s cubic-bezier(0.39, 0.575, 0.565, 1);
  transition: transform .3s cubic-bezier(0.39, 0.575, 0.565, 1);
  transition: transform .3s cubic-bezier(0.39, 0.575, 0.565, 1), -webkit-transform .3s cubic-bezier(0.39, 0.575, 0.565, 1)
}
@media(hover) {
  .lFooter__recruitLink:hover {
    color: #fff
  }
  .lFooter__recruitLink:hover::before {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right
  }
}
.lFooter__overview {
  margin-top: 5.4rem;
  color: #fff
}
.lFooter__companyName {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 1.5rem;
  letter-spacing: .05em
}
.lFooter__address {
  font-size: 1.3rem;
  letter-spacing: .02em;
  margin-top: 1.6rem
}
.lFooter__tel {
  font-size: 1.3rem;
  letter-spacing: .02em;
  color: #fff;
  margin-top: .5rem
}
.lFooter__sns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 3rem
}
.lFooter__facebook, .lFooter__instagram {
  font-size: 1.3rem;
  letter-spacing: .02em;
  color: #fff;
  -webkit-transition: opacity .6s cubic-bezier(0.19, 1, 0.22, 1);
  transition: opacity .6s cubic-bezier(0.19, 1, 0.22, 1)
}
@media(hover) {
  .lFooter__facebook:hover, .lFooter__instagram:hover {
    opacity: .7
  }
}
.lFooter__facebook {
  margin-right: 3rem
}
.lFooter__copyright {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  letter-spacing: .04em;
  opacity: .24;
  margin-top: 3rem
}
.lFooter__topButton {
  position: absolute;
  top: 0;
  right: 20px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 54px;
  height: 54px
}
.lFooter__topButton::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #001e43;
  border-radius: 50%;
  z-index: 1;
  -webkit-transition: -webkit-transform 1s cubic-bezier(0.19, 1, 0.22, 1);
  transition: -webkit-transform 1s cubic-bezier(0.19, 1, 0.22, 1);
  transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1);
  transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 1s cubic-bezier(0.19, 1, 0.22, 1)
}
.lFooter__topButton::after {
  content: "TOP";
  position: absolute;
  top: 50%;
  left: 51%;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 20px;
  color: #fff;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 2
}
@media(hover) {
  .lFooter__topButton:hover::before {
    -webkit-transform: scale(1.22);
    transform: scale(1.22)
  }
}
.lFooter--recruit {
  margin-top: 9rem
}
@media screen and (min-width: 768px) {
  .lFooter::before {
    background-image: url(../image/footer-filter-pc.png)
  }
  .lFooter--recruit {
    margin-top: 22rem
  }
}
@media screen and (min-width: 1024px) {
  .lFooter {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0 30px
  }
  .lFooter__wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    max-width: 1073px;
    padding: 9.5rem 0 16rem
  }
  .lFooter__logo {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    position: relative;
    padding-right: 4rem
  }
  .lFooter__logo::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    width: 1px;
    height: 95%;
    background-color: #fff;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
  }
  .lFooter__logo--image {
    width: 226px;
    height: 129px
  }
  .lFooter__nav {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    margin-top: 0
  }
  .lFooter__navList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 8rem;
    width: 32.4rem
  }
  .lFooter__navItem {
    padding: 0;
    border: none;
    margin-bottom: 2rem;
    margin-right: 5rem
  }
  .lFooter__navItem:last-child {
    border: none
  }
  .lFooter__navItem:nth-child(n+2) {
    margin-top: 0
  }
  .lFooter__recruitLink {
    width: auto;
    max-width: 14rem;
    margin-top: 0;
    padding: 1.2rem 4rem
  }
  .lFooter__overview {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    margin: 0 80px 0 4rem
  }
  .lFooter__address {
    margin-top: 2rem
  }
  .lFooter__tel {
    margin-top: 1rem
  }
  .lFooter__copyright {
    position: absolute;
    left: 0;
    bottom: 2.7rem;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
  }
  .lFooter__topButton {
    right: 40px;
    width: 74px;
    height: 74px
  }
  .lFooter__topButton::after {
    font-size: 28px
  }
}
@media screen and (min-width: 1366px) {
  .lFooter__wrapper {
    margin-left: -184px
  }
  .lFooter__overview {
    margin: 0 19.2rem 0 4rem
  }
}
.pFirstView {
  position: relative;
  height: calc(100% + 28vw);
  padding-top: var(--header-height);
  overflow: hidden
}
.pFirstView__wrapper {
  width: 100%;
  height: 100%
}
/* 共通のスタイル */
.pFirstView__image {
  position: relative;
  left: 56px;
  width: 100vw;
  height: 100vw;
  margin-top: 3rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

/* about用背景画像 */
#about .pFirstView__image {
  background-image: url("../img/main/img01.jpg");
}

/* graphite用背景画像 */
#graphite .pFirstView__image {
  background-image: url("../img/main/denkyoku.jpg");
}

/* estate用背景画像 */
#greeting .pFirstView__image {
  background-image: url("../img/main/img04.jpg");
}

/* contact用背景画像 */
#contact .pFirstView__image {
  background-image: url("../img/main/img03.jpg");
	position: relative;
  left: 56px;
  width: 100vw;
  height: 50vw;
  margin-top: 3rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.pFirstView__contents {
  margin-top: 9.5rem;
  padding: 0 47px
}
.pFirstView__headline {
  font-size: 4rem;
  letter-spacing: -0.05em;
  text-align: left
}
.pFirstView__headline::before {
  left: 6%;
  width: 10.9rem;
  height: 10.9rem
}
.pFirstView__headlineWrapper {
  display: block;
  overflow: hidden;
	  font-family:  "Shippori Mincho", serif;
}
.pFirstView__headlineWrapper > span {
  display: block;
  -webkit-animation: FV-headline-slideIn .6s cubic-bezier(0.39, 0.575, 0.565, 1) both .2s;
  animation: FV-headline-slideIn .6s cubic-bezier(0.39, 0.575, 0.565, 1) both .2s
}
.pFirstView__text {
	font-family:  "Shippori Mincho", serif;
  margin-top: 3rem;
 font-size: 2rem;
}
.pAbout {
  margin-top: 8.5rem
}
.pGreeting {
  padding: 0 30px
}
.pGreeting__subHeadline {
  font-family:  "Shippori Mincho", serif;
  font-size: 2.8rem;
  letter-spacing: .05em;
  line-height: 1.6;
  margin-top: 4.4rem
}
.pGreeting__text {
  margin-top: 3rem
}
.pGreeting__name {
  font-family:  "Shippori Mincho", serif;
  font-size: 1.6rem;
  font-weight: 600;
  letter-spacing: .05em;
  margin-top: 3.4rem
}
.pGreeting__class {
  font-size: 1.4rem;
  font-weight: 400;
  letter-spacing: .02em;
  margin-right: 1.4rem
}
.pPhilosophy {
  margin-top: 46.4vw
}
.pPhilosophy__wrapper {
  padding: 14.5rem 30px 4rem;
  position: relative;
  background: url("../img/main/denkyoku.jpg") no-repeat center/cover
}
.pPhilosophy__wrapper::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #192833;
  opacity: .9
}
.pPhilosophy__image {
  position: absolute;
  top: -37vw;
  left: 30px;
  width: calc(100% - 60px);
  height: 64vw;
  overflow: hidden;
  z-index: 1
}
.pPhilosophy__image .image {
  width: 100%;
  height: 100%;
  background: url("../img/main/img03.jpg") no-repeat;
  background-position: 43% 34%;
  background-size: cover
}
.pPhilosophy__contents {
  position: relative;
  color: #fff
}
.pPhilosophy__headline {
  font-family:  "Shippori Mincho", serif;
  font-size: 2.2rem;
  letter-spacing: .05em
}
.pPhilosophy__list {
  margin-top: 3.3rem
}
.pPhilosophy__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center
}
.pPhilosophy__item:nth-child(n+2) {
  margin-top: 2rem
}
.pPhilosophy__item--icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: .04em;
  border: 1px solid rgba(255, 255, 255, .15);
  border-radius: 0%;
  margin-right: 1.2rem
}
.pPhilosophy__item--text {
  font-size: 1.7rem;
  font-weight: 400;
  line-height: 1.64
}
.pCompanyProfile {
  background-color: #fff;
  padding: 3.5rem 30px 3rem
}
.pCompanyProfile__headline {
  font-family:  "Shippori Mincho", serif;
  font-size: 2.2rem;
  letter-spacing: .05em
}
.pCompanyProfile__list {
  margin-top: 3.4rem
}
.pCompanyProfile__dl {
  border-top: 1px solid rgba(0, 0, 0, .08);
  padding: 3rem 0
}
.pCompanyProfile__dl:last-child {
  border-bottom: 1px solid rgba(0, 0, 0, .08)
}
.pCompanyProfile__dl > dt {
  font-size: 1.3rem;
  letter-spacing: .05em
}
.pCompanyProfile__dl > dd {
  font-size: 1.4rem;
  letter-spacing: .05em;
  font-weight: 500;
  margin-top: 1rem
}
.pCompanyProfile__link {
  display: inline-block;
  font-size: 1.4rem;
  letter-spacing: .02em;
  font-weight: 500;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: .6rem
}
.pCompanyProfile__map {
  overflow: hidden;
  position: relative;
  height: 0;
  margin-top: 3rem;
  padding-bottom: 75%
}
.pCompanyProfile__map > iframe {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%
}
@media screen and (min-width: 768px) {
  .pFirstView {
    padding: 0;
    height: auto
  }
  .pFirstView__wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    max-width: 1920px;
    margin: 0 auto
  }
  .pFirstView__contents {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100vh;
    max-height: calc(74.7vw - 9.3vw);
    padding: 0 70px 0 100px;
    padding: 0 min(5.1vw, 70px) 0 min(7.3vw, 100px);
    margin: 0
  }
  .pFirstView__headline {
    font-size: 7.1rem;
    font-size: min(5.2vw, 7.1rem)
  }
  .pFirstView__headline::before {
    width: 20.5rem;
    height: 20.5rem;
    width: min(15vw, 20.5rem);
    height: min(15vw, 20.5rem)
  }
  .pFirstView__image {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    top: -9.3vw;
    left: auto;
    width: 74.7vw;
    height: 74.7vw;
    background-image: url("../img/main/img01.jpg");
    margin-top: 0
  }
  .pAbout {
    margin-top: calc(40px - 9.8vw);
    padding: 0 60px
  }
  .pGreeting {
    max-width: 1006px;
    margin: 0 auto;
    padding: 0
  }
  .pGreeting__left {
    margin-right: 11rem
  }
  .pGreeting__right {
    width: 100%;
    margin-top: 13.5rem
  }
  .pGreeting__subHeadline {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 4.2rem;
    margin-top: 0
  }
  .pGreeting__name {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 1.8rem;
    margin-top: 4.4rem
  }
  .pGreeting__class {
    font-size: 1.5rem;
    margin-right: 0;
    margin-bottom: 1.4rem
  }
  .pPhilosophy {
    margin-top: 20.8vw
  }
  .pPhilosophy__wrapper {
    background-image: url("../img/main/denkyoku.jpg");
    padding: 27rem 60px 10.7rem
  }
  .pPhilosophy__image {
    top: -240px;
    left: 50%;
    width: calc(100% - 120px);
    max-width: 1006px;
    height: 400px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    padding-left: 15.4rem
  }
  .pPhilosophy__image .image {
    background-image: url("../img/main/img03.jpg");
    background-position: 42% 40%
  }
  .pPhilosophy__contents {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    max-width: 1006px;
    margin: 0 auto;
    padding-left: 15.4rem
  }
  .pPhilosophy__headline {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    font-size: 2.9rem;
    letter-spacing: .1em
  }
  .pPhilosophy__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    margin-top: 0;
    margin-right: 15rem;
    margin-right: min(11vw, 150px)
  }
  .pPhilosophy__item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
  }
  .pPhilosophy__item:nth-child(n+2) {
    margin-top: 0;
    margin-right: 4rem
  }
  .pPhilosophy__item--icon {
    margin-right: 0;
    width: 7.3rem;
    height: 7.3rem;
    font-size: 2.2rem
  }
  .pPhilosophy__item--text {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    font-size: 2rem;
    letter-spacing: .12em;
    margin-top: 2rem
  }
  .pCompanyProfile {
    padding: 15rem 60px 2rem
  }
  .pCompanyProfile__headline {
    max-width: 700px;
    font-size: 3.4rem;
    margin: 0 auto
  }
  .pCompanyProfile__list {
    max-width: 700px;
    margin: 6.6rem auto 0
  }
  .pCompanyProfile__dl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 4rem 0
  }
  .pCompanyProfile__dl dt {
    width: 36%;
    max-width: 252px;
    font-size: 1.5rem;
    letter-spacing: .02em
  }
  .pCompanyProfile__dl dd {
    font-size: 1.5rem;
    letter-spacing: .02em;
    margin-top: 0
  }
  .pCompanyProfile__dl .pCompanyProfile__googleMap {
    width: calc(100% - 36%);
    max-width: 448px;
    margin-top: 1.4rem;
    margin-left: auto
  }
}
@-webkit-keyframes FV-headline-slideIn {
  0% {
    -webkit-transform: translateY(100%);
    transform: translateY(100%)
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}
@keyframes FV-headline-slideIn {
  0% {
    -webkit-transform: translateY(100%);
    transform: translateY(100%)
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}
.no-js .lBackground {
  overflow: hidden
}



.pTop {
  margin-top: 8.8rem;
  padding: 0 28px
}
.pTop__middle {
  margin-top: 5rem;
  width: 100vw;
  height: 260px;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw)
}
.pTop__middleWrapper {
  position: relative;
  width: 100%;
  height: 100%
}
.pTop__middleImage {
  position: relative;
  width: 100%;
  height: 85%;
  background: url("../img/main/denkyoku_back.jpg") no-repeat;
  background-position: center;
  background-size: cover;
  overflow: hidden;
  z-index: 1
}
.pTop__middleIcon {
  position: absolute;
  right: 21px;
  width: 149px;
  height: 84px
}
.pTop__middleIcon--white {
  bottom: -42px;
  background: url("../img/logo-named-white.svg") no-repeat center/cover
}
.pTop__middleIcon--black {
  bottom: -2px;
  background: url(../img/logo-black.svg) no-repeat center/cover
}



@media screen and (min-width: 768px) {
.pTop__middle {
    margin-top: 6rem;
    height: 630px
  }
  .pTop__middleImage {
    background-image: url("../img/main/denkyoku.jpg");
    background-position: 40%  37%;
    position: absolute;
    bottom: 0;
    height: 100%
  }
  .pTop__middleIcon {
    width: 310px;
    height: 176px
  }
  .pTop__middleIcon--white {
    bottom: initial;
    top: -88px;
    right: 110px
  }
  .pTop__middleIcon--black {
    bottom: initial;
    top: 0;
    right: 110px
  }
	}


.pMajor {
	position: relative;
	background-color: #fff;
}
.pMajor__headline {
  font-size: 2.2rem;
  z-index: 2;
}
.pMajor__wrapper {
  display: flex;
  justify-content: space-between;
  max-width: 1366px;
  margin: 0 auto;
  padding: 2rem 6.7rem; /* 上の余白を追加 */
  flex-wrap: wrap; /* スマホ時に縦並びにするために追加 */
}
.pMajor__domestic, .pMajor__overseas {
  width: 48%;
}
.pMajor__stickyHead {
  padding: 1.8rem 0;
  margin-top: .8rem;
}
.pMajor__stickyHeadColumn {
  font-size: 1.4rem;
  font-weight: 500;
  color: #9a9a9a;
}
.pMajor__stickyList {
  list-style: none;
  padding: 0;
}
.pMajor__stickyItem {
  padding: 2rem 0;
  border-bottom: 1px solid #001e43;
}
.pMajor__stickyItemColumn {
  font-size: 2rem;
  font-weight: 500;
  margin: 5px 0 0 10px;
}
.pMajor__stickyItemColumn--wide {
  width: 100%;
  font-size: 1.5rem;
}

@media screen and (max-width: 767px) {
  .pMajor__wrapper {
    flex-direction: column; /* スマホ時に縦並びにする */
    align-items: center;
  }
  .pMajor__domestic, .pMajor__overseas {
    width: 100%;
    margin-bottom: 2rem; /* 各ブロックの間隔を調整 */
  }
}
@media screen and (min-width: 768px) {
  .pMajor {
    padding: .2rem 0 11rem;
  }
  .pMajor__wrapper {
    display: flex;
    justify-content: space-between;
  }
  .pMajor__headline {
    font-size: 2.6rem;
    line-height: 1;
  }
  .pMajor__stickyHead {
    position: static;
    margin-top: 3.9rem;
  }
  .pMajor__stickyHeadColumn {
    font-size: 1.5rem;
    white-space: nowrap;
  }
  .pMajor__stickyItem {
    padding: 3.25rem 0;
  }
  .pMajor__stickyItemColumn {
    font-size: 1.5rem;
  }
}



#kokuen {
  max-width: 1000px;
  margin: 20px auto 50px;
  padding: 20px;
  overflow-x: auto;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
}

#kokuen table {
  width: 100%;
  min-width: 880px;
  border-collapse: collapse;
  font-family: "Shippori Mincho", "Helvetica Neue", sans-serif;
  font-size: 1.4rem;
  color: #333;
}

#kokuen thead th {
  background-color: #d4e1ec;
  color: #000;
  text-align: center;
  padding: 1rem;
  border: 1px solid #999;
  font-weight: bold;
  font-size: 1.2rem;
}

#kokuen thead th span {
  display: block;
  font-size: 1rem;
  color: #333;
  font-weight: normal;
}

#kokuen tbody td {
  border: 1px solid #ccc;
  padding: 0.8rem 1rem;
  text-align: center;
  vertical-align: middle;
  background-color: #fdfdfd;
}

#kokuen tbody tr:nth-child(odd) td {
  background-color: #f3f8fc;
}

#kokuen tbody td:first-child {
  text-align: left;
  font-weight: bold;
}

#kokuen tbody td span {
  display: block;
  font-size: 1rem;
  color: #666;
}

#kokuen .filled {
  background-color: #cfe6f3;
}


/* スマホ対応：横スクロール */
@media screen and (max-width: 768px) {
  #kokuen {
    padding: 10px 10px 30px;
  }

  #kokuen table {
    font-size: 1.2rem;
  }
}



.electrode-dimensions {
  max-width: 1000px;
  margin: 0 auto;
  overflow-x: auto;
  padding: 1rem;
  background: #fdfdfd;
  font-family: "Shippori Mincho", "Helvetica Neue", sans-serif;
}

.electrode-dimensions table {
  width: 100%;
  border-collapse: collapse;
  min-width: 1200px;
  text-align: center;
  font-size: 1.4rem;
  border: 1px solid #ccc;
}

.electrode-dimensions th,
.electrode-dimensions td {
  border: 1px solid #ccc;
  padding: 0.6rem 0.8rem;
}

.electrode-dimensions thead th {
  background-color: #e4f0f9;
  font-weight: bold;
}

.electrode-dimensions tbody td {
  background-color: #fdfdfd;
}

.electrode-dimensions .unit {
  font-size: 1.2rem;
  margin-top: 1rem;
  text-align: right;
  color: #333;
}

/* 強調が必要な値に色付け（任意） */
.electrode-dimensions td[colspan] {
  background-color: #f5faff;
  color: #333;
}

.table-title {
  font-size: 2.2rem;
  font-weight: bold;
  margin-bottom: 0.2em;
  color: #1e537b;
}

.table-subtitle {
  font-size: 1.4rem;
  color: #555;
  margin-bottom: 1.5em;
}


/*お問合せ*/

.pContactSection {
  background-color: #fff;
  padding: 6rem 2rem;
}

.pContactSection__wrapper {
  max-width: 1200px;
  margin: 0 auto;
  padding-left: 1rem;
  padding-right: 1rem;
}

.pContactSection__layout {
  display: flex;
  align-items: flex-start;
  gap: 3rem;
  flex-wrap: wrap;
}

.pContactSection__headline {
  writing-mode: vertical-rl;
  text-orientation: upright;
  font-family:  "Shippori Mincho", serif;
  font-size: 3.5rem;
  color: var(--back-black);
  flex-shrink: 0;
}

.pContactSection__main {
  flex: 1;
  min-width: 0;
}

.pContactSection__text {
  font-size: 1.8rem;
  line-height: 1.8;
  margin-bottom: 3rem;
  text-align: left;
}

/* 2段目以降の段落に余白を追加 */
.pContactSection__text + .pContactSection__text {
  margin-top: 2rem;
}

.pContactSection__boxes {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
}

/* 全体リンクとしてのボックス */
.pContactBox {
  position: relative;
  flex: 1 1 300px;
  aspect-ratio: 4 / 3;
  border-radius: 12px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  color: #ffffff;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: opacity 0.3s ease;
}

.pContactBox:hover {
  opacity: 0.9;
}

/* オーバーレイ */
.pContactBox__overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(29, 79, 115, 0.85); /* #1d4f73 */
  z-index: 1;
}

.pContactBox__content {
  position: relative;
  z-index: 2;
}

.pContactBox__icon img {
  width: 150px;
  height: 150px;
  margin-bottom: 1rem;
}

.pContactBox__label {
  font-size: 1.8rem;
  color: #ffffff;
}

.pContactBox__value {
  font-size: 2.5rem;
  margin-top: 0.5rem;
  font-weight: bold;
  word-break: break-word;
}

.pContactBox__value a {
  color: #fff;
  font-weight: bold;
  text-decoration: underline;
}

/* 背景画像設定 */
.pContactBox--tel {
  background-image: url("../img/main/img01.jpg");
}

.pContactBox--mail {
  background-image: url("../img/main/img02.jpg");
}

/* 電話受付情報ボックス */
.pContactSection__infoBox {
  border: 1px solid #1d4f73;
  border-radius: 8px;
  padding: 1.5rem;
  margin-bottom: 3rem;
  background-color: #f9f9f9;
  color: #1d4f73;
  font-size: 1.6rem;
  text-align: center;
  max-width: 450px;
}

.pContactSection__infoBoxText {
  margin: 0;
  line-height: 1.6;
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
  .pContactSection__layout {
    flex-direction: column;
  }

  .pContactSection__headline {
    writing-mode: vertical-rl;
    text-orientation: upright;
    font-size: 2.4rem;
    margin: 0 auto 2rem;
    text-align: center;
  }

  .pContactSection__text {
    text-align: left;
	margin: 20px 0 10px 0;
  }

  .pContactSection__main {
    width: 100%;
  }

  .pContactSection__boxes {
    flex-direction: column;
    width: 100%;
  }

  .pContactBox {
    width: 100%;
    max-width: 100%;
    aspect-ratio: 4 / 3;
  }

  .pContactBox__icon img {
    width: 60px;
    height: 60px;
  }

  .pContactBox__label {
    font-size: 1.6rem;
  }

  .pContactBox__value {
    font-size: 1.4rem;
  }
}