@charset "UTF-8";

 html.mdl,
.mdl body{
  height: 100%;
}
.bg{
  position: absolute;
  bottom: 0;
  left: 0;
  border-bottom: .35rem solid #609e2d;
  border-radius: 0 0 .5rem .5rem;
}
.background{
  margin-bottom: -1px;
  position: relative;
  overflow: hidden;
  border-radius: 0 0 0.5rem 0.5rem;
}
.background img{
  position: relative;
  z-index: 2;
}
.bg:after{
  content: "";
  display: block;
  width: 100%;
  height: .5rem;
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #609e2d;
  z-index: 1;
}
/* キャラ */
.mdl .bg *:before, .mdl .bg *:after{
  content: "";
  display: block;
  background-size: 100% auto;
  background-repeat: no-repeat;
}
/* 朝 */
.mdl.asa .bg .chara:before{
  width: 14.634%;
  padding-bottom: 12.439%;
  background-image: url("../images/modal_bg/asa/c1.png");
  position: absolute;
  bottom: 0;
  left: 12%;
  z-index: 3;
}
.mdl.asa .bg .chara:after{
  width: 5.365%;
  padding-bottom: 6.585%;
  background-image: url("../images/modal_bg/asa/c2.png");
  position: absolute;
  bottom: 30%;
  left: 28%;
  z-index: 3;
}
.mdl.asa .bg .build:before{
  width: 12.5%;
  padding-bottom: 12.804%;
  background-image: url("../images/modal_bg/asa/b1.png");
  position: absolute;
  bottom: 0%;
  right: 8%;
  z-index: 3;
}
/* 夕方 */
.mdl.yuu .bg .chara:before{
  width: 12.56%;
  padding-bottom: 11.463%;
  background-image: url("../images/modal_bg/yuu/c1.png");
  position: absolute;
  bottom: 0;
  left: 12%;
  z-index: 3;
}
.mdl.yuu .bg .chara:after{
  width: 10%;
  padding-bottom: 7.073%;
  background-image: url("../images/modal_bg/yuu/c2.png");
  position: absolute;
  bottom: 20%;
  left: 28%;
  z-index: 3;
}
.mdl.yuu .bg .build:before{
  width: 12.926%;
  padding-bottom: 11.463%;
  background-image: url("../images/modal_bg/yuu/b1.png");
  position: absolute;
  bottom: 0%;
  right: 8%;
  z-index: 3;
}
/* 夜 */
.mdl.yoru .bg .chara:before{
  width: 13.414%;
  padding-bottom: 11.951%;
  background-image: url("../images/modal_bg/yoru/c1.png");
  position: absolute;
  bottom: 0.2rem;
  left: 9%;
  z-index: 3;
}
.mdl.yoru .bg .chara:after{
  width: 9.024%;
  padding-bottom: 8.292%;
  background-image: url("../images/modal_bg/yoru/c2.png");
  position: absolute;
  bottom: 12%;
  left: 24%;
  z-index: 3;
}
.mdl.yoru .bg .build:before{
  width: 10.975%;
  padding-bottom: 12.195%;
  background-image: url("../images/modal_bg/yoru/b1.png");
  position: absolute;
  bottom: 0%;
  right: 8.5%;
  z-index: 3;
}
.mdl.asa .wrapper{ background-color: #abd8ef; }
.mdl.yuu .wrapper{ background-color: #efd8ab; }
.mdl.yoru .wrapper{ background-color: #2c5893; }
.mdl .wrapper{
  height: calc(100% - 1px);
  padding: 1rem 1rem 5.25rem;
  border-radius: .5rem .5rem 0 0;
  border-radius: .5rem;
  position: relative;
  overflow: hidden;
}
.mdl .wrapper:after{
  content: "";
  display: block;
  width: 100%;
  height: 1rem;
  position: absolute;
  bottom: 0;
  left: 0;
}
.in-frame{
  height: 100%;
  padding: 1rem 0;
  background-color: #fff;
}
.mdl-contents{
  min-height: 100%;
  position: relative;
  padding: 0rem .708rem;
  height: 100%;
  overflow: auto;
}

/* 見出し */
.pageTitle{
  background: rgb(42,60,117);
  background: linear-gradient(0deg, rgba(42,60,117,1) 0%, rgba(77,100,173,1) 50%, rgba(77,100,173,1) 100%);
  border-radius: 5px;
  padding: .2rem 0;
  overflow: hidden;
}
.pageTitle .inner_pageTitle{
  background-color: #3c508e;
  padding: .3rem .5rem .1rem;
  color: #fff;
  width: 100%;
  display: flex;
  align-items: center;
}
.pageTitle .inner_pageTitle:before{
  content: " ";
  display: block;
  width: 2rem;
  height: 1.794rem;
  background-image: url("../images/icon_ttl.png");
  background-size: 100% auto;
  background-repeat: no-repeat;
}
.pageTitle .inner_pageTitle h3{
  padding-left: .3rem;
  flex: 1;
  font-size: 1.5rem;
  line-height: 2rem;
}
/* ページタブ */
.pageTab .btn{
  border-radius: 0.4rem;
  overflow: hidden;
}
.pageTab .btn:before{
  border-radius: 0.4rem;
}
.pageTab a{
  font-size: .8rem;
  padding: .75rem 1.5rem .7rem;
}
.pageTab .btn_inner{
  border-radius: .4rem;
}
/* カテゴリータブ */
.categoryList{
  margin-top: .75rem;
}
.categoryList > div{
  display: flex;
  flex-wrap: wrap;
}
.categoryList a{
  color: #fff;
  font-size: .665rem;
  background-color: #282828;
  min-width: 5rem;
  padding: 0 .5rem;
  line-height: 1.5rem;
  border-radius: 1.5rem;
  margin: 0 0.5rem 0.3rem 0;
  text-align: center;
}
.categoryList a.select{
  background-color: #b1cb08;
}
.categoryList a:hover{
  background-color: #b1cb08;
}

.searchForm{
  display: flex;
  align-items: center;
  line-height: 0;
  /* margin-top: .7rem; */
}
.searchForm > div{
  margin-right: .5rem;
}
.searchForm > div:last-child{
  margin-right: 0;
}
.searchForm input{
  width: 100%;
}
.free{
  width: 13rem;
}

.pageBack{
  margin: 1rem 0 .75rem;
}
/* 検索結果 */
.searchResult{
  background-color: #ebebeb;
  font-size: .665rem;
  line-height: .665rem;
  text-align: center;
  padding: .5rem;
}
.searchResult span{
  line-height: .665rem;
}
.searchResult span,
.pageNation .pnNumber .current{
  color: #da5e22;
}
/* ページネーション */
.pageNation{
  display: flex;
  justify-content: center;
}
.pageNation > div{
  display: flex;
  flex-wrap: wrap;
  word-break: break-all;
}
.pnPrev, .pnNext{
  min-width: 3.5rem;
}
.pnPrev > a,
.pnNext > a{
  margin: 0 .6rem;
}
.pnPrev > a:hover,
.pnNext > a:hover{
  opacity: .5;
}
.pnNumber{
  /* margin: 0 .5rem; */
}
.pageNation a.toStart,
.pageNation a.toEnd{
  width: .4rem;
}
.pageNation a.prev,
.pageNation a.next{
  width: .325rem;
}
.pageNation{
  font-size: .575rem;
  margin: 1rem 0;
}
.pageNation .pnNumber a,
.pageNation .pnNumber span{
  margin: 0 .3rem;
  color: #282828;
}
.pageNation .pnNumber a:hover{
  color: #da5e22;
}
.pageNation img{
  vertical-align: middle;
}


/* 入力コントロール */
input[type=text],
select,
textarea{
  height: 1.4rem;
  border: none;
  border-radius: 3px;
  border: solid 1px #3a4d88;
  padding: 0.2rem 0.3rem;
}
::placeholder{
  color: #ccd0dd;
}
::-ms-input-placeholder {
  color: #ccd0dd;
}
:-ms-input-placeholder {
  color: #ccd0dd;
}
select{
  background-color: #fff;
  -webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
  padding-right: 1rem;
}
select::-ms-expand {
  display: none;
}
.select-container{
  position: relative;
  display: inline-block;
}
.select-container:after{
  content: "";
  display: inline-block;
  width: 0.6rem;
  height: 0.4rem;
  background-image: url(../images/select_arrow.png);
  background-size: 100% auto;
  position: absolute;
  top: 35%;
  right: 5%;
  pointer-events: none;
}

.submit a,
a.submit{
  display: block;
  width: 3rem;
  height: 1.4rem;
  line-height: 1.4rem;
  font-size: .665rem;
  color: #fff;
  text-align: center;
  border-radius: .175rem;
  background: #3a4d88;
}
.submit a:hover,
a.submit:hover{
  background: #db5e22;
}


/* 一覧 */
.dataList{
  margin-top: .7rem;
  font-size: .575rem;
}
.dataList-header ul,
.dataList-detail ul{
  display: flex;
  align-items: center;
  word-break: break-all;
}
.dataList-detail > div{
  border-bottom: 1px solid #ebebeb;
  line-height: 2rem;
}
.dataList-detail > div:last-child{
  border: none;
}
.dataList-header li{
  background-color: #3a4d88;
  color: #fff;
  text-align: center;
  line-height: 1.2rem;
}
.dataList-header li,
.dataList-detail li{
  /* font-size: .7rem; */
  /* padding: .4rem 0; */
  /* line-height: .575rem; */
}
.dataList-detail li{
  line-height: .575rem;
  padding: .5rem;
}
.dataList-detail a{
  color: #282828;
  display: block;
}
.dataList-detail a:hover{
  background-color: #ebebeb;
}

/* 詳細ページ */
.dataDetail-header {
  background-color: #3a4d88;
  color: #fff;
  padding: 0.5rem;
}
.dataDetail-header-top {
  font-size: .583rem;
  display: flex;
  align-items: center;
}
.dataDetail-header-top .category{
  line-height: .5rem;
  padding: .3rem;
  margin-right: .4rem;
  font-size: .5rem;
}
.dataDetail-header-top .date{
  color: #ccd0dd;
}
.dataDetail-header-title{
  margin: .6rem 0 .3rem;
}
.dataDetail-content{
  background-color: #ccd0dd;
  color: #282828;
  padding: 1rem;
  font-size: .665rem;
}
.dataDetail-content-inText{
  /* line-height: 1rem; */
}

/* スマホ対応 */
@media screen and (max-width:640px) {
  /* 背景 */
  .mdl .wrapper{
    padding: 1rem .75rem 16%;
  }
  /* 朝 */
  .mdl.asa .bg .chara:before{
    width: 16%;
    padding-bottom: 13.6%;
    bottom: .75%;
    left: 14%;
  }
  .mdl.asa .bg .chara:after{
    width: 6.4%;
    padding-bottom: 7.333%;
    bottom: 29%;
    left: 33%;
  }
  /* 夕方 */
  .mdl.yuu .bg .chara:before{

  }
  .mdl.yuu .bg .chara:after{

  }
  /* 夜 */
  .mdl.yoru .bg .chara:before{

  }
  .mdl.yoru .bg .chara:after{

  }

  .mdl.asa .bg .build:before, .mdl.yuu .bg .build:before, .mdl.yoru .bg .build:before{
    display: none;
  }
  .background img{
    width: 116%;
  }

  /* 見出し */
  .pageTitle .inner_pageTitle{
    padding: .5rem .8rem;
  }
  .pageTitle .inner_pageTitle:before{
    width: 2.4rem;
    height: 2.15rem;
  }
  .pageTitle .inner_pageTitle h3{
    padding-left: 0.5rem;
    font-size: 1.65rem;
  }
  .searchResult{
    padding: .6rem;
  }
  .searchResult,
  .searchResult span{
    font-size: .8rem;
    line-height: .8rem;
  }
  /* ページタブ */
  .pageTab > div{
    margin-right: .3rem;
  }
  .pageTab > div:last-child{
    margin-right: 0;
  }
  .pageTab .btn_inner a{
    font-size: .8rem;
    padding: .95rem 1.5rem 1rem !important;
  }
  /* ページネーション */
  .pageNation{
    font-size: 1.1rem;
    margin: 1.5rem 0;
  }
  .pnPrev, .pnNext{
    min-width: 4rem;
  }
  .pnNext{
    justify-content: right;
  }
  .pageNation .pnNumber a, .pageNation .pnNumber span{
    text-align: center;
    padding: .3rem .2rem;
  }
  .pageNation a.toStart,
  .pageNation a.toEnd{
    width: .6rem;
  }
  .pageNation a.prev,
  .pageNation a.next{
    width: .5rem;
  }
  .pnPrev > a,
  .pnNext > a{
    margin: 0 .65rem;
    padding-top: .2rem;
  }
  .pageNation .pnNumber a, .pageNation .pnNumber span{
    margin: 0 0.1rem;
  }
  input[type=text],
  select{
    height: 1.5rem;
    font-size: .7rem;
    padding: 0 0.2rem;
    color: #282828;
  }
  select{
    padding: 0 1rem 0 .2rem;
  }

  .submit a,
  a.submit{
    width: 3rem;
    height: 1.5rem;
    line-height: 1.5rem;
    font-size: .75rem;
  }

  .categoryList a{
    min-width: 28%;
    font-size: .8rem;
    line-height: 1.75rem;
    margin-bottom: .5rem;
  }
  .free{
    width: 100%;
  }


  /* 一覧 */
  .dataList-header li,
  .dataList-detail li,
  .dataList-detail li span.newsTitle{
    font-size: .675rem;
    line-height: .7rem;

    font-size: .725rem;
    line-height: .775rem;

    /* font-size: .9rem; */
  }
  .dataList-header li{
    padding: .4rem 0 !important;
  }
  .dataList-detail li,
  .dataList-detail li{
    padding: .75rem .5rem;
  }

  /* 詳細ページ */
  .dataDetail-header-top .category,
  .dataDetail-header-top .date{
    /* font-size: .8rem; */
  }
  .dataDetail-header-top .category{
    font-size: .6rem;
    line-height: .65rem;
    /* padding: 0.3rem 0.4rem; */
    margin-right: 0.4rem;
  }
  .dataDetail-header-top .date{
    font-size: .65rem;
    line-height: .65rem;
  }
  .dataDetail-header-title{
    font-size: 1.15rem;
    font-weight: bold;
    line-height: 1.4rem;
    margin: .5rem 0 .25rem;
  }
  .dataDetail-content{
    padding: 1.25rem;
  }
  .dataDetail-content-inText{
    font-size: .8rem;
    line-height: 1.25rem;
  }
}