@charset 'utf-8';


/* override
	------	------	------	------	------	------ */
.cont-header h1 a,
.cont-footer h2 a {
	cursor: default;
}
.cont-header h1 a:hover,
.cont-footer h2 a:hover {
	opacity: 1;
}
.cont-header .hd-news {
	display: block;
}
.cont-footer {
	margin-top: 40px;
}


/* op image
	------	------	------	------	------	------ */
.op-bg {
/* 	display: none; */
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: 1000;
}
.op-bg .kumamon {
	position: fixed;
	top: 50%;
	left: 50%;
	margin-top: -160px;
	margin-left: -148px;
	width: 296px;
	height: 320px;
	background: center top no-repeat url(../img/common/kumamon.png);
	background-size: contain;
	/*opacity: 0;*/
}



/* mainvisual
	------	------	------	------	------	------ */
.mainvisual {
	position: relative;
	/* margin-top: -20px; */
	margin-top: -70px;	/* 警報表示用修正 */
	height: 640px;
	overflow: hidden;
	z-index: 50;
}
.mainvisual .slides div {
	width: auto;
	height: 640px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.mv01 {background-image: url(../img/top/mv_photo01.jpg);}
.mv02 {background-image: url(../img/top/mv_photo02.jpg);}
.mv03 {background-image: url(../img/top/mv_photo03.jpg);}
.mv04 {background-image: url(../img/top/mv_photo04.jpg);}
.mv05 {background-image: url(../img/top/mv_photo05.jpg);}
.mv06 {background-image: url(../img/top/mv_photo06.jpg);}

.mainvisual .slides div img {
	float: right;
	margin-top: 200px;
}
.mainvisual .slides div span {
	display: none;
}

.mainvisual .logo {
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -490px;
	width: 980px;
	height: 644px;
	text-align: right;
	z-index: 100;
}
.mainvisual .logo a {
	display: inline-block;
	margin-top: 155px;
}



/* donation
	------	------	------	------	------	------ */
.donation {
	position: relative;
	margin: -190px auto 60px;
	width: 1060px;
	border: solid 1px #e6e6e6;
	border-radius: 8px;
	overflow: hidden;
	z-index: 100;
}
.donation .detail {
	background: #fff;
}
.donation .prefectural {
	background: #fafafa;
	border-top: solid 2px #f2f2f2;
}
.donation .inner {
	margin: 0 auto;
	padding: 35px 0;
	width: 980px;
}
.donation .chapt {
	margin: 0;
}
.donation .chapt p {
	margin: 0;
}
.layout-col2.donate-header {
	padding-bottom: 30px;
}
.layout-col2.donate-header .box {
	width: 630px;
}
.layout-col2.donate-header .box:first-child {
	width: 310px;
}
.layout-col2.donate-btn {
	padding-bottom: 10px;
}
.layout-col2.donate-btn:first-child {
	padding-bottom: 30px;
}
.layout-col2.donate-btn .box {
	width: 410px;
}
.layout-col2.donate-btn .box:first-child {
	width: 505px;
}
.layout-col2.donate-btn a:hover {
	opacity: 0.6;
}

.donation .price {
	padding: 6px 0 6px 40px;
	background-color: #fff8dc;
	border: solid 2px #f7d52b;
	border-radius: 8px;
}
.donation .price li {
	float: left;
	font-size: 22px;
}
.donation .price li.money {
	margin-right: 20px;
	padding-right: 20px;
	border-right: solid 1px #f9d529;
}
.donation .price li.number {
}
.donation .price li span {
	margin-right: 15px;
	font-size: 12px;
	font-weight: bold;
}
.donation .price li small {
	margin-left: 6px;
	font-size: 9px;
}

.donation .chapt p.credit-att {
	margin-bottom: 35px;
	font-size: 11px;
	line-height: 1.6em;
}
.donation a {
	color: #4d4d4d;
}
/* less window-size */
@media only screen and (max-width:1059px) {
	.donation {
		width: 980px;
	}
}



/* top-cont
	------	------	------	------	------	------ */
.top-cont {
	margin: 0 auto;
	width: 980px;
	opacity: 1 !important;
}
.cont-links {
	float: right;
	width: 730px;
}

/* news
	------	------	------ */
.links-news {
	position: relative;
	margin-bottom: 60px;
	padding: 25px 35px 10px 117px;
	background-color: #fff;
	border: solid 1px #e6e6e6;
	border-radius: 8px;
}
.links-news h3 {
	position: absolute;
	top: 25px;
	left: 35px;
}
.links-news li {
	margin-bottom: 15px;
}
.links-news li .date {
	display: inline-block;
	width: 98px;
}
.links-news li a {
	color: #4d4d4d;
}
.links-news li::after {
	content: '›';
	margin-left: 10px;
	font-size: 20px;
	line-height: 13px;
}

/* school
	------	------	------ */
.links-school {
	margin-bottom: 60px;
}

/* links-nav
	------	------	------ */
.links-nav {
	margin-bottom: 70px;
}
.links-nav li {
	float: left;
	margin: 0 30px 30px 0;
}
.links-nav li:nth-of-type(3n) {
	margin-right: 0;
}
.links-nav li:not(.ln06) a:hover {
	opacity: 0.6;
	filter: alpha(opacity=60);
	-ms-filter: "alpha(opacity=60)";
}

/* comic
	------	------	------ */
.comic_latest {
	float: left;
	width: 190px;
}
.comic_latest .comic_body {
	margin-bottom: 50px;
}
.comic_latest .comic_body em {
	display: block;
	padding: 10px 0 15px;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
}
.comic_latest .comic_body img {
	width: 100%;
}
.comic_latest .comic_body a {
	display: block;
	margin-top: 20px;
}
.comic_latest .comic_list {
	margin: 20px auto;
	height: 160px;
	overflow: hidden;
}
.comic_latest .comic_list li {
	margin-bottom: 5px;
	color: #4d4d4d;
	text-decoration: underline;
	cursor: pointer;
}
.comic_latest .comic_list li:hover {
	text-decoration: none;
}
.comic-att {
	display: none;
	font-size: 12px;
	line-height: 1.5em;
}


/* SP view
	------	------	------	------	------	------ */
@media only screen and (max-width:640px) {



	/* op image
		------	------	------	------	------	------ */
	.op-bg .kumamon {
		position: fixed;
		top: 50%;
		left: 50%;
		margin-top: -100px;
		margin-left: -92.5px;
		width: 185px;
		height: 200px;
		background: center top no-repeat url(../img/common/kumamon.png);
		background-size: contain;
/* 		opacity: 0; */
	}



	/* override
		------	------	------	------	------	------ */
	.cont-gnav {
		position: absolute;		/* 2016.10.25 added */
		top: 265px;				/* 2016.12.21 305px -> 265px */
		display: block;
	}
	.ft-donate {
		display: none;
	}



	/* mainvisual
		------	------	------	------	------	------ */
	.mainvisual {
		position: relative;
		width: 100%;	/* 2016.10.25 added */
		margin-top: 0;
		height: 195px;
		z-index: 50;
		overflow: hidden;
	}
	.mainvisual .slides div {
		position: relative;
		width: auto;
		padding-bottom: 50%;
		height: 100%;
		min-height: 195px;
		background-position: top center;
		background-repeat: no-repeat;
		background-size: cover;
	}
	.mainvisual .slides div img {
		margin-top: 40px;
		margin-right: -5px;
		width: 22px;
		height: auto;
	}
	.mainvisual .slides div span {
		position: absolute;
		top: 40%;
		right: 2px;
		display: inline-block;
		width: 100px;
		height: 10px;
		font-size: 6px;
		letter-spacing: 1px;
		color: #fff;
		transform: rotate(90deg);
		transform-origin: 100% 0;
	}
	.mainvisual .logo {
		position: absolute;
		top: 0;
		left: -5px;
		margin-left: 0;
		width: 100%;
		height: auto;
		text-align: right;
		z-index: 100;
	}
	.mainvisual .logo a {
		width: 230px;
		margin-top: 10%;
	}
	.mainvisual .logo a img {
		width: 100%;
	}



	/* donation
		------	------	------	------	------	------ */
	.donation {
		margin: 130px 15px 35px;
		width: auto;
	}
	.donation .inner {
		margin: 0 15px;
		padding: 15px 0;
		width: auto;
	}
	.layout-col2.donate-header {
		padding-bottom: 20px;
	}
	.layout-col2.donate-header .box,
	.layout-col2.donate-btn .box {
		float: none !important;
		width: auto !important;
	}
	.layout-col2.donate-btn .box:first-child {
		margin-bottom: 20px;
	}
	.layout-col2.donate-header img {
		width: 230px;
	}
	.layout-col2.donate-btn {
		padding-bottom: 10px;
	}
	.layout-col2.donate-btn:first-child {
		padding-bottom: 30px;
	}
	.layout-col2.donate-btn img {
		width: 100%;
	}
	.donation .price {
		margin-bottom: 0;
		padding: 0;
		width: 100%;
		background: none;
		border: none;
	}
	.donation .price li {
		float: none;
		margin: 0 0 15px !important;
		padding: 18px 0 11px 10px !important;
		font-size: 22px;
		line-height: 23px;
		vertical-align: bottom;
		background-color: #fff7dd;
		border: solid 2px #f6d33f !important;
		border-radius: 8px;
		
	}
	.donation .price li span {
		display: inline-block;
		margin-right: 5px;
		width: 35%;
		font-size: 11px;
		line-height: 23px;
		font-weight: bold;
		text-align: right;
		vertical-align: top;
	}


	
	/* top-cont
		------	------	------	------	------	------ */
	.top-cont {
		width: 100%;
	}
	.cont-links {
		float: none;
		margin: 0 15px;
		width: auto;
	}

	/* news
		------	------	------ */
	.links-news {
		position: relative;
		margin-bottom: 35px;
		padding: 25px 35px 25px 25px;
		background-color: #fff;
		border: solid 1px #e6e6e6;
		border-radius: 8px;
	}
	.links-news h3 {
		position: static;
		margin-bottom: 20px;
	}
	.links-news ul {
		
	}
	.links-news li {
		position: relative;
		margin-bottom: 15px;
	}
	.links-news li:nth-of-type(n+4) {
		display: none;
	}
	.links-news li .date {
		display: block;
		font-size: 11px;
	}
	.links-news li a {
		display: block;
		width: auto;
		height: 17px;
		font-size: 12px;
		line-height: 23px;
		color: #4d4d4d;
		overflow: hidden;
	}
	.links-news li a:hover {
		text-decoration: none;
	}
	.links-news li::after {
		content: '>';
		position: absolute;
		bottom: 0px;
		right: -1em;
		font-size: 12px;
	}

	/* school
		------	------	------ */
	.links-school {
		margin-bottom: 35px;
	}
	.links-school img {
		width: 100%;
	}

	/* links-nav
		------	------	------ */
	.links-nav {
		margin: 0 auto 25px;
		max-width: 345px;
	}
	.links-nav li {
		float: left;
		width: 48%;
		max-width: 165px;
		max-height: 165px;
		margin: 0 4% 4% 0;
	}
	.links-nav li:nth-of-type(3n) {
		margin-right: 4%;
	}
	.links-nav li:nth-of-type(2n) {
		margin-right: 0;
	}
/*
	.links-nav li:nth-of-type(n+5) {
		display: none;
	}
*/
	.links-nav li a:hover {
		opacity: 0.8;
		filter: alpha(opacity=80);
		-ms-filter: "alpha(opacity=80)";
	}
	.links-nav li img {
		width: 100%;
	}

	/* comic
		------	------	------ */
	.comic_latest {
		float: none;
		margin: 0 auto 60px;
		max-width: 345px;
		width: auto;
	}
	.comic_latest h3 {
		text-align: center;
	}
	.comic_latest .comic_body {
		width: auto;
	}
	.comic_latest .comic_body em {
		display: block;
		padding: 10px 0 15px;
		font-size: 16px;
		font-weight: bold;
		text-align: center;
	}
	.comic_latest .comic_body img {
		width: 100%;
	}
	.comic_latest .comic_list {
		margin-top: 20px;
		height: auto;
	}
	.comic_latest .comic_list li {
		float: left;
		margin-bottom: 5px;
		width: 50%;
		font-size: 12px;
	}
	.comic-att {
		font-size: 11px;
	}



}



@media only screen and (max-width:320px) {
	.comic_latest {
		max-width: 290px;
	}
/*
	.comic_latest .comic_list li {
		font-size: 9px;
	}
*/
}