@charset "utf-8";

#section0{ background: url(../images/bg_m1.jpg) center center no-repeat;
  /* -webkit-animation: zoomin 2s ease;
  animation: zoomin 2s ease;
  animation-fill-mode: forwards; */
}
#section1{ background: url(../images/bg_m2.jpg) center center no-repeat;}
#section2{ background: url(../images/bg_m3.jpg) center center no-repeat;}
#section3{ background: url(../images/bg_m4.jpg) center center no-repeat;}
#section4{ background: url(../images/bg_m5.jpg) center center no-repeat;}
#section5{ background-color: #fff;}
#section6{ background-color: #fff;}

#section0,
#section1,
#section2,
#section3,
#section4,
#section5{
	background-size: cover;
	background-attachment: fixed;
	text-align: center;
	color: #000;
	padding:74px 0 0 0;
}
.m_scroll{ position: fixed; top:50%; right:0; color: #d5d5d5; transform: rotate(90deg); margin-top: -230px; margin-right: -23px}
.m_bottom{ position: fixed; bottom:0; right:0; color: #fff; background-color: #000; width: 300px; height: 90px; text-align: center; padding:20px 0; font-size: 20px;}
.m_bottom img{ vertical-align: middle; padding-right: 10px;}

.sectionText{ position: absolute; top:50%; left: 10%; width: 700px; text-align: left; margin-top: -80px;}
.sectionText p{ float: left; width: 100px; height: 100px; text-align: center; margin-right: 10px;
-webkit-animation: slide-right 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s both;
	        animation: slide-right 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s both;}
.sectionText p img{ display: block;}
.sectionText h1{ color: #fff; font-size: 50px; letter-spacing: -1px;font-family: 'PT Serif', serif;
-webkit-animation: slide-right 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s both;
	        animation: slide-right 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s both;
/*text-shadow: 5px 5px 5px rgba(0,0,0,0.8);*/
}
.sectionText h4{ color: #fff; font-size: 20px;
-webkit-animation: slide-right 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s both;
	        animation: slide-right 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s both;
/*text-shadow: 5px 5px 5px rgba(0,0,0,0.8);*/
}
.sectionText h3{ 
    color: #fff;
    font-size: 20px;
    padding-bottom: 50px;
-webkit-animation: slide-right 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s both;
	        animation: slide-right 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s both;
/*text-shadow: 5px 5px 5px rgba(0,0,0,0.8);*/
}
.sectionText h3 img{
    width: 200px;                                                         
}
.fadeUp{
	-webkit-animation: fadeUp 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: fadeUp 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
.fadeDown{
	-webkit-animation: fadeDown 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: fadeDown 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
.slideLeft{
	-webkit-animation: slide-right 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-right 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
@-webkit-keyframes zoomin {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    -webkit-transform: scale(1.01);
    transform: scale(1.01);
  }
}
.sectionText2{ position: absolute; top:50%; left: 0; width: 100%; text-align: center; line-height: 36px; opacity: 0; margin-top: calc(10vh - 3%)}
.sectionText2 .v_line{ background-color: #7997aa; width: 1px; height: 68px; margin: auto;}

.sectionText3{ position: absolute; top:50%; left: 10%; text-align: left; line-height: 36px; color: #fff; margin-top:-170px; opacity: 0}
.sectionText3 h2{ font-size: 25px; padding-bottom: 8px;}
.sectionText3 h1{ font-size: 50px; padding-bottom: 40px; font-weight: 400;}
.sectionText3 p{ font-size: 18px; padding-bottom: 15px;}

/** 갤러리
===================================*/
.bx-wrapper {
  position: relative;
  padding: 0;
  *zoom: 1;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
}
.bx-wrapper img {
  min-width: 320px;
  width: 100%;
  display: block;
}
.bxslider {
  margin: 0;
  padding: 0;
}
ul.bxslider {
  list-style: none;
}
.bx-viewport {
  -webkit-transform: translatez(0);
}
/** THEME
===================================*/
.bx-wrapper {}
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
  position: absolute;
  bottom: 30px;
  width: 100%;
}
/* AUTO CONTROLS (START / STOP) */
.bx-wrapper .bx-controls-auto {
  text-align: center;
}
.bx-wrapper .bx-controls-auto .bx-start {
  display: block;
  text-indent: -9999px;
  width: 23px;
  height: 23px;
  outline: 0;
  background: url('../images/controls_p_w.png') center center no-repeat;
  margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-start.active,
.bx-wrapper .bx-controls-auto .bx-start:focus {
  background: url('../images/controls_p.png') center center no-repeat;
}
.bx-wrapper .bx-controls-auto .bx-stop {
  display: block;
  text-indent: -9999px;
  width: 23px;
  height: 23px;
  outline: 0;
  background: url('../images/controls_s.png') center center no-repeat;
  margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-stop.active,
.bx-wrapper .bx-controls-auto .bx-stop:focus {
  background: url('../images/controls_s_w.png') center center no-repeat;
}
/* PAGER */
.bx-wrapper .bx-pager {
  text-align: center;
  padding-top: 20px;
}
.bx-wrapper .bx-pager.bx-default-pager a {
  /*background: #fff;*/
  text-indent: -9999px;
  display: block;
  width: 14px;
  height: 14px;
  margin: 0 5px;
  outline: 0;
	border-radius: 50%;
	border:1px solid #fff;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:focus {
  background: #fff;
}
.bx-wrapper .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
  display: inline-block;
  vertical-align: bottom;
  *zoom: 1;
  *display: inline;
}
.bx-wrapper .bx-pager-item {
  font-size: 0;
  line-height: 0;
}
/* DIRECTION CONTROLS (NEXT / PREV) */
.bx-wrapper .bx-prev:hover,
.bx-wrapper .bx-prev:focus {
  background-position: 0 0;
}
.bx-wrapper .bx-controls-direction a {
	position: absolute;
	bottom: 35px;
	outline: 0;
	width: 25px;
	height:25px;
	text-indent: -9999px;
	z-index: 70;
	/*font-size: 25px;*/
	color: #fff;
}
.bx-wrapper .bx-prev {
	left:185px;
	color: #b7b7b7;
	background:url(../images/btn_cL.png) no-repeat;
}
.bx-wrapper .bx-next {
	right:225px;
	color: #b7b7b7;
	background:url(../images/btn_cR.png) no-repeat;
}
.bx-wrapper .bx-controls-direction a.disabled {
  display: none;
}

.mainSlide{ width: 508px; height: 622px;  position: absolute; top: calc(50vh - 18em); left: 50%; box-shadow: 14px 14px 29px rgba(0,0,0,0.15); background-color: #fff;}
.slideBtn{ position: absolute; bottom:90px; left: -90px; width: 190px; background: #a40033 url(/images/mainArw.png) 170px center no-repeat; color: #fff; z-index: 70; text-align: left; line-height: 40px; font-size: 14px; text-indent: 15px; display: block;}
.slideNum{ position: absolute; bottom:30px; width: 100px; left: 50%; margin-left: -70px; text-align: center; color: #444; z-index: 10; text-align: center; line-height: 40px;}
.slideNum p{ width: 100%; overflow: hidden;}
.slideNum p span{ display: inline-block;}
.slideNum .gostop{ position: absolute; right: 0; bottom: -23px;}

.cSlideText{ padding:50px; background-color: #fff; position: absolute; top:0;left:0; width: 508px; height: 622px; text-align: left;}
.cSlideText h4{font-size: 14px; padding-bottom: 40px;  font-family: 'PT Serif', serif;}
.cSlideText h1{font-size: 30px; padding-bottom: 40px; line-height: 42px;}
.cSlideText p{font-size: 14px; line-height: 24px;}

.sectionConBox{ max-width: 1550px; min-width: 1280px; margin: 0 auto; padding:calc(30vh - 10em) 0;}
.sectionText4{ text-align: left; opacity: 0;}
.sectionText4 h4{ font-size: 15px; padding-bottom: 10px;}
.sectionText4 h2{ font-size: 30px; padding-bottom: 30px; line-height: 42px;}
.sectionText4 h2 span{ color: #67869b; font-weight: 400;}
.sectionText4 h3{ font-size: 24px; color:#a9bbc6; font-weight: 300; padding-bottom: 20px;}

.mboardWrap{
    max-width: 1300px;
    /*height: 242px;*/
    position: absolute;
    top: 50%;
    left: 10%;
    margin-top: 100px;
    background-color: #fff;
    padding: 10px;
    border-radius: 5px;
    animation: fadeDown 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s both;
}
.mboardWrap .mboardBtnBox{text-align: right; padding:10px 20px 10px 0; font-size: 14px;}
.mboardWrap .mboardBtnBox a img{ vertical-align: middle; margin: 0 3px;}
.mboardWrap ul{ 
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 7px;
}
.mboardWrap li{ 
    flex:1;
}
.mboardWrap li:last-child{ margin-right: 0;}
.mboardBox{ width: 100%; border:1px solid #ddd; background-color: #fff; cursor: pointer;}
.mboardBox p{ width: 100%; height: 100%; background-color: #f8f8f8;}
.mboardBox p img{ width: 100%; display: block; height: 100%;}
.mboardBox h4{ padding:10px 20px 5px; text-align: left; font-size: 15px; color: #a1a0a0; display: none;}
.mboardBox h3{ padding:5px 20px 10px; text-align: left; font-size: 17px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: none;}

.mainMapWrap{ width:100%; position: relative; height: 600px;}
.mainMapWrap .mainMapInfo{ position: absolute; width: 440px; height: 420px; top:80px; left: 10%; background-color: rgba(255,255,255,0.8); box-shadow: 14px 0 29px rgba(0,0,0,0.15); z-index: 5; padding:70px 50px; text-align: left; opacity: 0;}
.mainMapWrap .mainMapInfo h1{font-size: 32px; text-align: left; color: #757575; font-weight: 400; letter-spacing: -1px; text-transform:uppercase;}
.mainMapWrap .mainMapInfo h1 span{ color: #7c99ac; font-weight: 400;}
.mainMapWrap .mainMapInfo h2{ font-size: 28px; text-align: left; color: #000; font-weight: 700; padding:15px 0;}
.mainMapWrap .mainMapInfo h3{ color: #7c99ac;}
.mainMapWrap .mainMapInfo p{ font-size: 17px; padding:25px 0 35px;}
.mainMapWrap .mainMapInfo h4{ font-size: 15px;}
.mainMapWrap .mainMapInfo h5{ font-size: 15px; color: #848484;}

#daumRoughmapContainer1605590312058{ width: 100%; height: 600px; }

/*.main_popup{width:510px;}*/
.main_popup a{ color:#fff; display: inline-block;}
.pull-right{float:right;}
.popup_bottom{
	overflow:hidden;
    background-color: #6d6d6d;
    color: #fff;
	font-size:14px;
    padding: 6px 10px;
	margin-top:-5px;
}


.main-ani-text{
    position: absolute;
    bottom: 14%;
    left: clamp(2.1875rem, -2.8125rem + 6.25vw, 4.6875rem);
    max-width: 1240px;
}
.sectionText{
    position: relative;
    top: auto;
    left: 0%;
    text-align: left;
    margin-top: 0;
}
.mboardWrap{
    position: relative;
    top: auto;
    left:0;
    margin-top: 60px;
    background-color: #fff;
    padding: 10px;
    border-radius: 5px;
    animation: fadeDown 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s both;
}
.bn-main{
    position: absolute;
    bottom: 14%;
    right: clamp(3.875rem, -3.875rem + 9.6875vw, 7.75rem);
    width: 400px;
    height: 667px;
    overflow: hidden;
    text-align: left;
    animation: fadeDown 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) .5s both;
    z-index: 99 !important;
}
.bn-img img{
    width: 100%;
    height: 667px;
}
.bn-main .slick-dots{ 
    position: absolute;
    bottom: 10px;
    left: 0;
    width: 100%;
    text-align: center;
}
.bn-main .slick-dots li{
    display: inline-block;
    margin: 0 5px;
}
.bn-main .slick-dots li button {
    background-color: rgba(255,255,255,0.5);
    width: 10px;
    height: 10px;
    border:0;
    border-radius: 50%;
    text-indent: -9999px;
    overflow:hidden;
    cursor: pointer;
}
.bn-main .slick-dots li.slick-active button{ 
    background-color: #fff;
}