@charset "UTF-8";


/*-----common--------*/


.flL{
	float:left;
}
.flR{
	float:right;
}
.vaM{
	vertical-align:middle;
}
.taC{
	text-align:center;
}

.taR{
	text-align:right;
}

.ib-gy{
	border:none !important;
}

.mt10{margin-top:10px;} .mt20{margin-top:20px;} .mt30{margin-top:30px;} .mt40{margin-top:40px;} .mt50{margin-top:50px;}
.mb5{margin-bottom:5px;} .mb10{margin-bottom:10px;} .mb20{margin-bottom:20px;} .mb30{margin-bottom:30px;} .mb40{margin-bottom:40px;} .mb50{margin-bottom:50px;}

.mR10{margin-right:10px;} .mR20{margin-right:20px;} .mR30{margin-right:30px;}
.mL10{margin-left:10px;} .mL20{margin-left:20px;} .mL30{margin-left:30px;} .mL40{margin-left:40px;}

.pa5{padding:5px;}

.fs1em{font-size:1em;} .fs12em{font-size:1.2em;} .fs13em{font-size:1.3em;} .fs14em{font-size:1.4em;} .fs15em{font-size:1.5em;} .fs16em{font-size:1.6em;} .fs17em{font-size:1.7em;} .fs18em{font-size:1.8em;} .fs19em{font-size:1.9em;} .fs2em{font-size:2em;} .fs21em{font-size:2.1em;} .fs22em{font-size:2.2em;} .fs23em{font-size:2.3em;} .fs24em{font-size:2.4em;} .fs25em{font-size:2.5em;}
.fs16px{font-sizwe:16px;}



.fwb{
	font-weight:bold;
}


.colorR{
	color:#FF0000;
}
.colorW{
	color:#FFF;
}
.colorDR{
		color:#c70505
}

.clearfix:after {
  content: "";
  display: block;
  clear: both;
}

.clearboth{
	clear: both;
}



/*PC*/
@media print, screen and (min-width: 769px) { 

.smt{
	display:none;
}

h1{
  text-align: left;
  padding-bottom: 0 !important;
}

.firstSection h1{
 text-align: center !important;
}

/*ヘッダ*/
.topcontact_bt {
    width: 215px;
    height: 45px;
    text-align: center;
    background: #ffd601;
    border: 2px solid #004386;
    padding: 12px 20px 12px 20px;
    font-family: FrutigerNeueLTW10-Bold,Frutiger Neue W01 Bd,"繝偵Λ繧ｮ繝手ｧ偵ざ ProN W3", "Hiragino Kaku Gothic ProN", "繝｡繧､繝ｪ繧ｪ", Meiryo, Helvetica, sans-serif;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
    float: left;
    position: relative;
}

.topcontact_bt a {
    text-decoration: none;
    color: #193477;
    font-size: 18px;
    font-weight: bold;
    padding-top: 12px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.topcontact_bt a:after {
    content: url(/content/dam/nttcom/hq/cmn/img/icon_right_arrow.png);
    margin-left: 10px;
}

.slider-view {
	width:200px !important;
}

.service_slider_item {
	width:200px !important;
}

/*サブナビ*/
.subnavi{
	width:240px;
	float:left;
	padding:15px;
	text-align:center;
	color:#FFF;
	font-size:1.3em;
	font-weight:bold;
	margin-bottom: 40px;
	border-radius: 12px;
	position:relative;
}
.subnavi_l{
	background-color:#4674c1;
	margin-right:50px;
	box-shadow: 0 6px 0 #073c7c;
	margin-left: 155px;
}
.subnavi_l:hover{
	background-color:#304e82;
	position: relative;
	top: 6px;
	box-shadow: 0 0 0 #000;
}
.subnavi_r{
	background-color:#29a739;
	box-shadow: 0 6px 0 #117208;
}
.subnavi_r:hover{
	background-color:#205727;
	position: relative;
	top: 6px;
	box-shadow: 0 0 0 #000;
}

.subnavi a{
	top:0;
	left:0;
	width:100%;
	height:100%;
	position:absolute;
}


/*特長メリット*/

.merit_box{
	overflow:hidden;
	background-color: #FFF;
}


.merit_box .inner_box{
	width: 259px; 
	float:left;
	background-color: #e7f5ff;
}

.merit_box .inner_box .title{
 font-size: 1.2em;
    font-weight: bold;
    background-color: #FFF;
    padding: 5px;
    border: solid 3px #05256f;
 }

.merit_box .inner_box .merrittitle1line{
	padding: 22px 0px 6px;
    line-height: 1em;
}

.merit_box .inner_box img{
	width:250px;
    padding: 10px;
	margin:0 auto;
}

.merit_box .inner_box .txt{
	padding: 0 10px;
}

.pcmr30{
	margin-right:30px;
}


.merit_mailbox .inner_box{
	width: 259px; 
	height: 478px;
	float:left;
	background-color:#e0f3d8;
}

.merit_mailbox .inner_box .title{
 font-size: 1.2em;
    font-weight: bold;
    background-color: #FFF;
    padding: 5px;
    border: solid 3px #2d7c37;
 }

.merit_mailbox .inner_box p{
	text-align:center;
}

.merit_mailbox .inner_box .merrittitle1line{
	padding: 22px 0px 26px;
    line-height: 1em;
}

.merit_mailbox .inner_box .txt{
	padding: 0 10px;
	text-align: left;
}

/*-----MenloSecurity社のサービスです。--------*/

.menerobox{
	width: 100%;
	
    background-color: #FFF;
    margin: 0 auto;
	overflow: hidden;
    margin-top: 50px;
    margin-bottom: 50px;
}

.menerobox .logo{
	float:left;
}
.menerobox .logo img{
	width:150px;
}
.menerobox .txt{
	padding:25px;
	color:#04213f;
	float:left;
}

/*-----PDFリンク--------*/
.adobeimg{
	width: 158px; 
	float: left;
}

.adobe_com{	
	width: 625px; 
	margin-left: 20px; 
	float: left;
}


/*footer*/

.footerbox{
	width: 980px;
    margin: 0 auto;
	margin-top: 50px;
}

.foottel_txt{
		background-color: #004386;
    padding: 23px 0;
    text-align: center;
    font-size: 1.4em;
    font-weight: bold;
    margin-bottom: 30px;
    color: #FFF;

}

.footcontact_bt {
    width: 435px;
    height: 70px;
    float: left;
    margin-left: 22px;
    text-align: center;
    font-family: FrutigerNeueLTW10-Bold, "Frutiger Neue W01 Bd", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, Helvetica, sans-serif;
    box-shadow: rgba(0, 0, 0, 0.3) 2px 2px 4px;
    position: relative;
    background: rgb(255, 214, 1);
    border-width: 2px;
    border-style: solid;
    border-color: rgb(0, 67, 134);
    border-image: initial;
    padding: 20px;
    border-radius: 10px;
}

.footcontact_bt a {
    text-decoration: none;
    color: #193477;
    font-size: 25px;
    font-weight: bold;
    padding-top: 20px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.footcontact_bt a:after {
    content: url(/content/dam/nttcom/hq/jp/business/services/application/mail-groupware/gsuite/img/icon_right_arrow2.png);
    margin-left: 10px;
}

.footcontact_btml{
	margin-left: 60px;
}

.freedial{
	width:960px;
	margin-top:50px;
	text-align:center;
}

.footer_title{
	font-size: 1.5em;
    font-weight: bold;
    text-align: center;
    padding-bottom: 10px;
}

.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 screen and (max-width:768px) {

.pc{
	display:none !important
}


h1{
  text-align: left;
}

/*ヘッダ*/
.topcontact_bt {
    width: 100%;
    height: 45px;
    text-align: center;
    background: #ffd601;
    border: 2px solid #004386;
    padding: 12px 20px 12px 20px;
    font-family: FrutigerNeueLTW10-Bold,Frutiger Neue W01 Bd,"繝偵Λ繧ｮ繝手ｧ偵ざ ProN W3", "Hiragino Kaku Gothic ProN", "繝｡繧､繝ｪ繧ｪ", Meiryo, Helvetica, sans-serif;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
    margin: 10px 0;
    position: relative;
}

.topcontact_bt a {
    text-decoration: none;
    color: #193477;
    font-size: 18px;
    font-weight: bold;
    padding-top: 12px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.topcontact_bt a:after {
    content: url(/content/dam/nttcom/hq/cmn/img/icon_right_arrow.png);
    margin-left: 10px;
}


/*サブナビ*/
.subnavi{
	width:100%;
	float:left;
	padding:15px;
	text-align:center;
	color:#FFF;
	font-size:1.3em;
	font-weight:bold;
	border-radius: 12px;
	position:relative;
}
.subnavi_l{
	background-color:#4674c1;
	margin-right:5px;
	margin-bottom: 15px;
	box-shadow: 0 6px 0 #073c7c;
}

.subnavi_r{
	background-color:#29a739;
	margin-bottom: 40px;
	box-shadow: 0 6px 0 #117208;
}


.subnavi a{
	top:0;
	left:0;
	width:100%;
	height:100%;
	position:absolute;
}



/*特長メリット*/

.merit_box{
	overflow:hidden;
	background-color: #FFF;
}


.merit_box .inner_box{
	width: 100%; 
	float:left;
	background-color: #e7f5ff;
	 margin-bottom: 30px;
}

.merit_box .inner_box .title{
 font-size: 1.2em;
    font-weight: bold;
    background-color: #FFF;
    padding: 5px;
    border: solid 3px #05256f;
 }

.merit_box .inner_box .merrittitle1line{
	padding: 22px 0px 6px;
    line-height: 1em;
}

.merit_box .inner_box img{
	width:90%;
    padding: 10px;
	margin:0 auto;
}

.merit_box .inner_box .txt{
	padding: 0 10px;

}

.merit_mailbox .inner_box{
		width: 100%;
    background-color: #e0f3d8;
    padding: 0 0px 5px;
    margin-bottom: 30px;
}


.merit_mailbox .inner_box .title{
 font-size: 1.2em;
    font-weight: bold;
    background-color: #FFF;
    padding: 5px;
    border: solid 3px #2d7c37;
 }

.merit_mailbox .inner_box p{
	text-align:center;
}
.merit_mailbox .inner_box p img{
	width:192px;
}
 
.merit_mailbox .inner_box .merrittitle1line{
	padding: 22px 0px 6px;
    line-height: 1em;
}



.merit_mailbox .inner_box .txt{
	padding: 0 10px;
	text-align:left;
}



/*-----MenloSecurity社のサービスです。--------*/

.menerobox{
	width: 100%;
    margin: 0 auto;
	overflow: hidden;
    margin-top: 50px;
    margin-bottom: 50px;
}

.menerobox .logo{
	float:left;
}
.menerobox .logo img{
	width:150px;
}
.menerobox .txt{
	padding:25px 0;
	color:#04213f;
	float:left;
	line-height: 1.5em;
}

/*-----PDFリンク--------*/
.adobeimg{
	width: 158px; 
	float: left;
}

.adobe_com{	
	width: 100%; 
	margin-top: 20px; 
	float: left;
}



/*footer*/
.foottel_txt {
    background-color: #004386;
    padding: 23px 0;
    text-align: center;
    font-size: 1.4em;
    line-height: 1.4em;
    font-weight: bold;
    margin-bottom: 30px;
    color: #FFF;
}

.footcontact_bt {
    width: 100%;
    height: 70px;
    float: left;
    text-align: center;
    background: #ffd601;
    border: 2px solid #004386;
    padding: 20px;
    font-family: FrutigerNeueLTW10-Bold,Frutiger Neue W01 Bd,"繝偵Λ繧ｮ繝手ｧ偵ざ ProN W3", "Hiragino Kaku Gothic ProN", "繝｡繧､繝ｪ繧ｪ", Meiryo, Helvetica, sans-serif;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
    position: relative;
}
.footcontact_bt a {
    text-decoration: none;
    color: #193477;
    font-size: 18px;
    font-weight: bold;
    padding-top: 25px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.footcontact_bt a:after {
    content: url(/content/dam/nttcom/hq/cmn/img/icon_right_arrow.png);
    margin-left: 10px;
}

.footcontact_btml{
	margin-top: 20px;
}

.freedial{
	width:100%;
	margin-top:50px;
	text-align:center;
}

.freedial img{
	width:34px;
}

.freedial span{
	font-size: 26px !important;
}

.footer_title{
	font-size: 1.5em;
    font-weight: bold;
    text-align: center;
    padding-bottom: 10px;
}

.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/network/vpn/vpn/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/network/vpn/vpn/img/icon_right_arrow_w.png);
}

}


/*5インチ*/
@media screen and (max-width:480px) {

.pc{
	display:none;
}

.link_component a {
    line-height: 3;
}

.merit_titlearea {
    overflow: hidden;
    border-bottom: solid 3px #214a7b;
    padding-bottom: 2px;
}

.point_box {
    width: 100%;
    height: 40px;
    background-color: #214a7b;
    color: #FFF;
    float: left;
    font-size: 1.2em;
    padding: 5px;
    text-align: center;
}

.point_title {
    float: left;
    font-size: 24px;
    line-height: 1.3em;
    font-weight: bold;
    padding: 5px 0;
    margin-top: 5px;
    padding: 5px 0;
}


}