ul,ol{list-style: none;}
button{cursor: pointer;}
input{outline: none;}
*{font-family: 'pretendard';}
html,body,#wrap,#root,.dotsContentWrap{height: 100%;}
.wrap_admin,.dotsContentWrap{height: 100%; background-color: #F9F9F9;}
/* html,body{height: 100%; background-color: #f6f6f6;} */

aside{z-index: 99; background-color: #222222 !important; width: 280px; height: 100%; position: fixed; left: 0; top: 0;}
aside h2{padding: 20px 25px; box-sizing: border-box; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.4);}
aside .mainMenu{padding: 0 10px; box-sizing: border-box; margin-top: 15px;}
aside .mainMenu > li{margin-bottom: 5px; box-sizing: border-box;}
aside .mainMenu > li > span{cursor: pointer; position: relative; display: block; color: #EEEEEE; font-size: 15px; padding: 15px 15px 12px 45px; box-sizing: border-box;}
aside .mainMenu > li > span:before{content: ''; position: absolute; left: 20px; top: 50%; transform: translateY(-50%); background-repeat: no-repeat; background-size: contain; background-position: center;}
aside .mainMenu > li > span:after{transform-origin: 50% 1px; transform: rotate(0deg); transition: transform 0.1s ease-in-out; content: ''; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); width: 4px; height: 7px; background: url('/assets/images/sideBar_arrow.png') center / contain no-repeat;}
aside .mainMenu > li:hover span:after,
aside .mainMenu > li.active span:after{transform: rotate(90deg); transition: transform 0.5s ease-in-out;}
aside .mainMenu > li.analytics span:before{background-image: url('/assets/images/analytics.png'); width: 16px; height: 14px;}
aside .mainMenu > li.members span:before{background-image: url('/assets/images/members.png'); width: 14px; height: 16px;}
aside .mainMenu > li:nth-child(1) span:before{background-image: url('/assets/images/icon1.png'); width: 16px; height: 14px;}
aside .mainMenu > li:nth-child(2) span:before{background-image: url('/assets/images/icon2.png'); width: 16px; height: 16px;}
aside .mainMenu > li:nth-child(3) span:before{background-image: url('/assets/images/icon3.png'); width: 16px; height: 16px;}
aside .mainMenu > li:nth-child(4) span:before{background-image: url('/assets/images/icon4.png'); width: 16px; height: 16px;}
aside .mainMenu > li.active > span{border-radius: 5px; color: #fff; background-color: rgba(255,255,255,0.05);}
aside .mainMenu > li .subMenu{padding: 15px 0 35px 30px; box-sizing: border-box;}
aside > ul > li > ul{display: none;}
/* aside > ul > li:hover > ul,
aside > ul > li.active > ul{display: block;} */
aside .mainMenu > li .subMenu.active{display: block;}
aside .mainMenu > li .subMenu li{cursor: pointer; padding-left: 15px; position: relative; line-height: 19px; color: #fff; font-size: 14px; font-weight: 400;}
aside .mainMenu > li .subMenu li:not(:last-child){margin-bottom: 15px;}
aside .mainMenu > li .subMenu li:before{content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: url('/assets/images/sideBar_subMenu_triangle.png') center / contain no-repeat; width: 4px; height: 8px;}
aside .mainMenu > li .subMenu li:hover,
aside .mainMenu > li .subMenu li.active span{color: #63FAFF;}
aside .mainMenu > li .subMenu li:hover:before,
aside .mainMenu > li .subMenu li.active:before{background-image: url('/assets/images/sideBar_subMenu_triangle_active.png');}
aside .mainMenu > li .subMenu li button{width: 18px; height: 18px; border-radius: 100%; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); padding: 0; margin: 0; background-color: transparent; border: none;}
aside .mainMenu > li .subMenu li button i{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); color: rgba(255,255,255,0.5); font-size: 8px;}
aside .mainMenu > li .subMenu li:hover button,
aside .mainMenu > li .subMenu li.active button{background-color: #111111;}
aside .mainMenu > li .subMenu li:hover button i,
aside .mainMenu > li .subMenu li.active button i{color: rgba(255,255,255,1);}
/* sideBar Fin */

/* header */
.dotsHeader .header{position: relative; display: flex; justify-content: right; padding-right: 25px; box-sizing: border-box; align-items: center;}
.dotsHeader .header > div:hover > div:nth-child(2){display: block;}
.dotsHeader .header > div > div:nth-child(1){cursor: pointer; height: 60px; display: flex; align-items: center;}
.dotsHeader .header > div > div:nth-child(1) .profileImg{display: block; width: 28px; height: 28px; border-radius: 5px; background-repeat: no-repeat; background-position: center; background-size: contain;}
.dotsHeader .header > div > div:nth-child(1) > div:nth-child(2) span{font-size: 13px; font-weight: 400; color: #555555; margin-left: 10px;}
.dotsHeader .header > div > div:nth-child(1) > div:nth-child(2) i{font-size: 7px; color: #999999; margin-left: 27px;}
.dotsHeader .header > div > div:nth-child(2){display: none; position: absolute; top: 55px; right: 25px; background-color: #fff; width: 200px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.05); padding: 15px;}
.dotsHeader .header > div > div:nth-child(2) span{position: relative; cursor: pointer; display: block; font-size: 14px; font-weight: 400; color: #666666; line-height: 36px; padding: 0 15px; box-sizing: border-box;}
.dotsHeader .header > div > div:nth-child(2) span:last-of-type{margin-bottom: 10px;}
.dotsHeader .header > div > div:nth-child(2) span:hover{text-decoration: underline;}
.dotsHeader .header > div > div:nth-child(2) span i{font-size: 7px; color: rgba(85,85,85,0.5); position: absolute; right: 10px; top: 50%; transform: translateY(-50%);}
.dotsHeader .header > div > div:nth-child(2) span:hover i{color: #1B6ADD;}
.dotsHeader .header > div > div:nth-child(2) button{transition: background 0.3s ease-out; line-height: 30px; border-radius: 4px; width: 100%; border: 1px solid #CCCCCC; background-color: #CCCCCC; color: #fff;}
.dotsHeader .header > div > div:nth-child(2) button:hover{background-color: #222222;}
/* header Fin */


/* login */
.admin_loginBox{width: 340px; position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.admin_loginBox h2{font-size: 42px; font-weight: 700; color: #222222; line-height: 60px; text-align: center; margin-bottom: 35px;}
.admin_loginBox .inputList:nth-of-type(1){margin-bottom: 10px;}
.admin_loginBox .inputList:nth-of-type(2){margin-bottom: 15px;}
/* 인풋 텍스트 커스텀 */
.admin_loginBox .inputList label{margin-bottom: 10px; display: block; font-size: 14px; font-weight: 400; color: #555555;}
.admin_loginBox .inputList label span{color: #C82222; font-size: 14px; font-weight: 400;}
.admin_loginBox .inputList input{padding: 17px 20px; box-sizing: border-box; border: 1px solid #EEEEEE; border-radius: 5px; width: 100%;}
.admin_loginBox .inputList input::placeholder{font-size: 14px; font-weight: 400; color: #CCCCCC;}
/* 인풋 텍스트 커스텀 Fin */
/* 인풋 체크박스 커스텀 */
.admin_loginBox .inputCheckBox{margin-bottom: 35px;}
.admin_loginBox .inputCheckBox input[type='checkbox']{display: none;}
.admin_loginBox .inputCheckBox label{font-size: 12px; color: #999999; cursor: pointer; position: relative; padding-left: 20px; font-weight: 400;}
.admin_loginBox .inputCheckBox label:before{content: ''; position: absolute; background: url('/assets/images/admin_checkBox.png') center / contain no-repeat; width: 12px; height: 12px; left: 0; top: 50%; transform: translateY(-50%);}
.admin_loginBox .inputCheckBox input[type='checkbox']:checked + label:before{background-image: url('/assets/images/admin_checkBox_checked.png');}
/* 인풋 체크박스 커스텀 Fin */
.admin_loginBox .inputList{position: relative;}
.admin_loginBox .inputList input{width: 100%; border-radius: 5px; border: 1px solid #EEEEEE; padding: 15px 15px 15px 55px; box-sizing: border-box; font-size: 14px; font-weight: 400; color: #555555; display: block;}
.admin_loginBox .inputList input::placeholder{color: #CCCCCC; font-size: 14px; font-weight: 400;}
.admin_loginBox .inputList input:focus{border: 1px solid #CCCCCC;}
.admin_loginBox .inputList label{position: absolute; left: 20px; top: 50%; transform: translateY(-50%);}
.admin_loginBtn{width: 100%; line-height: 50px; background-color: #1B6ADD; border: none; color: #fff; font-size: 15px; font-weight: 600; border-radius: 5px;}
/* login Fin */

.dotsContentWrap{padding-left: 280px; box-sizing: border-box;}
.dotsHeader{z-index: 9; position: fixed; background-color: #fff; width: 100%; height: 60px; left: 0; top: 0; padding-left: 280px; box-sizing: border-box; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);}
.dotsContentWrap .contentBox:not(.sendMail,.productAndComponent,.upload){background-color: #F9F9F9; height: 100%; padding: 105px 55px 0 55px; box-sizing: border-box;}
.dotsContentWrap .contentBox h3{font-size: 18px; font-weight: 600; color: #CCCCCC; line-height: 24px; margin-bottom: 10px;}
.dotsContentWrap .contentBox h4{display: flex; align-items: center; font-size: 20px; color: #222222; font-weight: 700; line-height: 27px;}
.dotsContentWrap .contentBox h4 > span{background-color: #999999; display: inline-block; font-size: 14px; color: #fff; font-weight: 500; border-radius: 4px; margin-left: 10px; padding: 0 10px; line-height: 23px;}
.dotsContentWrap .contentBox .flexWrap{height: 40px; display: flex; justify-content: space-between; align-items: center;}
.dotsContentWrap .contentBox .flexWrap .marinePickBox button{position: relative; padding: 5px 40px 5px 10px; border-radius: 5px; border: none; font-size: 14px; font-weight: 400; color: #666666;}
.dotsContentWrap .contentBox .flexWrap .marinePickBox button span{position: absolute; background: url('/assets/images/closeBtn_red.png') center / contain no-repeat; width: 8px; height: 8px; right: 12px; top: 50%; transform: translateY(-50%);}
.dotsContentWrap .contentBox .flexWrap .marinePickBox button:not(:first-child){margin-left: 5px;}
.dotsContentWrap .contentBox .flexWrap > div > button:not(:first-child){margin-left: 5px;}

.dotsContentWrap .contentBox.sendMail,
.dotsContentWrap .contentBox.productAndComponent,
.dotsContentWrap .contentBox.upload{background-color: #F9F9F9; padding: 105px 55px 0 55px; box-sizing: border-box;}

.search_box {border-bottom: 1px solid #E9E9E9;  height:35px; width:200px; display: flex; justify-content: space-between; align-items: center;}
.search_box input[type="text"] {height:38px; border:none; outline:none; background:none; width: calc(100% - 40px);}
.search_box input[type="text"]::placeholder {color:#CCCCCC; font-size: 14px; font-weight: 400;}
.search_box button {background-color: transparent; outline: none; border: none; height:38px; width:40px;}
.search_box button img{width:12px; height:12px;}


.sortWrap{position: relative;}
.sortWrap .sort {color: #CCCCCC; padding-right: 10px; cursor:pointer; display:inline-block;}
.sortWrap .sort::before {content:"\f0de"; font-weight: 900; font-family: "Font Awesome 6 Pro" !important; position:absolute; right:0; top:50%; transform:translateY(-50%); margin-top:-0.5px;}
.sortWrap .sort::after {content:"\f0dd"; font-weight: 900; font-family: "Font Awesome 6 Pro" !important; position:absolute; right:0; top:50%; transform:translateY(-50%); margin-top:0.5px;}
.sortWrap .sort::before,
table span.sort::after {font-size: 10px;}
.sortWrap .sort.desc::before {color:#CCCCCC;}
.sortWrap .sort.desc::after {color:#999999;}
.sortWrap .sort.asc::before {color:#999999;}
.sortWrap .sort.asc::after {color:#CCCCCC;}

table{width: 100%;}
.table_hover thead tr th{text-align: left; border-bottom: 1px solid #AAAAAA; padding-bottom: 15px; font-size: 15px; font-weight: 600; color: #666666;}
.table_hover tbody tr td{border-bottom: 1px solid #E9E9E9; font-size: 15px; color: #888888; font-weight: 400;}
.table_hover tbody tr:hover td{cursor: pointer; background-color: rgba(242,242,242,0.5);}
.table_hover tbody tr td.deleteBox{text-align: center;}
.table_hover tbody tr td.deleteBox button{border: 1px solid #B50000; border-radius: 5px; transition: background 0.2s ease-out; background-color: transparent; color: #B50000; font-size: 14px; font-weight: 500;}
.table_hover tbody tr td.deleteBox button:hover{background-color: #B50000; color: #fff;}

.listOfMembers table tr td,
.listOfSentMail table tr td,
.listOfInquiry table tr td,
.listOfDeletedInquiry table tr td,
.administrator table tr td{padding: 20px 0;}

.listOfMembers .flexWrap,
.listOfSentMail .flexWrap,
.productAndComponent .flexWrap,
.marineNews .flexWrap,
.catalogue .flexWrap,
.video .flexWrap,
.tech_document .flexWrap,
.supplier .flexWrap,
.contentCategory .flexWrap,
.listOfInquiry .flexWrap,
.listOfDeletedInquiry .flexWrap,
.administrator .flexWrap,
.companySetting .flexWrap,
.forums .flexWrap{margin-bottom: 50px;}
.sendMail .contentBox .flexWrap,
.inquiryView .flexWrap,
.administratorAdd .flexWrap{margin-bottom: 20px;}

/* table 말줄임 */
table tbody tr td span.ellipsis{display: block; overflow: hidden; text-overflow: ellipsis; white-space:nowrap;}
.listOfMembers table tbody tr td:nth-child(1) span{width: 100px;}
.listOfMembers table tbody tr td:nth-child(2) span{width: 200px;}
.listOfMembers table tbody tr td:nth-child(3) span{width: 200px;}
.listOfSentMail table tbody tr td:nth-child(1) span{width: 160px;}
.listOfSentMail table tbody tr td:nth-child(2) span{width: 700px;}
.productAndComponent tbody tr td:nth-child(2) span{width: 600px;}
/* .productAndComponent tbody tr td:nth-child(4) span{width: 220px;} */
.marineNews tbody tr td:nth-child(2) span{width: 290px;}
.marineNews tbody tr td:nth-child(5) span{width: 190px;}
.catalogue tbody tr td:nth-child(2) span{width: 330px;}
.catalogue tbody tr td:nth-child(5) span{width: 190px;}
.video tbody tr td:nth-child(2) span{width: 330px;}
.video tbody tr td:nth-child(5) span{width: 190px;}
.tech_document tbody tr td:nth-child(2) span{width: 330px;}
.tech_document tbody tr td:nth-child(5) span{width: 190px;}
.supplier tbody tr td:nth-child(2) span{width: 310px;}
.supplier tbody tr td:nth-child(4) span{width: 210px;}
.supplier tbody tr td:nth-child(6) span{width: 210px;}
.listOfDeletedInquiry tbody tr td:nth-child(2) span,
.listOfInquiry tbody tr td:nth-child(2) span{width: 700px;}
.administrator tbody tr td:nth-child(1) span,
.administrator tbody tr td:nth-child(2) span{width: 120px;}
.companySetting tbody tr td:nth-child(2) span{width: 300px;}
.companySetting tbody tr td:nth-child(3) span{width: 150px;}
.companySetting tbody tr td:nth-child(4) span{width: 220px;}
.companySetting tbody tr td:nth-child(6) span{width: 280px;}
/* table 말줄임 */

/* list of Members */
.listOfMembers .toggleSwitch{float: right;}

.listOfMembers table thead tr th:nth-child(1),
.listOfMembers table tbody tr td:nth-child(1){padding-left: 20px; box-sizing: border-box; width: 125px;}
.listOfMembers table thead tr th:nth-child(2){width: 250px;}
.listOfMembers table thead tr th:nth-child(3),
.listOfMembers table thead tr th:nth-child(4){width: 230px;}
.listOfMembers table thead tr th:nth-child(5){padding-right: 25px; text-align: right;}
.listOfMembers table tbody tr.active td:nth-child(1){color: #1B6ADD;}
.listOfMembers table tbody tr td:last-of-type{padding-right: 50px; box-sizing: border-box;}
/* List of Members Fin */

/* List of Sent Mail */
.listOfSentMail table{margin-bottom: 15px;}
.listOfSentMail table thead tr th:nth-child(1),
.listOfSentMail table tbody tr td:nth-child(1){padding-left: 20px; width: 180px;}
.listOfSentMail table thead tr th:nth-child(3),
.listOfSentMail table tbody tr td:nth-child(3){width: 105px;}
.writeMailBtn{transition: background 0.3s ease-out; width: 100%; background-color: #EEEEEE; border: none; font-size: 15px; font-weight: 400; color: #666666; line-height: 40px; border-radius: 5px;}
.writeMailBtn:hover{background-color: #222222; color: #fff;}
/* List of Sent Mail Fin */

/* 관리자 pager */
.pagerBox{position: sticky; top: 100%; padding-bottom: 35px; display: flex; align-items: end; justify-content: space-between;}
/* .pagerBox{position: fixed; bottom: 0; left: 0; width: 100%; display: flex; align-items: end; justify-content: space-between; padding: 0 55px 35px 335px; box-sizing: border-box;} */
.pagerBox p{font-size: 13px; font-weight: 400; color: #CCCCCC;}
.pagerBox > div{display: flex;}
.pagerBox > div button{transition: background 0.2s ease-out; position: relative; width: 28px; height: 28px; border-radius: 5px; border: none; background-color: transparent;}
.pagerBox > div button:after{content: ''; display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 4px; height: 8px; background-repeat: no-repeat; background-position: center; background-size: contain;}
.pagerBox > div button:hover{background-color: #9ABD32; color: #fff;}
.pagerBox > div .left:after{background-image: url('/assets/images/admin_pager_left.png');}
.pagerBox > div .right:after{background-image: url('/assets/images/admin_pager_right.png');}
.pagerBox > div .left:hover:after{background-image: url('/assets/images/admin_pager_left_hover.png');}
.pagerBox > div .right:hover:after{background-image: url('/assets/images/admin_pager_right_hover.png');}
.pagerBox ol{display: flex; margin: 0 18px;}
.pagerBox ol li{font-size: 14px; font-weight: 400; color: #999999; transition: background 0.2s ease-out; cursor: pointer; width: 28px; height: 28px; border-radius: 5px; background-color: transparent; line-height: 28px; text-align: center;}
.pagerBox ol li:not(.dot):hover,
.pagerBox ol li:not(.dot).active{background-color: #222222; color: #fff;}
/* 관리자 pager Fin */

/* 토글 버튼 */
.toggleSwitch{width: 28px; height: 16px; display: block; position: relative; border-radius: 18px; background-color: #CCCCCC; cursor: pointer;}
.toggleSwitch .toggleButton{width: 10px; height: 10px; position: absolute; top: 50%; left: 4px; transform: translateY(-50%); border-radius: 50%; background: #fff; box-shadow:rgb(181 181 181) 1px 1px 3px;}

/* 체크박스가 체크되면 변경 이벤트 */
.toggleIpt:checked ~ .toggleSwitch{background: #222222;}
.toggleIpt:checked ~ .toggleSwitch .toggleButton{left: 13px; background: #fff;}
.toggleSwitch, .toggleButton{transition: all 0.2s ease-in;}
/* 체크박스가 체크되면 변경 이벤트 Fin */
/* 토글 버튼 Fin */

/* 공통 버튼 */
.blackBtn,
.blueBtn,
.redBtn{transition: background 0.3s ease-out; padding: 7px 14px; font-size: 14px; font-weight: 400; background-color: transparent; border-radius: 5px;}
.blackBtn{color: #999999; border: 1px solid #DDDDDD;}
.blackBtn:hover{background-color: #222222; color: #fff; border-color: #222222;}
.blueBtn{color: #1B6ADD; border: 1px solid #1B6ADD;}
.blueBtn:hover{background-color: #1B6ADD; color: #fff;}
.redBtn{color: #C82222; border: 1px solid #C82222;}
.redBtn:hover{background-color: #C82222; color: #fff;}
/* 공통 버튼 Fin */

/* 공통 radio */
.radioWrap{display: flex; align-items: center;}
.radioWrap .radioBox:not(:first-child){margin-left: 30px;}
.radioBox input[type='radio']{display: none;}
.radioBox label{font-size: 15px; font-weight: 500; color: #666666; position: relative; padding-left: 18px;}
.radioBox label:before{content: ''; background: url('/assets/images/admin_radio.png') center / contain no-repeat; width: 10px; height: 15px; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.radioBox input[type='radio']:checked + label:before{background-image: url('/assets/images/admin_radio_checked.png');}
/* 공통 radio Fin */

.popUp_active{display: none;}
.popUp_active.active{display: block;}

/* List of Members PopUp */
.userInfo_popUp{box-shadow: -2px 0px 10px rgba(0, 0, 0, 0.15); z-index: 9; position: fixed; right: 0; top: 60px; width: 520px; height: calc((100% - 60px)); padding-top: 160px; box-sizing: border-box; background-color: #E2E2E2;}
.userInfo_popUp .userInfoBox{overflow-y: scroll; background-color: #fff; height: 100%;}
.userInfo_popUp .profileImgBox{left: 50%; transform: translateX(-50%); background-color: #fff; padding: 10px; border-radius: 10px; position: absolute; top: 130px;}
.userInfo_popUp span{display: block;}
.userInfo_popUp .userName{padding-top: 120px; font-size: 20px; line-height: 24px; font-weight: 600; color: #555555; text-align: center; margin-bottom: 7px;}
.userInfo_popUp .userPostBox{margin-bottom: 40px; display: flex; justify-content: center;}
.userInfo_popUp .userPostBox > div{display: flex;}
.userInfo_popUp .userPostBox > div:nth-child(1){position: relative; padding-right: 15px; margin-right: 15px;}
.userInfo_popUp .userPostBox > div:nth-child(1):after{content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 10px; background-color: #DDDDDD;}
.userInfo_popUp .userPostBox > div > span:nth-child(1){color: #999999; font-weight: 300;}
.userInfo_popUp .userPostBox > div > span:nth-child(2){margin-left: 5px; color: #1B6ADD; font-weight: 400;}
.userInfo_popUp ul{padding: 0 30px; box-sizing: border-box;}
.userInfo_popUp ul li{display: flex; padding: 22px 30px; box-sizing: border-box; background-color: #FBFBFB; border-radius: 5px;}
.userInfo_popUp ul li:not(:last-child){margin-bottom: 15px;}
.userInfo_popUp ul li span:nth-child(1){width: 100px; font-weight: 600; font-size: 14px; color: #222222;}
.userInfo_popUp ul li span:nth-child(2){color: #777777; font-size: 14px; font-weight: 400;}
.userInfo_popUp .mailSendBox{position: absolute; width: 100%; right: 20px; bottom: 20px;}
.userInfo_popUp .mailSendBox .mailSendBtn{position: absolute; right: 20px; bottom: 3px; background-color: transparent; border: none;}
.userInfo_popUp .mailSendBox .mailSendBtn span{transition: all 0.3s ease-out; display: block; background: url('/assets/images/admin_submitBtn.png') center / contain no-repeat; width: 18px; height: 18px;}
.userInfo_popUp .mailSendBox .mailSendBtn:hover span{background-image: url('/assets/images/admin_submitBtn_hover.png');}
.userInfo_popUp .mailSendBox .mailSendBtn:hover + span{opacity: 1; transition: all 0.3s ease-out;}
.userInfo_popUp .mailSendBox > span{opacity: 0; background-color: #222222; color: #fff; font-size: 12px; font-weight: 400; padding: 7px 12px; border-radius: 5px; position: absolute; right: 55px; bottom: 0px;}
.userInfo_popUp .mailSendBox > span:after{content: ''; position: absolute; right: -9px; top: 50%; transform: translateY(-50%); background: url('/assets/images/admin_triangle.png') center / contain no-repeat; width: 13px; height: 9px;}
.userInfo_popUp  .toggleSwitchBox{position: absolute; bottom: 25px; left: 30px;}
.userInfo_popUp  .toggleSwitchBox > label{font-size: 13px; font-weight: 600; color: #999999; margin-right: 5px;}
.userInfo_popUp  .toggleSwitchBox .toggleSwitch{float: right;}
.userInfo_popUp .closeBtn{position: absolute; top: 15px; right: 15px; width: 40px; height: 40px; border-radius: 100%; border: none;}
.userInfo_popUp .closeBtn i{font-size: 14px; animation: rotate_Btn_return 0.5s backwards;}
.userInfo_popUp .closeBtn:hover{background-color: #222222;}
.userInfo_popUp .closeBtn:hover i{animation: rotate_Btn 0.5s backwards; color: #63FAFF;}

@keyframes rotate_Btn {
    0% {
      transform: rotate(0deg);
    }
  
    100% {
      transform: rotate(90deg);
    }
  }
  
  @keyframes rotate_Btn_return {
    0% {
      transform: rotate(0deg);
    }
  
    100% {
      transform: rotate(-90deg);
    }
  }
/* List of Members PopUp Fin */

/* List of Sent Mail PopUp */
.sentMail_popUp{position: fixed; z-index: 99; height: 100%; width: calc(100% - 280px); left: 280px; top: 0; background: transparent; /* Note: currently only Safari supports backdrop-filter */ backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); background-color: rgba(0, 0, 0, 0.4);}
.sentMail_popUp > div{width: 710px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.sentMail_popUp .sentMailWrap{margin-bottom: 15px; padding: 30px 30px 40px 30px; box-sizing: border-box; border-radius: 5px; background-color: #fff;}
.sentMail_popUp .sentMailWrap > p{font-size: 12px; font-weight: 300; color: #AAAAAA; text-align: center;}
.sentMail_popUp .closeBtn{position: absolute; right: -20px; top: -20px; border-radius: 100%; width: 40px; height: 40px; background-color: #1B6ADD; border: none;}
.sentMail_popUp .closeBtn:hover{background-color: #222222;}
.sentMail_popUp .closeBtn i{animation: rotate_Btn_return 0.5s backwards; color: #fff; font-size: 14px;}
.sentMail_popUp .closeBtn:hover i{animation: rotate_Btn 0.5s backwards; color: #63FAFF;}
.sentMail_popUp h5{font-size: 20px; color: #222222; font-weight: 700; line-height: 24px; margin-bottom: 25px;}
.sentMail_popUp .recipientBox{margin-bottom: 15px;}
.sentMail_popUp .recipientBox .gray{padding: 5px 10px; background-color: #999999; border-radius: 5px; font-size: 14px; font-weight: 400; color: #fff;}
.sentMail_popUp .recipientBox .recipient{font-size: 14px; font-weight: 400; color: #555555; margin-left: 10px;}
.sentMail_popUp .mailTemplateBox{margin-bottom: 15px; border: 1px solid #DDDDDD; border-radius: 5px;}
.sentMail_popUp .mailTemplateBox .mailTemplate_header{border-bottom: 1px solid #DDDDDD; padding: 25px 15px 10px 30px; box-sizing: border-box;}
.sentMail_popUp .mailTemplateBox .mailTemplate_header img{width: 100%; max-width: 142px;}
.sentMail_popUp .mailTemplateBox .mailTemplate_header > div{margin-bottom: 35px;}
.sentMail_popUp .mailTemplateBox .mailTemplate_header > p{text-align: right;}
.sentMail_popUp .mailTemplateBox .mailTemplate_header > p span{font-size: 12px; font-weight: 300; color: #999999;}
.sentMail_popUp .mailTemplateBox .mailTemplate_content{padding: 40px 40px 30px 40px; box-sizing: border-box;}
.sentMail_popUp .mailTemplateBox .mailTemplate_content h6{font-size: 28px; font-weight: 700; color: #1B6ADD; line-height: 33px; margin-bottom: 35px;}
.sentMail_popUp .mailTemplateBox .mailTemplate_content p{font-size: 16px; font-weight: 300; line-height: 26px; color: #444444;}
.sentMail_popUp .mailTemplateBox .mailTemplate_content p:not(:last-of-type){margin-bottom: 25px;}
.sentMail_popUp .mailTemplateBox .mailTemplate_content p:last-of-type{margin-bottom: 30px;}
.sentMail_popUp .mailTemplateBox .mailTemplate_content button{border: none; background-color: #222222; border-radius: 5px; color: #fff; font-size: 16px; font-weight: 400; width: 100%; line-height: 50px;}
.sentMail_popUp .mailTemplateBox .mailTemplate_footer{background-color: #F2F2F2; padding: 30px 40px 20px 40px; box-sizing: border-box;}
.sentMail_popUp .mailTemplateBox .mailTemplate_footer span{font-size: 12px; font-weight: 300; color: #777777;}
.sentMail_popUp .mailTemplateBox .mailTemplate_footer > div:not(:last-of-type){margin-bottom: 15px;}
.sentMail_popUp .mailTemplateBox .mailTemplate_footer > div:last-of-type{margin-bottom: 25px;}
.sentMail_popUp .mailTemplateBox .mailTemplate_footer > div:nth-child(1) > span:nth-child(1),
.sentMail_popUp .mailTemplateBox .mailTemplate_footer > div:nth-child(3) > span:nth-child(1){padding-right: 15px; margin-right: 15px; position: relative;}
.sentMail_popUp .mailTemplateBox .mailTemplate_footer > div:nth-child(1) > span:nth-child(1):after,
.sentMail_popUp .mailTemplateBox .mailTemplate_footer > div:nth-child(3) > span:nth-child(1):after{content: ''; width: 1px; height: 12px; background-color: #CCCCCC; display: block; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
.sentMail_popUp .mailTemplateBox .mailTemplate_footer p{font-size: 12px; font-weight: 300; color: #AAAAAA;}
.sentMail_popUp .mailTemplateBox .mailTemplate_footer p strong{font-weight: 300; text-decoration: underline; cursor: pointer;}
.sentMail_popUp .progressBox{display: flex; justify-content: space-between;}
.sentMail_popUp .progressBox span{font-size: 13px; font-weight: 400; color: #fff;}
/* List of Sent Mail PopUp Fin */

/* Send Mail */
.sendMail .flexWrap{margin-bottom: 15px; padding-bottom: 23px; border-bottom: 1px solid #AAAAAA;}
/* .sendMail .flexWrap .btnBox .blackBtn{margin-right: 5px;} */

.sendMail table input[type='text']{margin: 0; padding: 0; border-width: 0;}
.sendMail table tbody tr th{width: 110px; padding-left: 20px;}
.sendMail table tbody tr th span{font-size: 15px; font-weight: 600; color: #444444; display: block; text-align: left;}
.sendMail table tbody tr td .table_flexWrap{display: flex; align-items: center;}

.sendMail table tbody tr:nth-child(1) th{padding-bottom: 20px;}
.sendMail table tbody tr:nth-child(1) .table_flexWrap{justify-content: space-between;}
.sendMail table tbody tr:nth-child(1) .table_flexWrap > div:nth-child(2){padding: 0; width: 1195px;}
.sendMail table tbody tr:nth-child(1) .table_flexWrap > div:nth-child(2) input{width: 100%; border: 1px solid #DDDDDD; padding: 10px 15px; box-sizing: border-box; border-radius: 5px; background-color: #f9f9f9;}
.sendMail table tbody tr:nth-child(1) .table_flexWrap > div:nth-child(2) input::placeholder{font-size: 12px; font-weight: 400; color: #CCCCCC;}
.sendMail table tbody tr:nth-child(2) th > div{display: flex; align-items: center;}
.sendMail table tbody tr:nth-child(2) .importantBox{margin-left: 15px; display: flex; align-items: center;}
.sendMail table tbody tr:nth-child(2) .importantBox input[type='checkbox']{display: none;}
.sendMail table tbody tr:nth-child(2) .importantBox label{padding-left: 15px; position: relative; display: flex; align-items: center; font-size: 12px; font-weight: 400; color: #999999;}
.sendMail table tbody tr:nth-child(2) .importantBox label:before{content: ''; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: url('/assets/images/admin_checkBox.png') center / contain no-repeat; width: 12px; height: 12px;}
.sendMail table tbody tr:nth-child(2) .importantBox input[type='checkbox']:checked + label:before{background-image: url('/assets/images/admin_checkBox_checked.png');}
.sendMail table tbody tr:nth-child(2) .importantBox label span{margin-left: 5px; color: #C82222;}
.sendMail table tbody tr:nth-child(2) td input{font-size: 15px; font-weight: 400; color: #666666; border-bottom: 1px solid #DDDDDD; padding: 10px 0; width: 100%; background-color: #f9f9f9;}
.sendMail table tbody tr:nth-child(3) th{vertical-align: top;}
.sendMail table tbody tr:nth-child(3) th,
.sendMail table tbody tr:nth-child(3) td{padding-top: 30px; padding-bottom: 30px;}
.sendMail table tbody tr:nth-child(3) td .templateTypeList{display: flex;}
.sendMail table tbody tr:nth-child(3) td .templateTypeList > div:not(:first-of-type){margin-left: 20px;}
.sendMail table tbody tr:nth-child(3) td .templateTypeList > div:not(:first-of-type) .radioBox label{text-indent: -9999px;}
.sendMail table tbody tr:nth-child(3) td .templateTypeList > div > div:nth-child(1){width: 148px; height: 189px; margin-bottom: 10px;}
.sendMail table tbody tr:nth-child(3) td .templateTypeList > div > div:nth-child(1) img{width: 100%;}
.sendMail table tbody tr:nth-child(3) td .templateTypeList > div .radioBox{display: flex; justify-content: center;}
.sendMail table tbody tr:nth-child(4) .table_flexWrap{display: flex; justify-content: space-between;}
.sendMail table tbody tr:nth-child(4) .table_flexWrap > div{display: flex; justify-content: space-between;}
.sendMail table tbody tr:nth-child(4) .table_flexWrap .radioWrap{width: 190px; padding-right: 15px; box-sizing: border-box;}
.sendMail table tbody tr:nth-child(4) td .radioWrap .radioBox:not(:first-child){margin-left: 0;}
.sendMail table tbody tr:nth-child(4) .table_flexWrap > div:nth-child(2){width: 1195px; justify-content: space-between;}
.sendMail table tbody tr:nth-child(4) .table_flexWrap > div:nth-child(2) > div:nth-child(1){width: 19%;}
.sendMail table tbody tr:nth-child(4) .table_flexWrap > div:nth-child(2) > div:nth-child(2){width: 80%;}
.sendMail table tbody tr:nth-child(4) .table_flexWrap > div:nth-child(2) > div input{border: 1px solid #DDDDDD; border-radius: 5px; padding: 10px 15px; box-sizing: border-box; width: 100%; background-color: #f9f9f9;}
.sendMail table tbody tr:nth-child(5) th span{position: relative; top: 10px;}
.sendMail table tbody tr:nth-child(5) td{padding-top: 35px; padding-bottom: 70px;}
/* Send Mail Fin */

/* 테이블 위 + 버튼 */
.dotsContentWrap .contentBox > .flexWrap .flexBox{display: flex; align-items: center;}
.dotsContentWrap .contentBox > .flexWrap .addBtn{transition: all 0.2s ease-out; margin-left: 5px; overflow: hidden; padding: 0; width: 23px; border-radius: 4px; background-color: #f9f9f9; border: 1px solid #CCCCCC; box-sizing: border-box;  position: relative; height: 23px;}
.dotsContentWrap .contentBox > .flexWrap .addBtn i{transition: background 0.1s ease-out; background-color: #f9f9f9; z-index: 1; position: absolute; width: 21px; height: 21px; left: 0; top: 50%; transform: translateY(-50%);}
.dotsContentWrap .contentBox > .flexWrap .addBtn i:before{font-size: 10px; color: #999999; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.dotsContentWrap .contentBox > .flexWrap .addBtn span{transition: all 0.3s ease-out; position: absolute; left: 20px; top: 50%; transform: translate(-100px, -50%); width: 55px;}
.dotsContentWrap .contentBox > .flexWrap .addBtn:hover{border: 1px solid #222222;}
.dotsContentWrap .contentBox > .flexWrap .addBtn:hover i{background-color: #222222;}
.dotsContentWrap .contentBox > .flexWrap .addBtn:hover i:before{color: #fff;}
.dotsContentWrap .contentBox > .flexWrap .addBtn:hover{width: 84px; background-color: #222222; color: #fff;}
.dotsContentWrap .contentBox > .flexWrap .addBtn:hover span{transform: translate(0, -50%);}
/* 테이블 위 + 버튼 Fin */

/* table 아래 Add New 버튼 */
.addNewBtn{transition: background 0.3s ease-out; margin-bottom: 30px; background-color: #EEEEEE; border: none; border-radius: 5px; font-size: 15px; font-weight: 400; color: #666666; line-height: 40px; width: 100%;}
.addNewBtn:hover{background-color: #222222; color: #fff;}
/* table 아래 Add New 버튼 Fin */

/* 썸네일 이미지 보여주는 테이블 공통 */
.thumb_table .toggleSwitch{margin: 0 auto;}
.thumb_table{margin-bottom: 15px;}
.thumb_table thead tr th,
.thumb_table tbody tr td{vertical-align: middle;}
.thumb_table thead tr th:nth-child(1){width: 160px; padding-left: 20px;}
.thumb_table tbody tr td:nth-child(1){padding: 15px 0 15px 20px;}
.thumb_table.thumbType_a tbody tr td:nth-child(1) img{max-width: 110px; height: 72px; width: 100%;}
.thumb_table.thumbType_b tbody tr td:nth-child(1) img{max-width: 110px; height: 138px; width: 100%;}
.contentBox:not(.contentCategory) .thumb_table tbody tr:hover td:nth-child(2){color: #555555; font-weight: 500;}
/* 썸네일 이미지 보여주는 테이블 공통 Fin */

/* 3D Product & Component */
.productAndComponent table thead tr th:nth-child(2){width: 950px;}
.productAndComponent table thead tr th:nth-child(3),
.productAndComponent table thead tr th:nth-child(4),
.productAndComponent table thead tr th:nth-child(5){width: 140px;}
.productAndComponent table thead tr th:nth-child(5){text-align: center;}
.productAndComponent table thead tr th:nth-child(6),
.productAndComponent table tbody tr td:nth-child(6),
.productAndComponent table thead tr th:nth-child(7),
.productAndComponent table tbody tr td:nth-child(7){text-align: center;}
.productAndComponent table tbody tr td:nth-child(3) i{margin: 0 5px;}
.productAndComponent table tbody tr td:nth-child(3) i:before{color: #BBBBBB; font-size: 4px;}
/* 3D Product & Component Fin */
 
/* Marine News */
.marineNews table thead tr th:nth-child(2){width: 350px;}
.marineNews table thead tr th:nth-child(3){width: 235px;}
.marineNews table thead tr th:nth-child(4){width: 305px;}
.marineNews table thead tr th:nth-child(5){width: 205px;}
.marineNews table thead tr th:nth-child(7),
.marineNews table tbody tr td:nth-child(7){text-align: center;}
.marineNews table tbody tr td:nth-child(4) > span:not(:first-child){margin-left: 15px;}
/* Marine News Fin */

/* catalogue */
.catalogue table thead tr th:nth-child(2){width: 1070px;}
.catalogue table thead tr th:nth-child(3){width: 150px; text-align: center;}
.catalogue table thead tr th:nth-child(4){width: 150px; text-align: center;}
.catalogue table thead tr th:nth-child(5){width: 205px;}
.catalogue table thead tr th:nth-child(7){text-align: center;}
.catalogue table tbody tr td:nth-child(4) span:not(:first-child){margin-left: 15px;}
/* catalogue Fin */

/* video */
.video table thead tr th:nth-child(2){width: 350px;}
.video table thead tr th:nth-child(3){width: 235px;}
.video table thead tr th:nth-child(4){width: 305px;}
.video table thead tr th:nth-child(5){width: 205px;}
.video table thead tr th:nth-child(7),
.video table tbody tr td:nth-child(7){text-align: center;}
.video table tbody tr td:nth-child(4) > span:not(:first-child){margin-left: 15px;}
/* video Fin */

/* Tech. Document */
.tech_document table thead tr th:nth-child(2){width: 350px;}
.tech_document table thead tr th:nth-child(3){width: 235px;}
.tech_document table thead tr th:nth-child(4){width: 305px;}
.tech_document table thead tr th:nth-child(5){width: 205px;}
.tech_document table thead tr th:nth-child(7){text-align: center;}
.tech_document table tbody tr td:nth-child(4) span:not(:first-child){margin-left: 15px;}
/* Tech. Document Fin */

/* supplier News */
.supplier table thead tr th:nth-child(2){width: 320px;}
.supplier table thead tr th:nth-child(3){width: 175px;}
.supplier table thead tr th:nth-child(4){width: 230px;}
.supplier table thead tr th:nth-child(5){width: 220px;}
.supplier table thead tr th:nth-child(7),
.supplier table tbody tr td:nth-child(7){text-align: center;}
.supplier table tbody tr td:nth-child(4) > span:not(:first-child){margin-left: 15px;}
/* supplier Fin */

/* Content Category */
.contentCategory table{margin-bottom: 15px;}
.contentCategory table thead tr th,
.contentCategory table tbody tr td{vertical-align: middle;}
.contentCategory table thead tr th:nth-child(1){width: 310px; padding-left: 20px;}
.contentCategory table thead tr th:nth-child(2){width: 1100px;}
.contentCategory table thead tr th:nth-child(3){text-align: center;}
.contentCategory table tbody tr td:nth-child(1){padding: 20px 0 20px 20px;}
.contentCategory table tbody tr td:nth-child(3) .toggleSwitch{margin: 0 auto;}
.contentCategory table tbody tr td .subCategoryBox{display: flex;}
.contentCategory table tbody tr td .subCategoryBox .subCategory{display: block; padding: 5px 10px; font-size: 15px; font-weight: 400; background-color: #888888; border-radius: 5px; color: #fff;}
.contentCategory table tbody tr td .subCategoryBox .subCategory:not(:first-child){margin-left: 5px;}
.contentCategory .thumb_table tbody tr:hover td:nth-child(1){color: #555555; font-weight: 500;}
.contentCategory table tbody tr:hover td .subCategoryBox .subCategory{background-color: #555555;}
/* Content Category Fin */

span.answer_before{color: #888888; font-size: 15px; font-weight: 400;}
span.answer_complete{color: #1B6ADD; font-size: 15px; font-weight: 400;}
/* List Of Inquiry */
.listOfInquiry table thead tr th:nth-child(1),
.listOfInquiry table tbody tr td:nth-child(1){padding-left: 20px; box-sizing: border-box; width: 110px;}
.listOfInquiry table thead tr th:nth-child(3),
.listOfInquiry table tbody tr td:nth-child(3){width: 110px;}
.listOfInquiry table tbody tr:hover td:nth-child(2){color: #555555; font-weight: 500;}
.listOfInquiry table tbody tr td:nth-child(3){color: #CCCCCC;}
.listOfInquiry table tbody tr:hover td:nth-child(3){color: #999999;}
/* List Of Inquiry Fin */

/* List of Deleted Inquiry */
.listOfDeletedInquiry table thead tr th:nth-child(1),
.listOfDeletedInquiry table tbody tr td:nth-child(1){padding-left: 20px; box-sizing: border-box; width: 130px;}
.listOfDeletedInquiry table tbody tr td:nth-child(1) span{font-size: 15px; font-weight: 400;}
.listOfDeletedInquiry table tbody tr td:nth-child(1) span.deleted_inquiry{color: #C82222;}
.listOfDeletedInquiry table tbody tr:hover td:nth-child(2){color: #555555; font-weight: 500;}
.listOfDeletedInquiry table tbody tr td:nth-child(3){color: #CCCCCC;}
.listOfDeletedInquiry table tbody tr:hover td:nth-child(3){color: #999999;}
.listOfDeletedInquiry table tbody tr td .btnBox{display: flex; justify-content: right; padding-right: 20px;}
.listOfDeletedInquiry table tbody tr td .btnBox button:not(:first-child){margin-left: 50px;}
.listOfDeletedInquiry table tbody tr td .btnBox button{position: relative; transition: color 0.3s ease-out; font-size: 15px; font-weight: 400; color: #AAAAAA; padding: 0 0 0 25px; background-color: transparent; border: none;}
.listOfDeletedInquiry table tbody tr td .btnBox .inquiry_restoreBtn:hover{color: #1B6ADD;}
.listOfDeletedInquiry table tbody tr td .btnBox .inquiry_deleteBtn:hover{color: #C82222;}
.listOfDeletedInquiry table tbody tr td .btnBox button:before{ transition: background 0.3s ease-out; content: ''; left: 0; top: 50%; transform: translateY(-50%); position: absolute; background-repeat: no-repeat; background-position: center; background-size: contain;}
.listOfDeletedInquiry table tbody tr td .btnBox .inquiry_restoreBtn:before{background-image: url('/assets/images/inquiry_restore.png'); width: 16px; height: 16px;}
.listOfDeletedInquiry table tbody tr td .btnBox .inquiry_deleteBtn:before{background-image: url('/assets/images/inquiry_delete.png'); width: 14px; height: 16px;}
.listOfDeletedInquiry table tbody tr td .btnBox .inquiry_restoreBtn:hover:before{background-image: url('/assets/images/inquiry_restore_hover.png');}
.listOfDeletedInquiry table tbody tr td .btnBox .inquiry_deleteBtn:hover:before{background-image: url('/assets/images/inquiry_delete_hover.png');}
/* List of Deleted Inquiry Fin */

/* Inquiry View */
.inquiryView .content{border-top: 1px solid #DDDDDD; border-bottom: 1px solid #DDDDDD;}
.inquiryView .content .titleBox{display: flex; position: relative; background-color: #F2F2F2; padding: 30px; box-sizing: border-box;}
.inquiryView .content .titleBox .answer_title{font-size: 15px; font-weight: 600; color: #555555; margin-left: 30px; display: block;}
.inquiryView .content .titleBox .date{position: absolute; right: 30px; top: 50%; transform: translateY(-50%); font-size: 15px; font-weight: 400; color: #CCCCCC;}
.inquiryView .content > ul:nth-of-type(1){display: flex; padding: 25px 30px; box-sizing: border-box; border-top: 1px solid #E9E9E9; border-bottom: 1px solid #EEEEEE;}
.inquiryView .content > ul:nth-of-type(1) li:not(:first-child){margin-left: 40px;}
.inquiryView .content > ul:nth-of-type(1) li span{font-size: 14px;}
.inquiryView .content > ul:nth-of-type(1) li > span:nth-child(1){font-weight: 500; color: #222222;}
.inquiryView .content > ul:nth-of-type(1) li > span:nth-child(1){font-weight: 400; color: #666666;}
.inquiryView .content > ul:nth-of-type(2){padding: 25px 30px 80px 30px; box-sizing: border-box;}
.inquiryView .content > ul:nth-of-type(2) li{display: flex;}
.inquiryView .content > ul:nth-of-type(2) li:nth-child(1){margin-bottom: 15px;}
.inquiryView .content > ul:nth-of-type(2) li:nth-child(2){margin-bottom: 20px;}
.inquiryView .content > ul:nth-of-type(2) li:nth-child(3){margin-bottom: 30px;}
.inquiryView .content > ul:nth-of-type(2) li > span{width: 120px; display: block; font-size: 15px; font-weight: 400; color: #555555;}
.inquiryView .content > ul:nth-of-type(2) li:nth-child(1) > span,
.inquiryView .content > ul:nth-of-type(2) li:nth-child(2) > span{line-height: 36px;}
.inquiryView .content > ul:nth-of-type(2) li:nth-child(1) > div,
.inquiryView .content > ul:nth-of-type(2) li:nth-child(2) > div{display: flex;}
.inquiryView .content > ul:nth-of-type(2) li:nth-child(1) > div span,
.inquiryView .content > ul:nth-of-type(2) li:nth-child(2) > div span{font-size: 14px; font-weight: 500; color: #fff; display: block; padding: 10px 15px; border-radius: 5px; color: #fff;}
.inquiryView .content > ul:nth-of-type(2) li:nth-child(1) > div span{background-color: #1B6ADD;}
.inquiryView .content > ul:nth-of-type(2) li:nth-child(2) > div span{background-color: #222222;}
.inquiryView .content > ul:nth-of-type(2) li:nth-child(1) > div span:not(:first-child),
.inquiryView .content > ul:nth-of-type(2) li:nth-child(2) > div span:not(:first-child){margin-left: 8px;}
.inquiryView .content > ul:nth-of-type(2) li:nth-child(3){align-items: center;}
.inquiryView .content > ul:nth-of-type(2) li:nth-child(3) p{cursor: pointer; position: relative; padding-left: 45px; font-size: 14px; font-weight: 500; color: #555555;}
.inquiryView .content > ul:nth-of-type(2) li:nth-child(3) p:hover{text-decoration: underline;}
.inquiryView .content > ul:nth-of-type(2) li:nth-child(3) p:before{content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 32px; height: 25px; background: url('/assets/images/folder.png') center / contain no-repeat;}
.inquiryView .content > ul:nth-of-type(2) li:nth-child(4) > div{font-size: 15px; font-weight: 400; color: #666666; line-height: 18px;}
/* Inquiry View Fin */

/* Administrator */
.administrator table{margin-bottom: 15px;}
.administrator table thead tr th,
.administrator table tbody tr td{vertical-align: middle;}
.administrator table thead tr th:nth-child(1),
.administrator table tbody tr td:nth-child(1){padding-left: 20px; box-sizing: border-box; width: 160px;}
.administrator table thead tr th:nth-child(2){width: 140px;}
.administrator table thead tr th:nth-child(3){width: 180px;}
.administrator table thead tr th:nth-child(4){width: 190px;}
.administrator table thead tr th:nth-child(6){width: 55px;}
.administrator table tbody tr td:nth-child(6) button{padding: 0; background-color: transparent; border: none; width: 18px; height: 18px; position: relative;}
.administrator table tbody tr td:nth-child(6) button:after{transition: background 0.3s ease-out; content: ''; display: block; position: absolute; width: 18px; height: 18px; left: 50%; top: 50%; transform: translate(-50%, -50%); background: url('/assets/images/editBtn.png') center / contain no-repeat;}
.administrator table tbody tr td:nth-child(6) button:hover:after{background-image: url('/assets/images/editBtn_hover.png');}
.administrator table tbody tr:hover td:nth-child(1){color: #555555; font-weight: 500;}
/* Administrator Fin */

/* Administrator Add */
.administratorAdd ul{border-top: 1px solid #AAAAAA; display: flex; flex-wrap: wrap;}
.administratorAdd ul li{padding: 15px 0 15px 20px; box-sizing: border-box; display: flex;}
.administratorAdd ul li:not(:nth-child(2n), :last-child){padding-right: 2%;}
.administratorAdd ul li:not(:last-child){width: 49%; border-bottom: 1px solid #E9E9E9; align-items: center;}
.administratorAdd ul li:last-child{width: 100%;}
.administratorAdd ul li label,
.administratorAdd ul li > span{font-size: 15px; font-weight: 600; color: #444444; width: 130px; display: block; box-sizing: border-box;}
.administratorAdd ul li input{font-size: 14px; font-weight: 400; color: #555555; width: calc(100% - 150px); background-color: #F2F2F2; border-radius: 5px; padding: 12px 15px; box-sizing: border-box; border-width: 0;}
.administratorAdd ul li input::placeholder{font-size: 14px; font-weight: 400; color: #CCCCCC;}
.administratorAdd .imgUploadBox img{max-width: 240px; height: 240px; width: 100%;}
/* Administrator Add Fin */

/* Company Setting */
.companySetting table thead tr th:nth-child(2){width: 320px;}
.companySetting table thead tr th:nth-child(3){width: 175px;}
.companySetting table thead tr th:nth-child(4){width: 240px;}
.companySetting table thead tr th:nth-child(5){width: 220px;}
.companySetting table thead tr th:nth-child(6){width: 300px;}
.companySetting table thead tr th:nth-child(7){text-align: center;}
/* Company Setting Fin */

/* forums */
.forums table thead tr th:nth-child(1){padding-left: 20px; box-sizing: border-box;}
.forums table tbody tr td .postNavBox{width: 330px; display: flex;}
.forums table tbody tr td .postNavBox .ellipsis{width: 100px;}
.forums table tbody tr td .postNavBox > span:not(:last-child){position: relative; padding-right: 10px; margin-right: 10px;}
.forums table tbody tr td .postNavBox > span:not(:last-child):after{content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); background: url('/assets/images/forums_navArrow.png') center / contain no-repeat; width: 4px; height: 7px; display: block;}
.forums table tbody tr td{vertical-align: middle; padding: 15px 0;}
.forums table tbody tr td:nth-child(1){padding-left: 20px; box-sizing: border-box;}

.forums table tbody tr td .profileBox{display: flex; align-items: center;}
.forums table tbody tr td .profileBox > span:nth-child(1){display: block; width: 28px; height: 28px; border-radius: 5px; background-repeat: no-repeat; background-size: cover; background-position: center;}
.forums table tbody tr td .profileBox > span:nth-child(2){margin-left: 5px; width: 130px;}
.forums table tbody tr td .writerBox{cursor: pointer;}
.forums table tbody tr td .btnBox{display: flex; justify-content: right; padding-right: 30px; box-sizing: border-box;}
.forums table tbody tr td .btnBox button{border: none; padding: 0; background-color: transparent; font-size: 15px; font-weight: 400; color: #AAAAAA; position: relative; padding-left: 25px;}
.forums table tbody tr td .btnBox button:not(:first-child){margin-left: 50px;}
.forums table tbody tr td .btnBox button:before{content: ''; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background-repeat: no-repeat; background-size: contain; background-position: center;}
.forums table tbody tr td .btnBox .falseReportBtn:before,
.forums table tbody tr td .btnBox .restoreBtn:before{background-image: url('/assets/images/inquiry_restore.png'); width: 16px; height: 16px;}
.forums table tbody tr td .btnBox .trashBtn:before{background-image: url('/assets/images/inquiry_delete.png'); width: 14px; height: 16px;}
.forums table tbody tr td .btnBox .viewDetailsBtn:before{background-image: url('/assets/images/viewDetailBtn.png'); width: 16px; height: 13px;}
.forums table tbody tr td .btnBox .falseReportBtn:hover,
.forums table tbody tr td .btnBox .restoreBtn:hover{color: #1B6ADD;}
.forums table tbody tr td .btnBox .falseReportBtn:hover:before,
.forums table tbody tr td .btnBox .restoreBtn:hover:before{background-image: url('/assets/images/inquiry_restore_hover.png');}
.forums table tbody tr td .btnBox .trashBtn:hover{color: #C82222;}
.forums table tbody tr td .btnBox .trashBtn:hover:before{background-image: url('/assets/images/inquiry_delete_hover.png');}
.forums table tbody tr td .btnBox .viewDetailsBtn:hover{color: #666666;}
.forums table tbody tr td .btnBox .viewDetailsBtn:hover:before{background-image: url('/assets/images/viewDetailBtn_hover.png');}
/* forums Fin */

/* List of Reported forum */
.listOfReportedForum table{margin-bottom: 15px;}
.listOfReportedForum table thead tr th:nth-child(1){width: 180px;}
.listOfReportedForum table thead tr th:nth-child(2){width: 130px;}
.listOfReportedForum table thead tr th:nth-child(3){width: 330px;}
.listOfReportedForum table thead tr th:nth-child(4){width: 220px;}
.listOfReportedForum table thead tr th:nth-child(5){width: 200px;}
.listOfReportedForum table tbody tr td:nth-child(1) span{width: 180px;}
.listOfReportedForum table tbody tr td:nth-child(2) span{width: 110px;}
.listOfReportedForum table tbody tr td:nth-child(4) span{width: 220px;}
.listOfReportedForum table tbody tr td:nth-child(5) span{width: 200px;}
/* List of Reported forum Fin */

/* listOfDeletedForums */
.listOfDeletedForums table thead tr th:nth-child(1){width: 150px;}
.listOfDeletedForums table thead tr th:nth-child(2){width: 310px;}
.listOfDeletedForums table thead tr th:nth-child(3){width: 200px;}
.listOfDeletedForums table tbody tr td:nth-child(1) span{width: 110px;}
.listOfDeletedForums table tbody tr td:nth-child(3) span{width: 220px;}
.listOfDeletedForums table tbody tr td:nth-child(4) span{width: 200px;}
/* listOfDeletedForums Fin */

/* upload 공통 */
.upload .flexWrap{padding-bottom: 23px; border-bottom: 1px solid #AAAAAA;}
.upload table tbody tr:not(:last-child) th,
.upload table tbody tr:not(:last-child) td{border-bottom: 1px solid #E9E9E9;}
.upload table tbody tr:last-child th,
.upload table tbody tr:last-child td{padding-bottom: 75px;}
.upload table tbody tr th{width: 110px; text-align: left; padding-left: 20px; font-size: 15px; font-weight: 600; color: #444444;}
.upload table tbody tr th.thumbnail{padding-top: 25px; vertical-align: top;}
.upload table tbody tr td{padding: 15px 0;}
.upload table tbody tr td input{width: calc(100% - 25px); border-radius: 5px; background-color: #F2F2F2; border: none; padding: 12px 15px; box-sizing: border-box; border-width: 0;}
.upload table tbody tr td input::placeholder{font-size: 14px; font-weight: 400; color: #CCCCCC;}
.upload table tbody tr td select{width: 300px; border: 1px solid #DDDDDD; box-sizing: border-box; padding: 10px 15px; border-radius: 5px;}
.upload table tbody tr td select option{font-size: 14px; font-weight: 400;}
.upload table tbody tr .langSelectBox > div{padding: 10px 0;}
.upload table tbody tr.today_pick td > div{display: flex;}
.upload table tbody tr.today_pick td > div > div{width: 70px;}
.upload table tbody tr.today_pick td input[type='checkbox']{display: none;}
.upload table tbody tr.today_pick td input[type='checkbox'] + label{cursor: pointer; color: #666666; font-size: 15px; font-weight: 500; padding-left: 18px; position: relative;}
.upload table tbody tr.today_pick td input[type='checkbox'] + label:before{content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: url('/assets/images/blue_checkBox.png') center / contain no-repeat; width: 10px; height: 10px;}
.upload table tbody tr.today_pick td input[type='checkbox']:checked + label{color: #1B6ADD;}
.upload table tbody tr.today_pick td input[type='checkbox']:checked + label:before{background-image: url('/assets/images/blue_checkBox_checked.png');}
.upload table tbody tr.today_pick td .txtBox{width: calc(100% - 70px); display: flex; flex-wrap: wrap;}
.upload table tbody tr.today_pick td textarea{outline: none; width: 100%; padding: 12px 15px; background-color: #F2F2F2; border-radius: 5px; border: none; resize: none;}
.upload table tbody tr.today_pick td textarea::placeholder{font-size: 14px; font-weight: 400; color: #CCCCCC; line-height: 16px;}
.upload table tbody tr.today_pick td textarea:not(:last-child){margin-bottom: 15px;}

.upload .plusBtn{transition: all 0.3s ease-out; background-color: #F2F2F2; color: #999999; font-size: 8px; width: 39px; height: 39px; box-sizing: border-box; border: 1px solid #DDDDDD; border-radius: 5px;}
.upload .plusBtn:hover{border-color: #999999;}
.upload .plusBtn:hover i{color: #666666;}
.upload .upload_flexWrap:not(.subCategory){display: flex; align-items: center;}
.upload .upload_flexWrap:not(.subCategory) > *:not(:first-child){margin-left: 15px;}
.upload .imgUploadBox,
.upload .catalogueUploadBox,
.upload .techDocumentUploadBox{position: relative;}
.upload .imgUploadBox input[type='file'],
.upload .catalogueUploadBox input[type='file'],
.upload .techDocumentUploadBox input[type='file']{display: none;}
.upload .imgUploadBtn,
.upload .catalogueUploadBtn,
.upload .techDocumentUploadBtn{cursor: pointer; transition: background 0.3s ease-out; width: 238px; border-radius: 5px; color: #fff; font-size: 14px; font-weight: 400; display: block; text-align: center; line-height: 38px;}
.upload .imgUploadBtn i,
.upload .catalogueUploadBtn i,
.upload .techDocumentUploadBtn i{margin-right: 10px;}
.upload .imgUploadBtn_before,
.upload .catalogueUploadBtn_before,
.upload .techDocumentUploadBtn{background-color: #999999; border: 1px solid #999999;}
.upload .imgUploadBtn_before:hover,
.upload .catalogueUploadBtn_before:hover,
.upload .techDocumentUploadBtn_before:hover{border: 1px solid #222222; background-color: #222222;}
.upload .imgUploadBtn_after{background-color: #F2F2F2; border: 1px solid #CCCCCC; color: #999999;}

.upload .imgUploadBox img{border-radius: 5px; display: block; line-height: 0; padding: 0; margin-bottom: 10px;}
.upload .imgUploadBox_after > img{max-width: 240px; height: 160px; width: 100%;}
.upload .catalogueUploadBox_after > img{max-width: 240px; height: 300px; width: 100%;}

.upload .logoUploadBox_after > div{margin-bottom: 10px; position: relative; display: block; max-width: 240px; height: 160px; width: 100%; border-radius: 5px;}
.upload .logoUploadBox_after > div img{position: absolute; max-width: 90%; left: 50%; top: 50%; transform: translate(-50%, -50%);}

.upload .catalogueFileUploadBox_after,
.upload .techDocumentFileUploadBox_after{align-items: center; padding: 0 15px; box-sizing: border-box; display: flex; justify-content: space-between; width: 300px; border-radius: 5px; background-color: #222222;}
.upload .catalogueFileUploadBox_after p,
.upload .techDocumentFileUploadBox_after p{width: 250px; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 40px; font-size: 14px; font-weight: 400; color: #fff;}
.upload .catalogueFileUploadBox_after button,
.upload .techDocumentFileUploadBox_after button{cursor: pointer; padding: 0; margin: 0; background-color: transparent; border: none;}
.upload .catalogueFileUploadBox_after button i,
.upload .techDocumentFileUploadBox_after button i{color: #63FAFF; font-size: 6px;}

.upload .brandColorBox{display: flex; align-items: center;}
.upload .brandColorBox .color{width: 28px; height: 28px; border-radius: 5px; background-color: #1B6ADD; display: block;}
.upload .brandColorBox .colorName{margin-left: 15px; font-size: 14px; font-weight: 400; color: #555555; padding: 12px 20px; border-radius: 5px; border: 1px solid #DDDDDD;}

.upload tr.brandColor th{vertical-align: middle;}
.upload #colorPicker{border-width: 0; padding: 0; width: 31px; height: 35px; appearance: none; background-color: transparent; border: none;}
.upload #colorPicker::-webkit-color-swatch{border-radius: 5px; border: none;}

.upload .upload_flexWrap.mainCategory input{width: 300px;}

.upload .upload_flexWrap.subCategory > div{position: relative; width: 19%;}
.upload .upload_flexWrap.subCategory > div:not(:nth-child(5n)){margin-right: 1.25%;}
.upload .upload_flexWrap.subCategory input{padding: 12px 25px 12px 15px; width: 100%;}
.upload .upload_flexWrap.subCategory > div .closeBtn{position: absolute; right: 15px; top: 50%; transform: translateY(-50%); padding: 0; margin: 0; border: none; background-color: transparent;}
.upload .upload_flexWrap.subCategory > div .closeBtn i{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); color: #C82222; font-size: 6px;}
.upload .upload_flexWrap.subCategory .plusBtn:hover{border: 1px solid #555555; background-color: #555555;}
.upload .upload_flexWrap.subCategory .plusBtn:hover i{color: #fff;}

/* 언어 선택 */
tr.lang_separation.hidden{display: none;}
tr.lang_separation.active{display: table-row;}
.upload table tbody tr.lang_separation td div:not(.quill,.ql-toolbar,.ql-tooltip,.ql-container,.ql-editor){display: none; justify-content: space-between; padding-right: 25px; box-sizing: border-box}
.upload table tbody tr.lang_separation td div input{width: 49%;}
.upload table tbody tr.lang_separation.active td div:not(.quill,.ql-toolbar,.ql-tooltip,.ql-container,.ql-editor){display: flex;}
/* 언어 선택 Fin */

.upload .categoryBox{width: 670px; position: relative;}
.upload .categoryBox .selectBox{cursor: pointer; display: flex; align-items: center; justify-content: space-between; padding: 12px 15px; box-sizing: border-box; border-radius: 5px; font-size: 14px; font-weight: 400; border: 1px solid #DDDDDD;}
.upload .categoryBox .selectBox i{font-size: 7px; color: #CCCCCC;}
.upload .categoryBox .selectBox.before{color: #CCCCCC;}
/* .upload .categoryBox .selectBox.after{#555555} */
.upload .categoryBox .optionBox{display: none; top: 45px; position: absolute; z-index: 9; width: 670px; background-color: #fff; border-radius: 5px;}
.upload .categoryBox .optionBox.active{display: flex;}
.upload .categoryBox > div .left{padding: 15px; box-sizing: border-box; width: 249px; border-right: 1px solid #EEEEEE;}
.upload .categoryBox > div .left li{padding: 10px 15px; box-sizing: border-box;}
.upload .categoryBox > div .left li.active{background-color: #F9F9F9; border-radius: 5px;}
.upload .categoryBox > div .left li:not(:last-child){margin-bottom: 10px;}
.upload .categoryBox > div .left li > div{display: flex; justify-content: space-between;}
.upload .categoryBox > div .left li > div > span{font-size: 14px; font-weight: 400; color: #888888;}
.upload .categoryBox > div .left li > div > div span{font-size: 12px; font-weight: 400; color: #CCCCCC;}
.upload .categoryBox > div .left li > div button{margin-left: 5px; border: none; background-color: transparent; padding: 0;}
.upload .categoryBox > div .left li > div button i{font-size: 6px; color: #DDDDDD;}
.upload .categoryBox > div .right{width: 420px; padding: 25px; box-sizing: border-box;}
.upload .categoryBox > div .right li{display: none;}
.upload .categoryBox > div .right li.active{display: block;}
.upload .categoryBox > div .right li > div{display: flex; flex-wrap: wrap;}
.upload .categoryBox > div .right li > div > div{width: 49%; display: flex; margin-bottom: 18px;}
.upload .categoryBox > div .right li > div > div:not(:nth-child(2n)){margin-right: 2%;}
.upload .categoryBox > div .right li input[type='checkbox']{display: none;}
.upload .categoryBox > div .right li label{font-size: 14px; font-weight: 400; color: #888888; padding-left: 23px; position: relative;}
.upload .categoryBox > div .right li label:before{content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: url('/assets/images/blue_checkBox.png') center / contain no-repeat; width: 14px; height: 14px;}
.upload .categoryBox > div .right li input[type='checkbox']:checked + label:before{background-image: url('/assets/images/blue_checkBox_checked.png');}
.upload .categoryBox > div .right li input[type='checkbox']:checked + label{color: #555555;}

/* Add Category */
.upload .upload_flexWrap.subCategory{display: flex; align-items: top; flex-wrap: wrap;}
.upload .upload_flexWrap.subCategory > div{margin-bottom: 10px;}
.upload .upload_flexWrap.subCategory > div:nth-child(5n){margin-left: 0;}
/* Add Category Fin */

.alertPopUp{position: fixed; width: 100%; height: 100%; z-index: 9999; left: 0; top: 0; background-color: rgba(0,0,0,0.2);}
.alertPopUp > div{background-color: #fff; border-radius: 10px; width: 420px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.alertPopUp > div > div:nth-child(1){padding: 40px 0; }
.alertPopUp > div > div:nth-child(1) p{text-align: center; font-size: 15px; line-height: 28px; color: #666666;}
.alertPopUp > div > div:nth-child(1) p strong{font-weight: 600; color: #666666; display: block;}
.alertPopUp > div > div:nth-child(2){display: flex; border-top: 1px solid #EEEEEE;}
.alertPopUp > div > div:nth-child(2) button{position: relative; line-height: 50px; width: 50%; text-align: center; border: none; padding: 0; font-size: 16px; font-weight: 600; background-color: transparent;}
.alertPopUp > div > div:nth-child(2) button:nth-child(1){color: #999999;}
.alertPopUp > div > div:nth-child(2) button:nth-child(2){color: #1B6ADD;}
.alertPopUp > div > div:nth-child(2) button:nth-child(1):after{content: ''; position: absolute; display: block; background-color: #EEEEEE; width: 1px; height: 49px; right: 0; top: 50%; transform: translateY(-50%);}


.mpContent button span{display: flex;}
.upload table tbody tr.mpContent td{padding: 25px 0 75px 0;}
.mpContent th{vertical-align: top; padding-top: 35px;}
.mpContent div{display: flex; align-items: center;}
.mpContent button{font-size: 12px; font-weight: 400; color: #888888; position: relative; background-color: transparent; border: none; padding-top: 25px;}
.mpContent button:not(:first-child){margin-left: 45px;}
.mpContent button:before{content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); background-repeat: no-repeat; background-position: center; background-size: contain;}
.mpContent button:nth-child(1):before{background-image: url('/assets/images/admin_marineNews.png'); width: 21px; height: 18px;}
.mpContent button:nth-child(2):before{background-image: url('/assets/images/admin_catalogue.png'); width: 23px; height: 18px;}
.mpContent button:nth-child(3):before{background-image: url('/assets/images/admin_video.png'); width: 21px; height: 18px;}
.mpContent button:nth-child(4):before{background-image: url('/assets/images/admin_tech.png'); width: 18px; height: 18px;}
.mpContent button:nth-child(1):hover:before{background-image: url('/assets/images/admin_marineNews_active.png');}
.mpContent button:nth-child(2):hover:before{background-image: url('/assets/images/admin_catalogue_active.png');}
.mpContent button:nth-child(3):hover:before{background-image: url('/assets/images/admin_video_active.png');}
.mpContent button:nth-child(4):hover:before{background-image: url('/assets/images/admin_tech_active.png');}


/* 팝업 */
.popUpBox .mpContent_popUp .iconBox li:nth-child(1) .icon{background-image: url('/assets/images/marineNews.png');}
.popUpBox .mpContent_popUp .iconBox li:nth-child(1).active .icon,
.popUpBox .mpContent_popUp .iconBox li:nth-child(1):hover .icon{background-image: url('/assets/images/marineNews_active.png');}
.popUpBox .mpContent_popUp .iconBox li:nth-child(2) .icon{background-image: url('/assets/images/catalogue.png');}
.popUpBox .mpContent_popUp .iconBox li:nth-child(2).active .icon,
.popUpBox .mpContent_popUp .iconBox li:nth-child(2):hover .icon{background-image: url('/assets/images/catalogue_active.png');}
.popUpBox .mpContent_popUp .iconBox li:nth-child(3) .icon{background-image: url('/assets/images/video.png');}
.popUpBox .mpContent_popUp .iconBox li:nth-child(3).active .icon,
.popUpBox .mpContent_popUp .iconBox li:nth-child(3):hover .icon{background-image: url('/assets/images/video_active.png');}
.popUpBox .mpContent_popUp .iconBox li:nth-child(4) .icon{background-image: url('/assets/images/techDocument.png');}
.popUpBox .mpContent_popUp .iconBox li:nth-child(4).active .icon,
.popUpBox .mpContent_popUp .iconBox li:nth-child(4):hover .icon{background-image: url('/assets/images/techDocument_active.png');}

.popUpBox .blueAddBtn{opacity: 0.8; right: 45px; bottom: 40px; position: absolute; border: none; background-color: #005FAF; width: 70px; height: 70px; border-radius: 100%;}
.popUpBox .blueAddBtn img{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}

/* 팝업 닫기 버튼 */
.popUpBox .popUpClose_btn{position: absolute; right: 20px; top: 20px; padding: 0; border: none; font-size: 0; line-height: 0; background-color: transparent;}
/* 팝업 닫기 버튼 Fin */

/* 팝업 띄우기 */
.popUpBox > div{background-color: #fff; box-sizing: border-box; z-index: 999; position: fixed; right: 35px; bottom: -100%; transition: bottom 0.5s; width: 800px; height: 760px; box-shadow: rgb(0 0 0 / 0.1) 1px 1px 5px 1px; border-radius: 20px;}
.popUpBox > div.active{bottom: 0;}
.popUpBox .content{height: 690px; overflow-y: auto; display: none;}
.popUpBox .content.active{display: block;}
/* 팝업 띄우기 Fin */

/* 팝업 내 아이콘 박스 */
.popUpBox > div .iconBox{display: flex; padding: 30px 40px 0 40px; box-sizing: border-box; border-bottom: 1px solid #E4EAEF;}
.popUpBox > div .iconBox li{cursor: pointer;}
.popUpBox > div .iconBox li > div{width: 40px;  height: 30px; position: relative;}
.popUpBox > div .iconBox li.active > div:after{content: ''; display: block; height: 2px; width: 40px; background-color: #256DCB; position: absolute; bottom: -1px;}
.popUpBox > div .iconBox li:not(:first-child){margin-left: 40px;}
.popUpBox > div .iconBox li .icon{height: 18px; width: 100%; position: absolute; left: 50%; transform: translateX(-50%); transition: background 0.1s; position: absolute; background-repeat: no-repeat; background-position: center; background-size: contain;}
.popUpBox .iconBox li .txt{padding-bottom: 10px; display: none; position: absolute; top: -13px; font-size: 13px; font-weight: 400; background-color: #14436D; border-radius: 5px; padding: 6px 12px; line-height: 15px; color: #fff;}
.popUpBox .iconBox li .txt:after{content: ''; position: absolute; background: url('/assets/images/popUp_triangle.png') center / contain no-repeat; width: 12px; height: 10px; bottom: -8px; left: 10px;}
.popUpBox .iconBox li:hover .txt,
.popUpBox .iconBox li.active .txt{display: block;}
/* 팝업 내 아이콘 박스 Fin */

.popUpBox .mpContent_popUp .popUp_contentBox .content{box-sizing: border-box; padding: 30px 40px 100px 40px; overflow-y: auto; height: 690px;}


.popUpBox .mpContent_popUp .popUp_contentBox .content .modelingName{margin: 0 0 10px 10px; display: inline-block; font-size: 14px; font-weight: 400; color: #666666; padding: 7px 15px; border-radius: 5px; border: 1px solid #DDDDDD;}
.popUpBox .mpContent_popUp .popUp_contentBox .content .deleteBtn{width: 33px; height: 33px; border: none; background-color: #F2F2F2; border-radius: 10px; position: absolute; right: 25px; top: 50%; transform: translateY(-50%);}
.popUpBox .mpContent_popUp .popUp_contentBox .content .deleteBtn:hover{background-color: #555555;}
.popUpBox .mpContent_popUp .popUp_contentBox .content .deleteBtn:after{content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: url('/assets/images/mpContent_trash.png') center / contain no-repeat; width: 14px; height: 16px;}
.popUpBox .mpContent_popUp .popUp_contentBox .type_a > ul li{padding: 10px; box-sizing: border-box;}
.popUpBox .mpContent_popUp .popUp_contentBox .type_a > ul li:hover{background-color: #F9F9F9; border-radius: 5px;}
.popUpBox .mpContent_popUp .popUp_contentBox .type_a > ul li > div{display: flex; align-items: center;}
.popUpBox .mpContent_popUp .popUp_contentBox .type_a > ul li > div > div:nth-child(2){position: relative; margin-left: 15px;}
.popUpBox .mpContent_popUp .popUp_contentBox .type_a > ul li p{width: calc(100% - 75px); font-size: 14px; font-weight: 400; color: #888888; line-height: 21px;}


/* 미니팝업 */
.popUpBox .miniPopUp .miniPopUp_titleBox{padding: 45px 60px 12px 40px; border-bottom: 1px solid #E4EAEF;}
.popUpBox .miniPopUp .miniPopUp_titleBox span{font-size: 14px; color: #256DCB; padding: 13px 12px; position: relative;}
.popUpBox .miniPopUp .miniPopUp_titleBox span.active:after{content: ''; position: absolute; display: block; width: 100%; height: 2px; background-color: #256DCB; bottom: -2px; left: 0; z-index: 1;}
.popUpBox .miniPopUp .miniPopUp_titleBox span{font-size: 14px; color: #256DCB; padding: 13px 12px; position: relative;}

.popUpBox .mpContent_popUp .content .miniPopUp{display: none; padding-bottom: 70px; z-index: 999; border-radius: 20px; border: 1px solid #EEEEEE; position: absolute; width: 800px; background-color: #fff; bottom: 40px; right: 140px;}
.popUpBox .mpContent_popUp .content .miniPopUp.active{display: block;}
.popUpBox .mpContent_popUp .content .miniPopUp .scrollBox{height: 450px; overflow-y: auto;}


/* 저장,취소 버튼박스 */
.popUpBox .miniPopUp .saveBox{border-top: 1px solid #EEEEEE; display: flex; width: 100%; position: absolute; bottom: 0; left: 0;}
.popUpBox .miniPopUp .saveBox button{font-size: 16px; font-weight: 500; padding: 25px 0; width: 50%; border: none; background-color: transparent;}
.popUpBox .miniPopUp .saveBox button:nth-child(1){color: #CCCCCC;}
.popUpBox .miniPopUp .saveBox button:nth-child(2){color: #327EBE;}
/* 저장,취소 버튼박스 Fin */

.miniPopUp_top{padding: 25px 40px 25px 40px; box-sizing: border-box; display: flex; justify-content: space-between; align-items: center;}

.popUpBox .miniPopUp .miniPopUp_content{padding: 0 40px 30px 40px; box-sizing: border-box;}
.popUpBox .miniPopUp .miniPopUp_content ul{display: flex; flex-wrap: wrap;}
.popUpBox .miniPopUp .miniPopUp_content ul li{position: relative; width: 49%; padding: 10px; box-sizing: border-box;}
.popUpBox .miniPopUp .miniPopUp_content ul li:hover{background-color: #F9F9F9; border-radius: 5px;}
.popUpBox .miniPopUp .miniPopUp_content ul li.active{background-color: #F9F9F9;}
.popUpBox .miniPopUp .miniPopUp_content ul li:not(:nth-child(2n)){margin-right: 2%;}
.popUpBox .miniPopUp .miniPopUp_content ul li > div{display: flex; align-items: center;}
.popUpBox .miniPopUp .miniPopUp_content ul li > div > div:nth-child(2){position: relative; margin-left: 15px;}
.popUpBox .miniPopUp .miniPopUp_content ul li p{width: calc(100% - 55px); font-size: 14px; font-weight: 400; color: #888888; line-height: 21px;}

.popUpBox .miniPopUp .miniPopUp_content ul li:hover .checkBox,
.popUpBox .miniPopUp .miniPopUp_content ul li.active .checkBox{display: flex;}
.popUpBox .miniPopUp .checkBox{display: none; position: absolute; right: 0; top: 0; margin-left: 15px; align-items: center;}
.popUpBox .miniPopUp .checkBox input[type='checkbox']{display: none;}
.popUpBox .miniPopUp .checkBox label{cursor: pointer; padding-left: 15px; position: relative; display: flex; align-items: center; font-size: 12px; font-weight: 400; color: #999999;}
.popUpBox .miniPopUp .checkBox label:before{content: ''; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: url('/assets/images/blue_checkBox.png') center / contain no-repeat; width: 14px; height: 14px;}
.popUpBox .miniPopUp .checkBox input[type='checkbox']:checked + label:before{background-image: url('/assets/images/blue_checkBox_checked.png');}
.popUpBox .miniPopUp .miniPopUp_content ul li.active .checkBox label:before{background-image: url('/assets/images/blue_checkBox_checked.png');}
/* 미니팝업 Fin */


/* 이미지 업로드 리스트 박스 */
.upload table tbody tr td .inputFileBox{padding-top: 5px;}
.upload table tbody tr td .inputFileBox input{display: none; background-color: transparent;}
.upload table tbody tr td .inputFileBox label{cursor: pointer;}
.upload table tbody tr td .inputFileBox label:nth-of-type(1){display: inline-block; background-color: #F2F2F2; border: 1px solid #CCCCCC; border-radius: 3px; font-size: 14px; font-weight: 400; color: #999999; padding: 5px 11px;}
.upload table tbody tr td .inputFileBox label:nth-of-type(2){font-size: 14px; line-height: 16px; color: #999999; font-weight: 400; margin-left: 12px;}

.imgUploadListBox{margin-top: 20px; display: flex; flex-wrap: wrap;}
.imgUploadListBox li{margin-bottom: 25px; width: 18%;}
.imgUploadListBox li:not(:nth-child(5n)){margin-right: 2.5%;}
.imgUploadListBox li > div{position: relative;}
.imgUploadListBox li > div img{border-radius: 5px; height: 160px; width: 100%; object-fit: cover;}
.imgUploadListBox li button{position: absolute; right: 10px; top: 10px; border-radius: 100%; background-color: #444444; border: none; width: 24px; height: 24px;}
.imgUploadListBox li button:after{content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: url('/assets/images/close_white.png') center / contain no-repeat; width: 6px; height: 6px;}
/* 이미지 업로드 리스트 박스 Fin */


/* 언어선택 */
.flagWrap{display: flex;}
.flagWrap > div > button{background-color: transparent; border: none; padding: 0; margin: 0;}
.flagEditBox,
.flagBox{position: relative;}
.flagEditBox > div > div{padding: 10px 0; justify-content: space-between; display: flex;}
.flagEditBox > div > div span{width: 40px; text-align: center; display: block;}

.flagEditBox > div,
.flagBox .flagList{display: none; top: 40px; background-color: #f6f6f6; filter: drop-shadow(0px 0px 8px rgba(0, 0, 0, 0.08)); padding: 3px 7px; left: 50%; transform: translateX(-50%); position: absolute; z-index: 1;}
.flagEditBox > div.active,
.flagBox .flagList.active{display: block;}
.flagEditBox > div:before,
.flagBox .flagList:before{content: ''; display: block; background: url('/assets/images/triangle.png') center / contain no-repeat; width: 16px; height: 14px; position: absolute; top: -8px; left: 50%; transform: translateX(-50%);}

.flagEditBox{display: flex; align-items: center;}
.flagEditBox img{width: 28px;}
/* 언어선택 Fin */