@charset "utf-8";
@font-face {
	font-family:'One Mobile';
	src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/ONE-Mobile-Regular.woff') format('woff');
	font-weight: normal;
	font-display: swap;
}

.slick-slide {height:auto !important;}

#main {overflow:hidden; position:relative;}
/* main-visual */
.main-visual {position:relative; padding-top:100px; border-radius:10px;}
.main-visual .item {height:calc(100vh - 100px); position:relative; border-radius:20px; overflow:hidden;}
.main-visual .secting-img {position:relative; width:100%; height:100vh; background-size:cover; background-position:center center; background-repeat:no-repeat;}
.main-visual .secting-img01 {background-image:url('../img/main/main-visual01.jpg');}
.main-visual .secting-img02 {background-image:url('../img/main/main-visual02.jpg');}
.main-visual .secting-img03 {background-image:url('../img/main/main-visual03.jpg');}
.main-visual .txt-box {position:absolute; top:0; left:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; text-align:center;}
.main-visual .txt-box h2 {font-size:70px; color:#fff; font-family:'One Mobile'; font-weight:400; line-height:1.4em;}
.main-visual .txt-box h2 strong {display:block;}
.main-visual .paging {position:absolute; bottom:105px; left:0; width:100%;}
.main-visual .paging ul {display:flex; justify-content:center;}
.main-visual .paging ul li {margin:0 10px; position:relative;}
.main-visual .paging ul li:before,
.main-visual .paging ul li:after {content:''; height:4px; position:absolute; bottom:-20px; left:0;}
.main-visual .paging ul li:before {background:rgba(255,255,255,0.3); width:100%;}
.main-visual .paging ul li:after {background:#fff; width:0;}
.main-visual .paging ul li.slick-active:after {transition:all 4.5s; width:100%;}
.main-visual .paging ul li button {display:block; width:150px; font-size:16px; line-height:1.25em; color:rgba(255,255,255,0.6); transition:all 0.4s; border:0; background:transparent;}
.main-visual .paging ul li.slick-active button {color:#fff;}
.main-visual .scrolldown {position:absolute; right:80px; bottom:80px; padding-bottom:60px; z-index:10;}
.main-visual .scrolldown span {animation:scrollDown 1.2s linear infinite both; width:14px; height:14px; border-radius:7px; background:linear-gradient(180deg, rgba(217, 217, 217, 0.1) 0%, #FFF 100%); position:absolute; top:76px; left:50%; margin-left:-7px;}
.main-visual .scrolldown span:after {content:''; width:14px; height:14px; background:#fff; border-radius:50%; position:absolute; left:0; bottom:0; z-index:1;}
@keyframes scrollDown {0%{height:14px;} 100%{height:44px;}}
/* section01 */
.section01 {padding:90px 0 160px;}
.section01 .col {display:flex; align-items:center;}
.section01 .img-box {width:1%; flex:1 1 auto;}
.section01 .img-box img {border-radius:20px; overflow:hidden;}
.section01 .txt-box {width:100%; max-width:419px;}
.section01 .txt-box p {font-size:25px; line-height:1.7em; color:#666;}
.section01 .txt-box p strong {font-weight:600; color:#102c65;}
/* sec-tit */
.sec-tit {margin-bottom:50px;}
.sec-tit h3 {font-size:50px; font-weight:600; color:#000; line-height:1.48em;}
/* section02 */
.section02 {margin-bottom:160px;}
.section02 .tab-menu {margin-bottom:36px;}
.section02 .tab-menu ul {display:flex; margin:0 -4px;}
.section02 .tab-menu ul li {padding:0 4px;}
.section02 .tab-menu ul li a {padding:0 20px; line-height:42px; border:1px solid #888; border-radius:24px; font-size:18px; font-weight:500; color:#333; background:#fff; transition:all 0.4s;}
.section02 .tab-menu ul li a:hover {color:#fff; background:#102C65; border-color:#102C65;}
.section02 .tab-menu ul li.active a {color:#fff; background:#102C65; border-color:#102C65;}
.section02 .tab-menu ul li a.all:before {content:''; width:18px; height:18px; margin-right:10px; margin-top:-2px; background-image:url('../img/main/sec02-all-on.png'); transition:all 0.4s; background-repeat:no-repeat; background-size:cover; background-position:center center; display:inline-block; vertical-align:middle;}
.section02 .tab-menu ul li.active a.all:before,
.section02 .tab-menu ul li a.all:hover:before {background-image:url('../img/main/sec02-all.png');}
.section02 .col {display:flex; margin:0 -40px;}
.section02 .col > div {padding:0 40px;}
.section02 .news-box {width:1%; flex:1 1 auto; border-right:1px solid #ddd;}
.section02 .news-box .box {display:flex; flex-wrap:wrap; margin:0 -5px -10px;}
.section02 .news-box .row {width:50%; padding:0 5px; margin-bottom:10px;}
.section02 .news-box .inner {padding:40px; background:#EEF3F8; transition:all 0.4s; border-radius:20px;}
.section02 .news-box .inner:hover {background:#102C65;}
.section02 .news-box .inner span {display:inline-block; padding:0 18px; line-height:38px; border:1px solid #102C65; border-radius:20px; font-size:18px; color:#102C65; transition:all 0.4s; margin-bottom:16px; font-weight:500;}
.section02 .news-box .inner:hover span {color:#fff; border-color:#fff; background:#102c65;}
.section02 .news-box .inner h4 {font-size:24px; margin-bottom:22px; font-weight:500; color:#000; line-height:1.5em; height:calc(1.5em * 1 * 2); overflow:hidden; text-overflow:ellipsis; word-break:break-all; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; transition:all 0.4s;}
.section02 .news-box .inner:hover h4 {color:#fff;}
.section02 .news-box .inner .date {text-align:right; transition:all 0.4s;}
.section02 .news-box .inner:hover .date {opacity:0.6;}
.section02 .news-box .inner .date p {font-size:19px; line-height:1.8em; color:#102C65; position:relative; padding-left:22px; transition:all 0.4s; display:inline-block;}
.section02 .news-box .inner:hover .date p {color:#fff;}
.section02 .news-box .inner .date p:before {content:''; width:14px; height:14px; background-image:url('../img/main/sec02-date.png'); background-repeat:no-repeat; background-size:cover; position:absolute; top:50%; margin-top:-7px; left:0; transition:all 0.4s;}
.section02 .news-box .inner:hover .date p:before {background-image:url('../img/main/sec02-date-on.png');}
.section02 .system-box {width:100%; max-width:640px; height:810px;}
.section02 .system-box .inner {background:#F8F8F8; border-radius:20px; height:100%; padding:70px 60px; text-align:center; display:flex; flex-direction:column; justify-content:space-between; background:url('../img/main/system-bg.jpg') center center no-repeat; background-size:cover;}
.section02 .system-box .inner h4 {font-size:40px; font-weight:600; line-height:1.35em; color:#333; margin-bottom:24px;}
.section02 .system-box .inner p {font-size:20px; line-height:1.6em; color:#666;}
.section02 .system-box .inner ul {display:flex; justify-content:space-between; margin-bottom:20px;}
.section02 .system-box .inner ul li a {padding:0 32px; line-height:60px; text-align:center; font-size:16px; color:#fff; background:#0068B7; border-radius:30px; font-weight:600;}
.section02 .system-box .inner .tag > a {font-size:20px; font-weight:600; color:#fff; width:100%; line-height:68px; border-radius:34px; background:#102C65; color:#fff;}
/* section03 */
.section03 {margin-bottom:164px;}
.section03 .col {display:flex; margin:0 -20px;}
.section03 .col .row {width:33.333333%; padding:0 20px;}
.section03 .inner {background:#F8F8F8; border-radius:20px; overflow:hidden; transition:all 0.4s;}
.section03 .inner:hover {background:#102c65;}
.section03 .inner .img-box .pic {position:relative; height:0; padding-bottom:67.86%; overflow:hidden; transition:all 0.6s; border-radius:20px;}
.section03 .inner .img-box .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.section03 .inner .txt-box {padding:40px;}
.section03 .inner .txt-box h4 {font-size:24px; margin-bottom:28px; font-weight:500; line-height:1.5em; color:#000; height:calc(1.5em * 1 * 2); overflow:hidden; text-overflow:ellipsis; word-break:break-all; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; transition:all 0.4s;}
.section03 .inner:hover .txt-box h4 {color:#fff;}
.section03 .inner .txt-box .date {text-align:right;}
.section03 .inner .txt-box .date p {display:inline-block; font-size:19px; line-height:1.8em; color:#333; transition:all 0.4s;}
.section03 .inner:hover .txt-box .date p {color:rgba(255,255,255,0.6);}
.section03 .progress-wrap {display:flex; margin-top:40px;}
.section03 .progress-wrap .progress-item {flex:1; height:4px; background:#E8E8E8; overflow:hidden; position:relative;}
.section03 .progress-wrap .progress-bar {width:0%; height: 100%; background:#102C65; position:absolute; z-index: 1; left:0; top:0;}
/* section04 */
.section04 {margin-bottom:160px;}
.section04 .tab-menu {margin-bottom:40px;}
.section04 .tabs {display:flex; margin:0 -26px;}
.section04 .tabs li {padding:0 26px; position:relative;}
.section04 .tabs li:after {content:''; width:4px; height:36px; position:absolute; top:50%; margin-top:-18px; right:-2px; background:#888;}
.section04 .tabs li:last-child:after {display:none;}
.section04 .tabs li a {font-size:50px; line-height:1.5em; color:#666; transition:color 0.4s;}
.section04 .tabs li a.active {font-weight:600; line-height:1.5em; color:#000;}
.section04 .tab-content {display: none;}
.section04 .tab-content.active {display: block;}
.section04 .items {position: relative; margin:0 -20px;}
.section04 .items .item {padding:0 20px;}
.section04 .inner .img-box {border-radius:20px; border:1px solid #ddd; overflow:hidden; margin-bottom:30px;}
.section04 .inner .img-box .pic {position:relative; height:0; padding-bottom:141.46%; overflow:hidden; transition:all 0.4s;}
.section04 .inner .img-box .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.section04 .inner .txt-box {padding:0 10px; display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:-10px; flex-wrap:wrap;}
.section04 .inner .txt-box h4 {font-size:28px; font-weight:600; line-height:1.5em; color:#000; margin-bottom:10px; transition:all 0.4s;}
.section04 .inner:hover .txt-box h4 {color:#102C65;}
.section04 .inner .txt-box p {font-size:19px; line-height:1.9em; color:#333; position:relative; padding-left:22px;}
.section04 .inner .txt-box p:before {content:''; width:14px; height:14px; background:url('../img/main/sec04-date.png') no-repeat; background-size:cover; position:absolute; top:50%; margin-top:-7px; left:0;}
.section04 .progress-wrap {display:flex; margin-top:60px;}
.section04 .progress-wrap .progress-item {flex:1; height:4px; background:#E8E8E8; overflow:hidden; position:relative;}
.section04 .progress-wrap .progress-bar {width:0%; height: 100%; background:#102C65; position:absolute; z-index: 1; left:0; top:0;}
.section04 .progress-wrap .progress-item.active .progress-bar {width: 100%;}
/* section05 */
.section05 {margin-bottom:180px;}
.section05 .col {display:flex; margin:0 -20px;}
.section05 .col .row {width:33.33333%; padding:0 20px; position:relative;}
.section05 .col .row:after {content:''; width:1px; height:450px; background:#ddd; position:absolute; bottom:0; right:0;}
.section05 .col .row:last-child:after {display:none;}
.section05 .tit-box {margin-bottom:10px;}
.section05 .tit-box ul {display:flex; margin:0 -5px;}
.section05 .tit-box ul li {width:100%; padding:0 5px;}
.section05 .tit-box ul li a {background:#F8F8F8; border-radius:20px; padding:28px 40px; position:relative; transition:all 0.4s; font-size:26px; font-weight:600; line-height:1.7em; color:#333;}
.section05 .tit-box ul li a:after {content:''; width:16px; height:16px; background:url('../img/main/sec05-more.png') no-repeat; background-size:cover; position:absolute; top:50%; margin-top:-8px; right:40px; transition:all 0.4s;}
.section05 .tit-box ul li a:hover:after {transform:rotate(45deg);}
.section05 .txt-box {height:340px; background:#EEF3F8; border-radius:20px; padding:28px 40px 38px; display:flex; flex-direction:column; justify-content:space-between;}
.section05 .txt-box .tit p {font-size:26px; font-weight:600; line-height:1.7em; color:#333; position:relative; }
.section05 .txt-box .tit p:after {content:''; width:16px; height:16px; background:url('../img/main/sec05-more.png') no-repeat; background-size:cover; position:absolute; top:50%; margin-top:-8px; right:0; transition:all 0.4s;}
.section05 .txt-box:hover .tit p:after {transform:rotate(45deg);}
.section05 .txt-box .txt {display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:10px;}
.section05 .txt-box .txt p {font-size:22px; font-weight:500; line-height:1.5em; color:#666;}
.section05 .txt-box .txt ul {display:flex; margin:0 -30px;}
.section05 .txt-box .txt ul li {padding:0 30px; position:relative; font-size:60px; font-weight:600; line-height:1.2em; color:#102c65; text-align:center;}
.section05 .txt-box .txt ul li:after {content:''; width:1px; height:30px; background:#ddd; position:absolute; bottom:18px; right:0;}
.section05 .txt-box .txt ul li:last-child:after {display:none;}
.section05 .txt-box .txt ul li span {display:block; font-size:18px; font-weight:500; line-height:1.8em;}
/* section06 */
.section06 {padding:60px 0; border-top:1px solid #ddd;}
.section06 .col {display:flex; align-items:center;}
.section06 .tit-box {width:100%; max-width:270px;}
.section06 .tit-box h3 {font-size:24px; font-weight:600; line-height:1.7em; color:#000; margin-bottom:12px;}
.section06 .tit-box .btns {display:flex;}
.section06 .tit-box .arrows {display:flex;}
.section06 .tit-box .slick-arrow {width:40px; height:40px; border-radius:50%; border:1px solid #ddd; margin-right:8px; background-color:#fff; font-size:0; transition:all 0.4s; background-position:center center; background-repeat:no-repeat;}
.section06 .tit-box .slick-prev {background-image:url('../img/main/sec06-prev.png');} 
.section06 .tit-box .slick-next {background-image:url('../img/main/sec06-next.png');}
.section06 .tit-box .bt {width:40px; height:40px; border-radius:50%; background:#F8F8F8; position:relative;}
.section06 .tit-box .btnw {width:14px; height:14px; background-repeat:no-repeat; background-size:cover; background-position:center center; cursor:pointer; z-index:10; position:absolute; top:50%; left:50%; margin-top:-7px; margin-left:-7px;}
.section06 .tit-box .btnw.bt-pause {background-image:url('../img/main/sec06-pause.png');}
.section06 .tit-box .btnw.bt-play {background-image:url('../img/main/sec06-play.png');}
.section06 .tit-box .btnw.bt-play {display:none;}
.section06 .txt-box {width:1%; flex:1 1 auto;}
.section06 .txt-box .items {margin:0 -5px;}
.section06 .txt-box .item {padding:0 5px;}
.section06 .txt-box .item .img {border:1px solid #ddd; border-radius:10px; display:flex; align-items:center; justify-content:center; text-align:center; height:90px; overflow:hidden;}
.section06 .txt-box .item .img img {width:100%;}


.quick {position:fixed; top:50%; transform:translateY(-50%); right:80px;}
.quick li {padding-bottom:24px; position:relative;}
.quick li:last-child {padding-bottom:0;}
.quick li:after {content:''; width:1px; height:calc(100% - 5px); background:#ddd; position:absolute; top:5px; left:50%; z-index:-1;}
.quick li:last-cjild:after {display:none;}
.quick li a {width:10px; height:18px; background:url('../img/main/quick.png') no-repeat; transition:all 0.4s;}
.quick li.active a {background:url('../img/main/quick-on.png') no-repeat;}