@charset "utf-8";
/* ---------------------------------------------------------------------------------
Copyright © Le uwin. ALL RIGHTS RESERVED.

HTML CSS Selectors common 

$Revision: 1.0 $
--------------------------------------------------------------------------------- */

/*---------------------------------------------------------------------------------
初期設定
--------------------------------------------------------------------------------- */
body {
	font-family:'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
	color: #525252;
	line-height: 1.8;
	font-size: 12px;
	margin: 0px;
	padding: 0px;
}


h1,h2,h3,h4,h5,h6,
ul,ol,dl,
p,li,dt,dd,th,td {
	margin: 0px;
	padding: 0px;
	border: 0;
	vertical-align: baseline;
	font-weight: normal;
}

ol, ul {
	list-style: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
th,td {
	text-align: left;
	vertical-align: top;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, main {
	display: block;
	margin: 0px;
	padding: 0px;
}

img {
   vertical-align: middle;
}


a img {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}

a:link,
a:visited,
a:hover,
a:active {
	color: #000;
	text-decoration: none;
}
a:hover {
	-webkit-transition: 0.2s ease-in-out;
	-moz-transition: 0.2s ease-in-out;
	-o-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
	opacity:0.5;
}

ul {
	list-style-type: none;
}
 
.clear {
	clear: both;
	height: 0;
}

.clearfix:after {
	content: ""; 
	display: block;
	clear: both;
	height: 0;
}
.none {
	display: none !important;
}

.anchor {
	display: block;
	position: relative;
	top: -110px;
}

/*---------------------------------------------------------------------------------
ヘッダー
--------------------------------------------------------------------------------- */
#header-wrapper {
	width: 100%;
	min-width: 1200px;
	height: 80px;
	background-color: rgba(255,255,255,0.85);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 101;
}
#header-wrapper header {
	width: 1200px;
	margin: 0 auto;
	overflow:hidden;
	position: relative;
}
#header-wrapper header h1 {
	float: left;
	width: 149px;
	padding: 9px 52px 0 123px;
}
#header-wrapper header nav {
	float: left;
	width: 876px;
	padding-top: 21px;
}
#header-wrapper header nav ul {
	overflow:hidden;
}
#header-wrapper header nav li {
	float: left;
	padding-right: 32px;
}
#header-wrapper header nav li a {
	display: table-cell;
	font-family: 'Bad Script', cursive;
	font-size: 19px;
	line-height: 1;
	color: #111;
	height: 40px;
	vertical-align: middle;	
}
#header-wrapper header nav li:nth-of-type(8) {
	padding-right: 57px;
}
#header-wrapper header nav li.sns {
	padding-right: 23px;
}

@media screen and (min-width: 1200px) {
	#header-wrapper header {
		width: 100%;
	}
	#header-wrapper header nav li.sns {
		padding-right: 0px;
		float: none;
		position: fixed;
		top: 19px;
	}
	#header-wrapper header nav li.sns.fb {
		right: 180px;
	}
	#header-wrapper header nav li.sns.is {
		right: 140px;
	}
}

#header-wrapper #reserve {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 102;
}

/*---------------------------------------------------------------------------------
メインビジュアル
--------------------------------------------------------------------------------- */
#mv {
	width: 100%;
	min-width: 1200px;
	height: 335px;
	background-repeat: no-repeat;
	background-position: center bottom;
	position: relative;
	z-index: 1;
}
@media screen and (min-width: 1200px) {
	#mv {
		background-size: cover;		
	}
}
#mv:before,#mv:after {
	display: block;
	height: 185px;
	position: absolute;
	bottom: -185px;
	z-index: 0;
	content:"";
}
#mv:before {
	width: 512px;
	left: 0;
	background-image: url(../img/common/mv_left.jpg);
}
#mv:after {
	width: 616px;
	right: 0;
	background-image: url(../img/common/mv_right.jpg);	
}
#mv h2 {
	text-align: center;
	font-weight: normal;
}
#mv h2 span {
	display: inline-block;
	padding-top: 230px;
	font-family: 'Bad Script', cursive;
	font-size: 28px;
	line-height: 1;
	color: #fff;
	padding-bottom: 5px;
	border-bottom: 4px solid #fff;
}

/*---------------------------------------------------------------------------------
コンテンツ
--------------------------------------------------------------------------------- */
#contents-wrapper {
	padding-top: 97px;
	padding-bottom: 120px;
	background-image: url(../img/common/icon_contents.jpg);
	background-repeat: no-repeat;
	background-position: center 42px;
	position: relative;
	z-index: 1;
}
#contents-wrapper header {
	text-align: center;
}
#contents-wrapper header h3 {
	display: inline-block;
	font-family: 'Bad Script', cursive;
	font-size: 28px;
	line-height: 1;
	font-weight: normal;
	padding-bottom: 18px;
	background-image: url(../img/common/ttl_line.png);
	background-repeat: repeat-x;
	background-position: center bottom;
}
#contents-wrapper header h3 .sub {
	display: block;
	font-family: 'Italianno', cursive;
	font-size: 21px;
	line-height: 1;
	margin-bottom: 7px;
}

/*スタイル一覧*/
#style-list {
	width: 999px;
	margin: 0 auto 46px;
	overflow:hidden;
}
#style-list li {
	float: left;
	width: 240px;
	height: 240px;
	margin-right: 13px;
	margin-bottom: 14px;
	overflow:hidden;
}
#style-list li:nth-of-type(4n) {
	margin-right: 0;
}
#style-list li a {
	display: block;
	width: 240px;
	height: 240px;
	transition: 0.5s;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
#style-list li a:hover {
	opacity:1;
}
#style-list li a:hover {
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
}
#style-list li.all a:hover{
	-webkit-transform: scale(1);
	transform: scale(1);
	opacity:0.5;

}

/*ページ送り*/
.pagination {
	width: 100%;
	min-width: 1200px;
	background-color: #F4F4F4;
	text-align: center;
}
.pagination a,
.pagination span {
	display: inline-block;
	width: 46px;
	padding: 16px 0;
	margin: 0 8px;
	font-size: 14px;
	line-height: 1;
	color: #808080;
}
.pagination span {
	background-color: #DDD;
	color: #fff;
}
.pagination .ditto_previous_link,
.pagination .ditto_next_link {
	margin: 0 12px;	
}




/*---------------------------------------------------------------------------------
フッター
--------------------------------------------------------------------------------- */
#page-top {
	position: fixed;
	right: 130px;
	bottom: 35px;
	transition:0.5s;
    transform: rotatey(270deg);
	z-index: 20;
}
#footer-wrapper {
	width: 100%;
	min-width: 1200px;
	padding-top: 40px;
	padding-bottom: 25px;
	background-image: url(../img/common/bg_footer.jpg);
	background-position: center top;
	background-size: cover;	
}
#footer-wrapper footer {
	overflow:hidden;
	width: 1000px;
	margin: 0 auto;
	color: #fff;
}
#footer-wrapper .sister-salon {
	float: left;
	width: 208px;
	padding-top: 107px;
	padding-left: 46px;
}
#footer-wrapper .sister-salon h2 {
	text-align: center;
}
#footer-wrapper .sister-salon p {
}
#footer-wrapper .sister-salon p a {
	display: block;
	text-align: center;
	padding: 20px 0;
	font-family: 'Cabin Sketch', cursive;
	font-size: 16px;
	line-height: 1;
	color: #fff;
	background-image: url(../img/common/bg_f_sister_salon.png);
	background-repeat: no-repeat;
	background-position: center center;
}

#footer-wrapper .salon-information {
	float: left;
	width: 452px;
	padding-top: 5px;
}
#footer-wrapper .salon-information h2 {
	text-align: center;
	padding-bottom: 10px;
	font-size: 14px;
}
#footer-wrapper .salon-information h2 img {
	padding-bottom: 35px;
}
#footer-wrapper .salon-information .add {
	text-align: center;
	font-size: 12px;
	padding-bottom: 15px;
}
#footer-wrapper .salon-information .add-en {
	padding-bottom: 16px;
	text-align: center;
	font-family: 'Cabin Sketch', cursive;
	font-size: 16px;
	line-height: 1.1;
}
#footer-wrapper .salon-information .tel {
	padding-bottom: 20px;
	text-align: center;
	font-family: 'Cabin Sketch', cursive;
	font-size: 24px;
	line-height: 1;
}
#footer-wrapper .salon-information .sns {
	text-align: center;
}
#footer-wrapper .salon-information .sns a {
	display: inline-block;
	padding: 0 18px;
}


#footer-wrapper footer .map {
	float: left;
	width: 293px;
}

#footer-wrapper footer nav {
	padding-top: 50px;
	clear: both;
}
#footer-wrapper footer nav ul {
	letter-spacing: -.40em; /* 文字間を詰めて隙間を削除する */
	text-align: center;
}
#footer-wrapper footer nav li {
	display: inline-block;
    letter-spacing: normal; /* 文字間を通常に戻す */
	padding: 0 25px;
	border-left: 1px solid #fff;
}
#footer-wrapper footer nav li:last-child {
	border-right: 1px solid #fff ;
}
#footer-wrapper footer nav a {
	font-size: 12px;
	line-height: 1;
	text-decoration: underline;	
	color: #fff;
}



#footer-wrapper footer #copyright {
	padding-top: 38px;
	text-align: center;
}



/* Slider */
.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}

.slick-prev:before,
.slick-next:before {
  display: none !important;
}
.slick-prev:active,
.slick-next:active {
  border: none;
}
.slick-disabled {
  display: none !important;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
  outline: none;
  opacity:0.5;

}

