﻿@charset "shift_jis";


/* **************************************************

Name: finnova_prs.css

Description: Setting of  Susume page

Create: 2015.11.20
Update: 2016.02.08

Copyright 2015 Hitachi, Ltd. 

***************************************************** */


/* content===========================================

[m01] section_head
[m02] section_step
[m03] Talk dl
[m04] mb対応
[m99] 共通

===================================================== */


/*---m01 section_head---*/

.Section.head {
	background-color: #f5f5f5;
}

.Section.head p.tgLine {
	width: 730px;
	background-color: #fff;
	margin: 0 auto;
	border: 3px solid #e3e3e3;
	border-radius:10px;
	padding: 1em;
	text-align: center;
	line-height: 1.8;
}

.Section.head table {
	width: 730px;
	margin: 60px auto;
	border-left: 1px solid #e3e3e3;
}

.Section.head table th,
.Section.head table td {
	border: none;
	font-size: 100%;
}


.Section.head table tr th {
	background-color: #006979;
	color: #fff;
	font-weight: bold;
	border-right: 1px solid #7ca1a7;
	border-bottom: 1px solid #e3e3e3;
	border-left: none;
	border-top: none;
	text-align: center;
	vertical-align:middle;
	font-size: 120%;
	padding: 1em;
}

.Section.head table tr th.btn {
}

.Section.head table tr th.mlt {
	width: 50%;
}

.Section.head table tr th.fnc {
	width: 40%;
}



.Section.head table tr td {
	background-color: #fff;
	border-right: 1px solid #e3e3e3;
	border-bottom: 1px solid #e3e3e3;
	border-left: none;
	padding: 1em;
}

.Section.head table tr td.nBdb {
	border-bottom: none;
	padding-bottom: 0 ;
}


.Section.head table tr td ul li {
	list-style-type:disc;
	margin-left: 1.2em;
	font-size: 100%;
}

.Section.head table tr td ul.me li {

}

.Section.head table tr td ul.fn li {
	color: #006979;
	font-weight: bold;

}





/*---m02 section_step---*/


.StepArea {
	background-image: url(/-/media/solution/br/finnova/prs/image/bg_section_step.jpg);
}

.stepHead {
	background-color: #f5f5f5;
}

.stepHead .titleFlow {
	margin: 0 auto 0 auto;
	width: 816px;
	
}

.stepHead .HorizontalInnerLinks,
.HorizontalInnerLinks.out {
	padding: 20px 0;
	margin: 0 auto 0 auto;
	width: 816px;
}


.stepHead .HorizontalInnerLinks ul,
.stepHead .HorizontalInnerLinks ul {

}

.stepHead .HorizontalInnerLinks.out li,
.stepHead .HorizontalInnerLinks.out li {
	display: inline-block;
	float: none;
}



.Section.step {
	background-image: url(/-/media/solution/br/finnova/prs/image/ico_down_arrow.png);
	background-repeat: no-repeat;
	background-position: center 95%;
	padding-bottom: 11em;
	
}


.Section.step h2 {
	padding: 0;
	margin: 0;
	border: none;
	
}

.Section.step .stepBox {
	margin: 40px auto 30px auto;
	width: 816px;
	background-color: #fff;
}

.Section.step .stepBox ul.stepImgUl,
.Section.step .stepBox ul.stepImgUl li {
	padding: 0;
	margin: 0;
}

.Section.step .stepBox ul.stepImgUl li {
	float: left;
}

.Section.step .stepBox ul.stepImgUl li img {
	vertical-align:bottom;
}



.Section.step .stepBox .stepBoxBottom {
	clear: both;
	padding: 30px;
}

.Section.step .stepBox .stepBoxBottom h3 {
	color: #006979;
	font-weight: bold;
	border: none;
	background-image: none;
	font-size: 120%;
	margin-bottom: 0.4em;
	background-color: inherit;
	clear: both;
	
}

.Section.step .stepBox .stepBoxBottom p {
	line-height: 1.8;
	margin-bottom: 2em;
}

.Section.step .stepBox .stepBoxBottom p img.flL {
	float: left;
	padding-right: 1.6em;
}


/* lastBox */

.lastBox {
	margin: 45px auto 30px auto;
	width: 816px;
	background-color: #fff;
}

.lastBox .detaList {
}

.lastBox .detaList h3 {
	border: none;
	background-color: inherit;
	color: #333;
	font-size: 110%;
	padding: 0;
	margin-top: 50px;
}

.lastBox .detaList h4 {
	font-size: 100%;
	color: #fff !important;
	background-color: #006979 !important;
	padding: 0.8em;
	font-weight: bold;
	margin: 0;
}

.lastBox .detaList h4:before {
	display: none;
}


.lastBox .detaList dl {
	margin: 0 auto 30px auto;
	width: 816px;
	font-size: 90%;
}

.lastBox .detaList dl .gr {
	background-color: #e5f0f1;
}

.lastBox .detaList dl dt,
.lastBox .detaList dl dd {
	padding: 0.6em;
}

.lastBox .detaList dl dt {
  float : left;
  clear : both;
  width: 22%;
  overflow: hidden;
  }

.lastBox .detaList dl dd {
	padding-left: 22%;
  overflow: hidden;
}


table.dlTable {
	margin: 0 auto 30px auto;
	width: 816px;
	font-size: 90%;
}


table.dlTable tr td {
	border: none;
	font-size: 100%;
	vertical-align:middle;
	background-color: #e5f0f1;
}

table.dlTable tr.cellWhite td {
	background-color: #fff;
}


table.dlTable tr td.dtCell {
	width: 22%;
}


/*---m04 ---*/


/* for 995px -
=========================================================================================== */

@media screen and (min-width: 995px) {

}


/* for - 994px
=========================================================================================== */

@media screen and (max-width: 994px) {
.Section.head p.tgLine {
	width: 86%;
}

.lastBox {
	width: 90%;
}

.Section.head table {
	width: 90%;
}

.Section.step .stepBox {
	width: 90%;
}

.stepHead .HorizontalInnerLinks,
.HorizontalInnerLinks.out,
.stepHead .titleFlow {
	width: 90%;
}

table.dlTable {
	width: 100%;
	font-size: 90%;
}

.JS #Contents .Section.head table tr td img {
	max-width: 70px;
}

.Section.step .stepBox ul.stepImgUl {
	overflow: hidden;
}

.Section.step .stepBox ul.stepImgUl li {
	width: 50%;
}

.Section.step .stepBox ul.stepImgUl li.clb {
	width: 100%;
}


}


/* for - 767px
=========================================================================================== */

@media screen and (max-width: 767px) {

.Section.head p.tgLine {
	font-size: 90%;
	padding:0.7em;
}

.Section.head table tr td ul li {
	font-size: 90%;
}


.JS #GlobalNaviTopButtonSP {
	display: none;
}

}


/* for - 579px
=========================================================================================== */

@media screen and (max-width: 579px) {
.Section.step .stepBox ul.stepImgUl li {
	float: none;
}

.Section.step .stepBox ul.stepImgUl li {
	width: 100%;
}

.Section.step .stepBox {
	width: 90%;
	max-width: 408px;
}

.JS #Contents .Section.step .stepBox ul.stepImgUl li.clb img {
	max-width: 200%;
	margin: 0 -50%;
}

table.dlTable tr td.dtCell {
	width: 36%;
}



}


/* for - 399px
=========================================================================================== */

@media screen and (max-width: 399px) {


.Section.head p.tgLine {
	width: 90%;
	text-align: left;
}

.lastBox {
	width: 96%;
}

.Section.head table {
	width: 96%;
}

.Section.step .stepBox {
	width: 96%;
}

.stepHead .HorizontalInnerLinks,
.HorizontalInnerLinks.out,
.stepHead .titleFlow {
	width: 96%;
}

.JS #Contents .Section.head table tr td {
	padding:0.4em
}

.JS #Contents .Section.head table tr td img {
	max-width: 50px;
}



}





/*---m99 ---*/




p.imgNom {
	margin: 0;
	padding: 0;
}

.contactArea {
	text-align: center;
	margin-bottom: 60px;
}

.mt60 {
	margin-top: 60px;
}

.HorizontalInnerLinks.out {
}
