html {
 overflow-y: scroll;
scroll-behavior:smooth;
overflow-x: hidden;
}

body {
margin:0 auto;
padding:0;
font-family: 'Hiragino Sans','ヒラギノ角ゴシック','メイリオ', 'Meiryo','ＭＳ Ｐゴシック','MS PGothic' !important;
}

.img-responsive {
  display: inline-block;
  height: auto;
  max-width: 100%;
margin:0 auto;
}

div:after,
ul:after {
 content: "";
display: block;
 clear: both;
}

ul{
 list-style: none;
 margin: 0px;
 padding: 0px;
}

a img {
    transition: opacity 0.1s linear;
}
a:hover img {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}

/*汎用*/

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 992px) {
.pc { display: none !important; }
.sp { display: block !important; }
}



/*header*/

.header{
background-color:#bdccd4;
color:#333;
    padding: 7px 0;
    font-size: 12px;
}


/*main*/

.mainOuter{
  background: -moz-linear-gradient(left, #294fa0, #7fbce7);
  background: -webkit-linear-gradient(left, #294fa0, #7fbce7);
  background: linear-gradient(to right, #294fa0, #7fbce7);
}

.mainInner{
background-image:url("images/bg_mainL.png");
    text-align: center;
    background-position-x: center;
    background-repeat: no-repeat;
    padding: 30px;
    background-size: cover;
}

/*mid*/

.midOuter{
margin:30px auto;
}
@media only screen and (max-width: 992px) {
.midOuter{
padding-bottom:0px;
}
}


/*news*/

.newsOuter{
border:1px solid #1d4197;
margin:0 0 30px;
}
.newsHead{
    background-color: #bdccd4;
    text-align: left;
    margin:2px;
    padding:5px 50px 14px 5px;
}

.newsBox ul{
margin:0;
padding:0;
list-style:none;
}
.newsBox li{
    border-bottom: 1px dashed #1d4197;
    padding: 20px 10px;
    margin: 0 15px;
}
.newsBox li:last-child{
    border-bottom:none;
}

.newsBox a {
    color: #333;
    text-decoration: underline;
}


@media only screen and (max-width: 567px) {

.newsBox span{
display:block;
}

}

/*bannerArea*/

.bannerArea{
text-align:center;
}


/*footer*/

#footer{
background-color:#bdccd4;
padding:20px 0;
    width: 100%;
}

.logoFooter h3{
color:#fff;
font-size:32px;
font-weight:bold;
margin:0;
padding:0;
}
.logoFooter span{
color:#fff;
font-size:16px;
margin:0;
padding:5px 0;
}
.logoFooter p{
color:#fff;
font-size:21px;
margin:0;
padding:0;
}

.copyright{
position:absolute;
bottom:0;
}

@media only screen and (max-width: 992px) {
#footer{
background-color:#bdccd4;
padding:20px 0;
    position:relative;
    bottom: 0;
    width: 100%;
}
.copyright{
position:relative;
bottom:0;
padding-top:30px;
}
}


.archiveLink{
    background: rgb(0,113,188);
    background: -moz-linear-gradient(left,  rgba(0,113,188,1) 0%, rgba(27,20,100,1) 100%);
    background: -webkit-linear-gradient(left,  rgba(0,113,188,1) 0%,rgba(27,20,100,1) 100%);
    background: linear-gradient(to right,  rgba(0,113,188,1) 0%,rgba(27,20,100,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0071bc', endColorstr='#1b1464',GradientType=1 );
    color:#fff;
    display: block;
    margin: 15px auto;
    padding: 15px 30px;
    max-width: 510px;
    border-radius: 5px;
    opacity: 1.0;
    filter: alpha(opacity=100);
    -ms-filter: "alpha(opacity=100)";
    position:relative;
    transition: all 0.2s linear;
}
.archiveLink:hover{
    color:#fff;
    opacity: 0.7;
    filter: alpha(opacity=70);
    -ms-filter: "alpha(opacity=70)";
    text-decoration:none;
}

.archiveLink:after{
    font-family: "Font Awesome 5 free";
    content: "\f105";
    font-weight : 900;
    position: absolute;
    top:50%;
    right: 15px;
    transform: translateY(-50%);
    -webkit- transform: translateY(-50%);
}