/*-ー----------メインビジュアル -----------------*/
padding-left: #sub_kv{
	height: 495px;
	text-align: center;
	position: relative;
}
#sub_kv img{
	height: auto;
	width: 860px;
}
.slick-next:before,.slick-prev:before{
	content: "";
}
.slick-next,.slick-next:focus {
	right: 50%;
	margin-right:-480px;
	z-index: 1000;
	background-color: #fff;
	opacity: 0.8;
	content: "";
	width: 50px;
	height: 100px;
	background-image: url(../img/housing/arrow_next.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 22px auto;
}

.slick-next:hover{
	background-color: #fff;
	opacity: 0.5;
	background-image: url(../img/housing/arrow_next.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 22px auto;
}
.slick-prev,.slick-prev:focus{
	left: 50%;
	margin-left:-480px;
	z-index: 1000;
	background-color: #fff;
	opacity: 0.8;
	content: "";
	width: 50px;
	height: 100px;
	background-image: url(../img/housing/arrow_prev.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 22px auto;
}

.slick-prev:hover{
	background-color: #fff;
	opacity: 0.5;
	background-image: url(../img/housing/arrow_prev.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 22px auto;
}
.slick-slider .slick-list{
	width: 100%;
}

@media screen and (max-width:640px) {
#sub_kv{
	height: auto;
	width: 100%;
}
#sub_kv img{
	width: 320px;
}
.slick-next,.slick-next:focus {
	right: 0;
	margin-right:0px;
	width: 26px;
	height: 54px;
	background-size: 15px auto;
}

.slick-next:hover{
	background-size: 15px auto;
}
.slick-prev,.slick-prev:focus{
	left: 0;
	margin-left:0px;
	width: 26px;
	height: 54px;
	background-size: 15px auto;
}

.slick-prev:hover{
	background-size: 15px auto;
}

}

/*-ー----------共通 -----------------*/

#h-works,#gallery,#special,#model,#document{
	text-align: center;
	margin-top: 82px; 
	padding-bottom: 40px; 
}

@media screen and (max-width:640px) {
#h-works,#gallery,#special,#model,#document{
	margin-top: 65px; 
	padding-bottom: 20px; 
}
}

/*-ー----------works -----------------*/


.midashi_eng{
	color: #a49b7b;
	font-size: 24px;
	font-weight: 500;
}
.midashi1{
	color: #463e3b;
	font-size: 35px;
	margin: 27px 0 30px 0;
}
.introduction{
	width: 594px;
	margin: 0 auto;
	color: #555;
	line-height: 160%;
	font-size: 16px;
	letter-spacing: 0.1em;
	text-align: left;
}

.works{
	display: flex;
	justify-content: space-around;
	margin: 55px 0;
}
.works article{
	width: 218px;
	text-align: left;
	position: relative;
	padding-bottom: 35px;
}
.works_list_img {
	width: 100%;
	position: relative;
}
.works_list_img::before{
	content: "";
	background-image: url(../img/works/top_imagecover.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center top;
	z-index: 20;
	position: absolute;
	top:0;
	width:218px;
	height: 100px;
}
.works_list_img img{
	width: 100%;
}
.works_list_title{
	font-size: 16px;
	margin: 10px 0;
	font-weight: bold;
	line-height: 120%;
}
.works_list_info{
	font-size: 12px;
	color: #888787;
	line-height: 120%;
}
.works_list_info span{
	display: block;
}
.link_btn3{
	text-align: center;
	margin: 30px auto;
}


@media screen and (max-width:640px) {

.midashi_eng{
	font-size: 20px;
}
.midashi1{
	font-size: 22px;
	margin: 24px 0 26px 0;
}
.introduction{
	width: 100%;
}

.works{
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 25px 0;
}
.works article{
	width: 46%;
	text-align: left;
	margin-bottom: 35px;
}
.works_list_title{
	margin: 5px 0;
}
.works_list_img::before{
	width:102%;
	height: 100px;
}
}


/*-ー----------gallery -----------------*/


#gallery_panel{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#gallery_panel li{
	width: 190px;
	height: 190px;
	overflow: hidden;
	text-align: center;
	position: relative;
	margin-bottom: 10px;
}
#gallery_panel li:before{
  content: "";
  display: block;
  padding-top: 100%;
}
#gallery_panel li img{
	position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  object-fit: cover;
  /*IE edg用*/
  object-position: center;
  font-family: 'object-fit: cover; object-position: bottom;';
}

#gallery_category{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	width: 800px;
	margin: 35px auto;
}
#gallery_category li a{
	line-height: 240%;
	color: #3d6398;
	margin: 0 24px;
}
#gallery_category li a:before{
	content: "> ";
}
@media screen and (min-width:1025px) and (max-width:1440px) {
#gallery_panel li{
	width: 15.9%;
	height: 15.9%;
}
}
@media screen and (max-width:640px) {

#gallery_panel{
	justify-content: space-around;
}
#gallery_panel li{
	width: 100px;
	height: 100px;
	margin-bottom: 10px;
}
#gallery_category{
	width: 100%;
	margin: 25px auto;
}
#gallery_category li a{
	margin: 0 18px;
}
}
@media screen and (max-width:320px) {
#gallery_panel li{
	width: 85px;
	height: 85px;
	margin-bottom: 6px;
}	
}

/*--movie------------------------------------*/
#movie{
	margin-top: 50px;
}
.movie_inner{
	position: relative;
	padding: 0 0 60px 0;
}
#mgallery{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
		padding-bottom: 10px;
/*     margin: 0 125px; */
}
#mgallery .movie_wrapper{
	position: relative;
	width: calc((100% - 80px) / 3);
	aspect-ratio: 16 / 9;
}
#mgallery .movie_wrapper:nth-child(3n){
	margin-right: 0;
}
#mgallery .movie_wrapper iframe{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}
#mgallery .movie_wrapper a{
	/* lityを動かすためにiframeを覆う */
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}

@media screen and (min-width:1025px) and (max-width:1440px) {
	#mgallery{
		margin: 0 8.6%;
	}
}
@media screen and (max-width:640px) {
	#movie{
		margin-top: 30px;
	}
	#mgallery{
		display: block;
		padding-bottom: 0;
/* 		margin: 0 5%; */
	}
	#mgallery .movie_wrapper{
		width: 100%;
		margin-bottom: 20px;
	}
	.movie_inner{
		padding: 20px 0 30px 0;
	}
}


/*-ー----------special -----------------*/

.vr{
	width: 600px;
	height: 400px;
	margin: 0 auto 50px auto;
}
@media screen and (max-width:640px) {
.vr{
	width: 100%;
	height: 300px;
	margin: 0 auto 30px auto;
}
}


/*-ー----------model -----------------*/

#model_img{
	display: flex;
	justify-content: space-between;
	margin: 40px auto 40px auto;
}
#model_img li{
	width: 275px;
}
#model_img li img{
	width: 100%;
}
.model_info{
	color: #7b7b7b;
	font-size: 12px;
	line-height: 140%;
}
.model_link{
	display: flex;
	justify-content: space-between;
	width: 540px;
	margin:10px auto;
}
@media screen and (max-width:640px) {
#model_img{
	flex-wrap: wrap;
	margin: 20px auto 20px auto;
}
#model_img li{
	width: 154px;
	margin-bottom: 6px;
}
.model_info{
	font-size: 10px;
}
.model_link{
	display: block;
	width: 100%;
	margin:10px auto;
}
.model_link li{
	margin:10px auto;
}
}

/*-ー----------資料請求 -----------------*/

#document a{
	color: #fff;
	display: block;
	width: 660px;
	margin: 0 auto;
}

.document_request{
	margin:-50px auto 110px auto;
	display: flex;
	justify-content: center;
	width: 660px;
}
.request_img{
	width: 235px;
	overflow: hidden;
	height: auto;
	position: relative;
}
.request_img img{
	height: 100%;
	width: auto;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.request_info{
	width: 425px;
	color: #fff;
	padding: 35px 0;
	text-align: center;
	background-color: #3f5b8d;
}
.request_info div{
	width:82%;
	margin: 0 auto;
	text-align: left;
}
.request_info .request_title{
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 15px;
}
.request_info .request_title::before{
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 7px 0 7px 12.1px;
	border-color: transparent transparent transparent #5db7e8;
	display:  inline-block;
    vertical-align:  middle;
    position:  relative;
    top: -2px;
    margin-right: 6px;
}
.request_info p{
	font-size:13px;
	line-height: 160%;
}

@media screen and (max-width:640px) {
#document a{
	width: 260px;
}
.document_request{
	margin:-30px auto 60px auto;
	display: block;
	width: 260px;
}
.request_img{
	width: 260px;
	height: 175px;
}
.request_img img{
	width: 100%;
	height: auto;
	position: relative;
}

.request_info{
	width: 260px;
	padding: 20px 0;

}

.request_info .request_title{
	font-size: 16px
	margin-bottom: 10px;
}
.request_info p{
	font-size:13px;
	line-height: 160%;
}
}