@charset "UTF-8";


/* Define some basic layouts
----------------------------------------------- */
/*
#wrapper {
	width: 1000px;
	margin: 0 auto;
}
*/
#wrapper {
	width: 1000px;
	margin: 0 auto;
	background: url('../images/common/background.jpg') left top repeat-y;
	padding: 0 12px;
}

#wrapper #header {
	position: relative;
}

#wrapper #header #title {
	background: url('../images/common/background-header.jpg') left top no-repeat;
	height: 87px;
	padding-top: 10px;
	padding-left: 20px;
}

#wrapper #header #title h1 {
	text-indent: -9999em;
}

#wrapper #header #title h1 a {
	display: block;
	width: 267px;
	height: 58px;
	overflow: hidden;
}

#wrapper #header #title .description {
	font-size: 90%;
}

#wrapper #header #search {
	position: absolute;
	right: 20px;
	top: 10px;
	text-align: right;
}

#wrapper #header #search ul li {
	display: inline;
	float: left;
}

#wrapper #header #search ul li input {
	margin-left: 5px;
}

#wrapper #header #search .check-login {
	position: absolute;
	right: 0;
	top: 40px;
}

#wrapper #header .check-login a {
	background: url('../images/common/button-login.jpg') left top no-repeat;
	display: block;
	width: 182px;
	height: 31px;
	overflow: hidden;
}

#wrapper #header .check-login a:hover {
	background: url('../images/common/button-login-hover.jpg') left top no-repeat;
}

#wrapper #header #search .check-member {
	position: absolute;
	right: 0;
	top: 5px;
}

#wrapper #header .check-member a {
	background: url('../images/common/button-resister.jpg') left top no-repeat;
	display: block;
	width: 182px;
	height: 31px;
	overflow: hidden;
}

#wrapper #header .check-member a:hover {
	background: url('../images/common/button-resister-hover.jpg') left top no-repeat;
}



/* Global navigations
----------------------------------------------- */
#wrapper #header #navigation {
	background: url('../images/common/background-g-navigation.jpg') left top repeat-x;
}

#wrapper #header #navigation ul {
	margin-left: 55px;
}

#wrapper #header #navigation ul li {
	float: left;
	height: 45px;
}

#wrapper #header #navigation ul li a {
	display: block;
	overflow: hidden;
	height: 45px;
	text-indent: -9999em;
}

#wrapper #header #navigation #nav1 {
	background: url('../images/common/g-navigation1.jpg') left top no-repeat;
	width: 161px;
}
#wrapper #header #navigation #nav2 {
	background: url('../images/common/g-navigation2.jpg') left top no-repeat;
	width: 176px;
}
#wrapper #header #navigation #nav3 {
	background: url('../images/common/g-navigation3.jpg') left top no-repeat;
	width: 200px;
}
#wrapper #header #navigation #nav4 {
	background: url('../images/common/g-navigation4.jpg') left top no-repeat;
	width: 174px;
}
#wrapper #header #navigation #nav5 {
	background: url('../images/common/g-navigation5.jpg') left top no-repeat;
	width: 183px;
}

#wrapper #header #navigation #nav1 a:hover { background: url('../images/common/g-navigation1-hover.jpg') left top no-repeat; }
#wrapper #header #navigation #nav2 a:hover { background: url('../images/common/g-navigation2-hover.jpg') left top no-repeat; }
#wrapper #header #navigation #nav3 a:hover { background: url('../images/common/g-navigation3-hover.jpg') left top no-repeat; }
#wrapper #header #navigation #nav4 a:hover { background: url('../images/common/g-navigation4-hover.jpg') left top no-repeat; }
#wrapper #header #navigation #nav5 a:hover { background: url('../images/common/g-navigation5-hover.jpg') left top no-repeat; }


/* Content section
----------------------------------------------- */
#wrapper #content {
	margin-top: 20px;
	margin-bottom: 20px;
	padding-left: 20px;
	padding-right: 10px;
}


/* Leftside
----------------------------------------------- */
#wrapper #content #leftside {
	float: right;
	width: 205px;
	padding-right: 5px;
	padding-top: 9px;
	font-size: 90%;
}

#wrapper #content #leftside .box {
	margin-bottom: 20px;
	line-height: 1.5em;
}

#wrapper #content #leftside .box h2 {
	/*background: url('../images/common/leftside-top.jpg') left top no-repeat;*/
	height: 28px;
	text-indent: -9999em;
}

#wrapper #content #leftside .box .gradiation,
#wrapper #content #leftside .box .search-background,
#wrapper #content #leftside .box .option-background {
	padding: 10px;
	/*/padding: 7px 0px 0 7px;*/
}

#wrapper #content #leftside .box .gradiation,
#wrapper #content #rightside .newitem .thumbnail h3,
#wrapper #content #rightside #item-detail #more .box .thumbnail h4 {
	/*background: url('../images/common/leftside-bottom.jpg') left bottom no-repeat;*/

	background: -moz-linear-gradient(top, #ffffff, #ffffff 50%, #F4F4F4);
	background-image: -webkit-gradient(linear,left bottom,left top,color-stop(1, #ffffff),color-stop(0, #F4F4F4));
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ffffff', endColorstr='#F4F4F4');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ffffff', endColorstr='#F4F4F4')";
	zoom: 1;
	/*
	background:linear-gradient(#ffffff, #f0f0f0);
	background:-webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f0f0f0));
	background:-moz-linear-gradient(top, #ffffff, #f0f0f0);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#ffffff, endcolorstr=#f0f0f0));  
	-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#ffffff, endcolorstr=#f0f0f0))";  
	zoom: 1\9;
	*/
	border-left: 1px solid #C1C1C1;
	border-right: 1px solid #C1C1C1;
}

#wrapper #content #leftside .box .search-background {
	background: url('../images/common/leftside-search-background.jpg') left bottom repeat-y;
}


#wrapper #content #leftside #login { background: url('../images/common/leftside-login.jpg') left top no-repeat; }
#wrapper #content #leftside #search { background: url('../images/common/leftside-search.jpg') left top no-repeat; }
#wrapper #content #leftside .box #genre { background: url('../images/common/leftside-genre.jpg') left top no-repeat; }
#wrapper #content #leftside #option { background: url('../images/common/leftside-option.jpg') left top no-repeat; }
#wrapper #content #leftside #faq { background: url('../images/common/leftside-faq.jpg') left top no-repeat; }
#wrapper #content #leftside #cart { background: url('../images/common/leftside-cart.jpg') left top no-repeat; }
#wrapper #content #leftside #ranking { background: url('../images/common/leftside-ranking.jpg') left top no-repeat; }


#wrapper #content #leftside .box .box-bottom {
	background: url('../images/common/leftside-bottom2.jpg') left top no-repeat;
	height: 6px;
	overflow: hidden;
}


/* Leftside > Login
----------------------------------------------- */
#wrapper #content #leftside #login ul {
	margin: 7px 0;
}

#wrapper #content #leftside #login .resister,
#wrapper #content #leftside #login .login {
	display: block;
	overflow: hidden;
	width: 182px;
	height: 31px;
	text-indent: -9999em;
}

#wrapper #content #leftside #login .resister { background: url('../images/common/button-resister.jpg') left top no-repeat; }
#wrapper #content #leftside #login .login { background: url('../images/common/button-cart.jpg') left top no-repeat; }

#wrapper #content #leftside #login a:hover.resister { background: url('../images/common/button-resister-hover.jpg') left top no-repeat; }
#wrapper #content #leftside #login a:hover.login { background: url('../images/common/button-cart-hover.jpg') left top no-repeat; }



/* Leftside > Search
----------------------------------------------- */
#wrapper #content #leftside #search li {
	margin-bottom: 10px;
}

#wrapper #content #leftside #search .search-genre {
	width: 181px;
}

#wrapper #content #leftside #search .button {
	margin-left: 60px;
}

#wrapper #content #leftside #search .gradiation li {	/* ジャンル検索 */
	float: left;
	width: 90px;
	height: 2em;
	margin-bottom: 0;
}

#wrapper #content #leftside #search .gradiation {
	padding-bottom: 0;
}


/* Leftside > Option
----------------------------------------------- */
#wrapper #content #leftside #option h3 {
	background: url('../images/common/leftside-option-info.jpg') left top no-repeat;
	width: 205px;
	height: 40px;
	text-indent: -9999em;
}
#wrapper #content #leftside #option h4 {
	margin-bottom: 5px;
}

#wrapper #content #leftside #option .left {
	width: 80px;
}

#wrapper #content #leftside #option .left p {
	margin-top: 3px;
	margin-left: 10px;
}

#wrapper #content #leftside #option .option-right {
	float: left;
	width: 95px;
	margin-left: 10px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	#wrapper #content #leftside #option .option-right {
		width: 100px;
		margin-left: 5px;
	}
}

#wrapper #content #leftside #option .option-border {
	border-bottom: 1px solid #D9D9D9;
}

#wrapper #content #leftside #option .option-background1,
#wrapper #content #leftside #option .option-background2,
#wrapper #content #leftside #option .option-background3 {
	padding: 10px;
	padding-bottom: 5px;
}

#wrapper #content #leftside #option .option-background1 { background: url('../images/common/leftside-option-background.jpg') left top repeat-y; }
/*
#wrapper #content #leftside #option .option-background2 { background: url('../images/common/leftside-option-background2.jpg') left bottom no-repeat; }
#wrapper #content #leftside #option .option-background3 { background: url('../images/common/leftside-option-background3.jpg') left bottom no-repeat; }
*/
#wrapper #content #leftside #option .option-background-gray {
	background: url('../images/common/leftside-option-gray.jpg') left top no-repeat;
	height: 3px;
	overflow: hidden;
}

#wrapper #content #leftside #option .option-background-red {
	background: url('../images/common/leftside-option-red.jpg') left top no-repeat;
	height: 3px;
	overflow: hidden;
}

#wrapper #content #leftside #option .option-background-end {
	background: url('../images/common/leftside-option-background-end.jpg') left top no-repeat;
	height: 9px;
}

/* Leftside > FAQ
----------------------------------------------- */
#wrapper #content #leftside #faq ul {
	margin-top: 5px;
}

#wrapper #content #leftside #faq .gradiation {
	padding-bottom: 5px;
}


/* Leftside > Ranking
----------------------------------------------- */
.irank1 {
	background: url('../images/common/ranking-1.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank2 {
	background: url('../images/common/ranking-2.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank3 {
	background: url('../images/common/ranking-3.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank4 {
	background: url('../images/common/ranking-4.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank5 {
	background: url('../images/common/ranking-5.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank6 {
	background: url('../images/common/ranking-6.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank7 {
	background: url('../images/common/ranking-7.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank8 {
	background: url('../images/common/ranking-8.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank9 {
	background: url('../images/common/ranking-9.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank10 {
	background: url('../images/common/ranking-10.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank11 {
	background: url('../images/common/ranking-11.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank12 {
	background: url('../images/common/ranking-12.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank13 {
	background: url('../images/common/ranking-13.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank14 {
	background: url('../images/common/ranking-14.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank15 {
	background: url('../images/common/ranking-15.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank16 {
	background: url('../images/common/ranking-16.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank17 {
	background: url('../images/common/ranking-17.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank18 {
	background: url('../images/common/ranking-18.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank19 {
	background: url('../images/common/ranking-19.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}
.irank20 {
	background: url('../images/common/ranking-20.jpg') left top no-repeat;
	height: 30px;
	margin-top: 5px;
}


#wrapper #content #leftside #ranking .left p {
	margin-top: 5px;
	margin-left: 10px;
}

#wrapper #content #leftside #ranking .ranking-right {
	float: left;
	width: 90px;
	margin-left: 5px;
}

#wrapper #content #leftside #ranking .ranking-right .more {
	margin-top: 7px;
}

#wrapper #content #leftside #ranking .ranking-right .more a {
	background: url('../images/common/button-more.jpg') left top no-repeat;
	display: block;
	overflow: hidden;
	width: 99px;
	height: 22px;
	text-indent: -9999em;
}

#wrapper #content #leftside #ranking .ranking-right .more a:hover {
	background: url('../images/common/button-more-hover.jpg') left top no-repeat;
}

#wrapper #content #leftside #ranking .right {
	margin-top: 5px;
}

#wrapper #content #leftside #ranking .gradiation {
	padding-bottom: 5px;
}


/* Leftside - List configuration
----------------------------------------------- */
#wrapper #content #leftside #login li,
#wrapper #content #leftside #search li,
#wrapper #content #leftside #ranking .right li {
	background: url('../images/common/list-arrow.jpg') left 0.3em no-repeat;
	text-indent: 15px;
	/text-indent: 7px;
}

#wrapper #content #leftside #search li {
	/text-indent: 15px;
}

#wrapper #content #leftside #search .gradiation li {
	/text-indent: 7px;
}

#wrapper #content #leftside #faq li {
	background: url('../images/common/list-circledarrow.jpg') left 0.1em no-repeat;
	text-indent: 20px;
	/text-indent: 10px;
}


/* Rightside
----------------------------------------------- */
#wrapper #content #rightside {
	float: left;
	width: 740px;
	margin-left: 10px;
}

#wrapper #rightside .default-box {
	margin-left: 10px;
}



/* Rightside > Banner
----------------------------------------------- */
#wrapper #content #rightside #banner {
	background: url('../images/top/banner.jpg') left top no-repeat;
	/*
	width: 748px;
	height: 252px;
	*/
	height: 252px;
	position: relative;
	/*top: -9px;*/
}

#wrapper #content #rightside #banner p {
	width: 308px;
	position: relative;
	left: 41px;
	top: 130px;
	color: white;
	font-size: 110%;
	padding: 6px;
}


/* Rightside > Banner > On top
----------------------------------------------- */
#wrapper #content #rightside #top-banner {
	text-align: center;
	margin: 10px 0;
}


/* Rightside > Gradiation behind the description
----------------------------------------------- */
#wrapper #content #rightside #search-results .box .description,
#wrapper #content #rightside .newitem .box .description,
#wrapper #content #rightside #item-detail #more .box .description {
	background: -moz-linear-gradient(top, #F4F4F4, #F4F4F4 50%, #E0E0E0);
	background-image: -webkit-gradient(linear,left bottom,left top,color-stop(1, #F4F4F4),color-stop(0, #E0E0E0));
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#F4F4F4', endColorstr='#E0E0E0');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#F4F4F4', endColorstr='#E0E0E0')";
	zoom: 1;
	/*
	background:linear-gradient(#ffffff, #f0f0f0);
	background:-webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f0f0f0));
	background:-moz-linear-gradient(top, #ffffff, #f0f0f0);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#ffffff, endcolorstr=#f0f0f0));  
	-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#ffffff, endcolorstr=#f0f0f0))";  
	zoom: 1\9;
	*/
	border: 1px solid #C1C1C1;
	margin: 7px 0;
}

/* Top > Banner on center
----------------------------------------------- */
#wrapper #content #rightside .ranking #center-banner a {
	zoom: 0;
}

#wrapper #content #rightside .ranking #center-banner .right {
	margin-right: 30px;
}


/* Footer
----------------------------------------------- */
#wrapper #footer {
	width: 950px;
	margin: 0 auto;
	padding-top: 30px;
}

#wrapper #footer p {
	margin-bottom: 5px;
}

#wrapper #footer .copyright {
	border-top: 1px solid black;
	margin-top: 5px;
	margin-bottom: 0;
	padding-top: 5px;
}

.media-0 {
}
.media-1 {
	background-color: #7a99d6;
}
.media-2 {
}
.media-9 {
}
.media-mozaiku {
	background-color: #ffb5ff;
}
#explanation {
	font-size: 0.95em;
	margin-bottom: 20px;
	margin-left: 15px;
}

.table {
	margin-left: 15px;
}
.table th,
.table td {
	height: 35px;
	border: 1px #666666 solid;
}

.table th {
	background-color: #F1F46C;
	padding: 0 25px;
	font-size: 13px;!important /*サイズ固定*/
	/vertical-align: top;
	/padding-top: 5px;
	/padding-bottom: 4px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	.table th {
		vertical-align: top;
		padding-top: 5px;
		padding-bottom: 4px;
		height: 30px;
	}
}

.table td {
	background-color: #ffffff;
	padding: 0 10px;
	word-break: break-all;
}

.word{
	margin-bottom: 20px;
	line-height: 1.5em;
}
