@charset "UTF-8";


/* =========================================================
 * スライドナビ(グローバルナビ)
 * @ SLIDE NAVI(GLOBAL NAVI)
 * ====================================================== */
.slideNavi ul{
	list-style:none;
	margin:0;
	padding:0;
}
nav,
.searchBox,
.languageBox {
	z-index: 200000;
	position: fixed;
	width: 100%;
}

.slideNavi .naviBox_toggleMenu {
	display: none;
	padding-left:35px;
	list-style:none;
}
.slideNavi .naviBox_toggleMenu.disBlock{
	display:block;
}
.slideNavi .naviBoxMenu {
	padding-left:35px;
	list-style:none;
}

.slideNavi {
}
.slideNavi {
	z-index: 200000;
	position: absolute;
	top: 0;
	right: 0;
	width: 340px;
	padding: 0;
	background:#fff;
	overflow-x:hidden;
	overflow-y:auto;
	-webkit-transform: translate(100%);
			transform: translate(100%);
	-webkit-transition: -webkit-transform 1.0s ease;
			transition: transform 1.0s ease;
	*display: none;
}
.slideNavi.show {
	-webkit-transform: translate(0%);
			transform: translate(0%);
}


.slideNavi .inner{
	padding:20px;
}
.slideNavi .navLink{
	text-align:right;
}
.slideNavi .navLink ul li{
	margin-right:4px;
	padding: 9px;
	display:inline-block;
	vertical-align:middle
}
.slideNavi .navLink ul li img{
	width: 20px;
}

.slideNavi .navLink ul li.closeBtn img{
	width: 18px;
}

/*ヘッダーのメニューボタン*/
.slideNavi ul li.menuBt{
	margin-top:0;
}
.slideNavi ul li.menuBt div{
	padding:10px;
	display:inline-block;
	padding: 9px 10px;
}

.slideNavi ul li.menuBt a{
	text-decoration:none;
	color:#193477;
	font-size:14px;
	font-weight:bold;
}

.slideNavi .navLink ul li.closeBtn{
	margin-right:0;
}
/*開いているアイテム*/
.slideNavi ul li.currentItem{
	background:#193477;
	margin-top:0;
}
.slideNavi ul li.currentItem div{
	padding:5px;
	display:inline-block;
	text-decoration:none;
	color:#fff;
	font-size:14px;
	font-weight:bold;
}


.slideNavi .menu{
	color:#999999;
	font-weight:bold;
	font-size:14px;
	line-height:14px;
	margin:50px 0 0;
/*	height:100px;*/
}
.slideNavi .menu p{
	margin-bottom:15px;
}
.slideNavi .menu a{
	text-decoration:none;
	color:#193477;
}

.slideNavi .menu li{
	padding:0;
}
.slideNavi .menu li span.naviBox_toggle-open,
.slideNavi .menu li span.naviBox_toggle-close,
.slideNavi .menu li span.naviBox_toggle-none{
	display:block;
	padding:5px 20px 5px 20px;
	line-height:1.9;
	font-size:16px;
}
.slideNavi .menu li span.naviBox_toggle-open{
	background:url(/content/dam/nttcom/cmn/img/btn-menu-close.png) no-repeat right 9px;
	background-size: 21px 21px;

}
.slideNavi .menu li span.naviBox_toggle-close{
	background:url(/content/dam/nttcom/cmn/img/btn-menu-open.png) no-repeat right 9px;
	background-size: 21px 21px;
}
.slideNavi .menu li span.naviBox_toggle-none{
	background:none;
}

.naviBox_toggleMenu li{
	text-indent:-48px;
	padding-left:48px;
}
.naviBox_toggle-close img,
.naviBox_toggle-open img,
.naviBox_toggle-none img,
.naviBox_toggleMenu li img{
	width:33px;
	margin-bottom: -7px;
	margin-right:15px;
/*	vertical-align:middle;*/
}
.slideNavi .menu li li{
	padding-left:48px;
	padding-top:13px;
	padding-bottom:13px;
	line-height:1.4;
}
.slideNavi .menu li li ul{
	margin-top:10px;
}
.slideNavi .menu li li li{
	padding-top:8px;
	padding-bottom:8px;
	padding-left:0;
	text-indent: 0;
}
.searchBox .slideNavi {
	width: 320px;
}
.searchBox .Inner{
	padding:20px 50px 20px 20px;
}

.searchBox .searchBox_itemWrap{
	margin:30px 0;
}

.searchBox .searchBox_itemWrap .searchInput{
	max-width:35%;
	height:40px;
	padding:0 70px 0 10px;
	background:#eee;
	border:1px solid #eee;
	font-size:1rem;
}

.searchBox .searchBox_itemWrap #sideSearchBtn{
	float:right;
	min-width:30%;
	height:40px;
	padding:7px;
	margin:0;
	color:#fff;
	background:#193477;
	border:1px solid #193477;
	font-size:14px;
	cursor: pointer;
	-webkit-appearance: none;
	margin-left:5px;
}
.searchBox .searchBox_itemWrap #sideSearchBtngoo{
	float:right;
	min-width:30%;
	height:40px;
	padding:7px;
	margin:0;
	color:#fff;
	background:#193477;
	border:1px solid #193477;
	font-size:14px;
	cursor: pointer;
	-webkit-appearance: none;
	margin-left:5px;
}
.searchBox .searchBox_itemWrap .clearButton{
	position:absolute;
	top:115px;
	right:40%;
	color:#666;
	font-size:10px;
	display:none;
	cursor: pointer;
}

.searchBox .searchBox_itemWrap .clearButton img{
	width:7px;
	height:7px;
	margin-right: 2px;
}

input::-ms-clear {
	visibility:hidden
}

.searchBox .results{
	margin-top:20px;
	font-size:14px;
	color:#727272;
}
.searchBox .results a{
	text-decoration:none;
	color:#193477;
}
.searchBox .results .resultsCount{
	padding-bottom:10px;
}
.searchBox .results .topResults{
	border-top:2px solid #ccc;
	padding-top:20px;
	display:none;
}
.searchBox .results .resultsDetail{
	margin-bottom:50px;
}
.searchBox .results .searchBlock{
	margin:20px 0;
}


/*言語選択*/
.languageBox .slideNavi {
	width: 70%;
}
.languageBox .langInner{
	padding:20px 50px 20px 20px;
}
.languageBox .leftArea{
	width:46%;
	float:left;
}
.languageBox .rightArea{
	width:46%;
	float:right;
}
.languageBox .leftArea h3,
.languageBox .rightArea h3{
	font-size:20px;
	border-bottom:1px solid #ccc;
	padding-bottom:10px;
	margin-top:30px;
}
.languageBox table.lang{
	width:100%;
	margin-top:10px;
}
.languageBox table.lang th,
.languageBox table.lang td{
	padding:5px 0;
	font-size:12px;
	line-height:1.2;
	border:none;
	background:none;
}
.languageBox table.lang th{
	width:50%;
	text-align:left;
}
.languageBox table.lang th span{
	word-wrap: break-word;
	color:#666;
}
.languageBox table.lang td{
	color:#193477;
	text-align:left;
	line-height: 1.4;
}
.languageBox table.lang td a{
	text-decoration:none;
	color:#193477;
}
.selectLanguage{
	background:#ebebeb;
	padding:10px;
	font-size:12px;
	line-height: 1.4;
}
.selectLanguage a{
	text-decoration:none;
	color:#193477;
}
.selectLanguage span.ttl{
	margin-right:5px;
}
.selectLanguage span.aclang{
	margin-right:20px;
}
/* =========================================================
 * オーバーレイ部分
 * @ #body-overlay
 * ====================================================== */
#body-overlay{
 	width: 100%;
 	opacity : 0.2;
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index : 99;
	background: #000;
}


/* =========================================================
 * 20151201 追加
 * ====================================================== */
.slideNavi_powered {
	width: 78px;
	margin-top: 5px;
}
.slideNavi_powered img {
	width: 100%;
}

/* =========================================================
 * 20151204 追加
 * ====================================================== */

.slideNavi .menu ul li.naviBox_menuItem:not(:last-child) {
	margin-bottom: 30px
}
.slideNavi .menu li li {
	padding-top: 5px;
	padding-bottom: 5px;
}



/* =========================================================
 * 20160603 追加
 * 検索範囲のトグル追加
 * ====================================================== */
.searchBox_search_toggle {
	display: table;
	width: 100%;
	margin-top: 10px;
}
.searchBox_search_toggle_title,
.searchBox_search_toggle_select {
	display: table-cell;
	vertical-align: middle;
}

.searchBox_search_toggle_title {
	width: 30%;
}
.searchBox_search_toggle_select {
	width: 70%;
}
.searchBox_search_toggle_select select {
	width: 100%;
	height: 40px;
}

/* =========================================================
 * 20160603 追加
 * ====================================================== */

.slideNavi .menu ul li.serviceTtl {
	margin-bottom: 10px;
	margin-left:20px;
	font-size: 16px;
}

ul.recoSet{
	margin-left:20px;
	margin-top:20px;
	font-size: 16px;
}
.slideNavi .menu ul.recoSet li li{
	padding:10px 0 5px 48px;
	
}
ul.other{
	margin-left:20px;
	margin-top:20px;
	font-size: 16px;
}





/* =========================================================
 * タブレット版
 * 768px以下に適応
 * ====================================================== */

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

.slideNavi {
	width: 50%;
	font-size: 10px;
}
/*サイト内検索*/

.searchBox .searchBox_itemWrap .clearButton{

}

/*言語選択*/
.languageBox .langInner{
	padding:.5rem 1.25rem .5rem .0rem;
}
.languageBox .slideNavi {
	width: 70%;
}
.languageBox table.lang th{
	width:50%;
	text-align:left;
}
.languageBox .leftArea{
	width:100%;
	float:none;
}
.languageBox .rightArea{
	width:100%;
	float:none;
}

}

/* =========================================================
 * スマホ版
 * 480px以下に適応
 * ====================================================== */

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

.slideNavi {
	width: 80%;
	font-size: 10px;
}
.slideNavi .navLink ul li{
	margin-right:6px;
}

/*サイト内検索*/
.searchBox .slideNavi {
	width: 90%;
}
.searchBox .filterArea .filter_inner{
	color:#fff;
	font-size:.8rem;
}
.searchBox .inner{
	font-size:.8rem;
}
.searchBox .searchBox_itemWrap .clearButton{
	left:30%;
}
.searchBox .results{
	font-size:.8rem;
}

/*言語選択*/
.languageBox .langInner{
	padding:.5rem 1.25rem .5rem .0rem;
}
.languageBox .slideNavi {
		width: 90%;
}
.languageBox table.lang th{
	width:50%;
	text-align:left;
}

.searchBox .searchBox_itemWrap .searchInput{
	max-width:26%;
	height:40px;
	padding:0 60px 0 10px;
	background:#eee;
	border:1px solid #eee;
	font-size:1rem;
}

.searchBox .searchBox_itemWrap #sideSearchBtn{
	float:right;
	min-width:30%;
	height:40px;
	padding:5px;
	margin:0;
	color:#fff;
	background:#193477;
	border:1px solid #193477;
	font-size:14px;
	cursor: pointer;
	-webkit-appearance: none;
	margin-left:5px;
}

}