@charset "Shift_JIS";



/* **************************************************

Name: group.css

Description: Setting of content module

Create: 2009.12.XX

Update: 2016.03.28

Copyright 2009 Hitachi, Ltd. 

***************************************************** */

/* content===========================================

[-] for all
[-] for 995px -
[-] for - 994px

/* for all
=========================================================================================== */

/* [-] Ranking
=========================================================================================== */
ul.highrank li,
ul.lowrank li {
    display: block;
    margin: 5px 0;
    background-image: url(/about/corporate/group/images/icon/ranking.png);
    background-repeat: no-repeat;
    padding-left: 28px;
}
li#rank1 { background-position: left 0px }
li#rank2 { background-position: left -50px }
li#rank3 { background-position: left -100px }
li#rank4 { background-position: left -150px }
li#rank5 { background-position: left -200px }
li#rank6 { background-position: left -250px }

/* [-] Category item layout
=========================================================================================== */
.grouplist {
    border-bottom: solid #dadada 1px;
    margin-bottom: 15px;
}
.grouplist .Section {
    padding-top: 15px;
    border-top: solid #dadada 1px;
}
.grouplist .Section h3 {
    text-align: right;
    float: left;
    width: 80px;
    margin-bottom: 5px;
}
.grouplist .Section ul.LinkListStyle1 {
    margin-bottom: 5px;
    float: right;
    width: 625px;
}

/* [-] Refine Search
=========================================================================================== */
div.refine {
    background: #f2f2f2;
    padding: 5px 15px;
    margin-bottom: 25px;
    color: #666;
}
div.refine dt {
				margin-bottom:5px;
				text-align:left;
}
div.refine dt {
    width: 40%;
    font-size: 90%;
    line-height: 160%;
}
div.refine .Search {
    border: 0 none;
    height: 18px;
    margin: 0 0 0 15px;
    padding: 4px;
    vertical-align: top;
    width: 68%;
    line-height: 160%;
}
div.refine .Btn {
    -moz-appearance: none;
    background-color: #ccc;
    border: 0 none;
    color: #333;
    cursor: pointer;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 90%;
    height: 26px;
    margin: 0 0 7px;
    padding: 0 10px;
}
div.refine p{
	margin-bottom:0;
}

/* for 995px -
=========================================================================================== */

@media screen and (min-width: 995px) {


}



/* for - 994px
=========================================================================================== */

@media screen and (max-width: 994px) {

				/* [-] Ranking List
				=========================================================================================== */
				ul.highrank li,
				ul.lowrank li {
								display: block;
								margin: 5px 0;
								background-image: url(/about/corporate/group/images/icon/ranking.png);
								background-repeat: no-repeat;
								padding-left: 28px;
				}
				.grouplist .Section h3 {
								text-align: left;
								float: none;
								width: auto;
				}
				.grouplist .Section ul.LinkListStyle1 {
								float: none;
								width: auto;
				}
				div.refine dd .Search {
								width: 100%;
								margin-bottom:5px;
				}
				div.refine dt {
								width: auto;
				}
				div.refine dd span{
					display:block;
					text-align:center;
				}
				div.refine .Search {
								width: 70%;
								margin: auto;
				}

}

/* for - 767px
=========================================================================================== */

@media screen and (max-width: 767px) {

}


/* for - 579px
=========================================================================================== */

@media screen and (max-width: 579px) {
}


/* for - 399px
=========================================================================================== */

@media screen and (max-width: 399px) {

}
