@charset "utf-8";

/*
	* Name: common.css
	* License: MIT License
	  - http://www.opensource.org/licenses/mit-license.php
	* Author: Hiroaki Nakagawa
	* Author URI: http://www.3050grafix.com/
	* Author E-mail: hiro@3050grafix.com

	* Contents:
	  - 02. 領域設定 - ブロック -
	    - 02-01. 領域設定 - コンテナ -
	    - 02-02. 領域設定 - Header -
	    - 02-03. 領域設定 - Navigation -
	    - 02-04. 領域設定 - Contents -
	      - 02-04-01. 領域設定 - Title -
	    - 02-05. 領域設定 - News -
	    - 02-06. 領域設定 - Main -
	      - 02-06-01. 領域設定 - Thumbnail -
		  - 02-06-02. 領域設定 - Profile -
		  - 02-06-03. 領域設定 - Specific -
*/


/* Load External Files */

@import url('../../../common/css/import.css');


/* Stylesheet Document */

@media screen {

	/* ========================================
	   * 02-04-01. 領域設定 - Title -
	======================================== */

	#contents h2#title_profile {
		background-image:  url("../img/title_profile.gif");
		margin-bottom: 0;
	}

	#contents h2#title_recital {
		background-image:  url("../img/title_recital.gif");
	}

	#contents h2#title_quality {
		background-image:  url("../img/title_quality.gif");
	}

	#contents h2#title_option {
		background-image:  url("../img/title_option.gif");
	}

	#contents h2#title_persistence {
		background-image:  url("../img/title_persistence.gif");
	}

	#main h2#title_friends {
		background-image:  url("../img/title_friends.gif");
	}


	/* ========================================
	   * 02-06. 領域設定 - Main -
	======================================== */

	#main div.container table tr td a#soldout,
		#main div.container table tr td span#soldout {
			color: #C03030;
			font-weight: bold;
	}


	/* ========================================
	   * 02-06-01. 領域設定 - Thumbnail -
	======================================== */

	#main ol.thumbnail {
		list-style-type: none;
		margin-bottom: 12px;
		margin-left: auto !important;
		margin-right: auto !important;
		width: 720px;
	}

	#main ol.thumbnail li {
		float: left;
		font-size: 80%;
		margin-bottom: 18px !important;
		margin-left: 11px;
		margin-right: 11px;
		text-align: left;
		width: 158px;
	}

	#main ol.thumbnail:after {
		clear: both;
		content: ".";
		display: block;
		height: 0;
		line-height: 0; /* CSS HACK: Safari */
		font-size: 0; /* CSS HACK: Firefox3 */
		visibility: hidden;
	}

	#main ol.thumbnail li a {
		background-color: #F5F5EA;
		border: 1px solid #B3A593;
		color: #6A5B4A;
		display: block;
		padding: 8px 16px 0 16px;
		text-decoration: none;
	}

	#main ol.thumbnail li a:hover {
		background-image: url("../img/bg_thumbnail.gif");
		background-position: left top;
		background-repeat: repeat-x;
		background-color: #FBB339;
		border: 1px solid #F59014;
		color: #FFFFFF;
	}

	#main ol.thumbnail li a span,
		#contents ol.thumbnail li a img {
			display: block;
			margin: 0 0 10px 0;
	}

	#main ol.thumbnail li a span {
		line-height: 130%;
	}

	#main ol.thumbnail li a span.title,
		#contents ol.thumbnail li a span.price,
			#contents ol.thumbnail li a span.soldout {
			font-weight: bold;
	}

	#contents ol.thumbnail li a span.soldout {
		color: #C03030;
	}

	#main ol.thumbnail li a span.title {
		height: 26px;
	}

	#main ol.thumbnail li a img {
		border: 1px solid #B7B1A2;
	}

	#main ol.thumbnail li a:hover img {
		border: 1px solid #FFFFFF;
	}

	#main ol.thumbnail li a br {
		display: none;
	}


	/* ========================================
	   * 02-06-02. 領域設定 - Profile -
	======================================== */

	#main div.container div#profile {
		float: left;
		margin: 0 24px 0 0;
		width: 363px;
	}

	#main div.container div#profile p {
		color: #7A736C;
	}

	#main  div#profile div#order {
		margin: 0 auto 46px auto;
		width: 210px;
	}


	/* ========================================
	   * 02-06-03. 領域設定 - Specific -
	======================================== */

	#main div.container div#specific {
		float: left;
		margin: 0;
		width: 363px;
	}

	#main div.container div#specific ol.relateditems {
		margin-bottom: 30px;
		margin-top: 0;
		width: 348px !important;
	}

	#main div.container div#specific ol.relateditems:after {
		clear: both;
		content: ".";
		display: block;
		height: 0;
		line-height: 0; /* CSS HACK: Safari */
		font-size: 0; /* CSS HACK: Firefox3 */
		visibility: hidden;
	}

	#main div.container div#specific ol.relateditems li {
		border: 1px solid #DBD8D0;
		height: 122px;
		margin: 5px !important;
		width: 162px;
	}

	#main div.container div#specific ol.relateditems li img {
		margin: 1px;
		vertical-align: middle;
	}

	#main div.container div#specific a.custommade {
		color: #C03030;
		font-weight: bold;
	}

	#main div.container div#specific ul {
		clear: both;
		list-style-type: circle;
		margin-bottom: 30px;
		margin-left: 30px;
	}

	#main div.container div#specific ul li {
		text-align: left;
	}

	#main div.container div#specific ul li a em {
		color: #41382E;
	}

	#main div.container div#specific ul#washing {
		list-style-type: none;
		margin: -24px auto 10px auto;
		width: 316px;
	}

	#main div.container div#specific ul#washing li {
		float: left;
		margin-bottom: 4px;
		margin-left: 8px;
		margin-right: 8px;
	}

	#main div.container div#specific ul#washing li img {
		margin: 8px 0 12px 0;
	}

}