body{
	margin: 0
	padding: 0;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
}

#container{}

img{
	vertical-align: top;
}

a{
	color: #333;
	text-decoration: none;
}

a img{
	border: none;
}


#wrapper{
	display: flex;
	flex-direction: column;
}

#contents_wrap{
	order: 1;
}

#navi1{
	order: 2;
}

footer{
	order: 3;
}

.clearfix:after{
	content:"";
	display: block;
	clear: both;
}

/*	header
-------------------------------------------------*/

header{
	margin-bottom: 20px;
}

header .description{
	font-size: 12px;
}

header h1{
	margin: 5px 0 0;
	width :50%;
	max-height: 60px;
	float: left;
}
	header h1 img{
		width: auto;
		max-width: 100%;
		max-height: 100%;
	}

header .main{
	margin: 0 0 10px;
	padding: 5px;
	list-style: none;
	float: right;
	border: 1px solid #ccc;
	box-sizing: border-box;
	border-radius: 5px;
	background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.01) 1%, rgba(211,211,211,0.5) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.01) 1%,rgba(211,211,211,0.5) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.01) 1%,rgba(211,211,211,0.5) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#80d3d3d3',GradientType=0 ); /* IE6-9 */
}
	header .main li{
		display: inline;
	}

header .etc{
	clear: both;
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: right;
	font-size: 80%;
	border-right: 1px solid #333;
}
	header .etc li{
		display: inline;
		border-left: 1px solid #333;
		padding: 0 1em;
	}

header .cm{
	display: none;
}

/*	navi
-------------------------------------------------*/

nav#navi1{}

nav#navi1 h2{
	clear: both;
	padding: 5px 15px;
	font-size: 16px;
	font-weight: normal;
	border: 1px solid #ccc;
	border-radius: 5px;
		background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.01) 1%, rgba(211,211,211,0.5) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.01) 1%,rgba(211,211,211,0.5) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.01) 1%,rgba(211,211,211,0.5) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#80d3d3d3',GradientType=0 ); /* IE6-9 */
}

nav#navi1 ul.menuList{
	margin: 0 0 15px;
	padding: 0;
	width: 100%;
	font-size: 80%;
	list-style: none;
	display: flex;
	align-content: stretch;
	flex-wrap: wrap;
	line-height: 1.8;
}
nav#navi1 ul.menuList:after{
	content: "";
	clear: both;
	display: block;
}
	nav#navi1 ul.menuList li{
		margin-right: 1%;
		margin-bottom: 10px;
		display: flex;
		flex-basis: 24%;
		box-sizing: border-box;
		background-repeat: no-repeat;
		background-position: left 10px;
		text-indent: 20px;
	}
	nav#navi1 ul.noIcons li{
		background: none;
		text-indent: 0;
	}
	nav#navi1 ul.menuList li a{
		padding: 5px;
		width: 100%;
		height: 100%;
		display: block;
		border: 1px solid #ccc;
		border-radius: 5px;
		box-sizing: border-box;
	}
	
/* icons */
nav#navi1 ul li.net{ background-image:url("../images/navi_icon01.jpg"); }
nav#navi1 ul li.server{ background-image:url("../images/navi_icon02.jpg"); }
nav#navi1 ul li.freemail{ background-image:url("../images/navi_icon03.jpg"); }
nav#navi1 ul li.addmailaddress{ background-image:url("../images/navi_icon04.jpg"); }
nav#navi1 ul li.webmail{ background-image:url("../images/navi_icon05.jpg"); }
nav#navi1 ul li.viruscheck{ background-image:url("../images/navi_icon06.jpg"); }
nav#navi1 ul li.spamfilter{ background-image:url("../images/navi_icon07.jpg"); }
nav#navi1 ul li.webfilter{ background-image:url("../images/navi_icon08.jpg"); }
nav#navi1 ul li.soft_time{ background-image:url("../images/navi_icon31.jpg"); }
nav#navi1 ul li.freecalendar{ background-image:url("../images/navi_icon32.jpg"); }

nav#navi1 ul li.yahoo{ background-image:url("../images/navi_icon11.jpg"); }
nav#navi1 ul li.rakuten{ background-image:url("../images/navi_icon12.jpg"); }
nav#navi1 ul li.infoseek{ background-image:url("../images/navi_icon13.jpg"); }
nav#navi1 ul li.weather{ background-image:url("../images/navi_icon14.jpg"); }
nav#navi1 ul li.translation{ background-image:url("../images/navi_icon17.jpg"); }
nav#navi1 ul li.virussearch{ background-image:url("../images/navi_icon30.jpg"); }

nav#navi1 ul li.newspaper{ background-image:url("../images/navi_icon21.jpg"); }
nav#navi1 ul li.amazon{ background-image:url("../images/navi_icon23.jpg"); }
nav#navi1 ul li.internetTV{ background-image:url("../images/navi_icon23.jpg"); }
nav#navi1 ul li.youtube{ background-image:url("../images/navi_icon33.jpg"); }
nav#navi1 ul li.googlemap{ background-image:url("../images/navi_icon34.jpg"); }
nav#navi1 ul li.medicine{ background-image:url("../images/navi_icon28.jpg"); }
/* icons end */


nav#navi1 .cm ul{
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: center;
	font-size: 80%;
}
	nav#navi1 .cm ul li{
		margin: 0 0 15px;
		padding: 0;
	}

#footer{
	padding: 10px;
	border: 1px solid #ccc;
}

#footer ul.linkList{
	margin: 0 0 1em;
	padding: 0;
	list-style: none;
}
	#footer ul.linkList li{
		padding-right: 1em;
		display: inline-block;
		font-size: 80%;
	}

#footer p{
	margin: 0;
}

#footer small{
	font-size: 60%;
}

#bookmarkWrap{
	display: none;
}