@charset "utf-8";

/*----------------------------
            [共通]
-----------------------------*/
@media screen and (min-width: 768px){
  .contents-sp{
    display: none;
  }
  .contents-tb{
    display: block;
  }
  .fixed-page-text .title-template01 h2 {
    font-size: 32px;
  }
  .btn-template01 a{
    background: url("../img/icon/view-more-tab.png") no-repeat center / contain;
    max-width: 645px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 25px;
  }
  .btn-template01 a br{
    display: none;
  }
  .arrow-icon-green.arrow-icon::after{
    width: 25px;
  }
  .arrow-icon {
    padding-right: 40px;
  }
  .blockquote-template{
    font-size: 20px;
  }
  
  /* .sub-titleは.title-template02使用かつサブタイトル専用 */
  .sub-title.js-reveal-title.title-template02.is-animated h2 span::after{
    /* transform: translate(-50%, 15px) */
  }
}
@media screen and (min-width: 1000px){
  .btn-template01 a{
    font-size: 40px;
    max-width: 920px;
  }
}
@media screen and (min-width: 1200px){
  section{
    padding-bottom: 150px;
  }
  .contents-tb{
    display: none;
  }
  .contents-pc{
    display: block;
  }
  .title-template01{
    margin-bottom: 50px;
  }
  .btn-template01 a .arrow-icon{
    font-size: 24px;
  }
}
@media screen and (min-width: 1500px){
  .l-container{
    max-width: 1400px;
  }
  .btn-template01 a{
    background: url("../img/icon/view-more-pc.png") no-repeat center / contain;
    max-width: 1400px;
  }
  .blockquote-template{
    font-size: 24px;
  }
}
/*----------------
[共通]position: fixed;アイコン
-----------------*/
@media screen and (min-width: 1200px){
  .side-nav{
    /*display: block;*/
    display: none;
  }
  .home .side-nav{
    display: none;
  }
  .side-nav {
    position: fixed;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    z-index: 100;
  }

  .side-nav-list {
    list-style: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .side-nav-item a {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    text-decoration: none;
    font-size: 24px;
    font-family: "Konkhmer Sleokchher", system-ui;
    font-weight: 400;
    padding: 22px;
    transition: .3s;
  }

  .side-nav-item a span {
    font-size: 16px;
    font-family: var(--ark-font-base);
    font-weight: 500;
    margin-bottom: 12px;
  }

  /* 4つ目の初期状態（透明・下に少しずらしておく） */
  .js-fade-menu {
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
  }

  /* JavaScriptで付与するクラス */
  .js-fade-menu.is-show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
  .side-nav-item.side-nav-recruit a, 
  .side-nav-item.side-nav-partner a{
    background-color: #00FFA2;
    color: #232E24;
    border: 1px solid #232E24;
    border-left: none;
  }
  .side-nav-item.side-nav-recruit a:hover, 
  .side-nav-item.side-nav-partner a:hover{
    background-color: #00FF84;
  }
  .side-nav-item.side-nav-contact a{
    background-color: #0F5339;
    border: 1px solid #00FFA2;
    border-left: none;
  }
  .side-nav-item.side-nav-contact a:hover{
    background-color: #187350;
    color: #D2EFE2;
  }
  .side-nav-item.side-nav-menu a{
    border: 1px solid #00FFA2;
    background-color: #232E24;
    border-left: none;
    color: #00FFA2;
  }
  .side-nav-item.side-nav-menu a:hover{
    background-color: #0F5339;
  }
  
  
  .js-fade-menu {
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    /* 消える時（is-showが外れた時）の動きを保証 */
    transition: opacity 0.5s ease, transform 0.5s ease, visibility 0.5s;
    pointer-events: none; /* 消えている間はクリックできないようにする */
  }

  .js-fade-menu.is-show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto; /* 表示されたらクリック可能にする */
  }
  .side-nav-item a .hamburger{
    width: 100%;
    height: 25px;
    margin: 0;
    position: relative;
  }
  .side-nav-item a .hamburger::after{
    content: "";
    width: 48px;
    height: 1px;
    background-color: #00FFA2;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%) rotate(-25deg);
    z-index: 1;
  }
}
@media screen and (min-width: 1500px) {
  .home .side-nav{
    display: block;
  }
  .side-nav{
    display: block;
  }
}
@media screen and (min-width: 1700px){
  .side-nav {
    display: block;
  }
}
@media screen and (min-width: 1500px){
  /* Arkheのドロワー本体のカスタマイズ */
  .p-drawer {
    position: fixed !important;
    top: 0;
    left: 0;
    right: auto !important; /* 右端固定を解除 */
    width: 400px;           /* メニューの幅 */
    height: 100vh;
    max-width: 90vw;
    background-color: #232E24;
    z-index: 999999;
    
    /* 初期状態：左に隠す */
    transform: translateX(-100%) !important; 
    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
    
    /* Arkheのデフォルトの消える動きを打ち消す */
    display: block !important; 
    visibility: visible !important;
    opacity: 1 !important; 
  }

  /* メニューが開いている時 */
  [data-drawer-state="opened"] .p-drawer {
    transform: translateX(0) !important;
  }

  /* オーバーレイ（背景の暗幕）の設定 */
  .p-drawer__overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 999998;
    
    /* 初期状態は非表示 */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s;
  }

  /* メニューが開いている時のオーバーレイ表示 */
  [data-drawer-state="opened"] .p-drawer__overlay {
    opacity: 1;
    visibility: visible;
  }
  
  .w-drawerBottom{
    display: none;
  }
}

/*----------------------------
        [共通]ここまで
-----------------------------*/

/*----------------------------
    [固定ページ共通]header
-----------------------------*/
@media screen and (max-width: 420px){
  header .c-drawerNav .menu-item .c-drawerNav__a .__mainText{
    font-size: 18px;
  }
}
@media not all and (min-width: 1200px) {
    .l-header[data-spfix="1"] {
        position: sticky;
    }
}
@media screen and (min-width: 1000px){
  [data-has-drawer=sp] .l-header__drawerBtn{
    display: block;
  }
  .l-header__right{
    display: none;
  }
}

/* 1000px以上 1199px以下の間、表示をスイッチさせる */
@media screen and (min-width: 1000px) and (max-width: 1199px) {
  header[data-btns=r-l] .l-header__body{
    flex-direction: row-reverse;
  }
  /* 1. PC用の横並びメニューを隠す */
  .c-gnavWrap {
    display: none !important;
  }

  /* 2. ハンバーガーボタンを表示させる */
  .l-header__drawerBtn {
    display: block !important;
  }

  /* 3. ヘッダー内のレイアウト調整 */
  /* ボタンとロゴを両端に配置する場合 */
  .l-header__body {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  /* 検索ボタンなどがある場合、重ならないように調整 */
  .l-header__right {
    display: none !important; /* PCナビの親要素ごと隠す */
  }
}
@media screen and (min-width: 1200px){
  #header{
    /*background: #0E3526;*/
    /*background: none;*/
    position: sticky;
  }
  header[data-btns=r-l] .l-header__body{
    grid-template-areas: "search left center right menu";
    max-width: 100%;
  }
  .home header .l-header__body > div:not(#drawer_menu){
    display: none;
  }
  .home header{
    height: 0;
  }
  
  header .c-drawerNav .recruit-hamb, 
  header .c-drawerNav .partner-hamb, 
  header .c-drawerNav .contact-hamb{
    display: none;
  }
}
@media screen and (min-width: 1500px){
  .c-gnav li a .__mainText{
    font-size: 24px;
  }
  .c-gnav li a .__subText{
    font-size: 16px;
  }
  .header-tel{
    font-size: 24px;
  }
  header {
    height: 165px;
  }
  header .has-image>.c-headLogo, 
  header .c-headLogo .c-headLogo__img {
    height: 85px;
  }
  
  [data-btns='r-l'][data-logo='left'] .l-header__body {
    /* 1列目(search): 指定幅
       2列目(left): ロゴ(min-content)
       3列目(center): メニューをここに配置(auto)
       4列目(right): 空きスペース(1fr)
       5列目(menu): メニューボタン(min-content)
    */
    grid-template-columns: var(--ark-searchW) min-content auto 1fr var(--ark-drawerW) !important;
  }
  .l-header__right{
    display: flex;
  }
  
  [data-has-drawer=sp] .l-header__drawerBtn{
    display: none;
  }
  #header{
    /*background: #0E3526;*/
    background: none;
    position: static;
  }
}

/* -----------------------
    ハンバーガーメニュー内
------------------------- */
@media screen and (max-width: 1199px){
  header .c-drawerNav{
    display: grid;
    /* 各列の最小幅を0に制限し、1frで均等分割する */
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(4, 1fr);
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    width: 100%;
  }
  header .c-drawerNav .hamb-grid01{
    grid-area: 1 / 1 / 2 / 2;
  }
  header .c-drawerNav .hamb-grid02{
    grid-area: 1 / 2 / 2 / 3;
  }
  header .c-drawerNav .hamb-grid03{
    grid-area: 1 / 3 / 2 / 4;
  }
  header .c-drawerNav .hamb-grid04{
    grid-area: 2 / 1 / 3 / 2;
  }
  header .c-drawerNav .hamb-grid05{
    grid-area: 2 / 2 / 3 / 3;
  }
  header .c-drawerNav .hamb-grid06{
    grid-area: 2 / 3 / 3 / 4;
  }
  header .c-drawerNav .hamb-grid07{
    grid-area: 3 / 1 / 4 / 2;
  }
  header .c-drawerNav .hamb-grid08{
    grid-area: 3 / 2 / 4 / 3;
  }
  header .c-drawerNav .hamb-grid09{
    grid-area: 3 / 3 / 4 / 4;
  }
  header .c-drawerNav .hamb-grid10{
    grid-area: 4 / 1 / 5 / 4;
  }
  
  header .c-drawerNav .menu-item .c-drawerNav__a{
    border: 1px solid rgba(0, 255, 162, 1);
  }
  header .c-drawerNav .menu-item:last-child .c-drawerNav__a{
  padding: var(--ark-nav-padding--Y, .75rem) var(--ark-nav-padding--R, .5rem) var(--ark-nav-padding--Y, .75rem) var(--ark-nav-padding--L, .5rem);
}
  header .c-drawerNav .menu-item .c-drawerNav__a{
    padding-bottom: 33px;
  }
  header .c-drawerNav .menu-item:not(:last-child)::after{
    bottom: 18px;
  }
  header .c-drawerNav .menu-item .c-drawerNav__a:hover{
    background-color: #0F5339 !important;
  }
  header .p-drawer__close{
    display: none;
  }
  .p-drawer__nav{
    max-width: 424px;
    margin: 0 auto;
  }
  
  
/* スライダーの外枠：画面全体に対して固定 */
.p-drawer-bg-slideshow {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100vw; /* 画面幅いっぱい */
  height: 45%;
        max-height: 350px;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  clip-path: polygon(0 25%, 100% 0, 100% 100%, 0 100%);
}

/* 各スライドの共通設定 */
.slide-item {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0; /* 最初は消しておく */
  animation: drawerSlideshow 16s linear infinite; /* 4秒×4枚 = 16s */
}

.slide-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.5; /* 画像の透過度 */
}

/* アニメーションのタイミングをずらす（4枚の場合） */
.slide-item:nth-child(1) { animation-delay: 0s; }
.slide-item:nth-child(2) { animation-delay: 4s; }
.slide-item:nth-child(3) { animation-delay: 8s; }
.slide-item:nth-child(4) { animation-delay: 12s; }

/* クロスフェードのアニメーション */
@keyframes drawerSlideshow {
  0% { opacity: 0; }
  10% { opacity: 1; }  /* 4秒のうち最初の10%でフェードイン */
  25% { opacity: 1; }  /* 25%まで表示維持 */
  35% { opacity: 0; }  /* 次の画像と重なりながらフェードアウト */
  100% { opacity: 0; }
}
  .p-drawer__nav{
    max-width: 424px;
    margin: 0 auto;
  }
  .l-header__center{
    position: relative;
    z-index: 100;
  }
  
}

@media screen and (min-width: 768px){
  
}
body.page:not(.home){
  
}

/*----------------------------
  [固定ページ共通]headerここまで
-----------------------------*/

/*----------------------------
    [固定ページ共通]タイトル
-----------------------------*/
@media screen and (min-width: 768px){
  .fixed-page-grid{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    padding: 25px 0;
    position: relative;
  }
  .fixed-page-grid::before{
    content: "";
    background: url("../img/icon/stripe-tb-fixed-title.png") no-repeat right/contain;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
  }
  
  .fixed-page-img{
    order: 2;
    position: relative;
    z-index: 1;
  }
  .fixed-page-text{
    order: 1;
    display: flex;
    align-items: flex-end;
    position: relative;
    z-index: 2;
  }
  .fixed-page-text .title-template01{
    margin: 0;
  }
  .fixed-page-text .title-template01::before{
    display: none;
  }
  .fixed-page-text h2{
    font-size: 32px;
  }
  .fixed-page-text .title-template01.title-template02 h2 span::after{
    width: 50vw;
    height: 100px;
    top: auto;
    bottom: 8px;
    max-width: 510px;
    max-height: 100px;
  }
  .fixed-page-template p{
    font-size: 20px;
  }
  .fixed-page-template{
    position: relative;
    border-bottom: none;
  }
  .fixed-page-template::after{
    content: "";
    width: calc(100% - var(--ark-padding--container) * 2);
    height: 1px;
    border-bottom: 1px solid #00FFA2;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
  }
}

@media screen and (min-width: 1200px){
  .fixed-page-text .l-container{
    padding-left: var(--ark-padding--container);
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    gap: 20px;
  }
  .fixed-page-text-p-sp{
    /*margin-left: 0;*/
    padding-left: var(--ark-padding--container);
    margin-left: auto;
    margin-right: auto;
  }
  .fixed-page-text p{
    display: block;
  }
  .fixed-page-text-p-sp.l-container{
    display: none;
  }
  .fixed-page-grid::before{
    background: url(../img/icon/stripe-pc-fixed-title.png) no-repeat right / contain;
    top: calc(var(--ark-header_height) * -1);
  }
  .fixed-page-text{
    align-items: center;
  }
}
@media screen and (min-width: 1500px){
  .fixed-page-text p{
    display: block;
  }
  .fixed-page-text-p-sp p{
    display: none;
  }
  .fixed-page-container-pc.l-container{
    max-width: none;
    padding-right: 0;
    margin-right: 0;
    width: calc(100% - ((100% - 1400px) / 2));
    margin-left: calc((100% - 1400px) / 2);
  }
  .fixed-page-text .l-container{
    padding-left: 0;
  }
  .fixed-page-text .title-template01.title-template02 h2 span::after{
    height: 128px;
    bottom: 15px;
    left: 37px;
    max-width: 680px;
    max-height: 128px;
  }
  .fixed-page-text .title-template01{
    padding-top: 100px;
  }
  .fixed-page-text .title-template01 h2{
    font-size: 40px;
  }
  .fixed-page-text .title-template01.title-template02 h2 span::after{
    width: 50vw;
        height: 125px;
        top: auto;
        bottom: 15px;
        left: 34px;
        max-width: 680px;
        max-height: 125px;
  }
}
/*----------------------------
    [固定ページ共通]タイトルここまで
-----------------------------*/

/*----------------------------
        [top]mainvisual
-----------------------------*/
@media screen and (min-width: 768px){
  .top-mainvisual-text-svg::before{
    width: 645px;
        height: 182px;
  }
  .top-mainvisual-text-svg::after{
    width: 714px;
        height: 100px;
        left: 50%;
        transform: translateX(-50%);
        bottom: 7vh;
        background-position: center;
  }
  .top-mainvisual-text h1, 
  .opening-text h1{
    font-size: 63px;
  }
  .top-mainvisual-text h1 p span, 
  .opening-text h1 p span{
    font-size: 72px;
  }
  .top-mainvisual-text h1 p span.t-m-t-large/*, 
  .opening-text h1 p span.t-m-t-large*/{
    font-size: 100px;
  }
}
@media screen and (min-width: 1200px){
  .puzzle-layout {
    display: flex;
    width: 100%;
    height: 100vh; /* 画面ぴったり */
    overflow: hidden;
    background: #fff;
  padding: 0;
  max-height: 1080px;
    min-height: 980px;
}
  .top-mainvisual-pc {
    display: flex;
    width: 100%;
    height: 100%;
}
  .top-mainvisual-sp {
    display: none;
}
  
  .top-mainvisual-text h1 p br:not(.t-m-t-br), 
  .opening-text h1 p br:not(.t-m-t-br){
    display: none;
  }
  .top-mainvisual-text h1 p:last-child, 
  .opening-text h1 p:last-child{
    position: relative;
        left: 100px;
  }
  .top-mainvisual-text-svg::before{
    width: 760px;
        height: 215px;
  }
  .top-mainvisual-text-svg::after{
    width: 800px;
        height: 113px;
  }
  .top-mainvisual-text h1, 
  .opening-text h1{
    font-size: 72px;
  }
  .top-mainvisual-text h1 p span, 
  .opening-text h1 p span{
    font-size: 84px;
  }
  .top-mainvisual-text h1 p span.t-m-t-large, 
  .opening-text h1 p span.t-m-t-large{
    font-size: 110px;
  }
}

/* --- 1400px以上のレイアウト固定（以前の分を維持） --- */
@media screen and (min-width: 1400px) {
    .area.nav-white {
        flex: 0 0 346.25px; 
        width: 346.25px;
        min-width: 346.25px;
    }
    .area.red, .middle-col { flex: 1.2; }
}

@media screen and (min-width: 1500px){
  .top-mainvisual-text, 
  .opening-text{
    transform: translate(-50%, -50%);
    left: calc(50% - 125px);
  }
  .top-mainvisual-text-svg::before{
    width: 1130px;
        height: 320px;
        left: 5vw;
        top: 4vh;
  }
  .top-mainvisual-text-svg::after{
    width: 1270px;
        height: 180px;
  }
  .top-mainvisual-text h1, 
  .opening-text h1{
    font-size: 92px;
  }
  .top-mainvisual-text h1 p span, 
  .opening-text h1 p span{
    font-size: 112px;
  }
  .top-mainvisual-text h1 p span.t-m-t-large, 
  .opening-text h1 p span.t-m-t-large{
    font-size: 144px;
  }
  .top-mainvisual-text h1 p:last-child, 
  .opening-text h1 p:last-child{
    white-space: nowrap;
        left: 160px;
  }
  
}

/*----------------------------
        [top]mainvisualここまで
-----------------------------*/

/*----------------------------
        [top]future
-----------------------------*/
@media screen and (min-width: 768px) {
  .top-future .top-company-grid{
    grid-template-columns: 1fr 1.5fr;
  }
  .top-future .top-company-title.title-template01{
    padding-top: 120px;
  }
  .top-future .top-company-title.title-template01 h2{
    font-size: 32px;
  }
  .top-future .top-company-title.title-template01 h2 span::after{
    width: 280px;
    height: 126px;
    bottom: 70px;
  }
  #top-future .top-company-img-pc{
    height: 333px;
  }
  #top-future .top-company-text-pc{
    position: relative;
  }
  #top-future .top-company-text-pc::before{
    content: "";
    width: 80%;
    height: 35%;
    background: url("../img/icon/stripe-future.png") no-repeat top left/contain;
    position: absolute;
    top: 0;
    left: calc(var(--ark-padding--container) * -1);
    z-index: 0;
  }
}
@media screen and (min-width: 1200px){
  .top-future .top-future-container{
    padding-left: var(--ark-padding--container);
  }
  #top-future .top-company-text-pc{
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
  }
  .top-future .top-company-title.title-template01 h2 span::after{
    background: url(../img/top/title-future.svg) no-repeat left / contain;
  }
  .top-future-text-pc{
    display: block;
  }
  #top-future .company-special-item.is-left-img{
    display: unset;
  }
  #top-future .company-special-item.is-right-img{
    margin-left: -15%;
    clip-path: polygon(0% 0, 100% 0, 100% 100%, 20% 100%);
  }
  .top-future-text-sp{
    display: none;
  }
  .top-future .top-company-title.title-template01{
    padding-top: 80px;
  }
  .top-future .top-company-title.title-template01 h2 span::after{
    width: 450px;
        height: 60px;
        bottom: 17px;
  }
  .top-future .top-company-title.title-template01 h2 span br{
    display: none;
  }
  #top-future .top-company-img-pc{
    height: 555px;
  }
}
@media screen and (min-width: 1500px){
  .top-future .top-future-container{
    max-width: none;
    width: calc(100% - ((100% - 1400px) / 2));
    margin-left: calc((100% - 1400px) / 2);
    padding-left: 0;
  }
  .top-future .top-company-grid{
    grid-template-columns: 590px 1fr;
  }
  .top-future .top-company-title.title-template01 h2 span::after{
    background-position: center;
        width: 700px;
        height: 94px;
        left: 50%;
        transform: translateX(-50%);
  }
  #top-future .top-company-img-pc{
    height: 850px;
  }
  #top-future .top-company-text-pc::before{
    display: none;
  }
  .top-future{
    position: relative;
  }
  .top-future::before{
    content: "";
    width: 30%;
        height: 30%;
        background: url(../img/icon/stripe-future.png) no-repeat top left / contain;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 0;
  }
}

/*----------------------------
        [top]futureここまで
-----------------------------*/

/*----------------------------
        [top]新着情報
-----------------------------*/
@media screen and (min-width: 768px){
  .top-news-list .limit-line-3{
    -webkit-line-clamp: 1;
    font-size: 20px;
  }
  .top-news-title.title-template01 h2 span::after{
    width: 231px;
    height: 63px;
    top: auto;
    bottom: 25px;
  }
  .top-news-title.title-template01 h2 span::before{
    width: 182px;
    height: 131px;
    bottom: 30px;
        left: auto;
        right: calc(100% + 66px);
  }
  .top-news-list ul{
    max-width: 1000px;
    margin: 0 auto;
  }
  .top-news{
    padding-bottom: 40px;
  }
}
@media screen and (min-width: 1000px){
  .top-news{
    position: relative;
  }
  .top-news::before{
    content: "";
            width: 100%;
        height: 32%;
    background: url("../img/icon/stripe.png") no-repeat top right/contain;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
  }
}
@media screen and (min-width: 1200px){
  .top-news-list ul li a .arrow-icon{
    padding-right: 100px;
  }
  .top-news{
    padding-bottom: 150px;
  }
  
}
@media screen and (min-width: 1500px){
  
}
/*----------------------------
        [top]新着情報ここまで
-----------------------------*/

/*----------------------------
        [top]里組について
-----------------------------*/
@media screen and (min-width: 768px){
  .top-about{
    padding-top: 4rem;
  }
  .top-about-title.title-template01 h2 span::after{
    width: 381px;
    height: 64px;
    top: auto;
    bottom: 25px;
  }
  .top-about-text h1.top-about-text-h1-pc{
    display: block;
    font-size: 56px;
    position: relative;
  }
  .top-about-text h1.top-about-text-h1-pc::after{
    content: "";
    width: 50%;
        height: 120%;
    background: url("../img/icon/stripe-top-about.png") no-repeat top right/contain;
    position: absolute;
    top: 0;
    right: calc(50% - 50vw);
    z-index: -1;
  }
  .top-about-text h1.top-about-text-h1-sp{
    display: none;
  }
  .top-about-text h1.top-about-text-h1-pc span{
    font-size: 72px;
  }
  .top-about-text h2{
    font-size: 28px;
  }
}
@media screen and (min-width: 1000px){
  .top-about-text-img{
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: 20px;
    max-width: 1000px;
    margin: 0 auto;
  }
  .top-about-text-img01{
    margin-bottom: 0;
    justify-content: center;
  }
  .top-about-text-img01 figure img{
    max-height: 250px;
    object-fit: cover;
  }
  .top-about-text-img02 .about02-sp{
    display: none;
  }
  .top-about-text-img02 .about02-pc{
    display: block;
  }
}
@media screen and (min-width: 1200px){
  .top-about-text h2{
    margin-bottom: 45px;
  }
  .top-about{
    position: relative;
  }
  .top-about::before{
    content: "";
    width: 35%;
        height: 20%;
    background: url("../img/icon/stripe-tb-satogumi01.png") no-repeat top left/contain;
    position: absolute;
    top: -30px;
    left: calc(50% - 50vw);
    z-index: -1;
  }
}
@media screen and (min-width: 1500px){
  .top-about-text-img{
    max-width: 1400px;
    grid-template-columns: 1.1fr 1fr;
    gap: 35px;
  }
  .top-about-text-img01{
    justify-content: space-between;
  }
  .top-about-text-img01 figure img{
    max-height: 400px;
  }
  
}

/*----------------------------
        [top]里組についてここまで
-----------------------------*/

/*----------------------------
        [top]施工実績について
-----------------------------*/
@media screen and (min-width: 768px){
  .top-works-title.title-template01 h2 span::after{
    background: url("../img/top/title-works-pc.svg") no-repeat center / contain;
    width: 670px;
        height: 83px;
  }
  .top-works-text h2 br:not(.t-w-t-br){
    display: none;
  }
  .top-works-text h2{
    font-size: 32px;
  }
  .top-works-text h2 span{
    font-size: 40px;
  }
  .top-works .swiper-slide-active{
    transform: scale(1.1);
  }
  .bk-slider{
    padding: 50px 0 60px;
  }
  .top-works .swiper-pagination{
    bottom: 0 !important;
  }
}
@media screen and (min-width: 1200px){
  .top-works{
    position: relative;
  }
  .top-works::after{
    content: "";
    width: 50%;
        height: 120%;
    background: url("../img/icon/stripe-top-about.png") no-repeat top right/contain;
    position: absolute;
    top: 0;
    right: calc(50% - 50vw);
    z-index: -1;
  }
}
@media screen and (min-width: 1500px){
  .top-works-title.title-template01 h2 span::after{
    width: 766px;
        height: 95px;
  }
  .bk-slider{
    padding: 65px 0 70px;
  }
  
}

/*----------------------------
        [top]施工実績についてここまで
-----------------------------*/

/*----------------------------
        [top]事業内容
-----------------------------*/
@media screen and (min-width: 768px){
  .top-service .partner-title-special{
    height: 200px;
  }
  .top-service-title.title-template01 h2 span::after{
    background: url(../img/top/title-service-pc.svg) no-repeat left / contain;
    width: 670px;
        height: 56px;
        top: auto;
        bottom: 42px;
  }
  .top-service-bg{
    padding-top: 20px;
  }
  .top-service-text h2{
    font-size: 48px;
    line-height: 1.4;
  }
  .top-service-text h2 span, 
  .top-service-text h2 span.t-s-t-span-sp{
    font-size: 56px;
  }
  .top-service-text h2 span.t-s-t-span-sp.t-s-t-span-pc{
    font-size: 72px;
  }
  .top-service-text blockquote{
    max-width: 640px;
  }
}
@media screen and (min-width: 1000px){
  .top-service-text{
    gap: 50px;
  }
  .top-service .btn-template01 a .arrow-icon{
    font-size: 16px;
  }
  .top-service .btn-template01 a.view-more-service-pc{
    display: block;
    max-width: 285px;
    padding: 0;
    margin: 0;
    background: none;
    max-height: 135px;
  }
  .top-service .btn-template01 a.btn-slash{
    display: none;
  }
  .top-service .partner-title-special {
    height: 280px;
  }
  .btn-template01.top-service-more{
    /*margin-bottom: 45px;*/
  }
  .top-service-bg{
    padding-top: 0;
  }
  .top-service-bg .l-container{
    padding-bottom: 45px;
  }
}
@media screen and (min-width: 1200px){
  .top-service .partner-title-special{
    height: 400px;
  }
  .top-service-bg::before{
    background: url(../img/top/service-bg.webp) no-repeat top right / cover;
    height: 130%;
    top: auto;
    bottom: 0;
  }
}
@media screen and (min-width: 1500px){
  .top-service .partner-title-special{
    height: 542px;
  }
  .top-service{
    padding-top: 220px;
  }
  .top-service-bg::before{
    height: 150%;
  }
  .top-service-text blockquote{
    max-width: 760px;
  }
  
  .top-service-title.title-template01 h2 span::after{
    width: 901px;
        height: 75px;
  }
  .top-service-text h2{
    font-size: 56px;
  } 
  .top-service-text h2 span, .top-service-text h2 span.t-s-t-span-sp{
    font-size: 64px;
  }
  .top-service-text h2 span.t-s-t-span-sp.t-s-t-span-pc{
    font-size: 84px;
  }
  .btn-template01.top-service-more{
    margin-top: 65px;
  }
}

/*----------------------------
        [top]事業内容ここまで
-----------------------------*/

/*----------------------------
        [top]会社情報
-----------------------------*/
@media screen and (min-width: 768px){
  .top-company-title.title-template01 h2 span::after{
    width: 377px;
    height: 78px;
  }
  .top-company-img-pc999.top-company-img-pc {
    height: 350px;
  }
}
@media screen and (min-width: 1000px){
  .top-company .btn-template01 a.view-more-company-pc{
    display: block;
    max-width: 285px;
    padding: 0;
    margin: 0;
    background: none;
    max-height: 118px;
  }
  .top-company .btn-template01 a.btn-slash{
    display: none;
  }
  .top-company .partner-title-special{
    display: none;
  }
  .top-company-grid{
    display: grid;
    grid-template-columns: 441px 1fr;
    gap: 0;
  }
  .top-company-text-pc{
    padding-top: 40px;
  }

  .top-company .l-container{
    padding-right: 0;
    max-width: 100%;
  }
  
  .top-company-img-pc999.top-company-img-pc{
  display:none;
}

.top-company-img-pc {
  display: flex;
}
}
@media screen and (min-width: 1200px){
  .top-company .l-container{
    padding-left: var(--ark-padding--container);
  }
  
}
@media screen and (min-width: 1500px){
  .top-company .l-container{
    max-width: none;
    padding-right: 0;
    padding-left: 0;
    margin-right: 0;
    width: calc(100% - ((100% - 1400px) / 2));
    margin-left: calc((100% - 1400px) / 2);
  }
  
  .top-company-text-pc{
    padding-top: 60px;
  }
  .top-company .btn-template01 a.view-more-company-pc{
    max-width: 330px;
    max-height: 136px;
  }
  .top-company-img-pc{
    height: 824px;
  }
}
/*----------------------------
        [top]会社情報ここまで
-----------------------------*/
  
/*----------------------------
        [top]採用情報
-----------------------------*/
@media screen and (min-width: 768px){
  .top-recruit-title.title-template01 h2 span::after{
    width: 300px;
    height: 68px;
    top: auto;
    bottom: 30px;
  }
  .top-recruit-text blockquote{
    max-width: 460px;
    margin: 0 auto;
  }
  .top-recruit-text h2 p:not(.top-recruit-text-pc){
    display: none;
  }
  .top-recruit-text h2 p.top-recruit-text-pc{
    display: block;
  }
  .top-recruit-text h2{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 48px;
  }
  .top-recruit-text h2 span{
    font-size: 64px;
  }
  
}
@media screen and (min-width: 1000px){
  .top-recruit-img-pc, 
  .top-recruit-img-pc02{
    position: relative;
  }
  .top-recruit-img-pc::before, 
  .top-recruit-img-pc::after, 
  .top-recruit-img-pc02::before{
    content: "";
    position: absolute;
  }
  .top-recruit-img-pc::before{
    width: 210px;
    height: 315px;
    background: url("../img/top/recruit04.png") no-repeat left/contain;
    top: -40px;
    left: 0;
  }
  .top-recruit-img-pc::after{
    width: 210px;
    height: 192px;
    background: url("../img/top/recruit02.png") no-repeat right/contain;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
  }
  .top-recruit-img-pc02::before{
    width: 210px;
    height: 140px;
    background: url("../img/top/recruit03.png") no-repeat left/contain;
    bottom: 30px;
    left: calc(50% - 50vw);
  }
  .top-recruit-img-pc03{
    padding-bottom: 55px;
    position: relative;
  }
  .top-recruit-img-pc03::after{
    content: "";
    width: 205px;
    height: 265px;
    background: url("../img/top/recruit01.png") no-repeat right/contain;
    position: absolute;
    bottom: 60%;
    right: calc(50% - 50vw);
  }
  .top-recruit-img-loop{
    display: none;
  }
  
  
  .top-recruit-img-pc::before,
  .top-recruit-img-pc::after,
  .top-recruit-img-pc02::before,
  .top-recruit-img-pc03::after {
    opacity: 0;
    filter: blur(20px); /* ぼかしの強さ */
    transition: opacity 1.2s ease-out, filter 1.0s ease-out; /* ゆっくり変化させる */
    will-change: opacity, filter; /* ブラウザのレンダリング最適化 */
  }

  /* 画面に入った時（親要素にクラスがついた時）の状態 */
  /* ここでは既存のJSに合わせて .is-active と仮定していますが、
     お使いのライブラリのクラス名に合わせて書き換えてください */
  .top-recruit-img-pc.is-active::before,
  .top-recruit-img-pc.is-active::after,
  .top-recruit-img-pc.is-active .top-recruit-img-pc02::before,
  .top-recruit-img-pc03.is-active::after {
    opacity: 1;
    filter: blur(0);
  }

  /* 各画像の表示タイミングを少しずつずらす（ディレイ設定） */
  .top-recruit-img-pc.is-active::before { transition-delay: 0.2s; } /* recruit04 */
  .top-recruit-img-pc.is-active::after  { transition-delay: 0.5s; } /* recruit02 */
  .top-recruit-img-pc.is-active .top-recruit-img-pc02::before { transition-delay: 0.8s; } /* recruit03 */
  .top-recruit-img-pc03.is-active::after { transition-delay: 1.1s; } /* recruit01 */
}
@media screen and (min-width: 1200px){
  .top-recruit-text blockquote{
    max-width: 715px;
    text-align: center;
  }
  .t-r-t-br-1200{
    display: block;
  }
  .top-recruit-img-pc::before{
    top: -100px;
  }
  .top-recruit-img-pc02::before{
    bottom: -50px;
  }
  .top-recruit-more.btn-template01{
    margin-top: 120px;
  }
}
@media screen and (min-width: 1500px){
  .top-recruit-img-pc03::after{
    width: 439px;
        height: 500px;
  }
  .recruit-img figure{
    width: 1262px;
    margin: 0 auto;
  }
  .top-recruit-img-pc03{
    margin-top: 120px;
  }
  .top-recruit-img-pc::after{
    width: 365px;
        height: 335px;
  }
  .top-recruit-img-pc::before{
    width: 365px;
        height: 500px;
    top: -50%;
  }
  .top-recruit-img-pc02::before{
    width: 359px;
        height: 239px;
  }
  #top-recruit .recruit-img figure{
    padding-top: 380px;
  }
}
@media screen and (min-width: 1920px){
  
  .top-recruit-img-pc03::after{
        height: 567px;
  }
  .top-recruit-img-pc03{
    margin-top: 120px;
  }
  .top-recruit-img-pc::after{
    right: 100px;
        top: 0;
        transform: none;
  }
  .top-recruit-img-pc::before{
    height: 548px;
  }
  .top-recruit-img-pc02::before{
    left: calc(50% - 50vw + 150px);
  }
  #top-recruit .l-container{
    max-width: 1920px;
  }
}
  
/*----------------------------
        [top]採用情報ここまで
-----------------------------*/
/*----------------------------
        [about]ものづくり
-----------------------------*/
@media screen and (min-width: 768px){
  .about-satogumi {
    padding-top: 40px;
  }
  .about-satogumi-title.title-template01.title-template02{
    text-align: center;
  }
  .about-satogumi-title.title-template01 h2 span::after{
    left: 50%;
    /*transform: translateX(-50%);*/
    transform: translate(-50%, 30px);
    width: 413px;
    max-width: 413px;
    height: 88px;
    top: auto;
    bottom: 15px;
  }
  .about-satogumi-grid{
    padding-top: 60px;
    gap: 50px;
  }
  .about-satogumi-card{
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 0;
  }
  .about-satogumi-card figure{
    padding-top: 0;
    padding-right: 70px;
  }
  .about-satogumi-grid .about-satogumi-card:nth-child(odd) figure .scene-num{
    left: auto;
    right: 0;
    top: -10px;
  }
  .about-satogumi-card figure .scene-num{
    max-width: 100px;
  }
  .about-satogumi-grid .about-satogumi-card:nth-child(3) .about-satogumi-text h3 br{
    display: none;
  }
  .about-satogumi-text h3{
    position: relative;
    font-size: 24px;
    padding-left: 15px;
  }
  
  .a-s-c-reverse.about-satogumi-card{
    grid-template-columns: 1fr 1fr;
    position: relative;
  }
  .a-s-c-reverse.about-satogumi-card figure{
    order: 2;
    padding-right: 0;
  }
  .a-s-c-reverse.about-satogumi-card figure .scene-num{
    display: none;
  }
  .a-s-c-reverse.about-satogumi-card .about-satogumi-text{
    order: 1;
    padding-left: 100px;
  }
  .a-s-c-reverse.about-satogumi-card .about-satogumi-text blockquote{
    padding-right: 15px;
  }
  .a-s-c-reverse.about-satogumi-card .about-satogumi-text h3::before{
    content: "";
    width: 100px;
    height: 100px;
    background: url("../img/about/satogumi-scene02.svg") no-repeat center/contain;
    position: absolute;
    top: 50%;
    right: 100%;
    transform: translateY(-50%);
    z-index: 2;
  }
  .about-satogumi-grid .a-s-c-reverse.about-satogumi-card:last-child h3::before{
    background: url("../img/about/satogumi-scene04.svg") no-repeat center/contain;
  }
  
  .about-satogumi-text blockquote{
    padding-left: 15px;
  }
  .a-s-c-reverse.about-satogumi-card::before{
    content: "";
    width: 100%;
    height: 78%;
    background: url("../img/icon/stripe-tb-satogumi01.png") no-repeat left/contain;
    position: absolute;
    top: -80px;
    left: calc(50% - 50vw);
    z-index: 0;
  }
  .about-satogumi-grid .a-s-c-reverse.about-satogumi-card:last-child::before{
    background: url("../img/icon/stripe-tb-satogumi02.png") no-repeat right/contain;
    top: 0;
    left: auto;
    right: calc(50% - 50vw);
  }
}
@media screen and (min-width: 1000px){
  .about-satogumi-grid{
    gap: 85px;
    padding-top: 70px;
  }
  .about-satogumi-card figure{
    padding-right: 120px;
  }
  .about-satogumi-grid .about-satogumi-card:nth-child(odd) figure .scene-num{
    top: -50px;
  }
  .about-satogumi-card figure .scene-num{
    max-width: 150px;
  }
  .about-satogumi-text blockquote{
    font-size: 20px;
  }
  .a-s-c-reverse.about-satogumi-card .about-satogumi-text{
    padding-left: 150px;
  }
  .a-s-c-reverse.about-satogumi-card .about-satogumi-text h3::before{
    width: 150px;
    height: 150px;
  }
}
@media screen and (min-width: 1500px){
  .about-satogumi{
    padding-top: 80px;
  }
  .about-satogumi-title.title-template01 h2 span::after{
    width: 450px;
    max-width: 450px;
    height: 96px;
  }
  .about-satogumi-card{
    grid-template-columns: 1fr 1.45fr;
  }
  .about-satogumi-card figure .scene-num{
    max-width: 160px;
  }
  .about-satogumi-card figure .about-satogumi-img{
    max-width: 430px;
  }
  .about-satogumi-text{
    max-width: 645px;
  }
  .about-satogumi-text h3{
    font-size: 32px;
  }
  .about-satogumi-text h3 br{
    display: none;
  }
  .about-satogumi-text blockquote{
    font-size: 24px;
    padding-top: 12px;
  }
  .a-s-c-reverse.about-satogumi-card .about-satogumi-text h3::before{
    width: 160px;
    height: 160px;
  }
  .a-s-c-reverse.about-satogumi-card{
    grid-template-columns: 1fr 430px;
  }
  .a-s-c-reverse.about-satogumi-card::before{
    top: -60px;
  }
  .a-s-c-reverse.about-satogumi-card .about-satogumi-text{
    max-width: 100%;
    padding-left: 0;
    display: flex;
    flex-direction: column;
    align-items: end;
  }
  .a-s-c-reverse.about-satogumi-card .about-satogumi-text h3{
    max-width: 645px;
    width: 100%;
  }
  .a-s-c-reverse.about-satogumi-card .about-satogumi-text blockquote{
    max-width: 645px;
    width: 100%;
  }
  .about-satogumi-grid{
    gap: 140px;
  }
}

/*----------------------------
        [about]ものづくりここまで
-----------------------------*/

/*----------------------------
        [about]特徴
-----------------------------*/
@media screen and (min-width: 768px){
  .about-features-grid{
    grid-template-columns: repeat(2,1fr);
    grid-auto-rows: auto auto auto;
  }
  .about-features-card{
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 3;
    row-gap: 0;
  }
  .about-features-title.title-template01 h2 span::after{
    width: 383px;
    height: 88px;
    max-width: 383px;
    top: auto;
    bottom: 22px;
  }
  .about-features-card-text{
    grid-row: span 2;
    display: grid;
    grid-template-rows: subgrid;
    row-gap: 0;
  }
  .about-features-card-text h6{
    font-size: 24px;
    grid-row: 1;
    align-self: center;
    margin-bottom: 0;
    padding-bottom: 5px;
  }
  .about-features-card-text blockquote{
    font-size: 20px;
    grid-row: 2;
  }
  .about-features-card figure{
    grid-row: 1;
  }
  .about-features-card figure img{
    height: 250px;
        object-fit: cover;
  }
}
@media screen and (min-width: 1200px){
  .about-features-grid{
    grid-template-columns: repeat(4, 1fr);
  }
  .about-features-card-text h6 br{
    display: block;
  }
  .about-features-card-text{
    padding: 24px;
  }
}
@media screen and (min-width: 1500px){
  .about-features-card-text h6 br{
    display: none;
  }
}

/*----------------------------
        [about]特徴ここまで
-----------------------------*/

/*----------------------------
        [company]タイトル
-----------------------------*/
@media screen and (min-width: 768px){
  .fixed-page-text .company-title-title.title-template01.title-template02 h2 span::after{
    width: 350px;
    max-width: 350px;
    height: 78px;
  }
}
@media screen and (min-width: 1000px){
  .fixed-page-text .company-title-title.title-template01.title-template02 h2 span::after{
    width: 440px;
    max-width: 440px;
    height: 98px;
  }
}
@media screen and (min-width: 1200px){
  .fixed-page-text .company-title-title.title-template01.title-template02 h2 span::after{
    
  }
}
@media screen and (min-width: 1500px){
  .fixed-page-text .company-title-title.title-template01.title-template02 h2 span::after{
    width: 700px;
    max-width: 700px;
    height: 157px;
    max-height: 164px;
    bottom: -10px;
  }
}

/*----------------------------
        [company]タイトルここまで
-----------------------------*/

/*----------------------------
        [company]代表挨拶
-----------------------------*/
@media screen and (min-width: 768px){
  .company-message-card figure figcaption{
    font-size: 20px;
  }
  .company-message-text h3{
    font-size: 32px;
  }
  .company-message-text h3 br{
    display: none;
  }
  .company-message-title.sub-title.js-reveal-title.title-template02 h2 span::after{
    transform: translateY(30px);
  }
  .company-message-title.sub-title.js-reveal-title.title-template02.is-animated h2 span::after{
    transform: translateY(5px);
  }
}
@media screen and (min-width: 1200px){
  .company-message-card{
    display: grid;
    grid-template-columns: 1fr 1.25fr;
  }
  .company-message-grid .company-message-card:last-child{
    grid-template-columns: 1.25fr 1fr;
  }
  .company-message-grid .company-message-card:last-child figure{
    order: 2;
  }
  .company-message-grid .company-message-card:last-child .company-message-text{
    order: 1;
  }
  .company-message-title.title-template01 h2{
    max-width: 428px;
    text-align: end;
  }
  .company-message-title.title-template01 h2 span::after{
    left: auto;
    right: 0;
  }
  .company-message-card figure img{
    width: 60%;
  }
  .company-message-grid{
    gap: 40px;
  }
}
@media screen and (min-width: 1500px){
  .company-message-card{
    max-width: 1000px;
    margin: 0 auto;
    grid-template-columns: 1fr 1.5fr;
  }
  .company-message-grid .company-message-card:last-child{
    grid-template-columns: 1.5fr 1fr;
  }
  .company-message-grid .company-message-card:first-child figure{
    padding-right: 55px;
  }
  .company-message-grid .company-message-card:last-child figure{
    padding-left: 55px;
  }
  .company-message-card figure img{
    width: 100%;
  }
  .company-message-card figure figcaption{
    font-size: 24px;
    bottom: 115px;
  }
  .company-message-grid .company-message-card:first-child figure figcaption{
    left: calc((1400px - 1000px) * -1 / 2);
  }
  .company-message-grid .company-message-card:last-child figure figcaption{
    left: auto;
    right: calc((1400px - 1000px) * -1 / 2);
  }
  .company-message-title.title-template01 h2 span::after{
    width: 428px;
    height: 93px;
    max-width: 428px;
  }
}

/*----------------------------
        [company]代表挨拶ここまで
-----------------------------*/

/*----------------------------
        [company]会社概要
-----------------------------*/
@media screen and (min-width: 768px){
  .company-profile-table tr{
    font-size: 20px;
    grid-template-columns: 1fr 3fr;
  }
  .company-profile-table tr td:last-child{
    padding-left: 6.5% !important;
  }
  .company-profile-table tr td span{
    display: inline-block;
  }
  .company-profile-table tr td br:not(.profile-br){
    display: none;
  }
}
@media screen and (min-width: 1000px){
  .company-profile-table tr{
    grid-template-columns: 170px 1fr;
  }
}
@media screen and (min-width: 1200px){
  .company-profile-map iframe{
    max-height: 420px;
  }
  .company-profile-table tr td:first-child{
    justify-content: center;
  }
  .company-profile-table tr{
    grid-template-columns: 140px 1fr;
  }
  .company-profile-table tr td:first-child::after{
    display: none;
  }
  .company-profile-table tr td:last-child{
    position: relative;
    padding-left: 75px !important;
  }
  .company-profile-table tr td:last-child::after{
    content: "";
    width: 35px;
    height: 1px;
    background-color: #00FFA2;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%) rotate(-25deg);
    z-index: 1;
  }
  .company-profile-title.title-template01 h2 span::after{
    width: 314px;
    height: 80px;
    max-width: 314px;
    top: -65px;
  }
}

/*----------------------------
        [company]会社概要ここまで
-----------------------------*/

/*----------------------------
    [company]取引先企業一覧
-----------------------------*/
@media screen and (min-width: 768px){
  .company-client-list-text blockquote{
    font-size: 20px;
  }
}
@media screen and (min-width: 1200px){
  .company-client-list-title.title-template01 h2 span::after{
    width: 500px;
    height: 82px;
    max-width: 500px;
    top: -66px;
  }
  .company-client-list-text{
    margin-bottom: 60px;
    padding: 20px 45px;
  }
  .company-client-list-text blockquote{
    display: flex;
    flex-wrap: wrap;
  }
  .company-client-list-text blockquote span{
    
  }
  .client-list-sp{
    display: none;
  }
  .client-list-pc{
    display: block;
  }
}

/*----------------------------
  [company]取引先企業一覧ここまで
-----------------------------*/

/*----------------------------
  [company]沿革
-----------------------------*/
@media screen and (min-width: 768px){
  .timeline .event{
    font-size: 20px;
    gap: 20px;
    padding-left: 33px;
    
  }
  .timeline .event:after{
    height: 20px;
    width: 20px;
  }
}
@media screen and (max-width: 767px){
  .timeline .event{
    flex-direction: column;
    
  }
}
@media screen and (min-width: 1200px){
  .timeline .event{
    font-size: 24px;
  }
  .company-history-title.title-template01 h2 span::after{
    width: 350px;
    height: 98px;
    max-width: 350px;
    top: -65px;
  }
}

/*----------------------------
  [company]沿革ここまで
-----------------------------*/

/*----------------------------
  [company]里組の取り組み
-----------------------------*/
@media screen and (min-width: 768px){
  .company-initiatives-content{
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
  }
  .company-initiatives-h1 h1{
    font-size: 32px;
  }
  .company-initiatives-h1 span{
    font-size: 48px;
  }
  .company-initiatives-img{
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
  }
  .company-initiatives-img h5{
    font-size: 30px;
  }
  .c-i-container{
    max-width: 840px;
    width: 88%;
    margin: 0 0 0 auto;
  }
  .company-initiatives-card, 
  .company-initiatives-h1{
    margin-bottom: 40px;
  }
  .company-initiatives-card blockquote{
    font-size: 20px;
  }
  .company-initiatives-more.btn-template01 a{
    background: url(../img/icon/view-more-tab.png) no-repeat center / contain;
    max-width: 920px;
    padding: 17px 0;
    width: 730px;
  }
}
@media screen and (min-width: 1200px){
  .company-initiatives-title.title-template01 h2 span::after{
    width: 480px;
    height: 79px;
    max-width: 480px;
    top: -66px;
  }
  .company-initiatives-h1 h1{
    font-size: 48px;
  }
  .company-initiatives-h1 span{
    font-size: 64px;
  }
  .company-initiatives-img h5{
    font-size: 40px;
  }
  .company-initiatives-card blockquote{
    font-size: 24px;
  }
  .company-initiatives-img figure{
    width: 300px;
    max-width: 300px;
    height: 300px;
  }
  .company-initiatives-img figure img{
    max-height: 280px;
  }
  .company-initiatives-more.btn-template01 a{
    padding: 19px 0;
        width: 840px;
  }
  .company-initiatives-more.btn-template01 a .arrow-icon{
    font-size: 24px;
  }
  
  .company-initiatives-content.c-padding {
    padding-top: 50px;
}
}
@media screen and (min-width: 1700px){
  .company-initiatives-content{
    padding-top: 25px;
  }
}

/*----------------------------
  [company]里組の取り組みここまで
-----------------------------*/

/*----------------------------
        [service]タイトル
-----------------------------*/
@media screen and (min-width: 768px){
  .fixed-page-text .service-title-title.title-template01.title-template02 h2 span::after{
    width: 350px;
    max-width: 350px;
    height: 85px;
  }
}
@media screen and (min-width: 1000px){
  .fixed-page-text .service-title-title.title-template01.title-template02 h2 span::after{
    width: 440px;
    max-width: 440px;
    height: 98px;
  }
}
@media screen and (min-width: 1500px){
  .fixed-page-text .service-title-title.title-template01.title-template02 h2 span::after{
    width: 700px;
    max-width: 700px;
    height: 157px;
    max-height: 164px;
    bottom: 15px;
  }
}

/*----------------------------
        [service]タイトルここまで
-----------------------------*/

/*----------------------------
        [service]型枠工事の流れ
-----------------------------*/
@media screen and (min-width: 768px){
  .service-formwork-img{
    flex-direction: row;
  }
  .service-formwork-img h3{
    width: 45%;
    text-align: center;
    padding-top: 55px;
        z-index: 1;
  }
  .service-formwork-img figure{
    width: 55%;
  }
  .service-formwork-img figure img{
    width: 100%;
    height: 250px;
  }
  .service-formwork-img h3::before{
    background-position: top;
  }
  .service-formwork-card{
    padding-bottom: 50px;
  }
  .service-formwork-grid .service-formwork-card:first-child .service-formwork-img h3::before, 
  .service-formwork-grid .service-formwork-card:nth-child(2) .service-formwork-img h3::before, 
  .service-formwork-grid .service-formwork-card:nth-child(3) .service-formwork-img h3::before, 
  .service-formwork-grid .service-formwork-card:nth-child(4) .service-formwork-img h3::before, 
  .service-formwork-grid .service-formwork-card:nth-child(5) .service-formwork-img h3::before, 
  .service-formwork-grid .service-formwork-card:nth-child(6) .service-formwork-img h3::before, 
  .service-formwork-grid .service-formwork-card:last-child .service-formwork-img h3::before{
    background-position: top;
    max-width: 260px;
        height: 96px;
        bottom: auto;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        z-index: -1;
  }
  .service-formwork-card > blockquote, 
  .service-formwork .l-container > blockquote{
    font-size: 20px;
  }
  .service-formwork-grid {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .service-formwork-content .l-container{
    max-width: 1000px;
  }
  .service-formwork .l-container > blockquote, 
  .service-formwork .l-container > a figure{
    max-width: 600px;
    margin: 0 auto;
  }
  .service-formwork-title.title-template01{
    text-align: center;
  }
  .service-formwork-title.title-template01 h2 span::after{
    left: 50%;
    transform: translateX(-50%);
  }
}
@media screen and (min-width: 1200px){
  .service-formwork-card > blockquote, 
  .service-formwork .l-container > blockquote{
    font-size: 24px;
  }
  .service-formwork-card{
    padding-bottom: 85px;
  }
  .service-formwork-grid{
    padding-top: 85px;
  }
  .service-formwork-card > blockquote{
    padding-bottom: 15px;
  }
  .service-formwork-topimg{
        max-width: 1000px;
    margin: 0 auto;
  }
  .service-formwork-topimg img{
    max-height: 730px;
    object-fit: cover;
  }
}
@media screen and (min-width: 1500px){
  .service-formwork-topimg{
        max-width: 1400px;
  }
  .service-formwork-card{
    padding-bottom: 95px;
  }
  .service-formwork-grid{
    padding-top: 95px;
  }
}

/*----------------------------
        [service]型枠工事の流れここまで
-----------------------------*/

/*----------------------------
    [news-project]タイトル
-----------------------------*/
@media screen and (min-width: 768px){
  .fixed-page-text .news-project-title-title.title-template01 h2 span::after{
    width: 350px;
    max-width: 350px;
    height: 85px;
  }
}
@media screen and (min-width: 1000px){
  .news-project-title-title.title-template01 h2 span::after{
    width: 450px;
        max-width: 450px;
        height: 142px;
        max-height: 150px;
        bottom: -10px;
  }
}
@media screen and (min-width: 1500px){
  .news-project-title-title.title-template01 h2 span::after{
    width: 700px;
    max-width: 700px;
    height: 157px;
    max-height: 164px;
    bottom: 15px;
  }
}
/*----------------------------
    [news-project]タイトルここまで
-----------------------------*/

/*----------------------------
    [news-project]施工事例
-----------------------------*/
@media screen and (min-width: 1000px){
  .news-project-flex-title{
    display: block;
    width: 30%;
  }
  .news-project-flex{
    display: flex;
  }
  .news-project-wrap{
    width: 70%;
    padding-left: 30px;
  }
  .news-project-flex-title .title-template01.title-template02{
    text-align: end;
  }
  #tab-1 .news-project-list-title.title-template01 h2 span::after{
    background: url(../img/news-project/title-project02.svg) no-repeat right / contain;
    left: auto;
    right: 0;
  }
  #tab-2 .news-project-list-title.title-template01 h2 span::after{
    background: url("../img/news-project/title-news.svg") no-repeat right / contain;
    left: auto;
    right: 0;
  }
  .news-project-list .l-container > .news-project-list-title{
    display: none;
  }
}
@media screen and (min-width: 1200px){
  .news-project-grid{
    display: grid;
    /* ↓ repeat(2, 1fr) ではなく minmax(0, 1fr) を指定します */
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px;
    width: 100%;
  }
  .tab-container ul li{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    width: 240px;
    flex: none;
    padding: 16px 0;
  }
  .tab-container ul{
    justify-content: flex-end;
  }
  .news-project-list .l-container{
    max-width: 1000px;
  }
}
@media screen and (min-width: 1500px){
  .news-project-list .l-container{
    max-width: 1400px;
  }
  .news-project-grid{
    row-gap: 30px;
    column-gap: 40px;
  }
}

/*----------------------------
    [news-project]施工事例ここまで
-----------------------------*/

/*----------------------------
    [single]投稿詳細
-----------------------------*/
@media screen and (min-width: 768px){
  .single-title.fixed-page-template::after{
    display: none;
  }
  .single-btn{
    justify-content: center;
    align-items: center;
    gap: 25px;
  }
  .single-btn a{
    font-size: 20px;
    padding: 10px 40px;
  }
  .single-detail-text{
    max-width: 1000px;
    margin: 0 auto;
  }
  .single-time-title time span{
    font-size: 20px;
  }
  .single-btn .single-prev span::before{
    top: 50%;
    transform: translateY(-50%);
  }
  .single-btn .single-next span::after{
    top: 50%;
    transform: translateY(-50%) rotate(180deg);
  }
}
@media screen and (min-width: 1200px){
  .fixed-page-text .single-time-title{
    display: flex;
    flex-direction: row;
    gap: 25px;
  }
  .single-title-grid.fixed-page-grid{
    grid-template-columns: 1fr;
  }
  .single-title-text.fixed-page-text .l-container{
    padding-left: 0;
  }
}
@media screen and (min-width: 1500px){
  .single-time-title time span, 
  .single-time-title p, 
  .single-btn a{
    font-size: 24px;
  }
  .single-title .fixed-page-container-pc.l-container{
    margin: 0 auto;
    width: 1400px;
  }
  .single-title-grid.fixed-page-grid::before{
    right: calc(50% - 50vw);
  }
}

/*----------------------------
    [single]投稿詳細ここまで
-----------------------------*/

/*----------------------------
    [recruit]タイトル
-----------------------------*/
@media screen and (min-width: 768px){
  #recruit-title .fixed-page-grid{
    grid-template-columns: 1fr;
  }
  .recruit-title-img::before, 
  .recruit-title-img::after, 
  .recruit-title-img figure figcaption, 
  .recruit-title.fixed-page-template::after{
    display: none;
  }
  #recruit-title .fixed-page-grid::before{
    background: url(../img/icon/stripe-tb-fixed-title.png) no-repeat top right / contain;
    right: calc(50% - 50vw);
  }
  .fixed-page-text .recruit-title-title.title-template01.title-template02 h2 span::after{
    background: url("../img/recruit/title-recruitment.png") no-repeat left / contain;
    width: 500px;
        max-width: 500px;
        height: 75px;
        bottom: calc(100% - 22px);
  }
  #recruit-title .fixed-page-text-p-sp p{
    display: block;
  }
  .recruit-title-img figure img.craft-img{
    width: 55%;
  }
}
@media screen and (min-width: 1200px){
  #recruit-title .fixed-page-text-p-sp{
    max-width: 1000px;
    text-align: center;
    padding-left: 0;
  }
  .r-t-br-pc{
    display: block;
  }
  #recruit-title .recruit-title-img figure{
    display: flex;
    justify-content: end;
  }
  .recruit-title-img figure img:not(.craft-img){
    width: 80%;
  }
  #recruit-title .recruit-title-img{
    position: relative;
    /*top: -103px;*/
    margin-top: -103px;
    z-index: 100;
  }
  
}
@media screen and (min-width: 1500px){
  .fixed-page-text .recruit-title-title.title-template01.title-template02 h2 span::after{
    background: url("../img/recruit/title-recruitment.png") no-repeat left / contain;
    width: 900px;
        max-width: 900px;
        height: 133px;
    max-height: 133px;
  }
  #recruit-title .fixed-page-container-pc.l-container{
    max-width: 1400px;
        margin: 0 auto;
  }
}

/*----------------------------
    [recruit]タイトルここまで
-----------------------------*/

/*----------------------------
    [recruit]先輩の声
-----------------------------*/
@media screen and (min-width: 768px){
  .recruit-voice .about-features-grid{
    grid-template-columns: 1fr;
  }
  .voice-sp{
    display: none;
  }
  .voice-pc{
    display: block;
  }
  .recruit-voice-card.about-features-card figure img{
    height: auto;
  }
}
@media screen and (min-width: 1000px){
  .recruit-voice .about-features-grid{
    grid-template-columns: repeat(3, 1fr);
  }
}
@media screen and (min-width: 1200px){
  .recruit-voice-bg{
    /*background-size: cover;*/
    background: none;
    padding-bottom: 30px;
    padding-top: 170px;
    position: relative;
  }
  .recruit-voice-title p{
    font-size: 24px;
  }
  .recruit-voice-title{
    gap: 50px;
  }
  .recruit-voice{
    padding-bottom: 0;
  }
  .recruit-voice-title.title-template01.title-template02 h2 span::after{
    width: 280px;
    height: 80px;
    max-width: 314px;
    top: -68px;
  }
  
  
  .recruit-voice-bg::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../img/recruit/voice00.webp) no-repeat center/cover;

    -webkit-mask-image: linear-gradient(
      to bottom, 
      transparent 0%, 
      black 15%, 
      black 85%, 
      transparent 100%
    );
    mask-image: linear-gradient(
      to bottom, 
      transparent 0%, 
      black 15%, 
      black 85%, 
      transparent 100%
    );

    z-index: 1;
  }
  .recruit-voice .l-container{
    position: relative;
      z-index: 2;
    /*padding-bottom: 25px;*/
  }
}
@media screen and (min-width: 1920px){
  .recruit-voice-bg{
    max-width: 1920px;
    margin: 0 auto;
    padding-top: 200px;
  }
}

/*----------------------------
    [recruit]先輩の声ここまで
-----------------------------*/

/*----------------------------
    [recruit]数字で見る
-----------------------------*/
@media screen and (min-width: 1000px){
  .recruit-testimonials-grid{
    grid-template-columns: repeat(4, 1fr);
  }
}
@media screen and (min-width: 1200px){
  .recruit-testimonials{
    padding-top: 150px;
  }
  .recruit-testimonials-title.title-template01 h2 span::after{
    width: 608px;
    height: 77px;
    max-width: 608px;
    top: -60px;
  }
}
@media screen and (min-width: 1500px){
  .recruit-testimonials-card figure{
    aspect-ratio: auto;
    height: 180px;
  }
  .recruit-testimonials-text{
    padding-top: 10px;
  }
  .recruit-testimonials-text h6{
    font-size: 32px;
  }
  .recruit-testimonials-text p{
    font-size: 40px;
    line-height: .7;
  }
  .recruit-testimonials-text p .count-up, 
  .recruit-testimonials-text p .testimonials-large{
    font-size: 80px;
  }
  .recruit-testimonials-card{
    height: 380px;
  }
  .recruit-testimonials-grid .recruit-testimonials-card:nth-child(even) .recruit-testimonials-text p{
    position: relative;
    top: 20px;
  }
  .recruit-testimonials-grid .recruit-testimonials-card:last-child .recruit-testimonials-text p span:first-child{
    margin-right: 20px;
  }
}

/*----------------------------
    [recruit]数字で見るここまで
-----------------------------*/

/*----------------------------
    [recruit]募集要項・福利厚生
-----------------------------*/
@media screen and (min-width: 768px){
  .recruit-details-grid{
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 10px;
  }
  .recruit-benefits-container{
    max-width: 900px;
    margin: 0 auto;
  }
  .recruit-benefits-title{
    margin-bottom: 50px;
  }
  .recruit-details-more.btn-template01 a{
    padding: 2px 0;
    width: 454px;
    background: url(../img/icon/view-more-tab.png) no-repeat center / contain;
  }
}
@media screen and (min-width: 1000px){
  .recruit-details-more.btn-template01 a{
    width: 596px;
    font-size: 32px;
  }
}
@media screen and (min-width: 1200px){
  .recruit-details-more.btn-template01 a{
    width: 100%;
    font-size: 40px;
  }
}
@media screen and (min-width: 1500px){
  .recruit-details-more.btn-template01 a{
    padding: 11px 0;
  }
}

/*----------------------------
    [recruit]募集要項・福利厚生ここまで
-----------------------------*/

/*----------------------------
    [partner]タイトル
-----------------------------*/
@media screen and (min-width: 768px){
  .partner-title-grid.fixed-page-grid{
    padding: 25px 0 0;
  }
  .partner-title-text.fixed-page-text p{
    display: block;
  }
  .partner-title .l-container > .l-container.fixed-page-text-p-sp p{
    display: none;
  }
  .partner-title-img.fixed-page-img{
    display: flex;
    align-items: end;
  }
  .partner-title-text.fixed-page-text .l-container{
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-bottom: 20px;
  }
  .partner-title.fixed-page-template::after{
    display: none;
  }
  
}
@media screen and (min-width: 1200px){
  .partner-title-special{
    height: 400px;
  }
  .partner-about{
    padding-top: 50px;
  }
  .partner-about-title.title-template01 h2 span::after{
    width: 289px;
    height: 70px;
    max-width: 314px;
    top: -58px;
  }
}
@media screen and (min-width: 1500px){
  .partner-title-special{
    height: 500px;
  }
  .partner-title .l-container .partner-title-special{
    display: none;
  }
  .p-t-s-pc.partner-title-special{
    display: flex;
  }
}

/*----------------------------
    [partner]タイトルここまで
-----------------------------*/

/*----------------------------
    [partner]パートナー様へ
-----------------------------*/
@media screen and (min-width: 768px){
  .partner-for .about-features-grid{
    grid-template-columns: 1fr;
  }
}
@media screen and (min-width: 1000px){
  .partner-for .about-features-grid{
    grid-template-columns: repeat(3, 1fr);
  }
  .partner-for-bg{
    padding-bottom: 50px;
  }
  .partner-for-title{
    max-width: 1000px;
    margin: 0 auto;
  }
  .partner-for-title h1{
    font-size: 40px;
  }
  .partner-for-title h1 span{
    font-size: 60px;
  }
}
@media screen and (min-width: 1500px){
  .partner-for-bg{
    padding-top: 111px;
    padding-bottom: 111px;
  }
}
/*----------------------------
    [partner]パートナー様へここまで
-----------------------------*/

/*----------------------------
    [partner]ポイント
-----------------------------*/
@media screen and (min-width: 768px){
  .partner-point-grid{
    display: grid;
    grid-template-columns: 1fr 300px;
  }
  .partner-point-title.title-template01 h2::after{
    bottom: 30px;
    left: 65%;
    max-width: 400px;
  }
  .p-p-c-reverse .partner-point-title.title-template01 h2{
    text-align: end;
  }
  .p-p-c-reverse .point02.partner-point-title.title-template01 h2 span::after{
    left: auto;
    right: 0;
  }
  .p-p-c-reverse .point02.partner-point-title.title-template01 h2::after{
    left: auto;
        right: 65%;
        transform: rotate(180deg);
  }
  .partner-point-wrap{
    max-width: 1000px;
    margin: 0 auto;
  }
  .partner-point-card p{
    font-size: 20px;
  }
  .partner-point{
    position: relative;
  }
  .partner-point::after{
    content: "";
    width: 50%;
    height: 100%;
    background: url("../img/icon/stripe-top-about.png") no-repeat right/contain;
    position: absolute;
    top: 50%;
    right: calc(50% - 50vw);
    transform: translateY(-50%);
    z-index: -1;
  }
  
  .partner-voice-title.sub-title.js-reveal-title.title-template02.is-animated h2 span::after{
    transform: translateY(15px);
  }
}

/*----------------------------
    [partner]ポイントここまで
-----------------------------*/

/*----------------------------
    [partner]パートナー様の声
-----------------------------*/
@media screen and (min-width: 768px){
  .partner-voice .about-features-grid{
    grid-template-columns: 1fr;
  }
  .partner-voice .partner-voice-title p{
    font-size: 20px;
    margin-top: 25px;
  }
  .sdgs-initiative-title.title-template01 h2 span br{
    display: none;
  }
  
  .sdgs-initiative-title.title-template01 h2 span br {
        display: none !important;
    }
    
    /* 1行になるので、SVGの高さをPC用に微調整する場合 */
    .sdgs-initiative-title.title-template01 h2 span::after {
        height: 80px; /* PCサイズ */
        top: -60px;
    }
  
  .sdgs-initiative-title.sub-title.js-reveal-title.title-template02.is-animated h2 span::after{
    transform: translateY(15px);
  }
}
@media screen and (min-width: 1000px){
  .partner-voice .about-features-grid{
    grid-template-columns: repeat(3, 1fr);
  }
}
@media screen and (min-width: 1200px){
  .partner-point-title.title-template01 h2 span::after{
    width: 308px;
    height: 78px;
    max-width: 314px;
    top: -55px;
  }
  .partner-point-wrap .partner-point-card:not(:first-child){
    padding-top: 70px;
  }
  .partner-point-title.title-template01 h2::after{
    left: 50%;
  }
  .p-p-c-reverse .point02.partner-point-title.title-template01 h2::after{
    right: 50%;
  }
}
@media screen and (min-width: 1500px){
  .partner-voice .about-features-card-text h6 br{
    display: block;
  }
}

/*----------------------------
    [partner]パートナー様の声ここまで
-----------------------------*/

/*----------------------------
    [sgds]タイトルここまで
-----------------------------*/
@media screen and (min-width: 768px){
  .sdgs-title > .l-container{
    max-width: 1000px;
  }
  .sdgs-title-text > blockquote{
    font-size: 20px;
  }
  .sdgs-title-border figure{
    display: flex;
    justify-content: center;
  }
  .sdgs-title-border figure img{
    max-width: 600px;
  }
}
@media screen and (min-width: 1200px){
  .sdgs-title-group h6, 
  .sdgs-title-border h6{
    font-size: 32px;
  }
  .sdgs-title-group h6 span{
    font-size: 48px;
  }
  .sdgs-title-group{
    margin-bottom: 150px;
    position: relative;
  }
  .sdgs-title-group::after{
    content: "";
    background: url(../img/icon/stripe-pc-fixed-title.png) no-repeat top right / contain;
    width: 100%;
    height: 100%;
    position: absolute;
    top: calc(var(--ark-header_height) * -1);
    right: calc(50% - 50vw);
    z-index: 0;
  }
  .sdgs-title-group figure img{
    max-width: 843px;
  }
  .sdgs-title-bg::after{
    background: url("../img/sdgs/title-wood-pc.webp") no-repeat right / contain;
    bottom: -10%;
  }
  .sdgs-title-text > blockquote{
    font-size: 24px;
  }
  .sdgs-title-text{
    gap: 65px;
  }
  .sdgs-title-border blockquote{
    margin: 15px 0 20px;
  }
  .sdgs-title-bg{
    margin-bottom: 70px;
  }
  .sdgs-title .l-container > figure img{
    width: 100%;
    max-width: 600px;
  }
  
  
  .sdgs-title::before{
    display: none;
  }
  .sdgs-title-bg::before{
    -webkit-mask-image: linear-gradient(
    to bottom, 
    transparent 0%, 
    black 15%, 
    black 85%, 
    transparent 100%
  );
  mask-image: linear-gradient(
    to bottom, 
    transparent 0%, 
    black 15%, 
    black 85%, 
    transparent 100%
  );
  }
}
@media screen and (min-width: 1500px){
  .sdgs-title-bg::after{
    bottom: -18%;
  }
  .sdgs-title-group{
    margin-bottom: 220px;
  }
  .sdgs-title-text > blockquote{
    font-size: 32px;
  }
  .sdgs-title .l-container > figure img{
    max-width: 700px;
  }
}

/*----------------------------
    [sgds]タイトルここまで
-----------------------------*/

/*----------------------------
    [sgds]initiative(取り組み)
-----------------------------*/
@media screen and (min-width: 768px){
  .sdgs-initiative-container{
    max-width: 1000px;
    margin: 0 auto;
    padding-top: 60px;
  }
  .sdgs-initiative-card h6 br{
    display: none;
  }
  .sdgs-initiative-title.title-template01 h2 span::after{
    width: 500px;
    height: 70px;
    max-width: 500px;
    top: -66px;
  }
  .sdgs-initiative > .l-container{
    gap: 60px;
  }
  .sdgs-initiative-grid blockquote{
    font-size: 20px;
  }
}
@media screen and (min-width: 1200px){
  .sdgs-initiative-title.title-template01 h2 span::after{
    width: 700px;
    height: 95px;
    max-width: 700px;
    top: -90px;
  }
  .sdgs-initiative-container{
    padding-top: 90px;
  }
  .sdgs-initiative .title-template01 h2{
    font-size: 32px;
  }
  .sdgs-initiative-grid{
    grid-template-columns: 545px 1fr;
    gap: 0;
  }
  .sdgs-initiative-grid blockquote{
    order: 1;
    font-size: 24px;
  }
  .sdgs-initiative-grid figure{
    order: 2;
  }
  .sdgs-initiative-grid figure img{
    max-width: 120px;
  }
  .sdgs-initiative-wrap{
    margin-bottom: 50px;
  }
  .sdgs-initiative-text{
    padding: 30px;
  }
  .sdgs-initiative-text ul{
    font-size: 32px;
  }
  .sdgs-initiative > .l-container{
    gap: 100px;
  }
}

/*----------------------------
    [sgds]initiative(取り組み)ここまで
-----------------------------*/

/*----------------------------
    [sgds]SDGs宣言
-----------------------------*/
@media screen and (min-width: 768px){
  .sdgs-declaration-wrap ul li br{
    display: none;
  }
}
@media screen and (min-width: 1200px){
  .sdgs-declaration-wrap{
    max-width: 1100px;
    margin: 0 auto;
  }
  .sdgs-declaration-wrap ul li{
    font-size: 28px;
  }
}
@media screen and (min-width: 1500px){
  .sdgs-declaration-wrap h1{
    font-size: 48px;
  }
  .sdgs-declaration-wrap h1 span{
    font-size: 104px;
  }
  .sdgs-declaration-wrap ul{
    gap: 50px;
  }
  .sdgs-declaration-wrap ul li{
    font-size: 32px;
  }
  .sdgs-declaration-wrap ul li:last-child{
    
  }
  .sdgs-declaration-wrap ul li:last-child::before{
    top: calc(50% - 7px);
  }
  .sdgs-declaration-wrap ul li::before{
    font-size: 56px;
  }
  .sdgs-declaration-wrap{
    padding: 40px;
  }
  .sdgs-declaration{
    min-height: 900px;
  }
}

/*----------------------------
    [sgds]SDGs宣言ここまで
-----------------------------*/

/*----------------------------
    [contact]お問い合わせ
-----------------------------*/
@media screen and (min-width: 768px){
  .form-progress-pc{
    display: grid;
  }
  .form-progress-sp{
    display: none;
  }
  .form-progress-grid figure figcaption{
    font-size: 24px;
  }
  #contact-form > .l-container, 
  .contact-end-container{
    max-width: 1000px;
    margin: 0 auto;
  }
  .contact-thanks-title.fixed-page-template::after{
    display: none;
  }
  .contact-thanks-container{
    margin: 0 auto;
    max-width: 800px;
  }
  .contact-thanks-container blockquote{
    font-size: 24px;
  }
  .contact-thanks-title-grid.fixed-page-grid::before{
    right: calc(50% - 50vw);
  }
  .fixed-page-text .contact-title-title.title-template01.title-template02 h2 span br{
    display: block;
  }
  .fixed-page-text .contact-title-title.title-template01.title-template02 h2 span::after{
    bottom: calc(100% - 25px);
  }
  .form-contact-title.sub-title.js-reveal-title.title-template02.is-animated h2 span::after, 
  .form-entry-title.sub-title.js-reveal-title.title-template02.is-animated h2 span::after{
    transform: translateY(15px);
  }
}
@media screen and (min-width: 1000px){
  .form-row{
    display: grid;
    grid-template-columns: 1fr 2fr;
  }
  .form-label{
    align-items: flex-start;
  }
  .form-label .hissu{
    margin-top: 7px;
  }
  .form-mail-group .form-label br{
    display: block;
  }
  .form-zip-pc-flex{
    display: flex;
    align-items: baseline;
    gap: 20px;
  }
  .form-input.form-zip-pc input[name="c-zip"], 
  .form-input.form-zip-pc input[name="e-zip"]{
    width: 200px !important;
  }
  .policy-check{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
  }
  .policy-check .hissu{
    display: flex;
        align-items: center;
        height: max-content;
  }
  .policy-scroll-wrap .hissu{
    display: none;
  }
  .policy-check .mwform-checkbox-field-text{
    font-size: 24px;
  }
  .contact-form-check .form-input{
    display: flex;
    flex-direction: row;
    align-items: center;
  }
  .contact-tab-nav{
    display: flex;
  }
  .tab-btn{
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 15px;
    width: 300px;
  }
  
  .contact-end-tel{
    gap: 20px;
    padding: 40px 0;
  }
  .contact-end-tel h3{
    font-size: 48px;
  }
  .contact-end-tel h1{
    font-size: 72px;
  }
  .contact-end-tel p{
    font-size: 32px;
  }
  .fixed-page-text .contact-title-title.title-template01.title-template02 h2 span br{
    display: none;
  }
  .fixed-page-text .contact-title-title.title-template01.title-template02 h2 span::after{
    width: 444px;
    max-width: 444px;
    height: 96px;
  }
}
@media screen and (min-width: 1200px){
  .contact-koumoku .koumoku h6, 
  .naiyou label span{
    font-size: 24px;
  }
  .contact-form .address-search .address-search-p{
    font-size: 16px;
  }
  .address-search-flex > div{
    display: flex;
    align-items: baseline;
    gap: 20px;
  }
  div[data-name="contact-address-number"] input{
    max-width: 200px;
  }
  .form-entry-title.title-template01 h2 span::after{
    width: 252px;
    height: 96px;
    top: -55px;
  }
  .form-contact-title.title-template01 h2 span::after{
    width: 379px;
    height: 75px;
    max-width: 379px;
    top: -60px;
  }
  .contact-tab-nav{
    
    margin-bottom: 70px;
  }
  .contact-thanks-container blockquote{
    font-size: 32px;
  }
}
@media screen and (min-width: 1500px){
  .fixed-page-text .contact-title-title.title-template01.title-template02 h2 span::after{
    width: 592px;
        max-width: 592px;
        height: 128px;
        max-height: 128px;
  }
}

/*----------------------------
    [contact]お問い合わせここまで
-----------------------------*/

/*----------------------------
      [footer]ウィジェット
-----------------------------*/
@media screen and (min-width: 768px){
  .footer-logo figure img{
    max-width: 80px;
  }
  .footer-logo h6{
    font-size: 48px;
  }
  .footer-tel figure img{
    width: 45px;
    max-width: 45px;
  }
  .footer-tel h6{
    font-size: 44px;
  }
  .footer-company > p{
    font-size: 24px;
  }
  .footer-place p{
    font-size: 24px;
  }
  .footer-place p br{
    display: none;
  }
  .footer-place p:last-child{
    width: 531px;
  }
  #footer .u-flex--c{
    display: flex;
  }
}
@media screen and (min-width: 1200px){
  #footer .btn-template01 a .arrow-icon{
    
  }
  .l-footer__widgets{
    padding: 5rem 0;
  }
  .footer-logo{
    margin-bottom: 22px;
  }
  .footer-tel{
    margin-bottom: 5px;
  }
  .footer-company > p{
    margin-bottom: 35px;
  }
  .footer-btn.btn-template01{
    margin-top: 60px;
  }
}

/*----------------------------
    [footer]ウィジェットここまで
-----------------------------*/