@charset "utf-8";

/* =article>section>.pkg>dl
-------------------------------------------------------------------------*/
article>section>.pkg>dl>dt,
article>section>.pkg>dl>dd { text-align: justify; }

article>section>.pkg>dl>dt {
    position: relative;
    font-weight: 700;
    font-size: 1.4rem;
    padding: .75em 60px;
    color: #fff;
    background: #00a99d;
    border-radius: 6px;
    transition: border-radius .5s;
    cursor: pointer;
    }

article>section>.pkg>dl>dt:before,
article>section>.pkg>dl>dt:after {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
    }

article>section>.pkg>dl>dt:before {
    content: 'Q';
    left: 20px;
    font-weight: 600;
    font-family: 'Nunito',sans-serif;
    font-size: 3rem;
    color: #ffee58;
    }

article>section>.pkg>dl>dt:after {
    content: '\f0d7';
    right: 20px;
    font-size: 1.5em;
    transition: transform .2s;
        -webkit-transition: transform .2s;
    }

article>section>.pkg>dl>dt:not(:first-of-type) { margin-top: 20px; }
article>section>.pkg>dl>dt.active { border-radius: 6px 6px 0 0; }

article>section>.pkg>dl>dt.active:after {
    transform: translateY(-50%) rotate(180deg);
        -webkit-transform: translateY(-50%) rotate(180deg);
    }

article>section>.pkg>dl>dd {
    display: none;
    padding: 1.5em 20px;
    border: 1px solid #00a99d;
    border-radius: 0 0 6px 6px;
    overflow: hidden;
    }

article>section>.pkg>dl>dd:before {
    content: 'A';
    font-family: 'Nunito',sans-serif;
    font-size: 3rem;
    line-height: 1.2;
    float: left;
    margin-right: .55em;
    }


/* =Media Query
-------------------------------------------------------------------------*/
@media only screen and (max-device-width:720px) and (orientation:landscape),only screen and (min-device-width:721px){
    article>section>.pkg>dl>dt { padding: 1em 80px; }
    article>section>.pkg>dl>dd:before { margin-right: 1.25em; }
    }

@media only screen and (min-device-width:721px){
    article>section>.pkg>dl>dt { border-radius: 10px; }
    article>section>.pkg>dl>dt:before { left: 30px; font-size: 3.6rem; }
    article>section>.pkg>dl>dt:after { right: 30px; }
    article>section>.pkg>dl>dt.active { border-radius: 10px 10px 0 0; }
    article>section>.pkg>dl>dd { padding: 1.5em 30px; }
    article>section>.pkg>dl>dd:before { font-size: 3.6rem; margin-right: .65em; }
    }

@media only screen and (min-device-width:721px) and (orientation:landscape),only screen and (min-width:1024px){
    article>section>.pkg>dl>dt { font-size: 1.8rem; }
    article>section>.pkg>dl>dd { font-size: 1.6rem; }
    }

/* IE11,Edge */
_:-ms-lang(x),.selector {  }

/* IE11 */
_:lang(x)::-ms-backdrop,.selector {  }

/* Edge */
_:-ms-lang(x)::backdrop,.selector {  }


/* EOF
-------------------------------------------------------------------------*/
