@charset "UTF-8";
/*===================================

	デフォルトのCSS
	IEの条件分岐が所々あるので忘れない、忘れない…
	
	（・ω・）ノ < I Wish You Happiness！
	
===================================*/
/*===================================
	
	body初期設定とリセット
	
===================================*/
* {
	padding:0;
	margin:0;
}
html {
	height:100%;
}
body {
	height:100%;
	background-image:url(../common_img/back.jpg);
	background-repeat:repeat;
	color:#FFFFFF;
	font-size:small;
	font-family: "メイリオ","Meiryo",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
	line-height:1.5;
	
}
* html body {	/* for IF6 */
	font-family: "ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
}
img {
	border: none;
}
div {
	text-align:left;
}
hr {
	display: none;
}
h1,h2,h3,h4,h5,h6 {
	text-align:left;
	font-size: 100%;
}
p {
	text-align:left;
}
ul{
	list-style:none;
}
a {
	color:#483A2B;
}
a:visited {
	color:#483A2B;	
}
a:hover {
	color:#996600;
	text-decoration:none;
}
/*汎用スタイル*/
.clear_fix{
	clear:both;
}

/*===================================

	レイアウト関係
	indexpageはfooter以外別記
	
===================================*/
/*--------------------------

	ロゴまわり（各コンテンツページ）
	ロゴ・ページタイトル
	
--------------------------*/
div#side_box{
	position:absolute;
	top:13%;
	width:250px;
	margin-bottom:15px;
	z-index:11;
}
div#side_box h1{
	width:250px;
	border-bottom:3px #000 solid;
	padding-bottom:8px;
	text-align:right;
}
div#side_box p{
	width:250px;
	text-align:right;
	margin-bottom:15px;
	padding-top:5px;
	font-size:0;/*ie6対策*/
}
/*--------------------------

	コンテンツの各ベースボックス
	
--------------------------*/
div#cont_base_nikki{
	position:absolute;
	z-index:10;
	width:100%;
	height:306px;
	background-image:url(../con_img/in_con1_base.png);
	background-repeat:repeat-x;
	margin-top:208px;
	top:13%;
}
div#cont_base_sakuhin{
	position:absolute;
	z-index:10;
	width:100%;
	height:306px;
	background-image:url(../con_img/in_con2_base.png);
	background-repeat:repeat-x;
	margin-top:208px;
	top:13%;
}
* html div#cont_base_sakuhin{/*IE6*/
	position:absolute;
	z-index:10;
	width:100%;
	height:306px;
	background-image:url(../con_img/in_con2_base.gif);
	background-repeat:repeat-x;
	margin-top:208px;
	top:13%;
}
div#cont_base_my{
	position:absolute;
	z-index:10;
	width:100%;
	height:306px;
	background-image:url(../con_img/in_con3_base.png);
	background-repeat:repeat-x;
	margin-top:208px;
	top:13%;
}
* html div#cont_base_my{/*IE6*/
	position:absolute;
	z-index:10;
	width:100%;
	height:306px;
	background-image:url(../con_img/in_con3_base.gif);
	background-repeat:repeat-x;
	margin-top:208px;
	top:13%;
}
div#cont_base_mail{
	position:absolute;
	z-index:10;
	width:100%;
	height:306px;
	background-image:url(../con_img/in_con4_base.png);
	background-repeat:repeat-x;
	margin-top:208px;
	top:13%;
}
div#cont_base_photo{
	position:absolute;
	z-index:10;
	width:100%;
	height:306px;
	background-image:url(../con_img/in_con5_base.png);
	background-repeat:repeat-x;
	margin-top:208px;
	top:13%;
}
div.cont_box{
	position:relative;
	width:780px;
	height:280px;
	margin:0 auto;
}
/*-----------------------------------------------

	フッター
	
-----------------------------------------------*/
#footer {
	position:absolute;
	bottom:0;
	width:100%;
	z-index:200;
}
p#copyright {
	font-size:80%;
	color:#000000;
	text-align:right;
}
p#copyright a{
	text-decoration:none;
}
/*-----------------------------------------------

	中ページのグローバルナビ関係
	
-----------------------------------------------*/
div#in_navibox ul{
	position:absolute;
	z-index:0;
	width:481px;
	height:441px;
	top:0;
	right:0;
	background-image:url(../navi_img/navi_in_base.jpg);
	background-repeat:no-repeat;
}
li#innavi_btn_top{
	position:absolute;
	z-index:1;
	width:80px;
	height:123px;
	left:6px;
	top:12px;
}
li#innavi_btn_nikki{
	position:absolute;
	z-index:1;
	width:117px;
	height:130px;
	right:208px;
	top:36px;
}
li#innavi_btn_sakuhin{
	position:absolute;
	z-index:3;
	width:97px;
	height:134px;
	right:92px;
	top:166px;
}
li#innavi_btn_my{
	position:absolute;
	z-index:1;
	width:168px;
	height:85px;
	right:14px;
	top:-1px;
}
li#innavi_btn_mail{
	position:absolute;
	z-index:1;
	width:83px;
	height:123px;
	right:242px;
	top:178px;
}
li#innavi_btn_photo{
	position:absolute;
	z-index:1;
	width:125px;
	height:82px;
	right:60px;
	top:82px;
}
/*-----------------------------------------------

	navi吹き出し関係
	■■IE6.7.8条件分岐
	
-----------------------------------------------*/
a.tip2,
a.tip3,
a.tip4,
a.tip5,
a.tip6,
a.tip7
{
	position: relative;
	text-decoration:none;
}
a:hover.tip2,
a:hover.tip3,
a:hover.tip4,
a:hover.tip5,
a:hover.tip6,
a:hover.tip7
{
	font-size: 99%; /* this is just for IE */
}
a:hover.tip2 span,
a:hover.tip3 span,
a:hover.tip4 span,
a:hover.tip5 span,
a:hover.tip6 span,
a:hover.tip7 span
{
	display: block;
}
a.tip2 span {/*TOP*/
	display: none;
	position: absolute;
	top:-105px;
	left:-70px;
	z-index: 300;
	text-align:center;
}
a.tip3 span {/*フォトアルバム*/
	display: none;
	position: absolute;
	top:-115px;
	left:-75px;
	z-index: 300;
	text-align:center;
}
a.tip4 span {/*お問い合わせ*/
	display: none;
	position: absolute;
	top:-95px;
	left:-90px;
	z-index: 300;
	text-align:center;
}
a.tip5 span {/*つくったモノ*/
	display: none;
	position: absolute;
	top:-120px;
	left:-85px;
	z-index: 300;
	text-align:center;
}
a.tip6 span {/*日記*/
	display: none;
	position: absolute;
	top:-120px;
	left:-30px;
	z-index: 300;
	text-align:center;
}
a.tip7 span {/*自己紹介*/
	display: none;
	position: absolute;
	top:-85px;
	left:-80px;
	z-index: 300;
	text-align:center;
}
/*////////////////////////////////////////////////////////////////////////////////////////////
	
	index：indexページ
	
	01:日記
	02:つくったもの
	03:自己紹介
	04:問い合わせ
	05:フォトアルバム
	
	
	※背景にpng画像を使ってるものに上手くjsが効かないので
	例外的にIE6のみgif画像で表示させているものあり。
	
	・日記（02）と自己紹介（03）のメインボックス背景
	・日記の吹き出し画像とリンクを触ったときの背景画像
	
/////////////////////////////////////////////////////////////////////////////////////////////*/
/*===================================

	index.htmlの設定（body id="index_page"）
	※Flash非表示時に表示
	
===================================*/
body#index_page #main {
	position:absolute;
	min-height:100%;
	height:auto !important;
	height:100%;	
	width:100%;
	background-image:url(../navi_img/top_n_base.jpg);
	background-repeat:no-repeat;
	background-position:right bottom;
}
/*------------------------------------

	TOPページグローバルナビゲーション
	
------------------------------------*/
ul#topnavibox {
	display:block;
	width:468px;
	height:466px;
}
li#navibtn_nikki {
	position:absolute;
	width:185px;
	height:202px;
	bottom:226px;
	right:378px;
}
li#navibtn_sakuhin {
	position:absolute;
	width:140px;
	height:207px;
	bottom:22px;
	right:205px;
}
li#navibtn_my {
	position:absolute;
	width:250px;
	height:130px;
	bottom:352px;
	right:95px;
}
li#navibtn_mail {
	position:absolute;
	width:127px;
	height:188px;
	bottom:25px;
	right:432px;
}
li#navibtn_photo {
	position:absolute;
	width:208px;
	height:123px;
	bottom:229px;
	right:137px;
}
/*------　TOPページナビの吹き出し　-----*/
a.top_speak,
a.top_speak2
{
	position: relative;
	text-decoration:none;
}
a:hover.top_speak span,
a:hover.top_speak2 span
{
	display: block;
}
a.top_speak span {
	display: none;
	position: absolute;
	top: -95px;
	left: 10px;
	z-index: 100;
	text-align:center;
}
a.top_speak2 span {
	display: none;
	position: absolute;
	top: -50px;
	left: -5px;
	z-index: 100;
	text-align:center;
}
/*------------------------------------

	TOPページロゴ周り
	
------------------------------------*/
#top_sub_box {
	position:absolute;
	width:250px;
	top:33%;
	z-index:30;
}
#top_sub_box h1{
	width:250px;
	border-bottom:3px #000 solid;
	padding-bottom:8px;
	text-align:right;
}
#top_sub_box p{
	width:250px;
	text-align:right;
	padding-top:5px;
}
/*=========================================================================================================

	以下各コンテンツスタイル定義
	
	01:日記
	02:つくったもの
	03:自己紹介
	04:問い合わせ
	05:フォトアルバム
	
	
	※背景にpng画像を使ってるものに上手くjsが効かないので
	例外的にIE6のみgif画像で表示させているものあり。
	
	・日記（02）と自己紹介（03）のメインボックス背景
	・日記の吹き出し画像とリンクを触ったときの背景画像
	
=========================================================================================================*/
/*-----------------------------------------------

	nikki関係
	
-----------------------------------------------*/
ul#nikki_simgs{
	position:absolute;
	top:27px;
	width:790px;
	height:306px;
	padding-left:10px;
	margin:0 auto;
}
ul#nikki_simgs li{
	float:left;
	width:29px;
	height:231px;
	padding:0 11px;
}
ul#nikki_simgs li a{
	display:block;
	width:25px;
	height:205px;
	padding:24px 2px 2px 2px;
	background-image:url(../con_img/in_con1_sm_back.png);
	background-position:top;
}
ul#nikki_simgs li a:hover{
	background-image:url(../con_img/in_con1_sm_back_on.png);
	background-position:top;
	
}
* html ul#nikki_simgs li a{/*IE6はgif画像*/
	display:block;
	width:25px;
	height:205px;
	padding:24px 2px 2px 2px;
	background-image:url(../con_img/in_con1_sm_back.gif);
	background-position:top;
	
}
* html ul#nikki_simgs li a:hover{/*IE6はgif画像*/
	background-image:url(../con_img/in_con1_sm_back_on.gif);
	background-position:top;
	
}
/*--------マウスオーバーで日付-------*/
a.nikki_simg_day{
	position:absolute;
	text-decoration:none;
	width:23px;
	font-size:8px;
	text-align:center;
	line-height:1.1;
	
}
* html a.nikki_simg_day span {/*IE6はgif画像*/
	display: none;
	width:80px;
	height:17px;
	padding:3px;
	position: absolute;
	top:-28px;
	left:-28px;
	z-index: 100;
	text-align:center;
	font-size:12px;
	color:#FFF;
	background-image:url(../con_img/in_con1_sm_onlight.gif);
	background-repeat:no-repeat;
	background-position:-200px;
}
a.nikki_simg_day span {
	display: none;
	width:80px;
	height:17px;
	padding:3px;
	position: absolute;
	top:-28px;
	left:-28px;
	z-index: 100;
	text-align:center;
	font-size:11px;
	color:#FFF;
	background-image:url(../con_img/in_con1_sm_onlight.png);
	background-repeat:no-repeat;	
}
a.nikki_simg_day:hover {
	font-size: 99%; /* this is just for IE */
	
}
a.nikki_simg_day:hover span {
	display: block;
}
* html a.nikki_simg_day:hover span {/*IE6はgif画像*/
	display: block;
	background-image:url(../con_img/in_con1_sm_onlight.gif);
	background-repeat:no-repeat;
	background-position:top;
}
/*------　jsでのポップアップの設定　------*/
.highslide-caption {/*//highslide.cssよりこっちに移動//*/
	color:#3c2b0c;
	display: none;
	height:499px;
	text-align:left;
	margin:15px 15px 15px 0;
}
.highslide-caption h3{/*日付*/
	font-size:9px;
	color:#3c2b0c;
	padding:10px 15px 10px 15px;
	font-weight:normal;
}
.highslide-caption h4{
	font-size:16px;
	color:#3c2b0c;
	margin:15px 5px 25px 15px;
	padding-bottom:5px;
	line-height:1.4;
}
.highslide-caption p{
	width:185px;
	padding:0 5px 0 15px;
	margin-top:10px;
	font-size:90%;
	line-height:1.6;
	text-align:justify;
	text-justify:inter-ideograph;
}
div#nikki_nextbtn{
	position:absolute;
	width:17px;
	height:17px;
	top:140px;
	right:-45px;
}
div#nikki_backbtn{
	position:absolute;
	width:17px;
	height:17px;
	top:140px;
	left:-45px;
}
/*-----------------------------------------------

	sakuhin関係
	
-----------------------------------------------*/
div#cont_base_sakuhin h3{
	margin:45px 0 25px 0;
}
div#cont_base_sakuhin h4{
	margin:10px 0 0 0;
	font-size:110%;
}
p.sakuhintext{
	width:426px;
	padding:0 0 15px 0;
}
div#sakuhinimg{
	position:absolute;
	width:289px;
	height:364px;
	top:-65px;
	right:5px;
}
div#sakuhin_nextbtn{
	position:absolute;
	width:17px;
	height:87px;
	top:95px;
	right:-45px;
}
div#sakuhin_backbtn{
	position:absolute;
	width:17px;
	height:87px;
	top:95px;
	left:-45px;
}
ul#sakuhin_etc{
	width:780px;
	padding:0;
	text-align:left;
	margin:40px 0 0 0;
}
ul#sakuhin_etc li{
	float:left;
	width:130px;
	text-align:center;
}
/*-----------------------------------------------

	sakuhinダウンロードページ関係
	※ページの作りが根本的に違うので注意〜
	
-----------------------------------------------*/
div#dwn_head_box{
	width:900px;
	height:403px;
	margin:40px auto 0 auto;
	background-image:url(../con_img/dwn_head_base.gif);
	background-repeat:no-repeat;
	background-position:bottom;
}
div#dwn_head_box h1{
	margin:30px 0;
}
div#dwn_head_box p{
	width:440px;
	margin-bottom:10px;
	color:#000;
}
p.dwn_cnp_text{
	margin-left:1em;
	text-indent:-1em;
	font-size:90%;
}
p.sasaname{
	margin-top:10px;
	text-align:right;
}
div#dwn_cont_box{
	width:900px;
	margin:0 auto;
	padding-top:60px;
	background-color:#7b973c;
	border-bottom:5px solid #3c4d15;
}
div#dwn_cont_box dl{
	width:700px;
	overflow:hidden;
	margin:10px auto 40px auto;
	padding-bottom:40px;
	border-bottom:1px dotted #3c4d15;
}
div#dwn_cont_box dl dt{
	float:left;
	clear:left;
	width:100px;
}
div#dwn_cont_box dl dd{
	float:right;
	clear:right;
	width:550px;
	margin-bottom:5px;
}
dd.dwn_title{
	font-size:large;
}
dd.dwn_title a{
	color:#FFFF66;
	text-decoration:none;
}
dd.dwn_title a:visited {
	color:#FFFF66;
}
dd.dwn_title a:hover{
	color:#FFFF66;
}
dd.dwn_canp_size{
	text-align:right;
	font-size:80%;
}
div#dwn_foot_box{
	width:900px;
	margin:0 auto 10px auto;
	padding-top:30px;
	text-align:center;
}
div#dwn_foot_box p{
	text-align:center;
	color:#000000;
	margin-bottom:8px;
}
div#dwn_thanks_text{
	width:884px;
	margin:30px auto;
	padding:20px 5px;
	background-color:#FFF;
	background-image:url(../con_img/dwn_foot_base.png);
	background-repeat:no-repeat;
	background-position:60px bottom;
	border:3px solid #999;
}
div#dwn_thanks_text h2,
div#dwn_thanks_text p{
	padding-left:300px;
	padding-right:20px;
	color:#000;
}
div#dwn_thanks_text h2{
	margin-bottom:8px;
	font-size:large;
}
div#dwn_thanks_text p{
	margin-bottom:10px;
}
/*-----------------------------------------------

	my関係
	
-----------------------------------------------*/
div#cont_base_my h3{
	margin:45px 0 20px 0;
}
div#cont_base_my h4{
	font-size:115%;
	margin-bottom:15px;
}
div#cont_base_my p{
	width:430px;
	padding:0 0 10px 0;
}
img.my_protimg{
	position:absolute;
	width:346px;
	height:362px;
	top:-75px;
	right:-10px;
}
span.font-bic150{
	font-size:150%;
	font-weight:bold;
}
/*-----------------------------------------------

	mail関係
	
-----------------------------------------------*/
div.mail_tablebox{
	width:500px;
	margin-top:45px;
}
div.mail_tablebox table{
	width:500px;
	padding:0;
	margin-top:10px;
}
div.mail_tablebox table th{
	width:115px;
	padding:5px 10px 5px 20px;
	border-right:1px dotted #CCCCCC;
	text-align:right;
	color:#1C5A6E;
	font-size:11px;
	background-color:#F0FDD4;
}
div.mail_tablebox table td{
	background-color:#FFF;
}
.fom_title,.fom_name{
	width:340px;
	margin:0;
	padding:6px 10px;
	border:0;
}
.fom_con{
	width:340px;
	height:90px;
	overflow:auto;
	margin:0;
	padding:5px 10px;
	border:0;
}
div.sent_btn{
	width:500px;
	text-align:right;
}
p#mail_text01{
	position:absolute;
	width:220px;
	top:0;
	right:0;
	padding:15px;
	border:1px dotted #C7F9F6;
	font-size:90%;
}
div#cont_base_mail h3{
	margin-top:45px;
	margin-bottom:30px;
}
p.mail_back_btn{
	margin-top:30px;
	text-align:right;
}
/*-----------------------------------------------

	photo関係
	
-----------------------------------------------*/
div#cont_base_photo table{
	width:780px;
	height:210px;
	padding:50px 0 0 0;
	margin:0 auto 45px auto;
}
div#cont_base_photo table td{
	text-align:center;
	padding-bottom:15px;
}
div.photo_simg_box{
	width:60px;
	height:60px;
	margin:0 auto;
}
div.photo_simg_box a{
	display:block;
	width:50px;
	height:50px;
	padding:5px;
	background-color:#FFFFFF;
}
div.photo_simg_box a:hover{
	background-color:#000000;
}
div#photo_nextbtn{
	position:absolute;
	width:17px;
	height:17px;
	top:50px;
	right:-45px;
	padding-top:95px;
}
div#photo_backbtn{
	position:absolute;
	width:17px;
	height:17px;
	top:50px;
	left:-45px;
	padding-top:95px;
}