/* 공통 */
#c2_wrap .c_inner{ width: 1400px; margin:0 auto; position: relative; padding:0 50px;}
#c2_wrap .c_tit h1 {font-size: 60px; font-weight: 700; color:#fff; font-family: 'Play', sans-serif;}
#c2_wrap .c_tit p {font-size: 20px; font-weight: 300; color:#fff; line-height: 35px; margin:35px 0 0;}
#c2_wrap .c_btn {display: flex; align-items: center;}
#c2_wrap .c_btn span {display: block; font-size: 18px; font-weight: 400; color:#fff; font-family: 'Play', sans-serif; margin-right: 12px; transition: color .3s;}
#c2_wrap .c_btn i {display: block; position: relative; left: 0; }
@keyframes btn_arrow {
    0% {left: 1px;}
    50% {left: -5px;}
    100% {left: 1px;}
}


/*Content CSS*/
#c2_wrap {width: 100%; position: relative; display: flex; overflow: hidden; height: 640px;}
#c2_wrap > div {width: 50%; overflow: hidden; position: relative; z-index: 1;}
#c2_wrap .left a {display: block; width: 100%; height:100%;  position: relative; z-index: 1; display: flex; justify-content: flex-start; flex-direction: column;
overflow: hidden; align-items: flex-end; padding: 120px 0 0 ;}
#c2_wrap .left a::before {content: ''; display: block; width: 100%; height: 100%; background:url("../img/c2_left_bg.jpg") 70% 50% no-repeat;background-size:cover;
transition: transform .3s ease; z-index: -1; position: absolute; left: 0; top: 0; }
#c2_wrap .left a > div {width: 100%; max-width: 650px; }
#c2_wrap .left a .c_btn {justify-content: flex-end; margin-top: 150px; padding-right: 110px;}

#c2_wrap .right {display: flex; height: 100%; flex-direction: column; }
#c2_wrap .right .c_tit {max-width: 650px; width: 100%; padding-left: 110px;}
#c2_wrap .right > a {display: block; width: 100%; height:50%;  position: relative; z-index: 1; display: flex; justify-content: center; flex-direction: column;
overflow: hidden;}
#c2_wrap .right > a::before {content: ''; display: block; width: 100%; height: 100%; transition: transform .3s ease; z-index: -1;
position: absolute; left: 0; top: 0;}
#c2_wrap .right > .top::before {background:url("../img/c2_right_bg1.jpg") 50% 50% no-repeat;background-size:cover;}
#c2_wrap .right > .bot::before {background:url("../img/c2_right_bg2.jpg") 50% 50% no-repeat;background-size:cover; }
#c2_wrap .right .c_btn {position: absolute; left: 565px; top:95px;  }




#c2_wrap > div a:hover .c_btn i {animation: btn_arrow 1s ease-in-out infinite;}
#c2_wrap .left a:hover::before {transform: scale(1.1);}
#c2_wrap .right > a:hover::before  {transform: scale(1.1);}


@media screen and (max-width: 1500px) {
    #c2_wrap .right .c_btn {left: auto; right: 40px;}
}

@media screen and (max-width: 1420px) {
    /* 공통 */
    #c2_wrap .c_inner {width: 100%; }

    /* content */
    #c2_wrap .left a > div {padding: 0 50px; }
    #c2_wrap .left a .c_btn { padding-right: 50px;}
    #c2_wrap .right .c_tit {padding:0 40px; max-width: 100%;}
    #c2_wrap .right .c_btn {right: 40px;}


}



@media screen and (max-width: 1024px) {
    /* 공통 */
    #c2_wrap .c_tit h1 {font-size: 45px; }
    #c2_wrap .c_tit p {font-size: 16px; line-height: 28px; margin: 15px 0 0;}
    #c2_wrap .c_btn span {font-size: 15px;}
    #c2_wrap .c_btn i img {height: 40px; }

    /* content */
    #c2_wrap {text-align: center; height: auto; flex-direction: column; }
    #c2_wrap > div {width: 100%;}
    #c2_wrap .left a {padding: 50px 30px;justify-content: center; align-items: center; }
    #c2_wrap .left a > div {padding:0;}
    #c2_wrap .left a .c_btn {padding: 0; margin-top: 40px; justify-content: center; }

    #c2_wrap .right {flex-direction: row;}
    #c2_wrap .right a {padding:50px 20px; width: 50%; height: auto;}
    #c2_wrap .right .c_btn {display: none;}



}

@media screen and (max-width: 640px) {
    /* 공통*/
    #c2_wrap .c_tit h1 {font-size: 35px; }
    #c2_wrap .c_tit p {font-size: 14px; line-height: 24px; margin: 15px 0 0; letter-spacing: -.5px ;}
    #c2_wrap .c_btn span {font-size: 14px;}
    #c2_wrap .c_btn i img {height: 30px; }

    /* content */
    #c2_wrap .left a {padding: 30px 15px;}
    #c2_wrap .left a .c_btn {margin-top: 30px; }

    #c2_wrap .right {flex-direction: column;}
    #c2_wrap .right a {padding:30px 15px;  width: 100%;}

}

@media screen and (max-width: 480px) {
    /* 공통*/

    /* content */
    #c2_wrap .right .c_tit p br {display: none;}



}
