@charset "utf-8";


/*=====================================
　お役立ちコンテンツページ用css
======================================*/

/*--- pageTop */

div.pageTop {
	margin: 16px 0;
	overflow: hidden;
}

* html div.pageTop {  
    height: 1%;  
}

div.pageTop img{
	width: 121px;
	
}

div.pageTop a{
	display:block;
	float:right;
	width:121px;
	height:29px;
}
div.pageTop a:hover {
	background: url(/images/text/page_top_o.gif) left top no-repeat;
}
div.pageTop a:hover img{
	visibility:hidden;
}

/*--- usefulContentSubNav

background:url(../images/useful-con/nav-line.gif) left bottom repeat;
 */

div#usefulContentSubNav ul{
	width: 180px;
	border-bottom: 1px double #ccc;
}

div#usefulContentSubNav ul.last{
	background: none;
}

div#usefulContentSubNav ul li{
	padding: 8px 0 8px 28px;
	border-bottom: 1px dashed #ccc;
	line-height: 150%;
	min-height: 17px;
	height: auto !important;
	height: 17px;
}

div#usefulContentSubNav ul li.ep01{
	background: url(/images/text/nav_num01.gif) 6px 8px no-repeat;
}

div#usefulContentSubNav ul li.ep02{
	background: url(/images/text/nav_num02.gif) 6px 8px no-repeat;
}

div#usefulContentSubNav ul li.ep03{
	background: url(/images/text/nav_num03.gif) 6px 8px no-repeat;
}

div#usefulContentSubNav ul li.ep04{
	background: url(/images/text/nav_num04.gif) 6px 8px no-repeat;
}

div#usefulContentSubNav ul li.ep05{
	background: url(/images/text/nav_num05.gif) 6px 8px no-repeat;
}

div#usefulContentSubNav ul li.ep06{
	background: url(/images/text/nav_num06.gif) 6px 8px no-repeat;
}

div#usefulContentSubNav ul li.ep07{
	background: url(/images/text/nav_num07.gif) 6px 8px no-repeat;
}

div#usefulContentSubNav ul li.ep08{
	background: url(/images/text/nav_num08.gif) 6px 8px no-repeat;
}

div#usefulContentSubNav ul li.last{
	border-bottom: none;
}

p.firstStepLink a{
	display:block;
	width:180px;
	height:39px;
}
p.firstStepLink a:hover {
	background: url(/images/text/nav_subtitle01_o.gif) left top no-repeat;
}
p.firstStepLink a:hover img{
	visibility:hidden;
}

p.questionLink a{
	display:block;
	width:180px;
	height:39px;
}
p.questionLink a:hover {
	background: url(/images/text/nav_subtitle02_o.gif) left top no-repeat;
}
p.questionLink a:hover img{
	visibility:hidden;
}

p.reportLink a{
	display:block;
	width:180px;
	height:39px;
}
p.reportLink a:hover {
	background: url(/images/text/nav_subtitle03_o.gif) left top no-repeat;
}
p.reportLink a:hover img{
	visibility:hidden;
}




/*--- common */

a:link {
	text-decoration:underline;
}

div#usefulContentBox a:link {
	color:#cc9933;
}

div#usefulContentSubNav a:visited {
	color:#666;
}

div#usefulContentSubNav a:link {
	color:#666;
	display: block;
}


div#usefulContentBox a:visited {
	color:#cc9933;
}

a:hover {
	text-decoration:none;
}

#usefulContent {
	width:900px;
	margin:0 auto;
	padding-top:23px;
	overflow: hidden;
}

* html #usefulContent {  
    height: 1%;  
}

div#usefulContentSubNav {
	width: 180px;
	float: left;
	border-bottom: 3px #4b1f23 solid;
}

div#usefulContentBox {
	width: 690px;
	float: right;
}

.firstStep h2{
	width: 690px;
	margin: 0;
	padding: 0;
	vertical-align: bottom;
}

div#titleLead {
	width: 670px;
	margin: 0;
	padding: 20px 10px;
}

.firstStep div#titleLead {
	background: url(/images/text/01/title_bg.gif) 548px top no-repeat;
}

.question div#titleLead{
	background: url(/images/text/02/title_bg.gif) 540px top no-repeat;
}

.report div#titleLead{
	background: url(/images/text/03/title_bg.gif) 540px top no-repeat;
}

div#titleLead p{
	line-height: 150%;
}

.firstStep .explainUseful {
	margin:12px 16px 12px 16px;
	padding: 4px 8px 8px 8px;
	line-height:1.5;
	color:#613530;
	border-bottom: 1px dashed #ccc;
}

.firstStep .normalText {
	padding:0 24px 16px 24px;
	line-height:170%;
	color:#666666;
}

.firstStep .specialText {
	padding:0 24px 8px 24px;
	line-height:170%;
	color:#666666;
}

#usefulContent .h5text {
	width: 658px;
	margin: 0 auto;
	margin-bottom:20px;
	border:solid 1px #ccc;
}



#usefulContent .firstStep dl.h5text {
	padding:13px 0;
	margin-bottom:12px;
}

#usefulContent .question dl.h5text {
	padding:13px 0;
}


#usefulContent .h5text dt {
	padding:0 15px 6px;
	font-weight:700;
	color:#333333;
}

#usefulContent .h5text dd {
	padding:0 28px 12px;
}


/*--- firstStepPage */

.firstStep {
	margin-bottom: 24px;
}


/*--- ///ep1 */

.firstStep div.stepBox,
.report div.stepBox {
	width: 688px;
	border-top: 3px #613530 solid;
	border-left: 1px #ccc solid;
	border-right: 1px #ccc solid;
	border-bottom: 1px #ccc solid;
}


.firstStep div.stepBox h3 {
	background:#ececec url(/images/text/01/ep_title.gif) no-repeat left top;
	color:#333333;
	border-bottom: dashed 1px #b3b3b3;
	font-weight:700;
	line-height:1.5;
	padding: 6px;
	overflow: hidden;
}

* html .firstStep div.stepBox h3,
* html .report div.stepBox h3 {  
    height: 1%;  
} 

.firstStep div.stepBox h3 img,
.report div.stepBox h3 img {
	height: 25px;
	padding: 0 8px 0 0;
	float: left;
}

.firstStep div.stepBox h3 span,
.report div.stepBox h3 span {
	display: block;
	margin-top: 3px;
	font-size: 120%;
}




.question div.stepBoxTop {
	background: url(/images/text/02/step_box_bg.gif) no-repeat left top;
	padding-top: 13px;

}

.question div.stepBox {
	width: 688px;
	border-top: none;
	border-left: 1px #ccc solid;
	border-right: 1px #ccc solid;
	border-bottom: 1px #ccc solid;
}

.question div.stepBox h3 {
	background: #ececec url(/images/text/02/step_box_bg2.gif) no-repeat left top;
	border-bottom: dashed 1px #b3b3b3;
	font-weight:700;
	padding: 12px 6px 2px 6px;
	margin: 0;
}
 


.question div.stepBox h3 span {
	display: block;
	padding: 0;
	margin: 0;
	padding-left: 80px;
	font-size: 120%;
	min-height: 26px;
	height: auto !important;
	height: 26px;
}




.firstStep p#ep1Box1 {
	background: url(/images/text/01/ep01_img01.gif) left top no-repeat;
	padding: 8px 0 16px 140px;
	margin: 12px 16px 24px 16px;
}

dl.ep01 {
	width:642px;
	margin: 12px 0 12px 16px;
	overflow: hidden;
	background: url(/images/text/01/ep01_step_bg.gif) left bottom repeat-y;
	
	
}

* html dl.ep01 {  
    height: 1%;  
} 

.firstStep dl.ep01 dt{
	width:128px;
	float: left;
	font-weight: bold;
	color: #a17956;
	padding: 12px 0 0 62px;
	line-height: 140%;
	min-height: 44px;
	height: auto !important;
	height: 44px;
}

.firstStep dl.ep01 dt.step1 {
	background: url(/images/text/01/ep01_step01.gif) 20px 8px no-repeat; 
}

.firstStep dl.ep01 dt.step2 {
	background: url(/images/text/01/ep01_step02.gif) 20px 8px no-repeat; 
}

.firstStep dl.ep01 dt.step3 {
	background: url(/images/text/01/ep01_step03.gif) 20px 8px no-repeat; 
}

.firstStep dl.ep01 dt.step4 {
	background: url(/images/text/01/ep01_step04.gif) 20px 8px no-repeat; 
}

.firstStep dl.ep01 dt.step5 {
	background: url(/images/text/01/ep01_step05.gif) 20px 8px no-repeat; 
}

.firstStep dl.ep01 dt.step6 {
	background: url(/images/text/01/ep01_step06.gif) 20px 8px no-repeat; 
}

.firstStep dl.ep01 dt.step7 {
	background: url(/images/text/01/ep01_step07.gif) 20px 8px no-repeat; 
}

.firstStep dl.ep01 dt.step8 {
	background: url(/images/text/01/ep01_step08.gif) 20px 8px no-repeat; 
}



.firstStep dl.ep01 dd{
	width:430px;
	vertical-align: top;
	padding: 8px 0;
	float: right;
	line-height: 170%;
}

.firstStep dl.ep01 dd span{
	color: #d38571;
	font-weight: bold;
}

div.stepEndBox{
	width: 658px;
	margin: 24px auto 16px auto;
	background: url(/images/text/01/ep01_end_bottombg.gif) 590px bottom no-repeat;
}

div.stepEndBox div.stepEndBoxMiddle{
	background: url(/images/text/01/ep01_end_middle.gif) left top repeat-y;
}

div.stepEndBox div.stepEndBoxMiddle p{
	background: url(/images/text/01/ep01_end_bg.gif) 24px top no-repeat;
	font-weight: bold;
	color: #a17956;	
	line-height: 150%;
	padding:0 10px 0 150px;
	min-height: 74px;
	height: auto !important;
	height: 74px;
}

div.stepEndBox div.stepEndBoxBottom{
	background: url(/images/text/01/ep01_end_bottom.gif) left bottom no-repeat;
	padding-bottom:20px;
}



/*--- ///ep2 */

div.stepBoxTitle{
	width: 658px;
	margin: 0 auto 8px auto;
	background: url(/images/text/01/step_box_title_bg.gif) left bottom no-repeat;
	padding-bottom:6px;
}

* html div.stepBoxTitle {  
    height: 1%;  
} 

div.stepBoxTitle div{
	background:url(/images/text/01/step_box_title_bg.gif) left top no-repeat;
}

div.stepBoxTitle div h4,
div.stepBoxTitle div h5{
	padding:8px 10px 0 4px;
	color: #815935;
	font-weight: bold;
}

div.stepBoxTitle div span{
	color: #fff;
	padding: 0 4px 0 8px;
}

div.stepBoxText {
	width: 658px;
	margin: 4px auto;
	line-height: 150%;
	overflow: hidden;
}

div.stepBoxText p{
	line-height: 150%;
	padding: 8px;
}

div.ep02img {
	width: 80px;
	float: left;
	margin: 12px 0 0 12px;
	display: inline;
}

p.ep02text {
	width: 530px;
	float: right;
}

/*--- ///ep3 */

table.ep3ItemBox {
	width:658px;
	margin: 8px 0 24px 14px;
	border: 1px solid #ccc;
	border-collapse:collapse;
}

table.ep3ItemBox th{
	vertical-align: top;
	padding: 8px 8px 0 8px;
}

table.ep3ItemBox th.last{
	vertical-align: top;
	padding: 8px;
}

table.ep3ItemBox th img{
	padding: 3px;
	background: url(/images/text/01/ep03_img_bg.gif) left top no-repeat;
}

table.ep3ItemBox td{
	vertical-align: top;
	padding: 8px 8px 8px 0;
}

table.ep3ItemBox dl{
	margin-top: 4px;
}

table.ep3ItemBox dt{
	margin-bottom: 1px;
}

table.ep3ItemBox dd{
	width: 220px;
	line-height: 140%;
}

ul.ep03check li{
	background: url(/images/text/01/check_icon.gif) no-repeat left top;
	margin-left: 12px;
	text-indent: 4px;
}

ul#ep3Box1 {
	background: url(/images/text/01/ep03_img01.gif) 566px 10px no-repeat;
}

ul#ep3Box2 {
	background: url(/images/text/01/ep03_img02.gif) 566px 10px no-repeat;
}

ul#ep3Box3 {
	background: url(/images/text/01/ep03_img03.gif) 566px 10px no-repeat;
}

/*--- ///ep4 */


/*--- ///ep5 */

div.stepBoxTitle2{
	width: 658px;
	margin: 0 auto 8px auto;
	background: url(/images/text/01/step_box_title_bg2.gif) left bottom no-repeat;
	padding-bottom:6px;
}

* html div.stepBoxTitle2 {  
    height: 1%;  
} 

div.stepBoxTitle2 div{
	background:url(/images/text/01/step_box_title_bg2.gif) left top no-repeat;
}

div.stepBoxTitle2 div h4,
div.stepBoxTitle2 div h5{
	padding:9px 10px 0 16px;
	color: #FFFFFF;
	font-weight: bold;
	background: url(/images/text/step_box_title_t.gif) 7px 7px no-repeat;
	min-height: 16px;
	height: auto !important;
	height: 16px;
}

div.stepBoxTitle2 div span{
	color: #fff;
	padding: 0 4px 0 8px;
}

ul#ep5Box1 {
	background: url(/images/text/01/ep05_img01.gif) 530px 10px no-repeat;
}

ul#ep5Box2 {
	background: url(/images/text/01/ep05_img02.gif) 530px 10px no-repeat;
}


/*--- questionPage */

.question {
	margin-bottom: 24px;
}

.answerComment {
	margin:12px 16px 12px 20px;
	padding: 2px 4px 0 100px;
	line-height:170%;
	background: url(/images/text/02/answer.gif) left top no-repeat;
	min-height: 75px;
	height: auto !important;
	height: 75px;
}

#usefulContent ul.h5text {
	padding-top: 16px;
}


/*--- ///ep1 */

.question dl#ep1Box1 {
	background: url(/images/text/02/ep01_img01.gif) 530px 10px no-repeat;
}

.question dl#ep1Box2 {
	background: url(/images/text/02/ep01_img02.gif) 530px 10px no-repeat;
}


.question dl#ep1Box1 dd,
.question dl#ep1Box2 dd{
	line-height: 80%;
}

/*--- ///ep2 */

.question dl.ep02 dd{
	line-height: 150%;
}



/*--- ///ep3 */
.question ul#ep1Box1 {
	background: url(/images/text/02/ep03_img01.gif) 520px 4px no-repeat;
}


/*--- ///ep7 */
.question dl#ep7Box1 {
	background: url(/images/text/02/ep07_img01.gif) 560px 10px no-repeat;
}

.question dl#ep7Box2 {
	background: url(/images/text/02/ep07_img02.gif) 560px 10px no-repeat;
}


.question dl#ep7Box1 dd,
.question dl#ep7Box2 dd{
	line-height: 80%;
}


/*--- reportPage */

.report {
	margin-bottom: 24px;
}

.report .stepBoxTitle a { 
	background: url(/images/text/03/link_icon.gif) left top no-repeat;
	padding: 0 0 0 15px;
	margin-left: 4px;
}

.report .explainUseful {
	margin:12px 16px 12px 16px;
	padding: 4px 4px 8px 4px;
	line-height:1.5;
	border-bottom: 1px dashed #ccc;
}

.report .normalText {
	padding:4px 24px 16px 24px;
	line-height:1.5;
	color:#666666;
}

/*--- ///ep1 */

.report h3 {
	color:#333333;
	border-bottom: dashed 1px #b3b3b3;
	font-weight:700;
	line-height:1.5;
	padding: 6px;
	overflow: hidden;
	min-height: 25px;
	height: auto !important;
	height: 25px;
}

.report h3.ep01 {
	background:#ececec url(/images/text/03/ep01_img01.gif) no-repeat right top;
}

.report h3.ep02 {
	background:#ececec url(/images/text/03/ep01_img02.gif) no-repeat right top;
}

.report h3.ep03 {
	background:#ececec url(/images/text/03/ep01_img03.gif) no-repeat right top;
}

.report h3.ep04 {
	background:#ececec url(/images/text/03/ep01_img04.gif) no-repeat right top;
}

.report h3.ep05 {
	background:#ececec url(/images/text/03/ep01_img05.gif) no-repeat right top;
}








.firstStep .step4 dl {
	margin-top:15px;
}
.question {
	padding-bottom:9px;
}

.question .step1 h4 {
	color:#cc9933;
}

.question .step3 ul,
.question .step5 ul{
	margin-top:12px;
}

.report .step5 {
	padding-bottom:12px;
}
.report h4 {
	color:#cc9933;
}

#usefulContent h2 {

}

/*
#usefulContent h3 {
	width: 688px;
	margin: 0;
	padding-top:8px;
	padding-bottom:4px;
	background:#ececec url(../images/useful-con/01/ep-title.gif) no-repeat left top;
	color:#333333;
	font-weight:700;
	line-height:1.5;
	border-bottom:solid 1px #b3b3b3;
}
*/




#usefulContent .lead {
	padding-bottom:20px;
	color:#333333;
	line-height:1.5;
}

.firstStep #usefulContent .explainBottom {
	padding-bottom:19px;
}



.firstStep #usefulContent ul.h5text {
	padding-top:12px;
	margin-top: 8px;
}

#usefulContent ul.h5text li {
	padding:0 15px 13px;
}
