﻿

/*** for PC Browser ***/
@media (min-width:401px)
{
.csvinside
{
  margin-left:auto;
  margin-right:auto;
  width:600px;
}

.csvFormList dt
{
  display:inline-block;
  width:30%;
  color:#000000;
}

.csvFormList dd
{
  display:inline-block;
  width:60%;
  margin:0px;
  vertical-align:top;
}

.mapsimg
{
  vertical-align:top;
}

.csvFormList fieldset
{
  border:none;
  padding:0px;
}

label.hiddenLabel, .csvFormList legend
{
  display:inline-block;
  text-indent: -9999px;
  line-height:0px;
}

#AgeFromTextBox, #AgeToTextBox
{
  width:50px;
}

.csvFormList input
{
  margin:2px;
}

.csvFormList .radioButton label
{
  margin:0px 10px 0px 0px;
}

.csvTable
{
  padding: 5px !important;
  border:solid 1px black;
}

.csvTable th
{
  text-align:center;
}

.csvTable td
{
  text-align:right;
}

.csvTable td, .csvTable th
{
    height: 100%;
    vertical-align: top; /*middle;*/
    padding: 5px !important;
    border-right:solid 1px black;
}

.csvTable th, .csvTable td.first
{
   border-right:double 3px black;
}

.csvTable tr.sep td, .csvTable tr.sep th, .csvTable tr.first
{
   border-top:double 3px black;
}

.csvTable .kubun th
{
   border-right:solid 1px black;
  vertical-align:middle;
}

.csvTable .kubun th.first
{
   border-left:double 3px black;
   border-right:double 3px black;
}

.csvTable  .kubun
{
  background-color:#ddddff;
}

.csvTable  .setai
{
  background-color:#eeeeee;
}

.csvTable tr.setai.first
{
   border-bottom:dashed 1px black;
}

.csvTable  .setai2
{
  background-color:#eeeeee;
}

.csvTable .sousuu
{
  background-color:#ffffcc;
}

.csvTable .sousuu.gender td, .csvTable tr.setai2
{
   border-top:dashed 1px black;
}

.csvTable .ages
{
  background-color:#eeeeee;
}

.csvTable .ages.gender td, .csvTable .ages.sep td
{
   border-top:dashed 1px black;
}

.csvTable .ages.sep th, .csvTable .ages.sep td
{
   border-top:solid 1px black;
}

.csvTable .agerange
{
  background-color:#ffe5e5;
}

.csvTable .agerange.gender td
{
   border-top:dashed 1px black;
}

.csvTable .age
{
  background-color:#ffffff;
}

.csvTable .age.gender td, .csvTable .age.sep td, .csvTable .ageodd.gender td, .csvTable .ageodd.sep td
{
   border-top:dashed 1px black;
}

.csvTable .age.sep th, .csvTable .age.sep td, .csvTable .ageodd.sep th, .csvTable .ageodd.sep td{
   border-top:solid 1px black;
}

.csvTable .ageodd
{
  background-color:#f1f3f1;
}

.csvTable tr th:first-child
{
    white-space: nowrap;
}
}


/*** for Smart Phone ***/
@media (max-width:400px)
{
.csvinside
{
  margin-left:auto;
  margin-right:auto;
}

.csvFormList dt
{
  color:#000000;
}

.csvFormList fieldset
{
  border:none;
  padding:0px;
}

label.hiddenLabel, .csvFormList legend
{
  display:inline-block;
  text-indent: -9999px;
  line-height:0px;
}

#AgeFromTextBox, #AgeToTextBox
{
  width:50px;
}

.csvFormList input
{
  margin:2px;
}

.csvFormList .radioButton label
{
  margin:0px 10px 0px 0px;
}

.csvTable
{
  padding: 5px !important;
  border:solid 1px black;
}

.csvTable th
{
  text-align:center;
}

.csvTable td
{
  text-align:right;
}

.csvTable td, .csvTable th
{
    height: 100%;
    vertical-align: top; /*middle;*/
    padding: 5px !important;
    border-right:solid 1px black;
}

.csvTable th, .csvTable td.first
{
   border-right:double 3px black;
}

.csvTable tr.sep td, .csvTable tr.sep th, .csvTable tr.first
{
   border-top:double 3px black;
}

.csvTable .kubun th
{
   border-right:solid 1px black;
  vertical-align:middle;
}

.csvTable .kubun th.first
{
   border-left:double 3px black;
   border-right:double 3px black;
}

.csvTable  .kubun
{
  background-color:#ddddff;
}

.csvTable  .setai
{
  background-color:#eeeeee;
}

.csvTable tr.setai.first
{
   border-bottom:dashed 1px black;
}

.csvTable  .setai2
{
  background-color:#eeeeee;
}

.csvTable .sousuu
{
  background-color:#ffffcc;
}

.csvTable .sousuu.gender td, .csvTable tr.setai2
{
   border-top:dashed 1px black;
}

.csvTable .ages
{
  background-color:#eeeeee;
}

.csvTable .ages.gender td, .csvTable .ages.sep td
{
   border-top:dashed 1px black;
}

.csvTable .ages.sep th, .csvTable .ages.sep td
{
   border-top:solid 1px black;
}

.csvTable .agerange
{
  background-color:#ffe5e5;
}

.csvTable .agerange.gender td
{
   border-top:dashed 1px black;
}

.csvTable .age
{
  background-color:#ffffff;
}

.csvTable .age.gender td, .csvTable .age.sep td, .csvTable .ageodd.gender td, .csvTable .ageodd.sep td
{
   border-top:dashed 1px black;
}

.csvTable .age.sep th, .csvTable .age.sep td, .csvTable .ageodd.sep th, .csvTable .ageodd.sep td{
   border-top:solid 1px black;
}

.csvTable .ageodd
{
  background-color:#f1f3f1;
}

.csvTable
{
    width: 100%;
    box-sizing: border-box;
    overflow-x: scroll;
}

.csvTable .kubun th
{
    position: sticky;
    top: 0;
}

.csvTable tr th:first-child
{
    white-space: nowrap;
    position: sticky;
    left: 0;
    z-index: 2;
/*    background: #DDDDFF;*/
}

.mapsimg
{
  display:none;
}
}
