@charset "UTF-8";

*,*::before,*::after {margin:0; padding:0; box-sizing:border-box;}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word;}h1,h2,h3,h4,h5,h6{line-height:1.4;}

:root {
    font-size: 62.5%;
    line-height: 1.6;
    font-family: sans-serif;
    color: #222222;
}
html {background: #021833;}
.pconly {display: block;}
.sponly {display: none;}
a:link, a:active, a:hover, a:visited {color: #DD7700;}
body {
    width:100%;
    margin: 0 auto;
    font-size: 1.4rem;
}
header, main, footer {
    width: 100%;
    margin: 0 auto;
}
header {
    position: relative;
    max-width: 800px;
}
header .pol-rogo {
    position: absolute;
    top: 0.5rem;
    left: 1.5rem;
    width: 10rem;
}
header img {height:auto;}
main {
    max-width: 800px;
    padding: 3rem 4rem;
    /*background: url(./images/top_bg01.gif);*/
    background: #e2e7ec;
}
section {
    background: #ffffff;
    border-radius: 1rem;
    border:1px solid #cccccc;
    margin-bottom: 3rem;
}
section:last-of-type {margin-bottom: 0;}
section h2 {
    padding: 1.5rem 0 1.5rem 3rem;
    background: #1a56a4 url(./images/bg_stripe.png);
    border-radius: 1rem 1rem 0 0;
    display: flex;
    align-items: center;
    gap: 2rem;
    color: #ffffff;
    font-size: 2rem;
}
section h2 p {
    margin-bottom: 0;
    flex: 1;
}
section h2 div {
    margin-left:auto;
    padding: 0.75em 2em;
    background: #eeeeee;
    color: #000000;
    font-size: 1.4rem;
}
section .lead {
    margin-bottom: 2rem;
    padding: 2rem 3rem;
    background: #cedef2;
    color: #333399;
    font-size: 1.6rem;
    font-weight: bold;
}
section h3 {
    margin-top: 5rem;
    margin-bottom: 0.6rem;
    font-size: 1.8rem;
    color: #DD7700;
}
section h3:first-of-type {
    margin-top: 0;
}
.section-body {
    margin-top: 2.5rem;
    padding: 0 3rem 3rem;
}
section figure, section p {margin-bottom: 1.4rem;}
section figure {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 1.25rem;
}
section figure img {
    width: 300px;
    height: auto;
}
section figure p {flex: 1;}
section figure:last-child {margin-bottom:0;}
section img {
    margin: 0 auto;
    border: 1px solid #888888;
}
section ul {list-style-type: none;}
section ul li {
    margin-bottom: 0.5em;
    padding-left: 1em;
    text-indent: -1em;
    line-height: 1.45;
    color: #880000;
}
p.note {
    margin-bottom: 0;
    padding-left: 1em;
    text-indent: -1em;
    line-height: 1.45;
    color: #880000;
}



footer {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1.5rem 0;
    background: #f6f6f6;
    font-size: 1.2rem;
    color: #222222;
}
/* ---------------------------------------------------- */
/* 左右余白の設定
/* ---------------------------------------------------- */
.space_l {padding: 0 4rem;}
.space_m {padding: 0 2rem;}
.space_s {padding: 0 1rem;}
/* ---------------------------------------------------- */
/* 幅の設定
/* ---------------------------------------------------- */
.w100 {width: 100%; height:auto;}
.w80 {width: 80%; height:auto;}
.w70 {width: 70%; height:auto;}
.w60 {width: 60%; height:auto;}
.w50 {width: 50%; height:auto;}



@media only screen and (max-width: 640px) {
    body {font-size: 1.5rem;}
    .pconly {display: none;}
    .sponly {display: block;}
    .space_l {padding: 3rem;}
    .space_m {padding: 2rem;}
    .space_s {padding: 1rem;}
    header .pol-rogo {
        top: 1rem;
        left: 1rem;
        width: 9rem;
    }
    main {padding: 1rem;}
    section h2 div {
        width: 25svw;
        padding: 0.5em 0 0.5em 1em;
    }
    section .lead {
        padding: 2rem 2.5rem;
    }
    .section-body {
        margin-top: 2rem;
        padding: 0 2.5rem 2.5rem;
    }
    section figure {
        flex-direction: column;
        align-items: center;
        gap:1rem;
    }
    section figure img {
        width: 100%;
        max-width: initial;
    }
    section ul li, p.note {
        font-size: 1.35rem;
        line-height:1.6;
    }
    .w80, .w70, .w60, .w50 {width: 100%; height:auto;}
    section:last-of-type {margin-bottom: 2rem;}

}
