body{
font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
}


/* パンクズ */

#topicpath{
margin : 0;
padding : 5px 0;
background:#f2f2f2;
background-image: linear-gradient( -45deg, #fff 25%, #f2f2f2 25%, #f2f2f2 50%, #fff 50%, #fff 75%, #f2f2f2 75%, #f2f2f2 );
background-size: 10px 10px;
color:#0f9dcc;
}

#topicpath a{
color:#0f9dcc;
}
.topicpath-in{
margin : 0 auto;
padding : 0;
overflow:hidden;
}
.topicpath-in p{
margin : 0;
padding : 3px 0 0 0;
float: left;
text-align: left;
font-size : 12px;
line-height : 14px;
}

@media print, screen and (min-width: 769px) { /* for PC  */
.topicpath-in{max-width :960px;}
.topicpath-in p{width :500px;padding-left :8px;}
} /* end for PC */

@media screen and (max-width: 768px) { /* for SP,Tablet */
#topicpath{margin : 0;padding : 5px 0 3px 8px;overflow:hidden;}
.topicpath-in p{padding-left :8px;}
}



/* シェアボタン */
#share{
margin: 0 auto;
overflow:hidden;
width: 180px;
height: 20px;
box-sizing: border-box;
}
@media screen and (min-width: 361px) {
#share{
float: right;
padding :0 0 5px 0;
}
}
@media screen and (max-width: 360px) {
#share{margin: 0 auto;padding :5px 0 20px 0;}
}


#share ul{
list-style: none;
margin: 0 auto;
padding: 0;
overflow: hidden;
}

#share ul:after {
overflow: hidden;
}

#share li{
float: left;
margin: 0 0 0 5px;
padding: 0;
width: 80px;
height: 20px;
}

.fb-like {
display: inline-block;
height: 20px;
overflow: hidden;
}
.fb_iframe_widget span {
vertical-align: top !important;
}
.fb-share-button{
margin: 0;
padding: 0;
text-align: left;
}

#share span{
display:inline-block;
}


/* トップ部分 */
#weather-top{
margin : 10px auto;
padding: 0;
text-align : center;
}

#weather-t h2{
margin : 0;
padding: 0;
font-size : 30px;
line-height : 140%;
font-weight:bold;
color:#0f9dcc;
}
@media print, screen and (max-width: 640px) {
#weather-t h2{font-size : 20px;}
}

#weather-t a{
color:#0f9dcc;
text-decoration: none;
}

#weather-t img{
width : 100%;
}

#bn-waku{
padding:0;
width : 600px;
overflow:hidden;
}

#weather-top .chuui{
clear: both;
font-size : 12px;
line-height : 140%;
padding:0 10px;
}

@media print, screen and (min-width: 975px) { /* for PC  */
#weather-top{max-width : 960px;}
#weather-t{width : 350px;float: left;text-align : left;margin :0 0 0 10px;padding:15px 0 0 0;}
#bn-waku{margin :0;float: right;width : 600px;}
}

@media only screen and (min-width: 641px) and (max-width: 974px) {
#weather-t{margin :0;padding:10px 0;}
#bn-waku{margin :0 auto;width : 600px;}
.pc_on{display:none;}
}


@media screen and (max-width: 640px) {
#weather-nav li{width: 50%;}
#bn-waku{margin :0 auto 4px auto;width : 100%;}
#bn-waku img{margin :0 2%;width : 96%;}
.pc_on{display:none;}
}

/* 警報欄 */

#weather-keihou .waku3 {
background-color : #ffffcc;
}

#weather-keihou .waku1 {
background-color : #d80000;
text-align : center;
color : #fff;
}
#weather-keihou .waku1 font{
color : #fff;
}

#weather-keihou .waku2 {
background-color : #000000;
text-align : center;
color : #ffcc00;
}
#weather-keihou TABLE{
margin: 20px 0;
padding: 0;
border-collapse: collapse;
border:1px solid #d9d9d9;
width: 100%;
}

@media print, screen and (min-width: 960px) { /* for PC  */
#weather-keihou{margin: 0 auto;width: 960px;}
#weather-keihou .waku2{width: 20%;}
#weather-keihou .waku3{width: 80%;}
#weather-keihou td,#weather-keihou tr{border-collapse: collapse;border:1px solid #d9d9d9;font-size: 16px;}
}


@media only screen and (min-width: 769px) and (max-width: 959px) {
#weather-keihou{margin: 0 auto;width: 750px;}
#weather-keihou .waku2{width: 20%;}
#weather-keihou .waku3{width: 80%;}
#weather-keihou td,#weather-keihou tr{border-collapse: collapse;border:1px solid #d9d9d9;font-size: 15px;}
}

@media screen and (max-width: 768px) {
#weather-keihou{margin: 10px;}
#weather-keihou table, tbody, tr, th, td {display: block;font-size: 15px;}
}

/* 気象情報一覧 */

#weather-nav{
margin : 0 auto;
padding:20px 0;
width : 100%;
overflow:hidden;
background:#f9f9f9;
}

#weather-nav ul{
margin : 0;
padding:0;
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;
}

#weather-nav li{
margin :0 1.2% 1.2% 1.2%;
padding:0;
float: left;
list-style: none;
position: relative;/*相対配置*/
}

#weather-nav img{
width : 100%;
border-radius: 6px 2px;
}
#weather-nav a:hover img{
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter:"alpha( opacity=70 )";
}

#weather-nav li p{
width : 100%;
margin : 0;
font-size : 14px;
line-height : 140%;
text-align:center;
position: absolute;/*絶対配置*/
top: 0;
left: 0;
color: #fff;
text-shadow: 1px 1px 3px #000;
background: rgba(0, 0, 0, 0.3);
border-radius: 6px 2px 0 0;
padding:5px 0;
}
@media print, screen and (min-width: 769px) { /* for PC  */
#weather-nav ul{width: 92%;margin :0 auto;}
#weather-nav li{width: 22.4%;}
}
@media only screen and (min-width: 641px) and (max-width: 768px) {
#weather-nav ul{width: 98%;margin :0 auto;}
#weather-nav li{width: 30.5%;}
}

@media screen and (max-width: 640px) {
#weather-nav ul{width: 98%;margin :0 auto;}
#weather-nav li{width: 47.5%;}
}


#weather-nav .weather-footer-link{
text-align : center;
clear: both;
}
#weather-nav .weather-footer-link a{
padding: 5px 10px;
text-decoration: none;
color:#0f9dcc;
font-size : 14px;
line-height : 140%;
border:1px solid #0f9dcc;
 -webkit-border-radius: 4px;
 border-radius: 4px;
background:#fff;
}
#weather-nav .weather-footer-link a:hover{
color:#fff;
background:#0f9dcc;
}


/* 気象関連まとめ枠 */

#weather-etc{
margin : 0 auto;
padding: 0;
max-width:960px;
/* max-width:1200px; */

}
@media print, screen and (min-width: 961px) { /* for PC  */
#weather-etc{width: 90%;margin :0 auto;}
}

#weather-etc-l{
margin : 0 auto;
padding: 20px 0;
/* max-width:500px; */
overflow:hidden;
}
@media print, screen and (min-width: 769px) {
#weather-etc-l{
margin : 0 1%;
/*
float: left;
width : 44%;
*/
}
}

@media screen and (max-width: 768px) {
#weather-etc-l{width : 96%;margin : 0 auto;}
}


#weather-etc-l .fb_iframe_widget,
#weather-etc-l .fb_iframe_widget span,
#weather-etc-l .fb_iframe_widget iframe[style]{
    width: 100% !important;
}

#weather-etc-l ul{
margin : 0;
padding:0;
}
#weather-etc-l li{
margin : 0;
padding:0 0 1% 0;
list-style: none;
}
@media screen and (min-width: 481px) {
#weather-etc-l li{
width : 33.3%;
float: left;
}
}

#weather-etc-l li a{
text-align:center;
background:#eeeeee;
margin : 10px 1% 0 1%;
padding:10px 0;
display:block;
text-decoration: none;
color:#0f9dcc;
font-size : 14px;
line-height : 140%;
}
#weather-etc-l li a:hover{
background-color : #0f9dcc;
color:#fff;
}



/* facebook枠 */
/* .weather-fb{display:none;} */

.weather-fb{margin : 0 1%;width : 98%;}

.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget iframe[style]{
  width: 100% !important;
}


/* トップ臨時気象情報部分 */
.weather-rinji{
margin : 0 1%;
padding: 20px 0;
overflow:hidden;
/* facebookを隠すときはこの下2行を隠す */
width : 50%;
float: right;
}

@media screen and (max-width: 768px) {
.weather-rinji{width : 98%;}
}

.weather-rinji h2{
margin : 0 0 10px 0;
padding:3px 0;
font-size : 16px;
line-height : 140%;
background:#f2f2f2;
background-image: linear-gradient( -45deg, #fff 25%, #f2f2f2 25%, #f2f2f2 50%, #fff 50%, #fff 75%, #f2f2f2 75%, #f2f2f2 );
background-size: 10px 10px;
text-align:center;
}

.weather-rinji ul{
margin : 0;
padding:0;
}

.weather-rinji li{
margin : 0 0 2% 0;
padding:0;
list-style: none;
border: dotted 1px #ccc;
overflow: hidden;
border-radius: 4px;
}

.weather-rinji pre{
margin : 5px;
height : 110px;
overflow: auto;
word-wrap: break-word;
white-space: pre-wrap; /*英単語を折り返す*/
width: 97%; /*画面サイズに合わせる*/
}


@media screen and (max-width: 768px) {
.weather-rinji li{margin : 0 4% 2% 4%;}
}
.weather-rinji h3{
margin : 0 1%;
padding:3px 0;
font-size : 13px;
line-height : 140%;
text-align: center;
font-weight:normal;
border-bottom: dotted 1px #ccc;
}


/* 個別ページ */
#w-data{
margin:0 auto 30px auto;
max-width:700px;
}

#w-data h2{
margin:20px auto 10px auto;
position: relative;
text-align: center;
}


#w-data h2 span {
	position: relative;
	z-index: 2;
	display: inline-block;
	margin: 0 4em;
	padding: 0 1em;
	background-color: #fff;
	text-align: left;
font-size : 18px;
line-height : 140%;
color:#4ea68c;
}
#w-data h2::before {
	position: absolute;
	top: 50%;
	z-index: 1;
	content: '';
	display: block;
	width: 100%;
	height: 1px;
	background: #ccc;
	background: -webkit-linear-gradient(-45deg, transparent, #ccc 10%, #ccc 90%, transparent);
	background: linear-gradient(-45deg, transparent, #ccc 10%, #ccc 90%, transparent);
}

@media screen and (max-width: 640px) {
#w-data h2 span{font-size : 15px;text-align: center;}
}

#w-data img{
width:100%;
border-radius: 4px;
}
#w-data .koushin-chuui{
  margin: 0;
  padding: 0;
  text-align: center;
  font-size: 12px;
color:#ff0000;
}


@media screen and (max-width: 700px) {
#w-data{
padding:0 10px 10px 10px;
}
}


/* 竜巻注意情報 */
.tatsumaki{
  clear: both;
  margin: 0 10px 30px 10px;
  padding: 8px;
  text-align: left;
  font-size: 12px;
  border: dotted 1px #ccc;
border-radius: 4px;
}
.tatsumaki h3{
margin : 0;
padding:3px 0;
font-size : 13px;
line-height : 140%;
text-align: center;
font-weight:normal;
border-bottom: dotted 1px #ccc;
}
.tatsumaki pre{
overflow: auto;
word-wrap: break-word;
}

/* 降灰予報 */
#kouhai{
margin : 0 auto 20px auto;
padding: 0;
overflow:hidden;
}
.kouhai-t{
margin : 0 auto;
padding: 5px 0;
border-top: 1px dashed #5fbb22;
border-bottom: 1px dashed #5fbb22;
text-align: center;
}

.kouhai-menu{
margin : 0 auto;
padding: 0 0 10px 0;
width :280px;
overflow:hidden;
}

.kouhai-menu ul{
margin : 0;
padding: 0;
list-style: none;
}
.kouhai-menu li{
margin : 0 1%;
width :48%;
padding:0;
float: left;
text-align: center;
}

.kouhai-menu a{
border-radius: .2em;
text-decoration: none;
display: block;
padding: 4px 0;
}
.page-on a {
background-color: #4ea68c;
border: 1px solid #4ea68c;
color: #fff;
pointer-events: none;
}
.page-off a {
background-color: #ddd;
border: 1px solid #c2c2c2;
color: #666;
}

.page-off a:HOVER{
border: 1px solid #4ea68c;
}


#kouhai ul{
margin : 0 auto;
padding: 0;
list-style: none;
display : inline ;
}

#kouhai li{
margin :0;
width :50%;
padding: 5px 0;
float: left;
text-align: center;
font-size : 13px;
line-height : 140%;
}
#kouhai li img{
width :95%;
}

.kouhai-shousai{
margin : 0 auto;
padding: 0 0 8px 0;
text-align: left;
clear: both;
}
.kouhai-shousai:first-letter {
color: #fff;
}

.kouhai-link{
text-align: center;
}

/* レーダー予想 */
.w-movie-link{
margin : 0 auto;
padding: 8px 0;
text-align: center;
}
.w-movie-link a{
padding: 5px 10px;
text-decoration: none;
color:#4ea68c;
font-size : 12px;
line-height : 140%;
border:1px solid #4ea68c;
 -webkit-border-radius: 4px;
 border-radius: 4px;
}
.w-movie-link a:hover{
color:#fff;
background:#4ea68c;
}

/* レーダー動画 */
#w-anime-nav{
margin : 0 auto;
padding:0;
width : 100%;
overflow:hidden;
text-align: center;
font-size : 13px;
line-height : 140%;
}

#w-anime-nav ul{
margin :10px auto 0 auto;
padding:0;
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;
}

#w-anime-nav li{
margin :0 1.2% 1.2% 1.2%;
padding:0;
float: left;
list-style: none;
position: relative;/*相対配置*/
}

#w-anime-nav img{
width : 100%;
border-radius: 6px 2px;
}
#w-anime-nav a:hover img{
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter:"alpha( opacity=70 )";
}

#w-anime-nav li p{
width : 100%;
margin : 0;
font-size : 14px;
line-height : 140%;
text-align:center;
position: absolute;/*絶対配置*/
top: 0;
left: 0;
color: #fff;
text-shadow: 1px 1px 3px #000;
background: rgba(0, 0, 0, 0.3);
border-radius: 6px 2px 0 0;
padding:5px 0;
}
@media screen and (min-width: 641px) { /* for PC  */
#w-anime-nav li{width: 30.5%;}
}

@media screen and (max-width: 640px) {
#w-anime-nav li{width: 47.5%;}
}



/* 台風情報 */
.typhoon-ichi{
margin:0;
overflow: auto;
}

@media screen and (max-width: 640px) {
.typhoon_print{display:none;}
}

.typhoon-ichi-t{
margin:1.4em auto 1em auto;
padding: .3em .75em;
border-top: 1px dashed #5fbb22;
border-bottom: 1px dashed #5fbb22;
text-align: center;
font-size : .95em;
overflow: hidden;
}


/* フッター部分 */
#weather-footer{
clear: both;
margin:0;
padding:0 0 10px 0;
font-size : 14px;
line-height : 140%;
background:#f2f2f2;
background-image: linear-gradient( -45deg, #fff 25%, #f2f2f2 25%, #f2f2f2 50%, #fff 50%, #fff 75%, #f2f2f2 75%, #f2f2f2 );
background-size: 10px 10px;
overflow: hidden;
}

#weather-footer-in{
margin : 0 auto;
padding: 0 10px;
max-width:1000px;
}

#weather-footer-in p{
margin : 20px 0 8px 0;
padding: 0 0 2px 0;
border-bottom:1px solid #d6d6d6;
}

#weather-footer ul{
margin :0;
padding:0 1%;
display: inline-block;
vertical-align: top;
}

#weather-footer li{
list-style: none;
padding:0 0 0 6px;
}


#weather-footer li a {
text-decoration: none;
color:#0f9dcc;
display:block;
}


#weather-footer li a:hover{
color:#74c1da;
}

@media print, screen and (min-width: 769px) { /* for PC  */
#weather-footer ul{width: 23%;}
}

@media only screen and (min-width: 361px) and (max-width: 768px) {
#weather-footer ul{width: 47%;}
}

@media screen and (max-width: 360px) {
#weather-footer ul{width: 100%;}
#weather-footer li a {padding:3px 0;font-size : 15px;}
}


/* 404ページ */
.notfound{
border:1px solid #4ea68c;
 -webkit-border-radius: 8px;
 border-radius: 8px;
font-size : 15px;
line-height : 140%;
}

@media print, screen and (min-width: 769px) { /* for PC  */
.notfound{margin:50px auto;padding: 15px;max-width :760px;}
}

@media screen and (max-width: 768px) {
.notfound{margin:20px;padding: 10px;}
}




/* コピーライト */

#cr{
margin:0;
padding: 15px 0 0 0;
font-size : 10px;
line-height : 140%;
text-align : center;
clear: both;
}