@charset "utf-8";

/* style.css
 * **************************************************
 * **************************************************
 */

/* button */
.button a {
    background-color: #2da7ff;
    -webkit-box-shadow: 6px 6px 0 0 #3757ff;
    -moz-box-shadow: 6px 6px 0 0 #3757ff;
    box-shadow: 6px 6px 0 0 #3757ff;
}

/* mainvisual */
#mainvisual {
    background-image: url(../images/main.jpg);
}

/* intro */
#content #intro {
    background-image: url(../images/bg_intro_01.jpg);
}

/* challenge */
#content #challenge {
    background-color: #c5f7ff;
}

#content #challenge .title {
    background-image: url(../images/bg_challenge_01.png);
    background-position: center 12.53%;
}

#content #challenge .title p {
    color: #2da7ff;
}

#content #challenge .promotion {
    border-color: #2da7ff;
}

#content #challenge .promotion .promotionContents {
    border-top-color: #2da7ff;
}

#content #challenge .promotion .promotionContents ul li + li {
    border-top-color: #2da7ff;
}

#content #reason .frame ol li .text h4 span {
    background-color: #2da7ff;
}

#content #reason .frame > p {
    color: #2da7ff;
}

/* reason */
#content #reason {
    background-image: url(../images/bg_reason_01.jpg), url(../images/bg_reason_03.jpg), url(../images/bg_reason_02.jpg);
}

#content #reason .frame {
    background-image: url(../images/bg_reason_frame.png);
}

#content #reason .frame ol li#reason02 {
    background-image: url(../images/arrow_reason_01.png);
}

#content #reason .frame ol li#reason03 {
    background-image: url(../images/arrow_reason_02.png);
}

#content #reason .frame ol li .text h4 span {
    background-color: #2da7ff;
}

#content #reason .frame > p {
    color: #2da7ff;
}

/* service */
#content #service {
    background-color: #c5f7ff;
}

#content #service dl {
    border-color: #2da7ff;
}

/* Media Queries
-------------------------------------------------- */

@media only screen and (max-width: 767px) {

    /* button */
    .button a {
        -webkit-box-shadow: 3px 3px 0 0 #3757ff;
        -moz-box-shadow: 3px 3px 0 0 #3757ff;
        box-shadow: 3px 3px 0 0 #3757ff;
    }

    /* mainvisual */
    #mainvisual {
        background-image: url(../images/main_sp.jpg);
    }

    /* intro */
    #content #intro {
        background-image: url(../images/bg_intro_01_sp.jpg);
    }
    
    /* challenge */
    #content #challenge .title {
        background-image: url(../images/bg_challenge_01_sp.png);
        background-position: center top;
    }

    /* reason */
    #content #reason .frame {
        background-image: url(../images/bg_reason_frame_sp.png);
    }

    #content #reason .frame ol li#reason02 {
        background-image: url(../images/arrow_reason_01.png);
    }

    #content #reason .frame ol li#reason03 {
        background-image: url(../images/arrow_reason_02.png);
    }
        
    _::-webkit-full-page-media, _:future, :root #content #reason .frame ol li .text h4 {
        letter-spacing: 0.08em;
    }

}