@charset "utf-8";

/* common */
body, input, textarea, button, select{color:#333;}
.scrlnone{overflow:hidden !important;}
#wrap.pb0 #content{padding-bottom:0 !important;}
#footer.c-black{background:#010103;}

#container{ color:#333;}
#content{ position: relative; z-index:5; background:#fff; padding: clamp(70px, calc( 200 / var(--inr) * 100vw ), 200px) 0 clamp(100px, calc( 200 / var(--inr) * 100vw ), 200px); }
#content > .inr,
[data-subarea]{max-width: calc(var(--inr) * 1px); width: calc(var(--inr-width) * 100%); margin:0 auto;}
#content > .inr.area_join_select{max-width:1260px;}
.inr-1260{max-width:1260px; margin:0 auto;}
#content h2{margin-top:60px; margin-bottom:30px; font-size:35px; color:#000; font-weight:400; text-align:center; font-weight:500; word-break:keep-all;}
#content h2.board_title,
#content h2[data-title-content],
#content [data-title-content]{margin-top:0; font-size:clamp(35px, calc(50 / var(--inr) * 100vw), 50px); font-weight:700; letter-spacing:-1px;}
#content [data-title-content]{margin-bottom:30px; color:#000; text-align:center;}
#content [data-scrollAni]{text-align:left; font-size:clamp(35px, calc(56 / var(--inr) * 100vw), 50px); font-weight:700; letter-spacing:-1px;}
[data-scrollAni] span{color:#d1d1d1;}
[data-scrollAni] span i{color:rgba(16,16,16,1);}
#content.theme-black{background-color:#030104; color:rgba(255,255,255,1);}
#content.pull-page{padding-top:0 !important;}
.full-black{padding:clamp(80px, calc( 100 / 1920 * 100vw ), 100px) 0 clamp(100px, calc( 140 / 1920 * 100vw ), 140px); background-color:#030104;}
.full-black *{color:#fff;}

@media screen and (max-width:1024px){
	.theme__black #content{padding-top:clamp(100px, calc( 170 / 1024 * 100vw ), 170px);}
}
@media screen and (max-width:680px){
	#content h2{font-size:30px;}
	#content [data-scrollAni]{font-size:clamp(20px, calc(35 / 680 * 100vw), 35px);}
}
@media screen and (max-width:420px){
	#content{padding-bottom:80px;}
	#content h2{margin-top:30px;font-size: 25px;}   
	#content h2.board_title,
	#content h2[data-title-content],
	#content [data-title-content]{font-size:clamp(25px, calc(35 / 420 * 100vw), 35px);}
}  
@media screen and (max-width:370px){
	#content h2{font-size:25px;}
}

/* about */
[data-subarea="about"]{font-size:clamp(16px, calc( 18 / var(--inr) * 100vw ), 18px);}
[data-subarea="about"] p{font-size:clamp(16px, calc( 24 / var(--inr) * 100vw ), 24px); color:#111; line-height:2;}
[data-subarea="about"] #sec1 ul{margin:90px 0; display:grid; grid-template-columns:1fr 1fr 1fr; gap:0 50px; text-align:center;}
[data-subarea="about"] #sec1 ul li{overflow:hidden; padding:100px 20px; border:1px solid #dedede; border-radius:12px; transition:0.3s;}
[data-subarea="about"] #sec1 ul li:before{content:''; opacity:0; display:block; position:absolute; top:0; left:0; z-index:-1; width:100%; height:100%; background:var(--color-point); border-radius:50rem; transform:scale(0.5); transition:0.5s ease-in-out;}
[data-subarea="about"] #sec1 ul span{--sizeWid:148px; display:block; margin:auto; width:var(--sizeWid); height:var(--sizeWid);}
[data-subarea="about"] #sec1 ul svg{display:block; height:100%; width:100%; object-fit:contain;}
[data-subarea="about"] #sec1 ul .cls-1{fill:#111; transition:0.2s;}
[data-subarea="about"] #sec1 ul em{display:block; margin:50px 0 12px; font-size:clamp(24px, calc( 38 / var(--inr) * 100vw ), 38px); color:#111; font-weight:bold; transition:0.3s;}
[data-subarea="about"] #sec1 ul i{display:block; color:rgba(17,17,17,0.6); transition:0.3s;}
[data-subarea="about"] #sec1 p.right{width:1200px; margin-left:auto;}
[data-subarea="about"] #sec1 .img{margin:180px 0 90px;}
[data-subarea="about"] #sec1 .img span{display:block; width:100%; height:540px; border-radius:12px; overflow:hidden;}
[data-subarea="about"] #sec1 .img img{display:block; width:100%; height:100%; object-fit:cover;}
[data-subarea="about"] #sec1 .img h3{position:relative; z-index:5; margin-top:-90px; padding:0 80px; font-family:var(--font-hankookM); font-size:56px; color:#fff; text-align:left;}
[data-subarea="about"] #sec1 .img em{color:var(--color-point);}
#about1_sec2{margin-top:200px; padding-top:200px; background:url(/images/content/about1_sec2_bg.jpg)no-repeat 50% 0/cover; text-align:center;}
#about1_sec2 h3{font-size:clamp(28px, calc( 56 / var(--inr) * 100vw ), 56px); color:#d84727; font-family:var(--font-hankookM);}
#about1_sec2 .img{display:block; margin:40px auto 50px; max-width:1070px; width:100%;}
#about1_sec2 .img img{display:block; width:100%;}
#about1_sec2 h4{color:#fff; font-size:clamp(20px, calc( 46 / var(--inr) * 100vw ), 46px); font-weight:500; line-height:1.8;}
#about1_sec2 h4 em{color:var(--color-point);}
	/* motion */
[data-subarea="about"] #sec1 ul li[data-motion]{opacity:0; transform:translateY(50px); transition:0.9s cubic-bezier(0.4, 0, 0.2, 1) 0s; transition-property:opacity, transform;}
[data-subarea="about"] #sec1 ul li[data-motion].motion__in{opacity:1; transform:translateY(0);}
[data-subarea="about"] #sec1 ul li[data-motion="01"].motion__in{transition-delay:0.2s;}
[data-subarea="about"] #sec1 ul li[data-motion="02"].motion__in{transition-delay:0.4s;}
[data-subarea="about"] #sec1 ul li[data-motion="03"].motion__in{transition-delay:0.6s;}
[data-subarea="about"] #sec1 .img span[data-motion]{clip-path:inset(50% 50% 50% 50%); transition:0.9s ease-in-out 0s;}
[data-subarea="about"] #sec1 .img span[data-motion].motion__in{clip-path:inset(0 0 0 0);}
#about1_sec2 .img[data-motion]{opacity:0; transform:translateY(50px); transition:0.9s cubic-bezier(0.4, 0, 0.2, 1) 0s; transition-property:opacity, transform;}
#about1_sec2 .img[data-motion].motion__in{opacity:1; transform:translateY(0);}
#about1_sec2 h4[data-motion]{opacity:0; filter:blur(10px); transition:0.9s cubic-bezier(0.4, 0, 0.2, 1) 0s; transition-property:opacity, filter;}
#about1_sec2 h4[data-motion].motion__in{opacity:1; filter:blur(0); transition-duration:0.9s, 1.5s;}
[data-subarea="about"] #sec1 ul li.show{border-color:#fd5c00; transition-delay:0s !important;}
[data-subarea="about"] #sec1 ul li.show .cls-1{fill:#fff;}
[data-subarea="about"] #sec1 ul li.show em{color:#fff;}
[data-subarea="about"] #sec1 ul li.show i{color:rgba(225,225,225,0.6);}
[data-subarea="about"] #sec1 ul li.show:before{opacity:1; border-radius:0; transform:scale(1); transition-duration:0.3s 0.5s 0.5s;}
@media(hover:hover){
    /*
	[data-subarea="about"] #sec1 ul li:hover{border-color:#fd5c00; background:var(--color-point);}
    [data-subarea="about"] #sec1 ul li:hover .cls-1{fill:#fff;}
    [data-subarea="about"] #sec1 ul li:hover em{color:#fff;}
    [data-subarea="about"] #sec1 ul li:hover i{color:rgba(225,225,225,0.6);}
	*/
}
@media(min-width:768px){
   
}
@media(max-width:1024px){
    [data-subarea="about"] #sec1 ul{gap:0 20px;}
    [data-subarea="about"] #sec1 ul li{padding:50px 15px;}
    [data-subarea="about"] #sec1 ul span{--sizeWid:clamp(70px, calc(100 / 1024 * 100vw), 100px);}
    [data-subarea="about"] #sec1 p.right{width:auto;}
    [data-subarea="about"] #sec1 p.right > br{display:none;}
}
@media(max-width:767px){
    [data-subarea="about"] #sec1 ul{display:block; margin:60px 0;}
    [data-subarea="about"] #sec1 ul li{padding:40px 15px;}
    [data-subarea="about"] #sec1 ul li+li{margin-top:20px;}
    [data-subarea="about"] #sec1 ul em{margin:20px 0 5px;}
    [data-subarea="about"] #sec1 .img{margin:80px 0 60px;}
    [data-subarea="about"] #sec1 .img span{height:300px;}
    [data-subarea="about"] #sec1 .img h3{margin-top:calc(clamp(0px, calc(75 / 767 * 100vw), 75px) * -1); padding:0 20px; font-size:clamp(0px, calc(45 / 767 * 100vw), 45px);}
    #about1_sec2{margin-top:100px; padding-top:100px}
    #about1_sec2 .img{margin:20px 0;}
	[data-subarea="about"] #sec1 ul li[data-motion="01"].motion__in{transition-delay:0s;}
	[data-subarea="about"] #sec1 ul li[data-motion="02"].motion__in{transition-delay:0s;}
	[data-subarea="about"] #sec1 ul li[data-motion="03"].motion__in{transition-delay:0s;}
}
@media(max-width:580px){
	#about1_sec2 h4{word-break:keep-all;}
}
@media(max-width:390px){
	#about1_sec2 h4 br{display:none;}
}

/* film */
/* [data-subarea="film"]{ max-width: initial; width: initial; }
[data-subarea="film"] .sec + .sec{ margin-top: clamp(70px, calc( 175 / var(--inr) * 100vw ), 175px); }
[data-subarea="film"] .sec h3{ font-size: clamp(34px, calc( 45 / var(--inr) * 100vw ), 45px); letter-spacing: -.02em; }
[data-subarea="film"] .cont{ padding-top: 12px; }
[data-subarea="film"] .sec .body{ font-family: var(--font-kor); font-size: clamp(16px, calc( 18 / var(--inr) * 100vw ), 18px); font-weight: 300; line-height: 1.55555556; }
[data-subarea="film"] .sec .body + .body{ margin-top: 21px; }
[data-subarea="film"] .cont-stucture{ margin-top: 18px; display: grid; align-items: center; gap: clamp(40px, calc( 80 / var(--inr) * 100vw ), 80px); padding: 48px clamp(25px, calc( 71 / var(--inr) * 100vw ), 71px) 47px; background: linear-gradient(45deg, rgba(26,26,26,1) 0%, rgba(42,42,42,1) 100%); }
[data-subarea="film"] .features{ position: relative; margin-top: clamp(70px, calc( 200 / var(--inr) * 100vw ), 200px); padding: clamp(70px, calc( 200 / var(--inr) * 100vw ), 200px) 0 clamp(70px, calc( 192 / var(--inr) * 100vw ), 192px); background: #00070b no-repeat 50% / cover; text-align: center; text-wrap:balance; font-family: var(--font-kor); font-size: clamp(18px, calc( 22 / var(--inr) * 100vw ), 22px); font-weight: 600; word-break: keep-all; }
[data-subarea="film"] .features.f1{ background-image: url('/images/content/features1-bg.jpg'); }
[data-subarea="film"] .features.f2{ background-image: url('/images/content/features2-bg.jpg'); }
[data-subarea="film"] .features.f3{ background-image: url('/images/content/features3-bg.jpg'); }
[data-subarea="film"] .features::before{ content: ''; position: absolute; inset: 0; margin: auto; width: 1px; background: #232323; }
[data-subarea="film"] .features .inr{ position: relative; display: grid; row-gap: clamp(40px, calc( 77 / var(--inr) * 100vw ), 77px); z-index: 1; }
[data-subarea="film"] .features .circle{ margin: 0 auto 1.09090909em; display: flex; align-items: center; justify-content: center; aspect-ratio: 1; width: 8.18181818em; background: color-mix(in srgb, #000 30%, #0000); border: 1px solid #ebecee; border-radius: 50%; box-sizing: border-box; }
[data-subarea="film"] .features .icon{ height: 46.11111111%; }
[data-subarea="film"] .features small{ display: block; font-size: 0.81818182em; }
[data-subarea="film"] .coverage{ margin-top: clamp(70px, calc( 201 / var(--inr) * 100vw ), 201px); display: grid; gap: 40px 20px; font-family: var(--font-kor); font-size: clamp(16px, calc( 18 / var(--inr) * 100vw ), 18px); color: #f5f5f5; }
[data-subarea="film"] .coverage .wrapImg{ z-index: 1; }
[data-subarea="film"] .coverage .wrapCar{ position: sticky; top: 0; }
[data-subarea="film"] .coverage .wrapCar::before{ content: ''; position: absolute; inset: 0; margin: auto; aspect-ratio: 1; height: 42.95190713%; background: var(--color-point); border-radius: 50%; filter: blur(150px); z-index: -1; }
[data-subarea="film"] .coverage .list{ counter-reset: number; display: grid; gap: 1.11111111em; }
[data-subarea="film"] .coverage .list li{ padding: 1em 1.27777778em 1.11111111em; border: 1px solid #525253; }
[data-subarea="film"] .coverage .head{ font-size: 1.22222222em; font-weight: 600; } 
[data-subarea="film"] .coverage .head::before{ counter-increment: number; content: counter(number)'. '; }
[data-subarea="film"] .coverage .body{ margin-top: 0.38888889em; font-weight: 300; }
@media(hover:hover){
	[data-subarea="film"] .coverage .list li:hover{ border-color: var(--color-point); }
	[data-subarea="film"] .coverage .list li:hover .head{ color: var(--color-point); }
}
@media(min-width:768px){
	[data-subarea="film"] .cont-stucture{ grid-template-columns: 2fr 3fr; }
	[data-subarea="film"] .coverage .wrapImg{ position: relative; }
}
@media(min-width:1280px){
	[data-subarea="film"] .sec{ display: grid; grid-template-columns: calc( clamp(24px, calc( 45 / var(--inr) * 100vw ), 45px) * 8.4888889) 1fr; }	
	[data-subarea="film"] .features .inr{ grid-template-columns: repeat(4, 1fr); }
	[data-subarea="film"] .coverage{ grid-template-columns: 1fr 506px; }
	[data-subarea="film"] .coverage .car{ transform: translate(-8.35%,15.4%); }
}
@media(max-width:1279px){
	[data-subarea="film"] .sec .body br{ display: none; }
	[data-subarea="film"] .coverage .car{ transform: translateX(-4%); }
	@media(min-width:768px){
		[data-subarea="film"] .features .inr{ grid-template-columns: repeat(3, 1fr); }
		[data-subarea="film"] .coverage .list{ grid-template-columns: 1fr 1fr; }
	}
}
@media(max-width:767px){
	[data-subarea="film"] .features .inr{ grid-template-columns: repeat(2, 1fr); column-gap: clamp(20px, calc( 40 / var(--inr) * 100vw ), 40px); }
	[data-subarea="film"] .features .circle{ max-width: 95px; }
	[data-subarea="film"] .coverage .wrapImg{ position: sticky; top: 0px; padding: 20px 0; background: #101010; box-shadow: 0px 0px 27px 3px #101010; }
} */


/* Contact > 총판&대리점 */
[data-subarea="contact"] *{box-sizing:border-box;}
.contact2 h3.tit{margin-bottom:15px; font-size:clamp(20px, calc( 22 / var(--inr) * 100vw ), 22px);}
.contact2 .form{display:grid; grid-template-columns:repeat(3, 1fr); gap:50px;}
.contact2 .form li{position:relative;}
.contact2 .form select,
.contact2 .form input{position:relative; margin:0; width:100%; border:1px solid #dedede; border-radius:8px; font-size:clamp(16px, calc( 18 / var(--inr) * 100vw ), 18px); color:#444; height:60px;}
.contact2 .form select{padding:8px 50px 7px 20px; background:none; z-index:2; cursor:pointer;}
.contact2 .form .icoArrow{display:block; position:absolute; right:20px; top:50%; transform:translateY(-50%); width:15px; height:15px; pointer-events:none; z-index:1;}
.contact2 .form .icoArrow img{display:block; width:100%; height:100%; object-fit:contain;}
.contact2 .form input{padding:8px 20px 7px;}
.contact2 .form input::placeholder{color:#888;}
.contact2 .salesPr{margin:60px 0;}
.contact2 .salesPr ul{display:flex; justify-content:start; gap: 12px; padding:20px 0; border-top:1px dashed #dedede; border-bottom:1px dashed #dedede;}
.contact2 .salesPr input{display:none;}
.contact2 .salesPr input+label{cursor:pointer; display:flex; align-items:center; margin:0;}
.contact2 .salesPr input+label:before{content:''; display:block; width:20px; height:20px; border-radius:50%; border:1px solid #dedede; box-sizing:border-box;}
.contact2 .salesPr input:checked+label:before{background:#222 url(/images/common/icon_checkbox.svg)no-repeat center/contain; background-size:70%; border:none;}
.contact2 .salesPr span{display:block; margin-top:2px; padding-left:8px; font-size:clamp(16px, calc( 18 / var(--inr) * 100vw ), 18px); color:#444;}
.contact2 button.storeSearch{display:flex; margin:0 auto 80px; align-items:center; justify-content:center; width:260px; height:60px; background:#101010; font-size:clamp(16px, calc( 18 / var(--inr) * 100vw ), 18px); font-weight:500; color:#fff; border-radius:8px; transition:0.3s ease;}
.contact2 button.storeSearch img{display:block; margin-left:10px; width:20px;}
.contact2 button.storeSearch:hover{box-shadow:0 20px 30px rgba(0,0,0,.1);}
.contact2 .store{display:grid; grid-template-columns:repeat(3, 1fr); gap:clamp(20px, calc( 50 / var(--inr) * 100vw ), 50px);}
.contact2 .store > li{position:relative;}
.contact2 .store > li > a{display:block; position:relative; padding:50px 40px; height:100%; border-radius:12px; border:1px solid #dedede; transition:.3s;}
.contact2 .store > li > a:before{content:''; display:block; position:absolute; right:20px; top:30px; width:190px; height:40px; background:url(/images/common/logo_b.svg)no-repeat 0 0/contain; opacity:0.08;}
.contact2 .store > li > a:after{content:''; display:block; position:absolute; right:15px; bottom:15px; width:22px; height:22px; background:url(/images/content/icon_store_more.svg)no-repeat center/contain; opacity:0; transition:.3s;}
.contact2 .store > li em.storeName{display:block; margin-bottom:10px; font-size:clamp(16px, calc( 18 / var(--inr) * 100vw ), 18px); font-weight:600; color:var(--color-point);}
.contact2 .store > li h3.storeArea{margin-bottom:25px; font-size:clamp(22px, calc( 30 / var(--inr) * 100vw ), 30px); color:#000;}
.contact2 .store > li span.storePr{display:block; margin-bottom:45px; font-size:clamp(15px, calc( 17 / var(--inr) * 100vw ), 17px); color:#333;}

[data-subarea="contact"] .storeInfo li{display:flex; font-size:clamp(14px, calc( 16 / var(--inr) * 100vw ), 16px); color:#666;}
[data-subarea="contact"] .storeInfo li+li{margin-top:15px;}
[data-subarea="contact"] .storeInfo span{display:block; margin-top:2px; margin-right:10px; width:18px; height:18px;}
[data-subarea="contact"] .storeInfo img{display:block; width:100%; height:100%; object-fit:contain;}
[data-subarea="contact"] .storeInfo p{width:calc(100% - 28px);}

.contact2-01 *{box-sizing:border-box;}
.contact2-01 .store{display:flex;}
.contact2-01 .storeBox1{position:relative; width:50%; overflow:hidden; border-radius:12px;}
.contact2-01 .storeBox1 img{display:block; position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover;}
.contact2-01 .storeBox2{padding:20px 0 20px clamp(50px, calc( 80 / var(--inr) * 100vw ), 80px); width:50%;}
.contact2-01 .store_Area{font-size:clamp(22px, calc( 30 / var(--inr) * 100vw ), 30px); color:#000;}
.contact2-01 .store_Name{display:block; margin:35px 0 30px; font-size:clamp(17px, calc( 20 / var(--inr) * 100vw ), 20px); font-weight:600; color:var(--color-point);}
.contact2-01 .store_sns{display:flex; gap:0 20px; margin-top:30px;}
.contact2-01 .store_sns a{display:block; padding:40px 35px; width:120px; height:120px; background:#f6f6f6; border-radius:8px;}
.contact2-01 .store_sns img{display:block; width:100%; height:100%; object-fit:contain;}
.contact2-01 .store_btn{display:block; margin-top:50px; width:280px; height:60px; line-height:60px; color:#fff; background:#101010; font-weight:600; font-size:clamp(16px, calc( 18 / var(--inr) * 100vw ), 18px); transition:.2s; border-radius:8px; text-align:center; cursor:pointer;}
.contact2-01 .mapWrap{margin-top:150px;}
.contact2-01 .mapWrap .root_daum_roughmap{width:100% !important; height:660px;}
.contact2-01 .mapWrap .wrap_map{height:100% !important;}
.contact2-01 .mapWrap .map_border,
.contact2-01 .mapWrap .wrap_controllers{display:none;}

.reservationPopup{display:none; position:fixed; padding:60px 20px; top:50%; left:50%; transform:translate(-50%,-50%); z-index:5; background:#fff; max-width:760px; width:92%; border-radius:12px; border:1px solid #101010; box-shadow:20px 20px 100px rgba(0,0,0,0.2); box-sizing:border-box;}
.reservationPopup .close{position:absolute; right:20px; top:20px; padding:3px; width:25px; height:25px; cursor:pointer; box-sizing:border-box;}
.reservationPopup .storeArea{font-size:clamp(22px, calc( 30 / var(--inr) * 100vw ), 30px); color:#000; text-align:center;}
.reservationPopup .storeName{display:block; margin-top:8px; font-size:clamp(17px, calc( 20 / var(--inr) * 100vw ), 20px); text-align:center; font-weight:600; color:var(--color-point);}
.reservationPopup i{display:block; margin:35px auto 20px; width:130px; height:36px; line-height:35px; font-size:clamp(14px, calc( 16 / var(--inr) * 100vw ), 16px); color:#222; border:1px solid #101010; border-radius:20px; text-align:center; font-weight:500; box-sizing:border-box;}
.reservationPopup ul{margin:auto; width:410px;}
.reservationPopup input{height:58px; padding:7px 17px; border:1px solid #ddd; margin:0; box-sizing:border-box;}
.reservationPopup input::placeholder{color:#aaa;}
.reservationPopup input#id{border-top-left-radius:7px;border-top-right-radius:7px;}
.reservationPopup input#tel{border-top:0; border-bottom-left-radius:7px;border-bottom-right-radius:7px;}
.reservationPopup button{display:block; margin:40px auto 0; width:410px; height:60px; line-height:60px; color:#fff; background:#101010; font-weight:600; font-size:clamp(16px, calc( 18 / var(--inr) * 100vw ), 18px); transition:.2s; border-radius:8px; text-align:center; cursor:pointer;}

@media(hover:hover){
    .contact2 .store > li > a:hover{border-color:var(--color-point);}
    .contact2 .store > li > a:hover:after{opacity:1;}
    .contact2-01 .store_btn:hover{background:var(--color-point);}
    .contact2-01_reservation button:hover{background:var(--color-point);}
}
@media(max-width:1540px){
    .contact2 .store > li > a:before{width:100px;}
}
@media(max-width:1400px){
    .contact2-01 .store_sns a{padding:30px 25px; width:100px; height:100px;}
}
@media(max-width:1024px){
    .contact2 .form{gap:10px;}
    /* .contact2 .salesPr ul{display:grid; grid-template-columns:repeat(5, 1fr); gap:15px;} */
    .contact2 .salesPr ul{display:flex; gap:15px;}
    .contact2 button.storeSearch{height:50px;}
    .contact2 .store{grid-template-columns:repeat(2, 1fr); gap:20px;}
    .contact2 .store > li > a{padding:30px 20px;}
    .contact2-01 .storeBox1{width:55%;}
    .contact2-01 .storeBox2{padding:0 0 0 clamp(50px, calc( 80 / var(--inr) * 100vw ), 80px); width:45%;}
    .contact2-01 .store_Name{margin:15px 0 20px;}
    .contact2-01 .store_sns{margin-top:30px; gap:0 10px;}
    .contact2-01 .store_sns a{padding:15px 12px; width:60px; height:60px;}
    .contact2-01 .store_btn{margin-top:30px; width:200px; height:50px; line-height:49px;}
    .contact2-01 .mapWrap .root_daum_roughmap{height:450px;}
    .reservationPopup button{height:50px; line-height:49px;}
}
@media(max-width:860px){
    .contact2-01 .store{flex-direction:column-reverse;}
    .contact2-01 .storeBox1{width:100%;}
    .contact2-01 .storeBox1 img{position:relative;}
    .contact2-01 .storeBox2{margin-bottom:40px; padding:0; width:100%;}
    .contact2-01 .storeInfo{padding:25px 20px; border:1px solid #dedede; border-radius:12px;}
    .contact2-01 .store_Area{text-align:center;}
    .contact2-01 .store_Name{margin-top:8px; text-align:center;}
    .contact2-01 .store_sns{justify-content:center;}
    .contact2-01 .store_btn{margin:30px auto 0;}
}
@media(max-width:767px){
    .contact2 .form{grid-template-columns:repeat(2, 1fr);}
    .contact2 .form li.search{grid-column:1 / 3;}
    .contact2 .form select, .contact2 .form input{height:48px;}
    .contact2 .form select{padding:8px 30px 7px 10px;}
    .contact2 .form .icoArrow{width:12px; right:10px;}
    .contact2 .form input{padding:8px 10px 7px;}
    .contact2 .salesPr{margin:40px 0;}
    /* .contact2 .salesPr ul{display:grid; grid-template-columns:repeat(3, 1fr); gap:15px;} */
    .contact2 .salesPr ul{display:flex; gap:15px;}
    .contact2 .salesPr input+label:before{width:18px; height:18px;}
    .contact2 button.storeSearch{margin-bottom:50px; width:200px;}
    .contact2 .store{grid-template-columns:repeat(2, 1fr); gap:20px;}
    .contact2 .store > li > a{padding:30px 20px;}
    .contact2 .store > li > a:before{display:none;}
    .contact2 .store > li em.storeName{margin-bottom:5px;}
    .contact2 .store > li h3.storeArea{margin-bottom:20px;}
    .contact2 .store > li span.storePr{margin-bottom:30px;}
    [data-subarea="contact"] .storeInfo li+li{margin-top:10px;}
    [data-subarea="contact"] .storeInfo span{margin-right:8px; width:16px; height:16px;}
    [data-subarea="contact"] .storeInfo p{width:calc(100% - 24px)}
    .contact2-01 .store{flex-direction:column-reverse;}
    .contact2-01 .storeBox1{width:100%;}
    .contact2-01 .storeBox2{margin-bottom:50px; padding:0; width:100%;}
    .contact2-01 .mapWrap{margin-top:100px;}
    .contact2-01 .mapWrap .root_daum_roughmap{height:350px;}
}
@media(max-width:640px){
    /* .contact2 .salesPr ul{grid-template-columns:repeat(3, 1fr); gap:12px;} */
    .contact2 .salesPr ul{display:grid; grid-template-columns:repeat(1, 1fr); gap:12px;}
}
@media(max-width:580px){
    .contact2 .store{grid-template-columns:repeat(1, 1fr); gap:15px;}
    .reservationPopup{padding:40px 20px;}
    .reservationPopup .close{right:15px; top:15px;}
    .reservationPopup i{margin:20px auto 20px;}
    .reservationPopup ul{width:100%;}
    .reservationPopup button{margin-top:30px; width:100%;}
}


/* shops */
.wrapSearch{display:flex; flex-direction:row-reverse; box-sizing:border-box;}
[data-subarea="shops"]{ font-size: clamp(16px, calc( 18 / var(--inr) * 100vw ), 18px); }
[data-subarea="shops"] form{width:40%; display: grid; gap: 10px; padding: 60px clamp(30px, calc( 50 / var(--inr) * 100vw ), 50px); background: #000; box-sizing:border-box;}
[data-subarea="shops"] h3{ font-size: clamp(20px, calc( 30 / var(--inr) * 100vw ), 30px); font-weight: 600; letter-spacing: -.02em; }
[data-subarea="shops"] .subTitle{ margin: 0.3125em 0 2.1875em; font-size: clamp(14px, calc( 16 / var(--inr) * 100vw ), 16px); font-weight: 300; line-height: 1.5625; color: color-mix(in srgb, currentColor 80%, #0000); }
[data-subarea="shops"] :is(select, input){ margin: 0; padding: 0 30px 0 10px; height: 3.33333333em; background-color: #1a1a1a; border: 0; font-size: inherit; font-weight: 300; }
[data-subarea="shops"] select{ background: #1a1a1a url('/images/content/shops-select.png') no-repeat calc( 100% - 10px) 50% / 13px; }
[data-subarea="shops"] input::placeholder{ color: color-mix(in srgb, currentColor 60%, #0000); }
[data-subarea="shops"] [type="submit"]{ margin-top: 1.11111111em; display: flex; align-items: center; justify-content: center; gap: .5em; height: 3.33333333em; background: var(--color-point); font-size: inherit; }
[data-subarea="shops"] .icon-search{ width: 1em; }
[data-subarea="shops"] .search-map{width:60%; height:100%; background:#222; box-sizing:border-box; }
[data-subarea="shops"] .search-map .box_double.shop{height:100%; margin-bottom:0; box-sizing: border-box;}
[data-subarea="shops"] .search-map .box_double.shop div.map{float:initial; margin:0 auto; background:#222; width:100%; height:100%; padding-top:50px;}
[data-subarea="shops"] .box_double.shop div.map .nation{background: url(../images/module/img_map01_01.png) no-repeat 50% 0;}
[data-subarea="shops"] .box_double.shop div.map .jeju:after{background: url(../images/module/img_map02_01.png) no-repeat 50% 0;}
[data-subarea="shops"] .box_double.shop div.map .jeju{border-color:#4f4f4f;}
[data-subarea="shops"] .box_double.shop div.map .jeju:before{background:#4f4f4f;}
[data-subarea="shops"] .box_double.shop div.map a[data-map]{background:#14a9ff;}
[data-subarea="shops"] .wrapTable{ overflow: auto; margin-top: clamp(70px, calc( 100 / var(--inr) * 100vw ), 100px); }
[data-subarea="shops"] col:nth-child(1){ width: 12.5%; }
[data-subarea="shops"] col:nth-child(2){ width: 20%; }
[data-subarea="shops"] col:nth-child(4){ width: 16.25%; }
[data-subarea="shops"] thead{ background: #222; }
/*[data-subarea="shops"] :where(th, td){ height: 3.61111111em; padding: 0 1.05555556em; box-sizing: border-box; }*/
[data-subarea="shops"] td{ border-bottom: 1px solid #585858; text-align: center; }
/*[data-subarea="shops"] td:has(.btn){ display: flex; align-items: center; justify-content: space-between; gap: 2ch; text-align: left; word-break: keep-all; }*/
[data-subarea="shops"] td + td{ border-left: 1px dashed #585858; }
[data-subarea="shops"] .btn{ flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px 6px 15px; font-size: 15px; font-weight: 300; }
[data-subarea="shops"] .icon-location{ height: 1em; }
[data-subarea="shops"] [href^="tel:"]{ white-space: nowrap; }
[data-subarea="shops"] .btn{ background: #112f40; color: #fff; }
:is(html, body):has(dialog[open]) #header{ z-index: 0; }
[data-subarea="shops"] dialog{ position: fixed; inset: 0; margin: 0; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 0; background: color-mix(in srgb, currentColor 60%, #0000); border: 0; outline: none; z-index: 100; }
[data-subarea="shops"] dialog .inr{ display: flex; justify-content: center; flex-wrap: wrap; gap: 50px 20px; box-sizing: border-box; }
[data-subarea="shops"] dialog[open]{ display: flex; }
[data-subarea="shops"] dialog .modal-map{ width: 100%; max-height: 800px; background: gold; }
[data-subarea="shops"] dialog :where(.kakaoMap, .close){ display: flex; align-items: center; justify-content: center; gap: 0.44444444em; border-radius: 5em; font-size: inherit; font-weight: 500; color: #111; }
[data-subarea="shops"] dialog .kakaoMap{ padding: 0.63888889em 1.88888889em 0.63888889em 2.05555556em; background: #fae100; }
[data-subarea="shops"] dialog .close{ padding: 0.63888889em 1.44444444em 0.63888889em 1.55555556em; background: #fff; }
[data-subarea="shops"] dialog .close-icon{ width: 0.94444444em; }
.wrapTable td[data-shop="address"]{text-align:left;}
.wrapTable td[data-shop="address"] .btn{margin-left:10px; float:right;}
@media(min-width:768px){
	[data-subarea="shops"] form{grid-template-columns: 1fr 1fr; box-sizing:border-box; }
	[data-subarea="shops"] form *:not(select){ grid-column: 1 / 3; }
	[data-subarea="shops"] .modal-map{ height: 80vh; }
}
@media(max-width:768px){
    .wrapSearch{display:grid;}
	[data-subarea="shops"] form{order:2; width:100%; }
	[data-subarea="shops"] .search-map{order:1; width:100%;}
}
@media(min-width:1280px){
    /*[data-subarea="shops"] .wrapSearch{ display: grid; grid-template-columns: 51fr 109fr; }*/
    [data-subarea="shops"] .wrapSearch{display:flex; flex-direction:row-reverse; width:100%;}
	[data-subarea="shops"] .subTitle{ max-width: 37ch; }
}
@media(max-width:767px){
	[data-subarea="shops"] .search-map{ aspect-ratio: 1; }
	[data-subarea="shops"] .wrapTable{ margin-inline: -4vw; padding-inline: 4vw; }
	[data-subarea="shops"] .modal-map{ aspect-ratio: 1; }
}
@media screen and (max-width:640px){
    .wrapTable .bbsList tr{border-color:#4747;}
    .wrapTable .bbsList tr:nth-child(2n){background:none;}
    .wrapTable [data-subarea="shops"] td + td{border-color:#4747;}
    .wrapTable td[data-shop="name"]{background:var(--primary); color:#fff;}
    .wrapTable td[data-shop="area"]{color:#fff;}
    .wrapTable td[data-shop="name"]{border-bottom:none !important; background: #112f40;}
    .wrapTable td[data-shop="name"] a{color:#fff;}
    .wrapTable td[data-shop="tel"]{display:inline-block; position:static;}
    .wrapTable td[data-shop="address"]{display:flex;}
    .wrapTable td[data-shop="address"] .btn{margin-left:auto;}
}
/* support */
[data-subarea="support"] .support{ margin: 0 auto; max-width: 500px; text-align: center; }
[data-subarea="support"] [role="tablist"]{ display: grid; grid-template-columns: 1fr 1fr; font-size: clamp(16px, calc( 20 / var(--inr) * 100vw ), 20px); font-weight: 500; letter-spacing: -.02em; }
[data-subarea="support"] [role="tab"]{ position: relative; padding: 14px; border-bottom: 1px solid #585858; cursor: pointer; }
[data-subarea="support"] [aria-selected="true"]::before{ content: ''; position: absolute; inset: auto 0 -1px; height: 2px; background: currentColor; }
[data-subarea="support"] [aria-selected="false"]{ color: color-mix(in srgb, currentColor 50%, #0000); }
[data-subarea="support"] form{ margin-top: 2.11111111em; font-size: clamp(14px, calc( 18 / var(--inr) * 100vw ), 18px); }
[data-subarea="support"] [aria-hidden="true"]{ display: none; }
[data-subarea="support"] input{ display: block; margin: 0; padding: 10px; width: 100%; height: 3.33333333em; background:#f5f5f5; border: 0; font-size: inherit; }
[data-subarea="support"] input + input{ margin-top: 0.55555556em; }
[data-subarea="support"] input::placeholder{ font-weight: 300; color: color-mix(in srgb, currentColor 60%, #0000); }
[data-subarea="support"] [type="submit"]{ margin-top: 1.66666667em; display: flex; justify-content: center; align-items: center; width: 100%; height: 3.33333333em; background: #000; border: 1px solid #585858; text-align: center; font-size: inherit; font-weight: 500; color: #fff; }

/* 보증서 */
.table_management{display: flex; flex-wrap: wrap;padding: 40px; box-sizing: border-box; border: 1px solid #eee;}
.table_management .tr{width: 50%; display: table; padding:16px 20px; box-sizing: border-box; /* border-bottom: 1px solid #363636 */}
.table_management .tr > * {display: table-cell; vertical-align: middle; font-weight:normal;}
.table_management .tr.type02{width: 100%;}
.table_management .tr .th{width: 150px;}
.table_management .tr .td{width: calc(100% - 150px);}

.table_management .tr .area_select{display: flex; flex-wrap: wrap;}
.table_management .tr .area_select .part_ppf{display:flex; flex-wrap:wrap; align-items:center; gap:5px 20px;}
.table_management .tr .area_select .part_ppf input{margin-top:0;}
.table_management .tr .area_select > .part{width: calc(25% - 14px); display: table;}
.table_management .tr .area_select > .part + .part{padding-left: 18px;}
.table_management .tr .area_select > .part:nth-child(5n){padding-left: 0;}
.table_management .tr .area_select > .part > *{display: table-cell;}
.table_management .tr .area_select select{width: 100%; font-weight: 200;}
.table_management .tr .td.const_price_wrap{display:inline-flex;}
.table_management .tr .td.const_price_wrap .unit{display:inline-block; padding-left:8px; padding-top:10px;}
.table_management .part_ppf > span{display:inline-block;}

/* 보증서 조회 모달 */
.modal .table_management{background-color: #fff; padding: 0; border:0;}
.modal .table_management > dl{width: 100%; display: table; border-top: 1px solid #e1e1e1;}
.modal .table_management > dl:last-child{border-bottom: 1px solid #e1e1e1;}
.modal .table_management > dl > *{display: table-cell; vertical-align: middle}
.modal .table_management > dl > dt{text-align: center; background-color: #f5f5f5; width: 180px; border-right: 1px solid #e1e1e1;}
.modal .table_management > dl > dt em{color:#d32b2b}
.modal .table_management > dl > dd{width: calc(100% - 180px); padding: 20px 0  20px 16px }
.modal .table_management > dl > dd > div{display: flex;}
.modal .table_management > dl > dd > div > div.part{width: auto}
.modal .table_management > dl > dd > div > div.part  + div{padding-left: 18px;}
.modal .table_management > dl > dd > div + div.part_ppf{margin-top: 12px;}
.modal .table_management > dl > dd > div.part_ppf{flex-wrap: wrap;}
.modal .table_management > dl > dd > div.part_ppf > div.part{width: 16.666%;}
.modal .table_management > dl > dd > div.part_ppf > div.part + div{padding-left: 0}

.modal .table_management  dd.tt_dd{padding: 0;}
.modal .table_management  dd.tt_dd > div.part_tt{flex-wrap: wrap; }
.modal .table_management  dd.tt_dd > div.part_tt > div.part{width:50%; align-items: center; box-sizing: border-box; padding: 0; }

.modal .table_management  dd.tt_dd > div.part_tt > div.part label{width:82px; height: 100%; background-color: #f5f5f5; display: flex; align-items: center;  padding: 16px; }
.modal .table_management  dd.tt_dd > div.part_tt > div.part select{width: 100%;}
.modal .table_management  dd.tt_dd > div.part_tt > div.part div{width: calc(100% - 82px);  padding: 10px;}
.modal .table_management  dd.tt_dd > div.part_tt > div.part:nth-child(1),
.modal .table_management  dd.tt_dd > div.part_tt > div.part:nth-child(2),
.modal .table_management  dd.tt_dd > div.part_tt > div.part:nth-child(3),
.modal .table_management  dd.tt_dd > div.part_tt > div.part:nth-child(4){border-bottom: 1px solid #e1e1e1;}
.modal .table_management  dd.tt_dd > div.part_tt > div.part:nth-child(5){padding-left: 0;}

.modal .table_management  dd.tt_dd > div.part_tt > div.part.designCheck{margin: 0;}
.modal .table_management  dd.tt_dd > div.part_tt > div.part div{width: auto;  padding: 10px;}
.modal .table_management  dd.tt_dd > div.part_tt > div.part select{width: auto; display: inline-block; vertical-align: middle;}
.modal .table_management  dd.tt_dd > div.part_tt > div.part select span{display: inline-block; vertical-align: middle;}
.modal .table_management  dd.tt_dd > div.part_tt > div.part:nth-child(3){width: 100%; border-top: 1px solid #e1e1e1;}
.modal .table_management  dd.tt_dd > div.part_tt > div.part:nth-child(3) > div.sun{width: calc(100% - 120px); display: flex; align-items: center;}
.modal .table_management  dd.tt_dd > div.part_tt > div.part:nth-child(3) > div.sun > div{width: 45%; padding: 10px 0;}
.modal .table_management  dd.tt_dd > div.part_tt > div.part:nth-child(3) > div.sun select{margin-left: 12px;}
.modal .table_management  dd.tt_dd > div.part_tt > div.part:nth-child(3) > div.sun em{display: inline-block; vertical-align: middle;}
.modal .table_management  dd.tt_dd > div.part_tt > div.part span.warranty_limit{font-size:12px; color:#9e9e9e; font-weight: 500;}
.modal .table_management  dd textarea{width: 100%; height: 120px;}
.modal .table_management select{font-weight: 400; font-size:12px;}
.modal .table_management .part{display: flex; align-items: center;}
.modal .table_management .td{margin-left: 12px; word-break: keep-all;}

.modal .table_management > dl > dd.priceWrap{padding: 0 16px}
.modal .table_management > dl > dd > div.price_box{flex-wrap: wrap; padding: 16px 0;}
.modal .table_management > dl > dd > div.price_box + div.price_box{border-top: 1px dashed #e1e1e1;}
.modal .table_management > dl > dd > div.price_box > div.part{width:auto;}
.modal .table_management > dl > dd > div.price_box > *:nth-child(4) > label{width: 24px;}
.modal .table_management > dl > dd > div.price_box > *:nth-child(4) > .td{width: calc(100% - 30px);}


@media (max-width:1240px){
    .table_management{padding:10px}
    .table_management .tr .area_select > .part{width: calc(50% - 14px); padding-left: 0;}
    .table_management .tr .area_select > .part + .part{padding-left: 0;}
    .table_management .tr .area_select > .part:nth-child(2n){padding-left: 18px;}
    .table_management .tr .th{width: 120px;}
    .table_management .tr .td{width: calc(100% - 120px);}

    .modal .table_management dd.tt_dd > div.part_tt > div.part{width:50%;}
    .modal .table_management dd.tt_dd > div.part_tt > div.part label{width:120px ;}
    .modal .table_management dd.tt_dd > div.part_tt > div.part div{width: calc(100% - 120px);}
    .modal .table_management dd.tt_dd > div.part_tt > div.part:nth-child(5),
    .modal .table_management dd.tt_dd > div.part_tt > div.part:nth-child(6){border-bottom: 1px solid #e1e1e1;}

    .modal .table_management  dd.tt_dd > div.part_tt > div.part:nth-child(3) > div.sun > div{width: 50%;}
    .modal .table_management > dl > dd > div.price_box > div.part + div{padding-left: 0;}
    .modal .table_management > dl > dd > div.price_box .designCheck{margin:12px 0}
    .modal .table_management > dl > dd > div.price_box > div.part{width: 50%;}

    .modal .table_management > dl > dd > div.car_type{flex-wrap: wrap;}
    .modal .table_management > dl > dd > div > div.part + div:last-child{padding-left: 0; width: 100%;}

}
@media (max-width:1024px){
    .modal .table_management > dl > dd > div.part_ppf > div.part{width: 25%;}
    .modal .print_button{display: none;}
    .modal .table_management dd.tt_dd > div.part_tt > div.part:nth-child(3) > div.sun em{display: block;}
    .modal .table_management dd.tt_dd > div.part_tt > div.part:nth-child(3) > div.sun select{margin-left: 0;}
}
@media (max-width:960px){
    .modal .table_management > dl > dd > div.part_ppf > div.part{width: 33.333%;}
    .modal .table_management > dl > dd > div{flex-wrap: wrap;}
    .modal .table_management > dl > dd > div > div.part{width: 100%;}
    .modal .table_management > dl > dd > div > div.part + div{padding-left: 0;}

    .modal .table_management dd.tt_dd > div.part_tt > div.part{width:100%;}
    .modal .table_management dd.tt_dd > div.part_tt > div.part label{width:80px ;}
    .modal .table_management dd.tt_dd > div.part_tt > div.part div{width: calc(100% - 80px);}
    .modal .table_management dd.tt_dd > div.part_tt > div.part:nth-child(7){border-bottom: 1px solid #e1e1e1;}

    .modal .table_management dd.tt_dd > div.part_tt > div.part.designCheck:nth-child(1){border-bottom: 1px solid #e1e1e1!important;}
    .modal .table_management dd.tt_dd > div.part_tt > div.part:nth-child(3) > div.sun{width: calc(100% - 80px); flex-wrap: wrap; padding: 0;}
    .modal .table_management dd.tt_dd > div.part_tt > div.part:nth-child(3) > div.sun > div{width: 100%; padding: 10px;}
    .modal .table_management dd.tt_dd > div.part_tt > div.part:nth-child(3) > div.sun > div + div{border-top: 1px solid #e1e1e1;}
    .modal .table_management > dl > dd > div.price_box > div.part{width: 100%;}
}
@media (max-width:768px){
    .table_management .tr{width: 100%; padding: 8px 0;}
    .table_management .tr .area_select > .part{width: 100%;}
    .table_management .tr .area_select > .part:nth-child(2n){padding-left: 0;}
}
@media (max-width:640px){
    .modal .table_management > dl > *,.modal .table_management > dl{display: block;}
    .modal .table_management > dl > dt{width: 100%; padding:16px 0; border-right: 0; border-bottom: 1px solid #e1e1e1;}
    .modal .table_management > dl > dd{width: 100%; padding: 20px 0;}
    .modal.modify_modal .table_management > dl > dd.ab_mob .part{padding: 6px 0;}
    .modal .table_management dd.tt_dd > div.part_tt > div.part:nth-child(3) > div select{margin-left: 0;}
    .modal .table_management dd.tt_dd > div.part_tt > div.part:nth-child(3) > div{width: 100%;}
    .as_sec > h3{word-break: keep-all; font-size: 20px;}
    .as_sec:nth-child(1) > strong{font-size: 16px; word-break: keep-all;} 
}
@media (max-width:340px){
	.bbsView input[data-form-type="datepicker"],
	input.datepicker,
	.bbsView input[type="text"].datepicker{width:calc(100% - 45px) !important;}
}


/* .above_form{padding-bottom: 60px;} */
.above_form .area_btn{display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:3px; padding: 40px 0; text-align:center;}
.above_form .area_btn button,
.above_form .area_btn .button{display:flex; justify-content:center; align-items:center; gap:10px; min-width:180px; height:60px; line-height:1.2; box-sizing:border-box; background-color:#151411; border:1px solid #151411; border-radius:8px; color:#fff; font-size:clamp(16px, calc( 18 / var(--inr) * 100vw ), 18px); text-align:center; font-weight:500; cursor:pointer; transition:0.2s ease-in-out;}
.above_form .area_btn button.send{min-width:260px;}
.above_form .area_btn button:hover,
.above_form .area_btn .button:hover{box-shadow:0 20px 30px rgba(0,0,0,.1);}
.above_form .area_btn button img,
.above_form .area_btn .button img{width:20px;}

.area_conditon{text-align: center; padding-bottom: 20px;}
.area_conditon button{background: transparent; font-size:1.2rem; display: inline-block; margin: 0 24px; font-weight: 400;}
.area_conditon button.on{border-bottom: 2px solid var(--color-point);}

.area_table_list{padding-top:60px; border-top: 1px dashed #dadada; font-size:15px;}
.area_table_list .area_tbTop{display: flex; justify-content: space-between; padding-bottom: 18px; align-items: center;}
.area_table_list .area_tbTop button{cursor: pointer; border: 1px solid #9e9e9e;font-size: 13px;background-color: #151411; display: inline-block;font-weight: 200;padding: 8px 16px;}
.area_table_list .area_tbTop button i{width: 14px;height: 14px;background: url(../images/content/plus.svg)no-repeat;background-size: 13px 15px;display: inline-block;margin-left: 12px;position: relative;top: 2px;}
.area_table_list .area_tbTop em{color:var(--color-point); font-weight: 600; display: inline-block;}

.area_table_list table tr{border-bottom: 1px solid #dedede;}
.area_table_list table th{padding:16px}
.area_table_list table td{text-align: center; font-size: 14px; color:rgba(19,19,19,0.8); padding: 15px 10px; transition: all .2s;}
.area_table_list table thead tr{border-top: 1px solid #111; border-bottom: 1px solid #dedede; }
.area_table_list table thead th{background-color:rgba(19,19,19,0.05); color:#101010; font-weight: 500;}
.area_table_list table tbody tr:hover td{color:rgba(19,19,19,1);}
@media (max-width:1024px){ 
	.above_form .area_btn button,
	.above_form .area_btn .button{height:50px;}
}
@media (max-width:768px){         
    .area_table_list .table_wrap{overflow-x: hidden;}
    .area_table_list .table_wrap table{width: 100%}
    .area_table_list .table_wrap table thead{display: none;}
    .area_table_list .table_wrap table tbody tr{padding:10px 0; display: block;}
    .area_table_list .table_wrap table tbody tr:first-child{border-top:1px solid #101010;}
    .area_table_list .table_wrap table tbody td{display:flex; justify-content:flex-start; gap:5px; position:relative; width:100%; padding:4px 0; font-weight:500; text-align:left;}
    .area_table_list .table_wrap table tbody td:last-child{justify-content:flex-end;}
    .area_table_list .table_wrap table td::before{flex:none; min-width:80px;}
    .area_table_list .table_wrap table td.num::before{content: "번호";}
    .area_table_list .table_wrap table td.name::before{content: "이름";}
    .area_table_list .table_wrap table td.phone::before{content: "핸드폰 번호";}
    .area_table_list .table_wrap table td.car::before{content: "차종";}
    .area_table_list .table_wrap table td.position::before{content: "틴팅부위";}
    .area_table_list .table_wrap table td.date::before{content: "날짜";}
    .area_table_list .table_wrap table td.company::before{content: "시공사";}
    .area_table_list .table_wrap table td.condition::before{content: "처리상태";}    
}
@media (max-width:480px){
    .table_management .tr > *{display: block; width: 100%!important;}
    .table_management .tr .th{margin-bottom: 4px;}
    .table_management .tr .area_select label{font-size: 14px;}
    .above_form .area_btn button{width: 100%;}
	.area_table_list .table_wrap table tbody td:last-child{justify-content:center; padding-top:10px;}
}


/* 정품조회 뷰 */
.area_checkview{border: 1px solid #505050; position: relative; box-sizing: border-box; padding: 40px; margin-top:60px;}
.area_checkview i{width: 197px; height: 33px; background: url(../images/common/logo.svg)no-repeat; position: absolute; top: 30px; left: 30px;}
.area_checkview .logo{display:none;}
.area_checkview .check_top{display:none; text-align: center; padding-bottom:30px;}
.area_checkview .check_top strong{font-size:22px; font-weight: 500; line-height: 1.4; display: block; margin-bottom: 8px;}
.area_checkview .check_top p{font-weight: 200; color:#cfcfcf}  
.area_checkview .check_top h5{font-size:clamp(30px, calc(45 / var(--inr) * 100vw), 45px); font-weight: 500; color:#111;}

.area_checkview .manage .num{margin-bottom: 12px; text-align: right;}
.area_checkview .manage .num em{color:var(--color-point);; font-weight: 600; display: inline-block;}
.area_checkview .manage dl + dl{padding-top: 20px;}
.area_checkview .manage dl dt{/* padding-bottom: 6px; */padding: 8px 16px;/* border-bottom: 1px solid #707070; */background: rgb(62 62 62 / 57%);}
.area_checkview .manage dl dt > br{display: none;}

.area_checkview .manage dl dd {padding: 8px 16px;}
.area_checkview .manage dl dd > div{ display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex;}
.area_checkview .manage dl dd > div > .part{flex:0 1 calc(100% / 3); display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex; }
.area_checkview .manage dl dd > div > .part.address{width:50%;}
/* .area_checkview .manage dl dd > div > .part + .part{margin-left: 12px;} */
.area_checkview .manage dl dd > div > .part label{flex:none; min-width:30px; font-weight: 300; opacity: 0.65;}
.area_checkview .manage dl dd > div > .part .td{color:#fff; word-break:break-all;}
.area_checkview .manage dl dd > div > .part label+ .td{margin-left: 12px;}
.area_checkview .carea_checkview_car{text-align:center; margin:40px 0;display:none;}
.area_checkview .carea_checkview_car img{max-width:50% !important;}
.construction-print	.area_checkview .logo{display:block;}
.construction-print .check_top{display:block;}					  

/* 틴틴시공 */
.area_checkview .manage dl dd.ab_mob > div > .part label{opacity: 1;}

/* 틴팅필름 */
.area_checkview .manage dl dd.tt_dd > div.part_tt{flex-wrap: wrap;}
.area_checkview .manage dl dd.tt_dd > div.part_tt .part{width: 50%;padding: 12px 0;}
.area_checkview .manage dl dd.tt_dd > div.part_tt .part + .part{margin-left: 0}
.area_checkview .manage dl dd.tt_dd > div.part_tt .part > label{width: 120px;}
.area_checkview .manage dl dd.tt_dd > div.part_tt .part > div{width: calc(100% - 120px);}
.area_checkview .manage dl dd.tt_dd > div.part_tt .part > div .warranty_limit{/* display: block; */ font-size:12px}

/* 프로텍션 필름 */
.area_checkview .manage dl dd.ab_mob > div.part_ppf {flex-wrap: wrap;}
.area_checkview .manage dl dd.ab_mob > div.part_ppf .part{width: 20%; padding:6px 0}
.area_checkview .manage dl dd.ab_mob > div.part_ppf .part + .part{margin-left: 0;}

.area_checkview .ddetail{margin-top: 30px; text-align: center;}
.area_checkview .ddetail p{font-size:14px; opacity: 0.6;}

/* 시공확인서 > 화이트 */
[data-color="white"] .area_checkview{color:#111; background:#fff;}
[data-color="white"] .area_checkview i{background-image:url('/images/common/logo_b.svg');}
[data-color="white"] .area_checkview .num{position:absolute; right:30px; top:30px; font-weight:500; font-size:18px;}
[data-color="white"] .area_checkview .num::before{content:"시공확인서 No."; display:inline-block; padding-right:6px; font-weight:400;}
[data-color="white"] .area_checkview .manage dl dt{font-weight:600; background:rgb(242 242 242);}
[data-color="white"] .area_checkview .manage dl dd > div > .part label{opacity:1;}
[data-color="white"] .area_checkview .manage dl dd > div > .part .td{color:#111;}
@media screen and (max-width:1300px){
	.area_checkview .manage dl dd > div{flex-wrap:wrap;}
	.area_checkview .manage dl dd > div > .part{flex:1 1 calc(100% / 2);}
}
@media screen and (max-width:960px){
    .area_checkview .manage dl dd > div{flex-wrap: wrap;}
    .area_checkview .manage dl dd > div > .part{width: 50%; padding: 8px 0;}
    .area_checkview .manage dl dd > div > .part.address{width:100%;}
	.area_checkview .carea_checkview_car{margin-bottom:10px;}
	.area_checkview .carea_checkview_car img{max-width:80% !important;}
}
@media screen and (max-width:768px){
    .area_checkview .manage dl dd.ab_mob > div.part_ppf .part{width: 25%;}
    .area_checkview .manage dl dd.tt_dd > div.part_tt .part{width: 100%; padding: 6px 0;}
}
@media screen and (max-width:640px){    
    /* 보증서 */
    .area_checkview .manage .num{text-align: left;}
    .area_checkview .check_top strong{font-size:18px}
    .area_checkview .check_top p {display: inline;}
    .area_checkview .check_top p br{display: none;}
    .area_checkview{padding: 20px;}
    .area_checkview .manage dl dd > div{flex-wrap: wrap;}
	.area_checkview .manage dl dd > div > .part{flex:1 1 100%;}
    .area_checkview .manage dl dd > div > .part,
    .area_checkview .manage dl dd > div > .part.address{width: 100%; padding: 4px 0;}
    .area_checkview .manage dl dd > div > .part + .part{margin-left: 0;}
    .area_checkview .manage dl dd.ab_mob > div.part_ppf .part{width: 50%;}
    .area_checkview .manage dl dd.tt_dd > div.part_tt .part{display: block;}
    .area_checkview .manage dl dd.tt_dd > div.part_tt .part > div{width: 100%;}
    .area_checkview .manage dl dd.tt_dd > div.part_tt .part > div .warranty_limit{display: inline;}
    .area_checkview i{width: 137px; height: 23px; background-size:cover}
    .area_checkview .check_top h5{font-size:clamp(25px, calc(30 / 640 * 100vw), 30px);}
    [data-color="white"] .area_checkview i{width:197px; background-size: contain;}
	.construction-print .check_top{padding-top:50px;}
}
@media screen and (max-width:500px){
    [data-color="white"] .area_checkview .num{top:152px; right:22px; font-size:16px; line-height:1.25;}
    [data-color="white"] .area_checkview i{position:relative; right:initial; left:initial; margin:0 auto; width:100%; height:14px; background-size: contain; background-position-x: center;}
    [data-color="white"] .area_checkview .check_top{padding-bottom:60px;}
}
@media screen and (max-width:420px){
	.area_checkview .manage dl dd > div > .part{flex-wrap:wrap;}
	.area_checkview .manage dl dd > div > .part label{flex:1 1 100%;}
	.area_checkview .manage dl dd > div > .part label+ .td{margin-left:0;}
	.area_checkview .manage dl + dl{padding-top:10px;}
}

.area_bar > .scroll-element div{background-color: rgba(255, 255, 255, 0.22);}
.area_bar > .scroll-element.scroll-y{right:auto; left: 0; width: 2px;}
.area_bar > .scroll-element .scroll-element_outer {opacity: 1;}
.area_bar > .scroll-element.scroll-y .scroll-bar{width: 2px; background-color:#9cc4e4}
.area_bar > .scroll-element.scroll-y:hover .scroll-element_outer,
.area_bar > .scroll-element.scroll-y.scroll-draggable .scroll-element_outer {min-width: 2px;width: 2px;}


/* 인쇄하기 */
.check_button{text-align: center; padding-top: 40px;}
.check_button > button{background: #151411; min-width:150px; height: 45px;line-height: 43px;border: 1px solid #464646;padding: 0px 26px; color:#fff;display: inline-block;z-index: 1;position: relative;}
.check_button > button.print{padding-left:54px;}
.check_button > button.print i{width: 20px;height: 20px;background-image: url(../images/content/icon_print.svg);background-size: cover;display: block;position: absolute;left: 19px;top: 11px; filter:grayscale(1) brightness(2);}
@media (max-width:1024px){
    /* 정품 인쇄 버튼  
    .check_button{display: none;}
	*/
}

#modal select.view_mode{ font-weight: 500; color:#9e9e9e; opacity: 1; padding:0}
#modal .tt_dd select.view_mode{height: inherit;}


/* 인쇄미리보기 check box */
.check_box{width:16px; height:16px; overflow:hidden; position:relative; margin-right:4px;}
.check{position:absolute; left:0px; top:0px;}
.uncheck{position:absolute; left:0px; top:-16px;}
.check_name{line-height:16px;}

@media (max-width:640px){
    .area_shop_Container{padding:40px 0}  
}

@page{size:A4; margin:10mm;} 
@media print{	
	*{-webkit-print-color-adjust:exact; print-color-adjust:exact;}
	html,
	body{width:210mm; height:auto; border:0; margin:0; padding:0; background-color:transparent; font-size:12pt;} 
	#wrap > *:not(#container),
	.check_button{display:none;}
	#wrap{width:1024px;}
	#container,
	#content > .inr, 
	[data-subarea]{width:100%; box-sizing:border-box; margin:0;}
	#content[data-print]{width:initial; min-height:initial; box-sizing:border-box; -moz-box-sizing:border-box; padding:0 !important; margin:0 !important; border-radius:0px !important; background:transparent !important;}
	[data-subarea="construction"]{width:100%; max-width:100%;}
	.board_title{display:none;}
	.area_checkview{margin-top:0; border-width:0; padding:0;}
	.area_checkview .check_top{padding-bottom:20px;}
	.area_checkview .check_top h5{padding-top:30px; font-size:26pt;}
	.area_checkview .carea_checkview_car img{width:60%;}
	.area_checkview .manage dl dd > div{flex-wrap:wrap;}
	.area_checkview .manage dl dd > div > .part{flex:1 1 calc(100% / 2);}	
	.certi-guide{position:relative; display:block;}
	.certi-guide p{word-break:keep-all; padding-right:150px;}
	.certi-guide .img{position:absolute; top:45%; right:0px; transform:scale(0.7) translateY(-50%);}
	/* .certi-guide p br{display:none;} */
}

/* 시공확인서 등록 */
.table_management .tit{display:block; width:100%; margin:34px 0 14px;}
.table_management .tit p{padding:8px 20px; font-size:19px; font-weight:500; border-bottom:1px solid #444;}
.const_register{border:0;}
.const_register .part{ width:25%; display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex; }
.const_register .part.address{width:55%;}
.const_register .part label{min-width:30px; font-weight: 300;}
.const_register .part .td{color:#fff}
.const_register .part label+ .td{margin-left: 12px;}
.const_register .part .check_box{margin-right:6px;}
.const_register .part_ppf{display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex;}
.const_film_wrap.construct .td > div {display:inline-flex; flex-wrap:wrap; align-items:center;}
.const_film_wrap.construct .td > div input{margin:0 6px 8px 0;}
.const_film_wrap.construct .td > div label{margin-bottom:8px;}
.const_film_wrap.construct .td > div.etc{flex-wrap:nowrap; align-items:center;}
.const_film_wrap.construct .td > div.etc input[type=text]{width:100%;}
.const_film_wrap.construct .td > div.etc input[type=checkbox] + label, 
.const_film_wrap.construct .td > div.etc input[type=radio] + label{margin-right:14px; min-width:32px;}
@media (max-width:1240px){
    .const_register{padding:0; border:0;}
    .const_register .tr{width:100%;}
    .const_register .tit p{padding:8px 0;}
    .const_register .td.phone{display:flex; flex-wrap: wrap; justify-content: space-between; width:100%; box-sizing: border-box;}
    .const_register .td.phone select,
    .const_register .td.phone input{flex: 1;}
    .const_register .td.phone span{text-align:center; width:5%; line-height:2.45;}
    .const_register .tr .td.const_price_wrap{width:100%;}
}
@media (max-width:860px){
    .const_register .const_film_wrap .part_ppf{flex-direction: column; gap:16px;}
    .const_register .const_film_wrap .td .part{width:100%;}
}

/* 총판&대리점 */
.distributor *{ letter-spacing: -.025em; }
.distributor .lead{ font-size: clamp(16px, calc( 24 / var(--inr) * 100vw ), 24px); }
.distributor .tip{ margin-top: 1.88888889em; font-size: clamp(14px, calc( 18 / var(--inr) * 100vw ), 18px); color: #444; }
.distributor .tip-arrow{ margin-right: .4ch; font-size: 0.72222222em; color: var(--color-point); vertical-align: middle; }
.distributor .tip-separation{ margin: 0 .75ch; }
.distributor .tip-tel{ font-weight: 700; color: #111; }
.distributor .map{ margin-top: 27px; width: 100%; border-radius: 12px; }
.distributor .map svg{ pointer-events: none; }
.distributor .map_border, .wrap_controllers{ display: none }
.distributor .grid-layout{ margin-top: clamp(60px, calc( 81 / var(--inr) * 100vw ), 81px); display: grid; gap: 60px 5.2%; }
.distributor .info{ padding: 56px clamp(2ch, calc( 49 / var(--inr) * 100vw ), 49px) 64px; background: #f6f6f6 url('/images/content/distributor-logo.png') no-repeat min(93%, calc(100% - 20px)) 91% / clamp(180px, calc( 271 / var(--inr) * 100vw ), 271px); border-radius: 8px; }
.distributor .company{ font: 700 clamp(20px, calc( 30 / var(--inr) * 100vw ), 30px) var(--font-kor); color: #000; }
.distributor .company [lang="en"]{ color: var(--color-point); }
.distributor .address{ margin-top: 1.44444444em; font-size: clamp(14px, calc( 18 / var(--inr) * 100vw ), 18px); }
.distributor .info-list{ margin-top: 47px; display: grid; gap: .875em; padding-left: 2px; color: #666; }
.distributor .icon{ margin-right: 9px; display: inline-block; width: 1.125em; aspect-ratio: 1; background: no-repeat 50% / contain; vertical-align: sub; }
.distributor .i1{ background-image: url('/images/content/distributor-1.svg'); }
.distributor .i2{ background-image: url('/images/content/distributor-2.svg'); }
.distributor .i3{ background-image: url('/images/content/distributor-3.svg'); }
.distributor .form-title{ font: 500 clamp(16px, calc( 22 / var(--inr) * 100vw ), 22px) var(--font-hankookM); color: #000; }
.distributor .form-title{ margin-bottom: 33px; }
.distributor .label-group{ display: grid; gap: 26px 50px; }
.distributor .label{ display: block; width: 100%; font-size: clamp(14px, calc( 18 / var(--inr) * 100vw ), 18px); color: #444; }
.distributor :is(.l1, .l2){ display: grid; grid-template-columns: auto 1fr; align-items: center; padding-bottom: 1px; border-bottom: 1px solid #dedede; }
.distributor input{ margin: 0; border: 0; min-width: 0; }
.distributor textarea{ margin: 9px 0 0; display: block; width: 100%; height: 100px; border: 1px solid #dedede; border-radius: 8px; }
.distributor .submit{ margin: 40px 0 0 auto; display: grid; place-items: center; min-width: 11.11111111em; height: 3.33333333em; padding: 1ch; background: #101010; border-radius: 12px; font: 600 clamp(14px, calc( 18 / var(--inr) * 100vw ), 18px) var(--font-kor); color: #fff; }
@media(any-hover){
    .distributor .submit:hover{ background: var(--color-point); }
    @media(prefers-reduced-motion:no-preference){
        .distributor .submit{ transition: .3s; }
    }
}
@media(min-width:768px){
    .distributor .map .wrap_map{ height: clamp(400px, calc( 600 / var(--inr) * 100vw ), 600px); }
    .distributor .form{ margin-top: -8px; }
    .distributor .label-group{ grid-template-columns: 3fr 4fr; }
    .distributor .l1{ grid-column: 1/2; }
    .distributor .l2{ grid-column: 2/3; }
    .distributor .l3{ grid-column: 1/3; }
}
@media(min-width:1280px){
    .distributor .grid-layout{ grid-template-columns: 71fr 75fr; }
}
@media(max-width:1279px){
}
@media(max-width:767px){
    .distributor .map{ aspect-ratio: 1/1; }
    .distributor .map .wrap_map{ height: 100%; }
    .distributor .info{ padding-bottom: 80px; }
    .distributor .l3{ margin-top: 8px; }
}

/* Automotive Film */
.automotive *{ letter-spacing: -.025em; }
#content .automotive .intro-h2[data-scrollAni]{ margin-bottom: 0.98214286em; font-size: clamp(35px, calc(56 / var(--inr) * 100vw), 56px); }
.automotive .intro-p{ font-size: clamp(16px, calc(24 / var(--inr) * 100vw), 24px); }
.automotive section ~ section{ margin-top: clamp(100px, calc(173 / var(--inr) * 100vw), 173px); }
.automotive .common-h3{ font: clamp(24px, calc(35 / var(--inr) * 100vw ), 35px) var(--font-hankookM); color: var(--color-point); }
.automotive .sec1{ margin-top: clamp(100px, calc(192 / var(--inr) * 100vw), 192px); display: grid; gap: 40px 7.7%; }
.automotive .sec1 .common-h3{ position: sticky; top: 1lh; }
.automotive .sec1 .rolling-list{ display: grid; gap: 50px; }
.automotive .sec1 .li{ display: grid; grid-template: 'icon title' auto 'icon description' 1fr / auto 1fr; gap: 19px 49px; padding: 49px clamp(2ch, calc(49 / var(--inr) * 100vw ), 49px) 50px; border: 1px solid #dedede; border-radius: 12px; }
.automotive .sec1 .li{ border: 1px solid #dedede; border-radius: 12px; }
.automotive .sec1 .li.show{ border-color: var(--color-point); box-shadow: 18px 25px 40px rgba(0, 0, 0, 0.1); }
.automotive .sec1 .icon{ grid-area: icon; width: clamp(60px, calc(120 / var(--inr) * 100vw ), 120px); aspect-ratio: 1; fill: #111; }
.automotive .sec1 .li.show .icon{ fill: var(--color-point); }
.automotive .sec1 .title{ grid-area: title; font: 700 clamp(24px, calc(38 / var(--inr) * 100vw ), 38px) var(--font-kor); color: #111; }
.automotive .sec1 .separation{ margin: 0 .4ch; font-weight: 300; color: #888; }
.automotive .sec1 .description{ grid-area: description; font: 300 clamp(16px, calc(18 / var(--inr) * 100vw ), 18px)/1.55555556 var(--font-kor); color: #444; }
.automotive .sec2 .list{ margin-top: clamp(40px, calc(69 / var(--inr) * 100vw ), 69px); display: grid; gap: clamp(60px, calc(100 / var(--inr) * 100vw ), 100px); }
.automotive .sec2 .info{ padding: 18.2% clamp(2ch, calc(82 / var(--inr) * 100vw ), 82px) 6.5%; background: #000 no-repeat 50% / cover; border-radius: 12px; color: #fff; clip-path: inset(50% 50% 50% 50%); transition: .9s ease-in-out; }
.automotive .sec2 .info.motion__in{ clip-path: inset(0); }
.automotive .sec2 .i1{ background-image: url('/images/content/automotive-car-1.jpg'); }
.automotive .sec2 .i2{ background-image: url('/images/content/automotive-car-2.jpg'); }
.automotive .sec2 .i3{ background-image: url('/images/content/automotive-car-3.jpg'); }
.automotive .sec2 .i4{ background-image: url('/images/content/automotive-car-4.jpg'); }
.automotive .sec2 .i5{ background-image: url('/images/content/automotive-car-5.jpg'); }
.automotive .sec2 .title{ font: clamp(35px, calc(56 / var(--inr) * 100vw), 56px) var(--font-hankookM); }
.automotive .sec2 .description{ margin-top: 0.18181818em; font: clamp(16px, calc(22 / var(--inr) * 100vw), 22px) var(--font-hankookM); }
.automotive .sec2 .period{ margin-top: 2.38888889em; display: inline-block; padding: 9px 19px 8px; border: 1px solid currentColor; border-radius: 5em; font: 600 clamp(16px, calc(18 / var(--inr) * 100vw ), 18px) var(--font-kor); color: var(--color-point); }
.automotive .sec3 .common-h3{margin-top:clamp(40px, calc(60 / var(--inr) * 100vw ), 60px);}
#content .automotive .table{ margin-top: clamp(40px, calc(60 / var(--inr) * 100vw ), 60px); font-size: clamp(14px, calc(18 / var(--inr) * 100vw ), 18px); table-layout: fixed; }
#wrap #content .automotive .table th{ padding: 14px 0; border-block: 2px solid #101010; background: #f8f8f8; font-weight: 600; color: #101010; }
#wrap #content .automotive .table td{ padding: 14px 0 13.5px; border: 1px solid #ddd; color: #555; }
#wrap #content .automotive .table td:first-child{ border-left: 0; }
#wrap #content .automotive .table td:last-child{ border-right: 0; }
@media(prefers-reduced-motion:no-preference){
    .automotive .sec1 :where(.li, .icon){ transition: .3s; }
}
@media(min-width:1280px){
    .automotive .sec1{ grid-template-columns: auto 1fr; }
    .automotive .sec1 .common-h3{ margin-top: 0.22857143em; }
}
@media(max-width:1279px){
    .automotive .sec1 .description br{ display: none; }
}
@media(max-width:767px){
    .automotive .sec1 .li{ display: block; text-align: center; }
    .automotive .sec1 .icon{ margin: 0 auto; }
    .automotive .sec1 .title{ margin: 1em 0 .5em; }
}

/* 비전 및 미션 */
#content:has(.vnm){ padding-bottom: 0; }
.vnm *{ letter-spacing: -.025em; }
#content .vnm .common-h2{ margin: 0; font: clamp(20px, calc(35 / 680 * 100vw), 35px) var(--font-hankookM); color: var(--color-point); }
#content .vnm .vision .common-h2{ text-align: left; }
.vnm .vision .h3{ margin-top: .6em; font: clamp(35px, calc(50 / 680 * 100vw), 50px) var(--font-hankookM); color: #aaa; }
.vnm .vision .logo{ translate: 0 -10%; width: 4.7em; height: auto; aspect-ratio: 235/41; vertical-align: middle; }
.vnm .vision .img{ margin-top: 47px; aspect-ratio: 154/60; background: url('/images/content/vnm-vision.jpg') no-repeat 50% / cover; border-radius: 12px; clip-path: inset(50% 50% 50% 50%); transition: 0.9s ease-in-out 0s; }
.vnm .vision .img.motion__in{ clip-path: inset(0); }
.vnm .vision .description{ margin: 2.875em 0 0 auto; width: fit-content; font: clamp(16px, calc(24 / var(--inr) * 100vw ), 24px)/1.83333333 var(--font-kor); color: #111; }
.vnm .mission{ margin-top: clamp(100px, calc(192 / 680 * 100vw), 192px); padding: clamp(100px, calc(187 / 680 * 100vw), 187px) 0 clamp(80px, calc(100 / 680 * 100vw), 100px); background: #101010; color: #fff; }
.vnm .mission .list{ margin-top: clamp(60px, calc(138 / 680 * 100vw), 138px); display: grid; gap: clamp(70px, calc(80 / 680 * 100vw), 80px); }
.vnm .mission .li{ display: grid; align-items: end; gap: 0 5.2%; translate: 0 20%; opacity: 0; transition: 0.9s cubic-bezier(0.4, 0, 0.2, 1); }
.vnm .mission .li.motion__in{ opacity: 1; translate: 0; }
.vnm .mission .img{ aspect-ratio: 77/47; background: no-repeat 50% / cover; border-radius: 12px; }
.vnm .mission .i1{ background-image: url('/images/content/vnm-mission-1.jpg'); }
.vnm .mission .i2{ background-image: url('/images/content/vnm-mission-2.jpg'); }
.vnm .mission .i3{ background-image: url('/images/content/vnm-mission-3.jpg'); }
.vnm .mission .i4{ background-image: url('/images/content/vnm-mission-4.jpg'); }
.vnm .mission .title{ margin-bottom: .76315789em; font: 700 clamp(24px, calc(38 / var(--inr) * 100vw ), 38px) var(--font-kor); }
.vnm .mission .description{ font: 300 clamp(16px, calc(18 / var(--inr) * 100vw ), 18px)/1.55555556 var(--font-kor); color: #bbb; }
@media(min-width:768px){
    .vnm .mission .li:nth-child(odd){ grid-template: 'img title' 1fr 'img description' auto / 50% 1fr; }
    .vnm .mission .li:nth-child(even){ grid-template: 'title img' 1fr 'description img' auto / 1fr 50%; }
    .vnm .mission .img{ grid-area: img; }
    .vnm .mission .title{ grid-area: title; }
    .vnm .mission .description{ grid-area: description; margin-bottom: 7.8%; }
}
@media(max-width:1279px){
    .vnm .mission .description br{ display: none; }
}
@media(max-width:767px){
    .vnm .mission .img{ margin-bottom: 40px; }
    .vnm .vision .description br{ display: none; }
}



/* AS guide page  */
.content .wrap[data-subarea="as-guide"] {
    padding-top: 50px;
}
[data-subarea] > section:not(:last-child) {
    padding-bottom: 120px;
    border-bottom: 1px dashed #e1e1e1;
}
.section-title {
    font: clamp(20px, calc(35 / 680 * 100vw), 35px) var(--font-hankookM); word-break:keep-all;
}
.section-title span {
    font-family: 'Pretendard';
    font-weight: 600;
}
.as-guide_section01>article {
    display: grid;
	align-items:start;
    grid-template-columns: 35% auto;
} 
.as-guide_section01>article > div{position:sticky; top:50px;}
.as-guide_section01>article ul li {
    position: relative;
    font: clamp(16px, calc(24 / var(--inr) * 100vw ), 24px)/1.83333333 var(--font-kor);
    color: #111;
    line-height: 3;
    padding-left: 20px;
    border-bottom: 1px solid #e1e2e3;
}
.as-guide_section01>article ul li::before{
    /* content: "■"; */
    content: "•";
    position: absolute;
    top: 0;
    left: 0;
}
.as-guide_section01>article ul li span {
    font-size: 20px;
}
.as-guide_section02 {
    /* border-top: 1px solid #eaeaea; */
    border-bottom: 1px solid #eaeaea;
    padding-block: 80px;
    margin-block: 70px;
}
.as-guide_section02>article {
    display: grid;
	align-items:start;
    grid-template-columns: 35% auto;
}
.as-guide_section02>article > div{position:sticky; top:50px;}
.as-guide_section02 h3.section-title {
    text-align: left;
    margin-top: 64px;
}
.as-guide_section02_content-split {
    display: flex;
    flex-direction: column;
    gap: 50px;
    padding-inline:0;
}
.as-guide_section02_content-split dl {
    border: 1px solid #e1e2e3;
    border-radius: 12px;
    font: clamp(16px, calc(24 / var(--inr)* 100vw), 24px) / 1.83333333 var(--font-kor);
}
.as-guide_section02_content-split dl dt {
    /* background-color: var(--color-point); */
    color: var(--color-point);
    border-radius: 12px 12px 0 0;
    padding-block: 12px;
    padding-left: 30px;
    border-bottom: 1px solid #e1e2e3;
    font-weight: 700;
}
.as-guide_section02_content-split dl dd {
    padding: 20px 30px;
}
.as-guide_section02_content-split dl dd>ul>li {
    display: flex;
    gap: 5px;
}
.as-guide_section02_content-split dl dd>ul>li::before {
    content: "🗸";
    display: block;
}
.container-sect_title {
    text-align: center;
}
.section-title + h4 {
    font: clamp(18px, calc(24 / var(--inr) * 100vw ), 24px)/1.83333333 var(--font-kor);
} 
.as-guide_section03_content-split {
    display: flex;
    flex-direction: column;
    /* grid-template-columns: repeat(3, 1fr); */
    margin-top: 50px;
}

.as-guide_section04 .as-guide_section03_content-split {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    /* margin-top: 50px; */
}
.as-guide_section03_content-split>dl{
    padding-inline: 32px;
    padding-block: 25px;
}
.as-guide_section03_content-split>dl:not(:first-child) {
    /* border-left: 1px solid #e1e2e3; */
}
.as-guide_section03_content-split>dl>dt{
    font: clamp(18px, calc(24 / 680* 100vw), 24px) var(--font-kor);
    font-weight: 600;
}
.as-guide_section03_content-split>dl>dd{
    margin-top: 20px;
    line-height: 1.8;
}
.as-guide_section03_content-split dd>ul {
    margin-top: 8px;
    text-wrap: pretty;
}
/* .as-guide_section03_content-split dd>ul>li{
    display: flex;
    gap: 5px;
    margin-bottom: 5px;
}
.as-guide_section03_content-split dd>ul>li::before{
    content: "•";
} */ 
.as-guide_section03_content-lists >li {
    list-style: decimal;
    margin-left: 15px;
    margin-bottom: 10px;
} 
.as-guide_section03_content-lists >li>ul>li{
    list-style: circle;
    margin-left: 20px;
}
.as-guide_section03_foot {
    margin-top: 48px;
    border: 1px solid #e1e2e3;
    padding: 35px 40px;
    display: grid;
    grid-template-columns: 20% auto;
}
.as-guide_section03_foot h4 {
    font: clamp(18px, calc(24 / 680* 100vw), 24px) var(--font-kor);
    font-weight: 600;
}
.as-guide_section03_foot>ul>li {
    display: flex;
    gap: 5px;
    margin-bottom: 15px;
}
.as-guide_section03_foot>ul>li::before {
    content: "•";
}


.as-guide_section04_content01 {
    display: grid;
    grid-template-columns: 35% auto;
}
.as-guide_section04_content01 h3 {
    font: clamp(20px, calc(35 / 680* 100vw), 35px) var(--font-hankookM);
}
.as-guide_section04_content01 h3 span {
    font-family: 'Pretendard';
    font-weight: 600;
}
.as-guide_section04_content01 > ul >li {
    position: relative;
    font: clamp(16px, calc(24 / var(--inr)* 100vw), 24px) / 1.83333333 var(--font-kor);
    color: #111;
    line-height: 3;
    padding-left: 20px;
    border-bottom: 1px solid #e1e2e3;
}
.as-guide_section04_content01 > ul >li:first-child {
    line-height: 1.6;
    padding-bottom: 15px;
}
.as-guide_section04_content01 > ul >li::before {
    content: "•";
    position: absolute;
    top: 0;
    left: 0;
}

.as-guide_section04-add1 {
    margin-top: 90px;
    border-top: 1px solid #eaeaea;
    padding-top: 50px;
}
.as-guide_section04-add1_content {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-top: 50px;
}
.as-guide_section04-add1_content dl {
    border: 1px solid #eaeaea;
    padding: 30px 35px;
    border-radius: 12px;
}
.as-guide_section04-add1_content>dl>dt {
    font: clamp(18px, calc(24 / 680* 100vw), 24px) var(--font-kor);
    font-weight: 600;
}
.as-guide_section04-add1_content>dl>dd {
    margin-top: 20px;
    line-height: 1.8;
}
.section04-add1_content-3 dd ol {
    margin-top: 12px;
}
.section04-add1_content-3 dd ol>li{
    margin-bottom: 5px;
}
.section04-add1_content-3 dd ol>li>ul{
    margin-bottom: 5px;
}
.section04-add1_content-3 dd ol>li>ul>li {
    margin-bottom: 3px;
}
.as-guide_section04-add1_content > .section04-add1_content-3 {
    grid-column: 2;
    grid-row: 1 / span 2;
    /* border: 1px solid; */
}
.section04-add1_content-3 ul >li {
    list-style: circle;
    margin-left: 40px;
}




:where(.as-guide_section04, .as-guide_section05) .container-sect_title + p {
     margin-top:50px; 
     margin-inline: 20px;
     font: clamp(16px, calc(24 / var(--inr)* 100vw), 24px) / 1.83333333 var(--font-kor);
}
.as-guide_section05 {
    border-top: 1px solid #eaeaea;
    padding-top: 50px;
    margin-top: 90px;
}
.as-guide_section05_content-split {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin-top: 40px;
    gap: 40px;
}

.as-guide_section05_content-split>dl {
    /* padding-inline: 40px;
    padding-block: 20px 20px; */

    border: 1px solid #eaeaea;
    padding: 30px 35px;
    border-radius: 12px;
}
 
.as-guide_section05_content-split>dl>dt {
    font: clamp(18px, calc(24 / 680* 100vw), 24px) var(--font-kor);
    font-weight: 600;
    margin-bottom: 20px;
}
.as-guide_section05_content-split>dl>dd {
    margin-top: 12px;
}
.as-guide_section05_content-split ul>li {
    list-style-type: circle;
    margin-left: 20px;
    margin-bottom: 10px;
}

.as-guide_section05_content-split dd >ul>li >p {
    /* padding-left: 10px; */
    margin-top: 5px;
}

[data-subarea="as-guide"] .tabs .tab-panel {
    display: none;
    transform: translateY(-50px);
    
}

[data-subarea="as-guide"] .tabs .tab-panel.active {
    display: block;
    opacity: 1;
    transform: translateY(0);
    transition: all 3s ease-in-out; 
}

.tabs-btn-group {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    margin-bottom: 60px;
}
.tabs-btn-group .tab-button {
    font-size: 24px;
    background-color: white;
    padding-bottom: 10px;
    color: #666666;
    box-sizing: border-box; 
	word-break:keep-all;
}
.tabs-btn-group .tab-button:hover {
    color: #333;
    transition: all 500ms ease-in-out;
}
.tabs-btn-group .tab-button.active {
     font-weight: 500;
     color: #333;
     /* padding-inline: 20px; */
     /* border-bottom: 1px solid var(--color-point); */
     transition: all 500ms ease-in-out;
     position: relative;
}
.tabs-btn-group .tab-button.active::before {
    content: "";
    position: absolute;
    bottom: 0;
    height: 3px;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    background-color: var(--color-point);
}

.me-3 {margin-right: 1rem;}

@media (max-width: 1080px) {
    .as-guide_section01>article {grid-template-columns: 1fr;}
    .as-guide_section02>article {grid-template-columns: 1fr;}
	.as-guide_section01>article > div,
	.as-guide_section02>article > div{position:static;}
    .as-guide_section02_content-split {padding-inline: 0;margin-top: 30px;}
    .as-guide_section02, .as-guide_section03, .as-guide_section05 {padding-top: 40px;}
    .content .wrap[data-subarea="as-guide"] {padding-top: 0;}
    [data-subarea] > section:not(:last-child) {padding-bottom: 80px;}
    .as-guide_section02 h3.section-title {margin-top: 0;} 
    .as-guide_section05_content-split {grid-template-columns:1fr;}
	.as-guide_section01 h3.section-title{margin-bottom:20px;}
	.as-guide_section01 h3.section-title br,
	.as-guide_section02 h3.section-title br{display:none;}
 
    .as-guide_section04 .as-guide_section03_content-split {grid-template-columns: 1fr;}

    .as-guide_section04_content01 {grid-template-columns: 1fr;}
    .as-guide_section04_content01 > ul >li:first-child {padding-bottom: 9px;}
    .as-guide_section04_content01>ul {margin-top: 10px;}
    .as-guide_section03_foot {grid-template-columns: 1fr;gap: 15px;}

}

@media (max-width: 767px) {
    .as-guide_section01>article {grid-template-columns: 1fr;}
    .as-guide_section02>article {grid-template-columns: 1fr;}
    [data-subarea] > section:not(:last-child) {padding-bottom: 60px;}
    .as-guide_section03, .as-guide_section05 { padding-top: 30px;margin-top: 50px;}
    .as-guide_section02 h3.section-title {text-align: center;margin-top: 0;}
    .as-guide_section02_content-split {gap: 20px;padding-inline: 0;        margin-top: 30px;}
    .as-guide_section03_content-split {grid-template-columns: 1fr;    margin-top: 30px;}
    .as-guide_section03_content-split>dl {padding-inline: 0;padding-block: 18px;}
  
    .as-guide_section04 .as-guide_section03_content-split{grid-template-columns: 1fr;}
    .as-guide_section05_content-split {grid-template-columns: 1fr;margin-top: 20px;}
 
    .as-guide_section01>article ul li {line-height: 2;}
    :where(.as-guide_section04, .as-guide_section05) .container-sect_title + p {
        margin-top: 30px; margin-inline: 0;
    } 
    .as-guide_section03_foot {grid-template-columns: 1fr;gap: 20px;padding: 25px 30px;margin-top: 6px;}
    .as-guide_section01>article>ul {
        margin-top: 30px;
    }
    .tabs-btn-group .tab-button { font-size: 1rem;}
    .tabs-btn-group {gap: 20px;margin-bottom: 30px;}
    .as-guide_section02 {margin-block: 0px;;padding-block: 50px;}
    .as-guide_section04_content01 {grid-template-columns: 1fr;}
    .as-guide_section04_content01 > ul >li {line-height: 2;}
    .as-guide_section04_content01 > ul {margin-top: 30px;}
    .as-guide_section04-add1_content {grid-template-columns: 1fr;}
    .as-guide_section04-add1_content > .section04-add1_content-3 {
        grid-column: auto;
        grid-row: auto;
    }
    .as-guide_section04_content01 > ul >li:first-child {padding-bottom: 5px;}
    .as-guide_section04-add1 {margin-top: 50px;border-top: none;padding-top: 0px;}

    .as-guide_section05_content-split {gap: 20px;}



}

@media (max-width: 420px) {
	.tabs-btn-group{align-items:stretch; gap:10px;}
    .tabs-btn-group .tab-button {
		flex:1 1 0;
        font-size: .9rem;
    }

}

/* 정품인증서 */
.certi-guide{display:flex; justify-content:space-between; align-items:center; gap:0 20px; margin-top:10px; padding:20px; border:2px solid #e7e7e7;}
.certi-guide p{font-size:15px;}
.certi-guide p strong{display:block;}
.certi-guide .img{flex:none; width:192px;}
.certi-guide .img img{width:100%;}
@media screen and (max-width:1300px){
	.certi-guide p{word-break:keep-all;}
	/* .certi-guide p br{display:none;} */
	.certi-guide .img{width:170px;}
}
@media screen and (max-width:768px){
	.certi-guide{flex-wrap:wrap;}
	.certi-guide .img{margin:10px auto 0;}
}
@media screen and (max-width:480px){
	.certi-guide{padding:20px 15px;}
	.certi-guide p{font-size:14px;}
}

/* film - add 20250331 */
.film-group-list{display:grid; grid-template-columns:repeat(4, 1fr); gap:80px 60px;}
.film-group-list li{display:flex; justify-content:center;}
.film-group-list li a{display:flex; flex-direction:column; justify-content:center; align-items:center; gap:20px; font-size:18px;}
.film-group-list em{margin-top:20px; letter-spacing:0.5px; text-align:center;}
.film-group-list .img{display:block; height:84px;}
.film-group-list .img img{height:100%;}
.film-group-list i{display:flex; justify-content:center; align-items:center; width:100%; height:45px; border:1px solid rgba(255,255,255,0.3); font-size:14px; color:rgba(255,255,255,0.5); transition:0.3s ease;}
.film-group-list li a:hover i{border-color:rgba(255,255,255,1); color:rgba(255,255,255,1);}
.youtube-box{aspect-ratio:16/9;}
.youtube-box iframe{width:100%; height:100%;}
.img-box img{max-width:100%;}
@media (max-width:1300px){
	.film-group-list{gap:80px 30px;}
	.film-group-list .img{height:70px;}
}
@media (max-width:1024px){
	.film-group-list{grid-template-columns:repeat(3, 1fr);}
	.film-group-list .img{height:55px;}
}
@media (max-width:768px){
	.film-group-list{grid-template-columns:repeat(2, 1fr);}
}
@media (max-width:420px){
	.film-group-list{grid-template-columns:1fr;}
}

/* tab */
.tab-depth03{margin-top:40px; margin-bottom:80px;}
.tab-depth03 ul{display:flex; justify-content:center; align-items:center; gap:60px;}
.tab-depth03 ul li a{display:inline-block; position:relative; padding-bottom:10px; font-size:24px; color:#666; transition:color 0.3s ease;}
.tab-depth03 ul li a:before{content:""; opacity:0; position:absolute; bottom:0; left:50%;  width:100%; height:3px; background-color:var(--color-point); transform:translateX(-50%); transition:opacity 0.3s ease;}
.tab-depth03 ul li a.on{color:#111; font-weight:500;}
.tab-depth03 ul li a.on:before{opacity:1;}
.full-black	.tab-depth03 ul li a span{color:rgba(255,255,255,0.5);}
.full-black .tab-depth03 ul li a.on span{color:rgba(255,255,255,1);}
@media (max-width:1024px){
	.tab-depth03 ul{gap:clamp(20px, 3.906vw, 40px);}
	.tab-depth03 ul li a{min-width:80px; font-size:clamp(20px, 2.344vw, 24px); text-align:center;}  
}
@media (max-width:480px){
	.tab-depth03 ul{gap:15px;}
	.tab-depth03 ul li a{min-width:60px; font-size:18px; line-height:1.2;}
}

/* category */
.category-bbs{display:flex; justify-content:center; margin-bottom:50px;}
.category-bbs .list{display:flex; justify-content:center; align-items:center;}
.category-bbs .list li{display:flex; padding-left:10px;}
.category-bbs .list li a{display:flex; justify-content:center; align-items:center; min-width:120px; height:45px; box-sizing:border-box; padding:0px 20px; background-color:#eee; color:#999; white-space:nowrap;}
.category-bbs .list li a.on{background-color:var(--color-point); color:#fff;}
.category-bbs .list li:first-child{padding-left:0;}
.scroll_control.full{overflow-x:auto; justify-content:flex-start !important;}
@media (max-width:480px){
	.category-bbs .list li a{min-width:90px; height:40px; font-size:15px;}
}
