@charset "utf-8";
/* *******************************************************
 * filename : main_responsive.css
 * description : 메인 레이아웃 및 컨텐츠 반응형 CSS
 * date : 2022-08-08
******************************************************** */

/* ******************  메인 인트로 ********************** */
@media all and (min-width:1281px){
	.gm-main-page #gm-header .logo,
	.gm-main-page #gm-header .gm-header-util-box,
	.gm-main-page #gm-header #gm-gnb > ul{opacity:0; transform:translateY(50px); filter:blur(2rem); transition:all 1s ease-in-out;}
	.gm-main-page #gm-header .logo,
	.gm-main-page #gm-header .gm-header-util-box,
	.gm-main-page #gm-header #gm-gnb > ul{opacity:1; transform:translateY(0px); filter:blur(0rem);}
	.gm-main-page #gm-header #gm-gnb > ul{transition-delay:0.2s;}

	.gm-main-page:not(.main-active) #gm-header:not(.top-fixed){top: 0; transition:top 2s ease-in-out}
	.gm-main-page #gm-header:not(.top-fixed) .logo svg{height: 50px; transition:all 2s ease-in-out;}
	.gm-main-page #gm-header:not(.top-fixed) #gm-gnb{transform: translate(-43rem, calc(100% + 2rem)); transition:all 2s ease-in-out;}
}
/* active */
@media all and (min-width:1281px){
	.gm-main-page.active #gm-header:not(.top-fixed){top: var(--header-top);}
	.gm-main-page.active #gm-header .logo svg{height: 34px;}
	.gm-main-page.active #gm-header #gm-gnb{transform: translate(0,0) !important;}
	.gm-main-page.active .gm-main-visual-img-cover{margin:0; inset:-1px; border-radius:0;}
	.gm-main-page.active .gm-main-visual-img-cover .gm-cover-top{width:0; height:0;}
	.gm-main-page.active .gm-main-visual-img-cover .gm-cover-top .gm-cover1{transform: translate(-100%, 0%);}
	.gm-main-page.active .gm-main-visual-img-cover .gm-cover-top .gm-cover2{transform: translate(0%, -100%);}
	.gm-main-page.active .gm-main-visual-img-cover .gm-cover-bottom{width:0; height:0;}
	.gm-main-page.active .gm-main-visual-img-cover .gm-cover-bottom .gm-cover1{transform: translate(0%, 100%);}
	.gm-main-page.active .gm-main-visual-img-cover .gm-cover-bottom .gm-cover2{transform: translate(100%, 0%);}

	.gm-main-page.active #gm-header.gm-white-ver:not(.gm-gnb-open, .top-fixed) .logo svg *{transition-delay:0.8s;}
	.gm-main-page #gm-header.gm-gnb-open .logo svg{transition:all 2s ease-in-out, fill 0.4s 0s ease-in-out !important;}
	.gm-main-page #gm-gnb > ul > li > a em .badge{opacity: 0; visibility: hidden; transition:opacity 0.4s ease-in-out, visibility 0.4s ease-in-out; transition-delay:2s;}
	.gm-main-page.active #gm-gnb > ul > li > a em .badge{opacity: 1; visibility: visible;}
}
/* ******************  메인 비주얼 ********************** */
@media all and (max-width:1820px){
	.gm-main-visual-img-cover{margin: var(--header-height) var(--area-padding);}
	.gm-main-page #gm-header:not(.top-fixed) #gm-gnb{transform: translate(-22vw, calc(100% + 2rem)); transition:all 2s ease-in-out;}
	.gm-main-fixed-btn{right:var(--area-padding);}
}
@media all and (max-width:1480px){
	.gm-main-page #gm-header:not(.top-fixed) #gm-gnb{transform: translate(-17vw, calc(100% + 2rem)); transition:all 2s ease-in-out;}
}
@media all and (max-width:1280px){
	.gm-main-visual-img-cover{margin:0; border-radius:0;}
	.gm-main-visual-img-cover .gm-cover-top,
	.gm-main-visual-img-cover .gm-cover-bottom{display: none;}
}
@media all and (max-width:800px){
	/* 메인 비주얼 :: 텍스트 */
	#gm-mainVisual .gm-main-visual-txt-box{padding:0 4rem var(--area-padding);}
	.gm-main-visual-txt-box .gm-main-visual-txt1{font-size:2rem; line-height: 1.4; margin-bottom:2.5rem;}
	.gm-main-visual-txt-box .gm-main-visual-txt2{font-size:4.8rem; line-height:1.4; margin-bottom:4rem;}
	.gm-main-visual-txt-box .gm-main-visual-more-btn{}
	.gm-main-fixed-btn{width:9rem; height:9rem; right: var(--area-padding); bottom:calc(10vh - 4.5rem) !important;}
	/* top-fixed */
	.gm-main-page.active .gm-main-fixed-btn {right: var(--area-padding);}
	
	.gm-main-fixed-btn .floating-box {width: 70vw; max-width: 36rem;padding: 2.5rem; display: none;}
	.gm-main-fixed-btn .floating-box .txt01 {font-size: 1.7rem;}
	.gm-main-fixed-btn .floating-box .txt02 {font-size: 1.3rem;}

}

/* ****************** 메인 공통 ********************** */
@media all and (max-width:800px){
	.gm-main-tit-box .gm-main-tit{font-size:clamp(28px,6vw,44px);}
	.gm-main-tit-box .gm-main-sub-tit{font-size:1.6rem;}
}

/* ****************** 메인컨텐츠 :: 스마트 솔루션 ********************** */
@media all and (max-width:800px){
	#gm-mainSolution{padding:12rem 0 6rem;}
	.gm-panorama-slide li {width:32rem;}
	/* .gm-panorama-slide .inner{height:54rem; padding:0;} */
	.gm-panorama-slide .img-box:before{z-index:1;}
	.gm-panorama-slide .txt-box{top:7rem; padding:0 2rem;}
	.gm-panorama-slide .tit {font-size:2.4rem;}
	.gm-panorama-slide .txt {font-size:1.8rem;}
}
@media all and (max-width:480px){
	.gm-panorama-slide li {width:27rem;}
	/* .gm-panorama-slide .inner{height:42rem;} */
	.gm-panorama-slide .txt-box{top:5rem;}
}


/* ****************** 메인컨텐츠 :: 365 렌탈 ********************** */
@media all and (max-width:1280px){
	.gm-main-rental-slide .inner .txt-box{left:5rem; right:5rem;}
}
@media all and (max-width:800px){
	#gm-mainRental {padding: 6rem 0 12rem;}
	.gm-main-rental-slide-con {margin: 6.4rem auto 0; width: 83%; max-width: 34rem;}
	.gm-main-rental-slide .inner .txt-box{left:var(--area-padding); right:var(--area-padding);}
	.gm-main-rental-slide .inner .txt-box .tit{font-size:2.4rem;}
	.gm-main-rental-slide .inner .txt-box .txt{font-size:1.8rem; margin-top:2rem;}
	.gm-main-rental-slide .inner .txt-box .price-box{height:5.8rem; font-size:1.8rem;}
	
	.gm-main-rental-slide-control-box{/* bottom: var(--area-padding); */ bottom: -7rem; padding: 0; justify-content:space-between;; /* display: none; */}
	.gm-main-rental-slide-control-box .swiper-pagination{position: relative; display: flex; align-items: center; order:2; margin-right:0;}
	.gm-main-rental-slide-control-box .swiper-pagination-bullet {width: 1rem; height: 1rem; display: block; border-radius: 100%; background: rgba(0,0,0,0.2); opacity: 1; transition:var(--transition-custom2); transition-property: background; position: relative;}
	.gm-main-rental-slide-control-box .swiper-pagination-bullet + .swiper-pagination-bullet{margin-left: 3rem;}
	.gm-main-rental-slide-control-box .swiper-pagination-bullet-active {opacity: 1; background: #000;}
	.gm-main-rental-slide-control-box .swiper-pagination-bullet + .swiper-pagination-bullet:before{position: absolute; top: 50%; margin-top: -0.5px; left: -3rem; width: 3rem; height: 1px; background-color: rgba(0,0,0,0.2); opacity: 0.2; content: ''; pointer-events:none;}
	.gm-main-rental-slide-control-box .gm-main-rental-slide-prev,
	.gm-main-rental-slide-control-box .gm-main-rental-slide-next{font-size: 4.8rem; color:#000; font-weight: 400; position: relative; z-index: 10; cursor: pointer;}
	.gm-main-rental-slide-control-box .gm-main-rental-slide-prev{order:1;}
	.gm-main-rental-slide-control-box .gm-main-rental-slide-next{order:3; margin-left:0;}
	.gm-main-rental-slide-control-box .swiper-button-disabled{color: rgba(0,0,0,0.2)}
/* }
@media all and (max-width:480px){ */
	.gm-main-rental-slide .inner .bg-box span{padding-top:157.89%;}
	.gm-main-rental-slide .inner .bg-box span:before{display: none;}
	.gm-main-rental-slide .inner .txt-box{text-align:center; top:0; transform:none; height:100%; padding-block:8rem 4rem; box-sizing: border-box;}
	.gm-main-rental-slide .inner .txt-box .price-box{position: absolute; top:auto; left:0; right:0; bottom:4rem; width:100%; max-width:none;}
}

/* ****************** 메인컨텐츠 :: 고객이 선택한 이유 ********************** */
@media all and (min-width:801px){
	.gm-main-reason-list .list-item:nth-child(1) .icon-box img{max-width:18.8rem; max-height:18.8rem;}
	.gm-main-reason-list .list-item:nth-child(2) .icon-box img{max-width:18rem; max-height:18rem;}
	.gm-main-reason-list .list-item:nth-child(3) .icon-box img{max-width:19.7rem; max-height:19.7rem;}
	.gm-main-reason-list .list-item:nth-child(4) .icon-box img{max-width:17.8rem; max-height:17.8rem;}
}
@media all and (max-width:1280px){
	.gm-main-reason-list .list-item{padding:6rem 3rem;}
	.gm-main-reason-list .list-item .txt-box{width:calc(100% - 15rem);}
	.gm-main-reason-list .list-item .icon-box{width:15rem; height:15rem;}
	.gm-main-reason-list .list-item.right .txt-box{margin:auto; margin-right:0;}
}
@media all and (max-width:800px){
	#gm-mainReason {padding: 12rem 0;}
	.gm-main-reason-list{margin:6rem 0 0;}
	.gm-main-reason-list .list-item{width:100%; margin:0; margin-bottom:2rem; padding:6rem var(--area-padding) 3rem; }
	.gm-main-reason-list .list-item:last-child{margin-bottom: 0;}
	.gm-main-reason-list .list-item .gm-cm-fill{display: none;}
	.gm-main-reason-list .list-item .txt-box{width:100%; text-align:center !important;}
	.gm-main-reason-list .list-item .txt-box .tit{font-size:2.4rem;}
	.gm-main-reason-list .list-item .txt-box .txt{font-size:1.6rem; margin-top:2rem;}
	.gm-main-reason-list .list-item .icon-box{position: relative; inset:auto !important; transform:none; width:20rem; height:auto; margin:auto;}
}

/* ****************** 메인컨텐츠 :: 비지니스 모델 ********************** */
@media all and (max-width:800px){
	#gm-mainBusiness{overflow:hidden;}
	.gm-main-business-list{overflow:visible !important; width: 83%; max-width: 34rem; display: block;}
	.gm-main-business-list .swiper-wrapper{align-items:stretch; flex-wrap: nowrap;}
	.gm-main-business-list .swiper-slide{height:auto;}
	.gm-main-business-list .list-item{margin:0; height: auto; min-height:100%;}
	.gm-main-business-list .list-item .img-box img{width:100%; max-width:none;}
	
	.gm-main-business-list .list-item > .gm-cm-fill,
	.gm-main-business-list .list-item .gm-cm-fill-inner{display: none;}
	.gm-main-business-list .list-item .btn{background-color: #000; box-shadow: 1rem 1rem 2rem rgba(0, 0, 0, 0.1);}
	.gm-main-business-list .list-item .btn .txt{color:#fff;}
}

/* ****************** 메인컨텐츠 :: 레퍼런스 ********************** */
@media all and (max-width:800px){
	#gm-mainReference {padding: 12rem 0;}
	.gm-main-reference-tab-style{padding: 0; border-radius:2.8rem; background:none;}
	.gm-main-reference-tab-style .gm-move-line-wrap{display: none;}
	.gm-main-reference-tab-style ul{position: absolute; display: none;}
	.gm-main-reference-tab-style ul li a {padding: 1.2rem 1.5rem; display: block; height: auto;}
	.gm-main-reference-list .list-item{width:calc(50% - 2rem); margin:2rem 1rem;}
	
	.gm-main-reference-con {margin: 4.4rem auto 0; width: 85.84%;}
	.gm-main-reference-btn{margin-left: -7.08%; margin-right: -7.08%;}
	.gm-main-reference-btn a{background-color: #000;}
	.gm-main-reference-btn a .gm-cm-fill{display: none;}
	.gm-main-reference-btn a .txt{color:#fff;}
}
@media all and (max-width:480px){
	.gm-main-reference-list{display: block; width:90%; margin:auto;}
	.gm-main-reference-list .list-item{width:calc(100% - 2rem); margin:2rem 1rem;}
	.gm-main-reference-list .list-item .txt{margin-top:2rem;}
	.gm-main-reference-list .list-item:nth-child(-n+4){display: none;}
}

/* ****************** 메인컨텐츠 :: 종합 수치 ********************** */
@media all and (max-width:1280px){
	.gm-total-card-list .list-item {min-height: 28vh; padding: 4vh 4.4rem;}
	.gm-total-card-list .list-item .tit{font-size:1.5rem;}
	.gm-total-card-list .list-item .num{font-size: 3.6rem;}
	.gm-total-card-list .list-item dl{margin-top:2rem;}
	.gm-total-card-list .list-item dl dt{font-size:2rem;}
	.gm-total-card-list .list-item dl dd{font-size:1.8rem;}
	.gm-total-card-list {bottom: calc(50vh + 19rem);}
}
@media all and (max-width:800px){
	.gm-main-total-wrap{padding-bottom:5rem; padding-inline:var(--area-padding);}
	.gm-total-card-con{position: relative !important; display: flex; flex-direction:column-reverse; height:auto;}
	.gm-total-map-bg{padding-top:0;}
	.gm-total-card-list{position: relative; top:auto; bottom:auto; left:auto; transform:none; /* padding-inline: var(--area-padding); */ padding: 0; box-sizing:border-box;}
	.gm-total-card-list .list-item{position: relative; width:100%; transform:none; margin-bottom:2rem;}
	.gm-total-card-list .list-item .tit{font-size:1.6rem;}
	.gm-total-card-list .list-item .num{margin-top:2rem; /* font-size:4.8rem; */ font-size:4rem;}
	.gm-total-card-list .list-item dl{margin-top:3rem;}
	.gm-total-card-list .list-item dl dt{/* font-size:2.4rem; */ font-size:1.8rem;}
	.gm-total-card-list .list-item dl dd{margin-top:1.3rem; /* font-size:2rem; */ font-size:1.6rem;}

	.gm-total-map-bg .map{padding-top:15rem;}
	.gm-total-map-bg .map .map-circle{top:10rem; max-width: 162rem; width: 162rem;}
	.gm-total-map-bg .map .map-img{max-width: none; width:100%; padding-top:70%; left: 50%; transform: translateX(-50%); max-width:none;}
	.gm-total-map-bg .map .map-img img {inset: 0; margin: auto; opacity:0; animation: mapImgRolling 9s infinite;}
	.gm-total-map-bg .map .map-img .img01{animation-delay:3s; bottom: 0;}
	.gm-total-map-bg .map .map-img .img02{animation-delay:0s; bottom: 0;}
	.gm-total-map-bg .map .map-img .img03{animation-delay:6s; bottom: 0;}
	@keyframes mapImgRolling{
		0%{
			opacity:0;
		}
		8%{
			opacity:1;
		}
		30%{
			opacity:1;
		}
		38%{
			opacity:0;
		}
		100%{
			opacity:0;
		}
	}
}