@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);
html{
    font-size:10px;
}
body{
    font-family: "Noto Sans JP", 游ゴシック体, YuGothic, 游ゴシック, "Yu Gothic", メイリオ, Meiryo, sans-serif;
    font-weight: 500;
    letter-spacing: 1px;
    font-size: 1.4rem;
    color:#000;
	line-height: 1.7;
	position: relative;
}
body a.all{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
@media screen and (max-width: 768px){
	html{
		font-size:9px;
	}
	body{
		line-height: 1.6;
		font-size: 1.2rem;
	}
}

header .inner{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
header .inner{
	padding-left:10px;
}
header .inner ul{
	display: flex;
	
}
header .inner ul li a{
	display: block;
	padding:20px 40px;
	text-align: center;
	color:#fff;
}
header .inner ul li.siryou{
	background-color: #ffb91d;
}
header .inner ul li.contact{
	background-color: #ff1f4a;
}
header .sujest{
	background-color: #003a54;
	text-align: center;
	color:#fff;
	padding:20px 0;
}

#mainvisual{
	background-color: #005e7f;
	text-align: center;
	padding:30px 0;
}
#mainvisual ul{
	display: flex;
	justify-content: center;
	color:#fff;
	margin-bottom:40px;
}

#mainvisual ul li{
	margin: 0 10px;
	font-size: 1.3rem;
}
#mainvisual ul li a{
	text-decoration: underline;
}

@media screen and (max-width: 768px){
	header .inner h1 #logo{
		width:200px;
	}
	header .inner ul li a{
		padding:15px 5px;
		line-height: normal;
	}
	header .sujest{
		padding:8px;
	}
	#mainvisual{
		padding:10px 5px;
	}
	#mainvisual ul{
		display: none;
		margin-bottom:10px;
	}
}



section{
	text-align: center;
}
section:nth-child(odd){
	background:#f2f2f2;
}
section .inner{
	max-width: 900px;
	text-align: left;
	margin:0 auto;
}
section h2{
	text-align: center;
	margin-bottom:50px;
}
section .flex{
	display: flex;
	justify-content: center;
	align-items: center;
}

@media screen and (max-width: 768px){
	section .inner{
		padding:0 10px;
	}
	section h2{
		margin-bottom:30px;
	}
	section .flex{
		flex-wrap: wrap;
	}
	
}




footer{
	text-align: center;
	padding:50px 0;
}
footer .inner{
	max-width: 900px;
	text-align: left;
	margin:0 auto;
}
footer h2{
	text-align: center;
	margin-bottom:50px;
}
footer .flex{
	display: flex;
	justify-content:space-between;
	align-items: start;
}
footer p{
	margin-bottom:30px;
	text-align: center;
}
footer dl{
	width: calc(50% - 10px);
}
footer dl dt{
	font-weight: bold;
}

footer dl dd{
	margin-bottom:15px;
	padding-left:10px;
}

@media screen and (max-width: 768px){
	footer .inner{
		padding:0 10px;
	}
	
}


/* problem */
.problem{
	padding:50px 0;
}


/* about */
.about{
	padding:50px 0;
}
.about h2 img.type1{
	max-width: 579px;
}
.about h2 img.type2{
	max-width: 422px;
}
.about dl dt{
	background-color: #000;
	color:#fff;
	display: inline-block;
	padding:4px 20px;
	margin-bottom:20px;
}
.about dl dt{
	font-weight: 600;
}
@media screen and (max-width: 768px){
	.about{
		padding:30px 0;
	}
	.about dl dt{
		margin-bottom:10px;
		padding:2px 10px;
	}
	.about dl{
		margin-bottom:20px;
	}
	.about h2 img.type1{
		max-width: calc(1% * (579 / 650 * 100));
	}
	.about h2 img.type2{
		max-width: calc(1% * (422 / 650 * 100));
	}
	
}



/* fourFunctions */
.fourFunctions{
	padding:50px 0;
}

.fourFunctions h2 img{
	max-width: 604px;
}

.fourFunctions h3{
	position: relative;
	text-align: center;
	background-color:#1b63a7 ;
	color:#fff;
	font-size: 1.6rem;
	padding:10px;
}
.fourFunctions .blo{
	background-color: #fff;
	padding:30px;
	margin-bottom:50px;
}
.fourFunctions .blo.center{
	text-align: center;
}
.fourFunctions dl{
	padding:0 10px;
}
.fourFunctions dl dt{
	font-size:1.8rem;
	font-weight: bold;
	margin-bottom:10px;
}
.fourFunctions dl dd{
	margin-bottom:30px;
}
.fourFunctions dl strong{
	font-weight: bold;
}
.fourFunctions dl em{
	font-size: 0.7rem;
}
.fourFunctions p{
	margin-bottom:30px;
}
.fourFunctions .img1{
	max-width: 351px;
}
.fourFunctions .img2{
	max-width: 730px;
	margin-right:-120px;
}
.fourFunctions .img3{
	max-width: 418px;
}

@media screen and (max-width: 768px){
	.fourFunctions{
		padding:30px 0;
	}
	.fourFunctions h2 img{
		max-width: calc(1% * (604 / 650 * 100));

	}
	.fourFunctions .blo{
		padding:10px;
	}
	.fourFunctions dl{
		padding:0px;
	}
	.fourFunctions .img1{
		width: 90%;
	}
	.fourFunctions .img2{
		width: 90%;
		margin-right:0px;
	}
	.fourFunctions .img3{
		width: 90%;
		margin-bottom:10px;
	}
}


/* flow */
.flow {
	padding:50px 0;
}
.flow h2 img{
	max-width: 385px;
}
.flow .flex{
	justify-content: space-between;
	align-items: start;
}
.flow dl{
	width: 170px;
}
.flow dl dt{
	font-weight:bold;
	margin-bottom:20px;
}
@media screen and (max-width: 768px){
	.flow{
		padding:30px 0;
	}
	.flow h2 img{
		max-width: calc(1% * (385 / 650 * 100));
	}
}


/* case */
.case {
	padding:50px 0;
}
.case h2 img{
	max-width: 121px;
}
.case p{
	text-align: center;
	margin-bottom:50px;
}
.case .flex{
	justify-content: space-between;
	align-items: start;
	margin-bottom:30px;
}
.case dl{
	background: #fff;
	width: 280px;
	padding:20px;
}
.case dl dt{
	font-weight:bold;
	margin-bottom:20px;
}
.case .fx{
	font-size:50px;
	font-weight:bold;
	color:#1b63a7;
	text-align: center;
}
.case .fx span{
	border-bottom:2px solid #1b63a7;
}

@media screen and (max-width: 768px){
	.case{
		padding:30px 0;
	}
	.case h2 img{
		max-width: calc(1% * (121 / 650 * 100));
	}
	.case .flex{
		margin-bottom:0px;
		margin:0 20%;
	}
	.case dl{
		width: 90%;
		padding:20px;
		margin:0 auto 20px;
	}
	.case .fx{
		font-size:2.3rem;
		font-weight:bold;
		color:#1b63a7;
		text-align: center;
	}
	
}


/* chance */
#chance {
	padding:50px 0;
	background-color:#1b63a7;
	color:#fff;
}
.chance h2 img{
	max-width: 572px;
}
.chance p{
	text-align: center;
	margin-bottom:50px;
}
.chance .flex{
	justify-content: space-between;
	align-items: start;
	flex-wrap: wrap;
	margin-bottom:30px;
}
.chance dl{
	background: #fff;
	width: 440px;
	margin-bottom:20px;
}
.chance dl dt{
	font-weight:bold;
}
.chance .button{
	text-align: center;
}
.chance a.contact {
	width:90%;
    background-color: #ff1f4a;
	display: block;
    text-align: center;
    border: 1px solid #fff;
    padding: 15px 0;
	margin: 0 auto 20px;
}

@media screen and (max-width: 768px){
	.chance{
		padding:30px 0;
	}
	.chance h2 img{
		max-width: calc(1% * (572 / 650 * 100));
	}
	.chance .flex{
		margin-bottom:10px;
	}
	.chance p{
		margin-bottom:30px;
	}
	.chance a.contact {
		margin: 0 auto 0px;
	}
}

/* question */
.question {
	padding:50px 0;
}
.question h2 img{
	max-width: 178px;
}
.question p{
	text-align: center;
	margin-bottom:50px;
}
.question .flex{
	justify-content: space-between;
	align-items: stretch;
	flex-wrap: wrap;
	margin-bottom:30px;
}
.question dl{
	background: #fff;
	width: 440px;
	margin-bottom:20px;
	padding:20px;
}
.question dl dt{
	background: url("../image/question_img1.svg") no-repeat left top;
	background-size: 30px;
	padding:2px 10px 10px 40px;
	margin-bottom:10px;
}
.question dl dd{
	background: url("../image/question_img2.svg") no-repeat left top;
	background-size: 30px;
	padding:2px 10px 10px 40px;
}
@media screen and (max-width: 768px){
	.question{
		padding:30px 0;
	}
	.question h2 img{
		max-width: calc(1% * (178 / 650 * 100));
	}
	.question .flex{
		margin-bottom:0;
	}
}

/* cta */
#cta {
	padding:50px 0 0;
	background-color:#1b63a7;
	color:#fff;
}
.cta.type1 h2 img{
	max-width: 817px;
}
.cta.type2 h2 img{
	max-width: 531px;
}
.cta p{
	text-align: center;
	margin-bottom:50px;
}

.cta .flex img{
	max-width:320px;
	margin-right:30px;
}
.cta.type2 .flex img{
	max-width:220px;
}
.cta .flex{
	align-items: start;
}
.cta dl{
	width: 260px;
	padding:0 10px;
}
.cta.type2 dl{
	width: 520px;
}
.cta dl dt{
	margin-bottom:15px;
}
.cta dl dt a{
	display: block;
	text-align: center;
	border:1px solid #fff;
	padding:15px 0;
}
.cta dl dt a.siryou{
	background-color: #ffb91d;
}
.cta dl dt a.contact{
	background-color: #ff1f4a;
}

@media screen and (max-width: 768px){
	.cta{
		padding:30px 0;
	}
	.cta.type1 h2 img{
		max-width: calc(1% * (817 / 650 * 100));
	}
	.cta.type2 h2 img{
		max-width: calc(1% * (531 / 650 * 100));
	}
	.cta .flex{
		margin-bottom:0;
	}

	.cta .flex img{
		margin-right:0px;
		margin-bottom:20px;
	}
	.cta dl{
		width: 90%;
		padding:0;
	}
	.cta dl dd{
		margin-bottom:20px;
	}
	.cta.type2 dl{
		width: 90%;
	}
}


/* cost */
.cost {
	padding:50px 0;
}
.cost h2 img{
	max-width: 281px;
}
.cost p{
	text-align: center;
	margin-bottom:50px;
}
.cost .flex{
	justify-content: space-between;
	align-items: start;
	margin-bottom:30px;
}
.cost dl{
	background: #fff;
	width: 280px;
}
.cost dl dt{
	font-weight:bold;
	margin-bottom:20px;
}
.cost .fx{
	font-size:50px;
	font-weight:bold;
	color:#1b63a7;
	text-align: center;
}
.cost .fx span{
	border-bottom:2px solid #1b63a7;
}

@media screen and (max-width: 768px){
	.cost{
		padding:30px 0;
	}
	.cost h2 img{
		max-width: calc(1% * (281 / 650 * 100));
	}
	.cost .flex{
		margin-bottom:10px;
	}
	.cost dl{
		width: 100%;
	}
	
}


/* efficiency */
.efficiency{
	padding:50px 0;
}
.efficiency h2 img.type1{
	max-width: 743px;
}
.efficiency h2 img.type2{
	max-width: 422px;
}
.efficiency .flex{
	align-items: start;
}
.efficiency dl dd{
	padding-top:30px;
	padding-right:20px;
}

@media screen and (max-width: 768px){
	.cost{
		padding:30px 0;
	}
	.cost h2 img{
		max-width: calc(1% * (281 / 650 * 100));
	}
	.cost .flex{
		margin-bottom:10px;
	}
	.cost dl{
		width: 100%;
	}
	
}

/* form */
.contactForm{
	padding:50px 0;
}
.contactForm h2 img{
	max-width: 579px;
}
.contactForm p{
	text-align: center;
	margin-bottom:40px;
}
.contactForm table{
	width:70%;
	margin:0 auto 30px;
}
.contactForm tr{
	border-bottom:1px solid #efefef;
}
.contactForm tr th,
.contactForm tr td{
	vertical-align: top;
	padding:10px;
	margin-bottom:10px;
}
.contactForm tr th{
	width:180px;
}
.contactForm form input,
.contactForm form select,
.contactForm form textarea{
	width: 100%;
	padding:5px;
	border:1px solid #efefef;
}
::placeholder {
	color: #efefef;
}
::-ms-input-placeholder {
	color: #efefef;
}
:-ms-input-placeholder {
	color: #efefef;
}
.contactForm form .button{
	text-align: center;
}
.contactForm form .button button{
	background-color: #ff1f4a;
	color:#fff;
	padding:20px 50px;
	font-size:16px;
	letter-spacing: 4px;
	border-radius: 3px;
	cursor: pointer;
}