@charset "utf-8";

/**************************************************
	Layout CSS Document
	IEETU Web Standardization Team
	2020-08-18
**************************************************/


.cont_main {}
.cont_main .top { height:662px; background:url(../images/main/visual01.png) no-repeat center top; text-align:center; padding-top:200px; color:#fff;}
.cont_main .top h2 { font-size:62px;  font-family: 'ONE-Mobile-Title'; font-weight:normal; }
.cont_main .top h2:after {content:''; display:block; width:42px; height:1px; background:#fff; margin:6px auto 15px; opacity:.5;}
.cont_main .top p {font-size:22px;}
.cont_main .top .btn_wrap {text-align:center; display:flex; justify-content: center; margin-top:50px;}
.cont_main .top .btn_wrap a {display:inline-block; width:360px; height:100px; line-height:100px; padding:0 35px; display:flex; justify-content: space-between; align-items: center;  font-family: 'ONE-Mobile-Title';  color:#fff; font-size:22px; background:#008aff; border-radius:10px; margin:0 15px;}
.cont_main .top .btn_wrap a br {display:none;}
.cont_main .top .btn_wrap a:last-child {background:#00b135;}
.cont_main .top .btn_wrap a i {font-size:22px;}

.cont_main .bot {max-width:1400px; margin:40px auto 60px; display:flex; justify-content:space-between; }
.cont_main .bot h2 {font-size:28px; font-family: 'ONE-Mobile-Title'; margin-bottom:20px; font-weight:400; }
.cont_main .bot .notice {position:relative; width:560px;}
.cont_main .bot .notice ul {position:relative; }
.cont_main .bot .notice ul:before {content:''; display:block; width:100%; height:1px; background: linear-gradient(90deg, rgba(0,138,255,1) 0%, rgba(0,177,53,1) 100%); margin-bottom:28px;}
.cont_main .bot .notice ul li { margin:15px 0;}
.cont_main .bot .notice ul li a {display:block; position:relative; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding:0 90px 0 14px;}
.cont_main .bot .notice ul li a:before {content:''; display:block; position:absolute; left:0; top:9px; width:4px; height:4px; border:1px solid #008aff;}
.cont_main .bot .notice ul li a .date {position:absolute; right:0; top:1px; color:#777; font-size:16px;}
.cont_main .bot .notice .more {position:absolute; right:0; top:10px; font-size:16px;}
.cont_main .bot .notice .more i {font-size:14px; margin-left:6px; position:relative; top:-1px;}
.cont_main .bot .popup { width:450px; position:relative;}
.cont_main .bot .popup .nav {position:absolute; right:0; top:-53px;}
.cont_main .bot .link {width:270px;}
.cont_main .bot .link a {display:flex; position:relative; align-items:center; height:104px; border:1px solid #70b3ff; padding:20px; border-radius:10px; }
.cont_main .bot .link a:before {content:''; display:block; width:60px; height:60px; background:url(../images/main/ico01.png) no-repeat; margin-right:16px;}
.cont_main .bot .link a i {position:absolute; right:20px; top:50%; transform: translateY(-50%);}
.cont_main .bot .link a:last-child {margin-top:22px; border-color:#5ccd7d;}
.cont_main .bot .link a:last-child:before {background-image:url(../images/main/ico02.png);}




/* Tablet 1024px ~ 1259px */
@media screen and (max-width:1399px){
	.cont_main .bot { padding:0 20px;}
    .cont_main .bot .notice {width:calc(50% - 140px);}
    .cont_main .bot .popup {width:calc(50% - 100px);}
    .cont_main .bot .link {width:220px;}
}

/* Tablet 768px ~ 1023px */
@media screen and (max-width:1279px){
	
}

@media screen and (max-width:1023px){
	.cont_main .top {background-size:cover; height:500px; padding-top:170px;}
	.cont_main .top h2 {font-size:34px;}
    .cont_main .top p {font-size:17px;}
    .cont_main .top .btn_wrap { padding:0 20px;}
    .cont_main .top .btn_wrap a {width:48%; font-size:18px; height:70px; text-align:center; justify-content: center; line-height:1.2; padding:0 6px;}
    .cont_main .top .btn_wrap a i {display:none;}

    .cont_main .bot { display:block;}
    .cont_main .bot .notice {width:auto;}
    .cont_main .bot .popup {width:auto; margin:30px 0;}
    .cont_main .bot .link { width:auto;}

}

/* Mobile ~ 767px */
@media screen and (max-width:767px){
    .cont_main .top {border-bottom-right-radius:50% 10%; border-bottom-left-radius:50% 10%; }
    .cont_main .top .btn_wrap {padding:0 10px;}
	.cont_main .top .btn_wrap a {width:49%; margin:0 6px;}

    .cont_main .bot h2 {font-size:22px;}
    .cont_main .bot .notice ul li a {font-size:17px;}
    .cont_main .bot .link a {padding:12px; height:80px;}
    .cont_main .bot .link a:before {width:46px; height:46px; background-size:100%;}
}


@media screen and (max-width:537px){
    .cont_main .top .btn_wrap a {font-size:15px;}
    .cont_main .top .btn_wrap a br { display:block;}
	.cont_main .top p {padding:0 20px; word-break: keep-all;}
	.cont_main .top p br {display:none;} 
}
