@charset "utf-8";



/* header */
#htl_header {display:flex; justify-content:space-between; align-items:center; width:100%; height:124px; padding:0 4.2%; position:fixed; left:0; top:0; z-index:500; transition:all 0.4s; transition-property:background, height;}
#htl_header:after {content:''; display:block; width:100%; height:120px; background:#fff; box-shadow:0 1px 0 #eee inset, 0 15px 10px rgba(25,25,25,0.05); position:absolute; left:0; top:100%; transform:scaleY(0); transition:all 0.4s; transform-origin:top;}

#htl_header .h_util {display:flex; align-items:center; gap:0 33px; position:relative; z-index:10;}
#htl_header .h_lang {position:relative;}
#htl_header .h_lang button {display:block; font-size:0.875em; color:#fff; font-weight:700; line-height:1.5em; font-family:var(--font-baijamjuree); transition:color 0.4s;}
#htl_header .h_lang button:before {content:'\f0ac'; font-size:1.42em; font-weight:400; font-family:'Font Awesome 6 Pro'; margin-right:8px; vertical-align:middle;}
#htl_header .h_lang button:after {content:'\f107'; font-size:1em; font-weight:400; font-family:'Font Awesome 6 Pro'; margin-left:8px;}
#htl_header .h_lang ul {width:80px; background:#fff; border-radius:12px; box-shadow:0 0 10px 0 rgba(0, 0, 0, .08), 0 4px 4px 0 rgba(0, 0, 0, .08); position:absolute; left:50%; top:100%; margin-top:15px; transform:translateX(-50%); opacity:0; visibility:hidden; transition:all 0.4s; transition-property:opacity, visibility;}
#htl_header .h_lang ul li a {display:block; font-size:0.875em; line-height:1.4em; padding:10px 0; text-align:center; transition:coor 0.4s;}
#htl_header .h_lang ul li a:hover {color:#005bff;}
#htl_header .h_lang.on button:after {content:'\f106'}
#htl_header .h_lang.on ul {opacity:1; visibility:visible;}

#htl_logo {width:100px; height:60px; background:url(../images/logo_w.svg) no-repeat center center; background-size:contain; position:relative; z-index:10;}
#htl_logo a {display:block; width:100%; height:100%;}

#htl_gnb {width:100%; position:absolute; left:0; top:0; z-index:5;}
#htl_gnb > ul {display:flex; justify-content:center; width:100%;}
#htl_gnb > ul > li > a {display:block; font-size:1.25em; color:#fff; line-height:124px; font-weight:700; font-family:var(--font-baijamjuree); padding:0 32px; transition:all 0.4s; transition-property:color, line-height;}
#htl_gnb > ul > li:hover > a {color:#005bff !important}
#htl_gnb > ul > li > ul {display:none; width:100%; position:absolute; left:50%; top:100%; padding:0 4.2%; transform:translateX(-50%); text-align:center; overflow:hidden;}
#htl_gnb > ul > li > ul > li {display:inline-block;}
#htl_gnb > ul > li > ul > li > a {display:block; font-size:1.125em; font-weight:500; line-height:120px; font-family:var(--font-baijamjuree); padding:0 40px; transition:color 0.4s;}
#htl_gnb > ul > li > ul > li > a:hover {color:#005bff !important;}

#all_gnb {width:100%; height:100vh; background:rgba(51,56,60,0.4); backdrop-filter:blur(12px); position:fixed; left:0; top:0; z-index:20; opacity:0; visibility:hidden;}
#all_gnb > div {width:91.6%; max-width:1760px; margin:0 auto; padding:120px 0 60px; position:relative;}
#all_gnb > div > ul {display:flex; justify-content:space-between; width:100%; max-width:1500px; background:#fff; border-radius:24px; padding:80px 100px; margin:0 auto;}
#all_gnb > div > ul > li {width:16%;}
#all_gnb > div > ul > li > a {display:block; border-bottom:1px solid #ddd; font-size:1.5em; line-height:1.4em; font-weight:600; font-family:var(--font-baijamjuree); margin-bottom:32px; padding-bottom:32px; transition:color 0.4s;}
#all_gnb > div > ul > li > ul > li {margin-bottom:20px;}
#all_gnb > div > ul > li > ul > li:last-child {margin-bottom:0;}
#all_gnb > div > ul > li > ul > li > a {display:block; font-size:1em; font-weight:600; font-family:var(--font-baijamjuree); transition:color 0.4s;}
#all_gnb .copy {font-size:1em; color:#fff; text-align:center; margin-top:40px;}

#menuOpen {display:block; width:30px; height:24px; position:relative;}
#menuOpen span {display:block; width:100%; height:2px; background:#fff; position:absolute; transition:background 0.4s}
#menuOpen span:nth-child(1), #menuOpen span:nth-child(3) {width:calc(50% + 1px)}
#menuOpen span:nth-child(1) {left:0; top:0;}
#menuOpen span:nth-child(2) {left:0; top:50%; margin-top:-1px;}
#menuOpen span:nth-child(3) {right:0; bottom:0;}

#menuClose {display:block; width:80px; height:80px; font-size:2em; color:#fff; text-align:right; position:absolute; right:0; top:15px;}


#htl_header.sub_header .h_lang button {color:#191919;}
#htl_header.sub_header #htl_logo {background-image:url(../images/logo.svg)}
#htl_header.sub_header #htl_gnb > ul > li > a {color:#191919;}
#htl_header.sub_header #menuOpen span {background:#191919;}

#htl_header.hover {background:#fff;}
#htl_header.hover:after {transform:scaleY(1)}
#htl_header.hover .h_lang button {color:#191919;}
#htl_header.hover #htl_logo {background-image:url(../images/logo.svg)}
#htl_header.hover #htl_gnb > ul > li > a {color:#191919;}
#htl_header.hover #menuOpen span {background:#191919;}

#htl_header.on #all_gnb {opacity:1; visibility:visible;}

#htl_header.scroll_on {background:#fff;}
#htl_header.scroll_on .h_lang button {color:#191919;}
#htl_header.scroll_on #htl_logo {background-image:url(../images/logo.svg)}
#htl_header.scroll_on #htl_gnb > ul > li > a {color:#191919;}
#htl_header.scroll_on #menuOpen span {background:#191919;}


@media screen and (min-width:1025px){
    #all_gnb {transition:all 0.6s; transition-property:opacity, visibility;}
    #all_gnb > div > ul > li > ul {display:block !important;}
    #all_gnb > div > ul > li:hover > a {color:#005bff;}
    #all_gnb > div > ul > li > ul > li > a:hover {color:#005bff;}

    #htl_header.scroll_on {height:90px;}
    #htl_header.scroll_on #htl_gnb > ul > li > a {line-height:90px;}

}

@media screen and (max-width:1220px){
    #htl_gnb > ul > li > a {padding:0 20px;}
    #htl_gnb > ul > li > ul > li > a {padding:0 25px;}

    #all_gnb > div > ul {padding:60px;}
}

@media screen and (max-width:1024px){
    #htl_header {height:55px; padding:0 6%;}

    #htl_header .h_util {gap:0 20px;}
    #htl_header .h_lang button:before {font-size:1.2em;}
    #htl_header .h_lang ul {width:70px; border-radius:6px;}

    #htl_logo {width:67px; height:40px; z-index:30;}

    #htl_gnb {display:none;}

    #all_gnb {background:#fff; backdrop-filter:blur(0); clip-path:circle(0px at 100% 0%); transition:clip-path ease 0.6s, opacity 0s 0.6s, visibility 0s 0.6s;}
    #all_gnb > div {width:88%; padding:80px 0;}
    #all_gnb > div > ul {display:block; border-radius:0; padding:0;}
    #all_gnb > div > ul > li {width:100%;}
    #all_gnb > div > ul > li > a {border-bottom:0; margin-bottom:0; padding:12px 0; position:relative;}
    #all_gnb > div > ul > li > a:after {content:'\f107'; font-size:0.8em; font-weight:400; font-family:'Font Awesome 6 Pro'; position:absolute; right:0; top:50%; transform:translateY(-50%)}
    #all_gnb > div > ul > li > a.on:after {content:'\f106'}
    #all_gnb > div > ul > li > ul {display:none; padding-bottom:12px;}
    #all_gnb > div > ul > li > ul > li {margin-bottom:12px;}
	#all_gnb > div > ul > li > ul > li > a {color:#666; font-weight:400;}
    #all_gnb .copy {display:none;}

    #menuOpen {width:22px; height:16px;}

    #menuClose {width:22px; height:55px; font-size:2em; color:#191919; text-align:center; top:0;}


    #htl_header.on #htl_logo {background-image:url(../images/logo.svg)}

    #htl_header.on #all_gnb {clip-path:circle(1500px at 100% 0%); transition:clip-path ease 0.6s, opacity 0s 0s, visibility 0s 0s;}
}


/* footer */
#htl_footer {width:100%; background:#191919; padding:55px 0;}
#htl_footer .box1 {display:flex; flex-wrap:wrap; width:100%; position:relative;}
#htl_footer .f_logo {width:94px}
#htl_footer .f_logo img {width:100%;}
#htl_footer .f_info {width:calc(100% - 94px); padding-left:32px;}
#htl_footer .f_info li {display:inline-block; font-size:1em; color:#fff; line-height:1.5em; margin:0 16px 8px 0;}
#htl_footer .f_info li strong {color:#666; font-weight:600; margin-right:8px;}
#htl_footer .f_info li a {color:#fff;}
#htl_footer .go_top {display:block; width:48px; height:48px; background:none; border:1px solid #fff; border-radius:50%; font-size:1em; color:#fff; position:absolute; right:0; top:0;}
#htl_footer .box2 {display:flex; justify-content:end; align-items:center; gap:8px; width:100%; border-top:1px solid #666; margin-top:30px; padding-top:16px;}
#htl_footer .copy {font-size:1em; color:#fff; font-weight:600;}
#htl_footer .f_member {display:flex; align-items:center; gap:4px;}
#htl_footer .f_member a {display:block; border:1px solid #666; border-radius:20px; font-size:0.875em; color:#666; padding:4px 10px; transition:all 0.4s; transition-property:background, border, color;}
#htl_footer .f_member a:hover {background:#005bff; border-color:#005bff; color:#fff;}

@media screen and (max-width:1024px){
    #htl_footer {padding:5.5% 0;}
    #htl_footer .box1 {padding-right:45px;}
    #htl_footer .f_logo {width:80px;}
    #htl_footer .f_info {width:calc(100% - 80px); padding-left:25px;}
    #htl_footer .f_info br {display:none;}
    #htl_footer .f_info li {margin:0 10px 5px 0;}
    #htl_footer .f_info li strong {margin-right:5px;}
    #htl_footer .go_top {width:42px; height:42px;}
    #htl_footer .box2 {margin-top:3%; padding-top:3%;}
}
@media screen and (max-width:767px){
    #htl_footer .box1 {padding-right:0;}
    #htl_footer .f_logo {width:60px;}
    #htl_footer .f_info {width:100%; padding-left:0; margin-top:3%;}
    #htl_footer .f_info li {font-size:0.9375em; margin:0 8px 3px 0;}
    #htl_footer .f_info li strong {margin-right:3px;}
    #htl_footer .go_top {width:32px; height:32px; font-size:0.9375em;}
	#htl_footer .box2 {justify-content:space-between;}
	#htl_footer .copy {font-size:0.9375em; }
    #htl_footer .f_member a {padding:3px 8px;}
}


/* main */
#mVisu {width:100%; height:100vh; overflow:hidden;}
.mVisu_slide {width:100%; height:100%; position:relative;}
.mVisu_slide .swiper-slide {display:flex; justify-content:center; align-items:center;}
.mVisu_slide .img_box {width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; position:absolute; left:0; top:0; transform:scale(1.2);}
.mVisu_slide .img_box.bg1 {background-color:#0a327a;}
.mVisu_slide .img_box.bg2 {background-color:#191919;}
.mVisu_slide .txt_box {position:relative; z-index:10;}
.mVisu_slide .txt_box .tit {font-size:6.875em; color:#fff; line-height:1.04em; font-weight:600; font-family:var(--font-baijamjuree); opacity:0; transform:translateY(100px);}
.mVisu_slide .txt_box .txt {font-size:1.5em; color:#fff; line-height:1.4em; font-weight:600; margin-top:32px; opacity:0; transform:translateY(100px);}
.mVisu_slide .util_box {display:flex; flex-wrap:wrap; gap:0 8px; position:absolute; left:50%; top:50%; transform:translateX(-50%); margin-top:275px; z-index:30;}
.mVisu_slide .util_box .progress_bar {display:block; width:100%; height:2px; background:rgba(255,255,255,0.2); margin-bottom:24px;}
.mVisu_slide .util_box .progress_bar div {display:block; width:0; height:2px; background:#fff; transition:width 6s ease-out}
.mVisu_slide .util_box .progress_bar div.no_transition {transition:none;}
.mVisu_slide .swiper-button-prev, .mVisu_slide .swiper-button-next {display:flex; justify-content:center; align-items:center; width:48px; height:48px; background:rgba(255,255,255,0.2); border-radius:50%; font-size:1.125em; color:#fff; position:relative; left:0; top:0; right:0; margin-top:0; transition:all 0.4s; transition-property:background;}
.mVisu_slide .swiper-button-prev:hover, .mVisu_slide .swiper-button-next:hover {background:#005bff}
.mVisu_slide .swiper-button-prev:after, .mVisu_slide .swiper-button-next:after {font-size:1em; font-weight:400; font-family:'Font Awesome 6 Pro'}
.mVisu_slide .swiper-button-prev:after {content:'\f060'}
.mVisu_slide .swiper-button-next:after {content:'\f061'}

.mVisu_slide .swiper-slide-active .img_box {transform:scale(1); transition:transform 5500ms ease-in-out;}
.mVisu_slide .swiper-slide-active .txt_box .tit {opacity:1; transform:translateY(0);  transition:all 1.2s; transition-property:opacity, transform;}
.mVisu_slide .swiper-slide-active .txt_box .txt {opacity:1; transform:translateY(0);  transition:all 1.2s 0.5s; transition-property:opacity, transform;}

@media screen and (max-width:1220px){
    .mVisu_slide .txt_box .tit {font-size:9vw;}
}

@media screen and (max-width:1024px){
    .mVisu_slide .txt_box .tit {font-size:4.7em;}
    .mVisu_slide .txt_box .txt {font-size:1.3em; margin-top:20px;}
    .mVisu_slide .util_box {gap:0 5px; margin-top:170px;}
    .mVisu_slide .swiper-button-prev, .mVisu_slide .swiper-button-next {width:42px; height:42px; font-size:1em;}
}

@media screen and (max-width:767px){
    .mVisu_slide .txt_box {margin-top:-30px;}
    .mVisu_slide .txt_box .tit {font-size:8vw;}
    .mVisu_slide .txt_box .txt {font-size:1em; margin-top:15px;}
    .mVisu_slide .util_box {gap:0 5px; margin-top:170px; margin-top:calc(9vw + 45px);}
    .mVisu_slide .util_box .progress_bar {margin-bottom:15px;}
    .mVisu_slide .swiper-button-prev, .mVisu_slide .swiper-button-next {width:32px; height:32px; font-size:0.9375em;}
}


.main_title h2 {align-items:end; font-size:1.875em; line-height:1.3em; font-weight:600; font-family:var(--font-baijamjuree); margin-bottom:40px;}
.main_title h2:after {content:''; display:inline-block; width:8px; height:8px; background:#005bff; border-radius:50%; margin-left:8px;}
.main_title .tit {font-size:4.375em; line-height:1.14em; font-weight:600; font-family:var(--font-baijamjuree)}
.main_title .txt {font-size:1.25em; color:#666; line-height:1.5em; margin-top:24px;}
.main_title.white .tit {color:#fff;}
.main_title.white .txt {color:#fff;}

@media screen and (max-width:1220px){
    .main_title .tit {font-size:3.5em;}
}

@media screen and (max-width:1024px){
    .main_title h2 {font-size:1.5em; margin-bottom:20px;}
    .main_title h2:after {width:6px; height:6px;}
    .main_title .tit {font-size:3em;}
    .main_title .txt {font-size:1.125em; margin-top:15px;}
}

@media screen and (max-width:767px){
    .main_title h2 {font-size:1.3em; margin-bottom:3%;}
    .main_title h2:after {width:4px; height:4px; margin-left:5px;}
    .main_title .tit {font-size:2.3em;}
    .main_title .txt {font-size:1em; margin-top:1.5%;}
}


#mBusiness {display:flex; align-items:start; flex-wrap:wrap; padding:200px 0; position:relative;}
#mBusiness .main_title {width:38%; position:sticky; left:0; top:140px; padding-right:15px;}
#mBusiness .box {display:flex; justify-content:space-between; flex-wrap:wrap; width:62%;}
#mBusiness .box > div {width:calc(50% - 28px); margin-bottom:140px;}
#mBusiness .box > div:last-child {margin-bottom:0;}
#mBusiness .box > div:nth-child(even) {transform:translateY(20vw)}
#mBusiness .box > div .img_box {width:100%; border-radius:30px; overflow:hidden; clip-path:inset(50%); opacity:0; transition:all 1s ease-in-out; transition-property:clip-path, opacity;}
#mBusiness .box > div .img_box div {width:100%; height:0; padding-bottom:100%; background-repeat:no-repeat; background-position:center center; background-size:cover;}
#mBusiness .box > div dl {margin-top:32px;}
#mBusiness .box > div dl dt {font-size:1.875em; line-height:1.33em; font-weight:600; font-family:var(--font-baijamjuree);}
#mBusiness .box > div dl dd {font-size:1.25em; color:#666; line-height:1.5em; margin-top:8px;}
#mBusiness .box > div.active .img_box {clip-path:inset(0); opacity:1; transition-delay:0.1s;}

@media screen and (max-width:1760px){
    #mBusiness .box > div dl dd br {display:none;}
}

@media screen and (max-width:1220px){
    #mBusiness .box > div {width:calc(50% - 15px)}
}

@media screen and (max-width:1024px){
    #mBusiness {padding:20% 0;}
    #mBusiness .main_title {width:100%; position:relative; top:0; padding-right:0; margin-bottom:5%;}
    #mBusiness .box {width:100%;}
    #mBusiness .box > div {margin-bottom:14%;}
    #mBusiness .box > div:nth-child(even) {transform:translateY(30vw)}
    #mBusiness .box > div .img_box {border-radius:15px;}
    #mBusiness .box > div dl {margin-top:20px;}
    #mBusiness .box > div dl dt {font-size:1.5em;}
    #mBusiness .box > div dl dd {font-size:1.125em; margin-top:5px;}
}

@media screen and (max-width:767px){
    #mBusiness .box > div {width:100%; margin-bottom:10%;}
    #mBusiness .box > div:nth-child(even) {transform:translateY(0)}
    #mBusiness .box > div .img_box {border-radius:10px;}
    #mBusiness .box > div dl {margin-top:3%;}
    #mBusiness .box > div dl dt {font-size:1.3em;}
    #mBusiness .box > div dl dd {font-size:1em; margin-top:1%;}
}


#mTechnology {width:100%; height:250vh; position:relative;}
#mTechnology > div {width:100%; height:100vh; position:sticky; left:0; top:0; overflow:hidden;}
#mTechnology > div > div {width:100%; height:100%; position:absolute; left:0; top:0;}
#mTechnology .txt_box {display:flex; justify-content:center; align-items:center; flex-direction:column;}
#mTechnology .txt_box .tit {font-size:4.375em; line-height:1.2em; font-weight:600; text-align:center; position:relative; z-index:5;}
#mTechnology .txt_box .icon {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); z-index:10;}
#mTechnology .txt_box .bg {width:100%; height:100%; background:#0a327a url(../images/mTechnologyBG.png) no-repeat center center; background-size:cover; position:absolute; left:0; top:0; z-index:0;}
#mTechnology .backward {clip-path:inset(50% 50% round 0px); will-change:clip-path; z-index:7;}
#mTechnology .content {display:flex; justify-content:center; align-items:center; opacity:0; visibility:hidden; z-index:10;}
.mTechnology_slide {width:100%; max-width:816px; margin:44px auto 0;}
.mTechnology_slide .swiper-slide {display:flex; justify-content:center; align-items:center; height:474px;}
.mTechnology_slide .box {display:flex; justify-content:center; align-items:center; width:calc(100% - 24px); height:calc(100% - 24px); background:rgba(255,255,255,0.2); backdrop-filter:blur(50px); border-radius:30px; position:relative; transition:all 0.4s; transition-property:width, height, background;}
.mTechnology_slide .box:before {content:'\2b'; display:flex; justify-content:center; align-items:center; width:32px; height:32px; background:rgba(255,255,255,0.2); border-radius:50%; font-size:0.875em; color:#fff; font-weight:400; font-family:'Font Awesome 6 Pro'; position:absolute; right:24px; top:24px; transition:all 0.4s; transition-property:opacity, visibility;}
.mTechnology_slide .tit {font-size:1.875em; color:#fff; font-weight:600; font-family:var(--font-baijamjuree); text-align:center; transition:all 0.4s; transition-property:opacity, visibility;}
.mTechnology_slide .box > div {width:100%; height:100%; padding:40px; position:absolute; left:0; top:0;}
.mTechnology_slide .box > div dl dt {font-size:1.875em; color:#005bff; font-weight:600; font-family:var(--font-baijamjuree); overflow:hidden;}
.mTechnology_slide .box > div dl dd {font-size:1.25em; color:#666; line-height:1.5em; margin-top:16px; overflow:hidden;}
.mTechnology_slide .box > div dl p {transform:translateY(100%); transition:all 0.4s; transition-property:opacity, transform;}
.mTechnology_slide .box > div a {font-size:1em; font-weight:600; position:absolute; left:40px; bottom:40px; overflow:hidden;}
.mTechnology_slide .box > div a span {display:flex; align-items:center; width:fit-content; transform:translateY(100%); transition:all 0.4s; transition-property:opacity, transform; position:relative;}
.mTechnology_slide .box > div a span:after {content:'\f061'; display:flex; justify-content:center; align-items:center; width:32px; height:32px; background:#005bff; border-radius:50%; font-size:0.875em; color:#fff; font-weight:400; font-family:'Font Awesome 6 Pro'; margin-left:8px; position:relative}
.mTechnology_slide .box > div a span:before {content:''; width:32px; height:32px; background:#005bff; border-radius:50%; opacity:0.4; position:absolute; right:0; top:0; transform:scale3d(0.5, 0.5, 1);}

.mTechnology_slide .box > div a:hover {overflow:visible;}
.mTechnology_slide .box > div a:hover span:after {animation:btnMotion1 0.3s forwards;}
.mTechnology_slide .box > div a:hover span:before {animation:btnMotion2 0.3s 0.3s forwards}

@keyframes btnMotion1 {
	60% {
		transform: scale3d(0.5, 0.5, 1);
	}
	85% {
		transform: scale3d(1.1, 1.1, 1);
	}
	100% {
		transform: scale3d(1, 1, 1);
	}
}
@keyframes btnMotion2 {
    from {
        opacity:0.4;
        transform:scale3d(0.5, 0.5, 1)
    }
	to {
		opacity: 0;
		transform: scale3d(1.5, 1.5, 1);
	}
}

@media screen and (min-width:768px){
    .mTechnology_slide .on .box {width:100%; height:100%; background:#fff;}
    .mTechnology_slide .on .box:before {opacity:0; visibility:hidden;}
    .mTechnology_slide .on .tit {opacity:0; visibility:hidden;}
    .mTechnology_slide .on .box > div dl p {transform:translateY(0)}
    .mTechnology_slide .on .box > div > a span {transform:translateY(0)}
}

@media screen and (max-width:1024px){
    #mTechnology .txt_box .tit {font-size:3.3em;}
    #mTechnology .txt_box .icon img {width:30px;}
    .mTechnology_slide {max-width:700px; margin-top:5%;}
    .mTechnology_slide .swiper-slide {height:400px;}
    .mTechnology_slide .box {border-radius:15px;}
    .mTechnology_slide .box:before {width:30px; height:30px; right:15px; top:15px;}
    .mTechnology_slide .tit {font-size:1.5em;}
    .mTechnology_slide .box > div {padding:20px;}
    .mTechnology_slide .box > div dl dt {font-size:1.5em;}
    .mTechnology_slide .box > div dl dd {font-size:1.125em; margin-top:10px;}
    .mTechnology_slide .box > div a {left:20px; bottom:20px;}
    .mTechnology_slide .box > div a span:after, .mTechnology_slide .box > div a span:before {width:30px; height:30px;}
}

@media screen and (max-width:767px){
    #mTechnology .txt_box .tit {font-size:2.3em;}
    #mTechnology .txt_box .icon img {width:25px;}
    .mTechnology_slide {max-width:300px; margin-top:5%;}
    .mTechnology_slide .swiper-slide {height:340px;}
    .mTechnology_slide .box {width:100%; border-radius:10px;}
    .mTechnology_slide .tit {font-size:1.3em;}
    .mTechnology_slide .box > div dl dt {font-size:1.3em;}
    .mTechnology_slide .box > div dl dd {font-size:1em; margin-top:1.5%;}
    .mTechnology_slide .box > div a span:after, .mTechnology_slide .box > div a span:before {width:28px; height:28px;}
    
    .mTechnology_slide .swiper-slide-active .box {width:100%; height:100%; background:#fff;}
    .mTechnology_slide .swiper-slide-active .box:before {opacity:0; visibility:hidden;}
    .mTechnology_slide .swiper-slide-active .tit {opacity:0; visibility:hidden;}
    .mTechnology_slide .swiper-slide-active .box > div dl p {transform:translateY(0)}
    .mTechnology_slide .swiper-slide-active .box > div > a span {transform:translateY(0)}
}


#mRnd {display:flex; justify-content:space-between; align-items:center; flex-direction:row-reverse; padding-top:200px;}
#mRnd .img_box {width:50%; border-radius:30px; overflow:hidden; clip-path:inset(50%); opacity:0; transition:all 1s ease-in-out; transition-property:clip-path, opacity;}
#mRnd .img_box div {width:100%; height:0; padding-bottom:100%; background:url(../images/mRnd_img1.jpg) no-repeat center center; background-size:cover;}
#mRnd .txt_box {width:calc(50% - 120px)}
#mRnd .txt_box ul {display:flex; flex-wrap:wrap; margin-top:120px;}
#mRnd .txt_box ul li {width:33.33%; border-right:1px solid #ccc; opacity:0; transform:translateY(40px); transition:all 0.6s; transition-property:opacity, transform;}
#mRnd .txt_box ul li:first-child {border-left:1px solid #ccc;}
#mRnd .txt_box ul li a {display:block; width:100%; padding:42px 0; text-align:center;}
#mRnd .txt_box ul li .icon {display:block; width:56px; height:56px; background-repeat:no-repeat; background-position:center center; background-size:contain; margin:0 auto;}
#mRnd .txt_box ul li p {font-size:1.5em; font-weight:600; margin-top:24px;}

#mRnd .txt_box ul li .icon1 {background-image:url(../images/mRnd_icon1.svg)}
#mRnd .txt_box ul li .icon2 {background-image:url(../images/mRnd_icon2.svg)}
#mRnd .txt_box ul li .icon3 {background-image:url(../images/mRnd_icon3.svg)}

#mRnd .img_box.active {clip-path:inset(0); opacity:1; transition-delay:0.3s;}
#mRnd .txt_box ul.active li {opacity:1; transform:translateY(0); transition-delay:0.6s;}

@media screen and (max-width:1760px){
    #mRnd .txt_box {width:calc(50% - 80px)}
    #mRnd .txt_box ul {margin-top:80px;}
}

@media screen and (max-width:1220px){
    #mRnd .txt_box {width:calc(50% - 40px)}
    #mRnd .txt_box ul {margin-top:50px;}
}

@media screen and (max-width:1024px){
    #mRnd {padding-top:20%;}
    #mRnd .img_box {border-radius:15px;}
    #mRnd .txt_box {width:calc(50% - 30px)}
    #mRnd .txt_box ul {margin-top:25px;}
    #mRnd .txt_box ul li a {padding:25px 0;}
    #mRnd .txt_box ul li .icon {width:42px; height:42px;}
    #mRnd .txt_box ul li p {font-size:1.3em; margin-top:15px;}
}

@media screen and (max-width:767px){
    #mRnd {display:block; padding-bottom:90px;}
    #mRnd .img_box {width:100%; border-radius:10px; margin:6% 0;}
    #mRnd .img_box div {padding-bottom:80%;}
    #mRnd .txt_box {width:100%;}
    #mRnd .txt_box ul {width:100%; margin-top:0; position:absolute; left:0; bottom:0;}
    #mRnd .txt_box ul li a {padding:15px 0;}
    #mRnd .txt_box ul li .icon {width:32px; height:32px;}
    #mRnd .txt_box ul li p {font-size:1.125em; margin-top:10px;}
}


#mPerformance {display:flex; align-items:start; flex-wrap:wrap; padding-top:200px;}
#mPerformance .main_title {width:38%;}
#mPerformance .main_title .view_btn {display:block; width:fit-content; font-size:1em; font-weight:600; margin-top:40px;}
#mPerformance .main_title .view_btn span {display:flex; align-items:center; width:fit-content; position:relative;}
#mPerformance .main_title .view_btn span:after {content:'\f061'; display:flex; justify-content:center; align-items:center; width:32px; height:32px; background:#005bff; border-radius:50%; font-size:0.875em; color:#fff; font-weight:400; font-family:'Font Awesome 6 Pro'; margin-left:8px; position:relative}
#mPerformance .main_title .view_btn span:before {content:''; width:32px; height:32px; background:#005bff; border-radius:50%; opacity:0.4; position:absolute; right:0; top:0; transform:scale3d(0.5, 0.5, 1);}
#mPerformance ul {width:62%; counter-reset:counter;}
#mPerformance ul li {border-top:1px solid #ccc; padding:40px 40px 40px 0; opacity:0; transform:translateY(40px); transition:all 0.6s; transition-property:opacity, transform;}
#mPerformance ul li:last-child {border-bottom:1px solid #ccc;}
#mPerformance ul li dl {display:flex; justify-content:space-between; align-items:start; flex-wrap:wrap; width:100%;}
#mPerformance ul li dl dt {width:calc(50% - 30px); font-size:1.875em; font-weight:600;}
#mPerformance ul li dl dt:before {content:counter(counter, decimal-leading-zero); counter-increment:counter; font-size:1em; color:#005bff; font-family:var(--font-baijamjuree); margin-right:16px;}
#mPerformance ul li dl dd {width:50%; font-size:1.25em; color:#666; line-height:1.5em;}

#mPerformance ul li.active {opacity:1; transform:translateY(0); transition-delay:0.2s;}

#mPerformance .main_title .view_btn:hover span:after {animation:btnMotion1 0.3s forwards;}
#mPerformance .main_title .view_btn:hover span:before {animation:btnMotion2 0.3s 0.3s forwards}

@media screen and (max-width:1760px){
    #mPerformance ul li {padding-right:0;}
    #mPerformance ul li dl dt {width:300px}
    #mPerformance ul li dl dd {width:calc(100% - 300px); min-width:0}
}

@media screen and (max-width:1220px){
    #mPerformance ul li dl dt {width:100%;}
    #mPerformance ul li dl dd {width:100%; margin-top:10px;}
}

@media screen and (max-width:1024px){
    #mPerformance {padding-top:20%; padding-bottom:30px;}
    #mPerformance .main_title {width:100%;}
    #mPerformance .main_title .view_btn {margin-top:0; position:absolute; right:0; bottom:0;}
    #mPerformance .main_title .view_btn span:after, #mPerformance .main_title .view_btn span:before {width:30px; height:30px;}
    #mPerformance ul {width:100%; margin-top:7%; margin-bottom:5%;}
    #mPerformance ul li {padding:20px 0;}
    #mPerformance ul li dl dt {font-size:1.5em;}
    #mPerformance ul li dl dt:before {margin-right:10px;}
    #mPerformance ul li dl dd {font-size:1.125em; margin-top:1.5%;}
}

@media screen and (max-width:1024px){
    #mPerformance .main_title .view_btn span:after, #mPerformance .main_title .view_btn span:before {width:28px; height:28px;}
    #mPerformance ul li dl dt {font-size:1.3em;}
    #mPerformance ul li dl dt:before {margin-right:7px;}
    #mPerformance ul li dl dd {font-size:1em;}
}


#mNews {width:100%; padding:200px 0; overflow:hidden;}
.mNews_slide {margin-top:56px;}
.mNews_slide a {display:block; position:relative; overflow:hidden;}
.mNews_slide .txt_box {background:#f6f6f6; padding:40px; border-radius:30px 30px 0 0;}
.mNews_slide .txt_box .cate {display:flex; align-items:center; font-size:1em; font-weight:600; font-family:var(--font-baijamjuree); margin-bottom:16px}
.mNews_slide .txt_box .cate:before {content:''; display:block; width:8px; height:8px; background:#005bff; border-radius:50%; margin-right:8px;}
.mNews_slide .txt_box .subject {font-size:1.5em; line-height:1.45em; font-weight:600; height:2.9em; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.mNews_slide .txt_box .date {font-size:1em; color:#666; margin-top:16px}
.mNews_slide .img_box {width:100%; height:14vw; background-repeat:no-repeat; background-position:center center; background-size:cover; border-radius:0 0 30px 30px;}
.mNews_slide .icon {display:block; width:80px; height:80px; position:absolute; top:0; right:0; z-index:2; transform:rotate(-90deg)}
.mNews_slide .icon span:nth-child(1) {width:80px; height:80px; background:#fff; border-radius:50% 0 0 0; position:absolute; bottom:-80px; right:-80px; transition:bottom .7s cubic-bezier(.785, .135, .15, .86), right .7s cubic-bezier(.785, .135, .15, .86), transform .3s}
.mNews_slide .icon span:nth-child(1):before {content:''; width:40px; height:40px; background:radial-gradient(circle at 0 0, transparent 71%, #fff 70%); border-right:1px solid #fff; position:absolute; bottom:0; left:-40px;}
.mNews_slide .icon span:nth-child(1):after {content:''; width:40px; height:40px; background:radial-gradient(circle at 0 0, transparent 71%, #fff 70%); border-right:1px solid #fff; position:absolute; top:-40px; right:0;}
.mNews_slide .icon span:nth-child(2) {display:block; width:64px; height:64px; position:absolute; bottom:0; right:0; overflow:hidden; transform:scale(0); transform-origin:right bottom; transition:transform .6s cubic-bezier(.785, .135, .15, .86);}
.mNews_slide .icon span:nth-child(2):before {content:'\f063'; display:flex; justify-content:center; align-items:center;; width:100%; height:100%; background:#005bff; border-radius:50%; font-size:1.5em; color:#fff; font-weight:400; font-family:'Font Awesome 6 Pro'; position:absolute; top:0; left:0;}
.mNews_slide a:hover .icon span:nth-child(1) {bottom:0; right:0; transition:bottom .56s cubic-bezier(.785, .135, .15, .86), right .56s cubic-bezier(.785, .135, .15, .86), transform .3s; animation:mNewsIcon1 1.12s ease-out; transform-origin:right bottom;}
.mNews_slide a:hover .icon span:nth-child(2) {overflow:visible; transform:scale(1); transition:transform .56s .04s cubic-bezier(.785, .135, .15, .86);}
.mNews_slide a:hover .icon span:nth-child(2):before {animation:mNewsIcon1 1.08s .04s both ease-out; transform-origin:right bottom;}

@keyframes mNewsIcon1 {
    0% {transform:scale(1);}
    50% {transform:scale(1.1);}
    70% {transform:scale(0.98);}
    100% {transform:scale(1);}
}

@media screen and (max-width:1220px){
    .mNews_slide .txt_box {padding:30px;}
}

@media screen and (max-width:1024px){
    #mNews {padding:20% 0;}
    .mNews_slide {margin-top:5%;}
    .mNews_slide .txt_box {padding:20px; border-radius:15px 15px 0 0;}
    .mNews_slide .txt_box .cate {margin-bottom:10px;}
    .mNews_slide .txt_box .subject {font-size:1.3em;}
    .mNews_slide .txt_box .date {margin-top:10px;}
    .mNews_slide .img_box {height:18vw; border-radius:0 0 15px 15px;}
    .mNews_slide .icon {width:60px; height:60px;}
    .mNews_slide .icon span:nth-child(1) {width:60px; height:60px; right:-60px; bottom:-60px;}
    .mNews_slide .icon span:nth-child(1):before {width:30px; height:30px; left:-30px;}
    .mNews_slide .icon span:nth-child(1):after {width:30px; height:30px; top:-30px;}
    .mNews_slide .icon span:nth-child(2) {width:50px; height:50px;}
    .mNews_slide .icon span:nth-child(2):before {font-size:1.3em;}
}

@media screen and (max-width:767px){
    .mNews_slide .swiper-slide {width:100%;}
    .mNews_slide .txt_box {padding:6%; border-radius:10px 10px 0 0;}
    .mNews_slide .txt_box .cate:before {width:6px; height:6px; margin-right:6px;}
    .mNews_slide .txt_box .subject {font-size:1.2em;}
    .mNews_slide .img_box {height:55vw; border-radius:0 0 10px 10px;}
}


#mContact {display:flex; flex-wrap:wrap; width:100%;}
#mContact > div {display:flex; justify-content:space-between; align-items:center; width:50%; height:36vw; position:relative; padding:0 4.2vw; overflow:hidden;}
#mContact > div:before {content:''; display:block; width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; position:absolute; left:0; top:0; transition:transform 0.6s ease-in-out;}
#mContact > div .txt_box {position:relative; z-index:5;}
#mContact > div .txt_box h2 {font-size:3.125em; color:#fff; line-height:1.1em; font-weight:600; font-family:var(--font-baijamjuree)}
#mContact > div .txt_box p {font-size:1.25em; color:#fff; line-height:1.5em; margin-top:16px;}
#mContact > div a {display:block; width:fit-content; font-size:1em; color:#fff; font-weight:600;}
#mContact > div a span {display:flex; align-items:center; width:fit-content; position:relative;}
#mContact > div a span:after {content:'\f061'; display:flex; justify-content:center; align-items:center; width:32px; height:32px; background:#fff; border-radius:50%; font-size:0.875em; color:#191919; font-weight:400; font-family:'Font Awesome 6 Pro'; margin-left:8px; position:relative}
#mContact > div a span:before {content:''; width:32px; height:32px; background:#fff; border-radius:50%; opacity:0.4; position:absolute; right:0; top:0; transform:scale3d(0.5, 0.5, 1);}

#mContact > div:hover:before {transform:scale(1.1)}

#mContact > div a:hover span:after {animation:btnMotion1 0.3s forwards;}
#mContact > div a:hover span:before {animation:btnMotion2 0.3s 0.3s forwards}

#mContact > div:nth-child(1) {background-color:#0a327a;}
#mContact > div:nth-child(1):before {background-image:url(../images/mContact_img1.png)}
#mContact > div:nth-child(2) {background-color:#191919;}
#mContact > div:nth-child(2):before {background-image:url(../images/mContact_img2.png)}

@media screen and (max-width:1220px){
    #mContact > div {justify-content:center; align-items:start; flex-direction:column; height:40vw;}
    #mContact > div .txt_box {margin-bottom:30px;}
}

@media screen and (max-width:1024px){
    #mContact > div {width:100%; height:auto; padding:15% 6%;}
    #mContact > div .txt_box {margin-bottom:5%;}
    #mContact > div .txt_box h2 {font-size:2.7em;}
    #mContact > div .txt_box p {font-size:1.125em; margin-top:2%;}
    #mContact > div a span:after, #mContact > div a span:before {width:30px; height:30px;}
}

@media screen and (max-width:1024px){
    #mContact > div .txt_box h2 {font-size:2.3em;}
    #mContact > div .txt_box p {font-size:1em;}
    #mContact > div a span:after, #mContact > div a span:before {width:28px; height:28px;}
}





#mContact2 {padding:150px 0 100px; overflow:hidden;}
#mContact2 .form_box {display:flex; justify-content:space-between; flex-wrap:wrap; width:100%; margin-top:70px;}
#mContact2 .form_box ul {width:calc(50% - 10px)}
#mContact2 .form_box ul li {margin-bottom:30px;}
#mContact2 .form_box ul li:last-child {margin-bottom:0;}
#mContact2 .form_box ul li > label {display:block; font-size:1.125em; font-weight:600; margin-bottom:10px;}
#mContact2 .form_box ul li > label i {color:#005bff; font-style:normal;}
#mContact2 .form_box ul li .form_txt {display:block; width:100%; height:61px; background:#fff; border:1px solid #ccc; border-radius:6px; font-size:1.125em; padding:0 20px;}
#mContact2 .form_box ul li .form_txt::placeholder {color:#ccc;}
#mContact2 .form_box ul li .form_txt::-webkit-input-placeholder {color:#ccc;}
#mContact2 .form_box ul li .form_txt:-ms-input-placeholder {color:#ccc;}
#mContact2 .form_box ul li .form_txt:focus {outline:none; border:2px solid #005bff !important; box-shadow:4px 4px 10px rgba(25,194,218,0.1)}
#mContact2 .form_box ul li .form_textarea {display:block; width:100%; height:242px; background:#fff; border:1px solid #ccc; border-radius:6px; font-size:1.125em; padding:20px; resize:none;}
#mContact2 .form_box ul li .form_textarea::placeholder {color:#ccc;}
#mContact2 .form_box ul li .form_textarea::-webkit-input-placeholder {color:#ccc;}
#mContact2 .form_box ul li .form_textarea:-ms-input-placeholder {color:#ccc;}
#mContact2 .form_box ul li .form_textarea:focus {outline:none; border:2px solid #005bff !important; box-shadow:4px 4px 10px rgba(25,194,218,0.1)}
#mContact2 .form_box ul li .check_box input {display:none;}
#mContact2 .form_box ul li .check_box label {display:flex; align-items:center;}
#mContact2 .form_box ul li .check_box label:before {content:''; display:flex; justify-content:center; align-items:center; width:24px; height:24px; background:#efefef; border-radius:4px; font-size:1em; color:#fff; font-weight:400; font-family:'Font Awesome 6 Pro'}
#mContact2 .form_box ul li .check_box label p {font-size:1em; color:#666; padding-left:6px;}
#mContact2 .form_box ul li .check_box label p button {font-size:1em; color:#005bff; font-weight:600; text-decoration:underline;}
#mContact2 .form_box ul li .check_box input:checked + label:before {content:'\f00c'; background:#005bff;}
#mContact2 .form_box ul li .t_leng {font-size:1em; color:#666; text-align:right; margin-top:10px;}
#mContact2 .btn_box {display:flex; justify-content:end; margin-top:30px;}
#mContact2 .submit_btn {display:flex; justify-content:center; align-items:center; width:fit-content; height:56px; background:#005bff; border-radius:6px; font-size:1.125em; color:#fff; font-weight:600; text-align:center; padding:0 30px; transition:all 0.5s; transition-property:background; font-family:var(--font-baijamjuree)}
#mContact2 .submit_btn i {font-size:0.77em; margin-left:10px; position:relative; top:2px;}
#mContact2 .submit_btn:hover {background:#0a327a;}

@media screen and (max-width:1024px){
    #mContact2 {padding:15% 0 10%;}
    #mContact2 .form_box {margin-top:7%;}
    #mContact2 .form_box ul {width:calc(50% - 5px)}
    #mContact2 .form_box ul li {margin-bottom:20px;}
    #mContact2 .form_box ul li > label {font-size:1em;}
    #mContact2 .form_box ul li .form_txt {height:48px; font-size:1em; padding:0 15px;}
    #mContact2 .form_box ul li .form_textarea {height:180px; font-size:1em; padding:15px;}
    #mContact2 .submit_btn {height:44px; font-size:1em; padding:0 15px;}
    #mContact2 .submit_btn i {top:0;}
}

@media screen and (max-width:767px){
    #mContact2 .form_box ul {width:100%; margin-bottom:4%;}
    #mContact2 .form_box ul:last-child {margin-bottom:0;}
    #mContact2 .form_box ul li {margin-bottom:4%;}
    #mContact2 .form_box ul li > label {margin-bottom:1.5%;}
    #mContact2 .form_box ul li .form_txt {height:38px; padding:0 10px;}
    #mContact2 .form_box ul li .form_textarea {height:110px; padding:10px;}
    #mContact2 .form_box ul li .check_box label:before {width:20px; height:20px;}
    #mContact2 .submit_btn {height:38px; border-radius:5px; padding:0 12px;}
    #mContact2 .submit_btn i {margin-left:5px;}
}

.privacy_popup {display:flex; justify-content:center; align-items:center; width:100%; height:100vh; background:rgba(25,25,25,0.8); position:fixed; left:0; top:0; z-index:550; opacity:0; visibility:hidden; transition:all 0.5s; transition-property:opacity, visibility;}
.privacy_popup .popup_inner {width:88%; max-width:850px; position:relative;}
.privacy_popup h2 {font-size:1.5em; color:#fff; font-weight:500; text-align:center; margin-bottom:20px;}
.privacy_popup .cont {width:100%; background:#fff; padding:30px; border-radius:20px;}
.privacy_popup .cont > div {width:100%}
.privacy_popup .cont > div p {max-height:400px; font-size:0.875em; color:#666; line-height:1.8em; overflow-y:scroll; padding-right:15px;}
.privacy_popup .cont > div p::-webkit-scrollbar {width:3px;}
.privacy_popup .cont > div p::-webkit-scrollbar-thumb {background:#191919;}
.privacy_popup .cont > div p::-webkit-scrollbar-track {background:#dcdcdc;}
.privacy_popup .close_btn {font-size:1.5em; color:#fff; position:absolute; right:5px; top:10px;}
.privacy_popup .close_btn:before {content:'\f00d'; font-size:1em; font-weight:300; font-family:'Font Awesome 6 Pro'}
.privacy_popup.on {opacity:1; visibility:visible;}

@media screen and (max-width:1024px){
	.privacy_popup h2 {margin-bottom:10px;}
	.privacy_popup .cont {padding:15px; border-radius:15px;}
	.privacy_popup .cont > div p {max-height:300px;}
	.privacy_popup .close_btn {top:7px;}
}


/* sub */
#sub_content {padding:240px 0 160px}

#page_cont {margin-top:120px;}

.sub_title {font-size:6.25em; line-height:1.2em; font-weight:600; font-family:var(--font-baijamjuree); text-align:center;}

.s_tit1 {font-size:3.75em; line-height:1.16em; font-weight:600;}
.s_tit2 {font-size:2.8125em; line-height:1.22em; font-weight:600;}

.s_txt1 {font-size:1.25em; color:#666; line-height:1.5em;}

@media screen and (max-width:1024px){
	#sub_content {padding:120px 0 16%;}

    #page_cont {margin-top:10%;}
	
	.sub_title {font-size:4em;}

    .s_tit1 {font-size:2.7em;}
    .s_tit2 {font-size:2em;}

    .s_txt1 {font-size:1.125em;}
}

@media screen and (max-width:767px){
	#sub_content {padding-top:100px;}
	
	.sub_title {font-size:3em;}

    .s_tit1 {font-size:2em;}
    .s_tit2 {font-size:1.7em;}

    .s_txt1 {font-size:1em;}
}


.sub_menu_wrap {margin-bottom:24px;}
.sub_menu_wrap ul {display:flex; justify-content:center; align-items:center; width:100%;}
.sub_menu_wrap ul li {display:flex; align-items:center; font-size:1.125em; color:#191919; font-family:var(--font-baijamjuree)}
.sub_menu_wrap ul li:after {content:'\f105'; font-size:0.77em; color:#ccc; font-weight:400; font-family:'Font Awesome 6 Pro'; margin:0 12px;}
.sub_menu_wrap ul li:last-child:after {display:none;}
.sub_menu_wrap ul li.home:before {content:'\e487'; font-size:0.77em; font-weight:400; font-family:'Font Awesome 6 Pro'; margin-right:12px;}

.sub_menu_wrap2 {overflow-x:auto; margin-top:55px;}
.sub_menu_wrap2 button {display:none;}
.sub_menu_wrap2 ul {display:flex; justify-content:center; gap:8px;}
.sub_menu_wrap2 ul li a {display:block; background:#f6f6f6; border-radius:40px; font-size:1.125em; color:#666; line-height:1.5em; font-family:var(--font-baijamjuree); padding:12px 24px; white-space:nowrap;}
.sub_menu_wrap2 ul li.on a {background:#005bff; color:#fff; font-weight:600;}

@media screen and (max-width:1024px){
    .sub_menu_wrap {margin-bottom:2%;}
    .sub_menu_wrap ul li {font-size:1em;}
    .sub_menu_wrap ul li:after {margin:0 8px;}
    .sub_menu_wrap ul li.home:before {margin-right:8px;}

    .sub_menu_wrap2 {margin-top:5%}
    .sub_menu_wrap2 ul {gap:4px;}
    .sub_menu_wrap2 ul li a {font-size:1em; padding:10px 16px;}
}

@media screen and (max-width:767px){
    .sub_menu_wrap2 {overflow:visible; position:relative; z-index:50;}
    .sub_menu_wrap2 button {display:block; width:100%; height:42px; background:#f6f6f6; border-radius:50px; font-size:1em; line-height:1.5em; font-weight:500; font-family:var(--font-baijamjuree); text-align:left; padding:0 15px; position:relative; z-index:5;}
    .sub_menu_wrap2 button:after {content:'\f107'; font-size:1em; font-weight:400; font-family:'Font Awesome 6 Pro'; position:absolute; right:15px; top:50%; transform:translateY(-50%)}
    .sub_menu_wrap2 ul {display:none; width:100%; background:#f6f6f6; border-radius:0 0 15px 15px; position:absolute; left:0; top:50%; padding-top:21px;}
    .sub_menu_wrap2 ul:before {content:''; display:block; width:100%; height:1px; background:#ddd; position:absolute; left:0; top:21px;}
    .sub_menu_wrap2 ul li a {background:none; border-radius:0; padding:8px 15px;}
    .sub_menu_wrap2 button.on:after {content:'\f106'}
    .sub_menu_wrap2 button.on + ul {display:block;}
}


.sub_img_box1 {width:100%; height:640px; border-radius:30px; overflow:hidden;}
.sub_img_box1 > div {width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; transform:scale(1.1); animation:subImgbox1 0.5s 0.8s forwards;}

.sub_img_box2 {display:flex; flex-wrap:wrap; gap:40px 24px; width:100%;}
.sub_img_box2 > div {width:calc(50% - 12px)}
.sub_img_box2 > div .img_box {width:100%; height:392px; background-repeat:no-repeat; background-position:center center; background-size:cover; border-radius:30px;}
.sub_img_box2 > div dl {margin-top:24px;}
.sub_img_box2 > div dl dt {font-size:1.5em; line-height:1.45em; font-weight:600;}
.sub_img_box2 > div dl dd {font-size:1.125em; color:#666; line-height:1.55em; margin-top:8px;}
.sub_img_box2 > div .t1 {font-size:1.25em; line-height:1.5em; font-weight:600; text-align:center; margin-top:16px;}
.sub_img_box2 > div .t2 {font-size:1.5em; line-height:1.45em; font-weight:600; text-align:center; margin-top:24px;}
.sub_img_box2 > div .t2 span {display:block; font-size:0.75em; color:#666; line-height:1.5em; font-weight:400; margin-top:4px;}

.sub_img_box2.h_500 > div .img_box {height:500px;}

@keyframes subImgbox1 {
    0% {transform:scale(1.1)}
    100% {transform:scale(1)}
}

@media screen and (max-width:1220px){
    .sub_img_box1 {height:45vw}

    .sub_img_box2 > div .img_box {height:30vw;}
    
    .sub_img_box2.h_500 > div .img_box {height:38vw;}
}

@media screen and (max-width:1024px){
    .sub_img_box1 {border-radius:15px;}

    .sub_img_box2 {gap:30px 15px;}
    .sub_img_box2 > div {width:calc(50% - 7.5px)}
    .sub_img_box2 > div .img_box {border-radius:15px;}
    .sub_img_box2 > div dl {margin-top:15px;}
    .sub_img_box2 > div dl dt {font-size:1.3em;}
    .sub_img_box2 > div dl dd {font-size:1em; margin-top:5px;}
    .sub_img_box2 > div .t1 {font-size:1.125em;}
    .sub_img_box2 > div .t2 {font-size:1.3em; margin-top:15px;}
    .sub_img_box2 > div .t2 span {margin-top:2px;}
}

@media screen and (max-width:767px){
    .sub_img_box1 {border-radius:10px;}

    .sub_img_box2 {gap:25px 0;}
    .sub_img_box2 > div {width:100%}
    .sub_img_box2 > div .img_box {height:52vw; border-radius:10px;}
    .sub_img_box2 > div dl {margin-top:10px;}
    .sub_img_box2 > div dl dt {font-size:1.2em;}
    .sub_img_box2 > div dl dd {margin-top:3px;}
    .sub_img_box2 > div .t1 {margin-top:10px;}
    .sub_img_box2 > div .t2 {font-size:1.2em; margin-top:10px;}
    .sub_img_box2 > div .t2 span {font-size:0.9em; margin-top:0;}
    
    .sub_img_box2.h_500 > div .img_box {height:65vw;}
}


.sub_list_box1 > li {font-size:1.25em; color:#6b7280; line-height:1.5em; margin-bottom:8px; position:relative; padding-left:30px;}
.sub_list_box1 > li:last-child {margin-bottom:0;}
.sub_list_box1 > li:before {content:'·'; display:block; width:30px; font-weight:900; text-align:center; position:absolute; left:0; top:0;}

@media screen and (max-width:1024px){
    .sub_list_box1 > li {font-size:1.125em; margin-bottom:5px; padding-left:20px;}
    .sub_list_box1 > li:before {width:20px;}
}

@media screen and (max-width:767px){
    .sub_list_box1 > li {font-size:1em; margin-bottom:3px; padding-left:12px;}
    .sub_list_box1 > li:before {width:12px;}
}


.sAbout_case1 {width:100%; border-top:1px solid #ccc;}
.sAbout_case1 tbody th {width:170px; border-bottom:1px solid #ccc; font-size:1.25em; line-height:1.5em; font-weight:600; text-align:left; padding:24px;}
.sAbout_case1 tbody td {border-bottom:1px solid #ccc; font-size:1.25em; color:#666; line-height:1.5em; padding:24px 0;}

.sAbout_slide1 .swiper-slide { overflow:hidden;}
.sAbout_slide1 img {display:block; width:100%; border-radius:30px;}
.sAbout_slide1 p {font-size:1.25em; line-height:1.5em; font-weight:600; margin-top:15px; text-align:center;}

@media screen and (max-width:1024px){
    .sAbout_case1 tbody th {width:130px; font-size:1.125em; padding:15px;}
    .sAbout_case1 tbody td {font-size:1.125em; padding:15px 0;}

    .sAbout_slide1 img {border-radius:15px;}
	.sAbout_slide1 p {font-size:1.125em; margin-top:1.5%;}
}

@media screen and (max-width:767px){
    /*.sAbout_case1, .sAbout_case1 tbody {display:block;}
    .sAbout_case1 tbody tr {display:flex; flex-wrap:wrap;}*/
    .sAbout_case1 tbody th {width:80px; font-size:1em; padding:10px;}
    .sAbout_case1 tbody td {width:calc(100% - 80px); font-size:1em; padding:10px 0;}

    .sAbout_slide1 img {border-radius:10px;}
	.sAbout_slide1 p {font-size:1em;}
}


.sHistory_case1 {display:flex; align-items:start; flex-wrap:wrap; width:100%; position:relative;}
.sHistory_case1 .symbol_box {width:50%; position:sticky; left:0; top:calc(100vh - 300px);}
.sHistory_case1 .symbol_box img {position:relative; left:-180px;}
.sHistory_case1 .txt_box {width:50%; position:relative;}
.sHistory_case1 .txt_box > div {padding:0 0 80px 80px; position:relative;}
.sHistory_case1 .txt_box > div:last-child {padding-bottom:0;}
.sHistory_case1 .txt_box > div:before, .sHistory_case1 .txt_box > div:after {content:''; display:block; width:1px; height:100%; position:absolute; left:-1px; top:20px;}
.sHistory_case1 .txt_box > div:before {background:#ccc;}
.sHistory_case1 .txt_box > div:after {width:2px; background:#005bff; height:var(--progress, 0%); transition:height 0.1s}
.sHistory_case1 .txt_box > div:last-child:before, .sHistory_case1 .txt_box > div:last-child:after {display:none;}
.sHistory_case1 .txt_box > div .year {font-size:3.125em; line-height:1.1em; font-weight:600; font-family:var(--font-baijamjuree); margin-bottom:16px; transition:color 0.4s;}
.sHistory_case1 .txt_box > div .year:before, .sHistory_case1 .txt_box > div .year:after {content:''; display:block; width:8px; height:8px; background:#ccc; border-radius:50%; position:absolute; left:0; top:20px; transform:translate(-50%, -50%); z-index:5; transition:all 0.5s;}
.sHistory_case1 .txt_box > div .year:before {z-index:10;}
.sHistory_case1 .txt_box > div .year:after {width:0; height:0; background:#005bff;}
.sHistory_case1 .txt_box > div .s_txt1 {line-height:2em;}
.sHistory_case1 .txt_box > div.active .year {color:#005bff;}
.sHistory_case1 .txt_box > div.active .year:before {background:#005bff}
.sHistory_case1 .txt_box > div.active .year:after {width:32px; height:32px; opacity:0.2;}

@property --progress {
    syntax: '<percentage>';
    inherits: true;
    initial-value: 0%;
}

@media screen and (min-height:1080px){
     .sHistory_case1 {padding-bottom:200px;}
}

@media screen and (max-width:1460px){
    .sHistory_case1 .symbol_box img {width:100%; left:-80px;}
}

@media screen and (max-width:1220px){
    .sHistory_case1 .symbol_box img {left:-6%;}
}

@media screen and (max-width:1024px){
    .sHistory_case1 {padding-bottom:20%;}
    .sHistory_case1 .symbol_box {width:40%;}
    .sHistory_case1 .symbol_box img {top:0;}
    .sHistory_case1 .txt_box {width:60%;}
    .sHistory_case1 .txt_box > div {padding:0 0 40px 40px;}
    .sHistory_case1 .txt_box > div .year {font-size:2.5em; margin-bottom:15px;}
    .sHistory_case1 .txt_box > div .s_txt1 {line-height:1.7em;}
    .sHistory_case1 .txt_box > div.active .year:after {width:24px; height:24px;}
}

@media screen and (max-width:767px){
    .sHistory_case1 .symbol_box {display:none;}
    .sHistory_case1 .symbol_box img {top:0;}
    .sHistory_case1 .txt_box {width:100%;}
    .sHistory_case1 .txt_box > div {padding:0 0 8% 35px;}
    .sHistory_case1 .txt_box > div:before, .sHistory_case1 .txt_box > div:after {top:15px;}
    .sHistory_case1 .txt_box > div .year {font-size:2em; margin-bottom:5px;}
    .sHistory_case1 .txt_box > div .year:before, .sHistory_case1 .txt_box > div .year:after {top:15px;}
}


.sMission_case1 {width:100%; height:300vh; position:relative;}
.sMission_case1 > div {display:flex; justify-content:center; align-items:center; width:100%; height:100vh; position:sticky; left:0; top:0;}
.sMission_case1 > div .img_box {width:1200px; height:640px; background:#191919; border-radius:30px; overflow:hidden; position:absolute; left:50%; top:0; transform:translateX(-50%)}
.sMission_case1 > div .img_box > div {content:''; display:block; width:100%; height:100%; background:url(../images/sMission_img1.jpg) no-repeat center center; background-size:cover; transform:scale(1.1); animation:subImgbox1 0.5s 0.8s forwards;}
.sMission_case1 > div .txt_box .txt {font-size:1.875em; color:#fff; line-height:1.33em; font-weight:600; margin-top:24px;}

.sVision_case1 > div {display:flex; justify-content:space-between; margin-bottom:24px;}
.sVision_case1 > div:last-child {margin-bottom:0;}
.sVision_case1 > div .icon {display:block; width:151px; height:151px; background-repeat:no-repeat; background-position:center center; background-size:contain;}
.sVision_case1 > div dl {display:flex; justify-content:center; flex-direction:column; width:calc(100% - 167px); background:#f6f6f6; border-radius:30px; padding:10px 56px;}
.sVision_case1 > div dl dt {font-size:1.5em; line-height:1.45em; font-weight:600;}
.sVision_case1 > div dl dd {font-size:1.125em; color:#666; line-height:1.55em; margin-top:8px;}

.sVision_case1 > div .icon1 {background-image:url(../images/sVision_icon1.svg)}
.sVision_case1 > div .icon2 {background-image:url(../images/sVision_icon2.svg)}
.sVision_case1 > div .icon3 {background-image:url(../images/sVision_icon3.svg)}

@media screen and (max-width:1220px){
    .sMission_case1 > div .img_box {width:88%; height:45vw;}
    .sMission_case1 > div .txt_box .txt br {display:none;}
}

@media screen and (max-width:1024px){
    .sMission_case1 > div .img_box {border-radius:15px;}
    .sMission_case1 > div .txt_box .txt {font-size:1.5em; margin-top:2.5%;}

    .sVision_case1 > div {margin-bottom:2%;}
    .sVision_case1 > div .icon {width:100px; height:100px;}
    .sVision_case1 > div dl {width:calc(100% - 110px); border-radius:15px; padding:10px 25px;}
    .sVision_case1 > div dl dt {font-size:1.3em;}
    .sVision_case1 > div dl dd {font-size:1em; margin-top:5px;}
}

@media screen and (max-width:767px){
    .sMission_case1 > div .img_box {border-radius:10px;}
    .sMission_case1 > div .txt_box .txt {font-size:1.2em; line-height:1.5em;}

    .sVision_case1 > div {margin-bottom:5%;}
    .sVision_case1 > div .icon {width:60px; height:60px;}
    .sVision_case1 > div dl {width:calc(100% - 70px); background:none; border-radius:0; padding:0;}
    .sVision_case1 > div dl dt {font-size:1.2em;}
    .sVision_case1 > div dl dd {margin-top:0;}
}


.sCertifications_case1 {display:flex; flex-wrap:wrap; gap:40px 24px; width:100%;}
.sCertifications_case1 > div {width:calc(33.33% - 16px);}
.sCertifications_case1 > div .img {width:100%; border:1px solid #ccc; border-radius:10px; overflow:hidden;}
.sCertifications_case1 > div .img img {width:100%;}
.sCertifications_case1 > div dl {text-align:center; margin-top:16px;}
.sCertifications_case1 > div dl dt {font-size:1.25em; line-height:1.5em; font-weight:600;}
.sCertifications_case1 > div dl dd {font-size:1.125em; color:#666; line-height:1.55em; margin-top:8px;}

.sCertifications_case2 {display:flex; flex-wrap:wrap; gap:40px 24px; width:100%;}
.sCertifications_case2 > div {width:calc(33.33% - 16px);}
.sCertifications_case2 > div .img {width:100%; border-radius:30px; overflow:hidden;}
.sCertifications_case2 > div .img img {width:100%;}
.sCertifications_case2 > div dl {margin-top:24px;}
.sCertifications_case2 > div dl dt {font-size:1.5em; line-height:1.45em; font-weight:600;}
.sCertifications_case2 > div dl dd {font-size:1.125em; color:#666; line-height:1.55em; margin-top:8px;}

@media screen and (max-width:1024px){
    .sCertifications_case1 {gap:30px 15px;}
    .sCertifications_case1 > div {width:calc(33.33% - 10px)}
    .sCertifications_case1 > div dl dt {font-size:1.125em;}
    .sCertifications_case1 > div dl dd {font-size:1em; margin-top:3px;}
    
    .sCertifications_case2 {gap:30px 15px;}
    .sCertifications_case2 > div {width:calc(33.33% - 10px)}
    .sCertifications_case2 > div .img {border-radius:15px;}
    .sCertifications_case2 > div dl {margin-top:15px;}
    .sCertifications_case2 > div dl dt {font-size:1.3em;}
    .sCertifications_case2 > div dl dd {font-size:1em; margin-top:3px;}
}

@media screen and (max-width:767px){
    .sCertifications_case1 {gap:25px 10px;}
    .sCertifications_case1 > div {width:calc(50% - 5px)}
    .sCertifications_case1 > div .img {border-radius:5px;}
    .sCertifications_case1 > div dl {margin-top:10px;}
    .sCertifications_case1 > div dl dd {margin-top:0;}
    
    .sCertifications_case2 {gap:25px 10px;}
    .sCertifications_case2 > div {width:100%}
    .sCertifications_case2 > div .img {border-radius:10px;}
    .sCertifications_case2 > div dl {margin-top:10px;}
    .sCertifications_case2 > div dl dd {margin-top:0;}
}


.sNetwork_case1 .map_box {width:100%; position:relative;}
.sNetwork_case1 .map_box:before {content:''; display:block; width:77.5%; height:66.808%; background:url(../images/sNetwork_img2.png) no-repeat center center; background-size:contain; position:absolute; left:5.917%; top:8.333%; z-index:1;}
.sNetwork_case1 .map_box > img {width:100%;}
.sNetwork_case1 .map_box .tit {width:40px; height:40px; background:url(../images/sNetwork_icon1.svg) no-repeat center center; background-size:contain; position:absolute; left:43%; top:41%; z-index:3;}
.sNetwork_case1 .map_box .tit span {display:block; background:#fff; border:2px solid #005bff; box-shadow:0 5px 10px rgba(0,91,255,0.2); border-radius:50px; padding:16px 24px; position:absolute; left:50%; bottom:100%; transform:translate(-50%, 0); margin-bottom:8px; animation:sNetworkLogo 1s alternate infinite ease-in-out}
.sNetwork_case1 .map_box .tit span img {display:block;}
.sNetwork_case1 table {width:100%; border-top:1px solid #ccc;}
.sNetwork_case1 table tbody th {width:230px; border-bottom:1px solid #ccc; font-size:1.25em; line-height:1.5em; font-weight:600; text-align:left; padding:24px;}
.sNetwork_case1 table tbody td {border-bottom:1px solid #ccc; font-size:1.25em; color:#666; line-height:1.5em; padding:24px 0;}

@keyframes sNetworkLogo {
    0% {transform:translate(-50%, 0)}
    100% {transform:translate(-50%, -10px)}
}

@media screen and (max-width:1024px){
    .sNetwork_case1 .map_box .tit {width:30px; height:30px;}
    .sNetwork_case1 .map_box .tit span {padding:8px 12px;}
    .sNetwork_case1 .map_box .tit span img {height:15px;}
    .sNetwork_case1 table tbody th {width:160px; font-size:1.125em; padding:15px;}
    .sNetwork_case1 table tbody td {font-size:1.125em; padding:15px 0;}
}

@media screen and (max-width:767px){
    .sNetwork_case1 .map_box .tit {width:24px; height:24px; left:42%;}
    .sNetwork_case1 .map_box .tit span {padding:6px 10px; margin-bottom:5px;}
    .sNetwork_case1 .map_box .tit span img {height:12px;}
    .sNetwork_case1 table tbody th {width:110px; font-size:1em; padding:10px;}
    .sNetwork_case1 table tbody td {font-size:1em; padding:10px 0;}
}


.sLocation_case1 .map_box {width:100%; height:640px; background:#f6f6f6; border-radius:30px; overflow:hidden; margin-bottom:55px;}
.sLocation_case1 .map_box .root_daum_roughmap .wrap_map {height:100% !important;}
.sLocation_case1 .info_box {position:relative;}
.sLocation_case1 .info_box dl {position:relative;}
.sLocation_case1 .info_box dl dt {font-size:1.5em; font-weight:600; line-height:1.4em; font-family:var(--font-baijamjuree)}
.sLocation_case1 .info_box dl dd {font-size:1.25em; color:#666; line-height:1.5em; margin-top:8px;}
.sLocation_case1 .info_box .info {display:flex; gap:20px 80px; margin-top:24px;}
.sLocation_case1 .info_box .info dl:before {content:''; display:block; width:1px; height:calc(100% - 16px); background:#ccc; position:absolute; left:-40px; top:50%; transform:translateY(-50%)}
.sLocation_case1 .info_box .info dl:first-child:before {display:none;}
.sLocation_case1 .info_box .view_btn {display:flex; justify-content:space-between; align-items:center; width:300px; height:78px; background:#005bff; border-radius:10px; font-size:1.25em; color:#fff; font-weight:600; padding:0 32px; position:absolute; right:0; bottom:0; transition:background 0.5s}
.sLocation_case1 .info_box .view_btn:after {content:'\e09f'; font-size:1em; font-weight:400; font-family:'Font Awesome 6 Pro'}
.sLocation_case1 .info_box .view_btn:hover {background:#0a327a}

@media screen and (max-width:1024px){
    .sLocation_case1 .map_box {height:450px; border-radius:15px; margin-bottom:5.5%;}
    .sLocation_case1 .info_box dl dt {font-size:1.3em;}
    .sLocation_case1 .info_box dl dd {font-size:1.125em; margin-top:5px;}
    .sLocation_case1 .info_box .info {gap:20px 50px;}
    .sLocation_case1 .info_box .info dl:before {left:-25px;}
    .sLocation_case1 .info_box .view_btn {width:180px; height:58px; font-size:1.125em; padding:0 15px;}
}

@media screen and (max-width:767px){
    .sLocation_case1 .map_box {height:240px; border-radius:10px;}
    .sLocation_case1 .info_box dl dt {font-size:1.2em;}
    .sLocation_case1 .info_box dl dd {font-size:1em; margin-top:3px;}
    .sLocation_case1 .info_box .info {flex-wrap:wrap; gap:5px 20px; margin-top:3%;}
    .sLocation_case1 .info_box .info dl {display:flex; align-items:center; gap:8px; width:100%;}
    .sLocation_case1 .info_box .info dl:before {display:none;}
    .sLocation_case1 .info_box .info dl dd {margin-top:0;}
    .sLocation_case1 .info_box .view_btn {width:125px; height:42px; border-radius:5px; font-size:1em; padding:0 12px;}
}


.sCapsule_case1 .step {display:flex; gap:0 40px;}
.sCapsule_case1 .step li {background:#005bff; border-radius:10px; font-size:1.25em; color:#fff; font-weight:600; line-height:1.5em; padding:8px 16px; position:relative;}
.sCapsule_case1 .step li:before {content:'\f330'; display:block; width:40px; font-size:0.8em; color:#005bff; font-weight:900; line-height:1.1em; font-family:'Font Awesome 6 Pro'; text-align:center; position:absolute; right:100%; top:50%; transform:translateY(-50%)}
.sCapsule_case1 .step li:first-child:before {display:none;}
.sCapsule_case1 .list1 {overflow-x:auto;}
.sCapsule_case1 .list1 li {font-size:1.25em; color:#666; line-height:1.5em; margin-bottom:4px;}
.sCapsule_case1 .list1 li:last-child {margin-bottom:0;}
.sCapsule_case1 .list1 li strong {color:#191919; font-weight:600; margin-right:16px;}
.sCapsule_case1 .t1 {font-size:1.125em; color:#a4a4a4; line-height:1.5em;}

.sCapsule_case1 .box1 {display:flex; justify-content:center; align-items:center; gap:0 128px}
.sCapsule_case1 .box1 .circle {display:flex; justify-content:center; align-items:center; width:300px; height:300px; background:rgba(0,91,255,0.05); border:1px solid #005bff; border-radius:50%; padding:40px;}
.sCapsule_case1 .box1 .circle:before {content:''; display:block; width:100%; height:100%; background:rgba(0,91,255,0.2); border-radius:50%;}
.sCapsule_case1 .box1 dl {text-align:center; position:relative; max-width:calc(50% - 278px);}
.sCapsule_case1 .box1 dl:before {content:''; display:block; width:10px; height:10px; background:#005bff; border-radius:50%; position:absolute; top:50%; transform:translateY(-50%)}
.sCapsule_case1 .box1 dl:after {content:''; display:block; width:16px; height:16px; background:#fff; border:3px solid #005bff; border-radius:50%; position:absolute; top:50%; transform:translateY(-50%)}
.sCapsule_case1 .box1 dl dt {font-size:1.5em; color:#005bff; font-weight:600; line-height:1.4em;}
.sCapsule_case1 .box1 dl dt:before {content:''; display:block; height:0; border-top:2px dashed #005bff; position:absolute; top:50%; transform:translateY(-50%)}
.sCapsule_case1 .box1 dl dd {font-size:1.25em; color:#666; line-height:1.5em; margin-top:4px;}
.sCapsule_case1 .box1 .txt1:before {left:100%; margin-left:40px;}
.sCapsule_case1 .box1 .txt1:after {left:100%; margin-left:120px;}
.sCapsule_case1 .box1 .txt1 dt:before {width:80px; left:100%; margin-left:40px;}
.sCapsule_case1 .box1 .txt2:before {right:100%; margin-right:40px;}
.sCapsule_case1 .box1 .txt2:after {right:100%; margin-right:270px;}
.sCapsule_case1 .box1 .txt2 dt:before {width:230px; right:100%; margin-right:40px;}

.sCapsule_case1 .box2 {display:flex; justify-content:center; align-items:center; gap:0 128px}
.sCapsule_case1 .box2 .circle {display:flex; justify-content:center; align-items:center; width:300px; height:300px; background:rgba(0,91,255,0.05); border:1px solid #005bff; border-radius:50%; padding:40px; position:relative;}
.sCapsule_case1 .box2 .circle:before {content:''; display:block; width:100%; height:100%; background:rgba(0,91,255,0.2); border-radius:50%;}
.sCapsule_case1 .box2 .circle:after {content:''; display:block; width:calc(100% - 160px); height:calc(100% - 160px); background:rgba(0,91,255,0.2); border-radius:50%; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%)}
.sCapsule_case1 .box2 dl {text-align:center; position:relative; z-index:5;}
.sCapsule_case1 .box2 dl:before {content:''; display:block; width:10px; height:10px; background:#005bff; border-radius:50%; position:absolute; top:50%; transform:translateY(-50%)}
.sCapsule_case1 .box2 dl:after {content:''; display:block; width:16px; height:16px; background:#fff; border:3px solid #005bff; border-radius:50%; position:absolute; top:50%; transform:translateY(-50%)}
.sCapsule_case1 .box2 dl dt {font-size:1.5em; color:#005bff; font-weight:600; line-height:1.4em;}
.sCapsule_case1 .box2 dl dt:before {content:''; display:block; height:0; border-top:2px dashed #005bff; position:absolute; top:50%; transform:translateY(-50%)}
.sCapsule_case1 .box2 dl dd {font-size:1.25em; color:#666; line-height:1.5em; margin-top:4px;}
.sCapsule_case1 .box2 .txt1 {max-width:calc(50% - 278px);}
.sCapsule_case1 .box2 .txt1:before {left:100%; margin-left:40px;}
.sCapsule_case1 .box2 .txt1:after {left:100%; margin-left:120px;}
.sCapsule_case1 .box2 .txt1 dt:before {width:80px; left:100%; margin-left:40px;}
.sCapsule_case1 .box2 .txt2:after {top:100%; margin-top:20px; right:100%; margin-right:270px; transform:translateY(0)}
.sCapsule_case1 .box2 .txt2 dt:before {width:238px; transform:translateY(-50%) rotate(-14deg); transform-origin:right; right:100%; margin-right:40px;}
.sCapsule_case1 .box2 .txt3 {margin-top:55px;}
.sCapsule_case1 .box2 .txt3:after {right:100%; margin-right:204px;}
.sCapsule_case1 .box2 .txt3 dt:before {width:170px; right:100%; margin-right:40px;}
.sCapsule_case1 .box2 .wrap1 {max-width:calc(50% - 278px);}
.sCapsule_case1 .box2 .wrap1 dl {text-align:left;}
.sCapsule_case1 .box2 .wrap1 dl:before {right:100%; margin-right:40px;}
.sCapsule_case1 .box2 .wrap1 dl dd {height:1.5em;}

.sCapsule_case2 > div {width:100%; background:#f6f6f6; border-radius:30px; padding:40px; margin-bottom:16px;}
.sCapsule_case2 > div:last-child {margin-bottom:0;}
.sCapsule_case2 > div .tit {font-size:1.5em; line-height:1.4em; font-weight:600; margin-bottom:16px;}
.sCapsule_case2 > div ul li {font-size:1.25em; color:#666; line-height:1.5em; position:relative; padding-left:30px;}
.sCapsule_case2 > div ul li:before {content:'·'; display:block; width:30px; text-align:center; font-weight:900; position:absolute; left:0; top:0;}

.sCapsule_case3 table {width:100%;}
.sCapsule_case3 thead th {background:#005bff; font-size:1.5em; color:#fff; font-weight:600; text-align:center; padding:24px 10px; border-left:1px solid rgba(255,255,255,0.2)}
.sCapsule_case3 thead th:first-child {width:16%; border-left:0;}
.sCapsule_case3 thead th:nth-child(2) {width:37.5%;}
.sCapsule_case3 tbody th {background:#f6f6f6; border-bottom:1px solid #ccc; font-size:1.25em; line-height:1.5em; font-weight:600; text-align:center; padding:32px 10px;}
.sCapsule_case3 tbody td {border-left:1px solid #ccc; border-bottom:1px solid #ccc; font-size:1.25em; color:#666; line-height:1.5em; text-align:center; padding:32px 10px;}

@media screen and (max-width:1024px){
    .sCapsule_case1 .step {gap:0 30px;}
    .sCapsule_case1 .step li {border-radius:5px; font-size:1.125em; padding:6px 12px;}
    .sCapsule_case1 .step li:before {width:30px;}
    .sCapsule_case1 .list1 li {font-size:1.125em; margin-bottom:2px;}
    .sCapsule_case1 .list1 li strong {margin-right:10px;}
    .sCapsule_case1 .t1 {font-size:1em;}

    .sCapsule_case1 .box1 {gap:70px;}
    .sCapsule_case1 .box1 .circle {width:200px; height:200px; padding:25px;}
    .sCapsule_case1 .box1 dl {max-width:calc(50% - 170px)}
    .sCapsule_case1 .box1 dl dt {font-size:1.3em;}
    .sCapsule_case1 .box1 dl dd {font-size:1.125em;}
    .sCapsule_case1 .box1 .txt1:before {margin-left:10px;}
    .sCapsule_case1 .box1 .txt1:after {margin-left:62px}
    .sCapsule_case1 .box1 .txt1 dt:before {width:60px; margin-left:10px;}
    .sCapsule_case1 .box1 .txt2:before {margin-right:10px;}
    .sCapsule_case1 .box1 .txt2:after {margin-right:162px;}
    .sCapsule_case1 .box1 .txt2 dt:before {width:160px; margin-right:10px;}

    .sCapsule_case1 .box2 {gap:70px;}
    .sCapsule_case1 .box2 .circle {width:200px; height:200px; padding:25px;}
    .sCapsule_case1 .box2 .circle:after {width:calc(100% - 100px); height:calc(100% - 100px);}
    .sCapsule_case1 .box2 dl dt {font-size:1.3em;}
    .sCapsule_case1 .box2 dl dd {font-size:1.125em;}
    .sCapsule_case1 .box2 .txt1 {max-width:calc(50% - 170px);}
    .sCapsule_case1 .box2 .txt1:before {margin-left:10px;}
    .sCapsule_case1 .box2 .txt1:after {margin-left:62px;}
    .sCapsule_case1 .box2 .txt1 dt:before {width:60px; margin-left:10px;}
    .sCapsule_case1 .box2 .txt2:after {margin-right:162px; margin-top:13px;}
    .sCapsule_case1 .box2 .txt2 dt:before {width:165px; margin-right:10px; transform:translateY(-50%) rotate(-15deg)}
    .sCapsule_case1 .box2 .txt3 {margin-top:40px;}
    .sCapsule_case1 .box2 .txt3:after {margin-right:120px;}
    .sCapsule_case1 .box2 .txt3 dt:before {width:110px; margin-right:10px;}
    .sCapsule_case1 .box2 .wrap1 {max-width:calc(50% - 170px);}
    .sCapsule_case1 .box2 .wrap1 dl:before {margin-right:10px;}

    .sCapsule_case2 > div {border-radius:15px; padding:25px; margin-bottom:1.5%;}
    .sCapsule_case2 > div .tit {font-size:1.3em; margin-bottom:1.5%;}
    .sCapsule_case2 > div ul li {font-size:1.125em; padding-left:25px;}
    .sCapsule_case2 > div ul li:before {width:25px;}

    .sCapsule_case3 thead th {font-size:1.3em; padding:17px 10px;}
    .sCapsule_case3 tbody th {font-size:1.125em; padding:20px 10px;}
    .sCapsule_case3 tbody td {font-size:1.125em; padding:20px 10px;}
}

@media screen and (max-width:767px){
    .sCapsule_case1 .step li {font-size:1em; padding:5px 10px;}
    .sCapsule_case1 .step li:before {font-size:0.9em;}
    .sCapsule_case1 .list1 li {font-size:1em;}
    .sCapsule_case1 .list1 li strong {margin-right:6px;}
    .sCapsule_case1 .t1 {font-size:0.9375em;}

    .sCapsule_case1 .box1 {gap:30px;}
    .sCapsule_case1 .box1 .circle {width:100px; height:100px; padding:12px;}
    .sCapsule_case1 .box1 dl {max-width:calc(50% - 85px)}
    .sCapsule_case1 .box1 dl:before {width:6px; height:6px;}
    .sCapsule_case1 .box1 dl:after {width:10px; height:10px; border-width:2px;}
    .sCapsule_case1 .box1 dl dt {font-size:1.125em;}
    .sCapsule_case1 .box1 dl dd {font-size:0.9375em; margin-top:2px;}
    .sCapsule_case1 .box1 .txt1:after {margin-left:25px}
    .sCapsule_case1 .box1 .txt1 dt:before {width:15px;}
    .sCapsule_case1 .box1 .txt2:after {margin-right:75px;}
    .sCapsule_case1 .box1 .txt2 dt:before {width:75px;}

    .sCapsule_case1 .box2 {gap:30px;}
    .sCapsule_case1 .box2 .circle {width:100px; height:100px; padding:12px;}
    .sCapsule_case1 .box2 .circle:after {width:calc(100% - 50px); height:calc(100% - 50px);}
    .sCapsule_case1 .box2 dl:before {width:6px; height:6px;}
    .sCapsule_case1 .box2 dl:after {width:10px; height:10px; border-width:2px;}
    .sCapsule_case1 .box2 dl dt {font-size:1.125em;}
    .sCapsule_case1 .box2 dl dd {font-size:0.9375em; margin-top:0;}
    .sCapsule_case1 .box2 .txt1 {max-width:calc(50% - 85px);}
    .sCapsule_case1 .box2 .txt1:after {margin-left:25px;}
    .sCapsule_case1 .box2 .txt1 dt:before {width:15px;}
    .sCapsule_case1 .box2 .txt2:after {margin-right:75px; margin-top:9px;}
    .sCapsule_case1 .box2 .txt2 dt:before {width:70px; transform:translateY(-50%) rotate(-26deg)}
    .sCapsule_case1 .box2 .txt3 {margin-top:25px;}
    .sCapsule_case1 .box2 .txt3:after {margin-right:60px; margin-top:-5px;}
    .sCapsule_case1 .box2 .txt3 dt:before {width:50px; transform:translateY(-50%) rotate(5deg); transform-origin:right;}
    .sCapsule_case1 .box2 .wrap1 {max-width:calc(50% - 85px);}

    .sCapsule_case2 > div {border-radius:10px; padding:15px;}
    .sCapsule_case2 > div .tit {font-size:1.2em;}
    .sCapsule_case2 > div ul li {font-size:1em; padding-left:15px;}
    .sCapsule_case2 > div ul li:before {width:15px;}
    
    .sCapsule_case3 thead th {font-size:1.125em; padding:10px;}
    .sCapsule_case3 tbody th {font-size:1em; padding:10px;}
    .sCapsule_case3 tbody td {font-size:1em; padding:10px;}
}


.sRnd_case1 {display:flex; flex-wrap:wrap; gap:24px; counter-reset:counter;}
.sRnd_case1 > div {width:calc(50% - 12px); min-height:327px; background:#f6f6f6; border-radius:30px; padding:40px;}
.sRnd_case1 > div:before {content:counter(counter, decimal-leading-zero); counter-increment:counter; display:block; font-size:3.125em; color:#005bff; line-height:1.2em; font-weight:600; font-family:var(--font-baijamjuree); margin-bottom:16px;}
.sRnd_case1 > div dl dt {font-size:1.5em; line-height:1.45em; font-weight:600;}
.sRnd_case1 > div dl dd {font-size:1.25em; color:#666; line-height:1.5em; margin-top:16px}

.sRnd_slide1 .swiper-slide { overflow:hidden;}
.sRnd_slide1 img {display:block; width:100%; border-radius:30px;}

@media screen and (max-width:1024px){
    .sRnd_case1 {gap:15px;}
    .sRnd_case1 > div {width:calc(50% - 7.5px); min-height:270px; border-radius:15px; padding:25px;}
    .sRnd_case1 > div:before {font-size:2.7em; margin-bottom:10px;}
    .sRnd_case1 > div dl dt {font-size:1.3em;}
    .sRnd_case1 > div dl dd {font-size:1.125em; margin-top:10px;}
    
    .sRnd_slide1 img {border-radius:15px;}
}

@media screen and (max-width:767px){
    .sRnd_case1 {gap:7px;}
    .sRnd_case1 > div {width:100%; min-height:0; border-radius:10px; padding:20px; position:relative;}
    .sRnd_case1 > div:before {font-size:1.2em; line-height:1.3em; margin-bottom:0; position:absolute; left:20px; top:20px;}
    .sRnd_case1 > div dl dt {font-size:1.2em; padding-left:25px;}
    .sRnd_case1 > div dl dd {font-size:1em; margin-top:7px;}
    
    .sRnd_slide1 img {border-radius:10px;}
}


.sFlavor_case1 {display:flex; flex-wrap:wrap; gap:24px;}
.sFlavor_case1 > div {width:calc(16.66% - 20px);}
.sFlavor_case1 > div .img {width:100%; border-radius:30px; overflow:hidden;}
.sFlavor_case1 > div .img img {width:100%;}
.sFlavor_case1 > div p {font-size:1.25em; line-height:1.5em; font-weight:600; text-align:center; margin-top:16px;}

.sFlavor_case2 {width:100%; border-top:1px solid #ccc;}
.sFlavor_case2 tbody th {width:233px; border-bottom:1px solid #ccc; font-size:1.25em; line-height:1.5em; font-weight:600; text-align:left; padding:24px;}
.sFlavor_case2 tbody td {border-bottom:1px solid #ccc; font-size:1.25em; color:#666; line-height:1.5em; padding:24px 0;}

@media screen and (max-width:1024px){
    .sFlavor_case1 {gap:20px 10px;}
    .sFlavor_case1 > div {width:calc(16.66% - 8.33px)}
    .sFlavor_case1 > div .img {border-radius:15px;}
    .sFlavor_case1 > div p {font-size:1.125em; margin-top:10px;}
    
    .sFlavor_case2 tbody th {width:160px; font-size:1.125em; padding:15px;}
    .sFlavor_case2 tbody td {font-size:1.125em; padding:15px 0;}
}

@media screen and (max-width:767px){
    .sFlavor_case1 {gap:15px 10px;}
    .sFlavor_case1 > div {width:calc(33.33% - 6.66px)}
    .sFlavor_case1 > div .img {border-radius:10px;}
    .sFlavor_case1 > div p {font-size:1em; margin-top:7px;}
    
    .sFlavor_case2 tbody th {width:110px; font-size:1em; padding:10px;}
    .sFlavor_case2 tbody td {font-size:1em; padding:10px 0;}
}


.sContact_case1 .form_box {display:flex; justify-content:space-between; flex-wrap:wrap; width:100%;}
.sContact_case1 .form_box > div {width:calc(50% - 7px)}
.sContact_case1 .form_box > div.w_100 {width:100%;}
.sContact_case1 .form_box > div:nth-child(2) ~ div {margin-top:24px;}
.sContact_case1 .form_box > div > label {display:block; font-size:1.25em; font-weight:600; margin-bottom:12px;}
.sContact_case1 .form_box > div > label i {color:#005bff; font-style:normal;}
.sContact_case1 .form_box > div .form_txt {display:block; width:100%; height:70px; background:#fff; border:1px solid #bec1c7; border-radius:10px; font-size:1.25em; padding:0 24px;}
.sContact_case1 .form_box > div .form_txt:focus {border:2px solid #005bff !important; box-shadow:5px 5px 10px rgba(19,46,207,0.1) !important; outline:none;}
.sContact_case1 .form_box > div .form_textarea {display:block; width:100%; height:320px; background:#fff; border:1px solid #bec1c7; border-radius:10px; font-size:1.25em; line-height:1.5em; padding:24px; resize:none;}
.sContact_case1 .form_box > div .form_textarea:focus {border:2px solid #005bff !important; box-shadow:5px 5px 10px rgba(19,46,207,0.1) !important; outline:none;}
.sContact_case1 .form_box > div .select_box {position:relative;}
.sContact_case1 .form_box > div .select_box:after {content:'\f107'; font-size:1.25em; font-weight:400; font-family:'Font Awesome 6 Pro'; position:absolute; right:24px; top:50%; transform:translateY(-50%); pointer-events:none;}
.sContact_case1 .form_box > div .select_box select {display:block; width:100%; height:70px; background:#fff; border:1px solid #bec1c7; border-radius:10px; font-size:1.25em; color:#6b7280; padding:0 24px; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.sContact_case1 .form_box > div .select_box select:focus {border:2px solid #005bff !important; box-shadow:5px 5px 10px rgba(19,46,207,0.3) !important; outline:none;}

.sContact_case1 .form_box > div .phone_box {display:flex; align-items:center;}
.sContact_case1 .form_box > div .phone_box span {display:block; width:29px; font-size:1.25em; text-align:center;}
.sContact_case1 .form_box > div .phone_box .form_txt {width:calc(33.33% - 19.33px)}

.sContact_case1 .form_box > div .email_box {display:flex; align-items:center; flex-wrap:wrap; width:100%;}
.sContact_case1 .form_box > div .email_box span {display:block; width:34px; font-size:1.25em; text-align:center;}
.sContact_case1 .form_box > div .email_box .form_txt {width:calc(33.33% - 21px);}
.sContact_case1 .form_box > div .email_box .select_box {width:33.33%; margin-left:8px;}

.sContact_case1 .privacy_box {width:100%; height:160px; background:#f6f6f6; border-radius:10px; overflow-y:auto; padding:24px; margin-top:24px;}
.sContact_case1 .privacy_box p {font-size:1.125em; color:#666; line-height:1.55em;}

.sContact_case1 .box1 {display:flex; justify-content:space-between; align-items:center; margin-top:18px;}

.sContact_case1 .check_box {position:relative;}
.sContact_case1 .check_box input {display:block; width:100%; height:100%; position:absolute; left:0; top:0; opacity:0;}
.sContact_case1 .check_box label {display:flex; align-items:center;}
.sContact_case1 .check_box label:before {content:''; display:flex; justify-content:center; align-items:center; width:24px; height:24px; border:1px solid #bec1c7; border-radius:4px; font-size:0.9375em; color:#fff; font-weight:400; font-family:'Font Awesome 6 Pro'}
.sContact_case1 .check_box label span {font-size:1.125em; font-weight:600; padding-left:12px;}
.sContact_case1 .check_box input:checked + label:before {content:'\f00c'; background:#005bff; border-color:#005bff;}

.sContact_case1 .btn_box {display:flex; justify-content:center; margin-top:55px;}
.sContact_case1 .btn_box .submit_btn {display:flex; justify-content:space-between; align-items:center; width:300px; height:78px; background:#005bff; border-radius:10px; font-size:1.25em; color:#fff; font-weight:600; padding:0 24px; transition:background 0.5s;}
.sContact_case1 .btn_box .submit_btn:after {content:'\e09f'; font-size:1em; font-weight:400; font-family:'Font Awesome 6 Pro'}
.sContact_case1 .btn_box .submit_btn:hover {background:#0a327a}

@media screen and (max-width:1024px){
    .sContact_case1 .form_box > div {width:calc(50% - 5px)}
    .sContact_case1 .form_box > div:nth-child(2) ~ div {margin-top:2.5%;}
    .sContact_case1 .form_box > div > label {font-size:1.125em; margin-bottom:1.5%;}
    .sContact_case1 .form_box > div .form_txt {height:50px; font-size:1.125em; padding:0 15px;}
    .sContact_case1 .form_box > div .form_textarea {height:200px; font-size:1.125em; padding:20px;}
    .sContact_case1 .form_box > div .select_box:after {font-size:1.125em; right:15px;}
    .sContact_case1 .form_box > div .select_box select {height:50px; font-size:1.125em; padding:0 15px;}

    .sContact_case1 .form_box > div .phone_box span {width:15px; font-size:1.125em;}
    .sContact_case1 .form_box > div .phone_box .form_txt {width:calc(33.33% - 10px)}

    .sContact_case1 .form_box > div .email_box span {width:25px; font-size:1.125em;}
    .sContact_case1 .form_box > div .email_box .form_txt {width:calc(33.33% - 15px);}
    .sContact_case1 .form_box > div .email_box .select_box {margin-left:5px;}

    .sContact_case1 .privacy_box {height:120px; padding:15px; margin-top:2%;}
    .sContact_case1 .privacy_box p {font-size:1em;}

    .sContact_case1 .box1 {margin-top:2%;}

    .sContact_case1 .check_box label:before {width:22px; height:22px;}
    .sContact_case1 .check_box label span {font-size:1em; padding-left:6px;}
    
    .sContact_case1 .btn_box {margin-top:5%;}
    .sContact_case1 .btn_box .submit_btn {width:200px; height:55px; font-size:1.125em; padding:0 20px;}
}

@media screen and (max-width:767px){
    .sContact_case1 .form_box > div {width:100%}
    .sContact_case1 .form_box > div:nth-child(1) ~ div {margin-top:5%;}
    .sContact_case1 .form_box > div > label {font-size:1em;}
    .sContact_case1 .form_box > div .form_txt {height:38px; border-radius:5px; font-size:1em; padding:0 10px;}
    .sContact_case1 .form_box > div .form_textarea {height:150px; border-radius:5px; font-size:1em; padding:10px;}
    .sContact_case1 .form_box > div .select_box:after {font-size:1em; right:10px;}
    .sContact_case1 .form_box > div .select_box select {height:38px; border-radius:5px; font-size:1em; padding:0 10spx;}

    .sContact_case1 .form_box > div .phone_box span {width:15px; font-size:1em;}
    .sContact_case1 .form_box > div .phone_box .form_txt {width:calc(33.33% - 10px)}

    .sContact_case1 .form_box > div .email_box span {width:20px; font-size:1em;}
    .sContact_case1 .form_box > div .email_box .form_txt {width:calc(50% - 10px)}
    .sContact_case1 .form_box > div .email_box .select_box {width:100%; margin:5px 0 0;}

    .sContact_case1 .privacy_box {height:100px; border-radius:5px; padding:10px;}
	
	.sContact_case1 .box1 {justify-content:start; align-items:start; flex-direction:column;}
	
	.sContact_case1 .check_box {margin-bottom:5%;}
    .sContact_case1 .check_box label:before {width:20px; height:20px;}
    .sContact_case1 .check_box label span {padding-left:5px;}
    
    .sContact_case1 .btn_box .submit_btn {width:130px; height:40px; border-radius:5px; font-size:1em; padding:0 12px;}
}


.scroll_box {display:none;}

@media screen and (max-width:767px){
.scroll_box {display:flex; justify-content:end;}
.scroll_box p {font-size:0.875em; color:#666; margin-right:10px;}
.scroll_box div {width:50px; position:relative; margin-top:2px;}
.scroll_box div:before {content:''; display:block; width:100%; height:3px; background:#ccc; border-radius:5px; position:absolute; left:4px; right:0;}
.scroll_box div i {display:block; width:25px; font-size:1.5em; color:#aaa; text-align:center; position:relative; margin-top:-1px; padding-top:10px; animation:moveScrollAni 3s both infinite;}
.scroll_box div i:after {content:''; display:block; width:100%; height:5px; background:rgba(0,0,0,0.7); border-radius:5px; position:absolute; left:0; top:0;}

@keyframes moveScrollAni {
		0%, 10% {
			left: 0;
			margin-left: 0px;
		}
		50% {
			left: 100%;
			margin-left: -20px;
		}
		100% {
			left: 0;
			margin-left: 0px;
		}
	}
}