/*
 * 移行元のページ専用のスタイルの写し（記事シリーズ Quality Of Life の記事 /qol/archives/）。
 *
 * 写し元: legacy/www.p-a.jp/public/qol/css/article.css
 * このファイルは手で書かない。写し元を
 * scripts/pa-cms/transform-legacy-page-css.py に通して作り直す。
 *
 * 写し元をそのまま置けない理由が 2 つある。
 *
 *   1. 写し元は 1 枚で完結した静的ページ用で、根の要素（html / body / *）へ
 *      余白の初期化と文字の指定を当てている。テーマのヘッダー・フッターへ
 *      その初期化が波及すると崩れるため、すべてのセレクタの前に
 *      `.pa-page--qol .page-content__body` を足して本文の中へ閉じ込めている。
 *   2. 写し元は根の文字を幅によらず 10px に固定している
 *      （`font-size: 62.5%` の書き方）。寸法は rem で書かれているが、
 *      このテーマの根の文字は 16px 固定で、他のすべてのページに関わるため
 *      変えられない。そこで **どの幅でも同じ 1rem = 10px で実寸へ換算した。**
 *      幅で 2 通りに書き分けていないのは、写し元の基準が幅で変わらない
 *      ためである。**写し元の基準そのもの（`font-size`）は書き出していない。**
 *      換算で用済みだからである。
 */
.pa-page--qol .page-content__body .article.wrap {
	min-width: 1200px;
	overflow: hidden;
	font-size: 14px;
}
.pa-page--qol .page-content__body a {
	color: #0092cf;
	text-decoration: none;
}
.pa-page--qol .page-content__body a:hover {
	color: #f64f54;
	text-decoration: underline;
}
@media screen and (max-width: 768px) {
	.pa-page--qol .page-content__body .article.wrap {
		min-width: inherit;
	}
}
.pa-page--qol .page-content__body article {
	background: rgb(254,238,244);
	background: -moz-linear-gradient(left, rgba(254,238,244,1) 0%, rgba(241,251,250,1) 50%, rgba(249,251,238,1) 100%);
	background: -webkit-linear-gradient(left, rgba(254,238,244,1) 0%,rgba(241,251,250,1) 50%,rgba(249,251,238,1) 100%);
	background: linear-gradient(to right, rgba(254,238,244,1) 0%,rgba(241,251,250,1) 50%,rgba(249,251,238,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feeef4', endColorstr='#f9fbee',GradientType=1 );
	padding: 30px 0 60px;
}
.pa-page--qol .page-content__body .article-in, .pa-page--qol .page-content__body .area-prof {
	background: #fff;
	border-radius: 8px;
	margin: 0 auto 30px;
	width: 1200px;
	padding: 80px 100px;
}
.pa-page--qol .page-content__body section {
	margin: 40px 0;
	overflow: hidden;
}
.pa-page--qol .page-content__body h1 {
	font-size: 32px;
	border-bottom: 3px #f64f54 solid;
	padding-bottom: 22px;
	font-weight: normal;
}
.pa-page--qol .page-content__body h2 {
	font-size: 28px;
	font-weight: normal;
	color: #f64f54;
	margin: 40px 0;
	line-height: 1.6;
	display: inline-block;
	width: 100%;
}
.pa-page--qol .page-content__body h3 {
	font-size: 20px;
	margin: 10px 0 25px;
	line-height: 1.6;
	border-left: 3px #282828 solid;
	padding-left: 16px;
	display: inline-block;
	width: 100%;
}
.pa-page--qol .page-content__body h4 {
	font-size: 18px;
	margin: 10px 0 20px;
	line-height: 1.6;
	display: inline-block;
	width: 100%;
}
.pa-page--qol .page-content__body strong.lev1 {
	color: #f64f54;
}
.pa-page--qol .page-content__body .article-detail p a[target="_blank"] {
	padding-right: 15px;
	background: url(../images/ico_blank02.png?ver=ab28983e7ae2) no-repeat right 0.5em;
	display: inline-block;
	margin-right: 4px;
}
.pa-page--qol .page-content__body .article-detail p.fontS {
	font-size: 12px;
}
.pa-page--qol .page-content__body .article-detail p.box-bg {
	background: #f6f6f6;
	padding: 15px 20px;
	margin: 10px 0;
	overflow: hidden;
}
.pa-page--qol .page-content__body .disc-list01, .pa-page--qol .page-content__body .num-list01, .pa-page--qol .page-content__body .link-list01 {
	margin: 20px 0 20px 18px;
}
.pa-page--qol .page-content__body .disc-list01 li {
	list-style: disc;
	list-style-position: outside;
}
.pa-page--qol .page-content__body .num-list01 li {
	list-style: decimal;
	list-style-position: outside;
}
.pa-page--qol .page-content__body .link-list01 {
	margin-left: 0;
}
.pa-page--qol .page-content__body .link-list01 li {
	padding-left: 16px;
	position: relative;
}
.pa-page--qol .page-content__body .link-list01 li:before {
	content: '';
	top: 10px;
	left: 0;
	width: 5px;
	height: 5px;
	border: 1px solid;
	border-color: transparent transparent #282828 #282828;
	transform: rotate(-135deg);
	position: absolute;
	border-radius: 1px;
}
.pa-page--qol .page-content__body .article-meta {
	display: block;
	margin-bottom: 36px;
	overflow: hidden;
}
.pa-page--qol .page-content__body .article-meta .btn-sns {
	float: right;
	margin: 0;
	position: inherit;
}
.pa-page--qol .page-content__body .article-meta .tag {
	float: left;
	color: #929292;
	width: 820px;
}
.pa-page--qol .page-content__body .article-meta .tag ul.category li {
	padding: 0 20px 0 0;
	display: inline-block;
	margin-bottom: 12px;
}
.pa-page--qol .page-content__body .article-meta .tag ul.category li:nth-child(n + 2) {
	padding: 0 20px 0 24px;
	border-left: 1px #d1d1d1 solid;
}
.pa-page--qol .page-content__body .guest {
	font-size: 14px;
	line-height: 1.5;
	margin-top: 12px;
}
.pa-page--qol .page-content__body .guest dl {
	width: 48%;
	display: inline-block;
	margin-bottom: 16px;
	vertical-align: top;
}
.pa-page--qol .page-content__body .guest dl:nth-child(odd) {
	margin-right: 30px;
}
.pa-page--qol .page-content__body .guest dt {
	float: left;
	margin-right: 16px;
	width: 60px;
}
.pa-page--qol .page-content__body .guest dt img {
	width: 100%;
}
.pa-page--qol .page-content__body .guest dd {
	float: left;
	width: 400px;
}
.pa-page--qol .page-content__body .guest dd span {
	font-size: 16px;
	font-weight: bold;
	display: block;
	margin-bottom: 6px;
}
.pa-page--qol .page-content__body .guest .radius {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	overflow: hidden;
}
.pa-page--qol .page-content__body .guest .guest-detail {
	width: 100%;
	margin: 0;
}
.pa-page--qol .page-content__body .guest .guest-detail dt {
	width: 120px;
}
.pa-page--qol .page-content__body .guest .guest-detail dd {
	width: 100%;
}
.pa-page--qol .page-content__body .guest .guest-detail .more-guest {
	padding: 16px 0;
	width: 100%;
	display: block;
	border: 1px #e0e0e0 solid;
	border-radius: 4px;
	text-align: center;
	cursor: pointer;
	position: relative;
}
.pa-page--qol .page-content__body .guest .guest-detail .more-guest:before {
	content: '';
	left: 362px;
	top: 20px;
	width: 5px;
	height: 5px;
	border: 1px solid;
	border-color: transparent transparent #282828 #282828;
	transform: rotate(-45deg);
	position: absolute;
	border-radius: 1px;
}
.pa-page--qol .page-content__body .guest .guest-detail .more-guest.cur:before {
	top: 24px;
	transform: rotate(135deg);
}
.pa-page--qol .page-content__body .guest .guest-detail .more-guest:hover {
	color: #f64f54;
}
.pa-page--qol .page-content__body .guest .guest-detail .more-guest:hover:before {
	border-color: transparent transparent #f64f54 #f64f54;
}
.pa-page--qol .page-content__body .article-detail {
	margin-top: 20px;
	font-size: 15px;
	line-height: 1.8;
	overflow: hidden;
}
.pa-page--qol .page-content__body .article-detail img {
	border-radius: 8px;
}
.pa-page--qol .page-content__body .article-detail .summary {
	margin: 60px 0 50px;
	padding: 50px 50px 30px 50px;
	border: 10px #fbf7fc solid;
	border-radius: 10px;
}
.pa-page--qol .page-content__body .article-detail .summary span {
	font-size: 80%;
}
.pa-page--qol .page-content__body .article-detail p {
	margin-bottom: 18px;
}
.pa-page--qol .page-content__body .article-detail p.guest-lead {
	color: #a5a5a5;
	font-weight: bold;
	margin: 10px 0;
}
.pa-page--qol .page-content__body .article-detail .comment {
	overflow: hidden;
	margin: 10px 0 30px;
}
.pa-page--qol .page-content__body .article-detail .comment .txt:last-child {
	margin: 0;
}
.pa-page--qol .page-content__body .article-detail .comment .name {
	width: 54px;
	margin: 5px 20px 0 0;
	float: left;
	line-height: 1.4;
	font-weight: bold;
}
.pa-page--qol .page-content__body .article-detail .comment .txt {
	width: 92%;
	float: left;
	overflow: hidden;
	margin-bottom: 14px;
}
.pa-page--qol .page-content__body .article-detail .comment .imgC {
	width: 100%;
	margin: 25px 0;
}
.pa-page--qol .page-content__body .article-detail .comment .imgC img {
	width: 100%;
}
.pa-page--qol .page-content__body .article-detail .comment .imgR {
	width: 400px;
	float: right;
	margin: 5px 0 40px 30px;
}
.pa-page--qol .page-content__body .br-non {
	border-radius: 0px !important;
}
.pa-page--qol .page-content__body .col1 {
	margin: 20px 0 40px;
}
.pa-page--qol .page-content__body .col1 img {
	width: 100%;
	margin-bottom: 10px;
}
.pa-page--qol .page-content__body .article-detail .col2 {
	overflow: hidden;
}
.pa-page--qol .page-content__body .article-detail .col2 .img {
	width: 400px;
	float: right;
	margin: 10px 0 0 30px;
}
.pa-page--qol .page-content__body .article-detail .col2 .img img {
	margin-bottom: 20px;
}
.pa-page--qol .page-content__body .article-detail .col2 .comment {
	width: 56%;
	float: left;
}
.pa-page--qol .page-content__body .article-detail .col2 .comment .txt {
	width: 86%;
}
.pa-page--qol .page-content__body .next-ttl {
	text-align: center;
	font-size: 16px;
	margin-bottom: 40px;
}
.pa-page--qol .page-content__body .next-ttl:before {
	content: "次ページ";
	margin-right: 20px;
}
.pa-page--qol .page-content__body .page-nav {
	margin: 20px auto;
	text-align: center;
}
.pa-page--qol .page-content__body .page-nav li {
	display: inline-block;
	margin: 0 5px;
}
.pa-page--qol .page-content__body .page-nav li.cur {
	padding: 15px 22px;
	border-radius: 4px;
	background: #f64f54;
	font-size: 16px;
	color: #fff;
}
.pa-page--qol .page-content__body .page-nav li a {
	padding: 15px 22px;
	border: 1px #e0e0e0 solid;
	border-radius: 4px;
	color: #282828;
	text-decoration: none;
	font-size: 16px;
}
.pa-page--qol .page-content__body .page-nav li a:hover {
	color: #fff;
	background: #f64f54;
	border: 1px #f64f54 solid;
}
.pa-page--qol .page-content__body .area-bnr {
	margin: 60px auto 0;
	width: 1200px;
}
.pa-page--qol .page-content__body .area-bnr li {
	border: 1px #e9ebee solid;
	display: inline-block;
	margin-right: 28px;
	width: 378px;
	height: auto;
}
.pa-page--qol .page-content__body .area-bnr li:last-child {
	margin-right: 0;
}
.pa-page--qol .page-content__body .area-bnr li img {
	width: 100%;
}
.pa-page--qol .page-content__body .area-bnr li:hover {
	border: 1px #f64f54 solid;
}
.pa-page--qol .page-content__body .btn-next {
	margin: 60px auto 0;
	text-align: center;
}
.pa-page--qol .page-content__body .btn-next a {
	padding: 20px 100px 20px 120px;
	display: inline-block;
	border: 1px #e0e0e0 solid;
	border-radius: 6px;
	cursor: pointer;
	position: relative;
	color: #282828;
	font-size: 16px;
}
.pa-page--qol .page-content__body .btn-next a:hover {
	text-decoration: none;
	color: #fff;
	background: #f64f54;
	border: 1px #f64f54 solid;
}
.pa-page--qol .page-content__body .btn-next a:before {
	content: '';
	top: 27px;
	left: 90px;
	width: 5px;
	height: 5px;
	border: 1px solid;
	border-color: transparent transparent #282828 #282828;
	transform: rotate(-135deg);
	position: absolute;
	border-radius: 1px;
}
.pa-page--qol .page-content__body .btn-next a:hover:before {
	border-color: transparent transparent #fff #fff;
}
.pa-page--qol .page-content__body .prof dl {
	width: 100%;
	display: inline-block;
	margin-bottom: 30px;
	vertical-align: top;
	line-height: 1.8;
}
.pa-page--qol .page-content__body .prof dl:last-child {
	margin-bottom: 0;
}
.pa-page--qol .page-content__body .prof dt {
	float: left;
	margin-right: 20px;
}
.pa-page--qol .page-content__body .prof dt img {
	border-radius: 4px;
}
.pa-page--qol .page-content__body .prof dd {
	float: left;
	width: 860px;
}
.pa-page--qol .page-content__body .prof dd span {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 4px;
	display: block;
}
.pa-page--qol .page-content__body .more-prof {
	width: 100%;
	background: #fbf7fc;
	padding: 40px;
	display: none;
}
.pa-page--qol .page-content__body .more-prof .prof dd {
	width: 780px;
}
@media screen and (max-width: 768px) {
	.pa-page--qol .page-content__body article {
		padding: 16px 16px 10px;
	}
	.pa-page--qol .page-content__body .article-in, .pa-page--qol .page-content__body .area-prof {
		font-size: 14px;
		margin-bottom: 15px;
		width: 100%;
		padding: 20px 15px;
	}
	.pa-page--qol .page-content__body section {
		margin: 20px 0;
	}
	.pa-page--qol .page-content__body h1 {
		font-size: 20px;
		padding-bottom: 14px;
		line-height: 1.5;
	}
	.pa-page--qol .page-content__body h2 {
		font-size: 17px;
		margin: 10px 0 20px;
	}
	.pa-page--qol .page-content__body h3 {
		font-size: 15px;
		margin: 10px 0 15px;
		border-left: 2px #282828 solid;
		padding-left: 10px;
	}
	.pa-page--qol .page-content__body h4 {
		font-size: 14px;
		margin: 10px 0;
		line-height: 1.6;
		display: inline-block;
		width: 100%;
	}
	.pa-page--qol .page-content__body .article-meta {
		margin-bottom: 20px;
	}
	.pa-page--qol .page-content__body .article-meta .btn-sns {
		float: inherit;
		text-align: center;
	}
	.pa-page--qol .page-content__body .article-meta .btn-sns li {
		margin: 0;
		width: 32%;
	}
	.pa-page--qol .page-content__body .article-meta .btn-sns li a {
		border-radius: 4px;
		padding: 13px 36px;
	}
	.pa-page--qol .page-content__body .article-meta .tag {
		float: inherit;
		width: 100%;
		margin-top: 15px;
		font-size: 11px;
	}
	.pa-page--qol .page-content__body .article-meta .tag ul.category li {
		padding: 0 10px 0 0;
		margin-bottom: 8px;
	}
	.pa-page--qol .page-content__body .article-meta .tag ul.category li:nth-child(n + 2) {
		padding: 0 10px 0 12px;
	}
	.pa-page--qol .page-content__body .guest {
		margin-top: 8px;
	}
	.pa-page--qol .page-content__body .guest dl {
		width: 100%;
		margin-bottom: 12px;
	}
	.pa-page--qol .page-content__body .guest:nth-child(odd) {
		margin-right: 0;
	}
	.pa-page--qol .page-content__body .guest dt {
		margin-right: 10px;
		width: 16%;
	}
	.pa-page--qol .page-content__body .guest dd {
		width: 80%;
		font-size: 10px;
	}
	.pa-page--qol .page-content__body .guest dd span {
		font-size: 11px;
		margin-bottom: 3px;
	}
	.pa-page--qol .page-content__body .guest .guest-detail dt {
		width: 25%;
	}
	.pa-page--qol .page-content__body .guest .guest-detail .more-guest {
		margin: 6px 0 0;
		font-size: 11px;
	}
	.pa-page--qol .page-content__body .guest .guest-detail .more-guest:before {
		left: 10%;
		top: 17px;
	}
	.pa-page--qol .page-content__body .article-detail {
		margin: 20px 0 0;
		font-size: 14px;
		line-height: 1.7;
	}
	.pa-page--qol .page-content__body .article-detail img {
		border-radius: 4px;
		width: 100%;
	}
	.pa-page--qol .page-content__body .article-detail .summary {
		margin: 30px 0 0;
		padding: 15px;
		border: 8px #fbf7fc solid;
		border-radius: 8px;
	}
	.pa-page--qol .page-content__body .article-detail .summary span {
		font-size: 100%;
	}
	.pa-page--qol .page-content__body .article-detail .comment {
		margin: 0;
	}
	.pa-page--qol .page-content__body .article-detail .comment .name {
		width: 100%;
		margin: 0 0 4px;
		float: inherit;
		display: block;
	}
	.pa-page--qol .page-content__body .article-detail .comment .txt {
		width: 100%;
		float: inherit;
		margin: 0 0 4px;
	}
	.pa-page--qol .page-content__body .article-detail .comment .imgC, .pa-page--qol .page-content__body .article-detail .comment .imgR {
		width: 100%;
		height: auto;
		margin: 10px 0 20px;
		float: inherit;
	}
	.pa-page--qol .page-content__body .article-detail .col2 .img {
		width: 100%;
		float: inherit;
		margin: 0 0 15px;
	}
	.pa-page--qol .page-content__body .article-detail .col2 .img img {
		margin-bottom: 10px;
	}
	.pa-page--qol .page-content__body .article-detail .col2 .comment {
		width: 100%;
		float: inherit;
	}
	.pa-page--qol .page-content__body .article-detail .col2 .comment .txt {
		width: 100%;
	}
	.pa-page--qol .page-content__body .col1 {
		margin: 10px 0 15px;
	}
	.pa-page--qol .page-content__body .col1 img {
		width: 100%;
	}
	.pa-page--qol .page-content__body .main-img {
		margin: 30px 0 0;
		border-radius: 4px;
		width: 100%;
	}
	.pa-page--qol .page-content__body .next-ttl {
		font-size: 14px;
		margin: 60px 0 36px;
		position: relative;
		line-height: 1.6;
	}
	.pa-page--qol .page-content__body .next-ttl:before {
		margin: 0 0 20px;
		position: absolute;
		top: -30px;
		left: 0;
		right: 0;
	}
	.pa-page--qol .page-content__body .page-nav {
		margin: 30px auto;
	}
	.pa-page--qol .page-content__body .page-nav li {
		margin: 0 1px 20px;
	}
	.pa-page--qol .page-content__body .page-nav li.cur, .pa-page--qol .page-content__body .page-nav li a {
		padding: 14px 20px;
	}
	.pa-page--qol .page-content__body .area-bnr {
		margin: 20px auto 40px;
		width: 100%;
	}
	.pa-page--qol .page-content__body .area-bnr li {
		margin: 0 0 10px;
		width: 100%;
	}
	.pa-page--qol .page-content__body .btn-next {
		margin: 50px auto 20px;
		line-height: 1.6;
	}
	.pa-page--qol .page-content__body .btn-next a {
		padding: 15px 16px 15px 30px;
		font-size: 14px;
		width: 80%;
	}
	.pa-page--qol .page-content__body .btn-next a:before {
		top: 23px;
		left: 40px;
	}
	.pa-page--qol .page-content__body .prof dl {
		margin-bottom: 20px;
	}
	.pa-page--qol .page-content__body .prof dt {
		margin-right: 10px;
		width: 25%;
	}
	.pa-page--qol .page-content__body .prof dt img {
		width: 100%;
		border-radius: 2px;
	}
	.pa-page--qol .page-content__body .prof dd {
		width: 70%;
		font-size: 11px;
	}
	.pa-page--qol .page-content__body .prof dd.detail {
		width: 100%;
		margin-top: 10px;
	}
	.pa-page--qol .page-content__body .prof dd span {
		font-size: 12px;
		margin-bottom: 2px;
	}
	.pa-page--qol .page-content__body .more-prof {
		padding: 15px;
	}
	.pa-page--qol .page-content__body .more-prof .prof dd {
		width: 70%;
	}
	.pa-page--qol .page-content__body .more-prof .prof dd.detail {
		width: 100%;
	}
}
