@charset "UTF-8";
/*
Theme Name: hair coeur
Theme URI: http://www.coeur-coeur.jp/
Description: hair coeur Theme for WordPress
Author: hair coeur
*/

/*
[Structure]
body
|
|--#wrapper
|    |
|    |-- #header
|    |    |
|    |    |-- #logo
|    |    |
|    |    |-- #address
|
|-- #wrapperContent
|    |
|    |--#content
|    |    |
|    |    |-- #main
|    |    |
|    |    |-- #sidebar
|    |    |    |
|    |    |    | -- # mainNavi
|
|-- #wrapperFooter
|    |
|    |--#footer
|    |
|    | -- #footerlogo
*/

/* element style
---------------------------------------------------- */
* {
    padding: 0;
    margin: 0;
}
body {
    color: #333333;
    background:  url(./images/com/back.jpg) repeat-x;
    font-size: 62.5%; // 10px;
    font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
    text-align: center; /* for IE6 */ 
}
img {
    vertical-align: bottom;
    border: none;
}
a {
    color: #666666;
    /*color: #C24870;*/
}
a img {
    border: none;
}
em {
    font-style: normal;
    font-weight: bold;
}
strong {
    font-style: normal;
    font-weight: bold;
}

/* header
---------------------------------------------------- */
div#wrapperHeader {
    width: 820px;
    height: 125px;
    margin:  auto;
    background:  url(./images/com/wrapperback1.gif) repeat-y;
    text-align: left;
}
div#header {
    width: 800px;
    height: 125px;
    margin: 0 auto;
    padding: 0;
    border-width: 1px 1px 0 1px;
    border-style: solid;
    border-color: #990000;
    font-size: 1.3em;
}
#header div#summuryBar {
    width: 800px;
    height: 15px;
    color: #FFFFFF; 
    background: #990000; 
    text-align: right;
}
#header div#logo {
    float: left;
    width: 220px;
    height: 110px;
    margin: 0;
    padding: 0;
}
#header #logo h1 {
    width: 220px;
    height: 110px;
    margin: 0;
    padding: 0;
}
#header div#logoArea {
    width: 800px;
}
#header #logoArea  p {
    margin: 0;
    padding: 0;
}
#header div#addressArea {
    float: right;
    width: 580px;
    height: 110px;
}
#header #addressArea p.addressImgContainer
{
    width: 580px;
    margin: 0;
    padding: 0;
}
#header #addressArea p {
    padding: 38px 15px 0 0;
    color:  #666666;
    test-size: 1em;
    text-align: right;
    line-height: 1.3em;
}

/* content
---------------------------------------------------- */
div#wrapperContent { 
    width: 820px;
    height: auto;
    margin: 0 auto;
    background:  url(./images/com/wrapperback1.gif) repeat-y;
    text-align: left;
}
div#content {
    width: 800px;
    height: auto;
    margin: 0 auto;
    border-width: 0px 1px 0 1px;
    border-style: solid;
    border-color: #990000;
    background: #FFFFFF;
    font-size: 1.3em;
    line-height: 1.5em;
    text-align: left;
}
/* ----- main ----- */
#content div#main {
    float: right;
    width: 650px;
}
#content #main h2 {
    margin: 20px;
}
#content #main h3 {
    font-size: 1.15em;
    margin: 20px;
}
#content #main h4 {
    margin: 12px 20px 5px;
    color: #CB6B8B;
    font-size: 1em;
}
#content #main p {
    margin: 15px 25px 15px 20px;
}
#content #main ul {
  
}
#content #main ul li {
}
#content #main ol {
}
#content #main dl {
}
#content #main table {
    width: 600px;
    margin: 15px 0 15px 20px;
    border-collapse: collapse;
}
#content #main th {
    padding: 2px 5px;
    border: 1px solid #EEE2D5;
    color: #666666;
    text-align: left;
    background: #F9F5F0;
    font-weight: normal;
}
#content #main td {
    padding: 2px 5px;
    border: 1px solid #EEE2D5;
}
/* フォーム関連  */
#content #main form {
    margin: 20px 25px 20px 0;
}
#content 3main form p {
    margin: 25px 0 0 20px;
}
#content #main form dl {
    margin: 0;
}
#content #main form dt {
    margin: 0 0 5px;
    padding: 1px 5px;
    background: #EFEFEF;
}
#content #main form dd {
    margin: 0 0 20px;
    padding: 3px 5px;
}
/* ----- sidebar ----- */
#content div#sidebar {
    float: left;
    width: 150px;
}
/* main Nagigation  */
#content #sidebar div#mainNavi {
    clear: both;
    width: 88px;
    height: auto;
     margin: 20px 0 0 20px;
}
#content #sidebar ul#mainNavi  {
    width: 88px;
    height: auto;
    margin: 0;
    padding: 0;
    text-align: center;
}
#content #sidebar #mainNavi li {
    width: 88px;
    height: 39px;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
}
#content #sidebar #mainNavi li a{
    display: block;
    width: 88px;
    height: 39px;
    margin: 0;
    padding: 0;
    text-indent: -9999px;
}
#content #sidebar #mainNavi li#naviNews {
    background: url("./images/com/navi_sub/news_sub.gif") no-repeat;
}
#content #sidebar #mainNavi li#naviShop {
    background: url("./images/com/navi_sub/shop_sub.gif") no-repeat;
}
#content #sidebar #mainNavi li#naviMenu {
    background: url("./images/com/navi_sub/menu_sub.gif") no-repeat;
}
#content #sidebar #mainNavi li#naviStaff {
    background: url("./images/com/navi_sub/staff_sub.gif") no-repeat;
}
#content #sidebar #mainNavi li#naviBlog {
    background: url("./images/com/navi_sub/blog_sub.gif") no-repeat;
}
#content #sidebar #mainNavi li#naviBbs {
    background: url("./images/com/navi_sub/bbs_sub.gif") no-repeat;
}
#content #sidebar #mainNavi li#naviFaq {
    background: url("./images/com/navi_sub/faq_sub.gif") no-repeat;
}
#content #sidebar #mainNavi li#naviHome {
    background: url("./images/com/navi_sub/home_sub.gif") no-repeat;
}
#content #sidebar #mainNavi li#naviRecruit {
    background: url("./images/com/navi_sub/recruit_sub.gif") no-repeat;
}
#content #sidebar #mainNavi li#naviPrivacy{
    background: url("./images/com/navi_sub/privacy_sub.gif") no-repeat;
}
#content #sidebar #mainNavi li#naviContact {
    background: url("./images/com/navi_sub/contact_sub.gif") no-repeat;
}
#content #sidebar #mainNavi li:hover {
    background-position: -88px 0 !important;
    text-decoration: none;
}







/* Staffドロップダウン
----------------------------- */
div.staff-detail {
    clear: both;
    display: none;
    padding:15px;
    margin: 15px 0 0;
    background: #FCF4EA;
}
div.staff-container {
    padding: 10px 0 0;
    margin: 0 20px 25px;
    border-top: 1px dotted #CCC;
}
div.staff-heading-photo {
    float: left;
    padding: 2px;
    border: 1px solid #F1E7DB;
}
div.staff-heading-text {
    float: right;
    width: 395px;
}
div.staff-heading h3 {
    padding: 5px 0 5px 10px;
    margin: 0 0 15px !important;
    background: #F1E7DB;

}
div.staff-heading p {
    margin: 0 0 15px !important;
}
div.staff-detail-text dt {
    font-weight: bold;
}
div.staff-detail-photo-sub {
    float: left;
    padding: 2px;
    border: 1px solid #F1E7DB;
}
div.staff-detail-text {
    float: right;
    width: 355px;
}
html, body {
    height:100%; /* for IE 6 削除するとIE6で不具合 */
}
#modal-back{
    display:none;
    position:fixed;
    left:0;
    top:0;
    height:100%;
    width:100%;
    background:black;
    filter:alpha(opacity=60);
    opacity: 0.60;
}
* html #modal-back {
    position: absolute;
}
#modal-front{
    display:none;
    position: fixed;
}
* html #modal-front{
    position: absolute;
}
#modal-front img.close{
    position:absolute;
    top:-18px;
    right:-12px;
    cursor:pointer;
}
/* ----- emulateTable ----- */
/* 
* WordPressプラグインMobile Eye+を用いて携帯で表示
* 携帯でテーブルを使うと見づらいためemulateTableを利用
*/
#content #main div.emulateTable {
    margin: 20px 30px 20px 20px;
    border-bottom: 1px solid #EEE2D5;
}
#content #main .emulateTable p.tableHeading {
    text-align: center;
    clear: both;
    float: left;
    /* width: -- HTMLで直接入力 */
    margin: 0;
    padding: 0;
    border-width: 1px 1px 0 1px;
    border-style: solid;
    border-color: #EEE2D5;
    background: #F9F5F0;
    /* font-weight -- HTMLにstrongタグを記述 */
    line-height: 30px;
}
#content #main .emulateTable p.tableData {
    margin: 0;
    padding: 0 10px;
    border-width: 1px 1px 0 0;
    border-style: solid;
    border-color: #EEE2D5;
    line-height: 30px;
}
/* ----- emulateTable No2 ----- */
/* 
* WordPressプラグインMobile Eye+を用いて携帯で表示
* 携帯でテーブルを使うと見づらいためemulateTable2を利用
*/
#content #main div.emulateTable2 {
    margin: 20px 30px 20px 20px;
    border-bottom: 1px solid #EEE2D5;
}
#content #main .emulateTable2 p {
    clear: both;
    margin: 0;
    padding: 0;
    border-width: 1px 1px 0 0;
    border-style: solid;
    border-color: #EEE2D5;
}
#content #main .emulateTable2 span.tableHeading {
    display: block;
    float: left;
    /* width: -- HTMLで直接入力 */
    margin: 0;
    padding: 2px 5px;
    border-width: 0 0 0 1px;
    border-style: solid;
    border-color: #EEE2D5;
    background: #F9F5F0;
    /* font-weight -- HTMLにstrongタグを記述 */
}
#content #main .emulateTable2 span.tableData {
    display: block;
    float: left;
    margin: 0;
    padding: 2px 5px;
    border-width: 0 0 0 1px;
    border-style: solid;
    border-color: #EEE2D5;
}

/* footer
---------------------------------------------------- */
#wrapperFooter {
    clear: both;
    width: 820px;
    margin: 0 auto;
    background:  url(./images/com/wrapperback1.gif) repeat-y;
    text-align: left;
}
#footer {
    clear: both;
    width: 800px;
    margin: 0 auto;
    padding: 0 0 10px 0;
    border-width: 0 1px 1px 1px;
    border-style: solid;
    border-color: #990000;
    font-size: 1.3em;
}
#footer a{
    /* */
}
#footer p#footerlogo {
    clear: both;
    float: right;
    width: 195px;
    height: 70px;
    margin-right: 10px;
}

/* 汎用クラススタイル pos●● 配置, txt●● テキスト
---------------------------------------------------- */
.posBlock {
    display: block; 
}
.posLeft {
    display: block;
    float: left;
 }
.imgPosLeft {
    display: block;
    float: left;
    margin: 0 5px 5px 0;
}
.posRight {
    display: block;
    float: right; 
}
.posClear {
    clear: both;
 }
.txtRed {
    color: #FF0000;
}
.txtSmall {
    font-size: .1em;
}
.txtXSmall {
    font-size: .8em;
}
.txtCenter {
    text-align: center !important;
}
.txtLeft {
    text-align: left;
}
.txtRight {
    text-align: right;
}
/* ページの上へ */
p.pageUp {
    clear: both;
    margin: 35px 25px 10px 0 !important;
    padding: 8px 0 !important;
    text-align: right;
}
/* 次のページへ */
p.postsNav {
    clear: both;
    margin: 35px 25px 10px 0 !important;
    padding: 8px 0 !important;
    text-align: right;
}
/* ----- Style for Ktai Entry ----- */
.photo {
	margin: 15px 25px 15px 20px;
	padding-right:6px;
	float:left;
	line-height:110%;
	font-size:0.85em;
	text-indent:0;
}
.photo img {
	background:white;
	margin:0 4px 4px 0;
	padding:3px;
	border:1px solid #999;
}
.photo-end {
	clear:left;
}
/* ---------- */
/* Clearfix
---------------------------------------------------- */
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix {
display: inline-table;
min-height: 1%;
}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

