﻿@charset "UTF-8";
@import url(reset.css);
@import url(textsettings.css);

/* ---------------------------------------------------------------- *
	全体レイアウトに関する設定　
 * ---------------------------------------------------------------- */
* {
margin: 0;
padding: 0;
}
p {
margin-bottom:0.5em;
}

.clr {
clear:both;
}
/* 全体レイアウト */
#container {
width:960px;
margin:0 auto;
position:relative;
}
#contents-wrapper {
width:960px;
margin:0 auto;
}
#header {
height:104px;
}
#header #logo a {
background:url(../images/logo.gif) no-repeat;
width:350px;
height:50px;
display:block;
float:left;
margin:23px 0 0 0;
}
#header a.home:link {
background:url(../images/home-bt.gif) no-repeat;
width:65px;
height:16px;
display:block;
float:right;
margin:48px 0 0 0;
text-indent:-9999px;
}
#header a.home:visited {
background:url(../images/home-bt.gif) no-repeat;
width:65px;
height:16px;
display:block;
float:right;
margin:48px 0 0 0;
text-indent:-9999px;
}
#header a.home:hover {
background:url(../images/home-bt.gif) no-repeat;
width:65px;
height:16px;
display:block;
float:right;
margin:48px 0 0 0;
text-indent:-9999px;
/*クロスブラウザ透過設定*/
filter:alpha(opacity=50);/*Needed for IE*/
-moz-opacity:0.5;/*Older mozilla broswers like NN*/
-khtml-opacity: 0.5;/*Old versions of Safari and "KHTML" browser engines*/
opacity: 0.5;/*FF, Safari, and Opera*/
}
#contents {
width:960px;
margin:0 auto;
}
#contents {
margin-top:42px;
}
#left-contents {
width:685px;
float:left;
}
#right-contents {
width:235px;
float:right;
}
/* ---------------------------------------------------------------- *
	トップレイアウト
 * ---------------------------------------------------------------- */
#fla {
width:960px;
margin-bottom:10px;
}
#fla img, #fla ul li {
margin:0;
padding:0;
}
#fla-left {
width:640px;
float:left;
}
#fla-right {
width:320px;
float:left;
}
#fla-right .menutop {
background:url(../images/right-menu.gif) no-repeat;
width:320px;
height:23px;
display:block;
}
#fla-right ul li {
text-indent:-9999px;
}
#fla-right ul li a.menutop01:link {
width:320px;
height:88px;
display:block;
background:url(../images/right-menu01.gif) 0px 0px no-repeat;
}
#fla-right ul li a.menutop01:visited {
width:320px;
height:88px;
display:block;
background:url(../images/right-menu01.gif) 0px 0px no-repeat;
}
#fla-right ul li a.menutop01:hover {
width:320px;
height:88px;
display:block;
background:url(../images/right-menu01.gif) 0px 0px no-repeat;
filter:alpha(opacity=50);/*Needed for IE*/
-moz-opacity:0.5;/*Older mozilla broswers like NN*/
-khtml-opacity: 0.5;/*Old versions of Safari and "KHTML" browser engines*/
opacity: 0.5;/*FF, Safari, and Opera*/
}
#fla-right ul li a.menutop02:link {
width:320px;
height:88px;
display:block;
background:url(../images/right-menu02.gif) 0px 0px no-repeat;
}
#fla-right ul li a.menutop02:visited {
width:320px;
height:88px;
display:block;
background:url(../images/right-menu02.gif) 0px 0px no-repeat;
}
#fla-right ul li a.menutop02:hover {
width:320px;
height:88px;
display:block;
background:url(../images/right-menu02.gif) 0px 0px no-repeat;
filter:alpha(opacity=50);/*Needed for IE*/
-moz-opacity:0.5;/*Older mozilla broswers like NN*/
-khtml-opacity: 0.5;/*Old versions of Safari and "KHTML" browser engines*/
opacity: 0.5;/*FF, Safari, and Opera*/
}
#fla-right ul li a.menutop03:link {
width:320px;
height:88px;
display:block;
background:url(../images/right-menu03.gif) 0px 0px no-repeat;
}
#fla-right ul li a.menutop03:visited {
width:320px;
height:88px;
display:block;
background:url(../images/right-menu03.gif) 0px 0px no-repeat;
}
#fla-right ul li a.menutop03:hover {
width:320px;
height:88px;

filter:alpha(opacity=50);/*Needed for IE*/
-moz-opacity:0.5;/*Older mozilla broswers like NN*/
-khtml-opacity: 0.5;/*Old versions of Safari and "KHTML" browser engines*/
opacity: 0.5;/*FF, Safari, and Opera*/
}
#fla-right ul li {
margin-bottom:3px;
}
#fla-right ul li {
margin-bottom:3px;
}
a.link-banner:link {
margin-bottom:3px;
}
a.link-banner:visited {
margin-bottom:3px;
}
a.link-banner:hover {
margin-bottom:3px;
/*クロスブラウザ透過設定*/
filter:alpha(opacity=50);/*Needed for IE*/
-moz-opacity:0.5;/*Older mozilla broswers like NN*/
-khtml-opacity: 0.5;/*Old versions of Safari and "KHTML" browser engines*/
opacity: 0.5;/*FF, Safari, and Opera*/
}
a.link-more:link {
margin-top:3px;
width:65px;
height:16px;
display:block;
background:url(../images/more.gif) 0px 0px no-repeat;
text-indent:-9999px;
}
a.link-more:visited {
margin-top:3px;
width:65px;
height:16px;
display:block;
background:url(../images/more.gif) 0px 0px no-repeat;
text-indent:-9999px;
}
a.link-more:hover {
margin-top:3px;
width:65px;
height:16px;
display:block;
background:url(../images/more.gif) 0px 0px no-repeat;
text-indent:-9999px;
/*クロスブラウザ透過設定*/
filter:alpha(opacity=50);/*Needed for IE*/
-moz-opacity:0.5;/*Older mozilla broswers like NN*/
-khtml-opacity: 0.5;/*Old versions of Safari and "KHTML" browser engines*/
opacity: 0.5;/*FF, Safari, and Opera*/
}
#news-area #news {
width:330px;
float:left;
}
#news-area #blog {
width:330px;
float:right;
}
#news-area {
color:#E74832;
}
#news-area ul li {
border-bottom:1px solid #EAE7DF;
margin-bottom:4px;
padding-bottom:3px;
}
#news-area ul li a:link {
display:block;
color:#000;
}
#news-area ul li a:visited {
display:block;
color:#000;
}
#news-area ul li a:hover {
display:block;
color:#E74832;
}
#news-area ul li .no-link {
display:block;
color:#000;
}
#media img {
width:75px;
float:left;
display:block;
margin-right:15px;
padding-bottom:2px;
}
#media ul li {
margin-bottom:15px;
}
#media ul li h3 {
font-size:100%;
float:right;
width:140px;
margin-bottom:3px;
margin-right:5px;
}
#media ul li h3 {
color:#CC0066;
}

#media ul li h4 {
float:right;
display:block;
width:140px;
margin-bottom:10px;
margin-right:5px;
}
#media ul li p {
font-size:93%;
color:#666;
line-height:1.4;
float:right;
display:block;
width:140px;
margin-right:5px;
}

/* ---------------------------------------------------------------- *
	メディア情報
 * ---------------------------------------------------------------- */
#media2 {
margin-left:10px;
}
#media2 img {
width:75px;
float:left;
display:block;
margin-right:20px;
padding-bottom:2px;
}
#media2 ul li {
width:315px;
margin-bottom:15px;
float:left;
margin-right:20px;
}
#media2 ul li h3 {
font-size:100%;
float:left;
width:210px;
margin-bottom:3px;
margin-right:5px;
}
#media2 ul li h3 {
color:#CC0066;
}

#media2 ul li h4 {
float:left;
display:block;
width:210px;
margin-bottom:10px;
margin-right:5px;
border-bottom:1px dotted #ccc;
}
#media2 ul li p {
font-size:93%;
color:#666;
line-height:1.4;
float:left;
display:block;
width:210px;
margin-right:5px;
}

/* ---------------------------------------------------------------- *
	サイドナビゲーション
 * ---------------------------------------------------------------- */
#side-navi .sidenavi-top {
background:url(../images/side-navi.gif) no-repeat;
width:235px;
height:23px;
display:block;
}
#side-navi ul li a.sidenavi-01:link {
width:235px;
height:80px;
display:block;
background:url(../images/side-navi01.gif) 0px 0px no-repeat;
}
#side-navi ul li a.sidenavi-01:visited {
width:235px;
height:80px;
display:block;
background:url(../images/side-navi01.gif) 0px 0px no-repeat;
}
#side-navi ul li a.sidenavi-01:hover {
width:235px;
height:80px;
display:block;
background:url(../images/side-navi01.gif) 0px 0px no-repeat;
filter:alpha(opacity=50);/*Needed for IE*/
-moz-opacity:0.5;/*Older mozilla broswers like NN*/
-khtml-opacity: 0.5;/*Old versions of Safari and "KHTML" browser engines*/
opacity: 0.5;/*FF, Safari, and Opera*/
}
#side-navi ul li a.sidenavi-02:link {
width:235px;
height:80px;
display:block;
background:url(../images/side-navi02.gif) 0px 0px no-repeat;
}
#side-navi ul li a.sidenavi-02:visited {
width:235px;
height:80px;
display:block;
background:url(../images/side-navi02.gif) 0px 0px no-repeat;
}
#side-navi ul li a.sidenavi-02:hover {
width:235px;
height:80px;
display:block;
background:url(../images/side-navi02.gif) 0px 0px no-repeat;
filter:alpha(opacity=50);/*Needed for IE*/
-moz-opacity:0.5;/*Older mozilla broswers like NN*/
-khtml-opacity: 0.5;/*Old versions of Safari and "KHTML" browser engines*/
opacity: 0.5;/*FF, Safari, and Opera*/
}
#side-navi ul li a.sidenavi-03:link {
width:235px;
height:80px;
display:block;
background:url(../images/side-navi03.gif) 0px 0px no-repeat;
}
#side-navi ul li a.sidenavi-03:visited {
width:235px;
height:80px;
display:block;
background:url(../images/side-navi03.gif) 0px 0px no-repeat;
}
#side-navi ul li a.sidenavi-03:hover {
width:235px;
height:80px;
display:block;
background:url(../images/side-navi03.gif) 0px 0px no-repeat;
filter:alpha(opacity=50);/*Needed for IE*/
-moz-opacity:0.5;/*Older mozilla broswers like NN*/
-khtml-opacity: 0.5;/*Old versions of Safari and "KHTML" browser engines*/
opacity: 0.5;/*FF, Safari, and Opera*/
}
#side-navi ul li a.sidenavi-04:link {
width:235px;
height:98px;
display:block;
background:url(../images/side-navi04.jpg) 0px 0px no-repeat;
}
#side-navi ul li a.sidenavi-04:visited {
width:235px;
height:98px;
display:block;
background:url(../images/side-navi04.jpg) 0px 0px no-repeat;
}
#side-navi ul li a.sidenavi-04:hover {
width:235px;
height:98px;
display:block;
background:url(../images/side-navi04.jpg) 0px 0px no-repeat;
filter:alpha(opacity=50);/*Needed for IE*/
-moz-opacity:0.5;/*Older mozilla broswers like NN*/
-khtml-opacity: 0.5;/*Old versions of Safari and "KHTML" browser engines*/
opacity: 0.5;/*FF, Safari, and Opera*/
}
#side-navi ul li a.sidenavi-05:link {
margin-top:30px;
width:235px;
height:170px;
display:block;
background:url(../images/side-navi05.jpg) 0px 0px no-repeat;
}
#side-navi ul li a.sidenavi-05:visited {
margin-top:30px;
width:235px;
height:170px;
display:block;
background:url(../images/side-navi05.jpg) 0px 0px no-repeat;
}
#side-navi ul li a.sidenavi-05:hover {
margin-top:30px;
width:235px;
height:170px;
display:block;
background:url(../images/side-navi05.jpg) 0px 0px no-repeat;
filter:alpha(opacity=50);/*Needed for IE*/
-moz-opacity:0.5;/*Older mozilla broswers like NN*/
-khtml-opacity: 0.5;/*Old versions of Safari and "KHTML" browser engines*/
opacity: 0.5;/*FF, Safari, and Opera*/
}
#side-navi ul li {
text-indent:-9999px;
margin-bottom:3px;
}
#menu-page a:link img {
margin-bottom:5px;
}
#menu-page a:visited img {
margin-bottom:5px;
}
#menu-page a:hover img {
margin-bottom:5px;
filter:alpha(opacity=50);/*Needed for IE*/
-moz-opacity:0.5;/*Older mozilla broswers like NN*/
-khtml-opacity: 0.5;/*Old versions of Safari and "KHTML" browser engines*/
opacity: 0.5;/*FF, Safari, and Opera*/
}
/* ---------------------------------------------------------------- *
	グローバルナビゲーション
 * ---------------------------------------------------------------- */
#gnavi {
height:42px;
margin-bottom:0px;
position:absolute;
left:0px;
top:104px;
width:960px;
}

#gnavi ul li {
text-indent:-9999px;
float:left;
}
#gnavi ul li a.navi-menu:link {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) 0px 0px no-repeat;
}
#gnavi ul li a.navi-menu:visited {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) 0px 0px no-repeat;
}
#gnavi ul li a.navi-menu:hover {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) 0px -42px no-repeat;
}
#gnavi ul li a.navi-concept:link {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) -192px 0px no-repeat;
}
#gnavi ul li a.navi-concept:visited {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) -192px 0px no-repeat;
}
#gnavi ul li a.navi-concept:hover {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) -192px -42px no-repeat;
}
#gnavi ul li a.navi-salon:link {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) -384px 0px no-repeat;
}
#gnavi ul li a.navi-salon:visited {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) -384px 0px no-repeat;
}
#gnavi ul li a.navi-salon:hover {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) -384px -42px no-repeat;
}
#gnavi ul li a.navi-media:link {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) -576px 0px no-repeat;
}
#gnavi ul li a.navi-media:visited {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) -576px 0px no-repeat;
}
#gnavi ul li a.navi-media:hover {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) -576px -42px no-repeat;
}
#gnavi ul li a.navi-contact:link {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) -768px 0px no-repeat;
}
#gnavi ul li a.navi-contact:visited {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) -768px 0px no-repeat;
}
#gnavi ul li a.navi-contact:hover {
width:192px;
height:42px;
display:block;
background:url(../images/navi.gif) -768px -42px no-repeat;
}

/* ---------------------------------------------------------------- *
	フッター
 * ---------------------------------------------------------------- */
#footer {
font-size:85%;
width:960px;
margin:0 auto;
}
#footer-navi {
border-top:2px solid #EAE7DF;
border-bottom:1px solid #EAE7DF;
margin-top:25px;
margin-bottom:8px;
}
#footer-navi ul {
margin:15px 5px;
}
#footer-navi ul li {
display:inline;
margin-right:20px;
}
#footer-navi ul li a:link {
color: #000;
}
#footer-navi ul li a:visited {
color: #000;
}
#footer-navi ul li a:hover {
color:#E74832;
text-decoration:none;
}
#foot-info {
margin-bottom:8px;
}
#footer #logo2 {
width:400px;
float:left;
margin-top:10px;
margin-right:20px;
}
#footer #tel {
/*width:600px;*/
float:right;
color:#333333;
margin-top:7px;
}
.s-name {
width:7em;
display:block;
float:left;
}
.s-tel {
font-size:108%;
font-weight:bold;
text-align:right;
width:12em;
}
.s-address {
width:20em;
display:block;
float:left;
}

#footer address {
font-style: normal;
color:#999999;
padding-bottom:15px;
}

#foot-contact {
position:absolute;
bottom:150px;
left:224px;
}

a.f-contact:link {
width:750px;
height:42px;
display:block;
background:url(../images/foot-contact.jpg) 0 0 no-repeat;
text-indent:-9999px;
}
a.f-contact:visited {
width:750px;
height:42px;
display:block;
background:url(../images/foot-contact.jpg) 0 0 no-repeat;
text-indent:-9999px;
}
a.f-contact:hover {
width:750px;
height:42px;
display:block;
background:url(../images/foot-contact.jpg) 0 -42px no-repeat;
text-indent:-9999px;
}

/* ---------------------------------------------------------------- *
	ページタイトル
 * ---------------------------------------------------------------- */
.title-top {
background:url(../images/top-title01.gif) no-repeat;
text-indent:-9999px;
width:685px;
height:32px;
display:block;
margin-bottom:10px;
}
.title-menu {
background:url(../images/page-title01.gif) no-repeat;
text-indent:-9999px;
width:685px;
height:32px;
display:block;
margin-bottom:10px;
}
.title-short {
background:url(../images/page-title02.gif) no-repeat;
text-indent:-9999px;
width:685px;
height:32px;
display:block;
margin-bottom:10px;
}

.title-concept {
background:url(../images/page-title05.gif) no-repeat;
text-indent:-9999px;
width:685px;
height:32px;
display:block;
margin-bottom:10px;
}
.title-salon {
background:url(../images/page-title06.gif) no-repeat;
text-indent:-9999px;
width:685px;
height:32px;
display:block;
margin-bottom:10px;
}
.title-media {
background:url(../images/page-title07.gif) no-repeat;
text-indent:-9999px;
width:685px;
height:32px;
display:block;
margin-bottom:10px;
}
.title-contact {
background:url(../images/page-title08.gif) no-repeat;
text-indent:-9999px;
width:685px;
height:32px;
display:block;
margin-bottom:10px;
}


.title-right01 {
background:url(../images/top-title02.gif) no-repeat;
text-indent:-9999px;
width:235px;
height:32px;
display:block;
margin-bottom:10px;
}
/* ---------------------------------------------------------------- *
	ハック
 * ---------------------------------------------------------------- */

/* IE6 で画像が消えることがあるバグを回避 */
.contents img {
  position: relative;
}

/* IE6/IE7 で垂直配置がずれるバグを回避 */
html[lang^="ja"] #leftside {
  margin-top: 0;
}

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

.clr {
clear:both;
}
/* ---------------------------------------------------------------- *
	お問い合わせフォーム
 * ---------------------------------------------------------------- */
#contact-f table td {
padding:8px;
border-bottom:1px dotted #ccc;
}
#contact-f {
margin-left:10px;
width:650px;
}
/* ---------------------------------------------------------------- *
	入力チェック
* ---------------------------------------------------------------- */
em {
color: #CC3333;
}
.textfieldRequiredMsg, 
.textfieldInvalidFormatMsg, 
.textfieldMinValueMsg,
.textfieldMaxValueMsg,
.textfieldMinCharsMsg,
.textfieldMaxCharsMsg,
.textfieldValidMsg {
	display: none;
}

.textfieldRequiredState .textfieldRequiredMsg, 
.textfieldInvalidFormatState .textfieldInvalidFormatMsg, 
.textfieldMinValueState .textfieldMinValueMsg,
.textfieldMaxValueState .textfieldMaxValueMsg,
.textfieldMinCharsState .textfieldMinCharsMsg,
.textfieldMaxCharsState .textfieldMaxCharsMsg
{
	display: inline;/*(06)*/
	color: #CC3333;
	/*border: 2px solid #CC3333;*/
	padding: 3px;
	/*margin-left:15px;*/
	display:block;
}

.textfieldValidState input, input.textfieldValidState {
	background-color: #B8F5B1;/*(07)*/
	border: 1px solid #99CC00;
	padding: 1px;
}

input.textfieldRequiredState, .textfieldRequiredState input, 
input.textfieldInvalidFormatState, .textfieldInvalidFormatState input, 
input.textfieldMinValueState, .textfieldMinValueState input, 
input.textfieldMaxValueState, .textfieldMaxValueState input, 
input.textfieldMinCharsState, .textfieldMinCharsState input, 
input.textfieldMaxCharsState, .textfieldMaxCharsState input {
	background-color: #FF9F9F;/*(08)*/
	border: 1px solid #CC3333;
	padding: 1px;
}


.textfieldFocusState input, input.textfieldFocusState {

}

.textfieldFlashText input, input.textfieldFlashText {
	color: red !important;
	padding: 1px;
}

.textfieldHintState input, input.textfieldHintState {

}

.focus {

}

.normal {

}
