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

/* このページ専用css
――――――――――――――――――――――――― */
.categoryTitle { padding: 6rem 0 3rem 0;}
.categoryTitle p {
	width:auto;
	min-width:200px;
}
html{	scroll-behavior: smooth;}
#topMenu {
	text-align: center;
	display: flex;
	justify-content: space-around;
	align-items: stretch;
	max-width: 1000px;
	height: auto;
	max-height: 200px;
	min-height: 146px;
}	
	#topMenu .btn .main { text-align: center; line-height: 1.2;}
	#topMenu .btn .sub { text-align: center; line-height: 1.2; word-break: break-all; width: 100%;}
	#topMenu .btn1 { flex-direction: column; }
	#topMenu .btn1 .main { font-size:1.2rem; margin-bottom: 0.2rem; word-break: break-all; width: 100%; }
	#topMenu .btn1 .main br { display: block;}
	
	#topMenu .btn {
		padding:2.5rem 1rem 3.5rem;
	}
	#topMenu .btn:after {
		content:"\f078";
		font-family: FontAwesome;
		position:absolute;
		bottom:2px;
		font-size: 2rem;
		left: 41%;
	}

.supportTitle {
	display: flex;
	text-align: center;
	font-family: "Rounded Mplus 1c";
	font-weight: 300;
	font-size: 2.2rem;
	color: #555;
	padding: 4rem 0 1rem 0;
	margin: 0 auto;
	justify-content: center;
	border-bottom: 1px solid #aaa;
	margin-bottom: 1rem;
}

.sp{display: none;}
.pc{display: block;}
/* メールでの問い合わせ
――――――――――――――――――――――――― */
#mailMenu {
	display: flex;
	justify-content: center;
}
	#mailMenu .btn {
		margin: 1rem 0.5rem;
		width: 40%;
		min-height: 5rem;
		padding:0 2rem;
	}
	#mailMenu .btn:after {
		display: block;
		content:"\f054";
		font-family: FontAwesome;
		position:absolute;
		right:5px;
		font-size: 1.5rem;
		text-align: center;
		bottom: 33%;
	}
	#mailMenu .btn br { display: none;}
	.mailCaution {
		border: 1px dotted #aaa;
		padding: 1rem;	
		line-height: 1.5rem;
		margin-top: 1.2rem;
	}
	.mailCaution .title {
		color:#d10000;
	}
	.btnSecond { background-color: #4b87a5;}
	
	.maxW2 { width: 61%!important; max-width: 818px!important;}

/* 電話での問い合わせ
――――――――――――――――――――――――― */
#telInfo {
	text-align:center;
}
.telCaution {
	text-align: left;
	line-height: 1.8;
	padding: 1rem 0 3rem;
	display: block;
	width: auto;
}
	.telCaution2 {
		display:block;
		padding: 3rem 0;
	}

.telWrapper {
	display: flex;
	justify-content: center;
}
	.telIcon {
		font-size: 4.7rem;
		padding-right: 0;
		margin-top:10px;
	}
	.telIcon img{
	width:50%;	
	}
	
	.telTxt {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.telTxt .txt1{ font-size: 1.2rem; }
	.telTxt .txt2{
		font-size: 3rem;
		font-weight: bold;
	}

.telTime > span{
	display: block;
    text-indent: -5rem;
    padding-left: 5rem;
	line-height: 1.4rem;
}


/* ゲームソフトについてのお問い合わせ
――――――――――――――――――――――――― */
#gameSoft {
	max-width:450px;
}
	.game_Q_title {
		font-size: 1.2rem;
	}
	.game_info_txt {
		line-height: 1.6;
		border: 1px dotted #aaa;
		padding: 1rem;
		margin: 0.5rem auto;
	}
	
.goOmochaForm_wrap {
	text-align:center;
}

.omocyaImg {
	display: block;
	border: 1px solid #aaa;
	border-radius: 20px;
	padding: 1rem 4rem;
	max-width: 450px;
	margin: auto;
	margin-top: 2rem;
	display: flex;
	justify-items: center;
	align-items: center;
}
	.omocyaImg img {
		width:100%;
		max-width:594px;
	}
	
	.goOmochaForm_wrap .omocyaImg:after {
		content:"\f054";
		font-family: FontAwesome;
		position:absolute;
		right:5px;
		font-size: 2.5rem;
		color:#b2b2b2;
	}


/* お知らせ
――――――――――――――――――――――――― */
.osiraseList {
	list-style:none;
}
	.osiraseList li {
		line-height: 1.7rem;
	}
	.osiraseList a {
		color: #0075ae;
	}

#social-icon > div { margin: 5% auto 2%; }

/*カレンダー*/
	.calendar{
		width: 100%;
    	max-width: 900px;
    	margin: 5rem auto 0;
	}
	.calenderTitle	{
		display: block;
    margin: 0 auto 1rem;
    text-align: center;
    font-size: 1.4rem;
	}
	
	.dayBox .doweek {
	display: inline-block;
	width: 14.2%;
    max-width: 150px;
    height: 30px;
    background-color: #b1b1b1;
    color: #fff;
    border-right: #fff 1px solid;
	border-bottom: #fff 1px solid;
    padding: 8px;
    font-size: 80%;
    font-weight: bold;
    text-align: center;
}

	.dayBox .daynunber {
	display: inline-block;
	width: 14.2%;
    max-width: 150px;
    height: 55px;
    background-color: #fff;
    color: #000;
    border-right: #888888 1px solid;
	border-bottom: #888888 1px solid;
    padding: 4px 8px 6px ;
    font-size: 80%;
    font-weight: bold;
    text-align: center;
		line-height: 1.5rem;
	vertical-align: top;
	}
	.dayBox .daynunber:first-child {  border-left: #888888 1px solid;}
	
	.dayBoxtext{ max-width:1020px; margin: 2rem 0.7rem 0 6rem ;
    line-height: 1.5rem;}
	.vacationC { background-color: #00B0F0!important; color: #fff!important;}	
	
/*サンタさんからのお知らせ*/
	.st_msg{
		display: block; 
		width:100%;
		max-width: 900px;
		margin:5vh auto 0 auto;  
		background-color: #fff; /* 背景色 */
		background-size: contain;
		border-width: 2px;	
		border-style: solid;		
 		border-color: darkgray;
		}


	.xmasbg{background-image: url("../img/2025xmas_bg.jpg");
background-size: cover;}
	
	 .newyearbg{background-image: url("../img/2026nw_bg.jpg");
background-size: cover;}

	.bg{
		width:100%;	
		z-index: 100;
		margin-bottom: -0.5vh;
		}

.bg_ny{}

.st_padd{margin-top: -6vh;}

.linkbnr{
	width:90%;
	max-width:7640px;
	margin: 0 auto;
	display: block;
	text-align: center;
}

.linkbnr img{
	width:100%;
	max-width:640px;
	margin:0 auto;
}

.st_inner{
/*	background-image: -webkit-linear-gradient(#ccc 1px, transparent 1px);
	background-image: -o-linear-gradient(#ccc 1px, transparent 1px);
	background-image: linear-gradient(#ccc 1px, transparent 1px); /* 罫線の色と太さ  */
	background-size: 100% 2.5em;
	line-height: 2.5em;
	padding-bottom: 1px;
	padding:0 6%;
		}
	
.st_msg h2{
	color:#666666;
	margin:-3vw auto 0 auto;
	font-size: 2.4em;
	text-align: center; 
	font-family: "M PLUS Rounded 1c", sans-serif;
			margin:-3vw auto 0 auto;
	z-index:999;
}
.st_msg h3{

	text-align: center; 
	font-family: "M PLUS Rounded 1c", sans-serif;
			margin:-3vw auto 0 auto;
	z-index:999;
}
.st_inner img{
		width:70%;
		max-width:960px;
	margin:0 auto;
}
	
	
.st_msg .marker{
	background-image: linear-gradient(90deg, #ffe10080 0%, #ffe10080 100%);
	background-position: left bottom;
    background-size: 100% 0.2em;
    background-repeat: no-repeat;
	
}

.st_msg p{
	color: #666666; font-family: "M PLUS Rounded 1c", sans-serif;	
	font-size: 110%; font-weight: 400;
		}

.st_btn{  
  display: block;
  align-items: center;
  justify-content: space-between;
  max-width: 387px;               /* 必要に応じて調整 */
  padding: 8px 20px;
  background-color: #c82309;  /* 画像の青色に近いカラー */
  color: #ffffff;
  font-size: 16px;
  font-weight: 500;
  border-radius: 10px;        /* 画像の角丸感 */
  text-decoration: none;
  transition: 0.25s ease;
  font-family: "M PLUS Rounded 1c", sans-serif;	
	font-weight: 600;
	text-align: center;
	margin:0 auto;
}

.st_btn:hover {
  background-color: #c95b50;  /* 少し明るく */
}

/* 右矢印 */
.st_btn::after {
  content: ">";
  font-size: 18px;
  margin-left: 10px;
  color: #ffffff;
}

 .st_btn a{
	text-decoration: none;
	 color:white;
}

.bnrBtn{
		margin:4vh auto 2vh auto;
		display: flex;
		flex-wrap:wrap;
		width:100%;
		max-width: 750px;
		justify-content: center;
	}
	.bnrBtninner{
		width:50%;
		text-align: center;
		margin: 1vh auto;
	}
	.bnrBtn img{
		width:100%;
		max-width:350px;
	}


/* 画面全体のうっすら黒い背景 */
.xmas-popup-overlay {
  position: fixed;
  inset: 0; /* top:0; right:0; bottom:0; left:0; と同じ */
  background: rgba(0, 0, 0, 0.5);
  display: none;            /* 初期は非表示 */
  align-items: center;
  justify-content: center;
  z-index: 1200000;            /* 既存要素より前面に */
}

/* 表示用クラス */
.xmas-popup-overlay.is-active {
  display: flex;
}

/* ポップアップ本体 */
.xmas-popup {
  position: relative;
  max-width: 900px;
  width: 90%;
  max-height: 80vh;
  overflow-y: auto;
  background: #fff;
  padding: 20px;
  box-sizing: border-box;
  border-radius: 8px;
  text-align: center;
}

.popup-img img{
}

/* 閉じるボタン */
.xmas-popup-close {
  position: absolute;
  top: 8px;
  right: 8px;
  border: none;
  background: transparent;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}

/* スマホ向けのちょっとした調整 */
@media screen and (max-width: 767px) {
  .xmas-popup {
    padding: 15px;
    max-width: 95%;
  }
}

	@media screen and (max-width:768px) {
			.bnrBtn{
		margin:4vh auto 2vh auto;
				display:block;
		text-align: center;}
		
		.bnrBtninner{width:100%;}}

/*SP*/
@media screen and (max-width:640px) {
	.sp{display: block;}
    .pc{display: none;}
	/* メニュー ---------------------------------------------------*/
	.categoryTitle { padding: 3rem 0 2rem 0;}
	#topMenu { display: inline-block; width: 100%; height: 100%; max-height: 100%!important; padding: 0 0.8rem 0 1rem; margin: 0 auto;}
	#topMenu .btn { display: inline-block; width: 48%; height: 14vh; vertical-align: top; font-size: 1rem; margin:0 1% 4% 0; padding:1rem 0.5rem 2rem 0.5rem;}
	#topMenu .btn:after { display: block; width: 95%; font-size: 1rem; text-align: center;}
	#topMenu .btn .main { display: block; font-size: 1.1rem; padding: 1rem 0 0.2rem;}
	#topMenu .btn .main br { display: block;}
	#topMenu .btn1 { width: 99%; margin-right: 1%;}
	#topMenu .btn .sub { display: block;}
	.sub br { display: none;}
	
	/* メールでの問い合わせ ---------------------------------------------------*/
	.supportTitle { font-size: 1.3rem; padding: 2rem 0 1rem 0;}
	#mailMenu { display: block;}
	#mailMenu .btn { width: 100%; margin: 0.6rem auto 0;; padding: 0 0.5rem 0 0;}
	#topMenu .btn:after  { left: auto;}
	#mailMenu .btn br { display: block;}
	.mailCaution { width: 90%; margin: 2rem auto 0;}
	
	/* 電話での問い合わせ ---------------------------------------------------*/
	.telCaution { width: 90%; padding: 0rem 0 3rem;}
	.maxW2 { width: 86%!important;}
	.telIcon { font-size: 3rem; width:25%;}
	.telIcon img{width:50%;	}
	.telTxt .txt2 { font-size: 1.8rem;}
	.telTime > span { text-indent: 0rem; padding-left: 0;}
	#telInfo { margin-bottom: 3rem;}
	
	.game_Q_title { font-size: 1.1rem;}
	
	/*カレンダー */
	.calendar { width: 94%; margin: 4rem auto 0;}
	.calenderTitle { font-size: 1rem;}
	.dayBox .daynunber { font-size: 70%; min-height:50px; vertical-align: middle; line-height: 0.9rem}
	.daytime {font-size:30%;}

	.dayBoxtext{ max-width:1040px; margin: 2rem 0.7rem 0 1rem;
    line-height: 1.5rem;}

	/*お知らせ */	
.st_inner{

	background-size: 100% 2.5em;
	line-height: 2em;
	padding-bottom: 1px;
	padding:0 10%;
		}
	
.st_inner img {
	width:85%;
	}
.st_inner h3 img {
	width:95%;
	}	
	.st_msg h2{
		font-size:1.5rem;
		margin:-3vh auto -6vw auto;	
		}
	.newyear{margin-top:-20vw;}
	.xmass{margin-top:-2vw;}	
	
	
}