

.main-visual { position: relative; height: 100vh; overflow: hidden;} 
.main-visual .bg { width: 100%; height: 100%; background: url("/asset/image/bg/notice.png") no-repeat center center / cover;animation: zoom 10s infinite alternate; position: absolute; top: 0; left: 0; z-index: 9; } 
.main-visual .dim { width: 100%; height: 100%; background: linear-gradient(90deg, rgba(0, 0, 0, 0.5) 21.65%, rgba(0, 0, 0, 0) 73.8%); position: absolute; top: 0; left: 0; z-index: 9; } 
.main-visual .dim-bk { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.1); position: absolute; top: 0; left: 0; z-index: 9; } 
.main-visual .txt-wrap { position: absolute; top: 50%; left: 100px; transform: translateY(-50%); z-index: 10; } 
.main-visual .txt-wrap h2 { font-size: 80px; font-weight: 400; line-height: 96px; text-align: left; color: #FFFFFF; } 
.main-visual .txt-wrap h2 span { font-weight: 800; color: #FFFFFF; } 

.cont-wrap {max-width: 1720px; margin: 0 auto; padding: 200px 100px; } 
.cont-wrap > p { font-size: 24px; font-weight: 800; line-height: 36px; text-align: center; margin-bottom: 20px; color: #0046FF; } 
.cont-wrap > h2 { font-size: 90px; font-weight: 800; line-height: 117px; text-align: center; } 
.cont-wrap .search-wrap { display: flex; justify-content: end; } 
.cont-wrap .search-wrap form { position: relative; width: 450px; height: 70px; margin: 100px 0; } 
.cont-wrap .search-wrap form input { width: 100%; height: 100%; background: #F3F3F3; border: 1px solid #CCCCCC; padding: 20px 24px; transition: all 0.3s; } 
.cont-wrap .search-wrap form input:focus { background: #FFFFFF; } 
.cont-wrap .search-wrap form img { position: absolute; top: 50%; right: 24px; transform: translateY(-50%); } 
.cont-wrap .search-wrap form img.no-hover { display: inline-block; transition: all 0.3s; } 
.cont-wrap .search-wrap form img.hover { display: none; transition: all 0.3s; } 
.cont-wrap .search-wrap form input:focus + a img.no-hover { display: none; } 
.cont-wrap .search-wrap form input:focus + a img.hover { display: inline-block; } 
.list-wrap { display: flex; flex-direction: column; border-top: 1px solid #000000; }  
.list-wrap li { padding: 30px 20px; border-bottom: 1px solid #CCCCCC; } 
.list-wrap li a { display: flex; justify-content: space-between; align-items: center; } 
.list-wrap li a >:nth-child(1) {width: calc(100% - 60px);} 
.list-wrap li a >:nth-child(1) p { font-size: 30px; font-weight: 800; line-height: 45px; text-align: left; margin-bottom: 10px; transition: all 0.3s; } 
.list-wrap li a >:nth-child(1) span { font-size: 20px; font-weight: 400; line-height: 30px; text-align: left; transition: all 0.3s; } 
.list-wrap li a >:nth-child(2) { position: relative; width: 60px; height: 60px; border-radius: 50%; background: #8492AC4D; transition: all 0.3s; } 
.list-wrap li a >:nth-child(2) img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 
.list-wrap li a:hover >:nth-child(1) p { color: #0046FF; } 
.list-wrap li a:hover >:nth-child(1) span { color: #0046FF; } 
.list-wrap li a:hover >:nth-child(2) { background: #0046FF; } 
.list-wrap li.no-data { width: 100%; padding: 100px 0; text-align: center; background: #F3F3F3;}
.list-wrap li.no-data img { margin: 0 auto; } 
.list-wrap li.no-data p { margin-top: 30px; font-size: 26px; font-weight: 400; line-height: 39px; text-align: center; color:#777777; } 
.btn-more { padding: 25px 0; width: 265px; height: 90px; margin: 100px auto 0; background: #000000; display: flex; align-items: center; justify-content: center; gap: 30px; transition: all 0.3s; } 
.btn-more:hover { background: #0046FF; } 
.btn-more span { font-size: 26px; font-weight: 700; line-height: 39px; text-align: center; color: #FFFFFF; } 
.btn-more span img { } 
 @media screen and (max-width:1125px){
 .main-visual .txt-wrap { left: 20px; } 
 .cont-wrap { padding: 80px 20px; } 
 .cont-wrap > p { font-size: 14px; font-weight: 800; line-height: 19.6px; text-align: center; margin-bottom: 10px; color: #0046FF; } 
 .cont-wrap > h2 { font-size: 38px; font-weight: 800; line-height: 49.4px; text-align: center; } 
 .cont-wrap .search-wrap form { position: relative; width: 350px; height: 50px; margin: 50px 0; } 
 .cont-wrap .search-wrap form input { padding: 14px 10px; } 
 .cont-wrap .search-wrap form img { right: 13px;width: 18px; height: 19px; } 
 .list-wrap li { padding: 20px 10px; } 
 .list-wrap li a >:nth-child(1) {width: calc(100% - 34px);}
 .list-wrap li a >:nth-child(1) p { font-size: 18px; font-weight: 800; line-height: 27px; text-align: left; margin-bottom: 10px; } 
 .list-wrap li a >:nth-child(1) span { font-size: 14px; font-weight: 400; line-height: 21px; text-align: left; } 
 .list-wrap li a >:nth-child(2) { width: 34px; height: 34px; } 
 .list-wrap li a >:nth-child(2) img {width: 9.72px;}
 .list-wrap li.no-data {padding: 50px 0;}
 .list-wrap li.no-data img {width: 60px; height: 60px; } 
 .list-wrap li.no-data p { margin-top: 20px; font-size: 18px; font-weight: 400; line-height: 27px; text-align: center; color:#777777; } 
 .btn-more { padding: 16.5px 0; width: 350px; height: 60px; margin: 50px auto 0; gap: 20px; } 
 .btn-more span { font-size: 18px; font-weight: 700; line-height: 1; } 
 .btn-more img {width: 16px;}

 }
@media screen and (max-width:768px){
.cont-wrap .search-wrap { display: flex; } 
 .main-visual .txt-wrap h2 { font-size: 32px; font-weight: 400; line-height: 41.6px; text-align: left; } 
 .main-visual .txt-wrap span { font-size: 32px; font-weight: 800; line-height: 41.6px; text-align: left; } 
 }