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

/* クチコミボタン */
.product-rating { overflow: hidden; z-index: 30;}
.product-rating .product-rating__txt { display: inline-block; margin-right: 3px; vertical-align: middle; text-decoration: underline; }
.product-rating .product-rating__count { position: relative; display: inline-block; vertical-align: middle; padding-left: 93px; color: #fcce4d; font-weight: bold; font-size: 12px; line-height: 1.2; white-space: nowrap; }
.product-rating .product-rating__count:before { position: absolute; display: block; top: -0.7em; left: 50%; margin-left: -45px; width: 90px; height: 12px; background: url(http://www.cosme.com/images/sp/reviewer-star.png) no-repeat 0 0; background-size: 182px 30px; content: ""; }
.product-rating .product-rating__count.rtg-0:before { background-position: -91px 0; }
.product-rating .product-rating__count.rtg-0_5:before { background-position: -91px -15px; }
.product-rating .product-rating__count.rtg-1:before { background-position: -78px 0; }
.product-rating .product-rating__count.rtg-1_5:before { background-position: -78px -15px; }
.product-rating .product-rating__count.rtg-2:before { background-position: -65px 0; }
.product-rating .product-rating__count.rtg-2_5:before { background-position: -65px -15px; }
.product-rating .product-rating__count.rtg-3:before { background-position: -52px 0; }
.product-rating .product-rating__count.rtg-3_5:before { background-position: -52px -15px; }
.product-rating .product-rating__count.rtg-4:before { background-position: -39px 0; }
.product-rating .product-rating__count.rtg-4_5:before { background-position: -39px -15px; }
.product-rating .product-rating__count.rtg-5:before { background-position: -26px 0; }
.product-rating .product-rating__count.rtg-5_5:before { background-position: -26px -15px; }
.product-rating .product-rating__count.rtg-6:before { background-position: -13px 0; }
.product-rating .product-rating__count.rtg-6_5:before { background-position: -13px -15px; }
.product-rating .product-rating__count.rtg-7:before { background-position: 0px 0; }
.product-rating .product-rating__count.rtg-7_5:before { background-position: 0px -15px; }
.product-rating .product-rating__count--null { display: inline-block; vertical-align: middle; }
.product-rating .product-rating__record { display: inline-block; vertical-align: middle; }
.product-rating .is-null { padding: 2px 5px; border: none; color: #999; }


.pc{
	display:none;
}

.switch {
    visibility: hidden;
}

img {
	width: 100%;
}

h2,h3{
	font-weight: normal;
	line-height: 1.4;
}

.fw-strong{
	font-weight: bold;
}

/* アコーディオン*/
.ly_accordion {
  border-bottom: 0;
}
 
.ly_accordion .bl_inner {
  padding: 0 10px;
}
 
.ly_accordion .el_heading {
	margin: 0;
	position: relative;
	display: block;
	padding: 10px;
	cursor: pointer;
	background: #333;
	color: #fff;
	text-align: center;
	font-size: 16px;
}

.ly_accordion label::after {
	position: absolute;
	top: 50%;
	right: 10px;
	display: block;
	content: '';
	width: 8px;
	height: 8px;
	margin-top: -7px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
}
 
 
.ly_accordion .bl_content {
  overflow: hidden;
  max-height: 0;
  transition: max-height .3s ease-out .1s;
}
 
.ly_accordion .el_checkbox {
  display: none;
}
 
.ly_accordion .el_checkbox:checked + .el_heading +.bl_content {
  max-height: 9999px;
  transition: max-height 3s ease .1s;
}

.ly_accordion input:checked + .el_heading::after {
	margin-top: -3px;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}


#main {
	background: #FFF;
	width: 100%;
	display: block;
	font-size:13px;
	margin: 0 auto;
	
}

#main #spc_waku p{
	padding: 0 6px;
}

#main #spc_waku .clear {
	clear:both;
}

section {
    margin-bottom: 5px;
}

#main .sec01{
	font-size:18px;
	background-color: #dddddd;
	margin-top: 20px;
	padding: 8px;
	text-align: center;
}

#main .sec01_02{
	text-align: center;
	font-size:15px;
	color: #000000;
	padding: 0 5px;
}

#main .sec01_02 span{
	display: inline-block;
	background-image: url(../img/line_sp.png);
    background-position:bottom;
    background-repeat:repeat-x;
	padding: 10px 0;
	margin: 10px 0;
}

#main .sec01_main{
	width: 100%;
	background: #FFF;
	display: block;
	clear: both;
}

#main p.line{
	border-bottom: solid 1px #d6d4d4;
}

#main .sec01_main .right{
	padding: 5px;
}


#main .sec01_main .left{
	padding: 5px;
	text-align: center;
}

#main .sec01_main .left img{
	width: 80%;
}

#main .sec01_main .right span.red{
	color: #fb1c1c;
}

#main .understand{
	text-align: center;
	font-size:18px;
	color: #FFFFFF;
	background: #cc9933;
	margin: 20px 0 5px 0;
	padding: 5px 0px !important;
}

#main .sec02{
	font-size:20px;
	padding: 5px;
	margin: 20px 0 15px 0;
	border-bottom: solid 1px #d6d4d4;
	text-align: center;
}

#main .sec02 span{
	color: #ff3333;
}



#main table.type01 {
	line-height: 1.2;
	vertical-align: middle;
	width: 100%;
}


#main table.type01 .kutikomi{
	font-size: 12px;
	color: #333333;
	padding: 8px 0;
}

#main table.type01 .kutikomi span{
	color: #fb1;
	font-size: 12px;
	display: block;
}

#main table.type01 .kutikomi span.bold{
	font-weight: bold;
	color: #333;
	font-size: 12px;
}

#main table.type01 tr th{
	text-align: left !important;
	background: #edfdfe;
	width: 45%;
	vertical-align: middle;
	border: solid 1px #eeeeee;
	border-collapse: collapse;
	padding-left: 6px;
}

#main table.type01 tr td{
	text-align: center !important;
	border: solid 1px #eeeeee;
	border-collapse: collapse;
	padding: 7px 3px;
	width: 50%;
	vertical-align: middle;
}

#main ul.texture{
	float: left;
	width: 45%;
	margin: 7px;
}

#main ul.texture li{
	margin: 5px;
	text-align: center;
}

#main p.last{
padding: 0 !important;
	clear: both;
	margin: 10px 5%;
}

#main p.last a{
	display: block;
	margin: 5px auto 15px auto;
	color:#ffffff;
	padding: 12px 0px;
	background-color:#7e7e7e;
	text-align:center;
 	border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
	text-decoration: none;
}

#main p.chuki{
	color:#949393;
	font-size: 12px;
	margin:10px 0;
	text-align: center;
}

#main ul.list7_sp,
#main ul.list10_sp,
#main ul.list11_sp{
 /*display: flex;
 flex-wrap: wrap;*/
 width: 100%;
 list-style:none;
 margin: 15px 0px;
 text-align: center;
}

#main ul.list7_sp > li,
#main ul.list10_sp > li,
#main ul.list11_sp > li{
 list-style: none;
 box-sizing: border-box;
 text-align: center !important;
 display: inline-block;
 vertical-align: middle;
 margin: 10px 6px;
 padding: 0 2px;
 line-height: 1.5;
}

#main ul.list7_sp > li{
 width: 19%;
}

#main ul.list10_sp > li {
 width: 15%;
}

#main ul.list11_sp > li {
 width: 11%;
}

#main ul.list7_sp > p.number {
	font-size: 17px;
	background: #77dee5;
	color: #fff;
	padding: 5px 0 0 0 !important;
    height: 17%;
    width: 66%;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
	margin: 0 auto;
	margin-bottom: 15px;
}

#main ul.list4_sp{
 /*display: flex;
 flex-wrap: wrap;*/
 width: 100%;
 list-style:none;
 margin: 15px 0px;
 text-align: center;
}

#main ul.list4_sp > li{
 list-style: none;
 box-sizing: border-box;
 text-align: center !important;
 display: inline-block;
 vertical-align: middle;
 margin: 10px 0px;
 padding: 0px;
 line-height: 1.5;
}

#main ul.list4_sp > li{
 width: 22%;
}


/*ランキング情報ありの画像サイズ*/
#main img.kutikomirank {
	width: 200%;
	margin-left: -23px !important;
}

/*大きい画像のサイズ調整*/
#main img.bigimg {
	width: 140%;
	margin-left: -15px !important;
}


#main p.number {
	font-size: 17px;
	background: #cc9933;
	color: #fff;
	padding: 3px 0 0 0 !important;
    height: 27px;
    width: 30px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
	margin: 0 auto;
	margin-bottom: 15px;
	text-align: center;
}

#main p.list-left{
	width: 40%;
	float: left;
	padding: 0 !important;
	position: relative;
}

#main span.numberS{
	position: absolute;
	text-align: center;
	left: 10px;
	top: 10px;
	font-size: 15px;
	line-height: 32px;
    height: 32px;
    width: 32px;
	background: #cc9933;
	color: #fff;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}

#main ul.listprd_sp{
	float: right;
	width: 55%;
	padding-top:15px;
	display: table-cell;
	vertical-align: middle;
}

#main ul.listprd_sp li.descri{
	margin-bottom: 10px;
}


#main div.btn_ranking p,
#main div.btn_ranking p.mdl{
	font-size: 14px;
	width:80%;
	line-height: 52px;
	color:#ffffff;
	margin:10px auto;
	background-color:#7e7e7e;
	text-align:center;
 	border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
}

/* ナビゲーション*/
#main .navicont {
    	display: none;
}

#main .nav_sp,
#main .nav_sp02{
    width: 100%;
	text-align: center;
	/*overflow:hidden;*/
}

#main .nav_sp a{
    display:inline-block;
  	vertical-align: middle;
	font-size: 11px;
	width:32%;
	height: 35px;
	line-height: 35px;
	color:#ffffff;
	background-color:#333;
	text-align:center;
}

#main .nav_sp a.mdl{
	margin: 0 3px;
	width: 33%;
}

#main .nav_sp02 a{
    display:inline-block;
  	vertical-align: middle;
	font-size: 11px;
	width:49%;
	height: 35px;
	line-height: 35px;
	color:#ffffff;
	background-color:#333;
	text-align:center;
	margin-bottom: 3px;
}

#main .nav_sp02 a.leftmenu{
	width:49%;
	margin-left: 3px;
}

#main .nav_sp p:after,
#main .nav_sp02 p:after{
    content: url(../img/underlink_sp.png);
    margin-left: 10px;
    position: relative;
    top: 2px;
}

/* ナビゲーションここまで*/

#bx-pager,#bx-pager2,#bx-pager3,#bx-pager4 {
    display: flex;
	flex-wrap: wrap;
	margin: 15px 0 10px;
	justify-content: center;
}
#bx-pager > a,#bx-pager2 > a,#bx-pager3 > a ,#bx-pager4 > a {
    width: calc(100% / 6);
}
#bx-pager img,#bx-pager2 img,#bx-pager3 img,#bx-pager4 img {
    display: block;
    width: calc(90% - 6px);
	margin: 3px auto;
}
.bx-wrapper{
	margin-bottom: 10px;
	box-shadow: none;
}
.active img{
     outline:3px solid #cc9933;
}
.img_caption{
	display: flex;
	margin: 0 10%;
}
.img_caption p{
	width: 50%;
	text-align: center;	
}
.other_info{
	text-align: center;
	margin: 0 10% 10px;
}
#main .slide_texture{
	margin: 0 10% 10px;
}
#main .itemlist_detail_SP{
	display: flex;
	flex-wrap: wrap;
	padding: 10px 0;
	margin: 0 10%;
}
#main .itemlist_detail_SP ul{
	padding: 10px;
}	
#main .itemlist_detail_SP .item_name{
	font-size: 1.1em;
}
#main .itemlist_detail_SP p.list-left{
	width: 40%;
}
#main .itemlist_detail_SP p.list-left img{
	width: 100%;
}
#main .itemlist_detail_SP ul{
	width: calc(60% - 20px);
}
#main .itemlist_detail_SP ul li{
	line-height: 1.6em;
}
.bxslider1 .item_detail_bg,.bxslider2 .item_detail_bg,.bxslider3 .item_detail_bg,.bxslider4 .item_detail_bg{
	background: #e0cfae;
}
