@charset "UTF-8";

/*---------------------------------

	2020/09 追加分

---------------------------------*/


/*---------------------------------
	上部ボタン
---------------------------------*/
.topcontact_bt a{
	font-size:17.5px;
}
.topcontact_bt.online_bt{
	width:440px;
	float:none;
	margin:10px 0;
}
@media screen and (max-width: 768px){
	.topcontact_bt.online_bt{
		width:100%;
		margin:0;
	}
}
/*---------------------------------
	動画（Youtube）
---------------------------------*/
.mov_area{
	width: 80%;
	margin:0 auto;
}
.mov {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
.mov iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}
@media screen and (max-width: 768px){
	.mov_area {
		width: 100%;
	}
}
/*---------------------------------
	タブ 利用シーン
---------------------------------*/
/*ポイント*/
.merit_titlearea {
	overflow: hidden;
	border-bottom: solid 3px #214a7b;
	padding-bottom: 2px;
}
.point_box {
	width: 100px;
	height: 40px;
	background-color: #214a7b;
	color: #FFF;
	float: left;
	font-size: 1.2em;
	padding: 3px;
	text-align: center;
	font-weight: bold;
	margin-right: 10px;
	margin-bottom: 5px;
}
.fs15em {
	font-size: 1.5em;
}
.point_title {
	float: left;
	font-size: 24px;
	font-weight: bold;
	height: 35px;
	margin-top: 5px;
	margin-bottom: 0;
}
@media only screen and (max-width: 768px) {
	.point_box {
		width: 100%;
	}
	.point_title {
		height: auto;
		margin-top: 5px;
		line-height:1.3em;
		margin-bottom: 5px;
	}
}
/*ポイント コンテンツ*/
.merit_contentsarea{
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
	justify-content: space-between;
}
.merit_contentsarea .merit_fig{
	width: 320px;
	margin:20px 0;
}
.merit_contentsarea .merit_fig img{
	width:100%;
}
.merit_contentsarea .merit_txt{
	width: 650px;
	margin:20px 0;
}
.merit_contentsarea .merit_txt ul{
	margin:0;
}
@media only screen and (max-width: 768px) {
	.merit_contentsarea .merit_fig,
	.merit_contentsarea .merit_txt{
		width: 100%;
	}
}
/*コメ付き注釈*/
.notes{
	position: relative;
	padding-left: 1.5em;
	zoom: 1;
	font-size:12px;
}
.notes:before {
	position: absolute;
	top: 0;
	left: 0;
	zoom: 1;
	content: '※';
}

/*ビフォーアフター*/
.beforeAfter_area{
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
	justify-content: space-between;
}
.beforeAfter_area .beforeAfter_box{
	width: 48.5%;
	padding: 2px;
	margin:20px 0;
	border: solid 1px #ccc;
	background:#FFF;
}
.beforeAfter_area .beforeAfter_triangle{
	width: 3%;
	align-self:center;
}
/*PC時 右向き三角*/
.beforeAfter_area .triangle {
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 20px 0 20px 20px;
	border-color: transparent transparent transparent #ebebeb;
	margin:0 auto;
}
@media only screen and (max-width: 768px) {
	.beforeAfter_area .beforeAfter_box,
	.beforeAfter_area .beforeAfter_triangle{
		width: 100%;
	}
	/*SP時 下向き三角*/
	.beforeAfter_area .triangle {
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 20px 20px 0 20px;
		border-color: #ebebeb transparent transparent transparent;
	}
}
.beforeAfter_area .beforeAfter_box .beforeAfter_fig{
	text-align:center;
}
.beforeAfter_area .beforeAfter_box .beforeAfter_fig img{
	width:100%;
}
.beforeAfter_area .beforeAfter_box ul{
	margin:0;
	padding:1em 0 1em 2em;
	font-size:14px;
}
.title_before{
	background-color: #e3e3e3;
	margin: 2px;
	font-size: 20px;
	font-weight: bold;
	text-align:center;
	padding: 10px 0;
}
.title_after{
	background-color: #eaf5fc;
	margin: 2px;
	font-size: 20px;
	font-weight: bold;
	text-align:center;
	padding: 10px 0;
}
/*---------------------------------
	選べるライセンスメニューはこちら
---------------------------------*/
.tabwidth{
	width:980px;
	margin:0 auto;
}
@media only screen and (max-width: 768px){
	.tabwidth {
		width: 100%;
	}
}
.plan_ttl{
	background-color: #004386;
	color: #FFF;
	font-size: 1.5em;
	padding: 15px;
	margin: 50px 0 20px !important;
	text-align: center;
	font-weight: bold;
}
.plan_ttl_txt{
	margin: 0 0 20px 0;
}
.plan_area{
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
	justify-content:space-between;
}
.plan_area > div{
	width: 49%;
	margin:0 0 20px 0;
}
@media only screen and (max-width: 768px){
	.plan_area > div{
		width: 100%;
	}
}
.plan_box{
	border: 2px solid #ebebeb;
}
.plan_name{
	color:#333;
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	line-height:1.2;
	background-color: #eaf5fc;
	padding: 15px 0;
}
.plan_name span{
	font-size:18px;
}
.plan_txt{
	color:#333;
	font-size: 16px;
	line-height: 1.3em;
	padding: 12px;
}
.plan_btn_area{
	width:65%;
	margin:0 auto 20px;
}
@media only screen and (max-width: 768px){
	.plan_btn_area{
		width:90%;
	}
}
/*ボタン角丸*/
.apply_btn{
	position: relative;
	width:100%;
	padding:10px 20px;
	text-align: center;
	line-height: 1.25;
	text-decoration:none;
	font-size:18px;
	font-weight:bold;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
	}
.apply_btn:hover{
	opacity:.7;
}
/*サービス詳細ボタン*/
.service_btn{
	background: #2665a6;/*青*/
	border: 2px solid #004386;/*濃青*/
	text-decoration: none;
	color: #FFF;
}
/*サービス詳細ボタン　くの字*/
.service_btn:after{
	content:"";
	position:absolute;
	top:0;
	bottom:.1em;
	right:1em;
	margin:auto;
	width: .3em;
	height: .3em;
	border-top: .13em solid #FFF;
	border-right: .13em solid #FFF;
	transform: rotate(45deg);
}
/*黄色ボタン*/
.support_btn{
	background: #cc023a!important;/*黄#ffd601;からドコモ赤に*/
	border: 2px solid #000000!important;/*青#004386;から臙脂に*/
	text-decoration: none;
	color: #FFFFFF!important;/*紺#004386;を白に*/
}
/*黄色ボタン　くの字*/
.support_btn:after{
	content:"";
	position:absolute;
	top:0;
	bottom:.1em;
	right:1em;
	margin:auto;
	width: .3em;
	height: .3em;
	/* border-top: .13em solid #004386; */
	/* border-right: .13em solid #004386; */
	border-top: .13em solid #fff!important;
	border-right: .13em solid #fff!important;
	transform: rotate(45deg);
}
/*---------------------------------
	タブへリンク
---------------------------------*/
.footlonk{
	border-top: solid 2px #05397c;
	text-align: center;
}
 
.footlonk ul li{
	display:inline;
	font-size: 1.1em;
	padding-left: 15px;
	padding-right: 15px;
}
.footlonk ul li.bdr{
	color:#777777;
	padding-left: 0px;
	padding-right: 0px;
}
.footlonk ul li.nbd{
		border-left: none;
}

.footlonk ul li.on{
		background-color: #004386;
}

.footlonk ul li.on a{
	color:#FFF;
	}
@media only screen and (max-width: 768px){
	.footlonk{
		border-top: solid 2px #05397c;
		text-align: center;
	}
	.footlonk ul li{
		display:inline;
		font-size: 1.1em;
		padding-left: 15px;
		padding-right: 15px;
	}
	.footlonk ul{
		margin:0;
		-webkit-margin-before: 1em;
	    -webkit-margin-after: 1em;
	    -webkit-margin-start: 0px;
	    -webkit-margin-end: 0px;
			-webkit-padding-start: 0px;
	}
	.footlonk ul li{
		display:block;
		width:100%;
		text-align: left;
	}
	.footlonk ul li a:before {
	    content: url(/content/dam/nttcom/hq/jp/business/services/security/security-measures/menlo-security/img/icon_right_arrow.png);
	    margin-right: 10px;
	}
	.footlonk ul li.on{
		display:block;
		width:90%;
			background-color: #004386;
			border-left: none;
	}
	.footlonk ul li.on a{
		color:#FFF;
		}
	.footlonk ul li.on a:before {
	    content: url(/content/dam/nttcom/hq/jp/business/services/security/security-measures/menlo-security/img/icon_right_arrow_w.png);
	}
}

/*---------------------------------

	2020/12 追加分

---------------------------------*/
/*申し込みボタンエリア*/
	.apply_area{
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
	justify-content:space-between;
}
.apply_area .full{
	width: 100%;
}
.apply_area .half{
	width: 49%;
}
/* スマホタブレット */
@media only screen and (max-width: 768px){
	.apply_area .half{
		width: 100%;
	}
}
/*角丸*/
.apply_btn{
	position: relative;
	width:100%;
	padding:10px 20px;
	text-align: center;
	line-height: 1.25;
	text-decoration:none;
	font-size:18px;
	font-weight:bold;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
	}
/*オンライン*/
.online_btn{
	background: #ffd601!important;/*赤#CF1E1Eを黄色に*/
	border: 2px solid #000000!important;/*臙脂600000を紺に*/
	text-decoration: none;
	color: #000000!important;/*白FFFFを紺に*/
}
.online_btn:hover{
	background: #fdea8a;;/*薄赤#D64040を薄黄色に*/
}
/*オンライン　くの字*/
.online_btn:after{
	content:"";
	position:absolute;
	top:0;
	bottom:.1em;
	right:1em;
	margin:auto;
	width: .3em;
	height: .3em;
	/* border-top: .13em solid #fff; */
	/* border-right: .13em solid #fff; */
	border-top: .13em solid #000000!important;
	border-right: .13em solid #000000!important;
	transform: rotate(45deg);
}
/*資料請求*/
.request_btn{
	background: #cc023a!important;/*黄#ffd601;からドコモ赤に*/
	border: 2px solid #000000!important;/*青#004386;から臙脂に*/
	text-decoration: none;
	color: #FFFFFF!important;/*紺#004386;を白に*/
}
.request_btn:hover{
	background: #cc023a!important;/*薄黄#fdea8aを薄赤に*/
}
/*資料請求　くの字*/
.request_btn:after{
	content:"";
	position:absolute;
	top:0;
	bottom:.1em;
	right:1em;
	margin:auto;
	width: .3em;
	height: .3em;
	/* border-top: .13em solid #004386; */
	/* border-right: .13em solid #004386; */
	border-top: .13em solid #fff!important;
	border-right: .13em solid #fff!important;
	transform: rotate(45deg);
}
/*追従ボタン*/
.js-contact_bt_1,
.js-contact_bt_2,
.js-contact_bt_3,
.js-contact_bt_4{
	font-weight:bold;
	text-align: center;
}

/*---------------------------------

	2021/07 追加分

---------------------------------*/
/*h1サブ*/
.tlfsize{
font-size:26px;
}

/*---------------------------------

	2022/01 追加分

---------------------------------*/
.only_sp{
	display:none;
}
@media only screen and (max-width: 480px){
	.only_sp{
		display:block;
	}
}

/*3カラムボタン*/
.apply_area .third{
	width: 32%;
}
/* スマホタブレット */
@media only screen and (max-width: 768px){
	.apply_area .third{
		width: 100%;
	}
}

/*web無害化・メール無害化ボタンを中央へ*/
@media print, screen and (min-width: 769px) {
	.subnavi_l{
		margin-left: 0;
	}
}
.item_center{
	margin:0 auto;
	overflow:hidden;
	text-align:center;
}
.item_center > div{
	display:inline-block;
	margin:0 auto;
}
@media print, screen and (max-width: 768px) {
	.item_center > div{
		display:block;
	}
}

/*タブ1*/
/*特長メリットを見るボタン*/
a .inpage_btn{
	color: #FFF;
}
a:hover .inpage_btn{
	opacity:.7;
}
.inpage_btn{
	width: 260px;
	padding: 15px 0;
	text-align: center;
	font-size: 17px;
	font-weight: bold;
	position: relative;
	background-color: #004386;
}
.inpage_btn:after{
	content:"";
	position:absolute;
	top:0;
	bottom:.1em;
	right:1em;
	margin:auto;
	width: .3em;
	height: .3em;
	border-top: .13em solid #FFF;
	border-right: .13em solid #FFF;
	transform: rotate(45deg);
}

/*導入事例*/
.case_area{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content:space-between;
}
.case_box_outer{
	width:32%;
	margin-bottom:30px;
}
@media print, screen and (max-width: 768px) {
	.case_box_outer{
		width:100%;
	}
}
.case_box_outer a{
	display:block;
}
.case_box_inner{
	padding:15px;
	border:1px solid #CCC;
}
.case_box_inner:hover{
	border:1px solid #004386;
	opacity:.7;
}
.case_photo{
	text-align:center;
}
.case_photo img{
	max-width:100%;
	border:1px solid #EEE;
}
.case_name{
	text-align:center;
	font-size:15px;
	font-weight:bold;
	color:#FFF;
	line-height:1.5;
	background-color:#004386;
	padding:5px;
	margin:5px 0;
}
.case_catch{
	line-height:1.5;
}
.case_type{
	margin: 15px auto;
	width: 50%;
	background-color: #DEEBF7;
	padding: 0.2em;
	text-align: center;
	line-height: 1.3em;
	font-size: 14px;
	background-color: #DEEBF7;
}
.case_type.w85p{
	width: 85%;
}
.case_detail_btn {
	border-radius: .5em;
	padding: 0.5em 1em;
	font-weight: bold;
	color: #FFFFFF;
	text-align: center;
	position: relative;
	background: #004386;
	width: 70%;
	margin: 0 auto;
}
.case_detail_btn:after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0.1em;
	right: 1em;
	margin: auto;
	width: 0.3em;
	height: 0.3em;
	border-top: 0.13em solid #FFF;
	border-right: 0.13em solid #FFF;
	transform: rotate(45deg);
}


/*タブ2*/
/*web無害化・メール無害化*/
.harmless_area{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content:space-between;
}
.harmless_box{
	width:30%;
	padding:15px 15px 0;
	margin-bottom:30px;
	background:yellow;
}
@media print, screen and (max-width: 768px) {
	.harmless_box{
		width:100%;
	}
}
.harmless_web{background-color:#e7f5ff;}
.harmless_mail{background-color:#e0f3d8;}

.harmless_title {
	font-size: 1.2em;
	font-weight: bold;
	text-align:center;
	background-color: #FFF;
	padding: 5px;
}
.harmless_web .harmless_title {
	border: solid 3px #05256f;
}
.harmless_mail .harmless_title {
	border: solid 3px #2d7c37;
}
.line01{
	padding: 23px 0;
	line-height: 1em;
}
.harmless_pic{
	text-align:center;
}
.harmless_pic img{
	max-width:200px;
}
.harmless_txt{
	margin-bottom:30px;
}

/*共通*/
/*資料請求枠*/
.leading_area{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content:space-between;
	border: 1px solid #ccc;
	padding:20px;
}
.leading_box{
	width:49%;
	text-align:center;
}
@media print, screen and (max-width: 768px) {
	.leading_box{
		width:100%;
	}
}
.leading_box img{
	max-width:100%;
}
/*テキスト*/
.leading_catch {
	position: relative;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
}
.leading_catch:before,
.leading_catch:after{
	content: "";
	width: 2px;
	height: 65px;
	display: inline-block;
	background: #939393;
	position: absolute;
	top: -5px;
}
.leading_catch:before {
	left: 20px;
	transform: rotate(155deg);
}
.leading_catch:after {
	right: 20px;
	transform: rotate(-155deg);
}

/*資料請求ボタン(大)*/
.leading_btn_area{
	margin-top:30px;
	padding:0 30px;
}
@media print, screen and (max-width: 768px) {
	.leading_btn_area{
		padding:0;
	}
}
.leading_btn{
	position: relative;
	width: 100%;
	padding: 15px;
	text-align: center;
	line-height: 1.25;
	text-decoration: none;
	font-size: 22px;
	font-weight: bold;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	box-shadow: 2px 2px 4px rgb(0 0 0 / 30%);
	background: #cc023a;
	border: 2px solid #000000;
	text-decoration: none;
	color: #ffffff;
}
.leading_btn:hover{
	opacity:.7;
}
.leading_btn:after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0.1em;
	right: 1em;
	margin: auto;
	width: 0.5em;
	height: 0.5em;
	border-top: 0.13em solid #ffffff;
	border-right: 0.13em solid #ffffff;
	transform: rotate(45deg);
}

/*--------------------------
/business/services/security/security-measures/menlo-security/hidden/dl.html
--------------------------*/
/*テーブル*/
.scroll-box table.dl_table{
	width:980px !important;
	margin:0 auto;
}
.dl_table,
.dl_table table,
.dl_table td,
.dl_table th {
	text-align:center;
	vertical-align: middle;
	line-height:1.6;
}

.pic{width:120px;}
.ttl{width:629px;}
.capacity{width:100px;}
.type{width:130px;}

.dl_table h3{
	text-align:left;
	font-size:16px;
	font-weight:bold;
	margin:0 0 10px 0;
}
.dl_table p{
	text-align:left;
}
/*PDF利用*/
.pdf_area{
	overflow:hidden;
	width: 100%;
	margin:0 auto;
	border: 1px solid #ccc;
	padding:20px;
}