@charset 'utf-8';

/* 230712 추가 */
#wrap{height: auto;}

#main2 ul li{cursor: pointer;}
#main2 ul li .tit{color: #fff; font-weight: 500; margin-top: 12px; margin-bottom: 0; font-size: 1.9rem; transition: .3s;}
#main2 ul li p{margin-top: 15px; color: #fff;}
#main2 ul li .img{background-color: #fff; border-radius: 100%; border: 1px solid #eee; width: 180px; height: 180px; display: flex; align-items: center; justify-content: center; margin: 0 auto; flex-direction: column; position: relative; transition: .3s;}
#main2 ul li p{opacity: 0; position: absolute; z-index: -1; visibility: hidden; width: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: .3s; margin-top: 0; padding: 5px;}
#main2 ul li:hover p{opacity: 1; visibility: visible; z-index: 2;}
#main2 ul li:hover .img{background-color: #90c323;}
#main2 ul li .img span{font-size: 60px; transition: .3s; color: #fff;}
#main2 ul li:hover .img span,
#main2 ul li:hover .tit{opacity: 0; visibility: hidden;}

@media all and (max-width:640px){
    #main2 ul li .img{width: 160px; height: 160px;}
#main2 ul li .img span{font-size: 48px;}
}

#main4 ol li .txt h3{margin-bottom: 15px;}
#main4 ol li .txt h3::after{display: none;}

#main6.main6_2{filter: hue-rotate(-55deg);}
#main6.main6_2 .m_tit,
#main6.main6_2 .inner{filter: hue-rotate(55deg);}
#main6 .tab{max-width: 1240px; margin-left:  auto; margin-right: auto;}
#main6 .tab li{width: 50%; margin: 0;text-align: center; font-size: 1.8rem; padding: 20px 0; background-color: #ddd; cursor: pointer; font-weight: 500; color: #999; transition: .5s;}
#main6 .tab li.on{background-color: #fff; color: #222;}
#main6 .tabcontent1{margin-top: 0; display: block;}
#main6 .tabcontent1 .cont{padding: 0; margin-top: 60px; border-radius: 0;}
#main6 .tabcontent1 .cont .txt{padding: 80px; width: 50%; height: 760px;}
#main6 .tabcontent1 .cont .txt .tit{margin-top: 0;}
#main6 .tabcontent1 .list{display: flex; margin-top: 35px; border-bottom: 1px solid #eee; padding-bottom: 20px;}
#main6 .tabcontent1 .list2{display: flex; margin-top: 35px; border-bottom: 1px solid #eee; padding-bottom: 20px;}
#main6 .tabcontent1 .list dd{opacity: 0.5; color: #000; font-weight: 600; font-size: 1.7rem; margin-right: 30px; cursor: pointer;}
#main6 .tabcontent1 .list2 dd{opacity: 0.5; color: #000; font-weight: 600; font-size: 1.7rem; margin-right: 30px; cursor: pointer;}
#main6 .tabcontent1 .list dd:last-child{margin-right: 0;}
#main6 .tabcontent1 .list2 dd:last-child{margin-right: 0;}
#main6 .tabcontent1 .list dd.on{opacity: 1;}
#main6 .tabcontent1 .list2 dd.on{opacity: 1;}
#main6 .tabcontent1 .cont .txt ul h3{width: 100%; padding: 8px 20px;}
#main6 .tabcontent1 .cont .img{width: 50%; background-size: cover; background-repeat: no-repeat; background-position: center center; margin-right: 0;}
#main6 #tab1 .cont .img{background-image: url(/images/main/main6_tab1.jpg);}
#main6 #tab2 .cont .img{background-image: url(/images/main/main6_tab2.jpg);}
#main6 .tabs{display: none;}
#main6 .tabss{display: none;}
#main6 .tabs.on{display: block;}
#main6 .tabss.on{display: block;}

@media all and (max-width:1240px){
    #main6 .tabcontent1 .cont{display: flex;}
    #main6 .tabcontent1 .cont .txt{text-align: left; padding: 60px; height: auto;}
    #main6 .tabcontent1 .cont .img{margin-top: 0;}
}
@media all and (max-width:976px){
    #main6 .tabcontent1 .cont{flex-direction: column; margin-top: 40px;}
    #main6 .tabcontent1 .cont .txt,
    #main6 .tabcontent1 .cont .img{width: 100%;}
    #main6 .tabcontent1 .cont .img{height: 40vw; order: -1;}
    #main6 .tabcontent1 .cont .txt{padding: 40px; min-height: 90vw;}
    #main6 .tabcontent1 .cont .txt .tit{font-size: 3rem;}
    #main6 .tabcontent1 .cont .txt ul h3{font-size: 2rem;}
}
@media all and (max-width:640px){
    #main6 .tabcontent1 .cont .txt{padding: 25px; min-height: 105vw;}
    #main6 .tabcontent1 .list,
    #main6 .tabcontent1 .list2{margin-top: 20px;}
}
@media all and (max-width:480px){
    #main6 .tabcontent1 .cont .txt{min-height: 134vw;}
}

#main7 .tabcontent1{padding: 70px 0;}
#main7 .box{padding-top: 5rem;}
#main7 .tabcontent1 .inner{gap:0 80px;}
#main7 .tabcontent1 .inner > .img{width: 50%;}
#main7 .tabcontent1 .inner > .img img{width: 100%; max-width:620px;}
#main7 .tabcontent1 .info{width: calc(50% - 80px);}
#main7 .tabcontent1 .info ul li .img span{font-size: 40px; color: #000;}
#main7 .tabcontent1 .info ul{border: 1px solid #eee; margin-top: 25px;}
#main7 .tabcontent1 .info ul li{background-color: #fff; width: 25%; text-align: center; margin-right: 0; padding: 20px 0;}
#main7 .tabcontent1 .info ul li:not(:last-child){border-right: 1px solid #eee;}
#main7 .tabcontent1 .info ul li p{margin-top: 5px;}

@media all and (max-width:1240px){
    #main7 .tabcontent1{padding: 55px 0;}
    #main7 .tabcontent1 .inner{gap:0 50px;}
    #main7 .tabcontent1 .info {width: calc(50% - 50px);}
}
@media all and (max-width:976px){
    #main7 .tabcontent1 .inner{flex-direction: column;}
    #main7 .tabcontent1 .info{width: 100%;}
    #main7 .tabcontent1 .info .tit{font-size: 3rem;}
    #main7 .tabcontent1 .inner > .img{width: 100%; margin-top: 40px;}
    #main7 .tabcontent1 .inner > .img img{max-width: 100%;}
}


@media all and (max-width:1000px){
    #main8 .grade > h3{font-size: 3rem;}
    #main8 .grade ul li{flex: 1 auto; padding-right: 8px; padding-left: 8px; width: 50%;}
    #main8 .grade ul li h3{font-size: 2.2rem;}
    #main8 .grade ul li p br{display: none;}
}

@media all and (max-width:640px){
    #main9 ul li{width: 88%; margin: 0 auto;}
    #main9 ul li .txt p{font-size: 1.6rem;}
}

#main11 .inner .txt_box .txt h3{color: #222;}