
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  background-color: #f0f0f0;
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  letter-spacing: 0.05em;
}

/* .automation-section {
}  */

.section-header {
background-image: url('./jidoka_2.jpg'); 
width: 100%;
height: 400px;
display: flex;
justify-content: center;
align-items: center;
background-repeat: no-repeat;
background-size: 140% auto;
background-position: 100% 56%;
}

.section-title {
color: white;
font-size: 36px;
font-weight: bold;
margin-top: 24px;
}

.content-Area {
  background: white;
  margin: -24px auto 0 auto; 
  padding: 24px 24px ;
  display: flex;
  flex-wrap: wrap; 
  position: relative;
  max-width: 1200px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.05); 
  overflow: hidden;
}


.text-content {
  padding: 8%;
  width: 72%;
  margin-left: -40px;
  min-width: 240px; 
  overflow-wrap: break-word;
}


.text-content h3 {
  /* margin-top: 10px; */
  font-size: 24px;
  margin-bottom: 8px;
  color: rgb(14, 74, 235);
}

.text-content p {
  font-size: 16px;
  margin-top: 16px;
  line-height: 1.8;
}

.text-content hr {
  margin: 24px 0;
  border: none;
  border-top: 1px solid rgb(133, 133, 133);

}

.text-content h4 {
  font-size: 16px;
  margin-bottom: 8px;
  color: rgb(14, 74, 235);
}

.text-content ul {
  font-size: 16px;
  padding-left: 16px;
  list-style-position: inside;
}

.list li::marker {
  font-size: 0.7em;
}

.read-more-btn {
  margin-top: 30px;
  padding: 16px 40px;
  background: #ddd;
  border: none;
  cursor: pointer;
  font-size: 16px;
  color: #555;
}

.read-more-btn:hover {
    background-color: #3e7eff;
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(62, 126, 255, 0.3);
}

.shape-box {
    background-image: url('jidoka_image_1.png');
    position: absolute;
    top: 128px;  
    right: 16px;
    width: 34%;
    height: 392px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    display: flex;
    overflow: hidden;
    background-color: rgb(68, 135, 236);
  }



  .shape-box2 {
   background-image: url('jidoka_image_2.png');
    position: absolute;
    top: 128px;  
    right: 16px;
    width: 34%;
    height: 400px;
    display: flex;
    overflow: hidden;
    background-color: rgb(68, 135, 236);
    background-size: cover; 
    background-repeat: no-repeat;
    /* background-size: 101% auto; */
    background-position: 100% center;
   }

   .shape-box3 {
     background-image: url('jidoka_image_3.png');
    position: absolute;
    top: 88px;  
    right: 16px;
    width: 34%;
    height: 364px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    display: flex;
    overflow: hidden;
    background-color: rgb(68, 135, 236);
   }

 
  

