@charset "UTF-8";
/********************************************************
■ Main Page : 메인 인덱스 페이지
********************************************************/
main { background:url('../img/mainBg.png') no-repeat left center/50%; display:grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: 2fr 1fr auto; gap:10px 5%; margin:50px 0; padding:0 var(--section-gap); }

#mainVisual { grid-row:1/3; padding-right:10%; align-self: center; }

.main-icon { grid-column: 2/3; display:grid; grid-template-columns: repeat(2, 1fr); gap:5px; align-self: center; perspective: 1200px; }
.main-icon li { position:relative; border-radius: 15px; text-align: center; transition-duration: .6s; background:var(--main-bg1); }
.main-icon li:before { content:""; display:block; padding-bottom:50%; }
/* .main-icon li:nth-child(-n+4):nth-child(odd),
.main-icon li:nth-child(n+5):nth-child(even) { background: var(--main-color2); }
.main-icon li:nth-child(-n+4):nth-child(even),
.main-icon li:nth-child(n+5):nth-child(odd) { background: var(--main-color1); }
.main-icon li:last-child { background-color: var(--main-color1) !important; } */

/* .main-icon li.icon-bg { background:none no-repeat center/cover; }
.main-icon li.bg1 { background-image:url('../img/main-icon-bg1.jpg') !important; }
.main-icon li.bg2 { background-image:url('../img/main-icon-bg2.jpg') !important; } */
.main-icon li a { position: absolute; left:0; top:0; right:0; bottom:0; display:flex; align-items: center; flex-direction: column; justify-content: center; }
.main-icon li img { max-width:90px; margin:0 auto 20px; /*filter:invert(1);*/ }
.main-icon li span { font-size:1.125rem; line-height: 1; white-space: nowrap; transition-delay: .1s; transform-style: preserve-3d; }

.main-icon li:hover { transform: rotateY(180deg); z-index:9; background:#fcb2c8; }
.main-icon li:hover span { transform: rotateY(180deg); }

.notice { grid-column:2/3; grid-row:2/4; align-self: end; }
.notice .title { display:flex; justify-content: space-between; align-items: center; padding:0 0 15px 20px; border-bottom:2px solid #333; }
.notice .title h4 { font-size:1.5rem; }
.notice .title a { border-radius: 99px; border:1px solid #333; padding:3px 30px; font-size:.875rem; }
.notice .title a:hover { background:#333; color:#fff; }
.notice li { border-bottom:1px solid #333; }
.notice li a { display:flex; align-items: center; padding:20px; }
.notice .list-num { font-weight:600; width:40px; }
.notice .list-date { color:#818181; width:130px; }
.notice .list-subject { flex:1; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

.notice li:hover { background:#f8f8f8; }
.notice li:hover .list-subject { font-weight:600; }

.partners { grid-column:1/2; grid-row:3/4; display:flex; align-items: center; }
.partners ul { display:flex; flex-direction: column; }
.partners li { margin-left:20px; display: flex; align-items: center; margin-top:15px; }
.partners b { margin-right:20px; }
.partners img { max-width:200px; height:40px; margin-right:30px;}


@media (max-width: 1600px) {
    main { gap:50px 4%; }
    #mainVisual { padding-right:7%; }
}

@media (max-width: 1400px) {
    main { grid-template-columns: 48% 48%; margin-top:0; grid-template-rows: repeat(3, auto); }
    #mainVisual { padding-right:5%; }

    /* .main-icon { grid-template-columns: repeat(3, 1fr); }

    .main-icon li:nth-child(-n+3):nth-child(odd),
    .main-icon li:nth-child(n+4):nth-child(even) { background: var(--main-color2); }
    .main-icon li:nth-child(-n+3):nth-child(even),
    .main-icon li:nth-child(n+4):nth-child(odd) { background: var(--main-color1); } */

    /* .main-icon li.bg1,
    .main-icon li.bg2 { display:none; }
    .main-icon li img { max-width:40%; }*/
    .main-icon li span { font-size:1rem; }
}

@media (max-width: 1200px) {
    main { display:block; padding:0 calc(50% - 383px); background-position: center top; background-size: 100%; }
    #mainVisual { padding-right:0; padding-left:13%; }
    .main-icon { margin:50px 5%; }

    .partners { margin-top:50px; justify-content: center; }
}

@media (max-width: 767px) {
    main { padding:0 var(--section-gap); }

    .main-icon { grid-template-columns: repeat(2, 1fr); }
    /* .main-icon li:nth-child(-n+3):nth-child(odd),
    .main-icon li:nth-child(n+5):nth-child(-n+6):nth-child(odd) { background: var(--main-color2); }
    .main-icon li:nth-child(3) { background: var(--main-color1) !important; } */
    .main-icon li img { max-width:30px; margin-bottom:10px; }


    .notice .title { padding:0 0 10px 5px; }
    .notice .title h4 { font-size:1.25rem; }
    .notice .title a { padding:3px 20px; }

    .notice li a { padding:12px 10px; }
    .notice .list-num,
    .notice .list-date { display:none; }

    .partners { display:block; }
    .partners li { margin:15px 15px 0 0; }
	.partners img { max-width:140px; height:35px; margin-right:20px;}
}