/* ========================================================
info  : 省エネ・環境ソリューション（改善版）用のCSS
Author: fujisaki
Date  : 2009/05/25
Update: 2009/08/18

======================================================== */

<!-- ==============================
■リスト
=============================== -->
.eco_tec_ul{
margin-left:8px;
list-style-image: url("/jp/eco/img/pin.gif");
list-style-position:outside;
vertical-align:text-baseline;
padding-left: 10px;
line-height: 1.5em;
}

.eco_li {
margin: 2px 0px 0px 0px;
padding-left: 5px;
line-height: 1.5em;
}

<!-- ==============================
■リスト（課題）
=============================== -->
.eco_kadai_ul{
margin-left:15px;
list-style-image: url("/jp/eco/img/square_03.gif");
list-style-position:outside;
vertical-align:text-baseline;
padding-left: 10px;
line-height: 1.5em;
}

.eco_li {
margin: 2px 0px 0px 0px;
padding-left: 5px;
line-height: 1.5em;
}

<!-- ==============================
■リスト（提案）
=============================== -->
.eco_teian_ul{
margin-left:10px;
list-style-image: url("/jp/eco/img/square_01.gif");
list-style-position:outside;
vertical-align:text-baseline;
padding-left: 10px;
line-height: 1.5em;
}

.eco_li {
margin: 2px 0px 0px 0px;
padding-left: 5px;
line-height: 1.5em;
}

<!-- ==============================
■画像枠
=============================== -->
.eco_img{
margin-bottom: 5px;
padding: 3px;
border:1px solid #CCCCCC;
}

<!-- ==============================
■全体行間
=============================== -->

p.eco_gyo {line-height: 1.8em;}

</style>




<!-- ==============================
【補足：html/headヘの記述】

●省エネcssの読み込み
<link rel="stylesheet" href="/jp/automaion/eco/shared/css/auto_eco.css" type="text/css" />

●「リスト」ソース記述例：
<ul class="eco_tec_ul">
<li class="eco_li"><a href="#">XXXXX</a></li>
<li><a href="#">XXXXX</a></li>
<li><a href="#">XXXXX</a></li>
<li><a href="#">XXXXX</a></li>
</ul>

●「枠付画像＋画像右＋文章回り込み」ソース記述例：
<div class="eco_img" style="float:right">
<img  src="XXXX.jpg" alt="XXXX" width="XXXpx" height="XXXpx">
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
<!--回り込み解除-->
<br style="clear:both;">

●行間
<p class="eco_gyo">
XXXXX
</p>
=============================== -->