#wrap { z-index: 5; }

/* section */
section {padding: 5vw 0;}
section >* { z-index: 3; }
section .emtitle_box {padding-bottom: 1vw;font-style: normal;font-size: 20px;font-family: "Anybody", sans-serif;display: block;text-transform: uppercase;color: var(--secondary);line-height: 1;}
section .title_box {padding-bottom: 3vw;font-size: 30px;letter-spacing: 6px;font-weight: 400;color: #433d3d;}
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%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); }

/* about_area */
#about_area {padding-bottom: 7vw;}
#about_area .fixTxt{left: 5vw;}
#about_area .fixTxt.bottom {z-index: 5;bottom: -30px;right: 10vw;left: unset;}
#about_area .workframe{width:min(90%, 870px)}
#about_area .workframe *{text-align:center;}
#about_area .title_box { padding-bottom: 0; }
#about_area .pageh1 {font-size: 30px;letter-spacing: 6px;font-weight: 400;color: #433d3d;display: block;line-height: 1.5;}
#about_area h2 { font-size: 45px; font-style: italic; }
#about_area article p {margin: 30px auto;line-height: 210%;font-weight: 300;width: 90%;color: #433d3d;}
#about_area .about_sub_1 {width: 300px;bottom: 3vw;left: 9vw;z-index: 6;animation: aboutImgAnimation 5s ease-in-out infinite;}
#about_area .about_sub_1 img, #about_area .about_sub_2 img{aspect-ratio:3/2}
#about_area .about_sub_1 .clip { -webkit-clip-path: url(#clip_about_sub_1); clip-path: url(#clip_about_sub_1); }
#about_area .about_sub_2 {width: 330px;bottom: 27vw;right: 7vw;animation: aboutImgAnimation 10s ease-in-out infinite;}
#about_area .about_sub_3 { width: 300px; bottom: -11vw; left: 35vw; }
#about_area .about_sub_3 .clip { -webkit-clip-path: url(#clip_about_sub_3); clip-path: url(#clip_about_sub_3); }
#about_area #about_img{ right: -110px; }
@keyframes aboutImgAnimation{0%{-webkit-transform:translateY(0);transform:translateY(0);}50%{-webkit-transform:translateY(10px);transform:translateY(10px);}100%{-webkit-transform:translateY(0);transform:translateY(0);}}

#about_area .videowrap{position:relative;width:1420px;overflow:hidden;margin:0 auto;}
#about_area .videobox{position:relative;width:100%;margin-top: 70px;}
#about_area .video-bg img{position: relative;width: 100%;min-height: 430px; background:url(/images/25/movie_screen.png) left top;z-index:2}
#about_area video{width:100%;}
#about_area .track{width:100vw;max-width:100%;overflow:hidden;white-space:nowrap;z-index: -1;bottom: 25%;}
#about_area .track p{font-weight: 400;margin:0;text-transform:uppercase;letter-spacing: 35px;line-height:1;will-change:transform;animation: marquee 35s linear infinite;color: #433d3d;font-family: "Arimo", sans-serif;font-size: max(12 * (1vw + 1vh) / 2, 60px);opacity: .06;}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}


/* custom_area */
#custom_area {padding: 0;}
#tabs_container {width:100%}
#tabs_container .tab_content{padding: 7vw 0 12vw;position: relative;background-size: cover;background-position: 50% 50%;}
#tabs_container .tab_content:before{content:'';position: absolute;width: 100%;height: 100%;top: 0;background: #000;opacity: .6;}
#tabs_container *{color:#fff;}
#tabs_container .workframe{width: min(90%, 1200px);}
#tabs_container h3 {margin: 0 0 5px;font-size: 40px;font-weight: 500;}
#tabs_container em {margin: 5px 0 30px;font-size: 17px;font-family: "Arimo", sans-serif;display: block;font-weight: 400;font-style: unset;line-height: 1;}
#tabs_container article {width: 35%;font-weight: 300;text-align: justify;line-height: 2.2;margin-bottom: 130px;}
#tabs_container .more_btn {background:none;border: 1px solid #fff;}
#productTabs {display:flex;justify-content: center;}
#productTabs .tabs{bottom: 40px;z-index: 2;width: min(90%, 1300px);border-top: 1px solid rgb(255 255 255 / 30%);}
#productTabs .tabs *{color:#fff;}
#productTabs .tabs li a{padding:25px 30px;position:relative;display: flex;justify-content: center;font-weight: 300;}
#productTabs .tabs li a:before{content:'';width: 0;position: absolute;top: -3px;height: 2px;background: var(--white);}
#productTabs .tabs li.active a:before, #productTabs .tabs li:hover a:before{width: calc(100% - 60px);}

/* process_area */
#process_area{position:relative}
#process_area .workframe{display:grid;grid-template-columns:1fr 50%;gap:50px;width: min(90%, 1390px);}
#process_area .item em{padding-bottom: 10px;}
#process_area .item .title_box{padding-bottom: 2.5vw;}
#process_area .item .title_box:after{content:'';display: block;background: var(--primary);width: 30px;height: 1px;margin-top: 30px;}
#process_area .item article{line-height:210%;word-spacing: 100vw;font-size: 15px;color: #353835;font-weight: 300;}
#process_area ul{display:grid;grid-template-columns:repeat(2,1fr);gap: 30px 80px;padding-top: 40px;}
#process_area ul li{display:grid;grid-template-columns:15% 1fr;gap: 5px 20px;}
#process_area ul li h3{margin: 0 0 5px;font-size: 18px;color:#353835;font-weight: 500;}
#process_area ul li article{font-weight:300;font-size:13px;color: #646664;}
#process_area ul li .num{position:relative;grid-column:1 / 3;display:flex;font-family: "Anybody", sans-serif;font-size: 12px;color: #353835;}
#process_area ul li .num span:before{content:'';position:absolute;width:79%;height:1px;background:#eee;right:0;top:12px}
#process_area .deco03{position:absolute;left:0;bottom: 0;}
#process_area .deco03:before{content:'';position:absolute;height:187px;width:1px;background:#d6d9d5;right:16%;top:-44%}
#process_area .deco04{position:absolute;left:12%;bottom: -60px;}
#process_area .fixTxt{left: 31vw;top: 40px;}
#process_area .fixTxt.bottom{right: 12vw;left: unset;bottom: -100px;top: unset;}

/* news_area */
#news_area li .img_box , #book_area li .img_box { border-radius: 15px; background-color: #f9f9f9; }
#news_area li .info_box { margin: 10px 15px 0; }
#news_area li .time { width: 65px; font-weight: 400; font-size: 13px; }
#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 { margin-top: 10px; height: 60px; line-height: 150%; font-size: 20px; -webkit-line-clamp: 2; }

/* book_area */
#book_area li h3 { margin-top: 10px; height: 30px; font-size: 18px; }

/* photo_area */
#photo_area .item {width: 260px;height: 200px;}
#photo_area .item img {height: 100%;object-fit: cover;}

@media screen and (max-width: 1680px) {
    #process_area .deco03{width:700px}
    #process_area .deco04{width:400px}
}
@media screen and (max-width: 1460px) {
    #about_area .fixTxt{width:250px;left: 2vw;}
    #process_area .deco03{width: 600px;}
    #process_area .deco04{width: 330px;}
}
@media screen and (max-width: 1280px) {
    #tabs_container .tab_content{padding-bottom:15vw}
    #tabs_container article{margin-bottom:100px;}
    #about_area .fixTxt{width: 200px;}
    #about_area .about_sub_2{width:300px;right: -1vw;bottom: 35vw;}
}
@media screen and (max-width: 1024px) {
    #process_area .fixTxt{left:50vw}
    #process_area .workframe{gap: 20px;grid-template-columns: 1fr;}
    #process_area .deco03{position:relative;margin-top: 60px;}
    #process_area .deco04{bottom: -10px;}
    #tabs_container article{width: 55%;}
    #about_area .about_sub_1, #about_area .about_sub_2{display:none;}
}
@media screen and (max-width: 980px) {
    #process_area .fixTxt{left: 70vw;}
    #tabs_container .tab_content{padding-bottom: 25vw;}
    #tabs_container article{margin-bottom: 50px;width: 75%;}
    #about_area .fixTxt{width: 170px;top: -40px;left: -6vw;}
    #about_area .fixTxt.bottom{top:unset;width: 130px;}
	section { padding: 10vw 0; }
	#product_list { width: 500px; }
	#product_list li .clip { height: 590px; }
	#about_area #about_info { margin-bottom: 8vw; }
	#about_area .about_sub_2 { top: auto; bottom: 35vw; width: 35vw; }
	#about_area .about_sub_3 { width: 29vw; left: 10vw; }
}
@media screen and (max-width: 760px) {
    #process_area .deco04{bottom: 20px;width: 290px;left: 0;}
    #process_area ul{grid-template-columns:1fr}
    #process_area .fixTxt{display:none;}
    #tabs_container article{margin-bottom: 50px;width: 100%;}
    #tabs_container h3{font-size:30px;}
    #tabs_container .tab_content{padding: 10vw 0 60vw;}
    #about_area .fixTxt.bottom{width: 80px;}
    #about_area .track{bottom: 10%;}
    #about_area article p{width:100%;}
    #about_area .fixTxt{left: -30vw;top: -110px;}
    section .title_box, #about_area .pageh1{font-size:22px;letter-spacing: 0;}
	section, #about_area { padding: 15vw 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 { height: 80vw; }
	#product_list li .info_box { width: 45vw; height: 30vw; }
    #productTabs .tabs li a{padding: 7px 15px;}
    #productTabs .tabs li.active a:before, #productTabs .tabs li:hover a:before{display: none;}
}
@media screen and (max-width: 550px) {
	#product_sub_list li { margin: 10px; width: 35vw; }
	#product_sub_list li .clip { height: 35vw; }
	#product_list { width: 90vw; }
	#product_list li .clip { height: 100vw; }
	#product_list li .info_box { width: 55vw; height: 40vw; }
	#about_area #about_img { width: 80vw; }
	#about_area .about_sub_2 { bottom: 60vw; }
	#news_area li .row { margin: auto; width: 280px; }
}
@media screen and (max-width: 480px) {
	#book_area li.row { margin: auto; width: 250px; }
}