@charset "UTF-8";
html {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}

body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  min-height: 100vh;
}

main {
  min-height: 1px;
	padding-bottom: 2.0rem;
	background: linear-gradient(#f7f7f7, #bac1cc);
	background-attachment: fixed;
}

footer {
  margin-top: auto;
}

body {
  overflow-x: hidden;
  background: #ffffff;
	color: #5a6671;
	font-family: 'Meiryo', sans-serif;
  font-size: 16px;
}

p {
  line-height: 1.6;
}

a {
  text-decoration: none;
  color: #1a0dab;
}

a:hover {
  opacity: 0.8;
  color: #1a0dab;
	text-decoration: none;
}

:focus,
button:focus {
  outline: none;
}

img {
  max-width: 100%;
  height: auto;
}

iframe {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 100%;
  border: none;
}

header {
  padding: 10px 20px;
  background: #000000;
}

@media (max-width: 575px) {
  header {
    padding: 8px;
  }
}

header .img-logo {
  width: 40vw;
  max-width: 160px;
}

footer {
	padding: 1.0rem 0.0rem;
  background-color: #000000;
}

footer .link-pageup {
  position: fixed;
  right: 40px;
  bottom: 30px;
	width: 42px;
  height: 42px;
  background: linear-gradient(45deg, #91a5ca, #eaa8c8);
}
footer .link-pageup:before {
	content: "";
	display: inline-block;
	position: absolute;
	top: 16px;
	left: 9px;
	width: 24px;
  height: 24px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
	transform: rotate(-45deg);
	filter: drop-shadow(0px 0px 3px #ff8181);
}
footer .link-pageup:hover {
	opacity: 1.0;
}
footer .link-pageup:hover:before {
	filter: drop-shadow(0px 0px 3px #56dcd9);
}

@media (max-width: 991px) {
  footer .link-pageup {
    right: 10px;
    bottom: 9px;
  }
}

footer .link-pageup:hover {
  color: #666666;
}

footer .copyright {
  display: block;
  text-align: center;
  color: #ffffff;
}


/********************************
	title
********************************/
.p-title {
	position: relative;
	width: 100%;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.0) 57.00%, rgba(0, 0, 0, 0.6) 57% 58%, rgba(0, 0, 0, 0.4) 58.00% 75.00%, rgba(0, 0, 0, 0.0) 75.00% 100%);
	z-index: 0;
}

.p-title:after {
	content: "";
	position: absolute;
	display: block;
	width: 15%;
	height: 1%;
	background-color: #ffffff;
	right: 0px;
	top: 57%;
	border-radius: 1.0rem 0.0rem 0.0rem 1.0rem;
	filter: drop-shadow(0px 0px 4px #23c0c8);
	z-index: -1;
}
@media all and (-ms-high-contrast: none){
  .p-title:after {
    display: none; /* IE10以上 */
  }
}


.p-title-container {
	overflow: hidden;
	width: 100%;
	max-width: 1200px;
	margin: 0px auto;
	padding: 32px 0px 114px 0px;
	z-index: 999;
}

.p-title figure {
	float: left;
	width: calc((653 / 1200) * 100%);
	max-width: 653px;
	margin: 0px 0px 0px 16px;
	padding: 6px;
	border: 8px solid #ffffff;
	box-shadow: 0px 0px 12px #ff9999, inset 0px 0px 8px #ff9999;
	box-sizing: border-box;
}

.p-title figure img {
	width: 100%;
	max-width: 625px;
}

.p-title h1 {
	float: right;
	width: calc((513 / 1200) * 100%);
	margin: 0px;
	padding: 20.90vw 0px 7.21vw 0px;
}

.p-title h2 {
	float: right;
	width: calc((513 / 1200) * 100%);
	padding: 1px 26px 0px 0px;
	color: #ffffff;
	font-family: "Osaka-mono", "MS Gothic", "monospace";
	font-size: 38px;
	text-align: right;
}

.p-title h2 span {
		filter: drop-shadow(0px 0px 4px #2beff9);
}


@media (min-width: 1201px) {

	.p-title h1 {
		padding: 255px 0px 88px 0px;
	}

}


@media (max-width: 992px) and (min-width: 641px) {

	.p-title {
		background: linear-gradient(to bottom, rgba(0, 0, 0, 0.0) 60.00%, rgba(0, 0, 0, 0.6) 60% 61%, rgba(0, 0, 0, 0.4) 61% 78.00%, rgba(0, 0, 0, 0.0) 78.00% 100%);
	}
	.p-title:after {
		top: 60%;
	}

	.p-title-container {
		padding: 2.2vw 0% 5.2vw 0%;
	}

	.p-title h2 {
		padding-right: 2.16%;
		font-size: 3.5vw;
	}

}


@media (max-width: 640px) {
	
	.p-title {
		background: none;
	}

	.p-title:after {
		display: none;
	}

	.p-title-container {
		padding: 0px 0px 28px 0px;
	}
	
	.p-title figure {
		float: none;
		width: 100%;
		max-width: none;
		margin: 0px;
		padding: 0px;
		border: none;
		box-shadow: none;
	}
	
	.p-title h1 {
		float: none;
		width: 100%;
		padding: 3px 0px 0px 0px;
		background: linear-gradient(rgba(255, 255, 255, 0.6) 40%, rgba(255, 255, 255, 0.0));
		text-align: center;
	}
	
	.p-title h1 img {
		width: 90%;
		filter: drop-shadow(0px 0px 6px #ffffff);
	}
	
	.p-title h2 {
		float: none;
		width: 100%;
		margin: 4px 0px 2px 0px;
		padding: 10px 0% 9px 0%;
		background: linear-gradient(to right, rgba(124, 127, 131, 0.0) 2%, rgba(124, 127, 131, 1.0) 50%, rgba(124, 127, 131, 0.0) 98%);
		filter: none;
		box-shadow: 0px 0px 7px rgba(255, 255, 255, 0.25);
		font-size: 26px;
		text-align: center;
	}

}


/********************************
	goods
********************************/
.goods_ {
	clear: both;
	width: 98%;
	max-width: 1200px;
	margin: 0rem auto;
	padding: 1px 0px;
}

.StyleF_Frame_ {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.StyleF_Frame_:before,
.StyleF_Frame_:after {
	content: "";
	display: block;
	width: calc((291 / 1200) * 100%);
	height: 0;
}
.StyleF_Frame_:before {
	order: 1;
}

.StyleF_Item_ {
	width: calc((291 / 1200) * 100%);
	margin-bottom: 0.75rem;
	padding: 9px 9px 11px 9px;
	background-color: #ffffff;
	box-shadow: 0px 0px 4px #b4b4b4;
	text-align: center;
}

.StyleF_Item_ a {
	color: inherit;
	font-size: 14px;
}
.StyleF_Item_ a:hover {
	text-shadow: 1px 0 1px #fba8ca;
}

.name1_,
.name_ {
	padding: 5px 0px 2px 0px;
	text-align: left;
	line-height: 1.3;
}

.price_ {
	padding: 5px 0px 7px 0px;
	font-weight: bold;
}

.comment_,
.rdt_,
.pre_sales_ {
	display: none;
}

/* smp btn */
.StyleF_Item_ .btn_ {
	width: 100%;
	margin: 4px auto 0px auto;
	background-color: #394458;
	font-size: 20px;
	text-align: center;
	line-height: 1.0;
}

.StyleF_Item_ .btn_ input {
	width: 100%;
	margin: 0px auto;
	padding: 9px 0px 6px 0px;
	border: 2px solid #ffffff;
	border-radius: 0;
	background-color: transparent;
	filter: drop-shadow(0px 0px 2px #ff5b5b);
	color: #ffffff;
}
.StyleF_Item_ .btn_ input.reservation_ {
	filter: drop-shadow(0px 0px 2px #23c0c8);
}

.StyleF_Item_ .btn_ span {
	display: block;
	width: 100%;
	margin: 0px auto;
	padding: 9px 0px 6px 0px;
	background-color: #c2c6cd;
	border: 2px solid #ffffff;
	box-shadow: 0px 0px 1px #8d8d8d;
	color: #ffffff;
}

@media (min-width: 1300px) {
	.goods_ {
		position: relative;
		z-index: 0;
	}

	.goods_:before {
		content: "Goods";
		display: inline-block;
		position: absolute;
		left: -184px;
		top: 76px;
		transform: rotate(-90deg);
		color: #394458;
		font-size: 99px;
		font-weight: bold;
		line-height: 1.0;
	}
	
	.StyleF_Item_ {
		z-index: 9999;
	}
	
}

@media (max-width: 992px) {

	.goods_ {
		width: 96%;
	}
	
	.StyleF_Item_ {
		width: 32%;
	}
}

@media (max-width: 640px) {

	.StyleF_Item_ {
		width: 49%;
	}

}

