@charset "UTF-8";
/*
 * specification.css
 *
 */


/* !印刷仕様
---------------------------------------------------------- */
.specificationCts01 {
	max-width:1240px;
	margin:0 auto;
	padding:70px 20px 80px 20px;
}
.specificationCts02 {
	max-width:1240px;
	margin:0 auto;
	padding:0 20px 80px 20px;
}

.intro {
	max-width:1240px;
	height:auto;
	padding:40px 20px 0 20px;
	background:url(../../specification/img/intro_bg.gif) 50% 50% no-repeat;
	background-size:cover;
	border:7px solid #D1E9EF;
	margin-bottom:60px;
}
	.intro img.img01 {
		display:block;
		max-width:45%;
		float:left;
		margin-left:7%;
	}
	.intro img.img02 {
		display:block;
		max-width:38%;
		float:left;
		margin-top:15px;
		margin-left:3%;
	}

ul.paper {
	width:100%;
	margin-bottom:40px;
}
	ul.paper li {
		width:33.3%;
		border-right:1px dotted #999;
		padding:0 30px;
		float:left;
	}
		ul.paper li:first-child {
			border-left:1px dotted #999;
		}
		ul.paper li h3 {
			font-size:16px;
			font-weight:bold;
			text-align:center;
			margin-bottom:25px;
		}
			ul.paper li h3 span {
				color:#FFF;
				background:#95C112;
				line-height:1;
				padding:0.4em 0.6em;
				border-radius:4px;
			}
			
img.thickness {
	display:block;
	width:100%;
	max-width:766px;
	margin:0 auto;
}

ul.type {
	width:100%;
	margin-bottom:10px;
}
	ul.type li {
		width:100%;
		padding:1.4em 0;
		display: flex;
		justify-content: space-between;
		border-bottom:1px dotted #BBB;
	}
	ul.type li:first-child {
		border-top:1px dotted #BBB;
	}
		ul.type li div.left {
			width:150px;
		}
			ul.type li div.left img {
				display:block;
				width:100%;
				max-width:150px;
				box-sizing:content-box;
				margin:0 auto;
			}
		ul.type li div.right {
			width:calc(100% - 170px);
		}
			ul.type li div.right h3 {
				margin-bottom: 15px;
			}
				ul.type li div.right h3 span {
					font-weight: 700;
					color:#FFF;
					line-height:1;
					padding:0.4em 1.2em;
					background:#777;
					border-radius:20px;
				}
ul.type2 {
	width:100%;
	display: flex;
}
	ul.type2 li {
		width:150px;
		margin-right: 20px;
	}
	ul.type2 li:last-child {
		margin-right: 0;
	}
		ul.type2 li h3 {
			text-align: center;
		}
			ul.type2 li h3 span {
				font-weight: 700;
				color:#FFF;
				line-height:1;
				padding:0.4em 1.2em;
				background:#777;
				border-radius:20px;
			}
		
img.people {
	display:block;
	width:100%;
	max-width:700px;
	margin:0 auto 40px auto;
}

.cap01 {
	font-size:22px;
	text-align:center;
	line-height:1.8;
	font-weight:bold;
}
	.cap01 span {
		display:inline-block;
		color:#F09100;
		border-top:1px dotted #F09100;
		border-bottom:1px dotted #F09100;
		padding:15px 0;
		margin-top:15px;
	}
		.cap01 span br {
			display:none;
		}


@media screen and (max-width:1039px){
.specificationCts01 {
	padding:60px 20px 70px 20px;
}
.specificationCts02 {
	padding:0 20px 70px 20px;
}

.intro {
	padding:30px 0 0 0;
	margin-bottom:50px;
	border:5px solid #D1E9EF;
}
	.intro img.img01 {
		max-width:47%;
		margin-left:5%;
	}
	.intro img.img02 {
		max-width:40%;
		margin-top:10px;
		margin-left:3%;
	}
	
	ul.paper li {
		padding:0 25px;
	}
	
		ul.type li div.left {
			width:140px;
		}
			ul.type li div.left img {
				max-width:140px;
			}
		ul.type li div.right {
			width:calc(100% - 160px);
		}

	ul.type2 li {
		width:140px;
	}

img.people {
	max-width:600px;
	margin:0 auto 30px auto;
}

.cap01 {
	font-size:20px;
	text-align:center;
	line-height:1.8;
	font-weight:bold;
}
	.cap01 span {
		display:inline-block;
		color:#F09100;
		border-top:1px dotted #F09100;
		border-bottom:1px dotted #F09100;
		padding:12px 0;
		margin-top:15px;
	}

}

@media screen and (max-width:767px){
.specificationCts01 {
	padding:50px 15px 60px 15px;
}
.specificationCts02 {
	padding:0 15px 60px 15px;
}

.intro {
	padding:15px 0 0 0;
	margin-bottom:40px;
	border:3px solid #D1E9EF;
}
	.intro img.img02 {
		margin-top:4px;
	}
	
ul.paper {
	margin-bottom:10px;
}
	ul.paper li {
		width:100%;
		border-right:none;
		border-bottom:1px dotted #999;
		padding:0 0 20px 0;
		float:none;
		margin-bottom:20px;
		
	}
		ul.paper li:first-child {
			border-left:none;
		}
		ul.paper li h3 {
			font-size:14px;
			margin-bottom:20px;
		}
		
ul.type {
	margin-bottom:10px;
}
	ul.type li {
		width:100%;
		padding:1.4em 0;
		flex-wrap: wrap;
		justify-content: space-between;
		border-bottom:1px dotted #BBB;
	}
	ul.type li:first-child {
		border-top:0;
	}
		ul.type li div.left {
			width:100%;
			margin-bottom: 5px;
		}
			ul.type li div.left img {
				display:block;
				width:100%;
				max-width:110px;
				box-sizing:content-box;
				margin:0 auto;
			}
		ul.type li div.right {
			width:100%;
		}
			ul.type li div.right h3 {
				text-align: center;
			}
				ul.type li div.right h3 span {
					font-weight: 700;
					color:#FFF;
					line-height:1;
					padding:0.4em 1.2em;
					background:#777;
					border-radius:20px;
				}
ul.type2 {
	flex-wrap: wrap;
}
	ul.type2 li {
		width:100%;
		margin-right: 0;
		margin-bottom: 20px;
	}
		ul.type2 li img {
			display: block;
			width:110px;
			margin: 0 auto 5px auto;
		}
		ul.type2 li h3 {
			text-align: center;
		}
		
img.people {
	margin:0 auto 20px auto;
}

.cap01 {
	font-size:16px;
}
	.cap01 span {
		padding:10px 0;
		margin-top:12px;
	}
		.cap01 span br {
			display:inherit;
		}

}

/* !250408追加
---------------------------------------------------------- */
ul.hiyo {
	width:100%;
	display: flex;
	margin-bottom:20px;
}
	ul.hiyo li.norm {
		width:17%;
	}
		ul.hiyo li.norm h3 {
			font-size:16px;
			font-weight:bold;
			text-align:center;
			margin-bottom:20px;
		}
			ul.hiyo li.norm h3 span {
				color:#FFF;
				background:#95C112;
				line-height:1;
				padding:0.4em 0.6em;
				border-radius:4px;
			}
		ul.hiyo li.norm img {
			display: block;
			width:90%;
			max-width: 160px;
			margin: 0 auto 15px auto;
		}
		ul.hiyo li.norm p {
			text-align: center;
			line-height: 1.6;
		}
	ul.hiyo li.multi {
		width:3.75%;
		align-self: center;
	}
		ul.hiyo li.multi p {
			font-size:40px;
			font-weight: bold;
			color: #95C112;
			text-align: center;
			line-height: 1.4;
		}

ul.want {
	width:100%;
	margin-bottom:30px;
}
	ul.want li {
		padding:0.6em 0;
		border-bottom:1px dotted #BBB;
	}
	ul.want li:first-child {
		border-top:1px dotted #BBB;
	}
		ul.want li h3 {
			font-size:16px;
			font-weight: 500;
		}
			ul.want li h3 i {
				color:#FF9600;
				margin-right: 0.6em;
			}
		ul.want li p {
			font-size:16px;
			font-weight: bold;
		}
			ul.want li p i {
				color:#95C112;
				margin-right: 0.6em;
			}

div.thickness {
	width:100%;
	display: flex;
}
	div.thickness div.left {
		width:220px;
	}
		div.thickness div.left img {
			display: block;
			width:170px;
		}
	div.thickness div.right {
		width:calc(100% - 220px);
	}
		div.thickness div.right dl {
			width:100%;
		}
			div.thickness div.right dl dt {
				position: relative;
				float: left;
				font-weight: bold;
				padding-left:1em;
			}
				div.thickness div.right dl dt:before {
					position: absolute;
					content:"";
					width:6px;
					height: 6px;
					background: #95C112;
					border-radius: 50%;
					top:13px;
					left:0;
				}
			div.thickness div.right dl dd {
				margin-left: 8em;
				margin-bottom: 10px;
			}
			div.thickness div.right dl dd:last-child {
				margin-bottom: 0;
			}

table.table01 {
	border-top: 1px solid #D5D5D5;
	border-right: 1px solid #D5D5D5;
	border-collapse: collapse;
	width: 100%;
	line-height:1.6;
	margin-top:20px;
}
	table.table01 th,
	table.table01 td {
		border-left: 1px solid #D5D5D5;
		border-bottom: 1px solid #D5D5D5;
		padding: 10px;
	}
	table.table01 th {
		width:33.33%;
		background-color: #F2FCD3;
		font-weight:bold;
		text-align: center;
	}
	table.table01 th.long {
		width:66.34%;
		background-color: #F2FCD3;
		font-weight:bold;
		text-align: center;
	}
		table.table01 th br {
			display: none;
		}
	table.table01 td {
		text-align: left;
	}

ul.pocket {
	width:100%;
	display: flex;
	flex-wrap: wrap;
	margin-bottom:20px;
}
	ul.pocket li {
		width:33.33%;
		padding:0 25px;
		border-right:1px dotted #999;
		margin-top: 10px;
		margin-bottom:20px;
	}
	ul.pocket li:nth-child(3n+1) {
		border-left:1px dotted #999;
	}
		ul.pocket li img {
			display: block;
			width:140px;
			margin: 0 auto 10px auto;
		}
		ul.pocket li h4 {
			font-size:16px;
			font-weight: 700;
			color: #95C112;
			text-align: center;
			line-height: 1.6;
			margin-bottom: 10px;
		}

ul.pocketMerit {
	width:100%;
	margin-top:20px;
	margin-bottom:40px;
}
	ul.pocketMerit li {
		width:33.3%;
		border-right:1px dotted #999;
		padding:0 30px;
		float:left;
	}
		ul.pocketMerit li:first-child {
			border-left:1px dotted #999;
		}
		ul.pocketMerit li h3 {
			font-size:17px;
			font-weight:bold;
			text-align:center;
			margin-bottom:25px;
		}
			ul.pocketMerit li h3 span {
				color:#FFF;
				background:#FF9600;
				line-height:1;
				padding:0.4em 0.6em;
				border-radius:4px;
			}
			ul.pocketMerit li h3 span.option {
				background:#95C112;
			}

ul.localNavi {
	width:100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
	ul.localNavi li {
		display: inline-block;
		margin-right: 8px;
		margin-bottom: 10px;
	}
		ul.localNavi li a {
			display: inline-block;
			padding: 0.2em 1em;
			color: #111;
			border:1px solid #DDD;
			border-radius: 30px;
			background: #FFF;
			transition: .6s;
		}
			ul.localNavi li a:hover,
			ul.localNavi li a.current {
				border:1px solid #f8b141;
				background: #f8b141;
			}
			ul.localNavi li a i {
				margin-right: 0.6em;
			}

@media screen and (max-width:1039px){
		ul.hiyo li.multi p {
			font-size:34px;
		}
	
		ul.want li h3 {
			font-size:15px;
		}
		ul.want li p {
			font-size:15px;
		}
	
	div.thickness div.left {
		width:200px;
	}
	div.thickness div.right {
		width:calc(100% - 200px);
	}
	
ul.pocket {
	margin-bottom:10px;
}
	ul.pocket li {
		padding:0 20px;
	}
		ul.pocket li img {
			width:130px;
		}
		ul.pocket li h4 {
			font-size:14px;
		}
	
		ul.pocketMerit li h3 {
			font-size:14px;
			margin-bottom:20px;
		}
		ul.pocketMerit li {
			padding:0 15px;
		}
	
		ul.localNavi li a {
			padding: 0.2em 1.2em;
			font-size:15px;
		}
			ul.localNavi li a:hover {
				border:1px solid #DDD;
				background: #FFF;
			}
			ul.localNavi li a.current:hover {
				border:1px solid #f8b141;
				background: #f8b141;
			}
}

@media screen and (max-width:767px){
ul.hiyo {
	flex-wrap: wrap;
	margin-bottom:30px;
}
	ul.hiyo li.norm {
		width:100%;
	}
		ul.hiyo li.norm h3 {
			font-size:14px;
			margin-bottom:10px;
		}
		ul.hiyo li.norm img {
			width:100%;
			max-width: 100px;
			margin: 0 auto 15px auto;
		}
	ul.hiyo li.multi {
		width:100%;
	}
	
		ul.want li h3 {
			font-size:14px;
		}
		ul.want li p {
			font-size:14px;
		}
	
div.thickness {
	flex-wrap: wrap;
}
	div.thickness div.left {
		width:100%;
		margin-bottom: 30px;
	}
		div.thickness div.left img {
			width:140px;
			margin: 0 auto;
		}
	div.thickness div.right {
		width:100%;
	}
	
		table.table01 th br {
			display: inherit;
		}
	
ul.pocket {
	margin-bottom:40px;
}
	ul.pocket li {
		width:100%;
		padding:20px 0;
		border-right:0;
		border-bottom:1px dotted #999;
		margin-top: 0;
		margin-bottom:0;
	}
	ul.pocket li:nth-child(3n+1) {
		border-left:0;
	}
	ul.pocket li:first-child {
		border-top:1px dotted #999;
		margin-top: 10px;
	}
		ul.pocket li img {
			display: block;
			width:110px;
			margin: 0 auto 10px auto;
		}
		ul.pocket li h4 {
			font-size:16px;
			font-weight: 700;
			color: #95C112;
			text-align: center;
			line-height: 1.6;
			margin-bottom: 10px;
		}
	
ul.pocketMerit {
	margin-bottom:20px;
}
	ul.pocketMerit li {
		width:100%;
		border-right:none;
		border-bottom:1px dotted #999;
		padding:0 0 20px 0;
		float:none;
		margin-bottom:20px;
	}
		ul.pocketMerit li:first-child {
			border-left:none;
		}
		ul.pocketMerit li h3 {
			font-size:15px;
		}
	
ul.localNavi {
	max-width:260px;
	margin: 0 auto;
}
	ul.localNavi li {
		width:100%;
		margin-right: 0;
		margin-bottom: 6px;
	}
		ul.localNavi li a {
			display: block;
			width:100%;
			font-size:14px;
			text-align: center;
		}
}
