/*# sourceURL=asset/css/re-main.css?log=20220621559 */
/*@ sourceURL=asset/css/re-main.css?log=20220621559 */

#main-visual .visual-item > .visual-text .logo-txt h3 {display: flex;align-content: center;align-items: center;font-size: 57px; font-weight: 500;justify-content: center; gap:10px;}
#main-visual .visual-item > .visual-text .logo-txt img {margin: 0 !important;}


.menu-list__arrow.is--active {
  transform: rotate(180deg);
  transition: transform 0.3s ease;
}

.slick-slide img {margin: 0 auto !important;}
/* CONTAINER 1290 + 2rem(32px) */
.text-box2 > h6 {font-size: 20px;margin-top: 2rem;font-weight: 500;}
.text-box2  p a {color: #0a61b2; font-size: 26px;}

.youtube-bt {width: 50%;}
.youtube-bt ul li {display: inline-block; width: 48%;}
.youtube-bt ul li p {    margin: 1rem;text-align: center;font-weight: 500;font-size: 18px;}
.snbSwiper {display: none;}
.pc_only {display: block;	}
.m_only {display: none;}

.pink_img li {display: inline-block; width: 15%; text-align: center; font-size: 15px;}
.top_fixe ul {list-style:none;}
.top_fixe {position: initial;top: 12%;z-index: 999;width: 100%;margin-top: 29px;}
.top_fixe ul li {display: inline-block;/* width: 50%; */}

.top_fixed {  margin: 0;  background: #0765ed;   top:0; left:0; z-index:999; text-align:center; width:100%;  font-size:18px;  padding:10px 0; color:#fff; box-shadow:0px 2px 7px 0px rgba(0,0,0,0.2); font-weight: 400;}
.main-ck {position: absolute;top: 22%;right: 18%;}

@keyframes flow-ani {to {transform: translate3d(0, -800px, 0);}}
.flow {display: flex;justify-content: flex-start;margin: 0rem 0;animation: flow-ani 10s linear forwards infinite;animation-iteration-count:infinite;}
.hhproArea .box:last-child:before {width: 0;}
.clear {clear:both;}
.main-sub-box {    height: 221px;overflow-x: hidden;width: 100%;overflow-y: scroll;}
.main-sub-box ul {     vertical-align: top;}
.main-sub-box ul li {padding: 1rem 0; border-bottom: 1px solid #ddd; width: 24%; display: inline-block;}
#footer{background:#333;padding:40px 10px;letter-spacing:-1px;text-align:center}
.foot_cust{position:absolute;width:auto;right:0;top:0}
.familysite{position:relative;float:right;width:155px;height:35px;border:1px solid #525252;line-height:35px}
.familysite_wrap::after{content:'';display:block;clear:both}
.familysite i{position:absolute;right:10px;top:8px}
.familysite .btn_fs_off{font-size:15px;display:none;width:145px;padding-left:10px;color:#888;}
.familysite .btn_fs_off.active{display:block;text-align:left}
.familysite .btn_fs_on{display:none;width:145px;padding-left:10px;color:#afafaf;}
.familysite .btn_fs_on.active{display:block;font-size:15px;text-align:left}
.family_site_list{font-size:1.3rem;display:none;position:absolute;bottom:35px;width:155px;right:1px;background:#fff;border:1px solid #cecece;border-bottom:0;overflow-y:scroll;overflow-x:hidden;z-index:91;}
.family_site_list li{padding:7px 10px;margin:0;line-height:16px;text-align:left;color:#868686;border-bottom:1px solid #ddd}
.family_site_list li.last{border-bottom:0;}
.family_site_list li.fm_div_head{background:#555;font-size:15px;color:#fff}
.family_site_list li.fm_div{font-size:15px;background:#f5f5f5}
.family_site_list li a{display:block;background:#fff;font-size:14px;color:#868686}
.family_site_list li a:hover{color:#151515;text-decoration:underline}
.family_site_list li a:active{color:#151515;text-decoration:underline}
.family_site_list li a:focus{color:#151515;text-decoration:underline}
.cust_num{margin-top:20px}
.cust_num li{display:inline-block;padding:0 15px;font-size:25px;color:#fff;text-align:left;font-family:'Roboto';font-weight:400}
.cust_num li:first-child{border-right:1px solid #444}
.cust_num li span{display:block;font-size:15px;line-height:1.7}
.cust_num li span.dn640{display:inline}
.foot_info_wrap{width:calc(100% - 320px)}
.foot_menu{text-align:left}
.foot_menu a{position:relative;display:inline-block;padding:5px 15px;font-size:15px;color:#fff}
.foot_menu a:first-child{padding:5px 15px 0 0}
.foot_menu a:first-child:before{content:''}
.foot_menu a:before{content:'';position:absolute;left:0;top:5px;width:1px;height:15px;background:#444}
.foot_menu a:hover{text-decoration: underline}
.foot_info_tit{/* display:none; */margin-top:20px;font-size: 25px;color:#fff;text-align: left;}
.m_on {display: none;}
.foot_info{margin-top:15px;font-size:15px;color:#888;line-height:1.5;text-align:left}
.copyright{display:block;margin-top:15px;font-weight: 300;}
.foot_sns_wrap{position:relative;border-top:1px solid #444;margin-top:20px !important;padding-top:20px;text-align:left}
.foot_sns_wrap .footBi{width:170px}
.foot_sns{position:absolute;top:20px;right:0 }
.foot_sns a:first-child{margin-right:10px}
.foot_sns img{width:45px;height:45px}
.inner.PR {min-height: 165px;}
#goTop{position:fixed;bottom:15px;right:15px;cursor:pointer;z-index:999999;}
#goTop img{width:50px;height:50px;display:block;margin-bottom:5px}
#footer{background:#333;padding:40px 10px;letter-spacing:-1px;text-align:center}
/* Title */
.title-st1 {font-size: 45px; font-weight: 600; line-height:1;}
.title-st2 {font-size:50px; font-weight:700; line-height:1;}
.title-st3 {font-size:48px; font-weight:700; line-height:1;}
.title-st4 {font-size: 21px; font-weight: 500; line-height:1;}
.title-st5 {font-size:38px; font-weight:700; line-height:1;}
.title-st6 {font-size:36px; font-weight:700; line-height:1;}
.title__sub-title {font-size:18px; color:#6f6f6f;}
.dots-title {display:inline-block; position:relative; padding-right:20px;}
.dots-title::after {content:""; display:inline-block; position:absolute; bottom:2px; right:0; width:10px; height:10px; border-radius:50%; background-color:#0765ed;}
.PR {position: relative;}

.cust_desc p {color: #ddd;}
/* Button */
.btn-st1 {display:inline-flex; justify-content:center; align-items:center; width:180px; height:50px; font-family:"Inter"; font-size:14px; font-weight:600; color:#fff; border-radius:25px; background-color:#0765ed; transition:background-color .3s;}
.btn-st2 {display:inline-flex; align-items:center; font-family:"Inter"; font-size:14px; font-weight:600;}
.btn-st2__icon {display:inline-block; position:relative; top:-1px; margin-left:15px; font-size:16px; transition:transform .3s;    font-style: initial;}
.btn-st3 {display:inline-flex; align-items:center; font-family:"Inter"; font-size:14px; font-weight:600; color:#fff; }
.btn-st3__icon {display:inline-flex; justify-content:center; align-items:center; width:45px; height:45px; margin-left:20px; border-radius:50%; background-color:rgba(255,255,255,.2); transition:background-color .3s;}
.btn-st4{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:240px;min-width:150px;height:65px;padding:0 50px;margin:100px auto 0;border:none;background:#bebebe;color:#fff;font-size:16px;border-radius:50px;transition:background-color .5s;}
.btn-st4 .ic{line-height:1.5;}
.slider-ctrl {display:inline-flex; align-items:center; position:relative; margin:40px -15px 0;}
.slider-ctrl::after {content:""; position:absolute; top:50%; left:50%; width:1px; height:13px; background-color:#363f66; transform:translate(-50%, -50%);}
.slider-ctrl__arrow {position:relative; width:17px; height:17px; overflow:hidden; margin:0 15px; text-indent:100%; border:0; background-color:transparent;}
.slider-ctrl__icon {position:absolute; top:0; left:0; font-size:17px; color:#fff; text-indent:0;}


.inner-sec02 {    max-width: 1500px;padding: 0 20px;margin: 0 auto;}

/* flex */
.flex-wrap {display:flex; justify-content:space-between;}
.flex-wrap .left-box {width:310px; min-width:240px; transition:width .3s;}
.flex-wrap__title {font-size:26px;}
.flex-wrap .right-box {width:100%; max-width:990px; transition:width .3s;}
.flex-wrap__text-1 {font-size:20px; font-weight:600; letter-spacing:-0.01rem;}
.flex-wrap__text-1:not(:first-child) {margin-top:50px;}
.flex-wrap__text-2 {font-size:16px; color:#666; letter-spacing:-0.01rem;}
.flex-wrap__text-2:not(:first-child) {margin-top:10px;}
.flex-wrap__text--color {margin-top:30px; font-size:16px; font-weight:600; color:#583cf2;}
.flex-wrap__text--color-2 {color:#333;}
.img-wrap {font-size:0; line-height:1;}
.img-wrap .img {width:100%; height:auto;}

/*1*/
.hide{display:none}
.main-business {position:relative; padding:0px 0 60px; transition:padding .3s;background: #ededed;width: 1920px;padding: 3rem 0;margin: 0 auto;}
.main-business::after {/* content:""; *//* position:absolute; *//* bottom:0; *//* left:50%; *//* width:100%; *//* height:724px; *//* background:url("https://hhclean3.gabia.io/uploads/media/main_business_bg2.jpg") no-repeat #ededed  top center; *//* transform:translateX(-50%); */background: #ededed;}
.main-business__logo-img {width:100%; max-width:131px; height:auto; display: none;}
.main-business .flex-wrap {position:relative; z-index:50; }
.main-business__flex-wrap-1 {display: block; text-align: center;}
.main-business__flex-wrap-2 {margin-top:40px;}
.main-business__title-wrap {padding-top:0px;}
.main-business .title-st1 {margin-top:10px;}
.main-business__text {margin-top:20px; font-size:18px; color:#444;}
.main-business .btn-st1 {margin-top:45px;}
.main-business__flex-wrap-2 .main-business__img-wrap:not(:first-child) {padding-top:0px;}
.main-business__link {display:block;}
.main-business__text-box {height: 271px; position:relative;/* left:-1px; */width: 100%;margin: 0 auto;max-width: 84%;padding:40px 30px;/* margin-top:-155px; */ background-color:#fff; z-index:50;}
.main-business__flex-wrap-2 .main-business__text-box {background-color:#f9f9f9;}
.main-business__color-text {font-size:15px; color:#0765ed;}
.main-business .title-st4 {margin-top:7px; }
.main-business__box-text {margin-top:25px; font-size:16px; color:#5d5d5d;}
.main-business .btn-st2 {margin-top:30px;}

/*2*/
.title-st2 {font-size: 38px;font-weight: 500;line-height: 1;color: #fff;}
.main-technology {overflow:hidden; padding-bottom: 30px; transition:padding .3s;margin: 0 auto;width: 1920px;}
.main-technology__visual {height:500px; padding-top:100px; background:url("https://www.hhclean.co.kr/asset/css/../../images/main_technology_bg.jpg") no-repeat #171d3d bottom 140px right; transition:height .3s, padding .3s;}
.main-technology__text {font-size:18px; color:#babbbe;}
.main-technology .title-st2 {margin-top:10px;margin-bottom: 1rem;}
.main-technology__left-box {float:left; width:13%;}
.main-technology__container {margin: -285px 0 0 0px;}
.main-technology__container .inner {position:relative; height:auto; padding:60px 0px 0 0px; background-color:#fff;}
.main-technology__container .inner::after {content:""; position:absolute; top:0; right:-100%; width:100%; height:100%; background-color:#fff; z-index:1;}
/* .main-technology__slider {position:absolute!important; top:60px; left:60px; width:150%; z-index:100;} */
.main-technology__slider {/* display: flex; *//* flex-wrap: wrap; *//* justify-content: center; */}
.main-technology__slider .slick-list {margin:0 -15px; }
.main-technology__item {padding:0 15px;display: inline-block;WIDTH: 23%;}
.main-technology__link {display:block;}
.main-technology__item-inner {display: inline-block; width: 100%;}
.main-technology .img-wrap {overflow:hidden; margin: 0; auto}
.main-technology .img-wrap .img {transition:transform .3s;}
.main-technology__text-box {position:relative; padding:0px 0 0 0px;}
.main-technology__counter {position:absolute; top:30px; left:0; font-size:15px; font-weight:700; color:#0765ed; letter-spacing:-0.05rem;}
.main-technology__box-title {font-size:16px; font-weight:500; margin-bottom: 1rem; text-align: center;}
.main-technology__box-text {margin-top:15px; font-size:16px; color:#5d5d5d;}
.inner {/* width: 100%; */max-width: 1600px;padding: 0 20px;margin: 0 auto; }
.container {max-width:1300px; margin:0 auto; padding:0 1em;}
.large-container {max-width:1600px; margin:0 auto; padding:0 1em;}
.h-container {max-width:1280px; margin:0 auto; padding:0 1em;} 
.min-container {max-width:1200px; margin:0 auto; padding:0 1em;}
button {background: 0;border: 0;outline: 0;font-size: inherit;font-weight: inherit;font-family: inherit;}
.section02{padding: 20px 0 50px 0;overflow:hidden;position: relative; box-sizing: border-box;}
.section02 .bg_item{position:absolute;top: 75%;right:0;width:905px;height:905px;background:url("https://www.hhclean.co.kr/asset/css/../../images/main_bg_item1.png")no-repeat center;z-index: -1;}
.section02 .list_wrap{margin-bottom: 190px;     box-sizing: border-box;}
.section02 .list_wrap .list{position: relative;width: calc(50% - 50px);display: inline-block;vertical-align: bottom;overflow: hidden;}
.section02 .list_wrap .list:nth-child(even){/* margin-left: 100px; */}
.section02 .list_wrap .list.first{padding: 90px 0 120px;vertical-align: top;}
.section02 .list_wrap .list.first .tit{font-size: 32px;margin: 70px 0 30px 0;color: #000;text-transform: uppercase;letter-spacing: -1px;font-weight: 600;line-height: 1.2;}
.section02 .list_wrap .list.first .txt1{width:90%;}
.section02 .list_wrap .list.list3{margin-top:-80px;}
.section02 .list_wrap .list a{position: relative;display:block;}
.section02 .list_wrap .list .img{position: relative;width: 100%;}
.section02 .list_wrap .list .img img{max-width:100%;}
.section02 .list_wrap .list .text{position: absolute;bottom: 0;left: 0;color:#fff;width: 100%;padding: 40px 0px 40px 0px;}
.section02 .list_wrap .list .text .tit{font-size:30px;margin-bottom: 10px;}
.section02 .list_wrap .list .text .txt1{font-weight:300; color:rgba(255,255,255,0.8);}
.section02 .list_wrap .list .text button{position: absolute;right: 0;bottom: 6px;width:65px;height:65px;background: #0e2e7b url("https://www.hhclean.co.kr/asset/css/../../images/main_more_type1.png")no-repeat center;transition:0.2s;}
.section02 .list_wrap .list:hover .text button{background: #238fcd url("https://www.hhclean.co.kr/asset/css/../../images/main_more_type1.png")no-repeat center; transition:0.2s;}
.blind, legend, caption{position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px);}
[class*="con-"][class*="-width1"]{position:relative; max-width: 1400px; width:93%; margin:0 auto;     box-sizing: border-box;}
.section_title. { opacity: 1; transform: translateX(0px); transition: 0.8s;}
.section_title { font-size: 38px; color: #000; font-weight: 600; letter-spacing: -0.5px;}
.section_title:before {display: inline-block;content: "";vertical-align: top;margin-top: 22px;margin-right: 30px;width: 100px;height: 2px;background: #0e2e7b;}
.section_title .txt1 {font-size: 17px;color: #555555;line-height: 1.8;font-weight: 300;letter-spacing: -0.25px;}
.clearfix:before, .clearfix:after { content: " "; display: table;}
.clearfix:after { clear: both;}

.main_certificate  {width: 1920px; margin: 0 auto;}
/*3*/
.main_certificate {}
.main_certificate figure {margin: 0;}
.ly_maxWidth {max-width: 1600px;margin: 0 auto;}
#main__certificate {background-position:right top;}
#main__certificate .u__title {margin-bottom:15px;text-align:center;}
#main__certificate .u__desc {text-align:center;}
#main__certificate {padding:60px 0 70px;}
#main__certificate .inner--left {width:39.8%;}
#main__certificate .inner--right {padding-right:100px;position:relative;}
#main__certificate .main__btn {position:absolute;right:0;bottom:100px;z-index:2}
#main__certificate .main__btn i {background-color:#038a9d;border-color:#038a9d;background-image:url("https://www.hhclean.co.kr/asset/css/../../images/i_main_btn_fff.png");}
#main__certificate .certificate_list_con {margin:75px 0 40px;}
#main__certificate .certificate_list {overflow:hidden;margin:-1%;}
#main__certificate .certificate_list li {float:left;width:23%;margin:1%;margin-bottom:17px;}
#main__certificate .certificate_thumb {display:block; text-align: center;} 
#main__certificate .certificate_title {display:block;margin-top:8px;font-weight:400;font-size:16px;color:#666;text-align:center;} 
#main__certificate .certificate_bg {width:657px;height:857px;background-repeat:no-repeat;background-position:center;background-size:cover;}
.u__title {margin-bottom: 10px;font-weight: 400;font-size: 31px;color: #333;text-transform: uppercase;letter-spacing: 0;line-height: 1.3;}
#main__certificate .u__title {margin-bottom: 15px;text-align: center;}
.u__desc {font-weight: 300;font-size: 18px;color: #111;line-height: 1.45;letter-spacing: -0.7px;}
#main__certificate .u__desc { text-align: center;}

#header, .header, .header .logo img { -webkit-transition: 300ms all; transition: 300ms all; }
#header { position: initial;/* position: fixed; */ top: 0; left: 0; right: 0; width: 100%; z-index: 999; }
#header.scroll { margin-top: -85px; }
.logo .main {  display: none; }

.logo {margin: 0;}
.fp-section .header { margin-top: -90px; }

.fp-section #section01 .header { margin-top: 0; }

.header { margin: 0 auto; /* max-width: 1600px; */ }

.header .headwrap {/* margin: 0 80px; margin-top: 49px;*/position: relative;text-align: center;background: #fafafa;padding: 10px 0px 5px 0px;border-bottom: 1px solid #ddd;}

.header .headwrap .logo a {display: inline-block;height: 76px;line-height: 54px;}

.header .headwrap .logo a img { vertical-align: middle; }

.header .headwrap .top_language, .header .headwrap .top_util, .header .headwrap .top_cafe { position: absolute; bottom: 0; }

/*.header .headwrap .top_language li, .header .headwrap .top_util li, .header .headwrap .top_cafe li { float: left; }*/

.header .headwrap .top_language a, .header .headwrap .top_util a {  font-size: 18px; font-weight: 500; }

.header .headwrap .top_language {left: 368px;top: 16%;}
.header .headwrap .top_language li { margin: 0 10px; }

.header .headwrap .top_language li a p {font-weight: 600;font-size: 30px;color: #00a0e9;}
 
.header .headwrap .top_language a { padding: 3px 0; /* filter: alpha(opacity=40); */}

.header .headwrap .top_language a.on { filter: alpha(opacity=100); opacity: 1; border-bottom: 1px solid #fff; }

.header .headwrap .top_language ul li a img {    position: absolute; right: 0;  left: -57px;}

.header .headwrap .top_language ul li a span {background: #00a0e9; color: #fff;  padding: 0 1rem; border-radius: 50px; font-size: 15px;}

.header .headwrap .top_util { right: 240px; top: 7px;}

.header .headwrap .top_util li {position: relative;padding: 4px 0px;/* width: 113px; */margin: 0 .5em;}

.header .headwrap .top_util li a {display: flex;gap: 10px;justify-content: flex-end;align-items: center;}

.header .headwrap .top_util li a p {font-size: 14px; font-weight: 400; letter-spacing: -.5px; /* font-family:'NanumSquareNeo-Variable';*/  color: #6d6d6d;}
.header .headwrap .top_util li a p:hover {    text-decoration: underline; color: #0765ed;}


.header .headwrap .top_util li img {  width: 24px;}

.header .headwrap .top_util li:first-child:before { content: none; }

/*.header .headwrap .top_util li:before { content: ''; position: absolute; left: 0; top: 50%; width: 1px; height: 10px; background: #ccc; margin-top: -5px; }*/

.header .headwrap .top_util li:nth-child(6):before {display: none;}


.header .headwrap .top_cafe {left: 522px;top: 30%;}
.header .headwrap .top_cafe li { position: relative; padding: 0 15px; }

.header .gnb { text-align: center; background: #fff;}

.header .gnb .depth, .header .gnb .depth .depth01 > a { height: 50px; color: #000;}

.header .gnb .depth { display: inline-block; }

.header .gnb .depth01 { position: relative; float: left; display: table; table-layout: fixed; padding: 0 20px; color: #000;}

.header .gnb .depth01 > a { display: table-cell; vertical-align: middle; text-align: center; font-size: 18px; padding: 0 10px; width: 100%; color: #fff; letter-spacing: -0.4px; }

.header .gnb .depth01 > a.on { color: #00afb9; }

.header .m_nav_btn_box, .header .mo_gnb { display: none; }


.sub_top li a {gap:3px !important;         align-items: center;}
.header .headwrap .sub_top li {/* width: 80px !important; */}
.header .headwrap .sub_top li a p {color: #919191;}
.header .headwrap .top_util  .sub_top li img {width: 18px !important;}

/* */
.type1 {background-color: #ed5565}

.type2 {background-color: #f27935}

.type3 {background-color: #1ba39c}

.type4 {background-color: #4a89dc}

.type5 {background-color: #3b3c40}

.type6 {background-color: #f00}

.type7 {background-color: #1db200}

.type8 {background-color: #b79605}

.type9 {background-color: #aaa}


/* MAIN VISUAL */
#main-visual .slick-prev, .slick-next {width: 40px !important; height: 40px !important;}
#main-visual {margin-top: 8REM;     margin-bottom: 0;}
#main-visual .visual-item {position:relative;/* margin-top: 4rem; */overflow: hidden; text-shadow: 1px 1px 5px #000;background-size: cover; }
#main-visual .visual-item > .visual-text {padding:0 1rem; position:absolute;top: 16%;left: 50%;transform: translateX(-50%);color:#fff;}
#main-visual .visual-item > .visual-text > .description > b {font-weight:500;font-size: 22px; }
#main-visual .visual-item.on-active > img {transition-delay:.3s; transform:scale(1);}
#main-visual .visual-item > .visual-text img {margin: 0 auto;}
.main-logo-02 {width: 50%; margin-top: 1rem;}
/* MAIN VISUAL CONTROLLER */
#main-visual .slick-prev.main-prev,
#main-visual .slick-next.main-next {z-index:550;}
#main-visual .slick-prev.main-prev:before,
#main-visual .slick-next.main-next:before {display:none;}
#main-visual .slick-prev.main-prev {left:5rem !important;}
#main-visual .slick-next.main-next {right:5rem !important;}
#main-visual .slick-dots {bottom:2rem; position: absolute;  display: block; width: 100%; padding: 0;  margin: 0; list-style: none; text-align: center;}
#main-visual .slick-dots li { font-size: 0; padding: 0; position: relative; display: inline-block; margin: 0 5px; width:12px; height:12px; transition: .5s ease;}
#main-visual .slick-dots li button {width:12px;height:12px;background-color: #fff;border-radius: 0px;transition: .5s ease; border:0; outline: 0;		}
#main-visual .slick-dots li button:before {display:none;}
#main-visual .slick-dots li.slick-active {width:30px;}
#main-visual .slick-dots li.slick-active button {width:30px; background-color:#0765ED;}
#main-visual .visual-item > .visual-text > .header {text-align: center; font-size: 51px;font-weight: 300;color: #fff;letter-spacing: 0.3pt;line-height: 100%;line-height: 58PX;}
#main-visual .visual-item > .visual-text > .header span {display: block;font-size: 39px;font-weight: 500;}
#main-visual .visual-item > .visual-text > p {font-size: 19px; margin-top: 1rem; margin-bottom: 1rem;}
#main-visual .visual-item > .visual-text > .description {margin:0; font-weight:300;}
#main-visual .visual-item > .visual-text > .description.big {line-height: 38px; font-size: 18px; font-weight: 300; letter-spacing: -0.5pt; color: rgba(255,255,255,.8); padding-bottom: 40px;}
#main-visual .visual-item > .visual-text > .description.small {font-size:17px; margin-top:0.4rem;}
.main-visual-box .main-img {position: absolute;top: 11%;/* left: 0; */right: 16%;margin: auto;z-index: 1200;width: 29%;}

/*section01*/
.content { margin: 0 auto; position: relative;}
.copy { position: absolute; margin-left: -590px; top: 77px; left: 50%; opacity: 0; margin-top: 0px; transition: opacity 2s ease;}

.copy.sc-event { opacity: 1;}
.copy.sc-event p { color: #00a0e9;}
.copy h3 { font-size: 44px; line-height: 52px; font-weight: 400; letter-spacing: -0.03em; padding-top: 30px; }
.copy h3 span { color: #0a61b2;}
.items { width: 516px; font-size: 0px; position: relative; left: 50%; cursor: pointer; opacity: 0; margin-top: 0px; transition: opacity 2s ease;}
.items.sc-event { opacity: 1; }
.items span { overflow: hidden; position: relative; display: inline-block; width: auto; height: 100%; box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0); transition: box-shadow .5s ease; }
.items:hover span { box-shadow: 0px 14px 20px 0px rgba(0, 0, 0, 0.5); }
.items span img { transition: transform .5s ease; }
.items:hover span img { transform: scale(1.1); transition: transform .5s ease; }
.item1 { top: 240px; margin-left: 10px; }
.item2 { top: 0px; margin-left: -580px; }
.item3 { top: -110px; margin-left: 110px; }
.textbox { box-sizing: border-box; position: absolute; z-index: 3; left: -50px; bottom: -50px; background: #fff; padding: 23px 34px 42px 44px;}
.item1 .textbox { width: 301px; height: 175px; }
.item2 .textbox { width: 275px; height: 175px; }
.item3 .textbox { width: 301px; height: 175px; }
.textbox p { text-transform: uppercase; color: #00a0e9; font-weight: 500; font-size: 12px;padding-top: 8px;}
.textbox h3 {color:#222; padding-top: 12px; letter-spacing: -0.03em; font-size: 22px;line-height: 32px; font-weight: 500; }
.textbox h3>div { padding-top: 7px; font-size: 22px; line-height: 30px; }
.clear {clear:both;}
i.br { display: block;}

.vid-you {padding: 3rem;}
.you-br {width: 359px;height: 247px;/* position: absolute;top: 104px;left: 218px; */}
.you-br2 {  width: 349px;position: absolute;height: 247px;top: 104px;left: 594px;}
.you-br3 {width: 349px;position: absolute;height: 247px;top: 450px;left: 205px;}
.you-br4 {width: 349px;position: absolute;height: 247px;top: 448px;left: 593px;}
/*section02*/
.sec02 {background-color: #FBFBFB; padding: 2rem 0; position: relative; width: 1920px; margin: 0 auto;}
.dc_pc {z-index: -1;background: url("https://www.hhclean.co.kr/asset/css/../../images/mac_pc.png");height: 349px;width: 399px;background-size: 100%;background-repeat: no-repeat;}
.demo {position: relative;}
.media {position: absolute; top: 144px;left: 123px;width: 594px !important;height: 392px !important;}
.sec02 .text-box { top: 179px; position: absolute;  right: 14%;}
.sec02 .text-box span {font-size: 20px; color: #0a61b2;}
.sec02 .text-box p span { color: #ff4f4f; font-weight: 600;}
 .sec02 .text-box em {font-size: 22px; color: #0a61b2; font-style: initial;}
.sec02 .text-box h2 {    font-size: 44px; font-weight: 500; margin: 10px 0 24px 0px; line-height: 1.2;}
.sec02 .text-box h2 b {color: #0a61b2; font-weight: 500;}

.sec02 .text-box p {font-size: 20px; font-weight: 400; line-height: 1.5;}

/*section03*/
.sect-business-area{position: relative;/* padding-bottom: 0 !important; */background: #F2F2F2;padding: 2rem 0;}
.sect-business-area:before{content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 80px;/* background: #111 */}
.sect-em{display: block;margin-bottom: .833rem;letter-spacing: -.02em;text-transform: uppercase;font-weight: 400;font-size: 20px; color: #0a61b2;}
.sect-header{position: relative;margin-bottom: 2.778rem}
.sect-header h2 {font-size: 38px; font-weight: 500; margin: 0px 0 24px 0px; line-height: 1.5;}

.col-xl-6 {  -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.sect-header .txt {  max-width: 570px;font-size: 17px;line-height: 1.8;}
.row { display: -ms-flexbox; display: flex; -ms-flex: 1 0 100%; flex: 1 0 100%; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px;}

.secTit {display: inline-block; width: 800px; vertical-align: top;}
.secTit li {display: inline-block; width: 366px; margin: 0px 32px 0 0; vertical-align: top;}
.secTit li :nth-of-type(1), .secTit li :nth-of-type(2) { margin-top: 0;}
.secTit li .thumb { position: relative; margin-bottom: 13px;}

.secTit-ico {display: inline-block; width: 100%;}
.secTit-ico li {display: inline-block; width: 237px; margin: 26px 32px 0 0;text-align: center;}
.secTit-ico li .thumb { position: relative;}

/*section04*/
.sec04 {padding: 14rem 0; position: relative; overflow: hidden;width: 1920px; margin: 0 auto;}
.sec04 .text-box span {font-size: 20px; color: #0a61b2;}
.sec04 .text-box h2 {    font-size: 44px; font-weight: 500; margin: 10px 0 24px 0px; line-height: 1.2;}
.sec04 .text-box h2 b {color: #0a61b2; font-weight: 500;}
.sec04 .text-box p {font-size: 20px; font-weight: 400; line-height: 1.5;}
.scroll-com {position: absolute; overflow: hidden; right: 219px; top: 0px; display: grid;}
.scroller {-webkit-animation: scroll 30s linear infinite; animation: scroll 30s linear infinite;}
.object-contain {-o-object-fit: contain; object-fit: contain;}

.main-section13 { background: url("https://www.hhclean.co.kr/asset/css/../../images/220124_sec.jpg") center no-repeat; background-size: cover; padding: 28rem 0px;}

.desc-row_main {margin-top: 30px; margin-bottom:50px; }
.desc-row_main>div { display: flex;}
.desc-row_main>div>div { width: 50%; padding: 1rem;}
.desc-row_main>div>div p {font-size: 20px; text-align: center; margin-bottom: 2rem;}

.mainTap { width: 100%;  margin: auto;}
.mainTap dd {font-weight: 500;font-size: 14px;padding: 14px 2px;color: #362f2d;display: inline-block;margin: 0 8px;position: relative;border: 1px solid #0a61b2;padding: .5rem;background-color: #fff;margin-bottom: 1rem;width: 15%;text-align: center;;}
.mainTap dd.on {background: #0a61b2;color: #fff;}
.main-sub01-1 .text-box span {font-size: 20px; color: #0a61b2;}
.main-sub01-1 .text-box h2 { font-size: 44px; font-weight: 500; margin: 10px 0 24px 0px; line-height: 1.2;}
.main-sub01-1 .text-box h4 {font-size: 20px; font-weight: 400; line-height: 1.5;margin-bottom: 1rem;}

.dn_640 {display: none;}
/**/
.sub-inputbox {width: 99%; height: 134px; }

#header .menu-hd {display: none;} 



@media screen and (max-width:1899px){
.main_certificate  {width: 100%;}
.main-business {width: 100%;}
.sec02 {width: 100%;}
.section.mvlow02 {width: 100%;}
.sec04 {width: 100%;}
.main-technology {width: 100%;}
.hhpro_cont {width: 100%;}
}




@media screen and (max-width:1875px){
.header .headwrap .top_language {left: 14%;}
.header .headwrap .top_util {right: 10%;}
.hhproArea .box {width: 374px;}
.hhproArea .box:last-child:before {width: 0;}
}



@media screen and (max-width:1875px){
.main-technology__item {width: 23%;}
.hhproArea .box {width: 21%;}
}
@media screen and (max-width:1875px){
.main-technology__container {margin: -284px 0 0 96px;}
.hhproArea .box {    width: 25%;}
.main-sub-box ul li {font-size: 14px;} 
}
@media screen and (max-width:1686px){
.header .headwrap .top_language { left: 169px;}
.header .headwrap .top_util {right: 100px;}
.main-ck {right: 7%;}
.header .headwrap .top_cafe {left: 324px;}

/**/
.sec02 .text-box {right: 8%;}


}

@media screen and (max-width:1651px){
.main-business__text-box {max-width: 84%;	}
.youtube-bt ul li p {margin-bottom: 2rem;}
.main-technology__item {width: 22%;}
.header .gnb .depth01 {padding: 0 20px; }
.header .gnb .depth, .header .gnb .depth .depth01 > a {font-size: 17px;}
.sec04 .text-box{margin-left: 8%;}
.you-br {width: 100%;   height: 218px;}
.youtube-bt ul li {width: 49%;}
}



@media screen and (max-width:1525px){
.header .gnb .depth01 {padding: 0 14px;}

}

@media screen and (max-width:1495px){
.youtube-bt ul li p {font-size: 15px;}
.sec02 .text-box {right: 3%;}
.header .headwrap .top_util {right: 44px;}
 
}

@media screen and (max-width:1440px){
.main-technology__item {width: 22%;}

.header .gnb .depth01 { padding: 0 12px}
.sec02 .text-box {right: 40px;}


/* Main Technology */
	.main-technology__visual {display:flex; align-items:center; height:380px; padding-top:30px; background-position:bottom right;}
	.main-technology__container {margin:0;}
	.main-technology__container .inner {padding:20px 20px 0;}
	.main-technology__slider {position:relative!important; top:0; left:0; width:100%;}
	.main-technology__container .inner {height:auto;}

}

@media screen and (max-width:1438px){
.header .gnb .depth01 {padding: 0 19px;}


}

@media screen and (max-width:1349px){
.youtube-bt ul li {width: 48%;}
.you-br {width: 266px; height: 218px;}
.youtube-bt ul li p {margin-bottom: 1rem; font-size: 16px;}
}


@media screen and (max-width:1313px){
.header .gnb .depth01 {padding: 0 6px; font-size: 17px;}
.main-business__text-box {width: auto;}

}

@media screen and (max-width:1280px){
/* Main Business */
	.main-business {padding: 40px 0;background: #ededed;position: inherit;}
	.main-business__title-wrap {width:100%;}
	.main-business__text {font-size:18px;}
	.main-business__img-wrap {width:100%;}

	.main-business__text-box {padding:30px 20px 0;}
	#main__certificate .u__desc.bot br {display:none;}


}
@media screen and (max-width:1024px){
.header .headwrap .top_cafe {left: 291px;}
.sec04 .text-box {    margin-left: 0;
    background-color: #fff;
    overflow: hidden;
    position: absolute;
    width: 100%;
    z-index: 1;
    padding-top: 2rem;}
.geda_mvcin_w {margin: 0 23px;}
.main-ck {top: 76%;}
.you-br {width: 100%; height: 272px;	}
.youtube-bt {width: 100%;}
.vid-you {padding: 0;}
.title-st1 {font-size: 25px;}
.main-business__box-text {margin-top: 14px; font-size: 14px;}
.main-business__text-box {max-width: 64%;}
.title-st4 {font-size: 17px;}
.main-technology__item {width: 21%;}
/*header*/
.header .headwrap .top_language {left: 115px;}
.header .headwrap .top_util {right: -11px; display: none;}
.header .gnb .depth01 {padding: 0 4px;}

.header .gnb .depth, .header .gnb .depth .depth01 > a {font-size: 15px;}

.u__title {
    font-size: 30px;
}



/*메인*/
#main-visual .visual-item > .visual-text > .header {font-size: 38px;}
#main-visual .visual-item > .visual-text > .header span {font-size: 32px;}
#main-visual .visual-item > .visual-text > p {font-size: 17px; margin-top: 0;}

/**/
.sec02 .text-box {position: initial; right: 0;}

/**/
.sec04 {padding: 0rem 0;}
.scroll-com {position: initial;     justify-content: center; right: 0;}

}

@media screen and (max-width:1048px){

/*SECTION01*/
.copy { width: 40%; left: 0px; margin-left: 8%;}
.items { transform: scale(0.8);}
.item1 { top: 110px; margin-left: -20px;}
.item2 { top: -130px; margin-left: -480px;}
.item3 { top: -330px; margin-left: 40px;}

}

@media screen and (max-width:1024px){
.main-sub01-1 .text-box h4 {font-size: 15px;}
.main-sub-box ul li {display: inline-grid;}
.sec04 .text-box {margin-left: 0%;}

/*SECTION01*/
.copy { width: 80%; left: 0px; margin-left: 10%; position: relative; padding: 100px 0px 50px 0px; top: 0px;}
.copy h3 { font-size: 38px; line-height: 42px;}
i.br { display: inline-block;}
.items { position: relative; top: 0px; margin: 0px; width: 500px; left: 50%; transform: translateX(-50%) scale(1);}
.items span { display: block;}
.items span img { width: 500px;}
.items .textbox { width: 100%; left: 0px; bottom: 0px; position: relative; height: auto; padding: 40px; padding-top: 20px; padding-bottom: 100px;}
.hhproArea .box {width: 100%;     background-size: cover;     float: none;     position: initial;}
.hhpro_cont {height: auto;}
.hhproArea .box:before  {display: none;}
}

@media screen and (max-width:970px){
.img-wrap {margin: 0;}
.main-business__img-wrap {margin: 0;}
.main-business__text-box {max-width: 100%;}
.flex-wrap {    flex-direction: column;}
.hhproArea .scBox li a { border-bottom: 1px solid #ddd; font: 14px;}
.hhproArea .box .title {display: flex;}
.hr-sect {display: flex;flex-basis: 100%;align-items: center;color: rgba(0, 0, 0, 0.35);font-size: 12px;margin: 8px 0px;}
.hr-sect::before,
.hr-sect::after {content: "";flex-grow: 1;background: rgba(0, 0, 0, 0.35);height: 1px;font-size: 0px;line-height: 0px;margin: 0px 16px;}
.hhproArea .box .txt {font-size: 14px;}
/* Main Business */
	.main-business {padding:20px 0;}
	.main-business::after {display:none;}
	.main-business__text {font-size:17px;}
	.main-business .btn-st1 {margin-top:35px;}
	.main-business__flex-wrap-1 {flex-direction:column;}
	.main-business__title-wrap {width:100%; padding:0;}
	.main-business__flex-wrap-1 .main-business__img-wrap {width:100%; margin:60px 0 0;}
	.main-business__img-wrap--building-iot .hide_1280 {display:block;}
	.main-business__img-wrap--building-iot .show_1280 {display:none;}
	.main-business__flex-wrap-1 .main-business__text-box {max-width:none;}
	.main-business__flex-wrap-2 .main-business__text-box {background-color:#fff;}
	.main-business__color-text {font-size:17px;}
	.main-business__box-text {margin-top:15px; font-size:15px;}
	.main-business .btn-st2 {margin-top:20px; color: #0765ed;}

	/* Main Technology */
	.main-technology {padding-bottom:100px;}
	.main-technology__visual {height:300px; background-size:auto 100%;}
	.main-technology__text {font-size:16px;}
	.main-technology__box-title {font-size:20px;}
	.main-technology__box-text {margin-top:10px; font-size:15px;}

	/**/
	#footer{padding:30px 0 40px}
    .foot_cust{position:relative;right:auto;top:auto}
    .familysite_wrap{position:absolute;top:5px;right:15px}
    .familysite{float:none}
    .cust_num{margin-top:0;text-align:left}
    .foot_info_wrap{width:calc(100% - 30px);margin:25px 15px 0}
    .foot_menu a{padding:5px 10px}
    .foot_menu a:first-child{padding:5px 10px 0 0}
    .foot_info{text-align:center}
}
@media screen and (max-width:768px){
#main-visual .visual-item > .visual-text .logo-txt h3 {font-size: 39px;}
.header .headwrap .top_cafe {display: none;}
.main-technology {padding-bottom: 0;}
.main-technology__item {width: 20%;}
.main-technology__box-title {font-size: 13px;}

/**/
.main-sub-box { height: 383px;}
.main-ck {right: 10%; top: 71%;}
	.familysite {width: 100%;}
	.main-sub-box ul li {font-size: 15px;     width: 49%;}
	.main-sub-box ul li span {display: block;}
	.main-sub-box ul {width: 100%;}
	.main-sub01-1 .text-box span {font-size: 15px; display: none;}
	.main-sub01-1 .text-box h2 {font-size: 20px;}
	.main-sub01-1 .text-box h4 {font-size: 15px;}
	.desc-row_main>div>div {width: 100%; padding: 0;}
	.desc-row_main>div {flex-direction: column;}
	#main__certificate {padding:50px 0;}
	#main__certificate .certificate_list_con {margin:30px 0;}

	.main-section13 {padding: 14rem 0;}
	.hhproArea .box {float:none; position: initial;	padding: 0;}
	/*gnb*/
	#header .menu-hd {display: block;}
	.header .gnb {display: none;}
	.header .headwrap .top_language {display: none;}
	.header .headwrap .top_util {display: none;}
	.menu-panel {
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    position: fixed;
    z-index: 9999;
    top: 0;
    height: 100%;
    width: 80%;
    background-color: #fff;

  }
  
  /*햄버거 메뉴*/
  .menu-panel .menu__button {
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    display: inline-block;
    cursor: pointer;
    position: absolute;
    z-index: 2;
    top: 77px;
    width: 30px;
    height: 30px;
  }
  .menu-panel .menu__button span,
  .menu-panel .menu__button span:before,
  .menu-panel .menu__button span:after {
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    width: 32px;
    height: 3px;
    background-color: #000;
  }
  .menu-panel .menu__button span {
    position: relative;
    display: inline-block;
    float: left;
    margin-top: 9.09090909px;
  }
  .menu-panel .menu__button span:before,
  .menu-panel .menu__button span:after {
    content: "";
    position: absolute;
    left: 0;
  }
  .menu-panel .menu__button span:before {
    top: -9.09090909px;
  }
  .menu-panel .menu__button span:after {
    top: 9.09090909px;
  }
  /*햄버거 메뉴 활성화 시*/
  .menu-panel .menu__button.is--active span{
    background: transparent;
  }
  .menu-panel .menu__button.is--active span:before,
  .menu-panel .menu__button.is--active span:after {
    top: 0;
  }
  .menu-panel .menu__button.is--active span:before {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
  }
  
  
  .menu-panel .menu__button.is--active span:after {
    -webkit-transition-delay: 0.09s;
    -moz-transition-delay: 0.09s;
    -o-transition-delay: 0.09s;
    -ms-transition-delay: 0.09s;
    transition-delay: 0.09s;
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
  }
  
  /*메뉴 패널 안쪽부분*/
  .mo-menu-title{
    background: #c4dcff;
    height:10%;
    color:#fff;
    font-size:16px;
    padding: 18px 30px 18px 20px;
    text-align: left;
  }
  .mo-menu-title a {padding: 0 10px; color: #000; font-size: 14px;     vertical-align: middle;}
  .mo-menu-title a img {margin-top: .4rem;}
  /* .mo-menu-title a::after {content: "|"; float: right; display: block;} */
  .mo-menu-title a:last-child::after {content: "";}

  /* .mo-menu-title a:first-of-type{
    border-right:1px solid #fbbc90;
    padding:0 7px 0 0;
  } */
  .menu-panel > .menu-list {
    width:100%;
    z-index: 1;
    height: auto;
    text-align: left;
  }
  
  .menu-panel > .menu-list > li{
    clear: both;
    width: 100%;
    border-bottom: 1px solid #dcdcdc;
  }
  
.menu-panel > .menu-list > .menu-label > .menu-list__text {
    font-size: 15px;
    padding: 15px 0 16px 30px;
    color: #444;
    width: calc(100% - 60px);
    display: inline-block;
    height: 100%;
  }


  
  /*1차 메뉴의 - + 부분*/
  .menu-panel ul li .menu-list__arrow{
    height: 47px;
    width: 55px;
    display: inline-block;
    float: right;
    position: relative;
    cursor: pointer;
  }
  
  .menu-panel ul li .menu-list__arrow::before,
  .menu-panel ul li .menu-list__arrow::after{
    width: 20px;
    height: 2px;
    background: #535353;
    content: "";
    display: inline-block;
    position:absolute;
    left:17.5px;
    top: calc(50% - 1px);
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
  }
  
  .menu-panel ul li .menu-list__arrow::after{
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
  }

  .menu-panel .sub-menu{
    display: none;
    width: 100%;
    padding:0 8%;
  }
  
  .menu-panel .sub-menu:after {
    content: '';
    display: block;
    clear: both;
  }

  .menu-panel .sub-menu li{
    float: left;
    height: 40px;
    width: 100%;
    border-bottom: 1px solid #e0e0e0;
  }
  
  .menu-panel .sub-menu li:last-of-type {
    border-bottom: none;
    margin: 0 0 20px 0;
  }

  .menu-panel .sub-menu li:first-of-type {
    margin: 15px 0 0 0;
  }
  
  .menu-panel .sub-menu li a{
    display: block;
    height: 100%;
    padding:11px 0px 15px 8px;
   font-size: 15px;
    color: #666666;
  }
  
  .menu-panel {
    left: -100%;
  }
  .menu-panel .menu__button {
    left: 130%;
  }
  .menu-panel.is--active {
    left: 0;
    overflow: scroll;
  }
  .menu-panel.is--active .menu__button {
    left: 100%;
    margin-left: -46px;
    z-index: 999;
    margin-top: -47px;
}
  
  .menu-panel.is--active .menu__button span:before,
  .menu-panel.is--active .menu__button span:after{
    background: #fff;
  }
  
  .menu-panel-overlay{
    position: fixed;
    top: 0;
    z-index: 9998;
    width: 100%;
    height: 100%;
    display: none;
    background-color: rgba(0, 0, 0, 0.6);
    cursor: pointer;
  }

  /* active */

  .menu-list > .menu-label.is--open .menu-list__text {
    color:#35a7e0;
  }
  .menu-list > .menu-label.is--open .sub-menu{
    border-top: 2px solid #35a7e0;
    display: block;
  }

  .menu-list > .menu-label.is--open .menu-list__arrow::before,
  .menu-list > .menu-label.is--open .menu-list__arrow::after {
    background: #35a7e0;
  }

  .menu-list > .menu-label.is--open .menu-list__arrow::after {
    -webkit-transition-delay: 0.09s;
    -moz-transition-delay: 0.09s;
    -o-transition-delay: 0.09s;
    -ms-transition-delay: 0.09s;
    transition-delay: 0.09s;
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
  }
#main-visual .visual-item > .visual-text > .header {font-size: 28px; line-height: 35PX;}
#main-visual .visual-item > .visual-text > p {font-size: 14px;}
#main-visual .visual-item > .visual-text {top: 10%; width: 100%; text-align: center;     padding: 0 3rem;}
#main-visual .visual-item > .visual-text > .header span {font-size: 22px;}


/**/
.sec02 .text-box span {font-size: 15px;display: none;}
.sec02 .text-box h2 {font-size: 29px;}
.sec02 .text-box p {font-size: 15px;}
.sec04 .text-box span {font-size: 15px; display: none;}
.sec04 .text-box h2 {font-size: 29px;}
.sec04 .text-box p {font-size: 15px;}
 .geda_mvchos_tit {font-size: 16px;}
.geda_mvchos_cont {font-size: 14px;}
.section.mvlow02 {position: inherit;}
.normal_mode .geda_mvcin_w {padding: 20px 0;}
.geda_mvcin_w {margin: 0;}
.gedasub_bg {display: none;	}
.hhproArea .titBox .btit {font-size: 20px;}
.dayarea {margin-left: 10% ;}
.geda_rimg {width: 100%;     position: initial;}
.pc_only {display: none;	}
.m_only {display: block;}
}

@media screen and (max-width:640px){
#main-visual .visual-item > .visual-text img {width: 15% !important;}
#main-visual .visual-item > .visual-text .logo-txt h3 {font-size: 20px; font-weight: 500;justify-content: center; gap:20px;}



.mCSB_container ul {padding: 0 1rem;}
.hhproArea .scBox {height: auto;}
.dn_640 {display: block;}
.mobile-main {width: 100% !important; margin: 0 !important;}
.mobile-main-box {padding:0 1rem !important; }
#main__certificate .certificate_list {margin:0%;}

.certificate_thumb p {font-size: 13px;}
.main-ck {top: 77%;width: 27%;right: 9%;}

.sec04 .text-box {margin-left: 0;}
.sec04 {}
.flow { margin: 0 !important;}
.u__title {  font-size: 22px;}
.u__desc { font-size: 15px;}
	#main__certificate {background-size:cover;}
	#main__certificate .u__desc {line-height:1.6; padding: 0 1rem;}
	#main__certificate .u__desc br {display:none;}
	#main__certificate .certificate_list li {width:48%;margin-bottom:10px;}
	#main__certificate .certificate_list_con {margin-bottom:10px;}
	.top_fixed {font-size: 13px;background-size:cover;}
	.sec02 .text-box em {font-size: 15px;}

/**/
#footer{padding:0 0 30px}
    #footer .inner{margin:0}
    .familysite_wrap{position:relative;display:block;top:auto;right:auto}
    .familysite{height:45px;line-height:45px}
    .familysite i{top:12px}
    .familysite, .family_site_list, .familysite .btn_fs_on, .familysite .btn_fs_off{width:97%}
    .family_site_list{bottom:45px}
    .family_site_list li{text-align:center}
    .cust_num{padding:15px 0;border-bottom:0;text-align:center;font-size:0;}
    .cust_num li{padding:0 25px;font-size: 17px;letter-spacing:-1px}
    .cust_num li:first-child{border-right:none}
    .cust_desc{margin:0 !important;border-bottom: 1px solid #525252;text-align:left;}
    .cust_desc p{max-width:375px;margin:0 auto;padding:0 0 20px 35px;}
    /*.cust_num li span{display:inline;margin-right:10px} 220104*/
    .foot_info_wrap{margin:20px 15px 0}
    .foot_sns_wrap{border-top:none;padding-top:5px;text-align:center}
    .foot_sns {position: relative;top: auto;right: auto;text-align:center}
    .foot_info_tit{display:none}
    .foot_info{margin-top:15px; font-size: 13px;}
    .foot_menu a{font-size:14px}
    .foot_sns_wrap .footBi{margin:20px auto 0}
	.foot_menu {text-align: center;}
	.cust_num li span {font-size: 13px;}
/* Title */
	.title-st1 {font-size:17px;}
	.title-st2 {font-size:18px;}
	.title-st3 {font-size:28px;}
	.title-st4 {font-size:17px;}
	.title-st5 {font-size:26px;}
	.title-st6 {font-size:26px;}
	.main-business__box-text {font-size: 14px;}
	.main-technology .title-st2 {margin-bottom: 0;}
	.inner.PR {padding: 0 !important;}
	.m_on {display: block;}
	.show_768 {display: none;}
	.btn-st1 {width: 100px; height: 37px; font-size: 11px;}
/* Main Business */
	.main-business {padding: 10px 0;}
	.main-business__logo {width:100px; display: none;}
	.main-business__text {font-size:16px; margin-top: 8px;}
	.main-business .btn-st1 {margin-top:10px; position: absolute; top: 0; right: 0;}
	.main-business .flex-wrap {flex-direction:column;}
	.main-business__img-wrap {width:100%;}
	.main-business__color-text {font-size:16px;}
	.main-business__text-box {max-width:none;}
	.main-business__flex-wrap-1 .main-business__img-wrap {margin-top:10px;}
	.main-business__img-wrap--building-iot .hide_1280 {display:none;}
	.main-business__img-wrap--building-iot .show_1280 {display:block;}
	.main-business__flex-wrap-2 {margin-top:20px; margin-bottom: 30px;}
	.main-business__flex-wrap-2 .main-business__img-wrap:not(:first-child) {padding-top:30px; margin:0;}
	.main-business__color-text {display: none;}
	.main-business__text-box {padding: 20px 0px 0 20px;}
	.main-business__title-wrap {padding-bottom: 1rem;}
	.hide_1280 {display: none;}
	.show_1280 {display: block;}

/* Main Technology */
	.main-technology {padding-bottom:0px;}
	.main-technology__visual {height: 122px;}
	.main-technology__slider-ctrl {margin-top:25px;}
	.main-technology__box-title {font-size:13px;overflow: hidden;white-space: nowrap;word-break: break-all;width: 100%;height: 20px;text-overflow: ellipsis;}
	.main-technology__text-box {padding: 0;}
	.main-technology__box-text {font-size: 12px; margin-top: 0;}

	.desc-row_main {margin-top: 30px; margin-bottom: 30px;}

#main-visual .slick-dots {bottom: 1rem;}

/*gnb*/
.logo {width: 75%; margin: 0 auto;}
/*SECTION01*/
.copy { width: 100%; margin-left: 0%; padding: 30px 0px 30px 1rem;}
.copy h3 { font-size: 19px; line-height: 0px;     padding-top: 18px;}
.copy.sc-event p {font-size: 14px;}
.items { position: relative; top: 0px;  margin: 0px; width: 88%; left: 6%; transform: translateX(0%) scale(1);}
.items span img { width: 100%;}
.items .textbox { width: 100%; left: 0px; bottom: 0px; position: relative; height: auto; padding: 0px; padding-top: 20px; padding-bottom: 60px;}
.textbox p { text-transform: uppercase; font-weight: 500; font-size: 12px; padding-top: 8px;}
.textbox h3 { padding-top: 10px; letter-spacing: -0.03em; font-size: 17px; line-height: 21px;  font-weight: 500;}
.des { padding-top: 15px; font-size: 16px; line-height: 24px; font-weight: 400; letter-spacing: -0.05em; color: #222;}

.dc_pc {width: 100%; height: auto; background:none;	}
.media {width: 100% !important; height: auto !important; left: 0; top: 0; position: initial; margin: 0;}
.sec02 .text-box h2 {font-size: 20px;}
.sec04 .text-box h2 {font-size: 20px;}
.hhproArea .titBox {height: 135px;}
.hhproArea .titBox {padding: 2rem 0;}
.hhproArea .box {padding: 2rem 0; height: 385px;}
.mt-40 {margin-top: 1.5rem;}
.geda_mvcitem {margin-top: 10px;}

.gedaimg_list > li:nth-of-type(1){ padding-right: 0px;}
.gedaimg_list > li:nth-of-type(2){  padding-right: 0px;}
.gedaimg_list > li:nth-of-type(3){  padding-right: 0px;}
.normal_mode .geda_mvcin_w {display: block;}

#main-visual .visual-item {text-shadow: none; margin-top: 10REM;}
#main-visual .visual-item > .visual-text > .header {font-size: 20px; line-height: 23PX; }
#main-visual .visual-item > .visual-text > .header span {font-size: 15px;}
#main-visual .visual-item > .visual-text > p {font-size: 12px;     padding: 0 1rem;}
}

@media screen and (max-width:480px){
.sub_top li a {gap:5px !important;        justify-content: center;
    align-items: center;      }
.header .headwrap .sub_top li {width: 75px !important;}
.header .headwrap .sub_top li a p {color: #919191;}
.header .headwrap .top_util  .sub_top li img {width: 18px !important;}

.top_fixe ul li {width: 21%;}
.top_fixe ul li img{width: 20px;}

.main-technology__box-title {margin-right: 0;}
.main-business__flex-wrap-2 .main-business__text-box {height: 178px;}
.main-technology__item {width: 49%;padding: 0 1px;}
.pink_img li {width: 24%; font-size: 13px;}
.text-box2 p a {font-size: 18px;}
.vid-you {padding: 0;}
.youtube-bt {width: 100%;}
.top_fixe {margin-top: 0px;}
.youtube-bt ul li {width: 100%; display: block;}
.you-br {width: 100%; height: 167px; margin-bottom: 0;}
.youtube-bt ul li p {font-size: 14px;}
.text-box2 > h6 {font-size: 15px;}
.header .headwrap .logo a {margin-top: 8px;}
.gedaimg_spec {vertical-align: middle; line-height: 1;  display: inline;}
.main-logo-02 {display: none !important;}
.pd_1 { padding: 0 1rem;}
.snbSwiper {display: block; padding: 0 3px;box-sizing: border-box;background: white; border-bottom: 1px solid #ddd;}
.swiper-slide { width: auto !important; }
.swiper-slide a { display: block; text-align: center; }
.swiper-slide .text {margin: 0 5px;padding: 11px 5px 8px 5px;box-sizing: border-box;position: relative;display: inline-block;height: 34px;white-space: nowrap;font-size: 12px;line-height: 1em;color: #333;}
.on .text { color: #1b64bc; font-weight: bold; }
.on .text:after { content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background: #1b64bc; }



/* Main Business */
	.main-business__text-box {width:100%; margin-top:-70px;}
	.img-wrap {margin: 0;}
		/* Main Technology */
	.main-technology__visual {background-position-x:0px;}

	.box-h {height: 217px !important;}

	.sec04 {padding: 0; height: 450px;}
	.sec04 .text-box {margin-left: 0;background-color: #fff; overflow: hidden;position: absolute;width: 100%;    z-index: 1; padding-top: 2rem;}
	.flow {animation: flow-ani 10s linear forwards infinite;}

}

@media screen and (max-width:398px){
.mainTap dd {width: 26%;}


}

@media screen and (max-width:395px){
	.swiper-slide .text {margin: 0 2px; padding: 16px 5px 8px 5px;}

}


@media screen and (max-width:375px){

.swiper-slide .text {margin: 0 2px; padding: 16px 2px 8px 2px;}
}

@media screen and (max-width:320px){

}