@charset "utf-8";

/*////////////////////////////////////////////////////////

/css/net_top_styles.css

/////////////////////////////////////////////////////////*/
/* ----------------------------------------------- 
	
	1:topics _pc

	
 ----------------------------------------------- */

/*topics _pc*/
a img { border-style:none;}
body{ margin:0; padding:0;}
a{text-decoration: none;}
div#topics{background: #fff; width:1006px; margin:0 auto;overflow: hidden;display: block;}
div#topics ul{display: block;width: 1006px;margin: 0 auto;padding:0;height: auto;overflow: hidden;font-size: 0;}
div#topics ul li{position: relative; vertical-align: top;list-style-type: none;width: 315px;display: inline-block;zoom: 100%;border: 4px solid #92D4F5;overflow: hidden;line-height: 1.7em;
height: 315px;font-size: 16px;height: 315px;margin: 0 15px 15px 0;}
div#topics ul li:nth-child(3){margin: 0 0 15px 0;}
div#topics ul li:nth-child(6){margin: 0 0 15px 0;}
div#topics ul li:nth-child(9){margin: 0 0 15px 0;}
div#topics ul li:nth-child(12){margin: 0 0 15px 0;}
div#topics ul li:nth-child(15){margin: 0 0 15px 0;}
div#topics ul li:nth-child(18){margin: 0 0 15px 0;}
div#topics ul img{height: auto;width: auto;margin: 0 auto;vertical-align: middle;width: 100%;height: auto;}
* html div#topics ul li{zoom: 100%; width:138px;}
span.title{color: #656565;line-height: 1.7em;text-align: left;display: block;}
div#topics ul li span.date{font-size: 12px;font-weight: bold;color: #656565;}
div#topics ul li a.tpLink{
padding: 10px 0 0 0;
width: 330px;
display: block;
float: right;
}

div#topics p#snsBtn{
margin: -33px;
width: 460px;
height: 60px;
text-align: right;
}
div#topics p#snsBtn img{
width: 76px;
}
span.news{position: absolute;top: 6px;left: 5px;}
span.news img{max-width: 80px;height: auto;}

#box{border-bottom: 1px solid #333;margin: 0.5em 0;height: 15px;display: block;}
#box a{display: block;width: 100%;height: 100%;background-color: #FFF;left: 0;}
#box_img a{display: block;}
div.box_imgin{position: relative;}
div.box_imgin a{display: block;width: 100%;height: 100%background-color: #FFF;}
.ttl{overflow: hidden;position: absolute;bottom: 0;z-index: 100;width: 90%;padding: 10px 5% 5px 5%;background-color: #D4F0FFE6;color:#545251;background-color:rgba(215, 242, 255, 0.76);}
.ttl a{color:#545251;font-size:16px; }
.title a{display: block;}
.date{display: block;text-align: right;font-size: 13px;}
#title a{display: block;width: 100%;}


@media only screen and (max-device-width: 0), screen and (max-width: 768px){
div#topics{width: 100%;}
div#topics ul{width: 98%;}
div#topics ul li{width: 46%;margin:1%;border: 2px solid #92D4F5;height: 170px;}
div#topics ul li:nth-child(3){margin:1%;}
div#topics ul li:nth-child(6){margin:1%;}
div#topics ul li:nth-child(9){margin:1%;}
div#topics ul li:nth-child(12){margin:1%;}
div#topics ul li:nth-child(15){margin:1%;}
div#topics ul li:nth-child(18){margin:1%;}
div#topics ul li{font-size:13px;}
.ttl{overflow: hidden;width: 90%;padding: 2% 5% 2% 5%;height: 35%;}
a.title{font-size: 14px;height: 70%;overflow: hidden;display: block;line-height: 1.5em;}
a.date{font-size: 12px;}
span.news img{width: 50% !important;}
}