@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.root_daum_roughmap {width:100% !important; height:clamp(250px, calc( 500  / var(--inner) * 100vw ), 500px) !important;}
.root_daum_roughmap .wrap_map {height:clamp(250px, calc( 500  / var(--inner) * 100vw ), 500px) !important;}
.roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.roughmap_lebel_text:after {content:"서울 영등포구 의사당대로 1길 25"; font-size:12px; line-height:15px;}

.bullet-item .bullet-list {position:relative; padding-left:15px; margin-top:10px; line-height:1.3;}
.bullet-item .bullet-list:first-child {margin-top:0;}
.bullet-item .bullet-list::before {position:absolute; content:''; left:0; top:9px; width:3px; height: 3px; background:var(--color-primary); border-radius: 50%;}
.bullet-item .bullet-list.none {padding-left: 0;}
.bullet-item .bullet-list.none::before {display: none;}
.bulletitem2 { padding-left: 0.6em; text-indent: -0.6em;}

.blocker {z-index: 100;}
.modal {max-width:980px; width: 100%;}

.bg-gray {background:#fafafa;}
.overhidden {overflow: hidden;}
.subsec-pd {padding: clamp(50px, calc( 120 / var(--inner) * 100vw ), 120px) 0;}

.border-pt {margin-top: clamp(50px, calc( 120 / var(--inner) * 100vw ), 120px) ; padding-top: clamp(50px, calc( 120 / var(--inner) * 100vw ), 120px) ; border-top: 1px solid #ddd;}

.radiobx {display: flex; flex-wrap: wrap;}
.radiobx .item {display: flex;align-items: center; min-height: clamp(38px, calc( 44 / var(--inner) * 100vw ), 44px);}
.radiobx .item:not(:last-child) {margin-right: clamp(15px, calc( 40 / var(--inner) * 100vw ), 40px);}

.insec-box {margin-bottom: var(--padding-35);}
.insec-box .insec-tit {font-size: var(--font-size-32); font-weight: bold; letter-spacing: -0.5px;}
.insec-box .insec-dec {margin-top: var(--padding-15); font-size: var(--font-size-18); color: var(--color-body);letter-spacing: -0.03em;}

.greetinfo { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--padding-18); }
.greetinfo .card { display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; gap: var(--padding-60); padding: var(--padding-40); border: 1px solid #ddd; }
.greetinfo .card .cont { display: flex; flex-direction: column; gap: var(--padding-16); align-self: stretch; width: 100%; }
.greetinfo .card .tit { font-size: var(--font-size-18); font-weight: 600; color: var(--color-primary); letter-spacing: -0.03em; line-height: 1; }
.greetinfo .card .txt { font-size: var(--font-size-20); font-weight: 600; color: #222; letter-spacing: -0.03em; line-height: 1.3; }
.greetinfo .card .img { width: clamp(45px, calc( 56 / var(--inner) * 100vw ), 56px); flex-shrink: 0; }
.greetinfo .card .img img { width: 100%; aspect-ratio: 1; object-fit: contain; display: block; }

.greetinfo2 .greetmsg { position: relative; }
.greetinfo2 .greetmsg .thumb { width: 100%; overflow: hidden;  }
.greetinfo2 .greetmsg .thumb img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; display: block; }
.greetinfo2 .greetmsg .panel { position: relative; display: flex; flex-direction: column; gap: var(--padding-50); width: min(832px, 100%); max-width: 100%; margin-top: clamp(-170px, calc(-170 / var(--inner) * 100vw), -70px); margin-left: auto; margin-right: 0; padding: var(--padding-50); background: var(--color-white); }
.greetinfo2 .greetmsg .headline .line { font-size: var(--font-size-30); font-weight: 500; line-height: 1.4; color: #222; letter-spacing: -0.02em; }
.greetinfo2 .greetmsg .headline .line .name { font-weight: 700; color: var(--color-primary); }
.greetinfo2 .greetmsg .headline .line .rest { font-weight: 500; }
.greetinfo2 .greetmsg .desc { display: flex; flex-direction: column; gap: var(--padding-30); }
.greetinfo2 .greetmsg .desc p { font-size: var(--font-size-16); color: var(--color-body); line-height: 1.75; letter-spacing: -0.03em; }
.greetinfo2 .greetmsg .sign { display: flex; flex-wrap: wrap; align-items: center; gap: var(--padding-30); }
.greetinfo2 .greetmsg .sign .tit { font-size: var(--font-size-20); font-weight: 500; color: #222; line-height: 1.5; letter-spacing: -0.02em; }
.greetinfo2 .greetmsg .sign .img  {font-family: var(--font-nanum); font-size: var(--font-size-48); color: var(--color-body); line-height: 1.12;}

.commsec .toptit {margin-bottom: var(--padding-40); font-size: var(--font-size-18); color: var(--color-body); text-align: center;}
.stratlist { display: flex; flex-wrap: wrap;  gap: var(--padding-20); }
.stratlist .item { width: calc((100% - 1 * var(--padding-20)) / 2) ; display: flex; align-items: center; gap: var(--padding-50); padding: var(--padding-50) var(--padding-30); border: 1px solid #ddd; min-width: 0; }
.stratlist .item.wid-100 { width: 100%; }
.stratlist .item .cont { display: flex; flex-direction: column; gap: var(--padding-30); flex: 1; min-width: 0; line-height: 1.44; }
.stratlist .item .head { display: flex; flex-direction: column; gap: var(--padding-12); }
.stratlist .item .label { font-size: var(--font-size-18); color: var(--color-primary); }
.stratlist .item .tit { font-size: var(--font-size-22); font-weight: 800; color: #222; }
.stratlist .item .desc { font-size: var(--font-size-18); color: var(--color-body); }
.stratlist .item .img { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: var(--padding-80); height: var(--padding-80); margin: 0; border: 1px solid #ddd; border-radius: var(--padding-40); background: #fafafa; }
.stratlist .item .img img { width:  clamp(15px, calc( 40 / var(--inner) * 100vw ), 40px); height: auto;  object-fit: contain; display: block; }

.strategy_2 .riskbox { width: 100%; }
.strategy_2 .riskbox table { width: 100%; border-collapse: collapse; table-layout: fixed; border-top: 1px solid var(--color-primary); }
.strategy_2 .riskbox th { padding:var(--padding-25)  var(--padding-10); min-height: 80px; background: #f8f4ef; font-size: var(--font-size-22); font-weight: 600; color: #222; text-align: center; vertical-align: middle; border-bottom: 1px solid #ddd; }
.strategy_2 .riskbox th + th { border-left: 1px solid #ddd; }
.strategy_2 .riskbox td { padding: var(--padding-55) var(--padding-40); vertical-align: top; border-bottom: 1px solid #ddd; line-height: 1.3; }
.strategy_2 .riskbox td + td { border-left: 1px solid #ddd; }
.strategy_2 .riskbox .riskitems .item { position: relative; padding-left: 15px; }
.strategy_2 .riskbox .riskitems .item + .item { margin-top: var(--padding-30); }
.strategy_2 .riskbox .riskitems .item::before { position: absolute; content: ''; left: 0; top: 0.55em; width: 5px; height: 5px; background: var(--color-primary); border-radius: 50%; }
.strategy_2 .riskbox .txt { font-size: var(--font-size-20); color: #222; }
.strategy_2 .riskbox .note { margin-left: var(--padding-10); font-size: var(--font-size-16); color: #777; }

.strategy_3 .assetrow { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--padding-20); }
.strategy_3 .assetrow .box { display: flex; align-items: center; justify-content: center; padding: var(--padding-35); background: rgba(188, 155, 106, 0.1); border: 1px solid rgba(188, 155, 106, 0.3); text-align: center; }
.strategy_3 .assetrow .box .tit { font-size: var(--font-size-18); font-weight: 600; color: #222; line-height: 1; }

.fund_1 {padding-bottom: var(--padding-80); position: relative; z-index: 1;}
.fund_1:after {position: absolute; content: ''; left: 0; bottom: 0; width: 100%; height:clamp(150px, calc( 320 / var(--inner) * 100vw ), 320px); background: rgba(188, 155, 106, 0.06); z-index: -1;}

.fund_2 {margin-top: var(--padding-80);}
.fund_2 .head {display: flex;align-items: center;justify-content: space-between; padding-bottom: var(--padding-25); margin-bottom: var(--padding-50); position: relative; border-bottom: 2px solid #ddd;}
.fund_2 .head:after {position: absolute; content: ''; left: 0; bottom: -2px; width: clamp(60px, calc( 100 / var(--inner) * 100vw ), 100px); height: 2px; background: #BC9B6A;}
.fund_2 .head .tit {font-size:var(--font-size-32); font-weight: bold;}
.fund_2 .head .date {font-size:var(--font-size-18); color: var(--color-body);}
.fund_2 .fundlist { display: flex; flex-direction: column; gap: var(--padding-40); }
.fund_2 .fundlist .card { border: 1px solid #ddd; background: var(--color-white); transition: box-shadow 0.3s ease; }
.fund_2 .fundlist .card:hover { box-shadow: 0 2px 16px rgba(0, 0, 0, 0.2); }
.fund_2 .fundlist .card .inner { display: flex; flex-direction: column; gap: var(--padding-40); padding: var(--padding-50); }
.fund_2 .fundlist .card .tit { font-size: var(--font-size-26); font-weight: 700; line-height: 1; transition: color 0.3s ease; word-break: break-all;}
.fund_2 .fundlist .card:hover .tit { color: var(--color-primary); }
.fund_2 .fundlist .card .cont { display: flex; flex-direction: column; gap: var(--padding-15); }
.fund_2 .fundlist .card .target { display: flex; flex-wrap: wrap; align-items: center; gap: var(--padding-12); font-size: var(--font-size-18); line-height: 1.55; letter-spacing: -0.03em; }
.fund_2 .fundlist .card .target .lab { font-weight: 600; color: var(--color-body); }
.fund_2 .fundlist .card .target .txt { color: #797979; }
.fund_2 .fundlist .card .meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--padding-20); }
.fund_2 .fundlist .card .meta .cell { display: flex; align-items: center; gap: var(--padding-10); }
.fund_2 .fundlist .card .meta .icn { width: clamp(12px, calc( 18 / var(--inner) * 100vw ), 18px); flex-shrink: 0; margin: 0; }
.fund_2 .fundlist .card .meta .icn img { width: 100%; display: block; }
.fund_2 .fundlist .card .meta .line { margin: 0; font-size: var(--font-size-18); line-height: 1.55; letter-spacing: -0.03em; color: #797979; }
.fund_2 .fundlist .card .meta .line .lab { font-weight: 600; }
.fund_2 .fundlist .card .meta .bar { width: 1px; height: clamp(12px, calc( 20 / var(--inner) * 100vw ), 20px); background: #ddd; flex-shrink: 0; }

.brokerage { display: flex; flex-direction: column; gap: var(--padding-40); align-items: stretch; }
.brokerage .hero { position: relative; }
.brokerage .hero .img { width: 100%; overflow: hidden; }
.brokerage .hero .svcnum { position: absolute; left: clamp(20px, calc(100 / var(--inner) * 100vw), 100px); bottom: 0; z-index: 2; font-size: var(--font-size-80); font-weight: 800; color: var(--color-primary); line-height: 1; letter-spacing: -0.03em; transform: translateY(38%); }
.brokerage .intro { display: flex; flex-wrap: wrap; align-items: center; gap: clamp(30px, calc(110 / var(--inner) * 100vw), 110px); padding-top: var(--padding-40); padding-left: clamp(20px, calc(100 / var(--inner) * 100vw), 100px);}
.brokerage .intro .head { width: clamp(120px, calc( 410 / var(--inner) * 100vw ), 410px);}
.brokerage .intro .tit { font-size: var(--font-size-32); font-weight: 700; color: #222; line-height: 1.31; letter-spacing: -0.03em; }
.brokerage .intro .cont { flex: 1; line-height: 1.44; }
.brokerage .intro .cont .desc {font-size: var(--font-size-18); color: var(--color-body); }

.contact_1 { display: flex; flex-direction: column; gap: var(--padding-100); margin-top: var(--padding-80); }
.contact_1 .top { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--padding-40); }
.contact_1 .lead { line-height: 1.44; letter-spacing: -0.03em; }
.contact_1 .lead .tit { font-size: var(--font-size-32);color: #222; }
.contact_1 .btn-mapp { display: inline-flex; align-items: center; justify-content: center; gap: var(--padding-20); flex-shrink: 0; min-width: clamp(140px, calc( 220 / var(--inner) * 100vw ), 220px); height: clamp(44px, calc( 54 / var(--inner) * 100vw ), 54px); padding: 0 var(--padding-30); border-radius: 60px; border: 0; background: var(--color-primary); font-size: var(--font-size-18); font-weight: 600; color: var(--color-white); letter-spacing: -0.03em; }
.contact_1 .btn-mapp .arr { display: block; width: 10px; height: 10px; margin-left: 2px; border-right: 2px solid var(--color-white); border-top: 2px solid var(--color-white); transform: rotate(45deg); }
.contact_1 .detail .row:first-child { padding-top: 0; }
.contact_1 .detail .row { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--padding-50);  padding: var(--padding-35) 0; border-bottom: 1px solid #ddd; letter-spacing: -0.8px;}
.contact_1 .detail .lab { width: 87px; font-size: var(--font-size-24); font-weight: 600; color: #222; line-height: 1.25; letter-spacing: -0.03em; }
.contact_1 .detail .val { flex:1 ; font-size: var(--font-size-18); color: var(--color-body); line-height: 1.67; letter-spacing: -0.03em; }
.contact_1 .detail .val.muted { color: #787878; }
.contact_1 .detail .row-info { gap: var(--padding-120); align-items: center; }
.contact_1 .detail .row-info .cell { display: flex; flex-wrap: wrap; align-items: center; gap: var(--padding-50); }
.contact_1 .detail .row-info .cell .val { flex:1;}
.contact_1 .detail .row-way { align-items: flex-start; }
.contact_1 .detail .waycont { flex: 1; display: flex; flex-direction: column; gap: var(--padding-50); }
.contact_1 .detail .wayblk { display: flex; flex-wrap: wrap; align-items: flex-start; }
.contact_1 .detail .wayhd { display: flex; align-items: center; gap: var(--padding-10); flex-shrink: 0; width: clamp(120px, calc( 200 / var(--inner) * 100vw ), 200px);}
.contact_1 .detail .wayhd .icn { width: 36px; flex-shrink: 0; }
.contact_1 .detail .wayhd .icn img { width: 100%; height: auto; display: block; }
.contact_1 .detail .wytit { font-size: var(--font-size-20); font-weight: 600; color: #222; line-height: 1.5; letter-spacing: -0.03em; }
.contact_1 .detail .waybody {flex: 1; display: flex; flex-direction: column; gap: var(--padding-20); }
.contact_1 .detail .wyline { display: flex; flex-wrap: wrap; align-items: center; gap: var(--padding-13); }
.contact_1 .detail .wyline .txt { font-size: var(--font-size-18); color: var(--color-body); letter-spacing: -0.03em; }
.contact_1 .detail .wyline .station { font-weight: 600; color: #803edd; }
.contact_1 .detail .waybody .txt { font-size: var(--font-size-18); color: var(--color-body); letter-spacing: -0.03em; }
.contact_1 .detail .arw { width: 24px; flex-shrink: 0; }
.contact_1 .detail .arw img { width: 100%; display: block; }
.contact_1 .detail .bline { display: flex; flex-wrap: wrap; align-items: center; gap: var(--padding-20); }
.contact_1 .detail .bline .txt { font-size: var(--font-size-18); color: var(--color-body); letter-spacing: -0.03em; }
.contact_1 .detail .tag { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: clamp(30px, calc( 32 / var(--inner) * 100vw ), 32px); border-radius: var(--padding-32); font-size: var(--font-size-16); font-weight: 600; color: var(--color-white); letter-spacing: -0.03em; }
.contact_1 .detail .tag.gansun { background: #385ca3; }
.contact_1 .detail .tag.jiseon { background: #5eb033; }
.contact_1 .detail .tag.jik { background: #d63a3c; }
.contact_1 .detail .tag.maeul { background: #5eb033; }