@charset "utf-8";

/*===============================================
●共通
===============================================*/

/* #memberBox02
---------------------------------------- */
#memberBox02 #categoryLink {
	border:#4cae45 2px solid;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
}
#memberBox02 #categoryLink li {	background:url(../../images/mainframe/arrow_green.png) no-repeat 0.5em center / 20px 20px;}
#memberBox02 #categoryLink li a {
	display:block;
	width:100%;
	text-decoration:none;
	padding:0.5em 0.5em 0.5em 2.5em;
	box-sizing:border-box;
}
#memberBox02 #categoryLink li:hover,
#memberBox02 #categoryLink li.current {
	font-weight:bold;
	background: url(../../images/mainframe/arrow_white.png) no-repeat 0.5em center / 20px 20px #4cae45;
}
#memberBox02 #categoryLink li a:hover,
#memberBox02 #categoryLink li.current a {color:#fff;}
#memberBox02 h3 {
	color:#954f19;
	text-align:center;
	line-height:1.2em;
}
#memberBox02 table {
	box-sizing:border-box;
	background-color:#fff;
}
#memberBox02 td {
	line-height:1.5em;
	padding:0.5em 0.85em;
	border:#c49068 1px solid;
	box-sizing:border-box;
}

/*===============================================
●画面の横幅が729px以下(スマホのみ)
===============================================*/
@media screen and (max-width: 729px){
	
	/* #memberBox01
	---------------------------------------- */
	#memberBox01 {
		padding-bottom:2.5em;
	}
	#memberBox01 p {
		line-height:1.5em;
	}
	#memberBox01 .btn01 {
		margin-top:1em;
	}
	
	/* #memberBox02
	---------------------------------------- */
	#memberBox02 #selectText a {
		display:block;
		color:#fff;
		text-align:center;
		font-weight:bold;
		text-decoration:none;
		line-height:3em;
		margin-bottom:0.7em;
		background-color:#4cae45;
		border-radius:5px;
	}
	#memberBox02 #categoryLink {
		display:none;
		margin-bottom:1.5em;
	}
	#memberBox02 #categoryLink li a {
		border-bottom:#4cae45 1px solid;
	}
	#memberBox02 #categoryLink li:last-child a {
		border-bottom:none;
	}
	#memberBox02 h3 {
		font-size:1.28em;
		margin-bottom:0.7em;
	}
	#memberBox02 thead th {
		display:none;
	}
	#memberBox02 tbody tr {
		display:block;
		font-size:0.85em;
		width:100%;
		box-sizing:border-box;
		margin-bottom:0.85em;
		border:#c49068 1px solid;
	}
	#memberBox02 tbody td {
		display:table;
		width:100%;
		padding:0;
		line-height:1.2em;
		border-bottom:none;
	}
	#memberBox02 tbody td:before {
		display:table-cell;
		width:6em;
		content:attr(data-th);
		color:#fff;
		font-weight:bold;
		padding:0.5em 0.85em;
		vertical-align:top;
		background-color:#954f19;
	}
	#memberBox02 tbody td > span {
		display:block;
		overflow:hidden;
		padding:0.5em 0.85em;
	}
	#memberBox02 tbody td:nth-child(even) {
		background-color:#f2ede9;
	}
}

/*===============================================
●画面の横幅が730px以上(PCのみ)
===============================================*/
@media screen and (min-width: 730px){
	
	/* #memberBox01
	---------------------------------------- */
	#memberBox01 {
		padding-bottom:5.5em;
	}
	#memberBox01 p {
		line-height:1.8em;
	}
	#memberBox01 .btn01 {
		margin-top:2em;
	}
	
	/* memberBox02
	---------------------------------------- */
	#memberBox02 #categoryLink {
		display:flex;
		flex-wrap:wrap;
		margin-bottom:2.5em;
	}
	#memberBox02 #categoryLink li {
		width:33.333%;
		display:flex;
		align-items:center;
		border-right:#4cae45 1px solid;
		border-bottom:#4cae45 1px solid;
		box-sizing:border-box;
	}
	#memberBox02 #categoryLink li:nth-child(3n) {
		border-right:none;
	}
	#memberBox02 #categoryLink li:nth-last-of-type(-n+2) {
		border-bottom:none;
	}
	#memberBox02 #categoryLink li a {
		padding:1em 1em 1em 2.5em;
		line-height:1.3em;
	}
	#memberBox02 h3 {
		font-size:1.5em;
		margin-bottom:0.8em;
	}
	#memberBox02 thead th {
		color:#fff;
		font-size:1.15em;
		padding:0.4em 0.85em;
		font-weight:bold;
		text-align:center;
		background-color:#954f19;
		white-space:nowrap;
		border:#c49068 1px solid;
	}
	#memberBox02 tbody tr:nth-child(even) td {
		background-color:#f2ede9;
	}
}

/*===============================================
●画面の横幅が860px以上(PCのみ)
===============================================*/
@media screen and (min-width: 860px){
	
	/* 全般
	---------------------------------------- */
}