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


/* 基礎 */

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

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:40%; left:50%; width:400px; height:600px; margin:-250px 0 0 -200px; padding:0; text-align:center; }
.modal_wrap {width:400px;
height:600px;
	box-shadow:0 0 20px rgba(230,42,138,0.7);
background:url(../img/check.webp) center top no-repeat;
background-color:#000;
background-size:100%;
position:relative;}
.modal a.box {width:200px;height:80px;display:table-cell; vertical-align:middle; transition:all 0.3s;}
a.box em {font-family: "Noto Serif JP", serif;  font-optical-sizing: auto;  font-weight: 700;  font-style: normal;font-size: 2.5rem;}
a.box span {font-family: "Noto Serif JP", serif;  font-optical-sizing: auto;  font-weight: 700;  font-style: normal;font-size: 1.5rem;}
.b_left {width:200px;height:80px;position:absolute; bottom:0; left:0; }
.b_right {width:200px;height:80px;position:absolute; bottom:0; right:0; }

.b_left a {display: block; visibility: visible; opacity: 1; color:#fff;background-color:#e62a8a; text-decoration:none;}
.b_right a {display: block; visibility: visible; opacity: 1; color:#bfbfbf;background-color:#571d81; text-decoration:none;}
.b_left a:hover {background-color:#FF75BB; text-decoration:none;}
.b_right a:hover {background-color:#A762D9; text-decoration:none;}
.modal a { cursor:pointer; }
/*ルミナス*/

.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%;
}