@charset "utf-8";

a.button {
	width: 350px;
	color: #000;
	background-color: #FFF;
	margin: 10px 5px;
	font: bold;
	border: 2px solid #808080;
	padding: 10px;
	cursor: pointer;

	&:hover {
		background-color: #F2F2F2;
		text-decoration: none;
	}
}


#allContainer {
	min-height: calc(100dvh - 359px);
}


#mainContent_prod_index,
#mainContent_prod {
	* {
		box-sizing: border-box;
	}
}


/* topページ用 タイトル周り */
#mainContent_prod_index #contentsTitle {
	h1 {
		.prod_name {
			letter-spacing: 0.05em;
		}

		.prod_read {
			letter-spacing: 0.1em;
		}
	}
}


#mainContent_prod {
	div.h1area {
		h1 {
			letter-spacing: 0.075em;
		}

		p {
			font-size: 1.2rem;
			letter-spacing: 0.1em;
			padding-top: 22px;
		}
	}

	h3　{
		margin-bottom:	20px;
	}
}


#topicpath,
#topicpath a {
	letter-spacing: 0.05em;
}


#contentsArea {
	h2, h3, h4, h5, h6 {
		letter-spacing: 0.075em;
	} 

	h2, h3, h4, h5, h6 {
		margin-bottom: 1em;
	} 

	p, li, th, td, dt, dd, a {
		letter-spacing: 0.05em;
	} 

	.img_center {
		margin: 40px auto;
	}


	a {
		&[target="_blank"] {
			&:after {
				display: inline-block;
				content: url(/img/0/link.gif);
				margin-left: 0.5em;
			}

			&:hover {
				&:after {
					content: url(/img/0/link_on.gif);
				}
			}
		}

		img {
			opacity: 1.0;
			transition: opacity 0.4s;
		}

		&:hover {
			img {
				opacity: 0.65;
			}
		}
	}

	li {
		margin-bottom: 0.75em;
	}


	ul.blue_titele {
		list-style-type: none;

		& > li {
			margin-top: 1em;
			margin-left: 0;
			padding-left: 1.5em;
			text-indent: -1.5em;

			&:before {
				content: "・ ";
				font-weight: bold;
			}
		}

		& > li:before,
		& > li > strong {
			color: #005CCA;
		}
	}

	#infoBox {
		width:710px;
		padding:12px 20px;

		ul {
			margin:0;
			padding:0;
		}

		li {
			margin:0;
			padding:0.75em 0;
			border-bottom:dotted 1px #CCC;

			a {
				display:block;

				a[href*=".pdf"] {
					background:url(/img/0/link_pdf_s.gif) no-repeat 0 4px;
					padding-left:26px;
				}
			}

			& > li:nth-last-of-type(1) {
				border-bottom: none;
			}
		}

	}


	.bnrArea {
		margin: 20px 0 50px 0;
		text-align: center;
		line-height:4;

		a {
			margin: 1em auto;
			transition:0.3s opacity;

			&:hover{
				opacity: 0.7;
			}
		}
	}

	.flexArea {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin-bottom:50px;

		& > div:nth-of-type(1) {
			width: 300px;

			img {
				width: 100%;
				height: auto;
			}
		}

		& > div:nth-of-type(2) {
			width: calc(100% - 300px - 40px);
		}
	}

	.new li {
		margin-bottom:0.75em;
		line-height:1.75em;
		padding-top: 5px;
		padding-bottom: calc(0.75em + 2px);

		img {
			padding-right:	0.25em;
		}

		a {
			display: inline;
			padding-right: 0.25em;
			padding-left: 0.25em;
		}

		a:first-child,
		img + a {
			padding-left: 0;
		}

	}


	/* 更新履歴 */
	&.update-history #newBox .new {
		list-style-type: disc;
		margin-left: 1.5em;

		li {
			border-bottom: none;
			list-style: initial;
			padding: 0;
		}
	}





	ul.new + div {
		line-height: 1.5em;
		letter-spacing: 0.05em;
	}


	table {
		box-sizing:					border-box;
		margin:							30px auto;
		border-color: grey;

		&.w50 {
			width:	50%;
		}

		&.w60 {
			width:	60%;

			th, td {
				width: 30%;
			}

			 th {
				color: #FFF;
				background-color: #005CCA;
			}
		}

		th,  td {
			text-align:	center;
		}

		tr > td:nth-of-type(1) {
			text-align:	left;
		}
	}


	.caption {
		color: #666;
	}


	ul.img_text {
		width:	700px;
		margin:	30px auto;

		li {
			display: flex;
			margin:	0 0 30px;
			justify-content: space-between;

			img {
				display: block;
			}

			p {
				width: 430px;
				display: flex;
				align-items: center;

				&:nth-last-of-type(1) {
					margin-bottom: 0;
				}
			}
		}
	}


	.img_2col {
		display: flex;
		justify-content: space-between;

		& > div {
			width: 50%;
			text-align:	center;
		}
	}


	.boder-dotted {
		list-style-type: none;
		margin-top: 1.75em;
		border-bottom: dotted 1px #CCC;

		li {
			margin: 0;
		}

		& > li {
			border-top: dotted 1px #CCC;
			padding: 0.75em 0.5em;
		}
	}

	

}

