@charset "utf-8";

/*******************************************************************
　各セクション
*******************************************************************/
/*----------------------------------------------------------
　全体
-----------------------------------------------------------*/
html {
	width: 100%;
	height: 100%;
	font-family: メイリオ, Meiryo, 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	font-size: 62.5%;/*10px相当*/
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}
body {
	width: 100%;
	height: 100%;
	font-size: 16px;
	font-size: 1.6rem;
	background: #FFF;
}
@media only screen and ( max-width: 599px ) {
	body {
		font-size: 1.4rem;
		line-height: 1.4;
	}
}
.contents {
	width: 100%;
	text-align: center;
	margin: 0 auto;
	background: #FFF;
}
/*基本コンテナ*/
.container {
	width: 94%;
	max-width: 900px;
	margin: 0 auto;
}
.extra_container {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	text-align: center;
}

.left {
	float: left;
}
.right {
	float: right;
}
.clearfix:after {
  content: "";
  clear: both;
  display: block;
}
.textCenter {
	text-align: center;
}
.textLeft {
	text-align: left;
}
.textRight {
	text-align: right;
}
a:link, a:visited {
	color: #512d1e;
	text-decoration: none;
}
a:hover {
	color: #512d1e;
	text-decoration: none;
}
@media print, screen and (min-width:600px){
	.display_sp {display: none}
}
@media screen and (max-width:599px){
	.display_pc {display: none}
}

/*----------------------------------------------------------
　ヘッダー 
-----------------------------------------------------------*/
header {
	position: relative;
	z-index: 0;
	width: 100%;
	margin: 0;
	padding: 0 0 0 0;
}
.header_wrap {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 96%;
	max-width: 900px;
	margin: 0 auto;
}
.header_logo{
	width: 15%;
}
.header_name {
	text-align: right;
}
@media only screen and ( max-width: 599px ) {
	header {
/*		margin: 10px auto 0;
*/	}
	.header_logo {
		width: 50%
	}
.header_logo img {
}
.header_name {
}
.header_name img {
	width: 80%;
	}
}
/*----------------------------------------------------------
　レイアウト
-----------------------------------------------------------*/
.nimArea {
	background: #E6E6E6;
	text-align: center;
}
.leadArea {
	background: url("../img/bg_gr2.png") left top #fff;
	text-align: center;
}
.faq-q {
	background: url("../img/bg_or2.png") repeat-x left bottom;
	text-align: center;
}
.faq-a {
	background: #FF7600;
	text-align: center;
	margin-top: -3%;
}
@media only screen and ( max-width: 599px ) {
	.leadArea {
		background: url("../img/bg_gr3.png") left top #fff;
	}
	.faq-q {
		background: url("../img/bg_or3.png") repeat-x left bottom;
	}
}
.movieArea {
	background: url("../img/bg_movie.png") left top #000;
	padding: 20px 0 80px;
	text-align: center;
}
@media only screen and ( max-width: 599px ) {
	.movieArea {
		padding: 10px 0 50px;
		text-align: center;
	}
}
.movie_box {
	background: #000;
	padding: 20px 0;
}
.movie_box .container {
	max-width: 560px;
}
.movie_wrap {
	position: relative;
	padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
	height: 0;
	overflow: hidden;
}
.movie_wrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.uspArea {
	background: url("../img/bg_usp.png") #E6E6E6;
	padding-top: 20px;
}
.uspArea p {
	padding-bottom: 3%;
}
.usp_box,
.feature_box {
	display: table;
	table-layout: fixed;
	background: #fff;
	margin-bottom: 3%;
}
.usp_img,
.feature_img {
	display: table-cell;
	width: 55%;
	max-width: 495px;
	margin: 0 auto;
	padding: 2% 2% 2% 0;
	vertical-align: middle;
}
.usp_text,
.feature_text {
	display: table-cell;
	width: 45%;
	max-width: 405px;
	margin: 0 auto;
	vertical-align: middle;
}
@media only screen and ( max-width: 599px ) {
	.usp_box,
	.feature_box {
		display: block;
		padding-top: 2%;
	}
	.usp_img,
	.feature_img {
		display: block;
		width: 100%;
		max-width: 600px;
		padding: 2%;
	}
	.usp_text,
	.feature_text {
		display: block;
		width: 100%;
		max-width: 600px;
	}
}

.voiceArea {
	padding: 20px 0 0;
	text-align: center;
}
.featureArea {
	padding: 20px 0 30px;
	background: url("../img/bg_wh3.png") repeat-x left top #ff0;
}
@media only screen and ( max-width: 599px ) {
	.featureArea {
		padding: 20px 0 20px;
	}
}
.featureArea p {
	padding-bottom: 3%;
	text-align: center;
}
.buttonArea {
	padding: 20px 0;
	text-align: center;
}
.btn_set {
	width: 100%;
	max-width: 720px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
  flex-wrap: wrap;
}
.btn_set p {
	width: calc(1 / 3 * 100%);
	vertical-align: top;
}
@media only screen and ( max-width: 599px ) {
}
/*.btn_set {
	width: 80%;
	max-width: 540px;
	margin: 0 auto;
	display: table;
	table-layout: fixed;
}
.btn_set p {
	display: table-cell;
	width: 50%;
	max-width: 270px;
	vertical-align: top;
}
@media only screen and ( max-width: 599px ) {
	.btn_set {
		width: 100%;
	}
}
*/

.notice {
	padding: 0.5em 0;
}
.text_notice {
	font-size: 1.1rem;
	line-height: 1.4;
	color: #808080;
}

.lineup_wrap {
	margin: 5% auto;
}
/*----------------------------------------------------------
　ボタン
-----------------------------------------------------------*/
/*----------------------------------------------------------
　ページの先頭に戻る
-----------------------------------------------------------*/
#pageTop {
	position: fixed;
	bottom: 3rem;
	right: 3rem;
	display: block;
	z-index: 1001;
}
#pageTop a {
	display: block;
	width: 50px;
	padding: 10px 0;
	border-radius: .4rem;
	background: #d40039;
	text-align: center;
	color: #ffffff;
	transition: .3s;
}
#pageTop a:hover {
	text-decoration: none;
	opacity: 0.7;
}
@media only screen and ( max-width: 599px ) {
	#pageTop {
		bottom: 3rem;
		right: 1em;
	}
}
/*----------------------------------------------------------
　フッター 
-----------------------------------------------------------*/
footer {
/*	position: fixed;
*/	bottom:0;
	left: 0;
	width: 100%;
	z-index: 1000;
	background: #000;
}

.copy {
	background: #000;
	color: #fff;
	bottom: 0;
	width: 100%;
	padding: 0 0 0.2em;
	text-align: center;
}
.copy a {
	text-decoration: underline;
}
@media only screen and ( max-width: 599px) {
}
/*非表示 ------------------------------*/
