/*---------------------
        override 
-----------------------*/

/* form common.css */
.rl-button {
    width: 470px;
}

@media screen and (min-width: 1921px) {
    .rl-button {
        width: initial;
        min-width: 470px;
    }
}

@media screen and (max-width: 767px) {
    .rl-button {
        max-width: initial;
        width: 100%;
        padding-top: 10px;
        padding-bottom: 10px;
	}
}


/*---------------------
       common 
-----------------------*/
.note { padding-left: 20px; }
.note li { margin: 15px 0; }

.text-uppercase {
    text-transform: uppercase;
} 

.button-wrapper > a {
    margin: 20px;
}

@media screen and (max-width: 767px) {
    .button-wrapper > a {
        max-width: 470px;
        width: 80%;
    }
}

/*-------------------
     other area
---------------------*/

/* faq */
.faq-container {
    display: flex;
    margin-right: -15px;
    margin-left: -15px;
}

.faq {
    display: flex;
    flex-direction: column;
    border: 1px solid #ccc;
    /*1920:40 - 768:25*/
    padding: calc(1.3020833333333335vw + 15px);
    height: 100%;
    transition: transform 0.12s ease-in-out;
    transform: scale(1);
}

.faq:hover {
    transform: scale(1.045);
}

.faq .continue {
    display: flex;
    flex: 1;
    align-items: flex-end;
    margin-left: auto;
}

.faq ul {
    display: flex;
    flex-wrap: wrap;
    padding-left: 0px;
}

.faq li {
    position: relative;
    margin: 3px 20px;
}

a.faq,
a.faq:hover {
    text-decoration: none;
    color: #666;
}

@media screen and (max-width: 767px) {
    .faq-container {
        flex-direction: column;
    }

    .faq {
        flex-direction: column;
    }

    .faq:hover {
        transform: scale(1.02);
    }
}