@charset "UTF-8";

/**************************************

初期設定

**************************************/
body {
    color:#000;
    font: 16px/1.231;
    font-family: -apple-system, BlinkMacSystemFont, "Noto Sans Japanese", "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif;
    font-size: 81.25%\9;/* for IE8 */
    *font-size:small;/* for IE6&7 */
    *font:x-small;/* for IE Quirks Mode */
    margin: 0px;
    padding: 0px;
}
* html body {
    font-family:'ＭＳ Ｐゴシック','Osaka',sans-serif;
}
.clearfix {zoom:1;/*for IE 5.5-7*/}
.clearfix:after {/*for modern browser*/
    content:".";
    display: block;
    height:0px;
    clear:both;
    line-height:0;
    visibility:hidden;
}
* html .clearfix {display:inline-table; /*\*/display:block;/**/}
h1, h2, h3, h4, h5, h6,
div, p, pre, ul, ol, dl, dt, dd,
address, form, blockquote{
    padding: 0;/* margin&padding reset */
    display: block;
    margin: 0px;
    line-height:1.8;
}
h1, h2, h3, h4, h5, h6 {font-size:100%; }
table {
    margin : 0;
    empty-cells: show;
    /* IE 6以前でtableへフォントサイズの継承がうまくいかない問題を回避　*/
    font-size: inherit; 　/*for modern browser*/
    font: 100%;　 /* for IE 5-5.5､6( 後方互換モード) */
}
input, textarea, select {
    font-family:inherit;
    font-size:inherit;
    font-weight:inherit;
}
input, textarea, select {*font-size:100%;}
address, em {font-style:normal;}
hr,.areaAnchor,.anchor {display : none;}
img {
    border: none;/* img do not want a border */
    vertical-align: bottom;
}
li {list-style: none;}/* link do not want a dot */
img{max-width:100%; height: auto;}
a{color: #000; text-decoration: none;}
a:hover{text-decoration: underline;}
a:hover img{text-decoration: none;}

.single-post .post-content a{text-decoration:underline; font-weight:bold; color:#0073aa;}
.single-post .post-content a:hover{text-decoration:none;}

.txt10{font-size:10px;}
.txt12{font-size:12px;}
.txt16{font-size:16px;}
.txt18{font-size:18px;}
.txt20{font-size:20px;}
.txt22{font-size:24px;}
.txt24{font-size:24px;}
.txt26{font-size:26px;}
.txt28{font-size:28px;}
.txt30{font-size:30px;}
.txt36{font-size:36px;}
.txt-pink{color:#e5607f;}

.mb10{margin-bottom:10px;}
.mb20{margin-bottom:20px;}
.mb30{margin-bottom:30px;}
.mb40{margin-bottom:40px;}
.mb50{margin-bottom:50px;}
.mb60{margin-bottom:60px;}

.line-h24{line-height:24px;}
.line-h36{line-height:36px;}
.smp_only{display:none;}

/* ページ共通
**************************************/
.btn_link{text-align:center;}
.btn_link a{
    display:inline-block;
    background:#e5607f;
    padding:10px 40px;
    color:#FFF;
    font-size:15px;
    font-weight:bold;
    border-radius:4px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
.btn_link a:hover{background:#999; text-decoration:none;}
.link02 a{background:#333;}
.link-big a{padding:20px 40px; width:256px;}

a img:hover{
    filter:alpha(opacity=60);
    -moz-opacity: 0.6;
    opacity: 0.6;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}


.shop-info{text-align:center; position:absolute; right:300px; top:0px;}
.shop-tel{color:#e55e7e; font-size:28px; font-weight:lighter !important; line-height:1.2;}
.shop-time{font-size:12px;}

.roll{width:1000px; margin:60px auto;}
.roll h1 ,.roll h2{font-size:26px; font-weight:bold; text-align:center; margin-bottom:50px;}
.roll h1 span ,.roll h2 span{font-size:13px; font-weight:normal; display:block;}

.half-box{display:table; width:100%; margin:20px auto;}
.half-box .txt ,.half-box .photo{display:table-cell; width:50%; vertical-align:middle;}
.half-box .txt{background:#f1f1f1;}
.half-box .txt .txt-box{padding:20px 12%;}
.half-box .txt .txt-box h3{color:#e5607f; font-weight:bold;}
.half-box .txt .txt-box h3 span{ color:#000; display:block;}
.half-box .txt .txt-box p{margin-top:20px;}
.half-box .txt .txt-box h4 span{display:block;}

.list-side01{ width:1000px; zoom:1;/*for IE 5.5-7*/ font-size: 0;}
.list-side01:after {/*for modern browser*/
    content:".";
    display: block;
    height:0px;
    clear:both;
    line-height:0;
    visibility:hidden;
}
.list-side01 li{display:block; width:25%; margin-bottom:30px; vertical-align:top; display: inline-block;}
.list-side02{margin-bottom:40px; text-align:left;}
.list-side02 li{display:inline-block; box-sizing:border-box; position:relative; vertical-align:top;}

.style-cat li{text-align:center; position:relative; font-size: 16px;}
.style-voice li{width:32%; padding:20px 4%; background:#f5f5f5; min-height:340px;}
.style-voice li::before{content:url(../img/common/ico_voice.png); position:absolute; top:0; right:0;}
.style-voice li:nth-child(2){margin:0 1.4%;}
.style-info-news li{width:230px; margin-right:20px; margin-bottom:20px;}
.style-info-news li:nth-child(4n){margin-right:0;}

.bg_glay{background:#dbdbdb; border-radius:4px; padding:20px; font-size:26px; margin-bottom:30px;}
.tit-line{border-top:2px solid #000; border-bottom:2px solid #000; padding:20px 0px; font-size:24px; margin:30px 0px;}

.photo-list03 li{display:inline-block; width:320px;}
.photo-list03 li:nth-child(2){margin:0px 14px;}
.photo-list03 li img{margin-bottom:15px;}

.pagination{
    margin:20px 0px 80px;
    text-align:center;
    font-weight:bold;
    position:relative;
}
.pagination li{
    display:inline-block;
}
.pagination .next ,.pagination .prev{
    background:#dfdddd;
    border-radius:2px;
    box-shadow:0px 4px 0px #bdb8b8;
    display:block;
    width:200px;
    padding:10px 0px;
    text-align:center;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
    position:absolute;
    top:-10px;
}
.pagination .next:hover ,.pagination .prev:hover{
    box-shadow:none;
    background:#e9e9e9;
}
.pagination .next a ,.pagination .prev a{
    display:block;
    font-size:16px;
}
.pagination .prev{left:200px;}
.pagination .next{right:200px;}

.bg_lglay{background:#f5f5f5;}
.bg_lglay .inner{width:1000px; margin:0px auto; padding:40px 0px;}
.bg_lglay h2{font-size:26px; font-weight:bold; text-align:center; margin-bottom:50px;}
.bg_lglay h2 span{font-size:13px; font-weight:normal; display:block;}

.youtube {
position: relative;
width: 100%;
padding-top: 56.25%;
}
.youtube iframe{
position: absolute;
top: 0;
right: 0;
width: 100% !important;
height: 100% !important;
}


/**************************************

PCheader設定

**************************************/
header{border-bottom:1px solid #CCC;}
header .inner{width:1000px; margin:15px auto 0px; padding-bottom:20px; position:relative;}
header h1{margin-top:30px;}

#shop-lead{font-size:13px;}

.btn_reserve{position:absolute; right:0; top:0px;}
.btn_reserve{width:278px; font-weight:bold;}
.btn_reserve a{
    background:#e55e7e;
    box-shadow:0px 5px 0px #d44d6b;
    display:block;
    padding:10px 20px;
    border-radius:4px;
    color:#FFF;
    font-size:14px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}

.btn_reserve a:hover{
    box-shadow:none;
    background:#d44d6b;
}

.btn_reserve a span{
    border:1px solid #FFF;
    padding:2px 6px;
    border-radius:4px;
    font-size:11px;
    font-weight:normal;
    margin-left:10px;
}

.gl-menu{text-align:right; font-size:14px; font-weight:bold; position:absolute; bottom:20px; right:0;}
.gl-menu li{
    display:inline-block;
    padding:0px 10px;
}
.gl-menu li:after{
    content:"/";
    color:#CCC;
    margin-left:20px;
}
.gl-menu li:last-child{
    padding-right:0;
}
.gl-menu li:last-child:after{display:none;}
#bnt-mens a{color:#5385b2;}

.common-page header{border-bottom:1px solid #CCC;}

#smp_logo{width:96%; margin:10px auto;}
#smp_logo h1{width:46%; float:left; margin-top:10px;}
#smp_logo h1 img{width:165px;}
#smp_shop-lead{background:#f64077; font-size:11px; text-align:center; padding:3px 0px;}
#smp_shop-lead a{color:#FFF;}

.smp_shop-info{float:right; width:50%; text-align:right;}
.smp_shop-tel{ font-size:18px; font-weight:bold; line-height:1.2;}
.smp_shop-tel a{color:#e55e7e !important;}
.smp_shop-time{font-size:9px;}
.smp_gl-menu{
    border-top:1px solid #d2d2d2;
    text-align:center;
    font-size:8px;
    line-height:16px;
    font-weight:bold;
    display:table;
    width:100%;
}
.smp_gl-menu li{
    display:table-cell;
    vertical-align:middle;
    padding:0px;
    width:17%;
    box-sizing:border-box;
    border-right:1px solid #d2d2d2;
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 1%, #e4e4e4 99%);
    background: -webkit-linear-gradient(top, #ffffff 1%,#e4e4e4 99%);
    background: linear-gradient(to bottom, #ffffff 1%,#e4e4e4 99%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e4e4e4',GradientType=0 );
    height: 50px;
}
#bnt-mens-smp a{
    background: #5385b2;
    background: -moz-linear-gradient(top, #5385b2 1%, #305f8a 99%);
    background: -webkit-linear-gradient(top, #5385b2 1%,#305f8a 99%);
    background: linear-gradient(to bottom, #5385b2 1%,#305f8a 99%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5385b2', endColorstr='#e4e4e4',GradientType=0 );
	color:#FFF;
    height: 35px;
}
.smp_gl-menu li:nth-child(2){width:17%;}
.smp_gl-menu li:last-child{border:none;}
.smp_gl-menu li a{padding:8px 2px; display:table-cell; vertical-align:middle;}
.smp_gl-menu li span{display:table; width:100%;}

.btn-gl-menu{position:fixed; top:-150px; right:-100px; width:15%; z-index:100;}
.btn-gl-menu img:hover{opacity:1;}

/**************************************

トップページ

**************************************/
#main{
    text-align:center;
    background:#eae8ee;
    position:relative;
    min-height:300px;
    margin-bottom:40px;
}
#main h2{
    position:absolute;
    top:33%;
    text-align:center;
    width:100%;
    text-shadow:0 0 15px #333; 
}
#main .bg-main-box{width:25%; height:480px; float:left;}
#main #main01{
    background:url(../img/top/bg_main01.png) no-repeat #000;
    background-size:100%;
}
#main #main02{
    background:url(../img/top/bg_main02.png) no-repeat #000;
    background-size:100%;
}
#main #main03{
    background:url(../img/top/bg_main03.png) no-repeat #000;
    background-size:100%;
}
#main #main04{
    background:url(../img/top/bg_main04.png) no-repeat #000;
    background-size:100%;
}


.kodawari{
    margin:0px 0px;
    text-align:center;
}

.kodawari .roll-lead{
    color:#e5607f;
    font-size:18px;
    margin:20px 0px 60px;
}

.kodawari .half-box {text-align:center;}
.kodawari .half-box .photo:nth-child(even){text-align:left;}
.kodawari .half-box .photo:nth-child(odd) {text-align:right;}

/*ヘアスタイル
*******************/
.hair-style{
    color:#e5607f;
    font-size:18px;
    font-weight:bold;
    margin:15px 0px 5px;
}

/*営業時間
*******************/
#business-hours-top .half-box .photo{
    width:60%;
}
#business-hours-top .half-box .txt{
    width:40%;
}

/*メッセージ
*******************/
#message-top{margin-bottom:90px;}
#message-top .half-box .txt{
     background:#FFF;
     vertical-align:top;  
}
#message-top .half-box .txt .txt-box{padding:0;}
.message-name{text-align:right !important;}


/*スタッフ紹介
*******************/
#staff-top{text-align:center;}
#staff-top p{margin:20px 0px 15px;}
#staff-top .style-cat li{text-align:center; display:inline-block; float:none; margin-left:-5px;}
.staff-top-name{
    position:absolute;
    bottom:0px;
    left:0;
    width:90px;
    height:90px;
    background:#e5607f;
    color:#FFF;
    box-sizing:border-box;
    padding-top:15px;
    font-size:14px;
    z-index:100;
    margin:0 0 20px 0 !important;
}
.staff-top-name a {
    color:#FFF;
}

.top-page .staff-top-name{bottom:0;}



/*お客様の声
*******************/
.voice-thumb{
    color:#e5607f;
    font-size:12px;
    text-align:center;
    margin-bottom:30px;
}
.voice-thumb img{margin-bottom:10px;}

/*サロン情報
*******************/
#salondata-top .photo img{margin-bottom:20px;}
#salondata-top .txt{background:#FFF; vertical-align:top;}
#salondata-top .txt-box{background:#FFF; padding:0px 0% 0px 10%;}
#salondata-top h3{margin-bottom:20px;}
#salondata-top dl{display:table; margin-bottom:5px;}
#salondata-top dl dt ,#salondata-top dl dd{display:table-cell; vertical-align:top;}
#salondata-top dl dt{width:100px; color:#e5607f; font-weight:bold;}
#salondata-top .link-box{background:#e5e5e5; margin-top:30px; padding:20px 0px 40px;}

/*お知らせ＆コラム
*******************/
.info-column-top{margin-bottom:80px;}
.style-info-news .blog-thumb{margin-bottom:10px; width:230px; height:180px; overflow:hidden; position: relative;}
.style-info-news .blog-thumb img{
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    max-width: 140%;
    height: auto;
}


/**************************************

footer設定

**************************************/
footer .inner{width:1000px; margin:30px auto 0px;}
#pagetop{text-align:right; margin-top:200px;}
#pagetop a{
    display:inline-block;
    background:#333;
    width:70px;
    height:70px;
    border-radius:50%;
    position:relative;
    bottom:20px;
    right:10%;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
#pagetop a:before{
    content:" ";
    display:block;
    position:absolute;
    top:30px;
    left:25px;
    width:16px;
    height:16px;
    border-top:5px solid #FFF;
    border-right:5px solid #FFF;
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
}
#pagetop a:hover{text-decoration:none; background:#999;}

.f-logo{line-height:1.5; text-align:left;}

.footer-menu{background:#f5f5f5;}
.footer-menu ul{width:1000px; margin:0px auto; padding:30px 0px 50px;}
.footer-menu ul li{width:235px; height:110px; margin:20px 14px 0px 0px; display:inline-block; background:#000; font-weight:bold;}
.footer-menu ul li:nth-child(4n){margin-right:0px;}
.footer-menu ul li a{
    display:block;
    text-align:center;
    color:#FFF;
    width:235px;
    background:;
    height:110px;
    box-sizing:border-box;
    padding-top:45px;
    background: rgba(0,0,0,0.7);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
.footer-menu ul li a:hover{
    text-decoration:none;
    background: rgba(0,0,0,0.3);
}

.footer-menu ul li#fm-top{background:url(../img/common/btn-f01.jpg) no-repeat #000;}
.footer-menu ul li#fm-menu{background:url(../img/common/btn-f02.jpg) no-repeat #000;}
.footer-menu ul li#fm-style{background:url(../img/common/btn-f03.jpg) no-repeat #000;}
.footer-menu ul li#fm-data{background:url(../img/common/btn-f04.jpg) no-repeat #000;}
.footer-menu ul li#fm-concept{background:url(../img/common/btn-f05.jpg) no-repeat #000;}
.footer-menu ul li#fm-news{background:url(../img/common/btn-f06.jpg) no-repeat #000;}
.footer-menu ul li#fm-be-af{background:url(../img/common/btn-f07.jpg) no-repeat #000;}
.footer-menu ul li#fm-staff{background:url(../img/common/btn-f08.jpg) no-repeat #000;}
.footer-menu ul li#fm-voice{background:url(../img/common/btn-f09.jpg) no-repeat #000;}
.footer-menu ul li#fm-access{background:url(../img/common/btn-f10.jpg) no-repeat #000;}
.footer-menu ul li#fm-column{background:url(../img/common/btn-f11.jpg) no-repeat #000;}
.footer-menu ul li#fm-recruit{background:url(../img/common/btn-f12.jpg) no-repeat #000;}


.footer-btn{
    width:1000px;
    height:140px;
    margin:40px auto;
}
.footer-btn .btn-mens ,.footer-btn .btn-sns{
    display:inline-block;
    vertical-align:middle;
    width:490px;    
}
.footer-btn .btn-mens{
    padding:18px 0px;
    background:url(../img/common/btn_mens-bg01.png) top left no-repeat,
    url(../img/common/btn_mens-bg02.png) top right no-repeat #d1d1d1;
}
.footer-btn .btn-mens a{
    background:#5b86b0;
    border-radius:0;
    width:250px;
    padding:30px 0px;
    font-size:24px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
.footer-btn .btn-mens a:hover{background:#999;}

.footer-btn .btn-sns{
    margin-left:12px;
    padding:38px 20px;
    border:10px solid #d1d1d1;
    box-sizing:border-box;
    text-align:center;
}
.footer-btn .btn-sns p ,.footer-btn .btn-sns ul,.footer-btn .btn-sns li{
    display:inline-block;
    vertical-align:middle;
}
.footer-btn .btn-sns ul li{width:46px; margin-left:10px;}

.footer-info{background:#313131; color:#FFF; padding:40px 0px;}
.footer-info .inner{position:relative; width:1000px; margin:10px auto;}
.footer-info .shop-tel{color:#FFF;}
.footer-info .btn_reserve a{
    background:#FFF; box-shadow:none; color:#e5607f;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
.footer-info .btn_reserve a:hover{background:#e5607f; color:#FFF;}
.footer-info .btn_reserve a span{border:1px solid #e5607f;}
.footer-info .f-side-list{margin-top:100px;}
.footer-info .f-side-box{display:inline-block; vertical-align:top;}
.footer-info .f-side-box:nth-child(1){width:32%;}
.footer-info .f-side-box:nth-child(2){width:44%; margin-right:20px;}
.footer-info .f-side-box:nth-child(3){width:20%;}
.f-side-box dl{display:table; margin-bottom:10px; text-align:left;}
.f-side-box dl dt ,#salondata-top dl dd{display:table-cell; vertical-align:top;}
.f-side-box dl dt{width:100px; color:#e5607f; font-weight:bold;}

.footer-copy{background:#000; color:#FFF; padding:20px 0px;}
.footer-copy .clearfix{width:1000px; margin:0 auto;}
.footer-copy .f-left{float:left;}
.footer-copy .f-right{float:right;}
.smp_reserve{background:#f5f5f5; padding:10px; text-align:center; position:fixed; z-index:100; bottom:0; width:100%; box-sizing:border-box;}
.smp_reserve .reserve-lead{font-size:14px; font-weight:bold; margin:0;}
.smp_reserve a{display:block; padding:10px; font-size:10px; border-radius:2px;}
.smp_reserve-tel ,.smp_reserve-web{display:inline-block; vertical-align:top; width:47%; margin:0 1%;}
.smp_reserve-tel a{background:#FFF; box-shadow:0px 5px 0px #dedede; color:#f64077;}
.smp_reserve-web a{background:#f64077; box-shadow:0px 5px 0px #e42962; color:#fff;}



@media screen and (max-width:768px){
.txt10{font-size:10px;}
.txt12{font-size:12px;}
.txt16{font-size:16px;}
.txt18{font-size:16px;}
.txt20{font-size:18px;}
.txt22{font-size:20px;}
.txt24{font-size:20px;}
.txt26{font-size:20px; line-height:26px;}
.txt28{font-size:20px; line-height:26px;}
.txt30{font-size:20px; line-height:26px;}
.txt36{font-size:30px;}


body{
    font-size: 14px;
    line-height:1.6;
}

.smp_only{display:block;}

/* ページ共通
**************************************/
#wrap{padding-bottom:30px; }

.roll{width:92%; margin:30px auto;}
.roll p{text-align:left;}
.roll h1, .roll h2 {margin-bottom: 30px;}

.half-box{display:block; width:100%; margin:20px auto;}
.half-box .txt ,.half-box .photo{display:block; width:100%; text-align:center;}
.half-box .photo iframe{width:100%;}
.half-box .txt{background:#f1f1f1;}
.half-box .txt .txt-box{padding:20px 6% 40px;}
.half-box .txt .txt-box h3{color:#e5607f; font-weight:bold;}
.half-box .txt .txt-box h3 span{ color:#000; display:block;}
.half-box .txt .txt-box p{margin-top:10px; text-align:left;}

.list-side01{ width:100%; margin:30px auto 10px; zoom:1;/*for IE 5.5-7*/}
.list-side01:after {/*for modern browser*/
    content:".";
    display: block;
    height:0px;
    clear:both;
    line-height:0;
    visibility:hidden;
}
.list-side01 li{width:50%; font-weight:bold; float:none; display:inline-block;}
.list-side02{margin-bottom:10px; text-align:left;}
.list-side02 li{display:inline-block; box-sizing:border-box; position:relative; vertical-align:top;}

.style-cat li{text-align:center;}
.style-voice li{width:100%; padding:20px 4%; margin-bottom:20px; background:#f5f5f5; min-height:100px; }
.style-voice li a{display:flex;}
.style-voice li::before{content:url(../img/common/ico_voice_smp.png); position:absolute; top:0; right:0;}
.style-voice li:nth-child(2){margin:0px 0px 20px 0px;}
.style-info-news li{width:100%; margin-left:0px;}
.style-info-news li:nth-child(1){margin-left:0;}

.bg_glay{ border-radius:2px; padding:5px 10px; font-size:18px; margin-bottom:20px;}
.tit-line{border-top:1px solid #000; border-bottom:1px solid #000; padding:10px 0px; font-size:18px; margin:30px 0px;}

.photo-list03 li{display:block; width:100%; margin-bottom:30px;}
.photo-list03 li:nth-child(2){margin:0px 0px 30px 0px;}
.photo-list03 li img{margin:0px auto 15px;}

.pagination{
    margin:20px 0px 80px;
}
.pagination .next ,.pagination .prev{
    box-shadow:0px 2px 0px #bdb8b8;
    display:inline-block;
    width:auto;
    padding:5px 15px;
    top:-10px;
}
.pagination .prev{left:0px;}
.pagination .next{right:0px;}

.bg_lglay{background:#FFF;}
.bg_lglay .inner{width:92%; margin:0px auto; padding:40px 0px 20px;}
.bg_lglay h2{margin-bottom:30px !important; width:100% !important;}


.common-page header{border-bottom:1px solid #CCC;}

.btn_link{text-align:center !important;}
.btn_link a{ font-size:12px;}
.btn_link a:hover{background:#999; text-decoration:none;}
.link-big a{padding:10px 20px; }



/**************************************

トップページ

**************************************/
#main{
    text-align:center;
    margin-bottom:30px;
    padding-top:0px;
    height:auto;
}

#main{
    min-height:200px;
    margin-bottom:20px;
}
#main h2{
    top: 39%;
}
#main h2 img{
    width: 90%;
}
#main .bg-main-box{width:50%; height:50%;}
#main #main01{
    background:url(../img/top/bg_main01.png) no-repeat 10% 30% #000;
    background-size: 100%;
}
#main #main02{
    background:url(../img/top/bg_main02.png) no-repeat 10% 20%  #000;
    background-size: 100%;
}
#main #main03{
    background:url(../img/top/bg_main03.png) no-repeat 10% 30%  #000;
    background-size: 100%;
}
#main #main04{
    background:url(../img/top/bg_main04.png) no-repeat 10% 10%  #000;
    background-size: 100%;
}

.kodawari{margin:0px 0px; text-align:center;}
.kodawari h2{width:58%; margin:0 auto;}
.kodawari .roll-lead{ margin:10px 0px 20px;  font-weight:bold;}

.kodawari .half-box {text-align:center; display:flex; flex-flow: column nowrap;}
.kodawari .half-box .photo{order: 1;}
.kodawari .half-box .txt{order: 2;}

.kodawari .half-box .photo:nth-child(even){text-align:center;}
.kodawari .half-box .photo:nth-child(odd) {text-align:center;}

/*ビフォーアフター
*******************/
#beforeafter-top .half-box{width:100%; margin:0 auto;}

/*ヘアスタイル
*******************/
.hair-style{
    color:#e5607f;
    font-size:18px;
    font-weight:bold;
    margin:15px 0px 5px;
}

/*営業時間
*******************/
#business-hours-top .half-box{text-align:center; display:flex; flex-flow: column nowrap;}
#business-hours-top .half-box .photo{width:100%; order:2;}
#business-hours-top .half-box .txt{width:100%; order:1;}

/*メッセージ
*******************/
#message-top .half-box{text-align:center; display:flex; flex-flow: column nowrap; width:100%; margin:0 auto}
#message-top{margin-bottom:90px;}
#message-top .half-box .txt h3{line-height:30px; letter-spacing:-3px; margin-top:20px; font-size:21px; text-align:left;}
#message-top .half-box .txt .txt-box{padding:0;}
.message-name img{width:164px;}
#message-top .photo{background:#dfe1e7;}
#message-top .photo img{width:60%;}

/*スタッフ紹介
*******************/
#staff-top{text-align:center;}
#staff-top p{margin:0px; text-align:left;}
#staff-top h3{width:80%; letter-spacing:-3px; margin:0px auto 20px; line-height:36px;}
#staff-top .list-side01 li{width:100%; background:#dcdce6; margin:0; position:relative;}
#staff-top .list-side01 li p{text-align:center;}
#staff-top .list-side01 li p img{margin:0 auto; width:70%;}
.staff-top-name{
    position:absolute;
    top:0;
    left:0;
    width:100px;
    height:100px;
    background:#e5607f;
    color:#FFF;
    box-sizing:border-box;
    padding-top:25px;
}

/*お客様の声
*******************/
.voice-thumb{
    color:#e5607f;
    font-size:12px;
    text-align:center !important;
    margin:0px auto 30px;
}
.voice-thumb img{margin-bottom:10px;}

#p360-top{width:100%;}
#p360-top p{text-align:left;}
.p360cap{width:92%; margin:0 auto;}

/*サロン情報
*******************/
#salondata-top .photo img{margin-bottom:20px;}
#salondata-top .txt{background:#FFF; vertical-align:top;}
#salondata-top .txt-box{background:#FFF; padding:0px 0% 0px 0%;}
#salondata-top h3{margin-bottom:20px;}
#salondata-top dl{display:table; margin-bottom:5px; text-align:left;}
#salondata-top dl dt ,#salondata-top dl dd{display:table-cell; vertical-align:top;}
#salondata-top dl dt{width:100px; color:#e5607f; font-weight:bold;}
#salondata-top .link-box{background:#FFF; margin-top:0px; padding:20px 0px 40px;}
#salondata-top .link-box p{display:inline-block; width:48%;}
#salondata-top .link-box p:nth-child(2){margin-left:2%;}
#salondata-top .link-box p a{width:100%; box-sizing:border-box; color:#FFF; text-decoration:none; font-size:12px; padding:10px 5px;}
#salondata-top h3{text-align:center; font-size:20px;}
#salondata-top a{text-decoration:underline; color:#e5607f;}

/*お知らせ＆コラム
*******************/
.info-column-top{margin-bottom:40px;}
.blog-content{margin:0px;}

.style-info-news .blog-thumb{margin-bottom:10px; width:100px; height:80px; overflow:hidden; }
.style-info-news .blog-thumb img{max-width:180px; margin:0% 0% 0% -25%;}

.style-info-news li{display:table; border-top:1px solid #d2d2d2; padding:20px 0px 10px;}
.style-info-news li:last-child{border-bottom:1px solid #d2d2d2; margin-bottom:30px;}
.blog-left ,.blog-right{display:table-cell; vertical-align:top;}
.blog-right{padding-left:20px;}

/**************************************

footer設定

**************************************/
footer .inner{width:100%; margin:30px auto 0px;}

.f-logo{text-align:center;}
.f-logo span.txt30{line-height:1.5; font-size:22px !important;}

.footer-menu{background:#f5f5f5; padding-top:10px;}
.footer-menu ul{width:92%; margin:0px auto; padding:0px 0px 40px;}
.footer-menu ul li{width:48%; height:55px; margin:10px 2% 0px 0px; vertical-align:top; background-size:100% !important;}
.footer-menu ul li:nth-child(2n){margin-right:0px;}
.footer-menu ul li a{width:100%; height:55px; padding-top:15px;}

.footer-btn{width:92%; height:auto; margin:20px auto;}
.footer-btn .btn-mens ,.footer-btn .btn-sns{
    display:inline-block;
    vertical-align:middle;
    width:100%;    
}
.footer-btn .btn-mens{
    padding:18px 0px;
    background:url(../img/common/btn_mens-bg01.png) bottom left no-repeat,
    url(../img/common/btn_mens-bg02.png) bottom right no-repeat #d1d1d1;
    background-size:contain;
}
.footer-btn .btn-mens a{width:50%; padding:20px 0px; font-size:14px;}
.footer-btn .btn-sns{margin-left:0; padding:38px 20px 28px; border:none;}

.footer-btn .btn-sns p ,.footer-btn .btn-sns ul,.footer-btn .btn-sns li{
    display:inline-block;
    vertical-align:middle;
}
.footer-btn .btn-sns ul li{width:46px; margin-left:10px;}

.footer-info{background:#313131; color:#FFF; padding:10px 0px;}
.footer-info .inner{position:relative; width:100%; margin:10px auto;}
.footer-info .shop-tel{color:#FFF;}

.footer-info .shop-info{position:relative; right:0;}
.footer-info .shop-info a{color:#FFF;}
.footer-info .btn_reserve{position:relative; margin:20px auto; width:84%;}
.footer-info .btn_reserve a{padding:8px 0px 5px; border-radius:2px; text-align:center; font-size:18px; line-height:20px;}
.footer-info .btn_reserve a span{border:none; display:block; padding:0; margin:0;}

.footer-info .f-side-list{margin-top:40px;}
.footer-info .f-side-box{display:block; vertical-align:top;}
.footer-info .f-side-box dt ,.footer-info .f-side-box dd{text-align:left;}
.footer-info .f-side-box:nth-child(1){width:92%; margin:0 auto;}
.footer-info .f-side-box a{color:#FFF;}
.footer-info .f-side-box:nth-child(2){width:92%; margin:0 auto;}
.footer-info .f-side-box:nth-child(3){width:92%; margin:0 auto;}

.f-side-map{text-align:center; padding-top:10px;}
.f-side-map a{color:#f64077 !important;}

.footer-copy{text-align:center; color:#bdbdbd; padding-bottom:100px;}
.footer-copy .clearfix{width:100%; margin:0 auto;}
.footer-copy .f-left{float:none;}
.footer-copy .f-right{float:none;}


}

@media screen and (min-width:767px) and (max-width:1023px){
#main {height: 520px;}
#main h2 {
    font-size: 50px;
    line-height: 1.4;
}
#main .bg-main-box{height:260px;}
#staff-list li{width:50% !important; float:left !important;}
.list-side01 li{width:25%;}
.photo-list03 li{width:31%; display:inline-block;}
.photo-list03 li:nth-child(2){margin:0 2.6%;}
}

@media screen and (min-width:1024px) and (max-width:1199px){

#main {height: 360px;}
#main .bg-main-box{height:360px;}
}