/* Scss Document */
:root {
  --pc: 1000px;
  --sp: 999px;
  --fs48: 4.8rem;
  --fs40: 4rem;
  --fs36: 3.6rem;
  --fs28: 2.8rem;
  --fs22: 2.2rem;
  --fs20: 2.0rem;
  --fs18: 1.8rem;
  --fs16: 1.6rem;
  --fs14:1.4rem;
  --fs12:1.2rem; }

@media (max-width: 999px) {
  :root {
    --fs48: 2.6rem;
    --fs40: 2.2rem;
    --fs36: 2.4rem;
    --fs28: 2.2rem;
    --fs22: 2.0rem;
    --fs20: 1.8rem;
    --fs18: 1.4rem;
    --fs16: 1.4rem;
    --fs14: 1.2rem;
    --fs12: 1.0rem; } }
@media (max-width: 999px) {
  #company01 .ttlBox,
  #company05 .ttlBox,
  #company02 .ttlBox {
    margin-bottom: 3rem; } }
#company01 .deco,
#company05 .deco,
#company02 .deco {
  margin-bottom: 1rem;
  font-size: clamp(4.8rem, 4vw, 7rem);
  line-height: 1.5; }
  @media (max-width: 999px) {
    #company01 .deco,
    #company05 .deco,
    #company02 .deco {
      margin-bottom: 0;
      font-size: 4rem; } }
#company01 .ttl,
#company05 .ttl,
#company02 .ttl {
  position: relative;
  padding-bottom: 3rem;
  font-size: 2rem;
  font-weight: 700; }
  @media (max-width: 999px) {
    #company01 .ttl,
    #company05 .ttl,
    #company02 .ttl {
      padding-bottom: 2rem;
      font-size: 1.6rem; } }
  #company01 .ttl::after,
  #company05 .ttl::after,
  #company02 .ttl::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 12rem;
    height: 0.2rem;
    background: #d94722; }
    @media (max-width: 999px) {
      #company01 .ttl::after,
      #company05 .ttl::after,
      #company02 .ttl::after {
        width: 8rem; } }

#company03 .ttlBox,
#company04 .ttlBox {
  position: relative;
  padding-bottom: 3rem;
  text-align: center; }
  @media (max-width: 999px) {
    #company03 .ttlBox,
    #company04 .ttlBox {
      padding-bottom: 2rem; } }
  #company03 .ttlBox::after,
  #company04 .ttlBox::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 12rem;
    height: 0.2rem;
    background: #EB3300;
    transform: translateX(-50%); }
    @media (max-width: 999px) {
      #company03 .ttlBox::after,
      #company04 .ttlBox::after {
        width: 8rem; } }
#company03 .deco,
#company04 .deco {
  margin-bottom: 1rem;
  font-size: clamp(4.8rem, 4vw, 6rem);
  line-height: 1.5; }
  @media (max-width: 999px) {
    #company03 .deco,
    #company04 .deco {
      font-size: 4rem;
      margin-bottom: 0; } }
#company03 .ttl,
#company04 .ttl {
  font-size: 2rem;
  font-weight: 700; }
  @media (max-width: 999px) {
    #company03 .ttl,
    #company04 .ttl {
      font-size: 1.6rem; } }

/* 
---------------------------------------
company01
---------------------------------------
*/
#company01 .boxs {
  display: flex;
  gap: calc(53 / 1400 * 100%); }
  @media (max-width: 999px) {
    #company01 .boxs {
      flex-direction: column;
      gap: 3rem; } }
#company01 .box {
  width: calc(747 / 1400 * 100%); }
  @media (max-width: 999px) {
    #company01 .box {
      width: 100%; } }
#company01 .nameBox {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 3rem; }
  @media (max-width: 999px) {
    #company01 .nameBox {
      gap: 2rem; } }
#company01 .name {
  display: block;
  width: 23rem;
  height: auto; }
  @media (max-width: 999px) {
    #company01 .name {
      width: 12rem; } }
#company01 .pic {
  display: block;
  width: calc(600 / 1400 * 100%);
  height: auto;
  object-fit: cover; }
  @media (max-width: 999px) {
    #company01 .pic {
      width: 100%; } }

/* 
---------------------------------------
company02
---------------------------------------
*/
#company02 {
  position: relative;
  padding: clamp(10rem, 10vw, 18rem) 0;
  background: #f7f7f5 url("../img/company/02_bg.jpg") center center/cover no-repeat; }
  @media (max-width: 999px) {
    #company02 {
      padding: 6rem 0;
      background-position: 35% center; } }
  #company02 .boxs {
    position: relative;
    display: grid;
    grid-template-columns: 1fr calc(850 / 1400 * 100%);
    gap: 3rem; }
    @media (max-width: 999px) {
      #company02 .boxs {
        display: block; } }
  #company02 .philosophyBox {
    padding: 6rem 0;
    border-bottom: 0.1rem solid #ddd; }
    @media (max-width: 999px) {
      #company02 .philosophyBox {
        min-height: auto;
        padding: 3rem 0; } }
    #company02 .philosophyBox:first-child {
      padding-top: 0; }
  #company02 .label {
    margin-bottom: 1.5rem;
    color: #EB3300;
    font-size: 3.2rem;
    line-height: 1; }
    @media (max-width: 999px) {
      #company02 .label {
        margin-bottom: 1rem;
        font-size: 2.4rem; } }
  #company02 .sttl {
    font-size: clamp(2.8rem, 2.4vw, 4.2rem);
    line-height: 1.5;
    padding-left: 2rem; }
    @media (max-width: 999px) {
      #company02 .sttl {
        font-size: 2rem; } }

/* 
---------------------------------------
company03
---------------------------------------
*/
#company03 .overviewBox {
  border-top: 0.1rem solid #d9d9d9; }
  #company03 .overviewBox dl {
    display: grid;
    grid-template-columns: 21rem 1fr;
    align-items: center;
    min-height: 8.5rem;
    border-bottom: 0.1rem solid #d9d9d9; }
    @media (max-width: 999px) {
      #company03 .overviewBox dl {
        display: block;
        min-height: auto;
        padding: 1.5rem 0; } }
  #company03 .overviewBox dt {
    padding-right: 3rem;
    font-weight: 700; }
    @media (max-width: 999px) {
      #company03 .overviewBox dt {
        padding-right: 0; } }
  #company03 .overviewBox dd {
    min-width: 0;
    padding: 2rem 0; }
    @media (max-width: 999px) {
      #company03 .overviewBox dd {
        padding: 0; } }
  #company03 .overviewBox .location {
    align-items: start; }
    #company03 .overviewBox .location dt {
      padding-top: 3rem; }
      @media (max-width: 999px) {
        #company03 .overviewBox .location dt {
          padding-top: 0; } }
    #company03 .overviewBox .location dd {
      padding: 3rem 0; }
      @media (max-width: 999px) {
        #company03 .overviewBox .location dd {
          padding: 0; } }
#company03 .addressBox + .addressBox {
  margin-top: 3rem; }
  @media (max-width: 999px) {
    #company03 .addressBox + .addressBox {
      margin-top: 2rem; } }
#company03 .addressTtl {
  margin-bottom: 0.4rem; }

/* 
---------------------------------------
company04
---------------------------------------
*/
#company04 {
  padding: clamp(10rem, 9vw, 16rem) 0;
  background: url("../img/company/04_bg.jpg") center center/cover no-repeat; }
  @media (max-width: 999px) {
    #company04 {
      padding: 7rem 0; } }
  #company04 > .inner14 {
    width: calc(1400 / 1600 * 100%);
    max-width: 140rem;
    margin: 0 auto; }
    @media (max-width: 999px) {
      #company04 > .inner14 {
        width: calc(100% - 4rem); } }
  #company04 .lead {
    text-align: center;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.8; }
    @media (max-width: 999px) {
      #company04 .lead {
        font-size: 1.8rem; } }
  #company04 .areaBoxs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: calc(70 / 1400 * 100%); }
    @media (max-width: 999px) {
      #company04 .areaBoxs {
        grid-template-columns: 1fr;
        gap: 5rem; } }
  #company04 .areaBox {
    min-width: 0; }
  #company04 .areaHead {
    margin-bottom: 2rem; }
    @media (max-width: 999px) {
      #company04 .areaHead {
        margin-bottom: 1.5rem; } }
  #company04 .sttl {
    position: relative;
    margin-bottom: 1.5rem;
    padding-left: 2.8rem;
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 1.5; }
    @media (max-width: 999px) {
      #company04 .sttl {
        margin-bottom: 1rem;
        padding-left: 2.2rem;
        font-size: 1.8rem; } }
    #company04 .sttl::before {
      content: "";
      position: absolute;
      top: 50%;
      left: 0;
      width: 0.6rem;
      height: 2.8rem;
      background: #d94722;
      transform: translateY(-50%) skewX(-25deg); }
      @media (max-width: 999px) {
        #company04 .sttl::before {
          width: 0.5rem;
          height: 2.2rem; } }
  #company04 .address {
    line-height: 1.8; }
  #company04 .mapBox {
    position: relative;
    width: 100%;
    aspect-ratio: 600 / 370;
    overflow: hidden; }
    @media (max-width: 999px) {
      #company04 .mapBox {
        aspect-ratio: 335 / 240; } }
    #company04 .mapBox iframe {
      position: absolute;
      inset: 0;
      display: block;
      width: 100%;
      height: 100%; }

/* 
---------------------------------------
company05
---------------------------------------
*/
#company05 .boxs {
  display: grid;
  grid-template-columns: 1fr calc(960 / 1400 * 100%);
  gap: calc(90 / 1400 * 100%); }
  @media (max-width: 999px) {
    #company05 .boxs {
      display: block; } }
#company05 .historyBox {
  position: relative;
  padding: clamp(7rem, 7vw, 11rem) clamp(5rem, 6vw, 9rem);
  background: #F7F7F7;
  margin-top: 5rem; }
  @media (max-width: 999px) {
    #company05 .historyBox {
      padding: 2rem 2rem 1rem;
      margin-top: 0; } }
  #company05 .historyBox::before {
    content: "";
    position: absolute;
    top: clamp(3rem, 3vw, 6rem);
    bottom: clamp(3rem, 3vw, 6rem);
    left: 29%;
    width: 0.1rem;
    background: #d9d9d9; }
    @media (max-width: 999px) {
      #company05 .historyBox::before {
        top: 2.5rem;
        bottom: 3.5rem;
        left: 9rem; } }
  #company05 .historyBox dl {
    position: relative;
    display: grid;
    grid-template-columns: 29% 1fr;
    min-height: 9.5rem;
    align-items: center; }
    @media (max-width: 999px) {
      #company05 .historyBox dl {
        grid-template-columns: 8rem 1fr;
        min-height: 6rem;
        align-items: flex-start; } }
  #company05 .historyBox dt {
    padding-right: 5rem;
    font-size: 2.8rem;
    font-weight: 700;
    line-height: 1.5; }
    @media (max-width: 999px) {
      #company05 .historyBox dt {
        padding-right: 0;
        font-size: 1.6rem; } }
  #company05 .historyBox dd {
    min-width: 0;
    padding-left: 7rem;
    line-height: 1.8; }
    @media (max-width: 999px) {
      #company05 .historyBox dd {
        padding-left: 1rem;
        font-size: 1.3rem;
        line-height: 1.5; } }
#company05 .underline {
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 0.3rem; }