@charset "utf-8";

*{margin: 0; padding: 0; box-sizing: border-box;}
li{list-style: none;}
a{text-decoration: none; color: inherit;}
img{max-width: 100%; vertical-align: top;}
table{width: 100%; border-collapse: collapse;}
button{cursor: pointer;}
body{background: #fff; color: #333;}

.wrap{height: 900px; position: relative; min-width: 1238px}
.top{height: 800px; display: flex;}
header{width: 260px; background: #dcb57b; padding: 30px 10px;}
header h1{text-align: center; margin-bottom: 20px;}

nav>ul>li{position: relative; text-align: center; font-weight: bold;}
nav>ul>li>a{display: block; background: #944450; padding: 10px; color: #fff; border: 1px solid #fff}
nav>ul>li:hover>a,
nav>ul>li>a:focus,
nav>ul>li.on>a{background: #fff; color: #333;}

.sub{position: absolute; top: 0; right: -240px; width: 240px; z-index: 10; display: none;}
.sub a{display: block; padding: 10px; background: #e8a9a9; color:#fff; border: 1px solid #fff}
.sub a:hover,
.sub a:focus{background: #e07283; color: #333;}

.consult{display: flex; gap:5px; text-align: center; }
.consult a{display: inline-block; margin-top: 20px; margin-left: 15px; width:80px; padding: 5px; font-size: 15px; filter: brightness(1.1);  text-decoration:none; font-weight: bold; border-radius: 12px; }
.consult a[href*="naver"]{background-color: #944450; color: #fff;}
.consult a[href*="daum"]{background-color: #944450; color: #fff;}
.consult a:hover{transform: translateY(-10px); }

.contents{width: 400px; }

.banner{background: #837373;}
.banner a{display: block; padding: 30px 30px; display: flex; align-items: center; }
.banner .photo{width: 120px; margin-right: 10px; }
.banner .text h2{color: #fff; font-size: 16px;margin-left: 30px;}
.banner .text .expl{font-size: 15px; letter-spacing: -1.5px;margin-left: 30px;}


.notice{margin-top: 50px; padding: 0 10px; }
.notice h2{width: 120px; background: #944450; padding: 10px; text-align: center; font-size: 20px; border-radius: 10px 10px 0 0; color:#fff ;}
.notice table{border-top: 2px solid #944450;}
.notice table th{text-align: left;}
.notice table tr{border-bottom: 1px solid #ccc;}
.notice table tr a{padding: 10px 20px; display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; width: 250px;}
.notice table td{text-align: center;}

.gal{margin-top: 50px; padding: 0 10px; }
.gal h2{width: 120px; background: #944450; padding: 10px; text-align: center; font-size: 20px; border-radius: 10px 10px 0 0; color:#fff ;}
.gal ul{display: flex; border-top: 2px solid #944450; justify-content: center; gap: 30px; padding-top: 30px;}
.gal ul li{width: 150px; text-align: center;}
.gal ul li img{width: 150px; height: 180px; object-fit: cover; }
.gal .title{font-weight: bold; font-size: 16px; padding-top: 10px;}

.slide{width: calc(100% - 500px); background: #dcb57b; position: relative; overflow: hidden;}
.slide ul{position: absolute; left: 0; top: 0; width: 100%;}
.slide ul li{width: 100%; height: 800px; position: relative;}
.slide ul li a{display: block; height: 100%;}
.slide ul li.s1{background: url(../img/s1.jpg) no-repeat center/cover;}
.slide ul li.s2{background: url(../img/s2.jpg) no-repeat center/cover;}
.slide ul li.s3{background: url(../img/s3.jpg) no-repeat center/cover;}
.slide ul li .text{position: absolute; bottom: 0; left: 0; width: 100%; background: #333; color: #fff; padding: 30px;}
.slide ul li .text h2{font-size: 30px; margin-bottom: 20px;}
.slide ul li .text p{font-size: 20px;}

footer{height: 100px; background: #837373; color: #fff; position: relative; display: flex; gap: 20px; align-items: center; padding-left: 20px;}
footer select{position: absolute; top: 30px; right: 10px; width: 100px; height: 40px; font-weight: bold;}
footer .fmenu{display: flex; gap: 10px; text-align: center;}
footer .fmenu li{border-right:1px solid #fff; padding-right: 10px;}
footer .fmenu li:last-child{border-right: none;}
footer .copy{font-size: 16px;}

.layer{position: absolute; top: 40%; left: 50%; transform: translate(-50%, -50%); z-index: 9999; 
    background: #fff; text-align: center; padding: 20px; border-radius: 5px; display: none;}
.layer h2{color: #4d455d; margin-bottom: 10px;}