@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url(https://cdn.jsdelivr.net/nanumsquare/1.0/nanumsquare.css);
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200;300;400;500;600;700;900&display=swap');

/* CSS Reset */
body,html,
header,footer,aside,nav,section,article,details,figure,figcaption,menu,command,
div,dl,dd,ol,ul,li,form,fieldset,legend,iframe,table,caption,thead,tfoot,tbody,tr,th,td, /* Block Element */
h1,h2,h3,h4,h5,h6,dt,summary,input,textarea,button,select,datalist,
img,embed,object,canvas,audio,video,meter,progress,keygen, /* Inline Block Element */
a,label,output,dialog, /* Inline Element */
address,blockquote, /* Text Block Element */
p,pre,/* Text Inline Block Element */
span,b,strong,i,em,dfn,var,u,ins,s,del,q,mark,small,sub,sup,abbr,bdi,bdo,cite,time,ruby,rp,rt,code,kbd,samp, /* Text Inline Element */
acronym,big,frame,frameset,noframes,tt, /* Not HTML5 Used Element */
map,option,hr,*{border:0;padding:0;margin:0;color:inherit;font-family:inherit;font-size:inherit;line-height:inherit;}
header,footer,aside,nav,section,article,details,summary,figure,figcaption,menu,command{display:block} /* HTML5 Block Element */
applet,basefont,center,dir,font,strike{display:none} /* XHTML4, HTML5 Element Not Used Remove */
q,blockquote{quotes:none;content:none}

/* CSS Reset */
body,html,
header,footer,aside,nav,section,article,details,figure,figcaption,menu,command,
div,dl,dd,ol,ul,li,form,fieldset,legend,iframe,table,caption,thead,tfoot,tbody,tr,th,td, /* Block Element */
h1,h2,h3,h4,h5,h6,dt,summary,input,textarea,button,select,datalist,
img,embed,object,canvas,audio,video,meter,progress,keygen, /* Inline Block Element */
a,label,output,dialog, /* Inline Element */
address,blockquote, /* Text Block Element */
p,pre,/* Text Inline Block Element */
span,b,strong,i,em,dfn,var,u,ins,s,del,q,mark,small,sub,sup,abbr,bdi,bdo,cite,time,ruby,rp,rt,code,kbd,samp, /* Text Inline Element */
acronym,big,frame,frameset,noframes,tt, /* Not HTML5 Used Element */
map,option,hr,*{border:0;padding:0;margin:0;color:inherit;font-family:inherit;font-size:inherit;line-height:inherit;}
header,footer,aside,nav,section,article,details,summary,figure,figcaption,menu,command{display:block} /* HTML5 Block Element */
applet,basefont,center,dir,font,strike{display:none} /* XHTML4, HTML5 Element Not Used Remove */
q,blockquote{quotes:none;content:none}
li,menu{list-style:none;word-break:break-all}

table{width:100%;border-spacing:0;border-collapse:separate;} /* Table Border (separate) */
caption{text-align:left}
th,td{text-align:center;vertical-align:middle}

address{font-style:normal}
label{display:inline-block;}
a{text-decoration:none;display:inline-block;} /* A Attribute  */

/* Common Setting */
html{overflow-y:auto;}
html,body{height:100%;} /* Horizen Scroll */
body{color:#333;font-size:13px;font-family:'Noto Sans KR', sans-serif, "Nanum Gothic";font-weight:400;min-width:320px;}
div{outline:0}
img {vertical-align:middle;}

::selection {background-color:#333;color:#fff;}

.gnb {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    margin: 0 auto;
    height: 120px;
    z-index: 120;          /* чтобы было поверх всего */
    background-color: #fff;
    border-bottom: 1px solid #e5e5e5;
}
.gnb .logo {position:absolute;width:500px;top:40px;left:50%;margin-left:-500px;}
.gnb .logo img {width:240px;}
.gnb .menu {position:absolute;width:1000px;top:52px;left:50%;margin-left:-500px;text-align:right;}
.gnb .menu a {font-size:16px;font-weight:700;padding-left:40px;color:#666;}
.gnb .menu a:hover {color:#333;}

.gnb_fixed {position:fixed;width:100%;height:80px;top:0;left:0;z-index:100;background-color:white;border-bottom:solid 1px #e5e5e5;}
.gnb_fixed .logo {top:22px;}
.gnb_fixed .logo img {width:180px;}
.gnb_fixed .menu {top:28px;}
.gnb_fixed .menu a {padding-left:25px;}

.gnb .ham {display:none;}
.mobile_menu {display:none;}

.visual {
    position: relative;
    width: 100%;
    margin-top: 120px;  
}

.visual .mavi {width:100%;height:680px;background-repeat: no-repeat;background-size:cover;background-position:center;}
.visual .mavi .text {position:relative;width:1000px;margin:0 auto;text-align:center;}
.visual .mavi .text h1 {font-family:'Noto Serif KR',serif;font-size:55px;font-weight:300;color:white;padding-top:280px;}
.visual .mavi .text p {font-size:17px;font-weight:700;letter-spacing:5px;color:white;}

.visual .mavi01 {background-image:url('../img/mavisual_01.png');display:none;}
.visual .mavi02 {background-image:url('../img/mavisual_02.png');display:none;}
.visual .mavi03 {background-image:url('../img/mavisual_03.png');display:none;}
.visual .mavi04 {background-image:url('../img/mavisual_04.png');display:none;}

.visual .arrow_left {position:absolute;top:330px;left:50px;}
.visual .arrow_right {position:absolute;top:330px;right:50px;}
.visual .flow {position:absolute;width:295px;left:50%;margin-left:-147px;bottom:30px;}
.visual .flow li {float:left;width:70px;height:5px;background-color:white;margin-right:5px;opacity:0.5;}
.visual .flow li:last-child {margin-right:0;}
.visual .flow .on {opacity:1;}

.story {position:relative;width:100%;}
.story .contents {position:relative;width:1000px;padding:100px 0;margin:0 auto;text-align:center;}
.story .contents h2 {padding:70px 0 0 0;font-family:'Noto Serif KR',serif;font-size:24px;font-weight:500;line-height:35px;}
.story .contents .line {position:relative;width:50px;height:3px;background-color:black;margin:45px auto;}
.story .contents p {font-size:15px;font-weight:500;line-height:30px;}

.step {position:relative;width:100%;background-color:#fafafa;}
.step .top {position:relative;width:1000px;padding-top:100px;margin:0 auto;text-align:center;}
.step .top h1 {font-size:30px;font-weight:700;letter-spacing:5px;}
.step .top .line {position:relative;width:50px;height:3px;background-color:black;margin:45px auto;}
.step .top p {font-size:20px;font-weight:700;line-height:35px;padding-bottom:20px;}
.step .top span {font-size:15px;font-weight:500;line-height:30px;}
.step .list {position:relative;width:1000px;padding:50px 0 100px 0;margin:0 auto;text-align:center;}
.step .list li {float:left;width:240px;margin-right:10px;background-color:white;border-radius:15px;border:solid 1px #e5e5e5;padding:35px 0;margin-bottom:10px;}
.step .list li:nth-child(4n) {margin-right:0;}
.step .list li:last-child {margin-bottom:100px;}
.step .list li img {width:65px;padding-bottom:15px;}
.step .list li span {display:block;font-size:12px;color:#999;font-weight:700;}
.step .list li h3 {font-size:20px;padding-bottom:2px;}
.step .list li p {font-size:13px;padding:0 10px;line-height:25px;}

.clear {position:relative;clear:both;}

.price {position:relative;width:1000px;margin:0 auto;padding:100px 0;}
.price h2 {font-size:22px;font-weight:300;}
.price h2 b {font-weight:700;}
.price h3 {font-size:15px;font-weight:400;}

.price .step {position:relative;padding:50px 0;margin:30px 0;border-top:solid 1px #e5e5e5;border-bottom:solid 1px #e5e5e5;text-align:center;background-color:#fafafa;display:none;}
.price .step h4 {font-size:22px;}
.price .step p {font-size:14px;padding-bottom:25px;}
.price .step a {border:solid 1px #333;padding:8px 35px;font-size:14px;font-weight:500;background-color:#333;color:white;margin:0 2px;}
.price .step a:hover {color:#333;border:solid 1px #333;background-color:#fafafa;}

.price .result {position:relative;margin:50px 0;display:none;}
.price .result ul {clear:both;border-top:solid 1px #e5e5e5;}
.price .result li {float:left;padding:25px 0;}
.price .result li:nth-child(1) {width:23%;font-weight:700;padding-left:2%;}
.price .result li:nth-child(2) {width:15%;font-weight:700;}
.price .result li:nth-child(3) {width:60%;font-weight:300;color:#666;}
.price .result li span {font-weight:300;color:#666;}
.price .result ul:last-child li {border-bottom:solid 1px #e5e5e5;background-color:#fffcf7;color:#b61110;}

.price .des {padding:25px 0 0 0;clear:both;display:none;}
.price .des p {padding-bottom:5px;color:#666;}

.price .refesh {position:relative;text-align:center;padding-top:40px;display:none;}
.price .refesh a {border:solid 1px #333;padding:12px 40px;font-size:17px;font-weight:400;background-color:#333;color:white;margin:0 2px;}


.doc {position:relative;width:100%;padding:100px 0 50px 0;background-color:#fafafa;}
.doc .box {position:relative;width:1000px;padding-bottom:50px;margin:0 auto;}
.doc .box h3 {font-size:20px;letter-spacing:1px;font-weight:300;padding-bottom:17px;}
.doc .box h3 b {font-weight:700;}
.doc .box p {font-weight:700;padding-bottom:7px;font-size:14px;}
.doc .box p span {font-weight:500;color:#666;}

.interior {position:relative;width:1000px;margin:0 auto;text-align:center;padding:100px 0;}
.interior h2 {font-size:30px;font-weight:700;letter-spacing:5px;}
.interior .line {position:relative;width:50px;height:3px;background-color:black;margin:30px auto;}
.interior p {font-size:15px;font-weight:700;line-height:25px;padding-bottom:50px;}
.interior .photo {position:relative;}
.interior .photo li {float:left;margin-bottom:10px;}
.interior .photo li:nth-child(4) {margin-right:10px;}
.interior .photo li:nth-child(6) {margin-right:10px;}

.inquiry {position:relative;width:100%;background-color:#fafafa;padding:100px 0;text-align:center;}
.inquiry h2 {font-size:30px;font-weight:700;letter-spacing:5px;}
.inquiry .line {position:relative;width:50px;height:3px;background-color:black;margin:30px auto;}
.inquiry p {font-size:15px;font-weight:700;line-height:25px;padding-bottom:50px;}
.inquiry .con {position:relative;width:600px;margin:0 auto;}
.inquiry .con li {float:left;width:200px;text-align:center;}
.inquiry .con li .won {position:relative;width:130px;height:120px;background-color:white;border:solid 1px #e5e5e5;border-radius:120px;margin-left:40px;margin-bottom:15px;}
.inquiry .con li .won img {width:60px;margin-top:32px;}
.inquiry .con li span {font-size:14px;font-weight:500;color:#666;}
.inquiry .con li p {font-size:18px;font-weight:700;}

.store {position:relative;width:1000px;margin:0 auto;text-align:center;padding:100px 0;}
.store h2 {font-size:30px;font-weight:700;letter-spacing:5px;}
.store .line {position:relative;width:50px;height:3px;background-color:black;margin:30px auto;}
.store .map {position:relative;width:100%;height:500px;}

.store .info {position:relative;padding:30px 0;}
.store .info h3 {font-size:20px;padding-bottom:15px;}
.store .info p {font-weight:500;padding-bottom:5px;}
.store .panorama {position:relative;}
.store .photo {position:relative;padding:50px 0;}
.store .photo li {float:left;width:19.6%;margin-right:0.5%;margin-bottom:0.5%;}
.store .photo li:nth-child(5n) {margin-right:0;}
.store .photo li img {width:100%;}

.bt {position:relative;width:100%;border-top:solid 1px #e5e5e5;border-bottom:solid 1px #e5e5e5;height:75px;}
.bt .menu {position:absolute;top:27px;width:500px;left:50%;margin-left:-500px;}
.bt .menu a {font-weight:700;margin-right:15px;}
.bt .tel {position:absolute;top:27px;width:500px;left:50%;text-align:right;font-weight:700;}

.footer {position:relative;width:1000px;margin:0 auto;padding:50px 0 30px 0;}
.footer h3 img {width:140px;padding-bottom:20px;}
.footer span {font-size:12px;color:#999;margin-right:15px;}
.footer p {font-size:12px;color:#333;padding-top:10px;font-weight:500;}

.landing {position:relative;width:auto;margin:0 auto;text-align:center;}
.landing li {text-align:center;}
.landing li img {width:100%;max-width:850px;}





@media only screen and (max-width:1000px) { 

.gnb .logo {width:100%;left:0;margin-left:20px;}
.gnb .menu {width:100%;left:0;margin-left:0;}
.gnb .menu a {padding-left:20px;}
.gnb .menu a:last-child {padding-right:20px;}
.gnb_fixed .menu a {padding-left:15px;}

.visual .mavi {height:600px;}
.visual .mavi .text {width:100%;}
.visual .mavi .text h1 {padding-top:200px;}

.visual .arrow_left {top:280px;left:20px;}
.visual .arrow_right {top:280px;right:20px;}
.visual .flow {bottom:20px;}

.story .contents {width:auto;padding:70px 20px;}
.story .contents h2 {padding:50px 0 0 0;}
.story .contents img {width:100%;}
.story .contents p {padding:0 20px;}

.step .top {width:auto;padding-top:70px;}
.step .top p {padding:0 20px;}
.step .list {width:100%;padding:30px 0 70px 0;}
.step .list li {width:22.5%;margin:0 1% 1% 1%;padding:30px 0;height:170px;}
.step .list li:nth-child(4n) {margin-right:1%;}


.price {width:auto;padding:70px 20px;}

.doc {width:auto;padding:70px 20px 20px 20px;}
.doc .box {width:auto;}

.interior {width:auto;padding:70px 20px;}
.interior .photo li img {width:100%;}
.interior .photo li {margin-bottom:1%;}
.interior .photo li:nth-child(4) {margin-right:1%;}
.interior .photo li:nth-child(6) {margin-right:1%;}
.interior .photo li:nth-child(n+4) {width:49.5%;}

.inquiry {width:auto;padding:70px 20px;}

.store {width:auto;padding:70px 20px;}

.bt {width:auto;}
.bt .menu {width:auto;left:20px;margin-left:0;}
.bt .tel {width:auto;left:0;right:20px;}

.footer {width:auto;padding:50px 20px 30px 20px;}




}


@media only screen and (max-width:767px) {
html,body{min-width:320px;}

.gnb {height:65px;margin:0;padding:0;}
.gnb .logo {top:20px;margin:0;}
.gnb .logo img {width:120px;padding-left:20px;}
.gnb .menu {display:none;}

.gnb .ham {display:inline-block;position:absolute;top:20px;right:10px;}
.gnb .ham img {width:20px;opacity:0.6;}

.gnb_fixed {height:65px;top:0;left:0;}
.gnb_fixed .logo {top:18px;}
.gnb_fixed .logo img {width:100px;}
.gnb_fixed .ham {}

.mobile_menu {position:fixed;top:0;left:0;width:100%;height:100%;display:none;background-color:white;z-index:200;}
.mobile_menu .close {position:absolute;top:20px;right:20px;z-index:201;}
.mobile_menu .close img {width:15px;}
.mobile_menu .menu {position:relative;padding:30px 15px;}
.mobile_menu .menu li {padding:20px 0;border-bottom:solid 1px #fafafa;}
.mobile_menu .menu li:first-child img {width:180px;}
.mobile_menu .menu li a {font-size:15px;font-weight:700;}

.visual .mavi {height:480px;}
.visual .mavi .text h1 {font-size:35px;padding:180px 30px 0 30px;line-height:40px;}
.visual .mavi .text p {font-size:15px;letter-spacing:3px;padding:0 10px;}
.visual .arrow_left {top:220px;left:10px;}
.visual .arrow_left img {width:11px;}
.visual .arrow_right {top:220px;right:10px;}
.visual .arrow_right img {width:11px;}
.visual .flow {width:140px;margin-left:-70px;bottom:20px;}
.visual .flow li {width:30px;}

.story .contents {padding:50px 0;}
.story .contents h2 {padding:30px 10px 0 10px;font-size:20px;line-height:30px;}
.story .contents .line {margin:30px auto;}

.step .top {padding:50px 10px 0 10px;}
.step .top h1 {font-size:24px;letter-spacing:3px;}
.step .top .line {margin:30px auto;}
.step .top p {font-size:17px;line-height:26px;padding-bottom:20px;}
.step .top span {font-size:14px;line-height:26px;}
.step .list {padding:50px 0 50px 0;}
.step .list li {width:46%;margin-left:2%;margin-right:2%;padding:25px 0;margin-bottom:2%;height:140px;}
.step .list li:nth-child(even) {margin-left:0;}
.step .list li:nth-child(2n) {margin-right:0;}
.step .list li:last-child {margin-bottom:50px;}
.step .list li img {width:45px;padding-bottom:10px;}
.step .list li h3 {font-size:20px;padding-bottom:2px;}
.step .list li p {font-size:12px;line-height:18px;}

.clear {position:relative;clear:both;}

.price {padding:50px 10px;}
.price h3 {font-size:13px;}
.price .result {margin:20px 0;}
.price .result li {padding:15px 0;}
.price .result li:nth-child(1) {width:100%;padding:15px 0 0 0;}
.price .result li:nth-child(2) {width:100%;padding:0;}
.price .result li:nth-child(3) {width:100%;padding:0 0 15px 0;}
.price .result li span {font-weight:300;color:#666;}
.price .result ul:last-child li {border-bottom:solid 0px #e5e5e5;padding-left:10px;}

.doc {padding:50px 10px 20px 10px;}
.doc .box {padding-bottom:20px;}
.doc .box h3 {letter-spacing:0;font-size:17px;padding-bottom:10px;}
.doc .box p {font-weight:500;font-size:13px;}
.doc .box p span {font-weight:500;color:#666;}

.interior {padding:50px 10px;}
.interior h2 {font-size:22px;letter-spacing:3px;}
.interior .line {margin:20px auto;}
.interior p {font-weight:500;font-size:14px;line-height:20px;padding:0 10px 30px 10px;}

.inquiry {padding:50px 0;}
.inquiry h2 {font-size:22px;letter-spacing:3px;}
.inquiry .line {margin:20px auto;}
.inquiry p {font-size:14px;font-weight:500;line-height:20px;padding-bottom:25px;}
.inquiry .con {width:auto;margin:0 auto;}
.inquiry .con li {width:33%;}
.inquiry .con li .won {width:80px;height:80px;margin-left:20px;margin-bottom:15px;}
.inquiry .con li .won img {width:40px;margin-top:20px;}
.inquiry .con li p {font-size:15px;padding:0 10px;}

.store {padding:50px 10px;}
.store h2 {font-size:22px;letter-spacing:3px;}
.store .line {margin:20px auto;}
.store .map {height:300px;}

.store .panorama {position:relative;}
.store .photo {padding:10px 0;}
.store .photo li {width:49%;margin-right:1%;margin-bottom:1%;}
.store .photo li:nth-child(even) {margin-right:0;}
.store .photo li:nth-child(5n) {margin-right:1%;}
.store .photo li img {width:100%;}

.bt {height:75px;}
.bt .menu {top:27px;width:100%;left:50%;margin-left:-50%;}
.bt .menu a {font-weight:700;margin:0 10px;}
.bt .tel {top:27px;width:auto;left:0%;font-weight:700;}

.footer {padding:30px 10px 30px 10px;}
.footer h3 img {width:140px;padding-bottom:20px;}
.footer span {font-size:12px;color:#999;margin-right:15px;}
.footer p {font-size:12px;color:#333;padding-top:10px;font-weight:500;}


.price .step {padding:30px 0;margin:20px 0;}
.price .step h4 {font-size:20px;}
.price .step p {font-size:13px;padding-bottom:15px;}
.price .step a {padding:8px 30px;font-size:13px;margin:2px 2px;}

.price .refesh {padding-top:20px;}
.price .refesh a {font-size:15px;}

}

/* Store Description Styles */
.store .store-desc {
	position: relative;
	max-width: 800px;
	margin: 0 auto;
	padding: 30px 0;
	text-align: left;
	line-height: 1.8;
}

.store .store-desc p {
	font-size: 15px;
	font-weight: 400;
	line-height: 28px;
	margin-bottom: 20px;
	color: #333;
}

.store .store-desc-title {
	font-size: 20px;
	font-weight: 700;
	text-align: center;
	margin-bottom: 30px;
	color: #000;
}

.store .store-desc-section {
	margin-top: 25px;
	padding: 20px;
	background-color: #fafafa;
	border-left: 3px solid #333;
}

.store .store-desc-section strong {
	font-size: 16px;
	font-weight: 700;
	color: #000;
}

.store .store-desc-btn-wrap {
	text-align: center;
	margin-top: 40px;
	margin-bottom: 50px;
}

.store .store-desc-btn {
	display: inline-block;
	padding: 15px 40px;
	background-color: #333;
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	border-radius: 5px;
	transition: all 0.3s ease;
}

.store .store-desc-btn:hover {
	background-color: #000;
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Mobile Responsive */
@media only screen and (max-width: 767px) {
	.store .store-desc {
		padding: 20px 10px;
	}
	
	.store .store-desc p {
		font-size: 14px;
		line-height: 24px;
	}
	
	.store .store-desc-title {
		font-size: 18px;
	}
	
	.store .store-desc-section {
		padding: 15px;
	}
	
	.store .store-desc-section strong {
		font-size: 15px;
	}
	
	.store .store-desc-btn {
		padding: 12px 30px;
		font-size: 14px;
	}
}

/* Map Styles */
.store .map {
	position: relative;
	width: 100%;
	height: 500px;
	margin-bottom: 30px;
	border: 1px solid #e5e5e5;
}

/* Убедитесь, что эти стили тоже есть */
#map {
	width: 100%;
	height: 500px;
}

/* Mobile Responsive for Map */
@media only screen and (max-width: 767px) {
	.store .map,
	#map {
		height: 300px;
	}
}

