.swiper_arrow > div { opacity: 0.5; } 
.swiper_arrow > div:hover { opacity: 1; } 
.swiper_arrow > div:after { display : none } 
.swiper_arrow .swiper-button-prev { left : 0 } 
.swiper_arrow .swiper-button-next { left: inherit; right: 0; } 
.swiper_arrow2 img { filter: brightness(0) saturate(100%) } 

#section01 { display : flex; max-width : 1740px; margin : 50px auto; border-radius : 10px; overflow : hidden; padding : 0 15px } 
#section01 .main_slide_left { display : flex; flex-direction : column; justify-content :space-between; width : 100%; max-width : 720px; background : #000F41 url('../img/main/bg_slide.png') no-repeat center center / cover; color : #fff; padding : 50px } 
#section01 .main_slide_left h2 { font-family: "Cormorant Garamond", serif; font-size : 65px; font-style: italic; letter-spacing : -1.3px; font-weight: 700; } 
#section01 .main_slide_left p { font-size : 32px; margin-top : 30px; font-weight: bold; } 
#section01 .swiper_ctrl_wrap { position : relative } 
#section01 .swiper-pagination { width : auto } 
#section01 .swiper-pagination,
#section01 .swiper-pagination span { font-family: "Cormorant Garamond", serif; font-size : 70px; color : rgba(255, 255, 255, 0.5) } 
#section01 .swiper-pagination span { display : inline-block } 
#section01 .swiper-pagination span:first-child { color : #fff } 
#section01 .swiper_arrow { position : absolute; bottom : 50px; right : 50px; width : 100px } 
#section01 .main_slide_right { width : 100%; max-width : 1020px; flex-basis: 0; flex-grow : 1 } 
.mainSlider { width: 100%; height: 720px } 
.mainSlider .swiper-slide .txt { position : relative; display: flex; justify-content: space-between; font-weight: bold; color: #fff; height : 100%; align-items: end; padding : 70px 50px; z-index : 10 } 
.mainSlider .swiper-slide-active .txt { opacity : 0; transform: translateY(30px); animation: fadeUp 0.8s ease forwards; } 
.mainSlider .swiper-slide p { position : relative; z-index : 1; font-size : 28px; padding-right : 20px; line-height : 120% } 
.mainSlider .swiper-slide a { position : relative; z-index : 1; border : 1px solid #fff; border-radius : 5px; font-size : 16px; padding : 17px; white-space: nowrap; color : #fff } 
.mainSlider .swiper-slide:after { content : url('../img/main/bg_slide_effect.png'); position : absolute; bottom : -20px; left : 0; width : 100% } 
.mainSlider .swiper-slide img { display : block; position : absolute; top : 50%; left : 50%; transform : translate(-50%, -50%); } 


#section02 { margin : 100px 0 } 
#section02 .section02_slide_ctrl { position : absolute; top : 0; right : 0; width : calc(100% - 500px) } 
#section02 .section02_slide_ctrl h2 { font-family: "Cormorant Garamond", serif; font-size : 60px; font-style: italic; } 
#section02 .swiper { padding-right : 150px } 
#section02 .sub_inner .swiper_arrow { position : relative; width : 70px; top: -30px; } 
#section02 .sub_inner { position : absolute; bottom : -50px; right : 20px; width : 200px; display: flex; flex-direction: row-reverse; align-items: center; } 
#section02 .sub_inner .swiper-pagination span { font-family: "Cormorant Garamond", serif; font-size : 36px; font-style: italic; opacity: 0.5; } 
#section02 .sub_inner .swiper-pagination span:first-child { opacity: 1; } 
#section02 .sub_inner img { width : 35px } 
#section02 .swiper-wrapper { height : 470px; align-items: end; } 
#section02 .swiper-wrapper.active { margin-left : 50px } 
#section02 .swiper-slide { text-align: center; font-size: 18px; background: #fff; display: flex; align-items: end; height : 300px; transition : height .5s ease-in-out; border-radius : 10px; overflow : hidden; padding : 30px 40px } 
#section02 .swiper-slide .innerTxt { position : relative; z-index : 2; opacity : 0; color : #fff } 
#section02 .swiper-slide .innerTxt h2 { font-family: "Cormorant Garamond", serif; font-style: italic; font-size : 36px; text-align: left; } 
#section02 .swiper-slide .innerTxt span { display : inline-block; border-radius : 50px; padding : 5px 15px; font-size : 16px; border : 1px solid #fff } 
#section02 .swiper-slide .innerTxt span + span { margin-left : 10px } 
#section02 .swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; } 
#section02 .swiper-slide .innerTxt h2 img { display : inline-block; width : auto; -webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1); } 
#section02 .swiper-slide-active { width : 460px !important; height : 460px } 
#section02 .swiper-slide-active:after,
#section02 .swiper-slide:hover:after { content : url('../img/main/bg_slide_effect.png'); position : absolute; bottom : -20px; left : 0; width : 100% } 
#section02 .swiper-slide-active .innerTxt { opacity: 1; } 
#section02 .swiper-slide:not(.swiper-slide-active):hover .innerTxt { opacity: 1; } 
#section02 .swiper-slide-active.active { margin-left : 50px } 
.swiper-pagination-fraction { width : auto } 
#section02 .swiper-slide:not(.swiper-slide-active):hover .innerTxt h2 { font-size : 24px } 
#section02 .swiper-slide:not(.swiper-slide-active):hover .innerTxt span { padding : 3px 5px; font-size : 14px }


.title { position : relative; font-family: "Cormorant Garamond", serif; font-style: italic; padding-right : 100px; font-size : 64px } 
.title a { position : absolute; top : 0; right : 0; color : #101010; border : 1px solid #101010; z-index : 9 } 
.title.white { color : #fff; } 



#section03 { padding : 100px 0; background : url('../img/main/bg_section03_01.png') no-repeat center center / cover } 
.gallery { margin-top : 30px; columns: 4; column-gap: 1.5rem; overflow : hidden; width: 100%; } 
.gallery-item { break-inside: avoid; overflow : hidden; margin-bottom: 1.5rem; position: relative } 
.gallery .img_wrap { border-radius : 10px; overflow : hidden } 
.gallery-item a { display : block; overflow : hidden } 
.gallery-item a:focus { border : 2px dashed white } 
.gallery-item img { width: 100%; height: auto; display: block; transition: transform 0.3s ease; } 
.gallery-item:hover img { transform: scale(1.05); } 
.gallery-item dl { display : table; table-layout: fixed; width : 100%; margin-top : 20px; color : #fff } 
.gallery-item dl dt,
.gallery-item dl dd { display : table-cell; vertical-align: middle; font-size : 16px } 
.gallery-item dl dt { width : 22px } 
.gallery-item dl dt img { display : block; width : 15px; -webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1); } 
.gallery-item dl p { width : 40px; height : 40px; border-radius : 100%; border : 1px solid #888; overflow : hidden } 
.gallery-item .txt p.ellipsis { color : #fff; margin-top : 10px; font-size : 20px } 




#section05 { margin : 100px auto 50px } 
#section05 ul { display : flex; margin-top : 40px } 
#section05 ul li { width : 33.33% } 
#section05 ul a { display : block; border-left : 1px solid #000F41; padding : 30px } 
#section05 ul li:last-child a { border-right : 1px solid #000F41 } 
#section05 ul h2 { height : 70px; margin-bottom : 50px; font-size : 24px } 

footer { margin-top : 50px !important } 

@media ( max-width : 1700px ){
 #section01 .main_slide_left h2 { font-size : 55px; line-height : 130% } 
 #section01 .main_slide_right { max-width : 950px } 
 }

@media ( max-width : 1550px ){
 #section01 .main_slide_right { max-width : 850px } 
 .mainSlider { height : 620px } 
 #section01 .swiper-pagination { position : absolute; bottom : 100px } 
 #section01 .swiper_arrow { right : 20px } 
 }

@media ( max-width : 1440px ){
 #section01 .main_slide_right { max-width : 750px } 
 #section02 .swiper { padding-right : 0 } 
 }


@media (max-width: 1200px){
 #section01 { flex-direction: column; } 
 #section01 .main_slide_left,
 #section01 .main_slide_right { width : 100%; max-width : 100% } 
 #section01 .main_slide_left { padding : 35px } 
 #section01 .main_slide_left h2 { font-size : 45px } 
 #section01 .main_slide_left p { font-size : 24px } 
 #section01 .swiper-pagination { position : static; text-align : right; padding-right : 200px; margin-top : 30px } 
 #section01 .swiper-pagination, #section01 .swiper-pagination span { font-size : 50px } 
 #section01 .swiper_arrow { bottom : 30px } 
 .mainSlider { height : 420px } 
 .mainSlider .swiper-slide p { font-size : 20px } 

 #section02 .section02_slide_ctrl { top : 100px; right : 40px } 
 #section02 .section02_slide_ctrl h2 { font-size : 50px } 
 
 #section02 .swiper-wrapper { height : 360px } 
 #section02 .swiper-slide { height : 250px } 
 #section02 .swiper-slide-active { width : 360px !important; height : 360px !important } 
 .gallery { columns: 3; } 

 .title { font-size : 55px } 
 .title a { top : 10px } 
 .more_btn { line-height : 45px } 

 #section04 .calendar_data_head div,
 #section04 #calData div { line-height : 60px } 
 #section04 #calData div { height : 60px } 
 #section04 .calendar_data_head div { font-size : 20px } 
 #section04 .calendar_head h2 { font-size : 28px } 
 #section04 #calendarInfoTxt h2 { font-size : 20px } 
}

 @media ( max-width : 1000px ){
 #section02 .section02_slide_ctrl { position : relative; top : 0; right : 0; width : 100% } 
 #section02 .sub_inner { bottom : inherit; top : 0; right : 0 } 
 #section02 .sub_inner .swiper_arrow { top : 0 } 
 #section02 .swiper-pagination-fraction,
 #section02 .swiper-button-next,
 #section02 .swiper-button-prev { top : inherit; bottom : 0; margin-top : 0 } 
 #section02 .swiper-button-next,
 #section02 .swiper-button-prev { top : 10px } 
 #section05 ul { flex-wrap : wrap; border-bottom : 1px solid #000F41 } 
 #section05 ul li { width : 100% } 
 #section05 ul a { border : none; border-top : 1px solid #000F41 } 
 #section05 ul li:last-child a { border-right : none } 
 #section05 ul h2 { margin-bottom : 20px; font-size : 20px; height : auto } 
 }


@media (max-width: 800px){
 .title { font-size : 45px } 
 .title a { width : 110px; padding : 0; } 
 .gallery { columns: 2; } 
 #section04 .calendar_head h2 { margin-top : 30px } 
 #section04 .calendar_wrap { flex-direction: column; } 
 #section04 #calendarInfoTxt { height : auto } 
 #section04 .left, #section04 .right { width : 100% } 
 #section04 .calendar_data_head div, #section04 #calData div { line-height : 40px } 
 #section04 #calData div { height : 40px } 
 #section04 #calData a { width : 35px; line-height : 35px } 
 #section04 #calendarInfoTxt span { font-size : 16px } 
 #section04 #calendarInfoTxt span:before { margin-right : 10px; width : 6px; height : 6px } 

 #section05 ul { flex-direction: column; } 
 #section05 ul a { border : none !important; border-top : 1px solid #000F41 !important; font-size : 16px } 
 #section05 ul h2 { font-size : 20px; margin-bottom : 50px } 
 }
 @media ( max-width : 700px ){
 #section02 .swiper-slide-active { width : 100% !important } 
 #section02 .swiper-slide { transition: none; } 
 }

@keyframes fadeUp { to { opacity: 1; transform: translateY(0); } 
 }


 @media ( max-width : 550px ){
 #section01 .swiper_ctrl_wrap,
 #section01 .swiper_arrow { display : flex; align-items: center; justify-content: space-between; } 
 #section01 .swiper-button-next, #section01 .swiper-button-prev { position : static; margin : 0 !important } 
 #section01 .swiper-pagination { padding : 0; margin-top : 0 } 
#section01 .swiper_arrow { position : static; margin-top : 15px } 
#section02 .swiper-pagination { display : none }
#section02 .title a { position : relative; top : -10px }
 }