html, body {
  height: 100%;
	width: 100%;
  margin: 0;
  padding: 0;
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
}

a {
	text-decoration: none;
}


/* 上部の画像の設定 */
.top-image {
  height: 35%; /* 画面の上部35%を画像に */
  width: 100%; /* 幅をウィンドウ全体に合わせる */
  overflow: hidden; /* 必要に応じて画像がはみ出す部分を隠す */
	z-index: 9;
}

/*
.top-image .slider li img{
	max-width: 100%;
	height: 32vh;
}
*/

/* ボタンがある部分の設定 */
.buttons {
  height: 64%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-end;
	  margin: 0;
  padding: 0 5px;
	z-index: 1;


}

/* ボタンのスタイル */
.btn {
  width: 100%;
  height: 20%;
  margin: 0;
  font-size: 16px;
}
.btn img {
  width: 100%;
  height: 100%;
}

/* タップで画像が変わる */
.btn01 {
  margin-top: 1px;
}
.btn01 img {
  width: 100%;
  height: 100%;
}
.btn01:active img {
            content: url('../../btn01b.jpg'); /* 変わる画像のパスを指定 */
        }
/* 事前に新しい画像を読み込んでおく */
        .btn01::before {
            content: '';
            position: absolute;
            width: 0;
            height: 0;
            background-image: url('../../btn01b.jpg'); /* 変更後の画像をプリロード */
            visibility: hidden;
        }


.btn02 {
  margin-top: 0px;
}
.btn02 img {
  width: 100%;
  height: 100%;
}
.btn02:active img {
            content: url('../../btn02b.jpg'); /* 変わる画像のパスを指定 */
        }
/* 事前に新しい画像を読み込んでおく */
        .btn02::before {
            content: '';
            position: absolute;
            width: 0;
            height: 0;
            background-image: url('../../btn02b.jpg'); /* 変更後の画像をプリロード */
            visibility: hidden;
        }


.btn03 {
  margin-top: 0px;
}
.btn03 img {
  width: 100%;
  height: 100%;
}
.btn03:active img {
            content: url('../../btn03b.jpg'); /* 変わる画像のパスを指定 */
        }
/* 事前に新しい画像を読み込んでおく */
        .btn03::before {
            content: '';
            position: absolute;
            width: 0;
            height: 0;
            background-image: url('../../btn03b.jpg'); /* 変更後の画像をプリロード */
            visibility: hidden;
        }

.btn04 {
  margin-top: 0px;
}
.btn04 img {
  width: 100%;
  height: 100%;
}
.btn04:active img {
            content: url('../../btn04b.jpg'); /* 変わる画像のパスを指定 */
        }
/* 事前に新しい画像を読み込んでおく */
        .btn04::before {
            content: '';
            position: absolute;
            width: 0;
            height: 0;
            background-image: url('../../btn04b.jpg'); /* 変更後の画像をプリロード */
            visibility: hidden;
        }

.btn05 {
  margin-top: 0px;
}
.btn05 img {
  width: 100%;
  height: 100%;
}
.btn05:active img {
            content: url('../../btn05b.jpg'); /* 変わる画像のパスを指定 */
        }
/* 事前に新しい画像を読み込んでおく */
        .btn05::before {
            content: '';
            position: absolute;
            width: 0;
            height: 0;
            background-image: url('../../btn05b.jpg'); /* 変更後の画像をプリロード */
            visibility: hidden;
        }


/* オーバーレイコンテンツのスタイル：画像の下に配置 */
.content {
  position: absolute;
	top:5%;
  /*top: 28%;  画像の下から開始 */
  left: 0;
  width: 100%;
  height: 100%; /* 画面の下部までカバーする */
  display: none; /* 初期状態は非表示 */
  flex-direction: column;
  justify-content: space-between; /* コンテンツ間にスペースを作る */
  color: black;
	padding: 0;
	z-index: 99;
}

/* テキストエリア */
#content-text {
  font-size: 14px;
  /*text-align: center;*/
  overflow-y: auto;
  flex-grow: 1; /* テキストエリアが残りのスペースを埋めるように */
  width: 100%;
  justify-content: center;
 align-items: center;
	bottom: 0;
	padding-top: 10px;
	top: 0;
}

/* 閉じるボタンを一番上に配置 */
.close-btn {
  position: absolute;
  width: 35px; /* ボタンの幅 */
  height: 35px; /* ボタンの高さ */
  border-radius: 50%; /* 円形にする */
  background-color: rgba(255,255,255,0.8); /* ボタンの背景色 */
  border: 1px solid #888888; /* ボタンの外枠 */
  display: flex;
  align-items: center;
  justify-content: center;
	right: 7px;
	/*top: -5px;*/
	z-index: 99;
}

.close-btn::before {
  content: "×";
  font-size: 25px; /* ×のサイズ */
  color: #000; /* ×の色 */
  z-index: 1;
}


.slider {
    padding-left: 0;
    margin: 0 auto;
	width: 100%;
	height: 100%;
}

.slider img{
	width: 100vw;
	height: 31vh;
	object-fit: fill;
}

/*南海P*/
.grid-container {
  display: grid;
  grid-template-columns: 1fr 4fr; /* 2列 */
  grid-template-rows: repeat(10, auto);   /* 行 */
  gap: 0px; /* アイテム間の隙間を設定 */
  width: 100%; /* コンテナが画面幅に適応する */
	margin: auto;
	align-items: center;
}

.grid-item {
  padding:0px 10px 5px 10px;
  text-align: left;
	position: relative;
	
}

.grid-item p{
	margin-top: 5px ;
	margin-bottom: 0px;
}

.grid-item:nth-child(1), /* 1番目のアイテム */
.grid-item:nth-child(3n+1) { 
	font-size: 90%;
	  text-align: center;
	white-space: nowrap;
	position: relative;
	line-height: 1.15rem;
	color: rgba(5,64,255,1.00);

}
.grid-item:nth-child(1) {
	align-self: center;

}

.grid-item:nth-child(2) {
	font-size: 110%;
	font-weight: 700;
	align-self: center;
}

.grid-item:nth-child(2) span.small {
  font-size: 95%;
	font-weight: normal;
}

.grid-item:nth-child(5) span.huto{
	font-weight: 700;
}

.grid-item:nth-child(5) span.txtmigi{
	font-weight: 700;
	float: right;
	color: #4D4A4A;
	padding-right: 5px;
	display: inline-block;
    transform: skew(-10deg);
}
.grid-item:nth-child(5) span.txtmigi::before{
	content: "※";
}

.grid-item:nth-child(14) span{
	font-weight: 700;
}

.grid-item:nth-child(17) span{
	font-weight: 700;
}

.grid-item:nth-child(23) span.akahuto{
	font-weight: 700;
	color: red;
	background: linear-gradient(transparent 60%, #ff6 60%);
	font-size: 105%;
}

.grid-item:nth-child(23) span.stxt{
	font-size: 90%;
	display: inline-block;
	padding-top: 5px;
}

.grid-item:nth-child(3n) {
  grid-column: span 2; /* 2列分の幅を占める */
	width:90%;
	border-top: 1px dotted #9F9E9E;
	margin:0 auto;
	text-align: center;
}
.grid-item:nth-child(3n)::before {
	content: "";
}
.grid-item:nth-child(3n)::after {
	content: "";
}


/*フラワーパーキング2番町West*/
.grid-container02 {
  display: grid;
  grid-template-columns: 1fr 4fr; /* 2列 */
  grid-template-rows: repeat(10, auto);   /* 行 */
  gap: 0px; /* アイテム間の隙間を設定 */
  width: 100%; /* コンテナが画面幅に適応する */
	margin: auto;
	align-items: center;
}

.grid-item02 {
  padding:0px 10px 5px 10px;
  text-align: left;
	position: relative;
	
}

.grid-item02 p{
	margin-top: 5px ;
	margin-bottom: 0px;
}

.grid-item02:nth-child(1), /* 1番目のアイテム */
.grid-item02:nth-child(3n+1) { 
	font-size: 90%;
	  text-align: center;
	white-space: nowrap;
	position: relative;
	line-height: 1.15rem;
	color: #e95513;

}
.grid-item02:nth-child(1) {
	align-self: center;

}

.grid-item02:nth-child(2) {
	font-size: 110%;
	font-weight: 700;
	align-self: center;
}

.grid-item02:nth-child(2) span.small {
  font-size: 95%;
	font-weight: normal;
}

.grid-item02:nth-child(5) span.huto{
	font-weight: 700;
}

.grid-item02:nth-child(5) span.txtmigi{
	font-weight: 700;
	float: right;
	color: #4D4A4A;
	padding-right: 5px;
	display: inline-block;
    transform: skew(-10deg);
}
.grid-item02:nth-child(5) span.txtmigi::before{
	content: "※";
}
.grid-item02:nth-child(14) span{
	font-weight: 700;
}

.grid-item02:nth-child(17) span{
	font-weight: 700;
}


.grid-item02:nth-child(23) span.akahuto{
	font-weight: 700;
	color: red;
	background: linear-gradient(transparent 60%, #ff6 60%);
	font-size: 105%;
}

.grid-item02:nth-child(23) span.stxt{
	font-size: 90%;
	display: inline-block;
	padding-top: 5px;
}


.grid-item02:nth-child(3n) {
  grid-column: span 2; /* 2列分の幅を占める */
	width:90%;
	border-top: 1px dotted #9F9E9E;
	margin:0 auto;
	text-align: center;
}
.grid-item02:nth-child(3n)::before {
	content: "";
}
.grid-item02:nth-child(3n)::after {
	content: "";
}


/*フラワーパーキング2番町*/
.grid-container03 {
  display: grid;
  grid-template-columns: 1fr 4fr; /* 2列 */
  grid-template-rows: repeat(10, auto);   /* 行 */
  gap: 0px; /* アイテム間の隙間を設定 */
  width: 100%; /* コンテナが画面幅に適応する */
	margin: auto;
	align-items: center;
}

.grid-item03 {
  padding:0px 10px 5px 10px;
  text-align: left;
	position: relative;
	
}

.grid-item03 p{
	margin-top: 5px ;
	margin-bottom: 0px;
}

.grid-item03:nth-child(1), /* 1番目のアイテム */
.grid-item03:nth-child(3n+1) { 
	font-size: 90%;
	  text-align: center;
	white-space: nowrap;
	position: relative;
	line-height: 1.15rem;
	color: #00008a;

}
.grid-item03:nth-child(1) {
	align-self: center;

}

.grid-item03:nth-child(2) {
	font-size: 110%;
	font-weight: 700;
	align-self: center;
}

.grid-item03:nth-child(2) span.small {
  font-size: 95%;
	font-weight: normal;
}

.grid-item03:nth-child(5) span.huto{
	font-weight: 700;
}

.grid-item03:nth-child(5) span.txtmigi{
	font-weight: 700;
	float: right;
	color: #4D4A4A;
	padding-right: 5px;
	display: inline-block;
    transform: skew(-10deg);
}
.grid-item03:nth-child(5) span.txtmigi::before{
	content: "※";
}

.grid-item03:nth-child(8) span.txtmigi2{
	float: right;
	padding-right: 5px;
}
.grid-item03:nth-child(8) span.txtmigi2::before{
	content: "（";
}
.grid-item03:nth-child(8) span.txtmigi2::after{
	content: "）";
}

.grid-item03:nth-child(14) span{
	font-weight: 700;
}

.grid-item03:nth-child(17) span{
	font-weight: 700;
}

.grid-item03:nth-child(23) span.akahuto{
	font-weight: 700;
	color: red;
	background: linear-gradient(transparent 60%, #ff6 60%);
	font-size: 105%;
}

.grid-item03:nth-child(23) span.stxt{
	font-size: 90%;
	display: inline-block;
	padding-top: 5px;
}

.grid-item03:nth-child(3n) {
  grid-column: span 2; /* 2列分の幅を占める */
	width:90%;
	border-top: 1px dotted #9F9E9E;
	margin:0 auto;
	text-align: center;
}
.grid-item03:nth-child(3n)::before {
	content: "";
}
.grid-item03:nth-child(3n)::after {
	content: "";
}


/*お城下パーキング2番町*/
.grid-container04 {
  display: grid;
  grid-template-columns: 1fr 4fr; /* 2列 */
  grid-template-rows: repeat(10, auto);   /* 行 */
  gap: 0px; /* アイテム間の隙間を設定 */
  width: 100%; /* コンテナが画面幅に適応する */
	margin: auto;
	align-items: center;
}

.grid-item04 {
  padding:0px 10px 5px 10px;
  text-align: left;
	position: relative;
	
}

.grid-item04 p{
	margin-top: 5px ;
	margin-bottom: 0px;
}

.grid-item04:nth-child(1), /* 1番目のアイテム */
.grid-item04:nth-child(3n+1) { 
	font-size: 90%;
	  text-align: center;
	white-space: nowrap;
	position: relative;
	line-height: 1.15rem;
	color: #006837;

}
.grid-item04:nth-child(1) {
	align-self: center;

}

.grid-item04:nth-child(2) {
	font-size: 110%;
	font-weight: 700;
	align-self: center;
}

.grid-item04:nth-child(2) span.small {
  font-size: 95%;
	font-weight: normal;
}

.grid-item04:nth-child(5) span.huto{
	font-weight: 700;
}

.grid-item04:nth-child(5) span.txtmigi{
	font-weight: 700;
	float: right;
	color: #4D4A4A;
	padding-right: 5px;
	display: inline-block;
    transform: skew(-10deg);
}
.grid-item04:nth-child(5) span.txtmigi::before{
	content: "※";
}

.grid-item04:nth-child(8) span.txtmigi2{
	float: right;
	padding-right: 5px;
}
.grid-item04:nth-child(8) span.txtmigi2::before{
	content: "（";
}
.grid-item04:nth-child(8) span.txtmigi2::after{
	content: "）";
}

.grid-item04:nth-child(14) span{
	font-weight: 700;
}

.grid-item04:nth-child(17) span{
	font-weight: 700;
}

.grid-item04:nth-child(23) span.akahuto{
	font-weight: 700;
	color: red;
	background: linear-gradient(transparent 60%, #ff6 60%);
	font-size: 105%;
}

.grid-item04:nth-child(23) span.stxt{
	font-size: 90%;
	display: inline-block;
	padding-top: 5px;
}

.grid-item04:nth-child(3n) {
  grid-column: span 2; /* 2列分の幅を占める */
	width:90%;
	border-top: 1px dotted #9F9E9E;
	margin:0 auto;
	text-align: center;
}
.grid-item04:nth-child(3n)::before {
	content: "";
}
.grid-item04:nth-child(3n)::after {
	content: "";
}


/*キスケ三番町パーキング*/
.grid-container05 {
  display: grid;
  grid-template-columns: 1fr 4fr; /* 2列 */
  grid-template-rows: repeat(10, auto);   /* 行 */
  gap: 0px; /* アイテム間の隙間を設定 */
  width: 100%; /* コンテナが画面幅に適応する */
	margin: auto;
	align-items: center;
}

.grid-item05 {
  padding:0px 10px 5px 10px;
  text-align: left;
	position: relative;
	
}

.grid-item05 p{
	margin-top: 5px ;
	margin-bottom: 0px;
}

.grid-item05:nth-child(1), /* 1番目のアイテム */
.grid-item05:nth-child(3n+1) { 
	font-size: 90%;
	  text-align: center;
	white-space: nowrap;
	position: relative;
	line-height: 1.15rem;
	color: #c30d23;

}
.grid-item05:nth-child(1) {
	align-self: center;

}

.grid-item05:nth-child(2) {
	font-size: 110%;
	font-weight: 700;
	align-self: center;
}

.grid-item05:nth-child(2) span.small {
  font-size: 95%;
	font-weight: normal;
}

.grid-item05:nth-child(5) span.huto{
	font-weight: 700;
}

.grid-item05:nth-child(5) span.txtmigi{
	font-weight: 700;
	float: right;
	color: #4D4A4A;
	padding-right: 5px;
	display: inline-block;
    transform: skew(-10deg);
}
.grid-item05:nth-child(5) span.txtmigi::before{
	content: "※";
}

.grid-item05:nth-child(8) span.txtmigi2{
	float: right;
	padding-right: 5px;
}
.grid-item05:nth-child(8) span.txtmigi2::before{
	content: "（";
}
.grid-item05:nth-child(8) span.txtmigi2::after{
	content: "）";
}

.grid-item05:nth-child(14) span{
	font-weight: 700;
}

.grid-item05:nth-child(17) span{
	font-weight: 700;
}

.grid-item05:nth-child(23) span.akahuto{
	font-weight: 700;
	color: red;
	background: linear-gradient(transparent 60%, #ff6 60%);
	font-size: 105%;
}

.grid-item05:nth-child(23) span.kurohuto{
	font-weight: 700;
	color: #000000;
	/* background: linear-gradient(transparent 60%, #ff6 60%); */
	display: inline-block;
	padding-top: 5px;
}


.grid-item05:nth-child(23) span.stxt{
	font-size: 90%;
	display: inline-block;
	padding-top: 5px;
}

.grid-item05:nth-child(3n) {
  grid-column: span 2; /* 2列分の幅を占める */
	width:90%;
	border-top: 1px dotted #9F9E9E;
	margin:0 auto;
	text-align: center;
}
.grid-item05:nth-child(3n)::before {
	content: "";
}
.grid-item05:nth-child(3n)::after {
	content: "";
}



.btn-container {
  display: grid;
  grid-template-columns: 1fr 1fr; /* 2列 */
  grid-template-rows: repeat(1, auto);   /* 行 */
  width: 95%; /* コンテナが画面幅に適応する */
	margin: auto;
	align-items: center;
	text-align:center; 
}

.btn-item {
  padding:10px 10px 0 10px;
  text-align: center;
}

.btn-item02 {
  text-align: center;
	  grid-column: span 2; /* 2列分の幅を占める */
	width:47.5%;
	margin: 10px auto 0 auto;
}


/* タイトル */
.blue01{
	font-size: 1.2rem;
	color: rgba(21,128,255,1.00);
	font-weight: 700;
	padding:0px 0px 5px 20px;
}

.orange01{
	font-size: 1.2rem;
	color: #e95513;
	font-weight: 700;
	padding:0px 0px 5px 20px;
}

.blue02{
	font-size: 1.2rem;
	color: rgba(0,0,138,1.00);
	font-weight: 700;
	padding:0px 0px 5px 20px;
}

.green01{
	font-size: 1.2rem;
	color: #006837;
	font-weight: 700;
	padding:0px 0px 5px 20px;
}

.red01{
	font-size: 1.2rem;
	color: #c30d23;
	font-weight: 700;
	padding:0px 0px 5px 20px;
}




/*注意書き*/
.chui{
	color: #C00003;
	padding-bottom: 7px;
	text-align: center;
			font-weight: 700;
}

.chui span.hutomoji{
	font-size: 1.0rem;
}

/*
.chui span::before{
	content: "『"
}

.chui span::after{
	content: "』"
}
*/

/* ボタン */
.button01 {
  padding: 7px;
  background: linear-gradient(to bottom, #f2f2f2, #e0e0e0);
  color: #333333;
  border-radius: 5%;
  border: 1px solid #888888;
  cursor: pointer;
  transition: background-color 0.3s ease;
  font-weight: bold;
  align-items: center;
text-align: center;
	font-size: 1.05rem;
	letter-spacing: 1px;
}

.button01 span {
	font-size: 90%;
	color: gray;
	padding-right: 5px;
}

.button01:active {
  background-color: #cccccc; /* タップしたときの色 */
  transform: translateY(2px);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);
}

.button02 {
  padding: 7px;
  background: linear-gradient(to bottom, #fde4e9, #fbcfd7);
  color: #212CF8;
  border-radius: 5%;
  border: 1px solid #E10077;
  cursor: pointer;
  transition: background-color 0.3s ease;
  font-weight: bold;
  align-items: center;
text-align: center;
		font-size: 1.05rem;
		letter-spacing: 1px;


}

.button02 span {
	font-size: 90%;
	color: hotpink;
	padding-right: 5px;
}

.button02:active {
  background-color: #FCCEEF; /* タップしたときの色 */
  transform: translateY(2px);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);
}


.button03 {
  padding: 7px;
  background: linear-gradient(to bottom, #f0f8ff, #add8e6);
  color: #0C3EFF;
  border-radius: 5%;
  border: 1px solid #1e90ff;
  cursor: pointer;
  transition: background-color 0.3s ease;
  font-weight: bold;
  align-items: center;
		letter-spacing: 0.05rem;
			font-size: 1.05rem;


}
.button03 span {
  font-size: 90% ;
  padding-right: 5px;
  color: #0054FF;
}

.button03:active {
  background-color: #DCF2FD; /* タップしたときの色 */
  transform: translateY(2px);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);
}


/*　蛍光マーカー　*/
.kiiro {
  background: linear-gradient(transparent 60%, #ff6 60%);
}

/* ★のリストマーク */
.star-list {
  list-style-type: none; /* デフォルトのリストマーカーを消します */
  padding-left: 0; /* リスト全体の左側の余白をなくします */
	margin-top: 0;
	margin-bottom: 0;
}

.star-list li {
  position: relative; /* 疑似要素をリスト内で位置調整するためにrelativeを設定 */
  padding-left: 20px; /* テキストに余白をつけて「★」のスペースを確保 */
}

.star-list li::before {
  content: "★";
  position: absolute; /* テキストの左に「★」を固定 */
  left: 0; /* リスト項目の左端に「★」を配置 */
  top: 0;
	color: red;
}

.star-list span.hutoj{
	font-weight: 700
} 

/* スマホのみで表示 */
@media only screen and (max-width: 768px) {
  .disp-pc {
    display: none !important;
  }
  .disp-sp {
    display: block !important;
  }
}
/* PCのみで表示*/
@media only screen and (min-width: 768px) {
  .disp-sp {
    display: none !important;
  }
  .disp-pc {
    display: block !important;
  }
}