input {
    display: none;
}
.test{
	border-style: solid;
	border-color: red;
  }

/*　モーダル画面　*/ 
#cboxContent{border-radius: 2%; background-color: rgb(255, 255, 255);}
/* #cboxContent{background: linear-gradient(#f9c2eb, #a8c2ee);} */

/*　モーダル画面の閉じるボタン　*/ 
#cboxClose{position:absolute; top:0%; right: 0%;  border-bottom-left-radius: 20%; background: center #1b3c53 url("/images/close.png") no-repeat ;text-indent:100%; white-space: nowrap; overflow: hidden;  width:55px; height:55px;}   

/*　モーダル画面のメイン　*/
#modal {
	position: relative;
	text-align: center;
	color: #2c272b;
	padding: 30px 35px 0 35px;
}

#modal .aicon{
	width: 48px;
	margin-bottom: 8px;
	/* padding: 0.5rem 1rem; */
}
  
#modal h1{
	font-size: 1.2rem !important;
	padding-top: 0px;
}

.kana {
	font-size: 0.7rem !important;
	margin-bottom: 0px;
	padding-bottom: 20px;
	opacity:0.6;
}  
  
#auto-slider-fade02 {
	position: relative;
	width: 100%;
	height: 100%;
	margin: 0 0 0px 0;
	padding-bottom: 60px;
	/* padding-bottom: 20px; */
	/* padding: 0 0 100px 0; */
	overflow: hidden;
}

#modal img{
	width: 60%;
	border-radius: 3px;
	object-fit: contain;
	aspect-ratio: 3 / 2;/* ここにアスペクト比を入れる */
}

#modal .slide-img P{
	width: 60%;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	margin-top:0px;
	margin-bottom:30px;
	letter-spacing:0.1em;
	line-height:1.8em;
	font-size:1.0rem;
}

.btn1 {
    position: absolute;
    width: 20px;
    height: 20px;
    border-radius: 50px;
    background-color: #ccc;
    cursor: pointer;
}
  
.btn2 {
    position: absolute;
    width: 20px;
    height: 20px;
    border-radius: 50px;
    background-color: #fdbb03;
}
 
/*店舗紹介文*/
.tenpo-area{
	width: 60%;
	margin: 0 auto;
	padding: 15px;
	margin-top: 50px;
	margin-bottom: 30px;
	position: relative;
	padding: 1rem 2rem;
	/*text-align: center;*/
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
	border-radius: 0 10px 10px 10px;
	background: #ffffff;
}   
.tenpo-area::after {
	/* font-size: 10px; */
	font-size: 0.9rem;
	position: absolute;
	top: -24px;
	left: 0;
	height: 24px;
	padding: 0 1em;
	content: '\PR';
	color: #fff;
	border-radius: 10px 10px 0 0;
	background: rgb(148, 148, 148);
  }

#modal .tenpo p {
    color: #000000;
	margin: 0 auto;
	/* background-color: #1b3c53a8; */
	/* background-color: #b8ac6a; */
    /* font-weight: bold; */
	font-size: 1.1rem;
    text-align: left;
	letter-spacing:0.1em;
	line-height:1.8em;
	width: 96%;
}

#modal .row{
	text-align: left;
	width: 60%;
	padding-top: 30px ;
	margin-left: auto;
	margin-right: auto;
	letter-spacing:0.1em;
	line-height:1.5em;
	border-collapse:collapse;
	/* box-shadow: 0 0 8px gray; */
	/* background-color: #ffffff; */
}

#modal table tr{
	border-bottom: 1px solid;
	border-color: rgb(180, 180, 180);
}

#modal table th{
	padding: 30px 0;
}

/*＝＝＝スマホのレイアウト(max-width: 1024px) のための調整 */

/*横幅が1024px以下になった際の指定*/
@media only screen and (max-width: 1024px) {

/* 	#cboxClose{position:absolute; top: 0%;; right: 0%; } */


	/*　モーダル画面のメイン　*/
	#modal {
		position: relative;
		Width: 100%; 
		text-align: center;
		color: #1f2644;
		padding: 25px 0px ;
	}
	
	#modal h1{
		font-size: 2.0rem;
		padding: 0px 30px 0 30px;
	}

	.kana {
		font-size: 0.8rem;
		padding-bottom: 30px;
	}  
	
	#auto-slider-fade02 {
		padding-bottom: 140px;
	}

	#modal img{
		width: 70%;
	}

	/*商品紹介文*/
	#modal .slide-img P {
		/* background-color: #e8ec08;  */
		width: 70%;
		margin-top: 0px;
		margin-bottom: 0px;
		font-size: 1.0rem;
	}

	/*　ドット　*/
	.btn1 {
		width: 18px;
		height: 18px;
		border-radius: 9px;
		bottom: 0px;
	}

	.btn2 {
		width: 18px;
		height: 18px;
		border-radius: 9px;
		bottom: 0px;
	}

	/*店舗紹介文*/
	.tenpo-area{
		width: 70%;
	}

	/* #modal .tenpo p {
		width: 100%;
	} */

	#modal .row{
		/* font-size: 1.0rem; */
		width: 70%;
		text-align: left;
	}

	#modal table.row th,
	#modal table.row td{
		width:100%;
		display:block;
	}

	#modal table.row th{
		padding-bottom: 1px;
	}
}



/*＝＝＝スマホのレイアウト(max-width: 580px) のための調整 */

/*横幅が580px以下になった際の指定*/
@media only screen and (max-width: 580px) {

	#cboxClose{position:absolute; top: 0%;; right: 0%; width:45px; height:45px;}


	/*　モーダル画面のメイン　*/
	#modal {
		position: relative;
		width: 100%;
		text-align: center;
		color: #1f2644;
		padding: 25px 0px 0px 0px;
	}

	#modal .aicon{
		width: 48px;
	}
	
	#modal h1{
		font-size: 1.3rem;
		padding: 0px 30px 0 30px;
	}

	.kana {
		font-size: 0.8rem;
		padding: 0 30px 20px 30px;
		width: 80%
	}  
	
/* 	#auto-slider-fade02 { */
/* 		padding-bottom: 200px; */
/* 	} */

	#modal img{
		width: 86%;
	}

	#modal .slide-img P{
		width: 87%;
		font-size:0.9rem;
		line-height:1.4em;
	}

	/*　ドット　*/
	.btn1 {
		width: 16px;
		height: 16px;
		border-radius: 8px;
		bottom: 0px;
	}

	.btn2 {
		width: 16px;
		height: 16px;
		border-radius: 8px;
		bottom: 0px;
	}

	/*店舗紹介文*/
	.tenpo-area{
		width: 70%;
		margin-bottom: 10px;
	}
	
	
	#modal .tenpo p {
		width:98%;
		margin-bottom:10px;
		font-size: 0.9rem;
		letter-spacing:0.2em;
		line-height:1.5em;
	}
	#modal .row{
		width:80%;
	}

/* 	#modal table.row th, */
/* 	#modal table.row td{ */
/* 		width:100%; */
/* 		display:block; */
/* 	} */
	
/* 	#modal table.row th{ */
/* 		padding-bottom: 1px; */
/* 	} */

	#modal table td{
		font-size: 1.0rem;
		letter-spacing:0em;
		word-break: break-all;
	}
}