/**--------------------------- 이너 사이즈 **/
.inner { margin: 0 auto; position: relative; width:100%; max-width: var(--inner); } 

@media screen and (max-width:1400px) { 
 .inner,
 .sub_layout { padding-right:60px !important; padding-left: 60px !important; } 
}

@media screen and (max-width:1024px) { 
 .inner,
 .sub_layout { padding-right:32px !important; padding-left: 32px !important; } 
}

@media screen and (max-width:640px) { 
 .inner,
 .sub_layout { padding-right:16px !important; padding-left: 16px !important; } 
}





/**--------------------------- 레이아웃 **/
.container { margin-top:6.125rem; position: relative; } 
.content { padding-bottom:10rem; } 

@media screen and (max-width:1024px) { 
 .container { margin-top:4.375rem; } 
}





/**--------------------------- 서브 레이아웃 **/
.sub_layout { padding:0 3.125rem; } 



.sub_visual { height:11.625rem; background:#F5F5F8 url("../../images/sub/bg_sub.png") no-repeat bottom right; border-radius: 10px; } 
.sub_visual .inner { display: flex; gap:0.75rem; justify-content: center; flex-direction: column; width:100%; height:100%; } 
.sub_visual h2 { font-size: 1.875rem; font-weight: 600; line-height: 140%; } 
.sub_visual ul.bread_crumbs { display: flex; align-items: center; } 
.sub_visual ul li { display: flex; align-items: center; font-size: 0.875rem; font-weight: 500; line-height: 140%; color: var(--gray-550, #737373); } 
.sub_visual ul li::after { display: inline-block; padding:0 0.625rem; content: "\276F"; } 
.sub_visual ul li:last-child:after { display: none; } 


.sub_tit { padding:8.4375rem 0 6.25rem; overflow: hidden; position: relative; } 
.sub_tit h3 { font-size: 2.75rem; font-weight: 600; line-height: 140%; text-align: center; letter-spacing: -0.05em; animation: spacing-in 1.5s ease forwards; } 
.sub_tit .symbol { position: absolute; top:-1.875rem; right:-1.875rem; z-index: -1; font-size: 12.5rem; font-weight: 800; line-height: 140%; color: #F5F5F8; text-align: center; letter-spacing: -0.02em;} 


@keyframes spacing-in { 
 0% { letter-spacing: 0.3em; opacity: 0; } 
 60% { letter-spacing: -0.02em; opacity: 1; } 
 100% { letter-spacing: -0.05em; } 
}

@media screen and (max-width:640px) { 
 .sub_tit {padding:4rem 0;} 
 .sub_tit h3{ font-size: 2.25rem; animation: unset;}
 .sub_tit .symbol {display: none;} 
}
