.inr{width:1500px; margin:0 auto;}

/* visual */
.area_visual{position:relative; width:100%; height: calc(100vh - 100px); background-size: cover; background-position:50%;}
.area_visual .inr{position:relative; height: calc(100vh - 100px); margin:0 auto;}
.area_visual .inr ul{position:absolute; right:0; bottom:20%; width:600px;}
.area_visual .inr ul li{position:relative; margin-right:300px; width:300px; height:205px; background:#08495d;}
.area_visual .inr ul li:last-child{margin-left:300px; background:#2881ee; right:0;}
.area_visual .inr ul li a{box-sizing:border-box; display:block; width:100%; height:100%; padding:30px; color:#fff;}
.area_visual .inr ul li a i{position:absolute; right:30px; bottom:30px;}
.area_visual .inr ul li a i img{height:33px;}
.area_visual .inr ul li a h3{margin-bottom:10px; font-size:22px; }
.area_visual .inr ul li a p{font-weight:300; word-break:keep-all;}
.area_visual .inr h2{position:absolute; top:35%; left:0; font-size:40px; color:#fff;}

.main_visual .img {height: 100vh;}
.main_visual .swiper-slide .img {height: 100vh; width: 100%; overflow: hidden;}
.main_visual .swiper-slide-active .img {animation:visualScale 8s both;}
.main_visual .mVis1 {background: url('../images/main/main_visual01.jpg') no-repeat center/cover;}
.main_visual .mVis2 {background: url('../images/main/main_visual01.jpg') no-repeat center/cover;}
.main_visual .main_txt {position: absolute; top: 40%; width: 100%;}
.main_visual .m_txt {max-width: 1500px; margin: 0 auto; color: #fff; animation: fadeup 1.2s 0.2s ease backwards;}
.main_visual .m_txt em {font-size: 22px; text-shadow: rgba(0, 0, 0, 1) 0px 0px 30px; font-weight: 600;}
.main_visual .m_txt h1 {font-size: 65px; line-height: 1.2em; text-shadow: rgba(0, 0, 0, 0.6) 0px 0px 30px; word-break: keep-all;}
/*
.main_visual .swiper-slide-active .m_txt h1 {animation: fadeup 1.8s;}
.main_visual .swiper-slide-active .m_txt p {animation: fadeup 1.8s 0.5s ease backwards;}
*/

.main_visual .scroll_ani span {font-size: 16px; font-weight: 400; color: #fff; display: block;}
.main_visual .scroll_ani {position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 90;}
.main_visual .scroll_ani i {display:block; position:relative; overflow:hidden; width:1px; height:88px; margin:0 auto; margin-top:10px; background:rgba(255,255,255,0.2);}
.main_visual .scroll_ani i:after{content:''; position:absolute; width:1px; height:20px; background:#fff; animation: scrollbar 3s infinite;}



.sec01 {position: relative; display: block; height: 100vh;}
.sec01 .list_wrap {position: relative; display: flex; flex-wrap: wrap; height: 100%;}
.sec01 .list_wrap .list {width: calc(100% / 3); overflow: hidden; transition: all .5s;}
.sec01 .list_wrap .list:hover {background-size: cover;}
.sec01 .list_wrap .list a {position: relative; display: block;; width: 100%; height: 100%;}
.sec01 .list_wrap .list a:hover .text_box {transform: translateY(-30px);}
.sec01 .list_wrap .list .text_box {padding: 0 100px; color: #fff; display: flex; flex-direction: column; justify-content: flex-end; height: 100%; text-shadow: rgba(0,0,0,0.7) 0 0 55px; transition: .5s;}
.sec01 .list_wrap .list .num {font-size: 30px; font-weight: 600;}
.sec01 .list_wrap .list .eng {font-size: 40px; font-weight: 600; text-transform: uppercase;}
.sec01 .list_wrap .list .tit {font-size: 22px; font-weight: 300; margin-bottom: 195px;}
.sec01 .list_wrap .list:nth-child(1) {background: url(../images/main/sec1_1.jpg)no-repeat center/cover;}
.sec01 .list_wrap .list:nth-child(2) {background: url(../images/main/sec1_2.jpg)no-repeat center/cover;}
.sec01 .list_wrap .list:nth-child(3) {background: url(../images/main/sec1_3.jpg)no-repeat center/cover;}

.sec02 {position: relative; display: block; height: 100vh; background: url(../images/main/sec2_bg2.jpg) no-repeat center/cover;}
.sec02 .con_tit {margin-bottom: 85px; text-align: center; color: #fff; padding-top: 100px;}
.sec02 .con_tit h2 {font-size: 50px; font-weight: 600; text-transform: uppercase; line-height: 100px;}
.sec02 .con_tit p {font-size: 20px; font-weight: 300;}
.sec02 .con_tit p em {font-weight: 500;}
.sec02 .notice_wrap {position: relative; display: block;}
.sec02 .notice_wrap ul {position: relative; display: flex; justify-content: space-between;}
.sec02 .notice_wrap ul li {position: relative; display: flex; width: 32%; background: #fff; box-shadow: rgba(0,0,0,0.3) 0 0 15px; min-height: 430px; box-sizing: border-box; overflow: hidden;}
/*.sec02 .notice_wrap ul li a {width: 100%; padding: 50px;}*/
.sec02 .notice_wrap ul li .text {position: relative; padding: 50px; width: 100%;}
.sec02 .notice_wrap ul li .text p {font-size: 26px; font-weight: 600; color: #222; padding: 50px 0 30px; border-bottom: 1px solid #e50213; margin: 0 0 50px;}
.sec02 .notice_wrap ul li .text span {font-size: 16px;}
.sec02 .notice_wrap ul li .go_notice {position: absolute; width: 50px; height: 50px; background: #e50213; display: block; right: 0; bottom: 0;}
.sec02 .notice_wrap ul li .go_notice img {padding: 15px; transition: .5s;}
.sec02 .notice_wrap ul li .go_notice:hover img {transform: rotate(180deg);}



@media screen and (max-width:1580px){
	.inr{width:95%; margin:0 auto;}
	
	.main_txt {width: 90%;}
	.main_visual .m_txt {margin: 0 30px;}
	.main_visual .m_txt em {font-size: 20px;}
	.main_visual .m_txt h1 {font-size: 50px; padding-top: 10px;}
}

@media screen and (max-width:1380px) {
	.sec01 .list_wrap .list .text_box {padding: 0 60px;}
}

@media all and (max-width:1280px){
	.area_visual .inr,
	.area_visual{height:100vh;}
	.area_visual .inr ul{bottom:5%; right:auto; left:50%; transform: translateX(-50%); }
	.area_visual .inr ul li{background:#08495d}
	.area_visual .inr h2{top:30%; width:100%; text-align:center;}
	
	
	.sec02 .notice_wrap ul li {min-height: 370px;}
	.sec02 .notice_wrap ul li .text {padding: 40px;}
	.sec02 .notice_wrap ul li .text p {font-size: 24px;}
}

@media all and (max-width:768px){
	.area_visual .inr h2{font-size:28px}
	.area_visual .inr ul{width:90%;}
	.area_visual .inr ul li{width:50%; margin-right:50%;}
	.area_visual .inr ul li:last-child{margin-left:50%;}
	
	.main_visual .m_txt h1 {font-size: 42px;}
	
	.sec01 {height: 80vh;}
	.sec01 .list_wrap {flex-direction: column;}
	.sec01 .list_wrap .list {width: 100%; height: calc(100% / 3); background-size: cover !important;}
	.sec01 .list_wrap .list .text_box {padding: 0 40px; justify-content: center;}
	.sec01 .list_wrap .list .num {font-size: 22px;}
	.sec01 .list_wrap .list .eng {font-size: 32px;}
	.sec01 .list_wrap .list .tit {font-size: 18px; font-weight: 300; margin-bottom: 0;}
	
	.sec02 {height: 80vh;}
	.sec02 .con_tit {margin-bottom: 55px; padding-top: 60px;}
	.sec02 .con_tit h2 {font-size: 40px; line-height: 80px;}
	.sec02 .con_tit p {font-size: 18px;}
	.sec02 .notice_wrap ul li .text {padding: 30px;}
	.sec02 .notice_wrap ul li .text p {font-size: 20px; font-weight: 700; padding: 20px 0 25px; margin: 0 0 30px;}
	
}

@media all and (max-width:600px){
	.area_visual .inr ul li{width:100%; height:auto; margin-right:0;}
	.area_visual .inr ul li:last-child{margin-left:0;}
	.area_visual .inr ul li a h3{font-size:18px;}
	.area_visual .inr ul li a i{bottom:auto; top:25px;}
	.area_visual .inr ul li:first-child img{height:25px;}
	
	.main_visual .m_txt h1 {font-size: 36px;}
	
	.sec02 .notice_wrap ul {flex-direction: column;}
	.sec02 .notice_wrap ul li {width: 100%; min-height: 100px; margin-bottom: 20px;}
	.sec02 .notice_wrap ul li .text {padding: 0 30px; display: flex; align-items: center;}
	.sec02 .notice_wrap ul li .text p {border-bottom: none; margin: 0; padding: 0; font-size: 18px;}
	.sec02 .notice_wrap ul li .text span {display: none;}
	.sec02 .notice_wrap ul li .go_notice {right: 20px; width: 40px; height: 40px; top: 50%; transform: translateY(-50%);}
	.sec02 .notice_wrap ul li .go_notice img {transform: scale(.8); padding: 10px;}
}


@media all and (max-width:480px){
	.area_visual .inr h2{font-size:22px; word-break:keep-all;}
	.area_visual .inr h2 br{display:none;}
	.area_visual .inr ul li a h3{font-size:16px;}
}

@media all and (max-width:420px){
	.area_visual .inr ul li a{padding:20px;}
	.area_visual .inr ul li a i{top:20px; right:20px;}
	.area_visual .inr ul li a i img{height:25px;}
}

@media all and (max-width:375px){
/*	.inr {width: 90%;}*/
	.sec02 {height: 80vh;}
	.sec02 .con_tit {padding-top: 40px;}
	.sec02 .con_tit h2 {font-size: 36px;}
	.sec02 .notice_wrap ul li {min-height: 90px;}
	.sec02 .notice_wrap ul li .text p {font-size: 16px;}
}







@media (prefers-reduced-motion: no-preference) {
    @keyframes flow {
		from { transform: translateX(0); }
        to { transform: translateX(-50%); }
	}
}

@keyframes scrollbar {
    0% {transform: translateY(-124px);}
    100% {transform: translateY(124px);}
}

@keyframes visualScale{
	0%{transform:scale(1);}
	100%{transform:scale(1.13);}
 }
@keyframes fadeup {
    0% {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        transform: translateZ(0);
    }
}
@keyframes fadeup {
    0% {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        transform: translateZ(0);
    }
}