#app.transition{transition:background 0.8s}
.sub-inner{max-width:1200px; padding:0 16px; margin:0 auto;}
#app.black{background: #000;}
.sub-wrapper .page-top{padding:0 16px;}
.sub-wrapper .page-category{color:#29D7B6; letter-spacing: -0.04em; font-size:1.8rem; font-weight:800; margin-bottom: 0.6em;}
.sub-wrapper .page-title{font-size:4rem; letter-spacing: -0.05em; color:#000; font-weight:700; margin-bottom: 0.8em;}
.sub-wrapper .page-exp{font-size:2rem; color:#777; font-weight:500; line-height: 1.4; letter-spacing: -0.045em;}
.sub-wrapper .page-exp p + p{margin-top: 1em;}
.sub-wrapper .sub-visual{min-height:860px; background: rgb(238,242,246); background: linear-gradient(180deg, rgba(238,242,246,1) 0%, rgba(224,230,236,1) 100%); display:flex; flex-direction: column; justify-content: flex-end; text-align: center; margin-bottom:20rem;}
.sub-wrapper .sub-visual.service{opacity: 0; overflow: hidden; margin:0;}
.page-top.alone{text-align: center; margin:200px 0 100px;}
.sub-wrapper.black .page-title{color:#fff}
.sub-wrapper.black .page-exp{color:#d2d2d2}

.sub-wrapper .m-sec.contact{min-height:918px;}
.sub-wrapper .contact-wrapper{margin:120px 0 0; }
.sub-wrapper .contact-wrapper{margin:120px 0 0;}
.sub-wrapper .service ~ .contact .contact-wrapper{opacity: 1;}
.sub-wrapper .summary{text-align: center;}
.sub-wrapper .summary .page-title:before{content:""; display:block; width:40px; height:4px; background:#29D7B6; margin:0 auto 24px;}
.sub-wrapper .summary .page-exp{margin-bottom:72px;}
.sub-wrapper .summary-list{display:flex; gap:8px; align-items: stretch; justify-content: center;}
.sub-wrapper .summary-list li{max-width:200px; width:100%; display:flex; flex-direction: column;}
.sub-wrapper .summary-list li span{font-size:20px; color:#000; line-height:1.4; font-weight:700; letter-spacing: -0.04em;}
.sub-wrapper .summary-list li:before, .sub-wrapper .summary-list li:after{content:""; display:block; width:100%; height:6px; border-radius: 3px; background:#000;}
.sub-wrapper .summary-list li:before{margin-bottom: 32px;}
.sub-wrapper .summary-list li:after{margin-top: 32px;}
.sub-wrapper .summary-list li:nth-child(1):before, .sub-wrapper .summary-list li:nth-child(1):after{background:#0071C5}
.sub-wrapper .summary-list li:nth-child(2):before, .sub-wrapper .summary-list li:nth-child(2):after{background:#3695EA}
.sub-wrapper .summary-list li:nth-child(3):before, .sub-wrapper .summary-list li:nth-child(3):after{background:#6A88A1}
.sub-wrapper .summary-list li:nth-child(4):before, .sub-wrapper .summary-list li:nth-child(4):after{background:#10426E}

.sub-wrapper .sec-service + .sec-service{margin-top:240px;}
.sub-wrapper .sub-section.point{margin-bottom:200px; padding-top: 20px;}
.sub-wrapper .sub-section.point .sub-inner{position: relative;}
.sub-wrapper .point-list{}
.sub-wrapper .point-list .cover{height:100%; border-radius: 4px; overflow: hidden; }
.sub-wrapper .point-list .cover .cover-content{background:#f8f9fa;margin-bottom:32px; position: relative;}
.sub-wrapper .point-list .cover .cover-content:before{content:""; display:block; width:100%; height:0; padding-bottom:47.77%; }
.sub-wrapper .point-list .cover .cover-title{font-size:4rem; font-weight:700; color:#000; position: absolute; left:0; top:0; width:100%; height:100%; display:flex; align-items: center; justify-content: center;}
.sub-wrapper .point-title{margin-bottom: 60px;}
.sub-wrapper .point-title .emp{color:#29D7B6}
.sub-wrapper .point-list .item-img{background:#E1E7ED; overflow:hidden; border-radius: 4px; position: relative; margin-bottom:32px;}
.sub-wrapper .point-list .item-img:after{content:""; display:block; width:100%; height:0; padding-bottom:47.79%;}
.sub-wrapper .point-list .item-img img{position: absolute; bottom:0; left:0; width: 100%; }
.sub-wrapper .point-list .err{position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); opacity: 0.5; white-space: nowrap;}
.sub-wrapper .point-list .ani .item-img img{opacity: 0; transform:translateY(50px); transition: all 0.6s;}
.sub-wrapper .point-list .ani .item-img img.on{opacity: 1; transform: translateY(0);}
.sub-wrapper .point-list .item-num{font-size:18px; color:#29D7B6; font-weight:700; letter-spacing: -0.04em; margin-bottom:10px; display:none;}
.sub-wrapper .point-list .item-title{font-size:20px; color:#888; font-weight: 500; line-height:1.4; letter-spacing: -0.05em; margin-bottom:8px;}
.sub-wrapper .point-list .item-title .emp{color:#000; font-weight:700; font-size:24px; display:block; margin-top:8px;}
.sub-wrapper .point-list .item-exp{font-size:20px; color:#888; font-weight:600; letter-spacing: -0.04em; line-height:1.4; }
.sub-wrapper .point-list .ani-btn{position: absolute; top:28px; left:28px; display:flex;}
.sub-wrapper .point-list .ani-btn .btn{display:flex; align-items:center; justify-content:center; background:#fff; color:#263446; border:1px solid #ddd; font-size:13px; padding:0; width:64px; height:32px; font-weight:700; margin-left:-1px}
.sub-wrapper .point-list .ani-btn .btn:first-child{border-radius: 4px 0 0 4px;}
.sub-wrapper .point-list .ani-btn .btn:last-child{border-radius: 0 4px 4px 0;}
.sub-wrapper .point-list .ani-btn .btn.on{background:#0068FF; color:#fff;}
.sub-wrapper .point-list .guide .ani-btn .btn{width:auto; padding:0 1em;}
.sub-wrapper .point-list .guide .ani .item-img img{transform:translateY(10px);}
.sub-wrapper .point-list.big .list-item{text-align: center;}
.sub-wrapper .point .arrow-wrapper{position: absolute; width:100%; left:0; top:calc(50% - 50px); transform: translateY(-50%); z-index: 5; display:flex; justify-content: space-between;}
.sub-wrapper .point .arrow-wrapper .sec-inner{display:flex; justify-content: space-between;}
.sub-wrapper .point .arrow-wrapper .nav-item{width:40px; height:40px; background:rgba(0,0,0,0.5); color:#fff; font-weight:400; font-size:24px; display:flex; align-items: center; justify-content: center; border-radius: 3px; opacity: 0.4; transition: opacity 0.2s;}
.sub-wrapper .point .arrow-wrapper .nav-item.prev{margin-left:-80px;}
.sub-wrapper .point .arrow-wrapper .nav-item.next{margin-right:-80px}
.sub-wrapper .point .arrow-wrapper .nav-item:hover{opacity: 1;}

.temp-page{min-height:800px; display:flex; align-items: center; justify-content: center; opacity: 0.5;}
.contact-top{margin-top:200px;}
.contact-top .contact-sub-title{color:#fff; letter-spacing: -0.04em; font-size:1.8rem; font-weight:800; margin-bottom: 1em; opacity: 0.6;}
.contact-form .col-wrapper:after{content:""; display:block; clear:both;}
.contact-form{display:flex; flex-wrap: wrap; margin:-70px -50px 200px 0}
.contact-form .form-item{margin-bottom:4rem; width:calc(50% - 50px); margin:70px 50px 0 0}
.contact-form .form-item.full{width:100%;}
.contact-form .form-item .item-label{color:#000; font-size:2rem; font-weight:700; margin-bottom:0.5rem; position: relative;}
.contact-form .form-item.nec .item-label:after{content:""; display:inline-block; width:5px; height:5px; border-radius: 50%; background:#29D7B6; vertical-align: text-top; margin-left:5px}
.contact-form .form-item .item-box{color:#000; height:7rem; border-bottom:2px solid #000;}
.contact-form .form-item.on .item-box{border-color:#29d7b6}
.contact-form .form-item input{color:#000; background:transparent; width:100%; height:100%;  font-size:1.8rem; font-weight:700; letter-spacing: -0.04em;}
.contact-form .form-item input::placeholder{color:#888; font-weight:500; font-size:1.8rem;}
.contact-form .form-item .item-box.textarea{border:2px solid #000; height:auto; margin-top:2.8rem;}
.contact-form .form-item .item-box.textarea textarea{background:transparent; resize:none; font-family: inherit; font-size:1.8rem; font-weight:500; letter-spacing: -0.04em; border:none; width:100%; height:19rem; padding:1.5em}
.contact-form .form-item .item-box.textarea textarea::placeholder{line-height: 1.5;}
.contact-form input:-webkit-autofill, 
.contact-form input:-webkit-autofill:hover, 
.contact-form input:-webkit-autofill:focus, 
.contact-form input:-webkit-autofill:active{-webkit-box-shadow:0 0 0 40px white inset !important; -webkit-text-fill-color:#000 !important;}
.contact-form .form-item .item-box.select{position: relative;}
.contact-form .form-item .item-box.select input{cursor: pointer;}
.contact-form .form-item .item-box.select:after{content:""; display:block; width:0; height:0; border-left:5px solid transparent; border-right:5px solid transparent; border-top:6px solid #000; position: absolute; right:4px; top:50%; transform: translateY(-50%);}
.contact-form .form-item .item-box label.error{display:block; color:red; margin-top:13px}
.contact-form .form-item.on .item-box.select:after{border-top-color: #29d7b6;}
.custom-select{display:none;}
.custom-select-option{position: absolute; left:0; top:calc(7rem - 2px); background:#fff; width:100%; box-shadow: 0 10px 10px rgba(50,50,50,0.2); border:3px solid #000; display:none; z-index:1} 
.custom-select-option li{line-height:6rem; padding:0 1.5em; cursor: pointer; font-size:1.8rem; font-weight:500}
.custom-select-option li:hover{background:rgba(41,215,182,0.6)}
.contact-form .contact-btn{background:#29d7b6; color:#fff; font-size:2rem; font-weight:700; width:19.2rem; height:5.8rem; border-radius: 9999px; display:flex; align-items: center; justify-content: center; margin:5rem auto 0; letter-spacing: -0.03em; transition: box-shadow 0.2s;}
.contact-form-wrapper .contact-top{border-bottom:5px solid #000; margin-bottom:60px; padding-bottom:50px}
.contact-form-wrapper .page-exp{display:flex; justify-content: space-between;}
.contact-form-wrapper .right{display:flex; flex-wrap: wrap; white-space: nowrap;}
.contact-form-wrapper .right .item{display:flex; align-items: center; gap:10px; position: relative; margin-right:24px; padding-right:24px;}
.contact-form-wrapper .right .item:last-child{padding-right:0; margin-right:0;}
.contact-form-wrapper .right .item:after{content:""; display:block; width:1px; height:18px; background:#eee; position: absolute; right:0; top:50%; margin-top:-9px}
.contact-form-wrapper .right .item:last-child:after{display:none;}
.contact-form-wrapper .right .icon{color:#29D7B6}

.sub-wrapper.service .page-top .sub-inner{padding:0}
.guide-wrapper{border-top:4px solid #000; margin-bottom: 100px;}
.guide-wrapper .guide-section{display:flex;}
.guide-wrapper .left{width:40rem; padding:8rem 2em 8rem 0;}
.guide-wrapper .left .sec-title{font-size:22px; font-weight:800; color:#000; letter-spacing: -0.05em;}
.guide-wrapper .right{width:calc(100% - 40rem); padding:8rem 0;}
.guide-wrapper .group-section + .group-section{margin-top:10rem;}
.guide-wrapper .group-title{font-size:22px; font-weight:700; color:#000; letter-spacing: -0.05em; margin-bottom:0.8em; letter-spacing: -0.05em;}
.guide-wrapper .group-content{font-size:18px; font-weight:500; color:#777; line-height: 1.4; letter-spacing: -0.04em; }

.sub-wrapper .ui-table{width: 100%; table-layout: fixed; font-size:16px; margin-top:30px; text-align: center;}
.sub-wrapper .ui-table th{border:1px solid #eee; padding:10px 10px; color:#000; background:#f8f9fa; height:50px;}
.sub-wrapper .ui-table td{border:1px solid #eee; padding:10px 10px; color:#777; height:50px}
.sub-wrapper .ui-table td.left{text-align: left;}
.sub-wrapper .ui-table .check-icon{color:#29D7B6; font-weight:500; font-size:28px;}
.price-box{display:flex; align-items: center; justify-content: space-between; border:1px solid #eee; padding:2em 2em; margin-top:30px;}
.price-box .title{font-weight:700; color:#000; letter-spacing: -0.06em;}
.price-box .price{font-weight:700; color:#000; letter-spacing: -0.06em; text-align:right;}
.price-box .unit{display:block; text-align: right; font-size:14px; opacity: 0.5;}

.down-section{display:flex; justify-content: space-between; align-items: center; padding:7rem 0;}
.down-section:last-child{border-bottom:4px solid #000; margin-bottom:200px}
.down-section + .down-section{border-top:1px solid #888}
.down-section .title{font-size:26px; font-weight:700; color:#000; letter-spacing: -0.03em; margin-bottom:0.3em;}
.down-section .sub-title{font-size:18px; color:#777; font-weight:500; letter-spacing: -0.06em;}
.down-section .down-btn{width:274px; height:64px; padding:0 26px 0 30px; border:2px solid #000; display:flex; justify-content: space-between; align-items: center; font-size:18px; font-weight:700; letter-spacing: -0.04em; transition: background 0.2s;}
.down-section .down-btn .icon{font-size:24px; font-weight:400}
.down-section .down-btn:hover{background:#000; color:#fff}

.about-page .page-top .page-exp .gradient-text{font-size:2.8rem; letter-spacing: -0.06em;}
.about-page .page-top .page-exp .gradient-text br{display:none}
.about-page .page-top .page-exp p{margin-top:1em;}
.about-page .page-top.alone{margin-bottom:80px;}
.marina-map{text-align: center; padding:0 20px;}
.marina-map svg{max-width:80%;}
.marina-map #circles g{opacity: 0;}
.marina-map path{fill:none;}
.marina-map #circles g.ani circle:nth-child(1){animation: heartbit1 0.5s 0.4s  infinite linear alternate;}
.marina-map #circles g.ani circle:nth-child(2){animation: heartbit1 0.5s 0.2s infinite linear alternate;}
.marina-map #circles g.ani circle:nth-child(3){animation: heartbit2 0.5s infinite linear alternate;}
@keyframes heartbit1 {
	from {
		opacity:0.2
	}
	
	to {
		opacity:0.4
	}
}
@keyframes heartbit2 {
	from {
		opacity:0.2
	}
	
	to {
		opacity:0.8
	}
}
.about-page .marina-map .txt-ment{text-align:center; margin-top:7rem}
.about-page .marina-map .txt-ment .line{width:100%; height:6.2rem; position: relative; overflow: hidden; }
.about-page .marina-map .txt-ment span{display:inline-block; text-align: center; color:#000; font-size:5rem; line-height:6.2rem; font-weight: 700; letter-spacing: -0.03em; transform-origin: left bottom;}
#app.black .about-page .marina-map .txt-ment span{color:#fff}
.brand-logo{font-size:110px; font-weight:800; letter-spacing: -0.05em; margin:300px 0 300px; background:url(../img/brand/x.svg) no-repeat center; white-space: nowrap}
.brand-logo .left{color:#fff; -webkit-text-fill-color: #fff; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: #000; position: relative; left:100px}
.brand-logo .right{text-align: right; color:#000; position: relative; right:180px;}
.brand-culture{padding-bottom:100px;}
.brand-culture .sub-inner{position: relative;}
.brand-culture .item{color:#000; margin-bottom:24rem; position: relative; z-index: 1;}

.brand-culture .item:nth-child(2n){text-align: right;}
.brand-culture .item .item-title{font-size:4rem; color:#000; font-weight:700; letter-spacing: -0.04em; margin-bottom:0.8em;}
.brand-culture .item .item-exp{font-size:2.4rem; color:#aaa; letter-spacing: -0.04em; line-height: 1.4;}
.brand-culture .pic-wrapper{position: absolute; top:0; left:0; width: 100%;}
.brand-culture .pic-wrapper .pic-item{width:50%; aspect-ratio: 16/9;margin-left:auto;}
.brand-culture .pic-wrapper .pic-item + .pic-item{margin-top:180px;}
.brand-culture .pic-wrapper .pic-item:nth-child(2n){margin-left:0; margin-right:auto; width:64%; aspect-ratio: 3/2;}
.brand-culture .pic-wrapper .pic-item img{object-fit: cover; width:100%; height:100%;}

.brand-cooperation{padding-top:100px; margin-bottom:140px}
.brand-cooperation .big-title{font-size:4rem; color:#000; font-weight: 700; margin-bottom:100px; letter-spacing: -0.05em; line-height: 1.4;}
.brand-cooperation .big-title .emp{font-size:2.4rem; color:#29D7B6; margin-bottom:0.4em;}
.brand-cooperation .img-slide{overflow: visible;}
.brand-cooperation .img-slide .img-item{border:1px solid #eee; width:470px; height:290px;}
.brand-cooperation .img-slide .img-item img{object-fit: cover; width:100%; height:100%;}
.brand-cooperation  .swiper-wrapper{-webkit-transition-timing-function:linear !important; -o-transition-timing-function:linear !important; transition-timing-function:linear !important;}
.brand-cooperation .big-title.center{text-align: center;}
.brand-cooperation .big-title span{color:#29D7B6;}
.brand-cooperation.company{margin-bottom:300px;}

/*white*/
.black .sub-wrapper .page-title{color:#fff}
.black .sub-wrapper .page-exp{color:#aaa}
.black .brand-logo .left{-webkit-text-fill-color: transparent;  -webkit-text-stroke-color: #fff;}
.brand-logo .right{color:#fff}
.black .brand-culture .item .item-title{color:#fff;}
.black .brand-culture .item{color:#fff;}
.black .brand-culture .item-exp{color:#aaa;}

.guide-sec-02{overflow: hidden;}
.sub-wrapper.service .page-top{margin-bottom:0;}
.sub-wrapper.service .page-top .page-exp{padding-bottom: 100px; border-bottom:4px solid #000}
.sub-wrapper.service .page-top.point .page-exp{border:none;}
.guide-step-wrapper{padding:13rem 0 0; display:flex; margin-bottom:20rem;}
.guide-step-wrapper .left{width:47.8rem; padding-left:7rem; z-index: 99;}
.guide-step-wrapper .right{width:calc(100% - 47.8rem); padding-left:8rem; }
.guide-step-wrapper .right .step-list{ padding-bottom:4rem; }
.guide-step-wrapper .app-screen{position: relative;}
.guide-step-wrapper .app-screen .frame{z-index: 2;}
.guide-step-wrapper .app-screen .frame, .guide-step-wrapper .app-screen .screen{position: absolute; left:0; top:0;}
.guide-step-wrapper .app-screen img{width:38.1rem; height:auto;}
.guide-step-wrapper .app-screen .screen img{position: absolute; left:0; top:0; opacity: 0; transition: opacity 0.2s;}
.guide-step-wrapper .app-screen .screen img.on{opacity: 1; z-index: 1;}
.guide-step-wrapper .step-item{cursor: pointer;}
.guide-step-wrapper .step-img{display:none;}
.use-list{display:flex; flex-wrap: wrap; justify-content: space-between; margin-bottom:6rem;}
.use-list li{width:calc(50% - 0.8rem); margin-bottom:12rem;}
.use-list.info-list .img-frame{padding:0; height:auto; overflow:hidden}
.step-list .step-item{padding:8rem 3rem; position: relative; cursor: pointer; opacity: 0.3; background:#eee; transition: all 0.2s; border-radius: 8px;}
.step-list .step-item.on{opacity: 1; background:#fff;box-shadow: 0 0 20px rgb(0 0 0 / 10%);}
.step-list .step-item + .step-item{margin-top: 10px;}
.step-list .step-title{font-size:3.6rem; color:#000; font-weight:800; margin-bottom:0.8em;}
.step-list .step-title .txt{position: relative; display: inline-block;}
.step-list .step-title i{position: relative; z-index: 1;}
.step-list .step-item.on .step-title .txt:after{content:""; display:block; width:100%; height:40%; background:hsl(169, 69%, 50%, 0.6); transition: width 0.8s; position: absolute; bottom:0; left:0 ; }
.step-list .step-title .num{vertical-align: top; padding-left:0.2em; font-size:1.8rem; font-weight:400;}
.step-list .step-desc{font-weight:500; font-size:2rem; color:#888; line-height:1.45; letter-spacing: -0.03em;}
.step-list .step-desc .step-alert{color:#d0a36a; font-size:1.6rem; font-weight:500; padding-top:1em;}
.step-list .can-thumb{max-width:42rem; position: absolute; right:0; top:-30%; opacity: 0; visibility: hidden;z-index: 1; overflow:hidden;}
.step-list .step-item{padding-bottom:140px}
.step-list .step-item:last-child{margin-bottom:40vh}
@media screen and (min-width:1921px){
	.step-list .step-item{padding-bottom:200px}
	.step-list .step-item:last-child{margin-bottom:250px}
}
@media screen and (min-width:2400px){
	.step-list .step-item{padding-bottom:220px}
	.step-list .step-item:last-child{margin-bottom:100px}
}
@media screen and (min-width:2560px){
	.step-list .step-item:last-child{margin-bottom:150px}
}
.sub-wrapper.service .video-wrapper{display:flex; align-items:center; justify-content:center;  height:80vh; min-height:800px; max-height:1000px; position:relative; background:#000; margin-bottom:160px;}
.sub-wrapper.service .video-wrapper:after{content:""; display:block; background:url(../img/main_renewal/movie-poster2.jpg) no-repeat center; background-size:cover; opacity: 0.2; position: absolute; top:0; right:0; bottom:0; left:0;}
.sub-wrapper.service .video-frame{max-width:1000px; aspect-ratio:16/9; border-radius:8px; overflow:hidden; position:relative; z-index:1}
.sub-wrapper.service video{width:100%; height:100%; object-fit: cover;}
.sub-wrapper.service .poster{position: absolute;  left:0; top:0; bottom:0; right:0; width:100%; height:100%; object-fit: cover; z-index: 9;}
.sub-wrapper.service .poster img{width:100%; height:100%; object-fit: cover; }
.sub-wrapper.service .play-btn{position: absolute; left:50%; top:50%; transform: translate(-50%, -50%); background:url(../img/main_renewal/play-btn.png) no-repeat center / 100% auto; width:178px; height:178px; z-index: 10;}

.sub-nav .nav-inner{display:flex; align-items: center; justify-content: center; margin:-20px 0 100px -80px;}
.sub-nav .nav-item{font-size:20px; color:#888; letter-spacing: -0.05em; margin:20px 0 0 80px; position: relative; transition: color 0.2s;}
.sub-nav .nav-item:before{content:""; display:block; width:6px; height:6px; border-radius: 50% 50%; background:#29D7B6; position: absolute; left:50%; top:-20px; transform: translateX(-50%); opacity: 0; transition: opacity 0.2s;}
.sub-nav .nav-item + .nav-item:after{content:""; display:block; width:1px; height:20px; background:#ddd; position: absolute; left:-40px; top:50%; transform: translateY(-50%);}
.sub-nav.fixed{position: fixed; width:100%; height:50px; background:#fff; border-bottom:1px solid #eee; top:100px; left:0; right:0; z-index: 99; display:none;}
.sub-nav.fixed .nav-inner{margin:0; height:100%;}
.sub-nav.fixed .nav-item:before{display:none;}
.sub-nav.fixed .nav-item{margin:0 40px; font-size:16px;}
.sub-nav.fixed .nav-item.active{color:#000; font-weight:700;}
.sub-nav.fixed .nav-item.active:before{display:block;width:100%;height:3px;top:auto;bottom: -16px;border-radius: 0;opacity: 1;}
.sub-nav .nav-item + .nav-item:after{height:14px}

.sub-wrapper.contact .contact-wrapper .contact-sub-title,
.sub-wrapper.contact .contact-wrapper .cmm-title,
.sub-wrapper.contact .contact-wrapper .cmm-title-sub,
.sub-wrapper.contact .contact-wrapper .contact-btn,
.sub-wrapper.contact .contact-wrapper .contact-img{opacity: 0;}

.term-wrapper{padding:4rem 0 10rem;}
.term-wrapper .term-title{font-size:2.4rem; font-weight:700; color:#222; margin-bottom:0.8em; padding-bottom:0.8em; border-bottom:1px solid #eee;}
.term-item{margin-bottom:2em}
.term-item .item-title{font-weight:700; color:#000; margin-bottom:0.7em; line-height:1.3}
.term-item .item-content{line-height: 1.3; color:#555}
.term-item .item-content > ul{margin:0.5em 0 1em;}
.term-item .item-content > ul > li + li{margin-top: 3px;}
.term-item .item-content > ul > li > ul{padding-left:1em; margin:0.5em 0 1em; }
.term-item .item-content + .item-content{margin-top: 1em;}
.term-item .item-content .ct-title{color:#000; font-weight:700; margin-bottom:0.4em}
.term-item .item-content .name-card{border:1px solid #ddd; padding:1.2em 1.4em; margin-top:16px;}
.term-item .item-content .name-card .card-item{font-weight: 700; color:#000}
.term-item .item-content .name-card .card-item + .card-item{margin-top:6px}

.contact-preview{max-width:768px;margin:0 auto 20px;border:1px solid #eee;border-radius:4px;padding:4em 3em 3em;text-align:center}
.contact-preview .title{font-weight:700;color:#000;margin-bottom:10px;font-size: 20px;letter-spacing: -0.05em;}
.contact-preview .date{color:#888;margin-bottom:4px}
.contact-preview .content{color:#555;margin-bottom:10px;line-height: 1.6;text-align: left;border-top: 1px solid #eee;padding-top: 20px;margin-top: 20px;}
.contact-preview .content div + div{margin-top:10px}
.go-back{text-align:center;width:100px;background:#000;color:#fff;line-height:48px;display:block;margin:0 auto 100px}
.go-back:hover{color:#fff;}

br.mo{display:none}

@media screen and (min-width:1201px){
	.sub-nav .nav-item:hover{color:#000; font-weight:700;}
	.sub-nav .nav-item:hover:before{opacity: 1;}
}
@media screen and (max-width:1200px){
	.sub #header{height:76px;}
	.sub #header.sub_on{height:76px; padding:12px 0}
	.sub-nav.fixed{top:76px;}
	.sub-nav.fixed .nav-item{font-size:14px}
	

	.page-top.alone{margin-top:140px}
	.sub-wrapper .page-title{font-size:2.4rem;}
	.sub-wrapper .page-exp{font-size:1.8rem;}

	.sub-wrapper.service .page-top .page-exp{ padding-bottom: 50px;}
	.guide-step-wrapper{padding:4rem 0 0}
	.step-list .step-item{cursor: auto; opacity:1 !important; background:#fff !important; box-shadow: 0 0 20px rgb(0 0 0 / 10%);}
	.step-list .step-content{padding-right:4em; max-width:560px}
	.step-list .step-title{font-size:2.2rem;}
	.step-list .step-desc{font-size:1.6rem;}
	.step-list .step-item:last-child{margin-bottom:0}

	.sub-wrapper .m-sec.contact{min-height:0;}
	.sub-wrapper .contact-wrapper{margin:0;}
	.sub-wrapper .contact-top{margin:20px;}

	.sub-wrapper .sub-section.point .swiper-container{overflow: visible;}

	.contact-form-wrapper{margin-top:10rem;} .sub-wrapper.contact .contact 
	.sec-inner{padding-top: 120px;} .sub-wrapper .contact-form-wrapper 
	.contact-top{margin:0 0 5rem 0;} 

	.about-page .marina-map .txt-ment{margin-top:4rem;}
	.about-page .marina-map .txt-ment .line{height:3.4rem; }
	.about-page .marina-map .txt-ment span{font-size:3rem; line-height:3.4rem; }
}

@media screen and (max-width:1024px){
	.page-top.alone.term{margin-bottom:40px;}
	.sub-nav.page .nav-item{font-size:16px;}

	.guide-step-wrapper{padding-bottom:0; margin-bottom:10rem;}
	.guide-step-wrapper .left{display:none;}
	.guide-step-wrapper .right{width:100%; padding:0}
	.guide-step-wrapper .right .step-list{padding:0}
	.guide-step-wrapper .step-item:last-child{border-bottom:1px solid #eee;}
	.guide-step-wrapper .step-item{display:flex; justify-content: space-between; padding-bottom:0; margin-top:-1px;}
	.guide-step-wrapper .step-img{display:block; width:30vw; height:0; padding-bottom:50%; min-width:28rem; overflow: hidden; border-radius: 8px 8px 0 0; margin-right:2rem; position: relative;}
	.guide-step-wrapper .step-img:after{content:""; display:block; width:100%; height:100%; background:url('../img/guide/step-screen.png') no-repeat center top / 100% auto; position:absolute; left:0; top:0; z-index: 1;}
	.guide-step-wrapper .step-img img{width: 100%;}

	.sub-wrapper.service .video-wrapper{background:#fff; padding:0 20px; min-height:0; height: auto;}
	.sub-wrapper.service .video-wrapper:after{display:none;}

	.sub-wrapper .point-list .item-title{font-size:18px;}
	.sub-wrapper .point-list .item-title .emp{font-size:20px}

	.guide-wrapper .guide-section{display:block;}
	.guide-wrapper .left{width:100%; padding:6rem 0 0 0;}
	.guide-wrapper .right{width:100%; padding-top:4rem;}
	.guide-wrapper .group-section + .group-section{margin-top: 5rem;}
	.guide-wrapper .group-title{font-size:1.8rem;}
	.guide-wrapper .group-content{font-size:1.6rem;}

	.sub-wrapper .page-exp{display:block;}
	.sub-wrapper .contact-form-wrapper .contact-top{padding-bottom:2rem;}
	.contact-form-wrapper .right{margin-top:30px; display:block;}
	.contact-form-wrapper .right .item{margin:0 0 12px 0;}
	.contact-form-wrapper .right .item:after{display:none;}
	.contact-form .form-item{width:100%;}

	.brand-logo{font-size:80px; margin:150px 0 150px; }
	.brand-logo .right{transform: none !important; right:auto; text-align: center;}
	.brand-logo .left{transform: none !important; left:auto; text-align: center;}

	.brand-culture .item .item-title{font-size:2.8rem;}
	.brand-culture .item .item-exp{font-size:2rem;}
	.brand-culture .item:nth-child(3){margin-bottom:0;}

	.brand-cooperation .big-title{font-size:2.4rem; margin-bottom: 2em;}
	.brand-cooperation{margin-bottom:10rem;}
	.brand-cooperation.company{margin-bottom:10rem;}
}

@media screen and (max-width:768px){
	.sub-nav.fixed{bottom: 20px;left: 10px;top:auto;right: auto;height: auto;background: #fff; padding:14px; border-radius:5px; box-shadow:0 0 10px rgba(0,0,0,0.2); width: auto;white-space: nowrap; display:none !important;}
	.sub-nav.fixed:before{content:"주요기능"; display:block; border-bottom:1px solid #eee; font-size:14px; font-weight:700; padding-bottom:10px; margin-bottom:10px;}
	.sub-nav.fixed .nav-inner{display:block;}
	.sub-nav.fixed .nav-item{display:block;margin: 0;}
	.sub-nav.fixed .nav-item + .nav-item{margin-top:10px;}
	.sub-nav.fixed .nav-item.active:before{display:none;}

	.sub-nav.page{max-width:360px; margin:0 auto 100px;}
	.sub-nav.page .nav-inner{margin:0; flex-wrap: wrap; gap:16px}
	.sub-nav.page .nav-item{margin:0; width:calc(50% - 16px); text-align: center;}
	.sub-nav.page  .nav-item + .nav-item:after{display:none;}

	.guide-step-wrapper .step-item{display:block; padding-bottom:1.4rem;}
	.guide-step-wrapper .step-item:first-child{padding-top:6rem;}
	.guide-step-wrapper .step-item + .step-item{padding-top:6rem;}
	.guide-step-wrapper .step-img{margin:60px auto 20px; height:auto; padding:0;}
	.sub-wrapper .sub-section.point{margin-bottom:100px}
	.sub-wrapper .sec-service + .sec-service{margin-top:0}	

	.sub-wrapper .point-list .item-title{font-size:16px;}
	.sub-wrapper .point-list .item-title .emp{font-size:18px; margin-top:3px;}

	.step-list .step-title{font-size:1.8rem;}
	.step-list .step-desc{font-size:1.5rem;}

	.down-section{display:block;}
	.down-section .down-title{margin-bottom:4rem;}
	.down-section .down-btn{width:100%;}

	.contact-form{margin:0 0 5rem 0}
	.contact-form .form-item{margin:0 0 5rem 0}
	.contact-form .form-item .item-label{font-size:1.8rem;}
	.contact-form .form-item .item-box{height:6rem; }
	.contact-form .contact-btn{margin-top:0; font-size:1.8rem; width: 16rem; height:5rem;}
	.contact-form .form-item .item-box.textarea textarea{font-size:1.6rem;}

	.marina-map svg{object-fit: cover;width: 100%;height: 100%;}
	.about-page .page-top .page-exp .gradient-text br{display:block}
	.brand-logo{font-size:12vw}
	.brand-culture .item .item-title{font-size:2.2rem;}
	.brand-culture .item .item-exp{font-size:1.8rem;}
	.brand-cooperation .img-slide .img-item{width:320px; height:180px;}
}

@media screen and (max-width:540px){
	br.mo{display:block}
}