@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Kiwi+Maru:wght@300;400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&family=Noto+Serif+JP&display=swap');
@import url('https://fonts.googleapis.com/css2? family= Zen+Maru+Gothic:wght@300;400;500 & display=swap');

.main_txt {
    color: #4d4d4d;
    padding-bottom: 0px;
    font-size: 24px;
    font-weight: bold;
    line-height: 45px;
}

span.pink {
    color: #ff3535;
}

.article {
    margin: 60px 0px 60px 0px;
    /* font-size: 24px; */
    font-weight: bold;
    color: #ffffff;
    padding: 2px 15px;
    background: transparent;
    border-left: solid 4px #89c5b2;
    background: linear-gradient(to right, #007f5abf, #95bd98);
    padding: 10px 15px 10px 15px;
}

.interviewer {
    color: #d03c3c;
}

.l_interviewer {
    padding: 30px 30px;
    border: 2px solid pink;
    border-radius: 10px;
    margin-top: 50px;
}

img.interviewer_img {
    width: 100px;
    padding-top: 50px;
}

img.point {
    width: 70%;
    padding-bottom: 20px;
}

.interviewer_name {
    padding-bottom: 0px;
}

.main_column {
	padding: 60px 0px 0px 0px;
	text-align: center;
}

.sub_title {
    /* border:1px solid #00401a; */
    /* padding:20px 20px; */
    font-size: 20px;
    margin-bottom:80px;
    text-align: left;
    color: #353535;
}

@media screen and (max-width: 520px) {
  .l_interviewer {
      padding: 20px 10px;
      border: 2px solid pink;
      border-radius: 10px;
      margin-top: 50px;
  }

  img.interviewer_img {
      width: 100px;
      padding-top: 50px;
  }


  img.point {
      width: 100%;
      padding-bottom: 10px;
  }

  .interviewer_name {
      padding-bottom: 0px;
  }

  .sub_title {
    font-size: 16px;
    margin-bottom:70px;
}

.article {
  margin: 60px 0px 30px 0px;
}

}

/*-------------------------------------------------------*/
/* gridレイアウト */
/*-------------------------------------------------------*/

* {
    margin: 0;
    padding: 0;
  }
  :root{
    --container-w: 1100px;
  }
  img{
    max-width:100%;
    height:auto;
    vertical-align:bottom;
  }
  .c-container {
    max-width: var(--container-w);
    margin-inline: auto;
    padding-inline: 32px;
    box-sizing: content-box;
  }
  
  .c-image-text {
    display: grid;
    align-items: center;
    grid-template:
      "image gutter text margin"  auto / 
      calc(600/1440 * 100%) 16px 1fr max(calc((100% - var(--container-w))/2), 32px );
  }
  .c-image-text--reverse{
    grid-template:
      "margin text gutter image"  auto / 
      max(calc((100% - var(--container-w))/2), 32px ) 1fr  16px  calc(600/1440 * 100%);
  }
  
  .c-image-text__image{
    grid-area:image;
  }
  
  .c-image-text__image img{
    height:300px;
    width:100%;
    object-fit:cover;
  }
  
  .c-image-text__text{
    grid-area:text;
  }
  
  .c-image-text02 {
    display: grid;
    align-items: center;
    grid-template:
      "image text margin"  auto / 
      calc(600/1440 * 100%) 1fr max((100% - var(--container-w))/2, 0px );
      padding-bottom: 120px;
  }
  .c-image-text02--reverse{
    grid-template:
      "margin text image"  auto / 
      max((100% - var(--container-w))/2, 0px ) 1fr calc(600/1440 * 100%);
  }

  .c-image-text02__image{
    grid-area:image;
  }

  .c-image-text02__image img{
    height:300px;
    width:100%;
    object-fit:cover;
  }

  .c-image-text02_no_grid {
    display: block;
    align-items: center;
    grid-template:
      "image text margin"  auto / 
      calc(600/1440 * 100%) 1fr max((100% - var(--container-w))/2, 0px );
      padding-bottom: 120px;
  }

  .c-image-text02__image_no_grid img{
    width:70%;
    object-fit:cover;
  }

  .c-image-text02__image_no_grid {
    grid-area: image;
    text-align: center;
    padding-top:20px;
}

  .c-image-text02__text{
    grid-area:text;
    padding:20px 20px;
    /* margin-left:-100px; */
    /* background:#ffffffc7; */
  }
  
  .c-image-text02--reverse .c-image-text02__text{
    padding:20px 20px;
    margin-left:auto;
    /* margin-right:-100px; */
  }

  @media screen and (max-width: 790px) {
    .c-image-text02 {
      display: block;
      align-items: center;
      grid-template: "image text margin" auto / calc(600/1440 * 100%) 1fr max((100% - var(--container-w))/2, 0px );
      padding-bottom: 40px;
  }

  .c-image-text02__image img{
    height:300px;
    width:100%;
    object-fit:cover;
    object-position: 50% 20%;
  }

  .c-image-text02__image_no_grid img {
    width: 100%;
    object-fit: cover;
}

.c-image-text02__text{
  grid-area:text;
  padding:20px 0px;
  /* margin-left:-100px; */
  /* background:#ffffffc7; */
}

.c-image-text02--reverse .c-image-text02__text{
  padding:20px 0px;
  margin-left:auto;
  /* margin-right:-100px; */
}

.c-image-text02__image_no_grid {
  grid-area: image;
  text-align: center;
  padding-top:0px;
}

.c-image-text02_no_grid {
  display: block;
  align-items: center;
  grid-template:
    "image text margin"  auto / 
    calc(600/1440 * 100%) 1fr max((100% - var(--container-w))/2, 0px );
    padding-bottom: 40px;
}
  }

/*-------------------------------------------------------*/
/* sub_point */
/*-------------------------------------------------------*/

.sub_point {
  border: 2px dashed #62a383;
  padding: 15px 15px;
  margin-top:40px
}

img.i_sub_point {
  width: 36px;
  padding-right: 15px;
}

/*-------------------------------------------------------*/
/* map */
/*-------------------------------------------------------*/

.l_main_map {
  text-align: center;
}

.map {
  max-width: 320px;
  margin: 0 auto;
}

img.map_img {
  width: 90%;
}

.l_map {
  display: inline-flex;
  flex-direction: row;
  /* border: 2px dashed  #84a888;
  padding:20px 20px;
  border-width:1px; */
  /* background-color: #c7d5c5; */
  padding:15px 15px;
  margin-top: 100px;
}

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

  .l_map {
    display: block;
    flex-direction: row-reverse;
    margin: 100px 0px 30px 0px;
  }

  .map {
    max-width: 280px;
    margin: 0 auto;
    padding-bottom: 15px;
  }

  img.map_img {
    width: 100%;
  }
}

a.y_link {
    color: #000000;
}

.l_youtube {
    display: flex;
    align-items: center; /* 縦方向に中央寄せ */
	padding: 40px 0px 0px 0px;
  border-top: 1px solid #007f5abf;
  border-bottom: 1px solid #007f5abf;
  padding: 25px 0px;
  flex-direction: column;
  margin: 10px 0px 70px 0px;
}

@media screen and (max-width: 520px) {
.l_youtube {
  padding: 15px 0px;
  margin: 0px 0px 60px 0px;
}
}