@charset "UTF-8";
/*!
 * 追加のナビ用
*/

h1{
	font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Helvetica, sans-serif !important;
	font-weight:bold !important;
	font-size: 42px !important;
	margin: 30px auto 30px !important;
}
@media screen and (max-width: 480px) {
	h1{
		font-size: 2rem !important;
		margin: 20px auto 10px !important;
	}
}

/* =========================================================
 * メニュー
 * @
 * ====================================================== */
.add_menu {
	z-index: 969;
	position: fixed;
	width: 100%;
	background: #e1e3e6;
	font-size:14px;
}
.add_menu a{
	color:#333;
}
.add_menu .add_menu_parent li a{
	color: #004386;
	position: relative;
}
.add_menu .add_menu_parent.current,
.add_menu .current{
	background:#b0b4bb;
}
.add_menu_mobileToggle {
	display: none;
}
.add_menu .add_menu_parent li a:after {
	content: url(/content/dam/nttcom/hq/jp/business/services/network/internet-connect/ocn-business/img/icon_navarrow.png);
	position: absolute;
	top: 50%;
	right: 10px;
	margin-top: -12px;
}


.add_menu ul {
	letter-spacing: -.5em;
}
.add_menu li {
	letter-spacing: normal;
}

main.service_kobetsu ul.add_menu_wrap,
.add_menu ul.add_menu_wrap {
	width: 1280px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
	text-align: center;
}

.add_menu_wrap > li {
	display: inline-block;
	/* padding: 16px 30px; */
	margin: 0;
}


main.service_kobetsu .add_menu_wrap li,
ul.add_menu_wrap li {
	margin: 0;
}

main.service_kobetsu ul.add_menu_wrap > li,
ul.add_menu_wrap > li {
	display: inline-block;
}
main.service_kobetsu ul.add_menu_wrap > li a,
ul.add_menu_wrap > li a {
	display: block;
	padding: 16px 30px;
}


.add_menu_wrap > li:hover {
	background: #b0b4bb;
	cursor: pointer;
}
.add_menu_wrap > li.contact{
	background: #fed531;
}
.add_menu_wrap > li.customer{
	background: #7782ae;
}
.add_menu_wrap > li.contact:hover {
	background: #fede61;
}
.add_menu_wrap > li.customer:hover {
	background: #5386d2;
}
.add_menu_wrap > li.customer a{
	color:#fff;
}
.add_menu .add_menu_parent li:hover a{
	color: #fff;
}
.add_menu .add_menu_parent li:hover a:after {
	content: url(/content/dam/nttcom/hq/jp/business/services/network/internet-connect/ocn-business/img/icon_navarrow_hover.png);
}

.add_menu_parent {
	position: relative;
}

.add_menu_child {
	display: none;
	position: absolute;
	list-style: none;
	top: 100%;
	left: -1px;
	margin: 0;
	padding: 0;
	background: #e1e3e6;
	border-top: 1px solid #b0b4bb;
	text-align: left;
	width:265px;
}

.add_menu_child a {
	display: block;
	width: 100%;
	padding: 12px 20px;
}

.add_menu_child a:hover {
	background: #5e71a0;
	color: #fff;
}



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

	.add_menu_mobileToggle {
		display: block;
		padding: .5rem;
	}

	main.service_kobetsu ul.add_menu_wrap,
	.add_menu ul.add_menu_wrap {
		display: none;
		width: 100%;
		text-align: left;
	}
	main.service_kobetsu ul.add_menu_wrap > li,
	.add_menu ul.add_menu_wrap >li {
		display: list-item;
		padding: 0;
		background-color: #193477;
		border-top: 1px solid #fff;
	}
	.add_menu_wrap > li.contact{
		background: #193477;
	}
	.add_menu_wrap > li.customer{
		background: #193477;
	}
	.add_menu_wrap > li.contact:hover {
		background: #193477;
	}
	.add_menu_wrap > li.customer:hover {
		background: #193477;
	}
	.add_menu_wrap > li,
	.add_menu_wrap > li > a {
		color: #fff;
	}
	.add_menu_wrap > li > a {
		display: block;
		padding: 16px;
	}
	
	.add_menu .add_menu_parent.current{
		background:#193477;
	}
	.add_menu .add_menu_parent li:hover a {
		color: #004386;
	}

	.add_menu .add_menu_parent li a:hover:after {
		content: url(/content/dam/nttcom/hq/jp/business/services/network/internet-connect/ocn-business/img/icon_navarrow.png);
	}

	.add_menu_wrap > li:hover {
		background: #193477;
	}

	.add_menu_child a:hover{
		background: #fff;
		color: #004386;
	}

	.add_menu_child {
		display: none;
		position: static;
		list-style: none;
		top: auto;
		left: auto;
		margin: 0;
		padding: 0;
		background: #fff;
		border-top: none;
	}
	.add_menu_child >li {
		border-top: 1px solid #d7d9dd;
	}

	span.add_menu_mobileToggle{
		position: relative;
	}

	span.add_menu_mobileToggle:before {
		content: url(/content/dam/nttcom/hq/jp/business/services/network/internet-connect/ocn-business/img/sp_menu_icon01.png);
		position: absolute;
		top: 50%;
		right: 5px;
		margin-top: -12px;
	}

	span.add_menu_mobileToggle.menu-open:before {
		content: url(/content/dam/nttcom/hq/jp/business/services/network/internet-connect/ocn-business/img/sp_menu_icon02.png);
	}

	.add_menu_wrap > li>a{
		position: relative;
	}

	.add_menu_wrap > li:not(.add_menu_parent) > a:before{
		content: url(/content/dam/nttcom/hq/jp/business/services/network/internet-connect/ocn-business/img/icon_wh_arrow.png);
		position: absolute;
		top: 50%;
		right: 14px;
		margin-top: -12px;
	}

	.add_menu_wrap > li.add_menu_parent>a:before{
		content: url(/content/dam/nttcom/hq/jp/business/services/network/internet-connect/ocn-business/img/icon_wh_plus.png);
		position: absolute;
		top: 50%;
		right: 10px;
		margin-top: -12px;
	}

	.add_menu_wrap > li.add_menu_parent.child-open>a:before{
		content: url(/content/dam/nttcom/hq/jp/business/services/network/internet-connect/ocn-business/img/icon_wh_minus.png);
	}

	ul.add_menu_wrap{
		height: 350px;
		overflow: auto;
		-webkit-overflow-scrolling: touch;
		border-bottom: 1px solid #ccc;
	}
	ul.add_menu_wrap:last-child{
		border-bottom: none;
	}
	.add_menu_child{
		width: 100%;
	}

}


/* =========================================================
 * パンくず
 * @
 * ====================================================== */
main.service_kobetsu .add_breadcrumbs,
.thj_add_breadcrumbs {
	width:960px;
	margin:0 auto;
	/*margin-bottom: 60px;*/
}
main.service_kobetsu .add_breadcrumbs ul,
.thj_add_breadcrumbs ul {
	margin:0;
	padding:0;
	margin-top:10px;
}
main.service_kobetsu .add_breadcrumbs li,
.thj_add_breadcrumbs li {
	display:inline;
	margin: 0;
	font-size:12px;
}


main.service_kobetsu .add_breadcrumbs li a:after,
.thj_add_breadcrumbs li a:after {
	content:"  ＞  ";
}


@media screen and (max-width: 480px) {
	main.service_kobetsu .add_breadcrumbs,
	.thj_add_breadcrumbs {
		width: 100%;
		margin-bottom: 30px;
	}
}



/* =========================================================
 * 調整
 * @
 * ====================================================== */
 
@media screen and (max-width: 480px) {
	main.service_kobetsu .computeFlatTypeSection {
		margin-top: 50px;
	}

}

/* =========================================================
 * 既存パンくずを消す20180514
 * @
 * ====================================================== */
.breadcrumb_body {
	/*display: none;*/
}

/* =========================================================
 * H1下マージンつめる
 * @
 * ====================================================== */
.computeFlatTypeSection {
	margin-bottom: 0;
}
.computeFlatTypeSection .text .spPer90{
	margin-bottom:20px;
}