﻿.maindesign {
	font-family: "Noto Sans JP","游ゴシック", "Yu Gothic",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",verdana,Osaka,Sans-Serif;
}
.maindesign .top-title{
	display: flex;
	justify-content: space-between;
	align-items: center;
	box-sizing: border-box;
	border: 2px solid #CCC;
	padding:52.5px 1rem
}
.maindesign .top-title h1{
	width: 50%;
	text-align: center;
	padding: 0 18.5px
}
.maindesign .top-title h1 span{
	display: block;
	font-weight: bold;
	color: #333;
	font-size: 1.6rem;
	margin-top: 0.4em;
}
.maindesign .top-title--img{
	width: 50%;
	text-align: center
}

.banner-list a p{
	color: #333
}
.banner-list img{
	width: 100%;
	height: auto
}
@media screen and (min-width:768px) {

	.maindesign .top-title h1 img{
		max-width: 80%;
			max-height:  210px;
		width: auto;
		height: auto

	}
	.maindesign .top-title--img img{
		max-width: 100%;
		width: auto;
		max-height: 245px;
		height: auto;	
}
	.maindesign .top-title.athena--top-title h1 img{
		max-width: 410px;
		max-height:  210px;
		width: auto;
		height: auto;
}


/* ----バナーリスト----*/
/* ----バナー2-1列表示----*/

.maindesign .banner-list li {
width: calc(100% / 3 - 10px);
}
.maindesign .banner-list p {
margin-top: 0;
}
.maindesign .banner-list.col-2 li {
width: 48%;
}

/* ----バナー4-2列表示----*/
.maindesign .maker {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row; 
}
.maindesign .maker::before {
content: "";
display: block;
width: calc(100% / 3 - 10px);
order: 1;
}
.maindesign .maker::after {
content: "";
display: block;
width: calc(100% / 3 - 10px);
}
.maindesign .maker li {
text-align: center;
font-size: 1.1rem;


}
	
.maindesign .maker li a{
	border: 1px solid #CCC;
	box-sizing: border-box;
	display: block;
	text-align: center;
	padding:2.4rem 8px;
	height: 100%;
}
.maindesign .maker li:nth-child(-n+3) {
margin-top: 0 
}
.maindesign .maker li img {
		width: auto;
max-width:255px;
height: auto;
max-height: 90px;
box-sizing: initial;
	border: none;
	margin-bottom: initial;
}
.maker li:nth-child(4n){
margin-right: 0
}
	.maker li a:hover{
border-color: #E5002D;
transition: 0.6s; 
}
	.maindesign .banner-list .banner-list--img{
		display: flex;
/*		align-items: center;*/
		justify-content: center;
		height: 105px
	}
/* -- バナーリストend --  */
}
@media screen and (max-width:767px) {
	.maindesign .description{
		text-align: left
	}
	.maindesign .top-title{
		padding: 1rem;
	}
	.maindesign .top-title h1{
		padding: 0 0.5rem}
		.maindesign .top-title.athena--top-title h1{
padding: 0 1rem 0 0;}
	.maindesign .top-title h1 img{
		width: 80%;
		height: auto
	}
	.maindesign .top-title h1 span{
		font-size: 4.2vw
	}

/* ----バナーリスト----*/
/* ----バナー2列表示----*/

	.maindesign .banner-list p {
margin-top: 1.6em;
}
/* ----バナー4列表示----*/
	.maindesign .maker {
/*display: flex;
	flex-wrap: wrap;
	justify-content: space-between*/
}
	.maindesign .maker::before {

}
	.maindesign .maker::after {

}
.maindesign .maker li {
text-align: center;
font-size: 1.1rem;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
 border: 1px solid #CCC;
box-sizing: border-box;
}
		.maindesign .maker li a{

		display: block;
		text-align: center;
		padding: 2rem 0;
 width: 100%;
    height: 100%;

	}
	.maindesign .maker li img {
	max-width: 67%;
	width: auto;
	height: auto;
border:none;
}
	.maindesign .banner-list .banner-list--img{
		display: flex;
align-items: center;
		justify-content: center;
/*		height: 140px*/
	}
@media screen and (max-width:767px){
.maindesign .maker li {
	font-size: 3.5vw;
	width: 49%;
	margin-bottom: 0;
}
.maindesign .banner-list .banner-list--img{
	height: 32vw;
}

}

/* -- バナーリストend --  */

}


/*　　コメリオリジナル商品　　*/
.maindesign .feature-hdg1 .sub_title{
	font-size: 7vw;	
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	position: absolute;
	top: 5%;
	transform: none;
}
.maindesign .feature-hdg1 .sub_title-secondary{
	margin-top: 2.5vw;
	margin-left: 0;
}
.maindesign .komeri_only{
	display: flex;
    flex-wrap: wrap;
	align-items: flex-start;
}
.maindesign .komeri_only img{
	width: 100%;
}
.maindesign .komeri_only p{
	width: 100%;
    margin-left: 0;
    margin-top: 10px;
    font-size: 1.1em;
    line-height: 1.3;
}
@media screen and (max-width:767px){
.maindesign .komeri_only{
	flex-direction: column-reverse;
}
.maindesign .komeri_only p{
	margin:0 0 10px;
}
	
}
.maindesign ul{
	padding: 0;
	list-style: none;
}
/*.maindesign .feature-hdg1::before {
    display: block;
    content: "";
    background-color: #f00;
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0.3;
}*/
.maindesign .pb-icon{
	display: flex;
	flex-wrap: wrap;
	align-items: start;
}
.maindesign .pb-icon li{
	width: calc(100% / 2 - 10px);
	margin-right: 20px;
	margin-top: 20px;
	text-align: center;
}
.maindesign .pb-icon li a{
	display: block;
    box-shadow: #ccc 4px 4px 5px;
}
.maindesign .pb-icon li a .pb-icon--img {
    display: flex;
	align-items: flex-start;
}
.maindesign .pb-icon li:nth-child(2n){
	margin-right: 0;
}
.maindesign .pb-icon li:nth-child(-n + 2){
	margin-top: 0;
}
.maindesign .pb-icon li p {
    margin: 10px 0;
    font-size: 1.0em;
}
.maindesign .new-arrival{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 50px 0;
}
.maindesign .new-arrival--img{
	width: 25vw;
	margin: auto 3vw;
}
.maindesign .new-arrival--txet{
	font-size: 3.0vw;
	line-height: 1.5;
	width: calc(100% - 31vw);
}


.maindesign .ubermann{
	background-color: #BD1D1D;
}
.maindesign .ubermann--text{
	padding: 0.5em 1em;
	font-size: 1.2em;
    line-height: 1.2;
    color: #fff;
}
.maindesign .ubermann--bk{
	background-color: #000;
	position: relative;
	padding: 10px 20px
}
.maindesign .ubermann--logo{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.maindesign .ubermann--logo img {
    width: 30vw;
}
.maindesign .ubermann--catch{
    font-size: 5.0vw;
    font-weight: bold;
	text-align: center;
    line-height: 1.2;
    color: #fff;
    padding: 20px 10px;
}
.maindesign .ubermann--description{
    font-size: 3.0vw;
	text-align: center;
    line-height: 1.5;
    color: #fff;
    padding:0 10px 20px;
}



@media screen and (min-width:768px) {
.maindesign .feature-hdg1 .sub_title{
	font-size: 65px;	
	top: 8%;
}
.maindesign .feature-hdg1 .sub_title-secondary{
	margin-top: 0;
	margin-left: 10px;
}
.maindesign .komeri_only img{
	width: calc(50% - 10px);
}
.maindesign .komeri_only p{
	width: calc(50% - 10px);
    margin-left: 20px;
	margin-top: 0;
    font-size: 20px;
    line-height: 1.3;
}

.maindesign .pb-icon li{
	width: calc(100% / 4 - 15px);
	margin-right: calc(60px / 3);
	margin-top: 20px;
}
.maindesign .new-arrival--img{
	width: 120px;
	margin: auto 30px;
}
.maindesign .new-arrival--txet{
	font-size: 1.3em;
	width: calc(100% - 180px);
}

.maindesign .pb-icon li:nth-child(2n){
	margin-right: calc(60px / 3);
}
.maindesign .pb-icon li:nth-child(4n){
	margin-right: 0;
}
.maindesign .pb-icon li:nth-child(-n + 4){	margin-top: 0;
}
.maindesign .pb-icon li a{
}

.maindesign .new-arrival{
	margin: 50px 0;
}
.maindesign .new-arrival--img{
	width: 200px;
	margin: auto 30px;
}
.maindesign .new-arrival--txet{
	width: calc(100% - 260px);
}

.maindesign .ubermann--text{
	padding: 0.5em 2em;
	font-size: 1.2em;
    line-height: 1.2;
    color: #fff;
}
.maindesign .ubermann--bk{
	background-color: #000;
	position: relative;
}
.maindesign .ubermann--logo{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.maindesign .ubermann--logo img {
    width: 100%;
}
.maindesign .ubermann--catch{
    font-size: 2.0em;
    font-weight: bold;
	text-align: center;
    line-height: 1.2;
    color: #fff;
    padding: 20px 0 30px;
}
.maindesign .ubermann--description{
    font-size: 1.2em;
	text-align: center;
    line-height: 1.5;
    color: #fff;
    padding-bottom: 20px;
}

}

.maindesign .others{
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 30px;
}
.maindesign .others li{
	width: calc(100% / 2 - 10px);
	margin-right: 20px;
	margin-top: 15px;
}
.maindesign .others li:nth-child(2n) {
    margin-right: 0;
}
.maindesign .others li:nth-child(-n + 2) {
    margin-top: 0;
}
.maindesign .others li img{
	width: 100%;
}
@media screen and (min-width:768px) {
.maindesign .others li{
	width: calc(100% / 4 - 10px);
	margin-right: calc(40px / 3);
}
.maindesign .others li:nth-child(2n) {
	margin-right: calc(40px / 3);
}
.maindesign .others li:nth-child(4n) {
    margin-right: 0;
}
.maindesign .others li:nth-child(-n + 4) {
    margin-top: 0;
}

}



.maindesign .recommend {
	border: 1px solid #ccc;
	margin-top: 60px;
}
@media screen and (max-width:767px) {
.maindesign .recommend {
	margin-top: 40px;
}
}
.maindesign .recommend h3{
	background-color: #b3a48d;
	padding: 15px;
	line-height: 1.2;
	font-size: 1.3em;
	text-align: center;
	color: #fff;
}
.maindesign .recommend--flex {
	padding: 10px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	font-feature-settings: "palt";
}
.maindesign .recommend--flex__img {
	width: 53%;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
}
.maindesign .recommend--flex__img ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	margin-top: 20px;
}
.maindesign .recommend--flex__img li {
	line-height: 1.3;
}
.maindesign .recommend--flex__img .coolerbox li {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 49%;
}
.maindesign .recommend--flex__img .coolerbox .images{
	width: 130px;
	margin-right: 5px;
}
.maindesign .recommend--flex__img .coolerbox p{
	width: calc(100% - 135px);
}
@media screen and (max-width:767px) {
	.maindesign .recommend--flex__img ul {
		justify-content: space-between;
		margin-top: 0;
	}
.maindesign .recommend--flex__img li {
	font-size: 0.9em;
}
.maindesign .recommend--flex__img .coolerbox li {
	width: 100%;
}
}
.maindesign .recommend--flex__img .panel-floor li {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 49%;
}
.maindesign .recommend--flex__img .panel-floor .images{
	width: 130px;
	margin-right: 5px;
}
.maindesign .recommend--flex__img .panel-floor p{
	width: calc(100% - 135px);
}
@media screen and (max-width:767px) {
.maindesign .recommend--flex__img .panel-floor li {
	width: 100%;
}
}

.maindesign .recommend--flex__img .youtube-list.cols1__1 li{
	width: 100%;
}
.maindesign .recommend--flex__img .m-nozzle {
	align-items: center;
	justify-content: flex-start;
}
.maindesign .recommend--flex__img .m-nozzle li {
	/*width: 54%;*/
	width: 33%;
}
/*.maindesign .recommend--flex__img .m-nozzle li:first-child {
	width: 35%;
}*/
.maindesign .recommend--flex__img .m-nozzle.col-4 li {
	width: 25%;
}
.maindesign .recommend--flex__img .m-nozzle.col-5 li {
	width: 15%;
}
.maindesign .recommend--flex__img .m-nozzle.col-5 .m-nozzle--full {
	flex-grow: 1;
}
.maindesign .recommend--flex__img .col3-2 {
	display: flex;
}
.maindesign .recommend--flex__img .col3-2 li:first-child {
	width: 66%;
}
.maindesign .recommend--flex__img .col3-2 li:nth-child(2) {
	width: 33%;
}
@media screen and (max-width:767px) {
	.maindesign .recommend--flex__img .m-nozzle.col-5 {
		flex-wrap: wrap;
	}
	.maindesign .recommend--flex__img .m-nozzle.col-5 li {
		width: 24%;
	}
	.maindesign .recommend--flex__img .m-nozzle.col-5 .m-nozzle--full {
		width: 100%;
	}
}

.maindesign .recommend--flex__img .m-nozzle.reverse li {
	width: 40%;
}
.maindesign .recommend--flex__img .m-nozzle.reverse li:first-child {
	width: 59%;
}

.maindesign .recommend--flex__img .circulator li {
	width: 100%;
	text-align: center;
	font-size: 1.1em;
}
@media screen and (max-width:767px) {
.maindesign .recommend--flex__img .circulator li {
	font-size: 0.9em;
}
}
.maindesign .recommend--flex__img .circulator li:last-child{
	margin-top: 5px;
}

.maindesign .recommend--flex__img .bottle li {
    width: 48%;
}
.maindesign .recommend--flex__img .bottle p {
	text-align: center;
	margin-top: 5px;
	font-size: 1.1em;
}
@media screen and (max-width:767px) {
.maindesign .recommend--flex__img .bottle p {
	font-size: 0.9em;
}
}
.maindesign .recommend--flex__img .bottle li {
    width: 48%;
}
.maindesign .recommend--flex__img .bottle p {
	text-align: center;
	margin-top: 5px;
	font-size: 1.1em;
}
@media screen and (max-width:767px) {
.maindesign .recommend--flex__img .bottle p {
	font-size: 0.9em;
}
}

.maindesign .hako-02{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.maindesign .hako-02 ul{
	width: 49%;
}
.maindesign .hako-02 ul li{
	width: 49%;
	font-size: 0.9em;
	text-align: justify;
}
@media screen and (max-width:767px) {
.maindesign .hako-02 ul{
	width: 100%;
}
.maindesign .hako-02 ul li{
	width: 59%;
	font-size: 0.9em;
}
.maindesign .hako-02 ul li:first-child{
	width: 39%;
}
}
.maindesign .hako-03{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.maindesign .hako-03 li{
	width: 32%;
	font-size: 0.9em;
	text-align: justify;
}
@media screen and (max-width:767px) {
.maindesign .recommend--flex__img .hako-03 li{
	width: 49%;
}
.maindesign .hako-03 li:last-child{
	width: 100%;
	margin-bottom: 20px;
}
}





.maindesign .recommend--flex__txt {
	width: 44%;
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
}
.maindesign .recommend--flex__txt p {
	font-size: 1.15em;
	text-align: justify;
	line-height: 1.5;
	margin-bottom: 10px;
}
.maindesign .recommend--flex__txt .recommend--option{
	font-size: 1.7em;
	margin-bottom: 0;
	font-weight: bold;
}
.maindesign .recommend--flex__txt .recommend--option .dekai {
    width: 200px;
}
.maindesign .recommend--flex__txt .recommend--name{
	font-size: 2.0em;
	margin-bottom: 0.5em;
	font-weight: bold;
}
.maindesign .recommend--flex__txt .recommend--name span{
	display: block;
	font-size: 0.6em;
}
.maindesign .recommend--flex__txt .recommend--price{
	font-size: 3.0em;
	font-weight: bold;
	text-align: right;
	color: #d30909;
	line-height: 1.2;
}
.maindesign .recommend--flex__txt .recommend--price .yen{
	font-size: 0.6em;
}
.maindesign .share-system{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px;
	border: 1px solid #ccc;
	margin-top: 20px;
}
.maindesign .share-system .share-system--img{
	width: 35%;
	text-align: center;
	padding: 15px;
}

.maindesign .share-system .share-system--img.lcrest {
    width: 30%;
    text-align: center;
    padding: 15px;
}
.maindesign .share-system .share-system--txt{
	width: 62%
}
.maindesign .share-system .share-system--txt p span{
	font-size: 1.3em;
}
.maindesign .share-system .share-system--txt p{
	font-size: 0.9em;
	line-height: 1.5;
	color: #333;
}
.maindesign .share-system.gda20xx{
	flex-wrap: wrap;
}
.maindesign .share-system.gda20xx .share-system--img{
	width: 100%;
    max-width: 450px;
    margin: auto;
}
.maindesign .share-system.gda20xx .share-system--txt{
	width: 100%;
    text-align: center;
}

.maindesign .share-system .share-system--img.k-plus img{
    max-width: 120px;
}
.maindesign .recommend--flex__txt .recommend--option.k-plus img{
	width: 80px;
}



.maindesign .banner-list li p{
	text-align: center;
	font-size: 1.1em;
	margin-top: 5px;
}
.maindesign .banner-list.col-2 li img {
    border: 1px solid #ccc;
}
@media screen and (max-width:767px) {
.maindesign .recommend--flex__img {
	width: 100%;
}
.maindesign .recommend--flex__txt {
	width: 100%;
}
.maindesign .recommend--flex__img li {
	height: auto;
	width: 32%;
    margin-bottom: 10px;
}
.maindesign .recommend--flex__txt p {
	font-size: 1.0em;
}
.maindesign .recommend--flex__txt .recommend--name{
	font-size: 1.5em;
}
.maindesign .recommend--flex__txt .recommend--price {
    font-size: 2.5em;
}

}
.maindesign .banner-list{
	margin-bottom: 50px;
}
.maindesign .gooddesign{
	border: 1px solid #ccc;
}

.maindesign .recommend--flex__txt .menu-btn-list li{
	margin-top: 20px;
/*	width: calc( 50% - 11px);*/
}
.maindesign .recommend--flex__txt .menu-btn-list li:nth-child(-n + 2){
	margin-top: 0;
}
.maindesign .recommend--flex__txt .menu-btn-list li:nth-child(2n){
	margin-right: 0;
}
@media screen and (max-width:767px) {
.maindesign .recommend--flex__txt .menu-btn-list li{
	margin-top: 0;
	width: 100%;
}
}
.maindesign .recommend--flex__txt .menu-btn-list.left-justified{
	justify-content: flex-start;
}

.maindesign .m10p{
	margin: 1rem 10px;
}
.maindesign .recommend--flex__txt .released{
	text-align: right;
    font-size: 1.0em;
    color: #d30909;
}
@media screen and (min-width:768px) {
.maindesign .recommend .mgb10{
	margin-bottom: 10px;
	
}
.maindesign .recommend .mgb20{
	margin-bottom: 20px;
	
}
.maindesign .recommend .mgb30{
	margin-bottom: 30px;
	
}
.maindesign .recommend .mgb40{
	margin-bottom: 40px;
	
}
.maindesign .recommend .mgb50{
	margin-bottom: 50px;
	
}
.maindesign .recommend .mgb60{
	margin-bottom: 60px;
	
}
.maindesign .recommend .mgb70{
	margin-bottom: 70px;
	
}
.maindesign .recommend .mgb80{
	margin-bottom: 80px;
	
}
.maindesign .recommend .mgb90{
	margin-bottom: 90px;
	
}
.maindesign .recommend .mgb100{
	margin-bottom: 100px;
	
}


}
.maindesign .menu-btn-list.odd-number{
	justify-content: left;
}



.maindesign .hayagari-img{
	margin: 20px 0;
	display: flex;
	flex-wrap: wrap;
}
.maindesign .hayagari-img li{
	width: calc(33.3% - 10px);
	margin-right: calc(30px / 2);
}
.maindesign .hayagari-img li:nth-child(3n){
	margin-right: 0;
}
.maindesign .hayagari-goods{
	font-size: 1.3em;
	font-weight: bold;
	margin-bottom: 15px;
}
.maindesign .hayagari-desc{
	font-size: 1.0em;
	line-height: 1.3;
}
@media screen and (max-width:767px) {
.maindesign .hayagari-img li{
	width: calc(50% - 10px);
	margin-right: 20px;
	margin-bottom: 10px;
}
.maindesign .hayagari-img li:nth-child(3n){
	margin-right: 20px;
}
.maindesign .hayagari-img li:nth-child(2n){
	margin-right: 0;
}

}

.maindesign .left-red{
	border-left: 4px solid #E5002D;
	padding: 0.3rem 1rem;
}


.maindesign .recommend--flex .img_container > img {
	width: 100%;
	height: auto;
}
.maindesign .recommend--flex__txt .recommend--option {
	width: auto;
	height: auto;
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 0.5em;
}
.maindesign .recommend--flex__txt .recommend--option span{
	width: auto;
	height: 60px;
	max-width: 150px;
	display: block;
}
.maindesign .recommend--flex__txt .recommend--option img{
	height: 100%;
}
.maindesign .recommend--flex .top_img_container {
	width: 100%;
	display: flex;
	justify-content: space-between;
	position: relative;
	margin-bottom: 10px;
}
.maindesign .recommend--flex .big_img_container {
	width: 65%;
}
.maindesign .recommend--flex .small_img_container {
	width: 34%;
	display: flex;
	flex-wrap: wrap;
}
.maindesign .recommend--flex .float_img_container .img_container {
	position: absolute;
}
.maindesign .recommend--flex .small_img_container .img_container:first-of-type {
	display: flex;
	align-items: flex-start;
}
.maindesign .recommend--flex .small_img_container .img_container:last-of-type {
	display: flex;
	align-items: flex-end;
}
.maindesign .recommend--flex .small_img_container .img_container {
	width: 100%;
}
.maindesign .recommend .menu-btn-list:after {
	content: '';
	display: block;
	width: calc(50% + 10px);
}
/*
.maindesign .recommend .menu-btn-list a {
	font-size: 1.0em;
}
*/

.maindesign .recommend-02 .float_img_container .img_container:first-of-type {
	left: 0;
	bottom: 10%;
	width: 60%;
}
.maindesign .recommend-02 .float_img_container .img_container:last-of-type {
	right: 0;
	bottom: 10%;
	width: 42%;
}
.maindesign .recommend-03 .float_img_container .img_container {
	top: 5%;
	right: 5%;
	width: 80%;
}
/*
.maindesign .recommend-02 .recommend--option > img {
	width: 200px;
}
.maindesign .recommend-03 .recommend--option > img {
	width: 200px;
}

.maindesign .recommend-04 .recommend--option > img {
	width: 200px;
}*/
/*.maindesign .recommend-04 .m-nozzle li {
	width: 73%;
}
.maindesign .recommend-04 .m-nozzle li:first-child {
	width: 25%;
}*/
/*
.maindesign .recommend-04 .recommend--name,
.maindesign .recommend-05 .recommend--name {
	margin: 30px 0 20px;
}

.maindesign .recommend-06 .float_img_container .img_container:first-of-type {
	top: 10%;
	left: 5%;
	width: 50%;
}
.maindesign .recommend-06 .float_img_container .img_container:last-of-type {
	bottom: 0;
	right: 5%;
	width: 50%;
}
.maindesign .recommend-08 .float_img_container .img_container:first-of-type {
	top: 0;
	left: 5%;
	width: 50%;
}
.maindesign .recommend-08 .float_img_container .img_container:last-of-type {
	bottom: 0;
	right: 5%;
	width: 27%;
}*/

@media screen and (max-width: 767px) {
.maindesign .recommend--flex__txt .recommend--option{
	margin-bottom: 10px;
}
	/*
	.maindesign .recommend-01 .menu-btn-list li:nth-of-type(1) {
		order: 1;
	}
	.maindesign .recommend-01 .menu-btn-list li:nth-of-type(2) {
		order: 4;
	}
	.maindesign .recommend-01 .menu-btn-list li:nth-of-type(3) {
		order: 2;
	}
	.maindesign .recommend-01 .menu-btn-list li:nth-of-type(4) {
		order: 5;
	}
	.maindesign .recommend-01 .menu-btn-list li:nth-of-type(5) {
		order: 3;
	}
	.maindesign .recommend-01 .menu-btn-list li:nth-of-type(6) {
		order: 6;
	}
	.maindesign .recommend-04 .recommend--name {
		margin: 0;
	}
	.maindesign .hako-02 {
		margin-bottom: 15px;
	}
	.maindesign .hako-02 ul li:first-child {
		width: 25%;
	}
*/
/*
	.maindesign .recommend-06 .recommend--flex__img ul,
	.maindesign .recommend-07 .recommend--flex__img ul {
		justify-content: space-around;
		margin-top: 0;
	}
	.maindesign .recommend-07 .recommend--flex__img ul {
		margin-top: 10px;
	}
	.maindesign .recommend-06 .recommend--flex__img li,
	.maindesign .recommend-07 .recommend--flex__img li {
		margin-bottom: 0;
	}
*/
}











/* ↓ YouTube ↓ */
.maindesign .youtube-list.cols1__1 li{
	width: 60%;
}

#modalwindow .videos .videos--image{
	width: 100%;
	height: auto;
}

#modalwindow #bamiri .bamiri--image{
	display: block;
	width: 100%;
}

@media screen and (max-width:767px) {
.maindesign .youtube-list.cols1__1 li{
	width: 100%;
}
}

/* ↑ YouTube ↑ */

/*cont-xxxはインクルードされる位置で決定される*/
@media screen and (min-width: 768px){/*wide用*/
.goods-list-area {
width: 1080px;
overflow: hidden;
list-style: none;
margin: 0 auto;
padding: 0;
}
.goods-list-area .items {/*itemuの横幅*/
margin: 30px 26.5px 0 0;
float: left;
width: 20%;
width: calc((100% - 80px) / 4);
width: -webkit-calc((100% - 80px) / 4);
width: -moz-calc((100% - 80px) / 4);
padding: 0 0 10px 0;
position: relative;
}
.goods-list-area .items::before {
position: absolute;
top: -20px;
left: 0;
width: 100vw;
height: 1px;
content: '';
background-color: #dbdbdb;
box-sizing: border-box
}
.goods-list-area .items:nth-child(n+1):nth-child(-n+4):before {/*ボーダ消すよう*/
width: 0;
height: 0;
border: 0;
margin-top: 20px
}
.goods-list-area .items:nth-child(4n) {/*item右端のmargin削除*/
margin-right: 0;
}

.goods-list-area .items .img-box{
margin:auto;
width:200px;/*IEバグ対策*/
width: fit-content;

} 

.goods-list-area .items .goods-img {
/*text-align: center;
width: 200px;
height: 200px;
display: table-cell;
vertical-align: middle;*/
width: 200px;
height: 200px;
margin: auto;
position: relative; 
}
.goods-list-area .items .goods-img img {
/*width: auto !important;
height: auto !important;
max-width: 200px;
max-height: 192px;*/
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
height: auto;
width: auto;
max-width: 98%;
max-height: 98%;
margin: auto; 
}
.goods-list-area .items .icon-list {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
height: 40px;
margin: 10px 0;
width: 100%;
}
.goods-list-area .items .icon-list .icon {
margin-right: 5px;
}
.goods-list-area .items .icon-list .icon:last-child {
margin-right: 0;
}
.goods-list-area .items .icon-list .icon img {
width: 38px
}
.goods-list-area .items .goods-nm {
font-size: 0.88em;
word-break: break-all;
color: #333;
height: 3em;
overflow: hidden;
}
.goods-list-area .items .price-area {
height: 1.2em;
line-height: 1;
font-size: 1.25em;
margin-bottom: 20px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-justify-content: space-between;
-ms-justify-content: space-between;
justify-content: space-between;
}
.goods-list-area .items .price-area .head {
font-size: 0.75em;
margin-right: 3px;
padding-top: 2px
}
.goods-list-area .items .price-area .textCancel {
font-size: 0.9em
}
.goods-list-area .items .price-area .en {
font-size: 0.93em;
padding-left: 2px;
}
.goods-list-area .items .price-area .value {
font-weight: bold;
font-size: 1.2em;
align-self: flex-end;
}
/* 2021.03.10 bita-a0099 add start */
.goods-list-area .items .favIcon{
position: absolute;
top: calc(192px - 35px);		/*画像サイズにあわせて調整必要*/
left: 2%;		/*画像サイズにあわせて調整必要*/
cursor:pointer;
z-index: 50;
}
.goods-list-area .items .favIcon img{
}
.goods-list-area .items .favMsg{
display: none;
font-size: 0.8em;
position: absolute;
top: calc(192px - 10px);		/*画像サイズにあわせて調整必要*/
left: 2%;		/*画像サイズにあわせて調整必要*/
background: #FFFFFF;
padding: 5px;
border: 1px solid #CCCCCC;
width: 210px;
color: #333333;
z-index: 901;
}
.goods-list-area .items .favMsg .msg{
padding-right: 19px;
background: url(../../images/parts/icon_arrowGlayDown.png) no-repeat right center;
}
.goods-list-area .items .reco-star-box {
display: none;
height: 1.05em;
margin-bottom: 5px;
}
.goods-list-area .items .reco-star-box .star {
width: 15px;
}
.goods-list-area .items .catch {
display: none;
}
.goods-list-area .items .catch .inner {
display: none;
font-size: 0.9em;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
height: 2.9em;
line-height: 1.5;
margin-bottom: 5px;
}
.more-btn-area {
margin-bottom: 20px;
text-align: center;
}
}


@media screen and (max-width: 767px){/*short用*/
/* featureArticle */
.goods-list-area {
border-bottom: 1px solid #dbdbdb;
width: 100%;
overflow: hidden;
list-style: none;
margin: 0 auto 20px;
padding: 0;
}
.goods-list-area .items {
margin-top: 10px;
margin-right: 25px;
float: left;
width: calc(100% - 25px / 2);
width: -webkit-calc((100% - 25px) / 2);
width: -moz-calc((100% - 25px) / 2);
padding-bottom: 15px;
position: relative
}
.goods-list-area .items::before {
background-color: #dbdbdb;
box-sizing: border-box;
content: '';
height: 1px;
left: 0;
position: absolute;
top: -10px;
width: 100vw;
}
.goods-list-area .items:nth-child(2n) {
margin-right: 0;
}
.goods-list-area .items .img-box {
display: table;
margin: 0 auto;
}
.goods-list-area .items .goods-img {
display: table-cell;
height: 150px;
text-align: center;
vertical-align: middle;
width: 150px;
}
.goods-list-area .items .goods-img img {
width: auto;
height: auto;
max-width: 100%;
max-height: 96%;
}
.goods-list-area .items .icon-list {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: row;
flex-direction: row;
-ms-flex-direction: row;
height: 48px;
margin-top: 5px;
}
.goods-list-area .items .icon-list .icon {
margin-right: 3px;
max-width: 40px;
padding-bottom: 8px;
position: relative;
width: 24%;
}
.goods-list-area .items .icon-list .icon:last-child {
margin-right: 0;
}
.goods-list-area .items .icon-list .icon img {
max-width: 38px;
max-height: 38px;
width: 100%;
}
.goods-list-area .items .goods-nm {
font-size: 0.9em;
word-break: break-all;
color: #333;
height: 2.5em;
line-height: 1.4;
overflow: hidden;
}
.goods-list-area .items .price-area {
height: 1.8em;
font-size: 1.25em;
margin: 10px 0;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-justify-content: space-between;
-ms-justify-content: space-between;
justify-content: space-between;
}
.goods-list-area .items .price-area .head {
font-size: 0.6em;
margin-right: 3px;
}
.goods-list-area .items .price-area .textCancel {
font-size: 0.9em
}
.goods-list-area .items .price-area .en {
font-size: 0.6em;
padding-left: 2px;
}
.goods-list-area .items .price-area .value {
font-weight: bold;
}
/* 2021.03.10 bita-a0099 add start */
.goods-list-area .items .favIcon{
position: absolute;
left: 4px;
top: 31%;
cursor:pointer;
}
.goods-list-area .items .favIcon img{
width: 30px;
}
.goods-list-area .items .favMsg{
display: none;
font-size: 0.8em;
position: absolute;
left: 4px;
top: 38%;
background: #FFFFFF;
padding: 5px;
border: 1px solid #CCCCCC;
width: 85%;
color: #333333;
z-index: 901;
}
.goods-list-area .items .favMsg .msg{
padding-right: 19px;
background: url(../../images/parts/icon_arrowGlayDown.png) no-repeat right center;
}
.goods-list-area .items .reco-star-box {
display: none;
height: 1.05em;
margin-top: 5px;
}
.goods-list-area .items .reco-star-box .star {
width: 15px;
}
.goods-list-area .items .catch {
display: none;
}
.goods-list-area .items .catch .inner {
font-size: 0.9em;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
height: 4.3em;
line-height: 1.4;
margin-top: 5px;
}
.more-btn-area {
margin-bottom: 20px;
text-align: center;
}
}

/*
.maindesign .recommend-01 .recommend--option,
.maindesign .recommend-02 .recommend--option,
.maindesign .recommend-04 .recommend--option,
.maindesign .recommend-07 .recommend--option,
.maindesign .recommend-08 .recommend--option{
	width: 150px;
}
*/


.maindesign .this_month .recommend-01 .recommend--option　{
	width:100%;
	max-width: 150px;
}
.maindesign .this_month .recommend-01 .recommend--option img{
	height: 100%;
}

.maindesign .recommend .m-nozzle_4 {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
.maindesign .recommend .m-nozzle_4 li:nth-child(odd) {
	width: 20%;
}
.maindesign .recommend .m-nozzle_4 li:nth-child(even) {
	width: 26%;
} 

@media screen and (max-width:767px) {
	.maindesign .this_month .tab-menu-nav li {
		font-size: 0.75em;
	}
	.maindesign .recommend .m-nozzle_4 li:nth-child(odd) {
		width: 43%;
	}
	.maindesign .recommend .m-nozzle_4 li:nth-child(even) {
		width: 53%;
	} 
	.maindesign .sp-order01{
		order: 1;
	}
	.maindesign .sp-order02{
		order: 2;
	}
	.maindesign .sp-order03{
		order: 3;
	}
	.maindesign .sp-order04{
		order: 4;
	}
}

/*
.maindesign .recommend .top_img_outer {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.maindesign .recommend-03 .top_img_outer .img_content:first-child {
	width: 100%;
}
.maindesign .recommend-03 .top_img_outer .img_content:not(:first-child) {
	width: 50%;
}


.maindesign .recommend-01 .share-system .share-system--img{
	width: 25%;
}*/


.maindesign .award_container {
	margin-top: 50px;
	border: 1px solid #ccc;
	padding: 20px;
}
.maindesign .award_container .good_design{
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-around;
	margin-bottom: 30px;
}
.maindesign .award_container .good_design--block{
	width: 25%;
	margin-right: 2em;
}
.maindesign .award_container .good_design--block:first-child{
	width: 60%;
	margin-right: 0;
}
.maindesign .award_container .good_design--block .lead-text{
	width: -moz-fit-content;
	width: fit-content;
	margin: auto;
}
.maindesign .award_container  .menu-btn-list{
	margin: 0;
}

@media screen and (max-width:767px) {
.maindesign .award_container .good_design--block{
	width: 100%;
	margin-top: 1em;
	margin-right: 0;
}
.maindesign .award_container ul.good_design--block{
	display: flex;
	flex-wrap: wrap;
}
.maindesign .award_container ul.good_design--block li{
	width: 50%;
}
.maindesign .award_container .good_design--block:first-child{
	width: 100%;
	margin-top: 0;
}
}
.maindesign .award_cols{
display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.maindesign .award_cols .award_container{
 width: calc(50% - 50px);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.maindesign .award_cols .award_container ul.good_design--block li{
	width: 50%;
}
.maindesign .award_cols .award_container .good_design--block{
	width: 100%;
	margin-top: 1em;
	margin-right: 0;
}
.maindesign .award_cols .award_container ul.good_design--block{
	display: flex;
	flex-wrap: wrap;
}
.maindesign .award_cols .award_container .good_design--block:first-child{
	width: 100%;
	margin-top: 0;
}
.maindesign .award_cols .award_container .menu-btn-list.col-1 li {
    width: 100%;
    max-width: 520px;
}
.maindesign .award_cols .award_container .good_design--block .lead-text {
    width: -moz-fit-content;
    width: fit-content;
    margin: 10px auto;
    display: flex;
    height: 5em;
    flex-direction: column;
    justify-content: center;
}
@media screen and (max-width:767px) {
.maindesign .award_cols .award_container{
 width: 100%;
}
}
.maindesign .other_bnr_container {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.maindesign .other_bnr_container .bnr_content {
	width: 48%;
	margin: 30px 0;
	box-sizing: border-box;
}
.maindesign .other_bnr_container .bnr_content p {
	text-align: center;
	margin: 10px 0;
	color: #000;
}

@media screen and (max-width:767px) {
	.maindesign .other_bnr_container .bnr_content {
		width: 100%;
		margin: 15px 0;
	}
}



.maindesign .saleprice_container {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 90px 0;
}
.maindesign .saleprice_container .saleprice_content {
	width: 48%;
}
.maindesign .saleprice_container .menu-btn-list li {
	width: 80%;
}
.maindesign .saleprice_container .explanation_container {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

@media screen and (max-width:767px) {
	.maindesign .saleprice_container {
		margin: 50px 0;
	}
	.maindesign .saleprice_container .saleprice_content {
		width: 100%;
	}
	.maindesign .saleprice_container .img_container {
		width: 80%;
		margin: 0 auto 15px;
	}
	.maindesign .saleprice_container .menu-btn-list li {
		width: 100%;
	}
}


@media screen and (max-width:767px) {
	.maindesign .this_month .tab-menu-nav li {
		font-size: 0.65em;
	}
}







.maindesign .exclusive{
	border: 1px solid #ccc;
	padding: 20px;
	margin-bottom: 30px;
}
.maindesign .exclusive-block{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 20px;
}
.maindesign .exclusive-block:last-child{
	margin-bottom: 0;
}
.maindesign .exclusive-block .kikan{
	color: #f00;
	line-height: 1.3;
	font-size: 1.8em;
	width: 20%;
	font-feature-settings: "palt";
}
.maindesign .exclusive-block .set-title{
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	width: 80%;
}
.maindesign .exclusive-block .set-title .images{
	width: 150px;
	margin-right: 20px;
}
.maindesign .exclusive-block .set-title p{
	width: calc(100% - 170px);
	font-size: 2.2em;
	font-weight: bold;
	font-feature-settings: "palt";
}
.maindesign .exclusive-block .images{
	width: 44%;
}
.maindesign .exclusive-block .text-area{
	width: 54%;
	display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.maindesign .exclusive-block .text-area .price-area{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
}
.maindesign .exclusive-block .text-area .price-area p{
	font-size: 1.2em;
	line-height: 1.3;
}
.maindesign .exclusive-block .text-area .price-area .set-price{
	font-size: 1.4em;
	font-weight: bold;
}
.maindesign .exclusive-block .text-area .price-area .set-price span{
	color: #f00;
	font-size: 2.6em;
	margin-left: 10px;
}
.maindesign .exclusive-block .text-area .price-area .set-price .yen{
	font-size: 0.6em;
}
.maindesign .exclusive-block .text-area .menu-btn-list{
	margin: 0;
}
@media screen and (max-width:767px) {
.maindesign .exclusive-block .kikan{
	font-size: 6vw;
    width: 100%;
    margin-bottom: 10px;		
}
.maindesign .exclusive-block .set-title {
    width: 100%;
}
.maindesign .exclusive-block .set-title .images {
    width: 25vw;
    margin-right: 3vw;
}
.maindesign .exclusive-block .set-title p {
    width: calc(100% - 28vw);
    font-size: 5.5vw;
    line-height: 1.3;
}
.maindesign .exclusive-block .images {
    width: 100%;
	margin-bottom: 2vw;
}
.maindesign .exclusive-block .text-area {
    width: 100%;
}
.maindesign .exclusive-block .text-area .price-area {
	margin: 4vw auto;
}
.maindesign .exclusive-block .text-area .price-area p {
    font-size: 5vw;
}
.maindesign .exclusive-block .text-area .price-area .set-price {
    font-size: 5.5vw;
    text-align: right;
    width: 100%;
}
}



.maindesign .recommend-four{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-top: 60px;
}
.maindesign .recommend-four::before,
.maindesign .recommend-four::after{
	content: "";
	display: block;
	width: 24%;
	height: 0;
}
.maindesign .recommend-four::before{
	order: 1;
}
.maindesign .recommend-four li{
	border: 1px solid #ccc;
	width: calc(24% - 22px);
	margin-top: 20px;
	padding: 10px;
/*
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	position: relative;
    padding-bottom: 4.0em;
*/
}
.maindesign .recommend-four li:nth-child(-n + 4){
	margin-top: 0;
}
.maindesign .recommend-four .recommend-four--block:first-child{
	display: flex;
	flex-wrap: wrap;
}
.maindesign .recommend-four .maker-logos{
	max-width: 150px;
	height:60px;
	display: flex;
	align-items: center;
	margin-bottom: 10px;
}
.maindesign .recommend-four .maker-logos img{
	height:100%;
}
.maindesign .recommend-four .images{
	margin-bottom: 10px;
}
.maindesign .recommend-four p{
	font-size: 0.9em;
	line-height: 1.3;
	height: 2.6em;
	margin-bottom: 15px;
}
.maindesign .recommend-four .name{
	font-size: 1.3em;
	font-weight: bold;
	line-height: 1.4;
	margin-bottom: 10px;
	height: 2.6em;
}
.maindesign .recommend-four .menu-btn-list{
	margin: 0;
/*
	position: absolute;
    width: calc(100% - 20px);
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
*/
}
.maindesign .recommend-four .menu-btn-list li{
	border: none;
	padding: 0;
	width: 100%;
	margin-right: 0;
	margin-top: 10px;
}
.maindesign .recommend-four .menu-btn-list li:nth-child(-n + 4){
	margin-top: 10px;
}
.maindesign .recommend-four .menu-btn-list li:first-child{
	margin-top: 0;
}

@media screen and (max-width:767px) {
.maindesign .recommend-four{
	margin-top: 40px;
}
.maindesign .recommend-four::before,
.maindesign .recommend-four::after{
	width: 49%;
}
.maindesign .recommend-four li{
	border: 1px solid #ccc;
	width: calc(49% - 22px);
}
.maindesign .recommend-four li:nth-child(-n + 4){
	margin-top: 20px;
}
.maindesign .recommend-four li:nth-child(-n + 2){
	margin-top: 0;
}
.maindesign .recommend-four .maker-logos{
	max-width: 26vw;
	height:12vw;
}
.maindesign .recommend-four .name{
	font-size: 1.1em;
}
.maindesign .recommend-four .menu-btn-list li .fs-medium{
	font-size: 0.9em;
}
.maindesign .recommend-four .menu-btn-list li{
	margin-bottom: 0;
}
.maindesign .recommend-four p{
	height: auto;
}
.maindesign .recommend-four .name{
	height: auto;
}

}

.maindesign .recommend--flex__txt .recommend--option span{
	margin-left: 5px;
}
.maindesign .recommend--flex__txt .recommend--option span:first-child{
	margin-left: 0;
}

.maindesign .pb-link{
	border: 1px solid #ccc;
	padding: 0 10px;
}
.maindesign .pb-link a{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px dashed #ccc;
	padding: 10px 0;
	color: #333;
}
.maindesign .pb-link a:last-child{
	border-bottom: none;
}
.maindesign .pb-link--img{
	width: 30%;
}
.maindesign .pb-link--txt{
	width: 68%;
	text-align: justify;
	font-size: 0.9em;
}

.maindesign .bnr-block {
	margin-top: 50px;
}

@media screen and (max-width:767px) {
	.maindesign .bnr-block {
		margin-top: 30px;
	}
}

.maindesign .share-system__small .share-system--img {
	width: 18%;
}
.maindesign .share-system__small .share-system--txt {
	width: 70%;
}
@media screen and (max-width:767px) {
	.maindesign .share-system__small .share-system--img {
		width: 24%;
	}
	.maindesign .share-system__small .share-system--txt {
		width: 63%;
	}
}


.maindesign .bb-dashed{
	border-bottom: 1px dashed #333;
	padding-bottom: 20px;
}
