@charset "UTF-8";
/* CSS Document */

body {
	width: 100%;
	height: 100%;
	background-repeat: none;
	margin: 0;
	padding: 0;
	font-size: 14px;
	color: #fff;
	font-family:Helvetica,Arial,Verdana,sans-serif;
	line-height: 1.2em;
	text-justify: distribute-all-lines;
	-webkit-text-size-adjust: 100%;
}

.body_back_main {
	background: #000000;
}

.body_back_ocha {
	background: #081100;
}

.body_back_csm {
	background: #fc6c54;
}

.body_back_spm {
	background: #005a5d;
}

.body_back_spm_img {
	background: #005a5d;
	background-image: url(../supplement/images/spm_background.jpg);
	background-repeat: repeat;
}

.body_back_ocha_img {
	background: #081100;
	background-image: url(../ocha/images/ocha_background.jpg);
	background-repeat: repeat;
}

img {
	border: none;
	vertical-align: top;
}

a {
	color: #fff;
	outline: 0;
	text-decoration:none;
}


/* Text */

h1 {
	font-size: 18px;
	letter-spacing: -0.1em;
}

h2 {
	font-size: 14px;
	letter-spacing: 0;
}

.clear {
	height: 0px;	
	clear: both;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
}
.clearR {
	clear: right;
}

/* Container */

#container {
	width: 1020px;
	height: 100%;
	min-width: 1020px;
	margin: auto;
	position: relative;
	text-align: left;

}

#back_left {
	width: 140px;
	float: left;
}

#back_right {
	width: 140px;
	float: right;
}

#wrapper {
	width: 740px;
	height: 100%;
	padding: 0;
	margin: 0px 0px 0px 140px; 
}

/* Header */

#header {
	width: 740px;
}


/*---------------------------

  Gloval Navi
  
---------------------------*/

#globalNavi {
	position: relative;
	margin: 0px;
	float: left;
	width: 740px;
	height: 50px;	
}

/* Main Gloval Navi */

#main_globalNavi {
	margin: 0px;
	padding: 0px;
	width: 514px;
	overflow: hidden;
}

#main_globalNavi li{
	margin: 0px;
	padding: 0px;
	float: left;
	list-style-type: none;
	text-indent: -9999px;
	text-decoration:none;	
}

#main_globalNavi li a{
	display: block;
	margin: 0px;
	padding: 0px;
	height: 50px;
	background-image: url(../navi/main_navi.jpg);
	background-repeat: no-repeat;
}


#main_navi_gap_left {
	float: left;
}

#main_navi_gap_right {
	float:right;
}

/* Main Navi Off */
.main_navi01 a{ background-position: 0px 0px; width: 171px;}
.main_navi02 a{ background-position: -171px 0px; width: 167px;}
.main_navi03 a{ background-position: -338px 0px; width: 176px;}

.products_navi a{ background-position: 0px -50px; width: 171px;}
.company_navi a{ background-position: -171px -50px; width: 167px;}


/* Main Navi On */
.main_navi01 a:hover{ background-position: 0px -50px;}
.main_navi02 a:hover{ background-position: -171px -50px;}
.main_navi03 a:hover{ background-position: -338px -50px;}


/* Ocha Gloval Navi */

#ocha_globalNavi {
	margin: 0px;
	padding: 0px;
	width: 740px;
	height: 50px;
	overflow: hidden;
}

#ocha_globalNavi li{
	float: left;
	list-style-type: none;
	text-indent: -9999px;
	text-decoration:none;	
}

#ocha_globalNavi li a{
	display: block;
	margin: 0px;
	padding: 0px;
	height: 50px;
	background-image: url(../navi/ocha_navi.jpg);
	background-repeat: no-repeat;
}


/* Ocha Navi Off */
.ocha_navi01 a{ background-position: 0px 0px; width: 88px;}
.ocha_navi02 a{ background-position: -88px -50px; width: 170px;}
.ocha_navi03 a{ background-position: -253px 0px; width: 115px;}
.ocha_navi04 a{ background-position: -373px 0px; width: 95px;}
.ocha_navi05 a{ background-position: -468px 0px; width: 122px;}
.ocha_navi06 a{ background-position: -590px 0px; width: 150px;}

/* Ocha Navi On */
.ocha_navi01 a:hover{ background-position: 0px -50px;}
.ocha_navi02 a:hover{ background-position: -88px -50px;}
.ocha_navi03 a:hover{ background-position: -253px -50px;}
.ocha_navi04 a:hover{ background-position: -373px -50px;}
.ocha_navi05 a:hover{ background-position: -468px -50px;}
.ocha_navi06 a:hover{ background-position: -590px -50px;}


/* Ocha history navi */
.ochahistory_navi02 a{ background-position: -88px 0px; width:170px;}
.ochahistory_navi03 a{ background-position: -253px -50px; width:115px;}
.ochahistory_navi02 a:hover{ background-position: -88px -50px;}

/* Ocha type navi */
.ochatype_navi04 a{ background-position: -373px -50px; width: 95px;}
.ochatype_navi02 a{ background-position: -88px 0px; width:170px;}
.ochatype_navi02 a:hover{ background-position: -88px -50px;}

/* Ocha plantation */

.ochaplantation_navi05 a{ background-position: -468px -50px; width: 122px;}
.ochaplantation_navi02 a{ background-position: -88px 0px; width:170px;}
.ochaplantation_navi02 a:hover{ background-position: -88px -50px;}


/* Ocha property navi */
.ochaproperty_navi06 a{ background-position: -590px -50px; width: 150px;}
.ochaproperty_navi02 a{ background-position: -88px 0px; width:170px;}
.ochaproperty_navi02 a:hover{ background-position: -88px -50px;}


/*---------------------------

  General Gloval Navi
  
---------------------------*/

/* Cosmetic Gloval Navi */

#csm_globalNavi {
	margin: 0px;
	padding: 0px;
	width: 740px;
	height: 50px;
	overflow: hidden;
}

#csm_globalNavi li{
	float: left;
	list-style-type: none;
	text-indent: -9999px;
	text-decoration:none;	
}

#csm_globalNavi li a{
	display: block;
	margin: 0px;
	padding: 0px;
	height: 50px;
	background-image: url(../navi/csm_navi.jpg);
	background-repeat: no-repeat;
}

/* Supplement Gloval Navi */

#spm_globalNavi {
	margin: 0px;
	padding: 0px;
	width: 740px;
	height: 50px;
	overflow: hidden;
}

#spm_globalNavi li{
	float: left;
	list-style-type: none;
	text-indent: -9999px;
	text-decoration:none;	
}

#spm_globalNavi li a{
	display: block;
	margin: 0px;
	padding: 0px;
	height: 50px;
	background-image: url(../navi/spm_navi.jpg);
	background-repeat: no-repeat;
}


/* General Navi Off */
.ge_navi01 a{ background-position: 0px 0px; width: 92px;}
.ge_navi02 a{ background-position: -92px 0px; width: 170px;}
.ge_navi03 a{ background-position: -262px 0px; width: 111px;}
.ge_navi04 a{ background-position: -373px 0px; width: 115px;}
.ge_navi05 a{ background-position: -488px 0px; width: 120px;}
.ge_navi06 a{ background-position: -608px 0px; width: 132px;}

.cosmetic_navi a{ background-position: -262px -50px; width: 111px;}
.supplement_navi a{ background-position: -373px -50px; width: 115px;}

/* General Navi On */
.ge_navi01 a:hover{ background-position: 0px -50px;}
.ge_navi02 a:hover{ background-position: -92px -50px;}
.ge_navi03 a:hover{ background-position: -262px -50px;}
.ge_navi04 a:hover{ background-position: -373px -50px;}
.ge_navi05 a:hover{ background-position: -488px -50px;}
.ge_navi06 a:hover{ background-position: -608px -50px;}

/*---------------------------

  Page
  
---------------------------*/

/* Contents */

#contents_title {
	margin: 0px;
	padding: 0px;
}

#contents {
	margin: 0px;
	padding: 0px;
}

/* Products Page */

#yunako_logo {
	position: absolute;
	width: 371px;
	height: 371px;
	background-image: url(../images/yunako_logo.png);
	background-repeat: no-repeat;
	top: 200px;
	left: 400px;
	z-index: 1;
}

#yunako_logo_ocha {
	position: absolute;
	width: 371px;
	height: 371px;
	background-image: url(../images/yunako_logo_ocha.png);
	background-repeat: no-repeat;
	top: 20px;
	left: 220px;
	z-index: 1;
}

#contents_menu {
	width: 740px;
	height: 227px;
}

#contents_menu ul {
	margin: 0px;
	padding: 0px;
}

#contents_menu li {
	margin: 0px;
	padding: 0px;
	float: left;
	list-style-type: none;
}


/* Sub Page */

#subpage_contents {
	margin: 50px 0px 0px 0px;
	padding: 0px;
	width: 740px;
	height: 700px;
	background-image: url(../sitemap/images/subpage_contents.jpg);
	background-repeat: no-repeat;	
}

#subpage_title {
	padding: 30px 0px 0px 0px;
	font-size: 20px;
	letter-spacing: 0.1em;
	text-align: center;
}

#chosaku {
	text-align: center;
	letter-spacing: 3px;
}

#subpage_text {
	text-align: left;
	padding: 20px 0px 10px 10px;
	width: 500px;
}

#sitemap_title {
	padding: 35px 0px 0px 0px;
	font-size: 18px;
	letter-spacing: 0.1em;
	text-align: center;
}


#sitemap {
	margin: 50px 0 50px 100px;
	width: 540px;
}

#sitemap li {
	margin-top:0.5em;
	margin-bottom:0.5em;
	list-style: none;
}

#sitemap table{
	border: 0;
	width: 100%;
}

#sitemap td{
	 width: 180px;
	 height: 40px;
	 vertical-align: top;
}


/* Company Page */

#company_contents {
	margin: 50px 0px 0px 0px;
	padding: 0px;
	width: 740px;
	height: 400px;
	background-image: url(../company/images/company_contents.jpg);
	background-repeat: no-repeat;	
}

#company_title {
	padding: 35px 0px 0px 0px;
	font-size: 24px;
	letter-spacing: 0.1em;
	text-align: center;
}

#company_text {
	margin: 30px auto;
	padding: 0px;
	width: 580px;
	height: 200px;	
}

#company_address {
	margin: 0px;
	padding: 30px 0px 0px 0px;
	line-height: 1.8em;
	text-align: center;
}

#company_medal_title {
	margin: 0px;
	padding: 0px;
	width: 740px;
	text-align: center;
	font-size: 18px;
	letter-spacing: 0.1em;
}

#company_medal {
	margin: 118px 0px 0px 0px;
	padding: 0px;
	width: 740px;
	height: 450px;
	background-image:url(../company/images/company_medal.jpg);
	background-repeat: no-repeat;
}

#company_article {
	width: 740px;
	height: 500px;
	margin: 0px;
	padding: 0px;
	background-image: url(../company/images/company_article.jpg);
	background-repeat: no-repeat;
}

#company_ceremony {
	margin: 10px 0px 0px 0px;
	padding: 40px 0px 0px 80px;
	width: 240px;
	float: left;
}

#company_article_text {
	font-size:13px;
	line-height: 1.1em;
	margin: 10px 0px 0px 0px;
	padding: 30px 70px 0px 0px;
	width: 330px;
	float: right;
}

/* Ocha Sub Page */

#ochasub_contents_title {
	width: 740px;
	height: 112px;
	margin: 0px

}

	/* History */
	
#ochasub_back {
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 0px;
	width: 740px;
	height: 3000px;
	background-image: url(../ocha/images/ochasub_back.jpg);
	background-repeat: no-repeat;
	text-align: center;
}


	/* Types */


#ochasub2_back {
	margin: 0px;
	padding: 0px;
	width: 740px;
	height: 2692px;
	background-image: url(../ocha/images/ochasub2_back_black.jpg);
	background-repeat: no-repeat;
}


	
	/* Plantation */
	
#plant_intro {
	width: 600px;
	text-align: left;
	line-height: 1.5em;
	font-size: 1.2em;
}

#plant_intro img{
	border: none;
	float: right;
	width: 300px;
	height: 600px;
}	

#ochasub4_back {
	margin: 0px;
	padding: 0px;
	width: 740px;
	height: 1130px;
	background-image: url(../ocha/images/ochasub4_back.jpg);
	background-repeat: no-repeat;
}

.kadomaru img{
	border-radius: 10px;		/* CSS3‘�ˆÄ */
	-webkit-border-radius: 10px;	/* Safari,Google Chrome—p */
	-moz-border-radius: 10px;	/* Firefox—p */
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	border: solid 3px #669966;
}


	/* Property */

#property_intro {
	color: #339933;
	font-size: 2em;
	line-height: 1em;
}

#eisai {
	margin-bottom: 10px;
}

.property {
	width: 255px;
	height: 36px;
	margin: 0 auto; 
	color: #663300;
	font-size: 1.5em;
	text-align: center;
	line-height: 35px;
	background-image: url(../ocha/images/property.png);
	background-repeat: no-repeat;
}

.property2 {
	width: 600px;
	margin: 0 auto;
	text-align: left;
	padding-top: 10px;
	padding-bottom: 30px;
}

.text-green {
	color: #339933;
}

#ochasub3_back {
	margin: 0px;
	padding: 0px;
	width: 740px;
	height: 2472px;
	color: #000000;
	background-image: url(../ocha/images/ochasub3_back_white.jpg);
	background-repeat: no-repeat;
}


#ochasub3_back_top {
	margin: 0px;
	padding: 0px;
	width: 740px;
	height: 1130px;
	background-image: url(../ocha/images/ochasub3_back_top.jpg);
	background-repeat: no-repeat;
}

#ochasub3_back_bottom {
	margin: 0px;
	padding: 0px;
	width: 740px;
	height: 1180px;
	background-image: url(../ocha/images/ochasub3_back_bottom.jpg);
	background-repeat: no-repeat;
}


/* Ocha Page */

#namacha_contents {
	margin: 50px 0px 0px 0px;
	padding: 0px;
}

#ocha_text {
	margin: 30px auto;
	padding: 0px;
	width: 580px;
	
}

#namacha_haiku {
	margin: 0px;
	padding: 0px;
}

#namacha_title {
	margin: 0px;
	padding: 40px 0px 30px 0px;
	color:#ffcc00;
	font-size:18px;	
	text-align: center;
}

#namacha_back_top {
	margin: 0px;
	padding: 0px;
	width: 740px;
	height: 430px;
	background-image: url(../ocha/images/namacha_back_top.jpg);
	background-repeat: no-repeat;
}

#namacha_back_bottom {
	margin: 0px;
	padding: 0px;
	width: 740px;
	height: 480px;
	background-image: url(../ocha/images/namacha_back_bottom.jpg);
	background-repeat: no-repeat;
}

#namacha_pack_title {
	margin: 0px;
	padding: 40px 0px 0px 0px;
	color:#ffcc00;
	font-size:18px;	
	text-align: center;
}

#namacha_pack {
	margin: 15px 0px 0px 70px;
	padding: 0px;
	width: 512px;
}

#namacha_pack a {
	outline: 0;
	text-decoration:none;
}

a.ocha
   {text-decoration:none;}        /* リンク部�E�E下線を消� */

a.ocha:link
   {color:#0000ff;}               /* ã�¾ã� è¦‹ã�¦ã��E�ªã��Eƒªãƒ³ã‚¯è‰² */

a.ocha:visited
   {color:#0000ff;}               /* 既�見�リンク色 */

a.ocha:hover
   {
    color:#ff0000;               /* マウスã�Œä¸Šã�«æ�¥ã�Ÿæ™‚ã�®æ–�E­—色設å®�E*/
    text-decoration:underline;   /* マウス�上���時�下線を���E*/
   }

#ocha_products_img {
	position: absolute;
	top: 0px;
	z-index: 2;
}

.ocha_pop_text_box {
	position: absolute;
	margin: 0px;
	padding: 0px;
	width: 190px;
	line-height: 1.2em;
	letter-spacing: 0em;
	top: 20px;
	left: 400px;
	z-index: 3
}

.ocha_pop_text_box2 {
	position: absolute;
	margin: 0px;
	padding: 0px;
	width: 260px;
	line-height: 1.2em;
	letter-spacing: 0em;
	top: 20px;
	left: 310px;
	z-index: 3
}

.ocha_pop_text_box h1 {
	color:#ffcc00;
	letter-spacing: 0.1em;
}

.ocha_pop_text_box2 h1 {
	color:#ffcc00;
	letter-spacing: 0.1em;
}

.ocha_pop_text_box strong {
	font-size: 14px;
	color:#fff;
	letter-spacing: 0.1em;
}

#make_ocha {
	padding: 0px;
}
   
/* Cosmetic Page */

#csm_title {
	margin: 50px 0px 0px 0px;
	padding: 0px;
	width: 740px;
	height: 263px;
	background-image: url(../cosmetic/images/contents_title.jpg);
	background-repeat: no-repeat;	
}

.csm_text_box {
	padding: 10px 20px 10px 20px;
	width: 700px;
}

#nano_products2 {
	margin: 0px;
	padding: 0px;
	width: 740px;
	height: 640px;
	background-image: url(../cosmetic/images/nano_products2.jpg);
	background-repeat: no-repeat;
}

#nano_text1 {
	margin: 0px auto;
	padding: 0px;
	width: 600px;
}

#nano_text2 {
	float: right;
	margin: 0px;
	padding: 20px 30px 0px 0px;
	width: 330px;
}

#nano_text2A {
	float: right;
	margin: 290px 0px 0px 0px;
	padding: 0px;
	width: 330px;
}

#nfII {
	margin: 0px;
	padding: 0px;
	width: 740px;
	height: 386px;
	background-image: url(../cosmetic/images/nfII_products.jpg);
	background-repeat: no-repeat;
}

#nfII_text {
	margin: 0px;
	padding: 330px 0px 0px 0px;
	width: 740px;
	height:20px;
	text-align: center;
}

#megumi_products {
	margin: 0px;
	padding: 0px;
	width: 740px;
	height: 334px;
	background-image: url(../cosmetic/images/megumi_products.jpg);
	background-repeat: no-repeat;
}

#megumi_products_right {
	margin: 0px 0px 0px 250px;
	padding: 0px;
	width: 460px;
}

#megumi_products_title {
	margin: 0px;
	padding: 20px 0px 0px 0px;
	text-align: center;
}

#megumi_products_text {
	margin: 0px;
	padding: 20px 0px 0px 0px;
}


/* Supplement Page */

#spm_contents {
	margin: 0px 0px 0px 0px;
	padding: 0px;
	width: 740px;
	color: #fff;
}

#minamoto {
	margin: 0px;
	width: 740px;
	height: 429px;
}

#minamoto_text {
	margin: -100px auto 0px;
	padding: 0px;
	width: 640px;
}


#kinko {
	margin: 0px;
	width: 740px;
	height: 593px;
}

#kinko_text {
	margin: -100px auto 0px;
	padding: 0px;
	width: 640px;
}

#kinkomax {
	margin: 0px;
	width: 740px;
	height: 434px;
}

#kinkomax_text {
	margin: -100px auto 0px;
	padding: 0px;
	width: 640px;
}

.spm_text_box {
	padding: 10px 35px 10px 35px;
		list-style-type: square;
}

#spm_products_img {
	position: absolute;
	top: 0px;
	z-index: 3;
}

.spm_pop_text_box {
	position: absolute;
	margin: 0px;
	padding: 0px 50px 10px 50px;
	width: 700px;
	line-height: 1.1em;
	letter-spacing: 0em;
	top: 400px;
	z-index: 2;
}

.spm_pop_text_box h1 {
	color:#ffcc00;
	letter-spacing: 0.1em;
}

.spm_pop_text_box strong {
	font-size: 14px;
	color:#fff;
	letter-spacing: 0.1em;
}


/*---------------------------

  Footer
  
---------------------------*/

#footer {
	margin: 0px;
	padding: 0px;
	width: 740px;
	text-align: center;
	text-decoration: none;
}

.white a:link {
	font-size:14px;
	color:#fff;
	text-decoration: none;
}

.white a:visited {
	color:#fff;
	text-decoration: none;
}

.white-top {
	margin: 0px;
	padding-top: 40px;
}

.white-top a:link {
	font-size:14px;
	color:#fff;
	text-decoration: none;
}

.white-top a:visited {
	color:#fff;
	text-decoration: none;
}

.grayishgreen a:link {
	font-size:14px;
	color:#669966;
	text-decoration: none;
}

.grayishgreen a:visited {
	color:#669966;
	text-decoration: none;
}

.salmonpink a:link {
	font-size:14px;
	color:#ffddbb;
	text-decoration: none;
}

.salmonpink a:visited {
	color:#ffddbb;
	text-decoration: none;
}

.skyblue a:link {
	font-size:14px;
	color:#ccffff;
	text-decoration: none;
}

.skyblue a:visited {
	color:#ccffff;
	text-decoration: none;
}

#ad_logo {
	margin: 10px 20px 0px -120px;
	float: right;
	width: 181px;
	height: 60px;
	outline: none;
}