/* common start */
#single-blog .inner{
	max-width: 1000px;
}
#single-blog .blogList .item{
	margin-bottom: 0;
}
.single-other{
	margin-top: 70px;
}
.single-other.single-profile{
	margin-top: 0;
	margin-bottom: 100px;
}
.single-otherTitle{
	box-sizing: border-box;
	width: 1000px;
	margin: 0 auto 50px;
	background-color: #577ca2;
	border-radius: 20px;
	padding: 5px;
}
.single-otherTitle div {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border: solid 1px white;
	border-radius: 15px;
	padding: 15px 30px;
}
.single-otherTitle div h2 {
	display: inline-block;
	font-size: 2.5rem;
	font-weight: 600;
	color: white;
	border-left: solid 2px white;
	line-height: 1;
	padding-left: 10px;
	letter-spacing: 0;
}
.single-otherTitle div a {
	position: relative;
	padding-right: 25px;
	color: white;
	font-weight: 600;
	line-height: 1;
}
.single-otherTitle div a::before {
	font-family: "Font Awesome 5 Free";
	content: '\f054';
	font-weight: 600;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	transition: 0.3s;
	color: white;
}
/* common end */

/* content start */
.single-content{
	padding: 100px 0 100px;
}
.single-content .title{
	border-bottom: solid 2px #d9f1fa;
	padding-bottom: 5px;
	margin-bottom: 40px;
}
.single-content time{
	font-weight: 600;
	color: #577ca2;
}
.single-content h1{
	font-size: 3.5rem;
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1.5;
}
.single-content .eyeCatch{
	margin: 0;
}
.single-content .eyeCatch img{
	width: 100%;
}
.single-content h2{
	font-size: 2.5rem;
	font-weight: 600;
	padding: 0.3em 0 0.3em 0.8em;/*文字周りの余白*/
	background: #f4f9fc;/*背景色*/
	border-left: solid 5px #577ca2;/*左線（実線 太さ 色）*/
	margin: 45px 0 10px;
}
.single-content h3 {
	font-size: 2.2rem;
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: 0;
	border-left: solid 5px #577ca2;
	padding-left: 15px;
	margin: 30px 0 10px;
}
.single-content h4{
	display: inline-block;
	font-size: 1.8rem;
	font-weight: 600;
	margin: 20px 0 0;
	border-bottom: solid 3px #577ca2;
	line-height: 1.5;
}
.single-content h5{
	font-weight: 600;
	margin-top: 20px;
}
.single-content p{
	margin-top: 20px;
	text-align: left;
}
.single-content p:first-of-type{
	margin-top: 30px;
}
.single-content table {
	width: 100%;
	text-align: center;
	border-collapse: collapse;
	border-spacing: 0;
	margin-top: 30px;
}
.single-content table th {
	padding: 10px;
	background: #f4f9fc;
	border: solid 2px #577ca2;
}
.single-content table td {
	padding: 10px;
	border: solid 2px #577ca2;
}
.single-content dl{
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	margin-top: 30px;
}
.single-content dt {
	box-sizing: border-box;
	width: 30%;
	padding: 10px 20px;
	margin-bottom: 10px;
	background-color: #f4f9fc;
	border: solid 2px #577ca2;
	border-right: none;
}
.single-content dd {
	box-sizing: border-box;
	width: 70%;
	padding: 15px 20px;
	background-color: #fff;
	margin-bottom: 10px;
	border: solid 2px #577ca2;
}
.single-content ul,
.single-content ol{
	border: dashed 2px #577ca2;/*破線 太さ 色*/
	background: #f4f9fc; /*背景色*/
	padding: 0.5em 0.5em 0.5em 2em;
	margin-top: 30px;
}
.single-content ul li,
.single-content ol li{
	line-height: 1.5;
	padding: 0.5em 0;
}
.single-content strong{
	font-weight: 600;
}
.single-content .btn{
	display: block;
	margin: 100px auto 0;
}
.single-content figure{
	margin: 50px 0;
}
.single-content p strong img{
	float: left;
	margin-right: 15px;
}
.single-content .wp-caption{
	margin-top: 30px;
}
.single-content .wp-caption img{
	max-width: 1000px;
}
.single-content .wp-caption p{
	font-size: 1.4rem;
	font-weight: 600;
	margin-top: 10px;
}
.single-content p a{
	font-weight: 600;
	color: #577ca2;
	transition: 0.3s;
}
.single-content p a:hover{
	opacity: 0.8;
}
.single-content{
	overflow-wrap:break-word;
	word-break:normal;
}
#news{
	overflow-wrap:break-word;
	word-break:normal;
}
.single-content .btnWrapper{
	text-align: center;
	margin-top: 80px;
}
.single-content .btn-01{
	margin-top: 0!important;
}
.single-content .btn-01 a{
	color: black;
}
/* content end */

/* sns start */
.sns__container {
	display: flex;
}
.sns__container a {
	text-decoration: none;
	width: 100%;
	text-align: center;
	color: #fff;
	font-size: 2rem;
	max-width: 180px;
}
.sns__container a:hover {
	opacity: 0.6;
}
.sns__twitter {
	background: #55acee;
}
.sns__facebook {
	background: #3b5998;
}
.sns__pocket {
	background: #ef3f56;
}
.sns__line {
	background: #1dcd00;
}
/* sns end */

/* profile start */
.single-profile .info{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
/* ブログ記事中の占い師プロフィールの文を改行させるように変更 */
.single-profile .info .text {
	white-space: pre-wrap;
}
.single-profile .info figure{
	width: 30%;
	height: 250px;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	overflow: hidden;
	background-color: #f4f9fc;
	border-radius: 20px;
}
.single-profile .info div{
	width: 65%;
}
.single-profile .info .name{
	font-size: 2.2rem;
	font-weight: 600;
}
.single-profile .info .forte{
	margin: 10px 0;
}
.single-profile .info .forte span,
.single-profile .info .text span{
	display: block;
	font-size: 1.8rem;
	font-weight: 600;
	color: #577ca2;
	margin-bottom: 3px;
}
/* profile end */

/* コメント一覧 */
#comments{
	background-color: #f4f9fc;
	padding: 30px 40px;
	border: solid 3px #577ca2;
	margin-top: 100px;
}
.comment-reply-title{
	font-size: 2.5rem;
	font-weight: 600;
	border-bottom: solid 2px #577ca2;
	margin-bottom: 50px;
	position: relative;
	padding-left: 40px;
}
.comment-reply-title::before{
	content: url("../img/common/other/comment.svg");
	display: inline-block;
	width: 32px;
	height: 32px;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
.comment-form{
	background-color: white;
	padding: 30px;
	margin-bottom: 50px;
}
.comment-form p:not(:first-child){
	margin-top: 20px;
}
.comment-form input{
	box-sizing: border-box;
	display: block;
	width: 100%;
	height: 40px;
	border: solid 2px #dedede;
	background-color: #f9f9f9;
	padding: 7px 10px;
	outline: none;
}
.comment-form input.submit{
	width: 20%;
	background-color: #577ca2;
	border: none;
	color: white;
	font-weight: 600;
	margin-top: 30px;
	cursor: pointer;
	transition: 0.3s;
}
.comment-form input.submit:hover{
	opacity: 0.8;
}
.comment-form-comment label span{
	display: none;
}
.comment-form textarea{
	box-sizing: border-box;
	display: block;
	width: 100%;
	height: 200px;
	border: solid 2px #dedede;
	background-color: #f9f9f9;
	padding: 7px 10px;
	outline: none;
}
li.comment{
	border:none;
	padding:0 0 0.5em;
	margin-top: 30px;
}
#comments-list li ul{
	padding-left: 30px;
	margin-top: 20px;
}
#comments-list li ul li ul{
	padding-left: 0;
}
li.comment p{
	padding-left:6px;
	margin-bottom:0.5em;
}
.comments-list .comment{
	border-bottom: solid 2px #577ca2;
}
.comment-content p{
	background-color: white;
	padding: 10px 15px!important;
}
.form-submit input{
	margin: 30px auto 0;
}
.comment-metadata{
	padding: 5px 0;
}
.reply{
	display: inline-block;
	cursor: pointer;
	margin-top: 5px;
}
.reply a{
	font-size: 1.4rem;
	color: white;
	padding: 5px 10px!important;
	line-height: 1;
	background-color: #577ca2;
	font-weight: 600;
}
.required-field-message{
	display: none;
}
.logged-in-as a{
	color: #577ca2;
	font-weight: 600;
	margin-left: 10px;
}
/* コメント一覧 */

/* 最近のコメント start */
.single-archive-comment{
	margin-top: 100px;
}
.single-archive-comment .single-otherTitle{
	margin-bottom: 30px;
}
.newComment .archive-blog-title{
	margin-bottom: 30px;
}
#single-blog .newComment .wrapper{
	width: 1000px;
	margin: 0 auto;
}
.newComment li{
	margin-top: 20px;
	background-color: #f4f9fc;
	padding: 15px 25px;
	border-radius: 15px;
	font-size: 1.4rem;
	font-weight: 600;
}
.newComment li p{
	font-size: 1.6rem;
	font-weight: normal;
	margin-top: 5px;
}
/* 最近のコメント end */

/* 関連記事 start */
.single-other.related{
	margin-top: 100px;
}
/* 関連記事 end */

#single-blog .btnWrapper{
	text-align: center;
	margin: 80px 0;
}





@media screen and (max-width:767px){

	/* common start */
	#single-blog .inner{
		max-width: 1000px;
	}
	#single-blog .blogList .item{
		margin-bottom: 20px;
	}
	.single-other{
		margin-top: 50px;
	}
	.single-other.single-profile{
		margin-top: 0;
		margin-bottom: 40px;
	}
	.single-otherTitle{
		box-sizing: border-box;
		width: 100%;
		margin: 0 auto 20px;
		background-color: #577ca2;
		border-radius: 10px;
		padding: 5px;
	}
	.single-otherTitle div {
		display: flex;
		justify-content: space-between;
		align-items: center;
		border: solid 1px white;
		border-radius: 7px;
		padding: 10px 10px;
	}
	.single-otherTitle div h2 {
		display: inline-block;
		font-size: 1.6rem;
		font-weight: 600;
		color: white;
		border-left: solid 2px white;
		line-height: 1;
		padding-left: 8px;
		letter-spacing: 0;
	}
	.single-otherTitle div a {
		position: relative;
		padding-right: 20px;
		color: white;
		font-weight: 600;
		line-height: 1;
	}
	.single-otherTitle div a::before {
		font-family: "Font Awesome 5 Free";
		content: '\f054';
		font-weight: 600;
		position: absolute;
		top: 50%;
		right: 0;
		transform: translateY(-50%);
		transition: 0.3s;
		color: white;
	}
	/* common end */

	.single-content{
		padding: 50px 0 50px;
	}
	.single-content .inner{
		box-sizing: border-box;
		max-width: 100%;
		padding: 0 20px;
	}
	.single-content .title{
		border-bottom: solid 3px #f4f9fc;
		padding-bottom: 5px;
		margin-bottom: 40px;
	}
	.single-content time{
		color: #577ca2;
	}
	.single-content h1{
		font-size: 2rem;
		font-weight: 600;
		letter-spacing: 0;
		line-height: 1.5;
	}
	.single-content .eyeCatch{
		margin: 0;
	}
	.single-content .eyeCatch img{
		width: 100%;
	}
	.single-content h2{
		font-size: 2rem;
		font-weight: 600;
		padding: 0.3em 0 0.3em 0.8em;/*文字周りの余白*/
		background: #f4f9fc;/*背景色*/
		border-left: solid 5px #577ca2;/*左線（実線 太さ 色）*/
		margin: 45px 0 10px;
	}
	.single-content h3 {
		font-size: 1.8rem;
		font-weight: 600;
		line-height: 1.5;
		letter-spacing: 0;
		border-left: solid 5px #577ca2;
		padding-left: 15px;
		margin: 30px 0 10px;
	}
	.single-content h4{
		display: inline-block;
		font-size: 1.6rem;
		font-weight: 600;
		margin: 20px 0 0;
		border-bottom: solid 3px #577ca2;
		line-height: 1.5;
	}
	.single-content h5{
		font-weight: 600;
		margin-top: 20px;
	}
	.single-content p{
		margin-top: 20px;
		text-align: left;
	}
	.single-content table {
		width: 100%;
		text-align: center;
		border-collapse: collapse;
		border-spacing: 0;
		margin-top: 30px;
	}
	.single-content table th {
		padding: 10px;
		background: #f4f9fc;
		border: solid 2px #577ca2;
	}
	.single-content table td {
		padding: 10px;
		border: solid 2px #577ca2;
	}
	.single-content dl{
		display: flex;
		flex-wrap: wrap;
		width: 100%;
		margin-top: 30px;
	}
	.single-content dt {
		box-sizing: border-box;
		width: 30%;
		padding: 10px 10px;
		margin-bottom: 10px;
		background-color: #f4f9fc;
		border: solid 2px #577ca2;
		border-right: none;
	}
	.single-content dd {
		box-sizing: border-box;
		width: 70%;
		padding: 15px 10px;
		background-color: #fff;
		margin-bottom: 10px;
		border: solid 2px #577ca2;
	}
	.single-content ul,
	.single-content ol{
		border: dashed 2px #577ca2;/*破線 太さ 色*/
		background: #f4f9fc; /*背景色*/
		padding: 0.5em 0.5em 0.5em 2em;
		margin-top: 30px;
	}
	.single-content ul li,
	.single-content ol li{
		line-height: 1.5;
		padding: 0.5em 0;
	}
	.single-content strong{
		font-weight: 600;
	}
	.single-content .btn{
		display: block;
		margin: 50px auto 0;
	}
	.single-content figure{
		margin: 50px 0;
	}
	.single-content p strong img{
		float: left;
		margin-right: 15px;
	}
	.single-content .wp-caption{
		width: 100%!important;
		margin-top: 30px;
	}
	.single-content .wp-caption img{
		max-width: 100%;
	}
	.single-content pre{
		overflow: scroll;
	}
	#news{
		overflow-wrap:break-word;
		word-break:normal;
	}
	.single-content .btnWrapper{
		text-align: center;
		margin-top: 40px;
	}
	.single-content .btn-01{
		margin-top: 0!important;
	}
	.single-content .btn-01 a{
		color: black;
	}

	/* profile start */
	.single-profile .info{
		display: block;
		justify-content: space-between;
		align-items: flex-start;
	}
	.single-profile .info figure{
		width: 100%;
		height: 250px;
		display: flex;
		justify-content: center;
		align-items: center;
		overflow: hidden;
		background-color: #f4f9fc;
		border-radius: 20px;
	}
	.single-profile .info div{
		box-sizing: border-box;
		width: 100%;
		padding: 15px 0 0;
	}
	.single-profile .info .name{
		font-size: 2rem;
		font-weight: 600;
	}
	.single-profile .info .forte{
		margin: 10px 0;
	}
	.single-profile .info .forte span,
	.single-profile .info .text span{
		display: block;
		font-size: 1.6rem;
		font-weight: 600;
		color: #577ca2;
		margin-bottom: 3px;
	}
	/* profile end */

	/* コメント一覧 */
	#comments{
		background-color: #f4f9fc;
		padding: 10px 15px;
		border: solid 3px #577ca2;
		margin-top: 50px;
	}
	.comment-reply-title{
		font-size: 2rem;
		font-weight: 600;
		border-bottom: solid 2px #577ca2;
		margin-bottom: 15px;
		position: relative;
		padding-left: 40px;
		padding-bottom: 10px;
	}
	.comment-reply-title::before{
		content: url("../img/common/other/comment.svg");
		display: inline-block;
		width: 32px;
		height: 32px;
		position: absolute;
		top: 40%;
		left: 0;
		transform: translateY(-50%);
	}
	.comment-form{
		background-color: white;
		padding: 15px 15px 20px;
		margin-bottom: 50px;
	}
	.comment-form p:not(:first-child){
		margin-top: 15px;
	}
	.comment-form input{
		box-sizing: border-box;
		display: block;
		width: 100%;
		height: 30px;
		border: solid 2px #dedede;
		background-color: #f9f9f9;
		padding: 3px 10px;
		outline: none;
	}
	.comment-form input.submit{
		width: 50px;
		background-color: #577ca2;
		border: none;
		color: white;
		font-weight: 600;
		margin-top: 20px;
		cursor: pointer;
		transition: 0.3s;
	}
	.comment-form input.submit:hover{
		opacity: 0.8;
	}
	.comment-form-comment label span{
		display: none;
	}
	.comment-form textarea{
		box-sizing: border-box;
		display: block;
		width: 100%;
		height: 200px;
		border: solid 2px #dedede;
		background-color: #f9f9f9;
		padding: 7px 10px;
		outline: none;
	}
	li.comment{
		border:none;
		padding:0 0 0.5em;
		margin-top: 30px;
	}
	#comments-list li ul{
		padding-left: 15px;
		margin-top: 20px;
	}
	#comments-list li ul li ul{
		padding-left: 0;
	}
	li.comment p{
		padding-left:6px;
		margin-bottom:0.5em;
	}
	.comments-list .comment{
		border-bottom: solid 2px #577ca2;
	}
	.comment-content p{
		background-color: white;
		padding: 10px 15px!important;
	}
	.form-submit input{
		margin: 30px auto 0;
	}
	.comment-metadata{
		padding: 5px 0;
	}
	.reply{
		display: inline-block;
		cursor: pointer;
		margin-top: 5px;
		margin-left: 80%;
	}
	.reply a{
		font-size: 1.4rem;
		color: white;
		padding: 5px 10px!important;
		line-height: 1;
		background-color: #577ca2;
		font-weight: 600;
	}
	.required-field-message{
		display: none;
	}
	.logged-in-as a{
		display: inline-block;
		color: #577ca2;
		font-weight: 600;
		margin-left: 0;
	}
	.comment-author.vcard img{
		width: 50px;
	}
	.comment-meta{
		position: relative;
		margin-bottom: 10px;
	}
	.comment-metadata{
		position: absolute;
		top: 0;
		left: 57px;
	}
	/* コメント一覧 */

	/* 最近のコメント start */
	.single-archive-comment{
		margin-top: 50px;
	}
	.single-archive-comment .single-otherTitle{
		margin-bottom: 20px;
	}
	.newComment .archive-blog-title{
		margin-bottom: 30px;
	}
	#single-blog .newComment .wrapper{
		width: 100%;
		margin: 0 auto;
	}
	.newComment li{
		margin-top: 20px;
		background-color: #f4f9fc;
		padding: 15px 25px;
		border-radius: 15px;
		font-size: 1.4rem;
		font-weight: 600;
	}
	.newComment li p{
		font-size: 1.6rem;
		font-weight: normal;
		margin-top: 5px;
	}
	/* 最近のコメント end */

	/* 関連記事 start */
	.single-other.related{
		margin-top: 50px;
	}
	/* 関連記事 end */

	#single-blog .btnWrapper{
		text-align: center;
		margin: 50px 0;
	}


}
