@import url(../css/common.css);
@import url(../css/layout.css);
@import url(../css/default.css);

.cursor {position:fixed;z-index:1000;transform:translate(-50%, -50%); pointer-events:none;}
.cursor .bg{
    font-family: 'pretandard';
    font-weight: 400;
    opacity:0;position:absolute;
    left:-52px;top:-52px;transform:scale(0);
    width:90px;height:90px;
    border-radius:50%;
    text-align:center;line-height:105px;
    color:#fff;backdrop-filter: blur(20px) ;
    background: rgba(73, 73, 73, 0.15);border-radius: 50%;
    transition:all .4s ;
}
.cursor .bg::before {
    position:absolute;
    font-size:18px;
    font-weight: 700;
    content: "Scroll";
    left: 50%;
    top: 50%;
    transform:translate(-50%, -50%)
}
.cursor.on .bg {
    opacity:1;transform:scale(1)
}
.cursor.active .bg{
    background-color: #fff;
    color: #1d1d1d;
}
.cursor.active .bg::before {
    content: "Click";
}
section {
    width: 100vw;
}
.main {
    color: #fff;
    background: url(../images/visual_bg.png) no-repeat center center/cover;
    height: 100vh;
}
.main .inner {
    position: relative;
    width: 100vw;
    height: 100vh;
}
.main .inner .main_tit {
    font-size: 150px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-65% , -50%);
}
.main .inner .main_tit .sub {
    position: absolute;
    right:  -26%;
    bottom:  0;
    font-size: 18px;
    font-weight: 400;
    margin: 0 0 25px -90px;
}
@media screen and (max-width:1560px) {
    .main .inner .main_tit {
        font-size: 120px;
    }
    .main .inner .main_tit strong {
        font-size: 150px;
    }
    .main .inner .main_tit .sub {
        font-size: 15px;
    }
}
@media screen and (max-width:1320px) {
    .main .inner .main_tit {
        font-size: 110px;
    }
    .main .inner .main_tit strong {
        font-size: 140px;
    }
    .main .inner .main_tit .sub {
        margin: 0 0 15px 0;
    }
}
/*.typing-demo {
    width: 10ch;
    animation: typing 3s steps(22), blink .8s step-end infinite alternate;
    white-space: nowrap;
    overflow: hidden;
    border-right: 3px solid;
  }
  
  @keyframes typing {
    from {
      width: 0
    }
  }
      
  @keyframes blink {
    50% {
      border-color: transparent
    }
  }
*/
.main .tit {
    font-style: italic;
    line-height: 0.8;
}
.main .tit02 {
    margin-left: 1.1em;
}
.main .tit03 {
    margin-left: 0.3em;
}
.main .tit strong {
    font-size: 200px;
}
.main .inner .sub span {
    display: block;
    line-height: 1.4;
}
.call {
    position: fixed;
    right: 60px;
    bottom: 60px;
    z-index: 102;
    opacity: 1;
    transition: all 0.3s;
}
@keyframes circle { /* 애니메이션을 효과를 미리 설정함 */
	0% { transform:rotate(0) }  /* 애니메이션을 시작할때의 속성 */
	100% { transform:rotate(360deg) } /* 애니메이션이 종료될때의 속성 */
}
.call .inner {
    background-color: #0d0d0d;
    border: 1px solid #fff;
    min-width: 150px;
    height: 150px;
    border-radius: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px 60px;
    box-shadow: 2px 2px 10px rgb(255 255 255 / 40%);
    color: #fff;
    cursor: pointer;
    position: relative;
    transition: all .3s;
    animation: circle 8s linear infinite;
}
.call ul {
    max-width: 0;
    overflow: hidden; 
    transition: max-width 600ms , opacity .3s; 
    opacity: 0;
} 
.call .inner ul li a {
    display: flex; 
    align-items: center; 
    flex-wrap: wrap;
    font-size: 24px;
}
.call .inner ul li + li {
    margin-top: 20px
}
.call .inner ul li a span {
    display: block;
    position: relative;
    padding-left: 40px;
}
.call .inner ul li a span::before {
    position: absolute;
    left: 0;
    top:5px;
    width: 21px;
    height: 21px;
    content: "";
    background-position: center center;
    background-repeat: no-repeat;
}
.call .inner ul li a.e-mail span::before {
    background-image: url("data:image/svg+xml,%3Csvg width='21' height='22' viewBox='0 0 21 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_170_461' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='21' height='22'%3E%3Crect y='0.803467' width='20.2979' height='20.2979' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_170_461)'%3E%3Cpath d='M3.64311 17.2955C3.2159 17.2955 2.85429 17.1475 2.55828 16.8515C2.26226 16.5555 2.11426 16.1939 2.11426 15.7667V6.1382C2.11426 5.71099 2.26226 5.34937 2.55828 5.05336C2.85429 4.75735 3.2159 4.60934 3.64311 4.60934H16.6546C17.0818 4.60934 17.4434 4.75735 17.7394 5.05336C18.0354 5.34937 18.1834 5.71099 18.1834 6.1382V15.7667C18.1834 16.1939 18.0354 16.5555 17.7394 16.8515C17.4434 17.1475 17.0818 17.2955 16.6546 17.2955H3.64311ZM10.1488 11.4241L16.9148 7.09774L16.7847 5.87794L10.1488 10.1067L3.51298 5.87794L3.38286 7.09774L10.1488 11.4241Z' fill='white'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.call .inner ul li a.phone span::before {
    background-image: url("data:image/svg+xml,%3Csvg width='19' height='20' viewBox='0 0 19 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_170_464' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='19' height='20'%3E%3Crect x='0.363281' y='0.541565' width='18.6372' height='18.6372' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_170_464)'%3E%3Cpath d='M15.8559 16.8491C14.2381 16.8491 12.6397 16.4964 11.0607 15.7911C9.4817 15.0857 8.04508 14.0859 6.75083 12.7916C5.45658 11.4974 4.45677 10.0608 3.75141 8.48179C3.04604 6.9028 2.69336 5.3044 2.69336 3.68659C2.69336 3.45363 2.77101 3.25949 2.92632 3.10418C3.08163 2.94887 3.27577 2.87122 3.50874 2.87122H6.65376C6.83496 2.87122 6.99674 2.93269 7.13911 3.05565C7.28147 3.1786 7.3656 3.3242 7.39148 3.49246L7.89624 6.21038C7.92213 6.41746 7.91566 6.59218 7.87683 6.73455C7.838 6.87692 7.76682 6.99987 7.66328 7.10341L5.78014 9.00596C6.03899 9.48483 6.34638 9.94752 6.7023 10.394C7.05822 10.8406 7.44973 11.2709 7.87683 11.6851C8.27805 12.0863 8.69868 12.4584 9.13872 12.8013C9.57877 13.1443 10.0447 13.4582 10.5365 13.7429L12.3614 11.918C12.4779 11.8015 12.63 11.7142 12.8176 11.6559C13.0053 11.5977 13.1897 11.5815 13.3709 11.6074L16.05 12.151C16.2312 12.2028 16.38 12.2966 16.4965 12.4325C16.613 12.5684 16.6713 12.7205 16.6713 12.8887V16.0337C16.6713 16.2667 16.5936 16.4608 16.4383 16.6161C16.283 16.7715 16.0888 16.8491 15.8559 16.8491Z' fill='white'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.call button {
    position: absolute; 
    left: 50%; 
    top: 50%;
    transform: translate(-50%,-50%);
    transition: all .3s;
    font-size: 26px;
}
.call .inner:hover ul { max-width: 400px; opacity: 1;} 
.call .inner:hover { animation: none ;
}
@keyframes none { /* 애니메이션을 효과를 미리 설정함 */
	0% { transform:rotate(0) }  /* 애니메이션을 시작할때의 속성 */
	100% { transform:rotate(0) } /* 애니메이션이 종료될때의 속성 */
}
.call .inner:hover button { opacity: 0;}

.intro {
    margin-top: 90px;
    height: calc(100vh - 90px);
}
.intro .wrapper {
    display: flex;
}
.intro .sec01 {
    width: 20%;
    display: flex;
    flex-direction: column;
    margin: 160px 150px 0 60px;
}
.intro .sec01 span {
    position: absolute;
    left: 40px;
    top: 70px;
    font-weight: 600;
    font-size: 150px;
    color: rgba(0, 0, 0,0.1);
    display: block;
}
.intro .sec01 .photo {
    overflow: hidden;
    text-align: center;
    line-height: 0;
    font-size: 0;
}
.intro .sec01 .photo img {
    width: 272px;
    height: 272px;
    border-radius: 100%;
}
.intro .sec01 h2 {
    font-size: 36px;
    font-weight: 600;
    font-family: 'pretandard';
    margin: 22px 0 20px 0;
}
.intro .sec01 p {
    font-size: 18px;
    line-height: 1.7;
    color: #333;
}
.intro .sec01 em {
    font-weight: 600;
}
.intro .sec01 h2 em {
    display: block;
    font-size: 20px;
    color: #333;
}
.intro .sec02 {
    display: flex;
    width: 65%;
    justify-content: space-between;
    margin: 70px 0 0 50px;
    font-family: 'pretandard';
}
.intro .sec02 dl {
    width: 50%;
}
.intro .sec02 dl div {
    margin-bottom: 52px;
    font-weight: 600;
}
.intro .sec02 dt {
    font-size: 30px;
    margin-bottom: 20px;
    text-decoration: 1.5px underline;
}
.intro .sec02 dd {
    font-size: 21px;
    line-height: 2;
    display: flex;
}
.intro .sec02 dd span {
    margin-right: 40px;
}
.intro .sec02 .info05 dd {
    display: inline-block;
    padding: 7px 22px;
    border: 1px solid #0d0d0d;
    border-radius: 30px;
    margin: 0 10px 20px 0;
    line-height: 1;
}

.index {
    display: flex;
    height: 100vh;
    align-items: center;
    background-color: #000;
    color: #fff;
}
.index h2 {
    padding: 0 60px;
    font-size: 60px;
    font-weight: 600;
    height: 100%;
    display: flex;
    align-items: center;
    border-width: 0 1px 0 1px;
    border-style: solid ;
    border-color: rgba(255, 255, 255, 0.2);
}
.index h2 strong {
    font-size: 40px;
    margin-bottom: 20px;
}
.index .cnt {
    font-family: 'pretandard';
    height: calc(100vh - 90px);
    margin-top: 90px;
    width: 100%;
}
.index .cnt li {
    height: 25%;
    display: flex;
    width: 100%;
    padding-right: 300px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    position: relative;
    z-index: 10;
}
.index .cnt li::after {
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    content: "";
    opacity: 0;
    transition: 0.5s;
}
.index .cnt li.on::after {
    opacity: 1;
}
.index .cnt li.kps::after {
    background: url(../images/index01_bg.png) no-repeat center center /cover ;
}
.index .cnt li.hospital::after {
    background: url(../images/index02_bg.png) no-repeat center center /cover ;
}
.index .cnt li.pusan_uni::after {
    background: url(../images/index03_bg.png) no-repeat center center /cover ;
}
.index .cnt li a {
    display: flex;
    position: relative;
    width: 100%;
    height: 100%;
    align-items: center;
}
.index .cnt li a strong {
    display: block;
    width: 3em;
    font-family: 'Cormorant';
    font-size: 60px;
    font-style: italic;
    text-align: center;
}
.index .cnt li a .right {
    margin-left: 50px;
}
.index .cnt li a .sub {   
    margin: 20px 0 0 0 ;
}
.index .cnt li a .sub span {
    display: inline-block;
    font-size: 16px;
    margin-right: 10px;
    padding: 6px 15px 10px 15px;
    border: 1px solid #fff;
    border-radius: 50px;
    line-height: 1;
}
.index .cnt li a .tit {
    font-size: 34px;
    line-height: 1;
    font-weight: 500;
}
.index .cnt button {
    transition: 0.3s linear;
    position: absolute;
    right: 0;
    top: 50%;
    transform:translate(0, -50%);
    width: 45px;
    height: 45px;
    border-radius: 100%;
    border: 1px solid #fff;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%3Csvg width='21' height='16' viewBox='0 0 21 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.54004 7.30225C0.987753 7.30225 0.540038 7.74996 0.540039 8.30225C0.54004 8.85453 0.987756 9.30225 1.54004 9.30225L1.54004 7.30225ZM20.0533 9.00932C20.4438 8.6188 20.4438 7.98563 20.0533 7.59511L13.6893 1.23116C13.2988 0.840634 12.6656 0.840635 12.2751 1.23116C11.8846 1.62168 11.8846 2.25485 12.2751 2.64537L17.932 8.30222L12.2751 13.9591C11.8846 14.3496 11.8846 14.9828 12.2751 15.3733C12.6657 15.7638 13.2988 15.7638 13.6893 15.3733L20.0533 9.00932ZM1.54004 9.30225L19.3462 9.30222L19.3462 7.30222L1.54004 7.30225L1.54004 9.30225Z' fill='white'/%3E%3C/svg%3E%0A");
}
.index .cnt li.on button {
    border: 1px solid #fff;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg width='21' height='16' viewBox='0 0 21 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.54004 7.30225C0.987753 7.30225 0.540038 7.74996 0.540039 8.30225C0.54004 8.85453 0.987756 9.30225 1.54004 9.30225L1.54004 7.30225ZM20.0533 9.00932C20.4438 8.6188 20.4438 7.98563 20.0533 7.59511L13.6893 1.23116C13.2988 0.840634 12.6656 0.840635 12.2751 1.23116C11.8846 1.62168 11.8846 2.25485 12.2751 2.64537L17.932 8.30222L12.2751 13.9591C11.8846 14.3496 11.8846 14.9828 12.2751 15.3733C12.6657 15.7638 13.2988 15.7638 13.6893 15.3733L20.0533 9.00932ZM1.54004 9.30225L19.3462 9.30222L19.3462 7.30222L1.54004 7.30225L1.54004 9.30225Z' fill='black'/%3E%3C/svg%3E%0A");
}
/*제작수정멘트*/
.index .cnt li.num04 {
    color: #6a6a6a;
}

.index .cnt li.num04 a .sub span {
    border: 1px solid #6a6a6a;
}
/*제작수정멘트*/
.project {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    background-color: #000;
    color: #fff;
    display: flex;
    position: relative;
}
.project .line {
    margin-top: 230px;
    width: 130px;
    height: 1px;
    background-color: rgb(255 255 255 / 60%);
}
.project .inner {
    position: absolute;
    left: 180px;
    top: 200px;
    z-index: 10;
}
.project h2 {
    font-size: 53px;
    font-weight: 600;
    letter-spacing: -0.05em;
    line-height: 1.3;
    font-family: 'pretandard';
    text-shadow: 0 8px 16px rgba(0,0,0,.1);
}
.project .photo {
    position: absolute;
    right: -30px;
    top: 120px;
}
.project .photo::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    background: linear-gradient(90deg, #000 20%, rgba(0, 0, 0, 0) 100%);
    opacity: 0.6;
    width: 40%;
}
.project .photo a {
    display: block;
    transition: 0.3s linear;
}
.project .photo a:hover {
    transform: scale3d(0.98,0.98,1);
}
.project .photo img {
    width: 100%;
    height: 100%;
}
.project .view_btn {
    font-size: 20px;
    margin: 80px 0 90px 0;
    display: flex;
}
.project .view_btn a {
    margin-right: 20px;
    font-family: 'pretandard';
    padding: 8px 20px 10px 20px;
    font-weight: 600;
    border-radius: 50px;
    display: block;
    transition: 0.3s linear;
}
.project .view_btn a:hover {
    transform: scale(0.92);
}
.project .view_btn .pro {
    position: relative;
    background-color: #fff;
    color: #000;
}
/*.project .view_btn .pro::before {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translatey(-50%);
    width: 74px;
    height: 74px;
    border-radius: 100%;
    z-index: -1;
    content: "";
    background-color: #1E6593;
    filter: blur(2px);
}*/
.project .view_btn .det {
    border: 1px solid #fff;
}
.project .detail {
    color: rgb(255 255 255 / 0.8);
    line-height:2.5;
}
.project .detail span {
    font-size: 20px;
    font-weight: 600;
    width: 5.5em;
    display: inline-block;
    margin-right: 15px;
}
.project .detail strong {
    width: 8em;
    font-size: 15px;
    font-family: 'pretandard';
}
.project.hospital .inner {
    left: 160px;
}
.contact {
    width: 100vw;
    height: 100vh;
    background: url(../images/contact_bg01.png) no-repeat left top/cover;
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.contact::after {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: "";
    z-index: -1;
    background: url(../images/contact_bg.png) no-repeat left top/cover;
}
.contact .tit {
    padding-top: 50px;
    height: 263px;
    font-size: 180px;
    margin-left: 40px;
    font-weight: 700;
    color: #f8f8f8;
    overflow: hidden;
    font-style: italic;
}
.contact ul {
    padding-top: 2px;
    height: 244px;
    overflow: hidden;
    width: 698px;
    /*border-bottom: 1px solid rgba(255,255,255,0.4);*/
    display: flex;
    align-items: center;
}
.contact ul li {
    width: 33.33%;
    height: 100%;
    justify-content: center;
    display: flex;
    align-items: center;
    position: relative;
    transition: 0.5s linear;
}
.contact ul li a {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
}
.contact ul li a i {
    background-position: center center;
    background-repeat: no-repeat;
    display: block;
    height: 100%;
}
.contact ul li:hover i {
    transform: rotateY(90deg);
}
.contact ul li:nth-child(1) i  {
    background-image: url("data:image/svg+xml,%3Csvg width='88' height='70' viewBox='0 0 88 70' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.74428 69.3748C6.42908 69.3748 4.4694 68.5727 2.86523 66.9685C1.26107 65.3644 0.458984 63.4047 0.458984 61.0895V8.9103C0.458984 6.5951 1.26107 4.63542 2.86523 3.03125C4.4694 1.42708 6.42908 0.625 8.74428 0.625H79.2568C81.572 0.625 83.5317 1.42708 85.1359 3.03125C86.74 4.63542 87.5421 6.5951 87.5421 8.9103V61.0895C87.5421 63.4047 86.74 65.3644 85.1359 66.9685C83.5317 68.5727 81.572 69.3748 79.2568 69.3748H8.74428ZM44.0005 37.5558L80.6672 14.1103L79.9621 7.49989L44.0005 30.4166L8.03902 7.49989L7.33387 14.1103L44.0005 37.5558Z' fill='white'/%3E%3C/svg%3E%0A");
}
.contact ul li:nth-child(1)::before {
    background-image: url("data:image/svg+xml,%3Csvg width='88' height='70' viewBox='0 0 88 70' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.74428 69.3748C6.42908 69.3748 4.4694 68.5727 2.86523 66.9685C1.26107 65.3644 0.458984 63.4047 0.458984 61.0895V8.9103C0.458984 6.5951 1.26107 4.63542 2.86523 3.03125C4.4694 1.42708 6.42908 0.625 8.74428 0.625H79.2568C81.572 0.625 83.5317 1.42708 85.1359 3.03125C86.74 4.63542 87.5421 6.5951 87.5421 8.9103V61.0895C87.5421 63.4047 86.74 65.3644 85.1359 66.9685C83.5317 68.5727 81.572 69.3748 79.2568 69.3748H8.74428ZM44.0005 37.5558L80.6672 14.1103L79.9621 7.49989L44.0005 30.4166L8.03902 7.49989L7.33387 14.1103L44.0005 37.5558Z' fill='black'/%3E%3C/svg%3E%0A");
}
.contact ul li:nth-child(2) i {
    background-image: url("data:image/svg+xml,%3Csvg width='77' height='77' viewBox='0 0 77 77' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M71.9563 76.375C63.1889 76.375 54.5267 74.4637 45.9698 70.6412C37.4128 66.8186 29.6274 61.4004 22.6135 54.3865C15.5997 47.3726 10.1814 39.5872 6.35885 31.0302C2.53629 22.4733 0.625 13.8111 0.625 5.04375C0.625 3.78125 1.04583 2.72917 1.8875 1.8875C2.72917 1.04583 3.78125 0.625 5.04375 0.625H22.0875C23.0694 0.625 23.9462 0.95816 24.7177 1.62448C25.4892 2.2908 25.9451 3.07986 26.0854 3.99167L28.8208 18.7208C28.9611 19.8431 28.926 20.7899 28.7156 21.5615C28.5052 22.333 28.1194 22.9993 27.5583 23.5604L17.3531 33.8708C18.7559 36.466 20.4217 38.9734 22.3505 41.3932C24.2793 43.813 26.401 46.1451 28.7156 48.3896C30.8899 50.5639 33.1694 52.5804 35.5542 54.4391C37.9389 56.2977 40.4639 57.9986 43.1292 59.5417L53.0188 49.6521C53.65 49.0208 54.4741 48.5474 55.4911 48.2318C56.5082 47.9161 57.5076 47.8285 58.4896 47.9688L73.0083 50.9146C73.9903 51.1951 74.7969 51.7036 75.4281 52.4401C76.0594 53.1766 76.375 54.0007 76.375 54.9125V71.9563C76.375 73.2188 75.9542 74.2708 75.1125 75.1125C74.2708 75.9542 73.2188 76.375 71.9563 76.375Z' fill='white'/%3E%3C/svg%3E%0A");
}
.contact ul li:nth-child(2)::before {
    background-image: url("data:image/svg+xml,%3Csvg width='77' height='77' viewBox='0 0 77 77' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M71.9563 76.375C63.1889 76.375 54.5267 74.4637 45.9698 70.6412C37.4128 66.8186 29.6274 61.4004 22.6135 54.3865C15.5997 47.3726 10.1814 39.5872 6.35885 31.0302C2.53629 22.4733 0.625 13.8111 0.625 5.04375C0.625 3.78125 1.04583 2.72917 1.8875 1.8875C2.72917 1.04583 3.78125 0.625 5.04375 0.625H22.0875C23.0694 0.625 23.9462 0.95816 24.7177 1.62448C25.4892 2.2908 25.9451 3.07986 26.0854 3.99167L28.8208 18.7208C28.9611 19.8431 28.926 20.7899 28.7156 21.5615C28.5052 22.333 28.1194 22.9993 27.5583 23.5604L17.3531 33.8708C18.7559 36.466 20.4217 38.9734 22.3505 41.3932C24.2793 43.813 26.401 46.1451 28.7156 48.3896C30.8899 50.5639 33.1694 52.5804 35.5542 54.4391C37.9389 56.2977 40.4639 57.9986 43.1292 59.5417L53.0188 49.6521C53.65 49.0208 54.4741 48.5474 55.4911 48.2318C56.5082 47.9161 57.5076 47.8285 58.4896 47.9688L73.0083 50.9146C73.9903 51.1951 74.7969 51.7036 75.4281 52.4401C76.0594 53.1766 76.375 54.0007 76.375 54.9125V71.9563C76.375 73.2188 75.9542 74.2708 75.1125 75.1125C74.2708 75.9542 73.2188 76.375 71.9563 76.375Z' fill='black'/%3E%3C/svg%3E%0A");
}
.contact ul li:nth-child(3) i {
    background-image: url("data:image/svg+xml,%3Csvg width='98' height='96' viewBox='0 0 98 96' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M48.854 0C21.839 0 0 22 0 49.217C0 70.973 13.993 89.389 33.405 95.907C35.832 96.397 36.721 94.848 36.721 93.545C36.721 92.404 36.641 88.493 36.641 84.418C23.051 87.352 20.221 78.551 20.221 78.551C18.037 72.847 14.801 71.381 14.801 71.381C10.353 68.366 15.125 68.366 15.125 68.366C20.059 68.692 22.648 73.418 22.648 73.418C27.015 80.914 34.052 78.796 36.883 77.492C37.287 74.314 38.582 72.114 39.957 70.892C29.118 69.751 17.714 65.514 17.714 46.609C17.714 41.231 19.654 36.831 22.728 33.409C22.243 32.187 20.544 27.134 23.214 20.371C23.214 20.371 27.339 19.067 36.64 25.423C40.6221 24.3457 44.7288 23.7976 48.854 23.793C52.979 23.793 57.184 24.364 61.067 25.423C70.369 19.067 74.494 20.371 74.494 20.371C77.164 27.134 75.464 32.187 74.979 33.409C78.134 36.831 79.994 41.231 79.994 46.609C79.994 65.514 68.59 69.669 57.67 70.892C59.45 72.44 60.986 75.373 60.986 80.018C60.986 86.618 60.906 91.915 60.906 93.544C60.906 94.848 61.796 96.397 64.222 95.908C83.634 89.388 97.627 70.973 97.627 49.217C97.707 22 75.788 0 48.854 0Z' fill='white'/%3E%3C/svg%3E%0A");
}
.contact ul li:nth-child(3)::before  {
    background-image: url("data:image/svg+xml,%3Csvg width='98' height='96' viewBox='0 0 98 96' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M48.854 0C21.839 0 0 22 0 49.217C0 70.973 13.993 89.389 33.405 95.907C35.832 96.397 36.721 94.848 36.721 93.545C36.721 92.404 36.641 88.493 36.641 84.418C23.051 87.352 20.221 78.551 20.221 78.551C18.037 72.847 14.801 71.381 14.801 71.381C10.353 68.366 15.125 68.366 15.125 68.366C20.059 68.692 22.648 73.418 22.648 73.418C27.015 80.914 34.052 78.796 36.883 77.492C37.287 74.314 38.582 72.114 39.957 70.892C29.118 69.751 17.714 65.514 17.714 46.609C17.714 41.231 19.654 36.831 22.728 33.409C22.243 32.187 20.544 27.134 23.214 20.371C23.214 20.371 27.339 19.067 36.64 25.423C40.6221 24.3457 44.7288 23.7976 48.854 23.793C52.979 23.793 57.184 24.364 61.067 25.423C70.369 19.067 74.494 20.371 74.494 20.371C77.164 27.134 75.464 32.187 74.979 33.409C78.134 36.831 79.994 41.231 79.994 46.609C79.994 65.514 68.59 69.669 57.67 70.892C59.45 72.44 60.986 75.373 60.986 80.018C60.986 86.618 60.906 91.915 60.906 93.544C60.906 94.848 61.796 96.397 64.222 95.908C83.634 89.388 97.627 70.973 97.627 49.217C97.707 22 75.788 0 48.854 0Z' fill='black'/%3E%3C/svg%3E%0A");
}
/* .contact ul li::after {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 241px;
    content: "";
    width: 1px;
    background-color: rgba(255,255,255,0.4);
    content: "";
} */
.contact ul li::before {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center center;
    content: "";
    transform: rotateY(90deg);
    transition: 0.5s linear;
}
.contact ul li:hover:before {
    transform: rotateY(0deg);
}
.contact ul li:last-child:after {
    display: none;
}
.contact .pr {
    padding: 34px 0 0 40px;
    color: #fff;
}
.contact .pr .top h2 {
    font-size: 46px;
    margin-bottom: 15px;
}
.contact .pr .top p {
    font-size: 26px;
}
.contact .pr .btm {
    margin-top: 60px;
    line-height: 1.5;
}
.contact .pr .btm span {
    display: block;
    font-size: 20px;
}
.contact .pr .btm strong {
    font-size: 18px;
    color: #6a6a6a;
    margin-top: 12px;
    display: block;
}
.contact .btm_tit {
    position: absolute;
    right: 13.5%;
    bottom: 2.5%;
    font-size: 52px;
    line-height: 60px;
    font-weight: 400;
    font-style: italic;
    color: #919191;
}
/*.contact .tit .move_txt { 
    color: rgb(255 255 255 / 60%);
    width: 10000px; 
    white-space:nowrap; 
    animation:rolling; 
    animation-duration:30s; 
    animation-timing-function:linear; 
    animation-iteration-count:infinite; 
    animation-fill-mode: forwards;
}
*/

@keyframes rolling {
0% { transform:translate(0, 0) }
100% { transform:translate(-3000px, 0) } /* 글자가 움직여서 처음과 동일한 위치가 되는 값 (동일한 문장을 여러번 쓰기 때문에 3-4번째 문장이 다시 시작하는 위치로 하면 됨) */

}

