/* ======== element ======== */
html,
body {
	height: 100%;
	background: url("../images/bg_body.gif") top left repeat;
	word-break: normal;
	word-wrap: break-word;
}
body {
	color: #333333;
	font-size: 88%;
	font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	line-height: 1.5;
}
p {font-size: 82%;}
a:hover{text-decoration:none;}
a {color:#000;}

/* ======== container ======== */
.container {
	margin: 0 auto;
	padding: 0;
	width: 700px;
	height: auto !important;
	height: 100%;
	min-height: 100%;
	background-color: #fff;
	position: relative;
}
.inner {
	margin: 0 auto; 
	width: 640px;
}
@media screen and (max-width:768px){
	.container {width: 100%;}
	.inner {width: 92%;}
}

/* ======== header ======== */
.header {
	margin-bottom: 40px;
	padding: 8px 16px 16px 0;
	width: 686px;
	border-top: solid #201010 10px;
	text-align: right;
}
	.header__noJs {
		margin: 0 auto;
		padding: 32px;
		width: 736px;
		background-color: #f87c42;
		color: #fff;
		text-align: center;
	}
@media screen and (max-width:768px){
	.header {
		padding: 30px 0 16px 0;
		margin: 0 0 32px 0;
		width: 100%;
		text-align: center;
	}
		.header__noJs {
			margin-top: 40px;
			padding: 32px 4%;
			width: 92%;
		}
}

.contentWrap {padding-bottom: 140px;}
h1 {
	margin-bottom: 40px;
	width: 100%;
	font-size: 158%;
	font-weight: 700;
	text-align: center;
}
h2 {font-weight: 700;}
.policyArea {
	margin: 0 auto 24px;
	padding: 24px;
	width: 592px;
	height: 250px;
	border: solid 2px #eee;
	font-size: 82%;
	text-align: left;
	overflow: auto;
}
.buttonArea {
	margin-bottom: 4px;
	text-align: center;
}

.secureMsg {
	margin: 0 auto;
	width: 300px;
	text-align: center;
	font-size: 74%;
	color: red;
	display: block;
}
@media screen and (max-width:768px){
	h2 {margin: 0 0 8px 0;}
	.policyArea {width: 75%;}
	.buttonArea {margin-bottom: 4px;}
	.secureMsg {
		width: 90%;
		font-size: 74%;
	}
}

/* ======== footer ======== */
.footer {
	margin: 8px auto 0 auto;
	padding: 16px 8px 8px 8px;
	width: 684px;
	text-align: right;
	border-top: solid #2A252C 34px;
	overflow: hidden;
	position: absolute;
	bottom: 0;
}
	.footer__navi {
		padding: 0 0 30px 0;
		margin: 0;
	}
	.footer__navi li:first-child {
		border-left: none;
	}
	.footer__navi li {
		padding: 0 8px;
		margin: 0;
		list-style-type: none;
		float: left;
		font-size: 65%;
		border-left: 1px solid #000;
	}
	.footer__copy {
		font-size: 65%;
		font-color: #232327;
		text-align: right;
		clear: both;
		display: block;
	}
@media screen and (max-width:768px) {
	.footer {
		padding: 16px 3%;
		width: 94%;	
		border-top: solid #2A252C 34px;
	}
}
.ml24 {margin-left: 24px;}
.ml32 {margin-left: 32px;}
.mb8 {margin-bottom: 8px;}
.mb16 {margin-bottom: 16px;}
.mb24 {margin-bottom: 24px;}
.mb32 {margin-bottom: 32px;}
.mb40 {margin-bottom: 40px;}
.mb48 {margin-bottom: 48px;}
.listDisc {list-style-type: disc;}
.colorRed {color: red;}
@media screen and (max-width:768px) {
	.rspMl0 {margin-left: 0!important;}
	.rspMl8 {margin-left: 8px!important;}
	.rspDispBlock {display: block;}
}

/* ======== title ======== */
.dispBlock {display: block;}
@media screen and (max-width:768px) {
	.rspDispBlock {display: block;}
	.rspDispNone {display: none;}
}