@charset "utf-8";

#header .inr:before{display:none;}
#header nav{width:69%;}
#container:after{content:''; display:block; clear:both;}
#content{float:left; width:31%;}
.area_visual,
.area_visual .list{min-height:870px;}
.area_visual{float:left; position:relative; width:69%;}
.area_visual:before{content:''; display:block; position:absolute; top:0px; left:0px; z-index:81; width:100%; height:100%; background:#fff;}
.area_visual:after{content:''; opacity:0.2; display:block; position:absolute; top:0px; left:90px; width:1px; height:100%; background:#fff;}
.area_visual .list,
.area_visual .list > li{height:100%;}
.area_visual .list > li > div{height:100%; background-repeat:no-repeat; background-position:50% 0; background-size:cover;}
.area_visual .list > li.first-show > div{animation:showVisual 2.5s cubic-bezier(.165,.84,.44,1) 0.2s 1 forwards; -webkit-animation:showVisual 2.5s cubic-bezier(.165,.84,.44,1) 0.2s 1 forwards;}
.area_visual .obj{display:block; position:absolute; left:-370px; top:35%; z-index:70; font-size:15px; letter-spacing:6px; color:#fff; transform:rotate(-90deg); transform-origin:100% 0;}
.area_visual .bx-controls{position:absolute; left:0px; bottom:90px; z-index:71; width:90px;}
.area_visual .bx-controls .bx-pager-item{display:block;}
.area_visual .bx-controls .bx-pager-link{display:block; opacity:0.4; width:12px; height:12px; margin:0 auto; background:#fff; border-radius:100%; font-size:0px; transition:0.3s ease;}
.area_visual .bx-controls .bx-pager-link.active{opacity:1; box-shadow:0px 7px 10px rgba(0,0,0,0.2);}
.area_visual .mob{display:none;}
.area_visual .mob img{max-width:100%; width:100%;}
.ie .area_visual .list > li > div{background-position:100% 0;}

#content h2{margin-bottom:23px; font-size:23px; color:#222; letter-spacing:-0.5px; font-weight:500;}
.area_biz,
.area_news{position:relative; height:calc(100% / 2); box-sizing:border-box;}
.area_biz:before,
.area_news:before{content:''; display:block; position:absolute; z-index:81; width:100%; height:100%; background:#fff;}
.area_biz:before{bottom:0px; left:0px;}
.area_news:before{bottom:0px; right:0px;}
.area_biz{padding:125px 50px 50px 50px; background:url(../images/main/bg_biz.jpg) no-repeat 50% 0; background-size:cover;}
.area_biz h2{color:#fff !important;}
.area_biz p{opacity:0.9; font-size:17px; color:#fff; letter-spacing:-0.5px; line-height:1.7em;}
.area_biz ul{margin-top:65px;}
.area_biz ul:after{content:''; display:block; clear:both;}
.area_biz ul > li{float:left; width:calc(100% / 3);}
.area_biz ul > li a{display:block; padding:0 10px; position:relative;}
.area_biz ul > li a:before{content:''; opacity:1; display:block; height:60px; margin-bottom:15px; background-repeat:no-repeat; background-position:50% 0; background-size:auto 100%; transition:0.3s ease;}
.area_biz ul > li:nth-of-type(1) a:before{background-image:url(../images/main/icon_biz01.svg);}
.area_biz ul > li:nth-of-type(2) a:before{background-image:url(../images/main/icon_biz02.svg);}
.area_biz ul > li:nth-of-type(3) a:before{background-image:url(../images/main/icon_biz03.svg);}
.area_biz ul > li a em{display:block; color:#eafcd9; text-align:center; word-break:keep-all;}
.area_biz ul > li a:hover:before{opacity:0.4;}
.area_news{padding:50px; background:#f9f9f9;}
.area_news ul > li{margin-bottom:15px;}
.area_news ul > li > a{display:block; position:relative;}
.area_news ul > li .img{display:none; overflow:hidden; position:absolute; top:0px; left:0px; width:157px; height:115px; background:url(../images/main/img_notice.jpg) no-repeat 50% 0; background-size:cover; text-align:center;}
.area_news ul > li .img img{height:100%; margin-left:-100%; margin-right:-100%;}
.area_news ul > li em{display:block; width:80%; color:#444; font-weight:400; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; transition:0.3s ease;}
.area_news ul > li small{margin-right:5px; font-size:13px; font-weight:600; color:#c42222;}
.area_news ul > li i{position:absolute; right:0px; top:50%; font-family:var(--font-roboto); font-size:13px; color:#959595; transform:translateY(-50%);}
.area_news ul > li:nth-of-type(1){position:relative; min-height:115px; margin-bottom:30px;}
.area_news ul > li:nth-of-type(1) .img{display:block;}
.area_news ul > li:nth-of-type(1) > a{padding-left:180px; padding-top:10px;}
.area_news ul > li:nth-of-type(1) em{display:-webkit-box; width:100%; heihgt:3.2em; line-height:1.6em; -webkit-line-clamp:2; -webkit-box-orient:vertical; white-space:normal;}
.area_news ul > li:nth-of-type(1) i{display:block; position:static; margin-top:25px;}
/* .area_news ul > li:nth-of-type(1):before{content:''; display:block; position:absolute; top:0px; left:0px; width:157px; height:115px; background:url(../images/main/img_notice.jpg) no-repeat 50% 0;} */
.area_news ul > li > a:hover em{color:#308438;}
.area_news .btn_more{display:block; position:absolute; top:50px; right:50px; width:20px; height:20px; margin-top:5px; font-size:0px;}
.area_news .btn_more:before,
.area_news .btn_more:after{content:''; display:block; width:20px; height:2px; background:#c5c5c5;}
.area_news .btn_more:before{margin-top:9px;}
.area_news .btn_more:after{position:absolute; top:50%; left:50%; margin-left:-10px; transform:rotate(90deg); transform-origin:50% 50%;}

#wrap.active .area_visual:before{animation:hideWidth 1.5s cubic-bezier(.86,0,.07,1) 0s 1 forwards; -webkit-animation:hideWidth 1.5s cubic-bezier(.86,0,.07,1) 0s 1 forwards;}
#wrap.active .area_biz:before{animation:hideHeight 1.5s cubic-bezier(.86,0,.07,1) 0s 1 forwards; -webkit-animation:hideHeight 1.5s cubic-bezier(.86,0,.07,1) 0s 1 forwards;}
#wrap.active .area_news:before{animation:hideWidth 1.5s cubic-bezier(.86,0,.07,1) 0s 1 forwards; -webkit-animation:hideWidth 1.5s cubic-bezier(.86,0,.07,1) 0s 1 forwards;}

.ie .area_biz ul > li{width:calc(100% / 3 - 0.1px);}
.ie .area_biz ul > li a:before{height:61px;}

@keyframes right{
	0%{right:-100%;}
	100%{right:0px;}
}

@keyframes hideWidth{
	0%{width:100%;}
	100%{width:0;}
}

@keyframes hideHeight{
	0%{height:100%;}
	100%{height:0;}
}

@keyframes showVisual{
	0%{transform:scale(1.2) rotate(.001deg); -webkit-transform:scale(1.2) rotate(.001deg);}
	100%{transform:scale(1) rotate(.001deg); -webkit-transform:scale(1) rotate(.001deg);}
}

@media all and (max-width:1860px){
	#header nav,
	.area_visual{width:65%;}
	#content{width:35%;}
	.area_biz{height:55%; padding:120px 50px 50px 50px;}
	.area_news{height:45%;}
	.area_news ul > li:nth-of-type(1){margin-bottom:20px;}
	.area_news ul > li{margin-bottom:10px;}
}

@media all and (max-width:1600px){
	.area_biz p{word-break:kee-all;}
	.area_biz p br{display:none;}
}

@media all and (max-width:1560px){
	.area_visual .list > li > div{background-size:cover;}
	
	.area_biz ul > li a em{font-size:14px;}
}

@media all and (max-width:1385px){
	#header .inr:before{display:block;}
	#header nav{width:80%;}
	.area_visual{float:none; width:100%;}
	#content{float:none; width:100%;}
	.area_biz,
	.area_news{float:left; width:50%; height:420px;}
	.area_biz{padding:50px;}
	
	#content{height:auto !important;}
}

@media all and (max-width:1150px){
	.area_visual,
	.area_visual .list{min-height:600px;}	
	.area_visual .bx-controls{bottom:50px;}
	.area_visual .obj{left:-335px; font-size:13px;}
	
	.area_biz,
	.area_news{height:400px; padding:40px;}
	.area_biz ul > li a{padding:0px;}
	.area_news ul > li em{width:75%;}
	.area_news .btn_more{top:35px; right:40px;}
}

@media all and (max-width:1024px){
	.area_biz p{font-size:16px;}
}

@media all and (max-width:768px){
	.area_visual,
	.area_visual .list{height:100% !important; min-height:inherit;}
	.area_visual .bx-viewport{height:100% !important;}
	.area_visual .obj{display:none;}
	.area_visual .web{display:none;}
	.area_visual .mob{display:block;}
	.area_visual .bx-controls{width:60px;}
	.area_visual:after{display:none;}
	.ie .area_visual .list > li > div{background-position:50% 0;}

	.area_biz,
	.area_news{float:none; width:100%; height:auto;}
	.area_biz p{word-break:keep-all;}	
}

@media all and (max-width:500px){
	.area_biz,
	.area_news{padding:40px 30px;}
	.area_biz ul{margin-top:40px;}
	.area_news ul > li em{width:70%;}
	.area_news ul > li:nth-of-type(1) em{width:100%;}	
	.area_news .btn_more{right:30px;}
}

@media all and (max-width:420px){
	.area_biz ul > li a em{font-size:13px;}
	.area_news ul > li em{font-size:14px;}	
	.area_news ul > li:nth-of-type(1){min-height:81px;}
	.area_news ul > li:nth-of-type(1) > a{padding-top:0px; padding-left:120px;}
	.area_news ul > li .img{width:110px; height:81px;}
}

@media all and (max-width:370px){
	#content h2{font-size:20px;}	
	.area_biz p{font-size:15px;}
	.area_biz ul > li a:before{height:50px;}
}

@media all and (max-width:340px){
	.area_biz,
	.area_news{padding:30px 15px;}
	.area_news .btn_more{top:25px; right:15px;}
}