@charset "utf-8";

/* @overwrite common.css */
section
{
    margin: 0px auto 40px;
    width: 80%;
}

/* @overwrite common.css */
section>h1
{
    margin: 80px 20px 30px;
}

/* @overwrite common.css */
section>hr
{
    margin: 0px 40px;
    height: 2px;
    width: 100%;
    background-color: #c29c66;
    color: #c29c66;
}

/* menu */
.service_menu_block
{
    margin: 40px 40px 40px;
}

/* menu item separator */
.service_menu_separator
{
    display: inline-block;
    margin: 0px 20px;
    width: 20px;
    height: 20px;
    vertical-align: middle;
    background-color: #aba8a3;
    border-radius: 10px;
    content: '';
}

/* menu item */
.service_menu_item:link,
.service_menu_item:visited
{
    display: inline-block;
    padding: 15px 10px;
    background-color: #6a88af;
    border: 2px solid transparent;
    border-radius: 20px;
    color: #ffffff;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 3px;
}

.service_menu_item:hover,
.service_menu_item:active
{
    background-color: #ffffff;
    border: 2px solid #6a88af;
    color: #6a88af;
}

/* @overwrite common.css */
article
{
    font-weight: bold;
    line-height: 2;
}

.service_conversation_block
{
    color: #a47300;
    font-size: 18px;
    font-weight: normal;
    line-height: 2.5;
    letter-spacing: 3px;
}

/* RWD */
@media only screen and (max-width: 1260px)
{
    /* menu separator */
    .service_menu_separator
    {
        display: block;
        margin: 0px auto;
    }

    /* menu item */
    .service_menu_item:link,
    .service_menu_item:visited
    {
        display: block;
        margin: 20px auto;
        width: 200px;
        text-align: center;
    }
}

@media only screen and (max-width: 700px)
{
    section>hr
    {
        margin: 0px;
    }
}

@media only screen and (max-width: 350px)
{
    /* menu */
    .service_menu_block
    {
        margin: 40px 20px 60px;
    }

    /* menu item */
    .service_menu_item:link,
    .service_menu_item:visited
    {
        width: 100%;
    }
}

@media only screen and (max-width: 550px)
{
    section
    {
        width: 90%;
    }
}