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

/*pankuzu*/
#pk_bk{
    background-color: #fdfcf1;
}

#pk_area{
    margin: 0 auto;
    color: #fff;
}

#pk_area a{
	color: #351d0e;
}

#pk_area ol,#pk_area a{
	padding: 54px 0 0;
}

.cd-breadcrumb li, .cd-multi-steps li{
	display: inline-block;
	float: left;
	font-size: 1.3rem;
}

.cd-breadcrumb li a:visited, .cd-multi-steps li a:visited{
	color:#fff;
}

.cd-breadcrumb li a:hover, .cd-multi-steps li a:hover,#pk_area a:hover{
  color: #efcd9a;
}

.arrow a{
	text-decoration: underline;
}

li.under{
	color: #351d0e;
}

.cd-breadcrumb li.arrow::after, .cd-multi-steps li::after {
	font-size: 1.6rem;
	display: inline-block;
	content: '\00bb';
	margin: 0 .6em;
	color: #ccc;
}
/*--pankuzu--*/


h3{
	font-family: "Sawarabi Mincho";
	font-weight: 100;
    font-size: 3.2rem;
    margin: 0 auto 50px;
	position: relative;
	height: 22px;
	z-index: 1;
}

h3::after {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: -1;
	content: '';
	width: 100%;
	height: 6px;
	background-color: #f6ecda;
}

h4{
	text-align: left;
  font-size: 1.6rem;
  color: #fff;
  background-color: #866953;
  padding: 0.5em 0.1rem;
  margin-bottom: 30px;
}

h5{
	font-size:1.6rem;
  padding: 20px 10px 
}

.flow_l h5#li1{
	padding-left: 56px;
  background: url(../../flow/images/list_icon01.png) no-repeat 7px;
  background-size: 40px 40px;
}

.flow_l h5#li2{
	padding-left: 56px;
    background: url(../../flow/images/list_icon02.png) no-repeat 7px;
    background-size: 40px 40px;
}

.flow_l h5#li3{
	padding-left: 56px;
    background: url(../../flow/images/list_icon03.png) no-repeat 7px;
    background-size: 40px 40px;
}

.flow_l h5#li4{
	padding-left: 56px;
    background: url(../../flow/images/list_icon04.png) no-repeat 7px;
    background-size: 40px 40px;
}

.flow_l h5#li5{
	padding-left: 56px;
    background: url(../../flow/images/list_icon05.png) no-repeat 7px;
    background-size: 40px 40px;
}

.flow_l h5#li6{
	padding-left: 56px;
    background: url(../../flow/images/list_icon06.png) no-repeat 7px;
    background-size: 40px 40px;
}

.flow_l h5#li7{
	padding-left: 56px;
    background: url(../../flow/images/list_icon07.png) no-repeat 7px;
    background-size: 40px 40px;
}

.flow_l h5#li8{
	padding-left: 56px;
    background: url(../../flow/images/list_icon08.png) no-repeat 7px;
    background-size: 40px 40px;
}
.flow_l{
	float: left;
	width: 70%;
}

.flow_l img{
	max-width: 100%;
	height:auto;
}

.flow_l p{
	padding: 10px;
}

.flow_r,.flow_r_m,.flow_r2{
	float: right;
	width: 26%;
}

.white_f{
	border-bottom: dashed #ccc;
    padding-bottom: 30px;
}

h5.fee{
	background-color: #efcd9a;
	position: relative;
	z-index: 3;
	color: #fff;
	text-align: center;
}

h5.fee2{
	background-color: #ef939a;
	position: relative;
	z-index: 3;
	color: #fff;
	text-align: center;
}

.flow_r,.flow_r2{
	position: relative;
}

.flow_r::before{
    display: block;
    content: '';
    position: absolute;
    z-index: 1;
    right: 50%;
    width: 10px;
    height: 99%;
    margin-right: -5px;
    background-color: #efcd9a;
}

.flow_r::after{
	display: block;
    content: '';
    position: absolute;
    z-index: 2;
    right: 50%;
    margin-right: -20px;
    bottom: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 20px 0 20px;
    border-color: #efcd9a transparent transparent transparent;
}

.flow_r2::before{
    display: block;
    content: '';
    position: absolute;
    z-index: 1;
    right: 50%;
    width: 10px;
    height: 99%;
    margin-right: -5px;
    background-color: #ef939a;
}

.flow_r2::after{
	display: block;
    content: '';
    position: absolute;
    z-index: 2;
    right: 50%;
    margin-right: -20px;
    bottom: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 20px 0 20px;
    border-color: #ef939a transparent transparent transparent;
}

/* 768px以上 */
@media (min-width: 768px) {
	#pk_area ol,#pk_area a{
	padding: 7px 0;
	}
	
	h4{
    font-size: 2.6rem;
    padding: 0.5em;
}
	h5{
	font-size:2.0rem;
	}
	

}
@media (min-width: 980px) {
	.arrow_end::after{
	right: 10.47%;
	}
	.img_l{
	float: left;
	width: 45%;
	}

	.text_r{
	float: right;
	width: 48%;
	}
}
/* 1200px以上 */
@media (min-width: 1240px) {
	#pk_area{
	width: 80%;
	}
	.m_f80{
	margin: 0 auto;
	width: 80%;
	}
}