@charset "UTF-8";

/* AJAX用

------------------------
ver.2010/07/07/
------------------------


/*スクロール用
----------------------------------------------------------*/

h2 {
	font-size: xx-large;
}

.section {
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
	bottom: 1px;
	background:url(../img/floor.gif) repeat-x 0px bottom;
	z-index: 3;
}

#section1 {
	left: 2px;
}

#section2 {
	left: 100%;
}

#section3 {
	left: 200%;
}

#section4 {
	left: 300%;
}

#section5 {
	left: 400%;
}

#section6 {
	left: 500%;
}

#section7 {
	left: 600%;
}

.section_under {
	top:100%;
	background-color:#000000;
}

#under01 {
	left: 0%;
	background-image:none;
}

#under02 {
	left: 100%;
	background-image:none;
}

#under03 {
	left: 200%;
	background-image:none;
}

#section8 {
	left: 300%;
}

#section9 {
	left: 400%;
}

#section10 {
	left: 500%;
}

#section11 {
	left: 600%;
}

#section12 {
	left: 300%;
}



/*ツールチップ用
----------------------------------------------------------*/

p#vtip {
	display: none;
	position: absolute;
	min-width:85px;
	text-align:center;
	padding:8px 5px;
	left: 5px;
	font-size: 0.8em;
	background-color: white;
	border: 1px solid #a6c9e2;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	z-index: 9999
}

p#vtip #vtipArrow {
	position: absolute;
	top: -10px;
	left: 40%;
}


/*サブナビ用
----------------------------------------------------------*/

#navigation-block {
	position:fixed;
	width:100px;
	bottom:400px;
	right:0px;
	z-index:6;
}

ul#sliding-navigation li.sliding-element h3,
ul#sliding-navigation li.sliding-element a
{
	display: block;
	width: 150px;
	padding: 0px 0px 0px 80px;
	margin: 0;
	margin-bottom: 5px;
}

ul#sliding-navigation li.sliding-element h3
{
	color: #fff;
	background:#333 url(heading_bg.jpg) repeat-y;
	font-weight: normal;
}

ul#sliding-navigation li.sliding-element a
{
	color: #999;
	text-decoration: none;
}

ul#sliding-navigation li.sliding-element a:hover {
	color: #ffff66;
}


/*天気用
----------------------------------------------------------*/
#sun,#moon {
	text-indent:-9140px;
	width:130px;
	height:130px;
	z-index:40;
	position: fixed;
	visibility: hidden;
}

#sun {
	background:url(../img/sun_moon.png) no-repeat 0px 0px;
}

#moon {
	background:url(../img/sun_moon.png) no-repeat 0px -130px;
}

#weather {
	text-indent:-9140px;
	width:100%;
	height:100%;
	z-index:50;
	position: fixed;
	left: 0px;
	top: 0px;
}

/*コンテンツ　フェード用
----------------------------------------------------------*/

#about_text {
	background:url(../img/projector.png) no-repeat 0px -10px;
	height:290px;
	position: absolute;
	left: 30px;
	bottom: 100px;
}

#about_text:hover {
	background:url(../img/projector.png) no-repeat 0px -310px;
}

#about_text p {
	padding-left:140px;
	width:450px;
	height:250px;
	display:block;
}


/*おしごと、アコーディオン用
----------------------------------------------------------*/
.tabContainer {
	height:300px;
	position: absolute;
	left: 80px;
	bottom: 80px;
	z-index:10;
}

#works_web,#works_graph,#works_photo {
	float: left;
	width:200px;
}

.tabContainer dl {
	background:url(../img/works_tag.png) no-repeat 0px 0px;
	min-height:200px;
	margin:5px;
}

.tabContainer dt {
	background:url(../img/works_tag.png) no-repeat 0px 0px;
	text-indent:-9140px;
	width:200px;
	height:118px;
	display:block;
}



#works_web,#works_web dt {
	background-position:0px 0px;
}
#works_graph,#works_graph dt {
	background-position:-200px 0px;
}
#works_photo,#works_photo dt {
	background-position:-400px 0px;
}

.tabContainer dd {
	width:180px;
	background:url(../img/works_tag_bottom.png) no-repeat 0px bottom;
	padding:0px 10px 10px 10px;
}

.tabContainer dd li {
	background:url(../img/check.png) no-repeat 0px center;
	font-size:11px;
	text-indent:16px;
}


/*メンバー、アコーディオン用
----------------------------------------------------------*/

#page-wrap {
	height:320px;
	position:absolute;
	left:12%;
	bottom:95px;
	z-index:100;
	overflow: hidden;
}

#page-wrap h3 {
	visibility: hidden;
}

.info-col {
	float: left;
	width: 132px;
	height: 100%;
}

.image {
	height: 100px;
	text-indent: -9999px;
	display: block;
	border-right: 1px solid white;
}

.m_yoshi {
	background: url(../img/yoshi.png) left center no-repeat;
}

.m_take {
	background: url(../img/take.png) left center no-repeat;
}

.m_sasa {
	background: url(../img/sasa.png) left center no-repeat;
}

#page-wrap dt {
	padding: 5px;
	background: #900;
	color: white;
	border-bottom: 1px solid white;
	border-right: 1px solid white;
}
#page-wrap dd { position: absolute; left: -9999px; top: -9999px; width: 299px; background: #900; padding: 5px 10px 10px 10px; color: white; border-right: 1px solid white; }

#page-wrap dt:nth-of-type(1) { background: #b44835; }
#page-wrap dd:nth-of-type(1) { background: #b44835; }

#page-wrap dt:nth-of-type(2) { background: #ff7d3e; }
#page-wrap dd:nth-of-type(2) { background: #ff7d3e; }

#page-wrap dt:nth-of-type(3) { background: #ffb03b; }
#page-wrap dd:nth-of-type(3) { background: #ffb03b; }

#page-wrap dt:nth-of-type(4) { background: #c2a25c; }
#page-wrap dd:nth-of-type(4) { background: #c2a25c; }

#page-wrap dt:nth-of-type(5) { background: #4c443c; }
#page-wrap dd:nth-of-type(5) { background: #4c443c; }

dt:nth-of-type(6) { background: #656b60; }
dd:nth-of-type(6) { background: #656b60; }

.curCol { -moz-box-shadow: 0 0 10px rgba(0,0,0,0.2); -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.2); z-index: 1; position: relative; }


/*お仕事、スライド用
----------------------------------------------------------*/
#works_board {
	background:url(../img/white_board02.gif) no-repeat 0px 0px;
	width:560px;
	height:210px;
	position:absolute;
	left:150px;
	bottom:190px;
	z-index:100;
}

	
/* Use this to keep the slider content contained in a box even when JavaScript is disabled */
.coda-slider-no-js .coda-slider {
	height: 200px;
	overflow: auto !important;
	padding-right: 20px
}
	
/* Change the width of the entire slider (without dynamic arrows) */
.coda-slider, .coda-slider .panel {
	width: 560px
} 
	
/* Change margin and width of the slider (with dynamic arrows) */
.coda-slider-wrapper.arrows .coda-slider, .coda-slider-wrapper.arrows .coda-slider .panel {
	width: 560px
}

.coda-slider-wrapper.arrows .coda-slider {
	margin: 0 10px
}
	
/* Arrow styling */
.coda-nav-left a, .coda-nav-right a {
	display: block;
	padding: 5px;
	position:absolute;
	bottom:180px;
	z-index:101;
}
	
	/* Tab nav */
	.coda-nav ul li a.current { background: #39c }
	
	/* Panel padding */
	.coda-slider .panel-wrapper { padding: 20px }
	
	/* Preloader */
	.coda-slider p.loading { padding: 20px; text-align: center }

/* Don't change anything below here unless you know what you're doing */

	/* Tabbed nav */
	
.coda-nav {
	width:600px;
}
	
.coda-nav ul {
	position:absolute;
	left:20px;
	bottom:185px;
	display: block;
	margin: auto;
	overflow: hidden;
	z-index:100;
}
.coda-nav ul li {
	display: inline;
}

.coda-nav ul li a {
	background: #000;
	color: #fff;
	display: block;
	float: left;
	margin-right: 1px;
	padding: 3px 6px;
	text-decoration: none;
	min-width:80px;
}
	
	/* Miscellaneous */
	.coda-slider-wrapper { clear: both; overflow: auto }

.coda-slider {
	float: left;
	overflow: hidden;
	position: relative
}
	
.coda-slider .panel {
	display: block;
	float: left;
	margin: 12px 0px 0px 0px;
}
	.coda-slider .panel-container { position: relative }
.coda-nav-left a {
	left:0px;	
}
.coda-nav-right a {
	left:540px;
}
.coda-nav-left a, .coda-nav-right a {
	display: block;
	text-align: center;
	text-decoration: none;
}

.fancyzoom {
	position:absolute;
	bottom:0px;
	right:0px;
}


/*
    ColorBox Core Style
    The following rules are the styles that are consistant between themes.
    Avoid changing this area to maintain compatability with future versions of ColorBox.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:hidden;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

/* 
    Example user style
    The following rules are ordered and tabbed in a way that represents the
    order/nesting of the generated HTML, so that the structure easier to understand.
*/
#cboxOverlay{background:url(../../colorbox/overlay.png) 0 0 repeat;}
#colorbox{}
    #cboxTopLeft{width:21px; height:21px; background:url(../../colorbox/controls.png) -100px 0 no-repeat;}
    #cboxTopRight{width:21px; height:21px; background:url(../../colorbox/controls.png) -129px 0 no-repeat;}
    #cboxBottomLeft{width:21px; height:21px; background:url(../../colorbox/controls.png) -100px -29px no-repeat;}
    #cboxBottomRight{width:21px; height:21px; background:url(../../colorbox/controls.png) -129px -29px no-repeat;}
    #cboxMiddleLeft{width:21px; background:url(../../colorbox/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(../../colorbox/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(../../colorbox/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(../../colorbox/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0px; background:url(../../colorbox/controls.png) -75px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious.hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(../../colorbox/controls.png) -50px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext.hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(../../colorbox/loading_background.png) center center no-repeat;}
        #cboxLoadingGraphic{background:url(../../colorbox/loading.gif) center center no-repeat;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(../../colorbox/controls.png) -25px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose.hover{background-position:-25px -25px;}

/*
    The following fixes png-transparency for IE6.  
    It is also necessary for png-transparency in IE7 & IE8 to avoid 'black halos' with the fade transition
    
    Since this method does not support CSS background-positioning, it is incompatible with CSS sprites.
    Colorbox preloads navigation hover classes to account for this.
    
    !! Important Note: AlphaImageLoader src paths are relative to the HTML document,
    while regular CSS background images are relative to the CSS document.
*/
.cboxIE #cboxTopLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../../colorbox/internet_explorer/borderTopLeft.png, sizingMethod='scale');}
.cboxIE #cboxTopCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../../colorbox/internet_explorer/borderTopCenter.png, sizingMethod='scale');}
.cboxIE #cboxTopRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../../colorbox/internet_explorer/borderTopRight.png, sizingMethod='scale');}
.cboxIE #cboxBottomLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../../colorbox/internet_explorer/borderBottomLeft.png, sizingMethod='scale');}
.cboxIE #cboxBottomCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../../colorbox/internet_explorer/borderBottomCenter.png, sizingMethod='scale');}
.cboxIE #cboxBottomRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../../colorbox/internet_explorer/borderBottomRight.png, sizingMethod='scale');}
.cboxIE #cboxMiddleLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../../colorbox/internet_explorer/borderMiddleLeft.png, sizingMethod='scale');}
.cboxIE #cboxMiddleRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../../colorbox/internet_explorer/borderMiddleRight.png, sizingMethod='scale');}