@charset "UTF-8";

/*---------------------------------------
 * PC
---------------------------------------*/ 

@media print, screen and (min-width:931px) {
	
	.page-header h2{
		width: 166px;
	}
	
	main{	
		position: relative;
	}
	
	
	/* メインビジュアル
	---------------------------------------*/ 
	.main-img {
		width: 100%;
    height: 600px;
    background: url(../img/banquet_img-01.jpg) 50% 50% no-repeat;
    background-size: cover;
    position: relative;
	}

	/* エスカリエ
	---------------------------------------*/ 

	.escalier{
		width: 100%;
	}
	.escalier .inner{
		display: flex;
    margin: 0 auto;
    position: relative;
    align-items: center;
		padding: 80px 0px 80px calc((100vw - 1080px) / 2);
	}

	.escalier .inner .photo-wrap{
		display: flex;
    width: calc(100% - 460px);
	}

	.escalier .inner .photo-wrap .photo{
		height: 450px;
	}

	.escalier .inner .photo-wrap .photo img{
    width: 100%;
    height: inherit;
    object-fit: cover;
  }

  .escalier .inner .photo-wrap .photo:first-child{
    margin-right: 10px;
    width: 70%;
    height: 450px;
  }

  .escalier .inner .photo-wrap .photo:last-child{
    height: 450px;
    width: 30%;
  }

	.escalier .inner .text{
		width: 460px;
    margin: 0;
	}
	
	.escalier .inner .text .title{
		position: relative;
		display: flex;
		align-items: center;
		height: 47px;
    margin-bottom: 35px;
	}

	.escalier .inner .text .sub-title{
		padding-left: 20px;
	}

	.escalier .inner .text .title img{
		width: 210px;
	}

	.escalier .inner .text .title::before{
		content: "";
    position: absolute;
    z-index: -1;
    bottom: -8px;
    width: 50vw;
    height: 1px;
    background-color: #CA8F8B;
	}
	
	.escalier .inner .text .text-box .midashi{
		font-size: 24px;
		margin-bottom: 15px;
		letter-spacing: 2px;
		line-height: 2;
	}

	.escalier .inner .text .text-box .midashi2{
		margin-bottom: 15px;
		color: #6F5849;
	}

	.escalier .inner .text .text-box .read{
		line-height: 2;
		margin-bottom: 40px;
	}

	/* エスカリエの特徴
	---------------------------------------*/
	.feature {
		background: #F7F7F5;
		padding: 60px 0 0px;
	}

	.feature .inner .midashi{
		margin: 0 auto 40px;
    padding-left: calc((100vw - 1080px) / 2 );
		display: flex;
		align-items: end;
	}

	.feature .inner .midashi .photo{
		width: 138px;
	}

	.feature .inner .midashi span{
		font-size: 13px;
		font-family: YuGothic,'Yu Gothic',sans-serif;
		padding: 0 0 10px 15px;
		color: #6F5849;
	}

	.feature .inner .feature_slider{
		overflow: hidden;
		position: relative;
		padding-bottom: 130px;
		margin-bottom: 0;
	}

	.feature .inner .feature_slider .slidelist{
		margin: 0 20px 20px;
		width: 750px;
	}

	.feature .inner .feature_slider .slidelist .photo{
		margin-bottom: 20px;
	}

	.feature .inner .feature_slider .slidelist .photo img{
		width: inherit;
	}

	.feature .inner .feature_slider .prev-arrow{
		position: absolute;
    z-index: 1;
		top: 228px;
    left: calc(50% - 380px);
		transform: translate(-50%, -50%);
    width: 35px;
    height: 35px;
    border: 1px solid #C7C2AD;
    border-radius: 50vh;
    background-color: transparent;
	}

	.feature .inner .feature_slider .prev-arrow::before{
		content: '';
    width: 8px;
    height: 8px;
    border: 1px solid #C7C2AD;
    border-top: 0;
    border-right: 0;
    transform-origin: bottom left;
    position: absolute;
		top: 43%;
    left: 23%;
    transform: rotate(45deg) translate(-50%, -50%);
    box-sizing: border-box;
	}

	.feature .inner .feature_slider .prev-arrow::after{
		content: '';
    line-height: 1;
    position: absolute;
    width: 15px;
    height: 1px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #C7C2AD;
	}

	.feature .inner .feature_slider .next-arrow{
		position: absolute;
    z-index: 1;
		top: 210px;
		right: calc(50% - 395px);
    width: 35px;
    height: 35px;
    border: 1px solid #C7C2AD;
    border-radius: 50vh;
    background-color: transparent;
	}

	.feature .inner .feature_slider .next-arrow::before{
		content: '';
    width: 8px;
    height: 8px;
    border: 1px solid #C7C2AD;
    border-top: 0;
    border-right: 0;
    transform: rotate(-135deg);
    transform-origin: bottom left;
    position: absolute;
    left: 83%;
    top: 27%;
    box-sizing: border-box;
	}

	.feature .inner .feature_slider .next-arrow::after{
		content: '';
    line-height: 1;
    position: absolute;
    width: 15px;
    height: 1px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
		background-color: #C7C2AD;
	}
	
	.feature .inner .feature_slider .slick-dots {
		bottom: 115px;
	}

	.feature .inner .feature_slider .slick-dots li button:before{
		font-family: 'slick';
    font-size: 6px;
    line-height: 20px;
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    content: '•';
    text-align: center;
    opacity: .25;
    color: black;
	}

	::-webkit-full-page-media, :future, :root
	.feature .inner .feature_slider .slick-dots li button:before{
		font-size: 10px;
	}

	@-moz-document url-prefix() {
		.feature .inner .feature_slider .slick-dots li button:before{
			font-size: 10px;
		}
	}

	.feature .inner .feature_slider .slick-dots .slick-active button:before{
		opacity: .75;
    color: black;
	}

	.feature .inner .feature_slider .text{
		text-align: center;
		line-height: 2;
		width: 750px;
	}
	
	/* パーティスタイル
	---------------------------------------*/
	.party {
		padding: 120px 0;
		position: relative;
		background: #F0EDE7;
	}

	.party .heading{
		text-align: center;
		position: absolute;
		top: 1%;
    left: 50%;
    transform: translate(-50%, -50%);
	}

	.party .heading .midashi{
		width: 284px;
    margin-bottom: 15px;
	}

	.party .inner {
		width: 1080px;
    text-align: center;
    margin: auto;
	}

	.party .party-list {
		display: flex;
		justify-content: space-between;
		margin-bottom: 35px;
	}
	.party .party-list:last-child {
		margin-bottom: 0px;
	}

	.party .party-list .photo {
    width: 495px;
	}

	.party .party-list .photo img {
    width: inherit;
	}

	.party .party-list .text {
		width: 525px;
    text-align: left;
    margin-top: 40px;
	}
	.party .party-list .midashi2 {
		margin-bottom: 15px;
		color: #6F5849;
	}

	.party .party-list h3 {
		font-size: 24px;
		margin-bottom: 30px;
	}

	.party .party-list .read {
		line-height: 2;
	}
	
	/* レコメンド
	---------------------------------------*/ 
	
	.recommend{
		width: 100%;
		padding: 0 0 130px;
	}
	.recommend .inner{
		width: 1080px;
		margin: 0 auto;
		padding: 100px 80px 0;
		position: relative;
	}
	.recommend .inner .text{
		float: left;
		width: 305px;
		margin:131px 0px 0 0px;
		
	}
	.recommend .inner .photo{
		float: right;
		width: 600px;
	}
	.recommend .inner .text .title{
		position: absolute;
		top:160px;
		left:80px;
		width: 395px;
		height: 47px;
	}
	.recommend .inner .text .text-box{
		margin: 0 0 20px;
	}
	.recommend .inner .text .text-box .midashi{
		margin-bottom: 15px;
	}
	.recommend .inner .text .text-box .midashi2{
		font-size: 19px;
		margin-bottom: 15px;
		letter-spacing: 2px;
	}
	.recommend .inner .text .text-box .read{
		line-height: 1.7;
		margin-bottom: 15px;
	}

	/* セレモニーの導線
	---------------------------------------*/ 
	
	.banquet-navi{
		width: 100%;
		background:url(../img/banquet_navi_pc.jpg) 50% no-repeat;
		background-size: cover;
		padding: 85px 0 70px;
	}	
	.banquet-navi .inner{
		width: 1080px;
		margin: 0 auto;
		text-align: center;
		color: #FFFFFF;
	}
	.banquet-navi .inner .title{
		width: 190px;
		margin: 0 auto 15px;
	}
	.banquet-navi .inner .title-ja{
		font-size: 12px;
		margin: 0 0 20px;
	}
	.banquet-navi .inner .read{
		font-size: 20px;
		margin-bottom: 35px;
	}
	.banquet-navi .inner .banquet-navi-link{
		margin: 0 auto;
	}
}

/*---------------------------------------
 * SP
---------------------------------------*/ 

@media print, screen and (max-width:930px) {
	
	.page-header h2{
		width: 135px;
	}
	main .gray-bg{
		width: 100%;
		height: 160%;
		background: #F7F7F5;
		position: absolute;
		z-index: -1;
	}
	
	/* メインビジュアル
	---------------------------------------*/ 
	
	.main-img {
		width: 100%;
    height: 375px;
    background: url(../img/banquet_img-01_sp.png) 50% 50% no-repeat;
    background-size: cover;
    position: relative;
		margin-bottom: 40px;
	}
	.main-img .inner{
		width: 100%;
		margin: 0 auto;
	}
		
	/* エスカリエ
	---------------------------------------*/ 

	.escalier{
		width: 100%;
		padding: 0 0 80px;
	}
	.escalier .inner{
		width: 100%;
    margin: 0 auto;
		padding: 130px 0px 0 0px;
    position: relative;
		display: flex;
    flex-direction: column-reverse;
	}

	.escalier .inner .photo-wrap{
		display: flex;
    width: calc(100% - 40px);
		margin-left: 40px;
	}

	.escalier .inner .photo-wrap .photo{
		height: 250px;
	}

	.escalier .inner .photo-wrap .photo img{
    width: 100%;
    height: inherit;
    object-fit: cover;
  }

  .escalier .inner .photo-wrap .photo:first-child{
    margin-right: 10px;
    width: 60%;
  }

  .escalier .inner .photo-wrap .photo:last-child{
    width: 40%;
  }

	.escalier .inner .text{
		width: 100%;
		margin: 0;
	}
	
	.escalier .inner .text .title{
		position: absolute;
		top: 0px;
		left: 40px;
		width: 171px;
		height: 47px;
	}

	.escalier .inner .text .title::before{
		content: "";
    position: absolute;
    z-index: -1;
    bottom: -40px;
    width: calc(100vw - 40px);
    height: 1px;
    background-color: #CA8F8B;
	}

	.escalier .inner .text .title .sub-title{
		display: block;
    padding-top: 10px;
	}

	.escalier .inner .text .text-box{
		margin: 0 0 20px;
		padding: 0 40px;
	}
	
	.escalier .inner .text .text-box .midashi{
		font-size: 20px;
		margin: 40px auto 30px;
		letter-spacing: 2px;
		line-height: 2;
	}

	.escalier .inner .text .text-box .midashi2{
		margin-bottom: 15px;
		color: #6F5849;
	}

	.escalier .inner .text .text-box .read{
		line-height: 2;
		margin-bottom: 40px;
	}

	/* エスカリエの特徴
	---------------------------------------*/
	.feature {
		background: #F7F7F5;
		padding: 30px 0 0px;
	}

	.feature .inner .midashi{
		margin: 0 0 40px 40px;
		display: flex;
		flex-direction: column;
	}

	.feature .inner .midashi .photo{
		width: 114px;
	}

	.feature .inner .midashi span{
		font-size: 13px;
		font-family: YuGothic,'Yu Gothic',sans-serif;
		padding: 8px 0 0 0;
	}

	.feature .inner h2{
		font-family: 'Playfair Display', serif;
		color: #6F5849;
		font-size: 36px;
	}
	.feature .inner .feature_slider{
		position: relative;
		margin: 0;
    padding-bottom: 100px;
	}

	.feature .inner .feature_slider .prev-arrow{
		display: none!important;
	}

	.feature .inner .feature_slider .next-arrow{
		display: none!important;
	}

	.feature .inner .feature_slider .slidelist{
		margin: 0 10px 10px;
		width: 295px;
	}

	.feature .inner .feature_slider .slidelist .photo{
		margin-bottom: 20px;
	}

	.feature .inner .feature_slider .slidelist .photo img{
		width: inherit;
	}

	.feature .inner .feature_slider .slick-dots {
		bottom: 75px;
	}

	.feature .inner .feature_slider .slick-dots li button:before{
		font-family: 'slick';
    font-size: 6px;
    line-height: 20px;
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    content: '•';
    text-align: center;
    opacity: .25;
    color: black;
	}

	.feature .inner .feature_slider .slick-dots .slick-active button:before{
		opacity: .75;
    color: black;
	}

	.feature .inner .feature_slider .text{
		text-align: left;
		line-height: 2;
	}

	/* パーティスタイル
	---------------------------------------*/
	.party {
		padding: 100px 0;
		position: relative;
		background: #F0EDE7;
	}

	.party .heading{
		text-align: center;
		position: absolute;
		top: 10px;
    left: 50%;
    transform: translate(-50%, -50%);
	}

	.party .heading .midashi{
		width: 216px;
    margin-bottom: 13px;
	}

	.party .inner {
		width: 100%;
    text-align: center;
    margin: auto;
	}

	.party .party-list {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		margin: 0 20px 60px;
	}
	.party .party-list:last-child {
		margin-bottom: 0px;
	}

	.party .party-list .photo {
    width: 100%;
	}

	.party .party-list .photo img {
    width: inherit;
	}

	.party .party-list .text {
		width: 100%;
    text-align: left;
    margin-top: 40px;
		padding: 0 20px;
	}
	
	.party .party-list .midashi2 {
		margin-bottom: 15px;
		color: #6F5849;
	}

	.party .party-list h3 {
		font-size: 24px;
		margin-bottom: 25px;
	}

	.party .party-list .read {
		line-height: 2;
	}
	
	/* レコメンド
	---------------------------------------*/ 

	.recommend{
		width: 100%;
		margin-bottom: 65px;	
	}
	.recommend .inner{
		margin: 0 20px;
		padding: 50px 0 0;
		position: relative;
	}
	.recommend .inner .text{
		width: 90%;
        margin: auto;
	}
	.recommend .inner .photo{
		width: 100%;
		margin-bottom: 35px;
	}
	.recommend .inner .text h2{
		width: 100%;
		padding-bottom: 20px;
		border-bottom: 1px solid #D48C89;
		margin-bottom: 20px;	
	}
	.recommend .inner .text h2 img{
		width: 100%;
	}
	.recommend .inner .text .title{
		margin:  0 0 20px;
	}
	.recommend .inner .text .text-box .midashi{
		margin-bottom: 15px;
	}
	.recommend .inner .text .text-box .midashi2{
		font-size: 20px;
		margin-bottom: 15px;
		letter-spacing: 1px;
	}
	.recommend .inner .text .text-box .read{
		line-height: 1.8;
		margin-bottom: 15px;
		font-size: 12px;
	}
	
	/* セレモニーの導線
	---------------------------------------*/ 
	
	.banquet-navi{
		width: 100%;
		background:url(../img/banquet_navi_sp.jpg) 50% no-repeat;
		background-size: cover;
		padding: 85px 0 70px;
	}	
	.banquet-navi .inner{
		margin: 0 20px;
		text-align: center;
		color: #FFFFFF;
	}
	.banquet-navi .inner .title{
		width: 190px;
		margin: 0 auto 15px;
	}
	.banquet-navi .inner .title-ja{
		font-size: 12px;
		margin: 0 0 20px;
	}
	.banquet-navi .inner .read{
		font-size: 20px;
		margin-bottom: 35px;
	}
	.banquet-navi .inner .banquet-navi-link{
		margin: 0 auto;
	}		
	
}