@import url('/css/animate.css');

/* index.less */
#product_area .row .info_box{transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);}#product_area .row .img_box{transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);}@media (min-width:1281px){#product_area .row:hover .info_box{transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);}#product_area .row:hover .img_box{transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);}}@media (max-width:1280px){#product_area .slick-current .img_box{transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);}}

.wow { animation: fadeIn 1.5s both; -webkit-animation: fadeIn 1.5s both; animation-duration: 1s; -webkit-animation-duration: 1s; animation-name: fadeInUp; -webkit-animation-name: fadeInUp }

/* wrap */
#wrap {position: relative;width: 100%;}

/* section */
section { padding: 5vw 0; }
section>* { z-index: 5; }
section .title_box { margin-bottom: 40px; }
section .title_box font { font-weight: 600; font-size: 45px; color: var(--info); position: relative; line-height: 130%; text-transform: uppercase; letter-spacing: 2px; }
section .title_box font:first-child { color: var(--triadic1); }
section .title_box .page_title { text-transform: uppercase; line-height: 130%; letter-spacing: 1px; font-weight: 600; font-size: 22px; color: var(--triadic1); padding-left: 90px; position: relative; margin-bottom: 15px; }
section .title_box .page_title::after { content: ""; width: 75px; height: 5px; opacity: 1; position: absolute; top: 50%; left: 0; transform: translate(-50%, -50%); -webkit-transform: translateY(-50%); background-color: var(--triadic1); }
section .title_box .noteBox { font-size: 20px; margin-top: 10px; opacity: .7; letter-spacing: 1px; }

.more_btn { margin-top: 0; }
.more_btn a { position: relative; overflow: hidden; width: 130px; padding: 10px 50px 10px 30px; display: inline-block; border-radius: 30px 0 0px 0px; }
.more_btn font { text-align: left; font-weight: 500; letter-spacing: 1px; color: #4f3c30; }
.more_btn.white font { font-size: 14px; position: relative; -webkit-writing-mode: inherit; -ms-writing-mode: inherit; writing-mode: inherit; color: #fff; font-family: 'Barlow', sans-serif; font-weight: 500; }
.more_btn.white span::after { position: absolute; content: ""; width: 34px; height: 14px; background-image: url(/images/39/icon-arrow.png); background-size: contain; background-position: 40% 50%; background-repeat: no-repeat; top: 20px; right: 20px; }
.more_btn.white a:before { content: ""; height: 100%; width: 100%; display: block; position: absolute; bottom: 0; left: 0; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; background-color: var(--primary); }

/* headBan */
#headBan { display: flex; flex-direction: column; align-items: center; }

/* search_box */
#headBan #search_box { --search-w: 1520px; position: absolute; margin: -10% auto 0; width: min(92%, var(--search-w)); bottom: -6%; transform: none; z-index: 998; }
#headBan #search_box .search_tabs { width: 400px; }
#headBan #search_box .search_tabs li { justify-content: flex-start; }
#headBan #search_box .search_container { border-radius: 0 60px 0 0; }


/*cop_title*/
.cop_title{position: relative;display: flex;flex-direction: column;}
.cop_title::before{content:"";position: absolute;width: 35px;aspect-ratio: 1/1;background: #dcd7c9;left: -58px;top: 7px;animation: sway 8s linear infinite;}
.cop_title .title_big{font-size: max(3 * (1vw + 1vh) / 2, 26px);font-weight: 600;line-height: 1.2;}
.cop_title .title_small{text-transform: uppercase;font-size: 18px;font-weight: 400;}

.centertitle.cop_title{display:flex;flex-direction: column;align-items: center;padding-top: 60px;}
.centertitle.cop_title:before{left: unset;}

/*about_area*/
#about_area{padding-bottom: 300px;background-color: #f4f4f4;background-image: url(/images/39/under_logo.png);background-size: 33vw;background-repeat: no-repeat;background-position: 109% 30%;}
div[data-paroller-type="foreground"]{-webkit-transition: all 0s ease-in-out;}
#about_area:before{content:"";background:url(/images/39/right_ball.png);position: absolute;width: 11vw;aspect-ratio: 85/146;right: 0;bottom: 13vw;background-size: contain;animation: float 5s linear infinite;}

@keyframes float{0%{transform:translateY(0)}
50%{transform: translateY(-40px);}
100%{transform:translateY(0)}
}
@keyframes sway {
    0% {transform: rotate(0deg);}
    50% {transform: rotate(180deg);}
    100% {transform: rotate(360deg);}
}

.ballJ_box{position:absolute;left: 50%;top: -25px;z-index: 1;}

/* popular_area */
#popular_area {padding: 4vw 0 12vw 0;background-color: white;}
#popular_area .workframe{width:min(1600px , 90%)}
#popular_area:before {position: absolute;display: block;top: -185px;left: 0px;content: "";background-image: url(/images/39/shapJe.png);background-repeat: no-repeat;z-index: 1;width: 100%;height: 205px;background-size: contain;aspect-ratio: 1903/189;background-repeat: no-repeat;background-position: 50% 100%;}
#popular_area:after{content:"";position:absolute;background:url("/images/39/bannershope.png");width: 102%;bottom: -2px;aspect-ratio: 635/63;background-repeat: no-repeat;background-size: contain;}

#popular_area .title_box {display: grid;grid-template-columns: 1fr 170px;gap: 20px;justify-content: space-between;align-items: center;margin: 0 20px 30px 12%;padding: 25px 0;}
#popular_area .list_box #imglist {width: 100%;align-items: end;margin-bottom: 70px;}
#popular_area .list_box #imglist .leftbox { position: relative; }
#popular_area .list_box #imglist .leftbox .img_nav{width: 100%;}
#popular_area li, #product_area .productList li {padding-bottom: 0;}
#popular_area li .info_box {position: relative;letter-spacing: 0.5px;background-color: #fff;border-radius: 0;overflow: hidden;}
#popular_area #JaJatext{
    font-size: 13rem;
    text-transform: uppercase;
    position: absolute;
    top: -8rem;
    right: -26rem;
    z-index: -1;
    font-weight: 800;
    color: #f4f4f4;
}
#popular_area li .cactName{position:absolute;width: 100%;display: flex;justify-content: flex-end;margin-top: -22px;}
#popular_area li .cactName .va_vcate{padding: 5px 13px;background: var(--primary);color: white;font-size: 17px;}
#popular_area li .info_box .Img img, #product_area .productList .Img_box img { aspect-ratio: 2.8 / 2.2; object-fit: cover; }
#popular_area li .info_box .price { position: absolute; bottom: 0; background-color: rgb(0 0 0 / 58%); width: calc(100% - 40px); display: flex; padding: 10px 20px; justify-content: space-between; align-items: baseline; }
#popular_area li .info_box .price font, #popular_area li .info_box .price .number { color: var(--white); display: flex; align-items: baseline; letter-spacing: 1.5px; }
#popular_area li .info_box .price font b, #product_area .txt_box .price font b { color: #18c15c; font-size: 25px; font-family: "Noto Sans TC", sans-serif; line-height: 140%; margin-right: 5px; }
#popular_area li .txtitems {position: relative;color: #a6a6a6;padding: 10px 20px;overflow: hidden;}
#popular_area li .txtitems .h2, #product_area .txt_box .InfoList .h2 {font-size: 21px;height: 36px;font-weight: 500;}
#popular_area .rightbox li .txtitems .h2{font-size: 26px;height: 45px;margin: 0;}
#popular_area li .txtitems article, #product_area .txt_box .InfoList article { font-size: 16px; color: #5a5a5a; letter-spacing: .5px; }
#popular_area li .txtitems .btn {display: flex;position: relative;color: white;align-items: center;border-radius: 6666px;aspect-ratio: 1/1;width: 30px;flex-direction: column;justify-content: center;margin: 0;}
#popular_area li .txtitems .btn svg {fill: #ffffff;width: 16px;aspect-ratio: 1/1;position: relative;padding: 13px;background: var(--info);border-radius: 666px;}
#popular_area .rightbox li .txtitems .btn svg{padding: 18px;width: 20px;}
#popular_area li:hover .txtitems .btn svg{background: var(--primary);}
#popular_area .priceJJ{display:flex;align-items: center;justify-content: space-between;}
#popular_area .priceJJ .gachan{font-size: 2.25rem;color: #ad9c6d;font-weight: 600;display: flex;align-items: flex-end;gap: 10px;line-height: 1;}
#popular_area .rightbox .priceJJ .gachan{font-size: 2.5rem;}
#popular_area li .gogoinfo{font-size: 18px;font-weight: 500;padding: 0 1px;}
#popular_area .rightbox li .gogoinfo{font-size: 18px;}
#popular_area .priceJJ .gachan span{font-weight: 300;font-size: 18px;}
#popular_area .img_nav li {margin: 0 15px;position: relative;}
#popular_area li .couseeJ{border-radius: 10px;background: #f8f8f8;}
#popular_area .img_nav .img_show { margin: 0 10px 0; }
#popular_area .img_nav img { aspect-ratio: 3 / 2; object-fit: cover; width: 100%; }
#popular_area .img_box li { position: relative; margin: 10px; }
#popular_area .img_box li .txtitems { margin-top: 26px; }
#popular_area .img_box li .txtitems h2 { font-size: 29px; height: 44px; }
#popular_area .img_box li .txtitems article { font-size: 19px; }
#popular_area .img_box li .txtitems .btn { margin-top: 50px; font-size: 18px; }
#popular_area .img_box li .txtitems .btn::after { left: 102px; top: 4px; }
#popular_area .img_box li .info_box .Img img { aspect-ratio: 2.7 / 2.2; }

.productbtn { display: flex; justify-content: space-between; align-items: center; }

#product_prev svg { -webkit-transform: scaleX(-1); transform: scaleX(-1); position: relative; }
#product_prev, #product_next { -webkit-box-shadow: 0px 10px 10px 2.4px rgb(184 190 196 / 31%); box-shadow: 10px 10px 20px 2.4px rgb(192 192 192 / 60%); border-radius: 150px; }
#product_prev svg, #product_next svg {width: 35px;height: 35px;fill: white;display: flex;flex-direction: column;align-items: center;justify-content: center;background-color: #a6a6a6;border-radius: 150px;padding: 20px;}
#product_next svg {background-color: #3e3e3e;fill: var(--white);}
#product_prev:hover, #product_next:hover{box-shadow: 2px 1px 20px 2.4px rgb(192 192 192 / 60%);transform: scale(0.95);}
/* product_area */
#product_area { overflow: hidden; background-image: url(/images/39/img-all-Bg.png); background-repeat: no-repeat; padding: 5vw 0 3vw; }
#product_area .plist { margin: 120px 20px 80px; }
#product_area .product_tab .tab_row { position: absolute; pointer-events: none; top: 0; opacity: 0; }
#product_area .product_tab .tab_row.active { position: relative; pointer-events: auto; opacity: 1; }
#product_area::before { content: ''; position: absolute; height: 470px; width: calc(100% - 130px); top: 0px; left: 0px; background: url(/images/39/img-p-bg.png) no-repeat center / cover; background-position: 100% 0%; background-size: cover; opacity: 1; z-index: 1; }
#product_area::after { content: ''; position: absolute; height: 400px; width: calc(100% - 130px); top: 70px; right: 0px; background: #fff; background-position: 100% 0%; background-size: cover; opacity: 1; z-index: 0; }
#product_area .productBG { content: ''; position: absolute; height: 74%; width: calc(100% - 130px); top: 300px; right: 0; background: #ffffff; opacity: 1; z-index: 3; border-radius: 50px 0 0 0; }
#product_area .title_box .page_title { color: var(--complement); }
#product_area .title_box font:first-child, #product_area .title_box .noteBox { color: var(--white); }
#product_area .title_box .page_title::after { background-color: var(--complement); }
#product_area .producttbox { display: grid; grid-template-columns: 1fr 500px; gap: 20px 20px; align-items: center; margin: 0 20px; }
.mainClassBox .classLink { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px 20px; }
.mainClassBox .classLink li { position: relative; cursor: pointer; overflow: hidden; background-color: var(--white); display: inline-block; border-radius: 50px; text-align: center; padding: 10px; }
.mainClassBox .classLink li span { color: var(--primary); font-size: 18px; font-weight: 600; letter-spacing: 2px; }
.mainClassBox .classLink li span.pageBefore { display: none; }
.mainClassBox .classLink li.active .Trigger { color: var(--white); }
.mainClassBox .classLink li.active { background-color: var(--complement); }
.mainClassBox .classLink li:hover { background-color: var(--complement); }
.mainClassBox .classLink li:hover span { color: var(--white); }
#product_area .productList { display: grid; grid-template-columns: repeat(4, 1fr); gap: 50px 35px; }
#product_area .productList .Img_box { overflow: hidden; border-radius: 20px; position: relative; }
#product_area .productList .Img_box a { position: relative; }
#product_area .productList .objectLabel { position: absolute; z-index: 10; top: 0; left: 0; padding: 6px 16px; color: #fff; background-color: var(--primary); font-weight: 500; letter-spacing: 1px; font-size: 17px; }
#product_area .txt_box .price { display: flex; align-items: baseline; justify-content: space-between; margin-top: 10px; }
#product_area .txt_box .number { color: #3b3b3b; letter-spacing: 1px; }
#product_area .txt_box .price font { display: flex; align-items: baseline; position: relative; }
#product_area .txt_box .price font::after { content: ""; display: block; width: 1px; height: 20px; background: var(--primary); position: absolute; left: -20px; top: 15px; opacity: .5; }
#product_area .txt_box .price font b { color: var(--primary); font-size: 29px; }
#product_area li:hover .Img_box:after { top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
#product_area li .Img_box:after { content: ""; position: absolute; background: #103725; width: 150%; padding-top: 100%; border-radius: 50%; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); left: 50%; top: 100%; opacity: 0.4; -webkit-transition: all 0.3s 0.05s ease-in-out; transition: all 0.3s 0.05s ease-in-out; }



#tabs_container .tab_content { display: flex; flex-direction: column; align-items: center; position: relative; }
#tabs_container .tab_content .photo { aspect-ratio: 1 / 1; height: 340px; }
#tabs_container .tab_content .photo .img_cover { aspect-ratio: 1/ 1; object-fit: contain; }
#tabs_container .aboutlogo { position: absolute; right: 29%; top: 200px; aspect-ratio: 1 / 1; height: 110px; }
#tabs_container .tab_content .tt { display: flex; flex-direction: column; align-items: center; margin-top: 10px; }
#tabs_container .tab_content .tt h4 { font-size: 32px; letter-spacing: 2px; position: relative; margin-bottom: 30px; }
#tabs_container .tab_content .tt h4::after { position: absolute; content: ""; width: 40px; height: 3px; background-color: #fff; bottom: -15px; left: 50%; transform: translate(-50%, -50%); }
#tabs_container .tab_content .tt h4 span { vertical-align: baseline; }
#tabs_container .tab_content .tt p { font-size: 18px; letter-spacing: 1px; margin-bottom: 30px; }
#tabs_container .tab_content .tt .more_btn { font-size: 13px; position: relative; overflow: hidden; background-color: var(--white); display: inline-block; border-radius: 50px; color: #398f53; padding: 10px 40px; }
#tabs_container .tab_content .tt .more_btn:hover { background-color: var(--complement); color: var(--white); }


/*NewsBox*/
#NewsBox{position:relative;background: url(/images/39/nwe_bg.jpg);padding: 20px 0 300px;}
#NewsBox:before{content:"";background:url("/images/39/nwtitle_bg.png");position: absolute;top: 0;width: 100%;aspect-ratio: 1905/214;background-size: contain;background-position: 50% 50%;}
#NewsBox .i_got_you{position:absolute;right:0;top: -95px;width: 15vw;}
#NewsBox .slick-slider{position:relative;margin: 130px 0 20px;}
#NewsBox .slick-list{padding:20px 0}
#NewsBox ul.slick-slider li{position: relative;display:flex;flex-direction: column;margin: 0 10px;border-radius: 10px;box-shadow: 4.24px 2.65px 16px 0px rgba(207, 207, 207, 0.5);background: var(--white);}
#NewsBox ul.slick-slider li .imgJ_box{position: relative;overflow:hidden;display: flex;border-radius: 10px 10px 0 0;}
#NewsBox ul.slick-slider li .imgJ_box img{aspect-ratio: 4.5 / 3;object-fit: cover;}
.
#NewsBox ul.slick-slider li:before{content:"";background:url("/images/39/listJJ_img.png");width: 28px;aspect-ratio: 14/17;background-size: cover;top: -10px;position: absolute;right: 5%;z-index: 5;}
#NewsBox .textJ_box{display:grid;grid-template-columns: 15% 85%;}
#NewsBox .textJ_box .text_Jleft{display:flex;flex-direction: column;align-items: center;justify-content: center;}
#NewsBox .textJ_box .text_Jleft div{font-size: 1.7rem;font-weight: 700;}
#NewsBox .textJ_box .text_Jleft span{width: 1px;height: 10px;background: #808080;}
#NewsBox .textJ_box .text_Jright{padding:20px;}

#NewsBox .textJ_box .JJnwtitle{font-size: 20px;color: var(--info);overflow: hidden;margin: 10px 0;height: 36px;font-weight: 700;text-align: left;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
#NewsBox .textJ_box .JJnwinfo{font-size: 16px;color: var(--info);overflow: hidden;margin: 10px 0;height: 46px;line-height: 1.5;font-weight: 400;text-align: left;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}

/* custom_area */
#custom_area { padding: 5vw 0 0; }
#custom_area .titleitem { position: absolute; right: 0; z-index: 0; top: 50%; left: 25%; transform: translate(-50%, -50%); background-color: #ebf0ef; padding: 50px 40px; width: 360px; border-top: 10px solid #00a040; }
#custom_area .titlep2 font { color: var(--triadic1); }
#custom_area .titlep2 font:first-child { color: var(--info); }
#custom_area .Img { text-align: right; }
#custom_area .more_btn { font-size: 16px; background-color: var(--complement); display: inline-block; border-radius: 50px; padding: 8px 30px; }
#custom_area .more_btn svg { fill: var(--white); width: 20px; height: 20px; position: relative; padding-left: 26px; }
#custom_area .more_btn:hover svg { -webkit-filter: unset; filter: unset; -webkit-animation: arrRight 0.8s ease-in-out infinite; animation: arrRight 0.8s ease-in-out infinite; }

#custom_area .left { margin-bottom: 30px; }

@-webkit-keyframes rotate { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } }
@keyframes rotate { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
@-webkit-keyframes loop { to { -webkit-transform: translateX(-100%); transform: translate(-100%); } }
@keyframes loop { to { -webkit-transform: translateX(-100%); transform: translate(-100%); } }
@-webkit-keyframes arrRight { 0%, 100% { -webkit-transform: translate(0, 0%); } 50% { -webkit-transform: translate(15px, 0%); } }
@keyframes arrRight { 0%, 100% { transform: translate(0, 0%); } 50% { transform: translate(15px, 0%); } }

@media screen and (max-width:1680px) {
	#product_area::before { width: calc(100% - 60px); }
	#product_area .productBG { width: calc(100% - 40px); top: 260px; }
	section .title_box { margin-bottom: 0; }
}
@media screen and (max-width:1560px) {
	section .title_box font { font-size: 38px; }
	section .title_box .page_title { font-size: 20px; }
	section .title_box .page_title::after { height: 3px; }
	section .title_box .noteBox { font-size: 18px; }
	
	#product_prev svg, #product_next svg { width: 28px; height: 28px; }
	#popular_area .title_box { grid-template-columns: 1fr 150px; margin: 0 20px 40px; }
	#popular_area {padding: 6vw 0 4vw 0;}
}
@media screen and (max-width:1470px) {
	.cop_title::before{width:25px;left: -46px;}
	.centertitle.cop_title{padding-top: 30px;}
	.centertitle.cop_title:before{top: -8px;}
	#popular_area .img_nav li{margin: 0 8px;}
	#popular_area #JaJatext{right: -29rem;top: -9rem;}
	#popular_area .img_box li .txtitems { margin-top: 20px; }
	#popular_area .img_box li .txtitems h2 { font-size: 24px; height: 44px; }
	#popular_area .img_box li .txtitems article { font-size: 18px; }
	#popular_area .img_box li .txtitems .btn { margin-top: 50px; font-size: 12px; }
	#popular_area .img_box li .txtitems .btn::after { left: 85px; height: 17px; }
	#popular_area li .txtitems .btn svg { width: 16px; height: 16px; }
	#popular_area li .info_box .price font b, #product_area .txt_box .price font b { font-size: 20px; }
	#popular_area li .info_box .price font, #popular_area li .info_box .price .number { font-size: 14px; letter-spacing: 0.5px; }
	#popular_area li .txtitems .h2, #product_area .txt_box .InfoList .h2 { font-size: 18px; }
	#popular_area li .txtitems article, #product_area .txt_box .InfoList article { font-size: 15px; margin: 4px 0 0; }
	#popular_area li .txtitems .btn { font-size: 12px; margin-top: 10px; }
	#popular_area .title_box { grid-template-columns: 1fr 140px; }
	#product_prev svg, #product_next svg { width: 20px; height: 20px; }
	#headBan #search_box { --search-w: 1200px; bottom: -24%; }
}
@media screen and (max-width:1366px) {
	#product_area .txt_box .price font::after { top: 4px; }
}
@media screen and (min-width:1281px) {
	.more_btn.white a:hover font { color: #fff; }
	.more_btn.white a:hover { width: 150px; }
}
@media screen and (max-width:1280px) {
	section .title_box { margin-bottom: 0; }
	section .title_box font { font-size: 32px; }
	section .title_box .page_title { font-size: 17px; }
	section .title_box .page_title::after { height: 2px; }
	section .title_box .noteBox { font-size: 16px; }
	#product_area .producttbox { grid-template-columns: 1fr 360px; }
	#product_area .productBG { top: 220px; }

	
	#aboutTabs { grid-template-columns: 1fr 200px; gap: 20px 10px; }
	#tabs_container .aboutlogo { top: 130px; right: 20%; height: 80px; }
	#tabs_container .tab_content .photo { height: 200px; }
	#tabs_container .tab_content .tt h4 { font-size: 26px; }
	#tabs_container .tab_content .tt p { font-size: 15px; }
	#NewsBox:before{display:none;}
}

@media screen and (max-width: 1200px) {
	#product_prev svg, #product_next svg {width: 15px;height: 15px;padding: 15px;}
	.productbtn{gap:10px;}
	#custom_area .titleitem { padding: 30px 20px; width: 270px; left: 26%; }
	#custom_area { padding: 15vw 0 0; }
	#popular_area .list_box #imglist { grid-template-columns: 100% 0; gap: 0; }
	#popular_area .list_box #imglist .rightbox { display: none; }
	#popular_area .title_box {width: auto;display: flex;align-items: flex-start;margin: 0 10px 30px;}
	#product_area::before { width: calc(100% - 30px); }
	#product_area .productBG { width: calc(100% - 20px); }
	#product_area .productList #objectLabel { font-size: 14px; }
	#product_area .productList { gap: 30px 30px; grid-template-columns: repeat(2, 1fr); }
}

@media screen and (max-width:1160px) {
	.cop_title{left: 45px;}
	.centertitle.cop_title{left: unset;}
}
@media screen and (max-width:1024px) {
	section .title_box .page_title { font-size: 15px; }
	section .title_box .page_title::after { height: 2px; }
	#about_area{padding-bottom: 200px;}
	#about_area .two_a_box{gap:50px;}
	#product_area .plist { margin: 100px 20px 30px; }
	#product_area::before { width: calc(100% - 10px); }
	#product_area .productBG { width: calc(100% - 10px); height: 89%; }
	#product_area .producttbox { grid-template-columns: 1fr 290px; }
	.mainClassBox .classLink li span { font-size: 16px; }
	.mainClassBox .classLink { gap: 10px 10px; }
}
@media screen and (max-width:960px) {
	.cooimg:before{width: 26vw;top: -1vw;left: -2vw;}
	#popular_area { padding: 5vw 0; }
	#popular_area .img_nav li { margin: 0 10px; }
	#popular_area li .info_box .price { width: calc(100% - 20px); padding: 10px 10px; }
	#popular_area li .info_box .price font, #popular_area li .info_box .price .number { font-size: 12px; }
	#popular_area li .info_box .price font b, #product_area .txt_box .price font b { font-size: 18px; }
	
	#headBan #search_box { position: relative; margin: 0 auto 50px; width: min(93%, var(--search-w)); bottom: 0; }
	#headBan #search_box .search_container { border-radius: 0; }
	#NewsBox .slick-slider{margin: 80px 0 20px;}
}

@media screen and (max-width:760px){
	#NewsBox{padding: 80px 0 400px;}
	#NewsBox .i_got_you{display:none;}
}
@media screen and (max-width:640px) {
	#about_area{padding-bottom: 100px;}
	#custom_area { padding: 50vw 0 0; }
	#custom_area .titleitem { left: 50%; top: 24%; padding: 20px 20px; width: 310px; }
	#custom_area .Img { margin-left: auto; text-align: right; }
	#custom_area .Img img { width: 940px; aspect-ratio: 4 / 3; object-fit: cover; object-position: 80% 50%; }
	#custom_area { padding: 60vw 0 0; }
	#custom_area .titleitem { top: 26%; }
	#product_area .producttbox { grid-template-columns: 1fr; }
	#product_area .producttbox .title_box { display: flex; flex-direction: column; align-items: center; }
	#product_area .title_box .noteBox { text-align: center; }
	#product_area .productBG { top: 260px; height: 82%; }
	#product_area .plist { margin: 70px 20px 40px; }
	#product_area .productList { gap: 20px 10px; }
	#product_area .txt_box .number { font-size: 12px; }
	#product_area .txt_box .price font::after { left: -10px; }
	#popular_area li .info_box .price font b, #product_area .txt_box .price font b { font-size: 16px; }
	#popular_area #JaJatext , #popular_area:before , .ballJ_box{display:none;}
	#product_prev:hover, #product_next:hover{box-shadow: 2px 1px 6px 2.4px rgb(192 192 192 / 60%);}
	#aboutTabs { grid-template-columns: 1fr; gap: 80px; }
	#tabs_container .tab_content .photo { height: 150px; }
	#tabs_container .aboutlogo { height: 60px; top: 90px; right: 25%; }
}
@media screen and (max-width:500px) {
	#headBan #search_box { margin-top: 0; }
}
@media screen and (max-width:450px) {
	#custom_area { padding: 75vw 0 0; }
}