@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Alata&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed&display=swap');
/* CSS Document */
#content h2 {
  font-size: 2.5rem;
  font-weight: normal;
  color:#515151;
  background: #cedde5;
  border-radius: 1em;
  padding: 8px 20px 5px;
  text-align: center;
  line-height: 150%;
}
#content h3 {
  font-size: 2.4rem;
  font-weight: normal;
  color:#515151;
  letter-spacing: .1rem;
  text-align: left;
  position: relative;
  margin-bottom: 2rem;
  line-height: 150%;
  padding: 0 0 0 20px;
}
#content h3:before {
  position: absolute;
  left: 0;
  bottom: 0;
  content: '';
  width: 5px;
  height: 60%;
  background-color: #00a3f4;
}
#content h3:after {
  position: absolute;
  left: 0;
  top: 0;
  content: '';
  width: 5px;
  height: 40%;
  background-color: #444;
}
.float-text p {
  margin-bottom: 15px;
  line-height: 1.6em;
}
.float-text figure {
  float: right;
  margin: 0 0 15px 15px;
  width: 30%;
}
.float-text figure img {
  margin-bottom: 10px;
  max-width: 100%;
  }
.float-text figcaption {
  text-align: center;
}
/*alos*/
/*alos2*/
.alos2 #content h2, .alos4 #content h2 {
  background: #d7e6b7;
}
.alos2 #content h3:before, .alos4 #content h3:before {
  background-color: #8ec31f;
}
.youtube iframe{
  width: 100%;
  height: 400px;
}
.alos2 .datause-table img{
  max-width: 250px;
}
/*alos3*/
.alos3 #content h3:before {
  background-color: #fc7e2a;
}
.alos3 #content h2 {
  background: #EFE3D8;
}
.mission-box{
  padding:15px;
  background-color: #fff;
  box-shadow: 0 0 5px rgba(200, 200, 200, 0.2);
}
.mission-box .no{
  display: inline-block;
  min-width: 40px;
  font-size: 20px;
  color: #fff;
  text-align: center;
  margin-right: 8px;
  padding: 5px 8px 2px;
  background-color: #cc6600;
}
.mission-box .title{
  text-align: left;
  font-size: 1.6rem;
  font-weight: 600;
  color: #e45d00;
  margin: 5px 0 10px;
}
.mission-box img{
  width: 100%;
  margin-top:10px;
}
.mission-box p{
  text-align: left;
}
.mission-box .mi-caption{
  font-size: 1.3rem;
  margin-top: 5px;
}
.movie-box{
  width: 100%;
  max-width: 800px;
  margin:0 auto;
}
/*alos4*/
.bt-cvst{
  display: inline-block;
  margin: 0 auto;
}
.bt-cvst a{
  display: block;
  position: relative;
  color:#fff;
  padding:20px 35px 20px 20px;
  border-radius: 10px;
}
.alos4 .bt-cvst a{
  background:#8ec31f;
}
.alos3 .bt-cvst a{
  background:#fc7e2a;
}
.bt-cvst a::before{
  position: absolute;
  display: block;
  font-family: "Font Awesome 5 Free";
  content: "\f111";
  top:50%;
  right: 10px;
  margin-top:-12px;
  font-size: 16px;
}
.bt-cvst a::after{
  position: absolute;
  display: block;
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  top:50%;
  right: 14px;
  margin-top:-11px;
  font-weight: 900;
}
/*image*/
.photo{
  display: block;
  margin: 0 auto 20px;
}
.photo1{
  display: inline-block;
  padding:10px;
  background:#fff;
  margin: 0 auto 20px;
}
.photo img, .photo1 img{
  width: 100%;
  vertical-align: bottom;
}
.photo-l{
  display: block;
  float: left;
  width: 48%;
  margin:0 4% 30px 0;
}
.photo-r{
  display: block;
  float: left;
  width: 48%;
  margin:0 0 30px;
}
.photo-l img, .photo-r img, .photo-3col img{
  width: 100%;
  vertical-align: bottom;
}
.photo p, .photo-l p, .photo-r p{
  width: 100%;
  font-size: 14px;
  text-align: center;
  margin:0;
  padding:5px 0;
}
.photo-caption{
  width: 100%;
  text-align: center;
  margin:5px auto;
  padding:0;
  font-weight: 600;
}
.photo-caption p{
  font-weight: normal;
  margin:0!important;
  padding:0!important;
}
.photo-text1{
  text-align: center;
  margin:5px auto 20px;
}
.photo-3col{
  display: block;
}
.photo-3col ul{
  padding-left: 0;
}
.photo-3col li{
  display: block;
  float: left;
  width:31%;
  margin-right:2%;
  margin-bottom:30px;
}
.photo-r iframe{
  width:100%;
  height: 315px;
}
table caption{
  font-weight: 600;
  font-size: 1.6rem;
}
/**
.lb {
    display: flex;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    justify-content: center;
    align-items: center;
    background: rgba(0,0,0,.7);
    opacity: 0;
    transition: .3s opacity ease;
    pointer-events: none;
    z-index: 100;
}
.lb img {
    width: auto !important;
    max-height: 100%!important;
    cursor: pointer;
}
.lb img, .lb iframe {
    transform: scale(.85);
    transition: .3s all ease;
}
.lb:target {
    opacity: 1;
    pointer-events: auto;
    z-index: 101;
}
.lb:target img, .lb:target iframe {
    transform: scale(1.2);
}
.lb::before,.lb::after {
    display: block;
    position: fixed;
    content: "";
    width: 24px;
    height:3px;
    top: 24px;
    right: 12px;
    background: #fff;
    border-radius: 4px;
}
.lb::before {
    transform: rotate(-315deg);
}
.lb::after {
    transform: rotate(315deg);
}
**/
.font-small{
  font-size: 13px;
}
.caution{
  display: block;
  position: relative;
  margin:5px 0;
  padding-left: 20px;
  text-align: left;
  font-size: 14px;
}
.caution:before{
  display: block;
  position: absolute;
  content: "※";
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
}
.new {
  display: block;
  position: relative;
  padding-left: 60px;
}
.new:before {
  display: block;
  position: absolute;
  content: "NEW";
  top:0;
  left: 0;
  width: 50px;
  height: 18px;
  color:#fff;
  font-size: 13px;
  text-align: center;
  line-height: 160%;
  padding:0;
  border-radius: 5px;
  background:#c21;
}
.section sup {
  color:#00a3f4;
}
.revision{
  text-decoration: line-through;
}
.bt-more{
  display:block;
  position: relative;
  margin:20px 0 0;
}
.bt-more a{
  padding:8px 20px 8px 40px;
  background: transparent;
  color: #000;
  border:2px solid #666;
}
.bt-more a:hover{
  color:#fff;
  background: #666;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.bt-more:before{
  display:block;
  position:absolute;
  content:"";
  top:50%;
  margin-top:-5px;
  left:10px;
  width:10px;
  height:10px;
  border-top:2px solid #00a3f4;
  border-right:2px solid #00a3f4;
  transform: rotate(45deg);
}
.bt-access{
  display:block;
  position: relative;
  text-align: left;
  font-weight: bold;
  margin-bottom: 5px;
  margin:0 0 8px 0;
}
.bt-access a{
  color:#515151;
  text-decoration: underline;
  line-height: 180%;
  padding:0 0 0 20px;
}
.bt-access:before {
  position: absolute;
  top:0;
  left: 0;
  font-family: "Font Awesome 5 Free";
  content: '\f3c5';
  font-size: 1.8rem;
  color: #777;
  line-height: 140%;
}
.bt-access a:hover{
  color: #888;
}
.download{
  position: relative;
  text-align: left;
  font-weight: normal;
  margin-bottom: 5px;
  padding:0 0 0 1.5rem;
}
.download:before {
  position: absolute;
  top:0;
  left: 0;
  font-family: "Font Awesome 5 Free";
  content: '\f15c';
  color: #777;
  line-height: 140%;
}
.download a, .pdf a{
  color: #222;
  text-decoration: underline;
}
table td .download{
  margin:0;
}
.pdf:before{
  color: #aa0011;
}
.bt-pdf{
  display:inline-block;
  position: relative;
  margin:0 0 5px 10px;
}
.bt-pdf a{
  display:block;
  text-align: left;
  padding:2px 20px 2px 40px;
  color: #fff;
  background: #aa0011;
  border-radius: 16px;
}
.bt-pdf a:hover{
  background: #aa1122;
}
.bt-pdf i{
  display: block;
  position: absolute;
  top:50%;
  left: 14px;
  margin-top:-12px;
}
.bt-photo{
  display:inline-block;
  position: relative;
  margin:0 0 5px 0;
}
.bt-photo a{
  display:block;
  text-align: left;
  padding:.2rem 0 .2rem 2rem;
}
.bt-photo a:before {
  position: absolute;
  top:1px;
  left: 0;
  font-family: "Font Awesome 5 Free";
  content: '\f15c';
  font-size: 18px;
  color: #777;
  line-height: 140%;
}
.bt-photo i{
  display: block;
  position: absolute;
  top:50%;
  left: 14px;
  margin-top:-12px;
}
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;
  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
  /* Support for IE. */
  font-feature-settings: 'liga';
}
.link-page{
  display: block;
  position:relative;
  width: 100%;
  margin-bottom: 5px;
  padding-left: 1.4rem;
}
.link-page:before{
  display: block;
  position:absolute;
  content:"";
  left: 0;
  top:5px;
  border:6px solid transparent;
  border-left:6px solid #005CB5;
}
.subtitle, .list-dice{
  display: block;
  position:relative;
  width: 100%;
  margin-bottom: 5px;
  padding-left: 1.5rem;
}
.subtitle:before, .list-dice:before{
  display: block;
  position:absolute;
  content:"";
  left: 0;
  top:0.8rem;
  width:5px;
  height: 5px;
  background:#005CB5;
}
.alos4 .subtitle:before, .alos4 .list-dice:before{
  background:#8ec31f;
}
.alos3 .subtitle:before, .alos3 .list-dice:before{
  background:#fc7e2a;
}
.marker {
  background: linear-gradient(transparent 10%, #fafbac 0%);
}
/* header */
.ttl_head_area {
  width: 100%;
  height: 150px;
  background: #2F3232 url("../images/local/header01.png") center no-repeat;
  background-size:cover;
  overflow:hidden;
}
.ttl_head {
  width: 1200px;
  margin: 0 auto;
}
.ttl_head h1 {
  color: #FFF;
  font-size: 2.5rem;
  font-weight: normal;
  letter-spacing: 1px;
  margin:0;
  padding:50px 0 0;
}

/* breadcrumbs */
ul.breadcrumbs {
  margin: 1rem 0 3rem;
  padding:0;
}
ul.breadcrumbs li {
  position: relative;
  display:inline-block;
  font-size: 1.2rem;
  margin-right: 0.6rem;
  padding-left: 1.4rem;
}
ul.breadcrumbs li:first-child{
  padding-left: 1.8rem;
}
ul.breadcrumbs li:first-child:before {
  position: absolute;
  top: .1rem;
  left: 0;
  font-family: "Font Awesome 5 Free";
  content: '\f015';
    font-weight: 900;
  color: #999;
  line-height: 110%;
  border:none;
}
ul.breadcrumbs li::before {
  content: "";
  position: absolute;
  top: .3rem;
  left: 0.5rem;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 5px solid #bbb;
}
.section {
  width: 1000px;
  margin:2rem auto 3rem;
}
.list ul{
  list-style-type: disc;
  margin:1rem 0;
  padding-left: 20px;
}
.list li{
  padding-bottom: 8px;
}
.list2 ul{
  list-style-type: disc;
  margin:1rem 0;
  padding-left: 4.5em;
}
.list2 p{
  padding-bottom: 8px;
}
.list-no ul{
  list-style-type: decimal;
  padding-left: 40px;
}
.list-no li{
  padding-bottom: 8px;
}
.list-none{
  list-style: none!important;
  margin:0;
  padding-left: 0!important;
}
.list-none li{
  margin-bottom: 8px;
}
.read {
  margin:0 auto;
  text-align: left;
  line-height: 180%;
  padding-bottom: 2rem;
}
.read p, .left-box p{
  margin-bottom: 1rem;
}
.left-box{
  display: block;
  float: left;
  width: 48%;
  margin:0 4% 0 0;
  line-height: 180%;
}
.right-box{
  display: block;
  float: right;
  width: 48%;
  margin:0 0 0 0;
  line-height: 180%;
}
.w70{
  width:70%!important;
}
.w30{
  width: 26%!important;
}
.read2{
  display: block;
  float: left;
  width: 70%;
  line-height: 180%;
}
.read2-image{
  display: block;
  float: left;
  width: 24%;
  margin:0 3%;
}
.read2-image img, .right-box img, .left-box img{
  width:100%;
}
.read3{
  margin:0 auto;
  text-align: left;
  line-height: 180%;
  padding-bottom: 8px;
}
.text{
  margin:0 auto;
  text-align: left;
  padding-bottom: 2rem;
}
.arrow-change{
  position: relative;
}
.arrow-change::before{
  position: absolute;
  font-family: "Font Awesome 5 Free";
  content: "\f054";
  top: 50%;
  right: -3rem;
  margin-top:-2rem;
  color:#fc7e2a;
  font-size: 4rem;
  font-weight: 600;
}
/*alos*/
table .cgray{
  font-weight: bold!important;
  background-color: #ccc!important;
}
table .cssar{
  color:#fff!important;
  background-color: #996633!important;
}
table .chh{
  background-color: #ffff00!important;
}
table .cpol{
  background-color: #ff6600!important;
}
table .chhhv{
  color:#fff!important;
  background-color: #3333ff!important;
}
table .cpol_2{
  background-color: #ffcc33!important;
}
table .cav2{
  color:#fff!important;
  background-color: #ff0000!important;
}
table .cpr_p{
  background-color: #00ff00!important;
}
table .cpr_m{
  background-color: #ffff00!important;
}
.data-sample img{
  max-width: 250px;
}
.data-tool-map table{
  font-family:"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  border: none;
  border-collapse: collapse;
}
.data-tool-map td {
  vertical-align: middle;
  color: black;
  background-color: #fff;
  border: none;
  padding: 0;
}
.data-tool-map img{
  width: 100%;
}
.data-tool-map img:hover{
  opacity: 0.8;
}
/*alos2*/
.a2-about table {
  font-family:"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  border: 1px solid #aaa;
  border-collapse: collapse;
}
.a2-about table caption {
  font-size: 14pt;
  line-height: 2.2;
}
.a2-about table th {
  vertical-align: middle;
  color: #000;
  background-color: #d7e6b7;
  border: 1px solid #aaa;
  padding: 4px 10px;
}
.a2-about table td {
  vertical-align: middle;
  color: black;
  background-color: #fff;
  border: 1px solid gray;
  padding: 4px 10px;
}
#auig-list iframe{
  width: 100%!important;
  height: 400px;
  border:none;
}
.obs_body, .top_ebody{
  background-color: #efefef;
}
#obsplan {
width: 1440px;
height: auto;
margin: 16px;
}
.obs_body h3{
  font-size: 1.8rem;
  text-align: center;
  font-weight: 600;
  padding:0 0 5px;
  border-bottom: 1px double #aaa;
}
.obs_body h3:before,.obs_body h3:after{
  display: none;
}
.obs_body .blue{
  color:#0130aa;
}
#obs_mapping {
width: 100%;
height: auto;
margin: 0 auto;
background-color: transparent; 
background-image: none;
font-style:normal; 
border-collapse: collapse; 
border: 0;
}
table#obs_mapping td {
text-align: center; 
font-weight: bold; 
border: 0;
margin-top: 0;
padding: 10px;
vertical-align: top;
}
table#obs_mapping img {
  width: 100%;
}
.kml_dl {
  list-style: none;
  text-align: left;
  margin:0 0 0 1rem;
  padding:0;
}
.kml_dl li{
  position: relative;
  text-align: left;
  font-weight: normal;
  margin-bottom: 5px;
  padding:0 0 0 1.5rem;
}
.kml_dl li a{
  color:#0130aa;
}
.kml_dl li:before {
  position: absolute;
  top:0;
  left: 0;
  font-family: "Font Awesome 5 Free";
  content: '\f15c';
  color: #777;
  line-height: 140%;
}
#smode {
width: auto;
font-size:small; 
border-collapse: collapse; 
border: solid 2px #333333;
caption-side: top;
}
table#smode caption {
text-align: left; 
font-size: medium;
font-weight: bold; 
}
#smode th {
background-color: #000000; 
color: #ffffff;
font-weight: bold;
border-right: solid 1px #ffffff;
text-align: center;
padding:8px;
}
#smode td{
  padding:8px;
  border-right: solid 1px #333333;
}
table .u2r {
background-color: #00ff66!important; 
}
table .u2l {
background-color: #999999!important; 
}
table .u3r {
background-color: #ff3300!important; 
}
table .u3l {
background-color: #ff9999!important; 
}
table .fpr {
background-color: #ff9933!important; 
}
table .f2 {
background-color: #0066cc!important; 
color: #ffffff;
}
table .wr {
background-color: #cc9900!important; 
}
table .wr2 {
background-color: #ffa500!important; 
}
table .wl {
background-color: #99ccff!important; 
}
table .wbs {
background-color: #cc6600!important; 
}
#footer_obs {
text-align:center;
vertical-align: bottom;
padding:20px 20px 4px;
margin-top:16px;
border-top:1px solid #333;
color:#666;
font-size:0.8em;
}
#footer_obs a{
  text-decoration: none;
  color:#666;
}
#footer_obs a:hover{
  color: #0130aa;
}
.footer_obs_text{
  display: inline-block;
}
.footer_obs_text p{
  margin:0 0 5px 0;
}
.footer_obs_logo{
  display: inline-block;
  height: 40px;
  padding-left: 20px;
}
.footer_obs_logo img{
  height: 40px;
}
div#obs_mapl { 
width: 1280px;
margin: 32px auto; 
padding: 0 auto; 
}
div#obs_mapl img {
  width: 100%;
}
div#obs_mapl p { 
margin-left: 100px;
text-align: left; 
font-size: medium;
}
#obs_mapl h5 { 
width: 100%;
margin: 16px auto; 
text-align: center; 
font-weight: bold; 
font-size: 1.8rem;
}
#obs_mapl ul.kml_dl {
width: 1000px; 
margin-top: 0;
margin-right: 16px; 
text-align: right; 
list-style-type: none;
font-size: medium; 
font-style: normal; 
font-weight: bold; 
}
.obs-data-list ul{
  list-style:none;
  display:flex;
  flex-flow:row wrap;
  justify-content:space-between;
  margin:0;
  padding:0;
}
.obs-data-list li{
  flex:0 0 24%;
  margin-bottom:30px;
    padding:10px;
    border:1px solid #001464;
    background:#fff;
}
.obs-data-list li:empty{
    background:transparent;
    border: none!important;
    box-shadow:none!important;
}
.obs{
  margin:20px auto 30px;
}
.obs table {
  width: 100%;
  border: 1px solid #aaa;
  border-collapse: collapse;
}
.obs table td img, .obs-data-list img{
  width: 100%;
}
.obs td {
  width:25%;
  color: black;
  text-align: left;
  background-color: #fff;
  border: 1px solid #aaa;
  padding: 8px 10px;
}
.obs td p, .obs-data-list p{
  margin:5px 0;
}
.obs .bt-photo, .obs-data-list .bt-photo{
  margin:0;
}
/*alos3-data*/ 
/* page - top 
.top {
  padding: 0 2em;
  }
  ul.top_list {
  font-size: 1.2em;
  padding: 0 40px 20px;
  }
  ul.top_list li {
  margin-bottom: .7em;
  padding-bottom: .7em;
  border-bottom: 1px dotted #DDD;
  }
  ul.top_list li a {
  padding-left: 10px;
  }
  ul.top_list li a::before {
  padding: 0 3px 0 0;
  content: "\ea42";
  font-family: "icomoon";
  vertical-align: middle;
  }
 */ 
/**content**/
/*sensor*/
#a3-sensor .read2{
  display: block;
  float: left;
  width: 50%;
}
#a3-sensor .read2 ul{
  margin-bottom:2rem;
}
#a3-sensor .read2-image{
  display: block;
  float: left;
  width: 47%;
  margin:0 0 0 3%;
}
#a3-sensor .read2-image img {
  width: 100%;
}
.imagedata-box ul{
  list-style:none;
  display:flex;
  flex-flow:row wrap;
  justify-content:space-between;
  margin:0;
  padding:0;
}
.imagedata-box li{
  flex:0 0 32%;
  margin-bottom:20px;
}
.imagedata-box li:empty, #top-dataset li:empty{
    background:transparent;
    box-shadow:none!important;
}
.imagedata-box li img{
  width: 100%;
}
.imagedata-box .title-image, .imagedata-box .title-download{
  display: inline-block;
  width: 40%;
  padding:5px 0;
  border-bottom: 1px solid #c9cacc;
}
.imagedata-box .title-tiff{
  display: inline-block!important;
  width: 60%;
  padding:5px 0;
  border-bottom: 1px solid #c9cacc;
}
.imagedata-box .title-zip{
  display: inline-block!important;
  position: relative;
  width: 60%;
  padding:5px 0 5px 20px;
  border-bottom: 1px solid #c9cacc;
}
.imagedata-box .title-zip::before {
  display: block;
  position: absolute;
  font-family: "Font Awesome 5 Free";
  color:#777;
  content: "\f15c";
  left: 0;
}
/* announce_box */
 .announce_box{
  width: 1000px;
  margin: 0 auto;
  padding: 20px;
  text-align: left;
  background: #FFF;
}
.announce_box p.ttl {
font-size: 1.1rem;
font-weight: 600;
letter-spacing: .1rem;
text-align: left;
position: relative;
padding-bottom: .2rem;
width: 100%;
margin: 2rem 0 1rem;
}
.announce_box p.ttl:after {
content: "";
display: block;
position: absolute;
bottom: 0;
left: 0;
width: 50%;
height: 2px;
border-bottom: 1px solid #999;
}
.announce_box p.sub_ttl {
font-size: 1.1rem;
font-weight: 600;
letter-spacing: .1rem;
text-align: left;
margin: 1.5rem 0 .5rem;
}
/*table*/
.table-auto table{
  width: auto!important;
}
table p{
  margin: 0 0 5px;
}
.multiple{
  display: block;
  width: 100%;
  margin:20px auto 30px;
}
.multiple table {
  display:table;
  width: 100%;
  border: 1px solid #aaa;
  border-collapse: collapse;
  white-space: normal;
}
.multiple th {
  display:table-cell;
  width: auto;
  text-align: left;
  vertical-align: top;
  color: #000;
  background-color: #dddddb;
  border: 1px solid #aaa;
  padding: 8px;
}
.multiple td {
  display:table-cell;
  width: auto;
  text-align: left;
  color: #000;
  background-color: #fff;
  border: 1px solid #aaa;
  padding: 8px;
  vertical-align: top;
}
.multiple h5{
  text-align: center!important;
  border:none;
}
.column2{
  margin:20px auto 30px;
}
.column2 table {
  width: 100%;
  border: 1px solid #bdc3c4;
  border-collapse: collapse;
}
.column2 th {
  vertical-align: top;
  color: #000;
  text-align: left;
  background-color: #dddddb;
  border-right: 1px solid #bdc3c4;
  border-bottom: 1px solid #bdc3c4;
  padding: 8px 10px;
}
.column2 td {
  color: black;
  background-color: #fff;
  border-right: 1px solid #bdc3c4;
  border-bottom: 1px solid #bdc3c4;
  padding: 8px 10px;
  vertical-align: top;
}
table .column2 td:last-child, table .column2 th:last-child{
  border:none;
}
.column2 h5{
  text-align: center;
  border:none;
}
.multiple .co1, .column2 .co1{
  background:#ececeb;
}
.multiple .co2, .column2 .co2{
  background:#faf9f8;
}
.pdf-list  ul{
  width: auto;
  padding-left: 0;
}
.pdf-list li{
  display: block;
  position: relative;
  padding:0 0 10px 70px;
}
.pdf-list li:before{
  display: block;
  position: absolute;
  content: "PDF";
  top:0;
  left: 0;
  width: 50px;
  font-size: 12px;
  text-align: center;
  color:#fff;
  padding:2px;
  background:#a00;
  border-radius: 6px;
}
/*LIBRARY*/
.library-image-list, .library-image-list4, .library-image-list2{
  margin:0 auto;
}
.library-image-list ul, .library-image-list4 ul, .library-image-list2 ul{
  list-style:none;
  display:flex;
  flex-flow:row wrap;
  justify-content:space-between;
  margin:0;
  padding:0;
}
.library-image-list li{
  flex:0 0 32%;
  margin-bottom:2rem;
  text-align: center;
}
.library-image-list4 li{
  flex:0 0 24%;
  margin-bottom:2rem;
  text-align: center;
}
.library-image-list2 li{
  flex:0 0 48%;
  margin-bottom:2rem;
  text-align: center;
}
.library-image-list li:empty, .library-image-list4 li:empty, .library-image-list2 li:empty{
    background:transparent;
    box-shadow:none!important;
}
.library-image-list img, .library-image-list4 img, .library-image-list2 img{
  width: 100%;
}
.library-image-list .same-height li{
  background:#fff;
}
.library-image-list .same-height img{
  width: auto;
  height: 280px;
  background:#fff;
}
.library-image-list p{
  text-align: center;
}
.library .youtube iframe{
    width: 100%;
    height: 300px;
}
.library-images2, .library-images3{
  position: relative;
}
.library-images2 img, .library-images3 img{
  width: 100%;
}
.library-images2-bt1{
  position: absolute;
  display: block;
  width: 50%;
  height: 100%;
  top:0;
  left: 0;
}
.library-images2-bt2{
  position: absolute;
  display: block;
  width: 50%;
  height: 100%;
  top:0;
  left: 50%;
}
.library-images3-bt1{
  position: absolute;
  display: block;
  width: 33.33%;
  height: 100%;
  top:0;
  left: 0;
}
.library-images3-bt2{
  position: absolute;
  display: block;
  width: 33.33%;
  height: 100%;
  top:0;
  left: 33.33%;
}
.library-images3-bt3{
  position: absolute;
  display: block;
  width: 33.33%;
  height: 100%;
  top:0;
  left: 66.66%;
}
.library-images2-bt1:hover, .library-images2-bt2:hover, .library-images3-bt1:hover, .library-images3-bt2:hover, .library-images3-bt3:hover{
  background:rgba(220,240,255,0.2);
}
.cocoen-caption{
  width: 100%;
  margin: 0;
  padding:0;
}
.cocoen-caption .cocoen-left{
  float: left;
  width: 49%;
}
.cocoen-caption .cocoen-right{
  float: right;
  width: 49%;
  text-align: right;
}
.sub-text{
  display: inline-block;
  width: 49.5%;
  margin:0;
  padding: 0;
}
.zoom-img{
  position: relative;
  display: inline-block;
  margin: 0 .5rem;
  padding-left: 2.2rem;
  font-weight: normal;
}
.zoom-img::before{
  position: absolute;
  font-family: "Font Awesome 5 Free";
  content: "\f00e";
  top: -.2rem;
  left: .3rem;
  color:#51595f;
  font-size: 1.6rem;
  font-weight: 600;
}
.copy-mark{
  position: relative;
  font-weight: 600;
  padding-left: 2rem;
}
.copy-mark:before{
  position: absolute;
  font-family: "Font Awesome 5 Free";
  content: "\f1f9";
  font-weight: normal;
  top:0;
  left: 0;
}
.inline-list{
  display: inline-block;
  margin: 0 2rem 0 0;
  padding:0;
}
/*disaster*/
.disaster-list {
  width: 100%;
  margin:20px auto 30px;
}
.disaster-list table {
  display:table;
  width: 100%;
  border-collapse: collapse;
}
.disaster-list th {
  display:table-cell;
  width: auto;
  text-align: left;
  vertical-align: top;
  color: #000;
  padding:16px;
}
.disaster-list td {
  display:table-cell;
  width: auto;
  text-align: left;
  vertical-align: top;
  color: black;
  padding:16px;
  vertical-align: top;
}
.disaster-list tr:nth-child(odd){
  background-color: #fff;
}
.disaster-list tr:nth-child(even){
  background-color: transparent;
}
.disaster-list .photo{
  height: 120px;
  overflow: hidden;
}
.disaster-list img{
  width: 200px;
}
.disaster-list .date{
  display: block;
  text-align: center;
  color: #515151;
  line-height: 100%;
  margin:0;
  padding:0 0 5px 0;
  white-space: nowrap;
}
.disaster-list .category{
  display: inline-block;
  text-align: center;
  font-size: 14px;
  color: #fff;
  line-height: 100%;
  margin:5px 5px 10px;
  padding:5px 16px 3px;
}
.disaster-list .photo{
  margin: 0;
}
.disaster-list .place{
  background:#555;
}
.disaster-list .type{
  background:#222;
}
.disaster-list .satellite{
  background:#bb3c3c;
  border-radius: 16px;
}
.disaster-list .general{
  background:#555;
}
.disaster-list .avnir{
  background:#1c9371;
  border-radius: 16px;
}
.disaster-list .palsar{
  background:#0130aa;
  border-radius: 16px;
}
.disaster-list .prism{
  background:#bb3c3c;
  border-radius: 16px;
}
.disaster-year-list iframe{
  width: 100%!important;
  height: 60px;
  border:none;
}
.english .disaster-year-list iframe{
  width: 100%!important;
  height: 44px;
  border:none;
}
.disaster-iframe{
  background-color: #F4F5F7!important;
}
.disaster-year-list ul, .disaster-year-i ul{
  margin:10px auto;
  margin:0;
  font-size: 0;
  padding-left: 0;
}
.disaster-year-list li, .disaster-year-i li{
  display: inline-block;
  position: relative;
  font-size: 1.5rem;
  margin:0 0 5px;
  border-right: 1px solid #aaa;
}
.disaster-year-list li a, .disaster-year-i li a{
  display: block;
  line-height: 120%;
  margin:0;
  padding:2px 10px 0px;
}
/**cocoen**/
.compare-cont{
  width:100%;
}
.cocoen-drag{
  background:#0ff!important;
}
.cocoen-drag::after{
  display: block;
  position: absolute;
  content:"";
  top:50%;
  left: 10px;
  margin-top:-10px;
  border:solid 8px transparent;
  border-right:solid 10px transparent;
  border-left:solid 10px #0ff;
}
.cocoen-drag::before{
  top:50%!important;
  left:auto!important;
  right: 10px!important;
  margin-left: 0!important;
  margin-top:-10px!important;
  height:auto!important;
  border:solid 8px transparent!important;
  border-left:solid 10px transparent!important;
  border-right:solid 10px #0ff!important;
}
/*dataset*/
.dataset-tb{
  height: 400px;
  margin:20px auto 30px;
  padding:0 10px;
  overflow-y: scroll;
  background-color: #fefefe;
}
.auig-list{
  margin:10px auto 30px;
  padding:0 10px;
  background-color: #fefefe;
}
.dataset-tb table, .auig-list table{
  width: 100%;
  border-collapse: collapse;
  margin:10px 0;
}
.dataset-tb th, .auig-list th{
  vertical-align: top;
  color: #444;
  text-align: left;
  white-space: nowrap;
  border-bottom: 1px dotted #aaa;
  padding: 8px 10px 8px 0;
  background-color: transparent;
}
.dataset-tb td, .auig-list td {
  text-align: left;
  border-bottom: 1px dotted #aaa;
  padding: 8px 10px;
  background-color: transparent;
}
.dataset-tb td p{
  margin:0;
}
.dataset-tb h5{
  text-align: center!important;
  border:none;
}
.bt-fullsc{
  margin-bottom: 5px;
  font-weight: bold;
  padding:8px 20px 6px;
  background:#eee;
  border:2px solid rgb(226, 87, 45);
  border-radius: 6px;
  background: linear-gradient(#f5f5f5, #ccc);
}
.aw3d30-map iframe, .lulc-map iframe, .avnir2-mosaic-map iframe{
  width: 100%;
  height: 500px;
  border:1px solid #ccc;
}
.lulc-map iframe{
  height: 550px!important;
}
.lulc-bt-download{
  display: inline-block;
  font-size: 16px;
  margin: 0;
  vertical-align: top;
}
.lulc-bt-download a{
  color: #fff;
  text-align: center;
  margin:0;
  padding: 2px 15px 0 15px;
  background-color: #0130aa;
  border-radius: 5px;
}
.lulc-bt-download a:hover{
  background-color: #2750b9;
}
.kc50-l{
  display: block;
  float: left;
  width: 78%;
  margin:0 2% 30px 0;
}
.kc50-r{
  display: block;
  float: left;
  width: 20%;
  margin:0 0 30px;
}
.kc-50 td{
  display: table-cell;
  vertical-align: top;
  font-family: 'Roboto Condensed', sans-serif;
}
.kc-50 img{
  width: 200px;
}
.kc-map-list ul{
  padding-left: 0;
}
.kc-map-list li{
  display: inline-block;
  margin-bottom: 20px;
  padding:2px 5px;
  border-right:1px solid #aaa;
}
.kc-subtitle{
  display: block;
  position: relative;
  margin:0 0 10px;
  padding-left: 120px;
}
.kc-subtitle:before{
  display: block;
  position: absolute;
  content: "";
  top:0;
  left: 0;
  min-width: 110px;
  height: 25px;
  text-align: center;
  line-height: 180%;
  font-size: 13px;
  color:#222;
  background:#d6d9d9;
  border-radius: 4px;
}
.kc-sub-mode:before{
  content: "モード";
}
.kc-sub-span:before{
  content: "観測期間";
}
.kc-sub-date:before{
  content: "公開日";
}
.kc-sub-download:before{
  content: "ダウンロード";
}
.english .kc-sub-mode:before{
  content: "Mode";
}
.english .kc-sub-span:before{
  content: "Observation period";
}
.english .kc-sub-date:before{
  content: "Release date";
}
.english .kc-sub-download:before{
  content: "Download";
}
.kc-data-no{
  font-family: 'Roboto Condensed', sans-serif;
}
.gmap1 iframe{
  width:100%;
  height: 450px;
}
/**TOPICS**/
.topics-list table {
  width: 100%;
  border-collapse: collapse;
}
.topics-list td {
  color: #333;
  border-bottom: 1px dotted #bdc3c4;
  padding: 1rem;
  vertical-align: top;
}
.topics-list .t_date{
  white-space: nowrap;
  color:#515151;
  font-weight: 600;
}
.topics-list ul{
  margin: 0;
  padding:0 0 0 2.8rem;
}
/**activity**/
dl.conf_list_style{
  margin:0 0 4rem 1.5rem;
}
dl.conf_list_style dt{
  float:left;
  width:20rem;
  margin-bottom:20px;
  padding-bottom:5px;
}
dl.conf_list_style dd{
  margin:0 0 20px;
  padding-left:21rem;
  padding-bottom:5px;
  border-bottom:#BBB 1px dotted;
}
/*meeting*/
.meeting-title{
  display: block;
  position: relative;
  color: #0130aa;
  padding-left: 1.5rem;
}
.meeting-title:before{
  display: block;
  position: absolute;
  content: "";
  top:.7rem;
  left: 0;
  width: 8px;
  height: 8px;
  background:#005CB5;
  border-radius: 2px;
}
.meeting-speaker{
  padding-left: 1.5rem;
}
.meeting .time{
  background:#efefef;
}
/*kyoto*/
.kyoto-meeting-list ul{
  list-style:none;
  display:flex;
  flex-flow:row wrap;
  justify-content:space-between;
  margin:0;
  padding:0;
}
.kyoto-meeting-list li{
  flex:0 0 24%;
  margin-bottom:30px;
  padding:0.8rem;
  border:1px solid #c1cacf;
    background:#fff;
}
.kyoto-meeting-list li:empty{
    background:transparent;
    border: none!important;
    box-shadow:none!important;
}
.kyoto table h5{
  text-align: left;
  border-bottom: 1px dotted #ccc;
}
.kyoto table th{
  width:140px;
  white-space: nowrap;
}
.kyoto .download{
  margin: 10px 0 0;
}
.kyoto-member table .mem_1{
  width: 60px;
  text-align: center;
}
/*RA*/
.first-ra-image{
  margin:0 auto;
  width: 60px;
}
/*FAQ*/
#content .faq{
  width: 100%;
  padding: 40px 35px;
  margin: 50px auto;
  text-align: left;
}
.faq_cont{
  border-bottom: dashed 1px #aaa;
  padding: 12px 0;
  position: relative;
}
.faq_answer_click, .faq_answer_close{
  cursor: pointer;
  position: absolute;
  right: 0;
  font-family: 'Alata', sans-serif;
  font-size: 30px;
  font-weight: 600;
  color:#005CB5;
  line-height: 100%;
}
.english .faq_answer_click, .english .faq_answer_close{
  font-size: 46px;
  font-weight: normal;
}
.faq_text{
  display: block;
  position: relative;
  min-height: 30px;
  margin:0 0 20px;
  padding:0 40px;
}
.faq_text:before{
  display: block;
  position: absolute;
  content:"Q.";
  top:-5px;
  left:0;
  width:30px;
  height: 30px;
  font-family: 'Alata', sans-serif;
  font-size: 30px;
  color:#005CB5;
  line-height: 100%;
}
.faq_answer{
  display: none;
  position: relative;
  padding-left: 40px;
  line-height: 180%;
}
.faq_answer:before{
  display: block;
  position: absolute;
  content:"A.";
  top:-5px;
  left:2px;
  width:30px;
  height: 30px;
  font-family: 'Alata', sans-serif;
  font-size: 30px;
  color:#d60;
  line-height: 100%;
}
.faq_answer p{
  margin:0;
  padding:0;
}
.ibl{
  display: inline-block;
  vertical-align: middle;
}
@media screen and (max-width: 1199px){
  .ttl_head {
    width:100%;
    padding:0 15px;
  }
}
@media screen and (max-width: 1039px){
  .section {
    width: 100%;
  }
  .announce_box {
    width: 100%;
  }
  .multiple{
    white-space: nowrap;
    overflow-x:scroll;
  }
  .table-auto{
    white-space: normal;
    overflow-x:auto;
  }
  .kc50-l, .kc50-r{
    float: none;
    width: 100%;
    margin:0 auto;
  }
  .kyoto-meeting-list li{
    flex:0 0 32%;
  }
}
@media screen and (max-width: 880px){
  #compare{
    width: 100%!important;
  }
}

@media screen and (max-width: 768px){
  .float-text figure{
    float: none;
    width: 100%;
    margin:0 auto 3rem;
  }
  .ttl_head_area {
    height: 70px;
  }
  .ttl_head h1{
    padding:20px 0;
  }
  .read2, .left-box{
    float: none;
    width: 100%;
    margin:0 auto 3rem;
  }
  .arrow-change::before{
    content: "\f078";
    top:auto;
    bottom:-3rem;
    right:50%;
    margin-right:-2rem;
    margin-top:0;
  }
  .read2 {
    float: none;
    width: 100%;
  }
  #a3-sensor .read2, #a3-sensor .read2-image, .read2-image{
    float: none;
    width: 100%;
    margin:0 auto;
  }
  .disaster-year-list iframe{
    height: 90px;
  }
  .english .disaster-year-list iframe{
    height: 60px;
  }
  .photo-l, .photo-r, .read2-image, .right-box{
    float: none;
    width: 100%;
    margin:0 auto 30px;
  }
  .photo-3col li{
    width:48%;
    margin-right:2%;
  }
  .photo-r iframe{
    height: 260px;
  }
  .imagedata-box li{
    flex:0 0 48%;
  }
  .multiple table {
    display: block;
    width: 100%;
    overflow-x: scroll;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }
  .table-auto table{
    width: auto!important;
    white-space: normal;
    overflow-x:auto;
  }
  .column2{
    width: 100%;
  }
  .column2 table{
    border-bottom:none;
  }
  .column2 th, .column2 td{
    display: block;
    width: 100%;
    border:none;
    border-bottom: 1px solid #aaa;
  }
  .column2 td:empty{
    display: none;
  }
  .obs-data-list li{
    flex:0 0 48%;
  }
  .youtube iframe{
   height: auto;
  }
  .aw3d30-map iframe{
    width: 100%;
    height: 300px;
  }
  .library-image-list4 li{
    flex:0 0 48%;
  }
  .disaster-list th, .disaster-list td{
    display: block;
    width: 100%;
  }
  .disaster-list td{
    padding-top:0;
  }
  .disaster-list .date{
    display: inline-block;
  }
  .disaster-list .category{
    margin:5px;
  }
  .disaster-list .photo{
    width: 100%;
  }
  .disaster-list .photo img{
    width: 100%;
    overflow: hidden;
  }
  dl.conf_list_style dt{
    display: block;
    width:100%;
    margin:0;
    border:none;
  }
  dl.conf_list_style dd{
    display: block;
    width:100%;
    margin:0 0 20px;
    padding:0;
  }
  .topics-list td {
    display: block;
    width: 100%;
  }
  .gmap1 iframe{
    height: 300px;
  }
  .kyoto table th{
    width:100%;
  }
  .kyoto-meeting-list li{
    flex:0 0 49%;
  }
}
@media screen and (max-width: 500px){
  .imagedata-box li{
    flex:0 0 100%;
  }
}