@charset "utf-8";

/* @group Reset */

*{ margin: 0;padding: 0}
li
a { text-decoration : none}
img { vertical-align : middle}

/* @end */


/* @group Fluid-img */

img { max-width : 100%}

/* @end */

#wrapper {
	line-height: 1.5em;
	margin: 5em auto 0em auto;
	background-color: #FFFFFF;
	width: 80%;
	max-width: 1200px;
}
#wrapper #catch {
	margin: 0.5em;
	padding: 1em;
	border: 0.1em solid #000080;
	border-radius: 20px;
}

#wrapper #spec {
	
}


@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-15px);
  }
  60% {
    transform: translateY(15px);
  }
}

.bouncing-element {
  animation: bounce 1s infinite;
  display: inline-block;
  color: gold; /* アイコンの色をゴールドに変更 */
}


.youtube {
	width: 560px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 1em;
}
.spec_content {
	display: inline-block; /* インラインブロック化 */;
	vertical-align: top; /* 上端を揃える */;
	margin: 1px 0px;
	padding: 5px 7px 5px 7px;
	border: 1px solid #666666;
	background-color: #FFFFFF;

}

h1 {
	text-align: center;
	margin-top: 0em;
	margin-bottom: 0.5em;
}
h2 {
	margin-bottom: 0.5em;
	background-color: #b62069;
	padding-top: 0.25em;
	padding-bottom: 0.25em;
	padding-left: 1em;
	letter-spacing: 0.25em;
	margin-top: 1em;
	color: #FFFFFF;
}

h3 {
	border-radius: 3px;
	background-color: #666666;
	color: #FFFFFF;
	padding: 2px 10px 2px 10px;
	display: inline-block;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

h4 {
	border-radius: 5px;
	background-color: #996633;
	color: #FFFFFF;
	padding: 1px 5px 1px 5px;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	font-weight: normal;
}



.madeinjapan {
	text-align: right;
}
.li {
	margin-top: 0.5em;
	margin-left: 1em;
	margin-bottom: 0.5em;
	list-style-position: inside;
	list-style-image: url('../img/point_black.png');
}
ol {
	list-style-position: inside;
	margin-left: 1em;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.center {
 display: block;
 margin-left: auto;
 margin-right: auto;
}

.mokuji {
	font-size: small;
	padding-top: 1em;
	padding-left: 1em;
}


.left {
	float: left;
	margin-right: 1em;
}

.koumoku {
	background-color: #FFCCFF;
}
.midashi {
	border-radius: 5px;
	background-color: #666666;
	color: #FFFFFF;
	padding: 1px 5px 1px 5px;
	display: inline-block;
	margin-top: 1em;
	margin-bottom: 0.5em;
}

.order {

}

.order_border {
	padding: 1em;
	margin: 1em;
	border: 0.5px solid #808080;
	border-radius: 10px;
	display: inline-block;
	background-color: #F4F4F4;
	line-height: 2em;
}

.order_button_side {
	float: left;
	font-size: 0.8em;
	font-weight: 300;
	line-height: 1.5em;
}

.yayachisai {
	font-size:0.8em;
}

.nouki {
}

.mobile {
	display:none;
}


.lemonchiffon {
	padding: 3px 10px 3px 10px;
	background-color: lemonchiffon;
	margin-top: 0.5em;
	margin-bottom: 1em;
}

.block-head {
	display: inline-block;
	vertical-align: top;
	clear: both;
}
.clear-both {
	display: inline-block;
	float: left;
	clear: left;

}

.left-margin {
	margin:1em;
}

.right {
	text-align: right;
	display: inline-block;
	float: left;
	margin-right: 3em;
	vertical-align: bottom;
}
.device {
	margin: 0.5em;
	display: inline-block;
}

.waku {
	border-radius: 5px;
	border: 1px solid #008080;
	padding: 0.5em;
	margin: 1em 1em 2em 2em;
	display:inline-block
}

.migi {
	text-align:right
}

.alert-danger{color:#721c24;background-color:#f8d7da;border-color:#f5c6cb}

.scroll{
overflow: auto;　　　　/*tableをスクロールさせる*/
}
.scroll::-webkit-scrollbar{　　/*tableにスクロールバーを追加*/
 height: 5px;
}
.scroll::-webkit-scrollbar-track{　　/*tableにスクロールバーを追加*/
 background: #F1F1F1;
}
.scroll::-webkit-scrollbar-thumb {　　/*tableにスクロールバーを追加*/
 background: #BCBCBC;
}

.coupon-margin {
	margin-top: 1em;
	margin-bottom: 1em;
	margin-right: 1em;
}

/*FAQ*/

.faq{
  padding: 1em;
}
.faq dt{
  padding-bottom: 5px;
  margin-bottom: 5px;
  border-bottom: 1px dotted;
  font-weight: bold;
}
.faq dt:before{
  content: "Q";
  font-weight: normal;
  background: #cc0000;
  color: #fff;
  width: 1.5em;
  height: 1.5em;
  line-height: 1.6;
  text-align: center;
  display: inline-block;
  border-radius: 1em;
  margin-right: .5em;
}
.faq dd{
  margin-bottom: 2em;
}
.faq dd:last-child{
  margin-bottom: 0;
}

/*モバイル用メニュー非表示*/
.slicknav_menu {
 
display:none;
 
}
/* @end */
 
/*Media Queries*/
/*--- 表示領域が768px以下の場合に適用するスタイル ---*/
@media screen and (max-width: 768px) {
   
/*モバイル用メニュー表示*/

#wrapper {
	width: 95%;
	}


h1 {
	font-size: 1.5em;
}

.pc {
	display: none; 
	}
	
.youtube {
	display: none;
}

.syousai_link {
	display: none;
	}

	
.mobile {
	display: block;
}

#wrapper #catch {
	margin: 0px;
	width: 100%;
}

}

@media screen and (max-width: 480px) {
   /*--- 表示領域が480px以上の場合に適用するスタイル ---*/
   div.sample {height: 200px;}
}

.hyou {
	display: table-row;
}
.mobile_cart {
	margin-bottom: 2em;
}

.mb60 {
  margin-bottom: 10px;
}

.swiper-container {
  text-align: center;
}

.swiper-container .swiper-slide img,
.swiper-container .swiper-slide video {
  max-width: 100%;
  width: 100%;
  height: auto;
}

.prettyprint {
  border: none;
  background: #fafafa;
  color: #697d86;
}

#thumbs {
  height: 20%;
  box-sizing: border-box;
  padding: 10px 0;
}

#thumbs .swiper-slide {
  width: 20%;
  height: 100%;
  opacity: 0.2;
  cursor: pointer;
}

#thumbs .swiper-slide-active {
  opacity: 1;
}

details summary {
  color: #2c3e50;
  font-weight: bold;
  cursor: pointer;
  margin-bottom: 0.3em;
}

details p {
  color: #555;
  margin: 0 0 1em 1em;
  line-height: 1.6;
}