/*
ここに独自の CSS を追加することができます。

詳しくは上のヘルプアイコンをクリックしてください。
*/


.youtube{ position:relative; height:0; overflow:hidden; padding-top:56.25%;} 
.youtube iframe{ position:absolute; top:0; left:0;  width:100%;  height:100%;}




.pink { color:#F43569;
font-size:20px;
font-weight:bold;}

.pink02 { color:#F43569;
font-size:16px;
font-weight:bold;}

.font20 { font-size:20px;
font-weight:bold;}

.orange {color:#FF5A09;
font-weight:bold;
font-size:16px;}

.bgyellow {background-color: #fffea6;}



/* ハンバーガーメニュー変更 */
.mean-container a.meanmenu-reveal {
width: 22px;
height: 22px;
padding: 10px 15px 20px 15px;
position: absolute;
top: 0;
right: 0;
cursor: pointer;
color: #fff;
background: rgba(21, 21, 21, 0.2) url(http://design-school.online/jd/wp-content/uploads/2018/02/icon009light-1.png) center no-repeat;
background-size: 75%;
background-position: center;
text-decoration: none;
font-size: 16px;
text-indent: -9999em;
line-height: 22px;
font-size: 1px;
display: block;
font-family: Arial, Helvetica, sans-serif;
font-weight: 700;
}
.mean-container a.meanmenu-reveal span {
display: block;
}



/* グローバルナビの日本語を大きくする */
@media only screen and (min-width: 768px){
.nav > li > a{
 padding-top:5px;
 line-height:1.5;
 font-size:14px;

}
.nav li a span{
 font-size:10px;
 margin-top:1px;
 position: static;
 font-weight:normal;
}
}


/* TOC */
#toc_container{
	margin:20px auto 30px;
	background-color:rgba(244,253,251,.4);
	border:3px solid rgba(64,105,144,.2);
	border-radius:3px;
	padding:28px 32px;
	display:table;
	min-width: 68%;
	max-width: 90%;
}

/* テーマによるリストの装飾を一旦無効化 */
#toc_container ul.toc_list li::before{
	content:none;
	padding:0;
	margin:0;
	width:0;
	height:0;
	background:none;
	box-shadow:none;
}

/* 目次の見出しタイトル */
#toc_container .toc_title{
	text-align:center;
	font-weight:bold;
	font-size:100%;
	padding:0;
}

/* 見出しタイトル左のアイコン */
#toc_container .toc_title::before{
	position:relative;
	font-size:28px;
	content:"\2254";
	display:inline-block;
	width:40px;
	height:40px;
	line-height:34px;
	margin-right:8px;
	border-radius:50%;
	vertical-align:baseline;
	speak:none;
	-webkit-font-smoothing:antialiased;
	color:#fff;
	background-color:#5f7b96;
}

/* 表示／非表示トグル */
#toc_container .toc_toggle a{
	font-size:13px;
	font-weight:normal;
	padding:2px 4px;
}

/* 目次エリア */
#toc_container p.toc_title + ul.toc_list{
	padding:20px 0 0;
	margin:20px 0 0;
	border-top:1px solid rgba(0,0,0,.1);
}

/* 目次のリストの共通スタイル */
#toc_container ul.toc_list li{
	padding:0;
	margin:0;
}

/* 目次のリンク */
#toc_container ul.toc_list li a{
	position:relative;
	font-size:90%;
	font-weight:normal;
	text-decoration:none;
	display:inline-block;
	padding:3px 0;
	margin:3px 0;
	line-height:1.6;
	transition:all .3s ease;
}

/* 目次のリンクカラー */
#toc_container ul.toc_list a,
#toc_container ul.toc_list a:visited{
	color:#5f5b56;
}

/* マウスオーバー時 */
#toc_container ul.toc_list a:hover{
	opacity:.88;
	text-decoration:none;
}

/* 親の目次 */
#toc_container ul.toc_list > li > a{
	font-size:100%;
	font-weight:bold;
	margin-left:40px;
}

/* 番号振り用のスタイル */
#toc_container .toc_number{
	display:inline-block;
	text-align:center;
	margin-right:5px;
	font-family:'Avenir Next', 'Helvetica Neue', Arial, 'Meiryo','Yu Gothic', san-serif;
	font-weight:400;
	color:#fff;
	background-color:rgba(125,157,188,0.52);
}

/* 親の目次の番号 */
#toc_container .toc_number.toc_depth_1{
	position:absolute;
	top:0;
	left:-40px;
	width:32px;
	height:32px;
	line-height:32px;
	border-radius:16px;
}

/* 子の目次の番号 */
#toc_container .toc_number:not(.toc_depth_1){
	border-radius:15px;
	line-height:30px;
	padding:0 5.43px;
}

/* 子の目次 */
#toc_container ul.toc_list > li > ul{
	margin-top:0px;
	margin-left:40px;
}

/* レスポンシブ設定(667px幅以下) */
@media only screen and (max-width: 667px){
	#toc_container{
		padding:8px 10px;
		min-width: auto;
		width:100%!important;
	}
	#toc_container p.toc_title+ul.toc_list{
		padding:20px 0 0;
	}
	#toc_container ul.toc_list > li > ul{
		margin-left:30px;
	}
}