@charset "utf-8";

/*------------------------初期化------------------------*/
/* html {color: #000; background: #fff;} */

body,h1,h2,h3,h4,h5,h6,div,p,span,ul,ol,li,dl,dt,dd,form,input,select,hr,iframe,object,param {margin: 0; padding: 0;}
/* hasLayout {zoom: 1;} */
/* hasLayoutはIE8でなくなる？ */
/* 未初期化タグ pre,code,fieldset,legend,textarea,blockquote,th,td */
li {list-style: none;}
/* table {border-collapse:collapse; border-spacing: 0;} */
fieldset,img {border: 0; vertical-align: bottom;}

body {
margin:0;
padding: 0;
color: #717171;
background-color: #fff;
font-size: 12px;
font-family: "Hiragino Mincho Pro W3","ヒラギノ明朝 Pro W3","ＭＳ 明朝","ＭＳ Ｐ明朝",serif;
/*font-family : "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Osaka,sans-serif;*/
/* "KozGoStd-Light","KozGoStd-Regular","Kozuka Gothic Pro","小塚ゴシック Pro" */
line-height: 1.6;
text-align: center;
}

/* ++++++++++++++++++++++++++++++ [Start for Windows] +++++++++++++ */
/* Win IE フォントサイズ */

/* Win Iternet Explorer 7フォント関連 */
*:first-child+html body {font-size: 12px; line-height: 1.4;
/* フォント指定したいとき */ font-family: "ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
font-size: small; /* IE 標準準拠モード */
/* font:x-small; IE6後方互換モード */
}
/* Win Iternet Explorer 6などフォント関連 */
* html body {font-size: 12px; line-height: 1.4;
/* フォント指定したいとき */ font-family: "ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
font-size: small; /* IE 標準準拠モード */
/* font:x-small; IE6後方互換モード */
}
/* ++++++++++++++++++++++++++++++ [/End for Windows] +++++++++++++ */

/*table {font-size: inherit; font: 100%;}*/
table th {font-weight: normal;}
h1,h2,h3,h4,h5,h6 {font-size: 100%; font-weight: normal;}
input,textarea,select {
font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Osaka,sans-serif;
font-size: 100%;
font-weight: inherit;
}
/*input,textarea,select {*font-size: 100%;}*/

a,a:link,a:visited {color: #b38848; text-decoration: none;}
a:active,a:hover {color: #6ac3c2;}

hr {display: none;} /*CSS無効時の区切り線*/

/*floatのクリア*/
.clbth:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clbth {display: inline-block;}
/* hide IE-MAC \*/
* html .clbth {height: 1%;}
.clbth {display: block;}
/* end hide IE-MAC */

/* 共有クラス */
.resetfl {clear: both;}
.posLeft {float: left;}
.posRight {float: right;}
.txtLeft {text-align: left;}
.txtRight {text-align: right;}
.txtCenter {text-align: center;}
.txtSmall {font-size: 85%;}
.txtBold {font-weight: bold;}
.notice {color: #f00;}
.txtGreen{color: #128f2e;}
.noneBR {white-space: nowrap;}
.gothicFont {font-family : "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Osaka,sans-serif !important;}
.minchoFont {font-family: "Hiragino Mincho Pro W3","ヒラギノ明朝 Pro W3","ＭＳ 明朝","ＭＳ Ｐ明朝",serif !important;}
/* ++++++++++++++++++++++++++++++ [Start for Windows] +++++++++++++ */
*:first-child+html .txtSmall {font-size: 75%;}
*:first-child+html .gothicFont {font-family : "ＭＳ ゴシック","ＭＳ Ｐゴシック","メイリオ",Meiryo,sans-serif !important;}
*:first-child+html .minchoFont {font-family: "ＭＳ 明朝","ＭＳ Ｐ明朝",serif !important;}
* html .txtSmall {font-size: 80%;}
* html .gothicFont {font-family : "ＭＳ ゴシック","ＭＳ Ｐゴシック","メイリオ",Meiryo,sans-serif !important;}
* html .minchoFont {font-family: "ＭＳ 明朝","ＭＳ Ｐ明朝",serif !important;}
/* ++++++++++++++++++++++++++++++ [/End for Windows] +++++++++++++ */

.imgover, .mapLink {border: 0;}

/* ################################## */
/* XOOPS メニュー スタイルシート */
/* ################################## */
#adminTricca {
margin: 0 auto;
padding: 0.5em 0;
width: 960px;
text-align: right;
}

#xoopsMenu {
display: none;
position: absolute;
left: 0px;
top: 0;
margin: 5px;
padding: 5px;
background-color: #fff;
border: 2px solid #767676;
text-align: left;
z-index: 800;
}
.xoopsTitle {
padding: 2px 5px;
color: #fff;
background-color: #128f2e;
}
.xoopsContents {
margin: 5px 0;
padding: 5px;
}
.xoopsContents form {margin: 5px 0 10px 0;}
.xoopsContents  ul li {
padding: 0 0 0 1em;
line-height: 1.6;
}

/* ####################################### */
/* 共通 */
/* COLOR BACKGROUND #fffaf8 */
/* COLOR GREEN #128f2e */
/* COLOR ORANGE #d45d12 */
/* ####################################### */
#slidemaximageArea {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: hidden;
z-index: -10;
min-width: 960px;
}
.slidemaximage {display:none;}

#triccaPackage {
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
padding-top: 0;
padding-right: 0;
padding-bottom: 35px;
padding-left: 0;
min-width: 960px;
text-align: left;
/*border: 1px solid red;*/
background: transparent url(../img/header_bg.png) no-repeat center top;
}
/* ++++++++++++++++++++++++++++++ [Start for Windows] +++++++++++++ */
*:first-child+html #triccaPackage {padding-bottom: 35px;}
* html #triccaPackage {padding-bottom: 35px;}
/* ++++++++++++++++++++++++++++++ [/End for Windows] +++++++++++++ */

#headArea {
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
padding: 0;
width: 960px;
color: #444;
background-color: transparent;
}
#headArea h1 {
margin: 0;
padding: 0;
float: left;
width: 180px;
}
#headArea h1 img {margin: 11px 0;}
/*右詰め*/
#headArea h2#linkTansansen {
margin: 0;
padding: 0;
float: right;
width: 134px;
height: 50px;
}
#headArea h2#linkTansansen img {margin: 11px 0;}
#headArea h2#linkFirst {
margin: 0;
padding: 0;
float: right;
width: 134px;
height: 50px;
}
#headArea h2#linkFirst img {margin: 11px 0;}
#headArea address {
margin: 0;
padding: 0;
float: right;
width: 164px;
height: 50px;
}
#headArea address img {margin: 11px 0;}

#menuArea {
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding: 0;
text-align: center;
}
#mainMenu {
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
padding: 0;
width: 960px;
height: 28px;
}
#mainMenu li {
margin: 0;
padding: 0;
float: left;
height: 28px;
position: relative;
}

/* プルダウンメニュー */
#salonSub, #menuSub, #infoSub, #blogSub {
position: absolute;
left: 0;
top: 28px;
margin: 0;
padding: 0;
width: 158px;
color: #444;
background-color: transparent;
text-align: left;
z-index: 20;
}
#salonSub li, #menuSub li, #infoSub li, #blogSub li {
height: 21px;
}

/* 文字拡大縮小のときでも高さ固定 
#mainMenu > li {height: 28px;}
#mainMenu li img,#subMenu li img {margin: 2px 0 0 0;}*/

/* 960pxエリア */
#promenadeArea {
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
padding: 0;
width: 960px;
text-align: center;
}

/* ## コンテンツエリア ## */
#mainArea {
margin-top: 20px;
margin-right: 0;
margin-bottom: 20px;
margin-left: 0;
padding: 0;
float: right;
width: 712px;
background-color: #fff;
text-align: left;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
}
#subArea {
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding: 0;
float: left;
width: 224px;
/*position: fixed;*/
}

/* フッターを下部に固定する */
#fixedArea {
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding: 0;
position: fixed;
left: 0;
bottom: 0;
z-index: 100;
width: 100%;
text-align: center;
/*border: 1px solid green;*/
}

#bnrDixsept {
margin: 0;
padding: 0;
text-align: left;
position: absolute;
left: 0;
top: -64px;
}

/* パンくずリスト */
#topicPath {
clear: both;
margin-top: 0;
margin-right: auto;
margin-bottom: 10px;
margin-left: auto;
padding: 0;
width: 650px;
height: 25px;
text-align: left;
text-indent: 60px;
font-size: 80%;
line-height: 25px;
}
*:first-child+html #topicPath {
font-family : "ＭＳ ゴシック","ＭＳ Ｐゴシック",Verdana,sans-serif;
font-size: 80%;
}

/* ####################################### */
/* Home */
/* ####################################### */
#topicsArea {
margin-top: 200px;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
padding: 20px 30px;
width: 700px;
color: #ba8d4b;
background: transparent url(../img/bg_white.png) repeat left top;
/*font-family : "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Osaka,sans-serif;*/
text-align: left;
}

#triccaInfo {
float: left;
margin: 0;
padding: 0;
width: 330px;
}
#staffBlog {
float: right;
margin: 0;
padding: 0;
width: 330px;
}

#topicsArea h3 {
padding: 0 0.5em 0.5em 0.5em;
/*border-bottom: 1px dotted #765c2f;*/
}
#triccaInfo h3 {color: #eb7aab;}
#staffBlog h3 {color: #6bc3c3;}

#topicsArea p {
margin: 0;
padding: 0.2em 0;
font-size: 80%;
/*border-bottom: 1px dotted #765c2f;*/
}
#triccaInfo p a,#triccaInfo p a:link,#triccaInfo p a:visited {color: #ba8d4b;}
#triccaInfo p a:active,#triccaInfo p a:hover {color: #eb7aab; border-bottom: 1px solid #eb7aab;}
#staffBlog p a,#staffBlog p a:link,#staffBlog p a:visited {color: #ba8d4b;}
#staffBlog p a:active,#staffBlog p a:hover {color: #6bc3c3; border-bottom: 1px solid #6bc3c3;}

#topicsArea p span.topicDate {
padding-left: 0.5em;
padding-right: 1.5em;
}

/* ####################################### */
/* Footer */
/* ####################################### */
#footerArea {
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding: 0;
width: 100%;
color: #898989;
background-color: #fff;
text-align: center;
}

#footer {
position: relative;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
padding: 8px 10px;
width: 940px;
font-family : Arial,Verdana,sans-serif;
font-size: 9px;
text-align: left;
color: #898989;
/*background: #8a6632 url(../img/footer_bg.gif) repeat-y top left;*/
}
/* ++++++++++++++++++++++++++++++ [Start for Windows] +++++++++++++ */
*:first-child+html #footer {font-size: 10px;}
* html #footer {font-size: 10px;}
/* ++++++++++++++++++++++++++++++ [/End for Windows] +++++++++++++ */

ul#footMenu {
float: left;
width: 400px;
/*width: 400px;
text-align: right;*/
}
ul#footMenu li {
display: inline;
text-transform: uppercase;
}
ul#footMenu li a,ul#footMenu li a:link,ul#footMenu li a:visited {color: #898989; text-decoration: none;}
ul#footMenu li a:active,ul#footMenu li a:hover {color: #ddc7a4;}

#copyright {
margin: 0;
padding: 0;
float: right;
width: 400px;
text-align: right;
}

/* ####################################### */
/* Whats New HairStyle Blog */
/* Hairstyle Blog 更新情報 w:120px h:180px*/
/* ####################################### */
#newHairStyleArea {
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
padding: 0;
width: 960px;
position: relative;
/*border: 1px solid red;*/
}
#newBlogCard {
position: absolute;
right: 0px;
top: 10px;
width: 120px;
height: 180px;
background: transparent url(../img/new_hairstyleblog_bg.png) left top no-repeat;
text-align: left;
}
#newBlogCard.rotateAction {
-webkit-animation-name: newrotate;
-webkit-animation-duration: 2s;
-webkit-animation-timing-function: ease-out;
-webkit-transform: rotate(3deg);
-webkit-transform-origin: center top;
-moz-animation-name: newrotate;
-moz-animation-duration: 2s;
-moz-animation-timing-function: ease-out;
-moz-transform: rotate(3deg);
-moz-transform-origin: center top;
}
#newBlogCard a {
display: block;
width: 120px;
height: 150px;
}
#blogUpDate {
margin-top: 14px;
margin-left: 30px;
color: #ed4e9b;
font-size: 90%;
}
#newHairStyle {
position: relative;
height: 86px;
}
#newHairStyle img {
margin: 0;
position:absolute;
left: 10px;
top: -10px;
/* W:92px H: 82px */
clip:rect(10px,97px,94px,3px);
}
#blogUpTitle {
margin: 0 14px;
width: 92px;
color: #b68957;
font-size: 90%;
line-height: 1.2;
}
/* アニメーション */
@-webkit-keyframes newrotate {
0% {-webkit-transform: rotate(0);}
20% {-webkit-transform: rotate(18deg);}
40% {-webkit-transform: rotate(-15deg);}
60% {-webkit-transform: rotate(8deg);}
80% {-webkit-transform: rotate(-5deg);}
100% {-webkit-transform: rotate(5deg);}
}
@-moz-keyframes newrotate {
from {-moz-transform: rotate(0);}
20% {-moz-transform: rotate(18deg);}
40% {-moz-transform: rotate(-15deg);}
60% {-moz-transform: rotate(8deg);}
80% {-moz-transform: rotate(-5deg);}
to {-moz-transform: rotate(5deg);}
}
@-o-keyframes newrotate {
from {-o-transform: rotate(0);}
20% {-o-transform: rotate(18deg);}
40% {-o-transform: rotate(-15deg);}
60% {-o-transform: rotate(8deg);}
80% {-o-transform: rotate(-5deg);}
to {-o-transform: rotate(5deg);}
}
@-ms-keyframes newrotate {
from {-ms-transform: rotate(0);}
20% {-ms-transform: rotate(18deg);}
40% {-ms-transform: rotate(-15deg);}
60% {-ms-transform: rotate(8deg);}
80% {-ms-transform: rotate(-5deg);}
to {-ms-transform: rotate(5deg);}
}
@keyframes newrotate {
from {transform: rotate(0);}
20% {transform: rotate(18deg);}
40% {transform: rotate(-15deg);}
60% {transform: rotate(8deg);}
80% {transform: rotate(-5deg);}
to {transform: rotate(5deg);}
}

/* IE-MAC Only \*//*/
/**/