/*
Theme Name: original
Theme URI: http://www.jcp-fujiidera.net/
Description: オリジナルテーマ
Author: iCreart
*/

@charset "UTF-8";
/* CSS Document */

body {
	font: 100%/1.4 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
	background: #fff;
	margin: 0;
	padding: 0;
	color: #000;
}

ul, ol, dl { 
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;
	padding-right: 15px;
	padding-left: 15px; 
}

a:link {
	color:#414958;
	text-decoration: none; 
}
a:visited {
	color: #4E5869;
	text-decoration: none;
}
a:hover, a:active, a:focus { /* このセレクターグループは、キーボードを使用するユーザーに対し、マウスを使用するユーザーと同じホバー効果を提供します。 */
	text-decoration: none;
}

.container {
	width: 900px;
	max-width: 1260px;/* レイアウトが大型モニターで広がりすぎないように、最大幅を指定することをお勧めします。これにより、読みやすい行の長さを保つことができます。IE6 ではこの宣言は無視されます。 */
	min-width: 780px;/* レイアウトが狭くなりすぎないように、最小幅を指定することをお勧めします。これにより、サイドカラムで読みやすい行の長さを保つことができます。IE6 ではこの宣言は無視されます。 */
	background: #FFF;
	margin: 0 auto; /* 幅に加え、両側を自動値とすることで、レイアウトが中央に揃います。.container の幅を 100% に設定した場合、これは必要ありません。 */
}

.header {
	width: 900px;
	height: 410px;
	padding-bottom: 10px;
	background: #fff;
}

.sidebar1 {
	float: left;
	width: 180px;
	background: #fff;
	padding-bottom: 10px;
}
.content {
	padding: 10px;
	width: 700px;
        float: left;
}
/*.sidebar2 {
	float: left;
	width: 180px;
	background: #fff;
	padding: 10px 0;
} */
.search {
	width: 180px;
	height: 40px;
}
input.searchin {
	margin-right: 5px;
	font-size: 1.0em;
	*font-size: 10px;
}

.content ul, .content ol { 
	padding: 0 15px 15px 40px; /* この余白は、上述の見出しと段落ルールの右の余白を表します。下の余白はリスト内の他のエレメントとの間隔用に配置され、左の余白はインデント作成用に配置されています。これは必要に応じて調整できます。 */
}

/* ~~ ナビゲーションリストのスタイル付け (Spry などの事前作成済みのフライアウトメニューを使用する場合は削除できます) ~~ */
ul.nav {
	list-style: none; /* リストのマーカーを削除します。 */
	border-top: 1px solid #666; /* リンク用の上部のボーダーを作成します。他のすべてのものは LI 上で下部のボーダーを使用して配置されます。 */
	margin-bottom: 15px; /* 下のコンテンツのナビゲーション間の間隔を作成します。 */
}
ul.nav li {
	border-bottom: 1px solid #666; /* ボタンの区切り線を作成します。 */
}
ul.nav a, ul.nav a:visited { /* これらのセレクターをグループ化することで、リンクのボタン表示が訪問後も確実に保持されます。 */
	padding: 5px 5px 5px 15px;
	display: block; /* リンクにブロックプロパティを指定し、リンクが含まれる LI 全体がリンクになるようにします。これにより、領域全体がマウスのクリックに反応するようになります。 */
	text-decoration: none;
	background: #fff;
	color: #000;
}
ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* マウスを使用する場合もキーボードを使用する場合も、背景色とテキストカラーを変更します。 */
	background: #f30;
	color: #FFF;
}

/* ~~ フッター ~~ */
.footer {
	padding: 10px 0px;
	margin-bottom: 20px;
	background: #F00;
	color: #FFF;
	position: relative;/* IE6 に、適切にクリアするための hasLayout を指定します。 */
	clear: both; /* この clear プロパティにより .container は、カラムの範囲がどこまでかを認識してその範囲を含めるようになります。 */
}

/* ~~ その他の float/clear クラス ~~ */
.fltrt {  /* このクラスを使用すると、ページ内でエレメントを右にフローティングさせることができます。フローティングさせるエレメントは、ページ内で横に並べて表示するエレメントの前に指定する必要があります。 */
	float: right;
	margin-left: 8px;
}
.fltlft { /* このクラスを使用すると、ページ内でエレメントを左にフローティングさせることができます。フローティングさせるエレメントは、ページ内で横に並べて表示するエレメントの前に指定する必要があります。 */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* このクラスは、#footer が #container から削除されているか取り出されている場合に、<br /> または空の div で、フローティングさせる最後の div に続く最後のエレメントとして (#container 内に) 配置できます。 */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}

/*masonry */
.box {
  border: 1px solid #000;
　border-radius: 10px;
  width: 310px;
  height: auto;
  margin: 5px;
  padding:5px;
  float: left;
}

#fit-width .masonry {
  margin: 0 auto;
}


.pageheader{
	width: 900px;
	height: 180px;
	margin: 20px 0px;
/*	background-image: url(http://www.jcp-fujiidera.net/wp/wp-content/uploads/pagehead2.jpg);*/
	background-repeat: no-repeat;
}

.pagecontainer{
	width: 900px;
	margin: 0px auto;
}
.breadcrumbs {
	float: left;
	width: 450px;
	padding-top: 5px;
	padding-left: 20px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 0.9em;
}


.pagecontent{
	width: 720px;
	/*height: auto;*/
	/*float: left;*/
	padding: 15px;
}

.midashi1 {
	color: #666;
	margin-right: 5px;
	font-size: 1.1em;
	font-weight: 120;
	padding-top: 0.3em;
	padding-right: 0.4em;
	padding-bottom: 0.3em;
	padding-left: 0.5em;
	border-left-width: 10px;
	border-left-style: solid;
	border-left-color: #f00;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #f00;
}

.midashi2 {
	color: #fff;
	margin-right: 5px;
	font-size: 1.1em;
	font-weight: 120;
	padding-top: 0.2em;
	padding-right: 0.4em;
	/*padding-bottom: 0.1em;*/
	padding-left: 0.5em;
	background-color: #C7C4CA;
	border-bottom-width: 0px;
	border-bottom-style: solid;
	border-bottom-color: #930;
}

a.more-link{
	display: block;
	color: #999;
	font-size: 0.9em;
	text-align: right;
}

/* image の画像回り込み　*/

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

img.alignright {
	padding: 4px;
	margin: 0 0 2px 7px;
	display: inline;
	}

img.alignleft {
	padding: 4px;
	margin: 0 7px 2px 0;
	display: inline;
	}

.alignright {
	float: right;
	}

.alignleft {
	float: left
	}



/* 
  -----------------------------------
  Pop Menu Magic 2
  by Project Seven Development
  www.projectseven.com
  Menu Type: Vertical
  Style Theme: 08 - Cayenne
  -----------------------------------
*/

/*Menu Outer Wrapper*/
.p7PMMv08 {
	width: auto;
	margin: 0 auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: inherit;
	padding: 0;
	text-align: left;
	line-height: normal;
}
/*Hide Sub-Menu in Design View*/
.p7PMMv08 ul div {
	display: none;
}
/*
TOP LEVEL MENU
*/
.p7PMMv08 ul {
	margin: 0;
	padding: 0;
}
.p7PMMv08 li {
	list-style-type: none;
}
.p7PMMv08 a {
	display: block;
	text-decoration: none;
	padding: 5px 16px;
	color: #000 !important;
	background-color: #FFF;
	border-top: 1px solid #FF4609;
	border-right: 1px solid #FF4609;
	border-bottom: 1px solid #FF4609;
	border-left: 1px solid #FF4609;
	text-align: left;
}
.p7PMMv08 a:hover {
	color: #FFF !important;
	background-color: #E83A00 !important;
	border-color: #E83A00;
}
/*
Syntax for special classes programatically assigned to first and last links and also LIs
See user guide for more information
*/
.p7PMMv08 ul a.pmmfirst {
}
.p7PMMv08 ul a.pmmlast {
}
.p7PMMv08 ul li.pmmfirst {
}
.p7PMMv08 ul li.pmmlast {
}

/*First Sub Level*/
.p7PMMv08 ul ul {
	z-index: 10000;
	width: 180px;
	background-color: #FFF;
}
.p7PMMv08 ul ul li {
	background-image: none;
	background-color: #FFF;
}
.p7PMMv08 ul ul a {
	color: #000 !important;
	background-color: #FFC;
	border-color: #FF4609;
	text-align: left;
	overflow: hidden;
}
.p7PMMv08 ul ul a:hover {
	border-color: #E83A00;
}
/*
SPECIAL IMAGE-BASED RULES
*/
.p7PMMv08 img {
	border: 0;
}
.p7PMMv08 .p7PMM_img {
	padding: 0;
	border: 0;
	background-image: none;
	background-color: transparent;
}

/*
TRIGGERS and CUURENT MARK RULES
The Closed state relates to trigger items when their child menus are not showing
The Open state relates to trigger items when their child menus are showing
Selectors appended with _left Automatically change arrow position and orientation
if sub levels are set to fly out to the left
*/

/*Root Level*/
.p7PMMv08 a.trig_open {
	/*border-color: #000;*/
}
.p7PMMv08 a.trig_closed {
	background-image: url(img/pmm_east_dark.gif);
	background-repeat: no-repeat;
	background-position: right center;
}
.p7PMMv08 a.trig_closed_up {
	background-image: url(img/pmm_north_dark.gif);
	background-repeat: no-repeat;
	background-position: right center;
}
.p7PMMv08 a.trig_closed_left {
	background-image: url(img/pmm_west_dark.gif);
	background-repeat: no-repeat;
	background-position: left center;
}
.p7PMMv08 a.trig_open, .p7PMMv08 a.trig_open_left {
	color: #FFF !important;
	background-color: #E83A00 !important;
}
/*Sub Level*/
.p7PMMv08 ul ul a.trig_closed {
	background-image: url(img/pmm_east_medium.gif);
	background-repeat: no-repeat;
	background-position: right center;
}
.p7PMMv08 ul ul a.trig_closed_left {
	background-image: url(img/pmm_west_medium.gif);
	background-repeat: no-repeat;
	background-position: left center;
}
.p7PMMv08 ul ul a.trig_open, .p7PMMv08 ul ul a.trig_open_left {
	color: #CCC !important;
	background-color: #000 !important;
	background-image: none;
	border-color: #E83A00;
}

/*The Current Marker (You are here) links*/
.p7PMMv08 .current_mark {
	font-weight: bold;
	color: #000 !important;
	font-variant: small-caps;
}
.p7PMMv08 ul ul .current_mark {
	color: #EEE !important;
}
.p7PMMv08 .current_mark:hover {
	font-weight: bold;
	color: #FFFFFF !important;
}

/*
NO-SCRIPT RULES
The following rules enable your menu to work even when javascript is disabled in the browser
*/
.p7PMMv08.p7PMMnoscript {
	position: relative;
}
.p7PMMv08.p7PMMnoscript ul div {
	position: absolute;
	display: block;
	left: -9999px;
	top: -1em;
}
.p7PMMv08.p7PMMnoscript ul ul div {
	left: -9999px;
	top: 0px;
}
.p7PMMv08.p7PMMnoscript li:hover div {
	display: block;
	left: 190px;
}
.p7PMMv08.p7PMMnoscript li:hover ul div, .p7PMMv08.p7PMMnoscript li:hover ul ul div, 
.p7PMMv08.p7PMMnoscript li:hover ul ul ul div, .p7PMMv08.p7PMMnoscript li:hover ul ul ul ul div, 
.p7PMMv08.p7PMMnoscript li:hover ul ul ul ul ul div {
	left: -9999px;
}
.p7PMMv08.p7PMMnoscript li:hover div, .p7PMMv08.p7PMMnoscript li li:hover div, .p7PMMv08.p7PMMnoscript li li li:hover div, 
.p7PMMv08.p7PMMnoscript li li li li:hover div, .p7PMMv08.p7PMMnoscript li li li li li:hover div,
.p7PMMv08.p7PMMnoscript li li li li li li:hover div {
	left: 160px;
	top: 1.5em;
}