@charset "utf-8";

/*
@media only screen and (max-width:767px){}
@media only screen and (min-width:768px){}
*/


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

#mv .nums > li a:hover{
	opacity:0.8;
}

#shop .hoverzoom .txt,
#house .hoverzoom .txt{
	-moz-transition: all 0.3s linear;
	-webkit-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	-ms-transition: all 0.3s linear;
	transition: all 0.3s linear;
	transition-timing-function:ease
;

}
#shop .hoverzoom:hover .txt,
#house .hoverzoom:hover .txt{
	-webkit-translateY(-25px);
	-moz-translateY(-25px);
	-o-translateY(-25px);
	-ms-translateY(-25px);
	transform: translateY(-25px);

}
#shop .hoverzoom:hover .row2,
#house .hoverzoom:hover .row2{
	opacity:1;
}


#support .ttl_area .link:hover{
	border-color:#3C82FE;
}

#feature .hoverzoom.large .row1 { 
	top:40%;
}
#feature .hoverzoom.large .row2 { 
	top:48%;
	/*font-size:20px;*/
}


}


/*********************************************************************************/
/* max-width:767px
/*********************************************************************************/
@media only screen and (max-width:767px){
/*****/

body #mv{
	width:100%;
	z-index:1;
}

body #shop > ul,
body #house > ul{
	height:auto;
	padding-bottom:0;
}
body #shop > ul > li,
body #house > ul > li{
	width:100%;
	background-color:#F6F9FC;
	margin-bottom:5px;
	padding-bottom:0;
	/*border-bottom:1px solid #E0E2E3;*/
}
body #shop .hoverzoom,
body #house .hoverzoom{
	display:block;
	width:100%;
	height:0;
	padding-bottom:57.5%;

}
body #shop .hoverzoom .row1,
body #house .hoverzoom .row1{
	font-size: 14px;
	position: absolute;
	top: 0;
	left:15px;
	width: calc(100% - 15px);
	padding-top:50%;
	padding-left:0;
	line-height:1em;
}
body #shop .col_1 .hoverzoom .row1 {
	padding-top:100%;
}
body #house .col_3 .hoverzoom .row1 {
	font-size: 11px;
}
body #shop .col_2 .hoverzoom .row1,
body #house .col_2 .hoverzoom .row1,
body #shop .col_3 .hoverzoom .row1,
body #house .col_3 .hoverzoom .row1{
	padding-top:42%;
}
body #shop .row2,
body #house .row2{
	font-size:12px;
	color:#222222;
	position: relative;
	top:0;
	left:0;
	opacity:1;
	padding:8px 15px 15px;
	line-height:1.6em;
	clear: both;
}
body #shop .row2::after,
body #house .row2::after{
	content:"";
	display:block;
	width: 100%;
	height: 1px;
	border-bottom:1px solid #E0E2E3;
	position: absolute;
	left: 0;
	bottom: 0px;
}


body #shop .col_1 .row2 {
	padding: 0;
}
body #shop .col_1 .row2 span {
	display: inline-block;
	box-sizing: border-box;
	width: 50%;
	padding: 8px 0 15px 15px;
}
body #shop .col_1 .row2 span:last-child::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	background: #fff;
	width: 1px;
	height: 100%;
	z-index: 5;
}



body #shop > ul > li.col_1 a {
	float: left;
}

body #shop > ul > li.col_2,
body #shop > ul > li.col_3 {
	width:50%;
	float: left;
}
	body #house > ul > li.col_3 {
		margin-left: 0;
		background: transparent;
		border-left: 0;
	}
	body #house > ul > li.col_3:before {
		left: 50%;
	}
	body #house > ul > li.col_3 ul {
		overflow: hidden;
	}
	body #house > ul > li.col_3 li {
		width:50%;
		float: left;
		padding-bottom: 0;
		background: #F6F9FC;
	}
	body #house > ul > li.col_3 li:first-child .for_sp {
		border-bottom: 1px solid #E0E2E3;
	}
	
body #shop > ul > li.col_2,
body #house > ul > li.col_2{
	border-right: 2px solid #FFFFFF;
}
body #shop > ul > li.col_3 {
	border-left: 2px solid #FFFFFF;
}
	
	
body .col_1 img,
body .col_2 img,
body .col_3 img{
	width:100%;
	height:auto;
}

body #facility_pickup {
	width: auto;
	margin: 0 20px;
}
body #facility_pickup ul {
	padding-top: 30px;
}
body #facility_pickup ul li {
	margin-top: 10px;
	font-size: 11px;
}
body #facility_pickup ul li img { max-width: 100%;}
body #facility_pickup ul li:first-child { margin-top: 0;}

body .introduction {
	padding-bottom: 20px;
}
body .introduction > ul {
	margin-top: 0;
}
.introduction > ul.accordion{
	margin-bottom: 0;
}
body .introduction > ul > li{
	display:block;
	font-size: 11px;
	text-align: center;
	margin-top: 30px;
	padding-left:0;
	padding-right:0;
	width: 100%;
}
body .introduction > ul > li img{
	width:100%;
	height:auto;
}
body .introduction ul li:first-child { margin-left: 0;}
body .introduction ul li:nth-child(4) { margin-left: 0;}

body .introduction .linkBtn {
	width: auto;
	margin: 0 10px;
}

body #supporttool ul li {
	margin: 20px 0 0;
	float: none;
	width: auto;
}



/*#supporttool ul { width: auto;}
#supporttool ul li { float: none; margin: 20px 0 0;}
#supporttool ul li:first-child { margin-top: 0;}*/

/*
body #feature{
	margin-top:30px;
	padding-top: 30px;
	background-position: center top;
	background-size: 190%;
}
body #feature .ttl_h{
	font-size:18px;
	line-height:1.6em;
}
body #feature .sub_ttl{
	line-height:1.6em;
	margin-bottom:20px;
}
body #feature > ul{
	padding-bottom:0;
	background-color:#FFFFFF;
}
body #feature > ul .col_1::after,
body #feature > ul .col_2::after{
	content:none;
}
body #feature > ul > li.col_1,
body #feature > ul > li.col_2,
body #feature > ul > li.col_3,
body #feature > ul > li.col_4{
	width:100%;
	height:auto;
	border:none;
	margin-bottom:2px;
	padding-bottom:0;
}
body #feature .hoverzoom .row1{
	font-size:14px;
}
body #feature .hoverzoom .row2{
	font-size:10px;
	top:52%;
}
body #feature .col_3 .hoverzoom .row1,
body #feature .col_4 .hoverzoom .row1 {
	top: 30%;
	padding-left:5.25%;
}
body #feature .col_3 .hoverzoom .row2,
body #feature .col_4 .hoverzoom .row2 {
	top: 48%;
	padding-left: 5.25%;
}
body #feature .hoverzoom{
	display:block;
	width:100%;
	height:0;
}
body #feature .col_1 .hoverzoom,
body #feature .col_2 .hoverzoom{
	padding-bottom:77.8125%;
}
body #feature .col_3 .hoverzoom,
body #feature .col_4 .hoverzoom{
	padding-bottom:38.90625%;
}

#feature .hoverzoom.large .row1 { 
	top:40%;
}
#feature .hoverzoom.large .row2 { 
	top:48%;
	font-size:10px;
}*/

body #movie_gallery{
	margin: 40px 0;
	padding-bottom: 30px;
}
body #movie_gallery > ul > li{
	display: block;
	width: 100%;
	margin-bottom:2px;
	padding-left: 0;
	padding-right: 0;
}
body #movie_gallery > ul > li a{
	display: block;
	width: 100%;
}
body #movie_gallery > ul > li a .img {
	display: block;
	width: 100%;
	height: auto;
}
body #movie_gallery > ul > li a .img img{
	width:100%;
	height:auto;
}
body #movie_gallery > ul > li .txt{
	position:relative;
	background-color: #8B959F;
	right:0;
	top:0;
	width:100%;
	padding: 15px 15px 18px 15px;
	font-size:12px;
}
body #movie_gallery > ul > li .txt .ttl{
	font-size:13px;
	line-height:1em;
}

body #news_area{
	margin-bottom:40px;
}
body #news_area h2{
	font-size: 16px
}
body #news_area .link{
	text-align: right;
	width:auto;
}
body #news_area .list > li{
	padding-top: 15px;
	padding-bottom: 7px;
}
body #news_area #news .ttl_area,
body #news_area #important .ttl_area {
	padding-top:15px;
	margin-bottom:20px;
}
body #news_area .date{
	font-size:12px;
	width:80px;
}
body #news_area .type{
	width:75px;
	font-size:11px;
	line-height:1.7em;
	
}
body #news_area .txt{
	font-size: 12px;
	text-overflow:clip;
	overflow:visible;
	white-space:normal;
	width:auto;
}
body #news{
	margin-bottom:30px;
}
body #news,
body #important{
	width:100%;
	float:none;
}
body #news_area #news .txt{
	padding-top: 5px;
	left: 0;
}
body #news_area #important .txt{
	width:100%;
	float:none;
}
body #news_area #important .date{
	line-height:1.6em;
	padding-bottom:2px;
}
body #news_area #important .list > li{
	line-height:0;
	padding: 15px;
	padding-top: 22px;
}
body #news_area #news .txt,
body #news_area #important .txt{
	line-height: 1.6em;
	display:block;
}


body #support{
	padding-top:10px;
	padding-bottom:20px;
}
body #support .innerBox{
	width:100%;
	padding: 15px;
}
body #support .ttl_area{
	margin-bottom:20px;
}
body #support h1{
	text-align: left;
	font-size:14px;
}
body #support .ttl_area .link{
	font-size:12px;
	text-align: right;
	padding-top: 0;
	border: none;
	width:auto;
}
body #support .btns{
	margin-bottom:10px;
	width: auto;
}
body #support .btns > li{
	width: 100%;
	height: auto;
	float: none;
	overflow: hidden;
	margin-right: 0;
	margin-bottom: 2px;
}
body #support .btns > li img{
	width:100%;
	height:auto;
}
body #support .btns > li a:hover{
	left:0;
}
body #support .others > li{
	font-size: 11px;
	width:50%;
	margin-right: 0;
	line-height:2em;
}
body #support .others > li:nth-child(2n){
	padding-left:15px;
}

body #support .others > li.long{
	width: 100%;
}

















/*****/
}