@charset "utf-8";

/* ******* 共通 ******* */
html {
    font-family:'Yu Gothic','メイリオ','Meiryo','ＭＳ Ｐゴシック', 'MS PGothic', sans-serif,'ヒラギノ角ゴシック', 'Hiragino Sans', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN';
    letter-spacing:0em;
    -webkit-text-size-adjust: 100%;
    font-size:12pt;
    }
body {
    width:100%;
    background-image:url("../image/common/back.png");
    }
main,header,footer{
    width:900px;
    margin-right:auto;
    margin-left:auto;
    overflow:hidden;
    border-right:1px solid green;
    border-left:1px solid green;
    background-color:white;
}

/* -------------------------------------------*/
/* --header-- */
header{
    position:sticky;
    background-color:white;
    top:0;
    padding-bottom:3px;
    border-bottom:solid gray 1px;
}
header img{
    margin-top:20px;
    margin-left:25px;
    background-color:rgba(255,255,255,0.8);
}

/* ******* main ******* */
main{
    min-height:100vh;
    padding:0;
    text-align:left;
}

/*パンくずリスト*/
ul.path{
    margin-left:1rem;
}
ul.path>li{
    display:inline-block;
}
ul.path>li:before{
    font-family:"FontAwesome";
    content:"\f101";
    margin-right:0.5rem;
    margin-left:0.5rem;
}
ul.path>li:first-of-type:before{
    font-family:"FontAwesome";
    content:"\f015";
}
ul.path:after{
    content:"\a";
    white-space:pre;
}

main div.about,main div.contact{
    display:block;
    width:80%;
    margin:2em 10%;
    border-radius:5px;
    padding:1em;
}
main div.about{
    background-color:rgb(219,223,206);
}

main p{
    display:block;
    font-size:1rem;
    text-align:left;
    text-indent:0.5rem;
}
form{
    margin:5% 10%;
    padding:5% 2%;
    width:80%;
    height:40%;
    background-image:url("../image/common/bcgb04.gif");
    background-color:rgba(255,255,255,0.7);
    border-radius:0.3em;
    text-align:center;
    font-size:1.5rem;
}
input{
    font-size:1em;
    height:20%;
    width:50%;
    margin-top:2%;
    margin-left:5%;
    padding:0.3rem 0;
    border:gray solid 1px;
    border-radius:0.3em;
}

button{
    margin-top:3%;
    padding:0.1rem 1rem;
    font-size:1em;
    border:gray solid 1px;
    border-radius:5px;		
}
div.contact>p{
    text-align:center;
}
main>a{
    display:block;
    width:40%;
    max-width:20rem;
    min-width:16rem;
    font-size:1.1em;
    height:3rem;
    margin:1rem auto;
    line-height:1rem;
    padding-top:1rem;
    text-align:center;
    opacity:1;
    color:black;
}
main a:hover{
    cursor:pointer;
    opacity:0.8;
}