style24.front/src/main/webapp/ux/mo/js/common_m.js

/* * * * * * * * * * * * * * * * * * * * * * * 

1. Init    (초기설정)

* * * * * * * * * * * * * * * * * * * * * */
window.addEventListener('load', function(){
    setTimeout(scrollTo, 0, 0, 1);
  }, false);
  

$(document).ready(function() {

        // 웹페이지가 브라우징된 후 주소창 제거
        window.addEventListener("load", function () {
            setTimeout(scrollTo, 0, 0, 1);
        }, false);



        //210608_히스토리백 스크립트
        $(".btn_back").on("click", function () {
            history.back();
        });

        //1.쿠키세팅
        function setCookie(cookieName, value, exdays){
            var exdate = new Date();
            exdate.setDate(exdate.getDate() + exdays);
            var cookieValue = escape(value) + ((exdays==null) ? "" : "; expires=" + exdate.toGMTString());
            document.cookie = cookieName + "=" + cookieValue;
        }
        
        function deleteCookie(cookieName){
            var expireDate = new Date();
            expireDate.setDate(expireDate.getDate() - 1);
            document.cookie = cookieName + "= " + "; expires=" + expireDate.toGMTString();
        }
        
        function getCookie(cookieName) {
            cookieName = cookieName + '=';
            var cookieData = document.cookie;
            var start = cookieData.indexOf(cookieName);
            var cookieValue = '';
            if(start != -1){
                start += cookieName.length;
                var end = cookieData.indexOf(';', start);
                if(end == -1)end = cookieData.length;
                cookieValue = cookieData.substring(start, end);
            }
            return unescape(cookieValue);
        }

        //2. 쿠키설정
        var category = getCookie("category"); //setCookie("category")로 세팅한 category 변수 명
        var scrollPoint = getCookie("scrollPoint"); //setCookie("scrollPoint")로 세팅한 스크롤 위치
        var currentCategory = "mainScrollPoint"; //이벤트 발생 후 새로 로드된 현재 페이지의 카테고리 지정

        //3.스크롤 값 가져오기
        $('a').on("click", function(){
                //스크롤 위치 저장 - a태그 href에 'html' 문자열이 있는 경우
                //if($(this).hasAttribute('class') === true){
                //    console.log("bvb");
                //}
                if($(this).attr('href').indexOf('html') !== -1){
                    var scrollPoint = (document.documentElement && document.documentElement.scrollTop) || document.body.scrollTop;
                    setCookie("category", "mainScrollPoint"); // 쿠키에서 사용할 category에 사용자 정의 카테고리명 세팅
                    setCookie("scrollPoint", scrollPoint); // 쿠키에 스크롤 위치 세팅
               }
        });

        //4. 뒤로가기 시 이전페이지 스크롤 이동
        window.onpageshow = function(event) {
            if ( event.persisted || (window.performance && window.performance.navigation.type == 2)) {
            // Back Forward Cache로 브라우저가 로딩될 경우 혹은 브라우저 뒤로가기 했을 경우
                if (category != "" && category != 'undefined' 
                    && category == currentCategory && scrollPoint != "" && scrollPoint != 'undefined') {
                    $('html').animate({scrollTop : scrollPoint}, 400);
                }
             setCookie("category", "");
             setCookie("scrollPoint", "");
            }
        };



        // goTop, header (스크롤 인식)
        $(".btn_top").click(function () {
            $("html, body").animate({
                "scrollTop": 0
            }, 50);
        });

        $(window).scroll(function (event) {

            // header height 가 아닌, 스크롤 감지로 변경할 것
            //if ($(window).scrollTop() > $("header").height()) {
            //    $(".tabbar").removeClass('fixed');
            //} else {
            //    $(".tabbar").addClass('fixed');
            //}

            if ($(window).scrollTop() > $("header").height()) {
                $(".btn_top").animate({
                    "opacity": 1
                }, 50);
                $("footer .btn_back").animate({
                    "opacity": 1
                }, 50);
                
                // 210521_ 위치고정으로 변경
                // if ( $(window).scrollTop() > ($("footer").position().top - $("footer").height() )) {
                //     $(".btn_top").css("bottom", ($("footer").height() + 20) + "px");
                // } else {
                //     $(".btn_top").css("bottom", "60px");
                // }
            } else {
                $(".btn_top").animate({
                    "opacity": 0
                }, 50);
                $("footer .btn_back").animate({
                    "opacity": 0
                }, 50);
            }

            // 210409_스크롤시 헤더 백그라운드 흰색
            //var st = $(this).scrollTop();
            //if($('header').hasClass("main") !== true){
            //    if (st > lastScrollTop){
            //        $(".app .gnb").css("position", "fixed");
            //        $(".htop").css("background", "#fff");
            //        $(".app .gnb .btn-expand").css("position", "fixed");
            //        $(".tabbar").removeClass("fixed");
            //    } else {
            //        $(".app .gnb").css("position", "fixed");
            //        $(".htop").css("background", "#fff");
            //        $(".app .gnb .btn-expand").css("position", "fixed");
            //        $(".tabbar").addClass("fixed");
            //        setTimeout(function(){
            //            if($(window).scrollTop() === 0){
            //                $(".app .gnb").css("position", "relative");
            //                $(".app .gnb .btn-expand").css("position", "absolute");
            //            }
            //        },300)
            //    }
            //    if(st < 10) {
            //        $(".htop").css("background", "transparent");
            //    }
            //    lastScrollTop = st;
            //}
            

            //var posiGap = $(window).scrollTop();
            //console.log(posiGap);

        });

        // items like on/off
       
        $(document).on('click','.itemLike',function(){
            $(this).toggleClass("likeit");
        });

});


/* * * * * * * * * * * * * * * * * * * * * * * 

2. Utility (유틸리티)

* * * * * * * * * * * * * * * * * * * * * */




    // FORM
    // input-File-Add
    $(document).ready(function() {
        if (window.File && window.FileList && window.FileReader) {
            $("#fileAdd").on("change", function(e) {
                var files = e.target.files,
                    filesLength = files.length;
                    console.log(filesLength);
                var cmtLa = $('.form_field .imgUpload label');
                var cmtIn = $('.form_field .imgUpload input');
                var myrvLa = $('.form_field .imgUpload label');
                var myrvIn = $('.form_field .imgUpload input');

                for (var i = 0; i < filesLength; i++) {
                    var f = files[i]
                    var fileReader = new FileReader();
                    fileReader.onload = (function(e) {
                        var file = e.target;
                        console.log(file);
                        $("<span class=\"pics\">" +
                            "<img class=\"picsThumbs\" src=\"" + e.target.result + "\" title=\"" + file.name + "\"/>" +
                            "<br/><span class=\"removes\">Removes image</span>" +
                            "</span>").insertBefore(".fileAdd");
                        $(".removes").click(function(){
                            $(this).parent(".pics").closest(".imgUpload").children("input").val("");
                            $(this).parent(".pics").remove();
                            cmtLa.css('display', 'block');
                            cmtIn.css('display', 'block');
                            myrvLa.css('display', 'block');
                            myrvIn.css('display', 'block');
                            $('#fileAdd').removeAttr("disabled");
                        });
                    });
                fileReader.readAsDataURL(f);
                    var maxFileLength = 10; /* 최대 파일 갯수를 입력해 주세요 */
                    var imgFiles=$('.imgUpload .pics');

                    if (imgFiles.length >= maxFileLength-1) {
                        //mcxDialog.alert('이미지는 최대' + maxFileLength +'장 까지 첨부 가능합니다.'); //210507_삭제
                        $('#fileAdd').attr("disabled",true);
                        cmtLa.css('display', 'none');
                        cmtIn.css('display', 'none');
                        myrvLa.css('display', 'none');
                        myrvIn.css('display', 'none');
                    } else if(imgFiles.length < maxFileLength){
                        $('#fileAdd').removeAttr("disabled");
                    }
                }
            });
        } else {
            alert("브라우저가 File API를 지원하지 않습니다.")
        }
    });

    //210514_ 수정 : 파일첨부가 최대 2개일 경우 스크립트 수정.
    // input-File-Adds
    $(document).ready(function() {
        if (window.File && window.FileList && window.FileReader) {
            $("#fileAdds").on("change", function(e) {
                var files = e.target.files,
                    filesLength = files.length;
                var cmtLa = $('.form_field .imgUpload label');
                for (var i = 0; i < filesLength; i++) {
                    var f = files[i]
                    var fileReader = new FileReader();
                    fileReader.onload = (function(e) {
                        var file = e.target;
                        $("<span class=\"pics\">" +
                            "<img class=\"picsThumbs\" src=\"" + e.target.result + "\" title=\"" + file.name + "\"/>" +
                            "<br/><span class=\"removes\">Removes image</span>" +
                            "</span>").insertBefore(".fileAdd");
                        $(".removes").click(function(){
                            cmtLa.css('display', 'block');
                            $(this).parent(".pics").closest(".imgUpload").children("input").val("");
                            $(this).parent(".pics").remove();
                            $('#fileAdds').removeAttr("disabled");
                        });
                    });
                fileReader.readAsDataURL(f);
                    var maxFileLength = 2; /* 최대 파일 갯수를 입력해 주세요 */
                        var imgFiles=$('.imgUpload .pics');
                        
                        if (imgFiles.length >= maxFileLength-1) {
                            //mcxDialog.alert('이미지는 최대' + maxFileLength +'장 까지 첨부 가능합니다.'); //210507_삭제
                            $('#fileAdds').attr("disabled",true);
                            cmtLa.css('display', 'none');
                        } else if(imgFiles.length < maxFileLength){
                            $('#fileAdds').removeAttr("disabled");
                        }
                    }
            });
        } else {
            alert("브라우저가 File API를 지원하지 않습니다.")
        }
    });

    // check-All
    $( document ).ready(function() {
        var $chkAll = $('.check-all');
            $chkAll.change(function () {
                var checked = $(this).prop('checked'); 
                $('input[name="dd"]').prop('checked', checked);
            });
            
        var ddChk = $('input[name="dd"]');
            ddChk.change(function () {
                var ddChkLength = ddChk.length;
                var checkedLength = $('input[name="dd"]:checked').length;
                var selectAll = (ddChkLength == checkedLength);
                $chkAll.prop('checked', selectAll);
            });
    });

// Select-Combo-Custom
function sCombo(selector){
	this.$selectBox = null,
	this.$select = null,
	this.$list = null,
	this.$listLi = null;
	sCombo.prototype.init = function(selector){
		this.$selectBox = $(selector);
		this.$select = this.$selectBox.find('.combo .select');
		this.$list = this.$selectBox.find('.combo .list');
		this.$listLi = this.$list.children('li');
	}
	sCombo.prototype.initEvent = function(e){
		var that = this;
		this.$select.on('click', function(e){
			that.listOn();
		});
		this.$listLi.on('click', function(e){
			that.listSelect($(this));
		});
		$(document).on('click', function(e){
			that.listOff($(e.target));
		});
	}
	sCombo.prototype.listOn = function(){
		this.$selectBox.toggleClass('on');
		if(this.$selectBox.hasClass('on')){
			this.$list.css('display', 'block');
		}else{
			this.$list.css('display', 'none');
		};
	}
	sCombo.prototype.listSelect = function($target){
		$target.addClass('selected').siblings('li').removeClass('selected');
		this.$selectBox.removeClass('on');
		//this.$select.text($target.text());
		this.$select.html($target.html());
		this.$list.css('display', 'none');
	}
	sCombo.prototype.listOff = function($target){
		if(!$target.is(this.$select) && this.$selectBox.hasClass('on')){
			this.$selectBox.removeClass('on');
			this.$list.css('display', 'none');
		};
	}
	this.init(selector);
	this.initEvent();
};



// selectBrand on/off
$( document ).ready( function() {
	$("#selectBrand .brandbox input").on("click", function() {
		$("#selectBrand .brandbox input").removeClass("on");
		$(this).addClass("on");
	});
});




/* alert */
        $(function(){
            $('.alertCls').click(function(){
                setTimeout(function(){
                    $('.alert').css('animation', 'none');
                        $('.alert').css('display', 'none');
                        $('.once').css('display', 'none');
                    }, 300);
                // uifn_currCallback();
            });
        });




/* * * * * * * * * * * * * * * * * * * * * * * 

2. Page Setting    (페이지세팅)

* * * * * * * * * * * * * * * * * * * * * */
$(document).ready(function () {
        //210525_마우스 휠을 스크롤 이벤트로 변경 및 3가지 경우의 수 헤더 정리
        var lastScrollTop = 0;
        $(window).scroll(function (event) {
            //경우1 : only htopMain
            if($('section').is('#htopMain') === true && $('div').is('#gnb') === false){
                console.log("vvvv");
                var commonSt = $(this).scrollTop();
                //스크롤 올릴때
                if (commonSt > lastScrollTop) {
                    $("header").css('display', 'none');
                    $("header").css('position', 'fixed');
                    $(".tabbar").removeClass("fixed");
                //스크롤 내릴때
                } else {
                    $("header").css('display', 'block');
                    $("header").css('position', 'fixed');
                    $(".tabbar").addClass("fixed");
                }
                lastScrollTop = commonSt;
            //경우2 : htopMian + gnb
            } else if($('section').is('#htopMain') === true && $('div').is('#gnb') === true) {
                console.log("bvbb");
                var commonSt = $(this).scrollTop();
                //스크롤 올릴때
                if (commonSt > lastScrollTop) {
                    $("header").css('display', 'none');
                    $("header").css('position', 'fixed');
                    $("#gnb").css('display', 'block');
                    $("#gnb").css('position', 'fixed');
                    $("#gnb").css('top', '0');
                    $(".tabbar").removeClass("fixed");
                    $("section.content, section.main, .bnrtype_banner").addClass('scr');
                //스크롤 내릴때
                } else {
                    $("header").css('display', 'block');
                    $("header").css('position', 'fixed');
                    $("#gnb").css('display', 'block');
                    $("#gnb").css('position', 'fixed');
                    $("#gnb").css('top', '55px');
                    $(".tabbar").addClass("fixed");
                    $("section.content, section.main, .bnrtype_banner").removeClass('scr');
                }
                if(commonSt < 170){
                    $("header").css('display', 'block');
                    $("header").css('position', 'fixed');
                    $("#gnb").css('display', 'block');
                    $("#gnb").css('position', 'fixed');
                    $("#gnb").css('top', '55px');
                    $(".tabbar").addClass("fixed");
                    $("section.content, section.main, .bnrtype_banner").removeClass('scr');
                }
                lastScrollTop = commonSt;
            //경우3 : only htopSub
            } else {
                var commonSt = $(this).scrollTop();
                $("header").css('display', 'block');
                $("header").css('position', 'fixed');
                //스크롤 올릴때
                if (commonSt > lastScrollTop) {
                    $(".tabbar").removeClass("fixed");
                //스크롤 내릴때
                } else {
                    $(".tabbar").addClass("fixed");
                }
                if(commonSt < 10){
                    $(".tabbar").addClass("fixed");
                }
                lastScrollTop = commonSt;
            }
        })
        //210525_초기화 시 top:0 이동
        window.onload = function() {
            setTimeout (function () {
                scrollTo(0,0);
            },1);
        }

        // GNB
        $(".btn_gnb").on("click", function () {
            $(this).toggleClass("on");
            $(".hmenu").toggleClass("on");
            $("body").toggleClass("gnb_on");
        });
        // GNB
        $(".btn_gnbs").on("click", function () {
            $(this).toggleClass("on");
            $(".hmenus").toggleClass("on");
            $("body").toggleClass("gnb_on");
        });

        $(".gnb .d1 > .folder > a").on("click", function () {
            var d2_H = $(this).siblings(".d2").children("li").length * 39;

            if ( $(this).parent().hasClass("on") ) {
                
                $(this).siblings(".d2").animate({
                    "height": 0, "padding-top": 0, "padding-bottom": 0
                }, 500 , function() {
                    $(this).siblings(".d2").hide();
                    $(this).parent().removeClass("on");
                });
            } else {
                $(this).parent().addClass("on");
                $(this).siblings(".d2").show().animate({
                    "height": d2_H+"px", "padding-top": "20px", "padding-bottom": "20px"
                }, 500);
            }
        });
        $(".gnb .d2 > .folder > a").on("click", function () {
            var d3_H = $(this).siblings(".d3").children("li").length * 36;

            if ( $(this).parent().hasClass("on") ) {
                $(this).siblings(".d3").animate({
                    "height": 0, "padding-bottom": 0
                }, 500 , function() {
                    $(this).siblings(".d3").hide();
                    $(this).parent().removeClass("on");
                });
            } else {
                $(this).parent().addClass("on");
                $(this).siblings(".d3").show().animate({
                    "height": d3_H+"px", "padding-bottom": "10px"
                }, 500);
                $(this).parent().parent(".d2").css({"height":"auto"})
            }
        });

        // CNB (Media)
        $(".cnb .btn_cnb").on("click", function () {
            var cate_H = $(this).siblings("ul").height()+70;

            if ( $(this).parent(".cnb").hasClass("on") ) {
                $(this).parent(".cnb").animate({
                    "height": "50px"
                }, 500);
                $(this).parent().removeClass("on");
            } else {
                $(this).parent().addClass("on");
                $(this).parent(".cnb").animate({
                    "height": cate_H+"px"
                }, 500);
            }
        });

        $(".cnb .list_cate button").on("click", function () {
            if ( $(this).hasClass("btn_all") ) {
                $(".list_cate button").removeClass("on");
                $(this).addClass("on");
            } else {
                $(".list_cate .btn_all").removeClass("on");
                $(this).toggleClass("on");
            }
        });

        // infos
        $(".btn_infos").click(function () {
            $(this).toggleClass("on");
            $(".infos").toggleClass("on");
        });

        // slide main
        var swiper_m1 = new Swiper(".m1 .slide", {
            loop: true,
            autoplay: {
                delay: 3500,
                disableOnInteraction: false,
            },
            pagination: {
                el: ".swiper-pagination-m1",
                clickable: true,
                renderBullet: function (index, className) {
                    return '<i class="' + className + '"> 0' + (index + 1) + '</i>';
                },
            },
            /*
            navigation: {
                nextEl: ".swiper-button-next",
                prevEl: ".swiper-button-prev",
            },
            on: {
                slideChangeTransitionEnd: function() {
                    var slideIndex = this.activeIndex;
                    var slidesLen = this.slides.length - 2;
                    var nextIndex, prevIndex;

                    // console.log(slideIndex, slidesLen);

                    if ( (slideIndex == 1) || (slideIndex == (slidesLen+1)) )  {
                        nextIndex = 2;
                        prevIndex = slidesLen;
                    } else if (slideIndex == slidesLen) {
                        nextIndex = 1;
                        prevIndex = slidesLen-1;
                    } else {
                        nextIndex = slideIndex+1;
                        prevIndex = slideIndex-1;
                    }
                    
                    $(".swiper-button-next").css("background-image", "url('./images/bg_me1_0"+ nextIndex +".jpg')");
                    $(".swiper-button-prev").css("background-image", "url('./images/bg_me1_0"+ prevIndex +".jpg')");
                }
            }
            */
        });

        $(".swiper-button-pause").click(function () {
            swiper_m1.autoplay.stop();
            $(this).hide();
            $(this).siblings(".swiper-button-play").show();
        });
        $(".swiper-button-play").click(function () {
            swiper_m1.autoplay.start();
            $(this).hide();
            $(this).siblings(".swiper-button-pause").show();
        });

        var swiper_m2 = new Swiper(".m2 .slide", {
            loop: false,
            slidesPerView: "auto",
            centeredSlides: true,
            spaceBetween: 20,
        });
        var swiper_m3Nav = new Swiper(".m3 .snb", {
            slidesPerView: 3,
        });
        var swiper_m3 = new Swiper(".m3 .slide", {
            loop: true,
            thumbs: {
                swiper: swiper_m3Nav,
            },
        });
        var swiper_m4 = new Swiper(".m4 .slide", {
            loop: false,
            slidesPerView: "auto",
            centeredSlides: true,
            spaceBetween: 20,
            pagination: {
                el: ".swiper-pagination-m4",
                type: "progressbar",
            },
        });
        // slide sub
        var swiper_lnbNav = new Swiper(".lnb", {
            slidesPerView: "auto",
            spaceBetween: 20,
            autoHeight: true,
            preventClicks: true,
            preventClicksPropagation: false,
            observer: true,
            observeParents: true
        });
        var $lnbItem = $('.lnb .swiper-wrapper .swiper-slide a');
        $lnbItem.click(function(){
            var target = $(this).parent();
            $lnbItem.parent().removeClass('on')
            target.addClass('on');
            muCenter(target);
        })
        function muCenter(target){
            var snbwrap = $('.lnb .swiper-wrapper');
            var targetPos = target.position();
            var box = $('.lnb');
            var boxHarf = box.width()/2;
            var pos;
            var listWidth=0;
            
            snbwrap.find('.swiper-slide').each(function(){ listWidth += $(this).outerWidth(); })
            
            var selectTargetPos = targetPos.left + target.outerWidth()/2;
            if (selectTargetPos <= boxHarf) { // left
                pos = 0;
            }else if ((listWidth - selectTargetPos) <= boxHarf) { //right
                pos = listWidth-box.width();
            }else {
                pos = selectTargetPos - boxHarf;
            }
            
            setTimeout(function(){snbwrap.css({
                "transform": "translate3d("+ (pos*-2) +"px, 0, 0)",
                "transition-duration": "500ms"
            })}, 200);
        }



        var swiper_subTab = new Swiper(".slideWrap", {
            autoHeight: true,
            thumbs: {
                swiper: swiper_lnbNav,
            },
        });

        var swiper_me1 = new Swiper(".me1_pop .slide", {
            loop: false,
            slidesPerView: "auto",
            centeredSlides: true,
            spaceBetween: 20,
            pagination: {
                el: ".swiper-pagination-me1",
                type: "progressbar",
            },
        });

        var swiper_b1 = new Swiper(".b1 .slide", {
            loop: true,
            autoplay: {
                delay: 3500,
                disableOnInteraction: false,
            },
            pagination: {
                el: ".swiper-pagination-b1",
                type: 'fraction',
            },
        });

        $(".swiper-button-pause-b1").click(function () {
            swiper_b1.autoplay.stop();
            $(this).hide();
            $(this).siblings(".swiper-button-play-b1").show();
        });
        $(".swiper-button-play-b1").click(function () {
            swiper_b1.autoplay.start();
            $(this).hide();
            $(this).siblings(".swiper-button-pause-b1").show();
        });

        // toggleBox (윤리경영)
        $(".list_cate > li dl dt > button").on("click", function () {
            var li = $(this).parent().parent().parent("li").index();
            // var liPos = ($(this).parent().parent().parent().parent().position().top) + 110 + ($(this).parent().height() * li);

            if ($(this).parent().parent().parent("li").hasClass("on")) {
                $(this).parent().parent().parent("li").removeClass("on");
                $(this).parent().parent().parent().parent().siblings(".cate").children("li").eq(li).find("button").removeClass("on");
            } else {
                $(this).parent().parent().parent("li").siblings().removeClass("on");
                $(this).parent().parent().parent("li").addClass("on");
                $(this).parent().parent().parent().parent().siblings(".cate").children("li").find("button").removeClass("on");
                $(this).parent().parent().parent().parent().siblings(".cate").children("li").eq(li).find("button").addClass("on");

                // $("html, body").animate({
                //     "scrollTop": liPos
                // }, 300);
            }
        });

        // $(".c5 .cate button").on("click", function () {
        //     var li = $(this).parent("li").index();
        //     var liPos = ($(this).parent().parent().siblings(".list_cate").position().top) + 110 + ($(this).parent().parent().siblings(".list_cate").find("dt").height() * li);
        //     $(this).parent().siblings().find("button").removeClass("on");
        //     $(this).addClass("on");
        //     $(this).parent().parent().siblings(".list_cate").find("li").removeClass("on");
        //     $(this).parent().parent().siblings(".list_cate").children("li").eq(li).addClass("on");
        //     $("html, body").animate({
        //         "scrollTop": liPos
        //     }, 300);
        // });

        // media play
        $(".btn_play").on("click", function(e) {
            e.stopPropagation();
        });

        // =============구매하기팝업========================================================

        // pop open
        function popOpenScroll(){
            $('html, body').css({'overflow': 'hidden', 'height': '100%'}); 
            $('#element').on('scroll touchmove mousewheel', function(event) { // 터치무브, 휠 스크롤 방지
                event.preventDefault();
                event.stopPropagation();
                return false;
            });
        }
        // pop close
        function popClsScroll(){
            $('html, body').css({'overflow': 'auto', 'height': '100%'}); //n 해제
            $('#element').off('scroll touchmove mousewheel'); // 터치무브, 휠 스크롤 가능
            return false;
        }
        
        // popup (media)
        $(".btn_popOpen").on("click", function(e) {
            popOpenScroll();
            $(".popup").fadeIn();
            swiper_me1.update();
            return false;
        });
        $(".popup .btn_popClose").on("click", function(e) {
            popClsScroll();
            $(".popup").fadeOut();
            return false;
        });

        // jk
        $(".btn_popOpen_mov, .btn_popOpen_mov .btn_play").on("click", function(e) {
            $(".me1_popMov").fadeIn();
            return false;
        });
        $(".me1_popMov .btn_popClose").on("click", function(e) {
            $(".me1_popMov").fadeOut();
            return false;
        });


    // bottom pop (개선중)
    //var appCall = document.getElementsByClassName('app'); // 디바이스 app 호출
    //console.log(appCall);

    var appHeight = document.documentElement.clientHeight; // 디바이스의 클라이언트 높이값
    //console.log('★ 디바이스의 클라이언트 높이값 : ' + appHeight); 

    //var bodyCall = document.getElementsByClassName('btPop_body'); // btPop_body 호출
    //console.log(bodyCall); 

    // let mememe = document.querySelector('.btPop'); 
    let headresult = document.querySelector('.btPop_head');
    let result = document.querySelector('.btPop_body');
    // console.log('btPop : '+mememe.offsetHeight);
    //console.log('★ 헤더 높이 : ' + headresult.offsetHeight);
    //console.log('★ 바디 높이 : ' + result.offsetHeight);
    //
    //let calll = result.offsetHeight + result.offsetHeight;
    //console.log('★ 헤더+바디 : ' + calll);

    //let pxtop = appHeight - calll;
    //console.log('★ 디바이스-(헤더+바디) : ' + pxtop);

        // btPop_full
        $('.btPop_full_click').click(function(){
            popOpenScroll();
            $('.container').addClass('btPop_full_open');
            return false;
        });
        
        $('.btPop_full_close').click(function(){
            popClsScroll();
            $('.container').removeClass('btPop_full_open');
            return false;
        });

        // btPopAuto
        $('.btPop_close').click(function(){
            popClsScroll();
            $('.container').removeClass('btPop_open');
            autome.style.top  = 100 + "%";
            return false;
        });

         // 쇼핑백팝업
         $("#btn_shoppingBag_pop").click(function() {
            popClsScroll();
            $('.container').removeClass('btPop_open');
            autome.style.top  = 100 + "%";
            $("html, body").animate({"scrollTop": 0}, 0);
            $("#shoppingBagModal").fadeIn();
            setTimeout(function(){
                $("#shoppingBagModal").fadeOut(500);
            },2000);
            return false;
        });

        // btPopAuto
        //$('.btPopClose').click(function(){
        //    popClsScroll2();
        //    $('.container').removeClass('btPop_open');
        //    autome.style.top  = 100 + "%";
        //    return false;
        //});

        let autome = document.querySelector('.btPopAuto'); 
        //let headsize = this.querySelector('.btPopAuto .btPopAuto_head');
        //let bodysize = this.querySelector('.btPopAuto .btPopAuto_body');
        //console.log('★ btPop_auto헤더 높이 : ' + headsize.offsetHeight);
        //console.log('★ btPop_auto바디 높이 : ' + bodysize.clientHeight);

        //let autotop = appHeight - (headsize.offsetHeight + bodysize.offsetHeight);
        //console.log('★ btPopAuto전체 높이 - 컨텐츠 높이 : ' + autotop);
        //console.log('★ btPopAuto전체 높이 - 컨텐츠 높이 /10 : ' + autotop /10);

        $('.btPop_auto').click(function(){
            popOpenScroll();
            $('.container').addClass('btPop_open');
            // autome.style.top  = autotop /10 + "vh";
            // 210524 _ 임시 제거
            // if (autotop > 251) {
            //     autome.style.top = 25.0 + "vh";
            // }else{
            //     autome.style.top  = pxtop/10 + "vh";
            // }
            return false;
        });

        // 210405_사이즈 선택시 구매하기 팝업 추가
        $('.opt_size .form_field div input').click(function(){
            popOpenScroll();
            //$('.btPop_body .lap span').css('color', 'red')
            //console.log($(this)[0]);
            console.log();
            $('.container').addClass('btPop_open');
            // autome.style.top  = autotop /10 + "vh";
            //if (autotop > 251) {
            //    autome.style.top = 25.0 + "vh";
            //}else{
            //    autome.style.top  = pxtop/10 + "vh";
            //}
            return false;
        });

});
        


/* ================================================== JS branch JS ========================================================*/
$( document ).ready( function() {

    /* 주문결제_Header Style */
    // var odPage = document.getElementsByClassName('od');
    if($('main').children("section").hasClass("shopping_bag")){
        $('.htop .home').css({"display": "inline-block"});
        $('.htop .search').css({"display": "none"});
        $('.htop .store').css({"display": "none"});
    }else if($('main').children("section").hasClass("od_gift")){
        $('.htop .home').css({"display": "none"});
        $('.htop .search').css({"display": "inline-block"});
        $('.htop .store').css({"display": "inline-block"});
    }else if($('main').children("section").hasClass("od_extra")){ //추가결제(특수결제)
        $('.htop .home').css({"display": "none"});
        $('.htop .search').css({"display": "none"});
        $('.htop .store').css({"display": "none"});
    }else if($('main').children("section").hasClass("odPayment")){ //회원,비회원주문
        $('.htop .home').css({"display": "none"});
        $('.htop .search').css({"display": "none"});
        $('.htop .store').css({"display": "none"});
    }else if($('main').children("section").hasClass("nonMBorder")){ //비회원주문-로그인
        $('.htop .home').css({"display": "none"});
        $('.htop .search').css({"display": "none"});
        $('.htop .store').css({"display": "none"});
    };

    /* 상품상세_Header Style */
    let pdPage = document.getElementsByClassName('pd');
    if($(pdPage).children("section").hasClass("pd_detail")){
        $('.htop').css({"background": "transparent","position":"absolute","width":"100%"});
        $('.htop h1').css({"border-bottom": "none"});
        $('.htop h1').css({"display": "none"});
        $('.htop .home').css({"display": "inline-block"});
    };

    
    /* 마이페이지_Header Style */
    let container = document.getElementsByClassName('container');
    if($(container).hasClass('my')){
        $('.htop').css({"border-bottom": "1px solid rgba(0, 0, 0, 0.1)"});
    };    
    /* 마이페이지_비회원_Header Style */
    let myPage = document.getElementsByClassName('my');
    if($(myPage).children("nav").hasClass("pnb")){
        $('.htop .home').css({"display": "none"});
        $('.htop .search').css({"display": "none"});
        $('.htop .store').css({"display": "none"});
    };

    /* 검색_Header Style */
    let schPage = document.getElementsByClassName('sch');
    if($(schPage).children("section").hasClass("sch_result")){
        $('.htop h1').css({"display": "none"});
        $('.htop .search').css({"display": "none"});
    };  
        /* 210428_수정 : 아코디언 */
        $(document).on('click','.cs .foldGroup .fold_head, .my .foldGroup .fold_head',function(e){
            $(this).toggleClass('on');
            $(this).siblings('.fold_cont').slideToggle(100);
            $(this).parents('li').siblings('li').find('.fold_head').removeClass('on');
            $(this).parents('li').siblings('li').find('.fold_cont').slideUp(100);
        });
        /* //210428_수정 : 아코디언 */

        /* 주문결제_accordion */
        /* 210428_수정 : 아코디언 */
        $(document).on('click','.od .foldGroup .fold_head .fold_tit',function(e){	
            $(this).parents('.foldGroup li').find('.fold_cont').slideToggle(100);
            $(this).parents('.fold_head').toggleClass('on');

            $(this).parents('.inner').siblings('.inner').find('.fold_head').removeClass('on');
            $(this).parents('.inner').siblings('.inner').find('.fold_cont').slideUp(100);

            // 210617_ 추가 : 선택 된 폴드그룹 포커스 이동
            if($('.od .foldGroup .fold_head').hasClass('on') === true){
                var odoffset = $('.od .foldGroup .fold_head').offset();
                $('html').animate({scrollTop : odoffset.top - 40}, 400);
            }
            return false;
        });
        /* 210428_수정 : 아코디언 */

        /* 상품문의_accordion */
        $(document).on('click','.pd_qnalist .foldGroup .fold_head',function(e){	
            if($(this).parent().hasClass('secret_qna')){
                mcxDialog.alert("비밀글은 열람하실 수 없습니다.", {
                    sureBtnText: "확인",
                });
            } else {
                $('.fold_head').removeClass('on');
                $('.fold_cont').slideUp(100);
                if(!$(this).parents('.foldGroup li').find('.fold_cont').is(":visible")){
                    $(this).parents('.foldGroup li').find('.fold_cont').slideDown(100);
                    $(this).parents('.fold_head').toggleClass('on');
                }
            }
            return false;
        });

       

        //210510_삭제
        // $(document).on('click','.popup_box .button_list button',function(){
        //     $(this).parents('.popup_box').hide().removeClass('active');
        //     $("body").css({"overflow":"visible"});
        // })

        //$(window).on('scroll',function(e){
        //    var wheel = e.originalEvent.wheelDelta;
        //    if(wheel>0){
        //    $("header").css('display', 'block');
        //    $("header").css('position', 'fixed');
        //    } else {
        //    $("header").css('display', 'none');
        //    $("header").css('position', 'fixed');
        //    }
        //});

        //210604_하단 고정버튼 있을 시 tabbar 제거
        if($('div').hasClass('product_floormenu') || $('div').hasClass('cs_contactUs_my_footer') || $('div').hasClass('od_calc_wrap')){
            $('.tabbar').css('display', 'none');
        }
          
});