@charset 'utf-8';

/* °øÅë */
body, #wrap { position: relative;}
body.fixed { overflow-y:hidden; }
.inner { width: calc(100% - 60px); max-width: 1860px; margin: 0 auto; }

/* input focus */
input:focus-visible, textarea:focus-visible {outline: none}
/* ºñµð¿À ÄÁÆ®·Ñ ¼û±è */
video::-webkit-media-controls { display:none; }

/* button */
.button__wrap{ display: flex; justify-content:center; align-items:center; }
.btn{ display: flex; justify-content:center; align-items:center; cursor:pointer; }
.btn-line { width: 170px; height: 60px; font-size: 26px; line-height: 1.3; color: #666; font-weight: 400; border: 1px solid #666; background-color: transparent; }
.btn-file { width: 132px; height: 50px; border: 1px solid #BBB; font-family: var(--font-pretendard); font-size: 16px; font-weight: 200; line-height: 1.3; color: #222; cursor:pointer; }

/* header */
.header{ position: fixed; left:0; top: 0; width: 100%; height: 70px; border-bottom: 1px solid rgba(255,255,255,0.1); transition: 0.6s ease-out; z-index: 900;}
.header__inner { display:flex; justify-content: space-between; align-items:center; width: calc(100% - 60px); height:100%; margin: 0 auto;}
.header .logo { width: 107px; height: 36px; background: url('/img/common/logo_white.svg') no-repeat center center/contain; transition: 0.6s ease-out;}
.header .logo a { display:block; width: 100%; height: 100%; }
.gnb { display: flex;}
.gnb .gnb__list { display: flex; justify-content: space-between;}
.gnb .gnb__item>a { display:block; width: 110px; padding: 20.5px 0; font-family: "Baloo 2", serif; font-size: 17px; line-height: 1.3; color: #fff; text-align: center; transition: 0.6s ease-out;}
#btnMenu { display:none; position:relative; width: 30px; height: 30px; border:none; background-color: transparent; cursor:pointer; z-index: 50; }
#btnMenu>span { position:absolute; right:0; display:block; height: 2px; border-radius:1px; background-color: #fff; transition: 0.6s ease-out;}
#btnMenu>span:nth-child(1) { width: 30px; top:25%; }
#btnMenu>span:nth-child(2) { width: 20px; top:50%; }
#btnMenu>span:nth-child(3) { width: 10px; top:75%; }
.mo-menu__wrap { display:none; position:fixed; right:0; top:0; width: 100%; height: 100dvh; }
.mo-menu__area { position:fixed; right:-100%; top:0; width: 70%; min-width:300px; height: 100%; padding: 60px 0; z-index:20; background-color: #f6f6f6; }
.mo-menu__area .gnb__list { padding:40px; border-top: 1px solid #DDD;}
.mo-menu__area .gnb__list>*+* { margin-top: 20px;}
.mo-menu__area .gnb__item>a{ position:relative; display:block; width:fit-content; padding: 10px 0; font-size: 30px; line-height: 1.3; color: #444;}
.mo-menu__area .gnb__item>a::after { content:""; display:block; position: absolute; left:0; bottom:20%; width: 0; height: 1px; background-color: #DDD; transition: 0.3s ease-out;}
.mo-menu__area .gnb__item>a:hover::after,.mo-menu__item>a:active::after,.mo-menu__item>a:focus::after{ width: 100%; }
#btnMenu.on>span { background-color: #333; }
#btnMenu.on>span:nth-child(1) { top:50%; transform:translateY(-50%) rotate(45deg); }
#btnMenu.on>span:nth-child(2) { opacity: 0; }
#btnMenu.on>span:nth-child(3) {	width: 30px; top:50%; transform:translateY(-50%) rotate(-45deg); }
.dim-layer { position:fixed; left:0; top:0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.3);  z-index: 10;}

.header.fixed { background-color: #f6f6f6; border-bottom: 1px solid #DDD;}
.header.fixed .gnb .gnb__item>a {color: #333;}
.header.fixed .logo { background-image: url('/img/common/logo.svg');}
.header.fixed #btnMenu>span { background-color: #333;}

.header:hover { background-color: #f6f6f6; border-bottom: 1px solid #DDD;}
.header:hover .gnb .gnb__item>a {color: #333;}
.header:hover .logo { background-image: url('/img/common/logo.svg');}
.header:hover #btnMenu>span { background-color: #333;}

/* footer */
.footer {position:absolute; bottom:0; width:100%; background-color: #f6f6f6; z-index:100; }
.footer__inner { width: calc(100% - 60px); height:100%; margin: 0 auto;}
.footer__top { display: flex; justify-content: right; padding: 56.68px 0 36.68px; }
.sns__list { display: flex; column-gap: 29.36px; padding: 0 6.68px; }
.sns__item { position: relative; }
.sns__item>a{ position: relative; display: block; width: 111px; height: 111px; border: 1px solid #CCC; border-radius: 50%; transition: 0.3s ease-out; z-index: 5;}
.sns__item>a:hover,.sns__item>a:focus,.sns__item>a:active { transform: scale(1.117);}
.sns__item img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 0; width: 32px; }
.footer__bottom { display:flex; justify-content: space-between; align-items: flex-end; padding: 50px 0; border-top: 1px solid #CCCCCC;}
.footer__bottom>.left{ display: flex; column-gap: 80px;}
.footer__bottom .logo { width: 206px; }
.footer__bottom .logo a { display:block; width: 100%; height: 100%; }
.footer__bottom .logo img { width: 100%; height: auto;}
.f-info__list>*+* { margin-top: 12px; }
.f-info__item { display: flex; column-gap: 30px;}
.f-info__item .info { display: flex; column-gap: 20px;}
.f-info__item strong { width: 70px; font-family: "Baloo 2", serif; font-size: 17px; line-height: 1.3; font-weight: 500; color: #333; text-align: right;}
.f-info__text, .f-info__text>p { font-family: "Baloo 2", serif; font-size: 17px; line-height: 1.5; color: #555; }
.f-info__text>p>* {font-family: inherit; font-size: inherit; line-height: inherit; color: inherit;}
.f-info__item .email strong { width:fit-content; }
.f-info__item .tel .f-info__text, .f-info__item .email .f-info__text { line-height: 1.3; }

.footer__bottom .right { text-align: right; }
.footer__bottom .right a { font-family: "Baloo 2", serif; font-size: 17px; line-height: 1.3; color: #555; text-decoration: underline; text-decoration-skip-ink:none; text-decoration-thickness: 1px;}
.footer__bottom .right .copyright { margin-top: 12px; font-family: "Baloo 2", serif; font-size: 17px; line-height: 1.3; font-weight: 300; color: #555;}

/* privacy */
.lh-160 { line-height: 1.6 !important; }
.privacy { width: 100%; overflow: hidden; box-sizing:border-box; font-size:18px; line-height: 1.3; word-break:keep-all; color: #444444;}
.privacy .top h2 { margin-bottom: 30px; font-size:40px; font-weight:500; line-height: 1.3; color:#222; text-align: center; }
.privacy .top p { font-family: var(--font-pretendard); font-weight: 300; line-height: 1.8; letter-spacing: -0.01em; text-align: center; }
.privacy .info { margin-top: 80px; border-top: 1px solid #B5B0A6; }
.privacy .info > dl { padding:50px 0;  border-bottom: 1px solid #DDDDDD; }
.privacy .info > dl >*,.privacy .info > dl > dd ul li,.privacy .info > dl > dd ul li>*{ font-family: var(--font-pretendard); }
.privacy .info > dl > dt{ margin-bottom: 20px; font-size:20px; color:#222; line-height: 1.3 ; letter-spacing: -0.01em; font-weight:500; }
.privacy .info > dl > dd{ font-family: var(--font-pretendard); font-size:18px; font-weight: 300; line-height:1.3; letter-spacing: -0.01em; color: #444;}
.privacy .info > dl > dd ul{ padding-top:10px; }
.privacy .info > dl > dd ul li{ line-height:1.3; letter-spacing:-0.01em; margin-top: 10px; }
.privacy .info > dl > dd ul li:first-child { margin-top: 0; }
.privacy .info > dl > dd ul li p { margin:10px 10px 5px; line-height: 140%; }
.privacy .info > dl > dd ul.cookie li { line-height: 1.6; }
.privacy .info > dl > dd ul.cookie li p { margin: 0 0 10px; font-weight: 500; font-size: 18px; line-height: 1.3; letter-spacing: -0.01em; color: #222; }
.sTxt { margin-top: 20px; }
.sTxt h3 { padding-top: 10px; font-size:18px; color: #222; font-weight: 500; margin-bottom: 10px;}
.sTxt p { margin-top: 10px; font-family: var(--font-pretendard);  font-size:18px; font-weight: 300; line-height:1.3; letter-spacing: -0.01em; }
.sTxt dl { margin-bottom: 10px; }
.sTxt dt { margin-top: 10px; }
.sTxt dd { margin-top: 10px; margin-left: 8px; font-family: var(--font-pretendard);  font-size:18px; font-weight: 300; line-height:1.3; letter-spacing: -0.01em; }
.sTxt.admin dd { margin-left: 0; } 

/* popup */
.popup__wrap { position: fixed; left: 0; top: 0; display: none; width: 100%; height: 100%;  z-index: 999;}
.popup__area { overflow-y:auto; position: absolute; left: 50%; top: 50%; width: calc(100% - 60px); max-width:1270px; height: 554px; max-height: calc(100dvh - 100px); padding: 80px 0; background-color: #fff; transform:translate(-50%, -50%); z-index: 20; }
.popup__area::-webkit-scrollbar { width: 6px; }
.popup__area::-webkit-scrollbar-thumb { background-color: #ccc; }
.popup__inner { width: calc(100% - 40px); max-width:962px; margin: 0 auto; }
.popup__inner .tit { margin-bottom: 40px; text-align: center; }
.popup__inner .tit strong { display: block; font-size: 30px; font-weight: 500; line-height: 1.3; letter-spacing: -0.01em; color: #222;  } 
.popup__inner .tit p { margin-top: 10px; font-size: 18px; font-weight: 300; line-height: 1.3; letter-spacing: -0.01em; color: #444; word-break:keep-all;}
.popup__inner .button__wrap { margin-top: 40px; }
.popup__inner .button__wrap .btn-close { font-size: 18px; font-weight: 500; }

/* table */
.table { width: 100%; table-layout:fixed; border-collapse: collapse; }
.terms-table th { font-family: var(--font-pretendard); height: 60px; border:1px solid #fff; background-color: #E4E4E4; font-size: 18px; line-height: 1.3; color: #333;  }
.terms-table td { font-family: var(--font-pretendard); border:1px solid #fff; padding: 18px 0; background-color: #F8F8F8; font-size: 17px; font-weight: 300; line-height: 1.3; color: #666; text-align: center; }

/* datepicker */
.ui-widget { font-size: 1.3em; }
.ui-datepicker td span, .ui-datepicker td a { height: 2.4em; }
.ui-icon { width: 20px; height: 20px; }
.ui-widget-header .ui-datepicker-prev .ui-icon { border-radius:50%; background: url('/img/common/date_prev.svg') no-repeat center center/0.4em #fff; }
.ui-widget-header .ui-datepicker-next .ui-icon { border-radius:50%; background: url('/img/common/date_next.svg') no-repeat center center/0.4em #fff; }
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover { border:1px solid transparent; }
.ui-datepicker .ui-datepicker-prev-hover { left:2px; top:2px; }
.ui-datepicker .ui-datepicker-next-hover { right:2px; top:2px; }
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { margin: 0; transform:translate(-50%, -50%); }
.ui-state-default, .ui-widget-content .ui-state-default { border: 1px solid #e7e7e7; }
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border: 1px solid #82AD7E; background: #DEF1CF; color: #454545; }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover { border:1px solid #527E4E; background-color: #82AD7E;  }

@media screen and (max-width: 1300px) {
	.footer__bottom .logo { width: 140px; }
	.footer__bottom>.left { column-gap: 40px; }
	.f-info__item strong { font-size: 14px; }
	.f-info__text, .f-info__text>p { font-size: 14px; }
	.footer__bottom .right a { font-size: 14px; }
	.footer__bottom .right .copyright { font-size: 14px; }
}
@media screen and (max-width: 1200px) {
	.btn-file { width: 120px; height: 40px; font-size: 14px; }
}
@media screen and (max-width: 1024px) {
	.header{ height: 60px;}
	.header .logo { width: 80px; }
	.gnb { display: none; }
	#btnMenu { display:block;}
	.mo-menu__wrap.on { display:block; }
	.footer__bottom { flex-direction: column; align-items: flex-start; row-gap: 30px;  }
	.footer__bottom .right { text-align: left; }

	.popup__area { height: auto; }
	.popup__inner .tit strong { font-size: 24px; }
	.popup__inner .tit p { font-size: 16px; }
	.terms-table th { height: 40px; font-size: 16px; }
	.terms-table td { font-size: 14px; }

	.privacy { font-size: 16px; }
	.privacy .top h2 { font-size: 30px; }
	.privacy .top p > br { display: none; }
	.privacy .info > dl > dt { font-size: 18px; }
	.privacy .info > dl > dd { font-size: 16px; }
	.privacy .info > dl > dd > br{ display: none; }
	.privacy .info > dl > dd ul.cookie li p { font-size: 16px; }
	.sTxt dd,.sTxt p { font-size: 16px; }
}
@media screen and (max-width: 768px) {
	.btn-line { width: 140px; height: 40px; font-size: 20px; }
	.popup__inner .button__wrap .btn-close { font-size: 16px; }

	.footer__top { justify-content: center;  padding: 50px 0 30px; }
	.sns__item>a { width: 60px; height: 60px; }
	.footer__bottom { padding: 30px 0; }
	.footer__bottom .logo { width: 100px; }
	.footer__bottom>.left { flex-direction: column; row-gap: 20px;}
	.f-info__item { flex-direction: column; gap: 12px;}
	.f-info__item strong, .f-info__item .email strong { width: 60px; text-align: left; }
	.f-info__text { width: calc(100% - 72px); }
	.f-info__item .info { column-gap: 12px; }

	.popup__area { padding: 40px 0; }
	.popup__inner .tit strong { font-size: 20px; }
	.popup__inner .tit p { font-size: 14px; }
	.terms-table { display: none; }

	.privacy { font-size: 14px; }
	.privacy .top h2 { font-size: 24px; }
	.privacy .info { margin-top: 60px; }
	.privacy .info > dl { padding: 30px 0; }
	.privacy .info > dl > dt { font-size: 16px; }
	.privacy .info > dl > dd { font-size: 14px; }
	.sTxt h3 { font-size: 16px; }
	.sTxt dd,.sTxt p { font-size: 14px; }
}