@charset "UTF-8";

#column {
	.wrap {
		.contents {
			.list {
				display:grid;
				grid-template-columns:repeat(2,1fr);
				grid-gap:30px;
				a {
					display:grid;
					padding:15px;
					height:100%;
					grid-template-columns:20% 1fr 30px;
					grid-column-gap:20px;
					align-items:center;
					border:1px solid #cccccc;
					.img {
						img {
							display:block;
							aspect-ratio:1;
							object-fit:cover;
						}
					}
					.detail {
						h3 {
							background-color:transparent;
							padding:0;
							margin-bottom:.25em;
							font-size:2.0rem;
							&::before {
								content:none;
							}
						}
						p {
							line-height:1.5;
						}
					}
				}
			}
		}
	}
}

#member {
	.wrap {
		.contents {
			.list {
				display:grid;
				grid-template-columns:repeat(2,1fr);
				grid-gap:30px;
				li {
					display:grid;
					padding:15px;
					height:100%;
					grid-template-columns:20% 1fr 30px;
					grid-column-gap:20px;
					align-items:center;
					border:1px solid #cccccc;
					.img {
						img {
							display:block;
							aspect-ratio:1;
							object-fit:cover;
						}
					}
					.detail {
						h3 {
							background-color:transparent;
							padding:0;
							margin-bottom:.5em;
							font-size:2.0rem;
							&::before {
								content:none;
							}
						}
						a {
							display:grid;
							max-width:15em;
							margin:0 auto;
						}
					}
				}
			}
			.loginform {
				text-align: center;
				.input {
					margin-bottom: 20px;
						#login_password {
							padding:.5em;
						}
				}
				.submit {
					input {
						background-color: #FFFFFF;
						color:var(--color_main);
						border:2px solid var(--color_main);
						padding:.5em 2em;
						border-radius:3em;
					}
				}
			}
		}
	}
}

#course {
	.wrap {
		.contents {
			.contents_inner {
				display:grid;
				grid-template-columns:repeat(2,1fr);
				grid-gap:50px;
			}
		}
	}
	&.single {
		.wrap {
			.contents {
				line-height:2;
				img {
					display:block;
					max-width:800px;
					margin:30px auto;
				}
			}
		}
	}
}

@media screen and (max-width:1024px){

	#column {
		.wrap {
			.contents {
				.list {
					grid-template-columns:1fr;
				}
			}
		}
	}

	#member {
		.wrap {
			.contents {
				.list {
					grid-template-columns:1fr;
				}
			}
		}
	}

}

@media screen and (max-width:768px){

	#column {
		.wrap {
			.contents {
				.list {
					grid-gap:20px;
					a {
						padding:10px;
						grid-template-columns:20% 1fr 20px;
						grid-column-gap:15px;
						.detail {
							h3 {
								font-size:1.6rem;
							}
						}
					}
				}
			}
		}
	}

	#member {
		.wrap {
			.contents {
				.list {
					grid-gap:20px;
					li {
						padding:10px;
						grid-template-columns:20% 1fr 20px;
						grid-column-gap:15px;
						.detail {
							h3 {
								font-size:1.6rem;
							}
						}
					}
				}
			}
		}
	}
	
	#course {
		.wrap {
			.contents {
				.contents_inner {
					max-width:400px;
					margin:0 auto;
					grid-template-columns:1fr;
					grid-gap:30px;
				}
			}
		}
	}
	
}

@media screen and (max-width:640px){

}

@media screen and (max-width:480px){

}