/* index.less */
#book_area .list_box li .img_box:before,#book_area .list_box li .img_box:after{transform:scaleY(0);-webkit-transform:scaleY(0);-moz-transform:scaleY(0);-ms-transform:scaleY(0);-o-transform:scaleY(0);}#book_area .list_box li .img_box:after{transform-origin:center bottom;-webkit-transform-origin:center bottom;-moz-transform-origin:center bottom;-ms-transform-origin:center bottom;-o-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);-moz-transform:scaleY(1);-ms-transform:scaleY(1);-o-transform:scaleY(1);}}#youtube_box a{width:83px;height:83px;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);-webkit-animation:spineer 2s infinite;animation:spineer 2s infinite;}

/* section */
section {padding: 5vw 0;}
section >* { z-index: 3; }
section .title_box {margin-bottom: 40px;position: relative;}
section .title_box .area_title {font-weight: 400;font-size: 20px;color: #636160;word-spacing: 100vw;max-width: 100%;letter-spacing: 3px;font-size: max(1.5 * (1vw + 1vh) / 2, 18px);}
section .title_box .sub_title {font-weight: 300;font-family: "Nunito Sans", sans-serif;color: #2e2c2c;line-height: 1;font-size: max(7 * (1vw + 1vh) / 2, 40px);}
section .title_box .sub_title:before{content:'';width: 2.5vw;aspect-ratio: 1/1;position: absolute;left: -2vw;background: url(/images/40/star-2.png);background-size: cover;border-radius: 0;top: -1.5vw;animation: sway 4s linear infinite;}
@keyframes sway {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
}
/* 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: rgba(var(--primary-rgb), .2);content: "";}
.bg_box.white:before {background: rgba(var(--white-rgb), .2);}

/* about_area */
#about_area{padding-top: 7vw;background-image: url(/images/40/bg.jpg);background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;padding-bottom: 0;}
#about_area .abJbox{width: 100%;display: grid;grid-template-columns: 50% 42%;gap: 8%;}
#about_area:before{content: url(/images/40/patoin.png);position: absolute;right: 0vw;bottom: 3vw;z-index: 2;aspect-ratio: 798/79;width: 41vw;}
.webBox #about_area  .slick-slider{width: 100%;}
@keyframes shadow{0%{transform-origin:right bottom;transform:rotate(-3deg);}100%{transform-origin:right bottom;transform:rotate(3deg);}}
#about_area:after{content:'';background: url(/images/40/aboutimg.png);position: absolute;top: 0;width: 100%;height: 54vh;opacity: 0.6;}
#about_area .workframe{width: 90%;display: flex;flex-wrap: wrap;flex-direction: column;}
#about_area .workframe .row{margin-right: 0;margin-left: 0;width: 100%;display: flex;flex-direction: column;align-items: flex-start;}
#about_area .title_box{position:absolute;z-index: 2;width: 30%;left: 100px;top: 70px;}
#about_area .info_box{margin-left: 5%;margin-top: 80px;text-align: right;}
#about_area .info_box .article p{width: 100%;line-height: 210%;font-weight: 400;font-size: 19px;text-align: justify;}
#about_area .info_box .article{margin-bottom: 70px;width: 100%;}
#about_area .info_box .article .col-md-12{padding-right: 0px;padding-left: 0px;}
.webh1{font-size: 24px;width: 100%;padding: 15px 0px 15px;color: var(--primary);border-bottom: #ba93824f 1px solid;margin-bottom: 20px;}
#photo_list{position:relative;width: 100%;}
#photo_list:after{content:url(/images/40/img-flower.png);position: absolute;left: 43%;bottom: 3%;z-index: -1;animation-name: flower;animation-direction: alternate;animation-iteration-count: infinite;animation-timing-function: ease-in-out;animation-duration: 2s;opacity: 0.3;}
@keyframes flower{0%{transform-origin:left bottom;transform:rotate(-3deg);}100%{transform-origin:left bottom;transform:rotate(3deg);}}
@keyframes circle{0%{transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);-webkit-transform:rotate(0);}100%{transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);-webkit-transform:rotate(360deg);}}
#photo_list:before{content: url(/images/40/Galaxy.png);position: absolute;right: -58px;bottom: 22%;z-index: -1;animation-name: circle;animation-iteration-count: infinite;animation-timing-function: linear;animation-duration: 15s;}
#photo_list .img_scale {margin: 0 20px 6%;border-radius: 0 0 80px 0;overflow: hidden;}
#photo_list .slick-current{margin-top: 6%;border-radius: 0 80px 0 0;margin-bottom: 0;}
#photo_list img{aspect-ratio: 3 / 4.5;}

/* product_area */
#product_area{background-image: url(/images/40/bg.jpg);background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;padding-top: 6vw;}
#product_area .row{
    margin-right: 0px;
    margin-left: 0px;
}
#product_area .bg_box.white:before{
    background: linear-gradient(360deg, #ffffff 0%, #dbdbdb1f 100%);
    opacity: 1;
}
#product_area:after{content:'';position: absolute;width: 100%;height: 65%;left: 0;bottom: 0;background: #fff;}
#product_area .title_box{position:absolute;width: 30%;left: 32%;z-index: 2;margin: 0;pointer-events: none;}
#product_area .title_box h2{margin-bottom: 115px;}
#product_area .btn{display: flex;align-items: center;margin-bottom: 50px;padding: 0;pointer-events: auto;}
#product_area .btn a{margin-right:15px;}
#product_area .more_btn{padding-left:50px;pointer-events: auto;}
#product_area .slick-list{overflow:unset;}
#product_area .list_box{margin-left: 3.5%;width: 2100px;}
#product_area .list_box ul li{padding: 0 90px;}
#product_area .list_box ul li img{aspect-ratio: 3 / 4;border-radius: 60px 0 0 0;object-fit: cover;width: 100%;}
#product_area .list_box ul li .shadow{margin-right: 170px;box-shadow: unset !important;}
#product_area .list_box ul li.slick-current .shadow{margin-right:0;margin-left: 90px;margin-top: -90px;}
#product_area .list_box ul li.slick-current img{border-radius: 0 90px 0 0;position: relative;}
#product_area .list_box ul li.slick-current .imgg:after{content:'';width: 100%;height: 100%;border: .5px solid #c1b0a0;position: absolute;bottom: -38px;left: -35px;border-radius: 0 90px 0 0;z-index: -1;}
#product_area .list_box ul li .shadow span{font-family: "Nunito Sans", sans-serif;position:absolute;display: flex;flex-direction: column;align-items: center;right: -35px;bottom: 0;color: #636160;font-size: 16px;}
#product_area .list_box ul li .shadow span b{writing-mode: vertical-lr;font-family: "Nunito Sans", sans-serif;font-weight: 400;color: #636160;margin-bottom: 10px;}
#product_list .info_box {padding: 20px 0 35px;}
#product_area .list_box ul li.slick-current{
}
#product_list .info_box h3 {height: auto;font-size: 20px;color: #636160;font-weight: 500;display: -webkit-inline-box;background: #fff;padding: 0 16px;}
#product_list .info_box article {height: auto;font-size: 16px;font-weight: 400;color: #636160;-webkit-line-clamp: 2;width: 90%;margin: 10px auto 0;}

/* news_area */
#news_area{display:grid;grid-template-columns: 55% 45%;justify-items: end;background-image: url(/images/40/bg.jpg);background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;padding-bottom: 0;align-items: end;}
#news_area:before{content:url(/images/40/img-flower3.png);position: absolute;left: -9%;bottom: 0;}
#news_area .workframe{width: 70%;margin-right: 8%;margin-bottom: 5vw;}
#news_area .title_box {display:flex;align-items: flex-end;}
#news_area .title_box h2{margin-bottom:5px;margin-left: 20px;}
#news_area .bg_box{width: 100%;opacity: 1;background-attachment: unset;height: 70vh;order: 2;border-radius: 80px 0 0 0;overflow: hidden;}
#news_area .list_box li {border-bottom: 1px solid #ddd;}
#news_area .list_box li:last-child{border-bottom:0;}
#news_area .list_box .info_box {padding: 25px 0;}
#news_area .list_box .info_box p a {max-width: calc(100% - 100px);font-weight: 400;z-index: 2;position: relative;line-height: 1.3;font-size: 15px;}
#news_area .list_box .info_box p a b{font-family: "Heebo", sans-serif;color: #666;font-weight: 400;display: inline-flex;align-items: center;line-height: 1;}
#news_area .list_box .info_box p a b:after{content:'';width: 50px;height: 1px;display: inline-block;background: #d2d2d2;margin: 0 20px;}
#news_area .list_box .info_box p .time {font-weight: 400;text-align: left;font-family: "Heebo", sans-serif;font-size: 14px;color: #666666;border-right: 1px solid #c9c8c8;padding-right: 10px;margin-right: 10px;line-height: 1;}
#news_area .list_box .info_box .tt{display:grid;grid-template-columns: 1fr 150px;align-items: center;}
#news_area .list_box .info_box .tt p{padding: 4px 0;border-left: 1px solid #ddd;padding-left: 30px;font-size: 14px;text-decoration: underline;}
#news_area .list_box .info_box .tt p b{background: var(--primary);display: inline-flex;align-items: center;justify-content: center;padding: 15px;border-radius: 50px;margin-left: 10px;}
#news_area .list_box .info_box .tt p b svg{width:15px;height:15px;transform: rotate(90deg);}
#news_area .list_box .info_box h3 {height: auto;font-size: 20px;color: #333333;-webkit-line-clamp: 2;font-weight: 400;width: 90%;}

/* book_area */
#book_area{padding:0;background-image: url(/images/40/caseBg.jpg);background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;background: #bc7d4b;}
#imglist{overflow:hidden;display: grid;grid-template-columns: 83% 17%;align-items: center;width: 90%;}
#book_area .clebox{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
#imglist .left{border-left: 1px solid rgb(255 255 255 / 30%);padding: 80px 90px 100px;position: relative;}
#imglist .left:before{content:'Beauty Witness';font-family: "Nunito Sans", sans-serif;font-size: 135px;color: #fff;position: absolute;right: -28%;transform: rotate(270deg);bottom: 50%;font-weight: 200;opacity: 0;}
#imglist .left:after{content:'';position: absolute;width: 1px;height: 100%;background: #fff;opacity: .3;right: 2%;top: 0;z-index: -1;}
#imglist .img_box .infoo{display:flex;flex-wrap: wrap;justify-content: space-between;align-items: center;}
#imglist .img_box .infoo:before{content:"";position: absolute;width: 6vw;aspect-ratio: 1/1;background: #d5a590;right: 4vw;top: 0;opacity: 0;}
#imglist .img_box .infoo .titleBoxx{font-size: 32px;color: #fff;margin-bottom: 30px;width: 100%;margin-left: 0%;position: absolute;width: auto;height: 100%;webkit-writing-mode: vertical-rl;writing-mode: vertical-rl;letter-spacing: 0.25em;padding-top: 150px;display: flex;flex-direction: row;align-items: center;}
#imglist .img_box .infoo .titleBoxx:before{content:'';width: 14px;height: 14px;background: #fff;display: inline-block;border-radius: 50px;margin-right: 0;z-index: 99;position: absolute;margin-top: -30px;}
#imglist .img_box .infoo img{border-radius:10px;aspect-ratio: 739/554;width: 75%;margin-left: 10%;padding-top: 50px;}
#imglist .img_box .infoo .tt{/* background:#efefef; */border-radius: 60px;width: 25%;right: 0%;padding: 0;display: flex;flex-direction: column;align-items: center;margin-top: 0;top: 18%;transform: rotate(90deg);}
#imglist .img_box .infoo .tt *{display:none;}
#imglist .img_box .infoo .tt a{display: flex;background: #d3a18a;margin-top: 50px;}
#imglist .img_box .infoo .tt:after{content:url(/images/40/img-flower2.png);position: absolute;right: -50px;top: -70px;animation-name: flower;animation-direction: alternate;animation-iteration-count: infinite;animation-timing-function: ease-in-out;animation-duration: 2s;}
#imglist .img_box .infoo .tt h3{color:#4b3c34;font-size: 22px;height: auto;-webkit-line-clamp: 2;text-align: center;font-weight: 500;}
#imglist .img_box .infoo .tt p{height:auto;-webkit-line-clamp: 3;color: #706d6c;text-align: justify;margin: 50px 0 80px;}
#imglist .img_nav .slick-prev{left: calc(50% - 25px);top: -30%;}
#imglist .img_nav .slick-prev:before{content:url(/images/40/arrow-up.png);opacity: 1;}
#imglist .img_nav .slick-next{top: unset;left: calc(50% - 25px);bottom: -30%;}
#imglist .img_nav .slick-next:before{content:url(/images/40/arrow-down.png);opacity: 1;}
#imglist .img_nav .imgg{margin:15px 0;}
#imglist .img_nav .imgg img{border:5px solid rgb(255 255 255 / 0%);aspect-ratio: 3 / 3;border-radius: 100px;width: 80px;margin: 0 auto;}
#imglist .img_nav .imgg.slick-current img{border:5px solid #fff;}

/* 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 3vw; }
#custom_area:before { position: absolute; width: 100%; height: 75%; background: rgba(var(--primary-rgb), .1); display: block; bottom: 0; left: 0; opacity: .3; content: ""; }
#custom_box { padding: 8vw 0 5vw; }
#custom_box li .row { margin: 30px 20px; padding: 30px; border-bottom: 2px var(--primary) solid; }
#custom_box li .row h2 { font-size: 20px; }
#custom_box li .row article { margin-top: 30px; line-height: 200%; }

@-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; } }

@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); }
}
@media screen and (max-width: 1680px){
	#product_area .list_box{margin:0;}
}
@media screen and (max-width: 1470px){
	#photo_list:before, #photo_list:after{zoom:80%;}
	#imglist .img_box .infoo img{aspect-ratio: 4 / 3;}
	#imglist .img_box .infoo .titleBoxx{padding-top: 250px;}
	#imglist .left:before{right: -39%;}
	#imglist .img_box .infoo .tt{width: 16%;right: 3%;padding: 40px;}
	#imglist .img_box .infoo .tt .more_btn{padding-left: 50px;padding-right: 80px;margin-top: 0;}
	#imglist .img_box .infoo .tt:after{right: -208px;top: -33px;}
	#about_area .info_box .article p{font-size: 16px;}
	#about_area .info_box .article{margin-bottom: 110px;}
	#about_area:before{bottom: 180px;}
	#about_area{padding-bottom: 100px;}
	#product_area .title_box{left: 40%;}
	#imglist{width: 90%;}
	#imglist .left{padding: 20px 60px 60px;}
	#imglist .img_nav .slick-next{bottom: -15%;}
	#imglist .img_nav .slick-prev{top: -15%;}
	#imglist .img_nav .imgg{margin: 5px 0;}
}
@media screen and (max-width: 1280px){
	#news_area .bg_box{height: 85vh;}
	#news_area:before{zoom:80%;}
	#imglist .left:before{font-size: 125px;}
}
@media screen and (max-width: 1024px){
	#about_area .abJbox{grid-template-columns: 100%;gap: 0;justify-items: end;}
	#about_area:before{display:none;}
	#about_area .workframe .info_box , #about_area .workframe .img_box{width: 93%;}
	#imglist .img_box .infoo .tt:after{right:0;top: -80px;}
	#imglist .left{padding:80px 50px;}
	#imglist .img_box .infoo .tt{right:0;}
	#imglist .img_box .infoo .titleBoxx{display: flex;flex-direction: column;align-items: flex-start;}
	#imglist .img_box .infoo img{margin-left: 23%;}
	#imglist .img_box .infoo .titleBoxx:after{display: block;content:'Beauty Witness';font-family: "Nunito Sans", sans-serif;font-size: 45px;color: #fff;font-weight: 200;margin-top: 10px;margin-bottom: 30px;}
	#imglist{display:block;width: 100%;}
	#imglist .right, #imglist .left:before, #imglist .left:after{display:none;}
	#product_area{padding-top:10vw}
	#product_area .list_box{width: 1200px;}
	#about_area .info_box .article p{width:80%;}
	#about_area .info_box .article{margin: 0 auto 50px;}
	#about_area .info_box{width: 100%;margin: 40px 0 0;text-align: center;}
	#photo_list .img_scale{margin-bottom: 0%;}
	#photo_list:after{display:none;}
	#photo_list .slick-current{margin-top: 0;margin-bottom:0;}
	#photo_list{margin-top: 0;}
	#about_area{padding-top:6vw}
	#about_area .workframe{display:block;}
	#about_area .title_box{position: relative;width: 75%;left: 0;top: 0;margin: 0 auto 5vw;}
	#news_area .bg_box{display:none;}
	#news_area{grid-template-columns: 100%;}
	#news_area:before{zoom: 70%;}
	#news_area .workframe{width: 74%;margin-right: 7%;}
}
@media screen and (max-width: 768px){
	#imglist .img_box .infoo .titleBoxx{
    webkit-writing-mode: vertical-rl;
    writing-mode: horizontal-tb;padding-top: 40px;}
	#about_area .info_box a{margin-right:0;}
	#news_area .workframe{margin:0 auto 5vw}
	#news_area:before{bottom:unset;top:5%;left: -16%;}
	#news_area .bg_box{height:50vh}
	#news_area{display:flex;flex-wrap: wrap;}
	#imglist .img_box .infoo img{aspect-ratio: 739/554;width: min(400px , 95%);border-radius: 9px;border: 5px solid #fff;margin-left: 0;padding: 0;position: relative;margin-top: 130px;}
	#imglist .img_box .infoo .tt{position:relative;width: 100%;display: none;}
	#imglist .img_box .infoo{display:flex;flex-direction: column;align-items: center;}
	#imglist .img_box .infoo{display: flex;flex-direction: column;}
	#imglist .left .slick-prev{left: 8%;z-index: 8;bottom: 35%;right: 15%;top: auto;}
	#imglist .left .slick-prev:before{content:url(/images/40/arrow-up-left.png);opacity: 1;}
	#imglist .left .slick-next{bottom: 35%;right: 15%;top: auto;}
	#imglist .left .slick-next:before{content:url(/images/40/arrow-up-right.png);opacity: 1;}
	#imglist .img_box .infoo .titleBoxx:after{display:none;}
	#about_area:before{zoom:80%;bottom: -25%;}
	#product_area .btn, #product_area .more_btn{display:none;}
	#product_area .title_box{position:relative;left: 10%;width: 75%;left: 0;top: 0;margin: 0 auto 5vw;}
	#product_area .list_box{width: 100%;}
	#news_area .list_box .info_box { padding: 15px 0; }
	#youtube_box { padding-bottom: 60vw; }
	#custom_box li .row { margin: 10px 15px; padding: 10px 0; }
	#imglist .left{padding: 80px 50px 130px;}
}
@media screen and (max-width: 640px){
	section{padding:8vw 0;}
	#news_area .title_box{width: 100%;margin: 0 auto 30px;}
	#news_area .bg_box{height:35vh}
	#imglist .left .slick-prev{left: 31%;bottom: -60px;}
	#imglist .left .slick-next{bottom: -60px;left: 55%;}
	#imglist .img_box .infoo .tt{width: 80%;border-radius: 20px;padding: 25px;}
	#product_area .list_box ul li{margin: 0 5px;}
	#product_area .list_box ul li.slick-current .shadow, #product_area .list_box ul li .shadow{margin:0;}
	#about_area .img_box{margin:0;}
	#photo_list:before{zoom:60%;#photo_list:before;bottom: auto;top: -11%;}
	#photo_list{margin:0;}
	#photo_list .slick-current{margin:0;}
	#news_area .list_box .info_box .tt{grid-template-columns: 1fr 56px;margin: 10px 0 5px;}
	#news_area .list_box .info_box h3{font-size:18px;}
	#news_area .workframe{width:85%;}
	#photo_list .img_scale{margin: 0 10px;}
	#product_area .title_box h2{margin-bottom:50px;}
	#book_area .list_box img { height: 65vw; }
	#news_area:before{display:none;}
	#news_area .list_box .info_box .tt p{font-size:0;border: 0;padding: 0;}
	#about_area .info_box .article p{width: 100%;}
	#about_area .abJbox{display: flex;flex-direction: column;align-items: center;}
	#about_area{padding-bottom: 40px;}
}
@media screen and (max-width: 480px){
	#news_area .list_box .info_box p a{display:none;}
	#product_area .list_box ul li{padding: 0 50px;}
	#product_area .bgBox { width: 100%; object-fit: cover; }
	#imglist .left{padding: 20px 50px 130px;}
}