/*메인 비쥬얼*/
.main_visual{background:#000; overflow:hidden;}
.background{position:relative;}
.background img{position:absolute;}
.background img:nth-child(1){right:0;}
.background .ani_svg{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
.background .ani_svg svg{fill: #FF5454; filter: blur(58.016998291015625px); animation: floatMove 5s ease-in-out infinite alternate;}
.main_intro span em{font-weight:700;}
.floating_g { animation: floatMove 4s ease-in-out infinite alternate; transform-origin: center; }
@keyframes floatMove {
  0% { transform: translate(0px, 0px); }
  25% { transform: translate(40px, 0px); } 
  50% { transform: translate(40px, 40px); }
  75% { transform: translate(0px, 40px); } 
  100% { transform: translate(0px, 0px); } 
}

/*공통*/
section h3{font-size:48px; font-weight:700; line-height:120%; letter-spacing:-0.96px;}
.tab_wrap{margin:64px 0 56px 0 ;}
.tab_wrap ul{display:flex; gap:16px;}
.tab_wrap ul li{padding:16px; font-size:22px; line-height:120%; letter-spacing:-1.1px; cursor: pointer;}
.tab_wrap ul li.on{border-bottom: 4px solid #000;}

/*여백*/
.kiwoom_group_wrap, .partnership_ask_wrap, .location_wrap{padding:120px 150px; box-sizing: border-box;}
.company_intro_wrap{padding:114px 150px; box-sizing:border-box;}
.company_history_wrap{padding:58px 150px; box-sizing: border-box;}

/*걸어온길 - 연혁*/
.company_history{background:#f6f7f9;  }
.history_tab_wrap{margin:36px 0;}
.history_tab_wrap ul li{padding:16px 0;}
.history_tab_wrap ul{gap:64px;}
.history_tab{display:none; gap:70px;}
.history_tab.current{display:flex; justify-content:space-between;}
.history_bg{width:252px; height:200px; background:#000; padding:24px 0 0 32px; box-sizing:border-box; position:relative;}
.history_bg > span{font-size:48px; font-weight:700; letter-spacing:-2.4px; line-height:110%; color:#f6f7f9;}
.history_bg::before{content:''; border: 1px solid #000; display:block; width:100%; height:100%; position:absolute; right:0; bottom:0; animation: move 1.5s forwards;}
.history_list{padding-top:18px; width:635px;}
.history_list ul li{margin-bottom:36px;}
.history_list ul li .year_box{display:flex; gap:10px; font-size:24px; font-weight:400; line-height:140%; letter-spacing:-1.2px;}
.history_list ul li .year_box p{width:465px; margin-left:20px;}
.history_list ul li .year_box .year{width:55px;}
.history_list ul li .year_box .month{width:30px;}
.history_list ul li .year_box{margin-top:8px;}
.history_list ul li .year_box:nth-child(1){margin-top:0;}
@keyframes move {
  100% { transform: translate(25px, 25px); }
}

/*회사개요*/
.company_intro_wrap > span{font-size:22px; font-weight:400; line-height:120%; letter-spacing:-1.1px;}
.company_intro_wrap > ul{margin:16px 0 170px 0; display:flex; gap:54px;}
.company_intro_wrap > ul li{width:33.33%;}
.company_intro_wrap > ul li span{font-size:22px; line-height:120%; letter-spacing:-1.1px; display:block;}
.company_intro_wrap > ul li b{font-size:48px; font-weight:700; line-height:110%; letter-spacing:-2.4px;}
.ceo_comment_wrap > span{font-size:22px; font-weight:400; line-height:120%; letter-spacing:-1.1px;}
.ceo_comment{margin-top:16px; display:flex; gap:0; flex-direction:column; padding-left:8px;}
.ceo_comment p{width:100%; font-size:22px; font-weight:400; line-height:140%; letter-spacing:-1.3px;}
.ceo_comment p em{font-weight:700; margin-bottom:5px; display:inline-block;}

/*제휴문의*/
.kiwoom_group_wrap > p{font-size:32px; font-weight:500; line-height:120%; letter-spacing:-0.64px; margin-top:16px;}
.partnership_ask{background:#f6f7f9;}
.partnership_ask_wrap p{font-size:32px; font-weight:500; line-height:120%; letter-spacing:-0.64px; margin-top:16px;}
.partnership_ask_wrap ul{margin-top:64px; display:flex; gap:32px;}
.partnership_ask_wrap ul li{width:33.33%;}
.partnership_ask_wrap ul li .ask_box{border-radius: 16px; background: #FFF; box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.02), 0px 6px 12px 0px rgba(0, 0, 0, 0.03); padding:32px;}
.partnership_ask_wrap ul li .ask_box h4{font-size:16px; font-weight:600; line-height:150%; letter-spacing:-0.08px;}
.partnership_ask_wrap ul li .ask_box span{font-size:16px; font-weight:500; line-height:140%; letter-spacing:-0.08px;}

/*다우키움그룹 그룹사*/
.group_tab{display:none;}
.group_tab.current{display:block;}
.group_list ul{display:grid; grid-template-columns: repeat(4, 1fr); column-gap: 32px; row-gap: 0}
.group_list ul li{position:relative; overflow:hidden; width:255px; height:223px;}
.group_list ul li img{position:absolute; top:-15%; width:100%;}
.group_list ul li span{position:absolute; left:50%; transform: translateX(-50%); text-align:center; bottom:25%; line-height:24px; color:#666666; font-weight:300; display:block; width:100%; font-size:16px;}
.group_list ul li.last span{bottom:36%;}
.group_list ul li em{position:absolute; left:50%; transform: translateX(-50%); bottom:5%; font-size:56px;}
.group_list ul li em.kospi{color:#FF5454;}
.group_list ul li em.kosdaq{color:#1F8ADC;}
.kiwoom_group .tab_wrap ul li.on::after{content:' >';}
.stock_legend{display:flex; justify-content:center; gap:20px; margin-top:20px; position:relative; left:56%; transform:translateX(-50%);}
.stock_legend span{position:relative; padding-left:36px; font-size:16px; color:#535862;}
.stock_legend span::before{content:'ㆍ'; position:absolute; left:0; top:55%; transform:translateY(-50%); font-size:56px;}
.stock_legend span.kospi::before{color:#ff5454;}
.stock_legend span.kosdaq::before{color:#1f8adc;}

/*오시는길*/
.location_wrap{display:flex; gap:50px;}
.location_wrap .location_intro{width:60%; display:flex; flex-direction:column; justify-content:center; gap:16px;}
.location_wrap .location_intro p{font-size:20px; font-weight:500; line-height:145%; letter-spacing:-0.1px;}

@media ( max-width: 1200px){
  .group_list ul{grid-template-columns: repeat(3, 1fr); column-gap:0;}
}

@media ( max-width: 1024px) {
  section h3{font-size:6vw;}
  .flex{display:flex; flex-direction: column-reverse;}
  .main_visual{height:750px;}
  .side_menu_wrap{display:none !important;}
  .main_intro h1{letter-spacing:-2.16px;}
  .company_intro_wrap{padding:14.25vw 6.25vw;}
  .company_history_wrap{padding:6vw 6.25vw;}
  .kiwoom_group_wrap, .partnership_ask_wrap, .location_wrap{padding:12vw 4vw;}
  .company_intro_wrap > span{font-size:2.25vw;}
  .company_intro_wrap > ul li{width:30%;}
  .company_intro_wrap > ul li span{font-size:2.25vw; line-height:145%; margin-bottom:0.5vw; letter-spacing:-0.9px;}
  .company_intro_wrap > ul li b{font-size:4vw; letter-spacing:-1.6px;}
  .company_intro_wrap > ul{gap:0; margin-bottom:8vw;}
  .ceo_comment_wrap > span{font-size:2.25vw;}
  .ceo_comment_wrap .ceo_comment{display:flex; flex-direction:column; gap:0; padding-left:1vw;}
  .ceo_comment_wrap .ceo_comment p{width:100%; font-size:2.75vw;}
  .main_intro{bottom:8.75vw;}
  .tab_wrap ul li{font-size:2.25vw;}
  .group_list ul{grid-template-columns: repeat(3, 1fr); column-gap:0;}
  .group_list ul li{width:100%; height:24.375vw;}
  .group_list ul li img{top:-25%;}
  .group_list ul li em{bottom:0;}
  .group_list ul li.last span{bottom:42%;}
  .stock_legend{position: initial; transform:initial;}
  .history_bg{width:21.25vw; height:13.375vw; padding:1vw 0 0 2.5vw;}
  .history_bg > span{font-size:4vw;}
  .history_bg::before{animation: move 1s forwards;}
  @keyframes move {100% { transform: translate(1.25vw, 1.25vw); }}
  .history_list{padding-top:0;}
  .history_list ul li .year_box{font-size:2.5vw;}
  .history_list ul li .year_box .year{width:6.875vw;}
  .history_list ul li .year_box .month{width:3.75vw;}
  .history_list ul li .year_box p{width:50vw;}
  .history_tab{gap:3.75vw;}
  .kiwoom_group_wrap > p{font-size:3.5vw;}
  .tab_wrap{margin:6vw 0;}
  .partnership_ask_wrap p{font-size:3.5vw;}
  .partnership_ask_wrap ul li .ask_box{padding:3vw;}
  .location_wrap{padding:12vw 4vw 3vw; flex-direction:column;}
  .location_wrap .location_intro, .root_daum_roughmap{width:100% !important;}
}

@media ( max-width: 605px) {
  section h3{font-size:6.75vw; font-weight:600; letter-spacing:-0.56px;}
  .main_visual{height:133.33vw;}
  .main_intro h1{letter-spacing:-1.32px;}
  .background .ani_svg svg{width:53.33vw; height:53.33vw; filter:blur(40px);}
  .company_intro_wrap > span{font-size:4vw;}
  .company_intro_wrap > ul li span{font-size:4vw; letter-spacing:-0.75px;}
  .company_intro_wrap > ul li{width:33%;}
  .company_intro_wrap > ul li b{font-size:5.7vw; letter-spacing:-1.1px;}
  .ceo_comment_wrap > span{font-size:4vw;}
  .ceo_comment_wrap .ceo_comment p{font-size:4vw; letter-spacing:-0.75px;}
  .company_intro_wrap{padding:12.27vw 6.4vw;}
  .company_history_wrap{padding:10.67vw 5.87vw;}
  .history_tab{flex-direction:column; gap:6.5vw;}
  .tab_wrap{margin:3vw 0;}
  .history_tab_wrap ul{gap:9.87vw;}
  .history_tab_wrap ul li{font-size:4.2vw; padding:4.27vw 0; letter-spacing:-0.75px; width:33%; text-align:center;}
  .history_list{width:100%;}
  .history_list ul{padding-left:0;}
  .history_list ul li{margin-bottom:10.5vw;}
  .history_list ul li .year_box{font-size:4.33vw; display:inline-block; margin-top:4.3vw;}
  .history_list ul li .year_box .year{width:10vw; display:inline-block;}
  .history_list ul li .year_box p{width:100%; margin-left:0; margin-top:1vw;}
  .history_bg{padding:3.47vw 0 3.47vw 4.53vw; width:100%;}
  .history_bg > span{font-size:4.87vw;}
  .history_bg::before{display:none;}
  .kiwoom_group_wrap{padding:10.67vw 6.4vw;}
  .kiwoom_group_wrap > p{font-size:4vw; letter-spacing:-0.3px; line-height:150%; margin-top:3.2vw;}
  .kiwoom_group .tab_wrap ul{display:grid; grid-template-columns: repeat(2, 1fr); gap:0;}
  .kiwoom_group .tab_wrap ul li{width:100%; height:10.67vw; line-height:10.67vw; padding:0; font-size:3.5vw; text-align:center; border:1px solid #000;}
  .kiwoom_group .tab_wrap ul li:nth-child(1), .kiwoom_group .tab_wrap ul li:nth-child(3){border-right:0;}
  .kiwoom_group .tab_wrap ul li:nth-child(1), .kiwoom_group .tab_wrap ul li:nth-child(2){border-bottom:0;}
  .kiwoom_group .tab_wrap ul li.on{background:#000; color:#fff; border-bottom:1px solid #000;}
  .group_list ul{grid-template-columns: repeat(1, 1fr); column-gap:4.27vw;}
  .group_list ul li{width:60%; height:41.66vw; padding:0; position:relative; overflow:hidden; left:50%; transform:translateX(-50%);}
  .group_list ul li img{position:absolute; top:-20%;}
  .group_list ul li span{font-size:3.61vw; line-height:6.67vw; bottom:15%;}
  .group_list ul li em{font-size:15.56vw; bottom:-12%;}
  .group_list ul li.last span{bottom:40%;}
  .stock_legend{gap:5.56vw; margin-top:5.56vw;}
  .stock_legend span{padding-left:10vw; font-size:4.44vw;}
  .stock_legend span::before{font-size:15.56vw;}
  .partnership_ask_wrap{padding:10.67vw 6.4vw;}
  .partnership_ask_wrap p{font-size:4vw; line-height:150%; margin-top:3.2vw;}
  .partnership_ask_wrap ul{margin-top:12.8vw; flex-direction:column; gap:3.2vw;}
  .partnership_ask_wrap ul li{width:100%;}
  .partnership_ask_wrap ul li .ask_box{padding:6.53vw;}
  .location_wrap{padding:0; gap:0;}
  .location_wrap .location_intro{padding:10.67vw 6.4vw 12.8vw; width:auto !important;}
  .location_wrap .location_intro p{font-size:4.8vw;}
  .root_daum_roughmap_landing{width:100% !important; padding:0 6.4vw 6.4vw; box-sizing: border-box;}
}