@charset "UTF-8";

/* fix main common */
.breadcrumbNav {
    margin: 0 auto;
}

.breadcrumbNav>.navIn {
    padding: 9px 0 0 !important;
}

@media (max-width: 767px) {
    .breadcrumbNav>.navIn {
        width: auto;
        padding: 7px 10px !important;
    }
}

/* ---------------------------------------------------
 setting
---------------------------------------------------*/
* {
    box-sizing: border-box;
}

html.menuFixed {
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.siteContents sup {
    font-size: 0.7em;
    vertical-align: super;
    transform: unset;
}

.siteContents sub {
    font-size: 0.7em;
    vertical-align: sub;
    transform: unset;
}

.siteContents img {
    max-width: 100%;
}

.forPC {
    display: block;
}

br.forPC {
    display: inline;
}

.forSP {
    display: none;
}

@media (max-width: 767px) {

    br.forPC,
    .forPC {
        display: none;
    }

    .forSP {
        display: block;
    }

    .spsml {
        font-size: .8em;
    }
}

@media (min-width: 768px) {
    .tabOnly {
        display: none;
    }
}

@media (max-width: 767px) {
    .tabOnly {
        display: block;
    }
}

.iblock {
    display: inline-block !important;
    font-size: inherit;
}

.block {
    display: block !important;
}

.justify {
    text-align: justify;
}

/* flex */
.flex {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.flex-between {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.flex-around {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

.flex-center {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

/* text */
.text-center,
.center {
    text-align: center !important;
}

@media screen and (max-width:767px) {
    .sp-center {
        text-align: center;
    }
}

.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}

.sml {
    font-size: .8em;
}

.sml9 {
    font-size: .9em;
}

.tsume {
    font-feature-settings: "palt";
    letter-spacing: .05em;
}

.en {
    font-family: 'Bevan', sans-serif;
    font-weight: normal;
}

.normal {
    font-weight: normal;
}

/* margin */
.mauto {
    margin-left: auto !important;
    margin-right: auto !important;
}

.mtop-0 {
    margin-top: 0 !important;
}

.mtop-1 {
    margin-top: 1em !important;
}

.mtop-2 {
    margin-top: 2em !important;
}

.mtop-3 {
    margin-top: 3em !important;
}

.mtop-4 {
    margin-top: 4em !important;
}

.mbtm-0 {
    margin-bottom: 0 !important;
}

.mbtm-1 {
    margin-bottom: 1em !important;
}

.mbtm-2 {
    margin-bottom: 2em !important;
}

.mbtm-3 {
    margin-bottom: 3em !important;
}

.mbtm-4 {
    margin-bottom: 4em !important;
}

/* padding */
.pbtm-0 {
    padding-bottom: 0 !important;
}

.pbtm-1 {
    padding-bottom: 1em !important;
}

.pbtm-2 {
    padding-bottom: 2em !important;
}

.pbtm-3 {
    padding-bottom: 3em !important;
}

.pbtm-4 {
    padding-bottom: 4em !important;
}

.ptop-0 {
    padding-top: 0 !important;
}

.ptop-1 {
    padding-top: 1em !important;
}

.ptop-2 {
    padding-top: 2em !important;
}

.ptop-3 {
    padding-top: 3em !important;
}

.ptop-4 {
    padding-top: 4em !important;
}

/* width */
.inner980 {
    max-width: 980px !important;
    margin: 0 auto;
}

.inner960 {
    max-width: 960px !important;
    margin: 0 auto;
}

.inner800 {
    max-width: 800px !important;
    margin: 0 auto;
}

.inner600 {
    max-width: 600px !important;
    margin: 0 auto;
}

.w90 {
    width: 90% !important;
    margin-left: auto;
    margin-right: auto;
}

.w80 {
    width: 80% !important;
    margin-left: auto;
    margin-right: auto;
}

.w70 {
    width: 70% !important;
    margin-left: auto;
    margin-right: auto;
}

.w60 {
    width: 60% !important;
    margin-left: auto;
    margin-right: auto;
}

.w50 {
    width: 50% !important;
    margin-left: auto;
    margin-right: auto;
}

.w53 {
    width: 53% !important;
    margin-left: auto;
    margin-right: auto;
}

.w48 {
    width: 48% !important;
    margin-left: auto;
    margin-right: auto;
}

.w45 {
    width: 45% !important;
    margin-left: auto;
    margin-right: auto;
}

.w44 {
    width: 44% !important;
    margin-left: auto;
    margin-right: auto;
}

.w42 {
    width: 42% !important;
    margin-left: auto;
    margin-right: auto;
}

@media screen and (max-width:767px) {
    .w42 {
        width: 100% !important;
    }
}

.w40 {
    width: 40% !important;
    margin-left: auto;
    margin-right: auto;
}

.w30 {
    width: 30% !important;
    margin-left: auto;
    margin-right: auto;
}

@media screen and (max-width:767px) {
    .w30 {
        width: 70% !important;
        margin-left: auto;
        margin-right: auto;
    }
}

/* columns */
.columns-2,
.columns-3 {
    width: 100%;
    gap: 2em 0;
}

.columns-2>.column2 {
    width: 48% !important;
    margin-left: 0;
    margin-right: 0;
}

.columns-2>.w25 {
    width: 25% !important;
    margin-left: 0;
    margin-right: 0;
}

.columns-2>.w27 {
    width: 27% !important;
    margin-left: 0;
    margin-right: 0;
}

.columns-2>.w30 {
    width: 30% !important;
    margin-left: 0;
    margin-right: 0;
}

.columns-2>.w35 {
    width: 35% !important;
    margin-left: 0;
    margin-right: 0;
}

.columns-2>.w40 {
    width: 40% !important;
    margin-left: 0;
    margin-right: 0;
}

.columns-2>.w45 {
    width: 45% !important;
    margin-left: 0;
    margin-right: 0;
}

.columns-2>.w50 {
    width: 50% !important;
    margin-left: 0;
    margin-right: 0;
}

.columns-2>.w55 {
    width: 55% !important;
    margin-left: 0;
    margin-right: 0;
}

.columns-2>.w60 {
    width: 60% !important;
    margin-left: 0;
    margin-right: 0;
}

.columns-2>.w65 {
    width: 65% !important;
    margin-left: 0;
    margin-right: 0;
}

.columns-2>.w70 {
    width: 70% !important;
    margin-left: 0;
    margin-right: 0;
}

.columns-3>.column3 {
    width: 32% !important;
}

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

    .w90,
    .w80,
    .w70,
    .w60 {
        width: 100% !important;
    }

    .columns-2>.column2,
    .columns-2>.w25,
    .columns-2>.w27,
    .columns-2>.w30,
    .columns-2>.w35,
    .columns-2>.w40,
    .columns-2>.w45,
    .columns-2>.w50,
    .columns-2>.w55,
    .columns-2>.w60,
    .columns-2>.w65,
    .columns-2>.w70,
    .columns-3>.column3 {
        width: 100% !important;
    }
}

/* note style */
ul.note {
    line-height: 1.6em;
}

ul.note li {
    padding-left: 1.2em;
    position: relative;
    word-break: break-all;
}

ul.note li:not(:last-child) {
    margin-bottom: .3em;
}

ul.note li::before {
    content: '※';
    display: inline-block;
    position: absolute;
    left: 0;
}

ul.dotnote li::before {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    position: absolute;
    left: 0;
    top: .25em;
    background-color: currentColor;
    border-radius: 50%;
    transform: scale(.65);
}

ul.numnote {
    counter-reset: numnote;
}

ul.numnote>li {
    padding-left: 2.2em;
}

ul.numnote>li::before {
    content: "※" counter(numnote);
    counter-increment: numnote;
}

ul.numnote.countreset-2 {
    counter-reset: numnote 1 !important;
}

ul.numnote.countreset-3 {
    counter-reset: numnote 2 !important;
}

ul.numnote.countreset-4 {
    counter-reset: numnote 3 !important;
}

ul.numnote.countreset-5 {
    counter-reset: numnote 4 !important;
}

ul.numnote.countreset-6 {
    counter-reset: numnote 5 !important;
}

ul.numlist {
    counter-reset: numlist;
}

ul.numlist>li::before {
    content: counter(numlist) ".";
    counter-increment: numlist;
}

ul.numlist-circle {
    counter-reset: numlist-circle;
}

ul.numlist-circle>li {
    padding-left: 1.8em;
}

ul.numlist-circle>li::before {
    content: counter(numlist-circle);
    counter-increment: numlist-circle;
    width: 1.5em;
    height: 1.5em;
    padding-bottom: .1em;
    color: #333;
    background-color: #fff;
    border: solid 1px #333;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    top: calc(1.6 * .5);
    transform: translateY(-50%) scale(0.9);
}

ul.numlist-circle-fill {
    counter-reset: numlist-circle;
}

ul.numlist-circle-fill>li {
    padding-left: 1.8em;
}

ul.numlist-circle-fill>li::before {
    content: counter(numlist-circle);
    counter-increment: numlist-circle;
    width: 1.5em;
    height: 1.5em;
    padding-bottom: .1em;
    color: #fff;
    background-color: #333;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    top: calc(1.6 * .5);
    transform: translateY(-50%) scale(0.9);
}

ul.discnote>li::before {
    content: '' !important;
    width: 1em;
    height: 1em;
    top: .5lh;
    transform: translateY(-50%) scale(0.6);
    border-radius: 100%;
    background-color: #333;
}

ul.note ul.note {
    font-size: 1em;
}

ul.note.notecenter li {
    text-align: center;
    padding-left: 0;
}

ul.note.notecenter li::before {
    position: static;
}

/* ---------------------------------------------------
 color
---------------------------------------------------*/
.dblue-d {
    color: #242c4c;
}

.dgray-d {
    color: #515d6b;
}

.dgray {
    color: #d9dee2;
}

.white {
    color: #fff !important;
}

.bg {
    background-color: #020024;
}

.bg-smart {
    /* background-color: #6699be; */
    background-color: #091d39;
}

.bgblue-d {
    background-color: #242c4c;
}

.bggray-d {
    background-color: #515d6b;
}

.bggray-smart-d {
    background: linear-gradient(0deg, #30bde0 0%, #002e6e 100%);
}

.bggray {
    background-color: #d9dee2;
}

.bggray-l {
    background-color: #aab5bc;
}

.bgblue-l {
    background-color: #a5abb7;
}

.bggray-smart {
    background-color: #f3f3f3;
}

.bg-white {
    background-color: #fff;
}

/* ---------------------------------------------------
 content
---------------------------------------------------*/
.mainContent {
    font-weight: bold;
    font-family: 'Noto Sans JP', sans-serif;
}

@media (max-width: 767px) {
    .mainContent {
        padding-top: 15px;
    }
}

.mainContent img {
    vertical-align: top;
}

.mainContent figure img {
    width: 100%;
    height: auto;
}

/* .mainContent sup {
    font-size: .65em;
    vertical-align: .4em;
}

.mainContent sub {
    font-size: .65em;
    vertical-align: -.1em;
} */

.mainContent .note {
    font-weight: normal;
    font-size: .8em;
    color: #333;
}

@media all and (-ms-high-contrast: none) {
    .mainContent {
        min-width: 768px;
    }
}

/* mov wrp */
.mov-wrp {
    width: 800px;
    height: 450px;
    margin: 3rem auto 0;
    border: solid 1px #ccc;
}

.mov-wrp iframe {
    width: 100%;
    height: 100%;
}

@media screen and (max-width:767px) {
    .mov-wrp {
        width: 100%;
        height: auto;
        aspect-ratio: 16/9;
        line-height: 1;
        font-size: 0;
    }
}


/* footer catalog banner */
.appealAsideSection>div.catalog.img2 .sectionPicture::before {
    background-image: url(/appeal/images/pic_catalog01_2.jpg);
}