﻿@import "html5reset.css";

@charset "utf-8";

html{
	font-size:100%;
}

body {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height:1.4;
	background:#fff url(../img/bg_body.png) center top repeat-x;
	margin: 0;
	padding: 0;
	color: #333;
}
h2.c0{
	text-align:center;
}
/*
common
--------------------------------------- */

ul, ol, dl {
	padding: 0;
	margin: 0;
	list-style-type:none;
}
h1, h2, h3, h4, h5, h6, p {
	margin:0;padding:0;
	font-size:100%;
}
a img {
	border: none;
}
a:link {
	color: #820000;
	text-decoration: none;
}
a:visited {
	color: #820000;
}
a:hover, a:active, a:focus {
	text-decoration: underline;
}


/*
layout
--------------------------------------- */

#WRAP {
	width: 910px;
	margin: 0 auto;
}

#WRAP p{
	line-height:1.7;
}


#BRAND{
	float:left;
	width:205px;height:98px;
	margin-top:30px;
}
#BRAND a{
	margin:0;padding:0;
	}
	
/*
nav
--------------------------------------- */

#NAV{
	float:right;
	width:700px;
	margin-top:15px;
}

#NAV li {
	display:block;
	float:left;
	margin-right:20px;
}
#NAV li a{
	display:block;
	width:112px;height:40px;
	border-bottom:1px solid #333;
}
#NAV li.home a{
	width:40px;
}
#NAV li.last{
	margin-right:0;
}
#NAV li a:hover{
	border-bottom:1px solid #820000;
}


#NAV_CONTACT{
	float:right;
	width:310px;
	margin-top:45px;
}
#NAV_CONTACT li {
	display:block;
	float:left;
	margin-left:20px;
}
#NAV_CONTACT li a{
	display:block;
	width:135px;height:26px;
}

/*
main
--------------------------------------- */
#CONTENT {
	padding: 40px 0;
}
#CONTENT p{
	font-size:13px;
}

#MAIN_IMG{
	margin:0 0 20px 0;padding:0;
	width:620px;
	height:340px;
	float:left;
}
#LOCATION{
	margin:0 0 0 0;padding:0;
	width:290px;
	height:340px;
	background-color:#1D0E03;
	float:right;
}

#LOCATION p{
	padding:0 20px;
	color:#fff;
	font-size:12px;
	line-height:1.6;
	font-size:11px;
	margin-bottom:10px;
}

#CONCEPT{
	margin-bottom:40px;
}
#CONCEPT div{
	float:left;
	width:290px;
	margin-right:20px;
}
#CONCEPT div.c3{
	margin-right:0;
}

#CONCEPT h2{
	width:290px;
	margin-bottom:20px;
	padding:10px 0 8px 0;
	text-align:center;
	border-top:1px solid #333;
	border-bottom:1px dotted #333;
	font-size:15px;
}

.index #CONCEPT h2{
	border-top:0px solid #333;
	text-align:left;
	text-indent:25px;
}
.index #CONCEPT .c1 h2{
	background:#fff url(../img/icon_treatment.png) left center no-repeat;
}
.index #CONCEPT .c2 h2{
	background:#fff url(../img/icon_scissors.png) left center no-repeat;
}
.index #CONCEPT .c3 h2{
	background:#fff url(../img/icon_glass.png) left center no-repeat;
}
#CONCEPT h2.title{
	width:100%;
	margin-bottom:20px;
	padding:10px 0 8px 0;
	text-align:center;
	border-top:1px solid #333;
	border-bottom:1px dotted #333;
	font-size:14px;
	text-indent:0;
}
#CONCEPT img{
	float:left;
}
#CONCEPT p{
	width:180px;
	float:right;
}


#INFO{
	float:left;
	width:600px;
}


#INFO ul{
	font-size:14px;
}

#INFO ul li,#INFO ul li div {zoom:1;}
#INFO ul li:after,#INFO ul li div:after{
    content: ""; 
    display: block; 
    clear: both;
}
#INFO ul a,
#INFO ul a:link{
	color:#820000;
}
#INFO ul a:hover{
	color:#820000;
}
#INFO ul li div{
	margin:0 0 20px 0;
	padding:0 10px 10px 20px;
	border-bottom:1px dotted #ccc;
	line-height:1.7;
}
#INFO ul li:last-child div{
	border-bottom:none;

}
#INFO ul li h3{
	margin-bottom:20px;
}
#INFO dl {
    font-size: 14px;
}
#INFO dl a, #INFO dl a:link {
    color: #333333;
}
#INFO dl a:hover {
    color: #820000;
}
#INFO dt {
    border-bottom: 1px dotted #ccc;
    float: right;
    line-height: 1.7;
    margin-bottom: 20px;
    padding-bottom: 10px;
    width: 500px;
}
#INFO dd {
    float: left;
    margin-bottom: 20px;
    width: 90px;
}
#INFO dt:last-child{
	border-bottom:none;
	}


#INFO .news_img{
	width:150px;
	padding:0 20px 5px 0;
	float:left;
}
#INFO .news_img img{
	width:100%;
}

#MAP{
	float:right;
	width:290px;
}
#MAP img{
	margin-bottom:10px;
}
#MAP p{
	font-size:14px;
	line-height:1.7;
	margin-bottom:10px;
	/*padding-left:15px;*/
}
#INFO h2,
#MAP h2{
	margin-bottom:20px;
	padding:10px 0 8px 0;
	text-align:center;
	border-top:1px solid #333;
	border-bottom:1px dotted #333;
}
#INFO h2,
#MAP h2{
	margin-bottom:20px;
	padding:10px 0 8px 0;
	text-align:center;
	border-top:1px solid #333;
	border-bottom:1px dotted #333;
}
#INFORMATION{
	float:right;
	width:290px;
}
#INFORMATION h2{
	margin-bottom:20px;
	padding:10px 0 8px 0;
	text-align:center;
	border-top:1px solid #333;
	border-bottom:1px dotted #333;
}
#INFORMATION p{
	font-size:12px;
	line-height:1.7;
	margin-bottom:10px;
	margin-top:20px;
	padding-left:1em;
}
#INFORMATION p span{
	display:block;
	text-indent:-1em;
	font-weight:bold;
	margin-bottom:0.5em;
}
#FOOTER{
	clear:both;
	margin:0 0 10px 0;
	padding-top:10px;
	border-top:1px dotted #ccc;
}
#FOOTER #COPY{
	font-size:12px;
	text-align:center;
}

.special_offer{
	color:#561400;
	border:2px solid #561400;
	text-align:center;
	padding:5px;
	margin-bottom:20px;
}

.bar_image{
	width:100%;
	margin-bottom:20px;
}
.bar_image img{
	width:100%;
}
.photo_side{
	float:left;
	text-align:center;
	width:290px;
	padding-top:25px;
	display:none;
}
/*
concept
--------------------------------------- */
.concept{
	padding-top:60px;
}
.concept #CONTENT_MAIN{
	width:600px;
	float:right;
}

.concept h2{
	margin-bottom:20px;
	padding:10px 0 8px 0;
	clear:both;
	border-top:1px solid #333;
	border-bottom:1px dotted #333;
}
.concept h2 + img{
	float:left;
	margin-right:20px;
	margin-bottom:40px;
}
.concept .special_offer{
	margin-top:50px;
	font-weight:normal;
	text-align:left;
}
.concept p{
	margin-bottom:20px;
}
.concept h2.c2 + img,
.concept h2.c2 + img + p{
	margin-bottom:20px;
}
#about_treatment_bar{
	clear:both;
	margin-top:0px;
	margin-bottom:40px;
	padding:20px;
	border:1px dotted #333;
	
}
#about_treatment_bar h3{
	margin-bottom:5px;
}
.concept #about_treatment_bar p{
	margin-bottom:0;
}
.concept h2.c0{
	width:290px;
	float:left;
}
.concept h2.c0 span{
	padding:0 2px 0 2px;
}

/*
style
--------------------------------------- */
.style{
	padding-top:60px;
}
.style #CONTENT_MAIN{
	width:600px;
	float:right;
	border-top:1px solid #333;
	padding-top:20px;
}

.style h2{
	margin-bottom:20px;
	padding:10px 0 8px 0;
	clear:both;
	border-top:1px solid #333;
	border-bottom:1px dotted #333;
}
.style h2 + img{
	float:left;
	margin-right:20px;
	margin-bottom:40px;
}
.style .special_offer{
	margin-top:50px;
	font-weight:normal;
	text-align:left;
}
.style p{
	margin-bottom:20px;
}
.style h2.c2 + img,
.style h2.c2 + img + p{
	margin-bottom:20px;
}
.style h2.c0{
	width:290px;
	float:left;
}
.style h2.c0 span{
	padding:0 2px 0 2px;
}

.style h2.c1{
	width:420px;
	float:right;
	border:none;
	margin:0;
	padding-top:0;
}
.style p{
	width:420px;
	float:right;
}
.style .img_top{
	float:left;
	width:150px;
}
.style .img_top img{
	width:100%;
}
.style .img_sub{
	width:420px;
	float:right;
}
.style .img_sub img{
	width:50px;
}
.style .style_list{
	border-bottom:1px dotted #333;
	padding-bottom:20px;
	margin-bottom:20px;
}

/* ---- */

.access{
	padding-top:60px;
}
.access #CONTENT_MAIN{
	width:600px;
	float:right;
}

.access h2{
	margin-bottom:20px;
	padding:10px 0 8px 0;
	clear:both;
	border-top:1px solid #333;
	border-bottom:1px dotted #333;
}
.access h2.c0{
	width:290px;
	float:left;
}
.access .info{
	margin-top:20px;
	padding-left:0;
	font-size:16px;
}
#CONTENT.access .info p{
	font-size:14px;
}
.access .info h3{
	margin-bottom:10px;
	padding:5px 0 4px 0;
	border-bottom:1px dotted #333;
}
.access .info p{
	margin-bottom:40px;
}
.access .info p .phone{
	font-size:18px;
	font-weight:bold;
}
.access .info dl{
}
.access .info dl{
	}

.access .info dt {
	float: left;
	width: 400px;
	padding: 5px 0 4px 0;
}
.access .info dd {
	padding: 5px 10px 4px 420px;
	text-align:right;
}


/*
products
--------------------------------------- */

.products{
	padding-top:60px;
}
.products #CONTENT_MAIN{
	width:600px;
	float:right;
}

.products h2{
	margin-bottom:20px;
	padding:10px 0 8px 0;
	clear:both;
	border-top:1px solid #333;
	border-bottom:1px dotted #333;
}
.products h2.c0{
	width:290px;
	float:left;
}
.products .info{
	margin-top:20px;
	padding-left:0;
	font-size:16px;
}
#CONTENT.products .info p{
	font-size:14px;
}
.products .info h3{
	margin-bottom:10px;
	padding:5px 0 4px 0;
	border-bottom:1px dotted #333;
}
.products .info p{
	margin-bottom:40px;
}
.product_image{
	float:right;
}
.product_price{
	font-weight:bold;
	border-bottom:1px solid #333;
	padding:0 0.5em;
}


/*
access
--------------------------------------- */


.contact{
	padding-top:60px;
}
.contact #CONTENT_MAIN{
	width:600px;
	float:right;
}

.contact h2{
	margin-bottom:20px;
	padding:10px 0 8px 0;
	clear:both;
	border-top:1px solid #333;
	border-bottom:1px dotted #333;
}
.contact h2.c0{
	width:290px;
	float:left;
}
.contact .info{
	font-size:16px;
}
#CONTENT.contact .info p{
	font-size:14px;
}
.contact .info h3{
	margin-bottom:10px;
	padding:10px 0 8px 0;
	border-top:1px solid #333;
	border-bottom:1px dotted #333;
}
.contact .info p{
	margin-bottom:40px;
}
.contact .info p .phone{
	display:block;
	padding:0;
	font-size:18px;
	font-weight:bold;
}
#CONTENT.contact .info p.contact_detail{
	padding:0;
	font-size:18px;
	font-weight:bold;
}


/*
menu
--------------------------------------- */

.menu h2.c0{
	margin-bottom:60px;
	padding:10px 0 8px 0;
	clear:both;
	border-top:1px solid #333;
	border-bottom:1px dotted #333;
}
.menu h2.c0{
	width:290px;
	float:left;
}
.menu .special_offer{
	width:590px;
	float:right;
}

.menu .category_group{
	border-top:1px solid #333;
	clear:both;
	}
.menu .category_group h2.category{
	width:290px;
	float:left;
	padding:14px 0 8px 0;
	text-align:center;
	}
.menu .category_group h2.category span{
	display:block;
	padding-top:5px;
	font-size:12px;
	font-weight:normal;
	color:#999;
	}
.menu .category_group dl{
	width:600px;
	float:right;
	}

.menu .category_group dt {
	float: left;
	width: 400px;
	padding: 10px 0 8px 10px;
	font-size:14px;
	line-height:1.9;
	font-weight:bold;
}
.menu .category_group dt span{
	padding-left:20px;
	font-weight:normal;
}
.menu .category_group dd {
	padding: 10px 10px 8px 420px;
	border-bottom: 1px dotted #333;
	font-size:14px;
	text-align:right;
	line-height:1.9;

}
.menu .category_group dd.last {
	border-bottom-width:0;
}

.menu .category_group dd span {
	display:block;
	position:relative;
	left:-420px;
	width:560px;
	padding:10px 10px 0 30px;
	text-align:left;
	font-size:12px;
	color:#666;
}
.menu #CONCEPT p{
	float:none;
	width:auto;
}

.menu #CONCEPT a{
	display:block;
	
}

.menu #CONCEPT a:link,
.menu #CONCEPT a:visited{
	color:#333;
	
}
.menu #CONCEPT a:hover,
.menu #CONCEPT a:active{
	text-decoration:none;
}


.coupon h2.c0{
	margin-bottom:60px;
	padding:10px 0 8px 0;
	clear:both;
	border-top:1px solid #333;
	border-bottom:1px dotted #333;
}
.coupon h2.c0{
	width:290px;
	float:left;
}
.coupon .special_offer{
	width:590px;
	float:right;
}

.coupon .category_group{
	border-top:1px solid #333;
	clear:both;
	}
.coupon .category_group h2.category{
	width:290px;
	float:left;
	padding:14px 0 8px 0;
	text-align:center;
	}
.coupon .category_group h2.category span{
	display:block;
	padding-top:5px;
	font-size:12px;
	font-weight:normal;
	color:#999;
	}
.coupon .category_group dl{
	width:100%;
	float:left;margin:0 0 10px 0;
	}

.coupon .category_group dt {
	float: left;
	width: 600px;
	padding: 10px 0 0 10px;
	font-size:14px;
	line-height:1.9;
	font-weight:bold;
}
.coupon .category_group dt span{
	padding-left:0;
	font-weight:normal;
}
.coupon .category_group dd {
	padding: 5px 10px 0 420px;
	border-bottom: 1px dotted #333;
	font-size:14px;
	text-align:right;
	line-height:1.9;

}
.coupon .category_group dd.last {
	border-bottom-width:0;
}

.coupon .category_group dd span {
	display:block;
	position:relative;
	left:-420px;top:-10px;
	width:600px;
	padding:10px 10px 0 10px;
	text-align:left;
	font-size:12px;
	color:#666;
}

.coupon .category_group dd span.add{
    position:relative;
    top: -6em;
    height:0;
}
.coupon strong {color:red;
	font-size:17px;
	}

.last #SPA span{
	display:block;
	position:relative;
	left:-420px;top-:250px;

}
.coupon_category{
    padding:40px 0 20px 0;
    border-bottom: 1px dotted #333;
    clear:both;
}
.midashi {
	font-weight:bold;
	font-size:20px;
    margin:0 0 0 0;
	
}


/*
location
--------------------------------------- */

#LOCATION_PHOTO{
	margin-top:3em;
}


/*
function
--------------------------------------- */

.clearfix {zoom:1;}
.clearfix:after{
    content: ""; 
    display: block; 
    clear: both;}



/*
for mobile site width=640px
--------------------------------------- */


@media only screen and (max-width: 640px) {
	
#WRAP {
	width: 95%;
	margin: 0 auto;
}
#WRAP p{
	line-height:1.5;
}


#BRAND{
	float:none;
	width:205px;height:98px;
	margin:20px auto 0 auto;
}
#BRAND a{
	margin:0;padding:0;
	}
#NAV{
	float:none;
	width:100%;
	margin-top:10px;
}

#NAV li{
	display:block;
	float:left;
	margin-right:0;
	width:50%;
}
#NAV li a{
	display:block;
	width:100%;height:44px;
	border-bottom:1px solid #333;
	text-align:center;
	padding-top:4px;
}
#NAV li.home a{
	width:100%;
	display:none;
}
#NAV li.last{
	margin-right:0;
}
#NAV_CONTACT{
	float:none;
	width:100%;
	margin-top:30px;
}


#NAV_CONTACT li{
	display:block;
	float:left;
	margin-left:0;
	width:50%;
}
#NAV_CONTACT li a{
	display:block;
	width:100%;height:44px;
	text-align:center;
	padding-top:4px;
}

#MAIN_IMG{
	margin:0 0 10px 0;padding:0;
	width:100%;height:150px;
	float:none;
}	
#MAIN_IMG img{
	width:100%;
}
#LOCATION{
	margin-bottom:10px;
	width:100%;
	float:none;
}
#CONCEPT{
	clear:both;
	margin-bottom:40px;
}
#CONCEPT div{
	float:none;
	width:100%;
	clear:both;
	margin-bottom:1em;
	
}
#CONCEPT div.c3{
	margin-right:0;
}

#CONCEPT h2{
	width:auto;
}
#CONCEPT h2.title{
	width:100%;
}
#CONCEPT img{
	float:left;
	margin-right:1em;
}
#CONCEPT p{
	width:auto;
	float:none;
	font-size:14px;
}
#INFO{
	float:none;
	width:100%;
	
}

#INFO dt{
	float:none;
	width:auto;
	margin-bottom:5px;
	padding-bottom:0px;
	border-bottom:0px;
}
#INFO dd{
	float:none;
	width:auto;
	margin-bottom:20px;
	padding-bottom:10px;
	border-bottom:1px dotted #ccc;
}
#MAP{
	float:none;
	width:100%;
}
#MAP a img{
	width:100%;
}
#MAP p{
	font-size:14px;
}
#INFORMATION{
	float:none;
	width:100%;
}
#INFORMATION a img{
	width:100%;
}
#INFORMATION p{
	font-size:14px;
}
/* ---------- concept page --------- */

.concept{
	padding-top:60px;
}
.concept #CONTENT_MAIN{
	width:600px;
	float:right;
}

.concept h2{
	margin-bottom:20px;
	padding:10px 0 8px 0;
	clear:both;
	border-top:1px solid #333;
	border-bottom:1px dotted #333;
}
.concept h2 + img{
	float:left;
	margin-right:20px;
	margin-bottom:40px;
}
.concept p{
	margin-bottom:20px;
}
.concept h2.c2 + img,
.concept h2.c2 + img + p{
	margin-bottom:20px;
}
#about_treatment_bar{
	clear:both;
	margin-top:0px;
	margin-bottom:40px;
	padding:20px;
	border:1px dotted #333;
	
}
#about_treatment_bar h3{
	margin-bottom:5px;
}
.concept #about_treatment_bar p{
	margin-bottom:0;
}
.concept h2.c0{
	width:290px;
	float:left;
}
.concept h2.c0 span{
	padding:0 2px 0 2px;
}

/* coupon add:20160630*/ 

.menu.coupon .category_group dt{
	float: none;
	text-align:left;
	width:100%;
	
}
.menu.coupon .category_group dd{
	text-align:left;
	padding:0 10px 10px 20px;
	background-color:#fff!important;
	
}
.menu.coupon .category_group dd .caption{
	text-align:left;
	padding:5px 0 0 0px;
	
}
.menu.coupon .category_group dd .caption.add{
    position:static;
    top: -10px;
    height:auto;
}


/* ---------- menu page --------- */

.menu h2.c0{
    border: medium none;
    float: none;
    width: 100%;
	margin-bottom:20px;
	}

.menu .special_offer{
	width:auto;
	float:none;
	}
.menu .category_group{
	border-top:1px solid #333;
	clear:both;
	}
.menu .category_group h2.category{
	width:100%;
	float:none;
	padding:0.5em 0 8px 0.5em;
	background-color:#333;
	color:#fff;
	margin-top:1em;
	}
.menu .category_group h2.category span{
	display:inline;
	padding:0 0 0 1em;
	font-size:14px;
	font-weight:normal;
	color:#ccc;
	}
.menu .category_group dl{
	width:100%;
	float:right;
	}

.menu .category_group dt {
	float: left;
	width: 70%;
	padding: 10px 0 8px 10px;
	font-size:14px;
	line-height:1.9;
	font-weight:bold;
}
.menu .category_group dt span{
	padding-left:0;
	font-weight:normal;
}
.menu .category_group dd {
	padding: 10px 10px 8px 0;
	border-bottom: 1px dotted #666;
	font-size:14px;
	text-align:right;
	line-height:1.9;
	
}
.menu .category_group dd.last {
	border-bottom-width:0;
}

.menu .category_group dd span {
	display:block;
	position:static;
	left:-420px;
	width:auto;
	padding:10px 10px 0 30px;
	text-align:left;
	font-size:12px;
	color:#666;
}
#CONCEPT .menu_concept h2{
	text-align:left;
	padding-left:0.5em
}

.bar_image{
	display:none;
}
/* access */
.access{
	padding-top:60px;
}

.access #CONTENT_MAIN{
	width:100%;
	float:none;
}

.access h2{
	margin-bottom:5px;
	padding:0;
	border-width:0;
}
.access h2.c0{
	width:100%;
	float:none;
}
.access .info dt {
	float: none;
	width: auto;
	padding: 5px 0 4px 0;
}
.access .info dd {
	margin-bottom:10px;
	padding:0;
	text-align:left;
}
#LOCATION_PHOTO{
	display:none;
}
/* contact */
.contact #CONTENT_MAIN{
	width:100%;
	float:none;
}
.contact h2{
	margin-bottom:5px;
	padding:0;
	border-width:0;
}
.contact h2.c0{
	width:100%;
	float:none;
}
.contact .info h3{
	margin-bottom:10px;
	padding:10px 0 8px 0;
	border-top:1px solid #333;
	border-bottom:0px dotted #333;
}
.contact .info p{
	margin-bottom:40px;
}
.contact .info p .phone{
	display:block;
	padding:0;
	font-size:18px;
	font-weight:bold;
}
#CONTENT.contact .info p.contact_detail{
	padding:0;
	font-size:18px;
	font-weight:bold;
}
/* products */
.products{
	padding-top:60px;
}
.products #CONTENT_MAIN{
	width:100%;
	float:none;
}
.products #ITEM_IMG{
	width:100%;
}
.products h2{
	display:none;
}
.products h2.c0{
	width:100%;
	float:none;
}
.products .info h3{
	margin-bottom:10px;
	padding:5px 0 4px 0;
	border-bottom:1px dotted #333;
}
.products .info p{
	margin-bottom:40px;
}
.product_image{
	float:none;
}
.product_price{
	font-weight:bold;
	border-bottom:1px solid #333;
	padding:0 0.5em;
}
/* concept */
.concept{
	padding-top:60px;
}
.concept #CONTENT_MAIN{
	width:100%;
	float:none;
}

.concept h2.c0{
	border: medium none;
	width:100%;
	float:none;
}
.concept .info h3{
	margin-bottom:10px;
	padding:5px 0 4px 0;
	border-bottom:1px dotted #333;
}
.concept .info p{
	margin-bottom:40px;
}
/* style */
.style{
	padding-top:60px;
}
.style #CONTENT_MAIN{
	width:100%;
	float:none;
}
.style .special_offer{
	margin-top:10px;	
}
.style h2.c0{
	width:100%;
	float:none;
	border:none;
}
.style h2.c1{
	width:100%;
	float:none;
	
}
.style .style_list .img_top{
	width:100%;
	float:none;
	
}
.style .style_list p{
	width:100%;
	float:none;
	
}
.style .style_list .img_sub{
	width:100%;
	float:none;
	
}
.photo_side{
	display:none;
}
}