@charset "UTF-8";

/* seasonsの設定 */

.main_interview {
  background-image: url(../img/interview/interview_1.png);
  background-repeat: repeat-y;
  background-size: contain;
  background-position: center center;
  background-color: #fff;
}

@media screen and (min-width: 768px) {
  .none_pc {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .none_phone {
    display: none;
  }

  .main_interview {
    background-image: url(../img/interview/interview_s_1.png);
    background-repeat: repeat-y;
    background-size: contain;
    background-position: top center;
    background-color: #fff;
  }
}

.Text_box {
  width: 100%;
  position: relative;
}

/* ---------------------------------------------
移住者の声ページ情報
---------------------------------------------*/
.main_interview #about {
  width: 100%;
  padding-top: 200px;
}

.main_interview .container {
  width: 100%;
  margin-bottom: 5.5vw;
  position: relative;
}

.main_interview .container:last-of-type {
  margin-bottom: 20vw;
}

.main_interview main .Text_box {
  width: 70%;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .main_interview .container {
    width: 100%;
    margin-bottom: 10vw;
    position: relative;
  }

  .main_interview #about {
    width: 100%;
    padding-top: 80px;
  }

  #about .img1 {
    width: 46.41%;
    margin: 0 auto 50px;
  }

  #about .img2 {
    display: none;
  }

  .main_interview .container:last-of-type {
    margin-bottom: 20vw;
  }

  .main_interview main .Text_box {
    width: 82.65%;
    margin: -18px auto 5vw;
  }
}

/* ---------------------------------------------
.container1
---------------------------------------------*/
.main_interview .container1 .name {
  width: 56.25%;
  margin: 3vw auto 0vw;
}

.main_interview .btn_1 {
  width: 16.38%;
  margin: 0 auto;
  position: relative;
  transition: 0.2s;
}

.main_interview .btn_1:hover {
  filter: brightness(85%);
}

.main_interview .btn_1 img {
  z-index: 1;
}

.main_interview .btn_1 .btn_1_2 {
  display: none;
}

.main_interview .btn_1::after {
  content: ' ';
  width: 100%;
  height: 100%;
  background-image: url(../img/Immigrant/body/jump_l_b.png);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 6px;
  left: -6px;
  z-index: -1;
  opacity: 1;
  transition: 0.2s;
}

.main_interview .btn_1:hover::after {
  content: ' ';
  opacity: 0;
}

@media screen and (max-width: 767px) {
  .main_interview .container1 .name {
    width: 72%;
    margin: 0 auto 15vw;
  }

  .main_interview .btn_1 .btn_1_1 {
    display: none;
  }

  .main_interview .btn_1 .btn_1_2 {
    display: inline;
  }

  .main_interview .btn_1 {
    width: 40%;
    margin: 0 auto;
    position: relative;
  }
}
/* ---------------------------------------------
#container_textの設定
---------------------------------------------*/
.main_interview .container_text1,
.main_interview .container_text2,
.main_interview .container_text3,
.main_interview .container_text4 {
  width: 100%;
}

.main_interview .container_text1 img,
.main_interview .container_text2 img,
.main_interview .container_text3 img,
.main_interview .container_text4 img {
  z-index: -1;
}

@media screen and (min-width: 768px) {
  .main_interview .container_text1,
  .main_interview .container_text2,
  .main_interview .container_text3,
  .main_interview .container_text4 {
    display: none;
  }
}

/* ---------------------------------------------
#main_sub
---------------------------------------------*/
#main_sub {
  padding-top: 20vw;
  padding-bottom: 15vw;
  width: calc(100vw - 30px);
  background-image: url(../img/interview/interview_b_1.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}

.main_interview #footer {
  margin-top: calc(-10px - 5vw);
}

.sub_title {
  width: 40%;
  margin: 0 auto 5vw;
}

.sub_text {
  display: none;
}

#container_sub1,
#container_sub2,
#container_sub3 {
  width: 100%;
  margin: 0 auto 5vw;
}

#container_sub3 {
  margin: 0 auto;
}

#main_sub .Text_box {
  width: 56.17%;
  margin: 0 auto 2vw;
}

#main_sub .name {
  height: 96px;
  margin: 0 auto 2vw;
}

#main_sub .btn_1 {
  width: 18%;
  margin: 0 auto;
}

#main_sub .btn_1::after {
  content: ' ';
  width: 100%;
  height: 100%;
  background-image: url(../img/Immigrant/body/jump_l_b.png);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 6px;
  left: -6px;
  z-index: -1;
  opacity: 1;
  transition: 0.2s;
  filter: brightness(0.9);
}

#main_sub .btn_1:hover::after {
  content: ' ';
  opacity: 0;
}

#main_sub .btn_1 .btn_1_2 {
  display: none;
}

@media screen and (max-width: 767px) {
  #main_sub {
    padding-top: 20vw;
    padding-bottom: 15vw;
    width: calc(100vw - 20px);
    background-image: url(../img/interview/interview_sb_1.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
  }

  .main_interview #footer {
    margin-top: calc(-10px - 10vw);
  }

  #container_sub1,
  #container_sub2,
  #container_sub3 {
    width: 100%;
    margin: 0 auto 15vw;
  }

  #container_sub3 {
    margin: 0 auto 0vw;
  }

  .sub_title {
    width: 54.8%;
    margin: 0 auto 5vw;
  }

  .sub_text {
    width: 100%;
    display: inline;
  }

  #main_sub .btn_1 {
    width: 34.42%;
    margin: 0 auto;
  }

  #main_sub .btn_1 .btn_1_1 {
    display: none;
  }

  #main_sub .btn_1 .btn_1_2 {
    display: block;
  }

  #main_sub .Text_box {
    width: 83%;
    margin: -20px auto 5vw;
  }

  #main_sub .name {
    width: 39%;
    height: auto;
    margin: 0 auto 4vw;
  }

  #main_sub .name1 {
    width: 34%;
    height: auto;
    margin: 0 auto 4vw;
  }

  #main_sub .name2 {
    width: 55%;
    height: auto;
    margin: 0 auto 4vw;
  }
}