@charset "utf-8";

/*font*/

@import url('https://fonts.googleapis.com/css2?family=Diphylleia&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Gowun+Dodum&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Sacramento&display=swap');

/*font-end*/
::-webkit-scrollbar-thumb:vertical{height:0px;}
::-webkit-scrollbar-thumb:horizontal{width:0px;}
::-webkit-scrollbar{width:0; height:0;}

*{-webkit-tap-highlight-color :transparent;}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; list-style: none;}
body{
	overflow-x: hidden;
	background-repeat: no-repeat;
}
a{
	text-decoration: none;
	color:#333;
}

.mbr{display: block;}
	
/*gnb*/
header .gnb{ margin: 0px auto; width: 100%; height: 100px; position: relative; z-index: 9999; }
.gnb .menu{ display: flex; justify-content: space-between; align-items: center; width: 1400px; height: 100%; margin: 0 auto; transition: 0.3s; }
.gnb .menu .logo a{ display: block;}
.gnb .menu .logo img{ width: 110px; filter: invert(1); }
.gnb .menu .btn-area{ display: flex; justify-content: space-around; align-items: center; }
.gnb .menu .btn-area li{ margin-right: 30px; }
.gnb .menu .btn-area li{ position:relative; top:0; left:0; height:100%; }
.gnb .menu .btn-area li:nth-child(1) .call-txt{display:none; text-align:center; font-family: "Gowun Dodum", sans-serif; font-size: 14px; color:#fff; font-weight: 300;}
.gnb .menu .btn-area li:nth-child(1):hover .call-txt{display:block; text-align:center; font-family: "Gowun Dodum", sans-serif; font-size: 14px; color:#fff; font-weight: 300; padding-top: 10px;}
.gnb .menu .btn-area li:nth-child(2) .res-txt{ display:none;  text-align:center; font-family: "Gowun Dodum", sans-serif;font-size: 14px; color:#fff; line-height: 30px; font-weight: 300;}
.gnb .menu .btn-area li:nth-child(2):hover .res-txt{ display:block;  text-align:center; font-family: "Gowun Dodum", sans-serif; font-size: 14px; color:#fff; line-height: 30px; font-weight: 300;}
.gnb .menu .btn-area li i{ font-size: 28px; color: #fff; vertical-align:middle; transition:0.3s;}
/* .gnb .menu .btn-area li:nth-child(2) img{ width: 30px; height: 30px; vertical-align:middle;transition:0.3s;} */

.gnb .menu .btn-area li:nth-child(1) .call-txt.open{ color:#8c857a; }
.gnb .menu .btn-area li:nth-child(2) .res-txt.open{ color:#8c857a; }

.ham-btn{ position:relative; width:40px; height:100%; background-color:transparent; border:none; cursor:pointer; top:-4px; }
.ham-btn::before, .ham-btn::after, .ham-btn div{ content: ""; display:block; height:2px; margin:8px 0; transition:0.3s; background-color:#fff; }
.ham-btn::after{ background:#fff; content:""; display:block; width:100%; height:2px; margin:8px 0 0px; transition: 0.3s; }
.hammenu-on .ham-btn:before {transform: translateY(9px) rotate(135deg);background-color:#fff;}
.hammenu-on .ham-btn:after {transform: translateY(-12px) rotate(-135deg);background-color:#fff;width:100%;}
.hammenu-on .ham-btn div {transform: scale(0);opacity:0;}

header.hammenu-on .gnb {background-color:#f3eee7;box-shadow:none !important;}
header.hammenu-on .gnb-in{border-bottom:1px solid rgba(0,0,0,0.3) !important;}
header.hammenu-on .gnb .menu .logo img{filter: invert(0);}
header.hammenu-on .ham-btn-wrap>p{visibility: hidden;}
header.hammenu-on .gnb>.menu>.btn-area>li:nth-child(1)>a{ display:block; }
header.hammenu-on .gnb>.menu>.btn-area>li i{color: #8c857a;}
.hammenu-on .ham-btn:before {transform: translateY(9px) rotate(135deg);background-color:#8c857a;}
.hammenu-on .ham-btn:after {transform: translateY(-12px) rotate(-135deg);background-color:#8c857a;width:100%;}
.hammenu-on .ham-btn div {transform: scale(0);opacity:0;}

/*hamburger menu*/
.hammenu{ display: flex; position: fixed; top:0px; left: 0; z-index: -1; width: 100%; height:calc(100vh - 65px); padding: 80px 0; justify-content: center; align-items: center; background-color: #f3eee7; opacity: 0; }
.hammenu::after{ content: ''; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width:1px; height: 80vh; background-color: rgba(0, 0, 0, 0.3); }
.hammenu-in{ position: relative;  width: 1700px;  margin:0 auto; }
.hammenu-con{ display: flex; width: 100%;  justify-content: space-between; }
header.hammenu-on .hammenu{ top: 100px; transition:.5s; z-index:1000; opacity:1; }
.hammenu-con .menu{ width: 50%; padding: 100px 0px 0px 60px;; margin-right: 50px; }
.hammenu-con .menu li{ display: flex; margin-bottom: 45px; align-items: center; }
.hammenu-con .menu li:last-child{ margin-bottom: 0; }
.hammenu-con .menu li a{ font-family: "Diphylleia", serif; font-weight: 700; font-size: 36px; color:#333; display: block; }
.hammenu-con .menu .sub{ margin-left: 40px; }
.hammenu-con .menu .sub ul{ display: flex; flex-wrap: wrap; }
.hammenu-con .menu .sub ul li{ line-height: 40px; margin-right: 15px; margin-bottom: 0px; }
.hammenu-con .menu .sub ul li a{ font-family: "Gowun Dodum", sans-serif; font-size: 18px; font-weight: 300; color: #373737; line-height: 1.5em; }
.hammenu-con .menu .sub>ul>li>a:hover{color:#9a9a9a;}

.hammenu-info{ width: 50%; }
.clipimg{ width:282px; filter: drop-shadow(10px 10px 5px #ccc); margin: 0 auto;  }
.hammenu-info-img{ width: 282px; aspect-ratio: 3/4; margin: 0 auto 30px; background: url(../img/main/image7.jpg) no-repeat; background-size: cover; background-position: center center; }
.hammenu-info-txt{ text-align: center; }
.hammenu-info-txt>img{ margin-bottom: 30px; width: 200px; }
.hammenu-info-txt ul li:nth-child(1){ font-family: "Gowun Dodum", sans-serif; margin-bottom: 15px; font-size: 20px; font-weight: 600; }
.hammenu-info-txt ul li:nth-child(2){ font-family: "Gowun Dodum", sans-serif; margin-bottom: 20px; font-size: 16px; font-weight: 400; line-height: 1.5em; }
.hammenu-info-txt ul li:nth-child(3){ font-family: "Gowun Dodum", sans-serif; font-size: 14px; font-weight: 300; }

/*scroll*/
.gnb.scroll{ background-color:#fff; box-shadow:0 0 20px rgba(0, 0, 0, 0.07); z-index: 20; width: 100%; height: 100px; position: fixed; top:0px; left: 0; transition: 0.3s}
.gnb.scroll .menu{ border-bottom:none; transition:0.3s; }
.gnb.scroll .menu .logo a img{ filter: invert(0);}
.gnb.scroll .ham-btn::before, .gnb.scroll .ham-btn::after, .gnb.scroll .ham-btn div{background: #8c857a;}
.gnb.scroll .btn-area{ align-items: center;}
.gnb.scroll .btn-area li i{ color: #8c857a;}


/*main-bn*/
section{ width:100%; height:100%; transition: 0.5s; }
.main-bn{ position: relative; top:-130px; width: 100%; height: calc(100vh + 30px); text-align: center; background-color: #999; z-index: 1;  transition: 0.5s; }
.main-bn .main-bn-txt{ width: 900px; padding: 100px 0; margin: 0 auto; background-color: rgba(0, 0, 0, .2); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius:30px; z-index: 5; }
.main-bn .main-bn-txt h3{ font-family: "Gowun Dodum", sans-serif; font-weight: 300; font-size: 16px; color:#fff; letter-spacing: 1px; }
.main-bn .main-bn-txt h2{ margin-top: 20px; font-family: "Sacramento", cursive;  font-size: 90px; font-weight: 400; color:#fff; text-align: center;}
.main-bn .main-bn-txt .line{ width: 80%; height: 2px; background-color: #8c857a; margin: 40px auto 65px auto; }
.main-bn .main-bn-txt .main-menu ul{ display: flex; justify-content: space-around; width: 80%; margin: 0 auto; }
.main-bn .main-bn-txt .main-menu ul li a{ font-family: "Gowun Dodum", sans-serif; font-size: 18px; color: #fff; font-weight: 300; transition: 0.3s; padding:10px; border-bottom: 2px solid transparent;}

.main-bn .main-bn-txt .main-menu ul li a:hover{ border-bottom: 2px solid #fff; font-size: 18px; }
.main-bn .main-bn-txt .main-menu ul li.on a{ border-bottom: 2px solid #8c857a; font-family: "Gowun Dodum", sans-serif; font-size: 18px; font-weight: 600; }
.main-bn-swip{ width: 100%; height: 100%; }
.main-bn-swip .swiper-slide{width: 100%; height: 100%; background-size: cover; background-position: center center;}
.main-swip-prv, .main-swip-nxt{ position:absolute; top:-50%; z-index:999; cursor:pointer; filter:drop-shadow(0 1px 2px rgba(0,0,0,.9));}
.main-bn-page{filter:drop-shadow(0 1px 2px rgba(0,0,0,.9));}
.main-swip-prv{ left:-30px; top:2px; width:10px; }
.main-swip-nxt{ right:-30px; top:2px; width:10px;}
.main-btn{ position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%); z-index: 999; color: #Fff; }
.main-btn .main-bn-page span{ font-family: "Gowun Dodum", sans-serif; margin: 10px 10px; }
.main-btn .scroll-txt{ font-family: "Gowun Dodum", sans-serif; font-weight: 500; font-style: italic; font-style: 12px; margin-bottom: 10px; }

/* mouse-down */
.scroll-down{position: absolute; bottom: 90px; left:50%; transform: translateX(-50%); z-index: 99;}
.scroll-down .mouse{ width: 30px; height: 50px; border: 2px solid #fff; border-radius: 50px; position: relative;}
.mouse::before{ content: ''; width: 8px; height: 8px; border-radius: 50%; position: absolute; top: 10px; left: 50%; transform: translateX(-50%); background-color: #fff; opacity: 1; animation: wheel 2s infinite; -webkit-animation: wheel 2s infinite;}
@keyframes wheel{
	to{
		opacity: 0;
		top: 30px;
	}
}

/*footer*/
footer{ width: 100%; height: auto; background-color: #f3eee7;}
footer .footer-in{ width: 1400px; margin:0 auto; display: flex; justify-content: space-between; align-items: flex-end; padding:80px 0; background-color:#f3eee7;  }
/* footer .footer-in .footer-logo{ width: 25%;} */
footer .footer-in .footer-logo a img{ width: 120px; vertical-align: middle; margin-bottom: 20px; }
footer .footer-in .footer-logo p{ padding-bottom: 10px; font-family: "Gowun Dodum", sans-serif; font-size: 16px; font-weight: 600; color: #8c857a;}
footer .footer-in .footer-logo p:last-child{ padding-bottom: 0;}
footer .footer-in .footer-logo p a{ font-family: "Gowun Dodum", sans-serif; font-size: 16px; font-weight: 600; color:#8c857a;}

footer .footer-in .footer-l{ width: 25%; }
footer .footer-in .footer-l h2{ font-family: "Gowun Dodum", sans-serif; font-size: 18px; font-weight: 600; color: #8c857a; margin-bottom: 20px; }
footer .footer-in .footer-l p img{ width: 20px; margin-left: 10px; vertical-align: middle;}
footer .footer-in .footer-l p:nth-child(1){ padding-bottom:20px; }
footer .footer-in .footer-l p:nth-child(1) a{ font-size:20px; font-weight:600; }
footer .footer-in .footer-l p, footer .footer-in .footer-l p a{ font-family: "Gowun Dodum", sans-serif; font-weight: 300; font-size: 14px; padding-bottom: 10px; color: #343434; }
footer .footer-in .footer-l p:last-child, footer .footer-in .footer-l p:last-child a{ padding-bottom: 0;}
.copyright{ display: flex; flex-direction: column-reverse; justify-content: flex-end;}
.copyright p{ font-family: "Gowun Dodum", sans-serif; font-weight: 400; font-size: 14px; line-height: 1.5em; text-align: right; }
.copyright img{ width: 30px; display: block; margin: auto 0 10px auto; }
.company{ transition:0.3s; }
.company:hover{ color:#ff5a53; }

footer .footer-in .footer-r{ width: 25%; position: relative; display: flex; flex-direction: column; justify-content: space-between; }
footer .footer-in .footer-r h2{ font-family: "Gowun Dodum", sans-serif; font-size: 18px; font-weight: 600; color: #8c857a; margin-bottom: 20px; }
footer .footer-in .footer-r p, footer .footer-in .footer-r p a{ font-family: "Gowun Dodum", sans-serif; font-weight: 300; font-size: 14px; padding-bottom: 10px; color: #343434; }
footer .footer-in .footer-r p:last-child, footer .footer-in .footer-r p:last-child a{ padding-bottom: 0;}
/********************반응형************************/
@media screen and (min-width: 1px) and (max-width: 1400px){
	.gnb .menu{ width: 95%}
	.gnb .menu .btn-area{ right:30px; }

	.hammenu-con{ padding-right: 50px; }
	.hammenu-con .menu{ padding: 120px 120px; }
	.hammenu-con .menu li a{ font-size:40px; }
	.hammenu-con .menu .sub{ margin-left:30px; }
	.hammenu-con .menu .sub ul li{ line-height:30px; }
	.hammenu-con .menu .sub ul li a{ font-size:16px; }
	.hammenu-info-img{ width:212px; height:300px; }

	footer .footer-in{width:95%;padding:80px 0; translate: 0.3s;}
}
@media screen and (max-width: 1024px){
	.gnb .menu .logo img{ width:90px;}
	.gnb .menu .btn-area{ right:30px; }
	.hammenu{ padding: 10px 0; justify-content: flex-start; align-items: flex-start; }
	.hammenu::after{ content: ''; display: none; }
	.hammenu-con{ padding:0; justify-content: center; }
	.hammenu-con .menu{ width: 100%; padding: 0px; margin-right: 0; }
	.hammenu-con .menu li{ flex-direction: column; margin-bottom: 25px; }
	.hammenu-con .menu li a{ font-size: 25px; margin-bottom: 10px; }
	.hammenu-con .menu .sub{ margin-left: 0; display: flex;}
	.hammenu-con .menu .sub ul{ justify-content: center; flex-direction: column; }
	.hammenu-con .menu .sub ul li{ line-height: 28px; margin: 0 15px; }
	.hammenu-con .menu .sub > ul > li > a{ font-size: 16px; margin-bottom: 5px; }
	.hammenu-info{display: none;}

	/*section*/
	.main-bn{height: 95vh;}
	.main-bn .main-bn-txt h3{ font-size: 12px; }
	.main-bn .main-bn-txt h2{ font-size: 72px; }
	.main-bn .main-bn-txt .line{ width: 73%; }
	.main-bn .main-bn-txt .main-menu{ width:90%; margin: 0 auto;}
	.main-bn .main-bn-txt .main-menu ul li a{ font-size:16px; }
	.main-bn .main-bn-txt .main-menu ul li.on a{font-size: 16px;}

	/*footer*/
	footer .footer-in{ flex-direction: column; justify-content: center; align-items: center; text-align: center;  }
	footer .footer-in .footer-logo{ margin: 0 auto; width: 100%;}
	footer .footer-in .footer-l{ width: 100%; margin:40px auto 40px auto;}
	footer .footer-in .footer-r{ width: 100%; margin-bottom: 30px;}
	.copyright img{ margin: 10px auto;}
	
}

@media screen and (max-width: 768px){
	.mbr{ display: none;}
    .gnb.scroll{height: 80px; z-index: 9999;}
	header.hammenu-on .hammenu{ top:78px; }
	.gnb .menu .btn-area{ right:30px; }
	.gnb .menu .btn-area li:nth-child(1) img{ width:30px; height:29px; }
	.gnb .menu .btn-area li:nth-child(2) img{ width:30px; height:30px; }
	.gnb .menu .btn-area{top:25px;}
	.ham-btn{ width:30px; height: 30px; }
	.ham-btn::before, .ham-btn::after, .ham-btn div{ margin:7px 0; }

	.hammenu{ padding: 35px 0; justify-content: flex-start; align-items: flex-start; }

	.hammenu-on .ham-btn:before {transform: translateY(9px) rotate(135deg);background-color:#8c857a;}
	.hammenu-on .ham-btn:after {transform: translateY(-9px) rotate(-135deg);background-color:#8c857a;width:100%;}
	.gnb .menu .btn-area li { margin-right:20px; }

	/*section*/	
	.main-bn .main-bn-txt{ width: 90%; height: auto; padding: 30px 0; }
	.main-bn .main-bn-txt h3{ margin-top: 40px; font-size: 10px; }
	.main-bn .main-bn-txt h2{ font-size: 42px; }
	.main-bn .main-bn-txt .line{ width: 65%; margin-bottom: 40px; }
	.main-bn .main-bn-txt .main-menu{ width:100%; margin: 0 auto 40px auto;}
	.main-bn .main-bn-txt .main-menu ul li a{ font-size:16px; padding: 5px;}
	.main-bn .main-bn-txt .main-menu ul li a:hover{ font-size:16px; }
	.main-bn .main-bn-txt .main-menu ul li.on a{font-size: 16px;}
	

	/* footer .footer-in .footer-logo a img{ width:100px; } */
}