@charset "UTF-8";
@keyframes loop {
    0% {
        transform: translateX(100%);
    }
    to {
        transform: translateX(-100%);
    }
  }
  @keyframes loop2 {
    0% {
        transform: translateX(0);
    }
    to {
        transform: translateX(-200%);
    }
  }
 
/* ========================================
  @media screen and (min-width: 768px), print
======================================== */
@media screen and (min-width: 768px),print {
/* mv
-------------------------------------*/
#mv {
    background: url(../images/company/mv-bg.jpg)no-repeat;
    background-size: cover;
    padding-block: 82px 120px;
    margin-bottom: 356px;
    position: relative;
    margin-top: 60px;
}
#mv .ttl-frame {
    background: url(../images/index/intro-ttl-bg.png)no-repeat center;
    background-size: contain;
    margin-bottom: -318px;
    display: flex;
    justify-content: center;
    padding: 42px 0 409px;
 }
#mv .ttl {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: 0.2em;
    writing-mode: vertical-rl;
    text-orientation: upright;
    display: flex;
    justify-content: center;
}
#mv .subt {
    text-align: center;
    font-size: 32px;
    font-weight: 400;
    line-height: 1.75; 
    letter-spacing: 0.1em;
    margin-bottom: 64px;
}
#mv .txt {
    text-align: center;
    font-size: 20px;
    line-height: 2.3;
    letter-spacing: 0.05em;
    margin-bottom: 144px;
}
#mv .bg-slide {
   position: absolute;
}
#mv .bg-slide .loop {
   overflow: hidden;
}
#mv .bg-slide .loop .loop__box {
   display: flex;
   width: 100vw;
}
#mv .bg-slide .loop .loop__box img {
   height: 12.5vw;
}
#mv .bg-slide .loop .loop__box img:first-child {
   -webkit-animation: loop 50s -25s linear infinite;
   animation: loop 50s -25s linear infinite;
}
#mv .bg-slide .loop .loop__box img:last-child {
   -webkit-animation: loop2 50s linear infinite;
   animation: loop2 50s linear infinite;
}

/* customer
-------------------------------------*/
#customer {
    padding-block: 140px;
}
#customer .inner {
    background: #FFF;
    width: min(95%, 1200px);
    margin-inline: auto;
    position: relative;
    padding-block: 80px;
}
#customer .icon {
    position: absolute;
    top: -44px;
    left: 50%;
    transform: translateX(-50%);
}
#customer .ttl {
    color: #000;
    text-align: center;
    font-size: 24px;
    letter-spacing: 0.1em;
    margin-bottom: 40px;
}
#customer .lead {
    color: #000;
    text-align: center;
    font-size: 16px;
    line-height: 2; 
    margin-bottom: 40px;
}
#customer .inBox {
    width: min(95%, 989px);
    margin-inline: auto;
    display: grid;
    grid-template-columns: 40.44% 53.3%;
    gap: 60px;
    align-items: center;
}
#customer .inBox .photo img {
    width: 100%;
    height: auto;
}
#customer .txt {
    color: #000;
    font-size: 16px;
    line-height: 2;
    letter-spacing: 0;
}

/* person
-------------------------------------*/
#customer.person {
    background: #F3F4F5;
}
#customer.person .store {
    display: flex;
    flex-wrap: wrap;
    gap: 0 36px;
    background: #F3F4F5;
    width: min(95%, 989px);
    margin-inline: auto;
    padding-block: 40px;
    padding-inline: 213px;
    margin-bottom: 60px;
}
#customer.person .store li {
    color: #000;
    font-size: 18px;
    line-height: 2.5556; 
}

/* corporation
-------------------------------------*/
#customer.corporation {
    background: #E3E3E3;
}
#customer.corporation .inner::before {
    position: absolute;
    content: "";
    background: url(../images/company/corporation-illust.png)no-repeat;
    background-size: contain;
    width: 184px;
    height: 179px;
    bottom: -16px;
    right: 77px;
}
#customer.corporation .lead {
    margin-bottom: 60px;
}

/* company
-------------------------------------*/
.company .inner {
    width: min(95%, 1000px);
    margin-inline: auto;
    display: grid;
    grid-template-columns: 1fr 76.3%;
    padding-block: 342px 240px;
}
.company .ttl-box {
    display: flex;
    gap: 13px;
    margin-left: -10px;
    padding-top: 5px;
}
.company .enttl {
    font-size: 14px;
    writing-mode: vertical-rl;
    order: 1;
}
.company .ttl {
    font-size: 24px;
    line-height: 1.75;
    letter-spacing: 0.1em;
    writing-mode: vertical-rl;
    text-orientation: upright;
}
.company table {
    border-top: 0.5px solid #1a1a1a;
}
.company tr {
    border-bottom: 0.5px solid #1a1a1a;
    display: grid;
    grid-template-columns: 39% 1fr;
}
.company th,
.company td {
    color: #000;
    font-size: 16px;
    font-weight: 400;
    line-height: 2;
    letter-spacing: 0.1em;
    padding-block: 33px 34px;
    text-align: left;
}
.company th {padding-left: 87px;font-weight: 600;}
.company td {
    padding-right: 80px;
}

/* information
-------------------------------------*/
#information {
   width: min(95%, 1000px);
   margin-inline: auto;
   padding-block: 0 99px;
}
#information .enttl {
   text-align: center;
   font-size: 14px;
   margin-bottom: 5px;
}
#information .ttl {
   text-align: center;
   font-size: 24px;
   letter-spacing: 0.1em;
   margin-bottom: 77px;
}
#information .list {
   display: grid;
   gap: 80px;
   margin-bottom: 140px;
}
#information .list li {
   display: grid;
   grid-template-columns: 54% 40.4%;
   gap: 40px;
}
#information .list li .wrap {
   display: contents;
}
#information .list li .photo img {
   width: 100%;
   height: auto;
}
#information .list li .information-name {
   font-size: 24px;
   font-weight: 500;
   margin-bottom: 37px;
}
#information .list li .address {
   font-size: 18px;
   line-height: 1.55556; 
   margin-bottom: 24px;
}
#information .list li .info-box {
   display: grid;
   gap: 16px;
   margin-bottom: 40px;
}
#information .list li .info-box li {
   display: grid;
   grid-template-columns: 100px 1fr;
   gap: 16px;
   margin-bottom: 16px;
}
#information .list li .info-box h4 {
   font-size: 16px;
   line-height: 1.5;
   letter-spacing: 0.02em;
   border: 0.5px solid #1A1A1A;
   background: #FFF;
   height: 30px;
   text-align: center;
   display: grid;
   place-content: center;
}
#information .list li .info-box p {
   font-size: 16px;
   line-height: 1.75;
}
#information .list li .info-box .small {
   font-size: 13px;
   line-height: 1.84615;
   display: block;
   padding-top: 2px;
}
#information .list li .btn a {
   text-align: center;
   font-size: 16px;
   letter-spacing: 0.05em;
   padding-block: 16px;
   border: 0.5px solid #1A1A1A;
   display: flex;
   justify-content: center;
   gap: 9px;
}
#information .list li .btn a .icon img {
   vertical-align: sub;
}

#information .txt-box .timetxt{
margin:70px 0 0 0;
font-size: 16px; line-height: 1.8; letter-spacing: 1px; 
}
#information .list li .btn02 a {
   text-align: center;
   font-size: 14px;
   letter-spacing: 0.05em;
   padding-block: 16px;
   border-bottom: 0.5px solid #1A1A1A;
   display: flex;
   justify-content: center;
   gap: 9px;
}
#information .list li .btn02 a .icon img {
   vertical-align: sub;
}



/* factory
-------------------------------------*/
#factory {
    padding-bottom: 184px;
}
#factory .ttl-box {
    background: url(../images/company/factory-ttl-bg.jpg)no-repeat;
    background-size: cover;
    height: 453px;
    margin-bottom: 80px;
    display: grid;
    place-content: center;
}
#factory .enttl {
    color: #FFF;
    text-align: center;
    font-size: 14px;
    margin-bottom: 8px;
}
#factory .ttl {
    color: #FFF;
    text-align: center;
    font-size: 24px;
    letter-spacing: 0.1em;
}
#factory .subt {
    color: #000;
    text-align: center;
    font-size: 24px;
    line-height: 1.66667; 
    margin-bottom: 34px;
}
#factory .lead {
    color: #000;
    text-align: center;
    font-size: 20px;
    line-height: 2;
    margin-bottom: 60px;
}
#factory .photo {
    width: min(95%, 1216px);
    margin-inline: auto;
    margin-bottom: 60px;
}
#factory .photo img {
    width: 100%;
    height: auto;
}
#factory .txt {
    color: #000;
    text-align: center;
    font-size: 16px;
    line-height: 2; 
}
#factory .inBox {
    background: #F3F4F5;
    width: min(95%, 1100px);
    margin-inline: auto;
    padding-block: 84px 76px;
    margin-top: 104px;
}
#factory .inBox .subt {
    letter-spacing: 0.1em;
}
#factory .inBox .list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 40px;
    width: min(95%, 830px);
    margin-inline: auto;
}
#factory .inBox .list li {
    background: #FFFEFE;
    padding-block: 44px 20px;
    text-align: center;
    display: block grid;
    grid-template-rows: subgrid;
    grid-row: span 2;
    height: 200px;
    margin-bottom: 40px;
}
#factory .inBox .list li h4 {
    color: #000;
    text-align: center;
    font-size: 16px;
    letter-spacing: 0.1em;
}
#factory .inBox .list li img {
    height: auto;
    margin-bottom: 20px;
}
#factory .inBox .list li:nth-child(1) img {
    width: 150px;
}
#factory .inBox .list li:nth-child(2) img {
    width: 119px;
}
#factory .inBox .list li:nth-child(3) img {
    width: 115px;
}
#factory .inBox .list li:nth-child(4) img {
    width: 110px;
}
#factory .inBox .list li:nth-child(5) img {
    width: 130px;
}
#factory .inBox .list li:nth-child(6) img {
    width: 92px;
}


}

/* ========================================
  @media screen and (min-width:768px) and (max-width:1100px)
======================================== */
@media screen and (min-width:768px) and (max-width:1100px) {
#customer .inBox {
    gap:5.455vw;
}
#customer .txt {
    font-size: clamp(0.875rem, 0.586rem + 0.6vw, 1rem);
}
#customer.corporation .inner::before {
    width: 16.727vw;
    height: 16.273vw;
    bottom: -1.455vw;
    right: 7vw;
}
}

/* ========================================
  @media screen and (max-width: 767px)
======================================== */
@media screen and (max-width: 767px) {
/* mv
-------------------------------------*/
#mv {
    background: url(../images/company/mv-bg_sp.jpg)no-repeat;
    background-size: cover;
    padding-block: 5.8vw 25.2vw;
    margin-bottom: 43.00vw;
    position: relative;
    margin-top: 15vw;
}
#mv .ttl-frame {
    background: url(../images/index/intro-ttl-bg_sp.png)no-repeat top  center;
    background-size: contain;
    margin-bottom: -38.4vw;
    display: flex;
    justify-content: center;
    padding: 9vw 0 49.85vw;
 }
#mv .ttl {
    font-size:3.382vw;
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: 0.2em;
    writing-mode: vertical-rl;
    text-orientation: upright;
    display: flex;
    justify-content: center;
}
#mv .subt {
    text-align: center;
    font-size:4.348vw;
    font-weight: 400;
    letter-spacing: 0.1em;
    margin-bottom: 6.62vw;
}
#mv .txt {
    text-align: center;
    font-size:3.865vw;
    line-height: 1.875;
    letter-spacing: 0.05em;
    margin-bottom: 14.49vw;
}
#mv .bg-slide {
   position: absolute;
}
#mv .bg-slide .loop {
   overflow: hidden;
}
#mv .bg-slide .loop .loop__box {
   display: flex;
   width: 100vw;
}
#mv .bg-slide .loop .loop__box img {
    min-width: 459vw;
}
#mv .bg-slide .loop .loop__box img:first-child {
   -webkit-animation: loop 50s -25s linear infinite;
   animation: loop 50s -25s linear infinite;
}
#mv .bg-slide .loop .loop__box img:last-child {
   -webkit-animation: loop2 50s linear infinite;
   animation: loop2 50s linear infinite;
}



/* customer
-------------------------------------*/
#customer {
    padding-block: 20.53vw 9.66vw;
}
#customer .inner {
    background: #FFF;
    width: min(95%, 89.37vw);
    margin-inline: auto;
    position: relative;
    padding-block: 19.83vw 9.66vw;
}
#customer .icon {
    position: absolute;
    top: -11vw;
    left: 50%;
    transform: translateX(-50%);
}
#customer .icon img {
    width: 21.74vw;
}
#customer .ttl {
    color: #000;
    text-align: center;
    font-size:4.831vw;
    letter-spacing: 0.1em;
    margin-bottom: 4.43vw;
}
#customer .lead {
    color: #000;
    text-align: center;
    font-size:3.382vw;
    line-height: 2.14286; 
    margin-bottom: 9.66vw;
}
#customer .inBox {
    width: 80.68vw;
    margin-inline: auto;
    display: grid;
    gap: 4.62vw;
}
#customer .inBox .photo {
    width: 79.71vw;
    margin-inline: auto;
}
#customer .inBox .photo img {
    width: 100%;
    height: auto;
}
#customer .txt {
    color: #000;
    font-size:3.382vw;
    line-height: 2.14286;
    letter-spacing: 0;
}

/* person
-------------------------------------*/
#customer.person {
    background: #F3F4F5;
}
#customer.person .store {
    display: grid;
    background: #F3F4F5;
    width: 79.71vw;
    margin-inline: auto;
    padding-block: 4.83vw;
    padding-inline: 4.83vw;
    margin-bottom: 7.25vw;
}
#customer.person .store li {
    color: #000;
    font-size:3.382vw;
    line-height: 2.14286; 
}

/* corporation
-------------------------------------*/
#customer.corporation {
    background: #E3E3E3;
}
#customer.corporation .inner::before {
    position: absolute;
    content: "";
    background: url(../images/company/corporation-illust_sp.png)no-repeat;
    background-size: contain;
    width: 31.88vw;
    height: 30.92vw;
    bottom: -2.86vw;
    right: -1.4vw;
}
#customer.corporation .lead {
  margin-bottom: 7.66vw;
}

/* company
-------------------------------------*/
.company .inner {
    width: min(95%, 89.37vw);
    margin-inline: auto;
    padding-block: 18.62vw 17.5vw;
}
.company .ttl-box {
    gap: 1.5vw;
    display: grid;
    margin-bottom: 9.66vw;
}
.company .enttl {
    font-size:3.382vw;
    text-align: center;
}
.company .ttl {
    font-size:5.797vw;
    letter-spacing: 0.1em;
    text-align: center;
}
.company table {
    border-top: 0.12vw solid #1a1a1a;
    width: 100%;
}
.company tr {
    border-bottom: 0.12vw solid #1a1a1a;
    display: grid;
    grid-template-columns: 32.6% 1fr;
}
.company th,
.company td {
    color: #000;
    font-size: 3.382vw;
    font-weight: 400;
    line-height: 2;
    letter-spacing: 0.1em;
    padding-block: 3.66vw;
    text-align: left;
}
.company th {padding-left: 4.84vw;font-weight: 600;}

/* information
-------------------------------------*/
#information {
   width: min(95%, 89.37vw);
   margin-inline: auto;
   padding-block: 0 11.46vw;
   position: relative;
}
#information::before {
   position: absolute;
   content: "";
   background: url(../images/index/information-deco_sp.png)no-repeat;
   background-size: contain;
   width: 44.69vw;
   height: 43.00vw;
   top: -25vw;
   right: 0;
   z-index: 2;
   opacity: 0.08;
}
#information .enttl {
   text-align: center;
   font-size:3.382vw;
   margin-bottom: 1.2vw;
   letter-spacing: 0;
}
#information .ttl {
   text-align: center;
   font-size:5.797vw;
   letter-spacing: 0.1em;
   margin-bottom: 8.66vw;
}
#information .list {
   display: grid;
   gap: 7.66vw;
   margin-bottom: 10.56vw;
}
#information .list li .wrap {
   display: grid;
   grid-template-columns: 41.06vw 1fr;
   gap: 3.86vw;
   margin-bottom: 5.80vw;
}
#information .list li .photo img {
   width: 100%;
   height: auto;
}
#information .list li .information-name {
   font-size:4vw;
   font-weight: 500;
   margin-bottom: 5.80vw;
   line-height: 1.4444;
}
#information .list li .address {
   font-size:3.865vw;
   line-height: 1.75; 
   margin-bottom: 3.86vw;
}
#information .list li .info-box {
   display: flex;
   gap: 1.93vw;
}
#information .list li .info-box li {
   display: grid;
   grid-template-columns: 19.32vw 1fr;
   gap: 3.86vw;
   margin-bottom: 1.93vw;
   align-items: center;
}
#information .list li .info-box h4 {
   font-size:2.898vw;
   line-height: 1.3333;
   letter-spacing: -0.02em;
   border: 0.12vw solid #1A1A1A;
   background: #FFF;
   height: 7.25vw;
   text-align: center;
   display: grid;
   place-content: center;
}
#information .list li .info-box p {
   font-size:3.382vw;
   line-height: 1.71429;
}
#information .list li .info-box .small {
   font-size:2.898vw;
   line-height: 1.6667;
   display: block;
   padding-top: 0.5vw;
}
#information .list li .btn a {
   text-align: center;
   font-size:2.898vw;
   letter-spacing: 0.05em;
   padding-block: 2.8vw 1.9vw;
   border: 0.12vw solid #1A1A1A;
   display: flex;
   justify-content: center;
   gap: 1.45vw;
}
#information .list li .btn a .icon img {
   vertical-align: sub;
}
#information .list li:nth-child(1) .info-box li:nth-child(1) h4 {
   position: relative;
   top: -2vw;
}
#information .list li:nth-child(1) .info-box li:nth-child(2) h4 {
   position: relative;
   top: -2vw;
}

#information .timetxt{
margin:5vw 0 0 0; text-align: center;
font-size: 3.2vw; line-height: 1.8; letter-spacing: 0; 
}
#information .list li .btn02 a {
   width: 80%; margin: 0 auto;
   text-align: center;
   font-size:3.2vw;
   letter-spacing: 0.05em;
   padding-block: 2.8vw 1.9vw;
   border-bottom: 0.12vw solid #1A1A1A;
   display: flex;
   justify-content: center;
   gap: 1.45vw;
}
#information .list li .btn02 a .icon img {
   vertical-align: sub;
}



/* factory
-------------------------------------*/
#factory {
    padding-bottom: 19.32vw;
}
#factory .ttl-box {
    background: url(../images/company/factory-ttl-bg_sp.jpg)no-repeat;
    background-size: cover;
    height: 53.38vw;
    margin-bottom: 7.25vw;
    display: grid;
    place-content: center;
}
#factory .enttl {
    color: #FFF;
    text-align: center;
    font-size:3.382vw;
    margin-bottom: 1.93vw;
}
#factory .ttl {
    color: #FFF;
    text-align: center;
    font-size:5.797vw;
    letter-spacing: 0.1em;
}
#factory .subt {
    color: #000;
    text-align: center;
    font-size:4.348vw;
    line-height: 1.8889; 
    margin-bottom: 4.83vw;
}
#factory .lead {
    color: #000;
    text-align: center;
    font-size:3.865vw;
    line-height: 1.875;
    margin-bottom: 9.66vw;
}

#factory .txt {
    color: #000;
    text-align: center;
    font-size:3.382vw;
    line-height: 2.14286; 
}
#factory .inBox {
    background: #F3F4F5;
    padding-block: 11.08vw;
    margin-top: 19.32vw;
}
#factory .inBox .subt {
    font-size: 4.831vw;
    letter-spacing: 0.1em;
}
#factory .inBox .list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 3.86vw;
    width: 89.37vw;
    margin-inline: auto;
    margin-bottom: 4vw;
}
#factory .inBox .list li {
    background: #FFFEFE;
    padding-block: 6.28vw 2.5vw;
    text-align: center;
    display: block grid;
    grid-template-rows: subgrid;
    grid-row: span 2;
    height: 34.30vw;
    margin-bottom: 3.86vw;
}
#factory .inBox .list li h4 {
    color: #000;
    text-align: center;
    font-size:3.382vw;
    letter-spacing: 0.1em;
}
#factory .inBox .list li img {
    height: auto;
    margin-bottom: 1.4vw;
}
#factory .inBox .list li:nth-child(1) img {
    width: 26.99vw;
}
#factory .inBox .list li:nth-child(2) img {
    width: 23.15vw;
}
#factory .inBox .list li:nth-child(3) img {
    width: 23.91vw;
}
#factory .inBox .list li:nth-child(4) img {
    width: 21.01vw;
}
#factory .inBox .list li:nth-child(5) img {
    width: 24.63vw;
}
#factory .inBox .list li:nth-child(6) img {
    width: 18.39vw;
}
#factory .bg-slide {margin-bottom: 7.25vw;}
#factory .bg-slide .loop {
   overflow: hidden;
}
#factory .bg-slide .loop .loop__box {
   display: flex;
   width: 100vw;
}
#factory .bg-slide .loop .loop__box img {
  min-width: 270vw;
}
#factory .bg-slide .loop .loop__box img:first-child {
   -webkit-animation: loop 50s -25s linear infinite;
   animation: loop 50s -25s linear infinite;
}
#factory .bg-slide .loop .loop__box img:last-child {
   -webkit-animation: loop2 50s linear infinite;
   animation: loop2 50s linear infinite;
}


}