@charset 'utf-8';

html, body{
    height: auto;
}

.mobile-toggle{
	display: none;
}

/*--------------------------------------------------------------------------------
  main
--------------------------------------------------------------------------------*/
.main{
	margin: 135px auto 0;
	background: #000;
}
	.main-inner{
	}
		.main-header{
			padding: 18px 0;
			background: #000;
			border-bottom: 1px solid #999999;
		}
			.main-header-body{
				height: 0;
				padding-top: 22px;
				background: url(../../images/evidence/bg_main_header.png) no-repeat center;
			}

/*--------------------------------------------------------------------------------
  hero
--------------------------------------------------------------------------------*/
.hero{
	max-width: 1280px;
	margin: 0 auto;
	background: #fff;
}
	.hero-inner{
		position: relative;
		height: 0;
		padding-top: 600px;
		background: url(../../images/evidence/hero_v2.png) no-repeat center top;
	}
		.hero-visual{
			position: static;
		}
			.hero-visual img{
				max-width: 100%;
				height: auto;
				vertical-align: bottom;
			}
		.hero-header{
		}
			.hero-header span{
				display: block;
				height: 0;
				line-height: 0;
				text-indent: 100%;
				white-space: nowrap;
				overflow: hidden;
			}
		.hero-copy{
		}
			.hero-copy span{
				display: block;
				height: 0;
				text-indent: 100%;
				white-space: nowrap;
				overflow: hidden;
			}
		.hero-detail{
		}
			.hero-lead{
			}
				.hero-lead span{
					display: block;
					height: 0;
					text-indent: 100%;
					white-space: nowrap;
					overflow: hidden;
				}
			.hero-assigned{						
			}
				.hero-assigned span{
					display: block;
					height: 0;
					text-indent: 100%;
					white-space: nowrap;
					overflow: hidden;
				}

/*--------------------------------------------------------------------------------
  evidence
--------------------------------------------------------------------------------*/
.evidence{
	max-width: 1280px;
	margin: 0 auto;
	padding: 100px 0 84px;
	background: #fff;
}
	.evidence-inner{
		max-width: 920px;
		margin: 0 auto;
		color: #030303;
		text-align: left;
	}

.evidence-section{
	margin: 0 auto 96px;
}
.evidence-section.s1{
	margin-bottom: 70px;
}
.evidence-section.s2{
	margin-bottom: 82px;
}
.evidence-section.s4{
	margin-bottom: 72px;
}
.evidence-section.s5{
	margin-bottom: 0;
}
	.evidence-header{
		margin: 0 auto 30px;
		padding: 0 0 14px;
		line-height: 1;
		font-size: 20px;
		font-weight: bold;
		border-bottom: 1px solid #9fa0a0;
	}
		.evidence-header span{
			display: block;
			height: 0;
			padding-top: 30px;
			text-indent: 100%;
			white-space: nowrap;
			overflow: hidden;
			background-repeat: no-repeat;
			background-position: left center;
		}
		.s1 .evidence-header span{
			background-image: url(../../images/evidence/bg_evidence_heading01.png);
		}
		.s2 .evidence-header span{
			background-image: url(../../images/evidence/bg_evidence_heading02.png);
		}
		.s4 .evidence-header span{
			background-image: url(../../images/evidence/bg_evidence_heading04.png);
		}

	.evidence-body{
		display: table;
		width: 100%;
		table-layout: fixed;
	}
		.evidence-detail{
			display: table-cell;
			vertical-align: top;
			padding: 0 52px 0 0;
		}
		.evidence-image{
			display: table-cell;
			vertical-align: top;
			width: 400px;
		}
			.evidence-figure{
				margin: 0 auto 20px;
			}
				.evidence-figure img{
					max-width: 100%;
					height: auto;
					vertical-align: bottom;
				}

			.evidence-figure-captioned{
			}
				.evidence-figure-captioned .evidence-figure-body{
					display: table;
					width: 100%;
					table-layout: fixed;
				}
					.evidence-figure-captioned .evidence-figure-image{
						display: table-cell;
						vertical-align: top;
					}
					.evidence-figure-captioned figcaption{
						display: table-cell;
						vertical-align: bottom;
						width: 153px;
						padding: 0 0 0 20px;
						font-size: 11px;
					    line-height: 18px;
					}

		.evidence-eyecatch{
			margin: 0 auto 96px;
		}

/*--------------------------------------------------------------------------------
  eyecatch
--------------------------------------------------------------------------------*/
.eyecatch{
	max-width: 920px;
}
	.eyecatch img{
		width: 100%;
		height: auto;
		vertical-align: bottom;
	}

/*--------------------------------------------------------------------------------
  interview
--------------------------------------------------------------------------------*/
.interview{
	margin-top: -6px;
	overflow: hidden;
}
	.interview-name{
		position: relative;
		clear: both;
		float: left;
		width: 77px;
		font-size: 14px;
		line-height: 24px;
	}
	.interview-name.interview-name-red{
		color: #e64f52;
	}
	.interview-name.interview-name-orange{
		color: #e68552;
	}
	.interview-detail{
		margin-left: 77px;
		margin-bottom: 24px;
		font-size: 14px;
		line-height: 22px;
	}
.s1 .interview{
	margin-top :0;
}

/*--------------------------------------------------------------------------------
  profile
--------------------------------------------------------------------------------*/
.profile{
	padding: 38px 40px 40px;
	border: 1px solid #9fa0a0;
	overflow: hidden;
}
	.profile-header{
		margin: 0 auto 28px;
		font-size: 26px;
		font-weight: bold;
		line-height: 1;
	}
		.profile-header span{
			display: block;
			height: 0;
			padding-top: 26px;
			text-indent: 100%;
			white-space: nowrap;
			overflow: hidden;
			background-image: url(../../images/evidence/bg_profile_heading.png);
			background-position: left center;
			background-repeat: no-repeat;
		}

	.profile-items{
		margin: 0 -30px;
	}
		.profile-items-inner{
			display: table;
			width: 100%;
			table-layout: fixed;
			border-spacing: 30px 0;
		}
			.profile-item{
				display: table-cell;
				vertical-align: top;
			}
				.profile-item > dl{
					display: table;
					width: 100%;
					table-layout: auto;
					border-spacing: 0;
				}
					.profile-image{
						display: table-cell;
						vertical-align: top;
						padding: 0 20px 0 0;
					}
						.profile-image img{
							vertical-align: bottom;
						}
					.profile-detail{
						display: table-cell;
						vertical-align: top;
						padding: 5px 0 0 0;
					}
						.profile-detail dt{
							margin: 0 auto 16px;
							font-size: 16px;
							line-height: 1;
						}
						.profile-detail dd{
							font-size: 12px;
							line-height: 18px;
						}

@media only screen and (max-width: 920px){
	.evidence{
	}
		.evidence-inner{
			padding: 0 10px;
		}
		.evidence-image{
			width: 43%;
		}

	.profile-image{
		width: 45%;	
	}
		.profile-image img{
			max-width: 100%;
			height: auto;
		}
}


@media only screen and (max-width:768px){
	.mobile-toggle{
		display: block;
		position: absolute;
	    top: 55px;
	    right: 0;
	    z-index: 1;
	}

	.main{
		margin: 55px auto 0;
		text-align: center;
	}
		.main-inner{
			position: relative;
		}
			.main-header{
				padding: 16px 0;
				background: #000;
			}
				.main-header-body{
					height: 0;
					padding-top: 14px;
					background: url(../../images/evidence/bg_main_header_sp.png) no-repeat center;
					background-size: contain;
				}
	.hero{
		background: #000;
	}
		.hero-inner{
			height: auto;
			padding: 0;
			background: none;
		}
			.hero-header{
				position: static;
			    top: auto;
			    left: auto;
			    width: auto;
			    padding: 35px 0 0;
			    background: none;
			}
				.hero-header h4{
					padding-top: 80px;
			   	 	background: url(../../images/evidence/bg_hero_header_sp.png) no-repeat center;
			   	 	background-size: contain;
				}
				.hero-header:after{
					content: '';
					display: block;
					margin: 20px auto 0;
					padding-top: 56.5%;
					background: url(../../images/evidence/hero_sp.png) no-repeat center;
					background-size: 100% auto;
				}
			.hero-copy{
				position: static;
			    top: auto;
			    left: auto;
			    width: auto;
			    margin: 0;
			    padding: 30px 0 25px;
			    background: none;
			}
				.hero-copy span{
					padding-top: 76px;
			   	 	background: url(../../images/evidence/bg_hero_copy_sp.png) no-repeat center;
			   	 	background-size: contain;
				}

			.hero-detail{
				position: static;
			    top: auto;
			    left: auto;
			    bottom: auto;
			    width: auto;
			    margin: 0;
			    padding: 0;
			    background: none;
			}
				.hero-lead{
					width: 282px;
					margin: 0 auto 40px;
					padding: 18px 0 22px;
					color: #C5C5C5;
					border: 1px solid #fff;
				}
					.hero-lead span{
						height: auto;
						padding: 0 20px;
						font-size: 11px;
						line-height: 22px;
						text-align: left;
						text-indent: 0;
						white-space: normal;
					}
				.hero-assigned{
				}
					.hero-assigned:before{
						content: '';
						display: block;
						padding-top: 46%;
						background: url(../../images/evidence/bg_hero_visual_sp.png) no-repeat center;
			   	 		background-size: 100% auto;
					}
					.hero-assigned p{
						padding: 22px 0 33px;
					}
						.hero-assigned span{
							padding-top: 33px;
							background: url(../../images/evidence/bg_hero_assigned_sp.png) no-repeat center;
			   	 			background-size: contain;
						}

	.evidence{
		padding: 40px 0;		
	}
		.evidence-inner{
			width: 300px;
			margin: 0 auto;
		}
			.evidence-header{
				margin: 0 auto 30px;
				padding: 0 0 10px;
				line-height: 1;
				font-size: 13px;
				font-weight: bold;
				border-bottom: 1px solid #9fa0a0;
			}
				.evidence-header span{
					padding-top: 4.6%;
					background-size: 100% auto;
				}

			.evidence-section{
				margin: 0 auto 45px!important;
			}
				.evidence-body{
					display: block;
					width: auto;
				}
					.evidence-detail{
						display: block;
						padding: 0;
					}
					.evidence-image{
						display: block;
						width: auto;
					}
						.evidence-figure{
							margin: 0 auto 20px;
							text-align: center;
						}
							.evidence-figure img{
								max-width: 100%;
								height: auto;
								vertical-align: bottom;
							}

						.evidence-figure-captioned{
						}
							.evidence-figure-captioned .evidence-figure-body{
								display: block;
								width: auto;
								overflow: hidden;
							}
								.evidence-figure-captioned .evidence-figure-image{
									display: block;
									float: left;
									width: 160px;
									max-width: none;
								}
								.evidence-figure-captioned figcaption{
									display: block;
									width: auto;
									margin-left: 170px;
									padding: 0;
									font-size: 10px;
									text-align: left;
								}
			.evidence-eyecatch {
			    margin: 0 auto 45px;
			}

	.interview{
		margin: 0 auto!important;
	}
		.interview-name{
			width: 45px;
			font-size: 10px;
			line-height: 17px;
		}
		.interview-name.interview-name-red{
			color: #e64f52;
		}
		.interview-name.interview-name-orange{
			color: #e68552;
		}
		.interview-detail{
			margin-left: 55px;
			margin-bottom: 18px;
			font-size: 10px;
			line-height: 17px;
		}

	.profile{
		padding: 19px 20px 20px;
	}
		.profile-header{
			margin: 0 auto 14px;
			font-size: 26px;
			font-weight: bold;
			line-height: 1;
		}
			.profile-header span{
				padding-top: 15px;
				background-size: contain;
			}
		.profile-items{
			margin: 0 auto;
		}
			.profile-items-inner{
				display: block;
				width: auto;
				border-spacing: 0;
			}
				.profile-item{
					display: block;
					margin: 0 auto 10px;
				}
					.profile-item > dl{
						display: block;
						width: auto;
					}
						.profile-image{
							display: block;
							width: auto;
							margin: 0 auto 8px;
							padding: 0;
						}
							.profile-image img{
								vertical-align: bottom;
							}

						.profile-detail{
							display: block;
						}
							.profile-detail dt{
								margin: 0 auto 4px;
								font-size: 14px;
								line-height: 1;
							}
							.profile-detail dd{
								font-size: 10px;
								line-height: 17px;
							}

}


/******************************************************************************

 fix IE

******************************************************************************/
.ie .main, .ie .sitemap, .ie #pagetop, .ie #footer{
	position: relative;
	z-index: 1;
}

/******************************************************************************

 print

******************************************************************************/
@media print{
	.main{
		margin-top: 0;
	}
	.main-header{
		padding: 0;
	}
		.main-header-body{
			height: auto;
	    	padding-top: 0;
	    	text-align: center;
		}
			.main-header-body span{
				position: static!important;
				width: auto!important;
			    height: auto!important;
			    margin: 0!important;
			    font-size: 30px;
			    font-weight: bold;
			    color: #333;
			}
			
	.hero{
		padding: 50px 20px;
		border-top: 1px solid #333;
		border-bottom: 1px solid #333;
	}
		.hero-inner{
			position: static;
			height: auto;
			padding-top: 0;
			background: none;
		}
			.hero-header{
				position: static;
				top: auto;
				left: auto;
				width: auto;
				margin: 0 auto 50px;
				padding-top: 0;
				color: #333;
				font-size: 2em;
			}
			.hero-copy{
				position: static;
				top: auto;
				left: auto;
				width: auto;
				margin: 30px auto;
				padding-top: 0;
				color: #333;
			}
			.hero-detail{
				position: static;
				top: auto;
				left: auto;
				width: auto;
				padding-top: 0;
				color: #333;
			}
				.hero-lead{
					margin: 0 auto 20px;
				}
				.hero-assigned{
					font-weight: bold;
				}
		.hero span{
			height: auto;
		    line-height: normal;
		    text-indent: 0;
		    white-space: normal;
		    overflow: visible;
		}

	.evidence-header span{
		height: auto;
		padding-top: 0;
	}
	.s1 .evidence-header span:before{
		display: block;
		content: url(../../images/evidence/bg_evidence_heading01.png);
	}
	.s2 .evidence-header span:before{
		display: block;
		content: url(../../images/evidence/bg_evidence_heading02.png);
	}
	.s4 .evidence-header span:before{
		display: block;
		content: url(../../images/evidence/bg_evidence_heading04.png);
	}
	.s5 .profile-header span{
		height: auto;
		padding-top: 0;
		text-indent: 0;
		white-space: normal;
	}
	.evidence-image{
		width: 200px;
	}
	.evidence-figure-captioned .evidence-figure-body{
		display: block;
	}
		.evidence-figure-captioned .evidence-figure-image{
			display: block;
		}
		.evidence-figure-captioned figcaption{
			display: block;
			width: auto;
			padding: 0;
		}
}