body{font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, Meiryo, sans-serif;}



/* タイトル */

#title h3{
margin: 0;
padding: .5rem 0;
color:#ffffff;
background-image: -webkit-gradient(linear, left top, left bottom, from(#35d2ff),to(#00b1e4));
text-align: center;
font-size: 1.35rem;
line-height : 1.6rem;
}

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

/* バナー*/
#bn-waku{margin :0 auto;padding:.5rem 0;}
@media print, screen and (min-width:701px) {
#bn-waku{width : 600px;overflow:hidden;}
}
@media screen and (max-width: 700px) {
#bn-waku{margin :0 1rem;}
#bn-waku img{width : 100%;}
}



/* コンテンツ */

#trf{
max-width:1200px;
margin : 0 auto;
padding: 5px 1rem;
}

@media print, screen and (min-width:768px) {
#trf{display: flex;justify-content: flex-end;flex: 1; justify-content: space-evenly;}
#trf ul{width:31.3%;}
}


#trf h4{
margin: 0;
padding: .3rem 1rem .2rem 1rem;
color:#ffffff;
background-image: -webkit-gradient(linear, left top, left bottom, from(#76c100),to(#a8e34a));
text-align: left;
font-size: 1.1rem;
font-weight:normal;
}

#trf ul{
margin:0;
padding:0;
text-align:left;
box-sizing: border-box;
}

#trf li{
margin:0;
padding:0;
list-style-type:none;
border-bottom: 1px dashed #7b9b59;
}

@media screen and (max-width: 768px) {
#trf li:last-child{border:none;}
}

#trf li span{
font-size : .85rem;
}

#trf li a{
display: block;
padding:.75rem;
text-decoration: none;
color:#486c21;
}

#trf li a:hover{
 background-color: #d6ffab;
}
#trf li.bnon{border:none;}

/* その他 */
#trf_etc{
max-width:1160px;
margin : 0 auto;
padding: 5px 1rem;
}
#trf_etc h4 {
margin: .5rem 0;
padding: .3rem 1rem;
color:#00b2e5;
text-align: left;
font-size: 1.15rem;
position: relative;
padding: 0.25em 0;
}
#trf_etc h4:after {
  content: "";
  display: block;
  height: 4px;
  background: -webkit-linear-gradient(to right, rgb(0, 178, 229), transparent);
  background: linear-gradient(to right, rgb(0, 178, 229), transparent);
}
#trf_etc ul{
margin:0;
padding:0;
text-align:left;
box-sizing: border-box;
}
#trf_etc li{
margin:.5rem;
padding:0;
list-style-type:none;
border: 1px solid #ccc;
}
#trf_etc li a{
display: block;
text-decoration: none;
color:#00b2e5;
position:relative;
padding: .6rem 0.5rem .6rem 2rem;
}
#trf_etc li a:before {
position:absolute;
content:'';
top: 1rem;
left: 1rem;
height:0;
width:0;
border-style: solid;
border-width: 6px 0 6px 9px;
border-color: transparent transparent transparent #00b2e5;
}
#trf_etc li a:hover{
 background-color: #cdf4ff;
}

@media print, screen and (min-width:768px) {
#trf_etc ul{display: -webkit-flex;display: flex;}
#trf_etc li{width:25%;}
}


/* コピーライト*/

#cr{
padding : 10px;
font-size : .7rem;
line-height : 1rem;
text-align : center;
clear: both;
}