@charset "utf-8";

/* ===================================
   リセット・汎用クラス　　　　　　　　　　　　　　　　
=================================== */
body{
   padding: 0;
   margin: 66px 0 0 0 !important;
   font-size: 100%;
}
.interview{
   font-family: "Roboto","Noto Sans JP",sans-serif;
   font-optical-sizing: auto;
   font-weight: 400;
   font-style: normal;
}
.interview main h1,
.interview main h2,
.interview main h3,
.interview main h4,
.interview main div,
.interview main p,
.interview main ul,
.interview main ol,
.interview main li,
.interview main dl,
.interview main dt,
.interview main dd,
.interview main table,
.interview main th,
.interview main td{
  margin: 0;
  padding: 0;
  font-size: 16px;
  color: #111;
  line-height: 1.8;
  box-sizing: border-box;
}
.interview section{
   width: 100%;
   background-color: #ffffff;
}
.interview section .contents_wrap{
   width: 1000px;
   margin: 0 auto;
}
.interview section .contents_wrap_s{
   width: 900px;
   margin: 0 auto;
}
.interview a{
   text-decoration: none;
   color: #00a7ac;
}
.interview main img{
   width: 100%;
   border: none;
   vertical-align: middle;
}
.interview main ul li,
.interview main ol li{
   list-style: none;
}
.interview main sup{
   vertical-align: top;
}
.interview main .note{
   display: block;
   font-size: 13px;
   line-height: 1.8 !important;
   padding-left: 1em;
   text-indent: -1em;
}
.interview main .note a{
   text-decoration: underline;
}
.interview main .note a:hover{
   text-decoration: none;
}
.interview main .indent{
   display: block;
   padding-left: 1em;
   text-indent: -1em;
}
#FixMenu{
   display: none;
}

@media screen and (max-width: 767px){
body{
   margin: 0 0 0 0 !important;
}
.interview main h1,
.interview main h2,
.interview main h3,
.interview main h4,
.interview main div,
.interview main p,
.interview main ul,
.interview main ol,
.interview main li,
.interview main dl,
.interview main dt,
.interview main dd,
.interview main table,
.interview main th,
.interview main td{
   margin: 0;
   padding: 0;
   font-size: 15px;
   color: #111;
   line-height: 1.8;
   box-sizing: border-box;
}
.interview section{
   width: 100%;
   padding: 0 20px;
   box-sizing: border-box;
}
.interview section .contents_wrap,
.interview section .contents_wrap_s{
   width: 100%;
   margin: 0 auto;
}
.interview section > .contents_wrap_s {
   width: calc(100% - 40px);
   margin: 0 auto;
}

.interview main .note{
   font-size: 12.5px;
   line-height: 1.6 !important;
}
/* #page-top {
   bottom: 65px;
} */
#page-top a img{
   display: none;
}
}

/* ===================================
   ヘッダー　　　　　　　　　　　　　　　　
=================================== */
.interview #header{
   z-index: 6;
   box-shadow: 0px 0 8px 1px rgba(0, 0, 0, 0.14);
}
.interview #header_cta{
   width: 1200px;
   position: relative;
   top: -66px;
   margin: 0 auto;
   z-index: 22;
}
.interview #header_cta .header_cta_inner{
   position: fixed;
   display: flex;
   top: 0;
   right: calc(50% - 600px);
}
.interview #header_cta .header_cta_inner a{
   top: 0;
   right: 0;
   display: block;
   text-align: center;
   border-radius: 25px;
   box-sizing: border-box;
   box-shadow: 0px 0px 5px 0px rgba(0, 109, 112, 0.5);
   width: 230px;
   height: 48px;
   margin: 9px 10px 0 0;
   color: #00a7ac;
   font-weight: 700;
   background: url("../images/logo_k-dive.png") #fff left 28px center no-repeat;
   background-size: 42px;
   padding: 11px 0 0 34px;
   transition: all .15s ease-out;
}
.interview #header_cta .header_cta_inner a:last-child{
   width: 200px;
   border: 2px solid #fff;
   color: #00a7ac;
   background: url("/dx/img/kdive/icon_wp_gr.png") #ffffff left 42px center no-repeat;
   background-size: 24px;
   margin: 9px 0 0 0;
   padding: 9px 0 0 12px;
}
.interview #header_cta a:hover{
   opacity: 0.7;
}


@media screen and (max-width: 767px){
.interview #header{
   width: 100%;
   box-shadow: 0 0 0 0;
}
.interview #header_cta{
   position: relative;
   top: inherit;
   bottom: 0;
}
.interview #header_cta .header_cta_inner{
   width: 100%;
   position: fixed;
   display: flex;
   top: inherit;
   bottom: 0;
   justify-content: center;
   align-items: center;
   right: inherit;
}
.interview #header_cta .header_cta_inner a{
   width: 53%;
   height: 52px;
   transition: none;
   font-size: 15px;
   border: 1px solid #00a7ac;
   box-sizing: border-box;
   box-shadow: 0 0 0 0;
   margin: 0;
   border-radius: 0;
   background: url("../images/logo_k-dive.png") #fff left 15px center no-repeat;
   background-size: 40px;
   padding: 15px 0 0 40px;
   transition: none;
   opacity: 0.88;
}
.interview #header_cta .header_cta_inner a:last-child{
   width: 47%;
   border: 0;
   border-top: 1px solid #00a7ac;
   border-right: 1px solid #00a7ac;
   border-bottom: 1px solid #00a7ac;
   background: url("/dx/img/kdive/icon_wp_gr.png") #fff left 18px center no-repeat;
   background-size: 26px;
   margin: 0;
   padding: 15px 0 0 12px;
}
.interview #header_cta a:hover{
   opacity: 0.92;
}
#footerCredit{
   padding-bottom: 65px;
}
#header #head_btncontact,
#header .menuIconWrapper{
   display: none;
}


}


/* ===================================
   MV
=================================== */
.interview main{
/*   background: url('../images/img_mv.png') no-repeat center bottom;
   background-size: contain;*/
}
.interview main h1{
   padding-top: 60px;
   text-align: center;
   background: url('../images/img_mv.png') no-repeat center bottom;
   background-size: cover;
   height: calc(100vh - 96px);
   /*max-height: 820px;*/
   min-height: 780px;
   position: relative;
}
.interview main h1 .bg_illust{
   width: 100%;
   max-width: 1600px;
   /*height: 100vh;
   max-height: 800px;*/
   margin: 0 auto;
   position: relative;
}
.interview main h1 .bg_illust::after{
   content: "";
   position: absolute;
   width: 52%;
   max-width: 1000px;
   height: 100vh;
   min-height: 680px;
   top: -10px;
   right: 5%;
   background: url('../images/img_mv_illust.png') no-repeat right top;
   background-size: 100%;
}
.interview main h1 .bg_illust .mv_wrap{
   /*display: flex;
   justify-content: center;*/
   padding: 10px 0 0 5%;
}
.interview main h1 .mv_wrap .mv-cta-section p{
   /*font-size: 4em;*/
   font-size: clamp(3.5rem, calc(3vw + 1.5rem), 5.0rem);
   font-weight: 900;
   letter-spacing: 0;
   text-align: left;
   line-height: 1.15;
}

.interview main h1 .mv_wrap .mv-cta-section .asterisk{
   font-size: 30px;
   font-weight: 800;
   margin-left: -20px;
   
}

.interview main h1 .mv_wrap .mv-cta-section .txt_asterisk{
   font-size: 13px;
   font-weight: 500;
   margin-top: 20px;
   letter-spacing: 0.1em;
   
}

.interview main h1 .mv_wrap .mv-cta-section p .gla{
   vertical-align: -3%;
   letter-spacing: -0.033em;
   padding: 0 3px 0 5px;
   font-size: clamp(7.0rem, calc(2vw + 6rem), 9.0rem);
   background-image: linear-gradient(65deg, rgba(58, 154, 206, 1) 27%, rgba(82, 199, 192, 1));
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
}
.interview main h1 .mv_wrap .mv-cta-section sup.attention{
   font-size: 24px;
   font-weight: 700;
   vertical-align: text-top;
   margin: 0px 0px 0px -10px;
}

.interview main h1 small{
   font-size: 0.66em;
}
.interview main h1 .mv_wrap .mv-cta-section p .text_span{
   font-size: 0.38em;
   font-weight: 800;
   padding-top: 30px;
   letter-spacing: 0.066em;
   display: block;
}
.interview main .mv_wrap sup {
   vertical-align: text-top;
   font-size: 0.6em;
}
.interview main .mv_wrap .mv-cta-section .btn_area a{
   display: block;
   background: linear-gradient(65deg, #359cd5 0%, #56c2bf 50%, #359cd5 100%);
   background-size: 200% 100%;
   width: calc(20% + 200px);
   max-width: 550px;
   position: relative;
   border-radius: 45px;
   padding: 15px 0;
   margin: 80px 0 0 0;
   transition: all .25s ease-in;
}
.interview main .mv_wrap .mv-cta-section .btn_area a:hover{
   background-position: 100% 0;
}
.interview main .mv_wrap .mv-cta-section .btn_area .cta-main-content{
   text-align: left;
   padding-left: 31%;
   padding-top: 2px;
}
.interview main .mv_wrap .mv-cta-section .btn_area .cta-text-main{
   color: #fff;
   font-size: 25px;
   font-weight: 600;
   letter-spacing: 0.15em;
}
.interview main .mv_wrap .mv-cta-section .btn_area .cta-text-main::before{
   content: "";
   /*display: inline-block;*/
   width: 22px;
   height: 50px;
   background-image: url(../images/ico_mv_cta.png);
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
   position: absolute;
   left: 24.5%;
   top: 49%;
   transform: translateY(-50%);
}
.interview main .mv_wrap .mv-cta-section .btn_area .cta-button .cta-text-top{
   background-color: #fff;
   color: #359cd5;
   border: 2px solid #359cd5;
   border-radius: 20px;
   position: absolute;
   top: -20px;
   left: calc(10% + 18px);
   width: 50%;
   padding: 1px 0 0 0;
   line-height: 1.6;
   font-size: 18px;
}
.interview main .mv_wrap .mv-cta-section .btn_area .cta-catalog-image{
   position: absolute;
   width: 200px;
   right: -42px;
   bottom: -34px;
}



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

.interview main h1{
   padding: 10px 0 0 0;
}
.interview main h1{
   /*padding-top: 60px;*/
   padding-top: 0px;
   text-align: center;
   background: url('../images/img_mv.png') no-repeat center bottom;
   background-size: cover;
   height: inherit;
   max-height: inherit;
   min-height: inherit;
   /*height: calc(100vh - 50px);
   max-height: 820px;*/
   position: relative;
}
.interview main h1 .mv_wrap {
   display: block;
}
.interview main h1 .bg_illust{
   max-width: 100%;
}
.interview main h1 .bg_illust .mv_wrap {
   padding: 20px 0 0 0;
   /*height: 100svh*/;
}
.interview main h1 img{
   width: 100%;
   max-width: 600px;
}
.interview main h1 .bg_illust::after{
   content: "";
   position: relative;
   display: block;
   width: 92%;
   max-width: inherit;
   height: auto;
   min-height: inherit;
   padding-top: 81.36%;
   margin-bottom: 10px;
   top: 0;
   bottom: 2%;
   left: 4%;
   right: inherit;
   background: url('../images/img_mv_illust.png') no-repeat center center;
   background-size: 100%;
}

.interview main h1 .mv_wrap .mv-cta-section p {
   font-size: 8vw;
   width: 92%;
   margin: 0 auto;
   text-align: center;
   line-height: 1.2;
}
.interview main h1 .mv_wrap .mv-cta-section p .gla{
   font-size: 2.0em;
}

.interview main h1 .mv_wrap .mv-cta-section .asterisk{
   font-size: 18px;
   margin-left: -5px;
}
.interview main h1 .mv_wrap .mv-cta-section p .text_span{
   font-size: 0.51em;
   padding: 10px 18px 0 0;
   letter-spacing: 0.03em;
}
.interview main h1 .mv_wrap .mv-cta-section .txt_asterisk{
   font-size: 11.5px;
   padding-right: 20px;
   letter-spacing: 0;
}

.interview main .mv_wrap .mv-cta-section .btn_area {
   border-radius: 45px;
   padding: 15px 0;
   margin: 20px auto 0;
   width: 100%;
}
.interview main .mv_wrap .mv-cta-section .btn_area a{
   /*background: linear-gradient(65deg, #359cd5 0%, #56c2bf 50%, #359cd5 100%);
   background-size: 200% 100%;*/
   width: 80%;
   max-width: 100%;
   border-radius: 40px;
   padding: 10px 20px 8px 0;
   margin: 0 auto;
   transition: none;
}
.interview main .mv_wrap .mv-cta-section .btn_area .cta-main-content{
   padding-left: calc(50% - 38px);
   padding-top: 5px;
   font-size: 1em;
}
.interview main .mv_wrap .mv-cta-section .btn_area .cta-button .cta-text-top {
   left: calc(50% - 38%);
   width: 70%;
   font-size: 15px;
   top: -15px;
}
.interview main .mv_wrap .mv-cta-section .btn_area .cta-catalog-image {
   width: 110px;
   right: -25px;
   bottom: -4px;
}
.interview main .mv_wrap .mv-cta-section .btn_area .cta-text-main {
   font-size: 1.25em;
   padding-right: 13px;
}
.interview main .mv_wrap .mv-cta-section .btn_area .cta-text-main::before {
   width: 16px;
   left: 28%;
   top: 53%
}

}



/* ===================================
   intro
=================================== */
.interview main .intro_wrap{
   background-image: linear-gradient(0deg, rgba(65, 164, 253, 0), rgba(179, 232, 231, 1));
   padding: 0 0 60px 0;
}

.interview main .intro_wrap .fz7{
   font-size: 13px;
   font-weight: normal;
   letter-spacing: 0;
   padding-top: 30px; 
   display: block;
}
.interview main .intro_wrap .fz7 a{
   text-decoration: underline;
   overflow-wrap: anywhere;
   word-break: normal;
   line-break: strict;
}
.interview main .intro_wrap .txt_lead{
   background-color: #fff;
   text-align: center;
   font-weight: 500;
   font-size: 24px;
   letter-spacing: 0.1em;
   padding: 0 0 100px 0;
   position: relative;
   display: inline-block;
   width: 100%;
   margin-bottom: 80px;
}
.interview main .intro_wrap .txt_lead:before {
   content: "";
   position: absolute;
   bottom: -49px;
   left: 50%;
   margin-left: -15px;
   border: 25px solid transparent;
   border-top: 25px solid #FFF;
   z-index: 2;
}

.interview main .intro_wrap .contents_wrap{
   background-color: #FFF;
   border: 1px solid #00a7ac;
   border-radius: 10px;
   position: relative;
   padding: 50px;
}
.interview main .intro_wrap .contents_wrap h2{
   font-size: 30px;
   font-weight: 900;
   margin: 0 0 40px 0;
}
.interview main .intro_wrap .contents_wrap h2 span{
   font-size: 34px;
   border-bottom: #00a7ac dashed 3px;
   margin: 0 6px 0 3px; 
   padding-right: 33px;
   background: url("../images/ico_question.png") right center no-repeat;
   background-size: 30px;
   cursor: help;
}
.interview main .intro_wrap .contents_wrap .intro_box{}
.interview main .intro_wrap .contents_wrap .intro_box > p{
   width: 210px;
   font-size: 14px;
   position: absolute;
   top: 60px;
   right: 80px;
   text-align: center;
   line-height: 1.6;
}
.interview main .intro_wrap .contents_wrap .intro_box > p img{
   margin-bottom: 10px;
}
.interview main .intro_wrap .contents_wrap .intro_box div{
   width: 100%;
   /*float: left;*/
}
.interview main .intro_wrap .contents_wrap .intro_box div p{
   margin-bottom: 20px;
}
.interview main .intro_wrap .contents_wrap .intro_company{
   background-color: #e4f7f7;
   border-radius: 10px;
   padding: 30px;
   margin-top: 40px;
}
.interview main .intro_wrap .contents_wrap .intro_company p{
   float: left;
   font-size: 14px;
   width: 560px;
}
.interview main .intro_wrap .contents_wrap .intro_company p:first-child{
   margin-right: 30px;
   width: 185px;
}
.interview main .intro_wrap .contents_wrap .intro_company p strong{
   display: block;
   margin-bottom: 15px;
}
.interview main .intro_wrap .lead{
   display: flex;
}
.interview main .intro_wrap .lead .right{
   width: 57%;
   margin-left: 50px;
}
.interview main .intro_wrap .lead .right .yellow{
   background: #fff620;
   padding: 3px 0;
   font-weight: bold;
}
.interview main .intro_wrap .lead h2{
   font-size: 3em;
   border-bottom: 3px solid #000;
   line-height: 1.4;
   display: inline;
}
.interview main .intro_wrap .left p img{
   margin-top: 30px;
   border-radius: 10px;
}
.interview main .intro_wrap .button{
   
}
.interview main .intro_wrap .button a{
   display: block;
   font-size: 18px;
   font-weight: 600;
   text-align: center;
   border-radius: 50px;
   border: 2px solid #00a7ac;
   color: #00a7ac;
   opacity: 1.0;
   transition: all .2s ease-out;
   padding: 0;
   line-height: 70px;
   margin-top: 20px;
   width: 55%;
   margin: 40px auto 0 auto;
}
.interview main .intro_wrap .button a:hover{
   background-color: #00a7ac;
   color: #fff;
}


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

.interview main .intro_wrap{
   background-color: #e4f7f7;
   padding: 0 20px 40px 20px;
   margin-bottom: 30px;
}
.interview main .intro_wrap .fz7{
   font-size: 12px;
   padding-top: 20px; 
}
.interview main .intro_wrap .txt_lead{
   text-align: left;
   font-size: 16px;
   letter-spacing: 0;
   padding: 30px;
   margin: 20px 0 40px 0;
}
.interview main .intro_wrap .contents_wrap{
   padding: 20px;
}
.interview main .intro_wrap .lead h2{
   font-size: 10.5vw;
   /*border-bottom: 3px solid #000;*/
   line-height: 1.3;
}
.interview main .intro_wrap .contents_wrap h2 span{
   font-size: 23px;
   border-bottom: #00a7ac dashed 2px;
   margin: 0 4px 0 2px; 
   padding-right: 18px;
   background: url("../images/ico_question.png") right center no-repeat;
   background-size: 18px;
}
.interview main .intro_wrap .contents_wrap .intro_box > p{
   width: 100%;
   font-size: 13.5px;
   position: relative;
   top: inherit;
   right: inherit;
   margin-bottom: 20px;
}
.interview main .intro_wrap .contents_wrap .intro_box > p img{
   max-width: 150px;
   width: 50%;
   display: block;
   margin: 0 auto 10px auto;
}
.interview main .intro_wrap .contents_wrap .intro_box div{
   width: 100%;
   float: none;
}
.interview main .intro_wrap .contents_wrap .intro_company{
   padding: 20px;
   margin-top: 20px;
}
.interview main .intro_wrap .contents_wrap .intro_company p{
   float: none;
   font-size: 13px;
   width: 100%;
}
.interview main .intro_wrap .contents_wrap .intro_company p:first-child{
   margin: 0 auto 15px auto;
   max-width: 150px;
   width: 100%;
}
.interview main .intro_wrap .contents_wrap .intro_company p strong{
   margin-bottom: 10px;
}
.interview main .intro_wrap .lead {
   display: block;
}
.interview main .intro_wrap .lead .left{
   text-align: center;
}
.interview main .intro_wrap .left p img {
   margin-top: 20px;
}
.interview main .intro_wrap .lead .right {
   width: 100%;
   margin-left: 0;
   margin-top: 20px;
}
.interview main .intro_wrap .button a {
   padding: 0;
   line-height: 2;
   width: 100%;
   margin-top: 30px;
   text-align: center;
}
.interview main .intro_wrap .txt_lead:before {
   left: 45%;
   /* margin-left: -15px;
   border: 25px solid transparent;
   border-top: 25px solid #FFF; */
}
.interview main .intro_wrap .button a{
   font-size: 16px;
   line-height: 1.6;
   margin-top: 20px;
   width: 100%;
   margin: 30px auto 10px auto;
   padding: 10px 0;
}

}

/* ===================================
   目次
=================================== */
.index{
   padding: 20px 0 80px 0;
}
.index .contents_wrap_s{
   position: relative;
}
.index .contents_wrap_s h4{
   font-size: 1.25em;
   border-bottom: 1px solid #000;
   margin-bottom: 40px;
   padding-left: 30px;
}
.index .contents_wrap_s h4::before{
   content: "";
   display: block;
   width: 18px;
   height: 14px;
   background-image: url("../images/ico_menu.png"); 
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
   position: absolute;
   left: 0;
   top: 11px; 
}

.index .index_flex{
   display: flex;
   justify-content: space-around;
}
.index .index_flex .img img{
   padding-top: 20px;
}

.circle_arrow_ul {
   list-style: none;
   padding-left: 0;
}
.circle_arrow_ul a{
   text-decoration: underline 1px solid #00a7ac;
   text-underline-offset:0.5em;
}
.circle_arrow_ul > .circle_arrow {
   position: relative;
   padding-left: 35px;
   margin-bottom: 18px;
   font-weight: 500;
   line-height: 1.6;
}
.circle_arrow_ul > .circle_arrow::before {
   content: "";
   display: inline-block;
   width: 20px;
   height: 20px;
   background-image: url("../images/ico_link.png"); 
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
   position: absolute;
   left: 8px;
   top: 50%; 
   transform: translateY(-50%);
}
.circle_arrow_ul > .circle_arrow:nth-child(2)::before {
   top: 0.3em;
   transform: none;
}
.circle_arrow_ul > .circle_arrow:nth-child(2)::after {
   top: calc(0.3em + 6px);
   transform: rotate(45deg); 
}
.circle_arrow_ul > .circle_arrow > a{
   font-size: 1.1em;
}

.arrow_ul{
   margin-top: 18px!important;
}
.arrow_ul .arrow {
   position: relative;
   padding-left: 20px;
   margin-bottom: 10px;
   line-height: 1.6;
   font-size: 0.95em;
   font-weight: 400;
}
.arrow_ul .arrow::after {
   content: "";
   display: block;
   width: 4px;
   height: 4px;
   border: 2px solid #00a7ac;
   border-top: none;
   border-left: none;
   transform: translateY(-50%) rotate(45deg);
   position: absolute;
   left: 0;
   top: 50%;
   z-index: 2; 
}
.arrow_ul .arrow::before {
   content: none;
   display: none;
}

@media screen and (max-width: 767px){
   .index .index_flex {
      display: block;
   }
   .index .index_flex .img{
      width: 50%;
      margin: 0 auto 20px auto;
   }
   .index .contents_wrap h4 {
      margin: 25px 0;
   }
   .index .contents_wrap h4::before {
   top: 2.5%;
   }
   
.circle_arrow_ul > .circle_arrow > a{
   font-size: 16px;
}
.arrow_ul .arrow {
   font-size: 14px;
   padding-left: 16px;
   line-height: 1.8;
}
.arrow_ul .arrow::after {
   top: 12px;
}
   
   
   
}


/* ===================================
   Interview
=================================== */
.interview .interview_wrap{
   position: relative;
   overflow: hidden;
   margin-bottom: 40px;
}
.interview .interview_wrap h2{
   color: #fff;
   text-align: center;
   padding: 60px 0;
   background-color: #00a7ac;
   font-size: 30px;
   line-height: 1.6;
   letter-spacing: 0.05em;
   position: relative;
   z-index: 2;
}
.interview h2 > span{
   font-size: 15px;
   font-weight: 600;
   display: block;
   padding: 5px 0 3px 0;
   width: 130px;
   line-height: 1.0;
   border-radius: 30px;
   border: 2px solid #fff;
   margin: 0 auto 5px;
}
.interview .interview_wrap h4,
.interview .effect_wrap h4{
   padding: 3px 10px 1px 10px;
   text-align: center;
   font-size: 25px;
   line-height: 1.6;
   letter-spacing: 0.05em;
   position: relative;
   z-index: 2;
   margin: 60px auto;
   background-color: #fff620;
   display: table;
}
.interview .contents_wrap,
.interview .contents_wrap_s{
   position: relative;
   z-index: 3;
}
.interview .interview_wrap h3,
.interview .effect_wrap h3{
   border-bottom: 1px solid #111;
   border-top: 1px solid #111;
   text-align: center;
   font-size: 38px;
   font-weight: 900;
   padding: 7px 0 6px 0; 
   position: relative;
   margin-bottom: 40px;
}
.interview .interview_wrap h3 span,
.interview .effect_wrap h3 span{
   color: #00a7ac;
   font-size: 18px;
   letter-spacing: 0.1em;
   text-align: left;
   position: absolute;
   top: 10px;
   left: 0;
   line-height: 1.0;
   font-weight: 900;
}
.interview .interview_wrap h3 span strong,
.interview .effect_wrap h3 span strong{
   font-size: 28px;
}
.interview .effect_wrap .textCenter{
   font-size: 22px;
   font-weight: 500;
   margin-top: 80px;
}
.interview .effect_wrap .contents_innerbox02 ul li a{
   width: 100%;
   display: block;
   opacity: 1.0;
   transition: opacity 0.2s ease-in;
}
.interview .effect_wrap .contents_innerbox02 ul li a:hover{
   opacity: 0.6;
}
.interview .effect_wrap .productivity_box .sp-table td{
   position: relative;
   padding: 0.4em 1em;
}
.interview .effect_wrap .productivity_box .sp-table td.allow39,
.interview .effect_wrap .productivity_box .sp-table td.allow20{
   font-size: 22px;
   font-weight: 800;
}
.interview .effect_wrap .productivity_box .sp-table td.allow39::after{
   background: url("../images/allow_39up.png") center center no-repeat;
}
.interview .effect_wrap .productivity_box .sp-table td.allow20::after{
   background: url("../images/allow_20up.png") center center no-repeat;
}
.interview .effect_wrap .productivity_box .sp-table td.allow39::after,
.interview .effect_wrap .productivity_box .sp-table td.allow20::after{
   position: absolute;
   content: "";
   background-size: contain;
   width: 118px;
   height: 44px;
   left: -59px;
   top: 5px;
}


.interview .interview_wrap .contents_innerbox{
   width: 800px;
   margin: 0 auto 100px;
}
.interview .interview_wrap .beforeafter_box{
   background: url("../images/ico_interview_kdive_pc.png") center center no-repeat;
   background-size: 160px;
   padding: 20px 0;
   display: flex;
}
.interview .interview_wrap .beforeafter_box02{
   background: url("../images/ico_interview_kdive_pc.png") left 200px center no-repeat;
   background-size: 160px;
}

.interview .interview_wrap .beforeafter_box p{
   border: 3px solid #111;
   border-radius: 10px;
   width: 320px;
   text-align: center;
   padding: 17px 0 16px;
   font-size: 20px;
   font-weight: 600;
   position: relative;
}
.interview .interview_wrap .beforeafter_box p:last-child{
   border: 3px solid #00a7ac;
   margin-left: 160px;    
   color: #00a7ac;
}
.interview .interview_wrap .contents_innerbox .beforeafter_box02 p:first-child{
   width: 200px;
}
.interview .interview_wrap .contents_innerbox .beforeafter_box02 p:last-child{
   width: 440px;
}
.interview .interview_wrap .beforeafter_box p::before{
   content: "Before";
   color: #ffffff;
   background: #111111;
   font-size: 14px;
   font-weight: 400;
   letter-spacing: 0.075em;
   padding: 2px 0 3px 0;
   line-height: 1.0;
   text-align: center;
   width: 60px;
   position: absolute;
   top: 0;
   left: 0;
}
.interview .interview_wrap .beforeafter_box p:last-child::before{
   content: "After";
   background: #00a7ac;
}
.interview .interview_wrap .voice_box > p{
   width: 100px;
   margin-right: 40px;
   font-size: 14px;
   text-align: center;
}
.interview .interview_wrap .voice_box > p img{
   margin-bottom: 8px; 
}
.interview .interview_wrap .voice_box > div p{
   background: #e4f7f7;
   border-radius: 10px;
   margin-bottom: 10px;
   font-size: 15px;
   padding: 20px;
   position: relative;
}
.interview .interview_wrap .voice_box > div p:last-child{
   margin-bottom: 0;
}
.interview .interview_wrap .voice_box > div p:after{
   content: "";
   position: absolute;
   left: -25px;
   top: 22px;
   width: 0;
   height: 0;
   border-style: solid;
   border-top: 12px solid transparent;
   border-bottom: 12px solid transparent;
   border-right: 25px solid #e4f7f7;
   border-left: 0;
}
.interview .interview_wrap .pht_box{
   width: 600px;
   margin: 40px auto 0;
}



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

.interview .interview_wrap{
   padding: 0;
}
.interview .interview_wrap h2{
   padding: 30px;
   font-size: 20px;
   line-height: 1.6;
   letter-spacing: 0.05em;
   position: relative;
   z-index: 2;
}
.interview .interview_wrap h2 span{
   font-size: 14px;
   padding: 4px 0 3px 0;
   width: 100px;
   margin: 0 auto 2px;
}
.interview .interview_wrap .contents_wrap{
   padding: 0 20px;
}
.interview .interview_wrap .contents_wrap .youtube_box{
 width: 100%;
   margin: -40px auto 40px;
}
.interview .interview_wrap .contents_wrap .youtube_box iframe{
   width: 100%;
   border: 0;
}
.interview .interview_wrap .contents_wrap h3{
   font-size: 18px;
   font-weight: 800;
   line-height: 1.4;
   padding: 10px 0 8px 0; 
   margin-bottom: 20px;
}
.interview .interview_wrap .contents_wrap h3 span{
   font-size: 12px;
   display: block;
   letter-spacing: 0.15em;
   text-align: center;
   position: relative;
   top: inherit;
   left: inherit;
   line-height: 1.0;
   margin-bottom: 5px;
}
.interview .interview_wrap .contents_wrap h3 span strong{
   font-size: 18px;
}
.interview .interview_wrap .contents_wrap .contents_innerbox{
   width: 100%;
   margin: 0 auto 40px;
}
.interview .interview_wrap .contents_wrap .beforeafter_box{
   background: url("../images/ico_interview_kdive_sp.png") center top 66px no-repeat;
   background-size: 75px;
   padding: 0;
   display: block;
}
.interview .interview_wrap .contents_wrap .beforeafter_box02{
   background: url("../images/ico_interview_kdive_sp.png") center top 66px no-repeat;
   background-size: 75px;
}

.interview .interview_wrap .contents_wrap .beforeafter_box p{
   width: 100%;
   font-size: 16px;
   border: 2px solid #111;
   padding: 0;
   line-height: 62px;
   font-weight: 600;
   position: relative;
}
.interview .interview_wrap .contents_wrap .beforeafter_box p:last-child{
   border: 2px solid #00a7ac;
   margin: 114px 0 30px 0;    
}
.interview .interview_wrap .contents_wrap .contents_innerbox .beforeafter_box02 p:first-child{
   width: 100%;
}
.interview .interview_wrap .contents_wrap .contents_innerbox .beforeafter_box02 p:last-child{
   width: 100%;
}

.interview .interview_wrap .contents_wrap .beforeafter_box p::before{
   content: "Before";
   background: #111111;
   font-size: 13px;
   font-weight: 400;
   letter-spacing: 0.075em;
   padding: 1px 0 3px 0;
   width: 60px;
   border-radius: 6px 0 0 0;
}
.interview .interview_wrap .contents_wrap .beforeafter_box p:last-child::before{
   content: "After";
   background: #00a7ac;
}
.interview .interview_wrap .contents_wrap .voice_box{
   display: block;
   margin: 30px auto;
}
.interview .interview_wrap .contents_wrap .voice_box > p{
   width: 100%;
   max-width: 100px;
   margin: 0 auto;
   font-size: 13.5px;
   text-align: center;
}
.interview .interview_wrap .contents_wrap .voice_box > p img{
   margin-bottom: 6px; 
}
.interview .interview_wrap .contents_wrap .voice_box > div{
   width: 100%;
   position: relative;
}
.interview .interview_wrap .contents_wrap .voice_box > div p{
   margin: 18px auto 0;
   font-size: 14.5px;
}
.interview .interview_wrap .contents_wrap .voice_box > div p:after{
   content: "";
   position: absolute;
   left: calc(50% - 10px);
   top: -15px;
   border-top: 0;
   border-bottom: 15px solid #e4f7f7;
   border-right: 10px solid transparent;
   border-left: 10px solid transparent;
}
.interview .interview_wrap .contents_wrap .pht_box{
   width: 100%;
   margin: 20px auto 40px;
}
.interview .interview_wrap h4, .interview .effect_wrap h4 {
   margin: 20px auto 50px;
   font-size: 18px;
   text-align: left;
   padding: 10px 10px 5px 10px;
   }
.interview .effect_wrap .productivity_box h4 {
   margin-top: 0;
}
.interview .effect_wrap .contents_wrap .textCenter {
   margin-top: 20px;
   font-size: 16px;
}
.interview .effect_wrap .productivity_box .sp-table td.allow39::after,
.interview .effect_wrap .productivity_box .sp-table td.allow20::after{
   width: 94px;
   height: 30px;
   left: -50px;
   top: 11px;
}

}

/* ===================================
   Benefits
=================================== */
.interview .benefits_wrap{}
.interview .benefits_wrap h2{
   color: #fff;
   text-align: center;
   padding: 140px 0 80px 0;
   background-color: #00a7ac;
   font-size: 30px;
   line-height: 1.6;
   letter-spacing: 0.05em;
   position: relative;
   z-index: 2;
   margin-top: -60px;
}
/*.interview .benefits_wrap h2 span{
   font-size: 17px;
   font-weight: 400;
   display: block;
   padding: 3px 0 3px 0;
   width: 120px;
   line-height: 1.0;
   border-radius: 20px;
   border: 2px solid #fff;
   margin: 0 auto 5px;
}*/
.interview .benefits_wrap .contents_wrap{
   width: 800px;
   margin: 0 auto 80px;
}
.interview .benefits_wrap .contents_wrap > p{
   margin: 60px 0;
}
.interview .benefits_wrap .contents_wrap p.link_case{
   text-align: center;
   font-size: 105%;
}
.interview .benefits_wrap .contents_wrap p.link_case a{
   text-decoration: underline;
}
.interview .benefits_wrap .contents_wrap p.link_case a:hover{
   text-decoration: none;
}
.interview .benefits_wrap .contents_wrap .topvoice_box{
   display: flex;
}
.interview .benefits_wrap .contents_wrap .topvoice_box p{
   width: 100px;
   text-align: center;
   font-size: 14px;
   margin-right: 40px;
}
.interview .benefits_wrap .contents_wrap .topvoice_box p strong{
   display: block;
}
.interview .benefits_wrap .contents_wrap .topvoice_box p img{
   margin-bottom: 8px;
}
.interview .benefits_wrap .contents_wrap .topvoice_box dl{
   width: 660px;
   background-color:#e4f7f7;
   border-radius: 10px;
   padding: 30px;
   position: relative;
}
.interview .benefits_wrap .contents_wrap .topvoice_box dl::after{
   content: "";
   position: absolute;
   left: -25px;
   top: 32px;
   width: 0;
   height: 0;
   border-style: solid;
   border-top: 12px solid transparent;
   border-bottom: 12px solid transparent;
   border-right: 25px solid #e4f7f7;
   border-left: 0;
}
.interview .benefits_wrap .contents_wrap .topvoice_box dl dt{
   padding-left: 16px;
   margin-bottom: 5px; 
   font-weight: 700;
   position: relative;
}
.interview .benefits_wrap .contents_wrap .topvoice_box dl dt::before{
   content: "";
   width: 8px;
   height: 8px;
   display: block;
   position: absolute;
   left: 0;
   top: 9px;
   line-height: 8px;
   background-color: #00a7ac;
   border-radius: 50%;
}
.interview .benefits_wrap .contents_wrap .topvoice_box dl dd{
   font-size: 15px;
   padding-bottom: 25px;
   margin-bottom: 25px;
   background: url("../images/bg_benefits_dot.png") left bottom repeat-x;
}
.interview .benefits_wrap .contents_wrap .topvoice_box dl dd:last-child{
   padding-bottom: 0px;
   margin-bottom: 0px;
   background: none;   
}



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

.interview .benefits_wrap{
   padding: 0;
}
.interview .benefits_wrap h2{
   padding: 70px 0 30px 0;
   font-size: 20px;
   margin-top: -40px;
}
.interview .benefits_wrap h2 span{
   font-size: 14px;
   padding: 4px 0 3px 0;
   width: 100px;
   margin: 0 auto 2px;
}
.interview .benefits_wrap .contents_wrap{
   width: 100%;
   padding: 0 20px;
   margin: 0 auto 50px;
}
.interview .benefits_wrap .contents_wrap > p{
   margin: 30px 0 40px 0;
}
.interview .benefits_wrap .contents_wrap p.link_case{
   text-align: left;
}
.interview .benefits_wrap .contents_wrap .topvoice_box{
   display: block;
}
.interview .benefits_wrap .contents_wrap .topvoice_box p{
   width: 100%;
   max-width: 100px;
   text-align: center;
   font-size: 13.5px;
   margin: 0 auto 20px;
}
.interview .benefits_wrap .contents_wrap .topvoice_box p strong{
   display: block;
}
.interview .benefits_wrap .contents_wrap .topvoice_box p img{
   margin-bottom: 8px;
}
.interview .benefits_wrap .contents_wrap .topvoice_box dl{
   width: 100%;
   padding: 25px 20px;
}
.interview .benefits_wrap .contents_wrap .topvoice_box dl::after{
   content: "";
   position: absolute;
   left: calc(50% - 10px);
   top: -15px;
   border-top: 0;
      border-bottom: 15px solid #e4f7f7;
      border-right: 10px solid transparent;
      border-left: 10px solid transparent;
}
.interview .benefits_wrap .contents_wrap .topvoice_box dl dt{
   padding-left: 14px;
}
.interview .benefits_wrap .contents_wrap .topvoice_box dl dd{
   font-size: 14.5px;
   padding-bottom: 20px;
   margin-bottom: 20px;
}

}

/* ===================================
   Point
=================================== */
.interview .point_wrap .contents_wrap {
   width: 1000px;
   margin: 0 auto 80px;
   position: relative;
}
.interview .point_wrap .contents_wrap::before{
   content: "";
   position: absolute;
   bottom: -150px;
   left: calc(50% - 25px);
   margin-left: -15px;
   border: 35px solid transparent;
   border-top: 35px solid #FFF;
   z-index: 2;
}
.interview .point_wrap h2{
   color: #fff;
   text-align: center;
   padding: 60px;
   background-color: #00a7ac;
   font-size: 30px;
   line-height: 1.6;
   letter-spacing: 0.05em;
   position: relative;
   z-index: 2;
   /*margin-top: -60px;*/
   margin-top: 80px;
}
/*.interview .point_wrap h2 span{
   font-size: 17px;
   font-weight: 400;
   display: block;
   padding: 3px 0 3px 0;
   width: 120px;
   line-height: 1.0;
   border-radius: 20px;
   border: 2px solid #fff;
   margin: 0 auto 5px;
}*/
.interview .point_wrap h3{
   text-align: center;
   font-size: 30px !important;
   font-weight: 900;
   padding: 12px 0;
   border-bottom: 1px solid #111;
   border-top: 1px solid #111;
   margin: 60px 0 40px 0!important;
   width: 100%;
}
.interview .point_wrap .contents_wrap .img_box{
   gap: 40px;
}
.interview .point_wrap .contents_wrap .img_box img{
   border-radius: 10px;
}
.interview .point_wrap .contents_wrap p{
   margin: 40px 0;
}
.interview .point_wrap .contents_wrap p.link_case{
   text-align: center;
   font-size: 105%;
}
.interview .point_wrap .contents_wrap p.link_case a{
   text-decoration: underline;
}
.interview .point_wrap .contents_wrap p.link_case a:hover{
   text-decoration: none;
}
.interview .point_wrap .contents_wrap .question{
   position: relative;
   padding-bottom: 40px;
}
.interview .point_wrap .contents_wrap .question > p{
   position: absolute;
   color: #00a7ac;
   font-size: 30px;
   bottom: 0;
   left: 0;
   right: 0;
   margin: 0 auto;
   text-align: center;
}
.interview .point_wrap .contents_wrap .topvoice_box{
   display: flex;
}
.interview .point_wrap .contents_wrap .topvoice_box p{
   width: 100px;
   text-align: center;
   font-size: 14px;
   margin-right: 40px;
}
.interview .point_wrap .contents_wrap .topvoice_box p strong{
   display: block;
}
.interview .point_wrap .contents_wrap .topvoice_box p img{
   margin-bottom: 8px;
}
.interview .point_wrap .contents_wrap .topvoice_box dl{
   width: 660px;
   background-color:#e4f7f7;
   border-radius: 10px;
   padding: 30px;
   position: relative;
}
.interview .point_wrap .contents_wrap .topvoice_box dl::after{
   content: "";
   position: absolute;
   left: -25px;
   top: 32px;
   width: 0;
   height: 0;
   border-style: solid;
   border-top: 12px solid transparent;
   border-bottom: 12px solid transparent;
   border-right: 25px solid #e4f7f7;
   border-left: 0;
}
.interview .point_wrap .contents_wrap .topvoice_box dl dt{
   padding-left: 16px;
   margin-bottom: 5px; 
   font-weight: 700;
   position: relative;
}
.interview .point_wrap .contents_wrap .topvoice_box dl dt::before{
   content: "";
   width: 8px;
   height: 8px;
   display: block;
   position: absolute;
   left: 0;
   top: 9px;
   line-height: 8px;
   background-color: #00a7ac;
   border-radius: 50%;
}
.interview .point_wrap .contents_wrap .topvoice_box dl dd{
   font-size: 15px;
   padding-bottom: 25px;
   margin-bottom: 25px;
   background: url("../images/bg_benefits_dot.png") left bottom repeat-x;
}
.interview .point_wrap .contents_wrap .topvoice_box dl dd:last-child{
   padding-bottom: 0px;
   margin-bottom: 0px;
   background: none;   
}

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

.interview .point_wrap{
   padding: 0;
}
.interview .point_wrap h2{
   padding: 30px 0;
   font-size: 20px;
   margin-top: -40px;
}
.interview .point_wrap h2 span{
   font-size: 14px;
   padding: 4px 0 3px 0;
   width: 100px;
   margin: 0 auto 2px;
}
.interview .point_wrap h3{
   text-align: left;
   font-size: 18px !important;
   font-weight: 700;
   line-height: 1.4;
   padding: 12px 0 10px 0;
   margin: 30px 0 !important;
}

.interview .point_wrap .contents_wrap{
   width: 100%;
   padding: 0 20px;
   margin: 0 auto 50px;
}
.interview .point_wrap .contents_wrap > p{
   margin: 30px 0 40px 0;
}
.interview .point_wrap .contents_wrap p.link_case{
   text-align: left;
}
.interview .point_wrap .contents_wrap .question{
   padding-bottom: 80px;
}
.interview .point_wrap .contents_wrap .question > p{
   font-size: 20px;
}

.interview .point_wrap .contents_wrap .topvoice_box{
   display: block;
}
.interview .point_wrap .contents_wrap .topvoice_box p{
   width: 100%;
   max-width: 100px;
   text-align: center;
   font-size: 13.5px;
   margin: 0 auto 20px;
}
.interview .point_wrap .contents_wrap .topvoice_box p strong{
   display: block;
}
.interview .point_wrap .contents_wrap .topvoice_box p img{
   margin-bottom: 8px;
}
.interview .point_wrap .contents_wrap .topvoice_box dl{
   width: 100%;
   padding: 25px 20px;
}
.interview .point_wrap .contents_wrap .topvoice_box dl::after{
   content: "";
   position: absolute;
   left: calc(50% - 10px);
   top: -15px;
   border-top: 0;
      border-bottom: 15px solid #e4f7f7;
      border-right: 10px solid transparent;
      border-left: 10px solid transparent;
}
.interview .point_wrap .contents_wrap .topvoice_box dl dt{
   padding-left: 14px;
}
.interview .point_wrap .contents_wrap .topvoice_box dl dd{
   font-size: 14.5px;
   padding-bottom: 20px;
   margin-bottom: 20px;
}

}

/* ===================================
   Effect
=================================== */
.interview .effect_wrap h2{
   color: #fff;
   text-align: center;
   padding: 60px 0;
   background-color: #00a7ac;
   font-size: 30px;
   line-height: 1.6;
   letter-spacing: 0.05em;
   position: relative;
   z-index: 2;
}
/*.interview .effect_wrap h2 span{
   font-size: 17px;
   font-weight: 400;
   display: block;
   padding: 3px 0 3px 0;
   width: 120px;
   line-height: 1.0;
   border-radius: 20px;
   border: 2px solid #fff;
   margin: 0 auto 5px;
}*/
.interview .effect_wrap .contents_wrap{
   /*padding-bottom: 60px;
   margin-bottom: 20px;*/
   z-index: 4;
}
.interview .aeffect_wrap .contents_wrap:nth-of-type(1){
   margin-top: -80px;
}
.interview .effect_wrap .contents_wrap:nth-of-type(3){
   margin-bottom: 0;
}
.interview .effect_wrap .contents_wrap .contents_innerbox01{
   display: flex;
}
.interview .effect_wrap .contents_wrap .contents_innerbox01 > div{
   width: 48%;
   margin-right: 4%;
}
.interview .effect_wrap .contents_wrap .contents_innerbox01 > p{
   width: 48%
}
.interview .effect_wrap .contents_wrap .contents_innerbox02{
   width: 100%;
   margin: 0 auto;
   padding: 20px 0;
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul{
   display: flex;
   justify-content: space-between;
   margin: 40px auto 0;
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul li{
   width: 24%;
   border: 1px solid #00a7ac;
   border-radius: 10px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul li div{
   position: relative;
   text-align: center;
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul li span{
   color: #00a7ac;
   font-size: 1.4em;
   font-weight: 800;
   margin-left: 10px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul li div img{
   height: 80px;
   width: auto;
   margin-bottom: 20px;
}

.interview .effect_wrap .contents_wrap .contents_innerbox02 ul li .btb_erea{
   width: 100%;
   font-size: 18px;
   font-weight: bold;
   color: #333;
   padding: 8px 15px;
   background-color: #E4F7F7;
   display: inline-block;
   border-radius: 0 0 10px 10px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul li .btb_erea::before{
   content: "";
   display: inline-block;
   width: 17px;
   height: 17px;
   background-image: url("../images/ico_link.png"); 
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
   position: absolute;
   left: 69px;
   top: 50%; 
   transform: translateY(-50%);
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul li h4{
   color: #00a7ac;
   margin-bottom: 10px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul li p{
   font-size: 14.5px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox03{
   width: 800px;
   margin: 30px auto 0px auto;
}
.interview .effect_wrap .contents_wrap .contents_innerbox03 ul li{
   background: #e4f7f7;
   border-radius: 10px;
   padding:12px 50px 10px 50px;
   margin-bottom: 10px;
   font-size: 15px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox03 ul li:last-child{
   margin-bottom: 0px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox03 ul li span{
   display: block;
   text-align: right;
}

.effect_wrap .contents_wrap h3 {
   border-bottom: 1px solid #111;
   border-top: 1px solid #111;
   text-align: center;
   font-size: 30px !important;
   font-weight: 900;
   padding: 12px 0 6px 0;
   position: relative;
   margin-top: 60px!important;
   display: flex;
   justify-content: center;
}
.effect_wrap .contents_wrap h3 span {
   color: #00a7ac;
   font-size: 18px;
   letter-spacing: 0.1em;
   text-align: left;
   position: absolute;
   top: 10px;
   left: 0;
   line-height: 1.0;
   font-weight: 900;
}
.effect_wrap .contents_wrap h3 span strong {
   font-size: 25px;
}
.effect_wrap .contents_wrap h3 img{
   height: 40px;
   width: auto;
   margin-right: 15px;
   padding-top: 2px;
}

.interview .effect_wrap #photo_box{
   position: relative;
   z-index: 3;
}
.interview .effect_wrap #photo_box li{
   width: 440px;   
   box-sizing: border-box;
}
.interview .effect_wrap #photo_box li img{
   width: 96%;
   border: 3px solid #fff;
   box-sizing: border-box;
   border-radius: 10px;
}

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

.interview .effect_wrap{
   padding: 0;
}
.interview .effect_wrap h2{
   padding: 30px 0;
   font-size: 20px;
}
.interview .effect_wrap h2 span{
   font-size: 14px;
   padding: 4px 0 3px 0;
   width: 100px;
   margin: 0 auto 2px;
}
.interview .effect_wrap .contents_wrap{
   width: calc(100% - 40px);
   /* padding: 20px 0; */
   margin: 0 auto 20px;
}

.interview .effect_wrap .contents_wrap .contents_wrap{
   width: 100%;
}

/* .interview .effect_wrap .contents_wrap:nth-of-type(1){
   margin-top: -40px;
} */
.interview .effect_wrap .contents_wrap h3{
   font-size: 16px;
   line-height: 1.6;
   margin-top: 30px !important;
   margin-bottom: 20px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox01{
   display: block;
}
.interview .aeffect_wrap .contents_wrap .contents_innerbox01 > div{
   width: 100%;
   margin-right: 0;
}
.interview .effect_wrap .contents_wrap .contents_innerbox01 > p{
   margin-top: 20px;
   width: 100%
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul{
   display: block;
   justify-content: inherit;
   margin: 0;
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul{
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul li{
   width: 49%;
   margin-bottom: 8px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul li .btb_erea::before {
   left: 24px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul li div img{
   height: 60px;
   margin-bottom: 20px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul li h4{
   margin-bottom: 5px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox02 ul li p{
   font-size: 14.5px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox03{
   width: 100%;
   margin: 30px auto 0px auto;
}
.interview .effect_wrap .contents_wrap .contents_innerbox03 ul li{
   padding: 20px;
   margin-bottom: 10px;
   font-size: 14.5px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox03 ul li:last-child{
   margin-bottom: 0px;
}
.interview .effect_wrap .contents_wrap .contents_innerbox03 ul li span{
   margin-top: 5px;
}
.interview .effect_wrap #photo_box{
   position: relative;
   z-index: 3;
}
.interview .effect_wrap #photo_box li{
   width: 220px;
}
.interview .effect_wrap #photo_box li img{
   width: 96%;
   border: 2px solid #fff;
   box-sizing: border-box;
   border-radius: 10px;
}
.interview .effect_wrap .contents_wrap {
   padding-bottom: 15px;
}
}

/* ===================================
   About
=================================== */
/* .interview .about_wrap{
   background: #e4f7f7;
} */
.interview .about_wrap h2{
   color: #fff;
   text-align: center;
   padding: 80px 0 140px 0;
   background-color: #00a7ac;
   font-size: 30px;
   line-height: 1.6;
   letter-spacing: 0.05em;
   position: relative;
   z-index: 2;
}
/*.interview .about_wrap h2 span{
   font-size: 17px;
   font-weight: 400;
   display: block;
   padding: 3px 0 3px 0;
   width: 120px;
   line-height: 1.0;
   border-radius: 20px;
   border: 2px solid #fff;
   margin: 0 auto 5px;
}*/
.interview .about_wrap .contents_wrap{
   background-color: #FFF;
   border: 1px solid #00a7ac;
   border-radius: 10px;
   position: relative;
   padding: 40px 50px 50px 50px;
   margin-bottom: 20px;
   z-index: 4;
}
.interview .about_wrap .contents_wrap:nth-of-type(1) {
   margin-top: -80px;
}
.interview .about_wrap .contents_wrap:nth-of-type(3){
   margin-bottom: 0;
}
.interview .about_wrap .contents_wrap h3{
   font-size: 20px;
   margin-bottom: 20px;
}
.interview .about_wrap .contents_wrap .contents_innerbox01{
   display: flex;
}
.interview .about_wrap .contents_wrap .contents_innerbox01 > div{
   width: 48%;
   margin-right: 4%;
}
.interview .about_wrap .contents_wrap .contents_innerbox01 > p{
   width: 48%
}
.interview .about_wrap .contents_wrap .contents_innerbox02{}
.interview .about_wrap .contents_wrap .contents_innerbox02 ul{
   display: flex;
   justify-content: center;
   margin: 40px auto 0;
}
.interview .about_wrap .contents_wrap .contents_innerbox02 ul li{
   width: 280px;
   padding: 0 25px;
   border-right: 1px solid #dddddd;
}
.interview .about_wrap .contents_wrap .contents_innerbox02 ul li:last-child{
   border-right: 0;
}
.interview .about_wrap .contents_wrap .contents_innerbox02 ul li div{
   position: relative;
   text-align: center;
}
.interview .about_wrap .contents_wrap .contents_innerbox02 ul li div span{
   position: absolute;
   top: 0;
   left: 0;
   color: #00a7ac;
}
.interview .about_wrap .contents_wrap .contents_innerbox02 ul li div img{
   width: 94px;
   margin-bottom: 20px;
}
.interview .about_wrap .contents_wrap .contents_innerbox02 ul li h4{
   color: #00a7ac;
   margin-bottom: 10px;
}
.interview .about_wrap .contents_wrap .contents_innerbox02 ul li p{
   font-size: 14.5px;
}
.interview .about_wrap .contents_wrap .contents_innerbox03{
   width: 800px;
   margin: 30px auto 0px auto;
}
.interview .about_wrap .contents_wrap .contents_innerbox03 ul{}
.interview .about_wrap .contents_wrap .contents_innerbox03 ul li{
   background: #e4f7f7;
   border-radius: 10px;
   padding:12px 50px 10px 50px;
   margin-bottom: 10px;
   font-size: 15px;
}
.interview .about_wrap .contents_wrap .contents_innerbox03 ul li:last-child{
   margin-bottom: 0px;
}
.interview .about_wrap .contents_wrap .contents_innerbox03 ul li span{
   display: block;
   text-align: right;
}



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

.interview .about_wrap{
   padding: 0;
}
.interview .about_wrap h2{
   padding: 30px 0 70px 0;
   font-size: 20px;
}
.interview .about_wrap h2 span{
   font-size: 14px;
   padding: 4px 0 3px 0;
   width: 100px;
   margin: 0 auto 2px;
}
.interview .about_wrap .contents_wrap{
   width: calc(100% - 40px);
   padding: 20px;
   margin: 0 auto 20px;
}
.interview .about_wrap .contents_wrap:nth-of-type(1){
   margin-top: -40px;
}
.interview .about_wrap .contents_wrap h3{
   font-size: 16px;
   line-height: 1.6;
   margin-bottom: 20px;
}
.interview .about_wrap .contents_wrap .contents_innerbox01{
   display: block;
}
.interview .about_wrap .contents_wrap .contents_innerbox01 > div{
   width: 100%;
   margin-right: 0;
}
.interview .about_wrap .contents_wrap .contents_innerbox01 > p{
   margin-top: 20px;
   width: 100%
}
.interview .about_wrap .contents_wrap .contents_innerbox02{}
.interview .about_wrap .contents_wrap .contents_innerbox02 ul{
   display: block;
   justify-content: inherit;
   margin: 40px auto 0;
}
.interview .about_wrap .contents_wrap .contents_innerbox02 ul li{
   width: 100%;
   padding: 0 0 25px 0;
   margin-bottom: 25px;
   border-right: 0;
   border-bottom: 1px dotted #00a7ac;
}
.interview .about_wrap .contents_wrap .contents_innerbox02 ul li:last-child{
   border-bottom: 0;
   padding: 0;
   margin-bottom: 0;
}
.interview .about_wrap .contents_wrap .contents_innerbox02 ul li div img{
   width: 100px;
   margin-bottom: 10px;
}
.interview .about_wrap .contents_wrap .contents_innerbox02 ul li h4{
   margin-bottom: 5px;
}
.interview .about_wrap .contents_wrap .contents_innerbox02 ul li p{
   font-size: 14.5px;
}
.interview .about_wrap .contents_wrap .contents_innerbox03{
   width: 100%;
   margin: 30px auto 0px auto;
}
.interview .about_wrap .contents_wrap .contents_innerbox03 ul{}
.interview .about_wrap .contents_wrap .contents_innerbox03 ul li{
   padding: 20px;
   margin-bottom: 10px;
   font-size: 14.5px;
}
.interview .about_wrap .contents_wrap .contents_innerbox03 ul li:last-child{
   margin-bottom: 0px;
}
.interview .about_wrap .contents_wrap .contents_innerbox03 ul li span{
   margin-top: 5px;
}
}

/* ===================================
   cta_btn
=================================== */
.interview .cta_download,
.interview .point_wrap.cta_download{
   margin: 80px auto 40px;
   /* width: 760px; */
   text-align: center;   
}
.interview .cta_download p,
.interview .point_wrap .cta_download p{
   font-size: 15px;
}
.interview .cta_download p strong,
.interview .point_wrap .cta_download p strong{
   font-size: 18px;
   margin-bottom: 3px;
}
.interview .cta_download a,
.interview .point_wrap .cta_download a{
   margin-top: 20px;
   display: block;
   opacity: 1.0;
   transition: all .15s ease-out;
}
.interview .cta_download a:hover,
.interview .point_wrap .cta_download a:hover{
   opacity: 0.8;
}

.interview .cta_box,
.interview .point_wrap .cta_box{
   width: 1000px;
   margin: 0 auto;
   padding: 0 0 100px 0;
   display: flex;
}
.interview .cta_box div,
.interview .point_wrap .cta_box div{
   text-align: center;
   width: 485px;
   margin-right: 30px;
}
.interview .cta_box div:last-child,
.interview .point_wrap .cta_box div:last-child{
   margin-right: 0;
}
.interview .cta_box div a,
.interview .point_wrap .cta_box div a{
   display: block;
   font-size: 20px;
   font-weight: 700;
   border-radius: 50px;
   border: 2px solid #00a7ac;
   background: url("../images/logo_k-dive.png") #fff left 70px center no-repeat;
   background-size: 56px;
   color: #00a7ac;
   opacity: 1.0;
   transition: all .15s ease-out;
   padding: 0 0 0 35px;
   line-height: 80px;
   margin-top: 20px;
}
.interview .cta_box div a:hover,
.interview .point_wrap .cta_box div a:hover{
   opacity: 0.7;
}
.interview .cta_box div:last-child a,
.interview .point_wrap .cta_box div:last-child a{
   background: url("../images/ico_cta_inquiry_w.png") #00a7ac left 150px center no-repeat;
   background-size: 35px;
   color: #FFFFFF;   
}
.interview .cta_box p,
.interview .point_wrap .cta_box p{
   font-size: 15px;
}
.interview .cta_box p strong,
.interview .point_wrap .cta_box p strong{
   font-size: 18px;
   margin-bottom: 3px;
}
.interview .cta_download,
.interview .point_wrap .cta_download{
   background: url('../images/img_interview_cta_bg.png') no-repeat center center;
   background-size: cover;
}
.interview .cta_flex,
.interview .point_wrap .cta_flex{
   display: flex;
   justify-content: center;
    gap: 80px;
   padding: 60px 0 40px 0;
   margin-bottom: 0;
}
.interview .cta_flex{
   margin-bottom: 40px;
}
.interview .about_wrap .cta_flex .cta_img{
   max-width: 50%;
}
.interview .about_wrap .cta_flex .cta_img img{
   vertical-align: inherit;
}
.interview .cta_download .btn_area,
.interview .point_wrap .cta_download .btn_area{
   padding-left: 2%;
   margin-top: 20px;
   text-align: left;
}
.interview .cta_download .btn_area p,
.interview .point_wrap .cta_download .btn_area p{
   color: #333f48;
   font-size: 18px;
   font-weight: 500;
   line-height: 1.7;
   letter-spacing: 0.05em;
}
.interview .cta_download .btn_area p span,
.interview .point_wrap .cta_download .btn_area p span{
   font-size: 22px;
   font-weight: 700;
   display: block;
   letter-spacing: 0.15em;
}
.interview .cta_download .btn_area p strong,
.interview .point_wrap .cta_download .btn_area p strong{
   font-size: 50px;
   font-weight: 900;
   letter-spacing: 0;
}
/*.interview .cta_download .btn_area a,
.interview .point_wrap .cta_download .btn_area a {
   display: flex;
   align-items: center;
   justify-content: center;
   line-height: 1;
   text-decoration: none;
   color: #ffffff;
   font-size: 1.3em;
   padding: 25px 20px 25px 30px;
   border-radius: 50px;
   font-weight: bold;
   transition: 0.3s;
   background-image: linear-gradient(65deg, rgba(58, 154, 206, 1) 27%, rgba(82, 199, 192, 1));
   width: 100%;
   box-sizing: border-box;
}
.interview .cta_download .btn_area a:hover,
.interview .point_wrap .cta_download .btn_area a:hover {
   opacity: .5;
}*/


.interview .cta_download .btn_area a,
.interview .point_wrap .cta_download .btn_area a {
   display: block;
   text-align: center;
   background: linear-gradient(65deg, #359cd5 0%, #56c2bf 50%, #359cd5 100%);
   background-size: 200% 100%;
   width: 100%;
   box-sizing: border-box;
   line-height: 1;
   padding: 25px 20px 25px 30px; 
   border-radius: 50px;
   color: #ffffff;
   font-size: 1.4em;
   letter-spacing: 0.075em;
   font-weight: 600;
   transition: all .25s ease-in;
}
.interview .cta_download .btn_area a:hover,
.interview .point_wrap .cta_download .btn_area a:hover {
   background-position: 100% 0;
}
.interview .cta_download .cta_img img{
   vertical-align: inherit;
}

@media screen and (max-width: 767px){
.interview .cta_download,
.interview .point_wrap .cta_download{
   margin: 40px auto 0;
   width: 100%;
}
.interview .about_wrap .cta_download{
   margin: 40px auto;
}

.interview .cta_download p,
.interview .point_wrap .cta_download p{
   font-size: 14px;
}
.interview .cta_download p strong,
.interview .point_wrap .cta_download p strong{
   font-size: 16px;
}
.interview .cta_download a,
.interview .point_wrap .cta_download a{
   padding: 0 20px;
   margin: 10px auto 20px;
}
.interview .cta_download a:hover,
.interview .point_wrap .cta_download a:hover{
   opacity: 1.0;
}
.interview .cta_box,
.interview .point_wrap .cta_box{
   width: 100%;
   margin: 0 auto;
   padding: 0 20px 60px 20px;
   display: block;
}
.interview .cta_box div,
.interview .point_wrap.cta_box div{
   width: 100%;
   margin-right: 0;
}
.interview .cta_box div a,
.interview .point_wrap.cta_box div a{
   font-size: 16px;
   border-radius: 30px;
   background: url("../images/logo_k-dive.png") #fff left 26px center no-repeat;
   background-size: 44px;
   transition: none;
   padding: 0 0 0 10px;
   line-height: 60px;
   letter-spacing: 0.04em;
   margin: 10px auto 30px;
}
.interview .cta_box div a:hover,
.interview .point_wrap .cta_box div a:hover{
   opacity: 1.0;
}
.interview .cta_box div:last-child a,
.interview .point_wrap .cta_box div:last-child a{
   background: url("../images/ico_cta_inquiry_w.png") #00a7ac left 78px center no-repeat;
   background-size: 28px;
   margin: 10px auto 0;
}
.interview .cta_box p,
.interview .point_wrap .cta_box p{
   font-size: 14px;
}
.interview .cta_box p strong,
.interview .point_wrap .cta_box p strong{
   font-size: 16px;
   margin-bottom: 3px;
}
.interview .cta_box div,
.interview .point_wrap .cta_box div{
   width: 100%;
   margin-right: 0;
}
.interview .cta_box div a,
.interview .point_wrap .cta_box div a{
   font-size: 16px;
   border-radius: 30px;
   background: url(../images/logo_k-dive.png) #fff left 26px center no-repeat;
   background-size: 44px;
   transition: none;
   padding: 0 0 0 10px;
   line-height: 60px;
   letter-spacing: 0.04em;
   margin: 10px auto 30px;
}
.interview  .cta_flex,
.interview .point_wrap .cta_flex{
   display: block;
   padding: 40px 20px 35px 20px;
}
.interview .cta_download .btn_area,
.interview .point_wrap .cta_download .btn_area {
   padding-left: 0;
   margin-top: 0;
   text-align: center;
}
.interview .cta_download .btn_area a,
.interview .point_wrap .cta_download .btn_area a {
   font-size: 1.1em;
   padding: 18px 0;
   width: 100%;
   text-align: center;
   margin: 20px auto 30px auto;
}
.interview .contents_wrap::before,
.interview .point_wrap .contents_wrap::before {
   bottom: -100px;
   left: 50%;
   margin-left: -20px;
   border: 25px solid transparent;
   border-top: 25px solid #FFF;
}
.interview .about_wrap .cta_flex .cta_img{
   max-width: 100%;
}


.interview .cta_download .btn_area p,
.interview .point_wrap .cta_download .btn_area p{
   color: #333f48;
   font-size: 15px;
   line-height: 1.7;
   letter-spacing: 0;
}
.interview .cta_download .btn_area p span,
.interview .point_wrap .cta_download .btn_area p span{
   font-size: 16px;
}
.interview .cta_download .btn_area p strong,
.interview .point_wrap .cta_download .btn_area p strong{
   font-size: 30px;
}



}

/* ===================================
   追加分
=================================== */
.introduction_innerbox{
   width: 900px;
   margin: 0 auto;
}
#introduction .flex_box,
#anc_about .flex_box,
#effect .flex_box{
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
   align-items: center;
}
/*#introduction .flex_box .image_box,
#anc_about .flex_box .image_box,
#effect .flex_box .image_box{
   margin-left: 40px;
}*/
#introduction .green_box,
#anc_about .green_box,
#effect .green_box{
   background-color: #E4F7F7;
   width: 650px;
   min-width: 72%;
   height: max-content;
   padding: 50px 30px 30px 30px;
   border-radius: 10px;
   position: relative;
}
#introduction .green_box p,
#anc_about .green_box p,
#effect .green_box p{
   background-color: #00A7AC;
   position: absolute;
   padding: 8px 18px 6px 40px;
   border-radius: 5px;
   top: -20px;
   left: 30px;
   color: #fff;
   font-weight: bold;
}
/*#anc_about .green_box p,
#effect .green_box p{
   top: 11%;
   width: 130px;
   text-align: center;
   padding-left:11px;
}
#anc_about .green_box .top8,
#effect .green_box .top8{
   top: 11%;
}
#effect .green_box .top9{
   top: 9%;
}
#anc_about .green_box .top15,
#effect .green_box .top15{
   top: 11%;
}*/
#introduction .green_box p::before,
#anc_about .green_box p::before,
#effect .green_box p::before{
   content: "";
   position: absolute;
   bottom: -19px;
   left: 50%;
   margin-left: -12px;
   border: 10px solid transparent;
   border-top: 10px solid #00A7AC;
}

.green_box p::after{
   content: "";
   display: block;
   width: 20px;
   height: 19px;
   background-image: url("../images/ico.png"); 
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
   position: absolute;
   left: 12px;
   top: 50%; 
   transform: translateY(-50%);
}
.green_box .point::after{
   content: "";
   display: inline-block;
   height: 24px;
   background-image: url("../images/ico_point.png"); 
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
   position: absolute;
   left: 8px;
   top: 50%; 
   transform: translateY(-50%);
}
#anc_about .green_box p:after,
#effect .green_box p:after{
   left: 15px;
}
.green_box .check_box {
   padding-left: 0;
   font-weight: bold;
}
.green_box .check_box li {
   position: relative;
   padding-left: 30px;
   margin-bottom: 12px;
   line-height: 1.5;
   font-size: 1.05em;
   font-weight: 600;
}
.green_box .check_box li::before {
   content: "";
   display: block;
   width: 20px;
   height: 22px;
   background-image: url("../images/ico_checkbox.png"); 
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
   position: absolute;
   left: 0; 
   top: 50%; 
   transform: translateY(-50%);
}
#introduction .txt_box,
#anc_about .txt_box,
#effect .txt_box{
   margin: 40px 0;
}
/*#introduction .txt_box p,
#anc_about .txt_box p,
#effect .txt_box p{
   margin-bottom: 20px;
}*/
.interview .contents_wrap .text_deco,
.interview .contents_wrap_s .text_deco{
   font-size: 1.1em;
   font-weight: bold;
   border-left:5px solid #00A7AC;
   padding:0 8px;
   margin-bottom: 20px;
}
@media screen and (max-width: 767px){
   #introduction .flex_box, #anc_about .flex_box, #effect .flex_box{
   display: block;
}
#introduction .flex_box .image_box, #anc_about .flex_box .image_box,
#effect .flex_box .image_box{
   max-width: 50%;
   margin: 20px auto;
}
#introduction .green_box, #anc_about .green_box,
#effect .green_box {
   max-width: 100%;
   padding: 40px 15px 15px 15px;
}
.introduction_innerbox {
   width: 100%;
}
#introduction .green_box p, #anc_about .green_box p,
#effect .green_box p,#anc_about .green_box .top8,#effect .green_box .top8,
#anc_about .green_box .top15,#effect .green_box .top15{
   top: -20px;
   left: 0;   
}

.green_box .check_box li {
   padding-left: 26px;
   font-size: 1em;
}
.green_box .check_box li::before {
   content: "";
   display: block;
   width: 18px;
   height: 18px;
}
.green_box .check_box li::before {
   top: 23%;
}

#introduction .txt_box,
#anc_about .txt_box,
#effect .txt_box{
   margin: 30px 0;
}

}

/* ===================================
   テーブル
=================================== */
.table-area{
   width: 100%;
   margin: 0 auto;
   overflow-x: hidden;
   margin-bottom: 60px!important;
}

table.sp-table{
   width: 100%;
   margin: 5em auto 2em;
   min-width: auto;
   table-layout: auto;
   box-sizing: border-box;
}

table.sp-table,
table.sp-table td,
table.sp-table th{
   border: 1px solid #d3d3d3;
   border-collapse: collapse;
}

table.sp-table td,
table.sp-table th{
   padding: 0.8em 1em;
   text-align: center;
   line-height: 1.6;
   box-sizing: border-box;
}
.introduction_innerbox table.sp-table td{
   text-align: left;
}

table.sp-table th{
   color: #333;
   background-color: #e4f7f7;
   font-weight: 500;
}

table.sp-table .bg_green th{
   background-color: #00A7AC;
   color: #fff;
}

@media screen and (max-width: 767px){
   .table-area{
      overflow-x: auto;
      margin-bottom: 20px !important;
   }
   .interview main table.sp-table{
      min-width: 560px;
      table-layout: fixed;
      margin-bottom: 10px;
   }
   .table-area::-webkit-scrollbar{
      height: 0.75em;
      background-color: #eee;
      border-radius: 0.6rem;
   }
   .table-area::-webkit-scrollbar-thumb{
      background-color:#ccc;
      border-radius: 0.6rem;
   }
   .table-area::-webkit-scrollbar-thumb:hover{
      background-color: #888;
   }
   table.sp-table td,
   table.sp-table th{
      padding: 0.8em;
      font-size: 14px;
   }
}

.img_box{
   display: flex;
   justify-content: space-between;
   gap: 10px;
}
.img_box img{
   width: 100%;
   height: auto;
}
@media screen and (max-width: 767px){
.img_box{
   display: block;
}
.img_box img:first-of-type{
   margin-bottom: 15px;
}
}

