@charset "utf-8";

/*基本設定
-------------------------------------------------------------- */

a img {border: 0;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}

.clearfix {
    zoom: 1; /* for IE7- */
}
.clearfix:after {
    content: '';
    display: block;
    clear: both;
}
strong {
	font-weight:bold;
}
img {vertical-align: bottom;}

/* リンク設定
------------------------------------------------------------*/

.op:hover {
opacity: 0.7;
}
.cl {
	clear:both;
}
.ct {
text-align: center;
}
.yu {
font-family:"游明朝","YuMincho";
font-weight: bold;
}
.yu2 {
font-family:"游明朝","YuMincho";
font-weight: normal;
}
.red {
color:#fd0000;
}
.bk {
color: #000;
}
.white {
color:#fff;
}
.up20 {
	margin-top:2rem;
}
.up30 {
	margin-top:3rem;
}
.up40 {
	margin-top:4rem;
}
.up50 {
	margin-top:5rem;
}
.up60 {
	margin-bottom:6rem;
}
.d20 {
	margin-bottom:2rem;
}
.d30 {
	margin-bottom:3rem;
}
.d40 {
	margin-bottom:4rem;
}
.d50 {
	margin-bottom:5rem;
}
.ud20 {
	margin:2rem 0;
}
.ud30 {
	margin:3rem 0;
}
.ud40 {
	margin:4rem 0;
}
.ud50 {
	margin:5rem 0;
}


/* リンク設定
------------------------------------------------------------*/
a:link {
	color:#ffae00;
	text-decoration:none;
}
a:visited {
	color:#ffae00;
	text-decoration:none;
}
a:hover {
	color:#ffce65;
	text-decoration:underline;
}
a:active {
	color:#ffae00;
	text-decoration:none;
}

a.top_serv:link {
	color:#fff;
	text-decoration:none;
}
a.top_serv:visited {
	color:#fff;
	text-decoration:none;
}
a.top_serv:hover {
	color:#fff;
	text-decoration:none;
}
a.top_serv:active {
	color:#fff;
	text-decoration:none;
}


/* 共通
------------------------------------------------------------*/

html {
font-size: 62.5%;
}
body {
font-family:"游ゴシック",YuGothic,"メイリオ","Meiryo",arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
color:#494646;
-webkit-text-size-adjust: none;
font-weight:500;
}
header {
width: 98rem;
margin: 0 auto;
overflow: hidden;
}
#logo {
float: left;
margin: 4rem 0 0 2rem;
}
nav {
float: right;
overflow: hidden;
margin-right: 2rem;
margin-top: 6rem;
}
nav li {
line-height: 1.4rem;
font-weight: bold;
border-left: 0.1rem solid #000;
color: #000;
float: left;
padding: 0 2.4rem;
}
nav li:last-child {
border-right: 0.1rem solid #000;
}
nav a:link {
color: #000;
}
nav a:visited {
color: #000;
}
footer {
background: #fed52c;
padding: 3rem 0 2rem 0;
clear: both;
margin-top: 4rem;
}
footer ul {
margin: 0 auto;
text-align: center;
font-size: 0;
}
footer ul li {
display: inline;
font-size: 1.4rem;
line-height: 1.6rem;
}
footer ul li a {
border-left: 0.1rem solid #fff;
display: inline-block;
padding: 0 2rem;
font-size: 1.4rem;
}
.ftr_last {
border-right: 0.1rem solid #fff;
}
footer ul li a:link {
color: #fff;
}
footer ul li a:visited {
color: #fff;
}
footer ul li a:hover {
text-decoration: none;
background: #fff;
color: #fed52c;
}
#hdr {
background: url(../img/back_hdr.png) no-repeat;
width: 98rem;
height: 15.6rem;
margin: 2rem auto 3rem auto;
padding: 3.4rem 0 0 2rem;
color: #595959;
}
#hdr div {
padding: 3rem 2rem 2rem 2rem;
background:  rgba(256,256,256,0.85);
border-radius: 2rem 0 2rem 0;
display: inline-block;
}
#hdr h1 {
font-size: 3.8rem;
border-bottom: 0.2rem solid #d78763;
background: url(../img/back_hdr_dia.png) no-repeat right;
padding-right: 3rem;
font-weight: bold;
}
#hdr h1 span {
font-size: 1.4rem;
margin-left: 1rem;
}
.cnt {
width: 88rem;
margin: 0 auto 5rem auto;
min-height: 60rem;
}


/* PC用
------------------------------------------------------------*/
@media only screen and (min-width: 980px) {

.spbr {
display: none !important;
}
.slicknav_menu {
display: none;
}
#menu {
display: none;
}
body{
font-size: 1.4rem;
line-height:2.6rem;
}

}

/* タブレット用
------------------------------------------------------------*/
@media only screen and (min-width: 641px) and (max-width: 979px) {

.spbr {
display: none !important;
}
.pcbr {
display: none !important;
}
.ctcnt {
width:100%;
margin: 0 auto;
padding: 0 1rem;
}
.pdd_sp {
padding: 0 2rem;
}
.sp100 {
width:100%;
height:auto;
}
#menu {
display: none;
}
body{
font-size: 1.4rem;
line-height:2.6rem;
}
header {
width: 100%;
}
#logo {
width: 21.4rem;
margin: 4rem auto 0 auto;
float: none;
}
nav {
display: none;
}
footer {
background: #fed52c;
padding: 2rem 0;
clear: both;
margin-top: 4rem;
}
footer ul {
display: none;
}
#hdr {
width: 100%;
}
.cnt {
width: 100%;
padding: 0 3rem;
}

/* 店舗案内 */
#salon img {
width: 30%;
height: auto;
}
#salon div {
width: 65% !important;
}

/* ヘアケア・美容用品 */
#item {
width: 100% !important;
}
#item article {
width: 30% !important;
margin: 0 1.6%  2rem 1.6% !important;
}
#item article img {
width: 100% !important;
height: auto !important;
}
.item_p {
padding: 0 3rem;
}

/* メニュー　*/
#main_pr {
background-position: right !important;
background-size: 26% !important;
}

}


/* スマートフォン用
------------------------------------------------------------*/
@media only screen and (max-width: 640px) {

.pcbr {
display: none !important;
}
.pdd_sp {
padding: 0 2rem;
}
.ctcnt {
width:100%;
margin: 0 auto;
padding: 0 1rem;
}
.sp100 {
width:100%;
height:auto;
}
.spt12 {
font-size: 1.2rem !important;
}
#menu {
display: none;
}
body{
	font-size: 1.4rem;
	line-height:2.0rem;
}
header {
width: 100%;
}
#logo {
width: 21.4rem;
margin: 4rem auto 0 auto;
float: none;
}
nav {
display: none;
}
footer {
background: #fed52c;
padding: 2rem 0;
clear: both;
margin-top: 4rem;
}
footer ul {
display: none;
}
#hdr {
width: 100%;
}
.cnt {
width: 100%;
padding: 0 1rem;
}
#hdr {
padding: 3.4rem 2rem 0 2rem;
}
#hdr div {
display: block;
}

/* トップページ */
#news h3 {
font-size: 1.2rem;
line-height: 1.8rem;
margin-bottom: 1rem;
}

/* メニュー */
#main_pr {
padding: 1rem 0;
}
.tb_price {
font-size: 1.2rem !important;
border-collapse: collapse;
}
.tb_price th {
border: 0.1rem solid #ddd;
}
.tb_price td {
border: 0.1rem solid #ddd;
}
.price div {
padding: 1rem 0 !important;
}

/* 採用情報 */
#rec_tb {
border-collapse: collapse;
font-size: 1.2rem !important;
}
#rec_tb th, #rec_tb td {
border: 0.1rem solid #ddd;
padding: 0.4rem!important;
}
#rec_tb th {
width: 26% !important;
}

/* 店舗案内 */
#salon img {
float: none !important;
}
#salon div {
width: 100% !important;
margin-top: 2rem;
}

/* ヘアケア・美容用品 */
.item_p {
padding: 0 2rem;
text-align: left !important;
}
#item {
width: 100% !important;
padding: 0 1rem;
justify-content: space-between;
}
#item article {
width: 48% !important;
margin: 0 0 2rem 0 !important;
padding: 0.6rem 0.6rem 1rem 0.6rem !important;
}
#item article img {
width: 100% !important;
height: auto !important;
}

}