/* CSS Document */
*, *::after, *::before {
  box-sizing: inherit;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, hr {
  margin: 0;
  padding: 0;
  border: 0;
}
html, body {
  box-sizing: border-box;
  line-height: 1.7;
  letter-spacing: 0.1rem;font-family: 'M PLUS 1', sans-serif;
  font-weight: 500;
  color: var(--text);
  font-size: 16px;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main, form legend {
  display: block;
}
ol, ul {
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
img, video, svg {
  max-width: 100%;
}
figure{
	max-width:600px;
	margin: 0.5rem auto;
}

.half figure{
	max-width:calc(100% / 2 - 1rem);
}

.half,.third{margin:1rem auto;max-width: 610px;}
.half figcaption{font-size:0.95rem;}
.third figure{
	max-width:calc(100% / 3 - 1rem);
}
.third figcaption{font-size:0.85rem;}
:root {
  --primary: #00498d;
  --accent: #e83d7b;
  --sub: #ff9e00;
  --title: #007fcd;
  --text: #333333;
  --gray: #393F47;
  --mdgray: #dfeaf5;
  --lightgray: #F2F4F4;
	--sky:#2ec7e8;
  --base: #feea00;
	--green:#5bb331;
	--p_pink:#fbdae6;
	--p_blue:#cfe7f6;
	--p_green:#e0f1d8;
	--p_orange:#ffedcf;
	--p_sky:#d3edfb;
	--p_yellow:#fff7b8;
}
:root {
  --space-unit: 1em;
  --space: calc(1.25*var(--space-unit));
  --component-padding: var(--space);
}
.bg_s{background:url("./bg_s.png") var(--p_green);background-size:20%;}
.padding-md {
  padding: calc(var(--space) * 1.8);
}
.padding-ss {
  padding: 0.5rem;
}
.bg_primary {
  background: var(--primary);
}
.bg_white {
  background: #FFF;
}
.bg_gray {
  background: var(--gray);
}
.bg_base {
  background: var(--base);
}



.bg_lightgray {
  background: var(--lightgray);
}
.bg_title {
  background: var(--title);
}

.bg_sub{
	background: var(--sub);
}

/*サマフェス用*/

.bg_p_pink{background: url("./main_bg_top.png") no-repeat 0% 0%,var(--p_pink);
          background-size:100%,100%;
        padding-top:130px;}
.bg_p_blue{background: var(--p_blue);}
.bg_p_green{background: var(--p_green);}
.bg_p_orange{background: var(--p_orange);}
.bg_p_sky{background: var(--p_sky);}
.bg_p_yellow{background: url("./bg_about_top.png") no-repeat 0% 0%, url("./bg_about_bottom.png") no-repeat 0% 100%,var(--p_yellow) repeat 0% 0%;}

/*岡部2026募集用*/
#okabe.bg_p_yellow{padding-top:5em;background: url("./main_bg_top.png") no-repeat 0% 0%, url("./bg_about_bottom.png") no-repeat 0% 100%,url(./bgokb.png),var(--p_yellow);background-size:100%,100%,100%,50%;}
/*ここまで*/


.txt_primary {
  color: var(--primary);
}

.txt_accent {
  color: var(--accent);
}
.txt_text {
  color: var(--text);
}

.txt_center{
	text-align: center;
}
.flex {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
}

.hover_w img:hover {
			transition: 0.3s ;
			opacity: 0.8 ;
		}
.w300{
	width:100%;
	max-width:300px;
}

.w600{
	margin: 1rem auto;
	width:100%;
	max-width:600px;
}