html {overflow: auto;}

TABLE{
  font-size : 12px;
  line-height : 14px;
 border-collapse: collapse;
  border-spacing: 0;
clear: both;
}
#webcam{
margin : 0 auto;
padding : 0 1rem;
max-width :980px;
}

/* パンクズ*/
#topicpath{
margin : 0;
padding : 0;
width :100%;
}
#topicpath p{
margin : 0 auto;
padding : 5px 1rem;
max-width :980px;
font-size : .8rem;
line-height : 1rem;
text-align: left;
}

/* タイトル*/
#webcam-title{
margin : .5rem auto 0 auto;
padding : 0;
border-bottom: 5px solid #23277c;
max-width :980px;
}
#webcam-title img{
margin : .5rem 1rem;
}

#webcam-title p{
margin : 0;
padding : .3rem 1rem;
font-size : .8rem;
line-height : 1rem;
color:#23277c;
}
@media print, screen and (min-width:769px) {
#webcam-title p{padding : 1rem;width :50%;float: right;}
}


/* ヘッダー*/
#webcam-top{
margin : 0 auto;
padding : 0;
}
.top-l{margin : 10px 0;padding : 0;text-align: center;}
.top-l img{margin : 0 .5rem;}
.top-r{margin : 10px 0;padding : 0;font-size :.9rem;line-height : 1.2rem;text-align: left;}

@media print, screen and (min-width:769px) {
.top-l,.top-r{float: left;}
.top-l{width :50%;}
.top-r{width :50%;}
}

/* カメラ一覧 */
#webcam-list{
margin : 10px auto;
max-width :980;
}

#webcam-list ul{
margin : 0;
padding : 0;
clear:both;
overflow: hidden;
display:-webkit-box;
display:-moz-box;
display:-ms-box;
display:-webkit-flexbox;
display:-moz-flexbox;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:-ms-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}

#webcam-list li{
float: left;
width :22.6%;
padding:.5% 1% 1% 1%;
margin: 0.2%;
list-style: none;
display: inline-block;
text-align: center;
font-size : 12px;
background:#fff;
}

@media only screen and (min-width: 641px) and (max-width: 980px) {
#webcam-list li{width :30.6%;}
}
@media screen and (max-width: 640px) {
#webcam-list li{margin: 0.5%;width :46%;}
}


#webcam-list .cam-t{
margin : 0;
padding : 0;
text-align: left;
font-size : .75rem;
}

#webcam-list .movie-bn{
margin :0 0 .5rem 0;
padding :0;
text-align: center;
overflow: hidden;
}
@media print, screen and (min-width:768px) {
#webcam-list .cam-t{width :70%;float: left;}
#webcam-list .movie-bn{width :29.5%;float: right;}
}

#webcam-list .movie-bn a{
text-decoration:none;
color:#fff;
padding: 0 4px;
 -webkit-border-radius: 3px;
 border-radius: 3px;
background:#467c01;
font-size : .8rem;
}

#webcam-list .movie-bn a:HOVER{
background:#2b4c01;
}


#webcam-list .cam-photo img{
margin : 0;padding : 0;width :100%;
}
#webcam-list .cam-photo1 img{
margin : 0;padding : 0;width :100%;
}
@media print, screen and (min-width:768px) {
#webcam-list .cam-photo1 img{margin : 1.5rem 0 0 0;}
}




/* 映像提供 */


#teikyo-list{
margin : 0;
padding : 0;
}
#teikyo-list h5{
font-weight:normal;
margin : 0;
padding : 1% 0;
font-size :1rem;
}


#teikyo-list ul{
margin : 0;
padding : 0;
clear:both;
overflow: hidden;
display:-webkit-box;
display:-moz-box;
display:-ms-box;
display:-webkit-flexbox;
display:-moz-flexbox;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:-ms-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}

#teikyo-list li{
width :100%;
padding:0;
margin: 0;
list-style: none;
display: inline-block;
text-align: center;
font-size :.9rem;
background:#fff;
border-right: 1px solid #ece3bb;
border-bottom: 1px solid #ece3bb;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}

#teikyo-list li DIV.number{
padding:1% .5%;
float: left;
width :25%;
vertical-align:middle;
}
#teikyo-list li DIV.number img{
vertical-align: bottom;
margin: 0 auto;
}
#teikyo-list li DIV.teikyo{
padding:1%;
float: left;
width :70%;
color:#0000cc;
border-left: 1px solid #ece3bb;
text-align: left;
}

@media print, screen and (min-width:769px) {
#teikyo-list li{float: left;width :50%;}
}

.credit{
border-width : 1px;
border-style : solid;
border-color : #999999;
}



/* コピーライト */
#cr{
padding : 8px 0;
font-size : 11px;
line-height : 130%;
text-align: center;
clear:both;
}