@charset "utf-8";
/*───────────────────────────────────────────────────────────
	layout common
───────────────────────────────────────────────────────────*/
	#wrap {position:relative;width:100%; overflow: clip;}
    .w_custom{position: relative; width: calc(100% - 60px); max-width: 1400px; margin-inline: auto; }
    #container{position: relative; padding-bottom:clamp(100px, 15vw, 150px);}
	#container:has(.fullSec){width:100%; max-width:100%;}
	#container:has(.pbDn){padding-bottom: 0;}


	@media (max-width:1500px){
		br.for_pc{display: none;}
	}
    @media (max-width:1023px){
    }
    @media (max-width:860px){
        .w_custom{width: calc(100% - 30px);}
    }
    @media (max-width:320px){
        .w_custom{width: calc(100% - 20px);}
    }

    body::-webkit-scrollbar { display:none; }

/*───────────────────────────────────────────────────────────

    HEADER | outline/header.html, outline/nav.html

───────────────────────────────────────────────────────────*/
	#header {position:sticky;top:0;width:100%;height:clamp(60px, 11vw, 110px);z-index:100;transition: all 0.4s; background: var(--point-white);}
	#header .w_custom { display:flex; align-items:center; justify-content:space-between; max-width:1730px; height:100%;}
	#header .hd_logo {flex-shrink:0;height: 100%;}
        #header .hd_logo a {display: flex;max-width: clamp(106px, 17vw, 152px);height:100%;align-items: center;padding-block: 15px;}
	#header .gnb {position: absolute;top: 0;left: 50%;translate: -50%;display:flex;justify-content: center;text-align: center;width: calc(100% - 300px);gap: clamp(30px, 4.2vw, 80px);height: 100%;}
        #header .gnb > li {position:relative;font-size:var(--title-20);height: 100%;}
        #header .gnb > li > a {display: flex;align-items: center;justify-content: center;height: 100%;font-weight:600;font-size:95%;color:var(--black-color03);letter-spacing:-0.03em;transition: all 0.4s;}
	#header .gnb .dep02 { position: absolute; top: 80%; left: 50%; translate: -50%; background: var(--point-color01); border-radius: var(--radius-10); padding-block: 20px; opacity: 0; pointer-events: none; transition: all 0.4s; width: 180px; }
        #header .gnb .dep02 > li {font-size: 90%;font-weight: 500;transition: all 0.4s;text-align: center;}
        #header .gnb .dep02 > li > a {display: block;padding: 10px 20px;filter: var(--filter-white);transition: inherit;}
	#header .gnb .dep03{position: absolute;top: 0;left: 100%;background: var(--black-color00);border-radius: var(--radius-10);padding-block: 20px;opacity: 0;pointer-events: none;transition: all 0.4s;width: 180px;}
	#header .gnb .dep03 > li{font-size: 85%;}
	#header .gnb .dep03 > li > a{display: block;padding: 8px 25px;filter: var(--filter-white);transition: all 0.4s;}
	#header .hd_right { display:flex; align-items:center; gap:20px; flex-shrink:0; }
	#header .allCate {display:flex;flex-direction:column;justify-content:space-between;width: clamp(24px, 3.3vw, 28px);aspect-ratio: auto 1.55;transition: all 0.4s;}
        #header .allCate span { display:block; width:100%; height:2px; background:var(--black-color03); transition:all 0.3s ease;}
        #header .allCate.on span:nth-child(1) { transform:translateY(8px) rotate(45deg); }
        #header .allCate.on span:nth-child(2) { opacity:0; }
        #header .allCate.on span:nth-child(3) { transform:translateY(-8px) rotate(-45deg); }

		/* color*/
		body:has([class*="visual"]) #header{position: fixed; left:0; }
		body:has([class*="visual"]) #header:not(.on){background: var(--trans-color);}
		body:has([class*="visual"]) #header:not(.on) :where(.hd_logo a, .gnb > li > a, .allCate){filter: var(--filter-white);}

        /*on*/
        #header.on { box-shadow: 0 -1px 0 inset var(--border-color01); }

        /*over*/
        @media (hover: hover) and (pointer: fine) {
            #header:hover { box-shadow: 0 -1px 0 inset var(--border-color01); }
			body:has([class*="visual"]) #header:not(.on):hover{background: var(--point-white);}
            body:has([class*="visual"]) #header:not(.on):hover :where(.hd_logo a, .gnb > li > a, .allCate){filter: none;}
            #header .gnb > li:hover > a { color: var(--point-color01); }
            #header .gnb > li:hover .dep02 { opacity: 1; pointer-events: all; }
            #header .gnb .dep02:has(> li:hover) > li:not(:hover) > a{opacity: 0.4;}
			#header .gnb .dep02 > li:hover .dep03{opacity:1; pointer-events:auto;}
			#header .gnb .dep03:has(> li:hover) > li:not(:hover) > a{opacity: 0.4;}
        }

	@media only screen and (max-width:1280px) {
		#header .gnb {gap:30px;}
		#header .gnb > li > a { font-size:17px; }
	}
	@media only screen and (max-width:1023px) {
		#header .gnb { display:none; }
	}

/*───────────────────────────────────────────────────────────

    ASIDE | outline/header.html, outline/nav.html

───────────────────────────────────────────────────────────*/
	#aside{position: fixed;top: 0;left:0;width: 100%;height: 100%;z-index: 999;background: rgba(255,255,255,0.8);backdrop-filter:blur(10px);display: flex;flex-direction: column;overflow: hidden;overflow-y: auto; box-sizing: border-box;opacity: 0;transition: all 0.6s;clip-path: inset(0 0 100% 0);}
	#aside.on { opacity: 1; clip-path: inset(0); }
	body:has(#aside.on) { overflow: clip; touch-action: none; }
	#aside .w_custom { flex-shrink: 0; max-width: 1720px; min-height: 100%; padding-block: 100px; }
	#aside .cont { position: relative; width: 100%; display: flex; flex-direction: column; height: 100%; justify-content: center; }
	#aside .gnb { width: 100%; font-size: var(--title-20); letter-spacing: 0; display: grid; align-items: start; justify-content: center; grid-template: auto / repeat(5, 1fr); gap: clamp(15px, 2.2vw, 40px); }
	#aside .gnb > li { color: var(--black-color01); font-size: inherit; text-align: center; }
	#aside .gnb > li > a{position: relative;display: block;font-size: 180%;font-weight: 700;line-height: 1.2;padding-block: 30px;transition: all 0.4s;}
	#aside .gnb > li > a:before{position: absolute;content: '';top: 0;left: 50%;translate: -50%;width:12px;height: 0;opacity:0;border-radius:100%;background: var(--point-color01);transition:all 0.3s;}
	#aside .gnb > li > a em{font-weight: inherit;}
	#aside .gnb > li > a span{font-size: 60%;font-weight: 400;color: rgba(255,255,255,0.6);}
	#aside .gnb .dep02{margin-top: 8px;}
	#aside .gnb .dep02 > li { transition: all 0.4s; }
	#aside .gnb .dep02 > li > a{display: block;font-size:110%;font-weight:400;padding-block: 15px;color: var(--black-color06);transition: all 0.4s;}
	#aside .gnb .dep03{padding-block: 3px 10px;}
	#aside .gnb .dep03 > li { transition: all 0.4s; }
	#aside .gnb .dep03 > li > a{display: block;font-size: 90%;font-weight: 300;padding-block: 7px;color: var(--black-color08);transition: all 0.4s;}
	#aside .close_btn{position: absolute; width: 40px;height: 40px;z-index: 9;  top: 40px; right: 0;  }
	#aside .close_btn span{position: absolute;top:50%;left:50%;transform: translate(-50%, -50%) rotate(45deg);width: 100%;height: 2px;background: var(--black-color01);}
	#aside .close_btn span + span{transform: translate(-50%, -50%) rotate(-45deg);}

	@media (hover: hover) and (pointer: fine) {
		#aside .gnb > li:hover > a::before { height: 12px; opacity: 1; }
		#aside .gnb .dep02 > li:hover > a{color: var(--point-color01);}
		#aside .gnb .dep03 > li:hover > a{color: var(--black-color00);}
	}

	@media (max-width: 1280px) {
		#aside .gnb { grid-template: auto / repeat(3, 1fr); }
	}

	@media (min-width:861px) {
		#aside .gnb > li{opacity:0;translate:0 100px;transition:all 0.8s 0.3s;}
		#aside.on .gnb > li{opacity:1;translate:0;}
		#aside.on .gnb > li:nth-child(2){transition-delay:0.4s;}
		#aside.on .gnb > li:nth-child(3){transition-delay:0.5s;}
		#aside.on .gnb > li:nth-child(4){transition-delay:0.6s;}
		#aside.on .gnb > li:nth-child(5){transition-delay:0.7s;}
		#aside.on .gnb > li:nth-child(6){transition-delay:0.8s;}
	}

	@media (max-width: 1023px) {
		#aside .w_custom { padding-block: clamp(70px, 10vw, 100px);  }
		#aside .close_btn { width: clamp(25px, 4vw, 40px); height: clamp(25px, 4vw, 40px); }
	}

	@media (max-width: 860px) {
		#aside { display: block; }
		#aside .gnb{grid-template: auto / repeat(1, 1fr);gap:0;}
		#aside .gnb > li { display: block; padding: 25px 0; width: 100%; text-align: left; box-sizing: border-box; border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
		#aside .gnb > li > a { padding-block: 0; }
		#aside .gnb > li > a::before { display: none; }
		#aside .gnb .dep02 { display: grid; gap: 0 20px; grid-template: auto / repeat(2, 1fr); margin-top: 15px; justify-content: flex-start; }
		#aside .gnb .dep02 > li > a { padding-block: 12px; }
	}

	@media (max-width: 640px) {
		#aside .gnb > li > a{font-size: 170%;}
		#aside .gnb .dep02 > li > a{padding-block: 7px;font-size:100%;}
	}

	@media (max-width: 479px) {
		#aside .gnb > li > a { font-size: 150%; }
		#aside .gnb > li > a span { width: 100%; }
		#aside .gnb .dep02 { margin-top: 10px; grid-template: auto / repeat(1, 1fr); }
		#aside .gnb .dep02 > li > a { font-size: 95%; }
	}

/*───────────────────────────────────────────────────────────

    FOOTER | outline/footer.html

───────────────────────────────────────────────────────────*/
	#footer{position: relative; z-index: 2; background:var(--black-color00);padding:60px 0 58px;}
	#footer .ft_top_box{display: flex;align-items: center;justify-content: space-between;}
		#footer .ft_top_box .ft_logo{filter:var(--filter-white);}
		#footer .ft_top_box .ft_right{display: flex;align-items: center;gap:10px;}
		#footer .ft_top_box .ft_right .family_site{position: relative;}
		#footer .ft_top_box .ft_right .family_site dt{box-sizing:border-box;width:240px;height:50px;display: flex;align-items: center;justify-content: space-between;padding:0 24px;border-radius:60px;background:rgba(255,255,255,0.1);cursor:pointer;}
		#footer .ft_top_box .ft_right .family_site dt:after{content:"";clip-path:var(--clip-poly01);display: inline-block;width:10px;height:6px;transition:all 0.3s;background:var(--point-white);}
		#footer .ft_top_box .ft_right .family_site dt.on:after{transform:rotate(180deg);}
		#footer .ft_top_box .ft_right .family_site dt span{font-size:var(--title-16);color:var(--point-white);font-weight:400;font-family:var(--font-type02);letter-spacing:-0.03em;}
		#footer .ft_top_box .ft_right .family_site dd{width:100%;position: absolute;top:calc(100% + 10px);left:0;box-sizing:border-box;background:var(--point-white);padding:20px 15px;opacity:0;pointer-events:none;transition:all 0.3s;}
		#footer .ft_top_box .ft_right .family_site:has(dt.on) dd{opacity: 1; pointer-events: all;}
		#footer .ft_top_box .ft_right .family_site dd ul{display: flex;flex-direction: column;gap:15px;}
		#footer .ft_top_box .ft_right .family_site dd ul li a{display: block;font-size:var(--title-16);color:var(--black-color03);font-weight:400;}
	#footer .ft_info_box{box-sizing:border-box;margin-top:50px;padding:40px 0 58px;border-top:1px solid rgba(255,255,255,0.2);}
		#footer .ft_info_box .addr_box{display: flex;align-items: center;}
		#footer .ft_info_box .addr_box p{font-size:var(--title-18);color:var(--point-white);font-weight:300;letter-spacing:-0.02em;opacity:0.8;}
		#footer .ft_info_box .addr_box p + p:before{width:1px;height:12px;content:"";margin:0 20px;display: inline-block;background:var(--point-white);}
		#footer .ft_info_box .info_box{margin-top:18px;display: flex;align-items: center;gap:40px;}
		#footer .ft_info_box dl{display: flex;align-items: center;gap:20px;font-size:var(--title-18);color:var(--point-white);font-family:var(--font-type02);}
		#footer .ft_info_box dl dt, #footer .ft_info_box dl dd{font-size:inherit;color:inherit;font-weight:400;font-family:inherit;letter-spacing:-0.03em}
		#footer .ft_info_box dl dd{font-weight:300;}
	#footer .ft_copy{display: flex;align-items: center;justify-content: space-between;}
		#footer .ft_copy .copyright{font-size:var(--title-16);color:var(--point-white);font-weight:300;line-height:1.6;font-family:var(--font-type02);letter-spacing:-0.03em;opacity:0.3;}
		#footer .ft_copy .copyright a{font-size:inherit;color:inherit;font-weight:inherit;}
	#footer .ft_menu{display: flex;align-items: center;gap:40px;}
		#footer .ft_menu li a{font-size:var(--title-18);color:rgba(255,255,255,0.8);font-weight:400;line-height:1.6;letter-spacing:-0.03em;}
		#footer .ft_menu li a strong{font-size:inherit;color:var(--point-color01);font-weight:600;}

        .ft_quick{position: fixed;bottom:40px;right:40px;z-index:10;opacity:0;pointer-events:none;transition:all 0.3s;}
        .ft_quick.on{opacity:1;pointer-events:initial;}
        .ft_quick ul{display: flex;flex-direction: column;gap:20px;}
        .ft_quick ul li{width:60px;aspect-ratio:auto 1;box-sizing: border-box;border-radius:100%;box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.20);}
        .ft_quick ul li a, .ft_quick ul li button{display: flex;align-items: center;justify-content: center;width:100%;height:100%;}
        .ft_quick ul li.bt_cs{background:var(--point-color01);}
        .ft_quick ul li.bt_top{background:var(--black-color00);}
        .ft_quick ul li.bt_top button:before{width:8px;aspect-ratio:auto 1;content:"";border:2px solid var(--point-white);border-width:2px 2px 0 0;transform:rotate(-45deg);display: inline-block;translate:0 3px;}
		
	@media (max-width:1023px){
		#footer{padding-block:clamp(40px, 6vw, 60px);}
        #footer .ft_info_box{margin-top:clamp(20px, 5vw, 50px);padding:clamp(20px, 4vw, 40px) 0 clamp(25px, 5.8vw, 58px);}
        #footer .ft_info_box .addr_box{flex-wrap:wrap;gap:10px 20px;}
        #footer .ft_info_box .addr_box p + p:before{display: none;}
        #footer .ft_info_box .info_box{margin-top:clamp(10px, 1.8vw, 18px);gap:10px 20px;flex-wrap:wrap;}
        #footer .ft_info_box dl{gap:10px;}

        .ft_quick{bottom:20px;right:20px;}
        .ft_quick ul{gap:clamp(10px, 2vw, 20px)}
        .ft_quick ul li{width:clamp(40px, 6vw, 60px);}
        .ft_quick ul li img{max-width:30%;}
	}
    @media (max-width:767px){
        #footer .ft_top_box .ft_logo{height:24px;}
        #footer .ft_top_box .ft_right .family_site dt{width:200px;height:44px;padding:0 15px;}
        #footer .ft_copy{flex-direction: column-reverse;align-items: flex-start;gap:20px;}    
    }
    @media (max-width:479px){
        #footer .ft_top_box{flex-direction: column;align-items: flex-start;gap:20px;}
        #footer .ft_menu{gap:20px;}
    }
	

/*───────────────────────────────────────────────────────────

    MAIN | index.html

───────────────────────────────────────────────────────────*/
	/*video*/
		.main_video { position: relative; height: 960px; }
		.main_video::before { content: ''; position: absolute; inset: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); z-index: 1; }
		.main_video video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
		.main_video img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
		.main_video .txt_box { height: 100%; font-size: var(--title-20); display: flex; flex-direction: column; justify-content: center; gap:35px; z-index: 2;max-width: 1510px;text-align: center; align-items: center;translate:0 -10px;}
			.main_video .txt_box h2 { font-size: 350%; font-weight: 700; line-height: 1.3; letter-spacing:-0.03em;color:var(--point-white);}
			.main_video .txt_box span { font-size: 120%; font-weight: 400; line-height: 1.4; letter-spacing:0;font-family:var(--font-type02);color:var(--point-white);}
			.main_video .txt_box p { font-size: 100%; font-weight: 400; line-height: 1.3; letter-spacing: -0.03em; margin-top:25px;border-radius: 60px;background: rgba(255, 255, 255, 0.10);backdrop-filter: blur(12px);display: inline-block;padding:18px 30px;color:var(--point-white);}
		.main_video .scr_dwn{position: absolute;bottom:100px;right:106px;font-size:var(--title-20);display: flex;flex-direction: column;gap:20px;align-items: center;cursor:pointer;z-index:10;opacity:0.6;}
			.main_video .scr_dwn span{font-size:70%;color:var(--point-white);writing-mode:sideways-rl;letter-spacing:0.02em;}
			.main_video .scr_dwn .arw{width:10px;height:14px;display: flex;flex-direction: column;align-items: center;justify-content: center;animation: arw_ani 2s infinite;}
			.main_video .scr_dwn .arw:before, .main_video .scr_dwn .arw:after{width:8px;aspect-ratio:auto 1;content:"";box-sizing: border-box;border:2px solid var(--point-white);border-width:2px 2px 0 0;transform:rotate(135deg);}
		@keyframes arw_ani {
			0% { transform: translateY(0); }
			50% { transform: translateY(10px); }
			100% { transform: translateY(0); }
		}


		@media (max-width: 1023px) {
			.main_video { height: clamp(540px, 96vw, 960px); }
			.main_video .txt_box { gap: clamp(20px, 3.5vw, 35px); }
			.main_video .txt_box h2 { font-size: clamp(40px, 6vw, 350%); }
			.main_video .txt_box span { font-size: clamp(105%, 2.6vw, 120%); }
			.main_video .txt_box p { font-size: clamp(100%, 2.2vw, 120%); margin-top: clamp(10px, 2.5vw, 25px); }
			.main_video .scr_dwn{right:30px;bottom:9%;}
		}
		@media (max-width: 640px) {
			.main_video .scr_dwn{display: none;}
            .main_video .txt_box{translate:0;}
			.main_video .txt_box p{padding:12px 15px;}
		}
		
	/*공통*/
		.main_content > section{position: relative;box-sizing:border-box;}
		
		/*title*/
		.main_title{display:grid;gap:20px;font-size:var(--title-20);margin-bottom:50px;}
		.main_title p{font-size:110%;color:var(--point-color01);font-weight:500;line-height:1.4;}
		.main_title h3{font-size:270%;color:var(--black-color01);font-weight:600;line-height:1.4;letter-spacing:-0.03em}
		
		/*more01*/
		.main_more{display: flex;align-items: center;justify-content: center;width:50px;aspect-ratio:auto 1;box-sizing:border-box;border-radius:100%;background:var(--point-white);}

        /*more02*/
        .main_more02{display: flex;align-items: center;gap:14px;height:23px;overflow:hidden;}
        .main_more02 .txt{display: flex;flex-direction: column;gap:4px;font-size:var(--title-20);color:var(--point-white);font-weight:500;transition:all 0.4s;height:24px;letter-spacing:-0.04em}
        .main_more02 .txt span{font-size:inherit;color:inherit;font-weight: inherit;display: inline-block;height:26px;}
        .main_more02 .txt:after{content:"VIEW MORE";font-size:inherit;color:var(--point-color01);font-weight: inherit;display: inline-block;height:26px;}
        .main_more02 .arw_box{width:22px;aspect-ratio:auto 1;box-sizing:border-box;background:var(--point-color01);border-radius:100%;display: flex;align-items: center;overflow:hidden;}
        .main_more02 .arw{display: flex;align-items: center;gap:20px;translate:-26px;transition:all 0.4s;}
        .main_more02 .arw:before{width:11px;height:8px;content:"";background:url('../images/skin/view_more01.svg')no-repeat center;display: inline-block;flex-shrink:0;}

		
        @media (hover: hover) and (pointer: fine) {
            /*more02*/
            .main_more02:hover .txt{translate:0 calc(-100% - 4px);}
            .main_more02:hover .arw{translate:5px;}
        }
		@media (max-width: 1023px) {
			/*title*/
			.main_title{margin-bottom:clamp(20px, 4vw, 40px);gap:clamp(10px, 2vw, 20px);}
			.main_title p{font-size:clamp(100%, 2vw, 110%);}
			.main_title h3{font-size:clamp(220%, 4.5vw, 270%);}
			
			/*more01*/
			.main_more{width:40px;}
			.main_more img{width:clamp(10px, 1.4vw, 14px);}
		}
			
	
	/*solution*/
		.main_solution{padding:140px 0 180px;background: linear-gradient(180deg, var(--point-white) 0%, var(--gray-bg01) 50%, var(--gray-bg01) 100%);overflow:hidden;}
		.main_solution:before{content:"WP SOLUTIONS";font-size:180px;color:var(--point-white);font-weight:700;position: absolute;bottom:-53px;left:50%;translate:-50%;width:100%;text-align: center;}
		.main_solution .swiper-slide{width:calc(25% + 10px);box-sizing:border-box;border-radius:var(--radius-10);overflow:hidden;}
		.main_solution .swiper-slide:before{width:100%;height:100%;content:"";position: absolute;top:0;left:0;opacity: 0.5;background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 31.9%, #000 100%);transition:all 0.3s;pointer-events:none;z-index:2;}
		.main_solution .swiper-slide .thumb{width:100%;aspect-ratio:auto auto 0.857;}
		.main_solution .swiper-slide .thumb img{width:100%;height:100%;object-fit:cover;transition:all 0.3s;}
		.main_solution .swiper-slide .txt{width:100%;height:100%;position: absolute;top:0;left:0;box-sizing:border-box;padding:30px 30px 40px;display: flex;flex-direction: column;justify-content: space-between;z-index:3;}
		.main_solution .swiper-slide dl{font-size:var(--title-20);display:grid;gap:8px;filter:var(--filter-white);}
		.main_solution .swiper-slide dl dt{font-size:170%;font-weight:700;line-height:1.4;letter-spacing:-0.03em;}
		.main_solution .swiper-slide dl dd{font-size:100%;font-weight:500;line-height:1.4;letter-spacing:-0.03em;}
		.main_solution .main_more{align-self: flex-end;opacity:0;transition:all 0.3s;translate:-10px 10px;}
		
		
		@media (hover: hover) and (pointer: fine) {
			.main_solution .swiper-slide:hover:before{background: linear-gradient(180deg, rgba(223, 31, 42, 0.00) 31.9%, var(--point-color01) 100%);}
			.main_solution .swiper-slide:hover .thumb img{transform:scale(1.05);}
			.main_solution .swiper-slide:hover .main_more{opacity:1;translate:0;}
			
		}
		
		@media (max-width: 1450px) {
			.main_solution:before{font-size:10vw;bottom:-3vw;}
		}
		@media (max-width: 1023px) {
			.main_solution{padding:clamp(80px, 14vw, 140px) 0 clamp(70px, 16vw, 160px);}
			.main_solution .swiper-slide{width:calc(100% / 3 + 10px);}
			.main_solution .swiper-slide .txt{padding:20px 20px;}
		}
		@media (max-width:640px) {
			.main_solution .swiper-slide{width:calc(100% / 2 + 10px);}
		}
		@media (max-width:479px) {
			.main_solution .swiper-slide{width:75vw;}
		}
		
	/*service*/
		.main_tab{display: flex;flex-wrap:wrap;gap:10px;}
		#wrap .main_tab .swiper-pagination-bullet, #wrap .main_tab button{width:auto;height:auto;display: inline-flex;border-radius:0;background:none;opacity:1;height:45px;border-radius:45px;border:1px solid var(--border-color01);padding:0 24px;align-items: center;justify-content: center;font-size:var(--title-18);color:var(--black-color08);font-weight:500;transition:all 0.3s;margin:0;}
		#wrap .main_tab .swiper-pagination-bullet:before, #wrap .main_tab button:before{content:"";aspect-ratio:auto 1;box-sizing:border-box;border-radius:100%;background:var(--point-white);transition:all 0.3s;}
		#wrap .main_tab .swiper-pagination-bullet span, #wrap .main_tab button span{font-size:inherit;color:inherit;font-weight:inherit;letter-spacing:-0.03em;}
		#wrap .main_tab .swiper-pagination-bullet.on, #wrap .main_tab button.on{background:var(--point-color01);border-color:var(--point-color01);color:var(--point-white);}
		#wrap .swiper-pagination-bullet.on:before, #wrap .main_tab button.on:before{width:6px;margin-right:12px;}
		.main_service .service_swiper{margin-top:50px;}
		.main_service .service_swiper .swiper-slide{box-sizing:border-box;border-radius:var(--radius-20);overflow:clip;width:100%;height:640px;}
        .main_service .service_swiper a{display: flex;width:100%;height:100%;}
        .main_service .service_swiper .swiper-slide.swiper-slide-prev a{justify-content: flex-end;}
        .main_service .service_swiper .img{width:100%;height:100%;transition:width 0.3s ease;}
        
        .main_service .service_swiper .img img{max-width:initia;max-height:initial;position: absolute;top:0;left:0;min-width:1400px;}
		.main_service .service_swiper .txt{width:100%;height:100%;position: absolute;top:0;left:0;box-sizing:border-box;padding:30px 30px 60px 30px;display: flex;flex-direction: column;justify-content: space-between;z-index:3;}
		.main_service .service_swiper dl{font-size:var(--title-20);display:grid;gap:10px;filter:var(--filter-white);}
		.main_service .service_swiper dl dt{font-size:190%;font-weight:700;line-height:1.4;letter-spacing:-0.03em;}
		.main_service .service_swiper dl dd{font-size:100%;font-weight:500;line-height:1.6;letter-spacing:-0.03em;display: none;}
        .main_service .main_more{align-self: flex-end;transition:all 0.3s;opacity:0;}

        /*active*/
        .main_service .service_swiper .swiper-slide-active .txt{padding:40px 40px 80px 40px;}
        .main_service .service_swiper .swiper-slide-active dl dt{font-size:250%;}
        .main_service .service_swiper .swiper-slide-active dl dd{display: block;}
        .main_service .service_swiper .swiper-slide-active .main_more{opacity:1;}
		
        @media (min-width:1023px) {
            .main_service .service_swiper .swiper-slide:not(.swiper-slide-active) .img{width:20%;transition-delay:0.5s;}
            .main_service .service_swiper .swiper-slide.swiper-slide-next .img{transform-origin: left center;}
            .main_service .service_swiper .swiper-slide.swiper-slide-prev .img{transform-origin: right center;}
        }
		@media (max-width:1023px) {
			#wrap .main_tab .swiper-pagination-bullet, #wrap .main_tab button{height:clamp(36px, 4.5vw, 45px);}
			#wrap .main_tab .swiper-pagination-bullet.on:before, #wrap .main_tab button.on:before{width:clamp(3px, 0.6vw, 6px);margin-right:clamp(6px, 1.2vw, 12px);}
			.main_service .service_swiper{margin-top:clamp(20px, 4vw, 40px);}
			#wrap .main_service .service_swiper .txt{padding: clamp(20px, 4vw, 40px) clamp(15px, 5vw, 50px);}
			#wrap .main_service .service_swiper dl dt{font-size:200%;}
            .main_service .service_swiper .swiper-slide{height:auto;}
            .main_service .service_swiper .img{aspect-ratio:auto 2;}
		}
		@media (max-width:640px) {
			#wrap .main_tab .swiper-pagination-bullet, #wrap .main_tab button{padding:0 10px;}
			.main_service .service_swiper .img{aspect-ratio:auto 1.5;}
			.main_service .service_swiper dl{gap:4px;}
		}
		@media (max-width:479px) {
			.main_service .service_swiper .img{aspect-ratio:auto 1.2;}
		}

    /*indus*/
        .main_indus{padding:180px 0;background:url('../images/skin/main_indus_bg.jpg')no-repeat center;background-size:cover;background-attachment:fixed;}
		.main_indus .w_custom{display: flex;align-items: flex-start;justify-content: space-between;gap:20px;}
		.main_indus .main_title{width:500px;position:sticky;top:180px;left:0;gap:40px;justify-items:start;}
            .main_indus .main_title h3, .main_indus .main_title p{color:var(--point-white);}
            .main_indus .main_title p{font-size:120%;opacity:0.8;line-height: 1.6;letter-spacing: -0.03em;}
        .main_indus ul{display: grid;grid: auto / repeat(2, 1fr);gap:40px;width:800px;flex-wrap:wrap;}
            .main_indus ul > li{box-sizing:border-box;border-radius:var(--radius-15);overflow:hidden;background:var(--point-white);padding:40px 30px 30px;font-size:var(--title-20);}
			.main_indus ul > li:nth-child(2n){translate:0 clamp(80px, 12vw, 120px);}
            .main_indus ul > li .txt{display: flex;flex-direction: column;gap:30px;}
            .main_indus ul > li span{font-size:90%;color:var(--point-color01);font-weight:500;line-height:1.4;letter-spacing:-0.03em;}
            .main_indus ul > li p{font-size:130%;color:var(--black-color01);font-weight:500;line-height:1.4;letter-spacing:-0.03em;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp:2;}
            .main_indus ul > li .img{width:100%;box-sizing:border-box;aspect-ratio:auto 1.5;border-radius:var(--radius-10);overflow:hidden;margin-top:60px;}
            .main_indus ul > li .img img{width:100%;height:100%;object-fit:cover;}
        .main_indus ul > li .ov_box{width:100%;height:100%;position: absolute;top:0;left:0;padding:40px 30px 30px;box-sizing:border-box;border-radius:var(--radius-15);background:var(--point-color01);opacity:0;translate:0 100px;pointer-events:none;transition:all 0.4s;}
        .main_indus ul > li .ov_box .ov_title{display: flex;align-items: center;justify-content: space-between;opacity:0.8;filter:var(--filter-white);}
        .main_indus ul > li .ov_box dl{margin-top:20px;font-size:var(--title-20);}
        .main_indus ul > li .ov_box dl dt{font-size:130%;color:var(--point-white);font-weight:500;line-height:1.4;letter-spacing:-0.03em;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp:2;}
        .main_indus ul > li .ov_box dl dd{margin-top:20px;font-size:90%;color:var(--point-white);font-weight:400;line-height:1.6;letter-spacing:-0.03em;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp:4;}

        @media (hover: hover) and (pointer: fine) {
            .main_indus ul > li:hover .ov_box{opacity:1;translate:0;pointer-events:initial;}
        }

        @media (max-width:1023px) {
            .main_indus{padding-block:clamp(70px, 14vw, 140px);background-attachment:local;}
            .main_indus .w_custom{flex-direction: column;gap:0;}
            .main_indus .main_title{width:100%;position: static;width:100%;gap:clamp(20px, 4vw, 40px);}
            .main_indus ul{width:100%;}
            .main_indus ul > li{padding:clamp(20px, 4vw, 40px) clamp(15px, 3vw, 30px);}
            .main_indus ul > li .txt{gap:clamp(10px, 2vw, 20px);}
            .main_indus ul > li .img{margin-top:clamp(25px, 5vw, 50px);}
            .main_indus ul > li .ov_box{display: none;}
        }
        @media (max-width:860px) {
            .main_indus ul{gap:20px;max-height:calc(220vw + 40px);}
        }
        @media (max-width:479px) {
            .main_indus ul{max-height:initial;grid: auto / repeat(1, 1fr);}
			.main_indus ul > li:nth-child(2n){translate:0;}
        }

    /*board*/
        .main_board .board_content{margin-top:50px;}
        .main_board .board_content .board_content_item{display: none;}
        .main_board .board_content .board_content_item.on{display: block;}
        .main_board .board_content .board_content_item ul{display: flex;gap:40px;flex-wrap:wrap;}
        .main_board .board_content .board_content_item ul li{box-sizing:border-box;border-radius:var(--radius-20);overflow:hidden;background:var(--point-white);padding:0 0 38px;width:calc(100% /3 - 26.7px);border:1px solid var(--border-color01);position: relative;transition:all 0.3s;}
        .main_board .board_content .board_content_item ul li a{display: block;width:100%;height:100%;position: absolute;top:0;left:0;z-index:3;}
        .main_board .board_content .board_content_item ul li .thumb{width:100%;aspect-ratio:auto 1.56;overflow:hidden;}
        .main_board .board_content .board_content_item ul li .thumb img{width:100%;height:100%;object-fit:cover;transition:all 0.3s;}
        .main_board .board_content .board_content_item ul li .txt{box-sizing:border-box;padding:30px 30px 40px;display: flex;flex-direction: column;gap:14px;font-size:var(--title-20);}
        .main_board .board_content .board_content_item ul li .txt span{font-size:75%;color:var(--point-color01);font-weight:600;line-height:1.4;letter-spacing:-0.03em;}
        .main_board .board_content .board_content_item ul li .txt strong{font-size:130%;font-weight:500;line-height:1.4;color:var(--black-color03);letter-spacing:-0.03em;display: block;width:100%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
        .main_board .board_content .board_content_item ul li .txt p{font-size:90%;color:var(--black-color05);font-weight:400;line-height:1.6;letter-spacing:-0.03em;margin-top:6px;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp:2;}

        @media (hover: hover) and (pointer: fine) {
            .main_board .board_content .board_content_item ul li:hover{box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.20);border-color:var(--point-color01);}
            .main_board .board_content .board_content_item ul li:hover .thumb img{transform:scale(1.05);}
        }

        @media (max-width:1023px) {
            .main_board .board_content{margin-top:clamp(35px, 5vw, 50px);}
            .main_board .board_content .board_content_item ul{gap:clamp(20px, 3vw, 30px);}
            .main_board .board_content .board_content_item ul li{width:calc(100% /3 - (clamp(20px, 3vw, 30px) * 2) / 3);padding-bottom:10px;}
            .main_board .board_content .board_content_item ul li .txt{padding:clamp(20px, 3vw, 30px) clamp(15px, 3vw, 30px);}
        }
        @media (max-width:640px) {
            .main_board .board_content .board_content_item ul li{width:100%;}
        }

    /*contact*/
        .main_contact{box-sizing:border-box;padding:103px 0;background:url('../images/skin/main_cs_bg.jpg') no-repeat center;background-size:cover;}
        .main_contact .main_title{text-align: center;justify-items: center;margin:0;}
        .main_contact .main_title p{color:rgba(255, 255, 255, 0.80);}
        .main_contact .main_title h3{color:var(--point-white);margin-bottom:20px;}

        @media (max-width:1023px) {
            .main_contact{padding-block:clamp(50px, 10vw, 103px);}
        }