@charset "utf-8";
/* CSS Document */

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

[Table of Contents]

1. 1600px
2. 1440px
3. 1280px
4. 1199px
5. 1024px
6. 991px
7. 959px
8. 880px
9. 768px
10. 767px
11. 539px
12. 479px
13. 400px

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


@media only screen and (max-width: 1600px)
{

}

/************
2. 1440px
************/

@media only screen and (max-width: 1540px)
{
	
}

/************
3. 1380px 테블릿 가로 
************/

@media only screen and (max-width: 1380px)
{
    .menu1 {
        margin-left:150px;
    }
    .menu2 {
        margin-left:0px;
    }
    .menu3 {
        margin-left:470px;
    }
    .menu4 {
        margin-left:680px;
    }
    .menu5 {
        margin-left:890px;
    }
    .menu6 {
        margin-left:780px;
    }
    .menu6 li { 
        margin-right:0px;
        margin-left:50px;
    }
    #sub_mnu_t ul li.w12 {
        width: 20%;
        font-size:12pt;
    }
	/* 매인 좌표 **********************************/
    .num-web{
        display: none;
    }

    .num-pad{
        display: block;
    }
    .path-web{
        display: none;
    }

    .path-pad{
        display: block;
    }
    .map {
        width:30px;
        height:30px;
        /* background-color: #7f7f7f; */
    }
    .num1 {
        margin-left:1099px;
        margin-top: -135px;
    }
    
    .num2 {
        margin-left:1113px;
        margin-top: 4px;
    }
    
    .num3 {
        margin-left:1013px;
        margin-top: 143px;
    }
    
    .num4 {
        margin-left:842px;
        margin-top: 62px;
    }
    
    .num5 {
        margin-left:939px;
        margin-top: -102px;
    }
    
    .num6 {
        margin-left:1062px;
        margin-top: 0px;
    }
    
    .num7 {
        margin-left:789px;
        margin-top: 204px;
    }
    
    .num8 {
        margin-left:1084px;
        margin-top: 291px;
    }
    
    .num9 {
        margin-left:575px;
        margin-top: -198px;
    }
    
    .num10 {
        margin-left:454px;
        margin-top: -207px;
    }
    
    .num11 {
        margin-left:678px;
        margin-top: 87px;
    }
    
    .num12 {
        margin-left:497px;
        margin-top: 198px;
    }
    
    .num13 {
        margin-left:342px;
        margin-top: 96px;
    }
    
    .num14 {
        margin-left:996px;
        margin-top: -23px;
    }
    
    .num15 {
        margin-left:955px;
        margin-top: -73px;
    }
    
    .num16 {
        margin-left:738px;
        margin-top: -112px;
    }
    
    .num17 {
        margin-left:894px;
        margin-top: -135px;
    }
    
    .num18 {
        margin-left:933px;
        margin-top: -275px;
    }
    
    .num19 {
        margin-left:661px;
        margin-top: -25px;
    }
    
    .num20 {
        margin-left:880px;
        margin-top: 302px;
    }
    .path1{
        display: none;
        margin-left:1012px;
        margin-top: -186.5px;
    }
    
    .path2{
        display: none;
        margin-left:1078px;
        margin-top: -78.5px;
    }
    
    .path3{
        display: none;
        margin-left:902px;
        margin-top: 86.5px;
    }
    
    .path4{
        display: none;
        margin-left:749px;
        margin-top: 8.5px;
    }
    
    .path5{
        display: none;
        margin-left:781px;
        margin-top: -122.5px;
    }
    
    .path6{
        display: none;
        margin-left:1026px;
        margin-top: -87.5px;
    }
    
    .path7{
        display: none;
        margin-left:755px;
        margin-top: 185.5px;
    }
    
    .path8{
        display: none;
        margin-left:924px;
        margin-top: 201.5px;
    }
    
    .path9{
        display: none;
        margin-left:552px;
        margin-top: -254.5px;
    }
    
    .path10{
        display: none;
        margin-left:451px;
        margin-top: -235.5px;
    }
    
    .path11{
        display: none;
        margin-left:597px;
        margin-top: 22.5px;
    }
    
    .path12{
        display: none;
        margin-left:462px;
        margin-top: 133.5px;
    }
    
    .path13{
        display: none;
        margin-left:306px;
        margin-top: 44.5px;
    }
    
    .path14{
        display: none;
        margin-left:972px;
        margin-top: -127.5px;
    }
    
    .path15{
        display: none;
        margin-left:915px;
        margin-top: -89.5px;
    }
    
    .path16{
        display: none;
        margin-left:725px;
        margin-top: -225.5px;
    }
    
    .path17{
        display: none;
        margin-left:801px;
        margin-top: -190.5px;
    }
    
    .path18{
        display: none;
        margin-left:874px;
        margin-top: -282.5px;
    }
    
    .path19{
        display: none;
        margin-left:615px;
        margin-top: -157.5px;
    }
    
    .path20{
        display: none;
        margin-left:802px;
        margin-top: 263.5px;
    }
    .mapPopup1 {
        margin-left:1135px;
        margin-top: -266px;
        width : 240px;
    }
    
    .mapPopup2 {
        margin-left:830px;
        margin-top: -36px;
        width : 250px;
    }
    
    .mapPopup3 {
        margin-left:780px;
        margin-top: 199px;
        width : 250px;
    }
    
    .mapPopup4 {
        margin-left:875px;
        margin-top: -73px;
        width : 250px;
    }
    
    .mapPopup5 {
        margin-left:824px;
        margin-top: -241px;
        width : 290px;
    }
    
    .mapPopup6 {
        margin-left:1140px;
        margin-top: -86px;
        width : 250px;
    }
    
    .mapPopup7 {
        margin-left:530px;
        margin-top: 64px;
        width : 290px;
    }
    
    .mapPopup8 {
        margin-left:850px;
        margin-top: 154px;
        width : 260px;
    }
    
    .mapPopup9 {
        margin-left:298px;
        margin-top: -184px;
        width : 260px;
    }
    
    .mapPopup10 {
        margin-left:180px;
        margin-top: -189px;
        width : 250px;
    }
    
    .mapPopup11 {
        margin-left:405px;
        margin-top: 104px;
        width : 250px;
    }
    
    .mapPopup12 {
        margin-left:205px;
        margin-top: 209px;
        width : 270px;
    }
    
    .mapPopup13 {
        margin-left:55px;
        margin-top: 114px;
        width : 270px;
    }
    
    .mapPopup14 {
        margin-left:1080px;
        margin-top: -59px;
        width : 250px;
    }
    
    .mapPopup15 {
        margin-left:990px;
        margin-top: -216px;
        width : 230px;
    }
    
    .mapPopup16 {
        margin-left:425px;
        margin-top: -206px;
        width : 290px;
    }
    
    .mapPopup17 {
        margin-left:598px;
        margin-top: -226px;
        width : 270px;
    }
    
    .mapPopup18 {
        margin-left:1020px;
        margin-top: -366px;
        width : 290px;
    }
    
    .mapPopup19 {
        margin-left:375px;
        margin-top: -6px;
        width : 260px;
    }
    
    .mapPopup20 {
        margin-left:910px;
        margin-top: 154px;
        width : 270px;
    }
    /* 매인 좌표 **********************************/
}

/************
3. 1280px
************/

@media only screen and (max-width: 1280px)
{
    .top_nav
	{
		display: none;
	}
	.navbar_menu
	{
		display: none;
	}
	.hamburger_container
	{
		display: block;
	}

    #sub_mnu_t ul li.w12 {
        width: 25%;
        font-size:12pt;
    }
}


@media (min-width: 1200px) {
    .container {
        max-width:1400px
    }
}

/************
4. 1199px
************/

@media only screen and (max-width: 1199px)
{
	.main_slider
	{
		min-height: 475px;
		height: calc(100vw / 1.714);
	}
	.main_slider_content
	{
		width: 80%;
        margin-top:-250px;

	}
    .main_slider_content h1 {
        font-size: 30pt;
    }
    .main_slider_content h5 {
        text-align: left;
        padding-top: 10px;
        font-size: 16pt;
        font-weight: 500;
    }
    .main_point_img {
        margin-top: 115px;
    }
    .menu_item
	{
		border-bottom-color: rgba(181, 174, 196, 0.5);
	}
	.menu_item > a
	{
		font-size: 18px;
        font-weight:900;
		line-height: 50px;
		height: 50px;
	}
	.menu_selection li a
	{
		font-size: 15px;
		line-height: 40px;
		height: 40px;
	}

    .hamburger_menu_content {
        padding-left: 15px;
        padding-top: 70px;
        overflow: auto;
    }
	.banner_item
	{
		height: 220px;
	}
	.product-item
	{
		height: 360px;
	}
	.product
	{
		height: 320px;
	}
	.timer li
	{
		width: 90px;
		height: 90px;
	}
	.timer_num
	{
		font-size: 36px;
		font-weight: 500;
	}
	.timer_unit
	{
		margin-top: 5px;
	}
	.blog_title
	{
		font-size: 20px;
	}
    /* 메인 화면 맵 좌표 수정 ******************************************/
    .map {
        position: absolute;
        width:20px;
        height:20px;
        /* background-color: #7f7f7f; */

    }
    .num-web{
        display: none;
    }

    .num-pad{
        display: block;
    }

    .num1 {
        margin-left:767px;
        margin-top: -94px;
    }
    
    .num2 {
        margin-left:778px;
        margin-top: 4px;
    }
    
    .num3 {
        margin-left:707px;
        margin-top: 100px;
    }
    
    .num4 {
        margin-left:587px;
        margin-top: 44px;
    }
    
    .num5 {
        margin-left:655px;
        margin-top: -71px;
    }
    
    .num6 {
        margin-left:741px;
        margin-top: 0px;
    }
    
    .num7 {
        margin-left:550px;
        margin-top: 144px;
    }
    
    .num8 {
        margin-left:757px;
        margin-top: 205px;
    }
    
    .num9 {
        margin-left:399px;
        margin-top: -138px;
    }
    
    .num10 {
        margin-left:315px;
        margin-top: -144px;
    }
    
    .num11 {
        margin-left:471px;
        margin-top: 62px;
    }
    
    .num12 {
        margin-left:344px;
        margin-top: 140px;
    }
    
    .num13 {
        margin-left:235px;
        margin-top: 69px;
    }
    
    .num14 {
        margin-left:698px;
        margin-top: -15px;
    }
    
    .num15 {
        margin-left:667px;
        margin-top: -50px;
    }
    
    .num16 {
        margin-left:514px;
        margin-top: -78px;
    }
    
    .num17 {
        margin-left:623px;
        margin-top: -94px;
    }
    
    .num18 {
        margin-left:651px;
        margin-top: -193px;
    }
    
    .num19 {
        margin-left:461px;
        margin-top: -17px;
    }
    
    .num20 {
        margin-left:614px;
        margin-top: 214px;
    }
    
    /* Path */

    .path-web{
        display: none;
    }

    .path-pad{
        display: block;
    }
    
    .path1{
        display: none;
        margin-left:708px;
        margin-top: -129.5px;
    }

    .path1 img{width:108px;}
    
    .path2{
        display: none;
        margin-left:753px;
        margin-top: -56.5px;
    }

    .path2 img{height:211px;}
    
    .path3{
        display: none;
        margin-left:629px;
        margin-top: 60.5px;
    }

    .path3 img{width:138px;}
    
    .path4{
        display: none;
        margin-left:522px;
        margin-top: 6.5px;
    }

    .path4 img{height:110px;}
    
    .path5{
        display: none;
        margin-left: 545px;
        margin-top: -85.5px;
    }

    .path5 img{width:270px;}
    
    .path6{
        display: none;
        margin-left: 716px;
        margin-top: -62.5px;
    }

    .path6 img{height:159px;}
    
    .path7{
        display: none;
        margin-left: 527px;
        margin-top: 130.5px;
    }

    .path7 img{width:130px;}
    
    .path8{
        display: none;
        margin-left: 644px;
        margin-top: 141.5px;
    }

    .path8 img{width:228px;}
    
    .path9{
        display: none;
        margin-left: 383px;
        margin-top: -178.5px;
    }

    .path9 img{width:109px;}
    
    .path10{
        display: none;
        margin-left: 313px;
        margin-top: -165.5px;
    }

    .path10 img{width:71px;}
    
    .path11{
        display: none;
        margin-left: 415px;
        margin-top: 15.5px;
    }

    .path11 img{width:153px;}
    
    .path12{
        display: none;
        margin-left:319px;
        margin-top: 94.5px;
    }

    .path12 img{height:73px;}
    
    .path13{
        display: none;
        margin-left:211px;
        margin-top: 32.5px;
    }

    .path13 img{height:77px;}
    
    .path14{
        display: none;
        margin-left: 678px;
        margin-top: -90.5px;
    }

    .path14 img{height:160px;}
    
    .path15{
        display: none;
        margin-left: 638px;
        margin-top: -63.5px;
    }

    .path15 img{width:70px;}
    
    .path16{
        display: none;
        margin-left: 505px;
        margin-top: -158.5px;
    }

    .path16 img{height:200px;}
    
    .path17{
        display: none;
        margin-left: 559px;
        margin-top: -133.5px;
    }

    .path17  img{height:103px;}
    
    .path18{
        display: none;
        margin-left: 610px;
        margin-top: -198.5px;
    }

    .path18  img{height:82px;}
    
    .path19{
        display: none;
        margin-left: 428px;
        margin-top: -109.5px;
    }

    .path19  img{height:148px;}
    
    .path20{
        display: none;
        margin-left: 559px;
        margin-top: 185.5px;
    }

    .path20  img{width:143px;}

    .pathCount ul {
        display:none;
    }

    .pathContents {
        width: 100%;
        padding-left: 10px;
        border-left: 0px solid #fff;
        z-index: 1001;
    }

    .popup-contents-title {
        font-size: 14pt;
    }

    .popup-contents-path {
        font-size: 11px;
    }

    /** Speech bubble Control ************************/
    [speech-bubble] .title {
        font-size:12pt;
    }

    [speech-bubble] .course-title {
        font-size: 10pt;
    }
    /** Speech bubble Control ************************/

    .mapPopup1{
        margin-left:750px;
        margin-top: -269px;
        width : 200px;
    }

    .mapPopup2 {
        margin-left:530px;
        margin-top: -36px;
        width : 200px;
    }
    
    .mapPopup3 {
        margin-left: 498px;
        margin-top: 155px;
        width: 200px;
    }
    
    .mapPopup4 {
        margin-left: 606px;
        margin-top: -100px;
        width: 190px;
    }
    
    .mapPopup5 {
        margin-left: 563px;
        margin-top: -218px;
        width: 200px;
    }
    
    .mapPopup6 {
        margin-left: 795px;
        margin-top: -96px;
        width: 170px;
    }
    
    .mapPopup7 {
        margin-left: 356px;
        margin-top: 2px;
        width: 200px;
    }
    
    .mapPopup8 {
        margin-left: 570px;
        margin-top: 57px;
        width: 200px;
    }
    
    .mapPopup9 {
        margin-left: 180px;
        margin-top: -123px;
        width: 180px;
    }
    
    .mapPopup10 {
        margin-left: 100px;
        margin-top: -131px;
        width: 170px;
    }
    
    .mapPopup11 {
        margin-left: 245px;
        margin-top: 76px;
        width: 180px;
    }
    
    .mapPopup12 {
        margin-left:101px;
        margin-top: 156px;
        width : 200px;
    }
    
    .mapPopup13 {
        margin-left:0px;
        margin-top: 85px;
        width : 200px;
    }
    
    .mapPopup14 {
        margin-left: 757px;
        margin-top: -61px;
        width: 190px;
    }
    
    .mapPopup15 {
        margin-left: 676px;
        margin-top: -199px;
        width: 180px;
    }
    
    .mapPopup16 {
        margin-left: 277px;
        margin-top: -175px;
        width: 200px;
    }
    
    .mapPopup17 {
        margin-left: 382px;
        margin-top: -205px;
        width: 200px;
    }
    
    .mapPopup18 {
        margin-left: 720px;
        margin-top: -283px;
        width: 200px;
    }
    
    .mapPopup19 {
        margin-left: 224px;
        margin-top: -6px;
        width: 200px;
    }
    
    .mapPopup20 {
        margin-left: 625px;
        margin-top: 70px;
        width: 200px;
    }

   /* 메인 화면 맵 좌표 수정 끝 ******************************************/

    .footer-contents {
        padding-top: 40px;
    }
    
    .footer_nav_container p {
        /* line-height: 0.5; */
        font-size: 12pt;
    }

    .footer_nav_container p.copyrighter{
        font-size:14px;
    }
}

/************
5. 1024px
************/

@media only screen and (max-width: 1024px)
{
    .menu_item
	{
		border-bottom-color: rgba(181, 174, 196, 0.5);
	}
	.menu_item > a
	{
		font-size: 18px;
        font-weight:900;
		line-height: 50px;
		height: 50px;
	}
	.menu_selection li a
	{
		font-size: 15px;
		line-height: 40px;
		height: 40px;
	}

    .hamburger_menu_content {
        padding-left: 15px;
        padding-top: 70px;
        overflow: auto;
    }

    #sub_mnu_t ul li:first-child {
        margin-left: 0;
    }

    #sub_mnu_t ul li.w12 {
        width: 25%;
        font-size:12pt;
    }

    .thumb-content p {
        min-height:103px;
    }
}

/************
6. 991px
************/

@media only screen and (max-width: 991px)
{
	h1{font-size: 48px;}
	h2{font-size: 36px;}
    .main_nav_container {
        height:70px;
    }

    .navbar {
        height: 75px;
    }
	.shop_now_button
	{
		margin-top: 26px;
	}
	.grid-item
	{
		width: 25%;
	}
	.top_nav
	{
		display: none;
	}
	.navbar_menu
	{
		display: none;
	}
	.hamburger_container
	{
		display: block;
	}
	.main_slider
	{
		margin-top: 100px;
	}
	.main_slider_content
	{
		width: 100%;
		padding-right: 15px;
	}
	.banner_item
	{
		height: 160px;
	}
	.banner_category
	{
		min-width: 160px;
		height: 40px;
	}
	.banner_category a
	{
		font-size: 16px;
		line-height: 40px;
	}
	.product-item
	{
		width: 25%;
	}
	.deal_ofthe_week_col
	{
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	.deal_ofthe_week_content
	{
		position: relative;
		top: auto;
		left: auto;
		height: auto;
	}
	.deal_ofthe_week_img
	{
		text-align: center;
	}
	.timer li
	{
		width: 70px;
		height: 70px;
	}
	.timer_num
	{
		font-size: 28px;
	}
	.timer_unit
	{
		margin-top: 1px;
		font-size: 14px;
	}
	.benefit_col
	{
		margin-bottom: 30px;
	}
	.benefit_col:last-child
	{
		margin-bottom: 0px;
	}
	.blog_item_col
	{
		margin-bottom: 30px;
	}
	.blog_item_col:last-child
	{
		margin-bottom: 0px;
	}
	.blog_item
	{
		height: 440px;
	}
	.blog_title
	{
		font-size: 24px;
	}
	.newsletter_text
	{
		height: auto;
		margin-top: 30px;
	}
	.newsletter_text p
	{
		margin-top: 5px;
	}
	.newsletter_form
	{
		height: auto;
		margin-top: 30px;
		margin-bottom: 40px;
	}
    .footer-contents{
        padding-top:20px;
        padding-bottom:30px;
    }
	.footer_nav_container
	{
		height: auto;
		margin-top: 35px;
	}

    .footer_nav_container p{
        line-height:20px;
    }
	.footer_social
	{
		height: auto;
		margin-top: 20px;
		margin-bottom: 65px;
	}
}

/************
7. 959px
************/

@media only screen and (max-width: 959px)
{
        /** 메인 슬라이더 부분 대체하기 ******************************/

        .main_slider{
            display:none;
        }
    
        .main-mobile{ 
            display: block;
            margin-top:90px;
            min-height:500px;
        }
    
        .moblie-main-courselist {
            margin-bottom:15px;
        }
    
        .moblie-main-courselist .card-title{
            font-size:16pt;
            font-weight:900;
            margin-bottom:0;
        }
    
        .moblie-main-courselist .card-body ul{
            min-width:100%;
        }
    
        .moblie-main-courselist .card-body ul li{
            float:left;
        }
    
        .moblie-main-courselist .card-body ul li:first-child{
            width:75%;
        }
    
        .moblie-main-courselist .card-body ul li:last-child{
            width:25%;
            text-align: right;
        }
    
        .moblie-main-courselist .card-body a{
            height:50px;
            background-color: #f1f1f1;
        }
    
        .moblie-main-courselist .card-body svg{
            margin-top:6px;
        }
    
        .moblie-main-courselist p {
            margin-bottom: 0px;
        }
    
        .moblie-main-courselist .card-link{
            float:right;
        }
    
        .mobile-course-num{
            color:indianred;
        }
    
        .mobile-course-info{
            margin-top:5px;
        }
    
        /** 메인 슬라이더 부분 대체하기 ******************************/

}

/************
8. 880px
************/

@media only screen and (max-width: 880px)
{
        /** 메인 슬라이더 부분 대체하기 ******************************/

        .main_slider{
            display:none;
        }
    
        .main-mobile{ 
            display: block;
            padding-top:70px;
            min-height:500px;
        }
    
        .moblie-main-courselist {
            margin-bottom:15px;
        }
    
        .moblie-main-courselist .card-title{
            font-size:16pt;
            font-weight:900;
            margin-bottom:0;
        }
    
        .moblie-main-courselist .card-body ul{
            min-width:100%;
        }
    
        .moblie-main-courselist .card-body ul li{
            float:left;
        }
    
        .moblie-main-courselist .card-body ul li:first-child{
            width:75%;
        }
    
        .moblie-main-courselist .card-body ul li:last-child{
            width:25%;
            text-align: right;
        }
    
        .moblie-main-courselist .card-body a{
            height:50px;
            background-color: #f1f1f1;
        }
    
        .moblie-main-courselist .card-body svg{
            margin-top:6px;
        }
    
        .moblie-main-courselist p {
            margin-bottom: 0px;
        }
    
        .moblie-main-courselist .card-link{
            float:right;
        }
    
        .mobile-course-num{
            color:indianred;
        }
    
        .mobile-course-info{
            margin-top:5px;
        }
    
        /** 메인 슬라이더 부분 대체하기 ******************************/
	
}

/************
9. 768px
************/

@media only screen and (max-width: 768px)
{
        /** 메인 슬라이더 부분 대체하기 ******************************/

        .main_slider{
            display:none;
        }
    
        .main-mobile{ 
            display: block;
            padding-top:70px;
            min-height:500px;
        }
    
        .moblie-main-courselist {
            margin-bottom:15px;
        }
    
        .moblie-main-courselist .card-title{
            font-size:16pt;
            font-weight:900;
            margin-bottom:0;
        }
    
        .moblie-main-courselist .card-body ul{
            min-width:100%;
        }
    
        .moblie-main-courselist .card-body ul li{
            float:left;
        }
    
        .moblie-main-courselist .card-body ul li:first-child{
            width:75%;
        }
    
        .moblie-main-courselist .card-body ul li:last-child{
            width:25%;
            text-align: right;
        }
    
        .moblie-main-courselist .card-body a{
            height:50px;
            background-color: #f1f1f1;
        }
    
        .moblie-main-courselist .card-body svg{
            margin-top:6px;
        }
    
        .moblie-main-courselist p {
            margin-bottom: 0px;
        }
    
        .moblie-main-courselist .card-link{
            float:right;
        }
    
        .mobile-course-num{
            color:indianred;
        }
    
        .mobile-course-info{
            margin-top:5px;
        }
    
        /** 메인 슬라이더 부분 대체하기 ******************************/
	
}

/************
10. 767px
************/

@media only screen and (max-width: 767px)
{
	h1{font-size: 36px;}
	h2{font-size: 24px;}
	h6{font-size: 12px;}
	.main_slider_content h6
	{
		margin-bottom: 20px;
	}
	.shop_now_button
	{
		margin-top: 23px;
	}
	.red_button a
	{
		font-size: 12px;
	}
	.banner_item
	{
		margin-bottom: 30px;
		height: 210px;
	}
	.new_arrivals_title
	{
		margin-top: 44px;
	}
	.product-item
	{
		width: 33.333333333333%;
		height: 345px;
	}
	.product
	{
		height: 305px;
	}
	.grid_sorting_button
	{
		font-size: 13px;
		padding-left: 20px;
		padding-right: 20px;
		min-width: 80px;
	}
	.product_slider_container
	{
		height: auto;
	}
	.product_slider_item .product-item
	{
		height: 380px;
	}
	.benefit_col
	{
		margin-bottom: 15px;
	}
	.blog_item
	{
		height: 372px;
	}
	.newsletter_form
	{
		margin-bottom: 40px;
	}
	.newsletter_submit_btn
	{
		margin-top: 15px;
	}

        /** 메인 슬라이더 부분 대체하기 ******************************/

        .main_slider{
            display:none;
        }
    
        .main-mobile{ 
            display: block;
            padding-top:70px;
            min-height:500px;
        }
    
        .moblie-main-courselist {
            margin-bottom:15px;
        }
    
        .moblie-main-courselist .card-title{
            font-size:16pt;
            font-weight:900;
            margin-bottom:0;
        }
    
        .moblie-main-courselist .card-body ul{
            min-width:100%;
        }
    
        .moblie-main-courselist .card-body ul li{
            float:left;
        }
    
        .moblie-main-courselist .card-body ul li:first-child{
            width:75%;
        }
    
        .moblie-main-courselist .card-body ul li:last-child{
            width:25%;
            text-align: right;
        }
    
        .moblie-main-courselist .card-body a{
            height:50px;
            background-color: #f1f1f1;
        }
    
        .moblie-main-courselist .card-body svg{
            margin-top:6px;
        }
    
        .moblie-main-courselist p {
            margin-bottom: 0px;
        }
    
        .moblie-main-courselist .card-link{
            float:right;
        }
    
        .mobile-course-num{
            color:indianred;
        }
    
        .mobile-course-info{
            margin-top:5px;
        }
    
        /** 메인 슬라이더 부분 대체하기 ******************************/
}

/************
11. 575px
************/

@media only screen and (max-width: 575px)
{
	.hamburger_menu
	{
		right: -100%;
		width: 65%;
	}
	.product-item
	{
		width: 50%;
		height: 420px;
	}
	.product
	{
		height: 380px;
	}
	.blog_item
	{
		height: calc((100vw - 30px) / 1.37);
	}
	.cr
	{
		display: block;
		margin-right: 0px;
		margin-bottom: 30px;
		font-size: 13px;
	}
	.footer_nav
	{
		margin-bottom: 20px;
	}
	.footer_nav li
	{
		display: block;
		margin-right: 0px;
	}
	.footer_nav li a
	{
		font-size: 13px;
	}
}

/************
11. 539px
************/

@media only screen and (max-width: 539px)
{
        /** 메인 슬라이더 부분 대체하기 ******************************/

        .main_slider{
            display:none;
        }
    
        .main-mobile{ 
            display: block;
            padding-top:70px;
            min-height:500px;
        }
    
        .moblie-main-courselist {
            margin-bottom:15px;
        }
    
        .moblie-main-courselist .card-title{
            font-size:16pt;
            font-weight:900;
            margin-bottom:0;
        }
    
        .moblie-main-courselist .card-body ul{
            min-width:100%;
        }
    
        .moblie-main-courselist .card-body ul li{
            float:left;
        }
    
        .moblie-main-courselist .card-body ul li:first-child{
            width:75%;
        }
    
        .moblie-main-courselist .card-body ul li:last-child{
            width:25%;
            text-align: right;
        }
    
        .moblie-main-courselist .card-body a{
            height:50px;
            background-color: #f1f1f1;
        }
    
        .moblie-main-courselist .card-body svg{
            margin-top:6px;
        }
    
        .moblie-main-courselist p {
            margin-bottom: 0px;
        }
    
        .moblie-main-courselist .card-link{
            float:right;
        }
    
        .mobile-course-num{
            color:indianred;
        }
    
        .mobile-course-info{
            margin-top:5px;
        }
    
        /** 메인 슬라이더 부분 대체하기 ******************************/
	
}

/************
12. 480px
************/

@media only screen and (max-width: 480px)
{
        /** 메인 슬라이더 부분 대체하기 ******************************/

        .main_slider{
            display:none;
        }
    
        .main-mobile{ 
            display: block;
            padding-top:70px;
            min-height:500px;
        }
    
        .moblie-main-courselist {
            margin-bottom:15px;
        }
    
        .moblie-main-courselist .card-title{
            font-size:16pt;
            font-weight:900;
            margin-bottom:0;
        }
    
        .moblie-main-courselist .card-body ul{
            min-width:100%;
        }
    
        .moblie-main-courselist .card-body ul li{
            float:left;
        }
    
        .moblie-main-courselist .card-body ul li:first-child{
            width:75%;
        }
    
        .moblie-main-courselist .card-body ul li:last-child{
            width:25%;
            text-align: right;
        }
    
        .moblie-main-courselist .card-body a{
            height:50px;
            background-color: #f1f1f1;
        }
    
        .moblie-main-courselist .card-body svg{
            margin-top:6px;
        }
    
        .moblie-main-courselist p {
            margin-bottom: 0px;
        }
    
        .moblie-main-courselist .card-link{
            float:right;
        }
    
        .mobile-course-num{
            color:indianred;
        }
    
        .mobile-course-info{
            margin-top:5px;
        }
    
        /** 메인 슬라이더 부분 대체하기 ******************************/
	
}

/************
13. 479px
************/

@media only screen and (max-width: 479px)
{
	.logo_container a
	{
		font-size: 13px;
	}
	.hamburger_container
	{
		margin-left: 25px;
	}
	.hamburger_container i
	{
		font-size: 24px;
	}
	.hamburger_close
	{
		top: 14px;
		right: 4px;
	}
	.hamburger_close i
	{
		font-size: 27px;
	}
	.hamburger_menu_content
	{
		padding-left: 15px;
		padding-top: 70px;
        overflow: auto;
	}
	.menu_item
	{
		border-bottom-color: rgba(181, 174, 196, 0.5);
	}
	.menu_item > a
	{
		font-size: 18px;
        font-weight:900;
		line-height: 50px;
		height: 50px;
	}
	.menu_selection li a
	{
		font-size: 15px;
		line-height: 40px;
		height: 40px;
	}
	.navbar
	{
		height: 70px;
	}
	.navbar_user li a
	{
		width: 30px;
		height: 30px;
		font-size: 12px;
	}
	.checkout_items
	{
		width: 15px;
		height: 15px;
		font-size: 10px;		
	}
	.main_slider
	{
		height: calc(100vh - 70px);
		/*height: 80vw;*/
		min-height: auto;
		margin-top: 70px;
	}
	.main_slider_content h6
	{
		margin-bottom: 15px;
	}
	.main_slider_content h1
	{
		font-size: 24px;
	}
	.shop_now_button
	{
		margin-top: 15px;
		width: 100px;
		height: 35px;
	}
	.red_button a
	{
		font-size: 10px;
	}
	.banner_item
	{
		height: calc((100vw - 30px) / 2.6);
	}
	.grid_sorting_button
	{
		font-size: 12px;
		padding-left: 10px;
		padding-right: 10px;
		min-width: 60px;
		height: 35px;
	}
	.product-item
	{
		width: 100%;
		height: auto;
	}
	.product
	{
		height: auto;
	}
	.product_name a
	{
		font-size: 12px;
	}
	.add_to_cart_button
	{
		margin-top: 20px;
	}
	.deal_ofthe_week_img
	{
		height: 400px;
	}
	.timer
	{
		margin-top: 42px;
	}
	.timer li
	{
		width: 50px;
		height: 50px;
	}
	.section_title::after
	{
	    top: calc(100% + 8px);
	    height: 3px;
	}
	.timer_num
	{
		margin-top: 4px;
		font-size: 16px;
	}
	.timer_unit
	{
		margin-top: -9px;
		font-size: 10px;
	}
	.deal_ofthe_week_button
	{
		margin-top: 36px;
	}

	.product_slider_item .product-item
	{
		width: 100%;
		height: auto;
	}
	.product_slider_item .product-item:hover::after
	{
		box-shadow: none;
	}
	.product_slider_item .product-item .product
	{
		height: auto;
	}
	.product_slider_item .product-item .product_info
	{
		padding-bottom: 30px;
	}
	.blog_title
	{
		font-size: 16px;
	}
	.blog_meta
	{
		font-size: 10px;
	}
	.blog_more
	{
		font-size: 12px;
		margin-top: 5px;
	}
	.newsletter_form
	{
		margin-top: 22px;
	}
	.newsletter_text h4
	{
		font-size: 20px;
	}
	.newsletter_text p
	{
		font-size: 13px;
		margin-top: 5px;
	}
	.newsletter_submit_btn
	{
		font-size: 12px;
	}
	#newsletter_email
	{
		height: 40px;
		width: 100%;
		padding-left: 15px;
	}
	.newsletter_submit_btn
	{
		height: 36px;
		width: 130px;
	}
	#newsletter_email::-webkit-input-placeholder
	{
		font-size: 12px !important;
		padding-left: 0px;
	}
	#newsletter_email:-moz-placeholder /* older Firefox*/
	{
		font-size: 12px !important;
		padding-left: 0px;
	}
	#newsletter_email::-moz-placeholder /* Firefox 19+ */ 
	{
		font-size: 12px !important;
		padding-left: 0px;
	} 
	#newsletter_email:-ms-input-placeholder
	{ 
		font-size: 12px !important;
		padding-left: 0px;
	}
	#newsletter_email::input-placeholder
	{
		font-size: 12px !important;
		padding-left: 0px;
	}
	.footer_nav_container
	{
		margin-top: 35px;
	}
	.cr
	{
		margin-bottom: 20px;
	}
	.footer_nav
	{
		margin-bottom: 20px;
	}
	.footer_social
	{
		margin-top: 5px;
		margin-bottom: 30px;
	}

    .sub-top-image{
        margin-top: 70px;
    }

    ul.navi_form li {
        float:left;
        line-height: 54px;
        font-size:11pt;
    }
    
    ul.navi_form li.navi_txt {
        padding-right:10px;
    }
    
    ul.navi_form li.navi_div {
        padding-right:20px;
    }

    .sub_container {
        margin-top: 30px;
        padding-bottom: 30px;
    }

    .sub-category-title p {
        margin-top:80px;
        font-size: 26pt;
        font-weight: 700;
        color: #fff;
    }


    .sub-title-section {
        margin-top: 50px;
        margin-bottom: 0px;
    }

    .sub-title-section h2 {
        font-size: 30px;
        font-weight: 900;
    }

    .sub-title-section2 h2 {
        font-size: 30px;
        font-weight: 900;
    }

    .sub-title-section2 {
        margin-top: 20px;
        margin-bottom: 30px;
    }

    .middle-title {
        font-size:25px;
    }

    /** 메인 슬라이더 부분 대체하기 ******************************/

    .main_slider{
        display:none;
    }

    .main-mobile{ 
        display: block;
        margin-top:20px;
        min-height:500px;
    }

    .moblie-main-courselist {
        margin-bottom:15px;
    }

    .moblie-main-courselist .card-title{
        font-size:16pt;
        font-weight:900;
        margin-bottom:0;
    }

    .moblie-main-courselist .card-body ul{
        min-width:100%;
    }

    .moblie-main-courselist .card-body ul li{
        float:left;
    }

    .moblie-main-courselist .card-body ul li:first-child{
        width:75%;
    }

    .moblie-main-courselist .card-body ul li:last-child{
        width:25%;
        text-align: right;
    }

    .moblie-main-courselist .card-body a{
        height:50px;
        background-color: #f1f1f1;
    }

    .moblie-main-courselist .card-body svg{
        margin-top:6px;
    }

    .moblie-main-courselist p {
        margin-bottom: 0px;
    }

    .moblie-main-courselist .card-link{
        float:right;
    }

    .mobile-course-num{
        color:indianred;
    }

    .mobile-course-info{
        margin-top:5px;
    }

    /** 메인 슬라이더 부분 대체하기 ******************************/
}

/************
14. 400px
************/

@media only screen and (max-width: 400px)
{
	
}