@charset "UTF-8";
/* ----------------
 * コンテンツエリア
 * ---------------- */

.contents_area .inner {
    width: 100%;
    margin: 4rem 0 8rem;
    padding:20px;
}


@media screen and (min-width: 768px) {
  .contents_area .inner {
      width: 980px;
      margin: 4rem auto 8rem;
  }
}

.contents_area h4{
    font-size: 1.8rem;
    margin: 2rem auto;
}


@media screen and (min-width: 768px) {
.contents_area h4{
    font-size: 1.8rem;
    margin: 2rem auto 1rem;
}
}
.contents_area .company-contents-title{
    font-family: "Jost", sans-serif;
    font-size: 4rem;
    color: #ECF1ED;
    line-height: .7;
    text-align: right;
}

@media screen and (min-width: 768px) {
.contents_area .company-contents-title{
    font-family: "Jost", sans-serif;
    font-size: 8.5rem;
    color: #ECF1ED;
    line-height: .7;
    text-align: right;
}
}

/* table01 */

.contents_area .table01 {
    width: 100%;
    margin:auto;
}

.contents_area .table01 tr {
    border-top: 1px solid #ECF1ED;
    border-bottom: 1px solid #ECF1ED;
}

@media screen and (max-width: 767px) {
.contents_area .table01 th,
.table01 td {
    padding: 20px 10px 10px;
    border: none;
    text-align: left;
    display: block;
}
}

@media screen and (min-width: 768px) {
.contents_area .table01 th,
.table01 td {
  padding: 24px 10px;
  border: none;
    text-align: left;

}
}
.contents_area .table01 th {
  width: 100%;
    font-size: 1.8rem;
    color: #00A84D;
    
}

@media screen and (min-width: 768px) {
.contents_area .table01 th {
  width: 30%;
    font-size: 3rem;
    color: #00A84D;
    
}
}


/* ----------------
 * 代表挨拶
 * ---------------- */
.message-area .inner {
    width: 100%;
    margin: 0rem 0 8rem;
    padding:0 20px;
}

@media screen and (min-width: 768px) {
  .message-area .inner {
      width: 980px;
      margin: 4rem auto 8rem;
  }
}

.message-box {
    background-color: #ffffff;
    border-radius: 20px;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
    padding: 20px;
    width: 100%;
}


@media screen and (min-width: 768px) {
.message-box {
    background-color: #ffffff;
    border-radius: 20px;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
    padding: 30px;
}
}


.message-area .message-box .flexbox {
    display: block;
    padding: 10px;
    width: 100%;
    text-align: center;
}

@media screen and (min-width: 768px) {
.message-area .message-box .flexbox {
    display: flex;
    padding: 0px;
    text-align: left;
}
}

.flexbox-img{
   width: 100%;
}

@media screen and (min-width: 768px) {
    .flexbox-img{
   width: 262px;
}
}

.message-txt{
    width: 100%;
    text-align: left;
}

@media screen and (min-width: 768px) {
.message-txt{
    width: 560px;
}
}
.message-title{
    color: #00A84D;
    padding:0 20px;
    font-size: 2.5rem;
}

@media screen and (min-width: 768px) {
.message-title{
    color: #00A84D;
    padding:0 20px;
    font-size: 3rem;
}
}

.message-area .message-box .flexbox>div {
    width: 100%;
    padding: 10px;
}

@media screen and (min-width: 768px) {
.message-area .message-box .flexbox>div {
    width: auto;
    padding: 10px;
    margin: 0 1rem;
    
}
}

.message-area  .company-contents-title{
    font-family: "Jost", sans-serif;
    font-size: 4.5rem;
    color: #ECF1ED;
    line-height: .7;
    text-align: right;
}

@media screen and (min-width: 768px) {
.message-area  .company-contents-title{
    font-family: "Jost", sans-serif;
    font-size: 8.5rem;
    color: #ECF1ED;
    line-height: .7;
    text-align: right;
}
}

/* ----------------
 * 会社概要
 * ---------------- */
.summary_area {
    width: 100%;
    margin:0rem 0rem 8rem;
    padding:0 20px;
}

@media screen and (min-width: 768px) {
    .summary_area {
        width: 100%;
        margin: 0rem auto 8rem;
}
}

@media screen and (min-width: 1201px) {
    .summary_area {
        width: 980px;
        margin: 8rem auto;
}
}

.summary-title{
    color: #00A84D;
    padding:0;
    font-size: 2.5rem;
    margin: 0;
}

@media screen and (min-width: 768px) {
.summary-title{
    color: #00A84D;
    font-size: 3rem;
}
}

.summary_area  .flex-box {
    display: block;
    padding: 0px;
    width: 100%;
}

.summary_area  .flex-box>div {
    width: 100%;
    padding: 10px;
}

@media screen and (min-width: 768px) {
.summary_area .flex-box>div {
    padding: 0;
}

.summary_area .flex-box div + div {
    margin-top: 30px;
}
} 

.summary_area .flex-box .company-contents-title{
    font-family: "Jost", sans-serif;
    font-size: 4.5rem;
    color: #ECF1ED;
    line-height: .65;
    text-align: right;

}


@media screen and (min-width: 768px) {    
.summary_area .flex-box .company-contents-title{
    font-family: "Jost", sans-serif;
    font-size: 8.5rem;
    color: #ECF1ED;
    line-height: .65;
    text-align: right;

}
 } 
    
.summary_area .flex-box .summary-txt-box{
    width: 100%;
    margin-left:0rem;
    margin-top: 3rem
}
    
@media screen and (min-width: 768px) {     
.summary_area .flex-box .summary-txt-box{
    margin-top: 1rem
}
 }   
/* table01 */

.summary_area .summary_table01 {
    width: 560px;
    margin: .2rem auto;
}
    
@media screen and (min-width: 1201px) {
    .summary_area .summary_table01 {
    width: 100%;
    margin: .2rem auto;
}
}


.summary_area .summary_table01 tr {
  border-top: 1px solid #b5b1b1;

}

.summary_area .summary_table01 th,
.summary_table01 td {
    padding: 24px 20px;
    border: none;
    text-align: left;
}

.summary_area .summary_table01 th {
    width: 25%;
    font-size: 1.5rem;
    border-top: 2px solid #00A84D;

}

/* sp */
@media only screen and (max-width: 787px) {
    
.summary_area .summary_table01 {
    width: 100%;
    margin: .2rem auto;
}
  
.summary_area .summary_table01 th,
.summary_table01 td {
    width: 100%;
    display: block;
    text-align: left;
    padding: 24px 20px;
  }
.summary_area .summary_table01 tr {
  border-top: 0px solid #b5b1b1;

}
  .summary_area .summary_table01 th {
    width: 100%;
    background-color: #eeeeee;  
      text-align: left;
      border-top: 0px;
  }

  .summary_area .summary_table01 td {
    padding-top: 20px;
     text-align: left; 
  }
}

/* ----------------
 * 組織図
 * ---------------- */
    
.organization_area .inner {
    width: 100%;
    margin: 0rem 0 8rem;
    padding:0 20px;
    position: relative;
    top: 0;
}


@media screen and (min-width: 768px) {
  .organization_area .inner {
      width: 980px;
      margin: 0 auto 8rem;
      position: relative;
  }
}    
 
.organization_area .company-contents-title{
    font-family: "Jost", sans-serif;
    font-size: 4rem;
    color: #ECF1ED;
    line-height: .7;
    text-align: right;
}

@media screen and (min-width: 768px) {
.organization_area .company-contents-title{
    font-family: "Jost", sans-serif;
    font-size: 8.5rem;
    color: #ECF1ED;
    line-height: .7;
    text-align: right;
}
}


.organization-title {
    color: #00A84D;
    font-size: 2.5rem;
    margin:0;
    position: absolute;
    top: -2%;
}
    
@media screen and (min-width: 768px) {    
.organization-title {
    color: #00A84D;
    font-size: 3rem;
    margin:0;
    position: absolute;
    top: 1%;
}
}
    
.organization_img {
    background-color: #ECF1ED;
    padding: 20px;
    border-radius: 20px;
    text-align: center
}

@media screen and (min-width: 768px) {    
.organization_img {
    padding: 40px 20px;
}
}
    

/* ----------------
 * 主要取引先
 * ---------------- */
    
.client_area .inner {
    width: 100%;
    margin: 4rem auto 8rem;
    padding:0 20px;
    position: relative;
}


@media screen and (min-width: 768px) {
.client_area .inner {
      width: 980px;
      margin: 4rem auto 8rem;
  }
} 


.client_area .company-contents-title{
    font-family: "Jost", sans-serif;
    font-size: 4rem;
    color: #ECF1ED;
    line-height: .7;
    text-align: right;
}

@media screen and (min-width: 768px) {
.client_area .company-contents-title{
    font-family: "Jost", sans-serif;
    font-size: 8.5rem;
    color: #ECF1ED;
    line-height: .7;
    text-align: right;
}
}


.client_area .inner .client_title {
    color: #00A84D;
    font-size: 2.5rem;
    position: absolute;
    top: 0%;
}
    
@media screen and (min-width: 768px) {    
.client_area .inner .client_title {
    color: #00A84D;
    font-size: 3rem;
    margin:0;
    position: absolute;
    top: 5%;
}
}
    
.client_area .flex-box {
    display: block;
    padding: 0px;
    width: 100%;
}

@media screen and (min-width: 768px) {
.client_area .flex-box {
    display: flex;
    padding: 0px;
    width: 100%;
    margin: 5rem 0;
}
}

.client_area .flex-box>div {
    width: 100%;
    padding: 10px;
    margin:2rem 0 ;
}

@media screen and (min-width: 768px) {
.client_area .flex-box>div {
    width: 33.333%;
    padding: 10px 30px 10px 0;
    margin: 0 ;
    text-align: left;
    
}
}


.client_area .client_table {
  border-collapse: collapse;
  width: 100%;
  max-width: 100%;
}

.client_area .client_table th, .client_table td {
    padding: 1em;
    border-top: 1px solid #c1c7c6;
    border-bottom: 1px solid #c1c7c6;
    text-align: left;
    vertical-align: middle
}

.client_area .client_table th {
  text-align: left;
  width: 42%;
  min-width: 4em;
  position: relative;
}


@media screen and (min-width: 768px) {
.client_area .client_table th {
  text-align: left;
  width: 20%;
  min-width: 4em;
  position: relative;
}
}

.client_area .client_table th::after {
  content: '';
  background-color: #c1c7c6;
  position: absolute;
  top: 50%;
  left: 100%;
  transform: translateY(-50%);
  width: 1px;
  height: 80%;
}


@media screen and (min-width: 768px) {
.client_area .client_table th::after {
  content: '';
  background-color: #c1c7c6;
  position: absolute;
  top: 50%;
  left: 100%;
  transform: translateY(-50%);
  width: 1px;
  height: 60%;
}
}

.client_area .client_note {
  text-align: right;
  margin-top: 10px;
}





/* ----------------
 * 資格一覧
 * ---------------- */
    
.qualification_area .inner {
    width: 100%;
    margin: 4rem auto 8rem;
    padding:0 20px;
    position: relative;
}


@media screen and (min-width: 768px) {
.qualification_area .inner {
      width: 980px;
      margin: 4rem auto 8rem;
  }
} 


.qualification_area .company-contents-title{
    font-family: "Jost", sans-serif;
    font-size: 4rem;
    color: #ECF1ED;
    line-height: .7;
    text-align: right;
}

@media screen and (min-width: 768px) {
.qualification_area .company-contents-title{
    font-family: "Jost", sans-serif;
    font-size: 8.5rem;
    color: #ECF1ED;
    line-height: .7;
    text-align: right;
}
}


.qualification_area .inner .qualification_title {
    color: #00A84D;
    font-size: 2.5rem;
    margin:0;
    position: absolute;
    top: 0%;
}
    
@media screen and (min-width: 768px) {    
.qualification_area .inner .qualification_title {
    color: #00A84D;
    font-size: 3rem;
    margin:0;
    position: absolute;
    top: 5%;
}
}

.qualification_txt { 
    margin-top: 5rem;
}


.company-content .inner {
    width: 100%;
    margin: 4rem auto 8rem;
    padding:0 20px;
    position: relative;
}


@media screen and (min-width: 768px) {
.company-content .inner {
      width: 980px;
      margin: 4rem auto 8rem;
  }
} 


.company-content .company-content_subtitle{
    font-family: "Jost", sans-serif;
    font-size: 4rem;
    color: #ECF1ED;
    line-height: .7;
    text-align: right;
}

@media screen and (min-width: 768px) {
.company-content .company-content_subtitle{
    font-family: "Jost", sans-serif;
    font-size: 8.5rem;
    color: #ECF1ED;
    line-height: .7;
    text-align: right;
}
}


.company-content .company-content_title {
    color: #00A84D;
    font-size: 2.5rem;
    margin:0;
    position: absolute;
    top: 0%;
}
    
@media screen and (min-width: 768px) {    
.company-content .company-content_title {
    color: #00A84D;
    font-size: 3rem;
    margin:0;
    position: absolute;
    top: 5%;
}
}

.company-content .company-content_item {
    display: grid;
    grid-template-columns: 70% 1fr;
    gap: 1rem;
    margin-top: 3rem;    
}

@media screen and (min-width: 768px) {
    .company-content .company-content_item {
        max-width: 30rem; 
    }
}

.company-content .company-content_item dd {
    text-align: right;    
}

.company-content .company-content_list {
    margin-top: 3rem;
    display: grid;
    gap: 1rem;
}

@media screen and (min-width: 768px) {
    .company-content .company-content_list {
        grid-template-columns: repeat(3, 1fr);
    }
}