/* 공통 버튼 */
a.more_btn { display: inline-block; padding-right: 32px; padding-bottom: 7.5px; position: relative; font-family: Pretendard; font-size: 18px; font-weight: normal; font-style: normal; line-height: 1.33; letter-spacing: normal; text-align: left; color: #1a1818; } 
a.more_btn .arrow_icon { position: absolute; width: 17px; height: 11px; right: 0px; top: 6px; overflow: hidden; } 
a.more_btn .arrow_icon::after { display: block; content: ""; position: absolute; background: url(../img/icon/icon_arrow1.png); background-repeat: no-repeat; background-size: cover; width: 17px; height: 11px; } 
a.more_btn .arrow_icon::before { display: block; content: ""; position: absolute; left: -40px; background: url(../img/icon/icon_arrow1.png); background-repeat: no-repeat; background-size: cover; width: 17px; height: 11px; } 
a.more_btn:hover .arrow_icon::after { transform: translateX(100px); transition: 0.4s all; } 
a.more_btn:hover .arrow_icon::before { transform: translateX(40px); transition: 0.4s all; } 
a.more_btn { border-bottom: 1px solid var(--color_line1); } 
/* font class */
.eng_txt { font-family: "Jost", Sans-serif; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none } 


/* 메인 비주얼 */
main .main_wrap { padding-top: 150px; } 
.main_vis.vis_01 { height: calc(100vh - 150px); overflow: hidden; width: 100%;} 
.main_vis.vis_01 .welcome_txt { z-index: 10; display: flex; flex-direction: column; gap: 10px; background: transparent; color: white; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); max-width: 1100px; width:100%; pointer-events: none; } 
.main_vis.vis_01 .welcome_txt .eng_txt { display: block; padding-top: 31px; padding-bottom: 31px; font-size: 120px; font-weight: 300; font-stretch: normal; font-style: normal; line-height: 0.92; letter-spacing: normal; text-align: center; color: #fff; display: flex; justify-content: center; align-items: center; } 
.main_vis.vis_01 .welcome_txt .kr_txt { font-family: Pretendard; font-size: 24px; font-weight: 500; font-stretch: normal; font-style: normal; line-height: 1.5; letter-spacing: normal; text-align: center; color: #fff; display: block; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none } 
.main_vis.vis_01 .welcome_txt .kr_txt .mob_block { color: white; font-size: 24px; } 
.main_vis.vis_01 .main_visual { position: relative; width: 100%; height: 100vh; overflow: hidden; -webkit-animation: introBg 0.7s 1s both; animation: introBg 0.7s 1s both; animation-iteration-count:1; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 
.main_vis.vis_01 .main_visual .swiper-slide { width: 100%; height: 100%; } 
.main_vis.vis_01 .main_visual .swiper-slide a{display:block;width:100%;height:100%;}
.main_vis.vis_01 .main_visual .swiper-slide.slide1 { background: url("../img/mainVis_01.png") no-repeat 50% 50%; background-size: cover; } 
.main_vis.vis_01 .main_visual .swiper-slide.slide2 { background: url("../img/mainVis_02_2.jpg") no-repeat 50% 50%; background-size: cover; } 
.main_vis.vis_01 .main_visual .swiper-slide.slide3 { background: url("../img/mainVis_03.png") no-repeat 50% 50%; background-size: cover; } 

.main_vis.vis_02 { text-align: center; } 
.main_vis.vis_02 .pass_txt { text-align: center; font-size: 40px; font-weight: 600; margin-bottom: 40px; display: block; padding-top: 160px; font-style: normal; line-height: 1.45; letter-spacing: -0.4px; text-align: center; color: #111; } 
.main_vis.vis_02 .pass_txt .fc_red { font-size: inherit; font-weight: inherit; } 

.main_vis.vis_02 .marquee_wrap { display: flex; height: 173px; align-items: center; overflow: hidden; max-width: 100%; } 
.main_vis.vis_02 .marquee { animation-name: marquee; animation-duration: 10s; animation-iteration-count: infinite; animation-timing-function: linear; transform: translateX(-100%); padding-right: 50px; position: relative; font-family: "Jost", Sans-serif; font-size: 120px; font-weight: 300; white-space: nowrap; font-stretch: normal; font-style: normal; line-height: 1.08; letter-spacing: normal; text-align: center; color: #111; } 
.main_vis.vis_02 .marquee::after { width: 10px; height: 10px; content: ""; display: block; top: 50%; transform: translateY(-50%); right: 20px; position: absolute; background: #111; } 

@keyframes marquee { 
 0% { transform: translateX(0); } 
 100% { transform: translateX(-100%); } 
 }

.main_vis.vis_03 { width: 100%; } 
.main_vis.vis_03 .inner { padding-top: 180px; max-width: 1920px; margin: 0 auto; padding-left: 60px; } 
.main_vis.vis_03 .inner .main_small_tit { margin-bottom: 30px; font-family: Pretendard; font-size: 40px; font-weight: 600; font-stretch: normal; font-style: normal; line-height: 1.45; letter-spacing: -0.4px; text-align: left; color: #111; } 

.main_vis.vis_04 { max-width: 1920px; margin: 0 auto; } 
.main_vis.vis_04 .inner { display: flex; padding: 0 60px; gap: 30px; justify-content: space-between; padding-top: 180px; padding-bottom: 180px; } 
.main_vis.vis_04 .inner .notice_left { width: 50%; } 
.main_vis.vis_04 .inner .notice_left h3 { font-family: Pretendard; font-size: 40px; font-weight: 600; word-break: keep-all; font-stretch: normal; font-style: normal; line-height: 1.45; letter-spacing: -0.4px; text-align: left; color: #111; } 
.main_vis.vis_04 .inner .notice_left a.more_btn { margin-top: 20px; } 
.main_vis.vis_04 .inner .notice_right { width: 50%; } 
.main_vis.vis_04 .inner .notice_right ul { } 
.main_vis.vis_04 .inner .notice_right ul li { padding-top: 31px; padding-bottom: 28px; border-bottom: 1px solid #e4e4e4; } 
.main_vis.vis_04 .inner .notice_right ul li:first-of-type { border-top: 1px solid #e4e4e4; } 
.main_vis.vis_04 .inner .notice_right ul li a { display: inline-block; width: 100%; display: flex; gap: 10px; flex-direction: column; } 
.main_vis.vis_04 .inner .notice_right ul li .notice_tit { font-family: Pretendard; font-size: 24px; font-weight: 600; color: var(--color_typo1); } 
.main_vis.vis_04 .inner .notice_right ul li .notice_date { font-size: 18px; color: var(--color_typo2); } 

.content--sticky { width: 440px !important; position: sticky; top: 0; --offset: 0px; top: var(--offset); height: 620px !important; } 
.content--sticky img { object-fit: cover; width: 100%; height: 100%; } 
.content--card { display: flex; flex-direction: column; max-width: 500px; aspect-ratio: 0.8; top: 25vh; margin: auto; border-radius: 14px; gap: 3vh; text-align: center; margin-bottom: 5vh; padding: 0px; } 

.main_vis.vis_05 .main_video_wrap { position: relative; width: 100%; height: 0; padding-top: 56.25%; } 
.main_vis.vis_05 .main_video_wrap video { position: absolute; width: 100%; height: 100%; top: 0; left: 0; } 
.main_vis.vis_05 .main_video_wrap iframe { position: absolute; width: 100%; height: 100%; top: 0; left: 0; } 

/* 따라다니는 메뉴 */
#floater { position:fixed; right:20px; bottom:153px; z-index:27; } 
#floater_call { position:fixed; right:20px; bottom:225px; z-index:27; } 
#floater_call a.call_center { display:none; width:64px; height:64px; background: url("../img/icon/icon_floating2.png") no-repeat center / cover; box-shadow:2px 2px 2px #00000020; border-radius:40px; } 
#floater_call a.call_center.on { display: block; } 
#floater_call a.close_btn { display: none; width:64px; height:64px; background:#111 url("../img/icon/icon_close_white.svg") center no-repeat; border-radius:40px; } 
#floater_call a.call_center:focus-visible {outline-color: white; outline-offset: -3px;}
#floater_call a.close_btn:focus-visible {outline-color: white;}
#floater_call a.chat_btn:focus-visible {outline: 3px dotted white; outline-offset: -3px;}
#floater_call a.close_btn.on { display: block; } 
#floater_call a.close_btn:focus {outline: 3px dotted white;}
#floater a:focus-visible { outline:3px dotted white; outline-offset:-2px; }
#floater_call .floater_wrap .floater_con { height: 142px; overflow-y: hidden; } 
/* #floater.has_go_top { bottom: 153px; transition: 0.3s all; } */
#floater a { display:none; width:64px; height:64px; background:#111 url("../img/icon/icon_floating.png") center no-repeat; box-shadow:2px 2px 2px #00000020; border-radius:40px; } 
#floater a.on { display: block; } 
#floater .floater_con:focus  { outline:3px dotted black; outline-offset:-2px; }
#floater a.close_btn { background:#111 url("../img/icon/icon_close_white.svg") center no-repeat; } 
#floater a:focus-visible { outline:3px dotted white; outline-offset:-2px; } 
.floater_wrap { display:none; position:absolute; bottom:70px; right:0; z-index:100; width:400px; background-color:#fff; border:1px solid #ddd; box-shadow:3px 3px 3px #00000020; border-radius:15px; } 
.floater_wrap.on { display:block; } 
.floater_wrap .btn_area button:disabled { background: #ddd; cursor: default; pointer-events: none; color: black !important; } 

.floater_wrap .floater_con { padding:20px 20px 50px; height:530px; overflow:hidden; overflow-y: auto; } 
.floater_wrap .floater_con > div { margin-bottom:15px; } 
.floater_wrap .floater_top { padding:20px; width:100%; border-bottom:1px solid #f2f2f2; } 
.floater_wrap .floater_logo { width:40px; height:40px; flex-shrink: 0; } 
.floater_wrap .floater_q { display: flex; gap:10px; padding-right:30px; } 
.floater_wrap .bloom_area { padding:15px; border-radius:20px; font-size: 15px; background-color:#f5f6f6; } 
.btn_area { margin-top:10px; display: flex; justify-content: end; gap:5px; } 
.btn_area button { padding:10px 14px; background-color:#fff; border:1px solid #e4e4e4; border-radius: 12px; } 
.btn_area button:hover,
.btn_area button.on { background-color:#ee4141; color:#fff; } 
.floater_wrap .floater_con  div.answer_area { display: flex; justify-content: end; margin-bottom:10px; } 
.floater_wrap .floater_con  div.answer_area .floater_a { border:1px solid #e4e4e4; border-radius:10px; padding:15px; display:inline-block; cursor: pointer;text-align: left; } 
.floater_wrap .floater_con div.answer_area .floater_a.on,
.floater_wrap .floater_con  div.answer_area .floater_a:hover,
.floater_wrap .floater_con  div.answer_area .floater_a:focus { background-color:#ee4141; color:#fff; } 
.floater_wrap .floater_con  div.answer_area .floater_a.disabled {background: #ddd; cursor: default; pointer-events: none; color: black !important;}
.floater_wrap .floater_con  div.answer_area .floater_a:focus-visible { outline:3px dotted red; outline-offset:-2px; }
.floater_wrap .floater_con  div.answer_area .floater_a.disabled {pointer-events: none;}
.floater_wrap .floater_con  div.answer_area .floater_a.disabled:focus-visible { outline: none; }
.chatSwiper_wrap {position: relative;}
.chatSwiper {overflow: hidden;}
.chatSwiper .btn_area {margin-bottom: 10px; height: 51px;}
.chatSwiper .swiper-slide {display: flex; flex-wrap: wrap; justify-content: flex-end; flex-direction: column;}
.chatSwiper {position: relative;}
.chatSwiper_wrap .swiper-button-next:after, .chatSwiper_wrap .swiper-button-prev:after {color: #666; font-size: 12px;}
.chatSwiper_wrap .swiper-button-next {bottom: -36px; top: auto;border: 1px solid #ddd; width: 44px; height: 36px; border-radius: 10px; margin-left: 2px;}
.chatSwiper_wrap .swiper-notification {display: none;}
.chatSwiper_wrap .swiper-button-prev {left: auto; right: 80px; border: 1px solid #ddd;bottom: -36px; top: auto; width: 44px; height: 36px; border-radius: 10px;margin-right: 2px;}
/* 반응형 시작 */
@media screen and (max-width:768px) { /* 공통 */
 .mob_block { display: block; } 
 a.more_btn { font-size: 14px !important; padding-bottom: 2.5px; padding-right: 24px; } 
 a.more_btn .arrow_icon::after { width: 13px; height: 12px; background-size: 100%; } 
 a.more_btn .arrow_icon::before { width: 13px; height: 12px; background-size: 100%; } 
 .chatSwiper .btn_area {height: 48px;}
 /* 메인 비주얼 */
 .main_vis.vis_01 .main_visual .swiper-slide.slide1 { background: url("../img/mainVIsMob_01.png") no-repeat center / cover; } 
 .main_vis.vis_01 .main_visual .swiper-slide.slide2 { background: url("../img/mainVIsMob_02.png") no-repeat center / cover; } 
 .main_vis.vis_01 .main_visual .swiper-slide.slide3 { background: url("../img/mainVIsMob_03.png") no-repeat center / cover; } 
 .main_vis.vis_01 .welcome_txt .eng_txt { font-size: 48px; } 
 .main_vis.vis_01 .welcome_txt .kr_txt { font-size: 18px; } 
 
 .main_vis.vis_01 .welcome_txt .kr_txt .mob_block { font-size: 18px; } 

 .main_vis.vis_02 .pass_txt { font-size: 24px; word-break: keep-all; max-width: 240px; margin: 0px auto 40px; max-width: 300px; } 
 .main_vis.vis_02 .marquee_wrap { height: 73px; } 
 .main_vis.vis_02 .marquee { font-size: 50px; } 
 .main_vis.vis_02 .marquee::after { width: 5px; height: 5px; } 
 .main_vis.vis_02 .content--card { max-width : calc(100% - 20px) !important; width: 100%; margin-bottom: 20px; } 
 .main_vis.vis_02 .content--sticky { height: auto !important; } 
 .main_vis.vis_02 .pass_txt {padding-top: 60px;}

 .main_vis.vis_03 .inner { padding-left: 24px; padding-top: 80px; } 
 .main_vis.vis_03 .inner .main_small_tit { font-size: 24px; } 

 .main_vis.vis_03 .inner .main_small_tit { margin-bottom: 20px; } 
 
 .main_vis.vis_04 .inner { padding: 80px 24px; flex-direction: column; } 
 .main_vis.vis_04 .inner .notice_left { width: 100%; } 
 .main_vis.vis_04 .inner .notice_left h3 { font-size: 24px; } 
 .main_vis.vis_04 .inner .notice_right { width: 100%; } 
 .main_vis.vis_04 .inner .notice_right ul li { padding-top: 20px; padding-bottom: 20px; } 
 .main_vis.vis_04 .inner .notice_right ul li a { gap: 4px; } 

 .main_vis.vis_04 .inner .notice_right ul li .notice_tit { display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; font-size: 16px; margin-top: 1.8px; } 
 .main_vis.vis_04 .inner .notice_right ul li .notice_date { font-size: 14px; } 

 #floater { right: 8px; bottom: 137px; } 
 #floater_call { right: 8px; bottom: 183px; z-index: 100; } 
 #floater .floater_con { font-size: 14px; } 
 #floater .floater_wrap { position: fixed; left: 0px; right:0px; top: 0px; bottom: 0px; width: 100%; border-radius: 0; } 
 .floater_wrap .floater_to { padding: 15px 20px; font-weight: 600; } 
 .floater_wrap .floater_con > div { margin-bottom: 30px; } 
 #floater a { width: 40px; height: 40px; background-size: 20px; } 
 #floater_call a { width: 40px !important; height: 40px !important; background-size: 20px; } 
 .floater_wrap .floater_con { height: calc(100dvh - 62px); overflow-y: auto; overflow-x: hidden; } 
 .floater_wrap .bloom_area { padding: 12px 15px; } 
 .floater_wrap .floater_con > div.answer_area .floater_a { padding: 12px; } 
 #floater a.close_btn { background-size: 12px; width: 30px; height: 30px; } 
 #floater a.close_btn.on { position: fixed; z-index: 1000; top: 16px; right: 16px; } 
 #floater_call a.close_btn { background-size: 12px; width: 30px; height: 30px; } 
 #floater_call a.close_btn.on { position: fixed; right: 0px; bottom: 150px; z-index: 101; right: 9px; bottom: 6px; z-index: 101; } 
 #floater_call .floater_wrap .floater_con { height: 150px; } 
 #floater_call .floater_wrap { width: 100%; position: fixed; bottom: 0px; border-radius: 15px 15px 0 0; } 
 #floater_call .floater_wrap .bloom_area { font-size: 13px; } 
 .floater_wrap .floater_top { } 
 }

 
.floater_wrap .floater_con div.answer_area {margin-left: auto; max-width: calc(100% - 50px);}