﻿@charset "utf-8";

#wrap {position:relative; padding-top:0}

.mainVisArea {position:relative; width:100%; height:auto; overflow:hidden; margin-top:190px}
.mainVisArea .swiper-wrapper .swiper-slide {display:block; position:relative; width:100%; height:650px; 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:#f1c75b}

h2 {font-size:30px; font-weight:500; margin-bottom:30px}

.section2 {padding:70px 0; background:#fff9e8; background-size:cover}
.section3 {padding:70px 0}
.container {clear:both; max-width:1400px; margin:0 auto; font-size:0}

.d_link {max-width:1400px; margin:0 auto; display:flex; box-sizing:border-box; padding:50px 0}
.d_link a {width:20%; box-sizing:border-box; text-align:center; border-right:#eee solid 1px}
.d_link a:first-child {border-left:#eee solid 1px}
.d_link a p {font-size:18px; margin-top:30px; line-height:1.3}

.news {display:inline-block; font-size:18px; position:relative; vertical-align:top; width:calc(30% - 20px); margin-right:20px}
.news a {display:block; background:#fff; border-radius:20px; padding:30px; box-sizing:border-box}
.news a+a {margin-top:20px}
.news a div {display:flex; align-items:center; padding-bottom:20px; border-bottom:#eee solid 1px; margin-bottom:15px}
.news a label {width:110px; height:110px; border-radius:50%; background:#f5c437; color:#fff; font-size:20px; font-weight:700; text-align:center; display:inline-block; box-sizing:border-box; padding-top:15px; margin-right:20px}
.news a label strong {font-size:40px; display:block; margin-bottom:10px}
.news a p {width:calc(100% - 130px); font-size:22px; font-weight:500}
.news a span {line-height:1.5}
.news .btn_more {position:absolute; top:0; right:0; padding:0; margin:0; background:none}

.story {display:inline-block; font-size:16px; position:relative; vertical-align:top; width:calc(45% - 20px); margin-right:20px}
.story > div {background:#fff; padding:15px; border-radius:20px}
.story > div a {display:flex; align-items:center}
.story > div a+a {margin-top:20px}
.story .img {border-radius:10px; overflow:hidden; width:245px; height:157px}
.story .img img {width:100%; height:100%; object-fit:cover; object-position:50% 0}
.story .txt {margin-left:30px; font-size:18px; width:calc(100% - 275px)}
.story .txt p {font-size:20px; font-weight:500; margin-bottom:10px}
.story .txt span {display:block; margin-bottom:30px; line-height:1.2}
.story .txt em {color:#999}
.story a.btn_more {position:absolute; top:0; right:0}

.right {display:inline-block; font-size:16px; position:relative; vertical-align:top; width:25%}

.schedule {position:relative; margin-bottom:20px}
.schedule #calendar {padding:20px; background:#fff; border-radius:10px}
.schedule > div {background:#fff; border-radius:10px; overflow:hidden; padding:0 10px 10px 10px; position:relative}
.schedule > div:after {content:''; background:#ffe9cf; width:100%; height:50px; position:absolute; left:0; top:0}
.schedule table {width:100%; font-size:16px; font-weight:400; z-index:1; position:relative}
.schedule th {height:50px; background:#ffe9cf}
.schedule .sun {color:#ff0000}
.schedule .sat {color:#0033ff}
.schedule td {height:40px; text-align:center; position:relative; z-index:1}
.schedule td.on a {position:relative; vertical-align:top; color:#fff; font-weight:500}
.schedule td.on:after {content:''; background:#f7a13c; width:30px; height:30px; border-radius:50%; position:absolute; left:50%; top:50%; z-index:-1; transform:translate(-50%, -50%)}
.schedule .btn_more {position:absolute; top:0; right:0; font-size:18px; font-weight:400}

.schedule .list {margin-top:10px; padding:20px 20px 10px 20px; border-top:#eee solid 1px}
.schedule .list dl {position:relative; padding-left:80px; background:url('/images/main/ico_calendar.jpg') no-repeat left}
.schedule .list dl dt {position:absolute; left:35px}

.inquiry {border:#ffe7a2 solid 3px; border-radius:10px; padding:30px; font-size:18px}
.inquiry h2 {font-size:25px; color:#555; margin-bottom:10px}
.inquiry h2 img {margin-right:10px}
.inquiry p {font-size:20px; margin-bottom:10px}
.inquiry p strong {display:inline-block; color:#f7a13c; font-size:25px; font-weight:800}
.inquiry span {display:block; margin-top:20px}

.product {position:relative}
.product h2 {text-align:center; margin-bottom:50px}
.product h2 img {margin-left:10px; display:inline-block; vertical-align:top}
.product > div {overflow:hidden; display:flex; padding:10px}
.product > button {width:42px; height:42px; font-size:0}
.product > button.prev {position:absolute; top:0; right:100px; background:url('/images/main/btn_prev.png') no-repeat}
.product > button.next {position:absolute; top:0; right:50px; background:url('/images/main/btn_next.png') no-repeat}
.product > div a {position:relative; box-sizing:border-box; border-radius:20px; box-shadow:0 0 5px 3px rgba(0,0,0,0.1); overflow:hidden}
.product > div a img {max-width:100%; height:auto; min-height:100%; max-width:100%; min-width:100%}
.product .btn_more {position:absolute; top:0; right:0}



@media all and (max-width:1400px){
	
	.container {padding:0 10px}
	
	.news {width:calc(40% - 20px); margin-right:40px}
	.news a {padding:45px 30px}
	.story {width:calc(60% - 20px); margin-right:0}
	.right {display:flex; width:100%; margin-top:50px}
	.schedule {width:calc(65% - 20px); margin-bottom:0; margin-right:40px}
	.inquiry {width:calc(35% - 20px); word-break:keep-all}
	.inquiry h2 {margin-bottom:20px}
	
}

@media all and (max-width:1200px){
	
	.section {height:auto !important}
		
	.mainVisArea {margin-top:80px}
	
	.main_banner .banners {width: calc(100% - 20px); margin:0 10px}
	.main_banner .inner_box {width:100%; padding:0 0 50px 0; box-sizing:border-box}
	.main_banner .btn_ {right:10px}
	

}


@media all and (max-width:1024px){

	.program a {width:calc(50% - 15px)}
	.program a:nth-child(n+3) {margin-top:15px}
	
	.news {width:100%; margin-right:0; margin-bottom:30px}
	.news a {padding:30px}
	.story {width:100%}
	.right {flex-wrap:wrap; margin-top:30px}
	.schedule {width:100%; margin-bottom:30px; margin-right:0}
	.inquiry {width:100%}
	
}

@media all and (max-width:840px){
	
	.product > button.prev {top:40px}
	.product > button.next {top:40px}
	.product .btn_more {top:40px}

}

@media all and (max-width:768px){
	
	.notice {min-height:300px}
	.notice > ul > li {min-width:100px}
	.notice > ul > li > a {font-size:18px; padding:10px 0}
	.notice > ul > li > div {top:38px; padding:20px}
	.notice > ul > li > div > ul > li {padding:15px 0}
	.notice > ul > li > div > ul > li > a {font-size:16px}
	.notice > ul > li > div > ul > li > span {font-size:15px; background-size:18px}
	.notice a.btn_more {font-size:16px}
	
	.d_link {flex-wrap:wrap}
	.d_link a {width:33.333%}
	.d_link a:nth-child(n+4) {margin-top:30px}
	
	.product h2 {margin-bottom:70px}
	.product > button.prev {top:60px}
	.product > button.next {top:60px}
	.product .btn_more {top:60px}
	
	.schedule .btn_more {font-size:16px}
	
	.photo > div {display:flex; flex-wrap:wrap; margin-left:-20px}
	.photo > div a {width:calc(50% - 20px)}
	.photo > div a:nth-child(4) {display:block}
	.photo > div a:nth-child(n+3) {margin-top:20px}
	.photo a.btn_more {font-size:16px}
	
	.food {padding:40px 30px 30px 30px}
	.food:before {background-size:50px}
	.food > div {font-size:18px}
	.food a.btn_more {font-size:16px; top:40px}
		
}

@media all and (max-width:640px){
	
	h2 {font-size:25px}
	
	.section2 {padding:40px 0}
	.section3 {padding:40px 0}
	
	.mainVisArea .swiper-wrapper .swiper-slide {height:auto}
	.mainVisArea .swiper-wrapper .swiper-slide .__m {display:block}
	.mainVisArea .swiper-wrapper .swiper-slide .pc {display:none}
	.mainVisArea .swiper-wrapper .swiper-slide .mobile {display:block; width:100%;}
	
	.d_link {padding:40px 0}
	.d_link a p {font-size:14px; margin-top:15px}
	
	.news {font-size:16px}
	.news a {padding:20px}
	.news a label {width:95px; height:95px; font-size:16px}
	.news a label strong {font-size:30px}
	.news a p {font-size:20px}
	
	.story {font-size:14px}
	.story .txt {font-size:16px; margin-left:0; margin-top:20px}
	.story .txt span {margin-bottom:20px}
	.story .txt p {font-size:18px}
	.story > div a {flex-wrap:wrap; position:relative; padding-bottom:20px; border-bottom:1px dotted #dbdbdb}
	.story > div a:last-child {border-bottom:none}
	
	.inquiry {font-size:16px}
	.inquiry h2 {font-size:23px}
	.inquiry h2 img {transform:scale(0.8); margin-top:-5px}
	.inquiry p {font-size:18px}
	.inquiry p strong {font-size:23px}
	
	.schedule  {margin-bottom:40px}
	
	.program a p {font-size:22px}
	
	.product > button {transform:scale(0.9)}
	.product > button.prev {right:90px}
	.product > button.next {right:45px}
	.product .btn_more {transform:scale(0.9)}
	
}

@media all and (max-width:520px){
	
	.notice {min-height:350px}
	.notice > ul > li {width:50%; margin-bottom:1px}
	.notice > ul > li > a {border-radius:5px}
	.notice > ul > li:nth-child(3) > a {background:#b3c234}
	.notice > ul > li:nth-child(4) > a {background:#f1c75b}
	.notice > ul > li.active:nth-child(3) > a {background:#fff}
	.notice > ul > li.active:nth-child(4) > a {background:#fff}
	.notice > ul > li > div {top:78px; padding-bottom:35px}
	.notice a.btn_more {top:auto; bottom:10px; right:auto; left:50%; transform:translateX(-50%)}
	
}

@media all and (max-width:480px){
	
	.photo > div {margin-left:0}
	.photo > div a {width:100%; margin-left:0}
	.photo > div a:nth-child(2) {margin-top:20px}
	
	.program a {width:100%}
	.program a:nth-child(n+2) {margin-top:15px}
	
}

@media all and (max-width:467px){

	.product h2 {margin-bottom:60px} 
	.product h2 img {margin-top:10px}
	.product > button.prev {top:80px}
	.product > button.next {top:80px}
	.product .btn_more {top:80px}

}

@media all and (max-width:400px){
	
	.inquiry {padding:25px}
	
	.d_link a {width:50%}
	.d_link a:nth-child(n+3) {margin-top:30px}
	
}

/*툴팁 아작스 */
.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; }