@charset "UTF-8";

/*
動的に画像そ表示する為、html側に移行
#Docs {
	background: #fff url(../images/bg_wall.png) 50% 50% no-repeat fixed;
	background-size: cover;
	min-height: 100%;
}
*/
#DocsHeader {
	background: #fff;
	height: 30px;
	position: fixed;
	z-index: 5;
	width: 100%;
}
	#DocsHeader > .hn {
		bottom: 0;
		height: 18px;
		left: 0;
		margin: auto;
		position: absolute;
		right: 0;
		top: 0;
		width: 133px;
	}

	#DocsHeader > .hn2 {
		bottom: 0;
		height: 25px;
		light: 0;
		margin: auto;
		position: absolute;
		right: -15px;
		top: 0;
		width: 50px;
	}

#DocsBody {}
	#DocsBody > main {}

#DocsFooter {
	background: #fff;
	bottom: 0;
	height: 30px;
	position: fixed;
	width: 100%;
	z-index: 5;
}
	#DocsFooter > .copyright {
		bottom: 0;
		height: 6px;
		left: 0;
		margin: auto;
		position: absolute;
		right: 0;
		top: 0;
		width: 145px;
	}

/**
 * Teaser
 **/


#OpeningWrapper {
	background: rgba(255,255,255,0.7);
	height: 100%;
	left: 0;
	overflow: auto;
	padding: 30px 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 3;
}
#Opening {
	display: none;
	bottom: 0;
	height: 412px;
	left: 0;
	margin: auto;
	width: 281px;
	position: absolute;
	right: 0;
	top: 0;
}
	#Opening > header {
		margin: 0 0 25px 0;
		text-align: center;
	}
	#Opening > .body {
		background: url(../images/bg_opening_frame.png) 50% 0 no-repeat scroll;
		background-size: 100% auto;
		min-height: 156px;
		padding: 72px 0 0 0;
	}
		#Opening > .body > .sign {}
			#Opening > .body > .sign > span {
				display: block;
				font-size: 19px;
				text-align: center;
			}
			#Opening > .body > .sign > .couple {
				color: #EF6B80;
				margin: 0 0 20px 0;
			}
			#Opening > .body > .sign > .wedding {
				color: #653300;
				margin: 0 0 58px 0;
			}
			
		#Opening > .body > .message {
			text-align: center;
			font-size: 30px;
			color: #a1780c;
			font-family: 'Great Vibes' !important;
		}
		#Opening > .body > .count {
			text-align: center;
		}
			#Opening > .body > .count > .ready {
				margin: 0 0 10px 0;
			}
			#Opening > .body > .count > .timer {
				color: #653300;
				font-size: 30px;
			}

				.yycountdown-box {}
					.yycountdown-box > span {
						display: inline-block;
						vertical-align: top;
					}
					.yyc-day-text {
						background: url(../images/bg_separator.png) 50% 50% no-repeat scroll;
						background-size: 1px auto;
						height: 37px;
						overflow: hidden;
						padding: 0 10px;
						text-indent: -9999px;
						width: 1px;
					}
					.yyc-hou-text,
					.yyc-min-text {
						padding: 0 10px;
					}
					.yyc-day,
					.yyc-hou,
					.yyc-min,
					.yyc-sec  {
						background: url(../images/txt_count_day.png) 50% 100% no-repeat scroll;
						background-size: 22px auto;
						padding: 0 0 18px 0;
					}
					.yyc-hou {
						background: url(../images/txt_count_hours.png) 50% 100% no-repeat scroll;
						background-size: 26px auto;
					}
					.yyc-min {
						background: url(../images/txt_count_minutes.png) 50% 100% no-repeat scroll;
						background-size: 36px auto;
					}
					.yyc-sec  {
						background: url(../images/txt_count_seconds.png) 50% 100% no-repeat scroll;
						background-size: 36px auto;
					}

/**
 * Wall Content
 **/

#Wall {
	background: #FFFFF8;
	display: none;
	padding: 30px 0 85px 0;
}
#Wall:after {
	clear: both;
	content: '';
	display: block;
	height: 0;
	line-height: 0;
}
	#Wall > footer {
		background: #f06b81;
		bottom: 0;
		left: 0;
		position: fixed;
		width: 100%;
		z-index: 2;
	}
		#Wall > footer .glipper {
			background: url(../images/btn_glipper.png) 0 0 no-repeat scroll;
			background-size: 73px 34px;
			cursor: pointer;
			height: 34px;
			left: 50%;
			margin: 0 0 0 -36px;
			position: absolute;
			text-indent: -9999px;
			top: -34px;
			width: 73px;
		}
		#Wall > footer .glipper.open {
			background: url(../images/btn_glipper_on.png) 0 0 no-repeat scroll;
			background-size: 73px 34px;
		}

#Wall > footer .inputNameGroup {
	display: none;
}
#Wall > footer .imageUploadForm {
	display: inline;
}

#Wall > footer .inputName,
#Wall > footer .inputMessage {
	display: table;
	width: 100%;
}
#Wall > footer .inputName,
#Wall > footer .selectSns {
	border-bottom: solid 1px #d1596d;
}

#Wall > footer .selectSns {
	padding: 10px 0;
	text-align: center;
}
#Wall > footer .selectSns p {
	margin-bottom: 10px;
	font-size: 12px;
	color: #fff;
}
#Wall > footer .selectSns ul {
	display: table;
	margin: 0 auto;
}
#Wall > footer .selectSns li {
	display: table-cell;
	padding: 0 5px;
}
#Wall > footer .selectSns input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	margin: 0;
	padding: 0;
	border: none;
	background: #ccc;
	width: 135px;
	height: 40px;
}
#Wall > footer .selectSns input[type="checkbox"].facebook {
	background: #ccc url(../images/btn_fb.png) no-repeat;
	background-size: 135px 40px;
}
#Wall > footer .selectSns input[type="checkbox"].twitter {
	background: #ccc url(../images/btn_tw.png) no-repeat;
	background-size: 135px 40px;
}
#Wall > footer .selectSns input[type="checkbox"]:checked.facebook {
	background: #395799 url(../images/btn_fb_on.png) no-repeat;
	background-size: 135px 40px;
}
#Wall > footer .selectSns input[type="checkbox"]:checked.twitter {
	background: #26a4e0 url(../images/btn_tw_on.png) no-repeat;
	background-size: 135px 40px;
}

#Wall > footer .selectFile,
#Wall > footer .inputText,
#Wall > footer .formSubmit {
	display: table-cell;
	vertical-align: middle;
}
#Wall > footer .selectFile {
	float: left;
	padding: 10px 6px 10px 6px;
	width: 40px;
}
#Wall > footer .inputText {
	padding: 10px 10px 10px 0;
}
#Wall > footer .inputText input,
#Wall > footer .inputText textarea {
	box-shadow: none;
	border-radius: 0;
	box-sizing: border-box;
	padding: 8px;
	border: solid 1px #e5e1d1;
	background: #faf7f0;
	color: #999;
	font-size: 16px;
	width: 100%;
}
#Wall > footer .inputText input::-webkit-input-placeholder {
	color: #ccc;
}
#Wall > footer .inputText input:-ms-input-placeholder {
	color: #ccc;
}
#Wall > footer .inputText input::-moz-placeholder {
	color: #ccc;
}
#Wall > footer .inputText textarea::-webkit-input-placeholder {
	color: #ccc;
}
#Wall > footer .inputText textarea:-ms-input-placeholder {
	color: #ccc;
}
#Wall > footer .inputText textarea::-moz-placeholder {
	color: #ccc;
}

#Wall > footer .formSubmit {
	text-align: right;
	padding: 15px 10px 15px 0;
	width: 45px;
}

#Wall > footer .inputFile {
	position: absolute;
	left: -9999px;
	top: -9999px;
}
#Wall > footer .inputFileLoading {
	display: none;
	width: 35px;
	height: 35px;
	text-align: center;
}
#Wall > footer .inputFileLoading i {
	font-size: 32px;
	line-height: 40px;
	height: 40px;
	color: #fff;
}
#Wall > footer .error {
	display: none;
	margin-bottom: 5px;
	padding-left: 12px;
	background: url(../images/ico_error.png) no-repeat left center;
	background-size: 8px 7px;
	color: #fff;
}

#Wall > footer .postingMessage {
	display: none;
	padding: 20px 0;
	text-align: center;
}
#Wall > footer .postingMessage .amine {
	margin-bottom: 20px;
}
#Wall > footer .postingMessage .message {
	font-size: 16px;
	color: #fff;
}


#WallMain {}
	#WallMain > .hn {
		display: none;
	}
	#WallMain > .body {
		background: #FFEDED;
		position: relative;
		overflow: hidden;
		width: 100%;
		z-index: 2;
	}

		#WallMain > .body .list {}
			#WallMain > .body .list > li {
				display: none;
			}
				#WallMain > .body .list > li > .image {
					text-align: center;
				}
					#WallMain > .body .list > li > .image > img {
						height: auto;
						width: 100%;
					}
					#WallMain > .body .list > li > .image > figcaption {
						color: #EF6B80;
						display: inline-block;
						font-size: 14px;
						height: 1em;
						overflow: hidden;
						margin: 10px 15px;
					}

		#WallMain > .body .bx-prev {
			background: url(../images/btn_slide_prev.png) 0 0 no-repeat scroll;
			background-size: 25px auto;
			height: 47px;
			left: 10px;
			margin: -26px 0 0 0;
			top: 50%;
			width: 25px;
		}
		#WallMain > .body .bx-next {
			background: url(../images/btn_slide_next.png) 0 0 no-repeat scroll;
			background-size: 25px auto;
			height: 47px;
			margin: -26px 0 0 0;
			right: 10px;
			top: 50%;
			width: 25px;
		}

#WallPosts {}
	#WallPosts > header {
		background: #EF6B80;
		height: 50px;
		position: relative;
	}
		#WallPosts > header > .hn {
			left: 10px;
			margin: -8px 0 0 0;
			position: absolute;
			top: 50%;
		}
		#WallPosts > header > .sendMessage {
			margin: -17px 0 0 0;
			position: absolute;
			right: 10px;
			top: 50%;
		}
			#WallPosts > header > .sendMessage > button {
				background: transparent;
				border: none;
				cursor: pointer;
				display: inline;
				margin: 0;
				padding: 0;
			}
	#WallPosts > .body {
		margin: 0 auto;
	}

.WallPost {
	background: #fff;
	box-shadow: 0 0 5px 0 rgba(0,0,0,0.3);
	float: left;
	margin: 5px 0 0 0;
	width: 152px;
}

	.WallPost > .Image {}
		.WallPost > .Image > a > img {
			margin: 1px;
			width: 150px;
		}
		.WallPost > .Image > figcaption {
			color: #996500;
			font-size: 12px;
			line-height: 1.5;
			padding: 7px;
			word-wrap: break-word;
		}
		.WallPost > .detail {
			background: url(../images/bg_post_detail.png) 0 0 repeat-x scroll;
			background-size:;
			padding: 7px;
			*zoom: 1;
		}
		.WallPost > .detail:after {
			clear: both;
			content: '';
			display: block;
			height: 0;
			line-height: 0;
		}
			.WallPost > .detail > .image {
				display: table-cell;
				height: 32px;
				margin: 0 15px 0 0;
				overflow: hidden;
				width: 32px;
			}
				.WallPost > .detail > .image > a > img {
					width: 32px;
				}
			.WallPost > .detail > dd {
				display: table-cell;
				padding: 0 0 0 5px;
				vertical-align: middle;
			}
			.WallPost > .detail > dd > span {
				display: block;
				width: 98px;
			}
				.WallPost > .detail > dd > .name {
					color: #653300;
					font-size: 11px;
					line-height: 1.4;
					word-wrap: break-word;
				}
				.WallPost > .detail > dd > .date {
					background: url(../images/ico_clock.png) 0 0 no-repeat scroll;
					background-size: 10px auto;
					color: #CB9965;
					font-size: 8px;
					line-height: 1.4;
					margin: 3px 0 0 0;
					padding: 0 0 0 12px;
				}
				.ie8 .WallPost > .detail > dd > .date {
					line-height: 1.6;
					padding: 0 0 0 14px;
				}
				
				
.WallPost-challenge,
.WallPost-heart {
	background: #ffebea;
}
.WallPost-challenge > .detail,
.WallPost-heart > .detail {
	background: url(../images/bg_post_detail_c.png) 0 0 repeat-x scroll;
}
.WallPost-challenge > .Image > figcaption,
.WallPost-heart > .Image > figcaption {
	color: #f06b81;
}
.WallPost-challenge > .Image ,
.WallPost-heart > .Image {
	position: relative;
}
.WallPost-challenge > .Image .happy,
.WallPost-heart > .Image .happy {
	position: absolute;
	left: 0;
	right: 0;
	top: 38px;
	text-align: center;
	font-family: 'Playfair Display' !important;
	color: #f06b81;
	line-height: 1.0;
}
.WallPost-challenge > .Image .happyCount {
	display: block;
	font-size: 60px;
}
.WallPost-challenge > .Image .happyText {
	display: block;
	margin-top: 3px;
	font-size: 28px;
}

.WallPost-heart > .Image .happy {
	top: 0;
}
.WallPost-heart > .Image .happyCount {
	font-size: 45px;
}
.WallPost-heart > .Image .happyText {
	font-size: 20px;
}
.WallPost-heart > .Image .happyAfter {
	position: absolute;
	left: 0;
	right: 0;
	top: 50px;
	padding: 0 6px;
	font-size: 14px;
	color: #f06b81;
	line-height: 1.3 !important;
}

.WallPost-challenge > .detail,
.WallPost-heart > .detail {
	padding-top: 10px;
	text-align: center;
}
.WallPost-challenge > .detail > .image,
.WallPost-heart > .detail > .image {
	display: block;
	margin: 0;
	width: auto;
	height: auto;
}
.WallPost-challenge > .detail > dd,
.WallPost-heart > .detail > dd {
	display: block;
	margin-top: 3px;
	padding: 0;
}
.WallPost-challenge > .detail > dd > span,
.WallPost-heart > .detail > dd > span {
	display: inline;
	width: auto;
}