@charset "utf-8";

@font-face {
   /* タイトル太さ */
   font-family: "title";
   src: url("../fonts/SourceHanSansJP-Bold.otf") format("opentype");
 }
 @font-face {
   /* 通常盤 */
   font-family: "main";
   src: url("../fonts/SourceHanSansJP-Medium.otf") format("opentype");
 }

@font-face {
   font-family: "weak";
   src: url("../fonts/SourceHanSansJP-Light.otf") format("opentype");
}

 @media screen and (min-width:860px) {

body{
        width: 100%;
        height: auto;
 }
 
 header{
   width: 100%;
 }

 .font_color1{  
   /* 文字色カスタム 灰色 */
   color: #3B4043;
 }

 .font_color2{
   /* 文字色カスタム 白色 */
   color: white;
 }

 .font_color3{
   /* 文字色カスタム 黒色 */
   color:#3B4043;
 }


 .top_list{
    display: flex;
    height: 10%;
 }
 
 .header_logo {
    width: 15%;
    height: 80%;
    margin: 5px;
    }


 .header_title{
    display: flex;
    width: 42%;
    height: 30%;

 }

 .campany_name {
   text-align: center;
   margin-left: 3%;
   font-size: 300%;
   font-family: "title";
   margin-bottom: auto;
   margin-top: auto;

   }


.campany_name a {
text-decoration: none;
color: #3B4043;
}

 .header_right {
   width: 58%;
   margin-bottom: auto;
   margin-top: auto;
   height: 30%;
   font-size: x-large;

   }

   .header_list {
      display: flex;
      margin: auto;
      font-size: 100%;
      width: 100%;
      }
 
      .header_list ul {
         text-align: center;
         font-family: "main";
         width: 100%;
         padding: 0;
         margin-right: auto;
         margin-left: auto;
         }

         .header_list ul  a {
            text-decoration: none;
            color: #3B4043;
            }

.main_img img{
   width: 100%;

}

.con_ti h1{
   font-family: "title";
   margin-bottom: 0;
   font-size: 3rem;
}

.con_ti p{
   font-family: "weak";
   margin-top: 0;
   font-size: 1rem;
}

main{
   height: auto;
   margin-left:10%;
   margin-right: 10%;
  }

  .con_top{
   display: flex;
   width: 100%;
  }

  .con_top img{
   width: 50%;
  }

  .con_tx{
   font-family: "main";
   font-size: 1rem;
   margin-right: 5%;
  }

  .con_top h1{
   width: 100%;
   text-align: left;
   font-family: "main";
  }

  .con_block3{
   width: 25%;
  }

  .con_main{
   margin-bottom: 5%;
  }

  .con_block {
   display: flex;
   margin-top: 0;
   margin-bottom: 5%;
 }
 
 .con_block1, .con_block2{
   width: 25%;
   margin-right: 14%;
 }
 
 .con_block1 img,.con_block2 img,.con_block3 img {
   display: block; 
   background-color: #F1F8FE;
   width: 60%;
   padding: 20%;
   margin: 0; 
 }
 
 .con_block1 h3 {
   background-color: #00B900;
   font-family: "main";
   margin: 0; 
   padding: 5% 5% 15%;
   line-height: 1.4; 
   font-size: 1.2rem;
 }

 .con_block2 {
   position: relative;
}

.con_block2 a{
   position: absolute;
   top: 0;
   left: 0;
   height:100%;
   width: 100%;
   text-decoration: none;
}

.con_block3 {
   position: relative;
}

.con_block3 a{
   position: absolute;
   top: 0;
   left: 0;
   height:100%;
   width: 100%;
   text-decoration: none;
}

 .con_block2 h3,.con_block3 h3{
   background-color: #05A1BD;
   font-family: "main";
   margin: 0; 
   padding: 5% 5% 15%;
   line-height: 1.4; 
   font-size: 1.2rem;

   

 }


 

footer{
   width: 100%;
   height: 460px;
   font-family: "main";
   text-decoration: none;
}

.footer_top{
   background-color: #00AC62;
   height:373px ;
   display: flex;
}

.campany_info{
   margin-left: 5%;
}

.campany_info_tx{
   display: block;
      margin-top: 5%;
   }


.campany_info_tx a{
   text-decoration: none;
}

.service_info_tx a {
   text-decoration: none;
}

.service_info_tx {
   margin-top: 5%;

}
.contact_info_tx{
   margin-top:5% ;
}


.footer_bottom{
   background-color: #05A1BD;
   height: 88px;
   
}

.campany_info,.service_info,.contact_info{
   width: 28%;
   display: block;

}

 }
/* スマホ用CSS------------------------------------------------------------------------------- */

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

   .font_color1{  
      /* 文字色カスタム 灰色 */
      color: #3B4043;
    }
   
    .font_color2{
      /* 文字色カスタム 白色 */
      color: white;
    }
   
    .font_color3{
      /* 文字色カスタム 黒色 */
      color:black;
    }
   
    .top_list{
      display: block;
      height: 10%;
   }
   .header_logo {
      width: 15%;
      height: 80%;
      margin: 5px;
      }

      .header_title{
         display: flex;
         width: 100%;
         height: 30%;
     
      }
      .campany_name {
         text-align: center;
         margin-left: 3%;
         font-size: 300%;
         font-family: "title";
         margin-bottom: auto;
         margin-top: auto;
      
         }
         .campany_name a {
            text-decoration: none;
            color: #3B4043;
            }

    .header_right {
       width: 100%;
       margin-bottom: auto;
       margin-top: auto;
       height: 30%;
       font-size: x-large;
            
               }
            
   .header_list {
   display: flex;
   margin: auto;
   font-size: 100%;
   width: 100%;
   background-color: #05A1BD;
   font-size: 1rem;
    }
    
   .header_list ul  a {
      text-decoration: none;
      color:white;
      }

      .header_list ul {
         text-align: center;
         font-family: "main";
         width: 100%;
         padding: 0;
         margin-right: auto;
         margin-left: auto;
        
         }
      
     .list2,.list3,.list4{
      border-left: white 3px solid;
     }
     
     .main_img img{
      width: 100%;
     }

   main{
      margin-left: 10%;
      margin-right: 10%;
   }

   .con_ti h1{
      font-family: "title";
      margin-bottom: 0;
      font-size: 1.5rem;
   }
   
   .con_ti p{
      font-family: "weak";
      margin-top: 0;
      font-size: 1rem;
   }
   
   main{
      height: auto;
      margin-left:10%;
      margin-right: 10%;
     }
   
     .con_top{
      display: block;
      width: 100%;
     }
   
     .con_top img{
      width: 100%;
     }
   
     .con_tx{
      font-family: "main";
      font-size: 1rem;
      margin-right: 5%;
     }
   
     .con_top h1{
      width: 100%;
      text-align: left;
      font-family: "main";
     }
   
     .con_block3{
      width: 60%;
      margin-bottom: 5%;
      margin-right: 20%;
      margin-left: 20%;
      margin-top: 5%;
     }
   
     .con_main{
      margin-bottom: 5%;
     }
   
     .con_block {
      display: block;
      margin-top: 0;
      margin-bottom: 5%;
    }
    
    .con_block1, .con_block2{
      width: 60%;
      margin-top: 5%;
      margin-right: 20%;
      margin-left: 20%;
    }
    
    .con_block1 img,.con_block2 img,.con_block3 img {
      display: block; 
      background-color: #F1F8FE;
      width: 60%;
      padding: 20%;
      margin: 0; 
    }
    
    .con_block1 h3 {
      background-color: #00B900;
      font-family: "main";
      margin: 0; 
      padding: 5% 5% 15%;
      line-height: 1.4; 
      font-size: 1.2rem;
    }
   
    .con_block2 {
      position: relative;
   }
   
   .con_block2 a{
      position: absolute;
      top: 0;
      left: 0;
      height:100%;
      width: 100%;
      text-decoration: none;
   }
   
   .con_block3 {
      position: relative;
   }
   
   .con_block3 a{
      position: absolute;
      top: 0;
      left: 0;
      height:100%;
      width: 100%;
      text-decoration: none;
   }
   
    .con_block2 h3,.con_block3 h3{
      background-color: #05A1BD;
      font-family: "main";
      margin: 0; 
      padding: 5% 5% 15%;
      line-height: 1.4; 
      font-size: 1.2rem;
   
      
   
    }





    .footer_top{
      display: block;
      background-color: #00AC62;
      height: 30%;
     }

     .footer_bottom{
      background-color: #05A1BD;
      height: 50px;
     }
   
   .service_info,.campany_info,.contact_info{
      display: flex;
      
   }

   .campany_info_ti{
      margin-left:5% ;
      text-align: left;
      font-size: 1.2rem;
      text-decoration: none;
      font-family:"title";
      width: 45%;

   }
   
   .campany_info_tx{
      margin-left: 10% ;
      text-align: left;
      font-size: 1rem;
      text-decoration: none;
      font-family:"main";
      width: 35%;
   }

   .service_info_ti{
      margin-left:5% ;
      text-align: left;
      font-size: 1rem;
      text-decoration: none;
      font-family:"title";
      width: 45%;

   }
   
   .service_info_tx{
      margin-left: 10% ;
      text-align: left;
      font-size: 1rem;
      text-decoration: none;
      font-family:"main";
      width: 35%;
   }

   .contact_info_ti{
      margin-left:5% ;
      text-align: left;
      font-size: 1rem;
      text-decoration: none;
      font-family:"title";
      width: 45%;

   }
   
   .contact_info_tx{
      margin-left: 10% ;
      text-align: left;
      font-size: 1rem;
      text-decoration: none;
      font-family:"main";
      width: 35%;
   }
  
   

 }