@charset "utf-8";

html,
body{
    font-family:"メイリオ", Meiryo, sans-serif;
}
h1,
h2{
    font-size:16px;
    line-height:1.5;
    font-weight:bold;
    margin-top:10px;
}
h2{
    font-size:14px;
    margin-top:16px;
}
h3{
    font-weight:bold;
    line-height:1.5;
    margin-top:12px;
}
hr{
    border:none;
    background:#ccc;
    height:1px;
    margin:16px 0;
}
hr.dot{
  border-top:dotted 1px #ddd;
  background:none;
}
p,
li{
    line-height:1.6;
}
cite{
  font-style: normal;
}

.al_r{
  text-align: right;
}
.al_c{
  text-align:center;
}
.al_l{
  text-align:left;
}

.txt_s{
    font-size: 10px;
}

.d_none{
    display:none;
}

.btn_top{
    bottom: 20px;
    height: 300px;
    margin: 0 0 0 1000px;
    position: fixed;
    width: 30px;
}
.btn_top a{
    display:block;
    width:12px;
    border:dotted 1px #ccc;
    text-align:center;
    position:absolute;
    bottom:0;
    margin:0 0 0 2px;
    padding:4px;
    color:#999;
    text-decoration:none;
}
.btn_top a:hover{
    background:#fdfdfd;
}

.btn{
    display:block;
    margin:20px auto;
    width:200px;
    border:solid 1px #ccc;
    text-align:center;
    font-size:14px;
    font-weight:bold;
    text-decoration:none;
    color:#888;
    background: -webkit-linear-gradient(bottom, rgb(245, 245, 245) 0%, rgb(226, 226, 226) 100%);
    background: -o-linear-gradient(bottom, rgb(245, 245, 245) 0%, rgb(226, 226, 226) 100%);
    background: -ms-linear-gradient(bottom, rgb(245, 245, 245) 0%, rgb(226, 226, 226) 100%);
    background: -moz-linear-gradient(bottom, rgb(245, 245, 245) 0%, rgb(226, 226, 226) 100%);
    background: linear-gradient(to top, rgb(245, 245, 245) 0%, rgb(226, 226, 226) 100%);
    /background:#eee;
    background:#eee\9;
}
.btn:hover{
    background: -webkit-linear-gradient(bottom, rgb(255, 255, 255) 0%, rgb(237, 237, 237) 100%);
    background: -o-linear-gradient(bottom, rgb(255, 255, 255) 0%, rgb(237, 237, 237) 100%);
    background: -ms-linear-gradient(bottom, rgb(255, 255, 255) 0%, rgb(237, 237, 237) 100%);
    background: -moz-linear-gradient(bottom, rgb(255, 255, 255) 0%, rgb(237, 237, 237) 100%);
    background: linear-gradient(to top, rgb(255, 255, 255) 0%, rgb(237, 237, 237) 100%);
    /background:#f9f9f9;
    background:#f9f9f9\9;
}
.btn.txt_sp{
    letter-spacing:1.5em;
    text-indent:1.5em;
    /text-indent:0;
}
.index .btn.txt_sp{
    letter-spacing:0.5em;
    text-indent:0.5em;
    /text-indent:0;
}
.btn span{
    display:block;
    width:198px;
    border:solid 1px #fff;
    padding:6px 0;
}

.index,
.sample{
    width:1000px;
    margin:0 auto;
    text-align:left;
    position:relative;
}


.index p{
    padding:4px 0;
}
.index ul{
    padding:2px 0;
    list-style-type:circle;
    margin-left:2em;
}
.index ul li{
    padding:2px 0;
}
.index pre,
.index code{
    display:inline;
}
.index a.howto{
    background:#fef;
    text-decoration:none;
    margin-left:2px;
    padding:0 1px;
}
.index a.howto:hover{
    background:#fdf;
}

.index .list_jq{
    margin:0 auto;
    padding:0;
    width:990px;
    overflow: hidden;
}
.index .list_jq li{
    margin:0 10px;
    padding:6px 0 4px;
    width:475px;
    _width:470px;
    display:block;
    float:left;
    border-bottom:dotted 1px #dcdcdc;
}
.index .list_jq li a{
    display:block;
    text-decoration:none;
    color:#666;
    padding:1px 2px;
}
.index .list_jq li a:hover{
    background:#eee;
}

#wrap_list ul{
    list-style:none;
    padding:0;
    margin:0;
    /*border-bottom:solid 1px #dcdcdc;*/
}
.index dl,
#wrap_list li{
    position:relative;
    width:100%;
    border:solid 1px #dcdcdc;
    border-top:none;
    margin:4px 0 0;
}
#wrap_list li{
    margin:0;
    padding:0;
    border-bottom:none;
}
#wrap_list li.tit{
    border:none;
    margin:0 0 4px;
}
.index dt,
.index dd,
#wrap_list li h4,
#wrap_list li .inner{
    padding:1px;
    border-top:solid 1px #dcdcdc;
    position:relative;
}
#wrap_list li h4{
    line-height:1;
}
.index dd,
#wrap_list li .inner{
    padding:6px 11px;
}
.index dt a,
.index dt span,
#wrap_list li h4 a,
#wrap_list li h4 span{
    display:block;
    background:#efefef;
    padding:6px 10px;
    color:#555;
    text-decoration:none;
}
.index dt a span,
#wrap_list li h4 a span{
    display:inline;
    background:none;
    padding:0;
}
.index dt span.del em,
.index dt a span.del,
#wrap_list li h4 span.del em,
#wrap_list li h4 a span.del{
    text-decoration:line-through;
    color:#999;
}
.index dt a:hover,
#wrap_list li h4 a:hover{
    background:#eaeaea;
    text-decoration:underline;
}
.index dt a.supply,
.index dt span.date,
#wrap_list li h4 a.supply,
#wrap_list li h4 span.date{
    display:block;
    background:#fef;
    padding:6px 10px;
    color:#555;
    text-decoration:none;
    text-align:center;
    width:50px;
    position:absolute;
    top:1px;
    right:1px;
    /top:2px;
    _top:3px;
    /right:2px;
}
.index dt span.date,
#wrap_list li h4 span.date{
    width:128px;
    background:#edf;
}
.index dt a.supply:hover,
#wrap_list li h4 a.supply:hover{
    background:#fdf;
    text-decoration:underline;
}
.index dd  ul{
    padding:0;
    list-style-type:none;
    margin-left:0;
}
#wrap_list li .inner ul{
    border:none;
}
.index dd  ul li,
#wrap_list li .inner li{
    padding:0 0 0 8.5em;
    font-size:0.9em;
    text-indent:-8.5em;
    width:auto;
}
#wrap_list li .inner li{
    border:none;
    margin:0;
}
.index dd  ul li span,
#wrap_list li .inner li span{
    display:inline-block;
    padding:0 0 0 8.5em;
    _width:8.5px;
    color:#aaa;
}
#wrap_list li .inner li span.d_none{
    display:none;
}
#wrap_list .area_ctr{
    overflow:hidden;
    margin:4px 0;
    position:relative;
    width:auto;
}
#wrap_list .area_ctr div{
    display:inline-block;
    border:solid 1px #ddd;
    background:#fff;
    padding:2px;
    line-height:1;
    /text-align:center;
    /width:162px;
}
#wrap_list .area_ctr div.m{
    margin:0 8px;
    /border:none;
    /width:auto;
    /left:160px;
    position:relative;
    top:1px;
}
#wrap_list .area_ctr div.r{
    float:right;
    /float:none;
    /right:0;
    /width:82px;
}
#wrap_list .area_ctr div.m,
#wrap_list .area_ctr div.r{
    /position:absolute;
    /top:0;
}
#wrap_list .area_ctr button,
#wrap_list .area_ctr input{
    font-size:12px;
    font-family:"メイリオ", Meiryo, sans-serif;
}
#wrap_list .area_ctr button{
    display:inline-block;
    /display:block;
    border:solid 1px #ddd;
    padding:4px 14px;
    background:#efefef;
    line-height:1;
    cursor:pointer;
    color:#666;
    /width:160px;
}
#wrap_list .area_ctr .r button{
    /width:80px;
}
#wrap_list .area_ctr .sort.asc,
#wrap_list .area_ctr .sort.des{
    padding:4px 5px 4px 6px;
    _padding:4px 14px;
}
#wrap_list .area_ctr .sort.asc:after{
    content:" △";
}
#wrap_list .area_ctr .sort.des:after{
    content:" ▽";
}
#wrap_list .area_ctr input{
    width:300px;
    margin:0;
    /margin:-3px 0 0;
    padding:3px 2px 1px;
    /padding:6px 4px 5px;
    border:none;
}

.index .jump{
    background:#ffd;
    padding: 4px 10px 10px;
    margin:10px 0;
}
.index .jump ol{
    /word-break: keep-all;
}
.index .jump li{
    display:inline-block;
    /display:inline;
    padding:2px 4px;
    font-size:0.8em;
    white-space: nowrap;
    /white-space: normal;
}
.index .jump li a{
    display:block;
    /display:inline;
    background:#ffc;
    color:#888;
    text-decoration:none;
}
.index .jump li a:hover{
    background:#ff9;
}
#wrap_list li.to_index{
    border:none;
    border-top:solid 1px #dcdcdc;
}
.index a.to_index,
#wrap_list li.to_index a {
    margin:4px 0 20px;
    display:block;
    background:#e8efed;
    text-align:center;
    padding:6px 0;
    text-decoration:none;
    color:#888;
}
.index a.to_index:hover,
#wrap_list li.to_index a:hover{
    background:#e8f7f2;
    text-decoration:underline;
}

.sample p.ex{
    padding:10px 10px 0;
}
.sample p.howto{
    font-size:10px;
    text-align:right;
}

.sample ul.ex{
    list-style-type:decimal;
    margin:7px 10px 0;
    padding:0 0 0 20px;
}
.sample ul.ex.disc{
    list-style-type:disc;
}
.sample ul.ex.kome{
    list-style-type:none;
    padding:0 0 0 14px;
}
.sample ul.ex li{
    padding:3px 0;
}
.sample ul.ex.kome .disc{
    text-indent:1px;
}

.sample .syntaxhighlighter{
    padding:10px 0;
}

.sample p.board_smp,
.sample div.board_smp{
    border:dotted 1px #ccc;
    width:780px;
    margin:10px auto;
    padding:10px;
}
.sample p.board_smp a{
    text-decoration:underline;
    font-weight:bold;
}
.sample p.board_smp label{
    margin-right:10px;
}
.sample p.board_smp label input{
    vertical-align:middle;
    margin-right:4px;
}

.sample .board_smp .links li{
    display:block;
    width:80px;
    height:80px;
    float:left;
    background:#dfdfdf;
    margin:0 5px;
    text-align:center;
}
.sample .board_smp .tab,
.sample .board_smp .js_tab{
    width:600px;
}
.sample .board_smp .tab .nav li,
.sample .board_smp .js_tab .nav li{
    display:block;
    width:106px;
    margin:0 2px;
    _margin:0 1px;
    padding:5px;
    float:left;
    background:#dcdcdc;
    text-align:center;
}
.sample .board_smp .tab .nav li:hover{
    background:#fde;
}
.sample .board_smp .tab div,
.sample .board_smp .js_tab div{
    margin:2px;
    padding:5px;
    border:double 3px #ddd;
    _width:572px;
}
.sample .board_smp .js_tab .nav li{
    padding:0;
    width:auto;
}
.sample .board_smp .js_tab a,
.sample .board_smp .js_tab strong{
    display:block;
    width:106px;
    padding:5px;
    background:#dcdcdc;
    text-align:center;
}
.sample .board_smp .js_tab a:hover{
    background:#fde;
}
.sample .board_smp .js_tab strong{
    background:#ddf;
}

.sample .board_smp #slider1 {
  height: 1%;
  overflow: hidden;
  padding: 0;
}
.sample .board_smp #slider1 .buttons {
  background: url(i/buttons.png) no-repeat scroll 0 -38px transparent;
  display: block;
  float: left;
  height: 37px;
  margin: 40px 10px 0 0;
  overflow: hidden;
  position: relative;
  text-indent: -999em;
  width: 39px;
}
.sample .board_smp #slider1 .next {
  background-position: 0 0;
  margin: 40px 0 0 10px;
}
.sample .board_smp #slider1 .viewport {
  float: left;
  height: 125px;
  overflow: hidden;
  position: relative;
  width: 120px;
}
.sample .board_smp #slider1 .overview {
  list-style: none outside none;
  position: absolute;
  width: 120px;
}
.sample .board_smp #slider1 .overview li {
  border: 1px solid #dcdcdc;
  float: left;
  height: 107px;
  margin: 0 20px 0 0;
  padding: 1px;
  width: 107px;
}
.sample .board_smp #slider1 .disable {
  visibility: hidden;
}

.sample .tooltip_cnt{
    width:400px;
    padding:10px;
    background:#ededed;
    border:solid 1px #ccc;
}

.sample .board_smp #example1_wrap {
  position: relative;
}
.sample .board_smp #example1_wrap .bx_wrap {
  margin-left: 45px;
}
.sample .board_smp #example1_wrap .next {
  left: 513px;
  outline: 0 none;
  position: absolute;
  top: 40px;
}
.sample .board_smp #example1_wrap .prev {
  left: 0;
  outline: 0 none;
  position: absolute;
  top: 40px;
}
.sample .board_smp li span{
    display:inline-block;
    width:87px;
    height:87px;
    overflow:hidden;
    background:#ccc;
    padding:8px 10px;
    text-align:center;
    vertical-align:middle;
}
.sample .board_smp.area_png{
    background:url(i/cat.jpg) center center no-repeat;
    height:100px;
    text-align:center;
}
.sample .board_smp.area_png img{
    behavior: url(http://snstest.pmang.jp/internal/coding/pmang_common/j/iepngfix.htc);
}
.sample .board_smp.area_png div{
    background:url(i/p.png) center center;
    height:100px;
    behavior: url(http://snstest.pmang.jp/internal/coding/pmang_common/j/iepngfix.htc);
}

.sample .sp + div .syntaxhighlighter .line {
    white-space:pre-wrap !important;
    word-wrap: break-word !important;
}
.syntaxhighlighter div.container{/min-height: 3em !important;}

.del{
    text-decoration:line-through;
}

.t_none{
    text-indent:-999999px;
}


/* for modal window*/
.mw{
    color:#f60;
    text-decoration:underline;
    cursor:pointer;
    /color:#333;
    /text-decoration:none;
    /cursor:default;
}
.mw:hover{
    color:#fa0;
    /color:#333;
}
.mb {
    display:none;
    position:absolute;
    z-index:1000;
    width:600px;
    background:#fff;
    padding:30px 0 0;
    border:5px solid #eee;
}
.mb .inner{
    overflow:auto;
    height:350px;
    padding:0 20px 30px;
}
.overlay {
    opacity:0;
    filter: alpha(opacity=0);
    position:absolute;
    top:-10px;
    left:0;
    z-index:900;
    width:100%;
    height:100%;
    background:#000;
    /*cursor:pointer;*/
}
.mw_close {
    line-height:1;
    font-size:14px;
    position: absolute;
    top:10px;
    right:10px;
    color:red;
    text-decoration:none;
    cursor:pointer;
}​
