@charset "utf-8";
/* CSS Document */

/*----pc----*/

.sp1000 {
    display: none;
}

.sp-only {
    display: none;
}


body {
    color: #333;
    font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
}

#container {
    border-top: 4px solid #00ADE5;
}

/*--header--*/

header {}

.header__inner {
    width: 100%;
    max-width: 1140px;
    height: 60px;
    margin: 0 auto;
    padding: 12px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header__logo img {
    width: 80px;
}

.header__credit p {
    font-size: 12px;
    font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
    color: #000;
}

/*--mv--*/

#mv {
    padding: 0 20px;
    background-image: url("images/mv_bg.jpg");
}

.mv__inner {
    width: 100%;
    max-width: 1140px;
    padding: 0 20px;
    margin: 0 auto;

    display: flex;
}

.mv__left {
    width: 100%;
    max-width: 380px;
    height: 380px;
    border: 10px solid #00ADE5;
    background-image: linear-gradient( -45deg, #00ADE5 0%, #00ADE5 50%, #19B5E8 50%, #19B5E8 100%);
    background-position: left top;
    background-size: cover;
    padding: 20px;
    color: #fff;
    font-weight: bold;
    margin-right: 27px;
}

.mv__left-01 p {
    display: flex;
    align-items: center;
}

.mv__left-01 p::after {
    content: '';
    display: inline-block;
    background: #5FCBEF;
    width: 100%;
    max-width: 172px;
    height: 2px;
    margin-left: 20px;
}

.mv__left-02 {
    margin: 20px auto;
}

.mv__left-02 img {
    width: 100%;
    max-width: 318px;
}

.mv__left-03 {
    text-align: center;
}

.mv__left-03 img {
    width: 100%;
    max-width: 300px;
    margin: 0 auto;
}

.mv__left-04 {
    margin-top: 20px;
    text-align: center;

}

.mv__left-04 img {
    width: 100%;
    max-width: 305px;
    margin: 0 auto;
}

.mv__right {
    width: 100%;
    max-width: 692px;
}

.mv__right p {
    font-size: 20px;
    font-weight: bold;
    color: #00ACE5;
    margin-top: 20px;
    line-height: 1.7;
}

h1 {
    font-size: 64px;
    font-weight: bold;
    color: #00ACE5;
    margin-top: 10px;
    line-height: 1.2;
    letter-spacing: -7px;
}

.mv__right .lead {
    font-size: 16px;
    font-weight: normal;
    color: #000;
    margin-top: 20px;
    line-height: 1.8;
}


/*--gNav--*/

#gNav {}

#gNav ul {
    display: flex;
    width: 100%;
    max-width: 1140px;
    padding: 0 20px 30px;
    margin: 30px auto 0;
}

#gNav ul li {
    width: 100%;
    max-width: 550px;
    height: 64px;
    /*border: 1px solid #01ADE5;*/
    text-align: center;
    /*background: #fff;*/
}

#gNav ul li:nth-child(1) {}

#gNav ul li:nth-child(2) a {
    border-left: none;
}

#gNav ul li a {
    line-height: 64px;
    color: #00ADE5;
    font-size: 18px;
    display: block;
    position: relative;
    background: #fff;
    border: 1px solid #01ADE5;
}

#gNav ul li i {
    position: absolute;
    top: 23px;
    right: 25px;
}

/*--main--*/

#main {
    background-color: #F0FCFF;
}

.conts {
    width: 100%;
    max-width: 1140px;
    padding: 70px 20px;
    margin: 0 auto;
}

section {
    background: #fff;
    padding: 0 50px 45px;
}

.tag {
    width: 100%;
    height: 50px;
    background-color: #00ADE5;
    position: relative;
    top: -19px;
}

.tag01 {
    max-width: 280px;

}

.tag02 {
    max-width: 151px;
}

.tag::after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 19px 0 0 10px;
    border-color: transparent transparent transparent #000;
    position: absolute;
    right: -10px;
    top: 0;
}

.tag p {
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    line-height: 50px;
    text-align: center;
}

h2 {
    font-size: 48px;
    font-weight: normal;
    line-height: 1.3;
    margin-top: 45px;
    background-image: url(images/bracket01.png);
    background-position: right bottom;
    background-repeat: no-repeat;
}

.tag + h2 {
    margin-top: 20px;
}

.main__flex {
    margin-top: 50px;
    display: flex;
    justify-content: space-between;
}

.main__img {
    width: 100%;
    max-width: 300px;
    line-height: 0;
}

.main__text {
    flex: 1;
}

.main__text p {
    font-size: 16px;
    line-height: 1.8;
}

.main__img p {
    font-size: 16px;
    line-height: 1.7;
    margin: 30px 0
}

.main__img p span {
    font-size: 22px;
    font-weight: bold;
}

.main__img img {
    width: 100%;
}

.main__img img + img {
    margin-top: 20px;
}

.main__flex > p {
    width: 100%;
}

.main__flex div:nth-child(1) {
    margin-right: 60px;
}

.main__univ {
    border: 1px solid #05ADE5;
    height: 40px;
    margin-top: 55px;
}

.main__univ p {
    font-size: 18px;
    font-weight: bold;
    color: #00ADE5;
    line-height: 40px;
    text-align: center;
}

.main__address {
    border-top: 1px solid #EEE;
    border-bottom: 1px solid #EEE;
    height: 94px;
    margin-top: 35px;
}

.main__address a {
    color: #333;
}

.address__univ {
    display: flex;
    padding: 22px 0;
}

.address__univ p:nth-child(1) {
    font-size: 16px;
    font-weight: bold;
    height: 50px;
    background-color: #00ACE5;
    color: #fff;
    text-align: center;
    width: 100%;
    max-width: 195px;
    line-height: 50px;
    margin-right: 35px;

}

.address__univ p:nth-child(2) {
    width: 100%;
    font-size: 16px;
    line-height: 1.7;
    position: relative;
}

.address__univ p:nth-child(2) i {
    position: absolute;
    top: 15px;
    right: 25px;
    font-size: 25px;
    color: #ddd;
}

#ttl02 {
    margin-top: 65px;
}

h3 {
    font-size: 30px;
    line-height: 1.4;
    display: flex;
    margin-top: 50px;
    font-weight: normal;
}

h3::before {
    content: '';
    display: inline-block;
    background: #5FCBEF;
    width: 100%;
    max-width: 7px;
    height: 40px;
    margin-right: 30px;
}

.notes {
    border: 1px solid #EEE;
    margin-top: 25px;
}

.notes p {
    padding: 15px 10px;
    font-size: 14px;
    line-height: 1.8;
}

.arrowLine {
    border-top: 2px solid #00ADE5;
    position: relative;
    width: 100%;
    margin-top: 38px;
}

.arrowLine-arrow {
    width: 70px;
    height: 70px;
    border-left: 2px solid #00ADE5;
    border-bottom: 2px solid #00ADE5;
    transform: rotate(-45deg);
    position: absolute;
    top: -36px;
    left: 0;
    right: 0;
    margin: auto;
    background: linear-gradient(45deg, #fff 0%, #fff 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 100%);
}

h3 + .main__flex {
    align-items: center;
}

.arrowLine + h3 + .main__flex {
    margin-top: 30px;
    flex-wrap: wrap;
    justify-content: space-between;
}

.main__box {
    width: 220px;
    height: 212px;
    background-color: #FBFBF4;
    margin-right: 0 !important;
}

.main__box p {
    font-size: 16px;
    line-height: 1.8;
    padding: 22px 18px;
}



/*h3 + .main__text {
    margin-top: 45px;
}

h3 + .main__text p {
    line-height: 1.7;
}

h4 {
    margin-top: 35px;
    font-size: 16px;
}

.main__flex ul {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    max-width: 700px;
}

.main__flex ul li {
    margin-right: 20px;
}*/

/*--pageTop--*/

#pageTop {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
}

.pageTop__inner {
    position: fixed;
    bottom: 90px;
    width: 50px;
    height: 50px;
    background-color: rgba(37, 61, 95, .9);
    left: 50%;
    margin-left: 500px;
}

.pageTop__inner p {
    font-size: 40px;
}

.pageTop__inner p a {
    color: #fff;
    line-height: 50px;
    text-align: center;
    display: block;
}

/*--fixed--*/

#fixed {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 90px;
    background-color: rgba(37, 61, 95, .9);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: .5s;
}

#fixed > p {
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    margin-right: 35px;
}

.fixed-btn {
    width: 255px;
    height: 50px;
    background-color: #fff;
    position: relative;
}

.fixed-btn p {
    font-size: 18px;
    line-height: 50px;
    font-weight: bold;
    color: #0C264C;
    margin-left: 25px;
}

.fixed-btn p a {
    color: #0C264C;
    display: block;
}

.fixed-btn p i {
    position: absolute;
    top: 14px;
    right: 25px;
    font-size: 25px;
}

.none {
    opacity: 0;
    transition: .5s;
}



/*--footer--*/

footer {
    width: 100%;
    background-color: #00ADE5;
}

.footer__inner {
    width: 100%;
    max-width: 1040px;
    padding: 0 20px;
    margin: 0 auto;
}

.footer__title {
    margin: 0 auto;
    padding-top: 60px;
}

h4 {
    padding: 25px 20px;
    font-size: 32px;
    font-weight: bold;
    line-height: 1.7;
    color: #fff;
    text-align: center;
    background-image: url(images/bracket02.png), url(images/bracket03.png);
    background-repeat: no-repeat;
    background-position: left top, right bottom;
}

.footer__lead {
    margin-top: 45px;
}

.footer__lead p {
    font-size: 16px;
    font-weight: bold;
    line-height: 1.8;
    color: #fff;
}

.footer__flex {
    margin-top: 60px;
    display: flex;
    justify-content: space-between;
}

.footer__left,
.footer__right {
    display: flex;
    width: 100%;
    max-width: 480px;
    align-items: center;
}

.footer__left {
    margin-right: 20px;
}

.footer__left-01,
.footer__right-01 {
    width: 100px;
    height: 100px;
    background-color: #0D274D;
    margin-right: 20px;
}

.footer__left-01 p,
.footer__right-01 p {
    text-align: center;
    font-size: 16px;
    line-height: 100px;
    color: #fff;
    font-weight: bold;
}


.footer__left-02,
.footer__right-02 {
    width: 100%;
    max-width: 360px;
    flex: 1;
}

.footer__left-02 p,
.footer__right-02 p {
    font-size: 16px;
    font-weight: bold;
    line-height: 1.8;
    color: #fff;
}

.footer__info {}

.footer__info__inner {
    padding: 0 55px 35px;
    background-color: #fff;
    margin-top: 50px;
}

h5 {
    font-size: 16px;
    font-weight: bold;
    padding-top: 50px;
    color: #00ACE5;
    line-height: 1.8;
}

.footer__info__inner p {
    font-size: 16px;
    color: #000;
    line-height: 1.8;
}

.footer__info__inner ul {}

.footer__info__inner ul li {
    font-size: 16px;
    line-height: 1.8;
    padding-left: 1em;
    text-indent: -1em;
}

.footer__info__inner ul .asterisk {
    list-style-type: none;
    text-indent: -1em;
}


.footer__info__inner ul li::before {
    display: inline;
    content: "・";
}

.footer__info__inner ul .asterisk::before {
    display: inline;
    content: "※";
}

.footer__logo {
    width: 100%;
    max-width: 191px;
    margin: 35px auto 0;
}

.footer__logo img {
    width: 100%;
}


.application {
    width: 100%;
    height: 70px;
    background: linear-gradient(0deg, #0D274D 0%, #0D274D 50%, #193256 50%, #193256 100%);
    margin-top: 60px;
}

.application p {
    position: relative;
    font-size: 24px;
    font-weight: bold;
    line-height: 1.7;
    color: #fff;
    text-align: center;
    line-height: 70px;
}

.application p a {
    color: #fff;
    display: block;
}

.application p i {
    position: absolute;
    top: 23px;
    right: 25px;
    font-size: 25px;
    color: #fff;
}

.copyright {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 130px;
}

.copyright p {
    font-size: 14px;
    font-weight: bold;
    line-height: 1.7;
    color: #fff;
}

/*----sp----*/

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


    .sp1000 {
        display: block;
    }

    .mv__inner {
        flex-wrap: wrap;
        text-align: center;
        padding: 0;
    }
    .mv__left {
        margin: 0 auto;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        max-width: 710px;
        height: auto;
        padding: 0 0 1% 2%;
        align-items: center;
        background-image: linear-gradient( -45deg, #00ADE5 0%, #00ADE5 78.5%, #19B5E8 50%, #19B5E8 100%);
    }

    .mv__left-01 {
        width: 49%;
        margin: 0;
    }
    .mv__left-01 p {
        width: 100%;
    }
    .mv__left-01 p::after {
        margin-right: 10px;
    }

    .mv__left-01 p img {
        width: 50%;
    }
    .mv__left-02 {
        width: 49%;
        margin: 0;
    }
    .mv__left-03 {
        width: 49%;
        margin: 0;
        margin-top: 10px;
    }
    .mv__left-03 img {
        max-width: 336px;
    }
    .mv__left-04 {
        width: 49%;
        margin: 0;
        margin-top: 10px;
    }

    .mv__right {
        margin: 0 auto;
        max-width: 710px;
    }
    .main__flex {
        flex-wrap: wrap;
    }
    .main__text {
        flex: auto;
    }
    .main__flex div:nth-child(1) {
        margin: 0 auto;
    }
    .main__img {
        margin: 0 auto;
    }
    .arrowLine + h3 + .main__flex {
        justify-content: space-around;
    }
    .main__box {
        margin: 0 10px 10px !important;
        width: 300px;
        height: 130px;
    }
    .footer__flex {
        flex-wrap: wrap;
        margin-top: 40px;
    }
    .footer__left,
    .footer__right {
        margin: 0 auto;
        max-width: 700px;
    }
    .footer__right {
        margin-top: 20px;
    }
    .footer__left-02,
    .footer__right-02 {
        max-width: 580px;
    }

    h2 {
        font-size: 38px;
    }
    #fixed > p {
        font-size: 16px;
        margin-right: 15px;
    }
    .fixed-btn {
        width: 200px;
    }
    .fixed-btn p {
        font-size: 15px;
        margin-left: 20px;
    }
    .fixed-btn p i {
        top: 17px;
        right: 20px;
        font-size: 16px;
    }
    section {
        padding: 0 10px 40px;
    }
    .applicatio {
        margin-top: 30px;
    }
    .conts {
        padding: 40px 20px;
    }
    .footer__title {
        padding-top: 40px;
        max-width: 600px;
    }

    .footer__lead {
        max-width: 700px;
        margin: 21px auto 0;

    }

    .main__img {
        order: 1;
        max-width: 335px;
    }
    .main__text {
        order: 2;
        margin-top: 21px !important;
    }

    .pageTop__inner {
        bottom: 90px;
        right: 20px;
        margin-left: auto;
        left: auto;
        width: 40px;
        height: 40px;
    }

    .pageTop__inner p {
        font-size: 30px;
    }

    .pageTop__inner p a {
        line-height: 40px;
    }



}

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

    .pc-only {
        display: none;
    }
    .sp1000 {
        display: none;
    }

    .sp-only {
        display: block;
    }

    /*--header--*/
    header {}
    .header__inner {
        max-width: 750px;
        padding: 0px;
        height: 38px;
    }
    .header__logo img {
        width: 60px;
    }
    .header__credit p {
        font-size: 9px;
    }

    /*--mv--*/
    .mv__left {
        border: 5px solid #00ADE5;
    }
    .mv__right p {
        text-align: left;
        margin-top: 15px;
        font-size: 12px;
    }
    h1 {
        font-size: 32px;
        margin-top: 10px;
        letter-spacing: -5px;
        text-align: left;
    }
    h1 span {
        letter-spacing: -2.5px;
    }
    .mv__right .lead {
        font-size: 13px;
        margin-top: 25px;
    }


    /*--gNav--*/
    #gNav ul {
        padding: 0 0 30px;
    }
    #gNav ul li {
        font-weight: bold;
        font-size: 13px;
        height: 40px;
    }

    #gNav ul li a {
        font-weight: bold;
        font-size: 13px;
        line-height: 40px;
        margin-left: -10px;
    }
    #gNav ul li i {
        top: 14px;
        right: 10px;
    }

    /*--main--*/
    .conts {
        padding: 37px 10px;
    }
    .tag p {
        font-size: 12.42px;
        line-height: 35px;
    }
    .tag {
        height: 35px;
    }
    .tag01 {
        max-width: 158.5px;
    }
    h2 {
        font-size: 24px;
        margin-top: 20px;
        background-image: none;
        letter-spacing: -1px;
    }
    .tag + h2 {
        margin-top: 8px;
    }
    .main__flex {
        margin-top: 34px;
    }
    .main__img {
        order: 1;
        max-width: 335px;
    }
    .main__img p {
        font-size: 13px;
        margin: 17px 0 24px;
    }
    .main__img img {}
    .main__img p span {
        font-size: 20px;
    }
    .main__text {
        order: 2;
        margin-top: 21px !important;
    }
    .main__text p {
        font-size: 13px;
    }
    .main__univ {
        margin-top: 40px;
        height: 30px;
    }
    .main__univ p {
        font-size: 16px;
        line-height: 30px;
    }
    .main__address {
        height: auto;
        margin-top: 20px;
    }
    .address__univ {
        flex-wrap: wrap;
        padding: 10px 0;
    }
    .address__univ p:nth-child(1) {
        margin: 0 auto;
        font-size: 14px;
        height: 40px;
        line-height: 40px;
    }
    .address__univ p:nth-child(2) {
        font-size: 14px;
        margin-top: 10px;
    }
    #ttl02 {
        margin-top: 37px;
    }
    .arrowLine-arrow {
        width: 35px;
        height: 35px;
        top: -18.5px;
    }
    application {
        margin-top: 20px;
    }

    .application {
        margin-top: 40px;
    }
    .application p {
        font-size: 13px;
    }
    h3 {
        font-size: 18px;
        align-items: center;
    }
    h3::before {
        margin-right: 10px;
    }
    .notes p {
        padding: 10px;
        font-size: 9px;
    }
    .main__box {}
    .main__box p {
        font-size: 13px;
    }
    #fixed {
        flex-wrap: wrap;
        padding: 10px;
    }
    #fixed > p {
        font-size: 13px;
        margin-right: 5px;
        text-align: center;
        margin-right: 0;
    }
    .fixed-btn {
        height: 30px;
    }
    .fixed-btn p {
        font-size: 13px;
        text-align: center;
        margin-left: 0;
        line-height: 30px;
    }
    .fixed-btn p i {
        top: 8px;
    }
    /*--footer--*/
    footer {
        width: 100%;
        background-color: #00ADE5;
    }

    h4 {
        padding: 10px;
        font-size: 16px;
    }
    .footer__lead p {
        font-size: 13px;
    }
    .footer__left-02 p,
    .footer__right-02 p {
        font-size: 13px;
    }
    .footer__info__inner {
        padding: 0 10px 35px;
    }
    h5 {
        font-size: 13px;
        padding-top: 21px;
    }
    .footer__info__inner p {
        font-size: 13px;
    }
    .footer__info__inner ul li {
        font-size: 13px;
    }
    .copyright {
        display: flex;
        justify-content: center;
        align-items: center;
        height: auto;
        padding: 18px;
    }
    .copyright p {
        font-size: 10px;
        line-height: 1.9;
    }
}

@media screen and (max-width: 350px) {
    .header__credit p {
        font-size: 8px;
    }
    h1 {
        font-size: 28px;
    }
    #gNav ul li {
        font-size: 12px;
    }
    #gNav ul li a {
        font-size: 12px;
    }
    .none-br {
        display: none;
    }
    .application p {
        font-size: 11px;
    }
}