/*==============================*/
/* タイトル */
/*==============================*/
.title{
	position: relative;
	font-size: 20px;
	color: #555555;
	font-weight: 400;
	font-family: 'Noto Sans Japanese', sans-serif;
	margin-bottom: 30px;
	padding: 15px 0;
	text-align: center;
}
.title:after{
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -150px;
	content: "";
	width: 300px;
	height: 2px;
	background: #0e9b6d; /* Old browsers */
	background: -moz-linear-gradient(left,  #0e9b6d 0%, #4ac38d 50%, #8ff5b8 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #0e9b6d 0%,#4ac38d 50%,#8ff5b8 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #0e9b6d 0%,#4ac38d 50%,#8ff5b8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0e9b6d', endColorstr='#8ff5b8',GradientType=1 ); /* IE6-9 */


}
	@media (max-width: 600px) {
		.title{
			font-size: 16px;
			font-weight: 600;
			margin-bottom: 10px;
			padding: 13px 0;
		}
		.title:after{
			position: absolute;
			content: "";
			width: 300px;
			height: 2px;
		}
	}

/*==============================*/
/* サブタイトル */
/*==============================*/
.sub_title{
	margin-bottom: 5px;
	font-size: 17px;
	font-weight: 400;
	font-family: 'Noto Sans Japanese', sans-serif;
	color: #C4A15D;
}
@media (max-width: 600px){
	.sub_title{
        margin-bottom: 5px;
	}
}

/*==============================*/
/* シンプルタイトル */
/*==============================*/
.simpleTitle{
    margin-bottom: 16px;
	font-size: 20px;
	font-weight: 400;
    color: #555555;
	font-family: 'Noto Sans Japanese', sans-serif;
}

/*==============================*/
/* サムネイル */
/*==============================*/
img.tmb{
	padding: 4px;
	border: #ccc solid 1px;
	height: auto;
	box-sizing: border-box;
}

/*==============================*/
/* ボタン */
/*==============================*/
.btn a{
	display: inline-block;
	color: #fff;
	background: #4e4d4a;
	padding: 3px 24px;
	border-radius: 5px;
	font-size: 12px;
}
.btn a:hover{
	background: #666;
}
/*==============================*/
/* ボタン */
/*==============================*/
.btn_default a{
	display: inline-block;
	color: #fff;
	background: #009989;
	padding: 15px 60px;
	border-radius: 5px;
	font-size: 16px;
}
.btn_default a:hover{
	background: #1d796f;
}
	
/*==============================*/
/* table */
/*==============================*/
table{
    width: 100%;
    margin-bottom: 20px;
	font-size: 13px;
	box-sizing: border-box;
}
table , td, th {
    border: 1px solid #ccc;
    border-collapse: collapse;
}
td, th{ padding: 4px 10px; }
th { background: #ededed; }

	@media (max-width: 600px) {
		/*-- スマホ：スクロール
		------------------------- */
		table.overflow_x{
			display: block; 
			width: auto; 
			position: relative; 
			overflow-x: scroll; 
			white-space: nowrap; 
		}
		table.overflow_x::-webkit-scrollbar {
		  height: 5px;
		}
		table.overflow_x::-webkit-scrollbar-track {
		  border-radius: 5px;
		  background: #eee;
		}
		table.overflow_x::-webkit-scrollbar-thumb {
		  border-radius: 5px;
		  background: #666;
		}
		
		/*-- スマホ：縦表示
		------------------------- */
		table.res{
			border: none;
		}
		table.res tr{
			display: block;
			margin-bottom: 20px;
		}
		table.res th,
		table.res td{
			display: block;
			border-bottom: none;			
		}
		table.res td:last-child{
			border-bottom: 1px solid #ccc;
		}
	}
td .error {
	color: #F00;
}

/*==============================*/
/* ページナビ */
/*==============================*/
@media (min-width: 600px) {
	.navi{
		margin: 0 auto;
}
	.navi ul{
		width: 420px;
		margin: 0 auto 0 auto;
	}
	.navi li{
		display: inline-block;
		margin-right: 10px;
}
	.navi li a{
		display: block;
		font-size: 13px;
		padding: 5px 26px;
		border: 1px solid #009989;
	}
	.navi li a:hover{
		background: #009989;
		color: #fff;
	}
}

@media (max-width: 600px) {
	.navi ul{
		overflow: hidden;
		width: 100%;
		margin: 0 auto 20px auto;
	}
	.navi li{
		width: calc(50% - 5px);
		margin: 0 10px 10px 0;
		float: left;
	}
	.navi li:nth-child(even){
		margin-right: 0;
	}
	.navi li a{
		display: block;
		font-size: 13px;
		text-align: center;
		padding: 8px 0;
		border: 1px solid #009989;
	}
	.navi li a:hover{
		background: #009989;
		color: #fff;
	}
}

/*==============================*/
/* FAQ */
/*==============================*/
.faq dl{
	margin-bottom: 30px;
}
.faq dl dt{
	position: relative;
	padding-left: 30px;
	margin-bottom: 8px;
	font-size: 18px;
	font-family: 'Noto Sans Japanese', sans-serif;
	color: #C4A15D;
}
	@media (max-width: 600px){
			.faq dl dt{
				padding-left: 25px;
				font-size: 16px;
			}
	}
.faq dl dt:before{
	position: absolute;
	content: "Q.";
	top: -5px;
	left: 0;
	font-size: 24px;
}
	@media (max-width: 600px){
			.faq dl dt:before{
				font-size: 20px;
			}
	}
.faq dl dd{
	padding-left: 2em;
}

/*==============================*/
/* アクセス */
/*==============================*/
.access{
	overflow:hidden;
}
.access .logo_title{
	float: left;
	color: #009989;
	font-family: 'Noto Sans Japanese', sans-serif;
	font-size: 25px;
	font-weight: 500;
	margin-right: 40px;
}
	@media (max-width: 600px){
		.access .logo_title{
			float: none;
			margin-right: 0;
			margin-bottom: 15px;
		}
	}
.access div.map_title{
	float: left;
	width: 540px;
}
	@media (max-width: 600px){
		.access div.map_title{
			float: none;
			width: 100%;
			margin-bottom: 20px;
		}
	}
.access dl{
	color: #666666;
	font-size: 13px;
	line-height: 1.4em;
	overflow: hidden;
}
.access dl dt{
	position: relative;
	float: left;
	margin-right: 13px;
}
.access dl dt:after{
	position: absolute;
	content: ":";
	left: 30px;
}
@media (max-width: 600px){
.access dl dd{
	padding-left: 40px;
}
}

/*-- map_btn
------------------------- */
.map_btn{
	float: right;
	margin-bottom: 30px;
	width: 150px;
	border: 1px solid #009989;
	text-align: center;
}
	@media (max-width: 600px){
		.map_btn{
			float: left;
			margin-bottom: 20px;
		}
	}
.map_btn a{
	display: block;
	padding: 2px 0;
}
.map_btn a:hover{
	background: #009989;
	color: #FFFFFF;
}

@media (min-width: 600px){
	/*-- 矢印
	------------------------- */
	div.access .three_column div:before{
		position: absolute;
		content:"";
		top: 70px;
		right: -55px;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 24px 0 24px 20px;
		border-color: transparent transparent transparent #999;
	}

	/*-- three_column
	------------------------- */
	.access .three_column > div{ width: calc(33.33% - 40px) ; width: -webkit-calc(33.33% - 40px); float: left; margin-bottom: 20px; position: relative; }
	.access .three_column > div:nth-child(3n+1){ margin-right: 40px; clear: both; }
	.access .three_column > div:nth-child(3n+2){ margin-left: 20px; margin-right: 20px; }  
	.access .three_column > div:nth-child(3n){ margin-left: 40px; }
}

@media (max-width: 600px){
	.access .three_column > div{
		position: relative;
		margin-bottom: 0;
		padding-bottom: 40px;
	}
	div.access .three_column div:before{
		position: absolute;
		content:"";
		bottom: 10px;
		left: 45%;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 20px 24px 0 24px;
		border-color: #999 transparent transparent transparent;
	}
}


/*==============================*/
/* サービス約款 */
/*==============================*/
#attention > div{
	margin-bottom: 30px;
}
#attention > div > p,
#attention > div > ul{
	margin-left: 2em;
}

/*==============================*/
/* サイトマップ */
/*==============================*/
.sitemap{
}
.sitemap h3{
	margin-bottom: 10px;
	padding-bottom: 8px;
	font-size: 16px;
	border-bottom: 1px solid #DEDEDE; 
}
.sitemap ul li i{
	padding-top: 5px;
	font-size: 16px;
	margin-right: 5px;
}

@media (max-width: 600px){
	.sitemap ul{
		margin-bottom:20px;
	}
}

/*==============================*/
/* コンタクトブロック */
/*==============================*/
.contact_block{
	box-sizing: border-box;
	width: 990px;
	padding: 32px 0 24px 0;
	border: 2px solid #009889;
    margin: 0 auto;
}

#stylist .contact_block{ border: none;}

	@media (max-width: 600px){
		.contact_block{
			width: 100%;
		}
	}
.contact_block *{
	text-align: center;
	box-sizing: border-box;
}
.contact_block h2{
	margin-bottom: 24px;
	font-size: 32px;
	font-weight: bold;
	color: #009889;
	font-family: 'Noto Sans Japanese', sans-serif;
}
#stylist .contact_block h2{ margin-bottom: 32px;}

.contact_block p{ margin-bottom: 16px; }
.contact_block .contact_block_point{
	color: #009889;
	font-size: 18px;
	font-weight: bold;
	font-family: 'Noto Sans Japanese', sans-serif;
}
.contact_block .contact_block_point span {position: relative; top: -2px;}
.contact_block ul li{ margin-bottom: 8px; }
.contact_block ul li a{
	display: block;
	max-width: 560px;
	margin: 0 auto;
	
	background: #009889;
	text-align: left;
	font-size: 28px;
	font-weight: bold;
	color: #ffffff;
	font-family: 'Noto Sans Japanese', sans-serif;
}
.contact_block ul li.tel a{
    padding: 26px 0 20px 100px;
    font-size: 38px;
}
.contact_block ul li.mail a{ padding: 22px 0 24px 100px; }

.contact_block ul a i{
	font-size: 32px;
    margin-right: 32px;
}
.contact_block ul li.tel a i{ position: relative; top: -4px; font-size: 32px;}
.contact_block ul li.mail a i{ position: relative; top: 2px;}

#stylist .contact_block ul li.tel { margin-bottom: 24px;}

	@media (max-width: 600px){
        .contact_block h2{
            margin-bottom: 16px;
            font-size: 26px;
            line-height: 1.2em;
        }
        #stylist .contact_block h2{ margin-bottom: 24px;}
        .contact_block .contact_block_point{ line-height: 1.3em;}
        #stylist .contact_block ul li.tel { margin-bottom: 16px;}
        .contact_block ul li.tel a{
            width: 90%;
            padding: 11px 12px 12px 12px;
            font-size: 23px;
        }
        .contact_block ul li.mail a{
            width: 90%;
            padding: 12px 12px 12px 12px;
            font-size: 19px;
        }
        .contact_block ul a i{
            font-size: 24px;
            margin-right: 16px;
        }
        .contact_block ul li.tel a i{ position: relative; top: -1px; font-size: 24px;}
        .contact_block ul li.mail a i{ position: relative; top: 2px;}
    }

.contact_block ul a:hover{ opacity: 0.8; }



/*==============================*/
/* コンタクトボックス */
/*==============================*/

.contact_box{
	padding: 16px 20px 16px  20px;
	border: 2px solid #DEDEDE;
	display: flex; display: -webkit-flex; /* Safari */
	align-items: center; -webkit-align-items: center; /* Safari */
	justify-content: space-between; -webkit-justify-content: space-between; /* Safari */
	background: url(../../img/share/bg.jpg);
}
	@media (max-width: 600px){
		.contact_box{
			padding: 20px;
			flex-direction: column; -webkit-flex-direction: column; /* Safari */
		}
	}

/*-- 電話番号
------------------------- */
.contact_box .tell{}
.contact_box .tell h3{
	margin-bottom: 5px;
	font-size: 16px;
	color: #666666;
	font-weight: 600 ;
	font-family: 'Noto Sans Japanese', sans-serif;
}
	@media (max-width: 600px){
		.contact_box .tell h3{ margin-bottom: 10px; }
	}
.contact_box .tell p.telNumber{
	margin-bottom: 12px;
	color: #009989;
	font-size: 35px;
	font-weight: 600 ;
	font-family: 'Noto Sans Japanese', sans-serif;
}

.contact_box .tell p.telNumber small{ margin-right: 5px; }

@media (max-width: 374px){
	.contact_box .tell p.telNumber{ font-size: 30px;}
	.contact_box .tell p.telNumber small{ margin-right: 5px; }
}

/*-- 営業情報
------------------------- */
.contact_box .time{
	width: 240px;
}
	@media (max-width: 600px){
		.contact_box .time{
			width: 100%;
			padding-top: 20px;
			margin-bottom: 10px;
			float: none;
		}
	}
.contact_box .time dl{ margin-bottom: 5px; }
.contact_box .time dl dt{
	float: left;
	width: 80px;
	margin-right: 10px;
	background: #e7e7e7;
	font-size: 13px;
	text-align: center;
}
/*-- ボタン
------------------------- */
.contact_box ul{
	width: 296px;
	display: flex; display: -webkit-flex; /* Safari */
	justify-content: space-between; -webkit-justify-content: space-between; /* Safari */
}
.contact_box ul li{ width: calc(33.3% - 8px); }
.contact_box ul li a{
	height: 55px;
	padding-top:35px;
	color: #FFFFFF;
	text-align: center;
	display: block;
	background-image:
	linear-gradient(-45deg, #ff9d03 50%, #f49500 50%, #f49500);
}
.contact_box ul li a:hover{
	background-image:
	linear-gradient(-45deg, #ffae2e 50%, #f49500 50%, #f49500);
}

@media (max-width: 600px){
	.contact_box ul{
		width: 100%;
	}
}

/*==============================*/
/* サービス約款 */
/*==============================*/
a.text_link,
.text_link a{ text-decoration: underline; color: #294A7D; position: relative; top: -2px;}


/*==============================*/
/* rentalMethod */
/*==============================*/
div.rentalMethod{
	padding: 48px 80px 40px 80px;
	background: #fae7c9;
}
div.rentalMethod h2{
	position: relative;
	margin-bottom: 28px;
	padding-bottom: 12px;
	text-align: center;
	color: #3c3b36;
	font-size: 32px;
	font-weight: bold;
	font-family: 'Noto Sans Japanese', sans-serif;
}
div.rentalMethod h2::before{
	position: absolute; bottom: 0; left: 50%;
	content: "";
	width: 200px;
	height: 2px;
	background: #0e9b6d; /* Old browsers */
	background: -moz-linear-gradient(left,  #0e9b6d 0%, #4ac38d 50%, #8ff5b8 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #0e9b6d 0%,#4ac38d 50%,#8ff5b8 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #0e9b6d 0%,#4ac38d 50%,#8ff5b8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0e9b6d', endColorstr='#8ff5b8',GradientType=1 ); /* IE6-9 */
	margin-left: -100px;
}

div.rentalMethod p{
	text-align: center;
}
div.rentalMethod p.textBold{
	font-weight: bold;
	font-family: 'Noto Sans Japanese', sans-serif;
}


div.rentalMethod ul{
	display: flex; display: -webkit-flex;
	justify-content: space-between; -webkit-justify-content: space-between;
}
div.rentalMethod ul li{
	width: calc(50% - 20px);
}
div.rentalMethod ul li a{
	display: block;
	padding: 24px 0 36px 0;
	background: #fff;
	text-align: center;
	font-size: 32px;
	font-weight: 300;
	font-family: 'Noto Sans Japanese', sans-serif;
}
div.rentalMethod ul li:first-child a{ border: 8px solid #83d1b7; color: #02979e; }
div.rentalMethod ul li:last-child a{ border: 8px solid #FFCF8B; color: #ff960a;}

div.rentalMethod ul li:first-child a:hover{ border: 8px solid #02979e; }
div.rentalMethod ul li:last-child a:hover{ border: 8px solid #ff960a;}

div.rentalMethod ul li a small{
	display: block;
	margin-bottom: 14px;
	color: #434343;
	font-size: 15px;
	font-weight: bold;
	line-height: 1.3em;
}
div.rentalMethod ul li a span{
	font-weight: bold;
}

/* ======= SP =======*/
@media (max-width: 600px) {
	div.rentalMethod{ padding: 48px 24px 40px 24px;}
	div.rentalMethod h2{
		margin-bottom: 24px;
		padding-bottom: 12px;
		font-size: 26px;
	}
	div.rentalMethod h2::before{
		position: absolute; bottom: 0; left: 50%;
		width: 160px;
		margin-left: -80px;
	}
	
	div.rentalMethod ul{ flex-direction: column; -webkit-flex-direction: column;}
	div.rentalMethod ul li{ width: 100%;}
	div.rentalMethod ul li:not(:last-child){ margin-bottom: 12px;}
	div.rentalMethod ul li a{
		padding: 24px 0 32px 0;
		font-size: 26px;
	}

	div.rentalMethod ul li a small{
		margin-bottom: 14px;
		font-size: 14px;
	}
	div.rentalMethod ul li a span{
		display: block;
		margin-bottom: 8px;
	}
}