.captain-reference-wrap {} 

.captain-reference-wrap .captain-reference-header {
    position:relative;
    background-color: #936DFE;
    height:192px;
    padding-top:48px;
    padding-bottom:80px;
    text-align: center;
}

.captain-reference-wrap .captain-reference-header h4 {
    font-weight: 700;
    font-size: 12px;
    line-height: 15px;
    letter-spacing: -0.02em;
    color: #FFB8EB;
    margin-bottom:12px;
}

.captain-reference-wrap .captain-reference-header h2 {
    font-weight: 700;
    font-size: 28px;
    line-height: 35px;
    letter-spacing: -0.02em;
    color: #FFFFFF;
}

.captain-reference-wrap .captain-reference-header .profile {
    position:absolute;
    width:100px;
    height:100px;
    background: #E6E6E6;
    overflow:hidden;
    border-radius: 100%;
    left:50%;
    bottom:-50px;
    margin-left:-50px;
}

.captain-reference-wrap .captain-reference-header .profile img { width:100%; height:100%; object-fit: cover; }

.captain-info-header {
    max-width:614px;
    margin:0 auto;
    margin-top:76px;
    margin-bottom:102px;
}

.captain-info-header .captain-info {
    margin-bottom:60px;
}
.captain-info-header .captain-info h3 {
    font-weight: 700;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: -0.02em;
    color: #000000;
}
.captain-info-header .captain-info h3 .date {
    margin-left:20px;
    font-size: 12px;
    line-height: 28px;
    color: #936DFE;
}
.captain-info-header .captain-info {
    margin-top:10px;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: -0.02em;
    color: #000000;
}

.captain-stats-wrap {
    display:flex;
}

.captain-stats-wrap .captain-stats {
    flex:1;
}

.captain-stats-wrap .captain-stats .count {
    width:100px; height:100px;
    border:1px solid #000;
    border-radius:100%;
    background:#4FEAB5;
    margin:0 auto;
    display:flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 40px;
    letter-spacing: -0.02em;
    color: #000000;
}

.captain-stats-wrap .captain-stats .title {
    text-align: center;
    margin-top:18px;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: -0.02em;
    color: #000000;
}

.captain-title-wrap {
    height: 88px;
    position: absolute;
    left: 0;
    top: -44px;
    width: 100%;
}

.captain-title-wrap:before {
    content:'';
    position:absolute;
    left:0; top:50%; width:100%;
    border-top:1px solid #000;
}

.captain-title-wrap h3 {
    position:relative;
    z-index: 2;
    width:394px;
    padding-left:60px;
    height:88px;
    border-radius: 44px;
    border:1px solid #000;
    margin:0 auto;
    font-weight: 700;
    font-size: 28px;
    line-height: 88px;
    text-align: center;
    letter-spacing: -0.02em;
    color: #000000;
}

.captain-list-wrap {
    position:relative;
    margin-top:44px;
    padding-top: 126px;
    padding-bottom:112px;
}

.captain-list-wrap.recruit {
    padding-bottom:105px;
}

.captain-list-wrap.recruit .captain-title-wrap h3 {
    background:url(/img/layout/icon_ticket.svg) no-repeat 42px center #FFFDF3;
}

.captain-list-wrap.finish {
    background: #FF8FDA;
    position:relative;
    padding-top: 126px;
    padding-bottom:112px;
    border-bottom:1px solid #000;
    margin-bottom:83px;
}
.captain-list-wrap.finish .captain-title-wrap h3 {
    background:url(/img/layout/icon_ufo.svg) no-repeat 42px center #FF8FDA;
    background-size:55px 38px;
    padding-left:66px;
}

.captain-review-wrap {
    margin-bottom:110px;
}

.captain-review-wrap .captain-review-header {
    position:relative;
    margin-bottom:20px;
}

.captain-review-wrap .captain-review-header h3 {
    font-weight: 700;
    font-size: 28px;
    line-height: 28px;
    letter-spacing: -0.02em;
    color: #000000;
}
.captain-review-wrap .captain-review-header ul.sort {
    position:absolute; right:0; top:0;
}
.captain-review-wrap .captain-review-header ul.sort li {
    display:inline-block;
}

.captain-review-wrap .captain-review-header ul.sort li + li {
    margin-left:10px;
}

.captain-review-wrap .captain-review-header ul.sort li a {
    font-weight: 700;
    font-size: 13px;
    line-height: 14px;
    letter-spacing: -0.02em;
    color: #C4C4C4;
}

.captain-review-wrap .captain-review-header ul.sort li.active a {
    color:#000;
}

.captain-reference-wrap .captain-footer {
    width:100%;
    height:210px;
    border-top:1px solid #000;
    background:url(/img/layout/bg_pattern_for_reference.png) repeat;
}

@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
    .captain-reference-wrap .captain-footer {
        background-image:url(/img/layout/bg_pattern_for_reference@2x.png);
        background-size:1440px 202px;
    }
}

@media (max-width: 991px) {
    .captain-info-header {
        max-width: 100%;
        padding-left: 20px;
        padding-right: 20px;
        margin-bottom:60px;
    }

    .captain-stats-wrap {
        justify-content: space-between;
        flex-wrap: wrap;
    }
    
    .captain-stats-wrap .captain-stats {
        width:50%;
        flex:inherit;
        margin-bottom:28px;
    }

    .captain-title-wrap {
        height: 65px;
        top: -33px;
    }

    .captain-title-wrap h3 {
        font-size:20px;
        line-height:65px;
        width:294px;
        height:65px;
    }
    
    .captain-list-wrap.recruit .captain-title-wrap h3 {
        background-position: 30px center;
        background-size:30px auto;
        padding-left:30px;
    }

    .captain-list-wrap.finish .captain-title-wrap h3 {
        background-size:40px auto; 
        background-position: 30px center;
        padding-left: 50px;
    }

    .captain-list-wrap.recruit,
    .captain-list-wrap.finish {
        padding-top:65px;
        padding-bottom:55px;
        margin-bottom:45px;
    }

    .captain-reference-wrap .meet-list-wrap .meet-list {
        grid-template-columns: repeat(2, 1fr);
        grid-column-gap: 14px;
        grid-row-gap: 35px;
    }
}