@import url(//fonts.googleapis.com/css?family=Lato:300,400);
@charset "utf-8";
/*------------------------------------------------------------
	リセット
------------------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, figure { margin: 0; padding: 0; background: transparent; border: 0; outline: 0; font-size: 14px; font-weight:normal; letter-spacing:1px; font-family: "Lato", Verdana, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;}
body, table, input, textarea, select, option { font-family: "Lato", Verdana, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; font-size: 14px; } article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; } ol, ul { list-style: none; padding:0; margin:0; } blockquote, q { quotes: none; } :focus { outline: 0; } ins { text-decoration: none; } del { text-decoration: line-through; }

/*------------------------------------------------------------
	リンク
------------------------------------------------------------*/
a {
	color: #333;
	text-decoration: none;
}
a:link { }
a:visited { }
a:hover { }
a:active { }

/*------------------------------------------------------------
	レイアウト
------------------------------------------------------------*/
body {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100vh;
	background-color:#CCC;
}

div#container {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100vh;
	background-size:100% auto;
	background-repeat:no-repeat;

}
main > section {
	position:relative;
	top:0;
	left:0;
	width:100%;
	height:100vh;
	min-height:720px;
	background-size:110vw auto;
	background-repeat:no-repeat;
}
@media screen and (max-width:1000px) {
main > section {
	background-size:auto 110vh;
}
}




/*------------------------------------------------------------
	ヘッダー
------------------------------------------------------------*/
header {
	position:absolute;
	top:0;
	left:0;
	
	margin:0;
	padding:0;

	width: 100%;
	height: 300px;
	display:block;
	
	float:left;

}
header h1 {
	position:absolute;
	bottom:15px;
	left:0;
	display: block;
	height: 20px;
	line-height:20px;
	width: 100%;
	font-size:10px;
	overflow:hidden;
	z-index:1;
	/*background-color:#F60;*/
	text-align:center;
}

/*------------------------------------------------------------
	フッター
------------------------------------------------------------*/
footer {
	position:relative;
	top:0;
	left:0;
	width:100%;
	height: 120px;
    text-align:center;
    color:#FFF;
	background-color:#353535;
	filter:alpha(opacity=30);
	      -khtml-opacity:0.30;
	        -moz-opacity:0.30;
	             opacity:0.30;
}
footer a {
    color:#FFF;
}

footer div#copyright {
	position:absolute;
	bottom:15px;
	left:0;
	width:100%;
	height:15px;
	font-size:11px;
	font-family:Arial, Helvetica, sans-serif;
	text-align:center;
	line-height:15px;
	letter-spacing:0.5px; 
}
footer div#update {
	position:absolute;
	bottom:3px;
	right:3px;
}


/*------------------------------------------------------------
	共通
------------------------------------------------------------*/
main {
	position:relative;
	top:0;
	left:0;
	height:auto;
}
main > section > div {
	display:block;
	position:relative;
	top:25vh;
	left:0;
	width:100%;
	max-height:75vh;
	overflow:auto;
}
main > section > div > ul {
	display:block;
	position:relative;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
main > section > div > ul > li {
	position:relative;
	top:0;
	left:0;
	display:table;
	margin:0 10% 20px 10%;
	width:80%;
	font-size:18px;
	height:30px;
	line-height:30px;
	padding-bottom:20px;
	border-bottom:1px #000 dotted;
}
main > section > div > ul > li:last-child {
	border-bottom:none;
}
main > section > div > ul > li a {
	display:block;
	color:#000;
	white-space: nowrap;
	overflow:hidden;
	text-overflow: ellipsis;
	max-width:270px;
}
main > section > div > ul > li > div.label {
	font-size:12px;
}
main > section > div > ul > li > div.name {
	font-size:16px;
}
main > section > div > ul > li > div.num {
	text-align:right;
	font-size:16px;
}
main > section > div > ul > li > div.url {
	text-align:right;
	font-size:16px;
}



/*------------------------------------------------------------
	コンテンツ
------------------------------------------------------------*/
main h1 {
	position:relative;
	top:0;
	left:5%;
	display:block;
	width:90%;
	height:auto;
	border-bottom:1px solid #332222;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	     -o-box-sizing: border-box;
	        box-sizing: border-box;
	font-size:30px;
	color:#110000;
	line-height:45px;
	padding-bottom:15px;
	margin:30px 0 10px 0;
}
main h2 {
	position:absolute;
	top:10vh;
	right:0;
	width:60%;
	max-width:360px;
	line-height:30px;
	padding-top:15px !important;
	padding-bottom:15px !important;
	height:auto;
	color:#000;
	font-size:24px;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
	text-align:center;
	background: rgba(255,255,255,0.6);
}
main h3 {
	position:relative;
	top:0;
	left:0;
	display:block;
	width:100%;
	height:36px;
	line-height:36px;
	font-size:20px;
	text-align:center;
	color: #333;
}