@charset "utf-8";
/* *******************************************************
 * filename : content.css
 * description : 서브페이지 컨텐츠 CSS
 * date : 2022-03-14
******************************************************** */


/* ******************  서브공통 ********************** */
/* -------- 공통 스크롤바  -------- */
.custom-scrollbar-cover,
.cm-scroll-drag-guide{display:none;}

/* -------- 공통 :: 탭 -------- */
/* Tab 공통 스타일 */
.sub-tab-wrapper-style{position:relative; height:60px; margin-bottom:15px; z-index: 10;}
.sub-tab-list-style {background-color: #eee; border-radius: 6px; margin: 0 auto; }
.sub-tab-list-style.list02 {max-width: 44rem; }
.sub-tab-list-style.list03 {max-width: 66rem; }
.sub-tab-list-style.list04 {max-width: 88rem; }
.sub-tab-list-style.list05 {max-width: 110rem; }
.sub-tab-list-style ul{position: relative; display:flex; justify-content: center; width:100%; height:100%; table-layout:fixed; }
.sub-tab-list-style ul:after{display:none}
.sub-tab-list-style ul li{display:table-cell; vertical-align:middle; position:relative; width:16.66%; max-width: 22rem; transition: all 0.4s;}
.sub-tab-list-style ul li:before {position: absolute;top: 50%; margin-top: -1rem; left: 0; width: 1px; height: 2rem; background-color: rgba(0, 0, 0, 0.1); content: '';transition: var(--transition-custom);}
.sub-tab-list-style.black-ver ul li:before {background-color: rgba(255, 255, 255, 0.1); }
.sub-tab-list-style ul li:before {}
.sub-tab-list-style ul li:first-child:before {display: none;} 
.sub-tab-list-style.list02 ul li {width: 50%;}
.sub-tab-list-style.list03 ul li {width: 33.33%;}
.sub-tab-list-style.list04 ul li {width: 25%;}
.sub-tab-list-style.list05 ul li {width: 20%;}
.sub-tab-list-style.list06 ul li {width: 16.66%;}

.sub-tab-list-style ul li:first-child {border-radius: 6px 0 0 6px;}
.sub-tab-list-style ul li:last-child {border-radius: 0 6px 6px 0;}
.sub-tab-list-style ul li a{display:table; height:60px; width:100%; border-radius: 6px; transition: all 0.4s; }
.sub-tab-list-style ul li a em{display:table-cell; vertical-align:middle; color:#000000; font-size:1.5rem; font-weight: 600; text-align:center; transition: all 0.4s; }
.sub-tab-list-style ul li.selected {z-index: 1;}
/* .sub-tab-list-style ul li.selected a {background-color:var(--main-color);} */
.sub-tab-list-style ul li.selected a em {color: #fff;}
.sub-tab-list-style.black-ver {background-color: rgba(255,255,255,0.05);}
.sub-tab-list-style.black-ver li a em {color: #fff;}

.move-line-wrap{position: absolute; max-width: var(--area-width); width: 100%; margin: 0 auto; top: 0; left: 50%; transform:translateX(-50%);}
.move-line-wrap .move-line{position: absolute; width: 100%; margin: 0 auto; top: 0; left: 0;}
.move-line-wrap .move-line span{height: 60px; width: 100%; max-width: 22rem; position: absolute; top: 0; left: 0; text-align: center; transition: background-color 0.4s; transition: left 0.4s; background:var(--main-color); border-radius:6px;}

.sub-tab-wrapper-style .move-line-wrap{max-width:none;}
.sub-tab-wrapper-style .move-line-wrap.list02 {max-width: 44rem;}
.sub-tab-wrapper-style .move-line-wrap.list03 {max-width: 66rem;}
.sub-tab-wrapper-style .move-line-wrap.list04 {max-width: 88rem;}
.sub-tab-wrapper-style .move-line-wrap.list05 {max-width: 110rem;}

.sub-tab-wrapper-style .move-line-wrap.list02 .move-line span{width:50%;}
.sub-tab-wrapper-style .move-line-wrap.list03 .move-line span{width:33.33%;}
.sub-tab-wrapper-style .move-line-wrap.list04 .move-line span{width:25%;}
.sub-tab-wrapper-style .move-line-wrap.list05 .move-line span{width:20%;}
.sub-tab-wrapper-style .move-line-wrap.list06 .move-line span{width:16.66%;}

@media all and (max-width:800px){
	.move-line-wrap {display: none !important;}
}

/* Tab Fixed Move*/
/* .sub-tab-list-style.top-fixed{position:fixed; top:70px; left:0; width:100%; height:60px;} */
/* Mobile Tab Drop Menu */
.sub-drop-open-btn-style{display:none}

@media all and (min-width:1025px){
	/* Tab Fixed Background */
	/* .sub-tab-list-style:before{position:absolute; top:0px; bottom:0px; left:50%; width:0; content:""; background-color:#fff; border-bottom:1px solid #e5e5e5; transition:all 0.5s}
	.sub-tab-list-style.top-fixed:before{width:100%; margin-left:-50%} */
}


/* -------- 공통 :: 블러효과 -------- */
.cm-blur-effect {opacity: 0; filter: blur(2rem); transition: var(--transition-custom2);}
.cm-blur-effect.animated  {opacity: 1; filter: blur(0);}

/* ****************** 공통 :: PAGING ********************** */
.paging-wrap{display: flex; justify-content:space-between; padding-top: 4rem; border-top: 1px solid #fff;}
.paging{display:flex; justify-content:flex-start; width:100%; text-align:center; flex-wrap:wrap;}
.paging a{position:relative; display:block; width:4rem; height:4rem;  line-height:4rem; margin:0 2px; border:1px solid #222222; text-align:center; font-size:1.4rem; color:#fff; letter-spacing:-0.01em; background-color:rgba(255,255,255,0.1); backdrop-filter:blur(10px); border-radius:0.5rem;}
.paging a.cur{border-color:#000; background-color:#fff; font-weight:600; color: #000;}
.paging a.paging-arrow{background:transparent; border:none;}
.paging a.paging-arrow i{position:relative; top:-1px; vertical-align:middle; color:inherit; font-size:2rem; margin:0 -0.7rem;}

/* .paging:not(.no-margin) a.paging-prev{margin-right:15px}
.paging:not(.no-margin) a.paging-next{margin-left:15px} */ 
.paging .paging-first i,
.paging .paging-last i{transform:translateX(-8px)}
.paging .paging-first i:before,
.paging .paging-last i:before{display:block;width:7px}

.paging-select{display: flex; align-items:center;}
.paging-select .cur-num{}
.paging-select .cur-num input{display:block; width:4rem; height:4rem; line-height:4rem; border:1px solid #000; text-align:center; font-size:1.4rem; color:#000; letter-spacing:-0.01em; background-color:#fff; border-radius:0.5rem; font-weight:600;}
.paging-select .slash{font-size:1.4rem; color:#fff; margin:0 1rem}
.paging-select .total-num{font-size:1.4rem; color:#fff; font-weight:600;}

@media all and (max-width:800px){
	.paging a{width:3rem; height:3rem;  line-height:3rem;}
	.paging-select .cur-num input{width:3rem; height:3rem; line-height:3rem;}
	.paging-select .slash{font-size:1.6rem;}
}

.sub-page .paging-wrap {border-top: 1px solid #000;}
.sub-page .paging a {background-color: #F5F5F5; color: #AAAAAA; border-color: #F5F5F5;     backdrop-filter: blur(0);}
.sub-page .paging a.cur {background-color: #fff; color: #000; border-color: #000; }
.sub-page .paging-select .slash ,
.sub-page .paging-select .total-num {color: #000;}

/* ****************** 공통 :: 게시판 상단 TOTAL 및 카테고리 검색 ********************** */
.bbs-top-list-box{position: relative; z-index: 1; display:flex; align-items:center; justify-content:space-between; flex-direction:row-reverse; flex-wrap:wrap; margin-bottom:2rem}
/* -------- 리스트 Total 갯수 -------- */
.total-list-con{color:#000; font-size:1.8rem; font-weight: 700; letter-spacing:-0.04em;}
.bbs-top-list-box.white-ver .total-list-con {color: #fff;}

@media all and (max-width:800px) {
	.bbs-top-list-box{margin-bottom:5%; }
	.bbs-top-list-box:not(.bbs-top-category-box){flex-direction:initial; }
	/* 공통 :: TOTAL NUMBER 및 카테고리 검색 */
	.board-category-box select{width:150px}
	/* ~개씩 보기 */
	.top-view-select-box{margin-left: 15px;}
	.top-view-select-box select{width:100px;}
	/* 우측 카테고리 */
	.board-category-box{width:50%; max-width:200px;}
	.bbs-top-list-box:not(.top-search-center) .board-search-box + .board-category-box{margin-right:0;}
}

/* ****************** 공통 :: SEARCH BOX ********************** */
.board-search-box{text-align:center; padding:30px 0; }
.board-search-box .board-search-inner{position: relative; display:flex; align-items:center; max-width:500px; height:5rem; margin:0px auto; box-sizing:border-box; border:1px solid #ddd; background-color:#fff;}
.board-search-box .board-search-inner:after{display:none;}
.board-search-box .search-subject-select,
.board-search-box .search-word{height:100%; background-color:transparent; border:0; padding:0 15px; font-size:15px; color:#333; letter-spacing:-0.3px; box-sizing:border-box;}
.board-search-box .search-subject-select{width:12rem; }
.board-search-box .search-subject-select:not(.custom-select){padding-left:1em;}
.board-search-box .search-word{width:100%; border-right:0;}
.board-search-box .search-subject-select + .search-word,
.board-search-box .board-custom-select-box + .search-word{width:calc(100% - 17rem); }
.board-search-box .search-subject-select:focus,
.board-search-box .search-word:focus{color:#333; outline:none; background-color:transparent;}
.board-search-box .search-word::placeholder{color:#333;}
.board-search-box .search-word::-webkit-search-cancel-button{display:none;}
.board-search-box .bbs-search-btn{display: block; position: absolute; width: 4rem; height: 4rem; top: 50%; right: 0.4rem; margin-top: -2rem; border-radius: 50%; background: #000; text-align: center;}
.board-search-box .bbs-search-btn i{line-height:4rem; font-size:20px; color: #fff;}
/* Search Select Custom */
.board-search-box .board-custom-select-box{width:12rem; height:100%; }
.board-custom-select-box .custom-select-wrapper{height:100%;}
.board-custom-select-box .search-subject-select{padding:0;}
.board-custom-select-box .custom-select-trigger{border:0; height:100%; display:flex; align-items:center; line-height: 4rem; font-size: 1.5rem;}
.board-custom-select-box .custom-option-drop-list{border-color:#ddd; left:-1px; right:-1px;}
.board-custom-select-box .custom-option-item{text-align:left; font-size:0.8666em; font-weight:400; padding:8px 15px;}
.board-custom-select-box .custom-option-item.selection{background-color:#eee; }
/* 스타일 03(원형배경) */
.search-style-radius .board-search-inner{background-color:#fff; border-radius:2.5rem; transition:all 0.2s;  transition-delay:0.3s;}
.search-style-radius .board-search-inner.open {border-radius:2.5rem 2.5rem 2.5rem 0; transition-delay:0s;}
.search-style-radius .search-subject-select + .search-word,
.search-style-radius .board-custom-select-box + .search-word{border-left:0;}
.search-style-radius .board-custom-select-box .custom-select-trigger{padding-left:1.5em}
.search-style-radius .board-custom-select-box .custom-option-drop-list{/* left:1.5em; */ /* margin-top:-8px;  */border-radius: 0 0 2.5rem 2.5rem; border:1px solid #ddd; border-top: 1px solid #fff; box-shadow:3px 4px 7px 0px rgba(0, 0, 0, 0.1);}
/* -------- SEARCH BOX 상단 일때  -------- */
.bbs-top-list-box .board-search-box{width:50rem; padding:0;}
.bbs-top-list-box .board-search-inner{/* margin:0; max-width:none; */}
/* -------- SEARCH BOX White-ver  -------- */
.bbs-top-list-box.white-ver .board-search-box .board-search-inner {border: 1px solid #222222; background-color: rgba(255, 255, 255, 0.07);}
.bbs-top-list-box.white-ver .custom-select-trigger {color: #fff;}
.bbs-top-list-box.white-ver .board-search-box .search-subject-select, 
.bbs-top-list-box.white-ver .board-search-box .search-word {color: #fff;}
.bbs-top-list-box.white-ver .board-search-box .search-word:focus{color:#fff; }
.bbs-top-list-box.white-ver .board-search-box .search-word::placeholder{color:#fff;}
.bbs-top-list-box.white-ver .search-style-radius .board-custom-select-box .custom-option-drop-list {border: 1px solid #222222; border-top: 1px solid #222222; background: rgba(255, 255, 255, 0.07);}
.bbs-top-list-box.white-ver .custom-option-item {color: #fff;}
.bbs-top-list-box.white-ver .board-custom-select-box .custom-option-item:hover,
.bbs-top-list-box.white-ver .board-custom-select-box .custom-option-item.selection {background-color: #333;}

@media all and (max-width:800px) {
	.board-search-box{padding:0; border:0}
	.board-search-box .board-search-inner{max-width:none; }
	/* -------- SEARCH BOX 상단 일때  -------- */
	.bbs-top-list-box .board-search-box{width:100%; margin-bottom:5rem;}
	
	.board-search-box .search-subject-select {width: 10rem;}
	.board-search-box .board-custom-select-box {width: 10rem;}
	.board-search-box .search-subject-select + .search-word, 
	.board-search-box .board-custom-select-box + .search-word {width: calc(100% - 15rem);}
}

/* -------- 공통 :: Custom Select -------- */
.custom-select-box{
	display:block;
	width:100%;
 }
.custom-select-box select {
	display: none;
}
.custom-select-wrapper {
	position: relative;
	user-select: none;
	-webkit-user-select: none;
	cursor: pointer;
	width:100%;
}
.custom-select-wrapper .custom-select {
	position: relative;
	display: block;
}
.custom-select-trigger {
	position: relative;
	display: block;
	width: 100%;
/* 	padding:0 15px; */
	color: #333;
	line-height: 40px;
	cursor: pointer;
	transition: all 0.2s ease-in-out;
	font-size:15px;
	border:1px solid #ccc;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box; 
}
.custom-select-trigger:after{
	font-family: 'xeicon';
	position:absolute; 
	top:50%; 
	right:10px; 
	transform:translateY(-50%);
	content: "\e942";
	font-size:2.4rem;
}
.custom-select.opened .custom-select-trigger:after{
	content: "\e945";
}
/* Custom Select :: Option Drop List */
.custom-option-drop-list {
	position: absolute;
	display: none;
	top: 100%;
	left: 0%;
	right: 0;
	z-index:100;
	overflow-y:auto;
	max-height:210px;
	background: #fff;
	border:1px solid #ccc;
	border-top:0;
	pointer-events: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box; 
}
.custom-option-drop-list::-webkit-scrollbar{
	width: 5px;
}
.custom-option-drop-list::-webkit-scrollbar-thumb{
	background-color:#333;
	border-radius:5px;
	transition:all 0.5s;
}
.custom-option-drop-list::-webkit-scrollbar-track{
	background-color:#f2f2f2; 
	border-radius:0;
}
.custom-select.opened .custom-option-drop-list {
	opacity: 1;
	visibility: visible;
	pointer-events: all;
}
.custom-option-item {
	position: relative;
	display: block;
	padding: 15px;
	font-size:13px;
	font-weight: 500;
	color: #555;
	line-height: 1.5;
	cursor: pointer;
	transition: all 0.05s ease-in-out;
}
.custom-option-item:hover {
	background:#f2f2f2;
}
.custom-option-item.selection{
	color:#000;	
}

/* ****************** 제품 :: 공통 ********************** */
.sub-wrap .prd-bottom-inquiry .cm-fill-btn.btn-style01:before {    border: 2px solid var(--main-color); border-radius: 4rem;}
.sub-wrap .prd-bottom-inquiry .cm-fill-btn.btn-style03:before {    border: 2px solid #fff; border-radius: 4rem;}

@media all and (min-width:801px){
	.sub-wrap .prd-bottom-inquiry .cm-fill-btn.btn-style01:hover,
	.sub-wrap .prd-bottom-inquiry .cm-fill-btn.btn-style03:hover {color: var(--main-color);}	
}


/* ****************** 
	* Mouse Pointer
********************** */
.sub-mouse-pointer{position:fixed; top:0px; left:0px; z-index:10000; pointer-events:none; }
/* base */
.sub-mouse-pointer .pointer-circle{position:absolute; top:50%; left:50%; width: 10rem; height: 10rem; border-radius:50%;  transform:translate(-50%,-50%) scale(0); border:2px solid #fff; box-sizing:border-box; transition:var(--transition-custom); opacity:0; background:rgba(255,255,255,0.05); backdrop-filter:blur(1.5rem);}
.sub-mouse-pointer .pointer-circle i{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%) rotate(90deg); font-size:4rem; color:#fff;}
/* arrow */
.sub-mouse-pointer.arrow .pointer-circle{transform:translate(-50%,-50%) scale(1); opacity:1;}

/* ****************** 제품 :: 인트로페이지(게이트페이지) ********************** */
.prd-intro-con {position: relative; width: 100%; display: flex; padding: 6.5rem 0;}
.prd-intro-con .swiper-container {overflow: visible;}
.prd-intro-con.prd-intro-con01 {padding-top: 0;}
.prd-intro-con.left-align .prd-intro-left {position:absolute; left:0; top:0; width: 100%; height: 100%; }
.prd-intro-con.left-align .prd-intro-left .prd-intro-tit-box{display: flex; align-items: center; height: 100%;}
.prd-intro-con.left-align .prd-intro-right  {position: relative; z-index: 1; width:calc(100% - (640px + ((100% - 1320px) / 2))); overflow:hidden; margin:0 0 0 auto; padding-left: 200px; box-sizing: border-box;}

.prd-intro-con.right-align .prd-intro-left {position:absolute; right:0; top:0; width: 100%; height: 100%; }
.prd-intro-con.right-align .prd-intro-left .prd-intro-tit-box {display: flex; align-items: center; justify-content: end; height: 100%;}
.prd-intro-con.right-align .prd-intro-right {position: relative; z-index: 1; width:calc(100% - (640px + ((100% - 1320px) / 2))); overflow:hidden;margin: 0 auto 0 0; padding-right: 200px; box-sizing: border-box;}

@media all and (max-width:2140px){
	.prd-intro-con.left-align .prd-intro-left .prd-intro-tit-box {max-width:1320px; margin:0 auto;}
	.prd-intro-con.left-align .prd-intro-right {width: calc(100% - (640px + ((100% - 1320px) / 2)));}

	.prd-intro-con.right-align .prd-intro-left .prd-intro-tit-box {max-width:1320px; margin:0 auto;}
	.prd-intro-con.right-align .prd-intro-right {width: calc(100% - (640px + ((100% - 1320px) / 2)));}
}
.prd-intro-tit {width: 39%; }
.prd-intro-tit .sub-tit {font-size: 1.5rem; font-weight: 600; letter-spacing: -0.015em; color: var(--main-color); line-height: 1.3; margin-bottom: 1.5rem;}
.prd-intro-tit .tit {font-size: 6.4rem; font-weight: 700; letter-spacing: 0; line-height: 1.1; color: #fff;}
.prd-intro-tit .txt {font-size: 1.6rem; font-weight: 400; letter-spacing: -0.02em; color: rgba(255,255,255,0.4); line-height: 1.75; margin-top: 3rem;}
.prd-more-btn {position: relative; display: flex; align-items: center; justify-content: space-between; width: 24rem; height: 8rem; padding: 1rem; background: rgba(255,255,255,0.1); border-radius: 5rem;  -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box; margin-top: 8rem; overflow: hidden;}
.prd-more-btn i {position: relative; z-index: 1; width: 6rem; height: 6rem;border-radius: 50%; /* background: var(--main-color);  */font-size: 2.4rem; line-height: 6rem; color: #fff; text-align: center; transition: all 0.4s ease-in-out;}
.prd-more-btn:hover i {transform: rotate(360deg);}
.prd-more-btn span {position: relative; display: block; padding-right: 3rem; font-size: 1.7rem; font-weight: 600; letter-spacing: -0.025em; color: #fff; line-height: 1.3; z-index: 1;}
.prd-more-btn .cm-fill {position: absolute; display: block; width: 6rem; height: 6rem; top: 50%; left: 1rem;  transform: translate(0, -50%); background: var(--main-color); border-radius: 50%; transition: width 0.5s ease-out, height 0.5s ease-out, transform 0.5s ease-out; }
.prd-intro-list-swiper {min-height: 64rem;}
.prd-intro-list li {width: 42rem;  height: initial !important;  transition: all 0.4s; transition-property: opacity,visibility, transform, filter;}
.prd-intro-list li a {position: relative; display: block; width: 100%; height: 100%; padding: 5rem; border-radius: 4rem; background: linear-gradient(137deg, rgba(255,255,255,0.09) 0%, rgba(243, 115, 33, 0.09) 100%); -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}

/* .prd-intro-list li a:before {position: absolute; content: ''; top: 0; left: 0; width: 100%; height: 100%; border-radius: 4rem; background: rgba(0,0,0,0.1); opacity: 0; transition: all 0.4s; z-index: 1;}
.prd-intro-list li a:hover:before {opacity: 1;} */

.prd-intro-list li a .img-box {position: relative; width: 100%; height: 0; padding-top: 100%;}
.prd-intro-list li a .img-box span {display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.prd-intro-list li a .tit-box { text-align: left; padding-top: 0.5rem;}
.prd-intro-list li a .tit-box .sub-tit {font-size: 1.6rem; font-weight: 600; letter-spacing: -0.016em; color: var(--main-color);}
.prd-intro-list li a .tit-box .tit {font-size: 4rem; font-weight: 600; letter-spacing: 0; color: #fff; line-height: 1.4; }
.prd-intro-list li a .txt-box {margin-top: 2rem;}
.prd-intro-list li a .txt-box dl {display: flex; alilgn-items: center; justify-content: space-between; padding: 1.5rem 0; border-bottom: 1px solid rgba(255,255,255,0.1);}
.prd-intro-list li a .txt-box dl:last-child {border-bottom: 0; padding-bottom: 0;}
.prd-intro-list li a .txt-box dl dt,
.prd-intro-list li a .txt-box dl dd {font-size: 1.5rem; font-weight: 400; color: #fff; line-height: 1.3;}
.prd-intro-list-swiper02 .prd-intro-list .tit-box,
.prd-intro-list-swiper03 .prd-intro-list .tit-box {padding: 9rem 0 5rem;}

/* 슬라이드 효과 */
@media all and (min-width:801px){
	.prd-more-btn:hover .cm-fill{ width: 40vw; height: 40vw; transform: translate(-5rem, -50%); transition: width 0.5s ease-in 0.1s, height 0.5s ease-in 0.1s, transform 0.5s ease-in 0.1s; }

	.prd-intro-con:not(.animated):not(.active) .prd-intro-list li a {visibility: hidden;}
	.prd-intro-con.animated .prd-intro-list li a, 
	.prd-intro-con.active .prd-intro-list li a {visibility: visible;}

	.prd-intro-con.left-align .prd-intro-list li.swiper-slide-active a {transform: translateX(-40rem); opacity: 0; filter: blur(2rem); } 
	.prd-intro-con.left-align .prd-intro-list li.swiper-slide-next a {transform: translateX(-70rem); opacity: 0; filter: blur(2rem);} 
	.prd-intro-con.left-align .prd-intro-list li.next01 a{transform: translateX(-100rem); opacity: 0; filter: blur(2rem);} 
	.prd-intro-con.right-align .prd-intro-list li.swiper-slide-active a {transform: translateX(40rem); opacity: 0; filter: blur(2rem);} 
	.prd-intro-con.right-align .prd-intro-list li.swiper-slide-next a {transform: translateX(70rem); opacity: 0; filter: blur(2rem);} 
	.prd-intro-con.right-align .prd-intro-list li.next01 a{transform: translateX(100rem); opacity: 0; filter: blur(2rem);} 

	.prd-intro-con.animated .prd-intro-list li.swiper-slide-active a,
	.prd-intro-con.animated .prd-intro-list li.swiper-slide-next a,
	.prd-intro-con.animated .prd-intro-list li.next01 a ,
	.prd-intro-con.active .prd-intro-list li.swiper-slide-active a,
	.prd-intro-con.active .prd-intro-list li.swiper-slide-next a,
	.prd-intro-con.active .prd-intro-list li.next01 a{transform: translateX(0); opacity: 1; filter: blur(0);transition: all 0.8s ease-in-out; transition-property: opacity, transform, filter;}
}

.prd-intro-con.left-align .prd-intro-list li.swiper-slide-prev,
.prd-intro-con.left-align .prd-intro-list li.swiper-slide-duplicate-prev{filter: blur(2rem); opacity: 0; visibility: hidden; transform: perspective(960px) rotateY(-90deg) scale(0.8);}
.prd-intro-con.right-align .prd-intro-list li.swiper-slide-prev,
.prd-intro-con.right-align .prd-intro-list li.swiper-slide-duplicate-prev{filter: blur(2rem); opacity: 0; visibility: hidden; transform: perspective(960px) rotateY(90deg) scale(0.8);}

.prd-intro-auto-con {padding: 10rem 0;}
.prd-intro-auto-con .prd-intro-tit {text-align: center; width: 100%;}
.prd-intro-auto-con .prd-more-btn {width: 28rem; margin: 6rem auto 0;}
/* .prd-intro-auto-list {opacity: 0; transition: 0.2s;} */
.prd-intro-auto-list .slick-list {overflow: visible; margin: 0 -4rem;}
.prd-intro-auto-list .slick-slide {margin: 0 4rem;}
.prd-intro-auto-list {width: 42rem; margin: 8rem auto 0;}
.prd-intro-auto-list li {width: 100%; }
.prd-intro-auto-list li a {filter: blur(2rem); transition: transform 0.8s ease-in-out, opacity 0.8s, filter 0.8s ease-in-out; opacity: 0;}
.prd-intro-auto-list li.slick-center a {z-index: 10;}
.prd-intro-auto-list li.center-prev a,
.prd-intro-auto-list li.center-next a {z-index: 9;}
.prd-intro-auto-list li.prev01 a,
.prd-intro-auto-list li.next01 a {z-index: 8;}
.prd-intro-auto-list li.prev02 a,
.prd-intro-auto-list li.next02 a {z-index: 7;}

.prd-intro-auto-list li.center-prev a  { transform: translateX(56rem) ;}
.prd-intro-auto-list li.prev01 a  { transform: translateX(112rem) ;}
.prd-intro-auto-list li.prev02 a 	{ transform: translateX(168rem) ;}

.prd-intro-auto-list li.center-next a  { transform: translateX(-56rem) ;}
.prd-intro-auto-list li.next01 a  { transform: translateX(-112rem) ;}
.prd-intro-auto-list li.next02 a  { transform: translateX(-168rem)  ;}
.prd-intro-auto-list.animated li a { transform: translateX(0) !important; opacity: 0.2;  filter: blur(0rem) !important;}
.prd-intro-auto-list.animated li.slick-active a {opacity: 1;}

.prd-intro-app-con {padding: 6rem 0 10rem;}
.prd-intro-app-con .prd-intro-tit {text-align: center; width: 100%;}
.prd-intro-app-con .prd-more-btn {width: 28rem; margin: 6rem auto 0;}
.prd-intro-app-list {width: 1160px; margin: 8rem auto 0;}
.prd-app-list .slick-list {overflow: visible; margin: 0 -4rem;}
.prd-app-list .slick-slide {margin: 0 4rem;}
.prd-app-list li {}
.prd-app-list li .inner {display: flex; align-items: center; padding: 6rem;  background: linear-gradient(137deg, rgba(255,255,255,0.09) 0%, rgba(243, 115, 33, 0.09) 100%);  -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box; opacity: 0.2; border-radius: 2rem; filter: blur(2rem); transition: transform 0.8s ease-in-out, opacity 0.8s, filter 0.8s ease-in-out; opacity: 0;}
.prd-app-list li.slick-active .inner {opacity: 1;}
.prd-app-list li .inner .txt-box {width: 48.08%; padding-right: 3rem; box-sizing: border-box;}
.prd-app-list li .inner .txt-box .cate {font-size: 1.6rem; font-weight: 700; letter-spacing: -0.1em; line-height: 1.3; color: var(--main-color);}
.prd-app-list li .inner .txt-box .tit {font-size: 3.2rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; line-height: 1.5; overflow:hidden;display:block;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; margin-top:2rem ;}
.prd-app-list li .inner .txt-box .txt {font-size: 1.6rem; font-weight: 400; letter-spacing:-0.01em; color: rgba(255,255,255,0.5); line-height: 1.625; margin-top: 2rem; overflow:hidden;display:block;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.prd-app-list li .inner .video-box {position: relative; width: 51.92%;}
.prd-app-list li .inner .video-box .video-iframe-box {position: relative;padding-top:51.85%;height: 0; background-color: #000; overflow: hidden;}
.prd-app-list li .inner .video-box .video-iframe-box iframe {position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;}
.prd-app-list li .inner .video-box .video-cover-box { position: absolute;  top: 0px;left: 0px;  width: 100%;height: 100%; overflow: hidden; cursor: pointer;}
.prd-app-list li:not(.slick-active) .inner .video-box .video-cover-box {pointer-events: none;}
.prd-app-list li .inner .video-box .video-cover-box .thumb {display: block; position: relative; width: 100%; height: 100%; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; -ms-transition: all 0.4s; transition: all 0.4s;}
.prd-app-list li .inner .video-box .video-cover-box .thumb img {  width: 100%; height: 100%;}
.prd-app-list li .inner .video-box .btn-cover {position: absolute;  top: 50%; left: 50%; margin: -4.8rem 0 0 -4.8rem; z-index: 10;}
.prd-app-list li .inner .video-box button {position: relative; font-size: 9.6rem; color: #fff;}

.prd-app-list li.slick-center .inner {z-index: 10;}
.prd-app-list li.center-prev .inner,
.prd-app-list li.center-next .inner {z-index: 9;}
.prd-app-list li.prev01 .inner,
.prd-app-list li.next01 .inner {z-index: 8;}

.prd-app-list li.center-prev .inner  { transform: translateX(124rem) ;}
.prd-app-list li.prev01 .inner  { transform: translateX(248rem) ;}

.prd-app-list li.center-next .inner  { transform: translateX(-124rem) ;}
.prd-app-list li.next01 .inner  { transform: translateX(-248rem) ;}

.animated .prd-app-list li .inner { transform: translateX(0) !important; opacity: 0.2;  filter: blur(0rem) !important;}
.animated .prd-app-list li.slick-active .inner {opacity: 1;}

@media all and (max-width:1500px){
	.prd-intro-con.left-align .prd-intro-right {width: calc(100% - (640px + ((100% - 1320px) / 2))); padding-left: 100px;}
	.prd-intro-con.right-align .prd-intro-right {width: calc(100% - (640px + ((100% - 1320px) / 2))); padding-right: 100px;}
}
@media all and (max-width:1280px){
	.prd-intro-app-list {max-width: none; width: 90%;}
	.prd-intro-tit {width: 42%;}
}
@media all and (max-width:800px){
	.prd-intro-con {flex-wrap: wrap;}

	.prd-intro-con.left-align .prd-intro-left {position: relative; margin-bottom: 5rem;}
	.prd-intro-con.left-align .prd-intro-right {overflow: visible; width: 100%; padding: 0 0 0 var(--area-padding); -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
	.prd-intro-con.right-align .prd-intro-left {position: relative; margin-bottom: 5rem;}
	.prd-intro-con.right-align .prd-intro-left .prd-intro-tit-box {justify-content: start; }
	.prd-intro-con.right-align .prd-intro-right {overflow: visible;  width: 100%; padding: 0 0 0 var(--area-padding); -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
	.prd-intro-tit {width: 100%;}
	.prd-intro-tit .tit {font-size: 4rem;}
	.prd-more-btn {/* height: 6.4rem; */ margin-top:4rem;}
	/* 	.prd-more-btn i {width: 4.4rem;height: 4.4rem;  font-size: 2rem; line-height: 4.4rem;} */
	.prd-intro-list-swiper { min-height: auto;}
	.prd-intro-list li a {padding: 3rem 3rem 4rem;}
	.prd-intro-list li a .tit-box .tit {font-size: 2.4rem; margin-top: 1rem;}
	.prd-intro-list-swiper02 .prd-intro-list .tit-box, 
	.prd-intro-list-swiper03 .prd-intro-list .tit-box {padding: 3rem 0;}

	.prd-intro-auto-list .slick-list {margin: 0 -2rem;}
	.prd-intro-auto-list .slick-slide {margin: 0 2rem;}

	.prd-app-list li .inner {padding: 4rem; flex-wrap: wrap;}
	.prd-app-list li .inner .txt-box {width: 100%; padding-right: 0; margin-bottom: 3rem;}
	.prd-app-list li .inner .txt-box .tit {font-size: 2.4rem;}
	.prd-app-list li .inner .video-box {width: 100%;}

}
@media all and (max-width:480px){
	.prd-intro-auto-list {width: 100%; padding: 0 var(--area-padding); -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
	.prd-intro-con.right-align .prd-intro-list li {margin-left: 0 !important; margin-right: 30px !important;}
	.prd-intro-list li a {padding: 3rem 2rem 3.5rem;}
}


/* ****************** 제품 :: 상세페이지 ********************** */
/* 상단 제품이미지+기본정보 */
.prd-view-top {display: flex; align-items: center; padding: 12rem 0 8rem; border-bottom: 2px solid #fff;}
.prd-view-top .prd-view-img-con {position: relative; width: 50%; border-radius: 4rem; background: linear-gradient(137deg, rgba(255,255,255,0.09) 0%, rgba(243, 115, 33, 0.09) 100%);}
.prd-view-top .prd-view-img-list .img-wrap,
.prd-view-top .prd-view-img-list .video-wrap {position: relative; width: 100%; height: 0; padding-top: 100%;}
.prd-view-top .prd-view-img-list .video-wrap .video-wrap-inner {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.prd-view-top .prd-view-img-list .video-wrap .video-iframe-box {position: relative;height: 0;  border-radius: 4rem;  overflow: hidden; padding-top: 100%;}
.prd-view-top .prd-view-img-list .video-wrap .video-iframe-box iframe {position: absolute; top: 0px;left: 0px;width: 100%; height: 100%;}
.prd-view-top .prd-view-img-list .video-wrap .video-cover-box {position: absolute; top: 0px; left: 0px;   width: 100%;  height: 100%; border-radius: 4rem;overflow: hidden; cursor: pointer;}
.prd-view-top .prd-view-img-list .video-wrap .video-cover-box .thumb { display: block;position: relative; width: 100%; height: 100%;}
.prd-view-top .prd-view-img-list .video-wrap .video-cover-box .thumb img {position: absolute; top: 50%; left: 0; width: 100%; transform: translateY(-50%);}
.prd-view-top .prd-view-img-list .video-wrap button {position: absolute; top: 50%; left: 50%; font-size: 6rem; color: #fff; margin: -3rem 0 0 -3rem; z-index: 10;}
.prd-view-top .prd-view-img-con .slick-dots {position: absolute; left: 4rem; bottom: 4rem; display: inline-flex;}
.prd-view-top .prd-view-img-con .slick-dots li { margin-left:3rem; }
.prd-view-top .prd-view-img-con .slick-dots li:first-child { margin-left:0; }
.prd-view-top .prd-view-img-con .slick-dots li button {cursor:pointer; margin:0px; padding:0px; background:none; vertical-align:top; width:1rem; height:1rem; background-color:#fff; font-size:0; opacity:0.15;-webkit-border-radius:50%;-moz-border-radius:50%;-o-border-radius:50%;border-radius:50%;}
.prd-view-top .prd-view-img-con .slick-dots li.slick-active button{background-color:#fff; opacity:1.0; }

.prd-view-info-con {width: 50%; padding-left: 8rem; box-sizing: border-box;}
.prd-view-info-con .category {display: block; font-size: 1.6rem; font-weight: 600; letter-spacing: -0.016em; color: var(--main-color); margin-bottom: 2.5rem;}
.prd-view-info-con .prd-tit {font-size: 6.4rem; font-weight: 700; letter-spacing: -0.024em; color: #fff; line-height: 1.1; text-shadow: 0px 0px 1rem var(--main-color);}
.prd-view-info-con .prd-txt {font-size: 1.8rem; font-weight: 400; letter-spacing: -0.02em; line-height: 1.66; color: rgba(255,255,255,0.5); padding-top: 2rem;}
.prd-view-info-con .prd-view-info-list {display: flex; padding-top: 5rem;}
.prd-view-info-con .prd-view-info-list dl {position: relative; width: 13.5rem; text-align: center; padding: 0 1rem; box-sizing: border-box; border-left: 1px solid rgba(255,255,255,0.15); }
.prd-view-info-con .prd-view-info-list dl:first-of-type {border-left: 0;}
.prd-view-info-con .prd-view-info-list dl dt {font-size: 1.5rem; font-weight: 400; line-height: 1.2; color: #fff;}
.prd-view-info-con .prd-view-info-list dl dd {font-size: 2rem; font-weight: 600; line-height: 1.3; color: #fff; margin-top: 1.5rem;}
.prd-view-info-con .prd-view-btn-list {padding-top: 7.5rem; display: flex; margin: 0 -1rem;}
.prd-view-info-con .prd-view-btn-list a {position: relative; display: flex; align-items: center; justify-content: center; width: calc(50% - 2rem); margin: 0 1rem; max-width: 24rem; height: 6rem; text-align: center; border-radius: 4rem; box-sizing: border-box; }
.prd-view-info-con .prd-view-btn-list a:before {border: 2px solid #fff; border-radius: 4rem;}
.prd-view-info-con .prd-view-btn-list a em {font-size: 1.8rem; font-weight: 600; letter-spacing: -0.02em; line-height: 1.3; color: #fff; transition: var(--transition-custom2);}
.prd-view-info-con .prd-view-btn-list a.inquiry-btn { background: var(--main-color);}
.prd-view-info-con .prd-view-btn-list a.inquiry-btn:before {border: none;}
.prd-view-info-con .prd-view-btn-list a.catalog-btn {}
.prd-view-info-con .prd-view-btn-list a:hover em {color: var(--main-color);}

/* 제품 상세정보 */
.prd-view-con-wrap.fold {position: relative; height: 4000px; overflow: hidden;}
.prd-view-con-wrap.open {height: auto;}
.prd-view-con {padding: 10rem 0; border-bottom: 2px solid #fff;}
.prd-view-con:last-of-type {border-bottom: 0;}
.prd-view-con-tit {text-align: center; font-size: 2.4rem; font-weight: 700; letter-spacing: -0.024em; color: #fff; line-height: 1.4; margin-bottom: 8rem;} 

/* Certification */ 
.prd-certification-list {display: flex; justify-content: center; margin: 0 -6rem;}
.prd-certification-list li {width: calc(16.66% - 12rem); margin: 0 6rem; text-align: center;}
.prd-certification-list li .prd-certif-img {position: relative; width: 100%; height: 0; padding-top: 100%;}
.prd-certification-list li .prd-certif-img span {display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(255,255,255,0.1); border-radius: 50%;}
.prd-certification-list li strong {display: block; font-size: 1.8rem; font-weight: 600; letter-spacing: -0.036em; color: #fff; line-height: 1.5; padding-top: 2rem;}
/* Video */ 
.prd-view-video-con {width: 1160px; margin: 8rem auto 0;}
.prd-view-video-list .slick-list {margin: 0 -4rem;}
.prd-view-video-list .slick-slide {margin: 0 4rem;}
.prd-view-video-list li .inner {border-radius: 2rem; overflow: hidden;}
.prd-view-video-list li .inner .prd-view-video {position: relative; }
.prd-view-video-list li .inner .video-iframe-box {position: relative;padding-top:56.034%;height: 0; background-color: #000; overflow: hidden;}
.prd-view-video-list li .inner .video-iframe-box iframe {position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;}
.prd-view-video-list li .inner .video-cover-box { position: absolute;  top: 0px;left: 0px;  width: 100%;height: 100%; overflow: hidden; cursor: pointer;}
.prd-view-video-list li:not(.slick-active) .inner .video-cover-box {pointer-events: none;}
.prd-view-video-list li .inner .video-cover-box .thumb {display: block; position: relative; width: 100%; height: 100%; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; -ms-transition: all 0.4s; transition: all 0.4s;}
.prd-view-video-list li .inner .video-cover-box .thumb img {  width: 100%; height: 100%;}
.prd-view-video-list li .inner .btn-cover {position: absolute;  top: 50%; left: 50%; margin: -4.8rem 0 0 -4.8rem; z-index: 10;}
.prd-view-video-list li .inner button {position: relative; font-size: 9.6rem; color: #fff;}
.prd-view-video-list .slick-dots {position: relative; margin-top: 4rem; display: flex; justify-content: center;}
.prd-view-video-list .slick-dots li {margin-left: 3.2rem;}
.prd-view-video-list .slick-dots li:first-child {margin-left: 0;}
.prd-view-video-list .slick-dots li button {cursor:pointer; margin:0px; padding:0px; background:none; vertical-align:top; width:0.8rem; height:0.8rem; background-color:#fff; font-size:0; opacity:0.15;-webkit-border-radius:50%;-moz-border-radius:50%;-o-border-radius:50%;border-radius:50%;}
.prd-view-video-list .slick-dots li.slick-active button{background-color:#fff; opacity:1.0; }
/* Application Case */ 
.prd-view-app-list {width: 1160px; margin: 0 auto;}
.prd-view-app-list .prd-app-list .slick-list {overflow: hidden;}
.prd-view-app-list .prd-app-list .slick-dots {position: relative; margin-top: 4rem; display: flex; justify-content: center;}
.prd-view-app-list .prd-app-list .slick-dots li {margin-left: 3.2rem;}
.prd-view-app-list .prd-app-list .slick-dots li:first-child {margin-left: 0;}
.prd-view-app-list .prd-app-list .slick-dots li button {cursor:pointer; margin:0px; padding:0px; background:none; vertical-align:top; width:0.8rem; height:0.8rem; background-color:#fff; font-size:0; opacity:0.15;-webkit-border-radius:50%;-moz-border-radius:50%;-o-border-radius:50%;border-radius:50%;}
.prd-view-app-list .prd-app-list .slick-dots li.slick-active button{background-color:#fff; opacity:1.0; }
/* Advantage */ 
.prd-advantage-list {display: flex; flex-wrap: wrap; margin: -1rem 0;}
.prd-advantage-list li {width: 50%; margin: 1rem 0; padding-right: 1rem; box-sizing: border-box;}
.prd-advantage-list li .txt {position: relative; padding-left: 4.4rem; font-size: 1.8rem; font-weight: 600; letter-spacing: -0.036em; color: #fff; line-height: 1.8;}
.prd-advantage-list li .txt:before {position: absolute; top: -0.6rem; left: 0; content: '\e92c'; font-family: xeicon; font-size: 2.4rem; font-weight: 400; color: #fff;}
/* Specifications */ 
.prd-specifications .custom-scrollbar-wrapper + .prd-view-con-tit {margin-top: 10rem;}
.prd-specifications .prd-view-con-tit {margin-bottom: 6rem;}
.prd-specifications-con {display: flex;}
.prd-specifications-con + .prd-specifications-con {padding-top: 10rem;}
.prd-specifications-con .left-tit-con {width: 18.18%;}
.prd-specifications-con .left-tit-con strong {display: block; font-size: 2.4rem; font-weight: 700; letter-spacing: -0.035em; color: #fff; line-height: 1.4;}
.prd-specifications-con .right-tbl-con {width: 81.82%;}
.prd-spec-tbl-con .prd-spec-sub-tit {padding-top: 4rem; font-size: 1.8rem; font-weight: 700; letter-spacing: -0.035em; line-height: 1.5; color: #fff; margin-bottom: 1.7rem;}
.prd-spec-tbl-con:first-of-type .prd-spec-sub-tit {border-top: 1px solid #fff;}
.prd-spec-tbl table {width: 100%; }
.prd-spec-tbl table tr td, 
.prd-spec-tbl table tr th {text-align: left; border-bottom: 1px solid #fff; padding: 1.2rem 2rem; font-size: 1.5rem; font-weight: 400; letter-spacing: -0.024em; color: #fff; line-height: 1.4;}
.prd-spec-tbl table tbody > tr td,
.prd-spec-tbl table tbody > tr th {border-top: 1px solid #fff;}
.prd-spec-tbl table tr th {background: rgba(255,255,255,0.1);}
.prd-spec-tbl table tr td {border-right: 1px solid rgba(255,255,255,0.15);}
.prd-spec-tbl table tr td:last-of-type {border-right: 0;}
.prd-spec-tbl table tr.merge td {border-bottom: 1px solid rgba(255,255,255,0.15);}
.prd-spec-tbl table tr.merge.merge-end td {border-bottom: 1px solid #fff;}
/* 적용제품 */ 
.prd-applicable-list {display: flex; flex-wrap: wrap; margin:-1.5rem;}
.prd-applicable-list li {width: calc(33.33% - 3rem); margin: 1.5rem;}
.prd-applicable-list li a {display: block; width: 100%; padding: 5rem; border-radius: 4rem; background: linear-gradient(137deg, rgba(255,255,255,0.09) 0%, rgba(243, 115, 33, 0.09) 100%); -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.prd-applicable-list li a .img-box {position: relative; width: 100%; height: 0; padding-top: 100%;}
.prd-applicable-list li a .img-box span {display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.prd-applicable-list li a .tit-box { text-align: left; padding-top: 0.5rem;}
.prd-applicable-list li a .tit-box .sub-tit {font-size: 1.6rem; font-weight: 600; letter-spacing: -0.016em; color: var(--main-color);}
.prd-applicable-list li a .tit-box .tit {font-size: 4rem; font-weight: 600; letter-spacing: 0; color: #fff; line-height: 1.4; }
.prd-applicable-list li a .txt-box {margin-top: 2rem;}
.prd-applicable-list li a .txt-box dl {display: flex; alilgn-items: center; justify-content: space-between; padding: 1.5rem 0; border-bottom: 1px solid rgba(255,255,255,0.1);}
.prd-applicable-list li a .txt-box dl:last-child {border-bottom: 0; padding-bottom: 0;}
.prd-applicable-list li a .txt-box dl dt,
.prd-applicable-list li a .txt-box dl dd {font-size: 1.5rem; font-weight: 400; color: #fff; line-height: 1.3;}

/* 더보기 버튼 */
.prd-view-more-btn-box{position:relative; text-align:center;}
/* .prd-view-more-btn-box:after {position: absolute; content: ''; left: 0; bottom: 8rem; width: 100%; height: 48rem; background: transparent linear-gradient(0deg, #000000 0%, #00000000 100%) 0% 0% no-repeat padding-box;} */
.prd-view-more-btn-box:before{position:absolute; top:50%; left:0; width:100%; height:2px; margin-top: -1px; background-color:#fff; content:""; z-index: 1;}
.prd-view-more-btn {overflow:hidden; display: inline-block; position:absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); backdrop-filter: blur(10px); border-radius:50%; z-index: 2;}
.prd-view-more-btn-icon{display: block; position: relative; top: 1rem; margin-top: 0.5rem; font-size:4rem; color: #fff; transition:color 0.5s}
.prd-view-more-btn-icon i {line-height: 4rem;}

.prd-view-more-btn-box.open {margin-top: 4rem;}
.prd-view-more-btn-box.open:after {display: none;}
.prd-view-more-btn-box.open .prd-view-more-btn-icon {transform: rotate(-180deg)}

.prd-view-more-btn-inner {position: relative; width: 16rem;  height: 16rem; visibility: inherit;	display: flex; flex-direction:column; justify-content: center;  align-items: center;text-align: center;}
.prd-view-more-btn-inner strong {font-size: 1.8rem; font-weight: 600; letter-spacing: -0.036em; color: #fff; line-height: 1.3; display: block;  transition:color 0.5s}
.prd-view-more-btn-inner strong em {font-weight: 600;}
.prd-view-more-btn-line { position: absolute; top: 0; left: 0;width: 100%;height: 100%;}
.prd-view-more-btn-line svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    stroke: #fff;
    stroke-width: 2px;
    fill: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.prd-view-more-btn-line svg:last-child {
    stroke-dasharray: 310px 310px;
    stroke-dashoffset: 310px;
    visibility: hidden;
    -webkit-transition: visibility 0s 1.7s;
    transition: visibility 0s 1.7s;
    animation: more-btn-line-out 1.7s cubic-bezier(0.215, 0.61, 0.355, 1);
	stroke: var(--main-color);
}

@keyframes more-btn-line-over{
	0%{
		-webkit-transform:rotate(-90deg);
		transform:rotate(-90deg)
	}
	to{
		-webkit-transform:rotate(90deg);
		transform:rotate(90deg);
		stroke-dashoffset:0;
	}
}
@keyframes more-btn-line-out{
	0%{
		-webkit-transform:rotate(90deg);
		transform:rotate(90deg);
		stroke-dashoffset:0;
	}
	to{
		-webkit-transform:rotate(450deg);
		transform:rotate(450deg);
		stroke-dashoffset:-310px
	}
}

/* @media all and (hover:hover){
	.prd-view-more-btn:hover .prd-view-more-btn-icon,
	.prd-view-more-btn:hover .prd-view-more-btn-inner strong {color:var(--main-color);}
	.prd-view-more-btn:hover .prd-view-more-btn-inner .prd-view-more-btn-line svg:last-child {
		visibility: inherit;
		-webkit-transition: none;
		transition: none;
		animation: more-btn-line-over 1.7s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
	}
} */

/* 하단리스트버튼 */
.prd-view-bottom {padding-top: 15rem;}
.prd-view-bottom .list-view-btn {width: 100%; height: 10rem; border-radius: 10rem; display: flex; align-items: center; justify-content: center; text-align: center; width: 100%; font-size: 2rem; font-weight: 600; letter-spacing: -0.03em; color: #fff; line-height: 1.4; border: 1px solid #fff; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
 
@media all and (max-width:1280px){ 
	.prd-view-app-list {max-width: none; width: 90%;}
	
	/* Video */
	.prd-view-video-con {width: 90%; max-width: none; }

	.prd-certification-list {margin: 0 -3rem;}
	.prd-certification-list li {width: calc(16.66% - 6rem); margin: 0 3rem;}
}
@media all and (max-width:800px){ 
	/* 상단 제품이미지+기본정보 */
	.prd-view-top {padding: 8rem 0; flex-wrap: wrap;}
	.prd-view-top .prd-view-img-con {width: 100%;}
	.prd-view-info-con {width: 100%; padding-left: 0; padding-top: 4rem;}
	.prd-view-info-con .prd-tit {font-size: 5rem;}
	.prd-view-top .prd-view-img-con .slick-dots {left: 2.5rem; bottom: 2.5rem;}
	.prd-view-top .prd-view-img-con .slick-dots li {margin-left: 1.5rem;}

	/* 제품 상세정보 */
	.prd-view-con-tit {margin-bottom: 6rem;}
	/* Certification */
	.prd-certification-list {flex-wrap: wrap; margin: -3rem;}
	.prd-certification-list li {width: calc(33.33% - 6rem); margin: 3rem;}
	/* Advantage */
	.prd-advantage-list li {width: 100%;}
	.prd-specifications-con {flex-wrap: wrap;}
	.prd-specifications-con .left-tit-con {width: 100%; margin-bottom: 2.5rem;}
	.prd-specifications-con .right-tbl-con {width: 100%;}
	.prd-spec-tbl-con .prd-spec-sub-tit {padding-top: 3rem;}
	/* 적용제품 */
	.prd-view-app-list {width: 100%;}
	.prd-applicable-list li {width: calc(50% - 3rem);}
	.prd-applicable-list li a {padding: 3rem 3rem 4rem;}
	.prd-applicable-list li a .tit-box .tit {font-size: 3rem; margin-top: 1rem;}

	/* 더보기 버튼 */
	.prd-view-more-btn-inner { width: 11rem;height: 11rem;}
	.prd-view-more-btn-inner strong {font-size: 1.4rem;}
	.prd-view-more-btn-icon {font-size: 2.4rem; margin-top: 0;}
	.prd-view-more-btn-icon i {line-height: 2.4rem;}

	.prd-view-bottom .list-view-btn {height: 8rem;}
}
@media all and (max-width:480px){ 
	.prd-view-info-con .prd-view-info-list dl {width: 33.33%;}
	.prd-certification-list {margin: -3rem -2rem;}
	.prd-certification-list li {width: calc(33.33% - 4rem); margin: 3rem 2rem;}
}


/* ****************** 제품 :: 협동로봇 ********************** */
.line-up-con01 {padding: 13rem 0 20rem; max-width: 1480px; margin: 0 auto; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.line-up-con01 .inner {position: relative; display: flex; justify-content: space-between;}
.line-up-con01 .inner .bg-img {width: 80rem; position: absolute; top: 0; left: 50%; transform: translateX(-50%); z-index: -1;}
.line-up-con01 .inner .bg-img img {max-width: 100%; transform:scale(0.3); opacity:0; transition:all 1.5s ease-out}
.line-up-con01 .inner .txt-box {text-align: center; display: inline-block; padding-top: 18rem;}
.line-up-con01 .inner .txt-box .tit {height: 14rem;}
.line-up-con01 .inner .txt-box .tit strong {display: block; font-size: 5.6rem; color: #fff; line-height: 1.3;}
.line-up-con01 .inner .txt-box .tit span {display: block; font-size: 1.8rem; font-weight: 500; color: rgba(255,255,255,0.3); line-height: 1.6; padding-top: 1rem;}
.line-up-con01 .inner .txt-box .txt01 {font-size: 2.4rem; font-weight: 500; color: #fff; line-height: 1.3;}
.line-up-con01 .inner .txt-box .txt02 {font-size: 2rem; font-weight: 500; color: rgba(255,255,255,0.5); line-height: 1.65; padding-top: 3rem;}
.line-up-con01 .inner .txt-box .tit strong,
.line-up-con01 .inner .txt-box .tit span,
.line-up-con01 .inner .txt-box .txt01,
.line-up-con01 .inner .txt-box .txt02 {text-align: center; opacity: 0; letter-spacing:0.02em; filter:blur(1rem); transition:all 0.6s ease-in-out; transition-delay: 0.6s;}

.line-up-con01.animated .inner .bg-img img {transform:scale(1); opacity:1;}
.line-up-con01.animated .inner .txt-box .tit strong,
.line-up-con01.animated .inner .txt-box .tit span,
.line-up-con01.animated .inner .txt-box .txt01,
.line-up-con01.animated .inner .txt-box .txt02  {opacity: 1;  letter-spacing:-0.02em; filter:blur(0); }

.line-up-con02 {padding: 10rem 0 13rem;}
.line-up-con02 .prd-list-tit-box {text-align: center; padding-bottom: 9rem;}
.line-up-con02 .prd-intro-list {display: flex; flex-wrap: wrap; margin: -1.5rem;}
.line-up-con02 .prd-intro-list li {width: calc(33.33% - 3rem); margin: 1.5rem;}
.line-up-con02 .prd-intro-list li a {position: relative; opacity: 0; transform: translate(30px); transition: var(--transition-custom2);}
.line-up-con02 .prd-intro-list li:nth-child(2) a {transition-delay: 0.3s;}
.line-up-con02 .prd-intro-list li:nth-child(3) a {transition-delay: 0.6s;}
.line-up-con02 .prd-intro-list li:nth-child(5) a {transition-delay: 0.3s;}
.line-up-con02 .prd-intro-list li:nth-child(6) a {transition-delay: 0.6s;}
.line-up-con02 .prd-intro-list li.animated a {opacity: 1; transform: translate(0);} 

.cobot-flow-txt-wrap {padding: 6rem 0; }
.cobot-flow-txt-wrap  .inner {position: relative; width: 100%; height: 18.8rem; overflow: hidden;}
.cobot-flow-txt-wrap .flow-txt {width: 100%;height: 100%; position: absolute; top: 0; left: 0; z-index: 2; mix-blend-mode: lighten;}
.cobot-flow-txt-wrap .maskBg {width: 100%; height: 100%;  display: flex; align-items: center; overflow: hidden;} 
.cobot-flow-txt-wrap .maskBg .marquee {width: 100%; height: 100%; position: relative;}
.cobot-flow-txt-wrap .maskBg .marquee .absol {position: absolute; width: 100%; height: 100%; left: 0; top: 0; display: flex; align-items: center;}
.cobot-flow-txt-wrap .maskBg .marquee .absol .mar_ch {display: flex; align-items: center;}
.cobot-flow-txt-wrap .maskBg .marquee .absol h4 {font-size:15rem; letter-spacing:-0.02em; color: rgba(255,255,255,0.15); font-weight: 700; box-sizing:border-box; white-space:nowrap;}
/* .cobot-flow-txt-wrap .bg-box {width: 100%;   height: 100%; background: rgba(255,255,255,0.3); backdrop-filter: blur(1rem);} */

.cobot-why-top {text-align: center; margin-bottom: 10rem;}
.cobot-why-top .cobot-why-tit {font-size: 1.5rem; font-weight: 700; letter-spacing: -0.024em; color: var(--main-color); line-height: 1.3; margin-bottom: 2rem;}
.cobot-why-top .cobot-why-txt {font-size: 5.6rem; font-weight: 700; letter-spacing: -0.023em; color: #fff; line-height: 1.42; }
.cobot-why-top .cobot-why-sub-txt {font-size: 2rem; font-weight: 500; letter-spacing: -0.02em; color: rgba(255,255,255,0.5); line-height: 1.5; padding-top: 2rem;} 
.cobot-why-con01 {padding: 10rem 0; max-width: 1200px; margin: 0 auto;}
.cobot-why-list01 {display: flex; flex-wrap: wrap; margin: 0 -1.5rem;}
.cobot-why-list01 li {width: calc(33.333% - 3rem); margin: 0 1.5rem;}
.cobot-why-list01 li .inner {height: 100%; background: rgba(255,255,255,0.05); backdrop-filter:blur(1rem); border-radius: 3rem; padding: 9.6rem 2.5rem 9rem; box-sizing: border-box; text-align: center; transition:var(--transition-custom2); transition-delay: 0.2s; transition-property: transform, opacity, filter; filter:blur(1rem); opacity: 0;}
.cobot-why-list01 li:first-child .inner{transform: translateX(100%);}
.cobot-why-list01 li:last-child .inner{transform: translateX(-100%);}
.cobot-why-list01 li .inner .icon {display: block; height: 8rem; line-height: 8rem; margin-bottom: 3.5rem;}
.cobot-why-list01 li .inner .tit {font-size: 3rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; line-height: 1.3; margin-bottom: 1.8rem;}
.cobot-why-list01 li .inner .txt {font-size: 1.8rem; font-weight: 500; letter-spacing: -0.02em; line-height: 1.8; color: #FFFFFF;}
.cobot-why-list01.animated li .inner {opacity: 1; transform: translateX(0); filter:blur(0);}

.cobot-why-con02 {padding: 10rem 0;}
.cobot-why-list02 {display: flex; flex-wrap: wrap;}
.cobot-why-list02 li {position: relative; display: flex; align-items: center; width: 50%; }
.cobot-why-list02 li.item01 {flex-direction: row-reverse; z-index: 1; transform: translateX(4rem);}
.cobot-why-list02 li.item02 {z-index: 3; transform: translateX(-4rem);}
.cobot-why-list02 li.item03 {width: 100%; display: block; text-align: center; z-index: 2;  transform: translateY(-15rem);} 
.cobot-why-list02 li .circle-box {position: relative; width: 37.2rem; opacity: 0; border-radius: 50%; border: 3px solid #fff; transition: opacity 0.4S, transform 1.0s ease-in-out; }
.cobot-why-list02 li.item01 .circle-box {transform: translate(14.5rem,11rem);}
.cobot-why-list02 li.item02 .circle-box {transform: translate(-14.5rem,11rem);}
.cobot-why-list02 li.item03 .circle-box {transform: translate(0,-11rem);}
.cobot-why-list02 li .circle-box .inner-wrap {position: relative; width: 100%; height: 0; padding-top: 100%; box-sizing: border-box; transition: all 0.4s; }
.cobot-why-list02 li .circle-box .inner-wrap:before {position: absolute; content: ''; top: -3px; left: -3px; width:calc(100% + 6px); height: calc(100% + 6px); border-radius: 50%; background: var(--main-color); opacity: 0; filter: brightness(0.8); transition: all 0.4s;}
.cobot-why-list02 li .circle-box .inner-wrap .inner {position: absolute; width: calc(100% + 6px); height: calc(100% + 6px); top: -3px; left: -3px; display: flex; flex-direction: column; justify-content: center; text-align: center;  border-radius: 50% ; z-index: 1; padding: 4rem; box-sizing: border-box;}

.cobot-why-list02 li.item03 .circle-box .inner-wrap .inner {flex-direction: column-reverse; }
.cobot-why-list02 li .circle-box .icon {}
.cobot-why-list02 li .circle-box .tit {display: block; font-size: 2.4rem; font-weight: 500; letter-spacing: -0.02em; color: #fff; line-height: 1.25; margin-top: 1rem;}
.cobot-why-list02 li.item03 .circle-box .tit {margin-top: 0; margin-bottom: 1rem;}
.cobot-why-list02 li.item03 .circle-box {margin: 0 auto;}
.cobot-why-list02 li .txt-box {width: calc(100% - 37.2rem); -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.cobot-why-list02 li.item01 .txt-box { text-align: right; padding-right: 5rem;}
.cobot-why-list02 li.item02 .txt-box { padding-left: 5rem;}
.cobot-why-list02 li.item03 .txt-box {width: 100%; padding-top: 5rem;}
.cobot-why-list02 li .txt-box .txt {font-size: 2rem; font-weight: 500; letter-spacing: -0.02em; color: #fff; line-height:  1.7;}

.cobot-why-list02.animated li .circle-box {transform: translate(0,0);opacity: 1;}
.cobot-why-list02 li.on .circle-box {border-color: transparent;}
.cobot-why-list02 li.on .circle-box .inner-wrap:before {opacity: 1;}

@media all and (max-width:1280px){ 
	.line-up-con01 .inner .bg-img {}
	.line-up-con01 .inner .txt-box {width: 35%; padding-top: 9rem;}
	
	.cobot-why-list02 li.item01 {transform: translateX(2.5rem);}
	.cobot-why-list02 li.item02 {transform: translateX(-2.5rem);}
	.cobot-why-list02 li.item03 {transform: translateY(-9rem);} 
	.cobot-why-list02 li .circle-box {width: 30rem;}
	.cobot-why-list02 li .txt-box {width: calc(100% - 30rem);}
}
@media all and (max-width:800px){ 
	.line-up-con01 {padding: 8rem 0 0;}
	.line-up-con01 .inner  {display: block;}
	.line-up-con01 .inner .bg-img {width: 100%; position: relative; top: 0; left: 0; margin-left: 0; text-align: center; transform: translateX(0);}
	.line-up-con01 .inner .txt-box {padding-top: 0; width: 100%;}
	.line-up-con01 .inner .txt-box.right-box {padding-top: 5rem;}
	.line-up-con01 .inner .txt-box .tit {height: auto;}
	.line-up-con01 .inner .txt-box .tit strong {font-size: 4rem;}
	.line-up-con01 .inner .txt-box .txt01 {margin-top: 1rem; font-size: 1.8rem;}	
	.line-up-con01 .inner .txt-box .txt02 {font-size: 1.6rem;}

	.line-up-con02 {padding: 10rem 0;}
	.line-up-con02 .prd-intro-list {margin: -1rem;}
	.line-up-con02 .prd-intro-list li {width: calc(50% - 2rem); margin: 1rem;}
	.line-up-con02 .prd-intro-list li:nth-child(2) a {transition-delay: 0.3s;}
	.line-up-con02 .prd-intro-list li:nth-child(3) a {transition-delay: 0s;}
	.line-up-con02 .prd-intro-list li:nth-child(4) a {transition-delay: 0.3s;}
	.line-up-con02 .prd-intro-list li:nth-child(5) a {transition-delay: 0s;}
	.line-up-con02 .prd-intro-list li:nth-child(6) a {transition-delay: 0.3s;}

	.cobot-flow-txt-wrap {padding: 0;}
	.cobot-flow-txt-wrap .inner {height: 13.8rem;}
	.cobot-flow-txt-wrap .maskBg .marquee .absol h4 {font-size: 9rem;}
	
	.cobot-why-top {margin-bottom: 6rem;}
	.cobot-why-top .cobot-why-txt {font-size: 4rem;}
	.cobot-why-top .cobot-why-sub-txt {font-size: 1.8rem;}

	.cobot-why-list01 {margin: -1rem 0;}
	.cobot-why-list01 li {width: 100%; margin: 1rem 0;}
	.cobot-why-list01 li .inner {padding: 4.5rem 2.5rem; background: rgba(255, 255, 255, 0.09);}
	.cobot-why-list01 li:first-child .inner{transform: translateX(0);}
	.cobot-why-list01 li:last-child .inner{transform: translateX(0);}
	.cobot-why-list01 li .inner .tit {font-size: 2.2rem;}

	.cobot-why-list02 li {width: 100%; margin-bottom: 2rem;}
	.cobot-why-list02 li.item01 {transform: translateX(0); flex-direction: row;}
	.cobot-why-list02 li.item02 {transform: translateX(0);}
	.cobot-why-list02 li.item03 {transform: translateY(0); display: flex; aling-items: center; margin-bottom: 0;} 
	.cobot-why-list02 li .circle-box {width: 17rem;}
	.cobot-why-list02 li.item01 .circle-box {transform: translate(0,0);}
	.cobot-why-list02 li.item02 .circle-box {transform: translate(0,0);}
	.cobot-why-list02 li.item03 .circle-box {transform: translate(0,0);}
	.cobot-why-list02 li.item03 .circle-box .inner-wrap .inner {flex-direction: column; padding: 3rem;}
	.cobot-why-list02 li .circle-box .tit {font-size: 1.8rem;}
	.cobot-why-list02 li.item03 .circle-box .tit {margin-top: 1rem; margin-bottom: 0;}
	.cobot-why-list02 li.item01 .txt-box {width: calc(100% - 17rem); text-align: left; padding-right: 0; padding-left: 3rem;}
	.cobot-why-list02 li.item02 .txt-box {width: calc(100% - 17rem); padding-left: 3rem;}
	.cobot-why-list02 li.item03 .txt-box  {width: calc(100% - 17rem); text-align: left;  padding-top: 0; padding-left: 3rem;}
	.cobot-why-list02 li .txt-box .txt {font-size: 1.6rem;}
}
@media all and (max-width:480px){ 

}



/* ****************** 제품 :: 이동로봇 ********************** */
.agv-amr-page {position: relative;}
/* .agv-amr-bg {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; opacity: 0.44; }
.agv-amr-bg .bg-point {position: absolute; top: 0; width: 172rem; height: 172rem; background: transparent radial-gradient(closest-side, #F37321 0%, #F3732100 80%);}
.agv-amr-bg .bg-point.bg-point01 {top: -50rem;  right: -63%;}
.agv-amr-bg .bg-point.bg-point02 {top: 172rem; right: -50%;}
.agv-amr-bg .bg-point.bg-point03 {top: 172rem; right: -50%;}
.agv-amr-bg .bg-point.bg-point04 {top: 172rem; right: -50%;}
 */
.prd-list-tit-box {}
.prd-list-tit-box .tit {font-size: 6.4rem; font-weight: 700; line-height: 1.1; color: #fff; letter-spacing: -0.02em;}
.prd-list-tit-box .sub-tit {font-size: 1.8rem; font-weight: 500; line-height: 1.3; color: rgba(255,255,255,0.3); letter-spacing: -0.02em;}
.prd-list-tit-box .txt01 {font-size: 2.4rem; font-weight: 500; letter-spacing: -0.02em; color: #fff; line-height: 1.25; padding-top: 2rem;}
.prd-list-tit-box .txt02 {font-size: 1.8rem; font-weight: 500; letter-spacing: -0.02em; color: rgba(255,255,255,0.5); line-height: 1.66; padding-top: 2rem;}

.agv-amr-page .prd-list-tit-box .tit {font-size: 5.6rem;}
.agv-amr-page .prd-list-tit-box .sub-tit {margin-top: 1rem;}
.agv-amr-page .prd-list-tit-box .txt01 {line-height: 1.5; padding-top: 3.5rem;}

.agv-con {position: relative; padding-top: 15rem;}
.agv-con .prd-list-tit-box {text-align: center; padding-bottom: 8rem;}
.agv-list {display: flex; flex-wrap: wrap; margin: -1rem -1.5rem;}
.agv-list li {width: calc(25% - 3rem); margin: 1rem 1.5rem;}
.agv-list li a {display: block; width: 100%; height: 100%; padding: 5rem; border-radius:4rem; backdrop-filter: blur(1rem); background: linear-gradient(137deg, rgba(255, 255, 255, 0.09) 0%, rgba(243, 115, 33, 0.09) 100%);-webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.agv-list li a .img-box {position: relative; width: 100%; height: 0; padding-top: 100%;}
.agv-list li a .tit {display: block; font-size: 2.3rem; font-weight: 600; line-height: 1.3; margin-top: 1rem; color: #fff;}

.amr-list-wrap {padding-top: 10rem;}
.amr-con {display: flex; align-items: center;}
.amr-con .amr-img-box {width: 50%;}
.amr-con .amr-img-box span {position: relative; display: block; width: 100%; height: 0; padding-top: 100%; }
.amr-con .amr-info-box {width: 50%; padding-left: 10rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;} 
.amr-list-wrap .slick-dots {position: relative; margin-top: 4rem; display: flex; justify-content: center;}
.amr-list-wrap .slick-dots li {margin-left: 3.2rem;}
.amr-list-wrap .slick-dots li:first-child {margin-left: 0;}
.amr-list-wrap .slick-dots li button {cursor:pointer; margin:0px; padding:0px; background:none; vertical-align:top; width:0.8rem; height:0.8rem; background-color:#fff; font-size:0; opacity:0.15;-webkit-border-radius:50%;-moz-border-radius:50%;-o-border-radius:50%;border-radius:50%;}
.amr-list-wrap .slick-dots li.slick-active button{background-color:#fff; opacity:1.0; }

.prd-why-wrap {padding: 22rem 0 10rem;}
.prd-why-top {text-align: center; margin-bottom: 5rem;}
.prd-why-tit {font-size: 6.4rem; font-weight: 700; letter-spacing: -0.024em; color: #fff; line-height: 1.2;}
.prd-why-txt {font-size: 1.8rem; font-weight: 500; letter-spacing: -0.02em; color: rgba(255,255,255,0.5); line-height: 1.66; padding-top: 1rem;}
.prd-why-con {padding-top: 15rem;}
.prd-why-con .prd-why-con-tit {font-size: 4rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; line-height: 1.25; margin-bottom: 5rem; text-align: center;}
.prd-why-con .prd-why-item {display: flex; padding: 5rem 0; border-bottom: 1px solid rgba(255,255,255,0.1);}
.prd-why-con .prd-why-item:first-of-type {border-top: 2px solid #fff;}
.prd-why-con .prd-why-item .tit-box {width: 24rem; padding-right: 3rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.prd-why-con .prd-why-item .tit-box strong {display: block; font-size: 3rem; letter-spacing: -0.02em; color: #fff; line-height: 1.33;}
.prd-why-con .prd-why-item .tit-box span {display: block; font-size: 3.6rem; color: #fff; margin-top: 1rem;} 
.prd-why-con .prd-why-item .tit-box span:not(.icon) {width: 3.6rem; height: 3.6rem;}
.prd-why-con .prd-why-item .tit-box span:not(.icon) svg {width: 100%; height: 100%;}
.prd-why-con .prd-why-item .right-box { width: calc(100% - 24rem);}
.prd-why-con .prd-why-item .right-box .txt01 {font-size: 2.2rem; font-weight: 600; letter-spacing: -0.02em; color: #fff; line-height: 1.8; } 
.prd-why-con .prd-why-item .right-box .txt01 + .txt01 {margin-top: 5rem;}

.prd-why-con .prd-why-item .txt-box {display: flex; flex-wrap: wrap; }
.prd-why-con .prd-why-item .txt-box.txt-box-style01 {margin: 0 -0.75rem;}
.prd-why-con .prd-why-item .txt-box.txt-box-style01 dl {width: calc(33.333% - 1.5rem); margin: 0 0.75rem;}
.prd-why-con .prd-why-item .txt-box dl {border-radius: 3rem; background: rgba(255,255,255,0.05); padding: 2.5rem 3.5rem 3rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.prd-why-con .prd-why-item .txt-box dl dt {margin-bottom: 3.1rem;}
.prd-why-con .prd-why-item .txt-box dl dt .num {width: 4rem; height: 4rem; border-radius: 50%; padding: 0.5rem; box-sizing: border-box; background: rgba(243, 115, 33, 0.1);}
.prd-why-con .prd-why-item .txt-box dl dt .num span {display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; border-radius: 50%; background: rgba(243, 115, 33, 0.3); font-size: 1.4rem; font-weight: 600; letter-spacing: -0.02em; color: #fff; }
.prd-why-con .prd-why-item .txt-box dl:first-of-type dt .num span {background: var(--main-color);}
.prd-why-con .prd-why-item .txt-box dl dt .sub-tit {display: block; font-size: 2rem; font-weight: 600; letter-spacing: -0.02em; color: #fff; line-height: 1.5; margin-top: 1.1rem;}
.prd-why-con .prd-why-item .txt-box dl dd {font-size: 1.5rem; font-weight: 500; letter-spacing: -0.02em; color: rgba(255,255,255,0.6); line-height: 2; }

.prd-why-con .prd-why-item .txt-box.txt-box-style02 {margin: -0.5rem 0 ;}
.prd-why-con .prd-why-item .txt-box.txt-box-style02 dl {display: flex; align-items: center; padding: 3rem 3.5rem;  width: 100%; margin: 0.5rem 0;}
.prd-why-con .prd-why-item .txt-box.txt-box-style02 dl dt {width: 19.5rem; display: flex; align-items: center;  margin-bottom: 0;}
.prd-why-con .prd-why-item .txt-box.txt-box-style02 dl dt .num {}
.prd-why-con .prd-why-item .txt-box.txt-box-style02 dl dt .sub-tit {position: relative; width: calc(100% - 4rem); margin-top: 0; padding: 0 1.5rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.prd-why-con .prd-why-item .txt-box.txt-box-style02 dl dt .sub-tit span {position: absolute; left: 1.5rem; bottom: -70%; font-size: 1.6rem; font-weight: 600; opacity: 0.3; }
.prd-why-con .prd-why-item .txt-box.txt-box-style02 dl dd {width: calc(100% - 19.5rem);}

.prd-why-con .prd-why-item .txt-box.txt-box-style03 {margin: -1rem -0.75rem ; padding-top: 5rem;}
.prd-why-con .prd-why-item .txt-box.txt-box-style03 dl {width: calc(50% - 1.5rem); margin: 1rem 0.75rem; padding: 2.5rem 3.5rem 3rem 4rem; }

/* .prd-why-con .prd-why-item .txt-box {width: calc(100% - 24rem);} 
.prd-why-con .prd-why-item .txt-box dl {padding: 4rem 0; border-bottom: 1px solid rgba(255,255,255,0.2);}
.prd-why-con .prd-why-item .txt-box dl:first-of-type {padding-top: 0;}
.prd-why-con .prd-why-item .txt-box dl:last-of-type {padding-bottom: 0; border-bottom: 0;}
.prd-why-con .prd-why-item .txt-box dl dt {font-size: 1.8rem; font-weight: 600; letter-spacing: -0.02em; color: #fff; line-height: 1.66;}
.prd-why-con .prd-why-item .txt-box dl dt .txt + .txt {padding-top: 2rem;}
.prd-why-con .prd-why-item .txt-box dl dd {font-size: 1.8rem; font-weight: 500; letter-spacing: -0.02em; color: rgba(255,255,255,0.6); line-height: 1.66; padding-top: 0.4rem;} */

@media all and (max-width:1280px){ 
	.agv-list li a {padding: 4rem;}
}
@media all and (max-width:800px){ 
	.agv-con {padding-top: 8rem;}
	.prd-list-tit-box .tit {font-size: 4.8rem;}
	.prd-list-tit-box .txt01 {font-size: 1.8rem;}
	.agv-amr-page .prd-list-tit-box .tit {font-size: 4rem;}
	.agv-list {margin: -1rem;}
	.agv-list li {width: calc(50% - 2rem); margin: 1rem;}
	.agv-list li a {padding: 4rem 3rem;}
	.agv-list li a .tit {font-size: 1.6rem; line-height: 1.4;}
	.amr-con {flex-wrap: wrap;}
	.amr-con .amr-img-box {width: 100%;}
	.amr-con .amr-info-box {width: 100%; padding-left: 0; padding-top: 5rem;}
	.prd-why-wrap {padding: 15rem 0 10rem;}
	.prd-why-tit {font-size: 4rem;}
	.prd-why-con {padding-top: 10rem;}
	.prd-why-con .prd-why-item {flex-wrap: wrap; padding: 4rem 0;}
	.prd-why-con .prd-why-item .tit-box {width: 100%; padding-right: 0; padding-bottom: 4rem;}
	.prd-why-con .prd-why-item .tit-box span {font-size: 3rem; margin-top: 1rem;}
	.prd-why-con .prd-why-item .right-box {width: 100%;}
	.prd-why-con .prd-why-item .right-box .txt01 {font-size: 2rem;}
	.prd-why-con .prd-why-item .txt-box dl {    background: rgba(255, 255, 255, 0.1);}
	.prd-why-con .prd-why-item .txt-box dl dt {margin-bottom: 2rem;}
	.prd-why-con .prd-why-item .txt-box.txt-box-style01 {margin: -0.5rem 0;}
	.prd-why-con .prd-why-item .txt-box.txt-box-style01 dl {width: 100%; margin: 0.5rem 0;}
	.prd-why-con .prd-why-item .txt-box.txt-box-style02 dl {flex-wrap: wrap;}
	.prd-why-con .prd-why-item .txt-box.txt-box-style02 dl dt {width: 100%; margin-bottom: 2rem;}
	.prd-why-con .prd-why-item .txt-box.txt-box-style02 dl dd {width: 100%;}
	.prd-why-con .prd-why-item .txt-box.txt-box-style03 {margin: -0.5rem 0;}
	.prd-why-con .prd-why-item .txt-box.txt-box-style03 dl {width: 100%; margin: 0.5rem 0; padding: 2.5rem 3.5rem 3rem;}
}

/* ****************** 제품 :: 자동화시스템 ********************** */
.product-page .bbs-no-list {border-top: 1px solid #fff;}
.automation-system-list {display: flex; flex-wrap: wrap; margin: -1.5rem; padding: 6.5rem 0 4rem;}
.automation-system-list li {width: calc(33.33% - 3rem); margin: 1.5rem; border-radius: 4rem; background:  linear-gradient(137deg, rgba(255,255,255,0.09) 0%, rgba(243, 115, 33, 0.09) 100%); padding:5.5rem 5rem 5rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.automation-system-list li .img-box {position: relative; width: 100%; height: 0; padding-top: 100%;}
.automation-system-list li .tit-box {padding: 4rem 0;}
.automation-system-list li .tit-box .cate {display: block; font-size: 1.6rem; font-weight: 600; letter-spacing: -0.016em; color: var(--main-color); line-height: 1.5; margin-bottom: 0.5rem;}
.automation-system-list li .tit-box .tit  {display: block; font-size: 4rem; font-weight: 600; line-height: 1.4; color: #fff;}
.automation-system-list li .btn-box {display: flex; margin: 0 -0.5rem;}
.automation-system-list li .btn-box a {position: relative; width: calc(50% - 1rem); height: 5rem; margin: 0 0.5rem; text-align: center; display: flex; align-items: center; justify-content: center; border-radius: 4rem; box-sizing: border-box;}
.automation-system-list li .btn-box a:before {border: 2px solid #000; border-radius: 4rem;}
.automation-system-list li .btn-box a em {font-size: 1.5rem; font-weight: 600; letter-spacing: -0.03em; line-height: 1.2; color: #fff; transition: var(--transition-custom2);}
.automation-system-list li .btn-box a.view-btn {background: var(--main-color); border: 0;}
.automation-system-list li .btn-box a:hover em {color: var(--main-color);}

@media all and (max-width:1280px){ 
	.automation-system-list li {padding: 4.5rem 3.5rem;}
}
@media all and (max-width:800px){ 
	.automation-system-list {margin: -1rem;}
	.automation-system-list li {width: calc(50% - 2rem); margin: 1rem;}
	.automation-system-list li .tit-box {padding: 2rem 0;}
	.automation-system-list li .tit-box .tit {font-size: 2.6rem;}
	/* .automation-system-list li .btn-box {flex-wrap: wrap; margin: -0.5rem 0;}
	.automation-system-list li .btn-box a {width: 100%; margin: 0.5rem 0;} */
}
@media all and (max-width:640px){ 
		.automation-system-list li {width: calc(100% - 3rem);}
}

/* ****************** 제품 :: 적용사례 ********************** */
.prd-cases-wrap {padding: 4.5rem 0 6rem;}
.prd-cases-con {position: relative; display: flex; border-top: 1px solid #fff; padding-top: 40px;}
.prd-cases-con .left-con {width: 12rem;}
.prd-cases-con .cate-filter-con {position: relative; width: 12rem; transition: top 0.4s ease-in-out;}
.prd-cases-con .cate-filter-con.top-fixed {position: fixed; top: calc(var(--sub-menu-height) + 40px);}
.scroll-up .prd-cases-con .cate-filter-con.top-fixed {top:  calc(var(--header-height) + var(--sub-menu-height) + 40px); transition: top 0.4s ease-in-out;}

.prd-cases-con .cate-filter-con.bottom-fixed {position: absolute; bottom: 0; left: 0;}
.prd-cases-con .cate-filter-list {position: relative; width: 100%; border-radius: 0.6rem; background: rgba(255,255,255,0.1); }
.prd-cases-con .cate-filter-list li {width: 100%; height: 6rem;}
.prd-cases-con .cate-filter-list li input {display: none;}
.prd-cases-con .cate-filter-list li label {position: relative; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; text-align: center; padding: 0 1rem; border-radius: 0.6rem;overflow: hidden; transition: all 0.3s; box-sizing: border-box;}
.prd-cases-con .cate-filter-list li label span {font-size: 1.5rem; font-weight: 600; line-height: 1.4; color: #fff;}

/* .prd-cases-con .cate-filter-list li input:checked + label {background: var(--main-color);} */

.prd-cases-con .right-con {width: calc(100% - 12rem); padding-left: 4rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.prd-cases-con .prd-app-list li {margin-bottom: 4rem;}
.prd-cases-con .prd-app-list li .inner {opacity: 1;}
.prd-cases-con .prd-app-list li .inner .txt-box {padding-left: 2rem;}

@media all and (max-width:1280px){ 
	.prd-cases-con .prd-app-list li .inner {padding: 5rem;}
	.prd-cases-con .prd-app-list li .inner .txt-box {padding-left: 0;}
}
@media all and (max-width:800px){ 
	.prd-cases-con {display: block;}
	.prd-cases-con .left-con {width: 100%; margin-bottom: 5rem;}
	.prd-cases-con .cate-filter-con {position: relative; width: 100%; z-index: 1;}
	.prd-cases-con .cate-filter-con.top-fixed {position: relative; top: 0;}
	.prd-cases-con .cate-filter-list {display: flex;}
	.prd-cases-con .cate-filter-list li label span {font-size: 1.4rem;}
	.prd-cases-con .cate-filter-list li input:checked + label {background: var(--main-color);}
	.prd-cases-con .right-con {width: 100%; padding-left: 0;}
	.prd-cases-con .prd-app-list li .inner {padding: 5rem 3rem;}
}

/* default */
.mouse-default{position:fixed; top:-80rem; left:-80rem; width: 172rem; height: 172rem; border-radius:50%; opacity: 0.2; z-index: -1; pointer-events:none; filter: blur(20px);}
.mouse-default:before{position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius:50%; content: ''; backdrop-filter: blur(5px); /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f52f23+0,f52f23+100&1+0,0.74+27,0.37+52,0+78 */
background: radial-gradient(ellipse at center,  rgba(243, 115, 33, 1) 0%,rgba(243, 115, 33, 0.74) 27%,rgba(243, 115, 33, 0.37) 52%,rgba(243, 115, 33, 0) 78%,rgba(243, 115, 33, 0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */}

@media all and (max-width:800px){
	.mouse-default {visibility: hidden !important; opacity: 0 !important;}
}


/* ****************** 02 H 파트너스 :: 01 협업 파트너스 찾기 ********************** */
.office-page .sub-tab-wrapper-style ,
.store-page .sub-tab-wrapper-style {margin-bottom: 6.5rem;}
/* ****************
 * 오피스
**************** */
.office-con { display: flex; flex-wrap:wrap; justify-content: space-between; height: 100%; }
/* 왼쪽  */
.office-con-left{padding: 3rem 1rem 3rem 3rem;width: 30.23%; height: 100%; background-color: #f5f5f5; border-radius: 1rem; box-sizing: border-box;}
.office-search-result-box { position: relative; height: 100%;}
.office-search-result-list {height: 100%; padding-right: 1.3rem; overflow-x: hidden; overflow-y: auto;}
.office-search-result-list::-webkit-scrollbar {
	width: 7px;
}
.office-search-result-list::-webkit-scrollbar-track {
	background-color: rgba(0,0,0,0.1);
	border-radius: 7px
}
.office-search-result-list::-webkit-scrollbar-thumb {
	background-color: #404040;
	border-radius: 7px
} 
.office-search-result-item{position: relative; }
.office-search-result-item + .office-search-result-item{margin-top: 0.5rem;}
.office-search-result-item .inner {position: relative; display: block; padding: 4rem; width: 100%; background-color: #fff; border-radius: 1rem; box-sizing: border-box;}
.office-search-result-item .inner:before {position: absolute; content: ''; top: 0; left: 0; width: 100%; height: 100%; border-radius: 1rem; border: 2px solid var(--main-color); box-sizing: border-box; transition: all 0.3s; opacity: 0;}
.office-search-result-item.on .inner:before {opacity: 1;}

.office-search-result-item .tit{position: relative; margin-bottom: 2rem; padding-bottom: 2rem; padding-left: 2.5rem; font-size: 2rem; line-height: 1.3; font-weight: 700; color: #000; border-bottom: 1px solid #000;}
.office-search-result-item .tit:before {position: absolute; content: '\eb59'; font-family: xeicon; font-size: 2rem; color: #000; left: 0; top: 0; z-index: 1;}
.office-search-result-item dl{display: flex; flex-wrap:wrap;}
.office-search-result-item dl + dl{margin-top: 0.7rem;}
.office-search-result-item dt,
.office-search-result-item dd{font-size: 1.6rem; font-weight: 500; line-height: 1.375; color: #000;}
.office-search-result-item dt{width: 9.5rem;}
.office-search-result-item dd{width: calc(100% - 9.5rem);}
/* 오른쪽 */
.office-con-right{width: 69.77%; height: 100%; padding-left: 2rem; box-sizing: border-box;}

/* ****************
 * 스토어
**************** */
.store-page, .office-page {position: relative; padding-bottom: 3rem;}
.store-page-cover {display: none; position: absolute;top: 0;  left: 0;  width: 100%; height: calc(50vh + 9rem); background: transparent; z-index: 99;}
.store-con-wrap {height: 100vh; padding: 3rem 0; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.store-con {height: 100%; display: flex; flex-wrap:wrap; justify-content: space-between;}
/* 왼쪽  */
.store-con-left{position: relative; width: 30.23%; height: 100%;/*  background-color: #f5f5f5;  */border-radius: 1rem; box-sizing: border-box; overflow: hidden;}
.store-con-left:before {position: absolute; content: ''; width: 100%; height: 18rem; border-radius: 1rem; bottom: -9rem; left: 0; background: linear-gradient(180deg, #FFFFFF00 0%, #000000 100%) ; opacity: 0; z-index: 1; visibility: hidden; transition: all 0.3s; transition-property: opacity, visibility;}
.store-con-left.scroll:before {opacity: 0.38; visibility: visible;}
.store-tab-wrapper-style {width: 100%; height: 60px;}
.store-tab-list-style ul {display: flex;}
.store-tab-list-style ul li {width: 50%; height: 60px;}
.store-tab-list-style ul li .store-tab {width: 100%; height: 100%; display: flex; justify-content: center; text-align: center; background: #fff;}
.store-tab-list-style ul li .store-tab em {position: relative; display: inline-flex; align-items:center; height: 100%; padding: 0 2.5rem; font-size: 1.6rem; font-weight: 700; color: #000;}
.store-tab-list-style ul li .store-tab em:before {position: absolute; bottom: 0; left: 50%; width: 0; height: 2px; background-color: #000; content: '';  transition: var(--transition-custom);transition-property: width, left;}
.store-tab-list-style ul li.selected .store-tab {background: #F5F5F5; border-radius: 1rem 1rem 0 0;}
.store-tab-list-style ul li.selected .store-tab em:before {width: 100%;left: 0;}

.store-tab-content-style {height: calc(100% - 60px); }
.store-tab-con {position: relative; padding: 5rem 0 0; height: 100%; box-sizing: border-box; background-color: #f5f5f5; overflow: hidden;}
.store-tab-con.store-tab-con01 {border-radius:  0 1rem 0 0;}
.store-tab-con.store-tab-con02 {border-radius: 1rem 0 0 0;}
.store-tab-con.tab01-active {border-radius:  0 1rem 0 0;}
.store-tab-con.tab02-active {border-radius: 1rem 0 0 0;}
.store-search-form {padding: 0 3rem;}
.store-search-form + .store-search-form{margin-top: 2rem;}
.store-search-form .tit{font-size: 1.6rem; font-weight: 700; color: #000; margin-bottom: 1rem;}
.input-button-group{/* padding: 1rem 1rem 1rem 2rem;  */width: 100%; height: 6rem; background-color: #fff; border-radius: 1rem; box-sizing: border-box; display: flex; align-items: center;}
.input-button-group .board-custom-select-box{width: 100%; height: 6rem; font-size: 1.6rem; font-weight: 500; color: #000; appearance: none; box-sizing: border-box; border: 0;}
.input-button-group .custom-select-trigger {background-color: #fff; border-radius: 1rem;  line-height: 6rem; padding: 0 1rem 0 2rem;}
.input-button-group .custom-select-trigger:after {content: '\e936';}
.input-button-group .custom-select-wrapper .custom-select.opened .custom-select-trigger {border-radius: 1rem 1rem 0 0;  }
.input-button-group .board-custom-select-box .custom-option-drop-list {border-color:#fff; background: #f2f2f2; right: 0; left: 0;/*  max-height: none;  */border-top: 0;}
.input-button-group .board-custom-select-box .custom-option-item {padding: 1rem 1rem 1rem 2rem;}
.input-button-group .board-custom-select-box .custom-option-item.selection {background: #f2f2f2; font-weight: 600;}
.input-button-group .board-custom-select-box .custom-option-item:hover ,
.input-button-group .board-custom-select-box .custom-option-item.selection:hover {background: #fff;}

.input-button-group .btn{width: 10rem; height: 4rem; font-size: 1.5rem; color: #fff; background-color: #000; border-radius: 0.6rem; margin-right: 1rem;}

.store-search-result-box{height: calc(100% - 1px - 23.6rem); margin-top: 4.5rem; padding: 0 1rem 0 3rem; position: relative;}
.store-search-reset-btn{position: absolute; top: -15px; left: 50%; margin-left: -50px; width: 100px; height: 30px; font-size: 14px; font-weight: 600; color: #000; background-color: #fff; border: 1px solid #CFCFCF; border-radius: 100px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; z-index: 10;}
.store-search-reset-btn i{position: relative; left: -0.2rem; margin-right: 0.8rem; font-weight: 400; transform: rotate(90deg)}

.store-search-result-list{position: relative; border-radius: 1rem; padding-top: 4.5rem; height: 100%;/* 위에 높이 만큼 빼기! */ overflow-x: hidden; overflow-y: auto; box-sizing: border-box; padding-right: 1.3rem;}
.store-search-result-box:before {position: absolute; content: ''; width: calc(100% - 6rem); left: 3rem; top: 0; height: 1px; background: #CFCFCF; z-index: 1;}
.store-search-result-list::-webkit-scrollbar {
	width: 7px;
}
.store-search-result-list::-webkit-scrollbar-track {
	background-color: rgba(0,0,0,0.1);
	border-radius: 7px
}
.store-search-result-list::-webkit-scrollbar-thumb {
	background-color: #404040;
	border-radius: 7px
} 
.store-search-result-item {position: relative;background: #fff; border-radius: 1rem;}
.store-search-result-item + .store-search-result-item {margin-top: 1rem;}
.store-search-result-item:before {position: absolute; content: ''; top: 0; left: 0; width: 100%; height: 100%; border-radius: 1rem; border: 2px solid var(--main-color); box-sizing: border-box; transition: all 0.3s; opacity: 0;}
.store-search-result-item.on:before {opacity: 1;}

.store-search-result-item .inner {position: relative;z-index: 1; padding: 2rem 3rem 3rem; }
.store-search-result-item .tit-box {display: flex; align-items: center; justify-content: space-between; padding-bottom: 1rem; border-bottom: 1px solid #000;}
.store-search-result-item .tit-box .tit {position: relative; width: calc(100% - 10rem); padding-left: 2.3rem; font-size: 2rem; color: #000; font-weight: 700; line-height: 1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; box-sizing: border-box;}
.store-search-result-item .tit-box .tit:before {position: absolute; content: '\eb59'; font-family: xeicon; font-size: 2rem; color: #000; left: 0; top: 0; z-index: 1;}
.store-search-result-item .tit-box .btn {position: relative; z-index: 2; display: flex; margin: 0 -0.4rem; z-index: 2;}
.store-search-result-item .tit-box .btn a {width: 4rem; height: 4rem; margin: 0 0.4rem; display: flex; align-items: center; justify-content: center; border-radius: 0.5rem; font-size: 1.5rem;  box-sizing: border-box;background-color: #fff;}
.store-search-result-item .tit-box .btn a.view-btn {background-color: var(--main-color); color: #fff;}
.store-search-result-item .tit-box .btn a.inquiry-btn {border: 2px solid #000; color: #000;}
.store-search-result-item .info-box {display: flex; flex-wrap: wrap; margin: -0.1rem -0.5rem; padding-top: 2rem;}
.store-search-result-item .info-box span {display: inline-block; padding-left: 1.3rem; position: relative; margin: 0.1rem 0.5rem; font-size: 1.5rem; font-weight: 500; line-height: 1.4; box-sizing: border-box;}
.store-search-result-item .info-box span:before {position: absolute; content: ''; width: 0.8rem; height: 0.8rem; border-radius: 0.8rem; left: 0; top: 0.6rem;}
.store-search-result-item .info-box span.type01:before {background-color: var(--main-color);}
.store-search-result-item .info-box span.type02:before {background-color: #00A7FB;}
.store-search-result-item .info-box span.type03:before {background-color: #EE58FF;}
.store-search-result-item .info-box span.type04:before {background-color: #22F2B1;}
.store-search-result-item .info-box span.type05:before {background-color: #F2E422;}
/* 오른쪽 */
.store-con-right{width: 69.77%; height: 100%; padding-left: 2rem; box-sizing: border-box;}

/* ****************
 * 공통
**************** */
#map {width: 100%; height: 100%; border-radius: 1rem;}
.pac-container {display: none !important;}
@keyframes bounce-in {
  0% {
    transform: scale(0.5) translateY(50px);
    opacity: 0;
  }
  60% {
    transform: scale(1.2) translateY(-10px);
    opacity: 1;
  }
  80% {
    transform: scale(0.95) translateY(5px);
  }
  100% {
    transform: scale(1) translateY(0);
  }
}
.property {
  transform-origin:center; animation: bounce-in 0.6s ease;
}

/* ****************
 * 닫혀있을때 스타일
**************** */
.property {position: relative; width: auto; height: auto;}
.property .icon {width: 65px; height: 65px; display: flex; align-items: center; justify-content: center; background: #fff; backdrop-filter: blur(15px); border:3px solid var(--main-color); border-radius: 50%;  transition: all 0.3s ease-out;}
.property .icon img {height: 30px;}

/* ****************
 * 열렸을때 스타일
**************** */
.property.highlight {width: auto; height: auto;}
.property.highlight .details {visibility: visible; opacity: 1;}
.property.highlight .icon{}

/* 내부 정보 */
.property .details {position: absolute; bottom: calc(100% + 20px); left: 50%; transform: translateX(-50%); visibility: hidden; opacity: 0; width: 280px; padding: 20px; display: flex; flex-direction: column; flex: 1; background-color: #fff; border-radius: 8px; box-shadow: 6px 6px 6px rgba(0,0,0,0.15); transition: all 0.3s ease-out; box-sizing: border-box;}
.property .details::after {position: absolute; bottom: -11px; left: 50%; margin-left: -12.5px; width: 25px; height: 12px; background: #fff; -webkit-clip-path: polygon(0 0, 50% 100%, 100% 0); clip-path: polygon(0 0, 50% 100%, 100% 0); content: "";}
.property .name{font-size: 24px; line-height: 1.3; font-weight: 700; color: #000;}
.property .address {margin-top: 10px; font-size: 14px; line-height: 1.5; color: #444;}
.property .tel {margin-top: 5px; font-size: 14px;  line-height: 1.5; color: #444;}

/* 스토어 팝업 */
.store-modal-content { position: relative; width: 96%;max-width: 600px; height: calc(100vh - 100px); margin: 50px auto;}
.store-modal-close-btn {position: absolute; top: -4rem; left: 50%; margin-left: -4rem; width: 8rem; height: 8rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; border: 1rem solid #fff; background-color :#EEEEEE; font-size: 3.6rem; color: #000; box-sizing: border-box;} 
.store-pop-inner-box {height: 100%; padding: 6rem; background-color: #fff; border-radius: 2rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.store-pop-con {height: 100%;}
.store-pop-con .store-pop-tit {text-align: center; font-size:3.2rem; font-weight: 800; letter-spacing: -0.04em; color: #000; line-height: 1.2; margin-bottom: 2rem;}
.store-pop-con-inner {height: calc(100% - 5.9rem); overflow-x: hidden; overflow-y: auto;  }
.store-pop-con-inner::-webkit-scrollbar {
	width: 7px;
}
.store-pop-con-inner::-webkit-scrollbar-track {
	background-color: rgba(0,0,0,0.1);
	border-radius: 7px
}
.store-pop-con-inner::-webkit-scrollbar-thumb {
	background-color: #404040;
	border-radius: 7px
} 
.store-pop-con .store-pop-img {display: block; position: relative; width: 100%; height: 0; padding-top: 62.5%; border-radius: 2rem; overflow: hidden;  margin-bottom: 1rem;}
.store-pop-con .store-pop-img img {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.store-pop-con .store-pop-info dl {padding: 3rem 0; border-bottom: 1px solid rgba(0,0,0,0.1);}
.store-pop-con .store-pop-info dl:last-of-type {border-bottom: 0; padding-bottom: 0;}
.store-pop-con .store-pop-info dl dt {font-size: 2rem; font-weight: 700; letter-spacing:-0.023em; color: #000; line-height: 1.3; padding-right: 1rem; box-sizing: border-box; margin-bottom: 1.5rem;}
.store-pop-con .store-pop-info dl dd {}
.store-pop-con .store-pop-info dl dd .txt {position: relative; padding-left: 1rem; font-size: 1.6rem; font-weight: 400; letter-spacing: -0.024em; color: rgba(0,0,0,0.5); line-height: 1.7;}
.store-pop-con .store-pop-info dl dd .txt:before {position: absolute; content: '*'; left: 0; top: 0;}
.store-cate-list {display: flex; flex-wrap: wrap; margin: -0.3rem -1.2rem;}
.store-cate-list li {margin: 0.3rem 1.2rem; position: relative; padding-left: 1.8rem; font-size: 1.8rem; font-weight: 500; line-height: 1.6; color: #000;}
.store-cate-list li:before {position: absolute; content: ''; width: 0.8rem; height: 0.8rem; border-radius: 0.8rem; top: 1rem; left: 0; }
.store-cate-list li.tyle01:before {background-color: var(--main-color);}
.store-cate-list li.tyle02:before {background-color: #00A7FB;}
.store-cate-list li.tyle03:before {background-color: #EE58FF;}
.store-cate-list li.tyle04:before {background-color: #22F2B1;}
.store-cate-list li.tyle05:before {background-color: #F2E422;}


@media all and (max-width:1280px){
	/* ****************
	 * 오피스
	**************** */
	.office-con-left {padding: 2rem 1rem 2rem 2rem;}
	.office-search-result-list {}
	.office-search-result-item .inner {padding: 3rem 2rem;}
	.office-search-result-item .tit {padding-bottom: 1.5rem; margin-bottom: 1.5rem;}
	.office-search-result-item dt  {width: 100%; margin-bottom: 0.3rem;  font-size: 1.4rem;}
	.office-search-result-item dd {width: 100%; font-size: 1.4rem;}

	/* ****************
	 * 스토어
	**************** */
	.store-tab-con {padding: 3rem 0 0;}
	.store-search-form {padding: 0 2rem;}
	.store-search-result-box {height: ; padding: 0 1rem 0 2rem;}
	.store-search-result-box:before {width: calc(100% - 5rem); left: 2rem;}
	.store-search-result-list {}
	.store-search-result-item .inner { padding: 2rem 2rem 7rem;}
	.store-search-result-item .tit-box {flex-direction: column-reverse;    align-items: flex-end;}
	.store-search-result-item .tit-box .tit {width: 100%; margin-top: 1rem; font-size: 1.8rem;}
	.store-search-result-item .tit-box .btn {position: absolute; bottom: 2rem; right: 2rem;}
		
	.input-button-group .btn {width: 8rem;}
}
@media all and (max-width:800px){
	/* ****************
	 * 오피스
	**************** */
	.office-con {position: relative; }
	.office-con-left {width: 100%; height: 30rem; margin-bottom: 1rem;}
	.office-search-result-list {height: calc(30rem - 4rem);}
	.office-con-right { position: relative;  width: 100%;padding-left: 0;  height: 0;  padding-top: 100%; padding-left: 0;}

	/* ****************
	 * 스토어
	**************** */
	.store-con-wrap {height: auto;}
	.store-con {position: relative; }
	.store-con-left {width: 100%; height: 56rem; margin-bottom: 1rem;}
	.store-con-right {position: relative; width: 100%; padding-left: 0; height: 0; padding-top: 100%;}
	.store-search-result-box { margin-top: 3.5rem;height: calc(100% - 1px - 22.6rem);}
	.store-search-result-list {padding-top: 3.5rem; }

	#map {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

	/* 스토어 팝업 */
	.store-modal-close-btn {width: 6rem;height: 6rem; top: -3rem; margin-left: -3rem; font-size:3rem;}
	.store-pop-inner-box { padding: 3.5rem 3rem 3rem;}
	.store-pop-con .store-pop-tit {font-size: 2.8rem;}
	.store-pop-con .store-pop-info dl dt {font-size: 2rem;}
	.store-pop-con .store-pop-info dl dd {}
	.store-cate-list li {font-size: 1.6rem;}
	.store-cate-list li:before {top: 0.8rem;}
	.store-pop-con .store-pop-info dl dd .txt {font-size: 1.6rem;}
}


/* ****************** 02 H 파트너스 :: 02 엔드 이펙터 ********************** */
/* 리스트페이지 */
.effector-con {padding-top: 4.5rem;}
.effector-con .bbs-no-list {border-top: 1px solid #000;}
.effector-list {display: flex; flex-wrap: wrap; margin: -2rem; padding-bottom: 4rem;}
.effector-list li {width: calc(25% - 4rem); margin: 2rem;}
.effector-list li a {display: block; width: 100%; border-radius: 1rem; border: 2px solid #F5F5F5; box-sizing: border-box;}
.effector-list li a .img-box {position: relative; width: 100%; height: 0; padding-top: 100%; border-radius: 1rem 1rem 0 0; overflow: hidden;}
.effector-list li a .txt-box {border-radius: 0 0 1rem 1rem; padding: 4rem; background-color: #F5F5F5;}
.effector-list li a .txt-box .category {display: block; font-size: 1.6rem; letter-spacing:-0.01em; color: var(--main-color); line-height: 1.2; margin-bottom: 1.5rem;}
.effector-list li a .txt-box .tit {font-size: 2rem; font-weight: 700; letter-spacing: -0.04em; color: #000; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.effector-list li a .txt-box .txt {font-size: 1.6rem; font-weight: 400; letter-spacing: -0.01em; color: rgba(0,0,0,0.5); line-height: 1.6; margin-top:1.5rem ;}

@media all and (max-width:1280px){
	.effector-list li {width: calc(33.33% - 4rem);}
}
@media all and (max-width:800px){
	.effector-list {margin: -1rem;}
	.effector-list li {width: calc(50% - 2rem); margin: 1rem;}
	.effector-list li a .txt-box {padding: 2.5rem 2rem;}
}
@media all and (max-width:480px){
	.effector-list li {width: calc(100% - 2rem); }
}

/* 뷰페이지 */
.effector-view-top {display: flex; padding: 8rem 0 4.5rem; border-bottom: 1px solid #000;}
.effector-view-info-con {width: calc(100% - 40rem); padding-right: 20rem; box-sizing: border-box;}
.effector-view-info-con .category {display: block; font-size: 2rem; font-weight: 700; letter-spacing: -0.01em; color: var(--main-color); line-height: 1.7; margin-bottom: 2rem;}
.effector-view-info-con .tit {font-size: 6.4rem; font-weight: 700; letter-spacing: -0.04em; color: #000; line-height: 1.125;}
.effector-view-info-con .txt {font-size: 2rem; font-weight: 400; letter-spacing: -0.01em; color: rgba(0,0,0,0.5); line-height: 1.3; margin-top: 2rem;}
.effector-view-info-con .btn-box {display: flex; margin: 0 -1rem; padding-top: 6rem;}
.effector-view-info-con .btn-box a {display: flex; align-items: center; justify-content: center; text-align: center; width: calc(50% - 2rem); margin: 0 1rem; max-width: 24rem; height: 6rem;  border-radius: 4rem; font-size: 1.6rem;letter-spacing: -0.036em; box-sizing: border-box;}
.effector-view-info-con .btn-box a:before {border: 2px solid #000; border-radius: 4rem;}
.effector-view-info-con .btn-box a em { font-weight: 600; }
.effector-view-info-con .btn-box .inquiry-btn {background-color: #000; color: #fff;}
.effector-view-info-con .btn-box .inquiry-btn:hover {color: #000;}
.effector-view-info-con .btn-box .link-btn {color: #000;}
.effector-view-info-con .btn-box .link-btn i {position: relative; font-size: 2.4rem; margin-left: 1rem; z-index: 1;    transition: var(--transition-custom);}
.effector-view-info-con .btn-box .link-btn .cm-fill {background: #000;}
.effector-view-info-con .btn-box .link-btn:hover {color: #fff;}
.effector-view-info-con .btn-box .link-btn:hover i {color: #fff;}

.effector-view-img-con {width: 40rem;}
.effector-view-img-list {width: 40rem; height: 40rem;}
.effector-view-img-list li span {display: block; position: relative; width: 100%; height: 0; padding-top: 100%; background: #F5F5F5; }
/* .effector-view-img-list li span img {    mix-blend-mode: multiply; } */
.effector-view-img-control {display: flex; align-items: center; justify-content: space-between; margin-top: 1.5rem;}
.effector-view-img-control .count-box span {position: relative; /* width: 2.5rem;  */display: inline-block; font-size: 1.6rem; font-weight: 700; letter-spacing: -0.036em; color: #DDDDDD; padding: 0 0.7rem;}
.effector-view-img-control .count-box span em {font-weight: 700;}
.effector-view-img-control .count-box .cur-num {padding-left: 0;}
.effector-view-img-control .count-box .total-num {padding-right: 0;}
.effector-view-img-control .count-box .cur-num em {color: #000;}
.effector-view-img-control .count-box .cur-num:before {position: absolute; content: '/'; color: #DDDDDD; right: -0.2rem; top: -0.1rem;}
.effector-view-img-control .arrow-box button {font-size: 4.8rem; color: #DDDDDD; transition : all 0.4s;}
.effector-view-img-control .arrow-box button:hover {color: #000;}
.effector-view-con {padding: 10rem 0; border-bottom: 1px solid #000;}
.effector-view-con-tit {text-align: center; font-size: 2.4rem; font-weight: 700; letter-spacing: -0.024em; color: #000; line-height: 1.4; margin-bottom: 8rem;}
.effector-view-con.effector-spec .effector-view-con-tit  {margin-bottom: 4rem;}

.effector-desc-con {display: flex;}
.effector-desc-con + .effector-desc-con {padding-top: 8rem;}
.effector-desc-con .effector-desc-tit {width: 14.24%; padding-right: 1rem; box-sizing: border-box;}
.effector-desc-con .effector-desc-tit strong {font-size: 2rem; letter-spacing: -0.04em; color: #000; line-height: 1.625; }
.effector-desc-con .effector-desc-txt {width: 85.76%; } 
.effector-desc-con .effector-desc-txt .txt {font-size: 1.6rem; font-weight: 400; letter-spacing: -0.01em; color: rgba(0,0,0,0.5); line-height: 1.875;}

.effector-spec-con + .effector-spec-con {padding-top: 6rem;}
.effector-spec-con .effector-spec-tit {font-size: 2.4rem; font-weight: 700; letter-spacing: -0.035em; color: #000; line-height: 1.4; margin-bottom: 2rem;}
.effector-spec-tbl {width: 100%;}
.effector-spec-tbl thead th {border-top: 1px solid #000000;}
.effector-spec-tbl thead th,
.effector-spec-tbl tbody th,
.effector-spec-tbl tbody td {font-size: 1.5rem; font-weight: 400; letter-spacing: -0.024em; color: #000; line-height: 1.3; text-align: left; padding: 1.5rem 2rem; border-bottom: 1px solid #000;}
.effector-spec-tbl thead th,
.effector-spec-tbl tbody th {background: rgba(0,0,0,0.1); font-weight: 600;}

.effector-img-con .img {text-align: center;}
.effector-img-con .img + .img {margin-top: 4rem;}
.effector-img-con .img img {max-width: 100%;}

.effector-view-bottom {padding: 8rem 0; text-align: center;}
.effector-view-bottom .link-btn {/* width: 100%;  */ min-width: 48rem; padding: 0 3rem; display: inline-flex; align-items: center; justify-content: center; height: 6rem; margin: 0 auto; border-radius: 4rem; background: #000000; margin: 0 auto; font-size: 1.6rem; font-weight: 600; letter-spacing:-0.036em; color: #fff; line-height: 1.3; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.effector-view-bottom .link-btn:before { border-radius: 4rem !important;}
.effector-view-bottom .link-btn i {position: relative; z-index: 1; margin-left: 1rem; font-size: 2.4rem; color: #fff; transition: var(--transition-custom);}
.effector-view-bottom .link-btn strong {font-weight: 600; position: relative; z-index: 1; }
.effector-view-bottom .link-btn strong em {font-weight: 600;}
.effector-view-bottom .link-btn:hover i {color: #000;}
.effector-view-bottom .link-btn:hover .cm-fill {width: 60vw; height: 60vw; }

@media all and (max-width:1280px){
	.effector-view-info-con {padding-right: 10rem;}
}
@media all and (max-width:800px){
	.effector-view-top {flex-direction: column;}
	.effector-view-img-con {width: 100%; }
	.effector-view-img-list  {margin: 0 auto;}
	.effector-view-info-con {width: 100%; padding-right: 0; margin-bottom: 5rem;}
	.effector-view-info-con .tit {font-size: 4rem;}
	.effector-view-info-con .btn-box { padding-top: 5rem; margin: 0 -0.5rem;}
	.effector-view-info-con .btn-box a { width: calc(50% - 1rem); margin: 0 0.5rem; max-width: none;}

	.effector-view-con {}
	.effector-view-con-tit {margin-bottom: 6rem;}
	.effector-desc-con {flex-wrap: wrap;}
	.effector-desc-con + .effector-desc-con {padding-top: 6rem;}
	.effector-desc-con .effector-desc-tit {width: 100%; padding-right: 0; padding-bottom: 1rem;}
	.effector-desc-con .effector-desc-txt {width: 100%;}

	.effector-view-bottom .link-btn {min-width: 0; width: 100%;}
}
@media all and (max-width:800px){
	.effector-view-img-list  {width: 100%; height: 100%;}
}


/* ****************** 05 회사소개 :: 한화로보틱스 소개 ********************** */
.company-intro-page {margin-top: calc(-1*(var(--header-height) + var(--sub-menu-height) + 4rem));}
/* 소개 */
#introTop { width: 100%;}
.company-intro-top {position: relative; width: 100%; overflow: hidden;}
.company-intro-top .intro-top-bg {position: fixed; top: 0; width: 100%; height: 100vh; overflow: hidden;}
.company-intro-top .intro-top-bg span{display: block; position: absolute; top:0; left:0; width:100%; height:100%; filter: blur(0); transition: all 0.4s ease-in-out;}
.company-intro-top .intro-top-bg span img{height:100%; width:100%; object-fit: cover;}

.intro-con01 {position: relative; width: 100%; height: 100vh; box-sizing: border-box;}
.intro-con01-inner {position: absolute; left: 50%; top: 50%; width: 81%; margin-top: -12rem; margin-left: -40.5%;}
.intro-con01-inner .intro-con01-tit{position: relative; font-size:8.4rem; line-height:1.13; font-weight:700; color:#fff; transition:all 1.3s ease-in-out; opacity:0; letter-spacing:0.2em; white-space:nowrap; }
.intro-con01-inner .intro-con01-tit .txt-effect{position: absolute; top:0; left:0; content:attr(data-label); display: block; height:100%; filter:blur(5px);  overflow:hidden; white-space:nowrap; transition:width 0s ease-in-out; transition-delay:0s; width:0; z-index: -1;}
.intro-con01-inner .intro-con01-tit .txt-effect em{position: absolute; top:0; left:0; font-weight:inherit; font-style:inherit; white-space:nowrap;color: var(--main-color);}
.intro-con01-inner .intro-con01-txt {font-size: 2rem; font-weight: 500; opacity:0; letter-spacing:0.2em; color: #fff; line-height: 1.7; margin-top: 4rem; text-align: center; transition: 1.3s ease-in-out;}
/* ar / al */
.intro-con01-inner .intro-con01-tit.cm-al{transform:translateX(-40%);}
.intro-con01-inner .intro-con01-tit.cm-ar{transform:translateX(40%);}
.intro-con01-inner .intro-con01-tit.cm-ar .txt-effect,
.intro-con01-inner .intro-con01-tit.cm-ar .txt-effect em{right:0; left:auto;}

.company-intro-top.active .intro-con01-inner .intro-con01-tit .txt-effect {width:100%; transition-delay:0s;}
.company-intro-top.active .intro-con01-inner .intro-con01-tit.cm-al{transform:translateX(0%); opacity:1; letter-spacing:-0.02em;}
.company-intro-top.active .intro-con01-inner .intro-con01-tit.cm-ar{transform:translateX(0%); opacity:1; letter-spacing:-0.02em;}
.company-intro-top.active .intro-con01-inner .intro-con01-txt {opacity:1; letter-spacing:-0.02em;}

.company-intro-top.active .intro-con01-inner.hide .intro-con01-tit .txt-effect {width:0; transition-delay:0.3s;}
.company-intro-top.active .intro-con01-inner.hide .intro-con01-tit.cm-al{transform:translateX(-40%); opacity:0; letter-spacing:0.2em}
.company-intro-top.active .intro-con01-inner.hide .intro-con01-tit.cm-ar{transform:translateX(40%); opacity:0; letter-spacing:0.2em}
.company-intro-top.active .intro-con01-inner.hide .intro-con01-txt {opacity:0; letter-spacing:0.2em}

#introMiddle {position: relative; height: 100vh; width: 100%; }
#introCon02 { position: absolute; height: 100vh; width: 100%;  top: 0;   left: 0; overflow: hidden; display: flex; align-items: center;}
.intro-con02 {position: relative; width: 100%; height: 100vh; display: flex; align-items: center;}
.intro-con02-inner { position: relative; }
.intro-con02-inner .txt-top {}
.intro-con02-inner .sub-tit {display: block; font-size: 1.5rem; font-weight: 600; letter-spacing: -0.02em; color: var(--main-color); line-height: 1.86;}
.intro-con02-inner .intro-con02-txt {position: relative; z-index: 1; }
.intro-con02-inner .intro-con02-txt.m-ver {display: none;}
.intro-con02-inner .intro-con02-txt .text{position:relative; font-size: 5.4rem; line-height: 1.48; letter-spacing: -0.02em; font-weight: 700; color: rgb(255, 255, 255, 0.25); background: linear-gradient(to right, #fff, #fff) no-repeat;  -webkit-background-clip: text;  background-clip: text; background-size: 0%;}
/* .intro-con02-inner .intro-con02-txt .text.active {background-position-x: 0%;} */
.intro-con02-inner .txt-bottom {opacity: 0; margin-top: 9rem; transition: all 0.4s ease-in-out}
.intro-con02-inner .txt-bottom .txt {width: 50%; margin: 0 0 0 auto; padding-right: 1rem; box-sizing: border-box; font-size: 2rem; font-weight: 400; letter-spacing: -0.02em; color: rgba(255,255,255,0.4); line-height: 1.7;}


#introCon03 {position: absolute; bottom: 0; overflow: hidden; width: 100%;height: 0; background: rgba(28, 4, 4, 1);  z-index: 10; transition: var(--transition-custom2); transition-property: background;}
.intro-con03 {width: 100%; height: 105vh; display: flex; align-items: center;  box-sizing: border-box;}
.intro-con03-inner {opacity: 0; width: 100%; height: 100vh; transition: all 0.4s; box-sizing: border-box;}
.intro-con03-list {position: relative; top: 250px;}
.intro-con03-list li {display: flex; flex-wrap: wrap; padding-bottom: 2.8rem;}
.intro-con03-list li .intro-con03-txt {position: relative; width: calc(100% - 60rem); padding: 2.8rem 2.5rem 2.8rem 0; box-sizing: border-box;  height: 13.2rem; transition: var(--transition-custom2); transition-property: height;}
.intro-con03-list li .intro-con03-txt .tit {display: block; font-size: 6.4rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; color: rgba(255,255,255,0.15); transition: var(--transition-custom);}
.intro-con03-list li .intro-con03-txt dl {position: absolute; top: 20rem; transition: var(--transition-custom2); opacity: 0; transition-property: opacity; }
.intro-con03-list li .intro-con03-txt dl dt,
.intro-con03-list li .intro-con03-txt dl dd {position: relative; padding-left: 4.4rem;}
.intro-con03-list li .intro-con03-txt dl dt {font-size: 3.2rem; font-weight: 700; letter-spacing: -0.02em; color: #FFFFFF; line-height: 1.3; }
.intro-con03-list li .intro-con03-txt dl dt:before {position: absolute; content: '\e92b'; font-family: xeicon; font-size: 3.4rem; color: var(--main-color); left: 0; top: -0.1rem; }
.intro-con03-list li .intro-con03-txt dl dd {font-size: 2rem; font-weight: 400; letter-spacing: -0.02em; color: rgba(255,255,255,0.5); line-height: 1.7; margin-top: 2.5rem;}
.intro-con03-list li .intro-con03-img {width: 60rem; height: 13.2rem; border-radius: 2rem; overflow: hidden; transition: var(--transition-custom2); transition-property: height;} 
.intro-con03-list li .intro-con03-img span {position: relative;display: block; width: 100%; height: 100%; border-radius: 2.5rem; overflow: hidden; }
.intro-con03-list li .intro-con03-img span img {position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 100%;}

#introBottom {position: relative; z-index: 2; background: #000;}
.company-intro-bottom {}
.intro-con04 {padding: 20rem 0 10rem;}
.intro-tit-box {text-align: center;}
.intro-tit-box .intro-sub-tit {display: block; font-size: 1.5rem; font-weight: 600; letter-spacing: -0.02em; color: var(--main-color); margin-bottom: 2rem;}
.intro-tit-box .intro-tit {font-size: 6.4rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; line-height: 1.3;} 
.intro-con04 .intro-tit-box {margin-bottom: 10rem;}
.intro-value-con {position: relative; max-width: 1140px; margin: 0 auto;} 
.intro-value-con:before {position: absolute; content: ''; width: 97.4rem; height: 97.4rem; top: 50%; left: 50%; margin-left: -48.7rem; margin-top: -48.7rem; z-index: -1; background: radial-gradient(closest-side at 50% 50%, rgba(243, 115, 33, 1) 0%,  rgba(243, 115, 33, 0) 100%); opacity: 0.3;} 
.intro-value-bg {position: absolute; top: 50%; left: 50%; margin-left: -35rem; margin-top: -35rem; width: 70rem; height: 70rem; z-index: -1;}
.intro-value-bg .bg-circle {position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.intro-value-bg .bg-circle .circle {position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%);  animation:introCircleRotate 10s 0s linear infinite;}
.intro-value-bg .bg-circle .circle .inner-circle {position: absolute;top: 50%;  left: 50%;transform:translate(-50%, -50%); width: 100%;height: 100%; border: 2px solid rgba(255,255,255,0.05); border-radius: 50%; box-sizing: border-box; transition: all 1.5s ease-in-out;}
.intro-value-bg .bg-circle .circle.circle02 .inner-circle{margin-top:-2rem; margin-left:3rem; animation:introCircleMove1 6s 0s linear infinite; will-change:margin}
.intro-value-bg .bg-circle .circle.circle03 .inner-circle{margin-top:2rem; margin-left:-3rem; animation:introCircleMove2 6s 0s linear infinite; will-change:margin}

@keyframes introCircleRotate {
	0% {
		transform: translate(-50%, -50%) rotate(0);
	}
	100% {
		transform: translate(-50%, -50%) rotate(360deg);
	}
}
@keyframes introCircleMove1{
	0%{margin-top:-2rem; margin-left:3rem;}
	50%{margin-top:2rem; margin-left:-3rem; }
	100%{margin-top:-2rem; margin-left:3rem;}
}
@keyframes introCircleMove2{
	0%{margin-top:2rem; margin-left:-3rem; }
	50%{margin-top:-2rem; margin-left:2rem;}
	100%{margin-top:2rem; margin-left:-3rem;}
}
.intro-value-bg .bg-logo {position: relative; width: 100%; height: 100%; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
/* .intro-value-bg .bg-logo:before {position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; background: radial-gradient(closest-side at 50% 50%, rgba(243, 115, 33, 1) 0%,  rgba(243, 115, 33, 0) 100%); opacity: 0.3; z-index: -1;} */
.intro-value-list {position: relative; z-index: 1;}
.intro-value-list li {display: flex; box-sizing: border-box;}
.intro-value-list li.list01 {justify-content: center;}
.intro-value-list li.list02 {justify-content: space-between; margin-top: 6.9rem;}
.intro-value-list li.list03 {justify-content: space-between; padding: 0 11rem;  margin-top: 16rem;}
.intro-value-list li .intro-value-item {position: relative; opacity: 0; width: 35rem; padding: 3.5rem 4rem 4rem; border-radius: 2rem; background: rgba(255,255,255,0.05); backdrop-filter: blur(1.5rem); box-sizing: border-box; transition: var(--transition-custom2);}
/* .intro-value-list li .intro-value-item:before {position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; border-radius: 2rem; } */
.intro-value-list li .intro-value-item.item01 {transform: translate(0, -30px);}
.intro-value-list li .intro-value-item.item02 {transform: translate(-30px, 0);}
.intro-value-list li .intro-value-item.item03 {transform: translate(30px, 0);}
.intro-value-list li .intro-value-item.item04 {transform: translate(-30px, 30px);}
.intro-value-list li .intro-value-item.item05 {transform: translate(30px, 30px);}
.intro-value-list li .intro-value-item dl dt {font-size: 2rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; line-height: 1.6;}
.intro-value-list li .intro-value-item dl dt span {font-size: 4rem;}
.intro-value-list li .intro-value-item dl dd {font-size: 1.6rem; font-weight: 500; letter-spacing: -0.01em; color: rgba(255,255,255,0.5); line-height: 1.8; padding-top: 1.5rem;}
.intro-value-list li .intro-value-item .icon {display: block; text-align: right; margin-top:1.5rem;}
.intro-value-list.animated li .intro-value-item {opacity: 1; transform: translate(0, 0);}
.intro-value-list.animated li .intro-value-item.item02 {transition-delay: 1.2s;}
.intro-value-list.animated li .intro-value-item.item03 {transition-delay: 0.3s;}
.intro-value-list.animated li .intro-value-item.item04 {transition-delay: 0.9s;}
.intro-value-list.animated li .intro-value-item.item05 {transition-delay: 0.6s;}

.intro-con05 {padding: 10rem 0 20rem;}
.intro-con05 .intro-tit-box {margin-bottom: 8rem;}
.intro-mentality-list {}
.intro-mentality-list li {position: relative; height: 44rem;}
.intro-mentality-list li .list-center {position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 88rem; height: 44rem; display: flex;justify-content: center; align-items: center; opacity: 0; transition: all 0.8s ease-in-out;}
.intro-mentality-list li.align-left .list-center {}
.intro-mentality-list li.align-right .list-center {flex-direction: row-reverse;}
.intro-mentality-list li .img-circle {position: absolute; top: 0; left: 0; width: 50%; height: 100%; z-index: 2;}
.intro-mentality-list li .img-circle span { position: relative; display: block; width: 100%; height: 0; padding-top: 100%; border-radius:50%; overflow: hidden;}
.intro-mentality-list li .img-circle span img {position: absolute; top: 0; left: 0;  width: 100%; height: 100%;}
.intro-mentality-list li.align-right .img-circle { left: auto; right: 0;}

.intro-mentality-list li .txt-circle {position: absolute; top: 0; left: 44rem; width: 50%; height: 100%; z-index: 1; }
.intro-mentality-list li.align-right .txt-circle { left: auto; right: 44rem;}
.intro-mentality-list li .txt-circle .circle-inner {position: relative; width: 100%; height: 100%; border-radius: 50%; border: 2px solid #fff; box-sizing: border-box; display: flex; align-items: center; justify-content: center; text-align: center;}

.intro-mentality-list li .txt-circle .circle-inner dl dt {font-size: 3.2rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; line-height: 1.3;}
.intro-mentality-list li .txt-circle .circle-inner dl dd {font-size: 1.6rem; font-weight: 500; letter-spacing: -0.01em; color: rgba(255,255,255,0.5);line-height: 1.875; padding-top: 2rem;}
.afterimage-circle {position: absolute; top: -2px; left: -2px; width: 44rem; height:44rem;border-radius: 50%;border: 2px solid #fff; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.afterimage-circle.circle01 {opacity: 0.9;}
.afterimage-circle.circle02 {opacity: 0.8;}
.afterimage-circle.circle03 {opacity: 0.7;}
.afterimage-circle.circle04 {opacity: 0.6;}
.afterimage-circle.circle05 {opacity: 0.5;}

.intro-mentality-list li.align-right .afterimage-circle {left: auto; right: -2px;}

.intro-mentality-list li.animated .list-center {opacity: 1; }
.intro-mentality-list li.align-left.animated .img-circle {animation: imgCircleLeft 2.0s ease-in-out both;}
.intro-mentality-list li.align-left.animated .txt-circle {animation: imgTextLeft 2.0s ease-in-out both;}
.intro-mentality-list li.align-left.animated .afterimage-circle {animation: leftAfterImage 2.0s ease-in-out both;}

.intro-mentality-list li.align-right.animated .img-circle {animation: imgCircleRight 2.0s ease-in-out both;}
.intro-mentality-list li.align-right.animated .txt-circle {animation: imgTextRight 2.0s ease-in-out both;}
.intro-mentality-list li.align-right.animated .afterimage-circle {animation: rightAfterImage 2.0s ease-in-out both;}


@keyframes imgCircleLeft {
	0% {
		transform: translateX(88rem)
	}
	100% {
		transform: translateX(0)
	}
}
@keyframes imgTextLeft {
	0% {
		transform: translateX(44rem)
	}
	100% {
		transform: translateX(0)
	}
}
@keyframes leftAfterImage {
	0% {
	  transform: translateX(4rem)
	}
	100% {
		transform : translateX(0)
	}
}
@keyframes imgCircleRight {
	0% {
		transform: translateX(-88rem)
	}
	100% {
		transform: translateX(0)
	}
}
@keyframes imgTextRight {
	0% {
		transform: translateX(-44rem)
	}
	100% {
		transform: translateX(0)
	}
}
@keyframes rightAfterImage {
	0% {
	  transform: translateX(-4rem)
	}
	100% {
		transform : translateX(0)
	}
}

.intro-con06 {position: relative; width: 100%; height: 100%;}
.intro-con06-cover {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.intro-con06-cover span {position: absolute; width: 50%; height: 100%; background: #000000; top: 0; z-index: 2;}
.intro-con06-cover span.left-cover {left: 0;}
.intro-con06-cover span.right-cover {right: 0;}

.intro-con06 .intro-video-wrap {position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 0; height: 100%;}
/* .intro-video-wrap .video-iframe-box {position: relative; padding-top: 51.25%; height: 0; background-color: #000; overflow: hidden;}
.intro-video-wrap .video-iframe-box iframe {width: 100vw;height: calc(56.25vw + 300px); min-height: calc(100vh + 300px);min-width: 177.77vh; position: absolute;	top: 50%;left: 50%; transform: translate(-50%, -50%);}
.intro-video-wrap .video-cover-box {position: absolute;top: 0px; left: 0px; width: 100%;height: 100%; overflow: hidden; cursor: pointer;}
.intro-video-wrap .video-cover-box .thumb { display: block;  position: relative; width: 100%; height: 100%;  -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s;  -ms-transition: all 0.4s; transition: all 0.4s;}
.intro-video-wrap .video-cover-box .thumb:before {position: absolute; content: ''; top: 0; left: 0; width: 100%; height: 100%; background: transparent linear-gradient(270deg, #00000000 0%, #000000 100%) 0% 0% no-repeat padding-box; opacity: 0.5;}
.intro-video-wrap .video-cover-box .thumb img {width: 100%; height: 100%;}
.intro-video-wrap .btn-cover {  position: absolute; top: 50%; left: 50%;z-index: 10; margin-left: -6.4rem; margin-top: -6.4rem; width: 12.6rem; height: 12.6rem; z-index: 1;}
.intro-video-wrap .btn-cover button {font-size: 12.6rem; color: #fff; }*/

.intro-video-wrap .background-video-wrapper {position:relative; overflow:hidden; height:100vh; width:100%; background:rgba(28, 4, 4, 1);; padding-top: 0;}
.intro-video-wrap .background-video {position:absolute; top:0; left:0px; width:100%; height:100%}
.intro-video-wrap .background-video iframe{width: calc(100vw + 120px);
	height: calc(56.25vw + 300px); /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
	min-height: calc(100vh + 300px);
	min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	pointer-events:none;
}

@media all and (min-width:801px){
	.intro-con03-list li.intro-con03-item1 .intro-con03-txt {height: 38rem;}
	.intro-con03-list li.intro-con03-item1 .intro-con03-txt .tit {color: #fff;}
	.intro-con03-list li.intro-con03-item1 .intro-con03-txt dl {opacity: 1;}
	.intro-con03-list li.intro-con03-item1 .intro-con03-img {height: 38rem;}
}
@media all and (max-width:1280px){
	.intro-con01-inner .intro-con01-tit {font-size: 6.4rem;}
	.intro-con02-inner .intro-con02-txt .text {font-size: 4.4rem;}
	.intro-con03-list li .intro-con03-txt .tit {font-size: 5.6rem;}
	.intro-con03-list li .intro-con03-txt dl {top: 15rem;}
	.intro-con03-list li .intro-con03-txt dl dt {font-size: 2.8rem;}
}
@media all and (max-width:800px){
	.intro-con01-inner {width: 100%;left: 0; margin-left: 0;}
	.intro-con01-inner .intro-con01-tit {font-size: 4rem;}
	.intro-con01-inner .intro-con01-txt {font-size: 1.8rem;}
	.intro-con02-inner .intro-con02-txt.pc-ver {display: none;}
	.intro-con02-inner .intro-con02-txt.m-ver {display: block;} 
	.intro-con02-inner .intro-con02-txt .text {  font-size: 3.4rem;}
	.intro-con02-inner .txt-bottom {opacity: 1 !important;  margin-top: 6rem;}
	.intro-con02-inner .txt-bottom .txt {width: 100%; padding-right: 0; font-size: 1.8rem;}

	#introMiddle {height: auto;}
	#introCon02 {position: relative; height: auto;}
	.intro-con02 {padding: 10rem 0; height: auto;}
	#introCon03 {position: relative; height: auto;}
	.intro-con03  {padding: 10rem 0; height: auto;}
	.intro-con03-inner {opacity: 1; height: auto;}
	.intro-con03-list {top: 0;}
	.intro-con03-list li {padding-bottom: 4.5rem;}
	.intro-con03-list li .intro-con03-txt {width: 100%; height: auto;}
	.intro-con03-list li .intro-con03-txt dl {position: relative; top: 0; opacity: 1; visibility: visible; padding-top: 2rem;}
	.intro-con03-list li .intro-con03-txt dl dd {margin-top: 1.5rem;}
	.intro-con03-list li .intro-con03-txt dl dt {font-size: 2.4rem;}
	.intro-con03-list li .intro-con03-txt dl dt:before {font-size: 2.8rem; top: -0.2rem;}
	.intro-con03-list li .intro-con03-txt dl dd {font-size: 1.8rem;}
	.intro-con03-list li .intro-con03-txt .tit {color: #fff; font-size: 4rem;}
	.intro-con03-list li .intro-con03-img {position: relative; width: 100%; height: 0; padding-top: 63.33%;}
	.intro-con03-list li .intro-con03-img span {position: absolute; top: 0; left: 0;}
		
	.intro-tit-box .intro-tit {font-size:4rem;}
	.intro-con04 {padding: 10rem 0;}
	.intro-con04 .intro-tit-box {margin-bottom: 4rem;}
	.intro-value-bg {display: none; position: relative; top: 0; left: 0; margin: 0 auto; width:30rem; height: 30rem;}
	.intro-value-bg .bg-logo {padding: 8rem;  box-sizing: border-box;}
	.intro-value-bg .bg-logo img {max-width: 100%;}
	.intro-value-list {margin-top: 4rem;}
	.intro-value-list li {margin: 0 -1rem;}
	.intro-value-list li.list02 {margin-top:2rem;}
	.intro-value-list li.list03 {margin-top: 2rem; padding: 0;}
	.intro-value-list li .intro-value-item {display: flex; flex-direction:column; justify-content: space-between; padding: 3rem; width: calc(50% - 2rem); margin: 0 1rem; background: rgba(255, 255, 255, 0.1);}
	.intro-value-list li .intro-value-item .icon img {height: 36px;}
	.intro-value-list li .intro-value-item dl dt span {font-size: 2.5rem;}
	.intro-mentality-list {padding: 0 var(--area-padding); box-sizing: border-box;}
	.intro-mentality-list li {padding-top: 50%; height: 0;}
	.intro-mentality-list li .list-center {position: absolute; top: 0; width: 100%; height: 100%;}
	.intro-mentality-list li .txt-circle {left: 50%; height: 0; padding-top: 50%;}
	.intro-mentality-list li.align-right .txt-circle {right: 50%;}
	.intro-mentality-list li .txt-circle .circle-inner {position: absolute; top: 0; left: 0;}
	.intro-mentality-list li .txt-circle .circle-inner dl dt {font-size: 2.5rem;}
	.intro-mentality-list li .txt-circle .circle-inner dl dd {line-height: 1.4;}
	.afterimage-circle {width: calc(100% + 4px); height: calc(100% + 4px);}

	.intro-con05 {padding: 10rem 0 12rem;}
	.intro-con06-cover {display: none;}
	.intro-video-wrap .video-cover-box .thumb:before, 
	.intro-video-wrap .video-cover-box .thumb:after {display: none;}
	.intro-video-wrap .btn-cover {width: 6.6rem; height: 6.6rem; margin-left: -3.3rem; margin-top: -3.3rem;}
	.intro-video-wrap .btn-cover button {font-size: 6.6rem;}

	.intro-video-wrap .background-video-wrapper  {height: 0; padding-top: 45.28%;}
	.intro-video-wrap .background-video iframe {min-width: 0; min-height: 0;}
}
@media all and (max-width:480px){
	.intro-con01-inner .intro-con01-tit {font-size: 3rem; line-height: 1.6; transform:translateX(0) !important; text-align: center !important;}
	.intro-con01-inner .intro-con01-tit .txt-effect {line-height: 1.6;}
	.intro-con01-inner .intro-con01-tit .txt-effect,
	.intro-con01-inner .intro-con01-tit .txt-effect em{left:50% !important; right:auto !important; transform:translateX(-50%) !important;}

	.intro-mentality-list li .txt-circle .circle-inner dl dt {font-size: 2.2rem;}
	.intro-mentality-list li .txt-circle .circle-inner dl dd {padding-top: 1.3rem;}
}

/* CI */
.ci-con01 {padding: 10rem 0 12rem; }
.ci-intro-con {position: relative;}
.ci-intro-con .ci-intro-bg {position: absolute; top: 0; left: 50%; margin-left: -24rem; width: 48rem; height: 48rem; border-radius: 50%; border: 5px solid #f8f8f8; box-sizing: border-box; padding: 3.95rem;}
.ci-intro-con .ci-intro-bg span {display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;  border-radius: 50%; background: #f8f8f8; }
.ci-intro-list {position: relative; z-index: 1; display: flex; flex-wrap: wrap; justify-content: flex-end; padding-top:3.5rem;}
.ci-intro-list .ci-intro-item {display: flex; width: 50%;}
.ci-intro-list .ci-intro-item.item01 {flex-direction:row-reverse; padding-right: 9rem; box-sizing: border-box;}
.ci-intro-list .ci-intro-item.item02 { padding-left: 9rem; box-sizing: border-box;}
.ci-intro-list .ci-intro-item.item03 {width: calc(50% + 10rem); margin-top: 13.5rem;}
.ci-intro-item .ci-intro-circle {position: relative; width: 20rem; height: 20rem; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 0.5rem solid var(--main-color); text-align: center; border-radius:50%; backdrop-filter: blur(2rem); -webkit-backdrop-filter: blur(2rem); background-color: rgba(255, 255, 255, 0.3); box-shadow: 0.5rem 0.9rem 4rem rgba(0,0,0,0.1);}
.ci-intro-item .ci-intro-circle:before {position: absolute; content: ''; top:50%; margin-top: -1px; height: 1px; width: 5.8rem; border-top: 1px dashed var(--main-color); z-index: 1;}
.ci-intro-item.item01 .ci-intro-circle:before {left: -5.8rem;}
.ci-intro-item.item02 .ci-intro-circle:before {right: -5.8rem;}
.ci-intro-item.item03 .ci-intro-circle:before {right: -24.8rem; width: 24.8rem;}
.ci-intro-item .ci-intro-circle:after {position: absolute; content: ''; top:50%; margin-top: -4px; height: 8px; width:8px;border-radius:8px; background: var(--main-color); z-index: 2;}
.ci-intro-item.item01 .ci-intro-circle:after {left: -5.8rem;}
.ci-intro-item.item02 .ci-intro-circle:after {right: -5.8rem;}
.ci-intro-item.item03 .ci-intro-circle:after {right: -24.8rem; }
.ci-intro-item .ci-intro-circle .tit-en {display: block; font-size: 1.8rem; font-weight: 700; letter-spacing: -0.02em; color: var(--main-color); }
.ci-intro-item.item01 .ci-intro-circle .tit-en {margin-top: 0.9rem;}
.ci-intro-item.item03 .ci-intro-circle .tit-en {margin-top: 1.3rem;}
.ci-intro-item .ci-intro-txt {position: relative; padding-top: 9.2rem; box-sizing: border-box;}
.ci-intro-item.item01 .ci-intro-txt {text-align: right; width: calc(100% - 20rem); padding-right: 7.5rem;}
.ci-intro-item.item02 .ci-intro-txt {width: calc(100% - 20rem); padding-left: 7.8rem;}
.ci-intro-item.item03 .ci-intro-txt {width: calc(100% - 20rem); padding-left: 26.8rem;}
.ci-intro-item .ci-intro-txt .tit-kr {font-size: 2.4rem; font-weight: 700; letter-spacing: -0.02em; color: #000; line-height: 1.2;}
.ci-intro-item .ci-intro-txt .txt {font-size: 1.6rem; font-weight: 500; letter-spacing: -0.01em; color: rgba(0,0,0,0.5); line-height: 1.625; padding-top: 1.5rem;}

.ci-con02 {}
.ci-con02 .ci-con-tit {font-size: 4rem; font-weight: 700; letter-spacing:-0.02em; color: #000; line-height: 1.2; margin-bottom: 3.5rem; text-align: center;}
.ci-info-con {padding: 4rem 4rem 0; background: #F5F5F5; border-radius: 2rem; margin-bottom: 4rem;}
.ci-logo-con {height:40rem; padding: 2rem 5rem; display: flex; align-items: center; justify-content: center; background: #fff; border-radius: 2rem;}
.ci-logo-con svg {max-width: 100%;}
.ci-color-con {padding: 0 0.5rem; box-sizing: border-box;}
.ci-color-list-con {padding: 6rem 3.5rem 4rem; box-sizing: border-box; border-bottom: 1px solid #DDDDDD;}
.ci-color-list {display: flex;}
.ci-color-list li {position: relative; width: 25%; padding: 0 1rem 0 7rem; padding-top: ; box-sizing: border-box;}
.ci-color-list li:before {position: absolute; content: ''; width: 5rem; height: 5rem; border-radius: 5rem; top: 0; left: 0; }
.ci-color-list li.color01:before {background: #F37321;}
.ci-color-list li.color02:before {background: #F89B6C;}
.ci-color-list li.color03:before {background: #FBB584;}
.ci-color-list li.color04:before {background: #000000;}
.ci-color-list li .color-name {padding-top: 1rem; display: block; font-size: 1.8rem; color: #000; font-weight: 700; letter-spacing: -0.01em; margin-bottom: 1.5rem;}
.ci-color-list li .color-code {display: flex; font-size: 1.2rem; font-weight: 500; color: #000; letter-spacing: -0.01em; line-height: 1.66; } 
.ci-color-list li .color-code dt {width: 4.4rem;}
.ci-color-list li .color-code dd {width: calc(100% - 4.4rem); color: rgba(0,0,0,0.5);}
.color-use {padding: 4rem 3.5rem; box-sizing: border-box;}
.color-use dl {display: flex; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.01em; color: #000; line-height:1.875;}
.color-use dl dt {width: 7.5rem; font-weight: 700; letter-spacing: -0.02em; }
.color-use dl dd {width: calc(100% - 7.5rem); color: rgba(0,0,0,0.5);}
.ci-con02 .cm-btn-controls a i {margin-left:1rem ; position: relative; z-index: 1;}

@media all and (max-width:1280px){
	.ci-intro-con .ci-intro-bg { margin-left: -20rem;width: 40rem; height: 40rem;}
	
	.ci-intro-list {padding-top: 0;}
	.ci-intro-list .ci-intro-item.item03 {width: calc(50% + 8rem); margin-top: 10rem;}
	
	.ci-intro-item .ci-intro-circle {width: 16rem; height: 16rem;}
	.ci-intro-item .ci-intro-circle:before {width: 4rem; }
	.ci-intro-item.item01 .ci-intro-circle:before {left: -4rem;}
	.ci-intro-item.item02 .ci-intro-circle:before {right: -4rem;}
	.ci-intro-item.item03 .ci-intro-circle:before {right: -19rem; width: 19rem;}
	.ci-intro-item.item01 .ci-intro-circle:after {left: -4rem;}
	.ci-intro-item.item02 .ci-intro-circle:after {right: -4rem;}
	.ci-intro-item.item03 .ci-intro-circle:after {right: -19rem; }
	.ci-intro-item .ci-intro-circle .tit-en {font-size: 1.6rem; margin-top: 0.5rem;}
	.ci-intro-item .ci-intro-txt {padding-top: 7rem;}
	.ci-intro-item.item01 .ci-intro-txt { width: calc(100% - 16rem); padding-right: 5.5rem;}
	.ci-intro-item.item02 .ci-intro-txt {width: calc(100% - 16rem); padding-left: 5.5rem;}
	.ci-intro-item.item03 .ci-intro-txt {width: calc(100% - 16rem); padding-left: 20.5rem;}
	
	.ci-color-list-con { padding: 6rem 0 4rem 3.5rem;}
}
@media all and (max-width:800px){
	.ci-con01 {padding: 2rem 0 10rem;}
	.ci-intro-con .ci-intro-bg {display: none;}

	.ci-intro-list .ci-intro-item {width: 100%;}
	.ci-intro-list .ci-intro-item + .ci-intro-item {margin-top: 3rem;}
	.ci-intro-list .ci-intro-item.item01 {flex-direction:row; padding-right: 0; }
	.ci-intro-list .ci-intro-item.item02 { padding-left: 0;}
	.ci-intro-list .ci-intro-item.item03 {width: 100%; margin-top: 3rem;}

	.ci-intro-item.item01 .ci-intro-circle:before {left: auto; right: -4rem;}
	.ci-intro-item.item03 .ci-intro-circle:before {right: -4rem; width: 4rem;}
	.ci-intro-item.item01 .ci-intro-circle:after {left: auto; right: -4rem;}
	.ci-intro-item.item03 .ci-intro-circle:after {right: -4rem; }

	.ci-intro-item .ci-intro-txt {padding-top: 7rem;}
	.ci-intro-item.item01 .ci-intro-txt {text-align: left; padding-left: 5.5rem; padding-right: 0;}
	.ci-intro-item.item03 .ci-intro-txt {padding-left: 5.5rem;}
	.ci-info-con {padding: 3rem 3rem 0;}
	.ci-logo-con {height: 30rem;}
	.ci-color-list-con {padding: 3rem 0 ;}
	.ci-color-list {flex-wrap: wrap; margin: -1rem 0;}
	.ci-color-list li {width: 50%; margin: 1rem 0; padding: 0 1rem 0 6rem;}
	.ci-color-list li:before {width: 4rem; height: 4rem;}

	.color-use {padding: 3rem 0 4rem;}
}
@media all and (max-width:480px){
	.ci-color-list li .color-name span {display: block; line-height: 1.2;}
	.ci-color-list li {padding: 0 1rem 0 5rem;}
	.ci-color-list li:before {width: 3.4rem; height: 3.4rem;}
}

/* 연혁 */
.history-con-wrap {padding-top: 8.5rem;}
.history-con-top {}
.history-con-tit-box {text-align: center; margin-bottom: 6rem;}
.history-con-tit-box .tit {font-size: 2.4rem; font-weight: 700; letter-spacing: -0.05em; color: var(--main-color); line-height: 1.3; margin-bottom: 1.5rem;}
.history-con-tit-box .txt {font-size: 4.8rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; line-height: 1.25;}
.history-con-video {}
.history-con-video .background-video-wrapper {position: relative;overflow: hidden; width: 100%; height: 0; padding-top: 52.035%; border-radius: 3rem;}
.history-con-video .background-video-wrapper:before {position: absolute; content: ''; top: 0; left: 0; width: 100%; height: 100%; border-radius: 3rem; background: transparent linear-gradient(180deg, #00000000 0%, #000000 100%) 0% 0% no-repeat padding-box; z-index: 1;}
.history-con-video .background-video {position: absolute; top: 0;  left: 0px;width: 100%; height: 100%; transform: scale(1.03);}
.history-con-video .background-video iframe{width: 100%; }
.history-con-video .history-m-img {display: none;}

.history-con-bottom {position: relative; margin-top: -35rem; z-index:2;}
.history-bottom-tit {text-align: center; font-size: 6rem; font-weight: 700; color: #fff; line-height: 1.16; letter-spacing: 0em; filter: blur(1rem);transition: all 0.6s ease-in-out; opacity: 0;}
.history-con-bottom.animated .history-bottom-tit {letter-spacing: -0.025em; filter: blur(0); opacity: 1;}

.history-percent-bar {position: absolute;top: 13rem; left: 50%; border-radius: 1.5px; margin-left: -1.5px; width:3px; height: calc(100% - 13rem); background: rgba(255,255,255,0.1);}
.history-percent-bar .percent-bar-child {position: absolute;content: ""; width: 100%;  height: 0; background-color: var(--main-color); z-index: 1; border-radius:1.5px 1.5px 0 0; /* transition: all 0.3s; */}
.percent-bar-child .point { display: flex; align-items: center; justify-content: center;  position: absolute; bottom: -1.5rem; left: calc(50% - 1.5rem); content: ""; z-index: 10; width: 3rem; height: 3rem; border-radius: 3rem; background-color: #fff; transition: all 0.4s; transition-property: background-color;}
.percent-bar-child .point:before {position: absolute; content: ''; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 9rem; height: 9rem; border-radius: 50%; border-top:1px solid #fff; box-sizing:border-box; animation: historyScroll 1.5s linear infinite; transition: all 0.4s; transition-property: border-top;}
.percent-bar-child .point i {color: #000; font-size: 1.8rem; transition: all 0.4s; transition-property: color;}
.percent-bar-child .point.end i {transform: rotate(180deg);}
@keyframes historyScroll {
	0% {
		transform: translate(-50%, -50%) rotate(0);
	}
	100% {
		transform: translate(-50%, -50%) rotate(360deg);
	}
}
.percent-bar-child .point.active {background: var(--main-color);}
.percent-bar-child .point.active:before { border-top:1px solid var(--main-color); }
.percent-bar-child .point.active i {color: #fff;}

.history-con {padding-top: 37rem;}
.history-year-group-box {position: relative; display: flex;}
.history-year-group-box + .history-year-group-box {padding-top: 12rem;}
.history-year-group-box:last-of-type { padding-bottom: 7.5rem;}
.history-year-group-box .history-year-group-tit-box {width: 50%; padding-right: 10.4rem; box-sizing: border-box; text-align: right;}
.history-year-group-box .history-year-group-tit {font-size: 4rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; line-height: 1.1; transition: all 0.3s; opacity: 0.3;} 
.history-year-group-box .history-year-list-box {width: 50%; padding: 0.5rem 0 0 10.4rem; box-sizing: border-box;}
.history-year-group-box .history-year-item {display: flex; margin-bottom: 5rem; opacity: 0.3; transition: all 0.3s; }
.history-year-group-box .history-year-item:last-of-type {margin-bottom: 0;}
.history-year-group-box .history-year-item .history-year {position: relative; width: 7.5rem; }
.history-year-group-box .history-year-item .history-year strong {font-size: 1.8rem; font-weight: 700; line-height: 1.83; color: #fff;}
.history-year-group-box .history-year-item .history-detail-txt-con {width: calc(100% - 7.5rem);}
.history-year-group-box .history-year-item .history-detail-txt {font-size: 1.8rem; font-weight: 600; letter-spacing: -0.02em; color: #fff; line-height: 1.83;}
.history-year-group-box .history-year-item .history-detail-txt b {color: var(--main-color);}
.history-year-group-box .history-year-item .history-detail-img {margin-top: 3rem; display: flex; margin: 3rem -1.5rem 0;}
.history-year-group-box .history-year-item .history-detail-img span {display: block; max-width: calc(50% - 3rem); margin: 0 1.5rem;}
.history-year-group-box .history-year-item .history-detail-img img {max-width: 100%}
.history-year-group-box .history-year-item .history-detail-img .history-logo {height: 35px; margin: 0 1.5rem;}
.history-year-group-box .history-year-item .history-detail-img .history-logo svg {max-width: 100%; height: 100%; display: block; vertical-align: top;}
.history-year-group-box.active .history-year-group-tit  {opacity: 1; color: var(--main-color);}
.history-year-group-box .history-year-item.on {opacity: 1;}

@media all and (min-width:801px){
	.history-year-group-box.reverse {flex-direction: row-reverse;}
	.history-year-group-box.reverse .history-year-group-tit-box {padding-right: 0; padding-left: 10.4rem; text-align: left;}
	.history-year-group-box.reverse .history-year-list-box {padding: 0.5rem 10.4rem 0 0;}
	.history-year-group-box.reverse .history-year-item {flex-direction: row-reverse;}
	.history-year-group-box.reverse .history-year-item .history-year {text-align: right;}
	.history-year-group-box.reverse .history-year-item .history-detail-txt-con  {text-align: right;}
	.history-year-group-box.reverse .history-year-item .history-detail-img {justify-content: end;}
}
@media all and (max-width:1280px){

}
@media all and (max-width:800px){
	.history-con-tit-box .tit {font-size: 2rem;}
	.history-con-tit-box .txt {font-size: 3.8rem;}
	
	.history-con-bottom {margin-top: 3rem;}
	.history-bottom-tit {font-size: 3.2rem;}
	
	.history-percent-bar {top: 16rem;}
	.history-con {padding-top: 15rem;}
	
	.history-percent-bar {left: 1rem; }
	.percent-bar-child .point:before {width: 6rem; height: 6rem;}
	.history-year-group-box { flex-wrap: wrap; padding: 1rem 0 0 7rem;}
	.history-year-group-box .history-year-group-tit-box {text-align: left; width: 100%; padding-right: 0;}
	.history-year-group-box .history-year-group-tit {font-size: 3.6rem;}
	.history-year-group-box .history-year-list-box {width: 100%; padding: 4rem 0 0 0;}
	.history-year-group-box .history-year-item .history-detail-txt {font-size: 1.6rem;}
	.history-year-group-box .history-year-item .history-detail-img {margin: 3rem -1rem 0;}
	.history-year-group-box .history-year-item .history-detail-img span { max-width: calc(50% - 2rem); margin: 0 1rem;}
}





/* ****************** 05 회사소개 :: 경영방침 ********************** */
.manage-con {display: flex;}
.manage-con .left-con {width: 21.29%; padding-right: 1rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.manage-con .right-con {width: 78.71%;}
.manage-con-tit {display: block; font-size: 4rem; letter-spacing: -0.02em; color: #000; line-height: 1.375; }

.manage-con01 {padding: 6rem 0; border-bottom: 1px solid rgba(0,0,0,0.1); border-top: 2px solid #000;}
.manage-box {padding: 7.5rem 8rem 8rem; background: #F5F5F5; border-radius: 2rem; box-sizing: border-box;}
.manage-box .manage-txt01 {font-size: 3rem; font-weight: 700; letter-spacing: -0.02em; color: #000; line-height: 1.2; margin-bottom: 2rem;}
.manage-box .manage-txt01 span {color: var(--main-color);}
.manage-box .manage-txt02 {font-size: 1.6rem; font-weight: 400; letter-spacing: -0.02em; color: #000; line-height: 1.75;}
.manage-list {margin: 3.5rem 0;}
.manage-list li {display: flex; align-items: center; border-bottom: 1px dashed #DDDDDD; padding: 1.1rem 1.4rem;}
.manage-list li:first-child {border-top: 2px solid #000;}
.manage-list li .num {width: 3.4rem; height: 3.4rem; line-height: 3.4rem; text-align: center; border-radius: 3.4rem; background:#000000; font-size: 1.6rem; font-weight: 600; letter-spacing: -0.01em; color: #fff;} 
.manage-list li .txt {width: calc(100% - 3.4rem); padding-left: 2rem; font-size: 1.6rem; font-weight: 600; letter-spacing: -0.01em; color: #000; line-height: 1.4;box-sizing: border-box;}
.manage-bottom {display: flex; align-items: center; justify-content: space-between; padding-top: 3rem;}
.manage-bottom .date {font-size: 1.6rem; font-weight: 500; letter-spacing: -0.01em; color: #000; line-height: 1.75;}
.manage-bottom .ceo-txt {font-size: 2rem; font-weight: 700; letter-spacing: -0.01em; color: #000; line-height: 1.4;}
.manage-bottom .ceo-txt .sign-img {display: inline-block; width: 8rem; padding-left: 1.5rem;}
.manage-bottom .ceo-txt .sign-img img {max-width: 100%; mix-blend-mode: darken;}
.manage-con02 {padding: 10rem 0;}
.certificate-list {display: flex; margin: 0 -2rem;}
.certificate-list li {width: calc(33.33% - 4rem); margin: 0 2rem; text-align: center;}
.certificate-list li .certificate-img-thumb {position: relative; padding: 5.5rem 6rem; border-radius: 2rem; box-sizing: border-box; background: #F5F5F5;}
.certificate-list li .certificate-img-thumb .img-con {display: block; position: relative; width: 100%; height: 0; padding-top: 145%; border-radius: 1rem; box-shadow: 0.5rem 0.9rem 3rem rgba(0,0,0,0.1); overflow: hidden;}
.certificate-list li .certificate-img-thumb .img-con img {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.certificate-list li .certificate-tit {padding-top: 4rem; font-size: 2rem; font-weight: 700; letter-spacing: -0.01em; line-height: 1.5; color: #000;}
.certificate-list li .certificate-tit span {display: block; color: var(--main-color);}
.certificate-list li .certificate-txt {font-size: 1.6rem; font-weight: 500; letter-spacing: -0.02em; line-height: 1.75; color: rgba(0,0,0,0.5); padding-top: 1.5rem;}

@media all and (max-width:800px){
	.manage-con {display: block;}
	.manage-con .left-con {width: 100%;}
	.manage-con .left-con .manage-con-tit {font-size: 2.4rem; margin-bottom: 2rem;}
	.manage-con .right-con {width: 100%;}
	.manage-con01 {padding: 4rem 0;}
	.manage-box {padding: 4rem 3rem;}
	.manage-box .manage-txt01 {font-size: 2.4rem;}
	.manage-con02 {padding: 4rem 0;}
	.certificate-list {flex-wrap: wrap; margin: -2rem -1rem;}
	.certificate-list li {width: calc(50% - 2rem); margin: 2rem 1rem; }
	.certificate-list li .certificate-img-thumb {padding: 4.5rem 4rem;}
	.certificate-list li .certificate-tit {padding-top: 2rem; font-size: 1.8rem;}
}



/* ****************** 06 소식 ********************** */
/* 리스트 공통 */
.bbs-list-style01 {}
.bbs-list-style01 .bbs-item {}
.bbs-list-style01 .bbs-item a {display: flex; align-items: center; position: relative; height: 11.3rem; box-sizing: border-box; border-top: 1px solid #000; background-color: #fff; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s;-ms-transition: all 0.3s; transition: all 0.3s }
.bbs-list-style01 .bbs-item a .bbs-list-num {text-align: center; width: 13.5rem; font-size: 1.6rem; font-weight: 700; color: #000000; letter-spacing: -0.01em; line-height: 1.3;}
.bbs-list-style01 .bbs-item.notice-item a .bbs-list-num {color: var(--main-color);}
.bbs-list-style01 .bbs-item a .bbs-list-info-con {width: calc(100% - 29.5rem); padding: 0 4rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.bbs-list-style01 .bbs-item a .bbs-list-info-con .bbs-subject-txt {display: block; font-size: 2.8rem; letter-spacing: -0.04em; color: #000; line-height: 1.2; height: 1.2em; transition: all 0.4s; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bbs-list-style01 .bbs-item a .bbs-list-info-con .bbs-subject-txt strong {position: relative; font-weight: 700; background-image: linear-gradient(#000, #000);background-position: 100% 100%; background-repeat: no-repeat; background-size: 0% 3px; transition: all 0.4s;  transition-property: background-image, background-size, color; }
.bbs-list-style01 .bbs-item a .bbs-list-info-con .bbs-subject-txt strong:before { position: absolute; content: ''; width: 100%; height: 3px; left: 0; bottom: 0; background-image: linear-gradient(#000, #000);background-position: 100% 100%; background-repeat: no-repeat; background-size: 0% 3px; transition: all 0.4s;  transition-property: background-image, background-size, color;}
.bbs-list-style01 .bbs-item a .bbs-list-date {text-align: center; width: 16rem; font-size: 1.6rem; color: rgba(0,0,0,0.5); letter-spacing: -0.01em; line-height: 1.625;}

@media all and (min-width:801px){
	.bbs-list-style01 .bbs-item a:hover .bbs-list-info-con .bbs-subject-txt {color: var(--main-color); }
	.bbs-list-style01 .bbs-item a:hover .bbs-list-info-con .bbs-subject-txt strong {background-image: linear-gradient( var(--main-color),  var(--main-color)); background-position: 0% 100%; background-size: 100% 3px; }
}
@media all and (max-width:800px){
	.bbs-list-style01 .bbs-item a { height: auto; padding: 2rem 0; flex-wrap: wrap; }
    .bbs-list-style01 .bbs-item a .bbs-list-num { width: 100%; text-align: left; margin-bottom: 1.5rem;}
    .bbs-list-style01 .bbs-item a .bbs-list-info-con {margin: 0 ;  padding: 0; width: 100%; }
	.bbs-list-style01 .bbs-item a .bbs-list-info-con strong {font-size: 1.8rem;}
	.bbs-list-style01 .bbs-item a .bbs-list-date { width: 100%; text-align: left; margin-top: 1.5rem;}

	.bbs-list-style01 .bbs-item a .bbs-list-date {font-size: 1.4rem;}
  
}

/* 갤러리 공통 */
.board-con {border-top: 1px solid #000;}
.gallery-list-style01 {padding: 4rem 0; display: flex; flex-wrap: wrap; margin: -1.5rem;}
.gallery-list-style01 li {width: calc(33.33% - 3rem); margin: 1.5rem;}
.gallery-list-style01 li a {display: flex;flex-wrap: wrap; flex-direction: column;justify-content: space-between; width: 100%; height: 100%;background: #F5F5F5;  border: 1px solid #F5F5F5; border-radius:2rem;transition: all 0.4s;  box-sizing: border-box;}
.gallery-list-style01 li a .txt-box { padding: 4rem; box-sizing: border-box;}
.gallery-list-style01 li a .txt-box .cate {display: block; font-size: 1.5rem; font-weight: 700; letter-spacing: -0.016em; color: var(--main-color); line-height: 1.2; margin-bottom: 1.5rem;}
.gallery-list-style01 li a .txt-box .tit {font-size: 2.8rem; font-weight: 700; letter-spacing: -0.02em; color: #000; line-height: 1.57; height: 3em; overflow:hidden;display:block;display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;  transition: all 0.4s;}
.gallery-list-style01 li a .txt-box .tit strong {position: relative; background-image: linear-gradient(#000, #000);background-position: 100% 100%; background-repeat: no-repeat; background-size: 0% 3px; transition: all 0.4s;  transition-property: background-image, background-size, color;}
.gallery-list-style01 li a .txt-box .date {display: block; font-size: 1.5rem; font-weight: 400; letter-spacing: -0.02em; color: #000; line-height: 1.2; margin-top: 2.2rem;}
.gallery-list-style01 li a .img-box {position: relative; width: 100%; height: 0; padding-top: 66.66%;border-radius: 0 0 2rem 2rem;overflow: hidden;}
.gallery-list-style01 li a .img-box span {position: absolute; top: 0;  left: 0; width: 100%; height: 100%; display: block;}

.bbs-no-list{padding:10rem 0; text-align:center; color:#777; font-size:2rem; }
.notice-con .bbs-no-list {border-top: 1px solid #000;}

@media all and (min-width:801px){
	.gallery-list-style01 li a:hover .txt-box .tit {color: var(--main-color); }
	.gallery-list-style01 li a:hover .txt-box .tit strong {background-image: linear-gradient( var(--main-color),  var(--main-color)); background-position: 0% 100%; background-size: 100% 3px; }
}
@media all and (max-width:800px){
	.gallery-list-style01 {margin: -1rem;}
	.gallery-list-style01 li {width: calc(50% - 2rem); margin: 1rem;}
	.gallery-list-style01 li a .txt-box {padding: 3rem;}
	.gallery-list-style01 li a .txt-box .tit {font-size: 2rem;}
	.bbs-no-list{padding:6rem 0; font-size:1.6rem; }
}
@media all and (max-width:480px){
	.gallery-list-style01 {margin: -1rem 0;}
	.gallery-list-style01 li {width: 100%; margin: 1rem 0;}

}

/* ******************   게시판 :: 뷰페이지  ********************** */
.bbs-view-con{border-top:1px solid #333;}
/* 게시판 :: 뷰 :: 상단 타이틀 정보 */
.bbs-view-top{padding:20px; border-bottom:1px solid #eee; font-size:var(--board-view-font-size);}
.bbs-view-top .event-date{color:#888; padding-bottom:10px;}
.bbs-view-top .event-date dt,.bbs-view-top .event-date dd{display:inline-block; letter-spacing:-0.5px;}
.bbs-view-top .event-date dt{margin-right:10px; color:#333;}
.bbs-view-top .event-date dt:before{position:relative; top:-1px; font-family:"xeicon"; content: "\e9a0"; font-size:16px; margin-right:3px; vertical-align:middle;}
.bbs-view-top .bbs-state-box{margin-bottom:10px}
.bbs-view-top .bbs-state{display:inline-block; min-width:50px; padding:0 10px; height:30px; line-height:30px; background-color:#888; font-size:13px; border:1px solid #888; color:#fff; text-align:center;}
.bbs-view-top .bbs-state.ing{border-color:#5997bb; background-color:#5997bb;}
.bbs-view-top .bbs-state.end{background-color:#fff; color:#999}
.bbs-view-top .bbs-category{display:block; margin-bottom:10px;}
.bbs-view-top .bbs-tit{color:#282828; font-size:2em; letter-spacing:-0.0333em; font-weight:500; line-height:1.25; word-break:keep-all;}
.bbs-view-top .bbs-write-info{margin-top:20px;}
.bbs-view-top .bbs-write-info dt,.bbs-view-top .bbs-write-info dd{display:inline-block; color:#777; vertical-align:middle; font-weight:500;}
.bbs-view-top .bbs-write-info dd{margin:0 20px 0 5px; color:#888; font-weight:400}
.bbs-view-content{padding:30px 20px; border-bottom:1px solid #eee; }
.bbs-view-content.editor img {height: auto !important;}
/* 게시판 :: 뷰 :: 공유아이콘 */
.bbs-view-share-con{overflow:hidden; padding:10px 20px; border-bottom:1px solid #eee;}
.bbs-view-share-con ul{float:right;}
.bbs-view-share-con ul li{float:left;margin-left:5px;  -webkit-border-radius:50%;-moz-border-radius:50%;-o-border-radius:50%;border-radius:50%;}
.bbs-view-share-con ul li:first-child{margin-left:0;}
.bbs-view-share-con ul li a, .bbs-view-share-con ul li button{display:block;  width:34px; height:34px; text-align:center; line-height:34px;}
.bbs-view-share-con ul li img{width:30px;}
.bbs-view-share-con ul li i{font-size:20px; line-height:34px; color:#fff;}
.bbs-view-share-controls .bbs-button-controls{float:left;}
.bbs-view-share-controls .bbs-hit-good-num-con{float:right;}

/* 게시판 :: 뷰 :: 첨부파일 */
.bbs-view-file-info-box{line-height:20px; border-bottom:1px solid #eee; background-color:#f9f9f9; padding:10px 20px; margin-bottom:10px;}
.bbs-view-share-con + .bbs-view-file-info-box{border-top:0;}
.bbs-view-file-info-box .bbs-file-list{overflow:hidden; padding-top:5px; font-size:13px;}
.bbs-view-file-info-box .bbs-file-list:first-child{padding-top:0;}
.bbs-view-file-info-box .bbs-file-list dt{float:left; width:100px; font-weight:600; color:#333;}
.bbs-view-file-info-box .bbs-file-list dd{float:left; width:70%; width:calc(100% - 100px ); }
.bbs-view-file-info-box .bbs-file-list dd a:hover{text-decoration:underline;}
.bbs-view-file-info-box .bbs-file-list dd i{vertical-align:middle; font-size:15px;}

/* 게시판 :: 뷰 :: 이전글,다음글 */
.bbs-view-prev-next-list{margin-top:50px;}
.bbs-view-prev-next-list li{border-bottom:1px solid #eee;}
.bbs-view-prev-next-list li:first-child{border-top:1px solid #eee;}
.bbs-prev-next-tbl{width:100%; table-layout:fixed;}
.bbs-prev-next-tbl th,
.bbs-prev-next-tbl td{height:58px; color:#333; font-size:16px; letter-spacing:-0.5px; line-height:1.2; }
.bbs-prev-next-tbl th{text-align:left;}
.bbs-prev-next-tbl .bbs-prev-next-tit{position:relative; display:block; padding-left:25px; font-weight:400; }
.bbs-prev-next-tbl .bbs-prev-next-tit:after{position:absolute; top:0px; bottom:0px; width:1px; right:0px; background-color:#eee; content:"";}
.bbs-prev-next-tbl .bbs-prev-next-tit i{position:absolute; right:15px; font-size:20px;}
.bbs-prev-next-tbl td{padding-left:20px}
.bbs-prev-next-tbl td a{display:block; color:inherit;}
.bbs-prev-next-tbl td a .bbs-tit{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.bbs-prev-next-tbl td a:hover .bbs-tit{text-decoration:underline}

/* ****************** 공통 :: BUTTON ********************** */
.bbs-view-con .bbs-view-btn-controls{overflow:hidden; display:flex; align-items:center; justify-content:space-between; text-align:center; margin-top:50px;}
.bbs-view-con .bbs-view-btn-controls .left-btn-controls,
.bbs-view-con .bbs-view-btn-controls .right-btn-controls{display:flex; margin: 0 -0.5rem;}
.bbs-view-con .bbs-view-btn-controls button,
.bbs-view-con .bbs-view-btn-controls a {width: 20rem; margin: 0 0.5rem;} 

.bbs-view-con .bbs-view-btn-controls .btn-style01:hover {color: #fff;}


@media all and (max-width:800px){
	/* 게시판 :: 뷰 */
	.bbs-view-top{padding:15px 0;}
	.bbs-view-top .bbs-tit{}
	.bbs-view-top .bbs-view-info{float:none; overflow:hidden;}
	.bbs-view-top .bbs-write-info{margin-top:10px;}
	.bbs-view-top .bbs-write-info dt,
	.bbs-view-top .bbs-write-info dd{font-size:12px;}
	.bbs-view-top .bbs-write-info dd{margin:0 7px 0 0}
	.bbs-view-content{padding:15px 0}

	/* 게시판 :: 뷰 :: 공유아이콘 */
	.bbs-view-share-con{padding:10px 15px}

	/* 게시판 :: 뷰 :: 첨부파일 */
	.bbs-view-file-info-box{padding:10px 15px;}
	.bbs-view-file-info-box .bbs-file-list{font-size:12px;}

	/* 게시판 :: 뷰 :: 이전글,다음글 */
	.bbs-prev-next-tbl colgroup{display:none;}
	.bbs-prev-next-tbl th{width:80px;}
	.bbs-prev-next-tbl th,
	.bbs-prev-next-tbl td{height:34px; font-size:13px; padding-left:10px}
	.bbs-prev-next-tbl .bbs-prev-next-tit{padding-left:10px;}
}

/* ******************  마이페이지 :: 온라인문의 뷰페이지  ********************** */
.mypage-view-con {}
.mypage-view-top {display: flex; align-items: center; border-top: 1px solid #000; border-bottom: 1px solid #000; padding: 3rem 4rem; box-sizing: border-box;}
.mypage-view-top .tit-box {width: calc(100% - 8rem); padding-right: 3rem; box-sizing: border-box;}
.mypage-view-top .tit-box .info {padding-bottom: 2rem;}
.mypage-view-top .tit-box .info span {float: left; display: inline-block; font-size: 1.6rem; line-height: 1.3;}
.mypage-view-top .tit-box .info .num {color: #000; font-weight: 700;} 
.mypage-view-top .tit-box .info .category {color: var(--main-color); font-weight: 700; padding-left: 3rem;}
.mypage-view-top .tit-box .info .date {color: rgba(0,0,0,0.5); padding-left: 2rem;}
.mypage-view-top .tit-box .tit {font-size: 2rem; font-weight: 700; letter-spacing: -0.04em; line-height: 1.4; color: #000;}
.mypage-view-top .state-box {width: 8rem; height: 3rem; border: 1px solid #000; box-sizing: border-box; display: flex; align-items: center; justify-content: center; text-align: center;}
.mypage-view-top .state-box span {font-size: 1.4rem; font-weight: 700; letter-spacing: -0.04em; color: #000;}

.mypage-view-content {padding-bottom:4rem;}
.mypage-view-content .contact-content {padding: 3rem 4rem; box-sizing: border-box;}
.mypage-view-content .answer-content {border: 2px solid #000; padding: 2.8rem 3.8rem;}

.mypage-view-con .cm-btn-controls button,
.mypage-view-con .cm-btn-controls a{max-width: 24rem;}
.contact-view-tbl {width: 100%;}
.contact-view-tbl th ,
.contact-view-tbl td {text-align: left; vertical-align: top; font-size: 1.8rem; color: #000; line-height: 1.66; box-sizing: border-box;}
.contact-view-tbl th {width: 13.8rem; font-weight: 600; padding: 1rem 1rem 1rem 0; border-right: 1px solid #EEEEEE;}
.contact-view-tbl td {width: calc(100% - 13.8rem); font-weight: 400; padding: 1rem 1rem 1rem 4rem; }
.contact-view-tbl td a {color: #3C84F1; border-bottom: 1px solid #3C84F1;}
.answer-content .contact-view-tbl th {border-right: 0;}

@media all and (max-width:800px){
	.mypage-view-top {flex-direction: column-reverse; align-items: flex-start; padding: 3rem 2.5rem;}
	.mypage-view-top .state-box {margin-bottom: 2rem;}
	.mypage-view-content .contact-content {padding: 3rem 2.5rem;}
	.mypage-view-content .answer-content {padding: 2.8rem 2.3rem;}
	.contact-view-tbl {display: block;}
	.contact-view-tbl tr {display:block; }
	.contact-view-tbl th ,
	.contact-view-tbl td {display:block; width:100% !important; }
	.contact-view-tbl th {border-right: 0;}
	.contact-view-tbl td {border-top: 1px solid rgba(0,0,0,0.1); padding: 1rem 0;}
}


/* -------- 공통 :: 체크박스 -------- */
.custom-checkbox-item-box{margin:0 -1rem;}
.custom-checkbox-item-box .custom-checkbox-item{margin:0.2rem 1rem}
.custom-checkbox-item{display:inline-block; vertical-align:middle; font-size:1.7rem;}
.custom-checkbox-item input[type="checkbox"]{display:none;}
.custom-checkbox-item label{display:inline-block; position:relative; padding-left:2.8rem; color:#000; font-size:1em; line-height:1.5; }
.custom-checkbox-item label::before{position: absolute; content:''; left:0; top:0.3rem; width:2rem; height:2rem; border-radius:2px; border:2px solid #000; box-sizing:border-box;}
.custom-checkbox-item label::after{position: absolute; content:''; left:-0.1rem; top:-0.5rem; font-size:2.4rem; font-family:'xeicon'; color:#000;}
.custom-checkbox-item input[type="checkbox"]:checked + label::after{content: "\e929";}

@media all and (min-width:801px){
	/* big-item */
	.big-item.custom-checkbox-item{font-size:2rem;}
	.big-item.custom-checkbox-item label::before{width:2rem; height:2rem; top:0.6rem;}
	.big-item.custom-checkbox-item label::after{font-size:2.4rem; top:-0.1rem;}
	
}


/* -------- 공통 :: 탭 -------- */
@media all and (min-width:801px){
	/* Tab 공통 스타일02 */
	.sub-tab-list-style2{padding:1rem; box-sizing:border-box; background:#eee; border-radius:1rem;}
	.sub-tab-list-style2 ul{display:flex; justify-content: center; width:100%; height:100%;}
	.sub-tab-list-style2 ul li{display:table-cell; vertical-align:middle; position:relative; width:50%; max-width: 17rem; background-color:#eee; transition: all 0.4s;}
	.sub-tab-list-style2 ul li a{display:table; height:40px; width:100%; border-radius: 6px; transition: all 0.4s; }
	.sub-tab-list-style2 ul li a em{display:table-cell; vertical-align:middle; color:#000000; font-size:1.5rem; font-weight: 700; text-align:center;}
	.sub-tab-list-style2 ul li.selected {z-index: 1;}
	.sub-tab-list-style2 ul li.selected a {background-color:#000;}
	.sub-tab-list-style2 ul li.selected a em {color: #fff;}
}

/* -------- 공통 :: 버튼 -------- */
.cm-btn-controls{overflow:hidden; margin:-1rem 0;}
.cm-btn-controls button,
.cm-btn-controls a{display:flex; align-items:center; justify-content:center; width:100%; max-width:36rem; height:6rem; border:0; color:#fff; background:#000; font-size:2rem; margin:1rem 0; cursor:pointer; vertical-align:top; text-align:center; letter-spacing: -0.05em; box-sizing:border-box; border-radius: 1rem; font-weight:700;}
.cm-btn-controls button em,
.cm-btn-controls a em{font-weight:inherit;}
.cm-btn-controls button.wide,
.cm-btn-controls a.wide{width:100%; max-width:none;}
.cm-btn-controls button.small,
.cm-btn-controls a.small{ max-width:24rem;}

/* row */
.row.cm-btn-controls{display: flex; justify-content: center; margin:-1rem;}
.row.cm-btn-controls button,
.row.cm-btn-controls a{margin:1rem;}
/* btn-style */
.cm-btn-controls .btn-style01{background-color:var(--main-color);}
.cm-btn-controls .btn-style02{background-color:#E5E5E5; color:#000;}
.sub-wrap .cm-fill-btn.btn-style03:before{border-color:#fff}
.sub-wrap .cm-fill-btn.btn-style04 { color:#000; background:#fff;}
.sub-wrap .cm-fill-btn.btn-style04 .cm-fill {background: #000;}
@media all and (min-width:801px){
	/* wide */
	.cm-btn-controls button.wide.cm-fill-btn:hover .cm-fill,
	.cm-btn-controls a.wide.cm-fill-btn:hover .cm-fill{width:70vw; height:70vw;}

	.cm-btn-controls .btn-style01:hover{color:var(--main-color);}

	.sub-wrap .cm-fill-btn.btn-style04:hover {color: #fff;}
}
@media all and (max-width:800px){
	.cm-btn-controls button,
	.cm-btn-controls a{height:5rem; font-size:1.5rem;}
}

/* -------- 공통 :: 버튼효과(서브) -------- */
.sub-wrap .cm-fill-btn:before{position: absolute; content:''; top:0; left:0; border:1px solid #000; border-radius:1rem; box-sizing:border-box; width:100%; height:100%; z-index:99;}
.sub-wrap .cm-fill-btn.btn-style01:before{border-color:var(--main-color);}
.sub-wrap .cm-fill-btn.btn-style02:before{border-color:#E5E5E5}


/* ****************** 회원 :: 로그인페이지 ********************** */
.login-page{max-width:360px; margin:auto;}
.login-page .sub-tab-wrapper-style{margin-bottom:3rem;}
.login-form{margin-bottom:4rem;}
/* 로그인 :: 인풋창 */
.login-item {position: relative; margin-bottom:2rem;}
.login-item .login-input {width:100%; border: solid 2px #000; border-radius: 1rem; background: none; padding: 0 2rem; height:6rem; font-size:1.7rem; color:#000; transition:border 150ms cubic-bezier(0.4,0,0.2,1); }
.login-item .input-label { position: absolute; top:50%; left: 2rem; color: rgba(0,0,0,0.25); pointer-events: none; transform: translateY(-50%); transition: 150ms cubic-bezier(0.4,0,0.2,1); font-size: 1.7rem; font-weight:700; }
.login-item .login-input:focus,
.login-input:valid { outline: none; border: 2px solid #000; }
.login-input:focus ~ label, 
.login-input:valid ~ label { top:0; transform: translateY(-50%); background-color: #fff; padding: 0 0.4rem; color: #000; }
/* 로그인 :: 아이디저장, 찾기 */
.login-bottom-box{display: flex; align-items:center; justify-content:space-between;}
.login-bottom-box .id-search-btn a{font-size:1.5rem; font-weight:500; color:#000;}

/* ****************** 회원 :: 로그인페이지 ********************** */
@media all and (max-width:800px){
	.login-item .login-input{font-size:1.5rem; height:5rem;}
	.login-item .input-label{font-size:1.5rem;}
}


/* ****************** 회원 :: 회원가입 ********************** */
.join-intro-con{display: flex; justify-content:space-between;}
.join-intro-con .join-item{display: flex ; flex-direction: column; justify-content: space-between; width:calc(50% - 2rem); border-radius:2rem; background:#f5f5f5; padding:6.4rem; box-sizing:border-box; min-height:42rem;}
.join-intro-con .join-item .top-box{display: flex; justify-content:space-between; margin-bottom:3rem;}
.join-intro-con .join-item .top-box .tit-box{width:calc(100% - 12rem); padding-right: 1rem; box-sizing: border-box;}
.join-intro-con .join-item .top-box .tit-box .tit{font-size:3.2rem; line-height:1.5; letter-spacing:-0.015em; color:#000; font-weight:700; margin-bottom:1rem;}
.join-intro-con .join-item .top-box .tit-box .txt{font-size:1.8rem; line-height:1.66; letter-spacing:-0.015em; color:rgba(0,0,0,0.7);}
.join-intro-con .join-item .top-box .icon-box{display: flex; flex-direction:column; align-items:center; justify-content:center; width:12rem; height:12rem; text-align:center; background:#fff; border-radius:2rem; padding:1rem; box-sizing:border-box; color:#000;}
.join-intro-con .join-item .top-box .icon-box .icon{font-size:3.2rem;}
.join-intro-con .join-item .top-box .icon-box .txt{font-size:1.8rem; line-height:1.5; font-weight:800; margin-top:0.3rem;}

.join-intro-con .join-item.agency .top-box .icon-box{color:var(--main-color);}

@media all and (max-width:800px){
	.join-intro-con{display: block;}
	.join-intro-con .join-item{width:100%; padding:3rem; min-height:auto; margin-bottom:2rem;}
	.join-intro-con .join-item:last-child{margin-bottom:0;}
	.join-intro-con .join-item .top-box .tit-box{width:calc(100% - 10rem); }
	.join-intro-con .join-item .top-box .tit-box .tit{font-size:2.1rem;}
	.join-intro-con .join-item .top-box .tit-box .txt{font-size:1.6rem;}
	.join-intro-con .join-item .top-box .icon-box{ width:10rem; height:10rem;}
	.join-intro-con .join-item .top-box .icon-box .icon{font-size:2rem;}
	.join-intro-con .join-item .top-box .icon-box .txt{font-size:1.6rem;}
}


/* ****************** 회원 :: 회원가입01(약관동의) ********************** */
.join-write-wrap{border-bottom:2px solid #000; padding:6rem 0;}
.join-write-wrap:first-child{border-top:2px solid #000;}
.join-write-wrap + .cm-btn-controls{margin-top:5rem;}
/* 약관동의 */
.join-agree-con{margin-bottom:2rem;}
.join-agree-con:last-child{margin-bottom:0rem;}
.join-agree-con .agree-item{display: flex; align-items:center; justify-content:space-between; }
.join-agree-con .agree-item .more{display: flex; align-items:center; font-size:1.5rem; line-height:1.6; color:#000; cursor:pointer;}
.join-agree-con .agree-item .more i{font-size:1.6em; margin-left:1.5rem; transition:all 0.2s;}
.join-agree-con .agree-item .more.rotate i{transform:rotate(180deg);}

.join-agree-con .agree-inner{width:100%; border:2px solid rgba(0,0,0,0.25); padding:3rem; box-sizing:border-box; margin-top:2rem; margin-bottom:5rem;}
.join-agree-con .agree-inner .inquiry-agreement-con{height:24rem; overflow:auto; font-size:1.7rem; color:rgba(0,0,0,0.3);}

@media all and (max-width:800px){
	.join-write-wrap{padding:3rem 0;}
	.join-agree-con{margin-bottom:1rem;}
	.join-agree-con .agree-item .more{font-size:1.3rem;}
	.join-agree-con .agree-item .more i{margin-left:1rem;}

	.join-agree-con .agree-inner{padding:1.5rem; margin-top:1rem; margin-bottom:3rem;}
	.join-agree-con .agree-inner .inquiry-agreement-con{height:20rem; font-size:1.5rem;}
}

/* ****************** 회원 :: 회원가입02(입력폼) ********************** */
.join-write-con{display: flex; margin-bottom:6rem; padding-bottom:6rem; border-bottom:1px solid rgba(0,0,0,0.1);}
.join-write-con:last-child{margin-bottom:0rem; padding-bottom:0rem; border-bottom:none;}
.join-write-con .left-box{width:39.4%; padding-right: 4rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.join-write-con .left-box .join-tit{font-size:4rem; line-height:1.2; letter-spacing:-0.024em; color:#000; font-weight:700;}
.join-write-con .right-box{width:61.6%;}
.cm-write-item{display: flex; justify-content:space-between; margin-bottom:1rem;}
.cm-write-item:last-child{margin-bottom:0rem;}
.cm-write-item .write-tit-box{display: flex; align-items:center; width:14rem; height:6rem;}
.cm-write-item .write-tit-box .write-tit{font-size:1.8rem; line-height:1.5; color:#000; font-weight:600; letter-spacing:-0.024em;}
.essential{color:var(--main-color);}

.cm-write-item .cm-fieldset-box{width:calc(100% - 14rem); max-width:660px;}
.cm-write-item .cm-nation-box {display: flex;}
.cm-write-item .cm-nation-box .nation01-select01 {width: 40%;}
.cm-write-item .cm-nation-box .nation01-select02 {width: calc(60% - 1rem); margin-left: 1rem;}

/* 문의폼 */
.cm-fieldset-box .write-input,
.cm-fieldset-box .write-select,
.cm-fieldset-box .custom-select-box,
.cm-fieldset-box .write-textarea{height:6rem; width:100%; background-color:#f2f2f2; color:#000; font-size:1.5rem; font-weight:500; text-indent:2rem; vertical-align:middle; box-sizing:border-box; border-radius:1rem !important; border:none; outline:none; }
.cm-fieldset-box .write-textarea{height:30rem; padding:2.5rem 2rem; text-indent:0;}
.cm-fieldset-box .plus-txt{font-size:1.6rem; line-height:1.5; letter-spacing:0; font-weight:500; color:#000; margin:1rem 0;}
/* 문의폼 :: Custom Select */
.cm-fieldset-box .custom-select-trigger { color: #000; line-height: 6rem; font-size:1.5rem; border:none; background: #f2f2f2; border-radius:1rem; transition-delay:0.2s;}
.custom-select-trigger:after{content: "\e936"; right:2rem; font-size:2.4rem; }
.custom-select.opened .custom-select-trigger:after{ content: "\e930"; }
/* Custom Select :: Option Drop List */
.custom-option-drop-list { top: 100%; background: #fff; border:2px solid #f2f2f2; border-radius:0 0 1rem 1rem;}
.custom-option-item { padding: 1.5rem 0; font-size:1.3rem; }
/* Custom Select :: Open */
.cm-fieldset-box .opened .custom-select-trigger{border-radius:1rem 1rem 0 0; transition-delay:0s;}

/* 문의폼 :: email */
.email-fieldset{position: relative; display: flex; flex-wrap:wrap; z-index:1;}
.email-fieldset .write-input, 
.email-fieldset .write-select,
.email-fieldset .custom-select-box,
.email-fieldset .fakeform-selectbox{width:calc(50% - 2.5rem);}
.email-fieldset + .email3{order:3;}
.email-fieldset .hypen{display:inline-block; vertical-align:middle; width:5rem; text-align:center; font-size:1.8rem; color:#000; font-weight:600; line-height:6rem;}
.cm-write-item .cm-fieldset-box .email3{margin-top:1rem;}
/* 문의폼 :: email :: style02 */
.email-fieldset.email-style02{}
.email-fieldset.email-style02 .write-input, 
.email-fieldset.email-style02 .write-select,
.email-fieldset.email-style02 .custom-select-box,
.email-fieldset.email-style02 .fakeform-selectbox{width:calc(33.33% - 2rem);}
.email-fieldset.email-style02 .custom-select-box,
.email-fieldset.email-style02 .fakeform-selectbox{margin-left:1rem;}

/* 문의폼 :: fakeform */
.fakeform-selectbox{position: relative; display:inline-block; width: 100%;}
.fakeform-selectbox select{opacity: 0; visibility: hidden;}
.select-option.select-in-popup{z-index: 10000 !important;}
/* fake form - 기본 select 스타일 */
.fakeform-selectbox .select-title {text-indent: 2rem; width: 100% !important; text-align: left; vertical-align: middle; border:0; line-height: 6rem; font-size:1.5rem; color: #000; background-color: #f2f2f2; display: inline-block; box-sizing: border-box; cursor: pointer; border-radius:1rem;}
.fakeform-selectbox .select-title:after{font-family: 'xeicon'; position:absolute; top:50%; right:1.5rem; transform:translateY(-50%); content: "\e936"; font-size:2.4rem; color: #000;}
.fakeform-selectbox .select-title strong {width: 100%; font-weight: 500; word-break: break-all; display: block; overflow: hidden;}
.fakeform-selectbox .select-title.active{border-radius:1rem 1rem 0 0;}
.fakeform-selectbox .select-title.active:after{content: "\e930";}
.fakeform-selectbox .select-title.focus{}
.fakeform-selectbox .select-title.disabled{}

.fakeform-selectbox .select-title.active.upper {    border-radius: 0 0 1rem 1rem ;}

/* 옵션창 */
.select-option {border: 2px solid #f2f2f2; border-top: 0; background: #fff; border-radius: 0 0 1rem 1rem; max-height: 200px; overflow: auto; z-index: 999 !important;}
.select-option::-webkit-scrollbar{
	width: 5px;
}
.select-option::-webkit-scrollbar-thumb{
	background-color:#333;
	border-radius:5px;
	transition:all 0.5s;
}
.select-option::-webkit-scrollbar-track{
	background-color:#f2f2f2; 
	border-radius:0;
}
.select-option ul {margin: 0; padding: 0;}
.select-option li {list-style: none;}
.select-option span,
.select-option strong {height: auto; font-size: 1.3rem; line-height: 1.5; color: #555; white-space: nowrap; text-overflow: ellipsis; text-decoration: none; padding: 1.5rem 0rem; display: block; overflow: hidden; cursor: pointer; text-indent:2rem;}
.select-option span:hover {background: #f2f2f2;}
.select-option span.selected {color: #000; font-weight: 600;}
.select-option .disabled span,
.select-option .disabled strong {color: #bbb; text-decoration: line-through; background: none; cursor: default;}

.select-option.upper {border-top: 2px solid #f2f2f2; border-bottom: 0; border-radius: 1rem 1rem 0 0;}

@media all and (max-width:800px){
	.fakeform-selectbox .select-title {text-indent: 1em; font-size: 1.4rem; line-height: 5rem;}
	.fakeform-selectbox .select-title:after{right:0.7em; font-size:2rem;}
	/* 옵션창 */
	.select-option span,
	.select-option strong {height: auto; font-size: 1.3rem; font-weight: 500; line-height: 1.5; padding: 1.5rem 1em;}
}

/* 문의폼 :: 파일업로드 */
.upload-hidden{ position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0; } 

/* 문의폼 :: btn */
.btn-fieldset{display: flex; flex-wrap:wrap; justify-content:space-between;}
.btn-fieldset .btn-fieldset-inner{position: relative; width:calc(100% - 21rem);}
.btn-fieldset .write-btn{display: flex; align-items:center; justify-content:center; width:20rem; height:6rem; font-size:1.8rem; line-height:1.5; color:#fff; font-weight:600; background:#000; 
border-radius:1rem;}
.btn-fieldset .write-btn:before{border-color:#000;}
.btn-fieldset .write-btn:hover{color:#000;}
.btn-fieldset .write-btn.btn-style01{background:var(--main-color);}
.btn-fieldset .write-btn.btn-style01:before{border-color:var(--main-color);}
.btn-fieldset .write-btn.btn-style01:hover{color:var(--main-color);}
/* 문의폼 :: 인증번호 시간 */
#requestInput{margin-top:1rem;}
.certi-time{position: absolute; top:50%; right:3rem; text-align:right: font-size:1.2rem; font-weight:500; color:#000; transform:translateY(-50%);}

@media all and (max-width:1280px){
	.cm-write-item .cm-nation-box {flex-wrap: wrap;}
	.cm-write-item .cm-nation-box .nation01-select01 {width: 100%;}
	.cm-write-item .cm-nation-box .nation01-select02 {width: 1000%; margin-left: 0; margin-top: 1rem;}
}
@media all and (max-width:800px){
	.join-write-con{margin-bottom:4rem; padding-bottom:4rem;}
	.join-write-con{display: block; }
	.join-write-con .left-box{width:100%; margin-bottom:2rem;}
	.join-write-con .left-box .join-tit{font-size:2.6rem;}
	.join-write-con .right-box{width:100%;}
	
	.cm-write-item{display: block;}
	.cm-write-item .write-tit-box{width:100%; height:auto; margin-bottom:1rem;}
	.cm-write-item .write-tit-box .write-tit{font-size:1.4rem;}
	.cm-write-item .cm-fieldset-box{width:100%;}
	
	/* 문의폼 */
	.cm-fieldset-box .write-input,
	.cm-fieldset-box .write-select,
	.cm-fieldset-box .custom-select-box{height:5rem; text-indent:1.5rem;}
	.cm-fieldset-box .write-textarea{height:20rem; text-indent:1.5rem;}
	.cm-fieldset-box .plus-txt{font-size:1.4rem; margin:0.5rem 0;}
	/* 문의폼 :: email */
	.email-fieldset .write-input, 
	.email-fieldset .write-select,
	.email-fieldset .custom-select-box{width:calc(50% - 1.5rem);}
	.email-fieldset .hypen{width:3rem; font-size:1.4rem; line-height:5rem;}
	/* 문의폼 :: email :: style02 */
	.email-fieldset.email-style02 .write-input, 
	.email-fieldset.email-style02 .write-select,
	.email-fieldset.email-style02 .custom-select-box,
	.email-fieldset.email-style02 .fakeform-selectbox{width:calc(50% - 1.5rem);}
	.email-fieldset.email-style02 .custom-select-box,
	.email-fieldset.email-style02 .fakeform-selectbox{margin-left:0rem; margin-top:1rem; width:100% !important}
	/* 문의폼 :: Custom Select */
	.cm-fieldset-box .custom-select-trigger {line-height: 5rem;}
	.custom-select-trigger:after{font-size:2rem; }
	/* Custom Select :: Option Drop List */
	.custom-option-item { padding: 1rem 0;}
	/* 문의폼 :: fakeform */
	.select-option span,
	.select-option strong{text-indent:0;}
	/* 문의폼 :: btn */
	.btn-fieldset .btn-fieldset-inner{width:calc(100% - 16rem);}
	.btn-fieldset .write-btn{width:15rem; height:5rem; font-size:1.5rem;}
}
@media all and (max-width:480px){
	/* 문의폼 :: email */
	.btn-fieldset .btn-fieldset-inner.email-fieldset{width:100%; z-index:100;}
	.email-fieldset + .email3{order:inherit;}
	.btn-fieldset .btn-fieldset-inner.email-fieldset + .email3 + .write-btn{width:100%; margin-top:1rem;}
}

/* ****************** 회원 :: 가입완료 ********************** */
.join-finish-wrap{max-width:900px; margin:auto; background:#f5f5f5; border-radius:2rem; padding:7.4rem 3rem; box-sizing:border-box;}
.join-finish-wrap .top-logo{text-align:center; margin-bottom:2.5rem;}
.join-finish-wrap .join-finish-txt-box{text-align:center; margin-bottom:5rem;}
.join-finish-wrap .join-finish-txt-box .tit{font-size:6.4rem; letter-spacing:-0.05em; line-height:1.25; color:#000; font-weight:700; margin-bottom:1rem;}
.join-finish-wrap .join-finish-txt-box .txt{font-size:1.8rem; letter-spacing:-0.015em; line-height:1.875; color:rgba(0,0,0,0.7); font-weight:600;}
.join-finish-wrap .join-finish-txt-box .txt span{color:var(--main-color);}

@media all and (max-width:800px){
	.join-finish-wrap{padding:3rem 1.5rem;}
	.join-finish-wrap .top-logo{margin-bottom:2rem;}
	.join-finish-wrap .join-finish-txt-box{margin-bottom:3rem;}
	.join-finish-wrap .join-finish-txt-box .tit{font-size:3rem; }
	.join-finish-wrap .join-finish-txt-box .txt{font-size:1.6rem;}
}


/* ****************** 마이페이지 ********************** */
/* 마이페이지 :: 메인 */
#mypageWrap{display: flex; justify-content:space-between; padding-top:4rem; border-top:2px solid #000;}
/* 마이페이지 :: 좌측메뉴 */
#mypageMenu{position: relative; width:27rem; padding-right:5rem; box-sizing:border-box; }
#mypageMenu:before{position: absolute; content:''; width:1px; height:100%; border-left:1px solid #eee; top:0; right:-2px;}
.mypage-menu-inner{padding:2rem 0 3rem; border-bottom:1px solid #eee;}
.mypage-menu-inner:last-child{border-bottom:0;}
.mypage-menu-inner .mypage-menu-tit{font-size:2rem; line-height:2; letter-spacing:-0.05em; color:#000; font-weight:700;}
.mypage-menu-inner .mypage-menu{}
.mypage-menu-inner .mypage-menu li{margin:1rem 0;}
.mypage-menu-inner .mypage-menu li:last-child{margin-bottom:0;}
.mypage-menu-inner .mypage-menu li a{font-size:1.4rem; line-height:1.5; letter-spacing:-0.05em; color:#888; font-weight:500; transition:var(--transition-custom);}
/* active */
.mypage-menu-inner .mypage-menu li.active a,
.mypage-menu-inner .mypage-menu li a:hover{color:var(--main-color);}

/* 마이페이지 :: 우측메뉴 */
#mypageCon{position: relative; width:calc(100% - 27rem); padding-left:5rem; box-sizing:border-box; }
.mypage-con-inner{position: relative; border-bottom:2px solid #000; padding-bottom:6rem;}
.mypage-con-inner:before{position: absolute; content:''; width:1px; height:calc(100% - 4rem); border-left:1px solid #eee; top:0; left:-5rem;}
.mypage-con-inner.bd-no{border-bottom:0; padding-bottom:0;}
.mypage-con-inner.bd-no:before{height:calc(100% - 8rem);}
.mypage-con{border:2px solid #eee; box-sizing:border-box; border-radius:1rem; padding:4rem; margin-bottom:2rem;}
.mypage-con:last-child{margin-bottom:0;}
/* 마이페이지 :: 공통 :: 타이틀 */
.mypage-tit-box{display: flex; justify-content:space-between; align-items:flex-end;}
.mypage-tit-box .mypage-tit{font-size:2rem; line-height:1.5; letter-spacing:-0.05em; color:#000; font-weight:700;}
.mypage-tit-box .plus-txt{font-size:1.4rem; line-height:1.15; letter-spacing:-0.05em; color:#888; font-weight:500;}
.mypage-txt{font-size:1.6rem; line-height:1.875; letter-spacing:-0.06em; color:#888;}
.mypage-tit-box + .mypage-txt{margin-top:3.5rem;}

.mypage-modify-con .mypage-con {margin-bottom: 4rem;}
.mypage-modify-con .mypage-tit-box + .mypage-txt{margin-top:1.5rem;} 
/* 마이페이지 :: 공통 :: 버튼 */
.mypage-btn-list{display: flex; margin:0 -0.5rem;}
.mypage-btn-list .mypage-btn{display: flex; align-items:center; justify-content:center; height:4rem; border-radius:4rem; border:2px solid #000; background:#000; margin:0 0.5rem; box-sizing:border-box; font-size:1.5rem; letter-spacing:-0.06em; color:#fff; font-weight:700; padding:0 2rem; text-align:center;}
.mypage-btn-list .mypage-btn.cm-fill-btn:before{display: none;}
.mypage-btn-list .mypage-btn.btn-style01{border-color:var(--main-color); background:var(--main-color);}
.mypage-btn-list .mypage-btn.btn-style02{border-color:#ddd; background:#fff; color:#000;}
.mypage-btn-list .mypage-btn.btn-style02.cm-fill-btn .cm-fill{background:#ddd;}

/* 마이페이지 :: 인덱스 :: 상단 */
.mypage-index-top{display: flex; align-items:center; justify-content:space-between;}
/* 마이페이지 :: 인덱스 :: 리스트 */
.mypage-index-list{display: flex; border-top:1px solid #eee; padding-top:4rem; margin-top:2rem;}
.mypage-index-list .list-item{position: relative; width:50%; text-align:center; padding:0 1rem; box-sizing: border-box;}
.mypage-index-list .list-item:before{position: absolute; content:''; width:1px; height:6rem; top:50%; right:0; transform:translateY(-50%); background:#eee;}
.mypage-index-list .list-item:last-child:before{display: none;}
.mypage-index-list .list-item .tit{font-size:1.4rem; line-height:1.5; color:#000; font-weight:500;}
.mypage-index-list .list-item .num{display: inline-block; font-size:4rem; line-height:1; color:#000; font-weight:700; margin-top:2rem;}
/* no-items */
.mypage-index-list .list-item.no-items .num{color:#ccc}

/* 마이페이지 :: 정보수정 */
#mypageCon .join-write-con .left-box{width:20%; padding:1.8rem 2rem; box-sizing:border-box;}
#mypageCon .join-write-con .left-box .join-tit{font-size:2.4rem; letter-spacing:0.024em;}
#mypageCon .join-write-con .right-box{width:80%;}

.mypage-con-inner + .cm-btn-controls{margin-top:6rem;}

/* 마이페이지 :: 대리점회원 전환신청 */
.mypage-con:has(.mypage-inquiry-box){margin-bottom:4rem;}
.mypage-inquiry-box{display: flex; justify-content:space-between; align-items:center; border-top:2px solid #000; padding:3rem 0 2rem; margin-top:2.5rem;}
.mypage-inquiry-box .inquiry-txt{display: flex; font-size:1.6rem; letter-spacing:-0.015em; line-height:1.5; color:#000;}
.mypage-inquiry-box .inquiry-txt dt{font-weight:700; width:11rem;}
.mypage-inquiry-box .inquiry-txt dd{font-weight:500; width:calc(100% - 11rem);}
.mypage-inquiry-box .mypage-btn{ min-width:14rem;}

/* 마이페이지 :: 내가 작성한 글 */
@media all and (min-width:801px){
	#mypageCon .bbs-list-style01 {}
	#mypageCon .bbs-list-style01 .bbs-item {}
	#mypageCon .bbs-list-style01 .bbs-item a {height: 8.4rem;}
	#mypageCon .bbs-list-style01 .bbs-item a .bbs-list-num {width: 10rem;}

	#mypageCon .bbs-list-style01 .bbs-item a .bbs-list-info-con {width: calc(100% - 39rem); padding: 0 2rem;}
	#mypageCon .bbs-list-style01 .bbs-item a .bbs-list-info-con .bbs-subject-txt {font-size: 2rem; }
}

.bbs-list-style01 .bbs-item a .bbs-list-category {text-align: center; width: 13rem; font-size: 1.6rem; font-weight: 700; color: var(--main-color); letter-spacing: -0.04em; line-height: 1.3;}


/* ****************** 마이페이지 ********************** */
@media all and (max-width:1280px){
	/* 마이페이지 :: 정보수정 */
	#mypageCon .join-write-con{display: block;}
	#mypageCon .join-write-con .left-box{width:100%; padding-inline:0; margin-bottom:0;}
	#mypageCon .join-write-con .right-box{width:100%;}
}
@media all and (max-width:800px){
	/* 마이페이지 :: 메인 */
	#mypageWrap{flex-direction:column-reverse;}
	/* 마이페이지 :: 좌측메뉴 */
	#mypageMenu{display: flex; flex-wrap:wrap; width:100%; padding-right:0rem; margin-top:5rem;}
	#mypageMenu:before{display: none;}
	#mypageMenu .mypage-menu-inner{width:50%; padding:1rem 0; }
	#mypageMenu .mypage-menu-inner:nth-last-child(-n+2){border:none;}
	/* 마이페이지 :: 우측메뉴 */
	#mypageCon{width:100%; padding-left:0;}
	.mypage-con-inner{position: relative; border-bottom:2px solid #000; padding-bottom:6rem;}
	.mypage-con-inner:before{display: none;}
	.mypage-con{padding:3rem 1.5rem;}
	/* 마이페이지 :: 공통 :: 타이틀 */
	.mypage-tit-box{}
	.mypage-tit-box .mypage-tit{font-size:1.8rem;}
	.mypage-tit-box .plus-txt{font-size:1.4rem;}
	.mypage-txt{font-size:1.4rem;}
	.mypage-tit-box + .mypage-txt{margin-top:2rem;}
	/* 마이페이지 :: 공통 :: 버튼 */
	.mypage-btn-list{display: flex; margin:0 -0.5rem;}
	.mypage-btn-list .mypage-btn{font-size:1.4rem; padding:0 1.5rem;}
	/* 마이페이지 :: 인덱스 :: 리스트 */
	.mypage-index-list{flex-wrap:wrap; padding-top:1rem; margin:2rem 0 -2rem;}
	.mypage-index-list .list-item{width:25%; margin:2rem 0;}
	.mypage-index-list.list05 .list-item{width:20%;}
	.mypage-index-list:not(.list05) .list-item:nth-child(4n):before{display: none;}
	.mypage-index-list .list-item .num{font-size:3rem;}
	
	/* 마이페이지 :: 대리점회원 전환신청 */
	.mypage-con:has(.mypage-inquiry-box){margin-bottom:3rem;}
	.mypage-inquiry-box{display: block; padding:2rem 0 1.5rem; margin-top:2rem;}
	.mypage-inquiry-box .mypage-btn{width:100%; margin-top:2rem;}
	
	/* 마이페이지 :: 내가 작성한 글 */
	.bbs-list-style01 .bbs-item a .bbs-list-category {width:100%; text-align:left; margin-bottom:1rem;} 
	#mypageCon .bbs-list-style01 .bbs-item a .bbs-list-info-con .bbs-subject-txt {font-size: 2rem; }
}
@media all and (max-width:480px){
	.mypage-index-top{display: block;}
	.mypage-index-top .mypage-tit-box{margin-bottom:1rem;}
}

/* 제품페이지 :: 원형 인트로 효과 */
.sub-intro-circle-wrap{position: absolute; top: 0; left: 0; width: 100%; height: 100%; /* transform:scale(2); */ opacity:0; transition:all 1s ease-in-out;}
#visual.active .sub-intro-circle-wrap{/* transform:scale(1); */ opacity:1;}

@media all and (min-width:801px){
	#visual.active.top-fixed .sub-intro-circle-wrap{/* transform:scale(2); */ opacity:0; width:200%; height:200%; margin-left:-50%; margin-top:-10%;}
}

/* ****************** Cookies Settings Center ********************** */
.cookie-con {padding: 5rem 0 0; border-top: 1px solid #000;}
.cookie-con .cookie-txt-con {padding-bottom: 5rem;}
.cookie-con .cookie-txt-con strong {display: block; font-size: 3rem;font-weight: 700;letter-spacing: -0.02em;color: #000; line-height: 1.2;margin-bottom: 2rem;}
.cookie-con .cookie-txt-con .txt {font-size: 1.6rem; font-weight: 400;  letter-spacing: -0.02em;color: #000;  line-height: 1.75;}
.cookie-con .cookie-txt-con .txt a {color: #000; border-bottom: 1px solid #000; font-weight: 700;}
.cookie-con .join-agree-con {margin-bottom: 3rem;}
.cookie-inner {padding: 2rem 0 4rem; border-bottom: 1px solid rgba(0, 0, 0, 0.1);}
.cookie-inner .cookie-txt { font-size: 1.6rem; line-height: 1.67; color: #000;}

.cookie-btn-controls{overflow:hidden; display:flex; align-items:center; justify-content:space-between; text-align:center; margin-top:50px;}
.cookie-btn-controls .left-btn-controls,
.cookie-btn-controls .right-btn-controls{display:flex; margin: 0 -0.5rem;}
.cookie-btn-controls button,
.cookie-btn-controls a {width: 25rem; margin: 0 0.5rem;} 
.cookie-btn-controls .btn-style01:hover {color: #fff;}

@media all and (max-width:800px){
	.cookie-btn-controls button,
	.cookie-btn-controls a {width: 16rem;}
}
@media all and (max-width:480px){
	.cookie-btn-controls {display: block;}
	.cookie-btn-controls .left-btn-controls,
	.cookie-btn-controls .right-btn-controls {display: block;}
	.cookie-btn-controls button,
	.cookie-btn-controls a {width: 100%;  margin: 0 auto 1rem;}
}