@charset "utf-8";
/* CSS Document */

body{
	margin:0 0 8% 0;
	padding:0;
	letter-spacing: 1px;
	background-color: #efefef;
	font-family: "メイリオ","Hiragino Kaku Gothic Pro",Meiryo,"ヒラギノ角ゴ Pro W3","MS PGothic","MS UI Gothic",Helvetica,Arial,sans-serif;
}

a{
	text-decoration: none;
}

.header{
	margin: 0;
	padding: 0;
	position:sticky;
	display: inline-block;
	top:0;
	width:100vw;
	text-align: center;
	z-index:50;
	background-color: #FFFFFF;
	box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2);
  	-webkit-box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2);
  	-moz-box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2);
}

.headerbox{
	margin: 0 auto;
    width: fit-content;
    display: inline-block;
}

.header_image{
	display: inline-block;
	vertical-align: middle;
	width: 10%;
}

.header p img{
	width:100%;
}
	
.boxsquare{
	color:#00b050;
	display: inline-block;
	vertical-align: middle;
	font-size: 2vw;
    position: relative;
	right:-1vw;
}

.headerplan{
	display: inline-block;
	vertical-align: middle;
	border-radius: 5px;
	background-color: #00b050;
	padding:5px 2%;
	color:#FFFFFF;
	font-size: 1vw;
	text-align: center;
}


.top{
	width:100%;
	background-image: url(../img/top.jpg);
    padding-bottom: calc(100%*950/1920);/* calc(100*ImageHeight/ImageWidth)% */
    background-size: 100% auto;
}


ul{
	padding:0;
	width:100%;
	margin: 0 auto;
	}
	
li{
	list-style: none;
	width:50%;
	display: inline-block;
	}
	
.main{
	width:95%;
	position: relative;
	background-color:#f6f3e1;
	display: flex;
	margin-top:2%;
	margin-bottom:2%;
	margin-left: auto;
	margin-right: auto;
	box-shadow:0px 0px 5px 0px #bfbfbf;
	font-family: "メイリオ","Hiragino Kaku Gothic Pro",Meiryo,"ヒラギノ角ゴ Pro W3","MS PGothic","MS UI Gothic",Helvetica,Arial,sans-serif;
}	

.shop{
	background-color: #62528b;
	width: 100%;
	position: absolute;
	top: 0;
	z-index: 1;
}

.shop p{
	margin:0 0 0 41%; 
	font-size:1vw;
	font-weight: bold;
	padding:1% 0;
	color: #FFFFFF;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.shop2{
	background-color: #f6b62e;
	width: 100%;
	position: absolute;
	top: 0;
	z-index: 1;
}

.shop2 p{
	margin:0 0 0 41%; 
	font-size:1vw;
	font-weight: bold;
	padding:1% 0;
	color: #FFFFFF;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.shop3{
	background-color: #00b050;
	width: 100%;
	position: absolute;
	top: 0;
	z-index: 1;
}

.shop3 p{
	margin:0 0 0 41%; 
	font-size:1vw;
	font-weight: bold;
	padding:1% 0;
	color: #FFFFFF;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.deli{
	margin:0 2% 0 0;
	display: inline-block;
    width: 23%;
    text-align: center;
	font-size:1vw;
	padding:0 1vw;
	background-color: #ff8bcd;
	color:#FFFFFF;
	border-radius: 5px;
}

.esthe{
	margin:0 2% 0 0;
	display: inline-block;
    width: 23%;
    text-align: center;
	font-size:1vw;
	padding:0 1vw;
	background-color: #5ed297;
	color:#FFFFFF;
	border-radius: 5px;
}

.madam{
	margin:0 2% 0 0;
	display: inline-block;
    width: 23%;
    text-align: center;
	font-size:1vw;
	padding:0 1vw;
	background-color: #d2ad5d;
	color:#FFFFFF;
	border-radius: 5px;
}

.imgbox{
	width:40%;
	z-index: 5; 
	position: relative;"
}

.imgbox img{
	margin:1%;
	padding:1%;
	width:100%;
}

.textbox{
	width:60%;
	line-height: 90%;
	margin: 1% 0 1% 1%;
    padding: 1% 0 1% 1%;
	position: relative;
}

.ichioshi{
	color:#969696;
	font-weight:bold;
	font-size: 1vw;
	margin:8% 0 0 0;
}

.sentence{
	margin:0 0 1% 0;
	padding:1px;
	text-decoration: underline;
	font-size: 1vw;
	font-weight:bold;
	line-height: 135%;
	table-layout: fixed;
	word-wrap: break-word;
	color:#454545;
	overflow: hidden;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.sentence2{
	margin:8% 0 1% 0;
	padding:1px;
	text-decoration: underline;
	font-size: 1.25vw;
	font-weight:bold;
	line-height: 120%;
	table-layout: fixed;
	word-wrap: break-word;
	color:#454545;
}

.price{
	display: inline-block;
	font-size: 1vw;
	font-weight: bold;
	padding:1vw 0.5vw;
	background-color: #ffc000;
	color:#000000;
	border-radius:7px;
	text-align: center;
	line-height: 110%;
}

.price2{
	width: 2.5vw;
	font-size: 1vw;
	font-weight: bold;
	padding: 0.75vw;
	background-color: #FFFD00;
	color:#000000;
	border-radius:7px;
	text-align: center;
	vertical-align: middle;
	line-height: 110%;
	display: table-cell;
}

.fee{
	font-size: 1.5vw;
	font-weight: bold;
	line-height:100%;
	font-weight: bold;
	vertical-align: middle;
	padding-left: 0.5vw;
	margin:0;
	color:#ff0000;
	table-layout: fixed;
	display: table-cell;
    word-wrap: break-word;
}

.pricebox{
	padding:0 0 0 0.5vw;
	margin:1.5vw 0 1vw 0;
}

.combo{
	font-size: 0.75vw;
	width:2vw;
	overflow: visible;
	line-height: 3vw;
	-webkit-transform: rotate(-180deg);
	position: relative;
	text-align: center;
	text-decoration: none;
	color: #FFF;
	font-weight: bold;
	text-shadow: 0 0 3em #fe0000, 0 0 4px #fe0000;
	-moz-transition: -moz-transform 0.3s ease;
	-webkit-transition: -webkit-transform 0.3s ease;
}

.combo span{
	display: block;
	width: 3vw;
	height: 3vw;
	background: #fe0000;
	-webkit-transform: rotate(20deg);
	-moz-transform: rotate(20deg);
}

.combo p{
    vertical-align: middle;
    padding: 0.75vw 0;
    width: 100%;
	white-space: nowrap;
    line-height: 100%;
}

.course{
	font-size: 1vw;
	font-weight: bold;
	line-height:120%;
	font-weight: bold;
	display: table-cell;
	vertical-align: middle;
	padding-left: 1vw;
	margin:0;
	color:#ff0000;
	table-layout: fixed;
    word-wrap: break-word;
}

.botan{
	margin: 2% 0 0 0;
	height:4vw;
	font-weight: 600;
	font-size: 1.2vw;
	display: table;
	padding:0% 1% 0% 2%;
	width: 93%;
	position:absolute;
	bottom: 0;
	color:#000000;
	background-color: #FF0004;
}

.footbox1{
	background-color: #fcac00;
	border-radius:2px;
	display: inline-block;
	padding:1% 0;
	margin: 0 1% 0 0;
	width:20%;
	opacity: 1;
	color:#FFFFFF;
	box-shadow:0px 0.5vw 0px 0px #d99400;
}

.footbox2{
	background-color: #62528b;
	border-radius:2px;
	display: inline-block;
	padding:1% 0;
	margin: 0 1% 0 0;
	width:20%;
	opacity: 1;
	color:#FFFFFF;
	box-shadow:0px 0.5vw 0px 0px #443866;
}

.footer{
	background-color: rgba(0,0,0,0.7);
	width:100vw;
	position: fixed;
	display: inline;
	bottom:0;
	z-index:100;
	color:#FFFFFF;
	font-weight: bold;
	font-family: "メイリオ","Hiragino Kaku Gothic Pro",Meiryo,"ヒラギノ角ゴ Pro W3","MS PGothic","MS UI Gothic",Helvetica,Arial,sans-serif;
	padding:1% 0 2% 0;
	font-size: 1vw;
	text-align: center;
}

.footer a:active{
	box-shadow:0 0 0 0 #de4d4d;
}