/*
	Theme Name: timebasedmedia200321
	Author: Ryosuke Imamura
	*/




/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
html {
  font-family: sans-serif; /* 1 */
  line-height:1.8em; /* 2 */
  -ms-text-size-adjust: 100%; /* 3 */
  -webkit-text-size-adjust: 100%; /* 3 */
}
/* Sections
   ========================================================================== */
body {
  margin: 0;
}
/**
 * Add the correct display in IE 9-.
 */
article,
aside,
footer,
header,
nav,
section {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
/* Grouping content
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in IE.
 */

figcaption,
figure,
main { /* 1 */
  display: block;
}

/**
 * Add the correct margin in IE 8.
 */

figure {
  margin: 1em 40px;
}

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}
/* Text-level semantics
   ========================================================================== */
/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */
a {
  background-color: transparent; /* 1 */
  -webkit-text-decoration-skip: objects; /* 2 */
}
/**
 * Remove the outline on focused links when they are also active or hovered
 * in all browsers (opinionated).
 */
a:active,
a:hover {
  outline-width: 0;
}
/**
 * 1. Remove the bottom border in Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */

b,
strong {
  font-weight: inherit;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font style in Android 4.3-.
 */

dfn {
  font-style: italic;
}
mark {
  background-color: #ff0;
  color: #000;
}
small {
  font-size: 80%;
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 */

audio,
video {
  display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */

audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Remove the border on images inside links in IE 10-.
 */

img {
  border-style: none;
}

/**
 * Hide the overflow in IE.
 */

svg:not(:root) {
  overflow: hidden;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */

button,
html [type="button"], /* 1 */
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; /* 2 */
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Change the border, margin, and padding in all browsers (opinionated).
 */

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  display: inline-block; /* 1 */
  vertical-align: baseline; /* 2 */
}

/**
 * Remove the default vertical scrollbar in IE.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */

details, /* 1 */
menu {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Scripting
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 */

canvas {
  display: inline-block;
}

/**
 * Add the correct display in IE.
 */

template {
  display: none;
}

/* Hidden
   ========================================================================== */

/**
 * Add the correct display in IE 10-.
 */

[hidden] {
  display: none;
}
/*normalize.css END*/

/*============main layer============*/
body{
	position: relative;
    color: #000;
	font-size: 15px;
	font-family:"Helvetica Neue", Arial, YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	word-wrap: break-word;
	/*background-color: #FCFCFC;*/
}
html, body{	height: 100%;}
#container{
	margin:0 auto;
	max-width: 1000px;
	position:relative;
		min-height: 100%;
		height: auto !important;
		height: 100%;
}	
.wrapper{
}


#main{
	width:100%;
	padding-bottom: 200px;
	line-height:1.9em;
}

.clearfix:before,
.clearfix:after{
  content:"";
  display: table;
}
.clearfix:after{ clear:both;}
.floatleft{float:left;}
.floatright{float:right;}
/*============General Setting============*/
a {
	color:#333;
	text-decoration:none;
	border-bottom:#00CFF0 solid 1px;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
}
p{
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
}
a:hover,a:active{color:#00CFF0;}
.clear{	display: block;clear: both;}

a img{	position:relative;
		margin-bottom:-4px;
		-webkit-transition: 0.3s;
		-moz-transition: 0.3s;
		-o-transition: 0.3s;
		-ms-transition: 0.3s;
		transition: 0.3s;
}
a img:hover{	
	-moz-opacity: 0.40;
	-khtml-opacity: 0.40;
	opacity: 0.40;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=40);
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40);
	filter:alpha(opacity=40);
}
/*============header============*/
#header{
	padding:15px 0 25px 10px;
}
#header h1{
	line-height: 1.6em;
	font-size: 20px;
	float:left;
	font-weight:normal;
}
#header h1 a{
	border:none;
	color:#000;	
	letter-spacing: 0.15em;
	font-size: 90%;
}
#header h1 a:hover{background:#00ceef;}
#header .wrapper{
	width:100%;
	position:relative;	
}
#header .contain{
		margin: 12px 0 14px 0;
}
#header p.logo{position:absolute;right:0px;bottom:-12px;}
#header p.logo img{width:120px;}
#header p.logo a{border-bottom: none;}
#header p.logo a img{margin-bottom: 0;margin-right:15px;}
/*============navigation============*/
#navi{
	height:auto;
	width:100%;
	padding:5px 0;
	border-top:#ccc 1px solid;
	border-bottom:#ccc 1px solid;
}
	#navi ul{
		width:100%;
		margin:0;
		padding:0;
		list-style: none;
	}
	#navi li{
		box-sizing: border-box;
		position:relative;
		float: left;
		margin:0;
		padding:6px 0;
		width:20%;
		height:auto;
		font-size: 13.7px;
	}
		#navi li a{
		box-sizing: border-box;
		border-bottom:rgba(255, 255, 0, 0) 2px solid;
		display: block;
		color: #555;
		text-align: center;
		text-decoration: none;
		}
		#navi li a:hover, #navi li.current-menu-item a:hover{
			color:#000;
		}
						

			#navi li a{
			  position: relative;
			}
			#navi li a:before,
			#navi li a:after{
			  position: absolute;
			  top: 2em;
			  content: "";
			  display: inline-block;
			  width: 0;
			  height: 2px; 
			  background: #00CFF0;
			  transition:0.3s ease-out;
			    -moz-transition:0.3s ease-out;
				-webkit-transition:0.3s ease-out;
				-o-transition:0.3s ease-out;
				-ms-transition:0.3s ease-out;

				transition-delay:0.3s;
				-moz-transition-delay:0.3s;
				-webkit-transition-delay:0.3s;
				-o-transition-delay:0.3s;
				-ms-transition-delay:0.3s;
			}

			#navi li a:before{
			  left: 50%;
			}

			#navi li a:after{
			  right: 50%;
			}

			#navi li a:hover:before,
			#navi li a:hover:after{
			  width: 48%;
			}

#navi li.current-menu-item a,
#navi li.current-page-ancestor a{
   font-weight:bold;
}

#navi li.current-menu-item a:before,
#navi li.current-menu-item a:after,
#navi li.current-page-ancestor a:before,
#navi li.current-page-ancestor a:after,
body.single-post #navi li.word-navi a:before,
body.single-post #navi li.word-navi a:after{
    width: 48%;
}

/*IE 8 */
.ie8 #navi li a{border-bottom:#fff solid 1px;}


/*=========sub menu===========*/

#navi li ul.sub-menu {
	position:absolute;
	opacity: 0;
	transition:all 0.1s ease-in;

}
#navi li:hover ul.sub-menu{
		  opacity: 1;
}
#navi li ul.sub-menu li{
	float:none;
	width:100%;
	z-index: 0;
	background-color: #fff;
	font-size: 90%;
	 opacity: 0;
	 background-color:#FDFDFD;
	 transition:all 0.3s ease-in;
}
#navi li ul.sub-menu li:nth-child(1){transition-delay:0.1s;}
#navi li ul.sub-menu li:nth-child(2){transition-delay:0.2s;}
#navi li ul.sub-menu li:nth-child(3){transition-delay:0.3s;}
#navi li:hover ul.sub-menu li{
	    opacity: 1;
	    z-index: 15;

}
#navi li.current-menu-item ul.sub-menu li a:before,
#navi li.current-menu-item ul.sub-menu li a:after,
#navi li.current-page-ancestor ul.sub-menu li a:before,
#navi li.current-page-ancestor ul.sub-menu li a:after,
body.single-post #navi li.word-navi ul.sub-menu li a:before,
body.single-post #navi li.word-navi ul.sub-menu li a:after{
	width:0;
}
#navi li.current-menu-item ul.sub-menu li a:hover:before,
#navi li.current-menu-item ul.sub-menu li a:hover:after,
#navi li.current-page-ancestor ul.sub-menu li a:hover:before,
#navi li.current-page-ancestor ul.sub-menu li a:hover:after,
body.single-post #navi li.word-navi ul.sub-menu li a:hover:before,
body.single-post #navi li.word-navi ul.sub-menu li a:hover:after{
			  width: 48%;
}
/*========================Main=================*/

#main .post,
#main .page{
	position:relative;
	zoom:1;
}
#main h2{
	font-size: 170%;
	line-height: 1.5em;
	margin:30px 0 30px 0;
	color:#333;
/*	font-weight: normal;*/
}


#main h2:first-child{margin:5px 0 30px 0;}/*最初のh2*/
#main h3{
	font-size: 16px;
	margin:35px 0 10px 0;
	padding:0;
	border:none;
}
/*印刷、日付*/
div#main div.print-date p{text-align: right;margin:20px 0 15px 0;}
div#main div.print-date span{font-size: 20px;}
div#main div.print-date a{border:none;}
div#main div.print-date span.icon-printer,
div#main div.print-date span.icon-files-empty{margin-right: 3px;}
div#main div.print-date span.print-letter{font-size: 12px;}
div#main div.print-date span.date{
	margin:0 15px 0 0;
	padding:0;
	font-size:12px;
	color:#666;
	text-indent:0;
}

.more-link{
	display:block;
	margin:10px;
}
.navigation{
	font-size:12px;
	overflow: hidden;
	margin-bottom: 40px;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
	.navigation .alignright{
		text-align: right;
	}

	.navigation a{
		display: block;
		padding: 1em;
		border: none;
	}
		.navigation a:hover{
			color:#999;
		}
			.navigation .alignright a:hover{
				border-left: 1px solid #ddd;
			}

.footer-post-meta{
	margin-top: 40px;
	text-align: right;
}
	.post-author{ padding-left: 1em; }

.page-link{
	margin: 3em 0;
}
.comment-page-link{
	margin: 0 0 3em;
}

	.page-link span,
	.comment-page-link span,
	.comment-page-link a{
		display: inline-block;
		margin-right: 3px;
		padding: 5px 8px;
		border: 1px solid #ddd;
		background: #ddd;
	}
		.page-link a span,
		.comment-page-link a{
			background: #fff;
		}
	
	.page-link a{
		border-bottom: none;
		color: #000;
	}
	
	.page-link a span:hover,
	.comment-page-link a:hover{
		background: #ffeff7;
		color: #000;
	}
/*============footer============*/
#footer{
	z-index:5;
	position:absolute;
	bottom:0;
	width:100%;
	height:150px;
	color:#000;
	border-top:#aaa 1px solid;
}
#footer-navi{
	width:100%;
	height:150px;
	position:relative;
}
div.menu-footer-menu-container{width:50%;float:left;}
ul#menu-footer-menu{
	width:50%;
	list-style:none;
	padding-left:10px;
	padding-top:10px;
}
ul#menu-footer-menu li{
	font-size:15px;
	margin-right:30px;
	letter-spacing: 0.1em;
}
#menu-footer-menu li a{border:none;}
#menu-footer-menu li a:hover{
}
#footer p.coryright{
	display:block;
	float:right;
	display:block;
	margin-top:32px;
	font-size:12px;
	line-height: 13px;
}
#footer p.coryright .large{
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13px;
	line-height: 13px;
}
/**====================table=================**/
table{
	border-collapse: collapse;
	text-align: left;
	line-height: 1.5;
}
table th {
	padding: 10px;
	font-weight: bold;
	vertical-align: top;
	border: 1px solid #ccc;
}
table td {
	padding: 10px;
	vertical-align: top;
	border: 1px solid #ccc;
}
/*=======================PAGE=======================*/

.center-box{
	box-sizing: content-box;
	width:700px;
	margin:0 auto;
}

.right-box{
	box-sizing: content-box;
	float:right;
	width:70%;
	z-index: 10;
	background-color: #fff;
}
div.center-box p,
div.right-box p{
	margin:0;
	margin-top: 20px;
}
#main p.noIndent{
	text-indent: 0;
}
#main p.Indent{
	text-indent: 1em;
}
#main p.padding20{
	padding-left: 20px;
	margin:0;
}
#main p.padding20 ~ p{margin-top: 0;}

#main article ul, #main article ol {margin:10px 0px 20px 0px;padding:0 35px;}
#main article li{font-size:96% ;line-height: 1.6em;margin-bottom:5px;}
/**=============== Page =================**/
#main .page h3, #main .search h3{

}
#main .page h4{

}
#main .page h5{

}
/**======post and page  IMAGE  ==========**/
#main .page img, #main .post img{
	display:inline;
}
div.image_wrap{	position:relative;}
div.image{	float:left;}
#main div.image p{	margin:0;}
#main div.image p img{
	margin:5px 10px 0 0;
	display:block;
}
div.image span{	font-size: 11px;}
#main div.img_caption{
	float:left;
	min-width: 200px;
	min-height: 50px;
}
#main div.img_caption ul{
	font-size: 11px;
	position:absolute;
	bottom:0;
	margin:0 0 5px 5px;
}
#main div.img_caption ul li{
	margin-bottom: 4px;
	line-height:1.6em;
}
#main div.img_caption2 ul{ 	font-size: 11px;}


.left-box{
	box-sizing: content-box;
	width:220px;
	float:left;
	padding:65px 0 0 0;
}
/*============SINGLE NEXT AND PREVIOUS============*/
.pre-next{
	margin-top:100px;
	font-size: 95%;
}
.pre-next .previous{float:left;}
.pre-next .next{float:right;}
.pre-next a {border: none;}

/*============SIDEBAR============*/

#sidebar ul{list-style:none;margin:0 0 0 7px;
}
#sidebar nav.sidebar-navi ul{
	padding:0 0 0 10px;
}
.sidebar-navi ul li:first-child{
	padding-top:10px;
}
.sidebar-navi ul li{
	position:relative;
	font-size:13px;
	padding:3px 0 8px 0;
}
.sidebar-navi ul li a{
	line-height:20px;
	display:block;
	border: none;
	text-decoration:none;
}
.sidebar-navi ul li:hover {
}


/*用語集　左カラム*/
.sidebar-navi-word{font-size: 13px;line-height: 1.3em; }
#sidebar .sidebar-navi-word ul,
#sidebar .sidebar-navi-word ul li.list-1 ul{margin-left: 16px; padding-left:0;}
#sidebar .sidebar-navi-word ul li,
#sidebar .sidebar-navi-word ul li.list-1 ul li{margin:7px 0;list-style-image:url(images/dash01.png);}
#sidebar .sidebar-navi-word a,
#sidebar .sidebar-navi-word ul li.list-1 ul li a{border-bottom:#fff solid 1px;}
.sidebar-navi-word a:hover{border-bottom:#00CFF0 solid 1px;}
/*用語集　サブメニュー*/
#sidebar .sidebar-navi-word ul.sub-menu{}

#sidebar .sidebar-navi-word ul li.list-1 a{border-bottom:#666 solid 1px;}
#sidebar .sidebar-navi-word ul li.list-1{list-style-image:none;margin-top:12px;margin-left:-15px;}
/*固定用*/
.sidefixed{
	width:220px;
	position:fixed;
	z-index:9;
	top:0px;
}
/*=========================== post-reference.php===========================*/
div.ref-center-box{width:800px;margin:0 auto;}

div.reference{
	list-style: none;
	margin:0;
}

div.reference p{
	display:table;
	float:left;
	box-sizing:border-box;
	width:253px;
	height:253px;
	border:#666 solid 1px;
	padding:0px 12px;
	margin:6px;
}
div.reference p a{
	display:table-cell;
	text-align: center;
 	vertical-align: middle;
	font-size: 100%;
	color:#333; 
	border:none;
}
div.reference p:hover a{
	color:#0DF; 
	border:none;
}
div.reference p:hover{
	background:#ffF;
		border:#0DF solid 3px; 
}
/*=========================== search.php===========================*/
.seach{width:600px;height:auto;}
.search-result{width:600px;margin:10px 0 20px 0;}
.search-result p {font-size:14px;color:#000;}
.search-result h2{font-size:16px;}
.search-result p.url a{	font-size:10px;color:#666666;}
.search-result p.url a:hover{font-size:10px;color:#0FF;}
/*===========================ページャー===========================*/
.pager{	text-align:left;	margin-bottom:30px;}
a.page-numbers, .pager .current{
	background:#fafafa;
	border:solid 1px rgba(0,0,0,0.1);
	border-radius:2px;
	padding:5px 8px;
	margin:0 1px;
	color:#000;
	text-decoration: none;
}
.pager .current{
	background:#666;
	border:solid 1px #666;
	color:rgba(255,255,255,1);
}

/*戻るボタン*/
p.gotop{
    position:fixed;
    right:20px;
    bottom: 50px;
    z-index: 99;
}
p.gotop a{
    width: 70px;
    height:70px;
    display: block;
    border:none;
    text-decoration: none;
}

::selection{background:#00ceef;}



/**/
#navToggle {
    display:none; /*通常時は非表示にしておきます*/
    position:absolute; /*bodyに対しての絶対位置指定です*/
    right:13px;
    top:18px;
    width:70px;
    height:25px;
    cursor:pointer;
    z-index: 999;

}
#navToggle div {position:relative;} /*spanの絶対位置指定の親にします*/
#navToggle span {
    display:block;
    position:absolute; /*#navToggle div に対して*/
    width:50%;
    border-bottom:solid 3px #999;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;}
#navToggle span:nth-child(1) {top:0;right:0;}
#navToggle span:nth-child(2) {top:11px;right:0;}
#navToggle span:nth-child(3) {top:22px;right:0;}
#navToggle span:nth-child(4) {top:0;font-size: 10px;left:0;border:none;color:#999;}
.openNav{}

/*モバイル*/
@media screen and (max-width: 768px) {
	#header{padding:43px 0 0 10px;}
	#header div.contain{margin:0;}
	#main{font-size:90%}
	#main .print-date a{display:none;}
	#header h1{font-size: 14px;font-weight: bold;}
	#header p.logo{right:10px;}
	#header p.logo img{width:60px;}
	ul#menu-footer-menu{width:80%;}
	#footer ul#menu-footer-menu li{font-size:11px;}
	#footer p.coryright{font-size: 10px;}
	#navi {
    position: absolute; /*bodyに対しての絶対位置*/
    top:-500px; /*通常時はビュー外*/
    background:rgba(255,255,255,.9);
    width:100%;
    padding:0;
    z-index: 99;
    -webkit-transition:.5s ease-in-out; /*transitionで動きを*/
    -moz-transition:.5s ease-in-out;
    transition:.5s ease-in-out;
	}
	#navi ul li{
		width:100%;
		float:none;
	}
	#navi ul li a{
	}
	 #navToggle{display:block;}
header.openNav #navToggle span:nth-child(1) {
    top: 11px;
    -webkit-transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
    transform:rotate(-45deg);
}
header.openNav #navToggle span:nth-child(2){
	opacity: 0;
}
header.openNav #navToggle span:nth-child(3){
    top: 11px;
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    transform:rotate(45deg);
}
header.openNav #navi{
    -moz-transform: translateY(510px);
    -webkit-transform: translateY(510px);
    transform: translateY(510px);
}

	 #container{width:100%;}
	 .left-box{display:none;}
	 .right-box, .center-box, div.ref-center-box{width:85%;margin-right:7%;display:block;}
	 div.ref-center-box div.reference p{display:block;float:none;width:auto;height:auto;border:none;}
	 div.ref-center-box div.reference p a{color:#00CFF0;display:inline;}
}

@media screen and (max-width: 400px) {
	#header h1{font-size: 14px;font-weight: bold;float:none;}
	#header p.logo{position:relative;bottom:0; /*right:10px;*/}
}