@charset "UTF-8";
@import "reset-min.css";
@import "fonts-min.css";

/*-----------------------------------------------------------------------------
Primary Style Sheet

version:   1.0
author:    tokujin yoshioka design.
website:   tokujin.com

-----------------------------------------------------------------------------*/
html {width:100%;height:100%;}
body {width:100%;height:100%;text-align: center;}
p {margin:6px 0 9px 0;line-height:1.4em;}
a{text-decoration:none;cursor:pointer;}
a:link{color:#bfbfbf;}
a:visited{color:#bfbfbf;}
/*
#scrollText a:link{color:#bfbfbf;}
#scrollText a:visited{color:#bfbfbf;}
#text a:link{color:#bfbfbf;}
#text a:visited{color:#bfbfbf;}
*/
/*
a:hover{color:#666;}
*/
div.hr hr {visibility: hidden;}

/*---------------------------------------------------------------------------*/
#page{
	position: relative;
	width: 100%;
	height: 100%;
}
#wrapper{
	position: relative;
	width: 100%;
/*	overflow: scroll;*/
}
#container{
	position: relative;
	width:960px;
	height:620px;
	margin:0 auto;
	padding: 0 10px;
/*	border: #eee 1px solid;*/
}
#header{
	position: absolute;
	width: 960px;
	height: 96px;
	z-index:999;
}
body.home #header{
	height: auto;
}
#main{
	position: relative;
	width: 960px;
	text-align: left;
}
body.splash #main{
/*	top: 96px;
	position: absolute;
	left: 0px;
	width: 960px;
	overflow: hidden;*/
}
#identity{
	position:absolute;
	display: block;
	top:29px;
	left:440px;
	width:354px;
	height:16px;
}
h1.tokujin_yoshioka{
	position:absolute;
	display: block;
	left: 0;
	top:0;
}
h1.tyd_inc{
	position:absolute;
	display: none;
	left: 198px;
	top:0;
	padding: 0 0 0 17px;
	background: url(../images/separate_l.gif) 0 0 no-repeat;
}
#header h2{
	position: absolute;
	top: 29px;
	left: 640px;
	width: 155px;
	height: 17px;
}
#main h2{
	font-size:108%;
	line-height:1.5em;
	margin-bottom: 30px;
	color: #999999;
	font-weight:lighter;
}
body.media #main h2{
	margin-bottom: 20px;
}
#scrollText #main h2{
	position: absolute;
	top: -20px;
	left: 0;
}
body.news #main h2{
	margin-bottom: 5px;
}
h3{
	font-size:85%;
	line-height:1em;
/*	padding-left: 10px;*/
	color: #999999;
/*	background: url(../images/h3.gif) 0 50% no-repeat;*/
}
hr{
	display: none;
}
.hr{
	clear: both;
	width:100%;
	height: 1px;
	line-height: 1px;
	background: #bfbfbf;
	margin: 20px 0;
}
body.news h3{
	padding-left:0;
	color: #777777;
	background: none;
}
body.home h1.tyd_inc{left: 263px;}
body.home #identity{
	top:205px;
	left:0;
	width:960px;
	height:180px;
}

#language{
	position:absolute;
	display: block;
	top:33px;
	right:0;
	background: url(../images/separate_s.gif) 40px 0 no-repeat;
}
#language ul li{
	display:block;
	float: left;
	line-height:0em;
	margin:0;
	padding:0;
}
#language ul li.last{
	margin-left:12px;
}
body.home #language{
	position: relative;
	width: 124px;
	top:483px;
	padding-top:4px;
	left:0;
	background: url(../images/separate_l_l.gif) 64px 0 no-repeat;
}
body.home #language ul{
	display: block;
	width: 148px;
	height: 19px;
}
body.home #language ul li{
	margin-right:24px;
}
#menu{
	position: absolute;
	right:0;
	top: 59px;
}
#menu ul li{
	float: left;
	margin-left:0px;
	padding-right:5px;
	line-height: 0;
	background: url(../images/separate_m.gif) 100% 0 no-repeat;
}
#menu ul li.last{
	background-image: none;
	padding-right:0;
}
#main a:hover{
	color: #bfbfbf;
}
#photo{
	position: absolute;
	left: 0;
	color: #fff;
}
#photo img{
	-webkit-box-shadow: 1px 1px 3px #aaa;
	-moz-box-shadow: 1px 1px 3px #aaa;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=120, Color='#aaaaaa')";
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=120, Color='#aaaaaa');
}
#photo img.no-shadow{
	-webkit-box-shadow: 0 0 0 #fff;
	-moz-box-shadow: 0 0 0 #fff;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=0, Direction=120, Color='#ffffff')";
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=0, Direction=120, Color='#ffffff');
}
/*
body.splash #photo img{
	-webkit-box-shadow: 0 0 0 #fff;
	-moz-box-shadow: 0 0 0 #fff;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=0, Direction=0, Color='#ffffff')";
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=0, Direction=0, Color='#ffffff');
}
*/
/*
body.splash #main img{
	-webkit-box-shadow: 1px 1px 3px #999;
	-moz-box-shadow: 1px 1px 3px #999;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=120, Color='#cccccc')";
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=120, Color='#cccccc');
}
*/
#photo.no_title{
	top: 20px;
}
#photo.vertical{
	top: 30px;
}
#photo.horizon{
	top: 110px;
}
body.profile #photo, body.media #photo{
	top: 190px;
}
#photo video img{
	display: none;
}
#photo div{
	position: absolute;
}
#photo h2{
	position:absolute;
	line-height: 1.5em;
	left: 440px;
	top: 252px;
	font-weight: lighter;
	width: 325px;
	visibility: hidden;
	font-size:85%;
}
body.splash #photo{
	left: 10px;
/*	position: absolute;*/
}

/*
body.splash div.slide_span{
	-webkit-box-shadow: 1px 1px 3px #999;
	-moz-box-shadow: 1px 1px 3px #999;
}
#slideshow{
	-webkit-box-shadow: 1px 1px 3px #999;
	-moz-box-shadow: 1px 1px 3px #999;
}
*/
#submenu{
	position: absolute;
	display: block;
	top: 222px;
	right: 0;
	width: 151px;
	height: 398px;
}
#submenu .mask{
	position: absolute;
	overflow: hidden;
	width: 100%;
	height:336px;
	top: 62px;
}
#submenu ul{
	position: absolute;
	display: block;
	overflow: hidden;
/*	padding: 5px 0; */
	width: 100%;
	font-size: 85%;
}
#submenu ul li{
	font-family: arial;
	top: 0px;
	width: 100%;
	height: 12px;
	line-height:12px;
	margin: 0 0 24px 0;
	font-weight:lighter;
	overflow: hidden;
}
#submenu ul.thumbnail{
	left: 77px;
/*	padding: 12px 0; */
	width: 37px;
}
#submenu ul.thumbnail li{
	position: relative;
	display: block;
	width: 31px;
	height: 31px;
	line-height: 31px;
	overflow: hidden;
	margin: 0 0 30px 0;*/
}
#submenu ul li p{
	display: none;
}
#submenu .scroll{
	position: absolute;
	top: 0;
	right: -5px;
	width: 10px;
	height: 100%;
}
#submenu .scroll .up{
	position: absolute;
	right: 0px;
	top: 56px;
	width: 21px;
	height: 21px;
	background: url(../images/submenu/up.gif) 0 0 no-repeat;
	cursor: pointer;
}
#submenu .scroll .down{
	position: absolute;
	right: 0;
	top: 384px;
	width: 21px;
	height: 21px;
	background: url(../images/submenu/down.gif) 0 0 no-repeat;
	cursor: pointer;
}
body.media #submenu h2{
	position: absolute;
	top: -51px;
}
#scrollText{
	position: absolute;
	top: 164px;
	right: 0;
	width: 520px;
	height: 434px;
	padding: 26px 0;
}
body.media #scrollText{
	width: 268px;
}
#scrollText .mask{
	position: relative;
	height: 400px;
	overflow: hidden;
}
#scrollText .box{
	position: absolute;
	display: block;
	width: 429px;
}
#scrollText .scroll{
	position: absolute;
	top: -6px;
	right: -6px;
	width: 10px;
	height: 100%;
}
#scrollText .scroll .up{
	position: absolute;
	top: -3px;
	right: 0;
	width: 21px;
	height: 21px;
	background: url(../images/submenu/up.gif) 0 0 no-repeat;
	cursor: pointer;
}
#scrollText .scroll .down{
	position: absolute;
	right: 0;
	top: 447px;
	width: 21px;
	height: 21px;
	background: url(../images/submenu/down.gif) 0 0 no-repeat;
	cursor: pointer;
}
#scrollHeader{
	position: absolute;
	top: 137px;
	left: 440px;
	font-size:100%;
}
body.media #scrollHeader{
	left: 692px;
}
#scrollText p {
	font-size: 85%;
	text-align: justify; 
	text-justify: inter-ideograph; 
	color: #999999;
	line-height: 1.5em;
}
html>body #scrollText p {
	line-height: 1.5em;
}

#text{
	position: absolute;
	overflow: hidden;
	top: 137px;
	right: 0;
	width: 520px;
}
body.news #text{
	left: 0;
	top: 188px;
	right: auto;
	width: 520px;
/*	height: 520px;*/
	padding-right:30px;
}
#text p {
	font-size: 85%;
	color: #888888;
	line-height: 1.6em;
}
#fixText{
	position: absolute;
	top: 137px;
	left: 440px;
	width: 440px;
	height: 461px;
}
#fixText ul{
	margin-bottom: 72px;
	padding: 14px 0;
}
#fixText ul.bottom{
	margin-bottom: 0;
}
#scrollText ul li, #fixText ul li{
	color: #999999;
	line-height: 1.6em;
	margin-bottom: 3px;
	font-weight:lighter;
	font-size: 85%;
}

table{
	font-size: 85%;
	color: #999999;
	line-height: 1.6em;
}
table thead{
	display: none;
}
table tr td{
	padding-bottom: 10px;
}
table tr.spacing td{
	padding-top: 20px;
}
#archives{
	position: absolute;
	overflow: hidden;
	top: 189px;
	right: 0;
	text-align: right;
	width: 145px;
	font-size: 77%;
	font-weight: lighter;
}
#archives ul{
	display: block;
}
#archives ul li{
	margin: 0 0 14px 0;
}
#archives ul li.active a{
	color: #b3b3b3;
}
#others{
	position: relative;
	font-size: 85%;
	height: 60px;
}
#others ul{
	display: block;
}
#others ul li{
	float: left;
	display: block;
	padding: 0 4px 0 0;
	margin: 0 4px 0 0;
	background: url(../images/separate_s.gif) 100% 50% no-repeat;
}
#others ul li.active a{
	color: #999999;
}
#breadcrumb{
	position: absolute;
	top: -30px;
}
body.news #text img{
	margin: 11px 0 17px 0;
}
div.date {
	color: #aaaaaa;
	font-size: 77%;
}
p.date {
	margin:0;
	padding: 0;
	line-height:0;
}
#footer{
	position: relative;
}
#copyright{
	position:absolute;
	top:603px;
}
body.home #copyright{
	top:491px;
}

#text.scroll-pane{
	height: 483px;
}

.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	top: 137px;
	z-index: 1;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: #f0f0f0;
}
.jScrollPaneDrag {
	position: absolute;
	background: #bfbfbf;
	cursor: pointer;
	overflow: hidden;
	background: url(../images/slider.gif) 0 0 repeat-y;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: -6px;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	width: 9px;
	height: 12px;
	background: url(../images/submenu/up.gif) 50% 0 no-repeat;
}
a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: -6px;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	width: 9px;
	height: 12px;
	background: url(../images/submenu/down.gif) 50% 100% no-repeat;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}


/*---------------------------------------------------------------------------*/
p.deemphasis{color:#bfbfbf;}

.emphasis{color:#777777;font-weight:bold;}
.deemphasis{color:#bfbfbf;}
.test10 {font-size:77%;}
.test11 {font-size:85%;}
.test12 {font-size:93%;}
.test13 {font-size:100%;}
.test14 {font-size:108%;}
.test15 {font-size:116%;}
.test16 {font-size:123.1%;}
.test17 {font-size:131%;}
.test18 {font-size:138.5%;}
.test19 {font-size:146.5%;}
.test20 {font-size:153.9%;}
.test21 {font-size:161.6%;}
.test22 {font-size:167%;}
.test23 {font-size:174%;}
.test24 {font-size:182%;}
.test25 {font-size:189%;}
.test26 {font-size:197%;}