@charset "utf-8";
body{counter-reset: number 0;}
.kind_li{
	width: calc(100% - 480px);
	margin-top: 90px;
	justify-content: flex-end;
}
.column_detail{
	max-width: 1000px;
	width: 100%;
	margin: 0 auto;
}

/* もくじ */
#toc{
	border: 1px solid #1A1A1A!important;
	border-radius: 20px;
	background: #F4F4F4!important;
	padding: 45px 35px!important;
	max-width: 800px;
	width: 100%!important;
	margin: 0 auto 50px!important;
}
#toc::before{
	margin-bottom: 30px!important;
	display: block;
	font-size: 26px!important;
	font-family: 'Montserrat-Bold';
	content: "CONTENTS"!important;
	text-shadow:1px 1px 0 #1A1A1A, -1px -1px 0 #1A1A1A,-1px 1px 0 #1A1A1A, 1px -1px 0 #1A1A1A,
		0px 1px 0 #1A1A1A,  0 -1px 0 #1A1A1A,-1px 0 0 #1A1A1A, 1px 0 0 #1A1A1A;
	color: #FFE578!important;
}
#toc ul{
	border: none!important;
	padding: 0!important;
}
#toc > ul{margin: 0!important;}
#toc > ul > li{
	background: none!important;
	counter-increment: mycounter;
	position: relative;
	padding-left: 3em;
}
#toc > ul > li::before{
	counter-increment: number 1;
	content: counter(mycounter, decimal-leading-zero);
    margin-right: 5px;
	background: #24B0D1;
	border: 1px solid #1A1A1A;
	color: #fff;
	font-family: 'Montserrat-Regular';
	width: 39px;
	border-radius: 50%;
	padding: 9px 0;
	text-align: center;
	position: absolute;
	left: 0;
	top: -.5em;
}
#toc > ul > li:not(:last-child){margin: 0 0 35px;}
#toc > ul > li:last-child{margin: 0!important;}
#toc > ul > li > a{
	font-size: 20px;
	font-weight: bold;
}
#toc > ul > li > ul{margin: 15px 0 0 0!important;}
#toc > ul > li > ul > li:not(:last-child){margin-bottom: 15px;}
#toc > ul > li > ul *{color: #666;}
#toc > ul > li > ul > li > a{font-size: 18px;}
#toc > ul > li > ul > li > ul{margin: 10px 0 0 15px;}
#toc a{text-decoration: none!important;}
.column_detail h3{
	background: #EBF9FF;
	border: 1px solid #1A1A1A;
	border-radius: 15px;
	padding: 25px;
	font-size: 24px;
	font-weight: bold;
	margin: 80px 0 50px;
}
.column_detail h4{
	font-size: 22px;
	font-weight: bold;
	padding-left: 2em;
	position: relative;
	margin: 50px 0 40px;
}
.column_detail h4::before{
	content: "";
	position: absolute;
	width: 1.4em;
	aspect-ratio: 1/1;
	background: url("../images/plus_icon.webp") center / contain no-repeat;
	left: 0;
	top: 0;
}
.column_detail h5{
	font-size: 20px;
	font-weight: bold;
	margin: 50px 0 35px;
}
.column_detail p{
	font-size: 18px;
	line-height: 1.8;
	margin-bottom: 15px;
}
.column_detail strong{font-weight: bold;}
.column_detail ul,.column_detail ol{
	max-width: 800px;
	width: 100%;
	margin: 50px auto 45px;
	border-top: 1px dashed #1A1A1A;
	border-bottom: 1px dashed #1A1A1A;
	padding: 40px 0;
}
.column_detail li:not(:last-child){margin-bottom: 15px;}
.column_detail li,.column_detail li *{font-size: 18px;}
.column_detail ul li{
	position: relative;
	padding-left: 1.2em;
}
.column_detail ul li::before{
	content: "";
	width: .6em;
	aspect-ratio: 1/1;
	border: 1px solid #1A1A1A;
	background: #CCC;
	position: absolute;
	left: 0;
	top: .4em;
	border-radius: 50%;
}
.column_detail ol li{margin-left: 1em;}
.column_detail a{
	text-decoration: underline;
	transition: .2s;
}
.column_detail a:hover{opacity: .5;}

/* 1025px以下から
------------------------------------------------------------*/
@media only screen and (max-width:1025px){
	
	.kind_li{
		width: calc(100% - 340px);
		margin-top: 65px;
	}
	
	.kind_li{
		width: calc(100% - 480px);
		margin-top: 90px;
		justify-content: flex-end;
	}
	.column_detail{
		max-width: 1000px;
		width: 100%;
		margin: 0 auto;
	}

	/* もくじ */
	#toc{
		border-radius: 15px;
		padding: 30px 25px!important;
		max-width: 650px;
		margin-bottom: 30px!important;
	}
	#toc::before{
		margin-bottom: 20px!important;
		font-size: 20px!important;
		text-shadow:.7px .7px 0 #1A1A1A, -.7px -.7px 0 #1A1A1A,-.7px .7px 0 #1A1A1A, .7px -.7px 0 #1A1A1A,
			0px .7px 0 #1A1A1A,  0 -.7px 0 #1A1A1A,-.7px 0 0 #1A1A1A, .7px 0 0 #1A1A1A;
	}
	#toc > ul > li::before{
		width: 29px;
		padding: 4px 0;
		font-size: 14px;
	}
	#toc > ul > li:not(:last-child){margin: 0 0 25px;}
	#toc > ul > li > a{font-size: 16px;}
	#toc > ul > li > ul{margin-top: 10px!important;}
	#toc > ul > li > ul > li:not(:last-child){margin-bottom: 10px;}
	#toc > ul > li > ul > li > a{font-size: 14px;}
	#toc > ul > li > ul > li > ul{margin: 7px 0 0 10px;}
	.column_detail h3{
		border-radius: 10px;
		padding: 15px;
		font-size: 20px;
		margin: 50px 0 30px;
	}
	.column_detail h4{
		font-size: 18px;
		margin: 30px 0 20px;
	}
	.column_detail h5{
		font-size: 16px;
		margin: 30px 0 20px;
	}
	.column_detail p{
		font-size: 14px;
		margin-bottom: 10px;
	}
	.column_detail ul,.column_detail ol{
		max-width: 650px;
		margin: 30px auto 25px;
		padding: 25px 0;
	}
	.column_detail li:not(:last-child){margin-bottom: 10px;}
	.column_detail li,.column_detail li *{font-size: 14px;}
}

/* 750px以下から
------------------------------------------------------------*/
@media only screen and (max-width:750px){
	
	.column_title .title{margin-bottom: 25px;}
	.kind_li{
		width: 100%;
		margin-top: 0;
		justify-content: flex-start;
	}
	.column_li li{width: 49%;}
	.column_li li:nth-child(3n+1){margin-left: 1%!important;}
	.column_li li:nth-child(2n+1){margin-left: 0!important;}
	.column_li li:nth-child(3n){margin-right: 1%!important;}
	.column_li li:nth-child(2n){margin-right: 0!important;}
}

/* 500px以下から
------------------------------------------------------------*/
@media only screen and (max-width:500px){
	
	.column_li li{
		width: 100%;
		margin: 0!important;
	}
	.column_li li:not(:last-child){margin-bottom: 20px!important;}
}