/* Reset default browser styles */
body {
//   width: 100%;
   font-family: "Nunito Sans", sans-serif;
   margin: 0;
   padding: 0;

}

ul.nomark {
  list-style: none;
}

#wrap{ 
  width: 65%;  
  margin: 0 auto;
  text-align:left;
  background-color: whitesmoke;
  position:relative;
}

h2,h1 {
  margin: 0;
}



code { 
   color: #444; 
   //background-color: #e7edf3;; padding: 2px 4px; font-size: 100%; border-radius: 4px; 
   background-color: #DCE4E5; padding: 2px 4px; font-size: 100%; border-radius: 4px; 
   font-family: Menlo, Monaco, 'Courier New', monospace;
}
table { margin: 0; 
 border-collapse: collapse;
 border-spacing: 0;
	font-size: 90%;}
        th, td { padding-left: 10px; padding-right: 10px; border: 1px solid #ddd; }
        th { background-color: #f4f4f4; }

caption {
  font-weight: bold;
  font-size: 120%;
  text-align: left; /* 左 */
}

li {
   font-size: 90%;
}

li.example {
   font-size: 104%;
   padding-top: 1em;
}

li.example2 {
   font-size: 108%;
   list-style-type: circle;
}

pre {
position: relative;
background: #364549;
color: #e3e3e3;
margin: 0 0 1.5em;
padding: 1em;
font-size: 95%;
border: none;
}
/*　code用タグ　*/
pre .htmltag, pre .csstag, pre .phptag, pre .javatag {
position: absolute;
top: 0;
left: 0;
background: #ffbd5b;
color: #fff;
padding: 0 5px;
}
pre .csstag {
background: #6bb6ff;
}
pre .phptag {
background: #f88080;
}
pre .javatag {
background: #90d581;
}
pre .htmltag:before, pre .csstag:before, pre .phptag:before, pre .javatag:before {
font-family: "Font Awesome 5 Free";
content: '\f121';
padding-right: 6px;
}

.title  {
  font-weight: bold;
  font-size: 130%;
  color: #333;
}

p {
  line-height: 220%
}


div.method  {
  background: #fffaf4;
  padding: 0.5em;
  border-left: solid 5px #ffaf58;/*左線（実線 太さ 色）*/
  font-weight: bold;
  font-size: 120%;
  color: Maroon;
}

div.param  {
  color: #494949;/*文字色*/
  background: #eee;/*背景色*/
  border-left: solid 5px #7db4e6;/*左線*/
  padding: 0.2em;
  font-weight: bold;
  font-size: 105%;
}
div.resp  {
  color: #494949;/*文字色*/
  background: #eee;/*背景色*/
  border-left: solid 5px #00a381;/*左線*/
  padding: 0.2em;
  font-weight: bold;
  font-size: 105%;
}

div.desc  {
  font-size: 90%;
  color: #333;
  margin-left: 10pt;
}

div.path{
  color: Sienna;
  font-weight: bold;
  font-size: 110%;
}

span.method{
	border: solid 1px #454545;
}

span.def{
   color: teal;;
}

.tab-buttons span{
  font-weight: bold;
  font-size: 130%;
  //font:400 14px 'open sans',sans-serif;
  color:#333;
  background:whitesmoke;
  cursor:pointer;
  border-bottom:2px solid #ddd;
  display:block;
  width:33.3%;
  float:left;
  text-align:center;
  height:40px;
  line-height:40px;
}
.tab-content{
  //border-bottom:3px solid #ddd;
  //padding:15px;
  background:whitesmoke;
  display:block;
  //font:400 13px 'open sans',sans-serif;
  //color:#333;
}
#lamp{
  width:33.3%;
  height:2px;
  background:#333;
  display:block;
  //position:absolute;
  position:relative;
  top:40px;
  transition: all .3s ease-in;
-o-transition: all .3s ease-in;
-webkit-transition: all .3s ease-in;
-moz-transition: all .3s ease-in;
}
#lamp.content2{
  left:33.3%;
  transition: all .3s ease-in;
-o-transition: all .3s ease-in;
-webkit-transition: all .3s ease-in;
-moz-transition: all .3s ease-in;
}
#lamp.content3{
  left:66.6%;
  transition: all .3s ease-in;
-o-transition: all .3s ease-in;
-webkit-transition: all .3s ease-in;
-moz-transition: all .3s ease-in;
}

#lamp.content1{
  left:0;
  transition: all .3s ease-in;
-o-transition: all .3s ease-in;
-webkit-transition: all .3s ease-in;
-moz-transition: all .3s ease-in;
}

code.example {
  margin-left: 8px;
  line-height: 1.4;
  color: Maroon;
  font-weight: bold;
  font-size: 110%;
}

div.example {
  color: #333;
  font-size: 100%;
}