<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">@charset "UTF-8";
/* CSS Document */


section#titleArea {
    max-width: 1200px;
    margin: auto;
    margin-top: 174px;
    font-size: 1px;
    letter-spacing: -5px;
    line-height: 0;
    padding-bottom: 72px;
}

section#titleArea .heading {
    display: inline-block;
    letter-spacing: normal;
    vertical-align: bottom;
}
section#titleArea .heading .wrap {
    display: inline-block;
}
section#titleArea .heading p {
    margin-top: 28px;
    font-size: 1.6rem;
    line-height: 190%;
    font-weight: bold;
}



.tabArea {
    width: 690px;
    margin: auto;
}
.tabArea ul::after {
    content: '';
    clear: both;
    display: block;
}
.tabArea li {
    display: block;
    width: calc(33.333333% - 30px);
    height: 94px;
    float: left;
    margin: 0 15px;
    transition: all 0.3s;
    transform-origin: bottom;
    position: relative;
    z-index: 1;
}
.tabArea li a {
    display: block;
    height: 100%;
}
.tabArea li span {
    display: block;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}
.tabArea#tabArea_top li {
    margin-bottom: -10px;
}
.tabArea#tabArea_bottom li {
    margin-top: -10px;
}
.tabArea#tabArea_top li:hover {
    transform: translateY(5px);
}
.tabArea#tabArea_bottom li:hover {
    transform: translateY(-5px);
}
.tabArea li.active:hover {
    transform: none!important;
}
.tabArea li.active a {
    cursor: default;
}
#tabArea_top li.tab_01 {
    background: url(../images/seido/tab_01_off.png) center top no-repeat;
}
#tabArea_top li.tab_02 {
    background: url(../images/seido/tab_02_off.png) center top no-repeat;
}
#tabArea_top li.tab_03 {
    background: url(../images/seido/tab_03_off.png) center top no-repeat;
}
#tabArea_top li.tab_01.active {
    background: url(../images/seido/tab_01.png) center top no-repeat;
}
#tabArea_top li.tab_02.active {
    background: url(../images/seido/tab_02.png) center top no-repeat;
}
#tabArea_top li.tab_03.active {
    background: url(../images/seido/tab_03.png) center top no-repeat;
}
#tabArea_bottom li.tab_01 {
    background: url(../images/seido/bottom_tab_01_off.png) center bottom no-repeat;
}
#tabArea_bottom li.tab_02 {
    background: url(../images/seido/bottom_tab_02_off.png) center bottom no-repeat;
}
#tabArea_bottom li.tab_03 {
    background: url(../images/seido/bottom_tab_03_off.png) center bottom no-repeat;
}
#tabArea_bottom li.tab_01.active {
    background: url(../images/seido/bottom_tab_01.png) center bottom no-repeat;
}
#tabArea_bottom li.tab_02.active {
    background: url(../images/seido/bottom_tab_02.png) center bottom no-repeat;
}
#tabArea_bottom li.tab_03.active {
    background: url(../images/seido/bottom_tab_03.png) center bottom no-repeat;
}
#tabArea_bottom {
    margin-bottom: 50px;
}


#contentsArea {
    max-width: 1230px;
    padding: 0 15px;
    margin: auto;
}
#sec_01 {
    background: #ffaf51;
    border-radius: 30px;
    padding: 46px 50px;
}
#sec_01_0 {
    background: #FFF;
    border-radius: 10px;
    padding: 30px;
    margin-bottom: 30px;
}
#sec_01_0 img {
    max-width: 985px;
    width: 100%;
    height: auto;
}
#sec_01_0 p {
    margin: 10px 0 0 14%;
    font-size: 1.1rem;
    line-height: 140%;
    color: #999;
    text-align: left;
    max-width: 640px;
    text-align: justify;
    text-justify: inter-ideograph;
    text-indent: -1em;
    padding-left: 1em;
}
#sec_01_1 {
    background: url(../images/seido/t01_01_bg.png) repeat;
}
#sec_01_2 {
    background: url(../images/seido/t01_02_bg.png) repeat;
}
#sec_01_3 {
    background: url(../images/seido/t01_03_bg.png) repeat;
}
#sec_01_4 {
    background: url(../images/seido/t01_04_bg.png) repeat;
}
#sec_01 .sec_det {
    padding: 50px 0 20px;
}
#sec_01 .sec_det::after {
    content: '';
    clear: both;
    display: block;
}
#sec_01 .sec_det .leftArea {
    float: left;
    display: block;
    width: 50%;
    position: relative;
}
#sec_01 .sec_det .leftArea h3 {
    position: absolute;
    left: 0;
    top: 3px;
    width: 150px;
    height: 100%;
}
#sec_01 .sec_det .leftArea .text {
    font-size: 1.4rem;
    line-height: 170%;
    text-align: left;
    margin: 0 60px 0 160px;
}
#sec_01 .sec_det .leftArea p {
    margin-bottom: 0.5em;
    text-align: justify;
    text-justify: inter-ideograph;
}
#sec_01 .sec_det .leftArea small {
    font-size: 0.7em;
}
#sec_01 .sec_det .leftArea p.at {
    font-size: 1.2rem;
    line-height: 170%;
    text-indent: -1em;
    padding-left: 1em;
}
#sec_01 .sec_det .rightArea {
    float: right;
    display: block;
    width: 50%;
    text-align: left;
}
#sec_01 .sec_det .rightArea img.photo {
    margin-top: -12px;
}
#sec_01 .sec_det .rightArea .balloon {
    background: url(../images/seido/t01_balloon.png) left top no-repeat;
    width: 461px;
    height: 176px;
    position: relative;
    margin-top: -8px;
}
#sec_01 .sec_det .rightArea .balloon p {
    position: absolute;
    left: 115px;
    top: 44px;
    width: 300px;
    font-size: 1.3rem;
    line-height: 160%;
    text-align: justify;
    text-justify: inter-ideograph;
}



#sec_02 {
    background: #438dda;
    border-radius: 30px;
    padding: 40px 40px 22px;
}

#sec_03 {
    background: #6ed4dd;
    border-radius: 30px;
    padding: 40px 40px 22px;
}

ul.tileArea {
    display: block;
    font-size: 1px;
    line-height: 0;
    letter-spacing: -5px;
    margin: 0 auto 0;;
    text-align: left;
    max-width: 1230px;
}
ul.tileArea li {
    letter-spacing: normal;
    display: inline-block;
    max-width: 362px;
    width: calc(25% - 18px);
    border-radius: 10px;
    vertical-align: top;
    padding: 25px 0 20px;
    margin: 0 9px 18px;
    text-align: center;
    background: #FFF;
}
ul.tileArea li h5 span {
    display: block;
    font-size: 1.7rem;
    line-height: 120%;
    margin: 15px 0 0;
    font-weight: bold;
}
ul.tileArea li h5 span i {
    display: block;
    font-size: 1.2rem;
    line-height: 120%;
    margin: 0 0 0;
    font-weight: bold;
    font-style: normal;
}
ul.tileArea li p {
    font-size: 1.3rem;
    line-height: 160%;
    text-align: left;
    margin: 15px 10% 0;
    text-align: justify;
    text-justify: inter-ideograph;
}

#sec_03 .voice {
    margin: 35px 9px 0;
}
#sec_03 .voice::after {
    content: '';
    display: block;
    clear: both;
}
#sec_03 .voice h4 {
    border-bottom: #202020 2px solid;
    padding-bottom: 10px;
    margin-bottom: 18px;
}
#sec_03 .voice h4 span {
    color: #202020;
    font-size: 1.7rem;
    font-weight: bold;
    line-height: 100%;
    position: relative;
}
#sec_03 .voice h4 span::after {
    content: '';
    position: absolute;
    right: -77px;
    bottom: 5px;
    background: url(../images/seido/t03_balloon.png) no-repeat;
    width: 69px;
    height: 46px;
}

#sec_03 .voice .wrap {
    float: left;
    width: 50%;
    position: relative;
    padding: 0 20px 0 115px;
    color: #202020;
    min-height: 130px;
    margin-bottom: 30px;
}
#sec_03 .voice .wrap img {
    position: absolute;
    left: 0;
    top: 25px;
    border-radius: 10px;
}
#sec_03 .voice .wrap h5 {
    font-size: 1.5rem;
    line-height: 100%;
    font-weight: bold;
    text-align: left;
    margin-bottom: 10px;
}
#sec_03 .voice .wrap p {
    font-size: 1.3rem;
    line-height: 160%;
    text-align: left;
}


.sec_top {
    display: none;
    position: relative;
    z-index: 2;
}
.sec_top.active {
    display: block;
}

.sec_top .inner {
    transition: all 0s;
    opacity: 0;
    transform: translateY(15px);
}
.sec_top .inner.an {
    transition: all 0.6s;
    opacity: 1;
    transform: translateY(0px);
}





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

    section#titleArea {
        max-width: 1200px;
        margin: auto;
        margin-top: 25vw;
        font-size: 1px;
        letter-spacing: -5px;
        line-height: 0;
        padding-bottom: 10vw;
    }

    section#titleArea .heading {
        display: inline-block;
        letter-spacing: normal;
        vertical-align: bottom;
    }
    section#titleArea .heading .wrap {
        display: inline-block;
    }
    
    section#titleArea .heading .wrap h2 img {
        width: 34vw;
        max-width: 179px
    }
    section#titleArea .heading p {
        margin: 8vw 3vw 0;
        font-size: 1.4rem;
        line-height: 170%;
        font-weight: bold;
        text-align: justify;
        text-justify: inter-ideograph;
    }



    .tabArea {
        width: 100%;
        margin: auto;
        padding: 0 0;
    }
    .tabArea ul::after {
        content: '';
        clear: both;
        display: block;
    }
    .tabArea li {
        display: block;
        width: calc(33.333333%);
        height: calc(16.666666vw);
        float: left;
        margin: 0;
        transition: all 0.3s;
        transform-origin: bottom;
        position: relative;
        z-index: 1;
    }
    .tabArea li a {
        display: block;
        height: 100%;
    }
    .tabArea li span {
        display: block;
        text-indent: 100%;
        white-space: nowrap;
        overflow: hidden;
    }
    .tabArea#tabArea_top li {
        margin-bottom: -10px;
    }
    .tabArea#tabArea_bottom li {
        margin-top: -10px;
    }
    .tabArea#tabArea_top li:hover {
        transform: translateY(5px);
    }
    .tabArea#tabArea_bottom li:hover {
        transform: translateY(-5px);
    }
    .tabArea li.active:hover {
        transform: none!important;
    }
    .tabArea li.active a {
        cursor: default;
    }
    #tabArea_top li.tab_01 {
        background: url(../images/seido/tab_01_off.png) center top/cover no-repeat;
    }
    #tabArea_top li.tab_02 {
        background: url(../images/seido/tab_02_off.png) center top/cover no-repeat;
    }
    #tabArea_top li.tab_03 {
        background: url(../images/seido/tab_03_off.png) center top/cover no-repeat;
    }
    #tabArea_top li.tab_01.active {
        background: url(../images/seido/tab_01.png) center top/cover no-repeat;
    }
    #tabArea_top li.tab_02.active {
        background: url(../images/seido/tab_02.png) center top/cover no-repeat;
    }
    #tabArea_top li.tab_03.active {
        background: url(../images/seido/tab_03.png) center top/cover no-repeat;
    }
    #tabArea_bottom li.tab_01 {
        background: url(../images/seido/bottom_tab_01_off.png) center bottom/cover no-repeat;
    }
    #tabArea_bottom li.tab_02 {
        background: url(../images/seido/bottom_tab_02_off.png) center bottom/cover no-repeat;
    }
    #tabArea_bottom li.tab_03 {
        background: url(../images/seido/bottom_tab_03_off.png) center bottom/cover no-repeat;
    }
    #tabArea_bottom li.tab_01.active {
        background: url(../images/seido/bottom_tab_01.png) center bottom/cover no-repeat;
    }
    #tabArea_bottom li.tab_02.active {
        background: url(../images/seido/bottom_tab_02.png) center bottom/cover no-repeat;
    }
    #tabArea_bottom li.tab_03.active {
        background: url(../images/seido/bottom_tab_03.png) center bottom/cover no-repeat;
    }
    #tabArea_bottom {
        margin-bottom: 20vw;
    }


    #contentsArea {
        max-width: 1230px;
        padding: 0 0;
        margin: auto;
        overflow: hidden;
    }
    #sec_01 {
        background: #ffaf51;
        border-radius: 0;
        padding: 6vw 3vw;
    }
    #sec_01_0 {
        background: #FFF;
        border-radius: 10px;
        padding: 3vw;
        margin-bottom: 5vw;
    }
    #sec_01_0 img {
        max-width: 985px;
        width: 100%;
        height: auto;
    }
    #sec_01_0 p {
        margin: 10px 0 0 ;
        font-size: 1.1rem;
        line-height: 140%;
        color: #999;
        text-align: left;
        max-width: 640px;
        text-align: justify;
        text-justify: inter-ideograph;
    }
    #sec_01_1 {
        background: #d9f7f1;
    }
    #sec_01_2 {
        background: #d0e5f5;
    }
    #sec_01_3 {
        background: #e7dff7;
    }
    #sec_01_4 {
        background: #e2f3db;
    }
    #sec_01 .sec_det {
        padding: 5vw 0 3vw;
    }
    #sec_01 .sec_det::after {
        content: '';
        clear: both;
        display: block;
    }
    #sec_01 .sec_det .leftArea {
        float: none;
        display: block;
        width: auto;
        position: relative;
        padding-right: 0;
        min-height: 260px;
    }
    #sec_01 .sec_det .leftArea h3 {
        position: absolute;
        left: 14px;
        top: 4px;
        width: auto;
        height: 100%;
    }
    #sec_01 .sec_det .leftArea .text {
        font-size: 1.3rem;
        line-height: 160%;
        text-align: left;
        margin: 0 4vw 0 80px;
    }
    #sec_01 .sec_det .leftArea p {
        margin-bottom: 0.5em;
        text-align: justify;
        text-justify: inter-ideograph;
    }
    #sec_01 .sec_det .leftArea small {
        font-size: 0.7em;
    }
    #sec_01 .sec_det .leftArea p.at {
        font-size: 1.1rem;
        line-height: 160%;
        text-indent: -1em;
        padding-left: 1em;
    }
    #sec_01 .sec_det .rightArea {
        float: none;
        display: block;
        width: auto;
        text-align: left;
        padding: 0 3vw;
        text-align: center;
    }
    #sec_01 .sec_det .rightArea img.photo {
        margin-top: 0;
        width: 100%;
        max-width: 400px;
    }
    #sec_01 .sec_det .rightArea .balloon {
        background: #FFF;
        width: auto;
        height: auto;
        min-height: 0;
        position: relative;
        margin: 10px 0 20px;
        padding: 3vw 4vw;
        border-radius: 5vw;
        box-shadow: 1px 1px 1px rgba(0,0,0,0.1);
    }
    #sec_01 .sec_det .rightArea .balloon p {
        position: relative;
        left: 0;
        top: 0;
        width: auto;
        font-size: 1.3rem;
        line-height: 160%;
        padding-top: 40px;
        text-align: justify;
        text-justify: inter-ideograph;
    }
    #sec_01 .sec_det .rightArea .balloon p::before {
        content: '体験者の声';
        position: absolute;
        top: 0;
        left: 0;
        background: url(../images/seido/t03_balloon.png) left top/contain no-repeat;
        width: 100%;
        height: 30px;
        font-size: 1.6rem;
        line-height: 30px;
        padding-left: 55px;
    }
        


    #sec_02 {
        background: #438dda;
        border-radius: 0;
        padding: 6vw 3vw;
    }

    #sec_03 {
        background: #6ed4dd;
        border-radius: 0;
        padding: 6vw 3vw;
    }

    ul.tileArea {
        display: block;
        font-size: 1px;
        line-height: 0;
        letter-spacing: -5px;
        margin: 0 auto 0;;
        text-align: left;
        max-width: 1230px;
    }
    ul.tileArea li {
        letter-spacing: normal;
        display: block;
        max-width:none;
        width: auto;
        border-radius: 10px;
        vertical-align: top;
        padding: 4vw 0;
        margin: 0 2vw 4vw;
        text-align: center;
        background: #FFF;
    }
    ul.tileArea h5 img {
        width: 20vw;
        max-width: 99px;
    }
    ul.tileArea li h5 span {
        display: block;
        font-size: 1.6rem;
        line-height: 120%;
        margin: 3vw 0 0;
        font-weight: bold;
    }
    ul.tileArea li p {
        font-size: 1.3rem;
        line-height: 150%;
        text-align: left;
        margin: 3vw 5vw 0;
        text-align: justify;
        text-justify: inter-ideograph;
    }

    #sec_03 .voice {
        margin: 35px 9px 0;
    }
    #sec_03 .voice::after {
        content: '';
        display: block;
        clear: both;
    }
    #sec_03 .voice h4 {
        border-bottom: #202020 2px solid;
        padding-bottom: 10px;
        margin-bottom: 18px;
    }
    #sec_03 .voice h4 span {
        color: #202020;
        font-size: 1.7rem;
        font-weight: bold;
        line-height: 100%;
        position: relative;
    }
    #sec_03 .voice h4 span::after {
        content: '';
        position: absolute;
        right: -77px;
        bottom: 5px;
        background: url(../images/seido/t03_balloon.png) no-repeat;
        width: 69px;
        height: 46px;
    }

    #sec_03 .voice .wrap {
        float: left;
        width: 50%;
        position: relative;
        padding: 0 20px 0 115px;
        color: #202020;
        min-height: 130px;
        margin-bottom: 30px;
    }
    #sec_03 .voice .wrap img {
        position: absolute;
        left: 0;
        top: 25px;
        border-radius: 10px;
    }
    #sec_03 .voice .wrap h5 {
        font-size: 1.5rem;
        line-height: 100%;
        font-weight: bold;
        text-align: left;
        margin-bottom: 10px;
    }
    #sec_03 .voice .wrap p {
        font-size: 1.3rem;
        line-height: 160%;
        text-align: left;
    }


    .sec_top {
        display: none;
        position: relative;
        z-index: 2;
    }
    .sec_top.active {
        display: block;
    }

    .sec_top .inner {
        transition: all 0s;
        opacity: 0;
        transform: translateY(15px);
    }
    .sec_top .inner.an {
        transition: all 0.6s;
        opacity: 1;
        transform: translateY(0px);
    }

}/*640*/















</pre></body></html>