@charset "utf-8";

/* ======================================================
   .msec-visual
=========================================================*/
.msec-visual{position:relative;}

.msec-visual .img{}
.msec-visual .img img{width:100%;min-height:800px;object-fit:cover;transform:scale(1.25, 1.25); -webkit-transform:scale(1.25, 1.25); -moz-transform:scale(1.25, 1.25); -ms-transform:scale(1.25, 1.25);-webkit-transition: transform 5s ease-in-out;-moz-transition: transform 5s ease-in-out;-o-transition: transform 5s ease-in-out;transition: transform 5s ease-in-out;}

.msec-visual .abr{position:Absolute; left:50%; width:100%; z-index:12;max-width:1700px;box-sizing:border-box; top:0; height:100%;-webkit-transform: translateX(-50%); -moz-transform: translateX(-50%);-ms-transform: translateX(-50%); -o-transform:  translateX(-50%);transform: translateX(-50%);}
.msec-visual .abr .txt{position:Absolute;right:0; top:0 ;height:100%;background:rgba(0,0,0,0.7); width:600px; box-sizing:border-box; padding:0 20px; display:flex;align-items: center; justify-content: center;}
.msec-visual .abr .txt .vc{width:100%; text-align:center;}
.msec-visual .abr .txt .btxt{font-size:28px; font-weight:400; color:#fff; letter-spacing:-0.03em; line-height:1.3em;}
.msec-visual .abr .txt .stxt{font-size:70px; font-weight:800; color:#fff; letter-spacing:-0.03em; line-height:1.3em; margin-top:10px;}
.msec-visual .abr .txt a{line-height:65px; padding:0 22px; font-size:25px; font-weight:700; color:#fff;letter-spacing:-0.01em;box-sizing:border-box;  background:#696969; display:inline-block;vertical-align:top; margin-top:45px; width:400px; border-radius:65px;}
.msec-visual .abr .txt a:hover{background:#fff; color:#696969; }
	@media only screen and (max-width:1210px) {
		.msec-visual .img img{min-height:700px}
		.msec-visual .abr .txt{width:500px;}
		.msec-visual .abr .txt .btxt{font-size:24px;}
		.msec-visual .abr .txt .stxt{font-size:60px; }
		.msec-visual .abr .txt a{ font-size:21px;line-height:60px; padding:0 20px;  margin-top:35px; width:320px; border-radius:60px;}
	}
	@media only screen and (max-width:999px) {
		.msec-visual .img img{min-height:600px}

		.msec-visual .abr{position:relative; background:#383244; left:auto; top:auto; width:auto; height:auto;-webkit-transform: translateX(0); -moz-transform: translateX(0);-ms-transform: translateX(0); -o-transform:  translateX(0);transform: translateX(0);}
		.msec-visual .abr .txt{position:relative; right:auto; top:auto; height:auto; background:none; width:auto; padding:40px 30px; display:block;}

		.msec-visual .abr .txt .btxt{font-size:20px;}
		.msec-visual .abr .txt .stxt{font-size:50px; }
		.msec-visual .abr .txt .stxt br{display:none;}
		.msec-visual .abr .txt a{ font-size:18px;line-height:52px; padding:0 15px;  margin-top:25px; width:260px; border-radius:52px;}
	}
	@media only screen and (max-width:680px) {
		.msec-visual .img img{min-height:500px}
		.msec-visual .abr .txt{padding:30px 25px}
		.msec-visual .abr .txt .btxt{font-size:18px;}
		.msec-visual .abr .txt .stxt{font-size:40px;margin-top:5px;}
		.msec-visual .abr .txt a{ font-size:16px;line-height:44px;  margin-top:15px; width:210px; border-radius:44px;}
	}
	@media only screen and (max-width:480px) {
		.msec-visual .img img{min-height:420px}
		.msec-visual .abr .txt .btxt{font-size:16px;}
		.msec-visual .abr .txt .stxt{font-size:32px; }
		.msec-visual .abr .txt a{ font-size:14px;line-height:38px;  margin-top:15px; width:180px; border-radius:38px;}
	}
	@media only screen and (max-width:420px) {
		
	}


.visual-slide .slick-dots{position:absolute; left:50%; width:100%; z-index:212;max-width:1700px;box-sizing:border-box; bottom:50px; height:auto;-webkit-transform: translateX(-50%); -moz-transform: translateX(-50%);-ms-transform: translateX(-50%); -o-transform:  translateX(-50%);transform: translateX(-50%);}
.visual-slide .slick-dots ul{position:Absolute;right:0; top:0 ;width:600px;display:block; font-size:0; margin:0; padding:0;height:15px ;box-sizing:border-box; }
.visual-slide .slick-dots li{display:inline-block;vertical-align:top; margin:0; padding:0; width:auto; height:auto;}
.visual-slide .slick-dots li:nth-child(n+2){margin-left:15px;}
.visual-slide .slick-dots li button{border:2px solid rgba(255,255,255,2); box-sizing:border-box; background:none; width:15px;height:15px; padding:0; position:relative; border-radius:100%}
.visual-slide .slick-dots li.slick-active button{background:#fff;}
	@media only screen and (max-width:1210px) {
		.visual-slide .slick-dots{bottom:45px;}
		.visual-slide .slick-dots ul{width:500px;height:11px;}
		.visual-slide .slick-dots li button{width:11px;height:11px;}
	}
	@media only screen and (max-width:999px) {
		.visual-slide .slick-dots{margin-top:25px;position:relative; left:auto; width:auto; max-width:none; bottom:auto;-webkit-transform: translateX(0); -moz-transform: translateX(0);-ms-transform: translateX(0); -o-transform:  translateX(0);transform: translateX(0);}
		.visual-slide .slick-dots ul{position:Relative; right:auto; top:auto; display:block; width:100%; text-align:center;height:9px;}
		.visual-slide .slick-dots li button{border-color:#696969}
		.visual-slide .slick-dots li.slick-active button{background:#696969;}
		.visual-slide .slick-dots li:nth-child(n+2){margin-left:10px;}
		.visual-slide .slick-dots li button{width:9px;height:9px;}
	}
	@media only screen and (max-width:680px) {
		.visual-slide .slick-dots{margin-top:15px;}
	}
	@media only screen and (max-width:480px) {

	}

.msec-visual.ani .slick-active.item .img img{transform:scale(1,1); -webkit-transform:scale(1,1); -moz-transform:scale(1,1); -ms-transform:scale(1,1);}
	




/* ======================================================
   .msec-cont
=========================================================*/
.msec-cont{position:relative; padding-top:75px;}
	@media only screen and (max-width:1210px) {
		.msec-cont{ padding-top:60px;}
	}
	@media only screen and (max-width:999px) {
		.msec-cont{ padding-top:45px;}
	}
	@media only screen and (max-width:680px) {
		.msec-cont{ padding-top:35px;}
	}
	@media only screen and (max-width:480px) {

	}






/* ======================================================
   .msec-01
=========================================================*/
.msec-01{}
.msec-01 .cont{padding-left:33.333333%; position:Relative;}
.msec-01 .img{position:absolute; left:0; top:0; width:33.33333333%; height:300px; overflow:hidden;}
.msec-01 .img img{width:100%;height:300px;object-fit:cover;}
.msec-01 .txt{height:300px;display:flex;align-items: center; justify-content: center; background:url('/skins/img/main/curri-bg.png') no-repeat center top #696969; background-size:cover;}
.msec-01 .txt .vc{width:100%;text-align:center;}
.msec-01 .txt .btxt{font-size:20px;font-weight:400; color:#fff; letter-spacing:-0.03em; line-height:1.2em;}
.msec-01 .txt .stxt{font-size:45px;font-weight:800; color:#fff; letter-spacing:-0.03em; line-height:1.2em; margin-top:15px;}
.msec-01 .txt a{line-height:48px; padding:0 22px; font-size:18px; font-weight:600; color:#fff;letter-spacing:-0.01em; height:50px; box-sizing:border-box; border:1px solid #fff; display:inline-block;vertical-align:top; margin-top:30px;}
.msec-01 .txt a:hover{background:#fff; color:#696969}
	@media only screen and (max-width:1210px) {
		.msec-01 .txt .btxt{font-size:18px;}
		.msec-01 .txt .stxt{font-size:40px;}
		.msec-01 .txt a{font-size:16px; height:44px; line-height:42px;}
	}
	@media only screen and (max-width:999px) {
		.msec-01 .cont{padding-left:0}
		.msec-01 .img{position:relative; width:auto; height:auto;}
		.msec-01 .img img{width:100%; height:auto; object-fit:fill}

		.msec-01 .txt{height:auto; padding:40px 20px;}
		.msec-01 .txt .btxt{font-size:16px;}
		.msec-01 .txt .stxt{font-size:35px;margin-top:10px;}
		.msec-01 .txt a{font-size:14px; height:38px; line-height:36px; padding:0 20px; margin-top:20px;}
	}
	@media only screen and (max-width:680px) {
		.msec-01 .txt{padding:30px 20px;}
		.msec-01 .txt .btxt{font-size:14px;}
		.msec-01 .txt .stxt{font-size:30px; padding:0 25px}
	}
	@media only screen and (max-width:480px) {
		.msec-01 .txt .stxt{font-size:25px;}
	}


	

/* ======================================================
   .msec-02
=========================================================*/
.msec-02{margin-top:65px;}
.msec-02 ul{}
.msec-02 ul:after{display:block; content:"";clear:both;}
.msec-02 li{float:left; width:33.333333333%}
.msec-02 li a{display:block;display:flex;align-items: center; justify-content: center;height:315px;background:#484849;}
.msec-02 li .img{overflow:hidden;}
.msec-02 li .img img{width:100%;height:315px;object-fit:cover;transform:scale(1.1);  transition:transform 1.5s cubic-bezier(.33,.02,0,.93)}
.msec-02 li .txt{width:100%; text-align:Center;}
.msec-02 li .txt .btxt{font-size:45px;font-weight:800; color:#fff; letter-spacing:-0.03em; line-height:1.2em;}
.msec-02 li .txt .stxt{font-size:20px;font-weight:400; color:#fff; letter-spacing:-0.03em; line-height:1.4em; margin-top:20px;}

.msec-02 li:hover .img img{transform:scale(1.1) translateX(4%)}
.msec-02 li:hover a{background:#696969}
	@media only screen and (max-width:1210px) {
		.msec-02{margin-top:50px;}
		.msec-02 li a{height:280px;}
		.msec-02 li .img img{height:280px;}
		.msec-02 li .txt .btxt{font-size:40px;}
		.msec-02 li .txt .stxt{font-size:18px; margin-top:15px;}
	}
	@media only screen and (max-width:999px) {
		.msec-02{margin-top:40px;}
		.msec-02 li{float:none; width:auto; position:relative;}
		.msec-02 li:nth-child(n+2){margin-top:20px;}
		.msec-02 li a{height:240px; position:relative; padding-left:240px;}
		.msec-02 li .img{position:absolute; left:0; top:0; width:240px; z-index:12;}
		.msec-02 li .img img{height:240px;}
		.msec-02 li .txt{text-align:left; padding:0 40px;}
		.msec-02 li .txt .btxt{font-size:35px;}
		.msec-02 li .txt .btxt br{display:none;}
		.msec-02 li .txt .stxt{font-size:16px; margin-top:10px;}
		.msec-02 li .txt .stxt br{display:none;}
	}
	@media only screen and (max-width:680px) {
		.msec-02{margin-top:30px;}
		.msec-02 li a{height:200px;padding-left:200px;}
		.msec-02 li .img{width:200px;}
		.msec-02 li .img img{height:200px; }
		.msec-02 li .txt{padding:0 30px;}
		.msec-02 li .txt .btxt{font-size:30px;}
		.msec-02 li .txt .stxt{margin-top:5px;font-size:15px;}
	}
	@media only screen and (max-width:480px) {
		.msec-02 li a{height:160px;padding-left:140px;}
		.msec-02 li .img{width:140px;}
		.msec-02 li .img img{height:160px;}

		.msec-02 li .txt{padding:0 20px;}
		.msec-02 li .txt .btxt{font-size:24px;}
		.msec-02 li .txt .stxt{font-size:14px;}
	}
	

