@charset "utf-8";

/* -----------------------------------
basic
----------------------------------- */
:root {
    --font_01: 'serenity', sans-serif;
    --font_02: 'p22-allyson-pro', sans-serif;
    --font_03: 'milonguita', sans-serif;
    --font_04: 'timberline', sans-serif;
    --font_05: 'kinto-sans', sans-serif;
    --font_06: "timberline", sans-serif;
    --font_07: 'Noto Sans JP', sans-serif;
    --main_c: #0A5A96;
    --sub_c: #fff;
    --text_c: #000;
    --act_c: #008CE6;
    --act_c2: #FFDE01;
    --bc_c: #ECF0F1;
    --cat_c: #121D4D;
    --line_c: #A6A6A6;
    --fsize_13: 0.866em;
    --fsize_15: 1em;
    --fsize_18: 1.2em;
    --fsize_20: 1.333em;
    --fsize_25: 1.666em;
    --fsize_30: 2em;
    --fsize_35: 2.333em;
    --fsize_40: 2.666em;
    --fsize_45: 3em;
    --fsize_55: 3.666em;
    --fsize_60: 4em;
    --fontw_s: 300;
    --fontw_m: 500;
    --fontw_l: 700;
    --fontw_n: normal;
    --lh_m: 35px;
    --lh_l: 45px;
}

html {
    margin-top: 0px !important;
}

body {
    font-family: var(--font_05);
    font-size: 15px;
    color: var(--text_c);
    background: var(--sub_c);
    min-width: 1280px;
    max-width: 100%;
}

.wrap {
    overflow: hidden;
}

a:hover {
    opacity: 0.9;
    /* text-decoration: none; */
    /* color: #000000; */
    /* transition: .3s; */
}

b {
    color: var(--act_c);
    font-weight: bold;
}

/* -----------------------------------
共通クラス
----------------------------------- */
/* 使い回し禁止クラス */
/* 
.content
.box
.telnum
.text 
*/
.row1,
.row2,
.row3,
.row4,
.row5,
.row6,
.row7,
.row8,
.row9,
.row10,
.row11,
.row12,
.row13,
.row14,
.row15,
.row16,
.row17,
.container {
    margin: 0 auto;
}

.container {
    max-width: 1192px;
}

.row1 {
    max-width: 1066px;
}

.row2 {
    max-width: 998px;
}

.row3 {
    max-width: 800px;
}

.row4 {
    max-width: 1000px;
}

.row5 {
    max-width: 884px;
}

.row6 {
    max-width: 960px;
}

.row7 {
    max-width: 850px;
}

.row8 {
    max-width: 1080px;
}

.row9 {
    max-width: 1054px;
}

.row10 {
    max-width: 1025px;
}

.row11 {
    max-width: 970px;
}

.row12 {
    max-width: 1090px;
}

.row13 {
    max-width: 940px;
}

.row14 {
    max-width: 920px;
}

.row15 {
    max-width: 870px;
}

.row16 {
    max-width: 990px;
}

.row17 {
    max-width: 1190px;
    padding-left: 60px;
}

.flex_box {
    display: flex;
    flex-wrap: wrap;
}

.column {
    flex-direction: column;
}

/* spanとセット */
/* spanの後ろで改行 */
.br_a::after {
    content: "\A";
    white-space: pre;
}

/* spanの前で改行 */
.br_b::before {
    content: "\A";
    white-space: pre;
}

/* spanごとに改行 */
.br {
    display: block;
}

/* スクロールしてフェードイン */
/* .js_fadeu,
.js_fadel,
.js_fader {
    opacity: 0;
    transition: opacity .8s, transform .8s;
}

.js_fadeu {
    transform: translateY(30px);
}

.js_fadel {
    transform: translateX(-30px);
}

.js_fader {
    transform: translateX(30px);
}

.js_fadeu.is_inview,
.js_fadel.is_inview,
.js_fader.is_inview {
    opacity: 1;
    transition-delay: .5s;
}

.js_fadel.is_inview,
.js_fader.is_inview {
    transform: translateX(0);
}

.js_fadeu.is_inview {
    transform: translateY(0);
} */

/* 非表示 */
.d-none {
    display: none;
}

.desktop {
    display: block;
}

.mobile {
    display: none;
}

.w100 {
    flex-basis: 100%;
}

@media screen and (max-width: 600px) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}

.pagenation {
    text-align: center;
}

.pagenation>* {
    border: 1px solid var(--cat_c);
    color: var(--cat_c);
    font-family: var(--font_01);
    font-size: var(--fsize_25);
    font-weight: var(--fontw_m);
    height: 50px;
    width: 50px;
    margin: 0 7.5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.pagenation .current {
    background-color: var(--cat_c);
    color: var(--sub_c);
}

/* -----------------------------------
共通スタイル
----------------------------------- */
.btn_area_01,
.btn_area_02 {
    width: 300px;
}

.btn_area_02 {
    margin: 0 auto;
}

.btn_area_03 {
    width: 100%;
}

.btn_style_01,
.btn_style_02,
.btn_style_03 {
    position: relative;
    top: 0;
    text-decoration: none;
    outline: none;
    transition: all .3s;
}

.btn_style_01:hover,
.btn_style_02:hover,
.btn_style_03:hover {
    top: -3px;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);
}

.btn_style_01 {
    background-color: var(--text_c);
    color: var(--sub_c);
    text-align: center;
    padding: 1em;
    display: block;
    position: relative;
}

.btn_style_01::after {
    content: url(../image/icon_right_arrow.svg);
    position: absolute;
    top: 50%;
    right: 1em;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.btn_style_02,
.btn_style_03 {
    background: var(--sub_c);
    color: var(--main_c);
    height: 83px;
    font-weight: 700;
    letter-spacing: 0.15em;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn_style_02 {
    font-size: var(--fsize_18);
    position: relative;
}

.btn_style_02::after {
    content: url(../image/icon_14.svg);
    position: absolute;
    top: 50%;
    right: 1.5em;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}


.btn_style_03 {
    font-size: var(--fsize_30);
}

.btn_style_04 {
    background: var(--text_c);
    color: var(--sub_c);
    text-align: center;
    font-family: var(--font_05);
    font-size: var(--fsize_15);
    font-style: normal;
    font-weight: 700;
    line-height: 40px;
    display: flex;
    width: 317px;
    height: 64px;
    flex-direction: column;
    justify-content: center;
    flex-shrink: 0;
}

.btn_style_04 p {
    width: 100%;
    position: relative;
}

.btn_style_04 p::after {
    background-image: url(../image/icon/Calque_4.svg);
    background-repeat: no-repeat;
    background-position: 0%;
    background-size: cover;
    content: "";
    display: block;
    height: 15px;
    width: 15px;
    position: absolute;
    right: 25px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.btn_style_05 {
    color: var(--sub_c);
    width: 317px;
    height: 64px;
    background-color: var(--text_c);
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 20px;
}

.btn_style_06 {
    background: var(--text_c);
    color: var(--sub_c);
    text-align: center;
    font-family: var(--font_05);
    font-size: var(--fsize_15);
    font-weight: var(--fontw_l);
    line-height: 40px;
    height: 60px;
    width: 300px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.btn_style_06::before {
    background-image: url(../image/icon_right_arrow.svg);
    background-position: center;
    background-repeat: no-repeat;
    content: "";
    height: 26px;
    width: 18px;
    display: block;
    position: absolute;
    top: 50%;
    left: 1em;
    transform: translateY(-50%) rotate(180deg);
    -webkit-transform: translateY(-50%) rotate(180deg);
    -ms-transform: translateY(-50%) rotate(180deg);
}

.btn_style_07 {
    background: rgba(0, 0, 0, 0);
    border: 2px solid var(--sub_c);
    color: var(--sub_c);
    text-align: center;
    font-family: var(--font_05);
    font-size: var(--fsize_15);
    font-weight: var(--fontw_l);
    line-height: 40px;
    height: 60px;
    width: 300px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.btn_style_07::after {
    background-image: url(../image/icon_right_arrow.svg);
    background-position: center;
    background-repeat: no-repeat;
    content: "";
    height: 26px;
    width: 18px;
    display: block;
    position: absolute;
    top: 50%;
    right: 1em;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.btn_style_08 {
    background-color: var(--main_c);
    color: var(--sub_c);
    height: 105px;
    width: auto;
    font-size: var(--fsize_25);
    font-weight: 700;
    line-height: 35px;
    letter-spacing: 3.75px;
    word-wrap: break-word;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.btn_style_08::after {
    content: url(../image/icon_right_arrow.svg);
    position: absolute;
    top: 50%;
    right: 10%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.title_style_01,
.title_style_02,
.title_style_03,
.title_style_04,
.title_style_05 {
    letter-spacing: 0.15em;
    font-weight: bold;
}

.title_style_01,
.title_style_02,
.title_style_04 {
    margin-bottom: 2em;
}

.title_style_02 {
    text-align: center;
}

.title_style_03 {
    text-align: center;
    font-size: var(--fsize_30);
}

.title_style_01 .sub_title,
.title_style_02 .sub_title,
.title_style_03 .sub_title,
.title_style_04 .sub_title,
.title_style_05 .sub_title {
    font-family: var(--font_01);
    font-weight: 600;
}

.title_style_01 .sub_title,
.title_style_02 .sub_title,
.title_style_04 .sub_title {
    color: var(--act_c);
    font-size: var(--fsize_30);
    margin-bottom: 0.25em;
}

.title_style_01 .main_title,
.title_style_02 .main_title,
.title_style_05 .main_title {
    font-size: var(--fsize_35);
}

.title_style_04 .main_title {
    font-size: var(--fsize_45);
    line-height: 35px;
    letter-spacing: 6px;
}

.title_style_05 .main_title {
    color: var(--bc_c);
}

.title_style_05 .sub_title {
    color: var(--act_c2);
    font-size: var(--fsize_15);
    margin-bottom: 0.25em;
}

.title_style_06 {}

.title_style_06 .main_title {
    color: var(--text_c);
    font-family: var(--font_05);
    font-size: var(--fsize_30);
    font-style: normal;
    font-weight: var(--fontw_l);
    line-height: var(--lh_m);
    letter-spacing: 4.5px;
    margin-top: 10px;
    text-align: center;
}

.title_style_06 .sub_title {
    color: var(--act_c);
    text-align: center;
    font-family: var(--font_01);
    font-size: var(--fsize_20);
    font-style: normal;
    font-weight: var(--fontw_l);
    line-height: var(--lh_m);
    letter-spacing: 3px;
}

.title_style_07 .main_title {
    color: var(--act_c);
    font-family: var(--font_01);
    font-size: var(--fsize_45);
    font-style: normal;
    font-weight: var(--fontw_l);
    line-height: var(--lh_m);
    letter-spacing: 6.75px;
}

.title_style_07 .sub_title {
    color: var(--main_c);
    font-family: var(--font_05);
    font-size: var(--fsize_20);
    font-weight: var(--fontw_l);
    height: min-content;
    margin-left: var(--fsize_25);
    line-height: 1;
    letter-spacing: 3px;
}

.title_style_08 {
    color: var(--sub_c);
}

.title_style_08 .sub_title {
    font-family: var(--font_01);
    font-size: var(--fsize_20);
    font-weight: var(--fontw_l);
    line-height: var(--lh_m);
    letter-spacing: 3px;
    margin-bottom: 10px;
}

.title_style_08 .main_title {
    font-family: var(--font_05);
    font-size: var(--fsize_35);
    font-weight: var(--fontw_l);
    line-height: var(--lh_m);
    letter-spacing: 5.25px;
}

.title_style_09 {
    text-align: center;
    color: var(--sub_c);
}

.title_style_09 .sub_title {
    text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.25);
    font-family: var(--font_01);
    font-size: var(--fsize_20);
    font-weight: var(--fontw_l);
    line-height: var(--lh_m);
    letter-spacing: 3px;
}

.title_style_09 .main_title {
    text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.25);
    font-family: var(--font_05);
    font-size: var(--fsize_35);
    font-weight: var(--fontw_l);
    line-height: var(--lh_l);
    letter-spacing: 5.25px;
}

.title_style_10 .main_title {
    border-bottom: 1px solid var(--act_c);
    color: var(--main_c);
    font-size: var(--fsize_35);
    font-weight: 900;
    line-height: var(--lh_m);
    /* 128.571% */
    letter-spacing: 5.25px;
    padding-bottom: 10px;
    width: max-content;
}

.title_style_11 {
    border-bottom: 2px solid var(--line_c);
    position: relative;
    align-items: baseline;
}

.title_style_11::after {
    position: absolute;
    content: " ";
    display: block;
    border-bottom: solid 2px var(--act_c);
    bottom: -2px;
    width: 90px;
}

.title_style_11 .main_title {
    color: var(--act_c);
    font-size: var(--fsize_60);
    font-weight: 900;
    letter-spacing: 5.25px;
    margin-right: 20px;
    width: max-content;
}

.title_style_11 .sub_title {
    color: var(--main_c);
    font-size: var(--fsize_35);
    font-weight: var(--fontw_l);
    line-height: var(--lh_m);
    letter-spacing: 3px;
}


.h3_style_02 {
    font-family: var(--font_05);
    font-size: var(--fsize_25);
    font-weight: var(--fontw_l);
    line-height: var(--lh_m);
    letter-spacing: 3.75px;
}

.h3_style_03 {
    color: var(--main_c);
    font-family: var(--font_01);
    font-size: var(--fsize_20);
    font-weight: var(--fontw_l);
    line-height: var(--lh_l);
    letter-spacing: 3px;
}

.h3_style_04 {
    color: var(--main_c);
    font-size: var(--fsize_30);
    font-weight: var(--fontw_l);
    line-height: var(--lh_l);
    /* 150% */
    letter-spacing: 4.5px;
}

.h3_style_05 {
    color: var(--main_c);
    font-size: var(--fsize_35);
    font-weight: var(--fontw_l);
    /* line-height: var(--lh_m); */
    line-height: 1.25;
    letter-spacing: 5.25px;
}

.h3_style_06 {
    color: var(--main_c);
    font-size: var(--fsize_25);
    font-weight: var(--fontw_l);
    line-height: var(--lh_m);
    letter-spacing: 3.75px;
    text-align: center;
}

.h3_style_07 {
    font-size: var(--fsize_30);
    font-family: var(--font_05);
    font-weight: var(--fontw_l);
    line-height: var(--lh_m);
    letter-spacing: 4.50px;
    word-wrap: break-word;
}

.h4_style_01 {
    color: var(--main_c);
    font-size: var(--fsize_25);
    font-weight: var(--fontw_l);
    line-height: var(--lh_m);
    letter-spacing: 3.75px;
}

.h4_style_02 {
    color: var(--main_c);
    font-size: var(--fsize_25);
    font-weight: var(--fontw_l);
    line-height: var(--lh_m);
    letter-spacing: 3.75px;
    word-wrap: break-word;
}

.h4_style_03 {
    color: var(--main_c);
    font-size: var(--fsize_20);
    font-family: var(--font_05);
    font-weight: var(--fontw_l);
    line-height: var(--lh_m);
    letter-spacing: 3px;
    word-wrap: break-word;
    position: relative;
    padding-left: 60px;
}

.h4_style_03::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    display: inline-block;
    width: 45px;
    height: 1px;
    background-color: var(--act_c);
}

.table_style_01 {
    margin-top: 45px;
    border-top: 2px solid var(--main_c);
    width: 100%;
}

.table_style_01 tr>* {
    padding: 30px 0;
}

.table_style_01 tr {
    border-bottom: 1px solid var(--line_c);
}

.table_style_01 th {
    vertical-align: inherit;
    width: 26.5%;
    margin-right: 85px;
}

.table_style_02 {
    border-top: 1px solid var(--line_c);
}

.table_style_02 tr {
    border-bottom: 1px solid var(--line_c);
}

.table_style_02 tr>* {
    padding: 30px 0;
}

.table_style_02 th {
    width: 75px;
    vertical-align: inherit;
    color: var(--main_c);
}

.list_num li {
    list-style: decimal;
    /* padding-left: 0.5em; */
}

.list_num li::marker {
    color: var(--main_c);
}

.list_style_01 {
    padding-left: 17.5px;
}

.list_style_01 li {
    line-height: 2;
}

.bc_grey {
    background-color: var(--bc_c);
}

/* -----------------------------------
header
----------------------------------- */
header {
    min-height: 96px;
    position: relative;
}

.logo img {
    max-height: 95px;
}

/* nav */
header>.flex_box {
    align-items: center;
    justify-content: space-between;
}

#menu-header {
    flex-basis: 60%;
}

#menu-header {
    flex-basis: 60%;
}

.menu-main-menu-container,
#menu-main-menu {
    width: 100%;
}

#menu-main-menu {
    display: flex;
    flex-wrap: nowrap;
    color: var(--main_c);
    text-align: center;
    /* position: relative; */
}

#menu-header ul {
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 96px;
}

#menu-header ul ul {}

#menu-header ul li,
#menu-header ul li a {
    height: inherit;
}

#menu-header ul li:hover {
    background-color: #cfe8fc;
    transition: all 1s;
}

#menu-header ul li a {
    display: flex;
    align-items: center;
    text-decoration: none;
    font-size: var(--fsize_13);
    padding: 20px;
    /* padding: 20px 35px; */
    transition: all 1s;
}

#menu-header ul li li a {
    padding: 10px 35px;
}

#menu-header ul li a:hover {
    opacity: 0.6;
    transition: all 1s;
}

/*==矢印の設定*/
#menu-header ul li.menu-item-has-children a {
    display: inline-flex;
    padding-right: 0;
}

#menu-header ul li.menu-item-has-children::after {
    content: '';
    background: url(../image/icon_02.svg);
    background-size: cover;
    display: inline-flex;
    vertical-align: middle;
    width: 13px;
    height: 13px;
    margin-left: 1em;
    margin-right: 7px;
}

#menu-header li.menu-item-has-children ul {
    background-color: var(--sub_c);
    opacity: 0;
    transition: all .3s;
    visibility: hidden;
    width: 100%;
    /* width: 1280px; */
    padding: 0 calc(50vw - 640px);
    z-index: 4;
    display: flex;
    justify-content: space-evenly;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    top: 96px;
}

#menu-header li.menu-item-has-children:hover>ul,
#menu-header li.menu-item-has-children ul li:hover>ul,
#menu-header li.menu-item-has-children:active>ul,
#menu-header li.menu-item-has-children ul li:active>ul {
    visibility: visible;
    opacity: 1;
}

#menu-header li.menu-item-has-children ul li a {
    padding-right: 35px;
}

#menu-header li.menu-item-has-children ul li:last-child a {
    border-bottom: none;
}

#menu-main-menu>li:last-of-type {
    background: var(--main_c);
    /* position: relative; */
    /* color: var(--sub_c); */
}

#menu-main-menu>li:last-of-type>a {
    color: var(--sub_c);
    flex-direction: column;
    justify-content: center;
}

#menu-main-menu>li:last-of-type>a::before {
    content: url(../image/icon_01.svg);
    display: block;
    margin-bottom: 0.25em;
}

#menu-header #menu-main-menu>li.menu-item-has-children:last-of-type::after {
    /* width: calc(50vw - 640px);
    height: inherit;
    background-color: var(--main_c);
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    content: ""; */
}

#menu-main-menu::after {
    background-color: var(--main_c);
    content: "";
    height: inherit;
    width: calc(50vw - 596px);
    position: absolute;
    right: 0;
    z-index: -1;
}

/* -----------------------------------
footer
----------------------------------- */
#pagetop {
    height: 70px;
    width: 70px;
    background-color: var(--cat_c);
    cursor: pointer;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    right: calc(50vw - 640px);
    /* bottom: 273px; */
    bottom: 35px;
    z-index: 99;
}

.footer_contact {
    padding: 75px 0 125px;
    background-color: var(--main_c);
    color: var(--sub_c);
}

.footer_contact .flex_box {
    justify-content: space-between;
}

.footer_contact h2 {
    margin-bottom: 2em;
}

.footer_contact .box {
    flex-basis: 30%;
    align-items: center;
    justify-content: flex-start;
}

.footer_contact .box figure {
    margin-bottom: 1em;
}

.footer_contact .box:first-of-type figure img {
    margin-top: 10px;
}

.footer_contact .box h3 {
    font-size: var(--fsize_20);
    letter-spacing: 0.15em;
    margin-bottom: 0.5em;
}

.footer_contact .box .text {
    font-size: var(--fsize_13);
    line-height: 1.75;
    margin-top: 1em;
    text-align: center;
}

.footer_contact .box .btn_area_03 figure {
    margin: 0 10px 0 0;
}

.footer_contact .box .btn_area_03 .btn_style_02,
.footer_contact .box .btn_area_03 .btn_style_03 {
    /* align-items: center; */
}

.footer_contact .box .btn_area_03 figure img {
    margin: 0;
}

.footer_contact .box .btn_area_03 .btn_style_03 figure {
    margin-top: -10px;
}

.mainfooter {
    background-color: var(--sub_c);
    padding: 65px 0 30px;
}

.footer_information.flex_box {
    justify-content: space-around;
    margin-bottom: 5em;
}

.mainfooter .box p {
    font-size: var(--fsize_13);
    letter-spacing: 0.15em;
    line-height: 1.54;
}

.footer_info_h3 {
    font-size: var(--fsize_13);
}

.mainfooter .box p.telnun {
    font-size: var(--fsize_25);
    font-weight: 700;
}

.footer_info_under.flex_box {
    justify-content: space-between;
}

.footer_l.flex_box {
    align-items: center;
}

.footer_l>* {
    margin-right: 3em;
}

.sns a {
    display: inline-block;
}

.sns>*:nth-last-of-type(n+2) {
    margin-right: 1em;
}

footer {
    position: relative;
}

/* -----------------------------------
tab
----------------------------------- */
.tab {
    display: flex;
    flex-wrap: wrap;
}

.tab li {
    flex: 1;
}

.tab li a {
    display: block;
    background: var(--bc_c);
    text-align: center;
    font-weight: var(--fontw_l);
    line-height: 25px;
    letter-spacing: 2.25px;
    word-wrap: break-word;
    margin: 0 2px;
    padding: 10px 20px;
}

.tab li.active a {
    background-color: var(--main_c);
    color: var(--sub_c);
}

.area {
    display: none;
    opacity: 0;
    background: var(--sub_c);
}

.area.is-active {
    display: block;
    animation-name: displayAnime;
    animation-duration: 2s;
    animation-fill-mode: forwards;
}

@keyframes displayAnime {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}