

.adspecial_type1 {
  max-width: none !important;
}
.frame_col_left {
    padding: 40px 24px;
}


.wrapper-box {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 1px;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.wrapper-box .box {
  width: calc(10% - 1px);
  height: 80px;
  background: #fff;
}

.adspecial_type1 .frame_header {
  position: relative;
  height: 400px;
  background: url(/extra/persol_bita_202303/media/head_title_02.jpg) no-repeat top left;
  background-size: cover;
}
.adspecial_type1 .frame_header::before {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: url(/extra/persol_bita_202303/media/head_title_01.png) no-repeat center right;
  background-size: contain;
}

#adspecial_persol_bita_202303.adspecial_type1 h1.adspecial {
  position: relative;
  z-index: 5;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 1000px;
  height: 100%;
  margin: 0 auto;
  padding: 24px;
  font-size: clamp(1.25rem,5vw,2.4rem);
  line-height: 1.3;
  font-feature-settings: "palt" 1;
}
#adspecial_persol_bita_202303.adspecial_type1 h1.adspecial span {
  display: block;
  margin-top: 16px;
  font-size: clamp(1rem,3.2vw,2rem);
}

#adspecial_persol_bita_202303.adspecial_type1 h2.adspecial {
  position: relative;
  max-width: 800px;
  margin: 80px auto 24px;
  padding: 24px;
  text-align: center;
  line-height: 1.3;
}
#adspecial_persol_bita_202303.adspecial_type1 h2.adspecial::before,
#adspecial_persol_bita_202303.adspecial_type1 h2.adspecial::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 40px;
  height: 40px;
  border-top: 12px solid #97999B;
  border-left: 12px solid #97999B;
}

#adspecial_persol_bita_202303.adspecial_type1 h2.adspecial::after {
  top: auto;
  bottom: 0;
  left: auto;
  right: 0;
  border: none;
  border-bottom: 12px solid #97999B;
  border-right: 12px solid #97999B;
}



#adspecial_persol_bita_202303.adspecial_type1 h3.adspecial {
}

#adspecial_persol_bita_202303.adspecial_type1 .frame_col_left #block_story p {
  max-width: 800px;
  margin: 0 auto;
  line-height: 1.8em;
}


#adspecial_persol_bita_202303.adspecial_type1 .frame_col_left #block_story p.interviewer {
  margin-bottom: 24px;
  padding: 16px;
  font-weight: bold;
  background : #f5f5f5;
}
#adspecial_persol_bita_202303.adspecial_type1 .frame_col_left #block_story p span[class^="mr_"] {
  padding: 0 8px;
  font-weight: bold;
  border-left: 4px solid #444;

}

#adspecial_persol_bita_202303.adspecial_type1 .article_leaf_paging_word {
  font-size: 12px;
  margin: 20px 0px 30px 0;
  text-align: right;
}

.intro-person {
  position: relative;
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
  gap: 24px;
    max-width: 1000px;
    margin: 0 auto 1px;
  padding: 40px 0;
  font-weight: bold;
  color: #fff;
}
.intro-person:nth-of-type(2),
.intro-person:last-of-type {align-items: center;}

.intro-person:nth-of-type(2) {flex-direction: unset;}
.intro-person:nth-of-type(2)::before {background: #89b0be;}

.intro-person:last-of-type {margin-bottom: 40px;}
.intro-person::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: calc(50% - 50vw);
  display: block;
  width: 100vw;
  height: 100%;
  background: #77A3B2;
}

.intro-person-thumb {
  width: 45%;
  flex-shrink: 0;
}

.intro-person-thumb .center {
  padding: 0 !important;
  color: #fff !important;
}
.intro-person-thumb .center img {
  margin: 0 0 16px !important;
  box-shadow: none !important;
}
.article-contents .center img {
  display: inline-block;
  margin: 24px 0;
  box-shadow: -16px -16px 0 #97999B, 16px 16px 0 #77A3B2;
}

.persol-information {
  max-width: 800px;
  margin: 0 auto;
  padding-top: 40px;
  font-size: 1.15rem;
  border-top: 1px solid #ccc;
}
.persol-information p {margin-bottom: 24px; font-weight: bold;}
.persol-information p a {color: #1174c7; text-decoration: underline;}
.persol-information ul {
  margin: 0;
    background: #f5f5f5;
    padding: 24px 24px 24px 48px;
}

.block_sponsored {
  padding: 16px 24px;
  text-align: center;
  color: #fff;
  background: #97999B;
}

footer {
  margin-top: 0;
}



@media screen and (max-width: 800px) {
  #adspecial_persol_bita_202303.adspecial_type1,
  #adspecial_persol_bita_202303.adspecial_type1 .frame_col_right_container,
  #adspecial_persol_bita_202303.adspecial_type1 .frame_col_left_container,
  #adspecial_persol_bita_202303.adspecial_type1 .frame_col_left,
  #adspecial_persol_bita_202303.adspecial_type1 .frame_col_right {
    width: auto !important;
    float: none;
  }
  #adspecial_persol_bita_202303.adspecial_type1 .article_body .left,
  #adspecial_persol_bita_202303.adspecial_type1 .article_body .right,
  #adspecial_persol_bita_202303.adspecial_type1 .article_body .center {
    float: none;
    max-width: 100%;
    text-align: center;
  }
  #adspecial_persol_bita_202303.adspecial_type1 img {
    display: block;
    width: auto !important;
    max-width: 100% !important;
    height: auto;
    margin: 0 auto 10px;
  }

  #adspecial_persol_bita_202303.adspecial_type1 .block_right_plink {
    display: none;
  }

  .adspecial_type1 .frame_header::before {
  background: url(/extra/persol_bita_202303/media/head_title_01.png) no-repeat center center;
  background-size: cover;
  }

  #adspecial_persol_bita_202303.adspecial_type1 h1.adspecial {
  width: fit-content;
  background: rgba(255,255,255,.5);
  }
  .intro-person,.intro-person:nth-of-type(2) {
  flex-direction: column;
  align-items: flex-start;
  }
  .intro-person-text {order: 2;}
  .intro-person-thumb {order: 1; width: 100%; text-align: center;}
  .intro-person-thumb .center img {margin: 0 auto 16px !important;}
}


@media screen and (max-width: 480px) {
}

