/* 서브메뉴 CSS */
.sub-menu-box{display: flex;justify-content: center;width : 100%; position : relative; z-index: 1; height: 50px;z-index : 10; border-bottom : 1px solid rgba(0,0,0,0.05)}
.sub-menu-inner{display: flex; align-items : center;justify-content : end; max-width: 1200px; width : 100%;}
.sub-menu{display:flex;align-items:center;min-width:200px;position:relative;font-size: 14px;letter-spacing: -0.04em;height:50px;padding:0 15px;color:#111;cursor:pointer}
.sub-menu:not(:last-child)::before{position:absolute;content:'';width:1px;height:15px;background:#aaa;right:0;}
.sub-menu.point{color: #02003C; font-weight : 700;}
.sub-menu.disable{pointer-events: none;color : #aaa}
.sub-menu::after{position: absolute;content:'';width:7px;height:7px;border-top:1px solid #555;border-right:1px solid #555;transform: rotate(45deg);right:15px;transition:transform .2s;}
.sub-menu:hover::after{transform: rotate(135deg)}
.sub-menu.disable::after{border-color:#aaa;}
.sub-menu>ul{position: absolute;top:100%;left:0;min-width:100%;border:1px solid #ccc;border-bottom:none;border-top:none;display : none; font-weight : 400; color : #000}
.sub-menu:hover>ul{display:block;}
.sub-menu>ul>li>a{display:flex;flex-direction:column;justify-content:center;height:40px;background:#fff;border-bottom:1px solid #ccc;padding:0 15px;font-size:14px;transition:padding-left .2s;position:relative;overflow:hidden; white-space: nowrap;}
.sub-menu>ul>li>a::after{position:absolute;content:'';width:5px;height:5px;border-top:1px solid #555;border-right:1px solid #555;transform: rotate(45deg);left:0px;opacity:0;transition:opacity .2s,left .2s;}
.sub-menu>ul>li>a:hover::after{left:10px;opacity:1;}
.sub-menu>ul>li.long>a{height:55px;}
.sub-menu>ul>li>a:hover{padding-left:25px;font-weight:500}
.sub-menu>ul>li:nth-child(1)>a{border-top:1px solid #ccc}
.sub-menu>ul>li>a:hover{background:#f1f1f1}

.sub-menu>ul>li>a > br{display: none;}

.sub-title-box{display: flex;flex-direction : column;justify-content: center;align-items: center;position : relative;height : 343px;overflow: hidden;padding-top: 50px;}
@keyframes sub-title-line {
	100%{clip-path: inset(0);}
}

.sub-title-bg{width : 100%;height : 100%; background: url(../images/sub/sub-tit-bg.png)no-repeat center / cover;position : absolute; left : 0;top : 0;z-index : -1; animation : sub-title-bg 3s both;}
@keyframes sub-title-bg{
	0%{transform : scale(1.25)}
}

.sub-title{font-family: jost; font-weight: 500; font-size: 40px;letter-spacing: 0em; margin-bottom: 8px; text-align : center;animation : sub-title 1s both 1s;}
@keyframes sub-title{
	100%{letter-spacing : 0.3em; padding-left: 0.3em;}
}
.sub-title .char{opacity: 0;}

.sub-title-kor{font-family: GG; font-weight: 400; font-size: 20px;letter-spacing: 0em; text-align : center;}
.sub-title-kor .char{opacity: 0;}

#wrap.sub{width : 100%;}

.sub-content-box{padding : 66px 0 192px; margin : 0 auto; position: relative;z-index: 0;}
.sub-content-img{margin : 0 auto;}

.motion-box{position : relative; background: pink;}
.motion-hover{position : absolute;width : 37.7%; height : 74%; z-index : 1;right : 0;top : 0;}

.unit-btn-box{display : flex;margin-bottom: 2em;border-top : 1px solid #C2D7E9;border-bottom : 1px solid #C2D7E9; max-width : 1200px; margin : 0 auto 2em;}
.unit-btn-box > a{display : flex;align-items : center; justify-content : space-between; flex : 1;padding : 0 20px;height : 44px;font-size : 15px; font-weight : 500;letter-spacing : -0.04em;transition : background .3s, color .3s;border-right : 1px solid #C2D7E9}
.unit-btn-box > a.on,
.unit-btn-box > a:hover{background: #C2D7E9;}
.unit-btn-box > a.on > img,
.unit-btn-box > a:hover > img{/* filter : brightness(100) */}

.sub-content-box{padding : 66px 0 192px; margin : 0 auto;}
.sub-content-img{margin : 0 auto;}
/* 오리발 CSS */
.page_info{display:flex;flex-direction:column;justify-content:center;max-width : 1200px;margin : 4em auto 0;background:#f7f7f7;border:1px solid #e5e5e5;padding:25px 60px 25px 120px;min-height :120px;font-size:13px;letter-spacing:-0.04em;color:#777;position:relative;}
.page_info::after{display: flex;align-items: center;justify-content: center;color : #fff;font-size: 36px;font-weight: 700;content : '!';position : absolute;width : 70px;height : 70px;border-radius: 50%;background : #ddd;left : 25px;top : 50%;transform: translateY(-50%);}
.page_info>li{position : relative;padding-left : 14px;}
.page_info>li+li{margin-top : 3px;}
.page_info>li::before{content : '※ ';position : absolute;left : 0;font-size: 11px;line-height: 18px;}
.page_info>li>a{color:rgba(50,80,255,1);text-decoration:underline;}
/* 오리발 CSS END */

.motion-box{position : relative; background: pink;}
.motion-hover{position : absolute;width : 37.7%; height : 74%; z-index : 1;right : 0;top : 0;}

.customer-container{display: flex;flex-direction: column; padding : 40px 44px 50px; background: #fff; position : absolute;z-index: 10000;top : 0; width : 100%; max-width: calc(100% - 760px); top : 80px; right : 54px; bottom : 54px; border-radius: 24px; font-family: PT; letter-spacing: -0.04em; transform: translateX(150%); opacity: 0; transition : 0s 1.4s;}
.active .customer-container{transform: translateX(0); opacity: 1; transition : 2s 2s;}

.customer-cont-tit-box{display: flex;align-items: end; margin-bottom: 30px;}
.customer-cont-tit{font-family: jost; font-size: 57px; font-weight: 500; margin-right: 28px; line-height: 1em;}
.customer-cont-desc{display: flex;align-items: center; font-family: PT; letter-spacing: -0.04em; font-weight: 500; color : #313131; position : relative; padding-left: 28px;line-height: 2em; font-size: 18px;}
.customer-cont-desc::after{position : absolute; content: ''; width : 1px; height : 19px; background: #696969; left : 0;}

/* .customer-cont-inner{overflow-y : scroll;padding-right: 30px; height : 100%;} */

.customer-drop{border : 1px solid #ddd;}
.customer-drop-tit{display: flex;align-items: center; background: #EFEFEF; padding : 11px 19px; color : #313131; font-size: 22px; font-weight: 500; border-bottom : 1px solid #ddd; position : relative; cursor : pointer;}
.customer-drop-tit::after{position : absolute; content : ''; width : 13px;height : 13px; border-top :1px solid #707070; border-right : 1px solid #707070; transform: rotate(-45deg); right : 36px; transition : .5s;margin-top: 10px;}
.fold .customer-drop-tit::after{transform: rotate(135deg); margin-top: 0;}

.customer-drop-con{padding : 0px 0 0 18px;}
.customer-textarea{resize: none; width : 100%; height : 344px; overflow-y : scroll; font-size: 14px; font-weight: 500; color : #6E6E6E; line-height: 2em; padding : 30px 0;}
.customer-textarea b{color : #000}

/**/

.customer-radio{display: flex; justify-content: space-between; align-items: center; padding : 20px 0; border-bottom : 1px solid #ddd}
.customer-radio-desc{font-size: 15px; font-weight: 500; line-height: 1.5em; color : #6E6E6E;}
.customer-radio-btn-box{display: flex; gap : 24px}
.customer-radio-btn-box > label{display: flex;align-items: center;gap : 6px; font-size: 18px; font-weight: 500; color : #313131; cursor : pointer}

.customer-radio-btn-box input[type="radio"]{accent-color:#000; width : 18px;height : 18px;}

.customer-drop-02{margin-bottom: 30px;}
.customer-drop-02 .customer-drop-con{padding : 30px 18px; color :#6E6E6E; font-size: 15px;}
.customer-table{border-collapse: collapse; width : 100%; border-top : 2px solid #000; margin : 20px 0 0; color : #000;}
.customer-table td,
.customer-table th{border : 1px solid #ddd; width : 33.3333%;}
.customer-table th{background: #f9f9f9; font-weight: 700; color : #000; padding : 16px 0;}
.customer-table td{padding : 20px 0 11px; text-align: center;}

/**/
.customer-comment{line-height: 1.5em; font-size: 15px; letter-spacing: -0.04em; font-weight: 500; background: #E2E3E4; padding : 26px 0; text-align: center; margin-bottom: 38px;}
.customer-comment.color{background: #EEE6DF;}

.customer-survey{margin-bottom: 30px;}
.customer-survey-q{margin-bottom: 16px; font-size: 15px; font-weight: 500;}
.customer-survey-list{display: grid;grid-template-columns: repeat(4, 1fr); font-size: 15px; font-weight: 400;}
.customer-survey-list label{display: flex; align-items: center;gap : 7px; cursor: pointer;}
.customer-survey input[type="radio"],
.customer-survey input[type="checkbox"]{display: flex;align-items: center;justify-content: center; appearance:none;-webkit-appearance:none;width:18px;height:18px;border:1px solid #707070;border-radius: 0;cursor:pointer; position : relative;}

.customer-survey input[type="radio"]::after,
.customer-survey input[type="checkbox"]::after{position : absolute; content : ''; transform: scale(0.6); background: #000; opacity: 0; width : 100%;height : 100%;}

.customer-survey input[type="radio"]:checked::after,
.customer-survey input[type="checkbox"]:checked::after{opacity: 1;}

.customer-survey-list.list{border-top : 1px solid #ddd; grid-template-columns: repeat(1, 1fr)}
.customer-survey-list.list > li{padding : 0 33px; height : 43px;}
.customer-survey-list.list > li{border-bottom : 1px solid #ddd;}
.customer-survey-list.list label{display: flex; gap : 0; height : 100%;}
.customer-survey-list.list input[type="radio"],
.customer-survey-list.list input[type="checkbox"]{margin-right: 33px;}
.customer-survey-list.list label > span{padding : 12px 0; width : 295px; text-align: center; flex-shrink: 0; border-left : 1px solid #ddd; background: #F9F9F9;}
.customer-survey-list.list label > div{padding: 12px 13px; flex : 1; border-left : 1px solid #ddd;height : 100%;}
.customer-survey-list.list .etc label > div{padding: 10px 13px;}
.customer-survey-list.list label > div > input[type="text"]{border : 1px solid #ddd; flex : 1;height : 100%; width : 100%;}

/**/
.customer-info{color : #6E6E6E; margin-bottom: 30px; font-weight: 500; letter-spacing: -0.04em; font-weight: 15px; line-height: 1.25em;}

/**/
.customer-data{border-collapse: collapse; width : 100%; margin-bottom: 16px;}

.customer-data th{padding : 18px 0; width : 220px;}
.customer-data th.customer-data-tit{background: #EFEFEF; padding : 11px 19px; font-size: 22px; font-weight: 500;color : #313131; text-align: left; width : auto; background: #F9F9F9;}

.customer-data td,
.customer-data th{border : 1px solid #ddd;}
.customer-data th{background: #F9F9F9; font-weight: 400;}

.customer-data td{padding : 10px 16px; height : 50px;}
.customer-data td > input[type="text"]{border : none; width : 100%; height : 100%;}

.customer-data .customer-survey-list{grid-template-columns: repeat(6, 1fr); padding-left: 30px;}

.customer-data input[type="radio"],
.customer-data input[type="checkbox"]{display: flex;align-items: center;justify-content: center; appearance:none;-webkit-appearance:none;width:18px;height:18px;border:1px solid #707070;border-radius: 0;cursor:pointer; position : relative;}

.customer-data input[type="radio"]::after,
.customer-data input[type="checkbox"]::after{position : absolute; content : ''; transform: scale(0.6); background: #000; opacity: 0; width : 100%;height : 100%;}

.customer-data input[type="radio"]:checked::after,
.customer-data input[type="checkbox"]:checked::after{opacity: 1;}

.customer-submit{display: block; width : 210px; height : 63px; color : #fff; font-family: PT; letter-spacing: -0.04em; background: #0E033B; font-weight: 500; font-size: 18px; border : none; outline: none; cursor : pointer; margin : 0 auto;}

.customer-close{display: flex;align-items: center;justify-content: center; width : 66px; height : 66px; border-radius: 50%; background: #000; position : absolute; right : 16px; top : 22px;}
.customer-close::after{position: absolute; content : ''; width : 1px;height : 26px; background: #fff;transform: rotate(45deg);}
.customer-close::before{position: absolute; content : ''; width : 1px;height : 26px; background: #fff; transform: rotate(-45deg);}

/**/

.contact-bg{position : absolute; left : 100%; transform: translateX(-100%); bottom : 0; width : 100%; height : 100%; overflow: hidden; transition : 1.4s;}
.contact-bg > img{width : 100%;height : 100%; object-fit: cover; object-position: center; transform: scale(1.5); transition : 3s;}
.fp-active .contact-bg > img{ transform: scale(1);}

.contact-tit-box{text-align : center; margin-bottom: 55px;}
.contact-tit{font-family : athena; font-size : 67px; font-weight : 400; margin-bottom: 29px; color : #B49480;}
.contact-tit .char{opacity : 0; transform : translateY(50px); transition : 1s;}
.fp-active .contact-tit .char{opacity : 1; transform : translateY(0)}
.fp-active .contact-tit .char:nth-child(1){transition-delay : .4s;}
.fp-active .contact-tit .char:nth-child(2){transition-delay : .5s;}
.fp-active .contact-tit .char:nth-child(3){transition-delay : .6s;}
.fp-active .contact-tit .char:nth-child(4){transition-delay : .7s;}
.fp-active .contact-tit .char:nth-child(5){transition-delay : .8s;}
.fp-active .contact-tit .char:nth-child(6){transition-delay : .9s;}
.fp-active .contact-tit .char:nth-child(7){transition-delay : 1s;}
.fp-active .contact-tit .char:nth-child(8){transition-delay : 1.1s;}

.contact-desc{padding : 12px 35px; font-size : 18px; font-family : pt; color : #fff; letter-spacing : -0.04em; border-top : 1px solid rgba(255,255,255,0.2); border-bottom : 1px solid rgba(255,255,255,0.2); opacity : 0; transform : translateY(50px); transition : 1.2s;}
.fp-active .contact-desc{transform : translateY(0); opacity : 1; transition : 1.2s .4s;}
.contact-inner{display : flex; flex-direction : column; align-items : center; position : relative;}
.contact-container{display : flex; gap : 43px;}

.contact-container > div{opacity : 0; transition : 1.2s;}
.contact-map-box:nth-child(1){transform : translateX(-100px);}
.contact-map-box:nth-child(2){transform : translateX(100px);}
.fp-active .contact-container > div{opacity : 1; transform : translateX(0); transition : 1.2s 1s;}

.contact-map{margin-bottom: 40px;}
.contact-address-box{display : flex; justify-content : space-between; align-items: center;}
.contact-address{display : flex; flex-direction : column; color : #fff; font-size : 16px; letter-spacing : -0.04em; font-weight : 500; }
.contact-address b{font-size : 25px; color : #B49480; margin-bottom: 5px; font-weight : 500;}
.contact-btn-box{display : flex;gap : 4px;}


@media(max-width : 1200px){
	#wrap{overflow : hidden;}
	.sub-title-box{margin-top: 0;height : 250px; padding-top: 50px;}
	.sub-title{font-size: 24px;}
	.sub-title-kor{font-size : 16px}

	/* 서브메뉴 CSS */
	.sub-menu-box{height: 40px;}
	.sub-menu{min-width:150px;position:relative;font-size: 12px;height:40px;padding:0 10px;}
	.sub-menu:not(:last-child)::before{height:12px;}
	.sub-menu::after{width:5px;height:5px;right:10px;}
	.sub-menu>ul>li>a{height:36px;padding:0 10px;font-size:12px;}
	.sub-menu>ul>li>a::after{width:4px;height:4px;}
	.sub-menu>ul>li.long>a{height:55px;}
	.sub-menu>ul>li>a:hover{padding-left:25px;font-weight:500}
	.sub-menu>ul>li:nth-child(1)>a{border-top:1px solid #ccc}
	.sub-menu>ul>li>a:hover{background:#f1f1f1}

	.page_info{width : 92%;justify-content: center;padding : 15px 20px 15px 20px;min-height : 0;font-size: 11px;}
    .page_info::after{display : none;}
    .page_info > li{position : relative;padding-left : 12px;}
    .page_info > li + li{margin-top : 4px;}
    .page_info > li::before{font-size: 10px;line-height: 18px;}
}


.customer-cont-tit-box{display: flex;align-items: end; margin-bottom: 30px;}
.customer-cont-tit{font-family: jost; font-size: 57px; font-weight: 500; margin-right: 28px; line-height: 1em;}
.customer-cont-desc{display: flex;align-items: center; font-family: PT; letter-spacing: -0.04em; font-weight: 500; color : #313131; position : relative; padding-left: 28px;line-height: 2em; font-size: 18px;}
.customer-cont-desc::after{position : absolute; content: ''; width : 1px; height : 19px; background: #696969; left : 0;}

/* .customer-cont-inner{overflow-y : scroll;padding-right: 30px; height : 100%;} */

.customer-drop{border : 1px solid #ddd;}
.customer-drop-tit{display: flex;align-items: center; background: #EFEFEF; padding : 11px 19px; color : #313131; font-size: 22px; font-weight: 500; border-bottom : 1px solid #ddd; position : relative; cursor : pointer;}
.customer-drop-tit::after{position : absolute; content : ''; width : 13px;height : 13px; border-top :1px solid #707070; border-right : 1px solid #707070; transform: rotate(-45deg); right : 36px; transition : .5s;margin-top: 10px;}
.fold .customer-drop-tit::after{transform: rotate(135deg); margin-top: 0;}

.customer-drop-con{padding : 0px 0 0 18px;}
.customer-textarea{resize: none; width : 100%; height : 344px; overflow-y : scroll; font-size: 14px; font-weight: 500; color : #6E6E6E; line-height: 2em; padding : 30px 0;}
.customer-textarea b{color : #000}