@charset "UTF-8";
/*
---------------------------------------------------------------------
	各ページ共通スタイルシート
---------------------------------------------------------------------
*/

/*--全ブラウザのスペース間隔リセット--*/
*{
		margin:0;
		padding:0;
}

body{
		color: #434343;
		background: url(./img/share/background.jpg) top no-repeat;
		background-position: 50% 0%;
		background-attachment:fixed;
		background-color: #feefe3;
		margin: 0;
		height: 100%;
		font-family:'メイリオ','Meiryo','Hiragino Kaku Gothic Pro','平成角ゴシック Pro W3','Osaka','ＭＳ Ｐゴシック',sans-serif;
		line-height: 17px;
}

a:link, a:visited{
		text-decoration: underline;
		color: #ff651f;
}

a.foot:link, a.foot:visited{
		text-decoration: underline;
		color: #fff;
}
					
a:hover{
		color: #fc1954;
		text-decoration: underline;
}

a.foot:hover{
		color: #ff4141;
		text-decoration: underline;
}

a:focus{
		outline:none;	/*--リンクをクリックした時の破線を消す。Firefoxのみ有効--*/
}
					
a{
		text-decoration: none;
}
					
a img{
		border-style: none;
}

img	{
		border: 0px;
}
					
h1{
		margin:0px;
		font-size:75%;
		font-weight:normal;
		color:#b80101;
		vertical-align:middle;
}
					
p.hide {
		display:none;
}

.text{
		font-size: 75%;
		text-justify: distribute;	/*--均等割り付け--*/
		text-align: justify;
}


/*
---------------------------------------------------------------------
	ページレイアウト（各ページ共通）
---------------------------------------------------------------------
*/

					
.outer{	
		margin: 0 auto;
		width: 890px;	/*--両端の影のサイズ--*/
}

html>body .outer{
		background-image:url(./img/share/bg.png);	/* 両端の影 IE6以外に適用 */
}
					
*html body .outer{/* 両端の影 IE6以下に適用 */
		filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='./img/share/bg.png', sizingMethod='scale');
}
		
.outer2{	
		margin: 0 auto;
		width: 890px;	/*--両端の影のサイズ--*/
}

html>body .outer2{
		background-image:url(./img/share/bg.png);	/* 両端の影 IE6以外に適用 */
}
					
*html body .outer2{/* 両端の影 IE6以下に適用 */
		filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../img/share/bg.png', sizingMethod='scale');
}
					
.wrapper{
		width: 870px;	/*--ページ表示部分最大幅です。--*/
		margin: 0px auto;	/*--ブラウザfirefoxでセンター揃えさせる。--*/
		min-height:100%;
}


#header_wrap{
		height: 60px;
		width: 900px;
		margin: 0 auto;
}

#header_left{
		height: 60px;
		width: 350px;
		float: left;
}

#header_right{
		height: 60px;
		width: 470px;
		float: right;
}

#footer{
		width: 100%;
		height: 200px;
		background: url(./img/share/footer.gif) repeat-x bottom left;
		margin: 0 auto;
}
		
#footer_wrap{
		height: 150px;
		width: 850px;
		margin: 0 auto;
}

#footer_left{
		height: 150px;
		width: 350px;
		float: left;
		text-align: center;
}

#footer_right{
		height: 150px;
		width: 500px;
		float: right;
		text-align: center;
}

#copy_right{
		font-size: 65%;
		color: #fff;
}
					
.spacer_10f{
		clear: both;	/*--floatを解除--*/
		margin: 0 auto;
		width: 760px;
		height:10px;
		overflow: hidden;	/*--IE6で小さい高さを指定する時のバグ対処--*/
}
					

#left_top{
		width: 230px;
		margin: 0px auto;
		font-size: 0px;
		line-height: 0px;
}

#left_middle{
		width: 228px;
		border-style: solid;
		border-width: 0px 1px;
		border-color: #fd6b19;
		margin: 0px auto;
}

#left_bottom{
		width: 230px;
		margin: 0px auto;
		font-size: 0px;
		line-height: 0px;
}

.browzer_wrap{
		width: 220px;
		margin: 0 auto;
		text-align: center;
		padding-bottom: 5px;
		border-style: solid;
		border-width: 1px 1px 1px 1px;
		border-color: #fd6b19;
}

.browzer_left{
	float: left;
}

.browzer_right{
	float: right;
}

/*--twitter--*/

#tw_title{
	width: 200px;
	margin: 0 auto;
}

#twitter_wrap{
	width: 215px;
	margin: 0 auto;
	padding: 10px 5px;
	margin-bottom: 20px;
	text-align: left;
	border: 1px solid #fd6b19;
	background-color: #fff;
}

#twitter_wrap ul{
	list-style:none;
}

/* リスト全体を囲む領域 */
ul#twitter_update_list {
	width: 190px;
    padding: 0;
}

/* リストの項目一つ一つの領域 */
ul#twitter_update_list li {
	background:url(./img/share/tw_icon.gif) 0 50% no-repeat;
    padding-left:20px;
    padding-bottom: 15px;
    text-justify: distribute;	/*--均等割り付け--*/
	text-align: left;
    width: 100%;
    border-bottom: 1px solid #ffd8b2;
    margin-bottom: 15px;
    word-break:break-all;
}
ul#twitter_update_list li span {
    font-size: 82%;
}

#twitter-link{
	font-size: 82%;
}

/*
---------------------------------------------------------------------
	ページレイアウト（トップページ）
---------------------------------------------------------------------
*/

.top_update{
		font-size: 75%;
		width: 550px;
		margin: 0 auto;
}

.top_title_char{
		width: 500px;
		font-size: 75%;
		text-align: left;
		margin-left: auto;
		text-justify: distribute;	/*--均等割り付け--*/
		text-align: justify;
}

#main_body_wrap{
		width: 850px;	/*--ページ表示部分最大幅です。--*/
		margin: 0px auto;	/*--ブラウザfirefoxでセンター揃えさせる。--*/
}

#main_body_left{
		width: 230px;
		float: left;
}

#main_body_right{
		width: 600px;
		float: right;
}

/*
---------------------------------------------------------------------
	ページレイアウト（会社概要）
---------------------------------------------------------------------
*/

#company_table{
		margin-bottom: 1em;
		padding: 2px;
		border: 2px solid #fe8d00;
		font-size: 75%;
		color: #341700;
}

#company_table table{
		width: 594px;
}

#company_table table th{
		padding: 7px 7px;
		width: 150px;
		background: #ffc781;
}

#company_table table td{
		padding: 7px 15px;
		background: #fde9d9;
}

/*
---------------------------------------------------------------------
	ページレイアウト（スタッフ紹介）
---------------------------------------------------------------------
*/

.staff_name{
		font-size: 90%;
		color: #1b1b1b;
		font-weight: bold;
}

#staff_width{
		width: 550px;
		margin:0 auto;
}
		
.staff_table{
		margin-bottom: 1em;
		padding: 2px;
		border: 2px solid #fe8d00;
		font-size: 75%;
		color: #341700;
}

.staff_table table{
		width: 544px;
}

.staff_table table th{
		padding: 7px 7px;
		width: 150px;
		background: #ffc781;
}

.staff_table table td{
		padding: 7px 15px;
		background: #fde9d9;
}

/*
---------------------------------------------------------------------
	ページレイアウト（料金案内）
---------------------------------------------------------------------
*/

#price_table{
		margin-bottom: 1em;
		padding: 2px;
		border: 2px solid #fe8d00;
		font-size: 70%;
		color: #341700;
}

#price_table table{
		width: 594px;
}

#price_table table th{
		padding: 4px 4px;
		background: #ffc781;
}

#price_table table td{
		padding: 10px 3px;
		background: #fde9d9;
		text-justify: distribute;	/*--均等割り付け--*/
		text-align: justify;
}


/*
---------------------------------------------------------------------
	ページレイアウト（製作実績）
---------------------------------------------------------------------
*/

.performance_wrap{
		width: 550px;	/*--ページ表示部分最大幅です。--*/
		margin: 0px auto;	/*--ブラウザfirefoxでセンター揃えさせる。--*/
}

.performance_left{
		width: 200px;
		float: left;
}

.performance_right{
		width: 330px;
		margin: 0 auto;
		float: right;
}

.plan_title{
		width: 400px;
		margin: 0 auto;
}

.per_block{
		border-top: 1px solid #E8E8E8;
		height: 30px;
}

.per_block_com{
		border-top: 1px solid #E8E8E8;
		height: 100%;
}

.per_text{
		margin-top:8px;
		margin-left: 7px;
		font-size: 75%;
}

.per_text_com{
		padding: 7px;
		font-size: 75%;
		text-justify: distribute;	/*--均等割り付け--*/
		text-align: justify;
}


/*
---------------------------------------------------------------------
	ページレイアウト（お問い合わせフォーム）
---------------------------------------------------------------------
*/

.mail_text75{
		text-align: center;
		font-size: 75%;
		width: 580px;
}
		
.mail_text_color{
		color: #1b1b1b;
}

#mail_table{
		width: 560px;
		font-size: 75%;
		margin-bottom: 1em;
		padding: 2px;
		border: 2px solid #fe8d00;
		margin-left: 15px;
}

#mail_table th{
		padding: 7px 7px;
		width: 180px;
		background: #ffc781;
}

#mail_table td{
		width: 380px;
		padding: 7px 15px;
		background: #fde9d9;
}

input.submit_btn{
	width: 150px;
	color: #fff;
	padding:5px;
	background: #ff671f;
	border: 0px;
	font-family:'メイリオ','Meiryo','Hiragino Kaku Gothic Pro','平成角ゴシック Pro W3','Osaka','ＭＳ Ｐゴシック',sans-serif;
}

input.input{
	width: 250px;
	padding:7px;
	border: 1px solid #ff671f;
	margin: 3px;
	font-family:'メイリオ','Meiryo','Hiragino Kaku Gothic Pro','平成角ゴシック Pro W3','Osaka','ＭＳ Ｐゴシック',sans-serif;
}

textarea.input{
	width: 320px;
	font-size: 100%;
	padding:7px;
	border: 1px solid #ff671f;
	font-family:'メイリオ','Meiryo','Hiragino Kaku Gothic Pro','平成角ゴシック Pro W3','Osaka','ＭＳ Ｐゴシック',sans-serif;
}

input.checkbox{
	margin: 3px;
}

input:checked  {
	outline: solid 3px #ff671f;
}

select{
	border: solid 1px #ff671f;
	font-family:'メイリオ','Meiryo','Hiragino Kaku Gothic Pro','平成角ゴシック Pro W3','Osaka','ＭＳ Ｐゴシック',sans-serif;
}


#strong{
		font-weight: bold;
}


/*
---------------------------------------------------------------------
	ページレイアウト（ホームページ制作の流れ）
---------------------------------------------------------------------
*/

.step_text{
		width: 500px;
		margin: 0 auto;
		font-size: 75%;
		text-justify: distribute;	/*--均等割り付け--*/
		text-align: justify;
}


/*
---------------------------------------------------------------------
	ページレイアウト（サービス内容）
---------------------------------------------------------------------
*/

.service_wrap{
		width: 600px;	/*--ページ表示部分最大幅です。--*/
		margin: 0px auto;	/*--ブラウザfirefoxでセンター揃えさせる。--*/
		font-size: 75%;
}

.service_left{
		width: 290px;
		float: left;
}

.service_right{
		width: 290px;
		float: right;
}

.service_text{
		width: 250px;
		margin: 0 auto;
		text-justify: distribute;	/*--均等割り付け--*/
		text-align: justify;
}


/*
---------------------------------------------------------------------
	ページレイアウト（チラシの製作/印刷）
---------------------------------------------------------------------
*/

#pub_table{
		margin-bottom: 1em;
		padding: 2px;
		border: 2px solid #2c92de;
		font-size: 75%;
}

#pub_table table{
		width: 594px;
}

#pub_table table th{
		padding: 7px 7px;
		background: #addafc;
		color: #014070;
}

#pub_table table td{
		padding: 7px 15px;
		background: #daeefd;
		text-align: center;
		font-weight: bold;
}


#pub_table2{
		margin-bottom: 1em;
		padding: 2px;
		border: 2px solid #a40989;
		font-size: 75%;
}

#pub_table2 table{
		width: 594px;
}

#pub_table2 table th{
		padding: 7px 7px;
		background: #fdbef2;
		color: #540145;
}

#pub_table2 table td{
		padding: 7px 15px;
		background: #ffdaf8;
		text-align: center;
		font-weight: bold;
}

#pub_table3{
		margin-bottom: 1em;
		padding: 2px;
		border: 2px solid #292929;
		font-size: 75%;
}

#pub_table3 table{
		width: 594px;
}

#pub_table3 table th{
		padding: 7px 7px;
		background: #dadada;
		color: #292929;
}

#pub_table3 table td{
		padding: 7px 15px;
		background: #ededed;
		text-align: center;
		font-weight: bold;
}

#pub_seisaku{
		width: 594px;
		margin: 0 auto;
		text-align: center;
}

#pub_seisaku table{
		font-size: 75%;
		border: 0px solid;
}

/*
---------------------------------------------------------------------
	ページレイアウト（企業ロゴの制作）
---------------------------------------------------------------------
*/

.logo_text{
		width: 500px;
		margin: 0 auto;
		font-size: 75%;
		text-justify: distribute;	/*--均等割り付け--*/
		text-align: justify;
}


/*
---------------------------------------------------------------------
	ページレイアウト（パンフレットの制作）
---------------------------------------------------------------------
*/

.brochure_text{
		width: 500px;
		margin: 0 auto;
		font-size: 75%;
		text-justify: distribute;	/*--均等割り付け--*/
		text-align: justify;
}

.brochure_seisaku{
		width: 594px;
		margin: 0 auto;
		text-align: center;
}

.brochure_seisaku table{
		font-size: 75%;
		border: 0px solid;
}

/*
---------------------------------------------------------------------
	ページレイアウト（印刷物デザイン実績）
---------------------------------------------------------------------
*/

.design_p_performance_text{
		width: 500px;
		margin: 0 auto;
		font-size: 75%;
		text-justify: distribute;	/*--均等割り付け--*/
		text-align: justify;
}

.design_p_performance{
		width: 594px;
		margin: 0 auto;
		text-align: center;
}

.design_p_performance table{
		font-size: 75%;
		border: 0px solid;
		text-align: center;
}

.performance_text{
		font-size: 75%;
		width: 185px;
		margin: 0 auto;
		text-align: center;
		margin-top: 10px;
}

/*
---------------------------------------------------------------------
	ページレイアウト（パソコン購入相談）
---------------------------------------------------------------------
*/

.buy_wrap{
		width: 600px;	/*--ページ表示部分最大幅です。--*/
		margin: 0px auto;	/*--ブラウザfirefoxでセンター揃えさせる。--*/
		font-size: 75%;
}

.buy_left{
		width: 290px;
		float: left;
}

.buy_right{
		width: 290px;
		float: right;
}

.buy_text{
		width: 250px;
		margin: 0 auto;
		text-justify: distribute;	/*--均等割り付け--*/
		text-align: justify;
}


/*
---------------------------------------------------------------------
	ページレイアウト（企業ロゴの制作）
---------------------------------------------------------------------
*/

.system_text{
		width: 500px;
		margin: 0 auto;
		font-size: 75%;
		text-justify: distribute;	/*--均等割り付け--*/
		text-align: justify;
}
		

/*
---------------------------------------------------------------------
	ページレイアウト（管理者用）
---------------------------------------------------------------------
*/

#kaiseki_table{
		margin-bottom: 1em;
		padding: 2px;
		border: 2px solid #fe8d00;
		font-size: 75%;
}

#kaiseki_table table{
		width: 794px;
}

#kaiseki_table th{
		padding: 7px 7px;
		background: #ffc781;
		color: #1b1b1b;
}

#kaiseki_table td{
		padding: 7px 15px;
		background: #fde9d9;
		text-align: center;
		font-weight: bold;
}

/*
---------------------------------------------------------------------
	ナビゲーション指定（メインメニューバー）
---------------------------------------------------------------------
*/

#top_swf{
		width:1000px;
		height:360px;
		margin:0 auto;
		position:relative;
}

#top_swf #swf{
		position:absolute;
		top:0;
		left:0;
		z-index:0;
}

#top_swf #menu_head{
		position:absolute;
		z-index:5;
}

#menu_head{
		width: 820px;
		margin: 0 auto;
		top:290px;
		left:90px;
		height: 70px;
}

#menu{
		list-style: none;
		width: 820px;
		position: absolute;
		margin: 4px 0px 0px 25px;
		padding: 0px;
}


/*
---------------------------------------------------------------------
	ナビゲーション指定（サイドメニューバー）
---------------------------------------------------------------------
*/

#side_menu1{
		margin: 0;
		padding: 0;
		list-style-type: none;	/*リストマークの削除*/
		width: 200px;
}

#side_menu1 li{
		width: 2280px;
		height: 32px;
		display: inline;
}




#side_menu1 a{
		text-indent: -9999px;	/*テキストを隠す*/
		text-decoration: none;
		display: block;
		width: 228px;
		height: 32px;	/*リンク領域を広げる*/
		background-image: url(画像のパス);
		background-repeat: no-repeat;
}

#side_navi1_1 a{
		width: 228px;
		height: 32px;
		display: block;
		background: url(./img/share/share_homepage_1.gif) top left no-repeat;
}

#side_navi1_2 a{
		width: 228px;
		height: 32px;
		display: block;
		background: url(./img/share/share_homepage_2.gif) top left no-repeat;
}

#side_navi1_3 a{
		width: 228px;
		height: 32px;
		display: block;
		background: url(./img/share/share_homepage_3.gif) top left no-repeat;
}
		
#side_navi2_1 a{
		width: 228px;
		height: 32px;
		display: block;
		background: url(./img/share/share_design_1.gif) top left no-repeat;
}

#side_navi2_2 a{
		width: 228px;
		height: 32px;
		display: block;
		background: url(./img/share/share_design_2.gif) top left no-repeat;
}

#side_navi2_3 a{
		width: 228px;
		height: 32px;
		display: block;
		background: url(./img/share/share_design_3.gif) top left no-repeat;
}

#side_navi2_4 a{
		width: 228px;
		height: 32px;
		display: block;
		background: url(./img/share/share_design_4.gif) top left no-repeat;
}

#side_navi3_1 a{
		width: 228px;
		height: 32px;
		display: block;
		background: url(./img/share/share_pc_1.gif) top left no-repeat;
}

#side_navi3_2 a{
		width: 228px;
		height: 32px;
		display: block;
		background: url(./img/share/share_pc_2.gif) top left no-repeat;
}
		
#side_navi3_3 a{
		width: 228px;
		height: 32px;
		display: block;
		background: url(./img/share/share_pc_3.gif) top left no-repeat;
}

#side_menu1 li a:hover{
		background-repeat:no-repeat;
		background-position:0 -32px;
}

/*
---------------------------------------------------------------------
	ナビゲーション指定（サイドメニューバー・別ページ時の反転用）
---------------------------------------------------------------------
*/

#id_side1_1 #side_navi1_1 a{
		width: 228px;
		height: 32px;
		background-repeat:no-repeat;
		background-position:0 -32px;
}

#id_side1_2 #side_navi1_2 a{
		width: 228px;
		height: 32px;
		background-repeat:no-repeat;
		background-position:0 -32px;
}

#id5 #side_navi1_3 a{
		width: 228px;
		height: 32px;
		background-repeat:no-repeat;
		background-position:0 -32px;
}

#id_side2_1 #side_navi2_1 a{
		width: 228px;
		height: 32px;
		background-repeat:no-repeat;
		background-position:0 -32px;
}

#id_side2_2 #side_navi2_2 a{
		width: 228px;
		height: 32px;
		background-repeat:no-repeat;
		background-position:0 -32px;
}

#id_side2_3 #side_navi2_3 a{
		width: 228px;
		height: 32px;
		background-repeat:no-repeat;
		background-position:0 -32px;
}

#id_side2_4 #side_navi2_4 a{
		width: 228px;
		height: 32px;
		background-repeat:no-repeat;
		background-position:0 -32px;
}

#id_side3_1 #side_navi3_1 a{
		width: 228px;
		height: 32px;
		background-repeat:no-repeat;
		background-position:0 -32px;
}

#id_side3_2 #side_navi3_2 a{
		width: 228px;
		height: 32px;
		background-repeat:no-repeat;
		background-position:0 -32px;
}

#id_side3_3 #side_navi3_3 a{
		width: 228px;
		height: 32px;
		background-repeat:no-repeat;
		background-position:0 -32px;
}