@charset "utf-8";

/*
 *  font-size:    83% = 10px
 *  font-size:   100% = 12px
 *  font-size:   117% = 14px
 *  font-size:   133% = 16px
 *  font-size:   150% = 18px
 *  font-size:   166% = 20px
---------------------------------------------------------- */



/*  top_style.css
---------------------------------------------------------- */

/* ========================================================
 header打ち消し用
======================================================== */
body{
  width:100%;
  overflow:hidden;
}
div#body{
  min-height: 0;
  padding: 15px 15px 0 15px;
}
div.sns div.addthis_toolbox{
  width: 54px;
}

/* ========================================================
 ページ内共通スタイル
======================================================== */
#contentAreaWrap{
  font-family: 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,sans-serif;
}
#contentAreaWrap div#body{
  width: 100%;
  position: relative;
  padding:0;
  margin-top: 30px;
}
#contentAreaWrap .inner{
  width: 960px;
  margin: 0 auto;
}
.shadow{
  box-shadow:3px 2px 8px 2px #ebebeb;
}
.ttlType01{
  font-size: 166%;
  padding-bottom: 10px;
  border-bottom: 1px solid #646464;
  font-weight: normal;
}

/* ========================================================
 topMainArea
======================================================== */
.topMainArea{
  background: #f3f1f1;
  padding: 37px 0 40px;
}
.topMainArea .selectArea{
  background: #ffffff;
  padding: 20px 30px 40px;
  color: #646464;
}
.selectInner{
  padding: 20px 10px;
}
.topMainArea .selectArea .checkboxLabel{
  position: relative;
  cursor: pointer;
}
.selectArea .checkbox{
  display: none;
}
.checkboxLabel .checkbox + .checkboxIcon:before {
  content: "";
  width: 19px;
  height: 19px;
  margin-right: 8px;
  padding: 3px 10px;
  vertical-align: middle;
  background: url(/navi/img/check_off.png) no-repeat left center;
  overflow: hidden;
}

/*ラベルに.onがついたとき*/
.checkboxLabel.on .checkbox + .checkboxIcon:before {
  background: url(/navi/img/check_on.png) no-repeat left center;
}
.topMainArea .selectArea .checkboxLabel.on{
  color: #df0068;
}

.topMainArea .selectArea .all .checkboxLabel{
  display: block;
  border: 1px solid #e1e1e1;
  width: 160px;
  padding: 10px;
  text-align: left;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  font-size: 117%;
}

/*「全国」のラベルに.onがついたとき*/
.topMainArea .selectArea .all .checkboxLabel.on{
  border: 1px solid #df0068;
}

.selectBox{
  margin-top: 20px;
}
.selectBox tr{
  border-top: 1px solid #e1e1e1;
}
.selectBox th{
  background: #fcfbfb;
  width: 160px;
  padding: 11px 9px;
  vertical-align: middle;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  font-size: 117%;
}
.selectBox .areaBox{
  width: 720px;
  padding: 6px 0 11px 15px;
  overflow: hidden;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  font-size: 108%;
}
.selectBox tr:first-child{
  border-top: none;
}
.selectBox .areaBox li{
  float: left;
  margin-top:5px;
  margin-right: 19px;   
}

/* ========================================================
 itemWrap
======================================================== */
.itemWrap{
  margin: 0 0 110px;
}
.notInfo{
  font-size: 108%;
}
/* 記事 */
.itemArea{
  margin: 0 -26px 0 0;
  opacity: 0;
}
.itemArea .itemBox{
  float: left;
  width: 220px;
  margin: 40px 26px 0 0;
  background: #ffffff;
  box-shadow:3px 2px 8px 2px #ebebeb;
}
.itemArea .itemBox a{
  display: block;
  text-decoration: none;
}
.itemArea .itemBox a:hover{
  opacity: 0.6;
}
.itemArea .itemBoxInner{
  padding: 10px 20px 20px;
  text-align: left;
}
.itemArea .itemBox .thum{
  position: relative;
  min-height: 220px;
}
.itemArea .itemBox .thum img{
  width: 100%;
  position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
  margin: auto;
}
.itemArea .itemBox .icon{
  font-family: 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,sans-serif;
  position: absolute;
  left: 0;
  top: 0;
  padding: 3px 5px;
  background: #ffffff;
  color: #DC005E;
  font-weight: bold;
  font-size: 100%;/* 12px */
}
.itemArea .itemBox .tagWrap {
  min-height: 25px;
}
.itemArea .itemBox .tag{
  margin: 10px 5px 0 0;
  color: #df0068;
  padding: 2px 5px;
  border: 1px solid #df0068;
  display: inline-block;
}
.itemArea .itemBox .ttl{
  margin-top: 10px;
  font-size: 117%;
  font-weight: bold;
  color: #000000;
}
/* 記事の都道府県 */
.itemArea .itemBox .areaList{
  margin-top: 10px;
}
.itemArea .itemBox .areaList li{
  float: left;
  background: #f3f1f1;
  color: #646464;
  padding: 6px 0;
  width: 35px;
  margin: 1px 1px 0 0;
  font-size: 83%;
  line-height: 1;
  text-align: center;
}
.itemArea .itemBox .areaList li.more{
  background: none;
}