.inr{max-width:1200px; margin:0 auto;}

/* visual */
.area_visual {position:relative; width:100%; height:100%; overflow:hidden}
.area_visual .bx-wrapper {position:absolute; left:0; top:0; width:100%; height:100%;}
.area_visual .bx-wrapper .bx-viewport {height:100% !important;}
.area_visual .bx-controls {position:absolute; left:0; top:0; width:100%; height:100%; z-index:99}
.area_visual .bx-controls .bx-controls-direction a {position:absolute; top:50%; margin-top:-82px; display:block; width:60px; height:60px; font-size:0px;}
.area_visual .bx-controls .bx-controls-direction .bx-prev {left:50px; background:url(../images/main/btn_prev.png) no-repeat left center}
.area_visual .bx-controls .bx-controls-direction .bx-next {right:50px; background:url(../images/main/btn_next.png) no-repeat right center}
.area_visual .bx-controls .bx-pager {display:none;}


.area_visual img {position:absolute; left:50%; margin-left: -960px; animation: scaleZoom 2s ease-in; transform:scale(1.1, 1.1)}
.area_visual .inr {position:relative; padding-top:90px; z-index:99}
.area_visual .visual_text {padding-top:200px;}
.area_visual .visual_text:after {clear:both; content:''; display:block;}
.area_visual .visual_text>* {float:left; width:50%;}
.area_visual .visual_text div {color:#222}
.area_visual .visual_text div span {font-size:14px; font-weight:500; letter-spacing:15px; text-transform:uppercase; display:none;}
.area_visual .visual_text div h1 {margin:15px 0; font-size:70px; font-weight:900; letter-spacing:-0.5px;}
.area_visual .visual_text div p {font-size: 18px; letter-spacing:-0.5px;}
.area_visual .visual_text ul {display:inline-block; float:right; width:230px; padding-top:20px;}
.area_visual .visual_text ul li a {display:block; padding-left:100px; line-height:75px; font-size:16px; font-weight:400; color:#fff; border-radius:10px; transition:all .3s}
.area_visual .visual_text ul li+li {margin-top:5px}
.area_visual .visual_text ul li:nth-child(1) a {background:url(../images/main/main_icon01.png) no-repeat left 40px center rgba(0, 0, 0, .2)}
.area_visual .visual_text ul li:nth-child(2) a {background:url(../images/main/main_icon02.png) no-repeat left 40px center rgba(0, 0, 0, .2)}
.area_visual .visual_text ul li:nth-child(3) a {background:url(../images/main/main_icon03.png) no-repeat left 40px center rgba(0, 0, 0, .2)}

.area_visual .visual_text ul li:nth-child(1) a:hover {background:url(../images/main/main_icon01.png) no-repeat left 40px center rgba(0, 0, 0, .5)}
.area_visual .visual_text ul li:nth-child(2) a:hover {background:url(../images/main/main_icon02.png) no-repeat left 40px center rgba(0, 0, 0, .5)}
.area_visual .visual_text ul li:nth-child(3) a:hover {background:url(../images/main/main_icon03.png) no-repeat left 40px center rgba(0, 0, 0, .5)}


@keyframes scaleZoom {
	
	from {
		 transform:scale(1.3, 1.3)
	}

	to {
		 transform:scale(1.1, 1.1)
	}

}



/*********************************** ¿µ¹® *************************************/
.html_eng .area_visual .visual_text div {width:70%;}
.html_eng .area_visual .visual_text div h1 {margin:30px 0; line-height:1}






@media all and (max-width:1280px){

	.area_visual .inr {width: 80%; margin:0 auto; padding-top:90px}
	.area_visual .visual_text { padding-top:18vh}
	.area_visual .visual_text > * {width:70%;}

	.area_visual .bx-controls .bx-controls-direction a {margin-top:-25px; width:50px; height:50px;}
	.area_visual .bx-controls .bx-controls-direction .bx-prev {left:30px; background-size:auto 100%;}
	.area_visual .bx-controls .bx-controls-direction .bx-next {right:30px; background-size:auto 100%;}

}


@media all and (max-width:1080px){

	.area_visual .visual_text {padding-top:20%}
	.area_visual .visual_text>div {width:70%; padding-right:50px}
	.area_visual .visual_text div h1 {font-size:55px; line-height:normal;}
	.area_visual .visual_text>ul {width:30%;}

	.area_visual .visual_text ul li:nth-child(1) a {background:url(../images/main/main_icon01.png) no-repeat left 40px center rgba(0, 0, 0, .5)}
	.area_visual .visual_text ul li:nth-child(2) a {background:url(../images/main/main_icon02.png) no-repeat left 40px center rgba(0, 0, 0, .5)}
	.area_visual .visual_text ul li:nth-child(3) a {background:url(../images/main/main_icon03.png) no-repeat left 40px center rgba(0, 0, 0, .5)}

	.area_visual .visual_text ul li:nth-child(1) a:hover {background:url(../images/main/main_icon01.png) no-repeat left 40px center rgba(0, 0, 0, .7)}
	.area_visual .visual_text ul li:nth-child(2) a:hover {background:url(../images/main/main_icon02.png) no-repeat left 40px center rgba(0, 0, 0, .7)}
	.area_visual .visual_text ul li:nth-child(3) a:hover {background:url(../images/main/main_icon03.png) no-repeat left 40px center rgba(0, 0, 0, .7)}

	.html_eng .area_visual .visual_text div h1 {margin:20px 0; line-height:1}


}


@media all and (max-width:850px){
	
	.area_visual .visual_text div p br {display:none}

}

@media all and (max-width:767px){
	
	.area_visual .inr {padding:80px 20px}

	.area_visual .bx-controls .bx-controls-direction a {top:35%; margin-top:0px; width:20px; height:30px;}
	.area_visual .bx-controls .bx-controls-direction .bx-prev {left:20px}
	.area_visual .bx-controls .bx-controls-direction .bx-next {right:20px}

	.area_visual .visual_text {padding-top:10vh}
	.area_visual .visual_text>div {width:100%; padding-right:0}
	.area_visual .visual_text div span {font-size:12px;}
	.area_visual .visual_text div h1 {margin:10px 0; font-size:45px;}
	.area_visual .visual_text div p {font-size:15px; word-break:keep-all}
	.area_visual .visual_text div p br {display:block;}
	.area_visual .visual_text>ul {width:100%; padding-top:30px; }

	.area_visual .visual_text ul li a {font-size:14px; padding-left:80px; line-height:65px}

	.area_visual .visual_text ul li:nth-child(1) a {background:url(../images/main/main_icon01.png) no-repeat left 30px center rgba(0, 0, 0, .5); background-size:30px;}
	.area_visual .visual_text ul li:nth-child(2) a {background:url(../images/main/main_icon02.png) no-repeat left 30px center rgba(0, 0, 0, .5); background-size:23px;}
	.area_visual .visual_text ul li:nth-child(3) a {background:url(../images/main/main_icon03.png) no-repeat left 30px center rgba(0, 0, 0, .5); background-size:23px;}

	.area_visual .visual_text ul li:nth-child(1) a:hover {background:url(../images/main/main_icon01.png) no-repeat left 30px center rgba(0, 0, 0, .7); background-size:30px;}
	.area_visual .visual_text ul li:nth-child(2) a:hover {background:url(../images/main/main_icon02.png) no-repeat left 30px center rgba(0, 0, 0, .7); background-size:23px;}
	.area_visual .visual_text ul li:nth-child(3) a:hover {background:url(../images/main/main_icon03.png) no-repeat left 30px center rgba(0, 0, 0, .7); background-size:23px;}

	

	.html_eng .area_visual .visual_text div {width:100%;}



	
}

@media all and (max-width:600px){
	
	.area_visual .visual_text div span {font-size:10px; letter-spacing:10px;}
	.area_visual .visual_text div h1 {font-size:35px;}
	.area_visual .visual_text div p br {display:none}
	
}


@media all and (max-width:500px){
	
	.area_visual .inr {padding:65px 20px}

}

@media all and (max-width:420px){
	
}