@charset "utf-8";


html, body {
	background: url(../images/bg_img.png) repeat;
	height:1500px;
	width: 1200px;
	margin-right: auto;
	margin-left: auto;
}


#twittertag {
text-indent: -999px;
overflow: hidden;
position: fixed;
height: 80px;
width: 60px;
z-index: 800;
background: url(../../common/images/twitter_tag.png) no-repeat;
top: -15px;
right: 110px;
}


#twittertag:hover{ top: -20px; }


#fecebooktag {
background: url(../../common/images/facebook_tag.png) no-repeat;
text-indent: -999px;
overflow: hidden;
position: fixed;
height: 80px;
width: 60px;
top: -15px;
z-index: 800;
right: 50px;
}

#fecebooktag:hover{ top: -20px; }




/*ヘッダーエリア　ナビゲーションタグ部分*/


#headerArea {
top:-450px;
position: fixed;
height: 508px;
width: 258px;
z-index: 900;
left: 30px;
}

#headerArea:hover{
top:-30px;
-webkit-transition: top 1s linear;  
}

#navigation {
background: url(../images/gNavitag.png) no-repeat;
height: 508px;
width: 258px;
float: left;
z-index: 900;
}

#navigation li {
	margin-bottom: 10px;
	position: relative;
	margin-left: 30px;
	top: 200px;
}



/*top of page*/

#modoru a {
	background-image: url(../images/topofpage.png);
	background-repeat: no-repeat;
	height: 185px;
	width: 180px;
	position: fixed;
	right: -40px;
	bottom: -30px;
	text-indent: -999px;
	overflow: hidden;
	z-index: 800;
	float: right;
}


#modoru a:hover {
	background-image: url(../images/topofpage_on.png);
	background-repeat: no-repeat;
	height: 185px;
	width: 180px;
	position: fixed;
	right: -30px;
	bottom: -30px;
	text-indent: -999px;
	overflow: hidden;
	z-index: 800;
	float: right;
}



/*index部分*/

#mainContents {
	width: 900px;
	margin-right: auto;
	margin-left: auto;
	z-index: 10;
	position: relative;
	height: 1100px;
	margin-bottom: 0px;
	background-image: url(../images/kihon.png);
	background-repeat: no-repeat;
	top: -285px;
	clear: both;
	float: right;
}

#top {
	position: absolute;
	top: 0px;
}

#counter1 {
position: fixed;
top: 0px;
z-index: 500;
right: 0px;
text-align: center;
text-decoration: none;
}

#twitter {
	position: relative;
	top: 200px;
	z-index: 500;
	clear: both;
	float: right;
	right: 90px;
}


#mainContents h1 {
	background: url(../images/yurugura_h1.png) no-repeat;
	height: 50px;
	width: 150px;
	position: absolute;
	z-index: 20;
	top: 517px;
	left: 348px;
	text-indent: -999px;
	overflow: hidden;
	clear: both;
	float: right;
}

#aisatsu {
	position: relative;
	height: 354px;
	width: 459px;
	top: 570px;
	clear: both;
	float: left;
	background-image: url(../images/peper.png);
	background-repeat: no-repeat;
	left: 40px;
}
	
#aisatsu p {
font-size: 12px;
color: #655244;
font-weight: bold;
padding-left: 30px;
padding-right: 30px;
position: relative;
padding-bottom: 5px;
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
left: -78px;
text-align: center;
top: 50px;
}




#aisatsu h4 {
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size: 14px;
font-weight: bold;
color: #655244;
position: relative;
left: 90px;
top: 60px;
margin-bottom: 10px;
margin-top: 10px;
}



#aisatsu li {
color: #655244;
font-size: 11px;
position: relative;
left: 50px;
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
margin-bottom: 1px;
top: 55px;
}

#aisatsu #kokuchi {
	font-size: 14px;
	color: #C00;
}

#hiduke {
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size: 11px;
color: #655244;
position: relative;
left: 100px;
top: 598px;
z-index: 550;
clear: both;
float: left;
font-weight: bold;
}





#kokeshi {
	position: absolute;
	top: 640px;
	left: 300px;
	height: 376px;
	width: 294px;
	background: url(../images/indexkokeshi.png) no-repeat;
	text-indent: -999px;
	overflow: hidden;
	z-index: 550;
	}
	
#down1 a {
	position: relative;
	left: 30px;
	top: 1000px;
	background-image: url(../images/ribon.png);
	background-repeat: no-repeat;
	height: 67px;
	width: 53px;
	text-indent: -999px;
	overflow: hidden;
	z-index: 500;
	clear: both;
	float: left;
}

#down1 a:hover{
	top: 990px;
} 


/*Profile部分*/

#ProfileBlock {
	height: 1100px;
	width: 850px;
	margin-right: auto;
	margin-left: auto;
	z-index: 20;
	position: relative;
	margin-top: -350px;
	background: url(../images/kihon.png) no-repeat;
	clear: both;
	float: right;
	right: 30px;
}


#ProfileBlock h3 {
	background: url(../images/Profile_h3.png) no-repeat;
	text-indent: -999px;
	overflow: hidden;
	z-index: 50;
	height: 50px;
	width: 150px;
	left: 348px;
	top: 515px;
	position: absolute;
}


#profiletop {
	position: absolute;
	top: 300px;
}


#profilepaper {
	position: relative;
	height: 395px;
	width: 707px;
	top: 615px;
	left: 70px;
	z-index: 20;
	clear: both;
	float: left;
	background-image: url(../images/Profile_paper.png);
	background-repeat: no-repeat;
}

#ProfileBlock .nigaoe {
text-indent: -999px;
overflow: hidden;
position: relative;
z-index: 200;
height: 153px;
width: 133px;
left: 55px;
top: 80px;
background-image: url(../images/nigaoe.png);
background-repeat: no-repeat;
margin: 0px;
float: left;
clear: both;
}




#ProfileBlock p {
	z-index: 200;
	height: 300;
	width: 420px;
	position: absolute;
	top: 90px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 14px;
	color: #655244;
	font-weight: normal;
	float: right;
	display: block;
	left: 220px;
	clear: both;
}


#ProfileBlock h4 {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 13px;
	color: #655244;
	position: absolute;
	left: 50px;
	top: 250px;
	font-weight: bold;
}

#ProfileBlock dl {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 11px;
	color: #655244;
	position: absolute;
	top: 280px;
	width: 570px;
	line-height: 1.4;
	z-index: 200;
	right: 60px;
}

#ProfileBlock dd {
margin-top: -1.4em;
margin-bottom: 0.5px;
padding-bottom: .25px;
padding-left: 60px;
}

#down2 a {
	position: relative;
	top: 600px;
	background-image: url(../images/ribon.png);
	background-repeat: no-repeat;
	height: 67px;
	width: 53px;
	text-indent: -999px;
	overflow: hidden;
	z-index: 900;
	clear: both;
	float: right;
	right: 30px;
}

#down2 a:hover{
	top: 590px;
} 


/*Prortfolio部分（目次）*/

#PrortfolioBlock #mokuji {
	background: url(../images/kihon.png) no-repeat;
	height: 1100px;
	width: 850px;
	margin-right: auto;
	margin-left: auto;
	position: relative;
	z-index: 30;
	margin-top: -70px;
	right: 80px;
	clear: both;
	float: right;
}

#mokujitop {
	position: absolute;
	top: 300px;
}




#PrortfolioBlock #mokuji h3 {
	background: url(../images/portfolio_h3.png) no-repeat;
	text-indent: -999px;
	overflow: hidden;
	z-index: 50;
	height: 50px;
	width: 200px;
	left: 324px;
	top: 520px;
	position: absolute;
}



#down3 a {
	position: relative;
	left: 30px;
	top: 1000px;
	background-image: url(../images/ribon.png);
	background-repeat: no-repeat;
	height: 67px;
	width: 53px;
	text-indent: -999px;
	overflow: hidden;
	z-index: 900;
	clear: both;
	float: left;
}

#down3 a:hover{
	top: 990px;
} 


#PrortfolioBlock #mokuji .tocotoco {
	background: url(../images/portfolio_toco.png) no-repeat;
	text-indent: -999px;
	overflow: hidden;
	position: absolute;
	z-index: 80;
	height: 270px;
	width: 193px;
	top: 740px;
	left: 140px;
}

#PrortfolioBlock #mokuji .tocotoco:hover {
	top: 730px;
}

#PrortfolioBlock #mokuji .tocotocomemo {
	background-image: url(../images/mokujimemo_03.png);
	background-repeat: no-repeat;
	text-indent: -999px;
	overflow: hidden;
	height: 108px;
	width: 106px;
	position: absolute;
	left: 40px;
	top: 880px;
	z-index: 100;
}

#PrortfolioBlock #mokuji .creatorsmarket {
	background: url(../images/portfolio_cre.png) no-repeat;
	text-indent: -999px;
	height: 188px;
	width: 189px;
	overflow: hidden;
	position: absolute;
	left: 0px;
	top: 610px;
	z-index: 500;
}

#PrortfolioBlock #mokuji .creatorsmarket:hover {
	top: 600px;
}

#PrortfolioBlock #mokuji .cremamemo {
	text-indent: -999px;
	overflow: hidden;
	position: absolute;
	width: 87px;
	top: 650px;
	left: 190px;
	z-index: 100;
	height: 75px;
	background: url(../images/mokujimemo_04.png) no-repeat;
}


#PrortfolioBlock #mokuji .news {
	background: url(../images/portfolio_news.png) no-repeat;
	text-indent: -999px;
	height: 176px;
	width: 260px;
	overflow: hidden;
	position: absolute;
	z-index: 80;
	left: 330px;
	top: 640px;
}


#PrortfolioBlock #mokuji .infomemo {
	position: absolute;
	left: 348px;
	z-index: 100;
	top: 685px;
	font-size: 12px;
	color: #655244;
	display: block;
	height: 120px;
	width: 220px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

#PrortfolioBlock #mokuji .minne {
	text-indent: -999px;
	overflow: hidden;
	position: absolute;
	z-index: 80;
	height: 125px;
	width: 125px;
	top: 850px;
	left: 370px;
	background-image: url(../images/minne_c_125_125.gif);
	background-repeat: no-repeat;
}

#PrortfolioBlock #mokuji .crapaca:hover {
	top: 830px;
}



#PrortfolioBlock #mokuji .revedesign {
	background: url(../images/portfolio_reve.png) no-repeat;
	text-indent: -999px;
	overflow: hidden;
	position: absolute;
	z-index: 80;
	height: 267px;
	width: 270px;
	top: 565px;
	left: 600px;
}

#PrortfolioBlock #mokuji .revedesign:hover {
	top: 555px;
}



#PrortfolioBlock #mokuji #revedesignnew {
	background-image: url(../images/portfolio_cjcube.png);
	background-repeat: no-repeat;
	text-indent: -999px;
	height: 192px;
	width: 267px;
	overflow: hidden;
	position: absolute;
	z-index: 900;
	top: 820px;
	left: 550px;
}


#PrortfolioBlock #mokuji .revecjcubememo.png_bg {
	position: absolute;
	top: 870px;
	z-index: 950;
	font-size: 12px;
	color: #655244;
	display: block;
	height: 150px;
	width: 230px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	left: 565px;
}


/*Contact部分*/

#ContactBlock {
	background: url(../images/kihon.png) no-repeat;
	height: 1100px;
	width: 850px;
	position: relative;
	margin-right: auto;
	margin-left: auto;
	z-index: 40;
	clear: both;
	float: right;
	right: 70px;
	margin-top: -70px;
	}
	
	
#contacttop {
	position: absolute;
	top: 400px;
}
	
#ContactBlock h3 {
	background: url(../images/contact_h3.png) no-repeat;
	text-indent: -999px;
	overflow: hidden;
	z-index: 50;
	height: 50px;
	width: 200px;
	left: 344px;
	top: 510px;
	position: absolute;
}


#blogtag {
	text-indent: -999px;
	overflow: hidden;
	position: absolute;
	height: 80px;
	width: 60px;
	z-index: 800;
	background-image: url(../../common/images/blog_tag.png);
	background-repeat: no-repeat;
	bottom: 95px;
	left: 250px;
	clear: both;
	float: left;
}

#blogtag:hover{ bottom: 90px;}


#twittertag2 {
	text-indent: -999px;
	overflow: hidden;
	position: absolute;
	height: 80px;
	width: 60px;
	z-index: 800;
	background: url(../../common/images/twitter_tag.png) no-repeat;
	left: 400px;
	bottom: 95px;
}


#twittertag2:hover{ bottom: 90px;}


#fecebooktag2 {
	background: url(../../common/images/facebook_tag.png) no-repeat;
	text-indent: -999px;
	overflow: hidden;
	position: absolute;
	height: 80px;
	width: 60px;
	z-index: 800;
	left: 550px;
	bottom: 95px;
}

#fecebooktag2:hover{ bottom: 90px;}


#contactpaper {
	position: absolute;
	width: 650px;
	color: #655244;
	background-image: url(../images/contact_Paper_2.png);
	background-repeat: no-repeat;
	height: 308px;
	top: 640px;
	left: 110px;
	z-index: 800;
	clear: both;
	float: left;
}



#ContactBlock p {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 14.5px;
	position: relative;
	width: 540px;
	color: #655244;
	font-weight: bold;
	height: 235px;
	top: -50px;
	left: 0px;
	padding-top: 120px;
	padding-left: 50px;
}




#down4 a {
	position: relative;
	top: 1000px;
	background-image: url(../images/ribon.png);
	background-repeat: no-repeat;
	height: 67px;
	width: 53px;
	text-indent: -999px;
	overflow: hidden;
	z-index: 900;
	clear: both;
	float: right;
	right: 30px;
}

#down4 a:hover{
	top: 990px;
} 


/*Link部分*/

#linkBlock {
	background: url(../images/kihon.png) no-repeat;
	height: 1100px;
	width: 900px;
	position: relative;
	z-index: 40;
	margin: -70px auto 0px;
	clear: both;
	float: right;
	right: 70px;
	}
	
#linktop {
	position: absolute;
	top: 400px;
	}
	
	
#linkBlock h3 {
	background: url(../images/link_h3.png) no-repeat;
	text-indent: -999px;
	overflow: hidden;
	z-index: 50;
	height: 50px;
	width: 200px;
	left: 344px;
	top: 510px;
	position: absolute;
}


#revedesign {
	position: relative;
	top: 665px;
	float: left;
	clear: both;
	left: 120px;
}

#revedesign:hover{
		top: 660px;
	}
	
	
#minne {
	position: relative;
	top: 545px;
	float: left;
	clear: both;
	left: 335px;
}

#crapaca:hover{
		top: 540px;
}


#kurikore {
	position: relative;
	float: left;
	top: 420px;
	left: 650px;
	clear: both;
}

#kurikore:hover{
		top: 415px;
}


#atcreatorz {
	position: relative;
	top: 435px;
	left: 650px;
	clear: both;
	float: left;
}


#atcreatorz:hover{
		top: 430px;
}


#creators {
	position: relative;
	left: 650px;
	top: 445px;
	clear: both;
	float: left;
}

#creators:hover{
		top: 440px;
}

#artsurf {
	clear: both;
	float: left;
	position: relative;
	top: 455px;
	left: 650px;
}


#artsurf:hover{
		top: 450px;
}


#shinkanet {
	clear: both;
	float: left;
	position: relative;
	top: 465px;
	left: 650px;
}


#shinkanet:hover{
		top: 460px;
}


#dts {
	clear: both;
	float: left;
	position: relative;
	top: 475px;
	left: 650px;
}


#dts:hover{
		top: 470px;
}

#cj3 {
	clear: both;
	float: left;
	position: relative;
	top: 485px;
	left: 650px;
}


#cj3:hover{
		top: 480px;
}


#yuruguraback {
	clear: both;
	float: left;
	position: relative;
	top: 340px;
	left: 60px;
}

#yurugurabanner_memo {
	position: relative;
	top: 410px;
	z-index: 510;
	left: 100px;
	clear: both;
	float: left;
	color: #655244;
	font-size: 14px;
	font-weight: bold;
}

#yurugura {
	clear: both;
	float: left;
	position: relative;
	left: 140px;
	top: 285px;
}

/*footerAre部分*/

#footerArea address {
	width: 550px;
	background: url(../images/footer_bg.png) no-repeat;
	text-indent: -9999px;
	overflow: hidden;
	z-index: 990;
	position: relative;
	height: 280px;
	left: -100px;
	margin-top: 100 0px;
	margin-right: auto;
	margin-left: auto;
	float: right;
	top: -120px;
}