/* #mainImg
================================================ */
#mainImg { background: url("/img/energy/bg_main_energy01_sp.png") no-repeat center center/cover; margin-top: 0; padding-top: 50px; }

#mainImg .inner { position: static; }

#mainImg .inner:before { display: none; }

/*#mainImg .tit { font-family: 'Roboto', sans-serif; font-size: 3rem; line-height: 1.3; font-weight: 700; letter-spacing: .04em; }*/

@media all and (min-width: 600px) { #mainImg { background: url("/img/energy/bg_main_energy01_pc.png") no-repeat center center/cover; margin-top: 95px; padding-top: 0; }
  #mainImg .inner:before { display: none; }
/*  #mainImg .tit { line-height: 1; font-size: 5rem; } */ }

/*  #lnav
================================================== */
#lnav .list { min-width: 960px; }


/*  装飾
================================================== */

/*　lbl テキストの水色　*/
.lbl { color:#1cace1}
/*　bl テキストの青色　*/
.bl { color:#0174bd}

 .newstxt { margin-bottom: 7px; line-height: 1.85; font-weight: 400; }
@media all and (min-width: 600px) {
 .newstxt { margin-bottom: 7px; font-size: 1.6rem; font-weight: bold; }
}


.mini  {  font-size: 0.9em; }
.mgr-3em{margin-right : 3em;}


/*　 ↓右寄せで文字を左揃え<div class="right_left"><p></p></div>　*/
.right_left{
  text-align:right;
}
.right_left p{
  display:inline-block;
  text-align: left;
}

/*  ※  */
 .kome { display: block; font-size: 1.1rem ; color: #666; text-indent: -1.5rem; padding-left: 15px; }
 .kome + .kome { margin-top: 0; }

@media all and (min-width: 600px) {
    .kome { font-size: 1.3rem ; text-indent: -1.6rem; padding-left: 10px; } } 


/*　 ステップ　*/

.step{
  list-style-type: none;
  display:table;
  width:100%;
  padding:0;
  margin:0;
  overflow:hidden;
}
.step li{
 font-size:0.95em;
  font-weight: bold;
  text-align: center;
  display:table-cell;
  position:relative;
  background: #009de6;
  padding: 1em 0.5em 1em 1em;
  color: #fff;
}
.step li:last-child{
  padding-right: 1em;
}
.step li:last-child:before,
.step li:last-child:after{
  display:none;
}
.step li:before,
.step li:after{
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  margin: auto;
}
.step li:before{
  top:-15px;
  right:-1.1em;
  border-style: solid;
  border-color: transparent transparent transparent #fff;
  border-width: 40px 0 40px 1em;
  z-index: 10;
}
.step li:after{
  top:-15px;
  right:-.75em;
  border-style: solid;
  border-color: transparent transparent transparent #009de6;
  border-width: 40px 0 40px 1em;
  z-index: 10;
}
.step li.step-a{
  background: #0052a0;
}
.step li.step-a:after{
  border-color: transparent transparent transparent #0052a0;
}
.step li.step-b{
  background: #0079c4;
}
.step li.step-b:after{
  border-color: transparent transparent transparent #0079c4;
}
@media all and (min-width: 600px) { 
 .step li{
 font-size:1.25em;
 padding: 0.5em 0.5em 0.5em 2em;}
}



/* 2つ並びの影付き枠 */
.main {
  display: -webkit-flex;
  display: flex;
}

.main section {
  -webkit-flex: 1;
  flex: 1;
  margin: 8px;
  padding: 5px 10px;
  background: #fff;
  box-shadow: 0 2px 6px #ccc;
}
.main h1 {
  color: #195aa5;
  font-size: 1.25rem;
font-weight: bold;
  margin-bottom: 10px;
}
@media all and (min-width: 600px) { 
.main section {
  -webkit-flex: 1;
  flex: 1;
  margin: 10px;
  padding: 10px 20px 20px 20px;
  background: #fff;
  box-shadow: 0 2px 6px #ccc;
}
.main h1 {
  font-size: 1.8rem;
  margin-bottom: 15px;
}
}

/*  #can
================================================== */
#can .txt { margin-bottom: 15px; }
#can .list { margin-bottom: 15px; }
#can .list + .txt { margin-bottom: 20px; }
#can .list + .list { margin-top: -13px; }
#can .img_box { margin-bottom: 25px; }
#can .subTit + .list { margin-bottom: 25px; }
#can .box { margin-bottom: 25px; }
#can .table th span { display: block; font-size: 1.2rem; font-weight: 400; }
#can .copy { margin-bottom: 5px; font-size: 1.5rem; font-weight: 700; }

@media all and (min-width: 600px) { #can .txt { margin-bottom: 30px; }
  #can .listBox { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  #can .listBox .list { width: 50%; }
  #can .listBox .list + .list { margin-top: 0; }
  #can .list { margin-bottom: 30px; }
  #can .list + .txt { margin-bottom: 40px; }
  #can .list + .list { margin-top: -13px; }
  #can .img_box { margin-bottom: 40px; }
  #can .subTit + .list { margin-bottom: 40px; }
  #can .subTit + .txt { margin-bottom: 20px; } 
  #can .tit { margin-bottom: 30px; }
  #can .box { margin-bottom: 55px; }
  #can .box + .txt { margin-bottom: 22px; }
  #can .area { margin-top: -7px; }
  #can .areaTxt + .areaTxt { margin-top: 28px; }
  #can .table th span { font-size: 1.4rem; }
  #can .copy { margin-bottom: 5px; font-size: 1.8rem; }  
}


/*  #pass
================================================== */
#pass .tit { margin-bottom: 20px; }

#pass .subTit { margin-bottom: 6px; }

#pass .txt { margin-bottom: 20px; }

#pass .box + .box { margin-top: -16px; }

#pass .box + .box .img_box { margin-bottom: 0; }

#pass .box .copy { margin-bottom: 5px; font-size: 1.5rem; font-weight: bold; }

#pass .areaBtn { margin: 40px -18px 0 -18px; padding: 25px 45px; background: #f3f3f3; }
#pass .areaBtn .btn { margin-top: 0; }
#pass .areaBtn .btn a { height: auto; padding: 13px 0 14px; line-height: 1.4; text-align: center; }

@media all and (min-width: 600px) { #pass .tit { margin-bottom: 27px; }
  #pass .subTit { margin-bottom: 13px; }
  #pass .txt { margin-bottom: 30px; }
  #pass .area { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  #pass .box { width: calc(50% - 15px); }
  #pass .box .list { margin-bottom: 41px; }
  #pass .box + .box { margin-top: 0; margin-left: 30px; }
  #pass .box + .box .list { margin-bottom: 41px; }
  #pass .box .copy { margin-bottom: 7px; font-size: 1.8rem; }
  #pass .box .img_box .item { width: auto; }

  #pass .areaBtn .btn { max-width: 350px; width: 350px; margin: 0 auto; }
  #pass .areaBtn .btn a { padding: 20px 0 19px; } }


/*  #romram
================================================== */
#romram .imgBox { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 25px; }
#romram .imgBox .img_box { /* width: 50%; */ -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; margin-bottom: 0; }
#romram .imgBox .area { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }
#romram .subTit { margin-bottom: 5px; font-size: 1.5rem; font-weight: 700; }
#romram .txt { margin-bottom: 20px; }
#romram .areaBox { margin-bottom: 30px; }
#romram .areaBox .box .txt { margin-bottom: 10px; }
#romram .areaBox .box + .box { margin-top: 25px; }
#romram .img_box { margin-bottom: 20px; }
#romram .texts .txt + .txt { margin-top: 20px; }
#romram .areaBtn { margin: 0 -18px; padding: 25px 45px; background: #f3f3f3; }
#romram .areaBtn .btn { margin-top: 0; }
#romram .areaBtn .btn + .btn { margin-top: 10px; }
#romram .areaBtn .btn a { height: auto; padding: 13px 0 14px; line-height: 1.4; text-align: center; }

@media all and (min-width: 600px) { #romram .imgBox { margin-bottom: 35px; }
  #romram .imgBox .img_box { /* width: calc(50% - 15px); */ -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; margin-bottom: 0; }
  #romram .imgBox .area { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }
  #romram .subTit { margin-bottom: 5px; font-size: 1.8rem; }
  #romram .txt { margin-bottom: 40px; }
  #romram .areaBox { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 70px; }
  #romram .areaBox .box { width: calc(50% - 15px); box-sizing: border-box; }
  #romram .areaBox .box .txt { margin-bottom: 20px; }
  #romram .areaBox .box + .box { margin-top: 0; }
  #romram .img_box { margin-bottom: 50px; }
  #romram .texts { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 50px; }
  #romram .texts .txt { width: calc(50% - 15px); box-sizing: border-box; margin-bottom: 0; }
  #romram .texts .txt + .txt { margin-top: 0; }
  #romram .areaBtn { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; margin: 0; padding: 25px 100px; }
  #romram .areaBtn .btn { max-width: 280px; width: 280px; margin-top: 0; }
  #romram .areaBtn .btn a { height: 85px; }
  #romram .areaBtn .btn a:before { height: 85px; }
  #romram .areaBtn .btn + .btn { margin-top: 0; margin-left: 30px; } 
 }


/*  #package
================================================== */
#package .txt { margin-bottom: 15px; }
#package .list { margin-bottom: 15px; }
#package .list + .txt { margin-bottom: 20px; }
#package .list + .list { margin-top: -13px; }
#package .img_box { margin-bottom: 25px; }
#package .subTit + .list { margin-bottom: 25px; }
#package .box { margin-bottom: 25px; }
#package .table th span { display: block; font-size: 1.2rem; font-weight: 400; }
#package .copy { margin-bottom: 5px; font-size: 1.5rem; font-weight: 700; }

@media all and (min-width: 600px) { #package .txt { margin-bottom: 30px; }
  #package .listBox { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  #package .listBox .list { width: 50%; }
  #package .listBox .list + .list { margin-top: 0; }
  #package .list { margin-bottom: 30px; }
  #package .list + .txt { margin-bottom: 40px; }
  #package .list + .list { margin-top: -13px; }
  #package .img_box { margin-bottom: 40px; }
  #package .subTit + .list { margin-bottom: 40px; }
  #package .subTit + .txt { margin-bottom: 20px; } 
  #package .tit { margin-bottom: 30px; }
  #package .box { margin-bottom: 55px; }
  #package .box + .txt { margin-bottom: 22px; }
  #package .area { margin-top: -7px; }
  #package .areaTxt + .areaTxt { margin-top: 28px; }
  #package .table th span { font-size: 1.4rem; }
  #package .copy { margin-bottom: 5px; font-size: 1.8rem; }  }

/*  #spec
================================================== */
#spec .imgBox { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 25px; }
#spec .imgBox .img_box { /* width: 50%; */ -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; margin-bottom: 0; }
#spec .imgBox .area { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }
#spec .subTit { margin-bottom: 5px; font-size: 1.5rem; font-weight: 700; }
#spec .txt { margin-bottom: 20px; }
#spec .areaBox { margin-bottom: 30px; }
#spec .areaBox .box .txt { margin-bottom: 10px; }
#spec .areaBox .box + .box { margin-top: 25px; }
#spec .img_box { margin-bottom: 20px; }
#spec .texts .txt + .txt { margin-top: 20px; }
#spec .areaBtn { margin: 0 -18px; padding: 25px 45px; background: #f3f3f3; }
#spec .areaBtn .btn { margin-top: 0; }
#spec .areaBtn .btn + .btn { margin-top: 10px; }
#spec .areaBtn .btn a { height: auto; padding: 13px 0 14px; line-height: 1.4; text-align: center; }

@media all and (min-width: 600px) { #spec .imgBox { margin-bottom: 35px; }
  #spec .imgBox .img_box { /* width: calc(50% - 15px); */ -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; margin-bottom: 0; }
  #spec .imgBox .area { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }
  #spec .subTit { margin-bottom: 5px; font-size: 1.8rem; }
  #spec .txt { margin-bottom: 40px; }
  #spec .areaBox { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 70px; }
  #spec .areaBox .box { width: calc(50% - 15px); box-sizing: border-box; }
  #spec .areaBox .box .txt { margin-bottom: 20px; }
  #spec .areaBox .box + .box { margin-top: 0; }
  #spec .img_box { margin-bottom: 50px; }
  #spec .texts { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 50px; }
  #spec .texts .txt { width: calc(50% - 15px); box-sizing: border-box; margin-bottom: 0; }
  #spec .texts .txt + .txt { margin-top: 0; }
  #spec .areaBtn { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; margin: 0; padding: 25px 100px; }
  #spec .areaBtn .btn { max-width: 280px; width: 280px; margin-top: 0; }
  #spec .areaBtn .btn a { height: 85px; }
  #spec .areaBtn .btn a:before { height: 85px; }
  #spec .areaBtn .btn + .btn { margin-top: 0; margin-left: 30px; } 

 }


/*  #qa
================================================== */
#qa .txt { margin-bottom: 15px; }
#qa .list { margin-bottom: 15px; }
#qa .list + .txt { margin-bottom: 20px; }
#qa .list + .list { margin-top: -13px; }
#qa .img_box { margin-bottom: 25px; }
#qa .subTit + .list { margin-bottom: 25px; }
#qa .box { margin-bottom: 25px; }
#qa .table th span { display: block; font-size: 1.2rem; font-weight: 400; }
#qa .copy { margin-bottom: 5px; font-size: 1.5rem; font-weight: 700; }

@media all and (min-width: 600px) { #qa .txt { margin-bottom: 30px; }
  #qa .listBox { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  #qa .listBox .list { width: 50%; }
  #qa .listBox .list + .list { margin-top: 0; }
  #qa .list { margin-bottom: 30px; }
  #qa .list + .txt { margin-bottom: 40px; }
  #qa .list + .list { margin-top: -13px; }
  #qa .img_box { margin-bottom: 40px; }
  #qa .subTit + .list { margin-bottom: 40px; }
  #qa .subTit + .txt { margin-bottom: 20px; } 
  #qa .tit { margin-bottom: 30px; }
  #qa .box { margin-bottom: 55px; }
  #qa .box + .txt { margin-bottom: 22px; }
  #qa .area { margin-top: -7px; }
  #qa .areaTxt + .areaTxt { margin-top: 28px; }
  #qa .table th span { font-size: 1.4rem; }
  #qa .copy { margin-bottom: 5px; font-size: 1.8rem; }  }





/*  #develop
================================================== */
#develop .txt { margin-bottom: 15px; }
#develop .list { margin-bottom: 15px; }
#develop .list + .txt { margin-bottom: 20px; }
#develop .list + .list { margin-top: -13px; }
#develop .img_box { margin-bottom: 25px; }
#develop .subTit + .list { margin-bottom: 25px; }
#develop .box { margin-bottom: 25px; }
#develop .table th span { display: block; font-size: 1.2rem; font-weight: 400; }
#develop .copy { margin-bottom: 5px; font-size: 1.5rem; font-weight: 700; }

@media all and (min-width: 600px) { #develop .txt { margin-bottom: 30px; }
  #develop .listBox { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  #develop .listBox .list { width: 50%; }
  #develop .listBox .list + .list { margin-top: 0; }
  #develop .list { margin-bottom: 30px; }
  #develop .list + .txt { margin-bottom: 40px; }
  #develop .list + .list { margin-top: -13px; }
  #develop .img_box { margin-bottom: 40px; }
  #develop .subTit + .list { margin-bottom: 40px; }
  #develop .subTit + .txt { margin-bottom: 20px; } 
  #develop .tit { margin-bottom: 30px; }
  #develop .box { margin-bottom: 55px; }
  #develop .box + .txt { margin-bottom: 22px; }
  #develop .area { margin-top: -7px; }
  #develop .areaTxt + .areaTxt { margin-top: 28px; }
  #develop .table th span { font-size: 1.4rem; }
  #develop .copy { margin-bottom: 5px; font-size: 1.8rem; }  }


/*  .etc-btn
================================================== */

.etc-btn .areaBtn { margin: 0 -18px; padding: 25px 45px; background: #f3f3f3; }
.etc-btn .areaBtn .btn { margin-top: 0; }
.etc-btn .areaBtn .btn a { height: auto; padding: 13px 0 14px; line-height: 1.4; text-align: center; }

@media all and (min-width: 600px) { 
  .etc-btn .areaBtn .btn { max-width: 350px; width: 350px; margin: 0 auto; }
  .etc-btn .areaBtn .btn a { padding: 20px 0 19px; }  }




