@charset "utf-8";

/* ---------------------------------------------------
   File: service.css
   Version: 1.0.0
   Update: 2021-10-25
   Author: https://flowlab.co.jp

   (c)2007-2021 Flowlab inc. All Rights Reserved.
--------------------------------------------------- */



/* ===========================================================================================================================================

   WIDE DESKTOP LAYOUT

=========================================================================================================================================== */

/* ====================================================
		common
==================================================== */

/* -------------------------------
		Main
------------------------------- */
#main {
	background-color: #f6f6f6;
}

/* -------------------------------
		Main Visual
------------------------------- */
#main #mainVisual .photo {
  background: url("../service/images/bg_header.jpg") no-repeat center center;
	background-size: cover;
}

/* -------------------------------
		Page Path
------------------------------- */
#pagePath {
	margin-bottom: -1px;
}





/* ====================================================
		factory
==================================================== */

#main #factory {
}

/* -------------------------------
		Photo
------------------------------- */
#main #factory .photo {
	margin-bottom: 0;
}
#main #factory .photo img {
	width: 100%;
}

/* -------------------------------
		Numbar
------------------------------- */
#main #factory .numTtl {
	margin: 0 0 35px 8px;
	color: #bd0006;
	line-height: 1;
	font-size: 5rem;
	font-weight: 800;
	font-family: "Zen Old Mincho",sans-serif;
	letter-spacing: 0.1em;
}
#main #factory .numTtl span {
	margin: -85px 0 0 -9px;
	font-size: 14rem;
	display: inline-block;
	vertical-align: middle;
}

/* -------------------------------
		Layout
------------------------------- */
#main #factory .listUl {
	margin: 150px 0 100px;
	padding-bottom: 0;
}
#main #factory .listUl > li::after {
	height: calc(100% + 60px);
	top: -40px;
}
#main #factory .listUl > li {
	padding-bottom: 42px;
}






/* ====================================================
		feedstock
==================================================== */

#main #feedstock {
	background-color: #fff;
}

/* -------------------------------
		Title
------------------------------- */
#main #feedstock .headLine05 {
}
#main #feedstock .comTxtUl .ttl {
  font-weight: normal;
}

/* -------------------------------
		Table
------------------------------- */
#main #feedstock table td {
	background-color: #f6f6f6;
}
#main #feedstock .comTxtUl li::before {
  top: 13px;
}





/* ====================================================
		cartification
==================================================== */

#main #cartification {
	color: #fff;
	background-color: #262827;
  padding-bottom: 50px;
}

/* -------------------------------
		Title
------------------------------- */
#main #cartification .headLine05 {
	color: #fff;
}
#main #cartification .headLine06 {
	margin-bottom: 49px;
	padding-top: 43px;
	letter-spacing: 0;
	font-size: 3.6rem;
  font-weight: normal;
}
#main #cartification .headLine06 .small {
	margin-top: 5px;
	font-size: 2.6rem;
	display: block;
}
#main #cartification .headLine06 .small span {
  font-size: 1.3rem;
  letter-spacing: 0.05em;
}
#main #cartification .headLine06::after {
	background-color: #fff;
}

/* -------------------------------
		Layout
------------------------------- */
#main #cartification .comBox {
	max-width: 900px;
}
#main #cartification .imgBox {
	display: flex;
	justify-content: space-between;
  padding-bottom: 100px;
}

/* -------------------------------
		Photo
------------------------------- */
#main #cartification .imgBox .photo {
	width: 300px;
}

/* -------------------------------
		Text
------------------------------- */
#main #cartification .imgBox .textBox {
	flex: 1;
}

/* -------------------------------
		Table
------------------------------- */
#main #cartification .comTableBox {
	margin-left: -4px;
}
#main #cartification table {
	border-spacing: 4px;
}
#main #cartification table td,
#main #cartification table th {
	padding: 7px 14px 6px;
	font-size: 1.5rem;
	background-color: transparent;
	line-height: 1.89;
}
#main #cartification table th {
	width: 18.5%;
	background-color: #323433;
	text-align: center;
	letter-spacing: 0.1em;
}





/* ====================================================
		vehicle
==================================================== */

#main #vehicle {
	background-color: #fff;
}

/* -------------------------------
		Title
------------------------------- */
#main #vehicle h3 {
  font-weight: normal;
}
#main #vehicle h3 span {
  letter-spacing: 0.1em;
}




/* ====================================================
		Qualified Person
==================================================== */

#main #qualified-person {
	border-bottom: 11px solid #fff;
}

/* -------------------------------
		Title
------------------------------- */
#main #qualified-person .headLine05 {
}

/* -------------------------------
		Photo
------------------------------- */
#main #qualified-person .showBox .photo {
  margin-left: auto;
  width: calc(50% + 550px);
	height: 700px;
  background: url("../service/images/ph_qualified-person.jpg") no-repeat center center;
  background-size: cover;
}

/* -------------------------------
		Text
------------------------------- */
#main #qualified-person .showBox .textBox {
	padding: 76px 83px 42px 10px;
}

/* -------------------------------
		Layout
------------------------------- */
#main #qualified-person .showBox .inner {
	max-width: 667px;
}
#main #qualified-person .showBox th {
	width: 54.5%;
}
#main #qualified-person .showBox td {
	background-color: #f6f6f6;
}

/* -------------------------------
		Caution statement
------------------------------- */
#main #qualified-person .notesTxt {
	margin-top: 5px;
	font-size: 1.2rem;
	display: block;
}













/* ===========================================================================================================================================

   TABLET - LARGE

============================================================================================================================================= */
@media all and (min-width: 897px) and (max-width: 1299px) {
  
  
  /* ====================================================
      factory
  ==================================================== */

  #main #factory {
  }

  /* -------------------------------
      Numbar
  ------------------------------- */
  #main #factory .numTtl {
    margin: 0 0 35px 8px;
    font-size: 4rem;
  }
  #main #factory .numTtl span {
    margin: -45px 0 0 -9px;
    font-size: 10rem;
  }

  /* -------------------------------
      Layout
  ------------------------------- */
  #main #factory .listUl {
    max-width: 95%;
    margin: 100px 0 100px;
  }
  #main #factory .listUl > li::after {
    height: calc(100% + 60px);
  }
  
  
  /* ====================================================
      cartification
  ==================================================== */
  /* -------------------------------
      Photo
  ------------------------------- */
  #main #cartification .imgBox .photo {
    width: 30%;
  }

  /* -------------------------------
      Text
  ------------------------------- */
  #main #cartification .imgBox .textBox {
    width: 50%;
  }

  
  /* ====================================================
      vehicle
  ==================================================== */
  /* -------------------------------
      Photo
  ------------------------------- */
  #main #vehicle .comList02 {
    justify-content: space-between;
  }
  #main #vehicle .comList02 > li {
    margin: 20px 0 0 0;
    width: 30%;
  }
  
  /* -------------------------------
      Title
  ------------------------------- */
  #main #vehicle h3 {
    font-size: 2.2rem;
  }
  #main #vehicle h3 span {
    vertical-align: bottom;
  }

  
}









/* ===========================================================================================================================================

   MOBILE

============================================================================================================================================= */
@media all and (max-width: 896px) {
  
  /* ====================================================
      factory
  ==================================================== */

	#main #factory {
	}
  
  /* -------------------------------
      Layout
  ------------------------------- */
	#main #factory .listUl {
		margin: 50px 0 70px;
	}
	#main #factory .numTtl {
		margin-bottom: 16px;
		font-size: 3rem;
	}
	#main #factory .numTtl span {
		margin: -29px 0 0 -9px;
		font-size: 6rem;
	}
	#main #factory .listUl > li::after {
		height: calc(100% + 20px);
		top: -8px;
	}
  
  
  
    /* ====================================================
      feedstock
  ==================================================== */

	#main #feedstock {
	}
  
  
  
    /* ====================================================
      cartification
  ==================================================== */

	#main #cartification {
    padding-bottom: 0;
	}
  
  /* -------------------------------
      Title
  ------------------------------- */
	#main #cartification .headLine06 .small {
		font-size: 1.6rem;
	}
	#main #cartification .headLine06 {
    text-align: center;
		margin-bottom: 40px;
		padding-top: 30px;
		font-size: 2.6rem;
	}
  #main #cartification .headLine06::after {
    width: 30%;
    left: 35.5%;
}
  
  /* -------------------------------
      Layout
  ------------------------------- */
	#main #cartification .imgBox {
		display: block;
	}
	#main #cartification .imgBox .photo {
		width: auto;
		text-align: center;
	}
	#main #cartification .imgBox .photo img {
		max-width: 200px;
	}
  
  /* -------------------------------
      Table
  ------------------------------- */
	#main #cartification table td,
	#main #cartification table th {
		width: auto;
		padding: 7px 8px 6px;
		font-size: 1.4rem;
		float: none;
		line-height: 1.6;
	}
	#main #cartification table th {
		width: 30%;
	}
  
  /* -------------------------------
      Text
  ------------------------------- */
	#main #cartification .imgBox .textBox {
		margin-bottom: 30px;
	}
  
  
  
    /* ====================================================
      vehicle
  ==================================================== */

	#main #vehicle {
	}
  
  
  
    /* ====================================================
      Qqualified Person
  ==================================================== */

	#main #qualified-person {
		border-bottom: none;
	}
  
  /* -------------------------------
      Photo
  ------------------------------- */
	#main #qualified-person .showBox .photo {
    width: 100%;
		height: auto;
	}
  
  /* -------------------------------
      Text
  ------------------------------- */
	#main #qualified-person .showBox .textBox {
		padding: 20px;
	}
  
  /* -------------------------------
      Layout
  ------------------------------- */
	#main #qualified-person .showBox .inner {
		max-width: inherit;
	}
	#main #qualified-person .showBox th {
		width: 100%;
	}
  
  /* -------------------------------
      Caution statement
  ------------------------------- */
	#main #qualified-person .notesTxt {
		font-size: 1.2rem;
	}




  
}