@charset "UTF-8";

/* ===============================
	frozen-menu
 =============================== */
#wrapper {
	background: url(images/bg-main.jpg) repeat left top;
}

#about .inBox {
	background: rgba(255, 255, 255, 0.6);
	border: solid 2px #fff;
	margin-top: 1em;
}

#about .ttl {
	display: inline-block;
	background: #e5004f;
	color: #fff;
	padding: 0 1em;
}

section.sub h3 {
	margin-bottom: 2em;
}

/* ===============================
	device setting
 =============================== */
@media print, screen and (min-width: 415px) {
	#mainVisual {
		background: url(images/bg-mainvisual.png) repeat-x center top;
		height: 330px;
		position: relative;
		overflow: hidden;
	}
	#mainVisual h3 {
		width: 1500px;
		position: absolute;
		top: 0;
		left: 50%;
		margin-left: -750px;
	}
	#naviArea {
		height: 210px;
	}
	#naviFrozen {
		height: 120px;
		padding: 35px 20px 0;
	}
	#naviFrozen ul {
		width: 920px;
	}
	#naviFrozen ul li {
		width: 460px;
		height: 70px;
	}
	#contentsArea {
		background: url(images/bg-contents-b.png) repeat-y center top;
		padding-bottom: 5em;
		margin-bottom: 20px;
		position: relative;
		margin-bottom: 20px;
	}
	#contentsArea:AFTER {
		content: "";
		display: block;
		width: 100%;
		padding-bottom: 20px;
		background: url(images/bg-contents-f.png) no-repeat center top;
		position: absolute;
		top: 100%;
		left: 0;
	}
	#contentsArea .inBox {
		width: 800px;
		margin-left: auto;
		margin-right: auto;
	}
	.subOuter {
		width: 850px;
		margin-left: auto;
		margin-right: auto;
	}
	section.sub {
		margin-top: 2em;
	}
	section.sub h3 {
		width: 480px;
	}
	#about .inBox {
		padding: 20px 25px;
	}
	.banner {
		width: 455px;
		margin: 4em auto 0;
	}
}

@media screen and (max-width: 414px) {
	#naviFrozen {
		padding: 4.17% 4.17% 2.1%;
		background-repeat: no-repeat; background-position : center top;
		background-size: cover;
		background-position: center top;
	}
	#naviFrozen ul {
		width: 100%;
	}
	#naviFrozen ul li {
		width: 50%;
		height: 15.2%;
	}
	#contentsArea {
		background: url(images/bg-contents-b@sp.png);
		background-repeat: repeat-y;
		background-position: center top;
		background-size: contain;
		padding-top: 1em; padding-bottom : 5em;
		position: relative;
		margin-bottom: 20px;
		padding-bottom: 5em;
	}
	#contentsArea:AFTER {
		content: "";
		display: block;
		width: 100%;
		padding-bottom: 4.17%;
		background: url(images/bg-contents-f@sp.png);
		background-repeat: no-repeat;
		background-position: center top;
		background-size: cover;
		position: absolute;
		top: 100%;
		left: 0;
	}
	section.sub {
		padding-left: 1em;
		padding-right: 1em;
		margin-top: 1em;
	}
	.inBox {
		padding: 0 1em;
	}
	ul.col2 li {
		width: 100%;
		float: none;
		margin-top: 6%;
		margin-left: 0;
	}
	.tableCell.right.smsp {
		text-align: center;
		margin-top: 1em;
	}
}