@charset "utf-8";

/* ------------------------------------------------------------
 style.css
 最終更新日:10/07/14

  目次
 0:reset
 1:layout
 2:header
 3:maincontents
 4:subarea
 5:footer
 6:form
 7:add

 更新内容
 css作成　7/14　上野

------------------------------------------------------------ */

/*==0:reset==================================================*/

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form,
fieldset, input, textarea, p, blockquote, th, td{
margin: 0;
padding: 0;
line-height: 100%;
font-family: "ヒラギノ角ゴ Pro W3", Osaka, "ＭＳ Ｐゴシック", Verdana, Arial, san-sefif;
}

a:link {
color: #003466;
text-decoration: underline;
}
a:visited {
color: #006599;
}
a:hover {
color: #328ebd;
}
a:active {
color: #328ebd;
}

img { border: none; }
a img { border: none; }



/*==1:layout==================================================*/

/* 1-1:サイト全体
------------------------------*/

body {
background:url(/family/efamily/image/common/bg.gif) repeat-y center top;
font-size: 90%;
text-align: center;
color: #666;
}

#wrapper{
width: 772px;
margin: 0 auto;
text-align:left;
background:#fff url(/family/efamily/image/common/contents_bg.gif) no-repeat left top;
}

/* 1-2:ヘッダー
------------------------------*/
	#header{
	width: 772px;
	overflow: hidden;
	border-top:4px solid #255292;
	border-bottom:2px solid #255292;
	}
	body #header.no-line{
	border-bottom:none;
	}

/* 1-3:コンテンツ部分
------------------------------*/
	#container{
	width: 750px;
	margin:0 10px 20px;
	overflow: hidden;
	/*border-top:2px solid #255292;*/
	/*border-top:2px solid #d08858;*/
	color: #333;
	}

		#maincontents{
		width: 720px;
		float:right;
		text-align:left;
		}

		#subarea{
		width: 155px;
		float:left;
		}

		#widesize-contents{
		width: 720px;
		margin:15px auto 0 auto;
		}

/* 1-4:フッター
------------------------------*/
	div#footer{
	margin:0 auto;
	padding-bottom:3em;
	background: #f7f7f0;
	border-top:1px solid #ccc;
	padding-top:10px;
	}

/*==2:header==================================================*/

#header #family-logo{
float:left;
margin-left:10px;
padding:0;
background:none;
}

#header #search-area{
float:right;
margin-right:10px;
text-align:right;
}

#header #search-box{
overflow:hidden;
}

#header #search-area input.search{
width:172px;
height:18px;
float:left;
border:1px solid #ccc;
border-top:1px solid #999;
border-left:1px solid #999;
}

#header #search-area p ,#header #search-area ul{
margin:5px 0;
}

#header #search-area li{
display:inline;
margin-left:10px;
list-style:none;
}
#header #search-area li.first{
margin-left:0;
}

#header #search-area input{
background-color:#f7ffff;
}

#top-feature{
clear:both;
margin-bottom:20px;
padding-bottom:2px;
text-align:center;
background:#255292;
}



/*==3:maincontents==================================================*/

/* 3-1:共通パーツ
------------------------------*/

#maincontents h1{
margin-bottom:0.5em;
padding:6px 10px 5px 10px;
background:#39669d;
color:#fff;
font-size:150%;
}

#maincontents h2, #maincontents h3 ,#widesize-contents h2, #widesize-contents h3{
margin:0 15px 1.5em;
font-size:100%;
}

#maincontents p, #widesize-contents p{
margin:0 15px 1.5em;
line-height:130%;
}

#maincontents hr, #widesize-contents hr{
margin-bottom:1em;
}

#maincontents .center, #widesize-contents .center{
text-align:center;
}

#container .textsmall{
font-size:80%;
}

#maincontents .textlarge{
font-size:120%;
}

#maincontents .textright{
text-align:right;
}

#maincontents .alignleft{
float:left;
margin-right:5px;
}
/* IEのみ */
* html #maincontents .alignleft{
margin-bottom:0.5em;
}


#maincontents .alignright{
float:right;
margin-left:5px;
}
/* IEのみ */
* html #maincontents .alignright{
margin-bottom:0.5em;
}


#maincontents .clearall, #widesize-contents .clearall{
clear:both;
}

#maincontents hr.line-dot ,#widesize-contents hr.line-dot{
margin-right:15px;
margin-left:15px;
height:1px;
background-color:#none;
border:none;
border-top:1px dotted #999;
}

#maincontents hr.deco-line{
width: 100%;
height:4px;
background-color:#b1e7e2;
border:none;
border-top:2px solid #255292;
}

/* IEのみ */
* html #maincontents hr.deco-line{
color:#b1e7e2;
}

#maincontents p.multi-image img {
margin-right:5px;
}

#maincontents p.caption-image {
margin-bottom:0.5em;
}

#maincontents p.gray-caption {
font-size:80%;
color:#999;
}

/* 3-1-1:タイトル関連
------------------------------*/

#maincontents .title-img{
padding:0;
}

#maincontents .title-top{
margin-left:0;
margin-right:0;
}

#maincontents .title-bluebox{
padding:6px 10px 5px 10px;
border:1px solid #39669d;
border-left:3px solid #39669d;
background:url(/family/efamily/image/common/bg_title_bluebox.gif) left center;
font-size:110%;
}

#maincontents .title-blueline ,#widesize-contents .title-blueline{
margin-bottom:1em;
padding:2px 5px 3px 10px;
background:url(/family/efamily/image/common/title_blueline.gif) repeat-y left bottom;
font-size:110%;
}

#maincontents .subtitle {
margin:0 15px 1em;
font-size:100%;
}

/* 3-1-2:リンク関連
------------------------------*/

a.white:link {
color: #fff;
}
a.white:visited {
color: #fff;
}
a.white:hover {
color: #fff;
}
a.white:active {
color: #fff;
}

#maincontents a[href$=".pdf"]{
background:transparent url(/family/efamily/image/common/icon_pdf.gif) no-repeat left top;
padding:1px 0 2px 20px;
}

#maincontents a.no-icon{
background:transparent url(/family/efamily/img/space.gif) no-repeat left top;
padding:0;
}

/* IEのみ */
* html #maincontents a.pdf{
background:transparent url(/family/efamily/image/common/icon_pdf.gif) no-repeat left top;
padding:1px 0 2px 20px;
}
* html #maincontents a{
    behavior: expression(
    this.className += this.getAttribute("href").match(/\.pdf$/) ? " pdf" : '',
    this.style.behavior = "none"
    );
}
* html #maincontents a.no-icon{
    behavior: expression(
    this.className += this.getAttribute("href").match(/\.pdf$/) ? " no-icon" : '',
    this.style.behavior = "none"
    );
}

#maincontents p.nextpage {
margin-top:0.5em;
margin-bottom:0.5em;
padding:3px 25px 3px 0;
background:url(/family/efamily/image/common/arrow_next.gif) no-repeat right center;
text-align:right;
font-size:90%;
}

#maincontents p.righttop {
margin-top:0;
margin-right:0;
background:url(/family/efamily/image/common/arrow_next_righttop.gif) no-repeat right center;
}


#maincontents p.go-top {
margin-top:0.5em;
padding:3px 20px 5px 0;
border-bottom:1px dotted #999;
background:url(/family/efamily/image/common/arrow_top.gif) no-repeat right center;
text-align:right;
font-size:90%;
}

#maincontents p.icon-login {
padding-left:20px;
background:url(/family/efamily/image/common/icon_key.gif) no-repeat left top;
}

#maincontents p.icon-ls-ken {
padding-left:20px;
background:url(/family/efamily/image/common/icon_ls.gif) no-repeat left top;
}

/* 3-2:トップページ
------------------------------*/
#container.no-line{
border-top:none;
}

#maincontents #top-news{
width:565px;
margin:1em 0 1.5em 20px;
overflow:hidden;
background:url(/family/efamily/image/top/bg_news.gif) repeat-y right top;
}

#maincontents #top-news p{
margin:0;
font-size:90%;
}

#maincontents #top-news #news-area{
width:425px;
float:left;
}

#maincontents .news-box{
width:425px;
margin-bottom:10px;
padding-top:1px;
border-top:1px solid #ccc;
overflow:hidden;
}

#maincontents .news-box h3{
margin:0.5em 0;
font-size:100%;
line-height:130%;
}

#maincontents .news-box img{
float:left;
margin-right:15px;
}

#maincontents #top-news .news-box .date{
margin-top:0;
margin-bottom:1px;
padding:3px 15px;
background:#666 url(/family/efamily/image/top/title_bg_gray.gif) repeat-x left top;
font-size:90%;
color:#fff;
font-weight:normal;
}

#maincontents #top-news .news-box .latest{
background:#3c91b0 url(/family/efamily/image/top/title_bg_blue.gif) repeat-x left top;
}

#maincontents .backnumber-list{
margin:0;
background:url(/family/efamily/image/common/line_dot.gif) repeat-x left center;
text-align:right;
}

#maincontents #top-news #new-journal{
width:122px;
float:right;
background:#c4c4a6;
}

#maincontents #top-news #new-journal p{
text-align:center;
margin-bottom:10px;
}

#maincontents #top-news #new-journal a:link {
color: #333333;
}
#maincontents #top-news #new-journal a:visited {
color: #60511c;
}
#maincontents #top-news #new-journal a:hover {
color: #806c25;
}
#maincontents #top-news #new-journal a:active {
color: #806c25;
}

#maincontents #top-info{
width:555px;
margin:1em 15px;
}

#maincontents #top-info ul{
list-style:none;
}

#maincontents #top-info li{
padding:5px 10px;
background:url(/family/efamily/image/common/line_dot.gif) repeat-x left bottom;
}

#maincontents #top-info li:after {
		display: block;
		clear: both;
		height: 0;
		visibility: hidden;
		font-size: 0;
		content: ".";
	}

#maincontents #top-info li { display: inline-block; }
#maincontents #top-info li { display: block; }

#maincontents #top-info p{
width:400px;
float:left;
margin:0;
line-height:120%;
font-size:90%;
}

#maincontents #top-info p.date{
padding-left:0;
width:110px;
}

/* 3-3:ぱんくず
------------------------------*/

#container #topic-path{
margin:5px;
font-size:10px;
color: #666;
}

#container #topic-path li{
display:inline;
list-style:none;
}

#container #topic-path li.last{
background:none;
}

/* IEのみ */
* html #container #topic-path{
margin-left:0;
}
* html #container #topic-path li{
padding-right:5px;
padding-left:5px;
background:url(/family/efamily/image/common/arrow_topicpath.gif) no-repeat right center;
}


#container #topic-path li:after{
content: " > ";
}

#container #topic-path li.last:after{
visibility: hidden;
}

/* 3-4:記事目次
------------------------------*/

#maincontents .article-list{
margin:0 15px　1em 15px;
padding:10px;
border:1px dotted #999;
background:#fff;
font-size:90%;
}

#maincontents .article-list:after {
		display: block;
		clear: both;
		height: 0;
		visibility: hidden;
		font-size: 0;
		content: ".";
	}

#maincontents .article-list { display: inline-block; }
#maincontents .article-list { display: block; }


#maincontents .article-list p{
margin:0;
margin-bottom:1em;
}

#maincontents .article-list ul{
margin-bottom:0;
}

#maincontents .article-list li{
padding:0 0 5px 20px;
list-style:none;
line-height:120%;
background:url(/family/efamily/image/common/contents_arrow.gif) no-repeat left top;
}

#maincontents .article-list li.arrow-blue{
background:url(/family/efamily/image/common/contents_arrow_blue.gif) no-repeat left top;
}

/* 3-5:イメージ入り記事タイトル
------------------------------*/

#maincontents .article-title{
width:555px;
margin:0 15px 1em 15px;
overflow:hidden;
}

#maincontents .article-title h3 {
margin:0;
margin-bottom:0.5em;
line-height: 130%;
}

#maincontents .article-title p {
margin:0;
}

#maincontents .article-title p.recent-image {
float:left;
margin-right:10px;
}

/* 3-6:関連情報ボックス
------------------------------*/

#maincontents .info-box{
clear:both;
margin-bottom:1.5em;
margin-left:12px;
background:url(/family/efamily/image/common/bg_info.gif) repeat-y left top;
font-size:90%;
}

#maincontents .info-box p{
margin:0 25px 0 15px;
}

#maincontents .info-box ul{
margin:10px 35px 10px 25px;
list-style:none;
}

#maincontents .info-box li{
margin-bottom:5px;
padding-left:22px;
background:url(/family/efamily/image/common/icon_dot.gif) no-repeat left top;
line-height:130%;
}

#maincontents .info-box img{
vertical-align:bottom;
line-height:0;
}

#maincontents .info-box h3{
margin:0 25px 0 15px;
font-size:110%;
line-height:130%;
}

#maincontents .info-box h3 span{
font-weight:normal;
}

#maincontents .info-box h3.title-info{
margin:0;
padding:15px 20px 10px;
background:url(/family/efamily/image/common/bg_title_info.gif) no-repeat left top;
font-size:100%;
color:#fff;
line-height:100%;
}

#maincontents .info-box .textsmall{
color:#666;
}

#maincontents .relatedlink {
clear:both;
margin:0 15px 1.5em;
padding-bottom:15px;
background:#e9f0f2 url(/family/efamily/image/common/bg_bottom_relatedlink.gif) no-repeat left bottom;
}

/* 3-7:次号プレビュータイトル
------------------------------*/
#maincontents .preview-title{
width:555px;
clear:both;
margin-right:15px;
margin-bottom:1em;
margin-left:15px;
padding-bottom:5px;
border-bottom:1px dotted #999;
}

#maincontents .preview-title h2 {
clear:both;
margin:0;
line-height:150%;
font-size:90%;
font-weight:normal;
border-left:3px solid #294e7f;
}

#maincontents .preview-title h2:after {
		display: block;
		clear: both;
		height: 0;
		visibility: hidden;
		font-size: 0;
		content: ".";
	}

#maincontents .preview-title h2 { display: inline-block; }
#maincontents .preview-title h2 { display: block; }


#maincontents .preview-title h2 img {
float:left;
margin-right:5px;
}

/* 3-8:一覧
------------------------------*/

#maincontents .contents-list{
margin:0 15px 1em 15px;
}

#maincontents .contents-list h2 {
margin:0;
margin-bottom:0.5em;
apadding-left:5px;
padding:3px 5px 2px 5px;
aborder-left:3px solid #294e7f;
background:#39669d;
color:#fff;
}

#maincontents .contents-list p {
margin-bottom:0;
font-size:90%;
}

#maincontents .contents-list li{
width:555px;
padding-top:1px;
border-top:1px dotted #999;
overflow:hidden;
list-style:none;
}

#maincontents .contents-list2 li{
width:555px;
padding:1px 0 3px 0;
overflow:hidden;
list-style:none;
}

#maincontents .contents-list .nextpage {
margin-bottom:5px;
}

#maincontents .contents-list .alignleft img {
margin-bottom:2em;
}


/* 3-9:会報目次
------------------------------*/
#maincontents #journal-list {
width:770px;
margin:0 0 2em 15px;
overflow:hidden;
}
#maincontents #journal-list li{
width:350px;
float:left;
margin-right:7px;
margin-bottom:7px;
overflow:hidden;
}

#maincontents #journal-list h2{
margin-bottom:5px;
margin-left:5px;
font-size:100%;
visibility:hidden;
}

#maincontents #journal-list h2.title-open{
visibility:visible;
}


#maincontents #journal-list li p{
margin:0 5px 5px;
font-size:80%;
}

#maincontents .other-journal {
margin:0 15px 2em 25px;
list-style:none;
font-size:90%;
}

#maincontents .other-journal li {
margin-bottom:5px;
padding-left:22px;
background:url(/family/efamily/image/common/icon_dot.gif) no-repeat left top;
line-height:110%;
}

#maincontents .other-journal li:after {
		display: block;
		clear: both;
		height: 0;
		visibility: hidden;
		font-size: 0;
		content: ".";
	}

#maincontents .other-journal li { display: inline-block; }
#maincontents .other-journal li { display: block; }

#maincontents .other-journal li p{
width:460px;
float:left;
margin:0;
text-align:left;
}

#maincontents .other-journal li p.number{
width:62px;
}


/* 3-10:新着一覧
------------------------------*/
#maincontents .news-list {
margin:0 15px 2em 25px;
list-style:none;
font-size:90%;
}

#maincontents .news-list li {
margin-bottom:5px;
padding:3px 5px;
background:url(/family/efamily/image/common/line_dot.gif) repeat-x left bottom;
line-height:110%;
}

#maincontents .news-list li:after {
		display: block;
		clear: both;
		height: 0;
		visibility: hidden;
		font-size: 0;
		content: ".";
	}

#maincontents .news-list li { display: inline-block; }
#maincontents .news-list li { display: block; }

#maincontents .news-list li p{
width:400px;
float:left;
margin:0;
text-align:left;
}

#maincontents .news-list li p.date{
width:102px;
padding-left:0;
}


/*==4:subarea==================================================*/

/* 4-1:グローバルナビ等
------------------------------*/

#subarea #gnavi{
margin-bottom:15px;
border:1px solid #ddd;
background:#294e7f;
}

#subarea #snavi{
border:1px solid #ddd;
margin-bottom:15px;
}

#subarea ul{
margin:4px;
margin-bottom:0;
list-style:none;
}

#subarea li{
margin-bottom:4px;
}

#subarea li.open{
margin-bottom:0;
}

#subarea #snavi li a{
display:block;
width:145px;
height:45px;
background-position:left top;
line-height: 0;
vertical-align:bottom;
font-size: 1px;
text-indent: -9999px;
}

/*#subarea #gnavi a:hover{
background-position:center top;
}
#subarea #gnavi a.current ,#subarea #gnavi a.current:hover{
background-position:right top;
}

#subarea #gnavi #g-top a{
background-image:url(/family/efamily/image/common/gnavi_top.gif) ;
}
#subarea #gnavi #g-from a{
background-image:url(/family/efamily/image/common/gnavi_from.gif) ;
}
#subarea #gnavi #g-human a{
background-image:url(/family/efamily/image/common/gnavi_human.gif) ;
}
#subarea #gnavi #g-editor a{
background-image:url(/family/efamily/image/common/gnavi_editor.gif) ;
}
#subarea #gnavi #g-spring a{
background-image:url(/family/efamily/image/common/gnavi_spring.gif) ;
}
#subarea #gnavi #g-autumn a{
background-image:url(/family/efamily/image/common/gnavi_autumn.gif) ;
}
#subarea #gnavi #g-branch a{
background-image:url(/family/efamily/image/common/gnavi_branch.gif) ;
}
#subarea #gnavi #g-back a{
background-image:url(/family/efamily/image/common/gnavi_back.gif) ;
}
#subarea #gnavi #g-kfamily a{
background-image:url(/family/efamily/image/common/gnavi_kfamily.gif) ;
}*/

#subarea #snavi a:hover{
background-position:right top;
}
#subarea #snavi a.current ,#subarea #snavi a.current:hover{
background-position:left top;
}

#subarea #snavi #s-about a{
background-image:url(/family/efamily/image/common/snavi_about.gif) ;
}
#subarea #snavi #s-voice a{
background-image:url(/family/efamily/image/common/snavi_voice.gif) ;
}
#subarea #snavi #s-enquete a{
background-image:url(/family/efamily/image/common/snavi_enquete.gif) ;
}

#subarea .navi-open{
margin-bottom:4px;
padding:10px;
border:1px solid #999;
background:#fff;
}

#subarea .navi-open p{
margin:0 0 8px;
font-size:90%;
font-weight:bold;
}

#subarea .navi-open ul{
margin:0;
}

#subarea .navi-open li{
padding-left:20px;
background:url(/family/efamily/image/common/icon_opennavi.gif)  no-repeat left top;
font-size:90%;
}

#subarea .navi-open li.last{
background:url(/family/efamily/image/common/icon_opennavilast.gif)  no-repeat left top;
padding-left:20px;
}

#subarea .navi-open li a{
display:inline-block;
width:auto;
height:auto;
line-height:100%;
font-size: 100%;
text-indent:0;
}


/*==5:footer==================================================*/

#footer img{
margin-top:8px;
margin-bottom:8px;
}

#footer #fnavi li{
display:inline;
float:left;
margin-left:10px;
list-style:none;
}

#footer .fbanner{
display:inline;
float:right;
margin-right:10px;
}

#footer hr{
width: 100%;
height:3px;
clear:both;
background-color:#fff;
border:none;
border-top:1px solid #d8d8b6;
}

/* IEのみ */
* html #footer hr{
color:#fff;
}

#footer #copyright{
text-align:center;
font-size:80%;
}

#footer .adjust{
margin-top:4px;
}


/*==6:form==================================================*/

#widesize-contents h1{
margin-bottom:1em;
padding:6px 10px 5px 10px;
background:#39669d;
color:#fff;
font-size:150%;
}

#widesize-contents h2 ,#widesize-contents h3{
margin-bottom:0.5em;
}

#widesize-contents p{
margin-bottom:1.5em;
font-size:90%;
line-height:130%;
}

#widesize-contents p.text-form{
width:550px;
margin-right:auto;
margin-left:auto;
}

#widesize-contents ul{
margin:0 15px 1em 35px;
}

#widesize-contents li{
margin-bottom:5px;
font-size:90%;
line-height:130%;
}

#widesize-contents table{
width:550px;
margin:0 auto 1em;
border-collapse:collapse;
border:1px solid #999;
}

#widesize-contents td{
padding:5px;
border:1px solid #999;
font-size:70%;
line-height:120%;
}


#widesize-contents th{
padding:5px;
border:1px solid #999;
background:#eee;
text-align:left;
font-size:90%;
line-height:120%;
}

#widesize-contents .text-red{
color:#cc0000;
}

#widesize-contents .size100{
width:100px;
}

#widesize-contents .size150{
width:150px;
}

#widesize-contents .size200{
width:200px;
}

#widesize-contents .size250{
width:250px;
}

#widesize-contents .size300{
width:300px;
}

#widesize-contents .btn-submit{
margin-right:5px;
margin-left:5px;
padding:5px 15px;
}

#widesize-contents .alignleft{
float:left;
margin-right:5px;
}

#widesize-contents .alignleft-box{
width:49%;
margin-bottom:3px;
float:left;
}

#widesize-contents .alignright-box{
width:49%;
float:right;
margin-bottom:3px;
}

#widesize-contents .gray-box{
width:446px;
overflow:hidden;
margin-bottom:2em;
margin-left:15px;
padding:5px 10px;
background:#eee;
}

#widesize-contents .gray-box p{
float:left;
margin:0;
margin-right:10px;
font-size:80%;
font-weight:bold;
}

/*==7:add==================================================*/

/* 7-1:会報ふぁみり関連
------------------------------*/

#maincontents .kfamily p{
margin-bottom:1em;
font-size:120%;
}

#maincontents .kfamily p.textsmall{
font-size:100%;
}

#maincontents .kfamily p.nextpage{
font-size:90%;
}

#subarea.kfamily h2{
margin-top:10px;
margin-bottom:5px;
}

#subarea.kfamily p{
margin-bottom:5px;
line-height:120%;
font-size:80%;
}

/* IEのみ */
* html #subarea.kfamily p{
line-height:150%;
}

#subarea.kfamily p.gray-box{
padding:5px;
border:1px dotted #ccc;
background:#eee;
}

#subarea.kfamily p.nextpage {
padding:3px 25px 3px 0;
background:url(/family/efamily/image/common/arrow_next.gif) no-repeat right center;
text-align:right;
}