/*------------------------------*/
/*import*/
/*------------------------------*/
@import url("reset.css");

/*------------------------------*/
/*common style*/
/*------------------------------*/
main p, main ul, main ol, main table{margin: 0 0 1em; line-height: 1.5; }
a, a img { transition: all 0.3s linear; -moz-transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; }
a:hover img{ filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6; }
a:hover{text-decoration: none;}
.list li{list-style:circle; margin-left: 1.5em; }
.numlist li{list-style:decimal; margin-left: 1.5em; }
.inline li{ display:inline;}
.small{ font-size: 85%;}
.nomargint{margin-top: 0 !important;}
.marginb{margin: 0 0 15px; }
.overflow{overflow: hidden;}
.btn{ display: inline-block; text-align: center; text-decoration: none;padding: 4px 10px;font-weight: bold;}
.label{ display:inline-block; text-align: center;}
.catch{font-weight: bold; font-size:16px;margin:0 0 0.6em;}
hr{clear: both; border:none;margin:15px 0;}

/*------------------------------*/
/*structure*/
/*------------------------------*/
@media screen and (min-width:961px){
	.inner{width: 960px;margin: 0 auto;}
}

.shoplogo{text-align: center;}
.gnav a{ text-decoration: none; font-weight:bold; font-size: 110%;}
.main_visual{margin: 20px 0;}
.pankuzu ul{margin: 10px 0;}
.gnav a{ text-decoration: none;}

.snav ul{margin-bottom: 10px;}
.snav li{font-weight:bold;}
.snav li a{ display: block;text-decoration: none;margin-bottom: 2px;}
.snav small{ background-size:16px 16px !important;}
.sbnr{text-align: center;}

footer{ padding: 15px 0}
.fshopname{ font-size:85%}


/*2columns*/
@media print, screen and ( min-width : 768px ) {
	header .inner{position: relative;}
	.hcontact{ width: 226px;position:absolute;}
	.hcontact span{padding-left: 20px; background-size: 16px 16px !important;}
	.hshopname{padding-top: 4px;}

	.gnav li{ width: 20%;display: inline-block; margin: 0 -4px 0 0; text-align: center;}
	.gnav li a{ display: block; padding: 10px;}
	.gnav li a:hover{background:rgba(255,255,255,0.3);}
	.gnav li small{ display: block;}
	.gnav ul{border-right: rgba(0,0,0,0.1) 1px solid;border-left: rgba(255,255,255,0.5) 1px solid;}
	.gnav li a{border-left: rgba(0,0,0,0.1) 1px solid;}
	.gnav li a{border-right: rgba(255,255,255,0.5) 1px solid;}
	.main_visual{ min-height: 10px}
	.main_left{ float: left; width: 73.5%; padding-bottom: 50px;}
	.main_right{ float: right; width: 23.5%; padding-bottom:50px;}
	.section{ margin: 0 0 20px;}
	.section .photo{ float: right; max-width:260px ;margin:0 0 15px 15px}
	.section .photo_l{ float: left; max-width:260px ;margin:0 15px 15px 0}

	.section .condensed .photo{ float: left; width:120px; margin: 0 0 15px;}
	.section .condensed .subtitle{ clear:none; margin-left: 140px; overflow: hidden;}
	.section .condensed p{  margin-left: 140px; overflow: hidden;}

	.snav li a{ padding:5px 15px;}
	.snav li a:hover{filter:alpha(opacity=70);-moz-opacity: 0.7;opacity: 0.7;}
	.snav small{display: block; }

	footer{text-align: center;}
	.fnav{margin-bottom: 30px;}
	.fnav li{margin: 0 5px;background-size:16px 16px !important; padding-left: 20px;}
	.sociallink{margin-bottom: 8px;}
	.sociallink li{margin: 5px;}
	.sociallink a{display: inline-block;width: 24px; height: 24px;background-size:24px 24px !important;}
	.sociallink a:hover{ filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6;}
}

/*1column*/
@media screen and ( max-width : 767px ) {
.inner{ padding: 0 10px}
header .inner, .main_visual .inner{padding: 0;}
.hcontact{display: none;}
.hshopname{display: none;}

.gnav li:first-child{ display:none;}
.gnav li{ width: 50%;display: inline-block; margin: 0 -4px 0 0; text-align: center;}
.gnav li a{ display: block; padding: 8px;}
.gnav li small{ display: none;}
.gnav li:nth-of-type(2) a, .gnav li:nth-of-type(4) a{border-right: rgba(255,255,255,0.5) 1px solid;}
.gnav li:nth-of-type(3) a, .gnav li:nth-of-type(5) a{border-left: rgba(0,0,0,0.1) 1px solid;}
.gnav li:nth-of-type(2) a, .gnav li:nth-of-type(3) a{border-bottom: rgba(0,0,0,0.1) 1px solid;}
.gnav li:nth-of-type(4) a, .gnav li:nth-of-type(5) a{border-top:rgba(255,255,255,0.5) 1px solid;}

.main_left{padding-bottom: 20px;}
.section{ margin: 0 0 15px;}
.section .photo, .section .photo_l{margin-bottom: 15px; text-align: center;}
.section .condensed .photo{ float: left; width:90px}
.section .condensed .subtitle{ clear:none; margin-left: 100px; overflow: hidden;}
.section .condensed p{  margin-left: 100px; overflow: hidden;}

.snav{margin-bottom: 20px;}
.snav li a{ padding: 10px 15px;}
.snav small{float: right; padding-right: 20px;}
.sbnr img{max-width: 240px}

.fnav{ display:none;}
.sociallink{display: none;}
}


/*------------------------------*/
/*class*/
/*------------------------------*/
.section{overflow: hidden;}
.section_title{ padding: 5px 15px;}
.section_inner{padding: 20px 15px 10px; overflow: hidden;}
.section_inner + .subtitle{margin-top: 0;}
.subtitle{ font-size: 16px; clear:both;	margin:20px 0 15px;}
.minititle{ font-size: 15px; margin:15px 0 0;}
.pagetitle small{ font-size:15px;}

.dlgroup{margin-bottom: 1em;}
.dlgroup dl{ padding:8px 0; border-bottom:#eee 1px solid; overflow: hidden;}

.item .itemframe{width: 160px;height:160px; margin: 0 auto 5px;}
.item .itemimg{overflow: hidden;width: 160px;height:160px;background-size: cover !important;background-position: 50% 25% !important;}
.item .date{ font-weight: bold; margin: 0;}
.news .newsimg{overflow: hidden;background-size: cover !important;background-position: 50% 25% !important;}
.news .date{ font-weight: bold; margin: 0;}
.bloggroup p{margin: 0;}


@media print, screen and ( min-width : 768px ) {
	.visible-xs{display: none;}
	.pagetitle{ font-size:32px; }
	.pagetitle small{margin-left: 20px;}
	.section_title{  font-size: 20px;}

	.dlgroup{ overflow: hidden;}
	.dlgroup dl{ clear: both;}
	.dlgroup dt{ float: left; width: 150px}
	.dlgroup dd{padding-left: 160px;}

	.itemgroup .item{ width: 190px; float: left; margin: 0 10px 20px;}
	.itemgroup .item:nth-child(3n+1){ clear:both;}
	.itemgroup a .itemimg{transition: all 0.3s linear; -moz-transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear;}
	.itemgroup a:hover .itemimg{ filter:alpha(opacity=70);-moz-opacity: 0.7;opacity: 0.7;}
	.newsgroup .news{ width: 190px; float: left; margin: 0 10px 20px;}
	.newsgroup .news:nth-child(3n+1){ clear:both;}
	.news .newsframe{width: 160px;height:160px; margin: 0 auto 5px;}
	.news .newsimg{width: 160px;height:160px;}
	.newsgroup a .newsimg{transition: all 0.3s linear; -moz-transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear;}
	.newsgroup a:hover .newsimg{ filter:alpha(opacity=70);-moz-opacity: 0.7;opacity: 0.7;}


}

@media screen and ( max-width : 767px ) {
	.hidden-xs{display: none;}
	.pagetitle{ font-size:26px;}
	.pagetitle small{ display:block;}
	.section_title{  font-size: 18px;}

	.itemgroup .item{margin: 10px 0; padding-bottom: 10px;}
	.newsgroup .news{margin: 0 0 10px; padding-bottom: 10px; clear: both;overflow: hidden;  border-bottom:#eee 1px solid;}
	.news .newsframe{width: 90px;height:90px; margin: 0 10px 0 0 ;float:left;}
	.news .newsimg{width: 90px;height:90px; }


}

/*------------------------------*/
/*page style*/
/*------------------------------*/
/*
テキスト等濃いブルー：#3aa
ラベル：#80cecf
背景色（濃い）・線：#d9eaed
背景色（薄い）：#ecf5f6
*/
#js-map img{ max-width:none;}
.contact dd{text-align: center;}
.contact .btn{ line-height: 1.2; width: 200px;}

.dicila1 .chart{text-align: center;margin: -5px 0 5px;}
.dicila1 .dlgroup dl, .dicila2 .dlgroup dl{padding: 4px 0;}
.dicila1 .dlgroup dd, .dicila2 .dlgroup dd{font-size:90%;}

.dicila1 .table{width: 100%;margin-bottom: 30px;}
.dicila1 th{background:#d9eaed;border: #fff 1px solid;padding: 5px;}
.dicila1 tbody th{ background:#ecf5f6; font-size: 90%; line-height: 1.3;}
.dicila1 tbody th{width: 16%;}
.dicila1 tbody td{width: 42%;}
.dicila1 td{border: #d9eaed 1px solid;padding: 5px; font-size:90%;vertical-align: top;}

.dicila1 .course{border: #d9eaed 1px solid; padding: 0 10px 10px;margin-bottom: 15px;}
.dicila1 .minititle{border-bottom: #d9eaed 1px solid;margin-bottom: 20px;padding-bottom: 10px;}
.dicila1 .coursetitle{background:#ecf5f6;font-size: 15px;padding: 0 10px;margin-bottom: 5px;}
.dicila1 .coursetitle span{font-size: 15px;margin-right: 5px;}
.dicila1 .course .label{font-size: 12px; width: 18px; height: 18px;margin-right: 3px; padding-top: 2px;background: #80cecf; color:#fff;border-radius: 50%;}

.dicila2 .catch{color:#3aa;}
.dicila2 .course .catch{font-size:15px;margin-bottom: 0;}
.dicila2 .flow dt{ background:#ecf5f6;}
.dicila2 .flow .label{font-size: 10px; width: 65px;background: #80cecf; color:#fff; border-radius: 8px }


@media print, screen and ( min-width : 768px ) {
	.shopnews dt{ width: 90px}
	.shopnews dd{padding-left: 100px;}
	.bloggroup dt{ width: 90px}
	.bloggroup dd{ padding-left: 100px;}
	#js-map{width: 100%; height: 360px;}
	.contact .tel{font-weight: bold; font-size:20px;}

	.dicila1 .chart img{width: 280px;}

	.dicila1 .flow dt{width: 260px;padding:0 5px;}
	.dicila1 .flow dd{padding-left: 265px;}

	.dicila2 .course img{width: 90px; float: left;}
	.dicila2 .course p{padding-left: 100px;}
	.dicila2 .course{overflow: hidden;}
	.dicila2 .course .course{width: 48%; float: left;margin: 0 1% 1%;}
	.dicila2 .course .course:nth-of-type(3){clear: both;}
	.dicila2 .flow dt{width: 260px;padding:0 5px;}
	.dicila2 .flow dd{padding-left: 265px;}
}

/*1column*/
@media screen and ( max-width : 767px ) {
	#js-map{width: 100%; height: 260px;}
	.contact .btn{margin-top: 2px;}

	.dicila1 .flow dt{margin-bottom: 5px;}
	.dicila2 .flow dt{margin-bottom: 5px;}
	.dicila2 .course img{width: 80px; float: left;}
	.dicila2 .course p{padding-left: 90px;}
}


/*2016.07～
効き肌づくり→スキンアッププログラム*/
/*水色： #c9e6e0
ピンク： #fadce2*/
.clear{clear: both;}
.dicila3 .catch{color:#3aa;}
.dicila3 .price{color:#3aa !important;}
.dicila3 .label {font-size: 12px;width: 18px;height: 18px;margin-right: 3px;padding-top: 2px;border-radius: 50%;}
.dicila3 .label1{background: #83c7cf; color:#fff;}
.dicila3 .label2{background: #f0b1ba; color:#fff;}
.dicila3 .naiyo1{border: #c9e6e0 1px solid;margin-bottom: 10px;}
.dicila3 .naiyo2{border: #fadce2 1px solid;margin-bottom: 10px;}
.dicila3 .sample{background: #ecf5f6;margin: 20px; border-radius: 6px}
.dicila3 .sample h4{color:#3aa;}
.dicila3 .btn{width: 220px;}
@media print, screen and (min-width: 768px){
	.dicila3 .naiyo1, .dicila3 .naiyo2{padding-left: 100px;padding-right:15px;position: relative;}
	.dicila3 .naiyo img{position:absolute; top:-10px; left:15px;width: 80px;}
	.dicila3 .naiyo h4{margin:20px 0 5px;}
	.dicila3 .sample{clear: both;position: relative;padding: 5px 180px 5px 20px;}
	.dicila3 .sample img{position:absolute; top:-10px; right:20px; width: 160px;}
	.dicila3 .course{overflow: hidden;}
	.dicila3 .course div{width: 50%;float: left;}
	.dicila3 .course img{width: 325px;margin-bottom: 5px;}
	.dicila3 .flow img{width: 450px;}
}
@media screen and (max-width: 767px){
	.dicila3 .naiyo img{display: block;margin: 10px auto;width: 90px;}
	.dicila3 .naiyo1, .dicila3 .naiyo2{padding: 0 10px;}
	.dicila3 .sample{padding: 10px 10px 5px;}
	.dicila3 .sample img{width: 150px;display: block;margin: 0px auto;}
}

/*2017.11～
美肌目覚めるオールハンドエステ*/
.dicila4 .catch, .dicila4 .catch small{color:#3aa;}
.dicila4 .price{color:#3aa !important;}
.dicila4 .label {font-size: 12px;width: 18px;height: 18px;margin-right: 3px;padding-top: 2px;border-radius: 50%;background: #83c7cf; color:#fff;}
.dicila4 .minititle{margin:20px 0 5px;}


/*2017.11～
サービスページのナビゲーション*/
.servicenav ul{overflow: hidden;margin: 0 10px 20px;}
.servicenav li{padding: 3px;}
.servicenav li a{display: block;text-decoration: none;padding: 10px;line-height: 1.2;font-weight: bold;background:#c8e5e1;border:#b5dbd6 1px solid;box-shadow:0 1px 2px rgba(0,0,0,0.2); color:#333 !important;}
.servicenav li a:hover{background:#ddeeec;}
@media screen and (min-width: 631px){
.servicenav li{float: left;width: 33.3%;padding: 5px;text-align: center;padding: 5px;text-align: center;}
.servicenav li:nth-child(3n+1){clear: both;}
.servicenav .br::before {content: "\A" ;white-space: pre ;}
}

/*2018.3～*/
@media print{
	body{width:100%;font-size: 12pt;}
	.hcontact{display: none;}
	.gnav li a{font-size:90%;}
}