@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
@charset "UTF-8";
/* ========================================
    ヘッダー
========================================= */
*{
    font-family:'Noto Sans JP',sans-serif;
    letter-spacing: .1rem;
    font-size: 16px;
}

p{
    margin: 0;
}
@media screen and (min-width: 981px) {
    .sp{
        display: none;
    }
    html,body{
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        color: #222222;
    }
    .lp{
        margin: 0;
    }
    title{
        margin-top: 0;
    }
    #header{
        margin: 0;
    }
    .header{
        width: 100%;
        height:1.5rem;
        display:flex;
        align-items: center;
        padding: .8rem;
        background-color: transparent;
        position: fixed;
        margin-top: 0px;
        z-index: 3;
    }
    .lp_logo{
        position: relative;
        margin:0 auto 0 2rem;
        width: 8rem;
        height: 1.5rem;
        background-image: url("image/top/lp_logo3.png");
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }
    h1{
        display: none;
        margin: 0;
    }
    .lp-body{
        width: 100%;
        color: #222222;
        font-family: 'Noto Sans JP',sans-serif;
        box-sizing: border-box;
    }
    /*ヘッダー　トップ画像以外は↓クラスを付与し背景色変える*/
    .change-color{
        background-color: #fff;
		opacity:0.8;
        transition: 0.3s;
        border-bottom: solid .5px #dadada;
        color: #222222;
    }
    .change-color a{
        color: #222222 !important;
    }
    .change-color .dli-chevron-down {
        color: #828282 !important;
    }
    .change-color .lp_logo{
        background-image: url("image/top/lp_logo.png");
        background-repeat: no-repeat;
        width: 8.5rem;
        height: 2rem;
    }
    
    /*↑ヘッダー　トップ画の時のcssここまで*/
    
    .lp_logo3{
        display: none;
    }
    /* ヘッダー pcナビゲーション */
    .lpnav{
	    width: 50%;
        margin-left: auto;
    }
    
    .lpnav > ul{
	    display:flex;
	    margin-top:1rem;
        margin-right: 4rem;
    }

    .lpnav-li{
	    color:#fff;
	    padding:0 1rem;
	    border-left:1px solid #dadada;
	    text-decoration:none;
	    position: relative;
        transition: all .3s;
	    font-size:.8rem;    
	    height:2rem;
	    letter-spacing:0.1rem;
        list-style: none;
        flex-grow: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }
    /*ホバー時のアンダーライン*/
    .lpnav-li::after{
        position: absolute; /*親要素であるaタグを基準に位置を指定*/
        left: 0;
        bottom: -.6rem;            /*アンダーラインを各メニュー（aタグ）の左端に指定*/
        content: '';        /*本来は、擬似要素に入るテキストなどを’’内に指定。今回はアンダーラインなので何も記載しない*/
        width: 100%;        /*アンダーラインを各aタグの幅に合わせる*/
        height: 3px;        /*アンダーラインの高さ（太さ）*/
        background: #C83131;/*アンダーラインの色*/
        transform: scale(0,1);
        transform-origin: left top;
        transition: transform 0.3s;    
    }
    .lpnav-li:hover::after {
        transform: scale(1,1);/*ホバー後、ｘ軸方向に1(相対値)伸長*/
    }
    .lpnav-li:last-child{
        border-right:1px solid #dadada;
    }
    .lpnav-li:hover {
        background-color: #fff;
    }
    .lpnav-li:not(:first-child)::before {
        content: "";
        width: 1px;
        height: 2rem;
        background-color: #fff;
        position: absolute;
        top: 0;
        left: 0;
        transition: all .3s;
    }
    .header:hover {
        background-color: #fff;
    }
	.header:hover .lp_logo{
        background-image: url("image/top/lp_logo.png") !important;
        background-repeat: no-repeat;
        width: 8.5rem;
        height: 2rem;
    }
    .header:hover a{
        color: #222222;
    }
    .header:hover .dli-chevron-down{
        color: #828282;
    }
    .lpnav-li:hover::before {
    background-color: #fff;
}
.lpnav-li a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
	height:100%;
    text-decoration: none;
    color: #fff;
    font-size: .8rem;
    letter-spacing: 0.05em;
    transition: all .3s;
    position: relative;
}
.lpnav-li:hover a {
    color: #222222;
}
.lpnav-drops{
    display: none;/*デフォルトでは非表示の状態にしておく*/
    width: 100%;
    position: absolute;
    top:2rem;
    left: 0;
	padding-top:1.1rem;
}
.lpnav-li:hover .lpnav-drops {
    display: block;/*Gナビメニューにホバーしたら表示*/
	position:absolute;
	width:10rem;
    color: #222222;
}
.lpnav-drops:hover .lpnav-drops{
	display: block;
	position:absolute;
	width:14rem;
}
.lpnav-drop {
    background-color:#fff;
    height: 3rem;
    transition: all .5s;
    position: relative;
    list-style: none;
    margin: -.5rem auto 0 -2.5rem;
    width: 14rem;

}
.lpnav-drop:not(:first-child)::before{
    content: "";
    width: 100%;
    height: 1px;
    background-color:#fff;
    position: absolute;
    top: 0;
    left: 0;
}
.lpnav-drop:hover {
    background-color:#fff;
}
.lpnav-drop a {
    display: flex;
    justify-content: left;
    align-items: center;
    color: #fff;
    text-decoration: none;
    position: relative;
	text-indent:2rem;
    margin: 0;
}
.lpnav-drop a::before {
    content: '';
    display: block;
    width: 6px;
    height: 6px;
    border-top: 2px solid #808080;
    border-left: 2px solid #808080;
    transform: rotate(135deg);
    position: absolute;
    right: 15px;
    top: calc(50% - 5px);
    margin-right: 1rem;
}
.globalMenuSp{
    display:none;
}
/*navの下矢印アイコン*/
.dli-chevron-down {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    line-height: 1;
    width: .4rem;
    height: .4rem;
    border: 0.1em solid currentColor;
    border-left: 0;
    border-bottom: 0;
    box-sizing: border-box;
    transform: translateY(-25%) rotate(135deg);;
    position: absolute;
    margin-top: .5rem;
    bottom: -.5rem;
  }
}
@media screen and (max-width: 480px) {
    .pc{
        display: block;
    }
    html,body{
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        color: #222222;
    }
    .lp{
        margin: 0;
    }
    header{
        width: 100%;
        height:2rem;
        padding: .5rem;
        background-color: transparent;
        position: fixed;
        margin-top: 0px;
        z-index: 3;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    h1{
        display: none;
        margin: 0;
    }
    .lp_logo{
        position: relative;
        margin:0 auto 0 1rem;
        width: 8rem;
        height: 1.5rem;
        background-image: url("image/top/lp_logo3.png");
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }
    .lp_logo3{
        display: none;
    }
    .lpnav{
        display: none;
    }
	
    /*ヘッダー　トップ画像以外は↓クラスを付与し背景色変える*/
    .change-color{
        background-color: #fff;
        transition: 0.3s;
        border-bottom: solid .5px #dadada;
        color: #222222;
    }
    .change-color .dli-chevron-down {
        color: #828282 !important;
    }
    .change-color .lp_logo{
        background-image: url("image/top/lp_logo.png");
        background-repeat: no-repeat;
        width: 8rem;
        height: 1.7rem;
    }
    .change-color .hamburger span { 
        height: .7rem;
        background-color: #fff; 
        z-index: 5;
        display: block;
    }
    .change-color .hamburger span:nth-child(1) {
        background-color: #222222 !important;
    }
    .change-color .hamburger span:nth-child(2) {
        background-color: #222222 !important;
    }
    .change-color .hamburger span:nth-child(3) {
        background-color: #222222 !important;
    }
    /*↑ヘッダー　トップ画の時のcssここまで*/
	/*メニュー開いていると時白いロゴを表示する*/
	.js-header .lp-logo-opened{
		background-image: url("image/top/lp_logo3.png");
        background-repeat: no-repeat;
        width: 8rem;
        height: 1.7rem;
    }
    .lp_concept_img img{
        width: 80%;
        height: auto;
    }
    /*ハンバーガー*/
    .hamburger {
        width: 2rem;
        height: 1rem;
        margin: 0 2rem 0 auto;
        display: block;
    }
    .hamburger span { 
        height: .7rem;
        background-color: #fff; 
        z-index: 5;
        display: block;
    }
    .hamburger span:nth-child(1) {
        top: 0;
        width: 2rem;
        height: 1px;
        background-color: #fff;
        position: relative;
    }
    .hamburger span:nth-child(2) {
        top: .5rem;
        width: 2rem;
        height: 1px;
        background-color: #fff;
        position: relative;
    }
    .hamburger span:nth-child(3) {
        top: 1rem;
        width: 2rem;
        height: 1px;
        background-color: #fff;
        position: relative;
    }
    /* ヘッダー ナビ開いてる時 */
.hamburger.active {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    z-index: 5;
    border: none;
}


.hamburger.active span:nth-child(1) {
    top : .5rem;
    -webkit-transform: rotate(-45deg);
    -moz-transform   : rotate(-45deg);
    transform        : rotate(-45deg);
    background: #fff !important;
    z-index: 5;
}
.hamburger.active span:nth-child(2) {
    top: 2.7rem;
    -webkit-transform: rotate(45deg);
    -moz-transform   : rotate(45deg);
    transform        : rotate(45deg);
  width: 1rem;
  background: #fff !important;
  z-index: 5;
}
.hamburger.active span:nth-child(3) {
    opacity: 0;
    width: 4rem;
    background: #222222;
    z-index: 5;
}
nav.globalMenuSp {
    position: fixed;
    z-index : 4;
    top  : 0;
    left : 0;
    color: #fff;
    background: #3E3A39;
    text-align: center;
    transform: translateX(100%);
    transition: 0.6s;
    width: 100%;
    height: 100%;
    margin-right: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.menu-ul {
  list-style-type:none;
  display:flex;
  flex-flow:column;
  margin:0 auto;
  width:70%;
  padding-left: 0;
}
.menu-ul > li {
  display:inline-block;
  padding:1rem;
  border-bottom:solid 1px #dadada;
  position:relative;
  text-align:left;
}
.menu-ul > li p{
  text-decoration:none;
  color:#fff;
  font-size:.8rem;
  border-bottom: none;
}
.dropMenu-ul {
  display:none;
  padding-top: 1rem;
  padding-left: 1rem;
  width: 100%;
}
.menu-ul > li:hover ul {
  display:block;
  position:relative;
  margin:0;
  top:0;
  left:0;
  list-style-type:none;
  text-align:left;
}

.dropMenu-li:not(:first-child)::before{
  content: "";
  width: 100%;
  height: 1px;
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
}
.dropMenu-ul li{
  display:block;
}
.dropMenu-ul a{
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  color: #fff;
  text-decoration: none;
  position: relative;
  text-align:left;
  font-size:.8rem;
}
.dropMenu-ul a::before {
  content: '';
  display: block;
  width: 6px;
  height: 6px;
  border-top: 2px solid #fff;
  border-left: 2px solid #fff;
  transform: rotate(135deg);
  position: absolute;
  right: 15px;
  top: calc(50% - 5px);
}
.headergrid_1 a{
	text-decoration:none;
}

/* このクラスを、jQueryで付与・削除する */
nav.globalMenuSp.active { 
    transform: translateX(0%);
}


  .hamburger.active span:nth-child(1) {
      width: 2rem;
        top : .8rem;
  }
  .hamburger.active span:nth-child(2) {
      width: 2rem;
        top: .8rem;
  }
  nav.globalMenuSp { 
      z-index:-1;
  }
  nav.globalMenuSp ul {
      width: 80%;
      margin: 4rem auto 0 auto;
  }
  nav.globalMenuSp ul li .headermenu_grid { display: block; }
  nav.globalMenuSp ul li { font-size: .8rem; }
  nav.globalMenuSp ul li ul {
      grid-template-columns: repeat(2,40%);
      margin: .5rem 0 2rem 2rem;
  }
  nav.globalMenuSp ul li ul li {
      font-size: .8rem;
      height: 2rem;
      margin-right: 1rem;
      color: #fff;
  }
  nav.globalMenuSp ul li .headergridbox_6 li {
      margin-bottom: 1rem;
      width: 17%;
  }
  nav.globalMenuSp ul li .headergridbox_6 li img { width: 17%; }
  nav.globalMenuSp ul li .headermenu_works { width: 67%; }
  nav.globalMenuSp ul li .headermenu_works li { margin-right: 0; }
  nav.globalMenuSp ul li .headermenu_works .header_workso {
      margin-bottom: 1rem;
      line-height: 1.5rem;
  }


/* 小さいハンバーガーメニューボタン */
.mobile-header-menu-buttons .navi-menu-button { display: none; }

/* 1023pxより小さい画面のheader */
.mobile-header-menu-buttons {
  height: 2rem;
  background: #fff;
}

.fixed-header .logo-header img { width: 99%; }
@media screen and (max-width: 1023px) {
  #header-container { height: 0; }
  .mobile-header-menu-buttons { 
      display:none;
      background-color:#575653; }
  .logo-menu-button img { margin: 0; }
}
@media screen and (max-width: 750px) {
  .mobile-header-menu-buttons { 
      display:none;
      height: 15vw; }
}
@media screen and (max-width: 500px) {
  .menu-button-in .site-logo-image {
      width: 200px;
      position: relative;
      top: 9px;
  }
}
/*navの下矢印*/
.dli-chevron-down{
    display: none;
}

}
@media(min-width: 481px) and (max-width: 980px){
    .sp{
        display: none;
    }
    .tb{
        display: block;
    }
    html,body{
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        color: #222222;
    }
    .lp{
        margin: 0;
    }
    header{
        width: 100%;
        height:2rem;
        display:flex;
        align-items: center;
        padding: .5rem;
        background-color: transparent;
        position: fixed;
        margin-top: 0px;
        z-index: 3;
    }
    .lp_logo{
        position: relative;
        margin:0 auto 0 2rem;
        width: 8rem;
        height: 1.2rem;
        background-image: url("image/top/lp_logo3.png");
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }
    h1{
        display: none;
        margin: 0;
    }
    .lp-body{
        width: 100%;
        color: #222222;
        font-family: 'Noto Sans JP',sans-serif;
        box-sizing: border-box;
    }
    /*ヘッダー　トップ画像以外は↓クラスを付与し背景色変える*/
    .change-color{
        background-color: #fff;
        transition: 0.3s;
        border-bottom: solid .5px #dadada;
        color: #222222;
		opacity:0.8;
    }
    .change-color a{
        color: #222222 !important;
    }
    .change-color .dli-chevron-down {
        color: #828282 !important;
    }
    .change-color .lp_logo{
        background-image: url("image/top/lp_logo.png");
        background-repeat: no-repeat;
        width: 8rem;
        height: 1.5rem;
    }
	.header:hover .lp_logo{
    background-image: url("image/top/lp_logo.png") !important;
    background-repeat: no-repeat;
    width: 8rem;
    height: 1.7rem;
}
    
    /*↑ヘッダー　トップ画の時のcssここまで*/
    /* ヘッダー pcナビゲーション */
    .lpnav{
	    width: 90%;
        margin-left: auto;
    }
    
    .lpnav > ul{
	    display:flex;
	    margin-top:1rem;
        margin-right: 2rem;
        margin-left: auto;
    }

    .lpnav-li{
	    color:#222222;
	    padding:0 1rem;
        border-left: solid .5px #dadada;
	    text-decoration:none;
	    position: relative;
        transition: all .3s;
	    font-size:.7rem;    
	    height:2rem;
	    letter-spacing:0.1rem;
        list-style: none;
        flex-grow: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }
    /*ホバー時のアンダーライン*/
    .lpnav-li::after{
        position: absolute; /*親要素であるaタグを基準に位置を指定*/
        left: 0;
        bottom: -1rem;            /*アンダーラインを各メニュー（aタグ）の左端に指定*/
        content: '';        /*本来は、擬似要素に入るテキストなどを’’内に指定。今回はアンダーラインなので何も記載しない*/
        width: 100%;        /*アンダーラインを各aタグの幅に合わせる*/
        height: 3px;        /*アンダーラインの高さ（太さ）*/
        background: #C83131;/*アンダーラインの色*/
        transform: scale(0,1);
        transform-origin: left top;
        transition: transform 0.3s;    
    }
    .lpnav-li:hover::after {
        transform: scale(1,1);/*ホバー後、ｘ軸方向に1(相対値)伸長*/
    }
    .lpnav-li:last-child{
        border-right:1px solid #dadada;
    }
    
    .lpnav-li:hover {
        background-color: #fff;
    }
    .lpnav-li:not(:first-child)::before {
        content: "";
        width: 1px;
        height: 2rem;
        background-color: #fff;
        position: absolute;
        top: 0;
        left: 0;
        transition: all .3s;
    }
.lpnav-li:hover::before {
    background-color: #fff;
}
.lpnav-li a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
	height:100%;
    text-decoration: none;
    color: #fff;
    font-size: .7rem;
    letter-spacing: 0.05em;
    transition: all .3s;
    position: relative;
}
.lpnav-li:hover a {
    color: #222222;
}
.lpnav-drops{
    display: none;/*デフォルトでは非表示の状態にしておく*/
    width: 100%;
    position: absolute;
    top:2rem;
    left: 0;
	padding-top:1.1rem;
}
.lpnav-li:hover .lpnav-drops {
    display: block;/*Gナビメニューにホバーしたら表示*/
	position:absolute;
	width:10rem;
    color: #222222;
}
.lpnav-drops:hover .lpnav-drops{
	display: block;
	position:absolute;
	width:14rem;
}
.lpnav-drop {
    background-color:#fff;
    height: 3rem;
    transition: all .5s;
    position: relative;
    list-style: none;
    margin: -.5rem auto 0 -2.5rem;
    width: 14rem;

}
.lpnav-drop:not(:first-child)::before{
    content: "";
    width: 100%;
    height: 1px;
    background-color:#fff;
    position: absolute;
    top: 0;
    left: 0;
}
.lpnav-drop:hover {
    background-color:#fff;
}
.lpnav-drop a {
    display: flex;
    justify-content: left;
    align-items: center;
    color: #fff;
    text-decoration: none;
    position: relative;
	text-indent:2rem;
    margin: 0;
}
.lpnav-drop a::before {
    content: '';
    display: block;
    width: 6px;
    height: 6px;
    border-top: 2px solid #808080;
    border-left: 2px solid #808080;
    transform: rotate(135deg);
    position: absolute;
    right: 15px;
    top: calc(50% - 5px);
    margin-right: 1rem;
}
.globalMenuSp{
    display:none;
}
/*navの下矢印アイコン*/
.dli-chevron-down {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    line-height: 1;
    width: .4rem;
    height: .4rem;
    border: 0.1em solid currentColor;
    border-left: 0;
    border-bottom: 0;
    box-sizing: border-box;
    transform: translateY(-25%) rotate(135deg);;
    position: absolute;
    margin-top: .5rem;
    bottom: -.5rem;
  }
}

/* ========================================
    トップ
========================================= */
@media screen and (min-width: 981px) {
	a:hover{
		opacity:0.5;
	}
    /*トップ画像*/
    .top-sp{
        display: none;
   }
   .lp_top{
        width: 100%;
        height: auto;
        position: relative;
   }
   .lp_top video{
        width: 100%;
        height: 55.8vw;
   }
	.scrolldown1{
  		position:absolute;
  		left:48%;
  		bottom:10px;
    	/*全体の高さ*/
  		height:80px;
	}

/*Scrollテキストの描写*/
	.scrolldown1 span{
    /*描画位置*/
  		position: absolute;
  		top: -30px;
    /*テキストの形状*/
  		color: #fff;
  		font-size: 14px;
  		letter-spacing: 0.05em;
		text-align:center;
}

/* 線の描写 */
.scrolldown1::after{
  content: "";
    /*描画位置*/
  position: absolute;
  top: 0;
	left:25px;
    /*線の形状*/
  width: 1px;
  height: 80px;
  background: #fff;
    /*線の動き1.4秒かけて動く。永遠にループ*/
  animation: pathmove 1.4s ease-in-out infinite;
  opacity:0;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove{
  0%{
    height:0;
    top:0;
    opacity: 0;
  }
  30%{
    height:50px;
    opacity: 1;
  }
  100%{
    height:0;
    top:100px;
    opacity: 0;
  }
}
	/*.lp_top::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 55.8vw;
	background-color: rgba(0,0,0,0.5);
	background-image: radial-gradient(#111 30%, transparent 31%), radial-gradient(#111 30%, transparent 31%);
	background-size: 4px 4px;
	background-position: 0 0, 2px 2px;
}
	.lp_catch{
    position: absolute;
    top:18vw;
    left: 10vw;
   } 
   .catch1{
		color: #adadad;
    	font-family:'Roboto', sans-serif;
    	font-size:2rem;
    	letter-spacing: .3rem;
	}

	.catch2{
    	margin-top: 3rem;
		color: #fff;
    	font-size:2.5rem;
    	letter-spacing: .3rem;
    	line-height: 4.5rem;
   }
   .catch3{
    	margin-top: 1rem;
	   color: #fff;
    	font-size:2.5rem;
    	letter-spacing: .3rem;
    	line-height: 4.5rem;
   }
   .catch2 span,.catch3 span{
    color: #C83131;
    font-size:3.5rem;
    font-weight: normal;
    letter-spacing: .3rem;
   }
*/
    /*見出し*/
    .lp_n{
        color: #C83131;
        margin-top: -1.5rem;
        font-family:'Roboto', sans-serif;
        font-weight: bold;
        font-size: .8rem;
        overflow: hidden;
        /* 見出しアニメーション */
        transform: translateY(4rem);
        animation: textanimation 1s forwards;
    }
    .lp_p{
        color: #848484;
        margin-top: 2rem;
        font-size:14px;
        letter-spacing: .1em;
        overflow: hidden;
        /* 見出しアニメーション */
        transform: translateY(4rem);
        animation: textanimation 1s forwards;
    }
    
    .h2{
        display: flex;
        align-items: center;
        gap:2rem;
        letter-spacing: .2rem;
        overflow: hidden;
    }
    .h2 h2{
        font-family:'Roboto', sans-serif;
        font-size: 3rem;
        font-weight: normal;
        margin: 0;
        display: flex;
    }
    .lp_indent{
        text-indent: 1rem;
    }
    .lp_e{
        font-family:'Roboto', sans-serif;
        font-size: 3rem;
        font-weight: normal;
        margin: 0;
        /* アニメーションの初期設定 */
        transform: translateY(2em);
        opacity: 0;
        
    }
    /* .visible クラスが付与された時にアニメーションを実行 */
    .lp_e.visible {
        animation: textanimation 1s forwards;
    }
    
    /* 1文字目 */
    .h2 h2 p:nth-child(1) {
    animation-delay: 0.1s
    }
    /* 2文字目 */
    .h2 h2 p:nth-child(2) {
    animation-delay: 0.2s
    }
    /* 3文字目 */
    .h2 h2 p:nth-child(3) {
    animation-delay: 0.3s
    }
    /* 4文字目 */
    .h2 h2 p:nth-child(4) {
    animation-delay: 0.4s
    }
    /* 5文字目 */
    .h2 h2 p:nth-child(5) {
    animation-delay: 0.5s
    }
    /* 6文字目 */
    .h2 h2 p:nth-child(6) {
    animation-delay: 1s
    }
    /* 7文字目 */
    .h2 h2 p:nth-child(7) {
    animation-delay: 1.1s
    }
    /* 8文字目 */
    .h2 h2 p:nth-child(8) {
    animation-delay: 1.2s
    }
    /* 9文字目 */
    .h2 h2 p:nth-child(9) {
    animation-delay: 1.3s
    }
    /* 10文字目 */
    .h2 h2 p:nth-child(10) {
    animation-delay: 2s
    }
    /* 11文字目 */
    .h2 h2 p:nth-child(11) {
        animation-delay: 2.1s
    }
    /* 12文字目 */
    .h2 h2 p:nth-child(12) {
        animation-delay: 2.2s
    }
    /* 13文字目 */
    .h2 h2 p:nth-child(13) {
        animation-delay: 2.3s
    }
    /* 14文字目 */
    .h2 h2 p:nth-child(14) {
        animation-delay: 2.4s
    }
    @keyframes textanimation {
        0% {
            transform: translateY(2em);
            opacity: 0;
        }
        100% {
            transform: translateY(0);
            opacity: 1;
        }
    }
   
    /*ニュース*/
    .lp_news{
        width: 1280px;
        margin: 6rem auto;
        display: grid;
        grid-gap:1rem 2rem;
		grid-template-areas:
			"a b"
			"d c";
		 grid-template-columns: 30% 70%;
    }
    
    .lp_news_link{
        display: grid;
        grid-template-columns: 200px 200px 200px;
        align-items: flex-end;
        grid-gap:1rem 2rem;
        margin-right:auto;
		margin-top:2rem;
    }
	.news1{
		grid-area:a;
	}
	.news2{
		grid-area:b;
	}
	.news3{
		grid-area:c;
	}
	.news-loop .dateText{
		font-weight:normal;
		color:#848484;
		margin-right:1rem;
	}
	.news-loop{
		margin-top:1rem;
	}
	.news-loop:first-child{
		margin-top:0;
	}
	.news-loop a span{
		color:#222222;
		font-size:14px;
	}
	.news-loop a{
		text-decoration:none;
	}
    .lp_news_link a{
        text-decoration: none;
        color:#222222;
        padding: .5rem 1rem;
        border-bottom: solid #848484 .5px;
        font-size: 14px;
        display: flex;
    }
    .lp_news_link p{
        font-size: 14px;
    }
    
    .lp_news_link a img{
        margin-left: 1rem;
        margin-top: .2rem;
        width: 20%;
        height: 20%;
    }
	.news-notice{
		margin-right:1rem;
		background-color:#E6E6E6;
		padding:.1rem 1rem;
	}
	.news-event{
		margin-right:1rem;
		background-color:#C1B4B4;
		padding:.1rem 1rem;
	}
	.news-loop a .news-construction{
		margin-right:1rem;
		background-color:#3E3A39;
		padding:.1rem 1rem;
		color:#fff;
		width:6rem;
	}
	.news-loop img{
		display:none;
	}
    /*コンセプト*/
    .lp_concept{
        width: 100%;
        border-bottom: solid .5px #ededed;
        border-top: solid .5px #ededed;
    }
    .lp_concept-box{
        width: 1280px;
        margin: 6vw auto;
        display: grid;
        grid-template-columns: 47% 47%;
        justify-content: center;
        align-items: center;
        gap:3vw;
    }
    .lp_concept img{
        vertical-align: top;
    }
    .lp_concept h2{
        font-size:1.2rem;
        line-height: 2.5rem;
        font-weight: 700;
    }
	.lp_concept_span1{
		font-size:1.2rem;
	}
	.lp_concept_span2{
        margin-left: 1rem;
		font-size:1.2rem;
    }
    .lp_concept p{
        font-size: 14px;
        line-height: 2rem;
        margin-left: 1rem;
    }
    /*事業案内*/
    .lp_service{
        width: 1280px;
        margin: 6vw auto;
    }
    .lp_service_p{
        font-size: 14px;
        margin: 2vw auto;
        line-height: 2rem;
    }
    .lp_service_box{
        display: flex;
        grid-gap:1vw;
        margin: 0 auto;
        width: 100%;
    }
    .lp_service_box1{
        flex-basis: 32%;
    }
    .lp_service_box img{
        vertical-align: top;
        width: 100%;
    }
    .lp_service_text{
        background-color:#F8F9F9;
        margin-top: -1vw;
        padding: 1vw 2vw;
        position: relative;
        width: 77%;
        height: 40%;
    }
    .lp_service_tytle{
        margin: 0;
        font-size: .8rem;
        color:#C83131; 
    }
    .lp_service_text_p{
        font-size:14px;
        margin-top: 2rem;
		margin-bottom:2rem;
		line-height:2rem;
    }
    .lp_service_text h3{
        margin: .5vw auto;
    }
    .lp_service_text h3::after{
        background-color: #C83131; /* 線の色 */
        bottom: 8.5rem; /* 線の位置 */
        content: "";
        height: 2px; /* 線の高さ */
        left: 2vw; /* 線の中央寄せ */
        position: absolute;
        width: 30px; /* 線の長さ */
    }
    .lp_service_text a{
        text-decoration: none;
        display: flex;
        justify-content: flex-end;
        margin-top: auto;
        color: #222222;
		position:absolute;
		right:3rem;
		bottom:1.5rem
    }
    .lp_service_text a img{
        width: 30%;
        margin: .5rem 0 0 1rem;
        
    }
	.lp_service .lp_aboutus_migi{
		margin-top.5rem;
	}
    .lp_service_text2{
        color:#C83131;
        font-weight: bold;
        margin-top: 4rem;
        text-align: center;
    }
    /*施工事例*/
    .lp_works{
        background-color: #3E3A39;
        width: 100%;
        margin: 6rem auto 0 auto;
    }
    .lp_works_box{
        width: 1280px;
        margin: 0 auto;
        padding-top: 6rem;
        padding-bottom: 6rem;
        overflow: hidden;
    }
    .lp_works .h2 h2,.lp_works .h2 .lp_p{
        color: #fff;
    }
    /*リンクボタン*/
    .lp_works_linkbox{
        margin: 2rem auto;
        width: 100%;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .lp_works_linkbox a{
        margin: 0 .3vw;
        flex-grow: 1;
         width: calc(100vw / 5);
    }
    .lp_works_linkbox img{
        width: 100%;
        height: auto;
    }
    /*スクロールアニメーション*/
    @keyframes infinity-scroll-right {
        from {
          transform: translateX(-100%);
        }
          to {
          transform: translateX(0%);
        }
        }
        
        .scroll-infinity__wrap {
          display: flex;
          overflow: hidden;
          padding-bottom: 6rem;
        }
        .scroll-infinity__list {
          display: flex;
          list-style: none;
          padding: 0;
          gap:1rem;
          margin-left: 1rem;
        }
        .scroll-infinity__list--right {
          animation: infinity-scroll-right 30s infinite linear 0s both;
        }
        .scroll-infinity__item {
          width: calc(100vw / 5);
        }
        .scroll-infinity__item p{
            background-color: #fff;
            text-indent: 1rem;
            padding: .5rem 0;
        }
        .scroll-infinity__item img {
          width: 100%;
          height: auto;
          vertical-align: top;
        }
    /*私たちについて*/
    .lp_aboutus{
        width: 100%;
        background-color: #fff;
        overflow: hidden;
        position: relative;
        display: flex;
    }
    .lp_aboutus_box{
        width: 820px;
        margin-left: auto;
        padding-top: 6vw;
        padding-bottom: 6vw;
        padding-right: 4rem;
        z-index: 2;
        position: relative;
    }
    .lp_aboutus_p1{
        text-align: left;
        font-weight: bold;
        font-size:1.2rem;
        margin-top: 2rem;
        line-height: 2.5rem;
    }
    .lp_aboutus_p2{
        font-weight: normal;
        font-size:.8rem;
        margin: 2rem auto;
        text-align: left;
        line-height: 1.5rem;
    }
    .lp_aboutus_p2 span{
        color: #C83131;
        font-weight: bold;
    }
    
    .lp_aboutus_linkbox{
        width: 420px;
        margin-right: auto;
        text-align: center;
        display: grid;
        grid-template-columns: 50% 50%;
    }
    .lp_aboutus_linkbox a{
        text-decoration: none;
        border-bottom: solid #848484 .5px;
        display: flex;
        justify-content: center;
        padding: .5rem 1rem;
        margin-right: auto;
    }
    .lp_aboutus_linkbox a p{
        color: #222222;
        font-size:.8rem;
    }
    .lp_aboutus_linkbox img{
        width: 20%;
        height: 20%;
        display: inline-block;
        margin-top: .8rem;
        margin-left: 2rem;
    }
    .lp_aboutus_box .h2 h2 p:nth-child(6) {
        text-indent: 1rem;
    }
    .lp_about_img img{
        vertical-align: top;
        margin-left: auto;
        width: 100%;
    }
    @keyframes infinity-scroll-bottom {
        from {
          transform: translateY(0);
        }
          to {
          transform: translateY(-100%);
        }
        }
        .lp_about_img {
          animation: infinity-scroll-bottom 20s infinite linear 0.5s both;
          height: 600px;
        }
        
    .lp_aboutus_migi{
        width: 2rem;
        height: .5rem;
        border-bottom: 1px solid #222222;
        border-right: 1px solid #222222;
        transform: skew(45deg);
        display: inline-block;
        margin-left: 1rem;
        margin-right: 1rem;
    }
    @keyframes infinity-scroll-bottom {
        from {
          transform: translateY(0);
        }
          to {
          transform: translateY(-100%);
        }
        }
        .lp_about_img {
          animation: infinity-scroll-bottom 20s infinite linear 0.5s both;
          height: 600px;
        }
	.lp_about_img_sp{
		display:none;
	}
    
   /*採用情報・お問合せ*/
    .lp_recruit_contact{
        display: grid;
        grid-template-columns: 50% 50%;
        color: #fff;
    }
    .lp_recruit_contact a{
        text-decoration: none;
    }
    .lp_recruit,.lp_contact{
        height: 22vw;
        border:solid .5px #ededed;
        overflow: hidden;
        position: relative;
    }
	.lp_recruit a,.lp_contact a{
		opacity:1;
	}
    .lp_recruit_box,.lp_contact_box{
        padding-top: 4vw;
        padding-left: 6vw;
        overflow: hidden;
    }
    .lp_recruit_img,.lp_contact_img {
        opacity: 0;
        position: absolute;
        display: block;
        width: 60vw;
        height: 100%;
        margin: 0;
        
    }
    .lp_recruit_img img,.lp_contact_img img{
        width: 100%;
        vertical-align: top;
    }
    .lp_recruit:hover .lp_recruit_img,.lp_contact:hover .lp_contact_img{
        opacity: 1;
        margin: 0;
        width: 50vw;
       display: block;
       transition: opacity 1s;
    }
    .lp_recruit_contact h2{
        color: #222222;
    }
    .lp_recruit:hover h2,.lp_contact:hover h2,.lp_contact:hover .lp_p,.lp_recruit:hover .lp_p{
        color: #fff;
        transition: color .6s cubic-bezier(.165,.84,.44,1);
    }
    
    .lp_recruit_contact .lp_p{
        color: #848484;
    }
    .lp_recruit_contact_p{
        margin-top: 2vw;
        line-height: 2rem;
        font-size:14px;
        color: #222222;
        position: relative;
        z-index: 1;
    }
    .lp_recruit:hover .lp_recruit_contact_p,.lp_contact:hover .lp_recruit_contact_p{
        color: #fff;
        transition: color .6s cubic-bezier(.165,.84,.44,1);
    }
    .lp_recruit_contact_p span{
        font-size:1.8rem;
        margin-right: 2vw;
        line-height: 2.5vw;
    }
    .lp_recruit_contact_more{
        text-decoration: none;
        color: #222222;
        border: solid .5px #ededed;
        padding: .5vw 2vw;
        display: block;
        margin: 3vw  6vw 0 auto;
        width: 100px;
        z-index: 1;
        position: relative;
    }
    .lp_recruit:hover .lp_recruit_contact_more,.lp_contact:hover .lp_recruit_contact_more{
        text-decoration: none;
        color: #fff;
        border: solid .5px #fff;
        padding: .5vw 2vw;
        display: block;
        margin: 3vw  6vw 0 auto;
        width: 100px;
        z-index: 1;
        position: relative;
    }
    .lp_recruit_contact_more img{
        margin-left: 1rem;
    }
    .migi{
        width: 2rem;
        height: .5rem;
        border-bottom: 1px solid #222222;
        border-right: 1px solid #222222;
        transform: skew(45deg);
        display: inline-block;
        margin-left: 1rem;
    }
    .lp_recruit:hover .migi, .lp_contact:hover .migi{
        width: 2rem;
        height: .5rem;
        border-bottom: 1px solid #fff;
        border-right: 1px solid #fff;
        transform: skew(45deg);
        display: inline-block;
        margin-left: 1rem;
    }
    /*バナー*/
    .lp_banner{
        display: flex;
        justify-content: center;
        align-items: center;
        gap:1vw;
        height: 30%;
        width: 60%;
		margin:0 auto;
    }
    .lp_banner img{
        border: solid .5px #ededed;
		width:80%;
    }
	.banner{
		padding-top:.4rem;
		padding-bottom:.5rem;
	}
    /*フッター*/
    footer{
        background-color: #3E3A39;
        color: #fff;
        padding: 4vw;
    }
	footer ul{
		padding:0;	
	}
    footer img{
        margin: 0 auto 2vw 7vw;
    }
    .lp_footer_box{
        display: flex;
        gap:1vw;
        justify-content: center;
        align-items: flex-start;
        margin: 0 auto 4vw auto;
    }
    .lp_footer_ul{
        display: flex;
        gap:1vw;
    }
    footer li{
        list-style-type: none;
        margin-top: 1vw;
    }
    footer a{
        text-decoration: none;
        color: #fff;
        padding-left: 1vw;
        padding-right: 1vw;
        font-size: .8rem;
    }
    .lp_footer_box p{
        border-bottom: solid .5px #fff;
        padding-bottom: .5vw;
        padding-left: 1vw;
        font-size: 14px;
    }
    .lp_footer_p{
        width: 15%;
    }
    .lp_footer_p p{
        padding-right: 2vw;
        padding-top: 1vw;
        padding-left: 0;
    }
    .lp_footer_p2{
        text-align: center;
        font-size: 14px;
        padding-top: 1vw;
    }
    .lp_footer_p_sp{
        display: none;
    }

}

/*---スマホ---*/

@media screen and (max-width: 480px) {
    .sp{
        display: block;
    }
    .pc{
        display: none;
    }
    /*トップ画像*/
    
	.top-pc{
        display: none;
   }
    .lp_top{
        width: 100%;
        height: auto;
        position: relative;
   }
   .top-sp{
        width: 100%;
        height: 207vw;
   }
	.scrolldown1{
  		position:absolute;
  		left:45%;
  		bottom:10px;
    	/*全体の高さ*/
  		height:120px;
	}

/*Scrollテキストの描写*/
	.scrolldown1 span{
    /*描画位置*/
  		position: absolute;
  		top: -30px;
    /*テキストの形状*/
  		color: #fff;
  		font-size: 14px;
  		letter-spacing: 0.05em;
		text-align:center;
}

/* 線の描写 */
.scrolldown1::after{
  content: "";
    /*描画位置*/
  position: absolute;
  top: 0;
	left:25px;
    /*線の形状*/
  width: 1px;
  height: 80px;
  background: #fff;
    /*線の動き1.4秒かけて動く。永遠にループ*/
  animation: pathmove 1.4s ease-in-out infinite;
  opacity:0;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove{
  0%{
    height:0;
    top:0;
    opacity: 0;
  }
  30%{
    height:50px;
    opacity: 1;
  }
  100%{
    height:0;
    top:100px;
    opacity: 0;
  }
}

   /*.lp_top::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 207vw;
	background-color: rgba(0,0,0,0.5);
	background-image: radial-gradient(#111 30%, transparent 31%), radial-gradient(#111 30%, transparent 31%);
	background-size: 4px 4px;
	background-position: 0 0, 2px 2px;
}
	.lp_catch{
    position: absolute;
    top:60vw;
    left: 10vw;
   } 
   .catch1{
    color: #adadad;
    font-family:'Roboto', sans-serif;
    font-size:1rem;
    letter-spacing: .3rem;
   }
   .catch2{
    color: #fff;
    font-size:1rem;
    letter-spacing: .3rem;
    line-height: 3rem;
    margin-top: 3rem;
   }
   .catch3{
    color: #fff;
    font-size:1rem;
    letter-spacing: .3rem;
    line-height: 3rem;
   }
   .catch2 span,.catch3 span{
    color: #C83131;
    font-size:1.2rem;
    font-weight: normal;
    letter-spacing: .3rem;
   }*/

    /*見出し*/
    .lp_n{
        color: #C83131;
        margin-top: -4vw;
        font-family:'Roboto', sans-serif;
        font-weight: bold;
        font-size: .8rem;
    }
    .lp_p{
        color: #848484;
        margin-top: 2vw;
        font-size:.8rem;
        letter-spacing: .1rem;
    }
    .h2{
        display: flex;
        align-items: center;
        gap:1rem;
        letter-spacing: .2rem;
    }
    .h2 h2{
        display: flex;
    }
    .h2 h2 p{
        font-family:'Roboto', sans-serif;
        font-size: 2rem;
        font-weight: normal;
        margin: 0;
    }
    .lp_e{
        font-family:'Roboto', sans-serif;
        font-size: 3rem;
        font-weight: normal;
        margin: 0;
        /* アニメーションの初期設定 */
        transform: translateY(2em);
        opacity: 0;
        
    }
    /* .visible クラスが付与された時にアニメーションを実行 */
    .lp_e.visible {
        animation: textanimation 1s forwards;
    }
    
    /* 1文字目 */
    .h2 h2 p:nth-child(1) {
    animation-delay: 0.1s
    }
    /* 2文字目 */
    .h2 h2 p:nth-child(2) {
    animation-delay: 0.2s
    }
    /* 3文字目 */
    .h2 h2 p:nth-child(3) {
    animation-delay: 0.3s
    }
    /* 4文字目 */
    .h2 h2 p:nth-child(4) {
    animation-delay: 0.4s
    }
    /* 5文字目 */
    .h2 h2 p:nth-child(5) {
    animation-delay: 0.5s
    }
    /* 6文字目 */
    .h2 h2 p:nth-child(6) {
    animation-delay: 1s
    }
    /* 7文字目 */
    .h2 h2 p:nth-child(7) {
    animation-delay: 1.1s
    }
    /* 8文字目 */
    .h2 h2 p:nth-child(8) {
    animation-delay: 1.2s
    }
    /* 9文字目 */
    .h2 h2 p:nth-child(9) {
    animation-delay: 1.3s
    }
    /* 10文字目 */
    .h2 h2 p:nth-child(10) {
    animation-delay: 2s
    }
    /* 11文字目 */
    .h2 h2 p:nth-child(11) {
        animation-delay: 2.1s
    }
    /* 12文字目 */
    .h2 h2 p:nth-child(12) {
        animation-delay: 2.2s
    }
    /* 13文字目 */
    .h2 h2 p:nth-child(13) {
        animation-delay: 2.3s
    }
    /* 14文字目 */
    .h2 h2 p:nth-child(14) {
        animation-delay: 2.4s
    }
    @keyframes textanimation {
        0% {
            transform: translateY(2em);
            opacity: 0;
        }
        100% {
            transform: translateY(0);
            opacity: 1;
        }
    }
    /*ニュース*/
    .lp_news{
        width: 80%;
        margin: 4rem auto;
    }
    
    .lp_news_link{
        display:grid;
		grid-template-columns:repeat(2,1fr);
        margin: 2rem auto;
		grid-gap:1rem;
    }
    .lp_news_link a{
        text-decoration: none;
        color:#222222;
        padding: .5rem;
        border-bottom: solid #848484 .5px;
        font-size: .8rem;
        display: flex;
    }
    .lp_news_link a p{
        font-size: .8rem;
    }
    .lp_news_link a img{
        margin-left: 1rem;
        margin-top: .5rem;
        width: 20%;
        height: 20%;
    }
	.lp_news .lp_news_img{
		margin-left:2.8rem;
	}
	.news-loop .dateText{
		font-weight:normal;
		color:#848484;
		margin-right:1rem;
	}
	.news-loop a span{
		color:#222222;
		font-size:14px;
	}
	.news-loop a{
		text-decoration:none;
	}
	.news-loop a p{
		margin-top:1rem;
	}
	.news-loop img{
		display:none;
	}
	.news-title{
		display:block;
		margin-top:.3rem;
		line-height:1.5rem;
		font-size:14px;
	}
    
    .lp_news_link p{
        font-size: .8rem;
    }
    
	.news-loop .news-notice{
		margin-right:1rem;
		background-color:#E6E6E6;
		padding:.1rem 1rem;
		font-size:12px;
	}
	.news-loop .news-event{
		margin-right:1rem;
		background-color:#C1B4B4;
		padding:.1rem 1rem;
		font-size:12px;
	}
	.news-loop .news-construction{
		margin-right:1rem;
		background-color:#3E3A39;
		padding:.1rem 1rem;
		color:#fff;
		font-size:12px;
	}
    /*コンセプト*/
    .lp_concept{
        width: 100%;
        margin: 0 auto;
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        gap:3vw;
        border-bottom: solid .5px #ededed;
        padding-bottom: 2rem;
    }
    .lp_concept img{
        vertical-align: top;
        width: 90%;
       
    }
    .lp_concept_img  {
        text-align: right;
    }
    .lp_concept h2{
        font-size:.8rem;
        line-height: 2rem;
        font-weight: 700;
        width: 85%;
        margin: 2rem auto 1rem auto;
        font-family:'Noto Sans JP',sans-serif;
    }
    .lp_concept_span2{
        margin-left: .5rem;
        font-size: .8rem;
    }
    .lp_concept_span1{
        margin-left: .5rem;
        font-size: .8rem;
		display:block;
    }
    .lp_concept p{
        font-size: .8rem;
		line-height:1.8rem;
        width: 80%;
        margin: 2rem auto;
    }
    /*事業案内*/
    .lp_service{
        width: 100%;
        margin: 0 auto;
        padding-top: 4rem;
        padding-bottom: 4rem;
        border-bottom: solid .5px #ededed;
    }
    .lp_service .h2{
        width: 80%;
        margin: 0 auto;
    }
    .lp_service_p{
        font-size:.8rem;
		line-height:1.8rem;
        margin: 1rem auto;
        width: 80%;
    }
    .lp_service_box1 img{
        width: 100%;
        margin-top: 1rem;
        vertical-align: top;
        z-index: -1;
    }
    .lp_service_box1{
        width: 80%;
        margin: 0 auto 1rem auto;
    }
    .lp_service_text{
        background-color: #F8F9F9;
        z-index: 1;
        margin-top: -2rem;
        width: 93%;
        height: auto;
        position: relative;
        z-index: 1;
    }
	.lp_service_text a p{
		font-size:.8rem;
	}
    .lp_service_tytle{
        color: #848484;
        font-size: .8rem;
        margin: 0 auto .5rem 1rem;
        padding-top: 1rem;
        font-family: 'Roboto', sans-serif;
    }
    .lp_service_text h3{  
        font-size: 1rem;
        margin: .5rem auto .5rem 1rem;
    }
    .lp_service_text h3::after{
        background-color: #C83131; /* 線の色 */
        top: 5rem; /* 線の位置 */
        content: "";
        height: 2px; /* 線の高さ */
        left: 1rem; /* 線の中央寄せ */
        position: absolute;
        width: 30px; /* 線の長さ */
    }
   
    .lp_service_text .lp_service_text_p{
        font-size: .8rem;
        margin: 2rem auto 1rem 1rem;
        line-height: 1.5rem;
    }
    .lp_service_text a{
        text-decoration: none;
        color: #222222;
        font-size: .8rem;
        margin-left: auto;
        padding-bottom: 1rem;
        width: 40%;
        display: flex;
		align-items:flex-end;
    }
    .lp_service_box1 .lp_aboutus_migi{
        width: 30%;
        position:relative:
		top:-1vw;
    }
    .lp_service_text2{
        font-size:.8rem;
        color: #C83131;
        margin: 4rem auto 0 auto;
        font-weight: bold;
        margin: 2rem auto 0 auto;
        width: 80%;
        line-height: 1.5rem;
    }
    /*施工実績*/
    .lp_works{
        background-color: #3E3A39;
        width: 100%;
        padding-bottom: 4rem;
    }
    .lp_works_box{
        padding-top: 4rem;
        width: 80%;
        margin: 0 auto;
    }
    .lp_works_box h2,.lp_works_box .lp_p{
        color: #fff;
    }
    .lp_works_linkbox img{
        vertical-align: top;
        width: 100%;
    }
    .lp_works_linkbox a:not(:first-child){
        border-top: solid .5px #fff;
    }
    .lp_works_linkbox{
        margin-top: 2rem;
    }
    
    /*スクロールアニメーション*/
    @keyframes infinity-scroll-right {
        from {
          transform: translateX(-100%);
        }
          to {
          transform: translateX(100%);
        }
        }
        
        .scroll-infinity__wrap {
          display: flex;
          overflow: hidden;
          margin: 4rem auto;
        }
        .scroll-infinity__list {
          display: flex;
          list-style: none;
          padding: 0;
          gap:1rem;
          margin-left: 1rem;
        }
        .scroll-infinity__list--right {
          animation: infinity-scroll-right 30s infinite linear 0s both;
        }
        .scroll-infinity__item {
          width: calc(100vw / 1);
        }
        .scroll-infinity__item p{
            background-color: #fff;
            text-indent: 1rem;
            padding: .5rem 0;
            font-size:.8rem;
        }
        .scroll-infinity__item img {
          width: 100%;
          height: auto;
          vertical-align: top;
        }
    
    /*私たちについて*/
    .lp_aboutus{
        background-color: #ededed;
        width: 100%;
		padding-bottom:4rem;
    }
    .lp_aboutus_box{
        padding-top: 4rem;
        padding-bottom: 2rem;
        width: 80%;
        margin: 0 auto;
    }
    .lp_aboutus_box .h2{
        white-space: nowrap;
    }
	.lp_aboutus_img{
		display:none;
	}
    .lp_aboutus_p1{
        font-size: .8rem;
        font-weight: bold;
		line-height:2rem;
		padding-top:2rem;
    }
    .lp_aboutus_p2{
        font-size: .8rem;
        font-weight: normal;
        line-height: 1.5rem;
        margin-top: 2rem;
		text-align:left;
    }
	.lp_aboutus_p2 span{
		font-weight:bold;
		font-size:.8rem;
		color: #C83131;
	}
    .lp_aboutus_linkbox a{
        text-decoration: none;
        font-size: .8rem;
        color: #222222;
        border-bottom: solid .5px #848484;
        padding:.5rem;
        text-align: center;
        display: flex;
    }
    .lp_aboutus_linkbox a p{
        font-size: .8rem;
		display:flex;
		align-items:flex-end;
    }
    .lp_aboutus_linkbox{
        display: grid;
        grid-template-columns: 50% 50%;
        justify-content: center;
        gap:1rem;
        width: 100%;
        margin: 2rem auto;
    }
    .lp_aboutus_linkbox img{
        margin-left: 1rem;
        margin-top: .5rem;
        width: 20%;
        height: 20%;
    }
	.lp_about_img img{
		display:none;
	}
	.lp_aboutus_migi{
        width: 2rem;
        height: .5rem;
        border-bottom: 1px solid #222222;
        border-right: 1px solid #222222;
        transform: skew(45deg);
        display: block;
        margin-left: 1rem;
		top:-.3rem;
		position:relative;
    }
	/*スクロールアニメーション*/
    @keyframes infinity-scroll-right {
        from {
          transform: translateX(0%);
        }
          to {
          transform: translateX(-100%);
        }
        }
    .lp_about_img_sp{
		display: flex;
        overflow: hidden;
	}
	.lp_about_scroll_sp{
        display: flex;
    }
	.lp_about_scroll_sp img{
		width: auto;
		vertical-align:top;
        height: 100%;
	}
	.lp_about_right{
		animation: infinity-scroll-right 60s infinite linear 0s both;
	}
    /*採用情報・お問合せ*/
    .lp_recruit_contact a{
        text-decoration: none;
    }
    .lp_recruit,.lp_contact{
        width: 100%;
        height: auto;
        background-size: cover;
        overflow: hidden;
        position: relative;
    }
    
    .lp_recruit_img, .lp_contact_img{
        position: absolute;
		width: 100%;
        height: 100%;
    }
	.lp_recruit_img img,.lp_contact_img img{
        object-fit: cover;
        width: 100%;
        height: 100%;
    }
    .lp_recruit_box,.lp_contact_box{
        position: relative;
    }
    .lp_recruit h2,.lp_recruit .lp_p,.lp_contact h2,.lp_contact .lp_p{
        color: #fff;
    }
    .lp_recruit_contact_p{
        color: #fff;
        font-size: .8rem;
        margin: 1rem auto;
        line-height: 1.5rem;
    }
    .lp_recruit_box img,.lp_contact_box img{
        margin-left: 1rem;
    }
    .lp_recruit_box,.lp_contact_box{
        padding: 2.5rem 2rem;
    }
    .lp_recruit_contact_p span{
        font-size: 1.2rem;
        line-height: 2.5rem;
    }
    .lp_recruit_contact_more{
        color: #fff;
        margin:1rem 0 0 auto;
        width: 35%;
		border-bottom:solid .5px #fff;
		padding:.5rem 1rem;
    }
    .migi{
        width: 2rem;
        height: .5rem;
        border-bottom: 1px solid #fff;
        border-right: 1px solid #fff;
        transform: skew(45deg);
        display: inline-block;
        margin-left: 1rem;
    }
	 /*バナー*/
    .lp_banner{
        width: 50%;
        margin: 0 auto;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
    .lp_banner img{
        vertical-align: top;
        width: 100%;
        border: solid .5px #ededed;
    }
    .lp_banner a{
        margin: 1rem auto;
        text-align: right;
        display: block;
    }
	.banner{
		padding-top:.5rem;
		padding-bottom:.5rem;
	}
    /*フッター*/
    footer{
        background-color: #3E3A39;
        padding-top: 2rem;
        padding-bottom: 2rem;
        color: #fff;
        width: 100%;
    }
    footer img{
        width: 30%;
        margin-bottom: 2rem;
        margin-left: 2rem;
    }
    .lp_footer_p{
        display: none;
    }
    .lp_footer_box p{
        font-size:.8rem;
    }
    .lp_footer_p_sp a{
        text-decoration: none;
        color: #fff;
        text-align: center;
        font-size: .8rem;
    }
    .lp_footer_p_sp{
        padding-bottom: .5rem;
        border-bottom: solid .5px #fff;
        text-indent: .5rem;
    }
    .lp_footer_box{
        display: none;
    }
	.lp_footer ul{
		padding:0;
	}
    .lp_footer_box_sp{
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap:1.5rem;
        margin: 0 auto;
        width: 80%;
        font-size: .8rem;
        margin: 0 auto;
    }
    .lp_footer_p2{
        font-size: .8rem;
        text-align: center;
        margin-top: 2rem;
    }

}
/*タブレット*/
@media(min-width: 481px) and (max-width: 980px){
     /*トップ画像*/
    .lp_top img{
        display: none;
   }
   .lp_top{
        width: 100%;
        height: auto;
        position: relative;
   }
   .lp_top video{
        width: 100%;
        height: 55vw;
   }
	.top-sp{
        display: none;
   }
	.scrolldown1{
  		display:none;
	}


  /* .lp_top::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 55vw;
	background-color: rgba(0,0,0,0.5);
	background-image: radial-gradient(#111 30%, transparent 31%), radial-gradient(#111 30%, transparent 31%);
	background-size: 4px 4px;
	background-position: 0 0, 2px 2px;
}
	.lp_catch{
    position: absolute;
    top:18vw;
    left: 6vw;
   } 
   .catch1{
    color: #adadad;
    font-family:'Roboto', sans-serif;
    font-size:1rem;
    letter-spacing: .3rem;
   }
   .catch2{
    color: #fff;
    font-size:1.5rem;
    letter-spacing: .3rem;
    margin-top: 2rem;
   }
   .catch3{
    color: #fff;
    font-size:1.5rem;
    letter-spacing: .3rem;
    margin-top: .5rem;
   }
   .catch2 span,.catch3 span{
    color: #C83131;
    font-size:2rem;
    font-weight: normal;
    letter-spacing: .3rem;
   }
*/
    /*見出し*/
    .lp_n{
        color: #C83131;
        margin-top: -1vw;
        font-family:'Roboto', sans-serif;
        font-weight: bold;
        font-size: .8rem;
    }
    .lp_p{
        color: #848484;
        margin-top: 2vw;
        font-size:.7rem;
        letter-spacing: .05rem;
    }
    .lp_e{
        font-family:'Roboto', sans-serif;
        font-size: 2rem;
        font-weight: normal;
        margin: 0;
    }
    .lp_indent{
        text-indent: 1rem;
    }
    .h2{
        display: flex;
        align-items: center;
        gap:2vw;
        letter-spacing: .2rem;
    }
    .h2 h2{
        font-family:'Roboto', sans-serif;
        font-size: 1.6rem;
        font-weight: normal;
        margin: 0;
        display: flex;
    }

    /*ニュース*/
    .lp_news{
        width: 90%;
        margin: 4rem auto 0 auto;
        padding-bottom: 4rem;
        display: grid;
		grid-template-areas:
			"a"
			"b"
			"c";
    }
	.lp_news .h2{
		padding-top:0;
	}
    
    .lp_news_link{
        display: flex;
        align-items: flex-end;
        gap:1rem;
        width: 60vw;
    }
    .lp_news_link a{
        text-decoration: none;
        color:#222222;
        padding: .3rem;
        border-bottom: solid #848484 .5px;
        display: flex;
        width: 100%;
    }
    .lp_news_link a p{
        font-size: .7rem;
    }
	.news-loop img{
		display:none;
	}
    .lp_news_link a img{
        margin-left: 1rem;
        margin-top: .3rem;
        width: 20%;
        height: 20%;
    }
	.news1{
		grid-area:a;
	}
	.news2{
		grid-area:b;
	}
	.news3{
		grid-area:c;
	}
	.news-loop{
		margin:1rem auto;
	}
	.news-loop .dateText{
		font-weight:normal;
		color:#848484;
		margin-right:1rem;
	}
	.news-loop a span{
		color:#222222;
		font-size:.7rem;
	}
	.news-loop a{
		text-decoration:none;	
	}
    .lp_news_link a{
        text-decoration: none;
        color:#222222;
        padding: .5rem 1rem;
        border-bottom: solid #848484 .5px;
        font-size: .7rem;
        display: flex;
    }
    .lp_news_link p{
        font-size: 14px;
    }
    
    .lp_news_link a img{
        margin-left: 1rem;
        margin-top: .2rem;
        width: 20%;
        height: 20%;
    }
	.news-notice{
		margin-right:1rem;
		background-color:#E6E6E6;
		padding:.1rem 1rem;
	}
	.news-event{
		margin-right:1rem;
		background-color:#C1B4B4;
		padding:.1rem 1rem;
	}
	.news-loop a .news-construction{
		margin-right:1rem;
		background-color:#3E3A39;
		padding:.1rem 1rem;
		color:#fff;
		width:6rem;
	}
    /*コンセプト*/
    .lp_concept{
        width: 100%;
        border-bottom: solid .5px #ededed;
        border-top: solid .5px #ededed;
    }
    .lp_concept-box{
        width: 90%;
        margin: 4rem auto;
        display: grid;
        grid-template-columns: 50% 45%;
        justify-content: center;
        align-items: center;
        gap:1.5rem;
    }
    .lp_concept img{
        vertical-align: top;
        width: 100%;
        height: auto;
    }
    .lp_concept h2{
        font-size:.8rem;
        line-height: 2rem;
        font-weight: 700;
    }
    .lp_concept_span2,.lp_concept_span1{
        margin-left: .8rem;
        font-size: .8rem;
    }
	.lp_concept_span1{
		display:block;	
	}
	.lp_concept-box .tb{
		display:none;	
	}
    .lp_concept p{
        font-size: .7rem;
        line-height: 1.5rem;
        margin-left: .5rem;
    }
    /*事業案内*/
    .lp_service{
        width: 90%;
        margin: 6vw auto;
    }
    .lp_service_p{
        font-size: .7rem;
        margin: 1rem auto;
        line-height: 1.5rem;
    }
    .lp_service_box{
        display: flex;
        grid-gap:1rem;
        margin: 0 auto;
        width: 100%;
    }
    .lp_service_box1{
        flex-basis: 32%;
    }
    .lp_service_box img{
        vertical-align: top;
        width: 100%;
        height: auto;
    }
    .lp_service_text{
        background-color:#F8F9F9;
        margin-top: -1vw;
        padding: 1vw 2vw;
        position: relative;
        width: 80%;
        height: 50%;
    }
    .lp_service_tytle{
        margin: 0;
        font-size: .7rem;
        color:#C83131; 
    }
    .lp_service_text_p{
        font-size:.7rem;
        margin-top: 2rem;
		margin-bottom:2rem;
        line-height: 1.2rem;
    }
    .lp_service_text h3{
        margin: .5rem auto;
        font-size:.8rem
    }
    .lp_service_text a p{
        font-size: .8rem;
    }
    .lp_service_text h3::after{
        background-color: #C83131; /* 線の色 */
        bottom: 7.5rem; /* 線の位置 */
        content: "";
        height: 2px; /* 線の高さ */
        left: 1rem; /* 線の中央寄せ */
        position: absolute;
        width: 30px; /* 線の長さ */
    }
    .lp_service_text a{
        text-decoration: none;
        display: flex;
        justify-content: flex-end;
        margin-top: 1rem;
        color: #222222;
        font-size:.7rem;
		position:absolute;
		bottom:1rem;
		right:1rem;
    }
    .lp_service_text a img{
        width: 10%;
        height: 20%;
        margin: .3rem 0 0 1rem;
        
    }
    .lp_service_text2{
        color:#C83131;
        font-weight: bold;
        margin-top: 4vw;
        text-align: center;
        font-size: .8rem;
    }
    /*施工事例*/
    .lp_works{
        background-color: #3E3A39;
        width: 100%;
        margin: 6vw auto 0 auto;
    }
    .lp_works_box{
        width: 90%;
        margin: 0 auto;
        padding-top: 6vw;
        padding-bottom: 4vw;
    }
    .lp_works .h2 h2,.lp_works .h2 .lp_p{
        color: #fff;
    }
    .lp_works_linkbox{
        margin: 2vw auto;
        width: 100%;
        text-align: center;
        display: grid;
        grid-template-columns: repeat(5,1fr);

    }
    .lp_works_linkbox img{
       width: 100%;
    }
    .lp_works_linkbox a{
        margin: 0 .3vw;

    }
    
    /*スクロールアニメーション*/
    @keyframes infinity-scroll-right {
        from {
          transform: translateX(-100%);
        }
          to {
          transform: translateX(100%);
        }
        }
        
        .scroll-infinity__wrap {
          display: flex;
          overflow: hidden;
          padding-bottom: 4rem;
        }
        .scroll-infinity__list {
          display: flex;
          list-style: none;
          padding: 0;
          gap:1rem;
          margin-left: 1rem;
        }
        .scroll-infinity__list--right {
          animation: infinity-scroll-right 30s infinite linear 0s both;
        }
        .scroll-infinity__item {
          width: calc(100vw / 3);
        }
        .scroll-infinity__item p{
            background-color: #fff;
            text-indent: 1rem;
            padding: .5rem 0;
            font-size:.7rem;
        }
        .scroll-infinity__item img {
          width: 100%;
          height: auto;
          vertical-align: top;
        }
    /*私たちについて*/
    .lp_aboutus{
        width: 100%;
        background-color: #E6E6E6;
    }
    .lp_aboutus_box{
        width: 90%;
        margin: 0 auto;
        padding-bottom: 6vw;
		padding-top:6vw;
    }
	.lp_about_img,.lp_aboutus_img{
		display:none;
	}
    .lp_aboutus_p1{
        text-align: center;
        font-weight: bold;
        font-size:.8rem;
		line-height:1.5rem;
		margin-top:2rem;
    }
    .lp_aboutus_p2{
        font-weight: normal;
        font-size:.7rem;
        margin: 1rem auto;
        text-align: center;
		line-height:1.5rem;
    }
	.lp_aboutus_p2 span{
		font-weight:bold;
		font-size:.7rem;
		color: #C83131;
	}
    
    .lp_aboutus_linkbox{
        width: 70%;
        margin: 0 auto;
        text-align: center;
        display: flex;
        justify-content: center;
    }
    .lp_aboutus_linkbox a{
        text-decoration: none;
        color: #222222;
        padding: .5rem 1rem;
        margin: 0 2rem;
        border-bottom: solid #848484 .5px;
        display: flex;
        justify-content: center;
        width: 100%;
    }
    .lp_aboutus_linkbox a p{
        font-size: .7rem;
    }
    .lp_aboutus_linkbox img{
        margin-left: 1rem;
        margin-top: .3rem;
    }
	.migi{
        width: 2rem;
        height: .5rem;
        border-bottom: 1px solid #222222;
        border-right: 1px solid #222222;
        transform: skew(45deg);
        display: inline-block;
        margin-left: 1rem;
    }
	.lp_aboutus_migi{
        width: 2rem;
        height: .5rem;
        border-bottom: 1px solid #222222;
        border-right: 1px solid #222222;
        transform: skew(45deg);
        display: inline-block;
        margin-left: 1rem;
		margin-top:.5rem;
    }
    .lp_recruit .migi, .lp_contact .migi{
        width: 2rem;
        height: .5rem;
        border-bottom: 1px solid #fff;
        border-right: 1px solid #fff;
        transform: skew(45deg);
        display: inline-block;
        margin-left: 1rem;
    }
    .lp_recruit_contact{
        display: grid;
        grid-template-columns: 50% 50%;
        color: #fff;
		height:40%;
    }
    .lp_recruit{
        background-image: url(image/top/lp_front15.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        height: 40%;
        padding: 1rem;
    }
	.lp_recruit_img,.lp_contact_img{
		display:none;
	}
    .lp_contact{
        background-image: url(image/top/lp_front16.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        height: 40%;
        padding: 1rem;
    }
    .lp_recruit_box .h2,.lp_contact_box .h2{
        color: #fff;
		padding-top:1rem;
    }
    .lp_recruit_contact .lp_p{
        color: #fff;
    }
    .lp_recruit_contact_p{
        margin-top: 1rem;
        line-height: 1.5rem;
        font-size:.7rem;
		text-align:left;
    }
    .lp_recruit_contact_p span{
        font-size:1.2rem;
        margin-right: 2rem;
        line-height: 2rem;
    }
    .lp_recruit_contact a{
        text-decoration: none;
        color: #fff;
        display: block;
        font-size:.8rem;
        text-align: center;
    }
    .lp_recruit_contact a img{
        margin-left: 1rem;
    }
	.lp_recruit_contact_more{
		width:40%;
		margin:1rem 1rem 1rem auto;
		border-bottom:solid .5px #fff;
		padding-bottom:.2rem;
		position:relative;
		display:flex;
		align-items:center;
		justify-content:center;
		font-size:12px;
	}
    /*バナー*/
    .lp_banner{
        display: grid;
        grid-template-columns: repeat(3,1fr);
        justify-content: center;
        align-items: center;
        gap:.5rem 1rem;
        height:10%;
        width: 50%;
        margin: -14rem auto 2rem auto;
    }
    .lp_banner img{
        width: 100%;
		border:solid 1px #ededed;
    }
	.banner{
		padding-top:.5rem;
		padding-bottom:.5rem;
	}
    /*フッター*/
    footer{
        background-color: #3E3A39;
        color: #fff;
        padding: 2rem;
    }
    footer img{
        margin: 0 auto 2rem 4rem;
        width: 15%;
    }
    .lp_footer_box{
        display: flex;
        gap:1rem;
        justify-content: center;
        align-items: flex-start;
        margin: 0 auto 4rem auto;
    }
    .lp_footer_box ul{
        padding-left: 0;
    }
    .lp_footer_ul{
        display: block;
        gap:1rem;
    }
    footer li{
        list-style-type: none;
        margin-top: .5rem;
    }
    footer a{
        text-decoration: none;
        color: #fff;
        padding-left: .5rem;
        padding-right: .5rem;
        font-size: .7rem;
    }
    .lp_footer_box p{
        border-bottom: solid .5px #fff;
        padding-bottom: .5rem;
        padding-left: .5rem;
        font-size: .7rem;
    }
    .lp_footer_p{
        padding-left: .5rem;
        width: 15%;
    }
    .lp_footer_p p{
        padding-right: 1rem;
        padding-top: 1rem;
        padding-left: 0;
    }
    .lp_footer_p2{
        text-align: center;
        font-size: .7rem;
        padding-top: 1rem;
    }
    .lp_footer_p_sp{
        display: none;
    }
}

/************************************
** 事業案内
************************************/
@media screen and (min-width: 981px) {
    .service_box1{
        width: 70%;
        margin: 4rem auto;
        display: grid;
        grid-template-areas:
            "a b"
            "c b";
        grid-template-columns: 45% 45%;
        grid-template-rows: 30% 70%;
        height: 30%;
        justify-content: center;
        grid-gap:1rem 6rem;
        padding-bottom: 16rem;
    }
    .service_box1 h3{
        font-size:1.8rem;
        font-weight: normal;
        grid-area: a;
    }
    .service_box1 h3 span{
        font-family:'Roboto', sans-serif;
        color: #c83131;
        font-size: 1.8rem;
        margin-right: 1rem;
    }
    .service_textbox{
        grid-area: c;
    }
    .service_textbox p{
        line-height: 2rem;
        font-size: .8rem;
    }
    .service_box1 h4{
        border-left: solid 3px #c83131;
        padding-left: 1rem;
    }
    .service_img1{
        grid-area: b;
    }
    .service_img1 img{
        vertical-align: top;
        width: 85%;
        position: relative;
        margin-left: 2rem;
    }
    .service_img_backgroung{
        background-color: #ededed;
        width: 100%;
        height: 70%;
        position: relative;
        top:-60%;
        z-index: -1;
    }
    .service_img_e1{
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        color: #c83131;
        position: relative;
        top:-32vw;
        right: -29.5vw;
        z-index: 3;
        white-space: nowrap;
    }
    .service_img_e2{
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        color: #c83131;
        position: relative;
        top:-32vw;
        right: -.5vw;
        z-index: 3;
        white-space: nowrap;
    }
    .service_img_e3{
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        color: #c83131;
        position: relative;
        top:-32vw;
        right: -29vw;
        z-index: 3;
        white-space: nowrap;
    }
    .service_box2{
        width: 70%;
        margin: 4rem auto;
        padding-bottom: 16rem;
        display: grid;
        grid-template-areas:
            "b a"
            "b c";
        grid-template-columns: 45% 45%;
        grid-template-rows: 30% 70%;
        height: 30%;
        justify-content: center;
        grid-gap:1rem 6rem;
    }
    .service_box2 h3{
        font-size:1.8rem;
        font-weight: normal;
        grid-area: a;
    }
    .service_box2 h3 span{
        font-family:'Roboto', sans-serif;
        color: #c83131;
        font-size: 1.8rem;
        margin-right: 1rem;
    }
    .service_box2 h4{
        border-left: solid 3px #c83131;
        padding-left: 1rem;
        font-weight: normal;
    }
    .service_img2{
        grid-area: b;
    }
    .service_img2 img{
        vertical-align: top;
        width: 85%;
        position: relative;
        margin-left: 3rem;
    }
}
@media(min-width: 481px) and (max-width: 980px){
    .service_box1{
        width: 90%;
        margin: 4rem auto;
        display: grid;
        grid-template-areas:
            "a b"
            "c b";
        grid-template-columns: 48% 48%;
        grid-template-rows: 10% 90%;
        height: 30%;
        justify-content: center;
        grid-gap:1rem 2rem;
        padding-bottom: 2rem;
    }
    .service_box1 h3{
        font-size:1.2rem;
        font-weight: normal;
        grid-area: a;
        margin: 0;
    }
    .service_box1 h3 span{
        font-family:'Roboto', sans-serif;
        color: #c83131;
        font-size: 1.2rem;
        margin-right: 1rem;
    }
    .service_textbox{
        grid-area: c;
    }
    .service_textbox p{
        line-height: 1.5rem;
        font-size: .7rem;
    }
    .service_box1 h4{
        border-left: solid 3px #c83131;
        padding-left: 1rem;
        font-weight: normal;
        font-size: .8rem;
    }
    .service_img1{
        grid-area: b;
    }
    .service_img1 img{
        vertical-align: top;
        width: 85%;
        position: relative;
        margin-left: 1rem;
    }
    .service_img_backgroung{
        background-color: #ededed;
        width: 100%;
        height: 50%;
        position: relative;
        top:-40%;
        z-index: -1;
    }
    .service_img_e1{
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        color: #c83131;
        position: relative;
        top:-50vw;
        right: -39vw;
        z-index: 3;
        white-space: nowrap;
    }
    .service_img_e2{
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        color: #c83131;
        position: relative;
        top:-50vw;
        right: -.5vw;
        z-index: 3;
        white-space: nowrap;
    }
    .service_img_e3{
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        color: #c83131;
        position: relative;
        top:-50vw;
        right: -39vw;
        z-index: 3;
        white-space: nowrap;
    }
    .service_box2{
        width: 90%;
        margin: 4rem auto;
        padding-bottom: 2rem;
        display: grid;
        grid-template-areas:
            "b a"
            "b c";
        grid-template-columns: 48% 48%;
        grid-template-rows: 10% 90%;
        height: 30%;
        justify-content: center;
        grid-gap:1rem 2rem;
    }
    .service_box2 h3{
        font-size:1.2rem;
        font-weight: normal;
        grid-area: a;
        margin: 0;
    }
    .service_box2 h3 span{
        font-family:'Roboto', sans-serif;
        color: #c83131;
        font-size: 1.2rem;
        margin-right: 1rem;
    }
    .service_box2 h4{
        border-left: solid 3px #c83131;
        padding-left: 1rem;
        font-weight: normal;
        font-size: .8rem;
    }
    .service_img2{
        grid-area: b;
    }
    .service_img2 img{
        vertical-align: top;
        width: 85%;
        position: relative;
        margin-left: 2.5rem;
    }
}
@media screen and (max-width: 480px) {
    .service_box1{
        width: 100%;
        margin: 2rem auto;
        display: grid;
        grid-template-areas:
            "a"
            "b"
            "c";
        grid-template-rows:5% 30% 50%;
        justify-content: center;
        height: 90%;
    }
    .service_box1 h3{
        font-size:1.2rem;
        font-weight: normal;
        grid-area: a;
        margin: 0 auto 2rem 2rem;
    }
    .service_box1 h3 span{
        font-family:'Roboto', sans-serif;
        color: #c83131;
        font-size: 1.2rem;
        margin-right: 1rem;
    }
    .service_textbox{
        grid-area: c;
        width: 80%;
        margin: 2rem auto 0 auto;
    }
    .service_textbox p{
        line-height: 2rem;
        font-size: .8rem;
    }
    .service_box1 h4{
        border-left: solid 3px #c83131;
        padding-left: 1rem;
        font-weight: normal;
        font-size: .8rem;
    }
    .service_img1{
        grid-area: b;
    }
    .service_img1 img{
        vertical-align: top;
        width: 85%;
        position: relative;
    }
    .service_img_backgroung{
        background-color: #ededed;
        width: 100%;
        height: 50%;
        position: relative;
        top:-40%;
        z-index: -1;
    }
    .service_img_e1{
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        color: #c83131;
        position: relative;
        top:-88vw;
        right: -88vw;
        z-index: 3;
        white-space: nowrap;
    }
    .service_img_e2{
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        color: #c83131;
        position: relative;
        top:-85vw;
        right: -6vw;
        z-index: 3;
        white-space: nowrap;
    }
    .service_img_e3{
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        color: #c83131;
        position: relative;
        top:-85vw;
        right: -88vw;
        z-index: 3;
        white-space: nowrap;
    }
    .service_box2{
        width: 100%;
        margin: 2rem auto;
        display: grid;
        grid-template-areas:
            "a"
            "b"
            "c";
        height: 90%;
        grid-template-rows:5% 30% 50%;
        justify-content: center;
    }
    .service_box2 h3{
        font-size:1.2rem;
        font-weight: normal;
        grid-area: a;
        margin: 0 auto 2rem 2rem;
    }
    .service_box2 h3 span{
        font-family:'Roboto', sans-serif;
        color: #c83131;
        font-size: 1.2rem;
        margin-right: 1rem;
    }
    .service_box2 h4{
        border-left: solid 3px #c83131;
        padding-left: 1rem;
        font-weight: normal;
        font-size: .8rem;
    }
    .service_img2{
        grid-area: b;
    }
    .service_img2 img{
        vertical-align:top;
        width: 85%;
        position: relative;
        margin: 0 0 0 auto;
        display: block;
    }
}
/************************************
** 企業理念
************************************/
@media screen and (min-width: 981px) {
	.lp-philosophy_body{
		width: 100%;
		color:#222222;
		font-family:'Noto Sans JP',sans-serif;
        box-sizing: border-box;
	}
    .lp-philosophy_body .h2{
        width: 70%;
        margin: 0 auto;
    }
    /*ミッション*/
	.lp-philosophy-box1{
		width:70%;
		display:grid;
		grid-template-columns:55% 45%;
		grid-template-rows:30% 70%;
		justify-content:center;
		margin:8rem auto;
		font-weight:normal;
		grid-gap:0;
		grid-template-areas:
			"a b"
			"c b";
	}

	.lp-philosophy-box1 h2{
		font-size:3rem;
		font-weight:normal;
		letter-spacing:.2rem;
		display:flex;
		margin:2rem auto;
		grid-area:a;
		text-align:left;
        font-family:'Roboto', sans-serif;
	}
	.lp-philosophy-box1 h2:after{
		content: '';
  		height: 1px;
		width:34rem;
  		background: #3E3A39;
		display:block;
		margin-top:3.5rem;
        margin-left: 1rem;
    }
	.lp-philosophy-h2-span1{
		color: #C83131;
        font-size: 3rem;
	}

	.lp-philosophy-h2-span2{
		color: #222222;
        font-size: 3rem;
	}
	.lp-philosophy-h2-span3{
		color: #3E3E3E;
        font-size: 3rem;
	}
	.lp-philosophy-h2-span4{
		color: #636363;
        font-size: 3rem;
	}
	.lp-philosophy-box1-text{
		grid-area:c;
		margin-left:4rem;
	}
	.lp-philosophy-box1-img{
		grid-area:b;
        opacity: 0;
	}
    
    .lp-philosophy-box1-img img{
        vertical-align: top;
        width: 100%;
        height: auto;
    }
	.lp-philosophy-box1-text h3{
		font-weight:bold;
		line-height:2.5rem;
		font-family:'Noto Sans JP',sans-serif;
		font-size:1.2rem;
	}
	.lp-philosophy-box1-text p{
		font-size:1rem;
		line-height:2.5rem;
		margin:2vw auto;
		font-family:'Noto Sans JP',sans-serif;
	}
    /*ビジョン*/	
	.lp-philosophy-box2{
		width:70%;
		display:grid;
		grid-template-columns:45% 55%;
		grid-template-rows:30% 70%;
		justify-content:center;
		margin:8rem auto;
		font-weight:normal;
		grid-gap:0;
		grid-template-areas:
			"b a"
			"b c";
	}
	.lp-philosophy-box2 h2{
		color:#fff;
		font-size:3rem;
		font-weight:400;
		letter-spacing:.2rem;
		display:flex;
		margin:2rem auto;
		grid-area:a;
		font-family:'Roboto', sans-serif;
		text-align: right;
	}
	.lp-philosophy-box2 h2:before {
		content: '';
		height: 1px;
	  	width:35rem;
		background: #040404;
	  	display:block;
	  	margin-top:3.5rem;
	  	margin-right: 2rem;
}
	.lp-philosophy-box2-text{
		grid-area:c;
		margin-left:4rem;
	}
	.lp-philosophy-box2-img{
		grid-area:b;
        opacity: 0;
	}
    .lp-philosophy-box2-img img{
        vertical-align: top;
        width: 100%;
        height: auto;
    }
	.lp-philosophy-box2-text h3{
		font-weight:400;
		line-height:2rem;
		font-weight:bold;
		font-size:1.2rem;
		font-family:'Noto Sans JP',sans-serif;
	}
	.lp-philosophy-box2-text p{
		font-size:1rem;
		line-height:2.5rem;
		margin:2rem auto;
		font-family:'Noto Sans JP',sans-serif;
	}
    /*「ものづくり」が好きな理由*/
	.lp-philosophy-box3{
		width:70%;
		display:grid;
		grid-template-columns:50% 45%;
		justify-content:center;
		margin:8rem auto;
		font-weight:normal;
		grid-gap:4rem;
		grid-template-areas:
			"a b";
	}
	.lp-philosophy-box3-text{
		grid-area:a;
	}
	.lp-philosophy-box3-img{
		grid-area:b;
        opacity: 0;
	}
    .lp-philosophy-box3-img img{
        vertical-align: top;
        width: 100%;
        height: auto;
    }
	.lp-philosophy-box3-text h2{
		font-weight:bold;
		line-height:2.5rem;
		font-size:1.2rem;
        margin-left: -.5rem;
	}
	.lp-philosophy-box3-text p{
		font-size:1rem;
		line-height:2.5rem;
		margin:2rem auto;
	}
    /*「ものづくり」が得意な理由*/
	.lp-philosophy-box4{
		width:70%;
		display:grid;
		grid-template-columns:45% 50%;
		justify-content:center;
		margin:8rem auto;
		font-weight:normal;
		grid-gap:4rem;
		grid-template-areas:
			"a b";
	}
    .lp-philosophy-box4-img{
        opacity: 0;
        grid-area: a;
    }
    .lp-philosophy-box4-img img{
        width: 100%;
        height: auto;
        vertical-align: top;
    }
	.lp-philosophy-box4-text{
		display:flex;
		align-items:left;
		flex-direction:column;
	}
	.lp-philosophy-box4-text h2{
		font-weight:bold;
		line-height:2.5rem;
		font-size:1.2rem;
        margin-left: -.5rem;
	}
	.lp-philosophy-box4-text p{
		font-size:1rem;
		line-height:2.5rem;
		margin-top:2rem;
	}
    /*代表ご挨拶*/
    .lp-philosophy-box5{
        width: 70%;
        margin: 6rem auto;
        display: grid;
        grid-template-columns: 55% 40%;
        grid-template-rows: 20% 80%;
        justify-content: center;
        margin: 8rem auto;
        font-weight: normal;
        grid-gap: 2rem 4rem;
        grid-template-areas:
        "a a"
        "b c";
    }
    .lp-philosophy-box5 h2{
        font-size:3rem;
		font-weight:normal;
		letter-spacing:.2rem;
		display:flex;
		margin:2rem auto;
		grid-area:a;
		text-align:left;
        font-family:'Roboto', sans-serif;
    }
    .lp-philosophy-box5 h2:after{
		content: '';
  		height: 1px;
		width:68rem;
  		background: #3E3A39;
		display:block;
		margin-top:3.5rem;
        margin-left: 1rem;
    }
    .lp-philosophy-box5-text{
        margin: 2rem auto 2rem 2rem;
        grid-area: b;
    }
    .lp-philosophy-box5-text h3{
        font-size: 1.2rem;
    }
    .lp-philosophy-box5-text p{
        line-height: 2rem;
        margin: 2rem auto;
    }
    .lp-philosophy-box5-img{
        grid-area: c;
    }
    .lp-philosophy-box5-img img{
        vertical-align: top;
        width: 100%;
        height: auto;
    }
    .lpcompany-box5-p2{
        font-weight: bold;
    }
    /*ラックプラスの10か条*/
	.lp-philosophy-box6{
		width:70%;
		margin:4rem auto;
        display: flex;
        align-items: center;
        flex-direction: column;
	}
	.lp-philosophy-box6 h2{
		font-weight:bold;
		text-align:center;
		font-size:1.2rem;
		margin:2rem auto;
	}
    .lp-philosophy-box6 img{
        text-align: center;
        margin: 2rem auto;
        vertical-align: top;
    }
	.lp-philosophy-box7{
		display:flex;
		justify-content:center;
		width:40%;
		grid-gap:4vw;
		margin:0 auto;
		padding-bottom:8vw;
	}
	.lp-philosophy-box7 a{
		text-decoration:none;
		border: solid 1px #848484;
		padding:.5rem;
		margin:2rem auto;
		display:block;
		text-align:center;
		color:#222222;
		font-size:1rem;
		font-weight:bold;
		width:90%;
	}

}
@media(min-width: 481px) and (max-width: 980px){
	.lp-philosophy_body{
		width: 100%;
		color:#222222;
		font-family:'Noto Sans JP',sans-serif;
        box-sizing: border-box;
	}
    .lp-philosophy_body .h2{
        width: 90%;
        margin: 0 auto;
    }
    /*ミッション*/
	.lp-philosophy-box1{
		width:90%;
		display:grid;
		grid-template-columns:55% 45%;
		grid-template-rows:20% 80%;
		justify-content:center;
		margin:6rem auto;
		font-weight:normal;
		grid-gap:0;
		grid-template-areas:
			"a b"
			"c b";
	}

	.lp-philosophy-box1 h2{
		font-size:2rem;
		font-weight:normal;
		letter-spacing:.2rem;
		display:flex;
		margin:0 auto;
		grid-area:a;
		text-align:left;
        font-family:'Roboto', sans-serif;
	}
	.lp-philosophy-box1 h2:after{
		content: '';
  		height: 1px;
		width:34rem;
  		background: #3E3A39;
		display:block;
		margin-top:2.5rem;
        margin-left: 1rem;
    }
	.lp-philosophy-h2-span1{
		color: #C83131;
        font-size:2rem;
	}

	.lp-philosophy-h2-span2{
		color: #222222;
        font-size:2rem;
	}
	.lp-philosophy-h2-span3{
		color: #3E3E3E;
        font-size:2rem;
	}
	.lp-philosophy-h2-span4{
		color: #636363;
        font-size:2rem;
	}
	.lp-philosophy-box1-text{
		grid-area:c;
	}
	.lp-philosophy-box1-img{
		grid-area:b;
	}
    .lp-philosophy-box1-img img{
        vertical-align: top;
        width: 100%;
        height: auto;
    }
	.lp-philosophy-box1-text h3{
		font-weight:bold;
		line-height:2rem;
		font-family:'Noto Sans JP',sans-serif;
		font-size:.8rem;
	}
	.lp-philosophy-box1-text p{
		font-size:.7rem;
		line-height:1.5rem;
		margin:1rem auto;
		font-family:'Noto Sans JP',sans-serif;
	}
    /*ビジョン*/	
	.lp-philosophy-box2{
		width:90%;
		display:grid;
		grid-template-columns:45% 55%;
		grid-template-rows:20% 80%;
		justify-content:center;
		margin:6rem auto;
		font-weight:normal;
		grid-gap:0;
		grid-template-areas:
			"b a"
			"b c";
	}
	.lp-philosophy-box2 h2{
		font-size: 2rem;
        font-weight: normal;
        letter-spacing: .2rem;
        display: flex;
        align-items: flex-end;
        grid-area: a;
        text-align: right;
        font-family: 'Roboto', sans-serif;
	}
	.lp-philosophy-box2 h2:before {
		content: '';
		height: 1px;
	  	width:19rem;
		background: #3E3A39;
	  	display:block;
	  	bottom:2.5rem;
        margin-right: 1rem;
    }
	.lp-philosophy-box2-text{
		grid-area:c;
        margin-left: 1rem;
	}
	.lp-philosophy-box2-img{
		grid-area:b;
	}
    .lp-philosophy-box2-img img{
        vertical-align: top;
        width: 100%;
        height: auto;
    }
	.lp-philosophy-box2-text h3{
		font-weight: bold;
        line-height: 2rem;
        font-family: 'Noto Sans JP',sans-serif;
        font-size: .8rem;
	}
	.lp-philosophy-box2-text p{
		font-size: .7rem;
        line-height: 1.5rem;
        margin: 1rem auto;
        font-family: 'Noto Sans JP',sans-serif;
	}
    /*「ものづくり」が好きな理由*/
	.lp-philosophy-box3{
		width:90%;
		display:grid;
		grid-template-columns:50% 45%;
		justify-content:center;
		margin:6rem auto;
		font-weight:normal;
		grid-gap:1rem;
		grid-template-areas:
			"a b";
	}
	.lp-philosophy-box3-text{
		grid-area:a;
	}
	.lp-philosophy-box3-img{
		grid-area:b;
	}
    .lp-philosophy-box3-img img{
        vertical-align: top;
        width: 100%;
        height: auto;
    }
	.lp-philosophy-box3-text h2{
		font-weight:bold;
		line-height:2rem;
		font-size:.8rem;
        margin-left: -.5rem;
        margin-top: 0;
	}
	.lp-philosophy-box3-text p{
		font-size:.7rem;
		line-height:1.5rem;
		margin:0 auto;
	}
    /*「ものづくり」が得意な理由*/
	.lp-philosophy-box4{
		width:90%;
		display:grid;
		grid-template-columns:45% 50%;
		justify-content:center;
		margin:6rem auto;
		font-weight:normal;
		grid-gap:1rem;
		grid-template-areas:
			"a b";
	}
    .lp-philosophy-box4-img img{
        width: 100%;
        height: auto;
        vertical-align: top;
    }
	.lp-philosophy-box4-text{
		display:flex;
		align-items:left;
		flex-direction:column;
	}
	.lp-philosophy-box4-text h2{
		font-weight:bold;
		line-height:2rem;
		font-size:.8rem;
        margin-left: -.5rem;
        margin-top: 0;
	}
	.lp-philosophy-box4-text p{
		font-size:.7rem;
		line-height:1.5rem;
	}
    /*代表ご挨拶*/
    .lp-philosophy-box5{
        width: 90%;
        margin: 6rem auto;
        display: grid;
        grid-template-columns: 55% 40%;
        grid-template-rows: 20% 80%;
        justify-content: center;
        margin: 6rem auto;
        font-weight: normal;
        grid-gap: 1rem 1rem;
        grid-template-areas:
        "a a"
        "b c";
    }
    .lp-philosophy-box5 h2{
        font-size:2rem;
		font-weight:normal;
		letter-spacing:.2rem;
		display:flex;
        justify-content: flex-start;
		margin:0 auto 0 0;
		grid-area:a;
		text-align:left;
        font-family:'Roboto', sans-serif;
    }
    .lp-philosophy-box5 h2:after{
		content: '';
  		height: 1px;
		width:30rem;
  		background: #3E3A39;
		display:block;
		margin-top:2.5rem;
        margin-left: 1rem;
    }
    .lp-philosophy-box5-text{
        grid-area: b;
    }
    .lp-philosophy-box5-text h3{
        font-size: .8rem;
        margin-top: 0;
    }
    .lp-philosophy-box5-text p{
        line-height: 1.5rem;
        margin: 0 auto;
        font-size:.7rem;
    }
    .lp-philosophy-box5-img{
        grid-area: c;
    }
    .lp-philosophy-box5-img img{
        vertical-align: top;
        width: 100%;
        height: auto;
    }
    .lpcompany-box5-p2{
        font-weight: bold;
    }
    /*ラックプラスの10か条*/
	.lp-philosophy-box6{
		width:70%;
		margin:4rem auto;
        display: flex;
        align-items: center;
        flex-direction: column;
	}
	.lp-philosophy-box6 h2{
		font-weight:bold;
		text-align:center;
		font-size:.8rem;
		margin:2rem auto;
	}
    .lp-philosophy-box6 img{
        text-align: center;
        margin: 2rem auto;
        vertical-align: top;
        width: 100%;
    }
	.lp-philosophy-box7{
		display:flex;
		justify-content:center;
		width:40%;
		grid-gap:4vw;
		margin:0 auto;
		padding-bottom:8vw;
	}
	.lp-philosophy-box7 a{
		text-decoration:none;
		border: solid 1px #848484;
		padding:.5rem;
		margin:2rem auto;
		display:block;
		text-align:center;
		color:#222222;
		font-size:1rem;
		font-weight:bold;
		width:90%;
	}

}
@media screen and (max-width: 480px) {
    .lp-philosophy_body .h2{
        width: 80%;
        margin: 2rem auto;
    }
	.lp-philosophy_body{
		width: 100%;
		position: relative;
		color:#222222;
        font-family:'Noto Sans JP',sans-serif;
	}
    /*ものづくりが好きな理由*/
	.lp-philosophy-box1 h2{
		color:#fff;
		font-size:2.5rem;
		font-weight:400;
		letter-spacing:.2rem;
		margin:0 auto 0 0;
		grid-area:b;
        font-family:'Roboto', sans-serif;
		position:relative;
		text-align:left;
	}

	.lp-philosophy-box1 h2:after{
		content: '';
		height: 1px;
		width:90vw;
		background: #848484;
		display:block;
		position:absolute;
		top:3.5rem;
		left:0;
	}
	.lp-philosophy-h2-span1{
		color: #C83131;
		padding-left:2rem;
        font-size: 2.2rem;
	}

	.lp-philosophy-h2-span2{
		color: #040404;
        font-size: 2.2rem;
	}

	.lp-philosophy-h2-span3{
		color: #3E3E3E;
        font-size: 2.2rem;
	}
	.lp-philosophy-h2-span4{
		color: #636363;
        font-size: 2.2rem;
	}
    .lp-philosophy-h2-span5{
		color: #C83131;
		padding-left:2rem;
        font-size: 2.2rem;
	}
	.lp-philosophy-box1{
		width:100%;
		margin:6rem 0 6rem auto;
		display:grid;
		grid-template-columns:1fr;
		grid-template-rows:auto auto auto;
		grid-template-areas:
			"a"
			"b"
			"c";
	}
	.lp-philosophy-box1-text{
		grid-area:c;
		background-color:#fff;
		width:80%;
		padding-top:30rem;
		margin: -30rem auto 0 auto;
		z-index:-2;
	}
	.lp-philosophy-box1-img{
		grid-area:a;
		width:90%;
		position:relative;
		z-index:-1;
		margin:0 0 0 auto;
	}
	.lp-philosophy-box1-img img{
		vertical-align: top;
        width: 100%;
	}
	.lp-philosophy-box1 h3{
		font-weight:bold;
		line-height:2rem;
		margin:1.5rem auto;
		font-size:1rem;
	}
	.lp-philosophy-box1-text p{
		font-size:.8rem;
		line-height:2rem;
		margin:1rem auto;
	}	
    /*ビジョン*/
	.lp-philosophy-box2{
		margin:6rem auto;
		display:grid;
		grid-template-columns:1fr;
		grid-auto-rows:auto auto auto;
		grid-template-areas:
			"a"
			"b"
			"c";
	}
	.lp-philosophy-box2 h2{
		color:#fff;
		font-size:2.5rem;
		font-weight:normal;
		letter-spacing:.2rem;
		display:flex;
		margin:0 0 0 auto;
		text-align:right;
		grid-area:b;
		padding-right:2rem;
		position:relative;
	}
	.lp-philosophy-box2 h2:before{
		content: '';
		height: 1px;
		width: 90vw;
		background: #848484;
		display: block;
		position:absolute;
		top:3.5rem;
		right:0;
	}
	.lp-philosophy-box2 h3{
		font-weight:bold;
		line-height:2rem;
		margin:1.5rem auto;
		font-size:1rem;
	}
	.lp-philosophy-box2-text{
		grid-area:c;
		background-color:#fff;
		width:80%;
		margin: 0 auto;
		grid-area:c;
		z-index:-2;
	}
	.lp-philosophy-box2-img{
		grid-area:a;
		width:90%;
		position:relative;
		z-index:-1;
		margin:0 auto 0 0;
	}
    .lp-philosophy-box2-img img{
        width: 100%;
        vertical-align: auto;
    }
	.lp-philosophy-box2-text p{
		font-size:.8rem;
		line-height:2rem;
		margin:2rem auto;
	}
    /*ものづくりが好きな理由*/	
	.lp-philosophy-box3{
		width:100%;
		margin:6rem auto 6rem 0;
		display:grid;
		grid-template-columns:20% 80%;
		grid-auto-flow:auto auto auto;
		grid-template-areas:
			"a b"
			"c c";
	}
    .lp-philosophy-h2-span5{
        color: #C83131;
		padding-left:0;
    }
	.lp-philosophy-box3-text{
		width:80%;
		grid-area:c;
		background-color:#fff;
		padding-top:10rem;
		margin: -10rem auto 0 auto;
	}
	.lp-philosophy-box3-p{
		writing-mode:vertical-rl;
		transform:rotate(180deg);
		color:#fff;
		font-size:2.5rem;
		font-weight:normal;
		letter-spacing:.05em;
		display:flex;
		margin: 0 auto 0 1rem;
		text-align:left;
		grid-area:"a";
		
	}
	.lp-philosophy-box3-p:after {
		content: '';
  		height: 13rem;
		width:1px;
        position: relative;
        bottom: -1rem;
        right: 2.5rem;
  		background: #848484;
		display:block;
		
    }
	.lp-philosophy-box3-img{
		grid-area:b;
		margin-right:0;
        width: 100%;
	}
    .lp-philosophy-box3-img img{
        width: 100%;
        vertical-align: top;
    }
	.lp-philosophy-box3-text h2{
		font-weight:bold;
		font-size:1rem;
		margin:2rem auto 2rem -.5rem;
	}
	.lp-philosophy-box3-text p{
		font-size:.8rem;
		line-height:8vw;
		margin:2rem auto;
	}
    /*ものづくりが得意な理由*/
	.lp-philosophy-box4{
		width:100%;
		margin:6rem auto 6rem 0;
		display:grid;
		grid-template-columns:1fr;
		grid-auto-flow:auto auto auto;
		grid-template-areas:
			"a"
			"b";
	}
	.lp-philosophy-box4-img{
		width:80%;
		margin-left:0;
		position:relative;
	}
    .lp-philosophy-box4-img img{
        width: 100%;
        vertical-align: top;
    }
	.lp-philosophy-box4-text{
		width:80%;
		margin:0 auto;
		background-color:#fff;
		margin: 0 auto;
	}
	.lp-philosophy-box4-text h2{
		font-weight:bold;
		font-size:1rem;
		margin:2rem auto;
	}
	.lp-philosophy-box4-text p{
		font-size:.8rem;
		line-height:2rem;
		margin:2rem auto;
	}
    /*代表挨拶*/
	.lp-philosophy-box5{
		width:100%;
		margin:6rem auto 6rem 0;
		display:grid;
		grid-template-columns:20% 80%;
		grid-template-areas:
			"a b"
			"c c";
	}
	.lp-philosophy-box5 h2{
		writing-mode: vertical-rl;
        transform: rotate(180deg);
        color: #fff;
        font-size: 2.5rem;
        font-weight: normal;
        letter-spacing: .05em;
        display: flex;
        margin: 0 auto 0 1rem;
        text-align: left;
        grid-area: a;
	}
    .lp-philosophy-box5-img{
        grid-area: b;
    }
    .lp-philosophy-box5-img img{
        width: 100%;
        vertical-align: top;
    }
    .lp-philosophy-box5-text{
        grid-area: c;
        width: 80%;
        margin: 0 auto; 
    }
    .lp-philosophy-box5-text h3{
        font-size: 1rem;
        margin: 2rem auto;
    }
    .lp-philosophy-box5 h2:after {
		content: '';
  		height: 9rem;
		width:1px;
        position: relative;
        bottom: -1rem;
        right: 2.5rem;
  		background: #848484;
		display:block;
    }
    .lpcompany-box5-p1{
        font-size:.8rem;
        line-height: 2rem;
    }
    .lpcompany-box5-p2{
        font-weight: bold;
        text-align: right;
        margin: 2rem auto;
        font-size: .8rem;
    }
    /*ラックハウジングの10ヶ条*/
	.lp-philosophy-box6{
		display:block;
		width:80%;
		grid-gap:4vw;
		margin:0 auto;
		padding-bottom:6rem;
	}
    .lp-philosophy-box6 h2{
        font-size: 1rem;
        text-align: center;   
    }
	.lp-philosophy-box6 a{
		text-decoration:none;
		border: solid 1px #040404;
		padding:2vw;
		margin:4vw auto;
		display:block;
		text-align:center;
		color:#040404;
		font-size:3vw;
		font-weight:bold;
		width:90%;
	}
    .lp-philosophy-box6 img{
        vertical-align: top;
        margin: 2rem auto;
        width: 100%;

    }
    /*リンク*/
    .lp-philosophy-box7{
		display:block;
		width:50%;
		grid-gap:2rem;
		margin:0 auto;
		padding-bottom:6rem;
	}
	.lp-philosophy-box7 a{
		text-decoration:none;
		border: solid 1px #848484;
		padding:.5rem;
		margin:1rem auto;
		display:block;
		text-align:center;
		color:#222222;
		font-size:.8rem;
		width:90%;
	}
}
/************************************
** 私たちの強み
************************************/
@media screen and (min-width: 981px) {
    .lp-lhoa-body{
        width: 100%;
		color:#222222;
		font-family:'Noto Sans JP',sans-serif;
        padding-bottom: 8rem;
    }
    .lp-lhoa-body .h2{
        width: 61%;
        margin: 0 auto;
        padding-top: 8rem;
    }
	.lp-lhoa-box1{
		width:61%;
		margin:-4rem auto 0 auto;
	}
    .lp-lhoa-box1 img{
        width: 100%;
        height: auto;
    }
	.lp-lhoa-box1-grid1{
		display:grid;
		grid-template-columns:48% 48%;
		justify-content:center;
		align-items:center;
		flex-direction:column;
		grid-gap:3rem;
		margin:8rem auto;
        height: 50%;
	}
	.lp-lhoa-h3-1{
		padding-left:2.5rem;
        padding-right: 2.5rem;
		border-left: #C83131 solid 2px;
        height: 100%;
	}
	.lp-lhoa-h3-1 h3{
		font-size:1.2rem;
		font-weight:bold;
		margin-bottom:1rem;
        display: flex;
        align-items: center;

	}
	.lp-lhoa-box1-p{
		font-size:.8rem;
		line-height:2rem;
	}
	.lp-lhoa-h3-span{
		font-family:'Roboto', sans-serif;
		font-size:2rem;
		font-weight:normal;
		margin-right:1vw;
	}
	.lp-lhoa-h3-span2{
		font-size:1.2vw;
		font-weight:bold;
		margin-right:1vw;
	}
    .lp-lhoa-h3-span3{
		font-family:'Roboto', sans-serif;
		font-size:2rem;
		font-weight:normal;
		margin-right:1rem;
	}
	.lp-lhoa-box1-grid2{
		display:grid;
		grid-template-columns:49% 49%;
        grid-gap:1rem;
		justify-content:center;
		align-items:center;
		flex-direction:row-reverse;
		grid-template-areas:
			"a b";
		margin:8rem auto;
        height: 50%;
	}
	.lp-lhoa-box1-grid2 img{
		grid-area:a;
	}
	.lp-lhoa-h3-2{
		padding-right:2.5vw;
		padding-left: 2.5vw;
        border-right: #C83131 solid 2px;
		grid-area:b;
        height: 100%;
	}
	.lp-lhoa-h3-2 h3{
		font-size:1.2vw;
		font-weight:bold;
		margin-bottom:1vw;
        display: flex;
        align-items: center;
	}

}
@media(min-width: 481px) and (max-width: 980px){
	.lp-lhoa-body{
        width: 100%;
		color:#222222;
		font-family:'Noto Sans JP',sans-serif;
        padding-bottom: 8rem;
    }
    .lp-lhoa-body .h2{
        width: 90%;
        margin: 0 auto;
        padding-bottom: 2rem;
    }
	.lp-lhoa-box1{
		width: 90%;
		margin:-4vw auto 0 auto;
	}
    .lp-lhoa-box1 img{
        width: 100%;
        height: auto;
    }
	.lp-lhoa-box1-grid1{
		display:grid;
		grid-template-columns:50% 50%;
		justify-content:center;
		align-items:center;
		flex-direction:column;
		margin:8vw auto;
        height: 50%;
	}
	.lp-lhoa-h3-1{
		padding-left:2.5vw;
        padding-right: 2.5vw;
		border-left: #C83131 solid 2px;
        height: 100%;
	}
	.lp-lhoa-h3-1 h3{
		font-size:1rem;
		font-weight:bold;
		margin-bottom:1vw;
        display: flex;
        align-items: center;

	}
	.lp-lhoa-box1-p{
		font-size:.7rem;
		line-height:1.5rem;
	}
	.lp-lhoa-h3-span{
		font-family:'Roboto', sans-serif;
		font-size:1rem;
		font-weight:bold;
		margin-right:1vw;
	}
	.lp-lhoa-h3-span2{
		font-size:.8rem;
		font-weight:bold;
		margin-right:1vw;
	}
    .lp-lhoa-h3-span3{
		font-family:'Roboto', sans-serif;
		font-size:1rem;
		font-weight:bold;
		margin-right:1vw;
	}
	.lp-lhoa-box1-grid2{
		display:grid;
		grid-template-columns:50% 50%;
		justify-content:center;
		align-items:center;
		flex-direction:row-reverse;
		grid-template-areas:
			"a b";
		margin:8vw auto;
        height: 50%;
	}
	.lp-lhoa-box1-grid2 img{
		grid-area:a;
	}
	.lp-lhoa-h3-2{
		padding-right:2.5vw;
		padding-left: 2.5vw;
        border-right: #C83131 solid 2px;
		grid-area:b;
        height: 100%;
	}
	.lp-lhoa-h3-2 h3{
		font-size:1.2vw;
		font-weight:bold;
		margin-bottom:1vw;
        display: flex;
        align-items: center;
	}
	
}
@media screen and (max-width: 480px) {
    .lp-lhoa-body{
        width: 100%;
        position: relative;
        color:#222222;
        font-family:'Noto Sans JP',sans-serif;
    }
    .lp-lhoa-body .h2{
       width: 80%; 
       display: block;
       margin: 0 auto;
       padding-top: 4rem;
    }
	.lp-lhoa-box1{
		width:80%;
		margin:-4vw auto 0 auto;
	}
    .lp-lhoa-box1 img{
        width: 100%;
    }
	.lp-lhoa-box1-grid1{
		display:block;
		margin:0 auto;
		padding-bottom:2rem;
		padding-top:2rem;
	}
	.lp-lhoa-h3-1{
		margin-bottom:8vw;
		font-size:4vw;
		margin:0 auto 8vw auto;
	}
	.lp-lhoa-h3-1 h3{
		display:flex;
		justify-content:start;
		align-items:flex-end;
        border-bottom: solid 1px #848484;
	}
    .boder::after{
        content: "";
        display: block;
        border-bottom: 1px solid #C83131;
        width: 20vw;
        position: absolute;
        z-index:2;
        margin-bottom: -1px;
    }
	.lp-lhoa-box1-p{
		font-size:.8rem;
		line-height:1.5rem;
	}
	.lp-lhoa-h3-span{
        font-family:'Roboto', sans-serif;
		font-size:1.5rem;
		font-weight:normal;
		
        padding: .5rem;
	}
	.lp-lhoa-h3-span2{
		font-size:1rem;
		font-weight:bold;
        padding: .5rem;
	}
    .lp-lhoa-h3-span3{
        font-family:'Roboto', sans-serif;
		font-size:1.5rem;
		font-weight:normal;
        padding: .5rem;
        position: relative;
        top:-.5rem
	}
	.lp-lhoa-box1-grid2{
		display:block;
		margin:8vw auto;
	}
	.lp-lhoa-box1-grid2 img{
		grid-area:a;
	}
	.lp-lhoa-h3-2{
		margin:0 auto 8vw 0;
	}
	.lp-lhoa-h3-2 h3{
		display:flex;
		justify-content:start;
		align-items:flex-end;
        border-bottom: solid 1px #848484;
	}
	
}
/************************************
** スタッフの皆さんへ
************************************/
@media screen and (min-width: 981px) {
    .lp-lhoa-body {
        font-family: 'Noto Sans JP', sans-serif;
        padding-bottom: 8rem;
    }

    .lp-lhdearstaff-box1 {
        width: 100%;
    }

    .lp-lhoa-body h1 {
        display: none;
    }

    .lp-lhoa-body .h2 {
        width: 70%;
        margin: 0 auto;
        display: flex;
    }
    /*仕事を好きになってほしい理由・スタッフを好きになってほしい理由*/
    .lp-lhdearstaff-grid1 {
        display: grid;
        grid-template-columns: 48% 48%;
        width: 70%;
        grid-template-areas: "a b";
        margin: 8rem auto;
        grid-gap: 5rem;
        justify-content: center;
        align-items: center;
    }

    .lp-lhdearstaff-grid1 img {
        width: 100%;
        grid-area: b;
        vertical-align: top;
    }
    .lp-lhdearstaff-imgsp,.lp-lhdearstaff-grid1-img2{
        display: none;
    }

    .lp-dearstaff-h2 {
        font-weight: bold;
        font-size: 1.2rem;
        margin-bottom: 2rem;
        margin-top: 0;
    }

    .lp-lhdearstaff-box1 p {
        font-size: .8rem;
        font-weight: normal;
        line-height: 2rem;
    }

    .lp-lhdearstaff-box1-text1 {
        padding-right: 4rem;
        line-height: 2rem;
        width: 100%;
        grid-area: a;
    }

    .lp-lhdearstaff-h2 {
        font-size: 1.2rem;
        margin-bottom: 2rem;
        margin-top: 0;
    }

    .lp-lhdearstaff-grid2 {
        display: grid;
        grid-template-columns: 48% 48%;
        grid-template-rows: 48% 48%;
        width: 70%;
        height: 10%;
        margin: 8rem auto;
        grid-template-areas:
            "a b"
            "c b";
        grid-gap: 1rem 5rem;
        justify-content: center;
        align-items: center;
    }

    .lp-lhdearstaff-grid2-img1 {
        grid-area: a;
        width: 100%;
    }

    .lp-lhdearstaff-grid2-img2 {
        grid-area: c;
        width: 70%;
    }

    .lp-lhdearstaff-grid2-img1 img,.lp-lhdearstaff-grid2-img2 img {
        vertical-align: top;
        width: 100%;
        height: 100%;
    }

    .lp-lhdearstaff-box1-text2 {
        line-height: 2rem;
        width: 100%;
        grid-area: b;
        padding-left: 2rem;
    }

    .lp-lhdearstaff-box1-text2 p {
        font-size: .8rem;
        font-weight: normal;
    }

    .lp-lhdearstaff-grid2 p {
        font-size: .8rem;
        font-weight: normal;
    }

    .lp-lhdearstaff-box2 {
        width: 100%;
        margin-top: 8vw;
    }
    /*スタッフを大事にする理由*/
    .lp-lhdearstaff-grid3 {
        display: grid;
        grid-template-columns: 48% 48%;
        width: 70%;
        grid-template-areas: "a b";
        margin: 0 auto;
        grid-gap: 5rem;
        justify-content: center;
        align-items: center;
    }
    .lp-lhdearstaff-box1-text3{
        grid-area: b;
    }
    .lp-lhdearstaff-grid3 img {
        width: 100%;
        vertical-align: top;
        grid-area: a;
    }
    /*スタッフの皆さんへ約束*/
    .lp-lhdearstaff-box3 {
        width: 70%;
        margin: 8rem auto;
        display: flex;
        flex-direction: column-reverse;
        justify-content: center;
    }
    .lp-lhdearstaff-box3-img{
        position: absolute;
        top: 220%;
        right: 15%;
    }
    .lp-lhdearstaff-box3-img1 img {
        width: 100%;
        margin:0 0 1rem auto;
        position: relative;
        display: block;
    }
    .lp-lhdearstaff-box3-img2 img {
        width: 50%;
        margin:0 0 0 auto;
        position: relative;
        display: block;
    }

    .lp-lhdearstaff-text3 {
        line-height: 2rem;
    }

    .lp-lhdearstaff-text3 dt {
        font-size: .8rem;
    }

    .lp-lhdearstaff-text3 dd {
        font-size: .8rem;
        margin-left: 1rem;
    }

}

@media(min-width: 481px) and (max-width: 980px) {
    .lp-lhoa-body {
        font-family: 'Noto Sans JP', sans-serif;
        padding-bottom: 8rem;
    }

    .lp-lhdearstaff-box1 {
        width: 100%;
    }

    .lp-lhoa-body h1 {
        display: none;
    }

    .lp-lhoa-body .h2 {
        width: 90%;
        margin: 0 auto;
        display: flex;
        margin-bottom: 4rem;
    }
    /*仕事を好きになってほしい理由・スタッフを好きになってほしい理由*/
    .lp-lhdearstaff-grid1 {
        display: grid;
        grid-template-columns: 48% 48%;
        width: 90%;
        grid-template-areas: "a b";
        margin: 0 auto;
        grid-gap: 2rem;
        justify-content: center;
        align-items: center;
    }

    .lp-lhdearstaff-grid1 img {
        width: 100%;
        height: auto;
        grid-area: b;
        vertical-align: top;
    }
    .lp-lhdearstaff-imgsp,.lp-lhdearstaff-grid1-img2{
        display: none;
    }

    .lp-dearstaff-h2 {
        font-weight: bold;
        font-size: 1rem;
        margin-bottom: 1rem;
        margin-top: 0;
    }

    .lp-lhdearstaff-box1 p {
        font-size: .7rem;
        font-weight: normal;
        line-height: 1.5rem;
    }

    .lp-lhdearstaff-box1-text1 {
        padding-right: 4rem;
        line-height: 2rem;
        width: 100%;
        grid-area: a;
    }

    .lp-lhdearstaff-h2 {
        font-size: 1.2rem;
        margin-bottom: 2rem;
        margin-top: 0;
    }

    .lp-lhdearstaff-grid2 {
        display: grid;
        grid-template-columns: 48% 48%;
        grid-template-rows: 48% 48%;
        width: 90%;
        height: 20%;
        margin: 8rem auto;
        grid-template-areas:
            "a b"
            "c b";
        grid-gap: .5rem 2rem;
        justify-content: center;
        align-items: center;
    }

    .lp-lhdearstaff-grid2-img1 {
        grid-area: a;
        width: 100%;
    }

    .lp-lhdearstaff-grid2-img2 {
        grid-area: c;
        width: 70%;
        height: auto;
    }

    .lp-lhdearstaff-grid2-img1 img {
        vertical-align: top;
        width: 100%;
        height: 100%;
    }
    .lp-lhdearstaff-grid2-img2 img{
        height: 100%;
        width: 100%;
    }

    .lp-lhdearstaff-box1-text2 {
        line-height: 1.5rem;
        width: 100%;
        grid-area: b;
    }

    .lp-lhdearstaff-box1-text2 p {
        font-size: .7rem;
        font-weight: normal;
    }

    .lp-lhdearstaff-grid2 p {
        font-size: .7rem;
        font-weight: normal;
    }
    /*スタッフを大事にする理由*/
    .lp-lhdearstaff-grid3 {
        display: grid;
        grid-template-columns: 48% 48%;
        width: 90%;
        grid-template-areas: "a b";
        margin: 0 auto;
        grid-gap: 2rem;
        justify-content: center;
        align-items: center;
    }
    .lp-lhdearstaff-box1-text3{
        grid-area: b;
    }
    .lp-lhdearstaff-grid3 img {
        width: 100%;
        height: auto;
        vertical-align: top;
        grid-area: a;
    }

    /*スタッフの皆さんへ約束*/
    .lp-lhdearstaff-box3 {
        width: 90%;
        margin: 8rem auto;
        display: flex;
        flex-direction: column-reverse;
        justify-content: center;
    }
    .lp-lhdearstaff-box3-img{
        position: absolute;
        top: 115%;
        right: 5%;
    }
    .lp-lhdearstaff-box3-img1 img {
        width: 50%;
        height: auto;
        margin:0 0 1rem auto;
        position: relative;
        display: block;
    }
    .lp-lhdearstaff-box3-img2 img {
        width: 30%;
        margin:0 0 0 auto;
        position: relative;
        display: block;
    }

    .lp-lhdearstaff-text3 {
        line-height: 2rem;
    }

    .lp-lhdearstaff-text3 dt {
        font-size: .7rem;
    }

    .lp-lhdearstaff-text3 dd {
        font-size: .7rem;
        margin-left: .7rem;
    }

    .dearstaff-sp {
        display: block;
    }
}

@media screen and (max-width: 480px) {
    .lp-lhdearstaff-box1 {
        width: 100%;
    }

    .lp-lhdearstaff-grid1 {
        display: grid;
        grid-template-columns: 60% 40%;
        grid-template-rows: 24% 74%;
        width: 100%;
        height: auto;
        margin: 4rem auto;
        grid-template-areas:
            "a b"
            "c c";
        grid-gap: .5rem 0;
        justify-content: center;
        align-items: center;
    }
    .lp-lhdearstaff-grid1-img1{
        grid-area: a;
    }
    .lp-lhdearstaff-grid1-img1 img {
        width: 100%;
        height: 100%;
        vertical-align: top;
    }
    .lp-lhdearstaff-grid1-img2{
        grid-area: b;
        width: 80%;
        margin-left: auto;
        margin-top: auto;
    }
    .lp-lhdearstaff-grid1-img2 img{
        width: 100%;
        height: 80%;
    }

    .lp-lhdearstaff-h2 {
        font-weight: bold;
        font-size: 1.2rem;
        margin: 0;
    }

    .lp-lhdearstaff-box1 p {
        font-size: .8rem;
        line-height: 8vw;
    }

    .lp-lhdearstaff-box1-text1 {
        width: 80%;
        margin: 2rem auto;
        line-height: 2rem;
        grid-area: c;
    }

    .lp-dearstaff-h2 {
        font-size: 4vw;
        margin-bottom: 2vw;
        font-weight: bold;
    }

    .lp-lhdearstaff-grid2{
        display: grid;
        grid-template-columns: 30% 70%;
        grid-template-rows: 28% 72%;
        width: 100%;
        height: auto;
        margin: 4rem auto;
        grid-template-areas:
            "a b"
            "c c";
        grid-gap: .5rem 0;
        justify-content: center;
        align-items: center;
    }
    .lp-lhdearstaff-grid2-img1{
        grid-area: b;
    }
    .lp-lhdearstaff-grid2-img1 img {
        width: 100%;
        height: 100%; 
    }
    .lp-lhdearstaff-grid2-img2 {
        grid-area: a;
        width: 80%;
        margin-right: auto;
        margin-top: auto;
    }
    .lp-lhdearstaff-grid2-img2 img {
        width: 100%;
        height: 100%;
    }

    .lp-dearstaff-grid2 p {
        margin: 0 auto;
        line-height: 2rem;
    }

    .lp-lhdearstaff-box1-text2 {
        width: 80%;
        margin: 2rem auto;
        line-height: 8vw;
        grid-area: c;
    }

    .lp-lhdearstaff-box1-text2 p {
        font-size: .8rem;
    }
    /*スタッフを大事にする理由*/
    .lp-lhdearstaff-grid3{
        display: grid;
        grid-template-columns: 35% 65%;
        grid-template-rows: 25% 25% 50%;
        width: 100%;
        height: auto;
        margin: 4rem auto;
        grid-template-areas:
            "a a"
            "b c"
            "d d";
        grid-gap: .5rem 0;
        justify-content: center;
        align-items: center;
    }
    .lp-lhdearstaff-grid3-img1{
        grid-area: a;
        width: 80%;
        margin-right: auto;
    }
    .lp-lhdearstaff-grid3-img1 img {
        width: 100%;
        height: 100%; 
    }
    .lp-lhdearstaff-grid3-img2 {
        grid-area: b;
        width: 80%;
    }
    .lp-lhdearstaff-grid3-img2 img {
        width: 100%;
        height: 100%;
    }
    .lp-lhdearstaff-grid3-img3 {
        grid-area: c;
        width: 80%;
    }
    .lp-lhdearstaff-grid3-img3 img {
        width: 100%;
        height: 100%;
    }
    .lp-lhdearstaff-box1-text3 {
        width: 80%;
        margin: 2rem auto;
        line-height: 2rem;
        grid-area: d;
    }

    /*スタッフの皆さんへ約束*/
    .lp-lhdearstaff-box3{
        width: 100%;
        margin: 0 auto;
    }
    .lp-lhdearstaff-box3-img{
        display: grid;
        grid-template-columns: 30% 70%;
        width: 100%;
        height: auto;
        margin: 4rem auto;
        grid-template-areas:
            "a b";
        grid-gap: .5rem 0;
        justify-content: center;
        align-items: center;
    }
    .lp-lhdearstaff-box3 img {
        width: 100%;
        margin-top: 1rem;
        height: auto;
    }
    .lp-lhdearstaff-box3-img1{
        grid-area: b;
    }
    .lp-lhdearstaff-box3-img2{
        grid-area: a;
        width: 80%;
        margin-right: auto;
        margin-top: auto;
    }
    .lp-lhdearstaff-text3{
        width: 80%;
        margin: 2rem auto;
        line-height: 2rem;
    }
    .lp-lhdearstaff-text3 dt,
    .lp-lhdearstaff-text3 dd {
        font-size: .8rem;
    }
    .lp-lhdearstaff-text3 dd {
        margin-left: 1rem;
    }
}
/************************************
** スタッフ紹介
************************************/
@media screen and (min-width: 981px) {
    
	.lp-lhstaff-h2{
		font-size:2.4rem;
		font-weight:normal;
		margin:4rem auto 1rem auto;
		letter-spacing:.2rem;
		font-family:'Roboto', sans-serif;
        width: 70%;
	}
	.lp-lhstaff-title{
		font-size:1rem;
		display:flex;
		margin:.5rem auto 4rem auto;
	}

	.lp-lhstaff-title:before {
		content: '';
  		height: 1px;
		width:160px;
  		background: #848484;
		display:block;
		padding-right:1rem;
		margin: 1rem 1rem auto 17rem;
    }
    .lp-lhstaff-h2-span{
        color: #C83131;
        font-size: 2.4rem;
        padding-right: 1rem;
    }
    /*工事部*/
	.lp-lhstaff-grid1{
		width:70%;
        height: auto;
		display:grid;
		grid-template-columns:35% 65%;
		grid-template-rows:100%;
		margin:8rem auto;
		align-items:center;
	}
	.lp-lhstaff-box1 .lp-lhstaff-h3{
		font-weight:normal;
		font-size:2rem;
		padding-left:3rem;
		letter-spacing:.2rem;
		grid-area:b;
        margin: 1rem auto;
		font-family:'Roboto', sans-serif;
	}
	.lp-lhstaff-box1 .lp-lhstaff-p{
		font-size:.8rem;
		padding-left:3rem;
		grid-area:a;
	}
	.lp-lhstaff-name{
		font-size:2.5rem;
		font-family:'Roboto', sans-serif;
		font-weight:normal;
        color: #C83131;
	}
	.lp-lhstaff-text {
		background-color:#fff;
		padding:1rem 3rem;
		height:auto;
	}
	.lp-lhstaff-text2{
		background-color:#fff;
		padding:1rem 3rem;
		display:grid;
		grid-template-columns:1fr 2fr;
		justify-content:center;
		margin-top:0;
		height:auto;
	}
	.lp-lhstaff-text2 dt{
		font-size:.8rem;
		font-weight:bold;
		padding:.5rem;
		border-bottom:solid 1px #EDEDED;
	}
	.lp-lhstaff-text2 dd{
		font-size:.8rem;
		border-bottom:solid 1px #EDEDED;
		padding:.5rem;
        margin: 0;
	}
	
	.lp-lhstaff-text .lp-lhstaff-border{
		border-bottom:none;
	}
	.lp-lhstaff-text2 .lp-lhstaff-border{
		border-bottom:none;
	}
	.lp-lhstaff-textbox .lp-lhstaff-border{
		border-bottom:none;
        width: 100%;
	}
	.lp-lhstaff-textbox .lp-lhstaff-border{
		border-bottom:none;
	}
	.lp-lhstaff-img{
		vertical-align:top;
		height:100%;
		object-fit:cover;
	}
    .lp-staff-img{
        opacity: 0;
    }
	.lp-lhstaff-grid1 img{
		width:100%;
        height: auto;
		vertical-align:top;
	}
	.lp-lhstaff-grid2 img{
		width:100%;
        height: auto;
		vertical-align:top;
	}
	.lp-lhstaff-grid2{
		width:70%;
		display:grid;
		grid-template-columns:65% 35%;
		margin:8rem auto;
		align-items:center;
	}
    /*設計・資材・営業・経営部*/
	.lp-lhstaff-grid3{
		display:grid;
		grid-template-columns:repeat(2,1fr);
		width:70%;
		margin:4rem auto;
		grid-gap:3rem;
	}
    .lp-lhstaff-box2 .lp-lhstaff-h3{
		font-weight:normal;
		font-size:2rem;
		letter-spacing:.2rem;
		grid-area:b;
        margin: 1rem auto;
		font-family:'Roboto', sans-serif;
        width: 90%;
	}
    .lp-lhstaff-box2 .lp-lhstaff-p{
		font-size:.8rem;
        width: 90%;
		grid-area:a;
        margin: 0 auto;
	}
	.lp-lhstaff-text3{
		background-color:#fff;
		padding:2rem 1rem;
        border: solid .5px #ededed;
	}
	.lp-lhstaff-box3{
		display:flex;
		justify-content:center;
		width:60%;
		grid-gap:2rem;
		margin:4rem auto;
		padding-bottom:8rem;
	}
	.lp-lhstaff-box3 a{
		text-decoration:none;
		border: solid 1px #040404;
		padding:.5rem;
		margin:2rem auto;
		display:block;
		text-align:center;
		color:#040404;
		font-size:.8rem;
		font-weight:bold;
		width:90%;
	}
    .lp-lhstaff-textbox dl{
        display: flex;
        border-bottom:solid 1px #EDEDED;
        width: 90%;
        margin: 0 auto;
        padding: .5rem;
    }
    .lp-lhstaff-textbox dl:last-child{
        display: block;
        border-bottom: none;
    }
    .lp-lhstaff-textbox dt{
		font-size:.8rem;
		padding:.5rem;
        width: 40%;
	}
	.lp-lhstaff-textbox dd{
		font-size:.8rem;
		padding:.5rem;
        margin: 0;
        width: 60%;
	}
    .lp-lhstaff-p2{
        font-size: .8rem;
        width: 90%;
        margin: 1rem auto;
	}
    .lp-lhstaff-box2 .lp-lhstaff-textbox-e {
        display: block;
    }
    .lp-lhstaff-box2 .lp-lhstaff-textbox-e dd{
        width: 100%;
    }

}
@media(min-width: 481px) and (max-width: 980px){
	.lp-lhstaff-h2{
		font-size:2rem;
		font-weight:normal;
		width: 90%;
        margin: 2rem auto .5rem auto;
		letter-spacing:.2rem;
		font-family:'Roboto', sans-serif;
	}
	.lp-lhstaff-title{
		font-size:.7rem;
		display:flex;
        width: 90%;
		margin:.5rem auto;
	}
    .lp-lhstaff-h2-span{
        color: #C83131;
        font-size: 2rem;
        padding-right: 1rem;
    }
	.lp-lhstaff-title:before {
		content: '';
  		height: 1px;
		width:120px;
  		background: #848484;
		display:block;
		padding-right:1vw;
		margin: .7rem 1rem auto 1rem;
}
    /*工事部*/
	.lp-lhstaff-grid1{
		width:90%;
		display:grid;
		grid-template-columns:35% 65%;
		grid-template-rows:100%;
		margin:4rem auto;
		align-items:flex-end;
	}
	.lp-lhstaff-box1 .lp-lhstaff-h3{
		font-weight:normal;
		font-size:1.3rem;
		padding-left:1.2rem;
		letter-spacing:.2rem;
		grid-area:b;
        margin: .5rem auto;
		font-family:'Roboto', sans-serif;
	}
	.lp-lhstaff-box1 .lp-lhstaff-p{
		font-size:.7rem;
		padding-left:1.5rem;
		grid-area:a;
	}
	.lp-lhstaff-name{
		font-size:1.6rem;
		font-family:'Roboto', sans-serif;
		font-weight:normal;
        color: #C83131;
	}
	.lp-lhstaff-text {
		background-color:#fff;
		padding:1rem 3rem;
		height:auto;
	}
	.lp-lhstaff-text2{
		background-color:#fff;
		padding:0 1rem;
		display:grid;
		grid-template-columns:40% 60%;
		justify-content:center;
		margin-top:0;
		height:auto;
	}
	.lp-lhstaff-text2 dt{
		font-size:.7rem;
		font-weight:bold;
		padding:.5rem;
		border-bottom:solid 1px #EDEDED;
	}
	.lp-lhstaff-text2 dd{
		font-size:.7rem;
		border-bottom:solid 1px #EDEDED;
		padding:.5rem;
        margin: 0;
	}
	
	.lp-lhstaff-text .lp-lhstaff-border{
		border-bottom:none;
	}
	.lp-lhstaff-text2 .lp-lhstaff-border{
		border-bottom:none;
	}
	.lp-lhstaff-textbox .lp-lhstaff-border{
		border-bottom:none;
        width: 100%;
	}
	.lp-lhstaff-textbox .lp-lhstaff-border{
		border-bottom:none;
	}
	.lp-lhstaff-img{
		vertical-align:top;
		height:100%;
		object-fit:cover;
	}
    .lp-staff-img{
        opacity: 0;
    }
	.lp-lhstaff-grid1 img{
		width:100%;
		vertical-align:top;
	}
	.lp-lhstaff-grid2 img{
		width:100%;
		vertical-align:top;
	}
	.lp-lhstaff-grid2{
		width:90%;
		display:grid;
		grid-template-columns:65% 35%;
		margin:4rem auto;
		align-items:flex-end;
	}
    /*設計・資材・営業・経営部*/
	.lp-lhstaff-grid3{
		display:grid;
		grid-template-columns:repeat(2,1fr);
		width:90%;
		margin:4rem auto;
		grid-gap:1rem;
	}
    .lp-lhstaff-box2 .lp-lhstaff-h3{
		font-weight:normal;
		font-size:1.3rem;
		letter-spacing:.2rem;
		grid-area:b;
        margin: .5rem auto;
		font-family:'Roboto', sans-serif;
        width: 90%;
	}
    .lp-lhstaff-box2 .lp-lhstaff-p{
		font-size:.7rem;
        width: 90%;
		grid-area:a;
        margin: 0 auto;
	}
	.lp-lhstaff-text3{
		background-color:#fff;
		padding:1.5rem 0;
        border: solid .5px #ededed;
	}
	.lp-lhstaff-box3{
		display:flex;
		justify-content:center;
		width:60%;
		grid-gap:2rem;
		margin:4rem auto;
		padding-bottom:8rem;
	}
	.lp-lhstaff-box3 a{
		text-decoration:none;
		border: solid 1px #040404;
		padding:.5rem;
		margin:2rem auto;
		display:block;
		text-align:center;
		color:#040404;
		font-size:.8rem;
		font-weight:bold;
		width:90%;
	}
    .lp-lhstaff-textbox dl{
        display: block;
        border-bottom:solid 1px #EDEDED;
        width: 90%;
        margin: 0 auto;
        padding: .5rem;
    }
    .lp-lhstaff-textbox dl:last-child{
        display: block;
        border-bottom: none;
    }
    .lp-lhstaff-textbox dt{
		font-size:.7rem;
		padding:.2rem;
        width: 100%;
	}
	.lp-lhstaff-textbox dd{
		font-size:.7rem;
		padding:.2rem;
        margin: 0;
        width: 100%;
	}
    .lp-lhstaff-p2{
        font-size: .7rem;
        width: 90%;
        margin: .5rem auto;
	}
    .lp-lhstaff-box2 .lp-lhstaff-textbox-e {
        display: block;
    }
    .lp-lhstaff-box2 .lp-lhstaff-textbox-e dd{
        width: 100%;
    }

}
@media screen and (max-width: 480px) {
	.lp-lhstaff-box1{
		width:80%;
		margin:0 auto;
	}
	.lp-lhstaff-h2{
		font-size:2rem;
		font-weight:normal;
		margin:4rem auto 0 auto;
		letter-spacing:.1rem;
		font-family:'Roboto', sans-serif;
		line-height:2.5rem;
	}
    .lp-lhstaff-h2-span{
        display: none;
    }
	.lp-lhstaff-title{
		font-size:.8rem;
		display:flex;
		margin:1rem auto 2rem auto;
	}
	.lp-lhstaff-title:before {
		content: '';
  		height: 1px;
		width:40px;
  		background: #C83131;
		display:block;
		margin:.8rem 1rem auto 0;
	}
	.lp-lhstaff-grid1{
		display:block;
		margin:4rem auto;
	}
	.lp-lhstaff-grid2{
		display:flex;
		flex-direction:column-reverse;
		margin:4rem auto;
	}
	.lp-lhstaff-h3{
		font-weight:normal;
		font-size:1.5rem;
		letter-spacing:.1rem;
        margin: .5rem auto;
	}
	.lp-lhstaff-p{
		font-size:.8rem;
		margin:1rem auto 0 auto;
	}
	.lp-lhstaff-name{
		font-size:2rem;
		font-family:'Roboto', sans-serif;
        color: #C83131;
	}
	.lp-lhstaff-text2{
		width: 100%;
        margin: 0 auto;
        text-align: left;
	}
	.lp-lhstaff-text2 dt{
		font-size:.8rem;
		font-weight:bold;
		border-bottom:none;
        padding-left: .5rem;
        margin: .5rem 0;
	}
	.lp-lhstaff-text2 dd{
		font-size:.8rem;
		border-bottom:solid 1px #EDEDED;
        padding-left: .5rem;
        padding-bottom: .5rem;
        margin: .5rem 0;
        line-height: 1.5rem;
	}
	
	.lp-lhstaff-text .lp-lhstaff-border{
		border-bottom:none;
	}
	.lp-lhstaff-text2 .lp-lhstaff-border{
		border-bottom:none;
	}
	.lp-lhstaff-textbox .lp-lhstaff-border{
		border-bottom:none;
	}
	.lp-lhstaff-textbox  .lp-lhstaff-border{
		border-bottom:none;
	}
	.lp-lhstaff-img{
		vertical-align:top;
		height:100%;
		object-fit:cover;
	}
    .lp-staff-img{
        opacity: 0;
    }
	.lp-lhstaff-grid1 img{
		width:100%;
		vertical-align:top;
	}
	.lp-lhstaff-grid2 img{
		width:100%;
		vertical-align:top;
	}
	.lp-lhstaff-box2{
		width:80%;
		margin:0 auto;
	}
	/*設計・資材・営業・経理部*/
	.lp-lhstaff-grid3{
		display:block;
		margin:0 auto;
	}
	.lp-lhstaff-text3{
		padding:2rem 0;
		margin:2rem auto;
	}
	.lp-lhstaff-p2{
		font-size:.8rem;
        line-height: 1.5rem;
	}
    .lp-lhstaff-textbox dt{
		font-size:.8rem;
		font-weight:bold;
		border-bottom:none;
        padding-left: .5rem;
        margin: .5rem 0;
	}
	.lp-lhstaff-textbox dd{
		font-size:.8rem;
		border-bottom:solid 1px #EDEDED;
        padding-left: .5rem;
        padding-bottom: .5rem;
        margin: .5rem 0;
        line-height: 1.5rem;
    }
	
}
/************************************
** 会社概要
************************************/
@media screen and (min-width: 981px) {
    .lp-company-body .h2{
        width: 70%;
        margin: 4rem auto;

    }
    .lpcompany-img1{
        width: 85%;
        margin-left: auto;
        opacity: 0;
        margin-top: 2rem;
    }
    .lpcompany-img2{
        width: 85%;
        margin-right: auto;
        opacity: 0;
        margin-top: 2rem;
    }
    .lpcompany-img1 img{
        width: 100%;
        height: auto;
    }
    .lpcompany-img2 img{
        width: 100%;
        height: auto;
    }
    /*画像アニメーション*/
    .img-animation {
        animation: img-opacity 2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
        overflow: hidden;
        position: relative;
      }
      
      .img-animation::before {
        animation: img-animation 2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
        background: #fff;
        content: '';
        inset: 0;
        pointer-events: none;
        position: absolute;
        z-index: 1;
      }
      @keyframes img-opacity {
        100% {
          opacity: 1;
        }
      }
      
      @keyframes img-animation {
        100% {
          transform: translateX(100%);
        }
      }
    
    .lp-lhcompany_box1{
        width: 50%;
        margin: 4rem auto;
        padding-bottom: 8rem;
    }
    .lp-lhcompany_box2{
        width: 50%;
        margin: 4rem auto;
        padding-bottom: 8rem;
    }
    .lp-lhcompany_table{
        display: grid;
        grid-template-columns: 30% 70%;
        align-items: center;
        border-top:solid 1px #ededed;
        padding: .5rem 0;
        margin: 0;
    }
    .lp-lhcompany_table dt{
        padding: .5rem 1rem .5rem 1rem;
        font-size: .8rem;
    }
    .lp-lhcompany_table dd{
        padding: .5rem 1rem .5rem 1rem;
        border-left: solid 2px #C83131;
        font-size: .8rem;
        line-height: 1.5rem;
    }
    .lp-lhcompany_table a{
        text-decoration: none;
        color: #222222;
        font-size: .8rem;
    }
    .lp-lhcompany_table dd p{
        font-size:.8rem;
    } 
    .lp-lhcompany_table:last-child{
        border-bottom:solid 1px #ededed;
    }
    /*アクセスマップ*/
    .lhcompany-box3{
        width: 100%;
    }
    .lpcompany-map1{
        width: 50%;
        margin:0 auto;
    }
    .lpcompany-map1 iframe{
        max-width: 100%;
        margin:0 auto;
        text-align: center;
    }
    .lpcompany-map1 h3{
        text-align: center;
    }
    .lpcompany-map2{
        display: flex;
        justify-content: center;
        column-gap: 4rem;
        margin: 4rem auto;
        width: 50%;
    } 
    .lpcompany-map2 h3{
        text-align: center;
    }
    .lpcompany-map2 iframe{
        max-width: 100%;
        margin:0 auto;
        text-align: center;
    }
    .lpcompany-box3-p{
        line-height: 1.5rem;
        margin: 1rem auto;
    }  
    }



@media(min-width: 481px) and (max-width: 980px){
    .lp-company-body .h2{
        width: 70%;
        margin: 2rem auto;

    }
    .lpcompany-img1{
        width: 85%;
        margin-left: auto;
        opacity: 0;
    }
    .lpcompany-img2{
        width: 85%;
        margin-right: auto;
        opacity: 0;
    }
    .lpcompany-img1 img{
        width: 100%;
        height: auto;
    }
    .lpcompany-img2 img{
        width: 100%;
        height: auto;
    }
    /*画像アニメーション*/
    .img-animation {
        animation: img-opacity 2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
        overflow: hidden;
        position: relative;
      }
      
      .img-animation::before {
        animation: img-animation 2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
        background: #fff;
        content: '';
        inset: 0;
        pointer-events: none;
        position: absolute;
        z-index: 1;
      }
      @keyframes img-opacity {
        100% {
          opacity: 1;
        }
      }
      
      @keyframes img-animation {
        100% {
          transform: translateX(100%);
        }
      }
    .lp-lhcompany_box1{
        width: 70%;
        margin: 4rem auto;
        padding-bottom: 8rem;
    }
    .lp-lhcompany_box2{
        width: 70%;
        margin: 4rem auto;
        padding-bottom: 8rem;
    }
    .lp-lhcompany_table{
        display: grid;
        grid-template-columns: 30% 70%;
        border-top:solid 1px #ededed;
        padding: .5rem 0;
        margin: 0;
        align-items: center;
    }
    .lp-lhcompany_table dt{
        padding-left: 1rem;
        font-size: .7rem;
    }
    .lp-lhcompany_table dd{
        padding-left: 1rem;
        border-left: solid 2px #C83131;
        font-size: .7rem;
        line-height: 1.5rem;
    }
    .lp-lhcompany_table a{
        text-decoration: none;
        color: #222222;
        font-size: .7rem;
    }
    .lp-lhcompany_table dd p{
        font-size: .7rem;
    }
    .lp-lhcompany_table:last-child{
        border-bottom:solid 1px #ededed;
    }
     /*アクセスマップ*/
     .lhcompany-box3{
        width: 100%;
    }
    .lpcompany-map1{
        width: 70%;
        margin:0 auto;
    }
    .lpcompany-map1 iframe{
        max-width: 100%;
        height: 100%;
        margin:0 auto;
        text-align: center;
    }
    .lpcompany-map1 h3{
        text-align: center;
        font-size: .8rem;
    }
    .lpcompany-map2{
        display: flex;
        justify-content: center;
        column-gap: 4rem;
        margin: 4rem auto;
        width: 70%;
    } 
    .lpcompany-map2 h3{
        text-align: center;
        font-size: .8rem;
    }
    .lpcompany-map2 iframe{
        max-width: 100%;
        height: 100%;
        margin:0 auto;
        text-align: center;
    }
    .lpcompany-box3-p{
        line-height: 1.5rem;
        margin: 1rem auto;
        font-size: .7rem;
    }  

}
@media screen and (max-width: 480px) {
    .lp-company-body .h2{
        width: 80%;
        margin: 2rem auto;
        display: block;
    }
    .lpcompany-img1{
        width: 90%;
        margin-left: auto;
        margin-top: 2rem;
        opacity: 0;
    }
    .lpcompany-img2{
        width: 90%;
        margin-right: auto;
        margin-top: 2rem;
        opacity: 0;
    }
    .lpcompany-img1 img{
        width: 100%;
        height: auto;
    }
    .lpcompany-img2 img{
        width: 100%;
        height: auto;
    }
    /*画像アニメーション*/
    .img-animation {
        animation: img-opacity 2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
        overflow: hidden;
        position: relative;
      }
      
      .img-animation::before {
        animation: img-animation 2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
        background: #fff;
        content: '';
        inset: 0;
        pointer-events: none;
        position: absolute;
        z-index: 1;
      }
      @keyframes img-opacity {
        100% {
          opacity: 1;
        }
      }
      
      @keyframes img-animation {
        100% {
          transform: translateX(100%);
        }
      }
    .lp-lhcompany_box1{
        width: 80%;
        margin: 4rem auto;
        padding-bottom: 8rem;
    }
    .lp-lhcompany_table{
        display: grid;
        grid-template-columns: 35% 65%;
        border-top:solid 1px #ededed;
        padding: .5rem 0;
        margin: 0;
        align-items: center;
    }
    .lp-lhcompany_table dt{ 
        font-size: .7rem;
        display: flex;
        align-items: center;
        padding-left: 1.5rem;
    }
    .lp-lhcompany_table dd{
        padding-left: 1rem;
        border-left: solid 2px #C83131;
        font-size: .7rem;
        line-height: 1.5rem;
        margin: 0;
    }
    .lp-lhcompany_table a{
        text-decoration: none;
        color: #222222;
        font-size: .7rem;
    }
    .lp-lhcompany_table dd p{
        font-size: .7rem;
    }
    .lp-lhcompany_table:last-child {
        border-bottom:solid 1px #ededed;
    }
    /*沿革*/
    .lp-lhcompany_box2{
        width: 80%;
        margin: 4rem auto;
        padding-bottom: 8rem;
    }
    .lp-lhcompany_box2 .lp-lhcompany_table dt{ 
        font-size: .7rem;
        display: flex;
        align-items: center;
        padding-left: 1rem;
    }
     /*アクセスマップ*/
     .lhcompany-box3{
        width: 100%;
    }
    .lhcompany-box3 .h2{
        width: 80%;
        display: flex;
    }
    .lpcompany-map1{
        width: 80%;
        margin:0 auto;
    }
    .lpcompany-map1 iframe{
        max-width: 100%;
        height: 100%;
        margin:0 auto;
        text-align: center;
    }
    .lpcompany-map1 h3{
        text-align: left;
        font-size: .8rem;
        padding-left: 1rem;
        border-left: solid 2px #C83131;
    }
    .lpcompany-map2{
        width: 80%;
        display: block;
        margin: 2rem auto;
    } 

    .lpcompany-map2 h3{
        text-align: left;
        font-size: .8rem;
        margin-top: 4rem;
        padding-left: 1rem;
        border-left: solid 2px #C83131;
    }
    .lpcompany-map2 iframe{
        max-width: 100%;
        height: 100%;
        margin:0 auto;
        text-align: center;
    }
    .lpcompany-box3-p{
        line-height: 1.5rem;
        margin: 1rem auto;
        font-size: .7rem;
    }  
}
/************************************
** Works 施工事例
************************************/

/* PC */
@media screen and (min-width: 981px) {
    .lp-works_body {
      width: 70%;
      margin: 0 auto;
    }
  
    .lp-works_body-title {
      margin: 8.6rem auto 5rem;
    }
  
    .lp-works_body-title h2 {
      font-size: 3rem;
    }
  
    .lp-works_body-title span {
      font-size: 1rem;
      margin-left: 2.1rem;
      color: #848484;
    }
  
    .lp-works_title {
      font-size: 1.1rem;
      color: #848484;
      font-family: "Roboto", sans-serif;
      margin-top: 4rem;
    }
  
    .lp-works_title span {
      color: #c83131;
    }
  
    .lp-works_name {
      position: relative;
      font-size: 2rem;
      margin-top: 0.8rem;
      padding-bottom: 1.8rem;
      font-weight: normal;
    }
  
    .lp-works_name::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 2.3rem;
      height: 0.2rem;
      background: #c83131;
    }
  
    .lp-works_section {
      padding: 5rem 0 6rem 0;
    }
  
    .lp-works_article-wrapper {
      display: flex;
      gap: 5rem 1.4rem;
      flex-wrap: wrap;
    }
  
    .lp-works_article {
      border: 0.5px solid #707070;
      width: calc((100% - 3.2rem) / 3);
    }
  
    .lp-works_article img {
      height: 14rem;
    }
    .lp-works_article-thumb{
        width: 100%;
    }
    .lp-works_article-thumb img{
        width: 100%;
        vertical-align: top;
		object-fit:cover;
    }
  
    .lp-works_article a {
      text-decoration: none;
      color: #222222;
    }
  
    .lp-works_article-box {
      padding: 1.5rem 2.4rem;
      height: 4.1rem;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }
  
    .lp-works_article-box-place {
      font-size: 1.1rem;
    }
  
    .lp-works_article-box-contents-item {
      color: #848484;
    }
  
    .lp-works_article-box-contents-item span {
      color: #c83131;
    }
  
    .lp-works_article-arrow {
      position: relative;
      width: 1.8rem;
      margin-left: auto;
    }
  
    .lp-works_article-arrow1 {
      height: 1px;
      background-color: #848484;
    }
  
    .lp-works_article-arrow2 {
      position: absolute;
      top: 0;
      right: 0;
      transform-origin: right bottom;
      width: 0.5rem;
      height: 0.07rem;
      background-color: #848484;
      transform: rotate(45deg);
    }
  
    .lp-works_button {
      border: 1px solid #707070;
      margin-top: 4rem;
      max-width: 12.6rem;
      margin-left: auto;
      font-size: 1.2rem;
    }
  
    .lp-works_button a {
      display: block;
      font-size: 1.2rem;
      font-family: "Roboto", sans-serif;
      color: #222222;
      text-decoration: none;
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 1.2rem 3rem;
      cursor: pointer;
    }
	
  }
  
  /* タブレット */
  @media (min-width: 481px) and (max-width: 980px) {
    .lp-works_body {
      width: 90%;
      margin: 0 auto;
    }
  
    .lp-works_body-title {
      margin: 8.6rem auto 5rem;
    }
  
    .lp-works_body-title h2 {
      font-size: 3rem;
    }
  
    .lp-works_body-title span {
      font-size: 1rem;
      margin-left: 2.1rem;
      color: #848484;
    }
  
    .lp-works_title {
      font-size: 1.1rem;
      color: #848484;
      font-family: "Roboto", sans-serif;
    }
  
    .lp-works_title span {
      color: #c83131;
    }
  
    .lp-works_name {
      position: relative;
      font-size: 1.5rem;
      margin-top: 0.8rem;
      padding-bottom: 1.8rem;
      font-weight: normal;
    }
  
    .lp-works_name::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 2.3rem;
      height: 0.1rem;
      background: #c83131;
    }
  
    .lp-works_section {
      padding: 2rem 0 18rem 0;
    }
  
    .lp-works_article-wrapper {
      display: flex;
      gap: 2rem 1rem;
      flex-wrap: wrap;
    }
  
    .lp-works_article {
      border: 0.5px solid #707070;
      width: calc((100% - 1.4rem) / 2);
    }
    .lp-works_article-thumb{
        width: 100%;
    }
    .lp-works_article-thumb img{
        width: 100%;
        height: auto;
        vertical-align: top;
    }
    .lp-works_article img {
      height: 14rem;
    }
  
    .lp-works_article a {
      text-decoration: none;
      color: #222222;
    }
  
    .lp-works_article-box {
      padding: 1rem 1.5rem;
      height: 3.3rem;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }
  
    .lp-works_article-box-place {
      font-size: 0.9rem;
    }
  
    .lp-works_article-box-contents-item {
      color: #848484;
      font-size: 0.9rem;
    }
  
    .lp-works_article-box-contents-item span {
      color: #c83131;
    }
  
    .lp-works_article-arrow {
      position: relative;
      width: 1.8rem;
      margin-left: auto;
    }
  
    .lp-works_article-arrow1 {
      height: 1px;
      background-color: #848484;
    }
  
    .lp-works_article-arrow2 {
      position: absolute;
      top: 0;
      right: 0;
      transform-origin: right bottom;
      width: 0.5rem;
      height: 0.07rem;
      background-color: #848484;
      transform: rotate(45deg);
    }
  
    .lp-works_button {
      border: 1px solid #707070;
      margin-top: 4rem;
      max-width: 10rem;
      margin-left: auto;
      font-size: 1.2rem;
    }
  
    .lp-works_button a {
      display: block;
      font-size: 1rem;
      font-family: "Roboto", sans-serif;
      color: #222222;
      text-decoration: none;
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 1rem 2rem;
      cursor: pointer;
    }
  }
  
  /* SP */
  @media screen and (max-width: 480px) {
    .lp-works_body {
      width: 100%;
      position: relative;
      color: #222222;
      width: 80%;
      margin: 0 auto;
    }
  
    .lp-works_body-title {
      width: 80%;
      margin: 4.4rem auto 2.9rem;
      display: flex;
      align-items: flex-end;
    }
  
    .lp-works_body-title h2 {
      font-size: 1.8rem;
    }
  
    .lp-works_body-title span {
      font-size: 1rem;
      color: #848484;
      margin-left: 1.3rem;
    }
  
    .lp-works_title {
      font-size: 0.8rem;
      font-family: "Roboto", sans-serif;
      margin-top: 3rem;
    }
  
    .lp-works_title span {
      font-size: 0.8rem;
      color: #c83131;
    }
  
    .lp-works_name {
      font-size: 1.2rem;
      margin-top: 0.5rem;
      font-weight: normal;
    }
  
    .lp-works_section {
      margin: 1.9rem auto 7.5rem;
    }
  
    .lp-works_article {
      border: solid 1px #ededed;
    }
    .lp-works_article:nth-child(n+4) {
        display: none;
    }
    .lp-works_article a {
      text-decoration: none;
      cursor: pointer;
      color: #000000;
    }
  
    .lp-works_article:not(:first-child) {
      margin-top: 2.5rem;
    }
  
    .lp-works_article-thumb {
      width: 100%;
    }
    .lp-works_article-thumb img{
        width: 100%;
        height: auto;
        vertical-align: top;
      }
  
    .lp-works_article-thumb-pc {
      display: none;
    }
  
    .lp-works_article img {
      object-fit: cover;
      height: 11rem;
    }
  
    .lp-works_article-box {
      padding: 1rem 1.5rem;
      height: 3.3rem;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }
  
    .lp-works_article-box-pc {
      display: none;
    }
  
    .lp-works_article-box-place {
      font-size: 0.8rem;
    }
    .lp-works_article-box-contents-item{
        font-size: .8rem;
    }
    .lp-works_article-box-contents-item span{
        color: #C83131;
    }
    .lp-works_button{
        margin-left: auto;
        margin-top: 2rem;
        width: 30%;
        border: solid 1px #ededed;
        padding: .5rem 2rem;
    }
    .lp-works_button a{
        text-decoration: none;
        color: #222222;
        display: flex;
        align-items: flex-end;
    }
    .lp-works_article-arrow {
        position: relative;
        width: 1.8rem;
        margin-left: auto;
      }
    
      .lp-works_article-arrow1 {
        height: 1px;
        background-color: #848484;
      }
    
      .lp-works_article-arrow2 {
        position: absolute;
        top: 0rem;
        right: 0;
        transform-origin: right bottom;
        width: 0.5rem;
        height: 0.07rem;
        background-color: #848484;
        transform: rotate(45deg);
      }
}
/************************************
** Gallery 施工写真
************************************/
.lp-gallery_body {
    width: 80%;
    margin: 0 auto;
  
    @media (min-width: 481px) and (max-width: 980px) {
      width: 90%;
    }
  
    @media screen and (min-width: 981px) {
      width: 70%;
    }
  }
.lp-gallery_top-repair-list li{
	font-size:.8rem;
}
  .lp-gallery_body-title {
    padding: 4.9rem 0 2.5rem 0;
  
    @media screen and (min-width: 981px) {
      padding: 8.6rem 0 7rem 0;
    }
  }
  
  .lp-gallery_body-title h2 {
    font-size: 1.9rem;
    font-family: "Roboto", sans-serif;
  
    @media screen and (min-width: 981px) {
      font-size: 3rem;
    }
  }
  
  .lp-gallery_body-title span {
    color: #848484;
    font-size: 1rem;
    margin-left: 1.3rem;
  
    @media screen and (min-width: 981px) {
      margin-left: 2rem;
    }
  }
  
  .lp-gallery_top {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 4rem;
    height: 10%;
    gap:2rem;
  
    @media (min-width: 481px) and (max-width: 980px) {
      align-items: start;
    }
  
    @media screen and (min-width: 981px) {
      flex-direction: row;
      gap: 5rem;
    }
  }
  
  .lp-gallery_top-kv {
    width: 80%;
    height: auto;
    @media (max-width: 481px){
        width: 100%;
    }
    @media (min-width: 481px) and (max-width: 980px) {
      width: 80%;
      margin: 0 auto;
    }
  
    @media screen and (min-width: 981px) {
      width: 50%;
    }
  }
  
  .lp-gallery_top-kv img {
    object-fit: cover;
    height: auto;
    width: 100%;
    vertical-align: top;
  
    @media (min-width: 481px) and (max-width: 980px) {
      height: 20rem;
      width: 100%;
    }
  
    @media screen and (min-width: 981px) {
      height: auto;
    }
  }
  
  .lp-gallery_top-repair {
    margin-top: 2.5rem;
    width: 100%;
    padding-bottom: 8rem;
  
    @media screen and (min-width: 981px) {
      margin-top: 0;
      width: calc(50% - 5rem);
      padding: 2rem
    }
  }
  .lp-gallery_top-repair-title {
    font-size: 1.1rem;
    padding-left: 1rem;
    position: relative;
    font-weight: normal;
    
    @media (min-width: 481px) and (max-width: 980px) {
        width: 80%;
        margin: 0 auto;
      }

    @media screen and (min-width: 981px) {
      font-size: 1.3rem;
    }
  }
  
  .lp-gallery_top-repair-title::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    background: #c83131;
    height: 1.9rem;
    width: 0.2rem;
  }
  
  .lp-gallery_top-repair-list {
    list-style: none;
    padding: 1.9rem 0 0 0;
  
    @media (min-width: 481px) and (max-width: 980px) {
      width: 80%;
      margin: 0 auto;
    }
  }
  
  .lp-gallery_top-repair-list-item {
    font-size: 0.8rem;
    padding: 0.8rem 0;
    color: #000000;
    border-bottom: 0.03rem solid #848484;
    letter-spacing: 0.05rem;
  
    @media screen and (min-width: 981px) {
      font-size: 1rem;
      letter-spacing: 0.05rem;
    }
	  
  }
@media screen and (min-width: 981px) {
.ngg-gallery-thumbnail-box {
		display:inline-block;
	}

	.ngg-galleryoverview default-view {
		display:flex;
		gap:1rem;
	}
	.gallery_box{
		padding-bottom:12rem;
	}
}
/************************************
** 採用情報
************************************/

@media screen and (min-width: 981px) {
  .lpcompany-h1-2 {
    margin: 8.6rem auto 5.2rem;
    width: 60%;
    display: flex;
    align-items: baseline;
  }
  .lpcompany-h2 {
    display: block;
    font-size: 3rem;
    font-family: "Roboto", sans-serif;
  }
  .lpcompany_title {
    color: #848484;
    margin-left: 2.2rem;
  }
  .lp-lhrecruit-top {
    width: 60%;
    margin: 4vw auto;
  }
  .lp-lhrecruit-top img {
    height: 13.4rem;
    object-fit: cover;
  }
  .lp-lhrecruit-box1 {
    width: 60%;
    color: #040404;
    padding-top: 7.5rem;
	padding-bottom:.5rem;
    margin: 0 auto;
  }
  .lp-lhrecruit-box1 h2 {
    font-weight: bold;
    font-size: 1.5rem;
    background-color: #fff;
    position: relative;
    margin: 0 1.6rem;
    padding-left: 2.9rem;
  }
  .lp-lhrecruit-box1 h2::after {
    content: "";
    text-indent: 2vw;
    background: #c83131;
    height: 100%;
    width: 0.3rem;
    position: absolute;
    left: 0;
  }

  .lp-lhrecruit-box1 table {
    width: 100%;
    border-collapse: collapse;
    margin: 4rem 0 4rem;
  }

  .lp-lhrecruit-box1 table th,
  .lp-lhrecruit-box1 table td {
    border: 1px solid #707070;
  }

  .lp-lhrecruit-box1 p {
    margin: 2vw auto 8vw 2vw;
    line-height: 3vw;
  }
  .lp-lhrecruit-box1 span {
    font-weight: bold;
    font-size: 1.8vw;
  }
  .lp-lhrecruit-box1-th {
    background-color: #fff;
    font-weight: bold;
    font-size: 0.8vw;
  }
  .lp-lhrecruit-box1-td {
    background-color: #fff;
    font-weight: lighter;
    font-size: 0.8vw;
    padding: 1vw;
  }
  .lp-lhrecruit-box1-title {
    background-color: #040404;
    color: #fff;
    font-size: 1.3vw;
    font-weight: bold;
    text-indent: 2vw;
    border: none;
    padding: 0.2vw;
    text-align: left;
  }
}

@media (min-width: 481px) and (max-width: 980px) {
  .lpcompany-h1-2 {
    margin: 4.4rem auto 2.5rem;
    width: 80%;
    display: flex;
    align-items: baseline;
  }
  .lpcompany-h2 {
    display: block;
    font-size: 1.9rem;
    font-family: "Roboto", sans-serif;
  }
  .lpcompany_title {
    color: #848484;
    margin-left: 1.3rem;
  }
  .lp-lhrecruit-top {
    width: 80%;
    margin: 4vw auto;
  }

  .lp-lhrecruit-box1 {
    width: 70%;
    margin: 0 auto;
    color: #040404;
    padding-top: 4rem;
  }
  .lp-lhrecruit-box1 h2 {
    font-weight: bold;
    font-size: 2vw;
    background-color: #fff;
    text-indent: 2vw;
    border-left: solid 3px #c83131;
    padding: 0.2vw;
  }
  .lp-lhrecruit-box1 p {
    margin: 2vw auto 8vw 2vw;
    line-height: 5vw;
    font-size: 1.5vw;
  }
  .lp-lhrecruit-box1 span {
    font-weight: bold;
    font-size: 2.5vw;
  }
  .lp-lhrecruit-box1-th {
    background-color: #fff;
    font-weight: bold;
    font-size: 1.5vw;
    padding: 1vw;
  }
  .lp-lhrecruit-box1-td {
    background-color: #fff;
    font-weight: lighter;
    font-size: 1.5vw;
    padding: 2vw;
  }
  .lp-lhrecruit-box1-title {
    background-color: #040404;
    color: #fff;
    font-size: 2vw;
    font-weight: bold;
    border: none;
    text-align: left;
    padding-left: 4vw;
  }
  .lp-lhrecruit-box1 table {
    margin: 8vw auto;
    width: 100%;
    border-collapse: collapse;
  }
  .lp-lhrecruit-box1 table th,
  .lp-lhrecruit-box1 table td {
    border: 1px solid #707070;
  }
}

@media screen and (max-width: 480px) {
  .lpcompany_body {
    background: #fff;
  }
  .lpcompany-h1-2 {
    margin: 4.4rem auto 2.5rem;
    width: 80%;
    display: flex;
    align-items: baseline;
  }
  .lpcompany-h2 {
    display: block;
    font-size: 1.9rem;
    font-family: "Roboto", sans-serif;
  }
  .lpcompany_title {
    color: #848484;
    margin-left: 1.3rem;
  }
  .lp-lhrecruit-top {
    width: 100%;
    margin: 2rem auto;
  }
  .lp-lhrecruit-top img {
    height: auto;
    object-fit: cover;
	 width:100%;
  }

  .lp-lhrecruit-box1 {
    width: 80%;
    margin: 0 auto;
    color: #040404;
    padding-top: 4rem;
  }
  .lp-lhrecruit-box1 h2 {
    font-weight: bold;
    font-size: 4vw;
    background-color: #fff;
    text-indent: 2vw;
    border-left: solid 4px #c83131;
    padding: 0.6rem 0.8rem;
  }
  .lp-lhrecruit-box1 p {
    margin: 2vw auto 8vw 2vw;
    line-height: 8vw;
    font-size: 3vw;
  }
  .lp-lhrecruit-box1 span {
    font-weight: bold;
    font-size: 6vw;
  }
  .lp-lhrecruit-box1 tr{
    gap:0;
  }
  .lp-lhrecruit-box1-th {
    background-color: #fff;
    font-weight: bold;
    font-size: 3vw;
    padding: 2vw;
    width: 30%;
    border: solid 1px #222222;
    margin: 0;
  }
  .lp-lhrecruit-box1-td {
    background-color: #fff;
    font-weight: lighter;
    font-size: 3vw;
    padding: 2vw;
    line-height: 1.5rem;
    width: 70%;
    border: solid 1px #222222;
  }
  .lp-lhrecruit-box1-title {
    background-color: #040404;
    color: #fff;
    font-size: 4vw;
    font-weight: lighter;
    border: none;
    padding: 3vw;
    text-align: left;
  }
  .lp-lhrecruit-box1 table {
    margin: 12vw auto;
	border-collapse:collapse;
  }
}