@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/




a {
	text-decoration: none;
}



.affiliate {
	font-size: 80%;
	text-align: center;
	margin-bottom: -4em;
}
@media screen and (min-width: 768px) {
	.affiliate {
		text-align: right;
	}
}
.affiliate::before {
	font-family: 'Font Awesome 5 Free';
	font-weight: bold;
	content: "\f05a";
	display: inline-block;
	padding-left: 7px;
}



.affiliateFirstHeader {
	position: relative;
	text-align: center;
	padding: 1.5em;
	background-image: repeating-linear-gradient(
		-45deg, 							/* ストライプ柄の角度 */
		#FAFAFA 0, #FAFAFA 2px,				/* ストライプの色1 */
		transparent 2px, transparent 4px	/* ストライプの色2 */
  );
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 100%;
}
.affiliateFirstHeader:before,
.affiliateFirstHeader:after {
	position: absolute;
	content: "";
	border-color: var(--color_main);
	width: 2.25em;
	height: 2em;
	display: inline-block;
	box-sizing: border-box;
}
.affiliateFirstHeader:before {
	top: 0;
	left: 0;
	border-top: 1px solid;
	border-left: 1px solid;
}
.affiliateFirstHeader:after {
	right: 0;
	bottom: 0;
	border-right: 1px solid;
	border-bottom: 1px solid;
}
.affiliateFirstHeader-title:before {
	font-family: 'Font Awesome 5 Free';
    font-weight: bold;
    content: "\f05a";
	padding-right: 7px;
}










.buttonAmazon {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #F1F1F1;
	margin-bottom: 4em;
	padding: 1em 2em;
}
.buttonAmazon-image {
	flex-basis: 15%;
}
.buttonAmazon-text {
	flex-basis: 85%;
	padding-left: 20px;
}
.buttonAmazon-title {
	color: #555;
	font-weight: bold;
}
.buttonAmazon-author {
	color: #555;
	font-size: 80%;
}
.buttonAmazon-author:before {
	content: "著者："
}
.buttonAmazon-link {
	color: #F79400;
	background-color: #222E3C;
	border: 1px solid #222E3C;
	display: inline-block;
	padding: 0.3em 0.7em;
	margin-top: 0.5em;
	border-radius: 5px;
	transition: all .3s;
}
.buttonAmazon-link:hover {
/* 	color: #222E3C; */
	background-color: #FFF;
	border: 1px solid #222E3C;
}



/* YouTube動画の中央化 */
.video-container {
	margin: 0 auto;
}
/* YouTube動画の中央化（カテゴリー記事の場合） */
.youtube-center {
	text-align: center;
}




/* リノ */
.sb-id-12 .speech-balloon {
	background-color:	#E3CADB!important;
}
.sb-id-12 .speech-balloon::after {
	border-left-color:	#E3CADB!important;
	border-right-color:	#E3CADB!important;
}
.sb-id-12 .speech-name,
.sb-id-12 div.speech-balloon p {
	color: #4D5269!important;
}

/* シノ */
.sb-id-17 .speech-balloon {
	background-color:	#FFDEC6!important;
}
.sb-id-17 .speech-balloon::after {
	border-left-color:	#FFDEC6!important;
	border-right-color:	#FFDEC6!important;
}
.sb-id-17 .speech-name,
.sb-id-17 div.speech-balloon p {
	color: #924D35!important;
}

/* キノ */
.sb-id-18 .speech-balloon {
	background-color:	#D0F0C7!important;
}
.sb-id-18 .speech-balloon::after {
	border-left-color:	#D0F0C7!important;
	border-right-color:	#D0F0C7!important;
}
.sb-id-18 .speech-name,
.sb-id-18 div.speech-balloon p {
	color: #3B5B33!important;
}

/* 共通 */
.speech-name {
	font-weight: 600;
}
div.speech-balloon p {
	font-weight: 500;
}






blockquote p:not(:last-child) {
	font-size: 90%;
	margin-bottom: 0!important;
}
blockquote cite:before {
	content: "引用：";
}






#sidebar-scroll .toc {
	width: 100%;
}
#sidebar-scroll .toc-content {
	padding: 10px;
}
#sidebar-scroll .toc-list > li {
	font-size: 90%;
}
#sidebar-scroll .toc .toc-list ol {
	margin-top: 0.5rem;
	padding-left: 1em;
}




.boxGray {
	background-color: #F5F5F5;
	padding: 1em;
}
.boxGray-title {
	font-weight: bold;
}
.boxGray-title::before {
	content: '✔ ';
	color: #E6A014;
	font-size: 1.2em;
}
.boxGray ul,
.boxGray ol {
	margin-bottom: 0!important;
}
.boxGray li a {
	color: #6FB6C3;
	font-weight: bold;
	transition: all .3s;
}
.boxGray li a:hover {
	color: #A3EAF7;
}
.boxGray p {
	margin-bottom: 0!important;
	padding-left: 2em;
}






/************************************
 * アコーディオン
 ************************************/

.accordion {
	width: 100%;
	background-color: #ffff96;
	margin-bottom: 1em;
}
.accordion:not([open]) {
	margin-bottom: 7px;
}
.accordion summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	padding: 1em 2em;
	border-radius: 5px;
	background-color: #E6A014;
	color: #FFF;
	font-weight: 600;
	cursor: pointer;
}
.accordion summary::-webkit-details-marker {
	display: none;
}
.accordion summary::before,
.accordion summary::after {
	width: 3px;
	height: .9em;
	border-radius: 5px;
	background-color: #FFF;
	content: '';
}
.accordion summary::before {
	position: absolute;
	right: 2em;
	rotate: 90deg;
}
.accordion summary::after {
	transition: rotate .3s;
}
.accordion[open] summary::after {
	rotate: 90deg;
}
.accordion p {
	transform: translateY(-10px);
	opacity: 0;
	margin: 0;
	padding: 1em 2em;
	color: #4E454A;
	transition: transform .5s, opacity .5s;
}
.accordion p table {
	width: 90%;
}
.accordion[open] p {
	transform: none;
	opacity: 1;
}
.accordion ul,
.accordion ol {
	transform: translateY(-10px);
	opacity: 0;
	margin: 0;
	padding: 1em 2em;
	color: #4E454A;
	transition: transform .5s, opacity .5s;
}
.accordion[open] ul,
.accordion[open] ol {
	transform: none;
	opacity: 1;
}




.link-arrow {
	color: #337AB7;
	transition: .3s;
}
.link-arrow:before {
	content: "関連";
	color: #FFF;
	background-color: #E6A014;
	padding: 5px 7px;
	margin-right: 10px;
}
.link-arrow:hover {
	color: #67AEEB;
}








/************************************
 * アニメーション（ウェーブ）
 ************************************/

.bg-wave {
	position: relative;
	color: white;
	background: #FFF;
	background: transparent;
	margin: 0 calc(50% - 50vw);
}
.bg-wave > p {
	display: none;
}
.bg-wave-reverse {
	transform: scaleY(-1);
}
.bg-wave-flame {
/* 	margin-bottom: 4em; */
}

.waves {
	position: relative;
	width: 100%;
	height: 15vh;
	margin-bottom: -12px; /*Fix for safari gap*/
	min-height: 100px;
	max-height: 150px;
}
@media (max-width: 768px) {
	.waves {
		height: 40px;
		min-height: 40px;
	}
}
/* ウェーブ（アニメーション部分） */
.parallax > use {
	animation: move-forever 25s cubic-bezier(.55, .5, .45, .5) infinite;
}
.parallax > use:nth-child(1) {
	animation-delay: -2s;
	animation-duration: 7s;
}
.parallax > use:nth-child(2) {
	animation-delay: -3s;
	animation-duration: 10s;
}
.parallax > use:nth-child(3) {
	animation-delay: -4s;
	animation-duration: 13s;
}
.parallax > use:nth-child(4) {
	animation-delay: -5s;
	animation-duration: 20s;
}
@keyframes move-forever {
	0%		{ transform: translate3d(-90px, 0, 0); }
	100%	{ transform: translate3d( 85px, 0, 0); }
}
/* ウェーブ（コンテンツ部分） */
.wave-contents {
	margin-left:	calc(50% - 50vw);
	margin-right:	calc(50% - 50vw);
	padding-left:	calc(50vw - 50%);
	padding-right:	calc(50vw - 50%);
	padding-top:	50px;
	padding-bottom:	50px;
	background-color: rgba(240,235,230,1.0);
}













/* 「運営情報記事」の見出し */
.operation-heading {
	font-size: 120%;
	font-weight: bold;
	margin-bottom: 1em!important;
	counter-increment: title;
}
.operation-heading::before {
	content: "第"counter(title)"条";
	padding-right: 1em;
}







/* reCAPTCHA v3を中央表示 */
.grecaptcha-badge {
	margin: auto;
}


.reference {
	font-size: 75%;
	text-align: right;
	margin-top: -4.5em;
	margin-bottom: calc(18px * 4);
}


/************************************
 * 共通要素
 ************************************/

/* カラーコード */
:root {
	--color-main:		#4E454A;
	--color-sub:		#EAE0DA;
	--color-accent:		#EAC7C7;
	--color-background:	#F0EBE6;
	--white:			#FFFFFF;
}

/************************************
 * 目次に戻る（function.phpに記述あり）
 ************************************/

/* 機能部分 */
.toc-checkbox {
	height: 0;
	overflow: hidden;
	display: block;
	visibility: hidden;
}
/* 以下デザイン（アイコンとテキストはphp記載） */
.back-toc {
	margin-bottom: 1rem;
}
.back-toc a {
	color: #C0B4AA;
/* 	transition: all .3s; */
}
.back-toc a:hover {
	opacity: 0.7;
}

/* ページのフェードイン */
.body { animation: fadein 3s forwards;}
@keyframes fadein {
	0% { opacity: 0 }
	100% { opacity: 1 }
}

/* ふわっとした動作（指定箇所に"fadeIn"を入れる） */
.fadeIn {
	animation-name: fadeInAnime;
	animation-duration: 1s;
	animation-fill-mode: forwards;
	opacity:0;
}
@keyframes fadeInAnime {
	from { opacity: 0; }
	to { opacity: 1; }
}

/* スムーズスクロール */
html { scroll-behavior: smooth; }

/* スマホでの改行 */
@media screen and (min-width: 768px){
	.br-sp { display: none; }
}

/* 改行削除 */
.br-delete br { display: none;	}

/* テキストの中央化 */
.common-text-center { text-align: center; }

/* リンクの下線 */
a { text-decoration: none; }

/* 画像の余白削除 */
img { vertical-align: top; }

/* 画像リンクのホバーアクション */
/* .image-hover { transition: .3s; }
.image-hover:hover { opacity: .7; } */
a img { transition: .3s; }
a img:hover { opacity: .7; }





/************************************
 * ボタン
 ************************************/

/* ボタン */
.common-button a {
	color: var(--color-main);
	background-color: var(--white);
	border: 1px solid var(--color-main);
	border-radius: 3px;
	box-shadow: 5px 5px 0 var(--color-accent);
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 50px auto 0;
	max-width: 350px;
	padding: 10px 25px;
	transition: 0.3s ease-in-out;
	text-decoration: none;
}
.common-button a:hover {
	background-color: var(--color-accent);
	border: 1px solid var(--color-accent);
	box-shadow: 0 0 0;
}





/************************************
 * 見出し
 ************************************/

/* リセット */
.article h2,
.article h3,
.article h4,
.article h5,
.article h6{
	background-color: transparent;
	padding: 0;
	border: 0;
	border-radius: 0;
}

/* 大見出し */
.article h2 {
	color: var(--color-main);
	border-bottom: 5px solid var(--color-main);
	padding: 10px 0;
	margin-top: 5rem;
	margin-bottom: 1em;
	font-size: 150%;
}

/* 中見出し */
.article h3 {
	color: var(--color-main);
	position: relative;
	border-bottom: 3px solid var(--color-sub);
	margin-bottom: 1em;
	padding-bottom: 7px;
}
.article h3::after {
	position: absolute;
	content: " ";
	display: block;     
	border-bottom: solid 3px var(--color-main);
	bottom: -3px;
	width: 30%;
}

/* 小見出し */
.article h4 {
	color: var(--color-main);
	border-left: solid 5px var(--color-main);
	margin-bottom: 1em;
	padding: 0.25em 0.5em;
}

/* 見出し（トップページ） */
.headline-flame {
	text-align: center;
	margin-bottom: 1em;
}
.headline-top {
	font-family: 'Hurricane', cursive; /* headに呼び出しコードを挿入 */
	font-size: 300%;
}
.headline-bottom {
	font-size: 100%;
	margin-top: -15px;
}
.headline-color {
	color: var(--white);
	text-shadow: 0 4px 4px #333;
}
#first-hl {
	margin-top: 0;
}
@media screen and (min-width: 768px){
	#first-hl {
		margin-top: 120px;
	}
}





/****************************************************
 * ボックス
 ****************************************************/

/* ボックス（3色） */
.box-blue,
.box-yellow,
.box-red {
	margin: 1em 0 4em;
	padding: 1em;
}
.box-blue { background-color: #DDEEEE; }
.box-yellow { background-color: #FFF7CC; }
.box-red { background-color: #FDF2F2; }
.box-blue-title,
.box-yellow-title,
.box-red-title {
	font-size: 80%;
	font-weight: bold;
}
.box-blue-title{ color: #6FB6C3 }
.box-yellow-title { color: #CBA31A; }
.box-red-title{ color: #F3ACA9; }
.box-blue-title:before,
.box-yellow-title:before,
.box-red-title:before {
	font-family: "Font Awesome 5 Free";
	font-size: 100%;
	margin-right: 0.5rem;
}
.box-blue-title:before { content: "\f304"; }
.box-yellow-title:before { content: "\f05a"; }
.box-red-title:before { content: "\f071"; }
.box-blue p,
.box-yellow p,
.box-red p {
	font-size: 100%;
	margin: 0;
	padding: 0;
}
.box-blue ul,
.box-blue ol,
.box-yellow ul,
.box-yellow ol,
.box-red ul,
.box-red ol {
	margin-bottom: 0;
	font-size: 100%;
}


/* ボックス（かぎかっこ） */
.box-brackets {
	position: relative;
	text-align: center;
	padding: 1.5em;
	background-image: repeating-linear-gradient(
		-45deg, 							/* ストライプ柄の角度 */
		#FAFAFA 0, #FAFAFA 2px,				/* ストライプの色1 */
		transparent 2px, transparent 4px	/* ストライプの色2 */
  );
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 100%;
}
.box-brackets:before,
.box-brackets:after {
	position: absolute;
	content: "";
	border-color: var(--color_main);
	width: 2.25em;
	height: 2em;
	display: inline-block;
	box-sizing: border-box;
}
.box-brackets:before {
	top: 0;
	left: 0;
	border-top: 1px solid;
	border-left: 1px solid;
}
.box-brackets:after {
	right: 0;
	bottom: 0;
	border-right: 1px solid;
	border-bottom: 1px solid;
}


.box-net {
	background:linear-gradient(-45deg, transparent 25%, #F5F5F5 25%, #F5F5F5 50%, transparent 50%, transparent 75%, #F5F5F5 75%, #F5F5F5);
	background-size: 4px 4px;
	border-top: 4px double #DBDBDB;
	border-bottom: 4px double #DBDBDB;
	background-clip: padding-box;
	padding: 0.5em 1em;
}





/****************************************************
 * リスト
 ****************************************************/

/* リスト（通常版） */
.list-normal-flame {
	background:linear-gradient(-45deg, transparent 25%, #F5F5F5 25%, #F5F5F5 50%, transparent 50%, transparent 75%, #F5F5F5 75%, #F5F5F5);
	background-size: 4px 4px;
	border-top: 4px double #DBDBDB;
	border-bottom: 4px double #DBDBDB;
	background-clip: padding-box;
	padding: 0.5em 1em;
}
.list-normal {
	margin-bottom: 0!important;
	padding-left: 0!important;
}
.list-normal-title {
	font-weight: bold;
	text-align: center;
	margin-top: 0.5em;
}
ul.list-normal li,
ol.list-normal li {
	margin: 0!important;
	list-style-position: inside;
}
ul.list-normal li {
	padding: 10px 10px 10px 30px;
	text-indent: -22px;
}
@media screen and (min-width: 768px) {
	ul.list-normal li {
		padding: 10px 10px 10px 40px;
		text-indent: -25px;
	}
}
ol.list-normal li {
	padding: 10px 10px 10px 30px;
	text-indent: -20.3px;
}
@media screen and (min-width: 768px) {
	ol.list-normal li {
		padding: 10px 10px 10px 25px;
		text-indent: -18.2px;
	}
}
ol.list-normal li::marker {
	font-weight: bold;
}
.list-normal li:not(:first-child) {
	border-top: 1px dashed #DBDBDB;
}
.list-normal > ul,
.list-normal > ol {
	font-size: 90%;
	margin-bottom: 0!important;
}
.list-normal > ul li:first-child,
.list-normal > ol li:first-child {
	margin-top: -10px!important;
}
.list-normal a {
	color: #6FB6C3;
	font-weight: bold;
	transition: all .3s;
}
.list-normal a:hover {
	color: #A3EAF7;
}


/* リスト（グレー版） */
.list-gray {
	background-color: #F5F5F5;
	padding: 0.5em 1em;
}
.list-gray li {
	list-style-position: inside;
	margin: 0;
	padding: 10px;
}
.list-gray li:not(:first-child) {
	border-top: 1px dashed #555;
}
.list-gray a {
	color: #6FB6C3;
	font-weight: bold;
	transition: all .3s;
}
.list-gray a:hover {
	color: #A3EAF7;
}


/* リスト（イエロー版） */
.list-conclusion-flame {
	border: 1px solid #E6A014;
}
.list-conclusion-title {
	color: #FFF;
	background-color: #E6A014;
	text-align: center;
	font-size: 110%;
	padding: 10px;
}
.list-conclusion {
	background:linear-gradient(-45deg, transparent 25%, hsla(40, 84%, 49%, 0.1) 25%, hsla(40, 84%, 49%, 0.1) 50%, transparent 50%, transparent 75%, hsla(40, 84%, 49%, 0.1) 75%, hsla(40, 84%, 49%, 0.1));
	background-size: 4px 4px;
	background-clip: padding-box;
	padding: 0.5em 1em!important;
	margin-bottom: 0!important;
}
@media screen and (min-width: 768px) {
	.list-conclusion {
		padding: 0.5em 1em;
	}
}
ul.list-conclusion li,
ol.list-conclusion li {
	margin: 0!important;
	list-style-position: inside;
}
ul.list-conclusion li {
	padding: 10px 10px 10px 30px;
	text-indent: -22px;
}
@media screen and (min-width: 768px) {
	ul.list-conclusion li {
		padding: 10px 10px 10px 40px;
		text-indent: -25px;
	}
}
ol.list-conclusion li {
	padding: 10px 10px 10px 25px;
	text-indent: -18.2px;
}
@media screen and (min-width: 768px) {
	ol.list-conclusion li {
		padding: 10px 10px 10px 30px;
		text-indent: -21px;
	}
}
ol.list-conclusion li::marker {
	font-weight: bold;
}
.list-conclusion li:not(:first-child) {
	border-top: 1px dashed hsla(40, 84%, 49%, 0.3);
}
.list-conclusion a {
	color: #6FB6C3;
	font-weight: bold;
	transition: all .3s;
}
.list-conclusion a:hover {
	color: #A3EAF7;
}






/****************************************************
 * テキストの装飾
 ****************************************************/

/* テキスト（マーカー） */
.marker {
	background-color: transparent;			/* テンプレの削除 */
	background-image: repeating-linear-gradient(
		-45deg, 							/* ストライプ柄の角度 */
		#FCF69F 0, #FCF69F 2px,				/* ストライプの色1 */
		transparent 2px, transparent 4px	/* ストライプの色2 */
	);
	background-repeat: no-repeat;
	background-position: left bottom;
	background-size: 100% 0.5em;
	font-weight: bold;
}

/* テキスト（三原色） */
.textR,
.textG,
.textB {
	font-weight:bold;
}
.textR { color:red; }
.textG { color:green; }
.textB { color:blue; }

/* テキスト（点滅） */
.flash,
.flash-L,
.flash-R {
	animation: flashing 1s ease-in-out infinite alternate;
	color: #E6A014;
	font-weight: bold;
}
.flash-L { margin-left: 3px; }
.flash-R { margin-right: 3px; }
@keyframes flashing {
	0%		{opacity: 0;}
	100%	{opacity: 1;}
}





/************************************
 * テーブル・表・説明リスト
 ************************************/

/* テーブル */
table {
	font-size: 80%;
}
table caption {
	color: var(--color-main);
	font-weight: bold;
}
table caption:before,
table caption:after {
	content: "-";
	padding-left: 5px;
	padding-right: 5px;
}
table th {
	color: var(--color-main);
	background-color: var(--color-sub);
}
table td {
	background-color: #F1F1F1;
	text-align: center;
}
table tr:nth-child(even) td {
	background-color: var(--white);
}
.table-center {
	text-align: center;
}

/* 説明リスト */
.article dl {
	font-size: 14px;
}
.article dt {
	float: left;
}
.article dd {
	margin-left: 9rem;
}
.article dl div:not(:last-child) {
	border-bottom:dashed 1px #333333;
	overflow: hidden;
	padding: 10px 0;
}
.article dl div:last-child {
	padding: 10px 0;
}





/************************************
 * バルーン
 ************************************/

.speech-icon img {
/* 	border: 2px solid var(--color-main); */
	border: none;
}
div.speech-balloon {
/* 	background-color: #F5F5F5; */
	background-color: #F0EBE6;
/* 	border: 2px solid var(--color-main); */
	border: none;
}
.speech-balloon::before {
/* 	border-right: 12px solid var(--color-main); */
	border-right: 12px solid #F0EBE6;
}
.speech-balloon::after {
	left: -9px;
/* 	border-right: 12px solid #F5F5F5; */
	border-right: 12px solid #F0EBE6;
}





/****************************************************
 * タブ
 ****************************************************/

.tab_container {
	padding-bottom: 1em;
	background-color: #FFF;
	border:1px solid #454030;
	margin: 0 auto;
}
.tab_container > p,
.tab_container > br {
	display: none;
}
.tab_item {
	width: calc(100%/4);
	padding: 15px 0;
	border-bottom: 3px solid #454030;
	background-color: #ececec;
	text-align: center;
	color: #454030;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
}
.tab_item:hover {
	opacity: 0.75;
}
input[name="tab_item"] {
	display: none;
}
.tab_content {
	display: none;
	padding: 1em 1em 0;
	clear: both;
	overflow: hidden;
}
#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content,
#tab3:checked ~ #tab3_content,
#tab4:checked ~ #tab4_content {
	display: block;
}
/* チェックされたタブの色を変更*/
#tab1:checked ~ #tabMenu1,
#tab2:checked ~ #tabMenu2,
#tab3:checked ~ #tabMenu3,
#tab4:checked ~ #tabMenu4 {
	color: #FFF;
	background-color: #454030;
}
.tab_container input:checked + .tab_item {
	color: #FFF;
	background-color: #454030;
}





/****************************************************
 * ブログカード
 ****************************************************/

/* ブログカード（自作版） */
.linkCard-flame {
    position: relative;
    background: #F5F5F5;
	border: 1px solid #A59D8D;
	padding: 1em;
	transition: all 0.3s;
}
.linkCard-flame:hover {
	transform: translateY(-3px);
	transition-duration: .5s;
	opacity: .7;
}
.linkCard-flame:after {
	position: absolute;
	top: -1em;
	left: 1em;
	content: "関連記事";
	color: #FFF;
	background-color: #E6A014;
	font-size: 80%;
	padding: 3px 10px;
}
.linkCard-flame a {
	position: absolute;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
}
.linkCard-list {
	display: block;
}
@media screen and (min-width: 768px){
	.linkCard-list {
		display: flex;
		justify-content: center;
		align-items: center;
	}
}
.linkCard-image {
	flex-basis: 20%;
}
.linkCard-image img {
	width: 100%;
}
.linkCard-overview {
	flex-basis: 80%;
	padding-top: 1em;
}
@media screen and (min-width: 768px){
	.linkCard-overview {
		padding-top: 0;
		padding-left: 1em;
	}
}
.linkCard-title {
	font-size: 90%;
	font-weight: bold;
}
.linkCard-text {
	display: flex;
	justify-content: space-between;
	font-size: 80%;
	margin-top: 1em;
}
.linkCard-button {
	color: #FFF;
	background-color: #E6A014;
	padding: 0 10px;
	border-radius: 25px
}
.linkCard-button:before {
	font-family: "Font Awesome 5 Free";
	content: "\f15b";
	margin-right: 5px;
}


/* ブログカード（改造版） */
.blogcard-snippet,
.blogcard-footer {
	display: none;
}
.blogcard-wrap {
	width: 100%;
	background-color: #F5F5F5;
}
.blogcard-wrap:hover {
	transform: translateY(-3px);
	transition-duration: .5s;
	opacity: .7;
}
.blogcard {
	border: 1px solid #A59D8D;
	border-radius: 0;
	padding: 0.5em 0.5em 1em;
}
@media screen and (min-width: 768px) {
	.blogcard {
		padding: 1em;
	}
}
.blogcard:after {
	position: absolute;
	bottom: 1em;
	right: 1em;
	content: "続きを読む";
	color: #FFF;
	background-color: #E6A014;
	font-size: 70%;
	padding: 3px 10px;
	border-radius: 25px;
}
@media screen and (min-width: 768px) {
	.blogcard:after {
		font-size: 80%;
	}
}
.blogcard-content {
	margin-left: 135px;
}
@media screen and (min-width: 768px) {
	.blogcard-content {
		margin-left: 190px;
	}
}
.blogcard-title {
	color: #555;
	font-size: 90%;
	margin-top: 2px;
	margin-bottom: 0;
}
.blogcard-thumbnail img {
    max-width: 105%;
    width: 105%;
}





/****************************************************
 * 目次
 ****************************************************/

/* 目次（各記事） */
.toc { border: none; /* 規定のデザインを削除 */ }
.toc {
	background: #FAFAFA;
	border-top: 3px double var(--color-main);
	border-radius: 3px;
	width: 100%;
}
@media screen and (min-width: 768px){
	.toc {
		width: 80%;
	}
}
.toc-title {
	color: var(--color-main);
	font-size: 1.5em;
}
.toc-title:before {
	font-family: "Font Awesome 5 Free";
	content: "\f15b";
	margin-right: 10px;
}
.toc a {
	color: #454030;
}
.toc a:hover{
	opacity: .7;
	text-decoration: none;
}
/* 目次の設定 */
.toc .toc-list {
	font-size: 100%;
	padding-left: 0;
}
.toc-list > li{
	font-weight: bold;
}
.toc-list > li li{
	font-weight: normal;
}
.toc_list ul {
	list-style: none;
	padding-left: 5px;
}
.toc_list li,
.toc_list li li,
.toc_list li li li {
	padding: 5px 0;
}
ol.toc-list {
	counter-reset: item;
	list-style-type: none;
}
ol.toc-list > li:before {
	counter-increment: item;
	content: counter(item)'';
	display: inline-block;
	width: 1.7em;
	height: 1.7em;
	line-height: 1.7em;
	text-align: center;
	background: var(--color-main); /* 数字を囲む丸の色 */
	color: var(--white); /* 数字の色 */
	border-radius: 50%;
	margin-right: .3em;
}
.toc .toc-list ul,
.toc .toc-list ol {
	padding-left: 2em;
	margin: 0;
	list-style: none;
	margin-left: 1rem; /* 改行時の調整 */
}
.toc ol li ol a::before{
	content: '';
	position: relative;
	top: -2px;
	display: inline-block;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--color-main); /* H3～の見出しの前の丸の色 */
	margin-right: .5em;
	padding-right:0;
	margin-left: -1rem; /* 改行時の調整 */
}


/* 目次（サイドバー） */
.widget_toc{
	overflow-y:scroll;
	max-height: calc(100vh - 150px);
}
.widget_toc::-webkit-scrollbar {
	width: 10px;
}
.widget_toc::-webkit-scrollbar-track {
	background: transparent;
}
.widget_toc::-webkit-scrollbar-thumb {
	background: #CCC;
	border-radius: 10px;
}
/* 目次の設定（サイドバー） */
.nwa .toc {
	font-size: 90%;
	padding: 0;
}
.nwa .toc .toc-content li:nth-child(n+2) {
	padding-top: 0.5em;
}





/****************************************************
 * スライダー・カルーセル
 ****************************************************/

.slider-flame {
	scroll-snap-type: x mandatory;
	white-space: nowrap;
	overflow-x: auto;
	margin: 0 auto;
	padding: 30px 0;
	width: 100%;
	position: relative;
}
.slider-flame p,
.slider-flame > .slider-item > a > br {
	display: none;
}
.slider-info {
	position: sticky;
	top: 0;
	left: 0;
	margin: 0;
/* 	text-align: left; */
	font-weight: bold;
	animation: sideMove 2s infinite;
}
.slider-info:after {
	font-family: "Font Awesome 5 Free";
	content: "\f30b";
    display: inline-block;
    padding-left: 7px;
}
@keyframes sideMove {
	50% { transform:translateX(10px); }
}
.slider-item {
	scroll-snap-align: center;
	display: inline-block;
	margin: 10px 20px 0;
	width: 40%;
	white-space: normal;
	background-color: #f4f4f4;
	box-shadow: 0 0 5px rgba(0,0,0,.3);
/* 	border-radius: 10px; */
	overflow: hidden;
}
@media not all and (min-width: 568px){
	.slider-item {
		width: 90%;
	}
}
.slider-item > a:hover {
	opacity: .7;
	transition: .3s;
}
.slider-item > a > img {
	display: block;
	width: 100%;
	height: auto;
	margin-bottom: 0!important;
}
.slider-title {
	color: #555;
	font-size: 16px;
	font-weight: bold;
	margin-top: 1em;
	text-align: center;
}
.slider-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 3px;
	list-style: none;
	margin-top: 0.8em;
	margin-bottom: 1em!important;
	padding-left: 0!important;
}
.slider-list li {
/* 	flex-grow: 1; */
	font-size: 14px;
	text-align: center;
	width: calc(50% - 3px * 3);
	margin: 0!important;
}
.slider-list li a{
	position: relative;
	display: inline-block;
	color: #555;
	transition: .3s;
}
.slider-list li a::after{
	position: absolute;
	left: 50%;
	bottom: 0;
	content: '';
	width: 0;
	height: 2px;
	background-color: #555;
	transition: all .3s;
	transform: translateX(-50%);
}
.slider-list li a:hover::after{
	width: 100%;
}
/* .slider-text {
	margin: 0;
	padding: 30px;
	font-size: 1em;
}
@media not all and (min-width: 568px){
	.slider-text {
		padding: 20px;
		font-size: 0.875rem;
	}
} */


















/************************************
 * サイドバー
 ************************************/

/* 検索窓のラベル削除 */
.wp-block-search__label {
	display: none;
}
/* 検索窓のボタンカラー */
.wp-element-button {
	color: var(--color-background);
	background-color: var(--color-main);
}
/* サイドバーの見出し */
.sidebar h2 {
	color: var(--white);
	background-color: var(--color-main);
/* 	border-left: 3px solid #454030; */
	border-radius: 0;
}
.sidebar h3 {
	color: var(--color-background);
	background-color: var(--color-main);
}
/* モバイルでは非表示 */
@media screen and (max-width:1023px){
	#sidebar {
		display: none;
	}
}
/* プロフィールボックス */
.profileBox-flame {
	padding-bottom: 1em;
	background-color: #FFF;
	box-shadow: 0 0 1px var(--color-main);
}
.profileBox-bg {
	display: block;
	width: 100%;
	height: 160px;
	-o-object-fit: cover;
	object-fit: cover;
	overflow: hidden;
}
.profileBox-icon {
	background: #fdfdfd;
	width: 120px;
	height: 120px;
	border: 4px solid #fdfdfd;
	border-radius: 50%;
	-o-object-fit: cover;
	object-fit: cover;
}
.profileBox-bg + .profileBox-icon {
	margin: -60px auto 0;
}
.profileBox-name {
	color: #555;
	font-size: 110%;
	font-weight: bold;
	text-align: center;
}
.profileBox-text {
	color: #555;
	font-size: 80%;
	margin-top: 1em;
	padding: 0 1em;
	line-height: 24px;
}
.profileBox-text br {
	display: none;
}
.profileBox-button {
	text-align: center;
	margin-top: 1em;
}
.profileBox-button a {
	color: var(--white);
	background-color: var(--color-main);
	padding: 5px 30px;
	border-radius: 25px;
}
.profileBox-sns {
	display: flex;
	justify-content: center;
	margin-top: 1em;
	padding-left: 0;
	list-style: none;
}
.profileBox-sns li:not(:first-child) {
	margin-left: 1em;
}

















































/************************************
 * ヘッダー（トップページに一部記載）
 ************************************/

/* サイトネーム */
.site-name-text {
	color: var(--color-main);
	transition: .3s;
}
.site-name-text:hover {
	color: var(--color-accent);
	transition: .3s;
}
/* グロナビ */
#navi .navi-in a:hover {
	color: var(--color-accent);
}
#header .site-name-text {
	color: var(--white);
	font-family: 'Hurricane', cursive;
	font-size: 2em;
	text-shadow: 0 4px 4px #333;
}
.header-container {
	background-color: #454030;
}
.hlt-tm-right .navi-in > ul {
	background-color: #454030;
}
.navi .item-label {
	color: var(--white);
	font-family: 'Josefin Sans',sans-serif;
}
.navi-in > ul .menu-item-has-description > a > .caption-wrap {
/* 	flex-direction: column-reverse; */
}
.navi .item-label, .navi .item-description {
	color: #FFF;
}




/************************************
 * ヘッダー（モバイル版）
 ************************************/

/* サイトタイトルの色 */
.mobile-menu-buttons .menu-button > a {
	color: var(--color-main);
}

/* 背景とアイコンの色 */
.mobile-menu-buttons {
	color: var(--color-main);
	background-color: var(--color-background);
}

/* 要素の反対化 */
@media screen and (max-width:1023px){
	.mobile-menu-buttons {
		flex-direction: row-reverse;
	}
}

/* メニューを右から表示 */
.navi-menu-content{
	left: auto;
	right: 0;
	transform: translateX(101%);
	background-color: var(--color-background);
}

/* 閉じるボタン */
.fa-times {
	color: var(--color-main);
	font-size: 0.8em;
}

/* 親要素 */
.menu-drawer > li:not(:first-child) {
	margin-top: 2rem;	
}
.menu-drawer > li > a,
.menu-drawer > li > a:hover {
	color: var(--color-background);
	background-color: var(--color-main);
	padding: 6px 12px;
}

/* 子要素にボーダー */
.menu-item li:not(:last-child) {
	border-bottom: 1px dashed var(--color-main);
}

/* 子要素 */
.menu-item li a {
	color: var(--color-main);
	font-size: 80%;
}
.menu-item li a:hover {
	background-color: transparent;
	margin-left: 5px;
}
.menu-item li a:before {
	font-family: "Font Awesome 5 Free";
	content: "\f101";
	font-size: 50%;
	font-weight: bold;
	margin-right: 10px;
}

/* 子要素の余白 */
.menu-drawer .sub-menu {
	margin-top: 0.5rem;
}

/* アイコンの余白 */
.menu-drawer a .fas,
.menu-drawer a .far,
.menu-drawer a .fa,
.menu-drawer a .fab {
	margin-right: 3px;
}

/* ネームホバー */
.site-name-text:hover {
	opacity: .5;
}

/* 通知エリア */
.notice-area {
	color: var(--white);
	background-color: #E6A014;
	font-size: 0.7em;
	font-weight: bold;
	padding: 0.3em;
}
.notice-area-link {
	transition: all .5s;
}





/************************************
 * フッター（一部トップページ記載）
 ************************************/
.footer {
	color: var(--color-main);
	background-color: #C0B4AA;
}
#footer a {
	color: var(--color-main);
	transition: 0.3s;
}
/* #footer a:before {
	font-family: "Font Awesome 5 Free";
	content: "\f105";
	font-weight: bold;
	margin-right: 10px;
} */
#footer a:hover {
	background-color: transparent;
    opacity: .5;
	transform: translate(3px, 0);
	transition: .3s;
}
#menu-footer-center li:not(:last-child),
#menu-footer-left li:not(:last-child),
#menu-footer-right li:not(:last-child) {
	border-bottom: 1px dashed var(--color-main);
}
.tagcloud a {
	border: 1px solid var(--color-main);
}





/************************************
 * コンタクトフォームの変更
 ************************************/

.contact-foam-text {
	text-align: center;
}
/* ボタン（本物） */
.contact7-button input {
	color: #FFF;
	background-color: #E6A014;
	border: 1px solid #E6A014;
/* 	font-family: "Noto Serif JP" ,sans-serif; */
	font-size: 100%;
	transition: all .3s;
}
.contact7-button input:hover {
	color: #E6A014;
	background-color: #FFF;
}





/************************************
 * その他
 ************************************/

/* 各記事のカテゴリー部分 */
.cat-link {
	color: var(--color-background);
	background-color: var(--color-main);
}

/* 検索窓 */
.search-flame,
.search-flame .search-box {
	margin-bottom: 0;
}
.search-flame .search-edit {
	border: 1px solid #555;
}

/* トップページのタグデザイン */
.tag_lists a {
	color: #555;
	background-color: #FFF;
	padding: 3px 7px;
	font-size: 14px;
	border: 1px solid #555;
	border-radius: 3px;
	text-decoration: none;
	transition: all .3s;
}
.tag_lists a:hover {
	color: #FFF;
	background-color: #555;
}

/* 黄色の網々バックグラウンド */
.bg-net {
	margin: 2em auto;
	padding: 2em;
	background:linear-gradient(-45deg, transparent 25%, #F0EBE6 25%, #F0EBE6 50%, transparent 50%, transparent 75%, #F0EBE6 75%, #F0EBE6);
	background-size: 4px 4px;
	border-bottom: 4px double #F0EBE6;
	border-top: 4px double #F0EBE6;
	background-clip: padding-box;
	margin: 4em calc(50% - 50vw);
    padding-right: calc(50vw - 50%);
    padding-left: calc(50vw - 50%);
}

/* 新着記事のデザイン */
.new-entry-cards {
	display: flex;
	flex-wrap: wrap; /* 折返し指定 */
	margin-top: -4em!important;
	margin-bottom: -3em!important;
	/* 	margin: -4em auto -3em!important; */
	gap: 12px;
}
.widget-entry-cards .a-wrap {
	padding: 0!important;
}
.widget-entry-cards.card-large-image .a-wrap {
	flex-basis: calc(50% - 6px)!important;
	max-width: 100%;
}
@media screen and (min-width: 768px) {
	.widget-entry-cards.card-large-image .a-wrap {
		flex-basis: calc(33.3% - 8px)!important;
		padding:1em;
	}
}
.new-entry-card-link:hover {
	opacity: .7;
	transform: translateY(-5px);
}
.new-entry-card-title {
	font-weight: bold;
	font-size: 10px;
	line-height: 16px;
}
@media screen and (min-width: 768px) {
	.new-entry-card-title {
		font-size: 16px;
		line-height: 22px;
	}
}

/* 何なのか不明 */
.swiper-pointer-events {
    margin-top: -5em;
}

/* HCPのマージン設定 */
.hcb_wrap.hcb_wrap {
	margin-top: 0!important;
	margin-bottom: 4em!important;
}

/* マイクロコピー */
.microcopy {
	text-align: center;
	font-size: 90%;
	margin-bottom: -2.5em!important;
	animation: mcFlash 1s ease-in-out infinite alternate;
}
@keyframes mcFlash {
	0%		{opacity: 0;}
	100%	{opacity: 1;}
}
.microcopy:before {
	content: "＼";
	margin-right: 5px;
}
.microcopy:after {
	content: "／";
	margin-left: 5px;
}

/* マイクロコピー(下部) */
.microcopy-bottom {
	font-size: 90%;
	text-align: center;
	margin-top: -3.5em;
}
.microcopy-bottom:before {
	content: "公式：";
}
.microcopy-bottom a {
	color: #1967D2;
	transition: all .3s;
}
.microcopy-bottom a:hover {
	color: #67B5FF;
}



/************************************
 * 【トップページ】ヒーローエリア
 ************************************/

/* サイズ設定 */
.appeal {
	background-image: url(https://gluttonir.com/wp-content/uploads/top_thumbnail.webp);
	background-attachment: fixed;
	min-height: 600px;
/* 	min-height: calc(100vh - 84px); */
	min-width: 100%;
	background-size: cover;
	position: relative;
}
@media screen and (min-width: 768px){
	.appeal {
/* 		min-height: 800px; */
/* 		min-height: calc(100vh - 90px); */
		min-height: 100vh;
	}
}
/* ローライト設定 */
.appeal::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: rgba(69, 69, 69, .5);
}
.appeal-in {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}
.appeal-content {
	background-color: transparent;
	width: 100%;
	padding: 0 1em;
}
.appeal-title {
	color: var(--white);
	font-family: 'Hurricane', cursive;
	font-size: 5em;
	text-shadow: 0 4px 4px #333;
}
@media screen and (min-width: 768px){
	.appeal-title {
		font-size: 10em;
	}
}
.appeal-message p {
	color: var(--white);
	font-size: 1em;
	margin-top: -1em;
}
@media screen and (min-width: 768px){
	.appeal-message p {
		font-size: 1.2em;
		margin-top: -4em;
	}
}
/* ボタン */
.appeal-button {
	color: var(--white);
	background-color: transparent!important;
	margin-top: 3em;
	transition: .5s;
}
.appeal-button:hover {
	color: #CBCBCB;
	transition: .5s;
}
.appeal-button:before {
	font-family: "Font Awesome 5 Free";
	content: "\f103";
	display: block;
	animation: updown 1s infinite alternate ease-in-out;
}
@keyframes updown {
	from {
		transform: translateY(0);
	}
	to {
		transform: translateY(10px);
	}
}
/* 検索窓 */
.search-submit {
	color: #4A454A;
	top: calc(50% - 50px);
	transition: .5s;
}
.search-submit:hover {
	opacity: .7;
	transition: .5s;
}





/****************************************************
 * 【トップ】メニューエリア（SNSボタン）
 ****************************************************/

.sns-flame {
	width: 100%;
	padding: 1em;
}
.sns-flame a {
	width: 100%;
	height: 100%;
	font-size: 13px;
	font-weight: normal;
	text-decoration: none;
	text-align: center;
	color: #FFF;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
.sns-flame-top a {
	margin-bottom: 20px;
}
.sns-flame ul {
	display: -webkit-flex;
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
}
.sns-flame li {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	margin: 0!important;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;
	-webkit-align-items: center;
	align-items: center;
}
.sns-flame li:hover {
	width: 200%;
}
.sns-item1 { background-color: #454030; }
.sns-item2 { background-color: #6FB6C3; }
.sns-item3 { background-color: #E6A014; }
.sns-flame i {
	font-size: 200%;
	margin-bottom: 5px;
}
.sns-overview {
	color: #FFF;
	padding: 2em 0;
}
.sns-flame p{
	display: none;
}





/************************************
 * 【トップ】ポピュラーエリア
 ************************************/

.popular-flame {
	display: flex;
	justify-content: space-evenly;
/* 	gap: 1em; */
}
@media screen and (min-width: 768px){
	.popular-flame {
/* 		gap: 3em; */
	}
}
.popular-contents {
	flex-basis: 45%;
}
@media screen and (min-width: 768px){
	.popular-contents {
		flex-basis: 35%;
	}
}
.popular-contents a {
    color: #555;
	transition: all .3s
}
.popular-contents a:hover {
    opacity: .7;
}
.popular-image {
	position: relative;
}
@media screen and (min-width: 768px){
	.popular-image::before,
	.popular-image::after {
		content: "";
		position: absolute;
		transform: rotate(-35deg);
		width: 70px;
		height: 25px;
		background-color: #F0EBE6;
		z-index: 1;
	}
	.popular-image::before {
		top: -10px;
		left: -25px;
		border-bottom: 1px solid #aaa;
	}
	.popular-image::after {
		bottom: -10px;
		right: -25px;
		border-top: 1px solid #aaa;
	}
}
.popular-image img {
	width: 100%;
}
.popular-title {
	font-size: 80%;
	font-weight: bold;
	margin-top: 1em;
}
@media screen and (min-width: 768px){
	.popular-title {
		font-size: 100%;
	}
}
.popular-overview {
	font-size: 70%;
	margin-top: 1em;
}
@media screen and (min-width: 768px){
	.popular-overview {
		font-size: 90%;
	}
}





/************************************
 * 【トップ】プロフィールエリア
 ************************************/

.profile-flame {
}
.profile-list {
	display: block;
}
@media screen and (min-width: 768px){
	.profile-list {
		display: flex;
		align-items: center;
	}
}
.profile-image {
	width: 70%;
	margin: auto;
}
@media screen and (min-width: 768px){
	.profile-image {
		flex-basis: 20%;
		max-width: 100%;
	}
}
.profile-text {
	padding-top: 1em;
}
@media screen and (min-width: 768px){
	.profile-text {
		flex-basis: 80%;
		padding-top: 0;
		padding-left: 3em;
	}
}
.profile-name {
	font-size: 120%;
	font-weight: bold;
	text-align: center;
}
@media screen and (min-width: 768px){
	.profile-name {
		text-align: left;
	}
}
.profile-name-small {
	font-size: 70%;
	font-weight: normal;
	margin-right: 5px;
}

@media screen and (max-width: 768px){
	.profile-overview br {
		display: none;
	}
}































/************************************
 * 【トップページ】ニュースエリア
 ************************************/

.card-arrow .a-wrap {
	color: var(--color-main);
	box-shadow: 0 0 5px #D3D3D3;
}
.card-arrow .card-content {
    padding-top: 1rem;
}
.card-arrow .a-wrap img {
	vertical-align:top;
	max-width: 150%!important;
}
.card-thumb img {
    width: 100%;
}
@media screen and (min-width: 768px){
	.card-thumb img {
		width: 150%;
	}
}
.widget-entry-cards .a-wrap {
	padding: 0 0 2px 2px;
	margin-bottom: 10px;
}
.widget-entry-card-content {
	margin-left: 130px;
}
@media screen and (min-width: 768px){
	.widget-entry-card-content {
	    margin-left: 200px;
	}
}
.widget-entry-card-snippet {
	display: none;
}
@media screen and (min-width: 768px){
	.widget-entry-card-snippet {
		display: block;
	}
}
.card-title-bold .card-title {
	font-size: 70%;
	padding-right: 1rem;
}
@media screen and (min-width: 768px){
	.card-title-bold .card-title {
		font-size: 120%;
		padding-right: 0;
	}
}










/************************************
 * 【トップページ】コンテンツエリア
 ************************************/

.features-flame {
	padding-bottom: 30px;
}
.features-list {
	display: flex;
	justify-content: space-between;
	height: auto;
	flex-wrap: wrap;
	margin-top: 50px;
}
.features-flame p {
	display: none;
}
.features-item {
	width: calc(50% - 0.5rem);
	height: auto;
	position: relative;
	box-shadow: 0px 3px 3px 0px #D3D3D3;
	transition: 0.5s;
	background-color: var(--white);
}
@media screen and (min-width: 768px){
	.features-item {
		width: calc(25% - 1rem);
	}
}
@media screen and (min-width: 768px){
	.features-item:nth-child(n+3) {
		margin-left: 1rem;
	}
}
.features-item:nth-child(n+5) {
	margin-top: 1rem;
}
@media screen and (min-width: 768px){
	.features-item:nth-child(n+5) {
		margin-top: 0;
	}
}
.features-item a {
	position: absolute;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
}
.features-item:hover {
	opacity: 0.5;
	transition: 0.5s;
}
.features-title {
	color: var(--color-main);
	font-size: 90%;
	font-weight: bold;
	padding-left: 0.5rem;
	padding-right: 0.5rem;
}
.features-overview {
	color: var(--color-main);
	font-size: 70%;
	padding-left: 0.5rem;
	padding-right: 0.5rem;
	padding-bottom: 0.5rem;
}
@media screen and (min-width: 768px){
	.features-overview {
		font-size: 80%;
	}
}
.features-overview br {
	display: none;
}









































/************************************
 * 【トップページ】アバウトエリア
 ************************************/

.about-flmae {
	margin-top: 120px!important;
	padding-top: 30px!important;
	padding-bottom: 10px!important;
}
@media screen and (min-width: 768px){
	.about-flmae {
		margin-top: 120px!important;
		padding-top: 120px!important;
 		padding-bottom: 120px!important;
	}
}
.about-flmae table {
	margin-top: 50px;
}
.about-flmae table th {
	color: var(--color-main);
	background-color: var(--color-sub);
}
.about-flmae table td {
	background-color: #EEE;
}
.about-flmae table tr:nth-child(odd) td {
	background-color: var(--white);
}





/************************************
 * 【トップページ】コンタクトエリア
 ************************************/

.contact-flame {
	position: relative;
	background: url(https://sample-collection.com/sample000/wp-content/uploads/contact-image.webp) center / cover;
	text-align: center;
	margin: 0 calc(50% - 50vw) -95px;
}
.contact-bg {
	min-height:100%;
	min-width:100%;
	background-color:rgba(69, 69, 69, .5);/*背景色、白を透過させる*/
	padding: 50px 10px;
}
@media screen and (min-width: 768px){
	.contact-bg {
		padding: 120px;
	}
}
.contact-title {
	color: var(--white);
	font-size: 150%;
}
.contact-overview {
	color: var(--white);
	margin-top: 50px;
	font-size: 80%;
}
@media screen and (min-width: 768px){
	.contact-overview {
		font-size: 100%;
	}
}





/************************************
 * 【トップページ】SVG設定
 ************************************/

.bg-change {
	background-color: var(--color-background);
	margin: -4.5em calc(50% - 50vw) 0;
	padding-right: calc(50vw - 50%);
	padding-left: calc(50vw - 50%);
	padding-top: 3rem;
}
@media screen and (min-width: 768px){
	.bg-change {
		padding-top: 0;
	}
}
.svg-top {
	margin-top: 0;
	margin-bottom: -10px;
}
.svg-bottom {
	transform: scale(-1,-1);
	margin-top: -10px;
	margin-bottom: 0;
}
@media screen and (min-width: 768px){
	.svg-top {
		margin-top: -5rem;
		margin-bottom: -10px;
	}
	.svg-bottom {
		margin-top: -10px;
		margin-bottom: -10rem;
	}
}





/************************************
 * 【レビューページ】表示設定
 ************************************/

.questionnaire-flame {
	display: block;
}
@media screen and (min-width: 768px){
	.questionnaire-flame {
		display: flex;
	}
}
.questionnaire-image {
	flex-basis: 30%;
	margin-right: 0;
}
@media screen and (min-width: 768px){
	.questionnaire-image {
		margin-right: 1rem;
	}
}
.questionnaire-image img {
	border: 1px solid var(--color-main);
}
.questionnaire-faq {
	flex-basis: 70%;
}
.questionnaire-flame .questionnaire-faq dl {
}
.questionnaire-flame .questionnaire-faq dt {
	width: 100%;
	font-weight: bold;
}
.questionnaire-flame .questionnaire-faq dt:before {
	content: "Q:";
	margin-right: 5px;
}
.questionnaire-flame .questionnaire-faq dd {
	margin-top: 1rem;
	margin-left: 2.5rem;
}
















/************************************
 * 【投稿ページ】SNSボタン
 ************************************/

.sns-buttons a {
	color: #555;
	background-color: transparent;
}
.sns-buttons a:hover {
	color: #898989;
}
.sns-share.ss-high-and-low-lc a .button-caption.button-caption {
	display: none;
}
/*トップシェアボタンのコピーボタン*/
.sns-share.ss-top .sns-buttons a.copy-button {
	color: #555;
	width: 100%;
	border-radius: 20px;
	order: 1; /*順番*/
}
/*トップシェアボタンのコピーボタン 疑似要素*/
.sns-share.ss-top .sns-buttons a.copy-button .icon-copy::after {
	content: "この記事のタイトルとURLをコピーする";
	margin-left: .4em;
	vertical-align: top;
	font-family: sans-serif;
	font-size: .8em;
}
/*トップシェアボタンのコピーボタン キャプション*/
.sns-share.ss-top .sns-buttons a.copy-button .button-caption {
	display: none;
}
/*トップシェアボタンのカラム数 2列～6列*/
.sns-share.ss-top.ss-col-6 a { width: 19%; } /*6列*/
.sns-share.ss-top.ss-col-5 a { width: 24%; } /*5列*/
.sns-share.ss-top.ss-col-4 a { width: 32%; } /*4列*/
.sns-share.ss-top.ss-col-3 a { width: 49%; } /*3列*/
.sns-share.ss-top.ss-col-2 a { width: 100%; } /*2列*/





/************************************
 * 【投稿ページ】ページ下部の項目名
 ************************************/

.sns-share-message,
.sns-follow-message,
.related-entry-heading,
.comment-title {
	font-family: 'Hurricane', cursive;
	font-size: 24px;
	font-weight: bold;
	text-align: center;
}