@charset "utf-8";

/* 例
#gift {background-color: #111;}
#gift .row {padding-top: 50px;}
#gift .ttl-sec {
	color: #fff;
	font-weight: bold;
	border-top: 1px solid #eee;
}*/

/*	carousel
----------------------------------------------------------- */
/* .jcarousel
------------------------------------ */
#mens .jcarousel-wrapper { 	display: block; padding: 17px 0px;	position: relative; width: 100%; margin-bottom: 18px; }
#mens .border-top{border-top: 3px solid #000;}
/** Carousel **/
#mens .jcarousel { position: relative; overflow: hidden; margin: 0 30px ; }
#mens .jcarousel > ul { width: 200000em; position: relative; list-style: none; margin: 0; padding: 0; }
#mens .jcarousel > ul > li { float: left; }
#mens .jcarousel > ul > li img {}
#mens .jcarousel > ul > li > a, .jcarousel > ul > li > span { display: block; }
#mens .row .col--3 > .col__col{ width: 173px;}

/** Carousel Controls **/
#mens.jcarousel-wrapper.movable .jcarousel-control-prev-wrap, .jcarousel-wrapper.movable .jcarousel-control-next-wrap { display: block; }

#mens .jcarousel-control-prev-wrap, .jcarousel-control-next-wrap { position: absolute; top: 0; width: 13px; height: 100%; z-index: 2; }
#mens .jcarousel-control-prev-wrap a, .jcarousel-control-next-wrap a { position: absolute; top: 0; bottom: 0; margin: auto; width: 13px; height: 100%; display: block; }
#mens .jcarousel-control-prev-wrap a img, .jcarousel-control-next-wrap a img { width: 100% ; height: 100%; }
#mens .jcarousel-control-prev__icon-arrow { width: 100%; height: 100%; fill: #000; }
#mens .jcarousel-control-prev-wrap { left: 0; }
#mens .jcarousel-control-next-wrap { right: 0; }

#mens.jcarousel-control-prev:hover span, .jcarousel-control-next:hover span { display: block; }

/* .on-arrow */
#mens.row .jcarousel-wrapper--on-arrow .jcarousel, .primary .jcarousel-wrapper--on-arrow .jcarousel { margin-right: 0; margin-left: 0; }
#mens.jcarousel-wrapper--on-arrow .jcarousel-control-prev-wrap { left: 10px; }
#mens.jcarousel-wrapper--on-arrow .jcarousel-control-next-wrap { right: 10px; }

/* product--thumb
------------------------------------ */
#mens.product--thumb > a { text-decoration: none; display: block; }
#mens.product--thumb .inr__wrap-img { text-align: center;}
#mens.product--thumb .product__name, .product--thumb .product__desc { margin-bottom: 0; }

/* product--thumb 画像サイズ固定指定
------------------------------------ */
#mens .row .jcarousel .col.col--3 .product--thumb .inr__wrap-img img {width: calc(100% - 2px); border: solid 1px #ccc;  max-width: 100%; margin-bottom: 8px;}
#mens .row .col.col--3 .product--thumb.product--thumb--logo .inr__wrap-img img { width: auto; height: auto; }

/*.jcarouselここまで
-----------------------------------------------------------------------------------------------------------------------------------------*/

#mens .category-logo {
	border-bottom: solid 5px #000;
	margin-bottom: 15px;
}
#mens .category-logo img{
	display: block;
	margin: 0 auto 15px;
}
.contents-hoge{
	width: 980px;
	overflow: hidden;
	background-color: #FFF;
}
.category-description{
	text-align: center;
	margin-bottom: 35px;
}
.contents-col-left{
	float: left;
	width: 640px;
	overflow: hidden;
}
.contents-col-right{
	float: right;
	width: 310px;
	overflow: hidden;
}

h2.section-logo{
	clear: both;
}

.section-logo img{
	display: block;
	margin: 0 auto ;
}
.section-description{
	text-align: center;
	line-height: 2em;
	border-bottom: 1px solid #000;
	padding-bottom: 5px;
	margin-bottom: 5px;	
}
.section-description-columR{
	text-align: center;
	line-height: 2em;
}
.section-description-columR span{
	display: block;
	width: 100%;
	height: 10px;
	margin-top: 5px;
	background-image: linear-gradient(
    -45deg,
    #fff 25%,
    #888 25%, #888 50%,
    #fff 50%, #fff 75%,
    #888 75%, #888
	);
	/* 幅8px、高さ8pxで背景画像のサイズを指定 */
	background-size: 6px 6px;		
}
.brand-logo-list{
	border-top: 3px solid #000;
	padding-top: 5px;
}
.brand-logo-list li{
	float: left;
	width: 142px;
	margin: 12px 24px 8px 0;
	text-align: center;
	font-size: 0.9em;
}
.brand-logo-list li span{
	font-size: 0.7em;
}
.brand-logo-list li a{
	text-decoration: none;
}
.brand-logo-list li:nth-child(4n+4){
	margin: 12px 0 8px 0;
}
.brand-logo-list li:last-child{
	margin-bottom: 35px;
}
.brand-logo-list li img{
	width: calc(100% - 2px);
	margin-bottom: 5px;
	border: 1px solid #ccc;
}
.category-list{
	border-top: 3px solid #000;
	padding-top: 5px;
}
.category-list li{
	float: left;
	width: 200px;
	margin: 12px 17px 0 0;
	text-align: center;
	position: relative;
}
.brand-logo-list li a{
	text-decoration: none;
}
.category-list li span{
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 202px;
	text-align: center;
	line-height: 3em;
	color: #FFF;
	background: #000;
    filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;	
}
.category-list li:nth-child(3n+3){
	margin: 12px 0 0;
}
.category-list li:last-child{
	margin-bottom: 35px;
}
.category-list li img{
	width: 100%;
	border: 1px solid #ccc;
}
.pickup-item-01{
	border-top: 3px solid #000;
	border-bottom: 1px solid #ccc;
	padding: 17px 0px;	
}
.pickup-item-02{
	padding: 17px 0px 35px;	
}
.pickup-item-detail{
	width: 410px;
	float: right;
}
.pickup-item-detail-copy{
	font-size: 1.4em;
	color: #888;
}
.pickup-item-detail ul li{
	line-height: 1.6em;
}
.pickup-item-detail .product{
	font-size: 1.2em;
}
.pickup-item-detail .review .product-rating__reviewer{
	font-size: 1.1em;
}
.pickup-item-detail .review .product-rating__reviewer span.number{
	font-size: 0.8em;
	font-weight: normal;
	color: #333;
}
.pickup-item-detail .price{
	font-size: 1.4em;
}
.pickup-item-detail .price span{
	font-size: 0.6em;
}
.pickup-item-detail-graph{
	margin: 12px 0px;
}

.pickup-item-detail-graph img{
	float: left;
}
.pickup-item-detail-graph img.graph01{
	width: 150px;
}
.pickup-item-detail-graph img.graph02{
	width: 260px;
}
#pickup-item figure{
	width: 220px;
	float: left;
}
#pickup-item figure img{
	width: 100%;
}
#pickup-item figcaption{
	margin: 10px 0px;
}
.pickup-item-detail-btn{
	clear: both;
	overflow: hidden;
}
.pickup-item-detail-btn a{
	display: inline-block;
	float: right;
	text-decoration: none;
	padding: 10px 20px;
	border: 1px solid #000;
	font-weight: bold;
}
.pickup-item-attention{
	margin-top: 17px;
	font-size: 0.8em;
	color: #888;
}
#ranking{
	clear: both;
}
.mens-ranking{
}
.mens-ranking li{
	padding: 17px 0px;
	border-bottom: 1px solid #ccc;	
}
.mens-ranking a{
	text-decoration: none;
}
.mens-ranking li:after{
	content: ".";
	display: block;
	height: 0px;
	font-size: 0px;
	clear: both;
	visibility: hidden;
}
.mens-ranking-no1{
	background-image:  url("/user_data/packages/default/tag/850/img/menscosme_ranking01.jpg");
	background-position: 0% 80%;
	background-repeat: no-repeat;
}
.mens-ranking-no2{
	background-image:  url("/user_data/packages/default/tag/850/img/menscosme_ranking02.jpg");
	background-position: 0% 80%;
	background-repeat: no-repeat;
}
.mens-ranking-no3{
	background-image:  url("/user_data/packages/default/tag/850/img/menscosme_ranking03.jpg");
	background-position: 0% 80%;
	background-repeat: no-repeat;
}
.mens-ranking-no4{
	background-image:  url("/user_data/packages/default/tag/850/img/menscosme_ranking04.jpg");
	background-position: 0% 80%;
	background-repeat: no-repeat;
}
.mens-ranking-no5{
	background-image:  url("/user_data/packages/default/tag/850/img/menscosme_ranking05.jpg");
	background-position: 0% 80%;
	background-repeat: no-repeat;
}
.mens-ranking-no6{
	background-image:  url("/user_data/packages/default/tag/850/img/menscosme_ranking06.jpg");
	background-position: 0% 80%;
	background-repeat: no-repeat;
}
.mens-ranking-no7{
	background-image:  url("/user_data/packages/default/tag/850/img/menscosme_ranking07.jpg");
	background-position: 0% 80%;
	background-repeat: no-repeat;
}
.mens-ranking-no8{
	background-image:  url("/user_data/packages/default/tag/850/img/menscosme_ranking08.jpg");
	background-position: 0% 80%;
	background-repeat: no-repeat;
}
.mens-ranking-no9{
	background-image:  url("/user_data/packages/default/tag/850/img/menscosme_ranking09.jpg");
	background-position: 0% 80%;
	background-repeat: no-repeat;
}
.mens-ranking-no10{
	background-image:  url("/user_data/packages/default/tag/850/img/menscosme_ranking10.jpg");
	background-position: 0% 80%;
	background-repeat: no-repeat;
}
.mens-ranking-no5{
	background-image:  url("/user_data/packages/default/tag/850/img/menscosme_ranking05.jpg");
	background-position: 0% 80%;
	background-repeat: no-repeat;
}
.mens-ranking-thumb{
	width: 115px;
	float: left;
	margin-left: 28px;
}
.mens-ranking-thumb img{
	width: 100%;
}
.mens-ranking-info{
	width: 160px;
	float: right;
}
.mens-ranking-info .brand{
	font-size: 0.9em;
	color: #888;
	margin-bottom: 0.5em;
}
.mens-ranking-info .review{
	line-height: 1em;
}

.mens-ranking-info .product-rating__reviewer{
	font-size: 1em;
	font-weight: bold;
	line-height: 1em;
	color: #fb1;
}
.mens-ranking-info .price span{
	font-size: 0.6em;
}
.mens-more-btn{
	overflow: hidden;
	margin: 17px 0 35px;
}
.mens-more-btn a{
	display: inline-block;
	float: right;
	text-decoration: none;
	padding: 10px 20px;
	border: 1px solid #000;
	font-weight: bold;
	
}
.columR-bnr{
}

.columR-bnr li{
	display: block;
	margin-bottom: 17px;
}
.columR-bnr li img{
	width: calc(100% - 2px);
	border: 1px solid #ccc;
}
.columR-bnr li:last-child{
	margin-bottom: 35px;
}

#mens-articles{
	
}
#mens-articles li{
	padding: 17px 0px;
	border-bottom: 1px solid #ccc;
	background-image: url("/user_data/packages/default/tag/850/img/menscosme_articles_arrow.gif");
	background-position: 100% 50%;
	background-repeat: no-repeat;
}
#mens-articles li:after{
	content: ".";
	display: block;
	height: 0px;
	font-size: 0px;
	clear: both;
	visibility: hidden;
}
.mens-articles-thumb{
	width: 90px;
	float: left;
}
.mens-articles-thumb img{
	width: 100%;
}
.mens-articles-txt{
	font-size: 0.9em;
	width: 190px;
	float: right;
	padding-right: 20px;
}
#mens-special li{
	width: 150px;
	float: left;
	padding-top: 17px;
}
#mens-special li img{
	width: 100%;
}
#mens-special li:nth-child(odd){
	margin-right: 10px;
}
#mens-special li:last-child{
	margin-bottom: 35px;
}





#gift a {
	text-decoration: none;
}
#gift .giftnavi li {
	display: inline-block;
	font-size: 16px;
    margin-right: 6px;
}
#gift .giftnavi li:after {
	content: "　";
	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOC4xLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0i44Os44Kk44Ok44O8XzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCINCgkgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMTYgMjgiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDE2IDI4IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiMwNDAwMDAiIGQ9Ik0xNS43LDEzLjJsLTE0LTEzYy0wLjQtMC40LTEtMC40LTEuNCwwLjFjLTAuNCwwLjQtMC40LDEsMC4xLDEuNEwxMy41LDE0TDAuMywyNi4zYy0wLjQsMC40LTAuNCwxLTAuMSwxLjQNCglDMC41LDI3LjksMC43LDI4LDEsMjhjMC4yLDAsMC41LTAuMSwwLjctMC4zbDE0LTEzYzAuMi0wLjIsMC4zLTAuNSwwLjMtMC43UzE1LjksMTMuNCwxNS43LDEzLjJ6Ii8+DQo8L3N2Zz4NCg==);
	background-size: 50% 100%;
	background-repeat: no-repeat;
	margin: 6px;
	position: relative;
}

#gift .col {
	 margin-top: -10px;
	margin-bottom: 20px;
}

#gift .col > .col__col {
	margin-top: 30px;
}

#gift .col__col .sub-txt {
	display: block;
	text-align: right;
}

#gift .row .col--6 > .col__col {
    width: 138px;
    height: 61px;
}

#gift .link a {
    font-size: 14px;
}


#gift .seasonal-banner{
	width: 980px;
	height: 360px;
}

#gift .seasonal-banner .seasonal-ttl-area{
	width: 300px;
	height: 160px;
	position:relative;
	top: 79px;
    left: 591px;
}

#gift .seasonal-banner .seasonal-ttl-area .seasonal-ttl{
	font-size: 70px;
	text-align: center;
}

#gift .seasonal-recommend{
	border-top: none;
}

#gift .seasonal-banner .seasonal-ttl-area .seasonal-link{
	margin-bottom: 10px;
	font-size: 18px;
	text-align: center;
}

#gift .seasonal-banner .seasonal-ttl-area .seasonal-link:after{
	text-align: center;
	content: "　";
	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOC4xLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0i44Os44Kk44Ok44O8XzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCINCgkgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMTYgMjgiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDE2IDI4IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiMwNDAwMDAiIGQ9Ik0xNS43LDEzLjJsLTE0LTEzYy0wLjQtMC40LTEtMC40LTEuNCwwLjFjLTAuNCwwLjQtMC40LDEsMC4xLDEuNEwxMy41LDE0TDAuMywyNi4zYy0wLjQsMC40LTAuNCwxLTAuMSwxLjQNCglDMC41LDI3LjksMC43LDI4LDEsMjhjMC4yLDAsMC41LTAuMSwwLjctMC4zbDE0LTEzYzAuMi0wLjIsMC4zLTAuNSwwLjMtMC43UzE1LjksMTMuNCwxNS43LDEzLjJ6Ii8+DQo8L3N2Zz4NCg==);
	background-size: 50% 100%;
	background-repeat: no-repeat;
	margin: 6px;
	position: relative;
}

#gift .giftcate {
	width: 100%;
	background-color: #b8becf;
	color: #fff;
    margin-bottom: 30px;
	padding: 8px;
	text-align: center;
}

#gift .giftcate > div{
	background-color: #FF0;
	display: inline;
}


#gift .giftcate h1{
	font-size: 32px;
}

#gift .giftcate li {
    display: inline-block;
    margin-right: 10px;
	font-size: 18px;
}

#gift .giftcate a {
    color: #FFF;
}

#gift .giftcate a:after {
	content: "　";
	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOS4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0i44Os44Kk44Ok44O8XzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCINCgkgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjYgNDgiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDI2IDQ4IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0yNS43LDIzLjJsLTI0LTIzYy0wLjQtMC40LTEtMC40LTEuNCwwYy0wLjQsMC40LTAuNCwxLDAsMS40TDIzLjYsMjRMMC4zLDQ2LjNjLTAuNCwwLjQtMC40LDEsMCwxLjQNCglDMC41LDQ3LjksMC43LDQ4LDEsNDhjMC4yLDAsMC41LTAuMSwwLjctMC4zbDI0LTIzYzAuMi0wLjIsMC4zLTAuNCwwLjMtMC43UzI1LjksMjMuNCwyNS43LDIzLjJ6Ii8+DQo8L3N2Zz4NCg==);	
	background-size: 50% 100%;
	background-repeat: no-repeat;
	margin: 6px;
	position: relative;
}

#gift .price li {
	display: inline-block;
	font-size: 17px;
	margin-right: 10px;
}

#gift .price li:after {
	content: "　";
	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOC4xLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0i44Os44Kk44Ok44O8XzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCINCgkgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMTYgMjgiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDE2IDI4IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiMwNDAwMDAiIGQ9Ik0xNS43LDEzLjJsLTE0LTEzYy0wLjQtMC40LTEtMC40LTEuNCwwLjFjLTAuNCwwLjQtMC40LDEsMC4xLDEuNEwxMy41LDE0TDAuMywyNi4zYy0wLjQsMC40LTAuNCwxLTAuMSwxLjQNCglDMC41LDI3LjksMC43LDI4LDEsMjhjMC4yLDAsMC41LTAuMSwwLjctMC4zbDE0LTEzYzAuMi0wLjIsMC4zLTAuNSwwLjMtMC43UzE1LjksMTMuNCwxNS43LDEzLjJ6Ii8+DQo8L3N2Zz4NCg==);
	background-size: 50% 100%;
	background-repeat: no-repeat;
	margin: 6px;
	position: relative;
}


#gift .wrapping-exp {
	float: left;
}

#gift .wrapping-copy {
	font-size: 18px;
	line-height: 1.7;
}

#gift .wrapping-exp .note {
	color: #999;
    font-size: 12px;
	margin-bottom: 15px;
}

#gift .wrapping-exp a{
	font-size: 16px;
}


#gift .wrapping-exp a:after {
	content: "　";
	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOC4xLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0i44Os44Kk44Ok44O8XzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCINCgkgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMTYgMjgiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDE2IDI4IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiMwNDAwMDAiIGQ9Ik0xNS43LDEzLjJsLTE0LTEzYy0wLjQtMC40LTEtMC40LTEuNCwwLjFjLTAuNCwwLjQtMC40LDEsMC4xLDEuNEwxMy41LDE0TDAuMywyNi4zYy0wLjQsMC40LTAuNCwxLTAuMSwxLjQNCglDMC41LDI3LjksMC43LDI4LDEsMjhjMC4yLDAsMC41LTAuMSwwLjctMC4zbDE0LTEzYzAuMi0wLjIsMC4zLTAuNSwwLjMtMC43UzE1LjksMTMuNCwxNS43LDEzLjJ6Ii8+DQo8L3N2Zz4NCg==);
	background-size: 50% 100%;
	background-repeat: no-repeat;
	margin: 6px;
	position: relative;
}

#gift .wrapping-img {
	float: right;
}

#gift .border-none{
	border-top: none;
	margin-top: -50px;
	
}

#gift .section.half-m{
	margin-bottom: 30px;
}