@charset "UTF-8";
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;
}

fieldset, img {
  border: 0;
}

address, caption, code, em, th {
  font-style: normal;
  font-weight: normal;
}

img {
  vertical-align: bottom;
}

table {
  border-spacing: 0;
  width: 100%;
}

ol, ul {
  list-style: none;
}

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal;
}

caption, th {
  text-align: left;
}

hr {
  display: none;
}

input, textarea {
  font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", sans-serif;
  font-size: 86%;
}

sub {
  vertical-align: middle;
}

/*==============================

body

==============================*/
body {
  font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", sans-serif;
  color: #222;
  font-size: 87.5%;
  line-height: 1.7;
  background: #FBFAEC;
}

/*==============================

link

==============================*/
a {
  color: #6d5100;
  text-decoration: none;
}
a:hover {
  color: #aa7d00;
  text-decoration: underline;
}
a:visited {
  color: #a23c33;
}

/*==============================

header

==============================*/
#header-01 {
  margin-bottom: 35px;
}
#header-01 .header-inner-01 {
  padding-top: 66px;
  margin: 0 auto;
  position: relative;
  width: 960px;
}
#header-01 .header-inner-02 {
  margin-bottom: 11px;
  overflow: hidden;
  *zoom: 1;
}

#logo-01 {
  padding-top: 22px;
  float: left;
}

#utility-01 {
  position: absolute;
  top: 18px;
  font-size: 0;
  overflow: hidden;
  *zoom: 1;
}
#utility-01 li {
  margin-right: 23px;
  float: left;
  _display: inline;
}

#list-voice {
  padding-top: 5px;
  position: absolute;
  right: 150px;
  top: 13px;
  height: 15px;
  font-size: 0;
  background: url(/common/images/bg_border_01.gif) no-repeat right top;
}
#list-voice li {
  margin-right: 17px;
  float: left;
  _display: inline;
}

#fontSizeModule {
  padding: 2px 0 0 0;
  position: absolute;
  right: 0;
  top: 13px;
  height: 21px;
  overflow: hidden;
  *zoom: 1;
}
#fontSizeModule img {
  vertical-align: top;
}
#fontSizeModule dt, #fontSizeModule dd {
  float: left;
  _display: inline;
}
#fontSizeModule dt {
  padding-top: 4px;
}
#fontSizeModule dd {
  margin-right: 3px;
}

#search-01 {
  position: absolute;
  top: 12px;
  right: 0;
  overflow: hidden;
  *zoom: 1;
}
#search-01 input {
  float: left;
}
#search-01 .search-text {
  padding: 2px 2px 2px 28px;
  width: 114px;
  height: 16px;
  background: url(/common/images/bg_search_01.gif);
  border: 0;
}

#gnav-01 {
  float: right;
  overflow: hidden;
  *zoom: 1;
}
#gnav-01 li {
  margin-right: 6px;
  float: left;
}
#gnav-01 li.last {
  margin-right: 0;
}

/*==============================

global navi

==============================*/
#gnav-child-01 {
  position: absolute;
  left: -9999px;
  top: -9999px;
  background: url(/common/images/bg_gnav_01.gif) repeat-x #ebe0b5;
}

#btn-gnav-close-01 {
  padding-top: 18px;
  height: 38px;
  background: url(/common/images/bg_gnav_02.gif) repeat-x bottom;
}
#btn-gnav-close-01 a {
  display: block;
  text-align: center;
}
#btn-gnav-close-01 a:hover img {
  opacity: 0.75;
  filter: alpha(opacity=75);
}
#btn-gnav-close-01 span {
  margin: 0 auto;
  display: block;
  width: 36px;
  height: 38px;
  background: url(/common/images/bg_gnav_04.gif) no-repeat center;
}

.child-container-01 {
  margin: 0 auto;
  position: absolute;
  left: -9999px;
  width: 960px;
  overflow: hidden;
  *zoom: 1;
}
.child-container-01 .ttl {
  float: left;
  width: 239px;
}
.child-container-01 .list {
  padding-top: 30px;
  float: right;
  width: 721px;
  overflow: hidden;
  *zoom: 1;
}
.child-container-01 .list li {
  float: left;
  margin: 0 3px 3px 0;
}
.child-container-01 .list li.last {
  margin: 0 0 3px 0;
}
.child-container-01.child-01 {
  background: url(/common/images/bg_gnav_03.gif) no-repeat 285px 0;
}
.child-container-01.child-01 .ttl {
  padding-top: 40px;
}
.child-container-01.child-02 {
  background: url(/common/images/bg_gnav_03.gif) no-repeat 408px 0;
}
.child-container-01.child-02 .ttl {
  padding-top: 60px;
}
.child-container-01.child-03 {
  background: url(/common/images/bg_gnav_03.gif) no-repeat 526px 0;
}
.child-container-01.child-03 .ttl {
  padding-top: 60px;
}
.child-container-01.child-04 {
  background: url(/common/images/bg_gnav_03.gif) no-repeat 646px 0;
}
.child-container-01.child-04 .ttl {
  padding-top: 55px;
}
.child-container-01.child-05 {
  background: url(/common/images/bg_gnav_03.gif) no-repeat 766px 0;
}
.child-container-01.child-05 .ttl {
  padding-top: 62px;
}

/*==============================

contents container

==============================*/
#cnts-container {
  padding: 54px 0 80px 0;
  background: #FFF;
}

#cnts-inner {
  margin: 0 auto;
  width: 960px;
  overflow: hidden;
  *zoom: 1;
}

#main-contents {
  float: left;
  width: 690px;
}

.column1 #main-contents {
  float: none;
  width: 960px;
}

#sub-contents {
  float: right;
  width: 236px;
}

/*==============================

pagetop

==============================*/
.pagetop {
  background: #f1eccf;
  text-align: center;
}
.pagetop a {
  padding: 29px 0 33px 0;
  display: block;
}
.pagetop:hover img {
  opacity: 0.75;
  filter: alpha(opacity=75);
}

/*==============================

footer

==============================*/
#footer-01 {
  background: #f7e9b1;
}

#footer-01 a {
  color: #000;
  text-decoration: none;
}
#footer-01 a:hover {
  text-decoration: underline;
}

.ftr-container-01 {
  margin: 0 auto;
  padding: 50px 0 45px 170px;
  width: 790px;
  position: relative;
  font-size: 86%;
  overflow: hidden;
  *zoom: 1;
}
.ftr-container-01 .logo-01 {
  position: absolute;
  top: 50px;
  left: 0;
}
.ftr-container-01 .ttl-01 {
  margin-bottom: 20px;
  font-size: 0;
  line-height: 0;
}
.ftr-container-01 .clm-01 {
  float: left;
  width: 194px;
  _display: inline;
}
.ftr-container-01 .clm-02 {
  float: left;
  width: 343px;
  overflow: hidden;
  *zoom: 1;
  _display: inline;
}
.ftr-container-01 .clm-02 ul {
  float: left;
  width: 170px;
}
.ftr-container-01 .clm-03 {
  float: left;
  width: 253px;
  _display: inline;
}

.ftr-container-02 {
  margin: 0 auto;
  padding: 28px 0 33px 0;
  border-top: solid 1px #dfd2a0;
  width: 960px;
  position: relative;
  font-size: 86%;
}

.list-ftr-01 li {
  padding-left: 10px;
  background: url(/common/images/bg_ftr_list_01.gif) no-repeat left 0.6em;
}

#ftr-copyright {
  position: absolute;
  right: 0;
  top: 28px;
}

/*==============================

breadcrumbs

==============================*/
#breadcrumbs-container {
  padding: 3px;
  background: #f1ebcf;
}

#breadcrumbs {
  margin: 0 auto;
  width: 960px;
}

/*==============================

local navi

==============================*/
#lnav-01 {
  margin-bottom: 30px;
  width: 234px;
}

#list-lnav-01 {
  padding-bottom: 4px;
  background: url(/common/images/bg_lnav_btm_01.gif) no-repeat bottom;
}
#list-lnav-01 .item {
  padding-bottom: 1px;
  border-left: solid 1px #ead137;
  border-right: solid 1px #ead137;
  background: url(/common/images/bg_dot_01.gif) repeat-x bottom;
}
#list-lnav-01 .item a {
  padding: 12px 5px 12px 32px;
  display: block;
  display: /inline;
  background: url(/common/images/bg_bullet_01.gif) no-repeat 15px center white;
  width: 195px;
  zoom: 1;
}
#list-lnav-01 .item a:hover {
  background-color: #fdee96;
}
#list-lnav-01 .item a.stay {
  background-color: #fdee96;
}
#list-lnav-01 .item.last {
  padding-bottom: 0;
  background-image: none;
}
#list-lnav-01 .item .btn {
  font-size: 117%;
}
#list-lnav-01.last {
  background: url(/common/images/bg_lnav_btm_01_s.gif) no-repeat bottom;
}
#list-lnav-01 .list-child {
  zoom: 1;
  display: none;
}
#list-lnav-01 .list-child li {
  padding-bottom: 1px;
  background: url(/common/images/bg_lnav_01.gif) no-repeat bottom #f8f8f4;
}
#list-lnav-01 .list-child li.last {
  padding-bottom: none;
  background-image: none;
}
#list-lnav-01 .list-child a {
  padding: 12px 5px 12px 32px;
  display: block;
  display: /inline;
  width: 195px;
  background-image: none;
  background-color: #f8f8f4;
}
#list-lnav-01 .list-child a:hover {
  background-color: #fdee96;
}
#list-lnav-01 .list-child .btn {
  font-size: 100%;
}
#list-lnav-01 .open .list-child {
  display: block;
}
#list-lnav-01.last {
  background: url(/common/images/bg_lnav_btm_01_s.gif) no-repeat bottom;
}

/*==============================

sub box

==============================*/
/*	.box-sub-01	*/
.box-sub-01 {
  margin-bottom: 25px;
}
.box-sub-01 .inner-01 {
  border-top: solid 1px #dddcd1;
  border-bottom: solid 1px #dddcd1;
  padding: 15px 18px;
}

/*	.box-sub-02	*/
.box-sub-02 {
  margin-bottom: 25px;
}
.box-sub-02 .inner-01 {
  padding: 13px 20px 18px 20px;
  background: url(/common/images/bg_box_sub_01.gif) no-repeat bottom #f6f3d7;
}
.box-sub-02 a {
  color: #333;
}
.box-sub-02 a:hover {
  color: #333;
}

/*==============================

log container

==============================*/
.log-container-01 iframe {
  position: absolute;
}

/*==============================

viewSP

==============================*/
#viewSP {
  margin: 0 auto;
  width: 960px;
}

/*==============================

voice container

==============================*/
#voice-inner {
  overflow: hidden;
  *zoom: 1;
  position: relative;
  margin: 0 auto;
  width: 960px;
}

#xp1 {
  display: none;
}

#xp1.rsbtn {
  display: block;
  float: right;
  height: 50px;
}

#voice-info {
  position: absolute;
  top: 5px;
  right: 250px;
  font-size: 0;
}

/*==============================

viewSP

==============================*/
#viewSP {
  margin: 0 auto;
  width: 960px;
}

/*
#hdg-l1-01 見出しH1

```
<h1 class="hdg-l1-01"><img src="/_element/images/hdg_h1_01.gif" width="690" height="112" alt="見出し1"></h1>
```
*/
.hdg-l1-01 {
  margin-bottom: 74px;
}

/*
#hdg-l2-01 見出しH2

```
<h2 class="hdg-l2-01">見出し2 H2</h2>
```
*/
.hdg-l2-01 {
  margin: 63px 0 18px 0;
  padding: 0 0 2px 18px;
  border-bottom: 2px solid #2d8f7b;
  background: url(/common/images/bg_hdg_l2_01.gif) no-repeat 2px 0.4em;
  font-size: 170%;
  font-weight: bold;
}

/*
#hdg-l3-01 見出しH3

##hdg-l3-01-container
width:690px;

##hdg-l3-02-container
width:330px;

##hdg-l3-03-container
width:214px;

```
<div class="hdg-l3-01-container">
<div class="hdg-l3-01-inner">
<h3 class="hdg-l3-01">見出し3 H3</h3>
<!-- /hdg-l3-01-inner --></div>
<!-- /hdg-l3-01-container --></div>

<div class="hdg-l3-01-container">
<div class="hdg-l3-01-inner">
<h3 class="hdg-l3-01"><a href="#">見出し3 H3<span class="ico-01"><img src="/common/images/ico_window_02.gif" width="9" height="8" alt="新しいウインドウで開きます"></span></a></h3>
<!-- /hdg-l3-01-inner --></div>
<!-- /hdg-l3-01-container --></div>

<div class="hdg-l3-02-container">
<div class="hdg-l3-02-inner">
<h3 class="hdg-l3-01">見出し3 H3</h3>
<!-- /hdg-l3-02-inner --></div>
<!-- /hdg-l3-02-container --></div>

<div class="hdg-l3-03-container">
<div class="hdg-l3-03-inner">
<h3 class="hdg-l3-01">見出し3 H3</h3>
<!-- /hdg-l3-03-inner --></div>
<!-- /hdg-l3-03-container --></div>
```
*/
.hdg-l3-01 {
  padding: 5px 9px;
  border-left: solid 2px #88c1ae;
  border-right: solid 2px #88c1ae;
  background: #eef6ef;
  font-size: 134%;
  font-weight: bold;
  zoom: 1;
}
.hdg-l3-01 a {
  display: block;
  padding-left: 18px;
  color: #222;
  background: url(/common/images/bg_bullet_02.gif) no-repeat left 0.5em;
}
.hdg-l3-01 a:hover {
  color: #1b705c;
}

.hdg-l3-01-container {
  margin: 48px 0 18px 0;
  padding-top: 4px;
  width: 690px;
  background: url(/common/images/bg_hdg_l3_01_top.gif) no-repeat top;
  zoom: 1;
}

.hdg-l3-01-inner {
  padding-bottom: 4px;
  width: 690px;
  background: url(/common/images/bg_hdg_l3_01_btm.gif) no-repeat bottom;
  zoom: 1;
}

.hdg-l3-02-container {
  margin: 48px 0 18px 0;
  padding-top: 4px;
  width: 330px;
  background: url(/common/images/bg_hdg_l3_02_top.gif) no-repeat top;
  zoom: 1;
}

.hdg-l3-02-inner {
  padding-bottom: 4px;
  width: 330px;
  background: url(/common/images/bg_hdg_l3_02_btm.gif) no-repeat bottom;
  zoom: 1;
}

.hdg-l3-03-container {
  margin: 48px 0 18px 0;
  padding-top: 4px;
  width: 214px;
  background: url(/common/images/bg_hdg_l3_03_top.gif) no-repeat top;
  zoom: 1;
}

.hdg-l3-03-inner {
  padding-bottom: 4px;
  width: 214px;
  background: url(/common/images/bg_hdg_l3_03_btm.gif) no-repeat bottom;
  zoom: 1;
}

.hdg-l3-04-container {
  margin: 48px 0 18px 0;
  padding-top: 4px;
  width: 960px;
  background: url(/common/images/bg_hdg_l3_04_top.gif) no-repeat top;
  zoom: 1;
}

.hdg-l3-04-inner {
  padding-bottom: 4px;
  width: 960px;
  background: url(/common/images/bg_hdg_l3_04_btm.gif) no-repeat bottom;
  zoom: 1;
}

.hdg-l3-05-container {
  margin: 48px 0 18px 0;
  padding-top: 4px;
  width: 462px;
  background: url(/common/images/bg_hdg_l3_05_top.gif) no-repeat top;
  zoom: 1;
}

.hdg-l3-05-inner {
  padding-bottom: 4px;
  width: 462px;
  background: url(/common/images/bg_hdg_l3_05_btm.gif) no-repeat bottom;
  zoom: 1;
}

/*
#hdg-l3-02 見出しH3
表組みの見出しなどで使用します
```
<h3 class="hdg-l3-02">テキストテキストテキスト</h3>

```
*/
.hdg-l3-02 {
  margin: 20px 0 10px 0;
  color: #1c715d;
  font-weight: bold;
  font-size: 114%;
}

/*
#hdg-l4-01 見出しH4

##hdg-l4-01-container
width:690px;

##hdg-l4-02-container
width:330px;

##hdg-l4-03-container
width:214px;

```
<div class="hdg-l4-01-container">
<div class="hdg-l4-01-inner">
<h4 class="hdg-l4-01">見出し4 h4</h4>
<!-- /hdg-l4-01-inner --></div>
<!-- /hdg-l4-01-container --></div>

<div class="hdg-l4-01-container">
<div class="hdg-l4-01-inner">
<h4 class="hdg-l4-01"><a href="#">見出し4 h4<span class="ico-01"><img src="/common/images/ico_window_02.gif" width="9" height="8" alt="新しいウインドウで開きます"></span></a></h4>
<!-- /hdg-l4-01-inner --></div>
<!-- /hdg-l4-01-container --></div>

<div class="hdg-l4-02-container">
<div class="hdg-l4-02-inner">
<h4 class="hdg-l4-01">見出し4 h4</h4>
<!-- /hdg-l4-02-inner --></div>
<!-- /hdg-l4-02-container --></div>

<div class="hdg-l4-03-container">
<div class="hdg-l4-03-inner">
<h4 class="hdg-l4-01">見出し4 h4</h4>
<!-- /hdg-l4-03-inner --></div>
<!-- /hdg-l4-03-container --></div>
```
*/
.hdg-l4-01 {
  padding: 5px 10px;
  background: #d2e6d4;
  font-size: 117%;
  font-weight: bold;
  zoom: 1;
}
.hdg-l4-01 a {
  display: block;
  padding-left: 18px;
  color: #222;
  background: url(/common/images/bg_bullet_02.gif) no-repeat left 0.4em;
}
.hdg-l4-01 a:hover {
  color: #1b705c;
}

.hdg-l4-01-container {
  margin: 48px 0 8px 0;
  padding-top: 4px;
  width: 690px;
  background: url(/common/images/bg_hdg_l4_01_top.gif) no-repeat top;
  zoom: 1;
}

.hdg-l4-01-inner {
  padding-bottom: 4px;
  width: 690px;
  background: url(/common/images/bg_hdg_l4_01_btm.gif) no-repeat bottom;
  zoom: 1;
}

.hdg-l4-02-container {
  margin: 48px 0 8px 0;
  padding-top: 4px;
  width: 330px;
  background: url(/common/images/bg_hdg_l4_02_top.gif) no-repeat top;
  zoom: 1;
}

.hdg-l4-02-inner {
  padding-bottom: 4px;
  width: 330px;
  background: url(/common/images/bg_hdg_l4_02_btm.gif) no-repeat bottom;
  zoom: 1;
}

.hdg-l4-03-container {
  margin: 48px 0 8px 0;
  padding-top: 4px;
  width: 214px;
  background: url(/common/images/bg_hdg_l4_03_top.gif) no-repeat top;
  zoom: 1;
}

.hdg-l4-03-inner {
  padding-bottom: 4px;
  width: 214px;
  background: url(/common/images/bg_hdg_l4_03_btm.gif) no-repeat bottom;
  zoom: 1;
}

/*
#hdg-l5-01 見出しH5

```
<h5 class="hdg-l5-01">見出し5 h5</h5>
<h5 class="hdg-l5-01"><a href="#">見出し5 h5<span class="ico-01"><img src="/common/images/ico_window_02.gif" width="9" height="8" alt="新しいウインドウで開きます"></span></a></h5>
```
*/
.hdg-l5-01 {
  margin: 48px 0 13px;
  padding-bottom: 6px;
  border-bottom: solid 1px #4ea998;
  font-size: 117%;
  font-weight: bold;
}
.hdg-l5-01 a {
  display: block;
  padding-left: 18px;
  color: #222;
  background: url(/common/images/bg_bullet_02.gif) no-repeat left 0.4em;
}
.hdg-l5-01 a:hover {
  color: #1b705c;
}

/*
#テキスト

```
<p class="mgb15">テキスト基本サイズ12px</p>
<p class="mgb15"><em>強調テキスト</em></p>
<p class="mgb15"><strong>さらに強い強調テキスト</strong></p>
<p class="mgb15 txt-l-01">タイトルテキスト14px</p>
<p class="txt-s-01">サブテキストサイズ10px</p>
```
*/
em {
  font-weight: bold;
}

strong {
  color: #e32f47;
  font-weight: bold;
}

.txt-l-01 {
  font-size: 117%;
}

.txt-s-01 {
  font-size: 86%;
}

/*
#キャプションテキスト

```
<p class="mgb10 ta-c"><img src="/_element/images/img_dummy_01.gif" alt="" width="330" height="150"></p>
<p class="txt-s-01 ta-c mgb30">キャプションキャプションキャプションキャプション</p>
<p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>

```
*/
/*
#list-u-01 順不同リスト

```
<ul class="list-u-01">
<li>テキストテキストテキストテキストテキストテキストテキスト</li>
<li>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</li>
<li>テキストテキストテキストテキストテキストテキストテキストテキストテキスト</li>
</ul>

```
*/
.list-u-01 li {
  margin-bottom: 15px;
  padding-left: 16px;
  background: url(/common/images/bg_bullet_04.gif) no-repeat left 0.6em;
}

/*
#list-o-01 順序リスト

```
<ul class="list-o-01">
<li><span class="mark">1.</span>テキストテキストテキストテキストテキストテキストテキスト
<ul class="list-o-02">
<li><span class="mark">(1)</span>テキストテキストテキストテキストテキストテキストテキスト</li>
<li><span class="mark">(2)</span>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</li>
<li><span class="mark">(3)</span>テキストテキストテキストテキストテキストテキストテキストテキストテキスト</li>
</ul>
</li>
<li><span class="mark">2.</span>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</li>
<li><span class="mark">3.</span>テキストテキストテキストテキストテキストテキストテキストテキストテキスト</li>
</ul>

```
*/
.list-o-01 li {
  margin-bottom: 15px;
  position: relative;
  padding-left: 17px;
  zoom: 1;
}
.list-o-01 .mark {
  position: absolute;
  left: 0;
  top: 0;
}

.list-o-01 .list-o-02 {
  margin-top: 15px;
}

.list-o-02 li {
  margin-bottom: 15px;
  position: relative;
  padding-left: 25px;
  zoom: 1;
}
.list-o-02 .mark {
  position: absolute;
  left: 0;
  top: 0;
}

/*
#list-link-01 アイコン付きリンクリスト

```
<ul class="list-link-01">
<li><a href="#">テキストテキストテキストテキストテキストテキストテキスト</a></li>
<li><a href="#">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</a></li>
<li><a href="#">テキストテキストテキストテキストテキストテキストテキストテキストテキスト</a></li>
</ul>

```
*/
.list-link-01 li {
  margin-bottom: 15px;
  padding-left: 16px;
  background: url(/common/images/bg_bullet_01.gif) no-repeat left 0.4em;
}

/*
#list-link-02 アイコン無しリンクリスト
主にPDFリストに使用します。
```
<ul class="list-link-02">
<li><a href="#"><span class="ico-02"><img src="/common/images/ico_pdf_01.gif" width="14" height="15" alt="PDFファイルを開きます"></span>テキストテキストテキストテキストテキストテキスト [PDF：97.13 KB]</a></li>
<li><a href="#"><span class="ico-02"><img src="/common/images/ico_pdf_01.gif" width="14" height="15" alt="PDFファイルを開きます"></span>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト [PDF：97.13 KB]</a></li>
<li><a href="#"><span class="ico-02"><img src="/common/images/ico_pdf_01.gif" width="14" height="15" alt="PDFファイルを開きます"></span>テキストテキストテキストテキストテキスト [PDF：97.13 KB]</a></li>
</ul>
```
*/
.list-link-02 li {
  margin-bottom: 15px;
}

/*
#list-link-03 アイコン付きリンクリスト
角丸ボックス中で使用します。

```
<ul class="list-link-03">
<li><a href="#">テキストテキストテキストテキストテキストテキストテキスト</a></li>
<li><a href="#">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</a></li>
<li><a href="#">テキストテキストテキストテキストテキストテキストテキストテキストテキスト</a></li>
</ul>

```
*/
.list-link-03 li {
  margin-bottom: 5px;
  padding-left: 16px;
  background: url(/common/images/bg_bullet_05.gif) no-repeat left 0.5em;
}

/*
#list-link-04 回遊リンク用リンクリスト

```
<ul class="list-link-04">
<li><a href="#" class="anchor">テキストテキスト</a></li>
<li><a href="#" class="anchor">テキストテキストテキスト</a></li>
<li><a href="#" class="anchor">テキスト</a></li>
<li><a href="#" class="anchor">テキストテキストテキスト</a></li>
<li><a href="#" class="anchor">テキストテキストテキスト</a></li>
<li><a href="#" class="anchor">テキストテキストテキストテキストテキスト</a></li>
</ul>

```
*/
.list-link-04 {
  overflow: hidden;
  *zoom: 1;
}
.list-link-04 li {
  float: left;
  padding: 0 20px 0 16px;
  background: url(/common/images/bg_bullet_01.gif) no-repeat left 0.4em;
  white-space: nowrap;
  zoom: normal;
}

/*
#list-anc-01 アンカーリスト

```
<ul class="list-anc-01 set-height-g2-01">
<li><a href="#header-01" class="anchor">アンカーリンクアンカーリンク</a></li>
<li><a href="#header-01" class="anchor">アンカーリンクアンカーリンクアンカーリンク</a></li>
<li><a href="#header-01" class="anchor">アンカーリンクアンカーリンクアンカーリンク</a></li>
<li><a href="#header-01" class="anchor">アンカーリンクアンカーリンク</a></li>
<li><a href="#header-01" class="anchor">アンカーリンクアンカーリンクアンカーリンク</a></li>
<li><a href="#header-01" class="anchor">アンカーリンクアンカーリンクアンカーリンク</a></li>
</ul>

```
*/
.list-anc-01 {
  overflow: hidden;
  *zoom: 1;
}
.list-anc-01 li {
  margin-bottom: 10px;
  padding-left: 16px;
  float: left;
  width: 314px;
  background: url(/common/images/bg_bullet_03.gif) no-repeat left 0.2em;
}
.list-anc-01 li.even {
  padding-right: 30px;
}

/*
#list-anc-02 アンカーリスト

```
<ul class="list-anc-02">
<li><a href="#header-01" class="anchor">アンカーリンクアンカーリンク</a></li>
<li><a href="#header-01" class="anchor">アンカーリンクアンカーリンクアンカーリンク</a></li>
<li><a href="#header-01" class="anchor">アンカーリンクアンカーリンクアンカーリンク</a></li>
<li><a href="#header-01" class="anchor">アンカーリンクアンカーリンク</a></li>
<li><a href="#header-01" class="anchor">アンカーリンクアンカーリンクアンカーリンク</a></li>
<li><a href="#header-01" class="anchor">アンカーリンクアンカーリンクアンカーリンク</a></li>
</ul>

```
*/
.list-anc-02 {
  overflow: hidden;
  *zoom: 1;
}
.list-anc-02 li {
  float: left;
  padding: 0 20px 0 16px;
  background: url(/common/images/bg_bullet_03.gif) no-repeat left 0.2em;
  white-space: nowrap;
  zoom: normal;
}

/*
#注釈リスト
##list-notice-01
フォントサイズ12px
##list-notice-02
フォントサイズ10px
##list-notice-02
数字付き注釈リストフォントサイズ10px
```
<ul class="list-notice-01">
<li><span class="mark">※</span>注釈テキスト注釈テキスト注釈テキスト注釈テキスト注釈テキスト注釈テキスト注釈テキスト</li>
<li><span class="mark">※</span>注釈テキスト注釈テキスト注釈テキスト注釈テキスト</li>
</ul>

<ul class="list-notice-02">
<li><span class="mark">※</span>注釈テキスト注釈テキスト注釈テキスト注釈テキスト注釈テキスト注釈テキスト注釈テキスト</li>
<li><span class="mark">※</span>注釈テキスト注釈テキスト注釈テキスト注釈テキスト注釈テキスト</li>
</ul>

<ul class="list-notice-03">
<li><span class="mark">※1</span>注釈テキスト注釈テキスト注釈テキスト注釈テキスト注釈テキスト注釈テキスト注釈テキスト</li>
<li><span class="mark">※2</span>注釈テキスト注釈テキスト注釈テキスト注釈テキスト注釈テキスト</li>
</ul>
```
*/
.list-notice-01 li {
  margin-bottom: 5px;
  position: relative;
  padding-left: 1.5em;
  zoom: 1;
}
.list-notice-01 .mark {
  position: absolute;
  left: 0;
  top: 0;
}

.list-notice-02 {
  font-size: 86%;
}
.list-notice-02 li {
  margin-bottom: 5px;
  position: relative;
  padding-left: 1.5em;
  zoom: 1;
}
.list-notice-02 .mark {
  position: absolute;
  left: 0;
  top: 0;
}

.list-notice-03 {
  font-size: 86%;
}
.list-notice-03 li {
  margin-bottom: 5px;
  position: relative;
  padding-left: 2em;
  zoom: 1;
}
.list-notice-03 .mark {
  position: absolute;
  left: 0;
  top: 0;
}

/*
#list-border-01 ボーダー付きリスト
list-border-01を利用したポイント実装例になります。

```
<!-- ignore --><div class="w690">

<ul class="list-border-01 mgb30">
<li class="item lyt-clm-01">
<div class="clm-01 w120">
<h3><img src="/common/images/img_point_01.gif" alt="POINT1" width="96" height="30"></h3>
<!-- /clm-01 --></div>
<div class="clm-02 w570">
<p class="txt-l-01 mgb15"><em>さまざまな住宅プランからお選びいただけます</em></p>
<p>新築・増改築、建売住宅やマンションの購入など、JAの住宅ローンは、さまざまなお客さまのマイホームプランにお役立ていただけます。</p>
<!-- /clm-02 --></div>
</li>
<li class="item lyt-clm-01">
<div class="clm-01 w120">
<h3><img src="/common/images/img_point_02.gif" alt="POINT2" width="96" height="30"></h3>
<!-- /clm-01 --></div>
<div class="clm-02 w570">
<p class="txt-l-01 mgb15"><em>無理のない返済でゆとりある計画を</em></p>
<p>JAの住宅ローンは、返済方法・融資額・融資期間等を選択できます。<br>
お客さまのライフプランにあわせて、無理のない返済計画をご提案いたします。</p>
<!-- /clm-02 --></div>
</li>
<li class="item lyt-clm-01">
<div class="clm-01 w120">
<h3><img src="/common/images/img_point_03.gif" alt="POINT3" width="96" height="30"></h3>
<!-- /clm-01 --></div>
<div class="clm-02 w570">
<p class="txt-l-01 mgb15"><em>リフォームだっておまかせください</em></p>
<p class="mgb15">リフォームにもJAのローンをお役立ていただけます。増改築や間取りの変更から、インテリアや外装の工事など幅広くご利用になれます。</p>
<ul class="list-link-01">
<li class="mgb00"><a href="#">リフォームローン</a></li>
</ul>
<!-- /clm-02 --></div>
</li>
</ul>
<!-- ignore --></div>
```
*/
.list-border-01 .item {
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: solid 1px #e0e0e0;
}

/*
#list-q-01 質問一覧リスト

```
<ul class="list-q-01">
<li><a href="#">よくあるご質問よくあるご質問よくあるご質問</a></li>
<li><a href="#">よくあるご質問よくあるご質問よくあるご質問</a></li>
<li><a href="#">よくあるご質問よくあるご質問よくあるご質問よくあるご質問よくあるご質問よくあるご質問よくあるご質問よくあるご質問よくあるご質問</a></li>
</ul>
```
*/
.list-q-01 li {
  margin-bottom: 20px;
  border-bottom: solid 1px #dfdfdf;
  padding: 0 0 10px 30px;
  background: url(/common/images/bg_q_01.gif) no-repeat left top;
}

/*
#list-qa-01 質問と回答リスト

```
<dl class="list-qa-01">
<dt class="question">よくあるご質問よくあるご質問よくあるご質問</dt>
<dd class="answer"><p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p></dd>
<dt class="question">よくあるご質問よくあるご質問よくあるご質問</dt>
<dd class="answer"><p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p></dd>
</dl>
```
*/
.list-qa-01 .question {
  margin-bottom: 18px;
  border-bottom: solid 1px #dfdfdf;
  padding: 0 0 10px 30px;
  background: url(/common/images/bg_q_01.gif) no-repeat left top;
}
.list-qa-01 .answer {
  margin-bottom: 45px;
  padding-left: 30px;
  background: url(/common/images/bg_a_01.gif) no-repeat left top;
}

/*
#list-info-01 更新履歴などの一覧表示用リスト

```
<ul class="list-info-01">
<li class="item">
<p class="date">2013年01月31日</p><p class="category"><img src="/common/images/ico_update_01.gif" alt="サイト更新" width="74" height="16"></p>
<ul class="list-link-01">
<li><a href="#">福島県内JAとしての防災集団移転促進事業にかかる対応方向について</a></li>
</ul>
</li>
<li class="item">
<p class="date">2013年01月31日</p><p class="category"><img src="/common/images/ico_attention_01.gif" alt="ご注意ください" width="74" height="16"></p>
<ul class="list-link-01">
<li><a href="#">クレジットカードのショッピング枠の現金化に関する広告等について（ご注意のお願い）</a></li>
</ul>
</li>
</ul>
```
*/
.list-info-01 .item {
  padding: 20px 0 5px 0;
  border-bottom: solid 1px #dddcd1;
}
.list-info-01 .item.last {
  border-bottom: none;
}
.list-info-01 .date {
  padding-right: 20px;
  display: inline;
}
.list-info-01 .category {
  display: inline;
  line-height: 1;
}
.list-info-01 .category img {
  vertical-align: middle;
}
.list-info-01 .list-link-01 {
  margin-top: 10px;
}

/*
#list-btn-01 ボタン用リスト

```
<ul class="list-btn-01">
<li><a href="#"><img src="/images/banner/banner_01.jpg" class="over01" alt="ローン相談会" width="217" height="92"></a></li>
<li><a href="#"><img src="/images/banner/banner_02.jpg" class="over01" alt="ちょきんぎょコーナー" width="217" height="92"></a></li>
<li><a href="#"><img src="/images/banner/banner_03.jpg" class="over01" alt="TVCMギャラリー" width="217" height="92"></a></li>
<li><a href="#"><img src="/images/banner/banner_04.jpg" class="over01" alt="JAネットマイカーローン" width="217" height="92"></a></li>
<li><a href="#"><img src="/images/banner/banner_03.jpg" class="over01" alt="TVCMギャラリー" width="217" height="92"></a></li>
</ul>
```
*/
.list-btn-01 li {
  margin-bottom: 10px;
}

/*
#list-img-01 画像の横並びリスト

```
<ul class="list-img-01">
<li><img src="/_element/images/img_dummy_01.gif" alt="" width="100" height="80"></li>
<li><img src="/_element/images/img_dummy_01.gif" alt="" width="100" height="80"></li>
<li><img src="/_element/images/img_dummy_01.gif" alt="" width="100" height="80"></li>
<li><img src="/_element/images/img_dummy_01.gif" alt="" width="100" height="80"></li>
</ul>
```
*/
.list-img-01 li {
  padding: 0 4px;
  display: inline-block;
  *display: inline;
  *zoom: 1;
}
.list-img-01 p {
  display: inline;
}

/*
#list-btn-01 タブリスト
ステイ表示は画像拡張子前に<strong>_s</strong>を記述してください。<br>
またimgから<strong>.over02</strong>を削除してください。

```
<nav class="tab-01">
<ul class="list-tab-01">
<li><a href="/loan/nougyo/"><img src="/loan/nougyo/common/images/btn_tab_01_s.gif" alt="JAの農業融資" width="110" height="70"></a></li>
<li><a href="/loan/nougyo/ninaite/"><img src="/loan/nougyo/common/images/btn_tab_02.gif" alt="農業金融強化について" width="110" height="70" class="over02"></a></li>
<li><a href="/loan/nougyo/ichiran/"><img src="/loan/nougyo/common/images/btn_tab_03.gif" alt="農業関係資金一覧" width="110" height="70" class="over02"></a></li>
<li><a href="/loan/nougyo/kindaika/"><img src="/loan/nougyo/common/images/btn_tab_04.gif" alt="農業近代化資金" width="110" height="70" class="over02"></a></li>
<li><a href="/loan/nougyo/sinkou/"><img src="/loan/nougyo/common/images/btn_tab_05.gif" alt="新農業振興資金（アグリマイティー資金）" width="110" height="70" class="over02"></a></li>
<li class="last"><a href="/loan/nougyo/houseloan/"><img src="/loan/nougyo/common/images/btn_tab_06.gif" alt="JA農機ハウスローン" width="110" height="70" class="over02"></a></li>
</ul>
</nav>
```
*/
.tab-01 {
  padding: 9px 0 0 8px;
  width: 682px;
  height: 77px;
  background: url(/common/images/bg_tab_01.gif) no-repeat;
}

.list-tab-01 {
  overflow: hidden;
  *zoom: 1;
}
.list-tab-01 li {
  margin-right: 3px;
  _display: inline;
  float: left;
}
.list-tab-01 li.last {
  margin-right: 0;
}

/*
#lyt-2clm-01 2カラムレイアウト

```
<div class="lyt-2clm-01">
<div class="clm-01">
<div class="hdg-l3-02-container">
<div class="hdg-l3-02-inner">
<h3 class="hdg-l3-01">見出し3 H3</h3>
<!-- /hdg-l3-02-inner --></div>
<!-- /hdg-l3-02-container --></div>
<!-- /clm-01 --></div>
<div class="clm-02">
<div class="hdg-l3-02-container">
<div class="hdg-l3-02-inner">
<h3 class="hdg-l3-01">見出し3 H3</h3>
<!-- /hdg-l3-02-inner --></div>
<!-- /hdg-l3-02-container --></div>
<!-- /clm-02 --></div>
<!-- /lyt-2clm-01 --></div>

```
*/
.lyt-2clm-01 {
  width: 690px;
  overflow: hidden;
  *zoom: 1;
}
.lyt-2clm-01 .clm-01 {
  float: left;
  width: 330px;
}
.lyt-2clm-01 .clm-02 {
  float: right;
  width: 330px;
}

.column1 .lyt-2clm-01 {
  width: 960px;
  overflow: hidden;
  *zoom: 1;
}
.column1 .lyt-2clm-01 .clm-01 {
  float: left;
  width: 462px;
}
.column1 .lyt-2clm-01 .clm-02 {
  float: right;
  width: 462px;
}

/*
#lyt-3clm-01 3カラムレイアウト

```
<div class="lyt-3clm-01">
<div class="clm-01">
<div class="hdg-l3-03-container">
<div class="hdg-l3-03-inner">
<h3 class="hdg-l3-01">見出し3 H3</h3>
<!-- /hdg-l3-03-inner --></div>
<!-- /hdg-l3-03-container --></div>
<!-- /clm-01 --></div>
<div class="clm-02">
<div class="hdg-l3-03-container">
<div class="hdg-l3-03-inner">
<h3 class="hdg-l3-01">見出し3 H3</h3>
<!-- /hdg-l3-03-inner --></div>
<!-- /hdg-l3-03-container --></div>
<!-- /clm-02 --></div>
<div class="clm-03">
<div class="hdg-l3-03-container">
<div class="hdg-l3-03-inner">
<h3 class="hdg-l3-01">見出し3 H3</h3>
<!-- /hdg-l3-03-inner --></div>
<!-- /hdg-l3-03-container --></div>
<!-- /clm-03 --></div>
<!-- /lyt-3clm-01 --></div>

```
*/
.lyt-3clm-01 {
  width: 690px;
  overflow: hidden;
  *zoom: 1;
}
.lyt-3clm-01 .clm-01, .lyt-3clm-01 .clm-02 {
  margin-right: 24px;
  float: left;
  width: 214px;
  _display: inline;
}
.lyt-3clm-01 .clm-03 {
  float: left;
  width: 214px;
  _display: inline;
}

/*
#lyt-4clm-01 4カラムレイアウト

```
<div class="lyt-4clm-01">
<div class="clm-01">
<div class="cnts-box-06-container">
<div class="cnts-box-06-inner">
<div class="cnts-box-06 set-height-4clm-01">
<p class="mgb15">テキストテキストテキストテキストテキストテキスト</p>
<p>テキストテキストテキストテキストテキストテキスト</p>
<!-- /cnts-box-06 --></div>
<!-- /cnts-box-06-inner --></div>
<!-- /cnts-box-06-container --></div>
<!-- /clm-01 --></div>
<div class="clm-02">
<div class="cnts-box-06-container">
<div class="cnts-box-06-inner">
<div class="cnts-box-06 set-height-4clm-01">
<p class="mgb15">テキストテキストテキストテキストテキストテキスト</p>
<p class="mgb15">テキストテキストテキストテキストテキストテキスト</p>
<p>テキストテキストテキストテキストテキストテキスト</p>
<!-- /cnts-box-06 --></div>
<!-- /cnts-box-06-inner --></div>
<!-- /cnts-box-06-container --></div>
<!-- /clm-02 --></div>
<div class="clm-03">
<div class="cnts-box-06-container">
<div class="cnts-box-06-inner">
<div class="cnts-box-06 set-height-4clm-01">
<p class="mgb15">テキストテキストテキストテキストテキストテキスト</p>
<p class="mgb15">テキストテキストテキストテキストテキストテキスト</p>
<p class="mgb15">テキストテキストテキストテキストテキストテキスト</p>
<p>テキストテキストテキストテキストテキストテキスト</p>
<!-- /cnts-box-06 --></div>
<!-- /cnts-box-06-inner --></div>
<!-- /cnts-box-06-container --></div>
<!-- /clm-03 --></div>
<div class="clm-04">
<div class="cnts-box-06-container">
<div class="cnts-box-06-inner">
<div class="cnts-box-06 set-height-4clm-01">
<p class="mgb15">テキストテキストテキストテキストテキストテキスト</p>
<p class="mgb15">テキストテキストテキストテキストテキストテキスト</p>
<p class="mgb15">テキストテキストテキストテキストテキストテキスト</p>
<p class="mgb15">テキストテキストテキストテキストテキストテキスト</p>
<p>テキストテキストテキストテキストテキストテキスト</p>
<!-- /cnts-box-06 --></div>
<!-- /cnts-box-06-inner --></div>
<!-- /cnts-box-06-container --></div>
<!-- /clm-04 --></div>
<!-- /lyt-4clm-01 --></div>

```
*/
.lyt-4clm-01 {
  width: 690px;
  overflow: hidden;
  *zoom: 1;
}
.lyt-4clm-01 .clm-01, .lyt-4clm-01 .clm-02, .lyt-4clm-01 .clm-03 {
  margin-right: 4px;
  float: left;
  width: 169px;
  _display: inline;
}
.lyt-4clm-01 .clm-04 {
  float: left;
  width: 169px;
  _display: inline;
}

/*
#lyt-clm-01 カラムレイアウトパターン
.clm-01にfloat:left、.clm-02にfloat:rightが指定されています。<br>
それぞれのカラムにwidth調整用のclassを付与しレイアウトしてください。

```

<!-- ignore --><div class="w690">

<div class="lyt-clm-01">
<div class="clm-01 w175">
<p>width:175px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="175" height="50"></p>
<!-- /clm-01 --></div>
<div class="clm-02 w515">
<p>width:515px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="515" height="50"></p>
<!-- /clm-02 --></div>
<!-- /lyt-clm-01 --></div>

<!-- ignore --></div>

```
*/
.lyt-clm-01 {
  margin: 0 auto;
  width: 100%;
  overflow: hidden;
  *zoom: 1;
}
.lyt-clm-01 .clm-01 {
  float: left;
}
.lyt-clm-01 .clm-02 {
  float: right;
}

/*
#box
##cnts-box-01
グレー罫通常ボックス
##cnts-box-02
エラー表示用ボックス
##cnts-box-03
PDFダウンロード用ボックス
##cnts-box-04
強調表示用ボックス
##cnts-box-05
強調表示用ボックス

```
<div class="cnts-box-01-container">
<div class="cnts-box-01-inner">
<div class="cnts-box-01">
<p>テキストテキストテキストテキストテキストテキスト</p>
<!-- /cnts-box-01 --></div>
<!-- /cnts-box-01-inner --></div>
<!-- /cnts-box-01-container --></div>

<!-- ignore --><br>
<!-- ignore --><br>

<div class="cnts-box-02-container">
<div class="cnts-box-02-inner">
<div class="cnts-box-02">
<p><strong>テキストテキストテキストテキストテキストテキスト</strong></p>
<!-- /cnts-box-02 --></div>
<!-- /cnts-box-02-inner --></div>
<!-- /cnts-box-02-container --></div>

<!-- ignore --><br>
<!-- ignore --><br>

<div class="cnts-box-03-container">
<div class="cnts-box-03-inner">
<div class="cnts-box-03">
<p>テキストテキストテキストテキストテキストテキスト</p>
<!-- /cnts-box-03 --></div>
<!-- /cnts-box-03-inner --></div>
<!-- /cnts-box-03-container --></div>

<!-- ignore --><br>
<!-- ignore --><br>

<div class="cnts-box-04-container">
<div class="cnts-box-04-inner">
<div class="cnts-box-04">
<p>テキストテキストテキストテキストテキストテキスト</p>
<!-- /cnts-box-04 --></div>
<!-- /cnts-box-04-inner --></div>
<!-- /cnts-box-04-container --></div>

<!-- ignore --><br>
<!-- ignore --><br>

<div class="cnts-box-05-container">
<div class="cnts-box-05-inner">
<div class="cnts-box-05">
<p>テキストテキストテキストテキストテキストテキスト</p>
<!-- /cnts-box-05 --></div>
<!-- /cnts-box-05-inner --></div>
<!-- /cnts-box-05-container --></div>

<div class="cnts-box-06-container">
<div class="cnts-box-06-inner">
<div class="cnts-box-06">
<p>テキストテキストテキストテキストテキストテキスト</p>
<!-- /cnts-box-06 --></div>
<!-- /cnts-box-06-inner --></div>
<!-- /cnts-box-06-container --></div>


```
*/
.cnts-box-01-container {
  padding-top: 4px;
  width: 690px;
  background: url(/common/images/bg_box_01_top.gif) no-repeat top;
  zoom: 1;
}

.cnts-box-01-inner {
  padding-bottom: 4px;
  background: url(/common/images/bg_box_01_btm.gif) no-repeat bottom;
  zoom: 1;
}

.cnts-box-01 {
  padding: 15px 20px 10px 20px;
  border-left: solid 1px gainsboro;
  border-right: solid 1px gainsboro;
  background: white;
  zoom: 1;
}

.cnts-box-02-container {
  padding-top: 4px;
  width: 690px;
  background: url(/common/images/bg_box_02_top.gif) no-repeat top;
  zoom: 1;
}

.cnts-box-02-inner {
  padding-bottom: 4px;
  background: url(/common/images/bg_box_02_btm.gif) no-repeat bottom;
  zoom: 1;
}

.cnts-box-02 {
  padding: 15px 20px 10px 20px;
  border-left: solid 1px #f68285;
  border-right: solid 1px #f68285;
  background: #fff2f3;
  zoom: 1;
}

.cnts-box-03-container {
  padding-top: 4px;
  width: 690px;
  background: url(/common/images/bg_box_03_top.gif) no-repeat top;
  zoom: 1;
}

.cnts-box-03-inner {
  padding-bottom: 4px;
  background: url(/common/images/bg_box_03_btm.gif) no-repeat bottom;
  zoom: 1;
}

.cnts-box-03 {
  padding: 15px 20px 10px 20px;
  border-left: solid 1px #53ae9d;
  border-right: solid 1px #53ae9d;
  background: white;
  zoom: 1;
}

.cnts-box-04-container {
  padding-top: 4px;
  width: 330px;
  background: url(/common/images/bg_box_04_top.gif) no-repeat top;
  zoom: 1;
}

.cnts-box-04-inner {
  padding-bottom: 4px;
  background: url(/common/images/bg_box_04_btm.gif) no-repeat bottom;
  zoom: 1;
}

.cnts-box-04 {
  padding: 15px 20px 10px 20px;
  border-left: solid 1px #eee8cc;
  border-right: solid 1px #eee8cc;
  background: #eee8cc;
  zoom: 1;
}

.cnts-box-05-container {
  padding-top: 4px;
  width: 690px;
  background: url(/common/images/bg_box_05_top.gif) no-repeat top;
  zoom: 1;
}

.cnts-box-05-inner {
  padding-bottom: 4px;
  background: url(/common/images/bg_box_05_btm.gif) no-repeat bottom;
  zoom: 1;
}

.cnts-box-05 {
  padding: 15px 20px 10px 20px;
  border-left: solid 1px #eee8cc;
  border-right: solid 1px #eee8cc;
  background: #eee8cc;
  zoom: 1;
}

.cnts-box-06-container {
  padding-top: 4px;
  width: 169px;
  background: url(/common/images/bg_box_06_top.gif) no-repeat top;
  zoom: 1;
}

.cnts-box-06-inner {
  padding-bottom: 4px;
  background: url(/common/images/bg_box_06_btm.gif) no-repeat bottom;
  zoom: 1;
}

.cnts-box-06 {
  padding: 15px 20px 10px 20px;
  border-left: solid 1px #f8f5e1;
  border-right: solid 1px #f8f5e1;
  background: #f8f5e1;
  zoom: 1;
}

/*
#tbl-data-01 表組み
セル幅は<strong>colgroup</strong>で調整してください。<br>
セル内のtext-alignとvertical-alignはそれぞれ調整用のスタイルで調整してください。

```
<table class="tbl-data-01" cellspacing="0">
<colgroup>
<col style="width:30%;">
<col style="width:20%;">
<col style="width:50%;">
</colgroup>
<thead>
<tr>
<th>テキスト</th>
<th>テキストテキストテキスト</th>
<th>テキストテキスト</th>
</tr>
</thead>
<tbody>
<tr>
<th>テキストテキストテキストテキスト</th>
<td>テキストテキストテキスト</td>
<td><span class="ico-02"><img src="/loan/nougyo/ichiran/images/ico_01.gif" width="25" height="25" alt="農"></span><span class="ico-02"><img src="/loan/nougyo/ichiran/images/ico_02.gif" width="25" height="25" alt="就"></span><span class="ico-02"><img src="/loan/nougyo/ichiran/images/ico_03.gif" width="25" height="25" alt="担"></span><span class="ico-02"><img src="/loan/nougyo/ichiran/images/ico_04.gif" width="25" height="25" alt="他"></span></td>
</tr>
<tr>
<th>テキストテキストテキストテキスト</th>
<td>テキストテキストテキスト</td>
<td>テキストテキスト</td>
</tr>
<tr>
<th>テキストテキストテキストテキスト</th>
<td>テキストテキストテキスト</td>
<td>テキストテキスト</td>
</tr>
<tr>
<td height="50" colspan="3">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</td>
</tr>
</tbody>
</table>
```
*/
.tbl-data-01 {
  border-top: solid 1px #53ae9d;
  border-left: solid 1px #53ae9d;
  border-spacing: 0;
  width: 100%;
}
.tbl-data-01 th, .tbl-data-01 td {
  padding: 15px 20px;
  border-bottom: solid 1px #53ae9d;
  border-right: solid 1px #53ae9d;
}
.tbl-data-01 th {
  background: #f5f5ed;
}
.tbl-data-01 thead th {
  background: #d4e8d6;
  font-weight: bold;
}

.in-tbl-01 {
  padding: 0 !important;
}

.lyt-clm-tbl-01 {
  overflow: hidden;
  *zoom: 1;
  width: 688px;
}
.lyt-clm-tbl-01 .clm-tbl-01 {
  padding: 15px;
  float: left;
  width: 250px;
  background: #f7f7ef;
}
.lyt-clm-tbl-01 .clm-tbl-02 {
  padding: 15px;
  float: right;
  width: 378px;
}

/*
#アイコン用スタイル
##ico-01
padding-left:5px
##ico-02
padding-right:5px

```
<ul class="list-link-01">
<li><a href="#">テキストテキストテキストテキストテキスト [PDF：97.13 KB]<span class="ico-01"><img src="/common/images/ico_pdf_01.gif" width="14" height="15" alt="PDFファイルを開きます"></span></a></li>
</ul>
<ul class="list-link-02">
<li><a href="#"><span class="ico-02"><img src="/common/images/ico_pdf_01.gif" width="14" height="15" alt="PDFファイルを開きます"></span>テキストテキストテキストテキストテキスト [PDF：97.13 KB]</a></li>
</ul>
```
*/
.ico-01 {
  padding-left: 5px;
}
.ico-01 img {
  vertical-align: middle;
}

.ico-02 {
  padding-right: 5px;
}
.ico-02 img {
  vertical-align: middle;
}

/*
#ゴールパターン

各ゴールパターンはインクルードファイルになっています。<br>
下記ソースのインクルードの記述のみ使用してください。<br>
<br>
<strong>goal-A</strong><br>
<?php include 'common/include/goal-A.html'; ?><br>
<br>
<strong>goal-B</strong><br>
<?php include 'common/include/goal-B.html'; ?><br>
<br>
<strong>goal-C</strong><br>
<?php include 'common/include/goal-C.html'; ?><br>
<br>
<strong>goal-D</strong><br>
<?php include 'common/include/goal-D.html'; ?><br>
<br>
<strong>goal-E</strong><br>
<?php include 'common/include/goal-E.html'; ?><br>
<br>
<strong>goal-F</strong><br>
<?php include 'common/include/goal-F.html'; ?><br>
<br>
<strong>goal-G</strong><br>
<?php include 'common/include/goal-G.html'; ?><br>
<br>
<strong>goal-H</strong><br>
<?php include 'common/include/goal-H.html'; ?><br>
<br>
<strong>goal-I</strong><br>
<?php include 'common/include/goal-I.html'; ?><br>
<br>
<strong>goal-J</strong><br>
<?php include 'common/include/goal-J.html'; ?><br>
<br>
<strong>goal-K</strong><br>
<?php include 'common/include/goal-K.html'; ?><br>
<br>
<strong>goal-L</strong><br>
<?php include 'common/include/goal-L.html'; ?>
```
<!-- ignore --><p class="mgt30"><em>goal-A</em></p>

<div class="box-goal-01-container">
<div class="box-goal-01-inner">
<div class="box-goal-01">
<p class="mgb05"><a href="/tenpo_atm/"><img src="/common/images/btn_goal_01.gif" alt="サービスに関するお問い合わせやお申し込みはお近くのJAまでお気軽にどうぞ。 店舗・ATM検索" width="652" height="142" class="over02"></a></p>
<p class="mgb05"><a href="/kouza/hajimete/"><img src="/common/images/btn_goal_02.gif" alt="JAバンクは全国どなたでも安心してご利用いただける金融機関です。 はじめてのお客さまへ" width="652" height="68" class="over02"></a></p>
<p><a href="/tsukau/cd_atm/"><img src="/common/images/btn_goal_03.gif" alt="手数料無料ATMネットワークが業界トップクラス！ JAバンクの手数料無料ATM" width="652" height="68" class="over02"></a></p>
<!-- /box-goal-01 --></div>
<!-- /box-goal-01-inner --></div>
<!-- /box-goal-01-container --></div>

<!-- ignore --><p class="mgt30"><em>goal-B</em></p>

<div class="box-goal-01-container">
<div class="box-goal-01-inner">
<div class="box-goal-01">
<div class="lyt-clm-01 mgb05">
<div class="clm-01 w323">
<p><a href="/loan/soudan/"><img src="/common/images/btn_goal_04.gif" alt="ローン相談会へ行こう！全国で実施のローン相談会の実施日程はこちら。 ローン相談会" width="323" height="178" class="over02"></a></p>
<!-- /clm-01 --></div>
<div class="clm-02 w323">
<p><a href="/tenpo_atm/"><img src="/common/images/btn_goal_04.gif" alt="現在の金利やサービスに関するお問い合わせ・お申し込みはお近くのJAまでお気軽にどうぞ。" width="323" height="178" class="over02"></a></p>
<!-- /clm-02 --></div>
<!-- /lyt-clm-01 --></div>
<p><a href="/kouza/hajimete/"><img src="/common/images/btn_goal_02.gif" alt="JAバンクは全国どなたでも安心してご利用いただける金融機関です。 はじめてのお客さまへ" width="652" height="68" class="over02"></a></p>
<!-- /box-goal-01 --></div>
<!-- /box-goal-01-inner --></div>
<!-- /box-goal-01-container --></div>

<!-- ignore --><p class="mgt30"><em>goal-C</em></p>

<div class="box-goal-01-container">
<div class="box-goal-01-inner">
<div class="box-goal-01">
<p class="mgb05"><a href="/tenpo_atm/"><img src="/common/images/btn_goal_06.gif" alt="金利などのサービスに関するお問い合わせやお申し込みはお近くのJAまでお気軽にどうぞ。 店舗・ATM検索" width="652" height="161" class="over02"></a></p>
<p><a href="/kouza/hajimete/"><img src="/common/images/btn_goal_02.gif" alt="JAバンクは全国どなたでも安心してご利用いただける金融機関です。 はじめてのお客さまへ" width="652" height="68" class="over02"></a></p>
<!-- /box-goal-01 --></div>
<!-- /box-goal-01-inner --></div>
<!-- /box-goal-01-container --></div>

<!-- ignore --><p class="mgt30"><em>goal-D</em></p>

<div class="box-goal-01-container">
<div class="box-goal-01-inner">
<div class="box-goal-01">
<p class="mgb05"><a href="/tameru/ichiran/"><img src="/common/images/btn_goal_07.gif" alt="サービスに関するお問い合わせやお申し込みはお近くのJAまでお気軽にどうぞ。取扱いJA・信連一覧" width="652" height="142" class="over02"></a></p>
<p><a href="/kouza/hajimete/"><img src="/common/images/btn_goal_02.gif" alt="JAバンクは全国どなたでも安心してご利用いただける金融機関です。 はじめてのお客さまへ" width="652" height="68" class="over02"></a></p>
<!-- /box-goal-01 --></div>
<!-- /box-goal-01-inner --></div>
<!-- /box-goal-01-container --></div>

<!-- ignore --><p class="mgt30"><em>goal-E</em></p>

<div class="box-goal-01-container">
<div class="box-goal-01-inner">
<div class="box-goal-01">
<p class="mgb05"><a href="/tenpo_atm/"><img src="/common/images/btn_goal_08.gif" alt="お問い合わせ等はお取引のJAまでお気軽にどうぞ。 店舗・ATM検索" width="652" height="142" class="over02"></a></p>
<!-- /box-goal-01 --></div>
<!-- /box-goal-01-inner --></div>
<!-- /box-goal-01-container --></div>

<!-- ignore --><p class="mgt30"><em>goal-F</em></p>

<div class="box-goal-01-container">
<div class="box-goal-01-inner">
<div class="box-goal-01">
<p class="mgb05"><a href="/tenpo_atm/"><img src="/common/images/btn_goal_01.gif" alt="サービスに関するお問い合わせやお申し込みはお近くのJAまでお気軽にどうぞ。 店舗・ATM検索" width="652" height="142" class="over02"></a></p>
<p><a href="/kouza/hajimete/"><img src="/common/images/btn_goal_02.gif" alt="JAバンクは全国どなたでも安心してご利用いただける金融機関です。 はじめてのお客さまへ" width="652" height="68" class="over02"></a></p>
<!-- /box-goal-01 --></div>
<!-- /box-goal-01-inner --></div>
<!-- /box-goal-01-container --></div>

<!-- ignore --><p class="mgt30"><em>goal-G</em></p>

<div class="box-goal-01-container">
<div class="box-goal-01-inner">
<div class="box-goal-02">
<p class="mgb05"><a href="/kouza/sougoukouza/"><img src="/common/images/btn_goal_09.gif" alt="サービスに関するお問い合わせやお申し込みはお近くのJAまでお気軽にどうぞ。 総合口座の開設はこちら" width="662" height="109" class="over02"></a></p>
<!-- /box-goal-02 --></div>
<!-- /box-goal-01-inner --></div>
<!-- /box-goal-01-container --></div>

<!-- ignore --><p class="mgt30"><em>goal-H</em></p>

<div class="box-goal-01-container">
<div class="box-goal-01-inner">
<div class="box-goal-01">
<p class="mgb05"><a href="/tenpo_atm/"><img src="/common/images/btn_goal_10.gif" alt="サービスに関するお問い合わせやお申し込みはお近くのJAまでお気軽にどうぞ。 総合口座の開設はこちら 店舗・ATM検索" width="652" height="192" class="over02"></a></p>
<p class="mgb05"><a href="/kouza/hajimete/"><img src="/common/images/btn_goal_02.gif" alt="JAバンクは全国どなたでも安心してご利用いただける金融機関です。 はじめてのお客さまへ" width="652" height="68" class="over02"></a></p>
<p><a href="/tsukau/cd_atm/"><img src="/common/images/btn_goal_03.gif" alt="手数料無料ATMネットワークが業界トップクラス！ JAバンクの手数料無料ATM" width="652" height="68" class="over02"></a></p>
<!-- /box-goal-01 --></div>
<!-- /box-goal-01-inner --></div>
<!-- /box-goal-01-container --></div>

<!-- ignore --><p class="mgt30"><em>goal-I</em></p>

<div class="box-goal-01-container">
<div class="box-goal-01-inner">
<div class="box-goal-01">
<p class="mgb05"><a href="/tenpo_atm/"><img src="/common/images/btn_goal_01.gif" alt="サービスに関するお問い合わせやお申し込みはお近くのJAまでお気軽にどうぞ。 店舗・ATM検索" width="652" height="142" class="over02"></a></p>
<!-- /box-goal-01 --></div>
<!-- /box-goal-01-inner --></div>
<!-- /box-goal-01-container --></div>

<!-- ignore --><p class="mgt30"><em>goal-J</em></p>

<div class="box-goal-01-container">
<div class="box-goal-01-inner">
<div class="box-goal-01">
<p class="mgb05"><a href="/tameru/ichiran/"><img src="/common/images/btn_goal_07.gif" alt="サービスに関するお問い合わせやお申し込みはお近くのJAまでお気軽にどうぞ。取扱いJA・信連一覧" width="652" height="142" class="over02"></a></p>
<p><a href="/faq/"><img src="/common/images/btn_goal_11.gif" alt="国債・投資信託について、お客さまからよくあるご質問をまとめました。 よくあるご質問：貯める・増やす" width="652" height="68" class="over02"></a></p>
<!-- /box-goal-01 --></div>
<!-- /box-goal-01-inner --></div>
<!-- /box-goal-01-container --></div>

<!-- ignore --><p class="mgt30"><em>goal-K</em></p>

<div class="box-goal-01-container-02">
<p><img src="/common/images/ttl_goal_01.gif" alt="JAカードのお問合せ先" width="690" height="55"></p>
<div class="box-goal-01-inner">
<div class="box-goal-01">
<p><a href="/tenpo_atm/"><img src="/common/images/btn_goal_12.gif" alt="JAカードのお申し込み、お取扱いカード等については、お近くのJAにお問合せください。 店舗・ATM検索" width="652" height="142" class="over02"></a></p>
<div class="box-goal-03 mgb15">
<p class="ta-c"><img src="/common/images/txt_goal_01.gif" alt="JAカードのお申し込み、お取扱いカード等については、お近くのJAにお問合せください。" width="534" height="65"></p>
<p class="ta-c"><img src="/common/images/ttl_goal_02.gif" alt="コールセンター" width="606" height="38"></p>
<p class="ta-c"><img src="/common/images/txt_goal_02.gif" alt="東日本：TEL 03-5940-1100 西日本：TEL 06-6616-0770（受付時間：9:00～17:30／年中無休、ただし年末年始を除く）なお、JAカードを既にお持ちのお客さまは「カードサービスセンター」にて、各種サービスのご案内もご利用いただけます。" width="606" height="109"></p>
<p class="ta-c"><img src="/common/images/ttl_goal_03.gif" alt="カードサービスセンター" width="606" height="38"></p>
<p class="ta-c"><img src="/common/images/txt_goal_03.gif" alt="0120-030-060 携帯電話・PHSからは03-5978-1411（受付時間：9:00～18:00／年中無休、ただし年末年始を除く）また、クレジットカードの機能・サービス、ご登録内容の変更などご照会内容に即したお問合せは、三菱UFJニコス「お問合せ」からご連絡先を選択のうえ、お問合せください。" width="606" height="102"></p>
<p class="ta-r mgb25"><a href="http://www.cr.mufg.jp/member/support/inquiry/list/"><img src="/common/images/btn_goal_13.gif" alt="詳しくは三菱UFJニコス「お問い合わせ」へ" width="268" height="13" class="over01"></a></p>
<!-- /box-goal-03 --></div>
<p class="ta-c"><a href="/faq/hunsitu/"><img src="/common/images/btn_goal_14.gif" alt="カードの紛失・盗難のご連絡はこちら" width="430" height="49" class="over02"></a></p>
<!-- /box-goal-01 --></div>
<!-- /box-goal-01-inner --></div>
<!-- /box-goal-01-container --></div>

<!-- ignore --><p class="mgt30"><em>goal-L</em></p>

<div class="box-goal-01-container">
<div class="box-goal-01-inner">
<div class="box-goal-01">
<p class="mgb05"><a href="/tenpo_atm/"><img src="/common/images/btn_goal_01.gif" alt="サービスに関するお問い合わせやお申し込みはお近くのJAまでお気軽にどうぞ。 店舗・ATM検索" width="652" height="142" class="over02"></a></p>
<p><a href="/tsukau/cd_atm/"><img src="/common/images/btn_goal_03.gif" alt="手数料無料ATMネットワークが業界トップクラス！ JAバンクの手数料無料ATM" width="652" height="68" class="over02"></a></p>
<!-- /box-goal-01 --></div>
<!-- /box-goal-01-inner --></div>
<!-- /box-goal-01-container --></div>

```
*/
.box-goal-01-container {
  margin-top: 60px;
  padding-top: 4px;
  width: 690px;
  background: url(/common/images/bg_goal_top.gif) no-repeat top;
  zoom: 1;
}

.box-goal-01-container-02 {
  width: 690px;
  margin-top: 60px;
}

.box-goal-01-inner {
  padding-bottom: 4px;
  background: url(/common/images/bg_goal_btm.gif) no-repeat bottom;
  zoom: 1;
}

.box-goal-01 {
  padding: 15px 19px 10px 19px;
  background: #efe9cd;
  zoom: 1;
}

.box-goal-02 {
  padding: 15px 14px 10px 14px;
  background: #efe9cd;
  zoom: 1;
}

.box-goal-03 {
  margin: 0 auto;
  padding: 4px 0;
  position: relative;
  width: 652px;
  height: 390px;
  background: url(/common/images/bg_goal_01.gif) no-repeat;
}

/*
#list-map-01

```
<div class="map-01-container">
<ul class="list-map-01">
<li class="btn-hokkaido"><a href="#"><img src="/common/images/btn_map_hokkaido_01.gif" alt="北海道" width="64" height="26" class="over02"></a></li>
<li class="btn-aomori"><a href="#"><img src="/common/images/btn_map_aomori_01.gif" alt="青森" width="49" height="26" class="over02"></a></li>
<li class="btn-iwate"><a href="#"><img src="/common/images/btn_map_iwate_01.gif" alt="岩手" width="49" height="26" class="over02"></a></li>
<li class="btn-miyagi"><a href="#"><img src="/common/images/btn_map_miyagi_01.gif" alt="宮城" width="49" height="26" class="over02"></a></li>
<li class="btn-akita"><a href="#"><img src="/common/images/btn_map_akita_01.gif" alt="秋田" width="49" height="26" class="over02"></a></li>
<li class="btn-yamagata"><a href="#"><img src="/common/images/btn_map_yamagata_01.gif" alt="山形" width="49" height="26" class="over02"></a></li>
<li class="btn-fukushima"><a href="#"><img src="/common/images/btn_map_fukushima_01.gif" alt="福島" width="49" height="26" class="over02"></a></li>
<li class="btn-ibaraki"><a href="#"><img src="/common/images/btn_map_ibaraki_01.gif" alt="茨城" width="49" height="26" class="over02"></a></li>
<li class="btn-tochigi"><a href="#"><img src="/common/images/btn_map_tochigi_01.gif" alt="栃木" width="49" height="26" class="over02"></a></li>
<li class="btn-gunma"><a href="#"><img src="/common/images/btn_map_gunma_01.gif" alt="群馬" width="49" height="26" class="over02"></a></li>
<li class="btn-saitama"><a href="#"><img src="/common/images/btn_map_saitama_01.gif" alt="埼玉" width="49" height="26" class="over02"></a></li>
<li class="btn-chiba"><a href="#"><img src="/common/images/btn_map_chiba_01.gif" alt="千葉" width="49" height="26" class="over02"></a></li>
<li class="btn-tokyo"><a href="#"><img src="/common/images/btn_map_tokyo_01.gif" alt="東京" width="49" height="26" class="over02"></a></li>
<li class="btn-kanagawa"><a href="#"><img src="/common/images/btn_map_kanagawa_01.gif" alt="神奈川" width="64" height="26" class="over02"></a></li>
<li class="btn-niigata"><a href="#"><img src="/common/images/btn_map_niigata_01.gif" alt="新潟" width="49" height="26" class="over02"></a></li>
<li class="btn-toyama"><a href="#"><img src="/common/images/btn_map_toyama_01.gif" alt="富山" width="49" height="26" class="over02"></a></li>
<li class="btn-ishikawa"><a href="#"><img src="/common/images/btn_map_ishikawa_01.gif" alt="石川" width="49" height="26" class="over02"></a></li>
<li class="btn-fukui"><a href="#"><img src="/common/images/btn_map_fukui_01.gif" alt="福井" width="49" height="26" class="over02"></a></li>
<li class="btn-yamanashi"><a href="#"><img src="/common/images/btn_map_yamanashi_01.gif" alt="山梨" width="49" height="26" class="over02"></a></li>
<li class="btn-nagano"><a href="#"><img src="/common/images/btn_map_nagano_01.gif" alt="長野" width="49" height="26" class="over02"></a></li>
<li class="btn-gifu"><a href="#"><img src="/common/images/btn_map_gifu_01.gif" alt="岐阜" width="49" height="26" class="over02"></a></li>
<li class="btn-shizuoka"><a href="#"><img src="/common/images/btn_map_shizuoka_01.gif" alt="静岡" width="49" height="26" class="over02"></a></li>
<li class="btn-aichi"><a href="#"><img src="/common/images/btn_map_aichi_01.gif" alt="愛知" width="49" height="26" class="over02"></a></li>
<li class="btn-mie"><a href="#"><img src="/common/images/btn_map_mie_01.gif" alt="三重" width="49" height="26" class="over02"></a></li>
<li class="btn-shiga"><a href="#"><img src="/common/images/btn_map_shiga_01.gif" alt="滋賀" width="49" height="26" class="over02"></a></li>
<li class="btn-kyoto"><a href="#"><img src="/common/images/btn_map_kyoto_01.gif" alt="京都" width="49" height="26" class="over02"></a></li>
<li class="btn-osaka"><a href="#"><img src="/common/images/btn_map_osaka_01.gif" alt="大阪" width="49" height="26" class="over02"></a></li>
<li class="btn-hyogo"><a href="#"><img src="/common/images/btn_map_hyogo_01.gif" alt="兵庫" width="49" height="26" class="over02"></a></li>
<li class="btn-nara"><a href="#"><img src="/common/images/btn_map_nara_01.gif" alt="奈良" width="49" height="26" class="over02"></a></li>
<li class="btn-wakayama"><a href="#"><img src="/common/images/btn_map_wakayama_01.gif" alt="和歌山" width="62" height="26" class="over02"></a></li>
<li class="btn-tottori"><a href="#"><img src="/common/images/btn_map_tottori_01.gif" alt="鳥取" width="49" height="26" class="over02"></a></li>
<li class="btn-shimane"><a href="#"><img src="/common/images/btn_map_shimane_01.gif" alt="島根" width="49" height="26" class="over02"></a></li>
<li class="btn-okayama"><a href="#"><img src="/common/images/btn_map_okayama_01.gif" alt="岡山" width="49" height="26" class="over02"></a></li>
<li class="btn-hiroshima"><a href="#"><img src="/common/images/btn_map_hiroshima_01.gif" alt="広島" width="49" height="26" class="over02"></a></li>
<li class="btn-yamaguchi"><a href="#"><img src="/common/images/btn_map_yamaguchi_01.gif" alt="山口" width="49" height="26" class="over02"></a></li>
<li class="btn-tokushima"><a href="#"><img src="/common/images/btn_map_tokushima_01.gif" alt="徳島" width="49" height="26" class="over02"></a></li>
<li class="btn-kagawa"><a href="#"><img src="/common/images/btn_map_kagawa_01.gif" alt="香川" width="49" height="26" class="over02"></a></li>
<li class="btn-ehime"><a href="#"><img src="/common/images/btn_map_ehime_01.gif" alt="愛媛" width="49" height="26" class="over02"></a></li>
<li class="btn-kochi"><a href="#"><img src="/common/images/btn_map_kochi_01.gif" alt="高知" width="49" height="26" class="over02"></a></li>
<li class="btn-fukuoka"><a href="#"><img src="/common/images/btn_map_fukuoka_01.gif" alt="福岡" width="49" height="26" class="over02"></a></li>
<li class="btn-saga"><a href="#"><img src="/common/images/btn_map_saga_01.gif" alt="佐賀" width="49" height="26" class="over02"></a></li>
<li class="btn-nagasaki"><a href="#"><img src="/common/images/btn_map_nagasaki_01.gif" alt="長崎" width="49" height="26" class="over02"></a></li>
<li class="btn-kumamoto"><a href="#"><img src="/common/images/btn_map_kumamoto_01.gif" alt="熊本" width="49" height="26" class="over02"></a></li>
<li class="btn-oita"><a href="#"><img src="/common/images/btn_map_oita_01.gif" alt="大分" width="49" height="26" class="over02"></a></li>
<li class="btn-miyazaki"><a href="#"><img src="/common/images/btn_map_miyazaki_01.gif" alt="宮崎" width="49" height="26" class="over02"></a></li>
<li class="btn-kagoshima"><a href="#"><img src="/common/images/btn_map_kagoshima_01.gif" alt="鹿児島" width="62" height="26" class="over02"></a></li>
<li class="btn-okinawa"><a href="#"><img src="/common/images/btn_map_okinawa_01.gif" alt="沖縄" width="49" height="26" class="over02"></a></li>
</ul>
<!-- /map-01-container --></div>
```
*/
.map-01-container {
  margin: 0 auto;
  position: relative;
  width: 640px;
  height: 341px;
  background: url(/common/images/bg_map_01.gif) no-repeat;
}
.map-01-container .list-map-01 .btn-hokkaido {
  position: absolute;
  top: 34px;
  left: 510px;
}
.map-01-container .list-map-01 .btn-aomori {
  position: absolute;
  top: 83px;
  left: 545px;
}
.map-01-container .list-map-01 .btn-iwate {
  position: absolute;
  top: 110px;
  left: 545px;
}
.map-01-container .list-map-01 .btn-miyagi {
  position: absolute;
  top: 137px;
  left: 545px;
}
.map-01-container .list-map-01 .btn-akita {
  position: absolute;
  top: 83px;
  left: 495px;
}
.map-01-container .list-map-01 .btn-yamagata {
  position: absolute;
  top: 110px;
  left: 495px;
}
.map-01-container .list-map-01 .btn-fukushima {
  position: absolute;
  top: 164px;
  left: 545px;
}
.map-01-container .list-map-01 .btn-ibaraki {
  position: absolute;
  top: 232px;
  left: 546px;
}
.map-01-container .list-map-01 .btn-tochigi {
  position: absolute;
  top: 205px;
  left: 546px;
}
.map-01-container .list-map-01 .btn-gunma {
  position: absolute;
  top: 205px;
  left: 496px;
}
.map-01-container .list-map-01 .btn-saitama {
  position: absolute;
  top: 232px;
  left: 496px;
}
.map-01-container .list-map-01 .btn-chiba {
  position: absolute;
  top: 259px;
  left: 546px;
}
.map-01-container .list-map-01 .btn-tokyo {
  position: absolute;
  top: 259px;
  left: 496px;
}
.map-01-container .list-map-01 .btn-kanagawa {
  position: absolute;
  top: 286px;
  left: 496px;
}
.map-01-container .list-map-01 .btn-niigata {
  position: absolute;
  top: 159px;
  left: 432px;
}
.map-01-container .list-map-01 .btn-toyama {
  position: absolute;
  top: 159px;
  left: 382px;
}
.map-01-container .list-map-01 .btn-ishikawa {
  position: absolute;
  top: 186px;
  left: 382px;
}
.map-01-container .list-map-01 .btn-fukui {
  position: absolute;
  top: 213px;
  left: 382px;
}
.map-01-container .list-map-01 .btn-yamanashi {
  position: absolute;
  top: 213px;
  left: 432px;
}
.map-01-container .list-map-01 .btn-nagano {
  position: absolute;
  top: 186px;
  left: 432px;
}
.map-01-container .list-map-01 .btn-gifu {
  position: absolute;
  top: 263px;
  left: 382px;
}
.map-01-container .list-map-01 .btn-shizuoka {
  position: absolute;
  top: 290px;
  left: 432px;
}
.map-01-container .list-map-01 .btn-aichi {
  position: absolute;
  top: 263px;
  left: 432px;
}
.map-01-container .list-map-01 .btn-mie {
  position: absolute;
  top: 290px;
  left: 382px;
}
.map-01-container .list-map-01 .btn-shiga {
  position: absolute;
  top: 155px;
  left: 305px;
}
.map-01-container .list-map-01 .btn-kyoto {
  position: absolute;
  top: 182px;
  left: 305px;
}
.map-01-container .list-map-01 .btn-osaka {
  position: absolute;
  top: 236px;
  left: 305px;
}
.map-01-container .list-map-01 .btn-hyogo {
  position: absolute;
  top: 209px;
  left: 305px;
}
.map-01-container .list-map-01 .btn-nara {
  position: absolute;
  top: 263px;
  left: 305px;
}
.map-01-container .list-map-01 .btn-wakayama {
  position: absolute;
  top: 290px;
  left: 305px;
}
.map-01-container .list-map-01 .btn-tottori {
  position: absolute;
  top: 155px;
  left: 229px;
}
.map-01-container .list-map-01 .btn-shimane {
  position: absolute;
  top: 209px;
  left: 229px;
}
.map-01-container .list-map-01 .btn-okayama {
  position: absolute;
  top: 182px;
  left: 229px;
}
.map-01-container .list-map-01 .btn-hiroshima {
  position: absolute;
  top: 155px;
  left: 179px;
}
.map-01-container .list-map-01 .btn-yamaguchi {
  position: absolute;
  top: 182px;
  left: 179px;
}
.map-01-container .list-map-01 .btn-tokushima {
  position: absolute;
  top: 278px;
  left: 229px;
}
.map-01-container .list-map-01 .btn-kagawa {
  position: absolute;
  top: 252px;
  left: 229px;
}
.map-01-container .list-map-01 .btn-ehime {
  position: absolute;
  top: 252px;
  left: 179px;
}
.map-01-container .list-map-01 .btn-kochi {
  position: absolute;
  top: 279px;
  left: 179px;
}
.map-01-container .list-map-01 .btn-fukuoka {
  position: absolute;
  top: 177px;
  left: 115px;
}
.map-01-container .list-map-01 .btn-saga {
  position: absolute;
  top: 177px;
  left: 65px;
}
.map-01-container .list-map-01 .btn-nagasaki {
  position: absolute;
  top: 204px;
  left: 65px;
}
.map-01-container .list-map-01 .btn-kumamoto {
  position: absolute;
  top: 258px;
  left: 115px;
}
.map-01-container .list-map-01 .btn-oita {
  position: absolute;
  top: 204px;
  left: 115px;
}
.map-01-container .list-map-01 .btn-miyazaki {
  position: absolute;
  top: 231px;
  left: 115px;
}
.map-01-container .list-map-01 .btn-kagoshima {
  position: absolute;
  top: 285px;
  left: 102px;
}
.map-01-container .list-map-01 .btn-okinawa {
  position: absolute;
  top: 285px;
  left: 27px;
}

/*
#over01 CSSによるロールオーバー

```
<p><a href="#"><img src="/common/images/btn_gnav_01_01.gif" alt="総合口座" width="178" height="84" class="over01"></a></p>
```
*/
img.over01:hover, input.over01:hover {
  opacity: 0.75;
  filter: alpha(opacity=75);
}

/*
#over02 imgによるロールオーバー

```
<p><a href="#"><img width="115" height="95" class="over02" alt="講座を開く" src="http://jabank/common/images/btn_gnav_01.gif"></a></p>
```
*/
/*
#text-align 調整用スタイル

```
<p class="ta-c">text-align:center</p>
<p class="ta-r">text-align:right</p>
<p class="ta-l">text-align:left</p>
```
*/
.ta-c {
  text-align: center !important;
}

.ta-r {
  text-align: right !important;
}

.ta-l {
  text-align: left !important;
}

/*
#vertical-align 調整用スタイル

主にテーブルのセルに付与します。

```
<table class="tbl-data-01" cellspacing="0">
<tbody>
<tr>
<td class="va-t">vertical-align:top<br>vertical-align:top</td>
<td class="va-m">vertical-align:middle</td>
<td class="va-b">vertical-align:bottom</td>
<tr>
</tbody>
</table>
```
*/
.va-t {
  vertical-align: top !important;
}

.va-m {
  vertical-align: middle !important;
}

.va-b {
  vertical-align: bottom !important;
}

/*
#margin-bottom 調整用スタイル

```
<p class="mgb00">margin-bottom:0px</p>
<p class="mgb05">margin-bottom:5px</p>
<p class="mgb10">margin-bottom:10px</p>
<p class="mgb15">margin-bottom:15px</p>
<p class="mgb20">margin-bottom:20px</p>
<p class="mgb25">margin-bottom:25px</p>
<p class="mgb30">margin-bottom:30px</p>
<p class="mgb35">margin-bottom:35px</p>
```
*/
.mgb00 {
  margin-bottom: 0px !important;
}

.mgb05 {
  margin-bottom: 5px !important;
}

.mgb10 {
  margin-bottom: 10px !important;
}

.mgb15 {
  margin-bottom: 15px !important;
}

.mgb20 {
  margin-bottom: 20px !important;
}

.mgb25 {
  margin-bottom: 25px !important;
}

.mgb30 {
  margin-bottom: 30px !important;
}

.mgb35 {
  margin-bottom: 35px !important;
}

/*
#margin-top 調整用スタイル

```
<p class="mgt00">margin-top:0px</p>
<p class="mgt05">margin-top:5px</p>
<p class="mgt10">margin-top:10px</p>
<p class="mgt15">margin-top:15px</p>
<p class="mgt20">margin-top:20px</p>
<p class="mgt25">margin-top:25px</p>
<p class="mgt30">margin-top:30px</p>
<p class="mgt35">margin-top:35px</p>
```
*/
.mgt00 {
  margin-top: 0px !important;
}

.mgt05 {
  margin-top: 5px !important;
}

.mgt10 {
  margin-top: 10px !important;
}

.mgt15 {
  margin-top: 15px !important;
}

.mgt20 {
  margin-top: 20px !important;
}

.mgt25 {
  margin-top: 25px !important;
}

.mgt30 {
  margin-top: 30px !important;
}

.mgt35 {
  margin-top: 35px !important;
}

/*
#float調整用スタイル

```
<p class="flt-l">float:left</p>
<p class="flt-r">float:right</p>
```
*/
.flt-l {
  float: left !important;
}

.flt-r {
  float: right !important;
}

/*
#width 調整用スタイル

```
<p class="w98">width:98px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="98" height="50"></p>
<p class="w120">width:120px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="120" height="50"></p>
<p class="w136">width:136px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="136" height="50"></p>
<p class="w148">width:148px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="148" height="50"></p>
<p class="w175">width:175px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="175" height="50"></p>
<p class="w200">width:200px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="200" height="50"></p>
<p class="w323">width:323px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="323" height="50"></p>
<p class="w336">width:336px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="336" height="50"></p>
<p class="w460">width:460px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="460" height="50"></p>
<p class="w515">width:515px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="515" height="50"></p>
<p class="w524">width:524px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="524" height="50"></p>
<p class="w548">width:548px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="548" height="50"></p>
<p class="w570">width:570px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="570" height="50"></p>
<p class="w590">width:590px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="590" height="50"></p>
```
*/
.w98 {
  width: 98px;
}

.w120 {
  width: 120px;
}

.w136 {
  width: 136px;
}

.w148 {
  width: 148px;
}

.w175 {
  width: 175px;
}

.w200 {
  width: 200px;
}

.w323 {
  width: 323px;
}

.w336 {
  width: 336px;
}

.w460 {
  width: 460px;
}

.w515 {
  width: 515px;
}

.w524 {
  width: 524px;
}

.w540 {
  width: 540px;
}

.w548 {
  width: 548px;
}

.w570 {
  width: 570px;
}

.w690 {
  width: 690px;
}

/*
#(ex)point

```
<!-- ignore --><div class="w690">

<ul class="list-border-01">
<li class="item">
<div class="lyt-clm-01 mgb30">
<div class="clm-01 w120">
<h3><img src="/common/images/img_point_01.gif" alt="POINT1" width="96" height="30"></h3>
<!-- /clm-01 --></div>
<div class="clm-02 w570">
<p class="txt-l-01 mgb15"><em>さまざまな住宅プランからお選びいただけます</em></p>
<p>新築・増改築、建売住宅やマンションの購入など、JAの住宅ローンは、さまざまなお客さまのマイホームプランにお役立ていただけます。</p>
<!-- /clm-02 --></div>
<!-- /lyt-clm-01 --></div>

<div class="cnts-box-01-container">
<div class="cnts-box-01-inner">
<div class="cnts-box-01">
<ul class="list-u-01">
<li>テキストテキストテキストテキストテキストテキストテキスト</li>
<li>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</li>
<li>テキストテキストテキストテキストテキストテキストテキストテキストテキスト</li>
</ul>
<!-- /cnts-box-01 --></div>
<!-- /cnts-box-01-inner --></div>
<!-- /cnts-box-01-container --></div>
<li>
</ul>

<!-- ignore --></div>
```
*/
/*
#(ex)box-rates

```
<!-- ignore --><div class="w690">

<div class="cnts-box-01-container">
<div class="cnts-box-01-inner">
<div class="cnts-box-01">
<div class="lyt-clm-01">
<div class="clm-01 w98">
<p><img width="72" height="26" alt="金利について" src="/common/images/img_caution_01.gif"></p>
<!-- /clm-01 --></div>
<div class="clm-02 w548">
<p class="mgb15">金利などのご融資条件は、各JAによって異なりますので、本サイトには表示しておりません。<br>
詳しくはお近くのJAまでお問合せください。</p>
<ul class="list-link-01">
<li class="mgb00"><a href="/tenpo_atm/">店舗・ATM検索</a></li>
</ul>
<!-- /clm-02 --></div>
<!-- /lyt-clm-01 --></div>
<!-- /cnts-box-01 --></div>
<!-- /cnts-box-01-inner --></div>
<!-- /cnts-box-01-container --></div>

<!-- ignore --></div>
```
*/
/*
#(ex)box-type-01

```
<!-- ignore --><div class="w690">

<div class="cnts-box-01-container">
<div class="cnts-box-01-inner">
<div class="cnts-box-01">
<p class="txt-l-01 mgb15"><em>テキストテキストテキストテキストテキスト</em></p>
<ul class="list-u-01">
<li>テキストテキストテキストテキストテキストテキストテキスト</li>
<li>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</li>
<li class="mgb00">テキストテキストテキストテキストテキストテキストテキストテキストテキスト</li>
</ul>
<!-- /cnts-box-01 --></div>
<!-- /cnts-box-01-inner --></div>
<!-- /cnts-box-01-container --></div>

<!-- ignore --></div>
```
*/
/*
#(ex)box-type-02

```
<!-- ignore --><div class="w690">

<div class="cnts-box-01-container">
<div class="cnts-box-01-inner">
<div class="cnts-box-01">
<p class="txt-l-01 mgb15"><a href="#"><em>テキストテキストテキストテキストテキスト</em></a></p>
<ul class="list-anc-02">
<li><a href="#">テキストテキストテキスト</a></li>
<li><a href="#">テキストテキストテキストテキスト</a></li>
<li><a href="#">テキストテキスト</a></li>
<li><a href="#">テキストテキストテキストテキストテキスト</a></li>
<li class="mgb00"><a href="#">テキストテキストテキストテキスト</a></li>
</ul>
<!-- /cnts-box-01 --></div>
<!-- /cnts-box-01-inner --></div>
<!-- /cnts-box-01-container --></div>

<!-- ignore --></div>
```
*/
/*
#(ex)lyt-type-01

```
<div class="lyt-clm-01 w336">
<div class="clm-01 w148">
<p class="mgb10">width:148px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="148" height="94"></p>
<p class="txt-s-01 ta-c">キャプション</p>
<!-- /clm-01 --></div>
<div class="clm-02 w148">
<p class="mgb10">width:148px<br><img src="/_element/images/img_dummy_01.gif" alt="" width="148" height="94"></p>
<p class="txt-s-01 ta-c mgb30">キャプション</p>
<!-- /clm-02 --></div>
<!-- /lyt-clm-01 --></div>

```
*/
/*
#(ex)tbl-type-01

```
<!-- ignore --><div class="w690">

<table class="tbl-data-01" cellspacing="0">
<colgroup>
<col style="width:30%;">
<col style="width:70%;">
</colgroup>
<thead>
<tr>
<th class="ta-c" colspan="2">テキストテキスト</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="2" class="in-tbl-01">
<div class="lyt-clm-tbl-01">
<div class="clm-tbl-01 set-height-tbl-01">
<p class="ta-c">テキストテキスト<br>
<img src="/_element/images/img_dummy_01.gif" width="242" height="73" alt=""></p>
<!-- /clm-tbl-01 --></div>
<div class="clm-tbl-02 set-height-tbl-01">
<ul class="list-img-01 ta-c">
<li>
<p class="ta-c">テキストテキスト<br>
<img src="/_element/images/img_dummy_01.gif" width="114" height="73" alt=""></p>
</li>
<li>
<p class="ta-c">テキストテキスト<br>
<img src="/_element/images/img_dummy_01.gif" width="114" height="73" alt=""></p>
</li>
<li>
<p class="ta-c">テキストテキスト<br>
<img src="/_element/images/img_dummy_01.gif" width="114" height="73" alt=""></p>
</li>
</ul>
<!-- /clm-tbl-02 --></div>
<!-- /lyt-clm-tbl-01 --></div>
</td>
</tr>
<tr>
<th>テキスト</th>
<td>テキスト</td>
</tr>
</tbody>
</table>

<!-- ignore --></div>

```
*/
@media print {
  #utility-01,
  #f-size-container,
  #search-01,
  #gnav-01,
  #gnav-child-01,
  .pagetop,
  .bnr-area-01,
  #breadcrumbs-container,
  .ftr-container-01,
  .list-ftr-01,
  #breadcrumbs-container,
  #sub-contents,
  #list-voice {
    display: none;
  }

  body {
    background: #FFF;
  }

  #cnts-container {
    background: white !important;
  }

  #main-contents {
    float: none;
    margin: 0 auto;
  }

  #header-01 {
    margin: 0;
    height: 70px;
  }

  #header-01 .header-inner-01 {
    padding-bottom: 10px;
    height: 70px;
  }

  #logo-01 {
    padding: 10px;
    position: static;
  }

  #footer-01 {
    background: #FFF;
  }

  body {
    _zoom: 0.7 !important;
  }
}