@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700;900&family=Roboto:wght@400;700&display=swap');

:root {
	--noto_jp: 'Noto Sans JP', sans-serif;
	--main_color: #52962B;
	/*default --background: #F2F5F0;*/
	--background: #bce2a7;
	/*--background: #023015;*
	/*default --black: #333333;*/
	--black: #000000;
	--white: #fff;
	--shadow: 20px 20px 30px 0 #0000000b;
	--radius: 5px;
	--wrap: 1500px;
	--wrap02: 1000px;
	--break_w: 600px;
	--base_h: 1080;
	--base_w: 1920;
	--min_w: 1000px;
	/*----------------------------------------------
	color setting
---------------------------------------------*/
	/*page*/
	--pagebackground: #fff;
	--pagefontcolor: #000;
	--subtitlefontcolor: #000;
	--bordercolor: #fff;
	--ahoverfontcolor: #00507e;
	/*header*/
	--headerbackground: #5F826C;
	--headerfontcolor: #ffffff;
	/*navbar*/
	--navbarbackground: #5F826C;
	--navbarfontcolor: #000000;
	--navbarbordercolor: #ff6f38;
	--navbarlistbackground: #fff;
	--navbarlisthoverbackground: #474F4B;
	--navbarlisthoverfontcolor: #fff;
	--navbarlistactivebackground: #474F4B;
	--navbarlistactivefontcolor: #fff;
	/*search*/
	--searchbackground: #D1E7D5;
	--searchfontcolor: #000;
	--searchthbackground: #5F826C;
	/*button*/
	--btnbackground: #3d6bf5;
	--btnfontcolor: #fff;
	--btnradius: 20px;
	--btnbordercolor: #fff;
	--btnhoverbackground: #072fa8;
	--btnhoverfontcolor: #fff;
	--btnreset: #ff0000;
	--btnresethover: #c40404;
	/*table*/
	--tabletextcolor: #000;
	/* デザイン上の実際の縦マージンなどに
  calc(実際の数 / var(--base_h) * 100svh)
  と設定してレスポンシブになるように使用します */
}


/*----------------------------------------------
	html
---------------------------------------------*/
/*default html { font-size: 62.5%; }*/
html {
	font-size: 70%;
	height: 100%;
	overflow-y: visible;
}
/*----------------------------------------------
	body
---------------------------------------------*/
body {
	min-width: var(--wrap);
	font-size: 1.4rem;
	font-family: 'Roboto', var(--noto_jp), 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', arial, helvetica, sans-serif;
	color: var(--pagefontcolor);
	line-height: 1.5;

	overflow-y: visible;
	margin: 0;
	min-height: 100vh;
	flex-direction: column;
	display: flex;
}

html, body {
	height: auto; 
	min-height: 100vh; 
}
/*----------------------------------------------
	a
---------------------------------------------*/
a {
  color: #1A93D9;
  transition: 0.1s;
}
	a:hover,
	a:active,
	a:focus {
		color: var(--ahoverfontcolor);
	}

/*----------------------------------------------
	table
---------------------------------------------*/
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/*----------------------------------------------
	h1,h2,h3,h4,h5,h6
---------------------------------------------*/
h1,h2,h3,h4,h5,h6{ margin: 0; }

/*----------------------------------------------
	img
---------------------------------------------*/
img { vertical-align: bottom; }

/*----------------------------------------------
	*
---------------------------------------------*/
* {
	/*default null*/
	color: var(--black);
	font-size: 1.4rem;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	-webkit-print-color-adjust: exact;
	print-color-adjust: exact;
}

[type="search"]{
  margin: 0;
  border: 1px solid #3333332d;
  border-radius: 2px;
  background: #fff;
  outline: none;
  -webkit-appearance:none;
  outline-offset: 0;
}
[type="submit"]{
  margin: 0;
}


input:-webkit-autofill {
  box-shadow: 0 0 0 1000px white inset;
}

figure{
  margin: 0;
}