/*
서귀포시 2017 메인
*/

body { background:url(../images/main/bg1.jpg) no-repeat center top ,url(../images/main/bg2.jpg) center bottom;  }


@media (min-width: 1272px) {
  .main {
    z-index: 1;
    word-break: keep-all;
  }
  .main a {color: #222;}

	.main-section {}
	.main-section01 {padding-top:68px;  padding-bottom:78px;    }
	.main-section01 .part01 { margin-bottom:45px;  }
	.main-section01 .part01 .top { position:relative; margin-bottom:30px;  }
	.main-section01 .part01 .perform_select_wrap { position:absolute; top:10px; right:0;}
	.main-section01 .part01 .perform_select_wrap label{ float:left; line-height: 40px; height:40px; font-size: 16px; color:#6a7578; padding-left: 40px;}
	.main-section01 .part01 .perform_select_wrap select{ float:left; width:180px;height: 40px;}
	.main-section01 .part01 .perform_select_wrap .select_icon {float:left; margin-left:20px;}
	.main-section01 .part01 .perform_select_wrap .select_icon:after {top:12px;}
	.main-section01 .part01 h3 { font-size:40px; color:#313536; font-weight:normal;  margin-bottom:5px;  }
	.main-section01 .part01 .info-text  {font-size:16px; color:#6a7578; }
	.main-section01 .part01 .info-text strong { font-weight:bold; font-size: #313536; }
	.main-section01 .part01 .bottom { width:100%; }
	.main-section01 .part01 .perform_slide_wrap { width:calc(100% - 90px);  float:left; }
	.main-section01 .part01 .perform_slide_wrap  a{padding:0 0 20px 20px; display: block; text-decoration: none;}
	.main-section01 .part01 .perform_slide_wrap .perform_img_wrap{overflow: hidden; overflow: hidden;-webkit-box-shadow:-10px 10px 10px 0px rgba(0,0,0,0.2); -moz-box-shadow:-10px 10px 10px 0px rgba(0, 0, 0, 0.2); box-shadow: -10px 10px 10px 0px rgba(0,0,0,0.2)}
	.main-section01 .part01 .perform_slide_wrap .perform_img{height: 480px; background-position: center center; background-size:cover;transition: all .2s ease-in-out;}
	.main-section01 .part01 .perform_slide_wrap .perform_img:hover{ transform: scale(1.1); }
	.main-section01 .part01 .perform_slide_wrap .title { font-size: 22px; color:#313536; margin-top: 30px;height: 50px;}
	.main-section01 .part01 .perform_slide_wrap .date { font-size: 16px; color:#626b6e; font-weight: bold; padding-top: 18px;}
	.main-section01 .part01 .perform_slide_wrap .tag { font-size: 16px;color:#626b6e;padding-top: 20px;margin-top: 20px;border-top:4px solid #6a7578; }
	.main-section01 .part01 .perform_slide_btn { width:90px; float:left; padding-top: 200px; text-align: right}
	.main-section01 .part01 .perform_slide_btn .page{ font-size: 24px; font-weight: 300; color:#313536; letter-spacing: 1px; padding:70px 0;text-align: right;}
	.main-section01 .part01 .slick-slide {padding:40px 0 0 ;-webkit-transition:margin 0.4s,  -webkit-transform 0.4s; transition:margin 0.4s,transform 0.4s;}
	.main-section01 .part01 .slick-center {margin-top:-40px;}

	.main-section01 .part02 { position:relative; padding-bottom:130px;   margin:0 auto;}
	.main-section01 .part02 .schedule { float:left; width:360px;border:4px solid #6a7578;  text-align:center; padding:20px 20px 15px; position:relative;  }
	.main-section01 .part02 .schedule .date { font-size:30px; color:#313536; line-height: 1;}
	.main-section01 .part02 .schedule .month { font-size:16px; color:#6a7578; letter-spacing:2px; margin-bottom:10px;   }
	.main-section01 .part02 .schedule .more { text-align: center;padding-bottom: 10px;}
	.main-section01 .part02 .schedule .more a{ background: #f0f1f1;color:#6a7578; font-size: 16px; display: inline-block; padding:2px 20px; border-radius: 10px;}
	.main-section01 .part02 .schedule .schedule-btn a { position:absolute; top:22px;}
	.main-section01 .part02 .schedule .schedule-btn a.prev-btn { left:20px; }
	.main-section01 .part02 .schedule .schedule-btn a.next-btn { right:20px; }
	.main-section01 .part02 .schedule table  {width:100%; border-top: 2px solid #6a7578; text-align: center;}
	.main-section01 .part02 .schedule table thead th {border-bottom:1px solid #6a7578; text-align: center; color:#6a7578;font-size: 14px;height: 25px;}
	.main-section01 .part02 .schedule table tbody td {position:relative;; font-size: 14px; color:#6a7578;padding: 4px 0; text-align: center;}
	.main-section01 .part02 .schedule table tbody td a{ font-size: 14px; color:#6a7578; display: inline-block; width: 22px;height: 22px; line-height: 22px; vertical-align: middle; line-height: 1.4;}
	.main-section01 .part02 .schedule table tbody td a:hover{text-decoration: none; font-weight: bold;}
	.main-section01 .part02 .schedule table tbody td.today a{ border:1px solid #899da2; border-radius: 50%;}
	.main-section01 .part02 .schedule table tbody td.active a{ border:1px solid #6a7578; border-radius:50%; background: #6a7578; color:#fff;;}
	.main-section01 .part02 .schedule table tbody td.event:after{ content:' 선택가능일'; text-indent:-99999px;  width: 4px;height: 4px; border-radius:50%; background: #6A7578;position:absolute;bottom:0px; left:50%; margin-left:-2px;;}
	.main-section01 .part02 .schedule table tbody tr:first-child td{ padding-top: 10px; }

	.main-section01 .part02 .schedule_list { float:right; width:calc(100% - 390px) ; height: 280px;}
	.main-section01 .part02 .schedule_list .schedul_item { float:left; width:220px; height:280px; margin-left:10px;  }
	.main-section01 .part02 .schedule_list .schedul_item:firsts-child { margin-left:0px;  }
	.main-section01 .part02 .schedule_list .schedul_item { display:block; width:100%; height:280px; background:#ecf3f5; padding:40px 30px;   }
	.main-section01 .part02 .schedule_list .schedul_item a .title {font-size:18px; color:#313536; height:75px; margin-bottom:10px; }
	.main-section01 .part02 .schedule_list .schedul_item a .date {font-size:14px; color:#626b6e;margin-bottom:5px;  }
	.main-section01 .part02 .schedule_list .schedul_item a .place {font-size:14px; color:#626b6e; margin-bottom:5px; }
	.main-section01 .part02 .schedule_list .schedul_item a .kind { font-size:16px;  }
	.main-section01 .part02 .schedule_list .no_event{ text-align: center; color:#828B8D; font-size: 16px; padding-top: 70px;}
	.main-section01 .part02 .schedule_list .no_event img{ margin:0 auto; padding-bottom: 20px; }
	.main-section01 .part02 .schedule_list .slick-track { float:left;}

	.main-section01 .part02 .schedule_list_wrap .rolling-btn { position:absolute; top:300px; right:50%;margin-right:-290px; text-align:center;  }
	.main-section01 .part02 .schedule_list_wrap .rolling-btn * { vertical-align:middle;  }
	.main-section01 .part02 .schedule_list_wrap .rolling-btn span { display:inline-block; margin:0 5px; }
	.main-section01 .part02 .schedule_list_wrap .rolling-btn span.pager { font-size:18px; color:#313536;  }

	.main-section01 .part03 {  }
	.main-section01 .part03 ul li { float:left; width:20%; text-align:center;  }
	.main-section01 .part03 ul li img { margin:0 auto 10px; display:block;  }
	.main-section01 .part03 ul li a { font-size:22px; color:#313536;  }

	.main-section02 { background:#f0f5f7; height:420px; padding-top:55px;  }
	.main-section02  .container {position:relative; }
	.main-section02 h3 {font-size:40px; color:#313536; font-weight:normal;  margin-bottom:5px;  }
	.main-section02  .info-text  {font-size:16px; color:#6a7578;  }
	.main-section02 .select { position:absolute; top:0px; right:0px;  }
	.main-section02 .select label { float:left; margin-right:20px; line-height: 40px;font-size:16px; color:#6a7578; }
	.main-section02 .select select { float:left; width:180px; height:40px;  }
	.main-section02 ul {    margin:40px -20px 0 -20px;  }
	.main-section02 ul li {width:50%; padding-left:20px; padding-right:20px;  float:left; padding-bottom:20px;   }
	.main-section02 ul li span { float:left;  }
	.main-section02 ul li a  { float:left;  width:85%; font-size:16px;  }
	.main-section02 ul li a span.kind { width:30%;  }
	.main-section02 ul li a span.title { width:70%; color:#313536;   padding-right: 10px;}
	.main-section02 ul li span.date  { float:right;  width:15%; letter-spacing:0px; }

	.main-section03 {  padding-top:80px;height:640px;   }
	.main-section03 .site-info-wrap { margin-left:-22px; margin-right:-22px;  }
	.main-section03 .site-info { float:left;  width:25%; padding:0 22px;  margin-bottom:60px;  height:120px;  }
	.main-section03 .site-info.full { width:50%;  }
	.main-section03 .site-info .name { font-size:22px; color:#6a7578; margin-bottom:15px;  }
	.main-section03 .site-info .address { font-size:16px; color:#6a7578;   }
	.main-section03 .site-info .tel { font-size:16px; color:#6a7578; margin-bottom:15px;   }
	.main-section03 .site-info .link a { font-size:16px; color:#6a7578;  margin-left:15px;   }
	.main-section03 .site-info .link a img { margin-left:5px;  }
	.main-section03 .site-info .link a:first-child {margin-left:0px; }

}

/* md */
@media (min-width: 1272px) and (max-width: 1469px) {
	.main-section01 .part01 .perform_slide_wrap .perform_img{height: 370px; background-position: center center; background-size:cover;transition: all .2s ease-in-out;}

	.main-section02 ul li a span.kind { width:40%;  }
	.main-section02 ul li a span.title { width:60%; }
	.main-section03 {height: auto;}
	.main-section03 .site-info {height: auto;}
	.main-section03 .site-info .address { height: 40px; margin-bottom: 5px;}
	.main-section03 .site-info .link a { width: 100%; display: block; margin-left:0;}
}
/* xs + sm */
@media (max-width: 1271px) {
	.main {
	  z-index: 1;
	  word-break: keep-all;
	}
	.main a {color: #222;}
	  .main-section {}
	  .main-section01 {padding-top:1.31428571rem;  padding-bottom:1.71428571rem;   background:#fff; }
	  .main-section01 .container{padding: 0 30px;}
	  .main-section01 .part01 .top { position:relative; margin-bottom:30px;  }
	  .main-section01 .part01 .perform_select_wrap { clear:left; padding-top: 0.85714286rem;}
	  .main-section01 .part01 .perform_select_wrap label{ float:left; line-height: 40px; height:40px; font-size: 16px; color:#6a7578;width:15%;text-align: center;}
	  .main-section01 .part01 .perform_select_wrap select{ float:left;height: 40px;}
	  .main-section01 .part01 .perform_select_wrap .select_icon {float:left; width:35%;}
	  .main-section01 .part01 .perform_select_wrap .select_icon:after {top:12px;}
	  .main-section01 .part01 h3 { font-size:0.9rem; color:#313536; font-weight:normal;  margin-bottom:5px;  float:left;}
	  .main-section01 .part01 .info-text  {font-size:0.57142857rem; color:#6a7578; float:right;line-height: 1.3rem; vertical-align: bottom;}
	  .main-section01 .part01 .info-text strong { font-weight:bold; font-size: #313536; }
	  .main-section01 .part01 .bottom { width:100%; }
	  .main-section01 .part01 .perform_slide_wrap { width:100%; }
	  .main-section01 .part01 .perform_slide_wrap  a{padding:0 0 10px 10px; display: block; text-decoration: none;}

	  .main-section01 .part01 .perform_slide_wrap .perform_img_wrap{overflow: hidden; overflow: hidden;-webkit-box-shadow:-10px 10px 10px 0px rgba(0,0,0,0.2); -moz-box-shadow:-10px 10px 10px 0px rgba(0, 0, 0, 0.2); box-shadow: -10px 10px 10px 0px rgba(0,0,0,0.2)}
  	  .main-section01 .part01 .perform_slide_wrap .perform_img{height: 300px; background-position: center center; background-size:cover;transition: all .2s ease-in-out;}
  	  .main-section01 .part01 .perform_slide_wrap .perform_img:hover{ transform: scale(1.1); }

	  .main-section01 .part01 .perform_slide_wrap .title { font-size: 0.62857143rem; color:#313536; margin-top: 0.57142857rem; height: 1.67142857rem; overflow: hidden;}
	  .main-section01 .part01 .perform_slide_wrap .date { font-size: 0.57142857rem; color:#626b6e; font-weight: bold; margin-top: 5px; height: 1.48571429rem; overflow: hidden;}
	  .main-section01 .part01 .perform_slide_wrap .tag { font-size: 0.57142857rem;color:#626b6e;padding-top: 0.57142857rem;margin-top: 0.57142857rem;border-top:4px solid #6a7578; }
	  .main-section01 .part01 .perform_slide_btn { width:100%; padding-top: 1rem; text-align: center}
	  .main-section01 .part01 .perform_slide_btn > div{ display:inline-block;}
	  .main-section01 .part01 .perform_slide_btn .page{ font-size: 0.85714286rem; font-weight: 300; color:#313536; letter-spacing: 1px;text-align: right; padding:0 20px;}

	  .main-section01 .part02 { position:relative; padding-bottom:2.57142857rem;margin-top: 2rem;  }
	  .main-section01 .part02 .schedule { width: calc(100% - 40px); height:24rem; border:4px solid #6a7578;  text-align:center; padding-top:1.42857143rem; margin:0 auto; position:relative;  }
	  .main-section01 .part02 .schedule .date { font-size:1rem; color:#313536; }
	  .main-section01 .part02 .schedule .month { font-size:0.57142857rem; color:#6a7578; letter-spacing:2px; margin-bottom:0.71428571rem;   }
	  .main-section01 .part02 .schedule .schedule-btn a { position:absolute; top:1.6rem;}
	  .main-section01 .part02 .schedule .schedule-btn a.prev-btn { left:20px; }
	  .main-section01 .part02 .schedule .schedule-btn a.next-btn { right:20px; }
  	.main-section01 .part02 .schedule .more { text-align: center;padding-bottom: 10px;}
  	.main-section01 .part02 .schedule .more a{ background: #f0f1f1;color:#6a7578; font-size: 16px; display: inline-block; padding:2px 20px; border-radius: 10px;}
  	.main-section01 .part02 .schedule .calendar  {padding:0 20px;}
  	.main-section01 .part02 .schedule table  {width:100%; border-top: 2px solid #6a7578; border-bottom:1px solid #6a7578; text-align: center;}
  	.main-section01 .part02 .schedule table thead th {border-bottom:1px solid #6a7578; text-align: center; color:#6a7578;font-size: 14px;height: 25px;}
  	.main-section01 .part02 .schedule table tbody td {position:relative;; font-size: 14px; color:#6a7578;padding: 4px 0; text-align: center;}
  	.main-section01 .part02 .schedule table tbody td a{ font-size: 14px; color:#6a7578; display: inline-block; width: 22px;height: 22px; line-height: 22px; vertical-align: middle; line-height: 1.4;}
  	.main-section01 .part02 .schedule table tbody td a:hover{text-decoration: none; font-weight: bold;}
  	.main-section01 .part02 .schedule table tbody td.today a{ border:1px solid #899da2; border-radius: 50%;}
  	.main-section01 .part02 .schedule table tbody td.active a{ border:1px solid #6a7578; border-radius:50%; background: #6a7578; color:#fff;;}
  	.main-section01 .part02 .schedule table tbody td.event:after{ content:' 선택가능일'; text-indent:-99999px; width: 4px;height: 4px; border-radius:50%; background: #6A7578;position:absolute;bottom:0px; left:50%; margin-left:-2px;;}
  	.main-section01 .part02 .schedule table tbody tr:first-child td{ padding-top: 10px; }



	  .main-section01 .part02 .schedule_list_wrap {position:absolute; top:13.5rem; left:0; width:100%;}
	  .main-section01 .part02 .schedule_list {width: 100%; }
	  .main-section01 .part02 .schedule_list .schedul_item { float:left; width:8.28571429rem; height:8rem; margin-left:10px;  }
	  .main-section01 .part02 .schedule_list .slick-list { margin-left:-10px;  }
	  .main-section01 .part02 .schedule_list .schedul_item  { display:block; width:100%; height:8rem; background:#ecf3f5; padding:25px 20px;   }
	  .main-section01 .part02 .schedule_list .schedul_item a .title {font-size:0.62857143rem; color:#313536; height:2.57142857rem; margin-bottom:10px; }
	  .main-section01 .part02 .schedule_list .schedul_item a .date {font-size: 0.57142857rem; color:#626b6e;margin-bottom:5px;  }
	  .main-section01 .part02 .schedule_list .schedul_item a .place {font-size: 0.57142857rem; color:#626b6e; margin-bottom:5px; }
	  .main-section01 .part02 .schedule_list .schedul_item a .kind { font-size: 0.57142857rem;  }
	  .main-section01 .part02 .schedule_list .no_event{ text-align: center; color:#828B8D; font-size: 16px; padding-top: 45px;}
	  .main-section01 .part02 .schedule_list .no_event img{ margin:0 auto; padding-bottom: 20px; }
	  .main-section01 .part02 .schedule_list_wrap .rolling-btn { position:absolute; bottom:-1.57142857rem; left:0px; width:100%; text-align:center;  }
	  .main-section01 .part02 .schedule_list_wrap .rolling-btn * { vertical-align:middle;  }
	  .main-section01 .part02 .schedule_list_wrap .rolling-btn span { display:inline-block; margin:0 5px; }
	  .main-section01 .part02 .schedule_list_wrap .rolling-btn span.pager { font-size:18px; color:#313536;  }

	  .main-section01 .part03 {  }
	  .main-section01 .part03 ul { text-align: center; }
	  .main-section01 .part03 ul li { display: inline-block; width:32%; padding-bottom: 0.85714286rem;}
	  .main-section01 .part03 ul li img { margin:0 auto 10px; display:block;  }
	  .main-section01 .part03 ul li a { font-size:0.71428571rem; color:#313536;  }

	  .main-section02 { background:#f0f5f7; padding-top:1rem;  }
	  .main-section02  .container {position:relative; padding:0 30px;}

	  .main-section02 h3 {font-size:0.9rem; color:#313536; font-weight:normal;  margin-bottom:5px;  float:left;}
	  .main-section02  .info-text  {font-size:0.57142857rem; color:#6a7578;  float:right;line-height: 1.3rem; vertical-align: bottom;}
	  .main-section02 .select { display:none; }
	  .main-section02 ul {    margin-top:2.28571429rem;  }
	  .main-section02 ul li {width:100%;  float:left; padding-bottom:20px;   }
	  .main-section02 ul li span { float:left;  }
	  .main-section02 ul li a  { float:left;  width:85%; font-size:0.57142857rem;  }
	  .main-section02 ul li a span.kind { width:30%;  }
	  .main-section02 ul li a span.title { width:70%; color:#313536;   padding-right: 10px;}
	  .main-section02 ul li span.date  { float:right;  width:15%; letter-spacing:0px; font-size:0.57142857rem;}

	  .main-section03 {  padding-top:2.14285714rem;}
	  .main-section03 .container{ padding:0 30px;}
	  .main-section03 .site-info-wrap { margin-left:-10px; margin-right:-10px;  }
	  .main-section03 .site-info { float:left;  width:50%; padding:0 10px;  margin-bottom:1.71428571rem;  }
	  .main-section03 .site-info:nth-child(odd) { clear:left;}
	  .main-section03 .site-info.full { width:100%; }
	  .main-section03 .site-info .name { font-size:0.62857143rem; color:#6a7578; margin-bottom:0.42857143rem;;  }
	  .main-section03 .site-info .address { font-size:0.51428571rem; color:#6a7578;   }
	  .main-section03 .site-info .tel { font-size:0.51428571rem; color:#6a7578; margin-bottom:0.42857143rem;;   }
	  .main-section03 .site-info .link a { font-size:0.51428571rem; color:#6a7578;  margin-left:15px;   }
	  .main-section03 .site-info .link a img { margin-left:5px;  }
	  .main-section03 .site-info .link a:first-child {margin-left:0px; }
}

@media (max-width: 600px) {
	.main-section02 ul li a  { width:80%;}
	.main-section02 ul li a span.kind { width:30%;  }
	.main-section02 ul li a span.title { width:70%; color:#313536;   }
	.main-section02 ul li span.date  { float:right;  width:20%; text-align: right;letter-spacing:0px; font-size:0.57142857rem;}
}

@media (max-width: 550px) {
	.main-section01 .part01 .perform_select_wrap label{ width:20%; clear:left;}
	.main-section01 .part01 .perform_select_wrap .select_icon { width:80%;}

	.main-section03 .site-info .link a { clear:left; display: block;margin-left: 0;}

}
@media (max-width: 400px) {
	.main-section02 ul li a  { width:75%;}
	.main-section02 ul li a span.kind { width:40%;  }
	.main-section02 ul li a span.title { width:60%; color:#313536;   }
	.main-section02 ul li span.date  { float:right;  width:25%; text-align: right;letter-spacing:0px; font-size:0.57142857rem;}
}

@media(max-width:480px){
	.main-section01 .part02 .schedule { height:25rem; }
	.main-section01 .part02 .schedule_list_wrap { top:14.5rem; }

}
@media(max-width:360px){
	.main-section01 .part02 .schedule { height:26rem; }
	.main-section01 .part02 .schedule_list_wrap { top:15.5rem; }

}

@media(max-width:767px){
	.main-section01 .part01 .perform_slide_wrap .perform_img{padding-top:140%; height: auto;;}
	.main-section01 .part02 .schedule_list .no_event{  padding-top: 40px;}
	.main-section01 .part02 .schedule_list .no_event img{ width:60px; }

}