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

body{
	width:100%;
	height:100%;
	min-height:100%;
	margin:0px;
	padding:0px;
	text-align:center;
	color:#191919;
	font-size:12px;
	line-height:1.5;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background:#FFF;
	-webkit-font-smoothing:subpixel-antialiased;
}


.box{
	filter:alpha(opacity=0);
    -moz-opacity: 0;
    opacity: 0;
}

.fl{float:left;}
.fr{float:right;}


/* scrolltopcontrol アイコン */
#topcontrol:hover{
}


hr{
	height:0px;
	border:none;
	border-top:2px solid #000;
	margin:0 0 5px 0;
	width: 18px;
	text-align:left;
}
hr.white{
	border-top:2px solid #FFF;
}


br.res{ display:none;}

/* -----------------------------------------
                   Header 
   ----------------------------------------- */



header{
	width:100%;
	background:url(../../images/mainimg.jpg) center center no-repeat;
	background-size:cover;
}
header .headerIn{
	width:93%;
	max-width:1020px;
	margin:0 auto;
}
header h1{
	width:45%;
	max-width:320px;
	padding:20% 0 20%;
}








.category{
	width:100%;
	margin-top:60px;
}
.category.topline{
	border-top:1px solid #CCC;
	padding-top:50px;
}
.category .inner{
	width:95%;
	max-width:1020px;
	margin:0 auto;
}
.category h2{
	margin-bottom:0.2em;
	font-family: 'Roboto', sans-serif;
	font-weight:400;
	font-size:3.0em;
}
.category h3{
	font-size:2.3em;
}



.subimg{
	margin-top:60px;
}










.itemall{
	width:100%;
	margin-top:60px;
}
.itemall .inner{
	width:95%;
	max-width:1020px;
	margin:0 auto;
	text-align:left;
}


.itemall h2{
	font-family: 'Roboto', sans-serif;
	font-weight:300;
	font-size:2.0em;
	line-height:1.2;
}
.itemall h3{
	font-size:0.9em;
	width:100%;
}
.itemall .medical{
	font-size:0.8em;
	display:inline-block;
	border:1px solid #555;
	line-height:1;
	padding:0.2em;
	margin:0;
}





.itemall .itemleft{
	width:49%;
	float:left;
	margin:0 auto;
	position:relative;
}
.itemall .itemright{
	width:49%;
	float:right;
	margin:0 auto;
	position:relative;
}

.itemall .itemleft02{
	width:45%;
	float:left;
	margin:0 auto;
}
.itemall .itemright02{
	width:45%;
	float:right;
	margin:0 auto;
}



.itemIn{
	position:relative;
}

.item1{
	width:100%;
	position:relative;
	margin-top:15px;
}
.item1 .itemspec{
	width:25%;
	position:absolute;
	bottom:0;
	right:0;
}
.item1 .img{
	width:65%;
	text-align:center;
}





.item2{
	width:50%;
	position:relative;
	margin-top:15px;
}
.item2 .img{
	width:50%;
	text-align:center;
}
.item2 .img img{
	width:85px;
}
.gaiter img{
	padding:37px 0;
}
.item2 .itemspec{
	width:46%;
	position:absolute;
	bottom:0;
	right:0;
}
.packimg{
	width:38%;
	position:absolute;
	right:0;
	bottom:0;
}




.tips{
	width:100%;
	text-align:center;
	font-size:0;
	margin-top:10px;
}
.tips li{
	width:20px;
	display:inline-block;
	text-align:center;
	line-height:1;
	font-size:11px;
	margin:0 2px;
}
.tips li p{
	margin-top:0.2em;
}
.iconW{
	border:1px solid #999;
	box-sizing: border-box;
}



.itemspec h4{
	height:30px;
	font-family: 'Roboto', sans-serif;
	font-weight:300;
	font-size:1.5em;
	line-height:1;
}
.itemspec p{line-height:1.4;}
.itemspec .buy a{	
	width:100%;
	display:block;
	background:#000;
	text-align:center;
	margin-top:5px;
	color:#FFF;	
	line-height:1;
	padding:7px 0 8px 0;




}





.apparel h5{
	font-size:1.8em;
	width:96%;
	max-width:1020px;
	margin:0 auto;
	text-align:left;
	padding-bottom:30px;
}

.apparel .inner{
	
}

.apparel .img{
	width:55% !important;
}
.apparel .img img{
	width:100%;
}
.apparel .itemspec{
	width:40%;
}
.ap_image01{
	width:100%;
	margin-top:40px;
}
.ap_image01 .img_left{
	width:49.9%;
	float:left;
}
.ap_image01 .img_right{
	width:49.9%;
	float:right;
}









.socks{
	position:relative;
	width:95%;
	max-width:1020px;
	margin:40px auto 0;
	text-align:left;
	padding-bottom:30px;
	background:url(../../images/dot.png) left bottom repeat-x;
}
.socks.last{
	background:none;
}

.socks h2{ font-size:1.8em;}
.socks .subsocksname{
	float:left;
	width:28%;
}
.socks .img{
	float:left;
	width:57%;
}
.socks .itemspec{
	width:12%;
	float:right;
}
.socksimg{
	width:60%;
	margin:0 auto;
}








.buy a{
	transition: background-color 0.15s linear;
	-webkit-transition: background-color 0.15s linear;
}
.men a:hover{ background-color: #555;}
.women a:hover{ background-color: #F27076;}
.unisex a:hover{ background-color:#B3B3B3;}







/* =========== footer ========== */
footer{
	width:90%;
	margin:0 auto;
	padding:7em 0 3em;
	font-size:0.9em;
}
footer p{padding:0.2em 0;}
footer a{color:#191919;}
footer a:hover{color:#FECE02;}
footer br{display:none;}




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

header .headerIn{width:90%;}
header h1{padding:23% 0 23%;}




.category{margin-top:7%;}
.category.topline{padding-top:6%;}


.subimg{margin-top:8%;}



.itemall{margin-top:7%; width:90%; margin-left:auto; margin-right: auto;}
.itemall .itemleft{width:100%;float:none;}
.itemall .itemright{width:100%;float:none;margin-top:7%;}


.itemall .itemleft02{width:48%;}
.itemall .itemright02{width:48%;}
.item1 .itemspec{width:30%;}


.packimg{width:25%;right:6%;}

.apparel .item2{width:49%;}

.gaiter img{padding:0;}

.socks{ width:90%;margin-top:5%;}
.socks .subsocksname{float:none;width:100%;}
.socks h2 br{ display:none;}
.socks .img{width:70%;}
.socks .itemspec{width:25%;}


/* =========== footer ========== */
footer{padding:7% 0 4%;}

}








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

.wide{ display:none;}

.category h2{font-size:2.7em;}
.category h3{font-size:2.0em;}
.category{margin-top:12%;}
.category.topline{padding-top:12%;}


.subimg{margin-top:12%;}






.itemall{margin-top:12%;}
.itemall .inner{width:88%;text-align:center;}
.itemall .medical{margin:0 auto;}
.itemall .itemspec{text-align:left; margin-top:10%;}

.itemall .itemright{margin-top:12%;}
.itemall .itemleft02{width:90%;float:none;}
.itemall .itemright02{width:90%;float:none;margin-top:10%;}


.item1 .itemspec{width:40%;position:relative;margin:5% auto 0; padding-bottom:5%;}
.item1 .img{width:70%;margin:0 auto;}

.packimg{ display:none;}


.item2{width:43%;}
.item2 .img{width:100%;}
.item2 .img img{width:60%;}
.item2 .itemspec{width:100%;position:relative;}
.item2.single{
	width:43%;
	float:none !important;
	margin-left:auto;
	margin-right:auto;
}


.apparel .item2{width:43%;}
.apparel .img{width:100% !important;}
.apparel .img img{width:95%;}


.socks{text-align:center; width:85%;}
.socks .img{float:none;width:90%;margin:3% auto 0;}
.socks .itemspec{width:35%;float:none;margin:5% auto 0;text-align:left;}

.socksimg{
	width:80%;
	margin:5% auto 0;
}


/* =========== footer ========== */
footer{font-size:0.85em;}
footer br{display:block;}

}


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


header{
	background:url(../../images/mainimg_mb.jpg) center center no-repeat;
	background-size:cover;
}
header .headerIn{width:90%;}
header h1{
	padding:40% 0 40%;
	max-width:none;
	width:60%;
}


.category h2{font-size:2.6em;}
.category h3{font-size:1.7em;}

.itemall h2{font-size:1.8em;}

.item1 .itemspec{width:60%;}
.item1 .img{width:80%;}
.socks .itemspec{width:52%;}

.socks h2{ font-size:1.6em;}

}
@media only screen and (max-width: 360px) {
.category h2{font-size:2.4em;}
.category h3{font-size:1.5em;}

.itemall h2{font-size:1.6em;}
.socks h2{ font-size:1.5em;}
}





/* -----------------------------------------
                   Clearfix 
   ----------------------------------------- */


.inner:after,
.clear:after,
.itemright:after,
.itemleft:after,
.itemright02:after,
.itemleft02:after,
.sockssub:after,
.underIn:after,
.apparel:after,
.ap_item:after,
.ap_image01:after,
ul:after{
	  content: "";
	  display: table;
	  float:none;
	  clear: both;
}