@charset "utf-8";
/* CSS Document */


*,
*:before,
*:after {box-sizing: inherit;}
html {box-sizing: border-box;}


html,body{margin:0;}
body {
color:#333;
font-size:small; font-family: “ヒラギノ角ゴ Pro W3″,”Hiragino Kaku Gothic Pro W3″,メイリオ,Meiryo,”ＭＳ Ｐゴシック”,sans-serif;
}
a {color:inherit;text-decoration:none;}
img {width:100%;height:auto;}


#wrapper{
width:90%;
margin-left:auto;
margin-right:auto;
max-width:1040px;
}


#contents{
display: flex;
flex-direction: column;
min-height: 100dvh;
}


#header {
width:100%;
height:auto;
border-bottom:4px #d4e352 solid;
}


#footer {
margin-top: auto;/*重要 _下に固定*/
width:100%;
height:25px;
border-top:4px #d4e352 solid; 
}


/*冒頭*/
#begin{
display:flex;
flex-direction:column;
text-align:center;
width:100%;
line-height: 2.0em;
margin-left:auto; 
argin-right:auto;
padding:1%;
padding-bottom:3%;
border-bottom:1px #c9c9cb dashed;
}

#begin h2{
padding-top:0;
font-size:180%;
color:#555;
}

#begin div{
width:auto;
margin-left:auto;
margin-right:auto;
text-align:left;
}


/*ご利用について*/
#guide{
line-height:2.0em;
padding:1%;
padding-bottom:3%;
display: flex;
width:100%;
}

#guide > div{
width:auto;
margin-left:auto;
margin-right:auto;
}

#guide p{
font-weight:bold;
}



.flex-container {
background-color:#f2fff3;
display: flex;
/*column-gap: 20px;子要素間の余白*/
row-gap:50px;/*子要素間の余白*/
/*justify-content: space-between;両端揃え*/
flex-wrap: wrap;/*折り返し*/
/*margin-bottom:3%;*/

border-radius: 8px;
padding:3%;
padding-bottom:6%;
}

.flex-item {
/*flex: 1;*/
color:#dbe9ff;
background-color: #dbe9ff;
height:auto;
text-align:center;
padding-bottom:1%;
padding:0.5%;/**/
margin:0.5%;
width:30%;
border:2px #f1f4f3 solid; 
border-radius: 8px;

transition: 0.5s;/*表示遷移*/
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
}

/*
.flex-item:last-child {
margin-right: 0;最後尾のmarginを取り消し
}
*/

.flex-item:hover {
background-color:#3c8aff;
border:2px #3c8aff solid;
color:#fff;
}

.flex-item:hover span.btn_pdf span{
background-color:#00398e;
}

.flex-item img{
border-bottom:5px #c9c9cb solid; 
box-sizing: border-box;
border-radius: 8px 8px 0px 0px;
}


span.btn_pdf {
display:inline-block;
width:100%;
text-align:center;
position:relative;
font-size:small;
text-align:right;
}


span.btn_pdf span {
color:#fff;
border-radius: 50%;
display:inline-block;
width:15px;
height:15px;
line-height:15px;
text-align:center;
background-color:#3c8aff;

margin-right:3%;
font-size:xx-small;
}

.pc{display:block;}
.sp{display:none;}



/* スマートフォン用 */
@media (max-width: 480px) {

.pc{display:none;}
.sp{display:block;}

#header {margin-bottom:15%;}

.flex-container {display: block; margin-bottom:0;}
.flex-item {width:100%;margin-bottom:25%;}

span.btn_pdf {color:#3c8aff;}
span.btn_pdf span{background-color:#3c8aff;}

#begin{border-bottom:0px;}

}
/* /スマートフォン用 */



/* プリンター用 */
@media print {
}
/* /プリンター用 */