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


/* 基礎 */

html,body {
	height:100%;
/*	scroll-padding-top: 140px;*/
	scroll-behavior: smooth;
}

html {
	font-size:62.5%;
}

img {
	max-width: 100%;
	height: auto;	
}

@media screen and (min-width:1025px) {
	.sp{
		display: none;
	}
}
@media screen and (max-width:1024px) {
	.pc{
		display: none;
	}
}

/* ----------------------------------　モーダル入口　---------------------------------- */

.modal { position:fixed; display:none; z-index:9999; top:0; left:0; right: 0; bottom: 0; width:100%; max-width: 800px; margin:200px auto 0; padding:0; text-align:center; }
.modal_wrap {width:100%;
	max-width: 800px;
	aspect-ratio:80 / 54;
background:url(../img/check.png) center top no-repeat;
background-size:100%;
position:relative;
display: flex;
justify-content: center;
align-items: flex-end;
gap:7.5%;}
.b_left {width: 19.12%; max-width:153px; background:url(../img/check_y.png) center top no-repeat; background-size: contain; position:relative; margin-bottom:7.5%; }
.b_right {width: 19.12%; max-width:153px; background:url(../img/check_n.png) center top no-repeat; background-size: contain; position:relative; margin-bottom:7.5%; }
.modal a.sbox {width: 100%; display:table-cell; vertical-align:middle; transition:all 0.3s;}

.b_left a {display: block; visibility: visible; opacity: 1; text-decoration:none;}
.b_right a {display: block; visibility: visible; opacity: 1; text-decoration:none;}
.modal a { cursor:pointer; }

/*INVIEW*/

.inv {opacity: 0; transition:0.7s; transform:translate(0,20px); }
.vie {opacity: 1.0; transform:translate(0);}

/*ルミナス*/

.lum-lightbox{
  z-index: 999;
}

@media (max-width: 460px) {

  .lum-lightbox-inner img {
    max-width: 150vw;  /* 好きなサイズ感で */
    max-height: 88vh;  /* 90vhだと数pxだけ上下にスクロールできてしまうためこのサイズ */
   /* display: block;  を追加すると max-height: 92vh くらいでも大丈夫 */
  }

　 /* 矢印ナビが大きすぎると感じたら */
  .lum-gallery-button:after {
    width: 6vw;
    height: 6vw;
  }
}

.lum-lightbox-inner img.lum-img {
  max-width: 100%;
}