@charset "utf-8";

/************************************************************************************
smaller than 960 TB
*************************************************************************************/
@media screen and (max-width: 960px) {
/*-----------------------------------------------------
seisaku
-------------------------------------------------------*/
.seisakuBox ul.seisakuList li{
	width: 21%;
}

/*-----------------------------------------------------
#subContentsBlock bannerList
-------------------------------------------------------*/
#contentsArea #subContentsBlock ul.bannerList{
	text-align: left;
	width: auto;
	padding: 10px;
}

#contentsArea #subContentsBlock ul.bannerList li{
	padding: 5px;
	display: inline-block;
}
}

/************************************************************************************
smaller than 767 SP
*************************************************************************************/
@media screen and (max-width: 767px) {

#mainContentsBlock .itemBox .innerBox,
#mainContentsBlock .itemBox .innerBoxR {
	float: none;
	width: auto;
	padding-left: 0;
}

}

/************************************************************************************
smaller than 640 SP
*************************************************************************************/
@media screen and (max-width: 640px) {
/*-----------------------------------------------------
dl
-------------------------------------------------------*/
/* topicsList */
.topicsList dt {
    float: none;
    padding-bottom: 5px;
    padding-top: 10px;
	width: 100%;
}

.topicsList dd {
	padding-top: 0;
    padding-left: 0;
    padding-bottom: 15px;
}

/*-----------------------------------------------------
ul,ol
-------------------------------------------------------*/

#contentsArea ul.linkMonthly {
	text-align: left;
}

#contentsArea ul.linkMonthly li {
	width: auto;
}

/*-----------------------------------------------------
seisaku
-------------------------------------------------------*/
.seisakuBox ul.seisakuList li {
    width: 28%;
}

/*-----------------------------------------------------
#subContentsBlock bannerList
-------------------------------------------------------*/
#contentsArea #subContentsBlock .bannerSection{
	text-align: center;
	
}

#contentsArea #subContentsBlock ul.bannerList{
	text-align: left;
	width: auto;
	padding: 10px;
}

#contentsArea #subContentsBlock ul.bannerList li{
	width: 47%;
	text-align: center;
}

/*-----------------------------------------------------
tableBase 
-------------------------------------------------------*/
table.tableBase{
	width: 100%;
}
table.tableBase th,
table.tableBase th,
table.tableBase td{
	font-size: 0.8em;
	vertical-align: top;
}
table.tableBase.fontSizeInitial th,
table.tableBase.fontSizeInitial th,
table.tableBase.fontSizeInitial td{
	font-size: 1em;
	vertical-align: top;
}

/*-----------------------------------------------------
topicsTable
-------------------------------------------------------*/
.topicsTable th {
	width: auto;
	margin-top: 15px;
}
.topicsTable th:first-child{
	margin-top: 0;
}

.topicsTable th, .topicsTable td {
	display: block;
}


/*-----------------------------------------------------
h2Block
-------------------------------------------------------*/
.h2Block {
    overflow: hidden;
	zoom: 1;
}

.h2Block h2 {
    padding-right: 0;
}

.h2Block .toList {
    position: relative;
    right: 0;
    bottom: 0;
    display: inline-block;
    float: right;
    border-top: solid 0.5em #ffffff;
}

}

/************************************************************************************
smaller than 600 SP
*************************************************************************************/
@media screen and (max-width: 600px) {
/*-----------------------------------------------------
seisaku
-------------------------------------------------------*/
.seisakuBox ul.seisakuList li {
    width: 43%;
}
}

/************************************************************************************
smaller than 480 SP
*************************************************************************************/
@media screen and (max-width: 480px) {
/*-----------------------------------------------------
seisaku
-------------------------------------------------------*/
.seisakuBox ul.seisakuList li {
    width: 100%;
}

#contentsArea .indentMg0 p {
	margin-left: 0;
}

/*-----------------------------------------------------
#subContentsBlock bannerList
-------------------------------------------------------*/

#contentsArea #subContentsBlock ul.bannerList li{
	width: 45%;
}

#contentsArea #subContentsBlock ul.bannerList li img{
	width: 100%;
	height:auto;
}

}

/************************************************************************************
smaller than 320 SP
*************************************************************************************/
@media screen and (max-width: 320px) {

.seisakuBox ul li {
    display: block;
}
}