﻿@charset "utf-8";

/*--1em=16px 960/12grid(1col 8.3333%)--*/

html {
font-size: 75%;/*12px*/
line-height: 2;/*18px*/
color: #0f0f0f;
font-family: Abel,Hiragino Kaku Gothic Pro, Yu Gothic, Meiryo, MS PGothic, sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
background:white;
}

.contents {
width: 91.6663%;
margin: 0 auto;
padding: 1.5em 0;
}

body, ul,ol, dl, dd {
margin: 0;
padding: 0;
}

main {
display: block;
}

section {
margin-bottom:3em;
}

/* ----- img ----- */

img {
max-width: 100%;
vertical-align: middle;
height: auto;
}
.center img {
display: block;
margin: 0 auto;
}

.float_r, .float_l {
padding: 1.5em 0;
}
.float_l_kiji,.float_r_kiji{
margin:0 4.16665%;

}
.float_l_kiji br,.float_r_kiji br{
display:none;
}
.float_l img,.float_r img{
width:100%;
}

/* ----- list ----- */

ul li, dt, dd {
margin: 0;
list-style: none;
}
ol li {
list-style-position: inside;
}
dt {
font-weight: bolder;
}

/* ----- font ----- */

h1, h2, h3, h4, h5{
font-weight: lighter;
}
.contents p br {
display: none;
}
h1,h2,h3,.min,
.address_menu_btn,
.rightmenu_name,
.a:before,.money:before,footer{
font-family:Times New Roman,A1 Mincho, YuMincho,Hiragino Mincho ProN,Meiryo, serif;
}

h1 {
font-size: 200%;/*32px*/
line-height: 1.125;/*36px*/
letter-spacing: .5em;
}
.center h1 {
margin-left: .5em;
}
h2 {
font-size: 150%;/*24px*/
line-height: 1.5;/*36px*/
}
h3 {
font-size: 125%;/*20px*/
line-height: 1.8;/*36px*/
}
h4 {
font-size: 100%;/*16px*/
line-height: 3;
}

a {
text-decoration: none;
color: #bf9436;
background: transparent;
}
a:hover {
color: #a56f11;
outline: 0;
}

a:hover img {
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
a img {
	-webkit-filter: grayscale(0);
	filter: grayscale(0);
}

strong {
font-weight: bolder;
}
small,.small {
font-size: 50%;
}
.right {
text-align: right;
}
.center {
text-align: center;
}
.gold {
color: #bf9436;
}
.red {
color: red;
}
.orange, .orange a {
color: #ff9900;
}
.purple, .purple a {
color: #975899;
}
.green, .green a {
color: #8dd60d;
}

.pink,.pink a {
color: #ec6d74;
}

/* ----selection-----*/

::selection {
background: #e7e7e7;
}

::-moz-selection {
background: #e7e7e7;
}

/* ----- bg&line ----- */

.bg_green {
background: #99ff00;
}
.bg_orange {
background: #ff9900;
}
.bg_purple {
background: #975899;
}
.bg_gold {
background: #bf9436;
}
.bg_gold,.bg_gray,.bg_black {
color: white;
}
.bg_black {
background: #0f0f0f;
}
.bg_gray{
background: #222;
}
.bg_pink {
background: #ec6d74;
}
.bg_tone {
background: url(../images/movie_bg.png);
}
.bg_dot {
background:url(../images/hairloss/bg_flow@2x.png);
background-size:cover;
background-attachment:fixed;
}

.line_gray,.line_pink {
margin-bottom: 3em;
padding: .75em 4.1666%;
background:rgba(255,255,255,.1);
border-radius:1.5em;
box-sizing:border-box;
}
.line_pink {
border: 1px solid #ec6d74
;
}
.line_gray {
border: 1px solid #e7e7e7;
}

.line_gray>ul>li{
border-bottom:1px solid gray;
}

.line_gray>ul>li:last-child{
border-bottom:none;
}

.q:before,.a:before,
.money:before {
font-size:150%;
padding-right:.5em;
content: "A";
}

.q:before {
content: "Q";
}

.a:before {
content: "A";
}

.money:before {
content: "￥";
}

/* ----- col ----- */

.lound {
overflow: hidden;
}

.col2,.col3 {
	text-align:justify;
}
.col3>li p a{
	display:block;
	text-align:center;
	width:100%;
	border:black .25em solid ;
}
.col3>li p a:hover{
	background:black;
	color:white;
}


/* ----- clear ----- */
header:after,
.col2:after,.col3:after,
#top_telsp dl:after,
#staff dl:after,#staff h2:after,
.com dl:after,
#drawer_menu:after,
.address:after,
.address_shop:after,
.address_shop ul:after,
.contents dl:after,
.float_l:after,.float_r:after,
#second_menu:after,
#leftmenu :after,
#shop_menu dl:after,
#shop_menu ul:after,
#shop_menu section:last-child,
#loss_menu dl:after,
#loss_menu section:last-child{
display: block;
clear: both;
content: '';
}

/* ----- drawer_menu ----- */

#logo {
display: none;
}
#drawer_menu {
width: 66.6666%;
right: -66.6666%;
background: #0f0f0f;
font-size: 150%;/*24px*/
line-height: 2.5;/*36px*/
top: 0;
z-index: 9998;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
}
.close {
line-height: 4;/*64px*/
}
#drawer_menu li a, #drawer_menu li a:hover, #drawer_menu .close:hover {
color: white;
}
#drawer_menu li {
list-style: none;
}
#drawer_menu li a, #drawer_menu .close {
padding: 0 8.3333%;
}
#drawer_menu li a, #drawer_menu .close {
display: block;
}
#drawer_menu li a:hover {
background: black;
}
#drawer_menu.block {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
#drawer.block:not(:target) {
right: 0\9;
}
#drawer_menu .close {
position: relative;
background: white;
}
#drawer_menu .close:hover {
cursor: pointer;
background: #888;
}
#drawer_menu .close:after {
content: "";
position: absolute;
top: 0;
right: 0;
}
#drawer_menu_overlay {
z-index: -1;
transition: 0.3s;
background: rgba(0, 0, 0, 0.3);
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0;
}
#drawer_menu_overlay.block {
z-index: 5;
filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
opacity: 1;
}
header, #drawer_menu .close:after, #drawer_menu_overlay, #drawer_menu_overlay_android {
width: 100%;
}
#drawer_menu, #drawer_menu .close:after, #drawer_menu_overlay, #drawer_menu_overlay_android {
height: 100%;
}
#drawer_menu, #drawer_menu_overlay, #drawer_menu_overlay_android {
position: fixed;
}
#drawer_menu_overlay, #drawer_menu_overlay_android {
right: 0;
top: 0;
}
#drawer_menu_overlay_android {
display: none;
background: rgba(0, 0, 0, 0.5);
}

#menu_btn,
.menu_btn_text {
color: white;
}

#menu_btn {
position: fixed;
z-index: 9997;
top: 1em;
right: 4.1666%;
display: block;
width: 3em;
height: 4em;
cursor: pointer;
opacity: .8;
background: #0f0f0f;
text-align: center;
}

#menu_btn:hover {
opacity: .5;
}

.menu_btn_text {
font-size: 1rem;
line-height: 3;
font-weight: bold;
position: absolute;
bottom: -.75em;
right: 0;
left: 0;
display: block;
visibility: visible;
margin: auto;
-webkit-transition: all .5s;
transition: all .5s;
}

.bar {
position: absolute;
top: 0;
left: 0;
background: white;
display: block;
width: 100%;
height: .25em;
-webkit-transition: all .5s;
transition: all .5s;
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
transform-origin: left top;
}
.bar.middle {
top: 1em;
opacity: 1;
}
.bar.bottom {
top: 2em;
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
}

/* ----- top ----- */

#topmenu {
text-align:center;
padding: 1.5em 0;
position: relative;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

#top_telsp dt {
width: 41.6666%;
clear: left;
float: left;
}
#top_telsp dd {
text-align:right;
font-size: 150%;
line-height: 1.3333;
letter-spacing: .05em;
}

.top_edagawa {
background: url(../images/top_edagawa_sm.jpg) right center no-repeat #0f0f0f;
}
.top_est {
background: url(../images/top_est_sm.png) right center no-repeat #0f0f0f;
}
.top_lavie,.top_standard{
background: url(../images/top_lavie_sm.png) top center no-repeat #0f0f0f;
}
#topmenu_copy {
font-size: 0.75em;/*12px*/
color: white;
line-height: 2;
}
#topmenu_copy img {
margin: 0 auto;
}
#topmenu_subcopy {
text-align: center;
font-size: 2.5em;
line-height: 1.2;
color: #99ff00;
}
#topmenu_second {
height: 15em;
}
.topsecond_edagawa {
background: url(../images/logo_edagawa.png) center center no-repeat #0f0f0f;
}
.topsecond_est {
background: url(../images/logo_est.png) center center no-repeat #0f0f0f;
}
.topsecond_standard {
background: url(../images/logo_standard.png) center center no-repeat #0f0f0f;
}

#leftmenu {
font-size: 1.5em;
font-family:'Times New Roman', 'Yu Mincho', 'Hiragino Mincho Pro', 'MS Mincho', sans-serif;
}

#leftmenu li {
width:50%;
float:left;
background: url(../images/ico_arrow.png) 90% 50% no-repeat;
border-bottom: 1px solid #0f0f0f;
}

#leftmenu li.last{
border:none;
}

#leftmenu li a {
padding: 0 8.3333%;
display: block;
color: #0f0f0f;
}
#leftmenu li a:hover {
background: url(../images/ico_arrow.png) 90% 50% no-repeat #bf9436;
}
#leftmenu li a.active {
color: white;
background: url(../images/ico_arrow_a.png) 90% 50% no-repeat #0f0f0f;
}
.rightmenu {
display: none;
}
#second_menu {
background: white;
overflow: hidden;
}
#second_menu img{
width: 100%;
}

/* ----- shop&datsumou menu ----- */


#shop_menu section,#loss_menu section {
padding: 0 8.3333%;
}
#shop_menu dt {
width: 66.6666%;
}
#shop_menu dd {
width: 33.3333%;
}

#shop_menu dd,
#loss_menu dd {
text-align: right;
}

#shop_menu li{
list-style-type: square;
list-style-position:inside;
margin-right:2em;
}

#shop_menu li,
#shop_menu dt,#shop_menu dd,
#loss_menu dt,#loss_menu dd {
float: left;
}

#shop_menu h3,#shop_menu h4,
#loss_menu h3,#loss_menu h4,#loss_menu h5{
display: block;
text-align: center;
padding: 0 8.3333%;
}

#shop_menu h3,#loss_menu h3{
color: black;
background: #e7e7e7;
}

#shop_menu h4,#loss_menu h4{
background: #0f0f0f;
color:#bf9436;
}

#loss_menu h5{
background: #ffe2dc;
}

#loss_menu dt {
width: 25%;
}
#loss_menu dd {
width: 75%;
}

/* ----- staff ----- */


#staff,
#staff dt,.com dt {
text-align:center;
}

#staff p{
margin:0;
}

#staff>li{
padding:1.5em 0;
}

#staff img {
width: 50%;
border-radius: 50%;
}

#staff>li:nth-child(odd) {
background: #0f0f0f;
}

#staff>li:nth-child(odd) dd,
#staff>li:nth-child(odd) p{
color: white;
}

#staff dl {
width: 83.3333%;
margin:0 auto;
}

#staff dt,.com dt {
width: 25%;
margin-right:1.5em;
background: #e7e7e7;
float:left;
clear:left;
}

#staff dd,.com dd {
text-align:left;
overflow:hidden;
margin-bottom:1.5em;
}

#staff dd:last-child {
margin-bottom:0;
}

/* ----- calender ----- */

.embed-container {
position: relative;
padding-bottom: 200%;
height: 100%;
}
.embed-container iframe,
.embed-container object,
.embed-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/* ----- pagetop ----- */

#pagetop {
font-size: .75em;
line-height: 2;/*24px*/
color: white;
display: block;
position: fixed;
bottom: 1.5em;
right: 4.1666%;
padding: 0 2.0833%;
background: #7e7a7a;
border-radius: .5em;
-webkit-border-radius: .5em;
-moz-border-radius: .5em;
-ms-filter: "alpha(opacity=80)";
-moz-opacity: .8;
-khtml-opacity: .8;
opacity: .8;
}
#pagetop:hover {
background: red;
color: white;
}
/* ----- footer ----- */


.address{
text-align: center;
}

.address p {
letter-spacing: 0.75em;
color: #666;
font-size: 50%;
}

.address img {
width:75%;
margin-bottom:1.5em;
border-radius: 50%;
}
.address_shop {
position:relative;
}

.address_menu_btn {
font-size: 2em;/*16px*/
line-height: 1.5;/*24px*/
background: #bf9436;
color: #0f0f0f;
margin-bottom: .75em;
}
.address_menu_btn:hover {
background: white;
color: #bf9436;
}

.address_menu_btn,
.fb,.blog {
display: block;
}

.fb,.blog {
width: 3rem;
height: 3rem;
text-align:center;
font-size: 1.5em;
line-height: 2;
font-weight: bolder;
border-radius: 50%;
color: #0f0f0f;
background: #999;
}

.fb:hover,.blog:hover {
color: white;
}
.fb:hover {
background: #3B5998;
}
.blog:hover {
background: #2c8b3b;
}

#staff>li .fb,
#staff>li .blog,
.address_shop .fb {
position:absolute;
}

#staff>li .fb,
.address_shop .fb {
right:8.3333%;
}

#staff>li .blog{
right:20.0833%;
}

.address_shop .fb {
top:0;
}

/* ----- footer ----- */

footer {
text-align: center;
color: #888;
clear: both;
}

/* ----- respons ----- */

@media screen and (min-width:480px) {
.contents {
width: 83.333%;
}
.float_l img,.float_r img{
width:45.8334%;
}

.float_l_kiji,.float_r_kiji{
width:50%;
}

.float_l_kiji br,.float_r_kiji br{
display:inline-block;
}

.float_l_kiji{
margin:0 0 0 4.1666%;
}

.float_r_kiji{
margin:0 4.1666% 0 0;
}

.float_r img{
float: right;
}

.float_l_kiji,.float_r_kiji,.float_l img{
float: left;
}

.float_price {
width:100%;
float: none;
}
}

@media screen and (min-width:768px) {
header {
width: 100%;
}

.col2>li{
	width:41.6666%;
	margin:0 4.1666%;
	float:left;
}

.col3>li{
	width:25%;
	margin:0 4.1666%;
	float:left;
}

.contents p br{
display:inline-block;
}

header,#drawer_menu,
#drawer_menu li a:hover {
background: white;
}

#logo {
width:16.6666%;
margin-right: 4.1666%;
display: block;
float: left;
}

#menu_btn,
#drawer_menu .close,
.bar,
#top_telsp,.top_lavie,
.menu_btn_text {
display: none;
}

#drawer_menu {
transform: none;
opacity: 1;
width: 91.6666%;
margin:1.5em auto;
position: relative;
right: 0;
font-size: 100%;/*16px*/
line-height: 3;/*48px*/
}

#drawer_menu li {
float: left;
margin: 0 1.4165%;
vertical-align: bottom;
}
#drawer_menu li a {
color: #0f0f0f;
padding: 0;
}
#drawer_menu li a:hover {
color: red;
}

.fixed {
position: fixed;
top:0;
z-index: 9996;
border-bottom:1px solid #eee;
}

#player {
height: 20em;/*320px*/
}

#topmenu {
position: relative;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
height: 30em;/*480px*/
}
.top_edagawa {
background: url(../images/top_edagawa_bg.jpg) right center no-repeat;
}
.top_est {
background: url(../images/top_est_bg.jpg) right center no-repeat;
}
.top_standard {
background: url(../images/top_lavie.jpg) right center no-repeat;
}
#topmenu p {
display: block;
-moz-text-shadow: 0 0 5px black;
-webkit-text-shadow: 0 0 5px black;
text-shadow: 0 0 5px black;
}
#topmenu_copy {
font-size: 0.75em;/*12px*/
color: white;
line-height: 2;
position: absolute;
bottom: 0;
left: 4.1666%;
margin: 0;
}
#topmenu_copy img {
margin: 0;
}
#topmenu_subcopy {
position: absolute;
bottom: 0;
right: 4.1666%;
font-size: 300%;
}

#leftmenu {
width: 25%;
font-size: 1.25em;
float: left;
display: block;
}

#leftmenu li {
width:100%;
float:none;
}

#leftmenu li.last{
border-bottom: 1px solid #0f0f0f;
}

.rightmenu {
display: block;
float: left;
width: 50%;
height: 27em;/*432px*/
overflow: hidden;
position: relative;
background: #0f0f0f;
color: white;
}
.rightmenu img {
width: 100%;
}
.rightmenu a img {
-webkit-transform: rotate(0) scale(1);
transform: rotate(0) scale(1);
}
.rightmenu a:hover img {
-webkit-transform: rotate(15deg) scale(1.4);
transform: rotate(15deg) scale(1.4);
-webkit-transition: .3s ease-in-out;
transition: .3s ease-in-out;
}
.rightmenu_name {
position: absolute;
bottom: 1.5em;
right: 0;
text-align: center;
padding: 2.0833% .5em;
border-top: 1px solid white;
border-left: 1px solid white;
border-bottom: 1px solid white;
background: #0f0f0f;
font-size: 3em;
line-height: 1;
}
.rightmenu_comment {
position: absolute;
right: 4.1666%;
bottom: 0;
-moz-text-shadow: 0 0 5px black;
-webkit-text-shadow: 0 0 5px black;
text-shadow: 0 0 5px black;
}

#staff h2, #staff p{
text-align: left;
}

#staff>li:nth-child(1n) {
background: #0f0f0f;
}

#staff>li:nth-child(1n) dd,
#staff>li:nth-child(1n) p{
color: white;
}
		
#staff>li:nth-child(4n+1),
#staff>li:nth-child(4n+4) {
background: white;
}

#staff>li:nth-child(4n+1) dd,
#staff>li:nth-child(4n+4) dd,
#staff>li:nth-child(4n+1) p,
#staff>li:nth-child(4n+4) p{
color: #0f0f0f;
}

#staff img {
width: 25%;
float: left;
margin: 0 8.3333% 1.5em 0;
}
#staff>li {
width: 41.6667%;
float: left;
padding: 1.5em 4.1666%;
position:relative;
}

.address img {
width:25%;
float:left;
margin-right:16.6666%;
}
.address_shop {
width:58.3333%;
text-align: left;
overflow:hidden;
}

.address_shop li{
float:left;
margin-right:1em;
}

.address_shop h2 br {
display:none;
}

.address_menu_btn {
width:75%;
text-align:center;
}
.address_shop .fb {
top:auto;
}
}

@media screen and (min-width:960px) {
.contents {
width: 66.6666%;
}

.embed-container {
padding-bottom: 56.25%;
}
}

@media screen and (min-width:1024px) {
html {
font-size: 100%;/*16px*/
line-height: 2.5;/*40px*/
}

#shop_menu section,
#loss_menu section {
width: 33.3333%;
float: left;
font-size:87.5%;
margin-bottom:3em;
}

#shop_menu h2,
#loss_menu h2{
font-size: 150%;
}

#loss_menu dl,
#loss_menu h3,
#loss_menu h4{
font-size: 75%;
}

#loss_menu dt {
width: 30%;
}
#loss_menu dd {
width: 70%;
}

#loss_menu dl{
font-size:100%;
}
#loss_parts li{
float:left;
width: 50%;
}
}


@media screen and (min-width:1280px) {
#drawer_menu {
font-size: 112.5%;/*18px*/
line-height: 2.6666;/*48px*/
}
}

@media screen and (min-width:1600px) {
#drawer_menu {
width:75%;
}
#leftmenu {
font-size: 1.75em;
}
#player {
height: 30em;/*480px*/
}
#topmenu_copy {
bottom: 0;
left: 12.5%;
}
#topmenu_subcopy {
bottom: 0;
font-size: 500%;
}
.rightmenu {
height: 40em;/*640px*/
}
.rightmenu_comment {
font-size: 200%;
}
.rightmenu_name {
font-size: 500%;
}
}

@media screen and (min-width:1900px) {
html {
font-size: 125%;/*20px*/
line-height: 2.4;/*48px*/
}

#drawer_menu,.contents {
width:66.6666%;
}

}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
#drawer_menu.block_ie10 {
-webkit-transform: translate3d(-75%, 0, 0) !important;
transform: translate3d(-75%, 0, 0) !important;
}
}

@media print {
header, .menu_btn_text, #drawer_menu, #topmenu, #topmenu_second, #leftmenu {
display: none;
}
}

/* ===============================================
# MENUの削除：テキスト追加
=============================================== */

@media screen and (min-width: 768px) {
	.rightmenu_notice {
			position: absolute;
			top: 45%;
			left: 50%;
			transform: translate(-50%, -50%);
			white-space: nowrap;
			font-size: clamp(1rem, 0.423rem + 1.2vw, 1.625rem);
			font-weight: 500;
			-moz-text-shadow: 0 0 5px black;
			-webkit-text-shadow: 0 0 5px black;
			text-shadow: 0 0 5px black;
		background-color: #000;
		padding: 5px 15px;
		line-height: 1.5;
	}
}