@charset "utf-8";


.mainvisual{
	padding: 100px 0;
	background: rgb(36,160,207);
	background: -moz-linear-gradient(90deg, rgba(36,160,207,1) 0%, rgba(0,96,217,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(36,160,207,1) 0%, rgba(0,96,217,1) 100%);
	background: linear-gradient(90deg, rgba(36,160,207,1) 0%, rgba(0,96,217,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#24a0cf",endColorstr="#0060d9",GradientType=1);
	position: relative;
	height: 100vh;
	box-sizing: border-box;
}
.mainvisual .image{
	margin-top: 5vh;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	.mainvisual{
		padding: 0;
		height: auto;	
		background:  none;
	}
	.mainvisual .image{
		padding: 40px 20px;
		margin-top: 0;
		text-align: center;
		height: auto;
		background: rgb(36,160,207);
		background: -moz-linear-gradient(90deg, rgba(36,160,207,1) 0%, rgba(0,96,217,1) 100%);
		background: -webkit-linear-gradient(90deg, rgba(36,160,207,1) 0%, rgba(0,96,217,1) 100%);
		background: linear-gradient(90deg, rgba(36,160,207,1) 0%, rgba(0,96,217,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#24a0cf",endColorstr="#0060d9",GradientType=1);
	}
	.mainvisual .image img{
		width: 100%;
	}
}

/*--------------------------------------------------------------------*/

.mainvisual .fixed{
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
}
.mainvisual .fixed .upper{
	border: 1px solid #EDE930;
	background-color: rgba(0,59,117,.3);
	font-size: 2.6rem;
	color: #ffce19;
	padding: 5px 0;
}
.mainvisual .fixed .upper .big{
	font-size: 3.9rem;
}
.mainvisual .fixed .upper .quote{
	font-size: 3.1rem;
	padding-left: 1em;
	background-image: url("../img/ico_fixed_quote_l.svg");
	background-repeat: no-repeat;
	background-position: left top;
	background-size: auto 16px;
	margin-left: 1em;
}
.mainvisual .fixed .upper .quote .right{
	padding-left: 0;
	padding-right: 1em;
	background-image: url("../img/ico_fixed_quote_r.svg");
	background-position: right bottom;
	margin-left: 0;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	.mainvisual .fixed{
		position: static;
		bottom: 0;
		left: 0;
		right: 0;
		width: 100%;
		background: rgb(36,160,207);
		background: -moz-linear-gradient(90deg, rgba(36,160,207,1) 0%, rgba(0,96,217,1) 100%);
		background: -webkit-linear-gradient(90deg, rgba(36,160,207,1) 0%, rgba(0,96,217,1) 100%);
		background: linear-gradient(90deg, rgba(36,160,207,1) 0%, rgba(0,96,217,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#24a0cf",endColorstr="#0060d9",GradientType=1);
	}
	.mainvisual .fixed .upper{
		font-size: 1.3rem;
		padding: 1em 0;
	}
	.mainvisual .fixed .upper .big{
		font-size: 1.9rem;
	}
	.mainvisual .fixed .upper .quote{
		font-size: 1.7rem;
		padding-left: 1em;
		background-size: auto 8px;
		margin-left: .5em;
	}
}

/*--------------------------------------------------------------------*/

.mainvisual .fixed .lower{
	background-color: #2B2B2B;
	color: #FFE800;
	padding: .8em 0;
}
.mainvisual .fixed .lower .btn{
	border-radius: 2em;
	display: inline-block;
	border: 1px solid #FFE800;
}
.mainvisual .fixed .lower .wrap{
	justify-content: center;
}
.mainvisual .fixed .lower .wrap .seconds{
	font-size: 1.8rem;
	padding: 0 1em 0 2em;
}
.mainvisual .fixed .lower .wrap .link{
	color: #000;
	padding: 0.8em 3em;
	background-color: #FFE800;
	border-radius: 2em;
}
.mainvisual .fixed .lower .wrap .link .ico{
	padding-left: 2.5em;
	background-image: url("../img/ico_cv_email.svg");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: auto 1em;
}
.mainvisual .fixed .lower .wrap .link .ico .title{
	padding-right: 2em;
	background-image: url("../img/ico_cv_arrow.svg");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: auto 10px;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	.mainvisual .fixed .lower .wrap{
		flex-direction: row;
		flex-wrap: nowrap;
	}
	.mainvisual .fixed .lower .wrap .seconds{
		font-size: 1.6rem;
	}
	.mainvisual .fixed .lower .wrap .link{
		padding: 1em 1.5em;
	}
	.mainvisual .fixed .lower .wrap .link .ico{
		padding-left: 2em;
	}
	.mainvisual .fixed .lower .wrap .link .ico .title{
		background-size: auto 5px;
		padding-right: 1.5em;
	}
}

/*--------------------------------------------------------------------*/

.mainvisual .fixed.scroll{
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	z-index: 1000;
}
.mainvisual .fixed.scroll .upper{
	background-color: rgba(0,59,117,.93);
	font-size: 2rem;
}
.mainvisual .fixed.scroll .upper .big{
	font-size: 2.9rem;
}
.mainvisual .fixed.scroll .upper{
	background-color: rgba(0,59,117,.93);
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	.mainvisual .fixed.scroll .upper{
		font-size: 1.3rem;
	}
	.mainvisual .fixed.scroll .upper .big{
		font-size: 1.9rem;
	}
}

/*--------------------------------------------------------------------*/

section.solution{
	padding: 100px 0;
	background-image: url("../img/bg_solution_blue.png");
	background-repeat: no-repeat;
	background-position: top 110px center;
	background-size: 100% auto;
}
section.solution .head{
	padding: 140px 0 70px 0;
	color: #00447C;
	line-height: 2;
}
section.solution .yellow{
	background: linear-gradient(transparent 60%, #ffe800 60%);
	padding-bottom: .3em;
}
section.solution .head .mini{
	font-size: 2.4rem;
	margin-bottom: 1em;
}
section.solution .head h2{
	font-size: 3.6rem;
	font-weight: 900;
}
section.solution .head .dot{
	position: relative;
}
section.solution .head .dot:before{
	content: "";
	display: block;
	width: 3px;
	height: 3px;
	border-radius: 3px;
	background-color: #00447C;
	position: absolute;
	top: -.4em;
	left: 0;
	right: 0;
	margin: auto;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.solution{
		padding: 40px 20px;
		background-position: top 30% center;
		background-size: 200% auto;
	}
	section.solution .head{
		padding: 40px 0 30px 0;
	}
	section.solution .head .mini{
		font-size: 1.6rem;
	}
	section.solution .head h2{
		font-size: 2.8rem;
	}
	section.solution .head h2 br{
		display: none;
	}
}

/*--------------------------------------------------------------------*/

section.solution .panel{
	background-color: rgba(255,255,255,.95);
	box-shadow: 3px 3px 3px rgba(0,0,0,.15);
	margin-top: 360px;
	padding: 146px 20px 50px 20px;
	position: relative;
	color: #00447C;
}
section.solution .mockup{
	position: absolute;
	top: -330px;
	left: 0;
	right: 0;
	margin: auto;
}
section.solution .text{
	padding: 30px 0;
}
section.solution .text h3{
	font-weight: 900;
	font-size: 3.6rem;
}
section.solution .comment{
	font-size: 2.4rem;
	margin: 40px 0;
}
section.solution .index{
	margin-bottom: 30px;
}
section.solution .index .border{
	border: 1px solid #000;
	padding: .5em 2em;
	display: inline-block;
	color: #000;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.solution .panel{
		margin-top: 180px;
		padding: 70px 10px 25px 10px;
	}
	section.solution .text h3{
		font-size: 2.7rem;
	}
	section.solution .comment{
		font-size: 2rem;
		margin: 30px 0;
	}
	section.solution .mockup{
		top: -150px;
	}
	section.solution .mockup img{
		width: 50%;
		max-width: 200px;
	}
	section.solution .graph{
		overflow: auto;
	}
	section.solution .graph img{
		min-width: 500px;
	}
}

/*--------------------------------------------------------------------*/

section.about{
	color: #fff;
	background: rgb(40,34,144);
	background: -moz-linear-gradient(90deg, rgba(40,34,144,1) 0%, rgba(0,153,206,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(40,34,144,1) 0%, rgba(0,153,206,1) 100%);
	background: linear-gradient(90deg, rgba(40,34,144,1) 0%, rgba(0,153,206,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#282290",endColorstr="#0099ce",GradientType=1);
}
section.about .bg{
	background-image: url("../img/bg_sove_l.png");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: auto 100%;
}
section.about .bgr{
	background-image: url("../img/bg_sove_r.png");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: auto 100%;
	padding: 100px 0;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.about .bg{
		background-image: none;
	}
	section.about .bgr{
		background-image: none;
		padding: 50px 20px;
	}
}

/*--------------------------------------------------------------------*/

section.about .checks{
	display: table;
	margin: 0 auto;
}
section.about .checks .item{
	text-align: left;
	font-size: 1.8rem;
	padding: 8px 0;
	border-bottom: 1px solid rgba(255,255,255,.3);
}
section.about .checks .item .ico{
	background-image: url("../img/ico_about_check.svg");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: auto 1.5em;
	padding-left: 2.2em;
}
section.about .impact{
	margin: 1.5em 0;
	font-size: 3.6rem;
}
section.about .impact .ico{
	padding-left: 1.5em;
	display: inline-block;
	background-image: url("../img/ico_about_border_l.png");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: auto 1em;
}
section.about .impact .ico .right{
	padding-right: 1.5em;
	display: inline-block;
	background-image: url("../img/ico_about_border_r.png");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: auto 1em;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.about .checks .item{
		font-size: 1.6rem;
	}
	section.about .impact{
		margin: 1.5em 0;
		font-size: 2.5rem;
	}
	section.about .impact .ico{
		padding-left: 1em;
	}
	section.about .impact .ico .right{
		padding-right: 1em;
		font-size: 5vw;
	}
}

/*--------------------------------------------------------------------*/

section.about .logo{
	margin-bottom: 40px;
}
section.about .logo .border{
	width: 29%;
	display: inline-block;
	border-radius: 5px;
	border: 1px solid #fff;
	padding: 1em;
}
section.about .logo .border img{
	width: 75%;
}
section.about .text .index{
	font-size: 3.6rem;
	margin-bottom: 1em;
}
section.about .text .cont{
	font-size: 1.8rem;
	font-weight: 500;
	width: 65%;
	margin: 0 auto;
}
section.about .text .cont p{
	margin-bottom: 1em;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.about .logo .border{
		width: 50%;
	}
	section.about .text .index{
		font-size: 2.4rem;
	}
	section.about .text .cont{
		font-size: 1.6rem;
		width: auto;
	}
}

/*--------------------------------------------------------------------*/

section.sove{
	color: #fff;
}
section.sove section{
	padding: 100px 0;
	background-color: #2053A8;
}
section.sove section.sv01{
	background-color: #2053A8;
}
section.sove section.sv02{
	background-color: #2886D1;
}
section.sove section.sv03{
	background-color: #2053A8;
}
section.sove section.sv01 .cont{
	background-color: #407EC7;
}
section.sove section.sv02 .cont{
	background-color: #4796D4;
}
section.sove section.sv03 .cont{
	background-color: #407EC7;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.sove section{
		padding: 50px 20px 30px 20px;
		background-color: #2053A8;
	}
}

/*--------------------------------------------------------------------*/

section.sove .sv01 .head{
	margin-bottom: 60px;
}
section.sove .sv01 .head .mini{
	font-size: 2.4rem;
}
section.sove .sv01 .head .main{
	font-size: 4.8rem;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.sove .sv01 .head{
		margin-bottom: 30px;
	}
	section.sove .sv01 .head .mini{
		font-size: 1.6rem;
	}
	section.sove .sv01 .head .main{
		font-size: 2.6rem;
	}
}

/*--------------------------------------------------------------------*/

section.sove section .cont{
	position: relative;
	padding: 60px;
}
section.sove section .cont .num{
	position: absolute;
	width: 70px;
	left: 2em;
	top: 0;
	transform: translateY(-50%);
}
section.sove section .cont .index{
	font-size: 4.2rem;
	margin-bottom: .8em;
}
section.sove section .cont .comment{
	font-size: 1.8rem;
	font-weight: 500;
	width: 68%;
	margin: 0 auto;
	line-height: 2;
}
section.sove section .banners{
	position: relative;
}
section.sove section .banners .item{
	background-color: #fff;
	border: 1px solid #2053A8;
	flex-grow: 1;
	width: 20%;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 1em;
}
section.sove section .banners:after{
	display: none;
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 1;
	background-color: #2053A8;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	background: rgb(32,83,168);
	background: -moz-linear-gradient(0deg, rgba(32,83,168,1) 0%, rgba(32,83,168,0) 50%);
	background: -webkit-linear-gradient(0deg, rgba(32,83,168,1) 0%, rgba(32,83,168,0) 50%);
	background: linear-gradient(0deg, rgba(32,83,168,1) 0%, rgba(32,83,168,0) 50%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2053a8",endColorstr="#2053a8",GradientType=1);
}
section.sove section .hoka{
	padding: 1em 0;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.sove section .cont{
		padding: 30px;
	}
	section.sove section .cont .num{
		width: 35px;
	}
	section.sove section .cont .index{
		font-size: 2.5rem;
	}
	section.sove section .cont .index br{
		display: none;
	}
	section.sove section .cont .comment{
		font-size: 1.6rem;
		width: auto;
	}
	section.sove section .cont .comment br{
		display: none;
	}
	section.sove .banners .wrap{
		flex-direction: row;
	}
	section.sove .banners .wrap .item{
		width: 33%;
		box-sizing: border-box;
		flex-grow: 0;
	}
	section.sove section .hoka{
		padding: 0;
	}
}

/*--------------------------------------------------------------------*/

section.sove .sv01 .adtype{
	padding-top: 2em;
}
section.sove .sv01 .adtype .index{
	font-size: 3rem;
}
section.sove .sv01 .adtype .index > *{
	display: inline-block;
	padding-bottom: .1em;
	border-bottom: 2px solid #fff;
	margin-bottom: 1.5em;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	
}
/*--------------------------------------------------------------------*/

section.sove .sv01 .adtype .samples{
	width: 88%;
	margin: 0 auto;
}
section.sove .sv01 .adtype .samples .monitor{
	width: 50%;
	margin-top: 60px;
}
section.sove .sv01 .adtype .samples .name{
	margin-bottom: 1em;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.sove .sv01 .adtype .samples{
		width: auto;
		flex-direction: row;
	}
	section.sove .sv01 .adtype .samples .item{
		width: 50%;
		margin-bottom: 2em;
	}
	section.sove .sv01 .adtype .samples .item .smart img{
		width: 70%;
	}
	section.sove .sv01 .adtype .samples .monitor{
		width: 100%;
		margin-top: 0;
	}
	section.sove .sv01 .adtype .samples .name{
		margin-bottom: 1em;
	}
}

/*--------------------------------------------------------------------*/

section.sove section.sv02{
	padding: 160px 0 0 0;
	background-image: url("../img/bg_sove_02_cloud.png");
	background-repeat: no-repeat;
	background-position: center top 70px;
	background-size: auto;
}
section.sove section.sv02 .bg{
	padding: 0 0 110px 0;
	background-image: url("../img/bg_sove_02_cloud_b.png");
	background-repeat: no-repeat;
	background-position: center bottom;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.sove section.sv02{
		padding: 50px 0 0 0;
		background-image: url("../img/bg_sove_02_cloud.png");
		background-repeat: no-repeat;
		background-position: center top 70px;
		background-size: auto;
	}
	section.sove section.sv02 .bg{
		padding: 0 20px 50px 20px;
		background-size: 150%;
	}
	section.sove section.sv02 .image{
		margin-top: 20px;
	}
}

/*--------------------------------------------------------------------*/

section.sove section.sv03{
	padding: 0;
}
section.sove section.sv03 .bg{
	padding: 160px 0;
	background-image: url("../img/bg_sove_03.png");
	background-repeat: no-repeat;
	background-position: center center;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){	
	section.sove section.sv03 .bg{
		padding: 50px 20px 220px 20px;
		background-position: left -20% bottom 10%;
		background-size: 200%;
	}
}

/*--------------------------------------------------------------------*/

section.eg{
	padding: 100px 0;
	background-color: #F8F8F8;
}
section.eg .each{
	margin-bottom: 60px;
}
section.eg .each:last-of-type{
	margin-bottom: 0;
}
section.eg .each .index{
	margin-bottom: 50px;
}
section.eg .each .index .left .big{
	font-size: 3.6rem;
}
section.eg .each .index .left .big .bg{
	padding-left: 1.5em;
	background-image: url("../img/ico_eg_border_l.png");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: auto;
}
section.eg .each .index .left .big .bgr{
	padding-right: 1.2em;
	background-image: url("../img/ico_eg_border_r.png");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: auto;
}
section.eg .each .index .left .small{
	font-size: 2.4rem;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.eg{
		padding: 40px 20px;
	}
	section.eg .each .index{
		margin-bottom: 25px;
	}
	section.eg .each .index .left{
		margin-bottom: 2em;
	}
	section.eg .each .index .left .big{
		font-size: 2.6rem;
	}
}

/*--------------------------------------------------------------------*/

section.eg .each .right{
	
}
section.eg .each .right .yellow{
	position: relative;
	background: linear-gradient(transparent 60%, #ffe800 60%);
}
section.eg .each .right .yellow .baloon{
	position: absolute;
	top: -7rem;
	left: 50%;
	transform: translateX(-50%);
	margin: auto;
	width: auto;
}

/*--------------------------------------------------------------------*/

section.eg .each .body .row{
	padding: 1.5em 2.5em;
	color: #0D59B6;
	border: 1px solid #B8B8B8;
	flex-wrap: nowrap;
	margin-top: -1px;
	justify-content: flex-start;
}
section.eg .each .body .row .ico img{
	width: 107px;
}
section.eg .each .body .row .title{
	min-width: 130px;
	font-size: 1.8rem;
	text-align: center;
}
section.eg .each .body .row .tags{
	flex-shrink: 1;
	flex-grow: 1;
	padding-left: 2em;
}
section.eg .each .body .row .tags span{
	padding: .5em 2em .5em 2em;
	box-shadow: 1px 1px 3px rgba(0,0,0,.2);
	border-radius: 2em;
	display: inline-block;
	margin-right: .8em;
	margin-bottom: .8em;
	font-weight: 500;
	position: relative;
	background-color: #fff;
}
section.eg .each .body .row .tags span:before{
	content: "#　";
	display: inline-block;
	color: #BABABA;
	font-size: 1.6rem;
}
section.eg .each .body .row .tags span.unable{
	color: #BABABA;
}
section.eg .each .body .row .tags span.full{
	width: 100%;
	box-sizing: border-box;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.eg .each .body .row{
		padding: 1.5em;
	}
	section.eg .each .body .row .ico img{
		width: 54px;
	}
	section.eg .each .body .row .title{
		margin-bottom: 20px;
	}
	section.eg .each .body .row .tags{
		padding: 0;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		flex-wrap: wrap;
		display: flex;
	}
	section.eg .each .body .row .tags span{
		font-size: 1.5rem;
		padding: .3em 1em .3em 1em;
	}
	section.eg .each .body .row .tags span:before{
		display: none;
	}
	section.eg .each .body .row .tags span.full{
		padding: .3em 2em;
	}
}

/*--------------------------------------------------------------------*/

section.eg .each .index .right{
	width: 68.5%;
}
section.eg .each .index .title{
	border: 2px solid #0D59B6;
	padding: .5em 0 .5em 2em;
	font-size: 3rem;
	color: #0D59B6;
	border-radius: 4px;
	font-weight: 900;
	background-image: url("../img/ico_eg_arrow.png");
	background-repeat: no-repeat;
	background-position: right 1em center;
	background-size: auto;
	cursor: pointer;
}
section.eg .each.open .index .title{
	background-image: url("../img/ico_eg_arrow_up.png");
}
section.eg .each .index .title .yellow{
	background: linear-gradient(transparent 60%, #ffe800 60%);
	font-weight: 900;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.eg .each .index .right{
		width: auto;
	}
	section.eg .each .index .title{
		font-size: 4vw;
		padding: .5em 1.5em;
		text-align: center;
		background-image: none !important;
	}
}

/*--------------------------------------------------------------------*/

section.eg .each .body.switch{
	
}

/*--------------------------------------------------------------------*/

section.reason{
	padding: 100px 0;
}
section.reason .head{
	font-size: 4.8rem;
	color: #0D59B6;
	margin-bottom: 1em;
	font-weight: 900;
}
section.reason .head > *{
	font-weight: 900;
}
section.reason .head span{
	color: #E1C200;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.reason{
		padding: 40px 10px 80px 10px;
		overflow-x: hidden;
	}
	section.reason .head{
		font-size: 3rem;
		margin-bottom: 40px;
	}
}

/*--------------------------------------------------------------------*/

section.reason .body{
	margin-bottom: 100px;
}
section.reason .body .item{
	padding: 50px 100px 50px 60px;
	border-radius: 11px;
	box-shadow: 3px 3px 15px rgba(0,0,0,0.12);
	position: relative;
	margin-bottom: 50px;
}
section.reason .body .item .num{
	position: absolute;
	left: 1em;
	top: 0;
	transform: translateY(-50%);
	width: 46px;
}
section.reason .body .item .index{
	font-size: 2.8rem;
	color: #0D59B6;
	margin-bottom: .6em;
}
section.reason .body .item .cont{
	font-weight: 400;
	font-size: 1.6rem;
	line-height: 2;
}
section.reason .body .item .image{
	position: absolute;
	right: -2em;
	top: -2em;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.reason .body{
		margin-bottom: 50px;
	}
	section.reason .body .item{
		padding: 3em;
	}
	section.reason .body .item .num{
		width: auto;
		height: 24px;
	}
	section.reason .body .item .num img{
		width: auto;
		height: 100%;
	}
	section.reason .body .item .index{
		font-size: 2.2rem;
	}
	section.reason .body .item .image{
		position: absolute;
		text-align: center;
		right: 0;
		top: auto;
		bottom: 0;
		transform: translate(25%, 50%);
	}
	section.reason .body .item .image img{
		width: auto;
		transform: scale(.5);
	}
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.reason .body .item .cont{
		font-size: 1.3rem;
	}
}

/*--------------------------------------------------------------------*/

section.reason .body .item .sample{
	margin-top: 3em;
	margin-right: -40px;
	min-height: 300px;
	align-items: flex-start;
	flex-wrap: nowrap;
}
section.reason .body .item .sample .right{
	width: 33%;
	padding-left: 40px;
}
section.reason .body .item .sample .right .sample_title{
	font-size: 2.4rem;
	padding-bottom: .3em;
	border-bottom: 1px solid #0D59B6;
	margin-bottom: .3em;
	color: #0D59B6;
}
section.reason .body .item .sample .right .sample_text{
	line-height: 2;
	font-size: 1.3rem;
	font-weight: 400;
}
section.reason .body .item .sample .video{
	flex: 1;
	padding: 3em;
	background-color: #B0DCF5;
	transform: scale(1.2);
	transform-origin: right top;
}
section.reason .body .item .sample .video iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.reason .body .item .sample{
		min-height: auto;
		margin-right: 0;
	}
	section.reason .body .item .sample .left{
		margin-bottom: 2em;
	}
	section.reason .body .item .sample .right{
		width: 100%;
		padding-left: 0;
	}
	section.reason .body .item .sample .right .sample_title{
		font-size: 1.8rem;
	}
	section.reason .body .item .sample .video {
		flex: auto;
		padding: 1em;
		transform: scale(1);
		width: 100%;
		box-sizing: border-box;
	}
}

/*--------------------------------------------------------------------*/

section.reason .body .item .sample .video .so-demo{
	position: relative;
	width: 100%;
    padding: calc(450 / 800 * 100%) 0 0;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){

}


/*--------------------------------------------------------------------*/

section.reason .performance .head{
	margin-bottom: .5em;
}
section.reason .performance .title .border{
	display: inline-block;
	padding: .5em 1em;
	font-size: 2.4rem;
	color: #0D59B6;
	border: 2px solid #0D59B6;
	border-radius: 4px;
}
section.reason .performance .body{
	padding-top:  100px;
	margin: 0 -100px;
	margin-bottom: 0;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.reason .performance{
		padding: 0 20px;
	}
	section.reason .performance .title .border{
		font-size: 1.6rem;
	}
	section.reason .performance .body{
		padding: 0;
		padding-top: 40px;
		margin: 0;
		text-align: center;
	}
	section.reason .performance .body img{
		width: 70%;
	}
}

/*--------------------------------------------------------------------*/

section.voice{
	padding: 100px 0;
	background-color: #2053A8;
	color: #fff;
}
section.voice .head{
	margin-bottom: 3em;
}
section.voice .head .ico{
	width: 10em;
	margin: 0 auto 1.5em auto;
}
section.voice .head .mini{
	font-size: 2.4rem;
	margin-bottom: .5em;
}
section.voice .head .big{
	font-size: 4.8rem;
}
section.voice .head .big strong{
	font-weight: 900;
	color: #E1C200;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.voice{
		padding: 40px 20px 20px 20px;
	}
	section.voice .head{
		margin-bottom: 2em;
	}
	section.voice .head .ico{
		width: 30%;
	}
	section.voice .head .mini{
		font-size: 1.8rem;
	}
	section.voice .head .big{
		font-size: 3rem;
	}
}

/*--------------------------------------------------------------------*/

section.voice .body{
	flex-wrap: nowrap;
	align-items: stretch;
}
section.voice .body .item{
	width: 30%;
}
section.voice .body .item .num{
	width: 7.5em;
	margin-bottom: 1em;
}
section.voice .body .item .border{
	padding: 4em 3em;
	border: 1px solid #fff;
	box-sizing: border-box;
	height: 90%;
}
section.voice .body .item .border .title{
	font-size: 3rem;
	margin-bottom: .5em;
}
section.voice .body .item .border .title .mini{
	font-size: 2rem;
}
section.voice .body .item .border .cont{
	font-weight: 500;
	line-height: 2;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.voice .body{
		flex-wrap: nowrap;
		align-items: stretch;
	}
	section.voice .body .item{
		width: 100%;
		margin-bottom: 30px;
	}
	section.voice .body .item .num{
		width: 6em;
	}
	section.voice .body .item .border{
		padding: 3em;
	}
	section.voice .body .item .border .title{
		font-size: 2.3rem;
	}
	section.voice .body .item .border .title .mini{
		font-size: 1.7rem;
	}
}

/*--------------------------------------------------------------------*/

section.client{
	padding: 100px 0;
}
section.client .head{
	font-size: 4.2rem;
	margin-bottom: 1em;
	color: #2053A8;
}
section.client .head *{
	font-weight: 900;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.client{
		padding: 40px 20px;
	}
	section.client .head{
		font-size: 3rem;
	}
}

/*--------------------------------------------------------------------*/

section.client .body{
	font-size: 1.6rem;
	line-height: 2;
	font-weight: 500;
}
section.client .body .item{
	display: inline-block;
	font-weight: 500;
}
section.client .more{
	font-weight: 700;
	margin: 2em 0;
	color: #2053A8;
}
section.client .comment{
	font-weight: 500;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.client .body{
		font-size: 1.3rem;
	}
}

/*--------------------------------------------------------------------*/

section.bottom{
	color: #fff;
	padding: 100px 0;
	background: rgb(36,160,207);
	background: -moz-linear-gradient(90deg, rgba(36,160,207,1) 0%, rgba(0,96,217,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(36,160,207,1) 0%, rgba(0,96,217,1) 100%);
	background: linear-gradient(90deg, rgba(36,160,207,1) 0%, rgba(0,96,217,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#24a0cf",endColorstr="#0060d9",GradientType=1);
}
section.bottom .wrap{
	flex-wrap: nowrap;
}
section.bottom .left{
	
}
section.bottom .left .index{
	font-size: 2.4rem;
	line-height: 1.75;
}
section.bottom .left .logo{
	margin: 60px auto;
	width: 70%;
}
section.bottom .left .impact{
	font-size: 2.4rem;
	line-height: 1.75;
}
section.bottom .left .impact .bg{
	background-image: url("../img/ico_bottom_border_l.png");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: auto;
	padding-left: 2em;
}
section.bottom .left .impact .bgr{
	background-image: url("../img/ico_bottom_border_r.png");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: auto;
	padding-right: 2em;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.bottom{
		padding: 40px 20px;
	}
	section.bottom .left{
		margin-bottom: 2em;
	}
	section.bottom .left .index{
		font-size: 1.8rem;
	}
	section.bottom .left .logo{
		margin: 30px auto;
		width: 48%;
	}
	section.bottom .left .impact{
		font-size: 4vw;
	}
	section.bottom .right img{
		width: 60%;
	}
}

/*--------------------------------------------------------------------*/

section.contact{
	padding: 100px 0 100px 0;
}
section.contact .head{
	color: #2053A8;
	padding-top: 4em;
	background-image: url("../img/ico_contact_email.svg");
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 50px auto;
	position: relative;
	padding-bottom: 1em;
	margin-bottom: 5em;
}
section.contact .head:before,
section.contact .head:after{
	content: "";
	width: 70px;
	height: 3px;
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
section.contact .head:before{
	background-color: #E8EDF4;
	transform: translateX(-50%);
}
section.contact .head:after{
	background-color: #1D5CB1;
	transform: translateX(50%);
}
section.contact .head .mini{
	font-size: 1.6rem;
	margin-bottom:  .5em;
}
section.contact .head .big{
	font-size: 3.6rem;
}
section.contact .head .big > *{
	font-weight: 900;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.contact{
		padding: 40px 20px;
	}
	section.contact .head{
		padding-top: 3em;
		background-size: 30px auto;
		position: relative;
		padding-bottom: 1em;
		margin-bottom: 3em;
	}
	section.contact .head .mini{
		font-size: 1.2rem;
	}
	section.contact .head .big{
		font-size: 2.8rem;
	}
}

/*--------------------------------------------------------------------*/

section.contact .body{
	font-weight: 600;
	font-size: 1.6rem;
}
section.contact .body .item{
	padding: 7px 0;
	flex-wrap: nowrap;
	align-items: flex-start;
}
section.contact .body .item .th{
	width: 40%;
}
section.contact .body .item .th .index{
	padding-right: 1em;
}
section.contact .body .item .th span{
	color: #fff;
	padding: .5em 1.5em;
	border-radius: 2em;
	background-color: #ccc;
	font-size: 1.2rem;
	white-space: nowrap;
}
section.contact .body .item .th .label{
	flex-wrap: nowrap;
	justify-content: flex-end;
}
section.contact .body .item .th span.necessary{
	background-color: #FFA700;
}
section.contact .body .item .th .mini{
	font-size: 1.2rem;
	text-align: right;
	color: #aaa;
}
section.contact .body .item .td{
	width: 60%;
	padding-left: 2em;
	box-sizing: border-box;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.contact .body .item{
		flex-direction: column;
		margin-bottom: 1em;
	}
	section.contact .body .item .th{
		width: 100%;
		text-align: left;
		margin-bottom: .5em;
	}
	section.contact .body .item .th .index{
		font-size: 1.8rem;
	}
	section.contact .body .item .th .label{
		align-items: center;
		flex-direction: row;
		justify-content: space-between;
	}
	section.contact .body .item .th span.necessary{
		font-size: 1.1rem;
		margin-top: 0;
		display: inline-block;
		paddding: .3em 1em;
	}
}

/*--------------------------------------------------------------------*/

section.contact .body .item .td .check{
	/*padding: 1em;
	background-color: #F5FBFF;
	border: 1px solid #7FAAE2;*/
	font-weight: 500;
	font-size: 14px;
}
section.contact .body .item .td input,
section.contact .body .item .td select,
section.contact .body .item .td textarea{
	width: 100%;
	box-sizing: border-box;
	border: 1px solid #7FAAE2;
	padding: .7em 1.5em;
	height: 3.4em;
	font-family: inherit;
	background-color: #F5FBFF;
}
section.contact .body .item .td select{
	height: auto;
}
section.contact .body .item .td  .item{
	justify-content: flex-start;
}
section.contact .body .item .td  .item .idx{
	width: 3em;
}
section.contact .body .item .td [type="checkbox"]{
	height: 1em;
	width: auto;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.contact .body .item .td{
		padding: 0;
		width: 100%;
		box-sizing: border-box;
	}
	section.contact .body .item .td input,
	section.contact .body .item .td select,
	section.contact .body .item .td textarea{
		font-size: 1.3rem;
	}
	section.contact .body .check{
		margin-top: 1em;
	}
	section.contact .body .check .item{
		flex-direction: row;
		font-size: 1.6rem;
	}
	section.contact .body .item .td .item .idx{
		width: 2em;
	}
}

/*--------------------------------------------------------------------*/

section.contact .submit{
	padding-top: 2em;
}
section.contact .submit button{
	display: inline-block;
	border: none;
	color: #fff;
	background-color: #FFA700;
	padding: 1em 3em;
	font-family: inherit;
	font-size: 1.6rem;
	cursor: pointer;
}
@media screen and (min-width: 751px){

}
@media screen and (max-width: 750px){
	section.contact .submit{
		padding-top: 1em;
		text-align: center !important;
	}
}