/* #mainImg
================================================ */
/* @include mq(sp){
	#echonet #gHeader{
		background: none;
	}
} */
#echonet #mainImg { background: url("../../img/energy/bg_main_energy01_sp.png") no-repeat center center/cover; margin-top: 0; padding-top: 50px; }

#echonet #mainImg .inner { position: static; }

#echonet #mainImg .inner:before { display: none; }

#echonet #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) { #echonet #mainImg { background: url("../../img/energy/bg_main_energy01_pc.png") no-repeat center center/cover; margin-top: 95px; padding-top: 0; }
  #echonet #mainImg .inner:before { display: none; }
  #echonet #mainImg .tit { line-height: 1; font-size: 5rem; } }


/*  装飾
================================================== */

/*　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; }
}


/* ふわふわ効果 */
.fluffy{
	width: 100%;
	animation: fluffy 4s ease infinite;
}

@keyframes fluffy{
  0%, 40%, 60%, 80% {
    transform: scale(1.0);
  }
  50%, 70% {
    transform: scale(0.95);
  }
}
/* フローティングバナーのラップ要素 */
#fixed_right_banner
{
    /* 右端の下からの位置に固定表示 */
    z-index: 5;
    position: fixed;
    bottom: 160px;
    right: 10px;
}
 
/* 画像の共通設定 */
#fixed_right_banner > *{
    clear: both;
    float: right;
    /* 右側からの距離 */
    margin-right: 10px;
filter: drop-shadow(5px 5px 5px #aaa);
}
/* 画像の共通設定 */
#fixed_right_banner > *{
    /* アニメーション設定を追加。 */
    -webkit-transition: margin .2s ease;
    transition: margin .2s ease;
} 

/* 2個目以降の画像の上部に余白を作る */
#fixed_right_banner > * ~ * { margin-top: 20px; }

/* リンク要素 */
#fixed_right_banner > a{
    /* ブロック要素に変更 */
    display: block;
}
 
/* マウスオーバーで、詰めた右側のマージンをリセット。 */
#fixed_right_banner > *:hover{
    margin-right: 10px;
}
 
/* コンテンツに被らないようにするメディアクエリ */
@media (max-width: 600px){
    #fixed_right_banner img{width: 80%; height: auto; }/* */
    #fixed_right_banner > *{position: fixed; bottom: 30px; right: 0;}
    #fixed_right_banner > *{clear: both; margin-right: -40px;}/* 右側からの距離 */
    #fixed_right_banner > *:hover{margin-right: -40px;}
    /*#fixed_right_banner { display: none; } */
}


/*  #search
================================================== */
#search .inner01 { padding: 0; }

@media all and (min-width: 600px) { #search { margin-top: 110px; }
  #search .inner01 { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } }

/*  #application
================================================== */
#application { margin-top: -185px; margin-left: 18px; margin-right: 18px; padding-top: 220px; }

#application .inner { padding: 25px; border: solid 1px #016cb1; }

#application .tit { text-align: center; position: relative; margin-bottom: 20px; }

#application .tit:before { position: absolute; content: ''; width: 30px; height: 30px; background: url(../../img/common/ico_application01.png) no-repeat; background-size: contain; top: 0; left: 50%; margin-left: -103px; }

#application .txt { margin-bottom: 25px; }

#application .areaBtn .link { padding-left: 20px; }

#application .areaBtn .link a { font-weight: bold; color: #016cb1; text-decoration: none; position: relative; }

#application .areaBtn .link a:before { position: absolute; content: ''; width: 13px; height: 13px; top: 4px; left: -20px; background: url(../../img/common/ico_arw01.png) no-repeat; background-size: contain; }

#application .areaBtn .link + .link { padding-top: 5px; }

#application .areaBtn .btn { margin-top: 0; }

#application .areaBtn .btn + .btn { margin-top: 10px; }

#application .areaBtn .btn a { padding: 10px 0 12px; }

@media all and (min-width: 600px) { #application { width: 540px; margin: 0; padding-top: 230px; margin-top: -150px; }
  #application .inner { width: auto; padding: 35px 40px 40px; }
  #application .tit:before { top: -1px; margin-left: -155px; width: 48px; height: 48px; }
  #application .txt { margin-bottom: 42px; }
  #application .areaBtn .link { padding-left: 26px; }
  #application .areaBtn .link a:before { width: 14px; height: 14px; top: 3px; left: -26px; }
  #application .areaBtn .link a:hover { color: #1cacda; } }

.is_sticky #application { padding-top: 90px; margin-top: -45px; }

/*  #product
================================================== */
#product { margin-top: -185px; margin-left: 18px; margin-right: 18px; padding-top: 220px; }

#product .inner { padding: 25px; border: solid 1px #016cb1; }

#product .tit { text-align: center; position: relative; margin-bottom: 20px; }

#product .tit:before { position: absolute; content: ''; width: 30px; height: 30px; background: url(../../img/common/ico_product01.png) no-repeat; background-size: contain; top: 0; left: 50%; margin-left: -103px; }

#product .areaBtn .link { padding-left: 20px; }

#product .areaBtn .link a { font-weight: bold; color: #016cb1; text-decoration: none; position: relative; }

#product .areaBtn .link a:before { position: absolute; content: ''; width: 13px; height: 13px; top: 4px; left: -20px; background: url(../../img/common/ico_arw01.png) no-repeat; background-size: contain; }

#product .areaBtn .link + .link { padding-top: 5px; }

#product .areaBtn .btn { margin-top: 0; }

#product .areaBtn .btn + .btn { margin-top: 10px; }

#product .areaBtn .btn a { line-height: 1.4; text-align: center; height: 62px; }

@media all and (min-width: 600px) { #product { width: 540px; margin: 0 0 0 16px; padding-top: 190px; margin-top: -110px; }
  #product .inner { width: auto; padding: 35px 40px 40px; }
  #product .tit:before { top: -1px; margin-left: -155px; width: 48px; height: 48px; }
  #product .areaBtn .link { padding-left: 26px; }
  #product .areaBtn .link a:before { width: 14px; height: 14px; top: 3px; left: -26px; }
  #product .areaBtn .link a:hover { color: #1cacda; } }

.is_sticky #product { padding-top: 90px; margin-top: -45px; }

/*  #square
================================================== */
#square .tit { margin-bottom: 20px; }

#square .txt { margin-bottom: 20px; }

#square .txt + .areaBtn { margin-top: 26px; }

#square .areaBtn { margin: 0 -18px 0; padding: 25px 45px; background: #f3f3f3; }

#square .areaBtn .btn { margin-top: 0; }

#square .areaBtn .btn + .btn { margin-top: 10px; }

#square .areaBtn .btn a { height: auto; padding: 13px 0 14px; line-height: 1.4; }

@media all and (min-width: 600px) { #square .tit { margin-bottom: 30px; }
  #square .txt { margin-bottom: 40px; }
  #square .subTit { margin-bottom: 10px; }
  #square .areaBtn { margin: 0; }
  #square .areaBtn .btn { max-width: 350px; margin-top: 0; }
  #square .areaBtn .btn a { padding: 17px 0 16px; } }

/*  #reason
================================================== */
#reason .txt { margin-bottom: 24px; }

#reason .txt + .list { margin-top: -7px; }

#reason .note { margin-top: -13px; font-size: 1.1rem; color: #666; }

#reason .secReason + .secReason { margin-top: 34px; }

#reason .secReason .img_box { margin-bottom: 0; }

#reason .secReason .subTit + .txt { margin-top: -5px; }

#reason .secReason .txt span { font-weight: 500; }

@media all and (min-width: 600px) { #reason .txt { margin-bottom: 25px; }
  #reason .subTit { margin-bottom: 14px; }
  #reason .list { margin-bottom: 40px; }
  #reason .img_box { margin-bottom: 50px; }
  #reason .note { margin-top: -8px; font-size: 1.3rem; }
  #reason .secReason + .secReason { margin-top: 48px; }
  #reason .secReason + .secReason .subTit { margin-bottom: 17px; }
  #reason .secReason + .secReason .subTit + .txt { margin-top: 13px; }
  #reason .secReason .txt span { font-weight: bold; } }