@charset "utf-8";
/* CSS Document */


/*sidenavi*/
/*.case #sidenavi li.current-cat p{
	background: #00437a;
}

.case #sidenavi li ul li.current-cat:after{
	-webkit-transform: translateY(100%);
    transform: translateY(100%);
    visibility: visible;
}*/

.category #sidenavi li.sn00 p,
.detail #sidenavi li.sn00 p,
.case01 #sidenavi li.sn14 p,
.case02 #sidenavi li.sn14 p,
.flow #sidenavi li.sn20 p{
    background: #68a3d2;
}

.category #sidenavi li.sn01:after,
.detail #sidenavi li.sn01:after,
.case01 #sidenavi li ul li.sn15:after,
.case02 #sidenavi li ul li.sn16:after{
    -webkit-transform: translateY(0);
    transform: translateY(0);
    visibility: visible;
}

.container {
	padding-bottom: 0;
}
.mv {
	background: url(/business/img/petroleum_mv_pc.jpg) no-repeat top center;
	background-size: cover;
}
.mv .inner {
	width: 1200px;
	margin: 0 auto;
	position: relative;
	padding: 75px 0;
}
.mv .inner::after {
	content: "";
	display: block;
	width: 60px;
	border-bottom: 4px solid #0060af;
	position: absolute;
	bottom: 0;
	left: 0;
}
.mv h1 {
	width: 870px;
	font-size: 36px;
	font-weight: 600;
	color: #ffffff;
}
.mv h1 span {
	font-family: "Montserrat";
	font-size: 16px;
	font-weight: bold;
	display: block;
}
.container .inner {
	width: 1200px;
	margin: 0 auto;
}
.container .inner h2 {
	font-size: 30px;
	color: #000000;
	font-weight: 600;
	border-left: 4px solid #0060af;
	padding: 0 0 0 20px;
	margin-bottom: 40px;
}


/* business index*/

.business  .mv {
	background: url(/business/img/business_mv_pc.jpg) no-repeat top center;
	background-size: cover;
	height: 220px;
   margin-bottom: 80px;
   position: relative;
}
.business .mv::after {
	content: "";
	display: block;
	width: 60px;
	border-bottom: 4px solid #0060af;
	position: absolute;
	bottom: 0;
	left: 50%;
	-ms-transform: translate(-50%, 0%);
	-webkit-transform: translate(-50%, 0%);
	transform: translate(-50%, 0);
}
.business .mv h1 {
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	margin: 0;
	padding: 0;
	font-size: 36px;
	font-weight: 600;
	color: #ffffff;
	text-align: center;
	width: 100%;
}
.business .mv h1 span {
	font-family: Montserrat, "sans-serif";
	font-size: 16px;
	font-weight: bold;
	display: block;
}
.business .container{
	padding-bottom: 70px;
}
.business .comment{
	background: #f1f2f3;
	padding: 20px;
	margin-bottom: 80px;
}

.business .comment p{
	font-size: 18px;
	font-weight: 600;
	color: #0060af;
	text-align: center;
	line-height: 2;
}
.business .businessBlock{	
	padding-bottom: 100px;
}
.business .businessBlock h2{
	float: left;
	margin-bottom: 30px;
}
.business .businessBlock h2 span{
    font-family: Montserrat, "sans-serif";
    font-size: 12px;
    color: #0060af;
    font-weight: bold;
    display: block;	
}
.business .businessBlock .img{
	 float: right;
    width: 580px;
}
.business .businessBlock .img img{
	 width: 100%;
    height: auto;
}
.business .businessBlock .businessDetail{
	float: left;
	width: 585px;
}
.business .businessBlock .businessDetail p{
	font-size: 15px;
	font-weight: 300;
	color: #333333;
	line-height: 2;
	margin-bottom: 30px;
}
.business .businessBlock .businessDetail .btn{
	background: #0060af;
	width: 350px;
	position: relative;
	cursor: pointer;
	margin-bottom: 20px;
}
.business .businessBlock .businessDetail .btn:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(255, 255, 255, 0.1);
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
}
.business .businessBlock .businessDetail .btn:hover:after {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	visibility: visible;
}
.business .businessBlock .businessDetail .btn a {
	display: block;
	font-size: 16px;
	color: #ffffff;
	font-weight: 600;
	padding: 5px 0;
	position: relative;
	line-height: 50px;
	text-align: center;
	z-index: 2;
}
.business .businessBlock .businessDetail .btn a::before, .business .businessBlock .businessDetail .btn a::after {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 20px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.business .businessBlock .businessDetail .btn a::before {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #ffffff;
}
.business .businessBlock .businessDetail .btn a::after {
	right: 21px;
	box-sizing: border-box;
	width: 5px;
	height: 7px;
	border: 3px solid transparent;
	border-left: 5px solid #0d68b3;
}

.business .businessBlock .businessDetail ul li+li{
	padding-top: 10px;
}
.business .businessBlock .businessDetail ul li a {
	padding: 0px 0 0 30px;
	position: relative;
	font-size: 14px;
	font-weight: 300;
	color: #333333;
}
.business .businessBlock .businessDetail ul li a:hover{
	opacity:.7;
}

.business .businessBlock .businessDetail ul li a::before, .business .businessBlock .businessDetail ul li a::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.business .businessBlock .businessDetail ul li a::before {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #0d68b3;
}
.business .businessBlock .businessDetail ul li a::after {
	left: 5px;
	box-sizing: border-box;
	width: 5px;
	height: 7px;
	border: 3px solid transparent;
	border-left: 5px solid #ffffff;
}




/* petroleum index*/

.index .mv{
	height: 220px;
	margin-bottom: 80px;
	position: relative;
}
.index .mv::after {
	content: "";
	display: block;
	width: 60px;
	border-bottom: 4px solid #0060af;
	position: absolute;
	bottom: 0;
	left: 50%;
	-ms-transform: translate(-50%, 0%);
	-webkit-transform: translate(-50%, 0%);
	transform: translate(-50%, 0);
}
.index .mv h1 {
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: center;
	width: 100%;
}

.index .topimg {
	background: url(/business/img/index_topimg_pc.jpg) no-repeat center left;
	background-size: cover;
	height: 320px;
	margin-bottom: 80px;
	padding-left: 60px;
	padding-top: 80px;
}
.index .container .topimg p {color: #ffffff;}

.businessBlock h3,
.index h3 {
	clear: both;
	background: #f1f2f3;
	font-size: 20px;
	font-weight: 600;
	color: #0060af;
	line-height: 1.5;
	padding: 20px;
	margin-bottom: 30px;
}
.index .container p {
	font-size: 15px;
	font-weight: 300;
	color: #333333;
	margin-bottom: 40px;
	line-height: 2;
}
/*============================
#anchorLink
============================*/
.index #anchorLink {
	margin-bottom: 75px;
}
.index #anchorLink ul {
	font-size: 0;
}
.index #anchorLink ul li {
	cursor: pointer;
	position: relative;
	overflow: hidden;
	width: 290px;
	border: 1px solid #0060af;
	display: inline-block;
}
.index #anchorLink ul li+li {
	margin-left: 10px;
}
.index #anchorLink ul li:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #f1f2f3;
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
}
.index #anchorLink ul li:hover:after {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	visibility: visible;
	border-bottom: solid 1px #ffffff;
}
.index #anchorLink ul li a {
	position: relative;
	display: block;
	font-size: 15px;
	font-weight: 600;
	color: #0060af;
	text-align: center;
	z-index: 2;
	padding: 15px 0;
}
.index #anchorLink ul li a:after, .index #anchorLink ul li a:before {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 25px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.index #anchorLink ul li a:after {
	right: 29px;
	top: 3px;
	box-sizing: border-box;
	width: 7px;
	height: 5px;
	border: 3px solid transparent;
	border-top: 5px solid #ffffff;
}
.index #anchorLink ul li a:before {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #0d68b3;
}


/*============================
#elect
============================*/
.index #elect {
	margin-bottom: 60px;
	margin-top: -100px;
	padding-top: 100px;
}
.index #elect h2 {
}
.index #elect ul {
	/* padding-bottom: 30px; */
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.index #elect ul li {
	width: 500px;
	background: #f1f2f3;
	margin-bottom: 40px;
	padding: 0 40px;
	margin-top: 60px;
}
.index #elect ul li:nth-child(even) {
	margin-left: 40px;
}
.index #elect ul li img {
	width: 500px;
	height: auto;
	margin-bottom: -25px;
	margin-top: -60px;
}
.index #elect ul li span {
	color: #ffffff;
	text-align: center;
	background: #0060af;
	width: 60px;
	padding: 15px 0;
	position: relative;
	font-family: Montserrat, "sans-serif";
	font-size: 24px;
	font-weight: bold;
	display: block;
	margin: 0 auto;
}
.index #elect ul li h3 {
	margin-bottom: 0;
	background: none;
	text-align: center;
	padding: 30px 0 20px;
}
.index #elect ul li p {
	font-size: 14px;
	letter-spacing: -0.06em;
}


.petroleum.detail #elect {
	margin-bottom: 60px;
	margin-top: -100px;
	padding-top: 100px;
}
.petroleum.detail #elect h2 {
}
.petroleum.detail #elect ul {
	/* padding-bottom: 30px; */
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.petroleum.detail #elect ul li {
	width: 280px;
	background: #f1f2f3;
	margin-bottom: 40px;
	padding: 0 40px;
	margin-top: 0px;
}
.petroleum.detail #elect ul li:nth-child(even) {
	margin-left: 40px;
}

.petroleum.detail #elect ul li:nth-child(3) {
	margin-left: 40px;
}


.petroleum.detail #elect ul li img {
	width: 280px;
	height: auto;
	margin-bottom: -25px;
	margin-top: -60px;
}
.petroleum.detail #elect ul li span {
	color: #ffffff;
	text-align: center;
	background: #0060af;
	width: 60px;
	padding: 6px 0;
	position: relative;
	font-family: Montserrat, "sans-serif";
	font-size: 16px;
	font-weight: bold;
	display: block;
	margin: 0 auto;
}

.petroleum.detail #elect ul li a {
	text-decoration: underline;;
}

.petroleum.detail #elect ul li h3 {
	margin-bottom: 0;
	background: none;
	text-align: center;
	padding: 14px 0 16px;
    font-size: 18px;
    font-weight: 600;
    color: #0060af;
    line-height: 1.5;	
}
.petroleum.detail #elect ul li p {
	font-size: 14px;
	letter-spacing: -0.06em;
font-weight: 300;
    color: #333333;
    margin-bottom: 40px;
    line-height: 1.5;	
}



/*============================
#service
============================*/
.index #service {
	margin-bottom: 100px;
	margin-top: -100px;
	padding-top: 100px;
}
.index #service h4 {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 20px;
}
.index #service h4 span img {
	width: 24px;
	height: auto;
	margin-right: 10px;
	vertical-align: middle;
}
.index #service ul {
	/* width: 830px; */
	margin: 0 auto;
	padding-bottom: 30px;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.index #service ul li {
	width: 290px;
	display: inline-block;
	vertical-align: middle;
	font-size: 14px;
	font-weight: 300;
	color: #333333;
	line-height: 1.6;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	border: solid 1px #dddddd;
	/* box-sizing: border-box; */
	margin-bottom: 10px;
	margin-right: 10px;
	height: 52px;
}
.index #service ul li:nth-child(4n) {
	margin-right: 0;
}
.index #service ul li a {
	display: block;
	padding: 15px 20px 15px 50px;
	position: relative;
	z-index: 2;
}
.index #service ul li:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #f1f2f3;
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
}
.index #service ul li:hover:after {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	visibility: visible;
	border-bottom: solid 1px #ffffff;
}
.index #service ul li a::before, .index #service ul li a::after {
	position: absolute;
	top: 0;
	bottom: 0;

	left: 25px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.index #service ul li a::before {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #0d68b3;
}
.index #service ul li a::after {
	left: 30px;
	box-sizing: border-box;
	width: 5px;
	height: 7px;
	border: 3px solid transparent;
	border-left: 5px solid #ffffff;
}




/*============================
#petro detail service
============================*/
.index #service {
	margin-bottom: 100px;
	margin-top: -100px;
	padding-top: 100px;
}
.index #service h4 {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 20px;
}
.index #service h4 span img {
	width: 24px;
	height: auto;
	margin-right: 10px;
	vertical-align: middle;
}
.index #service ul {
	/* width: 830px; */
	margin: 0 auto;
	padding-bottom: 30px;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.index #service ul li {
	width: 290px;
	display: inline-block;
	vertical-align: middle;
	font-size: 14px;
	font-weight: 300;
	color: #333333;
	line-height: 1.6;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	border: solid 1px #dddddd;
	/* box-sizing: border-box; */
	margin-bottom: 10px;
	margin-right: 10px;
	height: 52px;
}
.index #service ul li:nth-child(4n) {
	margin-right: 0;
}
.index #service ul li a {
	display: block;
	padding: 15px 20px 15px 50px;
	position: relative;
	z-index: 2;
}
.index #service ul li:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #f1f2f3;
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
}
.index #service ul li:hover:after {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	visibility: visible;
	border-bottom: solid 1px #ffffff;
}
.index #service ul li a::before, .index #service ul li a::after {
	position: absolute;
	top: 0;
	bottom: 0;

	left: 25px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.index #service ul li a::before {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #0d68b3;
}
.index #service ul li a::after {
	left: 30px;
	box-sizing: border-box;
	width: 5px;
	height: 7px;
	border: 3px solid transparent;
	border-left: 5px solid #ffffff;
}




/*============================
#case
============================*/
.index #case {
	margin-bottom: 100px;
	margin-top: -100px;
	padding-top: 100px;
}
.index #case ul {
	display: -webkit-box;
	display: -moz-box;
	display:
	-ms-flexbox;
	display: 
	-webkit-flex;
	display: 
	-moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	}
.index #case ul li {
	width: 580px;
	border: solid 1px #dddddd;
	box-sizing: border-box;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	padding: 10px;
	height: 92px;
	}
.index #case ul li:nth-child(even) {
	margin-left: 40px;
}
.index #case ul li:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #f1f2f3;
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
}
.index #case ul li:hover:after {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	visibility: visible;
	border-bottom: solid 1px #ffffff;
}
.index #case ul li a {
	display: block;
	padding: 0;
	position: relative;
	z-index: 2;
	top: 50%;
	left: 0;
	-ms-transform: translate(0, -50%);
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
}
.index #case ul li a::before, .index #case ul li a::after {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 25px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.index #case ul li a::before {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #0d68b3;
}
.index #case ul li a::after {
	right: 26px;
	box-sizing: border-box;
	width: 5px;
	height: 7px;
	border: 3px solid transparent;
	border-left: 5px solid #ffffff;
}
.index #case ul li dl {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.index #case ul li dl dt {
	font-size: 14px;
	font-weight: 300;
	color: #ffffff;
	text-align: center;
	background: #0060af;
	width: 70px;
	padding: 10px 0;
	position: relative;
}
.index #case ul li dl dt span {
	font-family: Montserrat, "sans-serif";
	font-size: 24px;
	font-weight: bold;
	display: block;
}
.index #case ul li dl dd {
	width: 460px;
	position: relative;
}
.index #case ul li dl dd p{
    position: absolute;
    top: 50%;
    left: 0;
    -ms-transform: translate(0%, -50%);
    -webkit-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
    margin-left: 20px;
    margin-bottom: 0;
}
/*============================
#sales
============================*/
.index #sales {
	margin-bottom: 100px;
	margin-top: -100px;
	padding-top: 100px;
}
.index #sales ul {
	padding-bottom: 30px;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.index #sales ul li {
	width: 580px;
}
.index #sales ul li:nth-child(even) {
	margin-left: 40px;
}
.index #sales ul li ul li {
	font-size: 14px;
	font-weight: 300;
	color: #333333;
	line-height: 2;
	padding-bottom: 10px;
	list-style-type: none;
	counter-increment: number;
	text-indent: -1em;
	margin-left: 1em !important;
}
.index #sales ul li ul li::before {
	content: counter(number) ".";
	margin-right: 5px;
	color: #0060af;
	font-family: Montserrat, "sans-serif";
	font-weight: bold;
}











/*============================
#main
============================*/
.category #main {
	padding-bottom: 180px;
}
.category #main table {
	width: 100%;
	table-layout: fixed;
}
.category #main table thead {
	background: #0060af;
	border-top: 1px solid #dddddd;
	/* width: 870px; */
}
.category #main table thead tr {
	/* display: inline-block; */
	/* width:  100%; */
	/* display: table-row; */
	font-size: 0;
	display: flex;
}
.category #main table thead tr th {
	color: #ffffff;
	font-size: 14px;
	font-weight: 600;
	padding: 18px 20px;
	/* display: inline-block; */
	width: 650px;
	box-sizing: border-box;
}
.category #main table thead tr th+th {
	border-left: 1px solid #dddddd;
	width: 220px;
	box-sizing: border-box;
}
.category #main table tbody {
	border-top: 4px solid #f1f2f3;
	border-bottom: 1px solid #dddddd;
	/* width: 870px; */
}
.category #main table tbody tr {
	border-top: 1px solid #dddddd;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	/* display: flex; */
	display: inline-block;
	width: 870px;
}
.category #main table tbody tr:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #f1f2f3;
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
	z-index: -1;
}
.category #main table tbody tr:hover:after {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	visibility: visible;
	z-index: 1;
}
.category #main table tbody tr td {
	font-size: 16px;
	font-weight: 600;
	/* position: static; */
	/* width: 630px; */
	position: relative;
	z-index: 2;
	/* display: block; */
}
.category #main table tbody tr td span {
	z-index: 2;
	width: 580px;
	display:  block;
	padding: 33px 20px 33px 50px;
}
.category #main table tbody tr td:first-child::before, #main table tbody tr td:first-child::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 20px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.category #main table tbody tr td:first-child::before {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #0d68b3;
}
.category #main table tbody tr td:first-child::after {
	left: 25px;
	box-sizing: border-box;
	width: 5px;
	height: 7px;
	border: 3px solid transparent;
	border-left: 5px solid #ffffff;
}
.category #main table tbody tr td+td {
	padding: 0 2%;
	border-left: 1px dotted #dddddd;
	color: #0060af;
	font-size: 14px;
	font-weight: 300;
	width: 240px;
	box-sizing: border-box;
}
.detail .mv h1 span.label {
	background: #0060af;
	color: #ffffff;
	font-size: 14px;
	font-weight: 300;
	width: auto;
	display: table;
	padding: 5px 10px;
}
.detail .mv h1 span {
	font-family: inherit;
	font-weight: 300;
	font-size: 22px;
}
/* summary */


.detail .update {
	text-align: right;
	font-size: 14px;
	font-weight: 300;
	color: #888888;
	margin-bottom: 20px;
}
.detail .summary {
	margin-bottom: 100px;
}
.detail .summary h2 {
	float: left;
	margin-bottom: 30px;
}
.detail .summary .img {
	float: right;
	width: 300px;
}
.detail .summary .comment {
	float: left;
	width: 530px;
}

#product_data_title {
	float: none;
}

#product_data {
	float: none;
	width: 780px;
}

#product_data h2{
	float: none;
}

#product_data h3{
	font-size: 15px;
	line-height: 120%;
	margin-top: 5px;
	margin-bottom: 10px;
}



.detail .summary .comment h3 {
	font-size: 24px;
	font-weight: 600;
	color: #0060af;
	line-height: 50px;
	margin-bottom: 30px
}
.detail .summary .comment p {
	font-size: 14px;
	font-weight: 300;
	color: #333333;
	line-height: 2;
	letter-spacing: -0.06em;
}
.detail .summary .comment p+p{
	margin-top: 30px;
}
.detail .summary .comment span {
	width: 253px;
	display: block;
}
/* use */


.detail .use {
	margin-bottom: 100px;
}
.detail .use h2 {
	margin-bottom: 30px;
}
.detail .use ol {
	width: 910px;
	padding-left: 0;
	margin: 0 auto 40px 35px;
}
.detail .use ul {
	margin: 0 auto 30px 10px;
}
.detail .use ul li {
	text-indent: -0.5em;
	margin-left: 0.5em;
	font-size: 14px;
	line-height: 2;
}
.detail .use ul li::before {
	position: relative;
	top: -2px;
	left: -8px;
	display: inline-block;
	width: 7px;
	height: 7px;
	content: '';
	border-radius: 100%;
	background: #0060af;
}
#business .btn,
.detail .use .btn {
	background: #0060af;
	width: 350px;
	position: relative;
	/* border-bottom: 1px solid #ffffff; */
	cursor: pointer;
}
#business .btn:after,
.detail .use .btn:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(255, 255, 255, 0.1);
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
}
.detail .use .btn:hover:after {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	visibility: visible;
}
#business .btn a,
.detail .use .btn a {
	display: block;
	font-size: 16px;
	color: #ffffff;
	font-weight: 600;
	padding: 5px 0;
	position: relative;
	line-height: 50px;
	text-align: center;
	z-index: 2;
}
#business .btn a::before,
.detail .use .btn a::before, .detail .use .btn a::after {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 20px;
	margin: auto;
	content: "";
	vertical-align: middle;
}

#business .btn a::before,
.detail .use .btn a::before {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #ffffff;
}
#business .btn a::after,
.detail .use .btn a::after {
	right: 21px;
	box-sizing: border-box;
	width: 5px;
	height: 7px;
	border: 3px solid transparent;
	border-left: 5px solid #0d68b3;
}
.detail .perf {
	margin-bottom: 70px;
}
.detail .perf table {
	width: 100%;
	table-layout: fixed;
}
.detail .perf table thead {
	background: #0060af;
	border-top: 1px solid #dddddd;
}
.detail .perf table thead tr {
}
.detail .perf table thead tr th {
	color: #ffffff;
	font-size: 14px;
	font-weight: 600;
	padding: 18px 20px;/* width: 100%; */
}
.detail .perf table thead tr th+th {
	border-left: 1px solid #dddddd;
	box-sizing: border-box;
}
.detail .perf table tbody {
	border-top: 4px solid #f1f2f3;
	border-bottom: 1px solid #dddddd;
}
.detail .perf table tbody tr {
	border-top: 1px solid #dddddd;
}
.detail .perf table tbody tr th {
	font-size: 14px;
	font-weight: 600;
	/* position: relative; */
	/* width: 100%; */
	z-index: 2;
	padding: 20px;
	color: #333333;
}
.detail .perf table tbody tr td {
	padding: 20px;
	border-left: 1px dotted #dddddd;
	color: #333333;
	font-size: 14px;
	font-weight: 300;/* box-sizing: border-box; */
}
.detail .perf span {
	font-size: 14px;
	color: #888888;
	font-weight: 300;
	margin-top: 20px;
	display: block;
}
.detail .link {
	background: #f1f2f3;
	margin-bottom: 30px;
}
.detail .link h3 {
	font-size: 20px;
	font-weight: 600;
	color: #0060af;
	padding: 30px 20px;
}
.detail .link ul {
	width: 830px;
	margin: 0 auto;
	padding-bottom: 30px;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.detail .link ul li {
	background: #ffffff;
	width: 410px;
	display: inline-block;
	vertical-align: middle;
	font-size: 14px;
	font-weight: 300;
	color: #333333;
	line-height: 1.6;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	box-sizing: border-box;
	margin-bottom: 10px;
}
.detail .link ul li:nth-child(even) {
	margin-left: 10px
}
.detail .link ul li a {
	display: block;
	padding: 15px 20px 15px 50px;
	position: relative;
	z-index: 2;
	top: 50%;
	left: 0;
	-ms-transform: translate(0, -50%);
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
}
.detail .link ul li:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #f1f2f3;
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
	outline: 1px solid #fff;
   outline-offset: -1px;
}
.detail .link ul li:hover:after {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	visibility: visible;
}
.detail .link ul li a::before, .link ul li a::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 25px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.detail .link ul li a::before {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #0d68b3;
}
.detail .link ul li a::after {
	left: 30px;
	box-sizing: border-box;
	width: 5px;
	height: 7px;
	border: 3px solid transparent;
	border-left: 5px solid #ffffff;
}
.detail .link ul li a[target="_blank"] span {
	display: inline-block;
	position: relative;
}
.detail .link ul li a[target="_blank"] span::after {
	position: absolute;
	top: 35%;
	content: "";
	background: url(/common/img/blank_icon02.png) no-repeat;
	background-size: contain;
	width: 9px;
	height: 9px;
	margin-left: 5px;
}
.detail dl {
	background: #005faf;
	color: #ffffff;
	text-align: center;
}
.detail dl dt {
	font-size: 20px;
	font-weight: bold;
	padding: 30px 0;
	border-bottom: 1px solid #68a3d2;
}
.detail dl dd {
	width: 50%;
	float: left;
	box-sizing: border-box;
	padding: 20px 0;
	font-size: 16px;
}
.detail dl dd+dd {
	border-left: 1px solid #68a3d2;
}
.detail dl dd span {
	font-size: 14px;
	font-weight: 300;
	color: #becfdd;
}
.detail dl dd .tel {
	background: url(/business/img/tel_icon.png) no-repeat center left;
	background-size: 36px 36px;
	display: block;
	font-family: Montserrat, "sans-serif";
	font-size: 36px;
	font-weight: bold;
	width: 300px;
	margin: 15px auto 10px;
	padding-left: 40px;
	box-sizing: border-box;
}
.detail dl dd .formBtn a {
	background: url(/business/img/contact_icon.png) no-repeat 50px 25px #00437a;
	background-size: 21px 15px;
	display: block;
	width: 320px;
	margin: 20px auto 10px;
	box-sizing: border-box;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	padding: 20px 60px;
}
.detail dl dd .formBtn a {
}
.detail dl dd .formBtn a:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(255, 255, 255, 0.1);
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
}
.detail dl dd .formBtn a:hover:after {
	-webkit-transform: translateY(0);
	transform: translateY(0);


	visibility: visible;
}
/* 導入事例 */

.case .mv h1 span.case_txt {
	font-family: inherit;
	font-size: 22px;
	font-weight: 300;
}
.case #main ul {
	margin: 0 auto 60px 10px;
}
.case #main ul li {
	text-indent: -0.5em;
	margin-left: 0.5em;
	font-size: 14px;
}
.case #main ul li a{
	color:#0060af;
	text-decoration: underline;
}
.case #main ul li a:hover{
	text-decoration:none;
}
.case #main ul li+li {
	margin-top: 10px;
}
.case #main ul li::before {
	position: relative;
	top: -2px;
	left: -8px;
	display: inline-block;
	width: 7px;
	height: 7px;
	content: '';
	border-radius: 100%;
	background: #0060af;
}
.case #main .customerBlock {
	background: #f1f2f3;
	padding: 30px 20px;
	margin-bottom: 80px;
}
.case #main .customerBlock p {
	font-size: 20px;
	font-weight: 600;
	color: #0060af;
	padding-bottom: 20px;
}
.case #main .customerBlock dl {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.case #main .customerBlock dl dt {
	background: #0060af;
	width: 150px;
	min-height: 125px;
	margin-right: 10px;
	position: relative;
}
.case #main .customerBlock dl dt span {
	font-size: 20px;
	font-weight: 300;
	color: #ffffff;
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(0%, -50%);
	-webkit-transform: translate(0%, -50%);
	transform: translate(-50%, -50%);
}
.case #main .customerBlock dl dd {
	background: #ffffff;
	width: 660px;
	position: relative;
}
.case #main .customerBlock dl dd ul {
	margin: 0 auto 0px 30px;
	position: absolute;
	top: 50%;
	left: 0;
	-ms-transform: translate(0%, -50%);
	-webkit-transform: translate(0%, -50%);
	transform: translate(0%, -50%);
	padding: 20px 0;
}
/* チャットレイアウト */
.case #main .voiceBlock {
	width: 100%;
	height: auto;
	overflow: hidden; /*floatの解除*/
	background: #0060af;
	position: relative;
}
.case #main .img {
	color: #ffffff;
	font-size: 20px;
	position: absolute;
	top: 50%;
	left: 7%;
	-ms-transform: translate(-7%, -50%);
	-webkit-transform: translate(-7%, -50%);
	transform: translate(-7%, -50%);
}
.case #main .img img {
	display: block;
	width: 31px;
	margin: 0 auto 18px;
}
.case #main .comment {
	width: 100%;
	float: right;
}
.case #main .hukidashi {
	padding: 20px;
	margin: 30px 20px 30px 180px;
	position: relative;
	background: #ffffff;
}
.case #main .hukidashi p{
	font-size:14px;
}
.case #main .hukidashi p+p {
	padding-top: 20px;
}
.case #main .hukidashi:after {
	content: "";
	position: absolute;
	top: 50%;
	left: -10px;
	margin-top: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 5px 10px 5px 0;
	border-color: transparent #ffffff transparent transparent;
}



/*　flow　*/

.flow #main dl dt{
	font-size: 28px;
	font-weight:  600;
	color: #0060af;
}
.flow #main dl dt span{
	font-family: Montserrat, "sans-serif";
	font-size: 36px;
	font-weight: bold;
	color: #ffffff;
	background: #0060af;
	width: 80px;
	height: 80px;
	line-height: 80px;
	display: inline-block;
	text-align: center;
	margin-right: 20px;
	vertical-align: top;
}
.flow #main dl dd{
	font-size: 15px;
	font-weight: 300;
	color: #333333;
	margin-left: 40px;
	margin-top: -10px;
	padding-bottom: 70px;
	padding-left: 60px;
	border-left: 2px solid #0060af;
}
.flow #main dl dd:last-child{
	border-left:none;
}
.flow #main dl dd.photo{
	display: inline-flex;
}
.flow #main dl dd.photo p{
	width: 200px;
	height: auto;
	margin-left: 10px;
}
.flow #main dl dd.photo img{
	width: 100%;
}
.flow #main dl dd.photo span{
	font-size: 13px;
	font-weight: 300;
	color: #888888;
}
.flow #main ul{
	background: #f1f2f3;
	text-align: center;
	margin-top: 30px;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.flow #main ul li {
	width: 50%;
	box-sizing: border-box;
	padding: 20px 0;
	font-size: 16px;
	font-weight: 600;
	color: #000000;
	/* border-bottom: 1px solid #dddddd; */
}
.flow #main ul li:nth-child(odd) {
	float: left;
	border-right: 1px solid #dddddd;
	box-sizing: border-box;
}
.flow #main ul li:nth-child(even) {
	float: right;
}
.flow #main ul li+li {
	border-top: 1px solid #dddddd;
}
.flow #main ul li:nth-child(2){
	border-top:none;
}
.flow #main ul li span {
	font-size: 13px;
	font-weight: 300;
	color: #888888;
}
.flow #main ul li .tel {
	background: url(/business/img/tel_icon02.png) no-repeat center left;
	background-size: 36px 36px;
	display: block;
	font-family: Montserrat, "sans-serif";
	font-size: 30px;
	font-weight: bold;
	color: #0060af;
	width: 250px;
	margin: 10px auto 0;
	padding-left: 40px;
	box-sizing: border-box;
}
.flow #main ul li .fax {
	background: url(/business/img/fax_icon.png) no-repeat center left;
	background-size: 36px 36px;
	display: block;
	font-family: Montserrat, "sans-serif";
	font-size: 30px;
	font-weight: bold;
	color: #0060af;
	width: 250px;
	margin: 10px auto 0;
	padding-left: 40px;
	box-sizing: border-box;
}
.flow #main ul li .mail {
	background: url(/business/img/mail_icon.png) no-repeat center left;
	background-size: 36px 36px;
	display: block;
	font-family: Montserrat, "sans-serif";
	font-size: 20px;
	font-weight: bold;
	color: #0060af;
	width: 270px;
	margin: 20px auto 0;
	padding-left: 40px;
	box-sizing: border-box;
	height: 36px;
	line-height: 36px;
}
.flow #main ul li .mail:hover a{
    opacity: .7;
}
.flow #main ul li .formBtn a {
	background: url(/business/img/contact_icon.png) no-repeat 50px 20px #0060af;
	background-size: 21px 15px;
	display: block;
	width: 320px;
	margin: 15px auto 0;
	box-sizing: border-box;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	padding: 15px 60px 15px 80px;
	color: #ffffff;
}

.flow #main ul li .formBtn a:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(255, 255, 255, 0.1);
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
}
.flow #main ul li .formBtn a:hover:after {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	visibility: visible;
}





.food .mv{
	background: url(/business/img/food_mv_pc.jpg) no-repeat top center;
	height: 220px;
	margin-bottom: 80px;
	position: relative;
}

.Insulatingoil .mv {
	background: url(/business/img/energy_mv_pc2.jpg) no-repeat top center;
}

.food .mv::after {
	content: "";
	display: block;
	width: 60px;
	border-bottom: 4px solid #0060af;
	position: absolute;
	bottom: 0;
	left: 50%;
	-ms-transform: translate(-50%, 0%);
	-webkit-transform: translate(-50%, 0%);
	transform: translate(-50%, 0);
}
.food .mv h1 {
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: center;
	width: 100%;
}



.food .container .topimg {
	background: url(/business/img/food_topimg_pc.jpg) no-repeat center left;
	background-size: cover;
	height: 270px;
	margin-bottom: 80px;
	padding-left: 60px;
	padding-top: 120px;
}

.Insulatingoil .container .topimg {
	background: url(/business/img/energy_topimg_pc2.jpg) no-repeat center left;

	height: 290px;
	padding-top: 60px;
}

.food .container .topimg p {
	color: #ffffff;
}
.food .container h3 {
	background: #f1f2f3;
	font-size: 20px;
	font-weight: 600;
	color: #0060af;
	line-height: 1.5;
	padding: 20px;
	margin-bottom: 30px;
}
.food .container p {
	font-size: 15px;
	font-weight: 300;
	color: #333333;
	margin-bottom: 80px;
	line-height: 2;
}

.food .container ul {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.food .container ul li {
	width: 380px;
}
.food .container ul li+li {
	margin-left: 30px;
}
.food .container ul li img{
	width:100%;
	height:auto;
	margin-bottom:20px;
}
.food .container dl {
	background: #005faf;
	color: #ffffff;
	text-align: center;
	margin-bottom: 165px;
}
.food .container dl dt {
	font-size: 20px;
	font-weight: bold;
	padding: 30px 0;
	border-bottom: 1px solid #68a3d2;
}
.food .container dl dd {
	width: 50%;
	float: left;
	box-sizing: border-box;
	padding: 20px 0;
	font-size: 16px;
}
.food .container dl dd+dd {
	border-left: 1px solid #68a3d2;
}
.food .container dl dd span {
	font-size: 14px;
	font-weight: 300;
	color: #becfdd;
}
.food .container dl dd span span{
	background: #00437a;
	padding: 3px 8px;
	margin-left: 10px;
}
.food .container dl dd .tel {
	background: url(/business/img/tel_icon.png) no-repeat center left;
	background-size: 36px 36px;
	display: block;
	font-family: Montserrat, "sans-serif";
	font-size: 36px;
	font-weight: bold;
	width: 300px;
	margin: 15px auto 10px;
	padding-left: 40px;
	box-sizing: border-box;
}
.food .container dl dd .formBtn a {
	background: url(/business/img/contact_icon.png) no-repeat 50px 25px #00437a;
	background-size: 21px 15px;
	display: block;
	width: 320px;
	margin: 20px auto 10px;
	box-sizing: border-box;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	padding: 20px 60px 20px 80px;
}

.food .container dl dd .formBtn a:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(255, 255, 255, 0.1);
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
}
.food .container dl dd .formBtn a:hover:after {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	visibility: visible;
}



.tcs .mv{
	background: url(/business/img/tcs_mv_pc.jpg) no-repeat top center;
	height: 220px;
	margin-bottom: 80px;
	position: relative;
}
.tcs .mv::after {
	content: "";
	display: block;
	width: 60px;
	border-bottom: 4px solid #0060af;
	position: absolute;
	bottom: 0;
	left: 50%;
	-ms-transform: translate(-50%, 0%);
	-webkit-transform: translate(-50%, 0%);
	transform: translate(-50%, 0);
}
.tcs .mv h1 {
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: center;
	width: 100%;
}
.tcs .container .inner{
	padding-bottom: 100px;
}
.tcs .container .topimg {
	background: url(/business/img/tcs_topimg_pc.jpg) no-repeat center left;
	background-size: cover;
	height: 300px;
	margin-bottom: 80px;
	padding-left: 60px;
	padding-top: 100px;
}
.tcs .container .topimg p {
	color: #ffffff;
}
.tcs .container h3 {
	background: #f1f2f3;
	font-size: 20px;
	font-weight: 600;
	color: #0060af;
	line-height: 1.5;
	padding: 20px;
	margin-bottom: 30px;
}
.tcs .container p {
	font-size: 15px;
	font-weight: 300;
	color: #333333;
	margin-bottom: 40px;
	line-height: 2;
}
.tcs .container .card{
	background:#0060af;
	padding: 40px 40px 20px;
	margin-bottom: 60px;
}
.tcs .container .card h4 {
	font-size: 20px;
	font-weight: 600;
	color: #ffffff;
	margin-bottom: 20px;
}
.tcs .container .card h4 span img{
	width: 34px;
	height: auto;
	margin-right: 10px;
}
.tcs .container .card ul {
	display: -webkit-box;
	display: -moz-box;
	display:
	-ms-flexbox;
	display: 
	-webkit-flex;
	display: 
	-moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	}
.tcs .container .card ul li {
	width: 550px;
	box-sizing: border-box;
	padding: 10px;
	background: #ffffff;
	margin-bottom: 20px;
	}
.tcs .container .card ul li:nth-child(even) {
	margin-left: 20px;
}
.tcs .container .card ul li dl {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.tcs .container .card ul li dl dt{
	background: #68a3d2;
	width: 70px;
	/* padding: 20px 0; */
	position: relative;
	min-height: 120px;
}
.tcs .container .card ul li dl dt p {
	font-size: 14px;
	font-weight: 300;
	color: #ffffff;
	text-align: center;
	margin-bottom: 0;
	line-height: normal;
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
.tcs .container .card ul li dl dt span {
	font-family: Montserrat, "sans-serif";
	font-size: 24px;
	font-weight: bold;
	display: block;
}
.tcs .container .card ul li dl dd {
	width: 430px;
	margin-left: 20px;
	position: relative;
	padding: 10px 0;
}

.tcs .container .card ul li dl dd p{
    margin-bottom: 0;
}
.tcs .container .card ul li dl dd span{
	font-size:18px;
	font-weight:600;
	color:#68a3d2;
	display:block;
	margin-bottom: 10px;
}
.tcs .container .bnr{	
	font-size: 0;
	margin-bottom: 50px;
}

.tcs .container .bnr li{
	width: 380px;
	display: inline-block;
	position: relative;
	overflow: hidden;
}

.tcs .container .bnr li p{
	font-weight:600;
	position: relative;
	padding-left: 20px;
	margin-top: 10px;
	margin-bottom: 0;
}

.tcs .container .bnr li a p::before, .tcs .container .bnr li a p::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.tcs .container .bnr li a p::before {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #0d68b3;
}
.tcs .container .bnr li a p::after {
	left: 5px;
	box-sizing: border-box;
	width: 5px;
	height: 7px;
	border: 3px solid transparent;
	border-left: 5px solid #ffffff;
}
.tcs .container .bnr li+li{
	margin-left:30px;
}
.tcs .container .bnr li img{
	width:100%;
	height:auto;
}

.tcs .container .bnr li a{
	display: block;
}

.tcs .container .bnr li a:hover {
	opacity:0.7;
}
.tcs .container .bnr li a[target="_blank"] span {
	display: inline-block;
	position: relative;
}
.tcs .container .bnr li a[target="_blank"] span::after {
	position: absolute;
	top: 35%;
	content: "";
	background: url(/common/img/blank_icon02.png) no-repeat;
	background-size: contain;
	width: 9px;
	height: 9px;
	margin-left: 5px;
}


.energy .mv{
	background: url(/business/img/energy_mv_pc.jpg) no-repeat top center;
	height: 220px;
	margin-bottom: 80px;
	position: relative;
}
.energy .mv::after {
	content: "";
	display: block;
	width: 60px;
	border-bottom: 4px solid #0060af;
	position: absolute;
	bottom: 0;
	left: 50%;
	-ms-transform: translate(-50%, 0%);
	-webkit-transform: translate(-50%, 0%);
	transform: translate(-50%, 0);
}
.energy .mv h1 {
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: center;
	width: 100%;
}
.energy .container .topimg {
	background: url(/business/img/energy_topimg_pc.jpg) no-repeat center left;
	background-size: cover;
	height: 260px;
	margin-bottom: 80px;
	padding-left: 60px;
	padding-top: 140px;
}
.energy .container .topimg p {
	color: #ffffff;
}
.energy .container h3 {
	background: #f1f2f3;
	font-size: 20px;
	font-weight: 600;
	color: #0060af;
	line-height: 1.5;
	padding: 20px;
	margin-bottom: 20px;
}
.energy .container p {
	font-size: 15px;
	font-weight: 300;
	color: #333333;
	margin-bottom: 50px;
	line-height: 2;
}


.energy .container .guidance{
	margin-bottom: 100px;
}

.energy .container .guidance .guid_Block{
	margin-bottom:60px;
}
.energy .container .guidance .guid_Block .left{
	width: 580px;
	float: left;
	
}
.energy .container .guidance .guid_Block p{
	
margin-bottom: 30px;
}
.energy .container .guidance .guid_Block a {
	background: #0060af;
	width: 350px;
	position: relative;
	cursor: pointer;
	display: block;
	margin-top: 10px;
}
.energy .container .guidance .guid_Block a:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(255, 255, 255, 0.1);
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
}
.energy .container .guidance .guid_Block a:hover:after {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	visibility: visible;
}
.energy .container .guidance .guid_Block a span {
	display: block;
	font-size: 15px;
	color: #ffffff;
	font-weight: 600;
	position: relative;
	line-height: 60px;
	text-align: center;
}
.energy .container .guidance .guid_Block a span::after {
	position: absolute;
	top: 37%;
	right: 20px;
	content: "";
	background: url(/common/img/blank_icon04.png) no-repeat;
	background-size: contain;
	width: 15px;
	height: 15px;
}
.energy .container .guidance .guid_Block img{
	width: 580px;
	float: right;
	
}
.energy .container .effort{
	margin-bottom:160px;
}
.energy .container .effort h3{
	margin-top: 50px;
}
.energy .container .effort p{
	margin-bottom: 20px;
}
.energy .container .effort_block{
	border: solid 4px #f1f2f3;
	outline: 1px solid #dddddd;
	padding: 35px;
}
.energy .container .effort_block h4 {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 20px;
}
.energy .container .effort_block h4 span img{
	width: 30px;
	height: auto;
	margin-right: 10px;
	vertical-align: sub;
}

.energy .container .effort_block dl{
	border-bottom: 1px solid #dddddd;
}
.energy .container .effort_block dl dt{
	background: #0060af;
	font-size: 14px;
	font-weight: 600;
	color: #ffffff;
	border-right: solid 4px #f1f2f3;
	border-top: 1px solid #dddddd;
	width: 245px;
	box-sizing: border-box;
	float: left;
	padding: 15px 35px;
}
.energy .container .effort_block dl dd{
	font-size: 14px;
	font-weight: 300;
	color: #333333;
	margin-left: 245px;
	border-top: 1px solid #dddddd;
	border-left: 1px solid #dddddd;
	box-sizing: border-box;
	padding: 15px 35px;
}




@-moz-document url-prefix() {

}
@media screen and (max-width: 767px) {
/*　パンクズ　*/
.pankuzu {
	display: none;
}
.pankuzu a {
	color: #0060af;
	font-family: "Montserrat";
	padding-right: 10px;
}
.pankuzu span {
	padding: 0 10px;
}
.mv {
	background: url(/business/img/petroleum_mv_sp.jpg) no-repeat top center #777773;
	background-size: 100% auto;
	margin-top: 48px;
}
.mv .inner {
	width: 100%;
	min-height: auto;
	padding: 15% 0;
}
.mv .inner::after {
	content: "";
	display: block;
	width: 60px;
	border-bottom: 4px solid #0060af;
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, 0%);
	-webkit-transform: translate(-50%, 0%);
	transform: translate(-50%, 0%);
}
.mv h1 {
	position: inherit;
	top: 0;
	left: 0;
	-ms-transform: translate(0%, 0%);
	-webkit-transform: translate(0%, 0%);
	transform: translate(0%, 0%);
	font-size: 26px;
	width: 92%;
	margin: 0 auto;
	text-align: center;
}
.mv h1 span {
	font-size: 12px;
}
.container .inner {
	width: 100%;
}
.container .inner h2 {
	font-size: 22px;
	border-left: 3px solid #0060af;
	padding: 0 0 0 4%;
	margin-bottom: 5%;
	float: none;
}
	
	
/* business index*/

.business  .mv {
	background: url(/business/img/business_mv_sp.jpg) no-repeat top center;
	background-size: cover;
	height: 150px;
	margin-bottom: 13%;
	position: relative;
	margin-top: 0;
}
.business .mv h1 {
    font-size: 26px;
    width: 92%;
    margin: 0 auto;
}
.business .mv h1 span {
    font-size: 12px;
}
.business .container {
    padding-bottom: 15%;
}
.business .container .inner{
	width:92%;
	margin:0 auto;
}
.business .comment{
	padding: 5%;
	margin-bottom: 15%;
}

.business .comment p{
	font-size: 16px;
	width: 100%;
}
.business .businessBlock{
	
padding-bottom: 15%;
}

.business .businessBlock h2 span{
    font-size: 10px;
}
.business .businessBlock .img{
	 float: none;
	 width: 100%;
	 margin-bottom: 5%;
}
.business .businessBlock .img img{
	 width: 100%;
    height: auto;
}
.business .businessBlock .businessDetail{
	float: none;
	width: 100%;
}
.business .businessBlock .businessDetail p{
	font-size: 14px;
	line-height: 1.7;
	margin-bottom: 5%;
}
.business .businessBlock .businessDetail .btn{
	 width: 100%;
	 margin-bottom: 0;
}

.business .businessBlock .businessDetail .btn a {
	font-size: 14px;
	padding: 0;
}
.business .businessBlock .businessDetail .btn a::before, .business .businessBlock .businessDetail .btn a::after {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 20px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.business .businessBlock .businessDetail .btn a::before {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #ffffff;
}
.business .businessBlock .businessDetail .btn a::after {
	right: 21px;
	box-sizing: border-box;
	width: 5px;
	height: 7px;
	border: 3px solid transparent;
	border-left: 5px solid #0d68b3;
}
.business .businessBlock .businessDetail ul{
	margin-top: 5%;
}
.business .businessBlock .businessDetail ul li+li{
	padding-top: 2%;
}
.business .businessBlock .businessDetail ul li a {
	padding: 0px 0 0 30px;
	position: relative;
	font-size: 14px;
	font-weight: 300;
	color: #333333;
}
.business .businessBlock .businessDetail ul li a:hover{
	opacity:.7;
}

.business .businessBlock .businessDetail ul li a::before, .business .businessBlock .businessDetail ul li a::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.business .businessBlock .businessDetail ul li a::before {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #0d68b3;
}
.business .businessBlock .businessDetail ul li a::after {
	left: 5px;
	box-sizing: border-box;
	width: 5px;
	height: 7px;
	border: 3px solid transparent;
}


	

/* petroleum index*/

.index .mv{

	height: 150px;
	margin-bottom: 13%;
	margin-top: 0;

	position: relative;
}

.index .container .inner{
	width:92%;
	margin:0 auto;
}


.petroleum.detail .container .inner{
	width:92%;
	margin:0 auto;
}


.index .topimg {
	background: url(/business/img/index_topimg_sp.jpg) no-repeat bottom left #2c8be7;
	background-size: 100% auto;
	height: auto;
	margin-bottom: 13%;
	padding-left: 0;
	padding-top: 10%;
	padding-bottom: 50%;
}
.index .container .topimg p {
    font-size: 15px;
    width: 86%;
    margin: 0 auto 7%;
}
.index h3 {
    font-size: 16px;
    padding: 5%;
    margin-bottom: 7%;
}
.index .container p {
    font-size: 14px;
    margin-bottom: 7%;
    line-height: 1.7;
}
/*============================
#anchorLink
============================*/
.index #anchorLink {
	margin-bottom: 15%;

}
.index #anchorLink ul {
	font-size: 0;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	border-top: 1px solid #0060af;
}
.index #anchorLink ul li {
	width: 50%;
	box-sizing: border-box;
	border-top: none;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
}
.index #anchorLink ul li:nth-child(1) a,
.index #anchorLink ul li:nth-child(3) a{
	padding: 10% 0;
}
.index #anchorLink ul li+li {
	margin-left: 0;
}
.index #anchorLink ul li:nth-child(even){border-left: none;}
.index #anchorLink ul li:after {
	display: none;
}
.index #anchorLink ul li a {
	font-size: 14px;
	padding: 5% 0;
	width: 100%;
}
.index #anchorLink ul li a:after, .index #anchorLink ul li a:before {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 10px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.index #anchorLink ul li a:after {
	right: 14px;
	top: 3px;
	box-sizing: border-box;
	width: 5px;
	height: 4px;
	border: 2px solid transparent;
	border-top: 3px solid #ffffff;
}
.index #anchorLink ul li a:before {
	width: 12px;
	height: 12px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #0d68b3;
}


/*============================
#elect
============================*/
.index #elect {
    margin-bottom: 7%;
    margin-top: -60px;
    padding-top: 60px;
}
.index #elect h2 {
}
.index #elect ul {
}
.index #elect ul li {
	width: 86%;
	margin-bottom: 10%;
	padding: 0 7%;
	margin-top: 15%;
}
.index #elect ul li:nth-child(even) {
	margin-left: 0;
}
.index #elect ul li img {
	width: 100%;
	height: auto;
	margin-bottom: -6%;
	margin-top: -15%;
}
.index #elect ul li span {
	width: 35px;
	padding: 3% 0;
	font-size: 16px;
}
.index #elect ul li h3 {
	padding: 5% 0;
}
.index #elect ul li p {
}


/* 商品詳細*/

.petroleum.detail #elect {
    margin-bottom: 7%;
    margin-top: -60px;
    padding-top: 60px;
}
.petroleum.detail #elect h2 {
}
.petroleum.detail #elect ul {
}
.petroleum.detail #elect ul li {
	width: 86%;
	margin-bottom: 10%;
	padding: 0 7%;
	/*margin-top: 15%;*/
}
.petroleum.detail #elect ul li:nth-child(even) {
	margin-left: 0;
}

.petroleum.detail #elect ul li:nth-child(3) {
	margin-left: 0;
}

.petroleum.detail #elect ul li img {
	width: 100%;
	height: auto;
	margin-bottom: -6%;
	margin-top: -15%;
}
.petroleum.detail #elect ul li span {
	width: 35px;
	padding: 3% 0;
	font-size: 16px;
}
.petroleum.detail #elect ul li h3 {
	padding: 5% 0;
}
.petroleum.detail #elect ul li p {
}




/*============================
#service
============================*/
.index #service {
    margin-bottom: 20%;
    margin-top: -60px;
    padding-top: 60px;
}
.index #service h4 {
	font-size: 14px;
	margin-bottom: 5%;
}
.index #service h4 span img{
	width:19px;
}

.index #service ul {
	width: 100%;
	margin: 0 auto;
	padding-bottom: 30px;
}
.index #service ul li {
	width: 100%;
	display: block;
	line-height: 1.8;
	margin-bottom: 10px;
	margin-right: 0;
	height: auto;
}
.index #service ul li:nth-child(even) {
	margin-left: 0;
}
.index #service ul li a {
	padding: 3% 6% 3% 10%;
	position: inherit;
	top: 0;
	-ms-transform: translate(0);
	-webkit-transform: translate(0);
	transform: translate(0);
	display: block;
	box-sizing: border-box;
}
.index #service ul li:after {
	display:none;

}

.index #service ul li a::before, .index #service ul li a::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 10px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.index #service ul li a::before {
	width: 11px;
	height: 11px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #0d68b3;
}
.index #service ul li a::after {
	left: 14px;
	box-sizing: border-box;


	width: 4px;

	height: 5px;
	border: 2px solid transparent;
	border-left: 3px solid #ffffff;
}



/*============================
#case
============================*/
.index #case {
    margin-bottom: 20%;
    margin-top: -60px;
    padding-top: 60px;
}
.index #case ul {
	display: block;
	}
.index #case ul li {
	width: 100%;
	margin-bottom: 5%;
	height: auto;
	}
.index #case ul li:nth-child(even) {
	margin-left: 0;
	margin-bottom: 0;
}
.index #case ul li:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #f1f2f3;
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
}
.index #case ul li:hover:after {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	visibility: visible;
	border-bottom: solid 1px #ffffff;
}
.index #case ul li a {
	display: block;
	padding: 0;
	position: relative;
	z-index: 2;
	top: 50%;
	left: 0;
	-ms-transform: translate(0, 0%);
	-webkit-transform: translate(0, 0%);
	transform: translate(0, 0%);
}
.index #case ul li a::before, .index #case ul li a::after {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 5px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.index #case ul li a::before {
	width: 11px;
	height: 11px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #0d68b3;
}
.index #case ul li a::after {
	right: 7px;
	box-sizing: border-box;
	width: 4px;

	height: 5px;
	border: 2px solid transparent;
	border-left: 3px solid #ffffff;
}
.index #case ul li dl {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.index #case ul li dl dt {
	font-size: 11px;
	width: 50px;
	padding: 2% 0;
	display: inline-table;
}
.index #case ul li dl dt span {
	font-size: 18px;
}
.index #case ul li dl dd {
	width: 76%;
	position: relative;
}
.index #case ul li dl dd p{
    margin-left: 7%;
    margin-bottom: 0;
}
/*============================
#sales
============================*/
.index #sales {
    margin-bottom: 20%;
    margin-top: -60px;
    padding-top: 60px;
}
.index #sales ul {
	padding-bottom: 30px;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.index #sales ul li {
	width: 100%;
}
.index #sales ul li:nth-child(even) {
	margin-left: 0;
}
.index #sales ul li ul li {
	font-size: 14px;
	font-weight: 300;
	color: #333333;
	line-height: 2;
	padding-bottom: 10px;
	list-style-type: none;
	counter-increment: number;
	text-indent: -1em;
	margin-left: 1em !important;
}
.index #sales ul li ul li::before {
	content: counter(number) ".";
	margin-right: 5px;
	color: #0060af;
	font-family: Montserrat, "sans-serif";
	font-weight: bold;
}

	

	
/*============================
#main
============================*/

.scroll {
	overflow: auto;
	white-space: nowrap;
	width: 92%;
	margin: 0 auto;

}
.category #main {
	padding-bottom: 30%;
}
.category #main table{
	table-layout: inherit;
}
.category #main table thead tr{
	display: table-row;
	/* font-size:  inherit; */
}
.category #main table thead tr th{
	padding: 3% 4%;
	width: 100%;
	display: table-cell;
	/* width: auto; */
	/* display: flex; */
}
.category #main table thead tr th+th{
	width: 100%;
	padding: 2% 2%;
}
.category #main table tbody tr td {
	font-size: 14px;
	padding: 2% 0;
	/* display: table-cell; */
}
.category #main table tbody tr td span {
	padding: 0 20px 0 50px;
	width: auto;
}
.category #main table tbody tr td+td {
	/*padding: 2%;*/
	/* width: 100%; */
	/* white-space: normal; */
}

.category #main table tbody tr {
	position: inherit;
	overflow: auto;
	display: table-row;
	width: 100%;
}
.category #main table tbody tr:after {
	display: none;
}
.detail #main {
	width: 92%;
	margin: 0 auto;
}
.detail .container .inner h2 {

	font-size: 22px;
	margin-bottom: 5%;
}
.detail .mv h1 {
	text-align: center;
}
.detail .mv h1 span.label {
	font-size: 12px;
	width: auto;
	padding: 5px 10px;
	margin: 0 auto 3%;
}
.detail .mv h1 span {
	font-size: 18px;
}
/* summary */


.detail .update {
	margin-bottom: 10%;
	margin-top: 15%;
}
.detail .summary {
	margin-bottom: 20%;
}
.detail .summary h2 {
	float: none;
	margin-bottom: 5%;
	font-size: 22px;
}
.detail .summary .img {
	float: none;
	margin: 0 auto 10%;
	width: auto;
}
.detail .summary .img img{
	width:auto;
	margin: 0 auto;
	display: block;
}
.detail .summary .comment {
	float: none;
	width: 100%;
}

#product_data {
	float: none;
	width: 100%;
}

#product_data h3{
	font-size: 13px;
}

.detail .summary .comment h3 {
	font-size: 24px;
	font-weight: 600;
	color: #0060af;
	line-height: 50px;
	margin-bottom: 30px
}
.detail .summary .comment p+p {
	margin-top: 5%;
}
.detail .summary .comment span {
	width: 253px;
	display: block;
}
/* use */


.detail .use {
	margin-bottom: 20%;
}
.detail .use h2 {
	font-size: 22px;
	margin-bottom: 5%;
}
.detail .use ol {
	width: 910px;
	padding-left: 0;
	margin: 0 auto 40px 35px;
}
.detail .use ul {
	margin: 0 auto 5% 10px;
}
.detail .use ul li {
	line-height: 1.8;
	margin-bottom: 3%;
}
.detail .use ul li::before {
	position: relative;
	top: -2px;
	left: -8px;
	display: inline-block;
	width: 7px;
	height: 7px;
	content: '';
	border-radius: 100%;
	background: #0060af;
}
.detail .use .btn {
	width: 100%;
}
.detail .use .btn:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(255, 255, 255, 0.1);
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
}
.detail .use .btn a {
	font-size: 14px;
	padding: 0;
}
.detail .use .btn a::before, .detail .use .btn a::after {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 20px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.detail .use .btn a::before {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #ffffff;
}
.detail .use .btn a::after {
	right: 21px;
	box-sizing: border-box;
	width: 5px;
	height: 7px;
	border: 3px solid transparent;
	border-left: 5px solid #0d68b3;
}
.detail .perf {
	margin-bottom: 20%;
}
.detail .perf .scroll {
	width: 100%;
}
.detail .perf table {
	table-layout: inherit;
}
.detail .perf table thead tr th {
	padding: 2% 4%;
}
.detail .perf table tbody tr td {
	font-size: 14px;
	padding: 2% 4%;
}
.detail .perf span {
	font-size: 12px;
	margin-top: 5%;
	margin-left: 1em;
	text-indent: -1em;
}
.detail .link {
	background: #f1f2f3;
	margin-bottom: 30px;
}
.detail .link h3 {
	width: 91.3%;
	margin: 0 auto;
	font-size: 16px;
	padding: 5% 0;
}
.detail .link ul {
	width: 91.3%;
	margin: 0 auto;
	padding-bottom: 30px;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.detail .link ul li {
	width: 100%;
	display: block;
	line-height: 1.8;
	margin-bottom: 10px;
}
.detail .link ul li:nth-child(even) {
	margin-left: 0;
}
.detail .link ul li a {
	padding: 3% 6% 3% 14%;
	position: inherit;
	top: 0;
	-ms-transform: translate(0);
	-webkit-transform: translate(0);
	transform: translate(0);
	display: block;
	box-sizing: border-box;
}
.detail .link ul li:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #f1f2f3;
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	visibility: hidden;
	-webkit-transition: all .4s;
	transition: all .4s;
}
.detail .link ul li:hover:after {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	visibility: visible;
}
.detail .link ul li a::before, .link ul li a::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 20px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.detail .link ul li a::before {
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #0d68b3;
}
.detail .link ul li a::after {
	left: 25px;
	box-sizing: border-box;
	width: 5px;
	height: 7px;
	border: 3px solid transparent;
	border-left: 5px solid #ffffff;
}
.detail .link ul li a[target="_blank"] span {
	display: inline-block;
	position: relative;
}
.detail .link ul li a[target="_blank"] span::after {
	position: absolute;
	top: 35%;
	content: "";
	background: url(/common/img/blank_icon02.png) no-repeat;
	background-size: contain;
	width: 9px;
	height: 9px;
	margin-left: 5px;
}
.detail dl dt {
	font-size: 16px;
	padding: 5% 0;
	line-height: 2;
}
.detail dl dd {
	width: 100%;
	float: none;
	padding: 5% 0;
	font-size: 14px;
}
.detail dl dd+dd {
	border-left: none;
	border-top: 1px solid #68a3d2;
}
.detail dl dd span {
	font-size: 12px;
}
.detail dl dd .tel {
	background: url(/business/img/tel_icon.png) no-repeat center left;
	background-size: 30px 30px;
	font-size: 30px;
	width: 73%;
	margin: 3% auto 2%;
	padding-left: 8%;
}
.detail dl dd .formBtn a {
	background: url(/business/img/contact_icon.png) no-repeat 14% center #00437a;
	background-size: 21px 15px;
	display: block;
	width: 73.9%;
	margin: 3% auto;
	padding: 4% 10% 4% 13%;
}
.detail dl dd .formBtn a {
}
.detail dl dd .formBtn a:after {
	display: none;
}
	
	
/* 導入事例 */

.case .mv h1 span.case_txt {
	font-family: inherit;
	font-size: 22px;
	font-weight: 300;
}
.case #main{
	width:92%;
	margin:0 auto;
}
.case #main ul {
	margin: 0 auto 15% 10px;
}
.case #main ul li {
}
.case #main ul li+li {
	margin-top: 10px;
}
.case #main ul li::before {
	position: relative;
	top: -2px;
	left: -8px;
	display: inline-block;
	width: 7px;
	height: 7px;
	content: '';
	border-radius: 100%;
	background: #0060af;
}
.case #main .customerBlock {
	padding: 6% 5%;
	margin-bottom: 20%;
	margin-top: 15%;
}
.case #main .customerBlock p {
	font-size: 16px;
	padding-bottom: 5%;
}
.case #main .customerBlock dl {
	display: block;
	flex-wrap:  inherit;
}
.case #main .customerBlock dl dt {
	width: 100%;
	min-height: 40px;
	margin-right: 10px;
	position: relative;
	margin-bottom: 3%;
}
.case #main .customerBlock dl dt span {
	font-size: 16px;
	text-align: center;
	position: inherit;
	top: 0;
	left: 0;
	-ms-transform: translate(0%, 0%);
	-webkit-transform: translate(0%, 0%);
	transform: translate(0%, 0%);
	display: block;


	line-height: 40px;
}
.case #main .customerBlock dl dd {
	width: 100%;
}
.case #main .customerBlock dl dd ul {
	margin: 0 auto 0px 7%;
	position: inherit;
	top: 0;
	left: 0;
	-ms-transform: translate(0%, 0%);
	-webkit-transform: translate(0%, 0%);
	transform: translate(0%, 0%);
	padding: 5% 5% 5% 0;
}
/* チャットレイアウト */
.case #main .voiceBlock {
	/* width: 100%; */
	/* height: auto; */
	/* overflow: hidden; */ /*floatの解除*/
	/* background: #0060af; */
	/* position: relative; */
}
.case #main .img {
	font-size: 16px;
	position: inherit;
	top: 0;
	left: 0;
	-ms-transform: translate(0%, -0%);
	-webkit-transform: translate(0%, 0%);
	transform: translate(0%, 0%);
	padding: 5% 6%;
}
.case #main .img img {
	display: inline-block;
	width: 22px;
	margin: 0 auto 2%;
	vertical-align: middle;
}
.case #main .comment {
	width: 100%;
	float: none;
}
.case #main .hukidashi {

	padding: 4%;
	margin: 0 auto 5%;
	width: 92%;
	box-sizing: border-box;
}
.case #main .hukidashi p+p {
	padding-top: 20px;
}
.case #main .hukidashi:after {
	content: "";
	position: absolute;
	top: 0;
	left: 7%;
	margin-left: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0px 6px 10px 6px;
	border-color: transparent transparent #ffffff transparent;
}
	
	


/*　flow　*/
.flow #main dl{
	width:92%;
	margin:0 auto;
}
.flow #main dl dt{
	font-size: 22px;
	letter-spacing: -0.06em;
}
.flow #main dl dt span{
	font-size: 20px;
	width: 45px;
	height: 45px;
	line-height: 45px;
	display: inline-block;
	margin-right: 5%;
	vertical-align: top;
}
.flow #main dl dd{
	margin-left: 24px;
	margin-top: 0;
	padding-bottom: 10%;
	padding-left: 11%;
}

.flow #main dl dd.photo{
	display: block;
}
.flow #main dl dd.photo p{
	width: 68.9%;
	margin-left: 0;
	margin-top: 5%;
}

.flow #main dl dd.photo span{
	font-size: 13px;
	font-weight: 300;
	color: #888888;
}
.flow #main ul{
	margin-top: 8%;
}
.flow #main ul li {
	width: 100%;
	padding: 5% 0;
	font-size: 14px;
}
.flow #main ul li:nth-child(odd) {
	float: none;
	border-right: none;
}
.flow #main ul li:nth-child(even) {
	float: none;
}
.flow #main ul li+li {
	border-top: 1px solid #dddddd;
}
.flow #main ul li:nth-child(2){
	border-top: 1px solid #dddddd;
}
.flow #main ul li span {
	font-size: 12px;
}
.flow #main ul li .tel {
    background: url(/business/img/tel_icon02.png) no-repeat center left;
    background-size: 30px 30px;
    font-size: 30px;
    width: 88%;
    margin: 3% auto 2%;
    padding-left: 11%;
}
.flow #main ul li .fax {
	background: url(/business/img/fax_icon.png) no-repeat center left;
	background-size: 30px 30px;
	font-size: 30px;
	width: 88%;
	margin: 3% auto 2%;
	padding-left: 11%;
}
.flow #main ul li .mail {
	background: url(/business/img/mail_icon.png) no-repeat center left;
	background-size: 30px 30px;
	font-size: 18px;
	width: 88%;
	margin: 3% auto 2%;
	padding-left: 11%;
}
.flow #main ul li .formBtn a {
	background: url(/business/img/contact_icon.png) no-repeat 14% center #0060af;
	background-size: 21px 15px;
	display: block;
	width: 88%;
	margin: 3% auto;
	padding: 4% 10% 4% 18%;
}

.flow #main ul li .formBtn a:after {
	display:none;

}

	
	
.food .mv{
	background: url(/business/img/food_mv_sp.jpg) no-repeat top center;
    height: 150px;
    margin-bottom: 13%;
    margin-top: 0;
    position: relative;
}
.food .mv::after {
	content: "";
	display: block;
	width: 60px;
	border-bottom: 4px solid #0060af;
	position: absolute;
	bottom: 0;
	left: 50%;
	-ms-transform: translate(-50%, 0%);
	-webkit-transform: translate(-50%, 0%);
	transform: translate(-50%, 0);
}

.food .container .inner{
	width:92%;
	margin:0 auto;
}

.food .container .topimg {
	background: url(/business/img/food_topimg_sp.jpg) no-repeat bottom left #2d231d;
	background-size: cover;
	background-size: 100% auto;
	height: auto;
	margin-bottom: 13%;
	padding-left: 0;
	padding-top: 10%;
	padding-bottom: 60%;
}

.Insulatingoil  .container .topimg {
	background: url(/business/img/energy_topimg_sp2.jpg) no-repeat bottom left #2d231d;
}

.food .container .topimg p {
    font-size: 15px;
    width: 86%;
    margin: 0 auto 7%;
	letter-spacing: -0.06em;
}
.food .container h3 {
    font-size: 16px;
    padding: 5%;
    margin-bottom: 7%;
}
.food .container p {
    font-size: 14px;
    margin-bottom: 14%;
    line-height: 1.7;
}

.food .container ul li {
	width: 100%;
}
.food .container ul li+li {
	margin-left: 0;
}
.food .container ul li img{
	width:100%;
	height:auto;
	margin-bottom:20px;
}

.food .container dl{
	margin-bottom:95px;
}
.food .container dl dt {
	font-size: 16px;
	padding: 5% 0;
	line-height: 2;
}
.food .container dl dd {
	width: 100%;
	float: none;
	padding: 5% 0;
	font-size: 14px;
}
.food .container dl dd+dd {
	border-left: none;
	border-top: 1px solid #68a3d2;
}
.food .container dl dd span {
	font-size: 12px;
}

.food .container dl dd span span{
	margin-left: 0;
	display:block;
	width: 49%;
	margin: 3% auto 0;
}
.food .container dl dd .tel {
	background: url(/business/img/tel_icon.png) no-repeat center left;
	background-size: 30px 30px;
	font-size: 30px;
	width: 73%;
	margin: 3% auto 2%;
	padding-left: 8%;
}
.food .container dl dd .formBtn a {
	background: url(/business/img/contact_icon.png) no-repeat 14% center #00437a;
	background-size: 21px 15px;
	display: block;
	width: 73.9%;
	margin: 3% auto;
	padding: 4% 10% 4% 18%;
}

.food .container dl dd .formBtn a:after {
	display: none;
}



	
	


.tcs .mv{
	background: url(/business/img/tcs_mv_sp.jpg) no-repeat top center;
	height: 150px;
	margin-bottom: 13%;
	margin-top: 0;
	position: relative;
}
.tcs .mv::after {
	content: "";
	display: block;
	width: 60px;
	border-bottom: 4px solid #0060af;
	position: absolute;
	bottom: 0;
	left: 50%;
	-ms-transform: translate(-50%, 0%);
	-webkit-transform: translate(-50%, 0%);
	transform: translate(-50%, 0);
}

.tcs .container .inner{
	width: 92%;
	margin: 0 auto;
	padding-bottom: 10%;
}
.tcs .container .topimg {
	background: url(/business/img/tcs_topimg_sp.jpg) no-repeat bottom left #7c8e72;
	background-size: cover;
	background-size: 100% auto;
	height: auto;
	margin-bottom: 13%;
	padding-left: 0;
	padding-top: 10%;
	padding-bottom: 60%;
}
.tcs .container .topimg p {
    font-size: 15px;
    width: 86%;
    margin: 0 auto 7%;
}
.tcs .container h3 {
    font-size: 16px;
    padding: 5%;
    margin-bottom: 7%;
}
.tcs .container p {
    font-size: 14px;
    margin-bottom: 14%;
    line-height: 1.7;
}
.tcs .container .card{
	padding: 5% 5% 3%;
	margin-bottom: 20%;
}
.tcs .container .card h4 {
	font-size: 14px;
	margin-bottom: 5%;
}
.tcs .container .card h4 span img{
	width: 27px;
	vertical-align: middle;
}
.tcs .container .card ul {
    display: block;
	}
.tcs .container .card ul li {
	width: 100%;
	margin-bottom: 5%;
	}
.tcs .container .card ul li:nth-child(even) {
	margin-left: 0;
}
.tcs .container .card ul li dl {
}
.tcs .container .card ul li dl dt{
    font-size: 11px;
    width: 50px;
    padding: 2% 0;
    min-height: auto;
}
.tcs .container .card ul li dl dt p {
	font-size: 11px;
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
.tcs .container .card ul li dl dt span {
	font-size: 18px;
}
.tcs .container .card ul li dl dd {
	width: 74%;
	position: relative;
	margin-left: 10px;
}

.tcs .container .card ul li dl dd p{
}
.tcs .container .card ul li dl dd span{
	font-size: 15px;
	margin-bottom: 3%;
}
.tcs .container .bnr{
	margin-bottom: 20%;
}

.tcs .container .bnr li{
	width: 100%;
	display: block;
	margin-bottom: 5%;
}

.tcs .container .bnr li p{
	padding-left: 5%;
}

.tcs .container .bnr li a p::before, .tcs .container .bnr li a p::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.tcs .container .bnr li a p::before {
	width: 11px;
	height: 11px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #0d68b3;
}
.tcs .container .bnr li a p::after {
	left: 4px;
	box-sizing: border-box;
	width: 4px;
	height: 5px;
	border: 2px solid transparent;
	border-left: 3px solid #ffffff;
}
.tcs .container .bnr li+li{
	margin-left: 0;
}
.tcs .container .bnr li img{
	width:100%;
	height:auto;
}
.tcs .container .bnr li a img {
	width: 100%;
	-webkit-transition: all .6s;
	transition: all .6s;
}
.tcs .container .bnr li a:hover img {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}
.tcs .container .bnr li a{
	display: block;
}

.tcs .container .bnr li a[target="_blank"] span {
}
.tcs .container .bnr li a[target="_blank"] span::after {
	position: absolute;
	top: 35%;
	content: "";
	background: url(/common/img/blank_icon02.png) no-repeat;
	background-size: 50% auto;
	width: 14px;
	height: 14px;
}



.energy .mv{
	background: url(/business/img/energy_mv_sp.jpg) no-repeat top center;
	background-size: cover;
	height: 150px;
	margin-bottom: 13%;
	margin-top: 0;
	position: relative;
}
.energy .mv::after {
	content: "";
	display: block;
	width: 60px;

	border-bottom: 4px solid #0060af;
	position: absolute;
	bottom: 0;
	left: 50%;
	-ms-transform: translate(-50%, 0%);
	-webkit-transform: translate(-50%, 0%);
	transform: translate(-50%, 0);
}
.energy .container .inner{
	width: 92%;
	margin: 0 auto;
	padding-bottom: 10%;
}
.energy .container .topimg {
	background: url(/business/img/energy_topimg_sp.jpg) no-repeat top left;
	background-size: 100% auto;
	height: auto;
	margin-bottom: 15%;
	padding-left: 0;
	padding-top: 7%;
	padding-bottom: 45%;
}
.energy .container .topimg p {
    font-size: 15px;
    width: 86%;
    margin: 0 auto 7%;
	letter-spacing: -0.06em;
}
.energy .container h3 {
    font-size: 16px;
    padding: 5%;
    margin-bottom: 5%;
}
.energy .container p {
    font-size: 14px;
    margin-bottom: 14%;
    line-height: 1.7;
}


.energy .container .guidance{
	margin-bottom: 20%;
}

.energy .container .guidance .guid_Block{
	margin-bottom: 15%;
}
.energy .container .guidance .guid_Block .left{
	width: 100%;
	float: none;
}
.energy .container .guidance .guid_Block p{
	
margin-bottom: 6%;
	
letter-spacing: -0.06em;
}
.energy .container .guidance .guid_Block a {
	width: 100%;
	margin-top: 7%;
}
.energy .container .guidance .guid_Block a:after {
	display:none;

}

.energy .container .guidance .guid_Block a span {
	font-size: 14px;
	line-height: 50px;
	letter-spacing:  normal;
}
.energy .container .guidance .guid_Block a span::after {
	position: absolute;
	top: 37%;
	right: 4%;
	content: "";
	background: url(/common/img/blank_icon04.png) no-repeat;
	background-size: contain;
	width: 13px;
	height: 13px;
}
.energy .container .guidance .guid_Block img{
	width: 100%;
	float: none;
}
.energy .container .effort{
	margin-bottom: 20%;
}
.energy .container .effort h3{
	margin-top: 8%;
}
.energy .container .effort p{
	margin-bottom: 20px;
}
.energy .container .effort_block{
	padding: 5%;
}

.energy .container .effort_block h4 {
	font-size: 14px;
	margin-bottom: 5%;
}
.energy .container .effort_block h4 span img{
	width: 24px;
}

.energy .container .effort_block dl{
	width: 100%;
}
.energy .container .effort_block dl dt,
.energy .container .effort_block dl dd{
	padding: 4%;
	border-top: none;
}

.energy .container .effort_block dl dt{
    width: 100%;
    float: none;
    display: block;
    border-bottom: 4px solid #f1f2f3;
}
.energy .container .effort_block dl dd{
	margin-left: 0;
    padding-bottom: 5%;
    border-left: none;
    border-top: 1px solid #dddddd;
    line-height: 1.7em;
}
	
}

@media screen and (max-width: 320px) {
.detail .link h3 {
	/* letter-spacing: -0.1em; */
}
.detail dl dt {
	letter-spacing: -0.1em;
}
.detail dl dd .tel {
	width: 84%;
}
.detail dl dd .formBtn a {
	width: 84%;
	/* background-position: 35px; */
	padding: 4% 5% 4% 13%;
}
.flow #main dl dt{
	font-size: 20px;
}
.flow #main ul{
	letter-spacing:-0.06em;
}
.flow #main ul li .tel {
    width: 95%;
}
.flow #main ul li .fax {
	width: 95%;
}
.flow #main ul li .mail {
	width: 95%;
}
.flow #main ul li .formBtn a {
	width: 93%;
	padding: 4% 3% 4% 13%
}

.food .container dl dt {
	letter-spacing: -0.1em;
}
.food .container dl dd span span{
	width: 56%;
}
.food .container dl dd .tel {
	width: 84%;
}
.food .container dl dd .formBtn a {
	width: 84%;
	/* background-position: 35px; */
	padding: 4% 3% 4% 13%;
}
.tcs .container .card ul li dl dd{
	width: 73%;
}
	
	.energy .container .topimg{
		    padding-bottom: 23%;
	}
}
