@charset "UTF-8";

body {
    margin: 0px;
    font-family: "Noto Sans JP", "Arial", "メイリオ";
    line-height: 1.8;
}

html {
    font-size: 62.5%;
}    

body {
    font-size: 1.4rem;
    color: #333333;
}    
h1 {
    font-size: 5rem;
}
h2 {
    margin: 0 0 24px;
    font-size:  5.5vw;
    color: #1B9C96;
    text-align: center;
}
h3 {
    margin-top: 0;
    margin-bottom: 24px;
    font-size: 1.8rem;
    text-align: center;
}

@media screen and (min-width:640px) {
    body {
        font-size: 1.6rem;
    }   
    h1 {
        font-size: 5rem;
    }
    h2 {
        margin: 0 0 36px;
        font-size: 3.6rem;
    }
    h3 {
        margin-top: 0;
        font-size: 2.7rem;
    }
}


@media screen and (max-width:1199px) {
    .only-xl {
        display: none !important;
    }
}

@media screen and (max-width:959px) {
    .only-lg {
        display: none !important;
    }
}

@media screen and (max-width:639px) {
    .only-md {
        display: none !important;
    }
}

@media screen and (min-width:640px) {
    .only-sm {
        display: none !important;
    }
    a[href^="tel:"]{
        pointer-events: none;
    }
}


li {
    list-style: none;
}

.font-red {
    color: #FF6565;
}

.highlight-yellow {
    background: linear-gradient(transparent 60%, #FFEA7F 60%);
}

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

.underline {
    text-decoration: underline;
}

/* 途中で色が変わる線 */
.changing-border {
    position: relative;
    border-bottom: solid 2px rgba(0, 0, 0, 0.2)
}
.changing-border:after {
    content: "";
    display: block;
    line-height: 0;
    overflow: hidden;
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 25%;
    border-bottom: 2px solid #00B4B1;
}

.common-table-group {
    background-color: #EAEEF2;
}

.common-table {
    border-collapse: collapse;
    text-align: left;
    width: 100%;
    line-height: 2.0;
}

.common-table td {
    padding: 8px 12px;
    border: solid 1px #C5C9CC;
    box-sizing: border-box;
}

.common-table th {
    white-space: nowrap;
}

.br {
    display: inline-block;
}

.common-table-first-cell {
    width: 20%;
    min-width: 72px;
}
@media screen and (min-width:640px) {
    .common-table-first-cell {
        width: 30%;
    }
}

button, input, select, textarea {
    font-family : inherit;
    font-size : 1.6rem;
}

section {
    padding: 24px 0;
}

.wrapper {
    width: 90%;
    /* max-width: 960px; */
    margin: 0 auto;
    box-sizing: border-box;
}

@media screen and (min-width:960px) {
    section {
        padding: 36px 0;
    }
    
    .wrapper {
        width: 80%;
        max-width: 1024px;
    }
}



#page_top {
    width: 36px;
    height: 36px;
    position: fixed;
    right: 22px;
    bottom: 48px;
    background: #FFF;
    /* opacity: 0.6; */
    color: #F56A3F;
    border: solid 1px #F56A3F;
    border-radius: 50%;
    line-height: 26px;
}
#page_top a {
    position: relative;
    display: block;
    width: 36px;
    height: 36px;
    text-decoration: none;
}
#page_top a::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    content: '\f062';
    font-size: 2.0rem;
    color: #F56A3F;
    position: absolute;
    width: 25px;
    height: 25px;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    text-align: center;
}

.header {
    position: fixed;
    width: 100%;
    background-color: #FFF;
    z-index: 100;
}

.header-top {
    display: flex;
    justify-content: space-between;
    height: 60px;
    border-bottom: solid 1px #C5C9CC;
}

.header-top-brand {
    display: flex;
}

.header-top-brand a {
    display: flex;
}

.header-top-logo01 {
    height: 60px;
    padding: 8px;
    margin: auto 0 auto 4px;
    box-sizing: border-box;
}



@media screen and (min-width:640px) {
    .header {
        position: unset;
    }

    .header-top {
        height: 100px;
        border-bottom: none;
    }
    .header-top-logo01 {
        height: 74px;
    }
    
    .header-top-contact {
        display: inline-block;
        height: 80%;
        margin: auto 30px 0px;
        line-height: 1.4;
    }
    .header-top-contact-number {
        font-size: 3.4rem;
        font-weight: bold;
        text-decoration: none;
        color: #333;
    }
    .header-top-contact-icon {
        margin-right: 8px;
        color: #2680EB;
        font-size: 3.4rem;
    }
    .header-top-text {
        margin: auto 0;
        display: inline-block;
        padding: 4px 4px 0px 24px;
        font-size: 1.5rem;
        font-weight: bold;
    }
}


.menu-btn {
    position: absolute;
    top: 0px;
    right: 0px;
    display: flex;
    height: 60px;
    width: 60px;
    justify-content: center;
    align-items: center;
    z-index: 90;
    background-color: #00B4B1;
}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
    content: '';
    display: block;
    height: 3px;
    width: 25px;
    border-radius: 3px;
    background-color: #ffffff;
    position: absolute;
}
.menu-btn span:before {
    bottom: 8px;
}
.menu-btn span:after {
    top: 8px;
}
#menu-btn-check {
    display: none;
}
#menu-btn-check:checked ~ .menu-btn span {
    background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
}
#menu-btn-check:checked ~ .menu-btn span::before {
    bottom: 0;
    transform: rotate(45deg);
}
#menu-btn-check:checked ~ .menu-btn span::after {
    top: 0;
    transform: rotate(-45deg);
}

/* メニューアイテム */
.menu-content {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 60px;
    left: 100%;
    z-index: 80;
    background-color: #00B4B1;
    transition: all 0.5s;
}
.menu-content ul {
    padding: 10px 10px 0;
}
.menu-content ul li {
    border-bottom: solid 1px #ffffff;
    list-style: none;
}
.menu-content ul li a {
    display: block;
    width: 100%;
    font-size: 1.5rem;
    font-weight: bold;
    box-sizing: border-box;
    color:#ffffff;
    text-decoration: none;
    padding: 9px 15px 10px 0;
    position: relative;
}
.menu-content ul li a::before {
    content: "";
    width: 7px;
    height: 7px;
    border-top: solid 2px #ffffff;
    border-right: solid 2px #ffffff;
    transform: rotate(45deg);
    position: absolute;
    right: 11px;
    top: 16px;
}
#menu-btn-check:checked ~ .menu-content {
    left: 0;
}

.pc-menu {
    width: 100%;
    height: 60px;
    margin: 0;
    background-color: #00B4B1;
}

.pc-menu-list {
    display: flex;
    justify-content:space-around;
    align-items: center;
    margin: 0;
    height: 59px;
    padding: 0 5%;
}

.pc-menu-list-text {
    color: #FFF;
    font-size: 1.8rem;
    font-weight: bold;
    text-decoration: none;
}

.first-view {
    background-image: url("../misc/first_view_back.png");
    background-size: cover;
    background-position: bottom;
    background-repeat: no-repeat;
}

@media screen and (min-width: 640px) {
    .first-view-wrapper {
        display: flex;
        justify-content: space-between;
        margin: 0 auto;
        max-width: 1366px;
    }
}

@media screen and (max-width: 860px) {
    .pc-menu-list-text {
        font-size: 1.4rem;
    }
}

.content {
    padding-top: 60px;
}
@media screen and (min-width: 640px) {
    .content {
        padding-top: 0px;
    }
}


.first-view-inner {
    font-family: "小塚ゴシック Pro", "Arial", "メイリオ";
    display: flex;
    flex-direction: column;
    margin: 0 auto;
    padding-top: 12px;
    width: 100%;
}

.catch-copy {
    text-align: center;
    color: #F56A3F;
    font-size: 6.2vw;
    font-weight: bold;
    line-height: 1.3;
}

.first-view-text {
    margin: 0 auto;
    padding-bottom: 16px;
    width: 85%;
    line-height: 1.8;
    font-weight: 500;
}

.first-view img {
    width: 85%;
}
.first-view-image {
    display: inline-block;
    text-align: center;
}

.first-view-image {
    margin-top: auto;
}
.first-view-image img {
    vertical-align: bottom;
}

@media (min-width: 640px) {
    .catch-copy {
        font-size: 3.6vw;
        line-height: 1.3;
        text-align: left;
        margin-left: 4vw;
    }
    .first-view-inner {
        width: 60%;
        min-height: 320px;
        margin-bottom: 12px;
    }
    .first-view-text {
        font-size: 1.4rem;
        line-height: 2.4;font-weight: bold;
        width: 85%;
        padding: 0;
    }
    .first-view-inner img {
        margin: 0px auto 0px;
        width: 85%;
    }
    .first-view-image{
        width: 50%;
    }
    .first-view-image img{
        width: 100%;
    }
    .only-sm {
        display: block;
    }
}

@media (min-width: 960px) {
    .first-view-inner img {
        margin: 24px auto 0px;
        width: 85%;
    }
}
@media (min-width: 1200px) {
    .catch-copy {
        width: 550px;
        font-size: 4.2rem;
        line-height: 1.3;
    }
}

.home-about-text {
    text-align: center;
    margin-bottom: 20px;
}

.home-about-text span {
    margin: 4px auto 0px;
    background: linear-gradient(transparent 60%, #FFEA7F 60%);
    font-size: 4.8vw;
    font-weight: bold;
}

.home-about-description {
    text-align: left;
}

@media (min-width: 640px) {
    h2 {
        text-align: center;
    }
    .home-about-text span {
        font-size: 3vw;
    }
}
@media (min-width: 960px) {
    .home-about-text span {
        font-size: 2.8rem;
    }
}
@media (min-width: 1200px) {
    .home-about-text span {
        font-size: 3.2rem;
    }
}


.home-card {
    display: flex;
    flex-direction: column;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 16px 12px;
    border: solid 2px #1B9C96;
    border-radius: 16px;
}

.home-card > * {
    margin: 0 auto;
}

.card-title {
    padding: 8px;
    font-size: 2.0rem;
    font-weight: bold;
}

.card-text {
    width: 95%;
}

@media  screen and (min-width: 640px) {
    .home-cards {
        margin-top: 30px;
    }
    .home-cards-inner {
        display: flex;
        justify-content: space-between;
    }
    .home-card {
        width: 28%;
        margin-top: 16px;
        margin-bottom: 16px;
    }
}

.introduction {
    display: flex;
    flex-direction: column;
    background-image: url("../misc/introduction_back.png");
}

.introduction-wrapper {
    margin-top: 12px;
    margin-bottom: 12px;
    padding: 20px;
    border: solid 1px rgba(0, 0, 0, 0.1);
    border-radius: 16px;
    background-color: #FFF;
}

.introduction-image01, .introduction-image02 {
    width: 95%;
}
.introduction-text, .introduction-life {
    text-align: left;
    line-height: 2;
}
.introduction-text .weight-bold, .introduction-life .weight-bold {
    font-size: 1.6rem;
}
.introduction-life {
    margin: 16px 0;
}

.introduction-button {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 24px 0px 16px;
    padding: 14px 0px;
    background-color: #00B4B1;
    border-radius: 40px;
    text-decoration: none;
    text-align: center;
    color: #fff;
    font-size: 2.8vh;
    font-weight: bold;
}

.introduction-icon-arrow {
    position: absolute;
    padding: 2px 0px 0px;
    right: 22px;
}

@media  screen and (min-width: 640px) {
    .introduction {
        background-image: url("../misc/introduction_back_blue.png");
        background-size: cover;
    }
    .introduction-wrapper {
        align-items: center;
        padding: 30px;
        text-align : left;
    }
    .introduction-image01, .introduction-image02 {
        width: 34.5%;
        text-align : center;
        margin: 0 auto;
    }
    .introduction-image02 {
        text-align: right;
        float: right;
    }
    .introduction-image01{
        margin-right: 16px;
    }
    .introduction-image02{
        margin-left: 16px;
    }
    .introduction-text {
        display: inline-block;
        width: 60%;
        vertical-align: top;
        font-size: 1.4rem;
    }
    .introduction-button {
        margin: 0 auto;
        width: 230px;
        font-size: 2.0rem;
    }
}

@media  screen and (min-width: 960px) {
    .introduction-button {
        width: 33%;
    }
}


.contact-banner {
    display: flex;
    justify-content: space-between;
    height: 420px;
    background-image: url("../misc/background_cta.png");
    background-repeat: no-repeat;
    background-size: cover;
}

.contact-banner-inner {
    margin: 33px auto 33px auto;
    padding-top: 12px;
    padding-left: 33px;
    padding-right: 33px;
    width: 559px;
    height: 353px;
    max-width: 540px;
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 16px;
    box-sizing: border-box;
}

.contact-banner-header {
    display: flex;
    margin: 0 auto;
    width: 456px;
}

.contact-banner-title{
    margin: 0 0 8px 0;
    color: #F56A3F;
    font-size: 3.6rem;
    font-weight: bold;
}

.contact-banner-tel-icon {
    margin: 16px 12px;
    font-size: 5.2rem;
    color: #2680EB;
}

.contact-banner-tel {
    display: block;
    margin: 0 auto;
    padding-left: 32px;
    font-size: 5.2rem;
    font-weight: bold;
    color: #333333;
    font-family: "Roboto", "Arial", "メイリオ";
    text-decoration: none;
}

.contact-banner-image01 {
    margin-right: 12px;
    width: 30%;
}

.contact-banner-image01 > img{
    width: 90%;
}

.contact-banner-image02 {
    display: none;
}

.contact-banner-button {
    position: relative;
    display: block;
    margin: 0 auto 16px;
    width: 80%;
    padding: 14px 0;
    height: 42px;
    background-color: #F56A3F;
    border-radius: 40px;
    color: #FFF;
    font-size: 2.0rem;
    text-decoration: none;
    text-align: center;
}
.contact-banner-icon-arrow {
    position: absolute;
    padding: 10px 0px 0px;
    right: 22px;
}

@media  screen and (min-width: 960px) {
    .contact-banner-wrapper {
        display: flex;
        justify-content: space-between;
    }

    .contact-banner-image02 {
        display: unset;
    }
    .contact-banner-image02 {
        margin-top: auto;
        width: 56%;
        margin-right: -10%;
    }
    .contact-banner-image02 img {
        max-width: 532px;
        max-height: 420px;
        width: 100%;
        vertical-align: bottom;
    }

    .contact-banner-inner {
        margin: 33px auto 33px 0;
        padding-left: 33px;
        width: 60%;
    }

    .contact-banner-tel {
        margin: 0 auto;
        padding-left: 12px;
        font-size: 4.6rem;
    }

    .contact-banner-button {
        width: 100%;
    }
}


.price {
    font-family: "游ゴシック", "Arial", "メイリオ";
}
.price h2 {
    font-family: "Noto Sans JP", "Arial", "メイリオ";
}

.price-text {
    text-align: center;
    font-size: 1.5rem;
    font-weight: bold;
}

.price-table {
    border-collapse: collapse;
    margin: 24px 0;
    text-align: left;
    width: 100%;
}
.price-table th {
    background-color: #00B4B1;
    color: #FFF;
    font-weight: normal;
}
.price-table th, .price-table td {
    padding: 8px 12px;
    border: solid 1px #00B4B1;
}
th.table-th01 {
    border-right: solid 1px #FFF;
}


@media  screen and (min-width: 640px) {
    .price-text {
        text-align: center;
        font-size: 2.4rem;
        font-weight: bold;
    }
    .price-description-content {
        display: flex;
        justify-content: space-around;
        margin: 20px 0;
    }
    .price-description-title {
        display: flex;
        width: 18%;
        height: 40px;
        background-color:#2680EB;
        border-radius: 20px;
        color: #FFF;
        font-weight: bold;
        align-items: center;
    }
    .price-description-title > span {
        margin: 0 auto;
    }
    .price-description-text {
        width: 80%;
        display: inline-block;
        margin: 4px 0 4px 32px;
    }
    .price-description-text > p {
        margin: 0;
        font-weight: bold;
    }
}

.requirement-title {
    margin: 16px auto 12px 0px;
    padding: 12px 0px 4px 0px;
    font-size: 1.8rem;
    font-weight: bold;
}

.requirement-strong {
    font-weight: bold;
}

.requirement-card {
    display: flex;
    flex-direction: column;
    margin: 12px 0px 10px 0px;
    padding: 20px;
    border: solid 3px #00B4B1;
    border-radius: 16px;
    font-family: "游ゴシック", "Arial", "メイリオ";
    font-size: 1.5rem;
    font-weight: bold;
}

.requirement-card-image {
    margin: 0 auto;
    width: 75%;
}

.requirement-card ul {
    padding-left: 20px;
}

.requirement-card li {
    list-style: unset;
}


@media screen and (min-width: 640px) {
    .requirement-title {
        font-size: 2.4rem;
    }
    
    .requirement-strong {
        margin-bottom: 12px;
        color: #FF6565;
        font-size: 2.0rem;
    }
    .requirement-card {
        display: flex;
        justify-content: left;
        flex-direction: unset;
        padding: 30px;
    }
    .requirement-card-image {
        margin: auto 0;
        padding-bottom: 12px;
        width: 28%;
        height: 28%;
    }
    .requirement-card-text {
        display: inline-block;
        margin-left: 0;
    }
}


.flow {
    background-image: url("../misc/flow_back.png");
}

.flow-card {
    padding: 20px;
    background-color: #FFF;
    border: solid 2px #00B4B1;
    border-radius: 16px;
}

.flow-card-header {
    margin-bottom: 12px;
    line-height: 1.3;
}

.flow-card-number {
    margin: 0px 15px 0px 4px;
    color: #00B4B1;
    font-size: 2.6rem;
    font-weight: bold;
}

.flow-card-title {
    position: relative;
    top: -3px;
    color: #F56A3F;
    font-size: 2.0rem;
    font-weight: bold;
}

.icon-arrow-down {
    text-align: center;
    color: #00B4B1;
    font-size: 6.4rem;
    line-height: 1.3;
}

@media screen and (min-width: 640px) {
    .flow-card {
        padding: 20px 30px;
    }
    .flow-card-header {
        margin: 0;
    }
    .flow-card-text {
        margin-left: 52px;
    }
    .flow-card-text-top {
        margin-top: 0;
    }
}


.acd-check{
    display: none;
}
.acd-label{
    display: block;
    margin: 5px auto;
    padding: 10px 0;
    text-align: center;
    font-weight: bold;
    cursor :pointer;
}

.acd-content{
    height: 0;
    border-bottom: solid 1px rgba(0, 0, 0, 0.2);
    transition: .2s;
    overflow: hidden;
}
.acd-check:checked + .acd-label + .acd-content{ 
    height: auto; /* ここ */
    padding: 0px 0px 15px 0px;
}

.acd-label{
    position: relative;
    text-align: left;
    
}
.acd-label:after {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    content:  '\f078';
    font-family: "Font Awesome 5 Free";
    transition: .2s;
    height: 100%;
    margin: auto 0;
    align-items: center;
}
.accordion-qanda > .acd-label:after {
    color: #00B4B1;
    font-size: 2.0rem;
}

.acd-check:checked + .acd-label:after{
    transform:rotate(180deg);
}

.qanda-title {
    display: inline-block;
    margin: 0px 12px;
    width: 70%;
}

.qanda-text {
    display: inline-block;
    margin: 0px 12px;
    width: 80%;
}

.qanda-icon {
    display: inline-block;
    width: 31px;
    height: 30px;
    text-align: center;
    vertical-align: top;
    font-size: 2.4rem;
    font-weight: normal;
    line-height: 26px;
}

.qanda-icon-q {
    color: #FFF;
    background-color: #00B4B1;
    border-radius: 16px;
}

.qanda-icon-a {
    color: #F56A3F;
    background-color: #FFF;
    border: solid 1px #F56A3F;
    border-radius: 16px;
}

@media screen and (min-width: 640px) {
    .acd-label{
        margin: 12px auto;
    }
}

@media screen and (min-width: 960px) {
    .qanda-wrapper-h2 {
        display: none !important;
    }
}


.info-title {
    display: flex;
    justify-content: space-between;
    margin-bottom: 4px;
    padding: 12px 0px 4px 0px;
    font-size: 1.8rem;
    font-weight: bold;
}

/* .info-list {
    color: #333;
    text-decoration: none;
    font-size: 1.2rem;
    font-weight: normal;
} */


.info-content {
    border-bottom: dashed 1px #9E9E9E;
}
.info-content .acd-content {
    border-bottom: none;
}

.info-content > .acd-label:after {    
    color: #F56A3F;
    font-size: 2.0rem;
}

.acd-label-info {
    display: flex;
    justify-content: space-between;
    margin: 10px 0;
    padding: 10px 0;
}

.acd-label-info, .acd-label-info * {
    text-decoration: none;
}

.acd-label-info:hover .info-text {
    text-decoration: underline;
}

.info-icon-arrow {
    margin: auto 0;
    color: #F56A3F;
    font-size: 1.8rem;
}

.info-inner {
    width: 85%;
    text-align: left;
    font-weight: normal;
}

.info-date {
    line-height: 26px;
    color: #1B9C96;
    font-size: 0.8rem;
    font-weight: 500;
}

.info-text {
    color: #333;
    /* text-decoration: underline; */
}

.info-content-text p {
    margin: 0;
}

/* .info-arrow {
    text-align: right;
    margin: auto 4px;
    width: 10%;
    color: #F56A3F;
} */

@media screen and (min-width: 640px) {
    .info-title {
        font-size: 2.4rem;
    }

    .info-inner {
        display: flex;
        justify-content: left;
    }
    .info-date {
        margin: 0 12px 0 0;
        padding: 0 12px;
        border: solid 1px #1B9C96;
        border-radius: 20px;
        height: 26px
    }
}


.footer {
    background-color: #1B9C96;
    padding: 24px 0px 0px;
    color: #FFF;
}

.footer-wrapper {
    margin: 0 auto 24px;
    width: 80%;
    font-weight: 500;
    padding-bottom: 56px;
}

.footer-logo {
    display: block;
    text-align: center;
    margin-right: 48px;
}

.footer-company {
    margin: 8px 0px 24px;
}

.footer-company-name {
    font-size: 1.6rem;
}

.footer-menu-list01 a, .footer-menu-list02 a {
    display: block;
    text-decoration: none;
    color: #FFF;
}

.footer-menu-list01 i, .footer-menu-list02 i {
    margin-right: 8px;
}

.footer-contact {
    position: fixed;
    bottom: 0px;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    text-align: center;
}

.footer-contact > a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    padding: 12px 0;
    text-decoration: none;
    color: #FFF;
}

.footer-contact-tel {
    background-color: #2680EB;
}

.footer-contact-mail {
    background-color: #F56A3F;
}

.footer-icon-tel, .footer-icon-mail {
    margin-right: 6px;
    font-size: 2.4rem;
}

.footer-contact-text {
    vertical-align: top;
}

.footer-font-large {
    font-size: 1.8rem;
}

@media screen and (min-width: 640px) {
    .footer-wrapper {
        display: flex;
        justify-content: space-around;
        width: 80%;
        padding-bottom: 0;
    }
    .footer-logo {
        text-align: left;
    }
    .footer-menu-list01 i, .footer-menu-list02 i {
        display: none;
    }
    small {
        display: block;
        background-color: #2E4251;
        color: #FFF;
        text-align: center;
        font-size: 0.5rem;
    }
}

@media screen and (min-width: 960px) {
    .footer-menu-list01.footer-menu-list02 {
        display: none;
    }
}


.page-title {
    display: flex;
    align-items: center;
    height: 7vw;
    min-height: 50px;
    max-height: 100px;
    background-image: url("../misc/page-title_back.png");
}

.page-title > h1 {
    margin: 0 auto;
    color: #333333;;
    font-size: 2.2rem;
    font-family: "游ゴシック", "Arial", "メイリオ";
}
@media screen and (min-width: 640px) {
    .page-title > h1 {
        font-size: 2.7rem;
    }
}


.breadcrumb {
    margin: 16px auto 0px;
    width: 90%;
    color: #727272;
    font-size: 1.4rem;
    font-family: "游ゴシック", "Arial", "メイリオ";
}

.breadcrumb > a {
    text-decoration: none;
    color: #333;
}

.breadcrumb > a:hover {
    text-decoration: underline;
}

/* company.php */
section.company-about {
    padding-bottom: 0;
}

.company-wrapper01 {
    position: relative;
}

.company-catch {
    margin-bottom: 36px;
    text-align: center;
    font-size: 4.3vw;
    font-weight: bold;
}

@media screen and (min-width: 640px) {
    .company-catch {
        font-size: 2.0rem;
        line-height: 1.5;
    }
}

@media screen and (min-width: 960px) {
    .company-catch {
        font-size: 2.4rem;
        line-height: 1.5;
    }
}

@media screen and (min-width: 1200px) {
    .company-catch {
        font-size: 3.2rem;
        line-height: 46px;
    }
}

.philosophy {
    margin-bottom: 24px;
}

.philosophy01, .philosophy02, .philosophy03 {
    margin-bottom: 24px;
    font-weight: bold;
}

.philosophy-image {
    text-align: center;
}
.philosophy img {
    width: 100%;
}

@media screen and (min-width: 640px) {
    .philosophy {
        display: flex;
        justify-content: space-between;
        margin-bottom: 36px;
    }
    .philosophy01, .philosophy02, .philosophy03 {
        width: 90%;
        margin: 0 16px;
    }
    .philosophy-image {
        margin-bottom: 12px;
    }
}

.company-concept {
    font-family: "Noto Serif JP", "Arial", "メイリオ";
    /* margin: 0 12px 50px; */
    position: relative;
    padding: 12px;
    background-color: rgba(255, 255, 255, 0.9);
    border: solid 3px #1B9C96;
    border-radius: 16px;
    z-index: 20;
    font-size: 1.8rem;
    font-weight: bold;
    box-sizing: border-box;
}

.company-concept-image {
    position: absolute;
    bottom: -50px;
    left: 0;
    width: 100%;
    z-index: 0;
}

@media screen and (min-width: 640px) {
    .company-concept {
        margin-bottom: 50px;
        max-width: 1024px;
        padding: 16px 36px;
        font-size: 2.0rem;
    }
}
    

.company-message {
    background-image: url("../misc/flow_back.png");
    margin-top: 50px;
}

.president-image {
    text-align: center;
}

.company-text {
    line-height: 2;
}

@media screen and (min-width: 640px) {
    .company-wrapper02 {
        padding: 8px 0px 24px;
    }
    .company-text-inner01 {
        display: flex;
    }
    .president-image {
        order: 2;
        margin-left: 36px;
    }
    .company-text {
        line-height: 2.2;
    }
    .company-text-underwriting {
        font-family: "A-OTF Ryumin Pro B-KL";
        text-align: right;
    }
}


.company-overview {
    padding-bottom: 4px;
    font-weight: bold;
}

.company-table {
    font-family: "游ゴシック", "Arial", "メイリオ";
    margin: 20px auto 20px 0;
}

@media screen and (min-width: 640px) {
    .company-overview {
        font-size: 2.7rem;
    }
    .company-table {
        margin: 36px 0 24px;
    }
}


/* location.php */
.location-office-map {
    width: 100%;
    margin-bottom: 36px;
}

.office-table .common-table-first-cell {
    min-width: 120px;
}
@media screen and (min-width: 640px) {
    .office-table .common-table-first-cell {
        min-width: 200px;
    }
}

.locations-location {
    margin-bottom: 36px;
}

.location-header-inner * {
    height: 30px;
}

.location-name {
    color: #1B9C96;
    font-size: 2.7rem;
    font-weight: bold;
}

.location-header-inner {
    display: flex;
    justify-content: left;
    margin-bottom: 12px;
    font-size: 1.2rem;
}

.location-feature {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
    padding: 0 12px 2px;
    background-color: #2680EB;
    border-radius: 2vh;
    color: #FFF;
}

.location-feature2 {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
    padding: 0 12px 2px;
    background-color: #EB2680;
    border-radius: 2vh;
    color: #FFF;
}

.location-vacant {
    display: flex;
    align-items: center;
}

.location-vacant-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    color: #FFF;
    border-radius: 1vh;
}

.location-vacant-icon.full {
    background-color: #FF6565;
}

.location-vacant-icon.empty {
    background-color: #00B4B1;
    padding: 0 8px;
}

.location-services {
    display: flex;
    justify-content: space-between;
    margin: 24px 0;
}

.location-service {
    display: flex;
    flex-direction: column;
    width: 33%;
    text-align: center;
    font-size: 1.8rem;
    font-weight: bold;
}

.location-table tr td:first-child {
    font-weight: bold;
}

.map-button {
    padding: 2px 12px;
    background-color: #707070;
    border-radius: 2vh;
    text-decoration: none;
    color: #FFF;
    font-size: 1.2rem;
}

@media screen and (min-width: 640px) {
    .location-office-map {
        margin-bottom: 48px;
    }

    .locations-location {
        margin-bottom: 72px;
    }

    .location-header {
        display: flex;
        justify-content: left;
    }
    .location-header-inner {
        margin: auto 0 auto 24px;
        font-size: 1.6rem;
    }
    .location-feature {
        margin-right: 24px;        
        font-size: 1.4rem;
    }
    .location-feature2 {
        margin-right: 24px;        
        font-size: 1.4rem;
    }
    .location-vacant {
        display: flex;
        align-items: center;
    }
}


@media screen and (min-width: 960px) {
    .location-service {
        flex-direction: unset;
        align-items: center;
    }
    .location-service img {
        margin-right: 16px;
    }
}


/* flow.php */
.flow-introduction {
    background-image: none;
}


/* recruit.php */
.recruit-wrapper {
    /* position: relative; */
    margin-top: 24px;
    margin-bottom: -318px;
    vertical-align: middle;
}

.recruit-inner {
    position: relative;
    width: 90%;
    max-width: 1024px;
    margin: 0 auto;
    box-sizing: border-box;
    z-index: 20;
}

.recruit-text-main {
    margin-bottom: 12px; 
    text-align: center;
    font-size: 2.4rem;
    font-weight: bold;
    line-height: 1.3;
    color: #F56A3F;
}

.recruit-text-sub {
    font-family: "游ゴシック", "Arial", "メイリオ";
}

.recruit-image img {
    vertical-align: middle;
    width: 100%;
}

.recruit-background {
    position: relative;
    overflow: hidden;
    bottom: 318px;
}
.recruit-background img {
    vertical-align: middle;
}

.recruit-crew-wrapper {
    font-family: "游ゴシック", "Arial", "メイリオ";
}

.recruit-crew-inner {
    padding: 20px;
    border: solid 3px #1B9C96;
    border-radius: 16px;
    box-sizing: border-box;
    font-weight: bold;
}

.recruit-crew-image {
    text-align: center;
}
.recruit-crew-image img {
    width: 100%;
}

.recruit-crew-feature ul {
    padding-left: 0;
}

.recruit-crew-feature li {
    margin-bottom: 4px;
    padding-left: 24px;
    background-image: url("../misc/check_icon.png");
    background-repeat: no-repeat;
    background-size: 18px;
    background-position: 0px 6px;
    color: #F56A3F;
    font-size: 1.5rem;
}

.recruit-job {
    margin-bottom: 36px;
}

.recruit-job-title {
    margin-bottom: 24px;
    padding-bottom: 8px;
    font-size: 2.4rem;
    font-weight: bold;
}

.recruit-table tr td:first-child {
    font-weight: bold;
}

.recruit-night-flow span {
    border: solid 1px #333;
    border-radius: 2vh;
    font-size: 80%;
    margin-right: 4px;
    padding: 0 6px;
}

@media screen and (min-width: 640px) {
    .recruit-inner {
        display: flex;
    }
    .recruit-text {
        width: 60%;
        margin-right: 5%;
        margin-bottom: 24px;
    }
    .recruit-text-main {
        margin-bottom: 24px;
        width: 180%;
        text-align: left;
        font-size: 2.5vw;
        line-height: 1.5;
    }

    .recruit-image {
        margin-top: auto;
    }

    .recruit-background img {
        width: 100%;
        height: 318px;
    }

    .recruit-crew-inner {
        padding: 30px;
    }
    .recruit-crew-header {
        display: flex;
        justify-content: left;
    }
    .recruit-crew-feature {
        margin-left: 36px;
    }
    .recruit-crew-feature li {
        background-position: 0px 10px;
        padding-left: 28px;
        font-size: 2.0rem;
    }
    .recruit-job {
        margin-bottom: 48px;
    }
}

@media screen and (min-width: 960px) {
    .recruit-inner {
        width: 80%;
    }
}

@media (min-width: 1200px) {
    .recruit-text-main {
        font-size: 3.1rem;
    }
}

.contact-wrapper {
    text-align: center;
    margin-bottom: 24px;
}

.contact-description {
    font-family: "游ゴシック", "Arial", "メイリオ";
    margin-bottom: 24px;
}

.contact-tel-inner {
    padding: 12px;
    border: solid 1px #00B4B1;
    border-radius: 16px;
    box-sizing: border-box;
}

.contact-tel-text1 {
    font-size: 1.3rem;
    font-weight: bold;
}
.contact-tel-text2 {
    font-size: 1.6rem;
    font-weight: bold;
}

.contact-tel-number {
    color: #333;
    font-size: 3.6rem;
    font-weight: bold;
    text-decoration: none;
}

.contact-tel-number i {
    margin-right: 8px;
    color: #2680EB;
}

.contact-mail-inner {
    font-family: "Noto Sans CJK JP", "Arial", "メイリオ";
    padding: 24px;
    background-color: #96d3ef3a;
    border-radius: 20px;
    text-align: left;
    font-weight: 500;
    box-sizing: border-box;
}

.contact-mail-form > *, .send-mail-form > * {
    display: block;
}
.contact-mail-form > label {
    margin: 12px 0 4px;
}
.contact-mail-form > input, .contact-mail-form > textarea {
    width: 100%;
    border: solid 1px #C5C9CC;
    border-radius: 3px;
    /* height: 3.0rem; */
    padding: 10px 10px;
    box-sizing: border-box;
}

.contact-mail-radio {
    margin: 12px 0;
}
.contact-mail-radio > input {
    margin-right: 8px;
}
.contact-mail-radio > label {
    margin-right: 36px;
}

.contact-mail-form a, .send-mail-form a, .mail-success a {
    margin: 24px auto 0;
    padding-top: 2px;
    width: 70%;
    height: 4.0rem;
    background-color: #2680EB;
    border-radius: 2.0rem;
    text-decoration: none;
    font-size: 2.0rem;
    color: #FFF;
    text-align: center;
}


@media screen and (min-width: 640px) {
    .contact-tel-text {
        display: inline-block;
        margin-left: 10%;
        text-align: left;
    }
    .contact-tel-text1 {
        font-size: 2.0rem;
        font-weight: bold;
    }
    .contact-tel-text2 {
        font-size: 2.4rem;
        font-weight: bold;
    }    

    .contact-mail-inner {
        padding: 36px 48px;
    }

    .contact-mail-radio > label {
        font-size: 1.4rem;
    }

    .contact-mail-form > label {
        margin: 20px 0 4px;
    }

    .contact-mail-radio {
        margin: 24px 0;
    }

    .contact-mail-form a, .send-mail-form a, .mail-success a {
        margin-top: 36px;
        padding-top: 6px;
        width: 60%;
        height: 5.2rem;
        border-radius: 3.0rem;
        text-decoration: none;
        font-size: 2.4rem;
    }
}

@media screen and (min-width: 860px) {
    .contact-tel-inner {
        margin-bottom: 72px;
        background-image: url("../misc/contact_back.png");
        background-repeat: no-repeat;
    }
}

.contact-wrapper {
    margin-top: 36px;
}

.contact-mail-item {
    margin-bottom: 24px;
}

.contact-mail-item span {
    white-space: pre-wrap;
}

.contact-confirm-buttons {
    text-align: center;
}

a.confirm-cancel-button {
    display: inline-block;
    width: 40%;
    margin: 0 8px;
    background-color: #727272;
}

a.confirm-send-button {
    display: inline-block;
    width: 40%;
    margin: 0 8px;
}

.contact-error {
    margin: 2px 0 8px;
    color: red;
    font-size: 1.4rem;
}

.send-mail-error {
    margin-top: 24px;
    color: red;
    font-size: 2.0rem;
    font-weight: bold;
    text-align: center;
}

.mail-success a {
    display: block;
    margin-top: 36px;
    margin-bottom: 48px;
}