@charset "utf-8";

/*　共通部分
ｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰ*/

html {
	font-size: 100%;
}
body{
	font-family: "Effra Medium", "Yu Gothic Pr6N R", sans-serif;
	line-height: 1.7;
	color: #000000;
}
img{
	max-width: 100%;
}

/*　ヘッダー
ｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰ*/
.logo{
	width: 100%;
	min-width: 110px;
	max-width: 240px;
	height: auto;
}
header{
	max-height: 155px;
	background-color: #ebebeb;
}
a{
	text-decoration: none;
	color: #000000;
}
.page-header{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 2rem;
}
li{
	list-style: none;
}
.main-nav{
	font-size: 20px;
	font-weight: 600;
}
/* カーソルをのせた時の動作
---------------*/
.main-nav a {
 	border-bottom: 2px solid transparent;
 	padding-bottom: 4px;
}

/* クリック後
---------------*/
.main-nav a:hover,
.main-nav a.current {
	border-bottom: 2px solid #000;
}

/* メインコンテンツ
---------------*/
.all-works{
	width: 100%;
}
.work-nav{
	width: 100%;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem 0;
	justify-content: flex-start;
	padding: 1rem 0;
}
.work-nav_list a:hover,
.work-nav_list a.current-main {
	color: #FFFFFF;
	background-color: #0e3e8f; 
}
.work-nav_list a,
.work-nav_list p{
	display: inline-block;
	border: 1px #8E8E8E solid;
	border-radius: 15px;
	font-size: 12px;
	text-decoration: none;
	color:#000;
	padding: 0.2rem 0.9rem;
}
.work-nav_list p{
	background-color: #0e3e8f;
	color: #FFF;
}
/* ボタン無効
---------------*/
.button-disabled{
	background-color: #CCC;
	color: #666;
	pointer-events: none;
	border-radius: 15px;
}
.button-disabled:hover{
	background-color: #ccc;
	color: #666;
	border-radius: 15px;
}
.work-list{
	width: 100%;
	margin: 0 auto;
	padding: 0;
	padding-bottom: 3rem;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}
figure{
	margin:  0;
}

.work-list_item{
	padding: 0;
}
.work-list_title{
	display: none;
}
.front-img{
	border: 1px #8E8E8E solid;
	display: block;
}
/* フッター
---------------*/
footer{
	width: 100%;
	background-color: #ebebeb;
}
.copyright{
	text-align: center;
	font-size: 12px;
	max-width: 360px;
	margin: 0 auto;
	padding: 2rem;
}



/* デスクトップ版
---------------*/
@media (min-width:800px){
	/*ヘッダー
	---------------*/
	.page-header{
		padding-left: 4rem;
		padding-right: 4rem;
	}
	.main-nav{
		font-size: 34px;
		font-weight: 600;
		display: flex; 
		gap: 1.5rem;
	}
	/*ヘッダー
	---------------*/
	.main-nav{
		font-size: 34px;
		font-weight: 600;
		display: flex; 
		gap: 1.5rem;
	}
	/* カーソルをのせた時の動作
	---------------*/
	.main-nav a {
 		border-bottom: 3px solid transparent;
 		padding-bottom: 4px;
	}

	/* クリック後
	---------------*/
	.main-nav a:hover,
	.main-nav a.current {
		border-bottom: 3px solid;
	}
	/* メインコンテンツ
	---------------*/
	.work-nav{
		max-width: 1200px;
		padding: 2rem 0;
	}
	.gallery-page_induction{
		font-size: 14px;
		max-width: 1200px;
		margin-bottom: 0.5rem;
	}
	.work-list{
		max-width: 1200px;
		grid-template-columns: repeat(5, 1fr);
		gap: 3rem;
	}
	.work-list_item{
		padding: 0;
	}
	.work-list_title{
		display: block;
		margin-top: 0.5rem;
		font-size: 14px;
	}
	.copyright{
		font-size: 14px;
		max-width: 1200px;
	}
}