@charset "utf-8";
/***********************************
幅が767px以下の場合
***********************************/
@media screen and (max-width: 767px){
body {
	/*font-size: 14px;
	font-size: 1.4rem;*/
	min-width: 320px;
}

/*----------------------------------------------------
 ヘッダー　header
----------------------------------------------------*/
header{
  position: fixed;
  top:0;
	margin-top:0;
  margin-bottom: 0;
	height:60px;
  background-color: #fff;
  z-index: 1000;
}

/* ロゴ */
.logo {
	float:left;
  margin: 8px 15px;
	width:80%;
}
.logo img{
  width:100%;
  max-width: 150px;
  height: auto;
}
.user-wrap {
  position: absolute;
  top:inherit;
  bottom: -70px;
  width:100%;
  height: 50px;
  z-index: 999;
  padding: 1em 0;
}
.user-info{
  clear: both;
  margin: 1em 0 1em;
  float:none;
  width:92%;
  text-align: center;
  font-size: 1.5rem;
}
.user-name{
  display: block;
  }
.user-logout{
  margin: 0 1em;
}
  
.header-title-wrap{
  clear: both;
  margin-top: 50px;
  padding: 0.3em;
  color: #fff;
  background-color: #337AB7;
}
.header-title{
  text-align: center;
  font-size: 1.8rem;
}
.search-wrap{
  height: 75px;
  line-height: 75px;
}
.search-wrap [type="text"] {
  width: 70%;
  max-width: 280px;
  padding: 8px 10px;
}
.search-wrap [type="submit"] {
  max-width: 50px;
  padding: 6px 6px 6px 2px;
  font-size: 1.5rem;
}

/* --- --- --- --- --- 
 構造 
--- --- --- --- --- */
.container{
  position: relative;  
	width:auto;
  margin: 96px auto 0;
}
.inner_cont{
	width:92%;
	overflow:hidden;
}

/** main-cont --------------------------------------- **/

#main{
  margin: 0 4% 4em;
  width:92%;
  max-width: inherit;
  float:none;
}
#main-single{
  margin: 0 4% 4em;
  width:92%;
  max-width: inherit;
  height: 100%;
}
.main-cont{
  max-width: inherit;
}
.main-cont img{
}
.sub-cont{
  margin-bottom: 70px;
  float:none;
  width:100%;
  max-width: inherit;
}

/** footer --------------------------------------- **/
.footer{
  clear: both;
	padding:0;
  background-color: #F9F9F9;
  border-top: solid 2px #337AB7;
}
.copyright {
	padding: 2em 0; 
}
.copyright p {
	color: #717171;
  font-size: 1.3rem;
  line-height: 1.2;
	text-align:center;
}

#pagetop{
	position:fixed;
	bottom:5px;
	right:5px;
	z-index: 9999;
}

/* drawer-user */
.drawer-user-wrap{
  position: relative;
  height: 75px;
  line-height: 75px;
  /*height: inherit;
  padding: 1em 0;*/
  background-color: #F9F9F9;
  font-size: 1.5rem;
} 
.drawer-user-info{
  margin: 0 auto;
  padding: 1em 0;
  width:100%;
  text-align: center;
  font-size: 1.5rem!important;
}
.drawer-user-name{
  display: block;
}
.drawer-user-logout{
 
}
  
/* --- --- --- --- --- 
　ナビ 
--- --- --- --- --- ---　*/
.nav-list-wrapper{
 border-top:solid 1px #E5E5E5; 
  }
.nav-list{
border-right:none;
}
.nav-list li {
  font-size: 1.6rem;
}
.nav-list li a {
  padding: 1em 1em 1em 4.5em;
}
.ico-mark::before{
  left:2em;
}
.sub-cont .nav-list li a {
  padding: 1em 1em 1em 4.5em;
}
.sub-cont .ico-mark::before{
 /* top:1.1em;*/
}

/*--------------------------------------------
 module設定（title,button等） CSS
----------------------------------------------*/

/*-- title --*/
.index-title{
  margin-top: 1.5em;
  margin-bottom: 1.2em;
	font-size:2.4rem;
	line-height:1.4;
	font-weight:bold;
}
.index-title-count{
  margin-left: 2em;
  padding-left: 2em;
  font-size: 1.6rem;
  font-weight: normal;
  border-left:solid 3px #aaa;
}

/*-- login --*/
.login-area{
  position: relative;
  top:50px;
  margin: 2em auto;
  width:92%;
  max-width: 564px;
  overflow: hidden;
}
.login-block{
  margin-bottom: 1em;
  padding: 2em 2em;
  border:solid 1px #B8CAD6;
}
.login-block input {
  display: block;
  margin-bottom: 1.5em;
  max-width: 460px!important;
}
.login-block input[type="submit"]{
  margin: 3em auto 0;
}
.login-text{
  line-height: 2;
}


/*-- info --*/
.info-lead-text{
  margin-bottom: 2em;
}
.info-list-wrap{}
.info-list{}
.info-list li{
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  border-top: solid 1px #ccc;
}
.info-list-date{
  margin: 0.5em 0;
  font-size: 1.4rem;
  color:#777;
}
.info-list-text{
  margin: 0.5em 0;
}

/*-- play-item --*/
.play-item-wrap{}
.play-item-video{}
.play-item{
  margin-bottom: 3em;
}
.play-item-title{
  position: relative;
	font-size:1.8rem;
	line-height:1.4;
}
.play-item-title::after{
  width: 60px;
  height: 1px;
}
.play-item-meta{}
.play-item-date{
  font-size: 1.4rem;
}
.play-item-text{}
.play-item-detail{
  font-size: 1.4rem;
}

/*-- play-list --*/
.play-list .play-item-wrap{
  clear: both;
}
.play-list .play-item-video{
  float:left;
  margin-right: 2.5%;
  width:40%;
  max-width: 372px;
  height: auto;
}
.play-list .play-item{
  width:57.5%;
  float: left;
  margin-bottom: 0;
}
.play-list .play-item-title{
  min-height: inherit;
	font-size:1.6rem;
	line-height:1.4;
}
.play-list .play-item-title::after{
  width: 60px;
  height: 1px;
}
.play-list .play-item-meta{
  min-height: inherit;
  font-size: 1.4rem;
  line-height: 1.4;
}
.play-list .play-item-date{
  font-size: 1.4rem;
  color:#777;
}

/*-- live-list --*/
  .live-cont{
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
  }
  .live-item-wrap{ 
  width: calc( 100% - 40px );
  margin: 10px 10px;
  padding: 10px;
  }
  .live-item{
  font-size: 1.4rem;
  }
  .live-item-title{
  font-size: 1.8rem;
  }
  .live-item-more{
  padding: 6px;
  width: 80px;
  font-size: 1.4rem;
  }

  /*-- .list-cont.live-list --*/
  .live-item-list .live-item{
  padding: 0 10px 10px;
  width: calc( 100% - 20px );
  border-top: solid 2px #1E73BE;
  } 
  .live-item-list .live-item-meta{
  margin: 15px 0;
  }
  .live-item-list .live-item-title{
  margin-top: 5px;
  }
 .live-item-list .live-item-lead{
  font-size: 1.6rem;
} 
  
  
 .item-close::after{
  font-size: 1.6rem;
  }
  
/*-- live-time-cont --*/
.live-time-cont{
  margin-top: 30px;
  border-top: solid 3px #ccc;
}
.live-time-title{
  margin: 20px 20px 0;
  font-size: 1.7rem;
}
.live-time-list{
  margin: 10px auto;
}
.live-time-list li{
  margin: 5px 5px;  
  width:calc( 50% - 13px );
  }
 .live-time-list li a{
  padding: 10px 15px 10px 5px;
  font-size: 1.7rem;
  }
  .live-time-list li a:before{
  right: 8px;
  width: 6px;
  height: 6px;
  border-right: solid 1px #008ec2;
  border-bottom: solid 1px #008ec2;
  }
  
  .live-all-list li a{
    font-size: 1.7rem;
  }
  

/*-- ico-title --*/
.ico-title{
  position: relative;
  margin: 1em 0;
  font-size: 2.0rem;
}
.ico-title span{
  margin-left: 2em;
}
.ico-title::before{
  position: absolute;
  top:0;
  left:0.5em;
}
.ico-res::before{
  content:url(../../images/ico_res.png);
  heigh: 22px;
  width: 22px;
}
.ico-comment::before{
  content:url(../../images/ico_comment.png);
  heigh: 21px;
  width: 22px;
}

/*-- res-cont --*/
.res-cont{
  border-top: solid 3px #1E73BE;
}
.res-item-wrap{
  float: right;
  margin: 0 0 3em 5%;
  width:92%;
  max-width: 700px;
}
.res-item-video{}
.res-item{}
.res-item-text{}
.res-item-detail{
  font-size: 1.4rem;
}

/*-- comment --*/
.comment-wrap{
  clear: both;
  margin-bottom: 4em;
  border-top: solid 3px #1E73BE;
}
.comment-item{
  border-bottom: solid 1px #CCCCCC;
}
.comment-item-user{
  padding: 0.5em 1em;
  background-color: #EEEEEE;
}
.comment-item-text{
  margin: 0.5em 1em;
  font-size: 1.5rem;
}
.comment-item-date{
  margin-right: 1em;
  font-size: 1.4rem;
  text-align: right;
  color:#AAAAAA;
}
.comment-post{
  margin: 2em auto;
  width: 90%;
  text-align: center;
}
.comment-post-title{
  margin:0.5em auto;
  width:96%;
  text-align: left;
  font-size: 1.8rem;
}

/*-- search page --*/
 .search-area{
  margin-top: 40px;
  padding-top: 0px;
  }
.search-table th{
  display: block;
  padding: 10px 10px 0;
  width:calc(100% - 20px);
  text-align: left;
  }
  .search-table td{
  padding: 10px 0;
  width: 100%;
  }
  .search-textarea{
  margin: 5px 5px;
  width: calc( 100% - 40px );
  }
  .search-period{
  margin: 5px;
  }  
  .search-table .btn-search{
  margin: 0 auto;
  text-align: center;
  }
.search-check-list li{
  font-size: 1.4rem;
  }
 .search-check-item input[type="checkbox"]{
  margin-right: 10px;
  }
 .search-check-item input[type="checkbox"]::before{
  width: 18px;
  height: 18px;
  top: 5px;
  }
  .search-check-item input[type="checkbox"]:checked::after{
    margin-top: -5px;
  }
  
/* search-item-list */
.search-item-list li{
  padding: 20px 10px 10px;
  }
.search-item-list img{
  float:none;
  margin-right: 0;
  margin-bottom: 20px;
  width:100%;
  max-width:330px;
  }
  .search-item{
  font-size: 1.4rem;
  }
  .search-item-title{
  font-size: 2.0rem;
  }
  .search-item-lead{
  margin-bottom: 5px;
  }
  /*-- pager --*/
  .pager-area{
  margin: 20px auto;
  padding-top: 20px;
  border-top: solid 1px #ccc;
  font-size: 1.4rem;
}
  
.al-c{
  text-align: center!important;
  } 
.m-pc{
display: none;
}
.m-sp{
display: block;
}

/* form ---------------- */
 input, textarea {
  margin: 0;
  padding: 10px;
  //width: 92%;
  max-width: 100%;
  font-size: 1.6rem;
  border: 0;
  border: solid 1px #ccc;
  border-radius: 3px;
}
textarea {
  height: 10em;
}
/* button, input, select, textarea {
    margin: 0;
    line-height: 1;
} */

input[type="submit"]{
  border: none;
  outline: none;
  margin: 0;
  width:98%;
  max-width: 460px;
  text-align: center;
  background-color: #008EC2;  
  color:#fff;
  -webkit-transition: opacity 0.5s;
    transition: opacity 0.5s;
}
input[type="submit"]:hover{
  background-color: #00BAFF; 
}



}