@charset "utf-8";

/* section 1 */
.sec1{
	padding:5.5em 0 0 0;
	position:relative;
}

.sec1Desc{
	text-align:center;
	margin:4.5em 0 3.5em 0;
}

.sec1Desc p{
	line-height:200%;
	letter-spacing:0.1em;
}

.faqListWrap{
	border:1px solid #3E8A28;
}

.sec1FaqDesc{
	text-align:center;
	margin:3.5em 0 2.5em 0;
}

.sec1FaqDesc strong{
	color:#3E8A28;
	font-size:28px;
	letter-spacing:0.1em;
}

.sec1FaqDesc p{
	line-height:200%;
	letter-spacing:0.1em;
	margin:2.5em 0 0 0;
}

.faqList{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;

    width: 1000px;
    margin: 0 auto;
}

.faqLeft{
    width: 690px;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;

	order:2;
}

.faqBoxWrap{
    width: 310px;
    box-sizing: border-box;
    height: 248px;
    margin: 0 35px 57px 35px;
}

.faqBoxWrap:nth-child(2n){
    margin: 0;
}

.faqRight{
    width: 310px;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;

	order:1;
}

.faqBoxlWrap{
    width: 100%;
    box-sizing: border-box;
    height: 384px;
    margin: 0 0 54px 0;
}

.faqBoxlWrap:last-child{
	height:248px;
	margin:36px 0 0 0;
}

.faqBox{
	background:#f2f2f2;
	padding:0.9em;
	position:relative;
}

.faqBox p{
    color: #3E8A28;
    font-size: 16px;
    font-weight: bold;
    line-height: 136%;
    min-height: 60px;
    letter-spacing: 0.02em;
}

.faqBox p.negaLetter{
	letter-spacing:-0.03em;
}

.faqBox p.margin{
	margin:0 0 0 3em;
}

.point{
	background:#3E8A28;
	text-align:center;
	padding:1em;
	margin:1.5em 0 0 0;
	position:relative;
	border-radius:3px;
}

.point strong{
    color: #fff;
    font-size: 19px;
    line-height: 128%;
}

.point:after{
    content: "";
    position: absolute;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 27px 7px 0 7px;
	border-color: #3E8A28 transparent transparent transparent;
    bottom: -27px;
    right: 0;
    left:0;
    margin:auto;
}

.ans{
	text-align:center;
	margin:1em 0 0 0;
}

.ans h3{
	color:#3E8A28;
	font-size:18px;
	position:relative;
}

.ans h3.addLine:after{
    content: "";
    display: block;
    height: 8px;
    background: url(../../img/cost/bg/addline.png) repeat-x center center;
    position: absolute;
    bottom: -4px;
    width: 100%;
    background-size:contain;
}

.faq1-1{
	position:absolute;
	top:5px;
	left:12px;
}

.faq1-2{
	position:absolute;
	top:8px;
	right:8px;
}

.faq2-1{
	position:absolute;
	top:8px;
	right:8px;
}

.faq3-1{
	position:absolute;
	top:8px;
	right:8px;
}

.faq4-1{
	position:absolute;
	top:8px;
	right:8px;
}

.faq5-1{
	position:absolute;
    top: -32px;
    right: 40px;
}

.faq6-1{
	position:absolute;
    top: 8px;
    right: 16px;
}

.faq8-1{
	position:absolute;
    top: 8px;
    right: 16px;
}

.faq9-1{
	position:absolute;
    top: 8px;
    right: 16px;
}

.faq10-1{
	position:absolute;
    top: 8px;
    right: 16px;
}

.faq11-1{
	position:absolute;
    top: 8px;
    right: 16px;
}

.sec1Copy{
	text-align:center;
	margin:0 0 3em 0;
}

.sec1Copy p{
	font-size:18px;
	font-weight:bold;
	letter-spacing:0.1em;
}



/* section 2 */
.sec2{

}

.sec2Box{
	background:#fff;
	padding:6em 0 5em 0;
}

.sec2Title{
	text-align:center;
	margin:0 0 2.5em 0;
}

.sec2Title h3{
	display:inline-block;
	font-size:22px;
	position:relative;
	padding:0 3.5em;
}

.s2tl{
    position: absolute;
    left: 0;
    top: -16px;
}

.s2tl:before{
    content: "";
    width: 1px;
    height: 60px;
    background: #3E8A28;
    display: block;
    -webkit-transform: rotate(56deg);
            transform: rotate(56deg);
}

.s2tl:after{
    content: "";
    width: 1px;
    height: 60px;
    background: #3E8A28;
    display: block;
    -webkit-transform: rotate(56deg);
            transform: rotate(56deg);
    position: absolute;
    top: 0;
    left: -10px;
}

.s2tr{
    position: absolute;
    right: 0;
    top: -16px;
}

.s2tr:before{
    content: "";
    width: 1px;
    height: 60px;
    background: #3E8A28;
    display: block;
    -webkit-transform: rotate(56deg);
            transform: rotate(56deg);
}

.s2tr:after{
    content: "";
    width: 1px;
    height: 60px;
    background: #3E8A28;
    display: block;
    -webkit-transform: rotate(56deg);
            transform: rotate(56deg);
    position: absolute;
    top: 0;
    left: -10px;
}

.sec2List{
	width:1000px;
	margin:0 auto;
}

.sec2List dl{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap:wrap;
	    flex-wrap:wrap;
	-webkit-box-orient:horizontal;
	-webkit-box-direction:normal;
	    -ms-flex-direction:row;
	        flex-direction:row;
	-webkit-box-align:stretch;
	    -ms-flex-align:stretch;
	        align-items:stretch;
}

.sec2List dt{
	border:1px solid #3E8A28;
	background:#3E8A28;
	text-align:center;
	width:20%;
	box-sizing:border-box;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.sec2List dd{
	border:2px solid #3E8A28;
	width:80%;
	box-sizing:border-box;
	
	padding:4px;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.sec2List dd p{
	font-size:15px;
	margin:0.5em 0 0 0;
}

.steps{
	text-align:center;
	margin:0.5em 0;
}

.stepCursor{
    position: relative;
    display: inline-block;
    width: 1px;
    height: 56px;
    background: #3E8A28;
}

.stepCursor:before{
    content: "";
    height: 1px;
    width: 25px;
    background: #3E8A28;
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    left: -12px;
}

.stepCursor:after{
	content: "";
    width: 1px;
    height: 30px;
    display: block;
    position: absolute;
    bottom: 0;
    right: -6px;
    background: #3e8a28;
    -webkit-transform: rotate(23deg);
            transform: rotate(23deg);
}

.consultFlow{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap:wrap;
	    flex-wrap:wrap;
	-webkit-box-orient:horizontal;
	-webkit-box-direction:normal;
	    -ms-flex-direction:row;
	        flex-direction:row;
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
	
	width:100%;
}

.cfDesc{
	width:72%;
	box-sizing:border-box;
	padding:0 0 0 1.5em;
}

.cfDesc strong{
	color:#3e8a28;
	font-size:23px;
	letter-spacing:0.1em;
}

.cfDesc p{
	font-size:16px;
	letter-spacing:0.1em;
	margin:1em 0 0 0;
}

.cfDesc p span{
	font-size:12px;
}

.cfImage{
	width:28%;
	box-sizing:border-box;
	text-align:right;
}



/* section 3 */
.sec3{
	background:#f2f2f2 url("../../img/cost/bg/sec3_bg.png") no-repeat left center;
	background-size:cover;
	min-height:960px;

	margin:0 0 3.5em 0;

	position:relative;
}

.circleTop{
    background: url(../../img/cost/bg/circle_bottom.png) no-repeat center center;
    position: absolute;
    z-index: 0;
	top:42px;
	left:0;
    right: 0;
    margin:auto;
    height: 162px;
    width: 733px;
}

.sec3Title{
	text-align:center;
	padding:15em 0 4em 0;
}

.sec3Title h3{
	font-size:28px;
	letter-spacing:0.2em;
	line-height:100%;
}

.sec3List{
	width:1000px;
	margin:0 auto;
}

.sec3List ul{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap:wrap;
	    flex-wrap:wrap;
	-webkit-box-orient:horizontal;
	-webkit-box-direction:normal;
	    -ms-flex-direction:row;
	        flex-direction:row;
	-webkit-box-align:start;
	    -ms-flex-align:start;
	        align-items:flex-start;
	-webkit-box-pack:center;
	-ms-flex-pack:center;
	justify-content:center;
}

.sec3List ul li{
	width:28%;
	box-sizing:border-box;
	padding:2em 2em 0 0;
	border-top:1px solid #3E8A28;
	border-right:1px solid #3E8A28;
}

.sec3List dt{
	text-align:center;
}

.sec3List dt span{
	display:block;
	font-size:16px;
	letter-spacing:0.2em;
	margin:1em 0;
}

.sec3List dd{
	border-top:2px solid #3E8A28;
}

.sec3List dd p{
    font-size: 14px;
    margin: 1.4em 0 0 0;
    letter-spacing: 0.02em;
    line-height: 168%;
}

.vmore{
    display: inline-block;
    color:#76ab63;
    line-height: 100%;
    position: relative;
    padding: 0 4em 0 0;
}

.vmore:before{
    content: "";
    height: 1px;
    width: 46px;
    background: #76ab63;
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    -webkit-transform: rotate(18deg);
            transform: rotate(18deg);
}

.vmore:after{
	content:"";
    height: 1px;
    width: 46px;
    background: #76ab63;
    display: inline-block;
    position: absolute;
    bottom: 0;
    right: 0;
    -webkit-transform: rotate(-18deg);
            transform: rotate(-18deg);
}



/*---------------------------------------------------------
 All SP 
---------------------------------------------------------*/
@media screen and (max-width: 639px) {

	/* sec1 */
	.sec1Desc p{
		text-align:left;
		width:90%;
		margin:2em auto 0 auto;
	}

	.sec1Desc p br{
		display:none;
	}

	.faqListWrap{
		margin:0 2em;
		padding:1em;
	}

	.sec1FaqDesc{
		margin:2em 0;
	}

	.sec1FaqDesc p{
		text-align:left;
	}

	.sec1FaqDesc p br{
		display:none;
	}

	.faqList{
		width:auto;
	}

	.faqLeft{
		width:auto;
		justify-content:space-between;
	}

	.faqBoxWrap{
		width:100%;
		margin:0 0 1em 0;
		padding:0.5em;
	}

	.faqBoxWrap:nth-child(2n){
		margin:0 0 1em 0;
	}

	.faqBox{
		padding:3%;
	}

	.faqBox p{
	    display: flex;
	    flex-wrap: wrap;
	    flex-direction: row;
	    align-items: center;
	}

	.faq1-1{
		position:absolute;
		top:0px;
		left:0px;
	}

	.faq1-2{
		position:absolute;
		top:0px;
		right:0px;
	}

	.faq2-1{
		position:absolute;
		top:0px;
		right:0px;
	}

	.faq3-1{
		position:absolute;
		top:0px;
		right:0px;
	}

	.faq4-1{
		position:absolute;
		top:0px;
		right:0px;
	}

	.faq5-1{
		position:absolute;
	    top: -20%;
	    right: 0px;
	}

	.faq10-1{
		position:absolute;
	    top: 0;
	    right: 0;
	}

	.faqRight{
		width:auto;
		flex-direction:row;
	}

	.faqBoxlWrap{
		width:100%;
		padding:0.5em;
		margin:0 0 3em 0;
	}

	.faqBoxlWrap:nth-child(1) strong{
		min-height: 75px;
	    display: flex;
	    flex-wrap: wrap;
	    flex-direction: row;
	    align-items: center;
	    justify-content: center;
	}

	.faqBoxlWrap:last-child{
		margin:1.5em 0;
	}

	.sec1Copy{
		text-align:left;
		margin:1em 0;
	}

	.sec1Copy p{
		font-size:100%;
		margin:0;
	}

	.sec1Copy p br{
		display:none;
	}



	/* sec2 */
	.sec2{
		padding:0;
		margin:0;
	}

	.sec2Title h3{
		padding:0 10%;
	}

	.sec2List{
		width:auto;
	}

	.sec2List ul li{
		width:90%;
		margin:0 auto;
	}

	.sec2List dt{
		width:100%;
		padding:1em;
	}

	.sec2List dd{
		width:100%;
	}

	.cfDesc{
		text-align:left;
		padding:0;
	}

	.cfDesc p br{
		display:none;
	}



	/* sec3 */
	.sec3{
		padding: 0 0 3em 0;
	}

	.sec3List{
		width:auto;
	}

	.sec3List ul li{
		width:90%;
		margin:0 auto 2em auto;
	}

	.circleTop{
		width:100%;
	}



}

/*---------------------------------------------------------
 Portrait 
---------------------------------------------------------*/
@media screen and (max-width:479px) {

	/* sec1 */
	.sec1{
		padding:2em 0;
	}

	.sec1Desc{
		padding:0 1em;
	}

	.sec1Desc p{
		text-align:left;
	}

	.sec1Desc p br{
		display:none;
	}

	.faqListWrap{
		margin:0 1em;
		padding:0.5em;
	}

	.sec1FaqDesc strong{
		font-size:110%;
	}

	.sec1FaqDesc p{
		margin:1em 0 0 0;
	}

	.faqBoxlWrap:nth-child(2){
		margin:0 0 2em 0;
	}

	.faq11-1{
		top:0;
		right:0;
	}

	.faqBox p{
		font-size:90%;
	}

	.point strong{
		font-size:100%;
	}

	.ans h3{
		font-size:85%;
	}

	.sec1Copy p{
		font-size:90%;
	}



	/* sec2 */
	.sec2Box{
		padding:0 0 3em 0;
	}

	.sec2Title h3{
		font-size:100%;
	}
	
	.cfDesc{
		width:100%;
	}
	
	.cfImage{
		width:100%;
		text-align:center;
		margin:0.5em 0 0 0;
	}



}