@charset "utf-8";
body{
    font-family: "メイリオ", sans-serif;
    transition: all 2s;

}
.dot{
    background-image: url("/check/common/img/back__inner.png");
    background-size: 80%;
    background-repeat: round;
}
.bodyfadeout {
    opacity: 0;
}
a{
    color: #000;
}
.f-l{
    float: left;
    margin-left: 5%;
}
.f-r{
    float: right;
    margin-right: 5%;
    margin-bottom: 15%;
}

.clear{
    clear: both;
}
.green{
    background: rgb(0, 212, 113);
    }
    .blue{
    background: rgb(0, 201, 201);
    width: 110%!important;
    }
    .pink{
    background: #FF8D56;
    }
@media screen and (max-width:321px){
    .heartbeat {
        -webkit-animation: heartbeat 8s;
        animation: heartbeat 8s;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
    }
    @keyframes heartbeat
{
    0%, 20%, 40%, 60%, 80%, 100%
    {
        transform: scale(1);
    }
    10%, 30%, 50%, 70%, 90%
    {
        transform: scale(1.15);
    }
}
@-webkit-keyframes heartbeat
{
    0%, 20%, 40%, 60%, 80%, 100%
    {
        -webkit-transform: scale(1);
    }
    10%, 30%, 50%, 70%, 90%
    {
        -webkit-transform: scale(1.15);
    }
}
    .f-l{
        float: left;
        margin-left: 4%;
    }
    .f-r{
        float: right;
        margin-right: 4%;
        margin-bottom: 15%;
    }
    .s-radio-box img {
        width: 125px!important;
        height: 85px!important;
        margin: 0 auto;
    }
    .input-item img {
        width: 130px!important;
        height: 85px!important;
    }
    #m1:checked ~ label .border, #m2:checked ~ label .border, #m3:checked ~ label .border, #m4:checked ~ label .border, #m5:checked ~ label .border, #m6:checked ~ label .border {
        box-sizing: border-box;
        width: 130px!important;
        height: 85px!important;
        border: 4px solid #F63876;
        border-radius: 10px;
        z-index: 5;
    }
    .location-contents img {
        width: 250px!important;
        height: 95px!important;
        margin: 0 auto;
    }
    #venue:checked ~ label .border, #store:checked ~ label .border {
        box-sizing: border-box;
        width: 250px!important;
        height: 95px!important;
        border: 4px solid #F63876;
        border-radius: 10px;
    }
    input[type="button"] {
        font-family: "メイリオ", sans-serif;
        font-weight: 700;
        display: inline-block;
        font-size: 24px;
        text-decoration: none;
        background: #F63876;
        color: #FFF;
        width: 100px!important;
        height: 100px!important;
        line-height: 100px!important;
        border-radius: 50%;
        text-align: center;
        overflow: hidden;
        transition: .4s;
        border: none;
        -webkit-appearance: none;
    }
    .search-result {
        margin-bottom: 30px;
        font-size: 14px;
    }
    button {
        font-family: "メイリオ", sans-serif;
        font-size: 16px!important;
        font-weight: 700;
        display: inline-block;
        font-size: 14px;
        text-decoration: none;
        background: #F63876;
        color: #FFF;
        width: 100px!important;
        height: 100px!important;
        border-radius: 50%;
        text-align: center;
        overflow: hidden;
        box-shadow: 0px 0px 0px 5px #F63876;
        transition: .4s;
        border: solid 2px #FFF;
        -webkit-appearance: none;
    }

    .result h2 {
        font-size: 1.2em!important;
        font-weight: 500;
    }
    .s-result-btn img {
        width: 50%!important;
        margin: 0 auto;
    }
    .star-line:nth-of-type(2) .star:nth-of-type(2) {
        position: absolute;
        top: -70%;
        right: -85%!important;
    }
    .s-search-btn img {
        width: 40%!important;
        margin: 0 25%!important;
    }
    .s-top {

        height: 506px!important;
    }
    .point{
        font-size: 11.2px!important;
    }


}
@media screen and (max-width:375px){
    .heartbeat {
        -webkit-animation: heartbeat 8s;
        animation: heartbeat 8s;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
    }
    @keyframes heartbeat
{
    0%, 20%, 40%, 60%, 80%, 100%
    {
        transform: scale(1);
    }
    10%, 30%, 50%, 70%, 90%
    {
        transform: scale(1.15);
    }
}
@-webkit-keyframes heartbeat
{
    0%, 20%, 40%, 60%, 80%, 100%
    {
        -webkit-transform: scale(1);
    }
    10%, 30%, 50%, 70%, 90%
    {
        -webkit-transform: scale(1.15);
    }
}
    .pc{
        display: none;
    }
h2{
    font-size: 1.5em;
    font-weight: 500;

}

.result h2{
font-size: 1.3em;
    font-weight: 500;
}
.pink-border{
    width: 68%;
    margin: 0 auto;
    margin-bottom: 2%;
    border: none;
    border-bottom: 2px #f63876 dashed;
}
.pink-border-l{
    width: 82%;
    margin: 0 auto;
    margin-bottom: 2%;
    border: none;
    border-bottom: 2px #f63876 dashed;
}
.pink-border-l-l{
    width: 68%;
    margin: 0 auto;
    margin-bottom: 2%;
    border: none;
    border-bottom: 2px #f63876 dashed;
}
.back{
    background-image: url("/check/common/img/smartp.png");
    background-size: 30%;
    background-repeat: no-repeat;
    background-position: bottom;
    background-position-x: 98%;
    background-position-y: 90%;
}
.back-point{
    background-image: url("/check/common/img/smartp.png");
    background-size: 30%;
    background-repeat: no-repeat;
    background-position: bottom;
    background-position-x: 98%;
    background-position-y: 90%;
}
.back-point-l{
    background-image: url("/check/common/img/smartp.png");
    background-size: 30%;
    background-repeat: no-repeat;
    background-position: bottom;
    background-position-x: 98%;
    background-position-y: 90%;
}
.back__inner-w{
    padding-top: 5%;
    background-color: #FFF;
    margin:15px;
    border-radius: 10px;
}
.single-heading{
    text-align: center;
    margin-bottom: 5%;
}
.s-header{
    position: relative;
    width: 100%;
    height: 50px;
    background-color: #FFF;
}
.s-header h1{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
}
.s-header img{
    width: 60%;
    margin: 0 auto;
}
.s-contents{
    position: relative;
    width: 100%;
    padding-bottom: 15%;


}
.s-top{
    background-image: url("/check/common/img/back_image.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #FFF;
    position: relative;
    width: 100%;
    height: 594px;

}
.s-footer{
    width: 100%;
    height: 10%;
    position: absolute;
    display: flex;
    bottom: 0%;

}
.footer-logo img{
    width: 60%;
    margin: 0 auto;
}
.s-search-btn{
    position: absolute;
    left: 10%;
    bottom: 30%;
}
.s-search-btn img{
    width: 50%;
    margin: 0 auto;
}
.star-line{
    position: absolute;
    display: flex;
}
.star-line:nth-of-type(1){
    left: 5%;
    bottom: 190%;
}
.star img{
    width: 50%;
}
.star-line:nth-of-type(1) .star:nth-of-type(2){
    position: absolute;
    top: 37%;
    right: -100%;
}
.star-line:nth-of-type(2){
    right: 12%;
    bottom: 160%;
}
.star-line:nth-of-type(2) .star:nth-of-type(2){
    position: absolute;
    top: -70%;
    right: -100%;
}
footer{
    padding: 0;
    text-align: center;
    background-color: #FFF;
    width: 100%;
}
.footer-section{
    padding: 0;
    padding-top: 50px;
    color: #999;
    text-align: left;
    background-color: #FFF;
}
footer ul.clearfix{
    font-size: 11px;
    text-align: center;

}
footer ul.clearfix:nth-of-type(2){
    margin: 0 auto 20px;
}
footer ul li{
    display: inline;
    line-height: 2em;
}
.footer-logo{
    margin-bottom: 20px;
}
.foot-line {
    line-height: 1.5em;
    font-size: 10px;
    color: #999;
}


/* sex-age */

.star-heading{
    background-image: url("/check/common/img/star.png");
    background-repeat: no-repeat;
    background-size: 11%;
    background-position-y: 10%;
    background-position-x: 5%;
    height: 50px;
}
.star-heading-p{
    background-image: url("/check/common/img/star.png");
    background-repeat: no-repeat;
    background-size: 8%;
    background-position-y: 10%;
    background-position-x: 1%;
    height: 50px;
}
.s-heading{
    text-align: center;
    margin-bottom: 10%;
}
.s-radio-heading{
    text-align: center;
    margin-bottom: 2%;
}
input[type="radio"] {
    display:none;
}
/* .s-radio-box{
    display: flex;
    justify-content: space-around;
    margin-bottom: 15%;
} */
.s-radio-box img{
    width: 145px;
    height: 100px;
    margin: 0 auto;
}

.age{
    position: relative;
    margin: 10%;
    width: 80%;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
input[type="number"] {
    -moz-appearance:textfield;
}
input[type="number"] {
width: 80%;
margin: 0 10%;
text-align: center;
border-top: none;
border-left: none;
border-right: none;
border-bottom: 4px solid #FF8BB1;
border-radius: 0;
}
.label-age{
    position: absolute;
    right: 10%;
    bottom: 10%;
}

.s-btn-line{
    display: flex;
    position: relative;
    justify-content: space-around;
}
.s-btn-line img{
    width: 17%;
}
input[type="button"] {
    font-family: "メイリオ", sans-serif;
    font-weight: 700;
    display: inline-block;
    font-size: 24px;
    text-decoration: none;
    background: #F63876;
    color: #FFF;
    width: 120px;
    height: 120px;
    line-height: 120px;
    border-radius: 50%;
    text-align: center;
    overflow: hidden;
    transition: .4s;
    border: none;
    -webkit-appearance: none;
}
input[type="button"][disabled]{
    background: #FF8BB1;
    cursor: default;
}
.s-btn-line img{
    position: absolute;
    bottom: 0;

}

/* step1 */
.prog{
    margin-bottom: 5%;
}
.prog img{
    width: 50%;
    margin: 0 auto;
}
.red{
    color: #FF8BB1;
}
input[type="checkbox"] {
display: none;
}
.s-contents-line{
    margin: 0 auto;
    width: 92%;
    display:flex;
    justify-content: space-around;
    margin-bottom: 7%;
}
.input-item img{
    width: 145px;
    height: 90px;
}

/* step2 */
.location-contents{
    margin-bottom: 10%;
}

.location-contents img{
    width: 305px;
    height: 110px;
    margin: 0 auto;
}

/* checkbox */
/* #woman:checked ~ label .border{
    box-sizing: border-box;
    width: 145px;
    height:100px;
    border: 4px solid #F63876;
    border-radius: 8px;
}
#man:checked ~ label .border
{
box-sizing: border-box;
width: 145px;
height:100px;
border: 4px solid #F63876;
border-radius: 8px;
} */
.s-radio-box input[type="radio"]:checked + label img {
    width: 145px;
height:100px;
border: 4px solid #F63876;
    box-sizing: border-box;
    border-radius: 8px;
  }


#venue:checked ~ label .border,
#store:checked ~ label .border
{
    box-sizing: border-box;
width: 305px;
height:110px;
border: 4px solid #F63876;
border-radius: 10px;
}


#m1:checked ~ label .border,
#m2:checked ~ label .border,
#m3:checked ~ label .border,
#m4:checked ~ label .border,
#m5:checked ~ label .border,
#m6:checked ~ label .border {
    box-sizing: border-box;
    width: 145px;
    height:90px;
    border: 4px solid #F63876;
    border-radius: 10px;
    z-index: 5;
    }

#checkbox_control .input_item {
    box-sizing: border-box;
    list-style-type: none;
    font-size: 21px;
    margin: 0 0 22px 0;
}

#checkbox_control .input_item input[type="checkbox"]{
    box-sizing: border-box;
    width: 25px;
    height: 25px;
    margin: -4px 5px 0 0;
    vertical-align: middle;
}

#checkbox_control .input_item label{
    box-sizing: border-box;
    display:inline-block;
    vertical-align:middle;
    line-height: 20px;
}

#checkbox_control .input_item .locked{
    box-sizing: border-box;
    opacity: 0.75;
    color: #aaa;
}
.toppuff
{
    -webkit-animation: puff 1s;
            animation: puff 1s;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
}
@keyframes puff
{
    0%
    {
        transform: none;
    }
    100%
    {
        transform: scale(1.5);

        opacity: 0;
    }
}
@-webkit-keyframes puff
{
    0%
    {
        -webkit-transform: none;
    }
    100%
    {
        -webkit-transform: scale(1.5);

        opacity: 0;
    }
}
/* 次へボタンのCSS */
.puff
{
    -webkit-animation: puff 1s;
            animation: puff 1s;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
}
@keyframes puff
{
    0%
    {
        transform: none;
    }
    100%
    {
        transform: scale(1.5);

        opacity: 0;
    }
}
@-webkit-keyframes puff
{
    0%
    {
        -webkit-transform: none;
    }
    100%
    {
        -webkit-transform: scale(1.5);

        opacity: 0;
    }
}



/* result.html */
.point{
    width: 100%;
    box-sizing: border-box;
    font-size: 13.3px;
    padding: 10px 10px;
    border-radius: 25px;
    color: #FFF;
}
.point-line{
    display: flex;
    width: 80%;
    margin: 0 auto;
    margin-top: 7%;
    justify-content: space-between;
    align-items: center;
}
.point-li{
    display: flex;
    width: 80%;
    margin: 0 auto;
    margin-top: 7%;
    justify-content: space-between;
    align-items: center;
}
.point-box{
display: flex;
justify-content: space-around;
align-items: baseline;
width: 70%;
text-align: center;
}
.point-box .point:nth-of-type(2){
margin-left: 6%;
    }
.location-point-box{
    width: 30%;
    margin-right: 40%;
    text-align: center;
}
.point-box__inner{
    width: 70%;

}
.point-box__inner .point{
    margin-bottom: 5%;
    text-align: center;
}
.point-box__inner .point:nth-of-type(2){
    margin-bottom: 0;
}
.point-heading{
    font-size: 18px;
    color: #666;
}

.point-content{
    display: inline-block;
    vertical-align: middle;
}
button {
    font-family: "メイリオ", sans-serif;
    font-weight: 700;
    display: inline-block;
    font-size: 18px;
    text-decoration: none;
    background: #F63876;
    color: #FFF;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    text-align: center;
    overflow: hidden;
    box-shadow: 0px 0px 0px 5px #F63876;
    transition: .4s;
    border: solid 2px #FFF;
    -webkit-appearance: none;
}

button a{
    text-decoration: none;
}
.search-result{
    margin-bottom: 50px;
}







}
@media screen and (min-width:376px) and ( max-width:414px){
    .heartbeat {
        -webkit-animation: heartbeat 8s;
        animation: heartbeat 8s;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
    }
    @keyframes heartbeat
{
    0%, 20%, 40%, 60%, 80%, 100%
    {
        transform: scale(1);
    }
    10%, 30%, 50%, 70%, 90%
    {
        transform: scale(1.15);
    }
}
@-webkit-keyframes heartbeat
{
    0%, 20%, 40%, 60%, 80%, 100%
    {
        -webkit-transform: scale(1);
    }
    10%, 30%, 50%, 70%, 90%
    {
        -webkit-transform: scale(1.15);
    }
}
    .pc{
        display: none;
    }
    .f-l{
        float: left;
        margin-left: 7%;
    }
    .f-r{
        float: right;
        margin-right: 7%;
    }
    h2{
        font-size: 1.5em;
        font-weight: 500;
    }
    .pink-border{
        width: 58%;
        margin: 0 auto;
        margin-bottom: 2%;
        border: none;
        border-bottom: 2px #f63876 dashed;
    }
    .pink-border-l{
        width: 70%;
        margin: 0 auto;
        margin-bottom: 2%;
        border: none;
        border-bottom: 2px #f63876 dashed;
    }
    .pink-border-l-l{
        width: 64%;
        margin: 0 auto;
        margin-bottom: 2%;
        border: none;
        border-bottom: 2px #f63876 dashed;
    }
    .s-header{
        position: relative;
        width: 100%;
        height: 50px;
        background-color: #FFF;
    }
    .s-header h1{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
    }
    .back__inner-w{
        padding-top: 5%;
        background-color: #FFF;
        margin:15px;
        border-radius: 10px;
    }
    .back{
        background-image: url("/check/common/img/smartp.png");
        background-size: 30%;
        background-repeat: no-repeat;
        background-position: bottom;
        background-position-x: 98%;
        background-position-y: 90%;
    }
    .back-point{
        background-image: url("/check/common/img/smartp.png");
        background-size: 30%;
        background-repeat: no-repeat;
        background-position: bottom;
        background-position-x: 98%;
        background-position-y: 90%;
    }
    .back-point-l{
        background-image: url("/check/common/img/smartp.png");
        background-size: 30%;
        background-repeat: no-repeat;
        background-position: bottom;
        background-position-x: 97%;
        background-position-y: 90%;
    }
    .s-header img{
        width: 60%;
        margin: 0 auto;
    }
    .s-contents{
        position: relative;
        width: 100%;
        padding-bottom: 15%;
    }
    .s-top{
        background-image: url("/check/common/img/back_image.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-color: #FFF;
        position: relative;
        width: 100%;
        height: 655px;

    }
    .s-footer{
        width: 100%;
        height: 10%;
        position: absolute;
        display: flex;
        bottom: 0%;

    }
    .s-search-btn{
        position: absolute;
        left: 14%;
        bottom: 30%;
    }
    .s-search-btn img{
    width: 50%;
    margin: 0 auto;
    }
    .star-line{
        position: absolute;
        display: flex;
    }
    .star img{
        width: 50%;
    }
    .star-line:nth-of-type(1){
        left: 5%;
        bottom: 190%;
    }
    .star-line:nth-of-type(1) .star:nth-of-type(2){
        position: absolute;
        top: 37%;
        right: -100%;
    }
    .star-line:nth-of-type(2){
        right: 12%;
        bottom: 160%;
    }
    .star-line:nth-of-type(2) .star:nth-of-type(2){
        position: absolute;
        top: -70%;
        right: -100%;
    }
    footer{
        padding: 0;
        text-align: center;
        background-color: #FFF;
        width: 100%;
    }
    .footer-section{
        margin: 0px 20px;
        padding: 0;
        padding-top: 50px;
        color: #999;
        text-align: left;
    }
    footer ul.clearfix{
        font-size: 11px;
        text-align: center;

    }
    footer ul.clearfix:nth-of-type(2){
        margin: 0 auto 20px;
    }
    footer ul li{
        display: inline;
        line-height: 2em;
    }
    .footer-logo{
        margin-bottom: 20px;
    }
    .footer-logo img{
        width: 60%;
        margin: 0 auto;
    }
    .foot-line {
        line-height: 1.5em;
        font-size: 10px;
        color: #999;
    }

    /* sex-age */
    .star-heading{
        background-image: url("/check/common/img/star.png");
        background-repeat: no-repeat;
        background-size: 11%;
        background-position-y: 10%;
        background-position-x: 5%;
        height: 50px;
    }
    .star-heading-p{
        background-image: url("/check/common/img/star.png");
        background-repeat: no-repeat;
        background-size: 9%;
        background-position-y: 10%;
        background-position-x: 4%;
        height: 50px;
    }
    .s-heading{
        text-align: center;
        margin-bottom: 10%;
    }
    .single-heading{
        text-align: center;
        margin-bottom: 5%;
    }
    .s-radio-heading{
        text-align: center;
        margin-bottom: 5%;
    }
    input[type="radio"] {
        display:none;
    }
    .s-radio-box{
        display: flex;
        justify-content: space-around;
        margin-bottom: 15%;
    }
    .s-radio-box img{
        width: 145px;
        height: 100px;
    }
    .age{
        position: relative;
        margin: 10%;
        width: 80%;
    }
    input[type="number"]::-webkit-outer-spin-button,
    input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
    }
    input[type="number"] {
        -moz-appearance:textfield;
    }
    input[type="number"] {
    width: 80%;
    margin: 0 10%;
    text-align: center;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 4px solid #FF8BB1;
    border-radius: 0;
    }
    .label-age{
        position: absolute;
        right: 10%;
        bottom: 10%;
    }

    .s-btn-line{
        display: flex;
        position: relative;
        justify-content: space-around;
    }

    .s-btn-line img{
        width: 17%;
    }
    input[type="button"] {
        font-family: "メイリオ", sans-serif;
        font-weight: 700;
        display: inline-block;
        font-size: 24px;
        text-decoration: none;
        background: #F63876;
        color: #FFF;
        width: 120px;
        height: 120px;
        line-height: 120px;
        border-radius: 50%;
        text-align: center;
        overflow: hidden;
        transition: .4s;
        border: none;
        -webkit-appearance: none;
    }
    input[type="button"][disabled]{
        background: #FF8BB1;
        cursor: default;
    }
    .s-btn-line img{
        position: absolute;
        bottom: 0;
    }
    /* step1 */
    .prog{
        margin-bottom: 5%;
    }
    .prog img{
        width: 50%;
        margin: 0 auto;
    }
    .red{
        color: #FF8BB1;
    }
    input[type="checkbox"] {
    display: none;
    }
    .s-contents-line{
        margin: 0 auto;
        width: 92%;
        display:flex;
        justify-content: space-around;
        margin-bottom: 7%;;
    }
    .input-item img{
        width: 145px;
        height: 90px;
    }

    /* step2 */
    .location-contents{
        margin-bottom: 10%;
    }

    .location-contents img{
        width: 305px;
        height: 110px;
        margin: 0 auto;
    }

    /* checkbox */
    #man:checked ~ label .border,
    #woman:checked ~ label .border
    {
        box-sizing: border-box;
    width: 145px;
    height:100px;
    border: 4px solid #F63876;
    border-radius: 8px;
    }
    #venue:checked ~ label .border,
    #store:checked ~ label .border
    {
        box-sizing: border-box;
    width: 305px;
    height:110px;
    border: 4px solid #F63876;
    border-radius: 10px;
    }

    #m1:checked ~ label .border,
    #m2:checked ~ label .border,
    #m3:checked ~ label .border,
    #m4:checked ~ label .border,
    #m5:checked ~ label .border,
    #m6:checked ~ label .border {
        box-sizing: border-box;
        width: 145px;
        height:90px;
        border: 4px solid #F63876;
        border-radius: 8px;
        z-index: 5;
        }

    #checkbox_control .input_item {
        box-sizing: border-box;
        list-style-type: none;
        font-size: 21px;
        margin: 0 0 22px 0;
    }

    #checkbox_control .input_item input[type="checkbox"]{
        box-sizing: border-box;
        width: 25px;
        height: 25px;
        margin: -4px 5px 0 0;
        vertical-align: middle;
    }

    #checkbox_control .input_item label{
        box-sizing: border-box;
        display:inline-block;
        vertical-align:middle;
        line-height: 20px;
    }

    #checkbox_control .input_item .locked{
        box-sizing: border-box;
        opacity: 0.75;
        color: #aaa;
    }
    .dot{
        background-image: url("/check/common/img/back__inner.png");
        background-size: 100%;
        background-repeat: round;
    }
    
/* 次へボタンのCSS */
.puff
{
    -webkit-animation: puff 1s;
            animation: puff 1s;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
}
@keyframes puff
{
    0%
    {
        transform: none;
    }
    100%
    {
        transform: scale(1.5);

        opacity: 0;
    }
}
@-webkit-keyframes puff
{
    0%
    {
        -webkit-transform: none;
    }
    100%
    {
        -webkit-transform: scale(1.5);

        opacity: 0;
    }
}
.top-puff
{
    -webkit-animation: puff 1s;
            animation: puff 1s;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
}
@keyframes puff
{
    0%
    {
        transform: none;
    }
    100%
    {
        transform: scale(1.5);

        opacity: 0;
    }
}
@-webkit-keyframes puff
{
    0%
    {
        -webkit-transform: none;
    }
    100%
    {
        -webkit-transform: scale(1.5);

        opacity: 0;
    }
}



/* result.html */
.point{
    width: 100%;
    box-sizing: border-box;
    font-size: 15px;
    padding: 10px 10px;
    border-radius: 25px;
    color: #FFF;
}
.point-line{
    display: flex;
    width: 80%;
    margin: 0 auto;
    margin-top: 7%;
    justify-content: space-between;
    align-items: center;
}
.point-li{
    display: flex;
    width: 80%;
    margin: 0 auto;
    margin-top: 7%;
    justify-content: space-between;
    align-items: center;
}
.point-box{
display: flex;
justify-content: space-around;
align-items: baseline;
width: 70%;
text-align: center;
}
.point-box .point:nth-of-type(2){
margin-left: 6%;
    }
.location-point-box{
    width: 30%;
    margin-right: 40%;
    text-align: center;
}
.point-box__inner{
    width: 70%;

}
.point-box__inner .point{
    margin-bottom: 5%;
    text-align: center;
}
.point-box__inner .point:nth-of-type(2){
    margin-bottom: 0;
}
.point-heading{
    font-size: 18px;
    color: #666;
}

.point-content{
    display: inline-block;
    vertical-align: middle;
}
button {
    font-family: "メイリオ", sans-serif;
    font-weight: 700;
    display: inline-block;
    font-size: 18px;
    text-decoration: none;
    background: #F63876;
    color: #FFF;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    text-align: center;
    overflow: hidden;
    box-shadow: 0px 0px 0px 5px #F63876;
    transition: .4s;
    border: solid 2px #FFF;
    -webkit-appearance: none;
}
button a{
    text-decoration: none;
}
.search-result{
    margin-bottom: 50px;
}










}
@media screen and (min-width:415px) and ( max-width:480px){
    .heartbeat {
        -webkit-animation: heartbeat 8s;
        animation: heartbeat 8s;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
    }
    @keyframes heartbeat
{
    0%, 20%, 40%, 60%, 80%, 100%
    {
        transform: scale(1);
    }
    10%, 30%, 50%, 70%, 90%
    {
        transform: scale(1.15);
    }
}
@-webkit-keyframes heartbeat
{
    0%, 20%, 40%, 60%, 80%, 100%
    {
        -webkit-transform: scale(1);
    }
    10%, 30%, 50%, 70%, 90%
    {
        -webkit-transform: scale(1.15);
    }
}
    .pc{
        display: none;
    }
    h2{
        font-size: 1.5em;
        font-weight: 500;
    }
    .pink-border{
        width: 58%;
        margin: 0 auto;
        margin-bottom: 2%;
        border: none;
        border-bottom: 2px #f63876 dashed;
    }
    .pink-border-l{
        width: 70%;
        margin: 0 auto;
        margin-bottom: 2%;
        border: none;
        border-bottom: 2px #f63876 dashed;
    }
    .pink-border-l-l{
        width: 64%;
        margin: 0 auto;
        margin-bottom: 2%;
        border: none;
        border-bottom: 2px #f63876 dashed;
    }
    .s-header{
        position: relative;
        width: 100%;
        height: 50px;
        background-color: #FFF;
    }
    .s-header h1{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
    }
    .back__inner-w{
        padding-top: 5%;
        background-color: #FFF;
        margin:15px;
        border-radius: 10px;
    }
    .back{
        background-image: url("/check/common/img/smartp.png");
        background-size: 30%;
        background-repeat: no-repeat;
        background-position: bottom;
        background-position-x: 98%;
        background-position-y: 70%;
    }
    .back-point{
        background-image: url("/check/common/img/smartp.png");
        background-size: 30%;
        background-repeat: no-repeat;
        background-position: bottom;
        background-position-x: 98%;
        background-position-y: 87%;
    }
    .back-point-l{
        background-image: url("/check/common/img/smartp.png");
        background-size: 30%;
        background-repeat: no-repeat;
        background-position: bottom;
        background-position-x: 97%;
        background-position-y: 75%;
    }
    .s-header img{
        width: 60%;
        margin: 0 auto;
    }
    .s-contents{
        position: relative;
        width: 100%;
        height: 655px;
    }
    .s-top{
        background-image: url("/check/common/img/back_image.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-color: #FFF;
        position: relative;
        width: 100%;
        height: 680px;

    }
    .s-footer{
        width: 100%;
        height: 10%;
        position: absolute;
        display: flex;
        bottom: 0%;

    }
    .s-search-btn{
        position: absolute;
        left: 14%;
        bottom: 30%;
    }
    .s-search-btn img{
    width: 50%;
    margin: 0 auto;
    }
    .star-line{
        position: absolute;
        display: flex;
    }
    .star img{
        width: 50%;
    }
    .star-line:nth-of-type(1){
        left: 5%;
        bottom: 190%;
    }
    .star-line:nth-of-type(1) .star:nth-of-type(2){
        position: absolute;
        top: 37%;
        right: -100%;
    }
    .star-line:nth-of-type(2){
        right: 12%;
        bottom: 160%;
    }
    .star-line:nth-of-type(2) .star:nth-of-type(2){
        position: absolute;
        top: -70%;
        right: -100%;
    }
    footer{
        padding: 0;
        text-align: center;
        background-color: #FFF;
        width: 100%;
    }
    .footer-section{
        margin: 0px 20px;
        padding: 0;
        padding-top: 50px;
        color: #999;
        text-align: left;
    }
    footer ul.clearfix{
        font-size: 11px;
        text-align: center;

    }
    footer ul.clearfix:nth-of-type(2){
        margin: 0 auto 20px;
    }
    footer ul li{
        display: inline;
        line-height: 2em;
    }
    .footer-logo{
        margin-bottom: 20px;
    }
    .footer-logo img{
        width: 60%;
        margin: 0 auto;
    }
    .foot-line {
        line-height: 1.5em;
        font-size: 10px;
        color: #999;
    }
    .f-l {
        float: left;
        margin-left: 7%;
        margin-bottom: 15%;
    }
    .f-r {
        float: right;
        margin-right: 7%;
        margin-bottom: 15%;
    }
    /* sex-age */
    .star-heading{
        background-image: url("/check/common/img/star.png");
        background-repeat: no-repeat;
        background-size: 11%;
        background-position-y: 10%;
        background-position-x: 5%;
        height: 50px;
    }
    .star-heading-p{
        background-image: url("/check/common/img/star.png");
        background-repeat: no-repeat;
        background-size: 9%;
        background-position-y: 10%;
        background-position-x: 4%;
        height: 50px;
    }
    .s-heading{
        text-align: center;
        margin-bottom: 10%;
    }
    .single-heading{
        text-align: center;
        margin-bottom: 5%;
    }
    .s-radio-heading{
        text-align: center;
        margin-bottom: 5%;
    }
    input[type="radio"] {
        display:none;
    }
    .s-radio-box{
        display: flex;
        justify-content: space-around;
        margin-bottom: 15%;
    }
    .s-radio-box img{
        width: 145px;
        height: 100px;
    }
    .age{
        position: relative;
        margin: 10%;
        width: 80%;
    }
    input[type="number"]::-webkit-outer-spin-button,
    input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
    }
    input[type="number"] {
        -moz-appearance:textfield;
    }
    input[type="number"] {
    width: 80%;
    margin: 0 10%;
    text-align: center;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 4px solid #FF8BB1;
    border-radius: 0;
    }
    .label-age{
        position: absolute;
        right: 10%;
        bottom: 10%;
    }

    .s-btn-line{
        display: flex;
        position: relative;
        justify-content: space-around;
    }

    .s-btn-line img{
        width: 17%;
    }
    input[type="button"] {
        font-family: "メイリオ", sans-serif;
        font-weight: 700;
        display: inline-block;
        font-size: 24px;
        text-decoration: none;
        background: #F63876;
        color: #FFF;
        width: 120px;
        height: 120px;
        line-height: 120px;
        border-radius: 50%;
        text-align: center;
        overflow: hidden;
        transition: .4s;
        border: none;
        -webkit-appearance: none;
    }
    input[type="button"][disabled]{
        background: #FF8BB1;
        cursor: default;
    }
    .s-btn-line img{
        position: absolute;
        bottom: 0;
    }
    /* step1 */
    .prog{
        margin-bottom: 5%;
    }
    .prog img{
        width: 50%;
        margin: 0 auto;
    }
    .red{
        color: #FF8BB1;
    }
    input[type="checkbox"] {
    display: none;
    }
    .s-contents-line{
        margin: 0 auto;
        width: 92%;
        display:flex;
        justify-content: space-around;
        margin-bottom: 7%;;
    }
    .input-item img{
        width: 145px;
        height: 90px;
    }

    /* step2 */
    .location-contents{
        margin-bottom: 10%;
    }

    .location-contents img{
        width: 305px;
        height: 110px;
        margin: 0 auto;
    }

    /* checkbox */
    #man:checked ~ label .border,
    #woman:checked ~ label .border
    {
        box-sizing: border-box;
    width: 145px;
    height:100px;
    border: 4px solid #F63876;
    border-radius: 8px;
    }
    #venue:checked ~ label .border,
    #store:checked ~ label .border
    {
        box-sizing: border-box;
    width: 305px;
    height:110px;
    border: 4px solid #F63876;
    border-radius: 10px;
    }

    #m1:checked ~ label .border,
    #m2:checked ~ label .border,
    #m3:checked ~ label .border,
    #m4:checked ~ label .border,
    #m5:checked ~ label .border,
    #m6:checked ~ label .border {
        box-sizing: border-box;
        width: 145px;
        height:90px;
        border: 4px solid #F63876;
        border-radius: 8px;
        z-index: 5;
        }

    #checkbox_control .input_item {
        box-sizing: border-box;
        list-style-type: none;
        font-size: 21px;
        margin: 0 0 22px 0;
    }

    #checkbox_control .input_item input[type="checkbox"]{
        box-sizing: border-box;
        width: 25px;
        height: 25px;
        margin: -4px 5px 0 0;
        vertical-align: middle;
    }

    #checkbox_control .input_item label{
        box-sizing: border-box;
        display:inline-block;
        vertical-align:middle;
        line-height: 20px;
    }

    #checkbox_control .input_item .locked{
        box-sizing: border-box;
        opacity: 0.75;
        color: #aaa;
    }
    .dot{
        background-image: url("/check/common/img/back__inner.png");
        background-size: 100%;
        background-repeat: round;
    }
    
/* 次へボタンのCSS */
.puff
{
    -webkit-animation: puff 1s;
            animation: puff 1s;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
}
@keyframes puff
{
    0%
    {
        transform: none;
    }
    100%
    {
        transform: scale(1.5);

        opacity: 0;
    }
}
@-webkit-keyframes puff
{
    0%
    {
        -webkit-transform: none;
    }
    100%
    {
        -webkit-transform: scale(1.5);

        opacity: 0;
    }
}
.top-puff
{
    -webkit-animation: puff 1s;
            animation: puff 1s;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
}
@keyframes puff
{
    0%
    {
        transform: none;
    }
    100%
    {
        transform: scale(1.5);

        opacity: 0;
    }
}
@-webkit-keyframes puff
{
    0%
    {
        -webkit-transform: none;
    }
    100%
    {
        -webkit-transform: scale(1.5);

        opacity: 0;
    }
}




/* result.html */
.point{
    width: 100%;
    box-sizing: border-box;
    font-size: 15px;
    padding: 10px 10px;
    border-radius: 25px;
    color: #FFF;
}
.point-line{
    display: flex;
    width: 80%;
    margin: 0 auto;
    margin-top: 7%;
    justify-content: space-between;
    align-items: center;
}
.point-li{
    display: flex;
    width: 80%;
    margin: 0 auto;
    margin-top: 7%;
    justify-content: space-between;
    align-items: center;
}
.point-box{
display: flex;
justify-content: space-around;
align-items: baseline;
width: 70%;
text-align: center;
}
.point-box .point:nth-of-type(2){
margin-left: 6%;
    }
.location-point-box{
    width: 30%;
    margin-right: 40%;
    text-align: center;
}
.point-box__inner{
    width: 70%;

}
.point-box__inner .point{
    margin-bottom: 5%;
    text-align: center;
}
.point-box__inner .point:nth-of-type(2){
    margin-bottom: 0;
}
.point-heading{
    font-size: 18px;
    color: #666;
}

.point-content{
    display: inline-block;
    vertical-align: middle;
}
button {
    font-family: "メイリオ", sans-serif;
    font-weight: 700;
    display: inline-block;
    font-size: 18px;
    text-decoration: none;
    background: #F63876;
    color: #FFF;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    text-align: center;
    overflow: hidden;
    box-shadow: 0px 0px 0px 5px #F63876;
    transition: .4s;
    border: solid 2px #FFF;
    -webkit-appearance: none;
}
button a{
    text-decoration: none;
}
.search-result{
    margin-bottom: 50px;
}




}

@media screen and (min-width:481px){
    .f-r {
        float: right;
        margin-right: 10%;
        margin-bottom: 15%;
    }
    .f-l {
        float: left;
        margin-left: 10%;
        margin-bottom: 15%;
    }
    .sp{
        display: none;
    }
    .s-header{
        position: relative;
        width: 100%;
        height: 50px;
        background-color: #FFF;
    }
    .pink-border{
        width: 60%;
        margin: 0 auto;
        margin-bottom: 2%;
        border: none;
        border-bottom: 2px #f63876 dashed;
    }
    .pink-border-l{
        width: 74%;
        margin: 0 auto;
        margin-bottom: 2%;
        border: none;
        border-bottom: 2px #f63876 dashed;
    }
    .pink-border-l-l{
        width: 60%;
        margin: 0 auto;
        margin-bottom: 2%;
        border: none;
        border-bottom: 2px #f63876 dashed;
    }
    .s-header h1{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
    }
    .s-header h1 img{
        width: 40%;
        margin: 0 auto;
    }
    .back__inner-w{
        padding: 3% 0 5% 0;
        max-width: 400px;
        background-color: #FFF;
        margin: 2% auto;
        border-radius: 10px;
        background-image: url("/check/common/img/smartp.png");
        background-size: 25%;
        background-repeat: no-repeat;
        background-position: bottom;
        background-position-x: 90%;
        background-position-y: 90%;
    }
    .s-contents{
        position: relative;
        margin: 0 auto;
        width: 100%;
        max-width: 400px;
    }
    .s-top{
    background-image: url("/check/common/img/pc_back.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-color: #FFF;
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 66.6666666667%;
}
    .s-footer{
        width: 100%;
        height: 10%;
        position: absolute;
        display: flex;
        bottom: 30%;
    }
    .s-search-btn{
        position: absolute;
        left: 50%;
        top: 80%;
        transform: translateY(-50%) translateX(-50%);
    }
    .s-search-word{
        position: absolute;
        left: 50%;
        top: 0%;
        transform: translateY(-115%) translateX(-50%);
    }
    .s-search-btn img:nth-of-type(1){
        width: 80%;
        transform: translateY(25%) translateX(12%);
    }
    .s-search-btn img:nth-of-type(2){
        width: 25%;
        margin: 0 auto;
        transform: translateY(0%) translateX(0%);
    }
    .heartbeat
{
    -webkit-animation: heartbeat 8s;
            animation: heartbeat 8s;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
}
@keyframes heartbeat
{
    0%, 20%, 40%, 60%, 80%, 100%
    {
        transform: scale(1);
    }
    10%, 30%, 50%, 70%, 90%
    {
        transform: scale(1.15);
    }
}
@-webkit-keyframes heartbeat
{
    0%, 20%, 40%, 60%, 80%, 100%
    {
        -webkit-transform: scale(1);
    }
    10%, 30%, 50%, 70%, 90%
    {
        -webkit-transform: scale(1.15);
    }
}

    .star-line{
display: none;
    }

    .star{
        display: none;
    }
    footer{
        text-align: center;
        background-color: #fff;
        padding: 5% 0 0;
        width: 100%;
    }
    .footer-section{
    margin: 0 auto;
    padding: 0;
    color: #999;
    text-align: left;
    font-size: 12px;
    display: inline-block;
    }
    footer ul.clearfix{
        font-size: 8px;
        text-align: center;

    }
    footer ul.clearfix:nth-of-type(2){
        margin: 0 auto 35px;
    }
    footer ul li{
        display: inline;
    line-height: 2em;
    }
    .footer-logo{
        margin-bottom: 35px;
    }
    .footer-logo img {
        width: 50%;
        margin: 0 auto;
    }
    .foot-line {
        line-height: 1.5em;
        font-size: 6px;
        color: #999;
    }

/* sex-age */
.form{
    margin-top: 10%;
}
.star-heading{
    background-image: url("/check/common/img/star.png");
    background-repeat: no-repeat;
    background-size: 11%;
    background-position-y: 10%;
    background-position-x: 5%;
    height: 50px;
}
.s-heading{
    text-align: center;
    margin-bottom: 10%;
}
.single-heading{
    text-align: center;
    margin-bottom: 5%;
}
.s-radio-heading{
    text-align: center;
    margin-bottom: 10%;
}
.star-heading-p{
    background-image: url("/check/common/img/star.png");
    background-repeat: no-repeat;
    background-size:11%;
    background-position-y: 10%;
    background-position-x: 1%;
    height: 50px;
}
input[type="radio"] {
    display:none;
}
.s-radio-box{
    display: flex;
    justify-content: space-around;
    margin-bottom: 15%;
}
.s-radio-box img{
    pointer-events: none;
    width: 145px;
    height: 100px;
}
label{
    display: inline-block;
}

.age{
    position: relative;
    margin: 10%;
    width: 80%;
}
.label-age{
    position: absolute;
    right: 10%;
    bottom: 10%;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
input[type="number"] {
    -moz-appearance:textfield;
}
input[type="number"] {
    width: 80%;
    margin: 0 10%;
    text-align: center;
border-top: none;
border-left: none;
border-right: none;
border-bottom: 4px solid #FF8BB1;
border-radius: 0;
}

.s-btn-line{
    display: flex;
    position: relative;
    justify-content: space-around;
}
.s-btn-line img{
    width: 17%;
}
input[type="button"] {
    font-family: "メイリオ", sans-serif;
    font-weight: 700;
    display: inline-block;
    font-size: 24px;
    text-decoration: none;
    background: #F63876;
    color: #FFF;
    width: 100px;
    height: 100px;
    line-height: 100px;
    border-radius: 50%;
    text-align: center;
    overflow: hidden;
    transition: .4s;
    border: none;
    -webkit-appearance: none;
}
input[type="button"][disabled]{
    background: #FF8BB1;
    cursor: default;
}
.s-btn-line img{
    position: absolute;
    bottom: 0;

}

/* step1 */
.prog{
    margin-bottom: 5%;
}
.prog img{
    width: 50%;
    margin: 0 auto;
}
.red{
    color: #FF8BB1;
}
input[type="checkbox"] {
display: none;
}
.s-contents-line{
    margin: 0 auto;
    width: 92%;
    display:flex;
    justify-content: space-around;
    margin-bottom: 8%;

}
.input-item img{
    pointer-events: none;
    width: 145px;
    height: 90px;
    margin: 0 auto;
}

/* step2 */
.location-contents{
    text-align: center;
    margin-bottom: 10%;
}

.location-contents img{
    pointer-events: none;
    width: 305px;
    height: 110px;
    margin: 0 auto;
}

/* checkbox */

#man:checked ~ label .border,
#woman:checked ~ label .border
{
    box-sizing: border-box;
width: 145px;
height:100px;
border: 4px solid #F63876;
border-radius: 10px;

}
#venue:checked ~ label .border,
#store:checked ~ label .border
{
box-sizing: border-box;
width: 305px;
height:110px;
border: 4px solid #F63876;
border-radius: 10px;
}


#m1:checked ~ label .border,
#m2:checked ~ label .border,
#m3:checked ~ label .border,
#m4:checked ~ label .border,
#m5:checked ~ label .border,
#m6:checked ~ label .border {
    width: 145px;
    height:90px;
    border: 4px solid #F63876;
    border-radius: 10px;
    z-index: 5;
    }

#checkbox_control .input_item {
    list-style-type: none;
    font-size: 21px;
    margin: 0 0 22px 0;
}

#checkbox_control .input_item input[type="checkbox"]{
    width: 25px;
    height: 25px;
    margin: -4px 5px 0 0;
    vertical-align: middle;
}

#checkbox_control .input_item label{
    display:inline-block;
    vertical-align:middle;
    line-height: 20px;
}

#checkbox_control .input_item .locked{
    opacity: 0.75;
    color: #aaa;
}
.dot{
    background-image: url("/check/common/img/back__inner.png");
    background-size: 33%;
    background-repeat: round;
}
/* 次へボタンのCSS */
.top-puff
{
    -webkit-animation: top-puff 1s;
            animation: top-puff 1s;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
}
@keyframes top-puff
{
0%
{
    transform: translateY(0%) translateX(0%);
}
100%
{
    transform: translateY(0%) translateX(0%) scale(1.5);

    opacity: 0;
}
}
@-webkit-keyframes top-puff
{
0%
{
    -webkit-transform: translateY(-100%) translateX(-50%);
}
100%
{
    -webkit-transform: translateY(-100%) translateX(-50%) scale(1.5);

    opacity: 0;
}
}
/* 次へボタンのCSS */
.puff
{
    -webkit-animation: puff 1s;
            animation: puff 1s;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
}
@keyframes puff
{
    0%
    {
        transform: none;
    }
    100%
    {
        transform: scale(1.5);

        opacity: 0;
    }
}
@-webkit-keyframes puff
{
    0%
    {
        -webkit-transform: none;
    }
    100%
    {
        -webkit-transform: scale(1.5);

        opacity: 0;
    }
}

/* result.html */

.point{
    width: 100%;
    box-sizing: border-box;
    font-size: 15px;
    padding: 10px 10px;
    border-radius: 25px;
    color: #FFF;
}
.point-line{
    display: flex;
    width: 80%;
    margin: 0 auto;
    margin-top: 7%;
    justify-content: space-between;
    align-items: center;
}
.point-li{
    display: flex;
    width: 80%;
    margin: 0 auto;
    margin-top: 7%;
    justify-content: space-between;
    align-items: center;
}
.point-box{
display: flex;
justify-content: space-around;
align-items: baseline;
width: 70%;
text-align: center;
}
.point-box .point:nth-of-type(2){
margin-left: 6%;
    }
.location-point-box{
    width: 30%;
    margin-right: 40%;
    text-align: center;
}
.point-box__inner{
    width: 70%;

}
.point-box__inner .point{
    margin-bottom: 5%;
    text-align: center;
}
.point-box__inner .point:nth-of-type(2){
    margin-bottom: 0;
}
.point-heading{
    font-size: 18px;
    color: #666;
}

.point-content{
    display: inline-block;
    vertical-align: middle;
}
button {
    font-family: "メイリオ", sans-serif;
    font-weight: 700;
    display: inline-block;
    font-size: 20px;
    text-decoration: none;
    background: #F63876;
    color: #FFF;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    text-align: center;
    overflow: hidden;
    box-shadow: 0px 0px 0px 5px #F63876;
    transition: .4s;
    border: solid 2px #FFF;
    -webkit-appearance: none;
}
button a{
    text-decoration: none;
}
.search-result{
    margin-bottom: 50px;
}










}