
/***********************************************************************************************************************

service.css

***********************************************************************************************************************/

.service{
}
.sec_first{
	margin: 5% 0 0;
}
.sec_service{
	padding: 15% 0;
	overflow: hidden;
}


@media screen and (max-width: 767px) {
.sec_first{
	margin: 8% 0 0;
}
}



/**********************************
h1〜
**********************************/
h1{
	font-size: 3.4rem;
	font-size: 34px;
	font-weight: 600;
	text-align: center;
	color: #ff6600;
	margin-bottom: 1.2em;
}
h2.h2_service{
	font-size: 3.0rem;
	font-size: 30px;
	font-weight: 600;
	line-height: 1.2em;
	color: #fff;
	text-align: center;
}
h2.h2_service .en{
	display: block;
	font-family: 'Aldrich', sans-serif;
	font-weight: 400;
	font-size: 1.1rem;
	font-size: 11px;
	color: #ff6600;
}

h3.h3_service{
	font-size: 1.6rem;
	font-size: 16px;
	font-weight: 600;
	color: #fff;
	text-align: center;
	transform:skewX(45deg);
}
.h3_wrap{
	display: inline-block;
	padding: 2px 20px;
	margin: 10px 0 25px;
	background-color: #5c9aa2;
	transform:skewX(-45deg);
}
.after .h3_wrap{ background-color: #a56683;}
.before .h3_wrap{ background-color: #00698e;}

p.align_c_l{
	text-align: center;
}
.list_service li.txt p{
	font-size: 1.8rem;
	font-size: 18px;
	font-weight: 600;
	color: #fff;
}

@media screen and (max-width: 980px) {
h1{
	font-size: 2.8rem;
	font-size: 28px;
}
h2.h2_service{
	font-size: 2.4rem;
	font-size: 24px;
}
h3.h3_service{
	font-size: 1.4rem;
	font-size: 14px;
}
.list_service li.txt p{
	font-size: 1.6rem;
	font-size: 16px;
}
}


@media screen and (max-width: 767px) {
h1{
	font-size: 2.0rem;
	font-size: 20px;
}
h2.h2_service{
	font-size: 2.0rem;
	font-size: 20px;
}
h3.h3_service{
	font-size: 1.2rem;
	font-size: 12px;
}
.list_service li.txt p{
	font-size: 1.4rem;
	font-size: 14px;
}
p.align_c_l{
	text-align: justify;
}
p.align_c_l .resp_autowrap{
	display: inline;
}
}
	



/* img_service ************************************/
.img_service{
	width: 80%;
	max-width: 680px;
	margin: 5% auto 0;
}




/**********************************
sec_service
**********************************/
.bg_orange{
	position: relative;
	background-color: #ff6600;
}
.bg_000{
	position: relative;
	background-color: #000;
	transform: skewY(-8deg);
	border-top: 1px solid #ff6600;
	border-bottom: 1px solid #ff6600;
}
.service_inner{
	position: relative;
	z-index: 1;
	transform: skewY(8deg);
}

.block{
	padding: 15% 0;
	text-align: center;
}


/* list_service ************************************/
.list_service{
	display: flex;
	justify-content: space-between;
	flex-flow: wrap;
}

.list_service li.photo{
	width: 52.77777778%;
	margin-left: 40px;
}
.list_service li .photo_inner{ box-shadow: -20px -20px 0 #5c9aa2;}
.list_service.reverse li .photo_inner{ box-shadow: 20px -20px 0 #5c9aa2;}
.after .list_service li .photo_inner{ box-shadow: -20px -20px 0 #a56683;}
.before .list_service li .photo_inner{ box-shadow: 20px -20px 0 #00698e;}




.list_service li.txt{
	width: 31.94444444%;
	margin: 0 5% 0 0;
	padding: 5% 0 0;
}
.list_service.reverse .photo{ 
	order: 2;
	margin-right: 40px;
}
.list_service.reverse .photo img{ 
	width: 100%;
	height: auto;
}

.list_service.reverse .txt{ 
	order: 1;
	margin: 0 0 0 5%;
}


.list_service li.txt i{
	display: block;
	width: 110px;
	margin: 0 auto 10px;
}
.list_service li.txt i img{
	width: 110px;
	height: auto;
}
.list_service li.txt .btn_txt_more{
	margin: 20px 0 0;
}
.list_service li.txt .btn_txt_more a{
	background-color: #000;
}
.list_service li.txt .btn_txt_more a:hover{
	background-color: #ff6600;
}


@media screen and (max-width: 980px) {
.list_service li.photo{
	width: 48%;
	margin-left: 20px;
}
.list_service.reverse li.photo{
	width: 48%;
	margin-right: 20px;
}
.list_service li.txt,
.list_service.reverse li.txt{
	width: 36%;
}
.list_service li .photo_inner{ box-shadow: -10px -10px 0 #5c9aa2;}
.list_service.reverse li .photo_inner{ box-shadow: 10px -10px 0 #5c9aa2;}
.after .list_service li .photo_inner{ box-shadow: -10px -10px 0 #a56683;}
.before .list_service li .photo_inner{ box-shadow: 10px -10px 0 #00698e;}
}


@media screen and (max-width: 767px) {
.list_service li.photo,
.list_service.reverse li.photo{
	width: 80%;
	margin: 0 auto;
	order: 1;
}
.list_service li.txt,
.list_service.reverse li.txt{
	width: 90%;
	margin: 0 auto 0;
	padding: 7% 0 0;
	order: 2;
}
.list_service li.txt i{
	width: 90px;
}
}



/* 
line01
line02
************************************/
.line01{
	border-top: 1px solid #ff6600;
	transform: skewY(8deg);
}
.line02{
	border-top: 1px solid #ff6600;
	transform: skewY(-8deg);
}




/*********************************************************************************

下層ページに関わるcss
id="sec_underLayer"

*********************************************************************************/
p.status{
	position: relative;
	color: #fff;
	font-weight: 600;
	text-align: center;
	padding: 0;
	margin: 0 0 50px;
	line-height: 90px;
}
p.status span{
	position: relative;
	z-index: 1;
}
p.status:after{
	position: absolute;
	z-index: 0;
	top: 0;
	left: 50%;
	content: "";
	width: 90px;
	height: 90px;
	margin: 0 0 0 -45px;
	background-color: #5c9aa2;
	transform:rotate(45deg);
	box-shadow: 10px -10px 0 rgba(92,154,162,0.2);
}

.support p.status:after{
	background-color: #00698e;
	box-shadow: 10px -10px 0 rgba(0,105,142,0.2);
}
.customer p.status:after{
	background-color: #a56683;
	box-shadow: 10px -10px 0 rgba(0165,102,131,0.2);
}

@media screen and (max-width: 767px) {
p.status{
	font-size: 1.3rem;
	font-size: 13px;
	margin: 40px 0 30px;
	line-height: 60px;
}
p.status:after{
	width: 60px;
	height: 60px;
	margin: 0 0 0 -30px;
	box-shadow: 5px -5px 0 rgba(92,154,162,0.2);
}
.support p.status:after{
	box-shadow: 5px -5px 0 rgba(0,105,142,0.2);
}
}



#sec_underLayer{

}


/**********************************
nav_service
**********************************/
nav.snav_service{

}
nav.snav_service ul{
	display: flex;
	justify-content: space-between;
	flex-flow: wrap;
	align-items: stretch;
	border-top: 1px solid #ccc;
}

nav.snav_service ul li{
	position: relative;
	display: flex;
	flex-basis: 25%;
	text-align: center;
	font-size: 1.6rem;
	font-size: 16px;
}

nav.snav_service ul li:after{
	position: absolute;
	content: "";
	top: 0;
	left: 0;
	width: 1px;
	height: 100%;
	background-color: #ccc;
}

nav.snav_service ul li a{
	display: block;
	width: 100%;
	font-weight: 500;
	color: #000;
	padding: 20px 0;
}
nav.snav_service ul li a .en{
	display: block;
	font-family: 'Aldrich', sans-serif;
	font-weight: 400;
	font-size: 1.0rem;
	font-size: 10px;
	color: #999;
	margin-top: 5px;
	transition: all .3s linear;
}

nav.snav_service ul li a:hover,
nav.snav_service ul li.active a{
	color: #fff;
	background-color: #ff6600;
}
nav.snav_service ul li a:hover .en,
nav.snav_service ul li.active a .en{
	color: #fff;
	transition: all .3s linear;
}

nav.snav_service ul li a .icon{
	display: block;
	width: 60px;
	height: 60px;
	margin: 0 auto 10px;
	background: top center no-repeat;
	background-size: 60px 60px;
	transition: all .3s linear;
}

nav.snav_service ul li.snav_dispatch a .icon{
	background-image: url("../img/snav_icon/snav_icon_dispach_a.svg");
}
nav.snav_service ul li.snav_dispatch.active a .icon,
nav.snav_service ul li.snav_dispatch a:hover .icon{
	background-image: url("../img/snav_icon/snav_icon_dispach_h.svg");
}

nav.snav_service ul li.snav_training a .icon{
	background-image: url("../img/snav_icon/snav_icon_training_a.svg");
}
nav.snav_service ul li.snav_training.active a .icon,
nav.snav_service ul li.snav_training a:hover .icon{
	background-image: url("../img/snav_icon/snav_icon_training_h.svg");
}

nav.snav_service ul li.snav_support a .icon{
	background-image: url("../img/snav_icon/snav_icon_support_a.svg");
}
nav.snav_service ul li.snav_support.active a .icon,
nav.snav_service ul li.snav_support a:hover .icon{
	background-image: url("../img/snav_icon/snav_icon_support_h.svg");
}

nav.snav_service ul li.snav_customer a .icon{
	background-image: url("../img/snav_icon/snav_icon_customer_a.svg");
}
nav.snav_service ul li.snav_customer.active a .icon,
nav.snav_service ul li.snav_customer a:hover .icon{
	background-image: url("../img/snav_icon/snav_icon_customer_h.svg");
}


@media screen and (max-width: 767px) {
nav.snav_service ul{
	border-top: none;
}
nav.snav_service ul li{
	flex-basis: 50%;
	font-size: 1.3rem;
	font-size: 13px;
	border-top: 1px solid #ccc;
}
nav.snav_service ul li a .icon{
	width: 40px;
	height: 40px;
	background-size: 40px 40px;
}
}


/**********************************
h2〜
**********************************/

h2.h2_under{
	font-size: 3.0rem;
	font-size: 30px;
	font-weight: 600;
	text-align: center;
	margin-bottom: 1em;
}

h3.h3_course{
	font-size: 2.4rem;
	font-size: 24px;
	font-weight: 600;
	color: #ff6600;
	margin-bottom: 0.8em;
}
h3.h3_csc{
	font-size: 3.0rem;
	font-size: 30px;
	font-weight: 600;
	color: #ff6600;
	text-align: center;
	margin-bottom: 0.8em;
}
h4.h4_trouble{
	font-size: 2.2rem;
	font-size: 22px;
	font-weight: 600;
	margin-bottom: 0.5em;
	vertical-align: text-bottom;
}
h4.h4_trouble .en{
	display: inline-block;
	font-family: 'Aldrich', sans-serif;
	font-size: 2.0rem;
	font-size: 20px;
	font-weight: 400;
	color: #fff;
	line-height: 34px;
	text-align: center;
	background-color: #000;
	padding: 0;
	margin: 0 10px 0 0;
	width: 30px;
	height: 30px;
	border-radius: 2px;
	vertical-align: text-bottom;
}

.caseA h4.h4_trouble{ color: #ff6600;}
.caseA h4.h4_trouble .en{ background-color: #ff6600;}


h4.h4_csc{
	font-size: 2.4rem;
	font-size: 24px;
	font-weight: 600;
	color: #009944;
	text-align: center;
	margin-bottom: 0.4em;
}
.si h4.h4_csc{
	color: #0068b7;
}
h5.h5_csc{
	font-size: 1.8rem;
	font-size: 18px;
	font-weight: 600;
	color: #fff;
	text-align: center;
	height: 34px;
	line-height: 34px;
	background-color: #009944;
	border-radius: 17px;
	margin-bottom: 0.8em;
}
.si h5.h5_csc{
	background-color: #0068b7;
}

@media screen and (max-width: 979px) {
h4.h4_csc{
	font-size: 2.0rem;
	font-size: 20px;
}
h5.h5_csc{
	font-size: 1.5rem;
	font-size: 15px;
}
}

@media screen and (max-width: 767px) {
h2.h2_under{
	font-size: 2.0rem;
	font-size: 20px;
}
h3.h3_course{
	font-size: 1.8rem;
	font-size: 18px;
}
h3.h3_csc{
	font-size: 1.8rem;
	font-size: 18px;
}
h4.h4_trouble{
	font-size: 1.6rem;
	font-size: 16px;
}
h4.h4_trouble .en{
	font-size: 1.6rem;
	font-size: 16px;
	line-height: 27px;
	margin: 0 6px 0 0;
	width: 24px;
	height: 24px;
}
h4.h4_csc{
	font-size: 1.6rem;
	font-size: 16px;
}
h5.h5_csc{
	font-size: 1.2rem;
	font-size: 12px;
}
}


/* point_wrap ************************************/
.point_wrap{
	margin: 8% 0 0;
	padding: 8% 0;
	background-color: #5c9aa2;
}
.support .point_wrap{ background-color: #00698e;}
.customer .point_wrap{ background-color: #a56683;}

.point_box{
	display: flex;
	justify-content: space-between;
	flex-flow: wrap;
	
}
.point_box_l{
	width: 38.1944444444%;
	margin:0 0 0 8.333333%; 
	align-self: center;
}
.point_box_r{
	width: 50.6944444444%;
	align-self: center;
}
.point_box_r img{
	width: 100%;
	height: auto;
}

.point_box_r #slide_photo{
	padding: 65.7894736% 0 0;
	box-shadow: 20px -20px 0 rgba(0,0,0,0.2);
	background-color: #000;
}

@media screen and (max-width: 1119px) {
.point_box_l{
	margin:0 0 0 5%; 
}
}


@media screen and (max-width: 979px) {
.point_wrap{
	margin: 25% 0 0;
	padding: 0 0 8%;
	background-color: #5c9aa2;
}
.point_box_l{
	width: 90%;
	align-self: top;
	margin:0 auto; 
	order: 2;
}
.point_box_r{
	width: 70%;
	align-self: top;
	margin: -15% auto 50px;
	order: 1;
}
.point_box_r #slide_photo{
	box-shadow: 10px -10px 0 rgba(0,0,0,0.2);
}
}



/* list_point ************************************/
.list_point{
	
}

.list_point li{
	position: relative;
	display: block;
	font-size: 1.8rem;
	font-size: 18px;
	font-weight: 500;
	color: #5c9aa2;
	background-color: #fff;	
	padding: 30px  10px 20px;
	margin: 0 0 40px;
}
.support .list_point li{ color: #00698e;}
.customer .list_point li{ color: #a56683;}

.list_point li:last-child{
	margin: 0 0 0;
}

.list_point li .point_ttl{
	position: absolute;
	top: -20px;
	left: -10px;
	font-family: 'Aldrich', sans-serif;
	font-weight: 400;
	font-size: 1.0rem;
	font-size: 10px;
	color: #fff;
	text-align: center;
	width: 60px;
	height: 60px;
}
.list_point li .point_ttl span{
	position: relative;
	z-index: 1;
}
.list_point li .point_ttl .num{
	display: block;
	font-size: 180%;
}
.list_point li .point_ttl:after{
	position: absolute;
	z-index: 0;
	top: 10px;
	left: 0;
	content: "";
	width: 0;
	height: 30px;
	border: 30px solid;
	border-color: #5c9aa2 transparent transparent transparent;
}

.support .list_point li .point_ttl:after{ border-color: #00698e transparent transparent transparent;}
.customer .list_point li .point_ttl:after{ border-color: #a56683 transparent transparent transparent;}

@media screen and (max-width: 979px) {
.list_point li{
	font-size: 1.6rem;
	font-size: 16px;
}
}


/* box_contact ************************************/
.box_contact_wrap{
	padding-bottom: 8%;
}
.box_contact{	
	display: flex;
	justify-content: space-between;
	flex-flow: wrap;
	border: 1px solid #000;
	padding: 30px 20px 40px;
	background-color: #fff;
	box-shadow: -10px -10px 0 #000, 10px 10px 0 #ff6600;
}
.box_contact dt{
	width:calc(100% - 280px); 
	align-self: center;
	text-align: center;
	font-size: 1.6rem;
	font-size: 16px;
}
.box_contact dd{
	width: 260px;
	align-self: center;
}


@media screen and (max-width: 767px) {
.box_contact_wrap{
	padding-bottom: 12%;
}
.box_contact{	
	padding: 30px 10px 30px;
	box-shadow: -5px -5px 0 #000, 5px 5px 0 #ff6600;
}
.box_contact dt{
	width:100%; 
	font-size: 1.4rem;
	font-size: 14px;
	text-align: justify;
}
.box_contact dt .resp_autowrap{
	display: inline;
}
.box_contact dd{
	margin: 0 auto;
}
}


/* btn_txt_contact ***************************************/
.btn_txt_contact{
	margin: 20px 0 0;
}
.btn_txt_contact a{
	display: inline-block;
	font-family: 'Aldrich', sans-serif;
	font-weight: 400;
	font-size: 1.8rem;
	font-size: 18px;
	text-align: center;
	color: #fff;
	border: 1px solid #ff6600;
	width: 250px;
	padding: 20px 0 15px;
	background: #ff6600 url("../../shareobject/img/btn_arrow_fff.svg") 92% center no-repeat;
	background-size: 25px auto;
}
.btn_txt_contact a:hover{
	color: #fff;
	background: #000 url("../../shareobject/img/btn_arrow_fff.svg") 97% center no-repeat;
	background-size: 25px auto;
}

@media screen and (max-width: 767px) {
.btn_txt_contact a{
	font-size: 1.4rem;
	font-size: 14px;
	width: 100%;
	padding: 20px 0 15px;
	background: #ff6600 url("../../shareobject/img/btn_arrow_fff.svg") 92% center no-repeat;
	background-size: 25px auto;
}
}



/**********************************

.dispatch = 技術派遣

**********************************/
.dispatch_wrap{
	padding: 8% 0;
}

.dispatch_step{
	background-color: #fceadc;
	padding: 10px 0 20px;
	margin: 4% 0 0;
}
.dispatch_step .step_ttl{
	display: inline-block;
	margin: 0 0 20px -10px;
	width: 320px;
	height: 78px;
	text-align: left;
}
.dispatch_step .step_ttl img{
	width: 320px;
	height: 78px;
}
.dispatch_step .step_img{
	margin: 0 20px;
}
.dispatch_step .step_img img{
	width: 100%;
	max-width: 1160px;
	height: auto;
}

.dispatch_step .cap10.sp{
	display: none;
}

@media screen and (max-width: 767px) {
.dispatch_wrap{
	padding: 12% 0;
}
.dispatch_step .step_ttl{
	margin: 0 0 20px -7.5px;
	width: 240px;
	height: 58px;
}
.dispatch_step .step_ttl img{
	width: 240px;
	height: 58px;
}


.dispatch_step .step_img{
	padding: 0 0 10px;
	margin: 0;
	width: 100%;
	max-width: 700px;
	 overflow-x: auto;
     /* white-space: nowrap;*/
     -webkit-overflow-scrolling: touch;
}
.dispatch_step .step_img_inner{
	width: 700px;
	padding: 0 10px 10px;
}
.dispatch_step .cap10.sp{
	display: block;
	padding: 0 0 20px 10px;
}
}




/**********************************

.training = 教育訓練

**********************************/
.training_wrap{
	padding: 8% 0;
}

@media screen and (max-width: 767px) {
.training_wrap{
	padding: 12% 0;
}
}


/* nav_course ***************************************/
.training_wrap .nav_course{
	display: flex;
	justify-content: space-between;
	flex-flow: wrap;
	margin: 4% 0 0;
}
.training_wrap .nav_course li{
	display: flex;
	position: relative;
	flex-basis: 24%;
	margin: 0 0 2% 0;
	text-align: center;
}
.training_wrap .nav_course li a{
	display: block;
	width: 100%;
	font-size: 1.6rem;
	font-size: 16px;
	font-weight: 500;
	border: 1px solid #ff6600;
	padding: 20px 0 30px;
	align-self: stretch;
}
.training_wrap .nav_course li a:hover{
	background-color: #ff6600;
	color: #fff;
}

.training_wrap .nav_course li a:after{
	content: "";
	position: absolute;
	z-index: 1;
	bottom: 15px;
	left: 50%;
	width: 6px;
	height: 6px;
	margin: 0 0 0 -3px;
	border: 1px solid;
	border-color: transparent transparent #000 #000;
	transform: rotate(-45deg);
	transition: all .3s linear;
}
.training_wrap .nav_course li a:hover:after{
	bottom: 10px;
	border-color: transparent transparent #fff #fff;
}

@media screen and (max-width: 767px) {
.training_wrap .nav_course li{
	flex-basis: 49%;
}
.training_wrap .nav_course li a{
	font-size: 1.3rem;
	font-size: 13px;
	padding: 13px 0 20px;
}
.training_wrap .nav_course li a:after{
	bottom: 8px;
}
.training_wrap .nav_course li a:hover:after{
	bottom: 5px;
}
}


/* wrap_course ***************************************/
.wrap_course{
	padding: 5% 0;
}

@media screen and (max-width: 767px) {
.wrap_course{
	padding: 8% 0;
}
}


/* float_course ***************************************/
.float_course{
	border: 1px solid #ccc;
}
.float_course tr:nth-child(2n){
	background-color: #f2f2f2;
}
.float_course th{
	width: 100px;
	vertical-align: middle;
	font-size: 1.6rem;
	font-size: 16px;
	text-align: center;
	color: #fff;
	padding: 20px 10px;
	background-color: #000;
}
.float_course tr:nth-child(2n) th{
	background-color: #333;
}
.float_course th .big{
	font-size: 150%;
	padding-left: 5px;
}
.float_course td{
	vertical-align: middle;
	padding: 20px 10px;
	border-right: 1px solid #ccc;
	font-size: 1.4rem;
	font-size: 14px;
}
.float_course td.ttl{
	width: 300px;
	font-size: 1.8rem;
	font-size: 18px;
	font-weight: 500;
	text-align: center;
}
.float_course td .cap12{
	display: block;
	margin-top: 10px;
}

@media screen and (max-width: 979px) {
.float_course th{
	width: 80px;
	font-size: 1.4rem;
	font-size: 14px;
}
.float_course td.ttl{
	width: 200px;
	font-size: 1.6rem;
	font-size: 16px;
}
}

@media screen and (max-width: 767px) {
.float_course{
}
.float_course tr:nth-child(2n){
	background-color: #fff;
}
.float_course th{
	display: block;
	width: auto;
	font-size: 1.2rem;
	font-size: 12px;
	padding: 8px 10px;
}.float_course tr:nth-child(2n) th{
	background-color: #000;
}
.float_course td{
	display: block;
	padding: 20px 10px;
	border: none;
	font-size: 1.2rem;
	font-size: 12px;
}
.float_course td.ttl{
	width: auto;
	padding: 10px 10px;
	background-color: #e5e5e5;
}
}



/* list_digest ***************************************/
.list_digest{

}
.list_digest li{
	position: relative;
	font-size: 1.4rem;
	font-size: 14px;
	padding: 5px 0 5px 10px;
}
.list_digest li:before{
	content: "";
	position: absolute;
	top: 13px;
	left: 0;
	width: 7px;
	height: 7px;
	background-color: #ff6600;
	border-radius: 50%;
}

@media screen and (max-width: 767px) {
.list_digest li{
	font-size: 1.2rem;
	font-size: 12px;
	padding: 3px 0 3px 8px;
}
.list_digest li:before{
	top: 12px;
	left: 0;
	width: 5px;
	height: 5px;
}
}



/**********************************

.support = 導入サポート

**********************************/
.support_wrap{
	padding: 8% 0;
}

@media screen and (max-width: 767px) {
.support_wrap{
	padding: 12% 0;
}
}

/* wrap_thinking ***************************************/
.wrap_thinking{
	padding: 5% 0;
}

@media screen and (max-width: 767px) {
.wrap_thinking{
	padding: 8% 0;
}
}



/* float_thinking ***************************************/
.float_thinking{
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
	border: 1px solid #ccc;
}
.float_thinking tr:nth-child(2n){
	background-color: #f2f2f2;
}
.float_thinking th{
	width: 100px;
	vertical-align: middle;
	font-size: 1.6rem;
	font-size: 16px;
	text-align: center;
	color: #fff;
	padding: 20px 0;
	background-color: #000;
}
.float_thinking tr:nth-child(2n) th{
	background-color: #333;
}

.float_thinking td{
	vertical-align: middle;
	padding: 20px 5px;
	border-right: 1px solid #ccc;
	font-size: 1.6rem;
	font-size: 16px;
	text-align: center;
}
.float_thinking td.ttl{
	font-size: 2.0rem;
	font-size: 20px;
	font-weight: 600;
}
.float_thinking td.ttl02{
	font-size: 2.4rem;
	font-size: 24px;
	font-weight: 600;
	color: #ff6600;
}

.float_thinking td .icon_robot{


	width: 100%;
	max-width: 220px;
	margin: 15px auto 0;
}
.float_thinking td .icon_robot img{
	width: 220px;
	height: auto;
}

@media screen and (max-width: 767px) {
.float_thinking{
}

.float_thinking th{
	width: 60px;
	font-size: 1.2rem;
	font-size: 12px;
}
.float_thinking td{
	font-size: 1.2rem;
	font-size: 12px;
}
.float_thinking td.ttl{
	font-size: 1.4rem;
	font-size: 14px;
}
.float_thinking td.ttl02{
	font-size: 1.6em;
	font-size: 16px;
}
}



/* wrap_collabo ***************************************/
.wrap_collabo{
	padding: 8% 0;
}

@media screen and (max-width: 767px) {
.wrap_collabo{
	padding: 12% 0;
}
}


/* support_set ***************************************/
.support_set{
	background-color: #fceadc;
	padding: 10px 0 0;
	margin: 4% 0 0;
}
.support_set .set_ttl{
	display: inline-block;
	margin: 0 0 20px -10px;
	width: 610px;
	height: 78px;
	text-align: left;
}
.support_set .set_ttl img{
	width: 610px;
	height: 78px;
}
.support_set .set_ttl img.sp{
	display: none;
}

.support_set .set_img{
	margin: 0 0 0;
	background-color: #fff;
}
.support_set .set_img img{
	width: 100%;
	max-width: 1200px;
	height: auto;
}


.support_set .cap10.sp{
	display: none;
}

@media screen and (max-width: 767px) {
.support_set .set_ttl{
	margin: 0 0 20px -7.5px;
	width: 250px;
	height: 110px;
}
.support_set .set_ttl img.pc{
	display: none;
}
.support_set .set_ttl img.sp{
	display: block;
}
.support_set .set_ttl img{
	width: 250px;
	height: 110px;
}

.support_set .set_img{
	padding: 0 0 20px;
	margin: 0;
	width: 100%;
	max-width: 800px;
	 overflow-x: auto;
     /* white-space: nowrap;*/
     -webkit-overflow-scrolling: touch;
}
.support_set .set_img_inner{
	width: 800px;
	padding: 0 0 0;
}
.support_set .cap10.sp{
	display: block;
	padding: 0 0 20px 10px;
}
}


/* wrap_industrial ***************************************/
.wrap_industrial{
	padding: 8% 0;
}

@media screen and (max-width: 767px) {
.wrap_industrial{
	padding: 12% 0;
}
}




/* support_speed ***************************************/
.support_speed{
	padding: 10px 0 0;
	margin: 4% 0 0;
}
.support_speed .speed_img{
	margin: 0 0 0;
}
.support_speed .speed_img img{
	width: 100%;
	max-width: 1200px;
	height: auto;
}
.support_speed .cap10.sp{
	display: none;
}

@media screen and (max-width: 767px) {
.support_speed .speed_img{
	padding: 0 0 20px;
	margin: 0;
	width: 100%;
	max-width: 800px;
	 overflow-x: auto;
     /* white-space: nowrap;*/
     -webkit-overflow-scrolling: touch;
}
.support_speed .speed_img_inner{
	width: 800px;
	padding: 0 0 0;
}
.support_speed .cap10.sp{
	display: block;
	padding: 0 0 20px 0;
}
}


/**********************************

.customer = カスタマーサービス

**********************************/
.customer_wrap{
	padding: 8% 0;
}

@media screen and (max-width: 767px) {
.customer_wrap{
	padding: 12% 0;
}
}

/* wrap_trouble ***************************************/
.wrap_trouble{
	padding: 5% 0;
}

@media screen and (max-width: 767px) {
.wrap_trouble{
	padding: 8% 0;
}
}

/* trouble_img ***************************************/
.trouble_img{
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
}
.trouble_img img{
	width: 960px;
	height: auto;
}


/* 
caseA
caseB
***************************************/
.caseA,
.caseB{
	padding: 8% 0 0;
}
.reduction_img{
	width: 100%;
	max-width: 860px;

}
.reduction_img img{
	width: 860px;
	height: auto;
}
.reduction_img img.pc{}
.reduction_img img.sp{ display: none;}

@media screen and (max-width: 767px) {
.caseA,
.caseB{
	padding: 12% 0 0;
}

.reduction_img img{
	width: 500px;
	height: auto;
}
.reduction_img img.pc{ display: none;}
.reduction_img img.sp{ display: block;}
}


/* float_case ***************************************/
.float_case{
	font-size: 1.4rem;
	font-size: 14px;
	border: 1px solid #ccc;
}
.float_case tr:nth-child(2n){
	background-color: #f2f2f2;
}
.float_case th{
	width: 300px;
	padding: 20px 10px;
	text-align: center;
	border-right: 1px solid #ccc;
}
.float_case td{
	padding: 20px 10px;
	text-align: left;
}

.float_case th.ttl,
.float_case td.ttl{
	color: #fff;
	text-align: center;
	background-color: #000;
}

@media screen and (max-width: 767px) {
.float_case{
	font-size: 1.2rem;
	font-size: 12px;
}
.float_case th{
	width: 100px;
	padding: 20px 0;
}
.float_case th.ttl,
.float_case td.ttl{
	padding: 10px 0;
}
}

/* wrap_csc ***************************************/
.wrap_csc{
	margin: 5% 0 0;
	padding: 5% 0;
	background: #fceadc url("../customer/img/bg_csc.svg") top center repeat;
	background-size: 280px 280px;
}
i.icon_csc{
	display: block;
	width: 100%;
	max-width: 160px;
	margin: 0 auto 3%;
}
i.icon_csc img{
	width: 160px;
	height: auto;
}

@media screen and (max-width: 767px) {
.wrap_csc{
	padding: 8% 0;
	background-size: 140px 140px;
}
i.icon_csc{
	width: 30%;
}
}



/* list_csc ***************************************/
.list_csc{
	display: flex;
	justify-content: space-between;
	flex-flow: wrap;
}
.list_csc > li{
	width: 100%;
	padding: 30px 0;
	border-radius: 10px;
	background-color: #fff;
	margin: 4% 0 0;
}

.list_csc > li.portal{
	width: 48%;
}
.list_csc > li .inner{
	padding: 0 20px;
}

.list_csc > li .inner ul{
	margin: 20px 0 0;
}
.list_csc > li .inner ul li{
	position: relative;
	font-size: 1.4rem;
	font-size: 14px;
	padding: 3px 0 3px 8px;
}
.list_csc > li .inner ul li:before{
	content: "";
	position: absolute;
	top: 11px;
	left: 0;
	width: 5px;
	height: 5px;
	background-color: #009944;
}

.list_csc > li.si .inner ul li:before{
	background-color: #0068b7;
}

.list_csc > li .inner ul li .figure_csc{
	width: 100%;
	max-width: 1140px;
	margin: 0 auto;
}
.list_csc > li .inner ul li .figure_csc img{
	width: 1140px;
	height: auto;
}

@media screen and (max-width: 767px) {
.list_csc > li{
	padding: 20px 0;
}
.list_csc > li.portal{
	width: 100%;
}
.list_csc > li .inner{
	padding: 0 10px;
}
.list_csc > li .inner ul li{
	font-size: 1.2rem;
	font-size: 12px;
}
.list_csc > li .inner ul li:before{
	top: 9px;
}
}





/*************************************************************************************
*************************************************************************************

print

*************************************************************************************
**************************************************************************************/

@media print{

}