@charset "utf-8";

/*font*/
@import url('https://webfontworld.github.io/amore/AritaDotum.css');
@import url('https://webfontworld.github.io/yangheeryu/GowunBatang.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200;300;400;500;600;700;900&family=Noto+Serif:wght@500;600;700;800;900&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;
}

.arita{ font-family: 'Arita-dotum-Medium' !important;}
.gowun{ font-family: "GowunBatang" !important; }
	
/*gnb*/
header .gnb{ margin: 0px auto; width: 100%; height: 100px; position: relative; z-index: 9999; }
.gnb .menu{ display: flex; justify-content: space-between; width: 1600px; margin: 0 auto; transition: 0.3s; }
.gnb .menu .logo img{ width: 70px; position: absolute; top:10px; left: 120px; }
.gnb .menu .btn-area{ height: 58px; display: flex; justify-content: space-around; align-items: center; position: absolute; top:35px; right: 120px; }
.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: "Noto Sans KR"; 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: "Noto Sans KR"; 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: "Noto Sans KR"; 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: "Noto Sans KR"; font-size: 14px; color:#fff; line-height: 30px; font-weight: 300;}
.gnb .menu .btn-area li:nth-child(1) img{ width: 29px; 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; 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 .ham-btn-wrap>p{visibility: hidden;}
header.hammenu-on .gnb>.menu>.logo>a>img{content:url(../img/logo-b.png); width:60px !important; }
header.hammenu-on .gnb>.menu>.btn-area>li:nth-child(1)>a{ display:block; }
header.hammenu-on .gnb>.menu>.btn-area>li:nth-child(1)>a>img{filter: invert(50%) sepia(11%) saturate(340%) hue-rotate(358deg) brightness(102%) contrast(86%);}
header.hammenu-on .gnb>.menu>.btn-area>li:nth-child(2)>a>img{filter: invert(50%) sepia(11%) saturate(340%) hue-rotate(358deg) brightness(102%) contrast(86%);}
.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%; padding-right: 50px; justify-content: space-between; }
header.hammenu-on .hammenu{ top: 100px; transition:.5s; z-index:1000; opacity:1; }
.hammenu-con .menu{ width: 50%; padding: 100px 120px 0px; }
.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: "GowunBatang"; font-weight: 700; font-size: 36px; color:#333; }
.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: "AritaDotum"; font-size: 18px; font-weight: 300; color: #373737; }
.hammenu-con .menu .sub>ul>li>a:hover{color:#9a9a9a;}

.hammenu-info{ width: 40%; }
.clipimg{ width:282px; filter: drop-shadow(10px 10px 5px #ccc); margin: 0 auto;  }
.hammenu-info-img{ width: 282px; height: 400px; margin: 0 auto 30px; background: url(../img/main/image10.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: "Noto Sans CJK KR"; margin-bottom: 15px; font-size: 20px; font-weight: 600; }
.hammenu-info-txt ul li:nth-child(2){ font-family: "Noto Sans CJK KR"; margin-bottom: 20px; font-size: 16px; font-weight: 400; }
.hammenu-info-txt ul li:nth-child(3){ font-family: "Noto Sans CJK KR"; 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 .ham-btn::before, .gnb.scroll .ham-btn::after, .gnb.scroll .ham-btn div{background: #8c857a;}

.gnb.scroll .btn-area li:nth-child(1)>a>img{filter: invert(50%) sepia(11%) saturate(340%) hue-rotate(358deg) brightness(102%) contrast(86%);}
.gnb.scroll .btn-area li:nth-child(2)>a>img{filter: invert(50%) sepia(11%) saturate(340%) hue-rotate(358deg) brightness(102%) contrast(86%);}


/*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; height: 400px; 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{ margin-top: 120px; font-family: "GowunBatang"; font-size: 16px; color:#fff; letter-spacing: 1px; }
.main-bn .main-bn-txt h2{ margin-top: 20px; font-family: 'Noto Serif CJK KR', serif; font-size: 60px; font-weight: 400; color:#fff; }
.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; }
.main-bn .main-bn-txt .main-menu ul li a{ font-family: "AritaDotum"; 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: "AritaDotum"; 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:"AritaDotum" ; margin: 10px 10px; }
.main-btn .scroll-txt{ font-family: 'AritaDotum'; font-weight: 500; font-style: italic; font-style: 12px; margin-bottom: 10px; }

/*footer*/
footer{ width: 100%; height: auto; background-color: #f3eee7; padding-bottom:40px; }
footer .footer-in{ width: 1400px; margin:0 auto; display: flex; justify-content: space-between; padding-top: 60px; background-color:#f3eee7 }
footer .footer-in .footer-logo a img{ width: 100px; vertical-align: middle; }

footer .footer-in .footer-l{ width: 600px; margin-left: 100px; }
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: "AritaDotum"; font-weight: 300; font-size: 14px; padding-bottom: 10px; color: #8c857a; }
footer .footer-in .footer-l p .company{ transition:0.3s; }
footer .footer-in .footer-l p .company:hover{ color:#ff5a53 }
footer .footer-in .footer-r{ width: 700px; }
footer .footer-in .footer-r ul{ display: flex; justify-content: space-between; text-align: center; }
footer .footer-in .footer-r ul li{ margin-left:40px; }
footer .footer-in .footer-r ul li .submenu li{ margin-left:0px; }
footer .footer-in .footer-r ul li a{ font-family: 'AritaDotum', sans-serif; font-weight: 600; font-size: 16px; color: #9c958b; }
footer .footer-in .footer-r ul .submenu{ display: flex; justify-content: space-between; flex-direction: column; padding-top: 20px; }
footer .footer-in .footer-r ul .submenu li{ padding-bottom: 8px; }
footer .footer-in .footer-r ul .submenu li a{ display: block; font-family: "AritaDotum"; font-weight: 300; font-size: 14px; color: #9c958b; }
footer .footer-in .footer-r ul .submenu li a:hover{ font-family: "AritaDotum"; font-weight: 600; font-size: 14px; color: #9c958b; }

/********************반응형************************/
@media screen and (min-width: 1px) and (max-width: 1400px){
	.gnb .menu .logo img{ width:70px; left: 30px;}
	.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-in{width:100% !important;padding:0 20px 0px 20px; translate: 0.3s;}
}
@media screen and (max-width: 1024px){
	.gnb .menu .logo img{ width:60px; left: 30px;}
	.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; }
	.hammenu-con .menu li{ flex-direction: column; margin-bottom: 20px; }
	.hammenu-con .menu li a{ font-size: 25px; margin: 10px 0; }
	.hammenu-con .menu .sub{ margin-left: 0; }
	.hammenu-con .menu .sub ul{ justify-content: center; }
	.hammenu-con .menu .sub ul li{ line-height: 28px; margin: 0 15px; }
	.hammenu-con .menu .sub ul li a{ font-size: 13px; }
	.hammenu-info{display: none;}

	/*section*/
	.main-bn{height: 667px;}
	.main-bn .main-bn-txt{ width: 750px; height: 400px; }
	.main-bn .main-bn-txt h3{ font-size: 12px; }
	.main-bn .main-bn-txt h2{ font-size: 48px; }
	.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{ padding-bottom: 60px; height: 400px;}
	footer .footer-in{ flex-direction: column; justify-content: center; align-items: center; text-align: center;  }
	.footer-in .footer-logo{ margin: 0 auto; }
	.footer-in .footer-l{ margin:40px auto 0px auto; width: 100% !important; margin-left: 0px !important;}
	.footer-in .footer-r{ display: none;}
}

@media screen and (max-width: 780px){
    .gnb.scroll{height: 80px; z-index: 9999;}
	.gnb .menu{ margin-left:50px; }
	.gnb .menu .logo img{ width:60px !important; left: 30px;}
	.gnb.scroll .menu .logo img{ width:45px !important; }
	header.hammenu-on .gnb .logo img{ width: 45px !important;}
	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; top:-16px; }
	.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; }
	.main-bn .main-bn-txt h3{ margin-top: 40px; font-size: 10px; }
	.main-bn .main-bn-txt h2{ font-size: 34px; }
	.main-bn .main-bn-txt .line{ width: 65%; margin-bottom: 40px; }
	.main-bn .main-bn-txt .main-menu{ width:90%; margin: 0 auto 40px auto;}
	.main-bn .main-bn-txt .main-menu ul li a{ font-size:14px; padding: 5px;}
	.main-bn .main-bn-txt .main-menu ul li a:hover{ font-size:14px; }
	.main-bn .main-bn-txt .main-menu ul li.on a{font-size: 14px;}

	footer .footer-in .footer-logo a img{ width:70px; }
}