@charset "UTF-8";

/* layout
++--------------------------------------------++*/
.sec1 ul{margin: 0 auto;}

/*.sec1-div1{
	width: 900px;
	margin: 0 auto;}*/

h2{font-size: 32px; font-size: 3.2rem;}
h3{font-size: 16px; font-size: 1.6rem;}

.menu-banner img{
	display: block;
	margin: 0 auto 3em;}

/* sec 1
++--------------------------------------------++*/
.sec1{
	padding: 1em 0 0;}

.sec1 h2{
	color: var(--color-main);
	padding: 0 0 0.5em;
	text-align: center;}

.sec1 ul{
	border-top: 2px solid var(--color-bk4);
	margin-bottom: 2em;
	padding: 1em 0 2em;}

.sec1 ul li{
	font-size: 19px; font-size: 1.9rem;}

.sec1 ul li:before{
	font-family: "FontAwesome";
	content: "\f046";
	font-size: 21px; font-size: 2.1rem;
	color: var(--color-accent2);
	margin-right: 0.5em;}

@media (min-width: 768px){
	.sec1 ul li{
		padding: 0.5em 0 0.5em 4em;}
	.sec1 ul li:before{
		padding-left: 2em;}
}

@media (max-width: 767px){
	.sec1 ul li{
		padding: 0.5em 0;}

	.sec1 ul li:before{
		padding-left: 0.5em;}
}


/* sec 2
++--------------------------------------------++*/
.sec2{
	background: linear-gradient(rgba(255,255,255,0.7), rgba(255,255,255,0.7)),
							url(../../../uploads/img/facial/05.jpg) center -600px no-repeat,
							#180906;
	padding: 3em 0;
	margin: 0 auto 3em;}

.sec2 h2{
	font-family: var(--font-mincho);
	padding: 0 .5em 0.5em;
	letter-spacing: 0.5em;
	text-align: center;}

@media (min-width: 1025px){
	.sec2{height: 650px;}

	.sec2-relative{position: relative;}

	.sec2-p1, .sec2-p2{
		position: absolute;
		color: #1a1a1a;
		background: rgba(255,240,230,0.8);
		padding: 1em 2em;
		z-index: 2}

	.sec2-p1{
		width: 450px;
/*		left: 0px;*/
		left: 45%;
		right: 50%;
		transform: translate(-50%, 0%);
/*		margin-top: 3em;*/
/*		margin: 0 auto;*/
	}

	.sec2-p2{
		width: 450px;
		top: 340px;
/*		left: 40px;*/
		left: 55%;
		right: 50%;
		transform: translate(-50%, 0%);
/*		margin: 0 auto 40px;*/
	}

	.sec2-relative img{
		position: absolute;
		top: 130px;
		left: 470px;
		width: 500px;
		opacity: 1.0;
		z-index: 1;}
}

@media (max-width: 1024px){
	/*.sec2{height: 400px;}*/
	.sec2 h2{
		font-size: 24px; font-size: 2.4rem;
		margin: 1em 0;}

	.sec2-p1, .sec2-p2{
		color: #1a1a1a;
		background: rgba(255,240,230,0.8);
		padding: 1em 2em;
		z-index: 2;}

	.sec2-p1{
		position: relative;
		width: 75%;
/*		margin: 1em 0 2em 4em;*/
		margin: 0 auto 2em;}

	.sec2-p2{
		position: relative;
		width: 75%;
/*		float: right;*/
/*		margin: 0 4em 2em 0;*/
		margin: 0 auto;
		z-index: 3;}

	.sec2-relative img{
		/*position: absolute;*/
		display: block;
		clear:both;
		margin: 0 auto;
		/*margin: 0 auto;*/
		width: 70%;
		opacity: 0.8;
		/*left: 5em;*/
		z-index: 1;}
}


/* menu popup
++--------------------------------------------++*/
.menuprice-sec dl dt span{
	font-size: 14px; font-size: 1.4rem;
	padding-right: 0.5em;}

@media (min-width: 768px){
	.menuprice-sec dl dt{
		margin-left: 0.5em;}

	.menuprice-sec dl dd span{
		right: -5em;}
}