/* color
------------------------------------------------------------------*/

/* aModern */
#gContainer.aModern .infoArea{
	border-color:#baa487;
}
#gContainer.aModern .infoArea h2.name{
	background-color: #f1ede7;
}
#gContainer.aModern .infoArea .mylist a{
	background-color: #7c5b4b/*<-#533b30*/;
}
#gContainer.aModern .infoArea .mylist a:hover{
	background-color: #836a5f;
}
#gContainer.aModern a.zumenButton span,
#gContainer.aModern a.sizeImageButton span{
	background-color: #7c5b4b/*<-#533b30*/;
}
#gContainer.aModern a.zumenButton:hover span,
#gContainer.aModern a.sizeImageButton:hover span{
	background-color: #836a5f;
}

/* aSelect */
#gContainer.aSelect .infoArea{
	border-color:#b9c89a;
}
#gContainer.aSelect .infoArea h2.name{
	background-color: #ecf0e8;
}
#gContainer.aSelect .infoArea .mylist a{
	background-color: #6c946e;
}
#gContainer.aSelect .infoArea .mylist a:hover{
	background-color: #b9c89b;
}
#gContainer.aSelect a.zumenButton span,
#gContainer.aSelect a.sizeImageButton span{
	background-color: #6c946e;
}
#gContainer.aSelect a.zumenButton:hover span,
#gContainer.aSelect a.sizeImageButton:hover span{
	background-color: #b9c89b;
}

/* aNatural */
#gContainer.aNatural .infoArea{
	border-color:#aa9e77;
}
#gContainer.aNatural .infoArea h2.name{
	background-color: #eeece4;
}
#gContainer.aNatural .infoArea .mylist a{
	background-color: #ab9f78;
}
#gContainer.aNatural .infoArea .mylist a:hover{
	background-color: #c2b899;
}
#gContainer.aNatural a.zumenButton span,
#gContainer.aNatural a.sizeImageButton span{
	background-color: #ab9f78;
}
#gContainer.aNatural a.zumenButton:hover span,
#gContainer.aNatural a.sizeImageButton:hover span{
	background-color: #c2b899;
}


/* Detail 
------------------------------------------------------------------*/
#gMainBody .separate.col02 .col{
	line-height: 1.8;
}
.selectArea h3:first-child{
	margin-top: 0;
}


/* Detail 
------------------------------------------------------------------*/


/* .detailArea */
.detailArea h1{
	line-height: 1.3;
}
.detailArea h1 span.enName{
	display: block;	
	font-size: 70%;
}
.detailArea h1 .salesCopy { font-size: 70%; margin-bottom: 5px; }
.detailArea .successorProd {
	display: block;
	margin-top: -10px;
	margin-bottom: 10px;
}
.detailArea .photoInfo{
	margin: 0px 0 15px 0;
}


/* patternA */
.detailArea .patternA{
	margin: 0 0 10px 0;
}


/* patternB */
.detailArea .patternB{
	margin: 0 0 10px 0;
	width: 725px;
}
.detailArea .patternB .photos{
    overflow: hidden;
    _zoom: 1;
    width:750px;
    margin-right: -25px;
}
.detailArea .patternB .photos div{
	float: left;
	display: inline;
	width: 350px;
	margin: 0 25px 15px 0;
}

/* patternC */
.detailArea .patternC{
	margin: 0 0 10px 0;
	width: 725px;
}


/* slideshow
------------------------------------------------------------------*/
/* commmon */
#slideshow .thumbnail:hover {
	opacity: 0.8;
}
#slideshow .active {
	filter:alpha(opacity=100)!important;
	-moz-opacity: 1!important;
	opacity: 1!important;
	outline: 1px solid #808080;
	outline-offset: -1px;
}
#slideshow ul:not(.splide__pagination):after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}

#slideshow ul:not(.splide__pagination) {
	display: inline-block;
	overflow: hidden;
}
#slideshow .thum{
	display: block;
	width:84px;
	height: 60px;
}

/* patternA */
.detailArea .patternA #slideshow {
	margin: 0 auto;
	width: 725px;
	height: 390px;	
	text-align: left;
	position: relative;
}
.detailArea .patternA #slideshow div.image,
.detailArea .patternA #slideshow div.image2 {
	width: 546px;
	height: 390px;
	overflow: hidden;
	position: relative;
}
.detailArea .patternA #slideshow div.image div {
	top: 0;
	left: 0;
	position: absolute;
	display: none;
	width: 546px; height: 390px; /* IE8 opacity issue workaround */
}
.detailArea .patternA #slideshow div.image a.imageLink {
	position: absolute;
	top: 0px;
	left: 0px;
}
.detailArea .patternA #slideshow div.image a.prevBtn {
	position: absolute;
/*
	bottom: 10px;
	right: 77px;
*/
	top: calc(50% - 15px);
	left: 10px;
	z-index: 10;
}
.detailArea .patternA #slideshow div.image a.prevBtn.nozoom {
	right: 41px;
}
.detailArea .patternA #slideshow div.image a.zoomBtn {
	position: absolute;
	bottom: 10px;
	right: 41px;
	z-index: 10;
}
.detailArea .patternA #slideshow div.image a.listBtn,
.detailArea .patternA #slideshow div.image2 a.listBtn {
	position: absolute;
	bottom: 10px;
	right: 50%;
	z-index: 10;
	display: block;
	width: 32px;
	height: 32px;
	background-color: rgba(124,124,124,0.8);
	border-radius: 3px;
	transform: translateX(50%);
}
.detailArea .patternA #slideshow div.image a.listBtn img,
.detailArea .patternA #slideshow div.image2 a.listBtn img{
	display: block;
	margin: 4px 0px 0px 4px;
}
.detailArea .patternA #slideshow div.image a.listBtn.withNum,
.detailArea .patternA #slideshow div.image2 a.listBtn.withNum {
	width: auto;
	display: flex;
	align-items: center;
	text-decoration: none;
}
.detailArea .patternA #slideshow div.image a.listBtn.withNum span,
.detailArea .patternA #slideshow div.image2 a.listBtn.withNum span{
	color: #ffffff;
	font-size: 10px;
	margin: 0px 0px 0px 5px;
}
.detailArea .patternA #slideshow div.image a.listBtn.withNum img,
.detailArea .patternA #slideshow div.image2 a.listBtn.withNum img{
	margin: 4px 5px 5px 4px;
}

.detailArea .patternA #slideshow div.image a.vertViewBtn {
	position: absolute;
	bottom: 10px;
	right: 10px;
	z-index: 10;
	display: block;
	width: 32px;
	height: 32px;
	background-color: rgba(124,124,124,0.8);
	border-radius: 3px;
}
.detailArea .patternA #slideshow div.image a.vertViewBtn img{
	display: block;
	margin: 4px 0px 0px 4px;
}

.detailArea .patternA #slideshow div.image a.nextBtn {
	position: absolute;
/*
	bottom: 10px;
	right: 5px;
*/
	top: calc(50% - 15px);
	right: 10px;
	z-index: 10;
}
.detailArea .patternA #slideshow div.image a.itemListBtn,
.detailArea .patternA #slideshow div.image2 a.itemListBtn {
	position: absolute;
	bottom: 10px;
	left: 10px;
	z-index: 10;
	display: block;
	width: 32px;
	height: 32px;
	background-color: rgba(124,124,124,0.8);
	border-radius: 16px;
	box-shadow: 0px 0px 4px #000000;
}
.detailArea .patternA #slideshow div.image a.itemListBtn img,
.detailArea .patternA #slideshow div.image2 a.itemListBtn img{
	display: block;
	margin: 4px 0px 0px 4px;
}
.detailArea .patternA #slideshow div.image a.prevBtn img,
.detailArea .patternA #slideshow div.image a.nextBtn img {
	transform: scale(1.2);
	filter: brightness(1.4);
}

.detailArea .patternA #slideshow ul:not(.splide__pagination) {
	position: absolute;
	width:175px;
	top:0;
	right:0;
}
.detailArea .patternA #slideshow ul:not(.splide__pagination) li {
	width: 84px;
	height: 60px;
	float: left;
	display: inline;
	margin:0 3px 6px 0;
}

/* patternC */
.detailArea .patternC #slideshow {
	margin: 0 auto;
	width: 725px;
	height: 300px;
	text-align: left;
	position: relative;
}
.detailArea .patternC #slideshow div.image {
	width: 420px;
	height: 300px;
	overflow: hidden;
	position: relative;
}
.detailArea .patternC #slideshow div.image div {
	top: 0;
	left: 0;
	position: absolute;
	display: none;	
	width: 420px; height: 300px; /* IE8 opacity issue workaround */
}
.detailArea .patternC #slideshow div.image a.imageLink {
	position: absolute;	
	top: 0px;
	left: 0px;
}
.detailArea .patternC #slideshow div.image a.prevBtn {
	position: absolute;
	bottom: 10px;
	right: 41px;
	z-index: 10;
}
.detailArea .patternC #slideshow div.image a.nextBtn {
	position: absolute;
	bottom: 10px;
	right: 5px;
	z-index: 10;
}
.detailArea .patternC #slideshow ul {
	position: absolute;
	width:275px;
	top:0;
	left:435px;
}
.detailArea .patternC #slideshow ul li {
	width: 84px;
	height: 60px;
	float: left;
	display: inline;
	margin:0 5px 5px 0;
}

#imageNameInfoSpan { position: absolute; top: 5px; left: 5px; line-height: 1em; background-color: rgba(255,255,255,0.8); border: 1px solid gray; padding: 3px; z-index: 999; }
#imageNameInfoSpan:empty { display: none; }

/* itemDetailArea */
.itemDetailArea{}

.itemDetailArea .textArea{
	width:350px;
	float: left;
	display: inline;
}
.itemDetailArea .tableArea{
	width:350px;
	float: right;
	display: inline;	
}
.itemDetailArea .textArea .detail_brown{
	color: #6d4139;
	margin: 10px 0;
}

/*
a.detailGallery { display: block; position: relative; }
a.detailGallery::before {
	display: block; position: absolute; right: 5px; bottom: 5px; width: 31px; height: 31px;
	content: ""; background: url(/common/img/btn/btn_zoom01.png); background-size: contain;
}
*/


#galleryUp{
	position: absolute;
	z-index:calc(var(--z-overlay) + 1);
	border:1px solid #DCDDDD;
	background:#fff;
	width:650px;
	padding:10px 0 10px 0;
	top:-99999px;
}

#galleryUp #mainImgBox{
	position: relative;
	height:460px;
	margin: 0px 10px;
}

#galleryUp #mainImgBox .mainImg{
	position: absolute;
	top:-99999px;
	margin:0 !important;
	padding:0 !important;
}

#galleryUp .mainImg img{
	margin: 0px;
}

#galleryUp #galleryUpNaviBtn{
	text-align:center;
}

#galleryUp p{
	margin:0;
}
#galleryUp p#galleryUpNaviBtn img{
	margin: 0 10px;
	opacity:0.5;
	filter:alpha(opacity=50);
	-ms-filter: "alpha( opacity=50 )";	
}
#galleryUp p#galleryUpNaviBtn img.current{
	opacity:1;
	filter:alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	border: 2px solid #82283a;	
}

#galleryUp #closeBnt{
	text-align:right;
	margin:-20px 10px 6px 0;
}

#slidTexts{
	margin-top: 10px;
	min-height: 60px;
}
#slidTexts div.slidTextDiv {
	line-height: 1.4;
	margin: 0 0 15px;
	font-size: 99%;
}
#slidTexts div.slidTextDiv .imageTitle { font-size: 105%; font-weight: bold; margin-bottom: 10px; }
#slidTexts div.slidTextDiv .imageTitle:empty:not([contenteditable]) { display: none; }
#slidTexts div.slidTextDiv .imageNote { line-height: 1.5; }
#slidTexts div.slidTextDiv { /* flashing text workaround */
	display: none;
}
#slidTexts div.slidTextDiv#slidText1 { /* flashing text workaround */
	display: block;
}
/* itemInfoArea */
.itemInfoArea{
	width: 725px;
}
.itemInfoArea hr {
	margin: 10px 0px !important;
	border-color: #888;
}
.selectArea{
	float: 	left;
	display: inline;
	width: 405px;
}
.infoArea{
	float: 	right;
	display: inline;
	width: 300px;
	font-size: 95%;
}
.selectArea h3{

}
.selectList{
	margin-bottom: 10px;
}
.selectList li{
	border-bottom: 1px dotted #ccc;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 95%;
}
/* clearfix */
.selectList li:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
* html .selectList li {zoom: 1;}
*:first-child+html .selectList li {zoom: 1;}
.selectList li:hover{
	background-color: #fef6f4;
}

.selectList .size,
.selectList .color,
.selectList .option1,
.selectList .option2{
	float:left;
	font-weight: bold;
	font-size: 110%;
}
.selectList .price{
	float: right;
	font-weight: bold;
	font-size: 110%;
	color: #802837;
}
.selectList .price .tax{
	font-size: 80%;
}




.select01{
	text-align: center;
	padding: 5px 0 10px 0;
}
.select01 option{
	padding: 3px 3px;
	font-size: 100%;
}
.selectListArea{
	border: 3px solid #ccc;
}
.selectListArea ul{
	width: 380px;
	margin:10px 10px;
}
.selectListArea ul li{
	float: left;
	width: 185px;
	margin:0 5px 3px 0;
	font-size: 80%;
}
.selectListArea p{
	margin: 0 0 5px 10px;
	font-size: 95%;	
}
.selectArea table td{

}
.selectArea table td li label,
.selectArea table td li img,
.selectArea table td li li{
	vertical-align: middle;
}

.selectArea table td p{
	margin: 0;
}

.selectArea select { max-width: calc(100% - 16px); }


/* infoArea */
.infoArea{
	border: 2px solid #bc939a;
}


.infoAreaInner{}
.infoArea h2.name{
	background-color: #f2e9e7;
	text-align: center;
	padding: 8px 5px;
	font-weight: bold;
	font-size: 110%;
	line-height: 1.2;
}

.infoArea table{
	width:100%;
	/*border:1px solid #ccc;*/
	margin:0 0 15px 0;
}
.infoArea table th,
.infoArea table td{
	padding:5px 5px;
	border-bottom: 1px dotted #ccc;
}

.infoArea table tr.size th,
.infoArea table tr.size td,
.infoArea table tr.color th,
.infoArea table tr.color td,
.infoArea table tr.option1 th,
.infoArea table tr.option1 td,
.infoArea table tr.option2 th,
.infoArea table tr.option2 td{
	border-bottom: none !important;
}

.infoArea table tr.noOptionImage > td > div{
	width: 150px; box-sizing: border-box;
	border: 2px solid #802837;
	background-color: #fae8e3;
	padding: 5px 5px 3px 5px;
}
.infoArea table tr.noOptionImage > td > div .photo,
.infoArea table tr.noOptionImage > td > div .atp { text-align: left; }
.infoArea table tr.noOptionImage > td > div .price { text-align: right; font-size: inherit !important; }
.infoArea table tr.noOptionImage > td > div .price .tax { font-size: 70%; }
.infoArea table tr.noOptionImage > td > div .photo a { display: block; position: relative; }
.infoArea table tr.noOptionImage > td > div .photo a.showZoomIcon::before {
	display: block; position: absolute; right: 5px; bottom: 5px; width: 31px; height: 31px;
	content: ""; background: url(/common/img/btn/btn_zoom01.png); background-size: contain;
}
.infoArea table tr.noOptionImage > td > div .photo img { display: inline-block; width: 100%; aspect-ratio: 1400 / 1000; }

.infoArea table th{
	font-weight: bold;
	white-space:nowrap;
}
.infoArea table tr.price td{
	text-align: center;
}
.infoArea table tr td p{

	margin: 0 !important;
	padding: 0 !important;

}
.infoArea table td .price{
	font-weight: bold;
	font-size: 150%;
	color: #802837;
	line-height: 1.2;
	margin-bottom: 5px !important;
}
.infoArea table td .price .tax{
	font-size: 70%;
}
.infoArea table td .price .discountPercent{
	color: #fff;
	font-weight: bold;
	background-color: #802837;
	font-size: 60%;
	padding: 2px 5px;
	margin: 0 5px 0px 0;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	behavior: url(/common/js/PIE.htc);	
}
.infoArea table td .originalPrice{
	margin: 0;
	line-height: 1.5;
	font-size: 110%;
}
.infoArea table td .originalPrice,
.infoArea table td .originalPrice s{
	font-weight: bold;
}
.infoArea table td .originalPrice .tax{
	font-size: 80%;
}
.infoArea .badges .newsletterBadges { padding: 0px 0px 10px 0px; }
.infoArea .badges .newsletterBadges::before { content: "ニュースレター特典："; display: block; font-weight: bold; margin-bottom: 5px; }
.infoArea .badges .newsletterBadges:empty { display: none; }
.infoArea .badges .newsletterBadges a { display: inline-block; padding: 4px 10px; color: #333333 !important; border: 2px solid #333333; margin: 0px 10px 10px 0px; }
.infoArea .badges .newsletterBadges a img { width: 20px; height: auto; vertical-align: middle; margin-right: 3px; }
.infoArea .badges .serviceBadges { padding: 0px 0px 10px 0px; }
.infoArea .badges .serviceBadges::before { content: "安心のサービス："; display: block; font-weight: bold; margin-bottom: 5px; }
.infoArea .badges .serviceBadges:empty { display: none; }
.infoArea .badges .serviceBadges a { display: inline-block; padding: 4px 10px; color: #333333 !important; border: 2px solid #333333; margin: 0px 10px 10px 0px; }
.infoArea .badges .serviceBadges a img { width: 20px; height: auto; vertical-align: middle; margin-right: 3px; }
.infoArea table td .arrow{
	text-align: center;
	font-weight: bold;
	color: #802837;
	margin: 5px 0;
	line-height: 1.5;
}

.infoArea p.shippingFeeProductGroup em a { color: inherit; font-weight: inherit; }
.infoArea p.shippingFeeFree em { color: #802837; }

.infoArea table td .recomend{

}
.infoArea table td .recomend a{
	color: #802837;
	font-weight: bold;
}
.infoArea p.num{
	font-weight: bold;
	text-align: center !important;
}
.infoArea p.num select{
	box-sizing: border-box;
	width: 280px;
	height: 46px;
	padding: 0px 10px;
	font-size: 110%;
	color: #000000;
	background-color: #f2f2f2;
	border: 1px solid #d9d9d9;
}
.infoArea .cart{
	text-align: center;
}
.infoArea .cart a{
	display: block;
	width: 193px;
	margin: 0 auto;
	padding: 9px 0;
	border-radius: 5px;
	background-color: #e08023/*<-#595657*/;
}
.infoArea .cart a img{
	display: block;
}
.infoArea .cart a.amzn01 img{
	transform: scale(1.2);
	transform-origin: left;
}
.infoArea .cart span, .amazonPayAvailable{
	display: block;
	width: 193px;
	margin: 5px auto 0px auto;
	font-size: 12px;
	text-align:right;
}
.infoArea .cart span img, .amazonPayAvailable img{
	height: 18px;
	vertical-align: bottom;
	margin-right: 3px;
}
.infoArea .mylist{
	text-align: center;
}
.infoArea .mylist a{
	display: block;
	width: 193px;
	margin: 0 auto;
	padding:8px 0;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	behavior: url(/common/js/PIE.htc);	
}
.infoArea .mylist a:hover{
	cursor: pointer;
}
.infoArea .mylist a img{
	display: block;
}
.infoArea .contact{
	text-align: center;
	font-size: 80%;	
}
.infoArea p.atpAvailableQuantity,
.infoArea p.atp,
.infoArea span.delivAtp {
	color: #842c37;
	font-weight: bold;
}
.infoArea span.delivAtp {
	font-size: 110%;
}
.infoArea p.atpPaymentMethod,
.infoArea p.atpPostalCode,
.infoArea p.shippingFeePostalCode,
.infoArea p.delivOptionsPaymentMethod,
.infoArea p.delivOptionsPostalCode,
.infoArea p.delivOptionsNotice {
	font-size: 80%;
}
.infoArea p.atpPaymentMethod button,
.infoArea p.atpPostalCode button,
.infoArea p.shippingFeePostalCode button,
.infoArea p.delivOptionsPaymentMethod button,
.infoArea p.delivOptionsPostalCode button {
	font-size: inherit;
	padding: 3px;
	margin: 0px 0px 0px 3px;
}
.infoArea p.delivOptionsPostalCode a,
.infoArea p.delivOptionsPaymentMethod a {
	cursor: pointer;
}
.infoArea p.delivOptionsNotice {
	color: #842c37;
}
.infoArea a.delivDateButton{
	display: inline-block;
	color: #ffffff;
	background-color: #842c37;
	margin: 0 0 3px 0;
	padding: 5px 15px;
	border: none;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	text-decoration: none;
	cursor: pointer;
	behavior: url(/common/js/PIE.htc);
}
.infoArea a.delivDateButton:hover{
	background-color: #ad5e67 !important;
}
.infoArea .delivOptionsTd hr {
	margin: 10px 0px !important;
	border-color: #888;
}
.infoArea .delivOptionsTd .delivOptions dl dt {
	margin-top: 16px;
	font-weight: bold;
}
.infoArea .delivOptionsTd .delivOptions dl dd.services {
	margin-bottom: 3px;
}
.infoArea .delivOptionsTd .delivOptions dl dd.itemNames {
	padding: 2px 3px;
	margin: 5px 3px 0px 0px;
	font-size: 95%;
}
.infoArea .delivOptionsTd .delivOptions dl dd.itemNames:empty {
	display: none;
}
.infoArea .delivOptionsTd .delivOptions dl dd.listTitle {
	margin: 8px 0px 0px 0px;
	font-size: 90%;
}
.infoArea .smallNote { font-size: 90%; }
.infoArea .smallNote a.helpIcon::before { width: 1.2em; height: 1.2em; }
.infoArea .toggleDiv { position: relative; overflow: hidden; }
.infoArea .toggler {
	position: absolute; top: 0px; right: 0px;
	font-weight: bold; text-decoration: none; cursor: pointer;
}
.infoArea .toggler::before { content: "＋"; }
.infoArea .toggler.open::before { content: "－"; }
.infoArea .mmStatusOnCheckoutDiv label { color: #e08023; font-weight: bold; }
.infoArea .mmStatusOnCheckoutDiv label span { font-weight: inherit; }
.infoArea .mmStatusOnCheckoutDiv .showIfMmStatusOnCheckout { font-size: 80%; }
.infoArea .buttonsArea p { margin: 0px 0px 15px 0px !important; }
#gContainer a.zumenButton,
#gContainer a.sizeImageButton{
	display: inline-block;
	margin: 3px 0px 3px 0px;
}
#gContainer a.sizeImageButton.subImage{
	display: none;
}
#gContainer a.zumenButton span,
#gContainer a.sizeImageButton span{
	display: inline-block;
	margin: 0px 5px 0px 0px;
	padding:3px 8px 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	behavior: url(/common/js/PIE.htc);
}
#gContainer a.zumenButton img,
#gContainer a.sizeImageButton img{
	vertical-align: middle;
	width: 46px; height: 14px;
}

#glay {
  position: fixed!important;
  position: absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:var(--z-overlay);
  background-color:#1F1F1F;
  -moz-opacity: 0.8;
  opacity:.80;
  filter: alpha(opacity=80);
  display:none;
}

.noticeBox {
	display: block;
	color: #C06452;
	background-color: #F5F5F5;
	padding: 4px 0px 4px 4px;
	margin-bottom: 5px;
}

a.addToCartButton, a.openInquiry { cursor: pointer; }
a.openInquiry img { border-bottom: 1px solid #333; }

/* sampleBox */
#sampleBoxes .col{
	margin-bottom: 15px;	
}
#sampleBoxes .col img{
	cursor: pointer;
}
.sampleBox{
	display: none;
	background-color: #fff;
	padding: 10px;
}
.sampleBox dl{
	margin: 0 !important;
	padding: 0 !important;
}
.sampleBox dl dt{
	font-size: 120%;
	margin: 0 !important;
	padding: 0 !important;
}

#sampleBoxes + div {
	background-color: #ebebeb;
	padding: 10px 15px;
}
#sampleBoxes + div p:first-child {
	font-size: 90%;
}
#addSamplesToCartButton {
	background-color: #e08023;
	border-radius: 5px;
}

.fabricSampleOrderDiv {
	background-color: #ebebeb;
	padding: 10px 15px;
}
.fabricSampleOrderDiv p:first-child {
	font-size: 90%;
}
.fabricSampleOrderDiv .addFabricSamplesToCartButton {
	background-color: #e08023;
	border-radius: 5px;
}


/* cloth sample
------------------------------------------------------------------*/
div.clothsamplebox { width: 720px; background-color: #ffffff; padding: 10px; }
div.clothsamplebox .samplename { font-weight: bold; }
div.clothsamplebox .container { margin-top: 10px; }
div.clothsamplebox .sampleimg { float: left; width: 420px; }
div.clothsamplebox .sampledesc { float: left; width: 280px; margin-left:10px; }
@media all and (max-width: 740px) {
	div.clothsamplebox { width: 420px; }
	div.clothsamplebox .sampledesc { margin-left: 0px !important; margin-top: 10px; }
}

/* item zoom
------------------------------------------------------------------*/
#itemZoomDiv { background-color: #fff; margin: 0px; padding: 0px; border-radius: 7px; }
#itemZoomDiv div.mainbox { float: left; margin-top: 10px; margin-left: 10px; }
#itemZoomDiv div.textbox { float: left; margin-top: 10px; margin-left: 10px; height: 2em; font-size: 14px; overflow: hidden; }
#itemZoomDiv div.clear { clear: both; height: 0px; }
#itemZoomDiv img.main { width: 100%; height: 100%; }

/* other
------------------------------------------------------------------*/
.ul_indent { list-style: none outside none; padding: 0px; margin-bottom: 1em; font-size: 100%; }
.ul_indent li { padding-left: 1em; text-indent: -1em; }
.upd { font-weight: inherit; }
.cB85737 { color: #B85737; }
.cCC3300 { color: #CC3300; }

.productPageDraftMark { position: absolute; top:0px; left:50%; transform:translateX(-50%); font-size:12px; }
.productPageDraftMark span { color:#ffffff; background-color:#ff6060; padding:3px 10px; }
.productPageDraftMark a { margin-left: 10px; }

/* imageFlipSnap detail page specific
------------------------------------------------------------------*/
.imageFlipSnap.itemThumbnails { position: absolute; top: 0px; right:0px; width: 174px; height: 390px; }
.imageFlipSnap.itemThumbnails .viewport.vertical a.prev { width: calc(100% - 3px); }
.imageFlipSnap.itemThumbnails .viewport.vertical a.next { width: calc(100% - 3px); }
.imageFlipSnap.roomThumbnails { width: 720px; height: 84px; margin: 10px 0px 10px 0px; }

/* option image zoom icon
------------------------------------------------------------------*/
a.optionImage.showZoomIcon { display: inline-block; position: relative; }
a.optionImage.showZoomIcon::before {
	display: block; position: absolute; right: 5px; bottom: 5px; width: 31px; height: 31px;
	content: ""; background: url(/common/img/btn/btn_zoom01.png); background-size: contain;
}
span.optionImageNote { display: block; width: 224px; margin: 5px auto 0px auto; font-size: 85%; line-height: 1.5; text-align: left; }

/* page vert view
------------------------------------------------------------------*/
.pageVertView { width: 630px; margin: 0px auto; }
.pageVertView .item { margin: 0px 0px 30px 0px; position: relative; }
.pageVertView .item img,
.pageVertView .item video { display: block; width: 100%; height: auto; }
.pageVertView .item > div:nth-child(1) { margin-bottom: 10px; }
.pageVertView .item > div:nth-child(2) { margin: 0px 5px; }
.pageVertView .item .imageTitle { font-size: 105%; font-weight: bold; margin-bottom: 5px; }
.pageVertView .item .imageTitle:empty { display: none; }
.pageVertView .item .imageNote { line-height: 1.5; }

.pageVertView .withImageItemList { position: relative; }
.pageVertView .btnImageItemList {
	display: block;
	width: 28px;
	height: 28px;
	background-color: rgba(124,124,124,0.8);
	border-radius: 14px;
	box-shadow: 0px 0px 4px #000000;
	position: absolute;
	bottom: 10px;
	left: 10px;
	cursor: pointer;
}
.pageVertView .btnImageItemList img {
	display: block;
	width: 20px;
	height: 20px;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
.pageVertView .btnImageItemListBg {
	display: block;
	width: 72px;
	height: 72px;
	background-color: rgba(0,0,0,0);
	position: absolute;
	bottom: -19px;
	left: -19px;
	transform: translateZ(0);
}

/* roomDiv2
------------------------------------------------------------------*/
#idxIntCrd + div div.sysAccordion { max-height: calc(((100vw - 20px) / 1400 * 875 + 4em + 20px) * 10 + ((100vw - 20px) / 1400 * 875 / 2)); }
.roomDiv2 { display: flex; flex-direction: column; gap: 30px; margin: 0px; }
.roomDiv2 .item { width: 100%; display: flex; gap: 10px; }
.roomDiv2 .item > *:nth-child(1) { width: calc(60% - 5px); }
.roomDiv2 .item > *:nth-child(2) { width: calc(40% - 5px); }
.roomDiv2 .item a.image { display: block; }
.roomDiv2 .item a img { width: 100%; height: auto; }

.roomDiv2 .withImageItemList { display: block; position: relative; }
.roomDiv2 .withImageItemList .btnImageItemList {
	display: block;
	width: 28px;
	height: 28px;
	background-color: rgba(124,124,124,0.8);
	border-radius: 14px;
	box-shadow: 0px 0px 4px #000000;
	position: absolute;
	bottom: 5px;
	left: 5px;
	cursor: pointer;
}
.roomDiv2 .withImageItemList .btnImageItemList img {
	display: block;
	width: 20px;
	height: 20px;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
.roomDiv2 .withImageItemList .btnImageItemListBg {
	display: block;
	width: 72px;
	height: 72px;
	background-color: rgba(0,0,0,0);
	position: absolute;
	bottom: -17px;
	left: -17px;
	transform: translateZ(0);
}

/* roomsDiv
------------------------------------------------------------------*/
#roomsDiv .withImageItemList { display: block; position: relative; }
#roomsDiv .withImageItemList .btnImageItemList {
	display: block;
	width: 28px;
	height: 28px;
	background-color: rgba(124,124,124,0.8);
	border-radius: 14px;
	box-shadow: 0px 0px 4px #000000;
	position: absolute;
	bottom: 3px;
	left: 3px;
	cursor: pointer;
}
#roomsDiv .withImageItemList .btnImageItemList img {
	display: block;
	width: 20px;
	height: 20px;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
#roomsDiv .withImageItemList .btnImageItemListBg {
	display: block;
	width: 72px;
	height: 72px;
	background-color: rgba(0,0,0,0);
	position: absolute;
	bottom: -19px;
	left: -19px;
	transform: translateZ(0);
}
