@charset "UTF-8";

@font-face {
	font-family: "logotype";
	src: url("../fonts/ロゴたいぷゴシック.otf");
}

.site-wrap {
	font-size: 2rem;
	font-family: YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN",
		"ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;

	header.top {
		background-attachment: fixed;
		max-width: 100%;
		background-color: #fdfdf6;
		text-align: center;

		& img {
			max-width: 1200px;

			&.sp {
				display: none;
			}
		}
	}

	.main-wrap {
		max-width: 900px;
		margin: 0 auto;

		section {
			margin-top: 6em;

			header {
				text-align: center;

				h3 {
					font-family: "logotype";
					font-weight: 700;
					font-style: normal;
					font-size: 3.6rem;
					margin-top: 0.2em;
					color: #42210b;
				}
			}

			h4 {
				margin: 4em auto 2em auto;
				max-width: 700px;

				img {
					width: 100%;
				}
			}

			dl {
				margin-bottom: 4em;
				color: #42210b;

				dt {
					margin-bottom: 1em;
					font-weight: bold;
					font-size: 1.2em;
				}

				dd {
					margin-bottom: 2em;
				}
			}

			&.news > ol {
				margin: 2em 0;
				border: solid 4px #e51a1d;
				background-color: #fff;
				padding: 1em 2em;
				border-radius: 10px;

				li {
					padding: 1em;
					display: -webkit-box;
					display: -webkit-flex;
					display: -ms-flexbox;
					display: flex;
					-webkit-flex-wrap: wrap;
					-ms-flex-wrap: wrap;
					flex-wrap: wrap;
					border-bottom: solid 1px #000;
					line-height: 1.4;

					time {
						margin-right: 2em;
					}

					&:last-child {
						border-bottom: none;
					}

					p a {
						border-bottom: 1px solid #000;
						padding-bottom: 2px;

						&:hover {
							border-bottom: 1px solid #e53d3f;
						}
					}
				}
			}

			&.about .naiyou {
				background-color: rgba(255, 255, 255, 0.6);
				margin-top: 2em;
				border-radius: 10px;
				padding: 2em;

				ul li {
					display: -webkit-box;
					display: -webkit-flex;
					display: -ms-flexbox;
					display: flex;
					-webkit-box-pack: justify;
					-webkit-justify-content: space-between;
					-ms-flex-pack: justify;
					justify-content: space-between;
					-webkit-box-align: center;
					-webkit-align-items: center;
					-ms-flex-align: center;
					align-items: center;
					-webkit-flex-wrap: wrap;
					-ms-flex-wrap: wrap;
					flex-wrap: wrap;
					margin-bottom: 2em;

					img {
						max-width: 160px;
					}

					.fukidashi {
						position: relative;
						display: inline-block;
						max-width: 600px;
						background: #fde7d2;
						border-radius: 10px;

						p {
							padding: 1em;
							line-height: 1.6;
							-webkit-font-feature-settings: "palt";
							font-feature-settings: "palt";
							letter-spacing: 1px;

							span {
								&.boder {
									border-bottom: dotted 2px #eb8c07;
									font-size: 1.4em;
									font-family: "logotype";
								}

								&.color {
									font-size: 1.6em;
									color: #eb8c07;
									font-family: "logotype";
								}
							}
						}
					}

					&:nth-child(even) {
						-webkit-box-orient: horizontal;
						-webkit-box-direction: reverse;
						-webkit-flex-direction: row-reverse;
						-ms-flex-direction: row-reverse;
						flex-direction: row-reverse;

						.fukidashi {
							background-color: #ffe8df;
						}
					}

					&:last-child {
						margin-bottom: 0;

						.fukidashi {
							background-color: #fdefbc;
						}
					}
				}
			}

			&#twitter .twitter_warp {
				background-color: rgba(255, 255, 255, 0.6);
				border-radius: 10px;
				padding: 2em;

				.twitter_cap {
					max-width: 600px;
					margin: 3em auto;
					display: -webkit-box;
					display: -webkit-flex;
					display: -ms-flexbox;
					display: flex;
					-webkit-box-orient: horizontal;
					-webkit-box-direction: reverse;
					-webkit-flex-direction: row-reverse;
					-ms-flex-direction: row-reverse;
					flex-direction: row-reverse;
					-webkit-justify-content: space-around;
					-ms-flex-pack: distribute;
					justify-content: space-around;
					-webkit-box-align: center;
					-webkit-align-items: center;
					-ms-flex-align: center;
					align-items: center;
					-webkit-flex-wrap: wrap;
					-ms-flex-wrap: wrap;
					flex-wrap: wrap;

					img {
						max-width: 100px;
					}

					.fukidashi {
						position: relative;
						display: inline-block;
						max-width: 450px;
						background: #fde7d2;
						border-radius: 10px;

						p {
							padding: 1em;
							line-height: 1.6;
							-webkit-font-feature-settings: "palt";
							font-feature-settings: "palt";
							letter-spacing: 1px;

							span {
								&.boder {
									border-bottom: dotted 2px #eb8c07;
									font-size: 1.4em;
									font-family: "logotype";
								}

								&.color {
									font-size: 1.6em;
									color: #eb8c07;
									font-family: "logotype";
								}
							}
						}
					}
				}

				.ctf-tweets .ctf-item {
					background-color: #fff;
					border-radius: 10px;
					border-top: none;
					border-bottom: none;
					padding: 1em;
					margin-bottom: 2em;

					.ctf-author-box-link {
						border-radius: 50px;

						.ctf-author-avatar img {
							border-radius: 50%;
						}
					}
				}
			}

			&.youkou .naiyou {
				margin-top: 2em;
				background-color: #fff;
				border-radius: 10px;
				padding: 2em;
				border: solid 4px #eb8c07;

				dl {
					line-height: 1.4;
					-webkit-font-feature-settings: "palt";
					font-feature-settings: "palt";

					dt {
						color: #eb8c07;
						margin-bottom: 0.8em;
						font-weight: bold;

						&::before {
							content: "●";
						}
					}

					dd {
						margin-bottom: 2em;
						padding-bottom: 0.8em;
						border-bottom: solid 1px #eb8c07;
						word-break: break-all;

						ul {
							margin-bottom: 0.8em;

							li {
								list-style: disc;
								margin-left: 1em;
							}
						}

						&:last-child {
							border-bottom: none;
							margin-bottom: 0;
						}
					}
				}
			}
		}

		p.oubo {
			margin: 5em auto;

			a {
				color: #fff;
				display: block;
				text-align: center;
				transition: 0.5s all ease-out;
				width: 300px;
				background-color: #eb8c07;
				padding: 1em;
				border-radius: 16px;
				border: double 4px #fff;
				margin: 0 auto;

				&:hover {
					background-color: #fff;
					border: double 4px #eb8c07;
				}
			}

			&:hover a {
				color: #eb8c07;
			}
		}

		.azishirabe {
			margin: 0 auto;
			margin-top: 4em;
			padding-bottom: 4em;
			-webkit-transition: 0.5s all ease-out;
			transition: 0.5s all ease-out;

			&:hover {
				opacity: 0.8;
			}
		}
	}
}

@media (max-width: 730px) {
	.site-wrap {
		font-size: 1.8rem;
	}
}

@media (max-width: 730px) {
	.site-wrap header.top img {
		&.pc {
			display: none;
		}

		&.sp {
			display: block;
			width: 100%;
		}
	}
}

@media (max-width: 770px) {
	.site-wrap .main-wrap {
		padding: 0 1em;
	}
}

@media (max-width: 730px) {
	.site-wrap .main-wrap section > header h3 {
		font-size: 2.8rem;
	}
}

@media (max-width: 730px) {
	.site-wrap .main-wrap section.news {
		padding-top: 4em;
	}
}

@media (max-width: 730px) {
	.site-wrap .main-wrap section.news > ol {
		padding: 0 1em;
	}
}

@media (max-width: 730px) {
	.site-wrap .main-wrap section.about .naiyou {
		padding: 1em;
	}
}

@media (max-width: 770px) {
	.site-wrap .main-wrap section.about .naiyou ul li {
		-webkit-box-pack: center;
		-webkit-justify-content: center;
		-ms-flex-pack: center;
		justify-content: center;
	}
}

@media (max-width: 770px) {
	.site-wrap .main-wrap section.about .naiyou ul li .fukidashi {
		margin-top: 2em;
	}
}

@media (min-width: 730px) {
	.site-wrap .main-wrap section.about .naiyou ul li .fukidashi::before {
		content: "";
		position: absolute;
		top: 50%;
		left: -30px;
		margin-top: -15px;
		border: 15px solid transparent;
		border-right: 15px solid #fde7d2;
	}
}

@media (max-width: 770px) {
	.site-wrap .main-wrap section.about .naiyou ul li .fukidashi::before {
		content: "";
		position: absolute;
		top: -14px;
		left: 50%;
		margin-left: -15px;
		border: 15px solid transparent;
		border-bottom: 15px solid #fde7d2;
	}
}

@media (max-width: 730px) {
	.site-wrap .main-wrap section.about .naiyou ul li .fukidashi::before {
		top: -30px;
	}
}

@media (min-width: 730px) {
	.site-wrap .main-wrap section.about .naiyou ul li .fukidashi p span {
		display: inline-block;
	}
}

@media (max-width: 730px) {
	.site-wrap .main-wrap section.about .naiyou ul li .fukidashi p span.block {
		display: block;
	}
}

@media (min-width: 730px) {
	.site-wrap
		.main-wrap
		section.about
		.naiyou
		ul
		li:nth-child(even)
		.fukidashi::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 100%;
		margin-top: -15px;
		border: 15px solid transparent;
		border-left: 15px solid #ffe8df;
	}
}

@media (max-width: 770px) {
	.site-wrap
		.main-wrap
		section.about
		.naiyou
		ul
		li:nth-child(even)
		.fukidashi::before {
		content: "";
		position: absolute;
		top: -14px;
		left: 50%;
		margin-left: -15px;
		border: 15px solid transparent;
		border-bottom: 15px solid #ffe8df;
	}
}

@media (max-width: 730px) {
	.site-wrap
		.main-wrap
		section.about
		.naiyou
		ul
		li:nth-child(even)
		.fukidashi::before {
		top: -30px;
	}
}

@media (min-width: 730px) {
	.site-wrap
		.main-wrap
		section.about
		.naiyou
		ul
		li:last-child
		.fukidashi::before {
		border-left: 15px solid #fdefbc;
	}
}

@media (max-width: 770px) {
	.site-wrap
		.main-wrap
		section.about
		.naiyou
		ul
		li:last-child
		.fukidashi::before {
		content: "";
		position: absolute;
		top: -14px;
		left: 50%;
		margin-left: -15px;
		border: 15px solid transparent;
		border-bottom: 15px solid #fdefbc;
	}
}

@media (max-width: 730px) {
	.site-wrap
		.main-wrap
		section.about
		.naiyou
		ul
		li:last-child
		.fukidashi::before {
		top: -30px;
	}
}

@media (max-width: 770px) {
	.site-wrap .main-wrap section#twitter .twitter_warp .twitter_cap {
		-webkit-box-pack: center;
		-webkit-justify-content: center;
		-ms-flex-pack: center;
		justify-content: center;
	}
}

@media (max-width: 770px) {
	.site-wrap .main-wrap section#twitter .twitter_warp .twitter_cap .fukidashi {
		margin-top: 2em;
	}
}

@media (min-width: 730px) {
	.site-wrap
		.main-wrap
		section#twitter
		.twitter_warp
		.twitter_cap
		.fukidashi::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 100%;
		margin-top: -15px;
		border: 15px solid transparent;
		border-left: 15px solid #fde7d2;
	}
}

@media (max-width: 770px) {
	.site-wrap
		.main-wrap
		section#twitter
		.twitter_warp
		.twitter_cap
		.fukidashi::before {
		content: "";
		position: absolute;
		top: -14px;
		left: 50%;
		margin-left: -15px;
		border: 15px solid transparent;
		border-bottom: 15px solid #fde7d2;
	}
}

@media (max-width: 730px) {
	.site-wrap
		.main-wrap
		section#twitter
		.twitter_warp
		.twitter_cap
		.fukidashi::before {
		top: -30px;
	}
}

@media (min-width: 730px) {
	.site-wrap
		.main-wrap
		section#twitter
		.twitter_warp
		.twitter_cap
		.fukidashi
		p
		span {
		display: inline-block;
	}
}

@media (max-width: 730px) {
	.site-wrap
		.main-wrap
		section#twitter
		.twitter_warp
		.twitter_cap
		.fukidashi
		p
		span.block {
		display: block;
	}
}

@media (max-width: 730px) {
	.site-wrap .main-wrap section.youkou .naiyou {
		padding: 1em;
	}
}

@media (min-width: 730px) {
	.site-wrap .main-wrap .azishirabe {
		max-width: 700px;
	}
}

@media (max-width: 730px) {
	.site-wrap .main-wrap .azishirabe {
		max-width: 320px;
	}
}

@media (min-width: 730px) {
	.site-wrap .main-wrap .azishirabe img {
		max-width: 700px;
	}
}

@media (max-width: 730px) {
	.site-wrap .main-wrap .azishirabe img {
		max-width: 320px;
	}
}

/*# sourceMappingURL=okosen_half-birthday.css.map */
