@charset "UTF-8";
/* CSS Document */

.works_list .works_list_box {
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	transition: all 0.25s ease-in-out;
}
	.works_list .works_list_box:hover{
		-webkit-opacity: 0.5;
		-moz-opacity: 0.5;
		-ms-opacity: 0.5;
		-o-opacity: 0.5;
		opacity: 0.5;
    }

.works_list {
margin:0;
	width: 100%;
	box-sizing: border-box;
	overflow: hidden;
}
			
.works_list {
	padding: 0;
	margin-top:0;
	background:#fff; }

.title_wrap {
		margin-bottom: 30px;
		text-align: center;
		position: relative;
	}
.title_wrap > * {
			position: relative;
			z-index: 2; }
.title_wrap > * span {
				background-color: white;
				font-weight: inherit;
				letter-spacing: 0.5em;
				padding-left: 0.5em; }
.title_wrap h2 {
			font-weight: 900;
			font-size: 180%; }
.title_wrap p {
			font-family: "Open Sans",Sans-Serif;
			font-style: normal;
			font-weight: 300;
			margin-top: -10px; }
.works_list_box{
		@extemd .image_link; }
.works_list_box a {
			color: black !important;
			text-decoration: none !important; }
.works_list_box .img_wrap {
			position: relative;
			background-position: center center;
			background-size: cover;
			background-repeat: no-repeat; }
.works_list_box .img_wrap:before {
				content: '';
				display: block;
				padding-top: 100%;
				width: 100%; }
.works_list_box .works_info {
			font-weight: 400;
			text-align: center;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
			vertical-align: middle; }
.works_list_box .works_info span {
				font-size: 50%;
				border: black solid 1px;
				padding: 1px 3px;
				vertical-align: middle; }

#top_area{
	width:100%;
	font-size:0;
	position: relative;
	margin-top:60px;
}
#top_area .works_mv{
	width:calc(100% - 531px);
	max-width:calc(calc(100% - 100px) / 5 * 3 + 50px);
	height:calc(100vh - 230px);
	display:inline-block;
	margin:0;
}
#top_area .works_mv a{
	transition: 0.3s;
}
#top_area .works_mv a:hover{
	opacity:0.6;
}

#top_area .works_info{
	position:absolute;
	top:51px;
	left:51px;
	color:#fff;
	z-index:999;

}
#top_area .works_info h3{
	font-size:18px;
	letter-spacing: 1em;
	font-weight:800;

}
#top_area .works_info h3 span{
	font-size:25px;
	letter-spacing: 0.5em;
	font-weight:800;
}
.works_mv .slick-list,.works_mv .slick-track{
	height:100%;
}
.works_mv .img_wrap{
	position: relative;
}
.works_mv .img_wrap h2{
	font-size:35px;
	line-height:1.5em;
	letter-spacing: 0.25em;
	font-weight:800;
	top:160px;
	left:50px;
	margin-right:51px;
	z-index:999;
	color:#fff;
	position: absolute;
	text-shadow:0 0 2em #153252;
}




#top_area .toparea_info{
    width: calc(calc(100% - 100px) / 5 * 2 + 50px);
	min-width:531px;
	height:calc(100vh - 230px);
	display:inline-block;
	position:relative;
	margin:0;
	padding:51px 34px 51px 51px;
	font-size:16px;
	vertical-align: top;
}
#top_area .toparea_info .title_area h3{
	font-size:18px;
	letter-spacing: 1em;
	font-weight:300;
	border-bottom:1px solid #100c0a;
	margin-bottom:32px;
}

#top_area .toparea_info .title_area h3 span{
	font-size:21px;
	letter-spacing: 0.5em;
	font-weight:800;
	display: inline-block;
}
#top_area .toparea_info .title_area h3 p{
	font-size:18px;
	letter-spacing: 0.5em;
	font-weight:800;
	display: inline-block;
	margin-left:calc(100% - 276px);
}
#top_area .toparea_info .title_area .more_button a i{
	vertical-align: middle;
}



#top_area .toparea_info ul li{
	margin-bottom:24px;
}
.toparea_info ul li dt,.toparea_info ul li dd{
	display:inline-block;
	font-size:12px;
}
.toparea_info ul li dd:last-of-type{
	font-size:15px;
}
#top_area .toparea_info ul li:last-child{
	margin-bottom:51px;
}

.works_list_box.main{
	height:100%;
	display:block;
}
.img_wrap{
	width:100%;
	height:100%;
	background-size:cover;
	background-position:center center;
}

.slogan{
	width:100%;
	height:52px;
	margin:0;
	font-size:0;
	background:#100c0a;

}
.slogan .mv{
    width: calc(calc(100% - 100px) / 5 * 3 + 50px);
	color:#fff;
	font-size:18px;
	font-weight:800;
	letter-spacing: 0.5em;
	display:inline-block;
	padding:10px 25px 0;
	text-align:right;
}
.slogan .info{
    width: calc(calc(100% - 100px) / 5 * 2 + 50px);
	text-align:left;
	display:inline-block;
	vertical-align: top;
	background: #757c7a;
}
.slogan .info a{
	width:317px;
	color:#fff;
	display:block;
	height:100%;
	padding:10px 25px;
	font-size:18px;
	background: #d19921;
	margin-right:auto;
	transition:0.3s;
}
.slogan .info a:hover{
	background:#1e6c2f;
	text-decoration: none;

}
.slogan .info a span{
	font-weight:800;
	letter-spacing: 0.5em;
}

.slogan .info .more_button a i{
	vertical-align: middle;
}
.slogan .info a span .material-icons{
	font-size:18px;
	line-height:1.1em;
}

.twins{
	width:100%;
	padding:0;
	margin:0;
	font-size:0;
	display:flex;
	align-items: stretch;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
}
.twins .twin{
	width:50%;
	height:auto;
	background:#2c3f37;
	font-size:16px;
	color:#fff;
	vertical-align: top;
}
.twins .twin:nth-of-type(2){
	background:#100c0a;
}
.twins:nth-of-type(3) .twin{
	background:#fff;
	color:#100c0a;
}
.twins:nth-of-type(4) .twin{
	background:#757c7a;
}
.twins:nth-of-type(4) .twin:nth-of-type(2){
	background:#2c3f37;
}



.twin_inner{
	width:100%;
	max-width:960px;
	padding:68px;
	margin:0 0 0 auto;
}
.twin_inner:nth-of-type(2n){
	width:100%;
	max-width:960px;
	padding:68px;
	margin:0 auto 0 0;
}

.twin_inner.housing{
	padding:68px 0 68px calc(68px + 5vw);
}
.twin_inner.housing_img {
	padding:0;
	height:100%;
	max-width:800px;
	margin-left:0;
}
.twin_inner.housing_img img{
	height:100%;
	object-fit: contain;
	object-position: 50% 50%;
}


.twin h3{
	font-size:21px;
	letter-spacing: 0.35em;
	font-weight:300;
	margin-bottom:18px;
}

.twin h3 span{
	font-size:25px;
	letter-spacing: 0.35em;
	font-weight:800;
	display: inline-block;
}
.twin .border_button,.movie_inner .border_button{
	margin:21px 0 0 auto;
	text-align:right;
}
.twin .border_button{
	border:#fff solid 1px;
}
.twin .border_button p{
	width:auto;
	padding:10px 18px;
}
.twin .border_button p a{
	color:#fff;
}

.twin i,.movie_inner i{
    font-size: 21px;
    line-height: 1.1em;
	vertical-align:sub;
}
.twin .housing .border_button p a{
	color:#100c0a;
}
.twin .housing .border_button{
	border: #100c0a solid 1px;
}
.border_button p a::after{

}

#top_movie_list {
padding: 0;
background:#e2e2e2; }
#top_movie_list .title_wrap {
	margin-bottom: 30px;
	text-align: center;
	position: relative; }
	#top_movie_list .title_wrap:before {
		content: '';
		height: 1px;
		width: 100%;
		top: 50%;
		background-color: lightgray;
		z-index: 1;
		left: 0;
		position: absolute; }
	#top_movie_list .title_wrap > * {
		position: relative;
		z-index: 2; }
		#top_movie_list .title_wrap > * span {
			background-color: white;
			font-weight: inherit;
			letter-spacing: 0.5em;
			padding-left: 0.5em; }
	#top_movie_list .title_wrap h2 {
		font-weight: 900;
		font-size: 180%; }
	#top_movie_list .title_wrap p {
		font-family: "Open Sans",Sans-Serif;
		font-style: normal;
		font-weight: 300;
		margin-top: -10px; }
#top_movie_list .movie_list_box {
	@extemd .image_link; }
	#top_movie_list .movie_list_box a {
		color: black !important;
		text-decoration: none !important; }
	#top_movie_list .movie_list_box .img_wrap {
		position: relative;
		background-position: center center;
		background-size: cover;
		background-repeat: no-repeat;
	 }
	 .movie_list_box a{
		 position:relative;
	 }
	 .movie_list_box a:before{
		 content:'';
		 position: absolute;
		 width:100%;
		 height:100%;
		 z-index:999;
		 background:url(../img/top/movie/start.png);
		 background-size:100%;
	 }
		#top_movie_list .movie_list_box .img_wrap:before {
			content: '';
			display: block;
			padding-top: 100%;
			width: 100%;
			position: relative;
		}
		
	#top_movie_list .movie_list_box .movie_info {
		font-weight: 400;
		text-align: center;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		vertical-align: middle; }
		#top_movie_list .movie_list_box .movie_info span {
			font-size: 50%;
			border: black solid 1px;
			padding: 1px 3px;
			vertical-align: middle; }

			
.movie_inner{
	width:100%;
	max-width:840px;
	padding:68px;
	margin:0 auto;
	text-align: center;
}

.movie_inner h3{
	font-size:21px;
	letter-spacing: 0.35em;
	font-weight:300;
	margin-bottom:18px;
}

.movie_inner h3 span{
	font-size:25px;
	letter-spacing: 0.35em;
	font-weight:800;
	display: inline-block;
}
.movie_inner p{
	text-align:left;
	font-size:16px;
}

.movie_inner .border_button p{
	text-align: center;
	width:220px;
}
@media screen and (max-width: 1194px) {
	#top_area .toparea_info{
		padding:32px;
	}
	#top_area .toparea_info .title_area h3{
		margin-bottom:2.5vw;
	}
	#top_area .toparea_info ul li{
		margin-bottom:2.5vw;
	}
	#top_area .toparea_info ul li:last-child{
		margin-bottom:3.5vw;
	}
}



@media screen and (max-width: 1000px) {
	#top_area .works_info{
		top:32px;
		left:32px;
	}
	.works_mv .img_wrap h2{
		top:128px;
		left:32px;
		margin-right:32px;
	}
}

@media screen and (max-width: 899px) {
	#top_area{
		margin-top:0;
	}
	#top_area .toparea_info{
		padding:32px 32px 16px;
	}

	.slogan .mv{
		font-size:2vw;
	}
	.slogan .info{
		font-size:2vw;
	}

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

	#top_area .works_mv{
	width:100%;
	max-width:100%;
	display:block;
	}
	#top_area .toparea_info{
		width:100%;
		display:block;
		height:auto;
	}
	.slogan{
		height:auto;
	}

	.slogan .mv{
		width:100%;
		display:block;
		text-align: center;
		font-size:18px;
		padding: 10px 25px;
	}
	.slogan .info{
		width:100%;
		text-align: center;
		display:block;
		font-size:18px;

	}
	.slogan .info a{
		width:100%;
	}
}

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

	.works_mv .img_wrap h2{
		top:auto;
		bottom:32px;
		margin-right:0;
	}
.title_area:last-of-type{
	margin-top:32px;
}
	#top_area .toparea_info .title_area h3{
		letter-spacing: 0.5em;
	}
	#top_area .toparea_info ul li{
		margin-bottom:5vw;
	}
	#top_area .toparea_info ul li:last-child{
		margin-bottom:6vw;
	}


	.twins{
		display:block;
	}
	.twins .twin{
		width:100%;
	}


	.twin_inner{
		padding:32px;
	}
	.twin_inner.housing{
		padding:32px;
	}
	.movie_inner{
		padding:32px;
	}
	#top_event_list{
		padding:32px;
	}
	#top_event_list .title_wrap{
		width:100%;
		margin-bottom:18px;
	}
	#top_event_list .title_wrap > *{
		writing-mode: initial;
		margin-bottom:18px;
	}
	#top_event_list .title_wrap h2 {
		width:100%;
	}

	#top_event_list .title_wrap p.event_list{
		position:relative;
	}
	#top_event_list .event_list_inner{
		margin:0;
		width:100%;
	}

}

/*---------------
iemiru inner
---------------*/

.iemiru_inner{
	width:100%;
	max-width:1280px;
	padding:68px;
	margin:0 auto;
	text-align: center;
}

.iemiru_inner h3 {
    font-size: 28px;
    letter-spacing: 0.35em;
    font-weight: 300;
    margin-bottom: 24px;
}

#iemiru-cms-index-page{
	max-width:100%;
	display:flex;
	justify-content: center;
}
#iemiru-cms-index-page .index-page__events-event.is-horizontal{
	float:none;
	transition:0.3s;
}
@media screen and (max-width: 899px) {
	.iemiru_inner{
		padding:32px;
	}
	.iemiru_inner h3 {
		font-size: 21px;
		margin-bottom:21px;
	}
}