@charset "UTF-8";


/* 共通
-------------------------------------------------- */
body{
background-color:#FFF;
}

.br-pc{
display:none;
}

/*レイアウト
----------------------------------------------------*/
#wrapper{
margin:0;
padding:5px;
}


/* section・.cont-outer・.cont-inner
-------------------------------------------------- */
section{
margin:0 auto;
padding:1em 0.5em;
font-size:120%;
text-align:left;
background-color:#FFF;
color:#333;
}

.cont-outer{
margin:0 auto;
padding:1em 0;
}

.cont-inner{
max-width:1100px;
margin:0 auto;
text-align:center;
}

/* .cont-header
--------------------------------------------------*/ 
.cont-header{
display:none;
}


/*top-main
----------------------------------------------------*/
section.top-main{
padding:1em 0;
text-align:left;
}

#main-image{
text-align:center;
}

#main-image img{
width:100%;
height:auto;
}

#main-image img.pc-top{
display:none;
}

#main-title{
position:relative;
margin:0.5em auto 1em;
padding:1em;
background-color:#008EFF;
color:#FFF;
}

#main-title h1{
padding:0em 0 0.5em;
font-size:100%;
}

#main-title p{
text-align:left;
padding:0 1em;
}

#main-title img{
position:absolute;
right:0;
bottom:-30%;
max-width:200px;
height:auto;
}



/* 応募ボタン
------------------------------- */
.application{
margin:2em auto;
text-align:center;
}

.application a{
display:block;
max-width:280px;
margin:0 auto;
padding:0;
text-align:center;
font-size:110%;
background-color:#FF8200;
text-decoration:none;
padding:8px 0;
color:#FFF;
}

.application a:hover,
.application a:focus{
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter:"alpha(opacity=70)";
}


/* 特長
------------------------------- */
.feature{
margin:3em auto;
padding:1em;
text-align:center;
}

.feature h2{
margin:0.5em 0;
font-size:180%;
line-height:1.2;
color:#008EFF;
text-align:left;
}

.outline-img{
position:relative;
max-width:1100px;
margin:0 auto;
}


.outline-tagline.p01{
position:absolute;
left:0;
top:-10px;
max-width:30%;
height:auto;
}

.outline-tagline.p02{
position:absolute;
right:0;
top:0;
max-width:30%;
height:auto;
}

.outline-tagline.p03{
position:absolute;
right:0;
bottom:-25px;
max-width:30%;
height:auto;
}

.outline-tagline.p04{
position:absolute;
left:-8px;
bottom:-30px;
max-width:30%;
height:auto;
}


.feature p.discription{
max-width:1100px;
margin:1em auto;
padding:1em 1em 0;
font-size:160%;
color:#008EFF;
text-align:left;
}

.feature p.detail{
max-width:1100px;
margin:1em auto;
padding:0 1em 1em;
font-size:120%;
color:#666;
text-align:left;
}

.feature div.notes{
max-width:1100px;
margin:1em auto;	
}

.feature p.note{
padding:0 1em 1em;
font-size:14px;
margin-left:1em;
padding-left:1em;
text-indent:-1em;
text-align:left;
}


/* 特長３ */

.comparison{
max-width:1000px;
margin:0 auto;
padding:1em 0;
}

.comparison img.pc-comparison{
display:none;
}


/* 特長４ */

.charging{
max-width:1000px;
margin:0 auto;
padding:1em 0;
color:#888;
}

.charging h3{
font-size:140%;
text-align:left;
}

.charging-inner{
position:relative;
border:#888 solid 5px;
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;	
}


div.triangle{
margin:0 auto;
}

div.triangle{
width:0;
height:0;
margin:0 auto -20px;
background:transparent;
border-top:20px solid #888;
border-left:20px solid transparent;
border-bottom:20px solid transparent;
border-right:20px solid transparent;  
}

.charging-inner .catch-img{
margin:0;
padding:0;
}

.charging-inner p,
.charging-inner .link-b{
margin:10px;
padding:0;
}

.charging-inner p{
text-align:left;
font-size:120%;
}

.link-b:hover{
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter:"alpha(opacity=70)";
}



/* リーフモニターキャンペーンの流れ
------------------------------- */
#flow{
position:relative;
max-width:1000px;
margin:2em auto;
padding:1em 2em;
}

#outline{
position:relative;
padding:0.5em 2em;
background-color:#008EFF;
text-align:left;
color:#FFF;
}

#flow h2{
margin-top:1em;
padding:0.5em;
font-size:140%;
text-align:left;
font-weight:normal;
}

p.top-catch{
font-size:120%;
margin:0.2em 0.2em 1em;
padding-left:0.2em;
border-left:#FFF solid 4px;
}

#outline ol{
margin:1em;
}

#outline ol li{
margin-left:1em;
padding:0.2em;
list-style-type:decimal;
}


#outline ol li:first-child {
color:#FF0;
font-weight:700;
}

#outline p.note{
font-size:90%;
margin-left:3em;
padding-left:1em;
padding-bottom:0.2em;
text-indent:-1em;
}


p.bottom-exp{
margin:1em 0.2em 1em;
padding-left:0.2em;
}



.arrow{
margin:2em auto;
text-align:center;	
}

#flow dl{
margin:1em auto;
}

#flow dl dd{
padding:5px;;
text-align:left;
}

.leaf-img{
position:absolute;
top:-45px;
right:20px;

width:20%;
height:auto;
}



/* 応募ボタン
------------------------------- */
.application-button{
clear:left;
margin:1em auto;
max-width:100%;
height:auto;
text-align:center;
}

.application-button a:hover{
position:relative;
top:1px;
left:1px;
}




/*日産販売会社
----------------------------------------*/

#nissan-dealer{
background-color:#FFF;	
}

#nissan-dealer h2{
margin:0 0 1em !important;
padding:1em 0 0 !important;
font-size:120% !important;
color:#333!important;
text-align:center;
}

#dealer-cont{
max-width:1000px;
margin:0 auto;
padding:10px;
}

.links{
display:inline-block;
width:44%;
margin:2%;
vertical-align:top;
text-align:left;
}

.links dt{
text-align:left;
font-weight:700;
border-bottom:#C00 solid 1px;
}

.links dd{
margin-left:0.2em;
}

.links dd i{
color:#C00;
}

.links dd a{
width:100%;
display:block;
text-align:left;
margin:0;
margin-left:-0.2em;
padding:0.4em;
text-decoration:none;
color:#333;
-moz-transition:0.5s linear;
-webkit-transition:0.5s linear;
-o-transition:0.5s linear;
transition:0.5s linear;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
font-weight:700;
}

.links dd a:hover{
background-color:rgba(255,255,255,0.8);
filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#CCFFFFFF, endcolorstr=#CCFFFFFF, gradienttype=0)\9;/* IE9以下対策 */
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
}



/*フッター
----------------------------------------------------*/
footer{
position:relative;
clear:both;
height:100%;
padding:10px 0;
text-align:center;
color:#CCC;
background-color:#282828;
}


#return-top {
position:fixed;
display:block;
z-index:10;
right:10px;
bottom:10px;
background:#111;
background:rgba(0,0,0,.6);
-webkit-border-radius:8px;
-moz-border-radius:8px;
border-radius:8px;
-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,.4);
-moz-box-shadow: 0px 0px 3px rgba(0,0,0,.4);
box-shadow: 0px 0px 3px rgba(0,0,0,.4);
list-style-type:none;
margin:0;
padding:0;
line-height:1;
}

#return-top li {
display:block;
margin:4px;
text-align:center;
}

#return-top a {
display:block;
color:#fff;
padding:0 12px 4px;
font-size:16px;
text-decoration:none;
opacity:0.8;
-ms-filter: "alpha( opacity=80 )";
filter: alpha( opacity=80 );
}

#return-top a i{
display:block;
font-size:30px;
margin-bottom:2px;
}

#return-top a:hover {
text-decoration:none;
opacity:1.0;
-ms-filter: "alpha( opacity=100 )";
filter: alpha( opacity=100 );
}



@media (min-width:700px) {
	
.br-sp{
display:none;
}

.br-pc{
display:block;
}


/* .cont-header
-------------------------------------------------- */
.cont-header{
display:block;
position:relative;
margin:0 auto;
padding:1em 0 0;
}

.cont-header{
max-width:1100px;
}

.leaflogo img{
max-width:100%;
height:auto;
}


/*top-main
----------------------------------------------------*/
#main-title h1{
padding:0em 0 0.5em;
font-size:120%;
}

#main-image img.sp-top{
display:none;
}

#main-image img.pc-top{
display:block;
}

/* 応募ボタン
------------------------------- */
.application a{
display:block;
max-width:400px;
margin:0 auto;
padding:0;
text-align:center;
font-size:130%;
background-color:#FF8200;
text-decoration:none;
padding:8px 0;
color:#FFF;
}


/* 特長
------------------------------- */
.feature h2{
letter-spacing:3px;
}

.comparison img.sp-comparison{
display:none;
}

.comparison img.pc-comparison{
display:block;
}


/*日産販売会社
----------------------------------------*/

#nissan-dealer{
clear:both;
}

#nissan-dealer h2{
font-weight:700;
}

.links{
display:inline-block;
*display:inline;/* IE7対策 */
*zoom:1;/* IE7対策 */
width:22%;
margin:1%;

vertical-align:top;
}

.links dt{
padding-bottom:0.3em;
text-align:center;
font-size:100%;
}

.links dd{
text-align:left;
padding:0.2em;
}


}


@media (min-width:800px) {
	

/* 特長４ */

.charging-inner{
text-align:left;
}

div.triangle{
width:0;
height:0;
margin:0 auto;
background:transparent;
border-top:20px solid transparent;
border-right:20px solid transparent;  
border-bottom:20px solid transparent;
border-left:20px solid #888;
}


.charging-inner .catch-img,
.charging-inner p,
.charging-inner .link-b{
margin:0 1% 0 0;
padding:0;
}

.charging-inner .triangle,
.charging-inner .catch-img,
.charging-inner p,
.charging-inner .link-b{
display:inline-block !important;
vertical-align:middle;
}


.charging-inner p{
border-left:#888 solid 5px;
padding-left:2em;
}

.charging-inner .catch-img{
width:25%;
}

.charging-inner p{
width:32%;
}

.charging-inner .link-b{
width:24%;
}


/* リーフモニターキャンペーンの流れ
------------------------------- */
#flow h2{
margin-top:0;
font-size:180%;
}


}


@media (min-width:900px) {
	
/*top-main
----------------------------------------------------*/
#main-title p{
text-align:center;
}


/* 特長
------------------------------- */
.feature h2{
font-size:200%;
text-align:center;
}


/* 特長４ */

.charging-inner .catch-img{
width:25%;
}

.charging-inner p{
width:36%;
}

.charging-inner .link-b{
width:24%;
}


}



@media (min-width:1100px) {
	
/* 特長
------------------------------- */
.feature h2{
font-size:240%;
}

/* 特長４ */

.charging-inner .catch-img{
width:25%;
}

.charging-inner p{
width:38%;
}

.charging-inner .link-b{
width:24%;
}


/* リーフモニターキャンペーンの流れ
------------------------------- */
#flow h2{
padding:0.5em;
font-size:260%;
}

p.top-catch{
font-size:160%;
margin:0.2em 0.2em 1em;
padding-left:0.2em;
border-left:#FFF solid 4px;
}



}