﻿@charset "utf-8";

/*common*/
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);
body{font-size: 15px; font-weight: 300; color:#4a4a4a; font-family: 'Noto Sans KR', sans-serif; letter-spacing:0px; text-align: center; word-break: break-all; }
html {-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, form, fieldset, p, button, input { margin: 0;padding: 0}
ul, ol, dl {list-style: none}
ul {list-style: none; padding: 0; margin: 0}
img, fieldset, iframe {border: 0}
img {vertical-align:top}
input, select, button { font-family: 'Noto Sans KR', sans-serif; color:#4a4a4a; vertical-align: middle; outline: none; border:none;}
input {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border-radius: 0;}
textarea:focus, input:focus{outline: none;}
textarea{font-family: 'Noto Sans KR', sans-serif; color:#4a4a4a; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
button * {position: relative}
em, address {font-style: normal}
a {text-decoration: none;color: inherit;}
.clear {clear: both;}
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button {-webkit-appearance: none; margin: 0; }
*{-webkit-tap-highlight-color:transparent}
img.map, map area{outline: none;}

img, canvas {
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
}
img::-moz-selection { background-color: transparent; color: #000;}
img::selection {background-color: transparent; color: #000;}
h1,h2,h3,h4,h5,h6{font-weight: 400;}
.noselect {-webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Safari */  -khtml-user-select: none; /* Konqueror HTML */    -moz-user-select: none; /* Old versions of Firefox */  -ms-user-select: none; /* Internet Explorer/Edge */            user-select: none; /* Non-prefixed version, currently supported by Chrome, Opera and Firefox */}

/*mobile*/
/*img {width:100%; height:auto;}
.wid10{width:10%; height:auto;}.wid20{width:20%; height:auto;}.wid30{width:30%; height:auto;}.wid40{width:40%; height:auto;}.wid50{width:50%; height:auto;}
.wid60{width:60%; height:auto;}.wid70{width:70%; height:auto;}.wid80{width:80%; height:auto;}.wid90{width:90%; height:auto;}.wid100{width:100%; height:auto;}*/
.relative{position: relative;}
.blind {font:0/0 a; height: 0; overflow: hidden; position: absolute; width: 0;}
.btn{position: absolute; z-index: 2; cursor:pointer;}
.btn a{position: absolute; width:100%; height:100%; top:0px; left:0px; background-image: url('../images/transparent.png'); font:0/0 a;}

body{ background-color: #e4d4c1; overflow-x: hidden;}
#wrap{font-size:15px; color:#ffffff; width:100%; padding-top:40px; margin:0px auto; position:relative; text-align:left; word-break:keep-all; white-space:-moz-pre-wrap; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word;}
.section{background-repeat: no-repeat; background-position-x: center; position: relative;}
h1{margin-bottom:30px; text-align: center;}
#sns{position: absolute; top:30px; right:30px;}
#sns span{padding:0px 10px; display: inline-block;}
#sns span.facebook{border-right:1px solid #d1b897;}
#footer{margin-top:25px; text-align: center;}
#footer p{margin-top:25px;}

#wrap .arrow{top:50%; position: fixed; z-index: 10; cursor:pointer; display: none;}
#wrap .arrow.prev{left:0%;}
#wrap .arrow.next{right:0%;}
#wrap .arrow.disabled{opacity: 0.5; cursor:default;}
#wrap .arrow.next{right:0%;}
#content{width:1400px; height:740px; margin:0px auto; background-color: #e4d4c1; position: relative;}
#content .section{height:100%; top:0%; left:0%; position: absolute; z-index: 2; overflow: hidden;}
#content .section span.bg{transition: all ease 0.5s; background-repeat: no-repeat; background-size: cover; background-position-x: 50%; top:0; left:0; position:absolute; width:100%;height:100%; cursor:pointer;}
#content #section0 span.bg{background-image: url('../images/bg0.jpg'); background-position-x: 28%;}
#content #section1 span.bg{background-image: url('../images/bg1.jpg'); background-position-x: 53%;}
#content #section2 span.bg{background-image: url('../images/bg2.jpg'); background-position-x: 50%;}
#content #section3 span.bg{background-image: url('../images/bg3.jpg'); background-position-x: 45%;}
#content #section4 span.bg{background-image: url('../images/bg4.jpg'); background-position-x: 38%;}
#content #section5 span.bg{background-image: url('../images/bg5.jpg'); background-position-x: 22%;}

#content .section .dimmed{background-color:#000000; opacity:0.7; top:0; left:0; position:absolute; width:100%;height:100%; z-index: 1; display: none;}
#content #section0 .dimmed{opacity:0.5;}
#content #section5 .dimmed{opacity:0.6;}
#content .section span.bg h2{margin-top:60px; text-align: center; transition: all ease 0.5s;}
#content .section span.bg h2 span{margin-top:10px; font-size:15px; line-height:20px; display: block;}
#content .section span.bg:hover h2{margin-top:70px;}
#content #section0 span.bg:hover{background-position-x: 33%;}
#content #section1 span.bg:hover{background-position-x: 58%;}
#content #section2 span.bg:hover{background-position-x: 55%;}
#content #section3 span.bg:hover{background-position-x: 50%;}
#content #section4 span.bg:hover{background-position-x: 43%;}
#content #section5 span.bg:hover{background-position-x: 27%;}

#content .section .content{width:880px; margin:0px auto; margin-top:60px; z-index: 2; position: relative;  display: none;}
#content .closeContent{position: absolute; top:10px; right:10px; z-index: 10; display: none;  transition: all ease 0.5s;}
#content .closeContent:hover{transform: rotate( -180deg );}
#content .section .content h3 {font-size:18px; margin:18px 0px; display: block; text-align: center;}
#content .section .content .box{position: relative;}

#content #section0 .content .box{margin-bottom:20px; text-align: center;}
#content #section0 .content .box p.txt2 {font-size:17px; margin-top:10px; font-weight: 400;}
#content #section1 .content .box1{margin:20px; padding:10px 40px; margin-top:30px; padding-top:30px; position: relative; border: 1px solid #dee0dd; border-top:none; position: relative;}
#content #section1 .content .box1 h5{font-size:19px; padding-left:7%; position: absolute; width:93%; top:-14px; left:0px;}
#content #section1 .content .box1 h5:before {position:absolute; width:6%; height:1px; top:14px; left:0px;  content: ""; z-index: 2; background-color: #dee0dd;}
#content #section1 .content .box1 h5:after {position:absolute; width:72%; height:1px; top:14px; right:0px;  content: ""; z-index: 2; background-color: #dee0dd;}
#content #section1 .content .box1 li{padding-left:230px; margin-bottom:13px; position: relative;}
#content #section1 .content .box1 li label{width:200px; font-size:15px;line-height:30px; top:0px; left:0px; display: block; position: absolute; padding-left:20px;  background-position-y: 10px; background-image: url('../images/section1_content_ico1.png'); background-repeat: no-repeat;}
#content #section1 .content .box1 li span input{width:240px; height:30px; font-size:14px; margin-right:10px; background-color: #ffffff; border:1px solid #dee0dd; padding:0px 5px;}
#content #section1 .content .box1 li.address span input{width:520px;}
#content #section1 .content .box1 li.comment span textarea{font-size:14px; width:520px; height:70px;}
#content #section1 .content .box1 li span select{width:240px; height:30px; font-size:14px; background-color: #ffffff; border:1px solid #dee0dd; padding:0px 5px;}
#content #section1 .content .box1 li label.l2{line-height:16px; background-position-y: 5px;}
#content #section1 .content .box1 li.comment label{line-height:70px; background-position-y: 50%;}
#content #section1 .content .box1 li.date span select{width:130px; margin-right:10px;}
#content #section1 .content button{margin-left:20px; padding:5px 20px; font-size:16px; background-color: #ffffff; border:1px solid #4a4a4a; cursor:pointer;transition: all ease 0.5s;}
#content #section1 .content button:hover{background-color:#4a4a4a; color:#ffffff; border:1px solid #ffffff;}
#content #section2 .content .box{margin:23px 0px; text-align: center;}
#content #section2 .content .box1{margin-top:18px;}
#content #section2 .content .box p.txt1{font-size:17px; margin-bottom:5px; font-weight: 400;}
#content #section2 .content .box p.txt2{font-weight: 200; font-size:14px;}
#content #section2 .content .box2{padding-top:23px;}
#content #section2 .content .box2::before{width:38px; height:1px; top:0px; left:50%; margin-left:-19px;;  background-color: #b09175; position:absolute; z-index:2; display:block; content: "";} 
#content #section2 .content ul.list{margin:50px 10px; overflow: hidden;}
#content #section2 .content ul.list li{width:210px; height:138px; margin:2px; float:left; position: relative; overflow: hidden; /*cursor:pointer;*/}
#content #section2 .content ul.list li img{width:100%; height:100%;}
#content #section2 .content ul.list li:after {position:absolute; width:210px; height:138px; border:10px solid #ffffff; top:-10px; left:-10px;  content: ""; z-index: 2; opacity:0;  transition: all ease 0.3s;}
/*#content #section2 .content ul.list li:hover:after{width:190px; height:118px; top:0px; left:0px; border:10px solid #ffffff; opacity: 0.7;}*/
#content #section3 h3 span{display: block; margin-top:10px;}
#content #section3 .content ul.list{margin:20px 10px; overflow: hidden;}
#content #section3 .content ul.list li{margin:20px 7px; float:left; position: relative; /*cursor:pointer; */}
#content #section3 .content ul.list li .img{width:266px; height:164px; overflow: hidden; position: relative;}
#content #section3 .content ul.list li .img img{width:100%; height:100%;}
#content #section3 .content ul.list li .img:after {position:absolute; width:266px; height:164px; border:10px solid #ffffff; top:-10px; left:-10px;  content: ""; z-index: 2; opacity:0;  transition: all ease 0.3s;}
/*#content #section3 .content ul.list li .img:hover:after{width:246px; height:144px; top:0px; left:0px; border:10px solid #ffffff; opacity: 0.7;}*/
#content #section3 .content ul.list li p{margin-top:10px; font-size:14px; text-align: center;}
#content #section4 .content .box{width:755px; margin:0px auto; text-align:center; overflow: hidden;}
#content #section4 .content .box .left{width:315px; float:left; padding-right:60px; border-right:1px solid #876f47;}
#content #section4 .content .box .right{width:315px; float:right; padding-left:60px; }
#content #section4 .content .box p.txt1{font-size:16px; padding:6px 0px; margin:18px 0px; border:1px solid #7f7e81;}
#content #section4 .content .box p.txt2{font-size:14px; font-weight: 200;}
#content #section4 .content ul.list{margin:20px 0px; margin-bottom:0px; overflow: hidden;}
#content #section4 .content ul.list li{width:152px; height:102px; margin:2px; float:left; position: relative; overflow: hidden; cursor:pointer;}
#content #section4 .content ul.list li img{width:100%; height:100%;}
#content #section4 .content ul.list li:after {position:absolute; width:152px; height:102px; border:10px solid #ffffff; top:-10px; left:-10px;  content: ""; z-index: 2; opacity:0;  transition: all ease 0.3s;}
#content #section4 .content ul.list li:hover:after{width:132px; height:82px; top:0px; left:0px; border:10px solid #ffffff; opacity: 0.7;}
#content #section5 .content .box{margin:0px auto; margin-top:-20px; overflow: hidden; }
#content #section5 .content .box .left{width:400px; float:left; padding-right:30px; border-right:1px solid #876f47;}
#content #section5 .content .box .right{width:400px; float:right; padding-left:30px; }
#content #section5 .content .box h4{font-size:17px; margin-bottom:10px;}
#content #section5 .content .box p.txt2{font-size:14px; font-weight: 200;}
#content #section5 .content .box .right li{font-weight: 200;}
#content #section5 .content .box .right li em{font-weight: 400;}
#content #section5 .content #map{height:360px; margin-top:30px;}

/*팝업*/
#fade{background-image: url('../images/fade.png'); position: fixed; top:0px; left:0px; width:100%; height:100%; z-index: 9000; display: none;}
.popup {display: none; position: absolute; z-index: 9999; top:0px; text-align: center; width:720px; overflow: hidden;}

.photoGallery{width:839px; top:91px; left:25px; position: absolute; z-index: 10; text-align: center; display: none;}
.photoGallery .close{ top:0px; right:-37px; width:37px;}
.photoGallery .close img{width:100%; height:auto;}
.photoGallery .swiper-button-prev, .photoGallery .swiper-button-next{background-image: none; width:auto; height:auto; outline: none;}
.photoGallery .swiper-button-prev img, .photoGallery .swiper-button-next img{width:44px; height:auto;}
.photoGallery .swiper-button-prev{left:-6%; width:auto; height:auto; background-image: none;}
.photoGallery .swiper-button-next{right:-6%; width:auto; height:auto; background-image: none;}

#layer{width:600px; height:400px; top:350px;  left:50%; margin-left:-150px; border-radius:10px; position: fixed; z-index: 333333; display: none; padding:20px 0px; background-color: #ffffff;}
#layer #btnCloseLayer{position: absolute; top:0px; right:0px; width:20px; height:20px; cursor: pointer;}
#layer #btnCloseLayer img{width:100%; height:auto;}
