/* base

===============================================================*/

h1,h2,h3,h4,h5,h6,p,pre,blockquote,ul,ol,dl,dd,tr {

	font-size: 14px;

	line-height: 24px;

}



body {

	color:#454545;

	background-color:#ffffff;

	min-width:1170px;

	font-family:'Noto Sans Japanese', "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, Verdana, "ＭＳ Ｐゴシック", "MS P Gothic", san-serif;

	letter-spacing: 1px;

}



@font-face {

    font-family: 'Noto Sans Japanese';

    font-style: normal;

    font-weight: 300;

    src: url('../font/NotoSansCJKjp-DemiLight.eot');

    src: url('../font/NotoSansCJKjp-DemiLight.eot?#iefix') format('embedded-opentype'),

    url('../font/NotoSansCJKjp-DemiLight.woff') format('woff'),

    url('../font/NotoSansCJKjp-DemiLight.ttf')  format('truetype');

}



.wf-mincho{ font-family: 'Noto Serif JP', serif; }



.wf-title { font-family: 'Petit Formal Script', cursive; }









/* font

===============================================================*/

a {

	color:#454545;

	text-decoration:none;

}



a:visited {

	color:#454545;

	text-decoration:none;

}



a:hover {

	color:#454545;

	text-decoration: underline;

}



a:active {

	color:#454545;

	text-decoration: underline;

}









/* HeaderBox

=====*/

#HeaderBox{

	position: fixed;

	width: 100%;

	z-index:100;

	background-color: #ffffff;

}



#HeaderBox .HeaderBoxInner{

	width: 1085px;

	height: 114px;

	margin: 0 auto;

	position: relative;

}



#HeaderBox .HeaderBoxInner h1 a{

	display: block;

	text-indent: -9999px;

	background: url(/images/common/header_logo.png) no-repeat 0 0;

	width: 148px;

	height: 55px;

	position: absolute;

	top: 34px;

}



#HeaderBox .HeaderBoxInner .rightBox{ float: right; margin-top: 17px; }

/*-- ナビゲーション --*/

#HeaderBox .HeaderBoxInner .rightBox ul.navi{ position: absolute; right: 238px; bottom: 0; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li{ float: left; margin-left: 26px; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li.menu04{ margin-left: 20px; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li:first-child{ margin-left: 0; }









#HeaderBox .HeaderBoxInner .rightBox ul li ul.child_ul {

	display:none;

	width: 276px;

	z-index: 10;

	position: absolute;

	background:rgba(255,255,255,0.95);

	padding: 10px 12px;



}



#HeaderBox .HeaderBoxInner .rightBox ul li ul.child_ul li {

    float: none;

	font-size:14px;

	margin-left: 0;

}



#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li a {

	display:block;

	height: 38px;

	text-indent: -9999px;

	border-bottom: #f2f1f1 1px solid;

}

#HeaderBox .HeaderBoxInner .rightBox ul li ul.child_ul li a:hover {

	text-decoration:none;

}



#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li:last-child a {

	border-bottom: none;

}



#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub01 a{ background: url(/images/common/nav_03_1_n.png) no-repeat 0 center; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub02 a{ background: url(/images/common/nav_03_2_n.png) no-repeat 0 center; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub03 a{ background: url(/images/common/nav_03_3_n.png) no-repeat 0 center; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub04 a{ background: url(/images/common/nav_03_4_n.png) no-repeat 0 center; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub05 a{ background: url(/images/common/nav_03_5_n.png) no-repeat 0 center; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub06 a{ background: url(/images/common/nav_03_6_n.png) no-repeat 0 center; }



#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub01 a:hover{ background: url(/images/common/nav_03_1_o.png) no-repeat 0 center; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub02 a:hover{ background: url(/images/common/nav_03_2_o.png) no-repeat 0 center; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub03 a:hover{ background: url(/images/common/nav_03_3_o.png) no-repeat 0 center; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub04 a:hover{ background: url(/images/common/nav_03_4_o.png) no-repeat 0 center; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub05 a:hover{ background: url(/images/common/nav_03_5_o.png) no-repeat 0 center; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub06 a:hover{ background: url(/images/common/nav_03_6_o.png) no-repeat 0 center; }







#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub02_2 a{ background: url(/images/common/nav_03_7_n.png) no-repeat 0 center; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub03_2 a{ background: url(/images/common/nav_03_8_n.png) no-repeat 0 center; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub04_2 a{ background: url(/images/common/nav_03_9_n.png) no-repeat 0 center; }



#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub02_2 a:hover{ background: url(/images/common/nav_03_7_o.png) no-repeat 0 center; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub03_2 a:hover{ background: url(/images/common/nav_03_8_o.png) no-repeat 0 center; }

#HeaderBox .HeaderBoxInner .rightBox ul.navi li ul.child_ul li.sub04_2 a:hover{ background: url(/images/common/nav_03_9_o.png) no-repeat 0 center; }









/*-- 電話番号 --*/



#HeaderBox .HeaderBoxInner .rightBox .tel{

	position: absolute;

	right: 0;

	bottom: 23px;

	background: url(/images/common/header_line.gif) no-repeat 0 center;

	padding: 1px 0 1px 32px;

}





#HeaderBox .HeaderBoxInner .rightBox .tel a{

	float: right;

	display: block;

	text-indent: -9999px;

	background: url(/images/common/header_tel.png) no-repeat 0 0;

	width: 163px;

	height: 18px;

}







#HeaderBoxFixed{

	position: fixed;

	width :100%;

	z-index: 10;

	top: 0;

	background-color: #ffffff;

}



#HeaderBoxFixed .HeaderBoxInner{

	width: 980px;

	height: 100px;

	margin: 0 auto;

	position: relative;

}





#HeaderBoxFixed .HeaderBoxInner h1 a{

	display: block;

	text-indent: -9999px;

	background: url(/images/common/fixed/header_logo.png) no-repeat 0 0;

	width: 126px;

	height: 61px;

	position: absolute;

	top: 18px;

}



#HeaderBoxFixed .HeaderBoxInner .rightBox{

	float: right;

	margin-top: 18px;

}



#HeaderBoxFixed .HeaderBoxInner .rightBox .tel{

	float: right;

	display: block;

	text-indent: -9999px;

	background: url(/images/common/fixed/header_tel.png) no-repeat 0 0;

	width: 170px;

	height: 18px;

	margin-top: 8px;

}



#HeaderBoxFixed .HeaderBoxInner .rightBox .contact{

	float: right;

	margin-left: 15px;

}



#HeaderBoxFixed .HeaderBoxInner .rightBox .contact a{

	display: block;

	width: 173px;

	height: 30px;

}





#HeaderBoxFixed .HeaderBoxInner .rightBox ul{

	position: absolute;

	right: 0;

	bottom: 0;

}



#HeaderBoxFixed .HeaderBoxInner .rightBox ul li{

	float: left;

	margin-left: 26px;

}



#HeaderBoxFixed .HeaderBoxInner .rightBox ul li.menu03{

	margin-left: 20px;

}



#HeaderBoxFixed .HeaderBoxInner .rightBox ul li:first-child{

	margin-left: 0;

}









.ContentsHeader {

	margin:0 auto ;

	width:100%;

	min-width:1020px;

	overflow:hidden;

	position:relative;

	height: 210px;

}

.ContentsHeader img {

	width:100%;

	min-width:1020px;

	margin:0 auto;

	height:auto;

	position:absolute;

	left:0;

	top:0;

}



.ContentsHeader .tit{

	position: relative;

    width: 980px;

	height: 210px;

    margin: 0 auto;

	text-indent:-9999px;

}





.panBox{

	width: 980px;

	margin: 0 auto 0 auto;

	margin-top: -10px;

}



.panBox ul li{

	float: left;

	font-size: 12px;

}

.panBox ul li.arrow{

	padding-right: 15px;

	margin-right: 15px;

	background: url(/images/common/pan_arrow.png) no-repeat right 12px;

}



.panBox ul li a{ text-decoration: underline; font-size: 12px; }

























#contentsBox{ width: 980px; margin: 0 auto 0 auto; }



.ContentsWrapper{ padding-top:114px; margin-bottom: 90px; }























/* お問い合わせ

========================================================================================================================*/



.contactBox{

	position: relative;

	width: 980px;

	height: 124px;

	background: url(/images/common/contactbox_bg.png) no-repeat 0 0;

	margin: 0 auto;

	clear: both;

}

.contactBox p{ float: left; }

.contactBox p.con01{

	background: url(/images/common/contactbox_tit01.png) no-repeat 0 0;

	position: absolute;

	top: 45px;

	left: 40px;

	padding-top: 26px;

	text-align: center;

	width: 278px;

}

.contactBox p.con02{

	background: url(/images/common/contactbox_tit02.png) no-repeat 0 0;

	position: relative;

	top: 33px;

	left: 390px;

	padding-top: 40px;

	font-size: 12px;

	text-align: center;

	width: 299px;

}





.contactBox p.con02 a{

	text-decoration: none;

	position: absolute;

	width: 300px;

	height: 35px;

	top: 0;

	left: 0;

}







.contactBox p.con03{

	background: url(/images/common/contactbox_qr.png) no-repeat 0 0;

	position: absolute;

	top: 20px;

	right: 180px;

	width: 84px;

	height: 85px;

	text-indent: -9999px;

}

.contactBox p.con04{

	position: absolute;

	top: 33px;

	right: 41px;

	font-size: 12px;

	text-align: center;

	letter-spacing: 0.05em;

}

.contactBox p.con04 a{

	display: block;

	width: 119px;

	padding-top: 33px;

	background: url(/images/common/contactbox_line.png) no-repeat 0 0;

	text-decoration: none;

}























#FooterBox{ background: url(/images/common/footer_bg.jpg) repeat 0 0; color: #ffffff; padding-bottom: 35px; }

#FooterBox a{ color: #ffffff; }

#FooterBox .footerBoxInner{	width: 980px; margin: 0 auto; padding: 30px 0 0 0; position: relative; }

#FooterBox .footerBoxInner dl.leftArea{ float: left; }







/*-- フッターメニュー --*/

#FooterBox .footerBoxInner ul li{ float: left; }

#FooterBox .footerBoxInner ul li.line{ padding: 0 5px; }



#FooterBox .footerBoxInner .leftArea{ float: left; clear: both; margin-top: 23px; }

#FooterBox .footerBoxInner .leftArea .logo{ float: left; margin-right: 30px; }

#FooterBox .footerBoxInner .leftArea .logo a{

	display: block;

	background: url(/images/common/footer_logo.png) no-repeat 0 0;

	width: 135px;

	height: 51px;

	text-indent: -9999px;

}

#FooterBox .footerBoxInner .leftArea .company{ float: left; letter-spacing: 0.05em; }

#FooterBox .footerBoxInner .leftArea .company .txt01{ font-size: 12px; display: block; }

#FooterBox .footerBoxInner .leftArea .company .txt02{ font-size: 12px; display: block; margin-top: 10px; }





#FooterBox .footerBoxInner .copyright{
	position: absolute;
	bottom: 0;
	right: 0;
	font-size: 10px;
	position: absolute;
	bottom: 0;
	right: 0;
	text-align: right;
}







#FooterBox p.pagetop { position: fixed; bottom: 10px; right: 10px; }









.comingsoonBox{

	text-align: center;

	margin: 0 auto 110px auto;

}























@media screen and (min-width: 851px){



    .sponly{ display: none !important; }

	#FooterBox{ padding-bottom: 35px !important; }

}





@media screen and (max-width: 850px){





    @import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);



	.body-fixed{

		overflow: hidden;

	}



    body{

        font-family: 'Noto Sans Japanese', serif;

    }



    .pconly{ display: none !important; min-width: auto;  }



    body{ min-width: auto; }



    #HeaderBox .HeaderBoxInner{ width: 100%; height: 55px; }





    #HeaderBox .HeaderBoxInner .rightBox{ display: none; }



    #HeaderBox .HeaderBoxInner h1{ float: left;

    padding: 11px 13px; }

    #HeaderBox .HeaderBoxInner h1 a{ position: relative; top: 0; width: 87px; height: 33px; background-size: 87px 33px; }





    .ContentsWrapper{ margin: 0; padding-top: 55px; }





    #contentsBox{ width: auto; }





    .menu-trigger-outer{

        position: fixed;

        z-index: 1001;

    }



    .menu-trigger,

.menu-trigger span {

  display: inline-block;

  transition: all .4s;

  box-sizing: border-box;

}

.menu-trigger {

    z-index: 1001;

    position: fixed;

    width: 33px;

    height: 13px;

    right: 13px;

    top: 20px;

}

.menu-trigger span {

  position: absolute;

  left: 0;

  width: 100%;

  height: 2px;

  background-color: #000000;

  border-radius: 4px;

}

.menu-trigger span:nth-of-type(1) {

  top: 0;

}

.menu-trigger span:nth-of-type(2) {

  bottom: 0;

}





    .menu-trigger.active span:nth-of-type(1) {

  -webkit-transform: translateY(6px) rotate(-20deg);

  transform: translateY(6px) rotate(-20deg);

  background-color: #ffffff;

}

.menu-trigger.active span:nth-of-type(2) {

  -webkit-transform: translateY(-5px) rotate(20deg);

  transform: translateY(-5px) rotate(20deg);

  background-color: #ffffff;

}









    .sp-menulist{ display: none; }

    .sp-menulist.active{

        overflow-y: auto ;

        z-index: 1000;

        position: fixed;

        width: 100%;

        height: 100vh;

        display: inherit;

        background-color: rgba(0,0,0,.9);

    }



    .sp-menulist.active .sp-menulist-inner{

        margin: 55px 13px 100px;



    }

    .sp-menulist.active .sp-menulist-inner ul li .txtMenu,

    .sp-menulist.active .sp-menulist-inner ul li a{

        color: #ffffff;

        font-size: 14px;

        padding: 13px 0;

        border-bottom: #353332 1px solid;

        display: block;

		text-decoration: none;

		font-weight: normal;

    }



    .sp-menulist.active .sp-menulist-inner ul li .txtMenu span span,

    .sp-menulist.active .sp-menulist-inner ul li a span span{

        padding-left: 10px;

    }



    .sp-menulist.active .sp-menulist-inner ul li .txtMenu span.jpn,

    .sp-menulist.active .sp-menulist-inner ul li a span.jpn{

        padding-left: 10px;

        font-size: 14px;

    }



    .sp-menulist.active .sp-menulist-inner ul li.end a{

        border-bottom: none;

    }



    .sp-menulist.active .sp-menulist-inner ul li{

    }



    .sp-menulist.active .sp-menulist-inner ul li span{

        font-size: 25px;

        display: block;

    }



    .sp-menulist.active .sp-menulist-inner ul li.menu-sub ul li a{  padding: 13px 5px 13px 20px; }


    .sp-menulist.active .sp-menulist-inner ul li.menu-sub ul li a > span{
			font-size: 18px;
			position: relative;
			padding-left: 16px;
			letter-spacing: 0;
		}


    .sp-menulist.active .sp-menulist-inner ul li.menu-sub ul li a > span::before{
        background: #fff;
        content: "";
        height: 5px;
        width: 5px;
        left: 0;
        position: absolute;
        top: 46%;
    }

		.sp-menulist.active .sp-menulist-inner ul li.menu-sub ul li a > span span{
			display: inline;
			font-size: 15px;
			padding-left: 0;
		}


    .sp-menulist.active .sp-menulist-inner .btn-instagram{
        margin-top: 30px;
        border: #cfcfcf 1px solid;
        margin-bottom: 20px;
    }



    .sp-menulist.active .sp-menulist-inner .btn-instagram a{

        font-size: 20px;

        color: #ffffff;

        padding: 20px 0;

        display: block;

        text-align: center;

		text-decoration: none;

    }



    .sp-menulist.active .sp-menulist-inner .btn-instagram a span{

        background: url(/images/common/sp/header_instagram.svg) no-repeat 0 0;

        background-size: 23px;

        padding-left: 30px;

    }























    #FooterBox .footerBoxInner{ width: 100%;

		position: relative;

    padding: 50px 0 0 0; }





	#FooterBox .footerBoxInner #salon{

		position: absolute;

		padding-top: 105px;

		margin-top: -105px;

	}



    footer{ background-size: 10px 10px; }





    #footer-map{ padding-top: 25px; }

    #footer-map iframe{

        height: 50vh;

    }



    #FooterBox .footerBoxInner .copyright{

        position: relative;

        font-size: 12px;

        text-align: center;

        padding: 22px 0;

    }



    #FooterBox .footerBoxInner .tit{

        font-size: 28px;

        text-align: center;

        padding-bottom: 25px;

    }



    #FooterBox .footerBoxInner .tit span{

        display: inline-block;

        transform: scale(1.2, 1);

        letter-spacing: 0;

    }



    #FooterBox .footerBoxInner .company{

        margin: 0 13px;

    }



    #FooterBox .footerBoxInner .company dl{

        display: table;

        width: 100%;

        padding: 10px 0;

    }





    #FooterBox .footerBoxInner .company dl:not(:last-child){

        border-bottom: #606060 1px solid;

    }



    #FooterBox .footerBoxInner .company dl dt{

        display: table-cell;

        font-size: 16px;

        width: 100px;

		padding-left: 7px;

    }



    #FooterBox .footerBoxInner .company dl dd{

        display: table-cell;

        font-size: 16px;

			padding-right: 7px;

    }

		#FooterBox .footerBoxInner .company dl dd h1{
			font-weight: normal;
		}







    .footer-fixed{ position: fixed; width: 100%; bottom: 0; z-index: 999; }

    .footer-fixed ul{ display: table; width: 100%; table-layout: fixed; }

    .footer-fixed ul li{ display: table-cell; background-color: #e88394; vertical-align: middle; padding: 8px 0; }





    .footer-fixed ul li:first-child{ border-right: 1px solid #ffffff; }



    .footer-fixed ul li a{ display: table; width: 100%; text-align: center; background-color: #e88394; color: #ffffff; }

    .footer-fixed ul li .sub{ font-size: 10px; display: block; text-align: center; line-height: 1.2; margin-top: 5px; }



    .footer-fixed ul li .in{ display: table-cell; vertical-align: middle; font-size:10px; font-weight: 400; letter-spacing: .8px; }



    .footer-fixed ul li .in .lines{ font-size: 14px; line-height: 1; background: url('../images/common/sp/line.svg') no-repeat 0 50%; background-size: 17px auto; padding-left: 20px; font-weight: bold; }



    .footer-fixed ul li .in .lines-2{ display: block; }



    .footer-fixed ul li .in .tel{ display: inline-block; font-size: 18px; background: url('../images/common/sp/tel.svg') no-repeat 0 50%; background-size: 10px auto; padding-left: 15px; }

}



