#mainVisual{position:relative;height:850px;background-color:#050810;}
#mainVisual .line{z-index:10;position:absolute;top:0;left:0;width:100%;height:100%;background:url(../images/main/visual-line.png) repeat-y 50% 0;}
#mainVisual .slide{position:relative;height:100%;max-width:1170px;margin:0 auto;overflow:hidden;}
#mainVisual .slide .slide-wrap{position:relative;top:0;left:0;height:100%;overflow:hidden;}
#mainVisual .slide .slide-item{display:none;float:left;position:absolute;top:0;left:0;width:100%;height:100%;}
#mainVisual .slide .slide-item .item-text{z-index:10;position:absolute;top:290px;left:0;right:0;width:100%;max-width:1170px;margin:0 auto;}
#mainVisual .slide .slide-item .item-text strong{display:block;font-size:50px;font-weight:900;color:#fff;}
#mainVisual .slide .slide-item .item-text span{display:block;margin-top:50px;font-size:18px;color:#fff;}
#mainVisual .slide .slide-item .item-text span:before{content:'';display:inline-block;width:70px;height:2px;margin-right:29px;vertical-align:5px;background-color:#ffd51a;}
#mainVisual .slide .slide-item:first-child{display:block;}

#mainVisual .experience{z-index:10;position:absolute;top:200px;right:0;padding-right:30px;text-align:right;color:#fff;}
#mainVisual .experience .exp-bar{position:absolute;top: 6px;right:0;width:5px;height:40px;background-color:#ffd51a;}
#mainVisual .experience .exp-title{font-size:50px;font-weight:900;color:inherit;}
#mainVisual .experience .exp-title i{display:inline-block;vertical-align: 10px;font-size:18px;font-weight:700;color:inherit;}
#mainVisual .experience .exp-text{display:block;margin-top:10px;color:inherit;line-height: 160%;}


#mainVisual .skill{position:absolute;top:590px;right:0;width:300px;padding-left:30px;}
#mainVisual .skill .skill-bar{position:absolute;top:0;left:0;width:5px;height:40px;background-color:#ffd51a;}
#mainVisual .skill .skill-title{display:block;height:40px;padding-top:12px;font-weight:700;color:#fff;}
#mainVisual .skill .skill-list{margin-top:10px;}
#mainVisual .skill .skill-list li{margin-top: 15px;font-weight:500;color:#b2b2b2;}


#mainVisual .slide-control{z-index:10;position:absolute;top:570px;left:50%;width:55px;height:55px;text-align:center;border-radius:100%;-ms-transform:translateX(-50%);transform:translateX(-50%);box-shadow:0 0 10px 0 rgba(0, 0, 0, 1);}
/*#mainVisual .slide-control .control-bar{position:absolute;top:50%;left:50%;width:76px;height:76px;border-radius:100%;border:2px solid rgba(255, 255, 255, 0.25);border-left-color:transparent ;-ms-transform:translate(-50%, -50%) rotate(-25deg);transform:translate(-50%, -50%) rotate(-25deg);}*/
#mainVisual .slide-control .control-bar{position:absolute;top:50%;left:50%;width:84px;height:84px;-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);}
#mainVisual .slide-control .control-bar circle{
	width:100%;height:100%;
	fill:none;
	stroke:rgba(255, 255, 255, 0.25);
	stroke-width:4px;
	stroke-linecap:round;
	stroke-dasharray:360;
	stroke-dashoffset:300;
	transform-origin:calc(50% - 2px) calc(50% - 2px);
	transform:translate(2px, 2px) rotate(0deg);
	animation: playCircle 2000ms infinite linear;
}
@keyframes playCircle {
	0%{
		stroke-dashoffset:360;
		transform:translate(2px, 2px) rotate(-90deg);
	}
	40%{
		stroke-dashoffset:130;
		transform:translate(2px, 2px) rotate(90deg);
	}
	60%{
		stroke-dashoffset:130;
		transform:translate(2px, 2px) rotate(210deg);
	}
	100%{
		stroke-dashoffset:360;
		transform:translate(2px, 2px) rotate(630deg);
	}
	
} 
#mainVisual .slide-control a{position:absolute;top:0;left:0;display:block;width:100%;height:100%;border-radius:100%;background-color:#ffd51a}
#mainVisual .slide-control a.stop{padding-top:22px;}
#mainVisual .slide-control a.play{display:none;padding-top:21px;}

#mainVisual .slide-counter{z-index:10;position:absolute;bottom:0;left:0;text-align:center;color:#000;}
#mainVisual .slide-counter .counter-number{display:inline-block;vertical-align:bottom;width:170px;height:170px;padding-top:55px;margin-right:27px;background-color:#ffd51a;}
#mainVisual .slide-counter .counter-number i{display:inline-block;font-size:70px;font-weight:700;color:inherit;}
#mainVisual .slide-counter .counter-number span{display:inline-block;vertical-align:39px;font-size:18px;color:inherit;}
#mainVisual .slide-counter .counter-bar{display:inline-block;padding-bottom:40px;}
#mainVisual .slide-counter .counter-bar:after{content:'';display:block;clear:both;}
#mainVisual .slide-counter .counter-bar a{display:inline-block;vertical-align:bottom;width:16px;}
#mainVisual .slide-counter .counter-bar a:before{content:'';display:block;width:2px;height:15px;margin:0 auto;background-color:#4f5155;transition:height 100ms ease-out;}
#mainVisual .slide-counter .counter-bar a.ov:before{height:30px;background-color:#ffd51a;}
#mainVisual .slide-counter .counter-bar a:hover:before{height:30px}

@media (max-width:1210px) {
#mainVisual .slide .slide-item{width:calc(100% - 40px);margin:0 20px;}

}

@media (max-width:1000px) {
#mainVisual{height:620px;}
#mainVisual .experience,
#mainVisual .skill{display:none;}

#mainVisual .slide .slide-item .item-text{top:150px;}
#mainVisual .slide .slide-item .item-text strong{font-size: 40px;}
#mainVisual .slide .slide-item .item-text span{margin-top:30px;}

#mainVisual .slide .slide-item .item-img{position:absolute;top:50px;right:-100px;}
#mainVisual .slide .slide-item .item-img img{max-width:none;width:800px;}

#mainVisual .slide-control{top:400px;}

#mainVisual .slide-counter{width:100%;}
#mainVisual .slide-counter .counter-number{display:none;}
}
@media (max-width:767px) {
#mainVisual .slide .slide-item .item-img{right:-200px;opacity:0.5;}
#mainVisual .slide .slide-item .item-text strong{font-size: 30px;}
#mainVisual .slide .slide-item .item-text span{font-size:14px;}
}