@charset "utf-8";

@import "base_layout.css";
@import "common_parts.css";


.contents{
	padding: 0 0 100px 0;
}
.bnMitetoku{
	padding: 5px 0;
	text-align: center;
}
.bnMitetoku img{
	max-width: 100%;
	height: auto;
}

/*#newsTopics
************************************************************************************/
#newsTopics{
	margin: 0 0 35px 0;
}

#newsTopics h2{
	text-align: center;
	padding: 0.7em 0;
	border-bottom: 1px solid #ededed;
	font-size: 21px;
	font-family: 'Noto Sans Japanese', sans-serif;
	font-weight: 600;
}


.mainFrame .frame{
	margin: 0 5px;
	padding: 5px;
	border-right: 1px solid #EDEDED;
}
.mainFrame .frame:last-child{
	border: 0;
}

.mainFrame .frame a{
	padding: 0 10px 0 0;
	display: block;
	text-decoration: none;
	color: #333;
}

.mainFrame .frame .image{
	width: 28%;
	height: 28%;
	float: left;
	line-height: 28%;
	vertical-align: middle;
	text-align: center;
	margin: 0 2% 0 0;
}
.mainFrame .frame .image img{
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	vertical-align: middle;
}

.mainFrame .frame .frameCmt{
	width: 70%;
	float: right;
}

.mainFrame .frame .frameCmt .ttl{
	font-size: 16px;
	font-family: 'Noto Sans Japanese', sans-serif;
	font-weight: 500;
}

.mainFrame .frame .frameCmt .cmt{
	display: block;
	padding: 7px 0 0 0;
	font-size: 11px;
	clear: both;
	color: #666;
}
.mainFrame .frame .cmt:after{
	content: "...";
}

/*gNavTop
************************************************************************************/
#gNavTop{
	display: none;
}


/*category
************************************************************************************/
.category{
	margin: 0 0 1px 0;
	background: #FFF;
}

.category a{
	color: #000;
	text-decoration: none;
}

.category .title{
	padding: 7px 7px 0px 7px;
	margin: 0 0 7px 0;
	text-align: center;
	color: #666;
	font-family: 'Noto Sans Japanese', sans-serif;
}
.category .title:after{
	content: url(../../img/sp/ar_down.png);
	display: block;
	-webkit-transform: scale(0.5); 
	-moz-transform: scale(0.5); 
}
.category .title h3{
	font-size: 24px;
	font-weight: 500;
}
.category .title h3 a{
	color: #000;
}
.category .title p{
	font-size: 12px;
	padding: 5px 0 0 0;
	font-weight: 200;
}

.category .btn{
	padding: 15px 7px;
	margin: 0;
	font-family: 'Noto Sans Japanese', sans-serif;
	font-size: 13px;
	font-weight: 300;
	text-align: right;
	vertical-align: middle;
}

.category .btn a{
	color: #666;
	text-decoration: none;
	display: block;
}
.category .btn a:before{
	content: url(../../img/sp/ar_right.png);
	display: inline-block;
	-webkit-transform: scale(0.5); 
	-moz-transform: scale(0.5);
	vertical-align: middle;
	position: relative;
	top: -2px;
}


.frameArticles{
	margin: 1px auto;
	width: 96%;
	color: #000;
	background: #FFF;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

.frameArticles ul{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-justify-content: left;
	justify-content: left;
}

.frameArticles .inframe li{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	width: 25%;
	padding: 0.5%;
}


.frameArticles .inframe li .photo{
	position: relative;
	width: 100%;
	z-index: 10;
	overflow: hidden;
	text-align: center;
	background: #EDEDED;
}
.frameArticles .inframe li .photo:before {
	content:"";
	display: block;
	padding-top: 75%; /* 高さを幅の75%に固定 */
}
.frameArticles .inframe li .photo img{
	height: 100%;
	width: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	margin: auto;
}

.frameArticles .inframe li .photo .cate{
	font-weight: 100;
	font-size: 12px;
	z-index: 30;
	position: absolute;
	bottom: 10px;
	right: 10px;
	background: url(../../img/common/bg_yellow.png) repeat;
	padding: 2px 5px;
	color: #333;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border: 1px solid #FFF;
}

.frameArticles .inframe li .ttl{
	font-size: 14px;
	padding: 7px 10px;
}
.frameArticles .inframe li .ttl a{
	color: #399;
	text-decoration: none;
}


/*----------------------------------------------------------------------*/
#cateOut{
	border-top: 1px solid #00a0c6;
}
#cateMainte{
	border-top: 1px solid #19cbc1;
}
#cateHobby{
	border-top: 1px solid #6eb423;
}
#cateLife{
	border-top: 1px solid #eca700;
}


/*slider
************************************************************************************/
.wrapper .photo{
	height: 300px;
}

/* .slideShow
------------------------- */
.wideslider {
    width: 100%;
    text-align: left;
    position: relative;
    overflow: hidden;
}
 
.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;
 
}
.slider_prev,
.slider_next {
    top: 0;
    overflow: hidden;
    position: absolute;
    z-index: 100;
    cursor: pointer;
}
.slider_prev {background: #fff url(../img/prev.jpg) no-repeat right center;}
.slider_next {background: #fff url(../img/next.jpg) no-repeat left center;}
 
.pagination {
    bottom: 10px;
    left: 0;
    width: 100%;
    height: 15px;
    text-align: center;
    position: absolute;
    z-index: 200;
}
 
.pagination a {
    margin: 0 5px;
    width: 10px;
    height: 10px;
    display: inline-block;
    overflow: hidden;
    background: #333;
}
.pagination a.active {
    filter:alpha(opacity=100)!important;
    -moz-opacity: 1!important;
    opacity: 1!important;
}
 
 
/* =======================================
    ClearFixElements
======================================= */
.wideslider ul:after {
    content: ".";
    height: 0;
    clear: both;
    display: block;
    visibility: hidden;
}
 
.wideslider ul {
    display: inline-block;
    overflow: hidden;
}


.bnMitetokuFooter{
	display: none;
}



.ecbanner{
	padding: 15px 0;
	background: #f1f1f1;
	text-align: center;
}
.ecbanner img{
	max-width: 100%;
	height: auto;
}