@charset "Shift_JIS";
/* ===================================================================
 style info : コンテンツエリア関係 他

fonts
 10px = 77%     11px = 85%     12px = 93%     13px = 100%
 14px = 108%    15px = 116%    16px = 123.1%  17px = 131%
 18px = 138.5%  19px = 146.5%  20px = 153.9%? 21px = 161.6%
 22px = 167%    23px = 174%    24px = 182%    25px = 189%
 26px = 197%
=================================================================== */
/*----------------------------------------------------
	共通
----------------------------------------------------*/
/* スクロールバーの有無によるズレ対策 */
html {
 overflow-y: scroll;
}
body {
 font-family: "メイリオ", Meiryo, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
 border-top: solid 4px #EE5581;
 color: #54514a;
}
input, textarea {
 font-family: "メイリオ", Meiryo, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
}
/* for IE6 */
* html body {
 font-family: "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
}
* html input, * html textarea {
 font-family: "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
}
/* リンク
----------------------------------------------------*/
a {
 transition: color .5s;
}
a, a:visited, a:link {
 color: #54514a;
 text-decoration: none;
}
a:hover, a:active {
 color: #EE5581;
 text-decoration: none;
}
img {
 vertical-align: top;
 text-decoration: none;
 border: 0;
 transition: opacity .5s;
}
a:hover img {
 opacity: 0.5;
 filter: alpha(opacity=50);
}
a:hover img.onimg {
 opacity: 1.0;
 filter: alpha(opacity=100);
}
/* よく使いそうなCSS3
----------------------------------------------------*/
#selectors {
 /* 角丸 */
 -webkit-border-radius: 10px;
 -moz-border-radius: 10px;
 border-radius: 10px;
 /* 角丸個別 */
 -webkit-border-top-right-radius: 15px;
 -moz-border-radius-topright: 15px;
 border-top-right-radius: 15px;
 /* ボックスに影 */
 -webkit-box-shadow: 1px 1px 3px #999;
 -moz-box-shadow: 1px 1px 3px #999;
 box-shadow: 1px 1px 3px #999;
 /* テキストに影 */
 text-shadow: 1px 1px 0px #999;
}
/* 汎用
----------------------------------------------------*/
/* clerfix */
.clearfix:after {
 content: "";
 display: block;
 clear: both;
}
/*----------------------------------------------------
	#topスライド
----------------------------------------------------*/
#ibInner {
 width: 980px;
 margin: 0 auto;
}
#ibInner #imageBoard {
 width: 700px;
 float: left;
}
#imageBoard p {
 font-size: 14px;
 margin: 10px;
 line-height: 1.2;
 text-align: center;
}
#ibInner #imageBoard .adbanner {
 margin-top: 15px;
}
#ibInner #imageBoard .adbanner a {
 background-image: url(/common/top/image_board/banner_ad_bg_over.gif);
 background-repeat: no-repeat;
 display: block;
}
#ibInner #imageBoard .adbanner a:hover {
 background-image: url(/common/top/image_board/banner_ad_bg.gif);
 background-repeat: no-repeat;
}
#ibInner #imageBoard .adbanner a:hover img {
 opacity: 1.0;
 filter: alpha(opacity=100);
}
#ibInner #banner1 {
 box-sizing: border-box;
 width: 250px;
 height: 160px;
 float: right;
 text-align: center;
 padding: 9px;
 border: solid 1px #d9d9d9;
 -webkit-border-radius: 5px;
 -moz-border-radius: 5px;
 border-radius: 5px;
 margin-bottom: 30px;
}
#ibInner #banner2 {
 box-sizing: border-box;
 width: 250px;
 height: 160px;
 float: right;
 text-align: center;
 padding: 9px;
 border: solid 1px #d9d9d9;
 -webkit-border-radius: 5px;
 -moz-border-radius: 5px;
 border-radius: 5px;
}
.arrow {
 margin: 10px 0;
 font-size: 15px;
}
.arrow:before {
 content: url(/common/img/arrow.png);
 margin-right: 5px;
}
/*----------------------------------------------------
	#livingNews（リビングニュース）
----------------------------------------------------*/
#livingNews {
 background-color: #F7EEEB;
 margin: 18px 0 0;
 padding: 18px 0;
}
#livingNewsInner {
 width: 980px;
 margin: 0 auto;
}
#livingNewsLeft {
 width: 700px;
 float: left;
}
#livingNewsLeft h1 {
 font-size: 18px;
 font-weight: bold;
 margin-top: 8px;
}
#livingNewsLeft h1 span {
 font-size: 14px;
}
#allNews {
 float: right;
 margin-top: -22px;
}
#allNews a {
 display: block;
 background-color: #EE5581;
 width: 120px;
 height: 30px;
 color: #FFF;
 text-decoration: none;
 font-weight: bold;
 text-align: center;
 font-size: 14px;
 line-height: 30px;
 transition: opacity .5s
}
#allNews a:hover {
 opacity: 0.5;
}
#livingNewsLeft #articles {
 margin: 18px 0 0;
 list-style-type: none;
 display: table;
}
#livingNewsLeft #articles li {
 display: table-row;
 line-height: 1.4;
 font-size: 13px;
}
#livingNewsLeft #articles li .newsDate {
 display: table-cell;
 width: 110px;
 padding: 20px 0;
 border-top: dashed 1px #54514a;
}
#livingNewsLeft #articles li .newsTitle {
 display: table-cell;
 padding: 20px 0;
 border-top: dashed 1px #54514a;
}
#banner3 {
 box-sizing: border-box;
 width: 250px;
 height: 210px;
 float: right;
 text-align: center;
 padding: 9px;
 background-color: #FFF;
 border: solid 1px #d9d9d9;
 -webkit-border-radius: 5px;
 -moz-border-radius: 5px;
 border-radius: 5px;
}
#banner3 .arrow {
 text-align: left;
 line-height: 1.4;
 padding-left: 20px;
 text-indent: -20px;
}
/*----------------------------------------------------
	#contents（メインとサイド）
----------------------------------------------------*/
#contents {
 padding-top: 10px;
}
/*----------------------------------------------------
	#main（メインコンテンツ）
----------------------------------------------------*/
#main {
 background-color: #F9F9F9;
 padding: 20px 0 40px;
}
#main section {
 width: 980px;
 margin: 0 auto;
}
#main h1 {
 font-size: 20px;
 color: #A6A6A6;
 font-weight: normal;
 height: 72px;
 line-height: 72px;
}
#main ul {
 list-style-type: none;
}
#main ul:after {
 content: "";
 display: block;
 clear: both;
}
#main li {
 position: relative;
 width: 222px;
 height: 346px;
 float: left;
 cursor: pointer;
 margin-right: 30px;
 margin-bottom: 30px;
 background-color: #FFF;
 box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.15);
 -webkit-transition: box-shadow .3s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
 transition: box-shadow .3s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
#main li:hover {
 -webkit-transform: translate(3px, 3px);
 -ms-transform: translate(3px, 3px);
 transform: translate(3px, 3px);
 box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.3);
}
#main li:nth-child(4n) {
 margin-right: 0;
}
#main li h2 {
 margin: 15px 12px;
 font-size: 14px;
}
#main li p {
 margin: 15px 10px;
 font-size: 12px;
 line-height: 1.8;
}
#main li:hover h2 {
 color: #EE5581;
}
#main li:hover p {
 color: #54514a;
}
#main li .overlay {
 width: 222px;
 height: 346px;
 position: absolute;
 top: 0;
 background-color: rgba(63, 63, 63, 0.6);
 display: none;
}
#main li .overlay a {
 display: block;
 width: 80px;
 height: 30px;
 line-height: 30px;
 background-color: #EE5581;
 color: #FFF;
 text-align: center;
 font-weight: bold;
 position: absolute;
 top: 150px;
 transition: opacity .3s;
}
#main li .overlay a:hover {
 opacity: 0.5;
}
a.shuto {
 left: 20px;
}
a.kinki {
 right: 20px;
}
#main .pageTop {
 clear: both;
 margin: 0;
 text-align: right;
}
div.othermedia a {
 display: block;
 width: 420px;
 height: 65px;
 line-height: 65px;
 text-align: center;
 background-color: #EE5581;
 color: #FFF;
 font-weight: bold;
 font-size: 18px;
 margin: 20px auto;
 transition: opacity .3s;
}
div.othermedia a:hover {
 opacity: 0.5;
}
#asideInner {
 width: 980px;
 margin: 40px auto;
}
#main div.asidewevewaku {
 border: 3px solid #e6e6e6;
 margin-bottom: 0px;
 padding-bottom: 0px;
 background-color: #FFF;
}
#main aside.web {
 overflow: hidden;
 margin-bottom: 0px;
 padding-bottom: 0px;
}
#main aside.web h1 {
 font-size: 77%;
 font-weight: bold;
 margin-left: 20px;
 margin-top: 10px;
 color: #777;
 height: auto;
 line-height: normal;
}
#main aside.web ul {
 list-style-type: none;
}
#main aside.web ul li {
 float: left;
 height: 52px;
 width: auto;
 margin: 0;
 box-shadow: none;
 background-color: inherit;
}
#main aside.web ul li a {
 background-image: url(/common/top/icon_win2.gif);
 background-repeat: no-repeat;
 background-position: right 20px;
 display: block;
 padding-right: 15px;
 padding-left: 15px;
}
#main aside.web ul li a:hover {
 background-position: right -70px;
}
#main .asidewevewaku ul {
 margin-left: 10px;
}
#main .asidewevewaku ul {
 margin-left: 10px;
}
/* SP
----------------------------------------------------*/
@media screen and (max-width: 640px) {
 img {
  max-width: 100%;
  width: auto;
  height: auto;
 }
 .pc {
  display: none !important;
 }
 #imageBoard p {
  font-size: 14px;
  margin: 10px;
  line-height: 1.2;
 }
 #imageBoard .adbanner_sp {
  text-align: center;
 }
 #livingNewsInner {
  width: auto;
 }
 #livingNewsLeft {
  width: auto;
  padding: 0 5%;
  float: none;
 }
 #livingNewsLeft h1 {
  margin: 10px 0;
 }
 #allNews {
  float: none;
  margin: 0;
 }
 #main {
  padding: 20px 5% 40px;
 }
 #main section {
  width: auto;
 }
 #main h1 {
  font-size: 16px;
  height: auto;
  line-height: inherit;
  margin: 40px 0;
 }
 #main li, #main li:nth-child(4n) {
  float: none;
  margin: 10% auto;
 }
 div.othermedia a {
  width: auto;
 }
 #asideInner {
  width: auto;
 }
 footer#globalFooter .copyarea {
  padding-bottom: 20px;
 }
 footer#globalFooter .footwide2 {
  width: auto;
 }
}
@media screen and (min-width: 641px) {
 .sp {
  display: none !important;
 }
}
h2.notfound {
 font-size: 18px;
 font-weight: normal;
 line-height: 1.7;
 margin: 3em 0;
}
.alerttxt {
 font-size: 13px;
 line-height: 1.7;
 margin: 3em 0 5em 0;
}
/*コロナウイルス*/
.koronacope {
 margin: 10px 20px;
 overflow: hidden;
}
.koronacope a {
 display: block;
}
.koronacope a img {
 width: 100%;
 height: auto;
}
@media screen and (min-width: 641px) {
 .koronacope {
  margin: 20px 0 0;
  width: 230px;
  float: right;
 }
}

/*20230911*/
.sp_top_nav{margin:1em 0;}
.sp_top_nav ul{display: flex;justify-content:center;font-size:.9em;list-style: none;}
.sp_top_nav ul li{padding:0 1em;border-right:1px solid #ddd;}
.sp_top_nav ul li:last-child{border-right:none;}
#ibInner #top_banner_area{
  box-sizing: border-box;
  width: 250px;
  height: auto;
  float: right;
  margin-bottom: 30px;
}
.top_banner_area{}
.top_banner_area ul{list-style: none;
}
.top_banner_area ul li{margin-bottom:2px;border:1px solid #ddd;padding:0 32px;}
.top_banner_area ul li img{width:100%;}