

.MainView {
	width:100%;
	margin:0px 0px 4px 0px;
	padding:0;
	position:	relative;	 /* 相対位置指定 */
}
.MainView img {
	width:100%;
	max-width:800px;
	min-width:290px;
}

.SubView {
	width:100%;
	margin:0px 0px 4px 0px;
	padding:0;
	position:	relative;	 /* 相対位置指定 */
}
.SubView img {
	width:100%;
	min-width:312px;
/*	max-height:320px;*/
/*	min-height:250px; */
/*	object-fit:cover;*/
}

.object-fit-img {
	width:100%;
	object-fit: cover;
	object-position: bottom;
	font-family: 'object-fit: cover; object-position: bottom;';
}


.ShopContents{
/*	border-bottom: 1px solid #ddd;*/

	padding: 8px 4px;
	font-family: Meiryo,Osaka, "游ゴシック","メイリオ","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.ShopContents h1{
	text-align:left;
	font-size: 1.6rem;
	font-weight: bold;
	color: #045FB4;
	padding: 8px 4px;
	border-bottom: solid 2px #045FB4;
	margin:14px 0px 12px 0px;
}
.ShopContents h2{
	text-align:left;
	font-size: 16px;
	font-weight: bold;
	color: #045FB4;
	padding: 0px 0px;
	margin:2px 0px 2px 0px;
}

.ShopContents h3{
	text-align:left;
	font-size: 1.6rem;
	font-weight: bold;
	color: #045FB4;
	padding: 0px 0px;
	margin:0px 0px 0px 0px;
}

/*  レスポンシブテーブルデザイン   for shop detail */

.ShopDitailWrap{
/*	border-bottom: 1px solid #ddd;*/
	padding: 8px 8px;
	font-family: Meiryo,Osaka, "游ゴシック","メイリオ","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.ShopDitail{
	width:96%;
	border: 1px solid #ccc;
	overflow: hidden;
	word-break: break-all;
	word-wrap: break-word;
}
 
.ShopDitail th{
	padding: 6px 8px 5px 5px;
	border-top: solid 1px #ffffff;
	width: 30%;
	overflow: hidden;
	color: #13131e;
	font-style: normal;
	font-weight: bold;
	font-size: 1.6rem;
	text-align: left;
	word-break: break-all;
	word-wrap: break-word;
	vertical-align: top;
	background-color: #eeece4;
}
 
.ShopDitail td{
	padding: 5px 10px 5px 10px;
	font-size: 1.6rem;
	text-align: left;
	vertical-align: top;
	color: #595960;
	background-color: #ffffff;
	border-top: dotted 1px #e0dccc;
	overflow: hidden;
	word-break: break-all;
	word-wrap: break-word;
}
 
@media (max-width: 520px){
	.ShopDitail th{
	  	width:100%;
	 	display:block;
		margin: 0 auto;

	  border:none;
	 /* border-radius: 3px;*/
	}
	.ShopDitail td{
	  	display: list-item;
	 	width: 100%;
		padding: 5px 5px 5px 5px;
		border: none !important;
	}
}




/* --------------------------------------------------------
	table
-------------------------------------------------------- */
.test_wrap{
	border-bottom: 1px solid #ddd;
	padding: 8px 8px;
	font-family: Meiryo,Osaka, "游ゴシック","メイリオ","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.test_wrap h3{
	font-size:1.6rem; 
	color:#2e2e2e;
	text-align: left;
}

.Sample {
	width: 100%;
	border-collapse: collapse;
	margin:2px 2px 2px 2px;
}

.Sample  a{
	text-decoration: none;
}

.Sample h2{
	font-size:1.6rem; 
	color:#2e2e2e;
	text-align: left;
	padding: 0px 2px 2px 2px;
}

.Sample .caption{
	font-size:1.6rem; 
	line-height: 2.8rem;
	color:#696969;
	text-align: left;
	padding: 2px 8px 8px 18px;
}

.Sample th, 
.Sample td{
	padding: 8px 10px;
/*	border: 1px solid #ddd; 
	font-size: 1.3rem;
	color:#696969;*/
	border:none;
	vertical-align:top;
}

.Sample th {
	background: #ffffff;
	width: 26%;
	text-align: left;
	vertical-align:top;
}

.Sample img {
	width:100%;
	max-width:300px;
	min-width:168px;
}

/*-----------------------------------------------------*/
.Sample .title1 {
 	font-size:1.0rem;
	font-weight: bold;
	color:#2e2e2e;
	padding: .65rem 0;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	margin-bottom: 0.5rem;
}

.Sample .title1 a:hover { 
	color:#ff7f50;
}

/*-----------------------------------------------------*/
.Sample .title2 {
	padding-bottom: .5rem;
	border-bottom: 1px solid #ccc;
  	font-size:1.6rem;
	font-weight: bold;
	color:#2e2e2e;
	text-align: left;
	padding: 8px 2px 16px 2px;
}
/*-----------------------------------------------------*/
.Sample  .title3 {
  color: #505050;
/*  padding: 0.5em;*/
  display: inline-block;
  line-height: 1.3;
  background: #dbebf8; /* #dbebf8; #dcdcdc*/
  vertical-align: middle;
  border-radius: 6px;
  width:100%;
  	font-size:1.6rem;
  	font-weight: bold;
	color:#2e2e2e;
	text-align: left;
	padding:8px 2px 8px 2px;
	margin-bottom: 0.5rem;
}

.Sample .title3 a:link { 
	color: #4169e1;
	text-decoration: none;
}

.Sample .title3 a:hover { 
	color:#ff7f50;
}

.Sample .title3:before {
  content: '●';
  color: #ffffff; /*#ffa07a;*/
  margin-right: 8px;
}
/*-----------------------------------------------------*/
.Sample  .title4 {
  position: relative;
  padding: 0.5em;
  background: #a6d3c8;
  color: white;
	margin-bottom: 1.5rem;
}

.Sample  .title4::before {
  position: absolute;
  content: '';
  top: 100%;
  left: 0;
  border: none;
  border-bottom: solid 15px transparent;
  border-right: solid 20px rgb(149, 158, 155);
}
/*-----------------------------------------------------*/
.Sample  .title5 {
  padding: .5em .75em;
  background-color: #f6f6f6;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}
/*-----------------------------------------------------*/
@media only screen and (max-width:574px) { /*479px*/

	.Sample {
		margin:2px 2px 18px 2px;
	}
	.Sample th,
	.Sample td {
		width: auto;
		display: block;
		border-top: none;
	}
	.Sample th {
	/*	background: #f4f4f4;*/
		text-align: center;
		vertical-align:top;
	}
	.Sample img{
		width:100%;
		max-width:300px;
		min-width:268px;
	}
/*	.Sample tr:first-child {
		border-top: 1px solid #d5d5d5;
	}
*/
}

/*------------------ table sample2 ----*/
.Sample2 {
	width: 100%;
	border-collapse: collapse;
}

.Sample2 th,
.Sample2td {
	padding: 8px 10px;
/*	border: 1px solid #ddd; */
	font-size: 1.6rem;
	color:#696969;
	vertical-align:top;
}

.Sample2 th {
/*	background: #f4f4f4;*/
	width: 16%;
	text-align: left;
	vertical-align:top;
}

.Sample2 img {
	width:100%;
	max-width:182px;
	min-width:148px;
}

@media only screen and (max-width:782px) {
	.Sample2 th,
	.Sample2 td {
		width: auto;
		display: block;
		border-top: none;
	}
	.Sample2 th {
	/*	background: #f4f4f4;*/
		text-align: left;
		vertical-align:top;
	}
	.Sample2 img{
		width:100%;
		max-width:400px;
		min-width:268px;
	}
/*	.Sample2 tr:first-child {
		border-top: 1px solid #d5d5d5;
	}
*/
}

