@charset "utf-8";
/*
Theme Name:   comict_bcc
Description:  BCCサイト用テンプレート
Author:       agsato
Author URI:   http://bcc.comict.net/
*/

/* ============================================================================================== */
/* = conversion table of font-size unit
/* ============================================================================================== */

/* base font-size = 13px

   10px ->  77%
   11px ->  85%    16px -> 124%    21px -> 162%
   12px ->  93%    17px -> 131%    22px -> 169%
   13px -> 100%    18px -> 139%    23px -> 177%
   14px -> 108%    19px -> 147%    24px -> 185%
   15px -> 116%    20px -> 154%    25px -> 192%
*/


/* ============================================================================================== */
/* = [initialization] リセット
/* ============================================================================================== */

html, body, div, span, applet, object, iframe, strong,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, legend, caption, 
tbody, tfoot, thead, table, label, tr, th, td
{
	margin         : 0;
	padding        : 0;
	border         : 0;
	outline        : 0;
	font-style     : inherit;
	font-size      : 100%;
	font-family    : inherit;
	vertical-align : baseline;
	list-style     : none;
	}

tbody, tfoot, thead, table, label, tr, th, td
{
    text-align     : left;
    }


/* ============================================================================================== */
/* = [initialization] オリジナル
/* ============================================================================================== */

/* 回り込み解除 (clearfix) */
.clearfix:after {
	visibility : hidden;
	display    : block;
	font-size  : 0;
	content    : " ";
	clear      : both;
	height     : 0;
	}
* html .clearfix             { zoom : 1; } /* IE6 */
*:first-child+html .clearfix { zoom : 1; } /* IE7 */

/* フォーカス時に入力ボックス等で指定した placeholder 属性の値が非表示になるようにする */
/* http://www.understandard.net/css/css012.html */
input:focus::-webkit-input-placeholder,
isindex:focus::-webkit-input-placeholder,
textarea:focus::-webkit-input-placeholder { color : transparent; }

/* 装飾 */
strong { font-weight    : bold;    }
em     { font-style     : oblique; }
sup    { vertical-align : super; font-size : 50%; }

/* Javascript が OFF の場合用の警告メッセージボックス */
.error-text {
	display          : block;
	padding          :  10px 10px;
	margin-bottom    :  10px;
	font-size        :  90%;
	font-weight      : bold;
	color            : #cc0000;
	background-color : #ffeeee;
	border           : 1px solid #aa0000;
	}










/* ============================================================================================== */
/* = [common] レイアウトボックス
/* ============================================================================================== */	

/* メインコンテンツ，サブコンテンツ用レイアウトボックス */
.boxunit {
	background            : #ffffff none;
	-moz-border-radius    : 5px;
	-webkit-border-radius : 5px;
	border-radius         : 5px;
	-moz-box-shadow       : 1px 1px 4px #a29f90;
	-webkit-box-shadow    : 1px 1px 4px #a29f90;
	box-shadow            : 1px 1px 4px #a29f90;
    position              : relative; /* IE8 対策(少し重くなる) */
	behavior              : url(/wp/wp-content/themes/comict_bcc/js/PIE.htc); /* IE8 対策(少し重くなる) */
	}

.radius5 {
	background            : #ffffff none;
	-moz-border-radius    : 5px;
	-webkit-border-radius : 5px;
	border-radius         : 5px;
    position              : relative; /* IE8 対策(少し重くなる) */
	behavior              : url(/wp/wp-content/themes/comict_bcc/js/PIE.htc); /* IE8 対策(少し重くなる) */
	}

/* ボックスバナー */
.box-banner { line-height : 0; }
	.box-banner p {
		margin-top : 5px;
		text-align : center;
		}
		.box-banner p.package-with-payment { line-height: 1.5em; }
		.box-banner p:first-child { margin-top : 0; }

/* マウスオーバー時に画像を半透明化 */
/* http://blog1.erp2py.com/2011/04/cssopacityie.html */
.box-banner p img:hover,
.translucent-link:hover {
	opacity    : 0.8;
	filter     : alpha(opacity=80); /* IE8 以下 */
	-ms-filter : alpha(opacity=80); /* IE8 */
	zoom       : 1;                 /* IE  */
	}


/* ============================================================================================== */
/* = [common] 装飾
/* ============================================================================================== */

/* フロート配置 */
.piece {
	margin-bottom : 15px;
	padding-top   : 15px;
	border-top    :  1px dotted #ccc9c2;
	}
	.piece:first-child {
		padding-top : 5px;
		border-top  : none;
	}
	/* アバター画像 */
	.piece .avatar { float : left; }
		.piece .avatar img {
			margin-bottom : 5px;
			padding       : 3px;
			border        : 1px solid #ccc9c2;
			-moz-border-radius    : 2px;
			-webkit-border-radius : 2px;
			border-radius         : 2px;
			/*behavior              : url(js/PIE.htc);*/ /* IE8 対策時に追加 */
			/*zoom                  : 1;*/               /* IE8 対策時に追加 */
			}
		.piece .avatar p {
			width          : 112px; /* IE8 対策時に追加 */
			letter-spacing : 0;
			text-align     : center;
			}
			.piece .avatar p.date { font-size : 77%; }
			.piece .avatar p.name { font-size : 93%; font-weight: bold; }
	
	/* テキスト */
	.piece .text {
		padding-left : 127px; /* 112 + 15 px (画像の下にテキストが回り込まないようにする)*/
		font-size    :  93%;
		}
		.piece .text p.text-meta { margin-bottom : 1em; }
		.piece .text span { margin-right : 15px; }
			.piece .text span.name { font-weight : bold; }

/* 更新履歴など */
ul.date-and-text {
	font-size : 93%;
	}
	ul.date-and-text li {
		padding    : 5px 0;
		border-top : 1px dotted #ccc9c2;
		}
		ul.date-and-text li:first-child {
			border-top : none;
			}
	ul.date-and-text span.date  { margin-right: 10px; }
/*	ul.date-and-text span.title {
		margin-left  : 20px;
		padding-left : 20px;
		background   : transparent url(images/icon_arrow3.png) no-repeat -5px -3px;
		}*/










/* ============================================================================================== */
/* = [base] レイアウト
/* ============================================================================================== */

a         { text-decoration : none; }
a:link    { color : #148ecc; }
a:visited { color : #148ecc; }
a:hover   { color : #e50f00; text-decoration : underline; }

body {
	text-align     : center;
	font-size      : 13px;
	line-height    : 1.7;
	/*letter-spacing : 0.1em;*/
	font-family    : 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'Meiryo', 'メイリオ', 'ＭＳ Ｐゴシック', Osaka, sans-serif;
	color          : #4d4645;
	/* 横幅 100% でヘッダー用背景画像を表示するために #header ではなく body クラスに background-image を指定 */
	background     : #f2eee6 url(images/header_bg.png) repeat-x;
	}

/* div#header, div#main, div#side を包含 */
#container {
	text-align : left;
	width      : 950px;
	margin     : 0 auto 15px;
	}
#header {
	width : 950px;
	}
#main {
	float : left;
	width : 630px;
	}
#side {
	float : right;
	width : 310px;
	}

/* 横幅 100% でフッター用背景画像を表示するために div#footer を独立 */
#footer {
	text-align : center;
	height     : 200px;
	background : transparent url(images/footer_bg.png) repeat-x;
	}


/* 各種コンテンツボックス用レイアウト (main) */
#main>div {
	width         : 620px; /* 620 + 10 = 630px */
	/*min-height    : 380px;*/
	padding       :   5px;
	margin-bottom :  10px;
	}
/* 各種コンテンツボックス用レイアウト (side) */
#side>div {
	width         : 300px; /* 300 + 10 = 310px */
	padding       :   5px;
	margin-bottom :  10px;
	}
/* h2 以降の共通余白 */
#main .contents,
#side .contents { padding : 10px; }

/* footer をページ下部に固定配置 (メインコンテンツが少ない場合) */
/* http://c-brains.jp/blog/wsg/11/07/05-214625.php */
html, body { height         : 100%; }
#container { margin-bottom  : 0;		/* 先に出てくる #container クラスで定義した margin を上書き */
			 min-height     : 100%; }
#main      { padding-bottom :  220px; } /* footer が重ならないよう footer + α 分の余白をとる */
#side      { padding-bottom :  220px; } /* footer が重ならないよう footer + α 分の余白をとる */
#footer    { margin-top     : -200px; } /* ブラウザ領域の下に配置されるため上に引っ張り出す */








/* ============================================================================================== */
/* = [header] サイト名，サイト説明
/* ============================================================================================== */

#header {
	position      : relative;
	height        : 151px;
	/*height        : 113px;*/
	margin-bottom :  10px;
	}
	/*h1#site-title, p#site-description { text-indent : -9999px; }*/
	h1#site-title { text-indent : -9999px; }
	h1#site-title a {
		position   : absolute;
		left       :   0px;
		top        :  31px;
		width      : 210px;
		/*height     :  60px;*/
		height     :  40px;
		display    : block;
		background : transparent url(images/sitelogo.png) no-repeat;
		}

	p#site-description {
		position   : absolute;
		left       :   0px;
		top        : 83px;
		text-indent : -0.5em;
	}


/* ============================================================================================== */
/* = [header] グローバルナビゲーション
/* ============================================================================================== */

ul#navi {
	position   : absolute;
	top        : 115px;
	left       :   0px;
	width      : 950px;
	height     :  38px; /* 36px + 2px(ドロップシャドウ分) */
	margin     : 0;
	padding    : 0;     /* ↓ボタンがない領域のための無地背景 */
	background : transparent url(images/navi_global_bg.png) no-repeat;
	}
	ul#navi li { float : left; }
	ul#navi li a {
		display     : block;
		height      : 38px;
		text-indent : -9999px;
		}
		
	li.navi01 a, li.navi02 a, li.navi03 a, li.navi04 a, li.navi05 a, li.navi06 a, li.navi07 a { width : 119px; }
	ul#navi li.navi01 a  { background : transparent url(images/navi_global_home.png)     no-repeat; }
	ul#navi li.navi02 a  { background : transparent url(images/navi_global_bcc.png)      no-repeat; }
	ul#navi li.navi03 a  { background : transparent url(images/navi_global_works.png)    no-repeat; }
	ul#navi li.navi04 a  { background : transparent url(images/navi_global_payment.png)  no-repeat; }
	ul#navi li.navi05 a  { background : transparent url(images/navi_global_order.png)    no-repeat; }
	ul#navi li.navi06 a  { background : transparent url(images/navi_global_download.png) no-repeat; }
	ul#navi li.navi07 a  { background : transparent url(images/navi_global_itaku.png)    no-repeat; }
	/*ul#navi li.navi05 a  { margin-right : 68px; }*/
	
	li.navi08 a { width : 117px; }
	ul#navi li.navi08 a  { background : transparent url(images/navi_global_blog.png)     no-repeat; }
	
	/* マウスオーバー，項目選択時の画像変化は，画像の縦位置だけを変更 */
	ul#navi li a:hover   { background-position:  0px -40px; }
	ul#navi li.current a { background-position:  0px -80px; }


/* ============================================================================================== */
/* = [header] 検索ボックス
/* ============================================================================================== */

/* 検索ボックス(本体) */
#search {
	position    : absolute;
	left        : 645px;
	top         :  79px;
	width       : 300px;
	height      :  26px;
	overflow    : hidden;
	background  : transparent url(images/common_units.png) no-repeat -5px -10px;
	}
	/* 検索ボックス(入力エリア) */
	#search input.search-input {
		position    : absolute;
		left        :  25px;
		top         :   2px;
		width       : 245px;
		height      :  20px;
		font-size   :  85%;
		line-height : 2;          /* ブラウザ毎に表示位置がずれる… */
		color       : #665e5c;
		border      : none;
		outline     : none;
		background  : none;
		}
	/* 検索ボックス(送信ボタン) */
	#search input.search-submit {
		position    : absolute;
		left        : 275px;
		top         :   2px;
		width       :  24px;
		height      :  24px;
		margin      :   0;
		padding     :   0;
		display     : block;
		overflow    : hidden;
		font-size   :   0;
		line-height :   0;
		text-indent : -9999px;
		border      : none;
		background  : none;
		}

/* ============================================================================================== */
/* = [header] SSL シール
/* ============================================================================================== */

/* デフォルト表示位置 */
body div.ssl-seal {
	position	: absolute;
	/*left		: 525px;*/
	left		: 860px;
	/*top			: 210px;*/
	top			: 50px;
    z-index     : 1;
}

/* ご注文 (注文ページ) */
/*body.page-order div.ssl-seal {
	position	: absolute;
	left		: 827px;
	top			: 176px;
    z-index     : 1;
}*/










/* ============================================================================================== */
/* = [main] 共通
/* ============================================================================================== */

#main { text-align : justify; }


/* ============================================================================================== */
/* = [main] 大見出し，中見出し
/* ============================================================================================== */

/* メインヘッダー(共通) */
#main h2 {
	width         : 620px;
	height        :  32px;
	text-indent   : -9999px;
	}
	#main h2 a {
		display : block;
		width   : 620px;
		height  :  32px;
		}
#side h2 {
	width         : 300px;
	height        :  32px;
	text-indent   : -9999px;
	}

/* メインヘッダー(個別) */
/* main */
#box-home-news      h2 { background : transparent url(images/h2_home_news.png)           no-repeat; }
#box-home-twitter   h2 { }
#box-home-menu      h2 { }

/* #box-bcc            h2 { background : transparent url(images/h2_main_bcc.png)            no-repeat; height : 320px; } */
#box-bcc            h2 { background : transparent url(images/h2_main_bcc4.png)            no-repeat; height : 270px; }
#box-works          h2 { background : transparent url(images/h2_main_works.png)          no-repeat; }
#box-howto          h2 { background : transparent url(images/h2_main_howto.png)          no-repeat; } 
#box-howto-recent   h2 { background : transparent url(images/h2_main_backnumber.png)     no-repeat; }

#box-payment        h2 { background : transparent url(images/h2_main_payment.png)        no-repeat; }
#box-thanks         h2 { background : transparent url(images/h2_main_thanks.png)         no-repeat; }
#box-itaku          h2 { background : transparent url(images/h2_main_itaku.png)          no-repeat; }
#box-agreement      h2,
#box-agreement-lp	h2 { background : transparent url(images/h2_main_agreement.png)      no-repeat; }
#box-events         h2 { background : transparent url(images/h2_main_events.png)         no-repeat; }

#box-blog           h2 { background : transparent url(images/h2_main_blog.png)           no-repeat; }
#box-blog-recent    h2 { background : transparent url(images/h2_main_blog_recent.png)    no-repeat; }
#box-blog-comments  h2 { background : transparent url(images/h2_main_blog_comments.png)  no-repeat; }

#box-news           h2 { background : transparent url(images/h2_main_news.png)           no-repeat; }
#box-link           h2 { background : transparent url(images/h2_main_link.png)           no-repeat; }
#box-about          h2 { background : transparent url(images/h2_main_about.png)          no-repeat; }

#box-contact        h2 { background : transparent url(images/h2_main_contact.png)        no-repeat; }
#box-statement      h2 { background : transparent url(images/h2_main_statement.png)      no-repeat; }
#box-privacy-policy h2 { background : transparent url(images/h2_main_privacy_policy.png) no-repeat; }

#box-index          h2 { background : transparent url(images/h2_main_index.png)          no-repeat; }
#box-404            h2 { background : transparent url(images/h2_main_404.png)            no-repeat; }

/* side */
#side-howto         h2 { background : transparent url(images/h2_side_backnumber.png)     no-repeat; }
#side-bcc           h2 { background : transparent url(images/h2_side_bcc.png)            no-repeat; }
#box-side-works     h2 { background : transparent url(images/h2_side_works.png)          no-repeat; }
#side-order         h2 { background : transparent url(images/h2_side_order.png)          no-repeat; }
#side-news          h2 { background : transparent url(images/h2_side_news.png)           no-repeat; }
#side-recent        h2 { background : transparent url(images/h2_side_recent.png)         no-repeat; }
#side-categories    h2 { background : transparent url(images/h2_side_categories.png)     no-repeat; }
#side-archives      h2 { background : transparent url(images/h2_side_archives.png)       no-repeat; }

#box-side-order     h2 { background : transparent url(images/h2_side_order.png)          no-repeat; }
#box-side-events	h2 { background : transparent url(images/h2_side_events.png)         no-repeat; }
#box-side-itaku		h2 { background : transparent url(images/h2_side_itaku.png)          no-repeat; }







/* ============================================================================================== */
/* = [main] ご注文
/* ============================================================================================== */

/* #main>div を上書き */
div#box-order {
	width         : 950px !important;
	padding       : 0;
	}


/* ============================================================================================== */
/* = [main] ホーム
/* ============================================================================================== */

/* #main>div を上書き */
div#container-home {
	width         : 960px; /* margin-right : 10px の突き出し部分を含む */
	padding       : 0;
	margin-bottom : 0;
	}
	div#box-home-promotion {
		width         : 940px; /* 940 + 10 = 950px */
		height        : 410px;
		padding       :   5px;
		margin-bottom :  10px;
		}
	ul#box-home-banner {}
		ul#box-home-banner li {
            width   : 470px;
			height	:  90px;
			margin	: 0 10px 10px 0;
			float	: left;
			}
			ul#box-home-banner li a {
				display     : block;
				height      :  90px;
				text-indent : -9999px;
				}
			ul#box-home-banner li.banner01 a { background : transparent url(../../uploads/2013/10/home_banner_1311.png) no-repeat; }
			ul#box-home-banner li.banner02 a { background : transparent url(../../uploads/2013/10/home_banner_bcc.png)  no-repeat; }
	div#box-home-news {
		width			: 620px;
		height			: 200px;
		padding			:   5px;
		margin	: 0 10px 10px 0;
		/*float	: left;*/
		}
	div#box-home-twitter {
		width			: 300px;
		height			: 200px;
		max-height		: 200px;
		padding			:   5px;
		margin	: 0 10px 10px 0;
		/*float	: left;*/
		}
	ul#box-home-menu {}
		ul#box-home-menu li {
			height	: 135px;
			margin	: 0 10px 10px 0;
			float	: left;
			}
			ul#box-home-menu div.main li { width : 310px; }
			ul#box-home-menu div.sub  li { width : 470px; height : 90px; }
			ul#box-home-menu li a {
				display     : block;
				height      : 135px;
				text-indent : -9999px;
				}
			ul#box-home-menu li.menu01 a { background : transparent url(images/home_menu_bcc.png)       no-repeat; }
			ul#box-home-menu li.menu02 a { background : transparent url(images/home_menu_works.png)     no-repeat; }
			ul#box-home-menu li.menu03 a { background : transparent url(images/home_menu_howto.png)     no-repeat; }
			ul#box-home-menu li.menu04 a { background : transparent url(images/home_menu_payment.png)   no-repeat; }
			ul#box-home-menu li.menu05 a { background : transparent url(images/home_menu_order.png)     no-repeat; }
			ul#box-home-menu li.menu06 a { background : transparent url(images/home_menu_itaku.png)     no-repeat; }
			ul#box-home-menu li.menu07 a { background : transparent url(images/home_menu_agreement.png) no-repeat; }
			ul#box-home-menu li.menu08 a { background : transparent url(images/home_menu_events.png)    no-repeat; }
			ul#box-home-menu li.menu09 a { background : transparent url(images/home_menu_blog.png)      no-repeat; }
			ul#box-home-menu li.menu11 a { background : transparent url(images/home_sub_photos.png)     no-repeat; }
			ul#box-home-menu li.menu12 a { background : transparent url(images/home_menu.png)    		no-repeat; }
			


/* ============================================================================================== */
/* = [main] 15/09/14
/* ============================================================================================== */			

#home-main {
	float : left;
	width : 630px;
	}
#home-side {
	float : left;
	width : 310px;
	margin-left: 10px;
	}
#main #box-works {			
	padding	: 5px;
	/*margin	: 	0 10px 10px 0;		*/
}		

.box-banner {
	padding	: 5px;
	margin-bottom: 10px;
}

#box-side-order {
	padding	: 5px;
	margin-bottom: 10px;
}
#box-side-order .order-unit:first-child {
	margin-top: 10px;
}

#box-side-events h2 {
	margin-bottom: 10px;
}
#box-side-works h2 {
	margin-bottom: 10px;
}

#box-side-itaku p {
	margin: 20px 0;
}

			
			
/* ============================================================================================== */
/* = [main] [記事] 一覧ページ
/* ============================================================================================== */

/* １つ１つの記事 */
.unit { margin-top : 20px; }
	.unit:first-child { margin-top : 0; }

/* WP-PageNavi */
.wp-pagenavi {
	margin     : 10px 0 15px;
	text-align : center;
	}
	.wp-pagenavi a, .wp-pagenavi span {
		padding          : 10px 16px;
		margin           : 0 2px;
		font-size        : 85%;
		text-decoration  : none;
		color            : #403a39;
		background-color : #e5e2da;
		-moz-border-radius    : 2px;
		-webkit-border-radius : 2px;
		border-radius         : 2px;
        /*position : relative;*/ /* IE8 対策(少し重くなる) */
        /*behavior : url(/wp/wp-content/themes/comict_bcc/js/PIE.htc);*/ /* IE8 対策(少し重くなる) */
		}
		.wp-pagenavi a.first, .wp-pagenavi a.last {
			/*font-size : 10%;*/
			}
		.wp-pagenavi a:hover {
			background-color : #b3b0aa;
			}
		.wp-pagenavi span.current {
			font-weight      : bold;
			background-color : #b3b0aa;
			}


/* ============================================================================================== */
/* = [main] [記事] 一覧ページ・個別ページ共通
/* ============================================================================================== */

/* 記事タイトル */
#main h3 {
	margin-bottom :  10px;
	font-size     : 162%;
	line-height   : 1.5;
	}
	#main h3 a:link,
	#main h3 a:visited { color : #403a39; }
	#main h3 a:hover   { color : #665e5c; }
#box-works-single h3 {
    margin: 10px 0 20px;
    }

/* 記事メタ情報 */
#main .post-meta {
	height           : 22px;
	padding          :  5px 10px;
	margin-bottom    : 15px;
	font-size        : 85%;
	line-height      : 1;
	color            : #665e5c;
	background-color : #e5e2da;
	-moz-border-radius    : 2px;
	-webkit-border-radius : 2px;
	border-radius         : 2px;
    /*position : relative;*/ /* IE8 対策(少し重くなる) */
    /*behavior : url(/wp/wp-content/themes/comict_bcc/js/PIE.htc);*/ /* IE8 対策(少し重くなる) */
	}
	#main .post-meta li { float : left; }
		#main .post-meta li dt {
			float      : left;
			width      : 20px;
			height     : 20px;
			background : transparent url(images/common_units.png) no-repeat;
			text-indent : -9999px;
			}
			#main .post-meta li.meta-cal dt { background-position :  -3px -38px; }
			#main .post-meta li.meta-aut dt { background-position : -23px -38px; }
			#main .post-meta li.meta-com dt { background-position : -43px -38px; }
			#main .post-meta li.meta-tag dt { background-position : -63px -38px; }
			#main .post-meta li.meta-cat dt { background-position : -83px -38px; }
		#main .post-meta li dd {
			margin-left   :  25px;
			margin-right  :   5px;
			line-height   : 2.2;
			}

/* 記事導入 */
#main .post-intro { margin-bottom : 15px; }
	/* 画像サイズは 182 x 182 px */
	/* 外枠サイズは 190 x 190 px */
	#main .post-intro p.eyecatch {
		float : left;
		width : 182px;
		}
		#main .post-intro p.eyecatch img {
			padding :   3px;
			border  :   1px solid #ccc9c2;
			-moz-border-radius    : 2px;
			-webkit-border-radius : 2px;
			border-radius         : 2px;
            /*position : relative;*/ /* IE8 対策(少し重くなる) */
            /*behavior : url(/wp/wp-content/themes/comict_bcc/js/PIE.htc);*/ /* IE8 対策(少し重くなる) */
		}
	#main .post-intro p.excerpt {
		padding-left : 205px; /* 190 + 15 px (画像の下にテキストが回り込まないようにする)*/
		}
		a.more-link, a.post-edit-link { white-space : nowrap; }

/* ナビゲーション */
#nav-below   { margin-top : 30px; }
#nav-below p { font-size  : 85%; line-height : 1; }
#nav-below p.nav-previous { float : left;  }
#nav-below p.nav-next     { float : right; }










/* ============================================================================================== */
/* = [main] [共通] 共通スタイル
/* ============================================================================================== */

/* 段落 */
/* 関係のない p 要素が影響受けないように > 指定 */
#main .common-style>p {
	width         : 478px; /* 600 - (112 + 10) */
	margin-bottom : 1.5em;
	}

/* 横幅指定を無効化 */
#main .common-style .no-wrap { width : 100%; }

/* 注意 */
#main .common-style .attention {
	width     : 458px; /* 478 - (10 * 2) */
	padding   :  10px;
	margin    :  15px 0;
	background-color : #f2f2f2;
	-moz-border-radius    : 2px;
	-webkit-border-radius : 2px;
	border-radius         : 2px;
    /*position : relative;*/ /* IE8 対策(少し重くなる) */
    /*behavior : url(/wp/wp-content/themes/comict_bcc/js/PIE.htc);*/ /* IE8 対策(少し重くなる) */
	}

/* 引用 */
#main .common-style blockquote p {
	width     : 458px; /* 478 - (10 * 2) */
	padding   :  10px;
	margin    :  15px 0;
	border    : 2px dotted #ccc9c2;
	-moz-border-radius    : 2px;
	-webkit-border-radius : 2px;
	border-radius         : 2px;
    /*position : relative;*/ /* IE8 対策(少し重くなる) */
    /*behavior : url(/wp/wp-content/themes/comict_bcc/js/PIE.htc);*/ /* IE8 対策(少し重くなる) */
	}

/* リード文 */
#main .common-style p.lead-sentence {
	font-size   : 116%;
	font-weight : bold;
	}

/* 備考 */
#main .common-style div.note {
	margin    : 15px 0;
	font-size : 77%;
	}
	#main .common-style div.note ul {
		margin     : 0;
		padding    : 0;
		list-style : none;
		}
		#main .common-style div.note ul li {
			padding-left: 0;
			background  : none;
			text-indent : -1.3em;
			margin-left :  1.3em;
			}

/* 見出し(共通) */
#main .common-style h4,
#main .common-style h5,
#main .common-style h6 {
	margin      : 30px 0 15px;
	line-height : 1.5;
	color       : #403a39;
	}
#main .common-style h4 {
	width       : 580px; /* 580 + 10 + 10 = 600 px */
	height      : 100%;
	padding     :  10px 10px 6px;
	background  : #e5e2da none;
	font-size   : 124%;
	-moz-border-radius    : 2px;
	-webkit-border-radius : 2px;
	border-radius         : 2px;
    /*position : relative;*/ /* IE8 対策(少し重くなる) */
    /*behavior : url(/wp/wp-content/themes/comict_bcc/js/PIE.htc);*/ /* IE8 対策(少し重くなる) */
	}
#main .common-style h5 {
	padding-bottom :  10px; 
	font-size      : 108%;
	border-bottom  : 1px dotted #999691;
	}

/* リスト */
#main .common-style ul,
#main .common-style ol {
	margin : 15px 0 15px 15px;
	}
	/* 入れ子したリストに margin 設定が及ばないようにする */
	#main .common-style li>ul,
	#main .common-style li>ol {
		margin : 0;
		}
#main .common-style ul li {
	padding-left : 20px;
	background   : transparent url(images/icon_arrow1.png) no-repeat -5px 0;
	}
#main .common-style ol li {
	margin-left  : 20px;
	list-style   : decimal;
	}

/* テーブル */
#main .common-style table {
	width           : 478px;
	margin          : 15px 0;
	border-collapse : collapse;
	}
	#main .common-style table caption {
		caption-side  : bottom;
		padding-top   : 5px;
		text-align    : left;
		font-weight   : bold;
		font-size     : 77%;
		color         : #403a39;
		}
	#main .common-style table tbody {
		font-size     :  85%;
		}
	#main .common-style table th {
		padding          : 5px 10px;
		/*text-align       : left;*/
		/*font-weight      : normal;*/
		color            : #403a39;
		border-right     : 1px solid #ffffff;
		border-bottom    : 1px solid #ffffff;
		background-color : #ccc9c2;
		}
		#main .common-style table th {
			width : 112px;
			}
			#main .common-style table.th-long th {
				width : 190px;
				}
				#main .common-style table th span.mimic {
					color : #ccc9c2;
					}
	#main .common-style table td {
		padding          : 5px 10px;
		/*color            : #8c8577;*/
		border-right     : 1px solid #ffffff;
		border-bottom    : 1px solid #ffffff;
		background-color : #e5e2da;
		}


/* 画像 (デフォルトで装飾用の枠線を付加) */
#main .common-style img {
	padding : 3px;
	border  : 1px solid #ccc9c2;
	-moz-border-radius    : 2px;
	-webkit-border-radius : 2px;
	border-radius         : 2px;
    /*position : relative;*/ /* IE8 対策(少し重くなる) */
    /*behavior : url(/wp/wp-content/themes/comict_bcc/js/PIE.htc);*/ /* IE8 対策(少し重くなる) */
	}
	/* 枠線を除去 */
	#main .common-style img.no-border,
	#main .common-style img.wp-smiley {
		padding : 0;
		border  : 0;
		}

/* 横並び画像 (黄金比) (画像の間に矢印付き) */
#main .common-style div.bef-aft {
    background   : transparent url(images/icon_arrow1.png) no-repeat 228px 55px;
	}
#main .common-style div.bef-aft div {
	float : left;
	width : 216px;
	margin : 0 36px 0 0;
	text-align : center;
	font-size : 93%;
	}

/* 横並び画像 (A4比) */
#main .common-style div.twin-img div {
	float : left;
	width : 226px;
	margin : 0 16px 0 0;
	text-align : center;
	font-size : 93%;
	}

#main .common-style div.twin-img div.works {
	margin: 0 0 0 18px;
	width: 287px;
	}
	#main .common-style div.twin-img div.works:first-child {
		margin: 0;
	}








/* ============================================================================================== */
/* = [main] AmazonJS
/* ============================================================================================== */
.amazonjs_item {
    margin                : 0 !important;
	-moz-border-radius    : 4px;
	-webkit-border-radius : 4px;
	border-radius         : 4px;
    background-color      : #F7F7F9 !important;
    }
    .amazonjs_item .amazonjs_image {
        -moz-box-shadow       : 0 1px 4px rgba(0, 0, 0, 0.2);
        -webkit-box-shadow    : 0 1px 4px rgba(0, 0, 0, 0.2);
        box-shadow            : 0 1px 4px rgba(0, 0, 0, 0.2);
        }
        .amazonjs_item .amazonjs_image img {
            border            : none !important;
            }
.amazonjs_item .amazonjs_info h4 {
    width       : auto !important;
    margin      : 0 !important;
    padding     : 0 !important;
    background  : none !important;
    font-size   : 108% !important;
    }
.amazonjs_item .amazonjs_info ul {
    margin      : 0 !important;
    }
    .amazonjs_item .amazonjs_info ul li {
        padding     : 0 !important;
        background  : none !important;
        }

/* ============================================================================================== */
/* = [main] コメントフォーム，お問い合わせフォーム
/* ============================================================================================== */

/* 画像版 h3 */
#respond h3 {
	width       : 600px;
	height      :  26px;
	margin      :  30px 0 15px;
	text-indent : -9999px;
	background  : transparent url(images/h3_leave_a_reply.png) no-repeat;
	}

/* コメントフォーム，お問い合わせフォーム (共通レイアウト) */
#respond,
.wpcf7 {
	/*margin : 0 10px 10px;*/
	}
	/* ラベル，入力ボックス，テキストエリア，送信ボタン */
	#respond label, #respond input[type=text], #respond textarea, #respond input[type=submit],
	.wpcf7   label, .wpcf7   input[type=text], .wpcf7   textarea, .wpcf7   input[type=submit] {
		color : #665e5c;
		}
	
	/* ラベル，送信ボタン */
	#respond label, #respond input[type=submit],
	.wpcf7   label, .wpcf7   input[type=submit] { font-size : 77%; }

	/* 入力ボックス，テキストエリア */
	#respond input[type=text], #respond textarea,
	.wpcf7   input[type=text], .wpcf7   textarea {
		outline     : none;
		font-size   : 93%;
		background-color : #f7f7f7;
		border : 1px solid #d9d9d9;
		-moz-border-radius    : 2px;
		-webkit-border-radius : 2px;
		border-radius         : 2px;
        /*position : relative;*/ /* IE8 対策(少し重くなる) */
        /*behavior : url(/wp/wp-content/themes/comict_bcc/js/PIE.htc);*/ /* IE8 対策(少し重くなる) */
		}
		#respond input[type=text]:focus, #respond textarea:focus, 
		.wpcf7   input[type=text]:focus, .wpcf7   textarea:focus {
			background-color : #e5e5e5;
			}
	
	/* 入力ボックス */
	#respond input[type=text],
	.wpcf7   input[type=text] {
		width       : 224px; /* 224 + (5 * 2) = 234 */
		height      :  22px;
		padding     : 0 5px;
		margin      : 5px 0px 6px;
		line-height : 1;
		}
			
	/* テキストエリア */
	#respond textarea,
	.wpcf7   textarea {
		width       : 590px; /* 590 + (5 * 2) = 600 */
		height      : 140px;
		padding     : 2px 5px;
		margin      : 5px 0px 6px;
		line-height : 1.8;
		}
	
	/* 送信ボタン */
	#respond p.form-submit,
	.wpcf7   p.form-submit {
		text-align : right;
		}
		#respond p.form-submit img,
		.wpcf7   p.form-submit img { display : none; }
	
	#respond input[type=submit],
	.wpcf7   input[type=submit] {
		width  : 112px;
		height :  32px;
		background-color: transparent;
		border : 1px solid #d9d9d9;
		-moz-border-radius    : 2px;
		-webkit-border-radius : 2px;
		border-radius         : 2px;
        /*position : relative;*/ /* IE8 対策(少し重くなる) */
        /*behavior : url(/wp/wp-content/themes/comict_bcc/js/PIE.htc);*/ /* IE8 対策(少し重くなる) */
		}
		#respond input[type=submit]:hover,
		.wpcf7   input[type=submit]:hover {
			background-color : #e5e5e5;
			}



/* ============================================================================================== */
/* = [main] [特定商取引法に基づく表記]
/* ============================================================================================== */

/* テーブル */
#box-statement .common-style table {
    margin : 0;
    }
    #box-statement .common-style table th {
    	width            : 125px;
        padding          : 10px;
        border-right     : none;
        border-bottom    : 1px solid #dddddd;
        background-color : #ffffff;
    	text-align       : right;
        }
    #box-statement .common-style table td {
        padding          : 10px;
        border-right     : none;
        border-bottom    : 1px solid #dddddd;
        background-color : #ffffff;
        }
        #box-statement .common-style table td p {
            margin-bottom : 10px;
            }

/* リスト */
#box-statement .common-style ul,
#box-statement .common-style ol {
    margin : 0 0 10px 0;
    }
    /* 入れ子したリストに margin 設定が及ばないようにする */
    #box-statement .common-style li>ul,
    #box-statement .common-style li>ol {
        margin : 0;
        }
#box-statement .common-style ul li {
    padding-left : 20px;
    background   : transparent url(images/icon_arrow1.png) no-repeat -5px -2px;
    }
#box-statement .common-style ol li {
    margin-left  : 20px;
    list-style   : decimal;
    }

/* ============================================================================================== */
/* = [main] [リンク]
/* ============================================================================================== */

#box-link .common-style img {
    border  : none;
    padding : 0;
    -moz-border-radius    : 0;
    -webkit-border-radius : 0;
    border-radius         : 0;
    /*position : relative;*/ /* IE8 対策(少し重くなる) */
    /*behavior : url(/wp/wp-content/themes/comict_bcc/js/PIE.htc);*/ /* IE8 対策(少し重くなる) */
    }
#box-link .common-style ul.link-list { margin : 0; }
    #box-link .common-style ul.link-list li {
        float       : left;
        width       : 200px;
        margin      : 0 10px 10px 0;
        padding     : 0;
        line-height : 0;
        background  : none;
        }
        #box-link .common-style ul.link-list a:hover {
            text-decoration : none;
            opacity : 0.7;
            }
        #box-link .common-style ul.link-list a span {
            display          : inline-block;
            width            : 200px;
            height           :  40px;
            font-size        :  93%;
            text-align       : center;
            line-height      : 1.7;
            color            : #fff;
            background-color : #4d4645;
            -moz-border-radius    : 2px;
            -webkit-border-radius : 2px;
            border-radius         : 2px;
            /*position : relative;*/ /* IE8 対策(少し重くなる) */
            /*behavior : url(/wp/wp-content/themes/comict_bcc/js/PIE.htc);*/ /* IE8 対策(少し重くなる) */
            }
            #box-link .common-style ul.link-list a span.oneline {
                line-height : 40px; /* 文字列が 1 行の場合に限り，縦にセンタリング */
                }


/* ============================================================================================== */
/* = [main] NextGEN Gallery
/* ============================================================================================== */
/* 画像の繰り返し表示は WP プラグイン ｢NextGEN Gallery｣ の仕組みを流用 (nggallery.css の一部を下記に転用) */


/* 以下，変更禁止 !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */
/* 一番外側の div */
.ngg-galleryoverview {
	overflow: hidden;
	margin-top: 10px;
	width: 100%;
	clear:both; 
	display:block !important;
}
/* 画像１つ１つの div */
.ngg-gallery-thumbnail {
	float: left;
	margin-right: 5px;
	text-align: center;
}
.ngg-gallery-thumbnail img {
	background-color:#FFFFFF;
	border:1px solid #A9A9A9;
	display:block;  
	margin:4px 0px 4px 5px;
	padding:4px;
	position:relative;
}
.ngg-gallery-thumbnail img:hover {
	background-color: #A9A9A9;
}
.ngg-gallery-thumbnail span {
	/* Images description */
	font-size:90%;
	padding-left:5px;
	display:block;
}
/* 以上，変更禁止 !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */


/* 以下，標準設定を上書き !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */

/* 共通設定 */
.ngg-galleryoverview {
	width      : 615px !important; /* カラム落ち防ぐために故意に横幅を広く指定 */
	margin-top :   0px !important;
	}
.ngg-gallery-thumbnail {
	}
	.ngg-gallery-thumbnail img {
		padding : 3px !important;
		margin  : 0 0 5px 0 !important;
		border  : 1px solid #ccc9c2 !important;
		}
		.ngg-gallery-thumbnail img:hover {
			background-color: #cccccc !important;
			}
	.ngg-gallery-thumbnail span {
		padding-left : 0px !important;
		text-align   : justify !important;
		line-height  : 1.5 !important;
		}

/* ｢作品一覧｣ */
#box-works-single .ngg-gallery-thumbnail,
#box-news-single .ngg-gallery-thumbnail,
#box-works .ngg-gallery-thumbnail,
#box-order .ngg-gallery-thumbnail {
    position      : relative !important;
	width         : 190px !important;
	margin-right  :  15px !important;
	margin-bottom :  15px !important;
	}
#box-side-works .ngg-gallery-thumbnail {
	position      : relative !important;
	}
	#box-order .ngg-gallery-thumbnail img:hover {
		background : #ffffff !important;
		}
    #box-side-works .ngg-gallery-thumbnail div.new,
    #box-side-works .ngg-gallery-thumbnail div.new-hover,
    #box-order .ngg-gallery-thumbnail div.new,
    #box-works-single .ngg-gallery-thumbnail div.new,
    #box-works-single .ngg-gallery-thumbnail div.new-hover,
    #box-news-single .ngg-gallery-thumbnail div.new,
    #box-news-single .ngg-gallery-thumbnail div.new-hover,
    #box-works .ngg-gallery-thumbnail div.new,
    #box-works .ngg-gallery-thumbnail div.new-hover {
        position    : absolute;
        top         :   1px;
        left        :   1px;
        width       : 182px;
        height      : 182px;
        background  : transparent url(images/works_new.png) no-repeat;
        }
        #box-works-single .ngg-gallery-thumbnail div.new-hover:hover,
        #box-news-single .ngg-gallery-thumbnail div.new-hover:hover,
        #box-works .ngg-gallery-thumbnail div.new-hover:hover {
            top        : 0px;
            left       : 0px;
            background : none;
            border     : 4px solid #cccccc !important;
            }
    #box-order .ngg-gallery-thumbnail div.limited,
    #box-works-single .ngg-gallery-thumbnail div.limited,
    #box-works-single .ngg-gallery-thumbnail div.limited-hover,
    #box-news-single .ngg-gallery-thumbnail div.limited,
    #box-news-single .ngg-gallery-thumbnail div.limited-hover,
    #box-works .ngg-gallery-thumbnail div.limited,
    #box-works .ngg-gallery-thumbnail div.limited-hover {
        position    : absolute;
        top         :   1px;
        left        :   1px;
        width       : 182px;
        height      : 182px;
        background  : transparent url(images/works_limited.png) no-repeat;
        }
        #box-works-single .ngg-gallery-thumbnail div.limited-hover:hover,
        #box-news-single .ngg-gallery-thumbnail div.limited-hover:hover,
        #box-works .ngg-gallery-thumbnail div.limited-hover:hover {
            top        : 0px;
            left       : 0px;
            background : none;
            border     : 4px solid #cccccc !important;
            }
	#box-works-single .ngg-gallery-thumbnail span,
	#box-news-single .ngg-gallery-thumbnail span,
	#box-works .ngg-gallery-thumbnail span,
	#box-order .ngg-gallery-thumbnail span {
		font-size    : 90% !important;
        letter-spacing: -0.1pt; /* 14/12/26 */
        height: 35px;
		}
		#box-works-single .ngg-gallery-thumbnail span.price,
		#box-news-single .ngg-gallery-thumbnail span.price,
		#box-works .ngg-gallery-thumbnail span.price,
		#box-order .ngg-gallery-thumbnail span.price {
            height      : 25px;
			margin-top  : 3px !important;
			text-align  : center !important;
		}
		#box-order .ngg-gallery-thumbnail span.price {
			font-weight : bold !important;
			}

/* ｢記事｣ */
#box-works-single .sample-images .ngg-gallery-thumbnail,
#box-blog-single  .ngg-gallery-thumbnail {
	width  : 112px !important;
	margin : 0 10px 6px 0 !important;
	}
	#box-works-single .sample-images .ngg-gallery-thumbnail span,
	#box-blog-single  .ngg-gallery-thumbnail span {
		text-align : center !important;
		font-size  : 77% !important;
		}

/* 以上，標準設定を上書き !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */










/* ============================================================================================== */
/* = [side] 
/* ============================================================================================== */

/* サイドメニュー */
#side .widget  { font-size : 93%; }
	/* デフォルトのリスト表示 */
	#side .widget ul li {
		margin        : 3px 0;
		padding-left  : 15px;
		background    : transparent url(images/icon_arrow1.png) no-repeat -5px 0;
		}
	/* 記事一覧表示用のリスト表示 */
	#side .recent ul li {
		margin-bottom       :  5px;
		padding-top         :  6px;
		border-top          :  1px dotted #ccc9c2;
		background-position : -5px 5px;
		}
		#side .recent ul li:first-child {
			margin-bottom : 0;
			padding-top   : 0;
			border-top    : none;
			background-position : -5px -1px;
		}

/* ダイナミックサイドバー */
#side #dynamic-sidebar>ul>li { margin-bottom : 15px; }
#side #dynamic-sidebar h2 {
	text-indent   : 0;
	width         : 280px;
	height        : 100%;
	margin-bottom : 15px;
	padding       :  6px 10px 6px;
	background    : #e5e2da none;
	/*font-size     : 124%;*/
	-moz-border-radius    : 2px;
	-webkit-border-radius : 2px;
	border-radius         : 2px;
    /*position : relative;*/ /* IE8 対策(少し重くなる) */
    /*behavior : url(/wp/wp-content/themes/comict_bcc/js/PIE.htc);*/ /* IE8 対策(少し重くなる) */
	}
	#side #dynamic-sidebar h2+ul { margin : 15px 10px 10px; }
	#side #dynamic-sidebar div.textwidget {
		padding : 0 10px;
		text-align : justify;
		}
	

/* ============================================================================================== */
/* = [footer] footer-body
/* ============================================================================================== */

#footer-body {
	position   : relative;
	width      : 950px;
	height     : 200px;
	margin     : 0 auto;
	text-align : left;
	font-size  : 93%;
	color      : #ffffff;
	}
	#footer-body li a,
	#footer-body li a:link,
	#footer-body li a:visited,
	#footer-body li a:hover {
		color           : #ffffff;
		text-decoration : none;
		}
	#footer-body li a:hover {
		border-bottom : 1px dotted #ffffff;
		}

/* フッターナビ */
#footer-navi {
	position : absolute;
	padding-top : 30px;
	}
	#footer-navi ul {
		float	     : left;
		/*width        : 174px; *//* (950 - 20 * 4) / 5 */
		width        : 200px;
		margin-right :  20px;
		height : 150px;
		}
		#footer-navi ul li {
			height        : 22px;
			padding-left  : 15px;
			margin-bottom :  5px;
			background    : transparent url(images/icon_arrow1.png) no-repeat -5px 0;
			}

/* フッターリンク */
ul#footer-links {
	position    : absolute;
	left        :  0px;
	bottom      : 10px;
	line-height : 0.8; /* 高さ調整 */
	}
	ul#footer-links li {
		display       : inline;
		padding-right : 10px;
		}

/* コピーライト */
p#site-copyright {
	position    : absolute;
	right       :  0px;
	bottom      : 10px;
	line-height : 0.8; /* 高さ調整 */
	}