html {  
    overflow-y:hidden;  
    overflow-y:visible;  
}  


body{
	margin: 0px;
	padding: 0px;
/* 	color: #888; */
	background-color: white;
	font-family: 'AvenirNext-Regular','YuGothic', '游ゴシック','メイリオ',Meiryo,sans-serif;
	line-height: 1.2;

}


.linktext,.filetext{
	margin: 0;
	padding: 0;
	cursor: pointer;
	font-size: 50%;
	letter-spacing: .03em;
	border-radius: 2em;
/* 	font-weight: bold; */
	color:white;
	background-color: rgba(56,153,243,1);
	padding: 1em 1.8em;
  background: #3498db;
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
/*
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
*/
/*   border-radius: 28px; */
  text-shadow: 1px 1px 3px #666666;
  font-family: Arial;
/*
  color: #ffffff;
  font-size: 20px;
  padding: 10px 20px 10px 20px;
*/
  text-decoration: none;
  
}

.linktext:hover,.filetext:hover{
/* background-color: black; */
  background: #246dc7;
  background-image: -webkit-linear-gradient(top, #246dc7, #114f75);
  background-image: -moz-linear-gradient(top, #246dc7, #114f75);
  background-image: -ms-linear-gradient(top, #246dc7, #114f75);
  background-image: -o-linear-gradient(top, #246dc7, #114f75);
  background-image: linear-gradient(to bottom, #246dc7, #114f75);
  text-decoration: none;
}


i.linktext-icon{
	font-size: 120%;
}



.headline{
/*   font-family: "HelveticaNeue-UltraLight","游明朝体", "Yu Mincho", YuMincho, serif; */
/*   font-family: "HelveticaNeue",'YuGothic', '游ゴシック',sans-serif; */
    font-family: "Palatino","游明朝体", "Yu Mincho", YuMincho, 'ＭＳ Ｐ明朝','MS PMincho',serif;

	font-size:145%;
	font-weight: normal;
	padding: 0.5em 1em 1.5em 1em;

}



.headline-sub{
  font-family: "HelveticaNeue",'YuGothic', '游ゴシック','メイリオ',Meiryo,sans-serif;

	letter-spacing: .1em;
	font-size:30%;
	margin: .5em 0em;
}


.center-text{
	text-align: center;
}




.paragraph{
	letter-spacing: -0.02em;
	line-height:1.4;
	background-color: #ffffff;
	padding: 0em 1.5em 2em 1.5em;
}

.paragraph-desc{
	padding: 0em 2em 2em 2em;
}





.caption{
	margin: 2% 0% 2% 0%;
	font-size: 45%;	
}



ul{
	margin: 0px;
	padding:0px;
}
li{
	list-style: none;
	margin: 0px;
	padding:0px;
}


a{
	text-decoration: none;
	color: #2f58b8;
	
}

a:hover{
	color: #084ed7;	
}

.file-text a :hover{
	color: black;	
}

img{
	    border-style:none;

}

/* Bread ============================ */
#bread{
	margin: 0% 0% 1% 0%;
	
	text-align: center;
	font-size: 50%;
	color: black;
	font-family: 'AvenirNext-Bold','YuGothic-Bold','メイリオ',Meiryo,sans-serif;
}

/* Title ============================ */
#title{
/*
	margin: 5% 0%;
	text-align: center;
	font-size: 80%;
	color: black;
	font-family: 'AvenirNext-Bold','YuGothic-Bold';
	
*/
/*
position:fixed;
top:20px;
left:20px;

width:150px;
height: 45px;
display: block;
z-index: 100;
background-image: url(../img/title.png);
background-size: cover;
cursor: pointer;

	background-color: rgba(0,0,0,.3);
	border-radius: 5px;	
*/
}

#title:hover{
/* 	background-position: bottom; */
		background-color: rgba(0,0,0,.5);
}

#nav-bar{
	margin:0px;
padding: 0px;
width:100%;
height: 40px;
background-color: black;
	position: fixed;
	z-index: 100;
/* 	opacity: .5; */
}


#title-bar{
	margin:0px;
padding: 0px;
	position: absolute;
	width: 300px;
	height: 40px;
	background-image: 	url(../img/titlebar.png);
	cursor: pointer;
}


/* Language ============================ */

#lang{
	position: absolute;
	right:20px;
	cursor: pointer;
	z-index: 99;
	background-color: rgba(0,0,0,.3);
	border-radius: 5px;	
	}
	
	#lang:hover{
		background-color: rgba(0,0,0,.5);

	}

#jp{
	width: 66px;
	height: 40px;
	background-image:url(../img/jp.png);
}

#kana{
	width: 70px;
	height: 40px;
	background-image:url(../img/kana.png);
}

#en{
	width: 75px;
	height: 40px;
	background-image:url(../img/en.png);

}

.lang-button{
	float:left;
}

.lang-focus{
	background-position:bottom;
}



/* list ============================ */
.orderlist-box{
/* 	border: 2px solid black; */
	padding:2% 5% 3% 5%;
	padding:0%;
/* 	background-color: rgba(255,255,255,.3); */
}


.orderlist-title{
	font-size: 70%;
/* 	font-weight: bold;	 */
	line-height: 2;
	letter-spacing: .05em;
}


.orderlist{
	cursor: pointer;
	font-size: 80%;
	line-height: 2.4;
/* 	margin: 0% 8%; */
}

.orderlist-item{
/* 	position: relative;	 */
}

.orderlist-item-text{
	color: white;
	background-color: #89A;
	border-radius: 0.5em;	
	line-height: 1.2;
	padding: 3%;
}

/*
.orderlist-item-text:hover{
	background-color: white;
}

*/


.orderlist-border{
	cursor: pointer;

	font-size: 60%;
	text-align: center;
	margin: 0%;
	padding: 0%;
	border-bottom: 1px dotted black;
	
}

.orderlist-arrow{
	cursor: pointer;

	font-size: 60%;
	text-align: center;
}

.orderlist-step-arrow{
	font-size: 200%;

	line-height: 1;
	margin-top:-.64em;
	padding: 0;
	color: #89A;
/* 	position: relative; */
/* 	top:-.5em; */
}


/* list ============================ */
.standardlist-box{
	border: 2px solid black;
	padding:2% 5% 3% 5%;
	padding:0%;
	background-color: rgba(255,255,255,.3);
}


.standardlist-title{
	font-size: 40%;
/* 	font-weight: bold;	 */
	line-height: 2;
	letter-spacing: 0.05em;
}


.standardlist{
/* 	cursor: pointer; */
	font-size: 50%;
	line-height: 2.4;
/* 	margin: 0% 8%; */
}

.standardlist-item:hover{
	background-color: white;
}



.standardlist-border{
	cursor: pointer;

	font-size: 50%;
	text-align: center;
	margin: 0%;
	padding: 0%;
	border-bottom: 1px dotted black;
	
}

.standardlist-arrow{
	cursor: pointer;

	font-size: 50%;
	text-align: center;
}



/* icon ============================ */

.notice-icon{
	font-size: 300%;	
}

.quote{
	font-family: Georgia,RyuminPro-Regular;
	line-height: 1.7;
	font-size: 100%;
}

.quote-auther{
	text-align: center;
	font-size: 60%;
	margin-top: 4%;
}

/* slider ============================ */

.image-data{
/* 	opacity: 0.5; */
/* 	margin: 2% 0% 2% 0%; */

	overflow: hidden;
	margin-bottom: 2em;

}

img.center-image{
 display: block;
 margin-left: auto;
 margin-right: auto;
}

.slider-box{
	overflow:hidden;
	position: relative;
/* 	overflow-x:scroll;	 */
	margin-bottom: 2em;
}

.slider-item{
	overflow:hidden;	

margin: 0px;
padding: 0px;
	float:left;
}

.slider-button{
	width:50px;
	height:150px;
	text-align: center;
}

.slider-button:hover{
background-position-y: bottom;
}

.slider-prev{
	position: absolute;
	top:0px;
	left:20px;
	cursor: pointer;
	z-index: 10;
	background-image: url(../img/prev.png);
	
}

.slider-next{

	position: absolute;
	top:0px;
	right:20px;
	cursor: pointer;
	z-index: 10;
		background-image: url(../img/next.png);

}


.slider-inner{
	position: absolute;
		z-index: 1;

}


.navlist-mini-icon{
	font-size: 40%;
	opacity: .7;
	margin-left: 1%;
}


.paragraph-code{
	letter-spacing: -0.02em;
	line-height:1.4;
	background-color: #ffffff;

}


.code{
	font-size: 60%;
/* 	white-space: pre-wrap; */

}

/*
.code div{
	margin: 0;
	padding: 0;
}
*/

.syntaxhighlighter{
	padding-top: 3%;
	padding-bottom: 3%;
  margin: 2%;
  width: 80%;
  margin-left: 10%;
  	border-radius: 0.5em;
}

.code-title{
color: black;
font-size: 110%;
	padding-top:4%;
	padding-bottom:0%;
	margin-bottom:0%;
	font-weight: bold;
}



/*
a.toolbar_item.command_help.help{
	height: 0px;
}
*/

/* ===================== Chapter */

.chapter{
  font-family: "游明朝体", "Yu Mincho", YuMincho, 'ＭＳ Ｐ明朝','MS PMincho',serif;
/*   background-color: #EEEEEE; */
}
.chapter-text{
/*
	border-bottom: black solid 1px;
	border-top: black solid 1px;
*/
	padding: 0em 0em 1em 0em;
	font-size:80%;
}

.desc-title{
/* font-weight: bold; */
  font-family: "游明朝体", "Yu Mincho", YuMincho, 'ＭＳ Ｐ明朝','MS PMincho',serif;
	font-size: 75%;
	line-height: 1.3;
	margin-bottom: 2%;

}
.desc-text{
	font-size: 55%;
	line-height: 1.8;
		letter-spacing: 0.01em;

}


/* ===================== table */

table{
border-collapse: collapse;
		font-size: 50%;
	border: 1px solid #000;

}


tr{
	line-height: 2;	
	border: 1px dotted #999;

}
tr:hover{
	background-color: white;
}

td{
	border-left: 1px dotted #999;

	padding-left: .5em;
	padding-right: .5em;
}

.center-box{
	margin-left: auto;
	margin-right: auto;
}


.video-container{
  position: relative;
  
  
  margin-left: 6.7%;
  margin-right: 6.7%;
  padding-bottom: 49.25%;
  
  
  padding-top: 0px;
  height: 0;
  overflow: hidden;
  margin-bottom: 1.5em;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.macapp{
	width: 20%;
/* 	background-image: url(../img/macappstore.png); */
}

.macapp:hover{
	opacity: 0.5;
/* 	width: 40%; */
/* 	background-image: url(../img/macappstore.png); */
}

.nano{
	font-size: 60%;
	letter-spacing: .05em;
	line-height: 1.2em;
}

#article{
	padding-top: 40px;	
}



.grid-box{
/* 	background-color: silver; */
	overflow: auto;
	margin-top: .5em;
	margin-bottom: 1em;
}

.grid-item{
	width: 100px;
	float: left;
	margin: 0px;
	padding: 0px;
	line-height: 0;
	cursor: pointer;
}

.grid-item:hover{
	opacity: .6;
}


.raw-container{
	margin-bottom: 2em;
}

#progress{
	position: absolute;
	top:50px;
	left:155px;
	z-index: 101;
}