#wrap { z-index: 5; }
.more_btn:hover svg, .btn:hover svg, #product_list li:hover .info_box .btn svg{animation: arrow-move-right-data-v-1d069175 1s .2s;}
@Keyframes arrow-move-right-data-v-1d069175{0%{transform:translateX(0);-webkit-clip-path:inset(0 0 0 0);clip-path:inset(0 0 0 0);}50%{transform:translateX(20px);-webkit-clip-path:inset(0 100% 0 0);clip-path:inset(0 100% 0 0);}51%{transform:translateX(-20px);-webkit-clip-path:inset(0 0 0 100%);clip-path:inset(0 0 0 100%);}100%{transform:translateX(0);-webkit-clip-path:inset(0 0 0 0);clip-path:inset(0 0 0 0);}}
.more_btn b{width: 35px;height: 35px;background: var(--white);border-radius: 50px;display: inline-flex;align-items: center;justify-content: center;margin-left: 20px;}
.more_btn b svg{width: 18px;height: 18px;fill: var(--primary);}

/* section */
section {padding: 5vw 0;}
section >* { z-index: 3; }
section .title_box {padding-bottom: 3vw;font-size: 62px;font-family: 'Kanit', sans-serif;font-weight: 600;}
section .title_box b{display:block;text-align: center;margin-bottom: 10px;}
section .clip { margin: auto; width: 100%; }
section .clip img { height: 100%; }
section .clip iframe { width: 100%; height: 100%; top: 0; left: 0; }
section .clip video { width: auto; height: 100%; top: 50%; left: 50%; }

/* product_area */
#product_area{padding-top: 2vw;}
#product_area .workframe{width: 1200px;}

/* product_list */
#product_list .slick-list{overflow:unset}
#product_list .slick-prev{z-index:2;width: 78px;height: 78px;left: -25%;top: 50%;}
#product_list .slick-prev:before{content:url(/images/44/arrow-left.png);width: 78px;height: 78px;display: block;opacity: 1;}
#product_list .slick-next{z-index:2;width: 78px;height: 78px;right: -25%;top: 50%;}
#product_list .slick-next:before{content:url(/images/44/arrow-right.png);width: 78px;height: 78px;display: block;opacity: 1;}
#product_list li{display:flex;flex-wrap: wrap;justify-content: space-between;align-items: center;margin: 0 30px;opacity: .4;}
#product_list li .clip {width: 100%;height: 450px;border-radius: 30px;margin: 0;}
#product_list li .clip img{width:100%;object-fit: cover;}
#product_list li .info_box {width: 45%;opacity: 0;position: absolute;right: 0;}
#product_list li.slick-current {opacity:1;}
#product_list li.slick-current .clip{width:50%;}
#product_list li.slick-current .info_box {display: block;opacity: 1;}
#product_list li .info_box >div { margin: auto; width: 80%; }
#product_list li .info_box h3 {height: auto;font-size: 28px;color: var(--info);margin-bottom: 35px;font-weight: 500;}
#product_list li .info_box p.txt_num {font-weight: 300;color: #7e7e7e;font-size: 15px;font-family: 'Kanit', sans-serif;display: block;text-transform: uppercase;}
#product_list li .info_box h5{font-size: 20px;color: #151515;font-weight: 400;}
#product_list li .info_box article{font-size: 15px;color: #242424;margin: 10px 0 50px;width: 80%;text-align: justify;overflow: hidden;height: auto;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;font-weight: 200;}
#product_list li .info_box p.btn{background:var(--primary);color:var(--white);font-size:16px;padding:10px 15px 10px 30px;border-radius:50px;margin-right:20px;display:inline-flex;align-items:center}
#product_list li .info_box p.btn b{width: 35px;height: 35px;background: var(--white);border-radius: 50px;display: inline-flex;align-items: center;justify-content: center;margin-left: 20px;}
#product_list li .info_box p.btn b svg{width: 18px;height: 18px;fill: var(--primary);}

/* about_area */
#about_area .workframe{display:flex;justify-content: center;}
#about_area #about_info{width: 40%;}
#about_area {padding-bottom: 5vw;z-index: 5;background: var(--complement);position: relative;}
#about_area:after{content:'';width: 30%;height: 100%;position: absolute;right: 0;top: 0;background: url(/images/44/a-right-bg.jpg);}
#about_area .title_box { padding-bottom: 0; }
#about_area h2 {font-size: 62px;font-family: 'Kanit', sans-serif;font-weight: 600;color: var(--white);}
#about_area h2 b{display:block;}
#about_area article {margin-bottom: 50px;line-height: 210%;letter-spacing: 2px;font-weight: 300;color: var(--white);font-size: 15px;text-align: justify;}
#about_area #about_info .more_btn b{width: 35px;height: 35px;background: var(--white);border-radius: 50px;display: inline-flex;align-items: center;justify-content: center;margin-left: 20px;}
#about_area #about_info .more_btn b svg{width: 18px;height: 18px;fill: var(--secondary);}
#about_img{border-radius: 30px;overflow: hidden;}
#about_area .more_btn{background: var(--secondary);}

/* custom_area */
#custom_area{position:relative;}
#custom_area:before{content:url(/images/44/w-left.png);position: absolute;top: 40px;left: 30px;-webkit-animation: blink 3s infinite alternate ease-in-out;}
@keyframes blink{0%{top: 40px;}50%{top: 60px;}100%{top: 40px;}}
#custom_area .workframe{width: 1600px;}
#custom_area ul{display:flex;flex-wrap: wrap;justify-content: center;}
#custom_area ul li{width: calc(100%/5);}
#custom_area ul li >div {background: #f7f7f7;margin: 20px 15px;padding: 40px 30px;border: 5px solid #f7f7f7;border-radius: 25px;}
#custom_area ul li:hover >div{border-color: var(--secondary);}
#custom_area ul li:hover .clip{background:var(--secondary);}
#custom_area ul li:hover .clip img{-webkit-filter: contrast(0) brightness(150%);filter: contrast(0) brightness(200%);}
#custom_area ul li .clip {width: 110px;height: 110px;background: var(--white);display: flex;justify-content: center;align-items: center;border-radius: 110px;}
#custom_area ul li .clip img{width:50px;height: 50px;}
#custom_area ul li h3 {margin: 15px 0 30px;font-size: 20px;color: #3e3e3e;line-height: 150%;}
#custom_area ul li:hover h3{color: var(--secondary);}
#custom_area ul li article {color: #3e3e3e;font-weight: 300;font-size: 15px;text-align: center;}
#custom_area ul li article:after{content:url(/images/44/box.png);display: block;margin-top: 50px;}

/* news_area */
#news_area{padding-bottom:7vw}
#news_area:before{content:url(/images/44/w-left.png);position: absolute;top: 40px;right: 30px;-webkit-animation: blink 3s infinite alternate ease-in-out;z-index: 5;}
#news_area:after{content:'';width: 100%;height: 122px;background-image: url(/images/44/footer-top.png);background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;position: absolute;bottom: 0;z-index: 4;}
#news_area .title_box{text-align:left;line-height: 110%;padding: 0;}
#news_area .title_box b{font-size: 22px;text-align: left;margin-top: 20px;color: #3c3c3c;}
#news_area .workframe{display:flex;flex-wrap: wrap;justify-content: space-between;width: 1200px;}
#news_area .workframe >div{width: calc(100% - 400px);}
#news_area .workframe .left{width:350px;display: inline-flex;flex-direction: column;justify-content: space-between;align-items: flex-start;}
#news_area li .img_box , #book_area li .img_box {border-radius: 15px;background-color: #f9f9f9;width: 85px;}
#news_area li .row {background:var(--white);padding: 40px;border-radius: 30px;display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;}
#news_area li .info_box {width: calc(100% - 110px);}
#news_area li .time {width: 100%;font-weight: 400;font-size: 15px;text-align: justify;color: var(--info);margin-top: 25px;overflow: hidden;height: 116px;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;line-height: 200%;}
#news_area li .more_btn { margin-left: 10px; padding: 2px 15px; max-width: calc(100% - 105px); height: 22px; font-weight: 100; font-size: 13px; z-index: 6; }
#news_area li h3 {height: auto;line-height: 150%;font-size: 20px;-webkit-line-clamp: 1;font-family: 'Kanit', sans-serif;color: var(--info);font-weight: 700;}
#news_area li span{color:#e4ad39;font-size: 15px;}

/* book_area */
#book_area li h3 { margin-top: 10px; height: 30px; font-size: 18px; }

/* photo_area */
#photo_area{padding: 0 3% 5vw;display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;}
#photo_area .title_box{text-align:left;width: 250px;line-height: 110%;padding: 0;}
#photo_area .title_box b{text-align:left;margin-top:20px;}
#photo_area >div{width: calc(100% - 300px);display: flex;flex-wrap: wrap;justify-content: space-between;}
#photo_area .item {width: calc((100%/5) - 90px);border: 2px solid #f7f7f7;padding: 30px;border-radius: 20px;margin: 0;position: relative;}
#photo_area .item:after{content:'';border-style: solid;border-width: 10px 0 10px 10px;border-color: transparent transparent transparent #f7f7f7;position: absolute;right: -10px;top: calc(50% - 5px);}
#photo_area .item:last-child:after{display:none;}
#photo_area .item .top{display:flex;flex-wrap: wrap;justify-content: space-between;margin-bottom: 20px;}
#photo_area .item .top .right{width: calc(100% - 65px);}
#photo_area .item .top .right h5{color: #444444;font-size: 20px;}
#photo_area .item .top .right p{color: #c9c9c9;font-size: 18px;text-transform: uppercase;font-family: 'Kanit', sans-serif;font-weight: 200;font-style: italic;line-height: 100%;}
#photo_area .item article{font-size: 16px;color: #444444;}
#photo_area .item img {width: 50px;height: 50px;object-fit: contain;}

@media screen and (max-width: 1680px){
	#product_list .slick-prev{left: -10%;}
	#product_list .slick-next{right:-10%;}
	#custom_area .workframe{width:90%;}
}
@media screen and (max-width: 1440px){
	#product_list .slick-prev{left: -5%;}
	#product_list .slick-next{right:-5%;}
	#photo_area >div{display:flex;justify-content: flex-start;}
	#photo_area .item{width: calc((100%/3) - 95px);margin: 15px;}
}
@media screen and (max-width: 1280px){
	#product_list .slick-prev{left: 2%;}
	#product_list .slick-next{right:2%;}
	#custom_area ul li{width: calc(100%/2);}
	#product_area .workframe, #news_area .workframe{width:90%;}
}
@media screen and (max-width: 1024px){
	#news_area{padding-bottom: 120px;}
	#photo_area .title_box{width:100%;margin-bottom: 20px;}
	#photo_area >div, #news_area .workframe >div{width:100%;}
	#news_area .workframe .left{width:100%;margin-bottom: 20px;}
	#product_list .slick-prev, #product_list .slick-next{display: none !important;}
	#product_list { margin: auto; }
	#news_area li h3 { height: 30px; -webkit-line-clamp: 1; }
}
@media screen and (max-width: 980px){
	#photo_area .item{width: calc((100%/2) - 95px);margin: 15px;}
	#product_list li .clip {height: 400px;}
	#product_list li{margin:0 15px;}
	#about_area .workframe{flex-wrap: wrap;}
	#about_area #about_info {width: 100%;margin: 0;}
	#about_img{width:100%;margin: 30px 0 0;}
	#about_area:after{width:100%;height: 30%;top: unset;bottom: 0;}
}
@media screen and (max-width: 760px){
	#photo_area .item{width: calc((100%/1) - 60px);margin: 10px 0;}
	#product_list li{margin: 0 10px;}
	#product_list .slick-list{padding: 0 !important;}
	section {padding: 50px 0;}
	#product_sub_list >div { margin: 10px auto 50px; }
	#product_sub_list li { width: 150px; }
	#product_sub_list li .clip { height: 150px; }
	#product_list { width: 70vw; }
	#product_list li .clip, #product_list li.slick-current .clip {height: 80vw;width: 100%;}
	#product_list li .info_box {position: relative;width: 100%;height: auto;margin-top: 20px;}
	#product_list li .info_box h3{margin-bottom: 15px;}
	#photo_area{padding:0 5% 5vw}
	#photo_area .item:after{border-width: 10px 10px 0 10px;border-color: #f7f7f7 transparent transparent transparent;top: unset;bottom: -10px;right: calc(50% - 5px);}
	#about_img .clip img{height:auto;}
	#about_area:after{height: 20%;}
	#custom_area:before{zoom: 50%;}
	#news_area:before{display: none;}
	#custom_area ul li{width: 100%;}
}
@media screen and (max-width: 550px){
	section .title_box{font-size: 35px;padding-bottom: 50px;}
	#product_sub_list li { margin: 10px; width: 35vw; }
	#product_sub_list li .clip { height: 35vw; }
	#product_list { width: 90vw; }
	#about_area .about_sub_2 { bottom: 60vw; }
	#news_area li .row {width: calc(100% - 80px);margin: 0;}
}
@media screen and (max-width: 480px){
	#book_area li .row { margin: auto; width: 250px; }
}