/* index.less */
#product_area.list_box ul li { transform: translate(0,0); -webkit-transform: translate(0,0) }
@media(min-width:1281px) {
  #product_area.list_box ul li:hover { transform: translate(0,-20px); -webkit-transform: translate(0,-20px) }
}
#book_area.list_box li.img_box:before,#book_area.list_box li.img_box:after { transform: scaleY(0); -webkit-transform: scaleY(0) }
#book_area.list_box li.img_box:after { transform-origin: center bottom; -webkit-transform-origin: center bottom }
@media(min-width:1281px) {
  #book_area.list_box li:hover.img_box:before,#book_area.list_box li:hover.img_box:after { transform: scaleY(1); -webkit-transform: scaleY(1) }
}
#youtube_box a { width: 83px; height: 83px; border-radius: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -webkit-animation: spineer 2s infinite; animation: spineer 2s infinite }
#wrap { z-index: 2; position: relative; width: 100vw; }
.midtexrb img { animation: rotate3 8s ease-in-out infinite; transform-origin: 100% 100%; }
@keyframes rotate3 {
  0%,100% { transform: rotate(30deg); }
  50% { transform: rotate(-10deg); }
}
/* search_box */
#openform { background: rgba(var(--white-rgb),.3) }
section>* { z-index: 3 }
section .title_box { margin-bottom: 30px }
section .title_box .area_title { font-weight: 400; font-size: max(1.2*(1vw + 1vh)/2,21px); line-height: 100%; color: #898989 }
section .title_box .sub_title { font-weight: 300; font-size: max(3.7*(1vw + 1vh)/2,37px); color: #898989; text-transform: uppercase }
.webBox .hanJ01  .pageh1 { position: relative; animation: unset; top: auto; font-size: max(1.4*(1vw + 1vh)/2,18px); font-weight: 400; display: flex; align-items: center; gap: 7px; justify-content: flex-start; margin-bottom: 0px; z-index: 2; }
/* bg_box */
.bg_box { width: 100%; height: 100%; background: no-repeat 50%/cover; background-attachment: fixed; opacity: .3; top: 0; left: 0 }
.bg_box:before { width: 100%; height: 100%; display: block; background: rgb(255 255 255/20%); content: "" }
.bg_box.white:before { background: rgba(var(--white-rgb),.2) }
.ml11,.ml112 { position: relative; font-weight: 700; text-align: center; opacity: 0 }
.ml11 .text-wrapper,.ml112 .text-wrapper { position: relative; display: inline-block }
.ml11 .line,.ml112 .line { opacity: 0; position: absolute; left: 0; height: 70%; width: 1px; background-color: #4d4d4d; transform-origin: 0 50% }
.ml11 .line1,.ml112 .line { top: 15%; left: 0 }
.ml112 .line { transform: translateX(0) }
.ml11 .line1 { display: none }
.ml11 *,.ml112 * { transition: all 0s ease-in-out; -webkit-transition: all 0s ease-in-out }
.letters { display: flex; width: 100%; justify-content: center }
.ml11 .letter,.ml112 .letter { display: inline-block }
.ml112 .letter { opacity: 0 }
.mamatitle { display: flex; justify-content: space-between }
.mamatitle .leftm { display: flex; align-items: center }
.mamatitle .leftm p { font-size: max(1.9*(1vw + 1vh)/2,21px); border-bottom: #484848 1px solid; line-height: 110% }
.mamatitle .leftm span { font-size: max(3.1*(1vw + 1vh)/2,20px); margin: 0 25px }
.mamatitle .leftm b { font-weight: 200; font-size: max(1.3*(1vw + 1vh)/2,15px) }
.mamatitle .rightm { display: flex; align-items: center; margin-right: -5% }
.mamatitle .rightm img { width: 50px }
.mamatitle .rightm span { position: relative; display: flex; width: 280px; height: 1px; background: #d4d4d4; margin-right: 15px }
/*top_Jtitle*/
.top_Jtitle { display: flex; flex-direction: column; align-items: center; }
.top_Jtitle .totle { font-size: 2.8rem; font-weight: 600; color: white; }
.top_Jtitle .tosub { font-size: 1.5rem; color: white; }
.top_Jtitle .onJline { display: flex; flex-direction: column; align-items: center; }
.top_Jtitle .onJline span { width: 10px; display: flex; aspect-ratio: 1/1; background: var(--secondary); border-radius: 666px; position: relative; justify-content: center; align-items: center; }
.top_Jtitle .onJline span:before { content: ""; position: absolute; width: 300px; height: 1px; background: var(--secondary); transform: scaleX(0); transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; }
.top_Jtitle .onJline.aos-animate span:before { transform: scaleX(1); transform-origin: center; transition-delay: 1.2s; }
/*Jamore*/
.Jamore { display: flex; }
.Jamore a { display: flex; align-items: center; padding: 20px 30px; border-radius: 300px; border: #959595 1px solid; justify-content: space-between; width: 230px }
.Jamore a:hover { background: var(--primary) }
.Jamore a:hover span { color: white }
.Jamore a:hover svg { fill: white }
.Jamore a span { font-weight: 500 }
.Jamore a svg { width: 20px }
.maloogo { position: absolute; right: 5%; bottom: 0 }
.maloogo.boo2 { bottom: auto; top: 0 }
/* 波浪容器：由上往下掉落 (z-index:2) */
#wave-drop-section { position: relative; width: 100%; height: 0; z-index: 2; overflow: visible; }
#wave-drop-section .wave-svg-container { position: absolute; left: 0; top: -160px; width: 100%; height: 100px; pointer-events: none; opacity: 0; transform: translateY(-178px); transition: transform 2.6s cubic-bezier(0.19,1,0.22,1),opacity 2s ease; }
#wave-drop-section .wave-svg-container.is-active { transform: translateY(0); opacity: 1; }
#wave-drop-section .wave-svg-container:before { content: ""; width: 100%; position: absolute; height: 200px; background: #f2b92d; bottom: -199px; }
/* SVG 樣式規範執行 (單行模式) */
#wave-drop-section .under-waves { display: block; width: 100%; height: 100px; margin: 0; position: absolute; bottom: 0; }
#wave-drop-section .wave1 use { animation: move-forever1 0s linear infinite; animation-delay: -2s; fill: rgba(242,185,45,0.3); }
#wave-drop-section .wave2 use { animation: move-forever2 0s linear infinite; animation-delay: -2s; fill: rgba(242,185,45,0.5); transform: translate(104px,0%); }
#wave-drop-section .wave3 use { animation: move-forever3 0s linear infinite; animation-delay: -2s; fill: #f2b92d; }
/* 動畫關鍵影格 */
@keyframes move-forever1 {
  0% { transform: translate(85px,0%); }
  100% { transform: translate(-90px,0%); }
}
@keyframes move-forever2 {
  0% { transform: translate(-90px,0%); }
  100% { transform: translate(85px,0%); }
}
@keyframes move-forever3 {
  0% { transform: translate(-90px,0%); }
  100% { transform: translate(85px,0%); }
}
#about_area { padding: 0px 0 60px; display: flex; flex-direction: column; z-index: 20; overflow-y: visible; align-items: center; background: #e4d3a7; padding: 140px 0 160px; }
#about_area .JJtitle { margin-bottom: 0; }
#about_area:before { content: ""; width: 22vw; opacity: 1; right: -4vw; z-index: 1; position: absolute; bottom: 31%; aspect-ratio: 432/313; background: url(/images/40/down_bg.png); background-size: contain; background-repeat: no-repeat; animation: sway2 4s linear infinite; }
#about_area:after { content: ""; width: 6vw; opacity: 1; right: 45vw; z-index: 1; position: absolute; bottom: 13%; aspect-ratio: 1/1; background: url(/images/40/fomlum.png); background-size: contain; background-repeat: no-repeat; }
#about_area .workframe { display: grid; grid-template-columns: 46% 47%; gap: 7%; margin: 0; margin-top: 0; align-items: center; z-index: 2; overflow-y: visible; }
.laJtext { position: absolute; width: auto; height: 100%; left: -4%; top: 20px; webkit-writing-mode: vertical-rl; writing-mode: vertical-rl; display: flex; flex-direction: row; align-items: center }
.laJtext span { position: relative; display: flex; width: 1px; height: 90px; background: #757575 }
.laJtext.boo2 { right: -4%; left: auto }
.Jterightbox .cnlittle::after { display: none; }
#flypaper03 { bottom: 2%; right: -5%; }
#flypaper03 * { transition: all 0s ease-in-out; -webkit-transition: all 0s ease-in-out; }
#flypaper03 img { width: 17.5vw; }
.rigthJJufoimg { position: absolute; right: 0; z-index: 5; }
.rigthJJufoimg img { position: relative; width: 21vw; right: -18px; margin-top: -17vw; }
.count_us { position: absolute; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 278px; aspect-ratio: 1/1; bottom: 5vw; left: 15.5vw; z-index: 6 }
.count_us a { position: absolute; width: 100%; height: 100%; z-index: 5 }
.count_us p { color: #3f3f3f; line-height: 120% }
.count_us .couitem_boo { position: absolute; display: flex; flex-direction: column }
.count_us .couitem_boo img { aspect-ratio: 1/1; min-height: unset }
.count_us .couitem_boo.moJ1 img { animation: rotateJ 9s linear infinite }
.count_us .couitem_boo.moJ2 img { animation: rotateJ2 5s linear infinite }
/*tQtitle_area*/
#tQtitle_area { width: min(980px,90%); margin: 0 auto; display: flex; align-items: center; position: relative; z-index: 1; gap: 25px; }
#tQtitle_area .mootbox { position: relative; font-size: max(5*(1vw + 1vh)/2,35px); line-height: 120%; font-weight: 700; margin-bottom: 50px }
#tQtitle_area .mootbox .motext { position: absolute; bottom: 21px; left: 50%; font-weight: 400; font-size: max(1.4 * (1vw + 1vh)/2,18px) }
#tQtitle_area .mootbox.aos-animate .motext { -webkit-animation: clipPathAni 0.8s ease-in-out 0.8s both; animation: clipPathAni 0.8s ease-in-out 0.8s both; }
@keyframes clipPathAni {
  0% { opacity: 0; -webkit-clip-path: inset(0 100% 0 0); clip-path: inset(0 100% 0 0); }
  100% { opacity: 1; -webkit-clip-path: inset(0 0 0 0); clip-path: inset(0 0 0 0); }
}
.dwdwtext { background-repeat: repeat-x; background-image: url(/images/40/artmruning.png); animation: bgroop 100s linear infinite; position: absolute; height: 3rem; width: 130vw; bottom: 50px; z-index: 5; left: -26vw; background-size: cover }
@keyframes bgroop {
  from { background-position: 0 0; }
  to { background-position: -4469px 0; }
}
@keyframes bigsmall {
  0% { transform: scale(1); }
  50% { transform: scale(1.1); }
  100% { transform: scale(1); }
}
#about_area .maJimg { position: relative; display: flex; margin-bottom: 15px; flex-direction: column; align-items: center; margin-left: 0; overflow: visible; }
#about_area .maJimg a { object-fit: cover; display: flex; width: 100%; position: relative; transition: all 0s ease-in-out; -webkit-transition: all 0s ease-in-out; }
#about_area .maJimg img { border-radius: 0; z-index: 2; position: relative; margin: 0; width: 100%; object-fit: cover; width: min(617px,100%); animation: float 5s linear infinite; }
#about_area .maJimg:before { content: ""; position: absolute; width: 24vw; background: url(/images/40/animal.png); aspect-ratio: 443/385; top: -86px; z-index: 0; left: -20vw; background-size: contain; background-repeat: no-repeat; transform-origin: right bottom; animation: sway2 5s linear infinite; }
#about_area .maJimg:after { content: ""; position: absolute; width: 5vw; background: url(/images/40/flyiom.png); right: 0; top: 15%; aspect-ratio: 19/16; background-size: contain; background-repeat: no-repeat }
#about_area .maJinfoo { position: relative; display: flex; justify-content: flex-start; padding-left: 0; margin-bottom: 0vw; margin-top: 0px; margin-bottom: 150px; }
#about_area .maJinfoo:before { content: ""; background: url(/images/40/shake.png); aspect-ratio: 125/81; width: 9vw; position: absolute; right: -6vw; top: -7vw; background-position: 50%; background-repeat: no-repeat; background-size: contain; animation: sway 3s linear infinite; }
#about_area .maJinfoo .tctextbox { width: min(650px,90%); margin-left: 0; display: flex; flex-direction: column; }
#about_area .maJinfoo .tctextbox .row { width: 100%; margin-right: 0; margin-left: 0; }
#about_area .maJinfoo .tctextbox .row .col-md-12 { padding-right: 0; padding-left: 0; }
#about_area .maJinfoo .tctextbox .JJtitle { display: flex; align-items: flex-start; margin-left: 76px; }
#about_area .boomJJ { position: relative; display: flex; align-items: flex-end; margin-bottom: 3vw; }
#about_area .topmvan h3 { font-weight: 500; font-size: max(1.6*(1vw + 1vh)/2,21px); text-transform: uppercase; color: #363636; line-height: 140% }
#about_area .VCRtop p { overflow: hidden; height: 65px; width: 90%; text-align: left; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 16px; font-weight: 400; color: #1e1e1e; margin: 2vw 0 3vw; }
#benefit_area { box-shadow: 0 -9px 12px rgb(110 110 110/15%) }
#benefit_area .footenbox { position: relative; padding: 46px 105px 240px; border-radius: 0 0 110px 0; background: #efefef; margin-left: 13vw }
#benefit_area .footenbox:before { content: ""; position: absolute; width: 26vw; height: 100%; background: var(--secondary); left: -26vw; top: 0 }
#benefit_area .footenbox:after { content: ""; position: absolute; width: 75vw; height: 100%; top: 0; left: 0; z-index: -1; border-radius: 0 0 110px 0; background: #efefef }
#about_area .bigtitle { display: flex; gap: 10px; padding: 25px 0 }
#about_area .bigtitle * { font-size: max(3.4 * (1vw + 1vh)/2,27px); }
.tminfo { margin-left: 35px }
.tminfo .ssatext { overflow: hidden; height: 3.5rem; font-size: 1rem; width: 100%; text-align: left; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-weight: 300; color: #1e1e1e }
.mabouttitle { margin-bottom: 30px; position: relative; padding-bottom: 20px }
.balltitle { position: relative }
.balltitle:before { content: ""; position: absolute; width: 25px; aspect-ratio: 1/1; background: var(--complement); border-radius: 666px; left: -30px; top: -31px; }
.mabouttitle:after { content: ""; position: absolute; bottom: 0; background: var(--complement); width: 80px; height: 5px; }
.mabouttitle * { color: var(--complement); }
.mabouttitle .hanJ01 { font-size: 4.5rem; line-height: 100%; font-weight: 800; }
.mabouttitle p { font-size: 1.25rem }
.mabouttitle .bigJ { font-size: 2.9rem; font-weight: 600 }
.mabouttitle .bigJ.aos-animate { -webkit-animation: clipPathAni 0.8s ease-in-out 1s both; animation: clipPathAni 0.8s ease-in-out 1s both }
.tctextbox h1 { color: var(--complement); font-size: 1.5rem; font-weight: 300; margin-bottom: 40px }
/*ceeservice*/
.ceeservice { position: absolute; margin-top: -300px; }
.ceeservice:before { content: ""; background: url(/images/40/linwaveJJ.png); position: absolute; width: 100%; aspect-ratio: 60/7; margin-top: 118px; animation: verticalSquash 5.2s ease-in-out infinite; transform-style: preserve-3d }
@keyframes verticalSquash {
  0%,100% { transform: scaleY(1); }
  50% { transform: scaleY(0.6); }
}
/*mdexenJ*/
#benefit_area .mdexenJ { position: relative; display: grid; grid-template-columns: 24% 24% 24% 24%; gap: 1%; justify-content: space-between; z-index: 2; margin-top: -140px }
#benefit_area .mdexenJ .mdenitem { aspect-ratio: 1/1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 20px }
#benefit_area .mdexenJ .mdenitem img { width: 84px; margin-bottom: 15px }
#benefit_area .mdexenJ .mdenitem h3 { font-size: max(1.6*(1vw + 1vh)/2,15px); margin-bottom: 10px }
#benefit_area .mdexenJ .mdenitem * { color: #fff }
#benefit_area .mdexenJ .mdenitem.Jmd01 { background: url(/images/40/down_bg-1.jpg) }
#benefit_area .mdexenJ .mdenitem.Jmd02 { background: url(/images/40/down_bg-2.jpg) }
#benefit_area .mdexenJ .mdenitem.Jmd03 { background: url(/images/40/down_bg-3.jpg) }
#benefit_area .mdexenJ .mdenitem.Jmd04 { background: url(/images/40/down_bg-4.jpg) }
/*sideflyJJ*/
.sideflyJJ { position: absolute }
.sideflyJJ.sebox01 { top: -21vw; left: -4vw; width: 45vw; z-index: 0; }
.sideflyJJ.sebox02 { right: -4vw; bottom: -15vw; width: 39vw; z-index: 0; }
.sideflyJJ img { height: auto; min-height: auto; aspect-ratio: 1/1; animation: spin 10s linear infinite; }
.sideflyJJ.sebox03 { right: 25vw; top: -2vw; width: 9vw; z-index: 6 }
.sideflyJJ.sebox07 { left: 0 }
.sideflyJJ.sebox07 img { width: 18vw }
.sideflyJJ.sebox08 img { width: 17vw }
.sideflyJJ.sebox08 { right: 0; bottom: 20vw }
.sideflyJJ.sebox04 { right: 3vw; margin-top: -5vw; }
@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
/*doctorpicbox*/
#doctorpicbox { position: relative; display: flex; flex-direction: column; align-items: center; padding: 15px 0; }
#doctorpicbox .arrow_btns_box { width: 30vw; display: flex; flex-direction: row; justify-content: space-between; margin: 0 auto; position: absolute; top: 130px }
#doctorpicbox .workframe { width: 100%; }
#doctorpicbox .boomJJ .workframe { display: flex; flex-direction: column; align-items: center }
#doctorpicbox .doumbox { display: flex; flex-direction: column; align-items: center; margin: 0 7px; }
#doctorpicbox .doumbox img { border-radius: 0; }
#doctorpicbox .doumbox p { color: #5e798a; font-size: max(1.3*(1vw + 1vh)/2,17px); font-weight: 500; padding: 10px 0 }
.lusanline { position: relative; height: 2px; border-bottom: #dcdcdc 1px solid; margin-right: 12vw }
.lusanline span { width: 50px; height: 3px; background: #116537; display: flex }
.lusancall { display: flex; margin-left: 140px }
.lusancall svg { width: 38px; fill: #595959; margin-right: 20px }
.lusancall span { font-size: max(3.6*(1vw + 1vh)/2,26px); color: #595959; font-family: "Cinzel Decorative",serif; font-weight: 700 }
/*philosophy_area*/
#philosophy_area { padding: 100px 0 50px; background-image: url(/images/40/philosophy_area_bg.jpg); background-repeat: no-repeat; background-size: cover; background-position: 50% 50% }
#philosophy_area:before { content: ""; position: absolute; background: url(/images/40/in-ball.png); width: 60px; aspect-ratio: 1/1; left: 13%; top: -2%; background-repeat: no-repeat; background-size: contain; animation: float 3s ease-in-out infinite; z-index: 2 }
#philosophy_area:after { content: ""; position: absolute; background: url(/images/40/in-ball.png); width: 60px; aspect-ratio: 1/1; right: 17%; bottom: -2%; background-repeat: no-repeat; background-size: contain; animation: float 3s ease-in-out infinite; z-index: 2 }
#philosophy_area .JJtitle { display: flex; flex-direction: column; align-items: center }
#philosophy_area .coomcebox { display: flex; flex-direction: column; align-items: center; margin: 0 auto; margin-bottom: 60px; margin-top: -35px; width: min(1280px,80%) }
.runingtext>div { position: relative; padding: 10px 0; display: flex; text-align: center; transition: all .7s ease-out; -webkit-animation: picture_scroll 40s linear infinite; animation: picture_scroll 20s linear infinite; transform: translateX(0); width: 100%; justify-content: space-between }
.runingtext { display: flex; position: relative; padding: 15px 0; width: 200%; position: absolute; top: 50%; z-index: -1 }
.runingtext .focus { margin: 0 9px }
.clickshow>div { display: none }
.clickshow>div h3 { font-size: 22px; margin-bottom: 10px }
.clickshow>div p { font-size: 16px }
@keyframes picture_scroll {
  from { transform: translateX(0) }
  to { transform: translateX(-50%) }
}
@-webkit-keyframes picture_scroll {
  from { -webkit-transform: translateX(0) }
  to { -webkit-transform: translateX(-100%) }
}
.arrow_btns_box { cursor: pointer; position: relative; z-index: 5; display: flex; gap: 15px; pointer-events: none; }
.arrow_btns_box .slick-arrow.slick-prev { left: unset; position: relative; display: flex; }
.arrow_btns_box .slick-arrow.slick-next { right: unset; position: relative; display: flex; }
.arrow_btns_box .slick-arrow { -webkit-transform: unset; -ms-transform: unset; transform: unset; width: auto; height: auto; }
.arrow_btns_box button { pointer-events: auto; }
.arrow_btns_box .slick-prev:before,.arrow_btns_box .slick-next:before { display: none; }
.arrow_btns_box.ree { left: -1% }
.arrow_btns_box.lee { left: 31% }
.arrow_btns_box .prev svg { -moz-transform: scalex(-1); -webkit-transform: scalex(-1); -o-transform: scalex(-1); -ms-transform: scalex(-1); transform: scalex(-1) }
.arrow_btns_box svg { width: 60px; aspect-ratio: 1/1; background: rgb(255 255 255/0%); border-radius: 0; padding: 18px; fill: #ffffff; border: #ffffff00 1px solid; }
.mmtmore { display: flex }
.mmtmore,.mmtmore * { border-radius: 0; }
.mmtmore a { background: var(--secondary); background: unset; display: flex; color: #5c8537; align-items: center; padding: 2px 10px; font-size: max(1.1*(1vw + 1vh)/2,15px); justify-content: space-between; border-bottom: #5c8537 1.5px solid; border-top: #5c8537 1.5px solid; line-height: 100%; }
.mmtmore a:hover { background: var(--secondary); color: #fff }
.mmtmore a:hover svg { fill: #fff; -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }
.mmtmore a svg { width: 63px; aspect-ratio: 5/3; border-radius: 555px; margin: 2px 0px; padding: 8px; margin-right: 0; fill: var(--secondary); }
.mmtmore a svg path { fill: #5c8537 }
.arrow_btns_box svg { width: 71px; padding: 21px; border-radius: 555px; }
.arrow_btns_box .iconCircle { position: absolute; top: 0; left: 0; width: 75px; height: auto; aspect-ratio: 1/1; display: flex; justify-content: center }
.arrow_btns_box .iconCircle  circle { top: 0; left: 0 }
.arrow_btns_box svg.pathJ { position: relative; z-index: 1; width: 100%; height: 100%; border-radius: 100%; stroke-dasharray: 236; stroke-dashoffset: 236; stroke: rgba(30,84,93,0.2); fill: none; stroke-width: 3px; background: unset; stroke: #ffffff; display: flex; flex-direction: column; align-items: center; justify-content: center; z-index: 0; padding: 0; top: -2px; left: -2px; border: unset }
.arrow_btns_box .slick-arrow:hover svg.pathJ { stroke-dashoffset: 0; fill: none; background: unset }
.arrow_btns_box .slick-arrow:hover svg { background: var(--secondary); fill: #ffffff; }
/*activity-btn-wrapper*/
.activity-btn-wrapper { position: relative; padding: 10px; display: inline-flex; filter: drop-shadow(0 8px 16px rgba(0,0,0,0.4)); transition: filter 0.3s cubic-bezier(0.25,1,0.5,1); cursor: pointer; }
.activity-btn-wrapper:hover { filter: drop-shadow(0 12px 24px rgba(74,16,0,0.6)); }
.activity-btn { position: relative; height: 69px; padding: 0 48px 0 64px; display: flex; align-items: center; justify-content: center; transition: transform 0.3s cubic-bezier(0.34,1.56,0.64,1); }
.activity-btn-wrapper:hover .activity-btn { transform: translateY(-4px) scale(0.99); }
.activity-btn-wrapper:active .activity-btn { transform: translateY(0) scale(0.98); }
.bg-layer { position: absolute; pointer-events: none; border-radius: inherit; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.layer-1 { inset: 0; background: #4A1000; border-radius: 4px 0 0 4px; -webkit-mask: radial-gradient(circle 16px at right 0 top 0,transparent 16px,black 16.5px) top/100% 50% no-repeat,radial-gradient(circle 16px at right 0 bottom 0,transparent 16px,black 16.5px) bottom/100% 50% no-repeat; mask: radial-gradient(circle 16px at right 0 top 0,transparent 16px,black 16.5px) top/100% 50% no-repeat,radial-gradient(circle 16px at right 0 bottom 0,transparent 16px,black 16.5px) bottom/100% 50% no-repeat; }
.layer-2 { inset: 3px; background: #F6BA3B; border-radius: 1px 0 0 1px; -webkit-mask: radial-gradient(circle 19px at right -3px top -3px,transparent 19px,black 19.5px) top/100% 50% no-repeat,radial-gradient(circle 19px at right -3px bottom -3px,transparent 19px,black 19.5px) bottom/100% 50% no-repeat; mask: radial-gradient(circle 19px at right -3px top -3px,transparent 19px,black 19.5px) top/100% 50% no-repeat,radial-gradient(circle 19px at right -3px bottom -3px,transparent 19px,black 19.5px) bottom/100% 50% no-repeat; }
.layer-3 { inset: 4.5px; background: #4A1000; border-radius: 0; -webkit-mask: radial-gradient(circle 20.5px at right -4.5px top -4.5px,transparent 20.5px,black 21px) top/100% 50% no-repeat,radial-gradient(circle 20.5px at right -4.5px bottom -4.5px,transparent 20.5px,black 21px) bottom/100% 50% no-repeat; mask: radial-gradient(circle 20.5px at right -4.5px top -4.5px,transparent 20.5px,black 21px) top/100% 50% no-repeat,radial-gradient(circle 20.5px at right -4.5px bottom -4.5px,transparent 20.5px,black 21px) bottom/100% 50% no-repeat; }
.layer-4 { inset: 7.5px; background: linear-gradient(180deg,#F8C045 0%,#DF9819 100%); border-radius: 0; -webkit-mask: radial-gradient(circle 23.5px at right -7.5px top -7.5px,transparent 23.5px,black 24px) top/100% 50% no-repeat,radial-gradient(circle 23.5px at right -7.5px bottom -7.5px,transparent 23.5px,black 24px) bottom/100% 50% no-repeat; mask: radial-gradient(circle 23.5px at right -7.5px top -7.5px,transparent 23.5px,black 24px) top/100% 50% no-repeat,radial-gradient(circle 23.5px at right -7.5px bottom -7.5px,transparent 23.5px,black 24px) bottom/100% 50% no-repeat; }
.sweep-container { inset: 0; border-radius: 4px 0 0 4px; overflow: hidden; -webkit-mask: radial-gradient(circle 16px at right 0 top 0,transparent 16px,black 16.5px) top/100% 50% no-repeat,radial-gradient(circle 16px at right 0 bottom 0,transparent 16px,black 16.5px) bottom/100% 50% no-repeat; mask: radial-gradient(circle 16px at right 0 top 0,transparent 16px,black 16.5px) top/100% 50% no-repeat,radial-gradient(circle 16px at right 0 bottom 0,transparent 16px,black 16.5px) bottom/100% 50% no-repeat; z-index: 5; }
.light-sweep { position: absolute; top: 0; left: -150%; width: 100%; height: 100%; background: linear-gradient(90deg,transparent,rgba(255,255,255,0.6),transparent); transform: skewX(-25deg); transition: none; pointer-events: none; }
.activity-btn-wrapper:hover .light-sweep { animation: light-sweep 0.8s ease-in-out; }
.activity-dash { color: #4A1000; font-size: 20px; font-weight: 900; letter-spacing: -1px; margin-right: 12px; transform: scaleY(0.8); display: inline-block; font-family: Arial,sans-serif; position: relative; z-index: 10; }
.activity-text { color: #4A1000; font-size: 28px; font-weight: 900; letter-spacing: 4px; text-shadow: 0 1px 1px rgba(255,255,255,0.4); position: relative; z-index: 10; }
@keyframes light-sweep {
  0% { left: -150%; }
  100% { left: 150%; }
}
/*solgon_area*/
#solgon_area { position: relative; padding: 50px 0; background: url(/images/40/solgonbg.jpg); background-attachment: fixed; z-index: 2 }
#solgon_area .pomtext { padding: 50px 0; display: flex; flex-direction: column; align-items: center }
#solgon_area .pomtext img { width: 70px; aspect-ratio: 1/1 }
#solgon_area .pomtext .somainfoo { display: flex; flex-direction: column; align-items: center; padding: 30px 0 }
#solgon_area .pomtext h4 { color: #fff; font-size: max(2*(1vw + 1vh)/2,23px); font-weight: 300 }
#solgon_area .pomtext p { color: #fff; margin-bottom: 20px; font-weight: 200 }
#solgon_area .mmtmore a { background: #ffffff00; border: #ffffffba 1px solid }
#solgon_area .mmtmore a:hover { background: var(--secondary) }
/*maJfixbg*/
.maJfixbg { position: relative; width: 100%; height: 450px; background: url(/images/40/downimg.jpg); background-attachment: fixed; background-size: cover; background-position: 50% 0 }
.maJfixbg .workframe { height: 100% }
.maJfixbg .maJinfo { position: absolute; right: 0; bottom: 7px }
.maJfixbg .maJinfo p { color: #fff }
/* product_area */
#product_area { overflow: visible; max-width: 100vw; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding-bottom: 350px; background-image: url(/images/40/indexproduct_bg.png); background-position: 50% 100%; }
#product_area .arrow_btns_box { display: flex; justify-content: space-between; width: 106%; left: -3%; position: absolute }
#product_area .list_box { display: flex; align-items: center }
#product_area .list_box ul.slick-slider { display: flex; flex-direction: column; width: 100% }
#product_area .bg_box { top: -40%; background: url(/images/40/pog_bg.jpg); opacity: 1; background-position: 50% }
#product_area:before { content: ""; width: 100vw; height: 100%; z-index: 4; position: absolute; top: 0; background: linear-gradient(to bottom,#ffffff,rgb(255 255 255/0%)); }
#product_area .bg_box:before { background: unset }
#product_area:after { content: ""; position: absolute; width: 9vw; aspect-ratio: 196/113; background: url(/images/40/fly_paper02.png); bottom: 15vw; left: 25vw; background-size: contain }
#product_area .inside_amJ { z-index: 6; padding: 100px 0; width: min(92%,1680px) }
#product_area .boomJJ { display: flex; flex-direction: column; align-items: center }
#product_area .slick-list .slick-slide { padding: 20px 0; }
.shpaeline { position: absolute; width: 100%; margin-top: -270px }
.shpaeline img { object-fit: cover }
.Japtab { display: flex; align-items: center; justify-content: center; margin-top: 70px }
.Japtab a { padding: 0 9px; cursor: pointer }
.activJ { border-bottom: #555 2px solid; color: #252525 }
#showJ01 { display: block }
.moreJbox a { display: flex; align-items: center; width: auto; border-bottom: #cfcfcf 1px solid }
.moreJbox a:hover svg { margin-left: 30px }
.moreJbox svg { width: 18px; aspect-ratio: 1/1; margin-left: 10px }
.arrowbox { display: flex; margin-left: 95px }
.arrowbox svg { width: 57px; aspect-ratio: 1/1; padding: 20px; border: #8a8a8a 1px solid; border-radius: 50px; cursor: pointer }
.arrowbox .arrow_btns_box { margin-right: 15px; opacity: .5 }
.arrowbox .arrow_btns_box:hover { opacity: 1 }
.poctopbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 35px }
#product_area .list_box li div { display: flex; flex-direction: column; align-items: center }
.poctopbar .lefcocoJ { display: flex; align-items: center; gap: 15px }
.poctopbar .lefcocoJ .mooline a { display: flex; padding: 10px 25px; background: #5db456; color: white; align-items: center; gap: 14px }
.poctopbar .lefcocoJ .mooline svg { width: 40px; aspect-ratio: 1/1; fill: #ffffff }
/* #newsBox2 */
#newsBox2 { position: relative; background-image: url("/images/40/index_new_bg.jpg"); background-size: cover; padding: 300px 0 400px; margin-top: -200px; z-index: 0; }
#newsBox2 .workframe { z-index: 1; width: 75vw; margin: 0 0 0 8vw; }
#newsBox2:before {content: "";position: absolute;background-image: url("/images/40/putimg.png");aspect-ratio: 35/48;width: 18vw;background-size: cover;right: 0;top: 3vw;z-index: 2;}
#newsBox2 .info .mdmiJJ { display: flex; gap: 5%; align-items: center; max-width: 100%; padding: 30px; }
#newsBox2 .mdJbox02 { display: grid; width: 100%; grid-template-columns: repeat(2,1fr); gap: 50px; }
#newsBox2 .mdJbox02 * { color: white; }
#newsBox2 .nwJJoox { position: relative; display: flex; gap: 20px; align-items: center; flex-direction: column; }
#newsBox2 .nwJJoox .bot01 { display: flex; flex-direction: column; align-items: center; }
#newsBox2 .nwJJoox .bot01 .mou { font-size: 1.2rem; }
#newsBox2 .nwJJoox .bot01 .motitle { overflow: hidden; font-size: 18px; margin: 10px 0; heig; height: 60px; text-align: center; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical }
#newsBox2 .nwJJoox .bot02 { position: relative; width: 95%; }
#newsBox2 .nwJJoox .bot02 img {aspect-ratio: 5/5;object-fit: cover;object-position: 50% 0%;}
#newsBox2 .nwJJoox .bot02:before,#newsBox2 .nwJJoox .bot02:after {content: "";position: absolute;background: url(/images/40/patesJ.png);aspect-ratio: 11/10;background-size: cover;width: 100px;right: -35px;top: -28px;zoom: 75%;}
#newsBox2 .nwJJoox .bot02:after { content: ""; right: auto; top: auto; bottom: -28px; left: -35px; }
#newsBox2 .nwJJoox .bot03 { overflow: hidden; font-size: 15px; margin: 10px 0; height: 59px; text-align: left; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-weight: 200; padding: 5px 10px; }
#newsBox2 .nwJJoox .mwJJright img { border-radius: 0 20px 20px 0; width: 100% }
#newsBox2 .mwJJleft h3 { color: #494647; font-weight: 500; overflow: hidden; margin: 10px 0; width: min(380px,100%); font-size: 26px; height: 46px; text-align: left; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical }
#newsBox2 .mwJJleft p { overflow: hidden; margin: 10px 0; font-size: 16px; height: 92px; width: min(380px,100%); text-align: left; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical }
#newsBox2 .bg_box { opacity: 1; display: flex; flex-direction: column; align-items: center }
#newsBox2 .Jrad_box { display: grid; grid-template-columns: 28% 63%; gap: 9%; align-items: center; }
#newsBox2 .Jrad_box:before { content: ""; position: absolute; background: url(/images/40/title_new_bg.png); width: 34vw; left: -9vw; aspect-ratio: 600/527; background-size: cover; z-index: -1; }
#newsBox2 .news_list:before { position: absolute; content: ""; top: -127px; left: 22%; width: 16vw; background: url(/images/40/potase_img-2.gif); aspect-ratio: 250/657; background-size: cover; z-index: -1; display: none; }
#newsBox2 .news_list:after { position: absolute; content: ""; bottom: 7vw; left: 38vw; width: 16vw; background: url(/images/40/potase_img.png); aspect-ratio: 1/1; background-size: cover; z-index: -1; opacity: 0.7; }
.flm_im_box { position: absolute; width: 100%; top: 0; z-index: 0; height: 100%; }
.flm_im_box .flm_item01 img {
  right:-8vw;top:34vw;position:absolute;width:24vw;transform-origin:right bottom;/* animation:sway 5s 
linear infinite;*/  
}
.flm_im_box .flm_item02 img {
  position:absolute;width:18vw;left:-3vw;top:12vw;transform-origin:left;/* animation:sway 5s 
linear infinite;*/  
}
.flm_im_box .flm_item03 img { position: absolute; width: 9vw; right: 63vw; bottom: 16vw; transform-origin: center; }
.flm_im_box .flm_item01 img,.flm_im_box .flm_item02 img { filter: drop-shadow(5px 5px 10px rgb(42 42 42/62%)); }
/*now_box*/
#now_box { margin-top: -300px; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; }
.von_box {width: min(250px,100%);margin-bottom: 180px;}
#now_box .von_bg { height: 900px; width: 100%; }
#now_box .von_bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 0%; }
/*seebook_area*/
#seebook_area { background: url(/images/40/mu_shape.png); position: relative; z-index: 6; background-size: cover; background-position: 50% 0%; margin-top: -150px; background-color: unset; background-repeat: no-repeat; display: flex; flex-direction: column; align-items: center; padding: 225px 0 140px; }
#seebook_area .me_title_box { display: flex; flex-direction: column; align-items: center; }
#seebook_area .me_title_box .title_img { width: min(300px,100%) }
#seebook_area .me_book_box { display: flex; flex-direction: column; align-items: center; }
#seebook_area .me_book_box .book_img { width: min(900px,100%); transform: scale(1) rotate(9deg)translateX(10px); }
#seebook_area .me_more_box { display: flex; flex-direction: column; align-items: center; margin-left: -13vw; }
#seebook_area .me_more_box .more_img { width: min(350px,100%); }
#runrun_area { background-image: url(/images/40/runrun_bg-2.png); background-repeat: repeat-x; background-position: 100% 100%; animation-timing-function: linear; animation-duration: 10s; animation-iteration-count: infinite; animation-play-state: running; animation-direction: alternate; aspect-ratio: 96/26; background-color: var(--primary); margin-top: -131px; z-index: 2; background-size: 46%; }
@keyframes bgm {
  0% { background-position: 0% 100%; }
  100% { background-position: 100% 100%; }
}
#runrun_area.aos-init:before {content: "";position: absolute;width: 100%;height: 100%;top: 0;left: 0;background: #80201e;z-index: 0;transform: translateY(0%);transition: all 3s ease-in-out;opacity: 0;}
#runrun_area.aos-init.aos-animate:before { transform: translateY(-100%); height: 70%; }
.dooimg { position: relative; z-index: 2; }
#branimg_area { background-image: url(/images/40/branimg.jpg); background-size: cover; margin-top: -110px; background-position: 50% 75%; z-index: 0; }
#branimg_area .br_title_box { padding: 280px 7vw 80px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
#branimg_area .title_img { width: min(250px,100%); margin-bottom: 60px; z-index: 2; }
.br_title_box:before { content: ""; background: rgb(59 41 23/72%); position: absolute; width: 100%; height: 100%; top: 0; }
/*store_area*/
#store_area { position: relative; background-image: url(/images/40/mar_shape.png); margin-top: -155px; padding: 250px 0 400px; background-repeat: no-repeat; background-size: cover; background-position: 50% 0%; }
#store_area .workframe { width: 90%; }
#store_area:before {content: "";position: absolute;width: 100%;height: 80%;background-color: #561304;bottom: 0;z-index: -1;}
#store_area .store-list { display: grid; grid-template-columns: repeat(2,1fr); padding: 40px 0; width: min(1200px,100%); margin: 0 auto; }
#store_area .store-list .stJJitem { position: relative; }
#store_area .st_title_box { display: flex; flex-direction: column; align-items: center; }
#store_area .st_title_box .title_img {
  width:min(350px,100%);animation:float 4s 
linear infinite;
}
#store_area .st_more_box { display: flex; flex-direction: column; align-items: flex-end; width: 24vw; position: absolute; bottom: 14vw; right: 0vw; }
#store_area .st_more_box .more_img { width: min(400px,100%); margin-left: 120px; }
.store_bg { position: absolute; width: 100%; height: 100%; top: 0; overflow: hidden; }
.store_bg .stoimg-R img {position: absolute;right: -7vw;width: 30vw;bottom: 24vw;}
.store_bg .stoimg-L img { position: absolute; left: -7vw; width: 28vw; top: 17vw; animation: sway2 5s linear infinite; }
/* book_area */
#book_area .list_box img { height: 650px }
#book_area .list_box li { margin-left: 10px }
#book_area .list_box .img_box { border: var(--white) solid; border-width: 0 1px 1px 0 }
#book_area .list_box .img_box:after,#book_area .list_box .img_box:before { position: absolute; width: 100%; height: 100%; background: #ffffff59; z-index: 9; opacity: .4; content: "" }
#book_area .list_box .img_box:after { right: 0; bottom: 0 }
#book_area .list_box .atag_item { z-index: 10 }
#book_area .list_box .badge { margin: auto; padding: 10px 20px; max-width: calc(80% - 40px); height: 34px; line-height: 36px; font-size: max(1.4*(1vw + 1vh)/2,16px) }
/* youtube_box */
#youtube_box { min-height: 1px; padding-bottom: 30% }
#youtube_box a { position: absolute; background: var(--white); display: flex; top: 50%; left: 50%; z-index: 99 }
#youtube_box a i { margin: auto; font-size: 30px; color: var(--primary) }
#youtube_box iframe { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 5 }
/* custom_area */
#custom_area { margin: 0; padding: 5vw 0 5vw }
section#custom_area .title_box { display: flex; flex-direction: column; align-items: center }
#custom_area:before { position: absolute; width: 100%; height: 100%; background: rgba(var(--primary-rgb),.1); display: block; bottom: 0; left: 0; opacity: .3; content: "" }
#custom_box { padding: 0 0 }
#custom_box ul { display: flex; margin-top: 50px; flex-wrap: wrap }
#custom_box ul li { display: flex; width: 20%; flex-direction: column }
#custom_box .cumimgbox { display: flex; flex-direction: column; align-items: center; margin-bottom: 10px }
#custom_box .cumimgbox img { width: 100px; aspect-ratio: 1/1 }
#custom_box li .row { margin: 30px 0; padding: 20px 10px 30px; display: flex; border-bottom: 5px var(--primary) solid; flex-direction: column; align-items: center }
#custom_box li .row h2 { font-size: max(1*(1vw + 1vh)/2,16px); text-align: center; font-weight: 400 }
#custom_box li .row article { margin-top: 19px; line-height: 200%; position: absolute; bottom: 14px; border-radius: 50px; background: #57402f; color: #f0f8ff; aspect-ratio: 1/1; width: 32px; display: flex; flex-direction: column; align-items: center; justify-content: center }
#custom_box li:hover .row article { background: #bf4e2d }
@-webkit-keyframes spineer {
  0% { -webkit-box-shadow: 0 0 0 0 var(--info) }
  70% { -webkit-box-shadow: 0 0 0 20px transparent }
  100% { -webkit-box-shadow: 0 0 0 0 transparent }
}
@keyframes spineer {
  0% { box-shadow: 0 0 0 0 var(--info) }
  70% { box-shadow: 0 0 0 20px transparent }
  100% { box-shadow: 0 0 0 0 transparent }
}
@keyframes scroll {
  from { transform: translateX(100%) }
  to { transform: translateX(-100%) }
}
@-webkit-keyframes scroll {
  from { -webkit-transform: translateX(100%) }
  to { -webkit-transform: translateX(-100%) }
}
@keyframes scroll2 {
  from { transform: translateX(0) }
  to { transform: translateX(-200%) }
}
@-webkit-keyframes scroll2 {
  from { -webkit-transform: translateX(0) }
  to { -webkit-transform: translateX(-200%) }
}
#book_area:after { content: ""; position: absolute; width: 800px; aspect-ratio: 1/1; background: url(/images/40/abbgrightimg.png); background-repeat: no-repeat; background-size: contain; right: -440px; -moz-transform: rotate(3deg); -webkit-transform: rotate(3deg); -o-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(45deg); bottom: -120px; left: -640px }
#book_area .puobox { display: flex }
#book_area .title_box { width: 30%; margin-left: 0; display: flex; flex-direction: column; align-items: flex-start; justify-content: center }
#book_area .cootext { margin: 30px 0; font-weight: 300 }
#book_area .list_box { position: relative; width: 70%; right: -13% }
.too_btm { display: flex; gap: 27px; margin-top: 90px }
.too_btm a.fmlink { margin-top: 0 }
.too_btm .slick-next { right: 0 }
.too_btm .slick-next,.too_btm .slick-prev { position: relative; width: 60px; height: auto; top: auto; transform: translate(0,0%) }
.arrow_btns_box .slick-prev { left: 0; transform: scaleX(-1); }
@media screen and (min-width:1281px) {
  #book_area .list_box li:hover .badge { background: var(--primary); color: var(--white) }
  #custom_box li:hover .row { box-shadow: 0 4px 17px 0 rgba(var(--black-rgb),.2); border-bottom: 5px var(--complement) solid }
}
@media screen and (min-width:769px) {
  .mb-box { display: none; }
}
@media screen and (max-width:1470px) {
  a.fmlink { margin-top: 30px; }
  .balltitle:before { width: 19px; }
  .activity-btn { padding: 0 40px 0 45px; }
  .activity-text { font-size: 20px; }
  #now_box .von_bg { height: 655px; }
  #about_area .maJimg:before { width: 18vw; top: -1vw; left: -12vw; }
  #about_area { padding: 100px 0 93px; }
  #about_area:before { bottom: 26%; }
  .mabouttitle .hanJ01 { font-size: 3.6rem; }
  .mabouttitle .bigJ { font-size: 2.1rem; }
  #newsBox2 { padding: 300px 0 400px; }
  #newsBox2 .workframe { width: 80vw; margin: 0 0 0 8vw; }
  .flm_im_box .flm_item02 img { left: -3vw; width: 20vw; top: 9vw; }
  .flm_im_box .flm_item03 img { bottom: 37vw; }
  .flm_im_box .flm_item01 img { top: 42vw; }
  #seebook_area .me_book_box .book_img { width: min(700px,100%); }
  #branimg_area .br_title_box { padding: 209px 7vw 70px; }
  #store_area { padding: 290px 0 200px; margin-top: -210px; }
  #store_area .st_title_box .title_img { width: min(280px,100%); }
  #store_area .store-list { width: min(940px,100%); }
  #store_area .st_more_box { right: 3vw; }
  .store_bg .stoimg-R img { width: 48vw; right: -3vw; }
  #store_area .st_more_box .more_img { width: min(480px,100%); margin-left: 0; }
  .tctextbox h1 { font-size: 1.3rem; }
  #about_area .workframe { grid-template-columns: 39% 54%; margin-top: 0vw; display: grid; }
  #flypaper03 { bottom: -4%; right: -2%; }
  #about_area:after { width: 7vw; bottom: 8%; right: 51vw; }
  #newsBox2 .bg_box:before { height: 366px }
  #newsBox2 .bg_box:after { height: 160px }
  #seebook_area .me_title_box .title_img { width: min(240px,100%); }
  #seebook_area .me_more_box .more_img { width: min(320px,100%); }
  #newsBox2 .news_list:before { width: 19vw; left: 13%; }
  .JJtitle .midtexrb { width: min(45px,100%) }
  .JJtitle .Jterightbox { margin-left: 5px }
  .JJtitle .Jterightbox p { display: flex; justify-content: flex-start }
  #about_area .maJinfoo .tctextbox .tminfo p { font-size: 16px }
  #about_area #VCRabout .VCRbottom p.matitle { margin: 0; font-size: 16px }
  #newsBox2 .nwJJoox .mwJJright img { object-fit: cover; object-position: 30%; height: 390px }
  #about_area .maJinfoo .tctextbox { width: min(540px,100%); }
  #about_area .maJinfoo { padding-right: 0; margin-bottom: 90px; }
  .JJtitle { margin-bottom: 45px }
  #about_area .topmvan h3 { font-size: max(1*(1vw + 1vh)/2,17px) }
  .maloogo { width: 220px }
  #philosophy_area .coomcebox { width: min(900px,80%); margin-top: 0 }
  .maJfixbg { top: 10%; height: 390px }
  .mamatitle .rightm span { width: 190px }
  #about_area .maJimg:after { right: 1vw }
  .count_us { width: 211px }
  .count_us .couitem_boo.moJ2 { width: 75% }
  /*von_box*/
  .von_bg { height: 560px; width: 100%; }
  .von_box { width: min(166px,100%); margin-bottom: 200px; }
  #solgon_area { padding: 20px 0 }
  #book_area .list_box img { height: 480px }
  #book_area:after { left: -598px; background-size: 70%; background-position: 50% }
  #book_area .list_box { right: -10%; width: 68% }
  #custom_box .cumimgbox img { width: 80px }
  .mamatitle .rightm img { width: 45px }
  #doctorpicbox .arrow_btns_box { width: 31vw; top: 110px }
  .ceeservice { margin-top: -188px }
  .rigthJJufoimg img { width: 17vw; margin-top: -12vw; right: -8px }
  #doctorpicbox .doumbox img { height: 448px; object-fit: cover }
  #product_area { padding-bottom: 300px }
}
@media screen and (max-width:1280px) {
  #about_area:after { display: none; }
  #custom_box ul li { position: relative; display: flex; flex-direction: column; width: 33.3% }
  #book_area .puobox { display: flex; flex-direction: column }
  #book_area .title_box { width: 100% }
  #book_area .list_box { right: 0; width: 100% }
  #book_area .list_box img { height: 310px }
}
@media screen and (max-width:1024px) {
  .webBox .hanJ01 { margin-left: 0; }
  .webBox .hanJ01 .pageh1:before { display: none; }
  .webBox .hanJ01 .pageh1 { margin-bottom: 0; padding: 20px 0; display: flex; justify-content: center; }
  #newsBox2 .Jrad_box { display: flex; flex-direction: column; gap: 40px; }
  #newsBox2 { padding: 170px 0 300px; }
  #newsBox2 .sd_title_box { width: min(395px,100%); }
  #newsBox2 .workframe { width: min(600px,100%); margin: 0 auto; }
  #newsBox2 .Jrad_box:before { left: -23vw; width: 41vw; }
  .flm_im_box .flm_item02 img { width: 29vw; top: 13vw; left: -5vw; }
  .flm_im_box .flm_item03 img { bottom: auto; top: 36vw; }
  .flm_im_box .flm_item01 img { top: 50vw; width: 26vw; right: -7vw; }
  #newsBox2 .news_list:before { left: -31%; width: 22vw; }
  #newsBox2:before { width: 28vw; top: 4vw; }
  #about_area .maJimg:before { width: 26vw; height: 300px; left: -17vw; top: 2vw; }
  #seebook_area .me_book_box .book_img { width: min(610px,100%); }
  .rigthJJufoimg img { width: 23vw; margin-top: -18vw }
  #doctorpicbox .doumbox img { height: auto; }
  .laJtext { display: none }
  #about_area .maJinfoo:before { width: 12vw; right: 85vw; top: 0vw; }
  #flypaper03 { bottom: 23%; right: 4%; }
  #flypaper03 img { width: 23vw; }
  #about_area .workframe { display: flex; flex-direction: column; width: 100%; margin: 0 auto; align-items: center; }
  #about_area .maJimg,#about_area .maJimg a { width: 100%; display: flex!important; flex-direction: column; align-items: center; box-shadow: none; transform: skewX(0deg); right: auto; margin: 0 auto; }
  #about_area .maJinfoo { width: 100%; margin-top: 50px; display: flex; justify-content: center; margin-bottom: 20px; padding-right: 0; }
  #tQtitle_area { display: flex; flex-direction: column; }
  #tQtitle_area .mootbox { margin-bottom: 0; }
  .dwdwtext { bottom: -16px; }
  #tQtitle_area .mootbox .motext { position: relative; left: auto; bottom: auto; }
  .arrowbox { margin-left: 0 }
  .mamatitle .leftm span { margin: 0 7px }
  .Japtab { margin-top: 20px }
  .mmtmore { display: flex; flex-direction: column; align-items: center; width: 100% }
  .ceeservice { margin-top: -10px }
  #about_area { padding: 60px 0 49px; gap: 50px; }
  #about_area:before { content: ""; width: 30vw; bottom: 47%; }
  #product_area { background: #ececec; padding-bottom: 20px; }
  #product_area:before { opacity: 0; display: none; }
  .too_btm { display: flex; justify-content: center; }
  #about_area .maJimg img { width: min(400px,80%); object-fit: cover; height: auto; }
  .boomJJ { display: flex; flex-direction: column; align-items: center; }
  #about_area .maJinfoo .tctextbox { display: flex; flex-direction: column; align-items: center; width: min(600px,100%); }
  #about_area .maJinfoo .tctextbox .JJtitle,.tminfo { margin-left: 0; display: flex; flex-direction: column; align-items: center; }
  #about_area .maJinfoo .tctextbox .tminfo p { width: 100%; }
  #product_area:after { bottom: 40px; left: 10vw; }
  .twoJJ { display: flex; flex-direction: row; }
}
@media screen and (max-width:980px) {
  .mideyeembox .mieitem img { margin: 0 auto }
  .ceeservice img { display: none }
  .count_us { position: relative; margin: 50px auto 0; left: auto }
  .Jamore { justify-content: center }
  #newsBox2 .mdJbox02 { display: flex; flex-direction: column; align-items: center; }
  #newsBox2 .mdJbox02:before { content: ""; position: absolute; background: url(/images/40/title_new_bg.png); width: 77vw; right: -9vw; aspect-ratio: 600/527; background-size: cover; z-index: -1; top: 48%; transform: scaleX(-1); }
}
@media screen and (max-width:768px) {
  .arrow_btns_box svg { width: 49px; padding: 13px; }
  .maloogo { display: none }
  .mb-box { display: flex; flex-direction: column; width: 100%; margin-top: 11px }
  .toballbox { display: grid; align-items: center; grid-template-rows: repeat(2,1fr); grid-template-columns: repeat(2,1fr); grid-template-areas: "colorJ01 colorJ01" "colorJ02 colorJ03"; justify-content: center }
  .alwashow { position: relative; width: 100%; padding: 30px 25px; background: #f6f6f6; border-radius: 3px; outline: 1px solid rgb(0 0 0/15%); outline-offset: -15px; margin: 5px 0 10px; aspect-ratio: 12/2; display: flex; flex-direction: column; align-items: center; justify-content: center; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; color: #b01a26 }
  .toballbox .ballitem { width: 200px; aspect-ratio: 1/1; display: grid; border-radius: 500px; justify-content: center; align-items: center }
  .toballbox .ballitem span { color: #fff }
  .toballbox .colorJ01 { left: 25%; position: relative; background: #b01a26; grid-area: colorJ01 }
  .toballbox .colorJ02 { position: relative; top: -70px; right: -20px; mix-blend-mode: darken; background: #57423f; grid-area: colorJ02 }
  .toballbox .colorJ03 { position: relative; top: -70px; left: -20px; mix-blend-mode: color; background: #ba6355; grid-area: colorJ03 }
  #newsBox2 .nwJJoox .bot01 .motitle { padding: 0 25px; }
  #youtube_box { padding-bottom: 60vw }
  #custom_box li .row { margin: 10px 15px; padding: 10px 0 20px; border-bottom: 2px #90785d3b solid }
  #custom_box li .row article { bottom: -2px }
  .arrowbox .arrow_btns_box { margin-right: 0; margin: 0 5px }
  #wave-drop-section .wave-svg-container { height: 61px; top: -100px; }
  #wave-drop-section .under-waves { height: 50px; }
  #seebook_area { margin-top: -30px; }
}
@media screen and (min-width:641px) {
  .mmtmore.mbshowJ { display: none; }
}
@media screen and (max-width:640px) {
  #newsBox2 { background-image: url(/images/40/index_new_bg-cc.png); padding-top: 200px; }
  #product_area:before { width: 100%; }
  .poctopbar { display: flex; flex-direction: column; background: #ffffff; padding: 50px 20px; }
  #product_area .inside_amJ { padding-top: 60px; margin-top: 0; }
  .webBox .hanJ01 { padding-bottom: 0; }
  #newsBox2 .news_list:after { width: 47vw; bottom: auto; top: -14vw; }
  #newsBox2 .sd_title_box { display: flex; flex-direction: column; align-items: flex-start; width: 100%; margin-bottom: 0; }
  .flm_im_box .flm_item01 img { width: 28vw; right: -4vw; top: 58vw; }
  .flm_im_box .flm_item02 img { top: 72vw; width: 40vw; }
  .flm_im_box .flm_item03 img { top: 65vw; width: 19vw; right: 29vw; }
  #newsBox2 .sd_title_box .title_img { width: 60%; }
  #newsBox2 .sd_title_box .more_img { width: 52%; left: -12vw; }
  #newsBox2:before { width: 50vw; top: 8vw; }
  #newsBox2 .nwJJoox { display: flex; flex-direction: column; gap: 25px }
  #newsBox2 .nwJJoox .mwJJleft { order: 2; display: flex; flex-direction: column; align-items: flex-start }
  #newsBox2 .nwJJoox .mwJJright { order: 1 }
  #newsBox2 .mdJbox01,#newsBox2 .info .mdmiJJ:before { display: none }
  #newsBox2 .info .mdmiJJ { display: flex; flex-direction: column; box-shadow: unset; box-shadow: unset; background: unset; padding: 103px 5vw; }
  #newsBox2 .nwJJoox .mwJJright img { border-radius: 20px; height: auto; aspect-ratio: 6/5 }
  .runingtext { top: 30% }
  .pcshowJ { display: none }
  .mmtmore.pcshowJ { display: none }
  .arrow_btns_box.lee { left: auto; right: -4% }
  #about_area .maJimg { position: relative; top: 0; margin: 0 auto; width: 100%; margin-bottom: 0 }
  #about_area .maJimg a { margin: 0; }
  #about_area .maJimg a::-webkit-scrollbar { width: 5px }
  #about_area .maJimg a::-webkit-scrollbar-track { background: #116537 }
  #about_area .maJimg a::-webkit-scrollbar-thumb { background: #003c1e }
  #about_area .maJimg img { max-width: 100%; margin: 0 auto; }
  #about_area .maJinfoo { width: 100%; margin-top: 20px; padding-right: 0; padding-left: 0; }
  #about_area .maJinfoo .tctextbox { width: 89%; margin: 15px auto 2vw; display: flex; gap: 20px; }
  .tminfo { width: 90%; display: flex; align-items: flex-start; }
  #about_area { display: flex; flex-direction: column; height: auto; padding: 0px 0 30px; gap: 30px; }
  #fakeNumber ul { display: flex }
  #fakeNumber ul li { width: 33.3%; display: flex; align-items: center }
  #book_area .list_box img { height: 65vw }
  #custom_box ul li { width: 50% }
  #about_area:after,#book_area:after { display: none }
  section .title_box .area_title { font-weight: 600 }
  .maJfixbg .maJinfo { right: auto; bottom: auto; width: 100% }
  .maJfixbg { height: 300px }
  .maJfixbg .workframe { display: flex; flex-direction: column; align-items: center; justify-content: center }
  .maJfixbg .maJinfo p { text-align: center }
  #philosophy_area { padding: 50px 0 50px }
  .lusancall { margin-left: 0 }
  .lusanline { width: 100vw; margin-right: 0 }
  #doctorpicbox .arrow_btns_box { width: 90vw; }
  .poctopbar .lefcocoJ .mooline svg { width: 35px; }
  .poctopbar .lefcocoJ .mooline a { padding: 8px 25px; }
  #product_area:after { display: none; }
  #product_area .list_box { width: 90%; margin: 0 auto; }
  #product_area .arrow_btns_box { width: 100%; left: 0; margin-bottom: 60px; }
  #flypaper03 { bottom: 25%; }
  #flypaper03 img { width: 36vw; }
  #seebook_area { b; background-size: 200%; background-position: 100% 0%; padding: 34px 0 120px; margin-top: -65px; }
  #seebook_area .me_title_box { display: flex; align-items: flex-end; position: absolute; right: -12vw; width: 63vw; }
  #seebook_area .me_book_box { margin-top: 15vw; }
  #seebook_area .me_more_box { position: absolute; bottom: 25px; left: -10vw; margin-left: 0; }
  #seebook_area .me_title_box .title_img { width: 100%; }
  #seebook_area .me_book_box .book_img { width: min(520px,90%); animation: unset; transform: rotate(12deg); }
  #runrun_area { aspect-ratio: 9/6; background-size: 117%; margin-top: -77px; }
  #store_area {background-position: 100% 0%;background-size: 259%;padding: 38vw 0 190px;margin-top: -100px;}
  #store_area .st_title_box .title_img { width: 57vw; position: absolute; top: -30vw; left: -2vw; }
  #store_area .store-list { display: flex; flex-direction: column; }
  #store_area .store-list .stJJitem:nth-child(odd) { margin-right: 5vw; }
  #store_area .store-list .stJJitem:nth-child(even) { margin-left: 5vw; }
  #store_area .st_more_box { position: relative; right: 0; width: 78%; bottom: 0; margin: 50px auto 10px; }
  #store_area:before { height: 100%; }
}
@media screen and (max-width:550px) {
  .arrow_btns_box.ree { left: auto; right: 50px }
  .arrow_btns_box.lee { right: -15px }
  .mmtmore a { padding: 1px 7px 4px 29px }
  .activity-btn {height: 67.5px;padding-left: 110px;}
  .activity-btn-wrapper { margin-left: -170px; margin-top: 60px; }
  .activity-text { font-size: 19px; letter-spacing: 0; }
  #philosophy_area .JJtitle h2 { text-align: center }
  #philosophy_area:after,#philosophy_area:before { display: none }
  .JJtitle { display: flex; flex-direction: column; margin-bottom: 26px; }
  .JJtitle2 { display: flex; flex-direction: column; align-items: center }
  .JJtitle2 h2 { display: flex; flex-direction: column; align-items: center }
  .JJtitle2 h2:before { left: calc(50% - 10px) }
  .JJtitle2 h2:after { left: calc(50% - -10px) }
  a.fmlink { width: min(200px,100%); margin: 19px 0; padding: 14px 20px; }
  .foocont a.fmlink { width: 270px; margin-top: 10px; }
  #newsBox2 .mwJJleft h3,#newsBox2 .mwJJleft p { width: 100%; }
  .cnlittle::before,.cnlittle::after { width: 45px; }
  .JJtitle .Jterightbox .cnlittle:before { width: 82px; }
  #VCRabout .VCmtitle:before { content: ""; position: absolute; width: 150vw; left: -15vw; height: 1px; background: #a1a1a1; bottom: -20px; }
  #VCRabout .VCmtitle { margin-bottom: 50px }
  #about_area .boomJJ { display: flex; align-items: flex-start; }
  #now_box .von_bg { height: 500px; }
}
@media screen and (max-width:480px) {
  .webBox .hanJ01 { padding-bottom: 0; padding-top: 0; font-size: 2.2rem; }
  .mabouttitle .bigJ { font-size: 1.4rem; }
  .webBox .hanJ01 .pageh1 { padding: 0; }
  .balltitle:before { display: none; }
  .Jterightbox p { display: flex; justify-content: flex-start }
  .JJtitle h2 { margin-bottom: 6px; max-width: 100%; height: auto; text-overflow: unset; display: flex; -webkit-box-orient: unset; -webkit-line-clamp: unset }
  .top_Jtitle .totle { font-size: 2.2em; }
  .top_Jtitle .tosub { font-size: 1.4em; }
  #newsBox2 .mdJbox02:before { top: 46%; }
  #newsBox2:before { width: 90vw; top: 30vw; right: -14vw; }
  .flm_im_box .flm_item01 img { top: 113vw; width: 35vw; right: -8vw; }
  #newsBox2:before{top: 25vw;}
  #newsBox2 .info .mdmiJJ { padding: 280px 5vw 100px; }
  #newsBox2 .Jrad_box:before { width: 94vw; left: -6vw; }
  #newsBox2 .news_list:after { top: 34vw; width: 34vw; left: 60%; }
  #newsBox2 .news_list:before { left: -6%; width: 71vw; bottom: -20px; top: auto; }
  .store_bg .stoimg-R img { width: 108vw; right: -27vw; top: 7vw; }
  .store_bg .stoimg-L img { width: 114vw; top: 160vw; left: 10vw; }
  #seebook_area .me_more_box { bottom: 53px; }
  #seebook_area .me_more_box .more_img { width: 70vw; }
  #branimg_area .title_img {width: 56vw;}
  #branimg_area { background-attachment: unset; background-position: 60% 50%; }
  #branimg_area .br_title_box {padding: 210px 7vw 110px;}
  .flm_im_box .flm_item03 img { top: auto; width: 31vw; bottom: 43%; right: auto; left: -4vw; }
  .flm_im_box .flm_item02 img { top: 125vw; width: 56vw; }
  .tctextbox h1 { font-size: 1.2rem; margin-bottom: 140px; }
  .tminfo { margin-bottom: 10px; }
  .von_box{margin-bottom: 140px;}
  #about_area:before { width: 55vw; bottom: 43%; }
  .tminfo .ssatext { font-size: 0.9rem; height: 3rem; }
  #flypaper03 { bottom: 232px; right: 9vw; }
  #about_area .maJinfoo:before { top: -119vw; right: 2vw; width: 23vw; opacity: 0; }
  .mamatitle .leftm p { font-size: max(1.9*(1vw + 1vh)/2,26px) }
  .mamatitle .leftm span { font-size: max(3.1*(1vw + 1vh)/2,31px); margin: 0 9px }
  .mamatitle .leftm { width: 100%; display: flex }
  .mamatitle .leftm b { display: flex; flex: 1; justify-content: flex-end }
  .shpaeline { display: none }
  #about_area .maJinfoo .tctextbox .tminfo p { height: auto; -webkit-line-clamp: 3; margin: 20px 0 0px; font-size: 16px; width: 100%; font-weight: 400; }
  #product_area .bgBox { width: 100%; object-fit: cover }
  #custom_box ul li { width: 100% }
  .mainfobox { padding: 67px 0 }
  .maloogo { display: none }
  #VCRabout .VCRbottom { grid-template-columns: repeat(2,1fr); margin-top: 60px; }
  #about_area .boomJJ { display: flex; justify-content: flex-start; margin-top: 30px; }
  .rigthJJufoimg img { width: 55vw; margin-top: -167vw; right: -7vw; transform: rotate(7deg) }
  .ceeservice { margin-top: -60px }
  .ceeservice img { display: flex; height: 1200px }
   .store_bg{display:none;}
    #store_area .workframe{width: 100%;}
}