@charset "utf-8";

html{
	background: #f7f8f8;
}
/* *** header関係 *** */
header .header_back{
	top: 50%;
}
.header_title_box{
	text-align: left;
	margin-left: 45px;
	padding-top: 10px;
}

/* ***タグ関係*** */
.list_genre{
	text-align: center;
	position: absolute;
	font-size: 0;
	width: 100%;
	bottom: 0;
	left: 0;
}
.tag{
	display: inline-block;
	font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", sans-serif;
	font-size: 13px;
	font-size: 3.85vw;
	font-weight: bold;

	max-width: 30.68vw;
	width: 100%;
	line-height: 8.5vw;
	margin: 0px 2px;
	color: #fff;
	/*background: #c3d600;*/
	background: #f39700;

	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	vertical-align: bottom;
	text-align: center;
	padding-top: 5px;

}
.tag:nth-child(1){
	background: #f39700;
}
.tag:nth-child(2){
	background: #0093d5;
}
.tag:nth-child(3){
	background: #e51572;
}
.tag.red{
	/*color: #006834;*/
	color:#f39700;
	background: #fff;
	padding-top: 5px;
	padding-top: 10px;

}

/*新規投稿ボタン*/
.list_new_btn{
	display: inline-block;
	font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", sans-serif;
	font-weight: bold;
	font-size: 13px;

	max-width: 56px;
	width: 100%;
	height: 42px;
	color: #fff;
	background: #f18d00;
	border-radius: 8px;
	vertical-align: bottom;

	position: absolute;
	right: -50px;
	bottom: -5px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
	z-index: 5;
}
.new_text{
	width: 30px;
	line-height: 15px;
	padding: 7px 5px;
}

/*プラスアイコン*/
.outer_circle{
	display: inline-block;
	font-size: 0;
	width: 26px;
	height: 26px;
	background: #fff;
	border-radius: 50%;

	position: absolute;
	top: 12px;
	right: -7px;
}
.icon {
	display: inline-block;
	position: relative;
	width: 20px;
	height: 20px;
	margin-top: 3px;
	margin-left: auto;
	margin-right: auto;
	background: #00a0e8;
	border-radius: 50%;
}

.icon::before, .icon--plus::after {
	position: absolute;
	top: 9px;
	left: 50%;
	content: '';
	display: inline-block;
	width: 13px;
	height: 13px;
	border-top: 2px solid #fff;
	transform: translateX(-50%);
}

.icon--plus:after {
	top: 3px;
	left: -3px;
	transform: rotate(90deg);
}


/* ***スクロールコンテンツ*** */
.scroll_list{
	/*height: calc(100% - 105px);*/
	/*	height: calc(100% - 25.34vw);*/
	height: calc(100% - 35.34vw);
	/*height: calc(100% - 17.1%);*/
	overflow-y: scroll;
	overflow-x: hidden;

	-webkit-overflow-scrolling: touch;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

/*検索関係*/
.list_search{
	width: 100%;
	/*height: 57px;*/
	padding-top: 12px;
	/*padding-top: 3.63vw;*/
	padding-bottom: 12px;
	/*padding-bottom: 2.9vw;*/

	text-align: center;
	background-color: #fff;

	-webkit-overflow-scrolling: touch;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

.list_search select,
.list_search input,
.list_search hr,
.list_search button{
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", sans-serif;
	/*font-size: 3.5vw;*/
	font-size: 2.9vw;
	/*color: #9f9fa0;*/
	display: inline-block;
	border: 1px solid #9f9fa0;
	/*height: 33px;*/
	height: 7.98vw;
	vertical-align: middle;
	padding: 0px 6px;
}

.list_search select{
	/*max-width: 28.989vw;*/
	max-width: 22vw;
	width: 100%;
	color: #9f9fa0;
	background: url(../img/common/select_icon.png) no-repeat right center;
	background-size: 3vw;
	background-position: right 2vw bottom 3vw;
}

.list_search select.list_member_select {
	/*max-width: 82.86vw;*/
	max-width: 71vw;
}

.list_search select.highlight{
	color: #303232;
}

.list_search select option{
	font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif;
	color: #303232;
	font-size: 12px;
}

.list_search select option:first-child{
	/*display: none;*/
}

.list_search input{
	max-width: 34.2vw;
	width: 100%;
}

.list_search hr{
	border: 0px;
	border-top: 1px solid #9f9fa0;
	/*width: 10px;*/
	width: 1vw;
	/*height: 1px;*/
	height: 0.245vw;
	/*padding: 0 3px;*/
	padding: 0 0.725vw;
}

.list_search button{
	background: #eb6000;
	border: 2px solid #eb6000;
	border-radius: 7px;
	width: 8.96vw;
	height: 8.199vw;
	padding: 2px;
}

.list_search button:active{
	background: #d55c08;
	border: 2px solid rgba(0, 104, 52, 0.1);
}
.list_search .area_checkbox {
	overflow: scroll;
	width: 100%;
	white-space: nowrap;
	padding-top: 10px;
	height: 20px;
	text-align: left;
	overflow-y: hidden;
}
.list_search .area_checkbox input{
	width: 14px;
	height: 14px;
	display: none;
}
.list_search .area_checkbox input[type=checkbox] + label {
	box-sizing: border-box;
	cursor: pointer;
	padding: 5px 10px 5px 20px;
	position: relative;
	width: auto;
	font-size: 10px;
}
.list_search .area_checkbox input[type=checkbox] + label::before {
	position: absolute;
	top: 50%;
	left: 0px;
	display: block;
	margin-top: -8px;
	width: 14px;
	height: 14px;
	content: '';
	background: #dcdddd;
	border: 1px solid #dcdddd;
	border-radius: 4px;
}

.list_search .area_checkbox input[type=checkbox]:checked  + label::before {
	position: absolute;
	top: 50%;
	left: 0px;
	display: block;
	margin-top: -8px;
	width: 14px;
	height: 14px;
	content: '';
	background: #000;
	border-radius: 4px;
	border: 0.3vw solid #000;
}
.list_search .area_checkbox input[type=checkbox]:checked  + label::after {
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	content: '';
	display: block;
	height: 7px;
	left: 4px;
	margin-top: -7px;
	position: absolute;
	top: 50%;
	transform: rotate(45deg);
	width: 5px;
}

.search_btn img{
	/*width: 16px;*/
	width: 5.8vw;
}
.search_btn p{
	margin-top: -7px;
	/*font-size: 10px;*/
	font-size: 2vw;
	color: #0093d5;
	/*    transform: scale(0.7);*/
}

.search_date{
	float: left;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.search_date.not{
	width: 51%;
}

/*新規投稿ボタン*/
.create_btn{
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", sans-serif;
	font-size: 4vw;
	font-weight: bold;
	display: inline-block;
	margin-top: 11px;
	max-width: 94.686vw;
	width: 100%;
	line-height: 9vw;
	letter-spacing: 2px;
	color: #fff;
	/*background: #0093d5;*/
	background: #eb6000;

}


.create_btn:active{
	/*opacity: 0.6;*/
	background-color: #d35600;
}

.list_main .time {
	font-weight: bold;
	margin-top: -1px;
}

.list_main .place a {
	color: #0000ee;
	text-decoration: underline;
}

.list_main .name {
	white-space: nowrap;
	display: inherit;
}

.list_main.li_member .name{
	white-space: normal;
	display: -webkit-box;
}


/* *** レスポンシブ *** */
@media screen and (max-width: 375px) {
	.tag{
		/*font-size: 11px;*/
		/*max-width: 90px;*/
		/*font-size: 12px;*/
		/*max-width: 110px;*/
		line-height: 36px;
	}
	.list_search select, .list_search input, .list_search hr, .list_search button{
		/*max-width: 95px;*/
		/*font-size: 10px;*/
	}
	.create_btn{
		/*max-width: 353px;*/
		/*font-size: 12px;*/
	}

	.list_search select.list_member_select{
		/*width: 305px;*/
	}
}

@media screen and (max-width: 360px) {

}

@media screen and (max-width: 320px) {
	.new_text{
		line-height: 12px;
		padding: 7px 2px;
	}
	.tag{
		/*font-size: 10px;*/
		max-width: 95px;
		line-height: 33px;
	}
	.list_new_btn{
		max-width: 45px;
		height: 38px;
		font-size: 10px;
		right: -40px;
	}
	.outer_circle{
		width: 20px;
		height: 20px;
	}
	.icon{
		width: 16px;
		height: 16px;
		margin-top: 2px;
	}
	.icon::before{
		top: 7px;
		width: 10px;
		height: 10px;
	}
	.icon--plus::after{
		left: -5px;
		top: 1px;
	}
	.list_search select, .list_search input, .list_search hr, .list_search button{
		max-width: 70px;
	}
	.list_search select{
		background-position: right 2px bottom 9px;
	}
	.list_search hr{
		width: 5px;
	}
	.create_btn {
		max-width: 285px;
	}
}