@charset "utf-8";

/* topimg
--------------------------------------- */
.wideslider {
	width: 100%;
	margin-bottom:30px;
	text-align: left;
	position: relative;
	overflow: hidden;
	z-index:0;
}

@media screen and (max-width: 800px) {
.wideslider {
	margin-bottom:15px;
	margin-top:0px;
}
}

@media screen and (max-width: 568px) {
.wideslider {
	margin-top:0px;
	margin-bottom:10px;
}
}
	 
.wideslider ul,
.wideslider ul li {
	float: left;
	display: inline;
	overflow: hidden;
}

.wideslider ul li img {
	width: 100%;
	display: none;
}

.wideslider_base {
	top: 0;
	position: absolute;
}
.wideslider_wrap {
	top: 0;
	position: absolute;
	overflow: hidden;

}

.wideslider ul li a:hover img { opacity: 0.8; }

.slider_prev,
.slider_next {
	top: 0;
	overflow: hidden;
	position: absolute;
	z-index: 100;
	cursor: pointer;
}
.slider_prev {background: #fff url(../images/prev.jpg) no-repeat right center;}
.slider_next {background: #fff url(../images/next.jpg) no-repeat left center;}

.slider_prev {background: #000 url(../images/top/prev.png) no-repeat right 20px center;}
.slider_next {background: #000 url(../images/top/next.png) no-repeat left 20px center;}

.pagination {
	bottom: 25px;
	left: 0;
	width: 100%;
	height: 15px;
	text-align: center;
	position: absolute;
	z-index: 100;
}


@media screen and (max-width: 568px) {
.pagination {
	display:none;
}
}

.pagination a {
	margin: 0 5px;
	width: 16px;
	height: 16px;
	display: inline-block;
	overflow: hidden;
	background: url(../images/mark_off.png) no-repeat;
}
.pagination a.active {
	background: url(../images/mark_on.png) no-repeat;
}

/* top_info
--------------------------------------- */
.top_info  {
  padding: 1% 0 0;
  text-align: center;
  font-size:2.2em;
  color:#FFF;
}
}

@media screen and (max-width: 800px) {
.top_info {
  padding: 1% 3%;
}
}

@media screen and (max-width: 568px) {
.top_info {
  font-size:1.5em;
  line-height:1.5;
  padding: 1% 1%;
}
}

/* catch
--------------------------------------- */
.catch  {
  padding: 1% 0 2%;
  text-align: center;
  line-height:1.8;
}

@media screen and (max-width: 800px) {
.catch {
  text-align: left;
  font-size:0.9em;
  padding: 1% 3%;
}
}

@media screen and (max-width: 568px) {
.catch {
  font-size:14px;
  line-height:1.6;
}
}

/*top_contents
---------------------------------------------------------------------------*/
#top_contents {
  padding: 20px 0;
  width:100%;
  max-width:1100px;
  margin:0 auto;
}

#top_contents ul{
  width:100%;
  float:left;
  margin:0 auto;
}

#top_contents li{
  width:50%;
  float:left;
  box-sizing: border-box;
  padding:0% 2% 4%;
}

@media screen and (max-width: 568px) {
#top_contents li{
  width:100%;
  float:left;
  padding:0% 1% 5%;
}
}

#top_contents li a:hover img { opacity: 0.8; }

.tp_photo{
  width:100%;
  margin-bottom:10px;
  border:1px solid #898989;
}

.tp_photo img{
  width:100%;
  height:auto;
}

#top_contents li h2{
  font-weight:normal;
  font-size:1.2em;
  margin-bottom:7px;
  padding:0 1%;
  color:#FFF;
}

@media screen and (max-width: 800px) {
#top_contents li h2{
  font-size:1em;
}
}

@media screen and (max-width: 568px) {
#top_contents li h2{
  font-size:15px;
}
}

#top_contents li p{
  font-size:13px;
  color:#ACACAC;
}

@media screen and (max-width: 568px) {
#top_contents li p{
  font-size:12px;
}
}


/*topics
---------------------------------------------------------------------------*/
#topics {
  padding: 20px 1% 0;
  box-sizing: border-box;
  width:100%;
  max-width:1100px;
  margin:0 auto 5%;
  clear:both;
}

#topics h3{
  font-weight: 400;
  text-transform: uppercase;
  font-family: 'Roboto Condensed', sans-serif;
  color: #FFF;
  font-size:1.4em;
  margin-bottom:0;
  width:96%;
  border-bottom:0.5px solid #898989;
  padding:0 2% 8px;
}

@media screen and (max-width: 568px) {
#topics h3{
  font-size:1em;
}
}

.news_box{
	width:96%;
	margin:2% 2%;
}

.news_box li{
	width:100%;
	clear:both;
	padding:1% 0;
}

@media screen and (max-width: 568px) {
.news_box li{
	font-size:0.8em;
}
}

.news_box .day{
  font-weight: 400;
  text-transform: uppercase;
  font-family: 'Roboto Condensed', sans-serif;
  color: #FFF;
}

.news_box span{
	margin-left:3%;
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック',Helvetica,Arial,sans-serif;
}

.news_box a {
	text-decoration: underline;
	color:#FFF;
	}

.news_box a:hover {  
	text-decoration	: none;
	color:#FFF;
	}