@charset "utf-8";
/*----------------------------------------------------
main image

.main_image {
display: none;

position: relative;
width: 100%;
height: 500px;
margin: 0 0 30px 0;
background: url(../img/maincopy_bg.jpg) no-repeat top center;
background-size: auto 550px;
top: 0;
z-index: 0;
}
.main_image > .copy {
position: absolute;
width: 80%;
margin: 0 10%;
padding: 60px 5% 50px 5%;
text-align: center;
background: url(../img/wt_90.png) repeat left top;
top: 100px;
}
.main_image > .copy > .maincopy {
position: relative;
margin: 0 0 40px 0
}
.main_image > .copy > .maincopy::after {
content: "";
position: absolute;
display: block;
width: 10%;
height: 2px;
margin: 20px 45% 0 45%;
background-color: #313131;
}
.main_image > .copy > p {
font-size: 0.8em;
line-height: 1.8;
}
----------------------------------------------------*/

/*----------------------------------------------------
slideshow
----------------------------------------------------*/
.cb-slideshow {
	display: none;
}

.cb-slideshow-sp,
.cb-slideshow-sp:after {
position: relative;
width: 100%;
height: 364px;
margin: 0;
top: 75px;
left: 0px;
z-index: -1;
}
.cb-slideshow-sp > li > span {
width: 100%;
height: 252px;
position: absolute;
top: 0px;
left: 0px;
color: transparent;
background-size: 150% auto;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: contain;
z-index: 0;
}
.cb-slideshow-sp > li:nth-child(1) > span {
background-image: url("../img/sp/slide/01.jpg");
animation: fadeSlide01 0s ease-out infinite;
animation-delay: 3s;
}
.cb-slideshow-sp > li:nth-child(2) > span {
opacity: 0;
background-image:  url(../img/sp/slide/02.jpg);
animation: fadeSlide02 30s ease-out infinite;
animation-delay: 3s;
}
.cb-slideshow-sp > li:nth-child(3) > span {
opacity: 0;
background-image:  url(../img/sp/slide/03.jpg);
animation: fadeSlide03 30s ease-out infinite;
animation-delay: 3s;
}
.cb-slideshow-sp > li:nth-child(4) > span {
opacity: 0;
background-image:  url(../img/sp/slide/04.jpg);
animation: fadeSlide04 30s ease-out infinite;
animation-delay: 3s;
}

/*----------------------------------------------------
コロナ対策
----------------------------------------------------*/
.covic {
width: 90%;
margin: 0 5% 10px 5%;
}
.covic > a {
display: block;
padding: 1em 0;
/*border: #FF8284 solid 10px;*/
border: #999 solid 10px;
background: #FFF;
text-align: center;
font-size: 1.3em;
font-weight: bold;
transition: all .3s;
}
.covic > a:hover {
border: 10px solid #464646;
/*border: 10px solid #FF3033;*/
}

/*----------------------------------------------------
コロナ対策下のバナー
----------------------------------------------------*/
.t-bn {
	margin: 0 auto;
}


/*----------------------------------------------------
事前相談・お急ぎの方
----------------------------------------------------*/
.select {
padding: 30px 0;
}
.select > a {
display: block;
position: relative;
width: 90%;
margin: 0 5% 30px 5%;
padding: 60px 15%;
background: #FFF url(../img/arrow_l.png) no-repeat right 15px bottom 25px;
background-size: 50px auto;
outline: #eee solid 1px;
outline-offset: -1px;
transition: all 0.2s;
}
.select > a:hover {
outline: #efb1fe solid 10px;
outline-offset: -10px;
}
.select > a > .title {
font-family: "しまなみ",Shimanami;
position: relative;
width: 100%;
margin:  0 0 30px 0;
text-align: center;
font-size: 1.6em;
}
.select > a > .title::after {
content: "";
position: absolute;
display: block;
width: 70%;
height: 15px;
margin: 0 15%;
background: url(../img/select_line.png) no-repeat left top;
background-size: 100% auto;
}
.select > a > p {
text-align:justify;
text-justify:inter-ideograph;
}

/*----------------------------------------------------
YouTubeスライダー
----------------------------------------------------*/
.slick-slider {
	width: 95%;
	margin: 0 auto;
}
.slick-slide {
	text-align: center;
}
.slick-arrow {
	width: 30px;
}
.prev_icon{
  position: absolute;
  top: 50%;
  left: 13%;
  transform: translate(0,-50%);
  width: 30px;
  z-index: 1;
}
.next_icon{
  position: absolute;
  top: 50%;
  right: 13%;
  transform: translate(0,-50%);
  width: 30px;
  z-index: 1;
}
.slick-dots li button:before {
    font-size: 60px;
}
.y-slider {
    margin-bottom: 100px!important;
	width: 65%;
}

@media screen and (max-width: 1024px) {
	.prev_icon{
		left: 0;
	}
	.next_icon{
		right: 0;
	}
}

@media screen and (max-width: 768px) {
	.y-slider {
		width: 100%;
	}	
	
.y-wrap {
	position: relative;
	padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
	height: 0;
	overflow: hidden;
}

.y-wrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
}

/*----------------------------------------------------
式場のご案内
----------------------------------------------------*/
.hall_wrap {
width: 100%;
padding: 30px 0 15px 0;
background: #FFF;
}
.hall_wrap > .hall {
margin: 0 0 60px 0;
}
.hall_wrap > .hall > .photo {
margin: 0 0 1.5em 0;
}
.hall_wrap > .hall > .name {
font-family: "A1明朝", A1 Mincho;
margin: 0 5% 0.9em 5%;
font-size: 1.5em;
}
.hall_wrap > .hall > .place {
margin: 0 5%;
}
.hall_wrap > .hall > .free_tel {
font-family: "A1明朝", A1 Mincho;
margin: 0 5% 0.5em 5%;
padding: 0 0 0 33px;
position: relative;
font-size: 1.4em;
}
.hall_wrap > .hall > .free_tel::before {
content: "";
position: absolute;
display: block;
width: 25px;
height: 19px;
background: url(../img/free.png) no-repeat center left;
background-size: 25px auto;
top: 11px;
left: 0;
}
.hall_wrap > .hall > .telfax {
margin: 0 5% 2em 5%;
}
/*----------------------------------------------------
point
----------------------------------------------------*/
.point {
width: 90%;
margin: 60px 5% 20px 5%;
}
.point > ul > li {
padding: 90px 10% 25px 10%;
}
.point > ul > li:nth-child(1) {
background: #FFF url(../img/point_01.png) no-repeat center top 30px;
background-size: 35px auto;
}
.point > ul > li:nth-child(2) {
background: #FFF url(../img/point_02.png) no-repeat center top 30px;
background-size: 35px auto;
}
.point > ul > li:nth-child(3) {
background: #FFF url(../img/point_03.png) no-repeat center top 30px;
background-size: 35px auto;
}
.point > ul > li:nth-child(4) {
background: #FFF url(../img/point_04.png) no-repeat center top 30px;
background-size: 35px auto;
}
.point > ul > li:nth-child(5) {
background: #FFF url(../img/point_05.png) no-repeat center top 30px;
background-size: 35px auto;
}
.point > ul > li > h4 {
font-family: "A1明朝", A1 Mincho;
margin: 0 0 1.5em 0;
text-align: center;
font-size: 1.2em;
}
.point > ul > li > p {
font-size: 0.9em;
text-align:justify;
text-justify:inter-ideograph;
}

/*----------------------------------------------------
sumire club
----------------------------------------------------*/
.sumireclub > a {
display: block;
width: 80%;
margin: 60px 10% 20px 10%;
padding: 30px 7%;
background: #FFF;
outline: #FFF solid 5px;
outline-offset: -5px;
transition: all 0.2s;
}
.sumireclub > a:hover {
outline: #efb1fe solid 10px;
outline-offset: -10px;
}

/*----------------------------------------------------
news
----------------------------------------------------*/
.news {
width: 90%;
margin: 0 5%;
padding: 30px 0 15px 0;
}
.news > ul > li {
margin: 0 0 20px 0;
padding: 0 0 20px 0;
border-bottom: #ADADAD dotted 1px;
}
.news > ul > li:last-child {
border-bottom: none;
}
.news > ul > li::after {
content: '';
display: table;
clear: both;
}
.news > ul > li > h4 {
margin: 0 0 0.5em 0;
font-size: 1.1em;
}
.news > ul > li > h4 > span.end {
display: inline-block;
margin: 0 0.5em 0 0;
padding: 0.2em 0.5em;
font-size: 0.9em;
font-weight: normal;
background: #F95739;
color: #FFF;
}
.news > ul > li > h4 > a {
color: #9f00c7;
text-decoration: underline;
}
.news > ul > li > h4 > a:hover {
text-decoration: none;
}
.news > ul > li > .thumnail {
width: 30%;
margin: 0 5% 10px 0;
float: left;
}
/*----------------------------------------------------
voice

.voice {
width: 90%;
margin: 0 5%;
padding: 30px 0;
}
.voice > ul::after {
content: '';
display: table;
clear: both;
}
.voice > ul > li {
width: 47%;
margin: 0 1.5% 20px 1.5%;
float: left;
}
.voice > ul > li > a {
display: block;
}
.voice > ul > li > a:hover {
text-decoration: underline;
}
.voice > ul > li > a > .thumnail {
width: 100%;
margin: 0 0 5px 0;
overflow: hidden;
transition: all 0.3s;
}
.voice > ul > li > a > .thumnail > img {
transition-duration: 0.3s;
}
.voice > ul > li > a > .thumnail:hover > img {
transform: scale(1.1);
transition-duration: 0.3s;
}

.voice > ul > li > a > .text > h4 {
font-size: 0.8em;
}
----------------------------------------------------*/
.voice {
width: 90%;
margin: 0 5%;
padding: 30px 0;
}
.voice > ul::after {
content: '';
display: table;
clear: both;
}
.voice > ul > li {
width: 47%;
margin: 0 1.5% 15px 1.5%;
float: left;
}
.voice > ul > li > a {
display: block;
padding: 0.8em 0 0.8em 15px;
background: url(../img/arrow_s.png) no-repeat right 10px center;
background-size: 12px auto;
border: #e1e1e1 solid 2px;
transition: all 0.4s;
}
.voice > ul > li > a:hover {
color: #FFF;
background: #9f00c7 url(../img/arrow_s_w.png) no-repeat right 10px center;
background-size: 12px auto;
}

.sp-br {display: inherit;}	


@media print, screen and (min-width:540px){
/*----------------------------------------------------
slideshow
----------------------------------------------------*/
	.cb-slideshow-sp {
		display: none;
	}
	.cb-slideshow {
		display: inherit;
	}
	
.cb-slideshow,
.cb-slideshow:after {
position: relative;
width: 100%;
height: 530px;
margin: 0;
top: 0px;
left: 0px;
z-index: 0;
}
.cb-slideshow > li > span {
width: 100%;
height: 530px;
position: absolute;
top: 0px;
left: 0px;
color: transparent;
background-size: 150% auto;
background-position: 50% 50%;
background-repeat: no-repeat;
z-index: 0;
}
.cb-slideshow > li:nth-child(1) > span {
background-image: url(../img/slide/001.jpg);
animation: fadeSlide01 0s ease-out infinite;
animation-delay: 3s;
}
.cb-slideshow > li:nth-child(2) > span {
opacity: 0;
background-image:  url(../img/slide/002.jpg);
animation: fadeSlide02 30s ease-out infinite;
animation-delay: 3s;
}
.cb-slideshow > li:nth-child(3) > span {
opacity: 0;
background-image:  url(../img/slide/003.jpg);
animation: fadeSlide03 30s ease-out infinite;
animation-delay: 3s;
}
.cb-slideshow > li:nth-child(4) > span {
opacity: 0;
background-image:  url(../img/slide/004-sp.jpg);
animation: fadeSlide04 30s ease-out infinite;
animation-delay: 3s;
}
	
.sp-br {display: none;}	
}
	



/*-------------------------------------------------------------------------------------------------------------- 768 ---*/
@media print, screen and (min-width:768px){
/*----------------------------------------------------
main image

.main_image {
display: block;

height: 530px;
}
.main_image > .copy {
width: 60%;
margin: 0 20%;
padding: 70px 5% 50px 5%;
top: 100px;
}
.main_image > .copy > p {
font-size: 0.9em;
}
----------------------------------------------------*/

/*----------------------------------------------------
コロナ対策
----------------------------------------------------*/
.covic {
width: 92.5%;
margin: 60px 3.75% 30px 3.75%;
}
	
/*----------------------------------------------------
コロナ対策下のバナー
----------------------------------------------------*/
.t-bn {
	width: 800px;
}


/*----------------------------------------------------
slideshow
----------------------------------------------------*/
	.cb-slideshow-sp {
		display: none;
	}
	.cb-slideshow {
		display: inherit;
	}
	
.cb-slideshow,
.cb-slideshow:after {
position: relative;
width: 100%;
height: 530px;
margin: 0;
top: 0px;
left: 0px;
z-index: 0;
}
.cb-slideshow > li > span {
width: 100%;
height: 530px;
position: absolute;
top: 0px;
left: 0px;
color: transparent;
background-size: 150% auto;
background-position: 50% 50%;
background-repeat: no-repeat;
z-index: 0;
}
.cb-slideshow > li:nth-child(1) > span {
background-image: url(../img/slide/001.jpg);
animation: fadeSlide01 0s ease-out infinite;
animation-delay: 3s;
}
.cb-slideshow > li:nth-child(2) > span {
opacity: 0;
background-image:  url(../img/slide/002.jpg);
animation: fadeSlide02 30s ease-out infinite;
animation-delay: 3s;
}
.cb-slideshow > li:nth-child(3) > span {
opacity: 0;
background-image:  url(../img/slide/003.jpg);
animation: fadeSlide03 30s ease-out infinite;
animation-delay: 3s;
}
.cb-slideshow > li:nth-child(4) > span {
opacity: 0;
background-image:  url(../img/slide/004-sp.jpg);
animation: fadeSlide04 30s ease-out infinite;
animation-delay: 3s;
}
/*----------------------------------------------------
事前相談・お急ぎの方
----------------------------------------------------*/
.select {
width: 95%;
margin: 0 2.5%;
padding: 30px 0;
}
.select::after {
content: '';
display: table;
clear: both;
}
.select > a {
width: 47.5%;
margin: 0 1.25% 30px 1.25%;
padding: 60px 5%;
float: left;
background: #FFF url(../img/arrow_l.png) no-repeat right 25px bottom 25px;
background-size: 30px auto;
}
/*----------------------------------------------------
式場のご案内
----------------------------------------------------*/
.hall_wrap > .hall {
width: 90%;
margin: 0 5% 60px 5%;
}
/*----------------------------------------------------
sumire club
----------------------------------------------------*/
/*----------------------------------------------------
sumire club
----------------------------------------------------*/
.sumireclub > a {
width: 50%;
margin: 60px 25% 20px 25%;
}
/*----------------------------------------------------
news
----------------------------------------------------*/
.news > ul > li {
width: 90%;
margin: 0 5% 30px 5%;
padding: 0 0 30px 0;
border-bottom: #ADADAD dotted 1px;
}

/*----------------------------------------------------
voice

.voice > ul > li {
width: 42.5%;
margin: 0 3.75% 30px 3.75%;
}
.voice > ul > li > a > .thumnail {
margin: 0 0 10px 0;
}
.voice > ul > li > a > .text > h4 {
font-size: 0.9em;
}
----------------------------------------------------*/
.voice > ul {
width: 90%;
margin: 0 5%;
}


}

@keyframes fadeSlide01 {
0% { opacity: 1; }
25% { opacity: 0; }
50% { opacity: 0; }
75% { opacity: 0; }
100% { opacity: 1; }
}
@keyframes fadeSlide02 {
0% { opacity: 0; }
25% { opacity: 1; }
50% { opacity: 0; }
75% { opacity: 0; }
100% { opacity: 0; }
}
@keyframes fadeSlide03 {
0% { opacity: 0; }
25% { opacity: 0; }
50% { opacity: 1; }
75% { opacity: 0; }
100% { opacity: 0; }
}
@keyframes fadeSlide04 {
0% { opacity: 0; }
25% { opacity: 0; }
50% { opacity: 0; }
75% { opacity: 1; }
100% { opacity: 0; }
}

/*-------------------------------------------------------------------------------------------------------------- 1024 ---*/
@media print, screen and (min-width:1024px){

/*----------------------------------------------------
main image

.main_image {
height: 625px;
padding: 200px 0 0 0;
background: url(../img/maincopy_bg.jpg) no-repeat top center;
background-size: auto 100%;
}
.main_image > .copy {
position: static;
width: 680px;
margin: 0 auto;
padding: 70px 90px 50px 90px;
top: 0;
}
----------------------------------------------------*/
/*----------------------------------------------------
slideshow
----------------------------------------------------*/
.cb-slideshow,
.cb-slideshow:after {
max-width: 1500px;
height: 625px;
margin: 0 auto;
}
.cb-slideshow > li > span {
max-width: 1500px;
height: 625px;
background-size: auto 100%;
background-position: center bottom 0;
}
.cb-slideshow > li:nth-child(4) > span {
opacity: 0;
background-image:  url(../img/slide/004.jpg);
animation: fadeSlide04 15s ease-out infinite;
animation-delay: 3s;
}

/*----------------------------------------------------
コロナ対策
----------------------------------------------------*/
.covic {
max-width: 1500px;
margin: 60px auto 30px auto;
}

/*----------------------------------------------------
事前相談・お急ぎの方
----------------------------------------------------*/
.select {
max-width: 1500px;
margin: 0 auto;
}
.select > a {
width: 48%;
margin: 0 0 60px 0;
padding: 60px 10%;
}
.select > a.jizen {
float: right;
}
.select > a > .title {
margin:  0 0 40px 0;
font-size: 2em;
}
.select > a > .title::after {
width: 80%;
height: 20px;
margin: 0 10%;
}
/*----------------------------------------------------
式場のご案内
----------------------------------------------------*/
.hall_wrap {
display: flex;
flex-wrap:wrap;
justify-content:space-between;
width: 90%;
margin: 0 auto;
padding: 0 0 20px 0;
background: none;
}
.hall_wrap > .hall {
width: 48%;
margin: 0 0 60px 0;
padding: 0 0 5px 0;
background: #FFF;
}
/*----------------------------------------------------
point
----------------------------------------------------*/
.point {
width: 95%;
max-width: 1500px;
margin: 120px auto 20px auto;
}
.point::after {
content: '';
display: table;
clear: both;
}
.point > ul > li {
width: 50%;
padding: 90px 5% 25px 5%;
float: left;
}
.point > ul > li > h4 {
font-size: 1.4em;
}
.point > ul > li:nth-child(5) {
width: 100%;
padding: 120px 25% 50px 25%;
background: #FFF url(../img/point_05.png) no-repeat center top 60px;
background-size: 35px auto;
}
/*----------------------------------------------------
sumire club
----------------------------------------------------*/
.sumireclub > a > img {
display: none;
}
.sumireclub > a {
width: 1100px;
height: 200px;
margin: 60px auto 40px auto;
background:#FFF url(../img/sumire.png) no-repeat center center;
background-size: 90% auto;
}
/*----------------------------------------------------
topics / news / voice
----------------------------------------------------*/
.topics {
width: 95%;
margin: 0 auto;
}
.topics::after {
content: '';
display: table;
clear: both;
}
.news {
width: 48%;
margin: 0;
padding: 30px 0 15px 0;
float: left;
}
.news > ul > li:last-child {
padding: 0;
}
.voice {
width: 48%;
margin: 0;
padding: 30px 0;
float: right;
}
.voice > ul > li {
width: 100%;
margin: 0 0 15px 0;
}
.voice > ul > li > a {
border: #e1e1e1 solid 4px;
}
}

/*-------------------------------------------------------------------------------------------------------------- 1300 ---*/
@media print, screen and (min-width:1300px){
/*----------------------------------------------------
point
----------------------------------------------------*/
.point > ul > li {
width: 33.333%;
padding: 120px 3% 60px 3%;
}
.point > ul > li:nth-child(1) {
background: #FFF url(../img/point_01.png) no-repeat center top 65px;
background-size: 35px auto;
}
.point > ul > li:nth-child(2) {
background: #FFF url(../img/point_02.png) no-repeat center top 65px;
background-size: 35px auto;
}
.point > ul > li:nth-child(3) {
background: #FFF url(../img/point_03.png) no-repeat center top 65px;
background-size: 35px auto;
}
.point > ul > li:nth-child(4) {
width: 50%;
padding: 70px 5% 60px 18%;
background: #FFF url(../img/point_04.png) no-repeat left 63% top 15px;
background-size: 35px auto;
}
.point > ul > li:nth-child(5) {
width: 50%;
padding: 70px 18% 60px 5%;
background: #FFF url(../img/point_05.png) no-repeat right 63% top 15px;
background-size: 35px auto;
}
/*----------------------------------------------------
topics
----------------------------------------------------*/
.topics {
width: 1300px;
margin: 30px auto 60px auto;
}
}
/*-------------------------------------------------------------------------------------------------------------- 1500 ---*/
@media print, screen and (min-width:1500px){
/*----------------------------------------------------
式場のご案内
----------------------------------------------------*/
.hall_wrap {
width: 1500px;
}
.hall_wrap > .hall {
width: 24%;
}
.hall_wrap > .hall > .link {
width: 90%;
margin: 0 auto 30px auto;
}
}