@charset "utf-8";
.greeting {display:flex; gap:clamp(40px, calc( 175 / var(--inner) * 100vw ), 175px); align-items:center; justify-content:space-between;}
.greeting .col-r {flex:1;}
.greeting .col-r .txt1 {font-size:var(--font-size-44); color:var(--color-primary); font-weight:700; line-height:1.3em; margin-bottom:var(--space-15);}
.greeting .col-r .txt2 {font-size:var(--font-size-30); color:var(--color-bk); font-weight:500; line-height:1.3em; margin-bottom:var(--space-45);}
.greeting .col-r .txt-box {line-height:1.88em;}
.greeting .col-r .txt-box p {margin-bottom:var(--space-35);}
.greeting .col-r .txt-box p:last-child {margin-top:var(--space-45); margin-bottom:0;}

.history-wrap {position:relative;}
.history-wrap:before {top:0; bottom:0; position:absolute; left:50%; width:1px; background-color:#ddd; content:"";}
.history-item {padding-bottom:var(--space-120);}
.history-item:last-child {padding-bottom:0;}
.history-item .history-year {padding:0 var(--space-75); font-size:var(--font-size-44); margin-bottom:var(--space-30); position:relative; line-height:1em; letter-spacing:-.03em; color:var(--color-bk);}
.history-item .history-year strong {display:block; line-height:1em; display:inline-block; text-align:center; transition:all 0.5s ease; flex:1;}
.history-detail {margin-bottom:15px; padding:0 var(--space-75); display:flex; letter-spacing:-.03em; transition:all 0.5s ease;}
.history-detail:last-child {margin-bottom:0;}
.history-detail .month {width:35px; color:var(--color-secondary); font-weight:700; display:block;}
.history-detail p {flex:1;}

.history-item:nth-child(odd) {padding-left:50%;}
.history-item:nth-child(even) {padding-right:50%; text-align:right;}
.history-item:nth-child(even) .history-detail .month {order:2;}
.history-item:nth-child(even) .dots {left:auto; right:-6px;}

.history-item .dots {width:12px; height:12px; top:15px; left:-6px; margin:0; background-color:#fff; position:absolute; border:2px solid #000; border-radius:50%; transition:all 0.3s; z-index:0;}
.history-item .dots .inner-dots {width:var(--space-60); height:var(--space-60); position:absolute; background:#e7f3f9; border-radius:100%; top:50%; left:50%; transform:translate(-50%,-50%) scale(0); z-index:-1; transition:all 0.3s;}
.history-item .dots .inner-dots:after {width:var(--space-40); height:var(--space-40); background:#a8d2ea; display:block; content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) scale(0); z-index:-1; border-radius:100%; transition:all 0.5s;}

.history-item.active .dots .inner-dots {transform:translate(-50%,-50%) scale(1); animation:ani .5s forwards ease; animation-delay:.05s;}
.history-item.active .dots .inner-dots:before {width:var(--space-24); height:var(--space-24); border:6px solid var(--color-secondary); display:block; content:""; background:#fff; position:absolute; left:50%; top:50%; border-radius:100%; animation:ani .5s forwards ease; animation-delay:.02s;}
.history-item.active .dots .inner-dots:after {animation:ani .5s forwards ease; animation-delay:.08s;}
.history-item.active .history-year strong {line-height:.6em;}

@keyframes ani {
	0% {transform:translate(-50%,-50%) scale(0);}
	100% {transform:translate(-50%,-50%) scale(1);}
}

.root_daum_roughmap,
.root_daum_roughmap .wrap_map {height:clamp(250px, calc( 450 / var(--inner) * 100vw ), 450px) !important; width:100% !important;}
.root_daum_roughmap .cont {display:none !important;}

.local-flex {display:flex; gap:var(--space-40);}
.local-flex .item {width:50%;}
.directions {padding:var(--space-35) 0 0 var(--space-40);}
.directions .address-info {margin-bottom:var(--space-30);}
.directions .address-info .comp {color:var(--color-secondary); font-weight:600;}
.directions .address-info .addr {margin:8px 0; color:var(--color-bk); font-size:var(--font-size-26); font-weight:600; line-height:1.33em; letter-spacing:-.03em;}
.directions .address-info .etc {font-size:var(--font-size-18); color:#898989;}
.directions .address-info .etc span {display:inline-block; margin-right:var(--space-20);}
.directions .address-info .etc span:last-child {margin-right:0;}
.directions .contact-info dl {margin-bottom:var(--space-35); display:flex;}
.directions .contact-info dl:last-child {margin-bottom:0;}
.directions .contact-info dt {width:150px; color:var(--color-bk); font-size:var(--font-size-18); font-weight:500;}
.directions .contact-info dt svg {vertical-align:middle; margin:-2px 15px 0 0;}
.directions .contact-info dt path {fill:#ababab;}
.directions .contact-info dd {flex:1 1 auto; min-width:0; width:1%;}