@charset "UTF-8";
/* CSS Document */

body{
	background-color:#000;
	font-size:14px;
	line-height:22px;
	letter-spacing:3px;
	text-align:left;
	margin: 0;
	}

div#wrapper{
	max-width:800px;
	margin:0 auto;
	background-color: #FFFF00;
	}
	
div#title{
	max-width:800px;
	margin:0 auto;
	text-align: center;
	}
	
div#yodogawa{
	max-width:800px;
	margin:0 auto;
	text-align: center;
	}

div#contents{
	max-width:800px;
	margin:0 auto;
	background-image: url(../images/bg_contents.gif);
	background-repeat: repeat-y;
	text-align: left;
	background-size: contain;
	}
	
div#links{
	max-width:800px;
	margin:0 auto;
	background: url(../images/bg_contents.gif);
	background-size: contain;
	padding-bottom: 20px;
	}
	
div#footer{
	max-width:800px;
	margin:0 auto;
	}
	
a:link {
	color: #0C3;
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: none;
	color: FF0000;
}
a:active {
	text-decoration: none;
}
	
.itoi {
	color: #008cff;
}
.terry {
	color: #F00;
}
.line {
	height:11px;
	background-color: #FDFA31;
}
.date {
	font-size: 12px;
	letter-spacing: 1px;
}
/* スマホ対応 */
table {
  border-collapse: collapse;
}
table td, table th {
  padding: 10px;
}
table th {
  background-color: #eee;
}
#links table{
	border-collapse: separate;
}
.spOnly{
	display: none;
}
@media screen and (max-width: 768px) {
	div#title img{
		width: 100%;
		height: auto;
	}
	div#yodogawa img{
		width: 100%;
		height: auto;		
	}
	div#contents .title img{
		width: 100%;
		height: auto;
	}
}
@media screen and (max-width: 640px) {
	br{
		display: none;
	}
	.spOnly{
		display: block;
	}
	.pcOnly{
		display: none;
	}
	.hidden{
		visibility: hidden;
	}
	.marginTop{
		margin-top: 32px;
	}
	div#yodogawa{
		position: relative;
	}
	.prof{
		position: absolute;
		width: 23.4% !important;
		height: auto !important;
		top: 55.42%;
		left: 2.4%;
	}
	div#wrapper{
		width: 100%;
		font-family: 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
		font-size: 16px;
	}
	div#title img{
		width: 100%;
		height: 37.375%;
	}
	div#yodogawa img{
		width: 100%;
		height: 58%;
	}
	div#contents{
		line-height: 2;
		letter-spacing: 1px;
	}
	div#contents .title img{
		width: 100%;
		height: 17.5%;
		padding: 0;
	}
	div#contents img{
		width: 98%;
		height: 65.3333%;
		padding: 0 1%;
	}
	div#contents .continued{
		padding: 40px 0;
	}
	div#contents .continued img{
		width: 50%;
		height: auto;
	}
	div#contents .goodbye{
		padding: 40px 0;
	}
	div#contents .goodbye img{
		width: 68%;
		height: auto;
	}
	table{
		width: 100%;
	}
	table td, table th {
		display: block;
	}
	table td:nth-of-type(2){
		padding-top: 0;
	}
	div#contents .next img{
		width: 50%;
		margin: 0 25%;
	}
	#links table{
		width: 98%;
		border-collapse: collapse;
		margin: 35px auto;
	}
	#links table:last-of-type{
		margin-bottom: 0;
	}
	div#links{
		padding-bottom: 0;
	}
	div#links .links_sp td img{
		width: 100%;
		height: auto;
		margin-bottom: 10px;
	}
	div#links .links_sp td img.contents_title{
		width: 30%;
		height: auto;
	}
	div#links .links_sp{
		margin-bottom: 35px;
	}
	div.links{
		width: 96%;
		display: flex;
		margin: 0 auto;
		text-align: center;
		padding-top: 30px;
	}
	.links img{
		width: 90% !important;
		height: auto !important;
	}
	div.sns{
		display: flex;
		width: 96%;
		margin: 30px auto 0;
		justify-content: space-around;
		flex-wrap: wrap;
	}
	div.sns img{
		width: 138px;
	}
	.line {
		height: 4px;
	}
	.itoi, .terry{
		padding-top:16px;
		padding-bottom: 0;
	}
	.date{
		margin-top: -15px;
		margin-bottom: 15px;
	}

}
