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


/*** ------------------------------------------------------------------------------ 

見出し

-----------------------------------------------------------------------------  ***/
/* 見出しType01 */
.headline_temp01 {
    margin-bottom: 25px;
    padding-bottom: 10px;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    color: #002c52;
    position: relative;
}
	.headline_temp01:after {
		content: "";
		width: 25px;
		height: 3px;
		background: #002c52;
		position: absolute;
		left: 50%;
		bottom: 0;
		transform: translateX(-50%);
	}


/* 見出しType02 */
.heading-temp02 .s-catch{
	margin: 0;
	line-height:100%;
	text-align:center;
}
	.heading-temp02 .s-catch span{
		display: inline-block;
		background: #002c52;
		padding: 3px 25px;
		border-radius: 10px;
		color: #fff;
		font-size: 12px;
	}
	.heading-temp02 h2{
		color: #002c52;
		font-size: 44px;
		font-weight: bold;
		text-align: center;
		margin-bottom: 21px;
	}
@media screen and (max-width:737px){
	.heading-temp02 h2{
		font-size: 24px;
		margin-bottom: 21px;
	}	
}

/* 見出しType03 */
.heading_temp03{
	font-size:24px;
	font-weight:bold;
	margin: 0 0 20px;
	padding:9px 0 8px;
	border-top:3px solid #002c52;
	border-bottom:1px solid #ccc;
	color:#002c52;
}
.heading_temp03 span{
	display: block;
	font-size:14px;
	font-weight:normal;
}
@media screen and (max-width:737px){
	.heading_temp03{
		font-size:20px;
	}
	.heading_temp03 span{
		font-size:10px;
	}
}

/* 見出しType04 */
.heading_temp04{
	background:#002c52;
	font-size:18px;
	font-weight:bold;
	margin: 0 0 20px;
	padding:7px 10px;
	color:#fff;
}
@media screen and (max-width:737px){
	.heading_temp04{
		font-size:16px;
	}
}

/* 見出しType05 */
.heading_temp05{
	font-size:18px;
	font-weight:bold;
	margin: 0 0 20px;
	padding:7px 10px;
	border-left:4px solid #ccc;
	border-bottom:1px solid #ccc;
	color:#002c52;
}
@media screen and (max-width:737px){
	.heading_temp05{
		font-size:16px;
	}
}

/* 見出しType06 */
.heading_temp06{
	margin: 0 0 10px;
	line-height:1.4;
	font-size:20px;
	font-weight:bold;
	color:#e83421;
}
@media screen and (max-width:737px){
	.heading_temp06{
		font-size:18px;
	}
}


/*** ------------------------------------------------------------------------------ 

ボタン

-----------------------------------------------------------------------------  ***/
/* Type01 */
.link-btn{ text-align:center;}

.link-btn a{
	background: url("../img/arrow02.png") no-repeat right 20px center #002c52;
	display: inline-block;
	border:1px solid #fff;
	border-radius:30px;
	padding:11px 60px;
	color:#fff;
	text-decoration: none;
}

.link-btn a:hover{ opacity:0.7;}

@media screen and (max-width:737px){
	.link-btn a{
		background: url("../img/arrow02.png") no-repeat right 15px center #002c52;
	}	
}

/*** ------------------------------------------------------------------------------ 

.link-box_temp (ページ内リンクリスト)

-----------------------------------------------------------------------------  ***/
.link-box_temp{
	border:1px solid #002c52;
	background:#efefef;
	text-align:center;
	margin:-30px 0 60px;
	padding:13px;
	font-size:16px;
}
	.link-box_temp ul li{
		display:inline-block;
		margin:0 10px;
	}
	.link-box_temp li a{
		background: url(../img/arrow01.png) no-repeat left 20px center #fff;
		display: inline-block;
		padding:10px 25px 10px 45px;
		text-decoration: none;
	}
	.link-box_temp li a:hover{ text-decoration: underline;}

@media screen and (max-width:737px){
	.link-box_temp{
		margin:0;
		padding: 13px 13px 3px 13px;
		font-size:14px;
	}
	.link-box_temp ul li{
		width:49%;
		float:left;
		display: block;
		margin:0 2% 10px 0;
		font-size:12px;
	}
	.link-box_temp ul li:nth-child(2n){ margin:0 0 10px;}
	.link-box_temp li a{
		background: url(../img/arrow01.png) no-repeat left 5px center #fff;
		display: block;
		width:auto;
		padding:5px 0;
		text-decoration: none;
	}
}


/*** ------------------------------------------------------------------------------ 

.sprate_temp (くぎりページ帯画像)

-----------------------------------------------------------------------------  ***/
.sprate_temp {
    background: #e5e9ed;
    margin: 0 0 74px;
}
.sprate_temp:last-of-type { margin: 0 0 47px;}
.sprate_temp ul {
    width: 1000px;
    margin: 0 auto;
}
.sprate_temp  li { float: left;}

@media screen and (max-width:737px){
	.sprate_temp { margin: 0 0 27px;}
	.sprate_temp  ul {
		width: auto;
		text-align:center;
	}
	.sprate_temp  li { float: none;}
	.sprate_temp  li img{ max-width: 100%;}
}




/*** ------------------------------------------------------------------------------ 

.flow_temp (コースフロー図)

-----------------------------------------------------------------------------  ***/
.flow-nest_temp{
	margin:50px 0 0 0;
}
.flow_temp li {
    float: left;
    margin: 0 11px 0 0;
}
.flow_temp li span{
	display: table-cell;
	text-decoration: none;
	background:#002c51;
	font-size:20px;
	font-weight:bold;
	line-height:1.2;
	color:#fff;
	width:58px;
	height:100px;
	padding:0 20px;
	text-align:center;
	vertical-align:middle;
	position:relative;
	box-sizing:border-box;
	word-break:break-all;
}
.flow_temp_small li span{
	width:46px;
	padding:13px;
	font-size:14px !important;
}

.flow_temp li span.water{ background:#002c51;}
.flow_temp li span.wash{ background:#01437d;}
.flow_temp li span.wax{ background:#0063b8;}
.flow_temp li span.h-water{ background:#087fe5;}
.flow_temp li span.dry{ background:#508dff;}

.flow_temp li span.wax_coating{
	background:#0063b8;
	font-size: 14px!important;
	padding-top: 10px;
	padding-bottom: 10px;
}
.flow_temp li span.waterlong
{ background:#002c51;
	font-size: 14px!important;
	padding-top: 10px;
	padding-bottom: 10px;
}
.flow_temp li span.washlong{
	background:#01437d;
	font-size: 14px!important;
	padding-top: 10px;
	padding-bottom: 10px;
}
.flow_temp li span.wwax{
	background:#0063b8;
	font-size: 14px!important;
	padding-top: 10px;
	padding-bottom: 10px;
}
.flow_temp li span.autostop{
	background:#e83421;
	font-size: 14px!important;
	padding-top: 10px;
	padding-bottom: 10px;
}

.flow_temp li span.img{ padding:0 5px;}
.flow_temp li > ul li span.text{
	width:auto;
	padding:0 10px;
	text-align:center;
	background: none;
	color:#fff;
}

.flow_temp li span::before {
	border-style:solid;
	border-width:10px  10px 10px 0;
	border-color:#333 transparent;
	content: " ";
	top:0px;
	right:-10px;
	position:absolute;
	background-color:transparent;
}
/* 右向き */
.flow_temp li span::before {
	border-color:transparent #002c51;
	border-width:50px 0 50px 10px;
	top:0;
	left:auto;
	right:-10px;
}

.flow_temp li span.water::before{ border-color:transparent #002c51;}
.flow_temp li span.waterlong::before{ border-color:transparent #002c51;}
.flow_temp li span.wash::before{ border-color:transparent #01437d;}
.flow_temp li span.washlong::before{ border-color:transparent #01437d;}
.flow_temp li span.wax::before{ border-color:transparent #0063b8;}
.flow_temp li span.wwax::before{ border-color:transparent #0063b8;}
.flow_temp li span.h-water::before{ border-color:transparent #087fe5;}
.flow_temp li span.dry::before{ border-color:transparent #508dff;}
.flow_temp li span.wax_coating::before{ border-color:transparent #0063b8;}
.flow_temp li span.autostop::before{ border-color:transparent #e83421;}
.flow_temp li > ul li span.text::before{ border-color: transparent;}


/* bタグの入れ子の矢印 */
.flow_temp li > ul{
	background: #e83421;
	display: inline-block;
	padding:15px;
	border:1px solid #e83421;
	font-weight:normal;
	position: relative;
	top: -30px;
}
.flow_temp li > ul::before{
	border-style:solid;
	border-width:10px  10px 10px 0;
	border-color:#333 transparent;
	content: " ";
	top:0px;
	right:-10px;
	position:absolute;
	background-color:transparent;
}
.flow_temp li > ul::before{
	border-color:transparent #e83421;
	border-width:80px 0 80px 10px;
	top:0;
	left:auto;
	right:-11px;
}

.flow_temp li > ul li{
	float:left;
	margin:0 11px 0 0;
}
.flow_temp li > ul span{
	background:#fff;
	height:130px;
	font-size:16px;
	color:#e83421;
}
.flow_temp li > ul span::before {
    border-color: transparent #fff;
	border-width:65px 0 65px 10px;
	right:-10px;
}



@media screen and (max-width:737px){
	.flow_temp li{
		float: none;
		margin:0 0 15px 0;
		position:relative;
	}
	.flow-nest_temp{
		margin:0 0 15px 0;
	}
	.flow_temp li span{
		display:block;
		width: 90%;
		height: auto;
		margin: 0 auto;
		padding:5px 20px;
		text-align:center;
		font-size:16px;
	}
	.flow_temp li span br{ display: none;}
	

	.flow_temp li > ul span::before {
		border-width:0px;
		right:-10px;
	}
	/* 下向き */
	.flow_temp li > ul::before{
		border-width:0px;
		right:-10px;
	}
	.flow_temp li > ul::before{
		border-width:15px 15px 0 15px;
		border-color:#e83421 transparent transparent transparent ;
		top:auto;
		right:0;
		left: 50%;
		bottom:-15px;
		margin:0 0 0 -15px;
		width:0;
		height:0;
	}
	.flow_temp li span::before {
		border-width:15px 15px 0 15px;
		border-color:#002c51 transparent transparent transparent ;
		top:auto;
		right:0;
		left: 50%;
		bottom:-15px;
		margin:0 0 0 -15px;
		width:0;
		height:0;
	}
	.flow_temp li:last-child span::before {
		border-width:0;
		top:auto;
		right:0;
		left: 50%;
		bottom:-15px;
		margin:0 0 0 -20px;
		width:0;
		height:0;
	}
	.flow_temp li span.water::before{ border-color: #002c51 transparent transparent transparent;}
	.flow_temp li span.wash::before{ border-color:#01437d transparent transparent transparent;}
	.flow_temp li span.wax::before{ border-color:#0063b8 transparent transparent transparent;}
	.flow_temp li span.h-water::before{ border-color:#087fe5 transparent transparent transparent;}
	.flow_temp li span.dry::before{ border-color:#508dff transparent transparent transparent;}
	
	.flow_temp li span.waterlong::before{ border-color:#002c51 transparent transparent transparent;}
	.flow_temp li span.washlong::before{ border-color:#01437d transparent transparent transparent;}
	.flow_temp li span.wwax::before{ border-color:#0063b8 transparent transparent transparent;}
	.flow_temp li span.wax_coating::before{ border-color:#0063b8 transparent transparent transparent;}
	.flow_temp li span.autostop::before{ border-color:#e83421 transparent transparent transparent;}
	
	/* bタグの入れ子の矢印 */
	.flow_temp li > ul{
		width: 90%;
		margin:0 auto;
		background: #e83421;
		display: block;
		position: static;
		box-sizing:border-box;
	}


	
	.flow_temp li > ul li{
		float: none;
		margin:0 0 20px 0;
		text-align:center;
	}
	.flow_temp li > ul li:last-child{
		margin:0;
	}
	.flow_temp li > ul span{
		height: auto;
		font-size:16px;
	}
	.flow_temp li > ul span::before {
		border-width:15px 15px 0 15px;
		border-color:#fff transparent transparent transparent ;
		top:auto;
		right:0;
		left: 50%;
		bottom:-15px;
		margin:0 0 0 -15px;
		width:0;
		height:0;
	}
}