@charset "Shift_Jis";

/*=======================================================

   Template  : styta
   Version   : ver. 4.0.2
   Address   : http://a-c.2-d.jp/ <em@a-c.2-d.jp>


========================================================*/

/*----------------------------------------------------
 ▼ screenメディア用
-----------------------------------------------------*/

@import url("def.css");

@media screen
{
        /*--------------------------------------------
           ■ カスタマイズ
        ---------------------------------------------*/

body
{
	width: 70%;
	min-width: 400px; /*最小幅*/
	max-width: 1000px; /*最大幅*/
	margin-right: auto;
	margin-left: auto;
}

/* ▼二カラム *//*
#MENU
{
	float: right;
	width: 11em;
}

	#MENU li[id^="MENU"]
	{
		width: 100%;
	}

#PAGETOP #KIZI
{
	margin-right: 12em;
}
*//* ▲二カラムここまで */


        /*--------------------------------------------
           ■ レイアウト
        ---------------------------------------------*/
body
{
	padding: 0;
}

#PAGETOP hr,
#MENU h2,
#FOOTER h2
{
	display: none;
}

#PAGETOP div.text hr
{
	display: block;
}

#PAGETOP
{
	position: relative;
	padding: 1px;
}

#HEADER
{
	padding: 2em 0.5em 0 0.3em;
	border-left: 5px solid #000;
}

	#HEADER h1
	{
		margin: 0;
		padding: 0;
		border: none;
	}

	#PAN
	{
		margin: 0.12em 0; 
		padding: 0 0.5em;
		background:#EEE url("styta_img/bg.gif") repeat 0 50%; 	
		line-height: 1.3;
	}

	#PAN li
	{
		display: inline;
		margin: 0;
		padding: 0;
		font-size: 88%;
	}

		#PAN a
		{
			padding-right: 9px;
			background: url("styta_img/pan.gif") no-repeat 100% 50%;
			color: #000;
			text-decoration: none;
		}

#MENU
{
	padding: 0 0.5em;
}

	#MENU ul
	{
		overflow: hidden;
	}

	#MENU01, #MENU02, #MENU03, #MENU04, #MENU05,
	#MENU06, #MENU07, #MENU08, #MENU09, #MENU10,
	#MENU11, #MENU12, #MENU13, #MENU14, #MENU15
	{
		list-style-type: none;
		display: block;
		float: left;
		width: 10em;
		margin: 0;
		padding: 0 0.25em 0 0;
		text-align: center;
		vertical-align: top;
	}

		li[id^="MENU"] ul,
		li[id^="MENU"] ul li
		{
			list-style-type: none;
			margin: 0 2px;
		}

		li[id^="MENU"] a
		{
			display: block;
			margin: 0 0 0.3em;
			padding: 0;
			border: 1px solid #DDD;
			color: #000;
			text-decoration: none;
			text-align: center;
		}

		li[id^="MENU"] a:hover
		{
			color: #000;
			background: #EEE url("styta_img/bg.gif") repeat;
		}

		li.menu-on a
		{
			color: #CCC;
		}

		#MENU li form,
		#MENU li p
		{
			margin: 0;
			padding: 0;
		}

#KIZI
{
	margin: 0.7em 0.5em;
	padding: 1px 10px;
	border: 1px dotted #000;
}

	#KIZI h2
	{
		margin: 0 -10px;
	}

	div.text
	{
		margin: 0.7em 0 2em;
	}


	ul.modori
	{
		list-style: none;
		margin: 1.5em 0 0 40%;
		padding: 0;
	}

	ul.modori li
	{
		list-style: none;
		margin: 0;
		text-align: right;
	}

		ul.modori a
		{
			display: block;
			margin: 0 0 0 auto; 
			padding: 0 20px;
			width: 6em;
			border: 1px solid #ccc; 
			text-decoration: none;
			text-align: center; 
			line-height: 1;
		}

		ul.modori a:link,
		ul.modori a:visited
		{
			border-color: #CCC;
			color: #CCC;
		}

		ul.modori a:hover,
		ul.modori a:focus
		{
			border-color: #888;
			color: #888;
		}

#FOOTER
{
	clear: both;
	padding: 0.2em 1em;
	background: #EEE url("styta_img/bg.gif") repeat; 
}

	#FOOTER ul
	{
		text-align: right;
	}

	#FOOTER li
	{
		text-align: left;
	}

	#FOOTER01, #FOOTER02, #FOOTER03, #FOOTER04, #FOOTER05,
	#FOOTER06, #FOOTER07, #FOOTER08, #FOOTER09, #FOOTER10
	{
		display: inline;
		margin: 0;
		padding: 0 0.3em;
	}

        /*--------------------------------------------
           ■ IE
        ---------------------------------------------*/

* html #HEADER,
* html #MENU ul,
* html #KIZI,
div.text
{
	height: 1%;
}

        /*--------------------------------------------
           ■ Pinky:blog
        ---------------------------------------------*/

#PAGETOP #KIZI  textarea.long-text-edit,
div.resizable-textarea textarea,
form.pinky-referer-table-form textarea
{
	width: 97%;
}

div.pinky-thumbnails
{
	padding-top: 0.3em;
	text-align: center;
}

ul.pinky-headline li+li,
form.pinky-message-list ul li+li
{
	margin-top: 0.3em;
	padding-top: 0.3em;
	border-top: 1px dotted #DDD;
}

ul.pinky-section-footer li
{
	white-space: nowrap;
}

dl.pinky-entry-information dd
{
	word-wrap: break-word;
}

}/* @media screen 終 */

/*----------------------------------------------------
 ▼ 他メディア用
-----------------------------------------------------*/

@media print, projection
{
	*
	{
		background-image: none !important;
	}

	html, body
	{
		margin: 0; padding: 0;
		background-color: #FFFFFF;
		color: #000000;
	}

	ul, ol, dl, p, address, table, blockquote, pre
	{
		margin: 10pt 0 5pt; padding: 0;
	}

	body
	{
		font-size: 12pt; 
		font-family: "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "ＭＳ Ｐ明朝", serif;
		line-height: 1.5;
		text-align: left;
	}

	h1, h2, h3, h4, h5, h6
	{
		border-bottom: 2px solid #000000;
		font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ ゴシック", sans-serif;
	}

	h3, h4, h5, h6
	{
		border-bottom-width: 1px;
	}

	h4
	{
		border-bottom-style: dashed;
	}

	h5
	{
		border-bottom-style: dotted;
	}

	a[href^="http://"]::after
	{
	        content: "\20\ff3b" attr(href) "\ff3d\20";
	}

	ins
	{
		text-decoration: none;
	}

	table, th, td
	{
		border-spacing: 0; border-collapse: collapse;
		border: 1px solid #000000;
		padding: 0.2em 0.4em;
		vertical-align: top; text-align: left;
	}

	li, dd, blockquote
	{
		margin-left: 3em; padding: 0.1em 0;
	}

	blockquote[cite]::after
	{
		content: "\2d\63\69\74\65\2d\20" attr(cite); display: block;
		margin-left: 10%; font-size: smaller; text-align: right;
	}

	pre
	{
		padding : 0.5em; border: 1px solid #000000;
		white-space: pre-wrap;
	}

	code, cite, dt, dfn, kbd, var
	{
		margin: 0 0.15em; font-style: normal;
		font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ ゴシック", Sans-serif;
	}

	dt, dfn, var
	{
		font-weight: bold;
	}

	acronym::after, abbr::after
	{
		content: "\ff08" attr(title) "\ff09"; 
	}

	var
	{
		padding-right: 0.3em; font-style: oblique;
	}

	ul#PAN, div#MENU, ul.modori, div#FOOTER, del, hr
	{
		display: none;
	}

}/* @media print, projection 終 */

@media handheld, tty
{
	*
	{
		background-image: none !important;
		margin-left: 0; margin-right: 0;
		padding-left: 0; padding-right: 0;
	}

	body
	{
		background-color: #EFEFEF; color: #000000;
	}

	body
	{
		margin: 0 1%; font-size: 1em; line-height: 1.25;
	}

	h1, h2, h3, h4, h5, h6
	{
		margin: 0; padding: 2px 1%; 
		font-size: 100%; color: #000000;
	}

	h1
	{
		color: #990000;
	}

	h2
	{
		border-bottom: 1px solid #000000;
		background-color: #CC6666;
	}

	h3
	{
		background-color: #FFCCCC;
	}

	h4
	{
		border-bottom: 1px dashed #000000;
	}

	li, dd, blockquote
	{
		list-style-position: inside;
		margin-left: 1em;
	}

	q, blockquote
	{
		color: #1A6B24;
	}

	em, strong
	{
		color: #EB0027; font-style: normal;
	}

	kbd
	{
		margin: 0 1px; padding: 1px 1px 0 3px; 
		border: solid #993300; border-width: 0 1px 1px 0;
		background-color: #FF9966; color: #330000;
	}

	#PAN, #MENU h2, #FOOTER h2, del
	{
		display: none;
	}

}/* @media handheld, tty 終 */



/* ここからrubicle.net独自カスタマイズ */
aside{
	display: block;
	margin: 2em 0 2em 2em;
	padding: 0 1em;
	border-style: solid;
	border-color: #CCCCCC;
	border-width: 1px;
	color: #333333;
}

figure{
	display: block;
	margin-left: 1em;
	margin-top: 1em;
}
figcaption{
	display: block;
	margin-left: 0.5em;
	margin-top: 1em;
}

div.v2 div.text > p,
div.v2 div.text > pre{
	margin-left: 3em;
}


#KIZI ul{
	margin-top : 2em;
	margin-bottom : 2em;
}

#KIZI div.text h3{
	margin-top: 4em;
}
#KIZI div.text > h3:first-child{
	margin-top: 0;
}


ul li, ol li{
	margin-top : 0.5em;
	margin-bottom : 0.5em;
}

ul.description li, ol.description li{
	margin-bottom : 2em;
}


img.illustration{
	border: 1px solid #d0d0d0
}

dd p{
	margin-top : 0.3em;
	margin-bottom : 0.3em;
}


div.talk h3{
	margin-top: 4em;
}

.rubicle{
	color: #ff2040;
}

.rb{
	color: #a06000;
}
tr.rubicle td, tr.rb td{
	vertical-align: middle;
}


div.source, div.filetree{
	margin: 3em 2em;
}

div.source code{
	margin-left: 0;
	font-family: monospace;
}

label{
	border-bottom: dashed 1px;
}

table.profile{
	border: 4px dotted #a0a0c0;
}

.hc-details{
	background-color: #f0f0f0;
}

.hc-details-open-right img.hc-pic{
	margin: 12px 0 12px 12px;
}

table.talk-table{
	width: 98%;
}
table.talk-table td.face{
	width: 92px;
	margin: 0;
	padding: 2px;
}

table.talk-table td.serif{
	padding-left: 1.5em;
}

div.talk hr{
	margin: 4em 0; 
}

#KIZI dl dd ul{
	margin: 0;
}

#KIZI dl dd ul li{
}

/* Micro clearfix - http://coliss.com/articles/build-websites/operation/css/css-micro-clearfix.html */
/* For modern browsers */
.cf:before,
.cf:after {
    content:"";
    display:table;
}
 
.cf:after {
    clear:both;
}
 
/* For IE 6/7 (trigger hasLayout) */
.cf {
    zoom:1;
}

/* for jQuery UI Tabs */

#KIZI ul.ruby-script-tabs{
    position: relative;
		margin: 0;
		margin-top: 0.8em;
		padding: 0;
}


#KIZI ul.ruby-script-tabs li a:hover
		{
			color: #000;
			background: #EEE url("styta_img/bg.gif") repeat;
		}


#KIZI ul.ruby-script-tabs li{
    position: absolute;
    list-style-type: none;
    margin: 0;
    padding: 0;
    text-align: center;
    vertical-align: middle;
    width: 10em;
		height: 1.5em;
}

#KIZI ul.ruby-script-tabs li.tab01{
}

#KIZI ul.ruby-script-tabs li.tab02{
	left: 11.5em;
}


#KIZI ul.ruby-script-tabs li a{
    border: 1px dashed #CCC;
		color: #BBB;
    display: block;
    margin: 0;
    padding: 0;
		height: 100%;
    text-align: center;
    text-decoration: none;
}

#KIZI ul.ruby-script-tabs li a:hover{
	border-style: solid;
}


#KIZI ul.ruby-script-tabs li.active-tab{
	background: none repeat scroll 0 0 #EEE;
}

#KIZI ul.ruby-script-tabs li.active-tab a{
	border: 1px solid #CCC;
	color: #555;
}

#KIZI div.tab-content{
	margin-top: 2.8em;
}
#KIZI div.tab-content pre{
	margin-top: 0;
}

/* disqus & share-link */
#disqus_thread{
	margin-top: 3em;
}

#share-links *{
    border: 0 none;
    font-family: inherit;
    font-size: 100%;
    font-style: inherit;
    font-weight: inherit;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
		font-size: 14px;
}

#share-links {
  height: 4em;
  margin-top: 1.5em;
  position: relative;
  overflow: hidden;
}



#share-links ul {
  position: relative;
  left: 50%;
  float: left;
}
#share-links ul li {
  position: relative;
  left: -50%;
  float: left;
  list-style: none;
  margin-right: 1em;
	padding: 0;
}
#share-links ul li.hatena-button iframe,
#share-links ul li.g-plus-button > div {
  width: 54px !important;
}
#share-links ul li.facebook-button > div > span {
	width: 156px !important;
}


#share-links ul li iframe.twitter-share-button {
  width: 106px !important;
}


/* .clearfix */
.clearfix:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}

div.CodeRay{
	line-height: 1.4;
}

span.CodeRay, var {
	font-family: monospace;
	margin: 0 0.3em;
}

span.CodeRay {
	color: black;
}