/************************************************************************* * @ 서비스명 : commonui * @ 파일명 : /css/commonui.css * @ 페이지설명 : commonui.css * @ 작성자 : 한주현 (pointweb) * @ 작성일 : 2020-06-05 ************************** 수정이력 ************************************** * 날짜 작업자 변경내용 * 2020-06-05 한주현 최초작성 * 2020-06-09 박이영 추가작성 **************************************************************************/ @charset "utf-8"; html{font-size:100px;} body{overflow: inherit;} body.on{overflow: hidden;} .sp-ico{background:url(/_public/images/common/icon.png);background-size:6rem;} /* layout */ .layout{margin:0 auto;max-width:15rem;} .text-left{text-align: left !important;} .required-items{color:#d62727;} /* form */ .form-flex{display:flex;} .form-flex .cmm-form{width:75%;} .form-flex .cmm-form:first-child{width:25%;} .cmm-form{padding:0.2rem;box-sizing: border-box;} .cmm-form .form{position:relative;overflow:hidden;} .cmm-form .form:after{content: "";opacity:0;display:inline-block;position:absolute;left:50%;transform: translateX(-50%);bottom:0;width:0;height:0.02rem;background:#333;-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;} .cmm-form .form.active:after{opacity:1;width:100%;height:0.02rem;-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;} .cmm-form .label{display:block;font-size:0.19rem;font-weight:500;color:#5b5b5b;line-height: 0.4rem;} .cmm-form .label .add-button{float: right;display: inline-block;font-size: 0.16rem;} .cmm-form .form label{position: absolute;top:-9999999rem;left:-999999rem;} .cmm-form .form input[type="text"], .cmm-form .form input[type="tel"], .cmm-form .form input[type="email"], .cmm-form .form input[type="password"]{width:100%;height:0.4rem;color:#898989;border:0.01rem solid #e5e5e5;background:#fafafa;box-sizing: border-box;padding:0 0.2rem;} .cmm-form .form input.inputTitle{font-size:0.4rem;line-height: 0.8rem;height:0.8rem;} .cmm-form .form input.inputTitle::-webkit-input-placeholder {line-height: 0.8rem;height:0.8rem;font-family:serif;} .cmm-form .form input::placeholder{color: #ccc;} .cmm-form .form input.inputTitle::placeholder{font-size:0.4rem;line-height: 0.4rem;font-weight:bold;} .cmm-form .form select{width:100%;height:0.4rem;color:#898989;border:0.01rem solid #e5e5e5;background-color:#fafafa;box-sizing: border-box;padding:0 0.2rem;} .cmm-form .form textarea{resize: none;padding:0.2rem;width:100%;height:2rem;border:0.01rem solid #e5e5e5;background-color:#fafafa;box-sizing: border-box;} .cmm-form .form .security-input{max-width:40%;} .cmm-form.error .form{border-color:#ff4947;} .cmm-form.error .form input{color:#ff4947;border-color:#ff4947;background-color: #fbc7b2;} .cmm-form.error .form input::placeholder{color:#ff4947;} .cmm-form.error .form textarea{color:#ff4947;border-color:#ff4947;background-color: #fbc7b2;} .cmm-form.error .form select{color:#ff4947;border-color:#ff4947;background-color: #fbc7b2;} .cmm-form .form .error-txt{margin-top:5px;text-align: right;color:#ff4947;} .checkbox{display:inline-block;} .checkbox input[type="checkbox"]{display:inline-block;position:absolute;opacity:0;} .checkbox label{display:inline-block;position:relative;padding-left:0.3rem;color:#555;font-size:0.15rem;text-align:left;font-weight:400;box-sizing:border-box;cursor:pointer;} .checkbox label:before{content:'';display:inline-block;position:absolute;top:0.02rem;left:0;width:0.18rem;height:0.18rem;border:0.01rem solid #555;box-sizing:border-box;} .checkbox label:after{content:"";display:none;position: absolute;top:0.03rem;left:0.05rem;width:0.04rem;height:0.1rem;border-right:0.04rem solid #fa9f00;border-bottom:0.04rem solid #fa9f00;transform:rotate(45deg);} .checkbox input[type=checkbox]:checked + label:after{display:inline-block;} /*table .table-wrap table tbody tr td.subject a span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}*/ .tableWrapper{margin-bottom:0.5rem;} #contents .contents-box .product-wrap .product-detail .spec-area .table-txt{display:none;color:#777; text-align:right;} .table-txt2{display:none;color:#777; text-align:right;} ::-webkit-scrollbar {width: 8px; height: 3px; background-color: rgba(0, 0, 0, 0.1);} ::-webkit-scrollbar-thumb {background-color: rgba(0, 0, 0, 0.5);} .__se_tbl_ext{width:70% !important;table-layout: fixed;} .__se_tbl_ext colgroup col{width:inherit !important;} .__se_tbl_ext tbody tr{height:auto !important;} .__se_tbl_ext tbody tr td{font-size:0.14rem !important;width:inherit !important;height:inherit !important;padding:0.15rem !important;} #header{position: fixed;top:0;left:0;width:100%;z-index:1000;-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;} #header:hover{} #header .header-wrap{display:flex;justify-content:space-between;align-items:center;} #header .header-wrap .logo{display: inline-block;width: 3.34rem;background: url(/_public/images/common/logo.png) 0 50% no-repeat;background-size:100%;text-indent: -999999rem;line-height: 0.75rem;overflow: hidden;} #header .header-wrap .gnb{display:inline-block;} #header .header-wrap .gnb ul li {display:inline-block;box-sizing:border-box;position:relative;vertical-align:top;} #header .header-wrap .gnb ul li > a{display:block;padding:0 0.35rem;font-size:0.2rem;color:#fff;line-height:0.75rem;font-family: 'Ubuntu-Medium';} #header .header-wrap .gnb ul li:first-child{margin-left:0;} #header .header-wrap .gnb ul li a.email{margin-left:1.05rem;padding-left:0.5rem;font-size:0.16rem;font-family: 'Ubuntu-Light';background:url(/_public/images/common/icon_mail.png) 0.2rem 50% no-repeat;} #header .header-wrap .gnb ul li a.email:before{} #header .header-wrap .gnb ul li a.contact-us{margin-left:0.2rem;padding:0 0.3rem;padding-left:0.25rem;font-size:0.16rem;} #header .header-wrap .gnb ul li a.contact-us:before{content: "";display:inline-block;margin-right:0.1rem;width:0.15rem;height:0.13rem;background:url(/_public/images/common/icon_contactus.png) no-repeat;background-size: 100%;} #header .header-wrap .gnb .dropdown{position: absolute;left:-0.2rem;display:none;margin-top:-0.1rem;width:127%;background: #fa9f00;box-sizing: border-box;padding:0.2rem;} #header .header-wrap .gnb .dropdown:before{content: "";display:inline-block;position:absolute;top:-0.11rem;left:50%;transform:translateX(-50%);width: 0;height: 0;border-top:0;border-bottom:0.11rem solid #fa9f00;border-right: 0.11rem solid transparent;border-left: 0.11rem solid transparent;} #header .header-wrap .gnb .dropdown a{font-family: 'Ubuntu-Light';padding:0.05rem 0;display:block;color:#fff;font-size:0.15rem;} #header .header-wrap .gnb .dropdown a:hover{text-decoration:underline;} #header .header-wrap .gnb ul li.contact .dropdown{opacity: 0;} #header .header-wrap .gnb ul li.email-list, #header .header-wrap .gnb ul li.contact{display:none;} #header .header-wrap .gnb ul li:nth-child(3) .dropdown{left:0;width:100%;} #header .header-wrap .util-menu{display:inline-block;} #header .header-wrap .util-menu a{display:inline-block;padding:0 0.35rem;font-size:0.2rem;color:#fff;line-height:0.75rem;font-family: 'Ubuntu-Medium';} #header .header-wrap .util-menu a.email{padding-left:0.5rem;font-size:0.16rem;font-family: 'Ubuntu-Light';background:url(/_public/images/common/icon_mail.png) 0.2rem 50% no-repeat;} #header .header-wrap .util-menu a.email:before{} #header .header-wrap .util-menu a.contactus{margin-left:0.2rem;padding:0 0.3rem;padding-left:0.25rem;font-size:0.16rem;} #header .header-wrap .util-menu a.contactus:before{content: "";display:inline-block;margin-right:0.1rem;width:0.15rem;height:0.13rem;background:url(/_public/images/common/icon_contactus.png) no-repeat;background-size: 100%;} #header.sub{position:relative;} #header.scroll{position:fixed;background:#fff; z-index:1000;box-shadow: 4px 4px 8px rgba(0,0,0,0.1);} #header.sub .header-wrap .logo, #header.scroll .header-wrap .logo{background-image: url(/_public/images/common/logo2.png);} #header.sub .header-wrap .gnb ul li > a, #header.scroll .header-wrap .gnb ul li > a{color:#222;} #header.sub .header-wrap .gnb ul li > a.email, #header.scroll .header-wrap .gnb ul li > a.email{border-left:0.01rem solid #fa9f00; background:url(/_public/images/common/icon_mail2.png) 0.2rem 50% no-repeat;} #header.sub .header-wrap .gnb ul li > a.contact-us, #header.scroll .header-wrap .gnb ul li > a.contact-us{color:#fff;background-color:#fa9f00;} #header.sub .header-wrap .util-menu > a, #header.scroll .header-wrap .util-menu > a{color:#222;} #header.sub .header-wrap .util-menu > a.email, #header.scroll .header-wrap .util-menu > a.email{border-left:0.01rem solid #fa9f00; background:url(/_public/images/common/icon_mail2.png) 0.2rem 50% no-repeat;} #header.sub .header-wrap .util-menu > a.contactus, #header.scroll .header-wrap .util-menu > a.contactus{color:#fff;background-color:#fa9f00;} #header .header-wrap .nav-icon {display:none;width: 0.6rem;height:0.4rem;position: absolute;top:0.48rem;right:0.3rem;margin-top: -0.1rem;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: 0.5s ease-in-out;-moz-transition: .5s ease-in-out;-o-transition: .5s ease-in-out;transition: .5s ease-in-out;cursor: pointer;z-index: 1000;} #header .header-wrap .nav-icon span {display: block;position: absolute;width: 100%;height:0.04rem;background: #fff;border-radius:0.05rem;opacity: 1;right: 0;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: 0.25s ease-in-out;-moz-transition: 0.25s ease-in-out;-o-transition: 0.25s ease-in-out;transition: 0.25s ease-in-out;} #header .header-wrap .nav-icon span:nth-child(1) {top: 0;} #header .header-wrap .nav-icon span:nth-child(2), #header .header-wrap .nav-icon span:nth-child(3) {width:60%;top: 50%;margin-top: -0.015rem;} #header .header-wrap .nav-icon span:nth-child(4) {bottom: 0;} #header .header-wrap .nav-icon.open {position:fixed;z-index: 1000;} #header .header-wrap .nav-icon.open span {background: #414141;} #header .header-wrap .nav-icon.open span:nth-child(1) {top: 0.18rem;width: 0%;left: 50%;} #header .header-wrap .nav-icon.open span:nth-child(2), #header .header-wrap .nav-icon.open span:nth-child(3) {width:100%;} #header .header-wrap .nav-icon.open span:nth-child(2) {-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);} #header .header-wrap .nav-icon.open span:nth-child(3) {-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);} #header .header-wrap .nav-icon.open span:nth-child(4) {top: 18px;left: 50%;width: 0%;} #header .header-wrap .nav-icon:hover span:nth-child(3){width:100%;} #header.scroll .header-wrap .nav-icon span{background:#222;} #footer{position:relative;background:#363636;padding:0.5rem 0;} #footer .footer-wrap{display:flex;justify-content:space-between;} #footer .footer-wrap .footer-logo-txt{display:none;} #footer .footer-wrap .info .addr{margin-top:0.3rem;} #footer .footer-wrap .info .addr p{font-size:0.14rem;color:#fff;} #footer .footer-wrap .info .addr p span{} #footer .footer-wrap .info .addr .copyright{margin-top:0.4rem;} #footer .footer-wrap .nav{display:flex;width:50%;justify-content: space-between;} #footer .footer-wrap .nav > div strong{display:block;} #footer .footer-wrap .nav > div strong a{color:#fff;font-size:0.22rem;font-family: 'Ubuntu-Light';padding-bottom:0.2rem;} #footer .footer-wrap .nav > div strong a:hover{text-decoration: none;} #footer .footer-wrap .nav > div{flex:1;} #footer .footer-wrap .nav > div a{display:block;color:#fff;font-size:0.13rem;line-height:0.27rem;font-family: 'Ubuntu-Light';} #footer .footer-wrap .nav > div a:hover{text-decoration: underline;} .top_btn{opacity:0;width:0.7rem; height:0.7rem; position:fixed; bottom:0.5rem; right:0.2rem; background-color:rgba(255,255,255,0.7); color:#333; text-align:center; padding-top:0.12rem; box-sizing:border-box;border-radius:100%;box-shadow: 1px 5px 10px rgba(0,0,0,0.3);cursor: pointer;z-index:1000;-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;} .top_btn.fixed{opacity: 1;} #main{} #main .slide-contents{position:relative;} #main .slide-contents .item1{} #main .slide-contents .item2{} #main .slide-contents .item3{} #main .slide-contents .slick-slide img{width:100%;height:100vh;} #main .slide-contents .slick-slide .tit{position:absolute;width:100%;text-align:center;top:50%;transform:translateY(-50%);font-size:0.46rem;color:#fff;font-family: 'Ubuntu-Medium';box-sizing: border-box;} #main .slide-contents .slick-slide .tit span{display:block;font-size:0.17rem;font-weight:100;font-family: 'Noto Sans KR';} #main .slide-contents .slick-slide .txt-group{position: absolute;max-width:15rem;width:100%;top:0.95rem;left:50%;transform:translateX(-50%);color:#fff;} #main .slide-contents .slick-slide .txt-group strong{display:inline-block;font-size:0.6rem;font-family: 'Ubuntu-Light';padding-bottom:0.25rem;border-bottom:0.01rem solid #fff;} #main .slide-contents .slick-slide .txt-group strong span{display:inline-block;margin-left:0.25rem;font-size:0.22rem;} #main .slide-contents .slick-slide .txt-group strong span em{display:inline-block;margin-left:0.15rem;font-size:0.2rem;} #main .slide-contents .slick-slide .txt-group ul{display:block;margin-top:0.25rem;} #main .slide-contents .slick-slide .txt-group ul li{position:relative;margin-top:0.2rem;font-size:0.16rem;padding-left:0.3rem;} #main .slide-contents .slick-slide .txt-group ul li:first-child{margin-top:0;} #main .slide-contents .slick-slide .txt-group ul li.last{padding-left:0;} #main .slide-contents .slick-slide .txt-group ul li em{position: absolute;bottom:-0.05rem;left:0;font-size:0.24rem;} #main .slide-contents .slick-slide .txt-group ul li:nth-child(2) em{bottom:inherit;top:-0.08rem;} #main .slide-contents .slick-dots{position:absolute;bottom:1.25rem;width:100%;font-size:0;text-align: center;} #main .slide-contents .slick-dots li{display:inline-block;margin:0 0.07rem;} #main .slide-contents .slick-dots li button{display:inline-block;width:0.1rem;height:0.1rem;background:#fff;border-radius: 100%;text-indent: -99999rem;} #main .slide-contents .slick-dots li.slick-active{} #main .slide-contents .slick-dots li.slick-active button{width:0.32rem;background:#fa9f00;border-radius: 0.15rem;} #main .slide-contents .icon-scroll{position: absolute;left:50%;transform:translateX(-50%);bottom:0.35rem;} #main .main-about{margin-top:1.05rem;display: flex;} #main .main-about .title{width:5.25rem} #main .main-about .title p{font-size:0.44rem;font-family: 'Ubuntu-Medium';} #main .main-about .title .more{display:inline-block;position:relative;margin-top:0.3rem;padding:0 0.1rem 0 0.02rem;color:#363636;font-size:0.14rem;} #main .main-about .title .more:after{content: "";display:inline-block;position:absolute;left:0;bottom:0;width:100%;height:0.07rem;background:#ffdd00;z-index:-1;} #main .main-about .txt-box{/*padding-left:1.4rem;*/} #main .main-about .txt-box .txt{color:#222;font-size:0.16rem;} #main .main-about .txt-box .txt + .txt{margin-top:0.35rem;} #main .main-product{margin-top:1.05rem;} #main .main-product .title{} #main .main-product .title p{font-size:0.44rem;font-family: 'Ubuntu-Medium';} #main .main-product .title .more{display:inline-block;position:relative;margin-top:0.3rem;padding:0 0.1rem 0 0.02rem;color:#363636;font-size:0.14rem;} #main .main-product .title .more:after{content: "";display:inline-block;position:absolute;left:0;bottom:0;width:100%;height:0.07rem;background:#ffdd00;z-index:-1;} #main .main-product .product-list{margin-top:0.55rem;padding:0 0.5rem;display:flex;justify-content:space-between;} #main .main-product .product-list > div{width:21%;border:0.01rem solid #8e8e8e;box-sizing:border-box;} #main .main-product .product-list > div a{display:block;padding-top:90%;position:relative;} #main .main-product .product-list > div a span{display:block;position: absolute;top:50%;left: 50%;transform:translate(-50%,-60%);width:100%;color:#222;font-size:0.24rem;text-align:center;font-weight:500;} #main .main-product .product-list > div a span em{display:block;margin:0 auto;width:1.5rem;height:1.5rem;} #main .main-product .product-list > div a span i{display:block;margin-top:-0.2rem;} #main .main-product .product-list > div a span em.icon1{ background-position: -4.5rem -2.5rem;} #main .main-product .product-list > div a span em.icon2{ background-position: -1.5rem -4rem;} #main .main-product .product-list > div a span em.icon3{ background-position: -1.5rem -2.5rem;} #main .main-product .product-list > div a span em.icon4{ background-position: -4.5rem -4rem;} #main .main-product .product-list > div:hover{background:#0c356b;border-color:#0c356b;} #main .main-product .product-list > div:hover a span i{color:#fff;} #main .main-product .product-list > div:hover a span em.icon1{ background-position: -3rem -2.5rem;} #main .main-product .product-list > div:hover a span em.icon2{ background-position: 0 -4rem;} #main .main-product .product-list > div:hover a span em.icon3{ background-position: 0 -2.5rem;} #main .main-product .product-list > div:hover a span em.icon4{ background-position: -3rem -4rem;} #main .main-exhibitions{margin-top:1.05rem;padding:0.6rem 0;background:#ebebeb;} #main .main-exhibitions .layout{display:flex;} #main .main-exhibitions .title{width:20%;} #main .main-exhibitions .title p{font-size:0.44rem;font-family: 'Ubuntu-Medium';} #main .main-exhibitions .title .more{display:inline-block;position:relative;margin-top:0.3rem;padding:0 0.1rem 0 0.02rem;color:#363636;font-size:0.14rem;z-index:1;} #main .main-exhibitions .title .more:after{content: "";display:inline-block;position:absolute;left:0;bottom:0;width:100%;height:0.07rem;background:#ffdd00;z-index:-1;} #main .main-exhibitions .list-box{position:relative;padding-left:1rem;width:80%;box-sizing: border-box;} #main .main-exhibitions .no-data{width:80%;padding:0;box-sizing: border-box;text-align: center;font-size:0.2rem;line-height: 1rem;} #main .main-exhibitions .list-box .slick-item3{} #main .main-exhibitions .list-box .slick-item3 .slick-slide{margin:0 0.22rem;padding:0.4rem 0.35rem;background:#fff;box-sizing: border-box;} #main .main-exhibitions .list-box .slick-item3 .slick-slide em{position: absolute; top: 0; left: 0;display: inline-block; background: url(/_public/images/common/icon.png); width:0.3rem; height:0.3rem;background-size: 5rem;} #main .main-exhibitions .list-box .slick-item3 .slick-slide .tit{color:#363636;font-size:0.22rem;font-weight:500; } #main .main-exhibitions .list-box .slick-item3 .slick-slide .date{position: relative;margin-top:0.3rem;color:#fa9f00;font-size:0.12rem;height:0.3rem; padding-left:0.3rem;} #main .main-exhibitions .list-box .slick-item3 .slick-slide .date em{background-position:-52px -54px; } #main .main-exhibitions .list-box .slick-item3 .slick-slide .booth{ position: relative; color:#fa9f00;font-size:0.12rem;padding-left:0.3rem; height:0.3rem;} #main .main-exhibitions .list-box .slick-item3 .slick-slide .booth em{background-position:-94px -52px;} #main .main-exhibitions .list-box .slick-item3 .slick-slide .button{margin-top:0.4rem;display:inline-block;width:1rem;color:#515151;text-align:center;line-height: 0.35rem;border:0.01rem solid #6c6e70;} #main .main-exhibitions .list-box .slick-prev{overflow:hidden;display:inline-block;position: absolute;bottom: 0;left: 20px;width:0.3rem;line-height: 0.3rem;text-indent: -99999999rem;border:0.01rem solid #bcbcbc;background:#f6f6f6;z-index:10;} #main .main-exhibitions .list-box .slick-prev:before{content: "";display: inline-block;position: absolute;left: -0.11rem;top: -0.09rem;width: 0.5rem;height: 0.5rem;background: url(/_public/images/common/icon.png);background-size: 6rem;background-position: -300px 0px;transform: rotate(-180deg);} #main .main-exhibitions .list-box .slick-next{overflow:hidden;display:inline-block;position: absolute;bottom: 0;left: 53px;width:0.3rem;line-height: 0.3rem;text-indent: -99999999rem;border:0.01rem solid #0c387b;background:#0c387b;z-index:10;} #main .main-exhibitions .list-box .slick-next:before{content: "";display: inline-block;position: absolute;left: -0.11rem;top: -0.1rem;width: 0.5rem;height: 0.5rem;background: url(/_public/images/common/icon.png);background-size: 6rem;background-position: -350px 0px;} #main .main-exhibitions .list-box .slick-list{padding-bottom:0.5rem;} #main .main-exhibitions .list-box .pagingInfo{position: absolute;left: 2rem;bottom: 0.05rem;font-size: 0.15rem;color: #363636;font-weight: 500;} #visual{height:3.9rem;position:relative;padding-top:1.55rem;box-sizing: border-box;} #visual.sub01{background:url(/_public/images/sub/visual01.png);background-size:cover; } #visual.sub02{background:url(/_public/images/sub/visual02.png);background-size:cover;} #visual.sub03{background:url(/_public/images/sub/visual03.png);background-size:cover;} #visual .txt{width:100%;font-size:0.55rem;text-align: center;color:#fff;font-family: 'Ubuntu-Light'; font-weight:600} .navi-wrap{background:#fafafa;border-bottom:0.01rem solid #e9e9e9;} .navi-wrap > *{box-sizing: border-box;} .navi-wrap .navigation{font-size:0; margin:0 auto; max-width:15rem; } .navi-wrap .navigation .home{display:inline-block;position:relative;text-align:center;border-left:0.01rem solid #e5e5e5;width:0.5rem;line-height: 0.5rem;background-position:-2rem 0;vertical-align: top;} .navi-wrap .navigation .level1{display:inline-block;position:relative;width:100%;max-width:2rem;border-left:0.01rem solid #e5e5e5;border-right:0.01rem solid #e5e5e5;vertical-align: top;} .navi-wrap .navigation .level1 a{display:block;position:relative;padding:0 0.2rem;font-size:0.16rem;color:#222;line-height: 0.5rem;font-weight:500;} .navi-wrap .navigation .level1 > a:after{content: "";display:inline-block;position:absolute;top:0;right:0;width:0.5rem;height:0.5rem;background:url(/_public/images/common/icon.png);background-size:6rem;background-position:0 -1rem;} .navi-wrap .navigation .level1 ul{display:none;position:absolute;width:100%;border:0.01rem solid #e5e5e5;z-index:100; left:-1px;} .navi-wrap .navigation .level1 ul li{border-bottom:0.01rem solid #e5e5e5;} .navi-wrap .navigation .level1 ul li a{background:#fafafa;color:#5d5d5d;font-weight:400;} .navi-wrap .navigation .level2{display:inline-block;margin-left:0.25rem;vertical-align: top; } .navi-wrap .navigation .level2 .level2-wrap{font-size:0;} .navi-wrap .navigation .level2 a{display:inline-block;position:relative;margin:0 0.22rem;font-size:0.16rem;color:#222;line-height: 0.5rem;font-weight:400;} .navi-wrap .navigation .level2 a.active{color:#ffa72a;} .navi-wrap .navigation .level2 a.active:before{content: "";display:block;position:absolute;bottom:0;left:0;width:100%;height:0.03rem;background:#ffa72a;} /* 서브 */ #contents{padding:0.4rem 0 1rem;font-size:0;} #contents .aside{display:inline-block;width:2.5rem;} #contents .aside .tit{position: relative;padding-top:0.25rem;color:#202020;font-size:0.28rem;font-weight:500;} #contents .aside .tit:before{content: "";display:inline-block;position:absolute;top:0;left:0;width:0.15rem;height:0.03rem;background:#202020;} #contents .aside .snb{margin-top:0.35rem;} #contents .aside .snb a{display:block;margin-top:0.1rem;padding:0 0.2rem;color:#464646;font-size:0.16rem;background:#f1f1f1;line-height: 0.4rem;} #contents .aside .snb a:first-child{margin-top:0;} #contents .aside .snb a:hover, #contents .aside .snb a.active{color:#fff;background:#202020;} #contents .blind{display:none;} #contents .aside.fixed{background:#fff;position: fixed;top:0.95rem;z-index: 100;} #contents .aside.fixed + .contents-box{margin-left:2.5rem;} /* 서브레이아웃 */ #contents .page-tit{padding-bottom:0.2rem;border-bottom:0.01rem solid #f0f0f0;text-align:center;color:#004b4b;font-size:0.32rem;font-weight:500; margin-bottom:0.5rem;} #contents .page-tit a{ display:inline-block;padding:0 0.4rem; color:#727272; line-height:0.3rem;} #contents .page-tit a:hover{color:#004b4b;} #contents .page-tit a:first-child{border-right:1px solid #727272} #contents .contents-box{display:inline-block;width:calc(100% - 2.5rem);box-sizing:border-box;padding-left:0.5rem;vertical-align: top;} #contents .subtop-img{width:100%; height:360px; background-color:#efefef;} #contents .contents-box .subtop-img{width:100%; height:380px; background-color:#efefef;} #contents .subtop-txtbox{width:90%; padding:0.8rem; background-color:#fafafa; color:#222; margin:0 auto; margin-top:-1rem; box-sizing:border-box; text-align:left} #contents .subtop-txtbox strong{color: #22b24c;} #contents .page{ width:353px;height:35px; margin:0 auto; margin-top:0.9rem;} #contents .page div{display:inline-block;} #contents .page .page-btn a{display:block;width:35px; height:35px; border:1px solid #e5e5e5; text-indent:-99px;overflow:hidden;} #contents .page .prev1 a{background: url(/_public/images/common/icon.png); background-position:-357px -58px; transform: rotate(-180deg)} #contents .page .prev2 a{background: url(/_public/images/common/icon.png); background-position:-257px -58px; transform: rotate(-180deg)} #contents .page .next1 a{background: url(/_public/images/common/icon.png); background-position:-257px -58px;} #contents .page .next2 a{background: url(/_public/images/common/icon.png); background-position:-357px -57px;} #contents .page .num{height:35px; vertical-align:top;padding:0 0.2rem;} #contents .page .num a {display:inline-block; width:35px; height:35px;line-height:35px; text-align:center; } #contents .page .num a:first-child{color:#fa9f00; font-weight:500;} /* about us */ #contents .contents-box .aboutus-wrap{} #contents .contents-box .aboutus-wrap .aboutus-detail{font-size:0.16rem} #contents .contents-box .aboutus-wrap .aboutus-detail .subtop-img{background: url(/_public/images/sub/aboutus.png);} #contents .contents-box .aboutus-wrap .history{position:relative; width:100%;height:1630px;} #contents .contents-box .aboutus-wrap .history:before{content:""; display:block; position:absolute; width:1px; height: 100%; left:50%; background-color:#e4e4e4;} #contents .contents-box .aboutus-wrap .history ul{padding-top:1rem;} #contents .contents-box .aboutus-wrap .history ul li{position:relative; width:50%; box-sizing:border-box; margin-bottom:0.3rem;} #contents .contents-box .aboutus-wrap .history ul .h-left{text-align:right; padding-right:0.5rem; } #contents .contents-box .aboutus-wrap .history ul .h-left:before{content:""; display:block; position:absolute; right:0.05rem; top:30px;width:30px; height:1px;background-color:#e4e4e4;} #contents .contents-box .aboutus-wrap .history ul .h-left:after{content:""; display:block; position:absolute; right:-0.1rem; top:20px; width:20px; height:20px; background-color:#fff;border: 4px solid #fa9f00; box-sizing:border-box; border-radius:10px; z-index:999;} #contents .contents-box .aboutus-wrap .history ul .h-right{ padding-left:0.5rem; margin-left:50%;} #contents .contents-box .aboutus-wrap .history ul .h-right:before{content:""; display:block; position:absolute; left:0.05rem; top:30px;width:30px; height:1px;background-color:#e4e4e4;} #contents .contents-box .aboutus-wrap .history ul .h-right:after{content:""; display:block; position:absolute; left:-0.09rem; top:20px;width:20px; height:20px; background-color:#fff;border: 4px solid #fa9f00; box-sizing:border-box; border-radius:10px; z-index:999;} #contents .contents-box .aboutus-wrap .history ul li > strong{display:block; font-size:0.35rem;} #contents .contents-box .aboutus-wrap .history ul li span{color:#5b5b5b} /* Vision */ #contents .contents-box .vision-wrap .vision-detail{font-size:0.16rem} #contents .contents-box .vision-wrap .vision-detail .subtop-img{background: url(/_public/images/sub/vision.png);} #contents .contents-box .vision-wrap .vision-detail .subtop-txtbox strong{ color:#22b24c;} #contents .contents-box .vision-wrap .vision-detail .value{margin-top:1.3rem;} #contents .contents-box .vision-wrap .vision-detail .value > strong{display:block; width:100%; font-size:0.36rem; text-align:center; margin-bottom:0.6rem;} #contents .contents-box .vision-wrap .vision-detail .value .value-item{} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item{position:relative;width:100%; height:340px; margin-top:0.3rem;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item > div{ float: left;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item:before{content:""; display:block; position:absolute; top:40%;left:47%;width:50px; height:1px; background-color:#5d5d5d;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item .item-txt{ background-color:#fafafa; width:50%;height:100%;padding:0.8rem; box-sizing:border-box; word-break:break-word} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item .item-txt div{width:50px; height:35px; line-height:35px; background-color:#0c4da2; color:#fff; text-align:center; font-size:0.18rem; font-weight:500;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item .item-img{width:50%; height:340px;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item:nth-child(1) .item-img{background: url(/_public/images/sub/vision_img01.png); background-position: center;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item:nth-child(2) .item-img{background: url(/_public/images/sub/vision_img02.png); background-position: center;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item:nth-child(3) .item-img{background: url(/_public/images/sub/vision_img03.png); background-position: center;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item .item-txt strong{display:block;font-size:0.28rem; font-weight:400;margin:0.15rem 0;} /*brand*/ #contents .contents-box .brand-wrap .brand-detail{font-size:0.16rem} #contents .contents-box .brand-wrap .brand-detail .subtop-txtbox strong{ color:#22b24c;} #contents .contents-box .brand-wrap .brand-detail .subtop-img {height:500px;background: url(/_public/images/sub/brand.png);} #contents .contents-box .brand-wrap .brand-detail .subtop-img p{padding:0.8rem 0.5rem; font-family: 'Ubuntu-Medium'; font-size:0.3rem; line-height:0.5rem; color:#fff;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo{margin-top:0.8rem;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div p{font-size:0.23rem; margin-bottom:0.2rem;margin-top:0.4rem;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul{width:90%; height:auto; margin:0 auto; background-color:#fafafa; padding:0.2rem 0} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul li{display:flex; height:0,6rem; margin-top:0,2rem; padding:0.3rem 0} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul li:first-child{border:none;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul li > div{width:366px;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul li > div img{max-width:none;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul li span{position:relative;width:65%; padding-right:0.5rem;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul li span div{font-size:0.15rem; color:#727272; font-weight:400; margin-top:0.1rem;} /*Contact us*/ #contents .contactus{} #contents .contactus .contactus-wrap{font-size:0.16rem;} #contents .contactus .contactus-wrap .contactus-detail{} #contents .contactus .contactus-wrap .contactus-detail .contactus-form{width:800px; height:auto; margin:0 auto} #contents .contactus .contactus-wrap .contactus-detail .contactus-form .txt-area{} #contents .contactus .contactus-wrap .contactus-detail .contactus-form .txt-area p:first-child{color:#222; font-weight:400; margin-bottom:0.3rem;} #contents .contactus .contactus-wrap .contactus-detail .contactus-form .txt-area p{color:#5d5d5d;} #contents .contactus .contactus-wrap .contactus-detail .contactus-form .txt-area p strong{display:block;color:#222;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap{margin-top:1.6rem; display:flex; position:relative;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .map-txt{width:500px; height:370px; font-weight:400;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .map-txt ul{} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .map-txt ul li{position:relative;margin-top:0.2rem;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .map-txt ul li:nth-child(2){margin-bottom:0.4rem;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .map-txt ul li img{width:465px; height:70px;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .map-txt ul li span{position:absolute;top:0;left:90px;vertical-align:top; display:inline-block;font-weight:300;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .direction{position:absolute; top:280px;left:400px;width:200px; height:50px; line-height:50px; padding-left:0.2rem;background-color:#fa9f00; color:#fff; font-weight:400; border-radius:5px; box-shadow:2px 2px 5px rgba(0,0,0,0.2);} #contents .contactus .form-wrap{margin-top:0.7rem;} #contents .contactus .form-wrap .bottom{text-align: right;padding:0 0.2rem;} #contents .contactus .form-wrap .bottom .button{margin-left:0.4rem;display:inline-block;width:1.1rem;line-height: 0.4rem;color:#fff;font-size:0.16rem;background:#3b3b3b;text-align: center;} /*business*/ #contents .business-wrap{font-size:0.16rem;} #contents .business-wrap .business-detail{} #contents .business-wrap .business-detail .subtop-img {height:400px;} #contents .business-wrap .business-detail .horizontal {overflow:hidden; width:8.27rem; margin:0 auto; margin-bottom:0.3rem;} #contents .business-wrap .business-detail .horizontal li{display: inline-block;} #contents .business-wrap .business-detail .horizontal li a {display: inline-block; position: relative; padding: 0 0.25rem; margin-right:-4px;font-size: 0.16rem; color: #5b5b5b; line-height: 0.5rem; font-weight: 400;} #contents .business-wrap .business-detail .horizontal li a:before{content: "";display:inline-block;position:absolute;width:0.01rem;height:0.15rem;background: #b1b1b1;top:0.2rem;left:0;} #contents .business-wrap .business-detail .horizontal li:first-child a:before{display:none;} #contents .business-wrap .business-detail .horizontal li.active a{color:#ffa72a;} #contents .business-wrap .business-detail .horizontal li:hover a{color:#ffa72a} #contents .business-wrap .business-detail .tab-content{display: none;} #contents .business-wrap .business-detail .tab-content:first-child{display: block;} #contents .business-wrap .business-detail .subtop-img p{padding:0.6rem; font-family: 'Ubuntu-Medium'; font-size:0.35rem; line-height:0.5rem; color:#fff;text-shadow: 5px 5px 14px rgba(0,0,0,0.1);} #contents .commercial .business-wrap .business-detail #tab-1 .subtop-img{background: url(/_public/images/sub/business_img01.png) center;} #contents .commercial .business-wrap .business-detail #tab-2 .subtop-img{background: url(/_public/images/sub/business_img01.png) center;} #contents .commercial .business-wrap .business-detail #tab-3 .subtop-img{background: url(/_public/images/sub/business_img03.png) center;} #contents .commercial .business-wrap .business-detail #tab-4 .subtop-img{background: url(/_public/images/sub/business_img05.png) center;} #contents .sports .business-wrap .business-detail #tab-1 .subtop-img, #contents .sports .business-wrap .business-detail #tab-2 .subtop-img, #contents .sports .business-wrap .business-detail #tab-3 .subtop-img, #contents .sports .business-wrap .business-detail #tab-4 .subtop-img{background: url(/_public/images/sub/business_img04.png) center;} #contents .sports .business-wrap .business-detail .horizontal{width:5.52rem} #contents .business-wrap .business-detail table{width:100%; border-top:1px solid #202020; margin-top:0.4rem;} #contents .business-wrap .business-detail table tbody tr {height:60px; border-bottom:1px solid #e5e5e5} #contents .business-wrap .business-detail table tbody tr th{background-color:#f8f8f8} #contents .business-wrap .business-detail table tbody tr td{padding-left:0.3rem;} /* 제품 */ #contents .contents-box .product-category{text-align: left;width:100%;max-width:12rem;} #contents .contents-box .product-category a{display:inline-block;position:relative;padding:0 0.25rem;font-size:0.16rem;color:#5b5b5b;line-height: 0.6rem;font-weight:400;} #contents .contents-box .product-category a:hover {color:#222;} #contents .contents-box .product-category a:before{content: "";/*display:inline-block;*/display:none; position:absolute;width:0.01rem;height:0.15rem;background: #b1b1b1;top:0.2rem;left:0;} #contents .contents-box .product-category a:first-child:before{display:none;} #contents .contents-box .product-category a.active{color:#fff;font-weight:500;background-color: #fa9f00;} #contents .contents-box .product-category.fixed{position:fixed;top:0.75rem;background:#fff;z-index:100;} #contents .contents-box .product-wrap{margin-top:1rem;border-bottom: 0.01rem solid #f0f0f0;padding-bottom:0.6rem;} #contents .contents-box .product-wrap .product-detail{position:relative;} #contents .contents-box .product-wrap .product-detail strong{display:block;font-size:0.23rem;color:#222;} #contents .contents-box .product-wrap .product-detail .txt-area{margin-top:0.3rem; margin-bottom:0.3rem;font-size:0.16rem;color:#5b5b5b;} #contents .contents-box .product-wrap .product-detail .img-area{margin-top:0.5rem;} #contents .contents-box .product-wrap .product-detail .spec-area{margin-top:0.7rem;} #spec-table{width:100%;/*table-layout: fixed;*/border-top:0.01rem solid #5b5b5b;border-bottom:0.01rem solid #5b5b5b; white-space: nowrap; margin-bottom:0.1rem;} #spec-table thead{} #spec-table thead tr{} #spec-table thead tr th{padding:0.1rem;color:#fff;font-size:0.15rem;background:#363636;font-weight:400;border-top:0.01rem solid #fff;border-left:0.01rem solid #fff;} #spec-table thead tr th:first-child{border-left:0;} #spec-table tbody{} #spec-table tbody tr{} #spec-table tbody tr th{padding:0.1rem;color:#fff;font-size:0.15rem;background:#363636;border-top:0.01rem solid #fff;font-weight:400;} #spec-table tbody tr:first-child th{border-color:#5b5b5b;} #spec-table tbody tr td{padding:0.1rem;color:#5d5d5d;font-size:0.15rem;text-align:center;border-top:0.01rem solid #5b5b5b;} /*news*/ #contents .news-wrap{} #contents .news-wrap .news-detail{font-size:0.16rem;} #contents .news-wrap .news-detail .total-list{float:right; color:#222; margin-bottom:0.05rem; font-size:0.15rem; font-weight:400;} #contents .search-wrap{display:flex; position:relative; margin-bottom:0.4rem;} #contents .search-wrap .search-txt{} #contents .search-wrap .search-box{ width:485px; height:45px; position:absolute; top:0; right:0;} #contents .search-wrap .search-box > div{float:left;} #contents .search-wrap .search-box > div select{width:130px; height:45px; border:1px solid #d2d2d2; padding: 0.1rem; box-sizing:border-box; margin-right:0.05rem; -webkit-appearance: none; -moz-appearance: none; background: url(/_public/images/common/icon.png) 0.9rem -0.84rem; background-size:5rem;} #contents .search-wrap .search-box > div .txt{width:300px; height:45px; border:1px solid #d2d2d2; padding: 0.1rem; box-sizing:border-box;} #contents .search-wrap .search-box > div .btn{width:45px; height:45px; background: url(/_public/images/common/icon.png) #202020; background-position:-153px -52px; border:none; text-indent:-100px;} #contents .news-wrap .news-detail .bbs-news{width:100%;} #contents .news-wrap .news-detail .bbs-news tbody{border-top:2px solid #22} #contents .news-wrap .news-detail .bbs-news tbody tr{height:120px; border-bottom:1px solid #e5e5e5} #contents .news-wrap .news-detail .bbs-news tbody tr td{} #contents .news-wrap .news-detail .bbs-news tbody tr .category{} #contents .news-wrap .news-detail .bbs-news tbody tr .category span{display:block;width:75px; height:30px; line-height:30px; color:#fff;background-color:#222;text-align:center; font-size:0.15rem; margin:0 auto;} #contents .news-wrap .news-detail .bbs-news tbody tr .category-2 span{display:block;width:75px; height:30px; line-height:30px; color:#fff;background-color:#0c4da2;text-align:center; font-size:0.15rem; margin:0 auto;} #contents .news-wrap .news-detail .bbs-news tbody tr .subject span{display:block; font-weight:400; color:#5d5d5d} #contents .news-wrap .news-detail .bbs-news tbody tr .subject:hover span{color:#222;} #contents .news-wrap .news-detail .bbs-news tbody tr:hover{background-color:#f8f8f8} #contents .news-wrap .news-detail .bbs-news tbody tr .subject .admin{font-size:0.15rem; font-weight:300;} #contents .news-wrap .news-detail .bbs-news tbody tr .date{font-size:0.14rem; text-align:center;} /*exhibition*/ #contents .exhibition-wrap .exhibition-detail{font-size:0.16rem;} #contents .exhibition-wrap .exhibition-detail .total-list{color:#222; margin-bottom:0.05rem; font-size:0.15rem; font-weight:400; float:right; margin-top: 33px;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .horizontal {overflow:hidden;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .horizontal li a {float:left; height:60px; line-height:60px; width:300px;font-size:0.19rem; font-weight:400;text-align:center; color:#727272;background-color:#f9f9f9; border:1px solid #dfdfdf} #contents .exhibition-wrap .exhibition-detail .tab-wrap .horizontal li:first-child a{border-right:none;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .horizontal li:hover a{color:#fff;background:#414141; font-weight:400;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .horizontal .active a{background-color:#414141; color:#fff} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content{width:100%; height:auto; font-size:0; border-top:1px solid #dfdfdf; margin-top:-1px; padding-top:0.8rem;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul{display:inline-block;width:calc(100%/3);font-size:0.16rem; } #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul:first-child{margin-left:0;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul:hover{background-color:#f8f8f8} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li{} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a{display:block; padding:0.6rem; box-sizing:border-box;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a:hover h3{color:#de8c00} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a:hover div{color:#de8c00} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a img{height:65px; margin-bottom:0.3rem;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a h3{margin-bottom:0.3rem; color:#222; font-size:0.22rem;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a div{padding-bottom:0.1rem; color:#5d5d5d; position:relative; padding: 0.13rem 0.5rem; font-weight:400} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a em{position:absolute; top:0 ; left:0;margin-top:0.1rem;display:inline-block;width:30px; height:30px;background: url(/_public/images/common/icon.png); } #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a .exh-date em{background-position:-60px -60px;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a .exh-adress{height:1.2rem;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a .exh-adress em{background-position:-10px -60px;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a .exh-booth em{background-position:-110px -60px;} #contents .exhibition-wrap .exhibition-detail .search-wrap .search-box{width:349px;} @media all and (max-width: 1200px){ #header .header-wrap .util-menu a.email{display:none;} } /* tablet */ @media all and (max-width: 1024px){ html{font-size:100px;} #header .header-wrap{padding:0.3rem; position:absolute; top:0; left:0;width:100%; box-sizing:border-box; } #header.scroll .header-wrap{position:fixed; background:rgba(255,255,255,0.7); z-index:1000; box-shadow:4px 4px 8px rgba(0,0,0,0.2);} #header .header-wrap .logo{display: inline-block;width: 1.2rem;background: url(/_public/images/common/logo3.png) 0 50% no-repeat;background-size:100%;line-height: 0.43rem;} #header .header-wrap .gnb-wrap{position:fixed;top:0;width:100%;height:100%;right:-100%;background:rgba(0,0,0,0.3);-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;z-index:1000;} #header .header-wrap .gnb-wrap.active{right:0;} #header .header-wrap .gnb{width:70%;height:100%;padding-top:1rem;background:#fff;position: absolute;right:0;box-sizing: border-box} #header .header-wrap .gnb ul li{margin: 0 0.3rem;display:block;} #header .header-wrap .gnb ul li:first-child{margin-left: 0.3rem;} #header .header-wrap .gnb ul li > a{color:#222;font-size:0.25rem;display:block; height:0.7rem; line-height:0.7rem; margin-left:0;padding-left:0; border-bottom:1px solid #f2f2f2} #header .header-wrap .gnb ul li > a:first-child{margin-left:0;} #header .header-wrap .gnb ul li > a.contact-us{font-size:0.25rem;padding:0} #header .header-wrap .gnb ul li > a.email{display:none;} #header .header-wrap .nav-icon{display:block; width:0.3rem; height:0.2rem;} #header .header-wrap .nav-icon span{height:0.02rem;} #header.scroll .header-wrap .logo{display: inline-block;width: 1.4rem;background: url(/_public/images/common/logo3.png) 0 50% no-repeat;background-size:100%;line-height: 0.8rem;} #header.scroll .header-wrap .gnb ul li > a.contact-us{background-color:transparent;} #header.sub .header-wrap .logo, #header.scroll .header-wrap .logo{display: inline-block;width: 1.2rem;background: url(/_public/images/common/logo3.png) 0 50% no-repeat;background-size:100%;line-height: 0.43rem;} #header .header-wrap .gnb ul li.contact{display:block;} #header.sub .header-wrap .gnb ul li > a.email{display:none;} #header.sub .header-wrap .gnb ul li > a.contact-us{position:relative;margin-left:0.3rem;font-size:0.25rem;padding-left:0.15rem;background-color: transparent;color:#222;} #header .header-wrap .gnb ul li > a.contact-us:before{margin-right:0;padding:0;position:absolute; top:0.23rem; left:1.6rem;width:0.5rem; height:0.48rem; background: url(/_public/images/common/icon_contactus_m.png) no-repeat;} #header .header-wrap .util-menu{display:none;} #header .header-wrap .gnb .dropdown{width:100%;position: relative;margin-top:0;background:#fff;} #header .header-wrap .gnb .dropdown:before{display: none;} #header .header-wrap .gnb .dropdown a{position:relative;margin-top: 0.25rem;font-family:'Ubuntu-Light';font-size:0.2rem;color:#6b6b6b;font-weight:600;} #header .header-wrap .gnb .dropdown a:before{content: "";display:inline-block;position:absolute;top:0.09rem;right:0;width:0.11rem;height:0.16rem;background:url(/_public/images/common/gnb_icon.png) no-repeat;} #header .header-wrap .gnb .dropdown a:first-child{margin:0;} #header .header-wrap .gnb ul li.contact .dropdown{opacity: 1;} #visual{height:3rem;} .navi-wrap .navigation{} .navi-wrap .navigation div{} .navi-wrap .navigation .level2{margin-left:0} .navi-wrap .navigation .level2{width: calc(100% - 253px);overflow-x: auto;} #contents{width:92%; margin:0 auto;} .layout{width:auto;} #contents .aside{width:25%;} #contents .contents-box{padding-left:2%; width:75%} #contents .page-tit{margin-bottom:0.3rem;} #contents .subtop-txtbox{width:90%; margin-top:-1.3rem; padding:0.7rem;} #contents .search-wrap .search-box{width:329px;height:40px;} #contents .search-wrap .search-box > div select{width:100px; height:40px; background: url(/_public/images/common/icon.png) 0.6rem -0.85rem; background-size: 5rem;} #contents .search-wrap .search-box > div .txt{width:180px; height:40px;} #contents .search-wrap .search-box > div .btn{width:40px; height:40px; background-position:-155px -55px} #contents .search-wrap .search-txt{width:48%;} #contents .aside.fixed{position:inherit;top:inherit} #contents .aside.fixed + .contents-box{margin-left:0;} /*table*/ .tableWrapper{width: 100%; overflow: auto; margin: 0 auto;font-weight:400; color:#777} #contents .contents-box .product-wrap .product-detail .spec-area .table-txt{display:block; font-size:0.14rem; margin-top:0rem;} .table-txt2{display:block; font-size:0.14rem; margin-top:0rem;} /*main*/ #main .slide-contents .slick-slide .txt-group{box-sizing: border-box;padding:0.2rem;} #main .main-about, #main .main-product{width:90%;} #main .main-exhibitions{padding:0.6rem 5%;} #main .main-about .title p, #main .main-product .title p, #main .main-exhibitions .title p{font-size:0.4rem;} #main .main-about .txt-box{padding-left:1.2rem;} #main .main-about .txt-box .txt{word-break:break-word} #main .main-product .product-list{flex-wrap:wrap;} #main .main-product .product-list > div{width:49%; margin-bottom:0.1rem;} #main .main-product .product-list > div a{padding:0; height:1.7rem;} #main .main-product .product-list > div a span{font-size:0.2rem; top: 57%; box-sizing: border-box;} #main .main-product .product-list > div a span em{margin:0} #main .main-product .product-list > div a span i{position:absolute; top:42%; left:1.3rem; margin-top:0; text-align:left;} #main .main-exhibitions{position:relative;} #main .main-exhibitions .layout{display:block;} #main .main-exhibitions .list-box{width:100%; padding-left:0; margin-top:0.3rem;} #main .main-exhibitions .title .more{position:relative;} #main .main-exhibitions .list-box .pagingInfo{left:1rem;} #main .main-exhibitions .list-box .slick-item3 .slick-slide .date{margin-top:0.2rem;} #main .main-exhibitions .list-box .slick-item3 .slick-slide .button{margin-top:0.25rem;} #main .main-exhibitions .no-data{width:100%;text-align: center;margin-top:0.3rem;font-size:0.2rem;} #visual{padding-top:1.3rem;} /*about us*/ #contents .contents-box .aboutus-wrap .history{height:1910px;} #contents .contents-box .aboutus-wrap .history ul .h-left:before{left:90%;} /*#contents .contents-box .aboutus-wrap .history ul .h-left:after{left:97%;}*/ #contents .contents-box .aboutus-wrap .history ul .h-right:before{right:90%;} /*#contents .contents-box .aboutus-wrap .history ul .h-right:after{right:97%;}*/ /*vision*/ #contents .contents-box .vision-wrap .vision-detail .value{margin-top:0.8rem;} #contents .contents-box .vision-wrap .vision-detail .value > strong{font-size:0.3rem;margin-bottom:0.2rem;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item{position:relative; height:340px;background-color: #fafafa;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item > div{float:left;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item:before{left:45%;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item .item-txt{width:50%; padding:0.5rem;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item .item-img {width:50%} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item .item-img img{width:100%;} /*brand*/ #contents .contents-box .brand-wrap .brand-detail .fishing-logo{width:100%;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul{width:90%; height:auto;padding:0.5rem; box-sizing:border-box;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul li{height:auto; display:block; padding-bottom:0;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul li > div{margin:0 auto; margin-bottom: 0.2rem;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul li:first-child{margin-top:0;} /*contact us*/ #contents .contactus .contactus-wrap .contactus-detail .contactus-form{width:100%;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap {width:100%;display:block; height:585px} #contents .contactus .contactus-wrap .contactus-detail .map-wrap div{} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .map-txt{position:absolute; bottom:0; left:0;width:100%; height:auto;margin-bottom:0.3rem;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .map-txt ul li{margin-top:0.05rem;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .map-txt ul li:first-child{display:none} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .map{width:100%;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .direction{top:509px; right:0.1rem; left:auto} /*business*/ #contents .contents-box .business-wrap .business-detail .horizontal{width:100%;} #contents .contents-box .business-wrap .business-detail .horizontal li{} #contents .contents-box .business-wrap .business-detail .horizontal li a{padding: 0 0.15rem; font-size:0.15rem;} #contents .contents-box .business-wrap .business-detail .horizontal li a:first-child:before{display:block;} #contents .contents-box .business-wrap .business-detail .horizontal li a:before{width: 0.05rem; height:0.05rem; top:0.23rem;} #contents .contents-box .business-wrap .business-detail table{width:100%; margin-top:0.2rem;} #contents .contents-box .business-wrap .business-detail table tbody tr th{width:30%} /*product*/ #contents .contents-box .product-category{display:none;margin-top:-0.3rem;} #contents .contents-box .product-category.fixed {width:75%;top: 1.3rem;} /*news*/ #contents .news-wrap .news-detail .bbs-news tbody tr .subject{padding:0 4%;} /*exhibition*/ #contents .exhibition-wrap .exhibition-detail .total-list{margin-top:30px} #contents .exhibition-wrap .exhibition-detail .tab-wrap .horizontal li a{width:250px;font-size:0.17rem; height:55px; line-height:55px;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content{padding-top:0.4rem;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul{width:calc(100%/2)} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a{padding:0.5rem;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a div{font-size:0.16rem;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a h3{margin-bottom:0.2rem;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul:nth-child(9){display:none;} #contents .exhibition-wrap .exhibition-detail .search-wrap .search-box{width:224px} /*footer*/ #footer{width:100%; padding:0.5rem 2%; box-sizing:border-box;} #footer .footer-wrap{} #footer .footer-wrap .info{margin:0 auto;} #footer .footer-wrap .info .footer-logo{display:block;width:332px;margin:0 auto;} #footer .footer-wrap .nav{display:none;} #footer .footer-wrap .info .addr{display:block;text-align:center;} #footer .footer-wrap .info .addr .copyright{margin-top:0.2rem;} .top_btn{bottom:0.5rem;} } /* mobile */ @media all and (max-width: 640px){ html{font-size:50px;} .__se_tbl_ext{width:10rem !important;table-layout: fixed;} .__se_tbl_ext tbody tr td{padding:0.2rem !important;font-size:0.26rem !important;} /* form */ .form-flex{flex-wrap: wrap;width:100%;} .form-flex .cmm-form{width:100%;padding:0.2rem 0rem 0.4rem;} .form-flex .cmm-form:first-child{width:100%;padding:0;} .cmm-form{padding:0.4rem;} .cmm-form .label{font-size:0.3rem;line-height: 0.8rem;} .cmm-form .label .add-button{font-size: 0.3rem;} .cmm-form .form input[type="text"], .cmm-form .form input[type="tel"], .cmm-form .form input[type="email"], .cmm-form .form input[type="password"]{width:100%;height:0.8rem;border:0.02rem solid #e5e5e5;padding:0 0.4rem;} .cmm-form .form .security-input{max-width:60%;} .cmm-form .form input::placeholder{color: #ccc;} .cmm-form .form input:focus{border:0;outline: none;} .cmm-form .form select{width:100%;height:0.8rem;border:0.02rem solid #e5e5e5;padding:0 0.4rem;} .cmm-form .form textarea{padding:0.4rem;width:100%;height:4rem;border:0.02rem solid #e5e5e5;background-color:#fafafa;} .checkbox label{display:inline-block;position:relative;padding-left:0.6rem;font-size:0.3rem;} .checkbox label:before{top:0.04rem;left:0;width:0.36rem;height:0.36rem;border:0.02rem solid #555;} .checkbox label:after{top:0.03rem;left:0.1rem;width:0.08rem;height:0.2rem;border-right:0.08rem solid #fa9f00;border-bottom:0.08rem solid #fa9f00;} #header .header-wrap{padding:0.3rem; position:absolute; top:0; left:0;width:100%; box-sizing:border-box; } #header.scroll .header-wrap{position:fixed; background:rgba(255,255,255,0.7); z-index:1000; box-shadow:4px 4px 8px rgba(0,0,0,0.2);} #header .header-wrap .logo{display: inline-block;width: 1.4rem;background: url(/_public/images/common/logo4.png) 0 50% no-repeat;background-size:100%;line-height: 0.8rem;} #header .header-wrap .gnb-wrap{position:fixed;top:0;padding-left:30%;width:100%;height:100%;right:-100%;box-sizing:border-box;-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;z-index:1000;} #header .header-wrap .gnb-wrap.active{right:0;} #header .header-wrap .gnb-wrap .gnb{background:#fff;padding-top:2rem;position: absolute;width:70%;background:#fff;box-sizing: border-box;height:100%;} #header .header-wrap .gnb ul li{margin:0 0.6rem;} #header .header-wrap .gnb ul li:first-child{margin-left:0.6rem;} #header .header-wrap .gnb ul li > a{color:#222;font-size:0.5rem;display:block; height:1.4rem; line-height:1.4rem; margin-left:0;padding:0; border-bottom:1px solid #f2f2f2} #header .header-wrap .gnb ul li > a.contact-us{margin-left:0; padding-left:0; font-size:0.5rem} #header .header-wrap .gnb ul li > a:first-child{margin-left:0;} #header .header-wrap .gnb ul li > a.email{display:none;} #header .header-wrap .nav-icon{display:block;width:0.6rem; height:0.4rem; margin-top:0.01rem;} #header .header-wrap .nav-icon span{height:0.04rem;} #header .scroll .header-wrap .logo{display: inline-block;width: 1.4rem;background: url(/_public/images/common/logo3.png) 0 50% no-repeat;background-size:100%;line-height: 0.8rem;} #header.scroll .header-wrap .gnb a.contact-us{background-color:transparent} #header.sub .header-wrap .logo, #header.scroll .header-wrap .logo{display: inline-block;width: 1.4rem;background: url(/_public/images/common/logo3.png) 0 50% no-repeat;background-size:100%;line-height: 0.8rem;} #header.sub .header-wrap .gnb ul li > a.email{display:none;} #header.sub .header-wrap .gnb ul li > a.contact-us{position:relative;margin-left:0.6rem; padding-left:0.3rem;font-size: 0.5rem;background-color: transparent;color:#222;} #header .header-wrap .gnb ul li > a.contact-us:before{margin-right:0;padding:0;position:absolute; top:0.45rem; left:3.2rem;width:0.5rem; height:0.48rem; background: url(/_public/images/common/icon_contactus_m.png) no-repeat;} #header .header-wrap .gnb .dropdown{width:100%;} #header .header-wrap .gnb .dropdown a{ margin-top:0.5rem;padding-left: 0.2rem;font-size:0.4rem;} #header .header-wrap .gnb .dropdown a:before{top:0.14rem;width:0.22rem;height:0.32rem;} #header .header-wrap .gnb .dropdown a:first-child{margin-top:0;} /*table*/ .tableWrapper{width: 100%; overflow: auto; margin: 0 auto;} #contents .contents-box .product-wrap .product-detail .spec-area .table-txt{display:block; font-size:0.28rem;} .table-txt2{display:block; font-size:0.28rem;} /*main*/ #main .slide-contents .slick-slide img{height:100vh;} #main .slide-contents .slick-slide .tit{padding:0 0.2rem;font-size:0.7rem;} #main .slide-contents .slick-slide .tit span{font-size:0.3rem;} #main .slide-contents .slick-slide .txt-group{top:1.8rem; width:90%} #main .slide-contents .slick-slide .txt-group strong{font-size:0.7rem;} #main .slide-contents .slick-slide .txt-group strong span{font-size:0.3rem;} #main .slide-contents .slick-slide .txt-group ul li{font-size:0.3rem;} #main .slide-contents .slick-slide .txt-group ul li em{bottom:inherit;top:0;} #main .slide-contents .slick-slide .txt-group ul li:nth-child(2) em{top:0;} #main .slide-contents .icon-scroll{display:none;} #main .slide-contents .slick-dots li button{height:0.2rem; width:0.2rem;} #main .slide-contents .slick-dots li.slick-active button{height:0.2rem; width:0.64rem;} #main .main-about .title, #main .main-exhibitions .title{width:100%;} #main .main-about .title p, #main .main-product .title p, #main .main-exhibitions .title p{font-size:0.6rem;} #main .main-about, #main .main-product{width:90%;} #main .main-about .title, #main .main-product .title, #main .main-exhibitions .title{position:relative;} #main .main-about .title .more, #main .main-product .title .more, #main .main-exhibitions .title .more{position:absolute; padding: 0 0.4rem 0 0.02rem; top:0; right:0; font-size:0.3rem; font-weight:400; margin-top:0.15rem} #main .main-about .title .more:after, #main .main-product .title .more:after, #main .main-exhibitions .title .more:after{height:0.14rem;} #main .main-about{display:block; margin-top: 2.5rem;} #main .main-about .txt-box{padding-left:0; margin-top:1rem;} #main .main-about .txt-box .txt{font-size:0.32rem;} #main .main-product{margin-top: 2.5rem;} #main .main-product .product-list{display:block; padding:0;} #main .main-product .product-list > div{width:100%; margin-bottom:0.3rem;} #main .main-product .product-list > div a{height:3rem;} #main .main-product .product-list > div a span{font-size:0.4rem;padding-left:0.4rem; box-sizing:border-box;} #main .main-product .product-list > div a span i{top:34%; left:2rem; padding-left:0.2rem;} #main .main-product .product-list > div a span em.sp-ico{background-size: 9rem;} #main .main-product .product-list > div a span em.icon1{background-position:1.9rem 4.9rem;} #main .main-product .product-list > div a span em.icon2{background-position:-2.65rem 2.6rem;} #main .main-product .product-list > div a span em.icon3{background-position:-2.65rem 4.9rem;} #main .main-product .product-list > div a span em.icon4{background-position:1.9rem 2.6rem;} #main .main-product .product-list > div:hover a span em.icon1{background-position:4.2rem 4.9rem;} #main .main-product .product-list > div:hover a span em.icon2{background-position:-0.45rem 2.6rem;} #main .main-product .product-list > div:hover a span em.icon3{background-position:-0.45rem 4.9rem;} #main .main-product .product-list > div:hover a span em.icon4{background-position:-4.9rem 2.6rem;} #main .main-exhibitions{padding: 1rem 5%;} #main .main-exhibitions .title .more{right:-2%;} #main .main-exhibitions .title .more2{position:relative; float:right} #main .main-exhibitions .list-box .slick-list{margin-top:1rem;padding-bottom:0.8rem;} #main .main-exhibitions .list-box .slick-item3 .slick-slide{margin:0;} #main .main-exhibitions .list-box .slick-item3 .slick-slide .tit{font-size:0.44rem; margin-bottom:0.4rem;} #main .main-exhibitions .list-box .slick-item3 .slick-slide .date{font-size:0.28rem; padding-left:0.6rem; height:0.6rem;background-position: -6px -52px;} #main .main-exhibitions .list-box .slick-item3 .slick-slide .date em{background-position: -52px -52px;} #main .main-exhibitions .list-box .slick-item3 .slick-slide .booth{font-size:0.28rem; padding-left:0.6rem; height:0.6rem;} #main .main-exhibitions .list-box .slick-item3 .slick-slide .button{margin-top:0.5rem; width:1.5rem;line-height:0.6rem;} #main .main-exhibitions .list-box .slick-item3 .slick-slide em{width:0.6rem; height:0.6rem; background-size:10rem} #main .main-exhibitions .list-box .slick-prev{width:0.6rem; line-height:0.6rem; left:0;} #main .main-exhibitions .list-box .slick-next{width:0.6rem; line-height:0.6rem; left:0.7rem;} #main .main-exhibitions .list-box .slick-prev:before{width: 1rem;height: 1rem;background-size: 12rem;background-position: -6rem 0;left: -0.2rem;top: -0.2rem;} #main .main-exhibitions .list-box .slick-next:before{width: 1rem;height: 1rem;background-size: 12rem;background-position: -7rem 0;left: -0.2rem;top: -0.2rem;} #main .main-exhibitions .list-box .pagingInfo{left:1.5rem;font-size:0.3rem;} #main .main-exhibitions .no-data{width:100%;text-align: center;margin-top:0.8rem;font-size:0.3rem;} /*공통*/ .navi-wrap .navigation .level2 a{font-size:0.24rem;line-height: 0.9rem;} #contents{width:90%; padding: 0.4rem 0 2rem;} #contents .aside{display:block;width:100%;} #contents .aside .tit{display:none;} #contents .aside .snb{width:100%;overflow-x: auto;} #contents .aside .snb .snb-wrap{font-size:0;} #contents .aside .snb a{display:inline-block;font-size:0.24rem;line-height:0.8rem;} #contents .contents-box{display:block;padding-left:0; width:100%;} #contents .contents-box .subtop-img{height:5rem;} #contents .subtop-txtbox{font-size:0.32rem;} #contents .page-tit{font-size:0.52rem; padding-bottom:0.3rem; padding-top:0.8rem; text-align:center; margin-bottom:0.5rem;} #contents .search-wrap{display:block; margin-bottom:0.4rem;} #contents .search-wrap > div{width:100%;} #contents .search-wrap .search-txt{font-size:0.32rem; width:100%; margin-bottom:0.6rem;} #contents .search-wrap .search-box{width:100%; position:relative; height:45px;} #contents .search-wrap .search-box > div:first-child{width:25%;} #contents .search-wrap .search-box > div:nth-child(2){position:relative;width:75%;} #contents .search-wrap .search-box > div select{width:100%; height:45px; background-color:#fff; background:none;} #contents .search-wrap .search-box > div .txt{width:99%; height:45px; margin-left:1%} #contents .search-wrap .search-box > div .btn{position:absolute;right:0;top:0; height:45px; width:45px;background-position: -153px -52px;} #contents .total-list{display:none;} #contents .page{width: 327px;} #contents .page .num{font-size:0.3rem;} .sp-ico{background-size: 11rem;} /*table*/ #spec-table{width:700px;} #spec-table thead tr th{font-size:0.3rem;} #spec-table tbody tr td{font-size:0.3rem;} #spec-table tbody tr th{font-size:0.3rem;} /*visual*/ #visual{} #visual.sub02{height:250px; width:100%;} #visual .txt{font-size:0.68rem;} .navi-wrap .navigation .level1 > a:after{top:10px} /*nav*/ .navi-wrap .navigation{height:45px;} .navi-wrap .navigation .home{height:0.9rem; width:0.9rem;background-position: -3.7rem 0rem;} .navi-wrap .navigation .level1{height:0.9rem;} .navi-wrap .navigation .level2{height:0.9rem;width: calc(100% - 148px);overflow-x: auto;} .navi-wrap .navigation .level1 a{font-size:0.28rem; line-height: 45px;} .navi-wrap .navigation .level2 a.active:before{bottom:0;} /*about us*/ #contents .contents-box .aboutus-wrap .history{height:1900px;} #contents .contents-box .aboutus-wrap .history ul{padding-top:2rem;} #contents .contents-box .aboutus-wrap .history ul li{margin-bottom:0.8rem;} #contents .contents-box .aboutus-wrap .history ul li > strong{font-size:0.6rem;} #contents .contents-box .aboutus-wrap .history ul li span{font-size:0.3rem;} #contents .contents-box .aboutus-wrap .history:before{left:15%;} #contents .contents-box .aboutus-wrap .history ul .h-right, #contents .contents-box .aboutus-wrap .history ul .h-left{width:80%;} #contents .contents-box .aboutus-wrap .history ul .h-right{margin-left:15%;width:80%;padding-left:1rem;} #contents .contents-box .aboutus-wrap .history ul .h-right:after{right:inherit;left:-0.18rem;} #contents .contents-box .aboutus-wrap .history ul .h-left{margin-left:15%;padding-left:1rem;text-align:left;} #contents .contents-box .aboutus-wrap .history ul .h-left:after{right:inherit;left:-0.18rem;} #contents .contents-box .aboutus-wrap .history ul .h-left:before{left:1%} /*brand*/ #contents .contents-box .brand-wrap .brand-detail .subtop-img{height:7.8rem;} #contents .contents-box .brand-wrap .brand-detail .subtop-img p{font-size:0.56rem; padding:0.7rem;line-height: 0.7rem;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div p{font-size:0.4rem;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul{width: 90%; margin-left: 5%;padding:0.7rem; overflow:hidden;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul li{font-size:0.32rem;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul li span div{font-size:0.3rem;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul li{ border-left:none; margin-top:0rem;} #contents .contents-box .brand-wrap .brand-detail .fishing-logo div ul li > div img{margin-left:-1.5rem; width:95%} /*vision*/ #contents .contents-box .vision-wrap .vision-detail .value{margin-top:1.6rem;} #contents .contents-box .vision-wrap .vision-detail .value > strong{font-size:0.5rem; width:90%; margin:0 auto;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item{margin-top:1rem; height:auto; overflow:hidden;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item:before{display:none;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item > div{width:100%} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item:nth-child(1) .item-img, #contents .contents-box .vision-wrap .vision-detail .value .value-item .item:nth-child(2) .item-img, #contents .contents-box .vision-wrap .vision-detail .value .value-item .item:nth-child(3) .item-img{background-size: cover; width:100%; height:5.5rem} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item:nth-child(1){margin-top:0.6rem;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item:nth-child(2){height:10rem;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item:nth-child(2) .item-img{position:absolute; bottom:0; left:0} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item .item-txt{padding:0.9rem; font-size:0.32rem; width:100%; height:auto;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item .item-img{height:390px; } #contents .contents-box .vision-wrap .vision-detail .value .value-item .item .item-txt div{font-size:0.34rem;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item .item-txt strong{font-size:0.5rem; word-break: break-all;} #contents .contents-box .vision-wrap .vision-detail .value .value-item .item .item-img{} /*business*/ #contents .contents-box .business-wrap .business-detail .horizontal{margin-bottom:0.6rem;} #contents .contents-box .business-wrap .business-detail .horizontal li{width:100%;} #contents .contents-box .business-wrap .business-detail .horizontal li a{width:100%;font-size:0.32rem; padding:0 0.4rem;} #contents .contents-box .business-wrap .business-detail .horizontal li a:before{width: 0.1rem; height: 0.1rem;} #contents .contents-box .business-wrap .business-detail .horizontal li:first-child a:before{display:block;} #contents .contents-box .business-wrap .business-detail .subtop-img{height:5.5rem} #contents .contents-box .business-wrap .business-detail .subtop-img p{font-size:0.56rem; padding:0.7rem;} #contents .contents-box .business-wrap .business-detail table{font-size:0.3rem; margin-top:0.4rem;} #contents .contents-box .business-wrap .business-detail table tbody tr td{fint-size:0.28rem;} #contents .contents-box .business-wrap .business-detail table tbody tr th{padding:0 0.2rem;} /*contact us*/ #contents .contactus .contactus-wrap .contactus-detail .contactus-form .txt-area p, #contents .contactus .contactus-wrap .contactus-detail .map-wrap{font-size:0.3rem;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap{height:12rem;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .map-txt{bottom:0.6rem;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .map-txt ul li{margin-top:0.18rem;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .map-txt ul li:nth-child(2){margin-bottom:0.9rem;} #contents .contactus .contactus-wrap .contactus-detail .map-wrap .direction{top:11.6rem; right:0; width:2.4rem; padding-left:0.5rem;} #contents .contactus .form-wrap .bottom{text-align: right;padding:0 0.4rem;} #contents .contactus .form-wrap .bottom .button{margin-left:0.8rem;display:inline-block;width:2rem;line-height: 0.8rem;color:#fff;font-size:0.3rem;} /*news*/ #contents .news-wrap .news-detail .bbs-news tbody tr .date{font-size:0.26rem} #contents .news-wrap .news-detail .bbs-news tbody tr .category span, #contents .news-wrap .news-detail .bbs-news tbody tr .category-2 span{font-size:0.26rem; font-weight:400;margin-left:1%; width:1.1rem; } #contents .news-wrap .news-detail .bbs-news tbody tr .subject{padding-left:1%; padding-right:1%;} #contents .news-wrap .news-detail .bbs-news tbody tr .subject span{font-size:0.3rem;} #contents .news-wrap .news-detail .bbs-news tbody tr .subject span:first-child{overflow:hidden;white-space:nowrap;text-overflow:ellipsis; font-size:0.32rem;} #contents .news-wrap .news-detail .bbs-news tbody tr .subject .admin{font-size:0.28rem; margin-top:0.1rem;} /*exhibition*/ #contents .exhibition-wrap .exhibition-detail .tab-wrap .horizontal{width:90%} #contents .exhibition-wrap .exhibition-detail .tab-wrap .horizontal li a{width:50%; box-sizing:border-box; font-size:0.28rem} #contents .exhibition-wrap .exhibition-detail .tab-wrap .horizontal li:hover a{} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content{padding-top:0.2rem; width: 110%; margin-left: -5%;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul {display:block;width:100%;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li{font-size:0.28rem} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a{padding:1.2rem 0.6rem; border-bottom:0.02rem solid #f0f0f0} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a h3{font-size:0.4rem;margin-bottom:0.6rem;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a div{font-size:0.3rem; font-weight:400; padding-left:0.8rem;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a .exh-date em{background-position: -60px -63px;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a .exh-adress{height:1.8rem} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a .exh-adress em{background-position: -10px -60px;} #contents .exhibition-wrap .exhibition-detail .tab-wrap .tab-content ul li a .exh-booth em{background-position: -110px -60px;} #contents .exhibition-wrap .exhibition-detail .search-wrap .search-box{width:100%;} #contents .exhibition-wrap .exhibition-detail .search-box > div:first-child{width:100%;} #contents .exhibition-wrap .exhibition-detail .search-wrap .search-box > div .txt{margin-left:0;} /*product*/ #contents .contents-box .product-wrap{margin-top:0; margin-top:1rem; padding-bottom:0.6rem;} #contents .contents-box .product-category{display:none;} #contents .contents-box .product-wrap .product-detail strong{font-size:0.4rem;} #contents .contents-box .product-wrap .product-detail .txt-area{font-size:0.32rem; margin-top:0.6rem;} #contents .contents-box .product-wrap .product-detail .spec-area .table-txt{margin-top:0.1rem;} /*footer*/ #footer{padding:1.2rem 7%;} #footer .footer-wrap .info .footer-logo{display:none;} #footer .footer-wrap .info .addr{margin-top:0;} #footer .footer-wrap .info .addr p{font-size:0.3rem; text-align:left; color:#e2e2e2} #footer .footer-wrap .info .addr .footer-logo-txt{display:block; font-size:0.5rem; font-weight:600; margin-bottom:0.4rem;} #footer .footer-wrap .info .addr .footer-logo-txt a{color:#fff; font-size:0.34rem;} #footer .footer-wrap .info .addr .copyright{margin-top:0.4rem;} .top_btn{width:1.4rem; height:1.4rem; bottom:1rem;padding-top:0.24rem; right:2%} }