/*------------------------
	釧路高専 機械工学分野
	流体工学研究室
	hogehoge.com
	2023-07-01	origin
------------------------*/
@charset "UTF-8";

/*------------------------
	A Modern CSS Reset
------------------------*/
/* Box sizingの定義 */
*, *::before, *::after	{ box-sizing: border-box; }
/* デフォルトのpaddingを削除 */
ul[class], ol[class]	{ padding: 0; }
/* デフォルトのmarginを削除 */
body, 
h1, h2, h3, h4, h5, h6,
ul[class], ol[class], li,
figure, figcaption, blockquote, dl	{ margin: 0; }
/* bodyのデフォルトを定義 */
body {
	min-height: 100vh;
	scroll-behavior: smooth;
	text-rendering: optimizeSpeed;
	line-height: 1.6;
}
/* class属性を持つul、ol要素のリストスタイルを削除 */
ul[class], ol[class]	{ list-style: none; }
/* classを持たない要素はデフォルトのスタイルを取得 */
a:not([class])	{ text-decoration-skip-ink: auto; }
/* img要素の扱いを簡単にする 
img	{ display: block; max-width: 100%; margin: auto; }
*/
img	{ max-width: 100%; margin: auto; }
/* iframe */
iframe	{ max-width: 100%; margin: auto; }
iframe	{ display: block; }
/* Natural flow and rhythm in articles by default */
/* article要素内の要素に自然な流れとリズムを定義 
article > * + * { margin-top: 1em; }
*/
/* inputやbuttonなどのフォントは継承を定義 */
input, button, textarea, select	{ font: inherit; }
 
/* Remove all animations and transitions for people that prefer not to see them */
/* 見たくない人用に、すべてのアニメーションとトランジションを削除 */
@media (prefers-reduced-motion: reduce) {
	* {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}


/*----------------------
Inview
----------------------*/
/*
.effect		{ overflow: hidden; }
*/
.ef-fade,
.ef-fade01,
.ef-zoom,
.ef-rotate	{ transition: .6s; }
.ef-fade:nth-child(even)	{ transition: .9s; }
.ef-fade:nth-child(3)	{ transition: 1.2s; }
.ef-fade	{ opacity: 0; transform: translate(0, 60px); -webkit-transform: translate(0, 60px); }
.fade		{ opacity: 1; transform: translate(0, 0); -webkit-transform: translate(0, 0); }
.ef-fade01	{ opacity: 0; }
.fade01		{ opacity: 1; }
.ef-zoom	{ transform: scale(0, 0); -webkit-transform: scale(0, 0); }
.zoom		{ transform: scale(1, 1); -webkit-transform: scale(1, 1); }
.ef-rotate	{ transform: rotateY(0deg); -webkit-transform: rotateY(0deg); }
.rotate		{ transform: rotateY(360deg); -webkit-transform: rotateY(360deg); }

/*----------------------
	Customize
--------------------- */
/*
body { background: #4f6f86 url(bg_4f6f86.jpg) repeat-x 0% 0%; }
section { background-color: #fff; }
*/
html { scroll-behavior: smooth; }

body	{
	color: #444;
	font-size: clamp(.9rem, 2vw, 1.2rem);
	font-family: sans-serif;
	background:rgba(255,255,255,1.0) url(bg_wave.svg) repeat-y 50% 50%;
	background-size: clamp(300px, 200vh, 1920px);
	background-size: clamp(600px, 100vw, 2880px);
}

a	{ text-decoration: none; }
/*
a, a:link	{ color:#36c; text-decoration:none; }
a:visited	{ color:#36c; text-decoration:none; }
a:active	{ color:#93c; text-decoration:none; }
a:hover		{ color:#93c; text-decoration:underline; }
*/

input, button, textarea, select	{ max-width: 100%; }

/* Form */
input,
button,
select	{ height: 2em; border-width: thin; border-radius: .2rem; }

input[type="url"],
textarea	{ width: 90%; }

input.full	{ width: 90%; }
input.half	{ width: 50%; }

.submit,
.delete,
input[type="submit"] {
	height: auto;
	margin: 1em auto;
	padding: .2em 1em;
	color: #fff;
	cursor: pointer;
	border: none;
	border-radius: .2rem;
	background-color: #06c;
	transition: .3s;
	-webkit-appearance: none;
}
.submit	{ display: inline-block; color: #fff !important; }
.delete	{ display: inline-block; color: #fff !important; background-color: #c62; margin: .5em 0; }

.submit:hover,
input[type="submit"]:hover { background-color: #39f; }
.delete:hover { background-color: #f60; text-decoration: none; }

table	{ border-collapse: collapse; }

h1	{}
h2	{ padding: 10px; line-height: 1; text-align: center; color: #fff; background-color: #2a74b4; }
h2	{ color: #fff; font-size: clamp(1.2rem, 6vw, 2.0rem); }
h3	{ color: #333; font-size: clamp(1.2rem, 4vw, 2.0rem); }
h4	{ color: #333; font-size: clamp(1.0rem, 3vw, 1.4rem); }
h5	{ color: #333; font-size: clamp(1.0rem, 3vw, 1.2rem); }

h4	{ margin-bottom: 8px; padding-bottom: 4px; border-bottom: 3px solid #61AFA0; }
h4.plain	{ padding-bottom: 0; border-bottom: none; }

.lbar	{ color: #333; padding: 5px 13px; border-left: 6px solid #679c; }


/*----------------------
	共通要素
--------------------- */
/*section:not([class])	{ background-color: rgba(255,255,255,1.0); }*/
/*section:not([class]):nth-child(odd)	{ background:rgba(255,255,255,1.0) url(bg_wave.svg) no-repeat 50% 50% / cover; }*/
/*section:not([class]):nth-child(even)	{ background-color: rgba(250,250,250,1.0); }*/
/*section:not([class]):nth-child(even)	{ background-color: rgba(245,250,255,.5); }*/
section:not([class]):nth-child(odd)	{ background-color: rgba(45, 178,249,.1); }

.inner {
	max-width: 1000px;
	margin: auto;
	padding: 1em;
}
.inner > * + h2	{ margin-top: 4em; }
.inner > h2 + *	{ margin-top: 2rem; }
.inner > * + h3	{ margin-top: 3em; }
.inner > h3 + *	{ margin-top: 1rem; }
.inner > * + h4	{ margin-top: 2em; }
.inner > h4 + *	{ margin-top: 1rem; }
.inner > * + h5	{ margin-top: 2em; }
.inner > h5 + *	{ margin-top: 1rem; }

.sectitle	{ margin-bottom: 1em; color: #39c; font-size: 1.2em; text-align: center; }
.sectitle:before	{
	content: '';
	display: block;
	margin: 0 auto .5em;
	height: 2em;
	background: url(yugakukan.png) no-repeat 50% 50% / contain;
}

.title	{ text-align: center; color: #222; font-size: 1.2em; font-weight: bolder; }

/*
.more a { font-size: 1.2em; padding: 1rem; }
*/
.more	{ max-width: 280px; margin: 2rem auto; text-align: center; }
.more a { display: inline-block; padding: .5rem 2rem; }
.more a { color: #fff; background-color: #36d; border-radius: 3em; transition: .2s; }
.more a:hover { background-color: #039; text-decoration: none; }

/*----------------------
	Grid
----------------------*/
.grid	{
	margin: 0;
	padding: 0;
	display: grid;
	grid-gap: 1.5rem;
	align-items: stretch;
}
.grid		{ grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.grid.x2	{ grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.grid.x4	{ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.grid .img	{ text-align: center; }
.grid h3:after	{
	content: '';
	display: block;
	margin: .5em auto 0;
	height: 3px;
	border-radius: 1em;
	background-color: #61AFA0;
}
.grid > *	{
	list-style-type: none;
	position: relative;
	padding: 1rem;
	background-color: rgba(255,255,255,1);
	border-radius: .3em;
	box-shadow: 0 0 12px rgba(0,0,0,.1);
}
.grid.plain > *	{ padding: 0; background: none; box-shadow: none; }

.none	{
	padding: 0 !important;
	background: none !important;
	box-shadow: none !important;
}

/*----------------------
	Shoot Gallery
----------------------*/
.shoot	{}
.shoot .date	{ display: inline-block; color: #678; font-size: .9em; }
.shoot .date:before	{ margin-right: .4em; font-family: fontawesome; content: '\f073'; }
.shoot .date	{ margin-right: 1em; }
.shoot .user	{ display: inline-block; color: #678; font-size: .9em; }
.shoot .user:before	{ margin-right: .4em; font-family: fontawesome; content: '\f007'; }
.shoot .title	{ display: block; text-align: inherit; }

/*----------------------
	Flexbox
----------------------*/
.flex	{
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	grid-gap: 2rem;
}
.flex > *	{ min-width: 320px; }
.flex.vc	{ align-items: center; }
.flex.rvs	{ flex-direction: row-reverse; }
.flex .img	{ flex: 1 0 auto; max-width: 50%; }
.flex.x2 > *	{ flex: 1 0 40%; }
.flex.x3 > *	{ flex: 1 0 30%; }

.flex+.flex,
.flex+.grid,
.grid+.flex,
.grid+.grid	{ margin-top: 1.5rem; }

.shadow	{ border-radius: .3em; box-shadow: 0 0 12px rgba(0,0,0,.1); }

.page_index	{}
.page_index > *	{ margin-bottom: .5em; font-size: 1.1em; }
.page_index > *:before	{
	content: '\f138';
	margin: 0 .5em;
	font-family: fontawesome;
	color: #69c;
	opacity: .5;
}
.page_index ul	{ font-size: .9em; }

.mbo	{ display: initial; }
.pco	{ display: none; }

.b	{ font-weight: bold; }
.bb	{ font-weight: bold; color: #000; font-size:1.2em; }

.xs	{ font-size: .6rem; }
.s	{ font-size: .8rem; }
.m	{ font-size: 1rem; }
.lg	{ font-size: clamp(1.2rem, 3vw, 1.4rem); }
.xl	{ font-size: 1.5rem; }

.l	{ text-align: left;  }
.r	{ text-align: right; }
.c	{ text-align: center; }
.vt	{ vertical-align: top; }

.caution	{ color:#c00; }
.red		{ color:#e00; }

.dummy		{ color: #fff; background-color:#e00; }

/* アイコン付加 */
a[href$=".pdf"]:after	{ content: '\f1c1'; font-family: fontAwesome; margin-left: .5em; opacity: .7; }
a[href$=".docx"]:after,
a[href$=".doc"]:after	{ content: '\f1c2'; font-family: fontAwesome; margin-left: .5em; opacity: .7; }
a[href$=".xlsx"]:after,
a[href$=".xls"]:after	{ content: '\f1c3'; font-family: fontAwesome; margin-left: .5em; opacity: .7; }
a[href$=".zip"]:after	{ content: '\f1c6'; font-family: fontAwesome; margin-left: .5em; opacity: .7; }
a[href^="http"]:after	{ content: '\f08e'; font-family: fontAwesome; margin-left: .5em; opacity: .7; }
a[href^="mailto:"]:after{ content: '\f0e0'; font-family: fontAwesome; margin-left: .5em; opacity: .7; }
/* No Icon */
.no_icon:after {
	content: '' !important;
	margin-left: 0 !important;
}
/* use this class to make sure that images won't get iconized */
.imageLink {
	padding-right: 0px !important;
	background: none !important;
}

/*----------------------
レスポンシブ対応（横スクロール）
<div class="scroll-table">
	<table>〜</table>
</div>
----------------------*/
.scroll-table {
	overflow: auto;
	white-space: nowrap;
}

/*--------*/
table.solid		{}
table.solid th,
table.solid td	{ padding: .5em .8em; border: 1px solid rgba(0, 0, 0, .2); }
table.solid th	{ background-color: rgba(128, 128, 128, .1); color:#333; }
table.solid td	{ background-color: rgba(255, 255, 255, .5); overflow-wrap: break-word; }
table.solid .ng	{ color: #666; text-decoration: line-through; background-color: #f8f8f8; }
table.solid .d	{ background-color:#f0f8ff; }
table.solid .e	{ background-color:#d0d8df; }
table.solid ul,
table.solid ol	{ margin: 0; padding-left: 1.5em; }
/*--------
table.solid		{ margin:1em 0; font-family:Arial; border-collapse:collapse; border:1px solid #abc; }
table.solid tr	{ line-height:1.3; }
table.solid th	{ padding:0.6em 0.6em; vertical-align:top; color:#333; border:1px solid #abc; background-color:#eee; }
table.solid td	{ padding:0.6em 0.6em; vertical-align:top; border-right:1px solid #abc; border-bottom:1px solid #abc; }
table.solid .ng	{ color:#666; text-decoration:line-through; background-color:#f8f8f8; }
table.solid .ec	{ white-space:nowrap; text-align:center; background-color:#f0f0f0; }
table.solid .dc	{ white-space:nowrap; text-align:center; background-color:#ddd; }
table.solid .e	{ white-space:nowrap; background-color:#cde; color:#000; }
table.solid .d	{ white-space:nowrap; background-color:#eee; }
table.solid .s	{ font-size:0.8em; vertical-align:middle; }
*/

/*----------------------
	Photo Box
----------------------*/
.phbox	{
	position: relative;
	padding: 1rem;
	background-color: rgba(255,255,255,1);
	border-radius: .3em;
	box-shadow: 0 0 12px rgba(0,0,0,.1);
}
.phbox.plain{ background: none; box-shadow: none; }
.phbox.fr	{ margin: 1rem; }
.phbox.fl	{ margin: 1rem; }


/*----------------------
	SNS Icon
----------------------*/
.sns { display: flex; justify-content: center; grid-gap: 1rem; }
.sns a	{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 55px; height: 55px;
	font-size: 36px;
	color: #fff;
	background-color: rgba(0,0,0,.2);
	border-radius: 50px;
	transition: .2s;
}
.sns a:hover	{ transform: scale(1.2); text-decoration: none; }
.sns i	{ display: none; }
.sns .instagram	{ background-image: url(gradient-768x768.jpg); background-size: cover; }
.sns .facebook	{ background-color: #1977f1; }
.sns .youtube	{ background-color: #f00; }
.sns .twitter	{ background-color: #1DA1F2; }
.sns .envelope	{ background-color: #6c9; }
.sns .website	{ background-color: #f90; }
.sns .website2 	{ background-color: #f60; }

.sns .instagram:before	{ content: '\f16d'; font-family: fontAwesome; }
.sns .facebook:before	{ content: '\f09a'; font-family: fontAwesome; }
.sns .youtube:before	{ content: '\f16a'; font-family: fontAwesome; }
.sns .twitter:before	{ content: '\f099'; font-family: fontAwesome; }


/*----------------------
YouTube Link
----------------------*/
.ytlink a	{ position: relative; }
.ytlink a	{ display: block; }
.ytlink a:after	{ position: absolute; top: 0; display: block; width: 100%; height: 100%; }
.ytlink a:after	{ content: ''; background: url(ico_youtube.svg) no-repeat 50% 50%; background-size: clamp(1em, 12vw, 80px); }


/*----------------------
旧
----------------------*/
.cbox	{ height:100px; margin-bottom:20px; padding:9px; border:1px solid #ccc; }
.cbox span	{ font-size:0.8em; }

.bltitle	{ color: #039; font-weight: bold; }
.bmtitle	{ color: #039; font-weight: bold; }
.bstitle	{ color: #039; font-weight: bold; }

.topimage	{ clear:both; text-align:center; }
.top_msg	{ margin:0; padding:10px 20px; background:#ffe url(bg_main.gif) no-repeat center bottom; }
.top_msg h2	{ padding:0; color:#600; background-color:transparent; }

.information{ clear:both; height:200px; margin:20px 0; border:1px solid #ccc; background-color:#f8f8f8; }

.banner		{ clear:both; height:140px; margin:0; text-align:center; border:1px solid #ccc; background-color:#f8f8f8; }

.gbox		{ margin:0; padding:8px; text-align:center; border:1px solid #ccc; background-color:#f8f8f8; }

.link		{ padding: 4px 0px 4px 30px; background: url(btn_arrow_r.gif) no-repeat 0% 50%; }

.clear		{ clear:both; }

.arrow	{ padding-left:20px; background:transparent url(./arrow.gif) no-repeat 0% 50%; }
.pdf	{ padding-left:20px; padding-bottom:3px; background:transparent url(./pdf.gif) no-repeat left 0; }
.pdfb	{ padding-right:20px; padding-bottom:3px; background:transparent url(./pdf.gif) no-repeat right 0; }

.date,
.url	{ color:#090; font-weight: normal; }

/*----画像サムネイル表示----*/
.phbox_r, .phbox_nr,
.phbox_l, .phbox_nl,
.phbox_c, .phbox_nc	{ padding:4px; text-align:center; color:#666; font-size:0.8em; line-height:1.6; }

.phbox_r, .phbox_nr { float:right; margin:6px; }
.phbox_l, .phbox_nl	{ float:left;  margin:6px; }
.phbox_c, .phbox_nc	{ margin:20px 0; }

.phbox_r, .phbox_l, .phbox_c	{ background-color:#fff; border:3px solid #ddd; }

.phbox_r  img, .phbox_l  img, .phbox_c  img	{ border:0px solid #ccc; }
.phbox_nr img, .phbox_nl img, .phbox_nc img	{ border:0px solid #ccc; }








/*----------------------
Tab Button & Box
----------------------*/
.tabBtn	{ display: none; }
.tabBox { margin-top: 1em; }
.tabBox .tab	{ display: none; border-top: 3px solid #ccc; }
.tabBox #a_all	{ display: block; }	/* すべて（初期表示） */
.tabBox #a_all	{ border-color: #e1963b; }	/* すべて */
.tabBox #a_local{ border-color: #9c6; }	/* 企業・製品紹介 */
.tabBox #e_info	{ border-color: #4ca; }	/* イベント・セミナー情報 */
.tabBox #f_info	{ border-color: #39c; }	/* 補助金・公募情報 */
.tabBox #g_info	{ border-color: #405cc8; }	/* 事業化支援事例 */
.tabBox #z_etc	{ border-color: #914d9c; }	/* その他 */
/*----------------------
Information CGI
----------------------*/
.info hr	{ height: 2px; background-color: #abc; border: none; }
.info .oview	{ margin: 1rem; max-height: 9.8em; overflow: hidden; font-size: 1rem; }
/*.info .oview	{ margin: 1rem; font-size: 1rem; }*/
.info .lead	{ display: block; font-weight: bold; }
.info .text	{ font-size: .9em; }
/*.info .text	{ display: block; max-height: 4.8em; overflow: hidden; font-size: .9em; }*/
.info .text	{ display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.info .cmmt	{ margin-top: 8px; padding: 4px 12px; border-radius: .3em; color: #205c60; background-color: #faf4d3; }
.info .cmmt:before	{ margin-right: .4em; font-family: fontawesome; content: '\f075'; }
.info .ctg	{ display: inline-block; margin-right: .6em; color: #678; font-size: .9em; }
.info .ctg:before	{ margin-right: .4em; font-family: fontawesome; content: '\f114'; }
.info .date	{ display: inline-block; margin-right: .6em; color: #678; font-size: .9em; }
.info .date:before	{ margin-right: .4em; font-family: fontawesome; content: '\f073'; }
.info .hname{ display: inline-block; margin-right: .6em; color: #678; font-size: .9em; }
.info .hname:before	{ margin-right: .4em; font-family: fontawesome; content: '\f007'; }
.info .thumb	{ position: relative; height: 180px; background: #ace url(base16x9.png) no-repeat 50% 50% / cover; }
.info .thumb	{ border-radius: .3em .3em 0 0; }
.info .thumb.a_local	{ background-image: url(base16x9_a_local.jpg); }	/* 企業・製品紹介 */
.info .thumb.e_info		{ background-image: url(base16x9_e_info.jpg); }	/* イベント・セミナー情報 */
.info .thumb.f_info		{ background-image: url(base16x9_f_info.jpg); }	/* 補助金・公募情報 */
.info .thumb.g_info		{ background-image: url(base16x9_g_info.jpg); }	/* 事業化支援事例 */
/*.info .thumb.z_etc	{ background-image: url(base16x9_z_etc.jpg); }	/* その他 */

.info .thumb:after {
	content: '';
	position: absolute;
	bottom: 0; left: 0;
	width: 100%;
	height: 2rem;
	background: linear-gradient(0deg,rgba(0,0,0,.1) 0%,rgba(0,0,0,0) 100%);
	pointer-events: none;
	z-index: 1;
}
/*----------------------
Information CGI List
----------------------*/
.info.list		{ padding-top: 0; }
.info.list a	{ display: block; color: inherit; text-decoration: none; }
.info.list hr	{ height: 3px; background-color: #696; border: none; }
.info.list ul	{ margin: 2em auto 0; padding: 0; }
.info.list ul	{ display: flex; justify-content: space-around; flex-wrap: wrap; grid-gap: 1em; }
.info.list li	{
	flex: 1 1 30%;
	min-width: 300px;
	background-color: rgba(255,255,255,1);
	border-radius: .3em;
	box-shadow: 0 0 12px rgba(0,0,0,.1);
	list-style-type: none;
	transition: .2s;
}
.info.list li:hover	{ box-shadow: 0 0 18px rgba(0,0,0,.3); }
.info.list li:hover	{ box-shadow: 0 0 0 6px #6cf; }

.info.list li.draf0	{ background-color: #fcc3; box-shadow: 0 0 0 6px #f33; }	/* 下書き */
.info.list li.empty	{ padding: 0; background: none; box-shadow: none; }
.info.list h3	{ margin: 0; padding: 0; font-size: 1.1em; text-align: left; border: none; }
.info.list h3+*	{ margin-top: .5rem; }
/*----------------------
Information CGI Data
----------------------*/
/*.info.data	{ max-width: 1000px; margin: auto; padding: 3em 1em; }*/
.info.data		{ padding-top: 0; }
.info.data .phbox	{ margin-top: 2em; }
.info.data .attach	{ margin-top: 2em; margin-left: 1em; list-style: circle inside; }
.info.data .cmmt	{ margin-top: 2em; padding: 1em; box-shadow: 0 0 12px rgba(0,0,0,.1); }
.info.data .cmmt:before	{ display: block; }
.info.data *+.more	{ margin-top: 3em; }

/*----------------------
Information CGI Search
----------------------*/
.hsearch	{}
.hsearch+*	{ margin-top: 3em !important; }
.hkwd	{ width: clamp(1em, 40vw, 30rem); }

/*----------------------
Information CGI Control Box
----------------------*/
.info .ctrlbox	{ margin: 1rem; display: flex; align-items: center; gap: 1em; color: #678; font-size: .9em; }
.info .ctrlbox a	{ margin: 0 !important; display: inline-block; text-decoration: none; }

.info a.addbox	{ width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; border-radius: .2em; transition: .3s; }
.info a.addbox:hover	{ color: #fff; background-color: #06c; }

/*--------*/
.pagelink	{ margin: 3em auto 1em; padding: 0; }
.pagelink	{ display: flex; justify-content: center; align-items: center; gap: .3em; }
.pagelink > *	{ display: block; min-width: 2em; line-height: 1.0; text-align: center; border-radius: .3em; box-shadow: 0 0 12px rgba(0,0,0,.1); }
.pagelink a	{ transition: .2s; }
.pagelink .blank,
.pagelink .self,
.pagelink a.plink	{ padding: .5em; text-decoration: none; background-color: #fff; }
.pagelink .blank	{ opacity: .5; }
.pagelink .self		{ font-weight: bold; }
/*.pagelink a.plink:visited	{ color:#00f; text-decoration:none; }*/
.pagelink a.plink:hover		{ color:#fff; background-color:#36c; }




/*----------*/
#search			{ float:left; margin-bottom:15px; padding:5px; border:1px solid #abc; }
#search form	{ margin:0; padding:0; }
.searchField	{ margin:0; padding:0; width:280px; height:30px; font-size:18px; border:none; }
.searchButton	{ margin:0; padding:0; vertical-align:bottom; }

/*----------------------
	Header Fixed
----------------------*/
.header		{
	background-color: #129792;
	background-color: #1862a1;
}
.header .inner	{ position: relative; padding: 0; }
.header .inner	{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.header .logo	{ padding: 2vw 1vw; }
.header .logo a	{
	display: block;
/*
*/
	aspect-ratio: 10/1;
	width: 80vw;
	max-width: 500px;
	text-indent: -9999px;
	background-image: url(logo.png);
	background-size: cover;
}
.header .inquiry a	{ display: none; }

/*----------------------
	Header Fixed
----------------------*/
.header.fixed { display: block; position: fixed; top: 0; }
.header.fixed {
	background-image: none;
	background-color: rgba(255, 255, 255, .5);
	-webkit-backdrop-filter: saturate(180%) blur(20px);
	backdrop-filter: saturate(180%) blur(20px);
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}
.header.fixed .logo a	{ max-width: 380px; background-image: url(marklogo_h.svg); }
.header.fixed .dr-open	{ background-image: url(menu-light.svg); }	/* ドロワーボタン */
.header.fixed+*	{ margin-top: 90px; }

/*----------------------
	PC Navigation
----------------------*/
.nav-pc { display: none; }
.nav-pc {
	position: relative;
	padding: .5em;
	z-index: 2;
	border: 1px solid rgba(255, 255, 255, .6);
	border-radius: 2em;
}
.nav-pc ul {
	margin: 0 auto;
	padding: 0;
	max-width: 1000px;
	display: flex;
	justify-content: space-around;
}
.nav-pc li {
	list-style-type: none;
	flex: 1;
	border-right: 1px solid rgba(255, 255, 255, .7);
}
 .nav-pc li:last-child { border-right: none; }

.nav-pc a	{ display: block; padding: .5em; text-align: center; }
.nav-pc a	{ color: #fff; }
.nav-pc a:hover	{ background-color: #e83; }
.nav-pc .fa	{ display: block; margin: .1em; font-size: 2.2em; opacity: .8; }

/*----------------------
	Drawer 共通
----------------------*/
/* ドロワーボタン */
/*
.dr_open	{
	position: absolute;
	top: 2vw; right: 2vw;
	z-index: 2;
}
*/
.dr_open	{
	display: block;
	aspect-ratio: 1/1;
	width: 15vw; max-width: 70px;
	text-indent: -9999px;
	background: url(menu@2x.png) no-repeat 50% 50% / contain;
	border-radius: 3px;
	cursor: pointer;
	transition: .2s;
}
.dr_open:hover	{ transform: scale(1.1); }
/* ドロワーコンテンツ（最前面） */
.dr_content {
	overflow: auto;
	position: fixed;
	width: 100%; height: 100%;
	background-color: #498;
	background-color: #347bc2;
	transition: .3s ease-in-out;
	z-index: 9999;
/*	top: 0; left: 0; transform: translateX(-105%);	/* 左に隠しておく */
/*	top: 0; right: 0; transform: translateX(105%);	/* 右に隠しておく */
}
/* 閉じる用の薄黒カバー（全体） */
.dr_close {
	position: fixed;
	top: 0; left: 0;
	width: 100%; height: 100%;
	background-color: black;
	transition: .3s ease-in-out;
	z-index: 99;
	opacity: 0;
}
.dr_close	{ display: none; }	/* 初期は非表示 */
.dr_unshown	{ display: none; }	/* チェックボックス等は非表示に */

/*----------------------
	NavigationDrawer
----------------------*/
#nav-drawer {}
#nav-drawer .dr_open	{}
#nav-drawer .dr_content {
	width: 80%;
	max-width: 400px;
	top: 0; right: 0; transform: translateX(105%);	/* 右に隠しておく */
}
#nav-drawer .dr_content label {
	display: block;
	padding: 1em;
	color: #fff;
	cursor: pointer;
}
#nav-drawer .dr_content .fa { margin-right: .5em; opacity: .5; }
/* 下階層 */
#nav-drawer .dr_content ul	{ margin: 0; padding: 0; display: block; }
#nav-drawer .dr_content ul	{ background-color: rgba(0, 0, 0, .1); border-bottom: thin solid rgba(255,255,255,.3); }
#nav-drawer .dr_content li	{ padding-left: 2em; line-height: 1.0; list-style-type: none; }
#nav-drawer .dr_content li	{ height: 0; overflow: hidden; transition: .4s; }
#acc_intro:checked ~ #sub_intro li,
#acc_shoot:checked ~ #sub_shoot li,
#acc_theme:checked ~ #sub_theme li,
#acc_report:checked ~ #sub_report li,
#acc_:checked ~ #sub_ li	{ height: 3em; opacity: 1; }
#nav-drawer .dr_content .accordion	{ display: none; }
#nav-drawer .dr_content a	{ display: block; padding: 1em; color: #fff; }
#nav-drawer .dr_content .nolink	{ display: block; margin: 0; padding: 1em; color: #fff8; }
.acc_none	{ border-bottom: thin solid rgba(255,255,255,.3); }
/**/
#nav-input:checked ~ .dr_close { display: block; opacity: .7; }	/* チェック→カバー表示 */
#nav-input:checked ~ .dr_content {
	transform: translateX(0%);
	box-shadow: -6px 0 25px rgba(0,0,0,.5);
}	/* チェック→メニュー表示（スライド） */

#nav-drawer .dr_content .sns	{ position: initial; display: flex; background-color: transparent; }
#nav-drawer .dr_content .sns li	{ padding: 1rem 0; line-height: initial; }
#nav-drawer .dr_content .sns li	{ height: auto; }
#nav-drawer .dr_content .sns a	{ display: flex; padding: 0; }

/*----------------------
	Language Drawer
----------------------*/
#lang-drawer {}
#lang-drawer .dr_open	{ margin-right: 12vw; background-image: url(parts/lang@2x.png); }
#lang-drawer .dr_content {
	height: auto;
	max-height: 480px;
	top: 0; left: 0; transform: translateY(-105%);	/* 上に隠しておく */
}
#lang-drawer .dr_content ul	{ margin: 0; padding: 0; display: flex; justify-content: space-around; }
#lang-drawer .dr_content li	{ flex: 1; border-left: thin solid rgba(255,255,255,.3); list-style-type: none; }
#lang-drawer .dr_content li:first-child	{ border-left: none; }
#lang-drawer .dr_content a	{ display: block; padding: 1em; color: #fff; font-size: 1em; text-align: center; }
#lang-input:checked ~ .dr_close { display: block; opacity: .7; }	/* チェック→カバー表示 */
#lang-input:checked ~ .dr_content {
	transform: translateY(0%);
	box-shadow: -6px 0 25px rgba(0,0,0,.5);
}	/* チェック→メニュー表示（スライド） */

/*----------------------
	Find Drawer
----------------------*/
#find-drawer {}
#find-drawer .dr_open	{ margin-right: 24vw; background-image: url(parts/find@2x.png); }
#find-drawer .dr_content	{
	height: auto;
	max-height: 480px;
	top: 0; left: 0; transform: translateY(-105%);	/* 上に隠しておく */
}
#find-drawer .dr_content	{ padding: 2em 1em; color: #fff; font-size: 1em; text-align: center; }
#find-input:checked ~ .dr_close { display: block; opacity: .7; }	/* チェック→カバー表示 */
#find-input:checked ~ .dr_content {
	transform: translateY(0%);
	box-shadow: -6px 0 25px rgba(0,0,0,.5);
}	/* チェック→メニュー表示（スライド） */


#menulist,
#menulist_top {
	width: 940px;
	height: 40px;
	margin: 1px auto;
	padding: 0;
	background: #666 url(menu.gif) repeat-x 0% 0%;
}

/* Basic code - don't modify */
#nav { display: block; margin: 0; padding: 0; position: relative; }
#nav li { display: block; list-style: none; margin: 0; padding: 0; float: left; position: relative; }
#nav a { display: block; }
#nav ul { display: none; position: absolute; left: 0; margin: 0; padding: 0; }
#nav ul li { float: none; }
#nav ul ul { top: 0; }

/* Essentials - configure this */
#nav a			{ padding:14px 0 0 10px; color:#ccc; font-size:14px; line-height:1.0; text-align:center; border-right:1px solid #666; }
#nav a:hover	{ color:#fff; text-decoration:none; }
#nav .navi01 a			{ width:139px; height:26px; text-indent:0; background:url(menu.gif) repeat-x 0px 0px; }
#nav .navi02 a			{ width:149px; height:26px; text-indent:0; background:url(menu.gif) repeat-x 0px 0px; }
#nav .navi03 a			{ width:149px; height:26px; text-indent:0; background:url(menu.gif) repeat-x 0px 0px; }
#nav .navi04 a			{ width:149px; height:26px; text-indent:0; background:url(menu.gif) repeat-x 0px 0px; }
#nav .navi05 a			{ width:149px; height:26px; text-indent:0; background:url(menu.gif) repeat-x 0px 0px; }
#nav .navi06 a			{ width:139px; height:26px; text-indent:0; background:url(menu.gif) repeat-x 0px 0px; }

#nav .navi01 a:hover	{ background-position: 0px -40px; }
#nav .navi02 a:hover	{ background-position: 0px -40px; }
#nav .navi03 a:hover	{ background-position: 0px -40px; }
#nav .navi04 a:hover	{ background-position: 0px -40px; }
#nav .navi05 a:hover	{ background-position: 0px -40px; }
#nav .navi06 a:hover	{ background-position: 0px -40px; }

#nav .navi01 li a,
#nav .navi02 li a,
#nav .navi03 li a,
#nav .navi04 li a,
#nav .navi05 li a,
#nav .navi06 li a	{
	width:139px; height:13px; padding:10px;
	color:#fff; font-size:13px; line-height:1.0; text-indent:0px; text-align:left;
	background-image:none; background-color: #000;
	border:none; border-top:1px solid #fff;
	opacity: 0.7; filter: alpha(opacity=70); zoom:1;
}

/* Everything else is theming */
#nav ul { top: 40px; }
#nav ul a {  }
#nav ul a:hover { text-decoration:none; background-color: #960; }




#pankz	{ min-height: auto; color: #666; font-size: .8em; background-color: #c9dcedcc; }
#pankz .inner	{ padding: 1em; text-indent: 1.5em; }


/*----------------------
	Main Image
----------------------*/
/*
#main	{ background-color: #3971e0; }
#main	{ background-color: #19caad; }
#main	{ background-color: #5bd7c3; }
*/
#main	{ position: relative; background-color: transparent; }
/*#main::before	{ position: absolute; width: 100%; height: 100%; content: ''; background-color: #19caad; z-index: -2; }*/
#main::before	{ position: absolute; width: 100%; height: 100%; content: ''; background-color: #1496de; z-index: -2; }
#main .inner	{ padding: 1em; }
#main img	{ display: block; margin: auto; width: 100%; max-width: 750px; }


/*----------------------
	Footer
----------------------*/
#footer	{}

#footer .aboutus {
	font-size: .8em;
	color: #eee;
	background-color: #57b9a8;
	background-color: #2e85c9;
}
#footer .aboutus a	{ color: #fff; }
#footer .aboutus .inner	{ padding: 0; }
#footer .aboutus .inner	{ display: flex; flex-wrap: wrap; }
/*
#footer .aboutus .picture	{ flex: 1 0 30%; padding: 1%; display: flex; align-items: center; background-color: #568; }
#footer .aboutus .picture img	{ max-height: 280px; }
*/
#footer .aboutus .picture	{ flex: 1 0 30%; background: #568 url(../images/itc.jpg) no-repeat 50% 50% / cover; }
#footer .aboutus .picture img	{ display: none; }
#footer .aboutus .profile span	{ display: inline-block; }
#footer .aboutus .profile	{ flex: 1 0 auto; max-width: 94%; padding: 3%; }
#footer .aboutus .profile .qr	{ display: none; }
#footer .aboutus .profile .qr	{ float: right; max-width: 120px; background-color: #568; }
#footer .aboutus .profile .qr p	{ margin: 0 0 .25em; line-height: 1.25; text-align: center; }
#footer .aboutus .access	{ flex: 1 0 30%; }
#footer .aboutus .access iframe	{ min-height: 280px; }
/*
#footer .aboutus .profile td { padding: .5em; line-height: 1.8; background-color: rgba(255,255,255,.8); border: 1px solid #bcd; }
#footer .aboutus .profile td:nth-child(1)	{ text-align: center; background-color: #e8eaec; }
#footer .aboutus .profile dt {}
#footer .aboutus .profile dd { margin-top: -1.6em; margin-bottom: 12px; padding-left: 80px; }
*/
#footer .cprt	{
	line-height: 60px;
	color: #def;
	font-size: .8em;
	font-family: arial;
	text-align: center;
	background-color: #345;	/*#4f6f86;*/
	background-color: #129792;
	background-color: #1862a1;
}
#footer .cprt a	{ color: #fff; }








/* for SmartPhone Landscape (横) */
@media screen and (min-width:480px) { 
/*
	#topics .ttle	{ font-size: 1.2em; }
*/
	.bltitle	{ font-size: 2.4em; }
	.bmtitle	{ font-size: 1.2em; }
	.bstitle	{ font-size: 1.0em; }

	.pagetitle h1	{ font-size: 2.4rem; }

	.dr_open		{ top: 3.5vw; }

	#footer .sitemap	{ padding: 2em 1em; }
	#footer .sitemap ul	ul { display: block; }
	#footer .sitemap ul ul li	{ margin-right: 0; }
}


/* for Tablet */
@media screen and (min-width:768px) { /* and ( max-width:1024px) { */

	h2	{ padding: 30px 20px; }

	section:not([class])	{ min-height: 320px; }

	.fl	{ float: left; }
	.fr	{ float: right; }
	.clr{ clear: both; }

	.inner { padding: 2em 1em; }

	.sectitle	{ font-size: 1.8em; }

	.grid h3:after	{
		height: 6px;
		background: url(color-2174065_1280.png) no-repeat 50% 50% / cover;
		background-attachment: fixed;
	}

	.scroll-table { overflow: initial; white-space: normal; }

	.mbo	{ display: none; }
	.pco	{ display: initial; }

	.ctrl	{ display: block; }

	.pagetitle h1	{ font-size: 3rem; }

	/* インフォメーション */
	.tabBtn	{ display: flex; align-items: flex-end; grid-gap: 1px; margin: 2em 1em 0 !important; }
	.tabBtn li a {
		position: relative;
		display: block;
		padding: .3em 1em;
		color: #fff;
		line-height: 2em;
		text-align: center;
		text-decoration: none;
	}
	.tabBtn li a.on	{ padding-top: .6em; }
	.tabBtn li.a_all a	{ background-color: #e1963b; }	/* すべて */
	.tabBtn li.a_local a{ background-color: #9c6; }	/* 企業・製品紹介 */
	.tabBtn li.e_info a	{ background-color: #4ca; }	/* イベント・セミナー情報 */
	.tabBtn li.f_info a	{ background-color: #39c; }	/* 補助金・公募情報 */
	.tabBtn li.g_info a	{ background-color: #405cc8; }	/* 事業化支援事例 */
	.tabBtn li.z_etc a	{ background-color: #914d9c; }	/* その他 */
/*
	.tabBtn li a:hover{ background: url(../equipment/images/bg_01on.png) no-repeat right; }
*/
	.tabBox { margin-top: 0; }
/*
	#header { min-height: 90px; }
	#header .logo	{ top: 50px; }
	#header .sns	{ display: flex; }
	#header .sns	{ top: 70px; right: 5rem; }
	#header .sns a	{ width: 40px; height: 40px; }
	.dr_open		{ top: 60px; }
	#nav-drawer .dr_content .sns	{ display: none; }
	#header { height: 200px; }
*/
	#header .logo	{ padding: 1em 0; }
	.dr_open		{ top: 50px; right: 10px; }

	#footer .aboutus .profile { max-width: 96%; padding: 2%; }
	#footer .sitemap	{ justify-content: space-around; }
}


/* for PC */
@media screen and (min-width:1000px) {
/*
	#header .logo a	{ margin: auto; }
	#header .nav-pc	{ display: block; }
	.pagetitle h1	{ padding-top: 50px; padding-bottom: 110px; }
*/
	.inner { padding: 3em 1em; }

	#footer .sitemap	{ padding: 3em 1em; justify-content: space-around; }
}
