@charset "UTF-8";
/** ========================================
 * order 画像パス/content/dam/nttcom/hq/jp/business/services/network/network-operation/pss/img/
 * ====================================== */
body {
}

 .pc_only{
	display:block;
}
.tb_above{/*PCとタブレット*/
	display:block;
}
.tb_below{/*SPとタブレット*/
	display:none;
}
.sp_only{
	display:none;
}
@media screen and (max-width: 768px) {
	.pc_only{
		display:none;
	}
	.tb_above{/*PCとタブレット*/
		display:block;
	}
	.tb_below{/*SPとタブレット*/
		display:block;
	}
	.sp_only{
		display:none;
	}
}
@media screen and (max-width: 480px) {
	.pc_only{
		display:none;
	}
	.tb_above{/*PCとタブレット*/
		display:none;
	}
	.tb_below{/*SPとタブレット*/
		display:block;
	}
	.sp_only{
		display:block;
	}
}
.pss_wrap .tabNavigation_contents p{
	margin-bottom:0;
}
.pss_inner{
	width:1100px;
	margin:0 auto;
}
@media screen and (max-width: 768px) {
	.pss_inner{
		width:96%;
	}
}
h1{
	width:60%;
	margin-left: auto;
	margin-right: auto;
}
.pss_read{
	font-weight:bold;
	font-size:22px;
	line-height:1.8;
	margin:100px 0 30px;
}
.pss_topics h5{
	margin: 0;
	padding: 5px 15px 7px;
	color: #333;
	font-weight: bold;
	font-size: 14px;
	background: #ddd;
	line-height: 1.3 !important;
}
.pss_topics dl {
	border-bottom: 1px solid #eee;
	padding: 18px 0;
	font-size: 14px;
}
.pss_topics dt {
	font-weight: bold;
	display: inline-block;
	width: 20%;
	vertical-align: top;
}
.pss_topics dd {
	font-weight: bold;
	display: inline-block;
	width: 80%;
	vertical-align: top;
}
.pss_slider_title{
	margin-top:100px;
	font-size:20px;
}
.pss_slider_txt{
	margin-top:30px;
	font-size:20px;
}
@media screen and (max-width: 768px) {
	h1{
		width:100%;
	}
	.pss_read{
		margin-top:30px;
		font-size: 18px;
	}
	.pss_slider_title{
		margin-top:40px;
		font-size:16px;
	}
	.pss_slider_txt{
		margin-top:20px;
		font-size:16px;
	}
	.pss_topics{
		margin-top:70px;
	}
}
@media screen and (max-width: 480px) {
	.pss_slider_title {
		margin-top: 80px;
	}
	.pss_topics{
		margin-top:20px;
		margin-bottom:20px;
	}
	.pss_topics dt,.pss_topics dd{
		display:block;
		width: 100%;
		margin-bottom:10px;
	}
}
.pss_section_header{
	font-weight:bold;
	text-align:center;
	font-size:30px;
	line-height:1.8;
	margin-bottom:20px;
}
.pss_contents{
	background:#ffffff;
	padding-bottom:90px;
}
.pss_contents .first_txt{
	font-size:20px;
	line-height:1.7;
}
.ict_block{
	background:#232324;
	margin-top:120px;
	color:#fff;
	padding-bottom:30px;
}
.ict_block h3{
	margin:0;
}
.ict_block .pss_inner{
	position:relative;
}
.ict_block .img02{
	position:absolute;
	top:-170px;
	right:-140px;
}
.ict_body{
	display:flex;
	justify-content:space-between;
}
.ict_body .ict_list{
	width:790px;
	padding-top:250px;
	display:flex;
	flex-wrap: wrap;
}
.ict_body .ict_list .ict_item{
	width:40%;
	border-left:5px solid #a83d3e;
	padding:0 20px 0 30px;
	margin-bottom:40px;
}
.ict_body .ict_list .ict_item:nth-of-type(odd){
	width:60%;
}
.ict_body .ict_list .ict_item p + p{
	font-size:26px;
	margin-top:20px;
}
.ict_list_txt{
	background:#706f73;
}
.ict_list_txt p{
	color:#fff;
	font-size:28px;
	font-weight:bold;
	text-align:center;
	padding:10px;
}
@media screen and (max-width: 768px) {
	.pss_contents {
		padding-bottom: 30px;
	}
	.ict_block {
		margin-top:0;
	}
	.ict_block .img02{
		display:none;
	}
	.ict_body{
		display:block;
		padding:20px 0;
	}
	.ict_body .ict_list{
		width:100%;
		padding-top:30px;
	}
	.ict_body h3{
		font-size:30px;
		font-weight:bold;
		color:#fff;
		text-align:center;
	}
}
@media screen and (max-width: 480px) {
	.pss_section_header{
		font-size:16px;
	}
	.pss_contents .first_txt{
		font-size:14px;
	}
	.ict_body .ict_list{
		display:block;
	}
	.ict_body .ict_list .ict_item:nth-of-type(odd),
	.ict_body .ict_list .ict_item{
		width:100%;
	}
	.ict_body .ict_list .ict_item p{
		font-size:14px;
	}
	.ict_body .ict_list .ict_item p + p{
		font-size:18px;
	}
	.ict_body h3{
		font-size:24px;
	}
	.ict_list_txt p{
		font-size:20px;
	}
}

.third_conts{
	padding:40px 0;
}
.third_conts_read{
	font-size:24px;
	color:#5370e6;
	font-weight:bold;
	width:900px;
	margin: 0 auto;
	margin-bottom: 20px !important;
}
.third_conts_title{
	width:900px;
	margin: 0 auto 30px;
	display:flex;
}
.third_conts_title .txt{
	padding-left:20px;
	font-size:38px;
	line-height:1.2;
}
.third_conts_list{
	width:900px;
	margin: 0 auto 30px;
	display:flex;
}
.third_conts_list div{
	margin-left:20px;
	padding-top:30px;
}
.third_conts_list ul{
	list-style:none;
	margin:0;
	padding:0;
	padding-left:20px;
	border-left:2px solid #9ea4c5;
}
.third_conts_list ul li{
	font-size:20px;
	color:#091c6b;
	margin-bottom:20px;
	font-weight:bold;
}
.third_conts_txt{
	font-size:21px;
	text-align:center;
	margin-bottom:30px !important;
}
.third_conts table th,
.third_conts table td{
	border:2px solid #fff;
	font-weight:bold;
}

.third_conts table th{
	background:#154488;
	text-align:center;
	color:#fff;
	font-size:18px;
}
.third_conts table td{
	font-size:20px;
	color:#44546a;
	vertical-align:middle;
	padding:20px 15px;
}
.third_conts .flow{
	margin:0;
	padding:0;
	list-style:none;
}
.third_conts .flow li{
	background:#e1e2e9;
	margin-bottom:20px;
	padding:5px 20px 5px 60px;
	font-size:20px;
	color:#44546a;
	font-weight:bold;
	display:flex;
	align-items: center;
}
.third_conts .flow li img{
	width:73px;
}
.third_conts .flow li span{
	margin-left:30px;
}
.network_service_block{
	display:flex;
	justify-content: space-between;
}
.network_service_item{
	width:32%;
	border:2px solid #9fa0a0;
	border-top:6px solid #122747;
	background:#fff;
	padding:30px;
}
.network_service_item h4{
	margin:0 0 20px;
	font-size:22px;
}
.network_service_item p{
	font-size:14px;
}
.network_service_item a{
	display:block;
	margin:30px auto 0;
	width:90%;
	text-align:center;
	color:#fff;
	background:#091c6b;
	padding:20px;
}

@media screen and (max-width: 768px) {
	.third_conts_read,
	.third_conts_title,
	.third_conts_list{
		width:100%;
	}
	.third_conts_read{
		font-size:18px;
	}
	.third_conts_title .txt{
		font-size:24px;
	}
	.network_service_block{
		display:block;
	}
	.network_service_item{
		width:100%;
		margin-bottom:20px;
	}
}
@media screen and (max-width: 480px) {
	
	.third_conts_read{
		font-size:16px;
	}
	.third_conts_title .txt{
		font-size:20px;
	}
	.third_conts_list{
		display:block;
	}
	.third_conts_list div{
		margin-left:0;
		padding-left:0;
	}
	.third_conts_list ul{
		border-left: none;
		padding-top:20px;
		padding-left:0;
		border-top: 2px solid #9ea4c5;
	}
	.third_conts_list ul li{
		font-size:16px;
	}
	.third_conts_txt{
		font-size:18px;
	}
	.third_conts table th{
		font-size:12px;
	}
	.third_conts table td{
		font-size:14px;
		width:50%;
		font-weight:normal;
	}
	.third_conts .flow li{
		padding:5px;
		font-size:14px;
	}
	.third_conts .flow li span{
		margin-left:10px;
	}
}
.pss_sub_header {
	position: relative;
	margin: 80px 0;
	padding: 0 1.8rem 17px 1.8rem;
	border-bottom: 2px solid #a2a5ac;
	font-size: 26px;
	font-weight: bold;
	text-align: center;
	line-height: 1;
}
.pss_sub_header::before {
	content: "";
	position: absolute;
	bottom: -32px;
	left: 50%;
	width: 0;
	height: 0;
	border: 16px solid transparent;
	    border-top-color: transparent;
	    border-top-style: solid;
	    border-top-width: 16px;
	border-top: 16px solid #a2a5ac;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}
.pss_sub_header::after {
	content: "";
	position: absolute;
	bottom: -28px;
	left: 50%;
	width: 0;
	height: 0;
	border: 14px solid transparent;
	    border-top-color: transparent;
	    border-top-style: solid;
	    border-top-width: 14px;
	border-top: 14px solid #f2f2f2;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}


@media screen and (max-width: 480px) {
	.pss_sub_header{
		margin:60px 0 30px;
	}

}





.sdpf_block{
	background:url(/content/dam/nttcom/hq/jp/business/services/network/network-operation/pss/img/sdpfSlider_bg.jpg) no-repeat top center #eaeef4;
	background-size:cover;
	border-top:1px solid #333;
	padding:60px 0 40px;
}

.sdpf_block h2{
	margin: 0 0 30px;
	text-align:center;
}
.sdpf_block h2 img{
	margin:0 auto;
}
.sdpf_block .top_txt{
	margin: 30px auto;
	margin-bottom:80px;
	color:#091c6b;
	font-size: 32px;
	font-weight: bold;
	text-align: center;
}

@media screen and (max-width: 768px) {
	.sdpf_block h2{
		text-align:center;
	}
	.sdpf_block h2 img{
		margin:0 auto 30px;
		max-width:100%;
	}
	.sdpf_block .top_txt{
		font-size: 24px;
	}
}
.one_answer .one_txt{
	color:#1d8eff;
}
.one_answer h3{
	margin:0;
	padding:0;
	font-weight: bold;
}
.one_answer_read{
	display:flex;
	justify-content: space-between;
	margin-bottom:30px;
}
.one_answer_read h3{
	font-size:30px;
	width:40%;
}
.one_answer_read p{
	width:55%;
}
.one_flexblock{
	display:flex;
	justify-content: space-between;
	margin-bottom:80px;
}
.one_flexblock .one_flexitems{
	width:20%;
}
.one_flexblock .one_flexitems h3{
	padding-bottom:48px;
	font-size:30px;
}
.one_flexblock .one_flexitems .lines{
	padding-bottom:10px;
}
.one_flexblock .one_flexitems p{
	font-size:14px;
}

@media screen and (max-width: 768px) {
	.one_answer_read,.one_flexblock{
		display:block;
		margin-bottom:30px;
	}
	.one_answer_read h3{
		font-size:24px;
		width:100%;
		margin-bottom:10px;
	}
	.one_answer_read p{
		width:100%;
		font-size:14px;
	}
	.one_flexblock .one_flexitems{
		width:100%;
	}
	.one_flexblock .one_flexitems h3{
		padding-bottom:18px;
		font-size:24px;
	}
	.one_flexblock .one_flexitems p{
		font-size:14px;
		margin-bottom:30px;
	}
	.one_flexblock{
		margin-bottom:60px;
	}
}


/** ========================================
 * タブ2つ目
 * ====================================== */

.case_link{
	background:#f3f3f3;
	padding:30px 30px 20px;
	display:flex;
	justify-content: space-between;
	width:960px;
	margin:0 auto 60px;
}
.case_link p{
	width:30%;
	font-size:24px;
	font-weight:bold;
}
.case_link ul{
	width:70%;
	margin:0;
	padding:0;
	list-style:none;
}
.case_link ul li{
	margin-bottom:10px;
}
.case_link ul li:before{
	content:"・";
}
.case_wrap{
	background:#fffff;
	padding:60px 0 20px;
}
.case_wrap .container{
	max-width: 960px;
	margin: 0 auto;
	position: relative;
}
.case_wrap .container h2{
	font-weight:bold;
	width:55%;
	font-size:40px;
	line-height:1.5;
}
.case_wrap .container h2:before{
	content:"case";
	display:block;
	color:#4b0082;
	font-size:28px;
}
.case_wrap .section_image{
	position: absolute;
	right: -200px;
	top: 0;
}
.case_wrap #case02 h2{
	padding-left:470px;
	width:100%;
}
.case_wrap #case02 .section_image{
	right: auto;
	left: -200px;
}
.case_wrap .task_area {
	background:#fff;
	padding:20px 40px 40px;
	margin: 124px 0;
	position: relative;
}
.task_title{
	background:url(/content/dam/nttcom/hq/jp/business/services/network/network-operation/pss/img/case_icon.png) no-repeat left center;
	border-bottom:1px solid #828181;
	padding:20px 0 20px 130px;
	margin-bottom:20px;
}
.task_title .task{
	font-weight:bold;
	font-size:36px;
}
.task_title .txt{
	font-size:24px;
}
.trouble_area .trouble_point{
	color:#fff;
	background:#57677e;
	display:inline-block;
	padding:10px;
	width:260px;
	text-align:center;
}
.trouble_area ul{
	margin:20px 0 40px;
	padding:0;
	list-style:none;
}
.trouble_area ul li{
	font-size:20px;
}
.trouble_area ul li:before{
	content:"・";
}
.proposal_block{
	border:1px solid #8194ef;
	padding:20px;
	margin-top:20px;
	font-size:18px;
}
.proposal_block .ttl{
	color:#5370e6;
	font-size:20px;
	font-weight:bold;
	margin-bottom:20px;
}

@media screen and (max-width: 768px) {
	.case_link{
		background:#f3f3f3;
		padding:20px;
		display:block;
		width:96%;
		margin:0 auto 30px;
	}
	.case_link p,.case_link ul{
		width:100%;
	}
	.case_link p{
		margin-bottom:20px;
	}
	.case_wrap{
		padding:30px 0;
	}
	.case_wrap .container{
		width:100%;
		position:static;
	}
	.case_wrap .container h2{
		width:96%;
		margin-top:0;
		margin-left:auto;
		margin-right:auto;
	}
	.case_wrap .container h2 br{
		display:none;
	}
	.case_wrap .section_image{
		position: static;
		right: auto;
		top: auto;
	}
	.case_wrap #case02 h2{
		padding-left:0;
		width:96%;
	}
	.case_wrap #case02 .section_image{
		right: auto;
		left: auto;
	}
	.case_wrap .task_area{
		margin:0 0 30px;
		padding:0 20px 20px;
	}
}
@media screen and (max-width: 480px) {

	.case_wrap .container h2{
		font-size:24px;
		margin-bottom:20px;
	}
	.case_wrap .task_area{
		padding:10px 10px 20px;
	}
	.task_title{
		background: none;
		padding:20px 0 ;
	}
	.task_title .task{
		font-size:24px;
	}
	.task_title .txt,.trouble_area ul li{
		font-size:18px;
	}
}

.tabNavigation,
.tabNavi-transition {
	background-color: #ffffff;
}

.tabNavigation .tabLayout,
.tabNavi-transition .tabLayout {
background-color: rgb(247,247,247);
}