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


#titBox {
	padding-bottom: 50px;
}
#single #titBox .imgBox {
	padding-bottom: 0px;
}
#titBox .bnnBox, #bnBtm .bnnBox {
	padding: 30px 0 20px;
}
#titBox .bnnBox a, #bnBtm .bnnBox a {
	width: 48%;
	width: 100%;
	/*max-width: 390px;*/
}
#titBox h3 {
	font-size: 26px;
	color: #E60012;
	padding: 1em 0;
	text-align: center;
	font-weight: 500;
}
#titBox h3::before {
	content: '＼';
}
#titBox h3::after {
	content: '／';
}
#titBox .caption {
	max-width: 800px;
	font-size: 15px;
	margin: 0 auto;
}
#titBox .itemWrap {
	max-width: 800px;
	margin: 0 auto;
}
#titBox .itemBox {
	width: 48%;
	max-width: 390px;
}
#titBox .itemBox p {
	padding: 0.5em 0;
	font-size: 15px;
	line-height: 1.3;
}

#teigiWrap {
	padding: 50px 0;
}
#teigiWrap .taigiBox {
	max-width: 800px;
	background-color: #FFFBC7;
	border: #E60012 solid 2px;
	border-radius: 15px;
	position: relative;
	padding: 30px;
}
#teigiWrap .taigiBox h3 {
	font-size: 24px;
	padding: 0.5em;
	width: 12em;
	text-align: center;
	background-color: #E60012;
	border-radius: 10px;
	color: #fff;
	line-height: 1;
	position: absolute;
	left: 50%;
	top:0%;
	transform: translate(-50%,-50%);
}
#teigiWrap .taigiBox h4 {
	font-size: 26px;
	text-align: center;
	color: #E60012;
	padding-top: 0.5em;
}
#teigiWrap .taigiBox p.caption {
	text-align: center;
	padding-top: 0.2em;
	font-size: 14px;
}
#teigiWrap .taigiBox table {
	background-color: rgba(255,255,255,0.8);
	border-collapse:  collapse;
}
#teigiWrap .taigiBox table {
	border: #777 solid 1px;
}
#teigiWrap .taigiBox th {
	font-size: 18px;
	font-weight: 500;
	padding: 0.5em 0 0;
	text-align: center;
	line-height: 1.3;
	padding: 0.5em 1em;
	border: #777 solid 1px;
	white-space: nowrap;
}
#teigiWrap .taigiBox td {
font-size: 16px;
	line-height: 1.3;
	padding: 0.5em;
	border: #777 solid 1px;
}
#teigiWrap .taigiBox td.cat {
	white-space: nowrap;
}

a.btnPst {
display: block;
line-height: 1;
background-color: #D81318;
border-radius: 999px;
position: relative;
box-shadow: 0px 2px 5px rgba(0,0,0,0.5);
border: #fff solid 2px;
	font-size: 21px;
max-width: 30em;
padding: 0.5em 2em;
color: #fff;
text-align: center;
	margin: 30px auto 0;
}
a.btnPst::after {
position: absolute;
right: 2%;
top: 0;
content: '　';
width: 2em;
height: 100%;
background-image: url("/tokusetu_site/hamoruwa/oshihamo/hiro_pasta/img/info/arw.svg");
background-position: center center;
background-repeat: no-repeat;
background-size: 60%;
}
a.btnPst:hover {
	filter: brightness(130%);
	transform: scale(1.05);
}

#single #sec01 {
	background-color: #FFF3D6;
	padding: 60px 0;
}
#single #sec01 .sec01Box {
	background-color: #fff;
padding: 20px 40px 40px;
}
#single #sec01 h3 {
	background-color: #27943C;
	padding: 2% 0;
	text-align: center;
	border: none;
	margin-bottom: 0;
}
#single #sec01 h3 img {
	width: 86%;
	max-width: 600px;
}
#sec01 h4 {
	color: #E60012;
	font-size: 26px;
	padding: 0.5em 0;
}
#sec01 .imgBox {
	width: 30%;
	max-width: 210px;
	margin-left: 1.5em;
	float: right;
}
#sec01 .nameBox {
	border-top: #777 solid 1px;
	padding: 20px 0;
}
#sec01 .nameBox p {
	font-size: 16px;
	padding-bottom: 1em;
}
#sec01 .bnBox a.btnHere:hover{
	opacity: 0.6;
}
#sec01 .bnBox a.btnHere {
	display: block;
	width: 40%;
	max-width: 280px;
	min-width: 200px;
	margin: 10px auto;
}

@media screen and (max-width : 959px ){
	#titBox h3,
	#teigiWrap .taigiBox h3,
	#teigiWrap .taigiBox h4
	{
		font-size: 3.2vw;
		font-size: clamp(18px, 3.3vw, 26px);
	}
	
	a.btnPst,
	#teigiWrap .taigiBox dt,
	#sec01 h4{
		font-size: 2.7vw;
		font-size: clamp(16px, 2.7vw, 22px);
	}
	
	#teigiWrap .taigiBox dd {
		font-size: 2.2vw;
		font-size: clamp(16px, 2.2vw, 18px);
	}
	#titBox .caption {
		padding: 1em;
	}
}

@media screen and (max-width : 599px ){
	#single #titBox {
		width: 100%;
		padding-top: 0;
		padding-bottom: 0;
	}
	#teigiWrap .taigiBox th,#teigiWrap .taigiBox td{
		display: block;
		border: none;
		background-color: #fff;
		font-size: 15px;
	}
	#teigiWrap .taigiBox th {
		background-color:#d4915d;
		font-size: 16px;
		color: #fff;
	}
	#teigiWrap .taigiBox th br {
		display: none;
	}
	#teigiWrap .taigiBox td.cat{
		text-align: center;
		border: none;
		background-color: #ebd595;
		color: #9f6d24;
	}

	#single #titBox .bnnBox a, #single #bnBtm .bnnBox a {
		width: 86%;
		margin: 0 auto;
		max-width: 400px;
		margin-bottom: 10px;
		border: #fff solid 1px;
		box-shadow: 0px 2px 4px rgba(0,0,0,0.5);
	}
	#titBox h3{
		font-size: 5.9vw;
		font-size: clamp(21px, 5.9vw, 23px);
	}
	#teigiWrap .taigiBox h3,#teigiWrap .taigiBox h4
	{
		font-size: 5.3vw;
		font-size: clamp(17px, 5.3vw, 21px);
	}
	#titBox h3::before,#titBox h3::after {
		content: '';
	}
	#titBox .itemBox p {
		font-size: clamp(12px, 3.5vw, 14px);
	}
	#titBox .itemWrap {
		width: 90%;
	max-width: 350px;
	margin: 0 auto;
}
#titBox .itemBox {
	width: 100%;
	max-width: 390px;
}
	
	#teigiWrap .taigiBox {
	padding: 30px 1em;
	}
	#teigiWrap .taigiBox h4 {
	font-size: 4.8vw;
	font-size: clamp(17px, 4.8vw, 19px);
	}
	a.btnPst,
	#teigiWrap .taigiBox dt,
	#sec01 h4{
		font-size: 5.3vw;
		font-size: clamp(15px, 4.3vw, 17px);
		line-height: 1.3;
	}
	
	#teigiWrap .taigiBox dd {
		font-size: 4vw;
		font-size: clamp(14px, 4vw, 16px);
	}
	#single #sec01 {
		padding: 30px 0;
	}
	#single #sec01 .sec01Box {
		padding: 1em 1em;
	}
	#single #sec01 .sec01Box .desc {
		padding: 1em 0;
		font-size: 4vw;
		font-size: clamp(14px, 4vw, 16px);
	}
	#sec01 .nameBox p {
		font-size: 3.5vw;
		font-size: clamp(12px, 3.5vw, 14px);
	}
#sec01 .bnBox p {
	font-size: 4.8vw;
	font-size: clamp(17px, 4.8vw, 19px);
}

}