/*
Theme Name: New RoboNews (Deprecated)
Theme URI: http://dev.robonews.net/robonews_ver2/
Description: Aug 2014 New simple templete for RoboNews.
Version: 1.0
Author: AXIS
Author URI: http://axisinc.co.jp
*/

/****************************************
		1. General Setting

*****************************************/

html, body, div, span, applet, object, iframe, strong,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, legend, caption,

tbody, tfoot, thead, table, label, tr, th, td{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-style: inherit;
	font-size: 100%;
	font-family: 'Questrial', inherit;
	vertical-align: baseline;
	list-style:none;
}

html{background-color: #E9E9E9;}
body{font: 14px/22px "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Helvetica,Arial,Sans-Serif; color: #333;}

a{ color: #09B; text-decoration: none;}
a:hover{ color: #F90; }

.clear{ clear: both; line-height: 0;}

/****************************************
		3. menu

*****************************************/
#sidr{
	display: none;
}

/****************************************
		5. Post Entry

*****************************************/
.title{
	font-size:180% !important;
	line-height:30px;
	margin: 20px 0 5px !important;
	border:none !important;
	padding: 0 !important
}

.title a{
	text-decoration:none;
}

.post{
	border-bottom: 1px dotted #333;
	margin: 50px 0 0 0;
}

.post h2, .post h3, .post h4, .post h5, .post h6{margin: 30px 0 10px}
.post h2{font-size:160%; border-bottom:5px solid #ccc; padding-bottom:10px;}

.post h3{font-size:140%;}
.post h4{font-size:120%;}
.post h5{font-size:110%;}

.post p{margin: 20px 0;}
.post em{font-style: italic;}
.post code{color: #06c; font-family:'Courier New',Courier,monospace;}
.post img{
	display: block;
	margin: 0 auto;
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}
.post img.wp-smiley{border:none;padding:0;background:none;margin:0;}
.post blockquote{
	border-left:5px solid #ddd;
	background: #eee;
	padding: 10px;
	margin:20px 0;
	font-style:italic;
}
.post blockquote p{margin:0;}
.post div.wp-caption{
	margin: 20px 0;
	width: 100%;
}
.post div.wp-caption img{
	display: block;
	margin: 0 auto;
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}
.post div.wp-caption p{
	font-size:80%;
	color: #999;
	margin: 5px 0 0 0;
	text-align: center;
}
.post ul, .post ol{margin:20px 0;}
.post ul li{
	list-style: url(images/arrow_list.png);
	margin-left:20px;
}
.post ol li{list-style: decimal outside;margin-left:20px;}

.social-share-buttons {
	margin: 10px 0;
}
.social-share-buttons li {
	display: inline-block;
}


/****************************************
		6. Comments
*****************************************/
#comm ul{
	border-bottom:1px dotted #333;
}

#comm ul li{
	padding: 10px 0;
}
.comment-meta{
	font-size:85%;
	padding-top: 10px;
	color: #666;
}
.comment-body{
	font-size:100%;
	color: #666;
}

#comments{
	padding: 0;
	clear: both;
	margin-top:40px;
	border-bottom:1px dotted #333;
}

.commentlist li {
	padding:15px 0;
	position:relative;
	border-top:1px dotted #333;
	font-size: 100%;
}
.commentlist .avatar {
	background:#fff;
	border:1px solid #ddd;
	left:0;
	margin:0 16px 0 0;
	padding:3px;
	position:absolute;
	top:15px;
}
.commentlist .comment-meta a{
	color: #999;
	font-size: 100%;
	text-decoration:none;
}
.commentlist .comment-meta a:hover{color: #ccc;}

.commentlist .reply a{
	position: absolute;
	top: 15px;
	right: 0;
	padding: 2px 10px;
	background: #ddd;
	font-size: 85%;
	color: #333;
	text-decoration: none;
}
.commentlist .reply a:hover {color: #999}

/*** Comment form ***/
#respond{margin-top:70px;}
#respond h3{
	border-bottom:1px solid #ddd;
	border-top:1px solid #ddd;
	padding:10px 0 10px 10px;
}

#commentform{margin-top:20px;}
#commentform p{clear: both}
#commentform label{margin: 10px 5px;font-size:85%;}
*:first-child+html #commentform label{ position:relative\9; top: -15px\9; } /* IE7 */
#commentform input[type="text"], #commentform textarea{
	margin: 5px 0 10px;
}
#commentform input[type="text"]:focus, #commentform textarea:focus{
	border:1px solid #06c;
}
.nocomments {
	display: none;
}

/****************************************
		7.  widget
*****************************************/
#side h3{
	border-bottom: 1px dotted #000;
	margin:50px 0 10px 0;
	padding:0px 0 8px 0;
	font-size: 90%;
}

.widget-container {
	margin: 10px 0;
}
.widget-container ul li{
	padding: 0.5em 0;
	font-size: 90%;
	border-bottom: 1px dotted #CCC;
}
.widget-container ul li:first-child{
	padding-top: 0px;
}
.widget-container ul li:last-child{
	border-bottom: none;
}

div.rotatingtweet p.rtw_main{
	font-size: 90%;
}

.tagcloud a{
	color: #666;
	line-height: 1.5em;
	padding: 0.3em;
}

.tagcloud a:hover{
	color: #FFF;
	background: #09B;
}

/****************************************
		9.  footer
*****************************************/

#footer div.textwidget{
	clear: both;
	width: 100%;
	text-align: center;
}
#footer div.textwidget p{
	margin: 0;
	padding: 0;
}

#footer div.textwidget a{
	color: #FFF;
}
#footer div.textwidget a:hover{
	color: #F90;
}

@media screen and (min-width: 1280px) {

	/* 表示領域が1280px以上の場合に適用するスタイル */

	/****************************************
			2. Basic Layout

	*****************************************/
	#page{
		background-color: #E9E9E9;
		width: 100%;
	}
	#wrapper{
		width: 1150px;
		margin: 50px auto 0 auto;
		background-color: #FFF;
		border: 1px #ddd solid;
	}
	#header{

		width: 1050px;
		padding: 20px 0 0 0 ;
		margin: 50px 50px 0 50px;
		position: relative;
	}
	#robo{
		background: url("images/robo.png") no-repeat;
		width: 182px;
		height: 164px;
		position: absolute;
		top: -70px;
		right: 0px;
		text-indent: 100%;
		white-space: nowrap;
		display: block;
		overflow: hidden;
	}
	#contents{
		width: 1050px;
		margin: 0 50px;
	}
	#main{
		width:730px;
		padding:0;
		float: left;
	}
	#side{
		width: 260px;
		padding: 0px 0px 140px 60px;
		float: left;
	}
	#footer{
		clear: both;
		width: 1050px;
		color: #FFF;
		font-size: 90%;
		background-color: #555;
		padding: 50px;
		position: relative;
	}
	#footer-robo{
		background: url("images/robo_footer.png") no-repeat;
		width: 50px;
		height: 100px;
		position: absolute;
		bottom: 0px;
		right: -50px;
	}
	#copy{
		width: 1150px;
		height: 50px;
		margin: 5px auto 0 auto;
		font-size:80%;
		color: #666
	}

	/****************************************
			3.  Header, Menu
	*****************************************/

	#title{
		margin: 0 0 40px 0;
	}
	.blog_title{
		color: #D11;
		font-size:320%;
		text-decoration:none;
	}
	.blog_title:hover{
		color: #D11;
	}
	#header p{
		color:#D11;
		font-size:90%;
	}

	#menu_icon{
		display: none;
	}
	#search_icon{
		display: none;
	}
	#mobileSearch{
		display: none;
	}

	/*** Main Menu ***/
	#sidr{
		display: none;
	}
	#menu{
		float: left;
		width: 100%;
		border-left: 1px solid #CCC;
	}
	ul#nav, div.menu ul{
		font-size:90%;
	}
	ul#nav li, div.menu ul li{
		width: 25%;
		height: 32px;
		text-align: center;
		margin: 0 auto;
		float: left;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		border-right: 1px solid #CCC;

	}
	ul#nav li > a, div.menu ul li > a{
		color: #000;
		text-decoration: none;
		padding: 4px 0;
		display: block;
		border-bottom: 1px dotted #333;
	}
	ul#nav li:hover > a,
	ul#nav > li.current-menu-item > a{
		border-bottom: 2px solid #F90;

	}

	/****************************************
			4.  Main
	*****************************************/
	#main{
		clear: both;
	}
	#main h3{
		margin: 50px 0 0 0;
		font-size: 90%;
		border-bottom: 1px dotted #000;
		padding:0 0 8px 0;
	}

	.postdate{
		font-size: 175%;
	}

	/*** Blog info ***/

	.blog_info{
		font-size:85%;
		margin: 0 0 20px;
	}
	.info_tags{
		font-size:85%;
		margin: 0 0 20px;
		padding-top: 10px;
	}
	.social{
		height: 36px;
		padding: 0 0 50px;
	}

	/*** Contents ***/

	a.more-link{
		height: 40px;
		width: 140px;
		margin: 30px 0;
		background:url("images/read_more.png") no-repeat left top;
		text-indent: 100%;
		white-space: nowrap;
		display: block;
		overflow: hidden;
	}

	a.more-link:hover{
		height: 40px;
		width: 140px;
		background:url("images/read_more_focus.png") no-repeat left top;
		text-indent: 100%;
		white-space: nowrap;
		display: block;
		overflow: hidden;
	}

	/*** Bottom Navigation, Comment Navigation ***/

	div.nav-below{
		float: left;
		margin: 50px 0 50px 0;
		height: 40px;
		width: 100%;
	}

	a.more-post{
		margin: 0 auto;
		height: 40px;
		width: 190px;
		background:url("images/load_more.png") no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		display: block;
		overflow: hidden;
	}

	a.more-post:hover{
		margin: 0 auto;
		height: 40px;
		width: 190px;
		background:url("images/load_more_focus.png") no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		display: block;
		overflow: hidden;
	}

	/*** Bottom Navigation, Prev / Next ***/

	span.nav-previous{
		height: 40px;
		width: 330px;
		line-height: 42px;
		background:url("images/arrow_prev.png") no-repeat left 3px;
		border: 3px solid #09B;
		float: left;
		overflow: hidden;
	}
	span.nav-previous a{
		display: block;
		padding: 0 10px 0 30px;
		overflow: hidden;
	}
	span.nav-previous a:hover{
		background: #09B url("images/arrow_prev_focus.png") no-repeat left 3px;
		color: #FFF;
		display: block;
	}

	span.nav-next{
		height: 40px;
		width: 330px;
		line-height: 42px;
		background:url("images/arrow_next.png") no-repeat right 3px;
		border: 3px solid #09B;
		float: right;
		overflow: hidden;
	}
	span.nav-next a{
		display: block;
		padding: 0 30px 0 15px;
		overflow: hidden;
	}
	span.nav-next a:hover{
		color: #FFF;
		background: #09B url("images/arrow_next_focus.png") no-repeat right 3px;
		display: block;
	}

	/****************************************
			5. Post Entry

	*****************************************/
	/*** ①、②共通 ***/

	/****************************************
			6. Comments
	*****************************************/
	/*** ①、②共通 ***/

	/****************************************
			7.  widget
	*****************************************/
	/*** ①、②共通 ***/

	/****************************************
			8.  Form
	*****************************************/
	#search{
		height: 30px;
		width: 100%;
		text-align: left;
		border-bottom: 1px dotted #333;
	}

	/* reset webkit search input browser style */
	input {
		outline: none;
	}
	input[type=search] {
		-webkit-appearance: textfield;
		-webkit-box-sizing: content-box;
		font-family: inherit;
		font-size: 100%;
	}
	input::-webkit-search-decoration,
	input::-webkit-search-cancel-button {
		display: none; /* remove the search and cancel icon */
	}
	/* placeholder */
	input:-moz-placeholder {
		color: #999;
	}
	input::-webkit-input-placeholder {
		color: #999;
	}

	/* searchform */
	#searchform input[type=search] {
		background: url(images/search.png) no-repeat 5px center;
		padding: 0 0 0 10px;
		border: none;
		-webkit-transition: all .5s;
		-moz-transition: all .5s;
		transition: all .5s;
		width: 30px;
		height: 30px;
		color: transparent;
		cursor: pointer;
	}
	#searchform input[type=search]:hover {
		background-color: #E9E9E9;
	}
	#searchform input[type=search]:focus {
		width: 85%;
		padding: 0 0 0 15%;
		color: #000;
		background-color: #E9E9E9;
		cursor: auto;
	}
	#searchform input:-moz-placeholder {
		color: transparent;
	}
	#searchform input::-webkit-input-placeholder {
		color: transparent;
	}

	/****************************************
			9.  Footer
	*****************************************/

	/*** Bottom Navigation, BackToTop ***/

	div.top-btn{
		position: absolute;
		top: -90px;
		right: 50px;
		height: 40px;
		width: 70px;
	}

	a.to-top{
		float: right;
		height: 40px;
		width: 70px;
		background:url("images/top.png") no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		display: block;
		overflow: hidden;
	}

	a.to-top:hover{
		height: 40px;
		width: 70px;
		background:url("images/top_focus.png") no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		display: block;
		overflow: hidden;
	}

}@media screen and (min-width: 900px) and (max-width: 1279px) {

	/* 表示領域が900px〜1280pxの場合に適用するスタイル Tablet横も含む*/

	/****************************************
			2. Basic Layout

	*****************************************/
	#page{
				background-color: #E9E9E9;
				width: 100%;
	}
	#wrapper{
				width: 90%;
				margin: 50px auto 0 auto;
				background: #FFF;
				border: 1px #ddd solid;
	}
	#header{
				padding: 20px 0 0 0 ;
				margin: 50px 50px 0 50px;
				position: relative;
	}
	#robo{
				background: url("images/robo.png") no-repeat;
				width: 182px;
				height: 164px;
				position: absolute;
				top: -70px;
				right: 0px;
				text-indent: 100%;
				white-space: nowrap;
				display: block;
				overflow: hidden;
	}
	#contents{
				margin: 0 50px;
	}
	#main{
				width:70%;
				padding:0;
				float: left;
	}
	#side{
				width: 25%;
				padding: 0px 0px 140px 5%;
				float: left;
	}
	#footer{
				clear: both;
				background-color: #555;
				position: relative;
				padding: 50px;
				color: #FFF;
				font-size: 90%;
	}
	#footer-robo{
				background: url("images/robo_footer.png") no-repeat;
				width: 50px;
				height: 100px;
				position: absolute;
				bottom: 0px;
				right: -50px;
	}
	#copy{
				width: 90%;
				height: 50px;
				margin: 5px auto 0 auto;
				font-size:80%;
				color: #666
	}
	img{
				max-width: 100%;
				height: auto;
				width: auto\9; /* ie8 */
	}

	/****************************************
			3.  Header, Menu
	*****************************************/
	#title{
				margin: 0 0 40px 0;
	}
	.blog_title{
				color: #D11;
				font-size:300%;
				text-decoration:none;
	}
	.blog_title:hover{
				color: #D11;
	}
	#header p{
				color:#D11;
				font-size:90%;
	}
	#menu_icon{
		display: none;
	}
	#search_icon{
		display: none;
	}
	#mobileSearch{
		display: none;
	}

	/*** Main Menu ***/
	#sidr{
		display: none;
	}
	#menu{
		float: left;
		width: 100%;
		border-left: 1px solid #CCC;
	}
	ul#nav, div.menu ul{
		font-size:90%;
	}
	ul#nav li, div.menu ul li{
		width: 33%;
		height: 32px;
		text-align: center;
		margin: 0 auto;
		float: left;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		border-right: 1px solid #CCC;
	}
	ul#nav li > a, div.menu ul li > a{
		color: #000;
		text-decoration: none;
		padding: 4px 0;
		display: block;
		border-bottom: 1px dotted #333;
	}

	ul#nav li:hover > a,
	ul#nav > li.current-menu-item > a{
		border-bottom: 2px solid #F90;
	}

	/****************************************
			4.  Main
	*****************************************/
	#main{
		clear: both;
	}
	#main h3{
		margin: 50px 0 0 0;
		font-size: 90%;
		border-bottom: 1px dotted #000;
		padding:0 0 8px 0;
	}

	.postdate{
		font-size: 175%;
	}

	/*** Blog info ***/

	.blog_info{
				font-size:85%;
				margin: 0 0 20px;
	}
	.info_tags{
				font-size:85%;
				margin: 0 0 20px;
				padding-top: 10px;
	}
	.social{
				height: 36px;
				padding: 0 0 50px;
	}

	/*** Contents ***/
	a.more-link{
				height: 40px;
				width: 140px;
				margin: 30px 0;
				background:url("images/read_more.png") no-repeat left top;
				text-indent: 100%;
				white-space: nowrap;
				display: block;
				overflow: hidden;
	}

	a.more-link:hover{
				height: 40px;
				width: 140px;
				background:url("images/read_more_focus.png") no-repeat left top;
				text-indent: 100%;
				white-space: nowrap;
				display: block;
				overflow: hidden;
	}

	/*** Bottom Navigation, Comment Navigation ***/
	div.nav-below{
				float: left;
				margin: 50px 0;
				height: 40px;
				width: 100%;
	}
	a.more-post{
				margin: 0 auto;
				height: 40px;
				width: 190px;
				background:url("images/load_more.png") no-repeat;
				text-indent: 100%;
				white-space: nowrap;
				display: block;
				overflow: hidden;
	}
	a.more-post:hover{
				margin: 0 auto;
				height: 40px;
				width: 190px;
				background:url("images/load_more_focus.png") no-repeat;
				text-indent: 100%;
				white-space: nowrap;
				display: block;
				overflow: hidden;
	}

	/*** Bottom Navigation, Prev / Next ***/
	span.nav-previous{
				height: 40px;
				width: 48%;
				line-height: 42px;
				background:url("images/arrow_prev.png") no-repeat left 3px;
				border: 3px solid #09B;
				overflow: hidden;
				float: left;
	}
	span.nav-previous a{
				display: block;
				padding: 0 10px 0 30px;
				overflow: hidden;
	}
	span.nav-previous a:hover{
				background: #09B url("images/arrow_prev_focus.png") no-repeat left 3px;
				color: #FFF;
				display: block;
	}
	span.nav-next{
				height: 40px;
				width: 48%;
				line-height: 42px;
				background:url("images/arrow_next.png") no-repeat right 3px;
				border: 3px solid #09B;
				overflow: hidden;
				float: right;
	}
	span.nav-next a{
				display: block;
				padding: 0 30px 0 15px;
				overflow: hidden;
	}
	span.nav-next a:hover{
				color: #FFF;
				background: #09B url("images/arrow_next_focus.png") no-repeat right 3px;
				display: block;
	}

	/****************************************
			5. Post Entry

	*****************************************/
	/*** ①、②共通 ***/

	/****************************************
			6. Comments
	*****************************************/
	/*** ①、②共通 ***/

	/****************************************
			7.  widget
	*****************************************/
	/*** ①、②共通 ***/

	/****************************************
			8.  Form
	*****************************************/
	#search{
		width: 100%;
		height: 30px;
		text-align: left;
		border-bottom: 1px dotted #333;
	}

	/* reset webkit search input browser style */
	input {
		outline: none;
	}
	input[type=search] {
		border-radius: 0;
		-webkit-appearance: textfield;
		-webkit-box-sizing: content-box;
		font-family: inherit;
		font-size: 100%;
	}
	input::-webkit-search-decoration,
	input::-webkit-search-cancel-button {
		display: none; /* remove the search and cancel icon */
	}
	/* placeholder */
	input:-moz-placeholder {
		color: #999;
	}
	input::-webkit-input-placeholder {
		color: #999;
	}

	/* searchform */
	#searchform input[type=search] {
		background: url(images/search.png) no-repeat 5px center;
		padding: 0 0 0 10px;
		border: none;
		-webkit-transition: all .5s;
		-moz-transition: all .5s;
		transition: all .5s;
		width: 30px;
		height: 30px;
		color: transparent;
		cursor: pointer;
	}
	#searchform input[type=search]:hover {
		background-color: #E9E9E9;
	}
	#searchform input[type=search]:focus {
		width: 85%;
		padding: 0 0 0 15%;
		color: #000;
		background-color: #E9E9E9;
		cursor: auto;
	}
	#searchform input:-moz-placeholder {
		color: transparent;
	}
	#searchform input::-webkit-input-placeholder {
		color: transparent;
	}

	/****************************************
			9.  Footer
	*****************************************/

	/*** Bottom Navigation, BackToTop ***/

	div.top-btn{
		position: absolute;
		top: -90px;
		right: 50px;
		height: 40px;
		width: 70px;
	}

	a.to-top{
		float: right;
		height: 40px;
		width: 70px;
		background:url("images/top.png") no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		display: block;
		overflow: hidden;
	}

	a.to-top:hover{
		height: 40px;
		width: 70px;
		background:url("images/top_focus.png") no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		display: block;
		overflow: hidden;
	}

}

@media screen and (min-width: 768px) and (max-width: 899px) {

	/* TABLET縦 表示領域が768px〜899pxの場合に適用するスタイル */

	/****************************************
			2. Basic Layout

	*****************************************/
	#page{
				background-color: #E9E9E9;
				width: 100%;
	}
	#wrapper{
				width: 90%;
				margin: 44px auto 0 auto;
				background-color: #FFF;
				border: 1px #ddd solid;
	}

	#header{
				height: 90px;
				padding: 45px 0 0 0;
				margin: 0 50px;
				position: relative;
				border-bottom: 1px dotted #333;
	}
	#robo{
				background: url("images/robo_mid.png") no-repeat;
				width: 145px;
				height: 155px;
				position: absolute;
				top: -45px;
				right: 0px;
				text-indent: 100%;
				white-space: nowrap;
				display: block;
				overflow: hidden;
	}
	#contents{
				margin: 0 50px;
	}
	#main{
				width:100%;
				padding:0;
	}
	#side{

	}
	#footer{
				clear: both;
				background-color: #555;
				color: #FFF;
				font-size: 90%;
				padding: 50px;
				position: relative;
	}
	#footer-robo{
				display: none;
	}
	#copy{
				width: 90%;
				height: 44px;
				margin: 5px auto 0 auto;
				font-size:80%;
				color: #666
	}
	img{
				max-width: 100%;
				height: auto;
				width: auto\9; /* ie8 */
	}

	/****************************************
			3.  Header, Menu
	*****************************************/
	#title{
				margin: 10px 0 40px 0;
				width: 100%;
				text-align: center;
	}
	.blog_title{
				color: #D11;
				font-size:230%;
				text-decoration:none;
	}
	.blog_title:hover{
				color: #D11;
	}
	#header p{
				color:#D11;
				font-size:80%;
	}

	#menu_icon{
		display: block;
		width: 36px;
		height: 36px;
		position: absolute;
		top: 50px;
		left: 0;
	}
	#search_icon{
		display: block;
		width: 36px;
		height: 36px;
		position: absolute;
		top: 50px;
		left: 60px;
	}

	/*** Main Menu ***/
	#menu{
		display: none;
	}
	ul#mobnav li > a{
		font-size: 85%;
	}

	/****************************************
			4.  Main
	*****************************************/
	#main{
				clear: both;
	}
	#main h3{
				margin: 40px 0 0 0;
				font-size: 90%;
				border-bottom: 1px dotted #000;
				padding:0 0 8px 0;
	}
	#main h3:first-child{
				border-bottom: none;
				padding:0;
	}
	.postdate{
				font-size: 175%;
	}

	/*** Blog info ***/

	.blog_info{
				font-size:85%;
				margin: 0 0 20px;
	}
	.info_tags{
				font-size:85%;
				margin: 0 0 20px;
				padding-top: 10px;
	}
	.social{
				height: 36px;
				padding: 0 0 50px;
	}

	/*** Contents ***/
	a.more-link{
				height: 40px;
				width: 140px;
				margin: 30px 0;
				background:url("images/read_more.png") no-repeat left top;
				text-indent: 100%;
				white-space: nowrap;
				display: block;
				overflow: hidden;
	}

	a.more-link:hover{
				height: 40px;
				width: 140px;
				background:url("images/read_more_focus.png") no-repeat left top;
				text-indent: 100%;
				white-space: nowrap;
				display: block;
				overflow: hidden;
	}

	/*** Bottom Navigation, Comment Navigation ***/
	div.nav-below{
				float: left;
				margin: 50px 0;
				height: 40px;
				width: 100%;
	}
	a.more-post{
				margin: 0 auto;
				height: 40px;
				width: 190px;
				background:url("images/load_more.png") no-repeat;
				text-indent: 100%;
				white-space: nowrap;
				display: block;
				overflow: hidden;
	}
	a.more-post:hover{
				margin: 0 auto;
				height: 40px;
				width: 190px;
				background:url("images/load_more_focus.png") no-repeat;
				text-indent: 100%;
				white-space: nowrap;
				display: block;
				overflow: hidden;
	}

	/*** Bottom Navigation, Prev / Next ***/
	span.nav-previous{
				height: 40px;
				width: 48%;
				line-height: 42px;
				background:url("images/arrow_prev.png") no-repeat left 3px;
				border: 3px solid #09B;
				overflow: hidden;
				float: left;
	}
	span.nav-previous a{
				display: block;
				padding: 0 10px 0 30px;
				overflow: hidden;
	}
	span.nav-previous a:hover{
				background: #09B url("images/arrow_prev_focus.png") no-repeat left 3px;
				color: #FFF;
				display: block;
	}
	span.nav-next{
				height: 40px;
				width: 48%;
				line-height: 42px;
				background:url("images/arrow_next.png") no-repeat right 3px;
				border: 3px solid #09B;
				overflow: hidden;
				float: right;
	}
	span.nav-next a{
				display: block;
				padding: 0 30px 0 15px;
				overflow: hidden;
	}
	span.nav-next a:hover{
				color: #FFF;
				background: #09B url("images/arrow_next_focus.png") no-repeat right 3px;
				display: block;
	}

	/*** Bottom Navigation, BackToTop ***/
	div.top-btn{
				display: none;
	}

	/****************************************
			5. Post Entry

	*****************************************/
	/*** ①、②共通 ***/

	/****************************************
			6. Comments
	*****************************************/
	/*** ①、②共通 ***/

	/****************************************
			7.  widget
	*****************************************/
	/*** ①、②共通 ***/

	/****************************************
			8.  Form
	*****************************************/
	#search{
		display: none;
	}
	#mobileSearch{
		display: none;
		margin: 0 50px;
		height: 30px;
	}

	/* reset webkit search input browser style */
	input {
		outline: none;
	}
	input[type=search] {
		-webkit-appearance: textfield;
		-webkit-box-sizing: content-box;
		font-family: inherit;
		font-size: 100%;
	}
	input::-webkit-search-decoration,
	input::-webkit-search-cancel-button {
		display: none; /* remove the search and cancel icon */
	}
	/* placeholder */
	input:-moz-placeholder {
		color: #999;
	}
	input::-webkit-input-placeholder {
		color: #999;
	}

	/* searchform */
	#searchform_m input[type=search] {
		background: #FFF url(images/search.png) no-repeat 5px center;
		padding: 0 0 0 7%;
		border-radius: 0;
		border: none;
		width: 93%;
		height: 30px;
		color: transparent;
		cursor: pointer;
		font-size: 20px;
		background-color: #ccc;
		margin: 0;
	}

	#searchform_m input[type=search]:focus {
		color: #000;
		background-color: #E9E9E9;
		cursor: auto;
	}
	#searchform_m input:-moz-placeholder {
		color: transparent;
	}
	#searchform_m input::-webkit-input-placeholder {
		color: transparent;
	}

	/****************************************
			9.  Footer
	*****************************************/

}

@media screen and (max-width: 767px) {

	/* smartPhone 表示領域が〜768pxの場合に適用するスタイル */

	/****************************************
			2. Basic Layout

	*****************************************/
	#page{
				background-color: #FFF;
				width: 100%;
	}
	#wrapper{
				width: 100%;
				margin: 0 auto;
				background-color: #FFF;
	}
	#header{
				height: 60px;
				padding: 15px 0 0 0;
				margin: 0 15px;
				position: relative;
				border-bottom: 1px dotted #333;
	}
	#robo{
				display: block;
				background: url("images/robo_sml.png") no-repeat;
				width: 73px;
				height: 60px;
				position: absolute;
				top: 50px;
				right: -15px;
				text-indent: 100%;
				white-space: nowrap;
				overflow: hidden;
	}
	#contents{
				margin: 0 15px;
	}
	#main{
				width:100%;
				padding:0;
	}
	#side{

	}
	#footer{
				clear: both;
				background-color: #555;
				color: #FFF;
				font-size: 80%;
				padding: 15px;
	}
	#footer-robo{
				display: none;
	}
	#copy{
				background-color: #555;
				padding: 0 15px;
				height: 30px;
				margin: 0 auto;
				font-size:80%;
				color: #FFF;
	}
	img{
				max-width: 100%;
				height: auto;
				width: auto\9; /* ie8 */
	}

	/****************************************
			3.  Header, Menu
	*****************************************/
	#title{
				margin-top: 5px;
				width: 100%;
				text-align: center;
	}
	.blog_title{
				color: #D11;
				font-size:180%;
				text-decoration:none;
	}
	.blog_title:hover{
		color: #D11
	}

	#header p{
		color:#D11;
		font-size:70%;
	}

	#menu_icon{
		display: block;
		width: 36px;
		height: 36px;
		position: absolute;
		top: 20px;
		left: 0;
	}
	#search_icon{
		display: block;
		width: 36px;
		height: 36px;
		position: absolute;
		top: 20px;
		right: 0;
	}

	/*** Main Menu ***/
	#menu{
		display: none;
	}
	ul#mobnav li > a{
		font-size: 85%;
	}

	/****************************************
			4.  Main
	*****************************************/
	#main h3{
				margin: 40px 0 0 0;
				font-size: 90%;
				border-bottom: 1px dotted #000;
				padding:0 0 8px 0;
	}
	#main h3:first-child{
				border-bottom: none;
				padding:0;
	}
	.postdate{
				font-size: 125%;
	}

	/*** Blog info ***/

	.blog_info{
				font-size:85%;
				margin: 0 0 20px;
				line-height: 1.5em;
	}
	.info_tags{
				font-size:85%;
				margin: 0 0 20px;
				padding-top: 10px;
	}
	.social{
				height: 36px;
				padding: 0 0 50px;
	}

	/*** Contents ***/
	a.more-link{
				height: 40px;
				width: 140px;
				margin: 30px 0;
				background:url("images/read_more.png") no-repeat left top;
				text-indent: 100%;
				white-space: nowrap;
				display: block;
				overflow: hidden;
	}

	a.more-link:hover{
				height: 40px;
				width: 140px;
				background:url("images/read_more_focus.png") no-repeat left top;
				text-indent: 100%;
				white-space: nowrap;
				display: block;
				overflow: hidden;
	}

	/*** Bottom Navigation, Comment Navigation ***/
	div.nav-below{
				margin: 50px 0;
				height: 40px;
				width: 100%;
	}
	a.more-post{
				margin: 0 auto;
				height: 40px;
				width: 190px;
				background:url("images/load_more.png") no-repeat;
				text-indent: 100%;
				white-space: nowrap;
				display: block;
				overflow: hidden;
	}
	a.more-post:hover{
				margin: 0 auto;
				height: 40px;
				width: 190px;
				background:url("images/load_more_focus.png") no-repeat;
				text-indent: 100%;
				white-space: nowrap;
				display: block;
				overflow: hidden;
	}

	/*** Bottom Navigation, Prev / Next ***/
	span.nav-previous{
				height: 40px;
				width: 47%;
				line-height: 42px;
				background:url("images/arrow_prev.png") no-repeat left 3px;
				border: 3px solid #09B;
				overflow: hidden;
				float: left;
	}
	span.nav-previous a{
				display: block;
				padding: 0 10px 0 30px;
				overflow: hidden;
	}
	span.nav-previous a:hover{
				background: #09B url("images/arrow_prev_focus.png") no-repeat left 3px;
				color: #FFF;
				display: block;
	}
	span.nav-next{
				height: 40px;
				width: 47%;
				line-height: 42px;
				background:url("images/arrow_next.png") no-repeat right 3px;
				border: 3px solid #09B;
				overflow: hidden;
				float: right;
	}
	span.nav-next a{
				display: block;
				padding: 0 30px 0 15px;
				overflow: hidden;
	}
	span.nav-next a:hover{
				color: #FFF;
				background: #09B url("images/arrow_next_focus.png") no-repeat right 3px;
				display: block;
	}

	/*** Bottom Navigation, BackToTop ***/
	div.top-btn{
				display: none;
	}

	/****************************************
			5. Post Entry

	*****************************************/
	.title{
		font-size:125% !important;
		line-height: 24px;
		margin: 10px 0 5px !important;
	}
	.post{
		margin: 30px 0 0 0;
	}
	.post div.wp-caption p{
		font-size:80%;
		color: #999;
		margin: 5px 0 0 0;
		text-align: center;
		line-height: 1.2em;
	}

	/****************************************
			6. Comments
	*****************************************/
	/*** ①、②共通 ***/

	/****************************************
			7.  widget
	*****************************************/
	.wp_rp_title{
		font-size: 90%;
	}

	/****************************************
			8.  Form
	*****************************************/
	#search{
		display: none;
	}
	#mobileSearch{
		display: none;
		margin: 0 15px;
		height: 30px;
	}

	/* reset webkit search input browser style */
	input {
		outline: none;
	}
	input[type=search] {
		-webkit-appearance: textfield;
		-webkit-box-sizing: content-box;
		font-family: inherit;
		font-size: 100%;
	}
	input::-webkit-search-decoration,
	input::-webkit-search-cancel-button {
		display: none; /* remove the search and cancel icon */
	}
	/* placeholder */
	input:-moz-placeholder {
		color: #999;
	}
	input::-webkit-input-placeholder {
		color: #999;
	}

	/* searchform */
	#searchform_m input[type=search] {
		background: #FFF url(images/search.png) no-repeat 5px center;
		padding: 0 0 0 12%;
		border-radius: 0;
		border: none;
		width: 88%;
		height: 30px;
		color: transparent;
		cursor: pointer;
		font-size: 20px;
		background-color: #ccc;
		margin: 0;
	}

	#searchform_m input[type=search]:focus {
		color: #000;
		background-color: #E9E9E9;
		cursor: auto;
	}
	#searchform_m input:-moz-placeholder {
		color: transparent;
	}
	#searchform_m input::-webkit-input-placeholder {
		color: transparent;
	}

	/****************************************
			9.  Footer
	*****************************************/

}