@charset "UTF-8";
/*
PRODUCTS CSS
CSS Priority
-----------------------------
1.width,height
2.float,clear
3.position,top,bottom,left,right
4.overflow,display
5.margin,padding
6.text-align
7.font,line-height
8.background,border
9.etc....
-----------------------------
*/


/*-------------------------------------------------------------------------------------------------*
漬けもの読本紹介ページ
--------------------------------------------------------------------------------------------------*/
.tsukemono p.style_04	{ width:690px; margin:10px 0 0 35px; font-size:93%; line-height:18px; color:#595757;}

/*entry*/
#entry	{ width:650px; margin: 0 0 75px 30px; overflow:hidden; padding:0 25px 28px 25px; background: #f7f4ed;}
#entry h1	{ width:382px; height:92px; position:relative; margin:0 0 30px;}
#entry h1 img	{ position:absolute; top:0; left:0;}

	/*right*/
	#entry .right	{ width:400px; float:right; padding:11px 0 0 50px;}
	#entry .right p{ margin:0 0 20px; font-size:93%; color:#3e3a39; line-height:18px;}
	#entry .right ul	{ padding:20px 0 10px;}
	#entry .right li	{ padding:0 0 0 12px; color:#3e3a39; font-size:93%; line-height:25px; background:url(../../tokuhon/tsukemono/images/img_arrow.gif) no-repeat left center;}
	#entry .right li a		{ margin:0 5px 0 0; color:#604c3f; font-size:108%; font-weight:bold; border-bottom:1px solid #dfab2f;}
	#entry .right li a:hover{ color:#ad9052;}
	#entry .right em a		{ width:362px; height:31px; display:block; background:url(../../tokuhon/tsukemono/images/btn_01.png) no-repeat left top;}
	#entry .right em a:hover{ background-position:left bottom;}
	#entry .right em span	{ position:absolute; top:-9999px;}
	
	/*left*/
	#entry .left	{ width:200px; float:left; padding:20px 0 0;}
	#entry .left span	{ padding:5px 0 10px; display:block; color:#3e3a39; font-size:93%;}
	#entry .left div	{ width:200px; position:relative;}
	#entry .left p	{ width:120px; padding:5px 0 30px; color:#604c3f; font-size:93%; line-height:15px;}
	#entry .left a	{ width:106px; height:28px; display:block; margin:0 0 7px; text-indent:-9999px; background:url(../../tokuhon/tsukemono/images/btn_02.png) no-repeat left top;}
	#entry .left a.style_01:hover	{ background-position:-190px top;}
	#entry .left a.style_02			{ background-position:left -28px;}
	#entry .left a.style_02:hover	{ background-position:-190px -28px;}
	#entry .left a.style_03			{ width:190px; background-position:left -56px;}
	#entry .left a.style_03:hover	{ background-position:right -56px;}
	#entry .left a.style_04			{ width:81px; height:108px; position:absolute; top:0; right:0; margin:0; background:none; text-indent:inherit;}
	#entry .left a.style_04:hover	{ opacity:.75; filter: alpha(opacity=75); -ms-filter: "alpha(opacity=75)";}
	
	

/*culum*/
#culums	{ width:700px; margin:0 0 0 30px;}
.culum			{ padding:0 0 63px;}
.culum div		{ width:335px; float:left; padding:32px 0 0 25px;}
.culum img		{ float:left; padding:32px 0 0;}
.culum h2		{ width:700px; height:34px; position:relative;}
.culum h2 img	{ position:absolute; top:0; left:0; padding:0;}
.culum h3		{ margin:0 0 22px; font-size:116%; font-weight:bold; line-height:19px; color:#60401c;}
.culum p		{ width:306px; font-size:93%; line-height:20px; color:#3e3a39;}
.culum p a		{ width:66px; height:16px; display:block; margin:5px 0 0 0; text-indent:-9999px; background:url(../../tokuhon/tsukemono/images/btn_03.png) no-repeat left top;}
.culum ul		{ clear:both; padding:31px 0 8px 25px; overflow:hidden;}
.culum li		{ width:139px; position:relative; float:left; padding:14px 13px; margin:0 20px 0 0; color:#595757; font-size:93%; line-height:17px; background:#f6f3e1;}
.culum li img	{ float:none; padding:0 0 5px;}
.culum li a		{ width:66px; height:16px; position:absolute; bottom:-7px; right:15px; display:block; text-indent:-9999px; background:url(../../tokuhon/tsukemono/images/btn_03.png) no-repeat left top;}
.culum p a:hover,
.culum li a:hover	{ background-position:left bottom;}


/*buy*/
#buy	{ width:702px; margin:0 0 0 29px; overflow:hidden; border:1px solid #7f572c; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
#buy h2	{ width:251px; height:34px; position:relative;}
#buy h2 img	{ position:absolute; top:0px; left:0px;}

	/*inner*/
	#buy .inner h3	{ font-weight:bold; color:#604c3f;}
	#buy .inner	{ padding: 18px 25px 25px 25px;}
	#buy .inner em	{ display:block; padding:7px 0 10px; font-weight:bold; font-size:116%; line-height:25px; color:#595757;}
	#buy .inner a { color:#fe0101;}
	#buy .inner a:hover { text-decoration: underline;}
	#buy .inner .netshop { margin: 20px 0 0 0}

	/*left*/
	#buy .left	{ width:375px; float:left; padding: 18px 0 25px 25px;}
	#buy ul		{ padding: 0 0 20px;}
	#buy li		{ color:#595757; line-height:22px; padding:0 0 0 16px; background:url(../../tokuhon/tsukemono/images/img_listmarker.gif) no-repeat left 5px;}
	#buy strong	{ display:block; padding:4px 14px; margin:0 0 35px; color:#595757; font-weight:bold; line-height:25px; border:1px solid #ddd;}
	#buy h3		{ display:block; padding:0 0 5px; font-size:17px; line-height:25px; color:#604c3f;}
	#buy p		{ color:#595757; line-height:22px;}
	#buy .left em		{ display:block; padding:7px 0 10px; font-weight:bold; font-size:116%; line-height:25px; color:#595757;}
	#buy td				{ width:100px; padding:0 7px 0 8px; line-height:35px; color:#595757; border:#ccc solid 1px;}
	#buy tr.style_01	{ background:#f0ece6;}
	#buy td.style_02	{ width:80px;}
	#buy td.style_03	{ width:140px;}
	#buy td.style_04	{ width:204px; padding:8px; line-height:20px;}
	
	/*right*/
	#buy .right	{ width:220px; float:left; position:relative; padding:18px 0 25px 55px;}
	#buy .right img	{ display:block;}
	#buy .right span{ display:block; padding:10px 0 0; line-height:25px; color:#fe0101;}
	#buy .right em	{ width:184px; padding:18px; margin:154px 0 0 0; position:relative; display:block; line-height:25px; color:#595757; background:url(../../tokuhon/tsukemono/images/culum_05/line_bg.gif) repeat-y left top;}
	#buy .right em img.style_01	{ position:absolute; left:0; top:0;}
	#buy .right em img.style_02 { position:absolute; left:0; bottom:0;}
	


/*form_link*/
#form_link	{ width:700px; margin:30px 0 134px 30px; overflow:hidden;}

#form_link div	{ position:relative; float:left;}
#form_link div p		{ color:#fff; font-size:93%; line-height:18px;}
#form_link div a		{ width:178px; height:26px; position:absolute; right:19px; bottom:0; text-indent:-9999px; display:block; background:url(../../tokuhon/tsukemono/images/btn_04.png) no-repeat left top;}
#form_link div img		{ display:block;}
#form_link .style_01	{ width:301px; height:179px; position:relative;}
#form_link .style_02	{ width:383px; height:164px; position:relative; margin:15px 0 0 16px;}
#form_link .style_01 a	{ width:301px; height:179px; position:absolute; top:0; left:0;}
#form_link .style_02 a	{ width:383px; height:164px; position:absolute; top:0; left:0;}
#form_link div a:hover	{ opacity:.85; filter: alpha(opacity=85); -ms-filter: "alpha(opacity=85)";}






/*-------------------------------------------------------------------------------------------------*
漬けもの読本　立ち読みコーナー
--------------------------------------------------------------------------------------------------*/
.read	{}
.read #contents		{ margin:0 0 0 36px;}
.read h1			{ width:383px; height:35px; position:relative; overflow:hidden; margin:0 0 30px;}
.read h1 img		{ position:absolute; top:0; left:0;}
.read #contents p	{ min-height:28px; padding:0 0 0 34px; margin:0 0 9px 25px; line-height:22px; color:#3e3a39; background:url(../../tokuhon/tsukemono/read/images/img_mark.png) no-repeat left top;}

#pages		{ width:700px; padding:6px 0 60px 25px; overflow:hidden;}
#pages a		{ float:left; padding:1px; margin-right:7px; background:#ccc; -webkit-transition:0.2s; -moz-transition:0.2s; -o-transition:0.2s; transition:0.2s;}
#pages img		{-webkit-transition:0.2s;-moz-transition:0.2s;-o-transition:0.2s;transition:0.2s;}
#pages a:hover	{ background:#dfab2f; -webkit-box-shadow:0 0 2px #dfab2f; -moz-box-shadow:0 0 2px #dfab2f; box-shadow:0 0 2px #dfab2f;}
#pages a:hover img	{opacity:.94; filter: alpha(opacity=94); -ms-filter: "alpha(opacity=94)";}


#book_index	{ margin:0 0 60px 25px;}
#book_index h2	{ margin-bottom:25px; }
#book_index div	{ margin-bottom:20px; overflow:hidden;}
#book_index h3	{ float:left; margin-right:10px; font-size:116%; color:#3e3a39; font-weight:bold; line-height:18px; border-bottom:1px solid #3e3a39;}
#book_index em	{ float:left; padding:0 8px; font-size:93%; line-height:20px; color:#3e3a39; cursor:pointer; background:#e3edc6; -webkit-transition:0.2s;}
#book_index em:hover	{ color:#fff; background:#a3c442;}
#book_index ul	{ clear:both; padding:15px 0 0 10px;}
#book_index li	{ line-height:20px; color:#3e3a39;}
#book_index strong	{ font-weight:bold;}


	

/*-------------------------------------------------------------------------------------------------*
漬け物写真募集中
--------------------------------------------------------------------------------------------------*/

/*recruit*/
#recruit	{ width:650px; margin: 0 0 40px 30px; padding:5px 25px 0 25px; background: url(../../tokuhon/tsukemono/form/images/parts_04.gif) repeat-x left top #f7f4ed;}
#recruit h1		{ width:358px; height:76px; position:relative; margin-bottom:19px; overflow:hidden;}
#recruit h2	{ width:651px; height:21px; position:relative; overflow:hidden; margin:0 0 23px;}
#recruit h1 img,
#recruit h2 img{ position:absolute; top:0; left:0;}
#recruit em		{ width:102px; height:102px; position:absolute; right:130px; top:0; background:url(../../tokuhon/tsukemono/form/images/img_limit.png) no-repeat left top;}
#recruit em span{ position:absolute; top:-9999px;}
#recruit p			{ width:375px; line-height:22px; color:#3e3a39;}
#recruit p.style_01	{ width:auto; margin:0 0 10px; font-size:116%; line-height:25px; font-weight:bold;}
#recruit a			{ color:#3e3a39; text-decoration:underline;}
#recruit a:hover	{ color:#ad9052;}

#recruit div.style_01	{ position:relative; padding: 0 0 56px;}
#recruit dl				{ width:232px; overflow:hidden; margin-bottom:36px; padding:10px 12px; border:1px solid #60401c; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
#recruit dt,
#recruit dd				{ float:left;}
#recruit dt				{ width:85px; height:115px;}
#recruit dd				{ width:104px; padding:5px 0 0 10px; font-size:93%; line-height:17px; color:#3e3a39;}
#recruit span.style_01	{ width:169px; height:134px; position:absolute; top:4px; left:218px;}
#recruit span.style_02	{ width:261px; height:161px; position:absolute; bottom:25px; right:0px;}

#recruit div.style_02	{ overflow:hidden; padding:0 0 28px;}
#recruit div.style_02 div	{ float:left;}
#recruit div.style_02 p		{ width:146px; float:left; padding:0 0 0 16px;}
#recruit div.style_02 p	img	{ padding:5px 0 0;}


/*form*/
#form			{ width:700px; margin:0 0 65px 30px; padding-bottom:5px; overflow:hidden;}
#form h2		{ width:660px; padding:6px 20px 6px; margin:0 0 15px 2px; position:relative; color:#fff; font-size:20px; font-weight:bold; background:#a3c442;}
#form h3		{ margin:0 0 0 2px; color:#60401c; font-size:20px; line-height:30px; font-weight:bold;}
#form h4		{ margin:0 0 0 2px; font-size:93%; color:#3e3a39; font-weight:bold;}
#form p			{ line-height:20px; color:#3e3a39; font-size:93%; margin:0 0 18px 2px;}
#form ul		{ margin:0 0 18px 2px;}
#form li		{ font-size:93%; line-height:18px; color:#3e3a39;}
#form .style_01 li	{ font-size:85%;}
#form li span	{ color:#ff0000;}
#form span.style_01	{ color:#ff0000;}
#form span.style_02	{ color:#1e92c9;}

#form #mailer { width:108px; display:block; text-align:center; font-weight:bold; color:#fff; cursor:pointer; border:none; -webkit-transition:0.2s; -moz-transition:0.2s; -o-transition:0.2s; transition:0.2s;}
#form #mailer:hover { opacity: .8; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=80)"; }


		
		/*querst*/
		#quest		{ width:700px; margin:0 0 32px; background:#f7f4ed;}
		#quest h5	{ margin:0 0 0 15px; padding:15px 15px 25px 30px; color:#3e3a39; font-size:15px; line-height:20px; font-weight:bold; background:url(../../tokuhon/tsukemono/form/images/q.gif) no-repeat left 21px;}
		#quest div	{ padding:0 15px 0 15px;}
		#quest label{ padding-right:60px; font-weight:bold; color:#3e3a39;}
		#quest span	{ padding:10px 0 15px 0; display:block; color:#3e3a39;}
		
		
			
/*-------------------------------------------------------------------------------------------------*
漬け物写真　確認画面
--------------------------------------------------------------------------------------------------*/
/*form*/
#comp			{ margin:0 0 0 30px;}
#comp h2		{ width:660px; padding:6px 20px 6px; margin:0 0 19px 0; position:relative; color:#fff; font-size:20px; font-weight:bold; background:#969696;}
#comp h2 span	{ position:absolute; left:140px; top:11px; font-size:13px; margin:0 0 0 20px;}
#comp span.style_01	{ color:#ff0000;}
#comp span.style_02	{ color:#1e92c9;}

#comp em		{ padding:0 0 19px; display:block; overflow:hidden; line-height:20px; color:#3e3a39;}
#comp em span	{ float:left; display:block; padding:2px 23px 0 0; font-weight:bold;}
#comp em input	{ float:left; display:block; font-size:13px; color:#221815;}
#comp p.style_02{ padding:0 0 0 20px; line-height:30px;color:#3e3a39; }
#comp p.style_02 a			{ color:#3e3a39; text-decoration:underline;}
#comp p.style_02 a:hover	{ color:#ad9052;}


#comp form		{ width:700px; margin:0 0 104px; padding-bottom:5px; overflow:hidden;}
	
	/*form dl*/
	#comp dl	{ width:700px; margin:0 0 24px 0; overflow:hidden; background:url(../../tokuhon/tsukemono/form/images/parts_05.gif) repeat-y left top;}
	#comp dl.last	{ margin:0;}
	#comp dt,
	#comp dd	{ float:left; outline:hidden; border-top:1px solid #969696;}
	#comp dt	{ width:168px; font-size:100%; line-height:20px; padding: 12px 12px 12px 13px; clear:both; color:#3e3a39; text-align:left;}
	#comp dd	{ width:494px; font-size:108%; padding: 12px 0 12px 13px; color:#3e3a39;}
	
	#comp dt span	{ color:#e60012;}
	#comp dt strong	{ font-weight:bold;}
	#comp dt.first,
	#comp dd.first	{ border:none;}
	#comp p span	{ color:#e60012;}
	#comp em.last	{ padding:5px 0 24px 5px; font-size: 93%; line-height: 18px;color: #e60012;}

		/*input*/
		#comp dd.form_btn		{ padding-top:12px;}
		#comp dd.form_btn input	{ width:20px; display:inline-block; border:none;}
		#comp dd.form_btn label	{ padding:0 12px 0 0; display:inline-block;}		
		#comp dd textarea#input_8-2	{ display:none;}

		/*form_btn*/
		#comp p#form_btn		{ padding-left:231px; text-align:center;}
		#comp p#form_btn input	{ width:108px; height:27px; float:left; border:none; background:url(../../tokuhon/tsukemono/form/images/form_02.gif) no-repeat left top; -webkit-transition:0.2s;-moz-transition:0.2s;-o-transition:0.2s;transition:0.2s;}
		#comp p#form_btn input.active		{ cursor:pointer;}
		#comp p#form_btn input.active:hover	{ opacity: .9; filter: alpha(opacity=90); -ms-filter: "alpha(opacity=90)"; -webkit-box-shadow:0 0 5px #aaa;-moz-box-shadow:0 0 5px #aaa;box-shadow:0 0 5px #aaa;}
		#comp p#form_btn a		{ width:108px; height:27px; float:left; display:inline-block; margin:0 0 0 30px; -webkit-transition:0.2s;-moz-transition:0.2s;-o-transition:0.2s;transition:0.2s;}	
		#comp p#form_btn a:hover{opacity: .9; filter: alpha(opacity=90); -ms-filter: "alpha(opacity=90)"; -webkit-box-shadow:0 0 5px #aaa;-moz-box-shadow:0 0 5px #aaa;box-shadow:0 0 5px #aaa;}
		#comp #btn_send	{ opacity:0.3; filter: alpha(opacity=30); -ms-filter: "alpha(opacity=30)";}
		
		/*ie*/
		*+html #comp dt,
		*+html #comp dd	{ height:20px;}
		*+html #comp dt.style_01,
		*+html #comp dd.style_01	{ height:auto;}