@charset "utf-8";

/*------------------
     Index Layout 
--------------------*/


/*------------------------
     Navigation Contents 
--------------------------*/

@media only screen and (min-width: 1023px) {

	#infoMobile {   /* mobile用　今週のお知らせ */
		display: none;
	}
}

nav#firstNavi,
nav#secondNavi {
	float: left;
	width: 250px;
	height: 385px;
}

div#centerContents {
	float: left;
	width: 750px;
	height: 385px;
}

nav#firstNavi ul,
nav#secondNavi ul {
	padding: 0 10px;
	margin: 0;
}

nav#firstNavi ul li,
nav#secondNavi ul li {
	color: #5f5f5f;
	padding: 5px 0;
	list-style: none;
	border-bottom: 1px solid #5f5f5f;
	font-size: 90%;
	height: 36px;
}

.gyou1 {
	line-height: 36px;
}

nav#firstNavi ul li span,
nav#secondNavi ul li span {
	padding-left: 1.5em;
	text-indent: -1.5em;
	display: block;
}

nav#firstNavi ul li#returnMenu {
	font-weight: bold;
	padding: 0;
	height: 40px;
}

nav#firstNavi ul li#returnMenu img {
	vertical-align: -10%;
}

nav#firstNavi ul li#returnMenu a {
	background: none;
	padding-left: 0;
	margin: 0;
	display: block;
	width: 230px;
	height: 40px;
	text-align: center;
}

nav#firstNavi ul li#returnMenu a:hover,
nav#firstNavi ul li#returnMenu a:active {
	background: linear-gradient(top, rgba(75,75,75,0.8), rgba(75,75,75,0));
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(75,75,75,0.8)), to(rgba(75,75,75,0)));
	background: -moz-linear-gradient(linear, left top, left bottom, from(rgba(75,75,75,0.8)), to(rgba(75,75,75,0)));
	color: #c9f4c3;
}

nav#firstNavi ul li#here {
	color: #FFF;
	font-size: 95%;
	padding-left: 10px; 
	list-style: none;
	background: linear-gradient(top, rgba(228,104,159,1.0), rgba(152,47,99,1.0));
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(228,104,159,1.0)), to(rgba(152,47,99,1.0)));
	background: -moz-linear-gradient(linear, left top, left bottom, from(rgba(228,104,159,1.0)), to(rgba(152,47,99,1.0)));
}

nav#firstNavi ul li#here:before {
	content: url(../../common/images/allowLeftWhite.png);
}

nav#firstNavi ul li#here:after {
	content: url(../../common/images/allowRightWhite.png);
}

nav#secondNavi ul li#topInfo {
	height: 29px;
	line-height: 29px;
}

nav#firstNavi ul li.info,
nav#secondNavi ul li.info {
	list-style: url(../../common/images/allowBottom.png);
	list-style-position: inside;
	padding-left: 10px;
	color: #FFF;
}

nav#firstNavi ul li a,
nav#secondNavi ul li a {
	margin-left: 10px;
	padding-left: 15px;
	background: url(../../common/images/allowLeft.png) 0 no-repeat;
	display: block;
	width: 215px;
	color: #5f5f5f;
	text-decoration: none;
	cursor: pointer;
	height: 36px;
}

nav#firstNavi ul li a:hover,
nav#secondNavi ul li a:hover {
	color: #FFF;
	background: url(../../common/images/allowLeftWhite.png) 0 no-repeat;
}


@media only screen and (max-width: 1023px) {
	
	/* mobile用　navigation */
	#mobileNavi nav#subLinks {
		padding: 10px 20px;
		border-right: 2px solid #bfbfbf;
		border-left: 2px solid #bfbfbf;
		border-bottom: 2px solid #bfbfbf;
		background-color: #262626;
	}
	
	#mobileNavi nav#subLinks ul {
		padding: 0;
		margin-top: 20px;
		list-style: none;
	}
	
	#mobileNavi nav#subLinks ul.leftNavi {
		float: left;
		width: 45%;
	}
	
	#mobileNavi nav#subLinks ul.rightNavi {
		float: right;
		width: 45%;
	}

	#mobileNavi nav#subLinks ul li {
		border-bottom: 1px solid #5f5f5f;
		color: #FFF;
		padding: 10px 0 10px 1em;
	}
		
	#mobileNavi nav#subLinks ul li,
	#mobileNavi nav#subLinks ul li a {
		display: block;
		color: #FFF;
		text-decoration: none;
	}
	
	#mobileNavi nav#subLinks ul li a:before {
		content: url(../../common/images/allowLeftAnnounce.png);
		padding-right: 10px;
	}

	#mobileNavi nav#subLinks ul li a:hover {
		text-decoration: underline;
	}
	
	
	nav#firstNavi,
	nav#secondNavi { /* size変更 */
		float: left;
		width: 123px;
	}
	
	nav#firstNavi ul,
	nav#secondNavi ul { /* 非表示 */
		display: none;
	}
	
	 /* mobile用　現在のページ案内 */
	nav#firstNavi ul#infoMobile {
		display: block;
		position: absolute;
		font-size: 90%;
		margin: 0;
		padding: 0 0 0 15px;
		list-style: none;
	}
	
	nav#firstNavi ul#infoMobile li {
		color: #CFB85A;
		list-style-image: none;
		border: none;
	}
	
	nav#firstNavi ul#infoMobile li:after {
		content:" ▼";
	}

}

/*-----------------------
    centerContents
------------------------*/

div#slideshow ul {
	margin: 40px 0 0 0;
	padding: 0;
	list-style: none;
}

div#slideshow {
	padding-bottom: 20px;
	background-color: #646464;
}

@media only screen and (max-width: 1023px) {
	#firstView {
		padding-top: 4px;
		height: 385px;
		overflow: hidden;
	}
}

/*-----------------------
   Contents
------------------------*/
#contents {
	background-color: #808080;
	padding-top: 30px;
	border-left: 1px solid #BFBFBF;
	border-right: 1px solid #BFBFBF;
	margin-bottom: 15px;
}

#contents p {
	line-height: 1.5;
	color: #FFF;
	padding: 0 30px 10px 30px;
}

#titles {
	margin: 15px 0;
}

#titles h2 {
	padding: 1px 0;
	height: 22px;
	float: left;
	margin-left: 15px;
}

#titles h2#ttl_category {
	width: 175px;
	background: url(../images/ttl_category.png) no-repeat center #262626;
	margin-left: 23px;
}

#titles h2#ttl_productsList {
	width: 1011px;
	background: url(../images/ttl_productList.png) no-repeat center #262626;
}

#category h3 {
	float: left;
	width: 175px;
	margin-right: 15px;
}

#category h4 {
	float: left;
	width: 104px;
	margin-right: 15px;
}

#category {
	margin-left: 23px;
	padding-bottom: 30px;
}

#category div {
	margin-bottom: 5px;
}

#category div.indentTitle {
	margin-left: 190px;
}

#category ul {
	float: left;
	list-style: none;
	margin: 0;
	padding: 0;
}

#category ul.second {
	margin: 10px 0 5px 0;
}

#category ul li {
	float: left;
	height: 74px;
	width: 104px;
	margin-right: 10px;
}

#category div#info ul li,
#category div#a ul li {
	background-color: black;
	width: 1011px;
	height: 74px;
}

#category div#info ul li a,
#category div#a ul li a {
	text-align: center;
	width: 1011px;
	display: block;
}

#category ul li#f1 {
	width: 494px;
	background-color: #E8E8E8;
	height: 54px;
	margin-right: 0;
	font-size: 95%;
	border: 2px solid #6d6d6d;
	border-radius: 5px;
	padding: 8px 10px;
	line-height: 1.5;
}

#category ul li.end {
	margin-right: 0;
}

#category ul li a {
	display: block;
	width: 74px;
	height: 74px;
}

#attention {
	position: absolute;
	margin: -400px 0 0 450px;
}

.aShort {
	display: none;
}


@media only screen and (max-width: 1023px) {
	
	#contents {
		padding-left: 23px;
	}
	
	#titles h2#ttl_productsList {
		width: 675px;
	}
	
	#category ul.dan {
		clear: both;
		margin: 5px 0 5px 190px;
	}
	
	#category ul.second {
		margin-top: 5px;
	}
	
	#category div#info ul {
		float: left;
		max-width: 675px;
	}
	
	#category div#info ul li,
	#category div#a ul li {
		background-color: none;
		width: 675px;
	}
	
	#category div#info ul li a,
	#category div#a ul li a {
		width: 675px;
	}
	
	.aShort {
		display: block;
	}
	
	.aLong {
		display: none;
	}
}