@charset "utf-8";

/*サイト内で使用する文字のサイズ
10px=77%
11px=85%
12px=92%
13px=100%
14px=107%
15px=114%
16px=112%
17px=129%
18px=136%
19px=144%
20px=152%
21px=159%
22px=167%
23px=174%
24px=182%
25px=189%
26px=197%
*/

*{
margin:0px;
padding:0px;
}

html{
overflow-y:scroll;
}

body{
font-family:Tahoma,Verdana,Segoe,sans-serif;
font-size:92%;
font-weight:normal;
color:#333333;
line-height:1.5;
background:url("../images/bg_body.gif") repeat-x;
}

/*######################################################################################【汎用】*/


/********************************************************************【回り込み解除】*/

.clearfix:after{
content:"";
display:block;
height:0;
clear:both;
overflow:hidden;
}

.clearfix{
display:inline-table;
}

/*Hides from IE-mac*/
*html.clearfix{
height:1%;
}

.clearfix{
display:block;
}

.clear{
height:0px;
clear:both;
background:none;
}

/********************************************************************【リンク】*/

a{color:#8ec112;text-decoration:none;outline:0;}
a:hover{color:#12a2c1;text-decoration:underline;}
a:active{text-decoration:underline;}

a img{
border:0px;
	align:center;
}

a:hover img{
filter:alpha(opacity=60);
opacity:0.6;
border:0px;
	align:center;
}

/********************************************************************【強調】*/

.attention{
color:#ff9000;
}

/********************************************************************【余白】*/

.mt05{margin-top:5px;}
.mr05{margin-right:5px;}
.ml05{margin-left:5px;}

.mb05{margin-bottom:5px;}
.mb10{margin-bottom:10px;}
.mb15{margin-bottom:15px;}
.mb20{margin-bottom:20px;}
.mb30{margin-bottom:30px;}
.mb50{margin-bottom:50px;}

/********************************************************************【テーブル】*/

table{
margin:0.5em 0px;
border:1px solid #d1cbbd;
border-collapse:collapse;
border-spacing:0px;
}

th{
padding:3px 6px;
line-height:1.3;
font-weight:normal;
border:0px solid #d1cbbd;
border-width:1px 1px 1px 1px;
background:#EEEEEE;
white-space:nowrap; 
	width:220px;
}

td{
padding:3px 3px;
border:1px solid #d1cbbd;
border-width:0px 0px 1px 1px;
}

/********************************************************************【その他】*/

.indent{
text-indent:1em;
}

.indent-9999{
text-indent:-9999px;
}

.kome{
padding-left:1.1em;
text-indent:-1.1em;
list-style-type:none;
}

/*####################################################################################################*/
/*######################################################################################            ##*/
/*###################################################################################### レイアウト ##*/
/*######################################################################################            ##*/
/*####################################################################################################*/


/*######################################################################################【ヘッダー】*/

#header{
margin-bottom:5px;
width:100%;
height:163px;
background:url("../images/bg_header.gif") repeat-x;
}

#wrap_head{
margin:0px auto;
width:860px;
height:114px;
}

/********************************************************************【サイト名】*/

h1{
margin:17px 0px 0px 0px;
width:316px;
height:45px;
font-size:18px;
color:#000000;
float:left;
display:block;
}

/********************************************************************【サイト機能ボタン】*/

#function{
margin-top:6px;
margin-left:222px;
width:308px;
height:26px;
float:right;
display:inline;
position:relative;
background:url("../images/bg_function.gif") repeat-x bottom;
}

/********************************************************************【RSS配信とは？】*/

#about_rss{
margin:0px 10px 0px 0px;
width:103px;
height:21px;
float:left;
display:block;
text-indent:-9999px;
}

#about_rss a{
width:103px;
height:21px;
float:left;
display:block;
text-indent:-9999px;
background:url("../images/about_rss.gif") no-repeat left top;
}

#about_rss a:hover{
filter:alpha(opacity=60);
opacity:0.6;
border:0px;
background:url("../images/about_rss.gif") no-repeat left top;
}

/********************************************************************【文字サイズ変更】*/

#fontLMS{
padding-bottom:4px;
width:129px;
height:21px;
float:left;
text-indent:-9999px;
background:url("../images/bg_fontLMS.gif") no-repeat left top;
}

#function dd{
margin-left:3px;
float:left;
display:block;
text-indent:-9999px;
}

#function dd a{
float:left;
display:block;
text-indent:-9999px;
zoom:1;
}

#fontL{
width:21px;
height:21px;
}

#fontM{
width:19px;
height:19px;
}

#fontS{
width:17px;
height:17px;
}

#fontL a{
width:21px;
height:21px;
background:url("../images/btn_fontL.gif") no-repeat left top;}
#fontL a:hover{background:url("../images/btn_fontL_hv.gif") no-repeat left top;}

#fontM a{
margin-top:2px;
width:19px;
height:19px;
background:url("../images/btn_fontM.gif") no-repeat left top;}
#fontM a:hover{background:url("../images/btn_fontM_hv.gif") no-repeat left top;}

#fontS a{
margin-top:4px;
width:17px;
height:17px;
background:url("../images/btn_fontS.gif") no-repeat left top;}
#fontS a:hover{background:url("../images/btn_fontS_hv.gif") no-repeat left top;}


/********************************************************************【Googleカスタム検索】*/

#Box_search{
margin:5px 0px;
width:308px;
height:32px;
float:right;
display:inline;
position:relative;
overflow:hidden;
font-size:12px;
line-height:1;
}

#Box_search table,
#Box_search th,
#Box_search td{
margin:0px;
padding:0px;
border:none;
background:none;
}

#Box_search input{width:212px;}


.ita-kd-icon-button{display:none !important;}

/**********************************【検索するボタン】*/

#csb{
width:83px !important;
height:22px;
text-indent:-9999px;
border:0px;
background:url("../images/btn_csb.gif") no-repeat right top;
cursor:pointer;
}

/********************************************************************【サイトナビ】*/

ul#naviS{
margin-left:-70px;
width:710px;
height:29px;
float:right;
display:inline;
position:relative;
list-style-type:none;
}

ul#naviS li{
height:29px;
text-indent:-9999px;
float:left;
display:block;
}

ul#naviS li a{
height:29px;
text-indent:-9999px;
float:left;
display:block;

font-size:12px;
line-height:1;
zoom:1;
}

#naviS_home{
margin-right:10px;
width:60px;
background:url("../images/naviS_home.gif") no-repeat right top;
}

#naviS_home a{
width:60px;
background:url("../images/naviS_home.gif") no-repeat right top;
}

#naviS_home a:hover{
background:url("../images/naviS_home_hv.gif") no-repeat right top;
}

#naviS_about,
#naviS_about a{
width:102px;
background:url("../images/naviS_about.gif") no-repeat right top;
}

#naviS_about a:hover{
background:url("../images/naviS_about_hv.gif") no-repeat right top;
}

#naviS_access,
#naviS_access a{
width:66px;
background:url("../images/naviS_access.gif") no-repeat right top;
}

#naviS_access a:hover{
background:url("../images/naviS_access_hv.gif") no-repeat right top;
}

#naviS_qa,
#naviS_qa a{
width:131px;
background:url("../images/naviS_qa.gif") no-repeat right top;
}

#naviS_qa a:hover{
background:url("../images/naviS_qa_hv.gif") no-repeat right top;
}

#naviS_request,
#naviS_request a{
width:68px;
background:url("../images/naviS_request.gif") no-repeat right top;
}

#naviS_request a:hover{
background:url("../images/naviS_request_hv.gif") no-repeat right top;
}

#naviS_inquiry,
#naviS_inquiry a{
width:92px;
background:url("../images/naviS_inquiry.gif") no-repeat right top;
}

#naviS_inquiry a:hover{
background:url("../images/naviS_inquiry_hv.gif") no-repeat right top;
}

#naviS_securitypolicy,
#naviS_securitypolicy a{
width:128px;
background:url("../images/naviS_securitypolicy.gif") no-repeat right top;
}

#naviS_securitypolicy a:hover{
background:url("../images/naviS_securitypolicy_hv.gif") no-repeat right top;
}

#naviS_link,
#naviS_link a{
width:52px;
background:url("../images/naviS_link.gif") no-repeat right top;
}

#naviS_link a:hover{
background:url("../images/naviS_link_hv.gif") no-repeat right top;
}

/********************************************************************【グローバルナビ】*/

#globalnavi{
width:100%;
height:45px;
background:url("../images/bg_globalnavi.jpg") repeat-y center top #000000;
}

#globalnavi ul{
margin:0px auto;
width:854px;
height:45px;
list-style-type:none;
clear:both;
}

#globalnavi li,
#globalnavi li a{
width:122px;
height:45px;
text-indent:-9999px;
float:left;
display:block;
}

#naviG_newsrelease a{background:url("../images/naviG_newsrelease.gif") no-repeat right top;}
#naviG_newsrelease a:hover{background:url("../images/naviG_newsrelease_hv.gif") no-repeat right top;}

#naviG_massmedia a{background:url("../images/naviG_media.gif") no-repeat right top;}
#naviG_massmedia a:hover{background:url("../images/naviG_media_hv.gif") no-repeat right top;}

#naviG_gallery a{background:url("../images/naviG_gallery.gif") no-repeat right top;}
#naviG_gallery a:hover{background:url("../images/naviG_gallery_hv.gif") no-repeat right top;}

#naviG_schedule a{background:url("../images/naviG_schedule.gif") no-repeat right top;}
#naviG_schedule a:hover{background:url("../images/naviG_schedule_hv.gif") no-repeat right top;}

#naviG_activity a{background:url("../images/naviG_activity.gif") no-repeat right top;}
#naviG_activity a:hover{background:url("../images/naviG_activity_hv.gif") no-repeat right top;}

#naviG_guide a{background:url("../images/naviG_guide.gif") no-repeat right top;}
#naviG_guide a:hover{background:url("../images/naviG_guide_hv.gif") no-repeat right top;}

#naviG_database a{background:url("../images/naviG_database.gif") no-repeat right top;}
#naviG_database a:hover{background:url("../images/naviG_database_hv.gif") no-repeat right top;}

/*######################################################################################【メインコンテンツ】*/

#pagebody{
margin:0px auto 20px auto;
width:860px;
font-size:92%;
}

#pagebody h2{

}

#pagebody ul{

}

#pagebody li{

}

/********************************************************************【ページタイトル】*/

#pageTitle{
margin:0px 0px 7px 0px;
width:860px;
height:140px;
}

/***********************【パンクズナビ】*/

ul#pankuzu {
margin:1em 10px;
width:840px;
line-height:1;
list-style-type:none;
}

ul#pankuzu li{
margin:0px 20px 0px 0px;
padding-right:20px;
font-size:12px;
float:left;
background:url("../../common/images/bg_pankuzu.gif") right top no-repeat;
}

/********************************************************************【左サイド】*/

#pageLeft{
width:230px;
float:left;
display:inline;
}

/*********************************************************【ローカルナビ】*/

.localnavi{
margin-bottom:10px;
}

ul.localnavi{
line-height:1.1;
list-style-type:none;
}

.localnavi li{
width:230px;
display:block;
}

.localnavi li a{
padding:14px 10px 14px 24px;
width:196px;
color:#000000;
display:block;
background:url("../../common/images/bg_localnavi.gif") left top no-repeat #EEEEEE;
border-top:1px solid #FFFFFF;
border-bottom:1px solid #d7d7d7;
}

.localnavi li a:hover{
text-decoration:none;
color:#FFFFFF;
background:url("../../common/images/bg_localnavi_hv.gif") left top no-repeat #000000;
}

/*#################【 myself 】*/

.localnavi .myself{
text-decoration:none;
background:url("../../common/images/bg_localnavi_myself.gif") left top no-repeat #E0E0E0;
}

/***********************【ローカルナビタイトル】*/

#subT_archives{
width:230px;
height:45px;
text-indent:-9999px;
background:url("../../common/images/subT_archives.gif") left top no-repeat;
}

#subT_contents{
width:230px;
height:45px;
text-indent:-9999px;
background:url("../../common/images/subT_contents.gif") left top no-repeat;
}

/**********************************【全ページ共通バナー】*/

#bnr_doyu{
margin-bottom:30px;
width:230px;
list-style-type:none;
}

/***********************【写真で見る！】*/

#bnr_photogallery{
margin-bottom:5px;
width:230px;
height:115px;
text-indent:-9999px;
display:block;
}

#bnr_photogallery a{
width:230px;
height:115px;
display:block;
background:url("../images/bnr_photogallery.jpg") no-repeat left top;
}

#bnr_photogallery a:hover{
filter:alpha(opacity=60);
opacity:0.6;
border:0px;
background:url("../images/bnr_photogallery.jpg") no-repeat left top;
}

/***********************【私が語る！】*/

#bnr_guide{
margin-bottom:5px;
}

#bnr_guide a{
width:230px;
height:115px;
display:block;
position:absolute;
z-index:1;
background:url("../images/bnr_guide.jpg") no-repeat left top;
}

#bnr_guide a:hover{
filter:alpha(opacity=60);
opacity:0.6;
border:0px;
background:url("../images/bnr_guide.jpg") no-repeat left top;
}

#bnr_guide dl{
width:230px;
height:115px;
display:block;
position:relative;
z-index:2;
}

#guideTitle{
width:230px;
height:68px;
position:relative;
z-index:3;
}

#guideTitle a{
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}

#guideVolume{
margin-top:21px;
width:50px;
float:left;
line-height:1;
text-align:center;
font-weight:bold;
display:inline;
position:relative;
z-index:4;
}

#guidePosition{
margin:4px 10px 0px 0px;
padding-top:4px;
width:168px;
height:1.2em;
line-height:1.2;
font-weight:bold;
color:#000000;
float:right;
display:inline;
position:relative;
z-index:5;
}

#guideName{
margin:0px 10px 0px 0px;
padding-top:3px;
width:168px;
line-height:1;
font-weight:bold;
color:#000000;
float:right;
display:inline;
position:relative;
z-index:6;
}

/***********************【資料を請求する。】*/

#bnr_request{
margin-bottom:5px;
width:230px;
height:115px;
text-indent:-9999px;
display:block;
}

#bnr_request a{
width:230px;
height:115px;
display:block;
background:url("../images/bnr_request.jpg") no-repeat left top;
}

#bnr_request a:hover{
filter:alpha(opacity=60);
opacity:0.6;
border:0px;
background:url("../images/bnr_request.jpg") no-repeat left top;
}

/**********************************【有料広告掲載】*/

#bnr_PR{
margin-bottom:30px;
padding-top:3px;
list-style-type:none;
background:url("../images/bg_bnr_PR.gif") repeat-x left top;
}

#bnr_PR li{
padding:5px 15px 8px 15px;
width:200px;
height:60px;
background:url("../images/bg_bnr_PR.gif") repeat-x left bottom;
}

/**********************************【その他】*/

#bnr_pickup{
margin-bottom:30px;
width:230px;
height:120px;
list-style-type:none;
}

#bnr_schedule,
#bnr_newmembers{
width:230px;
height:55px;
text-indent:-9999px;
display:block;
}

#bnr_schedule a{

width:230px;
height:55px;
text-indent:-9999px;
display:block;
background:url("../images/bnr_schedule.jpg") no-repeat left top;
}

#bnr_schedule a:hover{
filter:alpha(opacity=60);
opacity:0.6;
border:0px;
background:url("../images/bnr_schedule.jpg") no-repeat left top;
}

#bnr_newmembers{
position:absolute;
z-index:1;
}

#bnr_newmembers a{
margin-top:5px;
width:230px;
height:55px;
text-indent:-9999px;
display:block;
background:url("../images/bnr_newmembers.jpg") no-repeat left top;
position:relative;
z-index:1;
}

#bnr_newmembers a:hover{
filter:alpha(opacity=60);
opacity:0.6;
border:0px;
background:url("../images/bnr_newmembers.jpg") no-repeat left top;
}

#icon_new{
top:13px;
left:13px;
width:29px;
height:11px;
text-indent:-9999px;
position:absolute;
z-index:2;
background:url("../images/icon_new.gif") no-repeat left top;
}

/********************************************************************【右サイド】*/

#pageRight{
width:600px;
float:right;
display:inline;
position:relative;
}

/********************************************************************【RSS配信はこちら ページ横幅用】*/

#btn_rssPage{
margin:-32px 0px 0px 486px;
width:114px;
height:22px;
text-indent:-9999px;
display:block;
background:url("../images/btn_rss.gif") no-repeat left top;
}

#btn_rssPage a{
width:114px;
height:22px;
text-indent:-9999px;
display:block;
background:url("../images/btn_rss.gif") no-repeat left top;
}

#btn_rssPage a:hover{
background:url("../images/btn_rss_hv.gif") no-repeat left top;
}

/**********************************【資料・関連リンク】*/

.connection{
margin-top:2em;
padding:9px;
width:580px;
background:#f0f0f0;
border:1px solid #d7d7d7;
}

.connection h4{
margin-bottom:0.5em;
padding-left:8px;
line-height:1;
border-left:3px solid #8ec112;
}

.connection ul{
margin-left:1em;
}

.connection li{
margin:0px 0px 0px 30px;
line-height:1.3;
list-style-image:url("../images/arrow_sitemap.gif");
}

.connection li a:hover{
list-style-image:url("../images/arrow_sitemap.gif");
}

.connection li:hover{
list-style-image:url("../images/arrow_sitemap_hv.gif");
}

/**********************************【右カラムの　ページの先頭へ戻る】*/

.bottomNavi{
width:600px;
height:22px;
border-bottom:2px solid #313131;
}

.pagetop{
margin:-22px 0px 0px 474px;
width:126px;
height:22px;
text-indent:-9999px;

}

.pagetop a{
width:126px;
height:22px;
display:block;
background:url("../images/btn_pagetop.gif") no-repeat right top;
}

.pagetop a:hover{
background:url("../images/btn_pagetop_hv.gif") no-repeat right top;
}

/**********************************【右カラムの　前のページへ戻る】*/

.historyback{
margin:20px 0px 0px 0px;
width:126px;
height:22px;
text-indent:-9999px;
}

.historyback a{
width:126px;
height:22px;
display:block;
background:url("../images/btn_pageback.gif") no-repeat left top;
}

.historyback a:hover{
background:url("../images/btn_pageback_hv.gif") no-repeat left top;
}

/*######################################################################################【ページの先頭へ戻る】*/

#footnavi{
width:100%;
height:22px;
border-bottom:3px solid #313131;
}

#pagetop{
margin:0px auto;
width:860px;
height:22px;
text-indent:-9999px;
}

#pagetop a{
margin-left:734px;
width:126px;
height:22px;
display:block;
background:url("../images/btn_pagetop.gif") no-repeat right top;
}

#pagetop a:hover{
background:url("../images/btn_pagetop_hv.gif") no-repeat right top;
}

/*######################################################################################【フッター】*/

#footer{
width:100%;
background:#F0F0F0;
}

#foot_wrap{
margin:0px auto;
width:860px;
background:url("../images/bg_footer_address.jpg") no-repeat left top;
}

#location{
width:230px;
float:left;
display:inline;
}

#location address{
padding:90px 30px 0px 52px;
width:178px;
font-size:85%;
font-style:normal;
text-indent:-9999px;
line-height:1.16;
}

#location address a{
color:#12a2c1;
}

#bnr_hokkaido{
margin:50px 0px 0px 0px;
width:230px;
height:64px;
text-indent:-9999px;
display:block;
}

#bnr_hokkaido a{
width:230px;
height:64px;
display:block;
background:url("../images/bnr_hokkaido.jpg") left top no-repeat;
}

#bnr_hokkaido a:hover{
filter:alpha(opacity=60);
opacity:0.6;
border:0px;
background:url("../images/bnr_hokkaido.jpg") left top no-repeat;
}

/********************************************************************【サイトマップ】*/

#sitemap{
margin-top:34px;
width:600px;
float:right;
display:inline;
position:relative;
}

#sitemap ul{
list-style-type:none;
font-size:92%;
}

#sitemap h5{
font-size:12px;
line-height:1;
text-indent:-9999px;
}

/**********************************【新着情報】*/

#maptitle_whats{
margin-bottom:5px;
width:600px;
height:29px;
text-indent:-9999px;
background:url("../images/bg_maptitle_whats.gif") no-repeat left top;

}

#btn_map{
margin:0px 0px 5px 337px;
}

#btn_maprss_news{
margin-top:-34px;
width:135px;
height:29px;
text-indent:-9999px;
float:left;
display:block;
background:url("../images/btn_maprss_news.gif") no-repeat left top;
}

#btn_maprss_news a{
width:135px;
height:29px;
text-indent:-9999px;
float:left;
display:block;
background:url("../images/btn_maprss_news.gif") no-repeat left top;
}

#btn_maprss_news a:hover{
background:url("../images/btn_maprss_news_hv.gif") no-repeat left top;
}

#btn_maprss_media{
margin-top:-34px;
width:128px;
height:29px;
text-indent:-9999px;
float:right;
display:block;
background:url("../images/btn_maprss_media.gif") no-repeat left top;
}

#btn_maprss_media a{
width:128px;
height:29px;
text-indent:-9999px;
float:right;
display:block;
background:url("../images/btn_maprss_media.gif") no-repeat left top;
}

#btn_maprss_media a:hover{
background:url("../images/btn_maprss_media_hv.gif") no-repeat left top;
}

#map_whats{
width:600px;
clear:both;
}

#map_whats li,
#map_doukou li,
#map_about li{
margin-left:20px;
list-style-image:url("../images/arrow_sitemap.gif");
}

#map_whats li a:hover,
#map_doukou li a:hover,
#map_about li a:hover{
list-style-image:url("../images/arrow_sitemap_hv.gif");
}

#map_whats li:hover,
#map_doukou li:hover,
#map_about li:hover{
list-style-image:url("../images/arrow_sitemap_hv.gif");
}

/**********************************【札幌支部の動向】*/

#maptitle_doukou{
margin-bottom:5px;
width:290px;
height:29px;
text-indent:-9999px;
background:url("../images/bg_maptitle_doukou.gif") no-repeat left top;
}


#map_doukou{
width:290px;
float:left;
display:inline;
}

#maptitle_about{
margin-bottom:5px;
width:290px;
height:29px;
text-indent:-9999px;
background:url("../images/bg_maptitle_about.gif") no-repeat left top;
}

/**********************************【同友会について】*/

#map_about{
width:290px;
float:right;
display:inline;
position:relative;
}

/********************************************************************【】*/

#copyright{
margin-top:30px;
padding:0.9em 0px;
width:860px;
color:#999999;
text-align:center;
font-size:77%;
line-height:1;
border-top:1px solid #CCCCCC;
clear:both;
}


/********************************************************************【地区会資料請求ボタン】*/

.btn_request{
margin:-35px 0px 0px 20px;
width:140px;
height:101px;
text-indent:-9999px;
background:url("../images/btn_request.jpg") no-repeat left top;
display:block;
}

.btn_request a{
width:140px;
height:101px;
text-indent:-9999px;
background:url("../images/btn_request.jpg") no-repeat left top;
display:block;
}


.btn_request a:hover{
background:url("../images/btn_request_hv.jpg") no-repeat left top;
}


/********************************************************************【汎用PDFボタン】*/

.btn_pdf{
padding:46px 0px 0px 20px;
width:280px;
height:53px;

font-weight:bold;
background:url("../images/btn_pdf.jpg") no-repeat left top;
display:block;
}

.btn_pdf a{
width:280px;
height:53px;
line-height:1.4;
color:#000000;
display:block;
}


.btn_pdf a:hover{
	color:#12a2c1;
}

/*######################################################################################【以上、共通↑】*/


.basic h5{
margin:0.5em 0px 0.3em 0px;
font-size:100%;
}

.basic p{
line-height:1.5;
}

.basic ul,
.basic ol{
margin-left:2em;
}

.basic li{
margin:0.3em 0px;
}

.basic dl{
color:#000000;
}

.basic dt{
margin-left:0.8em;
color:#000000;
}

.basic dd{
margin-left:2em;
}