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

/*==================================
	common
==================================*/
body { font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI semibold", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic", "Segoe UI", Verdana, Meiryo, sans-serif; color: #000; font-feature-settings: "palt"; margin: 0;}
body a { text-decoration: none; outline: none !important; color: #000; -webkit-transition:0.8s; -moz-transition:0.8s; -ms-transition:0.8s; -o-transition:0.8s; transition:0.8s; background-color: transparent;}
body a:hover { opacity:0.6;}
body a:active,
body a:hover { outline: 0;}
p { margin: 0; padding: 0; display: block;}
#contents { max-width: 650px; margin: 0 auto; width: 100%;overflow: hidden;background: #FFF;box-shadow: 6px 0px 5px -5px rgb(195 190 166 / 50%), -6px 0px 5px -5px rgb(195 190 166 / 50%);}
img { width: 100%; border: 0; vertical-align: bottom;}
#pcBg { position: fixed; background: url(../img/pc_bg.webp) #f8f3ec; background-repeat: no-repeat; background-position: center top; width: 100%; height: 100%; z-index: -1;}
dl,dt,dd,ul,li { margin: 0; padding: 0;}
*,
*:before,
*:after{ -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;
 }

/* floating */
#floating { position: fixed; bottom: 1%; left: 0; right: 0; margin: auto; max-width: 650px; z-index: 100; display: none;}
#floating a { position: absolute; z-index: 110; bottom: 0; left: 0; width: 100%; height: 100%;}
#floating .floatingbtn { width: 91.73%; display: inline-block; position: relative; bottom: 0; left: 4.135%; z-index: 1;}
#floating .floatingbtn img { width: 100%;}

/* cvArea */
.cvArea { position: relative;}
.cvArea .btnCont { position: absolute; top: 5%;}
.cvArea .ctaBtn { width: 98%; transition: .6s; margin: 0 auto 80px; display: block;}
.cvArea .ctaBtn:hover { opacity: .6;}
.cvArea .btnCont { margin: 0 auto;}
.cvArea .btnCont img { animation: anime1 0.75s ease 0s infinite alternate; transform-origin:center;}
@keyframes anime1 {
  from { transform: scale(0.95,0.95);}
  to { transform: scale(1.05,1.05);}
}

/* fadein */
.fadein { opacity : 0.1; transform : translate(0, 50px); transition : all 500ms;}
.fadein.scrollin { opacity : 1; transform : translate(0, 0);}

/*==================================
	contents
==================================*/

/* intro */
#intro .intro03Box { position: relative;}
#intro .intro03Box .slideshowArea { position: absolute; top: 0; left: 0; width: 100%;}
/* slide css */
#intro .intro03Box .slideshowArea { display: flex;  align-items: center; overflow: hidden; height: 59.07vw;}
#intro .intro03Box .slideshowArea .slideshow { display: flex; animation: loop-slide 40s infinite linear 1s both;}
#intro .intro03Box .slideshowArea li { width: 57.69vw; height: 59.07vw; margin:0; list-style-type: none;}
#intro .intro03Box .slideshowArea li.img02 { width: 49.69vw;}
#intro .intro03Box .slideshowArea li.img04 { width: 55.07vw;}
#intro .intro03Box .slideshowArea li img { width: 100%;}
@keyframes loop-slide {
  from { transform: translateX(0);}
  to { transform: translateX(-100%);}
}
@media screen and (min-width: 650px) {
#intro .intro03Box .slideshowArea { height: 384px;}
#intro .intro03Box .slideshowArea li { width: 375px; height: 384px;}
#intro .intro03Box .slideshowArea li.img02 { width: 323px;}
#intro .intro03Box .slideshowArea li.img04 { width: 358px;}
}

/* point01 */
#point01 .before,
#point01 .after { position: absolute; width: 100%; bottom: 0; padding-top: 60%;}
#point01 .pharea { position: absolute;}
#point01 .no,
#point01 .tit { z-index: 5; position: absolute;}
#point01 .slide01 { position: relative;}
#point01 .slide01 .no { width: 21.46%; top: 0; left: 6%;}
#point01 .slide01 .tit { width: 63.2%; bottom: 12.7%; right: 4%;}
#point01 .slide01 .pharea { width: 89.33%; left: 0; bottom: 33%;}
#point01 .slide01 .pharea .before { background: url("../img/point01_slide01_before.webp") left top no-repeat; background-size: auto 100%;}
#point01 .slide01 .pharea .after { background: url("../img/point01_slide01_after.webp") left top no-repeat; background-size: auto 100%;width: 0;}
#point01 .slide02 { position: relative;}
#point01 .slide02 .no { width: 22.4%; top: 0; right: 5%;}
#point01 .slide02 .tit { width: 75.06%; bottom: 12.7%; left: 3%;}
#point01 .slide02 .pharea { width: 89.33%; right: 0; bottom: 35%;}
#point01 .slide02 .pharea .before { background: url("../img/point01_slide02_before.webp") left top no-repeat; background-size: auto 100%;}
#point01 .slide02 .pharea .after { background: url("../img/point01_slide02_after.webp") left top no-repeat; background-size: auto 100%;width: 0;}
#point01 .slide03 { position: relative;}
#point01 .slide03 .no { width: 21.86%; top: 0; left: 6%;}
#point01 .slide03 .tit { width: 84.26%; bottom: 12.7%; right: 4%;}
#point01 .slide03 .pharea { width: 89.33%; left: 0; bottom: 36%;}
#point01 .slide03 .pharea .before { background: url("../img/point01_slide03_before.webp") left top no-repeat; background-size: auto 100%;}
#point01 .slide03 .pharea .after { background: url("../img/point01_slide03_after.webp") left top no-repeat; background-size: auto 100%;width: 0;}
#point01 .slide04 { position: relative;}
#point01 .slide04 .no { width: 22.93%; top: 0; right: 5.5%;}
#point01 .slide04 .tit { width: 66.53%; bottom: 5.2%; left: 4.5%;}
#point01 .slide04 .pharea { width: 89.33%; right: 0; bottom: 30%;}
#point01 .slide04 .pharea .before { background: url("../img/point01_slide04_before.webp") left top no-repeat; background-size: auto 100%;}
#point01 .slide04 .pharea .after { background: url("../img/point01_slide04_after.webp") left top no-repeat; background-size: auto 100%;width: 0;}

/* point02 */
#point02 a { display: block; cursor: pointer;}
#point02 .cont { text-align: center;}
#point02 .cont .top_close { width: 100%; padding: 5%; text-align: right;}
#point02 .cont .top_close img { max-width: 59px; width: 9.2vw;}
#point02 .cont .btm_close { max-width: 246px; width: 37.6vw; margin-top: 16%; padding-bottom: 5%;}
#point02 .cont .tit { margin: 0 auto;}
#point02 .cont .img { width: 68vw; max-width: 442px; margin: 10% auto 6.13% auto;}
#point02 .cont .txt { width: 68vw; max-width: 442px; margin: 0 auto;}
#point02 .chapel { padding-bottom: 15.86%; background: #fbf7ef;}
#point02 .chapel .modal_btn02 { margin-top: 8.66%;}
#point02 .chapel .modal_btn03 { margin-top: 9.33%;}
#point02 .chapel .modal_btn04 { margin-top: 16.4%;}
#point02 .chapel .modal_btn05 { margin-top: 9.06%;}
#point02 .chapel .modal_btn06 { margin-top: 14.4%;}
#point02 .banquet { padding-bottom: 18.66%; background: #ece5d7;}
#point02 .banquet .modal_btn07 { margin-top: 8.13%;}
#point02 .banquet .modal_btn08 { margin-top: 12.66%;}
#point02 .banquet .modal_btn09 { margin-top: 16.66%;}
#point02 .chapel .modal_cont02 .tit { width: 53.46vw; max-width: 348px;}
#point02 .chapel .modal_cont03 .tit { width: 54.46vw; max-width: 354px;}
#point02 .chapel .modal_cont04 .tit { width: 59.23vw; max-width: 385px;}
#point02 .chapel .modal_cont05 .tit { width: 14.15vw; max-width: 92px;}
#point02 .chapel .modal_cont06 .tit { width: 50.61vw; max-width: 329px;}
#point02 .banquet .modal_cont07 .tit { width: 38.46vw; max-width: 250px;}
#point02 .banquet .modal_cont08 .tit { width: 33.23vw; max-width: 216px;}
#point02 .banquet .modal_cont09 .tit { width: 33.23vw; max-width: 216px;}
/* modal動作 */
.mask { display: none; transition: all .5s;}
.modal_open .mask { display: block; position: fixed; top: 0; right: 0; width: 100%; height: 100%; background: #000; opacity: .3; z-index: 150;}
[class^="modal_cont"] { position: fixed; top: 0; right: -560px; width: 560px; height: 100%; background: #fbf7ef; z-index: 1000; transition: right 0.4s ease; overflow-y: auto; box-sizing: border-box;}
[class^="modal_cont"].active { right: 0;}
#point02 .modal_close { display: inline-block; cursor: pointer;}
@media screen and (max-width: 650px) {
[class^="modal_cont"] { right: -92%; width: 92%;}
}

/* compare */
#compare .scrollArea { position: relative;}
#compare .scroll { display: flex; width: 100%; position: absolute; left: 0; top: 0;}
#compare .scroll .tit { width: 30.26%;}
#compare .scroll .table { width: 69.73%;}
#compare .scroll .table img { width: 178.77%;}

/*==================================
	footer
==================================*/
footer { background-color: #222; color: #fff; background: url("../img/ft_bg.webp") top center no-repeat; background-size: 100% auto;}
footer .nolink { pointer-events: none; display: inline-block; color: #fff;}
footer .jp { font-family: "Shippori Mincho", serif; font-weight: 500; font-style: normal;}
footer .en { font-family: "Libre Caslon Display", serif; font-weight: 400; font-style: normal;}
footer .logo { padding-top: 10%; text-align: center;}
footer .logo img { width: 13.2vw; max-width: 86px;}
footer .mapArea { padding: 5% 5% 4% 5%;}
footer .mapArea .map { position: relative; width: 100%; padding-top: 42.85%; height: 0; border-radius: 7px; overflow: hidden;}
footer .mapArea .map iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
footer .info { padding: 0 5%; line-height: 1.3;}
footer .info dt { font-size: 22px; margin-top: 4%; margin-bottom: 1%; letter-spacing: 0.1em;}
footer .info dd { font-size: 24px; letter-spacing: 0.05em;}
footer .txt { padding: 9% 3% 0 3%;}
footer .btmber { padding: 3% 4% 4% 4%; display: flex; justify-content: space-between;}
footer .btmber .ftLink { display: flex;}
footer .btmber .ftLink li { list-style:none;}
footer .btmber .ftLink li:nth-child(1) { width: 13.6vw; max-width: 89px; margin-right: 20px;}
footer .btmber .ftLink li:nth-child(2) { width: 20.26vw; max-width: 133px;}
footer .btmber .ftLink li a { display: inline-block; color: #fff;}
footer .btmber .copyArea { width: 42.13vw; max-width: 275px;}
@media screen and (max-width: 650px) {
footer .info dt { font-size: 3.38vw;}
footer .info dd { font-size: 3.69vw;}
}