@charset "UTF-8#;

/*すべてのWEBページに適用される。*/
    
/*ページ全体のフォントの種類を指定する。*/
    html{
        font-family:sans-serif;
}
/*ボックスモデルを変更する。*/
html*{
    box-sizing: border-box;
}
body{
    /*ページ全体を中央に配置する。*/
    margin: 0 0 0 0;
    background-color: #eeece9;
    .wrapper{
        margin: 0 auto 0 auto;
        max-width: 960px;
    }
}
/*見出しのテキスト色・フォントサイズを変える。*/
h2{
    color: #3f5170;
    font-size: 22px;
/*h2にドットの下線部を引く*/
/* border-bottom: 3px dotted #3f51740; */
/*h2のマージン、パディングを設定する。*/
    margin-top: 20px;
    margin-right: 0px;
    margin-bottom: 20px;
    margin-left: 0px;
    padding-top: 5px;
    padding-right: 5px;
    padding-bottom: 5px;
    padding-left: 5px;
}
/*pタグの行間を調整する。*/
p{
    line-height: 1.6;
}
/* リンクのテキスト色の変更 */
a:link{
color:#3f5170;
text-decoration:none;
}

a:visited{
color:#d25833;
}

a:hover{
    color:#1496a0;    
    text-decoration:none;
}

/*全てのページに適用　ヘッダー*/
.logo{
    margin: 50px 0 40px 0;
    line-height: 0;
    text-align: center;
}

/*イラストのマージンおよびテキストの回り込み*/
.illust{
    margin: 15px 0 0 0;
    float:right;
    padding: 0 1em 1em 1em;
}

/*イメージのマージンおよびテキストの回り込み*/
.imager{
    margin: 15px 0 0 0;
    float: right;
    padding: 0 1em 1em 1em;
}

.imagel{
    margin: 15px 0 0 0;
    float: left;
    padding: 0 1em 1em 1em;
}
.clear{
    clear: both;
    text-align: right;
}

/*メインリストの大きさを変化させる。*/
.main-nav{
    display: flex;
    flex-direction: column;    
}
.main-nav :hover{
    color: #1496a0;
    transform: scale(1.15);
    transform-origin: left;
}

/*リストの（・）を消す。*/
ul{
    padding-left: 0;
    }
li{
    list-style: none;
}


/*全てのページに適用　フッター*/
.footer{
    /*フッターの画像を適用させない
    background-image: url(../images/footer-bg.png);
    background-repeat: no-repeat;
    margin-top: 30px;
    padding: 80px 15px 20px 15px;*/
    
    font-size: 12px;
    color: #3f5170;
}
/*フッターナビを中央に配置する。*/
.footer-nav{
    display:flex;
    list-style-type: none;
    justify-content:center;
    gap:50px;    

    font-size:1.7rem;
    list-style:none;
}
/*フッターナビの大きさを変化させる*/
.footer-nav a:active{
    color:#3f5170;
    text-decoration:none;
}

.footer-nav a:link{
    color:#3f5170;
    text-decoration:none;
}

.footer-nav a:hover{
    color:#1496a0;
    text-decoration:none;
}

.footer-nav :hover {
    transform: scale(1.4);
    text-decoration:none;
}