/**
 * スマホ解像度
 * HUAWEI(P20)　横599、縦360
 * HUAWEI(P30)　横703、縦360
 * iPhone　横896、縦480
 */

@media only screen and (max-width: 1220px) {

	.pc-only {
		display: none;
	}
}

@media only screen and (max-width: 1200px) {

	#header-navi-wrapper {
		display: none;
	}
}

#owner-header {

	height: 65px;
	padding: 0px 0px 10px 10px;
	border-bottom: 1px dotted #000000;
}

@media screen and (max-width: 1200px) {

	#owner-header {
		height: 110px;
	}
}

@media screen and (max-width: 640px) {

	#owner-header {
		height: 80px;
	}
}

#owner-logo {

	float: left;
	width: 200px;
}

@media only screen and (max-width: 1200px) {

	#owner-logo {

		float: none;
		margin: 0px 0px 10px 0px;
	}
}

@media screen and (max-width: 640px) {

	#owner-logo {

		width: 150px;
		margin: 5px 0px 0px 0px;
	}
}

.product-search {

	display: table;
	width: 35%;
	margin: 10px 10px 0px 30px;
	/*background-color: #ff0000;*/
}

@media only screen and (max-width: 1200px) {

	.product-search {
		width: 50%;
		margin: 5px 10px 0px 5px;
	}
}

@media screen and (max-width: 1000px) {

	.product-search {
		width: 80%;
		margin: 5px 0px 0px 5px;
	}
}

@media screen and (max-width: 640px) {

	.product-search {
	}
}

.search-category {

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 30%;
	margin: 0;
	padding: 0px 5px;
	height: 35px;
	border-top: 2px solid #a57bb5;
	border-bottom: 2px solid #a57bb5;
	border-left: 2px solid #a57bb5;
	border-radius: 7px 0px 0px 7px;
	outline: 0;
	vertical-align : top;
	font-size: 18px;
	font-size: 0.18rem;
	background: rgb(240, 240, 240);
	background: linear-gradient(180deg, rgba(240, 240, 240, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(240, 240, 240, 1) 100%);
}

@media screen and (max-width: 1200px) {

	.search-category {

		height: 30px;
		font-size: 16px;
		font-size: 0.16rem;
	}
}

@media screen and (max-width: 1000px) {

	.search-category {
		width: 20%;
	}
}

@media screen and (max-width: 640px) {

	.search-category {

		width: 30%;
		height: 25px;
		font-size: 14px;
		font-size: 0.14rem;
	}
}

.search-box, .search-button {

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-appearance: none;
	-moz-appearance: none;
	margin: 0;
	padding: 0;
	height: 35px;
	border: 2px solid #a57bb5;
	outline: 0;
	vertical-align : top;
	font-size: 18px;
	font-size: 0.18rem;
}

@media screen and (max-width: 1200px) {

	.search-box, .search-button {

		height: 30px;
		font-size: 16px;
		font-size: 0.16rem;
	}
}

@media screen and (max-width: 640px) {

	.search-box, .search-button {

		height: 25px;
		font-size: 14px;
		font-size: 0.14rem;
	}
}

.search-box {

	width: 60%;
	padding: 0px 0px 0px 5px;
}

@media screen and (max-width: 1200px) {

	.search-box {

		width: 50%;
	}
}

@media screen and (max-width: 1000px) {

	.search-box {

		width: 60%;
	}
}

@media screen and (max-width: 640px) {

	.search-box {

		width: 40%;
	}
}

.search-button {

	width: 10%;
	color: #ffffff;
	background-color: #a57bb5;
	font-weight: bold;
	border-radius: 0px 7px 7px 0px;
}

@media screen and (max-width: 1200px) {

	.search-button {
		width: 15%;
	}
}

@media screen and (max-width: 640px) {

	.search-button {

		width: 20%;
		font-size: 14px;
		font-size: 0.14rem;
		font-weight: normal;
	}
}

.header-icon-wrapper {

	float: left;
	margin: 5px 10px 0px 10px;
}

@media screen and (max-width: 1000px) {

	.header-icon-wrapper {

		float: right;
		margin: 0px 5px 0px 0px;
	}
}

.header-icon-wrapper a {
	color: #000000;
}

.header-icon {
	width: 30px;
	margin: 0 auto;
}

@media screen and (max-width: 640px) {

	.header-icon {
		width: 25px;
	}
}

.header-icon-title {

	font-size: 12px;
	font-size: 0.12rem;
}

@media screen and (max-width: 640px) {

	.header-icon-title {

		font-size: 10px;
		font-size: 0.10rem;
	}
}

.cart-product-count {

	font-size: 13px;
	font-size: 0.13rem;
}

#member-icons {

	float: right;
	margin: 10px 0px 0px 0px;
}

@media screen and (max-width: 610px) {

	#member-icons {
		display: none;
	}
}

.member-icon-wrapper {

	float: left;
	margin: 0px 0px 0px 10px;
}

.member-icon-wrapper a {
	color: #000000;
}

.member-icon {

	width: 50px;
	margin: 0 auto;
}

.member-icon-title {

	text-align: center;
	font-size: 10px;
	font-size: 0.10rem;
}

.member-header-msg {

	float: right;
	margin: 15px 0px 0px 0px;
	font-weight: bold;
}

@media screen and (max-width: 1000px) {

	.member-header-msg {
		display: none;
	}
}

#member-name {

	font-size: 18px;
	font-size: 0.18rem;
	font-weight: bold;
}

@media screen and (max-width: 1080px) {

	#member-name {

		font-size: 18px;
		font-size: 0.18rem;
	}
}

.member-point {

	float: left;
	margin: 15px 5px 0px 0px;
	color: #ffffff;
	background-color: #ff0000;
	font-size: 14px;
	font-size: 0.14rem;
	font-weight: bold;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	text-align: center;
}

@media screen and (max-width: 480px) {

	.member-icon-title {
		/*display: none;*/
	}

	.member-point {
		margin: 10px 10px 0px 0px;
	}
}

.category-icon {

	width: 25px;
	margin-right: 7px;
}

.category-menu {

	color: #000000;
	text-decoration: none;
	font-weight: bold;
	font-size: 14px;
	font-size: 0.14rem;
	position: relative;
	display: table;
	width: 100%;
	overflow: hidden;
}

.gb-menu {

	color: #000000;
	text-decoration: none;
	font-weight: bold;
	font-size: 14px;
	font-size: 0.14rem;
	position: relative;
	display: table;
	width: 100%;
	overflow: hidden;
}

.category-menu:hover {
	background-color: #cccccc;
}

.category-name {
	padding: 3px 0px 0px 0px;
}

.sub-category {

	position: absolute;
	left: 175px;
	background-color: #fafafa;
	border: 1px solid #333333;
	border-radius: 0.2em;
	padding: 10px;
	z-index: 9999;
	white-space:nowrap;
	display: none;
}

.category-menu:hover + .sub-category {
	display: block;
}

.sub-category:hover {
	display: block;
}

.product-ranking-wrapper {

	background-color: #ffff99;
	border: 1px solid #cccccc;
	padding: 5px;
}

.ranking-image {

	width: 80px;
	margin-right: 10px;
}

.ranking {

	color: #ff0000;
	font-size: 12px;
	font-size: 0.12rem;
	font-weight: bold;
}

.ranking-body {
	width: 98px;
}

.ranking-name {

	font-size: 12px;
	font-size: 0.12rem;
}

.block-grid li:hover {
	background-color: #f0f0f0;
}

.block-grid a {
	color: #000000;
}

.product-content {

	/*border: 1px solid #000000;*/
	padding: 10px;
}

.product-price {

	color: #ff0000;
	font-weight: bold;
}

.product-price2 {

	font-size: 15px;
	font-size: 0.15rem;
	font-weight: normal;
}

.product-point {

	font-size: 12px;
	font-size: 0.12rem;
	color: #ff0000;
}

.product-name {
	/*height: 75px;*/
	height: 25px;
}

.product-name a {
	color: #0000ff;
}

.product-name:hover {
	text-decoration: underline;
}

a.admin-link {

	color: #0000ff;
	text-decoration: underline;
}

.product-button {

	display: block;
	border-radius: 10px;
	padding: 10px 10px 10px 10px;
	text-align: center;
	text-decoration: none;
	font-size: 16px;
	font-size: 0.16rem;
	font-wieght: bold;
	border-width: 1px;
	border-type: solid;
	margin: 0px 10px 0px 0px;
}

.product-normal {

	border-color: #0000ff;
	background-color: #0000ff;
	color: #ffff;
}

.product-active {

	border-color: #66CD1C;
	background-color: #66CD1C;
	color: #ffff;
}

#cart-button {

	display: block;
	/*border-radius: 10px;*/
	width: 300px;
	background: #990000;
	padding: 10px 0px 10px 0px;
	text-align: center;
	text-decoration: none;
	font-size: 22px;
	font-size: 0.22rem;
	font-wieght: bold;
	border: 1px solid #ff0000;
	margin: 10px auto 10px auto;
	color: #ffff;
}

label.product-form-label {

	color: #0000ff;
	text-decoration: underline;
}

#credit-order {

	display: block;
	border-radius: 10px;
	width: 315px;
	background: #ff0000;
	padding: 15px 0px 15px 0px;
	text-align: center;
	text-decoration: none;
	font-size: 22px;
	font-size: 0.22rem;
	font-wieght: bold;
	border: 1px solid #ff0000;
	margin: 10px auto 10px auto;
	color: #ffff;
}

.category-topic-path {

	font-size: 12px;
	font-size: 0.12rem;
	margin-bottom: 5px;
}

.btn-container-left {
	float: left;
}

.btn-container-right {
	float: right;
}

.list-btn {

	/*border: 1px solid #cccccc;*/
	width: 30px;
	text-align: center;
}

.list-btn a {

	display: block;
	text-decoration: none;
	font-weight: bold;
	font-size: 18px;
	background-color: #ffffff;
	color: #333333;
	/*background-color: #333333;
	color: #ffffff;*/
}

.list-btn a:hover {

	/*text-decoration: underline;*/
	background-color: #ffffff;
	color: #333333;
}

.btn-left {

	position: relative;
	top: 160px;
}

.btn-right {

	position: relative;
	top: 160px;
}

.product-list2 {

	display: flex;
	overflow-x: auto;
}

.product-content2 {

	width: 220px;
	flex-shrink: 0;
	padding: 10px 10px 10px 10px;
	height: 320px;
}

.product-content2:hover {
	background-color: #f0f0f0;
}

.product-image {

	width: auto;
	text-align: center;
	margin-bottom: 10px;
}

.product-image2 {

	width: 220px;
	height: 220px;
	text-align: center;
	margin-bottom: 10px;
}

.product-btn-left {

	position: relative;
	top: 165px;
}

.product-btn-right {

	position: relative;
	top: 165px;
}

#product-image-container {

	float: left;
	width: 558px;
	margin: 0px 0px 0px 15px;
	padding: 0px;
	/*background-color: #0000ff;*/
}

@media screen and (max-width: 558px) {

	#product-image-container {

		float: none;
		width: 100%;
		margin: 0px 0px 20px 0px;
	}
}

.product-image-detail {

	display: flex;
	overflow-x: auto;
}

.product-image-content {

	/*width: 335px;*/
	width: 500px;
	flex-shrink: 0;
}

@media screen and (max-width: 558px) {

	.product-image-content {
		width: 100%;
	}
}

#product-descriptions {

}

#product-image-dots {

	margin: 0px auto 20px auto;
	/*background-color: #ff0000;*/
}

#product-image-dots button {

	float: left;
	color: transparent;
	outline: none;
	width: 8px; /*ドットボタンのサイズ*/
	height: 8px; /*ドットボタンのサイズ*/
	display: block;
	border-radius: 50%;
	/*background: #ccc; /*ドットボタンの色*/
	cursor: pointer;
	overflow: visible;
	border-style: 0;
	padding: 0;
	border-style: none;
	margin: 0px 5px;
}

#product-image-dot0 {
	background: #000000; /*ドットボタンの色*/
}

#product-image-dot1,
#product-image-dot2,
#product-image-dot3,
#product-image-dot4 {
	background: #cccccc; /*ドットボタンの色*/
}

#product-thumbnail {
	margin: 0px auto;
}

.product-thumbnail-content {

	float: left;
	width: 50px;
	margin: 0px 8px;
}

#product-thumbnail-content0 {
	border: 1px solid #000000;
}

#product-thumbnail-content1,
#product-thumbnail-content2,
#product-thumbnail-content3,
#product-thumbnail-content4 {
	opacity: 0.5;
}

#product-detail-container {

	float: right;
	width: 372px;
}

@media screen and (max-width: 1220px) {

	#product-detail-container {
		width: 572px;
	}
}

@media screen and (max-width: 1200px) {

	#product-detail-container {
		width: 100%;
	}
}

#product-option-name {

	font-size: 18px;
	font-size: 0.18rem;
	font-weight: bold;
	margin: 0px 0px 5px 0px;
}

#product-option {

	color: #000000;
	text-decoration: none;
}

#product-option-price {

	/*border-top: 2px solid #000000;
	border-bottom: 2px solid #000000;*/
	margin: 0px 0px 15px 0px;
}

#product-option-price0 {
	display: block;
}

#product-option-price1,
#product-option-price2,
#product-option-price3,
#product-option-price4 {
	display: none;
}

#product-detail-content {
	margin: 0px 0px 15px 0px;
}

#product-detail-content0 {
	display: block;
}

#product-detail-content1,
#product-detail-content2,
#product-detail-content3,
#product-detail-content4,
#product-detail-content5 {
	display: none;
}

#product-sales-container {

	float: left;
	width: 558px;
	margin: 0px 0px 0px 15px;
	padding: 0px;
	/*background-color: #0000ff;*/
}

@media screen and (max-width: 1200px) {

	#product-sales-container {

		float: none;
		width: 100%;
		margin: 0px 0px 20px 0px;
	}
}

#product-movie {

	width: 100%;
	aspect-ratio: 16 / 9;
	margin-bottom: 15px;
}

#product-movie iframe {

	width: 100%;
	height: 100%;
}

#promotion-document-title {

	font-weight: bold;
	border-bottom: 1px solid #000000;
}

#product-documents {

	margin: 0px auto 15px auto;
	text-align: center;
}

.product-document {

	float: left;
	width: 50px;
}

#cart-form-container {

	float: right;
	width: 372px;
}

@media screen and (max-width: 1220px) {

	#cart-form-container {
		width: 572px;
	}
}

@media screen and (max-width: 1200px) {

	#cart-form-container {

		float: none;
		width: 100%;
		margin: 0px 0px 20px 0px;
	}
}

#quotation {

	border-top: 1px solid #333333;
	border-bottom: 1px solid #333333;
	padding: 8px 0px;
	margin: 0px 0px 15px 0px;
}

#product-selector-wrapper {
	margin: 0px 0px 15px 0px;
}

.product-option-selector-left {

	margin-right: 5px;
	width: calc(50% - 5px);
	float: left;
}

.product-option-selector-right {

	width: 50%;
	float: left;
}

#selector-button0 {

	color: #000000;
	border: 1px solid #000000;
	background-color: #f0f0f0;
}

#selector-button1,
#selector-button2,
#selector-button3,
#selector-button4,
#selector-button5 {

	color: #333333;
	border: 1px solid #cccccc;
	background-color: #ffffff;
}

.selector-button {

	display: block;
	padding: 5px;
	font-size: 14px;
	font-size: 0.14rem;
	text-decoration: none;
	margin: 0px 0px 5px 0px;
}

.product-option-selector:hover {
	text-decoration: underline;
}

#cart-form {

	padding: 15px;
	background-color: #ffe4c4;
	border-radius: 5px;
}

#cart-form0 {
	display: block;
}

#cart-form1,
#cart-form2,
#cart-form3,
#cart-form4,
#cart-form5 {
	display: none;
}

.product-option-deadline {

	text-align: center;
	margin: 0px auto 5px auto;
}

.product-count {

	width: 300px;
	margin: 0px auto 15px auto;
}

.product-in-stock {

	font-size: 17px;
	font-size: 0.17rem;
	font-weight: bold;
	margin: 3px 30px 0px 50px;
}

.product-count-selector {

	padding: 5px;
	font-size: 0.16rem;
	font-size: 16px;
	margin: 0px 0px 0px 10px;
}

.auto-height {

	height: 100%;
	width: auto;
}

.product-icon {

	float: left;
	width: 45px;
	margin-right: 5px;
}

.product-icon-select {
	width: 45px;
}

.client-btn-left {

	position: relative;
	top: 125px;
}

.client-btn-right {

	position: relative;
	top: 125px;
}

.client-list {

	display: flex;
	overflow-x: auto;
}

.client-content {

	width: 270px;
	flex-shrink: 0;
	padding: 10px 10px 10px 10px;
	margin-right: 10px;
	/*border: 1px solid #000000;*/
}

.client-content:hover {
	background-color: #f0f0f0;
}

.client-name {
	margin-bottom: 5px;
}

.client-name a {

	font-weight: bold;
	color: #000000;
}

.client-name a:hover {

	color: #0000ff;
}

.client-image {

	text-align: center;
	height: 250px;
	margin-bottom: 5px;
}

.client-info a {

	color: #000000;
	font-size: 13px;
	font-size: 0.13rem;
}

#client-info {

	width: 90%;
	padding: 15px;
	margin: 0px auto 40px auto;
	border: 1px solid #9c9c9c;
}

#client-logo {

	float: left;
	width: 480px;
	margin: 0px 30px 0px 0px;
}

@media screen and (max-width: 800px) {

	#client-logo {

		float: none;
		width: 100%;
		margin: 0px 0px 20px 0px;
		/*background-color: #ff0000;*/
	}
}

#client-body {

	float: left;
	text-align: left;
	width: calc(100% - 510px);
}

@media screen and (max-width: 800px) {

	#client-body {

		float: none;
		width: 100%;
		margin: 0px 0px 20px 0px;
	}
}

#client-title {

	font-weight: bold;
	border-bottom: 1px solid #000000;
	margin: 0px 0px 15px 0px;
}

#client-greeting {
	margin: 0px 0px 0px 0px;
}

#client-detail {

	margin: 0px auto;
}

#sctl {

	background-color: #cccccc;
	padding: 20px 50px 20px 50px;
	margin: 0px 0px 20px 0px;
}

#sctl-title {

	font-size: 18px;
	font-size: 0.18rem;
	font-weight: bold;
	border-bottom: 2px solid #000000;
	padding: 5px 0px 5px 0px;
	margin: 0px 0px 15px 0px;
	text-align: center;
}

.sctl-content {

	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 25% 25% 25% 25%;
}

@media screen and (max-width: 1080px) {

	.sctl-content {
		display: block;
	}
}

.sctl-content-body {
	padding: 0px 10px;
}

@media screen and (max-width: 1080px) {

	.sctl-content-body {
		padding: 0px 0px;
	}
}


.sctl-content-title {

	font-weight: bold;
	margin: 0px 0px 15px 0px;
	text-align: center;
}

#footer-menu-spacer {

	display: none;
	height: 55px;
}

#footer-menu {

	display: none;
	position: fixed;
	bottom: 0;
	z-index: 9999;
	width: 100%;
	background-color: #ffffff;
	border-top: 1px solid #999999;
	padding: 10px;
}

@media only screen and (max-width: 1080px) {

	#footer-menu-spacer, #footer-menu {
		display: block;
	}
}

#footer-buttons {

	width: 300px;
	margin: 0px auto;
}

#footer-menu-wrapper {

	width: 220px;
	margin: 0 auto;
}

.footer-icon-wrapper {

	float: left;
	margin: 0px 3px 0px 3px;
}

.footer-icon-wrapper a {
	color: #000000;
}

.footer-icon {

	width: 40px;
	margin: 0 auto;
}

.footer-icon-title {

	font-size: 0.10rem;
	font-size: 10px;
}

.footer-cart-icon {

	width: 28px;
	margin: 0 auto;
}

.footer-icon-title {

	font-size: 12px;
	font-size: 0.12rem;
}