@charset "utf-8";
/* =========================================================
/ecoene/hydraulic/tc_okutadami/report/
========================================================= */
#left {font-size: 18px; line-height: 1.6;}
figure {margin: 0;margin-bottom: 30px; padding: 0;}
.inner-wrapper p { line-height: 1.8; margin-bottom: 1.5rem;}


.topBox {color: #fff; border-radius: 20px; padding: 40px 30px; margin-bottom: 40px; background-image: linear-gradient(120deg, rgba(0, 188, 188, 0.8), rgba(255, 255, 255, 0)), linear-gradient(185deg, rgba(63, 220, 220, 0.8), rgba(255, 255, 255, 0)), linear-gradient(340deg, rgba(0, 153, 26, 0.8), rgba(255, 255, 255, 0));}
.topBox h2 {color: #fff; font-size: 3rem; background: none; font-weight: normal; text-align: center; padding: 0; margin-bottom: 3rem;}
.topBox h2 span {font-size: 40%; display: block;}
.topBox h2::after {background: #fff; border-radius: 3px; content: ""; display: block; height: 6px; margin-top: 0.25em;}
.topBox h3 {position: relative; background: #00a5b4; border: none; padding: 0.5rem 2rem; margin-bottom: 2rem; color: #fff; font-weight: normal; font-size; 2.8rem; margin-left: -50px;}
.topBox h3:before { position: absolute; content: ''; top: 100%; left: 0; border: none; border-bottom: solid 15px transparent;  border-right: solid 20px rgb(220, 189, 16);}/*折り返し部分*/
.topBox ol {border-top: 1px solid #fff;padding-top: 0.5em; margin-bottom: 2em;}
.topBox ol li, .topBox ol li a {color: #fff !important; list-style-type: decimal; list-style-position: inside;}
.topBox ol li{padding-bottom: 0.5em;margin-bottom: 0.5em;border-bottom: 1px solid #fff;}
.topBox ol li ul { margin-top: 0.5em; margin-left: 1em; margin-bottom: 1em;}
.topBox ol li ul li {border-bottom: 0.25em; border: none; font-size: 75%; border-bottom: 1px dotted #fff;list-style-type: disc;}

.sectionWrap h4 {font-size: 2rem; border-left: none; font-weight: normal !important;  position: relative; margin-bottom: 1.5rem; padding: 0.25rem 2rem 0.1rem 1rem; border-left: 10px solid #00bbbb; background-color: #d7eded; width: 45%;}
.sectionWrap h4::before {position: absolute; right: 1px; bottom: 10px; width: 50%; height: 50%; box-shadow: 0 10px 15px #000; transform: rotate(4deg); z-index: -1; content: '';}
.sectionWrap ul {border-top: 1px solid #00bbbb;padding-top: 0.5em; margin-bottom: 2em;}
.sectionWrap ul li {list-style-type: none; list-style-position: inside; padding-bottom: 0.5em;margin-bottom: 0.5em;border-bottom: 1px solid #00bbbb; line-height: 1.5;}

.timeBox {margin-bottom: 6rem;}
.timeBox figure img {border-radius: 2rem; border: #ddd 1px solid; box-sizing: border-box; padding: 1rem; background: #eee;}

.sectionWrap h3 { font-size: 2.4rem; font-weight: normal; padding: 0;line-height: 1.2 !important; background: none;}
.sectionWrap h3 span {background: #0bb; padding: 0.5rem 0 0.25rem; line-height: 1 !important;
display: flex; align-items: center; color: #fff; font-size: 75%; text-transform: uppercase; font-family: 'Fjalla One', sans-serif; width: 7.5rem; margin-bottom: 0.75rem;}

.sectionWrap h3 span::before {margin-left: 10px;
content: ''; display: inline-block; margin-right: 10px; width: 20px; height: 2px; background-color: #fff;}

.inner-wrapper .sectionWrap:last-of-type ul {background: #daf4f2; padding: 2rem; border-top: none; position:relative;padding-bottom: 2.5rem;}
.inner-wrapper .sectionWrap:last-of-type ul li {line-height: 1.8;}
.inner-wrapper .sectionWrap:last-of-type ul::before { height: 0; display: block; position: absolute; right: 0; content: ""; border-bottom: solid 40px #fff; border-left: solid 40px transparent; bottom: 0;}
  
.inner-wrapper .sectionWrap:last-of-type ul::after { height: 0; display: block; position: absolute; right: 0; content: ""; border-top: solid 40px rgba(0, 187, 187, 0.8); border-right: solid 40px transparent; bottom: 0;}


  @media screen and (max-width: 600px){
	  .flexBox {display: block;}
	  .flexBox div {width: 100%;}
	  #left {font-size: 16px;}
	  
	  .topBox {border-radius: 20px; padding: 30px 20px;}
	  .topBox h2 {font-size: 2rem; margin-bottom: 2rem;}
	  .topBox h3 {margin-left: -30px; margin-bottom: 1rem;}
	  .topBox h3::before {border-right: solid 10px rgb(220, 189, 16);}
	  
	  .sectionWrap h3 {font-size: 1.8rem;}
	  .sectionWrap h4 {font-size: 1.25rem;}
	  
	  .timeBox {margin-bottom: 4rem;}
	  .timeBox figure img {padding: 0.5rem; border-radius: 1rem;} 
	  
	  .inner-wrapper .sectionWrap:last-of-type ul {padding: 1rem;}
  }