@charset "utf-8";

/* Modules
---------------------------------------*/
/* Margin SP */
@media screen and (max-width : 767px) {
    .mt0 { margin-top: 0!important }
    .mt-5 { margin-top: .5rem!important }
    .mt1 { margin-top: 1rem!important }
    .mt1-5 { margin-top: 1.5rem!important }
    .mt2 { margin-top: 2rem!important }
    .mt3 { margin-top: 3rem!important }
    .mt4 { margin-top: calc(4rem/2)!important }
    .mt5 { margin-top: calc(5rem/2)!important }
    .mt6 { margin-top: calc(6rem/2)!important }
    .mt7 { margin-top: calc(7rem/2)!important }
    .mt8 { margin-top: calc(8rem/2)!important }
    .mt9 { margin-top: calc(9rem/2)!important }
    .mt10 { margin-top: calc(10rem/2)!important }
    .mt15 { margin-top: calc(15rem/2)!important }

    .mb0 { margin-bottom: 0!important }
    .mb1 { margin-bottom: 1rem!important }
    .mb2 { margin-bottom: 2rem!important }
    .mb3 { margin-bottom: 3rem!important }
    .mb4 { margin-bottom: calc(4rem/2)!important }
    .mb5 { margin-bottom: calc(5rem/2)!important }
    .mb6 { margin-bottom: calc(6rem/2)!important }
    .mb7 { margin-bottom: calc(7rem/2)!important }
    .mb8 { margin-bottom: calc(8rem/2)!important }
    .mb9 { margin-bottom: calc(9rem/2)!important }
    .mb10 { margin-bottom: calc(10rem/2)!important }
    .mb15 { margin-bottom: calc(15rem/2)!important }

    .ml0 { margin-left: 0!important }
    .ml1 { margin-left: 1rem!important }
    .ml2 { margin-left: 2rem!important }
    .ml4 { margin-left: calc(4rem/2)!important }

    .mr0 { margin-right: 0!important }
    .mr1 { margin-right: 1rem!important }
    .mr2 { margin-right: 2rem!important }
    .mr4 { margin-right: calc(4rem/2)!important }

    /* Padding */
    .pt0 { padding-top: 0!important }
    .pt1 { padding-top: 1rem!important }
    .pt2 { padding-top: 2rem!important }
    .pt3 { padding-top: 3rem!important }
    .pt4 { padding-top: calc(4rem/2)!important }
    .pt5 { padding-top: calc(5rem/2)!important }
    .pt6 { padding-top: calc(6rem/2)!important }
    .pt7 { padding-top: calc(7rem/2)!important }
    .pt8 { padding-top: calc(8rem/2)!important }
    .pt9 { padding-top: calc(9rem/2)!important }
    .pt10 { padding-top: calc(10rem/2)!important }
    .pt15 { padding-top: calc(15rem/2)!important }

    .pb0 { padding-bottom: 0!important }
    .pb1 { padding-bottom: 1rem!important }
    .pb2 { padding-bottom: 2rem!important }
    .pb3 { padding-bottom: 3rem!important }
    .pb4 { padding-bottom: calc(4rem/2)!important }
    .pb5 { padding-bottom: calc(5rem/2)!important }
    .pb6 { padding-bottom: calc(6rem/2)!important }
    .pb7 { padding-bottom: calc(7rem/2)!important }
    .pb8 { padding-bottom: calc(8rem/2)!important }
    .pb9 { padding-bottom: calc(9rem/2)!important }
    .pb10 { padding-bottom: calc(10rem/2)!important }
    .pb15 { padding-bottom: calc(15rem/2)!important }
}

/* Margin PC */
@media screen and (min-width : 768px) {
    .mt0 { margin-top: 0!important }
    .mt1 { margin-top: 1rem!important }
    .mt1-5 { margin-top: 1.5rem!important }
    .mt2 { margin-top: 2rem!important }
    .mt3 { margin-top: 3rem!important }
    .mt4 { margin-top: 4rem!important }
    .mt5 { margin-top: 5rem!important }
    .mt6 { margin-top: 6rem!important }
    .mt7 { margin-top: 7rem!important }
    .mt8 { margin-top: 8rem!important }
    .mt9 { margin-top: 9rem!important }
    .mt10 { margin-top: 10rem!important }
    .mt15 { margin-top: 15rem!important }

    .mb0 { margin-bottom: 0!important }
    .mb1 { margin-bottom: 1rem!important }
    .mb2 { margin-bottom: 2rem!important }
    .mb3 { margin-bottom: 3rem!important }
    .mb4 { margin-bottom: 4rem!important }
    .mb5 { margin-bottom: 5rem!important }
    .mb6 { margin-bottom: 6rem!important }
    .mb7 { margin-bottom: 7rem!important }
    .mb8 { margin-bottom: 8rem!important }
    .mb9 { margin-bottom: 9rem!important }
    .mb10 { margin-bottom: 10rem!important }
    .mb15 { margin-bottom: 15rem!important }

    .ml0 { margin-left: 0!important }
    .ml1 { margin-left: 1rem!important }
    .ml2 { margin-left: 2rem!important }
    .ml4 { margin-left: 4rem!important }

    .mr0 { margin-right: 0!important }
    .mr1 { margin-right: 1rem!important }
    .mr2 { margin-right: 2rem!important }
    .mr4 { margin-right: 4rem!important }

    /* Padding */
    .pt0 { padding-top: 0!important }
    .pt1 { padding-top: 1rem!important }
    .pt2 { padding-top: 2rem!important }
    .pt3 { padding-top: 3rem!important }
    .pt4 { padding-top: 4rem!important }
    .pt5 { padding-top: 5rem!important }
    .pt6 { padding-top: 6rem!important }
    .pt7 { padding-top: 7rem!important }
    .pt8 { padding-top: 8rem!important }
    .pt9 { padding-top: 9rem!important }
    .pt10 { padding-top: 10rem!important }
    .pt15 { padding-top: 15rem!important }

    .pb0 { padding-bottom: 0!important }
    .pb1 { padding-bottom: 1rem!important }
    .pb2 { padding-bottom: 2rem!important }
    .pb3 { padding-bottom: 3rem!important }
    .pb4 { padding-bottom: 4rem!important }
    .pb5 { padding-bottom: 5rem!important }
    .pb6 { padding-bottom: 6rem!important }
    .pb7 { padding-bottom: 7rem!important }
    .pb8 { padding-bottom: 8rem!important }
    .pb9 { padding-bottom: 9rem!important }
    .pb10 { padding-bottom: 10rem!important }
    .pb15 { padding-bottom: 15rem!important }
}

/* Width */
.w100 { width: 100% !important }
.w70 { width: 70% !important }
.w50 { width: 50% !important }

/* Text-align */
.tal { text-align: left !important }
.tar { text-align: right !important }
.tac { text-align: center !important }

/* Vergical-align */
.vat { vertical-align: top !important }
.vab { vertical-align: bottom !important }
.vam { vertical-align: middle !important }

/* Display */
.db { display: block !important }
.dib { display: inline-block !important }

/* Float */
.fll { float: left !important }
.flr { float: right !important }
.flc { float: center !important }
.cl::after { content: ''; display: block; clear: both; height: 0 }

/* Inner */
.inner {
    width: 100%;
    padding: 0 2rem;
}
@media screen and (min-width : 960px) {
    .inner {
        width: 100%;
        max-width: 960px;
        min-width: 320px;
        margin: 0 auto;
        padding: 0;
    }
}

/* responsive */
.sp-obj { display: block; }
.pc-obj { display: none; }
@media screen and (min-width : 768px) {
    .sp-obj { display: none; }
    .pc-obj { display: block; }
}

/* p */
.txt p+p {
    margin-top: 2.5rem;
}

/* Anchor Link */
.anchor-link {
    display: block;
    margin: 1.5rem 0 1.5rem;
    line-height: 1.4;
    color: #05428e;
    font-weight: 700;
    transition: .15s ease-in-out;
    position: relative;
    padding: 0 0 0 2rem;
}
.anchor-link::before {
    content: '';
    display: block;
    position: absolute;
    top: .5rem;
    left: 1px;
    width: 6px;
    height: 6px;
    border-right: solid 2px #01429c
;
    border-top: solid 2px #01429c
;
    transform: rotate(135deg);
}
@media screen and (min-width : 768px) {
    .anchor-link-columns {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        margin: 1rem 0 5rem -2rem;
    }
    .anchor-link-columns > * {
        list-style: none;
        width: auto;
        max-width: 33.33333%;
        margin: 1.2rem 2rem;
    }
    .anchor-link {
        transition: .15s ease-in-out;
    }
    .anchor-link:hover {
        color: #01429c
;
        text-decoration: underline;
    }
}

/* Arrow Link */
.arrow-link {
    display: inline-block;
    position: relative;
    margin: 1rem 0;
    padding: .3rem 0 .3rem 1.8rem;
    line-height: 1.4;
    font-family: -apple-system, BlinkMacSystemFont, Helvetica, "游ゴシック", "Yu Gothic", メイリオ, Meiryo, Arial, sans-serif;
    font-weight: 700;
    color: #5258AA;
    text-decoration: underline;
    transition: .15s ease-in-out;
}
.arrow-link::before {
    content: '';
    display: block;
    position: absolute;
    top: calc(100%/3);
    left: 0;
    width: 6px;
    height: 6px;
    border-right: solid 2px #5258AA;
    border-top: solid 2px #5258AA;
    transform: rotate(45deg);
    transition: .15s ease-in-out;
}
@media screen and (min-width : 768px) {
    .arrow-link:hover {
        color: #5258AA;
        text-decoration: none;
    }
}

/* List Link */
.list-link {
    list-style: none;
    margin: 1rem 0;
}
.list-link__item {
    position: relative;
    list-style: none;
    margin: .8rem 0;
    padding: 0 0 0 1.5rem;
}
.list-link__item::before {
    content: '';
    display: block;
    position: absolute;
    top: .5rem;
    left: 0;
    width: 10px;
    height: 10px;
    margin: 0 1rem 0 0;
    border-radius: 50%;
    background: #01429c
;
    transition: .15s ease-in-out;
}
.list-link a {
    display: inline-block;
    line-height: 1.4;
    color: #05428e;
    font-weight: 700;
    transition: .15s ease-in-out;
}
@media screen and (min-width : 768px) {
    .list-link a:hover {
        color: #01429c
;
        text-decoration: underline;
    }
}

/* new-win */
.new-win, .new-win--wh {
    display: inline-block;
    position: relative;
    padding-right: 1.3rem;
}
.new-win::after, .new-win--wh::after {
    content: '';
    display: inline-block;
    vertical-align: top;
    margin: .2rem 0 0 .5rem;
    width: 10px;
    height: 10px;
}
.new-win::after {
    background: url('../images/common/icon_new-win.svg') no-repeat 0 0;
    background-size: 100%;
}
.new-win--wh::after {
    background: url('../images/common/icon_new-win_wh.svg') no-repeat 0 0;
    background-size: 100%;
}
@media screen and (min-width : 768px) {
    /* .new-win:hover:after {
            background: url('../images/common/icon_new-win.svg') no-repeat 0 0;
    } */
}

/* .btn01 */
.btn01 {
    display: block;
    position: relative;
    min-width: 230px;
    margin: 1.3rem 5%;
    padding: 2.3rem 2.0rem 1.8rem 2.0rem;
    text-align: center;
    color: #01429c
;
    font-weight: 700;
    border: solid 2px #01429c
;
}
@media screen and (min-width : 768px) {
    .btn01 {
        display: inline-block;
        width: 100%;
        max-width: 300px;
        margin: .5rem 0;
        padding: 2.0rem 2.0rem 2.2rem 2.0rem;
        transition: .35s ease-in-out;
    }
    .btn01:hover {
        color: #fff;
        background: #01429c
;
    }
}

/* Page */
.page-head {
    position: relative;
    padding: 4.5rem 2rem 2rem;
}
.page-head h1 {
    font-size: 2.3rem;
    font-weight: 700;
    text-align: center;
    opacity: 0;
    animation-name: fadeinDown;
    animation-duration: 1s;
    animation-iteration-count: 1;
    animation-delay: .3s;
    animation-fill-mode: forwards;
}
@media screen and (min-width : 768px) {
    .page-head {
        padding: 9rem 13% 3rem;
    }
    .page-head h1 {
        font-size: 4.2rem;
    }
}

/* Section */
* + section {
    margin-top: 3rem;
}
section + section {
    margin-top: 1rem;
}
.con-ttl01 + section {
    margin-top: 5rem;
}
.lead-txt + section {
    margin-top: 5rem;
}
@media screen and (min-width : 768px) {
    section + section {
        margin-top: 10rem;
    }
}

/* Content Title */
h1, h2, h3, h4, h5 {
    margin: 0 0 1.5rem;
}
h2 {
    margin: 1rem 0 2rem;
    font-weight: 700;
    font-size: 2.0rem;
}
*+h2 { margin-top: 5rem }
@media screen and (min-width : 768px) {
    h2 {
        font-size: 3.6rem;
    }
    *+h2 { margin-top: 8rem }
}

h3 {
    margin: 1rem 0 1.5rem;
    font-weight: 700;
    font-size: 1.8rem;
}
*+h3 { margin-top: 4rem }
h2+h3 { margin-top: 1rem }
@media screen and (min-width : 768px) {
    h3 {
        font-size: 2.4rem;
    }
    *+h3 { margin-top: 7rem }
    h2+h3 { margin-top: 2rem }
}

h4 {
    display: inline-block;
    margin: 1rem 0 1.5rem;
    padding: 1.5rem 2rem;
    text-align: left;
    font-weight: 700;
    font-size: 1.5rem;
    background: #f1f1f1;
}
h3+h4 { margin-top: 0 }
*+h4 { margin-top: 2rem }
@media screen and (min-width : 768px) {
    h4 {
        font-size: 1.8rem;
    }
    *+h4 { margin-top: 3rem }
}

h5 {
    margin: 1rem 0 1.5rem;
    font-weight: 700;
    font-size: 1.6rem;
}
h4+h5 { margin-top: 0 }
@media screen and (min-width : 768px) {
    h5 {
        font-size: 1.8rem;
    }
}

/* Text */
.lead-txt {
    margin-bottom: 2rem;
}
.bigger-txt {
    font-size: 1.8rem;
}
.smaller-txt {
    line-height: 1.4;
    font-size: 86%;
}
.caption-txt {
    line-height: 1.6;
    font-size: 1.4rem;
    margin: .5rem auto 0;
}
.note-txt {
    font-size: 1.3rem;
    margin: .5rem auto 1.5rem;
    color: #3D3D3D;
}
.note-txt a {
    color: #3D3D3D;
    text-decoration: underline;
}
.note-txt a:hover {
    text-decoration: none;
}
.attention-txt {
    color: #EE357A;
    font-size: 2.2rem;
}
.bold-txt {
    font-weight: 700;
}
.normal-txt {
    font-weight: normal;
}
.color-txt {
    color: #002c5d;
}

/* List */
.square-list {
    list-style: none;
    margin: 2rem 0;
}
.square-list > li {
    position: relative;
    list-style: none;
    padding: 0 0 0 1.5rem;
}
.square-list > li + li {
    margin: .6rem 0;
}
.square-list > li::before {
    content: '';
    display: block;
    position: absolute;
    top: .7rem;
    left: 0;
    width: 6px;
    height: 6px;
    margin: 0 1rem 0 0;
    background: #5258AA;
}
@media screen and (min-width : 768px) {
    .square-list > li::before {
        top: .9rem;
    }
}