@charset "utf-8";


/*=======================================================
npc
=======================================================*/
/* index */
#btm_main .lead_cont .index_ttl{
	padding: 0;
	width: 697px;
	height: 120px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	background: none;
}
#btm_main .lead_cont #npc_ttl{ background: url(../img/npc_ttl.jpg) no-repeat left top; }


#support_nav{ margin: 15px 0 0; }
#support_nav ul{ margin: 0; }
#support_nav li{
	margin: 0 4px 10px;
	display: inline-block;
	width: 330px;
	text-align: center;
	vertical-align: middle;
}
#support_nav li a{
	padding-right: 15px;
	vertical-align: middle;
	display: block;
	background: #88c3d4 url(../img/btn_arrow.png) no-repeat 96% center;
	-moz-background-size: 24px auto; /* Firefox */
	background-size: 24px auto;
	line-height: 2.8em;
	font-size: 1.8rem;
	font-size: 18px\9; /* ie8 */
	color: #fff;
	font-weight: bold;
	-moz-box-sizing: border-box; /* Firefox */
	box-sizing: border-box;
}
#support_nav li a:hover{
	opacity: 0.8; /*通常*/
	-ms-filter: "alpha(opacity=80)"; /*IE8*/
	text-decoration: none;
}
#support_nav #subscription{
	width: 99%;
	-moz-box-sizing: border-box; /* Firefox */
	box-sizing: border-box;
}


/* 特長 */
#program_list{
	margin: 15px 0;
	padding: 15px 15px 5px;
	overflow: hidden;
	border: 2px solid #b0d7e2;
}
#program_list > li{
	margin: 0 5px 10px;
	float: left;
	width: 315px;
	overflow: hidden;
}
.program_outline {
	width: 200px;
	float: left;
}
#program_list li h4{
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	font-weight: bold;
	line-height: 1.3;
	color: #00aad4;
	font-size: 1.6rem;
	font-size: 16px\9; /* ie8 */
}
#program_list li h4 span{
	font-size: 2.0rem;
	font-size: 20px\9; /* ie8 */
}
#program_list li h5{
	margin: 0;
	padding: 0;
	background: none;
	font-size: 1.3rem;
	font-size: 13px\9; /* ie8 */
}
.program_outline ul{ margin-top: 10px; }
.program_outline li{
	margin: 0 0 3px 15px;
	list-style-type: square;
	line-height: 1.2;
}
.detail_list li{
	margin: 0 0 15px;
	overflow: hidden;
	clear: both;
}
#btm_main .detail_list h4{
	margin: 0;
	padding: 5px 0 5px 30px;
	background: url(../img/ttl_mark.png) no-repeat left 0.2em;
	font-size: 1.6rem;
	font-size: 16px\9; /* ie8 */
	color: #ef6000;
	border: none;
	font-weight: bold;
}


/* 講師 */
.info_cont{
	padding: 15px;
	border: 1px solid #ccc;
}
.instructor_cont{
	padding: 20px 0 0;
	overflow: hidden;
	clear: both;
	border-top: 1px solid #ccc;
}
.info_cont h4+.instructor_cont{
	padding: 0;
	border: none;
}
#btm_main .instructor_name{
	font-size: 1.6rem;
	font-size: 16px\9; /* ie8 */
	font-weight: bold;
}
.instructor_name span{
	margin-right: 5px;
	display: inline-block;
	font-size: 1.4rem;
	font-size: 14px\9; /* ie8 */
	font-weight: normal;
}
#btm_main .instructor_office{
	font-size: 1.2rem;
	font-size: 12px\9; /* ie8 */
}
#btm_main .info_cont h4{
	margin: 0 0 10px;
	padding: 7px 10px;
	background: none;
	background-color: #4995b0;
	font-weight: bold;
	font-size: 1.4rem;
	font-size: 14px\9; /* ie8 */
	color: #fff;
}
#btm_main .info_cont h5{
	margin: 0 0 10px;
	padding: 0 0 10px;
	font-weight: bold;
	border-bottom: 1px solid #ccc;
}
#btm_main .info_cont h6{
	margin: 0 0 10px;
	padding: 0 5px 10px 0;
	font-weight: bold;
	display: inline-block;
	font-size: 1.3rem;
	font-size: 13px\9; /* ie8 */
	background-color: #fff;
}
#btm_main .info_cont h6 + *{
	margin-top: -33px;
	padding: 15px 0 0;
	border-top: 1px dotted #ccc;
}

.category{ margin: 10px 0; }
.category dt{ font-weight: bold; }
.category dd,
.category p{ line-height: 1.4; }

.instructor_info,
.category{
	float: left;
	width: 520px;
}

#btm_main #ncp_voice .voice{ background: url(../../img/voicw_ico.png) no-repeat left 0; }
#btm_main #ncp_voice h5{
	margin: 0;
	font-size: 1.6rem;
	font-size: 16px\9; /* ie8 */
}
#btm_main .voice_header{ margin-bottom: 10px; }



/* プログラム事例 */
.program_cont ol{ margin: 0 0 5px; }
.compact_program{ overflow: hidden; }
.compact_program .program_cont{
	margin-right: 1%;
	width: 49%;
	float: left;
}
.program_cont .float_right{
	margin: 0 0 10px;
	width: 270px;
	height: 100px;
}
.program_cont ol li{
	margin-bottom: 5px;
	line-height: 1.2;
}


/* コンテンツ一覧 */
#member_info{
	padding: 20px;
	border: 1px solid #ccc;
}
#member_info table.basic th, #member_info table.basic td {
	padding:5px;
	line-height: 1.3;
}
.target_name{
	margin: 0 0 10px;
	font-size: 1.4rem;
	font-size: 14px\9; /* ie8 */
}


/* 操作ガイド */
.flow_list li{
	margin: 0 0 15px;
	padding: 15px 15px 15px 40px;
	border: 2px solid #efefef;
}
.flow_list li a{
	word-wrap:break-word;
	white-space: normal;
}
.flow_list li:after{
	content: ' ';
	margin: 0px auto -40px;
	background: url(../../img/flow_arrow.png) no-repeat center center;
	display: block;
	height: 35px;
	width: 100%;
	position: relative;
	z-index: 200;
}
.flow_list li.last:after{
	background: none;
	display: none;
}
.flow_list li .list_num{
	margin: -2px 0 0 -25px;
	width: 20px;
	display: inline-block;
	vertical-align: top;
}

.screen_cont{
	margin: 10px 0 0 -25px;
	padding: 10px 0;
	background-color: #e6e6e6;
	overflow: hidden;
}
.list_num img{ vertical-align: middle; }
.screen_cont p{
	text-align: center;
	float: left;
}
.screen_cont p span{
	margin: 5px 0 10px;
	padding: 0 5px 2px;
	border-bottom: 1px solid #9e9e9e;
	display: inline-block;
	font-size: 1.1rem;
	font-size: 11px\9; /* ie8 */
	line-height: 1.2;
	font-weight: bold;
	color: #666;
}
.pc_img{
	width: 53%;
	border-right: 1px dotted #9e9e9e;
}
.s_img{ width: 45%; }


/* ===========================================
	MediaQueries
=========================================== */
/* スマホ----------------------------- */
@media screen and (max-width: 767px) {
	#btm_main .lead_cont .index_ttl{
		margin: 0 auto 15px;
		width: 100%;
		height: 87px;
		-moz-background-size: 304px 87px ; /* Firefox */
		background-size: 304px 87px;
		background-position: left top;
		background-repeat: no-repeat;
		background-color: #efeee9;
	}
	#support_nav{ text-align: center; }
	#support_nav li{
		margin: 0 4px 10px;
		display: inline-block;
		width: 90%;
		text-align: center;
		vertical-align: middle;
	}
	.br_sp{ display: inline-block; }
	#support_nav li a{
		line-height: 3.0;
		background: #88c3d4 url(../img/btn_arrow.png) no-repeat 96% center;
		-moz-background-size: 20px auto; /* Firefox */
		background-size: 20px auto;
		-moz-box-sizing: border-box; /* Firefox */
		box-sizing: border-box;
	}

	/* 特長 */
	#program_list{ padding: 10px 10px 10px 0; }
	#program_list > li{
		float: none;
		width: 100%;
		-moz-box-sizing: border-box; /* Firefox */
		box-sizing: border-box;
	}
	#program_list img{
		width: 70px;
		height: auto;
	}
	.program_outline {
		width: 100%;
		padding-left: 80px;
		float: none;
		-moz-box-sizing: border-box; /* Firefox */
		box-sizing: border-box;
	}
	.detail_list img{
		width: 100px;
		height: auto;
	}
	.detail_cont{
		margin: 0 0 0;
		overflow: hidden;
	}
	.instructor_img{
		margin-bottom: 5px;
		width: 80px;
	}
	.instructor_info{
		padding: 0 0 0 90px;
		width: auto;
		float: none;
	}
	.category{
		clear: both;
		width: auto;
		float: none;
	}
	.category dd{ margin: 0 0 5px; }


	/* プログラム事例 */
	.program_cont .float_right{
		margin: 0 auto 10px;
		float: none;
		display: block;
	}
	.compact_program .program_cont{
		margin-right: 2%;
		width: 48%;
	}
	.program_cont ol li{
		margin: 3px 0 0 ;
		line-height: 1.3;
	}
}
