li{
  font-size: 12px;
}

.links {
    padding: 20px;              
    text-align:  center;                   
}

@media (min-width: 800px) {
    .container {
      max-width: 500px;
    }
  }

@media screen and (min-width:0px) {
    /*　画面サイズが0px以上の場合読み込む　*/
    h1.h1itile { font-size:10pt;}
    h1.h1mesg { font-size:10pt;}
    h3.h3itile { font-size:11pt;}
    .imgSize{width: 251px;}
    .divChange{text-align:start;}
    .suicaImg{width: 200px;height: 50px;}
    .id-portImg{width: 225px;height:55px;}
    .topicImg{width: 150px;}
    .imgStyle{width: 105px;height: 30px; margin-top: 10px;margin-bottom: 10px;}
    .MyncardimgStyle{width: 105px;height: 105px; margin-top: 10px;margin-bottom: 10px;}
    .divSizeTyle{ height: 60px;}
    .rightStyle{padding-right: 5px}
    .leftStyle{padding-left: 5px} 
}
@media screen and (min-width:367px) {
    /*　画面サイズが367px以上の場合読み込む　*/
    h1.h1itile { font-size:10pt;}
    h1.h1mesg { font-size:10pt;}
    h3.h3itile { font-size:11pt;}
    .imgSize{width: 251px;}
    .divChange{text-align:start;}
    .suicaImg{width: 200px;height: 50px;}
    .id-portImg{width: 255px;height:55px;}
    .topicImg{width: 100px;}
    .imgStyle{width: 105px;height: 30px; margin-top: 10px;margin-bottom: 10px;}
    .MyncardimgStyle{width: 105px;height: 105px; margin-top: 10px;margin-bottom: 10px;}
    .divSizeTyle{ height: 60px;}
    .rightStyle{padding-right: 5px}
    .leftStyle{padding-left: 5px}
<!--  -->
	.button001 a {
	    background: #9acd32;
	    border-radius: 5px;
	    position: relative;
	    display: flex;
	    justify-content: space-around;
	    align-items: center;
	    margin: 0 auto;
	    max-width: 260px;
	    padding: 10px 25px;
	    color: #313131;		// Font Color
	    transition: 0.3s ease-in-out;
	    font-weight: 500;
	}
	.button004 a:after {
	    position: absolute;
	    top: 50%;
	    right: 20px;
	    border-radius: 1px;
	    transition: 0.2s ease-in-out;
	    content: "\f0da";
	    font-family: "Font Awesome 5 Free";
	    font-weight: 900;
	    transform: translateY(-50%);
	}
	.button004 a:hover {
	    background: #313131;
	    color: #FFF;
	}
<!--  -->
}
@media screen and (min-width:768px){
    /*　画面サイズが768px以上の場合読み込む　*/
    h1.h1itile { font-size:24pt;}
    h3.h3itile { font-size:20pt;}
    .imgSize{width: 300px;}
    .divChange{text-align:center; }
    .suicaImg{width: 400px;height: 100px;}
    .id-portImg{width:400px;height:86px;}
    .topicImg{width: 100px;}
    .imgStyle{width: 160px;height: 45px; margin-top: 10px;margin-bottom: 10px;}
    .MyncardimgStyle{width: 160px;height: 160px; margin-top: 10px;margin-bottom: 10px;}
    .divSizeTyle{height: 80px;}
    .rightStyle{padding-right: 15px}
    .leftStyle{padding-left: 15px}
    
<!--  -->
	.button001 a {
	    background: #9acd32;
	    border-radius: 5px;
	    position: relative;
	    display: flex;
	    justify-content: space-around;
	    align-items: center;
	    margin: 0 auto;
	    max-width: 260px;
	    padding: 10px 25px;
	    color: #313131;		<!-- Font Color -->
	    transition: 0.3s ease-in-out;
	    font-weight: 500;
	}
	.button004 a:after {
	    position: absolute;
	    top: 50%;
	    right: 20px;
	    border-radius: 1px;
	    transition: 0.2s ease-in-out;
	    content: "\f0da";
	    font-family: "Font Awesome 5 Free";
	    font-weight: 900;
	    transform: translateY(-50%);
	}
	.button004 a:hover {
	    background: #313131;
	    color: #FFF;
	}
<!--  -->
}
.table-noborder {
    border-top: 0px !important;
    border-bottom: 0px !important;
  }

.divLineStyle{
  border:dashed 1px;
  border-color: darkgray;
}

/* .imgStyle{
  width: 160px;
  height: 45px;
  margin-top: 10px;
  margin-bottom: 10px;
} */
 
/* 点滅 */
.blinking{
	-webkit-animation:blink 1.5s ease-in-out infinite alternate;
    -moz-animation:blink 1.5s ease-in-out infinite alternate;
    animation:blink 1.5s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}

.example-main {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  padding-left: 8.5rem;
  overflow-y: scroll;
}

.guguttoImg {
  width: 263px;
  border: 1px solid black;
}

.guguttoImg2 {
  width: 300px;
}

.topicImg2 {
  width: 80%;
  height: auto;
}


.button001 a {
    background: #9acd32;
    border-radius: 5px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    max-width: 260px;
    padding: 10px 25px;
    color: #313131;		// Font Color
    transition: 0.3s ease-in-out;
    font-weight: 500;
}
.button004 a:after {
    position: absolute;
    top: 50%;
    right: 20px;
    border-radius: 1px;
    transition: 0.2s ease-in-out;
    content: "\f0da";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    transform: translateY(-50%);
}
.button004 a:hover {
    background: #313131;
    color: #FFF;
}

/* お知らせ用罫線 */
.info_line {
	border:1px solid #c0c0c0;
/*	height:0px;*/
}