@charset "utf-8";

/* ----------------------------------
Name: main.css
Version: 1.0
-------------------------------------*/

/* MainVisual */
.section{max-width: 1440px;margin: 0 auto;}
.main_contents{max-width: 1440px;margin: 0 auto;}

.main_visual_wrap{max-width: 1440px;margin: 180px auto 80px auto;display: flex;align-items: center;justify-content: space-between;}
.main_visual_wrap .tit_area{margin-top: 50px;}
.main_visual_wrap .tit_area .tit01{margin-bottom: 20px;font-size: 52px;font-weight: 600;color: #1c1c1c;}
.main_visual_wrap .tit_area .tit02{margin-bottom: 40px;font-size: 18px;color: 7a7a7a;}
.main_visual_wrap .tit_area .m_btn_go{display: flex;align-items: center;gap:0.5rem;font-size: 18px;font-weight: 600;color: #009798;}
.main_visual_wrap .tit_area .m_btn_go i{width: 34px;height: 34px;background: url('/images/front/icon/ico_arrow.svg') no-repeat center center / 50% #009798;border-radius: 50px;}
.main_visual{position: relative;background: url(/images/front/main/img_mian.png) no-repeat 0 0 / contain;filter: drop-shadow(50px 100px 30px rgba(138, 141, 154, .3));-webkit-filter: drop-shadow(50px 100px 30px hsla(229, 7%, 57%, .3));width: 500px;height: 440px;}
.float {display: inline-block;animation: floating 3.5s ease-in-out infinite;will-change: transform;}
@keyframes floating {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-25px); }
  100% { transform: translateY(0); }
}
.float.d1 {position: absolute;top: 0;right: 30px;animation-delay: .2s;}
.float.d2 {position: absolute;bottom: 40px;left: 0;animation-delay: .8s; }

/* 메인컨텐츠 */
.main_contents{margin-bottom: 180px;}
.main_contents h2.tit{margin-bottom: 20px;font-size: 38px;font-weight: 600;color: #1c1c1c;}
.main_contents .btn_more{position: absolute;top:0;right:0;text-indent: -9999px;}
.main_contents .btn_more::before{content:'';position: absolute;top:5px;right:0;width:22px;height:22px;background:url('/images/front/icon/icon_more.png') no-repeat;}

.topSearch_area{text-align: center; margin-bottom: 50px;}
.topSearch_area .search{position: relative;margin: 0 auto;width: 730px;height: 65px;background-color: #e5f4f4;border-radius: 50px;margin-bottom: 20px;}
.topSearch_area .search input[type="text"]{width: 90%;height: 65px;border: none;background-color: transparent;text-align: center;}
.topSearch_area .search input[type="text"]::placeholder{font-size: 18px;font-weight: 600;color: #00a3a4;text-align: center;}
.topSearch_area .search input[type=text]:hover{outline: none;}
.topSearch_area .search .btn_search{position: absolute;top:0;right:0;text-indent: -9999px;width: 65px;height: 65px;background: #00a3a4;border-radius: 50px;}
.topSearch_area .search .btn_search::before{content: '';position: absolute;top:0;left:0;width: 65px;height: 65px;background:url('/images/front/icon/top_search.png') no-repeat center center / 35%;}
.topSearch_area .tag_area{display: flex;align-items: center;justify-content: center;gap: 0.5rem;}
.topSearch_area .tag_area .src_tag span{display: inline-block;min-width:80px;height: 42px;padding: 0 15px;background: #f9f9f9;border-radius: 50px;font-weight: 500;color: #777;line-height: 42px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}

/* 강좌 카테고리 */
.m_category{margin-bottom: 120px;}
.m_category ul{display: flex;flex-wrap: nowrap;align-items: center;gap: 2rem;}
.m_category li{flex: 1;}
.m_category li a{position: relative;overflow: hidden;display: block;height: 225px;background: #f9f9f9;text-align: center;border-radius: 20px;}
.m_category li a  span::before{content: '';position: absolute;top: 110px;left: 50%;transform: translateX(-50%);z-index: 99;}
.m_category li a.icon_01 span::before{width: 60px;height: 60px;background:url('/images/front/main/icon_category01.png') no-repeat center center / contain;}
.m_category li a.icon_02 span::before{width: 70px;height: 60px;background:url('/images/front/main/icon_category02.png') no-repeat center center / contain;}
.m_category li a.icon_03 span::before{width: 60px;height: 60px;background:url('/images/front/main/icon_category03.png') no-repeat center center / contain;}
.m_category li a.icon_04 span::before{width: 60px;height: 60px;background:url('/images/front/main/icon_category04.png') no-repeat center center / contain;}
.m_category li a.icon_05 span::before{width: 60px;height: 60px;background:url('/images/front/main/icon_category05.png') no-repeat center center / contain;}
.m_category li a span{position: relative;display: block;width: 100%;height: 100%;padding-top: 50px;font-size: 24px;font-weight: 600;color: #202323;}
.m_category li a:hover{background: #009898;}
.m_category li a:hover span{color: #fff;}
.m_category li a:hover.icon_01 span::before{width: 60px;height: 60px;background:url('/images/front/main/icon_category01_on.png') no-repeat center center / contain;}
.m_category li a:hover.icon_02 span::before{width: 70px;height: 60px;background:url('/images/front/main/icon_category02_on.png') no-repeat center center / contain;}
.m_category li a:hover.icon_03 span::before{width: 60px;height: 60px;background:url('/images/front/main/icon_category03_on.png') no-repeat center center / contain;}
.m_category li a:hover.icon_04 span::before{width: 60px;height: 60px;background:url('/images/front/main/icon_category04_on.png') no-repeat center center / contain;}
.m_category li a:hover.icon_05 span::before{width: 60px;height: 60px;background:url('/images/front/main/icon_category05_on.png') no-repeat center center / contain;}
.m_category li a span:hover::after{content: '';position: absolute;top: 40%;left: 40%;width: 300px;height: 300px;background-color: #009394;border-radius: 50%;}

/* 게시판 */
.main_news{position: relative;margin-top: 20px;}
.main_news h2.tit{display: inline-block;margin-bottom: 50px;}
.main_news .news_area ul{display: grid;grid-template-columns: repeat(3, 1fr);gap: 7rem;}
.main_news .news_area li{position: relative;min-width: 0;}
.main_news .news_area li::before{content:'';position: absolute;top:0;right:-30px;width: 1px;height: 200px; background-color: #ddd;}
.main_news .news_area li:last-child::before{display: none;}
.main_news .news_area .tit{width: 100%;margin-bottom: 15px;font-size: 22px;font-weight: 600;color: #202323;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;}
.main_news .news_area .text{width: 100%;margin-bottom: 30px;color: #777;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;}
.main_news .news_area .date{color: #777;}

@media (max-width: 1700px){
    /* MainVisual */
    .main_visual_wrap{width: calc(100% - 33%);}
    .section.section1 .right_con{width: calc(100% - 70%);}
}
@media (max-width: 1440px){
    /* MainVisual */
    .main_visual_wrap{width: 100%;height: 480px;margin-bottom: 30px;}
    .main_visual_slide .slide_item{height: 480px;}
    .section.section1 .right_con{width: 100%;}
    .right_con .topSearch_area{width: 60%;margin: 0 auto 30px auto;}
    .right_con .m_center_area{width: 100%;display: flex;justify-content: space-between;}
    .right_con .m_center_area > div{width: 48%;}
    .right_con .center_info{margin-bottom: 0;}
    .right_con .center_info02 ul{padding-top: 35px}
    
    /* 메인컨텐츠 */
    .section.section2 .section_in{padding: 0 50px;}
    .section.section3{padding: 0 50px;}
}
@media (max-width: 1250px){ /* TABLET version */
    /* MainVisual */
    .section.section1{margin-top: 120px;}
    .section.section1 .section_in{padding: 0 20px;}
    
    /* 메인컨텐츠 */
    .section.section2 .section_in{padding: 0 20px;}
    .section.section2 .course_list{justify-content: space-between;gap: 0;}
    .section.section2 .course_list .box{margin-bottom: 50px;}
    .section.section3{padding: 0 20px;}
    .section.section3 .section_in{display:block;}
    .section.section3 .section_in > div{width: 100%;margin-bottom: 40px;}
}
@media screen and (max-width:800px){/* mobile version */
    /* MainVisual */
    .main_visual_wrap .tit_area{top:100px;left:50px;}
    .main_visual_wrap .tit_area .tit01{font-size: 1rem}
    .main_visual_wrap .tit_area .tit02{font-size: 2.3rem;letter-spacing:-2px;}
    .main_visual_wrap .tit_area .tit02 strong{font-size: 2.5rem;}
    .right_con .m_center_area{display: block;}
    .right_con .m_center_area > div{width: 100%;margin-bottom: 20px;}
    .right_con .center_info02 ul{padding-top: 0;}
    
    /* 메인컨텐츠 */
    .right_con .topSearch_area{width: 95%;}
}
@media screen and (max-width:640px){/* mobile version */
    /* MainVisual */
    .section.section1{margin-top: 80px;}
    .main_visual_wrap{height: 380px;}
    .main_visual_wrap .tit_area{top: 60px;}
    .main_visual_wrap .tit_area .tit02{font-size: 1.8rem;}
    .main_visual_wrap .tit_area .tit02 strong{font-size: 1.8rem;}
    .main_visual_wrap .tit_area .m_btn_go{height: 45px;padding: 0 50px 0 25px;line-height: 42px;}
    .main_visual_wrap .tit_area .m_btn_go::before{top: 13px;right: 20px;}
    .main_visual_wrap .btn_control{width: 100%;height: 50px;padding: 5px;border-radius: 0;}
    
    .main_contents .main_tit_area h2.tit{font-size: 1.8rem;}
}