@charset "utf-8";
/* 사용 color 수정 */
:root {
    --primary: #207FFC;
    --primary-hover: #4A98FF;
    --secandary: #f3f9ff;
;}

/* 사용 color 수정 */

/*
01 에메랄드 그린
:root {
    --primary: #00A876;
    --primary-hover: #0cc28c;
    --secandary: #f4fffa;
;}

02 선샤인 오렌지
:root {
    --primary: #ff9d00;
    --primary-hover: #ffba4c;
    --secandary: #fffaf1;
;}

03 코발트 블루
:root {
    --primary: #207FFC;
    --primary-hover: #4A98FF;
    --secandary: #f3f9ff;
;}

04 라벤터 퍼블
:root {
    --primary: #814cff;
    --primary-hover: #996eff;
    --secandary: #f2edff;
;}

05 버건디 레드
:root {
    --primary: #ff4e48;
    --primary-hover: #ff6b66;
    --secandary: #fff4f4;
;}

/* index.html */
.visual .inner .visualTop {position: relative;}
.visual .inner .visualTop .right img {position: absolute; bottom: 0; right: -15rem;}

@media screen and (max-width: 1023px) {
    .visual .inner .visualTop .right img {right: 0; height: 90%;}
}
@media screen and (max-width: 767px) {
    .visual .inner .visualTop .right img {position: relative; height: auto;}
}

/* 2026-01-06 소개 (intro) 추가 */
.profile .inner .profileContent {flex-direction: column; gap: 4rem; margin-bottom: 0;}
.profile .inner .profileContent .details {width: 100%; text-align: center;}

@media screen and (max-width: 767px) {
    .profile .inner .profileContent .areaProfile .picture {padding: 0;}
    .profile .inner .profileContent .details {text-align: left;}
    .profile .inner {padding-bottom: 4rem;}
    .profile .inner .profileContent .areaProfile .name {font-size: 2.2rem; margin-top: 2rem;}
}