@charset "utf-8";

#content {
    width:1600px;
    height:900px;
    /* background:url(../images/guide.png)no-repeat; */
    /* background:url(../images/guide3.jpg)no-repeat; */
    background-color: #fff;
    background-size:100% auto;
}

#content .header {
    width:1600px;
    height:125px;
    background:url(../images/top-bg.jpg)no-repeat;
    background-size:100% auto;
}

#content .header .title {
    font-family: "OneMobilePop";
    font-size: 60px;
    position: absolute;
    color: #000000;
    letter-spacing: -0.6px;
    top: 36px;
    left: 119px;
}

#content .header .con-tabs {
    position: absolute;
    top: 52px;
    right: 19px;
    display: flex;
    font-family: "BaskinRobbinsB";
    font-size: 40px;
    color: #6f9a82;
    justify-content: flex-end;
}

#content > .header > .con-tabs > span {
    width: 66px;
    height: 63px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: -2px;
    cursor: pointer;
}
#content > .header > .con-tabs > span:nth-child(1) { background: url('../images/tab-normal.png') center / contain no-repeat; }
#content > .header > .con-tabs > span:nth-child(1).swiper-pagination-bullet-active { background: url('../images/tab-active.png') center / contain no-repeat; color: #f4fbee; }
#content > .header > .con-tabs > span:nth-child(2) { background: url('../images/tab-normal.png') center / contain no-repeat; }
#content > .header > .con-tabs > span:nth-child(2).swiper-pagination-bullet-active { background: url('../images/tab-active.png') center / contain no-repeat; color: #f4fbee; }
#content > .header > .con-tabs > span:nth-child(3) { background: url('../images/tab-normal.png') center / contain no-repeat; }
#content > .header > .con-tabs > span:nth-child(3).swiper-pagination-bullet-active { background: url('../images/tab-active.png') center / contain no-repeat; color: #f4fbee; }
#content > .header > .con-tabs > span:nth-child(4) { background: url('../images/tab-normal.png') center / contain no-repeat; }
#content > .header > .con-tabs > span:nth-child(4).swiper-pagination-bullet-active { background: url('../images/tab-active.png') center / contain no-repeat; color: #f4fbee; }
#content > .header > .con-tabs > span:nth-child(5) { background: url('../images/tab-normal.png') center / contain no-repeat; }
#content > .header > .con-tabs > span:nth-child(5).swiper-pagination-bullet-active { background: url('../images/tab-active.png') center / contain no-repeat; color: #f4fbee; }


#content .answer-box {
    width: max-content;
    border: 7px solid #bbe381;
    border-radius: 35px;
    margin-top: 42px;
    margin-bottom: 74px;
    position: relative;
    cursor: pointer;
}
#content .answer-box .answer-txt {
    font-family: "KoPubWorldDotumPB";
    font-size: 110px;
    color: #282828;
    padding: 23px 100px 23px 100px;
}
#content .answer-box .hand-icon {
    position: absolute;
    width:64px;
    height:50px;
    background:url(../images/hand.png)no-repeat;
    background-size:100% auto;
    top: 96px;
    right: 12px;
    cursor: pointer;
}
#content .mean-box {
    position: relative;
    width: 1400px;
    border-radius: 30px;
    background-color: #fffbd7;
    display: flex;
    justify-content: center;
    align-items: center;
}
#content .mean-box:before {
    content:'';
    position: absolute;
    top: -81px;
    left: -21px;
    width: 240px;
    height: 103px;
    background-image:url(../images/sub-title-icon-1.png);
    background-repeat:no-repeat;
    background-size:100%;
}
#content .mean-box .mean-txt {
    font-family: "KoPubWorldDotumPB";
    font-size: 70px;
    color: #020202;
    padding: 24px 10px;
}
#content .hanja-box {
    position: relative;
    width: 1400px;
    height: 250px;
    border-radius: 30px;
    background-color: #ffeadc;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 93px;
}
#content .hanja-box:before {
    content:'';
    position: absolute;
    top: -71px;
    left: -40px;
    width: 253px;
    height: 109px;
    background-image:url(../images/sub-title-icon-2.png);
    background-repeat:no-repeat;
    background-size:100%;
}
#content .hanja-box .con-hanja {
    width: max-content;
    border: 5px solid #ffba7d;
    border-radius: 35px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 201px;
    margin: 0 5px;
    padding: 0px 32px;
    background-color: #fff;
}
#content .hanja-box .con-hanja .hanja-txt {
    font-family: "KoPubWorldDotumPB";
    font-size: 85px;
    color: #202aec;
}
#content .hanja-box .con-hanja .hanja-mean {
    font-family: "KoPubWorldDotumPB";
    font-size: 80px;
    color: #020202;
}
#content .hanja-box .con-hanja .hanja-mean > span {
    color: #ec202f;
}




#content .exam-box {
    position: relative;
    width: 1400px;
    height: 278px;
    border-radius: 30px;
    background-color: #ffeadc;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 63px;
}
#content .exam-box:before {
    content:'';
    position: absolute;
    top: -41px;
    left: -39px;
    width: 253px;
    height: 109px;
    background-image:url(../images/sub-title-icon-3.png);
    background-repeat:no-repeat;
    background-size:100%;
}
#content .exam-box ul {
    padding-left: 260px;
    /* list-style-image:url(../images/bullet.png);
    list-style-position: outside; */
}
#content .exam-box ul li {
    font-family: 'KoPubWorldDotumPB';
    font-size: 70px;
    color: #020202;
    line-height: 80px;
    position: relative;
}
#content .exam-box ul li:before {
    content: '';
    position: absolute;
    top: 20px;
    left: -47px;
    width: 25px;
    height: 25px;
    background-image: url(../images/bullet.png);
    background-repeat: no-repeat;
    background-size: 100%;
}
#content .exam-box ul li > span {
    color: #ec202f;
}


.swiper-slide {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.popup {
    position: absolute;
    top: 0;
    left: 0;
    width: 1600px;
    height: 900px;
}
.popup .popup-close {
    position: absolute;
    top: 45px;
    right: 50px;
    width: 42px;
    height: 41px;
    background-image:url(../images/popup/close-btn.png);
    background-repeat:no-repeat;
    background-size:100%;
    cursor: pointer;
}
.popup .popup-img {
    width: 1552px;
    height: 860px;
    margin-left: 24px;
    margin-top: 23px;
    overflow: hidden;
    border-radius: 30px;
    border: 5px solid #ffba7d;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}
.popup .popup-img > img {
    width: 101%;
    height: 102%;
    margin-left: -5px;
    margin-top: -5px;
}

/* 이미지 출처 */
.con-box {
    display: flex;
}
.source-img-box {
    width: 698px;
    height: 428px;
    margin-right: 10px;
}
.source-img-box .img-box {
    border-radius: 30px;
    border: 5px solid #ffba7d;
    overflow: hidden;
    position: relative;
}
.source-img-box .img-box > img {
    width: 101%;
    height: 101%;
    min-height: 428px;
    margin: -3px;
}
.source-img-box .source-txt {
    font-family: "KoPubWorldDotumPB";
    font-size: 30px;
    color: #020202;
    margin-left: 35px;
    margin-top: 9px;
}
#content .mean-box.mean-img {
    position: relative;
    width: 692px;
    height: max-content;
    border-radius: 30px;
    background-color: #fffbd7;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 428px;
    padding: 35px 50px 35px 50px;
    margin-left: 10px;
}
#content .mean-box.mean-img:before {
    content: '';
    position: absolute;
    top: -59px;
    left: 466px;
    width: 240px;
    height: 103px;
    background-image: url(../images/sub-title-icon-1.png);
    background-repeat: no-repeat;
    background-size: 100%;
    transform: rotate(16deg);
}
#content .mean-box.mean-img .mean-txt {
    font-family: "KoPubWorldDotumPB";
    font-size: 70px;
    color: #020202;
    padding: 24px 10px;
    line-height: 80px;
}
.expand-img-btn {
    position: absolute;
    bottom: 20px;
    right: 20px;
    width: 40px;
    height: 40px;
    background-image: url(../images/expand-btn.png);
    background-repeat: no-repeat;
    background-size: 100%;
    cursor: pointer;
}

/* 삼각형 이미지 */
.arrow-img-box {
    width: 698px;
    height: 428px;
    margin-right: 10px;
}
.arrow-img-box .img-box {
    border-radius: 30px;
    border: 5px solid #ffba7d;
    overflow: hidden;
    position: relative;
}
.arrow-img-box .img-box > img {
    width: 101%;
    height: 101%;
    min-height: 428px;
    margin: -3px;
}
.arrow-img-box .arrow-txt {
    font-family: "KoPubWorldDotumPB";
    font-size: 30px;
    color: #020202;
    margin-left: 35px;
    margin-top: 9px;
}
#content .mean-box.arrow-mean-img {
    position: relative;
    width: 692px;
    height: max-content;
    border-radius: 30px;
    background-color: #fffbd7;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 428px;
    padding: 35px 50px 35px 50px;
    margin-left: 10px;
}
#content .mean-box.arrow-mean-img:before {
    content: '';
    position: absolute;
    top: -59px;
    left: 466px;
    width: 240px;
    height: 103px;
    background-image: url(../images/sub-title-icon-1.png);
    background-repeat: no-repeat;
    background-size: 100%;
    transform: rotate(16deg);
}
#content .mean-box.arrow-mean-img .mean-txt {
    font-family: "KoPubWorldDotumPB";
    font-size: 70px;
    color: #020202;
    padding: 24px 10px;
    line-height: 80px;
}


/* 이미지 */
.img-box-normal {
    width: 698px;
    height: 448px;
    margin-right: 10px;
}
.img-box-normal .img-box {
    border-radius: 30px;
    border: 5px solid #ffba7d;
    overflow: hidden;
    position: relative;
    height: 468px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.img-box-normal .img-box > img {
    width: 101%;
    height: 101%;
    min-height: 448px;
    margin: -3px;
}
.img-box-normal .txt {
    font-family: "KoPubWorldDotumPB";
    font-size: 30px;
    color: #020202;
    margin-left: 35px;
    margin-top: 9px;
}
#content .mean-box.normal-mean-img {
    position: relative;
    width: 692px;
    height: max-content;
    border-radius: 30px;
    background-color: #fffbd7;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 468px;
    padding: 25px 30px 25px 30px;
    margin-left: 10px;
}
#content .mean-box.normal-mean-img:before {
    content: '';
    position: absolute;
    top: -59px;
    left: 466px;
    width: 240px;
    height: 103px;
    background-image: url(../images/sub-title-icon-1.png);
    background-repeat: no-repeat;
    background-size: 100%;
    transform: rotate(16deg);
}
#content .mean-box.normal-mean-img .mean-txt {
    font-family: "KoPubWorldDotumPB";
    font-size: 70px;
    color: #020202;
    padding: 24px 10px;
    line-height: 80px;
    word-break: keep-all;
}