@charset "utf-8";

.scroll_btn{position:fixed;bottom:70px;right: 50px;width:17px;height:84px;background:url(../img/main/scroll_btn.png)no-repeat center;transition:0.3s;z-index: 15;}
.scroll_btn.top_btn:hover{transform:translateY(-15px); transition:0.4s;}
.scroll_btn.down_btn:hover{transform:translateY(15px); transition:0.4s;}

.section{position:relative;z-index:0}
section .center{width:100%}
section .h1{font-size: 50px;font-weight: 600;color:#000;letter-spacing:0;line-height:1em;letter-spacing: -0.5px;}
section .t1{font-size:1.7rem;letter-spacing:-.5px;font-weight:300;line-height:1.8;margin-top:28px}
section .footer-tit{font-size:1.7rem;letter-spacing:-.5px;font-weight:300;line-height:1.5;color:rgba(255,255,255,.2);position:absolute;bottom:50px;right:50px;text-align:right}
section .center_box{display:flex;width:100%;height:100%;align-items:center}
section .txt1{font-size:18px;}
section .main_tit{position:relative;line-height: 1.1;color: #000;font-weight: 500;}
section .main_tit2{ font-size:16px; line-height:1em; color:#333333; font-weight:700;}
section .main_txt{font-weight: 300;color: #333;line-height: 29px;font-size: 20px;letter-spacing: -0.2px;word-break: keep-all;}
section .scroll_wrap{position: absolute;bottom:0;right:4%;transform: translateX(20px); cursor:pointer;z-index: 10;}
section .scroll_wrap:hover{transform: translateX(20px);}
section .scroll_wrap button{position: relative;top: -15px;font-size: 12px;color: #000;font-weight: 700;line-height: 1em;transform: rotate(90deg);}
section .scroll_wrap .top_btn button{ top: -3px;}
.scroll_wrap>div:after{display:block;content:"";position: relative;margin: 15px auto 0px;width:1px;height:40px;background:#222; transition:0.4s;}
.scroll_wrap>div:hover:after{height:50px; transition:0.3s;}
section .more_btn{font-size:11px;font-weight: 600;line-height: 1em;letter-spacing: 0.5px;color:#666666;display:inline-block;}
section .more_btn.type1:before{display:inline-block;content:"";position:relative;vertical-align: middle;width:23px;height:1px;background:#656565;margin-right:13px; transition:0.4s;}
section .more_btn.type2:after{display:inline-block;content:"";position:relative;width:23px;height:1px;vertical-align: middle;background:#656565;margin-left:13px;transition:0.4s;}
section .more_btn.type1:hover:before{transform:translateX(7px); transition:0.3s;}
section .more_btn.type2:hover:after{transform:translateX(-7px); transition:0.3s;}

.section01 .slide_wrap{width:100%;height:100%;position:relative;overflow: hidden;}
.section01 .main_slide{height:100%}
.section01 .main_slide .slick-list{height:100%}
.section01 .main_slide .slick-track{height:100%}
.section01 .main_slide .item{position:relative; height:100%;overflow:hidden; outline:0; }
.section01 .main_slide .img{height:100%;/* -webkit-transform: scale(1); *//* transform: scale(1); *//* -webkit-transition: 10s 1s; *//* transition: 10s 1s; */}
.section01 .main_slide .on .img {/* -webkit-transform: scale(1.05); *//* transform: scale(1.05); */}
.section01 .main_slide .img{background:url(../img/main/main_vis1.jpg) no-repeat center /cover;}
.section01 .main_slide .v02 .img {background-image: url(../img/main/main_vis2.jpg);}
.section01 .main_slide .v03 .img {background-image: url(../img/main/main_vis3.jpg);}
.section01 .main_slide .v04 .img {background-image: url(../img/main/main_vis4.jpg);}
.section01 .main_slide .v05 .img {background-image: url(../img/main/main_vis5.jpg);}
.section01 .slick-dots{position:absolute;left:0;bottom: 70px;width:100%;text-align:center;}
.section01 .slick-dots li{display:inline-block;vertical-align: top;width: 12px;height: 12px;position:relative;top: 2px;border: 2px solid #fff;border-radius:50%;box-sizing:border-box;cursor:pointer;margin:0 5px;}
.section01 .slick-dots li button{text-indent:-9999px;border:0;outline:0;}
.section01 .slick-dots li.slick-active{background: #fff;}
.section01 .slide_navigation{font-size:0;width: 170px;margin:0 auto;position:relative;}
.section01 .slide_navigation .arrow{width:8px;height:14px;position:absolute;bottom: 70px;z-index:10;}
.section01 .slide_navigation .arrow.prev{background:url(../img/main/slide_button_p.png)no-repeat center; left:0;}
.section01 .slide_navigation .arrow.next{background:url(../img/main/slide_button_n.png)no-repeat center; right:0;}
.section01 .main_tit{position: absolute;top: 0;width: 100%;height: 100%;text-align: center;display: table;color: #fff;box-sizing: border-box;z-index: 1;}
.section01 .main_slide .item .main_tit p{display: table-cell;vertical-align: middle;padding-top: 50px;font-weight: 500;font-size: 72px;line-height: 100px;text-shadow: 4px 4px 8px rgba(0,0,0,0.5);}
.section01 .main_slide .item .main_tit p span{font-weight: bold;display: block;font-size: 80px;line-height: 80px;}

.section02{background-color: #ececec;}
.section02 .center{margin-top: 85px;margin-bottom: 85px;}
.section02 *{text-align:center;color: #000 !important;}
.section02 .main_tit{font-size: 56px; line-height: 1em; margin: 40px 0 20px;letter-spacing: -2.5px;}
.section02 .main_txt{width: 77%;margin: 30px auto 50px;color: rgba(0,0,0,0.8) !important;font-weight: 500;} 

#product_all {height: 500px; width: 100%;}
#product_all #products-cont {position: relative; --button-height: 6vh; --button-spacing: 0.2vh;}
#product_all #products {width: 100%;font-size: 0; position: absolute; -webkit-transform: translate3D(calc(var(--page) * -80vw), 0, 0);
  transform: translate3D(calc(var(--page) * -80vw), 0, 0);  -webkit-transition: 1500ms -webkit-transform cubic-bezier(0.7, 0, 0.3, 1);
  transition: 1500ms -webkit-transform cubic-bezier(0.7, 0, 0.3, 1);  transition: 1500ms transform cubic-bezier(0.7, 0, 0.3, 1);
  transition: 1500ms transform cubic-bezier(0.7, 0, 0.3, 1), 1500ms -webkit-transform cubic-bezier(0.7, 0, 0.3, 1);}
#product_all #products .product_in {display: inline-block; vertical-align: top; font-size: 1.5vw; width: 23%; height: 500px; margin: 0 1%; background: #101419; color: white; background-size: cover;
  background-position: center;  white-space: normal;  word-break: break-word;  position: relative;}
#product_all #products .product_in:nth-child(1) {background:url(../img/main/product/product_img_01.jpg)no-repeat center/cover;}
#product_all #products .product_in:nth-child(2) {background:url(../img/main/product/product_img_02.jpg)no-repeat center/cover;}
#product_all #products .product_in:nth-child(3) {background:url(../img/main/product/product_img_03.jpg)no-repeat center/cover;}
#product_all #products .product_in:nth-child(4) {background:url(../img/main/product/product_img_04.jpg)no-repeat center/cover;}
#product_all #products .product_in:nth-child(5) {background:url(../img/main/product/product_img_05.jpg)no-repeat center/cover;}
#product_all #products .products:before {content: '';  display: block;  background: -webkit-gradient(linear, left top, left bottom, from(rgba(86, 97, 108, 0)), to(rgba(33, 52, 69, 0.7)));
  background: linear-gradient(180deg, rgba(86, 97, 108, 0) 0%, rgba(33, 52, 69, 0.7) 100%);  opacity: 0;  position: absolute;  top: 0;  left: 0;  right: 0;  bottom: 0;}
#product_all #products .product_in .number {position: absolute;top: 30px;font-size: 20px;font-weight: 500;left: 10%;color: #fff !important;text-shadow: 4px 4px 8px rgba(0,0,0,0.3);}
#product_all #products .product_in > a{width: 100%; height: 500px; display: block;}
#product_all #products .product_in .number, #product_all #products .product_in .number:before, #product_all #products .product_in .number:after {vertical-align: middle;}
#product_all #products .product_in .number:before, #product_all #products .product_in .number:after {display: inline-block; content: ''; height: 0.133em; margin-top: -0.2em; background: white;}
#product_all #products .product_in .number:before {width: 0; margin-left: 0;}
#product_all #products .product_in .number:after {width: 3em;  margin-left: 1em;}
#product_all #products .product_in .body {position: absolute; bottom: 40px; left: 2em; right: 2em;}
#product_all #products .product_in .location,
#product_all #products .product_in .headline {position: relative;bottom: 0;cursor: default;}
#product_all #products .product_in:before,
#product_all #products .product_in .number:before,
#product_all #products .product_in .number:after,
#product_all #products .product_in .location,
#product_all #products .product_in .headline,
#product_all #products .product_in .link {-webkit-transition: 375ms cubic-bezier(0.7, 0, 0.3, 1); transition: 375ms cubic-bezier(0.7, 0, 0.3, 1);}
#product_all #products .product_in .location {font-weight: 100; margin-bottom: 1.5em; -webkit-transition-delay: 60ms; transition-delay: 60ms;}
#product_all #products .product_in .headline {font-size: 30px;font-weight: 900;-webkit-transition-delay: 50ms;transition-delay: 50ms;line-height: 39px;color: #fff !important;text-shadow: 4px 4px 8px rgba(0,0,0,0.5);}
#product_all #products .product_in .link {display: inline-block; padding: 5px 20px; background-color: rgba(0,0,0,0.1); border: solid 2px #fff; font-size: 16px; box-sizing: border-box; opacity: 0;  color: #fff !important;  pointer-events: none;  -webkit-transition-delay: 25ms;
  transition-delay: 25ms;}
#product_all #products .product_in.hover:before, #product_all #products .product_in:hover:before {opacity: 1;}
#product_all #products .product_in.hover:before,
#product_all #products .product_in.hover .number:before,
#product_all #products .product_in.hover .number:after,
#product_all #products .product_in.hover .location,
#product_all #products .product_in.hover .headline,
#product_all #products .product_in.hover .link, #product_all #products .product_in:hover:before,
#product_all #products .product_in:hover .number:before,
#product_all #products .product_in:hover .number:after,
#product_all #products .product_in:hover .location,
#product_all #products .product_in:hover .headline,
#product_all #products .product_in:hover .link {-webkit-transition: 500ms cubic-bezier(0.7, 0, 0.3, 1); transition: 500ms cubic-bezier(0.7, 0, 0.3, 1);}
#product_all #products .product_in.hover .number:before, #product_all #products .product_in:hover .number:before {width: 3em; margin-right: 1em;}
#product_all #products .product_in.hover .number:after, #product_all #products .product_in:hover .number:after {width: 0; margin-right: 0;}
#product_all #products .product_in.hover .location, #product_all #products .product_in:hover .location {-webkit-transition-delay: 0; transition-delay: 0; bottom: 4em;}
#product_all #products .product_in.hover .headline, #product_all #products .product_in:hover .headline {-webkit-transition-delay: 100ms; transition-delay: 100ms; bottom: 40px;}
#product_all #products .product_in.hover .link, #product_all #products .product_in:hover .link {bottom: 0; opacity: 1; -webkit-transition-delay: 250ms; transition-delay: 250ms;  pointer-events: auto;}

.section03{background: url(../img/main/project/main_section3_bg.jpg)no-repeat top/cover;background-size: 100% 100%;}
.section03 .center{margin-top: 85px;margin-bottom: 85px;}
.section03 .h1{}
.section03 .main_tit{font-size: 56px; line-height: 1em; margin: 40px 0 20px;letter-spacing: -2.5px;}
.section03 .main_txt{width: 77%;margin: 30px 0 50px 0;font-weight: 500;} 
.section03 .txt_area{position:relative;width:50%;top: 40px;}
.section03 .txt_area .main_tit{font-size: 56px;line-height: 7rem;margin: 40px 0 20px;letter-spacing: -2.5px;}
.section03 .txt_area .main_txt{width: 95%;} 
.section03 .list_wrap{text-align: center;}
.section03 .list_wrap:after{display:block; content:""; clear:both;}
.section03 .list_wrap li{display: inline-block;margin: 0 1%;width: 48%;height: auto;float: left;}
.section03 .list_wrap li a{display: block;position: relative;}
.section03 .list_wrap li span{display:block;}
.section03 .list_wrap li span img{display: block;width: 100%; height: 100%;}

.section04 .center{margin-top: 85px;margin-bottom: 85px;}
.section04 *{text-align:center;}
.section04 .h1{color: #fff !important;}
.section04 .main_tit{font-size: 56px; line-height: 1em; margin: 40px 0 20px;letter-spacing: -2.5px;color: #fff !important;}
.section04 .main_txt{width: 77%;margin: 30px auto 50px;color: #fff !important;font-weight: 500;} 

.section04.a{}
.section04.a:after {opacity:0}
.section04:before,
.section04:after {content:"";display:block;position:absolute;width:2000px;height:100%;left:50%;margin-left:-1000px;top:0;z-index:-1;background-size:cover;transition:all .3s ease}
.section04:before {background:url(../img/main/contact/main_contact_bg.jpg) no-repeat center right;background-size:cover}
.section04:after {background:url(../img/main/contact/main_contact_bg.jpg) no-repeat center center;background-size:cover}

.section04 .project_wr {max-width:930px;display:block;margin:0 auto;}
.section04 .project_wr .project_in {text-align:center;width:49%;display:inline-block;border:2px solid #fff;float:left;box-sizing:border-box}
.section04 .project_wr .project_in:nth-child(2n) {border-left:none}
.section04 .project_wr .project_in a {display:block;padding: 60px 0 55px;color:#fff;transition:color .3s ease, background .3s ease;}
.section04 .project_wr .project_in .boxTxt {position:relative;padding-top: 103px;}
.section04 .project_wr .project_in .boxTxt:after {content:"";display:block;position:absolute;width: 82px;height: 110px;background:url(../img/main/contact/ct_icon.png) no-repeat;left:0;right:0;margin:0 auto;top:0;background-size: 180px auto;}
.section04 .project_wr .project_in.n01 .boxTxt:after {background-position:0 0}
.section04 .project_wr .project_in.n02 .boxTxt:after {background-position: -89px -0;width: 95px;}
.section04 .project_wr .project_in .boxTxt span {display:block}
.section04 .project_wr .project_in .boxTxt .bTit {font-size:24px;font-weight: 400;margin-top: 35px;}
.section04 .project_wr .project_in a:hover,
.section04 .project_wr .project_in a:focus {background:#fff;color:#000}
.section04 .project_wr .project_in.n01 a:hover .boxTxt:after,
.section04 .project_wr .project_in.n02 a:hover .boxTxt:after,
.section04 .project_wr .project_in.n01 a:focus .boxTxt:after,
.section04 .project_wr .project_in.n02 a:focus .boxTxt:after {background-position-y: -110px;}

/*motion*/
header{opacity:0; transition:0.5s 0.1s;}
header.motion{opacity:1; transition:0.5s 0.1s;}


@media(max-width:1430px){
    [class*="con-"][class*="-width1"]{width:93%;}
}


@media(max-width:1280px){
.pcbr{display:none;}
.ptbr{display:block;}
.tbr{display:block;}
.mbr{display:none;}
.pc_view{display:none;}
.pt_view{display:block;}
.tm_view{display:block;}
.t_view{display:block;}
.m_view{display:none;}  

.section{height: 100% !important;}
section .h1{font-size: 40px;}
section .center_box{height:100%;overflow: hidden;}
#fullpage{height: auto !important; touch-action:auto !important;}
.fp-enabled body, html.fp-enabled{overflow: hidden !important;height: 100% !important;}
#side_nav{display:none;}
.scroll_btn{display:none !important;} 

.section01 {height:672px !important;}
.section01 .main_slide .img{height:100% !important;width:auto !important}
.section01 .main_slide .item .main_tit p{font-size: 60px;line-height: 90px;}
.section01 .main_slide .item .main_tit p span{font-size: 50px;line-height: 50px;}
section .center_box{height:100%;overflow: hidden;}

.section02 .center{margin-top: 50px;margin-bottom: 50px;}
.section02 .main_txt{margin: 20px auto 30px;} 
#product_all {height: 1060px;width: 100%;}
#product_all #products .product_in{width: 42%;height: 505px;margin: 12px 1%;}
#product_all #products .product_in > a{height: 400px;}
#product_all #products .product_in .headline {font-size: 32px;line-height: 40px;}
#product_all #products .product_in .link {font-size: 18px;}

.section03{background: url(../img/main/project/main_section3_bg2.jpg)no-repeat center /cover;}
.section03 .center{margin-top: 50px;margin-bottom: 50px;}
.section03 .main_txt{margin: 20px 0 30px 0;} 
.section03 .txt_area{width: 100%;margin: 0 0 0 0;top: 0;}
.section03 .txt_area .main_tit{font-size: 56px;line-height: 6.7rem;margin: 40px 0 15px;letter-spacing: -2.5px;}
.section03 .txt_area .main_txt{width: 95%;} 
.section03 .list_wrap{width: 90%;margin: 0 auto;}
.section03 .list_wrap li:last-child{margin-top:0;}
.section03 .list_wrap:after{display:block; content:""; clear:both;}
.section03 .list_wrap li{float: left;}
.section03 .center{text-align: center;}
.section03 .main_txt{text-align: center;} 


}


@media(max-width:940px){
.section01 {height:576px !important;}
.section01 .main_slide .item .main_tit p{font-size: 48px;line-height: 70px;}
.section01 .main_slide .item .main_tit p span{font-size: 40px;line-height: 30px;}   

.section03 .list_wrap{margin-top: 0;margin-bottom: 50px;width: 100%;margin-left: 0;text-align: center;}

.section04 .project_wr {margin:30px 0 0;overflow:hidden}
.section04 .project_wr .project_in a {padding:55px 0 50px}
.section04 .project_wr .project_in .boxTxt {padding-top:70px}
.section04 .project_wr .project_in .boxTxt:after {width: 54px;height: 73px;background-size: 120px auto;}
.section04 .project_wr .project_in.n02 .boxTxt:after {background-position: -59px -0;width: 63px;}
.section04 .project_wr .project_in.n01 a:hover .boxTxt:after,
.section04 .project_wr .project_in.n02 a:hover .boxTxt:after,
.section04 .project_wr .project_in.n01 a:focus .boxTxt:after,
.section04 .project_wr .project_in.n02 a:focus .boxTxt:after {background-position-y:-73px}
.section04 .project_wr .project_in .boxTxt .bTit {font-size:20px;}
.section04 .project_wr .project_in .boxTxt .ef {font-size:18px} 

}


@media(max-width:768px){
section .h1{font-size: 30px;}
section .t1{font-size:1.7rem;letter-spacing:-.5px;font-weight:300;line-height:1.8;margin-top:28px}
section .main_txt{line-height: 22px;font-size: 18px;}
.section01 {height:400px !important;}
.section01 .main_slide .item .main_tit p{font-size: 32px;line-height: 50px;}
.section01 .main_slide .item .main_tit p span{font-size: 35px;} 
.section01 .main_slide .img{background:url(../img/main/main_vis1.jpg) no-repeat 30% /cover;}
.section01 .slick-dots{bottom: 30px;}
.section01 .slide_navigation .arrow{bottom: 30px;}

.section02 .center{margin-top: 50px;margin-bottom: 50px;}
.section02 .main_txt{margin: 10px auto 20px;} 
#product_all #products .product_in{width: 48%;}

.section03 .center{margin-top: 50px;margin-bottom: 50px;}
.section03 .main_txt{margin: 10px auto 20px;} 
.section03 .list_wrap{margin-bottom: 0;}
.section03 .list_wrap li{float: none;display: inline-block;margin: 0 15%;width: 70%;}
.section03 .list_wrap li:last-child{margin-top:20px;}

.section04 .center{margin-top: 50px;margin-bottom: 50px;}
.section04 .main_txt{margin: 10px auto 20px;} 
.section04 .project_wr .project_in {width:100%;display:block;float:none;margin-bottom:15px}
.section04 .project_wr .project_in:nth-child(2n) {border-left:2px solid #fff}
.section04 .project_wr .project_in a {padding:15px 20px}
.section04 .project_wr .project_in .boxTxt {text-align:left;padding:10px 0 10px 60px}
.section04 .project_wr .project_in .boxTxt:after {left:0;right:auto;top:50%;transform:translateY(-50%);-ms-transform:translateY(-50%)}
.section04 .project_wr .project_in .boxTxt .bTit {font-size:16px;margin-bottom: 15px;margin-top: 15px;}
.section04 .project_wr .project_in .boxTxt .ef {font-size:15px}

}


@media(max-width:599px){
.section01 {height:350px !important;}
.section01 .main_tit{left: 0;text-align:center;display: table;}
.section01 .main_slide .item .main_tit p {text-align: center;}
.section01 .main_slide .item .main_tit p span{font-size: 30px;line-height: 30px;} 

#product_all {height: 630px;}
#product_all #products .product_in{height: 300px;margin: 5px 1%;}
#product_all #products .product_in > a{height: 300px;}

#product_all #products .product_in .headline {font-size: 30px;}
#product_all #products .product_in .link {font-size: 16px;}

}  


@media(max-width:426px){
.section01 {height:300px !important;}
.section01 .main_slide .item .main_tit p{font-size: 20px;line-height: 30px;}
.section01 .main_slide .item .main_tit p span{font-size: 24px;} 

.section03 .list_wrap li:nth-child(2){margin-top: 20px;}
.section03 .list_wrap li a .play{top: 32%;left: 50%;width: 50px;height: 50px;margin-left: -25px;}

#product_all {height:520px;}
#product_all #products .product_in{height: 250px;}
#product_all #products .product_in .headline{font-size: 18px; line-height: 30px;}
#product_all #products .product_in .number {top: 15px;font-size: 15px;}

}


@media(max-width:320px){
.section01 {height:250px !important;}
#product_all {height: 460px;}
#product_all #products .product_in{height: 220px;}


}







 #divpop111{
	background:#fff;
	position:absolute;
	left:50px;
	top:120px;
	z-index:101;
	visibility:hidden;
	border:0px solid #fff;
	 
 }
  #divpop222{
	background:#fff;
	position:absolute;
	left:610px;
	top:110px;
	z-index:100;
	visibility:hidden;
	border:0px solid #fff;
	 
 }
 #divpop111 .popbox,
 #divpop111 .popbox{
	background:#fff;
	text-align:center;
	padding-bottom:0px;
	position:relative;
 }
 #divpop111 .popbox img,
 #divpop222 .popbox img{max-width:100%;border:1px solid #ccc;}

.popuparea .pop-close{text-align:right;padding:5px;background:#333}
.popuparea .pop-close a{color:#f7f7f7;}
 
  
  @media(max-width:1200px){
		.popuparea{	
			position:absolute;
			z-index:100;
		}
		
		#divpop111,
		#divpop222{
				 
				
				margin: 0 auto 30px auto;
				max-width:90%;
				
				
				
				 
		 }
		 #divpop111{
			left:0;
		 }
		  #divpop222{
			left:10%;
			 
		 }
 
 }