@charset "UTF-8";
/* CSS Document */

/* 共通部分 */

.sp{
	display: none;
}






/*導入事例*/
.sec-case .lnk-list {
    margin-right: -23px;
}

.sec-case .lnk-list li {
    float: left;
    margin-right: 23px;
	width: 344px;
    margin-bottom: 24px;

}
.sec-case .lnk-list li a {
    display: flex;
    align-items: center;
}

.surface .lineup-wrap{
	width: 1038px;
	margin: 0 auto;
}
.surface .lineup-clm{
	background-color: #f7f7f7;
	padding-top: 80px;
	padding-bottom: 90px;
}
.surface .lineup-clm .lineup-ttl{
	text-align: center;
	font-size: 175%;
	font-weight: bold;
	margin-bottom: 60px;
	margin-left: 205px;
}
.surface .lineup-clm .sub-clm{
	width: 763px;
	margin: 0 auto;
	margin-bottom: 60px;
	float: none;
}
.surface .lineup-clm .inq-common{
	width: 862px;
}
.surface .lineup-clm .inq-common .inq-txt{
	width: 628px;
	float: right;
}

/* 表面処理トップ */
#SURF-IDX .main-ttl-wrap .txt-01 {
    margin-bottom: 1.75em;
    margin-top: -4em;
    text-align: right;
}
#SURF-IDX .ttl-01 {
	position: relative;
    padding-top: 30px;
}
#SURF-IDX .inner .ttl-01:after{
	content: "";
    background-image: url(/imgs/products/surface/surf_img_10.png);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    width: 185px;
    height: 185px;
    top: 20px;
    right: 175px;
}
#SURF-IDX .lineup-clm .ttl-02{
	padding-top: 21px;
}
#SURF-IDX .ttl-01 .cnt-ttl-01 {
    text-align: left;
}
#SURF-IDX .ttl-01 .cnt-ttl-03 {
    line-height: 0.5em;
    margin: 0;
    padding: 0;
    display: inline-block;
/*    max-width: 117px;*/
}
#SURF-IDX .sub-bg-02 .txt-01 {
	/* color:#fff; */
	color: #333;
}
#SURF-IDX .sub-bg-02{
	height: 495px;
	padding-top: 70px;
}
#SURF-IDX .sub-bg-02::before{
	/* background-image: url(/imgs/products/surface/surf_bg.jpg); */
	background-color: #f8ebec;
	height: 565px;
}
#SURF-IDX .btn-list > .btn-child > a{
	height: 132px;
}
#SURF-IDX.surface .cnt-ttl-02{
	/* display: inline-block; */
}
#HIGH-CAPACITY .sub-bg-02 .list-11,
#SURF-IDX .sub-bg-02 .list-11{
	margin-right: -140px;
}
#HIGH-CAPACITY .sub-bg-02 .list-11 li,
#SURF-IDX .sub-bg-02 .list-11 li{
	width: 420px;
	/* color: #fff; */
	float: left;
	margin-right: 140px;
	margin-bottom: 50px;
}
#SURF-IDX .sub-bg-02 .list-11 li{
	width: 510px;
	margin-right: 60px;
	margin-bottom: 40px;
}
#HIGH-CAPACITY .sub-bg-02 .list-11 .list-11-child,
#SURF-IDX .sub-bg-02 .list-11 .list-11-child{
	font-size: 125%;
	font-weight: bold;
	margin-bottom: 0.5em;
}
#SURF-IDX.surface .lineup-clm{
	background-color: inherit;
}
#SURF-IDX.surface .lineup-clm .sub-clm{
	width: 782px;
}
#SURF-IDX .inq-common .inq-txt{
	width: 550px;
	float: right;
}
.surface .tbl-right-txt {
	float: right;
	margin-bottom: 0;
}
#MRT-HPR .tbl-02 tbody th,
#MRM .tbl-02 tbody th{
	text-align: left;
}

/* 電源機器 中ページ */
.surface .cnt-ttl-02{
	font-size: 1.6rem;
	display: block;
}
.surface .slide-btn{
	display: block;
}
.surface .slide-inner{
	border: 1px solid #ddd;
	padding: 26px;
	display: none;
}
.surface .opend .slide-inner{
	display: block;
}
.surface .feature{
	counter-reset:cp_clist;
}
.surface .feature-btn-01{
	float: right;
	margin-left: 60px;
}
.surface .feature-btn-02{
	float: right;
	width: 330px;
	margin-left: 60px;
}
.surface .feature-btn-03{
	float: right;
	margin-left: 60px;
}
.surface .feature-btn-list{
	display: flex;
	justify-content: center;
}
.surface .feature-btn-list .btn-03{
	width: 400px;
	margin: 0 18px;
}
.surface .feature-btn-list .btn-03 a{
	padding: 10px 14px;
}
.surface .feature-btn-ttl{
	padding-top: 0.75em;
}
.surface .feature-ttl{
	display: block;
	position: relative;
	background-color: #ddd;
	padding: 26px 62px 26px 62px;
	font-size: 2.2rem;
	font-weight: bold;
	color: #333;
}
.surface .slide-btn .feature-ttl:hover{
	opacity: 0.7;
	text-decoration: none;
}
.surface .slide-btn .feature-ttl{
	background-image: url(/common/imgs/ico-arw-08.png);
	background-repeat: no-repeat;
	background-position: right 29px center;
}
.surface .opend .slide-btn .feature-ttl{
	background-image: url(/common/imgs/ico-arw-07.png);
}
.surface .feature-ttl::before{
	counter-increment: cp_clist;
	content: counter(cp_clist);
	position: absolute;
	font-size: 72.72%;
	display:inline-block;
	top: 50%;
	left: 0;
	background: #d54651;
	color: #fff;
	font-weight:bold;
	border-radius: 50%;
	width: 22px;
	height: 22px;
	line-height: 22px;
	text-align:center;
	transform: translateY(-50%);
	margin-left: 26px;
}
.surface .tbl-02 th{
	vertical-align: middle;
}
.icon-01{
	display: inline-block;
	font-size: 1.4rem;
	font-weight: bold;
	background-color: #D1444F;
	color: #fff;
	border-radius: 2em;
	padding: 0.5em 0.9em;
	margin-left: 10px;
	line-height: 1;
}
.surface .sub-clm-01{
	overflow: hidden;
	/* display: inline-block; */
	/* width: calc( 100% - 384px); */
}
.surface .sub-clm-02{
	float: right;
	margin-left: 40px;
	width: 420px;
}
.surface .sub-clm-03{
	float: left;
	margin-right: 40px;
	width: 344px;
}
.surface .sub-clm-04{
	float: left;
	margin-right: 40px;
	width: 400px;
}
.surface .sub-clm-05{
	margin-bottom: 40px;
}

.surface .img-01{
	text-align: center;
}
.surface .img-02{
	border: 1px solid #ddd;
	box-sizing: border-box;
}
.surface .img-03{
	margin-left: 3em;
}
.surface .sub-clm-05 .img-02{
	border: 1px solid #ddd;
	box-sizing: border-box;
	padding: 10px;
}
.surface .list-11 {
	margin-bottom: 32px;
}
.surface .list-11 .ttl-04 {
	margin-top: -1.9em;
}
.surface .list-11 .list-btm {
	margin-bottom: 1em;
}
.surface .ph-left {
	float: left;
}
.surface .ph-right {
	float: right;
}
#POWER.surface .ph-left {
	width: 470px;
}
#POWER.surface .ph-right {
	width: 470px;
}

.surface .inner-02.ph  {
	text-align: center;
}
.surface .cap {
	display: block;
	text-align: center;
}
#HKD-G .feature .list-03>li{
	clear: both;
}
#HKD-G .feature .list-03>li>.list-09{
	float: left;
}

#MRT #MRT-B{
	counter-reset: inherit;
}
#MRT #MRT-B,
#MRT #MRT-C{
	padding-top: 136px;
	margin: -136px auto 100px;
}
/* page-link */
#MRT .list-nv>li {
	border-right: 1px solid #dddddd;
	float: left;
	padding: 0 23px;
	line-height: 20px;
	margin-bottom: 0.5em;
	text-align: center;
}
#MRT .list-nv>li:first-child {
	border-left: 1px solid #dddddd;
}
#MRT .list-nv>li>a::after {
	content: "";
	display: inline-block;
	width: 12px;
	height: 7px;
	background-image: url(/common/imgs/ico-arw-09.png);
	margin-left: 11px;
	vertical-align: middle;
}
#MRT .list-nv>li>a:hover {
	opacity: 0.5;
	text-decoration: none;
}

/* タブ */

.tab-clm .category-clm {
	display: none;
}
.tab-clm .category-clm.check-category {
	margin-top: -2px;
	display: block;
    border: #aaa 2px solid;
    padding: 63px 48px 48px;
	background: #fff;
}


.tab-clm .category-tab-nv li {
    width: 210px;
	float: left;
    margin-right: 2px;
    text-align: center;
    margin-right: 5px;
	margin-left: 5px;
	position: relative;
}
.tab-clm .category-tab-nv li a {
    font-size: 150%;
    color:#fff;
    background: #cf0c15;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    text-decoration: none;
    display: block;
    padding: 30px 30px 23px;
    text-align: left;
	border-bottom:2px #cf0c15 solid;
	position: relative;
	overflow: hidden;
}
.tab-clm .category-tab-nv li a:hover {
    background: #e2444c;
}
.tab-clm .category-tab-nv li.category-tab-bt a {
	color: #cf0c15;
	font-weight: bold;
	background-color: #f0f0f0;
	border: 2px solid #aaa;
	/* border-bottom: 2px solid #f0f0f0; */
}
.tab-clm .category-tab-nv li.category-tab-bt a span{
	position: inherit;
	z-index: 100;
}
.tab-clm .category-tab-nv li.category-tab-bt a:hover{
	background-color:#f7f7f7;
}
.tab-clm .category-tab-nv li.category-tab-bt.category-tab-nv1 {
	width: 440px;
}
.tab-clm .category-tab-nv li.category-tab-bt.category-tab-nv2 {
	width: 360px;
}
.tab-clm .category-tab-nv li.category-tab-bt.category-check a{
	font-weight: bold;
	background-color:#fff;
	border-top: #aaa 2px solid;
	border-right: #aaa 2px solid;
	border-left: #aaa 2px solid;
	border-bottom: #fff 2px solid;
}
.tab-clm .category-tab-nv li.category-tab-bt.category-check a:hover{
	background-color: #f7f7f7;
}

/* ラベル部分 右上に表示 */
.tab-clm .category-tab-nv li a::before {
    content: "";
    top: 0;
    right: 0;
    border-bottom: 3.5em solid transparent;
    border-right: 3.5em solid #fffbc4; /* ラベルの色はここで変更 */
	position: absolute;
	z-index: 1;
}
.tab-clm .category-tab-nv li a#NV1::before{
	border-right: 3.5em solid #fffbc4; /* ラベルの色はここで変更 */
}
.tab-clm .category-tab-nv li a#NV2::before{
	border-right: 3.5em solid #cbe8ec; /* ラベルの色はここで変更 */
}

.tab-clm .category-tab-nv {
	margin-bottom: 0;
	margin-left: -5px;
}

#FLS .icon-list li{
	display: flex;
	align-items: center;
}
#FLS .icon-list li + li{
	margin-top: 0.75em;
}
#FLS .icon-list .icon {
	flex-basis: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-right: 1em;
}
#FLS .icon-list .icon img {
	max-height: 40px;
	width: auto;
}



/* --------------------------------------------
SP
--------------------------------------------*/
@media only screen and (max-width: 640px) {

	/*共通部分*/
	.sp{
	display: block;
	}

	/*導入事例*/
	.sec-case .lnk-list a,
	.sec-case .lnk-list li {
		width: 100%;
	}
	.sec-case .lnk-list {
	    margin-right: 0;
	}

	.sec-case .lnk-list li {
	    margin-right: 0;
	}

	/* 表面処理トップ */
	#SURF-IDX .main-ttl-wrap .txt-01 {
    /* text-align: center; */
    margin-top: -1.5em;
    margin-bottom: 0.5em;
	}
	#SURF-IDX .inner .ttl-01:after {
	    background-image: none;
	}
	#SURF-IDX .cont-photo-02{
		width: 50%;
		margin: 0 auto;
	    margin-bottom: 6.25vw;
	    margin-top: -7.03125vw;
	}
	#SURF-IDX .sub-bg-02{
		/* background-image: url(/imgs/products/surface/surf_bg.jpg); */
		background-color: #f8ebec;
		background-position: center;
		background-size: cover;
		height: auto;
		padding-top: 3em;
		padding-bottom: 1em;
	}
	#SURF-IDX .sub-bg-02::before{
		height: 550px;
	}
	#SURF-IDX .btn-list > .btn-child > a{
		height: 132px;
	}
	#SURF-IDX.surface .cnt-ttl-02{
		display: inline-block;
	}
	#HIGH-CAPACITY .sub-bg-02 .list-11,
	#SURF-IDX .sub-bg-02 .list-11{
		margin-right: 0;
	}
	#HIGH-CAPACITY .sub-bg-02 .list-11 li,
	#SURF-IDX .sub-bg-02 .list-11 li{
		width: auto;
		float: none;
		margin-right: 0;
		margin-bottom: 3em;
	}
	#SURF-IDX.surface .lineup-clm .sub-clm{
		width: auto;
	}
	#SURF-IDX .inq-common .inq-txt{
		width: auto;
		float: none;
	}
	/* 共通部分 */
	.surface .lineup-wrap{
		width: auto;
		margin-bottom: 3em;
	}
	.surface .lineup-clm{
		padding-top: 3em;
		padding-bottom: 2em;
	}
	.surface .lineup-clm .lineup-ttl{
		margin-bottom: 1em;
		margin-left: 0;
	}
	.surface .lineup-clm .sub-clm{
		width: auto;
	}
	.surface .lineup-clm .inq-common{
		width: auto;
	}
	.surface .lineup-clm .inq-common .inq-txt{
		width: auto;
		float: none;
	}

	/* 電源機器 中ページ */
	.surface .feature-btn-01,
	.surface .feature-btn-02,
	.surface .feature-btn-03{
		float: none;
		max-width: 100%;
		margin-left: 0;
	}
	.surface .feature-btn-03{
		margin-bottom: 7vw;
	}
	.surface .feature-ttl{
		padding-top: 1em;
		padding-bottom: 1em;
	}
	.surface .sub-clm-01{
		width: auto;
	}
	.surface .sub-clm-02{
		float: none;
		margin-left: 0;
		width: auto;
	}
	.surface .sub-clm-03{
		float: none;
		margin-right: 0;
		width: auto;
	}
	.surface .sub-clm-04{
		float: none;
		margin-right: 0;
		width: auto;
	}
	.surface .slide-inner{
		padding: 3%;
	}
	.surface .ph-left {
		width: auto;
		float: none;
	}
	.surface .ph-right {
		width: auto;
		float: none;
	}
	#POWER.surface .ph-left {
		width: auto;
		margin-bottom: 2em;
	}
	#POWER.surface .ph-right {
		width: auto;
	}
	#HKD-G .feature .list-03>li>.list-09{
	float: none;
	}

	.sp-main-img{
		overflow: hidden;
	}
	.sp-main-img img{
		height: 40vw;
		object-fit: cover;
		object-position: center;
	}

	.surface .feature-btn-list{
		display: block;
	}
	.surface .feature-btn-list .btn-03{
		width: auto;
		margin: 0 0 1em;
	}
	.surface .feature-btn-list .btn-03 a{
		/* padding: 10px 14px; */
	}
	.surface .feature-btn-ttl{
		padding-top: 0;
	}
	/* タブ */
	.tab-clm .clm-nv-01 .category-clm {
		padding: 7% 2%;
	}
	.tab-clm .category-tab-nv li a {
		font-size: 5vw;
		padding: 3vw 3vw 1.5vw;
		line-height: 1.25;
	}
	.tab-clm .category-tab-nv li.category-tab-bt.category-tab-nv1,
	.tab-clm .category-tab-nv li.category-tab-bt.category-tab-nv2 {
		width: 44vw;
	} 

	/* ラベル部分 右上に表示 */
	.tab-clm .category-tab-nv li a::before {
		border-bottom: 11vw solid transparent;
		border-right: 11vw solid #fffbc4; /* ラベルの色はここで変更 */
	}
	.tab-clm .category-tab-nv li a#NV1::before{
		border-right: 11vw solid #fffbc4; /* ラベルの色はここで変更 */
	}
	.tab-clm .category-tab-nv li a#NV2::before{
		border-right: 11vw solid #cbe8ec; /* ラベルの色はここで変更 */
	}

	#MRT #MRT-B,
	#MRT #MRT-C {
	padding-top: 19.48%;
	margin: -19.48% auto 17.19vw;
	}
	#MRT .list-nv>li {
		float: none;
		margin-bottom: 1em;
	}
	#MRT .list-nv>li:first-child {
		border-left: none;
	}
}