@charset "utf-8";

/* 全体の設定
–––––––––––––––––––––––––––––––––––––––––––––––––– */
body {
	font-family: 'Noto Sans JP', sans-serif;
	margin: 0;
	word-wrap: break-word;
	overflow-x: hidden;
}

html {
	scroll-behavior: smooth;
}

section {
	padding: clamp(3rem, 6.5vw, 5rem) 1rem;
}


/* ROOT
–––––––––––––––––––––––––––––––––––––––––––––––––– */
:root {
	/* Color */
	--main-color: #db4117;
	--sub-color_01: #333;

	--blue: #7dcdf5;
	--dark-blue: #00A0E9;
	--navy: #1d50a2;
	--green: #009245;
	--light-yellow: #f4f1df;
	--yellow: #f5c92a;
	--light-orange: #ED945D;
	--orange: #E35F0D;
	--vermilion: #dc503c;
	--red: #E60012;
	--light-gray: #D1D5D9;
	--gray: #8B8C90;
	--dark-gray: #666666;
	--deep-dark-gray: #333;
	--white: #fff;
	--black: #000;

	/* 角丸 */
	--rounded-5-10: clamp(5px, 3vw, 10px);
	--rounded-10-25: clamp(10px, 3.5vw, 25px);

}


/* 基本CSS
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
	display: inline-block;
	text-decoration-line: none;
	color: inherit;
}

a:hover,
a img:hover {
	color: inherit;
	opacity: 0.8;
}

ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

li {
	text-decoration: none;
}

table {
	width: 100%;
	border-collapse: collapse;
}

table :is(th, td) {
	padding: 1.5rem .5rem;
}

table th {
	width: 30%;
}

table p {
	margin: 0;
}

/*input {
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}*/

button {
	background: none;
	border: none;
}

/* フォント */
.font-montserrat {
	font-family: "Montserrat", sans-serif;
}

.font-roboto {
	font-family: "Roboto", sans-serif;
}

.font-yuji-boku {
	font-family: "Yuji Boku", serif;
}

@media screen and (max-width: 960px) {
	table.table960 :is(th, td) {
		display: block;
		width: 100%;
	}

	table.table960 th {
		padding-bottom: 0;
	}

	table.table960 td {
		padding-top: .5rem;
	}
}

@media screen and (max-width: 768px) {
	table.table768 :is(th, td) {
		display: block;
		width: 100%;
	}

	table.table768 th {
		padding-bottom: 0;
	}

	table.table768 td {
		padding-top: .5rem;
	}
}

@media screen and (max-width: 560px) {
	table.table560 :is(th, td) {
		display: block;
		width: 100%;
	}

	table.table560 th {
		padding-bottom: 0;
	}

	table.table560 td {
		padding-top: .5rem;
	}
}


/* 汎用コンテンツ
-------------------------------------*/
/* 必要なパーツをここに貼り付けて使ってください */