@charset "UTF-8";

#main{position:relative;}

.sc-area {padding-top: 80px; padding-bottom: 80px;}

.sc-tit {display: block; margin-bottom: 50px; line-height: 0; text-align: center;}
.sc-tit .tit {display: inline-block; position: relative; z-index: 1;}
.sc-tit .tit::before {content:""; position: absolute; bottom: 0; left: -32px; width: 32px; height: 31px; background-repeat: no-repeat; background-position: center;}
.sc-tit .tit::after {content:""; position: absolute; bottom: 0; right: -32px; width: 38px; height: 37px; background-repeat: no-repeat; background-position: center;}
.sc-tit .tit > img {display: block; position: relative;}


.sc-tit.v1 .tit::before {background-image:url(../images/common/sc2_tit_l.png);}
.sc-tit.v2 .tit::before {background-image:url(../images/common/sc3_tit_l.png);}
.sc-tit.v3 .tit::before {background-image:url(../images/common/sc4_tit_l.png);}
.sc-tit.v1 .tit::after {background-image:url(../images/common/sc2_tit_r.png);}
.sc-tit.v2 .tit::after {background-image:url(../images/common/sc3_tit_r.png);}
.sc-tit.v3 .tit::after {background-image:url(../images/common/sc4_tit_r.png);}


@media screen and (max-width: 1024px) {
    .sc-area {padding-top: 60px; padding-bottom: 60px;}
    .sc-tit {margin-bottom: 40px;}
}
@media screen and (max-width: 800px) {
    .sc-area {padding-top: 50px; padding-bottom: 50px;}
    .sc-tit {margin-bottom: 30px;}
}
@media screen and (max-width: 600px) {
    .sc-area {padding-top: 40px; padding-bottom: 40px;}
    .sc-tit {margin-bottom: 25px;}
    .sc-tit.v1 .tit > img {width: 140px;}
    .sc-tit.v2 .tit > img {width: 118px;}
    .sc-tit.v3 .tit > img {width: 65px;}
}






#section-01 {display: block;}
#section-01 .visual-box {display: block; position: relative; }
#section-01 .visual-box .visual-slide {overflow:hidden;}
#section-01 .visual-box .visual-slide .swiper-slide {}
#section-01 .visual-box .visual-slide .swiper-slide .img-box {min-height: 700px; height: 100vh; background-repeat: no-repeat; background-position: center; background-size: cover;}

#section-01 .visual-box .visual-info {position: absolute; top: 50%; left: 50%; z-index:1; transform: translate(-50%, -50%);}
#section-01 .visual-box .visual-info .visual-tbox {display: block; margin-bottom: 60px;}
#section-01 .visual-box .visual-info .visual-tbox .cap {display: block; margin-bottom: 30px; text-align: center; background-color: rgba(31, 170, 57, 0.8);}
#section-01 .visual-box .visual-info .visual-tbox .cap > span {display: block; padding-top: calc(2rem * 0.3125); padding-left: 20px; padding-right: 20px; font-weight: 400; font-size: 2rem; white-space: nowrap; color: #fff;}
#section-01 .visual-box .visual-info .visual-tbox .tit {display: block; text-align: center; color: #fff; text-shadow: 2px 2px 5px #343434;}
#section-01 .visual-box .visual-info .visual-tbox .tit .month {display: block; font-weight: 700; font-size: 90px; line-height: 1; letter-spacing: -1px;}
#section-01 .visual-box .visual-info .visual-tbox .tit .vol {display: block; font-weight: 300; font-size: 100px; line-height: 1;}
#section-01 .visual-box .visual-info .slide-paging {display: flex; justify-content: center; align-items: center;}
#section-01 .visual-box .visual-info .slide-paging .num {display:block; font-style:italic; font-weight: 600; font-size: 1.375rem; letter-spacing: -1px; color: #fff;}
#section-01 .visual-box .visual-info .slide-paging .progress {display: flex; position: relative; margin: 0 10px; align-items: center;}
#section-01 .visual-box .visual-info .slide-paging .progress .bullet {display: block; position: relative; width: 80px; height: 1px; font-size: 0; border-radius: 0; background-color: #fff; cursor: pointer; flex-grow: 1;}
#section-01 .visual-box .visual-info .slide-paging .progress .bullet.on {height: 4px;}

#section-01 .visual-box .scroll {position: absolute; left: 50%; bottom: 50px; z-index:2; transform: translateX(-50%);}
#section-01 .visual-box .scroll .txt {display:block; margin-bottom: 10px; font-weight: 600; font-size: 14px; color: #fff;}
#section-01 .visual-box .scroll .icon {display: block; animation: mouse 1s infinite;}
#section-01 .visual-box .scroll .icon .mouse {display: block; height: 33px; margin-bottom: 5px; background:url(../images/main/i_mouse.png) no-repeat center;}
#section-01 .visual-box .scroll .icon .arr {display: block; height: 11px; background:url(../images/main/i_mouse_arr.png) no-repeat center;}

@keyframes mouse {
    0% {transform: translateY(0);}
    65% {transform: translateY(10px);}
    100% {transform: translateY(0);}
}

@media screen and (max-width: 1200px) {
    #section-01 .visual-box .visual-info .visual-tbox {margin-bottom: 40px;}
    #section-01 .visual-box .visual-info .visual-tbox .cap {margin-bottom: 20px;}
    #section-01 .visual-box .visual-info .visual-tbox .cap > span {padding-left: 10px; padding-right: 10px; font-size: 1.625rem;}
    #section-01 .visual-box .visual-info .visual-tbox .tit .month {font-size: 80px;}
    #section-01 .visual-box .visual-info .visual-tbox .tit .vol {font-size: 90px;}
}
@media screen and (max-width: 1024px) {
    #section-01 .visual-box .visual-info .visual-tbox {margin-bottom: 20px;}
    #section-01 .visual-box .visual-info .visual-tbox .cap {margin-bottom: 15px;}
    #section-01 .visual-box .visual-info .visual-tbox .tit .month {font-size: 75px;}
    #section-01 .visual-box .visual-info .visual-tbox .tit .vol {font-size: 85px;}

    #section-01 .visual-box .visual-info .slide-paging .progress .bullet {width: 75px;}
}
@media screen and (max-width: 600px) {
    #section-01 .visual-box .visual-slide .swiper-slide .img-box {min-height: 500px;}
}
@media screen and (max-width: 425px) {
    #section-01 .visual-box .visual-info .visual-tbox {margin-bottom: 10px;}
    #section-01 .visual-box .visual-info .visual-tbox .cap {margin-bottom: 5px;}
    #section-01 .visual-box .visual-info .visual-tbox .cap > span {font-size: 1.25rem;}
    #section-01 .visual-box .visual-info .visual-tbox .tit .month {font-size: 50px;}
    #section-01 .visual-box .visual-info .visual-tbox .tit .vol {font-size: 58px;}

    #section-01 .visual-box .visual-info .slide-paging .progress .bullet {width: 45px;}

    #section-01 .visual-box .scroll {bottom: 30px;}
    #section-01 .visual-box .scroll .txt {margin-bottom: 5px;}
}










/* 청춘공감 */
#section-02 {display: block; }
#section-02 .sc2-tab {display: block; position: relative;}
#section-02 .sc2-tab::before {content:""; position: absolute; top: calc(50% - 1px); left: 0; width: 100%; height: 2px; border-top: 2px dashed #1faa39; box-sizing: border-box;}
#section-02 .sc2-tab .tab-wrap {display: flex; padding: 0 15px; justify-content: center;}
#section-02 .sc2-tab .tab-wrap .list-wrap {display: flex; flex-wrap: nowrap;}
#section-02 .sc2-tab .tab-wrap .list-wrap > li {display: block; padding-right: 130px;}
#section-02 .sc2-tab .tab-wrap .list-wrap > li:last-child {padding-right: 0;}
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn {display: block; position: relative; width: 220px; padding: 5px 10px; border: 2px solid #1faa39; border-radius: 100px; line-height: 1.125rem; text-align: center; background-color: #fff;}
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn .txt {display: inline-block; line-height: 1; font-weight: 500; font-size: 1.125rem; vertical-align: middle;}
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn .icon {position: absolute; top: calc(50% - 10px); left: -10px; width: 20px; height: 20px; border: 2px solid #1faa39; border-radius: 50%; background-color: #fff; transform: scale(0);}
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn .icon::before {content:""; position: absolute; top: calc(50% - 3px); left:calc(50% - 4px); width: 8px;  height: 6px; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 6px solid #1faa39; box-sizing: border-box;}
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn .more {display: inline-block; position: relative; margin-left: 7px;  width: 14px; height: 14px; vertical-align: middle;}
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn .more::before {content:""; position: absolute; top: 0; left: calc(50% - 1px); width: 2px; height: 100%; background-color: #343434;}
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn .more::after {content:""; position: absolute; top: calc(50% - 1px); left: 0; width: 100%; height: 2px; background-color: #343434;}

#section-02 .tab-con-wrap {display: block; margin-top: 60px;}
#section-02 .tab-con-wrap .tab-con {display: none;}
#section-02 .tab-con-wrap .tab-con.active {display: block;}
#section-02 .tab-con-wrap .tab-con .slide-box {position: relative;}
#section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide {overflow: hidden;}
#section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide {}
#section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item {display: block;}
#section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item .img-box {display: block; overflow: hidden; position: relative; background-color: #e9e9e9;}
#section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item .img-box::before {content:""; display: block; padding-top: 78.95%;}
#section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item .img-box > img {position: absolute; top: 50%; left: 50%; max-width: unset; height: 100%; transform: translate(-50%, -50%) scale(1);}
#section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item .txt-box {display: block; padding: 25px 20px; border: 1px solid #e9e9e9;}
#section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item .txt-box .category {display:flex; margin-bottom: 20px;}
#section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item .txt-box .category > span {display: block; height: 24px; padding: 0 10px; border-radius: 12px; line-height: 24px; font-size: 14px; white-space: nowrap; color: #fff; background-color: #1faa39}
#section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item .txt-box .tit {display:block; overflow:hidden; height: 2.925rem; margin-bottom: 10px; font-size: 1.125rem; color: #000; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
#section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item .txt-box .txt {display:block; overflow:hidden; margin-bottom: 20px; height: 3.9rem; font-size: 1rem; color: #4e4e4e; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
#section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item .txt-box .name {display:block; overflow:hidden; font-size: 0.9375rem; text-overflow:ellipsis; white-space: nowrap; color: #4e4e4e;}
#section-02 .tab-con-wrap .tab-con .slide-box .slide-nav {}
#section-02 .tab-con-wrap .tab-con .slide-box .slide-nav .btn {position: absolute; top: 50%; width:50px; height: 50px; border: 2px solid #e9e9e9; border-radius: 50%; background-repeat: no-repeat; background-position: center;}
#section-02 .tab-con-wrap .tab-con .slide-box .slide-nav .btn.prev {left: -100px; background-image: url(../images/main/sc2_arr_p.png);}
#section-02 .tab-con-wrap .tab-con .slide-box .slide-nav .btn.next {right: -100px; background-image: url(../images/main/sc2_arr_n.png);}

#section-02 .tab-con-wrap .tab-con .slide-foot {display: flex; justify-content: center;}
#section-02 .tab-con-wrap .tab-con .slide-foot .slide-paging {display: flex; margin-top: 40px;}
#section-02 .tab-con-wrap .tab-con .slide-foot .slide-paging .bullet {display: block; width: 14px; height: 14px; margin-right: 10px; border: 2px solid #e9e9e9; border-radius: 50%; background-color: #fff; cursor: pointer;}
#section-02 .tab-con-wrap .tab-con .slide-foot .slide-paging .bullet.on {border-color: #343434; background-color: #343434;}


/* interaction */
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn {transition: background 0.3s, color 0.3s;}
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn_tab {transition: background 0.3s, color 0.3s, box-shadow 0.3s; box-shadow: 3px 3px 0 3px rgba(168, 228, 179, 0);}
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn:hover,
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn.active {color: #fff; background-color: #1faa39;}
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn_tab.active {color: #fff; background-color: #1faa39; box-shadow: 3px 3px 0 3px rgba(168, 228, 179,1);}

#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn.active .icon {transition: transform 0.4s;}
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn.active .icon {transform: scale(1);}

#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn .more::before,
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn .more::after {transition: background 0.3s, transform 0.3s;}
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn:hover .more::before,
#section-02 .sc2-tab .tab-wrap .list-wrap > li .btn:hover .more::after {transform: rotate(180deg); background-color: #fff;}


#section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item .img-box > img {transition: transform 0.3s;}
#section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item:hover .img-box > img {transform: translate(-50%,-50%) scale(1.1);}

#section-02 .tab-con-wrap .tab-con .slide-box .slide-nav .btn {transition: border 0.3s, background 0.3s;}
#section-02 .tab-con-wrap .tab-con .slide-box .slide-nav .btn:active {border-color: #1faa39;}
#section-02 .tab-con-wrap .tab-con .slide-box .slide-nav .btn.prev:active {background-image:url(../images/main/sc2_arr_p_on.png);}
#section-02 .tab-con-wrap .tab-con .slide-box .slide-nav .btn.next:active {background-image:url(../images/main/sc2_arr_n_on.png);}




@media screen and (max-width: 1200px) {
    #section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item .txt-box {padding: 20px 15px;}
    #section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item .txt-box .category {margin-bottom: 15px;}
}
@media screen and (max-width: 1024px) {
    #section-02 .sc2-tab .tab-wrap .list-wrap > li {padding-right: 60px;}
    #section-02 .sc2-tab .tab-wrap .list-wrap > li .btn {width: 200px;}
    #section-02 .sc2-tab .tab-wrap .list-wrap > li .btn .txt {font-size: 1rem;}

    #section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item .txt-box .category {margin-bottom: 10px;}
}
@media screen and (max-width: 800px) {
    #section-02 .sc2-tab .tab-wrap .list-wrap > li {padding-right: 60px;}
    #section-02 .sc2-tab .tab-wrap .list-wrap > li .btn {width: 200px;}
    #section-02 .sc2-tab .tab-wrap .list-wrap > li .btn .txt {font-size: 1rem;}

    #section-02 .sc2-tab.v2 .tab-wrap .list-wrap > li {padding-right: 20px;}
    #section-02 .sc2-tab.v2 .tab-wrap .list-wrap > li .btn {width: 170px;}
    
    #section-02 .tab-con-wrap {margin-top: 40px;}
    #section-02 .tab-con-wrap .tab-con .slide-box .sc2-slide .swiper-slide .item .txt-box .tit {height: 2.77rem; font-size: 1.0625rem;}
}
@media screen and (max-width: 600px) {
    #section-03 .sc3-tab::before {display: none;}
    #section-03 .sc3-tab .tab-wrap {display: block;}
    #section-03 .sc3-tab .tab-wrap .list-wrap {display: block;}
    #section-03 .sc3-tab .tab-wrap .list-wrap > li {padding-bottom: 20px; padding-right: 0;}
    #section-03 .sc3-tab .tab-wrap .list-wrap > li:last-child {padding-bottom: 0;}
    #section-03 .sc3-tab .tab-wrap .list-wrap > li .btn {width: 100%;}
    #section-03 .sc3-tab .tab-wrap .list-wrap > li .btn .icon {left: 0;}

    #section-02 .sc2-tab.v2 .tab-wrap .list-wrap > li {padding-bottom: 20px; padding-right: 0;}
    #section-02 .sc2-tab.v2 .tab-wrap .list-wrap > li .btn {width: 100%;}

    #section-02 .tab-con-wrap {margin-top: 30px;}
}






/* 대생 in */
#section-03 {display: block; background-color: #edf2f8;}
#section-03 .sc3-tab {display: block; position: relative;}
#section-03 .sc3-tab::before {content:""; position: absolute; top: calc(50% - 1px); left: 0; width: 100%; height: 2px; border-top: 2px dashed #1e6aa8; box-sizing: border-box;}
#section-03 .sc3-tab .tab-wrap {display: flex; padding: 0 15px; justify-content: center;}
#section-03 .sc3-tab .tab-wrap .list-wrap {display: flex; flex-wrap: nowrap;}
#section-03 .sc3-tab .tab-wrap .list-wrap > li {display: block; padding-right: 130px;}
#section-03 .sc3-tab .tab-wrap .list-wrap > li:last-child {padding-right: 0;}
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn {display: block; position: relative; width: 220px; padding: 5px 10px; border: 2px solid #1e6aa8; border-radius: 100px; line-height: 1.125rem; text-align: center; background-color: #fff;}
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn .txt {display: inline-block; line-height: 1; font-weight: 500; font-size: 1.125rem; vertical-align: middle;}
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn .icon {position: absolute; top: calc(50% - 10px); left: -10px; width: 20px; height: 20px; border: 2px solid #1e6aa8; border-radius: 50%; background-color: #fff; transform: scale(0);}
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn .icon::before {content:""; position: absolute; top: calc(50% - 3px); left:calc(50% - 4px); width: 8px;  height: 6px; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 6px solid #1e6aa8; box-sizing: border-box;}
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn .more {display: inline-block; position: relative; margin-left: 7px;  width: 14px; height: 14px; vertical-align: middle;}
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn .more::before {content:""; position: absolute; top: 0; left: calc(50% - 1px); width: 2px; height: 100%; background-color: #343434;}
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn .more::after {content:""; position: absolute; top: calc(50% - 1px); left: 0; width: 100%; height: 2px; background-color: #343434;}

#section-03 .tab-con-wrap {display: block; margin-top: 60px;}
#section-03 .tab-con-wrap .tab-con {display: none; max-width: 1100px; margin: 0 auto;}
#section-03 .tab-con-wrap .tab-con.active {display: block;}
#section-03 .tab-con-wrap .tab-con .tab-item {display: flex; height:360px;}
#section-03 .tab-con-wrap .tab-con .tab-item .img-box {display: block; overflow: hidden; width:43.6%; position: relative; background-color: #1e6aa8;}
#section-03 .tab-con-wrap .tab-con .tab-item .img-box > img {position: absolute; top: 50%; left: 50%;max-width: unset; height: 100%; transform: translate(-50%, -50%);}
#section-03 .tab-con-wrap .tab-con .tab-item .txt-box {display: flex; position: relative; width: 56.4%; padding: 0 30px 0 60px; background-color: #fff; align-items: center;}
#section-03 .tab-con-wrap .tab-con .tab-item .txt-box::before {content:""; position: absolute; top: -8px; right: -8px; width: 116px; height: 116px; border-top: 16px solid #1e6aa8; border-right: 16px solid #1e6aa8;}
#section-03 .tab-con-wrap .tab-con .tab-item .txt-box .txt-wrap {overflow: hidden;}
#section-03 .tab-con-wrap .tab-con .tab-item .txt-box .txt-wrap .tit {display: block; overflow: hidden; margin-bottom: 25px; font-weight: 700; font-size: 1.5rem; white-space: nowrap; text-overflow:ellipsis; }
#section-03 .tab-con-wrap .tab-con .tab-item .txt-box .txt-wrap .txt {display: block; overflow: hidden; max-height: 5.525rem; margin-bottom: 25px; font-size: 1.0625rem; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;}

/* interaction */
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn {transition: background 0.3s, color 0.3s;}
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn_tab {transition: background 0.3s, color 0.3s, box-shadow 0.3s; box-shadow: 0 0 0 0 rgba(161, 194, 222, 0);}
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn:hover,
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn.active {color: #fff; background-color: #1e6aa8;}
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn_tab.active {color: #fff; background-color: #1e6aa8; box-shadow: 3px 3px 0 3px rgba(161, 194, 222, 1);}

#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn.active .icon {transition: transform 0.4s;}
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn.active .icon {transform: scale(1);}

#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn .more::before,
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn .more::after {transition: background 0.3s;}
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn:hover .more::before,
#section-03 .sc3-tab .tab-wrap .list-wrap > li .btn:hover .more::after {background-color: #fff;}

#section-03 .tab-con-wrap .tab-con .slide-box .slide-nav .btn {transition: border 0.3s, background 0.3s;}
#section-03 .tab-con-wrap .tab-con .slide-box .slide-nav .btn:active {border-color: #1faa39;}
#section-03 .tab-con-wrap .tab-con .slide-box .slide-nav .btn.prev:active {background-image:url(../images/main/sc2_arr_p_on.png);}
#section-03 .tab-con-wrap .tab-con .slide-box .slide-nav .btn.next:active {background-image:url(../images/main/sc2_arr_n_on.png);}

#section-03 .tab-con-wrap .tab-con .tab-item .txt-box::before {transition: transform 0.3s;}
#section-03 .tab-con-wrap .tab-con .tab-item:hover .txt-box::before {transform: translate(-8px, 8px);}
#section-03 .tab-con-wrap .tab-con .tab-item .txt-box .txt-wrap .tit {transition: color 0.3s;}
#section-03 .tab-con-wrap .tab-con .tab-item:hover .txt-box .txt-wrap .tit {color: #1e6aa8;}

@media screen and (max-width: 1200px) {
    #section-03 .tab-con-wrap .tab-con .tab-item .txt-box {padding: 0 20px 0 40px;}
}
@media screen and (max-width: 1024px) {
    #section-03 .sc3-tab.v2 .tab-wrap .list-wrap > li {padding-right: 60px;}
    #section-03 .sc3-tab.v2 .tab-wrap .list-wrap > li .btn {width: 200px;}
    #section-03 .sc3-tab.v2 .tab-wrap .list-wrap > li .btn .txt {font-size: 1rem;}

    #section-03 .tab-con-wrap .tab-con .tab-item .txt-box {padding: 0 20px;}
    #section-03 .tab-con-wrap .tab-con .tab-item .txt-box .txt-wrap .tit {font-size: 1.25rem;}
}
@media screen and (max-width: 800px) {
    #section-03 .sc3-tab .tab-wrap .list-wrap > li {padding-right: 60px;}
    #section-03 .sc3-tab .tab-wrap .list-wrap > li .btn {width: 200px;}
    #section-03 .sc3-tab .tab-wrap .list-wrap > li .btn .txt {font-size: 1rem;}

    #section-03 .sc3-tab.v2 .tab-wrap .list-wrap > li {padding-right: 20px;}
    #section-03 .sc3-tab.v2 .tab-wrap .list-wrap > li .btn {width: 170px;}
    
    #section-03 .tab-con-wrap {margin-top: 40px;}
    #section-03 .tab-con-wrap .tab-con .tab-item .txt-box::before {width: 80px; height: 80px;}
    #section-03 .tab-con-wrap .tab-con .tab-item .txt-box .txt-wrap .txt {max-height:5.2rem; font-size: 1rem;}
}
@media screen and (max-width: 600px) {
    #section-03 .sc3-tab::before {display: none;}
    #section-03 .sc3-tab .tab-wrap {display: block;}
    #section-03 .sc3-tab .tab-wrap .list-wrap {display: block;}
    #section-03 .sc3-tab .tab-wrap .list-wrap > li {padding-bottom: 20px; padding-right: 0;}
    #section-03 .sc3-tab .tab-wrap .list-wrap > li:last-child {padding-bottom: 0;}
    #section-03 .sc3-tab .tab-wrap .list-wrap > li .btn {width: 100%;}
    #section-03 .sc3-tab .tab-wrap .list-wrap > li .btn .icon {left: 0;}

    #section-03 .sc3-tab.v2 .tab-wrap .list-wrap > li {padding-bottom: 20px; padding-right: 0;}
    #section-03 .sc3-tab.v2 .tab-wrap .list-wrap > li .btn {width: 100%;}

    
    #section-03 .tab-con-wrap {margin-top: 30px;}
    #section-03 .tab-con-wrap .tab-con .tab-item {display: block; height: auto;}
    #section-03 .tab-con-wrap .tab-con .tab-item .img-box {width: 100%; height: 300px;}
    #section-03 .tab-con-wrap .tab-con .tab-item .img-box > img {width: 101%; height: auto;}
    #section-03 .tab-con-wrap .tab-con .tab-item .txt-box {width: 100%; padding: 30px 15px;}
    #section-03 .tab-con-wrap .tab-con .tab-item .txt-box::before {top: auto; right: -5px; bottom: -5px; width: 65px; height: 65px; border-top: 0; border-bottom: 10px solid #1e6aa8; border-right: 10px solid #1e6aa8;}
    #section-03 .tab-con-wrap .tab-con .tab-item .txt-box:hover::before {transform: translate(-5px, -5px);} 
    #section-03 .tab-con-wrap .tab-con .tab-item .txt-box .txt-wrap .tit {max-height: 3.9rem; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
}





#section-04 {display: block;}
#section-04 .notice-box {}
#section-04 .notice-box .list {display: flex; margin: 0 -15px; flex-wrap: wrap;}
#section-04 .notice-box .list > li {max-width: 33.333%; margin-bottom: 30px; padding: 0 15px; flex-basis: 33.333%;}
#section-04 .notice-box .list > li .item {display: block; position: relative;}
#section-04 .notice-box .list > li .item .img-box {display: block; overflow: hidden; position: relative; background-color: #e9e9e9;}
#section-04 .notice-box .list > li .item .img-box::before {content:""; display: block; padding-top: 52.35%;}
#section-04 .notice-box .list > li .item .img-box > img {position: absolute; top: 50%; left: 50%; max-width: unset; height: 100%; transform: translate(-50%, -50%);}
#section-04 .notice-box .list > li .item .txt-box {display: block; padding: 25px 20px; border: 1px solid #e9e9e9; border-top: 0; background-color: #fff;}
#section-04 .notice-box .list > li .item .txt-box .category {display: flex; margin-bottom: 15px;}
#section-04 .notice-box .list > li .item .txt-box .category .c-txt {display: block; overflow:hidden; position:relative; font-weight: 500; font-size: 1rem; white-space: nowrap; text-overflow: ellipsis; color: #1faa3a;}
#section-04 .notice-box .list > li .item .txt-box .category .c-txt::before {content:""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background-color: #1faa3a;}
#section-04 .notice-box .list > li .item.v1 .txt-box .category .c-txt {color: #7444df;}
#section-04 .notice-box .list > li .item.v1 .txt-box .category .c-txt::before {background-color: #7444df;}
#section-04 .notice-box .list > li .item .txt-box .tit {display: block; overflow: hidden; height: 2.925rem; margin-bottom: 20px; font-weight: 700; font-size: 1.125rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
#section-04 .notice-box .list > li .item .txt-box .txt {display: block; overflow: hidden; height: 2.6rem; font-size: 1rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}

#section-04 .btn-wrap {display: flex; justify-content: center;}
#section-04 .btn-wrap .btn-more {display: flex; min-width: 200px; height: 40px; padding: 0 15px; border: 2px solid #7444df; border-radius: 27.5px; background-color: #fff; align-items: center; justify-content: center;}
#section-04 .btn-wrap .btn-more .b-txt {display: block; margin-right: 10px; font-weight: 700; font-size: 1.125rem; color: #7444df;}
#section-04 .btn-wrap .btn-more .icon {display: block; position: relative; width: 14px; height: 14px; vertical-align: middle;}
#section-04 .btn-wrap .btn-more .icon::before {content:""; position: absolute; top: 0; left: calc(50% - 1px); width: 2px; height: 100%; background-color: #7444df;}
#section-04 .btn-wrap .btn-more .icon::after {content:""; position: absolute; top: calc(50% - 1px); left: 0; width: 100%; height: 2px; background-color: #7444df;}


/* interaction */
#section-04 .notice-box .list > li .item::before {content:""; position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; border: 0px solid rgba(255, 255, 255, 0); box-sizing: border-box; visibility: hidden; transition: visibility 0s 0.2s, border 0.2s;}
#section-04 .notice-box .list > li .item:hover::before {border: 5px solid rgba(31, 170, 58, 1); visibility: visible; transition: visibility 0s 0s, border 0.2s;}
#section-04 .notice-box .list > li .item.v1:hover::before {border-color: rgba(116, 68, 223, 1);}

#section-04 .btn-wrap .btn-more {transition: background 0.3s;}
#section-04 .btn-wrap .btn-more:hover {background-color: #7444df;}
#section-04 .btn-wrap .btn-more .b-txt {transition: color 0.3s;}
#section-04 .btn-wrap .btn-more:hover .b-txt {color: #fff;}
#section-04 .btn-wrap .btn-more .icon::before,
#section-04 .btn-wrap .btn-more .icon::after {transition: background 0.3s, transform 0.3s;}
#section-04 .btn-wrap .btn-more:hover .icon::before,
#section-04 .btn-wrap .btn-more:hover .icon::after {transform: rotate(180deg); background-color: #fff;}




@media screen and (max-width: 1200px) {
    #section-04 .notice-box .list {margin: 0 -10px;}
    #section-04 .notice-box .list > li {margin-bottom: 20px; padding: 0 10px;}
}
@media screen and (max-width: 1024px) {
    #section-04 .notice-box .list {margin: 0 -5px;}
    #section-04 .notice-box .list > li {margin-bottom: 10px; padding: 0 5px;}
    #section-04 .notice-box .list > li .item .txt-box {padding: 20px 15px;}
}
@media screen and (max-width: 800px) {
    #section-04 .notice-box .list > li {max-width: 50%; flex-basis: 50%;}
}
@media screen and (max-width: 500px) {
    #section-04 .notice-box .list {display: block; margin: 0;}
    #section-04 .notice-box .list > li {max-width: unset; width: 100%; padding: 0; flex-basis: 0;}

    #section-04 .btn-wrap {display: block;}
    #section-04 .btn-wrap .btn-more {min-width: unset;}
}





#section-05 {display: block; background-color: #f5e1d2;}
#section-05 .ban-box {display: flex; position: relative; padding: 20px 0; justify-content: center;}
#section-05 .ban-box .item {display: flex;}
#section-05 .ban-box .item .img-box {display: flex; padding-right: 110px; align-items: flex-end; flex-shrink: 0;}
#section-05 .ban-box .item .info-box {display: flex; position: relative; align-items: center;}
#section-05 .ban-box .item .info-box .info-con {display: block;}
#section-05 .ban-box .item .info-box .info-con .btn-more {display: flex; height: 55px; margin-bottom: 25px; border: 2px solid #e06617; border-radius: 27.5px; background-color: #fff; align-items: center; justify-content: center;}
#section-05 .ban-box .item .info-box .info-con .btn-more .b-txt {display: block; padding-right: 20px; font-weight: 700; font-size: 1.125rem; color: #e06617;}
#section-05 .ban-box .item .info-box .info-con .btn-more .icon {width: 13px; height: 13px; background:url(../images/main/sc4_arr.png) no-repeat center;}
#section-05 .ban-box .item .info-box .info-con .txt {display: block; font-weight: 600; font-size: 1.0625rem;}

/* interaction */
#section-05 .ban-box .item .info-box .info-con .btn-more {transition: background 0.3s, transform 0.3s;}
#section-05 .ban-box .item .info-box .info-con .btn-more:hover {background-color: #e06617; transform: scale(1.05);}
#section-05 .ban-box .item .info-box .info-con .btn-more .b-txt {transition: color 0.3s;}
#section-05 .ban-box .item .info-box .info-con .btn-more:hover .b-txt {color: #fff;}
#section-05 .ban-box .item .info-box .info-con .btn-more .icon {transition: background 0.3s;}
#section-05 .ban-box .item .info-box .info-con .btn-more:hover .icon {background-image:url(../images/main/sc4_arr_on.png);}

@media screen and (max-width: 1200px) {
    #section-05 .ban-box .item .img-box {padding-right: 50px;}
}
@media screen and (max-width: 800px) {
    #section-05 .ban-box .item .img-box {width: 300px; padding-right: 20px;}
}
@media screen and (max-width: 600px) {
    #section-05 .ban-box .item .img-box {width: 60%; padding-right: 20px;}
}
@media screen and (max-width: 425px) {
    #section-05 .ban-box {justify-content: stretch;}
    #section-05 .ban-box .item {width: 100%;}
    #section-05 .ban-box .item .img-box {display: none;}
    #section-05 .ban-box .item .info-box {display: block; width: 100%;}
    #section-05 .ban-box .item .info-box .info-con .txt {text-align: center;}
    #section-05 .ban-box .item .info-box .info-con .txt > br {display: none;}
    #section-05 .ban-box .item .info-box .info-con .btn-more {height: 45px; margin-bottom: 10px;}
}