@charset "utf-8";
/* =============================================
	宅建　コンテンツマーケ用ページの扉ページ
============================================= */
/*---------------------------------------------
page_header
---------------------------------------------*/
#page_header{
	padding: 2em 0 0 0;
	background-color: #fcf0cc;
}
.page_header{
	width: 94%;
	max-width: 1200px;
	margin: 0 auto;
	position: relative;
}
.header_area{
	max-width: 1044px;
	position: relative;
}
.header_area .page_title{}
.header_area .page_sub{
	font-size: clamp(1.4rem,3vw,3.6rem);
	text-align: center;
	color: #f88ac3;
	width: 100%;
	position: absolute;
	top: 45%;
	left: 42%;
	transform: translateX(-50%);
}
.page_header .page_icon{
	max-width: 610px;
}

/*---------------------------------------------
	section
---------------------------------------------*/
.section_wrap{
	width: 100%;
	margin: 0 auto;
}
.normal_section{
 font-size: 1.6rem;
	line-height: 1.6;
	width: 94%;
	max-width: 1000px;
	margin: 6em auto 0 auto;
}

/*****
目次（アンカーリンク）
*****/
.ttl_mokuji{
	font-size: 2rem;
	padding: 0.5em 6em 0.5em 1em;
	border-bottom: solid 4px #e04536;
	position: relative;
}

/***目次開閉***/
.ttl_mokuji .btn_plus{
	font-size: 0.65em;
	padding: 0.5em 1em;
	border: solid 1px #ccc;
	position: absolute;
	top: 50%;
	right: 1em;
	transform: translateY(-50%);
}
.panel_btn .btn_plus::before{
 content: '項目一覧+';
 display: inline;
}
.btn_open .btn_plus::before{
 content: '閉じる×';
}

.panel_btn{
 cursor: pointer;
 }
.show_box{}
.btn_open{}
.panel_open{}


/***目次リスト***/
.index_list{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 1em;
	border: solid 1px #e04536;
}
.index_list li{
	width: 48%;
	padding: 0;
	border-bottom: dashed 1px #858585;
}
.index_list li a{
	display: block;
	color: #333;
	text-indent: -1.75em;
	padding: 1em 1em 1em 2.75em;
}
.index_list li a:hover{
	text-decoration: none;
	background-color: #ddd;
}
.index_list li a b{
	color: #e04536;
}


/*****
項目リンク
*****/
.ttl_content{
	font-size: 2.2rem;
	margin-bottom: 1em;
	padding: 0.5em 1em;
	border-top: 3px solid #e04536;
	background-image: linear-gradient(to bottom, #f0f4f7 0%,#e8edf1 100%);
}



/* ===========================================
	MediaQueries
=========================================== */
/* PC----------------------------- */
@media (min-width: 768px){
	/*---------------------------------------------
		page_header
	---------------------------------------------*/
	.header_area{
		width: 87%;
		margin: 0 0 0 auto;
	}
	.page_header .page_icon{
		width: 51%;
		position: absolute;
		bottom: 2.5%;
		right: 6%;
	}
	
	/*---------------------------------------------
		section
	---------------------------------------------*/
	
}

/* スマホ----------------------------- */
@media screen and (max-width: 767px){
 /*---------------------------------------------
		page_header
	---------------------------------------------*/
	.header_area .page_sub{
		top: 42%;
	}
	.page_header .page_icon{
		width: 50%;
		position: absolute;
		bottom: 3%;
		left: 42%;
		transform: translateX(-50%);
	}
	
	/*---------------------------------------------
		section
	---------------------------------------------*/
	.normal_section{
		font-size: 1.4rem;
		margin: 2em auto 0 auto;
	}
	
 /*****
	目次（アンカーリンク）
	*****/
	.index_list{
		display: block;
	}
	.index_list li{
		width: 100%;
	}
	.index_list li a{
		position: relative;
	}
	.index_list li a::after{
		content: '▼';
		display: block;
		text-indent: 0;
		color: #e04536;
		position: absolute;
		top: 1em;
		right: 0em;
	}
 
	/*****
	項目リンク
	*****/
	.ttl_content{
		font-size: 1.6rem;
	}
	
}