@charset "utf-8";

h1 > small {
	margin-left: 1em;
}

p {
	line-height: 1.8;
}

/*==================================
 ナビゲーション
==================================*/
.navbar {
	border: none;
}

.navbar-default {
	background-color: #fff;
}

.navbar-nav {
	width: 100%;
	text-align: center;
}

.navbar-nav li {
	float: none;
	display: inline-block;
}

body {
	position: relative;
	padding-top: 50px;
	background-color: #E9FAFF;
	font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}

/*==================================
 タイトル
 ==================================*/
.lp-title {
	margin-top: 0;
}

.lead {
	color: #0071BC;
	font-size: 20px;
	font-weight: bold;
	margin-top: 20px;
	margin-bottom: 20px;
}

.section-lp-title {
	position: relative;
}

.section-lp-title:after {
	content: '';
	position: absolute;
	bottom: -350px;
	left: 0;
	width: 100%;
	height: 300px;
	margin: 0 -10%;
	background-image: url(../images/background.png);
	transform-origin: left center;
	transform: rotate(6deg);
	z-index: -2;
}

/*==================================
 ポイント
 ==================================*/
.point-title,
.point-title small {
	color: #fff;
}

.point-title {
	margin: 1em 0;
}

.point-title2 {
	color: #0071BC;
	border-bottom: 1px solid #0071BC;
	display: inline-block;
	font-weight: bold;
}

.point-img {
	max-width: 250px;
	width: 100%;
	margin: 0 auto;
}

.section-point {
	position: relative;
	overflow: hidden;
}

.section-point:before {
	content: '';
	position: absolute;
	top: 50px;
	left: 0;
	width: 120%;
	height: 650px;
	margin: 0 -10%;
	background-color: #00A6DD;
	transform-origin: right center;
	transform: rotate(-6deg);
	z-index: -1;
}

.section-point:after {
	content: '';
	position: absolute;
	bottom: -50px;
	left: 0;
	width: 120%;
	height: 330px;
	margin: 0 -10%;
	background-color: #E9FAFF;
	transform-origin: right center;
	transform: rotate(0deg);
	z-index: -1;
}

/*==================================
 セット内容
 ==================================*/
.content-title {
	color: #003591;
	margin: 3em 0 1em;
}

.content-title small {
	color: #00A6DD;
}

.image,
.image2,
.image3,
.image4,
.image5,
.price {
	width: 100%;
	margin: 0 auto;
}

.image2 {
	max-width: 444px;
}

.image3 {
	max-width: 493px;
}

.image4 {
	max-width: 317px;
}

.image5 {
	max-width: 470px;
}

.price {
	max-width: 510px;
}

@media (min-width: 1200px) {
	.image4 {
		margin-top: 50px;
	}
}

.content {
	max-width: 368px;
	margin: 0 auto;
}

.section-content1 {
	padding-top: 50px;
	position: relative;
	overflow: hidden;
}

.section-content1:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 120%;
	height: 100%;
	margin: 0 -10%;
	background-image: url(../images/background_building.jpg);
	background-size: cover;
	background-position: 50% 30%;
	transform-origin: left center;
	transform: rotate(4deg);
	z-index: -1;
}

.section-content1:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 120%;
	height: 400px;
	margin: 0 -10%;
	background-image: url(../images/background.png);
	transform-origin: right center;
	transform: rotate(-4deg);
	z-index: -1;
}

.section-content2 {
	padding-top: 30px;
	position: relative;
	overflow: hidden;
}

.section-content2:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 120%;
	height: 200px;
	margin: 0 -10%;
	background-color: #E9FAFF;
	transform-origin: left center;
	transform: rotate(4deg);
	z-index: -1;
}

.section-content2:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 120%;
	height: 450px;
	margin: 0 -10%;
	background-image: url(../images/background.png);
	transform-origin: left center;
	transform: rotate(4deg);
	z-index: -1;
}

/*==================================
 値段
 ==================================*/
.section-price {
	padding: 60px 0 20px;
	background-color: #AEDDFF;
	overflow: hidden;
}

.price-back {
	position: relative;
}

.price-z {
	position: relative;
	z-index: 3;
}

.price-back:before {
	content: '';
	display: block;
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	width: 140%;
	height: 160%;
	background: #fff;
	margin-left: -20%;
	margin-top: -10%;
	border-radius: 50%;
	-webkit-filter: blur(4px);
	filter: blur(4px);
}

/*==================================
 実績
 ==================================*/
.section-work {
	padding: 30px 0;
	position: relative;
}

.section-work:before {
	position: absolute;
	top: 0;
	left: 0;
	content: '';
	width: 100%;
	transform: scale(-1, 1);
	height: 100%;
	background-image: url(../images/background_building.jpg);
	background-size: cover;
	background-position: 50%;
}

.work-title {
	color: #003591;
	margin-bottom: 1em;
}

.work-title small {
	color: #00A6DD;
}

/*==================================
 お問い合わせ
 ==================================*/
.section-contact {
	background-image: url(../images/background.png);
	position: relative;
	padding-top: 30px;
}

.section-contact:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 300px;
	background-color: #E9FAFF;
	z-index: 2;
}

.contact-title,
.contact-title small {
	color: #fff;
}

.contact-lead {
	color: #fff;
	margin-bottom: 3em;
}

.contact-form {
	background: #fff;
	padding: 30px;
	box-shadow: 0 5px 10px rgba(0, 53, 145, 0.3);
	position: relative;
	z-index: 3;
	margin-bottom: 30px;
}

@media (min-width: 970px) {
	.contact-form {
		padding: 30px 60px;
	}
}

.contact-information {
	height: 200px;
	overflow: auto;
	padding: 20px;
	border: 1px solid #C7C7C7;
}

.form-horizontal .contact-checkbox {
	background-color: #EDEDED;
	padding: 20px;
}

.btn-submit {
	background-color: #003591;
	border-radius: 0;
}

.required-label:after {
	content: '*';
	color: #FF3644;
	margin-left: 0.2em;
}

.error {
	color: #FF3644;
}

/*==================================
 フッター
 ==================================*/
footer {
	padding-bottom: 30px;
}
