@charset "UTF-8"; /*==========================
共通
===========================*/
* {
    box-sizing: border-box;
}

body {
    font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    color: #666;
    line-height: 1.6;
    font-weight: 500;
    font-size: 16px;
    font-feature-settings: "palt";
    -webkit-print-color-adjust: exact;
}

a:link {
    transition: 0.3s;
    text-decoration: none;
}

a:visited {
    color: #666;
}

a:hover {
    transition: 0.3s;
    opacity: 0.7;
    color: #666;
}

a:active {
    color: #666;
}

img {
    display: block;
}

.bold {
    font-weight: 900;
}

.small {
    font-size: 0.75em;
}

.big {
    font-size: 1.25em;
}

.flex {
    display: flex;
}

.pc_only {
    display: block;
}

.sp_only {
    display: none;
}

.xsp_only {
    display: none;
}

.tc {
    text-align: center;
}

.tr {
    text-align: right;
}

.tl {
    text-align: left;
}

@media screen and (max-width: 768px) {
    body {
        font-size: 14px;
    }

    img {
        max-width: 100%;
    }

    .flex {
        display: block;
    }

    .pc_only {
        display: none;
    }

    .sp_only {
        display: block;
    }

    .xsp_only {
        display: none;
    }
}

@media screen and (max-width: 480px) {
    .xsp_only {
        display: block;
    }
}

/*==========================
コンテナ
===========================*/
.wrap {
    max-width: 1160px;
    margin: 0 auto;
    padding: 0 30px;
}

@media screen and (max-width: 960px) {
    .wrap {
        width: 100%;
        padding: 0 3%;
    }
}

/*==========================
ヘッダー
===========================*/
.header {
    width: 100%;
    background-color: rgba(255,255,255,0.5);
    position: fixed;
    top: 0;
    transition: .4s;
    z-index: 100;
}

.header.hide {
    transform: translateY(-100%);
    transition: .4s;
}

.header-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /*ヘッダー高さ*/
    height: 60px;
}

.header-logo {
    width: 180px;
    margin-left: 10px;
    margin-bottom: 0;
}

.sayonara {
    display: none;
}

@media screen and (min-width: 1060px) {
    .header-logo {
        width: 100px;
        margin-left: 50px;
    }

    .header-wrap {
        /*ヘッダー高さ*/
        height: 70px;
    }
}

/*
グローバルナビ
===========================*/
.gnav {
    position: fixed;
    top: 0;
    width: 100%;
    height: 100vh;
    transform: translateX(100%);
    background: #fff;
    transition: transform .25s;
    padding: 4em 0;
    text-align: center;
}

.gnav.active {
    z-index: 101;
    transform: translateX(0);
}

.gnav-list {
    margin: 1em 0;
}

.gnav-list li a {
    display: block;
    color: #666;
    font-size: 16px;
    font-weight: 500;
    text-align: right;
    padding: 11px 2em;
}

.gnav-list .contact-btn a {
    display: block;
    background-color: #0071BC;
    color: #fff;
    width: 140px;
    height: 70px;
    margin-left: auto;
    text-align: center;
    margin: 1em 2em 0 auto;
    padding: 12px 5px;
}

.gnav-list .contact-btn img {
    margin: 0 auto 6px;
}

@media screen and (min-width: 1060px) {
    .gnav {
        display:flex;
        justify-content: flex-end;
        align-items: center;
        position: static;
        width: calc(100% - 100px);
        height: auto;
        margin-left: auto;
        transform: translateX(0);
        background: none;
        padding: 0;
    }

    .gnav-list {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .gnav-list li a {
        font-size: 13px;
        padding: 0 5px;
        border-right: 1px solid;
        line-height: 1;
    }

    .gnav-list li:nth-last-child(2) a {
        border-right: none;
    }

    .gnav-list .contact-btn a {
        width: 80px;
        margin: 0 0 0 20px;
        font-weight: 700;
        padding: 14px 0;
        border: none;
    }

    .gnav-list .contact-btn img {
        margin: 0 auto 10px;
    }
}

/*
ハンバーガーメニュー
===========================*/
.hamburger-wrap {
    z-index: 102;
    position: absolute;
    top: 12px;
    right: 20px;
    align-items: center;
    justify-content: center;
}

.hamburger {
    position: relative;
    width: 32px;
    height: 24px;
    padding: 0;
    border: 0;
    background-color: transparent;
    color: transparent;
    font-size: 0;
    cursor: pointer;
}

.hamburger:focus {
    outline: none;
}

.hamburger span {
    display: inline-block;
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #0071BC;
    border-radius: 4px;
    transition: all .3s;
}

.hamburger span:nth-of-type(1) {
    top: 0;
}

.hamburger span:nth-of-type(2) {
    top: 11px;
}

.hamburger span:nth-of-type(3) {
    bottom: 0;
}

.hamburger.active span:nth-of-type(1) {
    transform: translateY(11px) rotate(-45deg);
}

.hamburger.active span:nth-of-type(2) {
    opacity: 0;
    animation: active-bar02 .5s forwards;
}

@keyframes active-bar02 {
    100% {
        height: 0;
    }
}

.hamburger.active span:nth-of-type(3) {
    transform: translateY(-11px) rotate(45deg);
}

@media screen and (min-width: 1060px) {
    .hamburger {
        display: none;
    }
}

/*==========================
共通パーツ
===========================*/
section {
    padding-top: 100px;
}

.h2-title {
    position: relative;
    text-align: center;
    line-height: 1.6;
    color: #999999;
    font-size: 25px;
    margin: 0 auto 3em;
}

.h2-title .space {
    margin: 0 0.5em;
}

.h2-title .en {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1.7em;
    font-size: 20px;
}

.h2-title:before {
    content: "";
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg,#0071bc 0%,#0071bc 50%,#FBB03B 50%,#FBB03B 100%);
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    margin: auto;
}

.inner-wrap {
    max-width: 1000px;
    margin: auto;
}

@media screen and (max-width: 768px) {
    section {
        padding-top: 60px;
    }

    .h2-title {
        font-size: 21px;
        margin: 0 auto 3em;
    }
}

/*==========================
メインビジュアル
===========================*/
#mainVisual {
    background-image: url("../../img/main.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    height: 100vh;
    overflow: hidden;
    margin: 0;
}

#mainVisual h1 {
    position: absolute;
    top: 20px;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 3;
}

#mainVisual h1 img {
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    max-width: 700px;
}

@media screen and (max-width: 1024px) {
    #mainVisual {
        height: 500px;
    }

    #mainVisual h1 img {
        width: 60%;
    }
}

@media screen and (max-width: 768px) {
    #mainVisual {
        height: 280px;
    }

    #mainVisual h1 {
        position: absolute;
        top: 0;
        bottom: -60px;
        left: 0;
        right: 0;
        z-index: 3;
    }

    #mainVisual h1 img {
        width: 75%;
        max-width: 300px;
    }
}

/*==========================
Ref PaC「生活確認サービス」
===========================*/
.refpac {
    text-align: center;
}

.refpac h2 {
    margin: 0 auto 0.3em;
    text-align: center;
    line-height: 1.6;
    color: #0071BC;
    font-size: 50px;
    font-weight: 700;
}

.refpac-ttl {
    position: relative;
}

.refpac-ttl::after {
    content: "レフパック";
    position: absolute;
    top: -1.6em;
    left: 0;
    right: 0;
    font-size: 23px;
}

.sub-title {
    width: 100%;
    max-width: 750px;
    margin: 0 auto 50px;
}

.refpac p {
    text-align: center;
    font-size: 20px;
}

.refpac .btn-wrap {
    margin: 50px 0;
    justify-content: center;
}

.c-btn {
    display: inline-block;
    margin: 0 5%;
    color: #666;
    border: 1px solid;
    position: relative;
    font-size: 21px;
    font-weight: 700;
    width: 350px;
    height: 50px;
    line-height: 50px;
    text-indent: 1em;
    background-color: #fff;
}

.c-btn::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 10px;
    margin: auto;
    height: 20px;
    width: 20px;
    background-image: url(../../img/arrow.svg);
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
}

.refpac .c-btn:first-child {
    background-color: #1D68A8;
    border: 1px solid #1D68A8;
    color: #fff;
    margin-left: 0;
}

.refpac .c-btn:first-child::before {
    background-image: url(../../img/arrow02.svg);
}

.refpac .c-btn:last-child {
    margin-right: 0;
}

.refpac-image {
    margin: 0 auto 50px;
    width: 100%;
    max-width: 1000px;
}

@media screen and (max-width: 768px) {
    .refpac h2 {
        font-size: 24px;
    }

    .refpac-ttl::after {
        font-size: 14px;
    }

    .sub-title {
        width: 90%;
        height: 30px;
        margin-bottom: 30px;
    }

    .refpac p {
        margin-bottom: 1em;
        font-size: 16px;
    }

    .refpac .btn-wrap {
        margin: 20px 0;
        justify-content: center;
    }

    .c-btn {
        font-size: 18px;
        margin: 1em auto;
    }

    .refpac-image {
        margin-bottom: 30px;
    }
}

@media screen and (max-width: 350px) {
    .refpac h2 {
        font-size: 20px;
    }
}

/*
料金・ねらい・効果
===========================*/
.extract {
    background-color: #DEF1FB;
    padding: 25px;
}

.extract .box {
    background-color: #fff;
    margin-right: 30px;
    flex: 3;
}

.extract .box:last-child {
    margin-right: 0;
    font-weight: 700;
}

.extract .box p,.extract .box ul {
    font-size: 16px;
    line-height: 1.55;
    margin: 20px;
    text-align: left;
}

.extract .box li {
    position: relative;
    padding-left: 1em;
    margin-bottom: 0.5em;
}

.extract .box li::before {
    content: "●";
    position: absolute;
    left: -4px;
}

.extract .box .border {
    padding-bottom: 25px;
    margin-bottom: 25px;
    border-bottom: 1px solid;
}

.extract .box .note {
    font-size: 14px;
    font-weight: 500;
}

.extract h3 {
    background-color: #0071BC;
    color: #fff;
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    line-height: 30px;
}

.extract .box .price {
    font-size: 35px;
    font-weight: 700;
    padding: 16px 0;
    margin: 0 20px 27px;
    border-bottom: 1px solid;
    text-align: center;
}

.extract .price .big {
    font-size: 55px;
}

.extract .price .small {
    font-size: 20px;
}

@media screen and (max-width: 1100px) {
    .extract {
        flex-wrap:wrap;
    }

    .extract .box {
        flex: none;
        width: 100%;
        margin: 0 0 30px;
        padding-bottom: 10px;
    }
}

@media screen and (max-width: 768px) {
    .extract .box p,.extract .box ul {
        font-size: 14px;
        margin: 15px;
    }

    .extract .box .note {
        font-size: 12px;
    }

    .extract .box .price {
        font-size: 28px;
    }

    .extract .price .big {
        font-size: 46px;
    }

    .extract .price .small {
        font-size: 15px;
    }
}

/*==========================
サービス紹介
===========================*/
.youtube-wrap {
    max-width: 960px;
    margin: auto;
}

.youtube {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
}

.youtube iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*==========================
特長
===========================*/
#feature {
    text-align: center;
}

#feature .box {
    background-image: url(../../img/bg.png);
    border-radius: 300px;
    padding: 2em;
    width: 380px;
    height: 380px;
    margin: auto;
}

#feature .flex {
    margin: -9em auto;
    justify-content: space-between;
    flex-wrap: wrap;
}

#feature .flex .box {
    margin: 0;
}

.feature-img {
    margin: auto;
    height: 140px;
}

#feature .wrap > .box .feature-img {
    margin: auto;
    padding: 15px;
}

#feature .box h3 {
    font-size: 25px;
    padding: 10px 0;
    border-top: 1px solid;
    border-bottom: 1px solid;
}

@media screen and (max-width: 1000px) {
    #feature .box {
        padding: 2em;
        margin: 2em auto;
    }

    #feature .flex {
        margin: auto;
        display: block;
    }

    #feature .flex .box {
        margin: 2em auto;
    }
}

@media screen and (max-width: 500px) {
    #feature .box {
        padding: 2em;
        width: 280px;
        height: 280px;
        margin: 1.5em auto;
    }

    #feature .flex .box {
        margin: 1.5em auto;
    }

    .feature-img {
        height: 75px;
    }

    #feature .wrap > .box .feature-img {
        padding: 5px;
    }

    #feature .box h3 {
        font-size: 18px;
        padding: 8px 0;
    }
}

/*==========================
仕様
===========================*/
.spec .unit {
    background-color: #f2f2f2;
    padding: 30px 50px;
}

.spec .flex {
    margin: auto;
    justify-content: center;
}

.spec .img-box {
    flex-basis: 50%;
    text-align: center;
}

.spec .txt-box {
    flex-basis: 50%;
    margin-left: 40px;
}

.spec .txt-box h3 {
    border-bottom: 1px solid #999;
    padding-bottom: 10px;
    margin: 0 auto 15px;
    color: #999;
    text-align: center;
    font-size: 20px;
}

.spec .txt-box dl {
    display: flex;
    justify-content: space-between;
    margin-bottom: 6px;
    padding-bottom: 6px;
    border-bottom: 1px dashed #ccc;
}

.spec .txt-box dt {
    padding-left: 1em;
    text-align: left;
    font-weight: 500;
}

.spec .txt-box dd {
    text-align: left;
    width: 7.5em;
}

.spec .note {
    margin: 20px 0 0;
    padding: 15px 20px;
    border: 1px solid #999;
    font-size: 14px;
}

.spec .note ul {
    margin: 0;
}

.spec .note li:before {
    content: "※";
}

.spec .note a {
    color: #666;
}

.spec .note a:hover {
    color: #0071bc;
}

@media screen and (max-width: 960px) {
    .spec .flex {
        display:block;
        margin: auto;
        max-width: 500px;
    }

    .spec .img-box img {
        margin: auto;
    }

    .spec .txt-box {
        margin: 30px auto;
    }
}

@media screen and (max-width: 768px) {
    .spec .unit {
        padding: 30px 20px;
    }

    .spec .txt-box h3 {
        font-size: 18px;
    }

    .spec .note {
        margin: 0;
        padding: 1em;
    }
}

/*==========================
料金
===========================*/
.price .flex {
    justify-content: center;
    flex-wrap: wrap;
}

.price .inner-wrap {
    max-width: 1070px;
}

.price .box {
    text-align: center;
    background-color: #fff;
    width: 310px;
    min-height: 320px;
    border-radius: 16px;
    color: #999;
    padding: 25px 0 0;
    margin: 0 17.5px 30px;
    border: 5px solid #999;
}

.price .box img {
    height: 80px;
}

.price .box:nth-child(2) img {
    height: 70px;
    margin: 5px auto
}

.price dt {
    font-size: 30px;
    margin-top: 20px;
    position: relative;
}

.price dt::after {
    content: "";
    width: 120px;
    height: 2px;
    background-color: #999;
    position: absolute;
    bottom: -5px;
    left: 0;
    right: 0;
    margin: auto;
}

.price dd {
    color: #999;
    font-size: 65px;
    font-weight: 700;
    padding-top: 20px;
}

.price .box:nth-child(3) dd {
    font-size: 50px;
}

.price .small {
    font-size: 25px;
}

.price .note {
    font-size: 18px;
    color: #999;
    display: block;
    padding-top: 5px;
    font-weight: 500;
}

.payment {
    font-size: 100%;
}
.balloon1 {
  text-align:center;
  position: relative;
  display: inline-block;
  margin: 1.5em 2px;
  padding: 7px 10px;
  width: 49%;
  color: #555;
  font-size: 17px;
  font-weight: 700;
  background: #D2E1EE!important;
}

.balloon1:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #D2E1EE;
}

.balloon1 p {
  margin: 0;
  padding: 0;
  color: #1E639E!important;
}

@media screen and (max-width: 768px) {
    .price .box {
        margin: 0 auto 15px;
        padding: 20px 0 10px;
        max-width: 310px;
        width: 100%;
        min-height: inherit;
    }

    .price dt {
        font-size: 24px;
    }

    .price dd {
        font-size: 50px;
    }

    .price .box:nth-child(3) dd {
        font-size: 40px;
    }

    .price .small {
        font-size: 20px;
    }

    .price .note {
        font-size: 16px;
    }
}

/*==========================
お支払いスケジュール
===========================*/
.schedule dl:last-of-type {
    margin: 0;
}

.schedule dt {
    position: relative;
    font-size: 20px;
    padding: 20px 15px 20px 40px;
}

.schedule dt::before {
    content: "";
    width: 30px;
    height: 30px;
    background-image: url(../../img/tag.svg);
    position: absolute;
    left: 0;
}

.schedule dd {
    font-size: 16px;
    padding: 0 15px 10px;
}

.graph01 {
    font-size: 25px;
    font-weight: 700;
    margin-top: 30px;
}

.graph01 p {
    text-align: center;
    color: #1E639E;
    background-color: #D2E1EE;
    padding: 10px;
}

.graph01 .flex {
    justify-content: space-between;
}

.graph01 span {
    flex-basis: 8.3333%;
    display: block;
    text-align: center;
    background-color: #EFEFEF;
    padding: 10px 0;
    color: #999;
    border-right: 1px solid #fff;
}

.graph01 span:last-of-type {
    border-right: none;
}

@media screen and (max-width: 768px) {
    .schedule dt {
        font-size: 18px;
        padding: 10px 10px 10px 30px;
    }

    .schedule dt::before {
        width: 25px;
        height: 25px;
        background-repeat: no-repeat;
        background-size: 100%;
    }

    .schedule dd {
        font-size: 14px;
        padding: 10px 10px 10px;
    }

    .graph01 .flex {
        display: flex;
    }

    .graph01 p {
        padding: 10px;
        font-size: 16px;
        margin-bottom: 5px;
    }

    .graph01 span {
        font-size: 16px;
        padding: 3px;
        line-height: 1.3;
    }
}

/*
口座振替グラフ
===========================*/
.graph02 {
    margin: 30px auto 0;
    display: flex;
}
.graph02.payment span {
    font-size: 100%;
}

.quarter {
    width: 230px;
    margin-right: 15px;
}
.half {
    width: 460px;
    margin-right: 15px;
}

.balloon {
    width: 230px;
    font-size: 19px;
    font-weight: 700;
    background-color: #D2E1EE!important;
    padding: 10px;
    margin-bottom: 20px;
    position: relative;
}
.half .balloon {
    width: 460px;
}

.balloon::after {
    content: "";
    position: absolute;
    bottom: -15px;
    left: 25px;
    width: 0;
    height: 0;
    border-right: 20px solid #D2E1EE;
    border-top: 0 solid transparent;
    border-bottom: 15px solid transparent;
}
.half .balloon::after {
    left: 0;
    border-left: 20px solid #D2E1EE;
    border-right: 0;
}

.balloon p {
    margin: 0;
    color: #1E639E!important;
}

.month {
    display: flex;
}

.month span {
    flex: 3;
    color: #999!important;
    background-color: #EFEFEF!important;
    text-align: center;
    height: 50px;
    line-height: 50px;
    font-weight: 700;
    font-size: 25px;
    margin-right: 1px;
}

.month span:first-child {
    color: #fff!important;
    background-color: #1E639E!important;
}

.month span:last-child {
    position: relative;
    text-indent: -5px;
}

.month span:last-child::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: -15px;
    margin: auto;
    width: 0;
    height: 0;
    border-left: 15px solid #EFEFEF;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
}

.payment .month span:not(.last):last-child::after {
    border: none;
}

@media screen and (max-width: 1060px) {
    .graph02 {
        flex-wrap:wrap;
    }

    .quarter {
        width: calc(50% - 20px);
        margin-bottom: 30px;
    }
    .half {
        width: 100%;
        margin-bottom: 30px;
    }
}

@media screen and (max-width: 768px) {
    .graph02 {
        display:block;
    }

    .quarter {
        width: 100%;
        display: flex;
        align-items: flex-start;
        margin-bottom: 20px;
    }

    .half {
        width: 100%;
        display: flex;
        align-items: flex-start;
        margin-bottom: 20px;
    }

    .balloon {
        order: 2;
        width: 200px !important;
        font-size: 16px;
        margin-left: 25px;
    }

    .month {
        display: block;
    }

    .month span {
        display: block;
        font-size: 16px !important;
        width: 60px;
        margin-right: 0;
        margin-bottom: 1px;
    }

    .payment .month span {
        width: 180px;
    }

    .month span:last-child {
        text-indent: 0;
    }

    .month span:last-child::after {
        content: "";
        position: absolute;
        top: auto;
        bottom: -40px;
        right: 0;
        left: 0;
        margin: auto;
        width: 0;
        height: 0;
        border-top: 15px solid #EFEFEF;
        border-right: 30px solid transparent;
        border-left: 30px solid transparent;
    }
}

/*==========================
お申し込みの流れ
===========================*/
.flow .unit {
    background: url(../../img/bg_gr02.png);
    margin: 30px 0 90px;
    padding: 15px 15px 15px 0;
    position: relative;
}

.flow .unit::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -20px;
    margin: auto;
    width: 100px;
    transform: translateY(100%);
    border-top: 50px solid #D2E1EE;
    border-right: 50px solid transparent;
    border-left: 50px solid transparent;
}

.flow .no-arrow {
    margin-bottom: 20px;
}

.flow .no-arrow::after {
    content: none;
}

.flow .unit .img-area {
    width: 155px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.flow .unit .img-area img {
    width: auto;
    height: 70px;
}

.flow .unit .img-area .h60 {
    height: 60px;
}

.flow .unit .img-area .h90 {
    height: 90px;
}

.flow .unit .txt-box {
    width: calc(100% - 155px);
    min-height: 90px;
    background-color: #fff;
    padding: 0 20px;
    display: flex;
    align-items: center;
}

.flow .unit .txt-box h3 {
    font-size: 20px;
    font-weight: 700;
    margin: 0;
    line-height: 1.6;
}

.flow .unit .txt-box p {
    margin: 0;
}

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

.flow .way-days {
    background-color: #F8C780;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-orientation: upright;
    text-align: center;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    padding: 14px;
    position: relative;
    margin-bottom: 30px;
    letter-spacing: 0.5em;
}

.flow .way-days::after {
    content: "";
    position: absolute;
    top: auto;
    bottom: -30px;
    right: 0;
    left: 0;
    margin: auto;
    width: 0;
    height: 0;
    border-top: 30px solid #F8C780;
    border-right: 30px solid transparent;
    border-left: 30px solid transparent;
}

.way-flow {
    width: calc(100% - 70px);
}

.way-flow .flex {
    justify-content: space-between;
}

.way-flow .bank {
    flex: 2;
}

.way-flow .card {
    flex: 2;
}

.way-flow .pay-head {
    text-align: center;
    color: #fff;
    background-color: #6192BB;
    font-size: 20px;
    font-weight: 700;
    max-width: 250px;
    height: 40px;
    line-height: 40px;
    margin: 0 auto 25px;
    position: relative;
}

.way-flow .pay-head::after {
    content: "";
    position: absolute;
    top: auto;
    bottom: -10px;
    right: 0;
    left: 0;
    margin: auto;
    width: 0;
    height: 0;
    border-top: 10px solid #6192BB;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
}

.flow .arrow-unit {
    background: none;
    padding: 0;
}

.flow .arrow-unit img {
    margin: auto;
}

.way-flow > .unit, .unit.left-arrow {
    margin-top: 0;
}

.unit.left-arrow::after {
    right: auto;
    left: 25%;
}

.unit.half-unit {
    width: 50%;
}

@media screen and (max-width: 768px) {
    .flow .unit {
        padding: 10px;
        margin: 30px 0 50px;
    }

    .flow .unit::after {
        bottom: -10px;
        width: 50px;
        border-top: 30px solid #CDE0ED;
        border-right: 30px solid transparent;
        border-left: 30px solid transparent;
    }

    .flow .unit .img-area {
        margin: 0 auto 10px;
    }

    .flow .unit .img-area img {
        height: 50px;
    }

    .flow .unit .img-area .h60 {
        height: 35px;
    }

    .flow .unit .img-area .h90 {
        height: 60px;
    }

    .flow .unit .txt-box {
        width: 100%;
        padding: 10px 5px;
        min-height: auto;
    }

    .flow .unit .txt-box h3 {
        font-size: 14px;
    }

    .flow .unit .txt-box p {
        margin: 0;
        font-size: 13px;
    }

    .flow .no-arrow {
        margin-bottom: 20px;
    }

    .flow .way-days {
        font-size: 15px;
        padding: 5px;
        margin-bottom: 17px;
    }

    .flow .way-days::after {
        bottom: -17px;
        border-top: 17px solid #F8C780;
        border-right: 17px solid transparent;
        border-left: 17px solid transparent;
    }

    .way-flow {
        width: calc(100% - 44px);
    }

    .way-flow .flex:first-child {
        display: flex;
    }

    .way-flow .bank {
        margin-right: 10px;
    }

    .way-flow .card {
        flex: 2;
    }

    .way-flow .pay-head {
        font-size: 14px;
        width: 80%;
        height: 35px;
        line-height: 35px;
        margin: 0 auto;
    }

    .flow .arrow-unit {
        background: none;
        padding: 0;
    }

    .flow .arrow-unit img {
        margin: auto;
        width: 60px;
    }

    .way-flow > .unit, .unit.left-arrow {
        margin-top: 0;
    }

    .unit.left-arrow::after {
        right: auto;
        left: 17%;
    }
}

/*
申込書をご利用の方は下記までお気軽にご連絡ください
===========================*/
.contact-us {
    background-color: #F2F2F2!important;
    padding: 20px 25px 10px;
    margin-top: 50px;
}

.faq .contact-us {
    margin: 50px 50px 30px;
}

.faq .contact-us .qr-wrap {
    align-items: start;
    justify-content: center;
    font-weight: 700;
}

.faq .contact-us .qr-wrap img {
    width: 90px;
    margin: 0 15px;
}

.faq .contact-us .qr-wrap p {
    padding-top: 10px;
}

.contact-us h2 {
    text-align: center;
    font-size: 25px;
    font-weight: 700;
    margin: 0;
    padding-bottom: 20px;
    border-bottom: 2px solid;
}

.contact-us .btn-wrap {
    margin-top: 20px;
    justify-content: space-between;
}

.phone-wrap {
    align-items: center;
    justify-content: space-between;
}

.phone-wrap .phone-number {
    color: #1D68A8!important;
    font-weight: 700;
    font-size: 37px;
    margin: 0 0 0 10px;
}

.phone-wrap .phone-hours {
    color: #1D68A8!important;
    font-size: 16px;
    font-weight: 700;
}

.contact-us .c-btn {
    display: block;
    margin: 0 0 10px 0;
    font-size: 19px;
    width: 300px;
    height: 40px;
    line-height: 40px;
    text-indent: 2em;
}

.contact-us .c-btn:last-of-type {
    margin-right: 0;
}

.contact-us .c-btn::before {
    left: 15px;
    height: 20px;
    width: 20px;
    background-image: url(../../img/arrow.svg)!important;
    background-size: 100%!important;
    background-repeat: no-repeat!important;
    background-position: center!important;
}

.contact-us .ex-btn {
    border: 1px #1D68A8 solid;
    background-color: #1D68A8;
    color: #fff;
}

.contact-us .ex-btn::before {
    background-image: url(../../img/arrow02.svg);
}

.contact-us .c-btn.big {
    width: 600px;
    height: 90px;
    line-height: 90px;
    font-size: 32px;
    margin-bottom: 20px;
    background-color: #fff!important;
}

.contact-us .c-btn.big::before {
    left: 10px;
    height: 50px;
    width: 50px;
}

@media screen and (max-width: 1160px) {
    .faq .contact-us {
        padding: 20px 25px 20px;
        margin: 50px 0 30px;
    }

    .contact-us .btn-wrap {
        justify-content: center;
    }

    .faq .phone-wrap {
        flex-wrap: wrap;
        justify-content: center;
    }

    .faq .phone-wrap .phone-hours .pcbr {
        display: none;
    }

    .faq .contact-us .btn-wrap {
        display: block;
        margin-top: 20px;
    }

    .faq .contact-us .c-btn {
        margin: 0 auto 15px;
    }

    .faq .contact-us .c-btn:last-of-type {
        margin: 0 auto 15px;
    }

    .contact-us .c-btn:last-of-type {
        margin-right: auto;
    }

    .faq .phone-wrap .phone-hours {
        margin-top: 10px;
    }
}

@media screen and (max-width: 1060px) {
    .contact-us {
        padding: 20px 25px 20px;
    }

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

    .phone-wrap .phone-hours .pcbr {
        display: none;
    }

    .contact-us .btn-wrap {
        display: block;
        margin-top: 20px;
    }

    .contact-us .c-btn {
        margin: 0 auto 15px;
    }

    .contact-us .c-btn:last-of-type {
        margin: 0 auto 15px;
    }

    .phone-wrap .phone-hours {
        margin-top: 10px;
    }
}

@media screen and (max-width: 768px) {
    .contact-us {
        padding: 20px 15px 20px;
    }

    .contact-us h2 {
        font-size: 20px;
        padding-bottom: 10px;
        line-height: 1.3;
    }

    .phone-wrap {
        display: flex;
        flex-wrap: wrap;
        margin-top: 10px;
    }

    .phone-wrap img {
        width: 120px
    }

    .phone-wrap .phone-number {
        font-size: 26px;
        margin: 0 5px;
    }

    .phone-wrap .phone-hours {
        font-size: 14px;
        margin-top: 5px;
    }

    .contact-us .c-btn {
        font-size: 18px;
        text-indent: 3em;
        max-width: 100%;
        margin: 10px auto;
    }

    .contact-us .c-btn.big {
        width: 100%;
        max-width: 340px;
        height: 70px;
        line-height: 70px;
        font-size: 18px;
        margin-bottom: 20px;
    }

    .contact-us .c-btn.big::before {
        left: 15px;
        height: 30px;
        width: 30px;
    }

    .faq .contact-us .qr-wrap {
        text-align: center;
    }

    .faq .contact-us .qr-wrap img {
        margin: auto;
    }
}

/*==========================
共同開発
===========================*/
.partnership .box {
    border: #999 solid 1px;
    padding: 40px 20px;
    text-align: center;
}

.partnership img {
    margin: 0 auto 40px;
    width: 100%;
    max-width: 888px;
}

.partnership p {
    font-size: 20px;
    margin: auto;
}

@media screen and (max-width: 768px) {
    .partnership .box {
        padding: 30px 15px;
    }

    .partnership img {
        margin: 0 auto 30px;
    }

    .partnership p {
        font-size: 16px;
    }
}

/*==========================
フォーム調整
===========================*/
#contact {
    text-align: center;
}

form#mail_form {
    border: none;
    box-shadow: none;
    font-size: 16px;
}

form#mail_form dl dt, form#mail_form dl dd {
    border: none;
    text-align: left;
}

form#mail_form dl dt {
    background: #F2F2F2;
    padding: 15px 25px;
    margin-bottom: 10px;
    color: #888;
    font-weight: 500;
    width: 35%;
}

form#mail_form dl dt span.optional {
    display: none;
}

form#mail_form dl dd {
    padding: 0 0 10px;
    text-align: left;
    width: 64%;
}

form#mail_form dl dd .flex {
    padding: 15px 0;
}

form#mail_form dl dd .status {
    margin-right: 10px;
}

form#mail_form dl dd label {
    display: block;
    font-weight: 500;
}

form#mail_form dl dd label:last-of-type {
    margin-left: 40px;
}

form#mail_form dl dt span.required {
    display: none;
}

form#mail_form dl dt span {
    display: inline-block;
    color: #0071bc;
}

form#mail_form input[type="text"], form#mail_form input[type="email"], form#mail_form input[type="tel"],form#mail_form textarea {
    border: 1px solid #e6e6e6;
    border-radius: 0;
    background: none;
    padding: 14px 10px;
    margin: 0;
    width: 100%!important;
}

form#mail_form input#name_1, form#mail_form input#name_2, form#mail_form input#read_1, form#mail_form input#read_2 {
    width: 30%!important;
    margin-right: 2em;
}

span.furi {
    width: 2.5em;
    text-align: left;
    display: inline-block;
    padding-left: 2em;
    color: #888;
}

form#mail_form p#form_submit {
    border: none;
    position: relative;
    display: inline;
}

form#mail_form input#form_submit_button {
    margin: 2em auto 1em;
    background: #0071bc;
    border-radius: 0;
    border: none;
    font-size: 15px;
    font-weight: 700;
    padding: 7px 20px;
    padding-left: 45px;
    position: relative;
    transition: 0.3s;
    letter-spacing: 0.5em;
    text-indent: 0.5em;
}

form#mail_form input#form_submit_button:hover {
    filter: brightness(1.25);
    transition: 0.3s;
}

form#mail_form p#form_submit:before {
    content: "";
    width: 18px;
    height: 18px;
    position: absolute;
    background-image: url(../../img/arrow03.svg);
    background-size: 18px;
    background-repeat: no-repeat;
    background-position: center;
    bottom: 0;
    top: 0;
    left: 1.5em;
    margin: auto;
    z-index: 10;
}

form#mail_form dl {
    padding: 10px 0;
    width: 100%;
}

dt.height {
    height: 300px;
}

form#mail_form textarea {
    height: 300px;
}

@media screen and (max-width: 1000px) {
    form#mail_form dl dt {
        width: inherit;
        padding: 15px;
    }

    form#mail_form dl dd {
        width: inherit;
    }

    form#mail_form dl dd label:first-of-type {
        margin-bottom: 10px;
    }

    form#mail_form dl dd label:last-of-type {
        margin-left: 0;
    }

    form#mail_form input[type="text"], form#mail_form input[type="email"], form#mail_form input[type="tel"],form#mail_form textarea {
        max-width: 100%;
    }

    form#mail_form input#name_1, form#mail_form input#name_2, form#mail_form input#read_1, form#mail_form input#read_2 {
        width: 30%!important;
        margin-right: 1.5em;
    }

    span.furi {
        width: 2.5em;
        text-align: left;
        display: inline-block;
        padding-left: 2em;
        color: #888;
    }

    form#mail_form p#form_submit {
        border: none;
    }

    form#mail_form dl {
        padding: 10px 0;
        width: 100%;
    }

    dt.height {
        height: inherit;
    }

    form#mail_form textarea {
        height: inherit;
    }
}

/*==========================
当社が取扱う個人情報について
===========================*/
#policy {
    background-color: #F2F2F2;
    padding: 60px 0;
}

#policy .h2-title:before {
    background: linear-gradient(90deg,#999 0%,#999 100%);
}

#policy p {
    text-align: center;
    margin-bottom: 50px;
}

#policy dl {
    display: flex;
    border-bottom: 1px solid #ccc;
    font-size: 11px;
    padding-bottom: 5px;
    margin-bottom: 12px;
}

#policy dt {
    width: 380px;
}

#policy dd {
    width: calc(100% - 340px);
    line-height: 1.6;
}

#policy dd dl {
    border-bottom: none;
    padding-bottom: 4px;
    margin-bottom: 0;
}

#policy dd dt {
    position: relative;
    width: 11em;
}

#policy dd dt:after {
    content: "：";
    position: absolute;
    right: 0;
}

#policy dd dd {
    width: calc(100% - 11em);
    padding-left: 1em;
}

@media screen and (max-width: 768px) {
    #policy dl {
        display: block;
    }

    #policy dt {
        width: 100%;
    }

    #policy dd {
        width: 100%;
    }

    #policy dl:last-child dt {
        margin-bottom: 1em;
    }

    #policy dd dl {
        display: flex;
        padding-bottom: 0;
    }

    #policy dd dt {
        position: relative;
        width: 10.5em;
    }

    #policy dd dt:after {
        content: "：";
        position: absolute;
        right: 0;
    }

    #policy dd dd {
        width: calc(100% - 10.5em);
        padding-left: 0.5em;
    }
}

/*==========================
フッター
===========================*/
footer {
    font-size: 16px;
    text-align: center;
    padding: 4em 0 0;
    background: url(../../img/bg_gr.png)!important;
    color: #000;
}

footer a {
    color: #000;
}

footer a:visited {
    color: #000;
}

footer a:hover {
    color: #000;
    opacity: 0.6;
}

footer .from {
    border: 2px solid #000;
    display: inline-block;
    padding: 0 8px;
    font-family: "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif
}

footer img {
    height: 60px;
    margin: 1em auto;
    display: inline-block;
}

footer address {
    line-height: 1.5;
    margin: 0 auto;
}

footer .f_btn {
    display: inline-block;
    margin: 2em auto;
    border: 2px solid #000;
    padding: 3px 20px;
    padding-left: 50px;
    border-radius: 15px;
    position: relative;
    font-weight: 700;
}

footer .f_btn:before {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    background-image: url(../../img/mail_b.svg)!important;
    background-size: 20px!important;
    background-repeat: no-repeat!important;
    background-position: center!important;
    top: 0;
    bottom: 0;
    margin: auto;
    left: 1em;
}

footer .small {
    background-color: #0071bc!important;
    color: #fff!important;
    line-height: 3;
    margin: 2em auto 0;
}

@media screen and (max-width: 768px) {
    footer {
        font-size: 14px;
        margin-bottom: 0;
        padding: 3em 0 0;
    }

    footer img {
        height: 40px;
    }

    footer .small {
        background-color: transparent;
        color: #000;
        line-height: 3;
        margin: auto;
    }

    footer .f_btn {
        margin: 1.5em auto;
    }
}

/*==========================
サンクスページ
===========================*/
#thank {
    text-align: center;
    font-weight: 700;
    font-size: 18px;
    line-height: 2;
    color: #0071bc;
    padding: 10em 2em;
}

/*==========================
よくある質問ページ
===========================*/
#keyVisual {
    margin-top: 70px;
    background-color: #1E639E!important;
    background-image: repeating-linear-gradient(-55deg, transparent, transparent 6px, rgba(255, 255, 255, 0.2) 6px, rgba(255, 255, 255, 0.2) 7px )!important;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 130px;
    padding: 0;
}

#keyVisual h1 {
    color: #fff!important;
    font-size: 25px;
    font-weight: 700;
    position: relative;
}

#keyVisual h1::after {
    content: "";
    width: 100px;
    height: 2px;
    background-color: #fff!important;
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    margin: auto;
}

#keyVisual span {
    display: block;
    font-size: 16px;
    text-align: center;
    padding-top: 25px;
    color: #fff!important;
}

@media screen and (max-width: 768px) {
    #keyVisual {
        margin-top: 60px;
        height: 110px;
    }

    #keyVisual h1 {
        font-size: 22px;
    }

    #keyVisual h1::after {
        content: "";
        width: 90px;
        bottom: 28px;
    }

    #keyVisual span {
        font-size: 14px;
    }
}

section.faq {
    padding-top: 0;
}

.p-b {
    padding-bottom: 50px;
}

.faq .wrap > h2 {
    font-size: 30px;
    font-weight: 700;
    color: #1D68A8!important;
    padding: 50px 0 30px;
    margin: 0;
}

@media screen and (max-width: 768px) {
    .faq .wrap > h2 {
        font-size: 20px;
        padding: 40px 0 20px;
    }

    .p-b {
        padding-bottom: 30px;
    }
}

/*
Q&A
===========================*/
.faq-content {
    margin-bottom: 25px;
}

.question {
    background-color: #f2f2f2 !important;
    font-size: 25px;
    font-weight: 500;
    position: relative;
    cursor: pointer;
    min-height: 50px;
    line-height: 50px;
    padding-left: 70px;
    margin-bottom: 10px;
}

.question::before {
    content: "";
    width: 50px;
    height: 100%;
    background-image: url(../../img/question.svg)!important;
    background-repeat: no-repeat!important;
    background-size: 100%!important;
    background-color: #1d68a8 !important;
    background-position: center !important;
    position: absolute;
    left: 0;
    top: 0;
}

.question::after {
    content: "";
    width: 20px;
    height: 20px;
    background-image: url(../../img/question_on.svg)!important;
    background-repeat: no-repeat!important;
    background-position: center!important;
    position: absolute;
    right: 15px;
    top: 0;
    bottom: 0;
    margin: auto;
}

.question.open::after {
    background-image: url(../../img/question_off.svg)!important;
}

@media screen and (max-width: 960px) {
    .question {
        font-size: 20px;
    }
}

@media screen and (max-width: 768px) {
    .faq-content {
        margin-bottom: 15px;
    }

    .question {
        font-size: 15px;
        min-height: 65px;
        line-height: 1.5;
        padding: 30px 50px;
        display: flex;
        align-items: center;
    }

    .question::before {
        width: 35px;
        height: 35px;
        top: 0;
        bottom: 0;
        margin: auto;
    }

    .question::after {
        content: "";
        width: 20px;
        height: 20px;
        right: 15px;
    }
}

.answer {
    position: relative;
    display: none;
    padding: 12px 70px 50px;
    line-height: 1.5;
    counter-reset: number 0;
}

.answer img {
    margin-bottom: 25px;
}

.answer > p {
    margin-bottom: 1.5em;
}

.answer::before {
    content: "";
    width: 50px;
    height: 50px;
    background-image: url(../../img/answer.svg)!important;
    background-repeat: no-repeat!important;
    background-size: 100%!important;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}

.answer .pay {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 0;
    padding-bottom: 12px;
}

@media screen and (max-width: 768px) {
    .answer {
        padding: 45px 0 30px 0;
        line-height: 1.5;
        counter-reset: number 0;
    }

    .answer > p {
        margin-bottom: 1em;
    }

    .answer::before {
        width: 35px;
        height: 35px;
    }

    .answer .pay {
        font-size: 15px;
        font-weight: 700;
        margin-bottom: 0;
        padding-bottom: 12px;
    }
}

.answer .graph01 {
    margin-top: 0;
    margin-bottom: 50px;
}

.answer li {
    position: relative;
    padding-left: 1.75em;
    padding-bottom: 1.5em;
}

.answer li::before {
    position: absolute;
    counter-increment: number ;
    content: "("counter(number)")";
    top: 0;
    left: 0;
}

.answer a {
    color: #666666;
    text-decoration: none;
    display: inline-block;
    word-break: break-all
}

.answer a:hover {
    opacity: 0.6;
}

.answer .qr {
    width: 100px;
}

.answer .qr-wrap {
    display: flex;
    text-align: center;
    padding: 10px 0 40px;
}

.answer .qr-wrap .box {
    margin-right: 70px
}

.answer .qr-wrap .box:last-child {
    margin-right: 0;
}

.answer .qr-wrap img {
    margin: auto;
}

.answer .qr-wrap .career-logo {
    margin-bottom: 15px;
}

@media screen and (max-width: 768px) {
    .answer .qr-wrap {
        padding: 15px 0 30px;
    }

    .answer .qr-wrap .box {
        margin-right: 30px;
    }

    .answer .qr-wrap .career-logo {
        margin-bottom: 10px;
    }
}

.answer .career-logo {
    height: 18px;
}

.answer .career-link {
    display: flex;
    align-items: center;
    line-height: 1.8;
}

.answer .career-link .box {
    width: 106px;
    padding-right: 20px;
}

.answer .career-link .box img {
    margin-bottom: 0;
}

.answer .career-logo {
    margin-left: auto;
}

@media screen and (max-width: 768px) {
    .answer .career-logo {
        height: 15px;
    }

    .answer .career-link {
        display: block;
        margin-bottom: 20px;
    }

    .answer .career-link .box {
        width: auto;
        padding-right: 0;
    }

    .answer .career-logo {
        margin-left: 0;
        margin-bottom: 10px
    }
}

.faq-contact {
    margin-top: 50px;
}

.faq-contact .box {
    background-color: rgba(242,143,1,0.2)!important;
    width: 750px;
    padding: 50px 25px 35px;
    justify-content: center;
    position: relative;
    margin: auto;
}

.faq-contact h3 {
    display: inline-block;
    background-color: #F28F01!important;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    height: 40px;
    line-height: 40px;
    padding: 0 15px;
    margin: 0;
    position: absolute;
    left: 0;
    top: -20px;
    z-index: 1;
}

.faq-contact .box > .flex {
    align-items: flex-start;
}

.faq-contact .content-tag {
    color: #fff;
    font-weight: 700;
    font-size: 20px;
    background-color: #1D68A8!important;
    padding: 10px 20px;
    width: 270px;
    margin-right: 50px;
    position: relative;
}

.faq-contact .content-tag::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: -20px;
    margin: auto;
    width: 0;
    height: 0;
    border-left: 20px solid #1D68A8;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
}

.faq-contact .box > .flex:last-child .content-tag {
    background-color: #6195C2!important;
}

.faq-contact .box > .flex:last-child .content-tag::after {
    border-left: 20px solid #6195C2;
}

.faq-contact .mail {
    font-weight: 700;
}

.faq-contact .mail .contact-btn {
    width: 270px;
    height: 40px;
    line-height: 40px;
    background-color: #fff!important;
    border: #666 1px solid;
    text-align: center;
    text-indent: 1em;
    margin-bottom: 5px;
    position: relative;
}

.faq-contact .mail .contact-btn::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 1.25em;
    margin: auto;
    width: 25px;
    height: 20px;
    background-image: url(../../img/mail02.svg)!important;
    background-repeat: no-repeat!important;
    background-position: center!important;
    background-size: 100%;
}

.faq-contact .box > .flex img {
    margin-left: 30px;
    width: 70px;
}

.faq-contact .box > p {
    font-size: 21px;
    font-weight: 700;
}

.faq-contact .call {
    font-size: 14px;
}

.faq-contact .call .number {
    font-size: 37px;
    font-weight: 700;
    margin: 0;
    line-height: 1;
    position: relative;
    padding-left: 50px;
}

.faq-contact .call .number::before {
    content: "";
    background-image: url(../../img/toll-free.svg)!important;
    background-repeat: no-repeat!important;
    background-position: center!important;
    width: 40px;
    height: 27px;
    position: absolute;
    top: 6px;
    left: 0;
}

@media screen and (max-width: 880px) {
    .faq-contact .box {
        width: 100%;
    }

    .faq-contact .flex {
        display: block;
    }

    .faq-contact .box > .flex {
        margin: auto;
        text-align: center;
    }

    .faq-contact h3 {
        left: 0;
        right: 0;
        margin: auto;
        text-align: center;
        width: 70%;
    }

    .faq-contact .content-tag {
        margin: auto;
        margin: 15px auto;
        width: 100%;
    }

    .faq-contact .box > .flex img {
        text-align: center;
        margin: 1em auto 2em;
    }

    .faq-contact .content-tag::after {
        content: none;
    }
}

@media screen and (max-width: 768px) {
    .faq-contact {
        margin-top: 50px;
    }

    .faq-contact .box {
        padding: 30px 20px 5px;
    }

    .faq-contact h3 {
        font-size: 15px;
    }

    .faq-contact .content-tag {
        font-size: 16px;
    }

    .faq-contact .box > p {
        font-size: 18px;
    }

    .faq-contact .call {
        font-size: 13px;
    }

    .faq-contact .call .number {
        font-size: 30px;
    }
}

/*印刷時設定*/
@media print {
    .header {
        position: absolute;
    }

    a[href]:after {
        content: ""!important;
    }

    abbr[title]:after {
        content: ""!important;
    }
    section.faq {
        min-width: 1100px;
    }
    .faq-content {
        page-break-inside: avoid;
    }
    .answer {
        padding-bottom: 20px;
    }
}