@charset "UTF-8";
/* CSS Document */
#speakers{}
#speakers .inner{
	width: 100%;
	/*max-width: 900px;*/
	padding: 1em 0;
	margin: 0 auto 1em;
	border-bottom: solid 1px #000;
}
#keynote-speakers{}
.speech-nmb{
	display: block;
	width: 220px;
	font-size: 100%;
	font-weight: 500;
	line-height: 1.2em;
	text-align: center;
	margin-bottom: 1em;
}
.speaker-infor {
	width: 100%;
	display: flex;
	align-items: center;/* 縦位置 */
	justify-content: space-between;/* 横位置 */
	flex-direction: row;/* 順番 */
	flex-wrap: wrap;/* 折り返し */
	margin: 0 auto;
}
.speaker-infor .speaker-img{
	width: 220px;
	height: 220px;
	padding: 0;
	margin: 0;
}
.speaker-infor .speaker-img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius:50%;
	margin-bottom: 0;
}
.speaker-infor .speaker-txt{
	width: calc(100% - 300px);
}
.speaker-infor .speaker-name{
	color: #e63082;
	font-size: 160%;
	font-weight: 600;
	line-height: 1.5em;
	margin-bottom: 0.2em;
}
.speaker-infor .speaker-belong{
	font-size: 100%;
	font-weight: 500;
	line-height: 1.5em;
	margin-bottom: 1.5em;
}
.speaker-infor .speech-title{
	color: #0086c1;
}
.speaker-infor .speech-title dt{
	font-size: 90%;
	font-weight: 300;
	line-height: 1.5em;
	margin-bottom: 0em;
}
.speaker-infor .speech-title dd{
	font-size: 110%;
	font-weight: 500;
	line-height: 1.5em;
	margin-bottom: 0.5em;
}
.speaker-detail{
	background-color: #eee;
	width: 100%;
	padding: 1.5em 1.5em 0.5em;
	margin: 0 auto 0.5em;
	border-radius: 0.5em;
}
.speaker-detail h5{
	font-size: 105%;
	font-weight: 500;
	line-height: 1.5em;
	margin-bottom: 0;
}
.speaker-detail p{
	font-size: 90%;
	font-weight: 300;
	line-height: 1.5em;
	margin-bottom: 1em;
}
.speaker-detail ul, .speaker-detail ol{
	font-size: 90%;
	font-weight: 300;
	line-height: 1.5em;
	margin-bottom: 1em;
}
.speaker-detail ul li{
	list-style: disc;
	margin-left: 1.2em;
	margin-bottom: 0;
}
.speaker-detail ol li{
	margin-left: 1.2em;
	margin-bottom: 0;
}
#spk13-tb span{
	display: inline-block;
	margin-right: 1em;
}
#spk13-tb span.tb-1{
	width: 11em;
}
#spk13-tb span.tb-2{
	width: 5em;
}
#spk14 ul{
}
#spk14 ul li{
	margin-bottom: 0.8em;
}
#spk14 ul li span.txt-1{
	font-weight: 500;
}
.open-box{
	margin: 0;
	padding: 0;
}
/*inputを非表示*/
input[type="checkbox"].on-off{
	opacity: 0;
}
/*ラベル（「開く」ボタン）*/
.open-label{
	color: #666;
	display: block;
	width: 7em;
	border: solid 1px #666;
	border-radius: 0.6em;
	font-size: 75%;
	font-weight: 500;
	line-height: 1.2em;
	text-align: center;
	margin: -1.5em auto 0.5em;
}
/*ラベルに表示するテキスト*/
.open-label::after{
	content:'Read More'; 
}
.on-off:checked ~ .open-label::after{
	content: 'Close';
}
/*開閉エリア*/
.open2{
	padding: 0 1em;
	height: 0;
	opacity: 0;
	display: none;/*内容を非表示、リンクを無効化*/
	transition: .7s;
}
/*「開く」をタップで表示*/
.on-off:checked  ~ .open2{
	padding: 1em 1em 0;
	height: auto;
	opacity: 1;
	display: block;/*内容を表示、リンクを有効化*/
}
/*850px以下の場合*/
@media screen and (max-width: 850px) {
.speech-nmb{
	width: 180px;
	font-size: 100%;
}
.speaker-infor .speaker-img{
	width: 180px;
	height: 180px;
}
.speaker-infor .speaker-txt{
	width: calc(100% - 220px);
}
#spk13-tb span.tb-2{
	margin-right: calc(100% - 18em);
}
}
/*500px以下の場合*/
@media screen and (max-width: 500px) {
.speech-nmb{
	margin: 0 auto 1em;
}
.speaker-infor .speaker-img{
	margin: 0 auto 1em;
}
.speaker-infor .speaker-txt{
	width: 100%;
	text-align: center;
}
}
/*350px以下の場合*/
@media screen and (max-width: 350px) {
#spk13-tb span{
	display: block;
}
#spk13-tb span.tb-2{
	margin-right: 0;
}
}