@charset "utf-8";

#comparison{}
#comparison #sideNavi nav#categoryNav h4{ display:none;}
#comparison.energy #sideNavi nav#categoryNav > ul > li.energyNav h4{ display:block;}
/*#energy.energy .comparisonNav li.energyNav h4{ display:block;}*/

#comparison .comparisonNav li ul{ display:none;}
#comparison.energy .comparisonNav  li.energyNav ul,
#comparison.energy.anzen .comparisonNav li.anzenNav ul,
#comparison.energy.chouri .comparisonNav li.chouriNav ul,
#comparison.energy.seisou .comparisonNav li.seisouNav ul,
#comparison.energy.kaiteki .comparisonNav li.kaitekiNav ul,
#comparison.energy.keizai .comparisonNav li.keizaiNav ul,
#comparison.energy.lifestyle .comparisonNav li.lifestyleNav ul,
#comparison.energy.housing .comparisonNav li.housingNav ul,
#comparison.lifestage .comparisonNav li.lifestageNav ul,
#comparison.lifestage.twenty .comparisonNav li.ls20Nav ul,
#comparison.lifestage.thirty .comparisonNav li.ls30Nav ul,
#comparison.lifestage.for-fifty .comparisonNav li.ls40Nav ul,
#comparison.lifestage.sixty .comparisonNav li.ls60Nav ul,
#comparison.change .comparisonNav li.changeNav ul,
#comparison.case .comparisonNav li.caseNav ul{ display:block;}

#comparison.energy.anzen #categoryNav li.anzenNav,
#comparison.energy.chouri #categoryNav li.chouriNav,
#comparison.energy.seisou #categoryNav li.seisouNav,
#comparison.energy.kaiteki #categoryNav li.kaitekiNav,
#comparison.energy.keizai #categoryNav li.keizaiNav,
#comparison.energy.anzen li.anzenNav,
#comparison.energy.chouri li.chouriNav,
#comparison.energy.seisou li.seisouNav,
#comparison.energy.kaiteki li.kaitekiNav,
#comparison.energy.keizai li.keizaiNav,
#comparison.energy.lifestyle #categoryNav li.lifestyleNav,
#comparison.energy.lifestyle li.lifestyleNav,
#comparison.energy.housing #categoryNav li.housingNav,
#comparison.lifestage.ls20 #categoryNav li.ls20Nav,
#comparison.lifestage.ls30 #categoryNav li.ls30Nav,
#comparison.lifestage.ls40 #categoryNav li.ls40Nav,
#comparison.lifestage.ls60 #categoryNav li.ls60Nav,
#comparison.lifestage.ls20 li.ls20Nav,
#comparison.lifestage.ls30 li.ls30Nav,
#comparison.lifestage.ls40 li.ls40Nav,
#comparison.lifestage.ls60 li.ls60Nav,
#comparison.change.merit #categoryNav li.meritNav,
#comparison.change.case #categoryNav li.caseNav{ background:rgba(242,246,251,1);}

#comparison.energy nav#categoryNav ul li.energyNav:hover,
#comparison.lifestage nav#categoryNav ul li.lifestageNav:hover{ background:rgba(242,246,251,0);}

#comparison.energy.energyIndex #sideNavi nav#categoryNav > ul > li.energyNav > a,
#comparison.lifestage.lifestageIndex #sideNavi nav#categoryNav > ul > li.lifestageNav > a,
#comparison.case #categoryNav li.caseNav > a{ background:url(../img/arrow.svg) #f2f6fb no-repeat 10px 1em ;}

#comparison ul.list-thumb.energyList li .thumb{ width:100px; height:auto; background:url(../comparison/img/bg_icon.gif) center no-repeat;}
#comparison ul.list-thumb.energyList li .text{ width:530px;}
#comparison ul.list-thumb.energyList li .text h3{ margin-top:15px; margin-bottom:0; font-size:1em;}
#comparison ul.list-thumb.energyList li .text h3:before{content:"";width:6px;height:12px;display:block;background:url(../img/arrow.svg) no-repeat center;background-size:6px;top: 6px;left:0;position:absolute;}

#comparison ul.list-thumb.columnWrap{ border-top:none;}
#comparison ul.list-thumb.columnWrap .column2{ float:left;}
#comparison ul.list-thumb.columnWrap .column2:nth-child(1),
#comparison ul.list-thumb.columnWrap .column2:nth-child(2){ border-top:1px solid #ccc;}
#comparison ul.list-thumb.columnWrap .column2:nth-child(odd){ margin-right:20px;}
#comparison ul.list-thumb.columnWrap .column2 .text{ width:180px;}

#comparison.anzen .anzenTable th{ width:auto; padding:5px; text-align:center; vertical-align:middle;}
#comparison.anzen .anzenTable th.th1{ width:20%; text-align:center; vertical-align:middle;}
#comparison.anzen .anzenTable th.th2{ width:20%;}
#comparison.anzen .anzenTable th.th3{ width:60%; border-bottom:1px solid #fff; text-align:center;}

#comparison.change.merit .w400{ width: 400px;}

@media screen and (max-width: 767px) {
#comparison ul.list-thumb.energyList li .thumb{ width:100%; height:auto; text-align:center;}
#comparison ul.list-thumb.energyList li .thumb img{ width:80%; height:auto;}
#comparison ul.list-thumb.energyList li .text{ width:auto;}
#comparison ul.list-thumb.columnWrap .column2:nth-child(odd){ margin-right:0;}
#comparison ul.list-thumb.columnWrap .column2:nth-child(1), #comparison ul.list-thumb.columnWrap .column2:nth-child(2){ border-top:none;}
#comparison ul.list-thumb.columnWrap .column2 .text{ width:100%;}
#comparison ul.list-thumb.energyList li .text h3{ margin-top:0;}
#comparison ul.list-thumb.columnWrap .column2{ margin-bottom:0;}

#comparison img.fitImg.familyImg{ width:60%; height:auto; margin-bottom:10px;}
	
#comparison nav.contentsNavi.kyutouNavi ul li{ width:50%;}
#comparison nav.contentsNavi.kyutouNavi ul li:last-child{ width:100%; border-left:1px solid #ccc; margin-top:0.5em;}
#comparison nav.contentsNavi.conroNavi ul li{ width:33%;}
#comparison nav.contentsNavi.lifestageNavi ul li{ width:50%;}
#comparison nav.contentsNavi.lifestageNavi ul li:nth-child(3){ border-left:1px solid #ccc;}
#comparison nav.contentsNavi.lifestageNavi ul li:nth-child(1),
#comparison nav.contentsNavi.lifestageNavi ul li:nth-child(2){ margin-bottom:0.5em;}
	
#comparison.change.merit .btnS,
#comparison.change.merit .w400{width:100%;}

}