﻿@charset "utf-8";

/*----------------------------------------------------
	拡張CSS
----------------------------------------------------*/

/*20160621 add for fifty_project*/
/*common*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	list-style:none;
 	font-size: 14px;
  	line-height: 26px;
}

.fifty_project{
	color:#333;
	font-family: Helvetica, Arial, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'モリサワ 新ゴ R', 'Droid Sans', メイリオ, 'sans-serif';
	line-height:25px;
	word-wrap: break-word;
	letter-spacing:1px;
	/*width:625px;*/
}

/*head*/
.fifty_project .head{
	display:table;
}

.fifty_project .head h2{
	background-image:url(http://www.futoko.org/wordpress/wp-content/uploads/2016/06/fifty_project_logo.png) !important;
	background-repeat:no-repeat;
	background-position:center center;
	width:191px;
	height:250px;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	display:table-cell;
  	padding: 0 !important;
  	font-size: inherit !important;
}

.fifty_project .head dl{
	display:table-cell;
	height: 250px;
  	vertical-align: middle;
  	/*width: 401px;*/
  	text-align: center;
}

.fifty_project .head dt{
	color:#f57ea5;
	font-size:18px;
	padding-bottom:20px;
}

.fifty_project .head dd{
	font-size:14px;
}

/*support*/
.fifty_project .support{
	background:#f8f8f8;
	padding:30px 20px;
	position:relative;
}

.fifty_project .support:before{
	content:"";
	display:block;
	width:625px;
	height:11px;
    background: repeating-linear-gradient( -45deg, #fb9aba, #fb9aba 3px, #fff 3px, #fff 6px );
	position:absolute;
	top:0;
	left:0;
}

.fifty_project .support h3{
  	background-image:url(http://www.futoko.org/wordpress/wp-content/uploads/2016/06/support_h3.png);
	background-repeat:no-repeat;
	background-position:center center;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	margin-bottom:20px;
	border-bottom: none !important;
 	margin-top: 0 !important;
}

.fifty_project .support p{
	color:#f57ea5;
	font-size:14px;
	text-align:center;
}

.fifty_project .support h4{
	border-top:1px solid #f57ea5;
	font-size:16px;
	font-weight:bold;
	padding:20px 0;
	text-align:center;
	margin-top:20px !important;
  	border-left: none !important;
}

/*support_credit*/
.fifty_project .support ul{
	overflow: hidden;
}

.fifty_project .support ul li{
	background:#fffeef;
	border:1px solid #f57ea5;
  	width: 274px;
 	padding: 3px;
   	float: left;
  	margin-right: 21px;
	margin-bottom: 21px;
	box-shadow:0px 3px 0px 0px #fea8c5;
	-moz-box-shadow:0px 3px 0px 0px #fea8c5;
	-webkit-box-shadow:0px 3px 0px 0px #fea8c5;
	-webkit-transition: all 0.3s ease 0s;
 	transition: all 0.3s ease 0s;
}

.fifty_project .support ul li:hover{
	background:#fff4f8;
}

.fifty_project .support ul li a,.fifty_project .support div p{
	display:block;
	color:#f57ea5;
	text-decoration:none;
	border:1px solid #f57ea5;
	text-align:center;
	font-size:17px;
	padding:32px 0 26px;
 	letter-spacing: 0px;
}

.fifty_project .support ul li a strong{
	font-size:32px;
	font-weight:bold;
	letter-spacing: 4px;
}

.fifty_project .support ul li a span{
	border-bottom:1px solid;
}


.fifty_project .support ul li:nth-of-type(2n) {
  	margin-right: 0px;
}

/*support_Postal transfer*/
.fifty_project .support div{
	background:#fffeef;
	border:1px solid #f57ea5;
  	padding: 3px;
	box-shadow:0px 3px 0px 0px #fea8c5;
	-moz-box-shadow:0px 3px 0px 0px #fea8c5;
	-webkit-box-shadow:0px 3px 0px 0px #fea8c5;
}

.fifty_project .support div p{
	font-size:15px;
	font-weight:bold;
	line-height: 30px;
  	letter-spacing: 1px !important;
	padding:19px;
}

/*outline*/
.outline{}

.outline h4{
	position:relative;
	color:#f57ea5;
	line-height:30px;
	padding-left:22px !important;
	font-size:16px !important;
	font-weight:bold;
	margin-top:30px !important;
 	border-left: none !important;
	margin-bottom: 10px;
	}

.outline h4:before{
	content:"";
	display:block;
	width:8px;
	height:30px;
  	background: repeating-linear-gradient( -45deg, #fb9aba, #fb9aba 3px, #fff 3px, #fff 6px );
	position:absolute;
	top:0;
	left:0;
}

.outline p{
	font-size:14px;
	line-height:26px;
	}
	
.outline div{
	background:#f088aa;
	border-radius:4px;
	font-size:16px;
	line-height:50px;
	padding:5px;
	text-align:center;
	margin:38px 0;
	box-shadow:0px 6px 0px 0px #9f3d5d;
	-moz-box-shadow:0px 6px 0px 0px #9f3d5d;
	-webkit-box-shadow:0px 6px 0px 0px #9f3d5d;
	-webkit-transition: all 0.3s ease 0s;
   	transition: all 0.3s ease 0s;
	}
	
.outline div:hover{
	opacity:0.8;
	}
	
.outline div a{
	color:#fff;
	text-decoration:none;
	border:1px solid #fff;
	display:block;
	height:40px;
	line-height:42px;
	}

/*----------------------------------------------------
	for sp
----------------------------------------------------*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:13px;
	vertical-align:baseline;
	background:transparent;
	list-style:none;
}

.article-body{
	padding-top:15px;
}

.article-body p img{
	/*width: auto !important;*/
	height: auto;
	margin-bottom:15px;
}

/*----------------------------------------------------
　コメント欄です。メモ用にコピーして使ってください。
----------------------------------------------------*/