@charset "shift_jis";

#procedure em{
font-weight:bold;
font-style:normal;
color:#666666;
}

/* -----------------
Base
--------------------*/
#procedure{
width:763px;
}

#procedure img{
vertical-align:bottom;
}

#procedure h1,
#procedure h2,
#procedure h3,
#procedure h4{
margin:0;
padding:0;
}

#procedure p{
margin:0;
padding:0;
}

#procedure a{
text-decoration:underline;
}


/* -----------------
Heading
--------------------*/
#procedure h2.hdg01{
margin-bottom:14px;
background:#ffeccf url(/library/join/images/bg_hdg21_b.gif) left bottom no-repeat;
color:#ff4d00;
font-size:90%;
line-height:1.1;
}

#procedure h2.hdg01 span{
padding:9px;
display:block;
background:url(/library/join/images/bg_hdg21_t.gif) left top no-repeat;
}

#procedure h2.hdg02{
margin-bottom:14px;
padding:20px 0 16px 16px;
background:url(/library/join/images/bg_hdg22.gif) left bottom no-repeat;
font-size:100%;
color:#424242;
}


/* -----------------
mainImg
--------------------*/
#procedure .mainImg{
margin-bottom:20px;
background:url(/library/join/images/bg01.jpg) left top no-repeat;
height:249px;
position:relative;
}

#procedure .mainImg h1{
position:absolute;
top:16px;
left:0;
font-size:0;
}

#procedure .mainImg p{
position:absolute;
top:54px;
left:0;
font-size:0;
}

#procedure .mainImg dl{
position:absolute;
top:129px;
left:0;
font-size:0;
}

#procedure .mainImg dd ul{
padding:3px 0 0 9px;
}

#procedure .mainImg dd ul li{
padding-right:10px;
float:left;
}

#procedure .mainImg dd ul li.last{
padding-right:0;
}


/* -----------------
Column
--------------------*/
#procedure .column{
padding-bottom:18px;
width:823px;
overflow:hiddun;
}

#procedure .column.last{
padding-bottom:34px !important;
}

#procedure .column .column01{
margin:0 20px 0 0;
float:left;
width:240px;
}

#procedure .column .column01 h3{
margin-bottom:10px;
background:url(/library/join/images/bg_hdg31_b.gif) left bottom no-repeat;
color:#2b322b;
font-size:90%;
}

#procedure .column .column01 h3 span{
display:block;
background:url(/library/join/images/bg_hdg31_t.gif) left top no-repeat;
}

#procedure .column .column01 h3 span a{
padding:8px 8px 8px 26px;
display:block;
background:url(/library/join/images/bg_hdg3_circle.gif) 8px center no-repeat;
font-weight:bold;
}

#procedure .column .column02{
margin:0 20px 0 0;
float:left;
width:500px;
}

#procedure .column .column02 h3{
margin-bottom:10px;
background:url(/library/join/images/bg_hdg32_b.gif) left bottom no-repeat;
color:#2b322b;
font-size:90%;
}

#procedure .column .column02 h3 span{
display:block;
background:url(/library/join/images/bg_hdg32_t.gif) left top no-repeat;
}

#procedure .column .column02 h3 span a{
padding:8px 8px 8px 26px;
display:block;
background:url(/library/join/images/bg_hdg3_circle.gif) 8px center no-repeat;
text-decoration:underline;
font-weight:bold;
}

#procedure .column .column02 .column03{
width:510px;
overflow:hiddun;
}

#procedure .column .column02 .column03 .text{
padding-right:10px;
float:left;
width:230px;
}

#procedure .column .column02 .column03 .text h4{
margin-bottom:5px;
color:#ff4d00;
font-size:105%;
}

#procedure .column .text{
padding-left:10px;
font-size:90%;
min-height:60px;
_height:60px;
}

#procedure .column .text.icon01{
padding-left:85px !important;
background:url(/library/join/images/icon01.gif) 10px top no-repeat;
}
#procedure .column .text.icon02{
padding-left:85px !important;
background:url(/library/join/images/icon02.gif) 10px top no-repeat;
}
#procedure .column .text.icon03{
padding-left:85px !important;
background:url(/library/join/images/icon03.gif) 10px top no-repeat;
width:160px !important;;
}
#procedure .column .text.icon04{
padding-left:85px !important;
background:url(/library/join/images/icon04.gif) 10px top no-repeat;
}
#procedure .column .text.icon05{
padding-left:85px !important;
background:url(/library/join/images/icon05.gif) 10px top no-repeat;
}

#procedure .column p{
margin-bottom:7px;
}

#procedure .column ul.note01{
padding-top:2px;
margin-bottom:6px;
}
#procedure .column ul.note01 li{
margin-bottom:2px;
font-size:85%;
}

#procedure .column ul.link01 li{
margin-bottom:2px;
padding-left:10px;
background:url(/library/join/images/bg_link01.gif) left 0.3em no-repeat;
}


/* -----------------
Relation
--------------------*/
#procedure .relation{
padding:18px 0 18px 18px;
background:#f5f5f5;
}

#procedure .relation ul{
width:740px;
over-flow:hiddun;
}

#procedure .relation ul li{
margin-bottom:8px;
padding-left:10px;
background:url(/library/join/images/bg_link01.gif) left 0.3em no-repeat;
float:left;
width:230px;
font-size:89%;
}



/* -----------------
ClearFix
--------------------*/
#procedure .mainImg dd ul,
#procedure .column,
#procedure .column .column02,
#procedure .relation ul{
zoom:1;
}

#procedure .mainImg dd ul:after,
#procedure .column:after,
#procedure .column .column02:after,
#procedure .relation ul:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}

/* 2011.12.12 ’Ç‹L
------------------------------ */
#procedure .procedure-grid{
width:747px;
margin:0px 10px;
}
#procedure .procedure-grid a{
color:#06f;
}
#procedure .procedure-grid a:hover{
text-decoration:none;
}
#procedure .procedure-grid h2{
margin:25px 0px 0px 0px;
}
#procedure .procedure-grid h3{
margin:0px 0px 10px 0px;
}
#procedure .procedure-grid .col-01{
margin:15px 0px 10px 0px;
background:url(/library/join/images/bg_change01a.gif) 0px 0px no-repeat;
text-align:center;
}
#procedure .procedure-grid .col-01-bottom{
padding-bottom:13px;
background:url(/library/join/images/bg_change01b.gif) bottom left no-repeat;
}
#procedure .procedure-grid .col-01 p{
width:700px;
margin:0px auto;
padding:13px 0px;
text-align:left;
}
#procedure .procedure-grid .col-01 #href-change01{
width:336px;
height:64px;
margin:0px auto;
background:url(/library/join/images/btn_change01_off.gif) 0px 0px no-repeat;
}
#procedure .procedure-grid .col-01 #href-change01 a{
display:block;
width:100%;
height:100%;
text-indent:-9999px;
overflow:hidden;
}
#procedure .procedure-grid .col-01 #href-change01 a:hover{
background:url(/library/join/images/btn_change01_on.gif) 0px 0px no-repeat;
}

#procedure .procedure-grid .cont-left{
float:left;
}
#procedure .procedure-grid .cont-right{
float:right;
}
#procedure .procedure-grid .cont-left .inner-left{
float:left;
}
#procedure .procedure-grid .cont-left .inner-right{
float:right;
}
#procedure .procedure-grid .col-02 .cont-left{width:490px;}
#procedure .procedure-grid .col-02 .cont-right{width:240px;}
#procedure .procedure-grid .col-02 .cont-left .inner-left{width:240px;}
#procedure .procedure-grid .col-02 .cont-left .inner-right{width:240px;}
#procedure .procedure-grid .col-03 .cont-left{width:240px;}
#procedure .procedure-grid .col-03 .cont-left .inner-left{width:240px;}
#procedure .procedure-grid .col-03 .cont-right{width:494px;}
#procedure .procedure-grid .col-04 .cont-left{width:490px;}
#procedure .procedure-grid .col-04 .cont-right{width:240px;}
#procedure .procedure-grid .col-04 .cont-left .inner-left{width:240px;}
#procedure .procedure-grid .col-04 .cont-left .inner-right{width:240px;}
#procedure .procedure-grid .col-05 .cont-left{width:354px;}
#procedure .procedure-grid .col-05 .cont-right{width:354px;}



#procedure .procedure-grid .list-type01{
margin:0px 0px 0px 10px;
}
#procedure .procedure-grid .list-type01 li{
padding: 0px 0px 0px 12px;
background:url(../../shared/rn_images/icon_arrow01.gif) no-repeat scroll 0 50% transparent;
}
#procedure .procedure-grid .col-02{
margin:15px 0px 0px 0px;
}
#procedure .procedure-grid .col-02 p{
margin:10px 0px 10px 1em;
}
#procedure .procedure-grid .col-02 p .para-note{
font-size:75%;
}
#procedure .procedure-grid .col-02 #cont-icon2{
margin-top:10px;
background:url(/library/join/images/icon02.gif) 10px 0px no-repeat;
min-height:67px;
height:auto!important;
height:67px;
}
#procedure .procedure-grid .col-02 #cont-icon5{
margin-top:10px;
background:url(/library/join/images/icon05.gif) 10px 0px no-repeat;
min-height:67px;
height:auto!important;
height:67px;
}
#procedure .procedure-grid .col-02 #cont-icon2 p,
#procedure .procedure-grid .col-02 #cont-icon5 p{
margin-top:0px;
width:155px;
margin-left:80px;
}
#procedure .procedure-grid .div-link{
background:url(/library/join/images/bg_div_link.gif) 0px 0px no-repeat;
margin:0px 0px 10px 0px;
padding:7px 0px 0px 0px;
}
#procedure .procedure-grid .div-link-bottom{
background:url(/library/join/images/bg_div_link_bottom.gif) bottom left no-repeat;
padding:0px 0px 7px 0px;
}
#procedure .procedure-grid .div-link-bottom ul{
width:222px;
margin:0px 7px 0px 10px;
}
#procedure .procedure-grid .div-link-bottom ul li{
background:url(../../shared/rn_images/icon_arrow01.gif) no-repeat scroll 0 50% transparent;
padding-left:12px;
}
#procedure .procedure-grid ul.list-type03{
width:222px;
margin:0px 7px 24px 10px;
}
#procedure .procedure-grid ul.list-type03 li{
background:url(/library/join/images/bg_link01.gif) left 0.3em no-repeat;
padding-left:10px;
}
#procedure .procedure-grid .col-03{
margin:0px 0px 20px 0px;
}
#procedure .procedure-grid .col-03 p{
margin:10px 0px 10px 1em;
}
#procedure .procedure-grid .col-05{
width:730px;
margin:5px auto 25px;
}
#procedure .procedure-grid .col-05 .cont-left #box-change02{
width:354px;
height:132px;
background:url(/library/join/images/bg_change02.gif) 0px 0px no-repeat;
position:relative;
}
#procedure .procedure-grid .col-05 .cont-right #box-change03{
width:354px;
height:132px;
background:url(/library/join/images/bg_change03.gif) 0px 0px no-repeat;
position:relative;
}
#procedure .procedure-grid .col-05 .cont-left #box-change04{
width:354px;
height:132px;
background:url(/library/join/images/bg_change04.gif) 0px 0px no-repeat;
position:relative;
}
#procedure .procedure-grid .col-05 .cont-right #box-change05{
width:354px;
height:132px;
background:url(/library/join/images/bg_change05.gif) 0px 0px no-repeat;
position:relative;
}
#procedure .procedure-grid .col-05 p{
display:none;
}
#procedure .procedure-grid .col-05 a{
display:block;
width:316px;
height:64px;
position:absolute;
top:54px;
left:19px;
text-indent:-9999px;
overflow:hidden;
}
#procedure .procedure-grid .col-05 #box-change02 a:hover{
background:url(/library/join/images/btn_change02_on.gif) 0px 0px no-repeat;
}
#procedure .procedure-grid .col-05 #box-change03 a:hover{
background:url(/library/join/images/btn_change03_on.gif) 0px 0px no-repeat;
}
#procedure .procedure-grid .col-05 #box-change04 a:hover{
background:url(/library/join/images/btn_change04_on.gif) 0px 0px no-repeat;
}
#procedure .procedure-grid .col-05 #box-change05 a:hover{
background:url(/library/join/images/btn_change05_on.gif) 0px 0px no-repeat;
}
#procedure .procedure-grid .col-06{
width:730px;
margin:0px auto;
}
#procedure .procedure-grid .col-06 ul{
margin:0px;
}
#procedure .procedure-grid a:hover img.btn-onoff{
filter:alpha(opacity:80);
opacity:0.8;
}
#procedure .procedure-grid .col-07{
margin-top:1em;
}
#procedure .procedure-grid .col-07 .list-float1{
width:200px;
margin-left:15px;
float:left;
}
#procedure .procedure-grid .col-07 .list-float2{
width:400px;
margin-left:15px;
float:left;
}
#procedure #hdg-h2-05{
margin:55px 0px 20px 0px;
}
#procedure .procedure-grid em{
color:#f00;
}
.sh-clear{
clear:both;
}