@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&family=Shippori+Mincho&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200");
:root {
  --hl: 8rem;
  --hm: 4rem;
  --hs: 2rem;
}

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-optical-sizing: auto;
  font-style: normal;
}
*:before, *:after {
  pointer-events: none;
  box-sizing: border-box;
  transition: 0.5s;
}

html {
  font-size: 62.5%;
}

body {
  color: #231815;
  font-size: 1.6rem;
  line-height: 1.8;
  position: relative;
  font-family: "EB Garamond", "Shippori Mincho", serif;
  font-weight: 400;
  font-style: normal;
  transition: unset;
  overflow-x: hidden;
  font-feature-settings: "palt";
  overflow-x: clip;
}

a {
  color: #003476;
  transition: 0.5s;
}
a:hover {
  color: #ff8000;
}
a.tel {
  pointer-events: none;
  text-decoration: none;
  color: #231815;
}
@media screen and (max-width: 768px) {
  a.tel {
    color: #770495;
    text-decoration: underline;
    pointer-events: all;
  }
  a.tel:hover {
    color: subcolor3(1);
  }
}

header {
  position: sticky;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10;
  background: white;
}

#header {
  text-align: center;
  position: relative;
}
#header h1 img {
  width: min(28%, 350px);
  vertical-align: middle;
}
@media screen and (max-width: 768px) {
  #header h1 img {
    width: 70%;
    max-width: 350px;
  }
}
#header #globalnav {
  position: relative;
  background: #f0f0f0;
  box-shadow: 0 3px 8px rgba(35, 24, 21, 0.3), 0 3px 8px rgba(35, 24, 21, 0.3);
  z-index: 1;
}
#header #globalnav > ul {
  display: grid;
  grid-template-columns: repeat(7, 1fr) 2fr;
}
@media screen and (max-width: 768px) {
  #header #globalnav > ul {
    grid-template-columns: 100%;
  }
}
#header #globalnav > ul li {
  list-style: none;
  padding: 0.5em 0;
  line-height: 1;
}
#header #globalnav > ul li a {
  font-size: 1.4rem;
  font-weight: bold;
  text-decoration: none;
  color: gray;
  display: block;
  padding: 0.5em 0;
}
#header #globalnav > ul li a:hover {
  color: #231815;
}
#header #globalnav > ul > li {
  position: relative;
}
#header #globalnav > ul > li > a {
  border-right: 1px solid #000;
  position: relative;
}
@media screen and (max-width: 768px) {
  #header #globalnav > ul > li > a {
    border-right: none;
    padding-bottom: 1em;
  }
}
#header #globalnav > ul > li > a::after {
  border-bottom: 3px solid #ff8000;
  width: 100%;
  height: 0;
  position: absolute;
  left: 0;
  bottom: -3px;
}
#header #globalnav > ul > li:first-child a {
  border-left: 1px solid #000;
}
@media screen and (max-width: 768px) {
  #header #globalnav > ul > li:first-child a {
    border-left: none;
  }
}
#header #globalnav > ul > li.contact a {
  border-right: none;
  background: #ff8000;
  color: white;
  margin-left: 10%;
}
#header #globalnav > ul > li.contact a:hover {
  background: #003476;
}
@media screen and (max-width: 768px) {
  #header #globalnav > ul > li.contact a {
    display: none;
  }
}
#header #globalnav > ul > li.nowpage a::after {
  content: "";
}
#header #globalnav > ul > li > ul {
  display: none;
  position: absolute;
  width: 15em;
  position: absolute;
  top: 100%;
  left: 50%;
  z-index: 3;
  background: rgba(255, 255, 255, 0.9);
  padding: 1em;
  transition: 0.3s;
  transform: translateX(-50%);
  box-shadow: 0 0 8px rgba(35, 24, 21, 0.3);
}
@media screen and (max-width: 768px) {
  #header #globalnav > ul > li > ul {
    padding: 0.5em;
    width: auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    position: relative;
    top: auto;
    left: auto;
    background: none;
    transform: translateX(0);
    box-shadow: none;
    border-top: 1px dotted rgba(35, 24, 21, 0.5);
    border-bottom: 1px solid rgba(35, 24, 21, 0.5);
  }
}
#header #globalnav > ul > li > ul li:not(:last-child) {
  border-bottom: 1px dotted #231815;
}
@media screen and (max-width: 768px) {
  #header #globalnav > ul > li > ul li:not(:last-child) {
    border-bottom: none;
  }
}
@media screen and (min-width: 769px) {
  #header #globalnav > ul > li:hover > ul {
    display: block;
  }
}
@media screen and (max-width: 768px) {
  #header #globalnav > ul > li:not(:has(ul)) {
    border-bottom: 1px solid rgba(35, 24, 21, 0.5);
  }
}
@media screen and (max-width: 768px) {
  #header #globalnav {
    width: 100%;
    height: calc(100vh - 6rem);
    position: fixed;
    top: 0;
    left: 0;
    overflow-y: scroll;
    background: white;
    box-shadow: none;
    display: none;
  }
}
@media screen and (max-width: 768px) {
  #header .spsitenav,
  #header .spcontactnav,
  #header .sptelnav {
    width: 33%;
    position: fixed;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 6rem;
    z-index: 10;
    text-decoration: none;
  }
  #header .spcontactnav span,
  #header .sptelnav span {
    font-size: 4rem;
    color: white;
  }
  #header .spsitenav {
    width: 34%;
    left: 0;
    background: #ff8000;
    cursor: pointer;
  }
  #header .spsitenav::before {
    font-family: "Material Symbols Outlined";
    content: "\e5d2";
    vertical-align: middle;
    font-size: 150%;
    font-weight: 200;
    transition: 0.3s;
    font-size: 4rem;
    color: white;
  }
  #header .spcontactnav {
    left: 34%;
    background: #003476;
  }
  #header .sptelnav {
    left: 67%;
    background: #231815;
  }
}
#header #spsitenav-check {
  display: none;
}
@media screen and (max-width: 768px) {
  #header #spsitenav-check:checked ~ #globalnav {
    display: block;
  }
  #header #spsitenav-check:checked ~ .spsitenav::before {
    content: "\e5cd";
    transform: rotate(360deg);
  }
}

main h3 {
  font-size: 2.4rem;
  font-weight: normal;
  letter-spacing: 0.1em;
  margin: 0.25em 0 0.75em;
}
@media screen and (max-width: 768px) {
  main h3 {
    font-size: 2rem;
    letter-spacing: 0;
  }
}
main h3 small {
  display: block;
  font-size: 1.4rem;
}
main h4 {
  font-size: 2rem;
  font-weight: normal;
  margin-bottom: 1em;
}
@media screen and (max-width: 768px) {
  main h4 {
    font-size: 1.8rem;
  }
}
main h5.linehead {
  position: relative;
  z-index: 1;
}
main h5.linehead span {
  display: inline-block;
  padding-right: 1em;
  background: white;
  font-size: 1.6rem;
}
main h5.linehead::after {
  content: "";
  width: 100%;
  height: 0;
  position: absolute;
  top: 50%;
  left: 0;
  border-bottom: 1px dotted #231815;
  z-index: -1;
}
main #pagetitle {
  position: relative;
}
main #pagetitle .english,
main #pagetitle picture {
  width: 100%;
  height: min(21.875vw, 420px);
}
main #pagetitle .english {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  font-size: 4rem;
  color: white;
  text-shadow: 0 0 8px rgba(35, 24, 21, 0.5);
}
main #pagetitle .english::before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  content: "";
  width: 25vw;
  height: min(10.9375vw, 210px);
  border-radius: 50%;
  background: #231815;
  filter: blur(2rem);
  mix-blend-mode: multiply;
  opacity: 0.3;
  z-index: -1;
}
main #pagetitle h2 {
  background: #ff8000;
  color: white;
  font-size: 2rem;
  padding: 1em 0;
  text-align: center;
  letter-spacing: 0.1em;
  box-shadow: 0 0 8px 8px rgba(128, 128, 128, 0.3);
}
main #breadcrumb {
  text-align: left;
}
main #breadcrumb ul {
  padding: 2rem 0 3rem;
  display: flex;
  flex-wrap: nowrap;
  justify-content: left;
  align-items: center;
}
main #breadcrumb ul li {
  color: rgba(35, 24, 21, 0.5);
  font-size: 1.2rem;
  list-style: none;
  line-height: 1;
}
main #breadcrumb ul li a {
  text-decoration: none;
  color: rgba(35, 24, 21, 0.5);
  display: flex;
  align-items: center;
}
main #breadcrumb ul li a:after {
  font-family: "Material Symbols Outlined";
  content: "\e5cc";
  vertical-align: middle;
  font-size: 150%;
  font-weight: 200;
  margin: 0 0.25em;
}
main #breadcrumb ul li a:hover {
  color: #003476;
}
@media screen and (max-width: 768px) {
  main #breadcrumb ul {
    padding: 1rem 0 2rem;
  }
}
main #pagecontent {
  margin-top: var(--hm);
}
main #pagecontent p + p {
  margin-top: var(--hs);
}
main #topmainimage #mainimage {
  display: flex;
  justify-content: center;
  align-items: center;
  aspect-ratio: 1920/810;
}
@media screen and (max-width: 768px) {
  main #topmainimage #mainimage {
    aspect-ratio: 1/1;
  }
}
main #topmainimage #mainimage .vegas-content-scrollable {
  height: auto;
}
main #topmainimage #mainimage .init {
  text-align: center;
  color: white;
}
main #topmainimage #mainimage .init .copy01 img {
  width: min(19.21875vw, 369px);
  margin-bottom: 8.3333333333vw;
}
@media screen and (max-width: 768px) {
  main #topmainimage #mainimage .init .copy01 img {
    width: 50%;
    margin-bottom: 4.1666666667vw;
  }
}
main #topmainimage #mainimage .init .copy02 img {
  width: min(47.2395833333vw, 907px);
  margin-bottom: 1.8229166667vw;
}
@media screen and (max-width: 768px) {
  main #topmainimage #mainimage .init .copy02 img {
    width: 80%;
  }
}
main #slidegroupnav {
  background: #ff8000;
  padding: 1.5rem 0 1rem;
  position: relative;
}
main #slidegroupnav::before {
  content: "グループ関連サイト";
  background: #ff8000;
  padding: 1rem 1rem 0.5rem;
  position: absolute;
  top: calc((1em + 1rem + 0.5rem) * -1);
  left: 1em;
  color: white;
  font-weight: 600;
}
@media screen and (max-width: 768px) {
  main #slidegroupnav::before {
    font-size: 1.4rem;
    left: 50%;
    transform: translateX(-50%);
  }
}
main #slidegroupnav .slick-slide {
  margin: 0 1rem;
}
main #slidegroupnav .slick-slide a {
  display: block;
  text-decoration: none;
  text-align: center;
}
main #slidegroupnav .slick-slide a picture {
  text-align: center;
  background: white;
  width: 186px;
  height: 60px;
}
main #slidegroupnav .slick-slide a span {
  margin-top: 0.5rem;
  font-size: 1.2rem;
  line-height: 1.25;
  color: white;
  height: 2em;
  display: flex;
  justify-content: center;
  align-items: center;
}
main #slidegroupnav .slick-slide a:hover {
  opacity: 0.5;
}
main #slidegroupnav + #households-rate {
  padding: 2rem 0 1rem;
  background: #003476;
}
main #slidegroupnav + #households-rate .households,
main #slidegroupnav + #households-rate .rate,
main #slidegroupnav + #households-rate .lastupdate {
  transform: translateY(0);
}
main #slidegroupnav + #households-rate .lastupdate {
  font-size: 1.4rem;
}
main #households-rate {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  background: #ff8000;
  text-align: center;
  box-shadow: 0 3px 8px rgba(35, 24, 21, 0.3);
  /*padding-bottom: 2.5rem;*/
}
main #households-rate .households,
main #households-rate .rate {
  line-height: 1;
  width: 48%;
  padding: 1.5rem 2rem;
  position: relative;
  transform: translateY(-50%);
  background: white;
}
main #households-rate .households::before,
main #households-rate .rate::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, rgba(205, 203, 203, 0) 90%, #cdcbcb 100%);
  mix-blend-mode: multiply;
}
main #households-rate .households dt,
main #households-rate .rate dt {
  position: absolute;
  font-size: 2.2rem;
  top: 1.5rem;
  left: 2rem;
}
main #households-rate .households dd,
main #households-rate .rate dd {
  text-align: center;
  font-size: 6rem;
  color: #003476;
}
main #households-rate .households dd span,
main #households-rate .rate dd span {
  font-size: 3rem;
  color: #231815;
}
main #households-rate .households dd small,
main #households-rate .rate dd small {
  position: absolute;
  display: inline-block;
  right: 2rem;
  bottom: 1.5rem;
  font-size: 1.2rem;
  text-align: right;
  color: #231815;
}
@media screen and (max-width: 768px) {
  main #households-rate .households,
  main #households-rate .rate {
    padding: 1rem;
  }
  main #households-rate .households dt,
  main #households-rate .rate dt {
    font-size: 1.4rem;
  }
  main #households-rate .households dd,
  main #households-rate .rate dd {
    font-size: 4rem;
    padding: 2.5rem 0;
  }
}
main #households-rate .lastupdate {
  transform: translateY(-3.5rem);
  color: white;
}
@media screen and (max-width: 768px) {
  main #households-rate .lastupdate {
    font-size: 1.4rem;
  }
}
main #topfootergroup {
  background: #f0f0f0;
  padding: var(--hm) 0;
}
main #topfootergroup .initbox {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1.5rem;
}
main #topfootergroup .initbox dl dt {
  text-align: center;
  font-size: 1.2rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(35, 24, 21, 0.5);
}
main #topfootergroup .initbox dl dt.kerning {
  letter-spacing: -0.2em;
}
main #topfootergroup .initbox dl dd {
  padding: 1rem 0;
  text-align: center;
}
main #topfootergroup .initbox dl dd img {
  width: 100%;
  max-width: 200px;
  margin: 0 auto;
  height: auto;
  aspect-ratio: 202/56;
}
@media screen and (max-width: 768px) {
  main #topfootergroup .initbox {
    grid-template-columns: repeat(2, 1fr);
  }
  main #topfootergroup .initbox dl dt {
    font-size: 1rem;
  }
}
main .tabset > nav {
  display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
}
main .tabset > nav a {
  display: block;
  text-decoration: none;
  color: white;
}
main .viewmore a {
  display: inline-block;
  padding: 0.5em 3em;
  text-decoration: none;
  position: relative;
  border: 1px solid #231815;
  color: #231815;
}
main .viewmore a::before, main .viewmore a::after {
  content: "";
  height: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
main .viewmore a::before {
  width: 3em;
  border-bottom: 1px solid #231815;
  right: -1.5em;
}
main .viewmore a::after {
  width: 0;
  border: 0.5rem solid transparent;
  border-left-color: #231815;
  right: calc(-1.5em - 0.5rem);
}
main .viewmore a:hover {
  color: #003476;
  border-color: #003476;
}
main .viewmore a:hover::before {
  border-bottom-color: #003476;
  right: -2em;
}
main .viewmore a:hover::after {
  border-left-color: #003476;
  right: calc(-2em - 0.5rem);
}
main .viewmore.white a {
  border-color: white;
  color: white;
}
main .viewmore.white a::before {
  border-bottom-color: white;
}
main .viewmore.white a::after {
  border-left-color: white;
}
main .viewmore.white a:hover {
  mix-blend-mode: color-dodge;
  /*
  color: white(0.5);
  border-color: white(0.5);
  &::before {
  	border-bottom-color: white(0.5);
  }
  &::after {
  	border-left-color: white(0.5);
  }
  */
}
main .btnbox {
  margin: var(--hl) 0;
  display: flex;
  justify-content: center;
}
main .btnbox a {
  display: block;
  width: 38%;
  margin: 0 1.5rem;
  color: white;
  background: #003476;
  position: relative;
  text-align: center;
  text-decoration: none;
  padding: 0.5em 0;
  font-size: 2rem;
}
main .btnbox a::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, rgba(205, 203, 203, 0) 90%, #cdcbcb 100%);
  mix-blend-mode: multiply;
}
main .btnbox a:hover {
  background: #00973b !important;
}
main .btnbox a.conversion {
  background: #ff8000;
}
main .btnbox a.customercontact {
  background: #770495;
}
main .btnbox a.goback {
  background: gray;
}
@media screen and (max-width: 768px) {
  main .btnbox {
    margin: var(--hm) 0;
    flex-wrap: wrap;
  }
  main .btnbox a {
    width: 68%;
  }
  main .btnbox a:not(:last-child) {
    margin-bottom: 1rem;
  }
}
main .newslist {
  /*
  transform: translateY(calc(((((1.5rem * 2) + 6rem)) / 2) * -1) + 1rem);
  */
  margin-bottom: var(--hl);
}
@media screen and (max-width: 768px) {
  main .newslist {
    margin-bottom: calc(var(--hl) / 2);
  }
}
main .newslist li {
  list-style: none;
}
main .newslist li a {
  color: #231815;
  display: flex;
  flex-wrap: nowrap;
  border-bottom: 1px dotted rgba(35, 24, 21, 0.3);
  text-decoration: none;
  letter-spacing: 0.1em;
}
main .newslist li a .date {
  width: 7em;
}
main .newslist li a:hover {
  color: #003476;
}
@media screen and (max-width: 768px) {
  main .newslist li a {
    flex-wrap: wrap;
  }
  main .newslist li a .date {
    width: 100%;
    margin-bottom: 0.5rem;
    font-size: 1.2rem;
  }
}
main .newslist li + li {
  margin-top: 1rem;
}
main #topnews .tabset {
  margin-bottom: var(--hl);
}
main #topnews .tabset > nav {
  /* transform: translateY(calc(((((1.5rem * 2) + 6rem)) / 2) * -1) - 1rem); */
}
main #topnews .tabset > nav a {
  width: 50%;
  /*
  padding: 0.5em 0 2em;
  font-weight: bold;
  */
  padding: 0.5em 0;
  margin-bottom: 2em;
  font-size: 2rem;
  text-align: center;
  color: #231815;
  border-bottom: 1px solid rgba(35, 24, 21, 0.3);
}
@media screen and (max-width: 768px) {
  main #topnews .tabset > nav a {
    font-size: 1.4rem;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.2;
  }
}
main #topnews .tabset > nav a:hover {
  /*background: white(0.5);*/
  background: #f0f0f0;
}
main #topnews .tabset > nav a.isactive {
  color: black;
  background: white;
  pointer-events: none;
  font-weight: normal;
  border: 1px solid rgba(35, 24, 21, 0.3);
  border-bottom: none;
}
main #topnews .tabset .tablist {
  padding-top: var(--hm);
}
main #topnews .tabset .tablist .viewmore {
  text-align: center;
}
main #bannerbox {
  margin-bottom: var(--hl);
}
main #bannerbox .grid.g3 a {
  display: flex;
  justify-content: center;
  align-items: center;
  aspect-ratio: 800/543;
  color: white;
  position: relative;
  text-decoration: none;
  text-align: center;
}
main #bannerbox .grid.g3 a dt {
  font-size: 2.8rem;
  margin-bottom: 0.75em;
}
@media only screen and (min-width: 769px) and (max-width: 960px) {
  main #bannerbox .grid.g3 a dt {
    font-size: 2.4rem;
    margin-bottom: 0.5em;
  }
}
@media only screen and (min-width: 769px) and (max-width: 960px) {
  main #bannerbox .grid.g3 a dd {
    font-size: 1.4rem;
    padding-bottom: 2em;
    line-height: 1.5;
  }
}
main #bannerbox .grid.g3 a picture {
  overflow: hidden;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -1;
}
main #bannerbox .grid.g3 a picture img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 50% 50%;
     object-position: 50% 50%;
  width: 100%;
  height: 100%;
  max-width: none;
  transition: 0.5s;
}
main #bannerbox .grid.g3 a::before {
  font-family: "Material Symbols Outlined";
  content: "\e5df";
  vertical-align: middle;
  font-size: 150%;
  font-weight: 200;
  position: absolute;
  left: calc(50% + 0.5em);
  bottom: clamp(2.2rem, 2.3vw, 3.2rem);
  font-size: 230%;
  line-height: 1;
  z-index: 1;
}
main #bannerbox .grid.g3 a::after {
  content: "CLICK";
  position: absolute;
  left: 0;
  bottom: clamp(3rem, 3vw, 4rem);
  padding: 0.25em;
  line-height: 1;
  width: 100%;
  text-align: center;
  background: rgba(35, 24, 21, 0.5);
}
main #bannerbox .grid.g3 a:hover picture img {
  transform: scale(1.1);
}
main #bannerbox .grid.g3 a:hover::before {
  margin-left: 0.4rem;
}
main #bannerbox .grid.g3 a:hover::after {
  letter-spacing: 0.25em;
}
@media screen and (max-width: 768px) {
  main #bannerbox .grid.g3 {
    grid-template-columns: 100%;
  }
  main #bannerbox .grid.g3 a {
    aspect-ratio: 800/450;
  }
  main #bannerbox .grid.g3 a dt {
    font-size: 2rem;
    margin-bottom: 0.5em;
  }
  main #bannerbox .grid.g3 a dd {
    font-size: 1.4rem;
    padding-bottom: 2em;
    line-height: 1.5;
  }
}
main #topcompany,
main #toprecruit {
  display: flex;
  flex-wrap: nowrap;
}
main #topcompany .text,
main #toprecruit .text {
  width: 50%;
  box-shadow: inset 0 3px 8px rgba(35, 24, 21, 0.3);
  padding: 1em 2.5vw;
  display: flex;
  align-items: center;
}
main #topcompany .text h3,
main #toprecruit .text h3 {
  font-weight: normal;
  letter-spacing: 0.2em;
}
main #topcompany .text h3::before,
main #toprecruit .text h3::before {
  content: "[";
  margin-right: 0.1em;
}
main #topcompany .text h3::after,
main #toprecruit .text h3::after {
  content: "]";
  margin-left: 0.1em;
}
main #topcompany .text h4,
main #toprecruit .text h4 {
  font-size: 2.8rem;
  letter-spacing: 0.1em;
  font-weight: normal;
}
main #topcompany .text p,
main #toprecruit .text p {
  font-size: 1.4rem;
}
main #topcompany .text .viewmore,
main #toprecruit .text .viewmore {
  font-size: 1.4rem;
}
@media screen and (min-width: 1316.7894736842px) {
  main #topcompany .text,
  main #toprecruit .text {
    padding: 0 calc((100% - 1250px) / 2);
  }
}
@media screen and (max-width: 768px) {
  main #topcompany .text,
  main #toprecruit .text {
    padding: 2em;
    box-shadow: none;
  }
  main #topcompany .text h3,
  main #topcompany .text h4,
  main #toprecruit .text h3,
  main #toprecruit .text h4 {
    font-size: 2rem;
  }
  main #topcompany .text .viewmore,
  main #toprecruit .text .viewmore {
    text-align: center;
  }
}
main #topcompany picture,
main #toprecruit picture {
  width: 50%;
  overflow: hidden;
  box-shadow: inset 0 3px 8px rgba(35, 24, 21, 0.3);
}
main #topcompany picture img,
main #toprecruit picture img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 50% 50%;
     object-position: 50% 50%;
  width: 100%;
  height: 100%;
  max-width: none;
}
@media screen and (max-width: 768px) {
  main #topcompany,
  main #toprecruit {
    flex-wrap: wrap;
  }
  main #topcompany .text,
  main #toprecruit .text {
    width: 100%;
  }
  main #topcompany picture,
  main #toprecruit picture {
    width: 100%;
    margin: 0.5rem;
  }
}
main #topcompany .text {
  order: 1;
  background: #ff8000;
  color: white;
  padding-right: 3rem;
}
@media screen and (max-width: 768px) {
  main #topcompany .text {
    order: 2;
    background: none;
    color: #231815;
  }
  main #topcompany .text .viewmore.white a {
    color: #231815;
    border-color: #231815;
  }
  main #topcompany .text .viewmore.white a::before {
    border-bottom-color: #231815;
  }
  main #topcompany .text .viewmore.white a::after {
    border-left-color: #231815;
  }
}
main #topcompany picture {
  order: 2;
}
@media screen and (max-width: 768px) {
  main #topcompany picture {
    order: 1;
  }
}
main #toprecruit .text {
  padding-left: 3rem;
}
main #sitemap nav > ul {
  position: relative;
}
main #sitemap nav > ul:not(:last-child)::before {
  content: "";
  display: block;
  width: 0;
  height: 100%;
  border-left: 1px solid gray;
  position: absolute;
  top: 0;
  left: -1.5em;
}
main #sitemap nav ul {
  margin-left: 2.5em;
}
main #sitemap nav ul li {
  list-style: none;
  position: relative;
  line-height: 2;
}
main #sitemap nav ul li::before {
  content: "";
  width: 1em;
  height: 100%;
  border-left: 1px solid gray;
  position: absolute;
  top: 0;
  left: -1.5em;
}
main #sitemap nav ul li:last-child::before {
  height: 1em;
  border-bottom: 1px solid gray;
}
main #footercontent .outerlink .bannerbtn {
  margin: 0 1rem;
}
main #footercontent .outerlink .bannerbtn a {
  display: flex;
  align-items: center;
  border: 1px solid #003476;
  outline-offset: -1px;
  background: white;
  text-decoration: none;
}
main #footercontent .outerlink .bannerbtn a > span {
  width: 100%;
  text-align: center;
}
main #footercontent .outerlink .bannerbtn a > span small {
  font-size: 1.2rem;
  color: #231815;
}
main #footercontent .outerlink .bannerbtn a > span strong {
  color: white;
  /*
  background: subcolor1(1);
  padding: 0.1em 0;
  */
  padding: 0.5em;
  background: linear-gradient(rgba(0, 52, 118, 0), #003476 25%, #003476 75%, rgba(0, 52, 118, 0) 100%);
  display: block;
  transition: 0.5s;
}
main #footercontent .outerlink .bannerbtn a > span picture {
  text-align: center;
  padding: 1em 0;
  transition: 0.5s;
}
main #footercontent .outerlink .bannerbtn a > span picture img {
  height: 30px;
  margin: 0 auto;
  transition: 0.3s;
}
main #footercontent .outerlink .bannerbtn a:hover {
  border-color: #ff8000;
}
main #footercontent .outerlink .bannerbtn a:hover strong {
  /*background: maincolor(1);*/
  background: linear-gradient(rgba(255, 128, 0, 0), #ff8000 25%, #ff8000 75%, rgba(255, 128, 0, 0) 100%);
}
main #footercontent .outerlink .bannerbtn a:hover picture img {
  transform: scale(1.1);
}

#footer {
  margin-top: var(--hl);
  box-shadow: inset 0 3px 8px rgba(35, 24, 21, 0.3);
  background: #ff8000;
  color: white;
  padding: var(--hm) 0 2rem;
}
#footer #pagetop {
  opacity: 0;
  pointer-events: none;
}
#footer #pagetop.isactive {
  opacity: 1;
  pointer-events: all;
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  z-index: 2;
}
#footer #pagetop.isactive a {
  background: #ff8000;
  color: white;
  transform: rotate(-90deg);
  text-decoration: none;
  display: inline-block;
  padding: 0.5em 1em;
  letter-spacing: 0.05em;
  font-size: 1.4rem;
  transform-origin: right bottom;
}
#footer #pagetop.isactive a:after {
  font-family: "Material Symbols Outlined";
  content: "\e5cc";
  vertical-align: middle;
  font-size: 150%;
  font-weight: 200;
}
#footer #pagetop.isactive a:hover {
  background: #003476;
}
@media screen and (max-width: 768px) {
  #footer #pagetop.isactive {
    top: 50%;
    bottom: auto;
  }
}
#footer #footerfixedbtn {
  display: inline-block;
  position: fixed;
  bottom: 1em;
  right: 0;
  z-index: 9;
}
#footer #footerfixedbtn a {
  position: relative;
  display: block;
  background: white;
  box-shadow: 0 0 8px rgba(35, 24, 21, 0.3);
}
#footer #footerfixedbtn a img {
  height: 8rem;
}
@media screen and (max-width: 768px) {
  #footer #footerfixedbtn {
    bottom: calc(6rem + 0.5em);
  }
  #footer #footerfixedbtn a img {
    height: 6rem;
  }
}
#footer li {
  list-style: none;
}
#footer a {
  text-decoration: none;
  color: white;
}
#footer a.tel {
  color: white;
}
#footer a:hover {
  color: #003476;
}
#footer .flex .company {
  flex: 1;
}
#footer .flex .company dl {
  margin-bottom: 1rem;
}
#footer .flex .company dl dd {
  font-size: 1.4rem;
}
#footer .flex .sitemap #footernav {
  display: inline-block;
}
#footer .flex .sitemap #footernav > ul {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1rem 3rem;
}
@media screen and (max-width: 768px) {
  #footer .flex .sitemap #footernav > ul {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem 1rem;
  }
}
#footer .flex .sitemap #footernav > ul > li > a {
  font-size: 1.4rem;
}
#footer .flex .sitemap #footernav > ul > li > a::before {
  content: "[";
  margin-right: 0.1em;
  transition: 0s;
}
#footer .flex .sitemap #footernav > ul > li > a::after {
  content: "]";
  margin-left: 0.1em;
  transition: 0s;
}
#footer .flex .sitemap #footernav > ul > li > ul {
  margin-bottom: 1em;
}
#footer .flex .sitemap #footernav > ul > li > ul li {
  font-size: 1.3rem;
}
#footer .flex .copyright {
  margin-top: 1.2em;
  display: block;
  text-align: center;
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  font-size: 1rem;
}
@media screen and (max-width: 768px) {
  #footer {
    padding-bottom: 7rem;
  }
  #footer .flex .company,
  #footer .flex .sitemap {
    width: 100%;
  }
  #footer .flex .sitemap #footernav {
    width: 100%;
  }
}

body.home #footer {
  margin-top: 0;
}
body.home .appbox a {
  display: block;
  padding: 1.5em;
  text-decoration: none;
  border: 1px solid rgba(35, 24, 21, 0.3);
  text-align: center;
}
body.home .appbox a img {
  width: 350px;
  margin: 0 auto;
}
body.home .appbox a p {
  font-size: 1.4rem;
  text-align: left;
  line-height: 1.5;
  color: #231815;
}
body.home .appbox a:hover {
  border-color: #ff8000;
  box-shadow: 0 0 8px rgba(35, 24, 21, 0.3);
}

.slick-prev:before {
  font-family: "Material Symbols Outlined";
  content: "\f43a";
  vertical-align: middle;
  font-size: 150%;
  font-weight: 200;
  font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
}

.slick-next:before {
  font-family: "Material Symbols Outlined";
  content: "\e037";
  vertical-align: middle;
  font-size: 150%;
  font-weight: 200;
  font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
}

.slick-prev:before,
.slick-next:before {
  color: #231815;
  line-height: 1;
  font-size: 2rem;
}

#pagecontent .faxbox {
  margin: 0.5em 0;
  font-size: 5rem;
  line-height: 1;
}
#pagecontent .faxbox::before {
  content: "FAX";
  font-size: 1.6rem;
  color: white;
  background: #231815;
  padding: 0 0.5em;
  margin-right: 0.5em;
}
#pagecontent .realnetprobannerbox a {
  display: inline-block;
}
#pagecontent .realnetprobannerbox a picture img {
  max-width: 500px;
}
@media screen and (max-width: 768px) {
  #pagecontent .realnetprobannerbox a picture img {
    max-width: 220px;
  }
}
#pagecontent .realnetprobannerbox a:hover {
  opacity: 0.5;
}
#pagecontent .guidelinelist li + li {
  margin-top: var(--hm);
  border-top: 1px dotted #231815;
  padding-top: var(--hm);
}

.scrollin.nonactive {
  opacity: 0;
}
.scrollin.isactive:not(.leftin) {
  animation: fadeIn 1s ease 0s 1 normal backwards;
}
.scrollin.isactive.leftin {
  animation: fadeInLeft 1s ease 0s 1 normal backwards;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(-2rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translateX(-2rem);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
.wp-block-group.overcontent {
  width: 100vw;
  margin-left: -2.5vw;
}
@media screen and (min-width: 1316.7894736842px) {
  .wp-block-group.overcontent {
    margin-left: calc((100vw - 1250px) / -2);
  }
}
@media screen and (max-width: 768px) {
  .wp-block-group.overcontent {
    margin-left: -5vw;
  }
}
.wp-block-group.overcontent.bgcolor1 {
  background: #f0f0f0;
  padding: var(--hm) 0;
}
.wp-block-group.overcontent.bgcolor1 h5.linehead span {
  background: #f0f0f0;
}
.wp-block-group.casebox > .wp-block-group__inner-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}
@media screen and (max-width: 768px) {
  .wp-block-group.casebox > .wp-block-group__inner-container {
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }
}
.wp-block-group.casebox > .wp-block-group__inner-container dl {
  position: relative;
}
.wp-block-group.casebox > .wp-block-group__inner-container dl dt {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  background-color: rgba(35, 24, 21, 0.7);
  color: white;
  font-size: 1.4rem;
  padding: 0.5rem 1rem;
  z-index: 2;
}
@media screen and (max-width: 768px) {
  .wp-block-group.casebox > .wp-block-group__inner-container dl dt {
    font-size: 1.2rem;
  }
}
.wp-block-group.casebox > .wp-block-group__inner-container dl dd {
  cursor: pointer;
}
.wp-block-group.casebox > .wp-block-group__inner-container dl dd picture {
  aspect-ratio: 1/1;
  overflow: hidden;
}
.wp-block-group.casebox > .wp-block-group__inner-container dl dd picture img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 50% 50%;
     object-position: 50% 50%;
  max-width: none;
  width: 100%;
  height: 100%;
  transition: 0.5s;
}
.wp-block-group.casebox > .wp-block-group__inner-container dl dd:hover picture img {
  transform: scale(1.2);
}
@media screen and (max-width: 768px) {
  .wp-block-group.stafflist {
    margin-right: 1em;
    margin-left: 1em;
  }
}
.wp-block-group.stafflist > .wp-block-group__inner-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3rem;
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl {
  position: relative;
  z-index: 1;
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl::before {
  content: "";
  width: 30%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background-repeat: no-repeat;
  background-position: 0 50%;
  background-size: contain;
  z-index: -1;
}
@media screen and (max-width: 768px) {
  .wp-block-group.stafflist > .wp-block-group__inner-container dl::before {
    max-width: 120px;
  }
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl dt {
  text-align: right;
  margin-bottom: 5rem;
  position: relative;
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl dt::after {
  content: "";
  width: 100%;
  height: 0;
  border-bottom: 1px solid rgba(35, 24, 21, 0.3);
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -2;
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl dd {
  margin-left: 50%;
  border-bottom: 1px dotted #231815;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  flex-wrap: nowrap;
  text-align: right;
  line-height: 1;
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl dd p {
  margin-top: 0.8rem;
  padding-bottom: 0.5rem;
}
@media screen and (max-width: 768px) {
  .wp-block-group.stafflist > .wp-block-group__inner-container dl dd p {
    font-size: 1.4rem;
  }
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl dd::before {
  font-size: 1.2rem;
  width: 5em;
  padding-bottom: 0.5rem;
  text-align: left;
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl dd.age::before {
  content: "年齢";
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl dd.from::before {
  content: "出身地";
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl dd.experience::before {
  content: "不動産歴";
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl dd.hobby::before {
  content: "趣味";
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl dd.message {
  margin-top: auto;
  display: block;
  border: 1px solid rgba(35, 24, 21, 0.3);
  background: rgba(255, 255, 255, 0.7);
  padding: 1em;
  border-radius: 8px;
  margin: 1em 0 0;
  line-height: 1.5;
  text-align: left;
  position: relative;
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl dd.message::before {
  content: none;
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl.men01::before {
  top: -1em;
  width: 40%;
  aspect-ratio: 241/604;
  background-image: url(../img/staff/men01.png);
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl.women01::before {
  left: 5%;
  aspect-ratio: 179/573;
  background-image: url(../img/staff/women01.png);
  left: 5%;
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl.men02::before {
  left: 5%;
  aspect-ratio: 200/612;
  background-image: url(../img/staff/men02.png);
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl.women02::before {
  width: 40%;
  aspect-ratio: 245/565;
  background-image: url(../img/staff/women02.png);
}
.wp-block-group.stafflist > .wp-block-group__inner-container dl.men03::before {
  left: 5%;
  width: 35%;
  aspect-ratio: 215/595;
  background-image: url(../img/staff/men03.png);
}
@media only screen and (min-width: 769px) and (max-width: 960px) {
  .wp-block-group.stafflist > .wp-block-group__inner-container {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 768px) {
  .wp-block-group.stafflist > .wp-block-group__inner-container {
    grid-template-columns: repeat(1, 1fr);
  }
}

#casemodalbox {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(35, 24, 21, 0.7);
  cursor: pointer;
}
#casemodalbox .modal-inner {
  position: relative;
}
#casemodalbox .modal-inner #prevCase,
#casemodalbox .modal-inner #nextCase {
  background: none;
  border: none;
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#casemodalbox .modal-inner #prevCase span,
#casemodalbox .modal-inner #nextCase span {
  font-size: min(5vw, 5rem);
  color: white;
  transition: 0.5s;
}
@media screen and (max-width: 768px) {
  #casemodalbox .modal-inner #prevCase span,
  #casemodalbox .modal-inner #nextCase span {
    font-size: 4rem;
  }
}
#casemodalbox .modal-inner #prevCase {
  left: max(-6vw, -60px);
}
#casemodalbox .modal-inner #prevCase span {
  transform: rotate(180deg);
}
#casemodalbox .modal-inner #prevCase:hover span {
  transform: translateX(-5px) rotate(180deg);
}
#casemodalbox .modal-inner #nextCase {
  right: max(-6vw, -60px);
}
#casemodalbox .modal-inner #nextCase:hover span {
  transform: translateX(5px);
}
#casemodalbox .modal-inner #modalImage {
  box-shadow: 0 0 8px rgba(35, 24, 21, 0.5);
  max-width: 80vw;
  max-height: 80vh;
}
#casemodalbox::before {
  font-family: "Material Symbols Outlined";
  content: "\e5c9";
  vertical-align: middle;
  font-size: 150%;
  font-weight: 200;
  font-size: min(5vw, 5rem);
  color: white;
  position: fixed;
  top: 5vw;
  right: 5vw;
}
@media screen and (max-width: 768px) {
  #casemodalbox::before {
    font-size: 4rem;
  }
}/*# sourceMappingURL=style.css.map */