@charset "utf-8";
/* CSS Document */

#realtime{ 
  color: #db5f53;
  background: #fcf1ef;
  font-weight: 500;
  padding: 2% 3%;
  margin: 3% auto;
}

#realtime dt{ margin-right: 10px; }

#webTxt li, #subIcon li{ position: relative;  padding-left: 20px; margin-bottom: 5px;}
#webTxt li::before, #subIcon li::before{ content: "・"; position: absolute ; left: 0; }



#broadTxt {
  margin: 0 0 50px 20px;
}
#broadTxt li {
  line-height: 1.8em;
  margin-bottom: 10px;
  line-break: strict;
}

#broadTxt li p {
  margin-bottom: 5px;
}

#broadBox dt {
  color: #db5f53;
  font-weight: 600;
  margin-bottom: 5px;
}

#broadBox dd {
  margin-bottom: 20px;
}


#webBtn{ margin: 0 auto; }
#webBtn li:first-child{ margin-bottom: 15px; }

#webBtn .nolink a{ color:#555;
  background: #efefef;
  border: #ccc; }

  #webBtn .nolink a:after{ border-top: 2px solid #555;
    border-right: 2px solid #555; }

.externalIcon2 i:before{border-left:1px solid #fff; border-bottom:1px solid #fff;}
.externalIcon2 i:after{border:1px solid #fff; }

@media screen and (min-width: 641px) and (max-width: 1059px) {
    
}


@media screen and (min-width: 751px) {
  #realtime{font-size: 1.3em; }

}

@media screen and (min-width: 481px) {
#realtime{ display: flex;}
}

@media screen and (min-width: 381px) {
#webBtn{ width: 340px;}
}


/*pc--------------------------------------------*/
@media screen and (min-width: 1025px) {
  #realtime{ width: 60%; }
  #webTxt{ width: 90%; margin: 0 auto 40px; }
}

@media screen and (max-width: 1024px) {
  #webTxt{ margin-bottom: 4%; }
}


@media screen and (max-width: 750px) {
  #webBtn span{ font-size: 0.8em; }
}

@media screen and (max-width: 480px) {
#realtime{text-align: center;}
}
@media screen and (max-width: 380px) {
  #webBtn{ width: 290px;}
}