/* -------------------------------------------------- */

/* canvas */

/* -------------------------------------------------- */

html {
    margin: 0px;
    padding: 0px;
}

body {
    margin: 0px;
    padding: 0px;
    min-width: 237px;
}

/* -------------------------------------------------- */

/* typography */

/* -------------------------------------------------- */

body, input, select, textarea, button {
    font-family: Arial, sans-serif;
    font-size: 14px;
    line-height: 1.42857143;
    color: #000000; /* black */
}

h1 {
    margin: 0px 0px 20px 0px;
    font-size: 14px;
    font-weight: bold;
    color: #000000; /* black */
}

h2 {
    margin: 0px 0px 0px 0px;
    font-size: 14px;
    font-weight: bold;
    color: #000000; /* black */
}

h3 {
    margin: 0px 0px 0px 0px;
    font-size: 14px;
    font-style: italic;
    font-weight: normal;
    color: #000000; /* black */
}

@media print {
    body, input, select, textarea, button {
        font-size: 12px;
        line-height: 1.66666667;
    }
}

/* -------------------------------------------------- */

/* colors */

/* -------------------------------------------------- */

.black {color: #000000; /* black */}
.blue {color: #004899; /* pure blue */}
.cyan-blue-90 {color: #1978bb; /* pure cyan blue 90% */}
.cyan-blue-100 {color: #0069b4; /* pure cyan blue 100% */}
.gray {color: #a0a0a0; /* gray 50% */}
.green {color: #009640; /* pure green */}
.magenta {color: #951b81; /* pure violet magenta */}
.orange {color: #ea5b0c; /* pure red orange */}
.red {color: #e30613; /* pure red */}

/* -------------------------------------------------- */

/* header */

/* -------------------------------------------------- */

.a1 {
    min-height: 100px;
    margin: 0px;
    padding: 0px;
    background-color: #ffffff; /* white */
}

.a1a1 {
    min-height: 100px;
    margin: 0px auto;
    padding: 0px 15px;
}

.a1a1a1 {position: relative;}

.a2 {
    min-height: 40px;
    margin: 0px;
    padding: 0px;
    background-color: #434343; /* gray 85% */
}

.a2a1 {
    min-height: 40px;
    margin: 0px auto;
    padding: 0px 15px;
}

.a2a1a1 {position: relative;}

@media screen and (max-width: 850px) {
    .a1 {}

    .a1a1 {}

    .a1a1a1 {
        max-width: 587px;
        height: 100px;
        margin: 0px auto;
        padding: 0px;
    }

    .a2 {}

    .a2a1 {}

    .a2a1a1 {
        max-width: 587px;
        height: 40px;
        margin: 0px auto;
        padding: 0px;
    }
}

@media screen and (min-width: 851px) {
    .a1 {}

    .a1a1 {}

    .a1a1a1 {
        height: 100px;
        margin: 0px;
        padding: 0px;
    }

    .a2 {}

    .a2a1 {}

    .a2a1a1 {
        height: 40px;
        margin: 0px;
        padding: 0px;
    }
}

@media screen and (min-width: 1231px) {
    .a1 {}

    .a1a1 {max-width: 1184px;}

    .a1a1a1 {}

    .a2 {}

    .a2a1 {max-width: 1184px;}

    .a2a1a1 {}
}

@media print {
    .a1 {display: none;}

    .a1a1 {}

    .a1a1a1 {}

    .a2 {display: none;}

    .a2a1 {}

    .a2a1a1 {}
}

/* -------------------------------------------------- */

/* content */

/* -------------------------------------------------- */

.a3 {
    min-height: 600px;
    margin: 0px;
    padding: 0px;
    background-color: #eeeeee; /* gray 10% */
}

.a3a1 {
    min-height: 580px;
    margin: 0px auto;
    padding: 10px 15px;
}

.a3a1a1, .a3a1a2 {
    background-color: #ffffff; /* white */
    border-style: solid;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
    border-radius: 10px;
}

.a3a1b1, .a3a1b2, .a3a1b3 {
    background-color: #ffffff; /* white */
    border-style: solid;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
    border-radius: 10px;
}

.a3a1c1, .a3a1c2, .a3a1c3, .a3a1c4, .a3a1c5 {
    background-color: #ffffff; /* white */
    border-style: solid;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
    border-radius: 10px;
}

@media screen and (max-width: 850px) {
    .a3 {}

    .a3a1 {}

    .a3a1a1 {
        max-width: 555px;
        min-height: 68px;
        margin: 0px auto 10px auto;
        padding: 15px;
    }

    .a3a1a2 {
        max-width: 555px;
        min-height: 548px;
        margin: 0px auto;
        padding: 15px;
    }

    .a3a1b1 {
        max-width: 555px;
        min-height: 68px;
        margin: 0px auto 10px auto;
        padding: 15px;
    }

    .a3a1b2 {
        max-width: 555px;
        min-height: 30px;
        margin: 0px auto 10px auto;
        padding: 15px;
    }

    .a3a1b3 {
        max-width: 555px;
        min-height: 476px;
        margin: 0px auto;
        padding: 15px;
    }

    .a3a1c1 {display: none;}

    .a3a1c2 {
        max-width: 555px;
        min-height: 68px;
        margin: 0px auto 10px auto;
        padding: 15px;
    }

    .a3a1c3 {
        max-width: 555px;
        min-height: 143px;
        margin: 0px auto 10px auto;
        padding: 15px;
    }

    .a3a1c4 {
        max-width: 555px;
        min-height: 30px;
        margin: 0px auto 10px auto;
        padding: 15px;
    }

    .a3a1c5 {
        max-width: 555px;
        min-height: 291px;
        margin: 0px auto;
        padding: 15px;
    }
}

@media screen and (min-width: 851px) {
    .a3 {}

    .a3a1 {}

    .a3a1a1 {
        float: left;
        width: 175px;
        min-height: 548px;
        margin: 0px 10px 0px 0px;
        padding: 15px;
    }

    .a3a1a2 {
        overflow: hidden;
        min-height: 548px;
        margin: 0px;
        padding: 15px;
    }

    .a3a1b1 {
        float: left;
        width: 175px;
        min-height: 548px;
        margin: 0px 10px 0px 0px;
        padding: 15px;
    }

    .a3a1b2 {
        overflow: hidden;
        min-height: 30px;
        margin: 0px 0px 10px 0px;
        padding: 15px;
    }

    .a3a1b3 {
        overflow: hidden;
        min-height: 476px;
        margin: 0px;
        padding: 15px;
    }

    .a3a1c1 {
        min-height: 266px;
        margin: 0px 0px 10px 0px;
        padding: 15px;
    }

    .a3a1c2 {
        float: left;
        width: 175px;
        min-height: 548px;
        margin: 0px 10px 0px 0px;
        padding: 15px;
    }

    .a3a1c3 {display: none;}

    .a3a1c4 {
        overflow: hidden;
        min-height: 30px;
        margin: 0px 0px 10px 0px;
        padding: 15px;
    }

    .a3a1c5 {
        overflow: hidden;
        min-height: 476px;
        margin: 0px;
        padding: 15px;
    }
}

@media screen and (min-width: 1231px) {
    .a3 {}

    .a3a1 {max-width: 1184px;}

    .a3a1a1 {}

    .a3a1a2 {}

    .a3a1b1 {}

    .a3a1b2 {}

    .a3a1b3 {}

    .a3a1c1 {}

    .a3a1c2 {}

    .a3a1c3 {}

    .a3a1c4 {}

    .a3a1c5 {}
}

@media print {
    .a3 {}

    .a3a1 {}

    .a3a1a1 {}

    .a3a1a2 {}

    .a3a1b1 {}

    .a3a1b2 {}

    .a3a1b3 {}

    .a3a1c1 {}

    .a3a1c2 {}

    .a3a1c3 {}

    .a3a1c4 {}

    .a3a1c5 {}
}

/* -------------------------------------------------- */

/* footer */

/* -------------------------------------------------- */

.a4 {
    min-height: 200px;
    margin: 0px;
    padding: 0px;
    background-color: #434343; /* gray 85% */
}

.a4a1 {
    min-height: 200px;
    margin: 0px auto;
    padding: 0px 15px;
}

.a4a1a1 {}

.a5 {
    min-height: 40px;
    margin: 0px;
    padding: 0px;
    background-color: #b5b5b5; /* gray 40% */
}

.a5a1 {
    min-height: 40px;
    margin: 0px auto;
    padding: 0px 15px;
}

.a5a1a1 {}

@media screen and (max-width: 850px) {
    .a4 {}

    .a4a1 {}

    .a4a1a1 {}

    .a5 {}

    .a5a1 {}

    .a5a1a1 {}
}

@media screen and (min-width: 851px) {
    .a4 {}

    .a4a1 {}

    .a4a1a1 {}

    .a5 {}

    .a5a1 {}

    .a5a1a1 {}
}

@media screen and (min-width: 1231px) {
    .a4 {}

    .a4a1 {max-width: 1184px;}

    .a4a1a1 {}

    .a5 {}

    .a5a1 {max-width: 1184px;}

    .a5a1a1 {}
}

@media print {
    .a4 {display: none;}

    .a4a1 {}

    .a4a1a1 {}

    .a5 {display: none;}

    .a5a1 {}

    .a5a1a1 {}
}

/* -------------------------------------------------- */

/* blocks */

/* -------------------------------------------------- */

.b1 {
    position: relative;
    height: 100px;
    margin: 0px;
    padding: 0px;
}

.b1a1 {
    position: relative;
    top: 50%;
    left: 0px;
    max-width: 268px;
    margin: 0px 58px 0px 0px;
    padding: 0px;
    transform: translate(0px,-50%);
}

.b1b1 {
    position: relative;
    top: 50%;
    left: 0px;
    max-width: 268px;
    margin: 0px;
    padding: 0px;
    transform: translate(0px,-50%);
}

.b2 {
    position: absolute;
    top: 15px;
    right: 0px;
    width: 58px;
    height: 59px;
    margin: 0px;
    padding: 0px;
}

.b2a1 {
    position: absolute;
    top: 11px;
    right: 0px;
    width: 48px;
    height: 48px;
    margin: 0px;
    padding: 0px;
}

.b2a2 {
    position: absolute;
    top: 0px;
    left: 0px;
    min-width: 20px;
    height: 20px;
    margin: 0px;
    padding: 5px;
    text-align: center;
    background-color: #eeeeee; /* gray 10% */
    border-radius: 15px;
    display: inline-block;
}

.b3 {
    width: 24px;
    height: 24px;
    padding: 8px 0px;
    margin: 0px;
}

.b3a1 {}

.b3b1 {}

.b3 .b3a1 ul, .b3 .b3b1 ul {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
}

.b3 .b3a1 ul li, .b3 .b3b1 ul li {
    float: left;
    width: 24px;
    height: 24px;
    padding: 0px;
}

.b4 {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 63px;
    height: 24px;
    padding: 8px 0px;
    margin: 0px;
}

.b4 ul {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
}

.b4 ul li {
    float: left;
    width: 24px;
    height: 24px;
    padding: 0px 15px 0px 0px;
}

.b4 ul li:last-of-type {padding: 0px;}

.b5 {
    position: relative;
    overflow: hidden;
    height: 266px;
    margin: 0px;
    padding: 0px;
    border-style: none;
    border-radius: 5px;
}

.b5 img {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: 0px -50% 0px 0px;
    transform: translate(-50%,-50%);
}

.b6 {
    position: relative;
    overflow: hidden;
    height: 143px;
    margin: 0px;
    padding: 0px;
    border-style: none;
    border-radius: 5px;
}

.b6 img {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: 0px -50% 0px 0px;
    transform: translate(-50%,-50%);
}

@media screen and (max-width: 850px) {
    .b1 {}

    .b1a1 {}

    .b1b1 {}

    .b2 {}

    .b2a1 {}

    .b2a2 {}

    .b3 {}

    .b3a1 {display: none;}

    .b3b1 {}

    .b4 {}

    .b5 {}

    .b6 {}
}

@media screen and (min-width: 851px) {
    .b1 {}

    .b1a1 {}

    .b1b1 {}

    .b2 {}

    .b2a1 {}

    .b2a2 {}

    .b3 {}

    .b3a1 {}

    .b3b1 {display: none}

    .b4 {}

    .b5 {}

    .b6 {}
}

@media screen and (min-width: 1231px) {
    .b1 {}

    .b1a1 {}

    .b1b1 {}

    .b2 {}

    .b2a1 {}

    .b2a2 {}

    .b3 {}

    .b3a1 {}

    .b3b1 {}

    .b4 {}

    .b5 {}

    .b6 {}
}

@media print {
    .b1 {}

    .b1a1 {}

    .b1b1 {}

    .b2 {}

    .b2a1 {}

    .b2a2 {}

    .b3 {}

    .b3a1 {}

    .b3b1 {}

    .b4 {}

    .b5 {}

    .b6 {}
}

/* -------------------------------------------------- */

.c1 {}

.c1a1 {
    min-height: 20px;
    margin: 0px;
    padding: 0px;
}

.c1a2 {
    min-height: 20px;
    margin: 0px;
    padding: 10px 0px 0px 0px;
}

.c1a3 {
    min-height: 20px;
    margin: 0px;
    padding: 10px 0px;
}

.c1a4 {
    min-height: 20px;
    margin: 0px;
    padding: 0px 0px 10px 0px;
}

.c1a5 {
    min-height: 20px;
    margin: 0px;
    padding: 10px 0px;
    border-style: solid none none none;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
}

.c1a6 {
    min-height: 20px;
    margin: 0px;
    padding: 10px 0px;
    border-style: solid none;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
}

.c1a7 {
    min-height: 20px;
    margin: 0px;
    padding: 10px 0px;
    border-style: none none solid none;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
}

/* -------------------------------------------------- */

.d1 {
    margin: 0px 0px 0px -15px;
    font-size: 0px;
}

.d1a1, .d1a2, .d1a3, .d1a4 {
    box-sizing: border-box;
    width: 100%;
    min-height: 20px;
    margin: 0px;
    padding: 0px 0px 0px 15px;
    vertical-align: top;
    font-size: 14px;
}

.d2 {
    margin: -10px 0px 0px -15px;
    font-size: 0px;
}

.d2a1, .d2a2, .d2a3, .d2a4 {
    box-sizing: border-box;
    width: 100%;
    min-height: 30px;
    margin: 0px;
    padding: 10px 0px 0px 15px;
    vertical-align: top;
    font-size: 14px;
}

.d3 {
    margin: -15px 0px 0px -15px;
    font-size: 0px;
}

.d3a1, .d3a2, .d3a3, .d3a4 {
    box-sizing: border-box;
    width: 100%;
    min-height: 35px;
    margin: 0px;
    padding: 15px 0px 0px 15px;
    vertical-align: top;
    font-size: 14px;
}

@media screen and (max-width: 443px) {
    .d1 {}

    .d1a1 {max-width: 100%;}

    .d1a2 {max-width: 100%;}

    .d1a3 {max-width: 100%;}

    .d1a4 {max-width: 100%;}

    .d2 {}

    .d2a1 {max-width: 100%;}

    .d2a2 {max-width: 100%;}

    .d2a3 {max-width: 100%;}

    .d2a4 {max-width: 100%;}

    .d3 {}

    .d3a1 {max-width: 100%;}

    .d3a2 {max-width: 100%;}

    .d3a3 {max-width: 100%;}

    .d3a4 {max-width: 100%;}
}

@media screen and (min-width: 444px) {
    .d1 {}

    .d1a1 {max-width: 190px;}

    .d1a2 {max-width: 380px;}

    .d1a3 {max-width: 570px;}

    .d1a4 {max-width: 100%;}

    .d2 {}

    .d2a1 {max-width: 190px;}

    .d2a2 {max-width: 380px;}

    .d2a3 {max-width: 570px;}

    .d2a4 {max-width: 100%;}

    .d3 {}

    .d3a1 {max-width: 190px;}

    .d3a2 {max-width: 380px;}

    .d3a3 {max-width: 570px;}

    .d3a4 {max-width: 100%;}
}

@media print {
    .d1 {}

    .d1a1 {max-width: 190px;}

    .d1a2 {max-width: 380px;}

    .d1a3 {max-width: 570px;}

    .d1a4 {max-width: 100%;}

    .d2 {}

    .d2a1 {max-width: 190px;}

    .d2a2 {max-width: 380px;}

    .d2a3 {max-width: 570px;}

    .d2a4 {max-width: 100%;}

    .d3 {}

    .d3a1 {max-width: 190px;}

    .d3a2 {max-width: 380px;}

    .d3a3 {max-width: 570px;}

    .d3a4 {max-width: 100%;}
}

/* -------------------------------------------------- */

.e1 {}

.e1a1 {
    float: left;
    width: 30px;
    height: 20px;
    margin: 0px;
    padding: 0px;
}

.e1a2 {overflow: hidden;}

@media screen and (max-width: 443px) {
    .e1 {}

    .e1a1 {}

    .e1a2 {}
}

@media screen and (min-width: 444px) {
    .e1 {}

    .e1a1 {}

    .e1a2 {}
}

@media print {
    .e1 {}

    .e1a1 {}

    .e1a2 {}
}

/* -------------------------------------------------- */

.f1 {
    margin: -10px 0px 0px -15px;
    font-size: 0px;
}

.f1a1 {
    box-sizing: border-box;
    width: 95px;
    min-height: 30px;
    margin: 0px;
    padding: 10px 0px 0px 15px;
    vertical-align: top;
    font-size: 14px;
}

.f2 {
    margin: -15px 0px 0px -15px;
    font-size: 0px;
}

.f2a1 {
    box-sizing: border-box;
    width: 95px;
    min-height: 35px;
    margin: 0px;
    padding: 15px 0px 0px 15px;
    vertical-align: top;
    font-size: 14px;
}

@media screen and (max-width: 443px) {
    .f1 {}

    .f1a1 {}

    .f2 {}

    .f2a1 {}
}

@media screen and (min-width: 444px) {
    .f1 {}

    .f1a1 {}

    .f2 {}

    .f2a1 {}
}

@media print {
    .f1 {}

    .f1a1 {}

    .f2 {}

    .f2a1 {}
}

/* -------------------------------------------------- */

.g1 {
    margin: -5px 0px 0px -5px;
    font-size: 0px;
}

.g1a1 {
    box-sizing: border-box;
    min-height: 25px;
    margin: 0px;
    padding: 5px 0px 0px 5px;
    vertical-align: top;
    font-size: 14px;
    display: inline-block;
}

@media screen and (max-width: 443px) {
    .g1 {}

    .g1a1 {width: 100%;}
}

@media screen and (min-width: 444px) {
    .g1 {}

    .g1a1 {}
}

@media print {
    .g1 {display: none;}

    .g1a1 {}
}

/* -------------------------------------------------- */

.h1 {}

.h1a1 {
    box-sizing: border-box;
    width: 100%;
    min-height: 60px;
    margin: 0px;
    padding: 19px 4px 19px 4px;
    text-align: center;
    background-color: #eeeeee; /* gray 10% */
    border-style: solid;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
    border-radius: 5px;
}

.h2 {}

.h2a1 {
    box-sizing: border-box;
    width: 100%;
    height: 175px;
    margin: 0px;
    padding: 4px;
    background-color: #ffffff; /* white */
    border-style: solid;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
    border-radius: 5px 5px 0px 0px;
}

.h2a2 {
    box-sizing: border-box;
    width: 100%;
    min-height: 37px;
    margin: 0px;
    padding: 8px 4px 8px 4px;
    text-align: center;
    background-color: #eeeeee; /* gray 10% */
    border-style: none solid solid solid;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
    border-radius: 0px 0px 5px 5px;
}

.h3 {}

.h3a1 {
    box-sizing: border-box;
    width: 100%;
    height: 175px;
    margin: 0px;
    padding: 4px;
    background-color: #ffffff; /* white */
    border-style: solid;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
    border-radius: 5px 5px 0px 0px;
}

.h3a2 {
    box-sizing: border-box;
    width: 100%;
    min-height: 52px;
    margin: 0px;
    padding: 8px 4px 4px 4px;
    background-color: #eeeeee; /* gray 10% */
    border-style: none solid none solid;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
    border-radius: 0px;
}

.h3a3 {
    box-sizing: border-box;
    width: 100%;
    min-height: 39px;
    margin: 0px;
    padding: 4px;
    text-align: center;
    background-color: #eeeeee; /* gray 10% */
    border-style: none solid solid solid;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
    border-radius: 0px 0px 5px 5px;
}

@media screen and (max-width: 443px) {
    .h1 {}

    .h1a1 {max-width: 100%;}

    .h2 {}

    .h2a1 {max-width: 100%;}

    .h2a2 {max-width: 100%;}

    .h3 {}

    .h3a1 {max-width: 100%;}

    .h3a2 {max-width: 100%;}

    .h3a3 {max-width: 100%;}
}

@media screen and (min-width: 444px) {
    .h1 {}

    .h1a1 {max-width: 175px;}

    .h2 {}

    .h2a1 {max-width: 175px;}

    .h2a2 {max-width: 175px;}

    .h3 {}

    .h3a1 {max-width: 175px;}

    .h3a2 {max-width: 175px;}

    .h3a3 {max-width: 175px;}
}

@media print {
    .h1 {}

    .h1a1 {max-width: 175px;}

    .h2 {}

    .h2a1 {max-width: 175px;}

    .h2a2 {max-width: 175px;}

    .h3 {}

    .h3a1 {max-width: 175px;}

    .h3a2 {max-width: 175px;}

    .h3a3 {max-width: 175px;}
}

/* -------------------------------------------------- */

.i1 {
    position: relative;
    width: 165px;
    height: 165px;
    margin: 0px auto;
    padding: 0px;
}

.i1a1 {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: 0px -50% 0px 0px;
    transform: translate(-50%,-50%);
}

.i1a1 img {
    max-width: 165px;
    max-height: 165px;
}

/* -------------------------------------------------- */

/* form elements */

/* -------------------------------------------------- */

.arrow-down {
    position: absolute;
    top: 11px;
    right: 8px;
    width: 0px;
    height: 0px;
    margin: 0px;
    padding: 0px;
    border-style: solid solid none solid;
    border-width: 7px 5px 0px 5px;
    border-color: #000000 transparent; /* black transparent */
    pointer-events: none;
}

button.lnk1 {
    margin: 0px;
    padding: 0px;
    text-align: left;
    background: none;
    border-style: none;
    outline: none;
    cursor: pointer;
}

button.btn1 {
    box-sizing: border-box;
    height: 30px;
    margin: 0px;
    padding: 4px 15px;
    text-align: center;
    white-space: nowrap;
    background-color: #ffffff; /* white */
    border-style: solid;
    border-width: 1px;
    border-color: #b5b5b5; /* gray 40% */
    border-radius: 5px;
    touch-action: manipulation;
    outline-style: none;
}

button.btn1:hover {
    background-color: #eeeeee; /* gray 10% */
    border-color: #b5b5b5; /* gray 40% */
}

button.btn2 {
    box-sizing: border-box;
    height: 30px;
    margin: 0px;
    padding: 4px 15px;
    color: #ffffff; /* white */
    text-align: center;
    white-space: nowrap;
    background-color: #1978bb; /* pure cyan blue 90% */
    border-style: solid;
    border-width: 1px;
    border-color: #0069b4; /* pure cyan blue */
    border-radius: 5px;
    touch-action: manipulation;
    outline-style: none;
}

button.btn2:hover {
    background-color: #0069b4; /* pure cyan blue */
    border-color: #0069b4; /* pure cyan blue */
}

.css-select {position: relative;}

input[type="text"],
input[type="search"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="date"],
input[type="number"] {
    box-sizing: border-box;
    width: 100%;
    height: 30px;
    margin: 0px;
    padding: 3px 4px;
    background-color: #eeeeee; /* gray 10% */
    border-style: solid;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
    border-radius: 5px;
    outline-style: none;
    display: block;
}

input[type="text"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="date"]:focus,
input[type="number"]:focus {
    border-color: #b5b5b5; /* gray 40% */
}

input[type="checkbox"],
input[type="radio"] {
    display: block;
}

select {
    box-sizing: border-box;
    width: 100%;
    height: 30px;
    margin: 0px;
    padding: 3px 24px 3px 4px;
    background-color: #eeeeee; /* gray 10% */
    border-style: solid;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
    border-radius: 5px;
    outline-style: none;
    display: block;
}

select:focus {border-color: #b5b5b5; /* gray 40% */}

textarea {
    box-sizing: border-box;
    width: 100%;
    height: 200px;
    margin: 0px;
    padding: 2px;
    background-color: #eeeeee; /* gray 10% */
    border-style: solid;
    border-width: 1px;
    border-color: #dcdcdc; /* gray 20% */
    border-radius: 5px;
    outline-style: none;
    display: block;
}

textarea:focus {border-color: #b5b5b5; /* gray 40% */}

@media screen and (max-width: 443px) {
    button.btn1 {width: 100%;}

    button.btn2 {width: 100%;}
}

@media screen and (min-width: 444px) {
    button.btn1 {}

    button.btn2 {}
}

/* -------------------------------------------------- */

/* miscellaneous */

/* -------------------------------------------------- */

.clear::after {
    content: "";
    display: table;
    clear: both;
}

img {display: block;}

.inline {display: inline-block;}

.lg {font-size: 21px;}

.line-through {
    color: #a0a0a0; /* gray 50% */
    text-decoration: line-through;
}

p {
    margin: 0px;
    padding: 0px;
}

/* -------------------------------------------------- */

/* experimental */

/* -------------------------------------------------- */

body {-webkit-text-size-adjust: 100%;}

.b1a1 {
    -moz-transform: translate(0px,-50%);
    -ms-transform: translate(0px,-50%);
    -o-transform: translate(0px,-50%);
    -webkit-transform: translate(0px,-50%);
}

.b1b1 {
    -moz-transform: translate(0px,-50%);
    -ms-transform: translate(0px,-50%);
    -o-transform: translate(0px,-50%);
    -webkit-transform: translate(0px,-50%);
}

.b5 img {
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
}

.b6 img {
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
}

button.btn1 {-ms-touch-action: manipulation;}

button.btn2 {-ms-touch-action: manipulation;}

.i1a1 {
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
}

input[type="text"],
input[type="search"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="date"],
input[type="number"] {
    -webkit-appearance: none;
}

select {
    -moz-appearance: none;
    -webkit-appearance: none;
}

select::-ms-expand {display: none;}

textarea {-webkit-appearance: none;}

/* -------------------------------------------------- */