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

/* sub-menu */
#static .sub-box {
	background-color: #000;
	border: 1px solid #000;
	border-radius: 5px;
	overflow: hidden;
	color: #fff;
}
#static .sub-price__input__inr::before {
	color: #333;
}
#static .navi-open > .selected > p,
#static .selected {
	background: #000;
	opacity: 1;
}
#static .navi-open > li > p > a {
	color: #fff;
}
#static .sub-nav-memu:hover,
#static .navi-open > li > p:hover,
#static .navi-open > li > a:hover,
#static .navi-open > li > a:active,
#static .navi-open > li > a:focus {
	background: #000;
	opacity: 1;
	border-radius: 0 0 5px 5px;
}
#static .navi-open > .here > p > a,
#static .navi-open > .selected > li > a {
	color: #000;
}
#static .navi-open > .selected > .navi-open_inr > .here,
#static .navi-open > .here > p:hover,
#static .navi-open > .here > p > a:hover {
	background: #d9f5ed;
}
#static .navi-open > .selected > .navi-open_inr > li {
	background: #f7f7f7;
	color: #000;
}
#static .navi-open > li > p > a:hover,
#static .navi-open > .selected > li > a:hover {
	opacity: .7;
}
#static .navi-open > p::before {
	position: absolute;
	content: "";
	top: 11px;
	left: 20px;
	width: 4px;
	height: 1px;
	background: #999;
}
#static .sub-nav-memu::after {
	background: url(https://www.cosme.com/img/pc/arrow01_down_w.png) no-repeat;
}
#static .sub-nav-memu.selected::after {
	background: url(https://www.cosme.com/img/pc/arrow01_up_w.png) no-repeat;
}
#static .navi-open li:not(:first-child) > p::after {
	background-image: url(https://www.cosme.com/img/pc/arrow_down_w.png);
}
#static .navi-open li:not(:first-child).selected > p::after {
	background-image: url(https://www.cosme.com/img/pc/arrow_up_w.png);
}

/* static-ttl-page */
#static .static-ttl-page {
	margin-bottom: 20px;
	border: 1px solid #ccc;
}
#static .static-wrap-ttl-page {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 20px;
}
#static .static-wrap-ttl-page a,
#static .static-wrap-ttl-page a:hover {
	text-decoration: none;
}
#static .static-wrap-ttl-page span {
	display: block;
	width: 100%;
	line-height: 3em;
	text-align: center;
	background: #000;
	color: #fff;
}
#static .static-ttl-page img {
	width: calc(355px - 2px);
}

/* static-image */
#static .static-mini-image {
	display: flex;
	justify-content: space-between;
}
#static .static-mini-image > li p {
	font-size: 13px;
	text-align: center;
}
#static .static-mini-image > li img {
	width: 216px;
	margin-bottom: 5px;
	border: solid 1px #ccc;
}
#static .static-mini-image > li a {
	display: block;
	font-size: 1.1rem;
	text-decoration: none;
}

/* best selles */
#static .bestsellers {
	text-align: center;
	margin-bottom: 20px;
}