@charset "UTF-8";

/* アイデア共通 */

#main .target_list {
	margin: 10px 0;
	display: flex;
	flex-wrap: wrap;
}
#main .target_list li {
	width: 16.66%;
	box-sizing: border-box;
	padding: 0 10px 10px 0;
}
#main .target_list li img {
	width: 100%;
}

@media screen and (max-width: 767px) {
	#main .target_list {
		margin: 2vw 0;
	}
	#main .target_list li {
		width: 30%;
		padding: 0 2vw 2vw 0;
	}
}


/* アイデア一覧画面 */
#idea_list .title1 {
	text-align: center;
	color: #4d4d4d;
	font-size: 30px; font-size: 3.0rem;
}
#idea_list .title2 {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 30px 0 35px;
	text-align: center;
	background: #a03024 url("../images/common/bg_texture.png") repeat;
	color: #fff;
	font-size: 24px; font-size: 2.4rem;
	padding: 15px;
}
#idea_list .title2 strong {
	display: inline-block;
	text-align: right;
	width: 4em;
	padding: 0 15px;
	font-size: 42px; font-size: 4.2rem;
	font-weight: 400;
	background: #fff;
	color: #000;
	margin: 0 15px;
	border-radius: 15px;
}

#idea_list .idea_box{
	margin-bottom: 35px;
	border: #254b75 4px solid;
	border-radius: 15px;
	position: relative;
	padding-bottom: 20px;
}
#idea_list .idea_box::before {
	content: "";
	display: block;
	width: calc( 100% + 8px);
	height: calc( 100% + 8px);
	background: url("../images/common/bg_texture.png") repeat;
	position: absolute;
	left: -4px;
	top: -4px;
	z-index: 5;
	border-radius: 15px;
}
#idea_list .idea_box h4{
	display: flex;
	align-items: center;
	background: #254b75;
	color: #fff;
	padding: 15px;
	font-size: 20px; font-size: 2.0rem;
	position: relative;
}
#idea_list .idea_box h4::before {
	content: "";
	display: block;
	width: 48px;
	height: 52px;
	background: url("../images/idea/mame_icon.png") no-repeat right center;
	background-size: contain;
}
#idea_list .idea_box h4 strong {
	display: inline-block;
	width: 15em;
	padding: 5px 15px;
	font-size: 24px; font-size: 2.4rem;
	background: #fff;
	color: #254b75;
	margin: 0 15px;
	border-radius: 15px;
}

#idea_list .idea_box .idea_box_inbox {
	padding: 35px 35px 0;
}

#idea_list .idea_box .idea_box_inbox .text {
	font-size: 26px; font-size: 2.6rem;
	font-weight: 500;
	margin-bottom: 20px;
}

#idea_list .idea_box .btnType {
	position: relative;
	z-index: 10;
}


@media screen and (max-width: 767px) {
	#idea_list .title1 {
		font-size: 3.2vw;
	}
	#idea_list .title2 {
		margin: 3vw 0 3vw;
		font-size: 3.2vw;
		padding: 1.5vw;
	}
	#idea_list .title2 strong {
		padding: 0 1vw;
		font-size: 4.8vw;
		margin: 0 2vw;
		border-radius: 2.5vw;
	}

	#idea_list .idea_box{
		margin-bottom: 3vw;
		border: #254b75 3px solid;
		border-radius: 2.5vw;
		padding-bottom: 2vw;
	}
	#idea_list .idea_box h4{
		padding: 2vw;
		font-size: 2.6vw;
		display: inline-flex;
		flex-wrap: wrap;
		justify-content: flex-end;
	}
	#idea_list .idea_box h4::before {
		display: inline-block;
		width: 6.4vw;
		height: 7vw;
	}
	#idea_list .idea_box h4 strong {
		width: 47vw;
		display: inline-block;
		padding: 1vw 1.5vw;
		font-size: 3.2vw;
		margin: 0 0 0 2vw;
		border-radius: 2.5vw;
	}

	#idea_list .idea_box .idea_box_inbox {
		padding: 4.6vw 4.6vw 0;
	}

	#idea_list .idea_box .idea_box_inbox .text {
		font-size: 3.4vw;
		margin-bottom: 3vw;
	}
	#idea_list .idea_box .btnType a {
		min-width: 45vw;
	}
}

/* アイデア詳細画面 */

#idea_detail h3 {
	font-size: 20px; font-size: 2.0rem;
	color: #254b75;
	margin-bottom: 50px;
}
#idea_detail h3 strong {
	display: inline-block;
	width: 15em;
	padding: 5px 15px;
	font-size: 25px; font-size: 2.5rem;
	border: #999999 1px solid;
	margin-right: 10px;
	border-radius: 25px / 50% ;
}
#idea_detail h4 {
	font-size: 40px; font-size: 4.0rem;
	color: #254b75;
	font-weight: 900;
	margin-bottom: 30px;
}
#idea_detail .target_list {
	margin-bottom: 50px;
}
#idea_detail .text {
	color: #4d4d4d;
	margin-bottom: 30px;
	line-height: 1.7;
}
#idea_detail .fav {
	text-align: right;
	margin-top: 30px;
}
#idea_detail .fav p {
	display: inline-flex;
	align-items: center;
	padding: 5px 5px 5px 35px;
	font-size: 22px; font-size: 2.2rem;
	font-weight: 700;
	background: #ff5374 url("../images/common/bg_texture.png") repeat;
	color: #fff;
	border-radius: 25px / 50% ;
	position: relative;
}
#idea_detail .fav p strong {
	display: inline-block;
	padding: 0 25px;
	font-size: 30px; font-size: 3.0rem;
	font-weight: 400;
	background: #fff;
	color: #000;
	margin-left: 10px;
	border-radius: 20px / 50% ;
}
#idea_detail .fav p img {
	position: absolute;
	left: -25px;
	top: -15px;
}

@media screen and (max-width: 767px) {
	#idea_detail h3 {
		font-size: 3.6vw;
		margin-bottom: 4vw;
		text-align: right;
	}
	#idea_detail h3 strong {
		text-align: left;
		box-sizing: border-box;
		width: 100%;
		padding: 1vw 3vw;
		font-size: 4.6vw;
		margin-right: 0;
		border-radius: 4vw / 50% ;
	}
	#idea_detail h4 {
		font-size: 4.6vw;
		margin-bottom: 3vw;
	}
	#idea_detail .target_list {
		margin-bottom: 4vw;
	}
	#idea_detail .text {
		margin-bottom: 3vw;
	}
	#idea_detail .fav {
		margin-top: 3vw;
	}
	#idea_detail .fav p {
		padding: 1vw 1vw 1vw 6vw;
		font-size: 2.9vw;
		border-radius: 4vw / 50% ;
	}
	#idea_detail .fav p strong {
		padding: 0 2.5vw;
		font-size: 4.2vw;
		margin-left: 1vw;
		border-radius: 3vw / 50% ;
	}
	#idea_detail .fav p img {
		width: 9vw;
		left: -3vw;
		top: -2vw;
	}
}



/* ログイン確認 */

#login-user .note {
	font-size: 26px; font-size: 2.6rem;
	color: #4d4d4d;
	text-align: center;
	margin-bottom: 50px;
}
#login-user .btnType {
    margin: 0 auto 30px;
}
@media screen and (max-width: 767px) {
	#login-user .note {
		font-size: 3.6vw;
		margin-bottom: 6vw;
	}
	#login-user .btnType {
		margin: 0 auto 4vw;
	}

}

/* 投稿入力画面 */
#ideaform h3 {
	margin-bottom: 30px;
}
#ideaform .link {
	margin-top: 10px;
}
#ideaform .link a{
	display: inline-block;
	background: #666666 url("../images/common/bg_texture.png") repeat;
	text-decoration: none;
	color: #fff;
	font-size: 23px; font-size: 2.3rem;	
	line-height: 1;
	font-weight: 500;
	border-radius: 15px;
	position: relative;
	padding: 15px 20px;
	box-shadow: 0 5px 0 #333333;
}
#ideaform .guideTxt {
	margin: 10px 0;
}
#ideaform input.target {
	display: none;
}
#ideaform input.target + label {
	cursor: pointer;
	display: inline-block;
	width: 100%;
}
#ideaform input.target + label img {
    pointer-events: none;
}
#ideaform input.target + label .target_on {
	display: none;
}
#ideaform input.target:checked + label .target_on {
	display: inline;
}
#ideaform input.target:checked + label .target_off {
	display: none;
}
#ideaform .file_upload {
	margin-bottom: 60px;
}
#ideaform .file_upload label > input {
	display:none;
}
#ideaform .file_upload label {
	background: #cccccc url("../images/common/bg_texture.png") repeat;
	font-size: 23px; font-size: 2.3rem;
	line-height: 1;
	font-weight: 500;
	border-radius: 15px;
	position: relative;
	padding: 10px 60px 10px 20px;
	border: #666666 1px solid;
	cursor: pointer;
}
#ideaform .file_upload label::after {
	content: "▼";
	background: #999999 url("../images/common/bg_texture.png") repeat;
	font-size: 20px; font-size: 2.0rem;
	line-height: 1;
	border-radius: 10px;
	color: #fff;
	padding: 10px;
	cursor: pointer;
	position: absolute;
	top: 14%;
	right: 10px;
}


@media screen and (max-width: 767px) {
	#ideaform h3 {
		margin-bottom: 4vw;
	}
	#ideaform .link {
		margin-bottom: 1vw;
	}
	#ideaform .link a{
		font-size: 3.6vw;
		border-radius: 2vw;
		padding: 2.3vw 2.6vw;
		box-shadow: 0 0.6vw 0 #333333;
	}
	#ideaform .guideTxt {
		margin: 1vw 0;
		font-size: 2.8vw!important;
	}

	#ideaform .file_upload {
		margin-bottom: 8vw;
	}
	#ideaform .file_upload label {
		font-size: 3.6vw;
		border-radius: 2vw;
		padding: 1.3vw 7.6vw 1.3vw 2.6vw;
	}
	#ideaform .file_upload label::after {
		font-size: 2.6vw;
		border-radius: 1.6vw;
		padding: 1.5vw;
		top: 14%;
		right: 1vw;
	}

}

/* 投稿確認画面 */
#confirm h3 {
	margin-bottom: 30px;
}

#confirm .file_upload {
	margin-bottom: 60px;
}

@media screen and (max-width: 767px) {
	#confirm h3 {
		margin-bottom: 4vw;
	}
	#confirm .file_upload {
		margin-bottom: 8vw;
	}
}

/* 投稿完了画面 */

#compleate #form_compleate .text {
	margin-bottom: 30px;
	color: #4d4d4d;
}


@media screen and (max-width: 767px) {
	#compleate #form_compleate .text {
		margin-bottom: 6vw;
	}
}



/* アイデアトップ */

#idea_top h3 {
  font-size: 4.2rem;
  font-weight: 900;
  text-align: center;
  margin-bottom: 20px;
  line-height: 1.75em;
}
#idea_top #sengen {
  margin: 0px auto 80px;
}
#idea_top .photo {
  margin: 60px 0;
  text-align: center;
}
#idea_top .photo .img {
  margin: 20px 0;
}
#idea_top .btn_area {
  margin: 40px auto 60px;
	display: flex;
	justify-content: space-between;
	position: relative;
	flex-wrap: wrap;
}
#idea_top .btn_area {
  margin: 40px auto;
	display: flex;
	justify-content: space-between;
	position: relative;
	flex-wrap: wrap;
}
#idea_top .btn_area p.btnType {
	width: 47%;
	margin-top: 20px;
	margin-bottom: 20px;
	position: relative;
}
#idea_top .btn_area p.btnType a {
	width: 100%;
	min-width: inherit;
	padding: 10px;
}
#idea_top #seikatsu h4 {
	margin: 50px 0 30px;
	font-size: 2.8rem;
	font-weight: 700;
	padding: 0.25em 0.8em;
	color: #fff;
	border-radius: 0.25em;
}
#idea_top #seikatsu .summer h4 {
	background: #0075BA;
}
#idea_top #seikatsu .winter h4 {
	background: #66ACD6;
}
#idea_top #seikatsu .winter {
	margin-bottom: 60px;
}#idea_top #seikatsu .seikatsu_cat {
	margin: 30px 0 30px;
	line-height: 1.75;
}
#idea_top #seikatsu .seikatsu_cat h5 {
	font-weight: normal;
}
#idea_top #seikatsu .seikatsu_cat p {
	padding-left: 1em;
}

@media screen and (max-width: 767px) {
  #idea_top h3 {
      font-size: 4.8vw;
      margin-bottom: 2vw;
  }
#idea_top #sengen {
  margin: 0px auto 8vw;
}
#idea_top .photo {
  margin: 6vw 0;
}
#idea_top .photo .img {
  margin: 2vw 0;
}
#idea_top .btn_area {
  margin: 4vw auto 8vw;
    justify-content: center;
  }
  #idea_top .btn_area p.btnType {
    width: auto;
    min-width: 55vw;
    margin-top: 2vw;
    margin-bottom: 2vw;
  }
  #idea_top #seikatsu h4 {
	margin: 5vw 0 3vw;
	font-size: 3.7vw;
}
#idea_top #seikatsu .winter {
	margin-bottom: 5vw;
}
#idea_top #seikatsu .seikatsu_cat {
	margin: 3vw 0;
}

}


/* 生活の投稿 */

#seikatsuform .intro {
  line-height: 1.75em;
}

#seikatsuform .photo {
  font-size: 80%;
  margin: 60px auto;
}
#seikatsuform .photo .img {
  margin: 20px 0;
}
#seikatsuform .photo .img img {
  border: #ddd 1px solid;
}
@media screen and (max-width: 767px) {
  #seikatsuform .photo {
    margin: 6vw auto;
  }
  #seikatsuform .photo .img {
    margin: 2vw 0;
  }
}