@charset "utf-8";


/*  */
.subhead_ttl_en,.subhead_ttl_jp{
    filter: drop-shadow(0px 0px 6px black);
    text-shadow: #000000 1px 0 10px;
}
.subhead_bg{
    background-color: #001e42;
}
.subhead{
    background: url(../img/interview/subhead.jpg) no-repeat;
    /* max-width: 1920px; */
    margin: 0 auto;
    background-size: cover;
    background-color: #001e42;
    /* background-position: center bottom 20%; */
    background-position: center bottom 5%;
   /* height: 45vw;*/
	height: 600px;
    width: 100%;
}


.sec_link{
    padding-top: 100px;
    margin-top: -100px;
}


.interview_ttl_box{
    position: absolute;
    bottom: -30px;
    left: 30%;
    transform: translate(-50%, -50%);
    width: 40%;
    
	}
	.intv_nav{
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		margin-top: 50px;
		
		}
	.intv_nav div{
		max-width: 250px;
	}
	.intv_nav a:hover{
		opacity: 0.6 !important;
		transition: 0.5s;
	}
	.comingsoon{
		position: relative;
	}
	.comingsoon a::before {
	  content: "";
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  background: rgba(0, 0, 0, 0.5); /* 黒の透過 */
	  z-index: 1;
	}
	.comingsoon span {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  color: #fff;
	  font-size: 16px;
	  font-weight: bold;
	  z-index: 2;
	  text-align: center;
	  white-space: nowrap;
	}
	.bg_yellow{
		background-color: #faf6eb;
		padding-bottom: 80px;
	}
	.bnr1{
		margin-top: 80px;
		margin-bottom: 20px;
		}
	
    .flexbox {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 40px;
	  padding: 30px 0;
    }

    /* 左カラム（画像縦並び） */
    .image-block {
      flex: 0 0 430px;
      display: flex;
      flex-direction: column;
      gap: 30px;
    }
	.in_img{
		position: relative;
	}
	.img_cap{
		-webkit-text-stroke: 2px #403b3b;
		text-stroke: 2px black;
		paint-order: stroke;
	}
    .image-block img {
      width: 100%;
      display: block;
    }

    /* 右カラム（テキスト） */
    .text-block {
      flex: 1;
    }
    .text-block h2 {
      font-size: 26px;
      color: #007080;
      margin-bottom: 30px;
    }
    .text-block p {
      margin: 30px 0 15px;
	  line-height: 1.8;
    }
    .q {
      font-weight: bold;
      margin-top: 20px;
      color: #444;
    }
    .a {
     
    }
	.a-grid {
	  display: grid;
	  grid-template-columns: 4.5em 1fr; 
	  gap: 0.75em;                     
	  margin: 0 0 1.2em;
	  align-items: start;              
	  line-height: 1.9;
	}
	.speaker {
	  font-weight: 700;
	  color: #333;
	}
	.speech {
	  /* 必要ならここでテキスト装飾 */
	}
	.marker {
	  background: linear-gradient(transparent 80%, #ffd700 80%);
	  display: inline;

	  /* 背景の繰り返しを停止 */
	  background-repeat: no-repeat;

	  /* マーカーの横方向を0にして縮める */
	  background-size: 0% 100%;

	  /* マーカーが引かれる速度を指定 */
	  transition:background-size 1.5s;
	}

	/* マーカーが引かれる際に付与するクラス */
	.marker.on {
	  /* 横方向を100%にして、マーカーを引く */
	  background-size: 100% 100%;
	}
	.int_db1000{
		display: none;
	}

    /* スマホ対応 */
    @media (max-width: 1000px) {
      .flexbox {
        flex-direction: column;
      }
      .image-block {
        flex: none;
        width: 100%;
      }
		.intv_nav {
			justify-content: center;
			gap:20px;
			row-gap:20px;
    	}
		.int_db1000{
			display: block;
		}
		.int_dn1000{
			display: none;
		}
	}
	@media (max-width: 650px){
		.subhead{
			background: url("../img/interview/subhead_sp.jpg") no-repeat;
			background-size: cover;
			background-position: top center;
			height: 600px;
		}
		.interview_ttl_box{
			left: 50%;
    		width: 80%;
		}
		.sec_ttl {
        	font-size: 18px!important;
    	}
		.text-block h2 {
			text-align: center;
		}
		.intv_nav div {
			max-width: 48%;
		}
		.intv_nav {
    		gap: inherit;
            justify-content: space-between;
            row-gap: 15px;
		}
	}



.intv2 .text-block h2 {
	color: #996488;
}
.speaker.partner{
	letter-spacing: -1px;
    font-size: 13px;
}
.intv3 .text-block h2 {
	color: #996448;
}
.intv4 .text-block h2 {
	color: #998651;
}