body {
	margin: 0;
	padding: 0;
	font-family: 'Noto Sans JP', "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
	font-size:90%;
	line-height:180%;
	color: #222;
	min-width:1000px;
	-webkit-text-size-adjust: 100% ;/* iPhoneフォントサイズ拡大対策 */
	background: #F6F6F6;
}
img {
	border: none;
	vertical-align:bottom;
}
div, p, ul, ul li, h1, h2, h3, h4, h5, dl, dt, dd {
	margin: 0;
	padding: 0;
	list-style:none;
	box-sizing:border-box;
}
div, p, ul, ul li, h1, h2, h3, h4, h5, dl, dt, dd, ol, ol li, table, th, td {
	background-image:url(../image/spacer.gif); /* AndroidページのP要素の隙間対策 */
}
a:link {color:#06F; outline:none; }
a:visited {color:#06F;}
a:hover {color: #333;}
a:hover img { opacity: 0.7; transition: opacity 0.5s; filter: alpha(opacity=70); -moz-opacity: 0.7;}
a:hover,.link:hover{
	opacity:0.7;
    transition: opacity 0.5s,background-color 1s,color 1s;
	filter:alpha(opacity=70); /* For IE8 and earlier */
	-ms-filter: "alpha(opacity=70)"; /* ie 8 */
	-moz-opacity:0.7; /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.7; /* Safari 1.x */
	zoom:1;
}
#wrapper {}
#base {}

.pc {display:block;}
.sm {display:none;}

/*====================================================================================================
  HEADER
====================================================================================================*/
#header { clear: both; width: 100%; background:#fff;}
#header .h_box { margin: auto; max-width: 1000px; background-size:auto 40px }
#header .h_box::after { /*float_clear*/ display:block; clear:both; content:"";}

/*** LOGO ******************************************************************/
#header h1,
#header h1 a { width:330px; height:100px;}
#header h1 { float: left;}
#header h1 a {
	display: block;
	text-indent: -9999px;
	background: url(../image/logo.png) no-repeat left center;
	background-size: 320px auto;
}
#header .h_menu { float: right; position: relative; top: 20px; width: 200px;}
#header .login { text-indent: 2em; color:#008EDA; font-size: 90%; background: url(../../image/user.png) no-repeat left center; background-size: 15px auto;}
#header .loginstate {margin-bottom: 5px; font-size: 90%;}
#header .loginstate a {
	display: block;
	padding: 5px 10px;
	color: #fff;
	text-indent: 20px;
	text-align: center;
	text-decoration: none;
}
#header #out a,
#header #in a { background-position: 15px center !important;z-index:99;}
#header #out a{ background:#F44C59 url("../../image/log-off.png") no-repeat; background-size:15px auto; border-radius: 5px;}
#header #out a:hover{
filter: alpha(opacity=50);
-ms-filter: alpha(opacity=50);
opacity: 0.5;
}
#header #in  a{ background:#F44C59 url("../../image/log-in.png") no-repeat; background-size:15px auto; border-radius: 5px;}
#header #in a:hover{
filter: alpha(opacity=50);
-ms-filter: alpha(opacity=50);
opacity: 0.5;
}
/*** NAVIGATION ************************************************************/
#Nav { background: #00A08B;}
#Nav > ul { margin: auto; max-width:1000px; border-left:1px solid #fff;display: flex;justify-content: space-between;background-color: #fff;}
#Nav ul::after { /*float_clear*/ display:block; clear:both; content:"";}
#Nav ul li { width:100%; border-right:1px solid #fff;}
#Nav ul li a { display: block; text-decoration: none;}
#Nav ul li a {
	display: block;
	padding:15px;
	height: 50px;
	color: #fff;
	font-size: 110%;
	font-weight:500;
	text-align: center;
	text-decoration: none;
	line-height: 130%;
	box-sizing: border-box;
    background-color: #00A08B;
}
#Nav ul li a:hover,#Nav ul li.current-menu-item > a {opacity:0.85;}
#Nav ul li:hover p a { color:#FFF; background:#00846E;}
#Nav ul li ul { width:100%; background:#fff; border: none;}
#Nav ul li ul li { float:none; width:100%; border:none; border-top: rgba(0,179,155,0.85) solid 1px;}
#Nav ul li ul li p a { color:#fff !important;/*text-align:center;*/}
#Nav ul li ul li p+p { border-top:1px solid #bbb;}
#Nav ul li ul li b { display: block; padding: 5px 15px; color: #fff; background:#00A08B;}
#Nav ul li ul li.nav_b p a { color:#008EDA !important;}
#Nav ul li ul li.nav_b b { background:#008EDA !important;}
#Nav ul li ul li a { padding: 10px 15px; height: auto; font-size: 100%; text-align: left; background:#00B39B;color:#FFF; /*text-indent: 3em;*/}

#Nav ul li { position: relative; z-index:99; }
#Nav li.first{ position: relative; z-index:9; }
#Nav ul.child,#Nav ul.sub-menu{ position: absolute; top:50px; left:0; height:0; overflow: hidden; opacity: 0; transition: all 0.3s;}
#Nav ul.grandson,#Nav ul.sub-menu .sub-menu{ position: absolute; top:100%; left:0; height:0;overflow: visible; display: none; opacity: 0; transition: all 0.3s;}
#Nav ul.sub-menu .sub-menu a::before{ content: "… "; }
#Nav ul.parent li:hover ul.child,#Nav ul.parent li:hover ul.sub-menu{ display: block; height: auto; opacity: 10; }
#Nav li.first:hover ul.grandson{ display: block; height: auto; opacity: 10; overflow: visible;}
/*====================================================================================================
  CONTENT
====================================================================================================*/
#content { clear:both; }
.flex{
    display: flex;
    flex-wrap: wrap;
}

/*====================================================================================================
  FOOTER
====================================================================================================*/
#footer { clear: both;}

/* SUB and COPYRIGHT*/
#footer .f_box { margin: auto; padding:20px 0; max-width: 1000px; font-size: 90%;}
#footer .f_box::after { /*float_clear*/ display:block; clear:both; content:"";}
#footer .f_box,
#footer .f_box a { text-decoration: none; color: #606060;}
#footer .f_box p:nth-child(1) { float: left;}
#footer .f_box p:nth-child(2) { float: right;}




/*====================================================================================================
  DEVICE
====================================================================================================*/

#device {display:none; background:#FFF; padding:20px; text-align:center;}
#device::after {}
#device p {}
#device p a {
	display:block;
	padding:10px;
	color:#555;
	text-decoration:none;
	background:#EEE;
	border:1px solid #DDD;
	border-radius: 5px; /* CSS3 */
	-webkit-border-radius: 5px; /* Safari,Google Chrome */
	-moz-border-radius: 5px;/* Firefox */
}


/*====================================================================================================
  PAGE
====================================================================================================*/

#page,
#page a { display:block; width:51px; height:51px;}
#page { position: fixed; bottom:130px; right: 20px; z-index: 99;}
#page a {
	text-indent: -9999px;
	background:#444 url(../image/page_top.png) no-repeat;
}


/*====================================================================================================
  COLOR eto.. [No Touch]
====================================================================================================*/
.light-blue { color: #40A6DD;}
.blue { color: #0000FF;}
.dark-blue { color: #000099;}
.purple { color: #660099;}
.pink { color: #FF6699;}
.red { color: #FF0000;}
.orange { color: #FF6600;}
.yellow { color: #FFCC00;}
.white { color: #FFFFFF;}
.gray { color: #666666;}
.brown { color: #663300;}
.green { color: #339900;}
.italic { font-style: italic;}
.strong { font-weight: bold;}
.large { font-size: 115%; line-height: 140%;}
.small { font-size: 80%;}
.underline { text-decoration: underline;}
.line-through { text-decoration: line-through;}
.left { text-align: left;}
.center { text-align: center;}
.right { text-align: right;}