/* common */

#visual.subVisual:before{ display:none; }
/*#visual.subVisual .bg{ position: absolute; top: 0; left: 0; opacity: 1; }*/
/*#visual.subVisual .bg img{ transform:translate(-50%,-50%) scale(1.1); transition:all 2s .1s; }*/
#visual.subVisual .bg{ position: relative; width: 100%; height: 100%; }
#visual.subVisual .bg figure{ width: 100%; height: 100%; transform: scale(1.1); transition:all 2s .1s;}
#visual.subVisual .w1800{ flex-direction:column; justify-content: flex-start; position: absolute; transform:translateX(-50%); top: 0; left: 50%; width: 100%; height: 100%; padding-top: 305px; }
#visual.subVisual .sTxt{ color: rgba(255, 255, 255, 0.80); font-family: var(--man); font-weight: 800; letter-spacing: 6px; margin-bottom: 60px; }

.sv01 #visual.subVisual .bg figure{ background: url(/img/sub/subVisual01.png) no-repeat 50% 50%; background-size:cover;}
.sv02 #visual.subVisual .bg figure{ background: url(/img/sub/subVisual02.png) no-repeat 50% 50%; background-size:cover;}
.sv03 #visual.subVisual .bg figure{ background: url(/img/sub/subVisual03.png) no-repeat 50% 50%; background-size:cover;}
.sv04 #visual.subVisual .bg figure{ background: url(/img/sub/subVisual04.png) no-repeat 50% 50%; background-size:cover;}

#visual.subVisual .bg.aos-animate figure{ transform:scale(1); }

#contentTab{ position: relative; display:flex; justify-content:center; margin: 0 auto 80px; width: 420px; padding: 10px; border-radius:50px; background: #F5F5F5; } 
#contentTab .move{ position: absolute; transform:translateY(-50%); top: 50%; left: 0; display: block; width: 200px; height: 60px; background: var(--mainC); border-radius:50px; margin-left: 10px;
transition: left 0.5s ease;}
#contentTab ul{ display:inline-flex; align-items:center; position: relative; z-index: 5;}
#contentTab ul li{ min-width:200px; min-height:60px; padding: 0 25px; display:flex; justify-content:center; align-items:center; text-align: center; font-weight: 600; border-radius:50px; }
#contentTab ul li a{ color:#bbb; transition:all 0.5s; }
#contentTab ul li.on a,
#contentTab ul li:hover a{ color:#fff; }

#title-box{ text-align: center; margin-bottom: 80px; }
#title-box .stxt{ color:var(--mainC); font-family: var(--man); font-weight: 600; letter-spacing: -0.36px; margin-bottom: 15px; }
#title-box .title{ color:#151515; font-weight: bold; letter-spacing: -1.2px; }

/* sub */
/* greeting */
#greeting{}
#greeting h3.title{ color:#fff; letter-spacing: -1.2px; font-weight: 700; display:flex; justify-content:center; align-items:center; margin-bottom: 160px;  }
#greeting h3.title em{ font-family: 'S-CoreDream-7ExtraBold'; }
#greeting h3.title img{ margin-left: 15px; }
#greeting .intro{ background: var(--bgC);}
#greeting .intro .content{ display:flex; align-items:center; gap:30px; }
#greeting .intro .content .item-box{ width: calc((100% - 120px) / 5); background: var(--bgC2); border-radius:20px; padding: 10px; min-height:820px; }
#greeting .intro .content .item-box figure{ margin-bottom: 35px; }
#greeting .intro .content .item-box .txt-box{ padding: 0 30px; }
#greeting .intro .content .item-box .txt-box .s-txt{ color: rgba(255, 255, 255, 0.40); font-weight: bold; letter-spacing: -0.36px; }
#greeting .intro .content .item-box .txt-box .title{ color:#fff; letter-spacing: -1.36px; line-height: 1.2; font-weight: 800; font-family: var(--man); margin: 5px 0 35px; height: 95px; }
#greeting .intro .content .item-box .txt-box .txt{ color: rgba(255, 255, 255, 0.60); font-weight: 300; line-height: 1.6; letter-spacing: -0.68px; }

#greeting .vision{ position: relative; width: 100%; height: 100vh;}
#greeting .vision .bg{ position: absolute; top: 0; left: 0; }
#greeting .vision .content{ position: relative; display: flex; justify-content: center; align-items: flex-end; height: 100%; opacity: 1; }
#greeting .vision .content .txt-box{ position:absolute; transform:translate(-50%,-50%); top: 60%; left: 50%; transition:all 0.5s; }
#greeting .vision .content .img-box{ position: relative; display:inline-block; margin: 0 auto 75px; height: 690px; max-width: 980px; width: 100%; transition:all 1s 0.3s; }
#greeting .vision .content .img-box figure{ position: absolute; transform:translateY(-50%); top: 50%; display:inline-block; }
#greeting .vision .content .img-box figure.left-img{ left: 0;}
#greeting .vision .content .img-box figure.right-img{ right: 0;}
#greeting .vision .content .img-box svg{ overflow: visible;}
#greeting .vision .content .img-box .bounce1{ animation: bounce 1.5s ease-in-out infinite; clip-path: inset(0 1px);}
#greeting .vision .content .img-box .bounce2{ animation: bounce-2 1.5s ease-in-out infinite; }
#greeting .vision .content .img-box .bounce3{ animation: bounce-3 1.5s ease-in-out infinite; }
#greeting .vision .content .txt-box{ text-align: center; transition:all 0.8s 0.6s; }
#greeting .vision .content .txt-box .title-box{ clip-path:inset(0% 100% 0%); transition:all 1s 0.3s; }
#greeting .vision .content .txt-box .s-txt{ color: rgba(17, 17, 17, 0.50); font-weight: 600; letter-spacing: -0.36px; font-family: var(--man);}
#greeting .vision .content .txt-box .title{ color:var(--bgC); font-weight: bold; letter-spacing: -1.2px; margin: 20px 0 50px;}
#greeting .vision .content .txt-box .title em{ color:var(--mainC); }
#greeting .vision .content .txt-box .txt{ color:#555; font-weight: 300; line-height: 1.6; letter-spacing: -0.4px; opacity: 0; transition:all 0.2s 0.8s; }
#greeting .vision .content.aos-animate .img-box{ max-width:1800px; }
#greeting .vision .content.aos-animate .txt-box{ top: 47%; }
#greeting .vision .content.aos-animate .txt-box .title-box{ clip-path: inset(0% 0% 0%); }
#greeting .vision .content.aos-animate .txt-box .txt{ opacity: 1; }

@keyframes bounce {
	0%{ transform:translateY(0); }
	50% { transform:translateY(-30px);}
	100% { transform:translateY(0); }
}

@keyframes bounce-2 {
	0%{ transform:translateY(0); }
	50% { transform:translateY(-23px);}
	100% { transform:translateY(0); }
}

@keyframes bounce-3 {
	0%{ transform:translateY(0); }
	50% { transform:translateY(-15px);}
	100% { transform:translateY(0); }
}

#greeting .section-wrap{ position: relative; overflow: hidden;}
#greeting .section-wrap section{ position: relative; width: 100%; height: 100vh; overflow: hidden; margin-left: -1px; } 
#greeting .business .bg{ filter: grayscale(1); width: 100%; height: 100%; position: absolute; top: 100%; left: 0; z-index: -1; transition:all 1.3s 0.6s; }
#greeting .business .txt-box{ width: 100%; height: 100%; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align: center; position: relative; z-index: 2; }
#greeting .business .txt-box > *{ opacity: 0; transform:translateY(200px); transition:all 0.7s; }
#greeting .business .txt-box .s-txt{ color:var(--mainC); letter-spacing: -0.36px; font-weight: 600; font-family: var(--man);}
#greeting .business .txt-box .title{ color: var(--bgC); font-weight: bold; letter-spacing: -1.2px; margin: 15px 0 40px; transition:all 0.7s 0.9s; }
#greeting .business .txt-box .txt{ color:var(--bgC); letter-spacing: -0.4px; line-height: 1.6; transition: opacity 0.7s, transform 0.7s, color 0.7s 0.6s; }

#greeting .business.aos-animate .txt-box .title-box,
#greeting .business.aos-animate .txt-box .txt{ opacity: 1; transform:translateY(0);}
#greeting .business.aos-animate .bg{ top: 0; }
#greeting .business.aos-animate .txt-box .title{ color:#fff; }
#greeting .business.aos-animate .txt-box .txt{ color:rgba(255,255,255,0.8); }

#greeting .history{ position: relative; position: absolute !important; top: 100%; left: 0; background: var(--bgC); z-index: 5;}
#greeting .history .text-wrap{ width: 100%; height: 100%; background: var(--bgC); display:flex; flex-direction:column; justify-content:center; align-items:center; text-align: center; 
max-width:1920px; overflow: hidden; position: absolute; top: 0; left: 0; z-index: 5;}
#greeting .history .text-wrap p{ position: relative; color:#fff; font-weight: 800; font-family: var(--man); letter-spacing: -4.4px; }
#greeting .history .text-wrap p.left{ transform:translateX(-200%); }
#greeting .history .text-wrap p.right{ transform:translateX(200%); margin-top: -55px; }
#greeting .history .content{ position: relative; z-index: 3; height: 100%; display:flex; justify-content:center; align-items: center; }
#greeting .history .content > div{ margin-top: 60px; display:flex; }
#greeting .history .content .txt-box{ position: relative; margin: 0 150px 0 40px; width: 100%; pointer-events:none; }
#greeting .history .content .txt-box .item-box{ display:none; width: 100%; }
#greeting .history .content .txt-box .item-box .year{ color:#fff; font-weight: 300; font-family: var(--man); letter-spacing: -4.4px; margin-bottom: 80px; }
#greeting .history .content .txt-box .item-box .title{ display:flex; align-items:center; color:#fff; font-weight: 600; letter-spacing: -0.48px; }
#greeting .history .content .txt-box .item-box .title span{ position: relative;  display:flex; justify-content:space-between; align-items:center; }
#greeting .history .content .txt-box .item-box .title span:after{ content:''; display:block; width: 1px; height: 15px; background: rgba(255, 255, 255, 0.50); margin: 0 15px;}
#greeting .history .content .txt-box .item-box .txt{ color:rgba(255, 255, 255, 0.7); font-weight: 300; line-height: 1.5; letter-spacing: -0.36px; margin-top: 15px;}
#greeting .history .content .txt-box .item-box div.txt{ display:flex; }
#greeting .history .content .txt-box .item-box div.txt ul:first-child{ margin-right: 40px;}
#greeting .history .content .txt-box .item-box.on{ display:block; }
#greeting .history .content .slide-wrap{ position: relative; max-width:800px; width: 100%; flex-shrink:0; } 
#greeting .history .content .slide-wrap .swiper-pagination-progressbar{ position: relative; margin-top: 60px; background: rgba(255, 255, 255, 0.20); height: 1px;}
#greeting .history .content .slide-wrap .swiper-pagination-progressbar span{ height: 2px; margin-top: -1px; background: #fff; }
#greeting .history .content .slide-wrap .slide-arrow figure{ width: 80px; height: 80px; border-radius:50%; display:flex; justify-content:center; align-items:center; background: #2DA683; 
position: absolute; top: 175px; z-index: 5; cursor:pointer; }
#greeting .history .content .slide-wrap .slide-arrow .prev{ left: -40px; }
#greeting .history .content .slide-wrap .slide-arrow .next{ right: -40px; }
#greeting .info{ padding: 240px 0 60px; }
#greeting .info .item-box{ display:flex; align-items:center; }
#greeting .info .item-box:not(:last-child){ margin-bottom: 160px;}
#greeting .info .item-box > *{ width: 50%; }
#greeting .info .item-box > figure{ text-align: left; }
#greeting .info .item-box .txt-box{ padding-left: 140px; opacity: 0; transition:all 0.5s; }
#greeting .info .item-box .txt-box figure{ position: relative; display:inline-block; }
#greeting .info .item-box .txt-box figure img{ transform-origin:center center; animation: rotate 2s linear infinite}
#greeting .info .item-box .txt-box .title{ margin: 30px 0;  font-family: 'S-CoreDream-5Medium'; color:#111; letter-spacing: -1px; }
#greeting .info .item-box .txt-box .txt{ color:#333; font-weight: 300; }
#greeting .info .item-box.item1 .txt-box .title em{ color:#F1C22E; }
#greeting .info .item-box.item1 .txt-box .txt{ line-height: 1.6;}
#greeting .info .item-box.item2 .txt-box .title em{ color:#F39BB3; }
#greeting .info .item-box.item3 .txt-box .title em{ color:#2DA683; }
#greeting .info .item-box.active .txt-box{ opacity: 1; }
#greeting .info .item-box.active .txt-box .title span{ position: relative; display: inline-block; transform: translateY(0); animation: bounce-2 .5s .5s ease alternate; }

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

#greeting .mission{ }
#greeting .mission .wrap-box{ position: relative; display:flex; }
#greeting .mission .wrap-box > div{ width: 50%; }
#greeting .mission .wrap-box .title-box{ position: sticky; top: 60px; left: 0; height: 775px; }
#greeting .mission .wrap-box .title-box .s-txt{ color:var(--mainC); font-family: var(--man); font-weight: 600; letter-spacing: -0.36px; }
#greeting .mission .wrap-box .title-box .title{ color:var(--bgC); font-weight: 700; letter-spacing: -1.2px; margin: 15px 0 75px;}
#greeting .mission .wrap-box .title-box figure{ animation: imgAni 1.5s ease-in-out infinite;}
#greeting .mission .wrap-box .content{ position: relative; }
#greeting .mission .wrap-box .content .item-box{ position: relative; position: sticky; top: 60px; left: 0;  width: 100%; border-radius: 20px; border: 1px solid rgba(255, 255, 255, 0.50); height: 390px; display:flex; flex-direction:column; justify-content:space-between; padding: 50px; }
#greeting .mission .wrap-box .content .item-box:not(:first-child){ margin-top: 40px; }
#greeting .mission .wrap-box .content .item-box .title{ letter-spacing: -0.92px; font-family: 'S-CoreDream-6Bold';}
#greeting .mission .wrap-box .content .item-box .title em{ font-family: var(--man); display:block; font-weight: 800; margin-bottom: 20px; letter-spacing: -0.96px;}
#greeting .mission .wrap-box .content .item-box figure{ position: absolute; top: 50px; right: 50px; }
#greeting .mission .wrap-box .content .item-box .txt{ color:#555; line-height: 1.6; letter-spacing: -0.4px; }
#greeting .mission .wrap-box .content .item-box.box1{ background: #FFE0E9; box-shadow: 4px 4px 20px 0px rgba(233, 108, 142, 0.15);}
#greeting .mission .wrap-box .content .item-box.box1 .title{ color: #E96C8E; }
#greeting .mission .wrap-box .content .item-box.box1 .title em{ color: rgba(233, 108, 142, 0.30); }
#greeting .mission .wrap-box .content .item-box.box2{ background: #C6EFFF; box-shadow: 4px 4px 20px 0px rgba(4, 157, 217, 0.20);}
#greeting .mission .wrap-box .content .item-box.box2 .title{ color: #049DD9; }
#greeting .mission .wrap-box .content .item-box.box2 .title em{ color: rgba(4, 157, 217, 0.30); }
#greeting .mission .wrap-box .content .item-box.box3{ background: #FFE0CE; box-shadow: 4px 4px 20px 0px rgba(242, 120, 47, 0.20); }
#greeting .mission .wrap-box .content .item-box.box3 .title{ color: #F2782F; }
#greeting .mission .wrap-box .content .item-box.box3 .title em{ color: rgba(242, 120, 47, 0.30); }
 
@keyframes imgAni {
	0%{ transform:translate(0,0); }
	50% { transform:translate(-18px,-27px);}
	100% { transform:translate(0,0);}
}

#greeting .location{ padding: 0 0 200px;}
#greeting .location .title{ margin-bottom: 60px; color:var(--bgC); font-weight: bold; letter-spacing: -1.2px; }
#greeting .location .title em{ display:block; font-family: var(--man); color:var(--mainC); margin-bottom: 15px; letter-spacing: -0.36px; font-weight: 600;}
#greeting .location .address{ background: #F9F9F9; border-radius:20px; padding: 40px 60px; display:flex; align-items:center; color:#555; font-weight: 300; letter-spacing: -0.36px; 
margin-bottom: 10px;}
#greeting .location .address span{ margin-right: 60px; font-family: var(--man); color:#252525; font-weight: bold; letter-spacing: -0.4px; }
#greeting .location .map-box{ clip-path: inset(1px 1px 1px round 20px); }
#greeting .location .map-box .root_daum_roughmap{ width: 100%; }


/* animation */
#animation{ padding: 120px 0 0; }
#animation .content{ position: relative; padding: 40px 0; overflow: hidden;}
#animation .content .inner-box{ position: relative; height: 840px; display:flex; gap:80px; }
#animation .content .inner-box > div > *{ width: calc((100% - 80px) / 2); }
#animation .content .inner-box .img-box{ width: 100%; }
#animation .content .inner-box .scroll-box{ position: relative; width: 100%; position: absolute; top: 0; left: 0; height: 100%; }
#animation .content .inner-box .video-box{ position: relative; position: absolute; transform:translateY(-50%); top: 50%; left: calc(100% - 740px); width: 740px; height: 100%; margin-left: auto; overflow: hidden; border-radius:60px; transition:all 1s, left 0.5s; }
#animation .content .inner-box .video-box:after{ content:''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%); z-index: 1; opacity: 0; transition:all 0.5s 1.2s; }
#animation .content .inner-box .video-box video{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; min-width:100%; min-height:100%; object-fit:cover; width: 100%; }
#animation .content .inner-box .video-box.on{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; width: 100vw; height: 100vh; border-radius:0; }
#animation .content .inner-box .video-box.on:after{ opacity: 1; }
#animation .content .txt-box{ position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%;  font-family: 'S-CoreDream-6Bold';  color:#fff; text-align: center; z-index: 2;}
#animation .content .txt-box > *{ position: absolute; transform: translate(-50%, -50%); top: calc(50% + 80px); left: 50%; display:flex; flex-direction:column; align-items:center; 
justify-content:center; opacity: 0; line-height: 1.5; letter-spacing: -1.2px; font-weight: 600; width: 100%; transition:all 0.7s; z-index: 5;}
#animation .content .txt-box > *.on{ top: 50%; opacity: 1; }
#animation .content .txt-box .stxt{ margin-top: 40px;}
#animation .content .txt-box .scroll{ position: relative; position: absolute; transform:translateX(-50%); left: 50%; top: auto; bottom: 100px; border-radius:50px; width: 20px; height: 35px; 
border:2px solid #fff; z-index: 10; opacity: 1;}
#animation .content .txt-box .scroll:after{ content:''; display:block; width: 4px; height: 4px; border-radius:50%; background: #fff; position: absolute; top: 8px; left: 50%; transform:translateX(-50%);
animation: scrollMove 1.5s ease-in infinite; }

@keyframes scrollMove{
	0%{ top: 8px; }
	50%{ top: calc(100% - 10px); }
	100%{ top: 8px; }
} 

:root {
	--eduC1:#FFCD31;
	--eduC2:#F39BB3;
	--eduC3:#049DD9;
	--eduC4:#9747FF;
}


/* education */
#education{ position: relative;}
#education #contentTab{ background: rgba(255,255,255,0.05); }
#education .lineup{ background: #111; padding: 120px 0 230px; }
#education .lineup #title-box .title{ color:#fff; }
#education .lineup .content{ display:flex; flex-wrap:wrap; gap:30px; }
#education .lineup .content .item-box{ width: calc((100% - 30px) / 2); padding: 10px; border-radius:20px; display:flex; align-items:center; background: rgba(255,255,255,0.05); }
#education .lineup .content .item-box figure{ margin-right: 60px; flex-shrink:0; }
#education .lineup .content .item-box .txt-box .stxt{ color: rgba(255, 255, 255, 0.40); letter-spacing: -0.36px; font-weight: bold; }
#education .lineup .content .item-box .txt-box .title{ margin: 10px 0 20px; color:#fff; font-weight: 800; letter-spacing: -1.44px; font-family: var(--man); }
#education .lineup .content .item-box .txt-box .txt{ color: rgba(255, 255, 255, 0.60); font-weight: 300; line-height: 1.6; letter-spacing: -0.68px; }

#education .introduce{ position: relative; z-index: 2; padding: 160px 0; background: #fff; }
#education .introduce #title-box{ margin-bottom: 100px; }
#education .introduce > div > .content{ position: relative; padding-top: 150px; }
#education .introduce .content .tab-box{ position: absolute; top: 0; transform:translateX(-50%); left: 50%;  display:flex; width: 100%; }
#education .introduce .content .tab-box li{ position: relative; width: calc(100% / 4); text-align: center; padding-top: 25px; height: 190px; border-radius: 60px 60px 0px 0px; font-weight: 600;
letter-spacing: -0.48px; margin-top: 70px; transition: all 0.4s; cursor:pointer; }
#education .introduce .content .tab-box li .on{ position: absolute; top: 60px; transform:translateX(-50%); left: 50%; opacity:0; transition:all 0.3s; }
#education .introduce .content .tab-box li .off{ transition:all 0.3s; }
#education .introduce .content .tab-box li.tab01{ background: #FFF6DA; color: #F1C22E; }
#education .introduce .content .tab-box li.tab02{ background: #FFEBF0; color: #F39BB3;; }
#education .introduce .content .tab-box li.tab03{ background: #DCF3FC; color: #049DD9; }
#education .introduce .content .tab-box li.tab04{ background: #EBDCFF; color: #9747FF; }
#education .introduce .content .tab-box li.tab01.active{ background: var(--eduC1);}
#education .introduce .content .tab-box li.tab02.active{ background: var(--eduC2);}
#education .introduce .content .tab-box li.tab03.active{ background: var(--eduC3);}
#education .introduce .content .tab-box li.tab04.active{ background: var(--eduC4);}
#education .introduce .content .tab-box li.active{ margin-top: 0; }
#education .introduce .content .tab-box li.active .on{ opacity: 1; top: 25px; transition-delay: 0.2s; }
#education .introduce .content .tab-box li.active .off{ opacity: 0; }
#education .introduce .content .inner-box{ position: relative; z-index: 5; background: #fff; border-radius:40px; overflow: hidden;}
#education .introduce .content .inner-box > div{ position: relative; padding: 100px 10px 160px; display:none; }
#education .introduce .content .inner-box > div.world{ background: #FFFBED;}
#education .introduce .content .inner-box > div.culture{ background: #FFF1F5;}
#education .introduce .content .inner-box > div.earth{ background: #EAF9FF;}
#education .introduce .content .inner-box > div.shake{ background: #F7F0FF;}
#education .introduce .content .inner-box > div.active{ display:block; }
#education .introduce .content .inner-box > div:after{ content:''; display:block; width: calc(100% - 20px); height: calc(100% - 20px); border:10px solid var(--eduC1);  border-radius:40px;
position: absolute; top: 0; left: 0; pointer-events:none; }
#education .introduce .content .inner-box > div:nth-child(2):after{ border:10px solid var(--eduC2); }
#education .introduce .content .inner-box > div:nth-child(2) .title-box:before{ background: var(--eduC2);}
#education .introduce .content .inner-box > div:nth-child(3):after{ border:10px solid var(--eduC3); }
#education .introduce .content .inner-box > div:nth-child(3) .title-box:before{ background: var(--eduC3);}
#education .introduce .content .inner-box > div:nth-child(4):after{ border:10px solid var(--eduC4); }
#education .introduce .content .inner-box > div:nth-child(4) .title-box:before{ background: var(--eduC4);}

#education .introduce .content .inner-box > div .title-box{ position: relative; text-align: center; display:flex; flex-direction: column; align-items:center; margin-bottom: 80px; }
#education .introduce .content .inner-box > div .title-box:before{ content:''; display:block; width: 6px; height: 6px; border-radius:50%; background: var(--eduC1); }
#education .introduce .content .inner-box > div .title-box .title{ color:#111;  font-family: 'S-CoreDream-6Bold'; margin: 20px 0; letter-spacing: -1px; }
#education .introduce .content .inner-box > div .title-box .txt{ color:#555; font-weight: 500; line-height: 1.6; letter-spacing: -0.72px; }

#education .introduce .content .inner-box .rolling-wrap{ display:flex; }
#education .introduce .content .inner-box .rolling-wrap:not(:last-child){ margin-bottom: 20px; }
#education .introduce .content .inner-box .rolling-wrap .rolling-list{ display:flex; animation: rollingleft 38s linear infinite;}
#education .introduce .content .inner-box .rolling-wrap .rolling-list.clone{ animation: rollingleft2 38s linear infinite; }
#education .introduce .content .inner-box .rolling-wrap.right .rolling-list{ animation: rollingright 40s linear infinite; }
#education .introduce .content .inner-box .rolling-wrap.right .rolling-list.clone{ animation: rollingright2 40s linear infinite; }
#education .introduce .content .inner-box .rolling-wrap .rolling-list .img{ position: relative; width: 340px; height: 190px; border-radius:20px; overflow: hidden; flex-shrink: 0; margin-right: 20px; }
#education .introduce .content .inner-box .rolling-wrap .rolling-list .img img{ position: absolute; transform:translate(-50%, -50%); top: 50%; left: 50%; min-width:100%; min-height:100%; object-fit:cover; }
#education .introduce .content .inner-box .rolling-wrap .rolling-list .img .hover{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 35px; background: url(/img/sub/educationHover01.png) no-repeat 50% 50%; background-size:cover; opacity: 0; transition:all 0.5s; }
#education .introduce .content .inner-box .rolling-wrap .rolling-list .img .hover .stxt{ color: rgba(255, 255, 255, 0.80); line-height: 1.5; letter-spacing: -0.68px; font-weight: 600; 
margin-bottom: 10px;}
#education .introduce .content .inner-box .rolling-wrap .rolling-list .img .hover .title{ color:#fff; font-family: 'S-CoreDream-7ExtraBold'; line-height: 1.5; letter-spacing: -1.28px; }
#education .introduce .content .inner-box .rolling-wrap:hover .rolling-list{ animation-play-state: paused !important; }
#education .introduce .content .inner-box .rolling-wrap .rolling-list .img:hover .hover{ opacity: 1; }

#education .introduce .content .inner-box .culture > div:not(:last-child){ margin-bottom: 120px; }
#education .introduce .content .inner-box .culture .book .content{ max-width:1120px; margin: 0 auto; width: 100%; }
#education .introduce .content .inner-box .culture .book .content > div{ position: relative; display:flex; justify-content: center; transform:rotate(180deg) }
#education .introduce .content .inner-box .culture .book .content > div:not(:last-child){ margin-bottom: 20px;}
#education .introduce .content .inner-box .culture .book .content .item-box{ position: relative; width: 320px; height: 180px; transition:all 0.5s; flex-shrink:0; background: #fff; border-radius:5px; }
#education .introduce .content .inner-box .culture .book .content .item-box:not(:first-child){ margin-left: -120px; }
#education .introduce .content .inner-box .culture .book .content .item-box img{ max-width:none; transition:all 0.5s; position: absolute; transform:translate(-50%,-50%) rotate(180deg); top: 50%; left: 50%; width: 100%; }
#education .introduce .content .inner-box .culture .book .content > div:hover{ z-index: 5;}
#education .introduce .content .inner-box .culture .book .content .item-box.on img{ transform: translate(-50%, -50%) rotate(180deg) scale(1.4); opacity: 1; }
#education .introduce .content .inner-box .culture .book .content .item-box.on img{ z-index: 40; border-radius:20px; }
#education .introduce .content .inner-box .culture .book .content .item-box.off img{ opacity: 0.2; }

#education .introduce .content .inner-box .earth .rolling-wrap .rolling-list .img .hover{ background: url(/img/sub/educationHover02.png) no-repeat 50% 50%;}
#education .introduce .content .inner-box .earth .rolling-wrap.right .rolling-list{ animation: rollingright 30s linear infinite; }
#education .introduce .content .inner-box .earth .rolling-wrap.right .rolling-list.clone{ animation: rollingright2 30s linear infinite; }

#education .introduce .content .inner-box .shake .content{ max-width:1300px; margin: 0 auto; width: 100%; display:flex; gap:20px; position: relative; z-index: 2; }
#education .introduce .content .inner-box .shake .content .item-box{ position: relative; width: calc((100% - 100px) / 6); }
#education .introduce .content .inner-box .shake .content .item-box figure{ position: relative; padding-top: 65px; text-align: center; }
#education .introduce .content .inner-box .shake .content .item-box figure .cd{ position: absolute; top: 30%; transform:translateX(-50%); left: 50%; z-index: -1; opacity: 0; transition:all 0.5s 0.2s; }
#education .introduce .content .inner-box .shake .content .item-box .txt-box{ text-align: center; margin-top: 20px; }
#education .introduce .content .inner-box .shake .content .item-box .txt-box .title{ color:#111; font-weight: bold; letter-spacing: -0.8px; margin-bottom: 10px;}
#education .introduce .content .inner-box .shake .content .item-box .txt-box .txt{ color: rgba(17, 17, 17, 0.70); font-weight: 300; line-height: 1.5; letter-spacing: -0.64px; }
#education .introduce .content .inner-box .shake .content.active .item-box figure .cd{ opacity: 1; top: 0;}


/* business */
#business section{ padding: 160px 0; }
#business .content.imgtxt-box .item-box{ display:flex; align-items:center; justify-content:space-between; }
#business .content.imgtxt-box .item-box:not(:last-child){ margin-bottom: 60px; }
#business .content.imgtxt-box .item-box .txt-box{ width: 50%; padding-left: 70px; }
#business .content.imgtxt-box .item-box .txt-box .stxt{ font-weight: 500; color:#111; margin-bottom: 10px; letter-spacing: -0.36px; }
#business .content.imgtxt-box .item-box .txt-box .title{ color:#111; font-family: 'S-CoreDream-6Bold'; letter-spacing: -0.8px; margin-bottom: 30px; line-height: 1.5; }
#business .content.imgtxt-box .item-box .txt-box span{ color:var(--mainC); font-weight: 600; }
#business .content.imgtxt-box .item-box .txt-box .txt{ color:#333; font-weight: 300; letter-spacing: -0.36px; line-height: 1.6; }
#business .content.imgtxt-box .item-box .txt-box .txt:not(:last-child){ margin-bottom: 20px; }
#business .content.imgtxt-box .item-box.type2 .txt-box span{ color:#FF658F; }

#business .inquiry{ background: #FFF9E5; border-radius:20px; text-align: center; padding: 60px 20px 75px; margin-bottom: 120px; }
#business .inquiry .txt{ color:#333; font-weight: 500; line-height: 1.6; letter-spacing: -0.48px; margin: 30px 0 55px; }
#business .inquiry .txt span{ color:#ff8418; font-weight: bold; }
#business .inquiry .inner-box{ position: relative; background: #fff; max-width:820px; margin: 0 auto; padding: 40px;}
#business .inquiry .inner-box figure{ position: absolute; top: -23px; animation: imgMove 2s ease-in-out infinite; }
#business .inquiry .inner-box figure.left{ left: -43px; }
#business .inquiry .inner-box figure.right{ right: -52px; animation-delay:0.3s; }
#business .inquiry .inner-box .title{ color:#333; letter-spacing: -0.6px; font-weight: bold; }
#business .inquiry .inner-box .txt1{ margin: 25px 0 5px; color:#bbb; font-weight:bold; letter-spacing: -0.36px; }
#business .inquiry .inner-box .txt2{ color:#111; font-family: var(--man); font-weight: 500; letter-spacing: -0.4px; }

#business .introduce .title-box { text-align: center; margin-bottom: 60px; }
#business .introduce .title-box .num{ width: 46px; height: 46px; background: #049DD9; color:#fff; border-radius:50%; font-family: var(--man); font-weight: bold; letter-spacing: -0.36px;
display:inline-flex; justify-content:center; align-items:center;  } 
#business .introduce .title-box .title{ margin: 30px 0 15px; color:#111; font-weight: bold; letter-spacing: -0.92px; }
#business .introduce .title-box .txt{ font-weight: 300; line-height: 1.6; letter-spacing: -0.4px; color:#111; }
#business .introduce .product{ margin-bottom: 140px; }
#business .introduce .product .content{ display:grid; grid-template-columns: repeat(4,1fr); gap:20px; }
#business .introduce .product .content .item-box{ background: #F9F9F9; border-radius:20px; padding: 30px; text-align: center; display: flex; flex-direction: column; justify-content: space-between;}
#business .introduce .product .content .item-box .title{ color:#151515; font-weight: 500; letter-spacing: -0.4px; font-family: 'S-CoreDream-5Medium'; margin-bottom: 30px;}
#business .introduce .product .content .item-box figure{ display:flex; justify-content:space-between; }
#business .introduce .product .content .item-box.type2{ grid-column: auto / span 2; }
#business .introduce .product .content .item-box.type3{ grid-row: auto / span 2; }
#business .introduce .product .content .item-box.type4{ grid-column: auto / span 4; padding: 30px 80px; }

#business .license{ background: #F6FCFF; }

@keyframes imgMove {
	0%{ transform: translateY(0px);}
	50%{ transform: translateY(-30px);}
	100%{ transform: translateY(0px);}
}

#business .license .bell .title-box{ text-align: center; }
#business .license .bell .title-box .title{ display:inline-block; background: #fff; border-radius:50px; border:1px solid var(--mainC); padding: 20px 50px; font-weight: bold; color:var(--mainC);
letter-spacing: -0.6px; margin-bottom: 30px; }
#business .license .bell .title-box .txt{ color:#111; font-weight: 500; line-height: 1.6; letter-spacing: -0.48px;}
#business .license .bell .title-box .txt span{ color:var(--mainC); }
#business .license .bell .content{ margin: 100px 0;}
#business .license .bell .memory .txt-box{ text-align: center;  }
#business .license .bell .memory .txt-box .title{ display:flex; justify-content:center; align-items:center; font-family: 'S-CoreDream-6Bold'; margin-bottom: 30px; color:#111; line-height: 1.5; letter-spacing: -0.8px; gap:20px; }
#business .license .bell .memory .txt-box .title:after,
#business .license .bell .memory .txt-box .title:before{ content:''; width: 8px; height: 8px; border-radius:50%; background: var(--mainC); }
#business .license .bell .memory .txt-box .txt{ color:#333; font-weight: 300; line-height: 1.6; letter-spacing: -0.36px; }
#business .license .bell .memory .img-box{ display:flex; align-items:center; gap:20px; margin: 55px 0 60px;}
#business .license .bell .memory .link-box{ display:flex; justify-content:center; padding: 50px 20px; background: #E9F7FF; border-radius:20px; }
#business .license .bell .memory .link-box p:not(:last-child){ margin-right: 30px;}

#business .event .inquiry{ background: #FFF6F9; margin-bottom: 60px;}
#business .event .inquiry .txt span{ color: #FF658F; }
#business .event .inquiry .inner-box figure.left{ top: auto; bottom: -35px; }
#business .event .content{ display:flex; flex-wrap:wrap; gap:20px;  }
#business .event .content .item-box{ width: calc((100% - 20px) / 2); background: #F9F9F9; border-radius:20px; padding: 40px; }
#business .event .content .item-box .inner-box .title-box{ margin-bottom: 65px; }
#business .event .content .item-box .inner-box .title-box .title{ display:flex; justify-content:space-between; color:#222; font-weight: bold; letter-spacing: -0.6px; margin-bottom: 15px;}
#business .event .content .item-box .inner-box .title-box .title span{ color:#999; font-family: var(--man); font-weight: 600; letter-spacing: -0.32px; flex-shrink:0; }
#business .event .content .item-box .inner-box .title-box .txt{ color:#999; font-weight: 500; letter-spacing: -0.34px; }
#business .event .content .item-box .inner-box .img-box{ display:flex; justify-content:space-between; align-items:flex-end; }
#business .event .content .item-box .inner-box .img-box div{ display:flex; width: 100%; cursor:pointer; }
#business .event .content .item-box .inner-box .img-box div figure{ width: calc((100% - 40px) / 5);}
#business .event .content .item-box .inner-box .img-box div figure:not(:last-child){ margin-right: 10px;}
#business .event .content .item-box .inner-box .img-box button{ color:var(--mainC); font-weight: 500; letter-spacing: -0.34px; margin-left: 45px; flex-shrink:0; }
#business .event .content .item-box .popup{ position: fixed; transform:translate(-50%,-50%); top: 50%; left: 50%; z-index: 100002; display:none; }
#business .event .content .item-box .popup .slide-box{ position: relative; max-width:940px; overflow: hidden;}
#business .event .content .item-box .popup .slide-box .swiper-slide{ text-align: center; } 
#business .event .content .item-box .popup .slide-arrow figure{ width: 80px; height: 80px; border-radius:50%; background: #fff; display:flex; align-items:center; justify-content:center;
cursor:pointer; position:absolute; transform:translateY(-50%); top: 50%; z-index: 5;}
#business .event .content .item-box .popup .slide-arrow figure img{ filter:invert(1); -webkit-filter:invert(1); }
#business .event .content .item-box .popup .slide-arrow figure.prev{ left: -110px;}
#business .event .content .item-box .popup .slide-arrow figure.next{ right: -110px;}

#business .performance{ background: #F8F8F8; }
#business .performance .w1560 > div:not(:last-child){ margin-bottom: 100px; }
#business .performance .w1560 > div:last-child .txt-box{ padding-left: 0; }
#business .performance #link{ margin-top: 60px; display: inline-block; }

#contact{ padding: 140px 0 200px; }
#contact #title-box{ margin-bottom: 110px; }
#contact .content{ display:flex; gap: 20px; flex-wrap:wrap; }
#contact .content .item-box{ width: calc((100% - 20px) / 2); border-radius:20px; padding: 40px 60px; }
#contact .content .item-box .title{ margin: 30px 0 15px; font-family: 'S-CoreDream-7ExtraBold'; letter-spacing: -0.48px; }
#contact .content .item-box .txt{ color:#555; font-weight: 500; letter-spacing: -0.44px; }
#contact .content .item-box figure img{ animation: characterMove 2s forwards infinite }
#contact .content .item-box.item01{ background: #EDF6FF; }
#contact .content .item-box.item01 .title{ color: #0075DF; }
#contact .content .item-box.item02{ background: #F9FFF1; }
#contact .content .item-box.item02 .title{ color: #009D66; }
#contact .content .item-box.item03{ background: #FFFBEE; }
#contact .content .item-box.item03 .title{ color: #FF9634; }
#contact .content .item-box.item04{ background: #FFF8FA; }
#contact .content .item-box.item04 .title{ color: #FF6491; }

@keyframes characterMove{
	0%{ transform: rotate(-10deg);}
	50%{ transform: rotate(10deg);}
	100%{ transform: rotate(-10deg);}
}