@charset "UTF-8";
/* CSS Document */

@import url("https://use.typekit.net/oaj0bgk.css");

/*デバイス共通----------------------------------------------------------- */
html {
    font-size: 62.5%;
    max-width: 2000px;
    margin: 0 auto;
    overflow-x: hidden;
}

body {
    font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体",
        "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo,
        sans-serif;
    /*font-family: "Yu Mincho", YuMincho, HG明朝B, "MS Mincho", serif;*/
    font-size: 1.6rem;
    line-height: 1.65;
    color: #000;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
    word-break: break-all;
}

@media screen and (max-width: 767px) {
    body {
        font-size: 1.4rem;
        line-height: 1;
    }
}
p {
    margin-bottom: 0;
}
img {
    display: block;
}
a,
a img {
    transition: all 0.3s;
}
a:hover,
a img:hover {
    opacity: 0.7;
}
.dib {
    display: inline-block;
}
.m0a {
    margin: 0 auto;
}
.mla {
    margin-left: auto;
}
.posr {
    position: relative;
}
.posa {
    position: absolute;
}
.imgr {
    display: block;
    max-width: 100%;
    height: auto;
}
@media screen and (max-width: 767px) {
    .sp_scroll {
        width: 100%;
        overflow-x: scroll;
    }
    .sp_scroll > * {
        min-width: 768px;
    }
}

/*テキスト関連----------------------------------------------------------- */
.fwb {
    font-weight: bold !important;
}
.underline {
    text-decoration: underline;
}
/*12px*/
.font_xs {
    font-size: 12px;
}
/*14px*/
.font_s {
    font-size: 14px;
}
/*18px*/
.font_m {
    font-size: 18px;
}
/*24px*/
.font_l {
    font-size: 24px;
}
/*36px*/
.font_xl {
    font-size: 36px;
}
@media (min-width: 768px) and (max-width: 1229px) {
    /*12px*/
    .font_xs {
        font-size: 10px;
    }
    /*14px*/
    .font_s {
        font-size: 12px;
    }
    /*18px*/
    .font_m {
        font-size: 18px;
    }
    /*24px*/
    .font_l {
        font-size: 21px;
    }
    /*36px*/
    .font_xl {
        font-size: 26px;
    }
}
@media screen and (max-width: 767px) {
    /*10px*/
    .font_xs {
        font-size: 10px;
    }
    /*12px*/
    .font_s {
        font-size: 12px;
    }
    /*18px*/
    .font_m {
        font-size: 18px;
    }
    /*21px*/
    .font_l {
        font-size: 21px;
    }
    /*24px*/
    .font_xl {
        font-size: 24px;
    }
}
.tac {
    text-align: center !important;
}
.tal {
    text-align: left !important;
}
.tar {
    text-align: right !important;
}
.shadow {
    text-shadow: 0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
        0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
        0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
        0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
        0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
        0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
        0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
        0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1);
}
.font_min {
    font-family: "Yu Mincho", YuMincho, HG明朝B, "MS Mincho", serif;
}
.font_go {
    font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro",
        "Hiragino Kaku Gothic Pro", "游ゴシック体", YuGothic, "YuGothic M",
        sans-serif;
}
.font_din {
    font-family: din-2014, sans-serif;
    font-weight: 600;
    font-style: normal;
}

.indent {
    text-indent: -1em;
    padding-left: 1em;
}
.note {
    position: relative;
    font-size: 0.777em;
    padding-left: 1em;
}
.note:before {
    position: absolute;
    content: "※";
    top: 0;
    left: 0;
    font-size: 1em;
    line-height: 1.554em;
}
@media (min-width: 768px) and (max-width: 1229px) {
    .tab_shadow {
        text-shadow: 0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
            0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
            0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
            0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
            0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
            0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
            0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
            0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1);
    }
}

@media screen and (max-width: 767px) {
    .sp_tal {
        text-align: left !important;
    }
    .sp_shadow {
        text-shadow: 0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
            0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
            0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
            0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
            0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
            0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
            0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1),
            0 0 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(0, 0, 0, 0.1);
    }
}

/*余白&幅調整----------------------------------------------------------- */
.mt0 {
    margin-top: 0;
}
.mt5 {
    margin-top: 5px;
}
.mt10 {
    margin-top: 10px;
}
.mt15 {
    margin-top: 15px;
}
.mt20 {
    margin-top: 20px;
}
.mt30 {
    margin-top: 30px;
}
.mt45 {
    margin-top: 45px;
}
.mt60 {
    margin-top: 60px;
}
.mt75 {
    margin-top: 75px;
}
.mt90 {
    margin-top: 90px;
}
.mt120 {
    margin-top: 120px;
}
.mb0 {
    margin-bottom: 0;
}
.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;
}
.mb75 {
    margin-bottom: 75px;
}
.mb90 {
    margin-bottom: 90px;
}
.mb120 {
    margin-bottom: 120px;
}
.pt0 {
    padding-top: 0;
}
.pt5 {
    padding-top: 5px;
}
.pt10 {
    padding-top: 10px;
}
.pt15 {
    padding-top: 15px;
}
.pt20 {
    padding-top: 20px;
}
.pt30 {
    padding-top: 30px;
}
.pt45 {
    padding-top: 45px;
}
.pt60 {
    padding-top: 60px;
}
.pt75 {
    padding-top: 75px;
}
.pt90 {
    padding-top: 90px;
}
.pt120 {
    padding-top: 120px;
}
.pb0 {
    padding-bottom: 0;
}
.pb5 {
    padding-bottom: 5px;
}
.pb10 {
    padding-bottom: 10px;
}
.pb15 {
    padding-bottom: 15px;
}
.pb20 {
    padding-bottom: 20px;
}
.pb30 {
    padding-bottom: 30px;
}
.pb45 {
    padding-bottom: 45px;
}
.pb60 {
    padding-bottom: 60px;
}
.pb75 {
    padding-bottom: 75px;
}
.pb90 {
    padding-bottom: 90px;
}
.pb120 {
    padding-bottom: 120px;
}
.pl0 {
    padding-left: 0;
}
.pr0 {
    padding-right: 0;
}
.ph0 {
    padding-left: 0;
    padding-right: 0;
}
.ph15 {
    padding-left: 15px;
    padding-right: 15px;
}
@media (min-width: 768px) and (max-width: 1229px) {
    .tabmt0 {
        margin-top: 0;
    }
    .tabmt5 {
        margin-top: 5px;
    }
    .tabmt10 {
        margin-top: 10px;
    }
    .tabmt15 {
        margin-top: 15px;
    }
    .tabmt20 {
        margin-top: 20px;
    }
    .tabmt30 {
        margin-top: 30px;
    }
    .tabmt45 {
        margin-top: 45px;
    }
    .tabmt60 {
        margin-top: 60px;
    }
    .tabmb0 {
        margin-bottom: 0;
    }
    .tabmb5 {
        margin-bottom: 5px;
    }
    .tabmb10 {
        margin-bottom: 10px;
    }
    .tabmb15 {
        margin-bottom: 15px;
    }
    .tabmb20 {
        margin-bottom: 20px;
    }
    .tabmb30 {
        margin-bottom: 30px;
    }
    .tabmb45 {
        margin-bottom: 45px;
    }
    .tabmb60 {
        margin-bottom: 60px;
    }
    .tabpt0 {
        padding-top: 0;
    }
    .tabpt5 {
        padding-top: 5px;
    }
    .tabpt10 {
        padding-top: 10px;
    }
    .tabpt15 {
        padding-top: 15px;
    }
    .tabpt20 {
        padding-top: 20px;
    }
    .tabpt30 {
        padding-top: 30px;
    }
    .tabpt45 {
        padding-top: 45px;
    }
    .tabpt60 {
        padding-top: 60px;
    }
    .tabpb0 {
        padding-bottom: 0;
    }
    .tabpb5 {
        padding-bottom: 5px;
    }
    .tabpb10 {
        padding-bottom: 10px;
    }
    .tabpb15 {
        padding-bottom: 15px;
    }
    .tabpb20 {
        padding-bottom: 20px;
    }
    .tabpb30 {
        padding-bottom: 30px;
    }
    .tabpb45 {
        padding-bottom: 45px;
    }
    .tabpb60 {
        padding-bottom: 60px;
    }
    .tabpl0 {
        padding-left: 0;
    }
    .tabpr0 {
        padding-right: 0;
    }
    .tabph0 {
        padding-left: 0;
        padding-right: 0;
    }
}
@media screen and (max-width: 767px) {
    .spmt0 {
        margin-top: 0;
    }
    .spmt5 {
        margin-top: 5px;
    }
    .spmt10 {
        margin-top: 10px;
    }
    .spmt15 {
        margin-top: 15px;
    }
    .spmt20 {
        margin-top: 20px;
    }
    .spmt30 {
        margin-top: 30px;
    }
    .spmt45 {
        margin-top: 45px;
    }
    .spmt60 {
        margin-top: 60px;
    }
    .spmb0 {
        margin-bottom: 0;
    }
    .spmb5 {
        margin-bottom: 5px;
    }
    .spmb10 {
        margin-bottom: 10px;
    }
    .spmb15 {
        margin-bottom: 15px;
    }
    .spmb20 {
        margin-bottom: 20px;
    }
    .spmb30 {
        margin-bottom: 30px;
    }
    .spmb45 {
        margin-bottom: 45px;
    }
    .spmb60 {
        margin-bottom: 60px;
    }
    .sppt0 {
        padding-top: 0;
    }
    .sppt5 {
        padding-top: 5px;
    }
    .sppt10 {
        padding-top: 10px;
    }
    .sppt15 {
        padding-top: 15px;
    }
    .sppt20 {
        padding-top: 20px;
    }
    .sppt30 {
        padding-top: 30px;
    }
    .sppt45 {
        padding-top: 45px;
    }
    .sppt60 {
        padding-top: 60px;
    }
    .sppb0 {
        padding-bottom: 0;
    }
    .sppb5 {
        padding-bottom: 5px;
    }
    .sppb10 {
        padding-bottom: 10px;
    }
    .sppb15 {
        padding-bottom: 15px;
    }
    .sppb20 {
        padding-bottom: 20px;
    }
    .sppb30 {
        padding-bottom: 30px;
    }
    .sppb45 {
        padding-bottom: 45px;
    }
    .sppb60 {
        padding-bottom: 60px;
    }
    .sppl0 {
        padding-left: 0;
    }
    .sppr0 {
        padding-right: 0;
    }
    .spph0 {
        padding-left: 0;
        padding-right: 0;
    }
}
@media screen and (max-width: 767px) {
    .spwd50 {
        width: 50% !important;
    }
    .spwd60 {
        width: 60% !important;
    }
    .spwd70 {
        width: 70% !important;
    }
    .spwd80 {
        width: 80% !important;
    }
    .spwd90 {
        width: 90% !important;
    }
}

/*見出し----------------------------------------------------------- */
h1,
h2,
h3 {
    letter-spacing: -0.05em;
    line-height: 1.4;
}

h2 {
    margin: 0;
    padding: 0 0 60px;
    text-align: center;
}

h3 {
    margin: 0;
    padding: 0;
}

@media (min-width: 768px) and (max-width: 1229px) {
    h2 {
        padding: 0 0 45px;
    }
}

@media screen and (max-width: 767px) {
    h2 {
        padding: 0 0 30px;
    }
}

/*ボタン----------------------------------------------------------- */
.btn {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: block;
    background: #25ad38;
    margin: 0 auto;
    border: 3px solid #25ad38;
    border-radius: 5px;
    color: #fff;
    font-weight: bold;
    font-size: 190%;
    font-family: inherit;
    padding: 5px;
    transition: all 0.2s ease;
    cursor: pointer;
    -webkit-box-shadow: 0px 4px 0px #197827;
    box-shadow: 0px 4px 0px #197827;
    text-align: center;
    padding: 10px 0;
    position: relative;
    width: 100%;
}

.btn a {
    color: #fff;
}

.btn:focus {
    color: #fff;
    text-decoration: none;
}

.btn:hover {
    background: #45ba55;
    border: 3px solid #45ba55;
    -webkit-box-shadow: 0px 4px 0px #236251;
    box-shadow: 0px 4px 0px #236251;
    color: #fff;
    text-decoration: none;
}

.btn img {
    position: absolute;
    right: 5px;
    width: 20%;
    top: -12px;
}

.btn_gradient {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: block;
    background: #2d660a;
    background: -moz-linear-gradient(#5edd00 0%, #2d660a 100%);
    background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(#5edd00),
        to(#2d660a)
    );
    background: -webkit-linear-gradient(#5edd00 0%, #2d660a 100%);
    background: -o-linear-gradient(#5edd00 0%, #2d660a 100%);
    background: -ms-linear-gradient(#5edd00 0%, #2d660a 100%);
    background: linear-gradient(#5edd00 0%, #2d660a 100%);
}

button {
    margin: 0 auto;
    text-align: center;
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none;
    width: 100%;
}

button img:hover {
    opacity: 0.7;
}

/*Page Top----------------------------------------------------------- */
/*TOPへ戻る*/
.pagetop {
    display: none;
    position: fixed;
    bottom: 15px;
    right: 15px;
    z-index: 9999;
}

.pagetop a {
    position: relative;
    display: block;
    width: 50px;
    height: 50px;
    background-color: #153aa1;
    border-radius: 50%;
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
}

.pagetop a:before {
    position: absolute;
    content: "";
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 12px solid #fff;
    top: 50%;
    right: 50%;
    transform: translateX(50%) translateY(-60%);
}

.pagetop a:hover {
    display: block;
    text-align: center;
    color: #fff;
    font-size: 12px;
    text-decoration: none;
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;
}

.pagetop a:link,
.pagetop a:visited {
    color: #fff;
}

@media screen and (max-width: 767px) {
    .pagetop {
        bottom: 20px;
        right: 5px;
    }
}

/*white-box----------------------------------------------------------- */
.white_box {
    padding: 45px;
    background-color: #fff;
    margin-bottom: 30px;
}
.white_box_l {
    padding: 60px;
    background-color: #fff;
    margin-bottom: 30px;
}
.white_box_s {
    padding: 30px;
    background-color: #fff;
    margin-bottom: 30px;
}
.white_box_xs {
    padding: 15px;
    background-color: #fff;
    margin-bottom: 30px;
}
.white_box:last-of-type,
.white_box_l:last-of-type,
.white_box_s:last-of-type,
.white_box_xs:last-of-type {
    margin-bottom: 0;
}

@media (min-width: 768px) and (max-width: 1229px) {
    .white_box {
        padding: 30px;
        margin-bottom: 15px;
    }
    .white_box_l {
        padding: 45Q;
        margin-bottom: 30px;
    }
    .white_box_s,
    .white_box_xs {
        padding: 15px;
        margin-bottom: 15px;
    }
}

@media screen and (max-width: 767px) {
    .white_box,
    .white_box_s,
    .white_box_xs {
        padding: 15px;
        margin-bottom: 15px;
    }
    .white_box_l {
        padding: 30px;
        margin-bottom: 15px;
    }
}

/*背景左右はみだし----------------------------------------------------------- */
.white_box.bg_over_l,
.white_box.bg_over_l > *,
.white_box.bg_over_r,
.white_box.bg_over_r > * {
    position: relative;
    z-index: 1;
}
.white_box.bg_over_l:before {
    position: absolute;
    display: block;
    content: "";
    height: 100%;
    width: 50vw;
    top: 0;
    left: 50%;
    transform: translateX(-50vw);
    background-color: #eeeef5;
    z-index: 0;
}
.white_box.bg_over_r:before {
    position: absolute;
    display: block;
    content: "";
    height: 100%;
    width: 50vw;
    top: 0;
    right: 0;
    transform: translateX(50vw);
    background-color: #eeeef5;
    z-index: 0;
}

/* 画像カバースライドイン */
.slidein {
    width: 100%;
    overflow: hidden;
}
.slidein .slidein_inner {
    width: inherit;
    height: inherit;
    opacity: 0;
}
.isPlay {
    animation-name: play;
    animation-duration: 0.5s;
    animation-fill-mode: forwards;
    animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);
    position: relative;
    opacity: 1 !important;
}
.isPlay:before {
    animation-name: maskOut;
    animation-duration: 0.5s;
    animation-delay: 0.5s;
    animation-fill-mode: forwards;
    animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(
        109.6deg,
        rgba(156, 252, 248, 1) 11.2%,
        rgba(110, 123, 251, 1) 91.1%
    );
}
@keyframes play {
    from {
        transform: translateX(-100%);
    }
    to {
        transform: translateX(0);
    }
}
@keyframes maskOut {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(100%);
    }
}

/* 画像フェードイン */
.fadein {
    width: 100%;
    overflow: hidden;
}
.fadein .fadein_inner {
    width: inherit;
    height: inherit;
    opacity: 0;
}
.isfadein {
    animation-name: fadein;
    animation-duration: 0.5s;
    animation-fill-mode: forwards;
    animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);
    position: relative;
    opacity: 1;
}
@keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/*check_list----------------------------------------------------------- */
.check_list li {
    position: relative;
    padding-left: 1.5em;
    margin-bottom: 3px;
}

.check_list li:last-child {
    margin-bottom: 0;
}

.check_list li:before {
    position: absolute;
    content: "\f058";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    top: 0;
    left: 0;
    color: orange;
}

.list_border {
    border-bottom: 2px dashed #000;
}

.list_border_stop {
    border-bottom: 2px dashed #000;
    display: inline-block;
}

/*FOXcss追加スタイル----------------------------------------------------------- */
.fx-row-gutter-s {
    margin-left: -8px;
    margin-right: -8px;
}

.fx-row-gutter-s li {
    padding-left: 8px;
    padding-right: 8px;
}

.fx-row-gutter-xs {
    margin-left: -5px;
    margin-right: -5px;
}

.fx-row-gutter-xs li {
    padding-left: 5px;
    padding-right: 5px;
}

/*タブ切り替え----------------------------------------------------------- */
.tabs {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    margin: 0 auto;
}
.tab_item {
    width: 50%;
    height: 50px;
    border-bottom: 3px solid #5ab4bd;
    background-color: #d9d9d9;
    line-height: 50px;
    font-size: 16px;
    text-align: center;
    color: #565656;
    display: block;
    float: left;
    text-align: center;
    font-weight: bold;
    transition: all 0.2s ease;
}
.tab_item:hover {
    opacity: 0.75;
}
input[name="tab_item"] {
    display: none;
}
.tab_content {
    display: none;
    padding: 45px;
    clear: both;
    overflow: hidden;
}
#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content,
#design:checked ~ #design_content {
    display: block;
}
.tabs input:checked + .tab_item {
    background-color: #5ab4bd;
    color: #fff;
}

/*Container / Break----------------------------------------------------------- */
@media (min-width: 1230px) {
    .container {
        width: 1230px;
        margin: 0 auto;
        position: relative;
        padding-left: 15px;
        padding-right: 15px;
        box-sizing: border-box;
    }
    .p_none {
        display: none;
    }
    .pt_none {
        display: none;
    }
    .ps_none {
        display: none;
    }
    .t_none {
        display: block;
    }
    .ts_none {
        display: block;
    }
    .s_none {
        display: block;
    }
}

@media (min-width: 768px) and (max-width: 1229px) {
    body {
        overflow-x: hidden;
    }
    .container {
        width: 768px;
        margin: 0 auto;
        position: relative;
        margin-right: auto;
        margin-left: auto;
        padding-left: 15px;
        padding-right: 15px;
        box-sizing: border-box;
    }
    .p_none {
        display: block;
    }
    .pt_none {
        display: none;
    }
    .ps_none {
        display: block;
    }
    .t_none {
        display: none;
    }
    .ts_none {
        display: none;
    }
    .s_none {
        display: block;
    }
}

@media screen and (max-width: 767px) {
    body {
        overflow-x: hidden;
        display: block;
        max-width: 767px;
    }
    .container {
        margin-right: auto;
        margin-left: auto;
        padding-left: 15px;
        padding-right: 15px;
        box-sizing: border-box;
    }
    .p_none {
        display: block;
    }
    .pt_none {
        display: block;
    }
    .ps_none {
        display: none;
    }
    .t_none {
        display: block;
    }
    .ts_none {
        display: none;
    }
    .s_none {
        display: none;
    }
}

/*===================================================================================================
btnDesign
===================================================================================================*/
.cvBtn,
.mv button {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.3);
}
.cvBtn .btnText,
.mv button .btnText {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 10;
    transition: color 0.4s;
}
.cvBtn::before,
.mv button::before {
    content: "";
    display: block;
    padding-top: 100%;
    pointer-events: none;
    position: absolute;
    z-index: 0;
    width: 100%;
    top: 50%;
    left: 50%;
    opacity: 0;
    transform: translate(-50%, -50%) scale(0);
    border-radius: 100%;
    transform-origin: center left;
    transition: transform 0.4s, opacity 0.4s, color 0.4s, background 0.6s;
}
.cvBtn:hover::before,
.mv button:hover::before {
    transform: translate(-50%, -50%) scale(1.1);
    opacity: 1;
}
.cvBtn .icon {
    font-size: 1.6rem;
    margin-right: 10px;
}
.cvBtn.green {
    color: #fff;
    background: #41a9a5;
    border: 2px solid #41a9a5;
}
.cvBtn.green:hover {
    color: #41a9a5;
    opacity: 1;
}
.cvBtn.green::before {
    background: #fff;
}
.cvBtn.white {
    color: #000;
    background: #fff;
    border: 2px solid #fff;
}
.cvBtn.white:hover {
    color: #fff;
    opacity: 1;
}
.cvBtn.white::before {
    background: #000;
}
.cvBtn.white.green {
    color: #41a9a5;
    background: #fff;
    border: 2px solid #41a9a5;
}
.cvBtn.white.green:hover {
    color: #fff;
    opacity: 1;
}
.cvBtn.white.green::before {
    background: #41a9a5;
}
.cvBtn.black {
    color: #fff;
    background: #000;
    border: 2px solid #000;
}
.cvBtn.black:hover {
    color: #000;
    opacity: 1;
}
.cvBtn.black::before {
    background: #fff;
}
.cvBtn.orange,
.mv button.orange {
    color: #fff;
    background: #e04622;
    border: 2px solid #e04622;
}
.cvBtn.orange:hover {
    color: #e04622;
    opacity: 1;
}
.cvBtn.orange::before {
    background: #fff;
}
.cvBtn.white.orange {
    color: #e04622;
    background: #fff;
    border: 2px solid #e04622;
}
.cvBtn.white.orange:hover {
    color: #fff;
    opacity: 1;
}
.cvBtn.white.orange::before {
    background: #e04622;
}
.cvBtn.glay {
    color: #fff;
    background: #4c4c4c;
    border: 2px solid #4c4c4c;
}
.cvBtn.glay:hover {
    color: #4c4c4c;
    opacity: 1;
}
.cvBtn.glay::before {
    background: #fff;
}

/*===================================================================================================
共通パーツ
===================================================================================================*/

/*セクション間余白----------------------------------------------------------- */
section {
    padding: 90px 0;
}
footer {
    padding: 60px 0;
}
@media (min-width: 768px) and (max-width: 1229px) {
    section {
        padding: 75px 0;
    }
    footer {
        padding: 30px 0;
    }
}
@media screen and (max-width: 767px) {
    section {
        padding: 60px 0;
    }
    footer {
        padding: 15px 0;
    }
}

/*色関連----------------------------------------------------------- */
.bg_cl1 {
    background-color: #41a9a5;
}
.bg_cl2 {
    background-color: #e04622;
}
.cl_main {
    color: #41a9a5;
}
.cl_base {
    color: #e04622;
}
.cl_accent {
    color: #4265a1;
}
.cl_white {
    color: #fff;
}

/*テキスト関連----------------------------------------------------------- */
.highlight {
    background: -webkit-linear-gradient(transparent 60%, #ffd200 50%);
    background: -o-linear-gradient(transparent 60%, #ffd200 50%);
    background: linear-gradient(transparent 60%, #ffd200 50%);
    font-weight: bold;
}
.font_30 {
    font-size: 30px;
}
.font_40 {
    font-size: 40px;
}
.font_50 {
    font-size: 50px;
}
@media (min-width: 768px) and (max-width: 1229px) {
    .font_30 {
        font-size: 21px;
    }
    .font_40 {
        font-size: 25px;
    }
    .font_50 {
        font-size: 36px;
    }
}
@media screen and (max-width: 767px) {
    .font_30 {
        font-size: 18px;
    }
    .font_40 {
        font-size: 22px;
    }
    .font_50 {
        font-size: 36px;
    }
}

/*リンク色----------------------------------------------------------- */
a:link,
a:visited {
    color: #000000;
    text-decoration: none;
}
a.ul:link,
a.ul:visited {
    text-decoration: underline;
}

/*はみ出し画像中央----------------------------------------------------------- */
.wic_wrap {
    overflow-x: hidden;
}
.wic img {
    width: auto;
    max-width: unset;
}
.wic1 {
    margin-left: calc(50% - 1000px);
}
.wic1 img {
    width: 2000px;
    max-width: 2000px;
}
.wic2 {
    margin-left: calc(50% - 600px);
}
.wic2 img {
    width: 1200px;
    max-width: 1200px;
}
.wic3 {
    margin-left: calc(50% - 800px);
}
.wic3 img {
    width: 1600px;
    max-width: 1600px;
}

/*Page Top----------------------------------------------------------- */
.pagetop a {
    background-color: #41a9a5;
    filter: drop-shadow(3px 3px 4px rgba(0, 0, 0, 0.3));
}

/*Header----------------------------------------------------------- */
header a:link,
header a:visited {
    color: #fff;
}
header a:hover {
    opacity: 1;
}
header {
    position: fixed;
    top: 0;
    width: 100%;
    max-width: 2000px;
    height: 90px;
    padding: 15px 0;
    z-index: 99999;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(24px);
}
header:before {
    position: absolute;
    content: "";
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
    filter: blur(5px);
}
header .container,
header nav,
.nav_main,
.nav_sub {
    display: flex;
    align-items: center;
}
header .container {
    justify-content: space-between;
}
header .logo {
    display: flex;
    align-items: center;
    gap: 10px;
}
.nav_main {
    font-size: 14px;
    border-bottom: 1px solid #fff;
    margin-right: 15px;
}
.nav_main a {
    display: block;
    width: 100%;
    padding: 8px;
}
.nav_main a:hover {
    background: #41a9a5;
}
.nav_sub {
    font-size: 12px;
    font-weight: bold;
}
.nav_sub a {
    display: flex;
    align-items: center;
    padding: 10px 15px;
    border-radius: 30px;
    height: 42px;
}
.nav_sub a span {
    line-height: 20px;
}
.nav_favorite a {
    background: #fff;
    border: 1px solid #41a9a5;
}
.nav_favorite a:link,
.nav_favorite a:visited {
    color: #fff;
}
.nav_contact a {
    background: #e04622;
    border: 1px solid #e04622;
    width: 42px;
}
.nav_favorite {
    margin-right: 10px;
}

.breadclumb_wrap {
    padding-top: 100px;
}

@media screen and (max-width: 1229px) {
    /*はみ出し画像中央----------------------------------------------------------- */
    .wic1 img {
        width: 100%;
    }
    .wic1 {
        margin-left: -15px;
        margin-right: -15px;
    }
    .wic2 img {
        width: 100%;
    }
    .wic2 {
        margin-left: -15px;
        margin-right: -15px;
    }
    .wic3 img {
        width: 100%;
    }
    .wic3 {
        margin-left: -15px;
        margin-right: -15px;
    }

    /*Header----------------------------------------------------------- */
    #nav_toggle {
        position: absolute;
        top: 0;
        /**/
        right: 15px;
        /**/
        width: 40px;
        /**/
        height: 30px;
    }
    #nav_toggle div {
        position: relative;
        width: 30px;
        /**/
        margin: 0 auto;
    }
    #nav_toggle span {
        display: block;
        height: 4px;
        background: #fff;
        position: absolute;
        width: 100%;
        left: 0;
        transition: 0.5s;
        border-radius: 3px;
    }
    #nav_toggle span:nth-child(1) {
        top: 5px;
        /**/
    }
    #nav_toggle span:nth-child(2) {
        top: 15px;
        /**/
    }
    #nav_toggle span:nth-child(3) {
        top: 25px;
        /**/
    }
    .open #nav_toggle span:nth-child(1) {
        top: 12px;
        /**/
        -webkit-transform: rotate(135deg);
        -moz-transform: rotate(135deg);
        transform: rotate(135deg);
    }
    .open #nav_toggle span:nth-child(2) {
        width: 0;
        left: 50%;
    }
    .open #nav_toggle span:nth-child(3) {
        top: 12px;
        /**/
        -webkit-transform: rotate(-135deg);
        -moz-transform: rotate(-135deg);
        transform: rotate(-135deg);
    }
    div#nav_toggle:after {
        content: "MENU";
        color: #fff;
        display: block;
        padding-top: 80%;
        /**/
        font-family: "Roboto Condensed", sans-serif;
        font-style: italic;
        font-size: 10px;
        letter-spacing: 0.06em;
        text-align: center;
    }
    .open div#nav_toggle:after {
        content: "CLOSE";
    }
    nav ul.container {
        flex-direction: column;
        padding-left: 0;
        padding-right: 0;
    }
    nav li {
        width: 100%;
        border-left: 0;
        border-right: 0;
    }
    nav li:not(:last-child) {
        border-bottom: 1px solid #fff;
    }
    nav li a {
        flex-direction: row;
        color: #fff;
    }
    .nav_jp {
        padding-bottom: 0;
        padding-right: 10px;
    }
    nav li {
        position: relative;
    }
    nav li:before {
        position: absolute;
        content: "";
        right: 10px;
        width: 8px;
        height: 12px;
        background-image: url(../../img/common/sp_menu_arrow.png);
        top: calc(50% - 6px);
    }
    header {
        height: auto;
    }
    header .contact {
        display: none;
        width: 100%;
    }
    header.open .contact {
        display: block;
        width: 100%;
    }
    header .container,
    header nav,
    .nav_main,
    .nav_sub {
        flex-direction: column;
        align-items: flex-start;
    }
    header .logo {
        width: 40%;
    }
    .nav_main,
    .nav_sub {
        width: 100%;
        margin-right: 0;
    }
    .nav_sub li {
        margin-top: 10px;
    }
    .nav_sub li:not(:last-child) {
        border-bottom: 0;
    }
    .nav_main li a {
        text-align: center;
        padding: 15px;
    }
    .nav_sub li a {
        padding: 15px;
        text-align: center;
        font-size: 16px;
    }
    .nav_contact a {
        width: 100%;
    }
}

@media (min-width: 768px) and (max-width: 1229px) {
    .nav_sub {
        margin-top: 15px;
        margin-bottom: 15px;
        display: flex;
        flex-direction: row;
        gap: 15px;
    }
    .nav_sub li {
        width: 50%;
    }
    .nav_favorite {
        margin-right: 0;
    }
}
@media screen and (max-width: 767px) {
    #nav_toggle {
        top: 15px;
    }
    header .logo {
        width: 80%;
    }
}

/*main_btm----------------------------------------------------------- */
.main_content .main_btm {
    background: #ebebeb;
    margin-bottom: 60px;
    padding: 0;
}
.main_content .main_btm .fx-row {
    align-items: center;
}
.main_content .main_btm .fx-row > div {
    margin-top: 0;
}
.main_btm .check_list li {
    padding-left: 40px;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 2px dotted #ccc;
}
.main_btm .check_list li:last-child {
    margin-bottom: 0;
}
.main_btm .check_list li:before {
    content: url(../../img/common/pc_check.png);
}
.main_btm_h2 {
    position: relative;
}
.main_btm_h2:before {
    content: "";
    position: absolute;
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    top: 5px;
    left: 5px;
    border: 1px solid #fff;
}
@media (min-width: 768px) and (max-width: 1229px) {
    .main_btm .check_list {
        padding-right: 15px;
    }
    .main_btm .check_list li {
        padding-left: 30px;
        padding-bottom: 10px;
        margin-bottom: 10px;
        font-size: 14px;
    }
}
@media screen and (max-width: 767px) {
    .main_content .main_btm {
        padding: 15px;
    }
    .main_content .main_btm .fx-row > div {
        margin-top: 15px;
    }
    .main_content .main_btm_h2 {
        margin-bottom: 0;
    }
}

/*sec_service----------------------------------------------------------- */
.sec_service {
    background: #45b8b4;
}
.sec_service .service_wrap {
    position: relative;
}
.sec_service .service_wrap p:last-of-type {
    position: absolute;
    left: 7%;
    bottom: 15%;
    width: 100%;
}
.sec_service a {
    display: block;
    width: 48%;
    margin-left: 0;
}
@media screen and (max-width: 767px) {
    .sec_service .service_wrap p:last-of-type {
        left: 0;
        bottom: 8%;
    }
    .sec_service a {
        width: 80%;
        margin: 0 auto;
    }
}

/*sec_benefits----------------------------------------------------------- */
.sec_benefits {
    background: url(../../img/common/pc_benefits_bg.png) no-repeat center
        center/cover;
}
.sec_benefits .benefits_btn a {
    display: block;
    width: 40%;
    padding: 20px;
    background: #e04622;
    color: #fff;
    text-align: center;
    margin: 0 auto;
    border-radius: 45px;
}
@media (min-width: 768px) and (max-width: 1229px) {
    .sec_benefits .benefits_btn a {
        width: 60%;
        padding: 15px;
    }
}
@media screen and (max-width: 767px) {
    .sec_benefits .benefits_btn a {
        width: 90%;
        padding: 15px;
        font-size: 14px;
    }
}

/*Footer----------------------------------------------------------- */
footer {
    background: #000;
}
footer a:link,
footer a:visited {
    color: #fff;
}
footer a:hover {
    color: #41a9a5;
}
footer .footer_slash {
    padding: 0 10px;
}
footer .ward_ttl {
    color: #fff;
    font-weight: bold;
    padding-left: 10px;
    border-left: 4px solid #fff;
}
footer h3,
footer .ward_list {
    width: 75%;
    margin: 0 auto;
}
footer .ward_list {
    display: flex;
    flex-wrap: wrap;
}
footer .ward_list a {
    padding: 5px 10px;
}
@media screen and (max-width: 767px) {
    footer a:link,
    footer a:visited {
        font-size: 12px;
        display: block;
        padding: 10px 0;
    }
    footer .footer_logo img {
        margin: 0 auto;
    }
    footer .fx-col-100-xs {
        margin-top: 0;
    }
    footer .footer_slash {
        display: none;
    }
}

/*Pager----------------------------------------------------------- */
.pager > div {
    padding: 0 5px;
}
.pager a,
.pager .dot {
    border: 1px solid #ebebeb;
    background: #ebebeb;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 40px;
    padding: 0;
    box-sizing: border-box;
}
.pager a:hover {
    border: 1px solid #41a9a5;
    background: #41a9a5;
    color: #fff;
    font-weight: bold;
}
.pager .current {
    border: 2px solid #41a9a5;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 40px;
    padding: 0;
    box-sizing: border-box;
    color: #41a9a5;
    font-weight: bold;
}