@charset "utf-8";

/********* Main Visual *********/
.top-header {
    position: relative;
    height: 38rem;
    padding: 4.5rem 0;
    width: 100%;
    max-width: 1900px;
    margin: 0 auto;
}
.top-bg {
    position: absolute;
    left: 3.5rem;
    right: 0;
    top: 20rem;
    height:100%;
    width: auto;
    z-index: -1;
    
}
.top-bg .main-visual {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 62%;
}
.top-bg .main-visual div {
    position: absolute;
    top: 0;
    right: 0;
    background-image: url("../images/top_bg.jpg");
    background-size: cover;
    background-position: left top;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
/*    height: 22rem;*/
    border-radius: 15px 0 0 15px;
}
.top-header h1 {
    font-family: 'Lato', sans-serif;
    color: #1f76c3;
    font-size: 3.3rem;
    padding-left: 3.5rem;
    padding-right: 15px;
    text-shadow: 0 0 10px #fff;
    letter-spacing: 0.12em;
    line-height: 1.4em;
}
@media (min-width: 400px) {
    .top-header {
        height: 47rem;
        padding: 5rem 0;
    }
    .top-bg {
        top: 20rem;
    }
}
@media (min-width: 470px) {
    .top-header {
        height: 52rem;
        
    }
    
}
@media (min-width: 576px) {
    .top-header {
        height: 63rem;
        padding: 9rem 0;
    }
    .top-bg {
        top: 22rem;
        left: 10rem;
    }
    
    .top-bg .main-visual div {
        
/*        height: 30rem;*/
    }
    .top-header h1 {
        font-size: 4rem;
        padding-left: 10rem;
    }
}
@media (min-width: 768px) {
    .top-header {
        padding: 25rem 0;
        height: 65rem;
    }
    .top-bg {
        left: 30%;
        top: 0;
/*        height: 65rem;*/
    }
    .top-bg .main-visual {
        height: auto;
        padding-bottom: 0
    }
    .top-bg .main-visual div {
        position: static;
        height: 65rem;
        background-position: left bottom;
    }
    .top-header h1 {
        font-size: 5.5rem;
    }
}
@media (min-width: 1500px) {
    .top-bg .main-visual {
        position: relative;
        width: 100%;
        height: 0;
        padding-bottom: 62%;
    }
    .top-bg .main-visual div {
        height: 100%;
        position: absolute;
        top: 0;
        right: 0;
    }
}
@media (min-width: 1600px) {
    .top-header {
        padding: 30rem 0;
        height: 70rem;
    }
}
@media (min-width: 1800px) {
    .top-header {
        padding: 35rem 0;
        height: 80rem;
    }
}
@media (min-width: 2000px) {
    .top-header h1 {
        padding-left: 5%;
    }
    .top-bg .main-visual div {
        right: 5%;
    }
}

@media (max-width: 484px) {
    .top-header {
    height: 50rem;
    }
    .top-bg {
        top: 25rem;
    }
}
/********* ABOUT US *********/
.aboutus .text {
    font-weight: 500;
    line-height: 2.188;
}
.about-list .list-title {
    font-size: 2.6px;
    margin-bottom: 3rem;
}
.about-list .list-title .number {
    display: block;
    font-family: 'Lato', sans-serif;
    font-size: 3.5rem;
    font-weight: bold;
    position: relative;
    margin-bottom: 3rem;
}
.about-list .list-title .number:after {
    position: absolute;
    bottom: -1rem;
    left: calc(50% - 2rem);
    content: '';
    width: 4rem;
    height: 3px;
    background-color: #ec6941;
}
.about-list .list-title .title {
    font-size: 2.6rem;
    font-weight: bold;
}
.about-list li {
    display: flex;
    flex-direction: column;
    margin-bottom: 8rem;
    height: 100%;
}
.about-list img {
    width: 100%;
}

.about-list .about-img {
    margin-bottom: 4rem;
}
.about-list  .about-text {
    line-height: 1.8;
}

/********* SERVICE *********/
.service .service-top li .bg-gray {
    padding: 3rem 3rem 2rem 3rem;
    font-weight: 500;
    display: flex;
    flex-direction: column;
    height: 100%;
    border-radius: 10px;
}
.service .service-top li figure {
    margin-bottom: 15px;
    
}
.service-list li {
    display: flex;
    flex-direction: column;
    height: 100%;
    text-align: center;
    margin-bottom: 8rem;
}
.service-list li .list-title {
    color: #1f76c3;
    font-size: 2rem;
    font-weight: bold;
    position: relative;
    margin-bottom: 10px;
    padding: 15px 0;
}
.service-list li .list-title:after {
    position: absolute;
    bottom: 0;
    left: calc(50% - 2rem);
    content: '';
    width: 4rem;
    height: 3px;
    background-color: #ec6941;
}

/********* FACILITY *********/
.facility-item {
    position: relative;
    margin-bottom: 3rem;
}
.facility-item .text-area {
    width: 100%;
    height: 100%;
/*    margin-bottom: 8rem;*/
    padding: 3rem;
    margin-right: auto;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 10px 10px 15px rgba(4, 0, 0, 0.05);
}
/*
.facility-item:nth-child(2n+1) .text-area {
    margin-left: auto;
    margin-right: 0;
    padding-left: 42rem;
    padding-right: 0;
}
*/
.facility-title {
    font-size: 2.6rem;
    margin-bottom: 10px;
}
.facility-info {
    position: relative;
    padding-top: 2rem;
    margin-top: 2rem;
}
.facility-info:before {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 4rem;
    height: 3px;
    background-color: #ec6941;
}
.facility-info li {
    position: relative;
    padding-left: 2.5rem;
}
.facility-info li:before {
    content: '●';
    color: #ec6941;
    position: absolute;
    top: 0;
    left: 0;
}
.facility-info li + li {
    margin-top: 1rem;
}
.facility-item .img-area {
/*    top: 7rem;*/
/*    height: 38rem;*/
    width: 100%;
/*    max-width: 45rem;*/
    z-index: 10;
}
.facility-item .img-area .img-wrap {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 67%;
}
.facility-item .img-area .img-wrap .img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
}
/*
.facility-item:nth-child(2n+1) .img-area {
    left: 0;
    right: auto;
}
*/
.facility-item .img-area .img {
    background-size: cover;
    background-position: left top;
    background-repeat: no-repeat;
    width: 100%;
    height: 30rem;
    border-radius: 10px;
}
/* .facility-item.facility-1 .img-area .img {
    background-image: url("../images/facility_01.jpg");
} */
.facility-item.facility-2 .img-area .img {
    background-image: url("../images/facility_02.jpg");
}
/* .facility-item.facility-3 .img-area .img {
    background-image: url("../images/facility_03.jpg");
} */
@media (min-width: 576px) {
    .facility-item {
        margin-bottom: 39rem;
    }
    .facility-item .text-area {
        padding: 4rem 6rem;
        width: 95%;
    }
    .facility-item .img-area {
        width: 95%;
        position: absolute;
        right: 0;
        bottom: -36rem;
    }
}
@media (min-width: 768px) {
    .facility-item {
        margin-bottom: 33rem;
    }
    .facility-item .text-area {
        max-width: 70rem;
        padding: 6rem 7rem;
    }
    .facility-item .img-area {
        max-width: 50rem;
        bottom: -29rem;
        
    }
    .facility-item .img-area div {
        height: 33.3333rem;
    }
}
@media (min-width: 992px) {
    .facility-item {
        margin-bottom: 8rem;
    }
    .facility-item .text-area {
        padding-right: 25rem;
/*        min-height: 42rem;*/
    }
    .facility-item:nth-child(2n+1) .text-area {
        margin-left: auto;
        margin-right: 0;
        padding-right: 0;
        padding-left: 25rem;
    
    }
    .facility-item .img-area {
        max-width: 45rem;
        top: 7rem;
        bottom: auto;
    }
    .facility-item:nth-child(2n+1) .img-area {
        left: 0;
        right: auto;
    }
    .facility-item .img-area div {
        height: 30rem;
    }
}
@media (min-width: 1200px) {
    .facility-item {
        margin-bottom: 14rem;
    }
    .facility-item .text-area {
        max-width: 87rem;
        padding-right: 32rem;
        min-height: 38rem;
    }
    .facility-item:nth-child(2n+1) .text-area {
        padding-left: 32rem;
    }
    .facility-item .img-area {
        max-width: 57rem;
        top: 7rem;
    }
    .facility-item .img-area div {
        height: 38rem;
    }
    
    
}
    
/********* VOICE *********/
.voice-list {
    width: 95%;
    margin: 0 auto;
}
.voice-text {
    width: 100%;
    max-width: 97rem;
}
.voice-img, .news-img {
    width: 100%;
    height: 0;
    padding-bottom: 69%;
/*    padding-bottom: 75%;*/
    position: relative;
    border-radius: 10px;
    overflow: hidden;
}
.voice-img img.border, .news-img img.border {
    border: 1px solid #d2d2d2;
    border-radius: 10px;
}
.voice-img img, .news-img img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
}
.voice-title {
    color: #1f76c3;
    font-size: 2rem;
    font-weight: 500;
    align-items: flex-start;
}
.voice-title span {
    display: block;
}
.voice-category {
    width: fit-content;
    color: #ec6941;
    border: 1px solid #ec6941;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 500;
    padding: 3px 12px;
    line-height: 1;
    white-space: nowrap;
    margin: 5px 15px 0 0;
}
.slick-items {
    position: relative;
}
.slick-arrow {
    position: absolute;
    top: calc(50% - 5rem);
    width: 15px;
    z-index: 10;
}

.voice-detail .voice-title {
    align-items: center;
    font-weight: bold;
    
}
.voice-detail .voice-img {
    padding-bottom: 75%;
}
@media (min-width: 576px) {
    .voice-list {
        width: 100%;
    }
}
@media (min-width: 768px) {
    .voice-detail .voice-title {
        display: flex;
    }
    .voice-category {
        display: inline-block;
    }
    .voice-detail .voice-img {
        padding-bottom: 127.03%;
    }
}
/*矢印の微調整*/
.slick-arrow.prev-arrow {left: -10px;}
.slick-arrow.next-arrow {right: -10px;}
@media (min-width: 600px) {
    .slick-arrow.prev-arrow {left: -3rem;}
    .slick-arrow.next-arrow {right: -3rem;}
}
@media (min-width: 768px) {
    .slick-arrow.prev-arrow {left: 0;}
    .slick-arrow.next-arrow {right: 0;}
}
@media (min-width: 795px) {
    .slick-arrow.prev-arrow {left: -3rem;}
    .slick-arrow.next-arrow {right: -3rem;}
}
@media (min-width: 992px) {
    .slick-arrow.prev-arrow {left: 0;}
    .slick-arrow.next-arrow {right: 0;}
}
@media (min-width: 1060px) {
    .slick-arrow.prev-arrow {left: -5rem;}
    .slick-arrow.next-arrow {right: -5rem;}
}
@media (min-width: 1200px) {
    .slick-arrow.prev-arrow {left: 0;}
    .slick-arrow.next-arrow {right: 0;}
}
@media (min-width: 1300px) {
    .slick-arrow.prev-arrow {left: -5rem;}
    .slick-arrow.next-arrow {right: -5rem;}
}


/********* NEWS *********/
.news .news-list li a {
    padding: 4rem 0;
}
.news .news-list li + li {
    border-top: 1px solid #d4d5d5;
}
.news-archive .news-list li {
    border-bottom: 1px solid #d4d5d5;
}
/*
.news-list li + li .news-archive-img {
    border-top: 1px solid #d4d5d5;
}
*/
.news-list .title {
    font-size: 2rem;
}

.news-detail .news-title, .voice-detail .voice-title {
    font-size: 3rem;
    padding-bottom: 2rem;
    margin-bottom: 4rem;
    border-bottom: 1px solid #d4d5d5;
}

/*
.news-archive .news-archive-img {
    width: 100%;
    max-width: 30rem;
    margin-right: 4rem;
}
.news-archive .news-list {
    width: 100%;
    max-width: 97rem;
    margin: 0 auto;
}
*/
@media (min-width: 768px) {
/*
    .news-list li .news-archive-text {
        border-bottom: 1px solid #d4d5d5;
    }
*/
}
@media (min-width: 992px) {
    .news .section-title:after {
    left: 0;
}
}
@media (min-width: 1200px) {
    .news-archive .news-list li {
        border: none;
    }
    .news-list li .news-archive-img, .news-list li .news-archive-text {
        border-bottom: 1px solid #d4d5d5;
    }
    .news-list li .news-archive-img {
        padding-left: 0;
        margin-left: calc(15px + 8.333333%);
    }
    .news-list li .news-archive-text {
        padding-right: 0;
        margin-right: 15px;
    }
}

/********* FAQ *********/
.faq-list li {
    padding: 2.5rem 4rem;
    border-radius: 10px;
}
.faq-list li + li {
    margin-top: 3rem;
}
.faq-title {
    font-size: 2rem;
    position: relative;
    display: flex;
}
.faq-title span {
    display: block;
}
.faq-title .faq-number {
    font-size: 3rem;
    line-height: 1;
    width: 7.5rem;
}
@media (min-width: 576px) {
    .faq-answer {
        padding-left: 7.5rem;
    }
}


/********* CONTACT *********/
.contact-title {
    position: relative;
    font-size: 3rem;
    line-height: 1.2;
}
.contact-title:before, .contact-title:after {
    position: absolute;
    top: 50%;
    content: '';
    width: 8px;
    height: 3px;
    background-color: #1f76c3;
}
.contact-title:before {
    left: -2rem;
}
.contact-title:after {
    right: -2rem;
}
.contact-form .contact-title:after {
    right: -5rem;
}
.contact-form, .contact-tel {
    background-color: #fff;
    border-top: 3px solid #1868b8;
    border-radius: 0 0 10px 10px;
    padding: 5rem 3rem;
    box-shadow: 10px 10px 15px rgba(4, 0, 0, 0.05);
}
.contact-form tr {
    border-bottom: 1px solid #d2d2d2;
}
.contact-form tr:first-child {
    border-top: 1px solid #d2d2d2;
}
.contact-form th, .contact-form td {
    display: block;
    width: 100%;
}
.contact-form th {
    text-align: left;
    padding: 2.5rem 0 2.5rem 8rem;
    position: relative;
    vertical-align: middle;
    font-weight: 500;
    font-size: 16px;
}
.contact-form th.form-content {
    vertical-align: top;
}
.contact-form th.form-content.opt:before {
    top: 2.8rem;
}
.contact-form th.req:before, .contact-form th.opt:before {
    border: 1px solid #ec6941;
    border-radius: 3rem;
    padding: 0 14px;
    font-size: 14px;
    position: absolute;
    top: calc(50% - 10.5px);
    left: 0;
}
.contact-form th.req:before {
    content: '必須';
    color: #fff;
    background-color: #ec6941;
}
.contact-form th.opt:before {
    content: '任意';
    color: #ec6941;
    background-color: #fff;
}
.contact-form td {
    padding-bottom: 2.5rem;
}
.contact-form input, .contact-form textarea, .contact-form .wpcf7-select {
    border: none;
    background-color: #f7f8f9;
    width: 100%;
    height: 5rem;
    border-radius: 5px;
    padding: 1rem;
}
.contact-form textarea {
    height: 30rem;
}
.contact-form .wpcf7-select {
    max-width: 37rem;
}
.contact-form input[type='checkbox'] {
    width: 2rem;
    height: 2rem;
    vertical-align: bottom;
}
.contact-form input.short {
    max-width: 6rem;
}
.contact-form select.short{
    max-width: 9rem;
}
::placeholder {
    color: #bfbfbf;
    font-weight: 500;
}
.contact-form .wpcf7-list-item:first-child {
    margin-left: 0;
}
.contact-form .wpcf7-list-item + .wpcf7-list-item {
    margin-left: 3rem;
}
@media (min-width: 768px) {
    .contact-form .contact-title:after {
        right: -2rem;
    }
    .contact-form, .contact-tel {
        padding: 5rem 7rem;
    }
    .contact-form th, .contact-form td {
        display: table-cell;
        font-size: 18px;
    }
    .contact-form th {
        width: 26rem;
        padding: 2.5rem 0 2.5rem 9rem;
    }
    .contact-form th.req:before, .contact-form th.opt:before {
        left: 10px;
    }
    .contact-form td {
        padding: 2.5rem 0;
        width: calc(100% - 34.5rem);
    }
}
@media (min-width: 992px) {
    .contact-form th {
        width: 34.5rem;
        padding: 2.5rem 2.5rem 2.5rem 9rem;
    }
}

.policy {
    height: 30rem;
    overflow-y:scroll;
    padding: 4rem 2rem;
}
.policy h5 {
    font-weight: 400;
}
.policy ol {
    padding-left: 2.5rem;
}
.policy ol li {
    list-style: decimal;
}
.submit-btn{
    position: relative;
    width: 100%;
    max-width: 30rem;
    margin: 0 auto;
    overflow: hidden;
}
.submit-btn input {
    display: block;
    color: #fff;
    background-color: transparent;
    z-index:100;
    font-size: 2rem;
    border-radius: 5rem;
    width: 100%;
    max-width: 30rem;
    margin: 0 auto;
    padding: 2rem;
    height: auto;
    position: relative;
    overflow: hidden;
    transition: ease .2s;
}
.submit-btn .color-change-wrap {
    display: block;
    width: 100%;
    max-width: 30rem;
    height: 7rem;
    border-radius: 5rem;
    position: absolute;
    top: 0;
    right: 0;
    overflow: hidden;
}
.submit-btn .color-change-wrap:before {
    content: '';
    background-color: #1f76c3;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    height: 100%;
    width: 100%;
    transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    transform: scale(0, 1);
    transform-origin: right top;
}
.submit-btn:hover .color-change-wrap:before{
    transform-origin:left top;
    transform:scale(1, 1);
    opacity: 1;
}
.submit-btn .color-change {
    display: block;
    color: #fff;
    background-color: #ec6941;
    font-size: 2rem;
    width: 100%;
    max-width: 30rem;
    height: 7rem;
    position: relative;
    overflow: hidden;
    
}
.submit-btn .arrow-icon {
    content: url("../images/arrow_white.png");
    width: 15px;
    margin-left: 2rem;
    position: absolute;
    top: calc(50% - 34px);
    right: 3rem;
    z-index: 50;
}
.submit-btn.not-allowed {
    cursor: not-allowed;
    pointer-events: none;
}
.wpcf7-spinner {
    margin-top: 2rem;
    
}


@media (min-width: 768px) {
    .policy {
        padding: 4rem 5rem;
    }
    
}

.contact-tel .tel-number {
    font-size: 2rem;
}
.contact-tel .tel-number .number {
    font-size: 3.2rem;
}
@media (min-width: 576px) {
    .contact-tel .tel-number {
        font-size: 3.2rem;
    }
    .contact-tel .tel-number .number {
        font-size: 5rem;
    }
}



/********* COMPANY *********/
.comptany-info {
    border-collapse:separate;
    border: 1px solid #d2d2d2;
    border-radius: 10px;
    overflow: hidden;
}
.comptany-info th, .comptany-info td {
    display: block;
    padding: 2rem;
    border-bottom: 1px solid #d2d2d2;
}
.comptany-info tr:last-child th, .comptany-info tr:last-child td {
    border-bottom: none;
}
.comptany-info th {
    background-color: #e7f0f8;
    font-weight: 500;
}
.company-banners {
    width: 100%;
    max-width: 60rem;
}
@media (min-width: 768px) {
    .comptany-info th, .comptany-info td {
        display: table-cell;
    }
    .comptany-info th {
        width: 17rem;
    }
}