@charset "utf-8";

main{
	background:#fff;
	min-height:100vh;
}
#sec01 h2,#sec02 h2{
	font-size:30px;
	line-height:1.4;
	font-weight:500;
}
#sec01 h2 span,#sec02 h2 span,#form h2 span{
	font-weight:600;
	font-size:150%;
	color:#fb505d;
	padding-left:0.05em;
}
.outline{
	margin-top:3em;
	padding:30px;
	background:#f8f8f7;
}
.outline .txt{
	width:50%;
	padding-right:40px;
	line-height:2;
}
.outline .pic{
	width:50%;
}
.outline .pic img{
	display:block;
	width:100%;
}
#sec02,#sec03,#form{
	padding-top:0;
	text-align:center;
}
#sec02 h2,#form h2{
	display:inline-block;
	position:relative;
	padding:0 2em;
	font-weight:500;
}
#sec02 h2:before,#form h2:before{
	content:"";
	display:block;
	width:1px;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	bottom:0;
	margin:auto;
	background:#000;
	transform:rotate(-30deg);
}
#sec02 h2:after,#form h2:after{
	content:"";
	display:block;
	width:1px;
	height:100%;
	position:absolute;
	right:0;
	top:0;
	bottom:0;
	margin:auto;
	background:#000;
	transform:rotate(30deg);
}
#sec02 ul{
	margin-top:3em;
	position:relative;
}
#sec02 ul:before{
	content:"";
	display:block;
	width:1px;
	height:100%;
	position:absolute;
	left:33.333%;
	top:0;
	border-right:1px dotted #aaa;
}
#sec02 ul:after{
	content:"";
	display:block;
	width:1px;
	height:100%;
	position:absolute;
	right:33.333%;
	top:0;
	border-right:1px dotted #aaa;
}
#sec02 li{
	width:33.333%;
	padding:15px;
}
#sec02 .thumb{
	width:200px;
	height:200px;
	border-radius:100%;
	background:#efefef;
	margin:auto;
	margin-bottom:10px;
}
#sec02 h3{
	font-size:20px;
	padding-bottom:20px;
	color:#134e78;
}
#sec02 h3 span{
	font-size:80%;
	font-weight:500;
	color:#000;
}
#sec03 .message{
	font-weight:600;
	font-size:18px;
}
#sec03 .works{
	padding:30px;
	border:1px solid #ccc;
	margin-top:3em;
}
#sec03 .works li{
	width:calc(50% - 20px);
	height:350px;
	background:#efefef;
}
#sec03 .works ul{
	position:relative;
	margin-bottom:20px;
}
#sec03 .works ul:after{
	width:0;
	height:0;
	position:absolute;
	display:block;
	content:"";
	left:0;
	right:0;
	top:0;
	bottom:0;
	margin:auto;
	border-left:30px solid #134e78;
	border-top:15px solid transparent;
	border-bottom:15px solid transparent;
}
.works table{
	width:100%;	
	font-size:16px;
}

.works th{
	text-align:justify;
	border-bottom:1px solid #eee;
	padding:20px;
	width:25%;
	background:#f8f8f7;
}
.works td{
	text-align:justify;
	border-bottom:1px solid #eee;
	padding:20px;
	width:75%;
}
.works .price td{
	font-size:130%;
	color:#ab2b3a;
	font-weight:600;
}
form{
	font-size:14px;
}
form table{
	width:100%;
	margin-top:3em;
}
form th{
	width:30%;
	text-align:justify;
	border-bottom:1px solid #eee;
	padding:20px;
}
form td{
	width:70%;
	text-align:justify;
	border-bottom:1px solid #eee;
	padding:20px;
}
.txt01{
	display: block;
    width: 100%;
    background: #f5f7f4;
    border: 1px solid #dfdfdf;
    line-height: 52px;
	font-size:14px;
	height:52px;
	appearance:none;
	-webkit-appearance:none;
	-ms-appearance:none;
	-moz-appearance:none;
	font-family:游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
textarea{
    display: block;
    width: 100%;
    background: #f5f7f4;
    border: 1px solid #dfdfdf;
    line-height:2;
    height: 200px;
	padding:5px;
	font-size:14px;
	appearance:none;
	-webkit-appearance:none;
	-ms-appearance:none;
	-moz-appearance:none;
	font-family:游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
input[type="checkbox"]{
	width:15px;
	height:15px;
	vertical-align:middle;
	margin-right:0.2em;
}
form li{
	display:inline-block;
	margin-right:1em;
}
.check-area{
	padding:20px 40px;
	margin-top:40px;
	margin-bottom:40px;
	text-align:justify;
}
.check-area p{
	line-height:2;
	width:calc(100% - 40px);
	padding-left:10px;
	vertical-align:top;
	display:inline-block;
}
#check-flg{
	display:inline-block;
	width:20px;
	height:20px;
	vertical-align:top;
}
.send-btn{
	color:#fff;
	font-size:14px;
	font-weight:600;
	appearance:none;
	-webkit-appearance:none;
	-ms-appearance:none;
	-moz-appearance:none;
	display:block;
	width:300px;
	line-height:4.2;
	margin:auto;
	border:none;
	background:#0d61a9;
	cursor:pointer;
}
.caution{
	padding-top:1em;
	color: #ab2b3a;
    font-weight: 600;
}

/* ++++++++++++++++responsive style+++++++++++++++++++ */
@media screen and (max-width:767px){
	#sec01 h2{
		font-size:1.8rem;

	}
	#sec01 h2 span,#sec02 h2 span,#form h2 span{
		font-size:130%;
		padding-left:0;
	}
	.outline,#sec03 .works{
		margin-top:2.5rem;
		padding:1.5rem;
	}
	.outline .txt{
		width:100%;
		float:none;
		padding-right:0;
	}
	.outline .pic{
		width:100%;
		float:none;
		padding-bottom:1rem;
	}
	.outline .pic img{
		display:block;
		width:100%;
	}
	.caution {
		line-height:1.5;
	}
	#sec02 h2,#form h2{
		font-size:1.6rem;
		padding:0;
		display:block;
		font-weight:600;
		line-height:3.2rem;
	}
	#form h2{
		line-height:2.4rem;
	}
	#sec02 h2:before{
	    width: 2px;
	    height: 80%;
	    position: absolute;
	    left: 1.5rem;
		top:auto;
	}
	#sec02 h2:after {
	    width: 2px;
	    height:80%;
	    position: absolute;
	    right: 1.5rem;
		top:auto;
	}
	#form h2:before {
	    width: 2px;
	    height: 60%;
	    position: absolute;
	    left: 0.5rem;
		top:auto;
	}
	#form h2:after {
	    width: 2px;
	    height: 60%;
	    position: absolute;
	    right: 0.5rem;
		top:auto;
	}

	#sec02 li{
		width:100%;
		float:none;
	}
	#sec02 ul:before,#sec02 ul:after {
		display:none;
	}
	#sec02 h3 span {
	    font-size: 1.4rem;
	    font-weight: 600;
		line-height:1.4;
		display:block;
	}
	#sec02 h3 {
	    font-size: 2rem;
	    padding-bottom: 1rem;
	}
	#sec02  li p {
		text-align:justify;
	}

	#sec03 .works li {
	    width: 100%;
		float:none;
	    height: auto;
		background:transparent;
	}
	#sec03 .works li img{
		display:block;
		width:100%;
		height:auto;
	}
	#sec03 .works ul:after{
		display:none;
	}
	#sec03 .works ul li:nth-of-type(1):after{
	    width: 0;
	    height: 0;
	    display: block;
	    content: "";
	    margin: 10px auto;
	    border-top: 30px solid #134e78;
	    border-left: 15px solid transparent;
	    border-right: 15px solid transparent;
	}

	.works table,.works tbody,.works tr,.works td{
		display:block;
		width:100%;
		border:none;
	}
	.works td{
		padding:0.5rem;
	}
	.works th {
		display:block;
		width:100%;
	    padding: 0.5rem;
	    width: 100%;
	}
	form table {
	    width: 100%;
		display:block;
	    margin-top: 2rem;
	}
	form tbody,form tr {
		display:block;
		width:100%;
	}
	form th {
	    width: 100%;
		display:block;
	    border-bottom: none;
	    padding: 1.5rem 0.5rem 0;
	}
	form td {
	    width: 100%;
		display:block;
	    padding: 0.5rem 0.5rem 1.5rem;
	}
	.check-area {
	    padding: 1.5rem;
	    margin-top: 2rem;
	    margin-bottom: 2rem;
	    text-align: justify;
	}
	.check-area p {
	    line-height:1.8;
	    width: calc(100% - 3rem);
	    padding-left: 0;
	}
	.send-btn {
	    font-size: 1.4rem;
	    width: 100%;
	    line-height: 3.5;
	}
}