@charset "utf-8";

/* head {
	display: none;
} */
html,
body {
	width: 100%;
	padding: 0px;
	margin: 0 auto;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	background-color: #FFFFFF;
	background-image: url('../images/background.png');
	background-size: cover;
	background-attachment: fixed;
	font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", Verdana, "ＭＳ Ｐゴシック", "MS P Gothic" Helvetica, sans-serif;
	overflow-x: hidden;
	/* 横スクロールを防止 */
}

img {
	display: block;
	border: none;
	vertical-align: bottom;
}

h1 {
	color: var(--black, #252849);
	font-family: "Futura PT";
	font-size: 48px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

h2 {
	margin: 0;
	color: var(--black, #252849);
	font-family: "Futura PT";
	font-size: 140px;
	font-style: normal;
	font-weight: 300;
	line-height: normal;
}

h3 {
	margin: 0;
	color: var(--black, #252849);
	font-family: YuGothic;
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}

h4 {
	margin: 0;
	color: var(--black, #252849);
	font-family: YuGothic;
	font-size: 24px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}

p {
	color: var(--black, #252849);
	font-family: YuGothic;
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 200%;
	/* 32px */
}

table {
	/* width: 70%; */
	padding: 32px;
	border: 1px #252849 solid;
	border-collapse: collapse;
	border-spacing: 0px;
}

td,
th {
	padding: 24px;
	border: 1px #d5d0de solid;
	text-align: left;
}

table,
th,
td {
	border-left: none;
	border-right: none;
	color: var(--black, #252849);
	font-family: YuGothic;
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;

}


th {
	color: #9b99b4;
	text-align: right;
	color: var(--black, #252849);
	font-family: "Futura PT";
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

ul {
	/* width: 500px; */
	padding: 10px;
	margin: 5px auto 100px;
	color: #363636;
	list-style: inside decimal;
}

ul {
	list-style-type: disc;
}

/*ハンバーガーメニュー------------------------------------------------------------------------*/
/* nav{
	position: fixed;
	top: 10px;
	right: 10px;
	width: 40px;
	height: 40px;
	overflow: hidden; */

/* background: #fff; */
/* background: linear-gradient(0deg, rgba(255, 255, 255, 0.30) 0%, rgba(255, 255, 255, 0.21) 100%); */

/* 影ガラス */
/* box-shadow: 0px 0px 11.4px 0px rgba(166, 161, 197, 0.25);
backdrop-filter: blur(15px);
} */
/* nav:hover{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	width: 80px;
	height: auto;
}
body nav h2{
	color: #26284A;
	font-size: 12px;
	height: 40px;
	line-height: 40px;
	margin-left: 3px;
	padding: 0;
}
nav ul{
	list-style: none outside;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
}
nav ul  > ul,
nav ol{
	background: #edf;
}
nav li{
	height: 40px;
	line-height: 40px;
	border-top: 1px solid #edf;
	text-decoration: none;
}

nav li a {
	text-decoration: none;
	cursor: pointer;
} 
nav li:hover{
	/* width: 100%;
	height: 100%; */
/* background-color: #ffffff;
	cursor: pointer;
} */
/* nav li a:hover{
	color: #000;
} */

/* --------- ヘッダーとメニュー用レイアウト ---------*/
/* #wrapper {
	display: flex;
	margin: 0px auto;
} */

.header {
	width: 100%;
	text-align: center;
	position: fixed;
	z-index: 1000;
	/* レイヤーの順番を最前面に */
	display: flex;
	/* margin: 8px 56px; */
	/* border: 1px solid red; */
	justify-content: space-between;
	/* 左右にスペースを配分 */
}

.logo {
	display: flex;
	align-items: center;
	text-align: left;
	gap: 16px;
	margin-left: 16px;
}

.logo p {
	color: #26284A;
	font-family: "Futura PT";
	font-size: 24px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

.logo img {
	display: block;
	/* ブロック要素として表示 */
	width: auto;
	/* 画像の幅 */
	height: 40px;
	/* 画像の高さを自動調整 */
}

.menu {
	align-items: flex-end;
	text-align: right;
	justify-content: flex-end;
}

nav {
	display: flex;
	/* Flexboxを使用 */
	justify-content: flex-end;
	/* メニュー項目を右寄せ */
	align-items: center;
	/* 垂直方向に中央揃え */
	height: 80px;
	/* ナビゲーションの高さ */
	margin-right: 16px;
}

nav ul {
	display: flex;
	/* リスト項目を横並びに */
	list-style: none;
	/* デフォルトのリストスタイルを削除 */
	align-items: center;
	padding: 0;
	/* パディングをリセット */
	margin: 0;
	/* マージンをリセット */
}

nav li {
	margin: 0 16px;
}

nav li a {
	text-decoration: none;
	/* 下線を削除 */
	color: #26284A;
	font-family: "Futura PT";
	font-size: 24px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

nav li a img {
	display: block;
	width: 28px;
	height: auto;
	transition: transform 0.3s;
}

.icon {
	display: block;
	width: 28px;  /* 画像の幅 */
	height: 28px; /* 画像の高さ */
	background-size: contain;
	background-repeat: no-repeat;
}

/* 通常時の背景画像 */
.insta {
	background-image: url("../images/insta.png");
}

.mail {
	background-image: url('../images/mail.png');
}


/* ホバー時の背景画像 */
.insta:hover {
	background-image: url('../images/insta-hover.png');
}

.mail:hover {
	background-image: url('../images/mail-hover.png');
}
/* m6のアイコンのスタイル */
#menu li a.icon.mail {
	display: block;
	width: 28px;  /* アイコンの幅 */
	height: 28px; /* アイコンの高さ */
	background-image: url('./images/mail.png');
	background-size: contain; /* 画像を要素のサイズに合わせて表示 */
	background-repeat: no-repeat; /* 画像が繰り返されないように */
	background-position: center; /* 画像を要素の中央に配置 */
	/* 上下の余白を調整（必要に応じて） */
	margin: 0;
}
nav li a:hover {
	color: #0ad8d5;
	/* ホバー時のテキストの色 */
}

/* 追加のスタイル */
.visit {
	display: none;
	/* .visitクラスの非表示 */
}

/*--------- レイアウト ---------*/
* {
	margin: 0;
	padding: 0;
}

#work {
	margin-top: 160px;

}
.gallery_box {
  width: auto; /* 必要に応じて親要素のサイズを指定 */
	margin: 8% 8% 0;
	padding-bottom:  4%;
	border-bottom: 1px solid #BDBFD8;
}

.gallery_box img {
	width: 100%;
  object-fit: cover;
	margin-bottom: 16px;
}
.gallery_box h3 {
	margin-bottom: 8px;
}
.gallery_box h4 {
	margin-bottom: 8px;
	font-family: "Futura PT";
	font-size: 28px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}
.gallery_box p{
	color: #585B7A;
}
.gallery_box a{
	text-decoration: none;
	color: #585B7A;
}
.gallery_textes{
	margin: 4% 8% 4%;
	border-bottom: 1px solid #BDBFD8;
}
.gallery_text{
	display: flex;
	gap: 120px;
	align-items: flex-start;
	margin-bottom: 4%;
}
.title{
	display: flex;
	align-items: center;
	width: auto;
	gap: 12px;
}
.title h3{
	font-size: 24px;
	width: 220px;
}
.title img{
	width: 35px;
}
.text{
	display: flex;
	gap: 8px;
	flex-direction: column;

}
.text h4{
	font-size: 24px;
}
.colorber img{
	width: 70%;
	filter: drop-shadow(0px 0px 11.4px rgba(166, 161, 197, 0.25));
}
.suraido{
	display: flex;
}
.suraido img{
	width: 33%;
}
.gallery_photo{
	display: flex;
	width: auto; /* 必要に応じて親要素のサイズを指定 */
	margin: 0 8%;
	gap: 80px;
	align-items: flex-start;
	justify-content: center;
}
.gallery_photo img {
	width: 45%;
  object-fit: contain; 
}
.footer {
	width: 100%;
	height: 80px;
	text-align: right;
	background-image: url('../images/footer.png');
}

.footer p {
	padding: 40px 40px 16px;
	color: var(--black, #252849);
	font-family: "Futura PT";
	font-size: 16px;
	font-style: normal;
	font-weight: 200;
	line-height: normal;
}
#list{
	display: flex;
	text-align: center;
	justify-content: center;
	margin: 4% auto 160px;
}
.view-more a{
	display: flex;
	justify-content: center;
	/* 左右中央 */
	align-items: center;
	/* 上下中央 */
	width: 200px;
	height: 56px;
	flex-shrink: 0;
	border-radius: 57px;
	border: 1px solid rgba(255, 255, 255, 0.50);
	background: linear-gradient(95deg, rgba(255, 255, 255, 0.30) 0%, rgba(255, 255, 255, 0.10) 100%);
	
	/* 影ガラス */
	box-shadow: 0px 0px 11.4px 0px rgba(166, 161, 197, 0.25);
	backdrop-filter: blur(15px);
	font-family: "Futura PT";
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;

	border-bottom: none;
	text-decoration: none;
	color: var(--black, #252849);
	font-family: "Futura PT";
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 56px;
}

.view-more a:hover {
	border-radius: 57px;

	border: 1px solid rgba(255, 255, 255, 0.50);
	background: linear-gradient(95deg, rgba(255, 255, 255, 0.30) 0%, rgba(255, 255, 255, 0.10) 100%);
	box-shadow: 0px 0px 3.8px 0px rgba(166, 161, 197, 0.25) inset;

	border-bottom: none;
	text-decoration: none;
	color: var(--black, #0ad8d5);
	font-family: "Futura PT";
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 56px;
}