@charset "UTF-8";
/* -------------------------------------------------------------- */
/*  サブページ共通  */
/* -------------------------------------------------------------- */
.box-single-blog > h1 {
    color: #5c3f21;
}
#area-sub-header {
	position: relative;
	border-bottom: #8B7D5A solid 3px;
	background: #8B7D5A;
}

h1, .ttl-h1 {
	color: #fff;
	line-height: 1.5;
	letter-spacing: 0.2rem;
	font-weight: bold;
}

.box-sub-ttl {
	text-align: center;
}

.area-pankuzu, .area-pankuzu a {
	color: #8B7D5A;
}

.area-pankuzu a {
	display: inline-block;
}

#contents-wrapper h2 {
	text-align: center;
	color: #666666;
	font-weight: bold;
}

/* -------------------------------------------------------------- */
/*  smp  */
/* -------------------------------------------------------------- */
@media print, screen and (max-width:768px) {
	#area-sub-header {
		height: 80px;
	}
	
	.txt-top-h1 {
		font-size: 1rem;
    	letter-spacing: -0.07rem;
    	color: #7a8799;
		z-index: 10;
	}
	
	.box-ttl-bg-left, .box-ttl-bg-right {
		height: 80px;
		width: 100%;
    	background-size: contain;
	}
	
	.box-ttl-bg-left {
		background-position: top left -80px;
	}
	
	.box-ttl-bg-right {
		background-position: top right -80px;
	}
	
	.box-sub-ttl {
		position: absolute;
		width: calc(100% - 20px);
    	top: 50%;
		left: 50%;
    	-webkit-transform: translate(-50%,-50%);
    	-ms-transform: translate(-50%,-50%);
    	transform: translate(-50%,-50%);
	}
	
	h1, .ttl-h1 {
		font-size: 2rem;
	}
	
	#contents-wrapper h2 {
		font-size: 2rem;
	}
}

/* -------------------------------------------------------------- */
/* PC */
/* -------------------------------------------------------------- */
@media print, screen and (min-width:769px) {
	#area-sub-header {
		height: 120px;
	}
	
	.txt-top-h1 {
		font-size: 1.2rem;
    	position: absolute;
    	top: 64px;
    	color: #7a8799;
		z-index: 10;
	}
	
	.box-ttl-bg-left {
		background-position: top left;
	}
	
	.box-ttl-bg-right {
		background-position: top right;
	}
	
	.box-ttl-bg-left, .box-ttl-bg-right {
		height: 120px;
	}
	
	.box-sub-ttl {
		padding-top: 1.6em;
	}
	
	h1, .ttl-h1 {
		font-size: 3rem;
	}
	
	/* -------------------------------------------------------------- */
	/* コンテンツ */
	/* -------------------------------------------------------------- */
	#contents-wrapper {
		width: 1000px;
		margin: 16px auto 90px auto;
	}
	
	.box-ttl-h2 {
		margin: 56px 0;
	}
	
	#contents-wrapper h2 {
		font-size: 2rem;
	}
}