@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700&display=swap&subset=japanese");
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 { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }

html { line-height: 1; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }

q, blockquote { quotes: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; }

a img { border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

@keyframes fadein { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-webkit-keyframes fadein { 0% { opacity: 0; }
  100% { opacity: 1; } }
@keyframes fadein2 { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-webkit-keyframes fadein2 { 0% { opacity: 0; }
  100% { opacity: 1; } }
@keyframes fadeout { 0% { opacity: 1; }
  100% { opacity: .5; } }
@-webkit-keyframes fadeout { 0% { opacity: 1; }
  100% { opacity: .5; } }
/*
$chapter3: 250%;
$chapter2: 200%;
$chapter: 180%;
$title2: 150%;
$title: 125%; // 20px
$headline2: 112.5%; // 18px
$headline: 100%; // 16px
$leads: 87.5%; // 14px
$bodys: 81.25%; // 13px
$notes: 75%; // 12px
$exnotes: 68.75%; // 11px
$exxnotes: 62.5%; // 10px
*/
img { -ms-interpolation-mode: bicubic; }

.forpc { display: block; }
@media screen and (max-width: 735px) { .forpc { display: none !important; } }

.formb { display: none; }
@media screen and (max-width: 735px) { .formb { display: block; } }

@-webkit-keyframes blink { 0% { opacity: 0.8; }
  100% { opacity: 1; } }
@-moz-keyframes blink { 0% { opacity: 0.8; }
  100% { opacity: 1; } }
@keyframes blink { 0% { opacity: 0.8; }
  100% { opacity: 1; } }
/*
$sprites: sprite-map("common/*.png", $spacing:2px);
$sprites-img:sprite-url($sprites);
@mixin sprite-background($name) {
	width: image-width(sprite-file($sprites, $name)) / 2;
	height: image-height(sprite-file($sprites, $name)) / 2;
	display: block;
	background-image: $sprites-img;
	background-repeat: no-repeat;
	$ypos: round(nth(sprite-position($sprites, $name), 2) / 2);
	background-position: 0 $ypos;
	text-indent: -30000px;
	// サイズ指定
	@include background-size($common_width auto);
}
*/
a { transition-property: background-color, border, color, opacity; transition-duration: .2s; transition-timing-function: linear; -webkit-transition-property: background-color, border, color, opacity; -webkit-transition-duration: .2s; -webkit-transition-timing-function: linear; text-decoration: none; }
a:link { color: #0d3e97; }
a:visited { color: #42609d; }
a:hover { color: #00a3da !important; }
a:active { color: #ff0000 !important; }
a.link:after { padding: 0 4px; content: "\f105"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 12px; line-height: 1; }

body { font-family: heisei-kaku-gothic-std, sans-serif; }

#navbtn { display: none; position: fixed; z-index: 10000; top: 11px; right: 8px; width: 44px; height: 44px; }
@media screen and (max-width: 735px) { #navbtn { display: block; } }
#navbtn span { position: absolute; left: 10px; width: 24px; height: 1px; display: block; background-color: #000; -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; }
#navbtn span:nth-child(1) { top: 12px; }
#navbtn span:nth-child(2) { top: 20px; }
#navbtn span:nth-child(3) { top: 28px; }
#navbtn.active { position: fixed; top: 10px; right: 10px; z-index: 1000000; }
#navbtn.active span:nth-child(1) { top: 22px; left: 8px; transform: rotate(45deg); }
#navbtn.active span:nth-child(2) { top: 22px; width: 0; left: 50%; }
#navbtn.active span:nth-child(3) { top: 22px; left: 8px; transform: rotate(-45deg); }

header { border-top: 8px solid #179331; }
header #header { padding: 15px 20px; max-width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
header h1 a { color: #000 !important; }
header h1 a span { padding: 0 0 0 12px; display: block; font-weight: bold; line-height: 1.2; border-left: 10px solid #179331; }
header h1 a span.pref { font-size: 150%; }
header h1 a span.name { font-size: 200%; }
header #headnav .google .upper { margin: 0 0 5px; display: flex; align-items: center; justify-content: center; }
header #headnav .google .bottom { font-size: 75%; display: flex; align-items: center; justify-content: flex-end; }
header #headnav .google .bottom .fsml { margin-left: .3em; }
header #headnav .google .bottom .mr10 { margin-right: 10px; }
header #headnav .google img { height: 22px !important; }
header #headnav .google input[type="text"] { height: 20px; margin: 0 0 0 5px; padding: 0 10px; border: 1px solid #ddd; border-radius: 15px 0 0 15px; background: none !important; outline: none; }
header #headnav .google input[type="submit"] { width: 50px; height: 24px; border: 1px solid #ddd; border-radius: 0 15px 15px 0; font-weight: bold; color: #fff; background: #179331 !important; cursor: pointer; }
header #headnav .google input[type="radio"], header #headnav .google label { cursor: pointer; }
header #headnav ul { margin: 10px 0 0; display: flex; flex-wrap: wrap; justify-content: flex-end; }
header #headnav ul li { margin: 0 0 0 15px; }
header #headnav ul li a { font-size: 87.5%; font-weight: bold; color: #000 !important; }
header #headnav ul li a:hover { color: #179331 !important; }
header #headnav ul li#link a:before { margin: 0 3px 0 0; content: '\f0c1'; font-family: "Font Awesome 5 Free"; font-weight: 900; color: #179331; }
header #headnav ul li#contact a:before { margin: 0 3px 0 0; content: '\f0e0'; font-family: "Font Awesome 5 Free"; font-weight: 900; color: #179331; }
@media screen and (max-width: 735px) { header { box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2); justify-content: flex-start; }
  header #header { padding: 0; }
  header h1 { border-top: 8px solid #179331; position: fixed; z-index: 100; top: 0; left: 0; width: 100%; height: 50px; padding: 0 20px; display: flex; align-items: center; justify-content: flex-start; background-color: #fff; }
  header h1 a { display: flex; align-items: center; justify-content: center; padding: 0 0 0 8px; border-left: 5px solid #179331; }
  header h1 a span { padding: 0 4px 0 0; border: none; }
  header h1 a span.pref { margin-top: 2px; font-size: 81.25%; }
  header h1 a span.name { font-size: 112.5%; }
  header #headnav { position: fixed; z-index: 102; top: 60px; right: -100%; width: 100%; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; }
  header #headnav.active { right: 0; }
  header #headnav .google .bottom { font-size: 75%; justify-content: center; }
  header #headnav .google img { height: 22px !important; }
  header #headnav .google input[type="text"] { height: 30px; border-radius: 17px 0 0 17px; }
  header #headnav .google input[type="submit"] { height: 34px; border-radius: 0 17px 17px 0; }
  header #headnav ul { margin: 20px 0 0; justify-content: center; }
  header #headnav ul li { margin: 0 10px; }
  header #headnav ul li a { font-size: 81.25%; } }

nav { border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; background: linear-gradient(180deg, #ffffff, #eeeeee 50%) fixed; }
nav ul { padding: 0 20px; max-width: 1200px; margin: 0 auto; display: flex; align-items: stretch; justify-content: space-between; }
nav ul li { flex-basis: calc(100 / 8 * 1%); }
nav ul li a { height: 100px; padding: 0 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; border-left: 1px solid #ddd; -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; }
nav ul li a span.ja { font-size: 112.5%; font-weight: bold; color: #333; text-align: center; }
nav ul li a span.en { margin: 8px 0 0; font-size: 62.5%; font-weight: bold; color: #179331; text-align: center; }
nav ul li a:before { margin: 0 0 8px; font-family: "Font Awesome 5 Free"; font-weight: 900; color: #179331; }
nav ul li a:hover { background-color: #179331; }
nav ul li a:hover span.ja { color: #fff; }
nav ul li a:hover span.en { color: #fff; }
nav ul li a:hover:before { color: #fff; }
nav ul li:last-child a { border-right: 1px solid #ddd; }
nav ul li#home a:before { content: '\f015'; }
nav ul li#program a:before { content: '\f129'; }
nav ul li#about a:before { content: '\f2bb'; }
nav ul li#news a:before { content: '\f15c'; }
nav ul li#facility a:before { content: '\f108'; }
nav ul li#publication a:before { content: '\f1ea'; }
nav ul li#development a:before { content: '\f085'; }
nav ul li#rights a:before { content: '\f2bd'; }
@media screen and (max-width: 735px) { nav { border: none; background: none; position: fixed; z-index: 100; top: 0; right: -100%; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; width: 100%; height: 100vh; background-color: #fff; }
  nav.active { right: 0; }
  nav ul { padding: 180px 0 0; display: flex; flex-direction: column; }
  nav ul li { flex-basis: 100%; }
  nav ul li a { position: relative; height: auto; padding: 10px 40px 10px 70px; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; border-left: none !important; }
  nav ul li a span.ja { font-size: 112.5%; }
  nav ul li a span.en { margin: 3px 0 0; }
  nav ul li a:before { position: absolute; top: 6px; left: 25px; width: 40px; height: 40px; margin: 0; font-size: 20px; text-align: center; line-height: 40px; } }

.topicpath { padding: 20px; max-width: 1200px; margin: 0 auto; }
.topicpath p { font-size: 68.75%; }

#pagetop { position: fixed; z-index: 999; bottom: 230px; right: 20px; }
#pagetop a { position: relative; width: 40px; height: 40px; display: block; text-indent: -3000px; background-color: #179331; border-radius: 20px; }
#pagetop a:before { content: ''; position: absolute; top: 17px; left: 15px; width: 8px; height: 8px; margin: 0; display: block; display: inline-block; vertical-align: middle; border-top: 1px solid #fff; border-right: 1px solid #fff; -ms-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
#pagetop a:hover { background-color: #666; }
@media screen and (max-width: 735px) { #pagetop { bottom: calc(env(safe-area-inset-bottom) + 44px); } }

footer { border-top: 1px solid #ddd; }
footer #footer { padding: 50px 20px; max-width: 1200px; margin: 0 auto; }
footer #footer .credit { margin: 0 0 15px; padding: 0 0 15px; font-size: 112.5%; font-weight: bold; color: #179331; line-height: 1.4; border-bottom: 1px solid #ddd; }
footer #footer address { font-size: 81.25%; line-height: 1.8; }
footer #footer address span.addr { display: block; }
footer #copyright { padding: 8px 20px; font-size: 75%; color: #fff; text-align: center; background-color: #179331; }

.catheader { position: relative; }
.catheader .title { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3); display: flex; align-items: center; }
.catheader .title h1 { max-width: 1200px; margin: 0 auto; font-size: 180%; font-weight: bold; color: #fff; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); text-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2); }
@media screen and (max-width: 735px) { .catheader { margin: 50px 0 0; height: 200px; overflow: hidden; }
  .catheader .catimg { position: absolute; top: 0; left: 0; margin: 0 0 0 -50%; width: 1000px; height: 200px; }
  .catheader .title h1 { font-size: 150%; } }

article { padding: 20px 20px 0; max-width: 1200px; margin: 0 auto; }
article h1 { margin: 0 0 20px; font-size: 200%; font-weight: bold; }
article h2.columntitle { margin: -15px -20px 15px; padding: 0; font-size: 125%; font-weight: bold; }
article h2.columntitle a { position: relative; margin: 0; padding: 18px 20px; display: block; color: #000; border-bottom: 1px solid #999; }
article h2.columntitle a:before { content: ''; position: absolute; top: 50%; right: 20px; width: 7px; height: 7px; margin: -6px 0 0; display: inline-block; vertical-align: middle; border-top: 1px solid #999; border-right: 1px solid #999; -ms-transform: rotate(45deg); transform: rotate(45deg); }
article h2.columntitle a:hover { color: #fff !important; background-color: #179331; }
article h2.columntitle a:hover:before { border-top: 1px solid #fff; border-right: 1px solid #fff; }
article p { margin: 0 0 12px; font-size: 100%; line-height: 1.8; }
article p.headline { margin: 0 0 20px; font-size: 112.5%; font-weight: bold; line-height: 1.5; }
article ul { margin: 0 0 12px; padding: 0; }
article ul li { list-style-type: none; position: relative; padding: 0 0 5px 14px; font-size: 100%; line-height: 1.6; }
article ul li:before { position: absolute; top: 0; left: 0; content: '\f111'; font-family: "Font Awesome 5 Free"; font-weight: 900; color: #ccc; -ms-transform: scale(0.6, 0.6); transform: scale(0.6, 0.6); }
article ul.llist { margin: 0 0 12px; }
article ul.llist li strong { font-weight: bold; }
article ul.llist li:before { content: ''; position: absolute; top: 9px; left: 2px; width: 5px; height: 5px; margin: 0; display: inline-block; vertical-align: middle; border-top: 1px solid  #999; border-right: 1px solid #999; -ms-transform: rotate(45deg); transform: rotate(45deg); }

.border { margin: 0 0 15px; padding: 15px 20px; border: 1px solid #999; border-radius: 5px; }

.column .border { height: 100%; box-sizing: border-box; }

.columns { margin: 0 0 0 -20px; display: flex; flex-wrap: wrap; align-items: stretch; justify-content: flex-start; }
.columns .column { margin: 0 0 20px 20px; flex-basis: calc(100 / 2 * 1% - 20px); }
.columns .column3 { margin: 0 0 20px 20px; flex-basis: calc(100 / 3 * 1% - 20px - .1em); }
.columns .column4 { margin: 0 0 20px 20px; flex-basis: calc(100 / 4 * 1% - 20px); }
@media screen and (max-width: 735px) { .columns { margin: 0 0 0 -10px; }
  .columns .column { margin: 0 0 10px 10px; flex-basis: calc(100% - 10px); }
  .columns .column3 { margin: 0 0 10px 10px; flex-basis: calc(100% - 10px); }
  .columns .column4 { margin: 0 0 10px 10px; flex-basis: calc(50% - 10px); } }

.mt0 { margin-top: 0 !important; }

.mt5 { margin-top: 5px; }

.mt10 { margin-top: 10px; }

.mt15 { margin-top: 15px; }

.mt20 { margin-top: 20px; }

.mt25 { margin-top: 25px; }

.mt30 { margin-top: 30px; }

.mt-10 { margin-top: -10px !important; }

.pt0 { padding-top: 0 !important; }

.pt5 { padding-top: 5px; }

.pt10 { padding-top: 10px; }

.pt15 { padding-top: 15px; }

.pt20 { padding-top: 20px; }

.pt25 { padding-top: 25px; }

.pt30 { padding-top: 30px; }

.mb0 { margin-bottom: 0 !important; }

.mb5 { margin-bottom: 5px; }

.mb10 { margin-bottom: 10px; }

.mb15 { margin-bottom: 15px; }

.mb20 { margin-bottom: 20px; }

.mb25 { margin-bottom: 25px; }

.mb30 { margin-bottom: 30px; }

.pb0 { padding-bottom: 0 !important; }

.pb5 { padding-bottom: 5px; }

.pb10 { padding-bottom: 10px; }

.pb15 { padding-bottom: 15px; }

.pb20 { padding-bottom: 20px; }

.pb25 { padding-bottom: 25px; }

.pb30 { padding-bottom: 30px; }

.description { display: none; }

.c5 { width: 5%; }

.c10 { width: 10%; }

.c15 { width: 15%; }

.c20 { width: 20%; }

.c25 { width: 25%; }

.c30 { width: 30%; }

.c35 { width: 35%; }

.c40 { width: 40%; }

.c45 { width: 45%; }

.c50 { width: 50%; }

.c60 { width: 60%; }

.c70 { width: 70%; }

.c75 { width: 75%; }

.c80 { width: 80%; }

.c100 { width: 100%; }

.c_left { text-align: left !important; }

.c_right { text-align: right !important; }

.c_center { text-align: center !important; }

img { max-width: 100%; vertical-align: bottom; }

.alignleft, .f_left { float: left; padding: 0 15px 15px 0; }
.border .alignleft, .panel .alignleft, .border .f_left, .panel .f_left { padding-bottom: 0; }
@media screen and (max-width: 735px) { .alignleft, .f_left { float: none; margin: 0 auto; padding: 0 0 15px !important; display: block; } }

.alignright, .f_right { float: right; padding: 0 0 15px 15px; }
.border .alignright, .panel .alignright, .border .f_right, .panel .f_right { padding-bottom: 0; }
@media screen and (max-width: 735px) { .alignright, .f_right { float: none; margin: 0 auto; padding: 0 0 15px !important; display: block; } }

.aligncenter { display: block; margin: 0 auto; }

.img { width: 100%; height: auto; }

.c5 { width: 5%; }

.c10 { width: 10%; }

.c15 { width: 15%; }

.c20 { width: 20%; }

.c25 { width: 25%; }

.c30 { width: 30%; }

.c35 { width: 35%; }

.c40 { width: 40%; }

.c45 { width: 45%; }

.c50 { width: 50%; }

.c60 { width: 60%; }

.c70 { width: 70%; }

.c75 { width: 75%; }

.c80 { width: 80%; }

.c100 { width: 100%; }

.indent { margin-left: 1em !important; text-indent: -1em; }

.indent3 { margin-left: 3em !important; text-indent: -3em; display: block; }

.indentblock { margin-left: 1em !important; }

strong { font-weight: bold; }

.right { text-align: right; }

.large { padding: 5px 0 0; display: block; font-size: 150%; }

.clr { clear: both; }

.overflow { overflow: hidden; }

.nowrap { white-space: nowrap !important; }
@media screen and (max-width: 735px) { .nowrap { white-space: normal !important; } }

.i5 { width: 5%; }

.i10 { width: 10%; }

.i15 { width: 15%; }

.i20 { width: 20%; }

.i25 { width: 25%; }

.i30 { width: 30%; }

.i35 { width: 35%; }

.i40 { width: 40%; }

.i45 { width: 45%; }

.i50 { width: 50%; }

.i60 { width: 60%; }

.i70 { width: 70%; }

.i80 { width: 80%; }

.i90 { width: 90%; }

.i100 { width: 100%; }

@media screen and (max-width: 666px) { .i5, .i10, .i15, .i20, .i25, .i30, .i35, .i40, .i45, .i50, .i60, .i70, .i80, .i90, .i100 { width: 100%; } }