body 
{
    background: none repeat scroll 0 0 #C5E9F9;
    color: #333333;
    font-family: "メイリオ",Arial,Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",sans-serif;
    font-size: 90%;
    line-height: 1.4em;
}
div#wrap 
{
	background: url("common/images/img_main.jpg") no-repeat scroll center top #C5E9F9;
    margin: 0 auto 0;
}

/****************************
* ヘッダー
*****************************/
div#header h1 
{
    margin-top: -20px;
    position: absolute;
    z-index: 10;
}
div#header, h1, h1 a 
{
    display: block;
    overflow: hidden;
}
h1 a 
{
    background: url("common/images/tit_tenbo.png") no-repeat scroll 0 0 transparent;
    width: 380px;
    height: 118px;
}
h1 
{
    padding: 30px 0 0 50px;
	float: left;
    height: 118px;
    text-indent: -9999px;
}
div#header 
{
    height: 400px;
    margin: 0 auto;
    width: 1002px;
}

div#header_r 
{
    width: 202px;
    position:absolute;
    right:100px;
}
p#btn_topPage 
{
    display: block;
    float: right;
    height: 32px;
    overflow: hidden;
    padding-bottom: 10px;
    width: 202px;
}

/****************************
* メイン
*****************************/
#content 
{
    padding-top: 5px;
    /*width: 1002px;*/
    width:1000px;
    margin: -20px auto 0 !important;
    background:#FFFFFF;
    padding-bottom: 20px;
}
#content_body 
{
    margin: 5px auto;
    width: 90%;
}

/* パンくず */
#pankuzu 
{
    font-size: 0.8em;
    margin: 5px 0 0 20px;
    padding-top: 10px;
}

/* 見出しタイトル */
.page_title 
{
    display: block;
    font-size: 130%;
    font-weight: bold;
    height: 50px;
    letter-spacing: 0;
    padding-top: 10px;
}

/* ページトップへ */
div#btn_pageTopBox 
{
    height: 26px;
    margin: 0 auto;
    padding-top: 20px;
    width: 1002px;
}
p#btn_pageTop 
{
    float: right;
    height: 26px;
    width: 150px;
}
p#btn_pageTop a 
{
    background: url("common/images/top4/btn_pagetop.gif") repeat scroll 0 0 transparent;
    display: block;
    height: 26px;
    overflow: hidden;
    text-indent: -9999px;
    width: 150px;
}
p#btn_pageTop a:hover 
{
	background-position: 0 -26px;
}

/****************************
* フッター
*****************************/
div#footer_area 
{
    background: none repeat scroll 0 0 #FFFFFF;
}
div#footer 
{
    margin: 0 auto;
    width: 1002px;
}
ul#fnavi 
{
	clear: both;
	list-style: none;
	padding: 30px 0;
}
ul#fnavi li,ul#fnavi li a 
{
	height: 20px;
	display: block;
	overflow: hidden;
}
ul#fnavi li 
{
	float: left;
}
ul#fnavi li a 
{
	background: url(common/images/top4/fnavi.gif);
	text-indent: -9999px;
}
ul#fnavi li#f_about a 			{ width: 110px;	background-position:      0  0; }
ul#fnavi li#f_kojin a 			{ width:  97px;	background-position: -110px  0; }
ul#fnavi li#f_dantai a 			{ width:  97px;	background-position: -207px  0; }
ul#fnavi li#f_use a 			{ width:  72px;	background-position: -304px  0; }
ul#fnavi li#f_member a 			{ width:  73px;	background-position: -376px  0; }
ul#fnavi li#f_question a 		{ width: 115px;	background-position: -449px  0; }
ul#fnavi li#f_privacy a 		{ width: 136px;	background-position: -564px  0; }
ul#fnavi li#f_manual a 			{ width: 107px;	background-position: -700px  0; }
ul#fnavi li#f_faq a 			{ width: 110px;	background-position: -807px  0; }
ul#fnavi li#f_inquiry a 		{ width:  83px;	background-position: -917px  0; }
/* ------- */
ul#fnavi li#f_about a:hover 	{ background-position:      0 -20px; }
ul#fnavi li#f_kojin a:hover 	{ background-position: -110px -20px; }
ul#fnavi li#f_dantai a:hover 	{ background-position: -207px -20px; }
ul#fnavi li#f_use a:hover 		{ background-position: -304px -20px; }
ul#fnavi li#f_member a:hover 	{ background-position: -376px -20px; }
ul#fnavi li#f_question a:hover 	{ background-position: -449px -20px; }
ul#fnavi li#f_privacy a:hover 	{ background-position: -564px -20px; }
ul#fnavi li#f_manual a:hover 	{ background-position: -700px -20px; }
ul#fnavi li#f_faq a:hover 		{ background-position: -807px -20px; }
ul#fnavi li#f_inquiry a:hover 	{ background-position: -917px -20px; }
div#fInfoBox 
{
    clear: both;
    padding-bottom: 10px;
    text-align: right;
}
div#fInfoBox address 
{
	font-size: 0.92em;
	padding: 15px 0 5px 0;
}

/****************************
* 設置地域一覧
*****************************/
div.lead
{
    /*width:900px;*/
    font-size:0.9em;
    margin:5px auto;
    text-align:center;
}
div.cameraList a, div.cameraList_r a 
{
    color: #000000;
    text-decoration: none;
}
h3 
{
    background: url("common/images/icon_camera.jpg") no-repeat scroll 0 0 transparent;
    font-size: 1.4em;
    margin: 10px 0px;
    padding: 3px 0 3px 40px;
}
div.cameraList
{
    width:950px;
    margin-right:-33px;
}
div.cameraItem
{
    /*float:left;*/
    display:inline-block;
/*  display:inline;
    zoom:1;
*/
    vertical-align:top;
    width:200px;
    margin-bottom: 40px;
    margin-right: 33px;
}
div.cameraItem_r
{
	float:left;
    width:200px;
    margin-bottom: 40px;
}
    div.cameraItem p,
    div.cameraItem2023 p,
    div.cameraItem_r p {
        font-size: 0.9em;
    }

div.cameraItem img, div.cameraItem2023 img, div.cameraItem_r img {
     width: 200px;
     height: 150px;
}

    div.cameraItem a:hover,
    div.cameraItem2023 a:hover,
    div.cameraItem_r a:hover {
        color: #CC6600;
    }
a:hover img 
{
	opacity: 0.7; /* Safari,Opera */
	-moz-opacity: 0.7; /* Firefox */
	filter: alpha(opacity=70); /* IE6,7 */
	-ms-filter: "alpha(opacity=70)"; /* IE8 */
}

.cameraList2023{
    display:flex;
    flex-wrap:wrap;
    flex-direction:row;
    gap:2rem;
}
.cameraItem2023 {
    width: 200px;
    vertical-align: top;
}
.cameraItem2023 p {
    font-size: 0.9em;
}

.sep {
    margin-top:5rem;
    margin-bottom:2rem;
}
    .sep h2 {
        font-size: 2rem;
        font-weight: bold;
        padding: 2rem;
        background-color: #E2F0D9;
    }

/****************************
* マップ
*****************************/
    div.fukidashi {
        width: 280px;
        display: flex;
        flex-direction: row;
        gap: 1em;
    }
img.fukiImg
{
    
}
span.fukiText
{
    padding-left:3px;
}
div#cameraMap
{
    position:relative;
    width:600px;
    height:500px;
    margin:0 auto;
}


@media (max-width: 980px) {
    .renew_wrapper div#wrap{
        width:100%;
    }
    #content{
        width:100%;
    }
    div#header{
        width:100%;
        height:auto;
    }
}

@media (max-width: 700px) {
    #ictmapContainer_cameraMap{
        width:100% !important;
    }
}
