@charset "shift_jis";


body{
	background-color: #F6F6F6;
	text-align: center;
	color: #000000;
	font-size: 12px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height: 1.4em;
	background-image: url(images/bg-gray.gif);
}

table {
	
	border-collapse:collapse;
	color: #3C3C3C;
	font-size: 12px;
}

#wrapper{
	background-color: #ffffff;
	width: 660px;
	text-align: left;
	margin: 0px auto 0px auto;
	padding: 40px 30px 0px 30px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #DFDFDF;
		
}

img{
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;	
	}

/**************************************************************
*********************メイン　メニュー　　　**************************　
****************************************************************/

#navi {
	width: 100%;
	margin-right: 10px;
	height: 20px;
	position: relative;
}
#navi li {
	
	}

#navi li.home a{
	display: block;
	width: 61px;
	height: 20px;
	background-image: url(images/home.gif);
	background-repeat: no-repeat;
}
#navi li.home a:hover{
	background-image: url(images/home1.gif);
	background-repeat: no-repeat;
}
#navi #dd li.info a{
	display: block;
	width: 51px;height: 20px;
	background-image: url(images/info.gif);
	background-repeat: no-repeat;
}
#navi #dd li.info a:hover{
	background-image: url(images/info1.gif);
	background-repeat: no-repeat;
}
#navi #dd li .works a{
	display: block;
	width: 68px;height: 20px;
	background-image: url(images/works.gif);
	background-repeat: no-repeat;
}

#navi #dd li .works a:hover{
	background-image: url(images/works1.gif);
	background-repeat: no-repeat;
}
#navi li.profile a{
	display: block;
	width: 66px;height: 20px;
	background-image: url(images/profile.gif);
	background-repeat: no-repeat;
}
#navi li.profile a:hover{
	background-image: url(images/profile1.gif);
	background-repeat: no-repeat;
}
#navi #dd li .mynote a{
	display: block;
	width: 82px;height: 20px;
	background-image: url(images/mynote.gif);
	background-repeat: no-repeat;
}
#navi #dd li .mynote a:hover{
	background-image: url(images/mynote1.gif);
	background-repeat: no-repeat;
}
#navi li.contact a{
	display: block;
	width: 102px;height: 20px;
	background-image: url(images/contact.gif);
	background-repeat: no-repeat;

}
#navi li.contact a:hover{
	background-image: url(images/contact1.gif);
	background-repeat: no-repeat;
}
#navi li.links a{
	display: block;
	width: 46px;height: 20px;
	background-image: url(images/links.gif);
	background-repeat: no-repeat;
}
#navi li.links a:hover{
	background-image: url(images/links1.gif);
	background-repeat: no-repeat;
}




#dd {
  margin-left: 25%;
  padding: 0px;
}

#dd li {
  margin: 0;
  padding: 0;
  list-style: none;
  float: right;
  font-size: 11px;
}

#dd li a.menu {
  display: block;
  text-align: center;
  padding: 4px 2px;
  margin: 0 1px 0 0;
  color: #FFF;
  width: 68px;
  height:20px;
  text-decoration: none;
}

#dd li a.menu:hover {
  background: #FFFFFF;
}


/*****  works ******/
.submenu1 {
  background: #FFFFFF;
  visibility: hidden;
  position: absolute;
  top: 20px;
  left: 290px;
  z-index: 3;  
  border: 1px solid #CCCCCC;
}


.submenu1 a {
	display: block;
	font-size: 11px;
	text-align: left;
	text-decoration: none;
	padding: 2px 2px 2px 4px;
	color: #fff;
	margin: 0px;
	background-color: #7D84C9;
	border-bottom: solid 1px #E1E1E1;	
}

.submenu1 a:hover {
	color: #4957B8;
	background-color: #F4FAFF;
}

/*****  info  ******/
.submenu2 {
  background: #FFFFFF;
  visibility: hidden;
  position: absolute;
  top: 20px;
  left: 430px;
  z-index: 3;
  border: 1px solid #CCCCCC;
}
.submenu2 a {
	display: block;
	font-size: 11px;
	text-align: left;
	text-decoration: none;
	padding: 2px 2px 2px 4px;
	color: #fff;
	margin: 0px;
	background-color: #3FC5B3;
	border-bottom: solid 1px #E1E1E1;
	
}

.submenu2 a:hover {
 	color: #39A294;
	background-color: #E7FEF0;
}


/**************************************************************
******  トップ　ページ　*****************************************
****************************************************************/

/*****************トップ　ヘッダー*******************　
*****************************************************/
#top-header{
	position: relative;
	padding-bottom:10px;
	padding-left: 7px;
}
.imgt1{margin-left:-37px;padding-bottom: 10px;}
.imgt2{margin-left:-12px;}
.imgmoji{
	font-size: 110%;
	position: absolute;
	top: 15px;
	left: 590px;
}
.imgmoji a {
	color: #0033FF;
	text-decoration: none;
}
.imgmoji a:hover {
	color: #FF0000;
	text-decoration: underline;
}
/**************************************************************/
#top {
	width: 100%;
	clear: both;
	padding-bottom: 30px;
	padding-left: 5px;
}

.con1 {
	width: 81%;
	margin: 0px 0px 0px 50px;
	padding: 30px 0px 15px 0px;
	font-size: 95%;
}
.con1 p{	
	line-height: 1.5;	
}
.con2{
	width: 100%;
	margin: 0px auto 0px auto;
	padding-top: 40px;
}
.con2top {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
}
.con2bottom {
	margin:  0px 0px 30px 10px;
	padding-top: 10px;
}
.con2bottom dl{padding: 0px 60px 15px 0px;line-height: 1.5;}
.con2bottom dt{
	background-image: url(images/icon3.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	padding-left: 19px;
	padding-bottom: 0px;
	padding-top: 0px;		
}
.con2bottom dd{
	padding-left: 50px;
	padding-bottom: 10px;
}

.sign {
	text-align: right;
	font-family: "ＤＦ祥南行書体W5", "ＭＳ Ｐ明朝";
	font-size: 110%;
	font-weight: bold;
}

/**************************************************************
*********************  サブページ *******************************
****************************************************************/

/*********************サブ　ヘッダー　　　****************　
**********************************************************/
#header{
	margin-bottom:5px;	
}
#header-back {
	top: -300px;
	position: absolute;
}

.img2{
	margin-left: 0px;
	padding-bottom: 20px;
	padding-top: 5px;
}
.navi-line {
	position: absolute;
	top: 18px;
	text-align: center;
}
/****************************************************************/
#sub {	
	width: 100%;
	clear: both;
	margin-top: 6px;
}
#sub h2 {height: 22px;}
/**************************************************************
  works
****************************************************************/
#work {
	width: 100%;
	margin: 45px auto 10px auto;
	padding-top:0px;
}
.gallery {text-align:left;}
.gallery img{
	margin-right:0;
	margin-left:0;
	margin-bottom: 30px;	
	}
.gallerya {
	font-weight: bold;
	display:block;
	height: 20px;
	margin-top: 45px;margin-bottom: 8px;
	text-align:left;
	}
	
.gallery1 {margin-top: -22px;}
.gallery1 img{
	margin-right:0;
	margin-left:0;
	margin-bottom: 30px;
	
	}
.gallery1 p{
	font-weight: bold;
	line-height: 50px;
	text-align:left;
	}

.gazou1 {margin-bottom: 5px;}


/**************************************************************
  info
****************************************************************/
#info {
	width: 100%;
	margin-left: 20px;
	margin-top:20px;
}
#info img.midashi1 {
	margin-left: -20px;
}
#info a{
	color: #0066CC;	
}
#info a:hover{
	text-decoration: underline;
}


#info .dt-title{
	margin: 0px 5px 0px 5px;
	padding-left: 10px;
	padding-bottom: 0px;
}

.info1 {
	font-size: 110%;
	margin: 0px 5px 10px 5px;
	padding-left: 10px;
	padding-bottom:30px;
}

.info1 h3{
	font-size: 115%;
	color: #000;
	background-image: url(images/marus1.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 23px;
}
.info1 dl{	
	margin-bottom: 20px;
}
.info1 dt{	
	padding-left: 25px;
	padding-top: 5px;
}
.info1 dd{padding-left: 100px;}

.infog {
	font-size: 110%;
	margin: 0px 5px 10px 5px;
	padding-left: 10px;
	padding-bottom:30px;
}

.infog h3{
	font-size: 115%;	
	background-image: url(images/marug1.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 23px;
}
.infog dl{
	padding-bottom: 30px;	
}
.infog dt{
	padding-left: 25px;
	padding-top: 5px;
	line-height: 1.5;	
}
.infog dd{padding-left: 100px;}

.infoe {
	margin: 0px 5px 10px 5px;
	padding-left: 10px;
	padding-bottom:30px;
	color: #8B939A;
}

.infoe h3{
	font-size: 110%;
	background-image: url(images/icon9.gif);
	background-repeat: no-repeat;
	background-position: 0px -1px;
	padding: 3px 0px 5px 45px;
	
}
.infoe dl{
	padding-bottom: 30px;	
}	
.infoe dt{
	padding-left: 25px;
	padding-top: 5px;	
}
.infoe dd{
	padding-left: 93px;
}
#info .red {color: #933; }
#info .h3a {
	margin: 0px 0px 10px 90px;
}
/**************************************************************
  profile
****************************************************************/
#profile {
	padding-bottom: 30px;
	margin-top: 0px;
	width: 100%;
}
#profile img{
	margin-top: 2px;
	border: none;
}
#profile a {color:#3C3C3C;}
#profile a:hover {
	color:#CC3300;
	text-decoration: underline;
}
#profile a:visited {color:#3C3C3C;}
#profile table.pro{
	clear:both;
	width: 550px;
	margin-left: 70px;	
}

#profile table.pro-e{
	clear:both;
	width: 600px;
	margin-left: 40px;	
}


#profile table.pro a {color:#3C3C3C;}
#profile table.pro a:hover {
	color:#CC3300;
	text-decoration: underline;
}
#profile table.pro a:visited {color:#3C3C3C;}

#profile table.pro td{	
	line-height: 1.5em;
	vertical-align: top;	
	padding-top: 3px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 10px;
	
}

#profile table.pro-e td{	
	line-height: 1.5em;
	vertical-align: top;	
	padding-top: 3px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 10px;
	border-top:dotted 1px;
}

#profile table.pro td.td1 {text-align:left;	width: 90px;}

#profile table.pro-e td.td1 {text-align:left;	width: 140px;}

.fon3 {	padding-left: 50px;padding-top: 20px;}

#aa {padding-left: 40px;}
.fon5 {
	padding-left: 70px;
	padding-bottom: 10px;
	font-size: 120%;
	float: left;
}

.fon5a {font-size: 90%;}
.fon6 {	float: right;}
.fon6 a{
	width: 79px;
	height: 23px;
	display: block;
	background-image: url(images/english.jpg);
	background-repeat: no-repeat;
}
.fon6 a:hover{
	background-image: url(images/english1.jpg);
	background-repeat: no-repeat;	
}
.fon6e {}
.fon6e a{
	width: 79px;
	height: 23px;
	display: block;
	background-image: url(images/japan.jpg);
	background-repeat: no-repeat;
	margin-left:540px;
}
.fon6e a:hover{
	background-image: url(images/japan1.jpg);
	background-repeat: no-repeat;	
}
.fon7 {
	color: #666666;
	margin-top:0px;
	margin-left:18px;
	margin-bottom: 30px;
	font-size: 90%;
	text-align: right;	
}
.fon8 {font-weight:bold;font-size:16px;font-family:Book Antiqua, "MS PGothic";}
.fon8b {margin-bottom: 10px;}
/**************************************************************
 my note
****************************************************************/
#note {
	width: 90%;
	margin-left:auto;
	margin-right:auto;
	padding-bottom: 30px;
}
#note h3 {
	font-weight:bold;
	font-size:114%;
	margin-left: -20px;
	padding: 20px 0px 0px 0px;
}
#note h4 {
	font-weight:normal;
	font-size:106%;
	padding: 3px 0px 3px 30px;
	color: #B1630C;
	margin: 40px 0px 10px;
	background-image: url(images/pen2.gif);
	background-repeat: no-repeat;
	
}
#note img.italia {
	text-align: center;
}
#note p {line-height: 1.5em;}
#note span{ color: #247553; }
.fon6 { color: #2F826F; 
}
/**************************************************************
*********************　リンク　　　**************************　
****************************************************************/
#links {
	width: 90%;
	margin: 0px auto 0px auto;
	padding: 30px 0px 30px 0px;
}
#links li {
	padding:0px 0px 5px 20px;
}
#links li a{
	color: #066;
	font-size: 110%;
	background-image: url(images/icon5.gif);
	background-repeat: no-repeat;
	padding-left:20px;
}
#links li a:hover{
	background-image: url(images/icon2.gif);
	background-repeat: no-repeat;
	color: #09C;
}

/**************************************************************
*********************　コンタクト　　　**************************　
****************************************************************/
#contact {
	
	margin-top: 50px;
	padding-bottom: 30px;		
}
#contact form{
	width: 80%;	
	margin-right: auto;
	margin-left: auto;
}
#contact form p{
	margin-bottom: 15px;	
}
#contact input,textarea{
	background-color: #ffffff;
	border: 1px solid #BBBBBB;
	padding: 2px;
}
.fon1 {
	font-family: "ＭＳ ゴシック", "MS Gothic", "Osaka−等幅", Osaka-mono, monospace;		
}


/**************************************************************
*********************　フッター　　　**************************　
****************************************************************/
#footer {
	margin-left:auto;
	margin-right:auto;
	width: 720px;
}

#footer .foot{
	padding-top: 2px;	
	font-size: 90%;	
	text-align: right;
}

/**************************************************************
*********************　共通情報　　　**************************　
****************************************************************/
.right {text-align: right;}
.left {text-align: left;}
.center {text-align: center;}
.stl1 {	color: #666574;}
.fon2 {
	color: #CCCC66;
	font-weight:bold;
}
.mojil {font-size:14px;color:#F33}
.red1{color:#F03}
.size3{font-size:12px;}
.blue{color:#03F}