@charset "utf-8";

#_header .font_size {display:none}

#wrap {position:relative; padding-top:0; width:100%}

.section1 {position:relative; padding:40px 0; margin-top:210px}
.section1::before {content:''; height:575px; background:#fef5e6; width:35%; position:absolute; right:0; top:20px; border-radius:300px 0 0 300px}
.section1 .container {display:flex; flex-wrap:wrap; align-items:flex-start}

.section2 {position:relative; padding:40px 0}
.section2:before {content:''; height:575px; background:#edfee6; width:50%; position:absolute; left:-200px; bottom:50px; border-radius:0 300px 300px 0; transform:rotate(-25deg);}


.section3 {margin-bottom:100px}

.mainVisArea {position:relative; width:62%; height:auto; overflow:hidden; border-radius:50px; box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.05);}
.mainVisArea .swiper-wrapper .swiper-slide {display:block; position:relative; width:100%; height:auto}
.mainVisArea .swiper-wrapper .swiper-slide img {border-radius:50px}
.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%;}


.container {clear:both; max-width:1400px; margin:0 auto; position:relative; font-size:0; letter-spacing:-0.5px}
.container h2 {font-size:30px; margin-bottom:30px; font-weight:600; position:relative}
.container .btn_more2 {background:#5aa9a4; width:40px; height:40px; border-radius:50%; text-align:center; line-height:40px}

.d_link {width:calc(38% - 70px); margin-left:70px; display:flex; flex-wrap:wrap; text-align:center; position:relative}
.d_link::before {content:''; height:575px; background:#fef5e6; width:110%; position:absolute; right:0; top:-20px; border-radius:300px 0 0 300px; z-index:-1}
.d_link a {width:calc(33.33% - 30px); margin-left:30px; box-sizing:border-box; font-size:18px; font-weight:500; align-items:center}
.d_link a:nth-child(n+4) {margin-top:20px}
.d_link a .img {background:#fff; border:#dbdbdb solid 1px; border-radius:20px; padding:30px 0}
.d_link a p {margin-top:20px; line-height:1.2; letter-spacing:-1px}
.d_link a:last-child {background:#b8ceed; width:calc(66.67% - 30px); border-radius:20px; text-align:left; padding:30px 30px 0 30px}
.d_link a:last-child p {text-align:right; font-family: 'yg-jalnan'; font-size:25px}

.notice {width:43%; display:inline-block; box-sizing:border-box; position:relative; vertical-align:top; height:450px}
.notice > ul {position:relative; font-size:0}
.notice > ul > li {display:inline-block}
.notice > ul > li+li {margin-left:5px}
.notice > ul > li > a {font-size:20px; color:#888; background:#e3e3e3; border-radius:30px; padding:15px 25px 13px 25px; display:block; font-weight:500}
.notice > ul > li.active > a {color:#fff; background:#5a61a9}
.notice > ul > li > div {position:absolute; top:90px; left:0; display:block; width:100%; box-sizing:border-box; border-radius:50px; box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.05); background:rgba(255,255,255,0.5)}
.notice > ul > li > div p {display:block; position:relative; padding:30px 50px}
.notice > ul > li > div p label {display:block; margin-bottom:20px; font-size:18px; font-weight:600; color:#5a61a9}
.notice > ul > li > div p a {font-size:20px; font-weight:600; width:100%; text-overflow: ellipsis; white-space:nowrap; overflow:hidden; display:block}
.notice > ul > li > div p span {font-size:16px; display:block; margin-top:20px}
.notice > ul > li:not(.active) > div {display:none}
.notice > ul > li > div > ul {display:block; padding:40px 50px; border-top:#acb0d4 solid 1px}
.notice > ul > li > div > ul > li {position:relative; box-sizing:border-box; padding-left:20px; display:block}
.notice > ul > li > div > ul > li:before {content:''; width:5px; height:5px; border-radius:50%; background:#5a61a9; position:absolute; left:0; top:50%; transform:translateY(-50%)}
.notice > ul > li > div > ul > li+li {margin-top:15px}
.notice > ul > li > div > ul > li > a {text-overflow: ellipsis; white-space:nowrap; overflow:hidden; display:block; font-size:18px; font-weight:500}
.notice a.btn_more {position:absolute; top:-90px; right:0}

.center {width:calc(25% - 50px); margin-left:50px; display:inline-block; vertical-align:top; position:relative}
.youtube a {font-size:16px; display:inline-block; position:relative; box-sizing:border-box; width:100%; border-radius:20px; box-shadow:0 0 5px 3px rgba(0,0,0,0.1)}
.youtube a div.img {overflow:hidden; border-radius:20px; height:190px}
.youtube a .video-container {position:relative; padding-bottom:56.25%; padding-top:30px; height:0; overflow:hidden}
.youtube a .video-container iframe,
.youtube a .video-container object,
.youtube a .video-container embed {position:absolute; top:0; left:0; width:100%; height:100%}
.youtube a p {padding:20px 5px; font-size:18px; font-weight:600; line-height:1.5; background:#fff; border-radius:0 0 20px 20px; text-align:center; box-sizing:border-box}

.ebook {position:relative; margin-top:20px}
.ebook div.img {overflow:hidden; border-radius:20px;  box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.05); height:240px}
.ebook div.img img {width:100%; height:100%; object-fit:cover; object-position:50% 0}
.ebook a.btn_more2 {position:absolute; top:10px; right:10px}
.ebook a.btn_book {position:absolute; bottom:20px; left:50%; transform:translateX(-50%); color:#fff; font-size:18px; font-weight:500; background:rgba(90,169,164,1); padding:12px 20px; border-radius:30px; display:block; white-space:nowrap}

.schedule {width:calc(32% - 50px); margin-left:50px; display:inline-block; box-sizing:border-box; position:relative; vertical-align:top}
.schedule h2 {font-size:25px; font-weight:400}
.schedule p.date {position:absolute; right:50px; top:0; font-size:20px; display:flex; ailgn-items:center}
.schedule p.date button {background:none}
.schedule p.date span {padding:0 10px}
.schedule p.date #cMonth {font-size:30px; font-weight:700}
.schedule > div {border-radius:50px; box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.05); background:rgba(255,255,255,0.5); padding:30px}
.schedule table {width:100%; font-size:16px; font-weight:400; z-index:1; position:relative}
.schedule th {height:50px}
.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; font-weight:600}
.schedule td.on:after {content:''; background:#5a61a9; width:6px; height:6px; border-radius:50%; position:absolute; left:50%; top:0; z-index:-1; transform:translate(-50%, 0)}
.schedule .btn_more2 {position:absolute; top:-5px; right:0; background:#5a61a9}

.schedule .list {margin-top:10px; padding-left:40px; font-size:16px; position:relative}
.schedule .list span {position:absolute; left:10px; top:0; background:#5a61a9; color:#fff; padding:5px 10px; border-radius:5px; z-index:1}
.schedule .list ul {position:relative; background:#f5f5f5; border-radius:5px; padding:10px 10px 10px 40px; overflow-y:auto; height:80px; box-sizing:border-box}
.schedule .list ul li {font-size:16px}
.schedule .list ul li+li {margin-top:10px}

.photo {position:relative; box-sizing:border-box; display:block; margin-top:70px}
.photo .btn_box {display:flex; align-items:center; position:absolute; right:0; top:0}
.photo button {width:14px; height:25px; font-size:0; margin-right:20px}
.photo button.prev {background:url('/images/main/btn_prev.png') no-repeat}
.photo button.next {background:url('/images/main/btn_next.png') no-repeat}
.photo .swiper-container {overflow:hidden; display:flex; padding:10px}
.photo .swiper-container a {font-size:16px; display:inline-block; position:relative; box-sizing:border-box}
.photo .swiper-container a div.img {overflow:hidden; border-radius:20px; height:310px; box-shadow:0 0 5px 3px rgba(0,0,0,0.1)}
.photo .swiper-container a div.img img {max-width:100%; height:auto; min-height:100%; border-radius:20px 20px 0 0; max-width:100%; min-width:100%}
.photo .swiper-container a p {font-size:18px; line-height:1.2; font-weight:500; text-align:center; margin-top:20px}
.photo .btn_more2 {background:#5a61a9}

.main_banner {padding-top:20px; box-sizing:border-box}
.main_banner .inner_box {position:relative; max-width:1400px; margin:0 auto; padding-bottom:50px; overflow:hidden}
.main_banner .inner_box h3 {font-size:18px; margin-bottom:25px; font-weight:400}
.main_banner h2 {font-size:20px; margin-bottom:20px; text-align:left}
.main_banner .banners {width:100%; padding:0 2px; box-sizing:border-box}
.main_banner .banners a img {max-width:100%; border:#dbdbdb solid 1px; border-radius:5px}
.main_banner .banners .swiper-slide {display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; -webkit-justify-content:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; -webkit-align-items:center; align-items:center}
.main_banner .btn {position:absolute; bottom:17px; right:0; font-size:0}
.main_banner .btn li {display:inline-block; margin-left:-1px}
.main_banner .btn li.cnt {font-size:14px; line-height:22px; margin-right:10px; vertical-align:middle; margin-left:0}
.main_banner .btn li button {width:22px; height:22px; display:block; font-size:0; background:#fff url('/images/main/btn_banner.png') no-repeat; border:1px solid #999; box-sizing:border-box; background-position:0 1px}
.main_banner .btn li button.next {background-position:-43px 1px;}
.main_banner .btn li button.play {background-position:-58px 0; display:none}
.main_banner .btn li button.pause {background-position:-21px 0; display:none; width:23px}
.main_banner .btn li button.play.on,
.main_banner .btn li button.pause.on {display:inline-block}


@media all and (max-width:1400px){
	
	.container {padding:0 10px; box-sizing:border-box}
	
	.main_banner .inner_box {width:100%; padding:0 10px 50px 10px; box-sizing:border-box}
	.main_banner .btn {right:10px}

}

@media all and (max-width:1200px){
	
	.section1::before {bottom:30px; top:auto}
	
	.mainVisArea {width:100%; margin-bottom:40px}
	
	.d_link {width:calc(100% + 30px); margin-left:-30px}
	.d_link::before {width:80%}
	
	.notice {width:100%; margin-bottom:50px}
	.center {width:30%; margin-left:0}
	.schedule {width:calc(70% - 50px)}

}

@media all and (max-width:1024px){
	
	.section1 {position:relative; margin-top:80px}
	.section2:before {width:100%}
	
	.photo .swiper-container a div.img {height:auto}
	.photo .swiper-container a div.img img {height:auto; min-height:auto}
	
}

@media all and (max-width:768px){
	
	.mainVisArea .swiper-wrapper .swiper-slide {height:auto !important}
	.mainVisArea .swiper-wrapper .swiper-slide .__m {display:block}
	
	.center {width:100%; margin-bottom:50px; display:flex; flex-wrap:wrap}
	.schedule {width:100%; margin-left:0}

	.ebook {width:calc(50% - 30px); margin-left:30px; margin-top:0}
	.ebook div.img {height:auto}
	.youtube {width:50%}
	.youtube a div.img {height:auto}

}

@media all and (max-width:640px){
	
	.section1::before {bottom:0}
	.section3 {margin-bottom:50px}
	
	.container h2 {font-size:25px; margin-bottom:20px}
	
	.d_link {width:calc(100% + 20px); margin-left:-20px}
	.d_link a {width:calc(33.33% - 20px); margin-left:20px; font-size:16px}
	.d_link a p {margin-top:15px}
	.d_link a:last-child {width:calc(66.67% - 20px)}
	.d_link a:last-child p {font-size:22px}
		
	.schedule h2 {font-size:20px}
	.schedule p {font-size:20px; margin-bottom:20px}
	.schedule ul li {font-size:16px}
	
	.movie {padding:0 0 30px 10px}
	.movie > button.prev {right:90px}
	.movie > button.next {right:50px}
	.movie .btn_more {right:10px}
	
	.notice {height:400px}
	.notice > ul > li > a {font-size:18px}
	.notice > ul > li > div {top:70px}
	.notice > ul > li > div p {padding:30px}
	.notice > ul > li > div p label {font-size:16px}
	.notice > ul > li > div p a {font-size:18px}
	.notice > ul > li > div p span {font-size:14px}
	.notice > ul > li > div > ul {padding:30px}
	.notice > ul > li > div > ul > li {padding-left:15px}
	.notice > ul > li > div > ul > li > a {font-size:16px}
	.notice a.btn_more {top:-70px}
	
	.ebook {width:100%; margin-left:0}
	.youtube {width:100%; margin-bottom:50px}
	
	.photo {margin-top:50px}
	.photo .btn_more {top:30px; right:10px}

}

@media all and (max-width:520px){


}

@media all and (max-width:480px){
	
	.container h2 {font-size:22px}
	
	.notice > ul > li > a {font-size:16px; padding:12px 15px 10px 15px}
	.notice > ul > li > div {top:50px}
	.notice a.btn_more {top:-50px}
	.notice a.btn_more img {width:25px}
	
	.photo .swiper-container a p {font-size:16px}
	

}

@media all and (max-width:400px){
	
	.section1::before {bottom:-60px}
	
	.d_link a .img {padding:20px 0}
	.d_link a:last-child {padding:20px 20px 0 20px}

}