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

html{
	width:100%;
}

body{
	width:100%;
	margin:0;
	padding:0;
	background:#fff;
}


#box_menu{
	width:100%;
	overflow:hidden;
}

/*開閉部分*/

#box_menu input[type=checkbox]{
	display:none;
}

#box_menu label {
    display: block;
}

#box_menu li{
	display:block;
    font-size: 4.5vw;
    line-height: 1.5;
    padding: 2vw 0;
	color:#000;
	background:#fff;
	border-bottom:1px solid #c5c2c1;
}

#box_menu > li span{
	display:block;
	width:100%;
	padding:0 4%;
}

#box_menu >	li span::after{
	display:block;
	width:1.4vw;
	float:right;
	text-align:right;
	content:" ";
	color:#fff;
	width:1.4vw;
	height:1.4vw;
	border-top:1px solid #000;
	border-right:1px solid #000;
	-moz-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	margin-top:1.5vw;
	margin-left:4vw;
	margin-right:8%;
}

#box_menu li label span{
    padding: 2.5vw 4vw;
}

#box_menu li label span.title::after{
	display:block;
	width:1.4vw;
	float:right;
	text-align:right;
	content:" ";
	color:#fff;
	width:1.4vw;
	height:1.4vw;
	border-top:1px solid #000;
	border-right:1px solid #000;
	-moz-transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
	-o-transform: rotate(135deg);
	-ms-transform: rotate(135deg);
	transform: rotate(135deg);
    margin-top: 0.5em;
    margin-right: 10vw;
}


#box_menu li ul{
	max-height:0;
	overflow:hidden;
	width:90%;
	margin:0 auto;
}

#box_menu li ul li{
	padding:3.5vw 0;
}

#box_menu li ul li:last-child{
	border-bottom:0;
}

#box_menu li ul li span{
	letter-spacing:0;
}


#box_menu li ul li:first-child{
	border-top:1px solid #c5c2c1;
}


#box_menu li ul li span::after{
	display:block;
	width:1.4vw;
	float:right;
	text-align:right;
	content:" ";
	color:#fff;
	width:1.4vw;
	height:1.4vw;
	border-top:1px solid #000;
	border-right:1px solid #000;
	-moz-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	margin-top:2.1vw;
	margin-left:4vw;
	margin-right:8%;
}


/*展開処理*/

#cologne:checked ~ ul#list_cologne,
#bath:checked ~ ul#list_bath,
#home:checked ~ ul#list_home,
#collection:checked ~ ul#list_collection,
#pop:checked ~ ul#list_pop,
#gift:checked ~ ul#list_gift,
#gents:checked ~ ul#list_gents{
	max-height:10000vh;
	overflow:visible;
	transition: 10s;
}

/*プレゼント告知*/

.head_comp{
	width:93%;
	font-size:0;
	text-align:center;
	margin:3vw auto 0;
	border-bottom:1px solid #ccc;
}

.head_comp:after{
	content:" ";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}

.head_comp dt{
	display:block;
	margin-top:4vw;
	margin-bottom:3vw
}

.head_comp dt img{
	width:45.41vw;
	vertical-align:middle;
}

.head_comp dd{
	font-size:3vw;
	line-height:1.2;
	letter-spacing:0;
	display:inline-block;
	vertical-align:middle;
	word-break:keep-all;
	
	width:14.49vw;
	margin:0 2.4vw 2vw 0;
}


.head_comp dd.dp{
	display:block;
	text-align:center;
	width:100%;
	padding-left:0;
}

.head_comp dd:last-child{
	width:74vw !important;
	margin:0 0 2vw;
}

.head_comp dd span{
	font-size:2.5vw;
}

.head_comp dd img{
	width:100%;
	margin:0;
}


.head_comp dd.dp img{
    width: 14.49vw;
    margin: 0 2vw;
	display:inline-block;
}

@media screen and (max-device-width: 320px) {

.head_comp dt{
	margin-top:1vw;
}


.head_comp dd{
	font-size:3vw;
	width:14.49vw;
	margin:0 2vw 2vw 0;
	word-break:normal;
}

.head_comp dd:last-child{
	width:74vw !important;
}

}