@charset "UTF-8";

/* base (reset)
---------------------------------------------------*/
body {
    width: 100%;
    height: 100%;
    margin: 0 auto;
    padding: 0;
}
h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0;
    padding: 0;
    font-size: 1.0em;
    font-weight: 400;
}
ul,
ol,
dl,
dt,
dd {
    margin: 0;
    padding: 0;
}
ol,
li {
    list-style: none;
}
img {
    border: none;
    line-height: 0;
    font-size: 0;
    vertical-align: middle;
    max-width:100%;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}
/* ---------- */
a {
    margin: 0;
    padding: 0;
    font-size: inherit;
    background: transparent;
}
th,
td {
    font-style: normal;
    font-weight: normal;
    font-size: inherit;
    empty-cells: show;
}
input,
select {
    vertical-align: middle;
}
input,
textarea,
select {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    /*-webkit-appearance: none;*/
    border-radius: 0;
}
pre {
    white-space: -moz-pre-wrap;/* Mozilla */
    white-space: -o-pre-wrap;/* Opera 7 */
    white-space: pre-wrap;/* CSS3 */
    word-wrap: break-word;/* IE 5.5+ */
}


/* color
---------------------------------------------------*/
:root {
    --key-color: #0A8C0D;
    --background-color: #F4F8FA;
    --font-color: #000;
    --white-color: #fff;
    --black-color: #000;
    --pc-size: 1440;
    --sp-size: 375;
    --pc-size-px: 1440px;
    --sp-size-px: 375px;
}

/* Selected Text
---------------------------------------------------*/
::selection {
    background: #191919;
    color: #FFFFFF;
}

/* HTML
---------------------------------------------------*/
html {
    margin: 0;
    padding: 0;
    height: 100%;
    font-size: 62.5%;
    overflow-y: scroll;
}
body {
    position: relative;
    width: 100%;
    line-height: 1;
    color: var(--font-color);
    font-size: 1.0em;
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    background-color: var(--white-color);
}
body[data-size="large"] {
    font-size: 1.4em;
}
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
:before,
:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}

.sp-no {display:block;}
br.sp-no {display: inline;}
.pc-no {display:none;}
br.pc-no {display:none;}

svg {
    display: block;
    width: 100%;
    height: auto;
    fill: var(--black-color);
}
.en {
    font-family: "bahnschrift", sans-serif;
    font-weight: 400;
    font-style: normal;
}
.arial {
    font-family: "arial", sans-serif;
    font-weight: 400;
    font-style: normal;
}
ul.disc > li {
    list-style: disc;
    margin-left: 1.5em;
}

@media screen and (max-width: 1440px) {
    html {
        font-size: calc(10 / var(--pc-size) * 100vw);
    }
}

/* 768 */
@media screen and (min-width:1px) and (max-width: 768px) {
    html {
        font-size: calc(10 / 375 * 100vw);
    }
    body {
        font-size: calc(10 / 375 * 100vw);
        -webkit-text-size-adjust: 100%;
    }
    .pc-no {display: block;}
    br.pc-no {display: inline;}
    .sp-no {display: none;}
    br.sp-no {display: none;}
}


/* link
---------------------------------------------------*/
a {
    text-decoration: none;
}
a:link,
a:visited,
a:active {
    color: var(--font-color);
}
a:hover {
    color: var(--font-color);
}
a.u {
    text-decoration: underline;
    text-underline-offset: 0.2em;
}
a,
.hover {
    transition: opacity 0.5s;
}
.hover:hover {
    opacity: 0.8;
    transition: opacity 0.5s;
}

@media screen and (min-width: 769px) {
    a[href^="tel:"] {
        pointer-events: none;
        cursor: default;
    }
}

/* clearfix
---------------------------------------------------*/
.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: '';
    clear: both;
    height: 0;
}
.clearfix {
    min-height: 1px;
    zoom: 1;
}
* html .clearfix {
    height: auto;
    overflow: hidden;
}


/* wrapper
---------------------------------------------------*/
#wrapper {
    position: relative;
    width: 100%;
    background-color: var(--white-color);
    margin: 0 auto;
    overflow: hidden;
}
.contents-wrap {
    width: min(915px, calc(915 / var(--pc-size) * 100vw));
    margin: 0 auto;
}

/* 768 */
@media screen and (min-width:1px) and (max-width: 768px) {
    .contents-wrap {
        width: calc(320 / var(--sp-size) * 100vw);
    }
}

/* Footer
---------------------------------------------------*/
#Footer {
    position: relative;
    background-color: var(--background-color);
    padding-top: min(70px, calc(70 / var(--pc-size) * 100vw));
    padding-bottom: min(85px, calc(85 / var(--pc-size) * 100vw));
}
#Footer p {
    text-align: center;
    line-height: 2.13;
    font-size: 1.5rem;
}

/* 768 */
@media screen and (min-width:1px) and (max-width: 768px) {
    #Footer {
        padding-top: calc(145 / var(--sp-size) * 100vw);
        padding-bottom: calc(42 / var(--sp-size) * 100vw);
    }
}

/* page-top
---------------------------------------------------*/
#page-top {
    position: fixed;
    right: 30px;
    bottom: 40px;
    width: min(149px, calc(149 / var(--pc-size) * 100vw));
    aspect-ratio: 1 / 1;
    cursor: pointer;
    z-index: 999;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.5s;
}
#page-top img {
    width: 100%;
}
#page-top.is-view {
    opacity: 1;
    pointer-events: auto;
}
@media screen and (min-width: 769px) {
    #page-top {
        top: auto !important;
    }
}
/*  768  */
@media screen and (max-width: 768px) {
    #page-top {
        left: calc(135 / var(--sp-size) * 100vw);
        right: auto;
        bottom: calc(20 / var(--sp-size) * 100vw);
        width: calc(105 / var(--sp-size) * 100vw);
    }
    #page-top.is-static {
        position: absolute;
        top: 0;
        bottom: auto;
    }
}