@charset "utf-8";

/* -----------------------------------------------------------------
   base all
----------------------------------------------------------------- */

main{
	display:block;
	position:relative;
}
#pnkz{
	position:absolute;
	top:15px;
	left:calc(50% - 570px);
	width:1140px;
	max-width:100%;
	padding:0 20px;
	z-index:51;
	}
	#pnkz a{
		display:inline-block;
		font-size:0.9rem;
		color:#FFF;
	}
	#pnkz a::after{
		content:" ";
		display:inline-block;
		position:relative;
		top:-1px;
		margin:0 10px;
		width:7px;
		height:7px;
		border-top:1px solid #FFF;
		border-right:1px solid #FFF;
		transform:rotate(45deg);
		}
		#pnkz a:last-child::after{
			display:none;
}
/* --- responsive --- */
@media only screen and (max-width: 767px) {
	#pnkz{
		display:none;
	}
}

#page_title{
	position:relative;
	height:275px;
	margin:0 0 40px;
	z-index:50;
	}
	#page_title h2{
		position:relative;
		width:1140px;
		max-width:100%;
		height:275px;
		margin:0 auto;
		padding:85px 20px 0;
		font-size:1.2rem;
		color:#FFF;
	}
	#page_title h2 span{
		display:block;
		font-size:3.0rem;
}

#bdid_about #page_title{background:url(../images/title/about.jpg) no-repeat center center;background-size:cover;}
#bdid_course #page_title{background:url(../images/title/course.jpg) no-repeat center center;background-size:cover;}
#bdid_teacher #page_title{background:url(../images/title/teacher.jpg) no-repeat center center;background-size:cover;}
#bdid_voice #page_title{background:url(../images/title/voice.jpg) no-repeat center bottom;background-size:cover;}
#bdid_news #page_title{background:url(../images/title/news.jpg) no-repeat center center;background-size:cover;}
#bdid_faq #page_title{background:url(../images/title/faq.jpg) no-repeat center center;background-size:cover;}
#bdid_company #page_title{background:url(../images/title/company.jpg) no-repeat top -120px center;background-size:cover;}
#bdid_order #page_title{background:url(../images/title/order.jpg) no-repeat center center;background-size:cover;}
#bdid_free #page_title{background:url(../images/title/free.jpg) no-repeat center center;background-size:cover;}

#page_title + h3{
	position:relative;
	width:1140px;
	max-width:100%;
	margin:0 auto 7px;
	padding:0 20px;
	font-family:'Noto Serif JP', serif;
	text-align:center;
	font-size:2.0rem;
	color:#000;
	}
	#page_title + h3.h3_txt{
		font-size:1.5rem;
	}
	#page_title + h3 + p{
		position:relative;
		width:1140px;
		max-width:100%;
		margin:0 auto 40px;
		padding:0 20px;
		text-align:center;
		font-size:1.0rem;
		color:#000;
}
/* --- responsive --- */
@media only screen and (max-width: 767px) {
	#page_title{
		height:130px;
		margin:0 0 20px;
		}
		#page_title h2{
			height:130px;
			padding:32px 20px 0;
			font-size:1.0rem;
			background:rgba(0,0,0,0.5);
		}
		#page_title h2 span{
			font-size:1.9rem;
	}
	#page_title + h3{
		margin:0 auto 5px;
		font-size:1.5rem;
		}
		#page_title + h3.h3_txt{
			font-size:1.1rem;
		}
		#page_title + h3 + p{
			font-size:0.87rem;
	}
}

/* -----------------------------------------------------------------
   about
----------------------------------------------------------------- */

#bdid_about .about_box{
	display:-webkit-flex;
	display:flex;
	-webkit-box-pack:justify;
	-ms-flex-pack:justify;
	justify-content:space-between;
	flex-wrap:wrap;
	position:relative;
	width:1140px;
	max-width:100%;
	margin:0 auto 60px;
	}
	#bdid_about .about_box.reverse{
		flex-direction: row-reverse;
	}
	#bdid_about .about_box .ab_contents{
		width:calc(100% - 430px);
		}
		#bdid_about .about_box .ab_contents h4{
			position:relative;
			margin:0 0 7px;
			padding:0 0 5px;
			font-weight:normal;
			font-size:1.7rem;
			border-bottom:1px solid #AAA;
		}
		#bdid_about .about_box .ab_contents p{
			font-weight:normal;
			font-size:1.0rem;
	}
	#bdid_about .about_box .ab_photo{
		width:400px;
		max-width:100%;
		margin:0 10px;
		}
		#bdid_about .about_box .ab_photo::before{
			content:" ";
			position:absolute;
			top:-10px;
			right:0px;
			border:40px solid transparent;
			border-top:40px solid #EFC897;
			border-right:40px solid #EFC897;
		}
		#bdid_about .about_box .ab_photo::after{
			content:"1";
			position:absolute;
			top:-5px;
			right:15px;
			font-weight:normal;
			font-family: 'Noto Serif JP', serif;
			font-size:2.0rem;
			line-height:1;
		}
		#bdid_about .about_box.reverse .ab_photo::before{
			right:auto;
			left:0px;
			border:40px solid transparent;
			border-top:40px solid #EFC897;
			border-left:40px solid #EFC897;
		}
		#bdid_about .about_box.reverse .ab_photo::after{
			right:auto;
			left:15px;
		}
		#bdid_about #about_contents .about_box:nth-of-type(1) .ab_photo::after{content:"1";}
		#bdid_about #about_contents .about_box:nth-of-type(2) .ab_photo::after{content:"2";}
		#bdid_about #about_contents .about_box:nth-of-type(3) .ab_photo::after{content:"3";}
		#bdid_about #about_contents .about_box:nth-of-type(4) .ab_photo::after{content:"4";}
		#bdid_about #about_contents .about_box:nth-of-type(5) .ab_photo::after{content:"5";}
		#bdid_about #about_contents .about_box:nth-of-type(6) .ab_photo::after{content:"6";}
		#bdid_about #about_contents .about_box:nth-of-type(7) .ab_photo::after{content:"7";}


/* --- responsive --- */
@media only screen and (max-width: 767px) {
	#bdid_about .about_box .ab_contents{
		width:100%;
		padding:0 20px 15px;
		}
		#bdid_about .about_box .ab_contents h4{
			position:relative;
			margin:0 0 10px;
			padding:0 0 10px 45px;
			font-weight:normal;
			font-size:1.2rem;
			border-bottom:1px solid #AAA;
		}
		#bdid_about .about_box .ab_contents p{
			font-size:0.87rem;
		}
		#bdid_about .about_box .ab_photo{
			margin:0px;
			}
			#bdid_about .about_box .ab_photo::before{
				top:-20px;
			}
			#bdid_about .about_box .ab_photo::after{
				top:-15px;
			}
			#bdid_about .about_box .ab_photo::before{
				right:auto;
				left:0px;
				border:40px solid transparent;
				border-top:40px solid #EFC897;
				border-left:40px solid #EFC897;
			}
			#bdid_about .about_box .ab_photo::after{
				right:auto;
				left:15px;
	}

}

/* -----------------------------------------------------------------
   course
----------------------------------------------------------------- */

#bdid_course main section{
	position:relative;
	width:1140px;
	max-width:100%;
	margin:0 auto 40px;
	padding:0 20px;
}
#bdid_course main section h3{
	position:relative;
	width:1140px;
	max-width:100%;
	margin:0 auto 7px;
	padding:0 20px;
	font-family:'Noto Serif JP', serif;
	text-align:center;
	font-size:2.0rem;
	color:#000;
	}
	#bdid_course main section h3 + p{
		position:relative;
		width:1140px;
		max-width:100%;
		margin:0 auto 10px;
		padding:0 20px;
		text-align:center;
		font-size:1.0rem;
		color:#000;
}

#bdid_course main section table{
	width:100%;
	border-collapse:separate;
	border-spacing:7px;
}
#bdid_course main section table thead th{
	height:60px;
	padding:10px;
	font-weight:bold;
	font-size:1.0rem;
	text-align:center;
	background:#98A6B5;
	color:#FFF;
}
#bdid_course main section table thead th:nth-child(1){
	width:160px;
}
#bdid_course main section table tbody th{
	height:60px;
	padding:10px;
	font-weight:bold;
	font-size:0.90rem;
	text-align:center;
	background:#F3F3F3;
	border:1px solid #F3F3F3;
	color:#000;
	line-height:1.35;
}
#bdid_course main section table tbody td{
	padding:10px;
	font-size:0.90rem;
	text-align:center;
	border:1px solid #F3F3F3;
	color:#000;
	line-height:1.35;
	}
	#bdid_course main section table tbody td span{
		font-size:0.77rem;
}

#bdid_course main section p.table_point{
	margin:0px;
	padding:0 7px 0 0px;
	font-size:0.87rem;
	text-indent:-12px;
	text-align:right;
}

#bdid_course main section#grounp_lesson thead th:nth-child(1){
	font-size:0.90rem;
	background:#F3F3F3;
	border:1px solid #F3F3F3;
	color:#000;
	line-height:1.35;
}

/* --- responsive --- */
@media only screen and (max-width: 767px) {
	#bdid_course main section p.table_point{
		padding:0 0 0 12px;
		font-size:0.77rem;
		text-align:left;
	}
}

/* -----------------------------------------------------------------
   teacher
----------------------------------------------------------------- */

#bdid_teacher .instructors_box{
	position:relative;
	width:100%;/*1140*/
	max-width:100%;
	background:rgba(0,0,0,0.1);
}
#bdid_teacher .instructors_box > div{
	display:-webkit-flex;
	display:flex;
	-webkit-box-pack:justify;
	-ms-flex-pack:justify;
	justify-content:space-between;
	flex-wrap:wrap;
	width:1140px;
	max-width:100%;
	margin:0 auto 0px;
	padding:20px 20px;
}
#bdid_teacher .instructors_box.reverse{
	background:none;
	}
	#bdid_teacher .instructors_box.reverse div{
		flex-direction: row-reverse;
}

/* ib_info */
#bdid_teacher .instructors_box .ib_info{
	width:calc(100% - 320px);
/*	width:780px;*/
	transition-duration:0.5s;
	}
#bdid_teacher .instructors_box.movie .ib_info{
	/*
	width:calc(100% - 640px);
	width:460px;
	*/
	width:42%;
	}
	#bdid_teacher .instructors_box .ib_info h4{
		margin:0 0 7px;
		font-weight:bold;
		font-size:1.7rem;
		border-bottom:2px solid #001E5E;
		color:#001E5E;
	}
	#bdid_teacher .instructors_box .ib_info p{
		position:relative;
		margin:0 0 10px;
		font-size:0.9rem;
		}
		#bdid_teacher .instructors_box .ib_info p:last-child{
			margin:0 0 0px;
	}
	#bdid_teacher .instructors_box .ib_info p.info_p{
		padding:5px 0 0 100px;
	}
	#bdid_teacher .instructors_box .ib_info p.info_p span:first-child{
		position:absolute;
		top:3px;
		left:0px;
		width:75px;
		height:26px;
		padding:2px 0px 2px 7px;
		font-size:0.84rem;
		text-align:center;
		background:#001E5E;
		color:#FFF;
		}
		#bdid_teacher .instructors_box .ib_info p.info_p span:first-child::after{
			content:" ";
			position:absolute;
			top:calc(50% - 13px);
			right:-26px;
			border:13px solid transparent;
			border-left: 13px solid #001E5E;
}
#bdid_teacher .instructors_box .ib_photo{
	width:300px;
	-o-object-fit: cover;
		object-fit: cover;
	-webkit-clip-path: polygon(0% 0%, 90% 0%, 100% 50%, 90% 100%, 0% 100%);
	clip-path: polygon(0% 0%, 90% 0%, 100% 50%, 90% 100%, 0% 100%);
	transition-duration:0.5s;
}
#bdid_teacher .instructors_box.reverse .ib_photo{
		-webkit-clip-path: polygon(10% 0%, 100% 0%, 100% 100%, 10% 100%, 0% 50%);
		clip-path: polygon(10% 0%, 100% 0%, 100% 100%, 10% 100%, 0% 50%);
}
#bdid_teacher .instructors_box .ib_movie{
	position:relative;
	/*
	width:600px;
	width:calc(100% - 500px);
	*/
	width:55%;
	max-width:100%;
	transition-duration:0.5s;
	}
	#bdid_teacher .instructors_box .ib_movie div{
		position:relative;
		width:100%;
		height:0px;
		padding-top:56.25%;
	}
	#bdid_teacher .instructors_box .ib_movie div iframe,
	#bdid_teacher .instructors_box .ib_movie div video{
		position:absolute;
		top:0px;
		left:0px;
		width:100%;
		height:100%;
		cursor:pointer;
}

/* --- responsive --- */
@media only screen and (max-width: 767px) {
	#bdid_teacher .instructors_box{
	}
	#bdid_teacher .instructors_box .ib_info,
	#bdid_teacher .instructors_box.movie .ib_info{
		width:100%;
		}
		#bdid_teacher .instructors_box .ib_info p{
			font-size:0.84rem;
		}
		#bdid_teacher .instructors_box .ib_info p.info_p{
			padding:2px 0 0 85px;
		}
		#bdid_teacher .instructors_box .ib_info p.info_p span:first-child{
			position:absolute;
			width:65px;
			height:22px;
			padding:2px 0px 2px 5px;
			font-size:0.77rem;
			}
			#bdid_teacher .instructors_box .ib_info p.info_p span:first-child::after{
				top:calc(50% - 11px);
				right:-22px;
				border:11px solid transparent;
				border-left: 11px solid #001E5E;
	}
	#bdid_teacher .instructors_box .ib_photo{
		margin:0 auto;
		-webkit-clip-path:none;
		clip-path:none;
	}
	#bdid_teacher .instructors_box.reverse .ib_photo{
		-webkit-clip-path:none;
		clip-path:none;
	}
	#bdid_teacher .instructors_box .ib_movie{
		width:100%;
	}
}
@media only screen and (max-width:600px) {
	#bdid_teacher .instructors_box.movie > div{
		padding:0px 20px 20px;
	}
	#bdid_teacher .instructors_box .ib_movie{
		width:calc(100% + 40px);
		max-width:none;
		margin:0 -20px;
	}
}

/* -----------------------------------------------------------------
   voice
----------------------------------------------------------------- */

#bdid_voice main section:first-of-type{
	margin:0 0 50px;
}
#bdid_voice .voice_movie{
	display:-webkit-flex;
	display:flex;
	-webkit-box-pack:justify;
	-ms-flex-pack:justify;
	justify-content:space-between;
	flex-wrap:wrap;
	list-style:none;
	width:100%;
	max-width:100%;
	margin:0 auto 20px;
	padding-bottom:20px;
	border-bottom:1px solid rgba(0,0,0,0.1);
}
#bdid_voice .voice_movie .set_movie{
	display:inline-block;
	position:relative;
	width:48%;
	margin:0 0 25px;
	padding:0px;
	background:#FFF;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	overflow:hidden;
	}
	#bdid_voice .voice_movie .set_movie div{
		position:relative;
		width:100%;
		height:0px;
		padding-top:56.25%;
	}
	#bdid_voice .voice_movie .set_movie div iframe,
	#bdid_voice .voice_movie .set_movie div video{
		position:absolute;
		top:0px;
		left:0px;
		width:100%;
		height:100%;
		cursor:pointer;
}
/* --- responsive --- */
@media only screen and (max-width: 767px) {
	#bdid_voice .voice_movie{
		padding-bottom:0px;
	}
	#bdid_voice .voice_movie .set_movie{
		width:100%;
	}
	#bdid_voice .set_movie{
		width:100%;
		max-width:100%;
	}

	#bdid_voice .col-md-3{
		text-align:center;
		margin:0 auto 20px;
	}
	#bdid_voice .pt-4{
		padding:0px;
	}
}

/*
#bdid_voice main section:first-of-type{
	margin:0 0 50px;
	border-top:1px solid rgba(0,0,0,0.1);
}

#bdid_voice .voice_movie{
	position:relative;
	padding:20px 0;
	text-align:center;
	background:#F8F4F8;
	border-bottom:1px solid rgba(0,0,0,0.1);
}
#bdid_voice .voice_movie:nth-child(even){
	background:none;
}
#bdid_voice .voice_movie:nth-last-child(even){
}

#bdid_voice .set_movie{
	position:relative;
	width:55%;
	max-width:720px;
	margin:0 auto;
	transition-duration:0.5s;
	}

	#bdid_voice .set_movie p{
		margin:7px 0 0;
		font-weight:bold;
		font-family: 'Noto Serif JP', serif;
		font-size:1.1rem;
		text-align:center;
	}
	#bdid_voice .set_movie div{
		position:relative;
		width:100%;
		height:0px;
		padding-top:56.25%;
	}
	#bdid_voice .set_movie div iframe{
		position:absolute;
		top:0px;
		left:0px;
		width:100%;
		height:100%;
}
*/
/* --- responsive --- 
@media only screen and (max-width: 767px) {

	#bdid_voice .voice_movie{
		padding:20px;
	}
	#bdid_voice .set_movie{
		width:100%;
		max-width:100%;
	}

	#bdid_voice .col-md-3{
		text-align:center;
		margin:0 auto 20px;
	}
	#bdid_voice .pt-4{
		padding:0px;
	}
}
*/

/* -----------------------------------------------------------------
   company
----------------------------------------------------------------- */

#bdid_company #map_h3{
	margin:0 auto -9px;
	font-weight:bold;
	font-family:'Noto Sans JP', sans-serif;
	text-align:left;
	color:#001E5E;
}
#bdid_company #map{
	width:1100px;
	max-width:100%;
	height:550px;
	margin:0 auto 60px;
	border:5px solid #001E5E;
	}
	#bdid_company #map iframe{
		width:100%;
		height:100%;
		border:0px;
}

#bdid_company section#company_info{
	position:relative;
	width:1140px;
	max-width:100%;
	margin:0 auto 50px;
	padding:0 20px;
}
#bdid_company section#company_info h3{
	position:relative;
	width:100%;
	margin:0 auto 7px;
	font-family:'Noto Serif JP', serif;
	text-align:center;
	font-size:2.0rem;
	color:#000;
	}
	#bdid_company section#company_info h3 + p{
		position:relative;
		width:100%;
		margin:0 auto 20px;
		text-align:center;
		font-size:1.0rem;
		color:#000;
}

#bdid_company section table{
	position:relative;
	width:100%;
	border-collapse:separate;
	border-spacing:7px;
}
#bdid_company section table th{
	width:200px;
	height:40px;
	padding:10px;
	font-weight:bold;
	font-size:0.90rem;
	text-align:center;
	background:#F3F3F3;
	border:1px solid #F3F3F3;
	color:#000;
	line-height:1.5;
}
#bdid_company section table td{
	padding:10px;
	font-size:0.90rem;
	text-align:left;
	border:1px solid #F3F3F3;
	color:#000;
	line-height:1.5;
}

/* --- responsive --- */
@media only screen and (max-width: 767px) {
	#bdid_company #map_h3{
		margin:0 auto 0px;
		text-align:center;
	}
	#bdid_company #map{
		height:400px;
		}
		#bdid_company #map iframe{
			width:100%;
			height:100%;
			border:0px;
	}
	#bdid_company section#company_info{
		padding:0 10px;
	}
	#bdid_company section#company_info h3{
		margin:0 auto 5px;
		font-size:1.5rem;
		}
		#bdid_company section#company_info h3 + p{
			font-size:0.87rem;
	}
}

