@charset "utf-8";

#main img {
width: 100%;
}
#main img.auto {
width: auto !important;
}


/*特殊機材*/
.equipment{
margin-top: 40px;
}
.equipment ul.list,
.equipment ul.list li {
  margin: 0;
  padding: 0;
  list-style: none;
}

.equipment ul.list {
  max-width: none;
  margin-left: -2%;
  margin-right: -2%;
  margin-bottom: -4%;
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
}


.equipment ul.list li img{
  width: 100%;
}

.equipment ul.list li .caption {
  margin-top: 5px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.4;
  display: table;
  text-align: center;
}
.equipment.photo-3 ul.list li {
  width: 31.63%;
  max-width: 100%;
  margin-left: 1.923%;
  margin-right: -1.3%;
  margin-bottom: 3.846%;
}

@media screen and (max-width:736px) {

  .equipment ul.list {
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    overflow: hidden;
  }
  .equipment.photo-3 ul.list li {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 1.5em;
  }

}



.optext{
text-align:center;
color: #333;
font-size: 1.4em;
font-weight: 600;
}
.optext .red{
color: #ff2131;
font-size: 2em;
font-weight: bold;
}
.optext .red a{
color: #ff2131;
text-decoration:none;
  transition: 0.4s;
}
.optext .red a:hover{
  transition: 0.4s;
  opacity: 0.8;
}

.opimg ul.list,
.opimg ul.list li {
  margin: 0;
  padding: 0;
  list-style: none;
}

.opimg ul.list {
  max-width: none;
  margin-left: -2%;
  margin-right: -2%;
  margin-bottom: -4%;
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  margin-top: 40px;
  margin-bottom: 20px;
}


.opimg ul.list li img{
  width: 70%;
  margin-top: 0;
}

.opimg ul.list li .caption {
  margin-top: 5px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.4;
  display: table;
  text-align: center;
  color: #73889f;
  font-size: 1.8em;
  font-weight: 600;
}
.opimg ul.list li:nth-of-type(1) {
  width: 43.445%;
  max-width: 100%;
  margin-left: 1.923%;
  margin-right: -1.3%;
  margin-bottom: 3.846%;
  text-align:center;
}
.opimg ul.list li:nth-of-type(2) {
  width: 8%;
  max-width: 100%;
  margin-left: 1.923%;
  margin-right: -1.3%;
  margin-bottom: 3.846%;
  text-align:center;
  color: #ff2131;
}
.opimg ul.list li:nth-of-type(2) span {
  font-size: 8em;
  padding-top: 150px;
  display: block;
}
.opimg ul.list li:nth-of-type(3) {
  width: 43.445%;
  max-width: 100%;
  margin-left: 1.923%;
  margin-right: -1.3%;
  margin-bottom: 3.846%;
  text-align:center;
}
.opimg ul.list li a p,
.opimg ul.list li a img{
  transition: 0.4s;
}
.opimg ul.list li a:hover p{
  transition: 0.4s;
  opacity: 0.8;
}
.opimg ul.list li a:hover img{
  transition: 0.4s;
  opacity: 0.8;
}

.opimg ul.list li a{
  text-decoration: none;
}
.opimg ul.list li a .img {
  width: 80%;
  margin: 0.5em auto 0;
}
.opimg ul.list li:nth-of-type(2){
position: relative;
max-height: 368px;
margin-top: 9%;
}
.opimg ul.list li .plus{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
width: 70%;
}

@media screen and (max-width:900px) {

  .optext{
  font-size: 1.2em;
  }
  .optext .red{
  font-size: 1.5em;
  }
  .opimg ul.list li .caption {
    font-size: 1em;
  }

}

.catch{
text-align: center;
line-height: 1.3;
}
.catch span.main{
display: block;
color: #73889f;
font-size: 2.2em;
font-weight: bold;
}
.catch span.main.big{
font-size: 2.8em;
}
.catch span.main.small{
font-size: 1.8em;
}
.catch span.sub{
display: block;
color: #73889f;
font-size: 1.2em;
font-weight: 600;
}
.message .content p span{
  display: block;
  margin-top: 0.5em;
}

@media screen and (max-width:900px) {

  .catch span.main.big{
  font-size: 1.5em;
  }
  .catch span.main.small{
  font-size: 1.1em;
  }

  .catch span.main{
    font-size: 1.4em;
  }

}


#jiko .box{
margin-top: 1em;
letter-spacing: -.4em;
}
#jiko .box .inbox{
display: inline-block;
letter-spacing: normal;
vertical-align: top;
}
#jiko .box .inbox:nth-of-type(1){
width: 24%;
margin-right: 2%;
}
#jiko .box .inbox:nth-of-type(2){
width: 22%;
margin-right: 4%;
}
#jiko .box .inbox:nth-of-type(3){
width: 24%;
margin-right: 2%;
margin-top: 0;
}
#jiko .box .inbox:nth-of-type(4){
width: 22%;
margin-top: 0;
}
#jiko .box .img,
#jiko .box .img img{
width: 100%;
}

@media screen and (max-width:900px) {

  #jiko .box .inbox:nth-of-type(1){
  width: 38%;
  margin-right: 4%;
  }
  #jiko .box .inbox:nth-of-type(2){
  width: 58%;
  margin-right: 0%;
  }
  #jiko .box .inbox:nth-of-type(3){
  width: 38%;
  margin-right: 4%;
  margin-top: 1.5em;
  }
  #jiko .box .inbox:nth-of-type(4){
  width: 58%;
  margin-top: 1.5em;
  }

}

#kizai .box{
margin-top: 1em;
letter-spacing: -.4em;
}
#kizai .box .lbox,
#kizai .box .rbox{
display: inline-block;
letter-spacing: normal;
vertical-align: top;
}
#kizai .box .lbox{
width: 37%;
margin-right: 4%;
}
#kizai .box .rbox{
width: 59%;
letter-spacing: -.4em;
margin-top:0;
}
#kizai .box .rbox .inbox{
display: inline-block;
letter-spacing: normal;
vertical-align: top;
}
#kizai .box .rbox h4{
letter-spacing: normal;
}
#kizai .box .rbox .inbox:nth-of-type(1){
width: 57%;
margin-right: 3%;
}
#kizai .box .rbox .inbox:nth-of-type(2){
width: 18.5%;
margin-right: 3%;
}
#kizai .box .rbox .inbox:nth-of-type(3){
width: 18.5%;
}
#kizai .box .inbox .img,
#kizai .box .img img{
width: 100%;
}

@media screen and (max-width:900px) {

  #kizai .box .lbox{
  width: 100%;
  margin-right: 0;
  }
  #kizai .box .rbox{
  width: 100%;
  margin-top: 1.5em;
  }
  #kizai .box .rbox .inbox:nth-of-type(1){
  width: 41%;
  margin-right: 3%;
  }
  #kizai .box .rbox .inbox:nth-of-type(2){
  width: 26.5%;
  margin-right: 3%;
  }
  #kizai .box .rbox .inbox:nth-of-type(3){
  width: 26.5%;
  }

}


#koutei .box{
  letter-spacing: -.4em;
}
#koutei .detail {
  letter-spacing: normal;
  display: inline-block;
  vertical-align: top;
}
#koutei .detail:nth-of-type(1){
  width: 46%;
  margin-right: 4%;
}
#koutei .detail:nth-of-type(2){
  width: 50%;
  margin-top: 0;
}
#koutei .detail img {
  width: 100%;
}

#koutei .detail div.item {
  letter-spacing: -0.4em;
}

#koutei .detail div.item > * {
  letter-spacing: normal;
  display: inline-block;
  vertical-align: top;
}

#koutei .detail div.item div.photo {
  /*width: 200px;*/
  width: 47%;
  font-size: 0.9em;
}
#koutei .detail div.item div.arrow {
  /*width: 45px;*/
  width: 6%;
  text-align: center;
  margin-top: 80px;
}

#koutei .detail p + * {
    margin-top: 0;
}

#koutei .detail div.item ~ div.item {
  margin-top: 20px;
}

#koutei .detail div.inbox ~ div.inbox {
  margin-top: 20px;
}

@media screen and (max-width:900px) {

  #koutei .detail:nth-of-type(1){
    width: 100%;
    margin-right: 0%;
  }
  #koutei .detail:nth-of-type(2){
    width: 100%;
    margin-top: 1.5em;
  }
  #koutei .detail div.item div.photo {
    width: 45%;
    font-size: 1em;
  }
  #koutei .detail div.item div.arrow {
    width: 10%;
    padding: 0 2%;
    margin-top: 18%;
  }

}


@media screen and (max-width:900px) {

  .table-style-1 > tbody > tr > th {
    width: 100%;
    padding: 10px 1em;
    text-align: center;
  }
  .table-style-1 > tbody > tr ~ tr {
    margin-top: 0; 
  }


}




.img-layout2 {
letter-spacing: -.4em;
}
.img-layout2 .imgbox{
display: inline-block;
letter-spacing: normal;
vertical-align: top;
}
.img-layout2 .text1{
display:block;
letter-spacing: normal;
margin-bottom: 1.75em;
}
.img-layout2 .text2{
display:block;
letter-spacing: normal;
font-size: 0.8em;
margin:0;
}
.img-layout2 .imgbox .img{

}
.img-layout2 .imgbox .cap{
margin-top: 0;
font-size: 0.8em;
}

.img-layout2.p1 .imgbox{
width: 48%;
}
.img-layout2.p1 .imgbox~.imgbox{
margin-left: 4%;
margin-top:0;
}

.img-layout2.p2 .imgbox:nth-child(1){
width: 37%;
}
.img-layout2.p2 .imgbox:nth-child(2){
width: 59%;
}
.img-layout2.p2 .imgbox~.imgbox{
margin-left: 4%;
margin-top:0;
}

.img-layout2.p3 .imgbox{
width: 49%;
}
.img-layout2.p3 .imgbox~.imgbox{
margin-left: 2%;
margin-top:0;
}

.equipment ul.list li .caption{
text-align: left !important;
font-size: 0.8em;
}
@media screen and (max-width:736px) {
  .img-layout2 .text2{
  font-size: 1em;
  }
  .img-layout2 .imgbox .cap{
  font-size: 1em;
  }

  .img-layout2.p1 .imgbox{
  width: 100%;
  }
  .img-layout2.p1 .imgbox~.imgbox{
  margin-left: 0;
  margin-top: 4%;
  }

  .img-layout2.p2 .imgbox:nth-child(1){
  width: 100%;
  }
  .img-layout2.p2 .imgbox:nth-child(2){
  width: 100%;
  }
  .img-layout2.p2 .imgbox~.imgbox{
  margin-left: 0;
  margin-top: 4%;
  }

  .img-layout2.p3 .imgbox{
  width: 100%;
  }
  .img-layout2.p3 .imgbox~.imgbox{
  margin-left: 0;
  margin-top: 4%;
  }

  .equipment ul.list li .caption{
  font-size: 1em;
  }
}

.title-style-3.color-orange::after{
border: 6px solid #ec6a06;
}
.color-orange{
color: #ec6a06;
}

.attention{
margin-top: 1.75em;
border: solid 3px #ff2131;
}
.attention p.title{
text-align: center;
background-color: #ff2131;
color: #fff;
font-size: 1.3em;
font-weight: 500;
padding: 5px 0;
}
.attention p.text{
margin-top: 0;
padding: 1em;
}


/*作業工程*/

.step {
  letter-spacing: -0.4em;
}

.step > * {
  letter-spacing: normal;
}


.step div.content {
  /*width: 610px;*/
  width: auto;
  display: inline-block;
  vertical-align: top;
  /*margin-left: 20px;*/
  /*margin-right: 30px;*/
}

.step div.content .title {
  font-size: 25px;
  padding-top: 10px;
}

.step .photo{
margin-top: 20px;
}

@media screen and (max-width: 736px) {
  .step div.content .title {
    font-size: 1.1em;
    font-weight: bold;
  }
}

div.photo.photo-text {
  letter-spacing: -.4em !important;
}
div.photo.photo-text .img .caption {
  margin-top: 5px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.4;
  display: table;
  text-align: center;
}
div.photo.photo-text .img{
  display: inline-block;
  letter-spacing: normal;
  width: 31.63%;
}
div.photo.photo-text .img img{
  width: 100%;
}
div.photo.photo-text .text{
  display: inline-block;
  letter-spacing: normal;
  vertical-align: top;
  width: 68.37%;
}
div.photo.photo-text .text p{
  font-size: 1.2em;
  /*padding: 20px;*/
  padding: 0 20px;
  line-height: 2;
}

/*作業写真*/
.cyousa{
margin-top: 40px;
}
.cyousa ul.list,
.cyousa ul.list li {
  margin: 0;
  padding: 0;
  list-style: none;
}

.cyousa ul.list {
  max-width: none;
  margin-left: -2%;
  margin-right: -2%;
  margin-bottom: -4%;
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
}


.cyousa ul.list li img{
  width: 100%;
}

.cyousa ul.list li .caption {
  margin-top: 5px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.4;
  display: table;
  text-align: center;
  font-size: 95%;
}
.cyousa.photo-3 ul.list li {
  width: 31.63%;
  max-width: 100%;
  margin-left: 1.923%;
  margin-right: -1.3%;
  margin-bottom: 3.846%;
}

@media screen and (max-width: 736px) {
  .cyousa ul.list {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .cyousa.photo-3 ul.list li {
    width: 60%;
  }
}

/*作業工程*/
.step-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 auto;
  column-gap: 40px;
}

.step-item {
  position: relative;
  width: calc((100% - 80px) / 3);
  box-sizing: border-box;
  text-align: center;
  margin-bottom: 1em;
}

.step-item img {
  width: 100%;
  height: auto;
  display: block;
}

.step-label {
  position: absolute;
  top: 0;
  right: 0;
  background-color: #ec6a06;
  color: white;
  font-weight: bold;
  padding: 4px 10px;
  font-size: 16px;
}

.caption {
  margin-top: 8px;
  font-weight: bold;
}

.step-item::after {
  content: "";
  position: absolute;
  top: 42%;
  right: -32px; /* ▶と画像の余白 */
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: 20px solid transparent;
  border-bottom: 20px solid transparent;
  border-left: 24px solid #ec6a06; /* 三角本体 */
}

.step-item:nth-child(3n)::after {
  display: none;
}

@media screen and (max-width: 736px) {
  .step-container {
    flex-direction: column;
    gap: 0;
  }

  .step-item {
    width: 100%;
  }

  .step-item::after {
    content: "";
    position: static;
    display: block;
    margin: 10px auto 20px;
    width: 0;
    height: 0;
    border-left: 100px solid transparent;
    border-right: 100px solid transparent;
    border-top: 40px solid #ec6a06;
    transform: none;
  }

  .step-item:nth-child(3n)::after {
    display: block;
  }
  .step-item:last-child::after {
    display: none;
  }

  .step-label {
    font-size: 1.5em;
  }
}

#chainsec{
margin-top: 80px !important;
}
@media screen and (min-width:901px) {
#chainsec{
margin-top: 160px !important;
}
}
ul.chain{
padding: 0;
margin: 1em 0;
list-style: none;
display: flex;
gap: 30px;
}
ul.chain li p{
margin-top: 0.2em;
text-align: center;
font-size: 80%;
}
@media screen and (max-width: 736px) {
ul.chain{
display: flex;
flex-wrap: wrap;
justify-content: center;
}
ul.chain li{
width: 46%;
}
ul.chain li p{
font-size: 90%;
}
}




.flex-video3{
  letter-spacing: -.4em;
  display: flex;
  justify-content: space-between;
}
.flex-video3 .inbox {
  position: relative;
  height: 0;
  margin-bottom: 20px;
  padding-bottom: 75%;
  overflow: hidden;
}
.flex-video3 .inbox iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.flex-video3 .vbox{
  display: inline-block;
  letter-spacing: normal;
  width: 32%;
}

.flex-video3 h4.title-text {
  line-height: 20px;
  font-size: 20px;
  background:#333;
  color: #fff;
  padding: 0.5em 0;
  text-align:center;
  font-weight: bold;
}

@media screen and (max-width:736px) {
.flex-video3{
  display: block;
}
.flex-video3 .vbox{
  display: block;
  width: 100%;
}
}

.flex-video2{
  margin-top:1em;
}
.flex-video2 .inbox {
  position: relative;
  height: 0;
  margin-bottom: 20px;
  padding-bottom: 75%;
  overflow: hidden;
}
.flex-video2 .inbox iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.flex-video2 .fr{
  float: right;
  width: 49.5%;
}
.flex-video2 .fl{
  float:left;
  width: 49.5%;
}
.flex-video2:after{
  display: block;
  clear: both;
  content: "";
}

.flex-video2 h4.title-text {
  line-height: 20px;
  font-size: 20px;
  background:#333;
  color: #fff;
  padding: 0.5em 0;
  text-align:center;
  font-weight: bold;
}

@media screen and (max-width:736px) {
.flex-video2 .fr,
.flex-video2 .fl{
  float: none;
  width: 100%;
}
}

.content.flex2{
display: flex;
gap: 2em;
}
.content.flex2 p{
margin-top: 0;
}
@media screen and (max-width:736px) {
.content.flex2{
display: block;
}
.content.flex2 p:nth-child(2){
width: 40%;
margin:20px auto 0;
}
}