@charset "utf-8";

/* -------------------------------------------------- */
/*  button
/* -------------------------------------------------- */
.btnOrange {
    display: inline-block;
    color: #e0812f;
    text-decoration: none;
    padding: 0.5em 1em 0.5em 0.75em;
    border: #e0812f 1px solid;
    border-radius: 3px;
}
.btnBlue {
    display: inline-block;
    color: #4658a8;
    text-decoration: none;
    padding: 0.5em 1em 0.5em 0.75em;
    border: #4658a8 1px solid;
    border-radius: 3px;
}
.btnGray {
    display: inline-block;
    color: #555;
    text-decoration: none;
    padding: 0.5em 1em 0.5em 0.75em;
    border: #555 1px solid;
    border-radius: 3px;
}
.btnRed {
    display: inline-block;
    color: #0b4a83;
    text-decoration: none;
    padding: 0.5em 1em 0.5em 0.75em;
    border: #0b4a83 1px solid;
    border-radius: 3px;
}
.btnGreen {
    display: inline-block;
    color: #34bcb3;
    text-decoration: none;
    padding: 0.5em 1em 0.5em 0.75em;
    border: #34bcb3 1px solid;
    border-radius: 3px;
}
.btnRadiusGray {
    display: inline-block;
    color: #fff;
    text-decoration: none;
    padding: 0.5em 1.5em 0.5em 1.25em;
    background: #979797;
    border-radius: 30px;
}
.btnRadiusPink {
    display: inline-block;
    color: #fff;
    text-decoration: none;
    padding: 0.5em 1.5em 0.5em 1.25em;
    background: #e1656f;
    border-radius: 30px;
}
.noIcon {
    padding: 0.5em 1em;
}

/* -------------------------------------------------- */
/*  select
/* -------------------------------------------------- */
select {
    width: calc(100%);
    padding: 0.25em;
    margin: 0;
    font: inherit;
    border-radius: 4px;
    border: 1px solid #ccc;
}
select.half {
    width: 50%;
}
select.year {
    width: 4.5em;
}
select.year2 {
    width: 9em;
}
select.daymonth {
    width: 3.5em;
}

/* -------------------------------------------------- */
/*  input
/* -------------------------------------------------- */
input {
    margin: 0;
}
input[type="text"], input[type="email"], input[type="password"], input[type="button"] {
    width: calc(100% - 2px - 1em);
    padding: 0.4em 0.5em;
    font: inherit;
    border-radius: 4px;
    border: 1px solid #ccc;
}
input[type="button"] {
    text-align: center;
}
input.auto {
    width: auto;
}
input.half {
    width: calc(50% - 2px - 1em);
}
input.coupon {
    width: calc(63% - 2px - 1em);
}
input.name {
    width: calc(40% - 2px - 1em);
}
input.age {
    width: calc(20% - 2px - 1em);
}
input.point {
    width: calc(10% - 2px - 1em);
}
@media screen and (max-width:768px){
    input.point {
        width: calc(20% - 2px - 1em);
    }
}

/* -------------------------------------------------- */
/*  textarea
/* -------------------------------------------------- */
textarea {
    width: calc(100% - 2px - 1em);
    padding: 0.4em 0.5em;
    margin: 0;
    font: inherit;
    border-radius: 4px;
    border: 1px solid #ccc;
}