@import url("case_list.css");
@import url("topics_list.css");

#mv {
	height:144vw;
	width:100%;
	font-size: 0;
	position: absolute;
	top:0;
	opacity: 0;
	transition-duration: 0.5s;
	background: #F0EAD2;
	z-index: 1;
}

#mv:after {
	content:"";
	width:100vw;
	height:144vw;
	background: url('./../images/home/mv_cover_sp.png') no-repeat center center;
	background-size:cover;
	position: absolute;
	top:0;
}

#mv_bg1,
#mv_bg2,
#mv_bg3,
#mv_bg4 {
	width:100vw;
	height:144vw;
	display: inline-block;
	background: url('./../images/home/mv_bg1.jpg') no-repeat center center;
	background-size:cover;
}
#mv_bg2 {
	background: url('./../images/home/mv_bg2.jpg') no-repeat center center;
	background-size:cover;
}
#mv_bg3 {
	background: url('./../images/home/mv_bg3.jpg') no-repeat center center;
	background-size:cover;
}
#mv_bg4 {
	background: url('./../images/home/mv_bg4.jpg') no-repeat center center;
	background-size:cover;
}

#mv p {
	position: absolute;
	top: 86%;
	width:100%;
	z-index: 2;
	text-align: center;
}

#mv p img {
	width:80%;
	max-width:310px;
}

#mv2 {
	background: url('./../images/home/mv2_sp.jpg') center center;
	background-size:cover;
	width:100vw;
	height:144vw;
	position: absolute;
	top:0;
	left:0;
	z-index: 0;
	display: none;
}

#concept_message {
	position: relative;
	/*margin-top:144vw;*/
	margin-top:0;
	background: url('./../images/home/bg_concept_message.jpg') center top;
	background-size: cover;
	box-sizing: border-box;
	padding:7vw;
}

#concept_message p {
	color:#464646;
	text-align: center;
	font-size:3.6vw;
	line-height: 2.0;
	letter-spacing: 0.08em;
	margin-bottom:1em;
}

#home_nav {
	background: url('./../images/home/bg_diagonal.svg');
	padding-bottom:6vw;
}

#home_nav .container {
	width: 96%;
	max-width: 1000px;
}

#home_nav .container > ul {
	font-size:0;
	padding-top:5vw;
}

#home_nav .container > ul li {
	display: inline-block;
	vertical-align: top;
	margin: 0 2% 3.6vw;
    width: 46%;
    font-size: 1.2rem;
    background: #FFF;
}

#home_nav .container > ul li a {
	display: block;
	background: #FFF;
	color:#000;
	padding:0 0 1em;
	text-align: center;
	transition-duration: 0.4s;
}

#home_nav .container > ul li a:hover {
	text-decoration:none; 
}

#home_nav .container > ul li a img {
	width:90%;
	margin-bottom:10px;
}

#home_nav .container > ul li a span {
	font-weight:bold;
	display: inline-block;
}

#home_nav .cta_btn_wrap {
	background: #FFF;
    position: relative;
    text-align: center;
    max-width: 980px;
    margin:26px auto 0;
    padding:1.5em 0;
    width:90%;
}

#home_nav .cta_btn_wrap > img {
	margin-top: -24px;
    width: 240px;
    margin-bottom: 12px;
}

#home_nav .cta_btn_wrap .btn_reserve a {
	display: inline-block;
	background:#DA5766;
	padding:0.6em 1em;
	box-sizing: border-box;
	width:90%;
	max-width:560px;
	color:#FFF;
	font-weight:bold;
	font-size:1.2em;
	transition-duration: 0.4s;
}

#home_nav .cta_btn_wrap .btn_reserve a:hover {
	text-decoration: none;
}

#home_nav .cta_btn_wrap p.note {
	color:#DA5766;
	margin-top:1em;
}

#concept {
	background: url('./../images/home/bg_concept.jpg') no-repeat top center;
	background-size: cover;
	padding-bottom:6vw;
}

#concept .container {
	width:100%;
	max-width: 960px;
}

#concept .concept_img1 {
	padding-top:10vw;
}

#concept .concept_img1 img {
	width:86vw;
	max-width: 400px;
}

#concept .concept_img2 {
	width: 100%;
	display: block;
	text-align: right;
}

#concept .concept_img2 img {
	width:94vw;
	max-width:500px;
}

#concept .concept_txt_area1,
#concept .concept_txt_area2 {
	position: relative;
	display: block;
	width:90%;
	margin:0 auto;
	z-index: 1;
	padding:0 6vw 6vw;
	box-sizing: border-box;
	margin-bottom:3em;
}

#concept .concept_txt_area1:before,
#concept .concept_txt_area2:before {
	content:"";
	background: rgba(255,255,255,0.85);
	width:100%;
	height:100%;
	position: absolute;
	top:-8vw;
	left: 50%;
	margin-left: -50%;
	z-index: -1;
	padding:0 0 14vw;
}

#concept .concept_txt_area2:before {
	padding:0 0 10vw;
}

#concept .concept_txt_area1 p,
#concept .concept_txt_area2 p {
	line-height: 2.0;
	margin-bottom:2em;
	font-size:0.9em;
}

#concept .concept_txt_area1 img:nth-of-type(1) {
	width:100%;
	max-width: 420px;
	display: block;
	margin: 0 auto;
}

#concept .concept_txt_area1 img:nth-of-type(2) {
	width:110%;
	max-width: 400px;
	display: block;
	margin: -0.5em auto;
}

#concept .concept_txt_area2 img:nth-of-type(1) {
	width:70%;
	max-width: 250px;
	display: block;
	margin-bottom: 2em;
}

#concept .concept_txt_area2 img:nth-of-type(2) {
	width:100%;
	max-width: 420px;
}

#case_list {
	/*margin-top:144vw;*/
	margin-top:3vw;
	padding:50px 0;
}

#topics_list {
	padding:0 0 4em;
}

#topics_list h2 {
	background: #48B1C7;
	color:#FFF;
	font-family: 'Noto Serif JP', serif;
	font-size:2.6em;
	font-weight: 200;
	text-align: center;
	padding:0.9em 0;
}

#topics_list h2 span {
	font-family: 'Open sans', '游ゴシック', 'Yu Gothic', YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", Helvetica, sans-serif;
	font-size: 0.35em;
	display: block;
}

#banner_wrap {
	width: 100%;
	padding: 2.0em 0 2.4em;
	background: url('./../images/home/banner_lp_bg_sp.jpg') no-repeat center center;
	background-size: cover;
}
#banner_wrap .container {
	width: 90%;
	margin: 0 auto;
}
#banner_wrap .container ul li {
	margin: 0 0 1.0em;	
}
#banner_wrap .container ul li:last-child {
	margin: 0 0 0;	
}

@media screen and (max-width: 559px) {
#concept .concept_txt_area1 img:nth-of-type(2) {
	width:100%;
	display: block;
	margin: -0.5em auto;
}

}

@media screen and (min-width: 560px) {

#mv,
#mv_bg1,
#mv_bg2,
#mv_bg3,
#mv_bg4 {
	width:100vw;
	height:520px;
}

#mv:after {
	width:100%;
	background: url('./../images/home/mv_cover.png') no-repeat center center;
	background-size:3600px;
	background-position: center 60%;
	height:520px;
}

#mv p {
	top: 70%;
}

#mv2 {
	background: url('./../images/home/mv2.jpg') center center;
	background-size: cover;
	height:520px;
}

#concept_message {
	/*margin-top:520px;*/
	margin-top:0;
	padding:50px;
}

#concept_message p {
	font-size:1.4em;
	color:#251E1C;
}

}


@media screen and (min-width: 768px) {

#mv {
	top:132px;
}

#mv,
#mv_bg1,
#mv_bg2,
#mv_bg3,
#mv_bg4 {
	height:600px;
}

#mv:after {
	background: url('./../images/home/mv_cover.png') no-repeat center center;
	background-size:4000px;
	background-position: center 60%;
	height:600px;
}

#mv p {
	top: 73%;
}

#mv p img {
	max-width:380px;
}

#mv2 {
	background: url('./../images/home/mv2.jpg') center center;
	background-size:cover;
	width:100%;
	height:600px;
	top:132px;
}

#concept_message {
	/*margin-top:600px;*/
	margin-top:0;
	padding:70px 0;
}
	

#home_nav {
	padding-bottom:54px;
}

#home_nav .container {
	width:100%;
}

#home_nav .container > ul {
	font-size: 0;
	padding:68px 0 24px;
}

#home_nav .container > ul li {
	font-size:13px;
	margin:0.5%;
	width:19%;
}

#home_nav .container > ul li:nth-child(1) a {
	padding-bottom:4px;
}

#home_nav .container > ul li:nth-child(1) a img {
	margin-bottom:0;
}

#home_nav .container > ul li a:hover {
	opacity: 0.6;
}

#home_nav .container > ul li a span {
	width:11em;
}

#home_nav .cta_btn_wrap > img {
	width:290px;
}

#home_nav .cta_btn_wrap .btn_reserve a {
    font-size: 1.6em;
}

#home_nav .cta_btn_wrap .btn_reserve a:hover {
	opacity: 0.6;
}

#concept {
	padding:76px 0;
}

#concept .container {
	position: relative;
}

#concept .concept_img1 {
	padding-top: 0;
}

#concept .concept_img1 img {
	width:60vw;
	max-width: 656px;
}

#concept .concept_img2 img {
	width:60vw;
	max-width: 522px;
	margin-top:280px;
}

#concept .concept_txt_area1 {
	position: absolute;
	top:20vw;
	right:0;
	background: rgba(255,255,255,0.85);
	width:540px;
	padding:40px 30px 60px;
}

#concept .concept_txt_area2 {
	position: absolute;
	bottom:0;
	left:0;
	background: rgba(255,255,255,0.85);
	width:480px;
	padding:50px 36px 60px;
	margin-bottom:1em;
}

#concept .concept_txt_area1:before,
#concept .concept_txt_area2:before {
	content:none;
}

#concept .concept_txt_area1 p,
#concept .concept_txt_area2 p {
	text-align: center;
	font-size:1.6rem;
}

#concept .concept_txt_area2 img:nth-of-type(1) {
	margin:0 auto 3em;
}

#concept .concept_txt_area2 img:nth-of-type(2) {
	margin:0 auto;
}

#case_list {
	margin-top:0;
	padding:40px 0 80px;
}

#topics_list {
	padding:4em 0;
}

#topics_list h2 {
	display: table-cell;
	vertical-align: middle;
	width:45%;
}

#topics_list ul {
	display: table-cell;
	width:55%;
	max-width:530px;
	padding:0 2% 0 6%;
}

#banner_wrap {
	width: 100%;
	padding: 30px 0 30px;
	background: url('./../images/home/banner_lp_bg_pc.jpg') no-repeat center center;
	background-size: cover;
}
#banner_wrap .container {
	width: 960px;
	margin: 0 auto;
}
#banner_wrap .container ul {
	text-align: center;
}
#banner_wrap .container ul li {
	display: inline-block;
	width: 388px;
	margin: 0 10px 20px;
	vertical-align: bottom;
}
#banner_wrap .container ul li:last-child {
	margin: 0 10px 20px;
}


}


@media screen and (min-width: 1000px) {

#mv:after {
	background: url('./../images/home/mv_cover.png') no-repeat center center;
	background-size:5200px;
	background-position: center 60%;
}

#mv p {
	top: 76%;
}

#home_nav .container > ul li {
	margin:0 1% 2em;
	width:18%;
}

#home_nav .container > ul li a img {
	width:100%;
}

#home_nav .container > ul li a span {
	display: block;
	width:auto;
}

#home_nav .container > ul li:nth-child(1) a {
	padding-bottom:1em;
}

#home_nav .container > ul li:nth-child(1) a img {
	margin-bottom:10px;
}

#concept .concept_txt_area1 {
	top:116px;
}

#concept .concept_img2 img {
	margin-top:210px;
}

#concept .concept_txt_area1 p,
#concept .concept_txt_area2 p {
	line-height: 2.9;
	font-weight:bold;
}

}


@media screen and (min-width: 1200px) {

#mv2 {
	background: url('./../images/home/mv2_wide.jpg') center center;
	background-size:cover;
	width:100%;
	height:600px;
}

}


.topfaq{
	padding:3em 0;
}
.topfaq .container{
	max-width:950px;
}
.topfaq h2 {
	font-family: 'Noto Serif JP', serif;
	font-size:2.6em;
	font-weight: 200;
	text-align: center;
	padding-bottom:0.9em;
}

.topfaq h2 span {
	font-family: 'Open sans', '游ゴシック', 'Yu Gothic', YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", Helvetica, sans-serif;
	font-size: 0.35em;
	display: block;
}

.topfaq ul.main_list {
	border-top:dashed 1px #999;
}

.topfaq ul.main_list li {
	border-bottom:dashed 1px #999;
	padding:1.5em 0;
}

.topfaq ul.main_list li > a {
	padding:0 2.5em;
	position: relative;
	color:#222;
	font-size:1.1em;
	display: block;
	transition-duration: 0.4s;
	text-indent: -1.8em;
	cursor:text !important;
}

.topfaq ul.main_list li > a:before {
	content:"Q. ";
	font-size:1.4em;
	font-family: 'Noto Serif JP', serif;
}

.topfaq ul.main_list li > a:after {
	content:"";
	position: absolute;
	top:50%;
	right:2%;
	width:10px;
	height:6px;
	margin-top:-3px;
	/*background: url('./../images/common/icon_arrow_b_black.png') no-repeat;
	background-size: 100%;
	transform:rotate(-180deg);*/
	transition-duration: 0.4s;
}

.topfaq ul.main_list li a:hover {
	text-decoration: none;
}

.topfaq ul.main_list li.active > a:after{
	transform:rotate(0deg);
}

.topfaq ul.main_list li p {
	padding:1.5em 1em;
	margin:1.5em 0.5em 0;
	background: #F9f9f9;
	height:auto;
	overflow: hidden;
	transition-duration: 0.4s;
}




@media screen and (min-width: 768px) {
.topfaq ul.main_list li > a:hover {
	opacity: 0.6;
	text-decoration:none;
}

.topfaq ul.main_list li p a {
	opacity: 1.0;
	text-decoration:underline;
}	
}