@charset "utf-8";

#comingsoon{width:100%;padding-top:100px;text-align:center}

/* 페이지 포인트 컬러 */

#pageCm .pg_color{color:#333}
#pageCm .pg_bdcolor:before{border-color:#333}
#pageCm .pg_bgcolor{background-color:#333}

/* 공통 */

#pageCm{position:relative;padding-bottom:50px;font-size:17px;line-height:1.8;letter-spacing:-.3px;color:#777;font-family:'notokr-regular'}
#pageCm .tit_area{margin-bottom:25px;letter-spacing:-.8px;color:#aaa;font-family:'notokr-light'}
#pageCm .tit_area span{display:inline-block;font-size:16px;letter-spacing:2px;text-transform:uppercase;font-family:'notokr-bold'}
#pageCm .tit_area.t_center span:after{display:block;content:"";width:1px;height:30px;margin:12px auto;background:#d1d1d1}
#pageCm .tit_area p{font-size:32px;line-height:1.4}
#pageCm .t_center{padding:30px;text-align:center}
#pageCm .t_center p{word-break:keep-all}
#pageCm .c_black{color:#333}
#pageCm strong{font-weight:normal;font-family:'notokr-bold'}
#pageCm .stit_area{font-size:19px;line-height:1.6}
#pageCm .stit_area h4{padding-bottom:15px;font-size:32px;line-height:1.4;font-weight:normal;font-family:'notokr-regular'}

/* 페이지 공통 */

#page33,#page34,#page40{font-family:'Pretendard',sans-serif;color:#666}
#page33 .inner,#page34 .inner,#page40 .inner{width:1200px;margin:0 auto}

#page33 .title_area,#page34 .title_area{padding-bottom:35px;text-align:center;border-bottom:1px solid #e1e1e1}
#page33 .title_area .eng,#page34 .title_area .eng{margin-bottom:15px;font-size:16px;font-weight:700;color:#357c99;font-family:'Outfit',sans-serif}
#page33 .title_area h2,#page34 .title_area h2{margin:0;font-size:44px;font-weight:700;color:#111}

/* 대표 인사말 */

#page33 .slogan{display:flex;align-items:center;justify-content:center;gap:12px;margin:55px 0 55px}
#page33 .slogan p{margin:0;font-size:34px;line-height:44px;font-weight:700;color:#222}
#page33 .slogan p strong{color:#357c99}
#page33 .slogan .quote{font-size:54px;line-height:44px;color:#357c99;font-family:'Prata',serif}

#page33 .greeting_cont{width:900px;margin:0 auto;text-align:center}
#page33 .text_area{font-size:19px;line-height:32px;color:#555}
#page33 .text_area p{margin:0 0 30px}
#page33 .text_area p:last-child{margin-bottom:0}
#page33 .text_area .strong{font-weight:600;color:#333;text-decoration:underline;text-underline-offset:3px}

#page33 .sign{display:flex;align-items:center;justify-content:center;margin-top:35px;color:#222}
#page33 .sign span{font-size:21px;line-height:24px;font-weight:600}
#page33 .sign strong{margin-left:12px;font-size:42px;line-height:1;font-weight:400;font-family:'Nanum Pen Script',cursive}

/* 회사 연혁 */

#page34 .title_area .txt{margin-top:20px;font-size:19px;line-height:30px;color:#555}
#page34 .history{position:relative;padding:70px 0 20px}
#page34 .history:before{content:"";position:absolute;top:70px;bottom:20px;left:50%;width:2px;background:#e2e2e2;transform:translateX(-50%)}
#page34 .history_item{position:relative;width:50%}
#page34 .history_item.left{padding-right:80px;text-align:right}
#page34 .history_item.right{margin-left:50%;padding-left:80px;text-align:left}
#page34 .history_item:before{content:"";position:absolute;top:20px;width:50px;border-top:1px dashed #e2e2e2}
#page34 .history_item.left:before{right:10px}
#page34 .history_item.right:before{left:10px}
#page34 .history_item .dot{position:absolute;top:10px;width:20px;height:20px;border:1px solid #eee;border-radius:50%;background:#fff;z-index:2}
#page34 .history_item .dot:after{content:"";position:absolute;top:50%;left:50%;width:12px;height:12px;border-radius:50%;background:#357c99;transform:translate(-50%,-50%)}
#page34 .history_item.left .dot{right:-10px}
#page34 .history_item.right .dot{left:-10px}
#page34 .history_item h3{margin:0 0 35px;font-size:40px;font-weight:600;color:#357c99}
#page34 .history_item dl{margin:0 0 35px}
#page34 .history_item dl:last-child{margin-bottom:0}
#page34 .history_item dt{margin-bottom:18px;font-size:22px;font-weight:600;color:#000}
#page34 .history_item dd{margin:0 0 8px;font-size:18px;line-height:25px}
#page34 .history_item dd:last-child{margin-bottom:0}

#page34 .history_item.left:nth-of-type(1){margin-bottom:-250px}
#page34 .history_item.right:nth-of-type(2){margin-bottom:60px}
#page34 .history_item.left:nth-of-type(3){margin-bottom:-170px}
#page34 .history_item.right:nth-of-type(4){margin-bottom:60px}
#page34 .history_item.right:nth-of-type(5){margin-bottom:60px}
#page34 .history_item.left:nth-of-type(6){margin-bottom:-180px}
#page34 .history_item.right:nth-of-type(7){margin-bottom:60px}

/* 회사 연혁 스크롤 애니메이션 */

#page34 .title_area,#page34 .history_item h3,#page34 .history_item dl{opacity:0;transform:translateY(20px);transition:opacity .4s ease,transform .4s ease}
#page34 .title_area.show,#page34 .history_item h3.show,#page34 .history_item dl.show{opacity:1;transform:translateY(0)}

/* 제품소개 */

#page40 .title_area{padding:0 0 45px;text-align:center;border-bottom:1px solid #e1e1e1}
#page40 .title_area .eng{margin:0 0 23px;font-size:16px;line-height:1.29;font-weight:700;color:#357c99;font-family:'Outfit',sans-serif}
#page40 .title_area h2{margin:0;font-size:44px;line-height:1.2;font-weight:700;color:#111}
#page40 .title_area .desc{margin:28px 0 0;font-size:19px;line-height:1.65;color:#555}

#page40 .product_nav{display:flex;justify-content:center;gap:20px;margin:52px 0 65px}
#page40 .product_nav a{display:flex;align-items:center;justify-content:center;width:175px;height:55px;border:1px solid #357c99;border-radius:30px;font-size:18px;line-height:1.59;font-weight:600;color:#357c99;font-family:'Outfit',sans-serif;box-sizing:border-box}
#page40 .product_nav a:hover,#page40 .product_nav a.active{background:#357c99;color:#fff}

#page40 .product_list{display:flex;flex-direction:column;gap:40px;width:1200px;margin:0 auto}
#page40 .product_item{display:grid;grid-template-columns:301px 1fr 260px;align-items:center;width:100%;padding:47px 50px;border:1px solid #ddd;border-radius:6px;background:#fff;box-sizing:border-box}

#page40 .img_box{display:flex;align-items:center;justify-content:center;width:301px;height:218px;overflow:hidden}
#page40 .img_box img{display:block;width:100%;height:100%;object-fit:contain}

#page40 .info_box{min-width:0;padding:0 45px 0 65px}
#page40 .info_box .type{display:inline-flex;align-items:center;justify-content:center;width:148px;height:30px;margin:0 0 20px;border-radius:4px;background:#357c99;font-size:16px;line-height:1;font-weight:700;color:#fff;font-family:'Outfit',sans-serif;box-sizing:border-box}
#page40 .info_box h3{margin:0;font-size:34px;line-height:1.2;font-weight:700;color:#000;font-family:'Outfit',sans-serif;white-space:nowrap}
#page40 .info_box .use{margin-top:32px}
#page40 .info_box .use_tit{margin:0 0 8px;font-size:19px;line-height:1.59;font-weight:600;color:#357c99}
#page40 .info_box .use_txt{margin:0;font-size:18px;line-height:1.69;color:#555;white-space:nowrap}

#page40 .link_box{display:flex;align-items:center;justify-content:flex-start;height:145px;padding-left:70px;border-left:1px solid #e5e5e5;box-sizing:border-box}
#page40 .link_box a{display:inline-flex;align-items:center;gap:6px;font-size:19px;line-height:1.5;font-weight:600;color:#666;white-space:nowrap;transition:color .2s ease}
#page40 .link_box a span{font-size:14px;transition:transform .2s ease}
#page40 .link_box a:hover{color:#357c99}
#page40 .link_box a:hover span{transform:translate(3px,-3px)}

/* 제품소개 순차 애니메이션 */

#page40 .intro_ani,#page40 .list_ani{opacity:0;transform:translate3d(0,30px,0);transition:opacity .6s cubic-bezier(.25,.46,.45,.94),transform .6s cubic-bezier(.25,.46,.45,.94)}
#page40 .intro_ani.on,#page40 .list_ani.on{opacity:1;transform:translate3d(0,0,0)}

/* 비전, 조직도 준비중 */
#comingsoon{display:flex;align-items:center;justify-content:center;width:100%;height:500px;text-align:center;box-sizing:border-box}
#comingsoon strong{font-size:32px;line-height:1.4;font-weight:600;color:#333;font-family:'Pretendard',sans-serif}