@charset "utf-8";

h4.title {font-family:var(--gm);font-weight:400;font-size:30px;line-height:1.3;letter-spacing:-.01em;color:#111;}

/* 메인 첫번째 섹션 */
.main-sec1 {padding:61px 0 55px;}
.main-sec1 .inner {display:flex;justify-content:space-between;}
.main-sec1 .left {width:47.73%;}
.main-sec1 .right {width:50%;}

.visual-box {display: grid;grid-template-columns:1fr .9047fr 1fr 1fr;gap:20px;font-family:var(--sc);font-weight:500;line-height:1.3;}
.visual-box a:hover {font-weight:700;}
.visual-box .box-item {position:relative;height:168px;border-radius:20px;box-shadow:0 10px 25px -2px rgba(35, 48, 59, 0.05);transition:box-shadow .3s;}
.visual-box .box-item:hover {box-shadow:0 10px 25px rgba(0, 112, 189, .1);}
.visual-box .box1 {grid-column:span 2;padding:30px 34px;font-size:24px;}
.visual-box .box2 {grid-column:span 1;padding:27px 20px;font-size:19px;}
.visual-box .link1 {color:#12AEBD;background:url("/assets/img/bg_box1.jpg") no-repeat 100% 100%/cover;}
.visual-box .link2 {color:#9F664E;background:url("/assets/img/bg_box2.jpg") no-repeat 100% 100%/cover;}
.visual-box .link3 {color:#155DAA;background:url("/assets/img/bg_box3.jpg") no-repeat 100% 100%/cover;}
.visual-box .link4 {color:#FFF;padding-top:48px;background:url("/assets/img/bg_box4.jpg") no-repeat 100% 100%/cover;}
.visual-box .link5 {color:#1A97B4;background:url("/assets/img/bg_box5.jpg") no-repeat 100% 100%/cover;}
.visual-box .link6 {color:#454086;background:url("/assets/img/bg_box6.jpg") no-repeat 100% 100%/cover;}
.visual-box .link7 {color:#1A5948;background:url("/assets/img/bg_box7.jpg") no-repeat 100% 100%/cover;}
.visual-box .box-wrap {grid-column:span 3;display:flex;justify-content:center;align-items:center;gap:40px;background:url("/assets/img/bg_box8.jpg") no-repeat center/cover;box-shadow:0 10px 25px -2px rgba(35, 48, 59, 0.1);}
.visual-box .box-wrap li a {display:flex;flex-direction:column;align-items:center;text-align:center;}
.visual-box .box-wrap li a i {display:flex;justify-content:center;align-items:center;width:80px;height:80px;background:linear-gradient(270deg, rgba(255, 255, 255, 0.12) -26.79%, rgba(255, 255, 255, 0.40) -6.82%, rgba(255, 255, 255, 0.37) 49.88%, rgba(255, 255, 255, 0.20) 123.81%);
background-blend-mode:overlay;border:1px solid rgba(255,255,255,.8);border-radius:20px;margin:0 0 10px;transition:.3s;}
.visual-box .box-wrap li a i::before {content:"";display:inline-flex;width:40px;height:40px;background:url("/assets/img/main_quick01.svg") no-repeat center;}
.visual-box .box-wrap li.layer a i::before {background-image:url("/assets/img/main_quick02.svg");}
.visual-box .box-wrap li.youtube a i::before {background-image:url("/assets/img/main_quick03.svg");}
.visual-box .box-wrap li.instagram a i::before {background-image:url("/assets/img/main_quick04.svg");}
.visual-box .box-wrap li a:hover i {background:rgba(255,255,255,.95);}
.visual-box .box-wrap li span {display:flex;font-size:15px;}

.visual-slider {position:relative;width:100%;height:100%;border-radius:20px;overflow:hidden;box-shadow:0 10px 25px -2px rgba(35, 48, 59, 0.1);}
.visual-slider .swiper-slide a {position:relative;display:block;width:100%;height:100%;background:#fafafa;}
.visual-slider .swiper-slide a::after {content: "";display: block;padding-bottom: 56.25%;}
.visual-slider .swiper-slide img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;border-radius:20px;}
.visual-slider .visual-indicator {position:absolute;bottom:35px;left:0;width:100%;z-index:1;display:flex;justify-content:center;align-items:center;transition:.3s;}
.visual-pagination-fraction {display:none;background-color: rgba(0, 0, 0, .6);padding: 3px 10px;width: 50px;border-radius: 30px;color: rgba(255, 255, 255, .6);text-align: center;margin-right: 18px;}
.visual-pagination-fraction .current {color: #fff;font-weight: 600;}
.visual-btn {display: flex;justify-content: center;align-items: center;width: 24px;height: 24px;border: 1px solid #e5e5ec;background-color: #fff;border-radius: 50%;}
.visual-btn i {font-size: 12px;color: #111;}
.visual-pagination {width: auto !important;margin:0 8px;}
.visual-pagination .swiper-pagination-bullet {width:10px;height:10px;opacity:.2;background:#000;}
.visual-pagination .swiper-pagination-bullet-active {opacity:1;background:#111;}


/* 메인 두번째 섹션 */
.main-sec2 {background:url("/assets/img/bg_main_symbol.png") no-repeat calc(100% - 64px) 216px/200px auto;}

.main-menu {padding:52px 0 50px;background:#EAF8FA;}
.main-menu .inner {display:flex;justify-content:space-between;}
.main-menu .left {display:flex;flex-direction:column;justify-content:center;gap:4px;font-family:var(--sc);line-height:1.3;white-space:nowrap;}
.main-menu .left .tit {font-weight:500;font-size:16px;color:#666;}
.main-menu .left .num {font-weight:800;font-size:45px;color:#00B3C4;}
.main-menu .left .etc {display:flex;width:100%;font-weight:300;font-size:12px;color:#666;}
.main-menu .left .etc span {display:inline-flex;align-items:center;}
.main-menu .left .etc span + span::before {content:"";display:inline-flex;width:1px;height:12px;background:#D3E1E8;margin:0 10px 1px 12px;}
.main-menu .right {width:52.68%;}
.main-menu .menu-wrap {display:flex;padding:0 24px;width:100%;}
.main-menu .menu-wrap li {width:25%;}
.main-menu .menu-wrap li a {display:flex;flex-direction:column;align-items:center;font-family:var(--sc);font-weight:500;font-size:17px;line-height:1.3;color:#555;letter-spacing:-.02em;}
.main-menu .menu-wrap li a:hover {color:#000;}
.main-menu .menu-wrap li a i {display:flex;justify-content:center;align-items:center;width:80px;height:80px;background:rgba(255,255,255,.5);background-blend-mode:overlay;border:2px solid #FBFEFF;border-radius:20px;margin:0 0 12px;transition:.3s;}
.main-menu .menu-wrap li a:hover i {background:linear-gradient(141deg, #FFF 50%, rgba(153,153,153,0.01) 91.1%);background-blend-mode:overlay;box-shadow:0 4px 10px 0 #C7DDE9;}
.main-menu .menu-wrap li a i::before {content:"";display:inline-flex;width:40px;height:40px;background:url("/assets/img/icon_quick01.svg") no-repeat center;}
.main-menu .menu-wrap li a:hover i::before {background-image:url("/assets/img/icon_quick01_on.svg");}
.main-menu .menu-wrap li.docu a i::before {background-image:url("/assets/img/icon_quick02.svg");}
.main-menu .menu-wrap li.docu a:hover i::before {background-image:url("/assets/img/icon_quick02_on.svg");}
.main-menu .menu-wrap li.time a i::before {background-image:url("/assets/img/icon_quick03.svg");}
.main-menu .menu-wrap li.time a:hover i::before {background-image:url("/assets/img/icon_quick03_on.svg");}
.main-menu .menu-wrap li.man a i::before {background-image:url("/assets/img/icon_quick04.svg");}
.main-menu .menu-wrap li.man a:hover i::before {background-image:url("/assets/img/icon_quick04_on.svg");}
.main-menu .menu-wrap li.date a i::before {background-image:url("/assets/img/icon_quick05.svg");}
.main-menu .menu-wrap li.date a:hover i::before {background-image:url("/assets/img/icon_quick05_on.svg");}

.board-info-wrap {display:flex;justify-content:space-between;padding:120px 0 100px;}

.popupzone-box {position:relative;width:48%;overflow:hidden;}
.popupzone-box .pop-slider {overflow:visible;margin:21px 0 0;}
.popupzone-box .pop-slider .swiper-wrapper,
.popupzone-box .pop-slider .swiper-slide {height:auto;}
.popupzone-box .pop-slider .swiper-slide a {position:relative;display:block;width:100%;}
.popupzone-box .pop-slider .swiper-slide a img {display:block;width:100%;height:auto;border-radius:20px;}
.popupzone-box .pop-slider .slider-indicator {position:absolute;top:-39px;right:0;z-index:1;display:flex;justify-content:center;align-items:center;gap:6px;}
.popupzone-box .pop-slider .pop-pagination-fraction {width:25px;text-align:center;font-weight:600;font-size:13px;color:#111;}
.popupzone-box .pop-slider .pop-pagination-fraction .back {font-weight:400;color:#999;}
.popupzone-box .pop-slider .btn-prev {width:18px;height:18px;font-size:1px;color:transparent;background:url("/assets/img/arrow_left.svg") no-repeat center;overflow:hidden;}
.popupzone-box .pop-slider .btn-next {width:18px;height:18px;font-size:1px;color:transparent;background:url("/assets/img/arrow_right.svg") no-repeat center;overflow:hidden;}

.main-board {width:47.73%;max-width: 1000px;}
.main-board-top {display:flex;gap:56px;}
.main-board-top .tab-menu-list {display: flex;width:calc(100% - 100px);}
.main-board-top .tab-menu-list .bbs_list + .bbs_list::before {content:"";display:inline-flex;height:18px;border-left:1px dotted #ddd;margin:0 12px;}
.main-board-top .tab-menu-list #bbs_more {margin-left:auto;}
.main-board-top .tab-menu-list #bbs_more a {display:inline-flex;padding:2px 12px 0;line-height:30px;font-weight:500;font-size:0.95em;color:#fff;background:#444;border-radius:10px;}
.main-board-top .tab-menu-list > li {display:flex;align-items:center;}
.main-board-top .tab-menu-list > li > a {display: block;font-family:var(--gm);font-weight:300;font-size:23px;letter-spacing: -.01em;line-height:1.3;position: relative;}
.main-board-top .tab-menu-list > li:hover > a {color:#2E6ADF;}
.main-board-top .tab-menu-list > li.active > a {font-weight:400;color:#2E6ADF;}
.main-board-bottom {margin-top:22px;}
.main-board-bottom .tab-content:not(.active) {display: none;}
.board-list {position:relative;display:flex;flex-direction:column;padding:29px 40px;background:#fff;border:1px solid #eee;border-radius:0 0 20px 20px;}
.board-list::before {content:"";position:absolute;left:0;top:0;width:100%;height:1px;background:#111;}
.board-list li + li {border-top:1px dotted #ddd;}
.board-list li.list-item a {display:flex;padding:12px 0;font-size:17px;color:#fff;line-height:33px;}
.board-list li.list-item .cate {display:inline-flex;padding:0 13px;background:#00B3C4;border-radius:30px;margin-right:15px;}
.board-list li.list-item .cate.orange {background:#FF904A;}
.board-list li.list-item .cate.purple {background:#535DEE;}
.board-list li.list-item .tit {font-size:17px;color:#111;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;max-width: 80%;}
.board-list li.list-item .date {margin-left:auto;font-size:15px;color:#999;}
.board-list li.list-item a:hover .tit {text-decoration: underline;text-underline-offset: 2px;transition: .3s;}

.main-info {width:40%;display: flex;flex-direction: column;justify-content: center;}
.main-info .info-box {padding: 20px 0;display: flex;gap: 30px;align-items: center;}
.main-info .info-box:first-of-type {border-bottom: 1px dotted #ccc;}
.main-info .info-box .left {width: 120px;height: 120px;border-radius: 10px;background-color: #F5FAFF;display: flex;flex-direction: column;justify-content: center;}
.main-info .info-box .left img {margin: 0 auto;}
.main-info .info-box .left p {margin-top: 5px;font-family: var(--sc);font-weight: 500;color: #333;text-align: center;line-height: 1.2;}
.main-info .info-box .right .info-list li {font-size: 17px;}
.main-info .info-box:first-of-type .right .info-list li {display: flex;gap: 30px;align-items: center;}
.main-info .info-box .right .info-list p {width: 53px;text-align: justify;font-weight: 600;color: #00a2e4;line-height: 0;}
.main-info .info-box .right .info-list p::before {content: "";display: inline-block;width: 100%;}
.main-info .info-box .right .info-list p::after {content: "";display: inline-block;width: 100%;}
.main-info .info-box .right .info-list .phone {font-size: 25px;font-weight: 900;color: #1871B3;}



/* 메인 세번째 섹션 */
.main-sec3 {padding:110px 0 80px;background:url("/assets/img/bg_sns_sec.jpg") no-repeat center/cover;overflow:hidden;}
.main-sec3 .inner {overflow:hidden;}
.main-sns-top {display:flex;gap:86px;}
.main-sns-top .tab-menu-list {display:flex;}
.main-sns-top .tab-menu-list > li {display:inline-flex;align-items:center;}
.main-sns-top .tab-menu-list > li + li::before {content:"";display:inline-flex;height:18px;border-right:1px dotted #bbb;}
.main-sns-top .tab-menu-list > li > a {display:inline-flex;padding:0 12px;font-weight:300;font-size:23px;color:#666;transition:.3s;}
.main-sns-top .tab-menu-list > li:hover > a span {background-size:100% 8px;}
.main-sns-top .tab-menu-list > li > a span {line-height:1;background:linear-gradient(#8BE5CA, #8BE5CA) no-repeat 0 80%/0 8px;transition:.3s;}
.main-sns-top .tab-menu-list > li.active > a {font-weight:400;color:#4C5A5C;}
.main-sns-top .tab-menu-list > li.active > a span {background-size:100% 8px;}
.main-sns-bottom {position:relative;z-index: 1;}
.main-sns-bottom .tab-content:not(.active) {display: none;}
.main-sns-bottom .swiper {position:static;padding:52px 0;overflow:visible;}
.main-sns-bottom .swiper .swiper-wrapper {height:auto;}
.main-sns-bottom .swiper-slide {height:auto;border:3px solid rgba(255,255,255,.1);border-radius:20px;overflow:hidden;box-shadow: 0 10px 20px 0 #B1CBCB;}
.main-sns-bottom .swiper-slide a {position:relative;display:block;padding:0 0 100%;background:#000;}
.main-sns-bottom .swiper-slide img {position:absolute;left:0;top:50%;transform:translateY(-50%);display:block;max-width:calc(100% + 1px);transition:.3s;}
.main-sns-bottom .swiper-slide a:hover img {transform:translateY(-50%) scale(1.15);}
.main-sns-bottom .swiper .slider-indicator {position:absolute;right:0;top:0;display:flex;}
.main-sns-bottom .swiper .slider-indicator .swiper-pagination {position:relative;bottom:auto;left:auto;top:auto;display:inline-flex;align-items:center;padding:0 8px;width:auto;}
.main-sns-bottom .swiper .slider-indicator .swiper-pagination .swiper-pagination-bullet {background:#000;opacity:.2;}
.main-sns-bottom .swiper .slider-indicator .swiper-pagination .swiper-pagination-bullet-active {background:#111;opacity:1;}
.main-sns-bottom .slider-indicator button {width:24px;height:24px;font-size:1px;color:transparent;border:1px solid #E5E5EC;border-radius:50%;overflow:hidden;}
.main-sns-bottom .slider-indicator .btn-prev {background:#fff url("/assets/img/arrow_left.png") no-repeat center/12px auto;}
.main-sns-bottom .slider-indicator .btn-next {background:#fff url("/assets/img/arrow_right.png") no-repeat center/12px auto;}

.main-sec4 {overflow:hidden;}
/*.bt-banner-slider .swiper-wrapper {transition-timing-function:linear !important;}*/
.bt-banner-slider {display:flex;}
.bt-banner-slider ul {display:flex;}
.bt-banner-slider li {width:120px;margin-right:130px;}
.bt-banner-slider a,
.bt-banner-slider img {display:inline-flex;vertical-align:top;}
.bt-banner-slider ul.original {
	animation: rollingTop1 60s linear infinite;
}
.bt-banner-slider ul.clone {
	animation: rollingTop2 60s linear infinite;
}
@keyframes rollingTop1 {
	0% { transform: translateX(0); }
	50% { transform: translateX(-100%); }
	50.01% { transform: translateX(100%); }
	100% { transform: translateX(0); }
}
@keyframes rollingTop2 {
	0% { transition: translateX(0); }
	100% { transform: translateX(-200%); }
}
/* hover시 일시정지 */
.bt-banner-slider:hover ul {
	animation-play-state: paused; 
}

@media screen and (max-width: 1480px) {
    .bt-banner-slider li {margin-right:80px;}
}

@media screen and (max-width: 767px) {
    .bt-banner-slider li {margin-right:30px;}
}


.bt-banner-slider .swiper-slide {display:inline-flex;min-width:100px;width:auto;vertical-align:top;}
.bt-banner-slider .swiper-slide a {display:inline-flex;vertical-align:top;}
.bt-banner-slider .swiper-slide a img {vertical-align:top;}

/* 반응형 */
@media screen and (max-width: 1400px) {
	.visual-box .box-wrap {gap:25px;}
	.visual-slider .visual-indicator {bottom:30px;}
	.main-menu .right {width:70%;}
}
@media screen and (max-width: 1200px) {
	.main-sec1 {padding:40px 0;}
    .main-sec1 .inner {flex-direction: column;gap:20px;}
    .main-sec1 .inner > section {width: 100%;}
	.visual-slider,
	.visual-slider .swiper-wrapper,
	.visual-slider .swiper-slide,
	.visual-slider .swiper-slide a,
	.visual-slider .swiper-slide img {height:auto;}
	.visual-slider .swiper-slide a::after {content:none;}
	.visual-slider .swiper-slide img {position:static;vertical-align:top;}
	
	.main-sec2 {background:none;}
    .board-info-wrap {flex-direction:column;gap:30px;padding:60px 0;}
	.popupzone-box,
    .main-board {width: 100%;}
	.main-board-bottom {margin-top:15px;}
	.board-list {padding:20px 30px;}
    .main-sec3 {padding: 60px 0 80px;}
}
@media screen and (max-width: 1140px) {
	.visual-box .box1 {padding:25px;font-size:20px;}
	.visual-box .box2 {padding:20px 15px;font-size:18px;}
	.visual-box .box-wrap li span {font-size:14px;}
	.main-menu .inner {flex-direction:column;gap:30px;}
	.main-menu .left .num {font-size:40px;}
	.main-menu .right {width:100%;}
	.main-menu .menu-wrap {padding:0;gap:14px;}
	.main-menu .menu-wrap li {width:calc((100% - 56px)/4);}
	.main-menu .menu-wrap li a {text-align:center;font-size:15px;}
	.popupzone-box .pop-slider .swiper-slide a img {border-radius:15px;}
}
@media screen and (max-width: 1000px) {
    .board-list li.first {padding: 30px 50px 30px 70px;}
    .board-list li.first .tit {font-size: 24px;}
    .board-list li.first .txt {font-size: 16px;margin-top: 12px;}
    .board-list li.first a {margin-top: 24px;}
    .board-list li.list-item .tit {font-size: 16px;}

    .main-info .info-box {gap: 20px;}
    .main-info .info-box .right .info-list li {font-size: 16px;}
    .main-info .info-box .right .info-list .phone {font-size: 20px;}

    .main-sns-top .tab-menu-list > li > a > img {height: 24px;}
    .main-sns-bottom .thumb-group {grid-template-columns: repeat(3, 1fr);grid-template-rows: auto;}
    .main-sns-bottom .video-group {grid-template-columns: repeat(2, 1fr);grid-template-rows: auto;}
}
@media screen and (max-width: 800px) {
	.visual-box {gap:15px;}
    .main-board-top .title {font-size: 28px;}
    .main-board-top .tab-menu-list > li > a {font-size: 16px;}
	.main-board-bottom {margin-top:5px;}
    .board-list {grid-template-columns: 40% 60%;}
    h4.title {font-size:28px;}
}
@media screen and (max-width: 767px) {
	.main-sns-top {gap:30px;}
	.main-sns-bottom .swiper {padding:20px 0 30px;}
	.main-sns-bottom .swiper-slide {border-radius:15px;}
	.main-sns-bottom .swiper .slider-indicator {top:auto;bottom:0;justify-content:center;width:100%;}
}
@media screen and (max-width: 700px) {
	.main-board-top {flex-wrap:wrap;gap:12px;}
	.main-board-top .tab-menu-list {width:100%;}
    .board-list {grid-template-columns: 100%;}
    .board-list li.first {border-bottom: 1px solid #ddd;border-right: 0;}
    .board-list li.first a {margin-top: 12px;}
    .board-list li.first .tit {font-size: 20px;}
    .board-list li.first .txt {margin-top: 8px;}
    .main-info .info-box {width: 100%;gap: 16px;}
    .main-info .info-box .left {width: 50%;}
    .main-info .info-box .left p {font-size: 15px;}
    .main-info .info-box:first-of-type .right .info-list li {gap: 12px;}
    .main-info .info-box .right .info-list p {width: 48px;}
}
@media screen and (max-width: 600px) {
    .visual-box {grid-template-columns: repeat(3, 1fr);grid-template-rows: repeat(4, 1fr);}
	.main-menu .menu-wrap {flex-wrap:wrap;}
}
@media screen and (max-width: 500px) {
    .main-sec1 {padding:30px 0;}
    .main-sec1 .inner {gap: 12px;}
    .visual-box {gap:8px;}
    .visual-box .box-item {height:135px;font-size:16px;border-radius:16px;}
	.visual-slider,
	.visual-slider .swiper-slide a {border-radius:16px;}
	.visual-slider .visual-indicator {bottom:12px;}
    .visual-pagination-fraction {margin-right: 8px;font-size: 12px;width: auto;}
	
	.main-menu .menu-wrap li a {word-break:break-all;}
	.visual-box .box-wrap li a i,
	.main-menu .menu-wrap li a i {width:55px;height:55px;border-radius:7px;}
	.visual-box .box-wrap li a i::before,
	.main-menu .menu-wrap li a i::before {width:30px;height:30px;background-size:contain;}

    .main-board-top .title {font-size: 24px;}
	.board-list {padding:20px;}
	.board-list li.list-item a {display:block;}
	.board-list li.list-item .tit {width:100%;max-width:100%;}
	
    .main-sec3 {padding:40px 0;}
	h4.title {font-size:24px;}
	.main-sns-top .tab-menu-list > li > a {font-size:20px;}
    
}
@media screen and (max-width: 400px) {
    .visual-box .box-wrap {gap:10px;}
	.main-board-top .tab-menu-list > li > a {font-size:14px;}
	.main-sns-top .tab-menu-list > li > a {font-size:16px;}
}


