@charset "utf-8";
@import url('animate.css');

.tac {text-align:center !important;}
.tal {text-align:left !important;}
.tar {text-align:right !important;}

/* margin */
.mt5 {margin-top:5px !important;}
.mt10 {margin-top:10px !important;}
.mt15 {margin-top:15px !important;}
.mt20 {margin-top:20px !important;}
.mt25 {margin-top:25px !important;}
.mt30 {margin-top:30px !important;}
.mt35 {margin-top:35px !important;}
.mt40 {margin-top:40px !important;}
.mt45 {margin-top:45px !important;}
.mt50 {margin-top:50px !important;}
.mt55 {margin-top:55px !important;}
.mt60 {margin-top:60px !important;}
.mt65 {margin-top:65px !important;}
.mt70 {margin-top:70px !important;}
.mt75 {margin-top:75px !important;}
.mt80 {margin-top:80px !important;}
.mt85 {margin-top:85px !important;}
.mt90 {margin-top:90px !important;}
.mt95 {margin-top:95px !important;}
.mt100 {margin-top:100px !important;}

.mb5 {margin-bottom:5px !important;}
.mb10 {margin-bottom:10px !important;}
.mb15 {margin-bottom:15px !important;}
.mb20 {margin-bottom:20px !important;}
.mb25 {margin-bottom:25px !important;}
.mb30 {margin-bottom:30px !important;}
.mb35 {margin-bottom:35px !important;}
.mb40 {margin-bottom:40px !important;}
.mb45 {margin-bottom:45px !important;}
.mb50 {margin-bottom:50px !important;}
.mb55 {margin-bottom:55px !important;}
.mb60 {margin-bottom:60px !important;}
.mb65 {margin-bottom:65px !important;}
.mb70 {margin-bottom:70px !important;}
.mb75 {margin-bottom:75px !important;}
.mb80 {margin-bottom:80px !important;}
.mb85 {margin-bottom:85px !important;}
.mb90 {margin-bottom:90px !important;}
.mb95 {margin-bottom:95px !important;}
.mb100 {margin-bottom:100px !important;}

.ml5 {margin-left:5px !important;}
.ml10 {margin-left:10px !important;}
.ml15 {margin-left:15px !important;}
.ml20 {margin-left:20px !important;}
.ml25 {margin-left:25px !important;}
.ml30 {margin-left:30px !important;}
.ml35 {margin-left:35px !important;}
.ml40 {margin-left:40px !important;}
.ml45 {margin-left:45px !important;}
.ml50 {margin-left:50px !important;}
.ml55 {margin-left:55px !important;}
.ml60 {margin-left:60px !important;}
.ml65 {margin-left:65px !important;}
.ml70 {margin-left:70px !important;}
.ml75 {margin-left:75px !important;}
.ml80 {margin-left:80px !important;}
.ml85 {margin-left:85px !important;}
.ml90 {margin-left:90px !important;}
.ml95 {margin-left:95px !important;}
.ml100 {margin-left:100px !important;}

.mr5 {margin-right:5px !important;}
.mr10 {margin-right:10px !important;}
.mr15 {margin-right:15px !important;}
.mr20 {margin-right:20px !important;}
.mr25 {margin-right:25px !important;}
.mr30 {margin-right:30px !important;}
.mr35 {margin-right:35px !important;}
.mr40 {margin-right:40px !important;}
.mr45 {margin-right:45px !important;}
.mr50 {margin-right:50px !important;}
.mr55 {margin-right:55px !important;}
.mr60 {margin-right:60px !important;}
.mr65 {margin-right:65px !important;}
.mr70 {margin-right:70px !important;}
.mr75 {margin-right:75px !important;}
.mr80 {margin-right:80px !important;}
.mr85 {margin-right:85px !important;}
.mr90 {margin-right:90px !important;}
.mr95 {margin-right:95px !important;}
.mr100 {margin-right:100px !important;}


@media all and (max-width:1699px){
}

@media all and (max-width:1199px){
}

@media all and (max-width:950px){
}

@media all and (max-width:786px){
}

@media all and (max-width:480px){
}


/*  */
html {}
body {overflow-x: hidden;}
#container {margin-top:0;}
.wrapper {width:1420px; margin:0 auto;}
.wrapper h2.title{text-align: center; font-size: 16px;font-weight: bold; margin-bottom: 50px; text-transform:uppercase}
#wrap {min-width: 1260px;}
#wrap main {padding-top: 180px;}
#wrap main.main,
#wrap main.layout2 {padding-top: 150px;}

.pc{display:block}
.mo{display:none;}

/* input , select */
select {appearance: none; font-family: 'Pretendard';}
input {font-family: 'Pretendard'; font-size: inherit; vertical-align: middle;}

/* button */
.button {display: block; font-size: 16px; text-align: center; }

.button.normal {width: 148px; height: 48px; border-radius: 24px; line-height: 48px;}
.button.mini {width: 104px; height: 40px; border-radius: 20px; line-height: 40px;}

.button.fill-primary { background: #29AAE2; color: #fff; }
.button.line-gray {border: #dcdcdc solid 1px; color: #333;}
.button.line-primary {border: #29AAE2 solid 1px; color: #29AAE2;}

.button.disabled {background: #ccc !important; color: #fff !important; border-color: #ccc !important; }

/*header*/
header {position: absolute; left: 0; top: 0; width: 100%; z-index: 999; background: #fff; min-width: 1260px;}
header.fixed {position: fixed; top: -40px; border-bottom: 1px solid #e8e8e8;}
.top_util{width:100%; height: 40px; border-bottom:#EBEBEB solid 1px; padding-top:9px;}
.top_util .inner{max-width: 1680px; text-align: right; margin:0 auto;}
.top_util a{color:#999; font-size: 14px; padding:0 15px; border-right:#ccc solid 1px}
.top_util a:last-child{border:none}

.top_nav{width:100%; height:110px;}
.top_nav .inner{margin:0 auto; width: 90%; max-width: 1680px; position: relative;}
.top_nav .top_logo{width:188px; position: absolute; left:0; top:35px;}
.top_nav .top_logo img{width:100%;}
.top_nav .top_category{width:100%; padding-top:40px;}
.top_nav .top_category ul{font-size:0;margin: 0 auto; display: flex; justify-content: center; height:40px;}
.top_nav .top_category ul li{ display: inline-block;}
.top_nav .top_category ul li a{display: inline-block; padding:0 10px; margin:0 30px; font-size: 20px; font-weight: bold; position: relative; height: 70px; transition: 0.3s;}
.top_nav .top_category ul li a:before{content: ""; display:block; width:6px; height: 6px; background:#8CC63F; position: absolute; right:0; top:0; border-radius: 3px; visibility: hidden;}
.top_nav .top_category ul li a:after{content:""; display: block; width:0%; height:3px; background:#8CC63F;position: absolute; right:0; bottom:1px;transition: transform .3s}
.top_nav .top_category ul li a.on{color:#8CC63F}
.top_nav .top_category ul li a.on:before{visibility: visible;}
.top_nav .top_category ul li a.on:after{width:100%;}

.top_nav .top_category ul li .sub-category{position: absolute; top:145px;left: 50%;transform: translate(-50%, -50%); width:100vw; height: 73px; border-top:#eee solid 1px; background:#fff; z-index: 10;box-shadow: 0 5px 5px rgba(0,0,0,0.02); display:none;align-items: center; min-width: 1260px; }
.top_nav .top_category ul li .sub-category li a{font-size:20px; font-weight: 400; height: auto;}
.top_nav .top_category ul li .sub-category li a:hover{color:#29AAE2}
.top_nav .top_category ul li .sub-category li a:before{display: none;}
.top_nav .top_category ul li .sub-category li a:after{display: none;}

.top_nav .top_category > ul > li:hover > a{color:#8CC63F}
.top_nav .top_category > ul > li:hover > a:before{visibility: visible;}
.top_nav .top_category > ul > li:hover > a:after{width:100%;}
.top_nav .top_category > ul > li:hover .sub-category {display: flex;}

/* footer */
.footer{background:#f4f4f4;padding:47px 0 42px;}
.footer .inner{width: 90%; max-width:1400px; margin:0 auto; display: flex; justify-content: space-between;}
.footer .flogo{width:188px; margin-bottom:36px;}
.footer .flogo img{width:100%;}
.footer .lft p{font-size:16px; color:#666; text-align: left; margin-bottom: 10px;}
.footer .lft p span{background:#dcdcdc; width:1px; height:8px; font-size:0; display: inline-block; vertical-align: middle; margin: 0 10px;}
.footer .rht a{font-size:18px; font-weight:600; color:#111}
.footer .rht a:last-child{margin-left:30px}

.quick-menu{position: fixed; right: 70px; bottom: 50px; z-index: 1000;}
.quick-menu a{padding:20px 0; border-radius: 50px; display: block; box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 8px; background:#fff; transition: 0.3s; width:100px ;}
.quick-menu .img{text-align: center; max-width: 100%; margin-bottom: 5px;}
.quick-menu .txt1{font-size:14px; text-align: center; font-weight:700; line-height:1; margin-bottom: 10px;}
.quick-menu .txt2{font-size:16px; text-align: center; font-weight:700;}

.inquiry{padding:120px 0  80px 0 }
.inquiry ul{width: 90%; max-width:1400px;margin: 0 auto;display: flex;	justify-content: center; gap: 28px;}
.inquiry ul li {width: calc(50% - 14px); height:190px; background-color:#f4f4f4; background-position: 50px center; background-repeat: no-repeat; border: 1px solid #f4f4f4; border-radius: 16px;  transition: 0.3s;}
.inquiry ul li a {display: flex; flex-direction: column; justify-content: center; width: 100%; height: 100%; padding:32px 50px 32px 200px; position: relative; }
.inquiry ul li .tit{font-weight: 700;font-size: 24px; margin-bottom: 8px;}
.inquiry ul li p{font-size:18px; font-weight:400; color:#333;}
.inquiry ul li span{display:inline-block; height: 43px; background: #111; border-radius:22px; color:#fff; padding: 0 30px; line-height: 43px; font-size:16px; position: absolute; right: 50px; top: 50%; transform: translateY(-50%); }
.inquiry ul li.item1 {background-image:url(/images/inq_01.png);}
.inquiry ul li.item2{background-image:url(/images/inq_02.png);}
.inquiry ul li.item3{background-image:url(/images/inq_03.png);}
.inquiry ul li:hover{background-color:#ECF9FF; border-color:#29AAE2;-webkit-font-smoothing: antialiased;}

.customer{ border-top:#ccc solid 1px; padding:60px 0;}
.customer .inner{width: 90%; max-width:1400px; margin: 0 auto; display: flex;justify-content: space-between;}
.customer h3{color:#111; font-size: 16px; font-weight: 700; margin-bottom: 36px;}
.customer p{font-size:18px; font-weight: 400; color:#333; margin-bottom:12px;}
.customer p:last-child{margin-bottom:0;}
.customer .lft{ display: flex;}
.customer .cust1{padding-right:130px}
.customer .cust2 p:last-child{font-weight:600}
.customer .cust3{width:572px; height:151px; border:#ccc solid 1px; border-radius:16px; background:url(/images/icon_warning.png) 30px center no-repeat; padding:29px 0 0 150px; transition: 0.3s;}
.customer .cust3 h3{font-size:24px; font-weight: 700; margin-bottom: 8px;}
.customer .cust3 p{font-size:16px; color:#333;}
.customer .cust3 a{font-size:16px; color:#666; font-weight:700}
.customer .cust3:hover{background-color:#fafafa;}

/* pagination */
.pagination {display: flex; justify-content: center;}
.pagination ol{font-size:0; text-align: center;}
.pagination ol li{display:inline-block; width:40px; height:40px; margin:0 1px;}
.pagination ol li a{font-size:18px; line-height: 40px; color:#666; display: block; width: 100%; height: 100%; border-radius:20px;}
.pagination ol li a:hover{background:#eee; color:#29AAE2}
.pagination ol li a.on{background:#eee; color:#29AAE2}