@charset "UTF-8";

#ly-Main { flex:1; }
#ly-Main section.ly-catalog { width:100%; padding-top:100px; padding-bottom:100px; }
#ly-Main section.ly-catalog header { margin-bottom:80px; text-align:center; }
#ly-Main section.ly-catalog header h2 { font-weight:500; font-size:2rem; }
#ly-Main section.ly-catalog header:after { width:40px; height:3px; margin-top:15px; margin-left:auto; margin-right:auto; content:''; display:block; background-color:#0078e5; position:absolute; left:0; right:0; }
#ly-Main section.ly-catalog div.catalog { max-width:1400px; height:100%; margin:auto; padding-left:20px; padding-right:20px; }
#ly-Main section.ly-catalog div.frame { height:100%; aspect-ratio:1.41/1; position:relative; transition:opacity 0.4s 0.2s; perspective:250vw; }
#ly-Main section.ly-catalog div.pages { width:100%; height:100%; background-color:rgba(0, 0, 0, .1); position:relative; border-radius:4px; transform-style:preserve-3d; backface-visibility:hidden; }
#ly-Main section.ly-catalog div.page { width:50%; height:100%; margin:0; background-color:white; position:absolute; top:0; transform-origin:0 0; transition:transform 1.4s; transform-style:preserve-3d; cursor:pointer; backface-visibility:hidden; float:none; clear:none; user-select:none; overflow:hidden; }
#ly-Main section.ly-catalog div.page:before { content:''; background-color:transparent; position:absolute; top:0; left:0; right:0; bottom:0; z-index:2; transition:background .7s; }
#ly-Main section.ly-catalog div.page:nth-child(odd) { pointer-events:all; transform:rotateY(0deg); right:0; border-radius:0 4px 4px 0; background-image:linear-gradient(to right, rgba(0, 0, 0, .12) 0%, transparent 10%); }
#ly-Main section.ly-catalog div.page:nth-child(odd):hover:before { background-color:rgba(0, 0, 0, .03); }
#ly-Main section.ly-catalog div.page:nth-child(odd):before { background-color:transparent; }
#ly-Main section.ly-catalog div.page:nth-child(even) { clear:both; pointer-events:none; transform:rotateY(180deg); transform-origin:100% 0; left:0; border-radius:4px 0 0 4px; border-color:black; background-image:linear-gradient(to left, rgba(0, 0, 0, .12) 0%, transparent 10%); }
#ly-Main section.ly-catalog div.page:nth-child(even):before { background-color:rgba(0, 0, 0, .2); }
#ly-Main section.ly-catalog div.page.grabbing { transition:none; }
#ly-Main section.ly-catalog div.page.flipped:nth-child(odd) { pointer-events:none; transform:rotateY(-180deg); }
#ly-Main section.ly-catalog div.page.flipped:nth-child(odd):before { background-color:rgba(0, 0, 0, .2); }
#ly-Main section.ly-catalog div.page.flipped:nth-child(even) { pointer-events:all; transform:rotateY(0deg); }
#ly-Main section.ly-catalog div.page.flipped:nth-child(even):hover:before { background-color:rgba(0, 0, 0, .03); }
#ly-Main section.ly-catalog div.page.flipped:nth-child(even):before { background-color:transparent; }
#ly-Main section.ly-catalog div.page:nth-child(odd) { background-position:right top; }
#ly-Main section.ly-catalog div.page.ended:empty { background-color:#0078e5; }
#ly-Main section.ly-catalog div.page img { width:100%; height:100%; }

#ly-Visual { width:100%; position:relative; overflow:hidden; }
#ly-Visual div.visuals { width:100%; height:100%; position:relative; overflow:hidden; background:url('/$res/img/view/index/img-visual-background.jpg') center center no-repeat; background-size:cover; }
#ly-Visual div.visuals div.lamp { width:212px; height:584px; background:url('../../../img/view/index/img-visual-lamp.png') no-repeat; background-size:cover; position:absolute; left:0; bottom:0; z-index:2; }
#ly-Visual div.visuals div.plant { width:285px; height:751px; background:url('../../../img/view/index/img-visual-plant.png') no-repeat; background-size:cover; position:absolute; right:0; bottom:0; z-index:2; }
#ly-Visual div.visual { width:100%; height:650px; margin:auto; display:flex; justify-content:center; position:absolute; top:0; left:0; z-index:1; background-size:cover; background-position:center center; background-repeat:no-repeat; }
#ly-Visual div.visual div.frame { width:1400px; height:100%; position:relative; }
#ly-Visual div.visual dl.title { margin:auto; display:flex; flex-direction:column; align-items:center; justify-content:center; color:white; opacity:.75; position:absolute; top:0; left:0; right:0; bottom:120px; z-index:2; }
#ly-Visual div.visual.foamboard-cream dl.title,
#ly-Visual div.visual.foamboard-white dl.title,
#ly-Visual div.visual.foamboard-yellow dl.title,
#ly-Visual div.visual.woodrock-cream dl.title,
#ly-Visual div.visual.woodrock-white dl.title,
#ly-Visual div.visual.woodrock-yellow dl.title { color:black; }
#ly-Visual div.visual dl.title dt { margin-bottom:20px; font-size:4rem; font-weight:900; }
#ly-Visual div.visual dl.title dt span { font-weight:300; }
#ly-Visual div.visual dl.title dd { font-size:2rem; font-weight:100; }
#ly-Visual div.visual div.board { margin:auto; background-position:center center; background-repeat:no-repeat; background-size:cover; position:absolute; top:0; left:0; right:0; bottom:0; }
#ly-Visual div.visual.foamboard-white div.board { background-image:url('../../../img/view/index/img-visual-foamboard-white.png'); }
#ly-Visual div.visual.foamboard-black div.board { background-image:url('../../../img/view/index/img-visual-foamboard-black.png'); }
#ly-Visual div.visual.foamboard-gray div.board { background-image:url('../../../img/view/index/img-visual-foamboard-gray.png'); }
#ly-Visual div.visual.foamboard-red div.board { background-image:url('../../../img/view/index/img-visual-foamboard-red.png'); }
#ly-Visual div.visual.foamboard-brown div.board { background-image:url('../../../img/view/index/img-visual-foamboard-brown.png'); }
#ly-Visual div.visual.foamboard-vermilion div.board { background-image:url('../../../img/view/index/img-visual-foamboard-vermilion.png'); }
#ly-Visual div.visual.foamboard-orange div.board { background-image:url('../../../img/view/index/img-visual-foamboard-orange.png'); }
#ly-Visual div.visual.foamboard-yellow div.board { background-image:url('../../../img/view/index/img-visual-foamboard-yellow.png'); }
#ly-Visual div.visual.foamboard-cream div.board { background-image:url('../../../img/view/index/img-visual-foamboard-cream.png'); }
#ly-Visual div.visual.foamboard-violet div.board { background-image:url('../../../img/view/index/img-visual-foamboard-violet.png'); }
#ly-Visual div.visual.foamboard-pink div.board { background-image:url('../../../img/view/index/img-visual-foamboard-pink.png'); }
#ly-Visual div.visual.foamboard-darkgreen div.board { background-image:url('../../../img/view/index/img-visual-foamboard-darkgreen.png'); }
#ly-Visual div.visual.foamboard-lightgreen div.board { background-image:url('../../../img/view/index/img-visual-foamboard-lightgreen.png'); }
#ly-Visual div.visual.foamboard-darkblue div.board { background-image:url('../../../img/view/index/img-visual-foamboard-darkblue.png'); }
#ly-Visual div.visual.foamboard-lightblue div.board { background-image:url('../../../img/view/index/img-visual-foamboard-lightblue.png'); }
#ly-Visual div.visual.woodrock-white div.board { background-image:url('../../../img/view/index/img-visual-woodrock-white.png'); }
#ly-Visual div.visual.woodrock-black div.board { background-image:url('../../../img/view/index/img-visual-woodrock-black.png'); }
#ly-Visual div.visual.woodrock-gray div.board { background-image:url('../../../img/view/index/img-visual-woodrock-gray.png'); }
#ly-Visual div.visual.woodrock-red div.board { background-image:url('../../../img/view/index/img-visual-woodrock-red.png'); }
#ly-Visual div.visual.woodrock-brown div.board { background-image:url('../../../img/view/index/img-visual-woodrock-brown.png'); }
#ly-Visual div.visual.woodrock-orange div.board { background-image:url('../../../img/view/index/img-visual-woodrock-orange.png'); }
#ly-Visual div.visual.woodrock-yellow div.board { background-image:url('../../../img/view/index/img-visual-woodrock-yellow.png'); }
#ly-Visual div.visual.woodrock-cream div.board { background-image:url('../../../img/view/index/img-visual-woodrock-cream.png'); }
#ly-Visual div.visual.woodrock-violet div.board { background-image:url('../../../img/view/index/img-visual-woodrock-violet.png'); }
#ly-Visual div.visual.woodrock-pink div.board { background-image:url('../../../img/view/index/img-visual-woodrock-pink.png'); }
#ly-Visual div.visual.woodrock-shellpink div.board { background-image:url('../../../img/view/index/img-visual-woodrock-shellpink.png'); }
#ly-Visual div.visual.woodrock-green div.board { background-image:url('../../../img/view/index/img-visual-woodrock-green.png'); }
#ly-Visual div.visual.woodrock-blue div.board { background-image:url('../../../img/view/index/img-visual-woodrock-blue.png'); }
#ly-Visual div.visual.woodrock-lightblue div.board { background-image:url('../../../img/view/index/img-visual-woodrock-lightblue.png'); }
#ly-Visual div.thumbnail ul { display:flex; align-items:flex-end; }
#ly-Visual div.thumbnail ul li { display:flex; justify-content:center; z-index:2; }
#ly-Visual div.thumbnail ul li button { border:none; background:none; }
#ly-Visual div.thumbnail ul li button div { width:150px; height:150px; }
#ly-Visual div.thumbnail ul li button div img { width:100%; height:100%; object-fit:cover; transition:all ease .2s;}
#ly-Visual div.thumbnail ul li button dl { padding:20px 10px; display:flex; flex-direction:column; }
#ly-Visual div.thumbnail ul li button dl dt { margin-bottom:6px; color:white; font-size:.9375rem; font-weight:500; }
#ly-Visual div.thumbnail ul li button dl dd { color:silver; font-size:.875rem; }
#ly-Visual div.thumbnail ul li.swiper-slide-active button div { min-width:250px; min-height:250px; padding:20px 20px 15px 20px; border-bottom:5px solid rgba(255, 255, 255, .3); }
#ly-Visual div.thumbnail ul li.swiper-slide-active button dl { display:none; }
#ly-Visual div.thumbnail div.obj-visual-control { position:absolute; bottom:30px; z-index:11; }
#ly-Visual div.thumbnail div.obj-visual-control.next { right:10px; }
#ly-Visual div.thumbnail div.obj-visual-control.prev { left:10px; }
#ly-Visual div.thumbnail div.obj-visual-control button { width:50px; height:50px; border:none; background:url('/$res/arrow-lite.svg') no-repeat; background-size:cover; opacity:.35; transition:all ease .2s; transition-property:opacity; }
#ly-Visual div.thumbnail div.obj-visual-control.prev button { transform:rotate(180deg); }
#ly-Visual div.thumbnail div.obj-visual-control button:focus,
#ly-Visual div.thumbnail div.obj-visual-control button:hover { opacity:1; }

#ly-Products { width:100%; padding-top:100px; background-color:whitesmoke; }
#ly-Products ul.tab { margin-bottom:50px; list-style:none; display:flex; justify-content:center; gap:20px; }
#ly-Products ul.tab li button { padding:10px 20px; border:none; background:none; border:.1px solid gainsboro; font-size:.875rem; font-weight:500; color:dimgray; transition:all ease .2s; transition-property:border, color; }
#ly-Products ul.tab li button:focus,
#ly-Products ul.tab li button:hover { border-color:black; color:black; }
#ly-Products ul.tab li button.active { border-color:#0078e5; color:#0078e5; }
#ly-Products div.products { padding-bottom:100px; overflow:hidden; }
#ly-Products ul.swiper-wrapper li { width:250px; }
#ly-Products ul.swiper-wrapper li button { background-color:white; border:none; transition:all ease .2s; transition-property:background; }
#ly-Products ul.swiper-wrapper li button:focus,
#ly-Products ul.swiper-wrapper li button:hover { background-color:#0078e5; }
#ly-Products ul.swiper-wrapper li button div { width:250px; aspect-ratio:1/1.35; }
#ly-Products ul.swiper-wrapper li button div img { width:100%; height:100%; object-fit:cover; }
#ly-Products ul.swiper-wrapper li button dl { padding:30px 10px; display:flex; flex-direction:column; }
#ly-Products ul.swiper-wrapper li button dl dt { margin-bottom:8px; font-size:.875rem; font-weight:500; transition:all ease .2s; transition-property:color; }
#ly-Products ul.swiper-wrapper li button dl dd { color:silver; font-size:.8125rem; }
#ly-Products ul.swiper-wrapper li button:focus dl dt,
#ly-Products ul.swiper-wrapper li button:hover dl dt { color:white; }
#ly-Products div.obj-pagination { margin-top:30px; margin-bottom:30px; display:flex; gap:5px; justify-content:center; }
#ly-Products div.obj-pagination button { width:5px; height:5px; border:none; background-color:gainsboro; transition:all ease .2s; transition-property:background; }
#ly-Products div.obj-pagination button:focus,
#ly-Products div.obj-pagination button:hover { background-color:silver; }
#ly-Products div.obj-pagination button.active { background-color:#0078e5; }
#ly-Products div.swipe { text-align:center; color:silver; display:flex; justify-content:center; align-items:center; }
#ly-Products div.swipe:before,
#ly-Products div.swipe:after { width:30px; height:14px; content:''; display:block; background-position:center center; background-repeat:no-repeat; opacity:.2; }
#ly-Products div.swipe:before { margin-right:20px; background-image:url('../../../img/view/index/img-arrow-swipe.svg'); transform:rotate(180deg); }
#ly-Products div.swipe:after { margin-left:20px; background-image:url('../../../img/view/index/img-arrow-swipe.svg'); }

#ly-Catalog { width:100%; padding-top:100px; padding-bottom:100px; }
#ly-Catalog header div.more { position:absolute; right:20px; bottom:0; }
#ly-Catalog header div.more button { display:flex; align-items:center; border:none; background:none; font-size:.9375rem; color:gray; transition:all ease .2s; transition-property:color; }
#ly-Catalog header div.more button:after { width:20px; height:20px; margin-left:6px; content:''; display:block; background-color:gray; mask:url('../../../img/common/client/img-icon-more.svg') center center no-repeat; -webkit-mask:url('../../../img/common/client/img-icon-more.svg') center center no-repeat; transition:all ease .2s; transition-property:background; }
#ly-Catalog header div.more button:focus,
#ly-Catalog header div.more button:hover { color:#0078e5; }
#ly-Catalog header div.more button:focus:after,
#ly-Catalog header div.more button:hover:after { background-color:#0078e5; }
#ly-Catalog div.frame { max-width:1400px; height:100%; margin:auto; padding-left:20px; padding-right:20px; display:flex; align-items:center; }
#ly-Catalog div.catalog { width:100%; display:flex; gap:100px; }
#ly-Catalog div.catalog div.item { flex:1; }
#ly-Catalog div.catalog div.item button { border:.1px solid whitesmoke; border-radius:10px; box-shadow:0 5px 5px whitesmoke; background:none; overflow:hidden; transition:all ease .2s; transition-property:border, box-shadow; }
#ly-Catalog div.catalog div.item button:focus,
#ly-Catalog div.catalog div.item button:hover { border-color:silver; box-shadow:0 5px 5px gainsboro; }
#ly-Catalog div.catalog div.item button div.image { margin:20px; border:.1px solid whitesmoke; border-radius:10px; overflow:hidden; }
#ly-Catalog div.catalog div.item button div.image img { width:1000px; max-width:100%; }
#ly-Catalog div.catalog div.item button div.title { padding:0 20px 20px 20px; color:dimgray; font-size:1.5rem; font-weight:300; display:flex; align-items:center; transition:all ease .2s; transition-property:color; }
#ly-Catalog div.catalog div.item button div.title:before { width:30px; height:30px; margin-right:12px; content:''; display:block; background:url('../../../img/common/client/img-icon-catalog.svg') no-repeat; opacity:.2; }
#ly-Catalog div.catalog div.item button div.title:after { width:50px; height:50px; margin-left:auto; content:''; display:block; background-color:whitesmoke; mask:url('/$res/download.svg') no-repeat; -webkit-mask:url('/$res/download.svg') no-repeat; transition:all ease .2s; transition-property:background; }
#ly-Catalog div.catalog div.item button:focus div.title,
#ly-Catalog div.catalog div.item button:hover div.title { color:black; }
#ly-Catalog div.catalog div.item button:focus div.title:after,
#ly-Catalog div.catalog div.item button:hover div.title:after { background-color:#0078e5; }

section.ly-foamboard { width:100%; }
section.ly-foamboard div.frame { }
section.ly-foamboard div.frame div.visual { background-color:white; background-size:cover; background-attachment:fixed; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
section.ly-foamboard div.frame div.visual div { width:100%; height:100%; position:absolute; top:0; left:0; overflow:hidden; }
section.ly-foamboard div.frame div.visual div img { width:100%; height:100%; object-fit:cover; }
section.ly-foamboard div.frame div.visual ul { list-style:none; display:flex; flex-direction:column; align-items:center; position:relative; z-index:2; }
section.ly-foamboard div.frame div.visual ul li { padding:10px 15px; display:inline-block; background-color:rgba(255, 255, 255, .75); border-radius:99999px; }
section.ly-foamboard div.frame div.visual ul li:not(:last-of-type) { margin-bottom:15px; }
section.ly-foamboard div.frame div.detail { flex:1; overflow:hidden; }
section.ly-foamboard div.frame div.detail dl dt { font-weight:500; }
section.ly-foamboard div.frame div.detail dl dd { color:gray; font-weight:300; }
section.ly-foamboard div.frame div.product { position:relative; overflow:hidden; }
section.ly-foamboard div.frame div.product ul.swiper-wrapper { margin-bottom:30px; list-style:none; }
section.ly-foamboard div.frame div.product ul.swiper-wrapper li { display:flex; }
section.ly-foamboard div.frame div.product ul.swiper-wrapper li button { width:100%; border:none; background:none; display:flex; flex-direction:column; }
section.ly-foamboard div.frame div.product ul.swiper-wrapper li button div { width:100%; }
section.ly-foamboard div.frame div.product ul.swiper-wrapper li button div.image { width:100%; margin-bottom:15px; aspect-ratio:1/1; border:1px solid gainsboro; transition:all ease .2s; transition-property:border; }
section.ly-foamboard div.frame div.product ul.swiper-wrapper li button:focus div.image,
section.ly-foamboard div.frame div.product ul.swiper-wrapper li button:hover div.image { border-color:black; }
section.ly-foamboard div.frame div.product ul.swiper-wrapper li button div.image img { width:100%; height:100%; object-fit:cover; }
section.ly-foamboard div.frame div.product ul.swiper-wrapper li button div.name { margin-bottom:4px; font-weight:500; font-size:.9375rem; line-height:1.5; transition:all ease .2s; transition-property:color; }
section.ly-foamboard div.frame div.product ul.swiper-wrapper li button div.color { font-weight:300; font-size:.9375rem; color:gray; }
section.ly-foamboard div.frame div.product ul.swiper-wrapper li button:focus div.name,
section.ly-foamboard div.frame div.product ul.swiper-wrapper li button:hover div.name { color:#0078e5; }
section.ly-foamboard div.frame div.obj-pagination { display:flex; }
section.ly-foamboard div.frame div.obj-pagination button { border:none; background-color:gainsboro; transition:all ease .2s; transition-property:background; }
section.ly-foamboard div.frame div.obj-pagination button:focus,
section.ly-foamboard div.frame div.obj-pagination button:hover { background-color:silver; }
section.ly-foamboard div.frame div.obj-pagination button.active { background-color:#0078e5; }

section.ly-xxx { padding-top:100px; padding-bottom:100px; position:relative; background:url('/$res/img/view/index/img-section-lineup.jpg') center center; background-size:cover; background-attachment:fixed; }
section.ly-xxx div.controller div { width:60px; height:60px; position:absolute; top:50%; margin-top:-15px; z-index:2; }
section.ly-xxx div.controller div.prev { left:30px; }
section.ly-xxx div.controller div.next { right:30px; }
section.ly-xxx div.controller div button { width:100%; height:100%; border:none; background-color:black; opacity:.35; -webkit-mask:url('/$res/arrow-huge.svg') no-repeat; transition:all ease .2s; transition-property:opacity; }
section.ly-xxx div.controller div.next button { transform:rotate(180deg); }
section.ly-xxx div.controller div button:focus,
section.ly-xxx div.controller div button:hover { opacity:.75; }
div.xxx { width:100%; height:500px; position:relative; display:flex; align-items:center; justify-content:center;  }

section.ly-xxx .splide__track { padding-top:50px; padding-bottom:50px; }
section.ly-xxx .splide__list:not(.dragging) { transition:transform linear .5s; }

/* Mobile */
@media screen and (min-width:1px) and (max-width:799px) {
	#ly-Visual { height:350px; }
	#ly-Visual div.visuals { width:100%; height:100%; position:relative; overflow:hidden; background:url('/$res/img/view/index/img-visual-background.jpg') center center no-repeat; background-size:cover; }
	#ly-Visual div.visuals div.lamp,
	#ly-Visual div.visuals div.plant { display:none; }
	#ly-Visual div.visual { width:100%; height:100%; margin:auto; display:flex; justify-content:center; position:absolute; top:0; left:0; z-index:1; background-size:cover; background-position:center center; background-repeat:no-repeat; }
	#ly-Visual div.visual div.frame { width:100%; height:100%; position:relative; }
	#ly-Visual div.visual dl.title { margin:auto; display:flex; flex-direction:column; align-items:center; justify-content:center; color:white; opacity:.75; position:absolute; top:0; left:0; right:0; bottom:0; z-index:2; }
	#ly-Visual div.visual dl.title dt { margin-bottom:10px; font-size:2rem; font-weight:700; }
	#ly-Visual div.visual dl.title dd { font-size:1.25rem; }
	#ly-Visual div.visual div.board { max-width:400px; max-height:267px; }
	#ly-Visual div.thumbnail ul { width:1px; height:1px; position:absolute; top:-99999px; visibility:hidden; }
	#ly-Visual div.thumbnail div.obj-visual-control { margin-top:-20px; position:absolute; top:50%; z-index:11; }
	#ly-Visual div.thumbnail div.obj-visual-control.next { right:10px; }
	#ly-Visual div.thumbnail div.obj-visual-control.prev { left:10px; }
	#ly-Visual div.thumbnail div.obj-visual-control button { width:40px; height:40px; border:none; background:url('/$res/arrow-lite.svg') no-repeat; background-size:cover; opacity:.35; transition:all ease .2s; transition-property:opacity; }

	#ly-Woodrock { border-bottom:.1px solid whitesmoke; }

	#ly-Products { padding-top:60px; }
	#ly-Products ul.tab { margin-bottom:40px; gap:10px; }
	#ly-Products ul.swiper-wrapper li { width:180px; }
	#ly-Products ul.swiper-wrapper li button div { width:180px; aspect-ratio:1/1.35; }

	#ly-Catalog { padding-top:60px; padding-bottom:60px; }
	#ly-Catalog header { margin-left:auto; margin-right:auto; margin-bottom:40px; padding-left:20px; padding-right:20px; text-align:center; line-height:1.6; position:relative; }
	#ly-Catalog header h2 { margin-bottom:40px; font-weight:500; font-size:2.5rem; }
	#ly-Catalog header h2:after { width:40px; height:3px; margin-top:15px; margin-left:auto; margin-right:auto; content:''; display:block; background-color:#0078e5; position:absolute; left:0; right:0; }
	#ly-Catalog header p { font-weight:300; font-size:1.125rem; color:gray; }
	#ly-Catalog header div.more { position:absolute; right:20px; bottom:0; }
	#ly-Catalog header div.more button { display:flex; align-items:center; border:none; background:none; font-size:.9375rem; color:gray; transition:all ease .2s; transition-property:color; }
	#ly-Catalog header div.more button:after { width:20px; height:20px; margin-left:6px; content:''; display:block; background-color:gray; mask:url('../../../img/common/client/img-icon-more.svg') center center no-repeat; -webkit-mask:url('../../../img/common/client/img-icon-more.svg') center center no-repeat; transition:all ease .2s; transition-property:background; }
	#ly-Catalog header div.more button:focus,
	#ly-Catalog header div.more button:hover { color:#0078e5; }
	#ly-Catalog header div.more button:focus:after,
	#ly-Catalog header div.more button:hover:after { background-color:#0078e5; }
	#ly-Catalog div.frame { max-width:1400px; height:100%; margin:auto; padding-left:20px; padding-right:20px; display:flex; align-items:center; }
	#ly-Catalog div.catalog { width:100%; display:flex; flex-direction:column; gap:50px; }
	#ly-Catalog div.catalog div.item { flex:1; }
	#ly-Catalog div.catalog div.item button { border:.1px solid whitesmoke; border-radius:10px; box-shadow:0 5px 5px whitesmoke; background:none; overflow:hidden; transition:all ease .2s; transition-property:border, box-shadow; }
	#ly-Catalog div.catalog div.item button:focus,
	#ly-Catalog div.catalog div.item button:hover { border-color:silver; box-shadow:0 5px 5px gainsboro; }
	#ly-Catalog div.catalog div.item button div.image { margin:20px; border:.1px solid whitesmoke; border-radius:10px; overflow:hidden; }
	#ly-Catalog div.catalog div.item button div.image img { width:1000px; max-width:100%; }
	#ly-Catalog div.catalog div.item button div.title { padding:0 20px 20px 20px; color:dimgray; font-size:1.5rem; font-weight:300; display:flex; align-items:center; transition:all ease .2s; transition-property:color; }
	#ly-Catalog div.catalog div.item button div.title:before { width:30px; height:30px; margin-right:12px; content:''; display:block; background:url('../../../img/common/client/img-icon-catalog.svg') no-repeat; opacity:.2; }
	#ly-Catalog div.catalog div.item button div.title:after { width:50px; height:50px; margin-left:auto; content:''; display:block; background-color:whitesmoke; mask:url('/$res/download.svg') no-repeat; -webkit-mask:url('/$res/download.svg') no-repeat; transition:all ease .2s; transition-property:background; }
	#ly-Catalog div.catalog div.item button:focus div.title,
	#ly-Catalog div.catalog div.item button:hover div.title { color:black; }
	#ly-Catalog div.catalog div.item button:focus div.title:after,
	#ly-Catalog div.catalog div.item button:hover div.title:after { background-color:#0078e5; }

	section.ly-foamboard div.frame { padding:60px 20px; }
	section.ly-foamboard div.frame div.visual { display:none; }
	section.ly-foamboard div.frame div.product ul.swiper-wrapper li button div.image { max-width:400px; max-height:400px; }
	section.ly-foamboard div.frame div.detail { flex:1; overflow:hidden; }
	section.ly-foamboard div.frame div.detail dl { margin-bottom:30px; text-align:center; }
	section.ly-foamboard div.frame div.detail dl dt { margin-bottom:15px; font-size:2rem; font-weight:500; }
	section.ly-foamboard div.frame div.detail dl dd { color:gray; font-weight:300; }
	section.ly-foamboard div.frame div.obj-pagination { gap:10px; justify-content:center; }
	section.ly-foamboard div.frame div.obj-pagination button { width:15px; height:15px; }
}

/* Mobile & Tablet */
@media screen and (min-width:1px) and (max-width:1319px) {
}

/* Tablet */
@media screen and (min-width:800px) and (max-width:1319px) {
}

/* Tablet & Desktop */
@media screen and (min-width:800px) {
	#ly-Visual { height:650px; }
	#ly-Visual div.visuals div.lamp { width:212px; height:584px; background:url('../../../img/view/index/img-visual-lamp.png') no-repeat; background-size:cover; position:absolute; left:0; bottom:0; z-index:2; }
	#ly-Visual div.visuals div.plant { width:285px; height:751px; background:url('../../../img/view/index/img-visual-plant.png') no-repeat; background-size:cover; position:absolute; right:0; bottom:0; z-index:2; }
	#ly-Visual div.visual div.board { max-width:750px; max-height:500px; margin:auto; background-position:center center; background-repeat:no-repeat; background-size:cover; position:absolute; top:0; left:0; right:0; bottom:120px; }
	#ly-Visual div.thumbnail { width:100%; height:120px; background-color:rgba(0, 0, 0, .35); position:absolute; bottom:0; z-index:10; }
	#ly-Visual div.thumbnail div.frame { max-width:1400px; height:100%; margin:auto; position:relative; }
	#ly-Visual div.thumbnail div.fixed { width:100%; position:absolute; bottom:0; }
	#ly-Visual div.thumbnail div.fixed div.obj-visual-thumbnail { margin-left:25px; margin-right:25px; overflow:hidden; }
	#ly-Visual div.thumbnail div.obj-visual-control { position:absolute; bottom:30px; z-index:11; }
	#ly-Visual div.thumbnail div.obj-visual-control.next { right:10px; }
	#ly-Visual div.thumbnail div.obj-visual-control.prev { left:10px; }
	#ly-Visual div.thumbnail div.obj-visual-control button { width:50px; height:50px; border:none; background:url('/$res/arrow-lite.svg') no-repeat; background-size:cover; opacity:.35; transition:all ease .2s; transition-property:opacity; }

	#ly-Woodrock div.frame div.visual { margin-right:80px; }

	#ly-Foamboard div.frame div.visual { order:2; }
	#ly-Foamboard div.frame div.detail { margin-right:80px; order:1; }
	#ly-Foamboard div.frame div.detail dl { text-align:right; }
	#ly-Foamboard div.frame div.obj-pagination { justify-content:flex-end; }

	#ly-Products { padding-top:100px; }

	section.ly-foamboard { padding-top:100px; padding-bottom:100px; }
	section.ly-foamboard div.frame { max-width:1400px; height:100%; margin:auto; padding-left:20px; padding-right:20px; display:flex; align-items:center; }
	section.ly-foamboard div.frame div.visual { width:450px; min-width:450px; height:450px; min-height:450px; border:1px solid gainsboro; background-color:white; background-size:cover; background-attachment:fixed; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
	section.ly-foamboard div.frame div.product ul.swiper-wrapper li button div.image { max-width:200px; max-height:200px; }
	section.ly-foamboard div.frame div.detail dl { margin-bottom:40px; }
	section.ly-foamboard div.frame div.detail dl dt { margin-bottom:20px; font-size:2.5rem; font-weight:500; }
	section.ly-foamboard div.frame div.detail dl dd { color:gray; font-size:1.25rem; font-weight:300; }
	section.ly-foamboard div.frame div.obj-pagination { gap:10px; }
	section.ly-foamboard div.frame div.obj-pagination button { width:20px; height:20px; }
}

.scene {
  width: 300px;
  min-width: 300px;
  height: 350px;
  min-height: 350px;
  perspective: 500px;
}

.box {
  position: relative;
  transform-style: preserve-3d;
  transform: translateZ(-50px) rotate3d(0,0,0);
  transition:all linear .5s; transition-property:transform;
}

.scene.prev .box {
  position: relative;
  transform-style: preserve-3d;
  transform: translateZ(0) rotate3d(0,1,0,35deg);
}

.scene.next .box {
  position: relative;
  transform-style: preserve-3d;
  transform: translateZ(0) rotate3d(0,1,0,-35deg);
}

.box__face {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
}

.box__face.front {
    width: 300px;
    height: 350px;
    background:rgba(140, 171, 95, 0.7);
    transform: rotateY(0) translateZ(20px);
  }
 
.box__face.back {
    width: 300px;
    height: 350px;
    background: #AB7E5F;
    transform: rotateY(180deg) translateZ(20px);
  }
.box__face.right {
    left: 50%;
	margin-left:-20px;
    width: 40px;
    height: 350px;
    background: #AB5F66;
    transform: rotateY(90deg) translateZ(150px);
  }
.box__face.left {
    left: 50%;
	margin-left:-20px;
    width: 40px;
    height: 350px;
    background: #AB5F8C;
    transform: rotateY(-90deg) translateZ(150px);
  }
.box__face.top {
	top:300px;
	margin-top:-145px;
    width: 300px;
    height: 40px;
    background: #ABA45F;
    transform: rotateX(90deg) translateZ(175px);
  }
.box__face.bottom {
	margin-top:-145px;
	top:300px;
    width: 300px;
    height: 40px;
    background: #A45FAB;
    transform: rotateX(-90deg) translateZ(175px);
  }