/*---------------------------------------------------------*/
/*  基本設定                                               */
/*---------------------------------------------------------*/
body {
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3",sans-serif;
	font-size : 15px;
	color : #444444;
	margin: 0px;
	padding: 0px;
	line-height: 140%;
	background-image: url(img/back_ground.jpg);
	background-repeat: repeat;
}
#wrapper {
	width: 1100px;
	margin-right: auto;
	margin-left: auto;
	background-color: #FFFFFF;
	background-position: center;
	border-left:1px solid #F1F1F1;
	border-right:1px solid #F1F1F1;
}

/*---------------------------------------------------------*/
/*  header                                                 */
/*---------------------------------------------------------*/
#header	{
	background-image: url(img/header_back_ground.jpg);
	background-repeat: repeat-x;
	height: 150px;
}
h1	{
	background-image: url(img/h1_back_ground.jpg);
	height:	40px;
	font-size: 25px;
	font-weight: lighter;
	color: #8A633C;
	margin: 0px;
	padding: 20px 0px 0px 20px;
	letter-spacing:	1px;
}
h2	{
	font-size: 18px;
	font-weight: bold;
	color: #663300;
	margin: 0px;
	padding: 0px;
	letter-spacing:	2px;
}
.h2_right {
	font-size: 20px;
	color: #663300;
	font-family: Monotype Corsiva,serif;
}
h3	{
	font-size: 17px;
}
/*---------------------------------------------------------*/
/*  font                                                   */
/*---------------------------------------------------------*/
a {
	color: #724147;
	text-decoration: none;
}
a:hover {
	color: #DD0000;
	text-decoration: underline;
}
.font_12 {
	font-size: 12px;
}
.font_14 {
	font-size: 14px;
}
.font_16 {
	font-size: 16px;
}
.font_b {
	color: #663300;
}
.font_r {
	color: #DD0000;
}
.font_rb {
	color: #DD0000;
	font-weight: bold;
}
.font_w {
	color: #FFFFFF;
}

.tittle_w16b {
	font-size: 16px;
	color: #FFFFFF;
	font-weight: bold;
	letter-spacing:	2px;
}

.tittle_b16b {
	font-size: 16px;
	color: #663300;
	font-weight: bold;
	letter-spacing:	2px;
}

/*---------------------------------------------------------*/
/*  navi                                                   */
/*---------------------------------------------------------*/
#navi	{
	height: 40px;
}
#navi .dropmenu{
	*zoom: 1;
	list-style-type: none;
	width: 750px;
	padding: 0;
	margin-right: auto;
	margin-left: auto;
}
#navi .dropmenu:before, .dropmenu:after{
	content: "";
	display: table;
}
#navi .dropmenu:after{
	clear: both;
}
#navi .dropmenu li{
	position: relative;
	float: left;
	margin: 0;
	padding: 0;
	text-align: center;
}
#navi .dropmenu li a{
	display: block;
	margin: 0;
	padding: 13px 0 11px;
	color: #663300;
	font-size: 16px;
	line-height: 1;
	text-decoration: none;
	background-image: url(img/navi_img.jpg);
	background-repeat: repeat-x;
	letter-spacing:	2px;
}
#navi .dropmenu li a:hover{
	background-image: url(img/navi_r.jpg);
	color: #FFFFFF;
}
#navi .dropmenu li:hover > a{
	background-image: url(img/navi_r.jpg);
	color: #FFFFFF;
}
#navi .dropmenu li ul{
	list-style: none;
	position: absolute;
	z-index: 9999;
	top: 100%;
	left: 0;
	margin: 0;
	padding: 0;
}
#navi .dropmenu li ul li{
	width: 100%;
}
#navi .dropmenu li ul li a{
	padding: 13px 6px;
	border-bottom: 1px dotted #663300;
	background: #FFCAE4;
	text-align: left;
	font-size: 13px;
	opacity: 0.9; 
}
#navi .dropmenu li ul li a:hover{
	background: #FF9BCD;
	opacity: 0.9; 
}
#navi #fade-in li ul{
	opacity: 0;
	top: 50%;
	visibility: hidden;
	transition: .5s;
}
#navi #fade-in li:hover ul{
	top: 100%;
	visibility: visible;
	opacity: 0.9;
}

/*---------------------------------------------------------*/
/*  side                                                  */
/*---------------------------------------------------------*/
.menu label {
	color: #fff;
	padding: 14px;
	display: block;
	margin: 0px;
	background-image: url(img/side_tittle.jpg);
	border: 1px #CCCCCC dotted;
	font-size:	16px;
	font-weight: bold;
	letter-spacing:	2px;
}
.menu ul {
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    margin: 0;
    padding: 0;
    list-style: none;
}
.menu li {
    padding: 5px 5px 5px 5px;
	border-left: 1px #CCCCCC dotted;
	border-right: 1px #CCCCCC dotted;
	border-bottom: 1px #CCCCCC dotted;
	background-image: url(img/side_menu.jpg);
	height:	80px;
	line-height: 180%;
}

/*--- サンドアート --*/
input[type="checkbox"].on-off1{
    display: none;
}
input[type="checkbox"].on-off1 + ul{
    height: 0;
    overflow: hidden;
}
input[type="checkbox"].on-off1:checked + ul{
    height: 185px;
}

/*--- モザイクタイル --*/
input[type="checkbox"].on-off2{
    display: none;
}
input[type="checkbox"].on-off2 + ul{
    height: 0;
    overflow: hidden;
}
input[type="checkbox"].on-off2:checked + ul{
    height: 95px;
}

/*--- インテリアジオラマ --*/
input[type="checkbox"].on-off3{
    display: none;
}
input[type="checkbox"].on-off3 + ul{
    height: 0;
    overflow: hidden;
}
input[type="checkbox"].on-off3:checked + ul{
    height: 95px;
}

/*--- ハーバリウム --*/
input[type="checkbox"].on-off5{
    display: none;
}
input[type="checkbox"].on-off5 + ul{
    height: 0;
    overflow: hidden;
}
input[type="checkbox"].on-off5:checked + ul{
    height: 183px;
}

.menu2 label {
	color: #663300;
	padding: 30px 14px;
	display: block;
	margin: 0px;
	background-image: url(img/side_tittle_2.jpg);
	height:	20px;
	border: 1px #CCCCCC dotted;
	font-size:	16px;
	font-weight: bold;
	letter-spacing:	2px;
}
.menu2 ul {
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    margin: 0;
    padding: 0;
    list-style: none;
}
.menu2 li {
    padding: 5px 5px 5px 5px;
	border-left: 1px #CCCCCC dotted;
	border-right: 1px #CCCCCC dotted;
	border-bottom: 1px #CCCCCC dotted;
	background-image: url(img/side_menu_2.jpg);
	height:	80px;
	line-height: 180%;
}
/*--- 作り方を『動画』でご紹介 --*/
input[type="checkbox"].on-off4{
    display: none;
}
input[type="checkbox"].on-off4 + ul{
    height: 0;
    overflow: hidden;
}
input[type="checkbox"].on-off4:checked + ul{
/*    height: 373px; */
    height: 460px; 
}

/*---------------------------------------------------------*/
/*  contents                                               */
/*---------------------------------------------------------*/
#contents	{
	width: 1100px;
	padding: 0px;
	margin-right: auto;
	margin-left: auto;
}
#pan {
	height:	39px;
	padding-top: 1px;
	margin:-10px 80px 0px 0px;
	font-size: 12px;
	display:inline-block;
}
#pan li {
	float:left;
	list-style:none;
	padding:0px 3px 0px 5px;
	margin:0px;
}
#pan a{
	color: #444444;
	font-size: 12px;
	text-decoration: none;
}
#pan a:hover{
	color: #166CC4;
	text-decoration: underline;
}
#details {
	width: 710px;
	margin: 0px;
	padding: 0px 20px 0px 20px;
}
.table_line { 
border-collapse: collapse; /* 枠線の表示方法 */ 
border: 1px #cccccc dotted; /* テーブル全体の枠線（太さ・色・スタイル） */ 
background-color: #FFFFFF; /* 背景色 */ 
} 
.table_line td { 
border: 1px #cccccc dotted; /* セルの枠線（太さ・色・スタイル） */ 
} 
.table_boder { 
border-collapse: collapse; /* 枠線の表示方法 */ 
background-color: #FFFFFF; /* 背景色 */ 
border-top: 1px #cccccc dotted; /* セルの枠線（太さ・色・スタイル） */ 
} 
.table_boder td { 
border-bottom: 1px #cccccc dotted; /* セルの枠線（太さ・色・スタイル） */ 
} 
.table_noline {
border: 0px; /* テーブル全体の枠線（太さ・色・スタイル） */ 
} 
.table_noline td { 
border: 0px; /* テーブル全体の枠線（太さ・色・スタイル） */ 
}
.box {
border: 1px #cccccc dotted;  /* 枠線を引く */
border-radius: 0px;      /* 角丸の指定 */
}

.btn {
color:#333333;
background-color:#EFEFEF;
border: 1px #767676 solid;
border-radius: 3px;
text-decoration:none;
text-align:center;
padding:5px;
}

.btn:hover {
background-color:#E5E5E5;
border: 1px #4F4F4F solid;
}


/*--  イメージ拡大  --*/

/*---------------------------------------------------------*/
/*  トップページ　画像スクロール                           */
/*---------------------------------------------------------*/
#stage img{
	display:none;
	position: absolute;
}
#stage #top1{
	display:block;
}

/*---------------------------------------------------------*/
/*  お知らせ BOX                                           */
/*---------------------------------------------------------*/
/* --- ボックス --- */
div.information {
width: 750px; /* ボックスの幅 */
background-color: #FFFFFF; /* ボックスの背景色 */
border: 1px #c0c0c0 solid; /* ボックスの境界線 */
}

/* --- 見出し --- */
div.information h2 {
margin: 0; /* 見出しのマージン */
padding: 0px 10px; /* 見出しのパディング（上下、左右） */
background-color: #E6E6E6; /* 見出しの背景色 */
border-bottom: 1px #c0c0c0 dotted; /* 見出しの下境界線 */
font-size: 100%; /* 見出しの文字サイズ */
}

div.information div.textArea {
height: 360px; /* 本文領域の高さ */
padding: 10px 15px; /* 見出しのパディング（上下、左右） */
line-height: 25px;
/* ---padding-left: 3px; */
overflow: auto;
}

/*---------------------------------------------------------*/
/*  footer                                                 */
/*---------------------------------------------------------*/
#footer a {
	color: #FFFFFF;
	text-decoration: none;
}
#footer a:hover {
	color: #FFFFFF;
	text-decoration: underline;
}

