﻿@charset "utf-8";

#wrap {position:relative; padding-top:0}

.mainVisArea {position:relative; width:100%; height:auto; overflow:hidden; margin-top:150px; text-align:center; z-index:10}
.mainVisArea .swiper-wrapper .swiper-slide {display:block; position:relative; width:100%; height:530px; background-position:50% 0;background-repeat:no-repeat;background-size:cover; display:flex; justify-content:center; flex-wrap:wrap}
.mainVisArea .swiper-wrapper .swiper-slide .__m {display:none}
.mainVisArea .swiper-wrapper .swiper-slide .pc {display:block; width:100%;}
.mainVisArea .swiper-wrapper .swiper-slide .mobile {display:none; width:100%;}

.mainVisArea .swiper-pagination {display:inline-block; padding:15px 65px 15px 31px;  width:auto; height:11px; left:50%; bottom:30px; background:rgba(0,0,0,0.5); overflow:hidden; border-radius:20.5px; -ms-transform:translate(-50%, 0); -webkit-transform:translate(-50%, 0); -moz-transform:translate(-50%, 0); -o-transform:translate(-50%, 0); transform:translate(-50%, 0);}
.mainVisArea .swiper-pagination .swiper-pagination-bullet {vertical-align:top; width:11px; height:11px; margin:0 0 0 10px; background:url("/images/main/imgRoll_indi.png") no-repeat 50% 50%;}
.mainVisArea .swiper-pagination .swiper-pagination-bullet:first-child {margin:0;}
.mainVisArea .swiper-pagination .swiper-pagination-bullet-active {background:url("/images/main/imgRoll_indi_on.png") no-repeat 50% 50%;}
.mainVisArea .swiper-pagination .playBtn {display:block; width:41px; height:41px; position:absolute; top:0; right:0; background:rgba(0,0,0,0.2) url("/images/main/play_bt.png") no-repeat 50% 50%; border-radius:20.5px;}.mainVisArea .swiper-pagination .playBtn.on {background:rgba(0,0,0,0.2) url("/images/main/play_bt_on.png") no-repeat 50% 50%;}
.swiper-button-next, .swiper-button-prev {color:#f78239}

.section2 {padding:70px 0; background:#e8f3e8}
.section3 {padding:70px 0}

.container {clear:both; max-width:1400px; margin:0 auto; font-size:0}

h2 {font-size:35px; font-weight:700; margin-bottom:50px}

.section3 h2 {text-align:center; margin-bottom:40px}

.container .btn_more {width:40px; height:40px; text-align:center; line-height:40px; border-radius:50%; background:#fff}

.d_link {display:flex; flex-wrap:wrap; box-sizing:border-box; padding:45px 0; z-index:100; max-width:1400px; position:relative}
.d_link a {width:16.66%; text-align:center; box-sizing:border-box}
.d_link a p {font-size:22px; margin-top:20px; font-weight:500}

.notice {width:calc(55% - 30px); margin-right:30px; display:inline-block; box-sizing:border-box; position:relative; vertical-align:top; height:410px}
.notice > ul {position:relative; font-size:0}
.notice > ul > li {display:inline-block}
.notice > ul > li+li {margin-left:5px}
.notice > ul > li > a {font-size:22px; color:#666; position:relative; display:block; z-index:1; width:160px; height:60px; background:#fff; border-radius:20px; text-align:center; line-height:60px; font-weight:500}
.notice > ul > li.active > a {color:#fff; background:#1a8c22}
.notice > ul > li > div {position:absolute; top:80px; left:0; display:block; width:100%; box-sizing:border-box}
.notice > ul > li > div p {display:block; position:relative; padding:25px 0 25px 120px; margin-bottom:20px}
.notice > ul > li > div p span {position:absolute; top:8px; left:0; box-sizing:border-box; font-size:27px; font-weight:900; color:#1a8c22; padding:12px 15px; border-radius:10px; background:#fff}
.notice > ul > li > div p a {font-size:20px; font-weight:600; width:100%; text-overflow: ellipsis; white-space:nowrap; overflow:hidden; display:block}
.notice > ul > li:not(.active) > div {display:none}
.notice > ul > li > div > ul {display:block; padding:30px 10px; border-top:#dbdbdb solid 1px; border-bottom:#dbdbdb solid 1px}
.notice > ul > li > div > ul > li {position:relative; box-sizing:border-box; display:block; padding-left:20px}
.notice > ul > li > div > ul > li:before {content:''; width:5px; height:5px; border-radius:50%; position:absolute; left:0; top:50%; transform:translateY(-50%); background:#1a8c22}
.notice > ul > li > div > ul > li+li {margin-top:30px}
.notice > ul > li > div > ul > li > a {width:calc(100% - 100px); text-overflow: ellipsis; white-space:nowrap; overflow:hidden; display:block; font-size:18px}
.notice > ul > li > div > ul > li > span {position:absolute; right:0; top:50%; transform:translateY(-50%); font-size:18px; color:#888; font-weight:400} 
.notice a.btn_more {position:absolute; top:-70px; right:0}

.inquiry {width:calc(45% - 30px); margin-left:30px; display:inline-block; position:relative; border-radius:30px; padding:50px; box-sizing:border-box; background:#fff url('/images/main/inquiry_icon.png') no-repeat 95% 30px}
.inquiry h2 {font-size:25px; margin-bottom:30px}
.inquiry .tel {font-size:40px; font-weight:800; color:#1a8c22; margin-bottom:20px}
.inquiry .tel span {display:inline-block; font-weight:500; margin-right:10px; vertical-align:middle}
.inquiry span {font-size:18px; line-height:1.7}
.inquiry .sns {margin-top:30px; display:flex}
.inquiry .sns a {margin-right:15px}

.photo {position:relative; box-sizing:border-box; margin-bottom:50px}
.photo > div {overflow:hidden; display:flex; padding:10px}
.photo > button {width:40px; height:40px; font-size:0}
.photo > button.prev {position:absolute; top:0; right:50px; background:url('/images/main/btn_prev.png') no-repeat}
.photo > button.next {position:absolute; top:0; right:0; background:url('/images/main/btn_next.png') no-repeat}
.photo > div a {display:inline-block; position:relative; box-sizing:border-box; border-radius:20px; border:#eee solid 1px; box-shadow:0 0 10px 3px rgba(0,0,0,0.05);}
.photo > div a div.img {overflow:hidden; border-radius:20px 20px 0 0; margin-bottom:20px; height:228px}
.photo > div a div.img img {width:100%; height:100%; object-fit:cover; object-position:50% 0}
.photo > div a p {font-size:20px; font-weight:500; line-height:1.2; box-sizing:border-box; text-overflow:ellipsis; overflow:hidden; height:50px; margin:0 20px 20px 20px; position:relative}
.photo > div a span {font-size:18px; color:#1a8c22; display:block; margin-bottom:10px; margin-left:20px}
.photo .btn_more {background-color:#e9e9e9; position:absolute; right:100px; top:0}

.nanum {position:relative; box-sizing:border-box}
.nanum > div {overflow:hidden; display:flex; padding:10px}
.nanum > button {width:40px; height:40px; font-size:0}
.nanum > button.prev {position:absolute; top:0; right:50px; background:url('/images/main/btn_prev.png') no-repeat}
.nanum > button.next {position:absolute; top:0; right:0; background:url('/images/main/btn_next.png') no-repeat}
.nanum > div a {display:inline-block; position:relative; box-sizing:border-box; border-radius:20px; border:#eee solid 1px; box-shadow:0 0 10px 3px rgba(0,0,0,0.05);}
.nanum > div a div.img {overflow:hidden; border-radius:20px 20px 0 0; margin-bottom:20px; height:228px}
.nanum > div a div.img img {width:100%; height:100%; object-fit:cover; object-position:50% 0}
.nanum > div a p {font-size:20px; font-weight:500; line-height:1.2; box-sizing:border-box; text-overflow:ellipsis; overflow:hidden; height:50px; margin:0 20px 20px 20px; position:relative}
.nanum > div a span {font-size:18px; color:#1a8c22; display:block; margin-bottom:10px; margin-left:20px}
.nanum .btn_more {background-color:#e9e9e9; position:absolute; right:100px; top:0}


.main_banner {padding-top:20px; box-sizing:border-box; margin-bottom:30px}
.main_banner .inner_box {position:relative; max-width:1400px; margin:0 auto; padding-bottom:50px; overflow:hidden; box-sizing:border-box}
.main_banner h2 {font-size:20px; margin-bottom:20px; text-align:left}
.main_banner .banners {width:100%}
.main_banner .banners a {border:#dbdbdb solid 1px; border-radius:5px; overflow:hidden; box-sizing:border-box}
.main_banner .banners a img {max-width:100%}
.main_banner .banners .swiper-slide {display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; -webkit-justify-content:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; -webkit-align-items:center; align-items:center}
.main_banner .btn {position:absolute; bottom:0; right:0; font-size:0}
.main_banner .btn li {display:inline-block; margin-left:-1px}
.main_banner .btn li.cnt {font-size:14px; line-height:22px; margin-right:10px; vertical-align:middle; margin-left:0}
.main_banner .btn li button {width:22px; height:22px; display:block; font-size:0; background:#fff url('/images/main/btn_banner.png') no-repeat; border:1px solid #999; box-sizing:border-box; background-position:0 1px}
.main_banner .btn li button.next {background-position:-43px 1px;}
.main_banner .btn li button.play {background-position:-58px 0; display:none}
.main_banner .btn li button.pause {background-position:-21px 0; display:none; width:23px}
.main_banner .btn li button.play.on,
.main_banner .btn li button.pause.on {display:inline-block}


@media all and (max-width:1400px){
	
	.container {padding:0 10px}
	
}


@media all and (max-width:1200px){
	
	.mainVisArea {margin-top:80px}
	
	.main_banner .inner_box {width:100%; padding:0 0 50px 0; box-sizing:border-box}
	.main_banner .btn_ {right:10px}
	
	.notice {width:100%; margin-right:0; display:block; margin-bottom:40px}
	
	.inquiry {width:100%; margin-left:0; display:block}
	
}


@media all and (max-width:1024px){

	.d_link a {width:33.33%}
	.d_link a img {max-width:100%}
	.d_link a:nth-child(n+4) {margin-top:30px}
	
}


@media all and (max-width:768px){
	
		
}

@media all and (max-width:640px){
	
	.mainVisArea .swiper-wrapper .swiper-slide {height:auto !important}
	.mainVisArea .swiper-wrapper .swiper-slide .__m {display:block}
	
	.section2 {padding:40px 0}
	.section3 {padding:40px 0}
	
	.section3 h2 {font-size:25px; text-align:left; margin-bottom:30px}
	
	.d_link {padding:30px 0}
	.d_link a {width:50%}
	.d_link a:nth-child(n+3) {margin-top:30px}
	.d_link a img {width:100px}
	.d_link a p {font-size:19px}
	
	.notice {height:300px}
	.notice > ul > li > a {font-size:19px; width:120px; height:50px; line-height:50px}
	.notice > ul > li.active > a {color:#fff; background:#1a8c22}
	.notice > ul > li > div p {padding:10px 0 10px 90px; margin-bottom:20px}
	.notice > ul > li > div p span {top:0; font-size:22px; padding:10px}
	.notice > ul > li > div p a {font-size:18px}
	.notice > ul > li > div > ul {padding:20px 10px}
	.notice > ul > li > div > ul > li+li {margin-top:20px}
	.notice > ul > li > div > ul > li > a {font-size:16px}
	.notice > ul > li > div > ul > li > span {font-size:16px} 
	
	.inquiry {padding:30px; background-size:80px}
	.inquiry h2 {font-size:22px; margin-bottom:20px}
	.inquiry .tel {font-size:27px; margin-bottom:10px; letter-spacing:-1px}
	.inquiry span {font-size:16px; line-height:1.7}
	.inquiry .sns {margin-top:20px}
	.inquiry .sns a {margin-right:15px}

	.photo > div a p {font-size:18px; height:40px}
	.photo > div a span {font-size:16px}
	
	.nanum > div a p {font-size:18px; height:40px}
	.nanum > div a span {font-size:16px}
	
}

@media all and (max-width:520px){
	
	
}

@media all and (max-width:480px){

	.notice > ul > li > a {font-size:18px; width:90px; height:50px; line-height:50px}	

}

/*툴팁 아작스 */
.tooltipster-fade.tooltipster-show {
  -webkit-animation-duration: 0ms !important;
  animation-duration: 0ms !important;
  -webkit-transition-duration: 0ms !important;
  -o-transition-duration: 0ms !important;
  transition-duration: 0ms !important;
  z-index: 2 !important; }

.tooltipster-sidetip .tooltipster-box {
  background: #fff;
  border: 1px solid #aaa;
  border-radius: 4px;
  color: #666;
  -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.1); }

.tooltipster-sidetip .tooltipster-content {

  color: #666;
  font-size: 14px;
  line-height: 1.8;
  padding: 20px;

}

.tooltipster-sidetip.tooltipster-light .tooltipster-box {
    background: #fff !important
}

.tooltipster-sidetip .tooltipster-content li.tit {font-weight:bold; margin-bottom:5px}

.tooltipster-sidetip .tooltipster-content {
    color: #333 !important;
    line-height: 18px;
    padding: 6px 14px;
}

  @media screen and (max-width: 768px) {
    .tooltipster-sidetip .tooltipster-content {
      padding: 16px;
      font-size: 13px;
		}
	}

.tooltipster-sidetip.tooltipster-light .tooltipster-box {
  border-radius: 3px;
  border: 1px solid #aaa;
  background: #fff; }

.tooltipster-sidetip.tooltipster-light.tooltipster-bottom .tooltipster-arrow-border {
  border-bottom-color: #aaa; }

.tooltipster-sidetip.tooltipster-light.tooltipster-bottom .tooltipster-arrow-background {
  border-bottom-color: #fff; }

.tooltipster-sidetip.tooltipster-light.tooltipster-top .tooltipster-arrow-border {
  border-top-color: #aaa; }

.tooltipster-sidetip.tooltipster-light.tooltipster-top .tooltipster-arrow-background {
  border-top-color: #fff; }

.tooltipster-sidetip.tooltipster-light.tooltipster-left .tooltipster-arrow-border {
  border-left-color: #aaa; }

.tooltipster-sidetip.tooltipster-light.tooltipster-left .tooltipster-arrow-background {
  border-left-color: #fff; }

.tooltipster-sidetip.tooltipster-light.tooltipster-right .tooltipster-arrow-border {
  border-right-color: #aaa; }

.tooltipster-sidetip.tooltipster-light.tooltipster-right .tooltipster-arrow-background {
  border-right-color: #fff; }