:root { 
 --header-hei: 10rem; 
 --inner-pd: 4.16666666667%; 
 --inner-cont-pd: 8.33333333333%; 
 --top-wi:7rem; 
 --color-point: #DC4928; 
 --color-point1: #997165; 
 --color-point2: #C2B2A7; 
 --color-txt: #252120; 
 --color-border:#; 
 --color-bg: #F0EDE6; 
 --ci-wi: 70rem; 
 } 
 @media all and (max-width:1280px) { 
 :root { --header-hei: 8rem; --top-wi:5rem; } 
 } 
 @media all and (max-width:600px) { 
 } 

.inner { width: 100%; padding-left:var(--inner-cont-pd); padding-right:var(--inner-cont-pd); } 
.flex { display: flex; align-items: center; } 
.icon, .img { display: inline-block; width: auto; max-width: 100%; } 
.img-ob { width: 100%; height: 100%; object-fit: cover; object-position: center; } 
.ab-center { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 
.sec-tp { margin-top:16rem; } 
.img-m { display: none; } 
.txt { word-break: keep-all; } 

/*트랜지션*/
#header { transition: .3s; } 


@media all and (max-width:768px) { 
.img-pc { display: none; } 
.img-m { display: block; } 
 } 

/*리스트스타일*/
.list-st { margin-left: 2.2rem; } 
.list-st li { position: relative; font-size: 1.8rem; line-height: 1.5; } 
.list-st li:not(:last-child) { margin-bottom: 1.3rem; } 
.list-st li::before { content: ''; display: inline-block; position: absolute; } 
.list-st ul li.list-non { margin-left: -2.2rem; } 
.list-st ul li.list-non .tit-sub { margin-bottom: 0; } 
.list-st ul li.list-non::before { display: none; } 
.list-st-bar { margin-left: 1.6rem; } 
.list-st-bar li::before { content: '-'; display: inline-block; margin-left: -1.4rem; margin-right: 0.5rem; } 
.list-st-cy li::before { top: 1.15rem; left: -1.2rem; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--color-txt); } 

/*헤더*/
#header { position: fixed; width: 100%; height: var(--header-hei); background-color: transparent; background-position: 99% 97%; background-size: 30%; background-repeat: no-repeat; z-index: 99; } 
#header .logo { width: 17.7rem; height: 7.7rem; margin-top: auto; background-image: url(/bamirang/img/logo_w.svg); background-position: left bottom; background-repeat: no-repeat; background-size: contain; } 
#header .inner { justify-content: space-between; width: 100%; height: var(--header-hei); padding: 0 var(--inner-pd); } 
#header .gnb > li { position: relative; height: 100%; line-height: var(--header-hei); } 
#header .gnb > li:not(:last-child) { margin-right: 4.3rem; } 
#header .gnb > li > a { display: block; color: #fff; font-size: 2.2rem; font-weight: 500; cursor: pointer; transition: .5s; } 
#header .btn-contact { display: flex; padding: 1rem 1.8rem; border-radius: 3rem; border: 1px solid var(--color-bg); color: #fff; font-size: 2.2rem; font-weight: 500; line-height: 1; transition: .5s; cursor:pointer; } 
#header .btn-contact .icon { margin-left: 1rem; transition: .5s; } 

#header .btn-contact:hover { background-color: var(--color-bg); color: #000; } 
#header .btn-contact:hover .icon { filter: invert(1); } 

#header.header_c .logo { background-image: url(/bamirang/img/logo_c.svg); } 
#header.header_c .gnb > li > a { color: #000; font-weight: 600; } 
#header.header_c .btn-contact { border: 1px solid var(--color-txt); color: #000; } 
#header.header_c .btn-contact .icon { filter: invert(1); } 
#header.header_c .btn-contact:hover { background-color: var(--color-txt); color: #fff; } 
#header.header_c .btn-contact:hover .icon { filter: none; } 

/*헤더 메뉴 버튼*/
#header .ham_menu_btn { display: none; align-content: space-around; grid-gap:0; position: relative; width: 3rem; height: 3rem; margin-left: 2rem; } 
#header .ham_menu_btn span { width: 100%; height: 2px; background-color: #fff; } 
#header .ham_menu_btn.ham_on span { position: absolute; top: 50%; left: 0; } 
#header .ham_menu_btn.ham_on span:nth-child(2) { opacity: 0; visibility: hidden; } 
#header .ham_menu_btn.ham_on span:nth-child(1) { transform: rotateZ(45deg); } 
#header .ham_menu_btn.ham_on span:nth-child(3) { transform: rotateZ(-45deg); } 
#header.header_c .ham_menu_btn span { width: 100%; height: 2px; background-color: #000; } 

/*모바일 메뉴*/
.ham_menu { display: block; position: fixed; right: 0; top: 0; width: auto; height: 100vh; padding:var(--header-hei) var(--inner-pd); background: var(--color-txt); overflow: hidden; visibility: hidden; transition: .5s; z-index: 7; cursor: pointer; transform: translateX(100%); } 
.ham_menu a { color: #fff; } 
.ham_menu > ul { width: 100%; padding-top: var(--header-hei); } 
.ham_menu > ul > li { width: 100%; line-height: 2; position: relative; } 
.ham_menu > ul > li > a { font-size: 2.2rem; font-weight: 600; } 
.ham_menu.on { transform: translateX(0); visibility: visible; } 

@media all and (max-width:1280px) { 
#header .logo { width: 10rem; height: 6rem; } 
#header .gnb > li > a { font-size: 1.6rem; } 
#header .btn-contact { padding: .5rem 1rem; font-size: 1.6rem; } 
#header .btn-contact .icon { width: 1.6rem; } 
 } 
@media all and (max-width:768px) { 
#header .gnb ,#header .btn-contact { display: none; } 
#header .ham_menu_btn { display: grid; } 
#header .logo { margin-top: 0; } 
#header.header_mo { background: var(--color-bg); } 
#header.header_mo .logo { background-image: url(/bamirang/img/logo_c.svg); } 
#header.header_mo .ham_menu_btn span {background-color: var(--color-txt); }
 } 
 @media all and (max-width:600px) { 
#header .logo { width: 8rem; height: 5rem; } 
 } 

/*하단*/
#footer { justify-content: space-between; position: relative; padding: 7rem calc(var(--inner-pd) + var(--top-wi) + 2rem) 6rem var(--inner-pd); background-color: #252120; z-index: 2; } 
#footer .info { width: 40%; } 
#footer .info li { line-height: 1.8; } 
#footer .info li strong { width: 10rem; color: #fff; font-size: 1.6rem; } 
#footer .info li p { width: calc(100% - 10rem); color: #848180; font-size: 1.6rem; } 
#footer .info li p a {color: #848180; } 
#footer .copy { width: 40%; text-align: end; letter-spacing: 0; } 
#footer .copy span { color: #848180; font-size: 1.2rem; } 

#btnTop { display: flex; justify-content: center; align-items: center; position:fixed; bottom: 11rem; right: var(--inner-pd); width:var(--top-wi); height:var(--top-wi); border-radius: 100%; background:#FFFFFF; border:2px solid #130A08; z-index:9; cursor: pointer; opacity: 0; transition: .5s; } 
#btnTop.on { opacity: 1; } 

@media all and (max-width:1280px) { 
 #footer { padding: 5rem calc(var(--inner-pd) + var(--top-wi) + 2rem) 5rem var(--inner-pd); } 
 #footer .ft-logo { width: 14rem; } 
 #footer .info li strong , #footer .info li p { font-size: 1.6rem; } 
 #footer .info li strong { width: 7rem; } 
 #footer .info li p { width: calc(100% - 7rem); } 
 #footer .info { width: 30%; } 
 #footer .copy { width: calc(30% - var(--top-wi)); } 
 } 
 @media all and (max-width:768px) { 
#footer { display: grid; justify-content: center; justify-items: center; padding: 5rem calc(var(--inner-pd) + var(--top-wi) + 2rem); } 
#footer .logo { order: 1; } 
#footer .info { order: 2; width: 100%; padding: 3rem 0; } 
#footer .copy { order: 3; width: 100%; } 

#btnTop {    bottom: 3rem !important;padding: 1.4rem;} 
 } 
/*탑 버튼*/
