/***********************************************************
 * All
***********************************************************/
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section { display: block; }

/***********************************************************
 * main
***********************************************************/
body {
	background-color:#FFE4E1; /*MistyRose*/
	margin          :0px auto;
	width           :800px;
}

div.body {
	background-color:#FFFFFF;
}
header, nav, article, aside.affiliate, footer {
	display:block;
	margin:5px;
	padding:5px;
}

header {
	padding:0px;
	text-align:center;
	height:60px;
/*	border:1px solid #ccc;*/
}

nav {
/*	border:1px solid #ccc;*/
	float:left;
	width:140px;
}

article {
/*	border:1px solid #ccc;*/
	float:left;
	width:470px;
}

article.nonav {
	width:635px;
}

article.noaff {
	width:615px;
}

article.nonavaff {
	width:778px;
}

aside.affiliate {
/*	border:1px solid #ccc;*/
	float:left;
	width:120px;
}

section {
	word-wrap: break-word;
}

footer {
/*	border:1px solid #ccc;*/
	clear:both !important;
	text-align: center;
}

/***********************************************************
 * header
***********************************************************/
header div.logo {
	float:left;
	width:120px;
	height:60px;
}
header div.logo span.logo {
	font-size  :150%;
	font-weight:bold;
	color      :#FF69B4; /*HotPink*/
	text-shadow:3px 3px 5px red;
}
header div.logo span.logo2 {
	font-size  :90%;
	font-weight:bold;
	font-style :italic;
	color      :#FA8072; /*Salmon*/
}
header div.search {
	float:right;
	width:660px;
	text-align: right;
}
header div.menu {
	display: block;
	float:right;
	width:660px;
	text-align: left;
	padding:5px 0px;
	margin:0px;
}
header div.menu ul, header div.menu  li {
	margin:0px;
	padding         :0px;
    list-style-type:none;
    display:inline;
}
header div.menu  li {
	background-color:#E0FFFF; /*LightCyan*/
	border-color          :black;
	border-style          :solid;
	border-width          :1px 1px 1px 0px;
	padding         :5px;
}
header div.menu  li.top {
	border-width          :1px;
}
header div.menu a:hover{
	font-weight:bold;
}

/***********************************************************
 * nav
***********************************************************/
nav ul, nav li {
	margin:0px;
	padding         :0px;
    list-style-type:none;
}
nav li {
	background-color:#E0FFFF; /*LightCyan*/
	border-color          :black;
	border-style          :solid;
	border-width          :0px 1px 1px 1px;
	padding         :5px;
	overflow:auto;
	word-wrap:normal;
}
nav li.top {
	border-width          :1px;
}
nav li.title {
	background-color:#FFFFFF;
}
nav a:hover{
	font-weight:bold;
}

/***********************************************************
 * topic
***********************************************************/
div.topic {
	float:left;
	margin:5px;
	width:145px;
}
h3.topic {
	margin: 0px;
	background-color:#4682b4; /*steelblue*/
	color           :#f5deb3; /*wheat*/
	width:100%;
}
h4.topic
{
	margin: 0px;
	background-color:#E0FFFF; /*LightCyan*/
	border          :solid 1px black;
	padding         :2px;
	width:100%;
	white-space     :nowrap;
}

/***********************************************************
 * top - home
***********************************************************/
.tophome {
	width:100%;
}
.topic {
	width         :70%;
	vertical-align:top;
}
.blog-date {
	font-size:80%;
}

/***********************************************************
 * image buttom
***********************************************************/
a.button
{
	width:200px;
	height:42px;
	background-image:URL(../img/btn_007_a-trans_2.png);
	background-repeat:no-repeat;
	background-position:left top;
	-moz-background-size:100% 100%;
	background-size:100% 100%;
	text-align:center;
	padding:10px 15px;
	color:white;
}
a.button:active
{
	width:200px;
	height:42px;
	background-image:URL(../img/btn_007_a-trans.png);
	background-repeat:no-repeat;
	background-position:left top;
	-moz-background-size:100% 100%;
	background-size:100% 100%;
	text-align:center;
	padding:10px 15px;
	color:white;
}
/***********************************************************
 * image slider
***********************************************************/
div.slider
{
	position:relative;
	width:100%;
	height:150px;
}
div.slider img.btnPrev
{
	height:41px;
	position:absolute;
	top:45px;
	left:30px;
	border-left:solid 2px white;
	border-top:solid 2px white;
	border-right:solid 2px gray;
	border-bottom:solid 2px gray;
}
div.slider img.btnNext
{
	height:41px;
	position:absolute;
	top:45px;
	left:680px;
	border-left:solid 2px white;
	border-top:solid 2px white;
	border-right:solid 2px gray;
	border-bottom:solid 2px gray;
}
div.slider img.imgMain
{
	width:200px;
	height:150px;
	position:absolute;
	top:-20px;
	left:300px;
	z-index:5;
}
div.slider img.imgZoom
{
	width:600px;
	height:480px;
	position:absolute;
	top:-350px;
	left:100px;
	z-index:5;
}
div.slider img.imgNext1
{
	width:160px;
	height:120px;
	position:absolute;
	top:5px;
	left:420px;
	z-index:4;
	filter: alpha(opacity=80);
	-moz-opacity:0.80;
	opacity:0.80;
}
div.slider img.imgNext2
{
	width:120px;
	height:90px;
	position:absolute;
	top:30px;
	left:510px;
	z-index:3;
	filter: alpha(opacity=80);
	-moz-opacity:0.80;
	opacity:0.80;
}
div.slider img.imgNext3
{
	width:80px;
	height:60px;
	position:absolute;
	top:55px;
	left:580px;
	z-index:2;
	filter: alpha(opacity=80);
	-moz-opacity:0.80;
	opacity:0.80;
}
div.slider img.imgNone
{
	display:none;
}
div.slider img.imgPrev1
{
	width:160px;
	height:120px;
	position:absolute;
	top:5px;
	left:220px;
	z-index:4;
	filter: alpha(opacity=80);
	-moz-opacity:0.80;
	opacity:0.80;
}
div.slider img.imgPrev2
{
	width:120px;
	height:90px;
	position:absolute;
	top:30px;
	left:170px;
	z-index:3;
	filter: alpha(opacity=80);
	-moz-opacity:0.80;
	opacity:0.80;
}
div.slider img.imgPrev3
{
	width:80px;
	height:60px;
	position:absolute;
	top:55px;
	left:130px;
	z-index:2;
	filter: alpha(opacity=80);
	-moz-opacity:0.80;
	opacity:0.80;
}

/***********************************************************
 * list - table
***********************************************************/
table.list
{
	border-collapse:collapse;
}
table.list th
{
	text-align:center;
	border:solid 1px black;
	background-color:cyan;
	padding:1px;
}
table.list td
{
	border:solid 1px black;
	padding:1px 2px;
}
ul.list
{
	margin-left:30px;
}
table.list ul
{
	margin-left:30px;
}

/***********************************************************
 * table
***********************************************************/
table.col
{
	border-collapse:collapse;
}
td.num
{
	align:right;
	text-align:right;
}
td.ul
{
	border-bottom:solid 1px black;
}

/***********************************************************
 * marking
***********************************************************/
a.mark
{
	background-color:#00FF7F; /*SpringGreen*/
	border:solid 1px #778899; /*LightSlateGray*/
	padding:0px 1px;
	text-decoration:none;
}
a.mark:hover
{
	font-style: italic;
}
a.func
{
	color:#FF7F50; /*Coral*/
	font-weight:bold;
	text-decoration:none;
}
a.func:hover
{
	font-style: italic;
}
a.resv
{
	color:blue;
	text-decoration:none;
}
a.resv:hover
{
	font-style: italic;
}
a.define
{
	color:blue;
	font-weight:bold;
	text-decoration:none;
}
a.define:hover
{
	font-style: italic;
}

/***********************************************************
 * indent
***********************************************************/
div.indent1
{
	padding: 20px 0px 20px 50px;
}
div.indent2
{
	padding: 0px 0px 0px 50px;
}

/***********************************************************
 * block
***********************************************************/
pre.text, pre.file, pre.output
{
	padding:10px;
	margin:3px;
	overflow:auto;
	word-wrap:normal;
}
pre.text
{
	border:solid 2px #9370DB; /*MediumPurple*/
	background-color:#FFE4E1; /*MistyRose*/
}
pre.file
{
	border:solid 2px #9370DB; /*MediumPurple*/
	background-color:#FFC0CB; /*Pink*/
}
pre.output
{
	border:solid 2px #9370DB; /*MediumPurple*/
	background-color:White;
}
p.point
{
	border:solid 2px #9370DB; /*MediumPurple*/
	background-image:url(/img/arrow_point.gif);
	background-repeat:no-repeat;
	background-color:#D8BFD8; /*Thistle*/
	padding:20px;
	margin:10px;
}
div.point
{
	border:solid 2px #9370DB; /*MediumPurple*/
	background-image:url(/img/arrow_point.gif);
	background-repeat:no-repeat;
	background-color:#D8BFD8; /*Thistle*/
	padding:20px;
	margin:10px;
}
p.kakomon
{
	border:solid 2px #778899; /*LightSlateGray*/
	background-image : url(/img/kakomon.gif);
	background-repeat: no-repeat;
	background-color : #D3D3D3; /*LightGrey*/
	padding          : 40px 20px 20px 20px;
	margin           : 10px;
}
p.ref
{
	border:solid 2px #778899; /*LightSlateGray*/
	background-image : url(/img/refarence.gif);
	background-repeat: no-repeat;
	background-color : #D3D3D3; /*LightGrey*/
	padding          : 40px 20px 20px 20px;
	margin           : 10px;
}
div.scroll
{
	overflow:auto;
}

/***********************************************************
 * text decoration
***********************************************************/
span.underline
{
	text-decoration:underline;
}
span.underhasen
{
	border-bottom:1px dashed;
}
span.overline
{
	text-decoration:overline;
}
span.overline2
{
	padding-top:1px;
	border-top-width: 1pt;
	border-top-style: solid;
	text-decoration : overline;
}
span.overline3
{
	padding-top:1px;
	border-top-width: 1pt;
	border-top-style: solid;
}

.rotate45
{
	-moz-transform:rotate(45deg);
	-webkit-transform: rotate(45deg);
	-o-transform:rotate(45deg);
	-ms-transform:rotate(45deg);
	transform:rotate(45deg);
}

.transform90, .rotate90
{
	-moz-transform:rotate(90deg);
	-webkit-transform: rotate(90deg);
	-o-transform:rotate(90deg);
	-ms-transform:rotate(90deg);
	transform:rotate(90deg);
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
}

.scale-y2
{
	-moz-transform:scale(1,2);
	-webkit-transform: scale(1,2);
	-o-transform: scale(1,2);
	-ms-transform:scale(1,2);
	transform:scale(1,2);
}
.scale-y6
{
	font-family:monospace;
	font-size:1em;
	-moz-transform:scale(2,6);
	-webkit-transform: scale(2,6);
	-o-transform: scale(2,6);
	-ms-transform:scale(2,6);
	transform:scale(2,6);
}

.center
{
	text-align:center;
	align:center;
}

.right
{
	text-align:right;
	align:right;
}

.top
{
	vertical-align:top;
}
