/* CSS Document */


html,body{
	font-size:78%;
	text-align:left;
	color:#fff;
	line-height:200%;	
	padding:-1px;
	margin: 0px;
	height:100%;
	min-width:980px;

	 -webkit-text-size-adjust: none;

}

/*--------- LOADING ANIMATION --------------------------------*/
.spinner {
  margin: 20px auto 0;
  width: 70px;
  text-align: center;
}

.spinner > div {
  width: 18px;
  height: 18px;
  background-color: #333;

  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0) }
  40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
  0%, 80%, 100% { 
    -webkit-transform: scale(0);
    transform: scale(0);
  } 40% { 
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}

/*--------- LOAD --------------------------------*/

#loader-bg {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background:#fafaf0;
  z-index: 1;
}
#loader {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 200px;
  margin-top: -100px;
  margin-left: -100px;
  text-align: center;
  color: #fff;
  z-index: 2;
}




/*--------- MAIN --------------------------------*/

.back_line{
	background:url(../img/2016/back_line.jpg) center top repeat-x;
	height:1020px;
}	

.back_line_s{
	background:url(../img/2016/back_line_s.jpg) center top repeat-x;
	height:1020px;
}	

.back_header{
	background:url(../img/2016/header_back.png) center top no-repeat;
	min-height:180px	
}

.back_topics{
	background:url(../img/2016/img_topics.jpg)  center top no-repeat;
	min-height:650px;
}

.header_logo{
	text-align:center;
	padding:50px 0px 0px;	
}

.main_width{
	width:980px;
	margin:0px auto;	
	
}

.main_white{
	background:#fff;
	width:880px;
	margin:10px auto 20px;
	padding:50px;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
	
}


.header_text{
	text-align:center;
	font-size:50px;
	line-height:1.3em;
	color:#72151A;
	letter-spacing:0.03em;
	font-family: 'Lobster Two', cursive;
	padding:200px 0px 0px 0px;
}


/*--------- NAV --------------------------------*/

.nav{
	width:980px;
	display:-webkit-inline-flex;/*--- Androidブラウザ用 ---*/
    display:-ms-inline-flex;/*--- IE10 ---*/
    display:-webkit-inline-flex;/*--- safari（PC）用 ---*/
  	display:inline-flex;
	flex-direction: space-between;
   	-webkit-justify-content: space-between; /* Safari */
  	justify-content:         space-between;	
	list-style-type: none;  
	padding:30px 0px; 	
}


.nav li{
	
}

.nav li .btn{
	width:150px;
	padding:5px 30px;
	font-size:16px;
	color:#771C1D;
	text-align:center;
	font-family: 'Merriweather', serif;
	font-weight:lighter;
	letter-spacing:0.2em;
	text-decoration:none;
		border-radius: 3px;        /* CSS3草案 */  
    -webkit-border-radius: 3px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 3px;   /* Firefox用 */
	transition: all .3s;
}


.nav li .btn:hover{
	width:150px;
	background:#C3F9CB;
	font-size:16px;
	color:#fff;
	text-align:center;
	font-weight:lighter;
	text-decoration:none;
}



/*--------- INDEX SHOP information --------------------------------*/

.index_shop{
	background:#fff;
	width:880px;
	margin:10px auto 20px;
	padding:50px;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
	
	display:-webkit-inline-flex;/*--- Androidブラウザ用 ---*/
    display:-ms-inline-flex;/*--- IE10 ---*/
    display:-webkit-inline-flex;/*--- safari（PC）用 ---*/
  	display:inline-flex;
	flex-direction: space-between;
   	-webkit-justify-content: space-between; /* Safari */
  	justify-content:         space-between;	
}

.index_shop .logo{
	width:180px;
	padding:25px 0px 0px;
	border-right:1px solid #444;	
	text-align:center;	
	line-height:1em;
}

.index_book_btn{
	display: inline-block;
	width:80px;
	padding:2px;
	background:#76080A;
	border-radius: 3px;        /* CSS3草案 */  
    -webkit-border-radius: 3px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 3px;   /* Firefox用 */
	margin:3px auto 0px;	
	transition: all .3s;
}

.index_book_btn:hover{
	background:#CA2B2D;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
	margin:3px auto 0px;	
}


.index_shop .text{
	width:630px;
	font-size:14px;
	color:#444;
	line-height:1.8em;
	letter-spacing:0.1em;

}

.index_shop .text a{
	font-size:14px;
	color:#444;
	text-decoration:none;
}


.index_shop .text a:hover{
	font-size:14px;
	color:#800E10;
	text-decoration:underline;
}


/*--------- INDEX SNS information --------------------------------*/

.index_link_btn{
	background:#fff;
	width:980px;
	margin:20px auto;
	display:-webkit-inline-flex;/*--- Androidブラウザ用 ---*/
    display:-ms-inline-flex;/*--- IE10 ---*/
    display:-webkit-inline-flex;/*--- safari（PC）用 ---*/
  	display:inline-flex;
	flex-direction: space-between;
   	-webkit-justify-content: space-between; /* Safari */
  	justify-content:         space-between;	
}


.index_link_btn .btn{
	display:inline-block;
	width:230px;
	line-height:1em;
	text-align:center;
	padding:15px 0px;
	background:#fff;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
	margin:0px auto 0px;
	border:solid 1px #444;	
	transition: all .3s;
}


.index_link_btn .btn:hover{
	display:inline-block;
	background:#fafaf0;
	border-radius: 30px;        /* CSS3草案 */  
    -webkit-border-radius: 30px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 30px;   /* Firefox用 */
	margin:0px auto 0px;
	border:solid 1px #444;	
}


/*--------- INDEX PH --------------------------------*/


.index_ph ul{
	width:980px;
	padding:40px 0px 0px 0px;
	list-style-type: none;  
  	margin: 0;  
}


.index_ph ul li{
	width:300px;
	list-style-type: none;  
  	padding: 0px 40px 40px 0px;  	
	float:left;
}


.index_ph ul li:nth-child(3n){
	width:300px;
	list-style-type: none;  
  	padding: 0px 0px 40px 0px;  	
	float:right;
}


/*--------- FOOTER --------------------------------*/


.footer{
	background:#F8F7F0;
	padding:50px 0px;
	margin:50px 0px 0px;
	font-size:12px;
	color:#444;
	text-align:center;
	letter-spacing:0.25em;	
}



/*--------- CONTENTS --------------------------------*/


.cont_title{
	text-align:center;
	padding:20px 0px;	
	
}



/*--------- CONTENTS MENU --------------------------------*/


.line-last {
	line-height:1.8em;
	letter-spacing:0.1em;
	/*border-top: 1px dotted #aaa; */
	border-bottom: 1px dotted #aaa;

}

.menu_coution{
	width:880px;
	font-size:10px;
	text-align:left;
	color:#444;
	line-height:1.8em;	
}



.menu_list_style{
	background:#fff;
	width:880px;
	margin:20px auto;
	display:-webkit-inline-flex;/*--- Androidブラウザ用 ---*/
    display:-ms-inline-flex;/*--- IE10 ---*/
    display:-webkit-inline-flex;/*--- safari（PC）用 ---*/
  	display:inline-flex;
	flex-direction: space-between;
   	-webkit-justify-content: space-between; /* Safari */
  	justify-content:         space-between;	
}


dl#menu_list_s dl,dt,dd {
	margin: 0;
	padding: 0;
}

dl#menu_list_s dl {
	width: 400px;
}

.menu_genre{
	font-size:18px;
	color:#444;
	text-align:center;
	padding:20px 0px 10px;	
	line-height:1.8em;
	letter-spacing:0.1em;
	font-weight:bold;
}

dl#menu_list_s dt,dd {
	padding: 0px;
}

dl#menu_list_s dt {
	/* border-top: 1px dotted #aaa; */
	clear: left;
	float: left;
	width: 200px;
	font-size:14px;
	text-align:center;
	padding:30px 0px; 
	line-height:1.8em;
	letter-spacing:0.1em;
	color:#444;
}


dl#menu_list_s dd {
	/* border-top: 1px dotted #aaa; */
	margin-left: 200px;
	width:200px;
	font-size:14px;
	text-align:center;
	color:#444;
	line-height:1.8em;
	letter-spacing:0.1em;
	padding:30px 0px ;

}






/*--------- CONTENTS RECRUIT --------------------------------*/

dl#recruit_list dl,dt,dd {
	
	margin: 0;
	padding: 0;
}

dl#recruit_list dl {
	width: 880px;
	
}

dl#recruit_list dt,dd {
	padding: 3px;
}


dl#recruit_list dt {
	border-top: 1px dotted #aaa;
	clear: left;
	float: left;
	width: 250px;
	font-size:14px;
	text-align:center;
	padding:30px 0px; 
	line-height:1.8em;
	letter-spacing:0.1em;
	color:#444;
}


dl#recruit_list dd {
	border-top: 1px dotted #aaa;
	margin-left: 250px;
	font-size:14px;
	text-align:left;
	color:#444;
	line-height:1.8em;
	letter-spacing:0.1em;
	padding:30px 0px ;

}


/*--------- CONTENTS STYLIST --------------------------------*/

.stylist_shop{
	width:880px;
	text-align:left;
	padding:0px 0px 0px;
	font-size:12px;
	color:#444;	
	line-height:1.8em;
}

.stylist_ph ul{
	width:880px;
	padding:40px 0px 50px;
	list-style-type: none;  
  	margin: 0;  
}


.stylist_ph ul li{
	width:260px;
	list-style-type: none;  
  	padding: 0px 50px 50px 0px;  	
	float:left;
	text-align:center;
	font-size:14px;
	line-height:1.8em;
	color:#444;

}


.stylist_ph ul li:nth-child(3n){
	width:260px;
	list-style-type: none;  
  	padding: 0px 0px 50px 0px;  	
	float:right;
	text-align:center;
	font-size:14px;
	line-height:1.8em;
	color:#444;
	
}


.stylist_ph ul li p{
	text-align:center;
	font-size:10px;
	line-height:1.8em;
	color:#444;
}

.stylist_icon{
	width:260px;	
	text-align:center;
}


.stylist_icon img{
	width:18px;
	height:auto;
	padding:10px;
	
}


.stylist_icon_no{
	opacity: 0.1;	
}




/* Froat Reset */
/* -------------------------------------------------------------------------- */

/*clear float*/
.clearfloat {
	height:1px;
	font-size:1%;
	clear:both;
	display:block;
	background: transparent;
}

/*clear float*/
#clearfloat {
	height:1px;
	font-size:1%;
	clear:both;
	display:block;
	background: transparent;
}

#float_clear{
	both:clear;
	width:875px;
	height:0px;
}

.clearfix:after{
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix{ display: inline-block;}

/* hides from IE-mac \*/
* html .clearfix{ height: 1%;}
.clearfix{ display: block;}
/* End hide from IE-mac */


.alt{position:absolute;top:-5000px;left:-999px;}
/*MAC IE5.xだけに適用*/
#if expr="$HTTP_USER_AGENT = /MSIE 5.*Mac/" .alt,#index .xalt{display:none;}#endif