/*
* Contact
*/


/* ------------------------------------------------------------------------- */

@media screen and (min-width: 751px) {
  /* @media screen
------------------------------------------------------------------------- */

  #common_content_main{
    #common_ttl{
      margin-top: 80px;
      padding-top: 0 !important;
    }
    .company_top_main_image{
      width: 80%;
      max-width: 1500px;
      margin: 0 auto 120px;
    }
    .company_top_section_01{
      margin: 80px 0 120px;
      .heading_lv1{
        margin-bottom: 100px;
      }
    }
    .company_top_section_02{
      margin: 80px 0 120px;
      background-color: #ECF7EB;
      padding: 80px 0;
      
      .heading_lv1{
        margin-bottom: 100px;
      }
      /* .group_archive_content{
        display: flex;
        flex-direction: column;
        gap: 64px;
        .group_archive_content__item{
          display: flex;
          background-color: #fff;
          padding: 40px 74px;
          
          .group_archive__desc{
            display: flex;
            gap: 40px;
            position: relative;
            color: #2b2b2b;
            width: 835px;
            
            .circle_arrow{
              position: absolute;
              right: 0;
              bottom: 0;
            }

            .group_archive__desc__img{
              width: 190px;
              flex-shrink: 0;
            }
            .group_archive__desc__logo{
              width: 150px;
              flex-shrink: 0;
              display: flex;
              align-items: center;
              
            }
            .group_archive__desc__text{
              display: flex;
              flex-direction: column;
              justify-content: center;
              h3{
                font-size: 16px;
                font-weight: bold;
                line-height: 1.5;
                text-align: left;

              }
              p{
                font-size: 16px;
                line-height: 1.5;
                margin-top: 10px;
              }
              a{
                color: #00A867;
                font-size: 14px;
                font-weight: bold;
                margin-top: 10px;
                transition: .2s;
                &:hover{
                  opacity: 0.8;
                }
                i{
                  font-size: 12px;
                  position: relative;
                  top: 0;
                  right: -10px;
                  &:before{
                      color: #00A867;
                  }
                  
                }
              }
            }
          }
          a.group_archive__desc{
            transition: .2s;
            &:hover{
              opacity: 0.8;
            }
          }
          
          .group_archive__service_logo{
            display: flex;
            flex-direction: column;
            justify-content: center;
            flex-shrink: 0;
            gap: 24px;
            margin-left: 48px;
            padding-left: 48px;
            border-left: 2px solid #D9D9D9;
            
            .service_logo{
              transition: .2s;
              &:hover{
                opacity: 0.8;
              }
            }
          }
        }
      } */
    }
    .company_top_section_03{
      margin: 80px 0 120px;
      .heading_lv1{
        margin-bottom: 64px;
      }
    }
    .company_top_section_04{
      margin: 80px 0 120px;
      .heading_lv1{
        margin-bottom: 64px;
      }
      .history_flow {
        position: relative;
        display: block;
        margin: 0 auto;
        max-width: 768px;
        &:before{
          content: "";
          position: absolute;
          top: 15px;
          left: 0;
          width: 0px;
          height: 100%;
          border-left: 2px solid #32bc48;
        }
        li{
          position: relative;
          padding-left: 30px;
          &:not(:last-child){
            margin-bottom: 32px;
          }
          &:before{
            content: "";
            position: absolute;
            top: 4px ;
            left: -6px ;
            width: 16px;
            height: 16px;
            background-color: #44AF35;
            border-radius: 50%;
          }
          strong{
            color: #2b2b2b;
            font-size: 16px;
          }
          p{
            margin-top: 5px;
            font-size: 16px;
          }
        }
      }

    }
    
  }
  

}
/* ------------------------------------------------------------------------- */
/* 752pxから1000pxの時 */
/* ------------------------------------------------------------------------- */
@media screen and (min-width: 752px) and (max-width: 1000px){
  .group_archive_content{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    .group_archive_content__item{
      display: flex;
      flex-direction: column;
      background-color: #fff;
      border-radius: 8px;
      overflow: hidden;
      padding: 0 24px 24px;
      gap: 20px;
      .group_archive__desc{
        display: flex;
        flex-direction: column;
        position: relative;
        color: #2b2b2b;
        .circle_arrow{
          position: relative;
          margin: 10px 0 0 auto;
        }

        .group_archive__desc__img{
          width:calc(100% + 48px);
          margin: 0 -24px 24px;
          border-top-left-radius: 8px;
          border-top-right-radius: 8px;
          img{
            width: 100%;
          }
        }
        .group_archive__desc__logo{
          width: 115px;
          margin: 0 auto 24px;
          display: flex;
          align-items: center;
          
        }
        .group_archive__desc__text{
          display: flex;
          flex-direction: column;
          justify-content: center;
          h3{
            font-size: 16px;
            font-weight: bold;
            line-height: 1.5;
            text-align: center;

          }
          p{
            font-size: 14px;
            line-height: 1.5;
            margin-top: 16px;
          }
          a{
            color: #00A867;
            font-size: 14px;
            font-weight: bold;
            margin-top: 10px;
            i{
              font-size: 10px;
              position: relative;
              top: 0;
              right: -10px;
              &:before{
                  color: #00A867;
              }
            }
          }
        }
      }
      
      .group_archive__service_logo{
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 16px;
        margin-top: auto;
        padding-top: 20px;
        border-top: 2px solid #D9D9D9;
        
        .service_logo{
          width: 100px;
        }
      }
    }
  }

}


/* ------------------------------------------------------------------------- */
/* 1001px以上の時 */
/* ------------------------------------------------------------------------- */
@media screen and (min-width: 1001px){
  .group_archive_content{
    display: flex;
    flex-direction: column;
    gap: 24px;
    .group_archive_content__item{
      display: flex;
      background-color: #fff;
      padding: 40px;
      border-radius: 8px;
      
      .group_archive__desc{
        display: flex;
        gap: 40px;
        position: relative;
        color: #2b2b2b;
        
        .circle_arrow{
          margin-left: auto;
          margin-top: 10px;
        }

        .group_archive__desc__img{
          width: 190px;
          flex-shrink: 0;
          display: flex;
          align-items: center;
        }
        .group_archive__desc__logo{
          width: 150px;
          flex-shrink: 0;
          display: flex;
          align-items: center;
          
        }
        .group_archive__desc__text{
          display: flex;
          flex-direction: column;
          justify-content: center;
          h3{
            font-size: 16px;
            font-weight: bold;
            line-height: 1.5;
            text-align: left;

          }
          p{
            font-size: 16px;
            line-height: 1.5;
            margin-top: 10px;
          }
          a{
            color: #00A867;
            font-size: 14px;
            font-weight: bold;
            margin-top: 10px;
            transition: 0.3s linear;

            &:hover{
              filter: brightness(0.7);
            }
            i{
              font-size: 12px;
              position: relative;
              top: 0;
              right: -10px;
              &:before{
                  color: #00A867;
              }
              
            }
          }
        }
      }
      a.group_archive__desc{
        transition: .2s;
        &:hover{
          opacity: 0.8;
        }
      }
      
      .group_archive__service_logo{
        display: flex;
        flex-direction: column;
        justify-content: center;
        flex-shrink: 0;
        gap: 24px;
        margin-left: 48px;
        padding-left: 48px;
        border-left: 2px solid #D9D9D9;
        
        .service_logo{
          transition: .2s;
          &:hover{
            opacity: 0.8;
          }
        }
      }
    }
  }

}


/* ------------------------------------------------------------------------- */

@media screen and (max-width: 750px) {
  /* @media screen
------------------------------------------------------------------------- */
  .content{
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  #common_content_main{
    #common_ttl{
      margin-top: 48px;
      padding-top: 0 !important;
    }
    .company_top_main_image{
      width: calc(100% - 40px);
      margin: 0 auto 80px;
    }
    .company_top_section_01{
      margin: 80px 0 80px;
      .heading_lv1{
        margin-bottom: 64px;
      }
    }
    .company_top_section_02{
      margin: 80px 0 80px;
      background-color: #ECF7EB;
      padding: 80px 0;
      .heading_lv1{
        margin-bottom: 64px;
        
      }
      .group_archive_content{
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 40px;
        .group_archive_content__item{
          display: flex;
          flex-direction: column;
          background-color: #fff;
          border-radius: 8px;
          overflow: hidden;
          padding: 0 24px 24px;
          .group_archive__desc{
            display: flex;
            flex-direction: column;
            position: relative;
            color: #2b2b2b;
            max-width: 350px;
            .circle_arrow{
              position: relative;
              margin: 10px 0 0 auto;
            }

            .group_archive__desc__img{
              width:calc(100% + 48px);
              margin: 0 -24px 24px;
              border-top-left-radius: 8px;
              border-top-right-radius: 8px;
              img{
                width: 100%;
              }
            }
            .group_archive__desc__logo{
              width: 115px;
              margin: 0 auto 24px;
              display: flex;
              align-items: center;
              
            }
            .group_archive__desc__text{
              display: flex;
              flex-direction: column;
              justify-content: center;
              h3{
                font-size: 16px;
                font-weight: bold;
                line-height: 1.5;
                text-align: center;

              }
              p{
                font-size: 14px;
                line-height: 1.5;
                margin-top: 16px;
              }
              a{
                color: #00A867;
                font-size: 14px;
                font-weight: bold;
                margin-top: 10px;
                i{
                  font-size: 10px;
                  position: relative;
                  top: 0;
                  right: -10px;
                  &:before{
                      color: #00A867;
                  }
                }
              }
            }
          }
          
          .group_archive__service_logo{
            display: flex;
            justify-content: center;
            flex-wrap: wrap;
            gap: 16px;
            margin-top: 20px;
            padding-top: 20px;
            border-top: 2px solid #D9D9D9;
            
            .service_logo{
              width: 100px;
            }
          }
        }
      }
    }
    .company_top_section_03{
      margin: 80px 0 120px;
      .heading_lv1{
        margin-bottom: 64px;
      }
    }
    .company_top_section_04{
      margin: 80px 0 120px;
      .heading_lv1{
        margin-bottom: 64px;
      }
      .history_flow {
        position: relative;
        display: block;
        margin: 0 auto;
        max-width: 768px;
        &:before{
          content: "";
          position: absolute;
          top: 15px;
          left: 0;
          width: 0px;
          height: 100%;
          border-left: 2px solid #32bc48;
        }
        li{
          position: relative;
          padding-left: 30px;
          &:not(:last-child){
            margin-bottom: 16px;
          }
          &:before{
            content: "";
            position: absolute;
            top: 3px ;
            left: -6px;
            width: 15px;
            height: 15px;
            background-color: #44AF35;
            border-radius: 50%;
          }
          strong{
            color: #2b2b2b;
            font-size: 14px;
          }
          p{
            margin-top: 5px;
            font-size: 14px;
          }
        }
      }

    }
    
  }
}



/* クリエイトリンク */
.shinkocreate__commerce a {
  color: #38CA69;
  text-underline-offset: 3px;
  text-decoration: underline;
}
.shinkocreate__commerce a:hover {
  color: #23B553;
  text-decoration: none;
}

/* 営業拠点マップ */
.basemap {
  display: block;
  width: 100%;
}
@media screen and (min-width: 786px) {
  .basemap {
      max-width: 670px;
      margin: 0 auto;
  }
}