@charset "utf-8";

/*메인 PC*/
.pc{display:block;}
.m{display:none;}

/**main01**/
/* 슬라이더 전체 컨테이너 */
#main01 .slider-container{position:relative;width:100%;overflow:hidden;} 
/* 각 슬라이드 */
#main01 .slide{display:none;} 
#main01 .slide.b01{background:#C1D6CC;} 
#main01 .slide.b02{background:#DFEBE5;} 
#main01 .slide.b03{background:#C1D6CC;} 
#main01 .slide.active{display:block;} 
/* 슬라이드 내부 구조 */
#main01 .slide-content{display:flex;justify-content:space-between;align-items:center;height:700px;padding:80px 0;width:1200px;margin:0 auto;} 
#main01 .b01 .image-area{display: flex;gap:14px;}
#main01 img{border-radius:30px;}
#main01 .b01 .card{position:relative}
#main01 .b01 .card p{position:absolute;bottom:36px;left:36px;text-align: left;color:#fff;font-size:24px;font-weight:600;letter-spacing:-2.16px;line-height:30px;}
/* 텍스트 영역 */
#main01 .text-area{color:#000000;} 
#main01 .text-area > img{border-radius:0 !important;}
#main01 .b01 .text-area h2{font-size:30px;letter-spacing:0px;;margin:17px 0;font-weight:500;} 
#main01 .b01 .text-area h3{font-size:50px;letter-spacing:-2.5px;line-height:70px;margin-bottom:48px;font-weight:700;}
#main01 .b01 .text-area h3 span{font-weight:400;}
#main01 .b02 .text-area h2, #main01 .b03 .text-area h2{font-size:30px;letter-spacing:0px;;margin:0 0 59px;font-weight:500;}
#main01 .b02 .text-area h3{font-size:50px;letter-spacing:-2px;line-height:54.04px;font-weight:700;} 
#main01 .b03 .text-area h3{font-size:50px;letter-spacing:-4.5px;line-height:70px;margin-bottom:46px;}
#main01 .b03 .text-area h3 span{font-weight:400;}
#main01 .b01 .text-area p{font-size:20px;letter-spacing:-1.8px;margin-bottom:85px;line-height:30px;} 
#main01 .detail-btn{background-color:#fff;color:#000;border:none;width:145px;height:40px;line-height:40px;cursor:pointer;font-size:18px;text-align:center;letter-spacing:-.54px;border-radius:20px;font-weight:700;} 
/* --- 도트(점) 영역 --- */
#main01 .dots{margin-top:25px;width:100%;text-align:center;} 
#main01 .dot{display:inline-block;margin:0 4px;width:12px;height:12px;border-radius:50%;background-color:#B5B5B6;cursor:pointer;position:relative;overflow:hidden;} 
#main01 .dot.active{width:67px;height:12px;border-radius:30px;background-color:#B5B5B6} 
#main01 .dot.active::before{content:"";position:absolute;left:0;top:0;height:100%;width:0%;background-color:#333;animation:fillBar 6s linear forwards;} 
/* 2초 동안 0% -> 100% 채워지는 애니메이션 */
@keyframes fillBar{from{width:0%;}to{width:100%;}}

/**main02**/
#main02{padding:150px 0 175px;background-color:#fff;text-align:center;}
#main02>h2{font-size:30px;letter-spacing:-2.1px;font-weight:700;margin-bottom:30px;color:#000;}
#main02>p{font-size:22px;letter-spacing:-1.54px;margin-bottom:100px;color:#000}
#main02 .icon_list{display:flex;justify-content:center;align-items:flex-start;gap:12px;margin:0 auto}
#main02 .icon_list li{border:1px solid  #114867; transition:transform 0.3s;width:280px;height:400px;display:flex;justify-content:center;align-items:center;flex-direction: column;}
#main02 .icon_list li:hover{transform:translateY(-5px);}
#main02 .icon_list li img{max-width:80px;height:auto;margin-bottom:15px;display:block;margin-left:auto;margin-right:auto;}
#main02 .icon_list li .tit{font-size:24px;color:#000000;letter-spacing:-1.68px;line-height:35px;font-weight:600;margin-bottom:24px}
#main02 .icon_list li .txt{font-size:20px;line-height:30px;letter-spacing:-1.4px;font-weight:300;}

/**main03**/
#main03{padding:125px 0}
#main03 .main03_wrap{display:flex;margin:0 auto;justify-content:space-between;align-items:center;height:906px;}
#main03 .left_area{overflow:hidden;background:#C1D6CC;height:100%;width:50%;display:flex;justify-content:center;align-items:center;}
#main03 .left_area img{border-radius:21px;}
#main03 .right_area{background:#F9F8E4;height:100%;width:50%;padding:120px 120px 0}
#main03 .right_area .txt01{font-size:25px;color:#114867;font-weight:bold;margin-bottom:38px;text-transform:uppercase;letter-spacing:-0.76px;font-weight:normal;}
#main03 .right_area .txt02{font-size:35px;line-height:45px;color:#000000;font-weight:bold;margin-bottom:39px;letter-spacing:-3.15px;}
#main03 .right_area p{font-size:23px;line-height:33px;margin-bottom:36px;letter-spacing:-2.07px;}
#main03 .right_area a{display:inline-block;font-size:20px;margin-bottom:140px;color:#7A7A7A;text-decoration:underline}
#main03 .right_area .img_list{display:flex;gap:11px;list-style:none;margin:0;padding:0;}

/**main04**/
#main04{width:100%;max-width:1200px;margin:165px auto 220px;}
#main04 .sub_tit{font-size:25.31px;line-height:30px;letter-spacing:-.76px;color:#114867;}
#main04 .tit_area{display:flex;;justify-content: space-between;align-items:center;margin:20px 0 80px}
#main04 .tit_area .tit{font-size:35px;font-weight:bold;letter-spacing:-3.15px;}
#main04 .tit_area a{font-size:20px;letter-spacing:-1.8px;text-decoration: underline;color:#7A7A7A;font-weight: 100;}
#main04 .img_area{display:flex;gap:30px;}

/**main05**/
#main05{width:100%;padding:85px 0 140px;background:#EFEFEF;}
#main05 .tit_area{text-align:center;margin-bottom:55px}
#main05 .tit1{font-size:30px;letter-spacing:-2.1px;margin-bottom:4px;line-height:45px;}
#main05 .tit2{font-size:35px;font-weight:bold;letter-spacing:-2.45px;line-height:45px;}
#main05 ul.pc{display:flex;flex-direction:column;gap:13px;justify-content:center;align-items: center;}
#main05 ul li{width: 750px;background:#fff;border-radius:10px;display:flex;align-items:center;height: 62px;font-size:25px;letter-spacing:-1.75px;font-weight:600;gap:57px;padding-left:56px}
#main05 ul li span{width:133px;font-weight:bold;color:#F05500;}
#main05 ul.m{display:none}



/*모바일*/
@media screen and (max-width: 760px){
    .pc{display:none;}
    .m{display:block;}

    #main01{margin-top:82px}
    #main01 .slider-container{margin:60px auto 0;width:95%;}
    #main01 .slide{border-radius: 30px; height: 500px;}
    #main01 .slide-content{width:100%;height:500px;flex-direction:column;padding:26px 18px 33px;}
    #main01 .text-area{text-align:center;}
    #main01 .b01 .text-area > img{width:59px;}
    #main01 .b01 .text-area h2{font-size:17.9px;margin-bottom:20px;margin:3px auto 10px}
    #main01 .b01 .text-area h3{font-size:22px;line-height:30px;letter-spacing:-1.15px;margin-bottom:22px}
    #main01 .b01 .text-area p{font-size:12px;line-height:20px;letter-spacing:-1.08px;}
    #main01 .b01 .text-area p{margin-bottom:13px}
    #main01 .detail-btn{font-size:11px;line-height:23px;width:83px;height:23px;}
    #main01 .b01 .card p{font-size:11px;line-height:14px;}
    #main01 .b01 .card{width:auto;height: 184px;}
    #main01 .b01 .image-area{width:100%;flex-wrap:nowrap;gap:5px;margin-top:14px;justify-content: center;}
    #main01 .b01 .image-area img{height:100%;}
    #main01 .b03 .slide-content, #main01 .b02 .slide-content{padding:42px 30px 30px}
    #main01 .b03 .text-area h2{margin:0 0 24px}
    #main01 .b02 .text-area h3{font-size:25px;line-height:35px;letter-spacing: -2.25px;margin-bottom:25px}
    #main01 .b03 .text-area h3{font-size:25px;line-height:35px;letter-spacing: -2.25px;margin-bottom:25px}
    #main01 .b03 .image-area, #main01 .b02 .image-area{width: 245px;height:170px;border-radius:20px;overflow:hidden;position:relative}
    #main01 .b03 .image-area img, #main01 .b02 .image-area img{height:100%;transform:translateX(-50%);position:absolute;left:50%}
    #main01 .b01 .card p{bottom:5px;left:5px;font-size:11px;line-height:14px;letter-spacing:-0.99px}
    #main01 .dots{margin-top:15px;}
    #main01 .dot{width:7px;height:7px;margin:0 2px}
    #main01 .dot.active{width:47px;height:7px;}
    #main01 img{border-radius:10px;}

    /*main02*/
    #main02{padding:88px 0}
    #main02>h2{font-size:20px;margin-bottom:37px;letter-spacing: -1.4px;}
    #main02>p{font-size:17px;line-height:28px;letter-spacing:-1.19px;margin-bottom:40px}
    #main02 .icon_list{max-width:90%;gap:17px;flex-wrap: wrap;justify-content: center;}
    #main02 .icon_list li{width:128px;height:220px;}
    #main02 .icon_list li .tit{font-size:14px;line-height:20px;letter-spacing:-.98px;margin-bottom:15px}
    #main02 .icon_list li .txt{font-size:11px;line-height:17px;letter-spacing:-.77px;}



    /*main03*/
    #main03{padding:0}
    #main03 .main03_wrap{max-width: 100%;margin: 0 auto;align-items: center;flex-direction: column;}
    #main03 .left_area{width:100%;}
    #main03 .left_area img{width:231px;}
    #main03 .left_area img{border-radius:10px;}
    #main03 .right_area{width:100%;padding:43px 15px 50px;display:flex;flex-direction:column;gap:45px}
    #main03 .right_area .img_list li{width:142px;}
    #main03 .right_area .img_list{gap:7px;justify-content:center;}
    #main03 .right_area .img_list li img{width:100%;}
    #main03 .right_area .txt_area{text-align: center;}
    #main03 .right_area .txt01{font-size:16px;line-height:20px;letter-spacing:-.5px;margin-bottom:20px}
    #main03 .right_area .txt02{font-size:23px;letter-spacing:-1.8px;line-height:30px;margin-bottom:20px;}
    #main03 .right_area p{font-size:16px;line-height:25px;letter-spacing:-1.44px;margin-bottom:20px;}
    #main03 .right_area a{font-size:14px;line-height:30px;letter-spacing:-1.26px;margin-bottom:0}

    /**main04**/
    #main04{width:100%;max-width:100%;margin:80px auto}
    #main04 .sub_tit{font-size:16px;letter-spacing:-.48px;text-align: center;}
    #main04 .tit_area{display:flex;;justify-content: center;flex-direction:column;align-items:center;margin:18px 0 36px;gap:28px;}
    #main04 .tit_area .tit{font-size:23px;letter-spacing:-2.07px;text-align:center;}
    #main04 .tit_area a{font-size:13px;letter-spacing:-1.17px;}
    #main04 .img_area{display:flex;gap:30px;flex-wrap: nowrap;}
    #main04 .img_area.pc{display: none;}
    #main04 .m{display:flex;justify-content:center;align-items:center;margin:0 auto;}

    /**main05**/
    #main05{width:100%;padding:44px 10px 72px;background:#EFEFEF;}
    #main05 .tit_area{margin-bottom:47px}
    #main05 .tit1{font-size:19px;letter-spacing:-1.33px;margin-bottom:15px;line-height:25px;}
    #main05 .tit2{font-size:20px;letter-spacing:-1.45px;line-height:30px;}
    #main05 ul.pc{display:none}
    #main05 ul.m{display:flex;flex-direction:row;flex-wrap:wrap;gap:8px;justify-content:center;align-items: center;}
    #main05 ul li{width:146px;height:88px;padding:0;background:#fff;border-radius:10px;display:flex;flex-direction:column;justify-content: center;align-items:center;font-size:12px;letter-spacing:-.84px;font-weight:600;gap:5px;text-align: center;}
    #main05 ul li span{width:100%;font-size:14px;}

}   

