@charset "utf-8";
/* CSS Document */

body {
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', sans-serif;
	margin: 0;
}
img {
	max-width: 100%;
	display: block;
}
p {
	margin: 0;
}
ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}
.sp {
	display: none;
}
.inner {
	max-width: 1080px;
	width: 95%;
	margin: auto;
}
.title {
    font-family: "Oswald";
    font-size: 2em;
	letter-spacing: 7px;
    font-weight: normal;
}
@media screen and (max-width: 930px){
	.sp {
		display: block;
	}
}

/*共通パーツ*/
.item-head {
	padding: 5px 0;
}

.item-head a{
	color: #fff;
	position: relative;
}

.item-head .title {
    text-align: left;
    display: inline-block;
    width: 30%;
    vertical-align: middle;
    margin: 0;
}
.item-head .head_text {
    font-weight: bold;
    text-align: right;
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    letter-spacing: 1.5px;
    width: 69%;
}

.item {
    margin: 50px auto;
}
.item .item-main {
    float: left;
    width: 51.252%;
    margin-right: 3.705%;
    border: 1px solid #cbcdcc;
}

.item .item-list {
    float: right;
    width: 44%;
    border: 1px solid #dddddd;
    padding: 20px 0 20px 30px;
    box-sizing: border-box;
}
.item .item-list h3 {
    margin: 0;
}
.item .item-list .list li {
    position: relative;
    margin: 25px auto 0;
    padding-bottom: 25px;
    border-bottom: 1px solid #dddddd;
}
.item .item-list .list li:last-of-type {
	border-bottom: none;
	padding-bottom: 0;
}
.item .item-list .list li .link {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
	z-index: 5;
}
.item .item-list .list li .img {
    display: inline-block;
    width: 26.923%;
    margin-right: 20px;
    vertical-align: top;
}
.item .item-list .list li .detail {
    display: inline-block;
    vertical-align: top;
    width: 65%;
}
.item .item-list .list li .detail .number {
    font-size: 13px;
    font-weight: bold;
    color: #797979;
}
.item .item-list .list li .detail .name {
    font-size: 13px;
    font-weight: bold;
    color: #797979;
	line-height: 2;
}

.item .item-list .list li .detail .regular_price {
    text-decoration: line-through;
    font-size: 18px!important;
    margin-bottom: 5px;
}

.item .item-list .list li .detail .regular_price+.price{
	color: #b7282c;
}

.item .item-list .list li .detail .price {
    font-size: 23px;
    font-weight: bold;
    line-height: 1;
}
.item .item-list .list li .detail .price .tax {
    font-size: 55%;
    margin-left: -3px;
}
.item .item-list .list li .btn {
    display: inline-block;
    width: 90%;
    max-width: 179px;
    margin-top: 13.7%;
}
.item .item-list .list li .btn a {
    display: block;
    background: #fff;
    color: #000;
    border: 1px solid #000;
    box-sizing: border-box;
    padding: 6.5px 10px;
    font-size: 13.5px;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
}
.item .item-list .list li:hover .img,
.item .item-list .list li:hover .detail p:nth-of-type(-n+3) {
	opacity: 0.8;
	transition: 0.6s;
}
.item .item-list .list li:hover .btn a,
.item .item-list .list li .btn:hover a {
	background: #000;
	color: #fff;
	transition: 0.6s;
}

.item .others {
    float: left;
    width: 51.252%;
    margin-right: 3.705%;
    margin-top: 40px;
}
.item .others h3 {
    margin: 0;
    text-align: center;
    font-size: 1.5em;
    font-weight: bold;
    border-bottom: 2px solid #000;
    padding-bottom: 7px;
    margin-bottom: 12px;
}
.item .others .style li {
    display: inline-block;
    width: 31.075%;
    border: 1px solid #cbcdcc;
    box-sizing: border-box;
	margin-right: 2.2%;
	margin-bottom: 1.5%;
}
.item .others .style li.mr0,
.item .others .style li:nth-child(3n)  {
	margin-right: 0;
}
.item .others .style li a:hover img {
	opacity: 0.8;
	transition: 0.6s;
}
@media screen and (max-width: 930px){
	.item-head .title {
		width: 50%;
	}
	.item-head .head_text {
		width: 49%;
	}
	
	.item .item-main .img img {
		width: 100%;
	}
	.item .item-list .list li .img {
		width: 35%;
	}
	.item .item-list .list li .detail {
		width: 55%;
	}
	.item .item-list .list li .btn a {
		line-height: 1.2;
	}
}
@media screen and (max-width: 769px){
	.item-head {
		padding: 5px 0 10px;
	}
	.item-head .title {
		width: 100%;
		text-align: center;
		margin-bottom: 5px;
	}
	.item-head .head_text {
		width: 100%;
		text-align: justify;
		font-size: 13px;
		letter-spacing: 1px;
	}
	
	.item {
		margin: 10% auto;
	}
	.item .item-main {
		float: none;
		width: 100%;
		margin-right: 0;
	}
	.item .item-list {
		float: none;
		width: 100%;
		padding: 20px 0 20px 20px;
		margin-top: 10%;
	}
	.item .item-list .list li .detail .number {
		margin-bottom: 3px;
	}
	.item .item-list .list li .detail .name {
		line-height: 1.3;
		margin-bottom: 3px;
	}
	.item .item-list .list li .btn {
		width: 95%;
		margin-top: 10%;
	}
	.item .others {
		float: none;
		width: 100%;
		margin-right: 0;
		margin-top: 15%;
	}
	.item .others .style li {
		width: 30.7%;
	}
}

.item .others .others_btn{
	font-family: "Oswald";
    letter-spacing: 2px;
    font-weight: bold;
    color: #797979;
}

.item .others .others_btn:last-child{
	float: right;
}

/*BLAC LABEL*/
.bl-label .item-head {
    color: #fff;
    background: #020202;
    background: -moz-linear-gradient(left, #020202 0%, #777777 100%);
    background: -webkit-linear-gradient(left, #020202 0%,#777777 100%);
    background: linear-gradient(to right, #020202 0%,#777777 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#020202', endColorstr='#777777',GradientType=1 );
}

/*RED LABEL*/
.red-label .item-head {
    color: #fff;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#800009+0,f2292f+100 */
	background: #800009; /* Old browsers */
	background: -moz-linear-gradient(left,  #800009 0%, #f2292f 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #800009 0%,#f2292f 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #800009 0%,#f2292f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#800009', endColorstr='#f2292f',GradientType=1 ); /* IE6-9 */
}


.zoomit-container img {
    width: 100%;
}