@charset 'UTF-8';


.content-area
{
    background: url(../img/equipment/pc_bg_equipment.jpg) no-repeat center top;
}

@media screen and (max-width: 740px)
{
    .content-area
    {
        background: url(../img/equipment/sp_bg_equipment.jpg) no-repeat center top;
        background-size: 100% auto;
    }
}

h2,
h3
{
    font-family: '游明朝',HonMincho-Book,YuMincho,'ヒラギノ明朝 ProN W3','Hiragino Mincho ProN','HG明朝E','ＭＳ Ｐ明朝','ＭＳ 明朝',serif;
    font-weight: 500;
    line-height: 1.8;

    margin: 0;
    padding: 0;

    vertical-align: bottom;
}

/* mv
---------------------------------------- */
#mv .inner-area
{
    padding: 153px 0 131px 0;

    text-align: center;
}

@media screen and (max-width: 740px)
{
    #mv .inner-area
    {
        padding: 7.8125vw 0;
    }
    #mv .inner-area p
    {
        width: 100%;
        margin: 0 auto;
    }
}

/* nav
---------------------------------------- */
#nav .inner
{
    max-width: 1140px;
    margin: 0 auto;
}

#nav ul
{
    display: -webkit-flex;
    display:         flex;
}

#nav li
{
    width: 32%;
    margin-left: 2%;
}

#nav li a
{
    font-family: '游明朝',HonMincho-Book,YuMincho,'ヒラギノ明朝 ProN W3','Hiragino Mincho ProN','HG明朝E','ＭＳ Ｐ明朝','ＭＳ 明朝',serif;
    font-size: 1.6rem;
    font-weight: 500;

    position: relative;

    display: inline-block;

    width: 100%;
    padding: 19px 0 15px;

    text-align: center;

    color: #fff;
    background: #1b3268;
    background:    -moz-linear-gradient(left, #1b3268 0%, #2e4988 50%, #1b3268 100%);
    background: -webkit-linear-gradient(left, #1b3268 0%, #2e4988 50%, #1b3268 100%);
    background:         linear-gradient(to right, #1b3268 0%, #2e4988 50%, #1b3268 100%);
}

#nav li a:after
{
    position: absolute;
    top: 24px;
    left: 20px;

    width: 5px;
    height: 10px;

    content: '';

    background: url(../img/equipment/icon_nav.png) no-repeat center top;
}

#nav li:first-child
{
    margin-left: 0;
}

@media screen and (max-width: 740px)
{
    #nav
    {
        padding: 0 1.2rem;
    }
    #nav ul
    {
        display: inline-block;

        width: 100%;
    }
    #nav li
    {
        display: inline-block;

        width: 48%;
        margin-bottom: 2%;
    }
    #nav li a
    {
        font-size: 1.0rem;
    }
    #nav li a:after
    {
        background: none;
    }
    #nav li:last-child
    {
        margin-left: 0;
    }
}

/* content
---------------------------------------- */
.content
{
    padding: 180px 0 0;
}

.content .inner
{
    max-width: 1140px;
    margin: 0 auto -130px;
    padding-bottom: 15px;

    border-bottom: 1px solid #1b1b1b;
}

.content h2
{
    font-size: 3.9rem;
    line-height: 1;

    margin-bottom: 50px;

    text-align: center;
}

.content h2 span
{
    font-family: '游明朝',HonMincho-Book,YuMincho,'ヒラギノ明朝 ProN W3','Hiragino Mincho ProN','HG明朝E','ＭＳ Ｐ明朝','ＭＳ 明朝',serif;
    font-size: 1.5rem;
    font-weight: 500;

    display: block;

    margin-bottom: 8px;

    color: #2e4988;
}

.content ul
{
    display: -webkit-flex;
    display:         flex;
}

.content ul li
{
    display: inline-block;

    width: 23.94%;
    margin: 0 1.35% 40px 0;
}

.content ul li .ttl
{
    font-family: '游明朝',HonMincho-Book,YuMincho,'ヒラギノ明朝 ProN W3','Hiragino Mincho ProN','HG明朝E','ＭＳ Ｐ明朝','ＭＳ 明朝',serif;
    font-size: 2.0rem;
    line-height: 1.4;

    text-align: center;

    color: #2e4988;
}

.content ul li .ttl span
{
    font-family: '游明朝',HonMincho-Book,YuMincho,'ヒラギノ明朝 ProN W3','Hiragino Mincho ProN','HG明朝E','ＭＳ Ｐ明朝','ＭＳ 明朝',serif;
    font-size: 1.5rem;

    display: block;

    color: #606060;
}

.content ul li .img
{
    margin: 8px auto 12px;
}

.content ul li .info
{
    font-size: 1.3rem;

    color: #444;
}

.content ul li.mg_non
{
    margin-right: 0;
}

.content .col2
{
    width: 49.23%;
}

.content .col2 li
{
    width: 49%;
    margin-right: 0;
}

.content .col2 li:first-child
{
    margin-right: 2.6%;
}

.content .btn-top
{
    text-align: right;
}

.content .btn-top a
{
    font-family: '游明朝',HonMincho-Book,YuMincho,'ヒラギノ明朝 ProN W3','Hiragino Mincho ProN','HG明朝E','ＭＳ Ｐ明朝','ＭＳ 明朝',serif;
    font-size: 1.5rem;
}

@media screen and (max-width: 1200px)
{
    .content .inner
    {
        padding: 3.90625vw 3.125vw;
    }
}

@media screen and (max-width: 740px)
{
    .content
    {
        padding: 13rem 0 0;
    }
    .content .inner
    {
        padding: 7.8125vw 3.125vw !important;
    }
    .content h2
    {
        font-size: 2.8rem;

        margin-bottom: 7.8125vw;
    }
    .content ul
    {
        display: inline-block;
    }
    .content ul li
    {
        width: 48%;
        margin: 0 2% 5% 0;

        vertical-align: top;
    }
    .content ul li .ttl
    {
        font-size: 1.4rem;
        line-height: 1.5;
    }
    .content ul li .ttl span
    {
        font-size: 1.1rem;
    }
    .content ul li .ttl .box:first-child
    {
        margin-bottom: 5%;
    }
    .content ul li:nth-child(even)
    {
        margin-right: 0;
    }
    .content ul li.mr
    {
        margin-right: 2%;
    }
    .content .col2
    {
        width: 100%;
    }
    .content .col2 li
    {
        width: 48%;
    }
    .content .col2 li:first-child
    {
        margin-right: 2%;
    }
}

/* kitchen
---------------------------------------- */
#kitchen
{
    margin-top: -120px;
}

@media screen and (max-width: 740px)
{
    #kitchen
    {
        margin-top: -13rem;
    }
}

/* utility
---------------------------------------- */
#utility .col2,
#bathroom .col2
{
    display: inline-block;

    margin-right: 1.1%;
}

#utility .img-list-wrap,
#bathroom .img-list-wrap
{
    display: inline-block;

    width: 49.23%;

    vertical-align: top;
}

#utility .img-list-wrap li,
#bathroom .img-list-wrap li
{
    width: 49%;
    margin-right: 0;
}

#utility .img-list-wrap li:first-child,
#bathroom .img-list-wrap li:first-child
{
    margin-right: 2.6%;
}

@media screen and (max-width: 740px)
{
    #utility .img-list-wrap,
    #bathroom .img-list-wrap
    {
        width: 100%;
    }
    #utility .img-list-wrap li,
    #bathroom .img-list-wrap li
    {
        width: 48%;
    }
    #utility .img-list-wrap li:first-child,
    #bathroom .img-list-wrap li:first-child
    {
        margin-right: 2%;
    }
}

/* bathroom
---------------------------------------- */
#bathroom
{
    margin-bottom: 80px;
}

#bathroom .inner
{
    border-bottom: none;
}

/* note
---------------------------------------- */
.note .inner
{
    font-size: 1.1rem;

    max-width: 1540px;
    margin: 0 auto;
    padding: 57px 0 36px 0;

    color: #333;
}

@media screen and (max-width: 1540px)
{
    .note .inner
    {
        padding: 57px 3.125vw 36px 3.125vw;
    }
}

@media screen and (max-width: 740px)
{
    .note .inner
    {
        padding: 7.03125vw 3.125vw;
    }
}