@charset "utf-8";

.br480,
.br350 {display: none;}

.gate_wrap {width: 100%;height: calc(var(--vh, 1vh) * 100);position: relative;overflow: hidden;color: #fff;}
.gate_logo {position: absolute;top: 5%;left: 5%;z-index: 1;}
.sns_wrap {position: absolute;top: 5%;right: 5%;z-index: 1;display: flex;gap: 2rem;}

.gateSlider {width: 100%;height: 100vh;}
.gate_bg .slide01 {background: url('../img/gate_bg.png') no-repeat center / cover;}
.gate_bg .slide02 {background: url('../img/gate_bg02.png') no-repeat center / cover;}

.gate_center {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%); width: 95%;font-family: 'joly';text-align: left;z-index: 1;display: flex;justify-content: center;align-items: center;}
.gate_center .title {min-width: 410px;}
.gate_center h1 {font-size: 7.2rem;line-height: 8.4rem;letter-spacing: 0.3rem;}
.gate_center p {font-size: 2.2rem;line-height: 3.6rem;letter-spacing: 0.1rem;margin-top: 3.2rem;}

.gate_center .contents {margin-left: calc(23% - 150px);display: flex;align-items: center;gap: 4rem;}

.gate_center .contents > div {position: relative;overflow: hidden;}
.gate_center .contents > div::after {content: '';box-shadow: 0 8px 24px rgba(100, 100, 255, 0.15);position: absolute;top: 0;left: 0;}
.gate_center .contents > div a {color: #fff;}

.gate_center .contents img {display: block; width: 100%;transition: opacity 0.5s ease;}
.gate_center .contents .img_hover {position: absolute;top: 0;left: 0;opacity: 0;transition: opacity 0.5s ease;background-color: rgba(190, 131, 114, 0.7);width: 100%;height: 100%;}


.gate_center .contents .text_box {position: absolute;bottom: 20px;left: 50%;transform: translateX(-50%);width: calc(100% - 40px);font-family: 'Pretendard';transition: 0.5s ease-in-out;}
.gate_center .contents .text_box b {font-size: 2.4rem;line-height: 3.4rem;font-weight: 600;}
.gate_center .contents .text_box span {font-size: 1.2rem;line-height: 2rem;display: block;font-weight: 400;position: relative;letter-spacing: 0.5px;}
.gate_center .contents .text_box span::after {content: '';display: inline-block;background: url('../img/icon_main_move.png') no-repeat;width: 38px;height: 9px;position: absolute;top: 50%;right: 0;transform: translateY(-50%);}

.gate_center .contents .hover_text {bottom: 220px;opacity: 0;transition: 0.4s ease-in-out;}

/* hover이벤트 */
.gate_center .contents > div:hover .img_hover {opacity: 1;}
/* .gate_center .contents > div:hover .front_text {opacity: 0;}
.gate_center .contents > div:hover .hover_text {bottom: 330px;opacity: 1;}
.gate_center .contents > div.ilsan_cont:hover .text_box {bottom: 330px;} */

.gate_footer {width: 100%;max-height: 100px;box-sizing: border-box;padding: 25px 5%;position: absolute;bottom: 0;left: 0;z-index: 1;display: flex;align-items: center;justify-content: center;}
.gate_info {font-size: 1.6rem;display: flex;align-items: flex-end;justify-content: center;width: 100%;}
.gate_info img {margin-bottom: 6px;}
.gate_info b {color: #999 !important;font-weight: 500;position: relative;padding-right: 2rem;min-width: 4rem;display: inline-block;line-height: 3rem;}
.gate_info b::after {position: absolute;top: 50%;right: 1rem;transform: translateY(-50%);content: '';width: 1px;height: 12px;background: #999;}
.gate_info b.af_none,
.gate_info b.af_none_350 {display: none;}
.gate_info b.af_none::after,
.gate_info b.af_none_350::after {display: none;}
.gate_info p {color: #999 !important;font-size: 1.4rem;}
.gate_info p + p {margin-left: 5rem;}
.info_area {display: flex;align-items: center;margin-left: 1rem;}
.no_phone {pointer-events: none;-webkit-touch-callout: none;color: #999 !important;}


@media only screen and (max-width:1024px){
    .gate_wrap {height: auto;}
    .gateSlider {height: clamp(85rem, 5vw, 93rem);min-height: 100vh;}
    .gate_logo img,
    .sns_wrap img {height: 2rem;}
    .sns_wrap {gap: 1.5rem;}

    .gate_bg {background: url('../img/gate_bg.png') no-repeat 10% 50%;}

    .gate_center {flex-direction: column;top: 16%;_bottom: calc(4% + 150px);transform: translateX(-50%);height: 60vh;justify-content: space-between;max-width: 542px;height: auto;}
    .gate_center .title {width: 91%;min-width: auto;margin-bottom: 7rem;}
    .gate_center h1 {font-size: 4.3rem;line-height: 4.8rem;}
    .gate_center p {font-size: 1.4rem;line-height: 2.4rem;margin-top: 1.25rem;}
    .gate_center .contents {margin: 0;width: 91%;justify-content: center;}
    .gate_center .img_hover {display: none;}
    .gate_center .contents .text_box b {font-size: 1.4rem;line-height: 1.7rem;}
    .gate_center .contents .text_box span {font-size: 1.1rem;line-height: 1rem;margin-top: 0.7rem;}
    .gate_center .contents .text_box span::after {background-size: contain;width: 3rem;}

    .gate_center .contents > div:hover .img_hover {opacity: 1;}
    .gate_center .contents > div:hover .front_text {opacity: 1;}
    .gate_center .contents .hover_text {display: none;}
    /* .gate_center .contents > div:hover .hover_text {bottom: 330px; opacity: 1;} */

    .gate_footer {width: 95%;max-height: none;padding: 1.8rem 3%;max-width: 542px;left: 50%;transform: translateX(-50%);bottom: 3%;}
    .gate_info {width: 100%;flex-direction: row;flex-wrap: wrap;font-size: 1.2rem;justify-content: flex-start;align-items: flex-start;}
    .info_area {display: flex;flex-wrap: wrap;align-items: center;width: calc(100% - 5rem);}

    .gate_info b {min-width: 2.5rem;line-height: initial;}
    .gate_info b::after {height: 1rem;}
    .gate_info p {font-size: 1rem;}

    .gate_info p + p {margin-left: 0;margin-top: 0.5rem;}
    .info_area p:nth-child(1), .info_area p:nth-child(2) {width: 100%;}
    .info_area p:nth-child(3), .info_area p:nth-child(4) {width: auto;margin-top: 0.5rem;}
    .info_area p:nth-child(3) {margin-right: 2rem;}
}

@media only screen and (max-width:450px){
    .br350 {display: block;}

    .gate_info b.af_none_350 {display: inline-flex;}

}

@media only screen and (max-width:320px){
    .br480 {display: block;}
    .gate_info b.af_none {display: inline-flex;}
    /* .gate_info b.af_none {display: inline-flex;} */

}