@charset "utf-8";

html {
    font-size: 62.5%;
    overflow: auto
}
body {
    font-family: "ryo-gothic-plusn", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 28px;
    line-height: 1.5;
    color: #0f1e3c;
    min-width: 1000px;
    max-width: 2000px;
    margin: 0 auto;
    -webkit-text-size-adjust: 100%
}
.dib {display: inline-block}
.dc {display: contents}
.br6 {border-radius: 6px}
.br15 {border-radius: 15px}
.db, .pc {display: block}
.dn, .sp {display: none}
.tal {text-align: left;}
.tac {text-align: center;}
.tar {text-align: right;}
.relative {position: relative;}
.absolute {position: absolute;}
.abc {
  position: absolute;
  left: 0;
  right: 0;
}
.flare {
  position: absolute;
  mix-blend-mode: screen;
}
.z1 {z-index: 1;}

.box {
    max-width: 940px;
    margin-right: auto;
    margin-left: auto;
    position: relative
}
.m_box {
    max-width: 860px;
    margin-right: auto;
    margin-left: auto;
    position: relative
}

.white_box {
    background: #fff;
    margin: 0 5px 0 0;
    box-shadow: 5px 5px 0 #00000026
}
.grey_box {
    background: #f0f5fa;
    margin: 0 5px 0 0;
    box-shadow: 5px 5px 0 #00000026
}
.blue_box {
    background: #fff;
    box-shadow: 0 0 0 3px #1e3c96 inset;
}

.mb5 {margin-bottom: 5px}
.mb10 {margin-bottom: 10px}
.mb15 {margin-bottom: 15px}
.mb20 {margin-bottom: 20px}
.mb30 {margin-bottom: 30px}
.mb45 {margin-bottom: 45px}
.mb60 {margin-bottom: 60px}
.mb90 {margin-bottom: 90px}
.mb120 {margin-bottom: 120px}
.mr10 {margin-right: 10px}
.ml15 {margin-left: 15px}
.p15 {padding: 15px}
.p20 {padding: 20px}
.p30 {padding: 30px}
.p45 {padding: 45px}
.pb30 {padding-bottom: 30px}
.pb45 {padding-bottom: 45px}
.pb60 {padding-bottom: 60px}
.pt30 {padding-top: 30px}
.pt45 {padding-top: 45px}
.pt60 {padding-top: 60px}
.pt75 {padding-top: 75px}
.pt90 {padding-top: 90px}
.pt120 {padding-top: 120px}
.pt175 {padding-top: 175px}
.pl40 {padding-left: 40px}
.ptb15 {padding: 15px 0}
.ptb30 {padding: 30px 0}
.ptb45 {padding: 45px 0}
.ptb60 {padding: 60px 0}


b, h2, h3, h4, mark, strong {
    font-family: "ryo-gothic-plusn", sans-serif;
    font-weight: 700
}
i {
    display: inline-block;
    font-style: normal;
    transform: rotate(15deg);
    margin: 0 0 0 5px
}

/*----- img -----*/
.c_img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.r_img {
  display:block;
  margin-left: auto;
}
.h_img {transition: 0.3s;}
.h_img:hover {opacity: 0.8;}

.wfit {width: fit-content;}


.orange {color: #ff783c}
.blue {color: #1e3c96}
.lblue {color: #0078d2}
.yellow {color: #ffff4b}
.yellow02 {color: #ffd24b}
.orange {color: #ff783c}
.white {color: #fff}
.black {color: #0f1e3c}

.white_bg {background: #fff;}
.blue_bg {
    background: url(../img/common/blue_bg.svg) repeat-y center top;
    background-size: 2000px
}
.blue_bg02 {background: #1e3c96}
.grey_bg {background: #f0f5fa}

mark {
    background: linear-gradient(transparent 60%, #ffff4b 0);
    background-position: left top
}

.fs12 {font-size: 12px}
.fs14 {font-size: 14px}
.fs18 {font-size: 18px}
.fs20 {font-size: 20px}
.fs22 {font-size: 22px}
.fs24 {font-size: 24px}
.fs26 {font-size: 26px}
.fs28 {font-size: 28px}
.fs30 {font-size: 30px}
.fs36 {font-size: 36px}
.fs38 {font-size: 38px}
.fs40 {font-size: 40px}
.fs42 {font-size: 42px}
.fs44 {font-size: 44px}
.fs52 {font-size: 52px}

small {font-size: 80%}
.fs120p {font-size: 120%}

.fw400 {font-weight: 400}
.fw700 {font-weight: 700}

.lh1 {line-height: 1;}
.lh12 {line-height: 1.2;}
.lh13 {line-height: 1.3;}

.flex {display: flex;}
.rev {flex-direction:row-reverse}
.fww {flex-wrap: wrap;}
.aic {align-items: center;}
.aie {align-items: flex-end;}
.jcs {justify-content: space-between;}
.jcc {justify-content: center;}
.jce {justify-content: flex-end;}

.slider {
    opacity: 0;
    transition: 3s
}
.slick-initialized {
    opacity: 1
}
.slick-slide {
    cursor: grab
}

#sub, #sub h2, #sub h3 {
    font-family: "ryo-gothic-plusn", sans-serif;
    font-weight: 400;
    font-style: normal;
}
#sub h2, #sub h3 {
    font-weight: 700
}
#sub table {
    width: 100%
}
#sub th {
    text-align: left;
    background: #1e3c96;
    border-bottom: 1px solid #fff;
    color: #fff;
    padding: 15px;
    width: 320px
}

#sub td {
    padding: 15px;
    background: #fff;
    border-bottom: 1px solid #1e3c96
}

.ofa {
    height: 200px;
    overflow-y: auto;
    background: #fff;
    padding: 20px;
    border: 1px solid #ccc
}

/* 点滅 */
.caution {
  animation: blink 0.7s ease-out infinite alternate;
}
@keyframes blink{
  0% {opacity:0;}
  100% {opacity:1;}
}

@media screen and (max-width:480px) {
    html {
        font-size: 100%;
        overflow: auto
    }

    body {
        overflow: hidden;
        position: relative
    }

    .pc {
        display: none
    }

    .sp {
        display: block
    }

    .fs20, .fs22 {
        font-size: 28px
    }

    mark, mark.fs24, mark.fs28 {
        font-size: 32px
    }

    .fs38 mark {
        font-size: 38px
    }

    .h_img:hover {
        opacity: 1
    }

    .blue_bg {
        background: linear-gradient(to right, #34adf1 0, #259ef1 100%)
    }
}