@charset "euc-jp";
/*----------------------------------------------------------------
 category
----------------------------------------------------------------*/
@media screen and (max-width: 768px) {
#buy{
	position: relative;
	top: -70px;
}
}
/*-----------------------------------------------------
 buy-button
-----------------------------------------------------*/
.buy-button{
	position			: fixed;
	right				: 0;
	bottom				: 0;
	z-index				: 3;
	opacity				: 0;
	transition			: opacity 0.65s;
}

.buy-button.isActive {
	opacity				: 1;
	transition			: opacity 0.65s;
}
.buy-button.isActive:hover{ opacity: 0.8; }
@media screen and (max-width: 768px) {
.buy-button{ width: 70px; }
}

/*----------------------------------------------------------------
 styles : #item under
----------------------------------------------------------------*/
#item a{ color: #006084; }


/*-----------------------------------------------------
 product-image
-----------------------------------------------------*/
#item .product-image{ margin-bottom: 5px; }
#item .product-image img{
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

@media screen and (min-width: 769px) {
#item .product-image{ margin-bottom: 30px; }
}


/* bxslider
-----------------------------------------------------*/
.bx-wrapper{ margin-bottom: 0!important; }
.bx-wrapper .bx-viewport{
	border				: none!important;
	box-shadow			: none!important;
}
#item .product-image .bx-wrapper .bx-viewport { left: 0!important; }

#item .bx-wrapper .bx-viewport img{
	width				: 100%;
	height				: auto;
}

@media screen and (max-width: 768px) {
#item .bx-wrapper .bx-viewport li{ width: calc(100vw - 40px)!important; }
#item .bx-wrapper .bx-viewport img{
	width				: 100%!important;
	height				: auto!important;
	max-width			: auto!important;
}
}

/*-----------------------------------------------------
 item-data
-----------------------------------------------------*/
#item .item-data{
	-js-display			: flex; /* IE */
	display				: -webkit-flex; /* Safari */
	display				: flex;
	flex-direction		: column;
	margin-bottom		: 30px;
}

@media screen and (min-width: 769px) {
#item .item-data{
	flex-direction		: row;
	justify-content		: space-between;
}
#item .item-data .image,
#item .item-data .data{ flex: 0 0 47.5%; }
}

/* image
-----------------------------------------------------*/
/*---------------------------------
 custom-thumb
---------------------------------*/
#item .custom-thumb{
	-js-display			: flex; /* IE */
	display				: -webkit-flex; /* Safari */
	display				: flex;
	justify-content		: flex-start;
	flex-wrap			: wrap;
	gap: 5px;	
}
#item .custom-thumb li{
	list-style			: none;
	margin				: 0 0 5px 0;
	width				: calc(calc(100% - 20px) / 5);
	background			: #006084;
}
#item .custom-thumb li img{
	width				: 100%;
	aspect-ratio		: 1 / 1;
	object-fit			: cover;
}

#item .custom-thumb li img:hover{ opacity: 0.5 }
/* #item .custom-thumb li .active img{ outline: 3px solid #006084; } */

@media screen and (min-width: 769px) {
#item .custom-thumb li{
	width				: calc(calc(100% - 25px) / 6);
}
}


/* data
-----------------------------------------------------*/
/*---------------------------------
 title
---------------------------------*/
#item .item-data .title{
	margin				: 20px 0;
	text-align			: center;
	line-height			: 1.5;
	font-family			: "ÞâÌÀÄ«", YuMincho,  "Hiragino Mincho ProN W3", "¥Ò¥é¥®¥ÎÌÀÄ« ProN W3", "Hiragino Mincho ProN","Sawarabi Mincho", "HGÌÀÄ«E", "£Í£Ó £ÐÌÀÄ«", "£Í£Ó ÌÀÄ«", serif;
	font-weight			: normal;
	font-size			: 2rem;
}
@media screen and (min-width: 769px) {
#item .item-data .title{
	margin				: 0 0 15px 0;
	text-align			: left;
	font-size			: 3rem;
}
}

/*---------------------------------
 price
---------------------------------*/
#item .item-data .price{
	text-align			: center;
	line-height			: 1;
	font-family			: "ÞâÌÀÄ«", YuMincho,  "Hiragino Mincho ProN W3", "¥Ò¥é¥®¥ÎÌÀÄ« ProN W3", "Hiragino Mincho ProN","Sawarabi Mincho", "HGÌÀÄ«E", "£Í£Ó £ÐÌÀÄ«", "£Í£Ó ÌÀÄ«", serif;
	font-size			: 2rem;
	font-weight			: normal;
}
#item .item-data .price .free{ font-size: 1.8rem; }
#item .item-data .price small{ font-size: 1.2rem; }
@media screen and (min-width: 769px) {
#item .item-data .price{
	text-align			: left;
	font-size			: 3rem;
}
  #item .item-data .price .free{ font-size: 2.4rem; }
#item .item-data .price small{ font-size: 1.6rem; }
}

/* sale */
#item .item-data .price dl dt,
#item .item-data .price dl dd{ display: inline-block; }
#item .item-data .price dl dt,
#item .item-data .price dl.regular{ font-size: 1.6rem; }
#item .item-data .price dl.regular{ margin: 0 0 10px 0; }
#item .item-data .price dl.sale{ color: #cc0000; }
#item .item-data .price dl.sale dd{ font-size: 2rem; }

@media screen and (min-width: 769px) {
#item .item-data .price dl dt,
#item .item-data .price dl.regular{ font-size: 2rem; }
#item .item-data .price dl.regular{ margin: 0 0 15px 0; }
#item .item-data .price dl.sale dd{ font-size: 3rem; }
}

/*---------------------------------
 option
---------------------------------*/
#item .item-data .option{ margin: 20px 0; }
#item .item-data .option .option-select{ margin: 10px 0; }

/*---------------------------------
 table-bordered
---------------------------------*/
#item .item-data .table-bordered {
	border				: 1px solid #ccc;
	border-radius		: 0px;
	font-size			: 13px;
}
#item .item-data .option .table-bordered th,
#item .item-data .table-bordered td {
	border-left			: 1px solid #ccc;
	border-radius		: 0px!important;
}
#item .item-data .option .table-bordered th:first-child,
#item .item-data .table-bordered td:first-child{ border-left: 0px solid #ccc; }
#item .item-data .option .table-bordered caption + thead tr:first-child th,
#item .item-data .option .table-bordered caption + tbody tr:first-child th,
#item .item-data .option .table-bordered caption + tbody tr:first-child td,
#item .item-data .option .table-bordered colgroup + thead tr:first-child th,
#item .item-data .option .table-bordered colgroup + tbody tr:first-child th,
#item .item-data .option .table-bordered colgroup + tbody tr:first-child td,
#item .item-data .option .table-bordered thead:first-child tr:first-child th,
#item .item-data .option .table-bordered tbody:first-child tr:first-child th,
#item .item-data .option .table-bordered tbody:first-child tr:first-child td { background: #ddddcf; }


/*---------------------------------
 submit
---------------------------------*/
#item .item-data .submit{
	display				: block;
	border				: none;
	width				: 100%;
	padding				: 16px 0;
	background			: #006084;
	font-size			: 1.2rem;
	color				: #FFF;
}
@media screen and (min-width: 769px) {
#item .item-data .submit{
	padding				: 26px 0;
	font-size			: 1.6rem;
}
}

/*---------------------------------
 count
---------------------------------*/
#item .item-data .count{ margin: 20px 0; }
@media screen and (max-width: 768px) {
#item .item-data .count{ text-align: center; }
}

#item .item-data .count input[type="text"]{
	border				: 1px solid #ccc;
	border-radius		: 0;
	width				: 3em;
	background			: #FFF;
}
#item .item-data .count .changer{ display: inline-block; }
#item .item-data .count .changer a{ text-decoration: none; }
#item .item-data .count .changer span{
	cursor				: pointer;
	color				: #006084;
}
#item .item-data .count .changer span:hover{ color: #80b0c2 }


/*---------------------------------
 more
---------------------------------*/
#item .item-data .more{
	margin				: 10px 0;
	font-size			: 1.2rem;
}
#item .item-data .more li{ list-style: none; }

/*-----------------------------------------------------
 content / over write common style
-----------------------------------------------------*/


/* headings
-----------------------------------------------------*/
#item .content>h3{ margin: 10px 0 20px 0; }

@media screen and (min-width: 769px) {
#item .content>h3{ margin: 10px 0 20px 0; }
}


/* column
-----------------------------------------------------*/
#item .content .column{ margin: 0; }
@media screen and (min-width: 769px) {
#item .content .column{ margin: 0; }
.content .column + .column{ margin: 0; }
}

/* special
-----------------------------------------------------*/
#item .content .special{ margin: 0; }
@media screen and (min-width: 769px) {
#item .content .special{ margin: 0; }
}

/* spec
-----------------------------------------------------*/
#item .content .spec{ margin: 0; }
@media screen and (min-width: 769px) {
#item .content .spec{ margin: 0; }
}

/* furusato
-----------------------------------------------------*/
@media screen and (min-width: 769px) {
#item .content .furusato{ margin-bottom: 0; }
}