/**
* OLYM Cascading Style Sheets
* File Name : main.css
* Description : 메인 스타일시트
* Author : Web business Team / Choi Hyun Mi
* Email : desingtj@olym.co.kr
* Date : 2018.05.24
* Update : 2024.06.14
* Copyright(c) 2024 OLYM Communications. All Rights Reserved.
*/
@keyframes rotate1 {
  0% { transform: rotate(0deg);}
  50%{transform: rotate(-5deg);} 
  100%{transform: rotate(-5deg);}   
}

@keyframes rotate2 {
  0% { transform: rotate(0deg);}
  10%{transform: rotate(-3deg);}   
  20%{transform: rotate(0deg);} 
  100%{transform: rotate(-3deg);}  
}

@keyframes rotate3 {
  0% { transform: rotate(0deg);}
  10%{transform: rotate(3deg);}   
  20%{transform: rotate(0deg);} 
  100%{transform: rotate(3deg);}  
}

@keyframes opacity1 {
  0% { opacity: 0;}
  100% { opacity: 1;}
}

@keyframes rotate4 {
  0% { transform: rotate(0deg);}
  100%{transform: rotate(5deg);}   
}
@keyframes updown1 {
  0% { transform: translateY(0) rotate(1deg);}
  100%{transform: translateY(5px) rotate(0deg);}   
}

/* main */
#main { height: 580px; position: relative;}
#main .swiper { width: 100%; height: 100%;}
#main .swiper-slide.bg1 { background: url("/project/design/main/main1.jpg?ver=2") no-repeat center / auto 100%;}
#main .swiper-slide.bg2 { background: url("/project/design/main/main2.jpg?ver=2") no-repeat center / auto 100%;}
#main .swiper-pagination1 { position: absolute; bottom: 30px; z-index: 200; width: 100%; text-align: center;}
#main .swiper-pagination-bullet { width: 13px; height: 13px; background: #fff; opacity: 0.5; margin: 0 5px;}
#main .swiper-pagination-bullet-active { opacity: 1;}

/* schedule */
.schedule { margin-top: 100px; justify-content: space-between; gap: 40px;}
.schedule .left { flex: 2; position: relative;}
.schedule .left h3 { z-index: 200; position: relative; font-size: 34px; color: #222; font-family: "Cafe24Ssurround"; font-weight: 600; letter-spacing: -0.04em;}
.schedule .left h3 span { position: relative;}
.schedule .left h3 span:after { position: absolute; width: 100%; height: 15px; bottom: 0; left: 50%; transform: translate(-50%, 0); display: inline-block; content: ""; background: #e3edac; z-index: -1;}
.schedule .left h3 p { font-size: 15px; color: #666; letter-spacing: 0;}
.schedule .left > ul {margin-top: 50px;}
.schedule .left > ul > li { margin-bottom: 20px; display: flex; align-items: center; gap: 30px;}
.schedule .left > ul > li span { flex: 1; font-size: 18px; font-weight: 700; color: #1892ad;}
.schedule .left > ul > li p { flex: 5; font-size: 22px; font-weight: 700; color: #000;}
.schedule .left .img_l_sch1 { position: absolute; top: -35px; right: 40px; animation-name: rotate1; animation-duration: 1s; animation-direction: alternate; animation-iteration-count: infinite;}

.schedule .right { flex: 3; display: flex; gap: 30px; justify-content: space-between; }
.schedule .right a { flex: 1; display: block; height: 290px; box-sizing: border-box; padding: 35px 40px; border-radius: 10px 10px 50px 10px; position: relative;}
.schedule .right a:hover { box-shadow: 5px 10px 20px rgba(0, 0, 0,0.1);}
.schedule .right a p { font-size: 22px; font-weight: 700; color: #2a2a2a;}
.schedule .right a span { position: absolute; top: 30px; right: 30px; display: flex; align-items: center; justify-content: center; text-align: center; font-family: "Cafe24Ssurround"; line-height: 1rem; font-size: 14px; border-radius: 100%; width: 60px; height: 60px; background-color: #1bc75e; color: #fff;}
.schedule .right a.bg1 { background: #e5edab url("/project/design/main/bg_r_sch1.jpg") no-repeat right bottom;}
.schedule .right a.bg2 { background: #b4e3e7 url("/project/design/main/bg_r_sch2.jpg") no-repeat right bottom;}
.schedule .right a.bg3 { background: #b2e6c7 url("/project/design/main/bg_r_sch3.jpg") no-repeat right bottom;}

/* community */
.community { gap: 75px; margin-top: 100px;}
.community .comm_box { flex: 1; width: 67.8%; gap: 70px;}
.community .comm_box div { flex: 1;}
.community .comm_box h3 { font-size: 26px; font-family: "Cafe24Ssurround"; color: #222; border-bottom: 1px solid #000; position: relative; padding:20px 0 10px 0;  margin-bottom: 10px;}
.community .comm_box h3 span { background: url("/project/design/main/bg_main_btn_more.png") no-repeat center; width: 45px; height: 13px; display: inline-block; position: absolute; right: 0; bottom: 26px; cursor: pointer;}
.community .comm_box h3:before { position: absolute; display: inline-block; top: 0; left: 0; font-size: 13px; font-family: "Montserrat"; font-weight: 500; color: #afafaf; letter-spacing: 0.1rem;}
.community .comm_box .notice h3:before { content: "NOTICE";}
.community .comm_box .news h3:before { content: "NEWS"; }

.community ul li { border-bottom: 1px solid #ddd; box-sizing: border-box; position: relative; height: 90px; line-height: 96px; display: flex; align-items: center; justify-content: space-between;}
.community ul li a { color: #888; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; font-size: 18px; width: 325px;}
.community ul li span.cate { color: #fff; font-size: 15px; width: 65px; display: inline-block; text-align: center; margin-right: 10px; height: 28px; line-height: 28px;}
.community ul li span.cate.bg1 { background: #1892ad;}
.community ul li span.cate.bg2 { background: #000;}
.community ul li span.date { font-weight: 400; color: #999; width: 84px; padding-left: 10px; text-align: right;}

.community .link { flex: 0.85; flex-direction: column; gap: 30px;}
.community .link > a { flex: 1; border: 1px solid #f0f0f0; border-radius: 10px; display: flex; align-items: center; gap: 20px; padding: 20px 30px;}
.community .link h3 { font-size: 22px; font-family: "Cafe24Ssurround"; color: #222;}
.community .link p { color: #8e8e8e; padding-top: 5px;}

/* on_exhi */
.on_exhi { position: relative; height: 700px; color: #000; padding: 0; margin-top: 120px;}
.on_exhi:after { font-size: 130px; color: #222; font-weight: 700; font-family: 'Montserrat', sans-serif; position: absolute; left: 50%; bottom: -80px; content: "Online Exhibition"; z-index: 1000; display: inline-block; width: 1320px; transform: translate(-50%, 0);}
.on_exhi .tit_box { position: absolute; z-index: 1000; left: 50%; top: -22px; transform: translate(-50%, 0); display: flex; align-items: center;}
.on_exhi .tit_box h3 { font-size: 30px; font-weight: 700; margin-right: 60px;}
.on_exhi .tit_box .on_exhi_btn ul { display: flex; gap: 40px;}
.on_exhi .tit_box .on_exhi_btn li { cursor: pointer; font-weight: 900; transition: .3s all ease;}
.on_exhi .tit_box .on_exhi_btn li:hover { color: #1892ad; transition: .3s all ease;}
.on_exhi .tit_box .on_exhi_btn li.active { color: #1892ad;}

.on_exhi .swiper { width: 100%; height: 100%;}
.on_exhi .swiper-slide { text-align: center; background: #fff; display: flex; justify-content: center; align-items: center; background: #f5f5f5 url("/project/design/main/bg_on_exhi.jpg") no-repeat center;}
.on_exhi .swiper-slide img { display: block; object-fit: cover; margin: 0 auto;}
.on_exhi .swiper-button-next, .on_exhi .swiper-button-prev { color: #222 !important;}
.on_exhi .page_box { position: absolute; left: 50%; top: 50px; z-index: 1000; transform: translate(-50%, 0);}
.on_exhi .page_box .swiper-pagination { display: flex; justify-content: flex-end;}
.on_exhi .page_box .swiper-pagination-bullet-active { background-color: #000;}

.on_exhi .wrap_box.fx { align-items: center; justify-content: center;}
.on_exhi .wrap_box.fx > div { flex: 1; text-align: left;}
.on_exhi .wrap_box.fx > div.con1 h4 { font-size: 30px; font-weight: 900; color: #222;}
.on_exhi .wrap_box.fx > div.con1 h4 span { font-size: 60px;}
.on_exhi .wrap_box.fx > div.con1 p { color: #666; margin-top: 30px;}
.on_exhi .wrap_box.fx > div.con2 { position: relative; bottom: -75px;}
.on_exhi .wrap_box.fx > div.con3 > span { position: relative; color: #1892ad; padding-bottom: 10px; font-weight: 900;}
.on_exhi .wrap_box.fx > div.con3 > span:after { position: absolute; display: inline-block; content: ""; background: #1892ad; width: 100%; height: 4px; left: 50%; transform: translate(-50%, 0); bottom: 0;}
.on_exhi .wrap_box.fx > div.con3 h5 { font-size: 24px; color: #222; font-weight: 700; margin: 30px 0;}
.on_exhi .wrap_box.fx > div.con3 h5 > span { display: block;}
.on_exhi .wrap_box.fx > div.con3 p { color: #666; margin-bottom: 40px;}
.on_exhi .wrap_box.fx > div.con3 a { font-size: 15px; color: #000; font-weight: 700;}
.on_exhi .wrap_box.fx > div.con3 a i { position: relative; top: 1px;}

/* sns */
.sns { position: relative; margin-top: 100px; background: #f0f9e4; padding: 100px 0; z-index: 0;}
.sns:after { position: absolute; right: 30px; bottom: 0; content: "JIKJI FESTIVAL 2024"; color: #dbecd4; font-weight: 700; font-size: 149px; z-index: -1; font-family: 'Montserrat', sans-serif;}
.sns > .wrap_box { gap: 70px;}
.sns > .wrap_box > div { flex: 1;}
.sns > .wrap_box > div.youtube { flex: 0.81;}
.sns h3 { font-size: 26px; font-family: "Cafe24Ssurround"; color: #222; padding-top: 20px; position: relative; margin-bottom: 20px;}
.sns h3:before { position: absolute; display: inline-block; top: 0; left: 0; font-size: 13px; font-family: "Montserrat"; font-weight: 500; color: #afafaf; letter-spacing: 0.1rem;}
.sns .instagram h3:before { content: "INSTAGRAM";}
.sns .youtube h3:before { content: "YOUTUBE";}

.sns .container_box { gap: 60px;}
.sns .youtube .container_box { position: relative; height: auto; width: 100%; padding-top: 56.25%; border-radius: 20px; overflow: hidden;}
.sns .container { position: relative; width: 50%; border-radius: 20px; overflow: hidden;}
.sns .container .image { display: block; width: 100%; height: auto;}
.sns .container .overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; opacity: 0; transition: .5s ease; background-color: rgba(24, 146, 173, 0.8);}
.sns .container .overlay a { color: #fff;}
.sns .container:hover .overlay { opacity: 1;}
.sns .container .text { color: #fff; font-size: 16px; position: absolute; top: 50%; left: 50%;transform: translate(-50%, -50%); text-align: center; width: 100%; padding: 8%; box-sizing: border-box;}

.sns .img_c1 { position: absolute; top: -140px; left: -35px;}
.sns .img_c1 .img_c1_1 { position: absolute; top: 72px; left: 21px; animation-name: rotate1; animation-delay: 0.5s; animation-duration: 1.5s; animation-direction: alternate; animation-iteration-count: infinite;}
.sns .img_c1 .img_c1_2 { position: absolute; top: 0; left: 94px; animation-name: rotate1; animation-duration: 1.5s; animation-direction: alternate; animation-iteration-count: infinite;}
.sns .img_c1 .img_c1_3 { position: absolute; top: 70px; left: 0; animation-name: opacity1; animation-duration: 0.5s; animation-direction: alternate; animation-iteration-count: infinite;}
.sns .img_c1 .img_c1_4 { position: absolute; top: 25px; left: 83px; animation-name: opacity1; animation-delay: 0.2s; animation-duration: 0.5s; animation-direction: alternate; animation-iteration-count: infinite;}
.sns .img_c1 .img_c1_5 { position: absolute; top: 104px; left: 94px; animation-name: opacity1;  animation-delay: 0.4s; animation-duration: 0.5s; animation-direction: alternate; animation-iteration-count: infinite;}

.sns .img_c2 { position: absolute; top: -82px; left: 248px; animation-name: updown1; animation-duration: 1s; animation-direction: alternate; animation-iteration-count: infinite;}
.sns .img_c3 { position: absolute; top: -116px; left: 580px; animation-name: rotate2; animation-duration: 2s; animation-direction: alternate; animation-iteration-count: infinite;}
.sns .img_c4 { position: absolute; top: -124px; left: 720px; animation-name: rotate3; animation-delay: 0.5s; animation-duration: 2s; animation-direction: alternate; animation-iteration-count: infinite;}
.sns .img_c5 { position: absolute; top: -154px; right: -55px;}
.sns .img_c5 .img_c5_1 { position: absolute; top: 0; right: 0;}
.sns .img_c5 .img_c5_2 { position: absolute; top: 50px; right: 162px; animation-name: rotate4; animation-duration: 1s; animation-direction: alternate; animation-iteration-count: infinite;}
.sns .img_c5 .img_c5_3 { position: absolute; top: 38px; right: 110px; animation-name: updown1; animation-duration: 1s; animation-delay: 0.5s; animation-direction: alternate; animation-iteration-count: infinite;}

/* sns_link */
.sns_link { padding: 80px 0; justify-content: space-between; align-items: center;}
.sns_link h3 { font-size: 26px; font-family: "Cafe24Ssurround"; color: #222; font-weight: 700; position: relative;}
.sns_link h3 .em1 { color: #ec807a;}
.sns_link h3 .em2 { color: #61b0bc;}
.sns_link h3 .img_c6 { position: absolute; top: -45px; right: -15px; animation-name: rotate2; animation-duration: 2s; animation-direction: alternate; animation-iteration-count: infinite;}
.sns_link ul { gap: 44px;}
.sns_link ul li a { width: 100px; height: 100px; border-radius: 100px; background: #d8d8d8; display: flex; align-items: center; justify-content: center;}
.sns_link ul li a i { color: #222; font-size: 36px;}
.sns_link ul li a:hover i { color: #fff;}

.sns_link ul li:nth-of-type(1) a:hover { background: #03c65a;}
.sns_link ul li:nth-of-type(2) a:hover { background: linear-gradient(#434aeb, #ef3178, #f05337, #edc56d);}
.sns_link ul li:nth-of-type(3) a:hover { background: #ff0000;}
.sns_link ul li:nth-of-type(4) a:hover { background: #fbe300;}
.sns_link ul li:nth-of-type(4) a:hover i { color: #3b1e1e;}
/* .sns_link ul li:nth-of-type(5) a:hover { background: #1877f2;} */
.sns_link ul li:nth-of-type(5) a:hover { background: #ff6f0e;}

.sns_link ul li a i.img_dang { width: 36px; height: 36px; display: flex; background:url("/project/design/main/icon_dang.png") no-repeat center / cover;}
.sns_link ul li a:hover i.img_dang { background:url("/project/design/main/icon_dang_on.png") no-repeat center / cover;}

/* sponsor_box */
.sponsor_box { border-top: 1px solid #eee; padding: 40px 0; box-sizing: border-box;}
.sponsor {display: flex; align-items: center; gap: 20px; overflow: hidden;}
.sponsor .slide_area { position: relative; width: calc(100% - 170px);}
.sponsor .slide_ctrl { flex-basis: 170px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; gap: 5px;}
.sponsor .slide_ctrl a { display: flex; justify-content: center; align-items: center; cursor: pointer; width: 40px; height: 40px; border: 1px solid #e7e7e7; box-sizing: border-box; border-radius: 10px; }
.sponsor .slide_ctrl i { font-size: 1.5em; color: #868686; transform: translateY(1px);}
.sponsor .owl-stage {display: flex; align-items: center;}
.sponsor .owl-carousel .owl-stage-outer { width: 100%;}
.sponsor .owl-carousel .owl-item a { display: flex; justify-content: center; max-height: 44px; background: #fff;}
.sponsor .owl-carousel .owl-item a img { width: auto !important; max-height: 44px; mix-blend-mode: luminosity; opacity: .7;}
.sponsor .owl-carousel .owl-item a img:hover { mix-blend-mode: normal; opacity: 1;}

@media all and (max-width:1600px) { 
  .sns:after { font-size: 130px;}
}

@media all and (max-width:1400px) { 
  .community { gap: 40px;}
  .community .comm_box { gap: 40px;}
  
  .on_exhi .wrap_box.fx > div.con1,
  .on_exhi .wrap_box.fx > div.con3 { padding: 30px;}
  .on_exhi .wrap_box.fx > div.con1 h4 { line-height: 1.2em;}
  .on_exhi .wrap_box.fx > div.con1 h4 span { display: block; line-height: 1.2em;}
}

@media all and (max-width:1380px) {   
  #main { height: 480px;}
  .schedule { flex-direction: column; margin-top: 60px;}
  .schedule .left {display: flex; gap: 30px; align-items: center;}
  .schedule .left h3 {flex: 1; padding-left: 140px; box-sizing: border-box; font-size: 26px;}
  .schedule .left h3 p { font-size: 14px;}
  .schedule .left > ul { margin-top: 0; flex: 1.5;}
  .schedule .left > ul > li { margin-bottom: 10px;}
  .schedule .left .img_l_sch1 { top: 0; right: auto; left: 0;}
  .schedule .right a { height: 200px;}
  
  .community { flex-direction: column; margin-top: 60px;}
  .community .comm_box {width: 100%;}  
  .community .link { flex-direction: row; gap: 40px;}
  .sns:after { font-size: 120px;}
  .sns > .wrap_box { gap: 30px;}
  .sns .container_box { gap: 30px;}
  .sns_link ul { gap: 20px;}
}

@media all and (max-width:1320px) { 
  .on_exhi:after { width: 95%;}
}

@media all and (max-width:1280px) { 
  .sns:after { font-size: 110px;}
  .sns > .wrap_box > div.youtube { flex: 0.79;}

  .on_exhi:after { font-size: 120px;}
  .on_exhi .wrap_box.fx > div.con1 h4 span { font-size: 55px;}
}

@media all and (max-width:1200px) { 
  .on_exhi .wrap_box.fx > div.con3 p br { display: none;}
}

@media all and (max-width:1150px) { 
  .sns { padding: 150px 0 100px 0;}
  .sns:after { font-size: 90px;}
  .sns_link h3 br { display: none;}
  .sns .img_c1 { left: 0;}
  .sns .img_c3 { left: 380px;}
  .sns .img_c4 { left: 450px;}
  .sns .img_c5 { top: -200px; right: 0;}

  .on_exhi:after { font-size: 100px;}
  .on_exhi .wrap_box.fx > div.con1 h4 span { font-size: 50px;}
}

@media all and (max-width:1024px) { 
  #main { height: 450px;}
  .community .comm_box h3 { font-size: 26px;}
  .community .comm_box h3:before { font-size: 14px;}
  .community ul li { height: 80px; line-height: 86px;}
  .community ul li a { font-size: 16px;}
  .sns h3 { font-size: 26px;}
  .sns h3:before { font-size: 14px;}
  .sns .container .text { font-size: 14px;}
  .sns_link { flex-direction: column; gap: 20px;}
  .sns_link h3 { font-size: 26px;}
  .sns_link h3 .img_c6 { right: -90px;}
  .sns_link ul li a { width: 90px; height: 90px;}
  .sns_link ul li a i { font-size: 30px;}  
  .sns_link ul li a i.img_dang { width: 30px; height: 30px;}

  .on_exhi .tit_box h3 { font-size: 26px;}
  .on_exhi .tit_box .on_exhi_btn { position: relative; top: 3px;}
  .on_exhi .wrap_box.fx > div.con1 h4,
  .on_exhi .wrap_box.fx > div.con1 h4 span { font-size: 28px;}  
}

@media all and (max-width:960px) { 
  .community .comm_box { flex-direction: column;}
  .sns:after { font-size: 80px;}

  .on_exhi { height: 800px;}
  .on_exhi:after { font-size: 90px; width: 95%; box-sizing: border-box; bottom: -60px;}
  .on_exhi .swiper-slide { position: relative; box-sizing: border-box; align-items: flex-start !important;}
  .on_exhi .wrap_box.fx { flex-direction: column; justify-content: flex-start !important; align-items: flex-start !important; height: 100%;}
  .on_exhi .page_box { left: auto; transform: translate(0, 0); right: 40px;}
  .on_exhi .wrap_box.fx > div { flex: 0;}
  .on_exhi .wrap_box.fx > div.con1 { padding: 40px;}
  .on_exhi .wrap_box.fx > div.con2 { position: absolute; bottom: -75px; left: 50%; transform: translate(-50%, 0);}
  .on_exhi .wrap_box.fx > div.con2 img { zoom: 0.75;}
  .on_exhi .wrap_box.fx > div.con3 { padding: 0 40px;}
  .on_exhi .wrap_box.fx > div.con3 h5 { margin: 15px 0;}
  .on_exhi .wrap_box.fx > div.con3 h5 span { display: inline;}
}

@media all and (max-width:900px) { 
  .sns:after { font-size: 70px;}
  .sns .img_c3 { top: -166px;left: 280px;}
  .sns .img_c4 { top: -184px; left: 350px;}
  .on_exhi:after { font-size: 80px;}
}

@media all and (max-width:767px) { 
  #main { height: 350px;}
  .schedule { margin-top: 60px;}
  .schedule .left { flex-direction: column; align-items: flex-start;}
  .schedule .left > ul { width: 100%;}
  .schedule .left .img_l_sch1 { top: -30px;}
  .schedule .right { gap: 20px;}

  .community { margin-top: 50px; gap: 30px;}
  .community .comm_box { gap: 30px;}
  .community .comm_box h3 { font-size: 22px;}
  .community .comm_box h3:before { font-size: 12px;}
  .community ul li { line-height: 76px; height: 70px;}
  .community ul li a { font-size: 15px;}
  .community .link { gap: 20px;}

  .sns:after { font-size: 60px;}
  .sns h3 { font-size: 22px;}
  .sns h3:before { font-size: 12px;}
  .sns > .wrap_box { flex-direction: column;}
  .sns .instagram { margin-top: 30px;}
  .sns .container_box { display: grid; grid-template-columns: 1fr 1fr; gap: 20px;}
  .sns .container { width: 100%;}
  .sns .container .text { font-size: 12px;}
  .sns .img_c2 {z-index: 3; left: 186px;}
  .sns .img_c3 { left: 180px;}
  .sns .img_c4 { left: 250px;}

  .sns_link { padding: 50px 0;}
  .sns_link h3 {font-size: 22px;}
  .sns_link ul { gap:15px;}
  .sns_link ul li a { width: 75px; height: 75px;}
  .sns_link ul li a i { font-size: 26px;}
  .sns_link ul li a i.img_dang { width: 26px; height: 26px;}

  .on_exhi { margin-top: 60px;}
  .on_exhi:after { font-size: 70px; bottom: -40px;}
  .on_exhi .tit_box { top: -15px;}
  .on_exhi .tit_box h3 { font-size: 22px;}
  .on_exhi .wrap_box.fx > div.con1 h4,
  .on_exhi .wrap_box.fx > div.con1 h4 span { font-size: 26px;}
  .on_exhi .wrap_box.fx > div.con1 p { margin-top: 20px;}
  .on_exhi .wrap_box.fx > div.con3 h5 { font-size: 22px;}
}

@media all and (max-width:680px) { 
  #main { height: 300px;}
  .schedule .right { flex-direction: column;}
  .community .link { flex-direction: column;}
  .sns:after { font-size: 50px;}
  .sns > .wrap_box { flex-direction: column;}
  .sns > .wrap_box > div.youtube { flex: 0.76;}
  .sns .img_c2 { display: none;}
  .sns .img_c3 {  display: none;}
  .sns .img_c4 {  display: none;}

  .on_exhi:after { font-size: 60px; bottom: -40px;}
  .on_exhi .tit_box .on_exhi_btn ul { gap: 30px;}
  .sns_link h3 { padding-top: 50px; text-align: center;}
  .sns_link h3 .img_c6 { right: auto; left: 46%; top: -25px;}
}

@media all and (max-width:600px) { 
  .sns:after { font-size: 40px;}

  .sns_link ul { gap:10px;}
  .sns_link ul li a { width: 65px; height: 65px;}
  .sns_link ul li a i { font-size: 24px;}
  .sns_link ul li a i.img_dang { width: 24px; height: 24px;}

  .on_exhi { height: 880px;}
  .on_exhi:after { font-size: 50px; bottom: -30px;}
  .on_exhi .tit_box { flex-direction: column; align-items: flex-start;}
  .on_exhi .tit_box .on_exhi_btn { margin: 25px 0;}
  .on_exhi .page_box { right: 5%; top: 20px; display: none;}
  .on_exhi .wrap_box.fx > div.con1 { padding-top: 100px;}
  .on_exhi .wrap_box.fx > div.con2 img { zoom: 0.65;}
}

@media all and (max-width:480px) { 
  #main { height: 180px;}
  .schedule { margin-top: 30px; }
  .schedule .left h3 { padding-left: 120px; font-size: 21px;}
  .schedule .left h3 p { font-size: 13px;}
  .schedule .left .img_l_sch1 { zoom: 0.8; top: 0;}
  .schedule .left > ul > li { gap: 0; flex-direction: column;}
  .schedule .left > ul > li span { font-size: 16px;}
  .schedule .left > ul > li p { font-size: 18px;}
  .schedule .right a { padding: 25px;}
  .schedule .right a p { font-size: 20px;}
  .schedule .right a span { right: auto; left: 32%; top: 25px;}
  .schedule .right a.bg1 { background: #e5edab url("/project/design/main/bg_r_sch1.jpg") no-repeat right bottom / 50%;}
  .schedule .right a.bg2 { background: #b4e3e7 url("/project/design/main/bg_r_sch2.jpg") no-repeat right bottom / 50%;}
  .schedule .right a.bg3 { background: #b2e6c7 url("/project/design/main/bg_r_sch3.jpg") no-repeat right bottom / 50%;}

  .sns:after { font-size: 30px;}
  .sns .img_c1 { display: none;}
  .sns .img_c5 { right: -10px; zoom:0.9}
  .sponsor {gap: 0;}
  .sponsor .slide_area { width: calc(100% - 160px);}
  .sponsor .slide_ctrl { flex-basis: 160px; }
 
  .on_exhi { height: 900px;}
  .on_exhi:after { font-size: 40px; bottom: -30px;}
  .on_exhi .tit_box.on_exhi_btn ul { gap: 15px;}
  .on_exhi .tit_box.on_exhi_btn li { font-size: 0.95em;}
}

@media all and (max-width:414px) { 
  .sns_link ul { justify-content: flex-start; gap:5px;}
  .sns_link ul li a { width: 50px; height: 50px;}
  .sns_link ul li a i { font-size: 20px;}
  .sns_link ul li a i.img_dang { width: 20px; height: 20px;}

  .on_exhi:after { font-size: 35px; bottom: -25px;}
  .on_exhi .tit_box .on_exhi_btn li { font-size: 0.875em;}
  .on_exhi .wrap_box.fx > div.con2 img { zoom: 0.5;}
}