@charset "UTF-8";

:root {
    --color-black: #111111;
    --color-main: #FED105;
    --color-light: #FED10533;

    --color-facebook: #4267B2;
    --color-twitter: #1DA1F2;

    --font-en: 'Ubuntu', sans-serif;

    --spacing-vertical-primary : 64px;
}

@media screen and (min-width:769px) {
    :root {
        --spacing-vertical-primary : 80px;
    }
}

/*------------------------------*/
/*COMMON FONTS*/
/*------------------------------*/
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, button, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
    color: var(--color-black);
}
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 3.2rem;
}
p:not(:last-child):not(.button) {
    margin-bottom: 1.6rem;
}
h4, .h4 {
    font-weight: bold;
}
span {
    font-size: inherit;
    font-weight: inherit;
}
.text-center {margin: auto;}

/*------------------------------*/
/*ELEMENTS--FONT & HEADINGS*/
/*------------------------------*/
[class^="heading"] {
    margin-top: 32px;
    margin-bottom: 32px;
}
.heading-center:after {
    content: none;
}
.heading-parallelo {
    background-color: #fff;
    color: var(--color-black);
    padding: 8px 32px;
}

/*------------------------------*/
/*ELEMENTS--MARKER*/
/*------------------------------*/
.marker-border {
    border-bottom: 4px solid var(--color-main);
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

/*------------------------------*/
/*ELEMENTS--LIST*/
/*------------------------------*/
.list-disc {
    margin-top: 16px;
    margin-bottom: 16px;
}
.maflow>*:not(.list--content) {
    background-color: var(--color-main);
    -webkit-box-shadow: none;
            box-shadow: none;
}
.maflow>*:not(.list--content):before {
    background-color: var(--color-black);
}

/*------------------------------*/
/*ELEMENTS--BOX*/
/*------------------------------*/
.box-balloon {
    border-radius: 100px;
    -webkit-box-shadow: 0px 8px 16px #11111111;
            box-shadow: 0px 8px 16px #11111111;
    display: block;
    margin: 32px auto;
    padding: 12px 40px!important;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}
.box-balloon:after {
    background-color: #fff;
}

/*------------------------------*/
/*ELEMENTS--LABEL*/
/*------------------------------*/
[class^="label"] {
    background: var(--color-black);
    color: #fff;
}

/*------------------------------*/
/*ELEMENTS--BUTTON*/
/*------------------------------*/
[class^="wrap-"]:not(.wrap-header) [class^="button"] {
    margin: 16px auto;
    width: 100%;
}
@media screen and (min-width:769px) {
    [class^="wrap-"]:not(.wrap-header) [class^="button"] {
        min-width: 280px;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
    }
}

/*------------------------------*/
/*ELEMENTS--GROUP*/
/*------------------------------*/
.group-button>* {
    margin: 0 auto!important;
}
.group-button>*:not(:first-child) {
    margin-top: 16px!important;
}
@media screen and (min-width:769px) {
    .group-button>* {
        min-width: unset!important;
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
    }
    .group-button>*:not(:first-child) {
        margin: 0 0 0 16px!important;
    }
}

/*------------------------------*/
/*ELEMENTS--MODAL*/
/*------------------------------*/
body.is-fixed {
    overflow: hidden;
}
.modal--outer {
    background: var(--color-main);
}
.modal--inner, .modal--inner .wrap-content {
    max-height: calc(100vh - 160px);
    max-width: 960px;
    overflow: auto;
    padding: 0;
    width: 100%;
}
.modal--inner .button {
    border-radius: 0;
    position: absolute;
    bottom: 0;
    left: 0;
    margin: 0!important;
    width: 100%!important;
}
.modal--inner .wrap-content>* {
    margin-top: 32px;
}
.modal--inner .wrap-content>*:last-child {
    margin-bottom: 64px;
}
.modal--close {
    background: var(--color-black);
    border-radius: 0; 
    position: absolute; 
    top: 0; 
    right: 0; 
    width:32px; 
    height:32px;
}
@media screen and (min-width:769px) {
    .modal--inner, .modal--inner .wrap-content {
        max-height: calc(100vh - 240px);
    }
    .modal--inner .wrap-content {
        padding: 0 16px;
    }
    .modal--inner .wrap-content>* {
        margin-top: 40px;
    }
    .modal--inner .wrap-content>*:last-child {
        margin-bottom: 80px;
    }
}

/*------------------------------*/
/*SECTION--COMMON*/
/*------------------------------*/
[class^="column"]>*:first-child {
    margin-top: 0;
}
[class^="column"]>*:last-child {
    margin-bottom: 0;
}

@media screen and (min-width:769px) {
    [class^='container'] {
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
    [class^='container'].reverse {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
            -ms-flex-direction: row-reverse;
                flex-direction: row-reverse;
    }
}

/*------------------------------*/
/*COLOR*/
/*------------------------------*/
.bg-light {
    background-color: var(--color-light);
    border-color: var(--color-light);
}
.bg-yellow {
    background-color: var(--color-main);
    border-color: var(--color-main);
}
.text-yellow {
    color: var(--color-main);
}
.button.bg-yellow, .button.bg-yellow * {
    color: var(--color-black);
}

/*------------------------------*/
/*OTHER STYLING*/
/*------------------------------*/
.support--icon {
    -webkit-filter: grayscale(1);
            filter: grayscale(1);
}
.wrap-hero {
    margin-top: var(--spacing-vertical-primary);
    padding: var(--spacing-vertical-primary) 0;
}

/*------------------------------*/
/*STYLING FOR LP*/
/*------------------------------*/
.wrap-lp-mv {
    margin-bottom: 80px;
    padding: 56px 0 120px!important;
    position: relative;
}
.wrap-lp-mv::before {
    background: var(--color-main);
    -webkit-clip-path: polygon(0 0,100% 0%,100% calc(100% - 80px),0% 100%);
            clip-path: polygon(0 0,100% 0%,100% calc(100% - 80px),0% 100%);
    content: "";
    display: block;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}
.lp-mv--img {
    margin-bottom: -160px;
}
.bg-parallelo {
    -webkit-clip-path: polygon(0 80px,100% 0%,100% calc(100% - 80px),0% 100%);
            clip-path: polygon(0 80px,100% 0%,100% calc(100% - 80px),0% 100%);
    margin-top: 64px;
    padding: 160px 0 120px!important;
}
.group-sns {
    margin: 32px auto;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}
.group-sns::before {
    content: "SHARE";
    display: block;
    font-family: var(--font-en);
    font-size: 1.6rem;
    margin-right: 8px;
    opacity: .4;
}
.group-sns>* {
    margin: 4px;
}
.group-sns>* i {
    font-size: 4rem;
}
.group-sns>* [class*="facebook"] {
    color: var(--color-facebook);
}
.group-sns>* [class*="twitter"] {
    color: var(--color-twitter);
}
.heading-about-us::before, .heading-ma-flow::before, .heading-pick-up::before, .heading-en {
    font-family: var(--font-en);
    font-style: italic;
    font-weight: bold;
    line-height: 1;
}
.heading-about-us::before, .heading-ma-flow::before, .heading-pick-up::before {
    display: block;
    font-size: 6.4rem;
    margin-bottom: -3.2rem;
}
.heading-about-us::before {
    color: #fff;
    content: "ABOUT US";
}
.heading-ma-flow::before, .heading-pick-up::before {
    color: var(--color-main);
}
.heading-ma-flow::before {
    content: "M&A FLOW";
}
.heading-pick-up::before {
    content: "PICK UP";
}
.heading-en {
    font-size: 3.2rem;
}
.heading-en.large {
    font-size: 6.4rem;
}
.heading-en.transformed {
    margin-bottom: -.8em!important;
    -webkit-transform: rotate(-8deg);
        -ms-transform: rotate(-8deg);
            transform: rotate(-8deg);
    -webkit-transform-origin: left;
        -ms-transform-origin: left;
            transform-origin: left;
}
.heading--sub {
    display: block;
    font-size: 60%;
    margin-bottom: .4em;
}
.pickup--thumb img {
    border-radius: 50%;
    margin-bottom: -10%;
}
.pickup--label:after {
    content: "… etc";
}
.pickup--price {
    font-size: 3.2rem;
    font-weight: bold;
}
.pickup--price span {
    font-size: 45%;
    font-weight: normal;
    margin-right: .5em;
}
.pickup--title {
    font-size: 2.4rem;
    margin-bottom: 0;
}
.pickup--title [class^="label"] {
    display: block;
    margin-bottom: 8px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}
.wrap-pickup-item {
    overflow: hidden;
    position: relative;
}
.wrap-pickup-item .container:before {
    background: var(--color-light);
    -webkit-clip-path: polygon(0 80px,100% 0%,100% calc(100% - 80px),0% 100%);
            clip-path: polygon(0 80px,100% 0%,100% calc(100% - 80px),0% 100%);
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 160px;
    z-index: -1;
}

@media screen and (min-width:769px) {
    .wrap-lp-mv {
        padding: 80px 0 120px!important;
    }
    .heading-about-us::before, .heading-ma-flow::before, .heading-pick-up::before {
        font-size: 9.6rem;
        margin-bottom: -4.8rem;
    }
    .heading-en.large {
        font-size: 12rem;
    }
    .pickup--thumb img {
        margin-bottom: 0;
    }
    .wrap-pickup-item .container:before {
        left: -24%;
    }
    .wrap-pickup-item .container.reverse:before {
        right: -24%;
        left: unset;
    }
}