.interview .title-area {text-align: center;}
.interview .title-area .title {font-size: 50px; font-weight: 700; color: #000; margin-bottom: 25px;}
.interview .title-area .title::before {content: ''; display: block; width: 50px; height: 3px; background: #e50050; margin: 0 auto 10px;}
.interview .title-area .desc {font-size: 16px; font-weight: 300; line-height: 1.88; color: #4c4c4c;}

/* interview */
.interview {overflow: hidden;}
.interview .inner {padding: 80px 0 95px;}
.interview > div:nth-of-type(2n) {background-color: #f7f7f7;}
.interview > div:nth-of-type(2n+1) {background-color: #ffff;}

.interview .interview-area .inner::after {content: ''; display: block; clear: both;}
.interview .interview-area .interview-thumb {float: left;}
.interview .interview-thumb img {border: 1px solid #ddd; border-radius: 20px;}
.interview .interview-area .interview-info {width: calc(100% - 360px); float: right;}
.interview .interview-area .title-box {position: relative;}
.interview .interview-area .title-box::after {content: ''; display: block; clear: both;}
.interview .interview-area .title {position: relative; font-size: 30px; font-weight: 400; color: #000; float: left; padding-left: 30px;}
.interview .interview-area .title span {font-weight: 700;}
.interview .interview-area .title::before {position: relative; content: ''; position: absolute; top: -6px; left: 5px; width: 38px; height: 31px; background: url("../img/comma_left_g.png") no-repeat center;}
.interview .interview-badge {width: 42%; max-width: 175px; border-radius: 21px; text-align: center; padding: 9px 6px; float: right; margin-bottom: 20px;}
.interview .interview-area:nth-of-type(2n) .interview-badge {background: #e50050;}
.interview .interview-area:nth-of-type(2n+1) .interview-badge {background: #11b0a8;}
.interview .interview-badge .badge-inner {font-size: 16px; font-weight: 300; color: #fff;}
.interview .interview-tag {font-size: 16px; font-weight: 300; color: #555; clear: both; text-align: right;}
.interview .interview-area .question-list {margin-top: 40px;}
.interview .question-list .question-item {cursor: pointer;}
.interview .question-item:nth-child(1) .question-box {border-top: 1px solid #ddd;}
.interview .question-list .question-box {position: relative; border-bottom: 1px solid #ddd; padding: 15px 20px;}
.interview .question-list .question-box::after {content:''; position: absolute; right: 20px; top: 50%; transform: translateY(-50%) rotate(180deg); width: 25px; height: 15px; background:url("../img/arrow_gray.png") no-repeat center; transition: .3s;}
.interview .question-item.active .question-box::after {transform: translateY(-50%);}
.interview .question-list .ico-search {display: inline-block; width: 25px; height: 25px; border-radius: 5px; text-align: center; font-family: 'Poppins', sans-serif; font-size: 16px; font-weight: 500; color: #fff; font-style: normal; margin-right: 18px; vertical-align: middle;}
.interview .question-item:nth-child(2n) .ico-search {background: #363d43;}
.interview .interview-area:nth-of-type(2n) .question-item:nth-child(2n+1) .ico-search {background: #e50050;}
.interview .interview-area:nth-of-type(2n+1) .question-item:nth-child(2n+1) .ico-search {background: #11b0a8;}
.interview .question-list .question {display: inline-block; font-size: 17px; font-weight: 400; color: #000; line-height: 1.76; vertical-align: middle;}
.interview .question-list .answer-box {background: #f0f0f0; padding: 30px 50px 30px 70px; border-bottom: 1px solid #ddd; display: none;}
.interview .question-list .answer {font-size: 16px; font-weight: 300; color: #333; line-height: 1.75;}

/* media query */
@media screen and (max-width: 1700px) {
    /* common */
    .interview .inner {padding: 80px 20px 95px;}
}

@media screen and (max-width: 1500px) {

}

@media screen and (max-width: 1400px) {
    /* common */
    .interview .inner {padding: 80px 60px 95px;}
}

@media screen and (max-width: 1300px) {

}

@media screen and (max-width: 1200px) {

}

@media screen and (max-width: 1023px) {
    /* common */
    .interview br:not(.space) {display: none;}
    .interview .title-area .title {font-size: 40px;}

    .interview .interview-area .interview-thumb {float: none; text-align: center;}
    .interview .interview-area .interview-info {float: none; width: auto; margin-top: 50px;}
}

@media screen and (max-width: 767px) {
    /* common */
    .interview .inner {padding: 60px 40px;}
    .interview .title-area .title {font-size: 35px; margin-bottom: 20px;}
    .interview .title-area .desc {font-size: 15px; line-height: 1.65;}

    .interview .interview-area .title {font-size: 27px;}
    .interview .interview-badge .badge-inner {font-size: 15px;}
    .interview .interview-tag {font-size: 15px; text-align: center;}
    .interview .question-list .question {font-size: 16px;}
    .interview .question-list .answer-box {padding: 30px 40px;}
    .interview .question-list .answer {font-size: 15px;}
}

@media screen and (max-width: 640px) {
    .interview .question-list .question-box {padding: 15px 0;}
    .interview .question-list .question-box::after {right: 0; width: 20px; background-size: contain;}
}

@media screen and (max-width: 480px) {
    /* common */
    .interview .inner {padding: 60px 20px;}
    .interview .title-area .title {font-size: 30px; margin-bottom: 15px;}
    .interview .title-area .desc {font-size: 14px;}

    .interview .interview-area .title-box {text-align: center;}
    .interview .interview-area .title {font-size: 25px; padding-left: 0;}
    .interview .interview-badge .badge-inner {font-size: 14px;}
    .interview .interview-tag {font-size: 14px;}
    .interview .question-list .question {font-size: 15px; max-width: 70%; vertical-align: top; line-height: 1.6;}
    .interview .question-list .ico-search {margin-right: 10px;}
    .interview .interview-badge {margin: 0 auto 20px;}
    .interview .question-list .answer {font-size: 14px;}
    .interview .question-list .answer-box {padding: 30px 20px;}
}