@charset "utf-8";

/* =====================================================
  voices
===================================================== */
#authense_voices{
	margin-bottom: 12.5rem;
}
#authense_voices .sectionhead{
	position: relative;
	padding-bottom: 2rem;
}
#authense_voices .sectionhead h2{
	font-size: 2rem;
	font-weight: 500;
	line-height: 2;
	letter-spacing: 0.03em;
}
.voices_index ul{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	column-gap: 3.125rem;
}
.voices_index ul li{
	position: relative;
	width:calc((100% - 9.375rem) / 4);
	height: 100%;
}
.voices_index ul li::before,.voices_index ul li::after{
	position: absolute;
	top: 0;
	left: 0;
	content: "";
	display: block;
	height: 1px;
}
.voices_index ul li::before{
	background: #ccd2de;
	width: 100%;
}
.voices_index ul li::after{
	background: #143369;
	width: 0%;
	transition: .3s;
}
.voices_index ul li:hover::after{
	width: 100%;
}
.voices_index ul li a{
	position: relative;
	display: block;
}
.voices_index ul li a p{
	font-size: 1.25rem;
	font-weight: 500;
	line-height: 1.5;
}
.voices_index ul li .personimg{
	width: 3.125rem;
	margin-bottom: 0.5rem;
}
.voices_index ul li .indexcontents{
	margin-top: 1.875rem;
}
.voices_index ul li .personinfo{
	font-size: 0.75rem;
}
.voices_index ul li a p,.voices_index ul li a .personinfo{
	transition: .3s;
}
.voices_index ul li a:hover p,.voices_index ul li a:hover .personinfo{
	opacity: .5;
}
.voices_index ul li.widecontents{
	border: none;
	width: 100%;
	margin-bottom: 3.75rem;
}
.voices_index ul li.widecontents .indexflex{
	display: flex;
	align-items: center;
}
.voices_index ul li.widecontents .flexleft{
	width: 10rem;
	margin-right: 2rem;
}
.voices_index ul li.widecontents .flexright{
	flex: 1;
}
.voices_index ul li.widecontents .flexright p{
	font-size: 2.25rem;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0;
	margin: 0.375rem 0 0.625rem;
}
.voices_index ul li.widecontents .flexright .personinfo{
	font-size: 1.25rem;
	font-weight: 500;
	line-height: 2;
	letter-spacing: 0.1em;
}
.voices_index ul li .number{
	font-family: "antonia-variable",sans-serif;
  font-variation-settings: 'wght' 500, 'opsz' 48;
	font-size: 1;
	line-height: .9;
	letter-spacing: 0;
	margin: 1.25rem 0 2.125rem;
}
.voices_index ul li.widecontents .number{
	font-size: 1.25rem;
	margin: 1.125rem 0 1.875rem 0.125rem;
}

/* voice_detailcontents */
.voice_detailcontents{
	padding-bottom: 15.625rem;
}
.voice_detailhead{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 6.5rem;
}
.voice_detailhead .voice_number{
	font-family: "antonia-variable",sans-serif;
  font-variation-settings: 'wght' 385, 'opsz' 48;
	font-size: 5rem;
	line-height: 1;
	letter-spacing: -0.02em;
	padding-top: 1rem;
}
.voice_detailhead .voice_person{
	border-left: 1px solid #ccd2de;
	width: 31rem;
	padding-bottom: 0.75rem;
	text-align: right;
}
.voice_detailhead .voice_person .voice_personinfo{
	margin-right: 1.875rem;
	display: inline-block;
	text-align: left;
}
.voice_detailhead .voice_person .voice_personinfo .name{
	font-size: 2.375rem;
	line-height: 1.5;
	margin-bottom: 0.3125rem;
}
.voice_detailhead .voice_person .voice_personinfo .name .en{
	color: #B89E7E;
	font-size: 1rem;
	letter-spacing: -0.02em;
	margin-left: 1.25rem;
}
.voice_detailhead .voice_person .voice_personinfo p{
	font-size: 0.875rem;
}
.voice_entry h3.entry_mainttl{
	font-size: 3rem;
	letter-spacing: 0;
	margin-bottom: 3.5625rem;
}
.voice_entry .voice_mainimg{
	position: relative;
	border-radius: 5px 0 0 5px;
	margin-right: calc(50% - 50vw);
	overflow: hidden;
}
.voice_entry .voice_mainimg img{
	display:block;
	width:100%;
	height:auto;
	transform:scale(1.15);
	will-change:transform;
}
.question_contents{
	display: flex;
	justify-content: space-between;
	margin-top: 7.5rem;
}
.question_contents .number{
	position: relative;
	font-family: "antonia-variable",sans-serif;
  font-variation-settings: 'wght' 385, 'opsz' 48;
	font-size: 5rem;
	line-height: 1;
	width: 16.5625rem;
}
.question_contents .question_current {
  /*position: sticky;
  top: 8rem;*/
  display: inline-block;
  overflow: hidden;
  height: 1.25em;
  transition: opacity 0.3s ease;
}
.question_contents .question_current.is-hidden {
  opacity: 0;
  pointer-events: none;
}
.question_contents .question_current_text {
  display: block;
  will-change: transform, opacity;
}
.question_contents .question_answerarea{
	flex: 1;
}
.question_contents .question_answer:first-child{
	margin-top: 0;
}
.question_contents .question_answer{
	margin-top: 7.5rem;
}
.question_contents .question_answer h4{
	font-size: 1.75rem;
	letter-spacing: 0;
	line-height: 1.5;
	margin-bottom: 2.5rem;
}
.question_contents .question_answer p{
	font-size: 1rem;
	line-height: 2;
	margin-bottom: 1.875rem;
}
.profile_area{
	border-top: 1px solid #ccd2de;
	border-bottom: 1px solid #ccd2de;
	margin-top: 7.5rem;
	margin-left: 16.5625rem;
	padding: 2rem 0;
}
.profile_area dl{
	display: flex;
	font-size: 0.875rem;
	letter-spacing: 0;
}
.profile_area dl dt{
	color: #B89E7E;
	width: 8rem;
}
.profile_area dl dd{
	flex: 1;
	line-height: 2;
	letter-spacing: 0.1em;
}

/* progress icon */
.voices_container{
	position: relative;
}
.voices_progressicons {
  opacity: 0;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 2.5rem;
  z-index: 20;
  height: auto;
  display: flex;
  align-items: flex-end;
}
.voices_progressicons_inner {
  position: sticky;
  top: auto;
  bottom: 2rem;
  left: 1.875rem;
  width: 19.8rem;
  z-index: 20;
}
.voices_progressicons.is-show {
  pointer-events: auto;
}
.progressicon .icon_wrap{
	position: relative;
	width: 3.375rem;
	height: 3.375rem;
}
.progressicon .icon{
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
}
.progressicon .icon img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
}
.progressicon.is-current .icon{
	transform: scale(.9);
}
.progressicon .profile{
	flex: 1;
	font-size: 0.75rem;
	padding-left: 0.59375rem;
	opacity:0;
	visibility:hidden;
	transform:translateX(-10px);
	transition:opacity .3s ease,transform .3s ease;
}
.progressicon .profile .name,.progressicon .profile .position{
	font-size: 0.75rem;
}
.progressicon:hover .profile{
	opacity:1;
	visibility:visible;
	transform:none;
}
.progressicon a{
	display:flex;
	align-items:center;
	border-radius:5px;
	padding:.5rem;
	transition:background .3s ease;
}
.progressicon:hover a{
	background:#FFF;
	box-shadow: 0 5px 30px rgba(20, 51, 105, 0.08);
}

.progress_ring {
	position: absolute;
  transform: rotate(-90deg);
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}
.progress_bg,.progress_bar {
  fill: none;
  stroke-width: 1.5;
}
.progress_bg {
  stroke: #F2F3F5;
}
.progress_bar {
  stroke: #B89E7E;
  stroke-linecap: round;
}
.progressicon .icon img {
  transition: transform .3s ease;
}
.progressicon.is-current .icon img {
  transform: scale(0.5555);
}
.voices_progressicons_sp {
  display: none;
}
.question_contents .is-text {
  font-family: "antonia-variable",sans-serif;
  font-variation-settings: 'wght' 385, 'opsz' 48;
  font-size: 2.5rem;
}
.sectiontitle h3 {
  font-size: 2.25rem;
  line-height: 1.5;
}

@media screen and (max-width: 767px) {
	#authense_voices{
	}
	#authense_voices .sectionhead h2 {
    font-size: 0.625rem;
	}
	#authense_voices .sectionhead {
    padding-bottom: 0.875rem;
	}
	.voice_detailcontents{
		padding-bottom: 3.125rem;;
	}
	.voices_index ul li{
		width: 100%;
	}
	.voices_index ul li.widecontents,.voices_index ul li{
		margin-bottom: 0.40625rem;
	}
	.voices_index ul li.widecontents .number,.voices_index ul li .number {
    font-size: 0.375rem;
    margin: 0.375rem 0 0.5625rem 0;
	}
	.voices_index ul li .indexcontents {
    margin-top: 0;
	}
	.voices_index ul li.widecontents .indexflex,.voices_index ul li .indexcontents{
		display: flex;
    align-items: flex-start;
		padding-bottom: 0.9375rem;
	}
	.voices_index ul li .indexcontents .flexright{
		flex: 1;
	}
	.voices_index ul li.widecontents .flexleft, .voices_index ul li .indexcontents .flexleft, .voices_index ul li .indexcontents .flexleft .personimg{
    width: 1.5625rem;
    margin-right: 0.78125rem;
	}
	.voices_index ul li.widecontents .flexright p,.voices_index ul li .indexcontents .flexright p{
    font-size: 0.625rem;
		line-height: 1.6;
		letter-spacing: 0;
    margin: 0 0 0.125rem;
	}
	.voices_index ul li.widecontents .flexright .personinfo,.voices_index ul li .indexcontents .flexright .personinfo {
    font-size: 0.3125rem;
	}
	#authense_voices {
    margin-bottom: 2.5rem;
	}
	.voice_detailhead {
    display: block;
    margin-bottom: 0.5625rem;
	}
	.voice_detailhead .voice_number {
		font-size: 1.875rem;
		padding-top: 0.625rem;
		margin-bottom: 1.1875rem;
	}
	.voice_detailhead .voice_person {
    border-left: none;
    width: 100%;
    padding-bottom: 0.75rem;
    text-align: left;
	}
	.voice_detailhead .voice_person .voice_personinfo {
    margin-right: 0;
    display: block;
	}
	.voice_detailhead .voice_person .voice_personinfo .name {
    font-size: 0.625rem;
    margin-bottom: 0.3125rem;
	}
	.voice_detailhead .voice_person .voice_personinfo .name .en {
    font-size: 0.3125rem;
    margin-left: 0.125rem;
	}
	.voice_detailhead .voice_person .voice_personinfo p {
    font-size: 0.4375rem;
	}
	.voice_entry h3.entry_mainttl {
    font-size: 0.8125rem;
    margin-bottom: 0.8125rem;
	}
	.question_contents{
    margin-top: 1.5625rem;
	}
	.question_contents .number{
		display: none !important;
	}
	.sectiontitle h3 {
		font-size: 0.6875rem;
    margin-bottom: 0;
	}
	.question_contents .question_answer h4{
		display: flex;
    font-size: 0.5rem;
    margin-bottom: 1.5625rem;
		line-height: 1.6;
	}
	.question_contents .question_answer h4 span{
		display: block;
		flex: 1;
		margin-top: 0.1875rem;
	}
	.question_contents .question_answer h4 .spquestion{
		font-family: "antonia-variable",sans-serif;
		font-variation-settings: 'wght' 385, 'opsz' 48;
		font-size: 1.25rem;
		width: 3.75rem;
	}
	.question_contents .question_answer p {
    font-size: 0.4375rem;
    margin-bottom: 0.9375rem;
	}
	.question_contents .question_answer {
    margin-top: 2.875rem;
	}
	.profile_area {
    margin-top: 1.375rem;
    margin-left: 0;
    padding: 0.9375rem 0;
	}
	.profile_area dl dt {
		font-size: 0.375rem;
    width: 1.875rem
	}
	.profile_area dl dd {
		font-size: 0.375rem;
    flex: 1;
    line-height: 1.8;
	}
	
	/* sp progressicons */
	.voices_progressicons_pc {
    display: none;
  }
  .voices_progressicons_sp {
    position: fixed;
    left: 0.5625rem;
    bottom: 0.5625rem;
		width: 1.875rem;
    height: 1.875rem;
    z-index: 100;
    display: block;
    opacity: 0;
    pointer-events: none;
		transition: .3s;
  }
  .voices_progressicons_sp.is-show {
    opacity: 1;
    pointer-events: auto;
  }
  .sp_progress_button {
    position: relative;
    width: 1.875rem;
    height: 1.875rem;
    border: none;
    border-radius: 50%;
    background: #fff;
    padding: 0;
    box-shadow: 0 0.25rem 1rem rgba(0,0,0,.12);
  }
  .sp_progress_ring {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
  }
  .sp_progress_bg,
  .sp_progress_bar {
    fill: none;
    stroke-width: 3;
  }
  .sp_progress_bg {
    stroke: #D9DBDF;
  }
  .sp_progress_bar {
    stroke: #B89E7E;
    stroke-linecap: round;
  }
  .sp_progress_dots {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.125rem;
  }
  .sp_progress_dots span {
    width: 0.09375rem;
    height: 0.09375rem;
    border-radius: 50%;
    background: #143369;
  }
  .voices_progressicons_sp .profilelist {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 9.75rem;
		display: inline-block;
    background: #fff;
    border-radius: 4px;
    padding: 0.78125rem 0.9375rem;
    opacity: 0;
    visibility: hidden;
    transform: translateY(.75rem);
    transition: .3s ease;
  }
  .voices_progressicons_sp.is-open .sp_progress_button {
    opacity: 0;
    pointer-events: none;
  }
  .voices_progressicons_sp.is-open .profilelist {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
	.voices_progressicons_sp a:first-child{
		margin-top: 0;
	}
	.voices_progressicons_sp a{
		display: block;
		margin-top: 0.46875rem;
	}
	.voices_progressicons_sp .profile{
		transition: .3s;
	}
	.voices_progressicons_sp .profile .name,.voices_progressicons_sp .profile .position{
    font-size: 0.375rem;
		letter-spacing: 0.05em;
		line-height: 1.5;
  }
  .voices_progressicons_sp .profile.current{
		position: relative;
		padding-left:0.46875rem; 
    color: #B89E7E;
  }
	.voices_progressicons_sp .profile.current::before{
		position: absolute;
		top: 0.25rem;
		left: 0;
		background: #B89E7E;
		border-radius: 0.125rem;
		content: "";
		display: block;
		width: 0.25rem;
		height: 0.25rem;
	}
	.question_answerarea .spquestion.is-text {
		font-family: YakuHanMP, "Noto Serif JP", serif;
    font-size: 0.875rem;
    letter-spacing: -0.05em;
    margin-bottom: 0.75rem;
  }
}

