@charset 'UTF-8';

.c_contact_menu
{
    overflow: hidden; 

    width: 100%;
    margin: auto;
    margin-top: 30px;
    margin-bottom: 30px;
}

.c_contact_menu li
{
    font-size: 13px;

    position: relative;

    height: 40px;

    color: #fff;
    background: #999; 

    flex-grow: 1;
    justify-content: center;
    align-items: center;
}

html[c-data-font-size='normal'] .c_contact_menu li
{
    font-size: 15px;
}

html[c-data-font-size='large'] .c_contact_menu li
{
    font-size: 17px;
}

.c_contact_menu li.active
{
    background: #87c040;
}

.c_contact_menu li.active + li::after
{
    border-left: 30px solid #87c040;
}

.c_contact_menu li + li::before,
.c_contact_menu li + li::after
{
    position: absolute;
    top: 50%;

    display: block;

    width: auto;
    height: auto;

    content: '';

    border-right: none;
}

.c_contact_menu li + li::before
{
    left: 0;

    transform: translate(-50%, -50%); 

    border-top: 40px solid transparent;
    border-bottom: 40px solid transparent;
    border-left: 30px solid #fff;
}

.c_contact_menu li + li::after
{
    left: -5px;

    transform: translate(-50%, -50%); 

    border-top: 40px solid transparent;
    border-bottom: 40px solid transparent;
    border-left: 30px solid #999;
}

.c_contact_menu li svg
{
    width: 20px;
    height: 20px;
    margin-right: 5px;

    fill: #fff;
}

.setion_out h2
{
    font-size: 20px;
    line-height: 1.5;
}

html[c-data-font-size='normal'] .setion_out h2
{
    font-size: 22px;
}

html[c-data-font-size='large'] .setion_out h2
{
    font-size: 24px;
}

.setion_out .c_btn_prev
{
    width: 250px;
    margin: auto;
    margin-top: 30px;
}

@media screen and (max-width: 1024px)
{
    .c_contact_menu
    {
        width: 100%;
        margin-top: 20px;
        margin-bottom: 30px;
    }
    .c_contact_menu li.active + li::after
    {
        border-left: 20px solid #87c040;
    }
    .c_contact_menu li + li::before
    {
        border-left: 20px solid #fff;
    }
    .c_contact_menu li + li::after
    {
        border-left: 20px solid #999;
    }
    .c_contact_menu li svg
    {
        width: 20px;
        height: 20px;
    }
}

/*=====<=====<=====<=====<=====<=====<=====
  pc
=====>=====>=====>=====>=====>=====>=====*/
#new_register_user #sec01
{
    padding: 30px 25px;
}

@media screen and (max-width: 1024px)
{
    #new_register_user #sec01
    {
        padding: 20px 0;
    }
}

#new_register_user #sec01 .inner form .woocommerce-privacy-policy-link
{
    text-decoration: underline;
}

#new_register_user #sec01 .inner form .woocommerce-privacy-policy-link:hover
{
    text-decoration: none;
}

#new_register_user #sec01 .inner form button,
#new_register_user #sec01 .inner form .button
{
    font-family: inherit; 
    line-height: 1;

    display: -webkit-flex;
    display:     -ms-flex;
    display:         flex;

    width: 50%;
    margin: 30px auto 0;
    padding: 18px 0;

    color: #fff;
    border-radius: 5px;
    background: #555;

    justify-content: center;
    align-items: center;
}

@media screen and (max-width: 1024px)
{
    #new_register_user #sec01 .inner form button,
    #new_register_user #sec01 .inner form .button
    {
        width: 100%;
    }
}

#new_register_user #sec01 .inner form input[type=email],
#new_register_user #sec01 .inner form input[type=password],
#new_register_user #sec01 .inner form input[type=search],
#new_register_user #sec01 .inner form input[type=tel],
#new_register_user #sec01 .inner form input[type=text],
#new_register_user #sec01 .inner form input[type=url],
#new_register_user #sec01 .inner form textarea
{
    width: 100%;
    padding: .5em; 

    border: 1px solid #8c8c8c;
    background: #f3f3f3;
}
