@charset "utf-8";
/*
Theme Name: Nanzanen
Description: 南山園テンプレート
Author: ave
Version: 1.1
*/

/* ------------------------------------------------
floatをクリア
--------------------------------------------------- */

.clearfix:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
} /*IE7以外のモダンブラウザ向け*/

.clearfix{display:inline-block;} /*IE7およびMacIE5向け*/

/*Hides from IE-mac\*/
* html .clearfix{height:1%;}
.clearfix{display:block;}
/*End hide from IE-mac*/ /*IE6以前向け*/


/* --------------------------------------------------
デフォルトのCSS設定をリセット
----------------------------------------------------- */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}

/* ------------------------------------------------
2025.11.13 追記分
--------------------------------------------------- */
.add_wrap_contents {
	margin-top: 100px;
	background-image:url(../img/english/bg.jpg);
}

.add_contents {
	margin: 100px auto;
	padding: 0 20px;
	width: fit-content;
	background-color:#EDF0DD;
}

@media (max-width: 768px) {
	.add_contents {
		padding: 0 80px;
	}
}

.c-header .c-nav ul{
	margin-right: 30px;
}



/* --------------------------------------------------
フォントサイズを統一
----------------------------------------------------- */
/*移動*/



/* --------------------------------------------------
base.css
ページ構成及び各ページ固有のCSS設定
----------------------------------------------------- */

/* --------------------------------------------------
body設定
----------------------------------------------------- */

/* body {
	background-color:#FFFFFF;
	font-family:arial,"ＭＳ Ｐゴシック";
	line-height:160%;
	color:#333333;
	text-align:center;
	background-image:url(img/base/bg.jpg);
}

/* フォント初期設定 */

body {
  font-size: 75%; /* IE */
}
html>/**/body {
  font-size: 12px; /* Except IE */
} */


/* リンク */

a {
	color:#006633;
	text-decoration:underline;
	}
	a:hover {
		color:#009900;
		text-decoration:underline;
	}

/* .wrap_contents {
	text-align:center;
	background-image:url(img/base/bg_contents.jpg);
	background-repeat:repeat-y;
	background-position:center;
} */


/* --------------------------------------------------
id="header" ヘッダー設定
----------------------------------------------------- */
/* 
#header {
	width:960px;
	margin: 0 auto;
	text-align:left;
	background-image:url(img/base/bg_header.jpg);
	background-position:top right;
	background-repeat:no-repeat;
}

#header h1 {
	color:#003333;
	padding: 10px 0 0 20px;
}
#header h2 a {
	display:block;
	float:left;
	width:280px;
	height:70px;
	margin-left:5px;
	text-indent:-9999px;
	background-image:url(img/base/img_logo.jpg);
	background-position:left;
	background-repeat:no-repeat;
}
.enLink{
margin:40px 10px 0 0;
text-align:right;
font-size:130%;
font-weight:bold;
} */

/* --------------------------------------------------
id="navi" グローバルナビ設定
----------------------------------------------------- */
/* 
ul.navi {
	clear:both;
	height:40px;
}
ul.navi li {
	float:left;
	text-indent:-9999px;
	height:40px;
}
ul.navi li a {
	display:block;
	height:40px;
	background-image:url(img/base/navi.jpg);
	background-repeat:no-repeat;
}
ul.navi li.n01 a {
	width:110px;
	background-position: 0px 0px;
	}
	.navi li.n01 a:hover {
	background-position: 0px -40px;
	}
	ul.navi li.n01_on a {
	width:110px;
	background-position: 0px -40px;
	}
ul.navi li.n02 a {
	width:115px;
	background-position: -110px 0px;
	}
	ul.navi li.n02 a:hover {
	background-position: -110px -40px
	}
	ul.navi li.n02_on a {
	width:115px;
	background-position: -110px -40px
	} */
/* ------------------------------------------------
オンラインショップＯＦＦ
ul.navi li.n03 {
	width:145px;
	background-position: -225px 0px;
	background-image:url(img/base/navi.jpg);
	background-repeat:no-repeat;
	}
--------------------------------------------------- */
/* ul.navi li.n03 a {
	width:145px;
	background-position: -225px 0px
	}
	ul.navi li.n03 a:hover {
	background-position: -225px -40px
	}
	ul.navi li.n03_on a {
	width:145px;
	background-position: -225px -40px
	}
ul.navi li.n04 a {
	width:160px;
	background-position: -370px 0px
	}
	ul.navi li.n04 a:hover {
	background-position: -370px -40px
	}
	ul.navi li.n04_on a {
	width:160px;
	background-position: -370px -40px
	}
ul.navi li.n05 a{
	width:140px;
	background-position: -530px 0px
	}
	ul.navi li.n05 a:hover {
	background-position: -530px -40px
	}
	ul.navi li.n05_on a {
	width:140px;
	background-position: -530px -40px
	}
ul.navi li.n06 a{
	width:140px;
	background-position: -670px 0px
	}
	ul.navi li.n06 a:hover {
	background-position: -670px -40px
	}
	ul.navi li.n06_on a {
	width:140px;
	background-position: -670px -40px
	}
ul.navi li.n07 a{
	width:150px;
	background-position: -810px 0px
	}
	ul.navi li.n07 a:hover {
	background-position: -810px -40px
	}
	ul.navi li.n07_on a {
	width:150px;
	background-position: -810px -40px
	} */


/* --------------------------------------------------
id="contents" 設定
----------------------------------------------------- */

/* #contents {
	width:960px;
	margin: 0 auto;
	padding:0px;
	text-align:left;
	font-size:120%;
	line-height:160%;
	overflow: hidden;
	zoom:1;
} */


/* --------------------------------------------------
メインコンテンツ設定
----------------------------------------------------- */

div.topImg{margin:0 0 20px 0;}

/* 左コンテンツ */

div.leftContents {
	float:left;
	width:700px;
	/* padding: 0 0 0 20px; */
	text-align:left;
}
div.wrap {
	width:680px;
	margin: 15px 0 15px 10px;
	overflow: hidden;
	zoom:1;
}


/* 最新情報 */

div.leftContents h3 {
	background-image:url(../img/english/bg_title.jpg);
	background-repeat:no-repeat;
	width:700px;
	height:40px;
	margin: 0 0 10px 0;
	clear:both;
}
div.leftContents h3 span {
	display:block;
	font-size:130%;
	font-weight:bolder;
	padding: 10px 0 0 25px;
}
dl.news {
	margin: 0 10px 10px 10px;
	padding: 5px;
	border-bottom: 1px dotted #cccccc;
}
dl.news dt {
	float:left;
	padding-right: 20px;
	font-size:90%;
	letter-spacing:0.1em
}


/* 3段ボックス */

div.box3 {
	float: left;
	width: 210px;
	margin: 10px 0 10px 11px;
}

div.box3_300 {
	float: left;
	width: 300px;
	margin: 10px 0 10px 10px;
}

div.box3_220 {
	float: left;
	width: 220px;
	margin: 10px 0 10px 10px;
}

div.box3_135 {
	float: left;
	width: 135px;
	margin: 10px 0 10px 10px;
}
div.box3 h4 {
	font-size:120%;
	font-weight:bolder;
	padding: 5px 0 5px 0;
	letter-spacing:-0.05em;
}
div.box3 img, div.box3_300 img, div.box3_220 img, div.box3_135 img {
	border: 1px solid #cccccc;
}


/* --------------------------------------------------
サイドナビ設定
----------------------------------------------------- */

div.rightContents {
	float:left;
	width:200px;
	padding: 0 0 0 20px;
}

h4.submenuTitle {
	width:200px;
	height:30px;
	color:#ffffff;
	background-color:#006600;
	background-image:url(img/base/submenutitle.jpg);
	background-repeat:no-repeat;
}
h4.submenuTitle a{
	padding: 5px 0 0 10px;
	display:block;
	color:#FFF;
	text-decoration:none;
}
h4.submenuTitle a:hover{text-decoration:underline;}

ul.submenu{
	margin:10px 0 10px 0;
}
ul.submenu li {
	width:185px;
	padding: 5px 0px 5px 15px;
	border-bottom: 1px dotted #006600;
	background-image:url(img/base/arw2.gif);
	background-position:left 7px;
	background-repeat:no-repeat;
	line-height:120%;
}
ul.submenu li a {
	text-decoration:none;
}

h4.phoneTitle {
	width:200px;
	height:30px;
	color:#ffffff;
	background-color:#006600;
	background-image:url(img/base/title_phone.jpg);
	background-repeat:no-repeat;
}
h4.phoneTitle span{
	padding: 5px 0 0 10px;
	display:block;
}
h4.phoneTitle a {
	color:#ffffff;
	text-decoration:none;
}
h4.phoneTitle a:hover {
	color:#FFFF33;
	text-decoration:none;
}

div.phone {
	width:200px;
	border:1px solid #cccccc;
	background-color:#EDF2EC;
}
p.nishio {
	margin: 10px 0 10px 0;
	padding: 0 0 5px 0;
	border-top:1px dotted #cccccc;
	border-bottom:1px dotted #cccccc;
	font-size:90%;
}


/* --------------------------------------------------
第二階層以下のコンテンツ設定
----------------------------------------------------- */

/* パンくずリスト */

div.pankuzu {
	background-image:url(img/base/bg_pankuzu.jpg);
	background-repeat:repeat-x;
	color:#FFFFFF;
	height:30px
}
div.pankuzu p {
	padding: 5px 0 0 20px;
	font-size:90%;
}
.pankuzu a {
	color:#FFFFFF;
	text-decoration:none;
	padding: 10px 0 0 0
}
.pankuzu a:hover {
	color:#FFFFFF;
	text-decoration:underline;
	padding: 10px 0 0 0
}


/* このページのトップへ */

#contents p.pagetop {
	text-align:right;
	font-size:90%;
	margin: 20px 0 40px 0;
	clear:both;
	}
	#footer p.pagetop a:hover {
	color:#006600;
	}
#contents p.pagetop a {
	background-image:url(../img/base/arw.gif);
	background-position:right;
	background-repeat:no-repeat;
	padding: 0 12px 0 0;
	color:#333333;
	}
	#footer p.pagetop a:hover {
	color:#006600;
	}
#contents p.link {
	border-top: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
	padding: 10px 0 10px 0;
}



/* コンテンツタイトル */

#contents h2 {
	background-repeat:no-repeat;
	height:100px;
	text-indent:-9999px;
	margin: 0 0 20px 0;
}
#contents h2.company {
	background-image:url(img/base/title_company.jpg);
}
#contents h2.topic {
	background-image:url(img/base/title_topic.jpg);
}
#contents h2.chacha {
	background-image:url(img/base/title_chacha.jpg);
}
#contents h2.partner {
	background-image:url(img/base/title_partner.jpg);
}
#contents h2.customer {
	background-image:url(img/base/title_partner.jpg);
}
#contents h2.contact {
	background-image:url(img/base/title_contact.jpg);
}

#contents h2.news {
	background-image:url(img/base/title_news.jpg);
}

/* 会社案内 */

table.gaiyou {
	background-image:url(../img/english/bg_gaiyou.jpg);
	background-position:top right;
	background-repeat:no-repeat;
	background-color:#ffffff;
	margin: 10px 0px 20px 10px;
}
table.gaiyou th {
	width:80px;
	background-color:#96BE64;
	padding:5px;
	text-align:center;
}
table.gaiyou td {
	width:600px;
	padding:5px;
}
p.subtitle_grn {
	color:#009900;
	font-weight:bolder;
	display:inline
	
}
div.waku {
	background-color:#FFFFFF;
	color:#999999;
	padding:10px;
	margin: 5px 0 0 0;
}
div.getReader {
	margin: 20px 0 20px 0;
	font-size:90%;
}
div.getReader img{
	margin-right:10px
}


/* 法人のお客様 */
ul.phList{
	overflow: hidden;
	zoom:1;
	margin: 10px 0 10px 0;
}
ul.phList li{
	float:left;
	text-align:center;
	margin: 0 10px 0 0;
}

/* お茶の歴史 */

.ph_history_r {
	float:right;
	margin: 0 0 0 20px
	}
	.ph_history_r img {
		border:1px solid #cccccc;
		padding:5px;
		background-color:#FFFFFF;
	}

.ph_history_l {
	float:left;
	margin: 20px 20px 20px 0;
	}
	.ph_history_l img {
		border:1px solid #cccccc;
		background-color:#FFFFFF;
		padding:5px;
	}
.ph img {
	border:1px solid #cccccc;
	background-color:#FFFFFF;
	padding:5px;
}


/* お茶のできるまで */

.txtLeft {
	float:left;
	width:340px;
}
h4.topic {
	color:#006600;
	font-size:110%;
	letter-spacing:-0.05em;
	font-weight:bolder;
	border-bottom: 1px dotted #006600;
	padding:5px;
	width:330px;
	}
.phRight {
	float:left;
	width:340px;
	text-align:right;
	}
	.phRight img {
		border:1px solid #cccccc;
		background-color:#FFFFFF;
		padding:5px;
	}


/* おいしいお茶をいただくには */

.box_gtea1 {
	background-image:url(img/topic/bg_title_greentea1.jpg);
	background-repeat:no-repeat;
	background-color:#FFFFFF;
	border:1px solid #cccccc;
	padding: 60px 10px 10px 10px;
	margin: 40px 0 20px 0;
}

.box_gtea2 {
	background-image:url(img/topic/bg_title_greentea2.jpg);
	background-repeat:no-repeat;
	background-color:#FFFFFF;
	border:1px solid #cccccc;
	padding: 60px 10px 10px 10px;
	margin: 40px 0 20px 0;
}

.box_gtea3 {
	background-image:url(img/topic/bg_title_greentea3.jpg);
	background-repeat:no-repeat;
	background-color:#FFFFFF;
	border:1px solid #cccccc;
	padding: 60px 10px 10px 10px;
	margin: 40px 0 20px 0;
}

table.tbl_tea th {
	font-weight:bolder;
	vertical-align:top;
}
table.tbl_tea td {
	vertical-align:top;
}
table.tbl_tea strong {
	color:#FF6600;
	font-weight:normal;
}

.flow_gtea li {
	background-position:top left;
	background-repeat:no-repeat;
	padding: 0 0 0 40px;
	margin: 10px 0 0 0;
}
.flow_gtea li img {
	float: right;
	border:1px solid #cccccc;
	padding:3px;
	background-color:#FFFFFF;
	margin: 0 0 0 10px;
}
.flow_gtea li.no01 {background-image:url(img/topic/01.jpg);}
.flow_gtea li.no02 {background-image:url(img/topic/02.jpg);}
.flow_gtea li.no03 {background-image:url(img/topic/03.jpg);}





/* お問い合わせ */

table.tbl_contact {
	margin:20px 0 20px 0;
}
table.tbl_contact th, table.tbl_contact td {
	vertical-align:top;
	padding:5px;
}

h4.privacy {
	color:#FFFFFF;
	font-weight:bolder;
	padding: 0px 5px 0px 5px;
	margin: 100px 0 10px 0;
	background-color:#000000;
	}



/* --------------------------------------------------
id="footer" 設定
----------------------------------------------------- */

/* #footer {
	width:960px;
	margin: 0 auto;
	clear:both;
}

#footer p.pagetop {
	background-image:url(img/base/bg_pagetop.jpg);
	width:160px;
	margin: 50px 10px 0 750px;
	padding: 4px 0 3px 0;
}
#footer p.pagetop a {
	background-image:url(img/base/arw.gif);
	background-position:right;
	background-repeat:no-repeat;
	padding: 0 12px 0 0;
	color:#333333;
	}
	#footer p.pagetop a:hover {
	color:#006600;
	}

#footer ul.footerlink {
	border-top: 1px solid #cccccc;
	padding: 10px 0 10px 30px;
	overflow: hidden;
	zoom:1;
}
#footer ul.footerlink li {
	float:left;
	text-align:left;
	padding: 0px 15px 0px 5px;
	border-left:2px solid #999933;
}

dl.footerLogo  {
	margin: 20px 0 20px 30px;
	overflow: hidden;
	zoom:1;
}
dl.footerLogo dt {
	float:left;
	width:150px;
	margin: 0 10px 0 0;
}
dl.footerLogo dd {
	float:left;
	width:220px;
	margin: 0 10px 0 0;
	text-align:left;
}


#footer p.copyright {
	border-top: 1px solid #cccccc;
	padding: 20px 0 100px 1px;
	background-image:url(img/base/bg_footer.jpg);
	background-repeat:no-repeat;
	background-position:bottom;
}

#footer a {
	color:#333333;
	text-decoration:none;
	}
	#footer a:hover {
	color:#333333;
	text-decoration:underline;
} */


/* --------------------------------------------------
common.css
全ページ共通のテーブル＆文字装飾CSS設定
----------------------------------------------------- */

	
/* 基本のテーブル */

td, th {
font-size:95%;
line-height:150%;
}

table.tbl_common {
	margin: 10px 0 10px 10px;
	border-top: 1px solid #CCCCCC;
	}
	.tbl_common th {
		padding:5px;
		border-bottom: 1px solid #CCCCCC;
		text-align:center;
		vertical-align:top;
	}
	.tbl_common td {
		padding:5px;
		border-bottom: 1px solid #CCCCCC;
		vertical-align:top;
	}
table.tbl_common2 {
	margin: 5px 0 5px 0;
	border-top: 1px solid #EDF0DD;
	border-right: 1px solid #EDF0DD;
	background-color:#FFFFFF;
	}
	.tbl_common2 th {
		padding:5px;
		border-bottom: 1px solid #EDF0DD;
		border-left: 1px solid #EDF0DD;
		text-align:center;
		vertical-align:top;
		background-color:#96BE64;
	}
	.tbl_common2 td {
		padding:5px;
		border-bottom: 1px solid #EDF0DD;
		border-left: 1px solid #EDF0DD;
		vertical-align:top;
	}


/* --------------------------------------------------
文字装飾・幅・余白・文字位置
----------------------------------------------------- */

/* 文字装飾 */

.txt_bold {
	font-weight:bolder;
	font-size:103%
}
.txt_small {
  font-size: 85%;
  line-height:160%;
}
.txt_big {
  font-size: 108%;
  line-height:160%;
}

/* 文字色 */

.txt_red {color:#ff3333}
.txt_green {color:#006600}
.txt_blue {color:#043c78}


/* 小見出し */

.subtitle01 {
	color: #006600;
	font-size: 110%;
	font-weight:bolder;
	padding: 15px 0 5px 0
}


/* 強調 */

strong{
font-weight:bolder
}


/* 区切り線 */

.line_dot {
border: 1px dotted #ffa500;
padding: 0px 5px 0px 5px;
margin: 15px 0px 25px 0px
}

/* 枠 */
.box01 {
	border: 1px dotted #006600;
	padding:10px;
	background-color:#FFFFFF;
	width:340px;
}



/* widthの設定 */

.w100 {width:100px}
.w110 {width:110px}
.w120 {width:120px}
.w130 {width:130px}
.w140 {width:140px}
.w150 {width:150px}
.w200 {width:200px}
.w230 {width:230px}
.w250 {width:250px}
.w300 {width:300px}
.w350 {width:350px}
.w400 {width:400px}
.w450 {width:450px}
.w500 {width:500px}


/* marginの設定 */

.m5 {margin:5px}
.m10 {margin:10px}
.m15 {margin:15px}
.m20 {margin:20px}
.m25 {margin:25px}
.m30 {margin:30px}
.m35 {margin:35px}
.m40 {margin:40px}
.m45 {margin:45px}
.m50 {margin:50px}

.mt5 {margin-top:5px}
.mt10 {margin-top:10px}
.mt15 {margin-top:15px}
.mt20 {margin-top:20px}
.mt25 {margin-top:25px}
.mt30 {margin-top:30px}
.mt35 {margin-top:35px}
.mt40 {margin-top:40px}
.mt45 {margin-top:45px}
.mt50 {margin-top:50px}

.mb5 {margin-bottom:5px}
.mb10 {margin-bottom:10px}
.mb15 {margin-bottom:15px}
.mb20 {margin-bottom:20px}
.mb25 {margin-bottom:25px}
.mb30 {margin-bottom:30px}
.mb35 {margin-bottom:35px}
.mb40 {margin-bottom:40px}
.mb45 {margin-bottom:45px}
.mb50 {margin-bottom:50px}

.ml5 {margin-left:5px}
.ml10 {margin-left:10px}
.ml15 {margin-left:15px}
.ml20 {margin-left:20px}
.ml25 {margin-left:25px}
.ml30 {margin-left:30px}
.ml35 {margin-left:35px}
.ml40 {margin-left:40px}
.ml45 {margin-left:45px}
.ml50 {margin-left:50px}

.mr5 {margin-right:5px}
.mr10 {margin-right:10px}
.mr15 {margin-right:15px}
.mr20 {margin-right:20px}
.mr25 {margin-right:25px}
.mr30 {margin-right:30px}
.mr35 {margin-right:35px}
.mr40 {margin-right:40px}
.mr45 {margin-right:45px}
.mr50 {margin-right:50px}
.mr50 {margin-right:50px}


/* paddingの設定 */

.pad5 {padding:5px}
.pad10 {padding:10px}
.pad15 {padding:15px}
.pad20 {padding:20px}
.pad25 {padding:25px}
.pad30 {padding:30px}
.pad35 {padding:35px}
.pad40 {padding:40px}
.pad45 {padding:45px}
.pad50 {padding:50px}

.pt5 {padding-top:5px}
.pt10 {padding-top:10px}
.pt15 {padding-top:15px}
.pt20 {padding-top:20px}
.pt25 {padding-top:25px}
.pt30 {padding-top:30px}
.pt35 {padding-top:35px}
.pt40 {padding-top:40px}
.pt45 {padding-top:45px}
.pt50 {padding-top:50px}

.pb5 {padding-bottom:5px}
.pb10 {padding-bottom:10px}
.pb15 {padding-bottom:15px}
.pb20 {padding-bottom:20px}
.pb25 {padding-bottom:25px}
.pb30 {padding-bottom:30px}
.pb35 {padding-bottom:35px}
.pb40 {padding-bottom:40px}
.pb45 {padding-bottom:45px}
.pb50 {padding-bottom:50px}

.pl5 {padding-left:5px}
.pl10 {padding-left:10px}
.pl15 {padding-left:15px}
.pl20 {padding-left:20px}
.pl25 {padding-left:25px}
.pl30 {padding-left:30px}
.pl35 {padding-left:35px}
.pl40 {padding-left:40px}
.pl45 {padding-left:45px}
.pl50 {padding-left:50px}
.pl150 {padding-left:150px}
.pl170 {padding-left:170px}

.pr5 {padding-right:5px}
.pr10 {padding-right:10px}
.pr15 {padding-right:15px}
.pr20 {padding-right:20px}
.pr25 {padding-right:25px}
.pr30 {padding-right:30px}
.pr35 {padding-right:35px}
.pr40 {padding-right:40px}
.pr45 {padding-right:45px}
.pr50 {padding-right:50px}

.plr15{
	padding: 0 15px 0 15px
}

/* 文字位置 */

.center {text-align:center}
.left {text-align:left}
.right {text-align:right}


/* float */

.fltl {float:left}
.fltr {float:right}