@charset "UTF-8";
/*!
 * Smart Data Platform
*/
/* =========================================================
 * ページ独自部分
 * @ PAGE ORIGINAL
 * ====================================================== */
body {
	background-image: none;
}

 .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;
	}
}

/* =========================================================
 * スライダー
 * @ PAGE slider
 * ====================================================== */
/* メインスライダー */
.slider-pro {
	text-align: center;
}
.sp-slide {
	opacity: 1;
}
.sp-slide.sp-selected {
	opacity: 1;
	z-index: 1;
	background: #fff;
}

/* Arrows
--------------------------------------------------*/
.sp-arrows {
	position: absolute;
}
.sp-arrow {
	position: absolute;
	display: block;
	width : -webkit-calc((100% - 929px) / 2);
	width : calc((100% - 929px) / 2);
	height: 220px;
	cursor: pointer;
}

.sp-fade-arrows {
	opacity: .5;
}
.sp-slides-container:hover .sp-fade-arrows {
	opacity: .5;
}

.sp-horizontal .sp-arrows {
	width: 100%;
	left: 0;
	top: 0;
	margin-top: 0;
}
.sp-horizontal .sp-previous-arrow {
	left: 0;
	background-color: #000;
}
.sp-horizontal .sp-next-arrow {
	right: 0;
	background-color: #000;
}
.sp-previous-arrow:before,
.sp-previous-arrow:after,
.sp-next-arrow:before,
.sp-next-arrow:after {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	background-color: #FFF;
}
.sp-previous-arrow:before {
	left: 0;
	top: 0;
	-webkit-transform: skew(145deg, 0deg);
	-ms-transform: skew(145deg, 0deg);
	transform: skew(145deg, 0deg);
}
.sp-previous-arrow:after {
	left:0;
	top: 0;
	-webkit-transform: skew(-145deg, 0deg);
	-ms-transform: skew(-145deg, 0deg);
	transform: skew(-145deg, 0deg);
}
.sp-next-arrow:before {
	right: 0;
	top: 0;
	-webkit-transform: skew(35deg, 0deg);
	-ms-transform: skew(35deg, 0deg);
	transform: skew(35deg, 0deg);
}
.sp-next-arrow:after {
	right: 0;
	top: 0;
	-webkit-transform: skew(-35deg, 0deg);
	-ms-transform: skew(-35deg, 0deg);
	transform: skew(-35deg, 0deg);
}



/* #slide-01
--------------------------------------------------*/
#slide-01{
	margin-bottom: 70px!important;
}
#slide-01 .sp-arrows {
	top: auto;
	bottom: 0;
	margin-top: -24px;
}
#slide-01 .sp-arrow {
	width: 32px;
	height: 48px;
}
#slide-01 .sp-previous-arrow {
	background: url(/content/dam/nttcom/hq/jp/business/sdpf/img/top_slider_arrow-left.png) no-repeat center center;
	background-size:10px;
	left: 41%;
}
#slide-01 .sp-next-arrow {
	background: url(/content/dam/nttcom/hq/jp/business/sdpf/img/top_slider_arrow-right.png) no-repeat center center;
	background-size:10px;
	right: 41%;
}
#slide-01 .sp-buttons {
	position: relative;
	display: inline-block;
	width: auto;
	padding-top: 10px;
	text-align: center;
}
#slide-01 .sp-button {
	background: #8c99bb;
	border:none;
	margin: 10px;
	width: 12px;
	height: 12px;
}
#slide-01 .sp-button.sp-selected-button{
	background: #0e367d;
}
#slide-01 .image_component{
	width: 100%!important;
	height: 100%!important;
	margin-bottom: 0;
}
#slide-01 .image_component img{
	width: 100%;
}
#slide-01 .sp-slide iframe{
	height: 100%;
}

@media screen and (max-width: 768px){
	#slide-01 {
		margin-bottom: 40px!important;
	}
	#slide-01 .sp-previous-arrow{
		left: 35%;
	}
	#slide-01 .sp-next-arrow{
		right: 35%;
	}
}
@media screen and (max-width: 480px){
	#slide-01 .sp-previous-arrow{
		left: 25vw;
	}
	#slide-01 .sp-next-arrow{
		right: 25vw;
	}
}

/* #slide-02
--------------------------------------------------*/
#slide-02{
	margin-bottom: 43px!important;
}
#slide-02 .sp-arrows {
	top: auto;
	bottom: 0;
	margin-top: -24px;
}
#slide-02 .sp-arrow {
	width: 32px;
	height: 48px;
}
#slide-02 .sp-previous-arrow {
	background: url(/content/dam/nttcom/hq/jp/business/sdpf/img/sdp_slider_arrow-left.png) no-repeat center center;
	background-size:10px;
	left: 40.5%;
}
#slide-02 .sp-next-arrow {
	background: url(/content/dam/nttcom/hq/jp/business/sdpf/img/sdp_slider_arrow-right.png) no-repeat center center;
	background-size:10px;
	right: 40.5%;
}

#slide-02 .sp-buttons {
	position: relative;
	display: inline-block;
	width: auto;
	padding-top: 10px;
	text-align: center;
}
#slide-02 .sp-button{
	background:#CCCCCC;
	border:none;
	width: 12px;
	height: 12px;
	margin: 10px;
}
#slide-02 .sp-button.sp-selected-button{
	background:#0094D1;
}
#slide-02 .image_component{
	height: 100%!important;
}
#slide-02 .image_component img{
	width: 100%;
}
#slide-02 .sp-slide iframe{
	height: 100%;
}
@media screen and (max-width: 768px){
	#slide-02{
		margin-bottom: 48px!important;
	}
	#slide-02 .sp-next-arrow{
		right: 25vw;
	}
	#slide-02 .sp-previous-arrow{
		left: 25vw;
	}
}


/* sp_playBtn
--------------------------------------------------*/
.sp_playBtn {
	z-index: 10000;
	position: absolute;
	bottom: 12px;
	right: 10%;
	width: 50px;
	height: 15px;
	background: #AAAAAA;
	cursor: pointer;
}
.sp_playBtn::before,
.sp_playBtn::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 2px;
	height: 7px;
	background: #fff;
}
.sp_playBtn::before {
	top: 50%;
	left: calc(50% - 2px);
	transform: translate(-50%, -50%);
}
.sp_playBtn::after {
	top: 50%;
	left: calc(50% + 2px);
	transform: translate(-50%, -50%);
}
.sp_playBtn.is-stop{
	background: #0E367D;
}
.sp_playBtn.is-stop::before {
	content: "";
	display: inline-block;
	width: 0;
	height: 0;
	background: none;
	border: 4px solid transparent;
	border-left: 4px solid #fff;
	top: 50%;
	left: calc(50% + 4px);
	transform: translate(-50%, -50%);
}
.sp_playBtn.is-stop::after {
	display: none;
}
.slide_controller {
	position: relative;
	width: 1100px;
	margin: 0 auto 80px auto;
}
.sp-fade-arrows{
	opacity: 1;
}

#slide-01 .sp_playBtn{
	right: 34%;
}
#slide-02 .sp_playBtn{
	right: 20%;
}
@media screen and (max-width: 768px){
	#slide-01 .sp_playBtn{
		right: 25%;
	}
}
@media screen and (max-width: 480px){
	#slide-01 .sp_playBtn,
	#slide-02 .sp_playBtn {
		right: 6%;
	}
	.sp_playBtn{
		right: 2%;
	}
}



/* =========================================================
 * スライダー以外
 * @ PAGE
 * ====================================================== */
.sdpf_wrap{
	background:url(/content/dam/nttcom/hq/jp/business/sdpf/img/related_content_bg.jpg) no-repeat top 300px center #eaeef4;
	background-size:contain;
}
.sdpf_wrap img{
	vertical-align:bottom;
}
.sdpf_wrap ul{
	list-style:none;
	padding:0;
	margin:0;
}
.sdpf_wrap .sdpf_inner{
	width:1180px;
	margin:0 auto;
}
.sdpf_wrap .related_content h2{
	margin:0 0 46px;
	border-bottom:1px solid #333;
	text-align:center;
}
.sdpf_wrap .related_content h2 span{
	margin:0;
	padding:15px 40px;
	font-weight:bold;
	font-size:20px;
	color:#fff;
	background:#333333;
	display:inline-block;
}
.sdpf_wrap .related_block{
	margin:0 auto 30px;
	display:flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.related_block .related_items{
	width:560px;
	margin-bottom:20px; 
	/*display: inline-block;*/
	/*margin: 13px;*/
}
.related_block .related_items h3,
.sdpf_wrap .online_seminar h3{
	padding:0;
	margin:20px 0 0;
	font-size:18px;
	font-weight:bold;
	color:#000;
}
.related_block .related_items h3 a,
.sdpf_wrap .online_seminar h3 a{
	font-size:18px;
	font-weight:bold;
	color:#000;
	position: relative;
}
.related_block .related_items h3 a:after,
.sdpf_wrap .online_seminar h3 a:after{
	content: "";
	position: absolute;
	right: -15px;
	top: 42%;
	width: 7px;
	height: 7px;
	margin-top: -4px;
	border-bottom: 3px solid #0e367d;
	border-right: 3px solid #0e367d;
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.related_block .related_items ul,
.sdpf_wrap .online_seminar ul{
	list-style:none;
	padding:0;
	margin:0;
}
.related_block .related_items ul li,
.sdpf_wrap .online_seminar ul li{
	text-indent:-1em;
	padding-left:1em;
}
.related_block .related_items ul li:before,
.sdpf_wrap .online_seminar ul li:before{
	content: "・";
}
.related_block .related_items ul li a,
.sdpf_wrap .online_seminar ul li a{
	text-decoration:underline;
}
.related_block .related_items .half{
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.related_block .related_items .half li{
	width:46%;
}
.sdpf_wrap .online_seminar{
	display:flex;
	border:2px solid #aeafb0;
	margin-bottom:80px;
}
.sdpf_wrap .online_seminar div{
	padding:20px;
}
.sdpf_wrap .online_seminar div h3{
	margin-top:0;
}
.sdpf_wrap .online_seminar li span{
	background:#8d3734;
	color:#fff;
	font-size:11px;
	padding:2px 5px;
}
@media screen and (max-width: 768px) {
	.sdpf_wrap .sdpf_inner{
		width:94%;
	}
	.sdpf_wrap .related_block{
		display:block;
		text-align:center;
	}
	.related_block .related_items{
		width:100%;
		margin-bottom:30px;
	}
	.related_block .related_items img{
		max-width: 100%;
	}
	.related_block .related_items h3, .sdpf_wrap .online_seminar h3,
	.related_block .related_items ul li, .sdpf_wrap .online_seminar ul li{
		text-align:left;
	}
	.related_block .related_items .half{
		display:block;
	}
	.related_block .related_items .half li{
		width:calc(100% - 1em);
	}
	.sdpf_wrap .online_seminar{
		display:block;
		border:none;
		text-align:center;
	}
	.sdpf_wrap .online_seminar img{
		max-width: 100%;
	}
	.sdpf_wrap .online_seminar div{
		padding:0;
	}
	.sdpf_wrap .online_seminar div h3{
		margin-top:20px;
	}
	.sdpf_wrap .related_content h2 span{
		padding: 15px;
	}
}




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

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

@media screen and (max-width: 768px) {
	.sdpfSlider h2{
		text-align:center;
	}
	.sdpfSlider h2 img{
		margin:0 auto 30px;
		max-width:100%;
	}
	.sdpfSlider .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;
	}
}


.service_lineup .lineup_list{
	position: relative;
}
.service_lineup .lineup_list img{
	max-width: 100%;
}
.service_lineup .lineup_list .list_icon{
	position: absolute;
	text-align: center;
}
.service_lineup .lineup_list .list_icon .icon_img img{
	width: 48px;
	height: 48px;
}
.service_lineup .lineup_list .list_icon-row .icon_img p{
	margin: 8px 0 0;
	font-size: 12px;
	font-weight: bold;
	line-height: 1.2;
}
.service_lineup .lineup_list .list_icon-row.list_icon-h .icon_img p{
	display: flex;
	justify-content: center;
	align-items: center;
	height: 28px;
}
.service_lineup .lineup_list .list_icon-col .icon_img{
	display: flex;
	align-items: center;
	font-size: 12px;
	font-weight: bold;
	line-height: 1.2;
}
.service_lineup .lineup_list .list_icon-col .icon_img p{
	margin: 0 0 0 10px;
	text-align: left;
}

.service_lineup .lineup_list .list_icon-sbs{
	width: 108px;
	top: 363px;
	left: 105px;
}
.service_lineup .lineup_list .list_icon-vdx{
	width: 108px;
	top: 363px;
	left: 205px;
}
.service_lineup .lineup_list .list_icon-ai{
	width: 108px;
	top: 363px;
	left: 305px;
}
.service_lineup .lineup_list .list_icon-sfa{
	width: 108px;
	top: 363px;
	left: 405px;
}
.service_lineup .lineup_list .list_icon-itsm{
	width: 108px;
	top: 363px;
	left: 500px;
}
.service_lineup .lineup_list .list_icon-vms{
	width: 108px;
	top: 363px;
	left: 595px;
}
.service_lineup .lineup_list .list_icon-pdx{
	width: 108px;
	top: 363px;
	left: 690px;
}
.service_lineup .lineup_list .list_icon-hca{
	width: 108px;
	top: 363px;
	left: 785px;
}
.service_lineup .lineup_list .list_icon-vm{
	width: 108px;
	top: 363px;
	left: 880px;
}
.service_lineup .lineup_list .list_icon-dm{
	width: 191px;
	top: 322px;
	left: 486px;
}
.service_lineup .lineup_list .list_icon-di{
	width: 167px;
	top: 422px;
	left: 155px;
}
.service_lineup .lineup_list .list_icon-api{
	width: 90px;
	top: 422px;
	left: 326px;
}
.service_lineup .lineup_list .list_icon-daai{
	width: 182px;
	top: 422px;
	left: 486px;
}
.service_lineup .lineup_list .list_icon-iotp{
	width: 105px;
	top: 422px;
	left: 753px;
}
.service_lineup .lineup_list .list_icon-dsec{
	width: 132px;
	top: 422px;
	left: 901px;
}
.service_lineup .lineup_list .list_icon-st{
	width: 118px;
	top: 574px;
	left: 341px;
}
.service_lineup .lineup_list .list_icon-prc{
	width: 179px;
	top: 574px;
	left: 516px;
}
.service_lineup .lineup_list .list_icon-puc{
	width: 179px;
	top: 574px;
	left: 720px;
}
.service_lineup .lineup_list .list_icon-fic{
	width: 154px;
	top: 676px;
	left: 516px;
}
.service_lineup .lineup_list .list_icon-esim{
	width: 93px;
	top: 743px;
	left: 515px; /* 1228数値変更 586→515 */

}
.service_lineup .lineup_list .list_icon-sdw{
	width: 118px;
	top: 743px;
	left: 649px; /* 1228数値変更 720→649 */
}

/* 1228追加 */
.service_lineup .lineup_list .list_icon-int{
	width: 145px;
	top: 743px;
	left: 787px;
}
/* 1228追加 ここまで*/

.service_lineup .lineup_list .list_icon-iote{
	width: 123px;
	top: 743px;
	left: 239px; /* 1228数値変更 310→239 */
}
.service_lineup .lineup_list .list_icon-irv{
	width: 78px;
	top: 649px;
	left: 1065px;
}
.service_lineup .lineup_list .list_icon-l5g{
	width: 110px;
	top: 743px;
	left: 377px; /* 1228数値変更 488→377 */
}
.service_lineup .lineup_list .list_icon-orch{
	width: 78px;
	top: 748px;
	left: 1065px;
}
.service_lineup .lineup_list .list_icon-ms{
	width: 78px;
	top: 847px;
	left: 1065px;
}
.service_lineup .lineup_list .list_icon-sec{
	width: 78px;
	top: 950px;
	left: 1065px;
}
.service_lineup .lineup_list .list_icon-sec .icon_img p{
	height: auto;
}

.service_lineup .lineup_list .list_icon .list_icon_inner{
	position: relative;
}



/* ツールチップ */
.service_lineup .lineup_list .list_icon .tooltip {
	display: none;
	position: absolute;
	z-index: 1;
}
.service_lineup .lineup_list .list_icon.list_icon-row .tooltip:not(.tooltip-r){
	top: 58px;
	left: 2px;
}
.service_lineup .lineup_list .list_icon.list_icon-row .tooltip.tooltip-r{
	right: 0;
}

.service_lineup .lineup_list .list_icon.list_icon-col .tooltip{
	top: 50px;
	left: -25px;
}

.service_lineup .lineup_list .list_icon:hover .tooltip {
	display: block;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_inner{
	position: relative;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	width: 360px;
	padding: 20px 20px 15px;
	border-left: 10px solid #000;
	box-shadow: 4px 4px 8px rgba(97,97,106,.2), 1px 1px 20px rgba(97,97,106,.2);
	background: #fff;
	font-size: 14px;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_inner::before {
	content: '';
	position: absolute;
	z-index: 1;
	width: 20px;
	height: 20px;
	top: -10px;
	transform: rotate(45deg) skew(20deg,20deg);
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_inner::after {
	content: '';
	position: absolute;
	z-index: 2;
	top: 0;
	width: 100%;
	height: 100%;
}

.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip:not(.tooltip-r) .tooltip_inner::before{
	left: 30px;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip:not(.tooltip-r) .tooltip_inner::after{
	left: 0;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip.tooltip-r .tooltip_inner::before{
	left: unset;
	right: 28px;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_inner::after{
	left: unset;
	right: 0;
}


.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_inner>* {
	position: relative;
	z-index: 3;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_inner,
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_inner::before {
	box-shadow: 0 0 10px 0 rgba(163,163,163,0.50);
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_inner,
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_inner::before,
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_inner::after {
	background: #fff;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_img{
	width: 40px;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_main{
	width: calc(100% - 50px);
	text-align: left;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_main .main_ttl{
	font-size: 15px;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_main .main_txt{
	margin: 5px 0 0;
	font-size: 14px;
	line-height: 1.4;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_main .main_links{
	margin: 2px 0 0;
	font-size: 12px;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_main .main_links li{
	position: relative;
	padding: 0 0 0 10px;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_main .main_links li:not(.no_link):before{
	content: "";
	position: absolute;
	top: 10px;
	left: 0;
	display: inline-block;
	width: 8px;
	height: 2px;
	background: #666;
	transform: rotate(-45deg);
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_main .main_links li:not(.no_link):after{
	content: "";
	position: absolute;
	top: 5px;
	left: 0;
	display: inline-block;
	width: 8px;
	height: 2px;
	background: #666;
	transform: rotate(-135deg);
}

.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_main .main_links li.no_link:before{
	content: "";
	position: absolute;
	top: 7px;
	left: 0;
	display: inline-block;
	width: 4px;
	height: 4px;
	background: #666;
	transform: rotate(-45deg);
	border-radius: 50%;
}

.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_main .main_links a{
	text-decoration: underline;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_main .main_link{
	text-align: right;
	font-size: 12px;
	margin: 7px 0 0;
}
.service_lineup .lineup_list .list_icon .list_icon_inner .tooltip .tooltip_main .main_link a{
	text-decoration: underline;
}

/* 色ごとの設定 */
/* ピンク */
.service_lineup .lineup_list .list_icon.list_icon-pk .list_icon_inner .tooltip .tooltip_inner{
	border-color: #f19ec2;
}
.service_lineup .lineup_list .list_icon.list_icon-pk .list_icon_inner .tooltip .tooltip_main .main_ttl,
.service_lineup .lineup_list .list_icon.list_icon-pk .list_icon_inner .tooltip .tooltip_main .main_links a{
	color: #e50050;
}
.service_lineup .lineup_list .list_icon.list_icon-pk .list_icon_inner .tooltip .tooltip_main .main_links li:before,
.service_lineup .lineup_list .list_icon.list_icon-pk .list_icon_inner .tooltip .tooltip_main .main_links li:after{
	background: #e50050;
}
/* グリーン */
.service_lineup .lineup_list .list_icon.list_icon-gr .list_icon_inner .tooltip .tooltip_inner{
	border-color: #8ec31f;
}
.service_lineup .lineup_list .list_icon.list_icon-gr .list_icon_inner .tooltip .tooltip_main .main_ttl,
.service_lineup .lineup_list .list_icon.list_icon-gr .list_icon_inner .tooltip .tooltip_main .main_links a{
	color: #009944;
}
.service_lineup .lineup_list .list_icon.list_icon-gr .list_icon_inner .tooltip .tooltip_main .main_links li:before,
.service_lineup .lineup_list .list_icon.list_icon-gr .list_icon_inner .tooltip .tooltip_main .main_links li:after{
	background: #009944;
}
/* イエロー */
.service_lineup .lineup_list .list_icon.list_icon-yl .list_icon_inner .tooltip .tooltip_inner{
	border-color: #fff100;
}
.service_lineup .lineup_list .list_icon.list_icon-yl .list_icon_inner .tooltip .tooltip_main .main_ttl,
.service_lineup .lineup_list .list_icon.list_icon-yl .list_icon_inner .tooltip .tooltip_main .main_links a{
	color: #f39800;
}
.service_lineup .lineup_list .list_icon.list_icon-yl .list_icon_inner .tooltip .tooltip_main .main_links li:before,
.service_lineup .lineup_list .list_icon.list_icon-yl .list_icon_inner .tooltip .tooltip_main .main_links li:after{
	background: #f39800;
}
/* ブルー */
.service_lineup .lineup_list .list_icon.list_icon-bu .list_icon_inner .tooltip .tooltip_inner{
	border-color: #7dcef4;
}
.service_lineup .lineup_list .list_icon.list_icon-bu .list_icon_inner .tooltip .tooltip_main .main_ttl,
.service_lineup .lineup_list .list_icon.list_icon-bu .list_icon_inner .tooltip .tooltip_main .main_links a{
	color: #0068b7;
}
.service_lineup .lineup_list .list_icon.list_icon-bu .list_icon_inner .tooltip .tooltip_main .main_links li:before,
.service_lineup .lineup_list .list_icon.list_icon-bu .list_icon_inner .tooltip .tooltip_main .main_links li:after{
	background: #0068b7;
}
/* パープル */
.service_lineup .lineup_list .list_icon.list_icon-pl .list_icon_inner .tooltip .tooltip_inner{
	border-color: #b979b1;
}
.service_lineup .lineup_list .list_icon.list_icon-pl .list_icon_inner .tooltip .tooltip_main .main_ttl,
.service_lineup .lineup_list .list_icon.list_icon-pl .list_icon_inner .tooltip .tooltip_main .main_links a{
	color: #920883;
}
.service_lineup .lineup_list .list_icon.list_icon-pl .list_icon_inner .tooltip .tooltip_main .main_links li:before,
.service_lineup .lineup_list .list_icon.list_icon-pl .list_icon_inner .tooltip .tooltip_main .main_links li:after{
	background: #920883;
}








.service_lineup h2{
	text-align:left;
	font-size:22px;
	color:#004386;
	border-bottom:1px solid #004386;
	padding-bottom:10px;
	font-weight:bold;
}
.service_lineup_block{
	display:flex;
	justify-content: space-between;
	width: calc(100% - 80px);
	margin: 0 auto;
}
.service_lineup_items:nth-child(1){
	width: 25%;
}
.service_lineup_items:nth-child(2),
.service_lineup_items:nth-child(3){
	width: 25%;
}
.service_lineup_items:nth-child(4){
	width: 25%;
}
.service_lineup_items h3{
	display: inline-block;
	margin-bottom: 16px;
	padding: 5px 10px;
	background: #000;
	color: #fff;
	font-size: 13px;
	font-weight: bold;
	min-width:210px;
}
.service_lineup_items h4{
	margin: 0 0 10px;
	font-size: 15px;
	font-weight: bold;
}
.service_lineup_items h4 + .lineup_list{
	margin-bottom: 15px;
}

.service_lineup_items h5{
	margin: 0 0 5px;
	font-size: 14px;
	font-weight: bold;
}
.service_lineup_items .lineup_list{
	margin-bottom: 20px;
}
.service_lineup_items .lineup_list .list_item:not(:last-child){
	margin-bottom: 4px;
}
.service_lineup_items .lineup_list .list_item a{
	font-size:14px;
	text-decoration:underline;
}
.service_lineup_items .lineup_list .list_item p{
	font-size:14px;
}
.service_lineup_items .lineup_list .list_item .s-line{
	line-height:1.2;
}

/* サービス一覧 ツールチップ */
.service_lineup_items .lineup_list .list_item .item_inner{
	position: relative;
	display: inline-block;
}
.service_lineup_items .lineup_list .list_item .item_inner .tooltip {
	display: none;
	position: absolute;
	left: 30%;
	bottom: 1.6rem;
	z-index: 9999;
	min-width: 300px;
	padding: 10px;
	border: 1px solid #818181;
	border-radius: 3px;
	background: #f3f3f3;
	font-size: 15px;
	font-weight: normal;
}
.service_lineup_items .lineup_list .list_item .item_inner:hover .tooltip {
	display: block;
}





@media screen and (max-width: 768px) {
	.service_lineup h2{
		margin-bottom:30px;
	}
	.service_lineup img{
		max-width: 100%;
		height: auto;
	}
	.service_lineup_block{
		display:block;
		width: 100%;
	}
	.service_lineup_items{
		width: 100%!important;
		padding: 0;
	}
	.service_lineup_items ul {
		margin-bottom: 38px;
	}
	.service_lineup_items ul li:not(:last-child) {
		margin-bottom: 7px;
	}
	.service_lineup_items .lineup_list:last-of-type{
		margin-bottom: 38px;
	}
	/* サービス一覧 ツールチップ */
	.service_lineup_items .lineup_list .list_item .item_inner:hover .tooltip {
		display: none;
	}
}



.news_wrap{
	background:#fff;
	padding-top:90px;
}
.news_area .c-news-title {
	display: flex;
	align-content: space-between;
	align-items: flex-end;
	margin-bottom: 40px;
}
.news_area .c-news-title .title{
	width: 25%;
	margin:0;
	padding:0;
}
.news_area .c-news-title .title .pc{
	display: block;
}
.news_area .c-news-title .title .sp {
	display: none;
}
.news_area .c-news-title .link_wrap {
	display: flex;
	width: 65%;
}
.news_area .link-01 {
	margin-right: 40px;
}
.news_area .c-news-title a {
	font-size: 14px;
	font-weight: bold;
}
.news_area .link_wrap .arrow-link::after {
	content: "";
	position: absolute;
	right: -12px;
	left:auto;
	top: 50%;
	width: 7px;
	height: 7px;
	margin-top: -4px;
	border-bottom: 1px solid #0e367d;
	border-right: 1px solid #0e367d;
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.c-news-list,
.sdpf-news_items {
	list-style:none;
	margin: 0;
	padding: 0;
	line-height: 1.4;
}
.c-news-list li,
.sdpf-news_items li {
	border-bottom: 1px solid #cddbde;
	margin-bottom: 10px;
	padding-bottom: 10px;
	display: block;
}
.c-news-list li .date,
.sdpf-news_items li time {
	width: 160px;
	clear: both;
	font-weight: bold;
	display: block;
}
.sdpf-news_items li time {
	display: inline-block;
	color:#000000;
	vertical-align: top;
}

.c-news-list .txt {
	font-size: 14px;
	display: block;
	width: calc(100% - 180px);
}
.sdpf-news_items span {
	font-size: 14px;
	width: calc(100% - 180px);
	display: inline-block;

}
.news_area .c-news-list a {
	padding: 0 0 0 15px;
}
.news_area .arrow-link {
	position: relative;
}
.news_area .arrow-link::after {
	content: "";
	position: absolute;
	left:0;
	top: 10px;
	width: 7px;
	height: 7px;
	margin-top: -4px;
	border-bottom: 1px solid #0e367d;
	border-right: 1px solid #0e367d;
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.sdpf-news_items span::before {
	content: "";
	position: absolute;
	left:0;
	top: 10px;
	width: 7px;
	height: 7px;
	margin-top: -4px;
	border-bottom: 1px solid #0e367d;
	border-right: 1px solid #0e367d;
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.news_area a {
	color: #0e367d;
}

@media screen and (max-width: 768px) {
	.news_area .c-news-title{
		display:block;
	}
	.news_area .c-news-title .link_wrap{
		width:100%;
		margin-top:10px;
		display:block;
		text-align:right;
	}
	.news_area .link-01,
	.news_area .link-02{
		margin-right: 20px;
	}
	.c-news-list li,
	.sdpf-news_items li {
		display:block;
	}
}




/* =========================================================
 * offeringフォルダ共通
 * ====================================================== */
.fixed_header{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding: 0 10px;
	background: #fff;
	z-index: 20;
}
.fixed_header .header_inner{
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: 1310px;
	width: 100%;
	margin: 0 auto;
	padding: 16px 0;
}
.fixed_header .header_inner img{
	width: 180px;
}
.fixed_header .header_inner .header_links{
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
}
.fixed_header .header_inner .header_links li{
	margin: 0 30px 0 0;
}
.fixed_header .header_inner .header_links li:last-child{
	margin-right: 13px;
}
.fixed_header .header_inner .header_links a{
	display: inline-block;
	padding: 0 0 10px;
/*	border-bottom: 2px solid;*/
	color: #000;
	font-size: 13px;
	font-weight: bold;
}
@media screen and (max-width: 768px) {
	.fixed_header{
		height: 67px;
	}
	.fixed_header .header_inner{
		width: 100%;
	}
	.fixed_header .header_inner .header_links{
		display: none;
		position: absolute;
		top: 66px;
		right: 0;
		border-color: #ccc;
		border-style: solid;
		border-width: 0 1px 1px 1px;
		background: #fff;
	}
	.fixed_header .header_inner .header_links li{
		margin: 0;
	}
	.fixed_header .header_inner .header_links a{
		width: 100%;
		padding: 10px;
		border-bottom: 1px solid;
		font-size: 16px;
		font-weight: normal;
	}
	.fixed_header .header_inner .header_links li:last-of-type a{
		border: none;
	}
	.fixed_header .header_inner img{
		width: 120px;
	}
	.header_menuBtn{
		width: 40px;
		height: 35px;
		color: #231f20;
		position: relative;
	}
	.header_menuBtn span{
		display: block;
		background-color: currentColor;
		position: absolute;
		transition: all .2s;
		width: 40px;
		height: 4px;
		left: 0;
	}
	.header_menuBtn span:nth-of-type(1) {
		top: 0;
	}
	.header_menuBtn span:nth-of-type(2),
	.header_menuBtn span:nth-of-type(3) {
		top: 50%;
		transform: translateY(-50%);
	}
	.header_menuBtn span:nth-of-type(4) {
		bottom: 0;
	}
	.header_menuBtn.is-open span:nth-of-type(1),
	.header_menuBtn.is-open span:nth-of-type(4){
		transform: scaleX(0);
	}
	.header_menuBtn.is-open span:nth-of-type(2) {
		transform: rotate(-45deg);
	}
	.header_menuBtn.is-open span:nth-of-type(3) {
		transform: rotate(45deg);
	}

}


/* =========================================================
 * offeringTOPページ
 * @ offering
 * ====================================================== */
.offering_wrap .arrow-link{
	position: relative;
	display: inline-block;
	width: 380px;
	padding: 15px;
	border: 2px solid #004386;
	color: #004386;
	font-weight: bold;
	text-decoration: none;
}
.offering_wrap .arrow-right:after {
	content: "";
	position: absolute;
	right: 30px;
	left: auto;
	top: 50%;
	width: 5px;
	height: 5px;
	margin-top: -4px;
	border-bottom: 2px solid #0e367d;
	border-right: 2px solid #0e367d;
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.offering_wrap .arrow-left:before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 5px;
	height: 5px;
	margin-top: -4px;
	border-bottom: 2px solid #0e367d;
	border-right: 2px solid #0e367d;
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.offering_inr{
	width: 950px;
	margin:0 auto;
}
.offering_wrap img{
	width:100%;
	vertical-align:bottom;
}
.offering_wrap a img:hover{
	opacity:.7;
}
.main_area{
	background:url(/content/dam/nttcom/hq/jp/business/sdpf/img/offering_main_img.jpg) no-repeat top center;
	background-size:cover;
}
.main_txt_wrap{
	padding-top: 500px;
}
.main_txt_wrap .main_txt{
	background: rgba(0,40,73,0.7);
}
.main_txt_wrap .main_txt_inner{
	width: 1264px;
	margin: 0 auto;
	padding-top: 40px;
	display: flex;
}
.main_txt .left_txt{
	margin-left: 130px;
}
.about_dx{
	padding: 56px 0;
	line-height:1.7;
}
.about_dx p{
	font-size:16px;
}
.about_dx .ttl{
	font-size: 22px;
	font-weight:bold;
	margin-bottom:10px;
}
.about_dx .source{
	color:#808080;
	font-size:13px;
}
.about_dx .link{
	margin: 20px 0;
	text-align:center;
}



/* 次々と画像が表示されるギミックの設定 */
.is-fade {
	opacity: 0;
	-webkit-transform: translateY(50px);
					transform: translateY(50px);
	-webkit-transition: all .6s;
	transition: all .6s;
}

.is-fade.is-fade-end {
	opacity: 1;
	-webkit-transform: translateY(0);
					transform: translateY(0);
}

.is-fade-next {
	opacity: 0;
	-webkit-transform: translateY(50px);
					transform: translateY(50px);
	-webkit-transition: all .6s;
	transition: all .6s;
}

.is-fade-next.is-fade-end {
	opacity: 1;
	-webkit-transform: translateY(0);
					transform: translateY(0);
}

.is-fade-in {
	opacity: 0;
	-webkit-transition: all .6s;
	transition: all .6s;
}

.is-fade-in.is-fade-end {
	opacity: 1;
}

.is-fade-next-in {
	opacity: 0;
	-webkit-transition: all .6s;
	transition: all .6s;
}

.is-fade-next-in.is-fade-end {
	opacity: 1;
}

.is-hAni {
	position: relative;
	color: transparent;
}

.is-show .is-hAni, .is-show.is-hAni {
	-webkit-animation: hAni .6s ease forwards;
					animation: hAni .6s ease forwards;
}

.is-fade-end .is-hAni-hi, .is-fade-end.is-hAni-hi {
	-webkit-animation: hAni .6s ease forwards;
					animation: hAni .6s ease forwards;
}

@-webkit-keyframes hAni {
	0% {
		color: transparent;
	}
	45% {
		color: transparent;
	}
	55% {
		color: #000;
	}
	100% {
		color: #000;
	}
}

@keyframes hAni {
	0% {
		color: transparent;
	}
	45% {
		color: transparent;
	}
	55% {
		color: #000;
	}
	100% {
		color: #000;
	}
}

.is-hAni img {
	opacity: 0;
}

.is-show .is-hAni img,
.is-show.is-hAni img {
	-webkit-animation: hAniImg .6s ease forwards;
					animation: hAniImg .6s ease forwards;
}

.is-fade-end .is-hAni-hi img,
.is-fade-end.is-hAni-hi img {
	-webkit-animation: hAniImg .6s ease forwards;
					animation: hAniImg .6s ease forwards;
}

@-webkit-keyframes hAniImg {
	0% {
		opacity: 0;
	}
	45% {
		opacity: 0;
	}
	55% {
		opacity: 1;
	}
	100% {
		opacity: 1;
	}
}

@keyframes hAniImg {
	0% {
		opacity: 0;
	}
	45% {
		opacity: 0;
	}
	55% {
		opacity: 1;
	}
	100% {
		opacity: 1;
	}
}

.is-hAni:before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.is-show .is-hAni:before, .is-show.is-hAni:before {
	-webkit-animation: hAniBe .6s ease forwards;
					animation: hAniBe .6s ease forwards;
}

.is-fade-end .is-hAni-hi:before, .is-fade-end.is-hAni-hi:before {
	-webkit-animation: hAniBe .6s ease forwards;
					animation: hAniBe .6s ease forwards;
}

@-webkit-keyframes hAniBe {
	0% {
		opacity: 1;
	}
	45% {
		opacity: 1;
	}
	55% {
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
}

@keyframes hAniBe {
	0% {
		opacity: 1;
	}
	45% {
		opacity: 1;
	}
	55% {
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
}

.is-hAni:after {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	right: 100%;
	height: 100%;
	background: linear-gradient(to left, #13448f, #0167bc);
}

.is-show .is-hAni:after, .is-show.is-hAni:after {
	-webkit-animation: hAniAf .6s ease forwards;
					animation: hAniAf .6s ease forwards;
}

.is-fade-end .is-hAni-hi:after, .is-fade-end.is-hAni-hi:after {
	-webkit-animation: hAniAf .6s ease forwards;
					animation: hAniAf .6s ease forwards;
}

@-webkit-keyframes hAniAf {
	0% {
		left: 0;
		right: 100%;
	}
	45% {
		left: 0;
		right: 0;
	}
	55% {
		left: 0;
		right: 0;
	}
	100% {
		left: 100%;
		right: 0;
	}
}

@keyframes hAniAf {
	0% {
		left: 0;
		right: 100%;
	}
	45% {
		left: 0;
		right: 0;
	}
	55% {
		left: 0;
		right: 0;
	}
	100% {
		left: 100%;
		right: 0;
	}
}


/* 周りに回転線のあるボタン */
.circle_btn{
	position: absolute;
	right: 18px;
	bottom: 18px;
}
.circle_btn .btn_inner{
	position:relative;
	width: 64px;
	height: 64px;
	margin:auto;
	transition:all .5s ease 1s;
	-webkit-transform:scale(1.4);transform:scale(1.4);
	opacity:1;
	-webkit-transform:scale(1);
	transform:scale(1);
}
.circle_btn .btn_inner .btn_icon{
	width: 44px;
	height: 44px;
	background: #fff;
	border-radius: 50%;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -22px;
	margin-top: -22px;
	display: block;
}
.circle_btn .btn_inner .btn_circle{
	position:absolute;
	left:0;
	top:0;
	width: 64px;
	height: 64px;
	-webkit-animation:borderCircle 3s linear infinite;
	animation:borderCircle 3s linear infinite;
}
.circle_btn .btn_inner .btn_circle path{
	stroke-dasharray:58;
	stroke-linecap:square;
	stroke-width:1px;
	opacity:1;
	fill: none;
	stroke: #fff;
	stroke-width: 3;
	stroke-linecap: square;
	stroke-miterlimit: 10;
	opacity: .5;
	transition: all .5s linear 1s;
	stroke-dashoffset: 0;
}
.circle_btn .btn_inner .btn_circle svg{
	width: 64px;
	height: 64px;
	position:absolute;
	top:0;
	left:0;
}
.circle_btn .btn_inner .btn_icon span{
	width:100%;
	height:100%;
	background-repeat:no-repeat;
	background-position:center;
	background-size:20px 24px;
	display:block;
	background-image:url(/content/dam/nttcom/hq/jp/business/sdpf/img/circle_btn_icon.png)
}
@-webkit-keyframes borderCircle{
	0%{
		-webkit-transform:rotate(0);
		transform:rotate(0);
	}
	100%{
		-webkit-transform:rotate(360deg);
		transform:rotate(360deg);
	}
}
@keyframes borderCircle{
	0%{
		-webkit-transform:rotate(0);
		transform:rotate(0);
	}
	100%{
		-webkit-transform:rotate(360deg);
		transform:rotate(360deg);
	}
}
@media(min-width:781px){
	a:hover .btn_circle{
		-webkit-animation:borderCircle 2s linear infinite;
		animation:borderCircle 2s linear infinite;
	}
	.circle_btn .btn_inner .btn_icon,
	.circle_btn .btn_inner .btn_icon span{
		transition:all .4s;
	}
	.circle_btn .btn_inner:hover .btn_icon{
		-webkit-transform:scale(1.2);
		transform:scale(1.2);
	}
	.circle_btn .btn_inner:hover .btn_icon span{
		-webkit-transform:scale(.8);
		transform:scale(.8);
	}
}



.best_practice{
	text-align:center;
	line-height:1.7;
}
.best_practice .offering_inr{
	width: 950px;
}
.best_practice .best_practice_inr{
	padding: 50px 50px 80px;
	background: #f5f6f7;
}
.best_practice p{
	font-size: 15px;
	margin-bottom: 15px;
}
.best_practice .ttl span{
	display: inline-block;
	padding: 9px 26px 5px;
	background: #3C96DC;
	color: #fff;
	font-weight: bold;
	font-size: 21px;
	line-height: 1;
}
.best_practice .ttl + p{
	margin-bottom: 30px;
	font-size: 27px;
	text-align: left;
	line-height: 1.5;
}

.theme_ttl {
	background: -moz-linear-gradient(right, #13448f, #0167bc);
	background: -webkit-linear-gradient(right, #13448f, #0167bc);
	background: linear-gradient(to left, #13448f, #0167bc);
}
.theme_ttl .heading_inner {
	width: 960px;
	margin: 0 auto;
	padding: 53px 0;
}
.theme_ttl .heading_inner .primary_heading {
	display: flex;
	align-items: center;
	margin: 0 0 13px;
	color: #fff;
	font-size: 44px;
	text-align: left;
}
.theme_ttl .heading_inner .primary_heading span {
	margin: 0 0 0 20px;
	font-size: 30px;
}
.theme_ttl .heading_inner p {
	color: #fff;
	font-size: 18px;
}
.theme_area .search_area{
	position: relative;
	background: #FFF;
	border: solid 1px #bfbfbf;
	box-sizing: border-box;
	padding:25px 40px 10px;
	margin:40px 10px 20px;
}
/*
.theme_area .search_area:before {
	content: "";
	position: absolute;
	bottom: -24px;
	left: 50%;
	margin-left: -15px;
	border: 12px solid transparent;
	border-top: 12px solid #FFF;
	z-index: 2;
}

.theme_area .search_area:after {
	content: "";
	position: absolute;
	bottom: -28px;
	left: 50%;
	margin-left: -17px;
	border: 14px solid transparent;
	border-top: 14px solid #bfbfbf;
	z-index: 1;
}
*/
.theme_area .search_area h3{
	font-size:18px;
	font-weight:bold;
	border-left:3px solid #0167bc;
	padding:0 0 5px 10px;
	margin:0 0 20px;
}
.theme_area .search_area ul{
	list-style:none;
	padding:0;
	margin:0;
	display:flex;
	flex-wrap: wrap;
}
.theme_area .search_area ul li{
	width:210px;
	margin-bottom:15px;
}
.theme_area .search_area ul li span,
.theme_area .search_area ul li a{
	position: relative;
	padding-left:16px;
}
.theme_area .search_area ul li span,
.theme_area .search_area ul li a{
	position: relative;
}
.theme_area .search_area ul li span{
	opacity:.5;
}
.theme_area .search_area ul li a{
	text-decoration:underline;
}
.theme_area .search_area ul li span:before,
.theme_area .search_area ul li a:before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 5px;
	height: 5px;
	margin-top: -4px;
	border-bottom: 2px solid #0e367d;
	border-right: 2px solid #0e367d;
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.result_area{
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.result_items{
	position: relative;
	width:49%;
	margin-bottom:10px;
}

.sdpf_btn{
	margin-top:60px;
	text-align:center;
}
.sdpf_btn p{
	width:380px;
	margin:0 auto;
}
.sdpf_btn img{
	width:100%;
}



@media screen and (max-width: 768px) {
	.main_area{
		background:none;
	}
	.main_txt_wrap{
		margin-top:0;
		padding-top:0;
	}
	.main_txt_wrap .main_txt_inner{
		width:100%;
		display:block;
		padding:0 10px 0;
	}
	.main_area .header{
	position: absolute;
	width:100%;
	}
	.main_area .header img{
		width:20%;
	}
	.main_txt .left_txt {
		margin-left: 0;
	}
	.main_txt .right_txt {
		margin-top: 0;
	}
	.offering_inr,
	.best_practice .offering_inr,
	.theme_ttl .heading_inner{
		width:96%;
		padding: 20px 10px;
	}
	.about_dx{
		padding:10px 0;
	}
	.best_practice .best_practice_inr{
		padding: 20px 10px;
	}
	.best_practice .ttl + p{
		font-size: 17px;
	}
	.theme_ttl .heading_inner .primary_heading{
		font-size:30px;
	}
	.theme_ttl .heading_inner .primary_heading span {
		font-size: 20px;
	}
	.theme_ttl .heading_inner p{
		font-size:14px;
		line-height:1.5;
	}
	.theme_area .search_area{
		margin:0 10px 20px;
	}
	.result_area{
		display:block;
	}
	.result_items {
		width: 100%;
		margin-bottom: 10px;
	}
	.sdpf_btn{
		margin-top:0;
	}
	.sdpf_btn p{
		width:80%;
		max-width:380px;
		margin:0 auto;
	}
}





/* =========================================================
 * caseページ
 * @ case
 * ====================================================== */

/*
 * ----- careページ 共通 -----
*/
.case_wrap{
	background: #fff;
}
.case_wrap img{
	vertical-align: bottom;
}
.case_wrap p{
	line-height: 2;
}

.case_list-circle{
	margin: 0;
	padding: 0;
	list-style: none;
}
.case_list-circle li{
	position: relative;
	padding: 0 0 0 16px;
	line-height: 2;
}
.case_list-circle li:last-child{
	margin: 0;
}
.case_list-circle li::before{
	content: "";
	position: absolute;
	top: calc(0.5rem + 2px);
	left: 0;
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #0167BC;
}

.care_theme{
	position: relative;
}
.theme_heading{
	position: absolute;
	top: 82px;
	left: 0;
	width: 100%;
}

.primary_heading{
	background: -moz-linear-gradient(right, #13448f, #0167bc);
	background: -webkit-linear-gradient(right, #13448f, #0167bc);
	background: linear-gradient(to left, #13448f, #0167bc);
}
.primary_heading .heading_inner{
	width: 950px;
	margin: 0 auto;
	padding: 53px 0;
}
.primary_heading .heading_inner .heading_ttl{
	display: flex;
	align-items: center;
	margin: 0;
	color: #fff;
	font-size: 43px;
	text-align: left;
}
.primary_heading .heading_inner .heading_ttl img{
	width: 60px;
	margin: 0 20px 0 0;
}
.primary_heading .heading_inner .heading_ttl span{
	margin: 0 0 0 20px;
	font-size: 32px;
}
.primary_heading .heading_inner p{
	margin: 13px 0 0;
	color: #fff;
	font-size: 18px;
	line-height: 1;
}

.secondary_heading{
	display: flex;
	align-items: center;
	width: 1000px;
	margin: 73px auto 50px;
	background: -moz-linear-gradient(left, #f6f6f6, #fff);
	background: -webkit-linear-gradient(left, #f6f6f6, #fff);
	background: linear-gradient(to right, #f6f6f6, #fff);
}
.secondary_heading:before{
	content: "";
	display: inline-block;
	width: 7px;
	height: 84px;
	background: -moz-linear-gradient(right, #13448f, #0167bc);
	background: -webkit-linear-gradient(right, #13448f, #0167bc);
	background: linear-gradient(to left, #13448f, #0167bc);
}

.secondary_heading span{
	display: flex;
	align-items: center;
	padding: 0 0 0 23px;
	font-size: 26px;
}
.secondary_heading i{
	margin: 0 0 0 20px;
	color: #0167bc;
	font-style: normal;
	font-size: 15px;
}

.care_back{
	margin: 130px 0 0;
	text-align: center;
}
.care_back a{
	display: inline-block;
	width: 380px;
	padding: 20px;
	border: 2px solid #004386;
	color: #004386;
	font-weight: bold;
}

/*
 * ----- テーマ -----
*/
.theme_top img{
	width: 100%;
}
.theme_top .top_main{
	position: relative;
	width: 1000px;
	margin: 80px auto 0;
}
.theme_top .main_box .box_txt{
	margin: 0;
	font-size: 44px;
	line-height: 1.4;
}


.theme_top .main_box{
	position: relative;
	display: flex;
	justify-content: space-between;
	margin: 0;
	padding: 30px 0 20px 10px;
	font-size: 29px;
}
.theme_top .main_box:before{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
	width: 100%;
	height: 4px;
	background: -moz-linear-gradient(left, #0167bc, transparent);
	background: -webkit-linear-gradient(left, #0167bc, transparent);
	background: linear-gradient(to right, #0167bc, transparent);
}
.theme_top .main_box:after{
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	display: inline-block;
	width: 100%;
	height: 4px;
	background: -moz-linear-gradient(left, #0167bc, transparent);
	background: -webkit-linear-gradient(left, #0167bc, transparent);
	background: linear-gradient(to right, #0167bc, transparent);
}

.theme_top .top_main .main_tags{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	margin: 20px 0 0;
}
.theme_top .top_main .main_tags span{
	display: inline-block;
	padding: 8px 15px;
	background: #3C96DC;
	color: #fff;
	font-size: 15px;
	font-weight: bold;
}
.theme_top .top_main .main_tags span + span{
	margin-left: 10px;
}
.theme_block + .theme_block{
	margin-top: 50px;
}
.theme_block .block_inner{
	margin: 0 auto;
	width: 950px;
}
.theme_block .block_inner + .block_inner{
	margin-top: 50px;
}
.theme_block .block_inner-img_box{
	display: flex;
	justify-content: space-between;
	width: 1366px;
}
.theme_block .block_inner-img_box .txt_box{
	width: calc(50% - 25px);
}
.theme_block .block-txt_l .txt_box{
	padding: 0 0 0 208px;
}
.theme_block .block-txt_r .txt_box{
	padding: 0 208px 0 0;
}
.theme_block .txt_box .main_list{
	margin: 0;
	padding: 0;
	list-style: none;
}
.theme_block .txt_box .main_list + p{
	margin-top: 40px;
}
.theme_block .txt_box h3{
	font-size: 21px;
	font-weight: bold;
}
.theme_block .txt_box P{
	margin: 33px 0 0;
}
.theme_block .txt_box .main_list li{
	position: relative;
	font-weight: bold;
	line-height: 1.5;
}
.theme_block .txt_box .main_list li:not(:first-child){
	margin: 13px 0 0;
}
.theme_block .txt_box .main_list li:not(:last-child){
	padding: 0 0 0 28px;
}
.theme_block .txt_box .main_list li:last-child{
	text-align: right;
}
.theme_block .txt_box .main_list li:not(:last-child):before{
	content: "";
	position: absolute;
	display: inline-block;
	top: 0.7em;
	left: 0;
	width: 20px;
	height: 20px;
	background-size: contain;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	background: url(/content/dam/nttcom/hq/jp/business/sdpf/img/check_icon.png) 50%/20px no-repeat;
}

.theme_block .block_inner-img_box .img_box{
	width: calc(50% - 25px);
	margin: 0;
}
.theme_block .img_box + .txt_box{
	margin: 28px 0 0;
}

.theme_block-02_02 .img_box h3{
	margin: 0;
	padding: 0 0 0 208px;
	font-size: 40px;
	line-height: 1.8;
}
.theme_block-02_02 .img_box img{
	margin: 15px 0 0;
}
.theme_block-02_02 .block_inner:first-child .txt_box{
	margin: 45px 0 0;
}
.theme_block-03_01 .block_inner .txt_box{
	margin: 35px 0 0;
}


/*
 * ----- ユースケース -----
*/
.care_usecase{
	margin-top: -2px;
	padding-top: 82px;
}
.usecase_block{
	margin: 60px 0;
}

.usecase_block-01{
	background: url(/content/dam/nttcom/hq/jp/business/sdpf/img/case01_block02_01.png) no-repeat top left -100px;
}
.usecase_block-02{
	background: url(/content/dam/nttcom/hq/jp/business/sdpf/img/case01_block02_02.png) no-repeat top right -100px;
}
.usecase_block-03{
	padding: 0 0 20px;
	background: url(/content/dam/nttcom/hq/jp/business/sdpf/img/case01_block02_03.png) no-repeat top left -100px;
}


.usecase_block .block_inner{
	width: 1000px;
	margin: 0 auto;
}
.usecase_heading span{
	background: #0167BC;
	display: inline-block;
	padding: 7px 21px 5px;
	color: #fff;
	font-size: 18px;
	border-radius: 5px 5px 0 0;
}
.usecase_heading h3{
	position: relative;
	margin: 0;
	padding: 44px 30px 34px;
	font-size: 29px;
}
.usecase_heading h3:before{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
	width: 100%;
	height: 2px;
	background: -moz-linear-gradient(left, #13448f, transparent);
	background: -webkit-linear-gradient(left, #13448f, transparent);
	background: linear-gradient(to right, #13448f, transparent);
}
.usecase_heading h3:after{
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	display: inline-block;
	width: 100%;
	height: 2px;
	background: -moz-linear-gradient(left, #13448f, transparent);
	background: -webkit-linear-gradient(left, #13448f, transparent);
	background: linear-gradient(to right, #13448f, transparent);
}

.usecase_main{
	padding: 34px 23px;
}
.usecase_main P{
	margin: 33px 0 0;
}

.usecase_list{
	margin: 7px 0 40px;
	font-weight: bold;
}
.usecase_effect{
	display: flex;
	margin: 42px 0 0;
	padding: 0 0 0 40px;
}
.usecase_effect .effect_sb{
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	width: 100px;
	height: 100px;
	padding: 0 0 10px;
	background: #729BCC;
	color: #fff;
	font-size: 24px;
	box-shadow: 0 0 10px 0 rgba(163,163,163,0.50);
	z-index: 10;
}
.usecase_effect .effect_sb p{
	margin: 0;
}
.usecase_effect .effect_sb span{
	font-size: 12px;
	font-weight: bold;
}
.usecase_effect .usecase_list{
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: calc(100% - 150px);
	margin: 0;
	padding: 15px 0 15px 50px;
	background: #ECF1F7;
}
.usecase_effect .usecase_list.case_list-circle li::before{
	background: #0167BC;
}




/*
 * ----- リファレンスアーキテクチャ -----
*/
.care_ra{
	margin-top: -82px;
	padding-top: 82px;
}
.care_ra .heading_inner{
	padding: 58px 0;
}
.care_ra .heading_inner .heading_ttl{
	font-size: 37px;
}
.care_ra .heading_inner .heading_ttl span{
	font-size: 26px;
}
.ra_block .block_inner{
	width: 950px;
	margin: 0 auto;
}


.ra_switch{
	margin: 65px 0 60px;
}
.ra_switch .switch_inner{
	margin: 20px 3px 0;
}
.ra_switch .switch_btnWrap{
	text-align: center;
}
.ra_switch .switch_btn{
	position: relative;
	display: inline-block;
	width: 300px;
	padding: 12px;
	background: #004386;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	text-align: center;
}
.ra_switch .switch_btn:before,
.ra_switch .switch_btn:after{
	content: "";
	position: absolute;
	right: 29px;
	top: 50%;
	width: 8px;
	height: 2px;
	background: #fff;
}
.ra_switch .switch_btn:before{
	transform: translateY(-50%);
}
.ra_switch .switch_btn:after{
	transform: translateY(-50%) rotate(-90deg);
}
.is-open.ra_switch .switch_btn:after{
	display: none;
}

.ra_switch .switch_btn:hover{
	cursor: pointer;
}
.ra_switch .switch_img-after,
.ra_switch.is-open .switch_img-before,
.ra_switch .service_listWrap{
	display: none;
}
.ra_switch.is-open .switch_img-after{
	display: block;
}
.ra_switch .service_list{
	display: flex;
	flex-wrap: wrap;
	margin: 0 0 27px;
	padding: 0;
	list-style: none;
}
.ra_switch .service_list .list_item{
	display: flex;
	justify-content: space-between;
	width: calc((100% - 24px) / 3);
	margin-right: 12px;
}
.ra_switch .service_list .list_item:nth-child(3n){
	margin-right: 0;
}
.ra_switch .service_list .list_item:nth-child(n + 4){
	margin-top: 25px;
}
.ra_switch .service_list .list_item .item_img img{
	width: 45px;
}
.ra_switch .service_list .list_item .item_main{
	width: calc(100% - 55px);
	font-weight: bold;
}
.ra_switch .service_list .list_item .item_main a{
	position: relative;
	display: inline-block;
	padding: 0 48px 0 0;
	font-size: 13px;
}
.ra_switch .service_list .list_item .item_main a::after{
	content: "";
	position: absolute;
	right: 30px;
	left: auto;
	top: 50%;
	width: 5px;
	height: 5px;
	margin-top: -4px;
	border-bottom: 2px solid #0e367d;
	border-right: 2px solid #0e367d;
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.ra_switch .service_list .list_item .item_main p{
	margin: 5px 0 0;
	font-size: 13px;
	line-height: 1.6;
}


.ra_block .clr-bl{
	color: #3F72AF;
}
.ra_block .fd_heading{
	margin: 0;
	font-size: 21px;
	font-weight: bold;
}
.ra_block .fd_list{
	display: flex;
	margin: 20px 3px 0;
	font-size: 12px;
	flex-wrap: wrap;
}
.ra_block .fd_list ul{
	margin: 10px 0 0;
	padding: 0;
	list-style: none;
	line-height: 1.5;
}
.ra_block .fd_list .point ul{
	margin: 7px 0 0;
}
.ra_block .fd_list ul li{
	padding: 0 0 0 1em;
	text-indent: -1em;
}
.ra_block .fd_list > dt{
	display: flex;
	align-items: center;
	width: 260px;
	padding: 0 0 0 25px;
	font-weight: bold;
}
.ra_block .fd_list > dt span{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	margin: 0 17px 0 0;
	border-radius: 2px;
	background: -moz-linear-gradient(right, #13448f, #0167bc);
	background: -webkit-linear-gradient(right, #13448f, #0167bc);
	background: linear-gradient(to left, #13448f, #0167bc);
	color: #fff;
	font-size: 15px;
}
.ra_block .fd_list > dd{
	display: flex;
	align-items: center;
	width: calc(100% - 260px);
	min-height: 64px;
	padding: 12px 10px 12px 0;
}
.ra_block .fd_list > dd p{
	line-height: 1.5;
}
.ra_block .fd_list > dd p + p,
.ra_block .fd_list > dd ul + p{
	margin: 10px 0 0;
}

.ra_block .fd_list > dt,
.ra_block .fd_list > dd{
	border-bottom: 2px solid #0167BC;
}
.ra_block .fd_list > dt:first-of-type,
.ra_block .fd_list > dd:first-of-type{
	border-top: 2px solid #0167BC;
}
.ra_block .fd_list > dd .point{
	margin: 10px 0 0;
}
.ra_block .fd_list > dd .point .point_ttl{
	padding: 4px 3px;
	background: #3F72AF;
	color: #fff;
}
.ra_block .fd_list > dd .point .point_txt{
	margin: 7px 0 0;
	color: #3F72AF;
}
.ra_block .fd_list .bg_gy{
	background: #F5F5F5;
}

.ra_block .fd_list .info_list{
	margin: 30px 0 0 10px;
}
.ra_block .fd_list .info_list dt{
	font-weight: bold;
}
.ra_block .fd_list .info_list dt:not(:first-of-type){
	margin: 15px 0 0;
}
.ra_block .fd_list .info_list dd{
	margin: 10px 0 0 1rem;
	padding: 0 0 0 1rem;
	text-indent: -0.8rem;
}

.ra_block .fd_list .indent_list ul{
	margin: 0;
	padding: 0 0 0 0.7rem;
	text-indent: -0.8rem;
}


/*
 * ----- タスク -----
*/
.care_task{
	margin: 70px 0 0;
}
.care_task .heading_inner{
	padding: 58px 0;
}
.care_task .heading_inner .heading_ttl{
	font-size: 40px;
}
.care_task .heading_inner .heading_ttl span{
	font-size: 30px;
}
.task_block .block_inner{
	width: 950px;
	margin: 0 auto;
}
.task_block .txt_cs{
	margin: 45px 0;
	color: #BFBFBF;
	font-size: 30px;
	font-weight: bold;
	text-align: center;
}





@media screen and (max-width: 768px) {
	/*
	 * ----- careページ 共通 -----
	*/
	.case_wrap img{
		max-width: 100%;
	}

	.primary_heading .heading_inner{
		width: 100%;
		padding: 43px 30px;
	}

	.secondary_heading{
		width: calc(100% - 60px);
	}

	/*
	 * ----- テーマ -----
	*/
	.theme_heading{
		top: 67px;
	}
	.theme_top .top_main,
	.theme_block .block_inner,
	.theme_block .block_inner-img_box,
	.theme_block .block_inner-img_box .txt_box,
	.theme_block .block_inner-img_box .img_box{
		width: 100%;
	}
	.theme_block .block_inner-img_box .img_box{
		margin: 30px 0;
		text-align: center;
	}
	.theme_block .block_inner-img_box{
		display: block;
	}
	.theme_block .img_box{
		padding: 0 30px!important;
	}
	.theme_block .txt_box{
		padding: 0 30px!important;
	}

	.theme_block-02_02 .img_box h3{
		padding: 0 60px;
		text-align: left;
	}
	.theme_block-02_02 .img_box h3 br{
		display: none;
	}
	.theme_top .top_main .main_tags span{
		padding: 8px 10px;
		font-size: 13px;
	}

	/*
	 * ----- ユースケース -----
	*/
	.care_usecase{
		margin: 13px 0 0;
		padding-top: 67px;
	}
	.usecase_block{
		padding: 0 30px;
	}
	.usecase_block .block_inner{
		width: 100%;
	}

	/*
	 * ----- リファレンスアーキテクチャ -----
	*/
	.care_ra{
		margin-top: -67px;
		padding-top: 67px;
	}
	.ra_block{
		padding: 0 50px;
	}
	.ra_block .block_inner{
		width: 100%;
	}

	/*
	 * ----- タスク -----
	*/
	.task_block .block_inner{
		width: 100%;
	}


	/*
	 * ----- careページ 共通 -----
	*/
	.primary_heading .heading_inner p,
	.primary_heading .heading_inner .heading_ttl,
	.primary_heading .heading_inner .heading_ttl span{
		font-size: 16px;
		line-height: 1.5;
	}
	.primary_heading .heading_inner .heading_ttl{
		display: block;
	}
	.primary_heading .heading_inner .heading_ttl span{
		margin-left: 0;
	}
	.primary_heading .heading_inner .heading_ttl img{
		width: 25px;
		margin: 0 8px 0 0;
	}

	.secondary_heading{
		margin: 45px auto 30px;
	}
	.secondary_heading:before{
		height: 54px;
	}
	.secondary_heading span{
		display: block;
		padding: 0 0 0 15px;
		font-size: 16px;
	}

	.secondary_heading i{
		margin-left: 10px;
		font-size: 12px;
	}

	.care_back{
		margin-top: 50px;
	}

	/*
	 * ----- テーマ -----
	*/
	.theme_top .top_main{
		margin: 40px auto 0;
		padding: 0 10px;
	}
	.theme_top .main_box{
		display: block;
		padding-top: 20px;
	}
	.theme_top .main_box .box_txt{
		width: 100%;
		font-size: 34px;
	}
	.theme_block + .theme_block{
		margin-top: 30px;
	}
	.theme_block .txt_box .main_list + p{
		margin-top: 30px;
	}
	.theme_block .txt_box P{
		margin-top: 30px;
	}
	.theme_block-02_02 .img_box h3{
		padding: 0;
		font-size: 25px;
		line-height: 1.5;
	}
	.theme_block-02_02 .block_inner:first-child .txt_box{
		margin-top: 30px;
	}
	.theme_block-02_02 .img_box img{
		margin: 0;
	}


		/*
	 * ----- ユースケース -----
	*/
	.usecase_block{
		margin-top: 40px;
	}
	.usecase_heading h3{
		padding: 20px 20px;
		font-size: 20px;
	}
	.usecase_main{
		padding: 20px 10px;
	}
	.usecase_effect{
		display: block;
		padding: 0;
	}
	.usecase_effect .effect_sb{
		flex-direction: row;
		justify-content: flex-start;
		width: auto;
		height: auto;
		padding: 0 10px;
		font-size: 20px;
	}
	.usecase_effect .effect_sb span{
		margin: 0 0 0 10px;
	}
	.usecase_effect .usecase_list{
		width: calc(100% - 30px);
		padding: 10px 15px;
	}

	/*
	 * ----- リファレンスアーキテクチャ -----
	*/
	.ra_block{
		padding: 0 30px;
	}
	.ra_switch{
		margin: 30px 0;
	}
	.ra_switch .switch_inner{
		display: block;
	}
	.ra_switch .service_list .list_item{
		width: 100%;
		margin: 0;
	}
	.ra_switch .service_list .list_item:not(:first-child){
		margin-top: 10px;
	}
	.ra_switch .service_list .list_item .item_main p{
		margin: 5px 0 0;
		line-height: 1.3;
	}
	.ra_block .fd_list{
		display: block;
		margin-top: 30px;
	}
	.ra_block .fd_list > dt,
	.ra_block .fd_list > dd{
		width: 100%;
	}
	.ra_block .fd_list > dd{
		padding: 10px;
	}
	.ra_block .fd_list > dt:not(:first-of-type){
		padding-top: 10px;
	}

	.ra_block .fd_list > dt{
		border-top: 2px solid #0167BC;
		border-bottom: none;
		padding: 15px 10px 8px;
	}
	.ra_block .fd_list > dd{
		border: none;
		padding: 8px 10px 15px;
	}
	.ra_block .fd_list > dd:first-of-type{
		border: none;
	}
	.ra_block .fd_list > dd:last-of-type{
		border-bottom: 2px solid #0167BC;
	}

	.care_back a{
		width: calc(100% - 40px);
		margin: 0 20px;
	}
}


/* =========================================================
 * ふわっと出てくるギミック
 * ====================================================== */
.sa--up {
	opacity: 0;
	transition: all .5s ease;
	-ms-transform: translate(0, 10px);
			transform: translate(0, 10px);
}
.sa--up.show {
	opacity: 1;
	-ms-transform: none;
			transform: none;
}

@media screen and (max-width: 768px){
	.sa--up{
		opacity: 0;
		transition: all .5s ease;
		-ms-transform: translate(0, 10px);
		transform: translate(0, 10px);
	}
	.sa--up.show{
		opacity: 1;
		-ms-transform: none;
		transform: none;
	}
}



/* モーダルデザイン */
.modal_wrap{
	min-width: 100%;
	background: #F5F6F7;
}
#cboxOverlay{
	background-color: rgb(0 87 153 / 0.7);
}
.barrier_block{
	margin: 50px 0 0;
	padding: 50px 30px 40px;
	background: #F4F5F6;
}
.barrier_block .barrier_ttl-sub{
	text-align: center;
}
.barrier_block .barrier_ttl-sub span{
	display: inline-block;
	padding: 9px 26px 5px;
	background: #3C96DC;
	color: #fff;
	font-weight: bold;
	font-size: 21px;
	line-height: 1;
}
.barrier_block .barrier_ttl-main{
	margin: 10px 0 0;
	font-size: 29px;
	text-align: center;
}
.barrier_block .barrier_lists{
	display: flex;
	justify-content: space-between;
	list-style: none;
	margin: 20px 0 0;
	padding: 0 20px;
}
.barrier_block .item_heading{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 0 8px;
	font-size: 18px;
	font-weight: bold;
}
.barrier_block .item_heading::after{
	content: "";
	position: absolute;
	display: inline-block;
	width: 70px;
	height: 5px;
	bottom: 0%;
	left: 50%;
	background: #0167BC;
	transform: translateX(-50%);
}
.barrier_block .item_heading span{
	display: inline-block;
	margin: 0 0 2px;
	font-size: 20px;
	line-height: 1;
}
.barrier_block .item_ttl{
	margin: 13px 0 0;
	color: #004386;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	line-height: 1.4;
}

.barrier_block .barrier_lists .lists_item{
	width: calc((100% - 125px) / 3);
}
.barrier_block .barrier_lists .lists_item img{
	width: 100%;
	margin: 15px 0 0;
}
.barrier_block .barrier_lists .lists_item .item_list{
	min-height: 180px;
	list-style: none;
	margin: 15px 0 0;
	padding: 0;
}
.barrier_block .barrier_lists .lists_item .item_list li {
	position: relative;
	padding: 0 0 0 27px;
	font-size: 15px;
	line-height: 1.5;
}
.barrier_block .barrier_lists .lists_item .item_list li + li{
	margin: 5px 0 0;
}
.barrier_block .barrier_lists .lists_item .item_list li::before{
	content: "";
	position: absolute;
	display: inline-block;
	top: 0.7em;
	left: 0;
	width: 20px;
	height: 20px;
	background-size: contain;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	background: url(/content/dam/nttcom/hq/jp/business/sdpf/img/modal_check_icon.png) 50%/20px no-repeat;
}
.barrier_block .barrier_btm{
	margin: 27px 0 0;
	color: #004386;
	font-size: 24px;
	font-weight: bold;
	line-height: 1.3;
	text-align: center;
}
@media screen and (max-width: 768px) {
	.barrier_block{
		margin-top: 20px;
		padding: 20px 10px;
	}
	.barrier_block .barrier_ttl-main{
		font-size: 19px;
		line-height: 1.3;
	}
	.barrier_block .barrier_lists{
		display: block;
		margin: 20px 0 0;
		padding: 0 10px;
	}
	.barrier_block .barrier_lists .lists_item{
		width: 100%;
	}
	.barrier_block .barrier_lists .lists_item + .lists_item{
		margin-top: 50px;
	}
	.barrier_block .barrier_lists .lists_item .item_list{
		min-height: auto;
	}
	.barrier_block .barrier_btm{
		font-size: 15px;
	}

}