@charset "utf-8";

/*
* layout.css
* date---2014/10/00
*/


/*===============================================
	layout.css
===============================================*/

/* Windows 用 Medium 指定の游ゴシック */
@font-face {
  font-family: "Yu Gothic M";
  src: local("Yu Gothic Medium");
}
/* font-weight: bold の時は通常どおり Bold 書体を使わせる */
@font-face {
  font-family: "Yu Gothic M";
  src: local("Yu Gothic Bold");
  font-weight: bold;
}

/* ----------------------------------------------
	Basic-Design
---------------------------------------------- */
body {
	background: url(img/bg.jpg) no-repeat center top;
	color: #333;
	font-size: 1.5em;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", HelveticaNeue, "Segoe UI", "游ゴシック体", YuGothic, "Yu Gothic M", "游ゴシック Medium", "Yu Gothic Medium", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN W3", HiraKakuProN-W3, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height: 1.8;
}
html {
	overflow-y: scroll;
}
a.alpha:hover img{
	filter:alpha(opacity=75);  /* IE7以下用 */
	-ms-filter: "alpha(opacity=75)"; /* IE8用 */
	-moz-opacity:0.75; /* Firefox 1.5未満, Netscape用 */
	-khtml-opacity: 0.75;  /* Safari 1.x, 他khtmlに対応したブラウザ用  */
	opacity: 0.75; /* Firefox 1.5以上, Opera, Safari用 */
}
a:link{
	color: #039;
	text-decoration: underline;
}
a:visited{
	color: #039;
	text-decoration: underline;
}
a:hover,a:active{
	color: #039;
	text-decoration: none;
}
img {
	-ms-interpolation-mode: bicubic; /* ie7 画像荒れ対策*/
}
table {
    font-size:inherit;
}
.red{
	color: #e60012;
	font-size: 16px;
}


/* ----------------------------------------------
	layout
---------------------------------------------- */
#contents{
	width: 960px;
	margin: 0 auto;
	padding: 100px 0 40px;
	text-align:left;
}
	#contents p.lead{
		margin-bottom: 60px;
		color: #FFF;
		font-size: 17px;
		text-align: center;
	}
	#contents p.lead strong{
		font-size: 22px;
		font-weight: normal;
	}
	#contents p.lead strong.blue{
		color: #FFFF26;
	}
#main{
	padding: 60px;
	background: #FFF;
	border-radius: 30px;
}
#footer{
	padding: 40px;
}
address{
	color: #FFF;
	font-size: 12px;
	font-style: normal;
	text-align: center;
}

/* Canvas
------------------------------- */
.canvas-wrapper{
	position: relative;
	padding-top: 424px;
}
.canvas-wrapper h1{
	position: absolute;
	width: 960px;
	left: 50%;
	top: 430px;
	margin-left: -480px;
	text-align: center;
	z-index: 2;
}
canvas {
	display: block;
	width: 100%;
}
canvas.flipped {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}


/* table
------------------------------- */
table{
	width: 100%;
	border-collapse: separate;
	*border-collapse: collapse;
	border-spacing: 0;
}
table th,
table td{
	font-size: 16px;
	line-height:1.4;
}
@media screen and (max-width:767px){
	table th,
	table td{
		font-size: 12px;
	}
}

/* table_border */
table.table_border{
	width: 100%;
	margin-bottom: 10px;
	border-collapse: separate;
	*border-collapse: collapse;
	border-spacing: 0;
}
	table.table_border th{
		border-right: 8px solid #EEE;
		border-bottom: 8px solid #DDD;
		vertical-align: middle;
	}
	table.table_border td{
		padding: 20px 14px;
		border-right: 8px solid #EEE;
		border-bottom: 8px solid #DDD;
		vertical-align: middle;
	}
	table.table_border thead th,
	table.table_border thead td{
		padding: 20px 14px;
		background:#f5f5f5;
		text-align: center;
	}
	table.table_border tbody th,
	table.table_border tbody td{
		font-size: 15px;
	}
	table.table_border tbody th{
		padding: 20px 14px;
		color: #FFF;
		background: #021774;
	}
	table.table_border tbody th span{
		font-size: 10px;
	}
	table.table_border td p{
		margin-bottom: 0.5em;
	}