@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Noto+Sans+JP&family=Oswald:wght@400;500&display=swap');

#moviegallery {
	font-family: "Noto Sans JP","游ゴシック","Yu Gothic",YuGothic,"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro","メイリオ ",Meiryo,"MS ゴシック",sans-serif;
	color: #231815;
}

#moviegallery h3 {
	text-align: center;
	margin-bottom: 35px;
	font-size: 18px;
	letter-spacing: 3px;
}

#moviegallery h3:before {
    content: "";
    background: url(../image/icon_interview.svg) no-repeat 50% 50%;
    display: inline-block;
    width: 65px;
    height: 42px;
    background-size: contain;
    vertical-align: text-bottom;
    margin-right: 15px;
}

.bgShadow {
    box-shadow: 0px 16px 14px 0px rgb(5 0 0 / 20%);
	-moz-box-shadow: 0px 16px 14px 0px rgb(5 0 0 / 20%);
	-webkit-box-shadow: 0px 16px 14px 0px rgb(5 0 0 / 20%);
    padding-bottom: 70px;
    margin-bottom: 120px;
}

/*ーーー大きいスライダーーーー*/
#moviegallery .slick-list.draggable {
    max-width: 100%;
	margin: 0 auto;
}

#moviegallery .slider {
  margin: 0 auto;
	width: 100%;
}

#moviegallery .slider-img div {
  margin: 0 30px;
}

#moviegallery .slider-img img {
	height: auto;
	width: 100%;
	margin-bottom: 45px;
}

#moviegallery .slider .slick-arrow:before{
	content:""!important;
}

#moviegallery .slider .slick-arrow:before{
    content:""!important;
    width: 30px!important;
    height: 30px!important;
    position: absolute;
    top: 0;
    left: 0;
}

#moviegallery .slider .slick-prev,#moviegallery .slider .slick-next {
    width: 30px!important;
    height: 30px!important;
	top: 39.8%;
}

#moviegallery .slider .slick-next:before{
    background: url("../image/icon_arrow_right.svg") no-repeat 50% 50%!important;
    background-size: 30px!important;
}

#moviegallery .slider .slick-prev:before{
    background: url("../image/icon_arrow_left.svg") no-repeat 50% 50%!important;
    background-size: 30px!important;
}


#moviegallery .slider .slick-prev:before,#moviegallery .slider .slick-next:before {
    font-size: 30px;
    opacity: 1;
	content: '';
}

#moviegallery .slider .slick-prev {
    left: calc(15% - 15px);
	z-index: 2;
}

#moviegallery .slider .slick-next {
    right:calc(15% - 15px);
}

#moviegallery a {
    position: relative;
}

#moviegallery a .mark {
    position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: 95px;
}

#moviegallery .slider-img .title {
    text-align: center;
    font-weight: bold;
    font-size: 18px;
	margin-bottom: 12px;
}

#moviegallery .slider-img .text {
    text-align: center;
	margin-bottom: 32px;
}

#moviegallery .slider-img .text span {
    text-align: center;
    font-size: 10px;
	color:#2F5C97;
	border: 1px solid #2F5C97;
	padding: 6px 30px;
	display: inline-block;
	line-height: 1;
}

#moviegallery .slick-dotted.slick-slider {
    margin-bottom: 70px;
}

#moviegallery .slick-dots li {
    width: 55px !important;
	height: 5px !important;
}

#moviegallery .slick-dots li button:before {
    width: 55px !important;
}

#moviegallery .slick-dots li.slick-active button:before {
    background: #4C4948 !important;
    width: 55px!important;
    height: 5px!important;
}

/*ーーー大きいスライダここまでーーーー*/

/*ーーー小さいスライダーーーー*/
.innerWrap {
    max-width: 1200px;
    margin: 0 auto 125px;
}

.smallSlider {
	max-width: 1030px;
    margin: 0 auto 50px;
}

#moviegallery .smallSlider .slick-prev,
#moviegallery .smallSlider .slick-next {
    width: 55px!important;
    height: 55px!important;
	
}

#moviegallery .smallSlider .slick-prev:before,
#moviegallery .smallSlider .slick-next:before {
    font-size: 30px;
    opacity: 1;
	content: '';
}

#moviegallery .smallSlider .slick-prev {
    left: -55px;
}

#moviegallery .smallSlider .slick-next {
    right:-55px;
}

#moviegallery .slider02 .slider-img {
    margin: 0 20px;
}

#moviegallery .smallSlider .slider-img .title {
    font-size: 12px;
	margin-bottom: 6px;
    line-height: 1;
	min-height: 25px;
}

#moviegallery .smallSlider .slick-prev,
#moviegallery .smallSlider .slick-next {
    top: 32%;
    width: 55px;
    height: 55px;
    color: #fff;
    background: #333;
    border-radius: 50px;
    text-align: center;
}

#moviegallery .slider02.smallSlider .slick-prev,
#moviegallery .slider02.smallSlider .slick-next {
    top: 39.5%;
	z-index: 2;
}

#moviegallery .smallSlider .slick-prev {
	background: #c9caca;
}

#moviegallery .smallSlider .slick-prev::before {
    content: "";
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 16px;
    width: 23px;
    height: 2px;
    background: #fff;
}

#moviegallery .smallSlider .slick-prev::after {
    content: "";
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 16px;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-right: 5px solid #fff;
}

#moviegallery .smallSlider .slick-next::before {
    content: "";
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 16px;
    width: 23px;
    height: 2px;
    background: #fff;
}

#moviegallery .smallSlider .slick-next::after {
    content: "";
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 16px;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #fff;
}

#moviegallery .smallSlider a .mark {
	width: 40px;
}

#moviegallery .smallSlider .slider-img img {
    margin: 0 auto 25px;
}

/*ーーー小さいスライダここまでーーーー*/

.modal-video-body{
	max-width:95%!important;
	padding: 0!important;
}



/*ーーーバナーーーーー*/

.centerLineArea .centerLine {
	width: 1px;
	height: 60px;
	background: #231815;
	margin: 0px auto -30px;
    position: relative;
}

.bnrArea {
	background: #F9F7F4;
	padding: 45px 0 25px;
}

.bnrArea h4 {
	font-size: 25px;
	text-align: center;
	line-height: 1;
	margin-bottom: 55px;
	font-family: 'Bebas Neue', sans-serif;
	font-weight: normal;
	color: #4C4948;
}

.bnrArea h4 span {
	font-size: 10px;
	display: block;
	font-family: "Noto Sans JP","游ゴシック","Yu Gothic",YuGothic,"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro","メイリオ ",Meiryo,"MS ゴシック",sans-serif;
	margin-top: 5px;
}

.bnrArea ul {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap:35px;
	align-items: flex-start;
}

.bnrArea ul li a img {
    width: auto;
    border: 10px solid #fff;
    box-shadow: 0px 0px 10px 0px hwb(0deg 0% 98% / 30%);
    border-radius: 15px;
}

.modal-video-movie-wrap {
    padding-bottom: 90%!important;
	background: none!important;
}

/*ーーードローン、施工実例ーーーー*/

#moviegallery.drone h3,#moviegallery.model h3,#moviegallery.room h3 {
    margin-bottom: 8px;
}

.droneShort .detailSlider .slider-img {
	opacity: 1;
}

.droneShort .detailSlider .slider-img .title,.droneShort .detailSlider .slider-img .text {
    display: block;
}

.droneShort .detailSlider .slick-track {
    margin: 0;
}




.detailSlider .slider-img {
    opacity: 0.3;
}

.detailSlider .slider-img.slick-active {
    opacity: 1;
}

.detailSlider .slider-img .title,.detailSlider .slider-img .text {
    display: none;
}

#moviegallery .detailSlider .slider-img.slick-active .title {
    display: block;
	margin-bottom: 5px;
	min-height: 52px;
	line-height: 1.4;
}

.detailSlider .slider-img.slick-active .text {
	display: block;
}

#moviegallery .slider0 .slider-img img {
    margin-bottom: 20px;
}

.detailSlider .slick-prev {
    left: 50px;
    top: 75%;
	z-index: 2;
}

.detailSlider .slick-next {
    right: 50px;
    top: 75%;
}

#moviegallery .detailSlider a .mark {
    width: 40px;
}

.detailSlider {
    margin-bottom: 90px;
}

p.jpText {
	text-align: center;
	margin-bottom: 30px;
}

p.jpText span {
    text-align: center;
    background: #a4d1ee;
    color: #fff;
    font-weight: bold;
    font-size: 22px;
    text-shadow: 0px 0px 5px #424242;
    letter-spacing: 5px;
    display: inline-block;
    line-height: 40px;
    width: 235px;
}

.model p.jpText span {
    background: #C5DA90;
}

.room p.jpText span {
    background: #C39899;
}

.bgShadow .detailMainPhoto {
    max-width: 62%;
    margin: 0 auto;
    text-align: center;
}

.bgShadow .detailMainPhoto img {
	margin-bottom: 40px;
}

.bgShadow .detailMainPhoto p.title {
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 3px;
}

.bgShadow .detailMainPhoto p.text span {
    text-align: center;
    font-size: 10px;
    color: #2F5C97;
    border: 1px solid #2F5C97;
    padding: 6px 30px;
    display: inline-block;
    line-height: 1;
}

#moviegallery .detailSlider .slider-img img {
    margin-bottom: 25px;
}

#moviegallery .detailSlider .slick-arrow:before{
	content:""!important;
}

#moviegallery .detailSlider .slick-arrow:before{
    content:""!important;
    width: 30px!important;
    height: 30px!important;
    position: absolute;
    top: 0;
    left: 0;
}

#moviegallery .detailSlider .slick-prev,#moviegallery .detailSlider .slick-next {
    width: 30px!important;
    height: 30px!important;
}

#moviegallery .detailSlider .slick-next:before{
    background: url("../image/icon_arrow_right.svg") no-repeat 50% 50%!important;
    background-size: 30px!important;
}

#moviegallery .detailSlider .slick-prev:before{
    background: url("../image/icon_arrow_left.svg") no-repeat 50% 50%!important;
    background-size: 30px!important;
}


#moviegallery .detailSlider .slick-prev:before,#moviegallery .detailSlider .slick-next:before {
    font-size: 30px;
    opacity: 1;
	content: '';
}

#moviegallery .detailSlider .slick-prev:after, #moviegallery .detailSlider .slick-next:after {
    content: "MORE";
    position: absolute;
    top: 43px;
    color: #4C4948;
    font-size: 10px;
    left: 0;
}

#moviegallery .detailSlider .slider-img div {
    margin: 0 16px;
}

/*ーーールームツアーーーーー*/

.room .bgShadow .detailMainPhoto img {
    width: auto;
	height: 100%;
}

.room .detailSlider .slick-prev {
    left: 75px;
    top: 82%;
}

.room .detailSlider .slick-next {
    right: 75px;
    top: 82%;
}


@media screen and (min-width:320px) and ( max-width:767px) { 
	
	#moviegallery h3 {
		letter-spacing: 1px;
		position: relative;
		margin-bottom: 40px;
	}	
	
	#moviegallery h3:before {
		content: "";
		width: 50px;
		height: 40px;
		margin-right: 0;
		position: absolute;
		top: -40px;
		left: 50%;
		transform: translateX(-50%);
	}		
	
	.innerWrap {
		max-width: none;
		margin: 0 auto 35px;
	}
	
	#moviegallery a .mark {
		width: 45px;
	}	
	
	#moviegallery .slider .slick-prev {
		left: 10px;
	}
	
	#moviegallery .slider .slick-next {
		right: 10px;
	}	
	
	#moviegallery .slider-img img {
		margin-bottom: 10px;
	}
	
	#moviegallery .slider-img .title {
		font-size: 16px;
		margin-bottom: 0px;
	}
	
	#moviegallery .slider-img .text {
		margin-bottom: 0;
	}
	
	.bgShadow {
		padding-bottom: 10px;
		margin-bottom: 80px;
	}
	
	#moviegallery .slider02.smallSlider .slider-img .title {
		margin-bottom: 0px;
		line-height: 1.6;
		min-height: 2.6rem;
	}

	#moviegallery .smallSlider .slick-prev {
		left: 15px;
	}

	#moviegallery .smallSlider .slick-next {
		right:15px;
	}
	
	#moviegallery .smallSlider .slick-prev, #moviegallery .smallSlider .slick-next {
		width: 30px!important;
		height: 30px!important;
	}
	
	#moviegallery .smallSlider .slick-prev::before {
		right: 5px;
		width: 18px;
	}
	
	#moviegallery .smallSlider .slick-prev::after {
		left: 5px;
	}
	
	#moviegallery .smallSlider .slick-next::before {
		left: 5px;
		width: 18px;
	}
	
	#moviegallery .smallSlider .slick-next::after {
		right: 5px;
	}
		
	#moviegallery .slider01 .slider-img {
		margin: 0 60px;
	}
	
	#moviegallery .slider02 .slider-img {
		margin: 0 70px;
	}
	
	.modal-video-movie-wrap {
		width: 100%!important;
		padding-bottom: 130%!important;
	}	
	
	.bnrArea h4 {
		margin-bottom: 40px;
	}	

	.bnrArea ul {
		gap:0 15px ;
	}

	.bnrArea ul li {
		width: 90%;
		margin: 0 auto 20px;
	}
	
	.bnrArea ul li a img {
		width: 100%;
	}
	
/*ーーードローン、施工実例ーーーー*/
	
	.bgShadow {
		padding-bottom: 40px;
		margin-bottom: 70px;
		box-shadow: 0px 8px 10px 0px rgb(5 0 0 / 20%);
		-moz-box-shadow: 0px 8px 10px 0px rgb(5 0 0 / 20%);
		-webkit-box-shadow: 0px 8px 10px 0px rgb(5 0 0 / 20%);
	}
	
	.bgShadow .detailMainPhoto {
		max-width: 90%;
	}	
		
	p.jpText span {
		font-size: 15px;
		line-height: 30px;
		padding: 0px 40px;
		width: auto;
	}
	
	.bgShadow .detailMainPhoto img {
		margin-bottom: 15px;
	}
	
	.bgShadow .detailMainPhoto p.title {
		font-size: 16px;
		letter-spacing: 2px;
	}	
	
	.detailSlider {
		margin-bottom: 40px;
	}	

	.detailSlider .slick-prev {
		left: 15px;
	}
	
	.detailSlider .slick-next {
		right: 15px;
	}
	
	
	
/*ーーールームツアーーーーー*/
	
	.room .bgShadow .detailMainPhoto img {
		width: 60%;
		height: auto;
	}
	
	.room .detailSlider .slick-prev,.droneShort .detailSlider .slick-prev {
		left: 15px;
		top: 90%;
	}
	
	.room .detailSlider .slick-next,.droneShort .detailSlider .slick-next {
		right: 15px;
		top: 90%;
	}

	
	
	
	
	
	
	
}

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

	#moviegallery .slider02 .slider-img {
		margin: 0 30px;
	}
	
	.innerWrap {
		max-width: 80%;
		margin: 0 auto 125px;
	}	
	
	.bnrArea ul li {
		margin: 0 auto 20px;
	}
	
	#moviegallery a .mark {
		width: 65px;
	}
	
	#moviegallery .slider-img .title {
		font-size: 16px;
	}	
	
	#moviegallery .detailSlider a .mark {
		width: 30px;
	}	
	
}


@media screen and (min-width:1025px) { 
	
	#moviegallery .slider01.smallSlider .slider-img .title {
		min-height: 0;
	}	


}