@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
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
body {
	font-family: 'Inter', sans-serif;
	background:#fff;
}
.fz-18px{
	font-size:16px;
}
.logo-text .site-name-text-link{
	font-weight:bold;
}
.logo-text .site-name-text-link .site-name-text {
    font-size: 21px;
}
.content-in{
	width: 100%;
	max-width: 62.9rem;
}
.no-scrollable-main .main{
	width: 67.2%;
	padding:0;
	border:none;
	border-radius:0;
}
.sidebar {
	max-width: 376px;
	width: 29.8%;
	padding:0;
}
.sidebar .side-title{
	font-size: 24px;
    text-align: center;
    margin: 7em 0 1em;
	display: block;
}
.marker{
	background-color:#FFF200;
}

/*--- 目次 ---*/
.toc{
	border:none;
	border-top:3px solid #D9D9D9;
	border-bottom:3px solid #D9D9D9;
	background:#f5f5f5;
}
.toc-title{
	position:relative;
}
.toc-title::after{
	content: '';
	display: block;
	border-right: 1px solid #222;
	border-bottom: 1px solid #222;
	width: 10px;
	height: 10px;
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%) rotate(45deg);
	margin-left: 0;
	transition:transform 0.5s;
}
.toc-checkbox:checked+.toc-title::after{
	content: '';
	transform: translateY(-50%) rotate(225deg);
}

/*--- 見出し ---*/
.article h1{
	border-left:6px solid #686868;
	background:#D9D9D9;
	padding:1.5em 1em;
}
.article h1.entry-title{
	border-left:none;
	background:none;
	padding:0;
	font-size:38px;
}
.article h2{
	border-top:8px solid #d9d9d9;
	border-bottom:8px solid #d9d9d9;
	background:none;
	padding:1.5em 0;
	line-height: 1.7;
}
.article h3{
	font-size:25px;686868
	font-weight:bold;
	border: none;
	padding:0;
}
.article h4{
	font-size:20px;
	font-weight:bold;
	border:none;
	border-left:6px solid #D9D9D9;
	margin-bottom: 1.7em;
}
.article h5{
	border:none;
	background:none;
}
.article h5:before{
	content: "";
	width: 30px;
	height: 32px;
	display: inline-block;
	background: url(../../uploads/2025/07/point-icon.svg) no-repeat center;
	transform: translateY(5px);
}

/*--- 日付 ---*/
.date-tags {
	margin-bottom: 4em;
	margin-top: 4em;
}

/*--- 箇条書き ---*/
.article ul {
	list-style-type: none;
	padding-left: 0;
}
.article ul li{
	padding-left: 1.5rem;
	position: relative;
	margin-bottom: 1em;
}
.article ul li:before{
	content: "";
	position: absolute;
	top: 0.7em;
	left: 0;
	display: block;
	width: 0.7em;
	height: 1px;
	border-bottom: 1px solid #515151;
}

/*--- 表 ---*/
table tr:nth-of-type(2n+1){
	background:#fff;
}
/*--- 段落 ---*/
p.dot{
	/* 	text-indent: -0.9em; */
	padding-left: 1.5em;
	position:relative;
}
p.dot:before{
	content:"●";
	color:#D9D9D9;
	font-size: 90%;
	position:absolute;
	top: 0.1em;
	left: 0.5em;
}
.hsfc-RichText p{
	font-size:16px;
}
/*--- お問い合わせボタン ---*/
.custom-contact-button{
	text-align:center;
	margin-bottom:5em;
}
.custom-contact-button b{
	font-size:16px;
	color: var(--cocoon-red-color);
	position:relative;
	display:inline-block;
}
.custom-contact-button b:before,
.custom-contact-button b:after{
	content:"";
	display:block;
	position:absolute;
	top:0.5em;
	width:1px;
	height:1em;
	border-left:1px solid var(--cocoon-red-color);
}
.custom-contact-button b:before{
	left:-1em;
	transform:rotate(-45deg);
}
.custom-contact-button b:after{
	right:-1em;
	transform:rotate(45deg);
}
.custom-contact-button a{
	display:inline-block;
	margin-top:1em;
	width:100%;
	max-width:364px;
	background:#FF8000;
	color:#fff;
	text-decoration:none;
	padding: 1em;
	border-radius: 0.8em;
	font-size:24px;
	font-weight: bold;
}
.custom-contact-button a span{
	position:relative;
}
.custom-contact-button a span:after{
	content:"";
	display:block;
	position:absolute;
	top:50%;
	right: -0.8em;
	width:10px;
	height:10px;
	border-top:3px solid #fff;
	border-right:3px solid #fff;
	transform:translateY(-50%) rotate(45deg);
	margin-top:-2px;
	transition:right 0.5s ease-in-out;
}
.custom-contact-button a:hover span:after{
	right: -1.4em;
}

/*--- お問い合わせフォーム ---*/
.wpcf7-form{
	background: #F9F9F9;
	padding: 1em;
}
.wpcf7-form p{
	margin-bottom:2em;
}
.wpcf7-form b{
	font-size:16px;
	font-weight:bold;
}
.wpcf7-form b .must{
	font-size: 13px;
	color: #fff;
	background: #FF0000;
	line-height: 1em;
	padding: 3px 5px;
	transform: translateY(-2px);
	display: inline-block;
	margin-left: 8px;
}

/*--- ラジオボタン ---*/
.wpcf7-list-item{
	display:block;
}

/*--- 送信ボタン ---*/
input[type=submit].wpcf7-submit{
	display:inline-block;
	width:100%;
	max-width:364px;
	background:#FF8000;
	color:#fff;
	border-radius: 0.6em;
	font-size:24px;
	font-weight: bold;
	position:relative;
}
input[type=submit].wpcf7-submit:after{
	content:"";
	display:block;
	position:absolute;
	top:50%;
	right: 1em;
	width:10px;
	height:10px;
	border-top:3px solid #fff;
	border-right:3px solid #fff;
	transform:translateY(-50%) rotate(45deg);
	margin-top:-2px;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (min-width: 481px){
	/*必要ならばここにコードを書く*/
	.sp{
		display:none;
	}
	.tagline{
		margin: 0;
	}
	.header-in{
		width: 100%;
	}
	.logo-text {
		padding: 8px 0 8px;
		text-align: left;
	}
	.site-name-text-link{
		padding: 0 0 0 50px;
	}
	.header-container-in{
		position:relative;
	}
	.navi{
		position: absolute;
		right: 50px;
		top: 0px;
	}
	.navi .wrap{
		width:auto;
	}
	.navi-in > ul {
		justify-content: right;
		text-align: right;
	}
	.navi-in > ul li{
		width: auto;
		margin: 0 0.5em;
	}
	.navi-in > ul li a{
		padding: 0 1em;
	}
}

/*834px以下*/
@media screen and (max-width: 834px){
	/*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
	/*必要ならばここにコードを書く*/
	.pc{
		display:none;
	}
	.no-scrollable-main .main{
		width: 100%;
		padding:15px;
	}
	.date-tags {
		margin-bottom: 2em;
		margin-top: 2em;
	}
	/*--- 見出し ---*/
	.article h1{
		font-size:22px;
		padding: 1em;
	}
	.article h1.entry-title{
		font-size:20px;
	}
	.article h2{
		border-top: 6px solid #d9d9d9;
		border-bottom: 6px solid #d9d9d9;
		padding: 1em 0;
		margin-bottom: 1em;
		margin-top: 2em;
	}
	.article h3{
		font-size:20px;
	}
	.article h4{
		font-size:20px;
		font-weight:bold;
		border:none;
		border-left:6px solid #D9D9D9;
	}
	.article h5{
		border:none;
		background:none;
	}
	.article h5:before{
		content: "";
		width: 30px;
		height: 32px;
		display: inline-block;
		background: url(../../uploads/2025/07/point-icon.svg) no-repeat center;
		transform: translateY(5px);
	}
	/*--- 箇条書き ---*/
	.article ul{
		list-style-type: none;
		padding-left: 0;
	}
	/*--- お問い合わせボタン ---*/
	.custom-contact-button b {
		margin: 0 2em;
	}
	.custom-contact-button b:before,
	.custom-contact-button b:after{
		height: 6em;
	}
	.custom-contact-button b:before{
		left: -2em;
		transform: rotate(-22deg);
	}
	.custom-contact-button b:after{
		right: -2em;
		transform: rotate(22deg);
	}
	.custom-contact-button a{
		font-size:16px;
	}
	.custom-contact-button a span:after{
		width: 8px;
		height: 8px;
		margin-top: 0px;
	}
}