@charset "utf-8";



/*  Modules purchase service
*/

.purchase-service {
    padding: 7em 0;
    background-color: var(--bg-color-secondary);
}

.purchase-service-title-main {
    width: 96%;
    max-width: 660px;
    margin: 0 auto 0.5em auto;
    padding-bottom: 0.5em;
    border-bottom: 1px var(--color-bright3-silver) solid;

    font-weight: bold;
    font-size: 1.7em;
    color: var(--color-dark2-glay);
    letter-spacing: 2px;
}

.purchase-service-title-sub {
    width: 96%;
    max-width: 660px;
    margin: auto;

    font-size: 1.1em;
    color: var(--color-dark2-glay);
    letter-spacing: 2px;
}



.purchase-service-list {
    margin: 3em auto;
}

.purchase-service-list > .wp-block-group__inner-container {
    display: flex;
    justify-content: space-between;
    align-items: top;
    flex-wrap: wrap;
}



.purchase-service-one {
    margin: 3%;
    width: 27.334%;
    padding: 2em 2em 1.5em 2em;
    border-radius: 2em;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
}

.purchase-service-one-image {
    margin: 1em;
}

.purchase-service-one .wp-block-separator {
    width: 65%;
    height: 2px;
    border: none;
    background-color: var(--color-bright2-silver);
}

.purchase-service-one-text {
    margin: 0.714em;

    font-weight: bold;
    font-size: 1.4em;
    color: var(--color-light-orange);
}



/*  Modules bullion price
*/

.bullion-price {
    margin: 7em auto;
}

.bullion-price-sub-text {
    margin: 0;

    letter-spacing: 1px;
    font-weight: bold;
    font-size: var(--font-size-subtitle);
    color: var(--font-color-primary);
}

.bullion-price-table {
    width: 96%;
    max-width: 900px;
    margin: 3em auto;

    font-weight: bold;
    text-align: center;

    border: 1px var(--color-bright3-silver) solid;
}

.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table.bullion-price-table > table tr th,
.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table.bullion-price-table > table tr td {
    text-align: center;
    border: none;
    font-size: 1.4em;
}

.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table.bullion-price-table > table tr th:nth-child(1) {
    width: 65%;
}

.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table.bullion-price-table > table tr th:nth-child(2) {
    width: 35%;
}

.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table.bullion-price-table > table tr th {
    background-color: var(--color-light-orange);
    color: var(--color-white);
    border-bottom: 1px var(--color-bright3-silver) solid;
}

.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table.bullion-price-table > table tr td {
    color: var(--color-dark2-glay);
}

.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table.bullion-price-table > table tr th:nth-child(1),
.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table.bullion-price-table > table tr td:nth-child(2) {
    border-right: 1px var(--color-bright3-silver) solid;
}

.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table.bullion-price-table > table tr td:nth-child(1) {
    padding-left: 2em;
}



/*  Modules flow
*/

.flow {
    margin: 7em auto;
}

.flow-title-sub-text {
    margin: 0;

    letter-spacing: 1px;
    font-weight: bold;
    font-size: var(--font-size-subtitle);
    color: var(--font-color-primary);
}



.flow-one {
    width: 96%;
    max-width: 900px;
    margin: 5em auto 7em;
    padding: 2em;

    border: 1px var(--color-bright-silver) solid;
    border-radius: 2em;
    position: relative;
}

.flow-one::after {
    content: "\f0d7";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 3em;
    color: var(--font-color-primary);

    position: absolute;
    bottom: -2em;
    left: 0;
    right: 0;
    margin: auto;
    height: 1em;
    width: 1em;
    text-align: center;
}

.flow-one:last-child::after {
    display: none;
}

.flow-one > .wp-block-group__inner-container {
    display: flex;
    justify-content: space-between;
    align-items: center;

    position: relative;
}

.flow-step-number {
    position: absolute;
    top: -3em;
    left: -3em;
    width: 6em;
    height: 6em;
    line-height: 6em;
    margin: auto;
    text-align: center;
    background-color: var(--bg-color-primary);
    border-radius: 50%;
}

.flow-one .flow-step-number img {
    vertical-align: middle;
    border-radius: initial;
}

.flow-one-left {
    width: 33%;
    text-align: right;
}

.flow-one-right {
    width: 60%;
}

.flow-one-title {
    margin-top: 0;
    letter-spacing: 1px;
    font-weight: bold;
    font-size: var(--font-size-subtitle);
    color: var(--font-color-primary);
}

.flow-one-text {
    margin: 0;

    line-height: 1.8em;
    letter-spacing: 1px;
}



/*  Modules contact
*/

.contact {
    margin: 7em auto;
    padding: 2em 0;
    background-color: var(--bg-color-primary);
}

.contact-title-main-text {
    margin: 0;
    font-size: 4em;
    font-weight: bold;
    color: var(--color-white);
    letter-spacing: -1px;
}

.contact-title-sub-text {
    margin: 0.5em 0;
    font-size: 1.2em;
    font-weight: bold;
    color: var(--color-white);
}

.contact-title-banner-images > .wp-block-group__inner-container {
    display: flex;
    justify-content: center;
    align-items: center;
}

.contact-title-banner-image {
    margin: 1em;
}



.contact:last-child {
    margin-bottom: 0;
}



/*  Modules contact
*/

.document {
    width: 96%;
    max-width: 900px;
    margin: 7em auto;
    padding-bottom: 1em;
    border: 2px var(--color-light-orange) solid;
    border-radius: 2em;
}

.document-title {
    margin: -1.2em auto 1em;
    width: 70%;
    text-align: center;
    padding: 0.5em 1em;
    background-color: var(--color-light-orange);
    border-radius: 3em;
    position: relative;
    letter-spacing: 2px;

    color: var(--color-white);
    font-weight: bold;
    font-size: 2em;
}

.document-title i {
    position: absolute;
    top: 0;
    right: 0;
}

.document-text1,
.document-text2,
.document-text3 {
    margin: 0 auto;
    text-align: center;

    color: var(--color-glay);
    font-weight: bold;
    font-size: 2em;
}

.document-text1 {
    margin-top: 1em;
}

.document-text2 > .wp-block-group__inner-container {
    display: flex;
    justify-content: center;
    align-items: center;
}

.document-text2-1,
.document-text2-2,
.document-text2-3 {
    margin: 0.2em;
}

.document-text2-1,
.document-text2-3 {
    padding: 0.5em;
    border: 2px var(--color-red) solid;
    border-radius: 1em;
    color: var(--color-red);
}

.document-text3 {
    margin-bottom: 1em;
}

.document-text3 .red {
    color: var(--color-red);
}

.document-text4 {
    line-height: 1.8em;
    padding: 0 2em;

    letter-spacing: 3px;
    color: var(--color-glay);
    font-size: 1.1em;
}

.emphasis {
    line-height: 1em;
    color: var(--color-red);
    border-bottom: 1px var(--color-red) solid;
}

.document-tel-box {
    width: 86%;
    margin: 2em auto;
    border: 2px var(--color-light-orange) solid;
}

.document-tel-message {
    margin: 0;
    padding: 0.2em 0;
    background-color: var(--color-light-orange);
    letter-spacing: 1px;
    text-align: center;

    color: var(--color-white);
    font-size: 1.1em;
}

.document-tel-body {
    padding: 0.8em 1.6em;
}

.document-tel-body > .wp-block-group__inner-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.document-tel-icon {
    margin: 0.1em 0 0 0;
    align-self: flex-start;
}

.document-tel-number {
    width: 42%;
    margin: 0 4% 0 0;
    text-align: center;
    color: var(--color-light-orange);
}

.document-tel-number .main {
    line-height: 1em;

    color: var(--color-light-orange);
    font-weight: bold;
    font-size: 2.8em;
}

.document-tel-number .sub {
    line-height: 1em;
    font-size: 0.9em;
}

.document-tel-button i {
    margin-right: 0.5em;
}

.document-tel-button .wp-block-button {
    margin: 0;
}

.color-red {
    color: var(--color-red);
}



.document-tel-box.pc {
}

.document-tel-box.sp {
    display: none;
}



/*  pc x-small : pc small ((1024 + 1366) / 2)
*/

@media screen and (max-width: 1195px) {
    /*  purchase service
    */
    .purchase-service-one {
        width: 31.333%;
        margin: 3% 1%;
        padding: 2em 0.5em 1.5em 0.5em;
    }

    /*  contact
    */
    .contact-title-banner-left img,
    .contact-title-banner-right img {
        height: fit-content;
        object-fit: contain;
    }

    /*  document
    */
    .document-title {
        font-size: 1.6em;
    }

    .emphasis {
        line-height: 1.4em;
    }

    .document-tel-body {
        padding: 0.8em 0.8em;
    }

}



/*  new iPad portrate : pc x-small ((810px + 1024px) / 2)
*/
@media screen and (max-width: 917px) {
    /*  document
    */
    .document-tel-number {
        width: min-content;
        margin-right: 7%;
    }

    .document-tel-number .main {
        font-size: 2em;
    }

}


/*  iPad portrate : new iPad portrate ((768px + 810px) / 2)
*/
@media screen and (max-width: 789px) {
    /*  document
    */
    .document-tel-number {
        margin-right: 5%;
    }
}



/*  iPhone 12 pro Max : iPad portrate ((428px + 768px) / 2)
*/

@media screen and (max-width: 598px) {
    /*  purchase service
    */
    .purchase-service {
        padding: 3em 0;
    }

    .purchase-service-title-main {
        font-size: 18px;
    }

    .purchase-service-title-sub {
        font-size: var(--font-size-body);
    }

    .purchase-service-list {
        margin: 1em auto;
    }

    .purchase-service-one {
        width: 72%;
        margin: 3% auto;
    }

    .purchase-service-one-image img {
        width: 221px;
        height: fit-content;
        object-fit: contain;
    }

    .purchase-service-one-text {
        font-size: var(--font-size-subtitle-nano);
    }

    /*  bullion price
    */
    .bullion-price {
        margin: 3em auto;
    }

    .bullion-price-main-image img {
        width: 206px;
        height: fit-content;
        object-fit: contain;
    }

    .bullion-price-sub-text {
        font-size: var(--font-size-subtitle-micro);
    }

    .bullion-price-sub-text {
        font-size: var(--font-size-subtitle-micro);
    }

    .bullion-price-table {
        width: 90%;
        margin: 2em auto;
    }

    .wp-block-flexible-table-block-table.wp-block-flexible-table-block-table.bullion-price-table > table tr th {
        padding: 1em;
        font-size: var(--font-size-main);
    }

    .wp-block-flexible-table-block-table.wp-block-flexible-table-block-table.bullion-price-table > table tr td {
        padding: 0.8em;
        font-size: var(--font-size-body);
    }

    .wp-block-flexible-table-block-table.wp-block-flexible-table-block-table.bullion-price-table > table tr td:nth-child(1) {
        padding-left: 2em;
    }

    /*  FLOW
    */
    .flow-title-main-image img {
        width: 69px;
        height: fit-content;
        object-fit: contain;
    }

    .flow-title-sub-text {
        font-size: var(--font-size-subtitle-micro);
    }

    .flow-one > .wp-block-group__inner-container {
        flex-wrap: wrap;
    }

    .flow-one-left,
    .flow-one-right {
        width: 100%;
        text-align: center;
    }

    .flow-step-number {
        top: -4em;
        left: -1em;
    }

    .flow-one-title {
        font-size: var(--font-size-subtitle-nano);
        margin-bottom: 0.5em;
    }

    .flow-one-image img {
        height: fit-content;
        object-fit: contain;
    }

    .flow-one:nth-child(3) .flow-one-image img {
        width: 125px;
    }

    .flow-one:nth-child(4) .flow-one-image img {
        width: 209px;
    }

    .flow-one:nth-child(5) .flow-one-image img {
        width: 139px;
    }

    .flow-one:nth-child(5) .flow-one-text br {
        display: none;
    }

    .flow-one-text {
        font-size: var(--font-size-body);
        text-align: left;
        padding: 0 5%;
    }

    /*  contact
    */
    .contact {
        margin-top: 3em;
        padding: 3em 0 5em;
    }

    .contact-title-main-text {
        font-size: 40px;
    }

    .contact-title-sub-text {
        padding: 0 5%;
        font-size: var(--font-size-body);
    }

    .contact-title-banner-images > .wp-block-group__inner-container {
        flex-wrap: wrap;
    }

    .contact-title-banner-left,
    .contact-title-banner-right {
        width: 100%;
    }

    .contact-title-banner-left .contact-title-banner-image {
        margin-bottom: 0;
    }

    .contact-title-banner-right .contact-title-banner-image {
        margin-top: 0;
    }

    .contact-title-banner-image img {
        width: 100%;
        max-width: 341px;
        height: fit-content;
        object-fit: contain;
    }

    /*  document
    */
    .document {
        border: none;
        border-radius: initial;
        margin-bottom: 3em;
    }

    .document-title {
        font-size: var(--font-size-subtitle-nano);
    }

    .document-text1,
    .document-text2,
    .document-text3 {
        letter-spacing: 3px;
    }

    .document-text2 > .wp-block-group__inner-container {
        flex-wrap: wrap;
    }

    .document-text2-1,
    .document-text2-2,
    .document-text2-3 {
        padding: 0.3em 0;
        width: 100%;
        box-sizing: border-box;
        border-radius: initial;
    }

    .document-text2-1 {
        width: 90%;
        margin: 1em auto 0 auto;
    }

    .document-text2-3 {
        width: 90%;
        margin: 0 auto 1em auto;
    }

    .document-text4 {
        padding: 0 1em;
        text-align: left;

        letter-spacing: 1px;
        font-size: var(--font-size-body);
    }

    .document-text4 span {
        display: inline;
    }

    .document-text4 br {
        display: none;
    }

    .document-tel-box {
        width: 92%;
    }

    .document-tel-box.pc {
        display: none;
    }

    .document-tel-box.sp {
        display: block;
    }



    .document-tel-body > .wp-block-group__inner-container {
        flex-wrap: wrap;
        justify-content: center;
        padding: 0.5em;
    }

    .document-tel-icon img {
        width: 60px;
        height: fit-content;
        object-fit: contain;
    }

    .document-tel-number {
        margin: 0;
        width: calc(90% - 60px);
        max-width: 230px;
    }

    .document-tel-number .main {
        font-size: 1.8em;
    }

    .document-tel-button {
        margin-top: 1em;
    }



    .document-tel-message {
        padding: 1em;
        font-weight: bold;
        font-size: var(--font-size-subtitle-nano);
        letter-spacing: 2px;
    }

    .document-tel-message i {
        margin-right: 2px;
    }

    .document-tel-description {
        color: var(--color-light-orange);
        font-size: 9px;
    }

}