@charset "utf-8";
.popup_layer a{color: inherit}
.main_paging{position: fixed;bottom: 40px;;right: 52px;transition: 1s;z-index: 3}
.main_paging li{position: relative;margin-bottom: 15px}
.main_paging li:after{content: '';display: block;width: 31px;height: 12px;background: url(/img/main/pag.png);position: absolute;right: 0;top:0;transition: 0.3s}
.main_paging li a{display: block;padding-right: 42px;text-align: right;color: #fff;font-size: 15px;letter-spacing: -0.5px;opacity: 0;transition: 0.3s}
.main_paging li.on a{opacity: 1;}
.main_paging li:hover a{opacity: 1;}
.main_paging li:hover:after{;background: url(/img/main/pag_hover.png);}
.main_paging li.on:after{;background: url(/img/main/pag_hover.png);}
.main_visual {width: 100%;height: 970px;overflow: hidden;position: relative;padding-top: 420px;}
.main_visual img{transform: scale(1.05);transition: 6s}
.main_visual.on img{transform: scale(1.0)}
.main_visual .txt{text-align: center}
.main_visual .txt > *{display: block}
.main_visual .txt > span{color: #fff;font-size: 23px;letter-spacing: -0.5px;opacity: 0;transition: 1.2s linear}
.main_visual.on .txt > span{opacity: 1}
.main_visual .txt > strong{letter-spacing: -0.5px;font-size: 38px;letter-spacing: -0.25px;width: 0;display: block;margin: 0 auto;background: #013274;overflow: hidden;transition: 1s ease-in-out;margin-top: 30px;transition-delay: 0.8s}
.main_visual.on .txt > strong{width: 373px;}
/*
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.main_visual .txt > strong{padding-top: 40px;}
}
*/
.main_visual .txt > strong > span{color: #fff;font-size: 23px;letter-spacing: -0.5px;font-size: 38px;letter-spacing: -0.25px;text-align: center;margin: 0 auto;text-shadow: 2px 2px 6px rgba(0,0,0,0.5);display: block;width: 373px;opacity: 0;transition: 1s;transition-delay: 1.8s; display: block; line-height: 68px; padding-bottom: 5px; }
.main_visual.on .txt > strong > span{opacity: 1}
.main_visual .bg_img{position: absolute;top:0;z-index: -1;left: 50%;margin-left: -960px;}
.main_con {width: 100%;height: 700px;overflow: hidden;position: relative;box-sizing: border-box;padding-top: 390px;}
.main_con .bg_img{position: absolute;top:0;z-index: -1;left: 50%;margin-left: -960px;}
/*.main_con. .bg_img{position: absolute;top:0;z-index: -1;left: 50%;margin-left: -960px;}*/
.main_con .bg_img img{width: 100%}
/*transition: 6s;transform: scale(1.05)*/
.wrap_con{width: 1200px;margin: 0 auto;}
/*.main_con.on .bg_img{transform: scale(1)}*/
.wrap_con > div{float: left}
.wrap_con:after{content: '';display: block;clear: both}
.wrap_con div ul{padding-left: 92px;padding-top: 45px;}
.wrap_con div ul:after{content: '';display: block;clear: both}
.wrap_con div ul li{float: left;margin-right: 138px;position: relative;left: 30px;transition: 1s ease-in-out;opacity: 0; top: -6px; }

.main03 .wrap_con div ul li:nth-child(1){top: -23px;}
.wrap_con div ul li:last-child{margin-right: 0}
.wrap_con div ul li:first-child{transition-delay: 1.4s}
.wrap_con div ul li:nth-child(2){transition-delay: 1.7s}
.wrap_con div ul li:nth-child(3){transition-delay: 2s}
.main_con.on .wrap_con div ul li{left: 0;opacity: 1}
.wrap_con div ul li:last-child{margin-right: 0;}
.wrap_con div strong,.wrap_con div > span{display: block;color: #fff;position: relative}
.wrap_con div strong:after{content: '';display: inline-block;width: 11px;height: 11px;border: 2px solid #fff;border-radius: 50%;vertical-align: top; top: 25px; left: 226px;position: absolute;opacity: 0;transition: 1s linear;transition-delay: 1.4s; display: none}
.main_con.on .wrap_con div strong:after{opacity: 1 }
.main02 .wrap_con div strong:after{left: 305px;}
.wrap_con div > span{font-family: 'Titillium Web', sans-serif;font-size: 20px;transition: 1s ease-in-out;opacity: 0;top: 30px;position: relative}
.main_con.on .wrap_con div > span{opacity: 1;top:0}
.wrap_con div strong{font-size: 35px;letter-spacing: -0.5px;line-height: 48px;margin-top: 29px;opacity: 0;position: relative;top: 30px;transition: 1s ease-in-out; transition-delay: 0.4s}
.main_con.on .wrap_con div strong{opacity: 1;top: 0}
.wrap_con div ul li a:before{content: ''; display: block; width: 7px; height: 7px; border-radius: 50%; background: #fff; top: 50%; margin-top: -3.5px; left: -20px; position: absolute}
/*.wrap_con div ul li a{display: block;min-width: 195px;background: #082247;padding: 5px 0;position: relative}*/
/*
.wrap_con div ul li a:before{content: ''; display: block; position: absolute; top: 0; width: 25px; height: 65px; background: url(/img/main/btn_left.png); left: -25px}
.wrap_con div ul li a:after{content: ''; display: block; position: absolute; top: 0; width: 25px; height: 65px; background: url(/img/main/btn_right.png); right: -25px; }
*/

/*
.wrap_con div ul li:nth-child(2n) a{background: #023274}
.wrap_con div ul li:nth-child(2n) a:before{content: ''; display: block; position: absolute; top: 0; width: 25px; height: 65px; background: url(/img/main/btn_left2.png); left: -25px}
.wrap_con div ul li:nth-child(2n) a:after{content: ''; display: block; position: absolute; top: 0; width: 25px; height: 65px; background: url(/img/main/btn_right2.png); right: -25px; }
*/


/*.wrap_con div ul li a span{line-height: 53px;font-size: 18px;letter-spacing: -0.3px;text-shadow: 2px 2px 4px rgba(0,0,0,0.2);color: #fff; border-top: 1px solid #53657f; border-bottom: 1px solid #53657f; display: block;padding-left: 15px;padding-right: 40px}*/

.wrap_con div ul li a i{display: inline-block;width: 30px;height: 9px;background: url(/img/main/arrow.png);right: -48px;position: absolute;top:26px;transition: 0.5s;z-index: 3; top: 50%; margin: -8px}
.wrap_con div ul li:hover a i{right: -58px; }
.popup_layer img{max-width: 100% !important}
.popup_layer table{width: 100%}

@media (max-width: 1920px){
	.main_con .bg_img{width: 1920px}
}
@media (max-width: 1700px){
	.main_paging{right: 0}
}
@media (max-width: 1216px){
	.wrap_con{width: 100%;padding: 0 20px;}
	.wrap_con div ul li{margin-right: 20px;}
	.wrap_con div ul{padding-left: 71px;}
	.main02 .wrap_con div strong:after{left: 267px;}
	.main_visual .bg_img{top:50%;margin-top: -485px;}
	.main_con .bg_img{top:50%;margin-top: -350px;}
    .popup_layer{left: 20px !important;top: 20px !important;height: auto;max-width: 90%;width: 90% !important}
    .popup_layer{left: 20px !important;top: 20px !important;height: auto;max-width: 90%}
    #pop-layer-3-body, #pop-layer-4-body{height: auto !important}
    
}
@media (max-width: 850px){
/*    .wrap_con div ul li a span{padding-left: 10px;padding-right: 10px;}*/
/*    .wrap_con div ul li a:before,.wrap_con div ul li a:after, .wrap_con div ul li:nth-child(2n) a:before, .wrap_con div ul li:nth-child(2n) a:after{display: none}*/
	.main_visual{height: 480px;padding-top: 200px}
	.main_visual .txt > strong {margin-top: 15px;padding: 15px 0}
	.main_visual.on .txt > strong{width: 272px}
	.main_visual .txt > strong > span {
		font-size: 23px;
		font-size: 26px;
		width: 249px;
	}
    .wrap_con div ul li img{height: 40px;}
	.main_visual .txt > span{font-size: 18px}
	.main_con{height: 400px;padding-top: 180px}

	.wrap_con div > span{font-size: 14px}
	.wrap_con div strong{font-size: 28px;line-height: 42px}
    .wrap_con div strong br{display: none}
    /*
	.wrap_con div ul li a {
		width: 151px;
		height: 65px;
		background: url(/img/main/btn_bg.jpg);
		line-height: 65px;
		padding: 0 25px;
		background-size: 151px auto;
		background-repeat: no-repeat;
		height: 47px;
	}
	.wrap_con div ul li a span{font-size: 12px;line-height: 38px;}
*/
	.wrap_con div strong{margin-top: 10px}
	.wrap_con > div{float: none}
	.wrap_con div ul li a{line-height: 47px;padding: 0 10px;}
	.wrap_con div ul li a i{width: 20px;background-size: 20px auto;background-repeat: no-repeat;right: -10px; margin-top: -11px; }
	.wrap_con div ul{padding-left: 0}
	.wrap_con div strong:after{display: none}
	.main_con.main02{height: 430px;}
	.main_con.main02 .bg_img{margin-top: -375px}
	.wrap_con div ul li{margin-bottom: 10px}
	.main_paging{display: none}
    .main03 .wrap_con div ul li:nth-child(1) img{height: 50px}
    .wrap_con div ul li a:before{display: none}
/*
.wrap_con div ul li a {
    width: 125px;
    height: 65px;
    background: url(/img/main/btn_bg.jpg);
    background: #082247; 
    line-height: 40px;
    padding: 0 25px;
    background-size: 125px auto;
    background-repeat: no-repeat;
    height: 40px;
	padding-left: 10px;
}
*/
    .main03 .wrap_con div ul li:nth-child(1){top: -10px; }
	.wrap_con div ul{padding-top: 49px;}
/*	.wrap_con div ul li a i{top:15px;}*/
	.wrap_con div ul li a{padding-right: 10px;}
    
    .wrap_con div ul li{margin-right: 32px; }
    .main_con{padding-top: 92px}
}
