@charset "utf-8";

/* #content */
.sub_visual {background-image: url(../images/gangnam/img_visual.png);}

.biography .inner .banner {background-image: url(../images/gangnam/img_banner.png);}
.biography .inner .icon {display: inline-block; width: 50%; padding-top: calc(252/370 * 50%); margin-top: 60px;
    background: url(../images/gangnam/img_license.png) center no-repeat; background-size: contain;}

    
.banner_area {background-color: #3D228A; overflow: hidden;}
.banner_area .inner {padding: 247px 0 247px 16%; position: relative; z-index: 1;}
.banner_area .inner::after {content: ''; display: block; width: 40%; padding-top: calc(782/768 * 40%); background-image: url(../images/gangnam/img_childhood.png);
    background-repeat: no-repeat; background-position: center bottom; background-size: contain; position: absolute; right: 8%; bottom: 0;}
.banner_area .inner .text_box {color: #fff; padding: 0;}
.banner_area .inner .text_box .sub_text {color: #fff;}


/* PC (해상도 1440px ~ 1540px) */
@media screen and (max-width:1540px) {
    .banner_area .inner {padding: 150px 0 150px 10%;}
}
/* PC (해상도 1058px ~ 1440px) */
@media screen and (max-width:1440px) {
    .banner_area .inner {padding: 100px 0 100px 8%;}
}
/* PC (해상도 1024px ~ 1058px) */
@media screen and (max-width:1058px) {
    .banner_area .inner {padding: 100px 0 100px 6%;}
}


/* 태블릿 (해상도 769px ~ 1024px) */
@media screen and (max-width:1024px) {
    /* content */
    .sub_visual {background-image: url(../images/gangnam/img_visual_tab.png);}
        

    .biography .inner .icon {width: 100%; padding-top: calc(252/370 * 100%); margin-top: 40px;}

        
    .banner_area .inner {padding: 80px 5%; position: relative; z-index: 1;}
    .banner_area .inner::after {width: 50%; padding-top: calc(500/384 * 50%); background-image: url(../images/gangnam/img_childhood_tab.png); right: 0;}
    .banner_area .inner .text_box {width: 45%;}
}

/* 모바일 가로, 모바일 세로 (해상도 375px ~ 768px)*/
@media screen and (max-width:768px) {
    .wrap { min-width: 375px; }
    /* content */
    .sub_visual {background-image: url(../images/gangnam/img_visual_mo.png);}


    .biography .inner .banner {background-image: url(../images/gangnam/img_banner_mo.png);}
    .biography .inner .icon {margin-top: 60px;}


    .banner_area .inner {padding: 60px 5% 0;}
    .banner_area .inner::after {width: 100%; padding-top: calc(362/327 * 100%); background-image: url(../images/gangnam/img_childhood_mo.png);
        position: relative;}
    .banner_area .inner .text_box {width: 100%; margin-bottom: 60px;}
}