/* 반응형 조건 responsive */
/* m(320~) -> t(1024~) -> d(1250~) */
@media screen and (min-width:680px) {
    /* --------------------------------------2행 퀴즈 */
    #wrap .quiz_bg .quiz {
    flex-flow: row nowrap;/* t, d column -> row */
    
    }
    #wrap .quiz_bg .quiz > * {flex: 1;}
}
@media screen and (min-width:860px) {
    #wrap .quiz_bg .quiz {
         flex-flow: row nowrap;/* t, d column -> row */
    }
    /* -------------------------------------------- 공통 */
    #wrap .container {padding:200px 80px;}
    #wrap .container .contents h1 {font-size:2.5rem;}
    #wrap .container .contents h1+p {font-size:1.38rem; margin: 40px 0;}
        /* ----------------------------------------3행 */
    #wrap .video_bg .video iframe {height: 484px;}
        /* ----------------------------------------5행 */
    #wrap .humanity_bg .humanity p {font-size:1rem;}
    #wrap .humanity_bg .humanity .list {flex-flow: row nowrap;}
    #wrap .humanity_bg .humanity .list li {flex: 1;}
    #wrap .humanity_bg .humanity .list li dl {height: 320px;}
    #wrap .humanity_bg .humanity .list li dl dt {font-size:2.69rem;}
    #wrap .humanity_bg .humanity .list li .txt {height: 250px;}
    #wrap .humanity_bg .humanity .list li .txt p {font-size: 1rem;}
}
@media screen and (min-width:1024px) {
    #wrap .intro {padding: 410px 0 100px; gap: 100px;}
    #wrap .intro .logo {width: 32px; top: 30px; left: 36px;}
    #wrap .intro h1 span {font-size: 3.13rem;}
    #wrap .container .sponsor_btn {width: 238px; height: 60px;}
    #wrap .container .sponsor_btn em {font-size: 1.38rem;}
    #wrap .container .sponsor_btn::after {font-size: 1rem;}
    #wrap .quiz_bg {padding: 150px 80px;}
    #wrap .quiz_bg .quiz .quiz_question h2 {font-size: 2.5rem;}
    #wrap .quiz_bg .quiz .quiz_question p,
    #wrap .quiz_bg .quiz .quiz_question #quiz_frm ol li label,
    #wrap .quiz_bg .quiz .quiz_question #quiz_frm .check_btn,
    #wrap .quiz_bg .quiz .quiz_info p {font-size: 1.25rem;}
    #wrap .quiz_bg .quiz .quiz_question #quiz_frm ol {margin: 0 0 33.83px;}
    #wrap .quiz_bg .quiz .quiz_question #quiz_frm ol li {margin: 0 0 20px;}
    #wrap .quiz_bg .quiz .quiz_question #quiz_frm ol li label {background-size: 28px;}
    #wrap .quiz_bg .quiz .quiz_question p span {display: inline;}
    /* --------------------------------------8행 */
    #wrap .activity_bg .activity h1 {margin-bottom: 83px;}
    #wrap .activity_bg .activity .details {
        grid-template-areas:
            'public nature'
            'corporation nature';
        grid-template-columns: 1fr 1fr;
    }
    #wrap .activity_bg .activity .details li {position:relative; padding:110px 0 30px;}
    #wrap .activity_bg .activity .details li:last-child .txt {
        position: absolute; left: 0; bottom: 31px;
    }
    #wrap .activity_bg .activity .details li .txt {
        width:50%;
    }
    #wrap .activity_bg .activity .details li .txt dt {font-size: 2.13rem;}
    #wrap .activity_bg .activity .details li .txt dd {font-size: 1.25rem;}
    /* --------------------------------------------9행 */
    #wrap .gift_bg {padding: 200px 80px;}
    #wrap .gift_bg .gift {text-align: right;}
    #wrap .gift_bg .gift .gift_title h1 {margin: 0;}
    #wrap .gift_bg .gift .gift_title {flex-flow:row; justify-content: space-between; align-items:end;}
    #wrap .gift_bg .gift .donation {
        grid-template-columns: 1fr 1fr;
        gap:22px 45px;
        grid-template-areas: 
            't_th th_th'
            'f_th f_th';
    }
    #wrap .gift_bg .gift .donation li .gift_img {height: 300px;}
    /* -------------------------------------10행 */
    #wrap .pay_info_bg {padding:100px 80px;}
}/* 1024~1249 */
@media screen and (min-width:1250px) {
    #wrap .intro {padding: 447px 0 100px;}
    #wrap .intro .logo {width: 42px; top: 53px; left: 61px;}
    #wrap .intro h1 span {font-size: 4.38rem;}
    #wrap .intro h1 span:nth-child(1) {font-weight: 300;}
    #wrap .intro h1 span:nth-child(2) {font-weight: 700;}
    #wrap .container .sponsor_btn {width: 409px; height: 71px;}
    #wrap .container .sponsor_btn em {font-size:2.13rem;}
    #wrap .container .sponsor_btn::after {font-size:2rem;}
    #wrap .quiz_bg {padding: 150px 355px;}
    #wrap .quiz_bg .quiz .quiz_question h2 {font-size: 3.44rem;}
    /* --------------------------------------공통 */
    #wrap .container {padding:200px 255px;}
    #wrap .container .contents h1 {font-size:3.44rem;}
    #wrap .container .contents h1+p {font-size:2.13rem; margin: 40px 0;}
    /* ----------------------------------------4행 */
    #wrap .reduction_bg .reduction h1+p {margin: 58px 0;}
    /* ----------------------------------------------9행 */
    #wrap .gift_bg .gift {text-align: center;}
    #wrap .gift_bg .gift p {font-size:1.25rem;}
    #wrap .gift_bg .gift .gift_title {flex-flow:row; justify-content: space-between; align-items:end;}
    #wrap .gift_bg .gift .donation {
        margin: 70px auto;
        gap: 45px;
        grid-template-areas: 
            't_th th_th f_th';
        grid-template-columns: 1fr 1fr 1fr;
    }
    #wrap .gift_bg .gift .donation li .gift_img {height: 300px;}
    /* --------------------------------------------------10행 */
    #wrap .pay_info_bg {padding: 100px 235px;}
    #wrap .pay_info_bg .pay_info h1 {font-size: 2.13rem;}
    #wrap .pay_info_bg .pay_info ul li {font-size: 1.25rem;}
}

