﻿@charset "UTF-8";

/* ========== SET RESET ==========*/
/*

 * {
margin: 0;
padding: 0;
}

ul,li,ol,li {
list-style: none;
}

form,div,p,dt,dd,ul,li {
margin:0;
padding:0;
}

h1,h2,h3,h4,h5,h6 {
margin:0;
padding:0;
}
*/



/*========== GLOBAL COMMON ==========*/

html{
height:100%;
}

body{
height:100%;
background-color:#1f1f1f;
font-size:12px;
color:#fff;
font-family: "MS Pゴシック", Osaka, verdana, arial, sans-serif;
font-weight:normal;
margin: 0;	padding: 0;
background-image:url(../../images/bg.gif);
background-repeat: no-repeat;
background-position:right top;
}


a{text-decoration: none}

a:link {color: #fff;}
a:visited {color: #fff;}
a:hover {color: #e4007c; text-decoration: none;}

.space1{height:1px;margin:0;padding:0;font-size:0;line-height:0;clear:both;}
.space3{height:3px;margin:0;padding:0;font-size:0;line-height:0;clear:both;}
.space5{height:5px;margin:0;padding:0;font-size:0;line-height:0;clear:both;}
.space10{height:10px;margin:0;padding:0;font-size:0;line-height:0;clear:both;}
.space15{height:15px;margin:0;padding:0;font-size:0;line-height:0;clear:both;}
.space20{height:20px;margin:0;padding:0;font-size:0;line-height:0;clear:both;}
.space25{height:25px;margin:0;padding:0;font-size:0;line-height:0;clear:both;}
.space30{height:30px;margin:0;padding:0;font-size:0;line-height:0;clear:both;}
.space40{height:40px;margin:0;padding:0;font-size:0;line-height:0;clear:both;}
.space50{height:50px;margin:0;padding:0;font-size:0;line-height:0;clear:both;}
.space60{height:60px;margin:0;padding:0;font-size:0;line-height:0;clear:both;}
.space80{height:80px;margin:0;padding:0;font-size:0;line-height:0;clear:both;}
.space100{height:100px;margin:0;padding:0;font-size:0;line-height:0;clear:both;}

.line{height:5px;background-image:url(../../images/px444.gif);background-position:center center;background-repeat:repeat-x;margin: 0 20px;clear:both;}
.line2{height:5px;background-image:url(../../images/px333.gif);background-position:center center;background-repeat:repeat-x;margin:12px 0;clear:both;}

.small{font-size:85%;}

img{border:0;}



/*========== イントロ ==========*/
#intro{
position:absolute;
top:0px;right:0px;
z-index:1000;
margin:0; padding:0;
background-color:#e4007c;
background-image:url(../../images/logo_intro.gif);
background-repeat: no-repeat;
background-position:center center;
height:100%;
width:100%;
}

#intro2{
position:absolute;
top:0px;right:0px;
z-index:1000;
margin:0; padding:0;
background-color:#1f1f1f;
background-image:url(../../images/logo_bg.gif);
background-repeat: no-repeat;
background-position:right top;
height:100%;
width:100%;
}
body > div#intro { position: fixed ; } /* 対スクロール固定 */
body > div#intro2 { position: fixed ; }

/*========== スライドパネル ==========*/

#slide_panel{
	position: absolute;
	top:0px;
	right:0px;
	margin: 0;
	padding: 0 0 0 0;
	/* ポイント：横幅指定とはみ出し非表示にする事で、横幅が0に近づいても文字の改行を押さえる(改行させない) */
	width:235px;
	height:100%;
	cursor: pointer;
	overflow: hidden;	/* ←重要 */
	z-index:999;
}
#slide_panel img{
border:0;
}
body > div#slide_panel { position: fixed ; } /* 対スクロール固定 */

	
	#slide_panel .wrap{
		width: 235px;
		height: 100%;
		overflow:hidden;	/* IE対策のおまじない */
	}
	/* active用(メニューの背景画像切替) */
	div.menu_off{
		background-image:url(../../images/sidemenu_btn.gif);
		background-repeat: no-repeat;
		background-position:0 45%;
	}
	/* active用(メニューの背景画像切替) */
	div.active{
		/*background-position: -20px 0;*/
	}
		#slide_panel .wrap .panel_main{
			margin-left: 30px; padding: 0 0 3px 2px;
			background-color: #000;
			height: 100%;
			background-image:url(../../images/px_pink.gif);
	        background-repeat:repeat-y;
	        background-position:left top;
		}

/*内容のcss*/	
#slide_panel h2{
	margin:0; padding: 10px 10px;
}
	
#slide_panel ul{
	margin:0 0 0 20px; padding: 0 0 0 0;
	padding:0;
}
#slide_panel li{
		list-style: none;
		display:block;
	}
#slide_panel li a{
			display:block;
			margin: 0 0 4px 0; padding: 3px 0 3px 6px;
			color: #fff;
			text-decoration:none;
			/*font-family: verdana, arial, sans-serif;*/
			font-family: arial, Helvetica, sans-serif;
			font-weight:bold;
			letter-spacing:1px;
			font-size:11px;
		}
#slide_panel li a:hover{
			/*color:#e4007c;*/
			background-color: #e4007c;
		}



/*========== 写真キャプション ==========*/

div.caption {   
    position: relative;
	z-index:1;
}   
div.caption p{ 
    width: 120px;
	padding:10px 50px 10px 10px;
	margin: 0;   
    position: absolute;   
    bottom: 0;   
    left: 0;
	color: #fff;    
    background: #e4007c;    
    filter: alpha(opacity=90);  -moz-opacity:0.9;  opacity:0.9;
	cursor:pointer;
    cursor:hand;
	font-size:10px;
	line-height:1.5;
	display:block;
}  

/*========== ニュースティッカー ==========*/

#newsSpace{
width:auto;
height:16px;
background:url(../../images/newsticker_bg.gif) top left no-repeat; 
margin:0px 100px 20px 100px;
padding:0;
}

#newsticker{
margin-top:0;
}
#newsticker ul{
margin:0;padding:0;
}

#newsticker li{
		color: #ddd;
		font-size:11px;
		list-style: none;
		padding:0 0 0 145px;
		margin:0;
	}
#newsticker li a{
			margin: 0; padding: 0;
			color: #ddd;
			text-decoration:none;
		}
#newsticker li a:hover{
			color:#e4007c;
		}


/*========== 基本 ==========*/

#headLink{
height:80px;
margin:0;padding:0;clear:both;
}
#headLink img{
float:right;
}


#header{
width:auto;
height:16px;
margin: 0 15px;
background-image:url(../../images/px444.gif);
background-repeat:repeat-x;
background-position:left bottom;
}
#header p{
display:block;
width:760px;
margin: 0 auto;
font-size:14px;
}

#header .headerW{
display:block;
margin: 0 85px;
text-transform: uppercase;
letter-spacing : 0.1em;
}
#header img,
#header2 img{
margin-right:10px;
margin-top:2px;
border:none;
float:left;
}


#contents{
width:760px;
margin: 0 auto;
}
#contentsTop{
width:auto;
margin: 0 100px;
max-width:1380px;
min-width:760px;
}

.box{
float:left;
width:207px;
height:152px;
margin-top:10px;
}
.box img{
border: none;
}
.boxW{
background-image:url(../../images/box_w.gif);
background-repeat: no-repeat;
background-position:180px 0px;
}
.boxD{
background-image:url(../../images/box_d.gif);
background-repeat: no-repeat;
background-position:180px 0px;
}
.boxB{
background-image:url(../../images/box_b.gif);
background-repeat: no-repeat;
background-position:180px 0px;
}


#footer{
width:auto; margin:0px 100px; color:#ccc; font-size:9px;
}
#footer760{
width:760px; margin:0 auto; color:#ccc; font-size:9px;
}


#root{
width:auto;
height:16px;
margin: 0 20px;
background-image:url(../../images/px333.gif);
background-repeat:repeat-x;
background-position:left bottom;
}
#root p{
width:760px;
margin: 0 auto;
font-size:10px;
}

/*========== WORKS ==========*/

#contents #gallery,
#contents #galleryDtl{
width:560px;
margin: 0 auto;
}
#contents .galleryTtl{
width:130px;
display:block;
padding:20px 5px 0 5px; 
line-height:1.4;
text-align:center;
float:left;
background-image:url(../../images/gallery_bg_title.gif); background-repeat:no-repeat; background-position:left top;
}
#contents .galleryTxt{
width:470px;
display:block;
padding:20px 5px 0 5px; 
line-height:1.4;
text-align:center;
float:left;
background-image:url(../../images/gallery_bg_comment.gif); background-repeat:no-repeat; background-position:left top;
}
#contents .galleryCap{
width:130px;
display:block;
padding:20px 5px 0 5px; 
line-height:1.5;
text-align:center;
float:right;
font-size:85%;
background-image:url(../../images/gallery_bg_caption.gif); background-repeat:no-repeat; background-position:left top;
}

#contents .next{
width:50px;
height:17px;
float:right;
margin-top:7px;
margin-right:35px;
}
#contents .preview{
width:50px;
height:17px;
float:left;
margin-top:7px;
margin-left:35px;
}

/*========== DETAIL ==========*/

#contents .galleryTxtDtl{
width:100%;
display:block;
padding-top:10px; 
line-height:1.4;
text-align:center;
}
#contents #galleryDtl img{
display:block; margin: 0 auto; text-align: center;
}


/*========== news ==========*/

#contents .news{
padding:0; margin:0;
line-height:2.5;
}
#contents .news a:link {color: #fff; text-decoration: underline;}
#contents .news a:visited {color: #fff; text-decoration: underline;}
#contents .news a:hover {color: #e4007c; text-decoration: underline;}


/*========== about ==========*/

#contents .about{
width:760px;
margin: 0 auto;
border:0;
}
#contents .about td{
padding:3px 0;
line-height:1.8;
}
#contents .about .item{
vertical-align:top;
width:88px;
}
#contents .about img{
float:left;
margin-right:0.5em;
vertical-align:middle;
}
#contents .about .mail{
vertical-align:middle;
width:150px;
text-indent:25px;
background-image:url(../../about/images/icn_mail.gif); background-repeat:no-repeat; background-position:left center;
}

/*========== program ==========*/
#contents .schedule{
width:670px;
margin: 0 auto;
border:0;
}
#contents .schedule .schBox{
width:223px;
height:52px;
float:left;
cursor:pointer;
cursor:hand;
}
#contents .schedule .arrowLine{
width:670px;
background-image:url(../../program/images/sch_arrowline.gif); background-repeat:no-repeat; background-position:left bottom;
border:0; margin:0; padding:0;
}
#contents .schedule .arrowLine td{
width:223px;
}
#contents .schedule .arrowLine p{
float:right;
margin:0 0 20px 0;
}
#contents .fee{
width:760px;
background-image:url(../../program/images/fee_bg.gif); background-repeat:repeat-y;
}
#contents .fee .feeTxt{
width:223px;
padding:15px;
float:left;
line-height:1.4;
}
#contents .fee .feeTxt2{
width:223px;
padding:15px 15px 15px 8px;
float:left;
line-height:1.4;
}
#contents .fee img{
margin-bottom:3px;
}
#contents .feeTxt3{
padding:0px 0px 0px 10px;
line-height:1.4;
}

#tooltip{
width:240px;
height:100px;
padding:20px 20px 20px 25px; 
/*border:1px solid #e3007c;*/
background:#eee;
background-image:url(../../program/images/sch_toolbg.gif); background-repeat:no-repeat; background-position:left top;
color:#222;
line-height:1.6;
} 

/*========== example ==========*/
#contents .exBox{
width:142px;
height:340px;
margin-right:12px;
float:left;
}
#contents .exBoxR{
width:142px;
height:340px;
margin-right:0px;
float:left;
}
#contents .exBox2{
width:374px;
height:185px;
margin-right:12px;
float:left;
}
#contents .exBox2R{
width:374px;
height:185px;
margin-right:0px;
float:left;
}
#contents .exBox img,
#contents .exBoxR img{
margin:0;padding:0;border:0;
}
#contents .exBox2 img,
#contents .exBox2R img{
float:left;
margin:0;padding:0;border:0;
}
#contents a{
margin:0;padding:0;border:0;
}
#exBnr{
width:780px;height:40px;
margin: 0 auto;
}
.exBnrBox{
width:200px;
float:right;
margin-left:10px;
}









