@charset "Shift_JIS";


/*--------------------  jpherb.css; --------------------------------*/


/*-------------------- margin reset --------------------*/

*{
        margin:0;
        padding:0;
}

/*-------------------- element type --------------------*/

body {  
        margin: 0;
        padding: 0;

        color: #3A8374;
        font-family : "‚l‚r ‚oƒSƒVƒbƒN","HGŠÛºÞ¼¯¸M-PRO";
        text-align:center;
        height:auto;
}

#wrapper { 
        width: 800px;
        color: #333333;
        background:#FFFFFF;
        margin-top:10px;
        margin-bottom:10px;
        text-align:center;
}

/*-------------------- head --------------------*/

div.header-img{
        text-align:left;
}

/*-------------------- top menu--------------------*/

div#top-menu{
        width:780px;
        text-align:left;
        margin-top:-20px;
}

#top-menu ul,#top-menu li{
        list-style-type: none;
        margin-bottom:0px;
}

#top-menu li{
        float:right;
        border-top:1px solid #333333;
        border-right:1px solid #333333;
        border-bottom:1px solid #333333;
        font-size: 90%;

} 

#top-menu a,#top-menu a:link,#top-menu a:visited{
        text-decoration:none;
        color:#333333;
        background-color:transparent;
        width:100px;
        height:20px;
        text-align:center;
        padding:2px 0;
        display:block;
}

#top-menu a:hover{
        color:#FFFFFF;
        background-color:#006699;
}

#top-menu li.home1{
        border-left:1px solid #333333;
}

#top-menu li.home2{
        border-left:1px solid #333333;
        font-family : Arial,Vdrdana;

}

/*-------------------- side menu--------------------*/

#side-menu {
        width:120px;
        height:auto;
        float:left;
}

#side-menu ul{
        list-style:none;
        margin-top:10px;
}

#side-menu li{
        list-style:none;
        list-style-position:outside;
        margin-bottom:5px;
        font-size: 84%;
}

#side-menu li a{
        display:block;
        width:120px;
        height:20px;
        padding:3px 10px;
        border-width:1px;
        border-style:solid;
}

#side-menu li a:link,#side-menu li a:visited{
        color:#000000;
        text-decoration:none;
        background-color:#EEEEEE;
        border-color:#CCCCCC;
}

#side-menu li a:hover,#side-menu li a:active{
        color:#000000;
        text-decoration:none;
        background-color:#336633;
        border-color:#99CC66;
}   


/*-------------------- herb-top-header No1--------------------*/

div#herb-top-head1{
        width:780px;
        margin-top:0px;
        margin-bottom:0px;
}

#herb-top-head1 h1 {
        color: #FFFFFF;
        font-size: 110%;
        line-height: 24px;
        font-weight: bold;
        background: #336633;
        text-align : center;
        width:780px;	
}

#herb-top-head1 p {
        color: #336633;
        margin-left:150px;
        margin-right:10px;
        margin-top:20px;
        padding:20px;
        text-align:left;
        font-size: 90%;
        line-height:150%;
        font-weight: bold;
}

#herb-top-head1 img.right-photo{
        float:right;
        margin-top:30px;
}


#herb-top-head1 img.left-photo{
        float:left;
        margin-top:10px;
        margin-left:10px;
}


/*-------------------- herb-top-contents --------------------*/

div#herb-top-contents{
        width:780px;
        border-top: 1px solid #a6a6a6;
        background:url(../image/jpherb_g03.png);
        background-repeat:no-repeat;
        background-position:right bottom;
        margin-top:10px;
}

/*-------------------- herb-top-main--------------------*/

div#herb-top-main{
        width:640px;
        float:right;
}        

#herb-top-main a:link,#herb-top-main a:visited{
        color:#3A8374;
        text-decoration:none;
        border-color:#FFFFFF;
}

#herb-top-main a:hover,#herb-top-main a:active{
        color:#FFFFFF;
        text-decoration:none;
        background-color:#3A8374;
        border-color:#99CC66;
}   

#herb-top-main p {
        margin-top: 5px;
        margin-bottom:10px;
        color: #336633;
        font-size:90%;
        line-height:150%;
        font-weight: normal;
        text-align:justify;
        padding-left:14px;
        padding-right:14px;
}

#herb-top-main h3 {	
        color:#F79833;
        border-left:5px solid #3A8374;
        border-right:5px solid #3A8374;
        border-top:1px solid #3A8374;
        border-bottom:1px solid #3A8374;
        padding:5px 0 5px 5px;
        font-size: 104%;
        line-height:120%;
        font-weight: bold;
        text-align : center;
        margin-top:10px;
}


#herb-top-main h4{	
        color:#F79833;
        border-left:5px solid #A3EFA5;
        border-right:5px solid #A3EFA5;
        border-top:1px solid #A3EFA5;
        border-bottom:1px solid #A3EFA5;
        padding:5px 0 5px 5px;
        font-size: 104%;
        line-height:120%;
        font-weight: bold;
        text-align : center;
        margin-top:10px;
}

#herb-top-main p.att {
       margin-top: 5px;
       margin-bottom:10px;
       color: #3A8374;
       font-size:80%;
       line-height:150%;
       font-weight: normal;
       text-align:justify;
}


/*-------------------- footer --------------------*/

div#herb-top-footer{
        margin-top:10px;
        margin-bottom:10px;
        clear:both;
        width:780px;
        color: #FFF;
        font-style: italic;
        line-height: 6px;
        padding: 8px;
        background: #336633;
        height:8px;	
        font-family : Arial,Vdrdana;
        text-align:right;
        font-size: 80%;
}


/*-------------------- herb details --------------------*/

/*-------------------- detail header No2--------------------*/

div#herb-detail-head2{
        width:780px;
        margin-bottom:0px;

}

#herb-detail-head2 img.right-photo{
        float:right;
        margin-top:10px;
        margin-left:10px;
}


#herb-detail-head2 h1{
        color: #FFFFFF;
        font-size: 100%;
        line-height: 24px;
        font-weight: bold;
        background: #336633;
        text-align : center;
        width:780px;	
}

#herb-detail-head2 h2{
        color: #3A8374;
        margin:20px 20px 20px 20px;
        text-align:left;
        line-height:130%;
        font-size: 120%;
        font-weight: bold;
}


#herb-detail-head2 p {
        color: #3A8374;
        margin:20px 20px 20px 20px;
        text-align:left;
        line-height:130%;
        font-size: 90%;
        font-weight: bold;
}


/*-------------------- detail contents --------------------*/

div#herb-detail-contents{
        width:780px;
        border-top: 1px solid #a6a6a6;

}

/*-------------------- detail main--------------------*/

div#herb-detail-main{
        width:740px;
        color:#3A8374;
}        


#herb-detail-main h3 {
        color: #3A8374;
        background-color:#f3f3f3;
        border-left:15px solid #3A8374;
        padding:5px 0 5px 10px;
        font-size: 100%;
        font-weight: bold;
        text-align : left;
}

#herb-detail-main h4 {
        color: #3A8374;
        background-color:#f3f3f3;
        border:1px solid #3A8374;
        margin-top:10px;
        padding:5px 0 5px 10px;
        font-size: 80%;
        font-weight: bold;
        text-align : left;
}

#herb-detail-main h5 {
        color: #3A8374;
        background-color:#f3f3f3;
        border:1px solid #3A8374;
        margin-top:10px;
        padding:5px 0 5px 10px;
        font-size: 90%;
        font-weight: bold;
        text-align : left;
        width:240px;
}
#herb-detail-main p {
        margin-top: 5px;
        color: #3A8374;
        font-size:84%;
        line-height:150%;
        font-weight: normal;
        text-align:justify;
}


#footer {
	clear: both;
	width: 100%;
	font-family: "Arial", Courier, monospace;
	font-size: 12px;
	color: #FFFFFF;
	text-align: center;
	height: 20px;
	background-color: #000099;
	padding-top: 3px;
}

div#back{
        float:left;	
        font-size: 90%;
        color: #FFF;
        font-style: italic;
        vertical-align:middle;
        padding-left:5px;
}

	
#back a,#back a:link,#back a:visited{
        text-decoration:none;
        color:#FFF;
        background-color:transparent;
}

#back a:hover{
        color:#FFF;
}


/*-------------------- detail footer --------------------*/

div#herb-detail-footer{
	clear: both;
	width: 100%;
	font-family: "Arial", Courier, monospace;
	font-size: 12px;
	color: #FFFFFF;
	text-align: center;
	height: 20px;
	background-color: #336633;
	padding-top: 3px;
}


#herb-detail-footer p{
        margin: 0px;
        color: #FFF;
        text-align:right;
        font-weight: normal;
}

/*-------------------- detail back icon--------------------*/

div#herb-detail-back-icon{
        float:left;	
        font-size: 100%;
        color: #FFF;
        font-family: "Century";        
        padding-left:3px;
        font-weight: bold;
}

	
#herb-detail-back-icon a,#herb-detail-back-icon a:link,#herb-detail-back-icon a:visited{
        text-decoration:none;
        background-color:transparent;
        color: #FFF;

}

#herb-detail-back-icon a:hover{
        color: #FFF;
}
