@charset "UTF-8";

html,body {
    color: #252525;
    font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, osaka, sans-serif;
}

.block {
    margin: 0 auto;
    padding: 14% 7%;
    max-width: 750px;
    line-height: 1.8;
}
h1 {
    margin: 0 auto 10%;
    font-size: 5vw;
    font-weight: bold;
    text-align: center;
}
.rulesList {
    margin: 0 auto 10%;
}
.rulesList>li {
    margin: 0 auto 1em;
    padding-left: 1em;
    font-size: 4vw;
    text-indent: -1em;
}
.txt {
    margin: 0 auto 18%;
    font-size: 3.6vw;
}
.checkbox {
    margin: 0 auto 14%;
    font-size: 3.6vw;
    text-align: center;
}
.checkbox input {
    margin-top: -1px;
    margin-right: 1em;
    width: 20px;
    height: 20px;
    vertical-align: middle;
}
.imgList {
    margin: 0 auto 10%;
    width: 80%;
}
.imgList>li {
    margin: 0 auto 8%;
}
.imgList>li .txt {
    margin: 0 auto 2%;
    font-size: 4vw;
    text-align: center;
}
.imgList>li .img {
    margin: 0 auto;
}
.attentionList {
    margin: 0 auto 10%;
}
.attentionList>li {
    margin: 0 auto 1em;
    padding-left: 1em;
    font-size: 3.6vw;
    text-indent: -1em;
}
.btn {
    margin: 0 auto 4%;
    width: 90%;
}
.btn a {
    padding: 4% 1% 5%;
    color: #d9d9d9;
    font-size: 4vw;
    text-align: center;
    background: #fff;
    border: solid 1px #d9d9d9;
    border-radius: 50vw;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    pointer-events: none;
}
.btn a.agree {
    color: #000;
    background: #fee600;
    border: solid 1px #fee600;
    pointer-events: painted;
}

@media only screen and (min-width:800px){
    .block {
        margin: 0 auto;
        padding: 100px 30px;
    }
    h1 {
        margin: 0 auto 50px;
        font-size: 30px;
    }
    .rulesList {
        margin: 0 auto 40px;
    }
    .rulesList li {
        font-size: 16px;
    }
    .txt {
        margin: 0 auto 60px;
        font-size: 16px;
    }
    .checkbox {
        margin: 0 auto 50px;
        font-size: 16px;
    }
    .checkbox input {
        margin-top: -1px;
        margin-right: 1em;
        width: 30px;
        height: 30px;
        vertical-align: middle;
    }
    .imgList {
        margin: 0 auto 50px;
        width: auto;
    }
    .imgList>li {
        margin: 0;
        padding: 0 3%;
        width: 33.333%;
        display: inline-block;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    .imgList>li .txt {
        margin: 0 auto 20px;
        font-size: 16px;
    }
    .attentionList {
        margin: 0 auto 40px;
    }
    .attentionList>li {
        font-size: 16px;
    }
    .btn {
        margin: 0 auto 20px;
        width: 400px;
    }
    .btn a {
        padding: 15px 10px;
        font-size: 20px;
    }
}