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


.box-undertitle-01 .title-wrap.reason {
    background: url(../../jstork_custom/image/imgcat.jpeg) no-repeat center center/cover;
    background-color: rgba(255,255,255,0.5)
}

.box-undertitle-01 .title-wrap {
    position: relative;
    width: 100%;
    height: 240px;
    background-size: cover;
}


.box-undertitle-01 .title-wrap>.title-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 960px;
    height: 100%;
    margin: auto;
}

.box-undertitle-01 .title-wrap>.title-inner h1 {
    color: #000000;
}

.box-undertitle-01 .title-wrap>.title-inner h1 .title {
    font-size: 3.0rem;
    display: block;
    letter-spacing: 0.1em;
}

.box-pankuzu-01 {
    background: #f9f9f4;
    padding: 10px 0;
}

.post-top-03 {
    padding: 50px 0;
	background-color: #FFFFFF;
}

.post-title-03 {
    color: #222222;
    font-weight: bold;
    text-align: center;
    padding-bottom: 20px;
	font-size: 2.8rem;
}


@media screen and (max-width: 768px){
	.box-undertitle-01 .title-wrap {
		height: 180px;
	}
	
	.box-undertitle-01 .title-wrap.reason {
		background: url(../../jstork_custom/image/imgcat.jpeg) no-repeat center top/cover;
	}
	
	.box-undertitle-01 .title-wrap>.title-inner {
		height: 180px;
		width: 100%;
	}

	.box-undertitle-01 .title-wrap>.title-inner h1 .title{
		font-size: 2.4rem;
		margin: 50px 0 0 15px;
	}
	
	.post-title-03 {
    color: #222222;
    font-weight: bold;
    text-align: center;
    padding-bottom: 20px;
	font-size: 2.2rem;
	}
	
	.post-top-03 {
    padding: 10px 0;
	background-color: #FFFFFF;
}

}


.breadcrumb {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 960px;
    margin: 0 auto;
    color: #95949A;
}

.breadcrumb .inner {
    font-size: 1.2rem;
}

.picarea {
	display: flex;
	margin-bottom: 24px;
}

.picarea .mainthum {
	width: 75%;
	float: left;
	margin: 4px 7px 5px 0;
}

.picarea .subthum {
	width: 240px;
	float: right;
}

.picarea .subthum .subimg{
	margin: 4px 3px 7px 3px;
}

@media screen and (max-width: 768px){
	.breadcrumb {
    overflow-x: scroll;
    overflow-y: hidden;
    width: 100%;
    padding: 0 0 0 10px;
    white-space: nowrap;
	}
	
	.breadcrumb .inner {
    display: inline-block;
    padding-right: 10px;
	}
	
	.picarea {
		display: flex;
		flex-wrap: wrap;
	}

	.picarea .mainthum {
		width: auto;
		padding: 6px 3px;
		order: 1;
		margin: auto;
	}
	
	.picarea .subthum{
	    order: 2;
		display: flex;
		flex-wrap: wrap;
		width: auto;
	}
	
	.picarea .subthum .subimg{
	    width: calc(100%/3);
		padding: 0 3px;
		margin: auto;
	}
}

.txtarea{
	display: block;
	
}