/* section */
section{padding:5vw 0}
section.section_pad{padding:5vw 0 7vw}
section >*{z-index:3}
section .title_box{margin-bottom:55px}
section .title_box .area_title{font-weight:400;font-size:35px;color:var(--info);line-height: 130%;}
section .title_box .sub_title{font-weight:500;font-size:23px;background:linear-gradient(400deg,var(--secondary),var(--primary));-webkit-background-clip:text;color:transparent;display: inline-block;}
.bg_box{width:100%;height:100%;background:no-repeat 50% / cover;background-attachment:fixed;opacity: .25;top:0;left:0}
.bg_box:before{width:100%;height:100%;display:block;content:""}
.bg_box.white:before{background: var(--white);}

/* about_area */
#about_area{background-image: url(/images/40/about-bg.jpg);background-repeat:no-repeat;background-position:50% 50%;background-size:cover}
#about_area .workframe{width: 88%;margin-left: 0;}
#about_area:before{content:'';width: 100%;height: 100%;background: linear-gradient(270deg,rgb(244 212 213 / 0%) , #ffffff 55%);position:absolute;top:0;right: 0;}
#about_area:after{content:'';position:absolute;right: 0;bottom: 0;width: 100%;height: 20%;background: linear-gradient(179deg,rgb(244 212 213 / 0%) , #ffffff);}
#about_area .workframe:after{content:url(/images/40/about-text.png);position:absolute;right: -30%;bottom: 20%;-webkit-animation-name:circle;-webkit-animation-iteration-count:infinite;-webkit-animation-timing-function:linear;-webkit-animation-duration:15s;opacity: .5;}
@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)}}
@-moz-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)}}
@-ms-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)}}
@-o-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)}}
@-o-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)}}
#about_area .info_box{width: 25%;margin: 0 0 0 5%;}
#about_area .info_box article{margin-bottom:30px;width:100%;line-height:210%;font-weight:300;text-align:justify}
#about_area .img_box{width:60%;margin: 0;}
#about_area .img_box img{-webkit-transform: scale(1);}

/* product_area */
#product_area{padding:45px 0 0;background-image: url(/images/40/product-bg.jpg);background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;}
#product_area:after{content:'';width: 100%;height: 100%;background: linear-gradient(0deg,rgb(244 212 213 / 0%) , #ffffff);position: absolute;top: 0;right: 0;}
#product_area .title_box{margin-bottom:10px;}
#product_area .title_box *{display: block;}
#product_area .slick-list{overflow:visible}
#product_area li{padding:80px 40px}

/* news_area */
#news_area{background-image: url(/images/40/new-bg.jpg);background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;overflow: hidden;}
#news_area:before{content:'';width: 100%;height: 100%;background: #fff;position:absolute;top:0;left: 0;opacity: .25;}
#news_area:after{content:url(/images/40/news-right.png);position:absolute;right: -25%;bottom: -130px;-webkit-animation-name:circle;-webkit-animation-iteration-count:infinite;-webkit-animation-timing-function:linear;-webkit-animation-duration: 25s;opacity: .3;z-index: 0;}
#news_area .list_box{position:relative}
#news_area ul{display:flex;flex-wrap:wrap;flex-direction:column;align-items:flex-end;padding-top:40px}
#news_area li{width:45%;display:inline-block}
#news_area li:first-child{border:0;position:absolute;left:0;width:50%;top:0;}
#news_area li:first-child .img_scale{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;box-shadow:0 0 15px rgb(0 0 0 / 10%);margin:15px;background: var(--white);}
#news_area li .img{display:none}
#news_area li:first-child .img{display:block;width:50%}
#news_area li:first-child .info_box{width:40%;padding:0;margin-right:5%}
#news_area .list_box img{height:320px}
#news_area .list_box .info_box{display:flex;flex-wrap:wrap;align-items:center}
#news_area li:first-child .info_box{display:block}
#news_area .list_box .info_box p a{margin-right:10px;max-width:calc(100% - 100px);font-weight:400;z-index:2}
#news_area .list_box .info_box p .time{width:90px;font-weight:300;text-align:left;font-size:13px;text-transform:uppercase;letter-spacing:.5px}
#news_area .list_box .info_box h3{height:auto;font-size:20px;width:calc(100% - 90px)}
#news_area .list_box li:hover .info_box h3{background:linear-gradient(400deg,var(--secondary),var(--primary));-webkit-background-clip:text;color:transparent;display: inline-block;}
#news_area li:first-child .info_box h3{width:100%}
#news_area .list_box .info_box article{height:auto;-webkit-line-clamp:3;font-size:15px;margin-top:10px;margin-bottom:30px;display:none}
#news_area li:first-child .info_box article{display:-webkit-box}
#news_area li:first-child .more_btn{padding:0;background:none;color:var(--info);border-bottom:2px solid #333;border-radius:0;padding-bottom:10px;display:inline-flex}
#news_area li:first-child .more_btn span{background:var(--triadic1);width:30px}
#news_area li:first-child .more_btn span:before{border-color:transparent transparent var(--triadic1) transparent;border-width:0 9px 3px 0}
#news_area li .more_btn{display:none}
#news_area li:after{content:'';width:100%;height:5px;display:block;margin:40px 0;background:linear-gradient(to right,#dadada,#dadada 2px,transparent 2px,transparent 4px);background-repeat:repeat-x;background-size:4px 1px;background-position:50% 50%;border-right:1px solid #dadada;border-left:1px solid #dadada}
#news_area li:last-child:after,#news_area li:first-child:after{display:none}

@media screen and (min-width: 1025px) {
	#about_area{background-attachment: fixed;}
}
@media screen and (max-width: 1440px) {
	#about_area{padding-top:8vw}
	#about_area .info_box{margin-bottom: 0;}
}
@media screen and (max-width: 1366px) {
	#about_area .workframe:after{right: -40%;bottom: 10%;}
}
@media screen and (max-width: 1024px) {
	#about_area .info_box{margin-top: 30px;width: 100%;}
	#news_area li:first-child{width:100%;position: relative;margin-bottom: 40px;}
	#news_area li{width:100%;}
	#about_area .img_box{width:100%;}
	#about_area .workframe:after{z-index:-1}
	#product_area:before{display:none;}
}
@media screen and (max-width: 768px) {
	#news_area .list_box .info_box{padding:15px 0}
	#youtube_box{padding-bottom:60vw}
	#custom_box li .row{margin:10px 15px;padding:10px 0}
	section, section.section_pad{padding:50px 0;}
	#news_area ul{padding-top: 0;}
}
@media screen and (max-width: 640px) {
	#news_area li:first-child .info_box{width: 80%;margin: 0 auto;padding: 30px 0;}
	#news_area li:first-child .img{width:100%}
	#news_area li:first-child .img_scale{display: block;}
	#product_area .title_box *{margin-right: 20px;}
	#about_area{padding-top: 70px;}
    #book_area .list_box img{height:65vw}
	#product_area:before{width: 140%;right: -30%;}
	#news_area li:after{margin: 10px 0;}
	#news_area .list_box .info_box h3{width: 100%;}
	#news_area li:first-child{margin-bottom:20px;}
	#about_area .workframe:after{zoom: 60%;}}
}
@media screen and (max-width: 450px) {
    #product_area .bgBox{width:100%;object-fit:cover;}
}