@charset "utf-8";

/*パン屑リストのCSS*/
/*==================================================================*/
.bread_crumb{
	width:1024px;
	margin:0 auto;
	background:#FFFFFF;
	padding:10px 5px 5px;
	box-sizing:border-box;
	box-shadow: 0px 1px 1px #767676;
}

.bread_crumb_contents{
	border-left:5px solid #142952;
	padding-left:10px;
}

.bread_crumb_contents ul li{
	font-size:12px;
	display:inline-block;
	color:#252525;
	text-indent:7px;
}
	
.bread_crumb_contents ul li a{
	color:#252525;
}

.bread_crumb_contents li.home:before{
	content:url(../imgs/bread_home_b.gif);
	position:relative;
	top:1px;
	left:-3px;
}
	
.bread_crumb_contents li:before{
	content:url(../imgs/bread_ya_b.gif);
	position:relative;
	top:1px;
	left:-5px;
}
	


/*contents部分のCSS*/
/*==================================================================*/
.contents{
	width:1024px;
	margin:10px auto 0px;
}


/*詳細ボタンのCSS*/
/*==================================================================*/
.shousai_btn_box{
	width:1024px;
	margin:10px auto 0px;
}

.shousai_01{
	box-sizing:border-box;
	border:solid 5px #fff;
	background:url(../imgs/shousai_bg_blue.gif);
	width:332px;
	float:left;
	margin-right:14px;
	padding:18px;
	text-align:center;
	box-shadow: 0px 1px 1px #767676;
}

.shousai_02{
	box-sizing:border-box;
	border:solid 5px #fff;
	background:url(../imgs/shousai_bg_green.gif);
	width:332px;
	float:left;
	margin-right:14px;
	padding:18px;
	text-align:center;
	box-shadow: 0px 1px 1px #767676;
}

.shousai_03{
	box-sizing:border-box;
	border:solid 5px #fff;
	background:url(../imgs/shousai_bg_orange.gif);
/*	height:150px;*/
	width:332px;
	float:left;
	padding:18px;
	text-align:center;
	box-shadow: 0px 1px 1px #767676;
}

.shousai_btn_box p{
	margin-top:12px;
}

.shousai_btn_box p a img:hover {
    filter: alpha(opacity=90);
    -moz-opacity:0.90;
    opacity:0.90;
}


/*コンテンツボックスのCSS*/
/*==================================================================*/
.contents_box{
	width:1024px;
	margin-top:25px;
	margin-bottom:60px;
}

	
/*コンテンツボックスのナビゲーション*/
/*==================================================================*/
.contents_box_nav ul li{
	width:200px;
	float:left;
	color:#D8D8D8;
	text-align:center;
	font-size:12px;
	padding-top: 5px;
	padding-bottom: 3px;
	border:1px solid #777777;
	background:#888888;
	box-sizing:border-box;
	border-radius: 8px 8px 0px 0px;
	margin-right:2px;
	box-shadow: 0px 1px 1px #767676;
}

.contents_box_nav ul li a{
	display:block;
	width:200px;
}

.contents_box_nav ul li a:hover{
	color:#fff;
	filter: alpha(opacity=80);
    -moz-opacity:0.80;
    opacity:0.80;
}

.contents_box_nav ul li.current_li{
	background:#4E4E4E;
}


/*コンテンツボックスの中身*/
/*==================================================================*/
.contents_box_contents{
	width:1024px;
	background:#fff;
	/*border-radius: 0px 8px 8px 8px;*/
	box-shadow: 0px 1px 1px #767676;
	padding:0px 30px 30px;
	box-sizing:border-box;
    box-shadow: 1px 1px 2px #767676;
}

.contents_box_contents h2{
	color:#FFF;
	text-align:center;
	font-size:15px;
	line-height:40px;
	border-radius:0px 0px 8px 8px;
	box-shadow: 0px 1px 2px #767676;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#004077+0,0068b7+89,003466+91,001942+100 */
background: #004077; /* Old browsers */
background: -moz-linear-gradient(top,  #004077 0%, #0068b7 89%, #003466 91%, #001942 100%);
 /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #004077 0%,#0068b7 89%,#003466 91%,#001942 100%);
 /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #004077 0%,#0068b7 89%,#003466 91%,#001942 100%);
 /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#004077', endColorstr='#001942',GradientType=0 ); /* IE6-9 */


}


/*コンテンツボックス見出し部分（教育・研修）*/
/*==================================================================*/
.contents_box_header_right{
	float:right;
	width:530px;
	padding:40px 0px;
}
.contents_box_header_left{
	float:left;
	width:370px;
	padding:40px 0px;
}

.contents_box_header_right h3{
	font-size:17px;
	line-height:30px;
	font-weight:bold;
	border-left:solid #132852 5px;
	border-bottom:solid #132852 1px;
	padding:0px 8px;
}

.contents_box_header_right h3+p{
	font-size:13px;
	line-height:20px;
	padding:15px 0px 0px;
}


/*コンテンツボックス*/
/*==================================================================*/
.contents_box_body{
/*	width:744px;*/
	padding:20px;
	background:url(../imgs/body_bg_stripe.gif);
	box-sizing:border-box;
	box-shadow: inset 0px 1px 3px #767676;
}

.small_contents_box{
	box-sizing:border-box;
	float:left;
	width:295px;
	padding:10px;
	margin-right:18px;
	margin-bottom:18px;
	background-color:#FFF;
	box-shadow: 0px 1px 3px #767676;
}
.margin_none{margin-right:0px;}

.small_contents_box h4{
	color:#FFF;
	font-size:15px;
	line-height:40px;
	margin-bottom:13px;
	text-align:center;
	text-shadow:0px 1px 1px #666;
	box-shadow: 0px 1px 2px #767676;
}

.small_contents_box h4+figure img{width: 100%;}
.small_contents_box h4+figure{
    width: 100%;
}


.small_contents_box.green h4{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#638c0b+0,85b71b+88,638c0b+90,486900+100 */
background: #638c0b; /* Old browsers */
background: -moz-linear-gradient(top,  #638c0b 0%, #85b71b 88%, #638c0b 90%, #486900 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #638c0b 0%,#85b71b 88%,#638c0b 90%,#486900 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #638c0b 0%,#85b71b 88%,#638c0b 90%,#486900 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#638c0b', endColorstr='#486900',GradientType=0 ); /* IE6-9 */
}

.small_contents_box.greenish_yellow h4{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#85b71b+1,c1db80+88,7baa17+90,6f9b11+100 */
background: #85b71b; /* Old browsers */
background: -moz-linear-gradient(top,  #85b71b 1%, #c1db80 88%, #7baa17 90%, #6f9b11 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #85b71b 1%,#c1db80 88%,#7baa17 90%,#6f9b11 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #85b71b 1%,#c1db80 88%,#7baa17 90%,#6f9b11 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#85b71b', endColorstr='#6f9b11',GradientType=0 ); /* IE6-9 */
}

.small_contents_box.orange h4{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ea5404+0,f39700+88,ea5404+90,c82f06+100 */
background: #ea5404; /* Old browsers */
background: -moz-linear-gradient(top,  #ea5404 0%, #f39700 88%, #ea5404 90%, #c82f06 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ea5404 0%,#f39700 88%,#ea5404 90%,#c82f06 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ea5404 0%,#f39700 88%,#ea5404 90%,#c82f06 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ea5404', endColorstr='#c82f06',GradientType=0 ); /* IE6-9 */
}

.small_contents_box.blue h4{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#003f76+1,0068b6+88,003466+90,001942+100 */
background: #003f76; /* Old browsers */
background: -moz-linear-gradient(top,  #003f76 1%, #0068b6 88%, #003466 90%, #001942 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #003f76 1%,#0068b6 88%,#003466 90%,#001942 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #003f76 1%,#0068b6 88%,#003466 90%,#001942 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003f76', endColorstr='#001942',GradientType=0 ); /* IE6-9 */
}

.small_contents_box.purple h4{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#530e75+1,9b5ea3+88,5a147e+90,440061+100 */
background: #530e75; /* Old browsers */
background: -moz-linear-gradient(top,  #530e75 1%, #9b5ea3 88%, #5a147e 90%, #440061 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #530e75 1%,#9b5ea3 88%,#5a147e 90%,#440061 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #530e75 1%,#9b5ea3 88%,#5a147e 90%,#440061 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#530e75', endColorstr='#440061',GradientType=0 ); /* IE6-9 */
}

.small_contents_box p{
	margin-top:13px;
	font-size:11px;
	line-height:18px;
}
.small_contents_box ul{
	width:120px;
	text-align:center;
	margin:13px auto;
}
.small_contents_box ul li{
	border:solid 1.5px #888889;
	background-color:#EEEFEF;
	border-radius: 3px;
	box-shadow: 0px 1px 1.5px #bcbcbc;
}

.small_contents_box ul li a{
	font-size:10px;
	display:block;
	color:#595757;
	padding:5px 15px;
}

/*事例紹介部分*/
/*==================================================================*/
.jirei_contents_wrap{
	margin:15px 0px 50px;
	padding:10px;
	border:solid 1px #666666;
	border-top:solid 5px #666666;
}

.jirei_contents_wrap ul{
	width:550px;
	text-align:center;
	margin:0px auto;
}
.jirei_contents_wrap ul li{
	float:left;
}
.jirei_contents_wrap ul li.yohaku{margin-right:20px;}



/*ボタンと教育・研修サービスについてのお問い合わせ先*/
/*==================================================================*/

.contents_access .contents_text+figure img{width: 100%;}
.contents_access {
    margin-top: 25px;
    padding: 25px;
    border: solid 1px #DCDCDD;
}

.contents_access .contents_text{
    width: 50%;
    float: left;
    box-sizing: border-box;
}

.contents_access .contents_text h3{
   font-size: 18px;
    text-indent: -12px;
    padding-bottom: 15px;
}

.contents_access .contents_text p{
   font-size: 15px;
}

.contents_access .contents_text+figure{
    width: 50%;
    float: left;
    border: solid 1px #DCDCDD;
    box-sizing: border-box;
}






