@charset "UTF-8";

#maintitle { height: 520px;}
#maintitle h1 span { display: block;}
#maintitle .en.en1 { color: #01bece; font-size: 171%; margin-bottom: 0.6em;}
#maintitle .en.en2 { color: #424242; font-size: 143%; margin-top: 0.7em;}

@media only screen and (max-width: 782px) {
    #maintitle { height: 410px;}
}

#intro { position: relative; z-index: 4; padding-bottom: 4em;}
#intro h2 {
    font-size: 330%;
    line-height: 1.3;
    padding-top:1.5em;
    letter-spacing: 0.1em;
}
#intro p { width: 540px; margin-top:2em; font-size: 114%;}
#intro figure.pc { position: absolute; overflow: hidden; width: 100%; height: 593px; background-position: calc(50% + 100px) top; background-repeat: no-repeat; background-size: auto 100%; top: 50%; left:0; margin-top: -296px; z-index: 5;}

@media only screen and (max-width: 782px) {
    #intro h2 { text-align: center;font-size: 250%;}
    #intro p { width: auto;}
    #intro figure.sp { width: 100vw;}
    #intro figure.sp img { width: 100%; height: auto;}
}

#works {
    background-position: center 50%;
    background-repeat: no-repeat;
    background-size: cover;
    height: 380px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    position: relative;
    margin-bottom: 150px;
}
#works h2 { text-align: center;}
#works h2 .en { color: #e60044; font-size: 250%; display: block; line-height: 1.3;}
#works h2 .jp { color: #fff; font-size: 114%; display: block; font-weight: bold;line-height: 1.3; margin:0.5em 0 1.3em;}
@media only screen and (max-width: 782px) {
    #works { height: 200px;margin-bottom: 100px;}
    #works h2 .en { line-height: 1.3;}
    #works h2 .jp { margin:0.2em 0 0.6em;}
}

#irai { padding-bottom:100px; background:#f9f9f9; margin-top: 0px; }
.confirm #irai { padding-bottom:100px; background:#fff; }

#maincolumn #irai h2 {
    font-size: 200%;
    font-weight: bold;
    color: #e60044;
    text-align: center;
    letter-spacing: 2px;
    border:#e60044 5px solid;
    border-radius: 2px;
    height: 2.8em;
    line-height: 2.8em;
    top: calc( -1.4em - 5px);
    position: relative;
    background: #fff;
    margin-top:0;
}
#irai h2::before {
    width:50px;
    height: 60px;
    border: transparent 25px solid;
    border-bottom: transparent 30px solid;
    border-top: #e60044 30px solid;
    content:"";
    position: absolute;
    box-sizing: border-box;
    left: 50%;
    bottom: -60px;
    margin-left: -25px;
}
#irai h2::after {
    width:36px;
    height: 44px;
    border: transparent 18px solid;
    border-top: #fff 23px solid;
    content:"";
    position: absolute;
    box-sizing: border-box;
    left: 50%;
    bottom: -43px;
    margin-left: -18px;
}
@media only screen and (max-width: 782px) {
    #irai { padding-bottom:50px; }
    #maincolumn #irai h2 {
        font-size: 200%;
        font-weight: bold;
        color: #e60044;
        text-align: center;
        letter-spacing: 2px;
        border:#e60044 3px solid;
        border-radius: 2px;
        height: auto;
        line-height: 1.2;
        top: calc( -2em - 3px);
        position: relative;
        background: #fff;
        padding: 0.5em 0;
    }
    #irai h2::before {
        width:30px;
        height: 40px;
        border: transparent 15px solid;
        border-bottom: transparent 20px solid;
        border-top: #e60044 20px solid;
        bottom: -40px;
        margin-left: -15px;
    }
    #irai h2::after {
        width:24px;
        height: 32px;
        border: transparent 12px solid;
        border-top: #fff 16px solid;
        bottom: -30px;
        margin-left: -12px;
    }
}

#irai h3.icon {
    padding-top: 50px;
    text-align: center;
    font-size: 150%;
}
#irai h3.icon:nth-child(2) { padding-top: 70px;}
#irai h3.icon .jp { display: block; margin-top: 0.7em; letter-spacing: 2px; font-weight: bold;color: #e60044;}

@media only screen and (max-width: 782px) {
    #irai h3.icon { padding-top: 50px;}
    #irai .set:first-child h3.icon { padding-top: 0px;}
    #irai h3.icon img { width: 70px;}
    #irai h3.icon:nth-child(2) { padding-top: 35px;}
}

#irai a.tel { display: block; text-align: center; font-size: 420%; color: #424242; line-height: 1.3; font-family: urw-din, sans-serif;
font-weight: 400;
font-style: normal;}

#irai a.tel + p {
    margin: 0.5em 0 0 0;
    text-align: center;
    line-height: 1.9;
}
#irai a.tel + p strong {
    display: block;
    font-size: 114%;
}

#irai .flex {
    display: flex;
    align-items: center;
}
#irai .flex .set{ width: 50%;}
#irai .arrowBtn3 span { line-height: 1.4; font-size: 128%; padding-left: 80px;}
#irai .arrowBtn3 span strong{
    padding-left: 1em;
    display: block;
    font-size: 86%;
}
@media only screen and (max-width: 782px) {

    #irai .flex {
        display: block;
    }
    #irai .flex .set{ width: auto;}
    #irai .arrowBtn3 span { line-height: 1.4; font-size: 128%; padding-left: 10px;}
    #irai .arrowBtn3 span strong{
        padding-left: 0;
    }
}
