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

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

        background-position: 33% 42%;
    }
}

section#concept
{
    width: 1122px;
    margin: 1.5% auto;

    vertical-align: middle; 

    background-color: #fff;
}
section#concept h1
{
    font-size: 243%;
    font-weight: normal;

    margin: 0 auto;
    margin-top: 6.5%;
    padding: 20px;
    padding-left: 72px;

    text-align: center;

    color: #3fa79e;
    background-image: url(../images/company/societyIconGreen.png);
    background-repeat: no-repeat;
    background-position: 36% 14%;
}
section#concept p
{
    font-size: 153.9%;
    line-height: 197%; 

    padding-top: 2%;

    text-align: center;

    color: #605f5f;
}
section#concept p.pc
{
    display: block;

    width: 720px;
    margin: 0 auto;
}
section#concept p.pc .strong
{
    font-weight: bold;

    color: #0066c5;
}
section#concept p.phone
{
    display: none;
}
section#concept p.phone .strong
{
    color: #0066c5;
}
@media screen and (max-width: 768px)
{
    section#concept
    {
        width: 100%;
        padding: 1%; 

        background-position: 21% 2.5%;
        background-size: 12%;
    }
    section#concept h1
    {
        font-size: 153.9%;

        padding-bottom: 10px; 

        background-position: 21% 64%;
        background-size: 8%;
    }
    section#concept p.pc
    {
        display: none;
    }
    section#concept p.phone
    {
        font-size: 123.1%;
        line-height: 150%; 

        display: block;

        padding: 5%;

        text-align: left;

        color: #666;
    }
}

section#mecena
{
    width: 100%;
    margin-top: 4%;
    margin-bottom: 2.5%; 
    padding-top: 2%;

    background-image: url(../images/company/volunteerBakcimage.png);
    background-repeat: no-repeat;
    background-position: 35% 60%;
    background-size: cover;
}
section#mecena .catchCopy
{
    display: block; 

    width: 930px;
    margin: 1% auto 2%;
    padding: 1% 3% 3%;

    background-color: rgba(255, 255, 255, .9);
    background-image: url(../images/company/volunteerIconGreen.png);
    background-repeat: no-repeat;
    background-position: 31.7% 7.5%;
}
section#mecena .catchCopy h1
{
    font-size: 243%;
    font-weight: normal;

    margin-top: 7%;
    margin-bottom: 2%;
    margin-left: 36%;

    color: #3fa79e;
}
@media screen and (max-width: 768px)
{
    section#mecena .catchCopy h1
    {
        margin: 0 auto;
        margin-top: 6.5%;
        margin-bottom: 5px; 
        margin-left: 22%;
        padding: 6%;
        padding-top: 6%;
        padding-right: 0;
    }
}
section#mecena .catchCopy p
{
    font-size: 153.9%;
    line-height: 205%;

    clear: both;

    margin-bottom: 2.5%; 
    padding-top: 2%;

    text-align: left;

    color: #605f5f;
}
section#mecena .catchCopy p .bold
{
    font-weight: bold;
}
section#mecena .catchCopy p.phone
{
    display: none;
}
@media screen and (max-width: 768px)
{
    section#mecena .catchCopy p.pc
    {
        display: none;
    }
    section#mecena .catchCopy p.phone
    {
        line-height: 150%;

        display: block;

        margin-bottom: 5%; 
        padding: 0 3%;
        padding-top: 0;

        color: #555;
    }
}
@media screen and (max-width: 768px)
{
    section#mecena .catchCopy .banners img
    {
        width: 90%;
        margin-bottom: 11px;
        padding: 0 5%;
    }
}
section#mecena .catchCopy .banners img.museum
{
    float: right;
}
section#mecena .catchCopy .banners img.zaidan
{
    float: left;
}
@media screen and (max-width: 768px)
{
    section#mecena
    {
        width: 100%;
        padding: 1%; 

        background-position: 11% 2%;
    }
    section#mecena .catchCopy
    {
        display: block; 

        width: 95%;
        margin: 1% auto 2%;
        padding: 2% 2% 3%;

        background-color: rgba(255, 255, 255, .8);
        background-image: url(../images/company/volunteerIconGreen.png);
        background-repeat: no-repeat;
        background-position: 16% 5%;
        background-size: 11%;
    }
    section#mecena .catchCopy h1
    {
        font-size: 153.9%;
        font-weight: normal;

        margin-bottom: 2%;
        padding-right: 0;
        padding-left: 5%;

        color: #3fa79e;
    }
    section#mecena .catchCopy p
    {
        font-size: 123.1%;
        line-height: 123.1%;

        clear: both;

        margin-bottom: 2.5%; 
        padding-top: 15%;

        text-align: left;

        color: #000;
    }
}

section#security
{
    width: 100%;
    max-width: 1122px;
    height: 250px;
    margin: 1% auto;
    margin-bottom: 5%; 
    padding-top: 2%;

    vertical-align: middle;

    background-color: #fff;
}
section#security h1
{
    font-size: 243%;
    font-weight: normal;

    margin-top: 1.5%;
    margin-bottom: 4%;

    text-align: center; 

    color: #3fa79e;
}
section#security h1 span
{
    padding: 25px 25px 25px 65px; 

    background-image: url(../images/company/securityIcon.png);
    background-repeat: no-repeat;
    background-position: left center;
}
section#security .catchCopy
{
    display: block; 

    width: 75%;
    margin: 0 auto;
    margin-top: 4%;
}
section#security .catchCopy img
{
    float: left;

    width: 25%;
}
@media screen and (max-width: 768px)
{
    section#security .catchCopy img
    {
        width: 32%;
        margin: 0;
        margin-top: 5%;
    }
}
section#security .catchCopy p
{
    font-size: 138.5%;
    line-height: 182%;

    float: right; 

    width: 72%;

    text-align: left;

    color: #605f5f;
}
@media screen and (max-width: 768px)
{
    section#security .catchCopy p
    {
        font-size: 123.1%;
        line-height: 123.1%;

        box-sizing: border-box; 
        width: 67%;
        margin: 0;
        padding: 6% 4%;

        color: #555;
    }
}
@media screen and (max-width: 768px)
{
    section#security
    {
        width: 100%;
        height: auto;
        margin-bottom: 0;
        padding: 1%;
        padding-bottom: 5%; 

        background-position: 10% 12%;
        background-size: 8%;
    }
    section#security h1
    {
        font-size: 153.9%;
        font-weight: normal;

        margin-top: 10%;
        margin-bottom: 4%;

        color: #3fa79e;
    }
    section#security .catchCopy
    {
        display: block; 

        width: 100%;
        margin: 1% auto 2%;

        background-color: rgba(255, 255, 255, .8);
        background-repeat: no-repeat;
        background-position: 9% 1.5%;
    }
    section#security .catchCopy img
    {
        float: left;

        margin-top: 6%;
    }
}
