/*****************************************
메인공통
*****************************************/
.main-tit-box { margin-bottom: 0; display:flex; justify-content:space-between; } 
.main-tit > .word { margin-top: -1.5rem; } 
.main-tit { font-size:2.5rem; text-align:left; margin-bottom: 2rem; font-weight: 800; } 
.main-tit .highlight { color: #68d141; } 
.sub-tit { font-size:2rem; letter-spacing:-0.065em; color: #000; line-height:1.2; font-weight: 700; } 
.sub-txt { font-size:1.3rem; letter-spacing:-0.065em; color: #666; line-height:1.66em; font-weight: 300; margin-top: 3rem; } 

.sec02 .main-tit { margin-bottom: 0; text-align: right; } 


.br-block{display: none;}

/*****************************************
Main Visual
*****************************************/
.hid, .hide, .hidden { position: absolute; margin: -1px; padding: 0; width: 1px; height: 1px; overflow: hidden; } 
.visual .main-tit .line-t { font-size:15px; display: flex; align-items: center; } 
.visual .main-tit .line-t:before { content:''; width:50px; height:2px; margin-right:10px; display:inline-block; } 
.visual .main-tit h3 { font-size: 55px; color:#000; margin:20px 0 30px; font-weight: bold; } 
.visual .main-tit h3 img { vertical-align:baseline; margin-right: 10px; } 
.visual .main-tit p { font-size:22px; color:#444; line-height:1.6; } 
.visual .main-tit h3 + p { margin-top: 10px; } 
.more { color:#fff; margin-top:50px; display:inline-block; position:relative; font-weight:500; font-size: 1.6rem; } 
.more:before { content:''; width:32px; height:32px; background:#52816f; border-radius:50%; position:absolute; right:5px; top:50%; margin-top:-17px; /* background:url('/images/btn/more-arr-w.png') #ff7f00 no-repeat right 15px center; */transition:all ease .3s; opacity:0; z-index: -1; } 
.more:hover:before { right:0; opacity:1; } 
.more img { vertical-align:baseline; margin:-1px 20px 1px 10px; } 
@media all and (max-width:767px){
 .main-tit p { font-size:18px; } 
.main-tit h3 { font-size:36px; margin: 10px 0 20px; } 
 }


.visual { width: 100%; height: 100vh; overflow: hidden; } 
.visual-slider { height:100%; text-align:center; } 
.visual-slider .swiper-slide { overflow:hidden; position:relative; height:100%; } 
.visual-slider .visual-bg { position:absolute; left:0; top:0; width:100%; height:100%;-webkit-transition: all 5s;transition: all 5s;-webkit-transform: scale(1.2);transform: scale(1.2); } 
.visual-slider .visual-bg .pc { } 
.visual-slider .visual-bg .mo { display: none; } 
.visual-slider .visual-bg > div { position:absolute; left:0; top:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; } 
.visual-slider .visual-txtbox-wrap { display:flex; justify-content: flex-start; align-items: center; position:relative; z-index:1;margin:0 auto; max-width: 1600px; width: 100%; height: 100%; } 
.visual-slider .visual-txtbox .pc { } 
.visual-slider .visual-txtbox .mo { display: none; } 
.visual-slider .visual-txtbox h2 { text-align: left; overflow:hidden; }
.visual-slider .visual-txtbox h2 span { display:inline-block; vertical-align: middle; font-size:4rem; color:#fff; font-weight:800; line-height:1.333em; letter-spacing:-0.017em; word-break: keep-all; text-align: left; } 
.visual-slider .visual-txtbox p { margin-top:0.9em; font-size:2rem; color:#fff; line-height:1.6em; text-align: left; } 
.visual-slider .swiper-slide-active .visual-txtbox h2 span { -webkit-animation: slideAni 1s cubic-bezier(0.4, 0, 0.2, 1) both; animation: slideAni 1s cubic-bezier(0.4, 0, 0.2, 1) both; } 
.visual-slider .swiper-slide-active .visual-txtbox p {-webkit-animation: slideAni 1s cubic-bezier(0.4, 0, 0.2, 1) both;animation: slideAni 1s cubic-bezier(0.4, 0, 0.2, 1) both;-webkit-animation-delay:1.2s;animation-delay:1.2s; } 
@-webkit-keyframes slideAni {from {opacity:0;-webkit-transform: translateY(4rem);transform: translateY(4rem); } 
to {opacity:1;-webkit-transform: translateY(0);transform: translateY(0); } 
 }
@keyframes slideAni {from {opacity:0;-webkit-transform: translateY(4rem);transform: translateY(4rem); } 
to {opacity:1;-webkit-transform: translateY(0);transform: translateY(0); } 
 }
.visual-slider .swiper-slide-active .visual-bg {-webkit-transform: scale(1);transform: scale(1); } 


/* ===== VISUAL PAGINATION ===== */
.visual-slider .swiper-opt-wrap { display: flex; justify-content: flex-start; align-items: flex-start;position:absolute; left: 8%; top: 63%; right:auto; bottom:auto;z-index:10; margin:5.5rem 0 0;width:auto;-webkit-animation: slideAni 1s cubic-bezier(0.4, 0, 0.2, 1) both;animation: slideAni 1s cubic-bezier(0.4, 0, 0.2, 1) both;-webkit-animation-delay:1.3s;animation-delay:1.3s; } 
.visual-slider .swiper-play {width:3rem;height:3rem;background:url(/images/ico/ico-slide-stop.png) no-repeat center; cursor:pointer; } 
.stopped .visual-slider .swiper-play {background:url(/images/ico/ico-slide-play.png) no-repeat center; } 
.visual-slider .swiper-pagination {display:flex; justify-content:center; align-items:center; position:static; margin:0; text-align:center; } 
.visual-slider .swiper-pagination-bullet { display:block; opacity:0.4 !important; margin:0 0.467em; width:auto; height:auto; border-radius:0; background:transparent; font-size:1.5rem; color:#fff; font-weight:700; line-height:2em; } 
.visual-slider .swiper-pagination-bullet .progressbar { overflow:hidden; display:inline-block; position:relative; width:0; height:0.2rem; background:rgba(255,255,255,0.5); vertical-align:middle; -webkit-transition:all 1s ease; transition:all 1s ease; } 
.visual-slider .swiper-pagination-bullet .progressbar::after { content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#fff; } 
.stopped .visual-slider .swiper-pagination-bullet .progressbar::after { animation:none !important; } 
.visual-slider .swiper-pagination-bullet.swiper-pagination-bullet-active {opacity:1 !important; } 
.visual-slider .swiper-pagination-bullet.swiper-pagination-bullet-active .progressbar { margin-left:0.8rem; width:5rem; } 
.visual-slider .swiper-pagination-bullet.swiper-pagination-bullet-active .progressbar::after { -webkit-animation:progressBar 8s ease; animation:progressBar 8s ease; } 
.init .visual-slider .swiper-pagination-bullet.swiper-pagination-bullet-active .progressbar::after { -webkit-animation-delay:1s; animation-delay:1s; } 
@-webkit-keyframes progressBar { 
 0% { width:0; } 
 100% { width:100%; } 
 }
@keyframes progressBar { 
 0% { width:0; } 
 100% { width:100%; } 
 }





/* ===== SCROLLDOWN ===== */
.scrolldown {position:absolute;left:50%;bottom:0;z-index:10;width:1px;height:4rem;background:rgba(255,255,255,0.4);-webkit-transform:translateX(-50%);transform:translateX(-50%); -webkit-animation: slideAni 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation: slideAni 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; -webkit-animation-delay:1s;animation-delay:1s; } 
.scrolldown i {position:absolute;left:0;top:0;width:100%;background-color:#fff;height:0%;-webkit-animation:scrollDown 1.8s infinite linear;animation:scrollDown 1.8s infinite linear; -webkit-animation-delay:1.5s;animation-delay:1.5s; } 
.scrolldown i::after {content:"";position:absolute;left:50%;top:100%;margin-left:-0.25rem;width:0.5rem;height:0.5rem;background-color:#fff;-webkit-transform:rotate(45deg);transform:rotate(45deg); } 
@-webkit-keyframes scrollDown {0% {height:0; } 
100% {height:100%; } 
 }
@keyframes scrollDown {0% {height:0; } 
100% {height:100%; } 
 }


/*****************************************
섹션
*****************************************/

/* #cursor { position: relative; position: absolute; transform-origin: center center; z-index: 50; pointer-events: none; overflow: hidden; animation: cursorR 0.5s ease forwards; opacity: 0; user-select: none; width: 150px; height: 150px; border-radius:50%; display:flex; justify-content:center; align-items:center; display:none; } 
 #cursor .img { position: absolute; transform-origin: 50% 50%; animation: rotate_img 6s linear infinite; } 
 #cursor.fade { animation: cursorS 0.5s ease forwards; opacity: 1; display:block; } 

@keyframes rotate_img {0% { transform: rotate(0); } 
100% { transform: rotate(360deg); } 
 }

@keyframes cursorS {0% { transform: scale(0); } 
100% { transform: scale(1); } 
 }

@keyframes cursorR {0% { transform: scale(1); } 
100% { transform: scale(0); } 
 }*/


.sec01 { background: linear-gradient(rgba(0,0,0,0.3),rgba(0,0,0,0.3)),url(../../images/main/sec02_bg.jpg) no-repeat 50% 50%; background-size:cover; height: 80vh; /* display:none; */ } 
.sec01 .ctnBox { position: relative; display:flex; height: 100%; z-index: 5; /* cursor:none; */ } 
.sec01 .ctnBox .txtBox { position: relative; display:flex; align-items: flex-end; padding: 70px 50px; color:#fff; width: calc(100% / 3); flex-shrink:0; transition: all 0.8s } 
.sec01 .ctnBox .txtBox .bg { position: absolute; bottom: 0; right: 0; opacity: 0; transition:all 0.5s; } 
.sec01 .ctnBox .txtBox:before { content:''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.3); opacity: 0; z-index: -1; transition: all 0.5s } 
.sec01 .ctnBox .txtBox .innerBox { overflow: hidden; } 
.sec01 .ctnBox .txtBox .innerBox .title { font-size: 60px; font-weight: bold; } 
.sec01 .ctnBox .txtBox .innerBox .txt { margin: 20px 0 0; font-weight: 500; line-height: 1.5; font-size: 20px; } 
.sec01 .ctnBox .txtBox .innerBox .txt2 { line-height: 1.5; margin-top: 30px; height: 0; overflow: hidden; transition:all 0.7s 0.25s; } 
.sec01 .ctnBox .txtBox a { position: absolute; display:block; width: 100%; height: 100%; top: 0; left: 0; /* cursor:none; */ } 
.sec01 .ctnBox .txtBox.invert { backdrop-filter: blur(10px); } 
.sec01 .ctnBox .txtBox2 { z-index: 5; } 
.sec01 .ctnBox .txtBox2:after { content:''; display:block; width: calc(100% - 2px); height: calc(100% - 2px); position: absolute; top: 0; left: 0; border-right:1px solid rgba(255,255,255,0.1); border-left:1px solid rgba(255,255,255,0.1); z-index: -2; } 
.sec01 .ctnBox .txtBox:before { animation: fadeIn 0.7s 1.2s forwards; } 
.sec01 .ctnBox .txtBox .circle { animation: fadeIn 0.5s 0.7s forwards; } 
.sec01 .ctnBox .txtBox { transition:all 0.8s; } 
.sec01 .ctnBox .txtBox.invert:before { background: rgba(0,0,0,0.4); z-index: 5; } 
.sec01 .ctnBox .txtBox:hover:before { background: rgba(0,0,0,0); } 
.sec01 .ctnBox .txtBox:hover .innerBox .txt2 { height: 130px; } 
/* .sec01 .ctnBox .txtBox2:hover .innerBox .txt2 { height: 210px; } */
.sec01 .ctnBox .txtBox:hover .bg { opacity: 1; } 

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


/*****************************************
섹션
*****************************************/
/* 섹션 */
.sec02 { padding: 96px 0 194px; background: #f2f2f2; } 
.sec02 .ttl { position: relative; /* margin-top: -243px; */ text-align: right; } 
.sec02 .slide_up { max-width: 983px; margin: 0 0 0 auto; } 
.sec02 .product_h { font-size: 3.5rem; font-weight: 600; /* letter-spacing: 0.125em; */ line-height: 1.27; color: #242424; } 
/* .sec02 .ttl .deco { width: 197px; height: 213px; background: url(../images/main_deco1.svg)no-repeat; background-size: contain; position: absolute; top: -96px; right: 222px; z-index: -1; content: ''; }  */
.sec02 .h_group { margin-top: 56px; } 
.sec02 .product_group { display: flex; flex-wrap: wrap; justify-content: center; margin: 57px 0 0 0; } 
.sec02 .product_group li { width: calc(33.333% - 28px); margin-right: 38px; padding: 34px; border-radius: 40px; background: #fff; } 
.sec02 .product_group li:last-child{margin-right: 0;}
.sec02 .product_group .head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; margin-bottom: 20px; font-size: 13px; } 
.sec02 .product_group .head span { font-weight: 500; color: #000; } 
.sec02 .product_group .head p { color: #B3B3B3; text-transform: uppercase; } 
.sec02 .product_group .ic { width: 100%; display: flex; justify-content: center; text-align: center; margin-bottom: 40px; } 
.sec02 .product_group .ic img { max-width: 150px; height: 100%; object-fit: cover; } 
.sec02 .product_group dt { font-size: 1.875rem; font-weight: 700; letter-spacing: -0.05em; line-height: 1.2; color: #000; } 
.sec02 .product_group dd { margin: 12px 0 37px; line-height: 1.5; color: #666; } 
.sec02 .product_group .link { border-top: 1px solid rgba(0,0,0,.4); } 
.sec02 .product_group .link a {font-size: 15.5px; display: block; padding: 10px 0; border-bottom: 1px solid rgba(0,0,0,.1); font-weight: 500; line-height: 1.875; position: relative; transition: .2s linear; } 
.sec02 .product_group .link a:last-child { border-bottom: 0; } 
.sec02 .product_group .link a:before { width: 12px; height: 12px; margin-top: -8px; border-radius: 100%; /* background: url(../images/link_arrow_off.svg)no-repeat center; */ position: absolute; right: 0; top: 50%; content: ''; transition: .2s linear; } 
.sec02 .product_group .link a:hover { color: #104770; } 
.sec02 .product_group .link a:hover:before { /* background-image: url(../images/link_arrow_on.svg); */background-color: #104770; } 


/*****************************************
카운트
*****************************************/
#sec03 { background: url('/images/main/main_architect_bg.jpg')no-repeat; background-size:cover; /* padding:18rem 0 19.5rem; */ background-position:80% 50%; } 
.sec03-container { display: flex; column-gap: 10rem; align-items: center; justify-content: center;} 
.sec03-container .main-tit-box{width: 50%;} 
.sec03-sub-txt-box { text-align:left; } 
#sec03 .view-btn { align-self:flex-end; margin-left: 3%; } 
.sec03-con-box { display:flex; width: 50%; } 
.sec03-con-box .con-tit-box { text-align:center; } 
.sec03-con-box .count-con-box { display:flex; width: 100%; flex-wrap: wrap; margin: 3rem 0; } 

.sec03-con-box .count-con-box .item { width: calc((100% - 10rem) / 2); margin-right: 4.7rem; padding:5.5rem 0; } 
.sec03-con-box .count-con-box .item:last-of-type { margin-right: 0; } 
/* .sec03-con-box .count-con-box .item:nth-child(1) { border-bottom:2px solid rgba(0,0,0,0.05); } 
.sec03-con-box .count-con-box .item:nth-child(2) { border-bottom:2px solid rgba(0,0,0,0.05); }  */
.sec03-con-box .count-con-box .item-tit { font-size: 1.8rem; letter-spacing: -0.065em; color: #104770; font-weight: 500; } 

.sec03-con-box .count-con-box .count-box { margin-top: 1.7rem; } 
.sec03-con-box .count-con-box .count-box .count-num { color: #000; font-size:3rem; letter-spacing:-0.05em; font-weight: 600; } 
.sec03-con-box .count-con-box .count-box .unit { color: #000; font-size:3rem; font-weight: 500; } 


/*****************************************
공지사항
*****************************************/
/* 타이틀 */
.sec04 { padding: 8rem 0; } 
.sec04 .main-tit { margin-bottom:80px; position:relative; } 
.sec04 .main-tit h3 { font-size: 2rem; letter-spacing: -0.065em; color: #000; line-height: 1.5; font-weight: 700; } 
.sec04 .main-tit p { font-size:3.5rem; text-align:left; margin-bottom: 3.5rem; font-weight: 800; color: #104770; } 
.sec04 .main-tit .more-btn { position:absolute; right:100px; bottom:5px; color:#111 } 
.sec04 .more-btn { position:relative; padding-bottom:3px; font-weight:500; font-size:16px; display: inline-block; } 
.sec04 .more-btn:before { content:''; width:100%; height:2px; background:#104770; position:absolute; right:0; bottom:0; transition:all ease .6s; } 
.sec04 .more-btn i { font-style:normal; margin-left:15px; transition:all ease .3s; } 
.sec04 .more-btn:hover i { margin-left:30px; } 
.sec04 .more-btn:hover:before { width:0; } 
 
.sec04 { background:#f9f8f8; } 
.sec04 .fp-tableCell { vertical-align:middle; } 
.sec04 .main-tit p { margin-bottom: 50px; } 
.sec04 .news-slider { overflow:hidden; padding:20px 50px; /* margin:0 -50px; */ position:relative; } 
.sec04 .news-slider .swiper-slide { padding:40px; min-height:290px; position:relative; box-shadow: 2px 2px 7px 1px #c3c3c38c; } 
.sec04 .news-slider .swiper-slide:before { content:''; width:0; height:2px; background:#104770; position:absolute; left:0; top:0; z-index:-1; transition-delay:0s; } 
.sec04 .news-slider .swiper-slide:after { content:''; width:2px; height:0; background:#104770; position:absolute; right:0; top:0; z-index:-1; transition-delay:0s; } 
.sec04 .news-slider .swiper-slide > a:before { content:''; width:0; height:2px; background:#104770; position:absolute; right:0; bottom:0; z-index:-1; transition-delay:0s; } 
.sec04 .news-slider .swiper-slide > a:after { content:''; width:2px; height:0; background:#104770; position:absolute; left:0; bottom:0; z-index:-1; transition-delay:0s; } 
@media screen and (min-width:769px) {.sec04 .news-slider .swiper-slide:hover:before { width:100%; transition:all linear .3s; transition-delay:0s; } 
.sec04 .news-slider .swiper-slide:hover:after { height:100%; transition:all linear .3s; transition-delay:.3s; } 
.sec04 .news-slider .swiper-slide:hover > a:before { width:100%; transition:all linear .3s; transition-delay:.6s; } 
.sec04 .news-slider .swiper-slide:hover > a:after { height:100%; transition:all linear .3s; transition-delay:.9s; } 
.sec04 .news-slider .swiper-slide:hover .subj { -webkit-line-clamp:2; } 
.sec04 .news-slider .swiper-slide:hover p { -webkit-line-clamp:3; } 
.sec04 .news-slider .swiper-slide:hover { padding: 20px 40px 40px; } 
.sec04 .news-slider .swiper-slide:hover .date { font-size:52px; margin-top:-65px; } 
.sec04 .news-slider .swiper-slide:hover .date span { opacity:0; } 
 }
.sec04 .news-slider p { color:#aaa; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word; line-height:1.4em; } 
.sec04 .news-slider .date { display:inline-block; background:#f9f8f8; color:#104770; font-size:42px; font-weight:600; line-height:1; padding:0 5px; margin-left:-5px; text-align:center; transition:all linear .2s; } 
.sec04 .news-slider .date span { color:#aaa; font-size:13px; font-weight:400; display:block; letter-spacing:0; } 
.sec04 .news-slider .subj { color:#111; font-size:20px; font-weight:700; margin:30px 0 15px; -webkit-line-clamp:1; } 
.sec04 .news-slider .swiper-button-prev:after, 
.sec04 .news-slider .swiper-button-next:after { font-size:32px; } 
.sec04 .news-slider .swiper-button-prev { left:0; color:#111; } 
.sec04 .news-slider .swiper-button-next { right:0; color:#111; } 






/*=======================
1600px
========================*/
@media screen and (max-width:1600px) { 
/* 메인공통 */
.main-tit{font-size: 2.8rem;}
.sub-tit{font-size: 1.6rem;}
.sub-txt{font-size: 18px;}

/* 메인비주얼 */
.visual-slider .visual-txtbox-wrap{max-width: 1260px;}
.visual-slider .visual-txtbox h2 span{font-size: 3rem;}


/* Sec01 */
.sec01 .ctnBox .txtBox .innerBox .title{font-size: 44px;}
.sec01 .ctnBox .txtBox { padding: 70px 30px; } 
.sec01.active .ctnBox .txtBox:hover .innerBox .txt2 { height: 210px; } 
.sec01 .ctnBox .txtBox .innerBox .txt{font-size: 18px;}
.sec01 .ctnBox .txtBox .innerBox .txt2{font-size: 14px;}

/* Sec02 */
.sec02 .product_group dt{font-size: 1.5rem;}
.sec02 .product_group dd{font-size: 15px;}
.sec02 .product_group .ic img{max-width: 120px;}
.sec02 .product_group .link a{padding: 8px 0; font-size: 14px;}

/* Sec03 */
.sec03-con-box .count-con-box .count-box .count-num{font-size: 3.5rem;}
.sec03-con-box .count-con-box .count-box .unit{font-size: 3.5rem;}

/* Sec04 */
.sec04 .main-tit h3{font-size: 1.6rem;}

}

/*=======================
1440px
========================*/
@media all and (max-width:1440px) {
/* 메인비주얼 */
.visual-slider .visual-txtbox p{font-size: 1.6rem;}
.visual-slider .swiper-opt-wrap{left: 5%;}


/* Sec01 */
.sec01 .ctnBox .txtBox:hover .innerBox .txt2 { height: 100px; } 


}


/*=======================
1280px
========================*/
@media screen and (max-width:1280px) { 
/* 메인비주얼 */
.visual-txtbox{padding-left: 60px;}

/* Sec03 */
.sec03-container { flex-direction:column; } 
.sec03-con-box .count-con-box{margin-top: 0;}
#sec03 { padding:8rem 0 10rem; } 
.sec03-sub-txt-box{text-align: center;}
#sec03 .main-tit-box .main-tit { margin-bottom: 4rem; text-align: center; } 
.sec03-container .main-tit-box { width: 100%; } 
.sec03-con-box { width: 100%; margin-top: 3rem; } 
.sec03-con-box .con-tit-box { margin-top: 5rem; } 
.sec03-con-box .count-con-box .item{padding: 0;}
.sec03-con-box .count-con-box .item:nth-child(1){border: 0;}
.sec03-con-box .count-con-box .item:nth-child(2){border: 0;}
/* .sec03-con-box .count-con-box .count-box .count-num , .sec03-con-box .count-con-box .count-box .unit { font-size:6.8rem; }  */
}


/*=======================
1200px
========================*/
@media screen and (max-width:1200px) { 

/*Sec01 */
.sec01 { display:block; height: 100vh; } 
.sec01 .ctnBox:before,
.sec01 .ctnBox:after { opacity: 1; } 
.sec01 .ctnBox .txtBox {padding: 50px 25px;}
.sec01 .ctnBox .txtBox .innerBox .txt2 { height: 100%; } 
.sec01 .ctnBox .txtBox .innerBox .title {font-size: 30px;}
.sec01 .ctnBox .txtBox .innerBox .txt {font-size: 16px;}
.sec01 .ctnBox .txtBox .innerBox .txt2 {font-size: 14px;}
.sec01 .ctnBox .txtBox:hover .innerBox .txt2 { height: 100%; } 

}


/*=======================
1179px
========================*/
@media screen and (max-width:1179px) { 
/* Sec02 */
.sec02 .product_group li { width: calc(33.333% - 20px); margin-right: 20px; } 
}


/*=======================
1024px
========================*/
@media all and (max-width:1024px) { 


/* Sec02 */
/* .sec02 .product_group { flex-wrap: nowrap; margin-right: 0; overflow-x: scroll; }  */
.sec02 .product_group li { width: 100%; flex-shrink: 0; text-align: center; border-radius: 20px; margin-top: 12px;} 
.sec02 .product_group li .link { text-align: left; } 
}

/*=======================
980px
========================*/
@media screen and (max-width:980px){
.sec01 .ctnBox { flex-direction:column; background: rgba(0, 0, 0, 0.2); } 
.sec01 .ctnBox .txtBox { width: 100%; height: calc(100vh / 3); padding: 50px 20px; } 
.sec01 .ctnBox .txtBox2:after { border-top: 1px solid rgba(255, 255, 255, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.1); } 
.sec01 .ctnBox .txtBox .circle { transform:translateX(-50%); left: 50%; right: auto; top: -9px; opacity: 1; } 
.sec01 .ctnBox .txtBox .circle2 { bottom: -9px; top: auto; } 

}


/*=======================
820px
========================*/
@media all and (max-width:820px) { 

/* Sec03 */
#sec03 { padding:8rem 0 10rem; } 
#sec03:after { top:initial; bottom:0; width: 100%; height: 50%; } 
#sec03 .main-tit-box { flex-direction:column; } 
#sec03 .main-tit-box .main-tit { margin-bottom: 1rem;}
#sec03 .view-btn { margin-left: 0; margin-top: 3rem; align-self: flex-start; } 
.sec03-con-box .con-tit-box { margin-top: 0; } 
.sec03-con-box { flex-direction:column; } 
.sec03-con-box .count-con-box { flex-wrap:wrap; width: 100%; margin-top: 4.5rem; } 
.sec03-con-box .count-con-box .item { width: calc((100% - 2%) / 2); margin-right: 2%; padding:3rem 0; } 
.sec03-con-box .count-con-box .item:nth-of-type(even) { margin-right: 0; } 
.sec03-con-box .count-con-box .item:nth-child(3), .sec03-con-box .count-con-box .item:nth-child(4) {border-top:0; } 
/* .sec03-con-box .count-con-box .count-box .count-num, .sec03-con-box .count-con-box .count-box .unit { font-size:5rem; }  */

/* Sec04 */
.main-tit { margin-bottom:40px; } 
.main-tit p { font-size:14px; opacity:1; } 
.main-tit h3 { font-size:20px; padding:0 20px; opacity:1; } 
.main-tit h3 br { display:none } 
.more-btn { font-size:14px; } 
.more-btn i { margin-left:10px; } 
.main-tit .more-btn { position:relative; margin:20px 0; margin-left:20px; right: auto; bottom:auto; } 
.sec04 { overflow:hidden; } 
.sec04 .main-tit p { margin-bottom:20px; } 
.sec04 .news-slider { padding:40px 40px 0; margin:0 -20px } 
.sec04 .news-slider .swiper-slide { padding:20px 30px 40px; min-height:auto; } 
.sec04 .news-slider .swiper-slide > a:before,
.sec04 .news-slider .swiper-slide:before { width:100%; } 
.sec04 .news-slider .swiper-slide > a:after,
.sec04 .news-slider .swiper-slide:after { height:100%; } 
.sec04 .news-slider .swiper-slide .date { font-size:52px; margin-top:-65px; } 
.sec04 .news-slider .subj { margin:0 0 20px; } 
.sec04 .news-slider .swiper-slide .subj { -webkit-line-clamp:1; min-height: auto; font-size:16px; } 
.sec04 .news-slider .swiper-slide p { -webkit-line-clamp:2; min-height:42px; font-size:14px; } 
.sec04 .news-slider .swiper-button-prev { left:5px; } 
.sec04 .news-slider .swiper-button-next { right:5px; } 
.sec04 .news-slider .swiper-button-prev:after, .sec04 .news-slider .swiper-button-next:after { font-size:20px; } 
}

/*=======================
768px
========================*/
@media all and (max-width:768px) { 

/* 메인비주얼 */
.visual-slider .visual-txtbox h2 span {font-size: 2rem;}
.visual-slider .visual-txtbox p br {display:none; } 
.visual-slider .swiper-pagination-bullet.swiper-pagination-bullet-active .progressbar {width:2rem; } 
.visual-slider .swiper-pagination-bullet {font-size:1.2rem; } 
.visual-txtbox {padding-left: 36px;}
.visual-slider .visual-txtbox p {font-size: 18px;}

/* Sec01 */
.sec01 .ctnBox .txtBox .innerBox .txt2 { display:none; } 

/* Sec02 */
.sec02 .product_group { margin-top: 42px; } 
.sec02 .product_group li { padding: 29px; } 
.sec02 .product_group dt { font-size: 1.7rem; } 
.sec02 .product_group dd { margin: 10px 0 26px; font-size: 1.07rem; line-height: 1.36; } 
.sec02 .product_group .head { font-size: 0.92rem; } 
.sec02 .product_group .ic { margin-bottom: 20px; } 
.sec02 .product_group .ic svg { width: 70%; height: auto; margin: 0 auto; } 
.sec02 .product_group .link a { font-size: 0.92rem; line-height: 1.25; } 

/* Sec04 */
.sec04 .main-tit{margin-bottom: 50px;}
.sec04 .main-tit h3{padding: 0;}
.sec04 .main-tit .more-btn {  right: 20px;  bottom: -58px;}
}


/*=======================
480px
========================*/
@media all and (max-width:480px) {
/* 공통 */
.main-tit {font-size: 24px;}
.sub-tit{font-size: 18px;}
.sub-txt { font-size: 15px;}
.br-block{display: block;}
/* 메인비주얼 */
.visual-slider .visual-bg .pc { display: none; } 
.visual-slider .visual-bg .mo { display: block; } 
.visual-txtbox{padding-left: 30px;}
.visual-slider .visual-txtbox .pc { display: none; } 
.visual-slider .visual-txtbox .mo { display: block; } 
.visual-slider .visual-txtbox h2 span {
    font-size: 28px;
}

/* Sec02 */
.sec02 .product_group .ic img {max-width: 80px;}
.sec02 .product_group dt {font-size: 18px;}
.sec02 .product_group dd{font-size: 14px;}
.sec02 .product_group .link a {font-size: 13px;}

/* Sec03 */
#sec03{padding: 5rem 0;}
#sec03 .br-none{display: none;}
.sec03-con-box .count-con-box{margin: 0;}
.sec03-con-box .count-con-box .item-tit {font-size: 20px;}
.sec03-con-box .count-con-box .count-box .count-num { font-size: 30px;}
.sec03-con-box .count-con-box .count-box .unit {font-size: 20px;}
.sec03-con-box .count-con-box .item{padding: 2rem 0;}

/* Sec04 */
.sec04 .main-tit p{font-size: 30px;}
.sec04 .main-tit h3 { font-size: 16px;}
.sec04 .more-btn{font-size: 14px;}
}


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

/* 메인비주얼 */
.visual-txtbox {padding-left: 20px;}
}