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

/* masonry 設定*/

/*　メイン設定　*/
.js-masonry {
	padding-bottom: 50px;
}

.item {
	background: #fff;
	width: 230px;
	margin-bottom: 10px;
	float: left;
}

/* ２枠使用分　*/
.item.special-box {
	height: 255px;
	width: 470px;
	padding: 0;
	background: #fff;
	padding-top: 8px;
	margin-bottom: 20px;
}

.item.townguide-sp {
	height: 255px;
	width: 470px;
	padding: 0;
	background: #fff;
	padding-top: 8px;
	margin-bottom: 20px;
}

.special-box .title-box {
	background: url(../img/index/bg-special-title.png) no-repeat center center;
	padding: 10px;
	width: 470px;
	height: 68px;
}

h2.index-h2 {
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-size: 18px;
	color: #e92763;
	border-left: 4px solid #e92763;
	padding-left: 10px;
}

h3.index-h3 {
	font-size: 18px;
	padding-left: 10px;
}

h3.index-h3 a {
	color: #3f2802;
	text-decoration: none;
}
h3.index-h3 a:hover {
	text-decoration: underline;
}

.special-box .thumb-img {
	width: 200px;
	margin: 15px;
	float:left;
}

.special-box .detail-box {
	float:right;
	width: 230px;
	margin: 10px 10px 0 0;
}

.fukuoka_tour .detail-box {
    float: right;
    width: 230px;
    margin: 5px 10px 0px 0px;
}

.special-box.kitakyushu{
	background: #fff url(../img/index/bn-special.png) repeat-x top center;
}

.special-box.fukuoka{
	background: #fff url(../img/index/bn-special.png) repeat-x top center;
}

.special-box.fukuoka_tour{
	height: 200px;
	background: #fff url(../img/index/bn-special.png) repeat-x top center;
}

/* 通常記事ボックス */
.item.information-box {
	width: 100%;
	padding-top: 9px;
	margin-bottom: 20px;
}

.item.subbox {
	padding-top: 9px;
	margin-bottom: 20px;
	height: 350px;
}

.subbox .thumb-img {
	width: 200px;
	height: 150px;
	margin: 10px 15px 15px 15px;
	position: relative;
	z-index: 1;
	text-align: center;
}

.subbox .img-new-box {
	position: relative;
	z-index: 2;
	top: -180px;
	left: 195px;
	height:0;
	width:0;
}

.subbox .img-coupon-box {
	position: relative;
	z-index: 2;
	top: -60px;
	left: 165px;
	height:0;
	width:0;
}

.subbox.backnumber{
	background: #fff url(../img/index/bn-backnumber.png) repeat-x top center;
	height: 220px;
}

.subbox.beauty{
	background: #fff url(../img/index/bn-yoga.png) repeat-x top center;
}

.subbox.yoga{
	background: #fff url(../img/index/bn-yoga.png) repeat-x top center;
}

.subbox.sale{
	background: #fff url(../img/index/bn-special.png) repeat-x top center;
}

.subbox.sweetslove{
	background: #fff url(../img/index/bn-sweet.png) repeat-x top center;
}

.subbox.townguide{
	background: #fff url(../img/index/bn-town.png) repeat-x top center;
}

.subbox.townguide-sp{
	background: #fff url(../img/index/bn-town.png) repeat-x top center;
}

.subbox.breadlove{
	background: #fff url(../img/index/bn-bread.png) repeat-x top center;
}

.subbox.shinan{
	background: #fff url(../img/index/bn-special02.png) repeat-x top center;
}
/*
.subbox.special{
	background: #fff url(../img/index/bn-special02.png) repeat-x top center;
}
*/
.subbox.special02, .subbox.special{
	background: #fff url(../img/index/bn-special.png) repeat-x top center;
}

.subbox.hyoushi{
	background: #fff url(../img/index/bn-hyoushi.png) repeat-x top center;
}

.subbox.bishoku{
	background: #fff url(../img/index/bn-bishoku.png) repeat-x top center;
}

.subbox.sunphoto{
	background: #fff url(../img/index/bn-sunphoto.png) repeat-x top center;
}

.subbox.yasuuma-kitakyushu{
	background: #fff url(../img/index/bn-yasuuma.png) repeat-x top center;
}

.subbox.yasuuma-fukuoka{
	background: #fff url(../img/index/bn-yasuuma.png) repeat-x top center;
}

.subbox.present-kitakyushu{
	background: #fff url(../img/index/bn-pre.png) repeat-x top center;
}

.subbox.present-fukuoka{
	background: #fff url(../img/index/bn-pre.png) repeat-x top center;
}

.subbox.kitsch{
	background: #fff url(../img/index/bn-kitsch.png) repeat-x top center;
}

.subbox.skids{
    background: #fff url(../img/index/bn-sunphoto.png) repeat-x top center;
}

.subbox h3.index-h3 {
	margin-top: 5px;
	font-size: 13px;
}
.subbox h3.index-h3 a {
	color: #3f2802;
	text-decoration: none;
}

.sweetslove h3.index-h3  { color: #f2989c; }
.yasuuma-kitakyushu h3.index-h3  { color: #ffbe00; }
.yasuuma-fukuoka h3.index-h3  { color: #ffbe00; }
.event-kitakyushu h3.index-h3  { color: #93c054; }
.event-fukuoka h3.index-h3  { color: #93c054; }
.present-kitakyushu h3.index-h3  { color: #1fb4da; }
.present-fukuoka h3.index-h3  { color: #1fb4da; }
.sale h3.index-h3  { color: #e92763; }
.yoga h3.index-h3  { color: #ab77bc; }
.beauty h3.index-h3  { color: #ab77bc; }
.sunphoto h3.index-h3  { color: #6ec8c7; }
.bishoku h3.index-h3  { color: #f67d42; }
.shinan h3.index-h3  { color: #e1a6f4; }
.special h3.index-h3  { color: #e92763; }
.townguide h3.index-h3  { color: #93c054; }
.backnumber h3.index-h3  { color: #5a9a00; }
.breadlove h3.index-h3  { color: #B19B62; }
.hyoushi h3.index-h3  { color: #FF8AA8; }
.kitsch h3.index-h3  { color: #8d19cf; }
.skids h3.index-h3  { color: #6ec8c7; }

.subbox .detail-box {
	height: 120px;
	padding: 0 15px 5px;
}

.subbox .detail-box2 {
	height: 140px;
	padding: 0 15px 5px;
}

.subbox .detail-box3 {
	height: 213px;
	padding: 0 15px 5px;
}

.subbox .article-detail-box1 {
	font-size: 12px;
}

/*通常記事小見出し*/
.subbox h4 {
	font-size: 13px;
	margin-bottom: 5px;
}
.subbox h4 a {
	color: #3f2802;
	text-decoration: none;
}
.subbox h4 a:hover {
	text-decoration: underline;
}

.subbox .date-box {
	font-size: 11px;
	text-align: right;
	padding: 0 15px;
}

.navigation {
	background: none;
	width: 100%;
	text-align: center;
	padding: 10px 0 0 0;
}


@media (min-width: 1010px) {
/*左サイドメニューが出ている間は、この設定が生きる。*/
	#index-slide {
		overflow: hidden;
		max-width: 950px;
		margin-left: 240px;
        height:600px;
	}
}

@media (max-width:1244px) {
	#index-slide {
        height:460px;
    }
}

@media (max-width: 739px) {
	#index-slide {
        height:330px;
    }
}

@media (max-width: 480px) {
	#index-slide {
        height:auto;
    }
}

@media (max-width: 870px) {
	#banner-box {
		padding: 20px 20px 0;
	}
}

@media (max-width: 500px) {
	/*スマホの場合の幅・高さ調整*/
	.item.special-box, .item.subbox {
		display: block;
		height: auto;
		width: 100%;
	}
	.subbox.backnumber {
		height: 220px;
	}
	.special-box .thumb-img {
		float: none;
		margin: 5px auto 3px;
	}
	.special-box .detail-box, .subbox .detail-box, .subbox .detail-box2, .subbox .detail-box3 {
		height: auto;
		float: none;
		width: 95%;
		margin: 0 auto 10px;
		padding: 5px;
	}
	.special-box .title-box {
		width: 100%;
	}
	.subbox .thumb-img {
		margin: 10px auto;
	}
	.subbox .img-new-box, .subbox .img-coupon-box, .subbox .date-box { display: none; }

}
