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

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

.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;
}

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

p {
	color:#FFFFFF;
}

/* Text */

h1 {
	font-size: 22px;
	line-height: normal;
}

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

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


/* Container */

#container {
	width: 1020px;
	height: auto;
	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: auto;
	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;}


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

  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: auto;
}

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

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

/* Company Page */

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

#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 Page */

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

#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_top table tr td.ocha_txt {
	padding-bottom: 15px;
}

#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;}        /* リンク部分の下線を消す */

a.ocha:link
   {color:#0000ff;}               /* まだ見ていないリンク色 */

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

a.ocha:hover
   {
    color:#ff0000;               /* マウスが上に来た時の文字色設定 */
    text-decoration:underline;   /* マウスが上に来た時に下線をだす。 */
   }

#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;
}

.contents_menu:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
.contents_menu { display: inline-block; }
/* start commented backslash hack \*/
* html .contents_menu { height: 1%; }
.contents_menu { display: block; }