@charset "UTF-8";
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font-style: normal;
    /*font: inherit;*/
    vertical-align: baseline;
}


/* HTML5 display-role reset for older browsers */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

body {
    line-height: 1;
}

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

input[type="text"],
input[type="password"],
textarea,
select,
*:focus {
    outline: none;
}


/*====================================================
////id common
====================================================*/

html {
    font-size: 10px;
    font-size: 62.5%;
    margin: 0 !important;
    max-width: 100vw;
    width: 100%;
}

:root {
    --red: #e73828;
    --l_blue: #2ca6e0;
    --blue: #0096ff;
    --d_blue: #1979bd;
    --l_gray: #fafafa;
    --gray: #9e9e9f;
    --d_gray: #3e3a39;
    --black: #000;
    --grd: linear-gradient(135deg, #80d5ff, #9f7bff);
    --font_family: 'BIZ UDPGothic', "Yu Gothic Medium", "游ゴシック Medium", "YuGothic Medium", "游ゴシック体 Medium", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
}

body,
button,
input,
select,
optgroup,
textarea {
    color: var(--black);
    font-family: var(--font_family);
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: 400;
    letter-spacing: 0.03em;
    line-height: 1.8;
}

@media screen and (max-width: 769px) {
    body,
    button,
    input,
    select,
    optgroup,
    textarea {
        font-size: 1.6rem;
    }
}

@media screen and (max-width: 540px) {
    body,
    button,
    input,
    select,
    optgroup,
    textarea {
        font-size: 3.8vw;
    }
}

@media screen and (min-width:769px) and (max-width:960px) {}

body {}

body * {
    box-sizing: border-box;
}

section {
    position: relative;
}

#contents {
    min-height: calc(100vh - 540px);
}

.innerBox {
    max-width: 1000px;
    margin: 0 auto;
    padding: 80px 0;
    position: relative;
    width: 94%;
    /* z-index: 1; */
}

.innerBox.shortPadding {
    padding: 50px 0;
}

.innerBox .innerBox {
    width: 100%;
}

@media screen and (max-width: 769px) {
    .innerBox {
        padding: 60px 0;
    }
    .innerBox.shortPadding {
        padding: 40px 0;
    }
}

@media screen and (max-width: 540px) {
    .innerBox {
        padding: 13vw 0;
    }
    .innerBox.shortPadding {
        padding: 10vw 0;
    }
}

a {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    cursor: pointer;
    color: inherit;
    outline: none;
    text-decoration: none;
    transition: 0.2s ease-in-out;
}


/* ////////// PC ////////// */

@media print,
screen and (min-width: 769px) {
    a:not(.linkBtn):hover {
        opacity: .7;
    }
    a img {
        transition: .2s ease-in-out;
    }
    a:hover img {}
}

p+p {
    margin-top: 1em;
}

.flexBox {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
}

.flexCenter {
    align-items: center;
    justify-content: center;
}

.flex-1 {
    flex: 1;
}

.gridBox {
    display: grid;
}

.inb {
    display: inline-block;
}

.txt-center {
    text-align: center;
}

.txt-left {
    text-align: left;
}

.txt-right {
    text-align: left;
}

ul.markList li {
    position: relative;
    padding-left: 1.2em;
    line-height: 1.3;
    margin: .25em 0;
}

ul.markList li:before {
    position: absolute;
    display: block;
    left: 0;
    top: 0;
}

ul.markList.attentionMark>li:before {
    content: '\203B';
}

ul.markList.dot>li:before {
    content: '\30FB';
}

dl.accordion dt {
    cursor: pointer;
}

dl.accordion dd {
    overflow: hidden;
    transition: .2s ease-in-out;
}

.fw-light {
    font-weight: 400;
}

.fw-normal {
    font-weight: 600;
}

.fw-medium {
    font-weight: 600;
}

.fw-bold {
    font-weight: 800;
}

small,
.small {
    font-size: .8em;
}

big,
.big {
    font-size: 1.2em;
}

sup {
    font-size: .6em;
    vertical-align: text-top;
}

.relative {
    position: relative;
}

img {
    display: inline-block;
    margin: auto;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 100%;
}

figure.coverImg {
    overflow: hidden;
    padding-top: 65%;
    position: relative;
    width: 100%;
}

figure.coverImg img {
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    max-width: none;
    height: 100%;
    max-height: none;
}

@media screen and (max-width: 769px) {
    .hidden-mob {
        display: none;
    }
}

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

@media print,
screen and (min-width: 769px) {
    .hidden-pc,
    .hidden-pc_d_tab {
        display: none;
    }
}

@media screen and (min-width:769px) and (max-width:960px) {
    .hidden-tab {
        display: none;
    }
    .hidden-pc_d_tab {
        display: block;
    }
}

@media screen and (min-width:1080px) {}

.pa-0 {
    padding: 0 !important;
}

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

.pb-0 {
    padding-bottom: 0 !important;
}

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

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

.mt-05em {
    margin-top: .5em !important;
}

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

.mt-15em {
    margin-top: 1.5em !important;
}

.mb-05em {
    margin-bottom: .5em !important;
}

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

.mb-15em {
    margin-bottom: 1.5em !important;
}


/*====================================================
////NOTE カラー
====================================================*/

.bg-white {
    background: #fff;
}

.bg-l_gray {
    background: var(--l_gray);
}

.bg-l_blue {
    background: var(--l_blue);
    color: #fff;
}

.bg-blue {
    background: var(--blue);
    color: #fff;
}

.bg-grd {
    background: var(--grd);
}

.white {
    color: #fff;
}

.red {
    color: var(--red);
}

.l_blue {
    color: var(--l_blue);
}

.blue {
    color: var(--blue);
}

.d_gray {
    color: var(--d_gray);
}

.black {
    color: var(--black);
}


/*====================================================
//NOTE テキスト
====================================================*/

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: bold;
    line-height: 1.6;
}


/*====================================================
//// id 特殊装飾
====================================================*/

.markerline {
    background: linear-gradient(transparent 50%, #d0ffff 50%, #d0ffff 100%);
}

.linkBtn {
    background: var(--grd);
    border-radius: 18px;
    box-shadow: 7px 7px 14px rgba(177, 176, 176, 0.5);
    color: #fff;
    display: inline-block;
    padding: 1em 1.2em;
    position: relative;
    text-align: center;
    transition: .2s ease-in-out;
}

.linkBtn img {
    height: 1.3em;
}


/* ////////// mobile ////////// */

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

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


/* ////////// PC ////////// */

@media print,
screen and (min-width: 769px) {
    .linkBtn:hover {
        box-shadow: 10px 10px 18px rgba(177, 176, 176, 0.3);
        filter: brightness(1.08);
        transform: scale(1.02);
    }
}


/* ////////// tablet ////////// */

@media screen and (min-width:769px) and (max-width:960px) {}

@media screen and (min-width:1080px) {}


/*====================================================
////id 【header】
====================================================*/

header {
    transition: .3s ease-in-out;
}

header .headerBox {
    background: rgba(255, 255, 255, .8);
    /* position: fixed; */
    top: 0;
    left: 0;
    transition: .2s ease-in-out;
    width: 100%;
    z-index: 10000;
}

header.global .headerBox {}

header .header_logo a {
    align-items: center;
}

header img {
    margin: 0;
}

header .btnBox .linkBtn {
    box-shadow: none;
    padding: .4em 1.5em;
}

header .btnBox .linkBtn img {
    margin: 0 .7em 0 -.5em;
    vertical-align: sub;
}


/* ////////// mobile ////////// NOTE header mobile */

@media screen and (max-width: 1079.8px) {
    header {
        height: 60px;
    }
    header.hide {
        top: -130px;
    }
    header .headerBox {
        height: 60px;
    }
    .menu-open header .headerBox {
        background: rgba(255, 255, 255, 1) !important;
    }
    header .innerBox {
        align-items: center;
        padding: 5px 0;
        height: 100%;
        max-width: none;
    }
    header .header_logo {
        height: 100%;
        justify-content: flex-start;
        width: 70%;
        max-width: 200px;
    }
    header .header_logo a {}
    header .menuBtn {
        background: transparent;
        cursor: pointer;
        place-content: center;
        position: fixed;
        top: 0;
        right: 0;
        transition: .2s ease-in-out;
        width: 60px;
        height: 60px;
        z-index: 10;
    }
    header .menuBtn .humberger {
        width: 100%;
        height: 20px;
        position: relative;
        margin: 0;
    }
    header .menuBtn .humberger span {
        background: var(--black);
        border-radius: 10px;
        content: '';
        margin: auto;
        opacity: 1;
        position: absolute;
        left: 0;
        right: 0;
        transition: .4s ease-in-out;
        width: 35px;
        height: 2px;
    }
    header .menuBtn .humberger span:nth-child(1) {
        top: 8px;
    }
    header .menuBtn .humberger span:nth-child(2) {
        top: 16px;
        /* transform-origin: right bottom; */
    }
    header .menuBtn .text {
        font-size: 1.0rem;
        line-height: 1em;
        margin-top: .6em;
        padding-left: .05em;
        transform: scale(.9);
    }
    header .maskBox {
        background: rgba(0, 0, 0, .4);
        opacity: 0;
        pointer-events: none;
        position: fixed;
        top: 59px;
        left: 0;
        transition: .5s ease-in-out;
        width: 100%;
        height: 150%;
    }
    header .menuBox {
        background: #fff;
        overflow-y: auto;
        padding: 40px 2em;
        pointer-events: none;
        position: fixed;
        top: 59px;
        right: -330px;
        bottom: 0;
        transition: .5s ease-in-out;
        width: 100%;
        max-width: 320px;
        height: auto;
        min-height: calc(100vh - 126px);
        z-index: 1;
        overflow-y: scroll;
        -ms-overflow-style: none;
        /* IE, Edge 対応 */
        scrollbar-width: none;
        /* Firefox 対応 */
    }
    header .menuBox::-webkit-scrollbar {
        /* Chrome, Safari 対応 */
        display: none;
    }
    header .menu-outer.open .menuBtn {
        transition: .2s ease-in-out;
    }
    header .menu-outer.open .humberger span {
        width: 100%;
    }
    header .menu-outer.open .humberger span:nth-child(1) {
        top: calc(50% + 2px);
        transform: rotate(-160deg);
    }
    header .menu-outer.open .humberger span:nth-child(2) {
        top: calc(50% + 2px);
        transform: rotate(160deg);
    }
    header .menu-outer.open .maskBox {
        opacity: 1;
        pointer-events: auto;
    }
    header .menu-outer.open .menuBox {
        pointer-events: auto;
        opacity: 1;
        right: 0;
    }
    header .menuBox {
        display: block;
    }
    header .menu-outer {
        flex-direction: column;
        text-align: center;
        width: 100%;
    }
    header .menuBox ul {}
    header .menuBox li {
        padding: .2em 0;
        position: relative;
        width: 100%;
    }
    header .menuBox li a {
        display: block;
        pointer-events: auto;
        position: relative;
    }
    header .menu_en {
        font-size: .8em;
        margin-top: 30px;
    }
    header .btnBox {
        margin-top: 30px;
    }
}

@media screen and (max-width:540px) {
    header .menu .counseling_reserve {
        opacity: 0;
        padding: 0;
        position: fixed;
        left: 10px;
        bottom: 10px;
        transition: .3s ease-in-out;
        width: calc(100% - 70px);
        height: 40px;
    }
}

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


/* ////////// PC ////////// NOTE header PC */

@media print,
screen and (min-width: 1080px) {
    header {
        height: 80px;
    }
    header .headerBox {
        height: 80px;
    }
    header .headerBox:hover {
        background: rgba(255, 255, 255, 1);
    }
    header.hide {
        top: -180px;
    }
    header .innerBox {
        align-items: center;
        grid-template-rows: 100px 50px;
        height: 100%;
        margin: auto;
        padding: 0;
    }
    header .header_logo {
        height: 100%;
    }
    header .header_logo img {
        width: 220px;
    }
    header .header_logo a:hover {
        color: inherit;
        opacity: .8;
    }
    header .menuBtn {
        display: none;
    }
    header .menuBox {}
    header .menu-outer {
        grid-gap: 30px;
        justify-content: flex-end;
        width: 100%;
    }
    header .menu-outer {
        flex: 1;
    }
    header .menu {
        display: flex;
        align-items: center;
        grid-gap: 0;
        justify-content: flex-end;
        font-size: 1.4rem;
    }
    header .menu li {
        padding: 0 .5em;
        position: relative;
    }
    header .menu li::before,
    header .menu li:last-child::after {
        border-left: solid 1px;
        content: '';
        display: block;
        margin: auto;
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 0;
        height: 1.2em;
    }
    header .menu li:last-child::after {
        left: auto;
        right: 0;
    }
    header .menu li a {
        line-height: 1.3;
        margin: 0;
        opacity: 1;
        padding: .25em .5em .3em .7em;
        position: relative;
    }
    header .menu li a:hover {
        color: var(--black);
        opacity: 1;
    }
    header .menu li a:after {
        background: var(--l_blue);
        content: '';
        margin: auto;
        opacity: .1;
        position: absolute;
        bottom: 0;
        right: 0;
        left: auto;
        transition: .2s ease-in-out;
        width: 0;
        height: 100%;
        z-index: -1;
    }
    header .menu:not(#menu-btn) li a:hover::after {
        right: auto;
        left: 0;
        width: 100%;
    }
    header .menu_en {
        display: flex;
        align-items: center;
        grid-gap: 0 1.5em;
        justify-content: flex-end;
        font-size: 1.0rem;
        letter-spacing: 0;
        margin-top: .5em;
    }
    header .menu_en a:hover {
        color: var(--d_blue);
        opacity: 1;
    }
    header .btnBox .linkBtn {
        font-size: 1.3rem;
    }
}


/* ////////// tablet ////////// */

@media screen and (min-width:769px) and (max-width:1080px) {}

@media screen and (min-width:960px) and (max-width:1080px) {
    header .header_logo {
        justify-content: flex-start;
    }
}

@media screen and (min-width:1080px) {}


/*====================================================
////id  loader
====================================================*/

.is-hide {
    display: none;
}


/* ローディング画面をフェードアウト */

.fadeout-bg {
    transition-property: opacity;
    transition-delay: .8s;
    transition-duration: 1.7s;
    opacity: 0;
    pointer-events: none;
}


/* ローダーをフェードアウト */

.fadeout-loader {
    transition-property: opacity;
    transition-delay: .8s;
    transition-duration: 1.7s;
    opacity: 0;
    pointer-events: none;
}


/* ローディング画面 */

#loader-bg {
    background: #fff;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999;
}

#loader {
    height: 120px;
    left: 50%;
    margin-left: -60px;
    margin-top: -60px;
    position: fixed;
    top: 50%;
    width: 120px;
}


/*====================================================
//class .sa
====================================================*/

.sa {
    opacity: 0;
    transition: all .8s ease;
}

.sa.show {
    opacity: 1;
    transform: none;
}

.sa-lr {
    transform: translate(-40px, 0);
}

.sa-rl {
    transform: translate(40px, 0);
}

.sa-up {
    transform: translate(0, 40px);
}

.sa-down {
    transform: translate(0, -40px);
}

.sa-scaleUp {
    transform: scale(.8);
}

.sa-scaleDown {
    transform: scale(1.2);
}


/*====================================================
//// id form
====================================================*/

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="password"],
input[type="url"],
input[type="number"],
select,
textarea {
    background: #fff;
    border: solid 1px var(--l_blue);
    border-radius: 18px;
    display: block;
    padding: .8em 1em;
    position: relative;
    width: 100%;
}

textarea {
    resize: vertical;
    min-height: 80px;
    width: 100%;
}

::-moz-placeholder {
    color: var(--gray);
}

:-ms-input-placeholder {
    color: var(--gray);
}

::placeholder {
    color: var(--gray);
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
select:focus,
textarea:focus {}

input[type="file"],
label {
    cursor: pointer;
}

form label {
    position: relative;
    line-height: 1.4;
    display: inline-block;
}

input[type="radio"],
input[type="checkbox"] {
    display: none;
}

input[type="checkbox"]+span,
input[type="checkbox"]+label {
    position: relative;
    padding-left: 2em;
    display: inline-block;
}

input[type="checkbox"]+span:before,
input[type="checkbox"]+label:before {
    position: absolute;
    content: '';
    width: 15px;
    height: 15px;
    border: solid 1px;
    border-radius: 3px;
    border-color: var(--gray);
    top: .2em;
    left: 0px;
    background: #fff;
    transition: .2s ease-in-out;
}

input[type="checkbox"]+span:after,
input[type="checkbox"]+label:after {
    position: absolute;
    content: '';
    width: 11px;
    height: 7px;
    border: solid;
    border-width: 0 0 3px 3px;
    border-color: transparent transparent #b23750 #b23750;
    transform: rotate(-45deg);
    top: .2em;
    left: 3px;
    opacity: 0;
    transition: .2s ease-in-out;
}

input[type="checkbox"]:checked+span:after,
input[type="checkbox"]:checked+label:after {
    opacity: 1;
}

input[type="radio"]+span,
input[type="radio"]+label {
    position: relative;
    padding: 0 30px;
}

input[type="radio"]+span:before,
input[type="radio"]+label:before {
    position: absolute;
    content: '';
    width: 15px;
    height: 15px;
    border: solid 1px;
    border-radius: 100%;
    border-color: var(--gray);
    top: .2em;
    left: 0px;
    background: #fff;
    transition: .2s ease-in-out;
}

input[type="radio"]+span:after,
input[type="radio"]+label:after {
    position: absolute;
    content: '';
    width: 9px;
    height: 9px;
    top: calc(.2em + 4px);
    left: 4px;
    border-radius: 100%;
    opacity: 0;
    transition: .2s ease-in-out;
}

input[type="radio"]:checked+span:after,
input[type="radio"]:checked+label:after {
    opacity: 1;
    background: #b23750;
}

button {
    border: none;
    cursor: pointer;
}

.formBox {
    display: grid;
    grid-gap: 1em;
}

.formBox .inputBox {
    background: var(--grd);
    border-radius: 20px;
    padding: 2px;
    position: relative;
}

.formBox .inputBox input {
    border: none;
}


/* ////////// mobile ////////// */

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

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


/* ////////// PC ////////// */

@media print,
screen and (min-width: 769px) {}


/* ////////// tablet ////////// */

@media screen and (min-width:769px) and (max-width:960px) {}

@media screen and (min-width:1080px) {}


/*====================================================
//// id footer
====================================================*/

footer .menu {
    flex-wrap: wrap;
    grid-gap: .5em 0;
    justify-content: center;
}

footer .menu li {
    padding: 0 .5em;
    position: relative;
}

footer .menu li:not(li:last-child)::after {
    border-left: solid 1px;
    content: '';
    display: block;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 0;
    height: 1em;
}

footer .copyright {
    font-size: 1.0rem;
}


/* ////////// mobile ////////// */

@media screen and (max-width: 960px) {
    footer .menuBox {
        font-size: 1.3rem;
    }
    footer .itemBox {
        grid-gap: 1em;
        text-align: center;
    }
    footer .logoBox {
        margin: auto;
        width: 80%;
        max-width: 220px;
    }
    footer .companyBox {
        font-size: .9em;
    }
}

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

@media screen and (max-width:540px) {
    footer .menuBox {
        font-size: .8em;
    }
    footer .companyBox {
        font-size: .8em;
    }
}


/* ////////// PC ////////// */

@media print,
screen and (min-width: 960px) {
    footer .menuBox {
        font-size: 1.4rem;
        margin: auto;
        max-width: 800px;
    }
    footer .itemBox {
        grid-template-columns: 1fr auto;
        grid-template-rows: 1fr auto;
    }
    footer .logoBox img {
        width: 220px;
    }
    footer .companyBox {
        grid-row: span 2;
    }
}


/* ////////// tablet ////////// */

@media screen and (min-width:769px) and (max-width:960px) {}

@media screen and (min-width:1080px) {}


/*====================================================
//// id xxx
====================================================*/


/* ////////// mobile ////////// */

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

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


/* ////////// PC ////////// */

@media print,
screen and (min-width: 769px) {}


/* ////////// tablet ////////// */

@media screen and (min-width:769px) and (max-width:960px) {}

@media screen and (min-width:1080px) {}