.main-con-wrap{font-family: var(--font2);}

/* main visual */
.main-visual-con .full-container
{display: flex;flex-direction: row;align-items: stretch;justify-content: space-between}

.mainVisual
{position:relative; width: 1360px;} 
.main-slide .slick-list
{border-radius: 3rem;z-index: 22;}
.main-slide .main-img
{height:700px;background-repeat: no-repeat; background-size: auto;} 
.main-img01{background: url(/wp-content/uploads/2026/03/mainVisual01.jpg)} 
.main-img02{background: url(/wp-content/uploads/2026/03/mainVisual02.jpg)} 
.main-img03{background: url(/wp-content/uploads/2026/03/mainVisual03.jpg)} 

.main-top-title
{position: absolute;  bottom: 16rem;  left: 10rem;}
.main-top-title h3
{font-size: 4.3rem;  font-weight: 600;color: #fff; margin: 0;}
.main-top-title h2
{font-size: 4.5rem;  font-weight: 800;color: #fff; margin: 1rem 0 0;}

/* MAIN VISUAL PROGRESS BAR */
.main-visual-controls
{position: relative;z-index: 999;}
.main-visual-controls .progress
{width:1065px; height:5px;position: absolute; z-index: 999; bottom: 10rem;  left: 10rem;}
.main-visual-controls .progress .bg-bar 
{position:absolute; width:100%; height:100%; background:#fff; display:block; left:0; top:0;border-radius: 3rem;}
.main-visual-controls .progress .ing-bar 
{width:0%; height:100%; display:block; position:relative; background:var(--main-color);border-radius: 3rem;}
.main-visual-controls .progress.active .ing-bar
{width:100%; transition:all 5s ease-in-out;}

/* main slide play pause */
.main-visual-controls .play-pause
{position: absolute;bottom: 2rem;right: 2rem;}
.main-visual-controls button
{ background: #000000;  border-radius: 100%;  width: 55px;  height: 55px;  color: #fff;}
.main-visual-controls .play-pause button i 
{font-size:2rem; color:#fff;line-height: 2rem;padding:0px;;}
.main-visual-controls .play-pause button{border: none;}
.main-visual-controls .play-pause button:hover,
.main-visual-controls .play-pause button:focus{background-color: #000000;}
.main-visual-controls .play-pause .main-visual-play-btn{display:none;}

.vis-boxes
{width: 330px;border-radius:3rem;transition: var(--transition1); display: flex;  flex-direction: column; justify-content: space-between;  align-items: flex-start;  height: 100%;  gap: 3rem;}
.vis-boxes .vis-box
{transition: var(--transition1); border-radius: 3rem; height: 100%; padding: 2.8rem; display: flex;  flex-direction: column;;width: 100%;  gap: 10rem;background: url(/wp-content/uploads/2026/03/simbol-w.png) no-repeat right top,#e5e5e5;}
.vis-boxes h4
{font-size: 1.8rem;  font-weight: 500;  margin: 0;  color: var(--main-color);}
.vis-boxes dl
{display: flex;flex-direction: row;justify-content: space-between;align-items: start;}
.vis-boxes dl dt
{font-size: 2.4rem;font-weight: 700;color: var(--text-color);}
.vis-boxes dl dd{}
/* hover effect */
.vis-boxes dl dd .more-btn
{color: #fff;background-color: #000;transition: var(--transition1); }
.vis-box:hover .more-btn
{color: #070707;background-color: #fff;}
.vis-box:hover .more-btn i
{color: #070707;}
.vis-boxes .vis-box:hover
{background: url(/wp-content/uploads/2026/03/simbol-w.png) no-repeat right top,var(--main-color)}
.vis-boxes .vis-box:hover h4,
.vis-boxes .vis-box:hover dt{color: #fff;}

/* morebtn */
.more-btn
{width: 35px;height: 35px; border-radius: 50%;display: flex; justify-content: center;align-items: center;transform: rotate(45deg);}

/* main title */
.main-title h2
{font-size: 3.8rem;  font-weight: 700;margin: 0;}

/* main gallery */
#mainGallery{margin: 7rem auto;}
#mainGallery .main-title-wrap
{display: flex;flex-direction: row;align-items: end;margin-bottom: 5rem;justify-content: space-between;}
/* hover event */
#mainGallery .kboard-list-item .kboard-list-thumbnail-child
{position: relative;  border-radius: 20px;  transition: clip-path 0.4s cubic-bezier(0.4, 0, 0.2, 1),var(--transition1);  clip-path: inset(0% 0% 0% 0% round 20px); /* 초기 상태: 전체를 다 덮는 둥근 사각형 */  /*width: 445px;  height: 260px;*/}
#mainGallery .kboard-list-item:hover .kboard-list-thumbnail-child
{clip-path: path("M 20 0 H 425 Q 445 0 445 20 V 154 Q 451 191 412 191 Q 385 190 380 213 Q 380 255 350 260 H 20 Q 0 260 0 240 V 20 Q 0 0 20 0 Z");opacity: 1;}
#mainGallery .kboard-list-item .kboard-list-thumbnail::after
{content: "\e907"; font-family: 'xeicon';transform:rotate(-45deg);  position: absolute;  right: 10px;  bottom: 10px;  width: 45px;  height: 45px;  background-color: #3f20a0;  color: #fff;  border-radius: 50%;  display: flex;  align-items: center;  justify-content: center;  font-size: 20px;  opacity: 0;  transition:var(--transition1);  z-index: 10;}
#mainGallery .kboard-list-item:hover .kboard-list-thumbnail::after 
{opacity: 1;  transform: rotate(-45deg);}

/* main notice */
#mainNotice 
{background: url(/wp-content/uploads/2026/03/simbol-p.png) no-repeat right -1% top -15%,#eae7f4;padding: 10rem 0;}
#mainNotice .main-title{margin-bottom: 5rem;}
#mainNotice .tab-wrap
{background: #fff;  padding: 6rem;  border-radius: 3rem;}
#mainNotice .tab-wrap .tab-buttons
{justify-content: center;margin-bottom: 5rem;}

/* mainBanner */
#mainBanner{padding: 8rem 0;}
#mainBanner .banner
{border-radius: 4rem;height: 425px;width: 100%; overflow: hidden;background: url(/wp-content/uploads/2026/03/main-service-bg.jpg) no-repeat center;background-size: cover;}
#mainBanner .banner .ban-txt
{display: flex;  flex-direction: column;  text-align: center; justify-content: center;  align-items: center;  height: 100%;}
#mainBanner .banner dl dt
{font-weight: 700;  color: var(--main-color);  font-size: 2rem;  margin-bottom: 3rem;}
#mainBanner .banner dl dd
{font-size: 4.5rem;  font-weight: 700;  color: #fff;  margin-bottom: 6rem;}
#mainBanner .banner .more-btn-02
{display: flex;flex-direction: row;align-items: center; transition: var(--transition1); justify-content: space-between;padding: 1rem 1rem 1rem 3rem;font-weight: 700;;min-width: 28.6rem;border-radius: 5rem; color: #111;background: #fff;}
#mainBanner .banner .more-btn-02 i
{width: 55px;height: 55px;border-radius: 100%; transition: var(--transition1); display: flex;flex-direction: column;align-items: center;justify-content: center;font-size: 2rem;transform: rotate(-45deg);background-color: var(--main-color);color: #fff;}
#mainBanner .banner:hover .more-btn-02{background-color: var(--main-color);color: #fff;;}
#mainBanner .banner:hover .more-btn-02 i{color: #111;background: #fff}