@charset 'UTF-8';
/*smart_phone_config*/
/*共通パーツ化が困難だったため追記*/
/* *****************************
 *
 * INDEX file to Scss or Sass.
 *
 **************************** */
#head h1
{
    padding-left: 8%;

    background-position: 32% 40%;
}
@media screen and (max-width: 768px)
{
    #head h1
    {
        padding-left: 10%; 

        background-position: 29% 42%;
    }
}

#contents
{
    background-color: #fff;
}
#contents .caution
{
    font-size: 16px;

    width: 100%;
    max-width: 1063px;
    margin: 11px auto 0 auto;
    padding: 20px;

    text-align: center; 

    color: #f03e68;
    border: 1px solid #f03e68;
    background: #f3f2f2;
}
@media screen and (max-width: 768px)
{
    #contents .caution
    {
        font-size: 13px; 

        width: 88%;
        margin: 20px auto 0 auto;
        padding: 4%;

        text-align: left;
    }
}
#contents section.both
{
    width: 1122px;
    margin: 0 auto;

    background-color: #fff;
}
@media screen and (max-width: 768px)
{
    #contents section.both
    {
        width: auto;
    }
}
#contents section.both h2
{
    font-size: 213%;
    font-weight: normal;

    padding: 5% 0 4%;

    text-align: center; 

    color: #3fa79e;
}
@media screen and (max-width: 768px)
{
    #contents section.both h2
    {
        font-size: 153.9%;

        padding: 8% 0 4% 0;
    }
}
#contents section.both .areaInner
{
    width: 100%;
    margin: 0 auto;
    padding-bottom: 3%; 

    text-align: center;
    text-align: center;
}
@media screen and (max-width: 768px)
{
    #contents section.both .areaInner
    {
        padding-bottom: 0;
    }
}
#contents section.both .areaInner .officeInfo
{
    float: left;

    width: 42%;
    height: auto; 
    margin: 0 1%;
    margin-bottom: 2%;
    padding: 2% 3%;

    background-color: #f3f2f2;
}
@media screen and (max-width: 768px)
{
    #contents section.both .areaInner .officeInfo
    {
        float: none;

        box-sizing: border-box;
        width: 100%;
        margin: 0;
        margin-bottom: 3%;
    }
}
@media screen and (max-width: 768px)
{
    #contents section.both .areaInner .officeInfo
    {
        padding: 5%;
    }
}
#contents section.both .areaInner .officeInfo h3
{
    font-size: 182%;
    font-weight: bold;

    display: inline-block;
    float: left;

    margin-bottom: 2%; 
    padding-top: 1%;
}
@media screen and (max-width: 768px)
{
    #contents section.both .areaInner .officeInfo h3
    {
        font-size: 138.5%;
    }
}
#contents section.both .areaInner .officeInfo a
{
    font-weight: bold;

    display: inline-block;
    float: right;

    margin-bottom: 2%;
    padding: 1% 2% 1% 8%;

    color: #fff;
    border-bottom: 4px solid #1e4e4b; 
    background-color: #358b86;
    background-image: url(../images/company/accessIcon.png);
    background-repeat: no-repeat;
    background-position: 7% 35%;
}
#contents section.both .areaInner .officeInfo a:hover
{
    border-top: 4px solid #1e4e4b; 
    border-bottom: none;
}
@media screen and (max-width: 768px)
{
    #contents section.both .areaInner .officeInfo a
    {
        margin-left: 0;
        padding: 1% 2% 1% 2%; 

        background-image: none;
        background-position: 6% 35%;
    }
}
#contents section.both .areaInner .officeInfo dl dt
{
    font-weight: bold;
    font-weight: bold;

    display: inline-block;
    display: block;
    float: left;

    width: 24%;
    margin-right: 3%; 
    padding: 1% 0;

    color: #000;
    color: #fff;
}
#contents section.both .areaInner .officeInfo dl dt.address
{
    background-color: #ef4e74;
    background-image: url(../images/company/addressIcon.png);
    background-repeat: no-repeat;
    background-position: 15% 40%;
}
#contents section.both .areaInner .officeInfo dl dt.address p
{
    padding-left: 30%;

    text-align: left;
}
@media screen and (max-width: 768px)
{
    #contents section.both .areaInner .officeInfo dl dt.address p
    {
        text-align: center;
    }
}
@media screen and (max-width: 768px)
{
    #contents section.both .areaInner .officeInfo dl dt.address
    {
        background-image: none;
    }
    #contents section.both .areaInner .officeInfo dl dt.address p
    {
        padding-left: 0;
    }
}
#contents section.both .areaInner .officeInfo dl dt.tel
{
    background-color: #fbaf2b;
    background-image: url(../images/company/telIcon.png);
    background-repeat: no-repeat;
    background-position: 10% 30%;
}
#contents section.both .areaInner .officeInfo dl dt.tel p
{
    padding-left: 30%;

    text-align: left;
}
@media screen and (max-width: 768px)
{
    #contents section.both .areaInner .officeInfo dl dt.tel p
    {
        text-align: center;
    }
}
@media screen and (max-width: 768px)
{
    #contents section.both .areaInner .officeInfo dl dt.tel
    {
        background-image: none;
    }
    #contents section.both .areaInner .officeInfo dl dt.tel p
    {
        padding-left: 0;
    }
}
#contents section.both .areaInner .officeInfo dl dt.area
{
    background-color: #357ac7;
    background-image: url(../images/company/areaIcon.png);
    background-repeat: no-repeat;
    background-position: 10% 30%;
}
#contents section.both .areaInner .officeInfo dl dt.area p
{
    padding-left: 30%;

    text-align: left;
}
@media screen and (max-width: 768px)
{
    #contents section.both .areaInner .officeInfo dl dt.area p
    {
        text-align: center;
    }
}
@media screen and (max-width: 768px)
{
    #contents section.both .areaInner .officeInfo dl dt.area
    {
        clear: both; 

        background-image: none;
    }
    #contents section.both .areaInner .officeInfo dl dt.area p
    {
        padding-left: 0;
    }
}
#contents section.both .areaInner .officeInfo dl dd
{
    font-size: 123.1%; 

    display: inline-block;

    width: 70%;
    margin-bottom: 3%;
    margin-left: 0;
    padding: 1% 0;

    text-align: left;
}
#contents section.both .areaInner .officeInfo dl dd .last
{
    margin-bottom: 0;
}
#contents section.both .areainnre:last-child
{
    padding-bottom: 5%;
}
#contents section.even
{
    display: block;

    width: auto;

    background-color: #f3f2f2;
}
#contents section.even .areaInner
{
    width: 1122px;
}
@media screen and (max-width: 768px)
{
    #contents section.even .areaInner
    {
        width: 100%;
    }
}
#contents section.even .areaInner .officeInfo
{
    background-color: #fff;
}

header,
article,
section,
ul,
div,
dl,
li,
select,
option,
table,
td,
th,
figure,
figcaption
{
    box-sizing: content-box;
}

#clear .bx-wrapper
{
    margin-top: 0;
}