$(function(){
    $(".main-visual-slide").each(function  () {
        var $visualSlide = $(this);
		var $visualSlideItem = $(this).find(".main-visual-item");
		var visualNum = $visualSlideItem.length;
		var $visualControls = $(".main-visual-controls");

        $visualControls.find('.paging-controls .total').text(visualNum);

		$visualSlide.on('init', function(event, slick) {
            $("#mainVisual .main-visual-controls .progress-bar .ing-bar").addClass("active");
		})
		$visualSlide.on('beforeChange', function(event, slick, currentSlide, nextSlide) {	
			$("#mainVisual .main-visual-controls .progress-bar .ing-bar").removeClass("active");
			$(this).find(".slick-dots").find("li").eq(nextSlide).addClass("active-item"); 
			$visualControls.find('.paging-controls .cur').text(nextSlide + 1);
		})
        $visualSlide.on('afterChange', function(event, slick, currentSlide, nextSlide) {
            $("#mainVisual .main-visual-controls .progress-bar .ing-bar").addClass("active");
        })

        $visualSlide.slick({
            slidesToShow:1,
            autoplay:true,
            infinity:true,
            speed:1000,
            autoplaySpeed:5500,
            dots: true,
            arrows: true,
            fade:true,
            responsive: [
                {
                    breakpoint: 1240,
                    settings: {
                        arrows: false,
                    }
                },
            ]
        })
    })


    /* MAIN PRODUCT SLIDE : NOT OUTPUT 
    $(".main-product-list").each(function  () {
        var $productSlide = $(this);

        $productSlide.slick({
            slidesToShow:1,
            infinity:true,
            speed:1000,
            dots: false,
            arrows: true, 
            responsive: [
                {
                    breakpoint: 1240,
                    settings: {
                        slidesToShow:1,
                        dots: true,
                        arrows: false,
                    }
                },
                {
                    breakpoint: 650,
                    settings: {
                        slidesToShow:1,
                        dots: true,
                        arrows: false,
                    }
                }
            ]
        })
    })
    */


    /*main company 스크롤 이미지박스 */
    const box = document.querySelector('.main-comp-imgbox');
    const minSize = 40; // 최소 가로 길이
    const maxSize = 90; // 최대 가로 길이
    const initialHeight = box.clientHeight; // 초기 세로 길이

    window.addEventListener('scroll', () => {
        const scrollPercentage = (window.scrollY / (document.body.scrollHeight - window.innerHeight)) * 100;
        let newWidth;

        if (scrollPercentage <= 30) {
            newWidth = minSize + (scrollPercentage / 30) * (maxSize - minSize);
        } else {
            newWidth = maxSize;
        }

        box.style.width = newWidth + '%';
    });

});