section {padding: 5vw 0;}
section .titleBox{margin-bottom: 2.5vw;}
section .titleBox em{font-family: "Geist", serif;font-style: unset;text-align: center;display: block;text-transform: uppercase;font-size: 13px;letter-spacing: 1px;color: var(--g_600);}
section .area_title {position: relative;letter-spacing: .1em;text-align: center;font-weight: 500;}
section .area_title:not(#category_area .area_title):after {width: 3em;height: 1px;background: var(--g_300);display: block;content: "";margin: 10px auto 0;}
section .sub_title { font-weight: 500; font-size: 1.1em; color: var(--primary); }
section .more_btn {background: var(--primary);padding: 10px 2.2em;font-weight: 500;color: var(--white);display: inline-block;}
section .more_btn:hover{background:var(--info)}
section .list_box { margin-top: 2vmax; }
section .list_box .item_row {margin: 0 1.5em;}
section .list_box .slick-dots { position: relative; margin: 1em 0; bottom: 0; }

/* category_area */
#category_area{padding: 2vw 0;background: var(--secondary);}
#category_area .titleBox{margin-bottom: 1vw;}
#category_list ul{display:flex;flex-wrap: wrap;justify-content: center;}
#category_list li{margin: 0 25px;}
#category_list li .img_box{display:flex;flex-direction: column;align-items: center;width: 100px;aspect-ratio: 1/1;background: var(--white);justify-content: center;border-radius: 100px;outline: 1px rgb(0 0 0 / 15%) solid;outline-offset: -5px;}
#category_list li .img_box img{width: 50px;aspect-ratio: 1/1;object-fit: contain;opacity: .65;}
#category_list li .info_box{display:flex;flex-direction: column;align-items: center;margin-top: 15px;}
#category_list li .info_box h3{height:auto;font-weight: 400;letter-spacing: 1px;font-size: 17px;}
#category_list li .info_box p{font-family: "Geist", serif;font-size: 14px;color: var(--g_400);font-weight: 200;}
#category_list li:hover .img_box{background:var(--primary);outline: 1px rgb(255 255 255 / 25%) solid;}
#category_list li:hover .img_box img{-webkit-filter: contrast(0) brightness(150%);filter: contrast(0) brightness(200%);}
#category_list li:hover .info_box h3{color:var(--primary)}

/* product_area */
#product_area{padding: 3vw 0 5vw;overflow: hidden;}
#product_area:before{content:url(/images/01/img-line3.png);position: absolute;left: 0;top: 0;}
#product_list .slick-slider{margin:0}
#product_list {position:relative;}
#product_list .arrow_btns_box{width: 110%;left: -5%;top: calc(50% - 45px);display: flex;align-items: center;justify-content: space-between;}
#product_list .arrow_btns_box a{background: #f8f8f8;border: 1px solid #ebebeb;width: 50px;aspect-ratio: 1/1;border-radius: 20px;display: inline-flex !important;!i;!;align-items: center;justify-content: center;}
#product_list .arrow_btns_box img{width: 10px;}
#product_list .arrow_btns_box #arrow_next img{ -webkit-transform: scaleX(-1); transform: scaleX(-1);}
#product_area .fixTxt{position:absolute;bottom: -40px;right: 0;width: 32%;}
#product_area .fixTxt2{position:absolute;bottom: -70px;left: -60px;width: 40%;}

/* about_area */
#about_area{padding-top:0}
#about_area:before{content:url(/images/01/img-leaf.png);position: absolute;top: -90px;right: -60px;zoom: 80%;animation-name: fish;animation-direction: alternate;animation-iteration-count: infinite;animation-timing-function: ease-in-out;animation-duration: 2s;}
@keyframes fish{0%{transform-origin:right bottom;transform:rotate(-3deg);}100%{transform-origin:right bottom;transform:rotate(3deg);}}
#about_area .fixTxt{left: -5%;position: absolute;bottom: 15%;z-index: -1;}
#about_area .fixTxt:before{content:'';width: 100%;height: 100%;position: absolute;background: linear-gradient(90deg, rgb(255 255 255 / 0%), rgb(255 255 255 / 100%));}
#about_area .workframe { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: stretch; }
#about_area .info_box {padding: 0 5% 5%;width: 1%;display: flex;flex: 1 1 auto;flex-direction: column;justify-content: center;align-items: flex-start;}
#about_area .info_box em, #about_area .info_box h2{text-align:left;}
#about_area .info_box em:before{content:'';position: absolute;border: 1px solid #b7b9b9;width: 10px;aspect-ratio: 1/1;border-radius: 50px;left: -20px;top: -20px;}
#about_area .info_box .area_title:after{margin-left: 0 !important;!i;!;}
#about_area .info_box h2 {margin-bottom: 1em;word-break: keep-all;];margin: 0;}
#about_area article p{margin-bottom: 60px;text-align: justify;line-height: 2.2;}
#about_area .img_box { max-width: 50%; }
#about_area .img_box img { width: 100%; height: 100%; }

/* photo_area */
#photo_area .item_row { padding: 4% 6%; border: 2px var(--g_100) solid; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; }
#photo_area .item_row .img_box img { width: 100px; aspect-ratio: 1/1; }
#photo_area .item_row .info_box { margin-left: 6%; width: 1%; flex: 1 1 auto; }
#photo_area .item_row .info_box h3 { margin-bottom: .5em; max-height: 3.2em; height: auto; -webkit-line-clamp: 2; }
#photo_area .item_row .info_box font { padding: .5em 1em; background: var(--primary); border-radius: 2em; display: inline-block; line-height: 1; font-weight: 300; font-size: .9em; color: white; }

/* news_list */
#news_list .img_box { aspect-ratio: 5/3; }
#news_list .info_box { margin-top: .5em; }

#news_list .info_box .time { font-size: .9em; color: var(--g_500); }
#news_list .info_box h3 { margin: .2em 0 .5em; }
#news_list .info_box article {margin-bottom: 1.5em;height: 3.2em;font-size: .9em;color: var(--g_600);-webkit-line-clamp: 2;}
#news_area .list_box .slick-dots{bottom:-20px}

@media screen and (min-width: 1161px){
	#photo_area .item_row:hover { border-color: var(--primary); }
}
@media screen and (max-width: 1440px){
	#product_list{width: 90%;margin: 0 auto;}
	#about_area:before{zoom: 70%;}
}
@media screen and (max-width: 1024px){
	#about_area:before{display: none;}
}
@media screen and (max-width: 768px){
	#about_area .fixTxt{bottom:10%}
	#about_area .fixTxt img{max-width: 140%;}
	#category_area, #product_area{padding: 5vw 0;}
	#about_area .img_box {width: 100%;max-width: inherit;}
	#about_area .info_box { order: 1; }
}
@media screen and (max-width: 640px) {
	#about_area .info_box h2{word-break:break-word}
	#product_list .arrow_btns_box{display:none;}
	#product_list{margin-top: 10vw;width: 100%;}
	#product_area:before{zoom:60%;}
	section .titleBox, #category_area .titleBox{margin-bottom: 5vw;}
	#category_area, #product_area{padding: 9vw 0;}
	#photo_area .item_row .img_box { width: 100%; }
	#photo_area .item_row .img_box img { width: 100%; aspect-ratio: 1/1; }
	#photo_area .item_row .info_box { margin: .5em 0 0; width: 100%; }
}