:root {
    --seizou-color: #19673b;
}

.body {
    background-color: #fff;
    overflow-x: hidden;
    width: 100%;
}

body>* {
    color: #000;
}

.full-width {
    width: 100%;
}

.site-width {
    width: var(--site-width);
    max-width: 100%;
    padding-left: 15px;
    padding-right: 15px;
    margin-left: auto;
    margin-right: auto;
}

.single .container {
    margin-bottom: 100px;
}

.full-width .container {
    margin-bottom: 0;
}

.single .header .container {
    margin-bottom: 0;
}

.single .header {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 50px 0;
    margin-bottom: 100px;
    text-align: center;
    color: #fff;
    background-image: url(https://www.kyoshin-business-assist.jp/spiral-app/images/header-background.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    border: unset;
    background-attachment: fixed;
}

.single .fix-info {
    text-align: center;
    margin-bottom: 30px;
}

.single .page-title {
    position: relative;
    font-size: 24px;
    text-align: center;
    margin: 0 auto 20px;
}

.single .heading-wrap {
    margin-bottom: 20px;
}

.single .main-heading {
    font-size: var(--ft7);
}

.single .main-heading:after {
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    background: #134b88;
    margin: 10px auto 20px 0;
}

.single .notice {
    color: red;
    font-size: var(--ft5);
    font-weight: 700;
}

.single .profile-table {
    width: 100%;
    margin: 0 auto 50px;
    border: solid 1px #ccc;
    border-collapse: collapse;
    font-weight: 700;
}

.single .tab-button-wrapper {
    display: flex;
    margin-bottom: 0;
}

.single .tab-links {
    border-radius: 3px 3px 0 0;
}

.single .tab-contents-wrapper {
    padding: 20px;
    background-color: var(--light-gray);
}

.single .tab-content {
    padding: 20px;
    background-color: #fff;
}

.single .product-top-content {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 50px;
}

.single .product-top-content>div {
    width: 49%;
}

.single .detail-item {
    margin-bottom: 30px;
}

.single .detail-item .text {
    display: block;
    font-weight: 700;
}

.single .item-label {
    margin-bottom: 10px;
    font-size: var(--ft6);
    color: #134b88;
    padding: 2px 0 2px 10px;
    border-left: solid 6px #134b88;
    border-bottom: solid 1px #ccc;
}

.product-center-content .product-detail {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.product-center-content .detail-item {
    width: 49%;
    margin-bottom: 20px;
}

.product-center-content .detail-item.full-width {
    width: 100%;
}

.single .product-images {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.single .product-images:after {
    content: "";
    display: block;
    width: calc(100% / 3 - 10px);
}

.single .product-image-wrap {
    display: block;
    width: calc(100% / 3 - 10px);
    margin-bottom: 10px;
}

.single .product-image {
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
    border: solid 1px #eee;
}

.single .button-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 50px;
    width: 100%;
}

.single .page-footer {
    color: #fff;
    background-color: #222;
    font-size: var(--ft3);
    padding: 15px;
}

.single .doc-link {
    display: block;
    width: 100%;
    transition: var(--main-transition);
}

.single .doc-link:hover {
    opacity: .7;
}

.single .doc-pdf {
    max-width: 200px;
}

.single .doc-image {
    display: block;
    width: 100%;
    object-fit: cover;
}

/*-----------------------------------
            Syodan Single
 ------------------------------------*/
.syodan-single .container {
    margin-bottom: 50px;
}

.syodan-single .flyer-image {
    width: 100%;
}

.syodan-single .main-title {
    padding: 10px;
    margin-bottom: 30px;
    color: #fff;
    font-size: var(--ft8);
    text-align: center;
    background-color: var(--blue);
}

.syodan-single.seizou-match .main-title {
    background-color: var(--seizou-color);
}

.syodan-single .syodan-applied {
    text-align: center;
    margin: 0 auto 50px;
    padding: 20px;
    color: #fff;
    background-color: var(--orange);
    border-radius: 3px;
}

/*---------Buyer Match----------*/

.buyer-match .flex-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 50px;
}

.buyer-match .flex-contents {
    width: 48%;
}

.buyer-match .flow-heading {
    font-size: var(--ft8);
    color: var(--blue);
    margin-bottom: 20px;
    text-align: center;
}

.syodan-single.seizou-match .flow-heading {
    color: var(--seizou-color);
}

.buyer-match .flow-box {
    position: relative;
    border: solid 2px var(--blue);
    margin-bottom: 70px;
}

.syodan-single.seizou-match .flow-box {
    border-color: var(--seizou-color)
}

.flow-box:after {
    content: "";
    position: absolute;
    bottom: -60px;
    left: 50%;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 35px 50px 0 50px;
    border-color: var(--blue) transparent transparent transparent;
    transform: translateX(-50%);
}

.syodan-single.seizou-match .flow-box:after {
    border-color: var(--seizou-color) transparent transparent transparent;
}

.flow-box:last-child:after {
    display: none;
}

.buyer-match .flow-sub-heading {
    font-size: var(--ft8);
    text-align: center;
    color: #fff;
    padding: 10px;
    background-color: var(--blue);
}

.syodan-single.seizou-match .flow-sub-heading {
    background-color: var(--seizou-color)
}

.buyer-match .box-inner {
    padding: 20px;
}

.box-inner-bottom {
    background-color: #acdef7;
}

.flow-box .inner-heading {
    color: var(--blue);
    font-size: 20px;
    text-align: center;
    margin-bottom: 10px;
}

.syodan-single.seizou-match .flow-box .inner-heading {
    color: var(--seizou-color);
}

.box-inner-bottom .inner-sub-heading {
    color: #fff;
    text-align: center;
    margin-bottom: 10px;
    background-color: #29a7e1;
}

.box-inner-bottom .sub-flow {
    color: var(--blue);
    font-weight: 700;
    padding-left: 50px;
    padding-bottom: 10px;
    counter-reset: li;
    margin: 0;
}

.box-inner-bottom li {
    position: relative;
}

.box-inner-bottom li:before {
    content: counter(li);
    counter-increment: li;
    position: absolute;
    top: 3px;
    left: -25px;
    display: flex;
    width: 20px;
    height: 20px;
    justify-content: center;
    align-items: center;
    font-weight: 700;
    font-size: 14px;
    color: var(--blue);
    border: solid 1px;
    border-radius: 100vw;
}

.buyer-match .bottom-contents {
    width: 1100px;
    max-width: 100%;
    margin: 0 auto 50px;
}

.buyer-match .notes-heading {
    font-size: var(--ft8);
    color: var(--red);
    border: solid 2px var(--red);
    margin-bottom: 10px;
}

.buyer-match .notes-label {
    display: inline-block;
    color: #fff;
    padding: 0 10px;
    margin-right: 10px;
    background-color: var(--red);
}

.buyer-match .notes-list {
    font-size: var(--ft5);
    padding-left: 30px;
    counter-reset: li;
}

.buyer-match .notes {
    position: relative;
    margin-bottom: 10px;
}

.buyer-match .notes-sub-heading {
    display: block;
    color: var(--blue);
    font-size: var(--ft7);
    font-weight: 700;
}

.syodan-single.seizou-match .notes-sub-heading {
    color: var(--seizou-color);
}

.buyer-match .notes:before {
    content: counter(li);
    counter-increment: li;
    position: absolute;
    top: 3px;
    left: -30px;
    display: flex;
    width: 25px;
    height: 25px;
    justify-content: center;
    align-items: center;
    font-weight: 700;
    font-size: 16px;
    color: var(--blue);
    border: solid 1px;
    border-radius: 100vw;
}

.syodan-single.seizou-match .notes:before {
    color: var(--seizou-color);
}

.buyer-match .notes-message {
    font-size: var(--ft7);
    font-weight: 700;
    color: var(--red);
    margin-bottom: 30px;
}

.buyer-match .contact-heading {
    color: var(--blue);
    font-size: var(--ft8);
    margin-bottom: 10px;
}

.syodan-single.seizou-match .contact-heading {
    color: var(--seizou-color);
}

.buyer-match .tel-number {
    font-size: var(--ft7);
    font-weight: 700;
}

.buyer-match .syodan-applied {
    width: 350px;
    max-width: 100%;
    padding: 10px;
    border-radius: 3px;
    margin: 0 auto 30px;
    color: #fff;
    text-align: center;
    background-color: var(--green);
}

.buyer-desired {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    list-style: none;
    padding: 0;
    margin-bottom: 20px;
}

.buyer-desired .desired-item {
    font-size: 14px;
    font-weight: 700;
    padding: 3px 10px;
    background-color: #ededed;
    border-radius: 3px;
}

.buyer-desired .desired-item.food-group {
    background-color: #8fdb93;
}

.buyer-desired .desired-item.drink-group {
    background-color: #90c6f7;
}

.buyer-desired .desired-item.goods-group {
    background-color: #d9ab92;
}

/*---------Seizou Match----------*/
.seizou-match .sub-title {
    width: 400px;
    max-width: 100%;
    text-align: center;
    font-size: 20px;
    padding-bottom: 20px;
    margin: 0 auto 20px;
    border-bottom: solid 1px;
}

.seizou-match .container.information {
    padding: 30px;
    border: solid 1px;
    border-radius: 30px;
}

.seizou-match .information-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 30px;
}

.seizou-match .heading-column {
    width: calc(100% - 70% - 20px);
}

.seizou-match .heading-column .heading {
    font-size: var(--ft7);
    text-align: center;
    color: #fff;
    background-color: var(--seizou-color);
    padding: 5px;
    border-radius: 3px;
}

.seizou-match .contents-column {
    width: calc(100% - 30% - 20px);
}

.seizou-match .contents-column p,
.seizou-match .contents-column li {
    font-size: var(--ft6);
}

.seizou-match .contact {
    width: 100%;
    margin: 0;
    padding: 30px;
    color: #fff;
    background-color: var(--blue);
}

.seizou-match .contact .contents {
    text-align: center;
}

.seizou-match .contact .heading {
    max-width: 700px;
    color: #000;
    background-color: #fff;
    padding: 10px;
    margin: 0 auto 20px;
}

/*---------Form----------*/

.syodan-single .syodan-form-heading {
    text-align: center;
    font-size: var(--ft6);
    color: #fff;
    padding: 5px;
    background-color: var(--blue);
}

.syodan-single.seizou-match .syodan-form-heading {
    background-color: var(--seizou-color);
}

.syodan-single .form-table {
    width: 700px;
    max-width: 100%;
    margin: 0 auto 50px;
    border: unset;
    border-collapse: collapse;
}

.syodan-single .td-left {
    border-bottom: unset;
    width: 250px;
    max-width: 100%;
    padding: 20px;
    background-color: #eee;
    text-align: right;
}

.syodan-single .td-right {
    border-bottom: unset;
}

.syodan-single .form-select {
    background-color: #fff;
    width: 100% !important;
}

/*----------------------------------
            Result
-----------------------------------*/
.result .contents {
    padding: 30px;
    background-color: var(--light-gray);
}

.result .list {
    list-style: square;
    padding-left: 30px;
    margin-bottom: 30px;
}

.result .list li {
    font-size: var(--ft4);
    margin-bottom: 5px;
}

.result .member-title {
    font-size: var(--ft7);
    margin: 50px auto 20px;
}

.result .result-contents {
    margin-bottom: 50px;
}

.result .result-title {
    font-size: var(--ft7);
    text-align: center;
    margin-bottom: 30px;
}

.result .container-title {
    position: relative;
    font-size: var(--ft7);
    font-weight: 700;
    text-align: center;
}

.result .container-title:after {
    content: "";
    display: block;
    width: 100px;
    height: 2px;
    background-color: var(--blue);
    margin: 15px auto 30px;
}


.result .time-table-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.result .notes {
    width: 100%;
    padding: 20px;
    margin-bottom: 50px;
    border: solid 2px;
    font-size: var(--ft4);
    font-weight: 700;
    text-align: center;
}

.result .time-table-notes {
    text-align: center;
    font-size: var(--ft5);
    margin-bottom: 30px;
}

.result .time-table-item {
    width: 48%;
}

.result .time-table-item:only-child {
    width: 100%;
}

.result .time-table-title {
    padding: 5px;
    font-size: var(--ft6);
    text-align: center;
    color: #fff;
    background-color: var(--blue);
}

.result .time-table {
    width: 100%;
    margin: 0;
    border: solid 1px #ccc;
    border-collapse: collapse;
}

.result .time-table .td-left {
    width: 30%;
    font-size: var(--ft4);
    text-align: center;
    background: #e7f2ff;
}

.result .time-table .td-right {
    background-color: #fff;
}

.result .result-text {
    font-size: var(--ft5);
    font-weight: 700;
}

.result .zoom-section {
    padding: 50px 0;
    margin-bottom: 50px;
    background-color: var(--light-gray);
}

.result .zoom-section .contents {
    padding: 0;
    background-color: unset;
}

.result .zoom-item {
    background-color: #fff;
    padding: 30px;
    margin-bottom: 30px;
    border: solid 1px #ccc;
}

.result .zoom-item .title {
    display: flex;
    align-items: center;
    font-size: var(--ft7);
    margin-bottom: 20px;
}

.result .zoom-item .heading {
    font-size: var(--ft6);
    font-weight: 700;
    text-align: center;
    padding: 10px;
    margin-bottom: 20px;
    background-color: #fff4e8;
    border-radius: 5px;
}

.result .zoom-label {
    display: block;
    width: 110px;
    color: #fff;
    text-align: center;
    padding: 5px 10px;
    border-radius: 3px;
    margin-right: 10px;
    background-color: var(--green);
}

.result .rehearsal .zoom-label {
    background-color: #e76b6b;
}

.result .zoom-info li {
    font-size: var(--ft5);
    font-weight: 700;
    margin-bottom: 20px;
}

.result .address-item {
    padding: 20px;
    margin-bottom: 30px;
    background-color: #fff;
    border: dashed 2px #ccc;
}

.result .address-label {
    width: 150px;
    text-align: center;
    color: #fff;
    padding: 5px;
    margin-bottom: 10px;
    background-color: var(--green);
    border-radius: 2px;
}

.result .address-title {
    font-size: var(--ft5);
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: dashed 1px #ccc;
}

.result .address-list li {
    font-size: var(--ft5);
    font-weight: 700;
    margin-bottom: 5px;
}

.result .point-contents {
    background-color: #fff;
}

.result .point-contents .heading {
    font-size: var(--ft5);
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: solid 1px var(--blue);
}

.result .point-number {
    display: inline-flex;
    justify-content: center;
    width: 20px;
    color: #fff;
    margin-right: 10px;
    background-color: var(--blue);
}

/*----------------------------------
PC
-----------------------------------*/

@media screen and (min-width:1024px) {}

/*----------------------------------
PC Under
-----------------------------------*/

@media screen and (max-width:1023px) {
    .buyer-match .flex-contents {
        width: 100%;
    }
}

/*----------------------------------
Tablet
-----------------------------------*/

@media screen and (min-width:726px) and (max-width:1023px) {}

/*-------------------------------
Mobile
---------------------------------*/

@media (max-width: 725px) {

    .single p,
    .single li {
        font-size: var(--ft4);
    }

    .single .header {
        padding: 30px 0;
    }

    .single .header {
        margin-bottom: 30px;
    }

    .single .container {
        margin-bottom: 30px;
    }

    .single .main-heading {
        font-size: var(--ft6);
    }

    .single .button-wrapper {
        flex-direction: column;
        margin-bottom: 20px;
    }

    .single .main-button.return {
        margin-bottom: 30px;
    }

    .single .td-left,
    .single .td-right {
        font-size: var(--ft3);
        padding: 10px;
    }

    .syodan-single .form-table {
        width: 350px;
    }

    .single .td-left {
        max-width: 120px;
    }

    .single .td-right {
        min-width: 230px;
        max-width: 230px;
    }

    .buyer-match .flow-box {
        margin-bottom: 50px;
    }

    .buyer-match .flow-box:after {
        bottom: -40px;
        border-width: 25px 30px 0 30px;
    }

    .buyer-match .box-inner p {
        font-size: var(--ft5);
    }

    .seizou-match .container.information {
        padding: 20px;
        border-radius: 5px;
    }

    .seizou-match .heading-column {
        width: 100%;
        margin-bottom: 10px;
    }

    .seizou-match .contents-column {
        width: 100%;
    }

    .seizou-match .contact {
        margin: 0;
        padding: 10px;
        font-size: var(--ft5);
    }

    .seizou-match .contact .heading {
        font-size: var(--ft5);
        padding: 5px;
        margin-bottom: 10px;
    }

    .seizou-match .contact .contents p {
        color: #fff !important;
        margin-bottom: 5px;
    }

    .buyer-match-single .product-top-content>div {
        width: 100%;
    }

    .buyer-match-single .product-top-content .product-main-image {
        margin-bottom: 20px;
    }

    .buyer-match-single .tab-contents-wrapper {
        padding: 10px;
    }

    .buyer-match-single .product-top-content {
        flex-direction: column-reverse;
    }

    .buyer-match-single .tab-content.product-content {
        padding: 20px 0;
        background-color: unset;
    }

    .buyer-match-single .product-image-wrap {
        width: 49%;
    }

    .buyer-match-single .notice {
        font-size: var(--ft3);
        text-align: left;
    }

    .result .contents {
        padding: 20px 10px;
    }

    .result .time-table-item {
        width: 100%;
    }

    .result .time-table-item {
        width: 100%;
        margin-bottom: 20px
    }

    .result .time-table-item:last-child {
        margin-bottom: 0x
    }

    .result .notes {
        padding: 10px;
        margin-bottom: 30px;
        font-size: var(--ft4);
    }

    .result .zoom-item {
        padding: 20px 10px;
    }

}
