﻿@charset "UTF-8";

/* ========BASIC======== */
* {
   font-family:"Hiragino Kaku Gothic Pro",HiraKakuPro-W3,"ヒラギノ角ゴ Pro W3","メイリオ", Meiryo,"MS P ゴシック",verdana,sans-serif;
   color:#333;
}

body {
   margin:0;
   padding:0;
   letter-spacing:1px;text-align:center;
   /*background:#EFE8D7;*/
}

br {
   letter-spacing:normal;
}

a {
   color:#333;
   text-decoration:none;
}

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

img {
   border:0;
   vertical-align:bottom;
}

h1,h2,h3,h4,h5,h6 {
   margin:0;
}

/* ========TEMPLATE LAYOUT======== */
div#top {
   width:800px;text-align:left;
   margin:0 auto;
   padding:0px;
   background:#fff;
   /*background:url(images/bg_contents_left.gif) 0 0 repeat-y;*/
   border-left: 20px solid #fff;
   border-right: 20px solid #fff;
}

div#wrapper {
   width:800px;
   /*background:url(images/bg_contents_right.gif) 100% 0 repeat-y;*/
border-top: 3px solid #7b639c;
}

div#header { /* ヘッダー */
   position:relative;
   padding:0 5px;
   height:80px;
		   border: 1px solid #fff;
}

div#pr {
   position:absolute;
   width:320px;
   margin-left:470px;
   top:30px;
		   border: 1px solid #fff;
}

div#menu {
   float:left;
   padding:0px;
}

div#contents {
   clear:both;
   margin:0px;
   padding:3px 0px 0px 0px;
}

div#main {
   float:right;
   width:100%;
   line-height:1.3em;
}

div#sub { /* 左バー */
   float:left;
   width:195px;
   margin:0px 0px 0px 0px;
   /*border:1px solid #ccc;*/
}

div#totop {
   clear:both;
}

div#footer {
   clear:both;
   background:#fff;
   margin:0px;
   border-top:1px solid #7b639c;
}

.imglink {
   margin:0px 3px 6px 0px;
}


/* ========HEADER CUSTOMIZE======== */
div#header h1 {
   margin:10px 0px 0px 0px;
   padding:10px 10px 10px 5px;
   font-size:2em;
   color:#999;
}

div#header h1 a {
   color:#333;
}
#main h2 p {
}


div#header h1 a:hover {
   color:#666;
}

div#header #pr p {
   margin:0;
   padding:0px;
   font-size:0.7em;
   color:#666;
}

/* ========MENU CUSTOMIZE======== */
div#menu ul {
   margin:0;
   padding:0;
}

div#menu li {
   float:left;
   font-size:0.75em;
   color:#333;
   text-align:center;
   list-style-type:none;
}

div#menu li a{
   display:block;
   width:159px;
   color:#fff;
   line-height:35px;
   border-left:1px solid #fff;
   background:url(http://joca.jp/images/bg_menu.gif) 0 0 repeat-x;
}

div#menu li.home a{
   border:none;
}

div#menu li a.active{
   color:#333;
}

div#menu li a:hover{
   color:#333;
   background:url(http://joca.jp/images/bg_menu_on.gif) 0 0 repeat-x;
}


/* ========MAIN CONTENTS CUSTOMIZE======== */
div#main a {
   color:#51A39C;
   text-decoration:underline;
}

div#main a:hover {
   color:#006666;
}

div#main h2 { /*タイトル*/
   margin:5px 0px 0px 0px;
   width:580px;
   color:#ffffff;
   line-height:38px;
   background:url(http://joca.jp/images/bn_bar.gif) 0 0 repeat-x;
   font-size:0.9em;
   text-indent:1.6em;
}

div#main h3 { /*大見出し*/
   margin:4px 5px 15px 0px;
   font-size:0.97em;
   color:#7b639c;
   line-height:35px;
   border-bottom:1px dotted #7b639c;
   text-indent:0em;
   padding:15px 0px;
   letter-spacing:1.7px;
}

div#main h4 { /*小見出し*/
   margin:25px 0px 10px 2px;
   font-size:0.88em;
   color:#CC6666;
   /*border-bottom:1px solid #51A39C;*/
}

div#main h5 { /*用途別一覧*/
   margin:0px 0px 0px 0px;
   padding:0px 0px 0px 0px;
   font-size:20px;
   font-weight:bold;
}

div#main h6 {
   margin:10px 5px 0px 0px;
   font-size:0.9em;
   color:#7b639c;
   line-height:20px;
   border-bottom:1px dotted #7b639c;
}

div#main p{
   margin:0px 2px 20px 2px;
   padding:0px 0px 0px 0px;
   font-size:0.75em;
   line-height: 180%;
}

div#main p.top{ /*topの説明テキスト*/
   margin:5px 0px 30px 0px;
   padding:0px 5px 0px 5px;
   font-size:0.8em;
   line-height:20px;
   color:#5d4675;
}

div#main p.about{ /*aboutの上空間*/
   margin:20px 0px 30px 0px;
}

div#main p.list{ /*一覧表の頭文字*/
   margin:0px 0px 0px 0px;
   padding:0px 0px 0px 0px;
   font-size:20px;
   font-weight:bold;
}

div#main p.betumei{ /*()内は別名*/
   margin:0px 0px 0px 0px;
   padding:0px 0px 0px 0px;
   font-size:0.75em;
}

p.example2 { 
   color: #666666;
}

.strong { 
   font-weight: bold;
   font-size:1.3em;
   line-height:25px;
}
.ex { 
   color: #9986B2;
}


div#main ul,ol,dl{
   font-size:0.75em;
   color: #666666;
}

div#main ul {
   font-size:0.75em;
   color: #666666;
}
div#main li { 
   font-size:1em;
   color: #666666;
}
div#main dl { 
   font-size:1em;
   color: #666666;
}

div#main dt{
   margin-bottom:3px;
}

div#main dd{
   padding:0;
   margin:0 0 0.5em 1em;
   padding:3px;
   background:#f1f1f1;
}

/* 一覧表 */
div#main table	{
	border-collapse: collapse; border-spacing: 0;
	border: 1px solid #cccccc;
	width: 580px;
	color: #000;
	vertical-align : top;
}
div#main table th {
        padding: 5px;
        border:1px solid #ccc;
        font-size:12px;
        background:#666;
        color:#fff;
}
div#main table td {
        padding: 10px;
        border:1px solid #ccc;
        font-size:10px;
        line-height: 130%;
}


/* 日常使っている化粧品の成分をチェックしましょう！ */

div#main table .102list tr .gousei{
	font-size:12px;
	}


/* 活動実績の年表 */
div#main table.activ {
   width: 100%;
   border-collapse: collapse;
   margin:5px 0px 20px 0px;
}
div#main table.activ th{
   width: 30%;
   color:#333333;
   background: #E5F2F8;
   text-align: left;
   padding:10px;
}
div#main table.activ td{
   font-size: 13px;
   padding:10px;
}

/* ニュース */
.news_title { /*見出し*/
   margin:15px 5px 15px 0px;
   font-size:1.0em;
   color:#7b639c;
   border-bottom:1px dotted #7b639c;
   font-weight:bold;
   line-height: 180%;
}
.news_midashi { /*小見出し*/
	font-weight: bold;
	font-size:0.95em;
	line-height:40px;
	margin:100px 0px 15px 0px;
	color: #7b639c;
}
img.news { /*ニュース画像*/
   margin:0px 10px 0px 0px;
   float: left;
}
.news_imgtext { /*画像のテキスト*/
   font-size:0.7em;
   color:#999999;
}
.clearLeft {
   clear: left;
}


/* INFOMATION CUSTOMIZE */
* html body div#main dl.infomation dd div{
   display:inline-block;
}

div#main dl.infomation dt {
   float:left;
   width:170px;
   margin:0px 0px 0px 8px;
   padding:0;
   font-size:0.75em;
}

div#main dl.infomation dd {
   margin:0px 0px 5px 110px;
   padding:0px;
   background:transparent;
   font-size:0.75em;
}

/* クレイの例 */
* html body div#main dl.cray dd div{
   display:inline-block;
}

div#main dl.cray dt {
   float:left;
   width:6em;
   margin:0px 0px 0px 8px;
   padding:0;
   font-size:0.75em;
}

div#main dl.cray dd {
   margin:0px 0px 10px 90px;
   padding:0px;
   background:transparent;
   font-size:0.75em;
}

/* ========SUBCONTENTS CUSTOMIZE======== */
div#sub .section {
   margin:0px 0px 10px 0px;
   /*border:1px solid #ccc;*/
}

div#sub h2 {
   margin:0px;
   padding:8px 0px 8px 14px;
   font-size:0.82em;
   font-weight:bold;
   color:#5d4675;
   background:url(http://joca.jp/images/bg_list.gif) 0 11px no-repeat;
   border-bottom:1px dotted #666;
   /*background-color:#E5E0EB;*/
}

div#sub h2 a {
   color:#5d4675;
}

div#sub h2 a:hover {
   text-decoration: underline;
   color:#ccaacc;
}

div#sub ul {
   margin:2px 0px 15px 0px;
   padding:0;
}

div#sub li { /* 小カテゴリ中 */
   padding:5px 0px 5px 5px;
   font-size:0.75em;
   line-height:1.4;
   list-style:none;
   border-bottom: 1px dotted #666;
}

div#sub li a { /* テリテキスト */
   display:block;
   padding-left:10px;
   background:url(http://joca.jp/images/bg_list2.gif) 0 6px no-repeat;
   color:#333;
}

div#sub li a:hover {
   text-decoration: underline;
   color:#ff3366;
}

.img_link{ /*リンクバナーの設定*/
 margin:0px 0px 3px;
}

/* ========TOTOP CUSTOMIZE======== */
div#totop{
   position:relative;
   height:2em;
}

div#totop p{
   position:absolute;
   top:10px;
   right:7px;
   margin:0;
   font-size:0.63em;
}

div#totop p a {
   padding-left:8px;
   background: url(http://joca.jp/images/bg_totop.gif) 0 50% no-repeat;
}


/* ========FOOTMENU CUSTOMIZE======== */
div#footMenu {
   margin:0 0 10px 0;
   padding:1px 0 0 0;
   text-align:right;
   background:url(http://joca.jp/images/bg_dotline.gif) 0 0 repeat-x;
}
.address { 
   font-size:0.75em;
}


/* ========FOOTER CUSTOMIZE======== */
address{
   padding:10px 0;
   font-size:0.63em;
   color:#7b639c;
   text-align:center;
font-style: normal;
}





/* コスメ講座募集要項の時の、スケジュール表 */
#yousei h2 {
}
#gousei table tr th {
}
#gousei #a .list {
}

.102list tr td {
}
#sub .side_menu dt h2 {
}
#genjyou {
	float: right;
	height: 1800px;
	width: 200px;
	margin-top: 10px;
	margin-bottom: 40px;
	margin-left: 10px;
}
#genjyou .genjyou {
	font-size: 10px;
	line-height: 1.5em;
	margin-bottom: 30px;
	padding-top: 10px;
	padding-bottom: 15px;
}
.koinstqa dl dt {
}

/*コスメ講座*/

/*コスメ講座ボタン*/
.kzbtn{
	margin: 30px auto 40px;
	text-align:center;
}
/*コスメ講座ボタン*/

/*コスメ講座見出し*/
div#main .kzmskm h2 { /*タイトル*/
   margin:40px 0 30px 0;
   width:auto;
   color:inherit;
   line-height:inherit;
   background:inherit;
   font-size: inherit;
   text-indent:inherit;
}

div#main .kzmskm h3 { /*大見出し*/
   margin:30px 0 0 0;
   font-size:inherit;
   color:inherit;
   line-height:inherit;
   border-bottom:inherit;
   text-indent:inherit;
   padding:inherit;
   letter-spacing:inherit;
}
/*コスメ講座見出し*/

/*コスメ講座マージン*/
div#main .kzmskm div{
	margin: 0 50px;
}
/*コスメ講座マージン*/

/*コスメ講座質問*/
div#main div.koinstqa dt{
color: #CC6666;
font-weight: bold;
font-size: 14px;
padding: 0;
margin: 30px 0 14px 0;
}

div#main div.koinstqa dt span{
color: #CC6666;
font-weight: bold;
font-size: 1.2em;
display: block;
}

div#main div.koinstqa dd{
color: #5d4675;
font-weight: bold;
background-color: #fff;
font-size: 12px;
border: 1px solid #BDBDBD;
padding-right: 5px;
padding-left: 5px;
}
div#main div.koinstqa dd span{
color: #5d4675;
font-weight: bold;
font-size: 1.5em;
display: block;
}

div#main div.koinstqa dl{
margin-bottom: 80px;
margin-top: 60px;
}
/*コスメ講座質問*/

/*コスメ講座トップへ戻る*/
div#main .kzmskm .kztotop{
   position:relative;
   height:2em;
}

div#main .kzmskm .kztotop p{
   position:absolute;
   top:10px;
   right:7px;
   margin:0;
   font-size:0.63em;
}

div#main .kzmskm .kztotop a {
   padding-left:8px;
   background: url(http://joca.jp/images/bg_totop.gif) 0 50% no-repeat;
}

div#main .kzmskm div.kztext{
	margin:40px 0 0 0;
	float: left;
	width: 494px;
}
div#main .kzmskm div.kzimg{
	margin:40px 0 0 0;
	float: left;
	width: 306px;
}

div#main .kzmskm div.kztext ul{
	margin-left: 100px;
}
div#main .kzmskm div.kzth ul{
	padding:0;
		list-style-position:inside;

}
div#main .kzmskm div.kzth li{
	padding:0;
	width: 620px;
	margin: 0 40px;
}
div#main .kzmskm div.kzth img{
	float:right;
}
div#main .kzmskm h4{
	clear:both;

}
div#main .kzmskm h4 img{
	margin-top: 60px;
}
/*コスメ講座トップへ戻る*/