@charset "utf-8"

body{
}

p,h1,h2,h3,h4,h5,dt,dd,th,td,li{
    font-family: メイリオ, Meiryo, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}

a img:hover{
    filter:alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;
}

#wrapper{
	width: 100%;
}
/*----------------------header----------------------------*/


#header{
	width: 100%;
	height: auto;
}

#logo{
	width:100%; max-width: 1000px;
    margin: 20px auto;
    text-align: left;
}

#logo .appliLink { float:right; margin:-30px 20px 10px 20px;}

@media only screen and (max-width: 640px) {
#header .appliLink { display:none;}
}



#menu{
	background: #006ae4;
	width: 100%;
	overflow:hidden; 
	padding-bottom: 17px;
}


ul.header-nav-list {
	width: 1040px;
	margin: 0 auto;
}

ul.header-nav-list li {
	width:16.6%;
	float: left;
	font-size:16px;
	margin-top: 17px;
	text-align: center;
}

ul.header-nav-list li a{
	text-decoration: none;
	color: #ffffff;
}

ul.header-nav-list li a:hover{
	text-decoration: underline;
}









#nav-toggle{ 
 display: none;
}



@media only screen and (max-width: 960px) {
    #menu li{
    width: 33%;
  }

}




@media only screen and (max-width: 640px) {


#nav-toggle{
    position: absolute;
    right: 15px;
    top: 20px;
    display: block;
    color: #3680e3;
    width: 40px;
    height: 36px;
    text-align: center;
    line-height: 36px;
}

#menu {
    display: none;
    width: 100%;
    background: #f0f2f5;
    margin: 0;
    padding: 0;
}

#menu li {
    width: 100%;
    margin: 0;
    padding: 0;
    border-top: #fff solid 1px;
    text-align: left;
}

#menu li a {
    display: block;
    color: #245db4;
    text-decoration: none;
    padding: 10px 20px;
    position: relative;
}

#menu li a:after {
    content: '\f054';
    font-family: "FontAwesome";
    position: absolute;
    top: 10px;
    right: 20px;
}
 
}


h2{
	background-color: #fcf7bf;
	width: 100%;
	height: auto;
	font-size: 30px;
	font-weight: 600;
	text-align: center;
	color: #006ae3 ;
	padding:3px;
	padding: 20px 0;
	margin-bottom: 20px;
}



/*----------------------header----------------------------*/









/*----------------------contentstop----------------------------*/

#contentstop{
	width: 100%;
}

#contentstop .mainvisual{
	text-align: center;
}
#contentstop .catchcopy{
    margin-top: 30px;
}

.img-top{
	width: 100%;
	height: auto;
	margin: auto;
}

.img-top img{
	display: block;
	margin: auto;
}

.top-contents{
	width: 900px;
	height: auto;
	margin-top: 150px;
	margin-left: auto;
	margin-right: auto;

}

.if{
	width: 900px;
	margin: 30px auto;
}

.if table tr td p span{
	font-size: 20px;
}
.if table tr td p {
	font-size: 11px;
}


/*---------------１０秒診断-----------------*/

#applicationMENU{
	width: 900px;
	height: auto;
	margin: 50px auto;
}

.applicationMENU{
	background-color: #eeeeee;
	margin-top: 20px;
	margin-bottom: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	padding: 30px 0;
}


.applicationh3{
	width: 300px;
	margin: auto;
	padding: 5px 15px;
	background-color: #FFFFFF;
	text-align: center;
	font-size: 18px;
		color: #000;
		margin-bottom: 10px;
}



}
.applicationbutton{
	margin: auto;
}

.applicationbutton img{
	float: left;
	padding-left: 50px;
	padding-top: 10px;
	
}

#applicationMENU p{
	clear: both;
	padding-top: 10px;
	font-size: 13px;
	padding-left: 50px;
	line-height: normal;
}

#applicationMENU p.posiCenter{
    text-align: center;
    font-size: 14px;
    margin-top: 10px;
}

 
 
#applicationMENU span a{
	color: #6ac5eb;
	text-decoration: none;

}

/*---------------１０秒診断-----------------*/
/*----------------------contentstop----------------------------*/










/*-----------------------Choose---------------------------*/

#Choose{
	width: 900px;
	height: 500px;
	margin: auto;
}

#Choose h2{
	margin-bottom: 20px;
} 


.Choosebnr{
	margin-left: 10px;
}

.Choosebnr li{
	list-style-type:none;
	padding-right: 5px;
	float: left;
}

/*-----------------------Choose---------------------------*/











/*-----------------------limitcontents---------------------------*/

#limitcontents{
	margin: 20px auto;
	clear: both;
	width: 900px;
}

#limitcontents table{
	width: 600px;
	height: 95px;
	margin-top: 8px;
	margin-left: 180px;
	font-size: 25px;
}

#limitcontents table tr td span{
	color: #FA0004;
}

#limitcontents img{
	display: block;
	margin: auto;
}

#limitcontents p{
	width: 657px;
	font-size: 13px;
	margin :auto;
	padding: 20px 0;
	line-height:normal;
	
}


/*-----------------------limitcontents---------------------------*/














/*-----------------------repayment---------------------------*/
#repaymentcontents{
	margin: 0 auto;
	clear: both;
	width: 900px;
}

#repaymentcontents table{
	width: 800px;
	height: 95px;
	margin-left: 60px;
	margin-bottom: 20px;
	font-size: 30px;
}


#repaymentcontents table tr td span{
	color: #FA0004;
}


#repaymentcontents p{
	width: 657px;
	height: auto;
	font-size: 10px;
	margin :auto;
	
}


#repaymentcontents img{
	display: block;
	margin: auto;
}


/*-----------------------repayment---------------------------*/















/*-----------------------use---------------------------*/
#usecontents{
	margin: 0 auto;
	clear: both;
	width: 900px;
	padding-top: 20px;
}

#usecontents table{
	width: 500px;
	height: 65px;
	margin-top: 8px;
	margin-left: 185px;
	font-size: 20px;
}

.usecontents{
	background-color: #1b6ccf;
	width: 500px;
	height: 25px;
	margin: auto;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-top: 10px;
	line-height: 1.3em;
}

#usecontents h3{
	font-size: 20px;
	color: #ffffff;
	text-align: center;
	margin-bottom: 20px;
}

#usecontents img{
	display: block;
	margin: auto;
}
/*-----------------------use---------------------------*/














/*-----------------------visitorvoice---------------------------*/
#visitorvoice{
	width: 900px;
	height: auto;
	margin: 50px auto;
}

#fukidashi{
	margin: 30px auto;
}

.visitorvoice p{
	width: 680px;
	margin-top: -133px;
	margin-bottom: 50px;
	margin-left: 195px;
	font-size: 14px;
	line-height: 20px;

}

.visitorvoice p span{
	display: block;
	font-size: 20px;
	color: #FA0004;
}

/*-----------------------visitorvoice---------------------------*/













/*-----------------------Q%A---------------------------*/

#QA{
width: 900px;
height: 700px;
margin:  auto;
padding-bottom: 50px;
}

#QA h2{
	margin: 50px auto;
}

.qa{
	width: 90%;
	height: auto;
	border: #fbdade 3px solid;
	margin: 20px auto;

}


dl{
width:100%;
}


dt {
font-size: 20px;
background: #fbdade url(shimizubankMaterial/Card_loa_page/qicon.png) no-repeat 5px 10px local border-box  content-box;
}

dt p{
	padding: 5px 30px;
}

dd span{
font-size: 20px;
	color: #fd4b59;
}

dd{
font-size: 14px;
	background: #fff url(shimizubankMaterial/Card_loa_page/aicon.png)no-repeat 5px 10px local border-box  content-box;
}

dd p{
		padding: 5px 30px;

}

/*-----------------------Q%A---------------------------*/











/*-----------------------application---------------------------*/
#applicationcontents{
	width: 900px;
	height: auto;
	margin:  auto;
}

#Headline{
	width: 600px;
	height: 150px;
	margin:auto
}

#Headline2{
	width: 700px;
	height: 150px;
	margin:auto;
}

#applicationcontents span{
	font-size: 18px;
	color: #fd4b59;
}


#applicationtable{
	margin-top: 20px;
}

#applicationtable2{
	margin-top:  80px;
}


#Headline p{
	display: block;
	margin-top: -110px;
	margin-left: 80px;
	font-size: 20px;
	line-height: 50px;
}

#Headline2 p{
	display: block;
	margin-top: -90px;
	margin-left: 80px;
	font-size: 20px;
}

#Headline2 p span{
	display: block;
	margin-top: 20px;
}

#Headline2 img{
	display: block;
	margin-top: -20px;
	width: 8%;
}

.applicationtable{
	margin-top: -40px;
}

.applicationtable p{
	margin-top: 15px;
	margin-bottom: 30px;
	font-size: 13px;
	line-height: 1.5;
}



/*-----------------------application---------------------------*/




#applicationhasanaccount{
	width: 900px;
	height: 200px;
	margin: auto;
	border: #1b6ccf solid 2px;
}

#applicationhasanaccount h2{
	background-color: #1b6ccf;
	font-size: 25px;
	color: #ffffff;
	padding-top: 10px;
	padding-bottom: 10px;
	text-align: center;
}
	
.applicationhasanaccount{
	width: 800px;
	height: auto;
	margin: auto;
	padding-top: 10px;
}

.applicationhasanaccount p{
	font-size: 14px;
	line-height: 25px;
}


.applicationhasanaccount ul il{
	font-size: 14px;
	line-height: 25px;
	display: block;	
}

.applicationhasanaccount a{
		text-decoration: none;
	color: #6ac5eb;
}


#hasordinarydeposit{
	text-align: center;
	margin-top: 50px;
}

#hasordinarydeposit{
	font-size: 14px;
	line-height: 25px;

}

#hasordinarydeposit p{
    margin: 15px 0;
}



.phonebox{
    text-align: center;
    margin-top: 30px;
}
.phonebox p{
    margin-top: 10px;
}



/*-----------------------footer---------------------------*/
footer{
	width: 100%;
	text-align: center;
	margin-top: 50px;
	background-color: #006aeb;
}

#footerCopyright{
	width: 1040px;
	margin: 0 auto;
	padding: 20px 0;
}

#footerCopyright p{
	font-size: 14px;
	color: #fff;
	text-align: left;
}

/*-----------------------footer---------------------------*/





































.brsp{
    display: none;
}
.brpc{
    display: block;
}
	

/*レスポンシブ
*/
/*	/* メニュー変更でいじったところ・ここから*/

@media screen and (max-width: 960px) {

ul.header-nav-list {
	width: 100%;
}
ul.header-nav-list li {
	width: 33.33%;
}
	
	
	
h2{
	background-color: #fcf7bf;
	width: 100%;
	height: auto;
	font-size: 20px;
	font-weight: 600;
	color: #006ae3 ;
	padding:3px;
	margin: auto;
}	

	
/* 各エリアのレスポンシブ化 */
#Choose, #limitcontents, #usecontents, #applicationcontents, #visitorvoice, #repaymentcontents {
width: 100%;
margin:  auto;
padding-bottom: 50px;
}
		

	
	
/*------------------------q&a--------------------------*/	
	
	
#QA{
width: 100%;
height: auto;
margin:  auto;
padding-bottom: 50px;
}

#QA h2 img{
	width: 150%;
	margin: auto;
}

.qa{
	width: 90%;
	height: auto;
	border: #fbdade 3px solid;
	margin: 20px auto;

}


dl{
width:100%;
}


dt {
font-size: 16px;

}


dd span{
font-size: 16px;
}

	
/*------------------------q&a--------------------------*/	
	
	
/*-----------------------footer---------------------------*/
	
	footer{
		width: 100%;
	}
	
	footer img{
		width:  80%;
	}
	
/*-----------------------footer---------------------------*/
	

}






@media screen and (max-width: 640px) {
 
 #applicationhasanaccount h2{
     font-size: 20px;
 }
 
 
 .applicationtable p{
     margin-left: 15px;
     margin-right: 15px;
 }
 
 #Headline{
     height: auto;
 }
 
 #Headline p{
     line-height: 1.5;
     margin-top: -100px;
 }
 #Headline2 p{
     margin-left: 40px;
     margin-top: -55px;
 }
  #Headline2 p span{
     margin-top: 0px;
 }
 #repaymentcontents img{
     width: 90%;
     margin: 0 auto;
 }
 
 .applicationtable img{
    display: block;
     width: 95%;
     margin: 0 auto;
 }
 
 #logo {
 	 margin-left:20px;
     width: auto;
 }
 
.brsp{
    display: block;
}
.brpc{
    display: none;
}

#limitcontents table,
#repaymentcontents table,
#usecontents table{
    width: auto;
    margin-top: 20px;
    margin-left: 20px;
    margin-right: 20px;
    font-size: 20px;
}
#usecontents h3{
    margin-bottom: 10px;
}

#Headline2{
    width: auto;
    height: auto;
}

.applicationtable{
    margin-top: 20px;
}

#applicationhasanaccount{
    width: auto;
    height: auto;
}
.applicationhasanaccount{
    width: auto;
    padding: 20px;
}

.usecontents {
    width: auto;
    height: auto;
    margin: auto;
    padding-top: 10px;
    margin-top: 20px;
}

#Headline{
    width: auto;
}

.visitorvoice p{
    width: auto;
    margin-left: 100px;
    margin-top: -55px;
}


#limitcontents p{
    width: auto;
    margin: 0 15px;
    font-size: 13px;
}

/*----------------------header----------------------------*/
img{
    max-width: 100%;
    height: auto;
}

#header{
	width: 100%;
	height: auto;
}

#logo img{
    text-align: center;
}


.top-contents{
    width: auto;
}

.if{
    width: auto;
}


ul.header-nav-list li {
	width: 50%;
}

/*----------------------header----------------------------*/
	

h2{
	background-color: #fcf7bf;
	width: 100%;
	height: auto;
	font-size: 20px;
	font-weight: 500;
	text-align: center;
	color: #006ae3 ;
	padding:10px 0;
}
	
	
	
/*---------------１０秒診断-----------------*/

#applicationMENU{
	width: 90%;
	height: auto;
	margin: auto;
}

	
	#applicationMENU img{
	width: 100%;
	float: none;
	padding-left: 0;
	padding-top: 10px;
		margin: auto;
	
}
	
	.applicationh3 {
    width: 230px;
    height: 25px;
    margin: auto;
    background-color: #FFFFFF;
    text-align: center;
    font-size: 16px;
		color: #000;}
	
	#applicationMENU p{
	width: 95%;
		margin: auto;
	padding-top: 10px;
	padding-left: 0;
	line-height: normal;
	font-size: 14px;
	}

    #Choose{
        height: auto;
    }
    
	.Choosebnr li{
    	float: none;
    	text-align: center;
    	margin-bottom: 15px;
	}
	
	.applicationbutton{
		width: 95%;
		margin: auto;
	}
	
	#footerCopyright{
    	width: auto;
	}
	#footerCopyright p{
	    text-align: center;
	}
}
/*---------------１０秒診断-----------------*/


/*---------------清水銀行アプリ　リンクバナー-----------------*/
.appliLink { text-align:center;}
#applicationMENU .appliLink p { margin:25px auto 15px auto; padding:0 50px 0 0;}
.fontLred { font-size:24px; color:#F00; font-weight:bold;}
.fontLblue { font-size:24px; color:#0C397F; font-weight:bold;}

@media screen and (max-width: 640px) {
.appliLink { margin-bottom:20px;}
#applicationMENU .appliLink p { width:100%; margin:15px 0; padding:0;}
.fontLred,
.fontLblue { font-size:20px;}
.appliLink span { white-space:nowrap;}
}
/*---------------清水銀行アプリ　リンクバナー-----------------*/