@charset 'utf-8';

/* main-banner */
#main-banner { position:relative; width:100%; overflow:hidden; }
#main-banner .innerbx { position:relative;  }
#main-banner .swiper-slide { background-repeat:no-repeat; background-position:center; background-size:cover; text-align:center; }
#main-banner .swiper-slide img { max-width:100%; height:auto; }
#main-banner .ver-web { display:block; }
#main-banner .ver-m { display:none; }

#main-banner .article-box.notice { position:absolute; right:50%; top:0; width:425px; height:100%; transform:translateX(141%); background-color:#1e1e5e; padding:24px; box-sizing:border-box; z-index:10; }
#main-banner .article-box.notice .article-hd { padding-top:40px; }
#main-banner .article-box.notice .article-hd h3 { color:#fff; }
#main-banner .article-box.notice .article-hd .more-link  { color:#fff; }
#main-banner .article-box.notice .notice-list li .subject { color:#fff; }
#main-banner .article-box.notice .notice-list li .subject a { color:#fff; }
#main-banner .article-box.notice .notice-list li .date { color:#fff; }
#main-banner .article-box.notice .notice-list li:nth-child(n + 3) { border-bottom: 1px solid #d7d7d7; padding-bottom: 25px; }


/* main-content */
#main-content { background-repeat:repeat; background-position:center; background-image:url('../img/main/main_content_bg.jpg'); background-size:100% auto; }
#main-content .content { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:50% 50%; }
#main-content article { width:100%; padding:45px 30px; box-sizing:border-box; }
#main-content article .article-hd { position:relative; margin-bottom:20px; }
#main-content article .article-hd h3 { font-size:30px; line-height:1.35; font-weight:700; }
#main-content article .article-hd .more-link { position:absolute; right:0; bottom:0; font-size:16px; font-weight:700; }
#main-content article .article-body { }
#main-content article .article-body .notice-list { border-top:1px solid #d7d7d7; }
#main-content article .article-body .notice-list li { padding:15px 0; border-bottom:1px solid #d7d7d7; }
#main-content article .article-body .notice-list li .date { font-size:14px; line-height:1.35; color:#616161; margin-bottom:2px; }
#main-content article .article-body .notice-list li .subject { display:block; width:100%; font-size:18px; line-height:1.35; font-weight:700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#main-content article .article-body .notice-list li .subject a { }

/*#main-content article .article-body .gallery-list { display:grid; grid-template-columns:repeat(3, 1fr); gap:34px 22px; }*/
/*#main-content article .article-body .gallery-list li { }*/
/*#main-content article .article-body .gallery-list li .img { }*/
/*#main-content article .article-body .gallery-list li .img img { width:100%; height:auto; }*/
/*#main-content article .article-body .gallery-list li .title { font-size:14px; line-height:1.35; text-align:center;font-weight:700;  margin-top:10px; }*/

#main-content article .article-body .gallery-list { display:grid; grid-template-columns:repeat(3, 1fr); gap:34px 22px; }
#main-content article .article-body .gallery-list li { overflow: hidden; }
#main-content article .article-body .gallery-list li .img { overflow: hidden; margin-bottom:15px; }
#main-content article .article-body .gallery-list li .img a { position:relative; display:block; padding-bottom:60%; }
#main-content article .article-body .gallery-list li .img img { position:absolute; left:0; top:50%; width:100%; height:auto; transform:translateY(-50%); }
#main-content article .article-body .gallery-list li .title { display:block; font-size:14px; line-height:1.35; font-weight:700;  margin-top:10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }


/* sec-main */
.sec-main { padding:36px 0;  } 
.sec-main .content { display: grid; grid-template-columns:repeat(2, 1fr); gap:36px; max-width: 1200px; margin: 0 auto; padding:0 20px; }
.sec-main .article-box { border:1px solid #cdcecf; border-radius:20px; padding:20px; overflow: hidden; background-color:#fff; }

.article-box .article-hd { display:flex; align-items:center; gap:10px; margin-bottom:35px; }
.article-box .article-hd h3 { font-size:30px; font-weight:700; }
.article-box .article-hd .more-link { font-size:30px; color:#3054db; }
.article-box .article-body { }

/* news-section */
#news-section { background-color:#f7f8fc; }
/* article notice */
.article-box.notice .notice-list { }
.article-box.notice .notice-list li { border-bottom:1px solid #d7d7d7; padding-bottom:25px; margin-bottom:25px; }
.article-box.notice .notice-list li:nth-child(n + 4) { display: none; }
.article-box.notice .notice-list li:nth-child(n + 3) { border-bottom:0; margin-bottom:0; }
.article-box.notice .notice-list li .subject { font-size:22px; color:#000000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.article-box.notice .notice-list li .subject a { color:#000000; }
.article-box.notice .notice-list li .date { font-size:16px; color:#818080; margin-top:4px; }

/* article events */
.article-box.events .gallery-list { display: grid; grid-template-columns:repeat(3, 1fr); gap:25px 20px;  }
.article-box.events .gallery-list li { overflow: hidden; }
.article-box.events .gallery-list li .img { height:106px; overflow:hidden; margin-bottom:10px; }
.article-box.events .gallery-list li .img img { width:100%; height:100%; object-fit: cover; }
.article-box.events .gallery-list li .title { font-size:14px; color:#000000; line-height:1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* info-section */
#info-section { }
/* article event-guide */
.article-box.event-guide .article-body { padding-bottom:15px; }
.article-box.event-guide .calendar-table { }
.article-box.event-guide .calendar-table table { width:100%; }
.article-box.event-guide .calendar-table th,
.article-box.event-guide .calendar-table td { font-size:16px; height:40px; background-color:#f4f4f4; text-align:center; }
.article-box.event-guide .calendar-table th { height:50px; }
.article-box.event-guide .calendar-table td { font-size:15px; }
.article-box.event-guide .calendar-table td span { display:flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50px; margin:0 auto; }
.article-box.event-guide .calendar-table td.current span { background-color:#a7183e; color:#fff; }
.article-box.event-guide .calendar-table .sun { color:#fb1f3a;  }
.article-box.event-guide .calendar-table td.blank { background-color:#fff; }

/* article edu-resources */
.article-box.edu-resources .resources-list { display: flex; justify-content: space-evenly; padding-top:40px; }
.article-box.edu-resources .resources-list li { width: 140px; font-size:23px; letter-spacing:-1px; }
.article-box.edu-resources .resources-list li a { display:block; text-align:center; background-repeat:no-repeat; background-position:center top; background-size: 135px auto ; padding-top:140px; }
.article-box.edu-resources .resources-list li.item01 a { background-image:url('../img/icons/ic_edu_resou01.png'); }
.article-box.edu-resources .resources-list li.item02 a { background-image:url('../img/icons/ic_edu_resou02.png'); }
.article-box.edu-resources .resources-list li.item03 a { background-image:url('../img/icons/ic_edu_resou03.png'); }

/* article search */
.article-box.search .ct-search {  background-repeat:no-repeat; background-position:center top; background-image:url('../img/main/ct-search-img.png'); padding-top:150px; }
.article-box.search .ct-search dt { font-size:37px; color:#060606; text-align:center; font-family:'Arial'; }
.article-box.search .ct-search dd { position:relative; margin-top:20px;  }
.article-box.search .ct-search dd .fr-input { background-color:#f5f5f5; height:85px; border-radius:85px; border:0; padding:0 40px; padding-right:90px; font-size:24px; font-weight :700; }
.article-box.search .ct-search dd .btn-search { position: absolute; right: 0; top: 0; display: block; width:85px;  height:85px; background-repeat:no-repeat; background-position: center; background-image: url('../img/common/ic_search.jpg'); font-size: 0; cursor: pointer; border:0; }

/* contents */
.contents { max-width:1612px; margin:0 auto; padding:50px 20px; }
section.sec { position:relative; margin-bottom:55px; }
section.sec .sec-hd { position:relative; display:flex; gap:10px; margin-bottom:20px; }
section.sec .sec-hd h3 { font-size:46px; font-weight:700;  }
section.sec .sec-hd .more-link { font-size:46px; font-weight:700; color:#3054db; }
section.sec .notice-list { display:grid; grid-template-columns:repeat(3, 1fr); gap:30px; }
section.sec .notice-list li { overflow:hidden; border-radius:10px; }
section.sec .notice-list li:nth-child(n + 4) { display: none; }
section.sec .notice-list li a { display:block; background-color:#f7f8fc; padding:30px; height:100%; box-sizing:border-box; }
section.sec .notice-list li span { display:block; }
section.sec .notice-list li span.date { font-size:18px; color:#888888; }
section.sec .notice-list li span.subject { font-size:30px; color:#000000; margin-top:10px; font-weight:700; }
section.sec .notice-list li span.notice-content { font-size:20px; color:#888888; margin-top:20px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }

section.sec .gallery-list { display:grid; grid-template-columns:repeat(3, 1fr); gap:30px; }
section.sec .gallery-list li { overflow:hidden; }
section.sec .gallery-list li:nth-child(n + 4) { display: none; }
section.sec .gallery-list li .img { }
section.sec .gallery-list li .img img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
section.sec .gallery-list li .title { font-size:20px; margin-top:40px; text-align:center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

#association { }
#association .sec-hd { display:block; text-align:center; margin-bottom:50px; }
#association .sec-hd .summary { display:block; font-size:24px; margin-top:25px; }

.association-overview { display:grid; grid-template-columns:repeat(4, 1fr); gap:48px; }


/* sec-aboutus */
#sec-aboutus { position:relative; background-repeat:no-repeat; background-position:center; background-size:cover; text-align:center; height:475px; overflow:hidden; }
#sec-aboutus a { display:block; width:100%; height:100%; }
#sec-aboutus img { width:100%; height:auto;  }
#sec-aboutus .ver-m { display:none; }

/* popup-box */
.popup-box { position: fixed;top: 50%; left: 50%; transform: translate(-50%, -50%); background: white; border: 1px solid #ccc; padding: 20px; z-index: 1000; min-width:280px; }
.popup-box .pop-tail { position:relative; overflow:hidden; margin-top:10px; }
.popup-box .pop-tail .today { float:left; display:inline-block; cursor:pointer; }
.popup-box .pop-tail .today input { -webkit-appearance: checkbox; vertical-align:middle; margin-right:5px; }
.popup-box .pop-tail .btn-pop-close { float:right; border:0; cursor:pointer; }


@media (max-width: 1200px) {
	#main-banner .article-box.notice { position: static; right:0; transform: none; width:100%; height:auto; padding: 30px 20px; }
	#main-banner .article-box.notice .article-hd { padding-top:0; } 
	#main-banner .article-box.notice .notice-list li:nth-child(n + 3) { border-bottom: 0; }
	
	section.sec .sec-hd { margin-bottom:15px; }
	section.sec .sec-hd h3,
	section.sec .sec-hd .more-link  { font-size:30px; }
	section.sec .notice-list { gap:20px; }
	section.sec .notice-list li a { padding:20px; }
	section.sec .notice-list li span.date { font-size:15px; }
	section.sec .notice-list li span.subject {  font-size: 24px; }
	section.sec .notice-list li span.notice-content { font-size:17px; }
	section.sec .gallery-list { gap:20px; }
	section.sec .gallery-list li .title { font-size:17px; margin-top:20px; }
	#association .sec-hd .summary { font-size:21px; }
	.association-overview { gap:20px; }
}

@media (max-width: 1000px) {
	.article-box.edu-resources .resources-list li { width:105px; font-size:17px; }
	.article-box.edu-resources .resources-list li a { background-size:100% auto; padding-top: 110px; }

	.article-box.search .ct-search dt { font-size:30px; }
	.article-box.search .ct-search dd { margin-top:40px; }
}

@media (max-width: 768px) {
	#main_banner { background-color:#000; }
	#main_banner .ver-web { display:none; }
	#main_banner .ver-m { display:block; }
	#main_banner .swiper-slide { background:transparent; }
	
	.sec-main .content { grid-template-columns: repeat(1, 1fr); }
	
	.article-box.edu-resources .resources-list li { width:140px; font-size:20px; }
	.article-box.edu-resources .resources-list li a { padding-top:150px; }
	
	.article-box.search .ct-search dt { font-size:37px; }
	.article-box.search .ct-search dd { margin-top:20px; }
	
	section.sec .notice-list { grid-template-columns: repeat(1, 1fr); }
	section.sec .notice-list li span.date { font-size:15px; }
	section.sec .notice-list li span.subject {  font-size: 24px; }
	section.sec .notice-list li span.notice-content { font-size:17px; }
	section.sec .gallery-list { grid-template-columns: repeat(2, 1fr); }
	section.sec .gallery-list li:nth-child(4) { display:block; }
	
	#association .sec-hd { margin-bottom:30px; }
	#association .sec-hd .summary { font-size:17px; margin-top:20px; }
	#association .sec-hd .summary br { display:none; }

	.association-overview { grid-template-columns: repeat(2, 1fr); gap:30px; padding:0 20px; }

	#main-content .content { display:block; /* display:flex; flex-direction: column-reverse; */ background-color: rgb(236, 240, 223);  }
	#main-content article { flex-basis:100%; background-color:#f4fefe; }
	#main-content article.events { flex-basis:100%; background-color:#d8d5fe; }
	#main-content article .article-body .notice-list li:last-child { border-bottom:0; }
	
	#sec-aboutus { height:auto; }
}

@media (max-width: 480px) {
	.sec-main { padding:20px 0; }
	.sec-main .content { gap:20px; }
	.sec-main .article-box { border-radius:10px; }
	.article-box .article-hd { margin-bottom:10px; }
	.article-box .article-hd h3 { font-size:25px; }
	
	.article-box.notice .notice-list li { padding-bottom:15px; margin-bottom:15px; }
	.article-box.notice .notice-list li .subject { font-size:15px; }
	.article-box.notice .notice-list li .date { font-size:12px; }
	.article-box.events .gallery-list { grid-template-columns: repeat(2, 1fr); gap: 20px 15px; }
	
	.article-box.edu-resources .resources-list { padding-top:20px; justify-content: space-between; }
	.article-box.edu-resources .resources-list li { width:100px; font-size:15px; }
	.article-box.edu-resources .resources-list li a { padding-top:110px; }

	.article-box.search .ct-search dt { font-size: 27px; }
	.article-box.search .ct-search dd .fr-input { height:50px; padding-right:50px; padding-left:20px; font-size:21px; }
	.article-box.search .ct-search dd .btn-search { width:50px; height:50px; }
	
	section.sec .sec-hd { margin-bottom:10px; }
	section.sec .sec-hd h3, section.sec .sec-hd .more-link { font-size:21px; }
	section.sec .notice-list { gap:10px; }
	section.sec .notice-list li a { padding:10px; }
	section.sec .notice-list li span.date { font-size:12px; }
	section.sec .notice-list li span.subject { font-size:17px; }
	section.sec .notice-list li span.notice-content { font-size:14px; margin-top: 10px; }
	section.sec .gallery-list li .title { font-size:14px; margin-top:10px; }
	#association { margin-bottom:0; }
	#association .sec-hd .summary { font-size:14px; }



	#main-content article { padding:30px 20px; }
	#main-content article .article-hd { margin-bottom:10px; }
	#main-content article .article-hd h3 { font-size:25px; }
	#main-content article .article-hd .more-link { font-size:14px; }
	#main-content article .article-body .notice-list li { padding:10px 0; display:flex; flex-direction: column-reverse;  }
	#main-content article .article-body .notice-list li .date { font-size:12px; margin:0; margin-top:4px; }
	#main-content article .article-body .notice-list li .subject { font-size:14px; }
	#main-content article .article-body .gallery-list { grid-template-columns: repeat(2, 1fr); gap: 20px 15px; }
	
	#partners { padding:0 40px; }
	#partners .swiper-button-prev, #partners .swiper-button-next { width:40px; background-size:8px auto; }
	
	#sec-aboutus .text-box dt { font-size: 30px; }
	#sec-aboutus .text-box dd { font-size:15px; }
}

@media (max-width: 375px) {
	.article-box .article-hd h3 { font-size:21px; }

	.article-box.edu-resources .resources-list li { width: 70px; font-size: 11px; }
	.article-box.edu-resources .resources-list li a { padding-top: 80px; }
	
	.article-box.event-guide .calendar-table th, .article-box.event-guide .calendar-table td { font-size:15px; }
	.article-box.event-guide .calendar-table td { font-size:13px; }
	.article-box.event-guide .calendar-table td span { width:24px; height:24px; }
	
	.article-box.search .ct-search dt { font-size: 20px; }

	#sec-aboutus .text-box dt { font-size:20px; }
	#sec-aboutus .text-box dd { font-size:11px; margin-top: 10px; }
}

@media (max-width: 320px) {
	#main-content article { padding:30px 15px; }
}