@charset "UTF-8";
/* CSS Document */

/*-------------------------------------------

name:uniq.css

-------------------------------------------*/

#news{}
#news.bgDeco.active::before{ width:75%;}
#news > .inner{ max-width:1100px; position:relative; overflow:hidden;}
#news .mdTitleEn{ text-align:left;}
#news .newsArea{ margin:-80px 0 0;}
#news .newsArea #selectTab{ margin:0 0 70px;}
#news .newsArea #selectTab ul{ justify-content:flex-end;}
#news .newsList .btnMore{ width:120px; text-align:center; float:right; clear:both;}
#news .newsList .btnMore a{ display:block; padding:12px 0; border-bottom:1px solid #222; font-size:85%; letter-spacing:0.15em; text-decoration:none !important; position:relative;}
#news .newsList .btnMore span::after{ content:"\e900"; font-family:'icomoon' !important; font-size:90%; margin:0 0 0 2px;}
#news .newsList .btnMore a:hover{ border-bottom-color:#a3ca0f;}

/*新着情報 一覧*/
.newsList{}
.newsList > ul{ margin:0 0 30px; border-top:1px solid #e5e5e5;}
.newsList > ul > li{ padding:19px 2%; border-bottom:1px solid #e5e5e5;}
.newsList > ul > li > a{ display:table;}
.newsList > ul > li > a .date,
.newsList > ul > li > a .ctgry,
.newsList > ul > li > a .title{ display:table-cell;}
.newsList > ul > li > a .date{ color:#aaa; padding:0 15px 0 0;}
.newsList > ul > li > a .ctgry{}
.newsList > ul > li > a .ctgry > span{ display:inline-block; width:110px; padding:6px 0; font-size:90%; color:#fff; text-align:center; line-height:1;}
.newsList > ul > li > a .title{ padding:0 0 0 15px; line-height:1.4;}
.newsList > ul > li > a:hover .title{ color:#a3ca0f;}

/*カテゴリカラー*/
.c01 > span{ background:#ef7f7e;}
.c02 > span{ background:#2ea875;}
.c03 > span{ background:#f1c243;}
.c04 > span{ background:#4ca5d8;}


/*===================================================

	タブレット

===================================================*/
@media only screen and (max-width: 1024px) {

/*====================================
	section
======================================*/
section > .inner{ padding:8% 0;}

/*====================================
	新着情報
======================================*/
#news{}
#news.bgDeco.active::before{}
#news > .inner{}
#news .mdTitleEn{ text-align:center;}
#news .newsArea{ margin:0;}
#news .newsArea #selectTab{ margin:0 0 30px;}
#news .newsArea #selectTab ul{ justify-content:center;}
#news .newsList .btnMore{ width:200px; margin:0 auto; float:none;}
#news .newsList .btnMore a{}
}

.detail_n .btn01{ width:200px; margin:4% auto; letter-spacing:0;}

.pager  ul.pagination {
  text-align: center;
  margin: 0;
  padding: 0;
}

.pager .pagination li {
  display: inline;
  margin: 0 2px;
  padding: 0;
  display: inline-block;
  width: 50px;
  height: 50px;
  text-align: center;
  position: relative;
}

.pager .pagination li a{
  vertical-align: middle;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  display:table;
  text-decoration: none;
}

.pager .pagination li a span{
  display:table-cell;
  vertical-align:middle;
}

.pager .pagination li a:hover,
.pager .pagination li a.active{
  color: #000;
  background: #ccf;
}

@media only screen and (max-width: 749px){
  .pager .pagination li{
    display: none;
  }

  .pager .pagination li.pre,
  .pager .pagination li.next{
    display: inline-block;
    width: 40%;
    height: 50px;
    text-align: center;
  }

  .pager .pagination li.pre a,
  .pager .pagination li.next a{
    width: 100%;
    text-align: center;
  }

  /*.pager .pagination li.pre span::after{
    content: "　前の10件へ";
  }

  .pager .pagination li.next span::before{
    content: "次の10件へ　";
  }*/

}





/*===================================================

	スマホ

===================================================*/
@media only screen and (max-width: 739px) {
#news{}
#news.bgDeco.active::before{}
#news > .inner{}
#news .mdTitleEn{}
#news .newsArea{ margin:0;}
#news .newsArea #selectTab{ margin:0 0 20px;}
#news .newsArea #selectTab ul{}
#news .newsList .btnMore{}
#news .newsList .btnMore a{}

/*新着情報 一覧*/
.newsList{}
.newsList > ul{ margin:0 0 20px;}
.newsList > ul > li{ padding:15px 2%;}
.newsList > ul > li > a{ display:block;}
.newsList > ul > li > a .date,
.newsList > ul > li > a .ctgry{ display:inline-block; vertical-align:middle;}
.newsList > ul > li > a .title{ display:block;}
.newsList > ul > li > a .date{ padding:0 5px 0 0;}
.newsList > ul > li > a .ctgry{}
.newsList > ul > li > a .ctgry > span{ width:90px; font-size:80%; padding:4px 0;}
.newsList > ul > li > a .title{ padding:5px 0 0;}
}