@import url("global.css");
.sec_intro {
  height: 530px;
  position: relative;
  margin-bottom: 200px; }
  .sec_intro::after {
    content: "interview";
    line-height: 1.0;
    letter-spacing: 0;
    color: rgba(204, 204, 204, 0.5);
    position: absolute;
    left: 4vw;
    bottom: -80px;
    font-size: 180px;
    font-family: "Spline Sans Mono", monospace, sans-serif; }
  .sec_intro .img_area {
    width: 50%;
    height: 100%;
    position: absolute;
    right: 50%;
    top: 0; }
  .sec_intro .wrapper {
    height: 100%;
    position: relative;
    z-index: 2; }
    .sec_intro .wrapper .text_area {
      width: 60%;
      height: 100%;
      margin-left: auto;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: center; }
      .sec_intro .wrapper .text_area .lead {
        line-height: 1.45;
        margin-bottom: 20px;
        font-size: 44px; }
      .sec_intro .wrapper .text_area .name {
        font-size: clamp(18px, 3.2vw, 30px); }

.sec_interview .interview_block {
  margin-bottom: 100px; }
  .sec_interview .interview_block:last-of-type {
    margin-bottom: 50px; }
  .sec_interview .interview_block.f_inner {
    align-items: stretch; }
  .sec_interview .interview_block .text_area {
    width: 65%; }
  .sec_interview .interview_block .img_area {
    width: 30%; }
    .sec_interview .interview_block .img_area figure {
      margin-bottom: 30px; }
      .sec_interview .interview_block .img_area figure:last-of-type {
        margin-bottom: 0; }
  .sec_interview .interview_block .text {
    margin-bottom: 100px;
    padding: 0 40px;
    position: relative; }
    .sec_interview .interview_block .text::before {
      content: "";
      width: 1px;
      height: 100%;
      background: rgba(0, 0, 0, 0.5);
      position: absolute;
      left: 0;
      top: 0; }
    .sec_interview .interview_block .text:last-of-type {
      margin-bottom: 0; }
    .sec_interview .interview_block .text .lead {
      margin-bottom: 40px;
      font-size: clamp(18px, 2.6vw, 20px); }
    .sec_interview .interview_block .text p + p {
      margin-top: 10px; }
  .sec_interview .interview_block .img {
    width: 100%; }

.sec_profile {
  background: url("../interview/images/bg_profile.jpg") no-repeat center center;
  background-size: cover;
  padding: 60px 0;
  position: relative; }
  .sec_profile::before {
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2; }
  .sec_profile::after {
    content: "";
    width: 100%;
    height: 120px;
    background: #fff;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 3; }
  .sec_profile .wrapper {
    position: relative;
    z-index: 4;
    align-items: flex-end; }
  .sec_profile .img_area {
    width: 50%; }
    .sec_profile .img_area .img {
      width: 70%;
      margin: 0 auto; }
  .sec_profile .text {
    width: 50%;
    color: #fff; }
    .sec_profile .text .job {
      margin-bottom: 10px;
      font-size: clamp(15px, 2vw, 18px); }
    .sec_profile .text .name {
      margin-bottom: 20px;
      font-size: clamp(22px, 2vw, 30px); }
      .sec_profile .text .name span {
        margin-left: 10px;
        font-size: clamp(12px, 1.6vw, 15px); }
    .sec_profile .text .data {
      margin-bottom: 20px; }
    .sec_profile .text .more a {
      width: 320px;
      padding: 15px 25px;
      box-sizing: border-box;
      display: block;
      background: #000;
      color: #fff;
      border-radius: 3px;
      position: relative; }

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

 Responsive-Breakpoint-1 (1600px)

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

 Responsive-Breakpoint-2 ( 1300px )

------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 1300px) {
  .sec_intro::after {
    font-size: 160px; }
  .sec_intro .wrapper .text_area .lead {
    font-size: 40px; }

  .sec_interview .interview_block {
    margin-bottom: 80px; }
    .sec_interview .interview_block .img_area {
      width: 34%; }
      .sec_interview .interview_block .img_area figure {
        height: 300px;
        margin-bottom: 40px; }
    .sec_interview .interview_block .text {
      margin-bottom: 80px; } }
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-3 ( 960px )

------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 959px) {
  .sec_intro {
    height: 420px;
    margin-bottom: 120px; }
    .sec_intro::after {
      bottom: -60px;
      font-size: 120px; }
    .sec_intro .img_area {
      width: 60%;
      right: 40%; }
    .sec_intro .wrapper .text_area {
      width: 55%; }
      .sec_intro .wrapper .text_area .lead {
        font-size: 30px; }

  .sec_interview .interview_block {
    margin-bottom: 60px; }
    .sec_interview .interview_block:last-of-type {
      margin-bottom: 30px; }
    .sec_interview .interview_block.f_inner {
      display: block; }
    .sec_interview .interview_block .text_area {
      width: 100%; }
    .sec_interview .interview_block .img_area {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-top: 60px; }
      .sec_interview .interview_block .img_area figure {
        margin-bottom: 0;
        width: 31%;
        height: auto; }
    .sec_interview .interview_block .text {
      margin-bottom: 60px;
      padding: 0 30px; }
      .sec_interview .interview_block .text .lead {
        margin-bottom: 20px; }

  .sec_profile {
    padding: 40px 0; }
    .sec_profile::after {
      height: 80px; }
    .sec_profile .text .more a {
      width: 80%; } }
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-4 ( 644px )
 
------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 644px) {
  .sec_intro {
    height: auto;
    margin-bottom: 80px; }
    .sec_intro::after {
      left: auto;
      right: -1vw;
      bottom: -20px;
      font-size: 66px; }
    .sec_intro .img_area {
      width: 100%;
      height: auto;
      position: relative;
      right: auto;
      top: auto;
      margin-bottom: 20px; }
    .sec_intro .wrapper {
      height: auto; }
      .sec_intro .wrapper .text_area {
        width: 100%;
        height: auto;
        display: block; }
        .sec_intro .wrapper .text_area .lead {
          margin-bottom: 10px;
          font-size: 24px; }

  .sec_interview .interview_block {
    margin-bottom: 40px; }
    .sec_interview .interview_block:last-of-type {
      margin-bottom: 20px; }
    .sec_interview .interview_block .img_area {
      margin-top: 40px; }
    .sec_interview .interview_block .text {
      margin-bottom: 40px;
      padding: 0 0 0 15px; }

  .sec_profile .img_area {
    width: 70%;
    margin: 0 auto 20px; }
    .sec_profile .img_area .img {
      width: 100%; }
  .sec_profile .text {
    width: 100%;
    text-align: center; }
    .sec_profile .text .data {
      display: inline-block; }
      .sec_profile .text .data p {
        text-align: left; }
    .sec_profile .text .more a {
      margin: 0 auto;
      text-align: left; } }