
@media only screen and (max-width:1450px){
	.wrapper{width: 100%; padding: 0 20px;}
    .main .mainSwiper .page-wrapper,.main .subSwiper .page-wrapper{left: 20px; margin-left: 0; width: 100%;}
    .main .mainSwiper .swiper-button-prev{left: 20px; display: none;}
    .main .mainSwiper .swiper-button-next{right: 20px; display: none;}
    .main .con1 .new .img{margin-right: 20px;}
    .main .con1 .best .img{margin-left: 20px;}

    .sub .sub-tab ul{width: 100%;}
    .sub .story-list{width: 100%; padding: 0 20px;}
    .brand-swiper .subinfor-tab{width: 100%;}

    .worldwide .swiper-button-prev{display: none;}
    .worldwide .swiper-button-next{display: none;}

}

@media only screen and (max-width:1250px){
    .history .history-list{width: 100%;}
    .history .txt-right .historyimg{margin-left: 50px;}
}

@media only screen and (max-width:1200px){
    header .gnb > li > a{font-size: 14px;}
    header .pc-show .gnb li{margin-left: 45px;}
    header .pc-show .depth a{font-size: 14px;}
    header .depth-wide .depth1 ul{margin-top: 45px;}
    header .depth-wide .depth1 li a{font-size: 14px;}
    header .depth-wide .depth-wrap div.depth2 ul li{margin-top: 20px;}
    header .depth-wide .depth-wrap div.depth2 ul li a{font-size: 14px;}
    header .depth-wide .depth-wrap > div.depth3 .content li{margin-top: 20px;}
    header .depth-wide .depth-wrap > div.depth3 .tab > li a{font-size: 14px;}
    header .depth-wide .depth-wrap > div.depth3 .content a{font-size: 14px;}
    header .depth-wide .depth-wrap > div.depth4 ul li{margin-top: 20px;}
    header .depth-wide .depth-wrap > div.depth4 ul li a{font-size: 14px;}
    header .search-pop .tit{font-size: 20px;}
    header .search-pop ul li a{font-size: 12px;}
    header .search-pop ul:before{font-size: 12px; top: 3px;}

    .main .mainSwiper{height: 800px;}
    .main .mainSwiper .txt span{font-size: 14px !important;; margin-bottom: 20px !important;}
    .main .mainSwiper .txt p{font-size: 25px !important;; line-height: 40px !important;}
    .main .mainSwiper .pagination_bullet span{font-size: 13px; margin: 0 2px;}
    .main .mainSwiper .page-wrapper,.main .subSwiper .page-wrapper{top: 530px;}
    .main .con1{padding: 30px 0 60px;}
    .main .con1 i{font-size: 14px;}
    .main .con1 .tit{font-size: 24px; line-height: 30px; margin-top: 18px;}
    .main .con1 .tit span{font-size: 15px;}
    .main .con1 p{font-size: 13px; line-height: 22px; margin-top: 20px;}
    .main .con1 .new a,.main .con1 .best a{font-size: 12px; margin-top: 45px;}
    .main .con1 a.more{font-size: 13px; width: 320px; height: 48px; line-height: 48px; margin-top: 80px;}
    .main .con2{height: 800px;}
    .main .con2 p{font-size: 28px; line-height: 40px; word-break: keep-all;}
    .main .con2 p span{font-size: 15px; margin-bottom: 20px;}
    .main .con3{padding: 80px 0 160px; position: relative;}
    .main .con3 .name{font-size: 14px;}
    .main .con3 .price{font-size: 12px;}
    .main .con3 .name{margin: 15px 0;}
    .main .con3 .swiper-button-next,.main .con3 .swiper-button-prev{display: none;}
    .main .con3 .swiper-pagination-progressbar{width: 320px; background: #eaeaea; height: 1px; left: 50%; margin-left: -160px; top: initial; bottom: 100px; display: block;}
    .main .con3 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background: #666; height: 2px;}
    .main .con4{padding-bottom: 80px;}
    .main .con4 .tit{font-size: 26px;}
    .main .con4 a.sns-link{font-size: 13px; margin-top: 15px; background-position-y: 2px;}
    .main .con4 ul{margin-top: 35px;}
    .main .con4 ul li{margin-left: 10px;}

    .sub{padding-bottom: 80px;}
    .sub .sub-top{padding-bottom: 160px; padding-top: 120px;}
    .sub .sub-top .tit span{font-size: 13px; margin-bottom: 35px;}
    .sub .sub-top .tit{font-size: 44px;}
    .sub .sub-top p{font-size: 14px; line-height: 24px; margin-top: 25px;}
    .sub .sub-top:after{display: none;}
    .sub .sub-tab{margin-top: 0;margin-bottom: 40px;}
    .sub .sub-tab ul li a{font-size: 13px; padding: 15px 0;}

    .sub .search-area input{font-size: 13px; height: 40px; padding: 0 40px 0 10px;}
    .sub .search-area button{width: 40px; height: 40px; background-size: 18px auto;}

    .paging{margin-top: 50px; }
    .paging .pg{gap: 25px; flex-wrap: wrap;}
    .paging a.pg_page{font-size: 12px;}
    .paging a.pg_page.pg_next,.pg_page.pg_start{width: 30px; height: 30px;}
    .paging .pg_current{font-size: 12px;}

    .sub .story-list .txt i{font-size: 13px;}
    .sub .story-list .tit{font-size: 22px; line-height: 32px; margin-top: 20px; margin-bottom: 30px;}
    .sub .story-list p{font-size: 13px; line-height: 23px;}
    .sub .story-list li{margin-top: 65px;}
    .brand-swiper{margin-top: 0; margin-bottom: 60px;}
    .brand-swiper .subinfor-tab{width: 100%;}
    .earth .sub-top{background: url(../img/sub/m-earth-bg.jpg) center no-repeat; background-size: cover;}
    .eco .sub-top{background: url(../img/sub/m-eco-bg.jpg) center no-repeat; background-size: cover;}
    .goodproduct .sub-top{background: url(../img/sub/m-goodproduct-bg.jpg) center no-repeat; background-size: cover;}
    .goodproduct .ingredient .txt{padding-top: 60px;}
    .goodproduct .ingredient .swiper{width: 100%;}
    .goodproduct .ingredient i{font-size: 13px; margin-bottom: 10px;}
    .goodproduct .ingredient .tit{font-size: 22px; line-height: 32px;}
    .goodproduct .ingredient p{font-size: 13px; line-height: 23px;}
    .goodproduct .idea, .goodproduct .design{height: auto; margin-top: 100px;}
    .goodproduct .idea i, .goodproduct .design i{font-size: 13px;}
    .goodproduct .idea .tit, .goodproduct .design .tit{font-size: 22px; line-height: 32px; margin-bottom: 30px; margin-top: 15px;}
    .goodproduct .idea p,.goodproduct .design p{font-size: 13px; line-height: 23px;}
    .goodproduct .idea .txt, .goodproduct .design .txt{margin-left: 20px;}
    .goodproduct .idea .img{top: -11%;}
    .goodproduct .design .img{top: -3%;}
    .goodproduct .design .award span:first-child{font-size: 13px;}
    .goodproduct .design .award span{font-size: 13px;}
    .goodproduct .design .award:before{bottom: 0; height: auto;}
    .goodproduct .award-list{margin-top: 100px; position: relative;}
    .goodproduct .award-list .tit{font-size: 14px; margin-top: 10px; margin-bottom: 5px;}
    .goodproduct .award-list .time{font-size: 12px;}
    .goodproduct .award-list p{font-size: 12px; line-height: 20px; margin-top: 10px;}
    .goodproduct .award-list .swiper{padding-bottom: 50px;}
    .goodproduct .award-list .swiper-pagination-progressbar{width: 320px; background: #eaeaea; height: 1px; left: 50%; margin-left: -160px; top: initial; bottom: 0px; display: block;}
    .goodproduct .award-list .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background: #666; height: 2px;}
    
    .worldwide .sub-top{background: url(../img/sub/m-worldwide-bg.jpg) center no-repeat; background-size: cover;}
    .worldwide .big-tit{width: 100%;}
    .worldwide .b-tit{font-size: 22px;}
    .worldwide .b-txt{font-size: 13px; line-height: 23px;}
    .worldwide .swiper{width: 100%;}
    .worldwide .time{font-size: 12px;}
    .worldwide .tit{font-size: 18px;}
    .worldwide .slide-in p{display: none;}
    .worldwide .slide-in img{max-width: 100%;}

    .history .sub-top img{width: 166px;}
    .history .history-list{padding-bottom: 40px;}
    .history .timeline:before{width: 5px; height: 5px; left: 22px;}
    .history .txt-left .year:before{width: 5px; height: 5px; left: 0; margin-left: -2px;}
    .history .history-list > li{margin-top: 70px;}
    .history .history-list .txt-left .month{left: 15px;}
    .history .history-list .txt-right{width: 100%;}
    .history .txt-right .time{margin-right: 0;}
    .history .history-list .year{font-size: 24px;}
    .history .historyimg{position: static !important; margin-left: 15px !important;}
    .history .historyimg img{width: 100%;}
    .history .historyimg p{padding-left: 0 !important; font-size: 18px !important; line-height: 25px !important; margin-bottom: 20px; margin-top: 15px;}
    .history .timeline{left: 20px; margin-left: 0; top: -40px;}
    .history .txt-right .year:before{left: -2px; right: initial; width: 5px; height: 5px;}
    .history .history-list .month{font-size: 13px;}
    .history .history-list p{font-size: 13px; line-height: 22px;}
    .history .history-list .txt-right{text-align: left;}
    .history .history-list .year{padding-left: 15px;}
    .history .history-list p{padding-left: 40px;}
    .history .history-list .txt-right .month{left: 15px;}
    .history .txt-left{margin-left: 0; width: 100%;}
    .history .txt-left .month-list li{padding-left: 0;}
    .history .txt-left .time{margin-left: 0;}
    .history .txt-left .historyimg{margin-right: 0;}
    .history .txt-left .historyimg p{text-align: left;}
    .history .txt-left .historyimg img{width: 100%;}

    .sub .path{font-size: 12px;}
    .sub .path span:before{width: 16px; height: 16px; background-size: 16px auto; top: -1px;}
    .sub .page-tit{font-size: 28px; margin-top: 20px;}
    .item-page .item-infor{margin-top: 45px; align-items: baseline;}
    .item-page .item-infor p{font-size: 12px;}
    .item-page .item-list{margin-top: 30px;}
    .item-page .item-list li .name{font-size: 14px; margin-bottom: 15px; margin-top: 25px; word-break: keep-all; line-height: 18px;}
    .item-page .item-list li .price{font-size: 12px;}
    .item-page .item-infor ul li a{font-size: 12px;}
    .item-page .item-category{margin-top: 35px;}
    .item-page .item-category li a{font-size: 13px; padding: 8px 10px;}

    .item .image-box .tit span{font-size: 12px;}
    .item .image-box .tit{font-size: 22px; line-height: 30px;}
    .item .image-box p{font-size: 13px; line-height: 23px;}
    .item .infor{font-size: 13px;}
    .item .thumb-infor select{font-size: 13px; height: 40px; padding: 0 15px; background-size: 11px auto; background-position-x: calc(100% - 15px);}
    .item .thumb-infor button{font-size: 16px;}
	.item .detail .detail_infor {padding:0;}
    .item .detail span{font-size: 22px;}
    .item .detail table{margin-top: 25px;}
    .item .detail table th{font-size: 12px; padding: 10px; line-height: 16px;}
    .item .detail table td{font-size: 12px; padding: 10px; line-height: 16px;}
    .item .detail table td ul{line-height: 16px;}
    
    .store .st-country a{font-size: 24px;}
    .store .st-area select{font-size: 13px; height: 40px; background-size: 11px auto; background-position-x: calc(100% - 15px);}
    .store .st-area input{height: 40px; font-size: 13px;}
    .store .st-area button{width: 40px; height: 40px; background-size: 18px auto;}
    .store .st-cate a{font-size: 12px; padding: 5px 10px;}
    .store .store-list .st-tit{font-size: 14px;}
    .store .store-list .st-address{font-size: 12px; line-height: 20px; margin-top: 8px; margin-bottom: 10px;}
    .store .store-list .st-infor span{font-size: 13px !important;}
    .en .store .st-country a{font-size: 16px;}

    .sub .subinfor-tab a{font-size: 13px; padding: 15px 0;}
    .magazine-list .tit{font-size: 14px; margin-top: 15px; margin-bottom: 10px;}
    .magazine-list .date{font-size: 12px;}
    .magazine .detail .d-tit{font-size: 22px; line-height: 30px; margin-top: 45px; margin-bottom: 15px;}
    .magazine .detail .date{font-size: 12px;}
    .magazine .detail .img{margin-top: 30px;}
    .magazine .view-control{margin-top: 50px;}
    .magazine .view-control .all-list{font-size: 13px; width: 120px; padding: 12px 0;}
    .magazine .view-control .prev{font-size: 13px;}
    .magazine .view-control .next{font-size: 13px;}

    .magazine .award-list a{font-size: 14px; padding: 33px 20px;}
    .magazine .award-list a:after{width: 50px; height: 50px; background-size: 14px auto; margin-top: -25px;}

    .cs-center .faq-list li > a{font-size: 14px; line-height: 20px; padding-left: 45px; padding-top: 30px; padding-bottom: 30px; padding-right: 50px;}
    .cs-center .faq-list li > a > span{display: none;}
    .cs-center .faq-list li > a:before{left: 22px; font-size: 14px;}
    .cs-center .faq-list li > a:after{width: 15px; height: 15px; background-size: 15px auto; top: 32px; right: 20px;}
    .cs-center .faq-list li.on > a:after{width: 15px; height: 15px; background-size: 15px auto;}
    .cs-center .faq-list .hide{padding: 20px 47px;}
    .cs-center .faq-list .hide > div{font-size: 13px; line-height: 20px;}
    .cs-center .faq-list .hide:before{font-size: 14px; left: 22px; top: 23px;}

    .cs-center .agree{padding: 20px; margin: 30px 0;}
    .cs-center .agree .inputarea label:before{width: 18px; height: 18px; margin-top: -8px;}
    .cs-center .agree .inputarea label{font-size: 12px; padding-left: 15px;}
    .cs-center .agree a{font-size: 12px;}
    .cs-center .input-list span.tit{font-size: 12px; margin-bottom: 8px;}
    .cs-center .input-list select{font-size: 13px; height: 40px; background-size: 11px auto; background-position-x: calc(100% - 15px);}
    .cs-center .input-list input[type="text"]{height: 40px; font-size: 12px;}
    .cs-center .input-list li.flex{margin-top: 20px;}
    .cs-center .input-list textarea{font-size: 12px; padding: 20px;}
    .cs-center .qa-btn{font-size: 13px; padding: 17px 0; margin-top: 40px;}
    .cs-center .input-list .security a{height: 26px; width: 26px;}

    .cs-center .membership-check .in{width: 100%;}
    .cs-center .membership-check .tit{font-size: 12px;}
    .cs-center .membership-check input{height: 40px;}
    .cs-center .membership-check .find li{margin-top: 18px;}
    .cs-center .membership-check a.num-btn{font-size: 13px; padding: 16px 0;}
    .cs-center .membership-check a.certification-btn{font-size: 13px; padding: 16px 0;}
    .cs-center .membership-check .find .num-input span{font-size: 12px; top: 15px;}
    .cs-center .membership-check input[type="text"]{font-size: 13px !important; padding: 0 10px;}

    .cs-center .storeopen-qa{width: 100%;}
    .cs-center .storeopen-qa .tit{font-size: 16px;}
    .cs-center .storeopen-qa .phone{font-size: 13px;}
    .cs-center .storeopen-qa .infor a{font-size: 12px; padding: 9px 0;}
    .cs-center .storeopen-qa .box > ul > li{padding: 30px;}
    .cs-center .storeopen-qa .box .name{margin-bottom: 20px;}
    .cs-center .storeopen-qa .phone li{margin-top: 10px;}

    .cs-center .member-result{width: 100%; padding-left: 20px; padding-right: 20px;}
    .cs-center .member-result .member-infor{font-size: 14px;}
    .cs-center .member-result .member-infor > div{font-size: 18px;}
    .cs-center .member-result .all{font-size: 12px;}
    .cs-center .member-result .all span{font-size: 20px; padding-right: 15px;}
    .cs-center .member-result .all span:after{font-size: 12px; top: 4px;}
    .cs-center .member-result .member-infor{padding-left: 70px; padding-top: 10px; padding-bottom: 10px;}
    .cs-center .member-result .member-infor.red{background-size: 55px auto; background-position-y: 10px;}
    .cs-center .point-list{width: 100%;}
    .cs-center .point-list span{font-size: 13px;}
    
    footer .menu-list li a{font-size: 12px;}
    footer .phone p{font-size: 13px;}
    footer .phone p span{font-size: 16px; top: 1px;}
    footer .operating-time{font-size: 12px;}
    footer .logo .hide p{font-size: 12px; line-height: 20px;}
    footer .right{font-size: 12px;}
    footer .logo{margin-top: 40px;}
    footer .phone{margin-top: 25px;}
    footer .logo img{width: 144px;}
    footer .logo a{padding-right: 35px;}
    footer .logo a:before{width: 24px; height: 24px; background-size: 24px auto;}
    footer .in{padding: 35px 0;}
}

@media only screen and (max-width:1024px){
    /* header{height: 100%; overflow-y: auto;} */
    header .pc-show{display: none;}
    header .mobile-show{display: block;}

    .main .mainSwiper{height: 640px;}
    .main .mainSwiper .slide1,.main .mainSwiper .slide2,.main .mainSwiper .slide3{background-size: cover;}
    .main .con1 .img{width: 100%;}
    .main .con1 .img img{width: 100%;}
    .main .con1 .new, .main .con1 .best{flex-direction: column;}
    .main .con1 .new .img{margin-right: 0;}
    .main .con1 .txt{width: 100%; margin-top: 30px;}
    .main .con1 .best{margin-top: 80px;}
    .main .con1 .best .txt{order: 1;}
    .main .con1 .best .img{margin-left: 0;}
    .main .con2{height: 640px; padding: 0 20px;}
    .main .con4 ul li:last-child{display: none;}

    .page{margin-top: 62px;}

    .sub .story-list li{flex-direction: column;}
    .sub .story-list li:nth-child(odd) .img{order: -1;}
    .sub .story-list .txt,.sub .story-list li .img img{width: 100%;}
    .sub .story-list .txt{justify-content: flex-start; padding-top: 35px;}

    .goodproduct .ingredient .swiper{padding-bottom: 50px;}
    .goodproduct .ingredient .txt{width: 100%;}
    .goodproduct .ingredient .img{position: static; width: 100%;}
    .goodproduct .ingredient .img img{width: 100%;}
    .goodproduct .ingredient p{word-break: keep-all; margin-top: 20px;}
    .goodproduct .ingredient p br{display: none;}
    .goodproduct .idea, .goodproduct .design{flex-direction: column;}
    .goodproduct .idea .img, .goodproduct .design .img{width: 100%; position: static;}
    .goodproduct .design .img{margin-top: 15px;}
    .goodproduct .design p{margin: 20px 0;}
    .goodproduct .idea .img img, .goodproduct .design .img img{width: 100%;}
    .goodproduct .idea .tit, .goodproduct .design .tit{margin-bottom: 0;}
    .goodproduct .idea .txt, .goodproduct .design .txt{margin-left: 0; width: 100%;}
    .goodproduct .idea p br{display: none; word-break: keep-all;}
    .goodproduct .design .award{margin-top: 25px;}
    .goodproduct .award-list .swiper-slide{width: 30%;}
    .goodproduct .award-list .time i{display: block;}

    .worldwide .slide-in{flex-direction: column;}
    .worldwide .slide-in .big-img{width: 100%;}
    .worldwide .slide-in .s-txt{display: flex; align-items: center;}
    .worldwide .swiper{position: relative; padding-bottom: 50px;}
    .worldwide .swiper-pagination-progressbar{display: block; bottom: 0; top: initial !important;}
    .worldwide .swiper-pagination-progressbar{width: 320px; background: #eaeaea; height: 1px !important; left: 0; right: 0; top: initial; bottom: 0px; display: block;}
    .worldwide .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background: #666; height: 2px;}
    .worldwide .swiper-pagination{font-size: 12px;}

    .item-page .item-category{justify-content: left;}
    .item .image-box{flex-direction: column;}
    .item .image-box .img{width: 100%;}
    .item .mySwiper .swiper-slide{width: 25% !important;}
    .item .mySwiper .swiper-slide img {width: 100%;}
    .item .image-box .thumb-infor{width: 100%;}
    .item .image-box .tit{margin-top: 30px;}
    .item .image-box .tit span{margin-bottom: 15px;}
    .item .image-box p{margin-top: 25px; padding-bottom: 30px; margin-bottom: 30px;}
    .item .item-tab{margin-top: 50px;}
    .item .thumb-infor select{margin: 25px 0;}
    
    .store{display: block;}
    .page .store .popup-btn{display: block; position: relative; height: 0px;}
    .page .store .popup-btn:before{content: ''; display: block; width: 64px; height: 14px; background: url(../img/sub/store-arrow.png) no-repeat; border-radius: 50px; left: 50%; margin-left: -20px; position: absolute; top: -9px;}
    .page .store .store-in.active .popup-btn:before{background: url(../img/sub/store-arrow-down.png) no-repeat;}
    .store .store-in{width: auto; top: 85%; background: #FFF; z-index: 2; position: fixed; left: 0; right: 0;}
    .store .store-in .st-search{position: fixed; top: 62px; left: 0; right: 0; z-index: 1; background: #FFF; width: 100%;}
    .store .list-wrap{height: 100%; margin-top: 0;}
    .store .st-country{margin-top: 30px;}
    .store .st-cate{margin: 10px 0;}
    .store .map{min-height: 100vh; width: 100%;}
    .store .store-list li{padding: 25px 20px 25px 30px;}
    .store .store-list li.on:before{background-size: 10px auto; width: 10px; height: 15px; top: 25px; left: 17px;}
    .store .popup-btn{display: block; position: relative; height: 15px;}
    .store .popup-btn:before{content: ''; display: block; width: 40px; height: 4px; background: #cacaca; border-radius: 50px; left: 50%; margin-left: -20px; position: absolute; top: 50%; margin-top: -2px;}
    .store .store-in{bottom: 0;}
    .store .store-list{border: 0; overflow-y: scroll; height: 100%; width: 100%;}
    .store .store-pick{padding: 15px !important; width: 180px !important;}
    .store .store-pick .type{font-size: 12px;}
    .store .store-pick .name{font-size: 15px;}
    .store .store-pick .where{font-size: 12px;}
    .store .store-pick .tel{font-size: 12px; margin-top: 10px;}
    .store .gm-style .gm-style-iw-c{width: 180px !important;}

    .magazine-list{gap: 40px 24px;}
    .magazine-list li{width: calc((100% - 24px)/2);}

    .magazine .view-control{width: 100%;}
    .magazine .view-control .prev{padding-left: 25px;}
    .magazine .view-control .prev:before{background: url(../img/sub/m-list-arrow.png) no-repeat; width: 17px;}
    .magazine .view-control .next{padding-right: 25px;}
    .magazine .view-control .next:before{background: url(../img/sub/m-list-arrow.png) no-repeat; width: 17px;}
    .magazine .detail .video{padding-bottom: 50%; width: 100%; height: auto;}

    .cs-center .storeopen-qa .box{margin-top: 50px;}
    .cs-center .storeopen-qa .infor{flex-direction: column; justify-content: initial;}
    .cs-center .storeopen-qa .phone{text-align: left; width: 100%;}
    .cs-center .storeopen-qa .infor a{width: 100%; margin-top: 25px;}
    .cs-center .storeopen-qa .box > ul{gap: 15px;}
    
}
