/* /* 共通定義 Start*/共通定義 Start*/

/* ●画面サイズが600px以下の画面に対して先に書いておくbodyの設定*/
body {
       background-color: #ffffff; 
       color: #000000;
       font-size:16px;
       text-align:center;
       /* line-height:150%;*/
}

/* ●画面サイズが600px以上のbodyの設定*/
@media screen and (min-width: 600px) {
     body {
       background-color: #ffffff; 
       color: #000000;
       font-size:13px;
       text-align:center;
       /* line-height:150%;*/
   }
}


a:link { color:#0033cc; }	/* 以前は:#3300ff */
a:visited { color:#660099; }
a:active { color:#ff0000; }
img {border:0px;}
h1 { color:#000099; font-size:140%; /*text-indent:1em;*/ margin-bottom:0px; margin-top:15px; margin-left:1em; margin-right:1em;}
h2 { color:#cc3399; font-size:120%; /*text-indent:1.5em;*/ margin-bottom:0px; margin-top:15px; margin-left:1.5em; margin-right:1em;}
h2.content_t { color:#000099; font-size:120%; text-indent:1.5em; margin-bottom:0px; margin-top:15px;}

h2.item_cate {
	color:#000000; 
	font-size:medium;
	border:1px solid #6633ff;   
	width:100%;	/* これがないと、横に少しへこむ */
	padding:0px;    /* これを1以上にすると、外へはみ出るので注意 */
	margin:0px;
	margin-top:10px;	
	margin-bottom:5px;	
	line-height: 180%;
	font-weight:bold;
	font-size:120%; 
	text-indent:0.5em;
/*        background-color:#ECECFF;*/ /* ごく薄い紫 */
	background-color:#ddddff; /* 少し濃くしてみた：薄い紫 */ 

}

h3.content_t {color: #0000cc;}
h4.content_t {color: #003300;}
p {line-height:150%;}
div {line-height:150%;}
td {line-height:150%;}


.att-h1{	/* ●H1の下の文章 */
	width:90%;		/* 幅を指定しておくこと */
	margin-left:2em;	/* こちらの方が文章の先頭がそろいやすい*/
	margin-right:2%;
	margin-top:20px;
	margin-bottom:20px;
}

.att-h2-waku{	/* ●H2の下の文章・枠付き */
	width:90%;		/* 幅を指定しておくこと */
	margin-left:auto;
	margin-right:auto;
	margin-top:10px;
	margin-bottom:20px;
	border:1px solid #cc0099;
	padding:2.3%;
}

.att-h2{	/* ●H2の下の文章 */
	width:90%;		/* 幅を指定しておくこと */
	margin-left:3em;	/* こちらの方が文章の先頭がそろいやすい*/
	margin-right:2%;
	margin-top:10px;
	margin-bottom:20px;
}

.att-h2-ho{	/* ●H2の下の文章の中の補足事項 */
	width:90%;		/* 幅を指定しておくこと */
	margin-left:3em;	/* こちらの方が文章の先頭がそろいやすい*/
	margin-right:2%;
	margin-top:10px;
	margin-bottom:10px;
}

	.att-h2-ho:before{
        	content:"※";
		color:#cc3399;

	}

.att-h2-title{    /* ●H2の下の文章のタイトル */
	font-weight:bold;
	}

	.att-h2-title:before{
		content:"●";
		color:#cc3399;
	}


.att-h2 ul{  /* ●H2の下のリストボックス。<p>の中に入れてはいけない */
	width:95%;
	margin-left:2em;
	margin-right:2%;
	padding-top:0px;
	padding-bottom:5px;
	padding-left:0px;
	padding-right:0px;	
	border: 0px solid #ccccff; /* テストカラー */
        line-height:150%;
}

	.att-h2 ul li{
		width:95%;
		margin-bottom:0.5em;
		margin-left:0px;
	}

.att-h2-table{	/* ●H2の下の固定テーブル */
	width:90%;		/* 幅を指定しておくこと */
	margin-left:3em;	/* こちらの方が文章の先頭がそろいやすい*/
	margin-right:2%;
	margin-top:10px;
	margin-bottom:20px;

}

	.att-h2-table ul{ /* ●H2の下の固定テーブル */
		width:80%;  /* これがないと均等配置にならない */
		list-style:none;
        	display: table;
		table-layout: fixed;  	/*セルの幅を固定レイアウトにするため*/		
		padding:0px;
		text-align:center;
		border: 0px solid #ccccff; /* テストカラー */
	}

		.att-h2-table ul li{  /* ●H2の下の固定テーブル */
			display: table-cell;
			border: 0px solid #ccccff; /* テストカラー */

		}
                         
.normal_text{
	font-weight:normal;
}



/* ●共通定義　End*/


/* ●メイン定義 START */

#container {
             width:95%;
             margin-left:auto;
             margin-right:auto;
             text-align:left;
             border:0px solid #33ccff;
}

/* ●ヘッダー*/
#l_head {
          width: 95% ; 
          height: 50px ; 
          position: static; 
          margin-bottom: 10px; 
          margin-left:auto; 
          margin-right:auto; 

}
/* padding: 10px 5px 5px 5px ;削除した*/

/* ●containerの内側でl_contents部分を覆っている */
#l_body { 
          width: 95% ; 
          margin-bottom: 10px; 
          margin-left:-260px;                    
          float:right;
          border:0px solid #ccccff;
}


/* ●右側のコンテンツ部分を覆っている*/
#l_contents {
          margin-left:300px;
          border: 0px solid #ccccff; /* 薄紫の枠。表示しない */
          vertical-align:top;
}


/* ●左側メニュー部分を覆っている　 */
#l_menu { 
          width: 290px; 
          border: 0px solid #ccccff; 
          vertical-align:top;
          float:left;
}



/* ●フッター部分を覆っている　*/
#l_bottom { 
          width: 95%; 
          clear:both;
          margin-left:auto;
          margin-right:auto;
          text-align:center;
}

/* ●横幅が800ピクセル以下の画面になったら、フロートを解除して、サイドメニューが下に落っこちるレイアウトのため */
@media screen and (max-width: 800px) {
     #l_body, #l_contents, #l_menu {
          float: none;
          margin: 0;
          width: auto;
     }
}




/* ●パンくずリスト設定 START */
#breadcrumb-navi ol{		
	list-style:none;
	padding:0px;
	margin-left:auto;
	margin-right:auto;
	width:98%;  		/* 幅を指定していればセンタリング可能*/

	border:0px solid #ffccff;
}

	#breadcrumb-navi ol li{
		display:inline;		/* リストを横並びにする*/
	}

	#breadcrumb-navi ol li:before{
		content:" > ";		/* liの前に記号を追加*/
	}

	#breadcrumb-navi ol li:first-child:before{    /* :の前後にスペースを開けると表示が変になる*/
		content:"";		/*  先頭にあるliの前に記号をなし*/
	}

/* ●パンくずリスト設定 END */



#www_count {
          width: 88px; 
          height: 26px; 
          padding: 10px 5px 10px 5px;
          margin-right:15px;
          margin-left:auto;
}

#title_img{
           float:left;
           border:0px;
}


/* ●補足情報BOX　/shohin/kt_hosoku内など*/
.hosoku_info{
      width:90%;
      margin-right:auto;
      margin-left:auto;
      margin-bottom:5%;

}

.hosoku_info img{
      max-width:640px;
      width:100%;
}

/* メイン定義 END */



/* index.html定義 START */

#my_int {	/* ●最初の紹介文 ●*/
          width:95%;
          border: 0px solid #ccccff; 
          margin-top:30px;
          margin-bottom:25px;
          margin-left:auto;
          margin-right:auto;
          vertical-align:top;
}

.sign{
     text-align:right;   
         
}



/* ●新商品画像の table-cellを使ったレイアウトのため スタート*/


/*.list-box-container{   */ /* list-box-ulの外箱。 ulの幅指定があればいらない*/
/*   text-align:center;  */
/* }                     */


.new-box-ul {			/* ●画像とテキストの入った箱を並べる箱 */
      display: table;
      table-layout:fixed;  	/*セルの幅を固定レイアウトにするため*/
      text-align:center;
      padding:0px;      	/* これがないと左に変な余白ができる*/
      margin-left:auto;
      margin-right:auto;
      width:98%;  		/* 幅を指定していればセンタリング可能*/
      border:0px solid #ffccff;	/* テストカラー */
      border-collapse:separate; /* これでのみli間のスペースが開けられる*/
      border-spacing: 10px; 	/* 上の行とセット。セル間のスペースサイズ指定*/
      /* list-style-type: none; */
}

	.new-box-ul li{		/*● 画像とテキストを入れる箱1個分 */
		display: table-cell;
		vertical-align:top;
		max-width:500px;   	/* 表示最大幅設定*/
		/*min-width:100px;*/   	/* 表示最小幅設定*/
		text-align:left;
		padding:5px;
		border:0px solid #66ccff;	/* テストカラー */
	}

		.new-img{			/* ●画像を入れる箱 */
			vertical-align:top;
			margin-left:auto;
			margin-right:auto;
			max-width:500px;	/* 表示最大幅設定*/
			/*max-height:140px;*/	/* 表示最大高さ設定*/
			/*overflow:hidden;*/  	/* 高さをはみ出た分はカットして表示しない指定*/
			border:0px solid #ccccff; 	/* テストカラー */
			/*text-align:center;*/
		}

			.new-img img {
		      		max-width:100%;	/* 外枠list-imgのサイズに応じて画像サイズが変化 */
			}

	.new-text{			/* ●画像の説明を入れる箱*/
		vertical-align:top;
		margin-left:auto;
		text-align:left;
		margin-right:auto;
		margin-top:3px;
		max-width:500px;   	/* 表示最大幅設定*/
		width:100%;   	/* 表示最大*/
		padding:0px;
		border:0px solid #ccccff;	/* テストカラー */
	}

		.small_new-text{ /* new-text内の補足*/
			width:80%;
			text-decoration:none;	/* テキストのリンクの下線を消す */
			font-size:smaller;
			color:#000000; 
 			margin-top:5px;
			line-height:140%;
			padding:0px;
			border:0px solid #ccccff;	/* テストカラー */

}


.img_l_30, .img_l_45, .img_l_60{	/* ●新商品画像 幅30%,40%,50%以内　左寄せ*/
	border:0px solid #ccccff;
	float:left;
	margin-top:5px;
 	margin-left:1%;
	margin-right:2%;
	text-align:left;
}

	.img_l_30 {
		width:30%;	/* 幅のみ単独指定 */
	}

	.img_l_45{
		width:45%;	/* 幅のみ単独指定 */
	}

	.img_l_60{
		width:60%;	/* 幅のみ単独指定 */
	}


	.img_l_30 img, .img_l_45 img, .img_l_60 img{
		max-width:100%;
		border:1px solid #ccccff;
       	}

	@media screen and (max-width: 600px) {  /* ●横幅が600ピクセル以下の画面になったら、フロートを解除し、文章を下に落とす */
	     .img_l_30, .img_l_45, .img_l_60{
		float: none;
		margin:0;
		width:95%;
		margin-top:5px;
		margin-left:auto;
		margin-right:auto;

	     }
	}


	.new-text img{   /* new-text内の画像　img_l_xxの前に持ってきてはいけない*/
		border:0px solid #ccaaff;
	}	

/* ● 新商品画像のtable-cellを使ったレイアウトのため 終わり*/


.new_item{    /*上のテーブルセルが出来たら使わない*/
          margin-top:100px;
          margin-left:20px;
          margin-right:10px;
          margin-bottom:30px;
          float:left;

}

.new_item_high{ /*上のテーブルセルが出来たら使わない*/
          margin-top:30px;
          margin-left:15px;
          margin-right:10px;
          margin-bottom:30px;
          float:left;

}

.new_item_2{ /*上のテーブルセルが出来たら使わない*/
          margin-top:10px;
          margin-left:20px;
          margin-right:10px;
          margin-bottom:50px;
          float:left;

}

.new_item_3{ /*上のテーブルセルが出来たら使わない*/
          margin-top:30px;
          margin-left:20px;
          margin-right:10px;
          margin-bottom:50px;
          float:left;

}

.idx_swtp_waku {	/*● トップページのSweetpeabeadwork表示枠 ●*/
           width:50%; 
           margin-top:30px;
           margin-left:4%;
           margin-right:auto;
           margin-bottom:10px;
           padding: 10px; 
           border: 2px solid #ccccff;
           text-align:left;
           /*float:left;        */
}

	@media screen and (max-width: 500px) {
		.idx_swtp_waku{
			width:90%; 
			margin-left:auto;
			margin-right:auto;
		}
	}

.idx_swtp_wide {  /*　上のidx_swtp_wakuが有効になったら削除*/
           width:260px; 
           margin-top:10px;
           margin-left:20px;
           margin-right:5px;
           margin-bottom:10px;
           padding: 10px; 
           border: 2px solid #ccccff;
           text-align:left;
           float:left;          
}


.idx_swtp {   /*　上のidx_swtp_wakuが有効になったら削除*/
           width: 160px; 
           margin-top:10px;
           margin-left:20px;
           margin-right:5px;
           margin-bottom:30px;
           padding: 7px; 
           border: 2px solid #ccccff;
           text-align:left;
           float:left;          
}

.swtp{
             font-size:smaller;
             font-weight:bold;
}



p.att{		/* ●トップページで使っているみたい●*/
	margin-left:2em;	/* ●こちらの方が文章の先頭がそろいやすい*/
	margin-top:20px;
	margin-bottom:20px;
}

p.att_home{    /* ●トップページで使っているみたい●*/
	 width:75%;
         margin-right:auto;
         margin-left:auto;
         margin-top:20px;
         margin-bottom:20px;
}

.att_title{
         margin-top:20px;
         margin-left:20px;
         margin-bottom:5px;
         font-weight:bold;
}

p.att_sub{
         margin-left:20px;
         margin-top:0px;
         margin-bottom:15px;

}
.att_sub_small{
         margin-top:0px;
         margin-bottom:10px;
             font-size:smaller;
}

table.att{
        margin-left:20px;  
        margin-bottom:20px;  
}

td.table_att_l{
               width:130px;
               padding:2px; 
               border: 0px solid #778899;
               text-align:left;
}
td.table_att_c{
               width:130px;
               padding:2px; 
               border: 0px solid #778899;
               text-align:center;
}
.banner{
        border:0px;   
        margin-top:35px;
        margin-left:5px;  
        margin-right:30px;  
        float:right;
}



P.top_link {
          width: 90%; 
          margin-top:60px;
          margin-right:auto;
          margin-left:auto;
}

.info_toks{	/* ●特別なお知らせ枠● */
         width: 90%; 
         margin-top:40px; 
         margin-left:auto; 
         margin-right:auto;
         margin-bottom:20px;
         padding:3%;
         border:1px solid #cc0099;
         clear:both;

}

.info_golden{
         width:70%; 
         margin-left:20px; 
         margin-right:20px;
         margin-bottom:30px;
         margin-top:30px;
         padding:15px;
         line-height:190%;
         border:2px solid #cc0099;
         clear:both;
}

.title_golden{
          font-weight:bold;
          font-size:larger;
}

.kyotyo_golden{
          font-weight:bold;
          font-size:larger;
          color:#cc0099;
          
  }
.info_nenmatu{
         width: 70%; 
         margin-left:20px; 
         margin-right:30px;
         margin-bottom:30px;
         margin-top:30px;
         padding:20px;
         line-height:190%;
         border:2px solid #cc0099;
         clear:both;

}

.title_nenmatu{
          font-weight:bold;
          font-size:larger;
}

.kyotyo_nenmatu{
          font-weight:bold;
          font-size:larger;
          color:#cc0099;
          
}

.list_toks{
         margin-top:0px; 
         margin-left:20px; 
         margin-right:10px;
         line-height:170%; 
}

.info_toks_title{
        font-size:larger;
        font-weight:bold;
        color:#cc0099;
}


.title_info { 
              font-size:larger ; 
              margin-left:20px; 
              color:#6600ff; 
              font-weight:bolder;
              clear:both;
}

.new-list {	/* ●こちらにする：トップページの更新情報 */ 
           margin-left:20px; 

}

	.new-list dt{
		margin-top:3%;
		font-weight:bold;
	}

	.new-list dd{
		line-height:150%;
		margin-bottom:2%;
	}

.newlist {	/* ●旧：トップページの更新情報 */ 
           margin-left:20px; 
           float:left;

}

	.newlist dt{
		margin-top:3%;
		font-weight:bold;
	}

	.newlist dd{
		line-height:150%;
		margin-bottom:2%;
	}

/* index.html定義 END */


/* フッター定義 START */
.copy_s{
        font-weight:bold;
}

.copymark{
        font-size:larger;
}

/* フッター定義 END */

/* メニュー定義 START */


.submenuWrap{	/* ●サイドメニューのカテゴリ枠● */
	width:100%;
	border:0px solid #ccffaa;    /* テストカラー黄緑 */
	margin-left:0px;
	margin-right:0px;
	margin-top:0px;
	margin-bottom:0px;
	padding:0px;
             
}

.submenuTitle-s,.submenuTitle{ /* ●サイドメニューのカテゴリタイトル枠 ● */
	border:1px solid #ccccff;   /* テストカラー：#ccffcc */
	width:100%;	/* これがないと、横に少しへこむ */
	padding:0px;    /* これを1以上にすると、外へはみ出るので注意 */
	margin:0px;
	margin-bottom:-1px;	/* 上下の線の重なりを消す */
	line-height: 180%;
	font-weight:bold;
	font-size:120%; 
	text-indent:0.5em;
	color:#000000;
/*        background-color:#ECECFF;*/ /* ごく薄い紫 */
	background-color:#ddddff; /* 少し濃くしてみた：薄い紫 */ 

}

	.submenuTitle-s{/* ●サイドメニューのカテゴリタイトル枠 強調スタイル：-sのみの設定● */
		color:#cc0099;	/* 以前はcc33cc */
	}


	.submenuTitle-sub-link{	/* ●サイドメニューのカテゴリタイトルの補足リンク枠● */
		margin:0px;
		margin-bottom:5px;
		font-size:90%;
		line-height: 150%;
		text-indent:2em;
	}

.submenuList{	/* ●サイドメニューの個々のリンク枠● */
	border:0px solid #ccffccf;  /* テストカラー */
	margin:0px;
	line-height: 220%;
	font-size:110%; 
	text-indent:1em;
}



	.submenuList a{ 	/* ●<a>タグをブロック化して、文字のない所もタッチできるようにする● */
		display:block;
         	width:100%;
		height:auto;
	 	border:1px solid #ccccff; /* ●罫線として使う #sidemenuのborder-bottom:0pxにしておく●;*/
	 	/*border-bottom:1px solid #ff0000;*/ /* テストカラー */
		background-color:#ffffff; 
		margin-top:0px;
		margin-bottom:-1px;	/* 上下の線の重なりを消す */
		text-decoration:none;	/* リンクの下線を消す */
		color:#0033cc;	/* 以前は#0000CD */

	}

	.submenuList a:link{ 	/*  ネットショップオーナーのcssで 「a:link」にtext-decoration: underline;が設定されていたので、下線が表示されていたのを消すため →  でも消えない。カートのメニュー部分だけインラインで書く。*/
		text-decoration: none;

	}

	.submenuList-comment{	/* ●サブメニューの下のコメント　これはカートのメニュー部分は<span>で入れないといけない<p>で入れると効かない。● */
		color:#000000; 
		margin-top:-3px;
		margin-bottom:10px;
		line-height:100%;
		padding:0px;
		vertical-align:top;
		text-indent:1em;	
		font-size:90%;
	}


	/* ●横幅が800ピクセル以下の画面では個々のメニューの高さを大きくする */
	@media screen and (max-width: 800px) {
		.submenuTitle{
			line-height: 200%;
		}

		.submenuList{	/* ●サイドメニューの個々のリンク枠● */
			line-height: 280%;
		}

		.submenuTitle-sub-link{	
			font-size:100%; 
		}

	}

.kit_cate,.ac_cate,.book_cate{/* 使わないと思う */
          border:0px;
          font-size:108%;
          font-weight:bold;
          background-color:#ECECFF;
          padding:3px;
          margin-bottom:0px;
}


.kit_cate_new,.ac_cate_new,.book_cate_new{/* 使わないと思う */
          border:0px;
          font-size:108%;
          font-weight:bold;
          color:#cc0099;
          background-color:#ECECFF;
          padding:3px;
          margin-bottom:0px;
}


.hosoku_cate,.order_cate,.info_cate{ /* 使わないと思う */
          border:0px;
          font-size:108%;
          font-weight:bold;
          background-color:#ECECFF;
          padding:3px;
          margin-bottom:0px;
}



.kit_cate_mini1{/* 使わないと思う */
          border:0px;
          font-size:85%;
/*          background-color:#ECECFF;*/
          background-color:#ddddff;    /*少し濃くした */
          padding:3px;
          margin-bottom:0px;
}

.kit_cate_mini2{ /* キット難易度・ステッチ名で使っている */
          border:0px;
          font-size:85%;
/*          background-color:#ECECFF;*/
          background-color:#ddddff;    /*少し濃くした */
          padding:3px;
          margin-bottom:0px;
}


.kit_cate_mini3{  /* 使わないと思う */
          border:0px;
          font-size:85%;
          background-color:#ECECFF;
          padding:1px;
          margin-top:0px;
          margin-bottom:3px;
          line-height:100%;
          vertical-align:top;
}

P.menu_item1,P.menu_item2,P.menu_item3 { /* 使わないと思う */
         border: 1px solid #ccccff;
         margin-top:0px; 
         padding-top:0px; 
         padding-bottom:5px; 
         padding-left:0px; 
         padding-right:2px; 
         line-height:170%;
}


P.menu_hosoku,P.menu_order,P.menu_info { /* 使わないと思う */
         border: 1px solid #ccccff;
         margin-top:0px; 
         padding-top:0px; 
         padding-bottom:5px; 
         padding-left:0px; 
         padding-right:auto; 
         line-height:170%;
}

P.menu_misc {   /* 使わないと思う */
         border: 1px solid #ccccff;
         margin-top:20px; 
         margin-bottom:30px;
         padding-top:5px; 
         padding-bottom:5px; 
         padding-left:5px; 
         padding-right:auto; 
         line-height:120%;}


.kit_sub,.ac_sub,.book_sub{    /* 使わないと思う */
          border:0px;
          margin-left:5px;
          margin-top:0px;
          line-height:180%;
}

.hosoku_sub,.order_sub{   /* 使わないと思う */
          border:0px;
          margin-left:5px;
          margin-top:0px;
          line-height:150%;
}

.info_sub{  /* 使わないと思う */
          border:0px;
          margin-left:5px;
          margin-top:0px;
          line-height:220%;
}

a.kit_sub_no,a.ac_sub_no{  /* 使わないと思う */
           margin-left:2px;
}


a.viewcart,a.kaiin,a.smart{
           margin-right:20px;
           line-height:200%;
}



a.decol {
          text-decoration: none; 
}

.small_com{ /* 使わないと思う */
           font-size:smaller;
           line-height:50%;
           padding-top:0px;
           padding-left:5px;
}


.dm_smallimg{  /* 使わないと思う */
           border:0px;
           float:right;
}

/* メニュー定義 END */


/* 一般定義 START */
.page_link { 
          width:500px;
          padding: 5px;
          margin-left:auto;
          margin-right:auto;
          margin-top:30px;
          margin-bottom:10px;
          text-align:center;
}

.link_box{
          width: 600px; 
          padding: 5px;
          margin-bottom:20px;
}

.link_title{
          padding: 5px;
          margin-bottom:10px;
          font-weight:bolder;
}
.link_item{
          padding: 5px;
          margin-bottom:10px;

}

.page_top {position:relative; bottom:0px;
}



/* ● バナーのレイアウトのため START●*/


	.banner-box-ul-wide {			/* ●バナーの入った箱を並べる箱 */
		text-align:center;
		padding:0px;      	/* これがないと左に変な余白ができる*/
		margin-left:auto;
		margin-right:auto;
		width:98%;  		/* 幅を指定していればセンタリング可能*/
		border:0px solid #ffccff;	/* テストカラー */
		border-collapse:separate; /* これでのみli間のスペースが開けられる*/
		border-spacing: 3px; 	/* 上の行とセット。セル間のスペースサイズ指定*/
		list-style-type: none; 
	}

		.banner-box-ul-wide li{		/*●バナーを入れる箱1個分 */
			float:left;
			vertical-align:top;
			max-width:120px;   	/* 表示最大幅設定*/
			/*min-width:100px;*/   	/* 表示最小幅設定*/
			text-align:center;
			padding:5px;
			border:0px solid #66ccff;	/* テストカラー */
		}




/* ● バナーのレイアウトのため END●*/


table.unit {table-layout:fixed; width:600px;}  	/*使わないと思う*/
td.item{widt:120px; border:1px solid;}   	/*使わないと思う*/

table.link { /*●トップページでのバナーに使っているようだが、リストをテーブル形式に表示する物に変える*/
	table-layout:fixed;
	width:660px;
	margin-left:20px;
}

td.link {	/*使わないと思う*/
	border:0px solid;
}


.hot {color:cc0099;}

.att_info { font-size:larger ; color:#cc0099; font-weight:bolder;}




.subhead { 
          padding:3px 3px 3px 10px ;
          margin-bottom:10px;
          font-size:larger ;
          color:#ffffff;
          font-weight:bolder;
          background-color:#9999ff}  /* 小見出しprple #9999ff */

.super_script_comments{
             color:#000000; 
             margin-top:0px;
             line-height:100%;
             padding:0px;
             vertical-align:top;
}

.small_comments{
             font-size:smaller;
             color:#000000; 
             margin-top:0px;
             line-height:110%;
             padding:0px;
             vertical-align:top;
}

.small_comments_multi{ /* ここ後で変えるwidth:100%;に*/
             width:160px;
             font-size:smaller;
             color:#000000; 
             margin-top:5px;
             line-height:140%;
             padding:0px;


}

.large_comments{
           font-size:larger;
             color:#000000; }

.small_str{
             font-size:smaller;
}

/* 一般定義 END */

/* 一般情報ボックス START */


.move-info{
	width: 80%;
	margin-left:5%;
	margin-top: 20px;
	border: 0px solid #000000;
	font-size:120%;
	text-align:left;
	line-height:170%;
	border:0px solid #9966FF;	/* テストカラー*/
}


.centerbox{
 width: 70%;
 margin-left: auto;
 margin-right: auto;
 margin-top: 20px;
 border: 0px solid #000000;
}



.general_info{
          width:620px;
          margin-left:auto;
          margin-right:auto;
          margin-top:10px;
          margin-bottom:40px;  
          vertical-align:top;
          text-align:left;
          padding-bottom:15px;
          padding-left:15px;
          border:1px solid #cccccc;

}   

.general_info_left{
          width:90%;
          margin-left:0px;
          margin-right:auto;
          margin-top:10px;
          margin-bottom:40px;  
          vertical-align:middle;
          padding:15px;
          border:1px solid #9966FF;

}   
.general_info_strong { 
          margin-left:auto;
          margin-right:auto;
          width: 480px; 
          padding: 7px; 
          border: 2px solid #ccccff;}
   




/* 一般情報ボックス END */



/* お問合せ画面 START */
.inform_t{         /*使わない*/
          font-weight:bold;
          font-size:x-large;
          color:#3333ff
}


.inform_box{    /*フォーム全体覆う*/
	width:70%; 
	margin-left:5%; 
	margin-right:auto;
	margin-top:20px;
	margin-bottom:20px;
	/*border:0px solid #ccccff;*/  /* テストカラー：薄紫の線*/
}

	@media screen and (max-width: 500px) {	/* ●横幅が500ピクセル以下の画面になったら、幅を枠いっぱいにする */
	         .inform_box{    /*フォーム全体覆う*/
			width:95%; 
			margin-left:auto; 
			margin-right:auto;
		}

	}

	.inform_box hr{
		width:100%;
		/*height:5px;*/	/* 水平線の高さ指定 */
		border:solid 1px #ccccff;
		/*color:#ccccff;*/  /* 薄紫の線*/

	}

.inform_list{
         padding:5px; 
         background-color:#E6E6FA; /* すごい薄い紫*/
         /*background-color:#EEEEEE; */ /* 薄グレー*/
         font-weight:bold;

}

	input[type="text"] { /*formのテキスト入力ボックスに対する指定*/
		width:80%;	
		margin-left:auto; 
		margin-right:auto;"
	}

	
        textarea{	/*formの複数行テキストエリアに対する指定*/
		width:95%;	
	}


/* お問合せ画面 END */


/* 注文方法.html START */


ul.tyumon,ul.shohin,ul.cart,ul.hurikomi,ul.mail,ul.henpin{
         width:90%;
         margin-left:5px;
         margin-right:5px;
         line-height:140%;

}


.top_margin{
         margin-top:30px;         

}

ul.hassou_top_margin{
         width:90%;
         margin-top:30px;         
         margin-left:5px;
         margin-right:5px;
         line-height:150%;

}


ul.hassou{
         width:90%;
         margin-left:5px;
         margin-right:5px;
         line-height:150%;

}

.module{
         width:95%;
         margin-left:20px;
         margin-top:30px;
         margin-bottom:20px;
         line-height:130%;

}

.module_upper{
         width:95%;
         margin-left:20px;
         margin-top:5px;
         margin-bottom:20px;
         line-height:130%;

}

.strong_subhead{
       color:#e2041b;
       font-weight:bold;
	font-size:120%; 

           
}

.b1_str{
       color:#cc0099;
       font-weight:bold;
           
}

.b2_str{
       color:#3366ff;
       font-weight:bold;

}

.astmark{
         color:#3366ff;
         font-weight:bold;
}

.ginko{
         font-weight:normal;
}





table.shiharai{
           width:98%;
           border: 1px solid #778899;
         margin-left:20px;

}



td.ginko{
           width:160px;
           padding:5px; 
           border: 1px solid #778899;
           background-color:#F0F8FF;
           text-align:left;

}
td.ginko_shiharai{
           width:50px;
           padding:5px; 
           border: 1px solid #778899;
           background-color:#F0F8FF;
           text-align:center;

}

td.ginko_setumei{
           border: 1px solid #778899;
           background-color:#F0F8FF;
           padding:5px; 
           text-align:left;

}

td.daibiki{
           width:160px;
           padding:5px; 
           border: 1px solid #778899;
           background-color:#E6E6FA;
           text-align:left;

}

td.daibiki_setumei{
           border: 1px solid #778899;
           background-color:#E6E6FA;
           padding:5px; 
           text-align:left;

}

td.syokai_order{
           border: 1px solid #778899;
           background-color:#FDF5E6;
           padding:5px; 
           text-align:left;

}

table.new-shiharai{	/* ●新しい支払方法用テーブル */
	width:95%;
	border: 1px solid #778899;
	border-collapse:collapse;
	margin-top:2%;
	margin-bottom:1%;
	margin-left:3%;
	margin-right:3%;
	padding:0px; 
}

	table.new-shiharai tr:nth-child(odd){  	/* ●奇数行の指定：新しい支払方法用テーブル */
		background-color:#F0F8FF;
	}


	table.new-shiharai tr:nth-child(3){  	/* ●上から４行目・代引きの指定：新しい支払方法用テーブル */
           background-color:#E6E6FA;
	}


	table.new-shiharai tr:nth-child(4){  	/* ●上から４行目・初めての人の指定：新しい支払方法用テーブル */
           background-color:#FDF5E6;
	}

	table.new-shiharai td	{ /* ●新しい支払方法用テーブルの項目 */
		border: 1px solid #778899;
		padding:1%;
		text-align:left;
	}

	
	table.new-shiharai td:nth-child(1)	{ /* ●テーブルの項目の左端 */
		width:25%;
		/*max-width:10em;*/
		font-weight:bold;
	}

	table.new-shiharai td:nth-child(2)	{ /* ●テーブルの項目の左から2番目 */
		max-width:25%;
		font-weight:bold;
	}

	table.new-shiharai tr:nth-child(2) td:nth-child(1)	{ /* ●テーブルの項目の上から2行目で、左から2番目 */
		font-weight:bold;
		width:10em;
	}

	table.new-shiharai tr:nth-child(2) td:nth-child(2)	{ /* ●テーブルの項目の上から2行目で、左から3番目 */
		font-weight:normal;
	}


	table.new-shiharai td:nth-child(3)	{ /* ●テーブルの項目の右端 */
		/*width:55%;*/
		/*max-width:55%;*/
	}

		table.new-shiharai td p{   /* ●テーブルの項目の中の段落 */
			/*font-size:smaller;*/
			font-size:95%;	/* smallerでは小さすぎるため */
			text-indent:1%;
			margin-top:1px;
			margin-bottom:2px;
			font-weight:normal;
		}

			table.new-shiharai td p:before{/* ●テーブルの項目の中の段落の先頭のマーク指定 */
				content:"・";
			}
		/* ●新しい支払方法用テーブル  END*/



table.hassou-tuiseki{	/* ●追跡サービス付の普通郵便のサイズ、重さ、料金用テーブル */
	width:95%;
	border: 1px solid #778899;
	border-collapse:collapse;
	margin-top:2%;
	margin-bottom:1%;
	margin-left:3%;
	margin-right:3%;
	padding:0px; 
}

	table.hassou-tuiseki tr:nth-child(odd){  	/* ●奇数行の指定：新しい発送方法用テーブル */
		background-color:#F0F8FF;
	}

	table.hassou-tuiseki tr:first-child td{  	/* ●一番上の行の指定：新しい発送方法用テーブル */
		background-color:#E6E6FA;	/* この行は、上の奇数行の指定の後でないと効かない*/
		text-align:center;
	}

	table.hassou-tuiseki td	{ /* ●新しい発送方法用テーブルの項目 */
		border: 1px solid #778899;
		padding:1%;
		text-align:center;
	}

	
	table.hassou-tuiseki td:first-child	{ /* ●テーブルの項目の左端：サービス名 */
		/*width:20%;*/
		max-width:10em;
		text-align:left;
		font-weight:bold;
	}

	table.hassou-tuiseki td:nth-child(2)	{ /* ●テーブルの項目の左から2番目：大きさ */
		/*width:20%;*/
		max-width:10em;
		text-align:left;
	}

	table.hassou-tuiseki td:last-child	{ /* ●テーブルの項目の右端：料金 */
		/*width:20%;*/
		max-width:10em;
		text-align:left;
	}

		/* ●追跡サービス付の普通郵便のサイズ、重さ、料金用テーブル  END*/


table.new-hassou{	/* ●新しい発送方法用テーブル */
	width:95%;
	border: 1px solid #778899;
	border-collapse:collapse;
	margin-top:2%;
	margin-bottom:1%;
	margin-left:3%;
	margin-right:3%;
	padding:0px; 
}

	table.new-hassou tr:nth-child(odd){  	/* ●奇数行の指定：新しい発送方法用テーブル */
		background-color:#F0F8FF;
	}

	table.new-hassou tr:first-child td{  	/* ●一番上の行の指定：新しい発送方法用テーブル */
		background-color:#E6E6FA;	/* この行は、上の奇数行の指定の後でないと効かない*/
		text-align:center;
	}

	table.new-hassou td	{ /* ●新しい発送方法用テーブルの項目 */
		border: 1px solid #778899;
		padding:1%;
		text-align:center;
	}

	
	table.new-hassou td:first-child	{ /* ●テーブルの項目の左端 */
		/*width:20%;*/
		max-width:10em;
		text-align:left;
		font-weight:bold;
	}

	table.new-hassou td:last-child	{ /* ●テーブルの項目の右端 */
		/*width:20%;*/
		max-width:10em;
		text-align:left;
	}

		table.new-hassou td p{   /* ●テーブルの項目の中の段落 */
			/*font-size:smaller;*/
			font-size:95%;	/* smallerでは小さすぎるため */
			text-indent:1%;
			margin-top:1px;
			margin-bottom:2px;
			font-weight:normal;
		}

			table.new-hassou td p:before{/* ●テーブルの項目の中の段落の先頭のマーク指定 */
				content:"・";
			}
		/* ●新しい発送方法用テーブル  END*/


table.new-hassou-op{	/* ●新しい発送方法用テーブルのオプション */
	width:80%;
	border: 1px solid #778899;
	border-collapse:collapse;
	margin-top:2%;
	margin-bottom:1%;
	margin-left:auto;
	margin-right:auto;;
	padding:0px; 
}


	table.new-hassou-op tr:first-child td{  	/* ●一番上の行の指定：新しい発送方法用テーブル */
		background-color:#E6E6FA;	/* 薄紫*/
		text-align:center;
	}


	table.new-hassou-op tr:last-child td{  	/* ●一番下の行の指定：新しい発送方法用テーブル */
		background-color:#F0F8FF;	/* 薄い水色 */
	}

	table.new-hassou-op td	{ /* ●新しい発送方法用テーブルの項目 */
		border: 1px solid #778899;
		padding:1%;
		text-align:center;
	}

	
	table.new-hassou-op td:first-child	{ /* ●テーブルの項目の左端 */
		width:25%;
		text-align:left;
	}

	table.new-hassou-op td:nth-child(2)	{ /* ●テーブルの項目の左から2番目端 */
		width:15%;
		text-align:center;
	}

	table.new-hassou-op td:nth-child(3)	{ /* ●テーブルの項目の右端 */
		/*width:20%;*/
		/*max-width:10em;*/
		text-align:left;
	}

		table.new-hassou-op td p{   /* ●テーブルの項目の中の段落 */
			/*font-size:smaller;*/
			font-size:95%;	/* smallerでは小さすぎるため */
			text-indent:1%;
			margin-top:1px;
			margin-bottom:2px;
		}

			table.new-hassou-op td p:before{/* ●テーブルの項目の中の段落の先頭のマーク指定 */
				content:"・";
			}

		/* ●新しい発送方法用テーブルのオプション END*/

table.hassou{
               width:90%;
               margin-left:40px;
               margin-right:20px;
               padding:0px; 
               border: 1px solid #778899;
}

	table.hassou td	{
               border: 1px solid #778899;
	}

table.hassou_op{
               width:90%;
               margin-left:40px;
               margin-right:20px;
               padding:0px; 
               border: 1px solid #778899;
}


td.ha_title{
           width:20%;
           border: 1px solid #778899;
           background-color:#E6E6FA;
           padding:5px; 
           text-align:left;

}

td.souryou{
           width:20%;
           border: 1px solid #778899;
           background-color:#E6E6FA;
           padding:5px; 
           text-align:left;

}

td.tuika{
           width:10%;
           border: 1px solid #778899;
           background-color:#E6E6FA;
           padding:5px; 
           text-align:left;

}


td.hosoku{
           padding:5px; 
           border: 1px solid #778899;
           background-color:#E6E6FA;
           text-align:left;

}

td.ha_title1{
           width:20%;
           border: 1px solid #778899;
           background-color:#F0F8FF;
           padding:5px; 
           text-align:left;

}

td.souryou1{
           width:20%;
           border: 1px solid #778899;
           background-color:#F0F8FF;
           padding:5px; 
           text-align:left;

}

td.tuika1{
           width:10%;
           border: 1px solid #778899;
           background-color:#F0F8FF;
           padding:5px; 
           text-align:left;

}

td.hosoku1{
           padding:5px; 
           border: 1px solid #778899;
           background-color:#F0F8FF;
           text-align:left;

}

td.ha_title2{
           width:20%;
           border: 1px solid #778899;
           background-color:#FFFFFF;
           padding:5px; 
           text-align:left;

}

td.souryou2{
           width:20%;
           border: 1px solid #778899;
           background-color:#FFFFFF;
           padding:5px; 
           text-align:left;

}

td.tuika2{
           width:10%;
           border: 1px solid #778899;
           background-color:#FFFFFF;
           padding:5px; 
           text-align:left;

}

td.hosoku2{
           padding:5px; 
           border: 1px solid #778899;
           background-color:#FFFFFF;
           text-align:left;

}

/* 注文方法.html END */

/* 商品詳細.html START */


.work_sub{
         font-weight:bold;
}


.work_sub_info{
         line-height:150%;
}

.work_att_info {
          color:#3366ff;
}

.work_att_infob {
          color:#6633ff;
          font-weight:bolder;
}



.s_img_title{
         font-weight:middle;
}




.bikou {
          color:#3366ff;
          font-weight:bolder;
}



table.work_box{
          width:70%;
          margin-left:auto;
          margin-right:auto;
          border:2px solid #666699;
          border-collapse:collapse;
          padding:0px;
          margin-top:20px;
          margin-bottom:40px;  
}
td.work_title{
          padding:8px;
          color:#3366FF;
          font-weight:bolder;
          font-size:larger;
          border:2px solid #666699;
}

td.work_sub{
          width:80px;
          padding:5px;
          text-align:center;

}

td.work_sub_info{
          padding:5px;
          text-align:left;
}

td.work_info{
          padding:15px;
          text-align:left;
}

.work_img_center{
           text-align:center;
           margin-bottom:5px;       
           margin-top:20px;       

}

.siyou_henkou{
   color:#6633ff; 
   font-weight:bold;

}

/* 商品詳細.html END */


/* 使用金具について clasp_info.shtml START */

.ear_title{
	color:#000099;
          width:90%;
          font-weight:bold;
          font-size:larger;
          margin-top:20px;
          margin-left:20px;
          border: 0px solid #ccccff;
          text-align:left;
}

.clsp_info_ul{
	display:table;
        margin-left:10px;
	margin-top:20px;
	padding:0px;      	/* これがないと左に変な余白ができる*/
	 /*width:80%; */  /* 幅を指定しないとborde-spacingを%単位にした場合効かない */
        border: 0px solid #ccccff;  /* テストカラー */
	text-align:left;
	list-style-type:none;
	border-collapse:separate; /* これでのみli間のスペースが開けられる*/
	border-spacing: 15px; 	/* 上の行とセット。セル間のスペースサイズ指定*/
}


	.clsp_info_ul li{
		display:table-cell;
		border:0px solid #ccccff;   /* テストカラー */
		margin-bottom:5px;

	}


	.clsp_info_ul li:nth-child(1){
		color:#cc3399;
		font-size:120%;
		font-weight:bold;
	}

	@media screen and (max-width: 500px) {	/* ●横幅が500ピクセル以下の画面になったら、幅を枠いっぱいにする */
		.clsp_info_ul{
			display:block;
		}

		.clsp_info_ul li{
			display:block;
		}
	}


.clsp_info{
          width:90%;
          margin-left:auto;
          margin-right:auto;
          margin-top:10px;
          margin-bottom:30px;  
          padding:2%;
          border:1px solid #9966FF;

}   

.clsp_info2{
	width:90%;
	margin-left:auto;
	margin-right:auto;
	margin-top:10px;
	margin-bottom:30px;  
	padding:0px;
	border:0px solid #ccccff;   /* テストカラー */

}   

	.clsp_info2 img {
      		width:100%;	/* 外枠list-imgのサイズに応じて画像サイズが変化 */
		vertical-align:bottom;	/* 画像の下の謎のすき間を消す */
	}
	


.ear_desc{
          width:85%;
          margin-top:5px;
          margin-left:50px;
	margin-bottom:10px;
          border: 0px solid #ccccff;
          text-align:left;
          line-height:130%;
}

.ear_box{
          width:250px;
          margin-top:0px;
          margin-bottom:5px;
          margin-left:30px;
          margin-right:5px;
          border: 0px solid #ccccff;
          float:left;
          text-align:left;
          line-height:130%;
}

img.ear_item{
        margin-top:25px;
        margin-right:5px;
        margin-left:0px;
        border:0px;
}


/* 使用金具について clasp_info.shtml END */


/* ●kit_lvl.html内 START */

/* ● table-cellを使ったレイアウトのため スタート*/


/*.list-box-container{   */ /* list-box-ulの外箱。 ulの幅指定があればいらない*/
/*   text-align:center;  */
/* }                     */


.list-box-ul {			/* ●画像とテキストの入った箱を並べる箱 */
      display: table;
      table-layout:fixed;  	/*セルの幅を固定レイアウトにするため*/
      text-align:center;
      padding:0px;      	/* これがないと左に変な余白ができる*/
      margin-left:auto;
      margin-right:auto;
      width:98%;  		/* 幅を指定していればセンタリング可能*/
      border:0px solid #ffccff;	/* テストカラー */
      border-collapse:separate; /* これでのみli間のスペースが開けられる*/
      border-spacing: 10px; 	/* 上の行とセット。セル間のスペースサイズ指定*/
      /* list-style-type: none; */
}

	.list-box-ul li{		/*● 画像とテキストを入れる箱1個分 */
		display: table-cell;
		vertical-align:top;
		max-width:250px;   	/* 表示最大幅設定*/
		min-width:100px;   	/* 表示最小幅設定*/
		text-align:center;
		padding:5px;
		border:0px solid #66ccff;	/* テストカラー */
	}

		.list-img{			/* ●画像を入れる箱 */
			vertical-align:top;
			margin-left:auto;
			margin-right:auto;
			max-width:140px;	/* 表示最大幅設定*/
			max-height:140px;	/* 表示最大高さ設定*/
			overflow:hidden;  	/* 高さをはみ出た分はカットして表示しない指定*/
			border:0px solid #ccccff; 	/* テストカラー */
			text-align:center;
		}

			.list-img img {
		      		width:100%;	/* 外枠list-imgのサイズに応じて画像サイズが変化 */
			}

	.list-text{			/* ●画像の説明を入れる箱*/
		vertical-align:top;
		margin-left:auto;
		/*text-align:left;*/
		margin-right:auto;
		margin-top:3px;
		max-width:200px;   	/* 表示最大幅設定*/
		width:100%;   	/* 表示最大*/
		padding:0px;
		border:0px solid #ccccff;	/* テストカラー */
	}


/* ● table-cellを使ったレイアウトのため 終わり*/



.kitinfo_box{
          margin-left: 20px;
          margin-top: 20px;
}


.lvl_box{
          width:130px;
          padding-bottom: 5px;
          margin-top:20px;
          margin-bottom:5px;
          margin-left:20px;
          margin-right:5px;
          border: 0px solid #ccccff;
          float:left;
          text-align:center;
}

.lvl_bar{	/* ●floatをクリア● */
	width:80%; 
	height:1px;
	border:0px solid #ccccff;
	clear:both;
}        

.lvl_img{
         margin-bottom:5px;
          margin-left:auto;
          margin-right:auto;
 }        


.strstitch{
            font-size:smaller;
}

/*  kit_lvl内 END */


/* neck_idx.html, class_work.shtmlなど START */
.item_titlebox{
          width:600px;
          padding:15px;
          margin-right:auto;
          margin-left:auto;
          border:0px solid #000000;
          text-align:center;
}

.cate_title{
          text-align:center;
          color:#6666ff;
          font-size:larger;
          font-weight:bolder;
          margin-bottom:20px;
          margin-top:20px;
          border:0px solid #ccccff;   
}
.item_title { 
          font-weight:bolder;
          background-color:#ccccff;
          border:0px solid #000000;
          padding:4px;
          margin-left:15px;
} 
.item_box{
          width:640px;
          padding: 0px;
          margin-bottom:20px;
          margin-top:0px;
          margin-right:auto;
          margin-left:auto;
          border:0px solid #ccccff;
          line-height:150%;
}      
.item_img{
          border:1px solid #cccccc;
          width:120px;
          padding-top:10px;    
          padding-left:10px;    
          padding-right:10px;    
          padding-bottom:15px;    
          vertical-align:bottom;
          text-align:center;

}

.item_info{
          width:120px;
          vertical-align:top;
          text-align:center;
          padding-bottom:15px;
          border:0px solid #cccccc;
}   
/* neck_idx.htmlなど END */





/* ●教室class.shtml内　START● */



#class_int {    /* ●教室概要のBOX*/
          width:95%;
          border: 0px solid #ccccff; 
          vertical-align:top;
          margin-left:auto;
          margin-right:auto;
}



table.classint{  /* ●教室案内内容のテーブル*/
	border: 1px solid #778899;
	border-collapse:collapse;
	width:95%;
	margin-left:auto;
	margin-right:auto;
	margin-top:20px;
	margin-bottom:20px;
}

	table.classint tr:first-child td{  	/* ●一番上の行の指定：教室案内内容テーブル */
		background-color:#E6E6FA;	/* 薄紫*/
		text-align:center;
		font-weight:bold;
	}


	table.classint td:nth-child(1){ /* ●一番左の列の指定：教室案内内容テーブル */
		width:20%;
		border:1px solid #778899;
		text-align:center;
		padding:10px;
	}

	table.classint td:nth-child(2){   /* ●左から2番目の列の指定：教室案内内容テーブル */
		border:1px solid #778899;
		text-align:left;
		padding:10px;
	}


.sample1{  /* ●教室案内内容の小さい画像*/
         float:right;
         margin-right:1%;
         margin-left:2%;
}

.class_course{ 
             color:#0000ff;
             width:80%;
             border:0px solid #ccccff;
             font-weight:bolder;
             font-size:larger;              
             text-align:left; 
             margin-top:40px;   
              
}

ul.class_list{  /* ●教室案内内容のリスト項目像*/
         width:90%;
         margin-left:auto;
         margin-right:auto;
         line-height:140%;

}


.explink{
       float:right; 
       margin-right:10px;
       margin-bottom:20px;
       text-decoration:none;    
}


/* ●教室class.shtml内　END● */



/*●作品展関係　START*/
.houkoku,.info{		/* 報告文章枠 */
          width:90%; 
          border:0px solid #99cccc;
          padding: 20px;
          margin-top:30px;
          margin-left:auto;
          margin-right:auto;
          margin-bottom:10px;

}

.info_aqa{
         width:80%;
         border:2px solid #99cccc;
         padding: 10px;
         margin-top:10px;
         margin-left:auto;
         margin-right:auto;
         margin-bottom:30px;
}

.info_prp{
         width:80%;
         border:2px solid #cc99ff;
         padding: 10px;
         margin-top:10px;
         margin-left:auto;
         margin-right:auto;
         margin-bottom:30px;
}


.kaijyou,.toiawase,.classinfo{
         margin-left:30px;
}


/* ●画像の大きさや数が自由に配置できる table-cellを使ったレイアウト スタート*/
.free-box-ul,.free-box-ul-noframe {			/* ●画像とテキストの入った箱を並べる箱 */
      display: table;
      table-layout:fixed;  	/*セルの幅を固定レイアウトにするため*/
      text-align:center;
      padding:0px;      	/* これがないと左に変な余白ができる*/
      margin-left:auto;
      margin-right:auto;
      width:98%;  		/* 幅を指定していればセンタリング可能*/
      border:0px solid #ffccff;	/* テストカラー */
      border-collapse:separate; /* これでのみli間のスペースが開けられる*/
      border-spacing: 5px; 	/* 上の行とセット。セル間のスペースサイズ指定*/
      /* list-style-type: none; */
}

	.free-box-ul li,.free-box-ul-noframe li{		/*● 画像とテキストを入れる箱1個分 */
		display: table-cell;
		vertical-align:top;
		max-width:500px;   	/* 表示最大幅設定*/
		/*min-width:100px;*/   	/* 表示最小幅設定*/
		text-align:center;
		padding:2%;
		border:1px solid #cccccc;	
	}

		.free-img{			/* ●画像を入れる箱 */
			vertical-align:top;
			margin-left:auto;
			margin-right:auto;
			max-width:500px;	/* 表示最大幅設定*/
			/*max-height:140px;*/	/* 表示最大高さ設定*/
			/*overflow:hidden;*/  	/* 高さをはみ出た分はカットして表示しない指定*/
			border:0px solid #ccccff; 	/* テストカラー */
			/*text-align:center;*/
		}

			.free-img img {
		      		max-width:100%;	/* 外枠list-imgのサイズに応じて画像サイズが変化 */
			}

	.free-text{			/* ●画像の説明を入れる箱*/
		vertical-align:top;
		margin-left:auto;
		text-align:left;
		margin-right:auto;
		margin-top:3px;
		max-width:500px;   	/* 表示最大幅設定*/
		width:100%;   	/* 表示最大*/
		padding:0px;
		border:0px solid #ccccff;	/* テストカラー */
	}

		.small_free-text{ /* free-text内の補足*/
			width:80%;
			text-decoration:none;	/* テキストのリンクの下線を消す */
			font-size:smaller;
			color:#000000; 
 			margin-top:5px;
			line-height:140%;
			padding:0px;
			border:0px solid #ccccff;	/* テストカラー */
		}


	.free-box-ul-noframe li{
		border:0px solid #cccccc;	
	}

/* ● 画像の大きさや数が自由に配置できる table-cellを使ったレイアウト 終わり*/


/* ●フリー作品画像掲載 START*/

.free-img-box{
	text-align:center;
	padding:0px;   
	margin-top:30px;
	margin-bottom:20px;
	margin-left:auto;
	margin-right:auto;
	width:80%;  		/* 幅を指定していればセンタリング可能*/
	border:0px solid #ccccff;  /* 薄紫の線*/
}
	@media screen and (max-width: 800px) {	/* ●横幅が800ピクセル以下の画面になったら、幅を枠いっぱいにする */
	.free-img-box {
		margin-left:0px;
		margin-right:0px;
	        width:100%;
		/*min-width:350px;*/   	/* 表示最小幅設定*/

	     }
	}

.free-title{ 		/* ●作品タイトル */
          text-align:center;
          color:#6666ff;
          font-size:larger;
          font-weight:bolder;
          margin-bottom:2%;
          margin-top:3%; 		
          border:0px solid #ccccff;	
}

	.free-img{		/* ●作品画像 */
		text-align:center;
		margin-left:auto;
		margin-right:auto;
		margin-bottom:3%;
		padding:0px;      
		border:0px solid #cccccc;	/* 薄グレーの線 今は消しておく*/
		width:95%;
		max-width:640px;
		}

		.free-img img{
			vertical-align:bottom; /* 画像の下の謎のすき間を消すため*/
			/*width:100%;*/ 	/* 画像サイズ可変指定 今は消しておく*/
			max-width:100%;		/* 画像サイズ可変指定：画像の原寸大より大きくしない範囲で */
		}

	.free-img-text-top{	/* ●画像の上部分に付ける説明 */
		margin-bottom:10px;
	}

	.free-img-text-bottom{	/* ●画像の下部分に付ける説明 */
		margin-top:10px;
	}

	.free-img-text-top-left{	/* ●画像の上部分に付ける説明の左寄せの場合 */
		margin-bottom:10px;
		margin-left:10%;
		width:80%;
		text-align:left;
	}

	.free-img-text-bottom-left{	/* ●画像の下部分に付ける説明の左寄せの場合 */
		margin-top:10px;
		margin-left:10%;
		width:80%;
		text-align:left;
	}

/* ●フリー作品画像掲載 END */


/*●作品展関係　END*/


/*会員登録画面内　START*/
.cart_info{
          font-weight:bold;
}

.menb{
             border:1px solid #6699ff;    
             padding-left:10px;
             padding-right:10px;
}

/*会員登録画面内　END*/


/*特定商取引houmon.shtml内　START*/

table.houmonint{  /* ●特定商取引のテーブル*/
	border: 1px solid #778899;
	border-collapse:collapse;
	width:95%;
	margin-left:auto;
	margin-right:auto;
	margin-top:20px;
	margin-bottom:20px;
}

	table.houmonint tr:first-child td{  	/* ●一番上の行の指定：特定商取引テーブル */
		background-color:#E6E6FA;	/* 薄紫*/
		font-weight:bold;
	}


	table.houmonint td:nth-child(1){ /* ●一番左の列の指定：特定商取引テーブル */
		width:20%;
		border:1px solid #778899;
		text-align:center;
		padding:10px;
	}

	table.houmonint td:nth-child(2){   /* ●左から2番目の列の指定：特定商取引テーブル */
		border:1px solid #778899;
		text-align:left;
		padding:10px;
	}


img.eml{    /*●メールアドレスをイメージ化した物*/
        margin-top:0px;
        margin-left:1px;
        margin-right:1px;
        text-align:center;
        vertical-align:middle;
        border:1px;
    


}

/*特定商取引houmon.shtml　END*/


/*カート内画面内　START*/
.shopping_go{
          margin-left:10px;
          margin-top:20px;
          margin-bottom:20px;
          font-weight:bold;
}

a.shopdecol {
           text-decoration: none; 
           color:#333333;
           background-color:#f9f9f9;
           padding-left:10px; 
           padding-right:10px; 
           padding-top:3px;  
           padding-bottom:3px; 
           border:2px solid;
           border-style:outset;
}
/*カート画面内　END*/


/* ページジャンプ関係　START*/

.p_top{
          margin-right:30px;
          margin-bottom:30px;
          text-align:right;
}

.jumpbox{
          margin-left:5px;
          margin-bottom:30px;
          margin-top:30px;

}

.jumphome{
          margin-left:20px;
          margin-bottom:30px;
}

.jumptop{
          margin-left:50px;
          margin-bottom:30px;
}

.jumptopright{	/*●ページの先頭へ飛ぶ*/	
          margin-right:0px;
          margin-bottom:30px;
          float:right;
}

/* ページジャンプ関係　END*/


/* 画像表示関係　Start*/
img.space{
         border:0px solid #33ccff;
}

.work_img_center{
           text-align:center;
           margin-bottom:5px;       
           margin-top:20px;       

}

img.acc_item{
        margin-top:25px;
        margin-right:5px;
        margin-left:20px;
        border:1px solid #336699;
}

.right_image{
         float:right;
         margin-right:1%;
         margin-left:2%;
}

.img_box{
          padding: 5px;
          margin-top:30px;
          margin-bottom:5px;
          margin-left:10px;
          margin-right:auto;
          border: 0px solid #ccccff;
          float:left;
          text-align:center;
}



.img_bar{
          width:90%; 
          border:0px solid #ccccff;
         clear:both;
}        




/* 画像表示関係　END*/



/* リスト表示関係 START*/

ul.indent0{
        margin-left:0px;
        line-height:150%;
}
ul.indent1{
        margin-left:30px;
        margin-top:0px;
}
/* リスト表示関係 END*/

/*エラー関係 START*/
.error_box {
          width:70%;
          border: 0px solid #ccccff; 
          margin-left:30px;
          text-align:left;
}

/*エラー関係 END*/


/* book_info.shtml関連 START */
.bookint{
          width:85%;
          margin-left:auto;
          margin-right:auto;
          margin-top:30px;
          margin-bottom:30px;  
          padding:10px;
          border:1px solid #9966FF;
          text-align:left;
          padding:3%;
}


.index_tytle{
	width:95%;
	font-size:170%;
	font-weight:bold;
	margin-top:10px;
	margin-bottom:10px;
	word-wrap:break-word;
}

.index_bu{
	width:95%;
	font-size:140%;
	font-weight:bold;
	margin-top:20px;
	margin-bottom:20px;
         margin-right:2%;
	word-wrap:break-word;
}

.index_syou{
	width:95%;
         font-size:120%;
         margin-top:10px;
         margin-bottom:5px;
         margin-left:3%;
         margin-right:2%;
	word-wrap:break-word;
}

.index_nakamidasi{
	width:95%;
         font-size:100%;
         margin-top:10px;
         margin-bottom:0px;
         margin-left:5%;
         margin-right:2%;
	word-wrap:break-word;
}


.book_layout{ /*●本の写真レイアウトBOX*/
          margin-top:10px;
          margin-left:2%;
          margin-right:2%;
          margin-bottom:10px;
	float:left;
	max-width:40%;

}

	.book_layout img{/*● 画像を可変指定*/
		max-width:100%;		
	}


.book_info{	/* ●本の内容紹介枠*/
          width:90%;
          margin-left:auto;
          margin-right:auto;
          margin-top:30px;
          margin-bottom:30px;  
          padding:3%;
          border:1px solid #9966FF;

}   


/* book_info.shtml定義 END */



/* ●NEW 商品一覧　START */

/* ● table-cellを使ったレイアウトのため スタート*/


/*.item-box-container{   */ /* item-box-ul-box-ulの外箱。 ulの幅指定があればいらない*/
/*   text-align:center;  */
/* }                     */


.item-box-ul {			/* ●画像とテキストの入った箱を並べる箱 */
      display: table;
      table-layout:fixed;  	/*セルの幅を固定レイアウトにするため*/
      text-align:center;
      padding:0px;      	/* これがないと左に変な余白ができる*/
      margin-left:auto;
      margin-right:auto;
      width:98%;  		/* 幅を指定していればセンタリング可能*/
      border:0px solid #ffccff;	/* テストカラー */
      border-collapse:separate; /* これでのみli間のスペースが開けられる*/
      border-spacing: 10px; 	/* 上の行とセット。セル間のスペースサイズ指定*/
      /* list-style-type: none; */
}

	.item-box-ul li{		/*● 画像とテキストを入れる箱1個分 */
		display: table-cell;
		vertical-align:top;
		max-width:250px;   	/* 表示最大幅設定*/
		min-width:100px;   	/* 表示最小幅設定*/
		text-align:center;
		padding:5px;
		border:0px solid #66ccff;	/* テストカラー */
	}

		.item-img{			/* ●画像を入れる箱 */
			vertical-align:top;
			margin-left:auto;
			margin-right:auto;
			max-width:140px;	/* 表示最大幅設定*/
			max-height:140px;	/* 表示最大高さ設定*/
			overflow:hidden;  	/* 高さをはみ出た分はカットして表示しない指定*/
			border:0px solid #ccccff; 	/* テストカラー */
			text-align:left;
		}

			.item-img img {
		      		width:100%;	/* 外枠item-box-ul-imgのサイズに応じて画像サイズが変化 */
			}

	.item-text{			/* ●画像の説明を入れる箱*/
		vertical-align:top;
		margin-left:auto;
		text-align:left; 
		margin-right:auto;
		margin-top:5px;
		margin-bottom:5px;
		max-width:200px;   	/* 表示最大幅設定*/
		width:100%;   	/* 表示最大*/
		padding:0px;
		border:0px solid #ccccff;	/* テストカラー */
	}


/* ● table-cellを使ったレイアウトのため 終わり*/

/* ●NEW 商品一覧　END */
