@charset "utf-8";

.main section {padding: 100px 0;}
#main-visual { background: url(../../img/00_main/bg_main.jpg) center center no-repeat; background-size: cover; padding: 70px 0; }
#main-visual .flex > div { width: 50%; }
#main-visual .main-copy {font-size: 70px; line-height: 1.1;}
#main-visual .main-copy b {position: relative; z-index: 1;}
/* #main-visual .main-copy span {padding: 3px 40px; border-radius: 50px; margin-left: -40px;} */
#main-visual .main-copy p {line-height: 1.5;}
.main-slide a { color: #777; }
.main-slide .img {border-radius: 5px; overflow: hidden;}
.img img {width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 1/1; object-position: top center;}
.main-slide .img .inner-category {position: absolute; left: 30px; bottom: 20px;}
.main-slide .img .inner-category span {color: #80736a; background: #e3ded3; width: 90px; height: 30px; line-height: 30px; border-radius: 15px; font-size: 18px; box-shadow: 3px 3px 10px rgba(35,35,35,.35); font-weight: 600; text-align: center;}
.main-slide .img .inner-category a:nth-child(2) span {color: #222; background: #ffcc00;}
.main-slide .txt {padding: 20px 15px; /*border-radius: 0 0 25px 25px;*/}
.main-slide ul {position: relative; z-index: 2;}
.slick-list {box-shadow: 5px 5px 15px rgba(0,0,0,.5); border-radius: 5px;}
.main-slide .slide-nav .slick-arrow {position: absolute; top: 50%; transform: translateY(-50%); z-index: 1;}
.main-slide .slide-nav .slick-arrow i {font-size: 100px; color: #fff;}
.main-slide .slide-nav .prev-btn {left: -80px;}
.main-slide .slide-nav .next-btn {right: -80px;}
.main-slide .slide-nav button {width: auto; height: auto; background: none; box-shadow: none;}
.main-slide .slick-dotted {text-align: center;}
.main-slide .slick-dots {display: inline-block; border-radius: 3.5px; height: 7px; overflow: hidden; margin-top: 10px;}
.main-slide .slick-dots > li {display: inline-block; background: rgba(79,63,0,0.23); text-indent: -9999px; width: 55px;}
.main-slide .slick-dots > li.slick-active {background: #fff; border-radius: 3.5px; height: 7px;}

/* 교체 메인 */
#main-visual.main-visual {position: relative; width: 100%; padding: 80px 0 0 0; background: transparent;}
#main-visual.main-visual::before {background: url(../../img/00_main/main_bg11.jpg) center center no-repeat; background-size: cover; width: 100%; height: 400px; left: 0; top: 0; position: absolute; content: "";}
#main-visual.main-visual .main-copy {left: 100px; top: 50%; transform: translateY(-50%); z-index: 2; width: 40%;}
#main-visual.main-visual .overay {background: linear-gradient(to right, rgba(0, 0, 0, 0.75) 5%, rgba(0, 0, 0, 0) 50%); width: 100%; height: 100%; z-index: 1; position: absolute; left: 0; top: 0;}
#main-visual.main-visual img {width: 100%; height: 100%; display: block; aspect-ratio: 1200 / 500; object-fit: cover;}
#main-visual.main-visual .slick-list {box-shadow: 5px 5px 15px rgba(0,0,0,.5); border-radius: 5px;}

/* 슬라이더 셋팅 */
#main-visual.main-visual .slick-arrow {position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; text-indent: -9999px; background-size: cover; width: 50px; height: 50px;}
#main-visual.main-visual .slick-prev {left: 20px; background: url(/img/layout/arrow-left-white.svg) left center no-repeat;}
#main-visual.main-visual .slick-next {right: 20px; background: url(/img/layout/arrow-right-white.svg) right center no-repeat;}
#main-visual.main-visual .slick-dots {bottom: 20px; position: absolute; left: 50%; transform: translateX(-50%); z-index: 1;}
#main-visual.main-visual .slick-dots li {display: inline-block; margin: 0 10px;}
#main-visual.main-visual .slick-dots li button {width: 10px; height: 10px; background-color: rgba(255, 255, 255, .5); display: block; border-radius: 5px; text-indent: -9999px;}
#main-visual.main-visual .slick-dots li.slick-active button{background-color: rgba(255, 255, 255, 1);}

@media (max-width: 767px) {
    #main-visual { background: url(../../img/00_main/main_bg.jpg) right center no-repeat; background-size: cover; }
    #main-visual .main-copy { font-size: 48px; }
    /* #main-visual .main-copy span { padding: 3px 20px; margin-left: -20px; } */
    #main-visual .flex {flex-wrap: wrap; gap: 30px;}
    #main-visual .flex > div { width: 100%; }
    .main-slide .slide-nav {display: none;}

    #main-visual.main-visual .container {padding: 0;}
	#main-visual.main-visual ul.main-slider li.slick-slide {border-radius: 0;}
	#main-visual.main-visual .main-copy {left: 20px; top: auto; transform: translateY(0); bottom: 50px; z-index: 2; width: calc(100% - 40px);}
	#main-visual.main-visual .overay {background: linear-gradient(to top, rgba(0, 0, 0, 0.75) 5%, rgba(0, 0, 0, 0) 70%); width: 100%; height: 100%; z-index: 1; position: absolute; left: 0; top: 0;}
	#main-visual.main-visual img {width: 100%; height: 100%; display: block; aspect-ratio: 1 / 1.25; object-fit: cover;}

	#main-visual.main-visual .slick-arrow {position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; text-indent: -9999px; background-size: cover; width: 50px; height: 50px; display: none !important;}
	#main-visual.main-visual .slick-prev {left: 20px; background: url(/img/layout/arrow-left-white.svg) left center no-repeat;}
	#main-visual.main-visual .slick-next {right: 20px; background: url(/img/layout/arrow-right-white.svg) right center no-repeat;}
	#main-visual.main-visual .slick-dots {bottom: 20px; position: absolute; left: 50%; transform: translateX(-50%); z-index: 1;}
	#main-visual.main-visual .slick-dots li {display: inline-block; margin: 0 10px;}
	#main-visual.main-visual .slick-dots li button {width: 10px; height: 10px; background-color: rgba(255, 255, 255, .5); display: block; border-radius: 5px; text-indent: -9999px;}
	#main-visual.main-visual .slick-dots li.slick-active button {background-color: rgba(255, 255, 255, 1);}

	.main section {
		padding: 50px 0;
	}
}
@media (max-width: 1024px){
	#main-visual.main-visual .main-copy {width:80%}
	.main-copy h3{font-size:29px;}
}
#main-event .img img {border-radius: 5px;box-shadow: 7px 7px 20px 0px rgb(72 37 10 / 25%);}
#main-event .img .point {position: absolute; font-size: 14px; color: #fff; font-weight: 600; background: #957a4f; width: 60px; height: 60px; border-radius: 0 5px; right: 0; top: 0; display: flex; justify-content: center; align-items: center;}
#main-event .img .inner-category {position: absolute; width: 90px; height: 30px; line-height: 30px; border-radius: 15px; font-size: 14px; left: 15px; bottom: 15px; font-weight: 600;  color: #80736a; background: #e3ded3; text-align: center;}
#main-event .txt {padding-top: 27px;}
#main-event .txt ul li {font-size: 18px;}
#main-event .txt ul li b {color: #222;}

#main-column .img img {border-radius: 5px;}
#main-column .txt .inner-category {color: #80736a; background: #e3ded3; width: 90px; height: 30px; line-height: 30px; border-radius: 15px; font-size: 18px; font-weight: 600; text-align: center;}
#main-column .txt .date {color: #e3ded3;}

#main-board ul li .img img {border-radius: 5px;box-shadow: 7px 7px 20px 0px rgb(72 37 10 / 25%);}
#main-board .board-normal ul li a {font-size: 18px; line-height: 2;}
#main-board .main-button {position: absolute; right: 0; top: 0;}

#main-banner { background-color: #4149b8; margin-bottom: -150px; }
#main-banner .txt { font-size: 35px; }
#main-banner .txt span { font-size: 44px; }
#main-banner .img img { aspect-ratio: auto; }

.main-button a {padding: 7px 30px 5px 30px; border-radius: 30px; display: inline-flex; font-size: 18px; align-items: center; gap: 5px;}
.main-button.yellow-button a {background-color: #ffcc00; color: #fff;}
.main-button.blue-button a {background-color: #4149b8; color: #fff;}
.main-button.black-button a {background-color: #000; color: #fff;}

#main-qna .img img {aspect-ratio: auto; object-fit: cover;}

#main-notice {background-color: #234637; margin-bottom: -150px;}
#main-notice ul li {border-radius: 5px; border: 1px solid #fff; padding: 30px; background-color: #324f43;}

@media (max-width: 767px) {
    #main-banner .txt { font-size: 26px; }
    #main-banner .txt span { font-size: 32px; }
	
	#main-qna .grid-2 .grid-2 {grid-template-columns: 1fr 1fr;}

	#main-notice {margin-bottom: -100px;}
}

/* 메인 문화예술 칼럼 */
.main_culture .img {width:250px; height:250px;}
.main_culture .img img {width:250px; height:250px;}
.main_culture .txt h4 {overflow: hidden; text-overflow: ellipsis; word-break: break-all;}
.main_culture .txt p {overflow: hidden; text-overflow: ellipsis; word-break: break-all;}
@media (max-width: 1150px) {
    .main_culture .img {width:100%; height:100%;}
	.main_culture .img img {width:100%; height:100%;}
	.main_culture_board li a {flex-direction: column;}
}

