@charset "utf-8";
@import "common.css";
/* CSS Document */
.display-sp {display: none;}
.sp{display:none;}

.center{text-align:center;}
.right{text-align:right;}
.sec {margin: 4em auto;}
.box{margin:2em 0;}

/*pageトップ画像*/

.page_top{
	padding-top:110px;
}
.page_top img{width:100%;}
.page_top .catch_area{
	background:#6f9cff;
	padding:10px 0;
	margin:0 auto 2em;
	text-align:center;
}
.page_top .catch_area h1{
	font-size:18px;
	color:#fff;
	font-weight:bold;
}

/*page共通CSS
-------------------------------------------------------------*/
#contents .page{padding:0 0 2em 0;}
#contents h2 {
	font-family: Century Gothic;
	font-size: 2.25rem;
	margin-bottom: 30px;
	text-align: center;
	color: #4664a3;
	background-image: url(../images/04.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	padding:10px 0;
	position:relative;
}
#contents .page h3{
	font-size:32px;
	border-bottom:dotted 1px #ccc ;
	margin:1em 0 1em 0;
	display:flex;
	flex-wrap:warap;
	justify-content:space-between;
	align-items:flex-end;
	color:#636363;
}
#contents .page h3 span{font-size:12px; color:#888;}
#contents .page .box{
	margin:1em 0;
	padding:20px;
	background:#f8f8f8;
}
#contents .page h4{
	font-size:21px;
	margin:0 0 1em 0;
}
#contents .page h5{
	font-size:18px;
	margin:0 0 1em 0;
}

#contents .page p{
	margin:0 0 1em 0;
}
#contents .page .notes{font-size:80%;}
#contents .page table.tbl_price{
	border-collapse: collapse;
  border-spacing: 0;
	margin:0 0 1em 0;
}
#contents .page table.tbl_price tr:nth-child(2n-1){
	background:#e6f9f9;
}

#contents .page table.tbl_price th,
#contents .page table.tbl_price td{
	padding:.5em 1.5em;
	line-height:2em;
}

#contents .page table.tbl_price td{text-align:right;}
#contents .page table.tbl_price td span{font-size:14px;}

#contents .page ul li{
font-size:120%;
line-height:2em;
}


/*block*/
#contents .block h2 {
	margin: 0 auto 30px;
	width:80%;
	max-width:400px;
	padding:0;
	color:#3b62ad;
	/*font-size: 48px;
	background-color: #3b62ad;*/
	background-image: none;
	border:solid 2px #3b62ad;
}


#contents .topmenu h2 a {
	color:#3b62ad;
	display:block;
	font-size:36px;
	padding:1rem 0;
}
#contents .topmenu h2 a:hover {
background-color:#3b62ad;
color:#fff;
opacity:1;
}
/*prof*/
#contents .page .prof_item01{
	flex:1;
}
#contents .page .prof_item02{
	width:15%;
	margin:0 0 0 50px;
	padding:40px 4% 20px;
	background:#fefefe;
	border:solid 1px #ccc;
	position:relative;
}
#contents .page .prof_item02 h4{
	position:absolute;
	left:-10px;
	top:5px;
	background:#fff;
	padding:5px 20px;
	border:solid 1px #ccc;
	border-left:solid 5px #3a9190;
	font-size:16px;
}
#contents .page .prof_list li{
	margin:0;
	padding:10px 0;
	border-bottom:dotted 1px #ccc;
	font-size:14px;
}
#contents .page .prof_list li:before{
	content:"\0025cf";
	color:#ccc;
	margin:0 5px 0 0;
}



/*menu*/
#contents .page .info_box{
	padding:60px 4% 20px;
	background:#fefefe;
	border:solid 1px #ccc;
	position:relative;
}
#contents .page .info_box h4{
	position:absolute;
	left:-10px;
	top:5px;
	background:#fff;
	padding:5px 20px;
	border:solid 1px #ccc;
	border-left:solid 5px #3a9190;
	font-size:16px;
}
#contents .page .info_box p{
	font-size:14px;
}
#whitening p{text-align:right;}
#whitening a{
	display:inline-block;
	background:#3b62ad;
	color:#fff;
	padding:10px;
}


/*concept*/
#concept .block p{
	text-align:center;
	line-height: 2em;
}
#concept img{display:block; margin:0 auto 40px; width:320px;}
/*reserve*/
#reserve p{text-align:center; padding-bottom:30px;}
#reserve .col2{
	/*align-items:center;*/
}
#reserve .contact {
	width: 48%;
}
#reserve .contact ul.contact_list{
	display:flex;
	flex-wrap:warp;
	justify-content:center;
	margin:0 0 20px 0;
}
#reserve .contact ul.contact_list li{
	width:30%;
	padding:0 1%;
}
#reserve .contact ul.contact_list li a{
	padding:20px 10px;
	font-size:14px;
	display:block;
	border-radius: 9px;
	text-align:center;
	color:#fff;
}
#reserve .line a{background-color: #08bf5b;}
#reserve .mail a{background:#3b62ad;}
#reserve .tel a{background:#eb6877;}


#reserve .contact ul.contact_list li a span{display:block; margin:0 0 5px 0;}


#reserve .calendar {
	width: 48%;
}
.calendar #calendarTitle{background:#ccc; color:#fff;}



/*コンタクト*/
#formWrap p.policy {
	padding-top:30px;
}
#formWrap input[type=text]{
	padding:5px;
}
#formWrap input[type=checkbox]{
	width:20px;
	height:20px;
	float:left;
	margin:8px 5px 0 0;
}
#formWrap input[type=radio]{
	width:18px;
	height:18px;
		float:left;
	margin:8px 5px 0 0;
}
#formWrap {
	width:100%;
	margin:0 auto;
	color:#555;
	line-height:120%;
	font-size:16px;
}
#formWrap .menu_list{
	display:flex;
	flex-wrap:wrap;
}
#contents #formWrap .menu_list li{
	width:32%;
	margin:0 0 5px 0;
	font-size:16px;
}
#contents #formWrap .menu_list li.set_list{
	width:100%;
}
	#formWrap .reserve p.select{font-size:14px; padding:0 0 0 1em;}
table.formTable{
	width:100%;
	margin:0 auto 30px;
	border-collapse:collapse;
}
table.formTable td,table.formTable th{
	border:1px solid #ccc;
	padding:15px;
}
table.formTable th{
	width:23%;
	font-weight:normal;
	background:#efefef;
	text-align:left;
}
	table.formTable span {
		font-size: 14px;
		color:#e0505d;
	}
	table.formTable td .notes {
		padding: 10px 0;
		font-size:14px;
		color:#666;
	}
	input.submit {
		background-color: #eb6877;
		border:0;
		color:#fff;
		font-size:16px;
		padding: 10px 15px;
	}
	input.reset {
		border:0;
		color:#333;
		font-size:16px;
		padding: 10px 15px;
	}
	.button input:hover {
		transition: 0.2s;
		opacity: 0.7;
	}
	

@media screen and (max-width:572px) {
#formWrap {
	width:95%;
	margin:0 auto;
}
table.formTable th, table.formTable td {
	width:auto;
	display:block;
}
table.formTable th {
	margin-top:5px;
	border-bottom:0;
}
input[type="text"], textarea {
	width:80%;
	padding:5px;
	font-size:110%;
	display:block;
}
input[type="submit"], input[type="reset"], input[type="button"] {
	display:block;
	width:100%;
	height:40px;
}
#contents #formWrap .menu_list li{width:100%; font-size:14px;}


}




/*後で削除*/
#galley ul{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#galley ul li {
	background-color: #ccc;
	margin-bottom:2.5em;
	width: 300px;
	height: 300px;
}
/*追加ルビ*/
#contents .page h2 span.ruby {
	font-size:14px;
	display: flex;
	justify-content: center;
}