@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; 
	z-index:9999; 
	top:0; 
	left:0;
	right:0;
	bottom:0;
	width:100%;
	max-width:400px; 
	aspect-ratio: 4 / 6 ;
	margin:auto; 
	padding:0; 
	text-align:center;
	display: none;
}
.modal_wrap {
	width:100%;
	max-width:400px;
	aspect-ratio: 4 / 6 ;
	box-shadow:0 0 20px rgba(171,0,0,0.3);
	background:url("../img/check.avif") center top no-repeat;
	background-size: cover;
	background-color:#FFF;
	position:relative;
}
a.box em {
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	transform: rotate(0.03deg);
	font-weight: 700!important;
	font-size: 2.5rem;
	font-style: normal;
}
a.box span {
	font-family: "Noto Sans JP", sans-serif;
		font-optical-sizing: auto;
		font-style: normal;
		transform: rotate(0.03deg);
		font-weight: 400!important;
	font-size:1.5rem;
}

.b_left {width:50%;aspect-ratio:20 / 8;position:absolute; bottom:0; left:0; }
.b_right {width:50%;aspect-ratio:20 / 8;position:absolute; bottom:0; right:0; }

.b_left a {display: flex; flex-direction: column;justify-content: center;width: 100%;aspect-ratio:20 / 8; visibility: visible; opacity: 1; color:#fff;background-color:#ab0000; text-decoration:none;}
.b_right a {display: flex; flex-direction: column;justify-content: center;width: 100%;aspect-ratio:20 / 8; visibility: visible; opacity: 1; color:#bfbfbf;background-color:#717f87; text-decoration:none;}

.b_left a:hover {background-color:#FF5B82; text-decoration:none;}
.b_right a:hover {background-color:#414c52; 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%;
}