/*-- board css --*/

/*-- 버튼 등 공통 --*/

/*board button*/
.buttonWrap{display: flex;justify-content: space-between;margin-top: 50px;}
.buttonWrap>ul{display: flex;gap: 5px;}

.boardBtn{display: block;width: 120px;line-height: 50px !important;border: 2px solid #FFF;color: #343434;background: #000;color: #FFF;text-align: center;font-weight: 500;overflow: hidden;cursor: pointer;}
.boardBtn00{background: var(--color-1);font-weight: bold;border-color: var(--color-1);color: #FFF;}

.boardBtn .memberCheck input[type=checkbox] + label{justify-content: center;}

.bo_chk{position: absolute;top: 25px;left: 0;z-index: 1;}

@media screen and (max-width: 720px){
	
	.buttonWrap.moWide{flex-direction: column;}
	.buttonWrap.moWide>ul.buttonLeft>li{width: 25%;}
	.buttonWrap.moWide>ul.buttonRight{margin-top: 10px;}
	.buttonWrap.moWide>ul.buttonRight>li{width: 100%;}
	.buttonWrap.moWide>ul>li .boardBtn{width: 100%;}
}

/*-- 페이징 --*/
#newPaging{margin-top: 50px;}
#newPaging .pg_wrap{padding: 0;}
#newPaging .pg{display: flex;justify-content: center;}
#newPaging .pg strong, #newPaging .pg a{background: none;border: none;color: rgba(255,255,255,.4);font-size: var(--font-size-22);font-weight: 600;line-height: 40px;text-align: center;}
#newPaging .pg strong{color: #FFF;font-weight: 700;line-height: 40px;}
#newPaging .pg_end, #newPaging .pg_start{display: none;}
#newPaging .pg_next{background: url(/img/icon/paging_next.png) no-repeat 50% 44% !important;}
#newPaging .pg_prev{background: url(/img/icon/paging_prev.png) no-repeat 50% 44% !important;}


/*-- 로그인, 회원가입 등 회원관련 화면 css --*/
#memberWrap{display: flex;justify-content: center;align-items: center;width: 100%;height: 100vh;background-color: #000;
	background-image: url(/img/board/member_bg.png);
}
.memberInner{border: 1px solid #333;border-radius: 20px;overflow: hidden;padding: 49px;width: 90%;max-width: 500px;position: relative;
	box-shadow: 10px 10px 20px rgba(0,0,0,.1);
	-webkit-box-shadow: 10px 10px 20px rgba(0,0,0,.1);
}
.memberInner>form{position: relative;z-index: 10;}
.memberInner::before{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, .1);backdrop-filter: blur(24px);}

.memberTitle{text-align: center;margin-bottom: 49px;position: relative;z-index: 1;}
.memberTitle h2{font-size: 2.6rem;color: #FFF;font-weight: bold;margin-top: 25px;}

.loginLogo img{display: block;margin: 0 auto;}

.loginInfo{display: flex;justify-content: space-between;align-items: center;font-weight: 400;margin-top: 15px;}
.memberLost a{font-size: var(--font-size-15);font-weight: 500;color: rgba(255, 255, 255, .7);}

.loginButton{margin-top: 30px;position: relative;z-index: 1;}
.loginButton-flex{display: flex;gap: 5px;}
.loginButton>*{margin-top: 10px;}
.loginButton-flex>*{margin-top: 0;}

.memberBtn{display: block;width: 100%;height: 55px;line-height: 55px;border: 1px solid rgba(255, 255, 255, .4);color: rgba(255, 255, 255, .4);text-align: center;font-weight: 500;border-radius: 5px;overflow: hidden;cursor: pointer;}
.memberBtn_01{background: var(--color-1);border-color: var(--color-1);color: #FFF;font-weight: bold;}

.memberLink-text{text-align: center;color: rgba(255, 255, 255, .5);font-size: var(--font-size-15);font-weight: 400;line-height: 150%;display: block;margin-top: 20px;}
.memberLink-text b{font-weight: 600;color: #FFF;}
.memberLink-text:hover{text-decoration: underline;text-underline-offset: 3px;}

@media screen and (max-width: 720px){
	
	#memberWrap{background-image: none;}
	.memberInner{padding: 30px 20px;border: none;}

	.loginLogo img{max-width: 100px;}
	
	.memberTitle{margin-bottom: 30px;}
	.memberTitle h2{font-size: 26px;margin-top: 16px;}

	.memberLost a{font-size: 14px;}

	.loginButton{margin-top: 25px;}

	.memberBtn{font-size: 16px;}

	.memberLink-text{font-size: 13px;line-height: 180%;}
}

/*회원가입 약관동의*/
#memberWrap.regiWrap{height: auto;padding: 50px 0;min-height: 100vh;}
#memberWrap.regiWrap .memberInner{max-width: 640px;}

.regiTitle{margin-bottom: 40px;}
.regiTitle h2{font-size: 2.25rem;}

.regNavi{display: flex;align-items: center;justify-content: center;gap: 24px;margin-bottom: 50px;}
.regNavi li{font-size: .9375rem;font-weight: 600;color: #979797;position: relative;}
.regNavi li.on{color: #FFF;}
.regNavi li::after{content: "\e93f";font-family: xeicon!important;position: absolute;top: -1px;left: calc( 100% + 3px );z-index: 1;font-size: 1.13rem;}
.regNavi li:last-child::after{display: none;}

.mbSave{display: flex;align-items: center;justify-content: space-between;font-size: .875rem;font-weight: 400;}
.mbInfobox{padding: 20px;background: #222;border-radius: 5px;overflow: hidden;}

.regTerms{margin-top: 35px;}
.regTerms>h4{font-size: 1.13rem;font-weight: bold;padding-bottom: 13px;margin-bottom: 15px;border-bottom: 2px solid #FFF;color: #FFF;}
.regTerms .check-box{margin-bottom: 15px;}
#fregister textarea{border: 1px solid rgba(255, 255, 255, .3);background: #000;color: rgba(255, 255, 255, .6);font-size: .875rem;padding: 20px 5%;font-weight: 400;outline: none;resize: vertical;}

.regTable{border-top: 1px solid #FFF;}
.regTable, .regTable th, .regTable td{font-size: .875rem !important;font-weight: 400;border: none;}
.regTable th{font-weight: 500;color: rgba(255, 255, 255, .6);}
.regTable td{padding: 13px 15px;background: #111;color: rgba(255, 255, 255, .6);}
.regTable .regTcolor td{background: #222;font-weight: 300;}

.regTerms .memberCheck label{margin-bottom: 15px;}

@media screen and (max-width: 1480px){
	
	.regNavi li::after{top: -1px;}
}

@media screen and (max-width: 720px){

	#memberWrap.regiWrap{padding: 0;}

	.regiTitle h2{font-size: 26px;}

	.regNavi li{font-size: 13px;}
	.regNavi li::after{top: 0;}

	.mbInfobox{padding: 15px;}

	.regTerms{margin-top: 30px;}
	.regTerms>h4{font-size: 15px;}

	#fregister textarea{font-size: 13px;padding: 15px;}

	.regTable, .regTable th, .regTable td{font-size: 13px !important;line-height: 160%;word-break: keep-all;}
}

/*회원가입 form*/
.form_01>h4{font-size: 1.13rem;font-weight: bold;margin-bottom: 15px;color: #FFF;}

.regInfo, #captcha #captcha_info{display: block;font-size: .875rem;font-weight: 500;margin-top: 8px;color: #999;line-height: 150%;word-break: keep-all;}
#captcha{color: #000 !important;}

@media screen and (max-width: 720px){

	.form_01>h4{font-size: 15px;}
}

/*-- 회원가입 완료 --*/
.regResult{text-align: center;position: relative;z-index: 1;}

.regResult h2{font-size: 1.13rem;font-weight: 400;margin-bottom: 20px;color: #FFF;}
.regResult h2 b{font-weight: 700;}
.regResult p{font-size: .9375rem;font-weight: 400;line-height: 160%;border: 1px solid rgba(255, 255, 255, .2);border-radius: 5px;overflow: hidden;padding: 25px 20px;color: #FFF;}
.regResult p i{font-size: 1.6rem;}

@media screen and (max-width: 720px){ 
	
	.regResult p{padding: 20px 15px;font-size: 12px;}
}

/*-- 게시판 등 상단 --*/
.board-wrap{background: #000;}

.boardVisual{background: #000;}
.boardVisual-inner{padding-top: 200px;}
.boardVisual-inner h2{font-size: var(--font-size-180);font-weight: var(--font-weight-700);color: #FFF;line-height: 100%;}

.board-page-navi{display: flex;align-items: center;gap: 60px;margin-top: 70px;}
.board-page-navi>li>a{display:  block;width: 100%;height: 100%;font-size: var(--font-size-40);font-weight: var(--font-weight-700);color: rgba(255,255,255,.3);position: relative;transition: color .25s ease;}
.board-page-navi>li>a::after{content: "";position: absolute;bottom: -13px;left: 0;width: 100%;height: 5px;background-color: #FFF;z-index: 1;display: none;}

.board-page-navi>li>a:hover{color: rgba(255,255,255,.5);}
.board-page-navi>li>a.on{color: #FFF;}
.board-page-navi>li>a.on::after{display: block;}

.board-list-wrap{margin-top: 0;}

@media screen and (max-width: 1920px){
	
	.boardVisual-inner h2{font-size: var(--font-size-160);}
}

@media screen and (max-width: 1480px){
	
	.board-page-navi{gap: 50px;}
}

@media screen and (max-width: 1280px){
	
	.boardVisual-inner h2{font-size: var(--font-size-140);}
}

@media screen and (max-width: 1080px){
	
	.boardVisual-inner h2{font-size: var(--font-size-120);}
}

@media screen and (max-width: 960px){
	
	.boardVisual-inner{padding-top: 150px;}
}

@media screen and (max-width: 860px){
	
	.boardVisual-inner h2{font-size: var(--font-size-90);}

	.board-page-navi{gap: 40px;}
	.board-page-navi>li>a{font-size: var(--font-size-36);}
	.board-page-navi>li>a::after{height: 4px;}
}

@media screen and (max-width: 720px){
	
	.boardVisual-inner h2{font-size: 60px;}
	
	.board-page-navi{gap: 20px;margin-top: 60px;}
	.board-page-navi>li>a{font-size: 20px;}
	.board-page-navi>li>a::after{height: 3px;}
}

/*-- 뷰 페이지 --*/
.view-list{display: flex;}
.view-list img{display: block;max-width: 50px;}

.view-title{margin-top: 90px;padding-bottom: 40px;border-bottom: 3px solid #FFF;}
.view-title>span{display: block;font-size: var(--font-size-18);font-weight: var(--font-weight-700);color: #FFF;}
.view-title>div{display: flex;align-items: flex-end;margin-top: 15px;}
.view-title>div h4{width: calc( 100% - 95px );font-size: var(--font-size-45);font-weight: var(--font-weight-700);color: #FFF;line-height: 160%;word-break: keep-all;}
.view-title>div span{width: 95px;color: #FFF;font-weight: var(--font-weight-600);line-height: 160%;padding-bottom: 10px;}

.view-content{padding: 50px 0;border-bottom: 1px solid rgba(255,255,255,.3);}
.view-content-box, .view-content-box *{font-size: var(--font-size-17);font-weight: var(--font-weight-400);line-height: 180%;color: #FFF;}

.view-wrap .common-link-wrap{margin-top: 70px;}

.addWrap{margin-top: 25px;}
.addUl li{display: flex;align-items: center;justify-content: space-between;line-height: 52px;background: #232323;margin-bottom: 8px;border-radius: 5px;overflow: hidden;padding: 0 25px;font-size: var(--font-size-15);color: rgba(255,255,255,.5);}
.addUl li a{display: flex;align-items: center;gap: 5px;}
.addUl li a.f_delBtn{text-decoration: underline;}
.addUl li a i{margin-top: -2px;font-size: var(--font-size-18);}
.addUl li a:hover{color: #FFF;}

/*contact*/
.view-data>ul{display: flex;flex-wrap: wrap;align-items: center;}
.view-data>ul>li{display: flex;align-items: center;width: 50%;border-bottom: 1px solid rgba(255,255,255,.3);}
.view-data>ul>li.view-data-100{width: 100%;}
.view-data>ul>li h4, .view-data>ul>li>span{font-weight: var(--font-weight-500);color: #FFF;padding: 18px 20px;line-height: 180%;}
.view-data>ul>li h4{width: 180px;background: #232323;}
.view-data>ul>li>span{width: calc( 100% - 180px );}

@media screen and (max-width: 1080px){
	
	.view-data>ul>li h4, .view-data>ul>li>span{padding: 18px;line-height: 160%;}
	.view-data>ul>li h4{width: 150px;}
	.view-data>ul>li>span{width: calc( 100% - 150px );}
}

@media screen and (max-width: 720px){
	
	.view-list img{max-width: 35px;}

	.view-title{margin-top: 50px;padding-bottom: 25px;border-bottom: 2px solid #FFF;}
	.view-title>span{font-size: 15px;}
	.view-title>div{display: block;}
	.view-title>div h4{width: 100%;font-size: 24px;line-height: 140%;}
	.view-title>div span{display: block;width: 100%;font-size: 13px;color: rgba(255,255,255,.6);margin-top: 6px;padding-bottom: 0;}

	.view-content{padding: 28px 0;}
	.view-content-box, .view-content-box *{font-size: 15px;line-height: 180%;}

	.view-wrap .common-link-wrap{margin-top: 60px;}

	.addWrap{margin-top: 20px;}
	.addUl li{display: block;line-height: 180%;padding: 13px 20px;font-size: 13px;color: rgba(255,255,255,.5);}
	.addWrap .bo_v_file_size{display: none;}

	.addUl li a strong{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}

	.view-data>ul>li{width: 100%;}
	.view-data>ul>li h4, .view-data>ul>li>span{font-size: 14px;padding: 15px 13px;line-height: 160%;}
	.view-data>ul>li h4{width: 130px;}
	.view-data>ul>li>span{width: calc( 100% - 130px );overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
}

/*-- 글 작성 페이지 --*/
.write-table{width: 100%;}
.write-table td{color: #FFF;padding: 10px;border-bottom: 1px solid rgba(255,255,255,.25);}
.write-table tr td:nth-child(1){font-size: var(--font-size-17);font-weight: var(--font-weight-500);padding: 10px 25px;}

.write-height{line-height: 50px;}

.write-editor{background: #FFF;}
.write-editor .cke_sc, .write-editor .sound_only{display: none;}

.write-table .file_del{display: block;margin-top: 10px;}

/*-- 리스트 페이지 --*/
.list-ul>li{display: flex;align-items: center;line-height: 72px;border-bottom: 1px solid rgba(255,255,255,.4);}
.list-ul>li>span{display: flex;justify-content: center;align-items: center;font-size: var(--font-size-17);font-weight: var(--font-weight-400);padding: 0 10px;text-align: center;color: #FFF;}
.list-head>li{background-color: #232323;}
.list-head>li>span{font-weight: var(--font-weight-600);}

.list-check{width: 6%;}
.list-num{width: 6%;}
.list-cate{width: 7%;}
.list-name{width: 27%;}
.list-hp{width: 14%;}
.list-email{width: 20%;}
.list-day{width: 10%;}
.list-status{width: 10%;}

.list-ul>li>span.list-name, .list-ul>li>span.list-hp, .list-ul>li>span.list-email{justify-content: flex-start;}
.list-ul>li>span.list-name{padding-left: 30px;}

.list-ul>li:hover{background-color: #232323;}

.cateName{display: inline-block;font-size: var(--font-size-14);height: 34px;line-height: 32px !important;padding: 0 13px;border: 1px solid #555;text-align: center;color: #bbb;background: #333;font-weight: 500;}
.sigNot{background: #454545;color: #999;}
.sigSuc{background: var(--color-1);border-color: var(--color-1);color: #FFF;font-weight: 700 !important;}

.boardInfo-flex{justify-content: space-between;margin-top: 25px;}

/*카테고리*/
#newCate>ul{display: flex;align-items: center;gap: 6px;}
#newCate>ul>li>a{display: block;width: 100%;height: 100%;padding: 14px 30px;text-align: center;background: #444;color: #888;font-weight: 500;border-radius: 3px;overflow: hidden;}
#newCate>ul>li>a#bo_cate_on{background: var(--color-1);color: #FFF;font-weight: 700;}

/*search*/
.listSearch{border: none;}
.listSearch>form{display: flex;gap: 5px;font-size: var(--font-size-15);}

.searchInput{line-height: 45px;border: 2px solid rgba(255,255,255,.3);padding: 0 18px;font-weight: 400;background-color: transparent;color: #FFF;outline: none;overflow: hidden;}
.searchInput:focus{border-color: #FFF;}
.searchInput::placeholder{color: rgba(255,255,255,.7);}

select.searchInput{width: 130px;background-image: url(/img/icon/select_arrow.png);background-repeat: no-repeat;background-position: right 15px center;cursor: pointer;
	-webkit-appearance:none; /* for chrome */
	-moz-appearance:none; /*for firefox*/
	appearance:none;
}
select.searchInput::-ms-expand{display:none;}/*for IE10,11*/
select.searchInput option{color: #000;}

.searchBox{position: relative;}
.searchBox .searchInput{padding-right: 63px;}
.searchBtn{position: absolute;top: 2px;right: 2px;width: 45px;height: 45px;display: flex;justify-content: center;align-items: center;}
.searchBtn i{font-size: var(--font-size-18);color: #FFF;}

@media screen and (max-width: 1080px){
	
	.list-check{width: 6%;}
	.list-num{width: 6%;}
	.list-cate{width: 7%;}
	.list-name{width: 39%;}
	.list-hp{width: 17%;}
	.list-day{width: 13%;}
	.list-status{width: 12%;}

	.list-email{display: none !important;}
}

@media screen and (max-width: 1080px){
	
	.list-ul>li{line-height: 60px;}

	.list-check{width: 8%;}
	.list-num{width: 8%;}
	.list-cate{width: 8%;}
	.list-name{width: 46%;}
	.list-day{width: 16%;}
	.list-status{width: 14%;}

	.list-hp{display: none !important;}
}

@media screen and (max-width: 720px){
	
	#list-wrap .view-title, #list-wrap .view-title>div{margin-top: 0;}
	#list-wrap .view-title>div h4{font-size: 28px;}
	#list-wrap .view-title>div span{font-size: 14px;}

	#newCate{margin-top: 20px;margin-bottom: 30px;}
	#newCate>ul>li>a{font-size: 14px;padding: 12px 24px;}
	
	.searchBox{width: calc( 100% - 125px );}
	select.searchInput{width: 120px;}
	#list-wrap .searchInput{font-size: 14px;padding: 0 13px;}
	.searchBox .searchInput{padding-right: 58px;}

	.list-ul>li>span{font-size: 14px;}

	.list-check{width: 15%;}
	.list-name{width: 55%;}
	.list-status{width: 30%;}

	.list-num, .list-cate, .list-day{display: none !important;}
	.list-ul>li>span.list-name{padding-left: 3px;}

	#list-wrap .check-box input[type=checkbox] + label span{width: 15px;height: 15px;}

	.cateName{font-size: 13px;}
}

/*-- 제작 스토리 --*/
#story-content{background: #FFF;padding: 50px;}

#story-content .view-content-box, #story-content .view-content-box *{color: unset;}

.story-tag{display: flex;flex-wrap: wrap;column-gap: 8px;margin-top: 70px;}
.story-tag a{display: block;width: 100%;height: 100%;line-height: 140%;font-weight: var(--font-weight-500);color: #3989d6;word-break: keep-all;}

@media screen and (max-width: 720px){
	
	#story-content{padding: 25px;}

	#story-content .view-content-box img, #story-content .view-content-box img{display: block;width: 100%;}

	.story-tag{column-gap: 5px;}
	.story-tag a{font-size: 14px;line-height: 160%;}
}

.serviceAlert{font-size: var(--font-size-15);font-weight: 400;color: #FFF;margin-top: 10px;word-break: keep-all;}

/*-- 제작후기 --*/
.review-list{border-top: 1px solid #FFF;}
.review-list>li{padding: 35px 30px;border-bottom: 1px solid rgba(255,255,255,.3);}
.review-print{background: #333;}

.review-star{display: flex;align-items: center;gap: 3px;}
.review-star img{display: block;}

.review-box{color: #FFF;margin-top: 13px;}
.review-box h4{font-size: var(--font-size-20);font-weight: var(--font-weight-600);line-height: 160%;word-break: keep-all;}
.review-box>div{font-size: var(--font-size-14);font-weight: var(--font-weight-400);line-height: 180%;margin-top: 10px;color: rgba(255,255,255,.7);word-break: keep-all;}

.review-info{display: flex;align-items: center;gap: 13px;margin-top: 13px;}
.review-info span{font-size: var(--font-size-14);font-weight: var(--font-weight-600);color: #FFF;}

@media screen and (max-width: 720px){
	
	.review-list>li{padding: 25px 20px;}

	.review-star{gap: 2px;}
	.review-star img{max-width: 12px;}

	.review-box h4{font-size: 16px;}
	.review-box>div{font-size: 14px;}

	.serviceAlert{font-size: 14px;line-height: 160%;}
}

/*-- work - 포트폴리오 --*/
#port-board-text{display: flex;align-items: flex-end;justify-content: space-between;}
#port-board-text p{margin-bottom: 0;}
#port-board-text .common-switch{margin-bottom: 13px;}

.port-inner{display: flex;align-items: flex-start;gap: 16px;padding-top: 100px;}
.cate-wrap{width: 360px;position: relative;}
.port-board-wrap{width: calc( 100% - 376px );}

/*cate*/
.cate-slick{position: sticky;top: 116px;}

.port-cate li{border-top: 1px solid #777;}
.port-cate li>a{display: block;width: 100%;height: 100%;color: #777;font-size: var(--font-size-22);font-weight: var(--font-weight-500);line-height: 55px;}

.port-cate li.on{border-color: #FFF;}
.port-cate li.on>a{color: #FFF;}

.port-cate dl{display: flex;flex-wrap: wrap;column-gap: 10px;}
.port-cate dl dt a{display: block;width: 100%;height: 100%;color: rgba(255,255,255,.5);font-size: var(--font-size-15);font-weight: var(--font-weight-400);line-height: 180%;}
.port-cate dl dt:last-child a{padding-bottom: 14px;}

.port-cate dl dt.on>a{color: #FFF;}

.port-board-count{font-size: var(--font-size-24);font-weight: var(--font-weight-400);color: #FFF;margin-top: 100px;}

/*list*/
.port-board-list{display: flex;flex-wrap: wrap;align-items: flex-start;gap: 16px;}
.port-board-list>li{width: calc( ( 100% - 32px ) / 3 );position: relative;}
.port-board-list>li .bo_chk{top: 20px;left: 20px;margin-right: 0;z-index: 10;}

.port-board-list>li a{display: block;width: 100%;height: 100%;position: relative;}
.port-board-list>li figure{height: auto;padding-bottom: 100%;background-repeat: no-repeat;background-size: cover;}

.port-board-info{display: flex;justify-content: space-between;color: #FFF;font-size: var(--font-size-14);font-weight: var(--font-weight-500);line-height: 55px;border-top: 1px solid #FFF;}
.port-board-info>div{display: flex;align-items: center;gap: 10px;}
.port-board-info>div i:first-child{padding-right: 6px;}

.port-board-list>li:hover .port-text h4 i::after{
	-webkit-animation: masking-ani 1s cubic-bezier(0.770, 0.000, 0.175, 1.000) forwards;
	animation: masking-ani 1s cubic-bezier(0.770, 0.000, 0.175, 1.000) forwards;
}
.port-board-list>li:hover .port-text h4 i span{opacity: 1;transition-delay: .4s !important;
	-webkit-transition: opacity .3s ease-in-out;
	transition: opacity .3s ease-in-out;
}

#port-more{justify-content: center;margin-top: 100px;}
#port-more button, #port-more a{height: 75px;line-height: 73px;padding: 0 51px;background-color: var(--color-1);border-color: var(--color-1);}

@media screen and (max-width: 1680px){
	
	.cate-wrap{width: 400px;position: relative;}
	.port-board-wrap{width: calc( 100% - 416px );}
}

@media screen and (max-width: 1480px){
	
	.cate-wrap{width: 300px;position: relative;}
	.port-board-wrap{width: calc( 100% - 316px );}

	.port-board-list>li{width: calc( ( 100% - 16px ) / 2 );}
}

@media screen and (max-width: 1280px){
	
	#port-board-text{display: block;}
	#port-board-text .common-switch{margin-bottom: 0;margin-top: 25px;}

	.port-inner{display: block;padding-top: 80px;}
	.cate-wrap{width: 100%;height: auto !important;}
	.port-board-wrap{width: 100%;}

	.port-board-count{margin-top: 25px;margin-bottom: 20px;}

	.port-cate{display: flex;}
	.port-cate>li{flex: 1;}
	.port-cate li>a{height: 55px;}
}

@media screen and (max-width: 960px){
	
	.port-title-inner{margin-top: 0;}

	#port-board-text p{font-size: var(--font-size-20);}
}

@media screen and (max-width: 720px){
	
	#port-board-text p{font-size: 14px;margin-top: -30px;}

	.port-cate li>a{font-size: 13px;letter-spacing: -0.02em;height: 50px;line-height: 50px;}
	.port-cate dl{display: none;}

	.port-board-count{margin-top: 20px;margin-bottom: 15px;}

	.port-board-list{gap: 10px;}
	.port-board-list>li{width: calc( ( 100% - 10px ) / 2 );}

	#port-more{margin-top: 60px;}
	#port-more button, #port-more a{height: 55px;line-height: 53px;padding: 0 30px;}
}

/*view*/
.pv-visual{position: relative;}
.pv-visual figure{width: 100%;height: 100vh;position: relative;
	background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
	background-attachment: fixed;
}
.pv-visual figure::after{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.25);}

.pv-visual .view-list{position: absolute;top: 120px;left: 2.5%;z-index: 1;}

.pv-title{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 1;}
.pv-title h2{font-size: var(--font-size-120);font-weight: var(--font-weight-600);color: #FFF;margin-bottom: 50px;}

.pv-title ul{display: flex;gap: 16px;margin-top: 70px;}
.pv-title ul li{width: 10%;border-top: 1px solid #FFF;padding-top: 25px;}
.pv-title ul li h5{font-weight: var(--font-weight-600);color: #FFF;margin-bottom: 20px;}
.pv-title ul li span{font-weight: var(--font-weight-400);color: rgba(255,255,255,.6);}

.thum_box{display: flex;align-items: flex-end;justify-content: center;position: relative;margin-top: -100px;}

.thum_img{border-radius: 30px;border: 5px solid #222;overflow: hidden;}
.thum_img img{display: block;}
.thum_pc{}
.thum_mo{margin-left: -85px;margin-bottom: -30px;}

.pv-text{max-width: 1080px;margin: 0 auto;color: #FFF;font-weight: var(--font-weight-400);line-height: 230%;margin-top: 100px;word-break: keep-all;}
.pv-text-wrap, .pv-text-wrap *{font-family: 'Pretendard Variable' !important;font-size: 1rem !important;color: #FFF !important;font-weight: var(--font-weight-400) !important;line-height: 230% !important;word-break: keep-all !important;}
.pv-text b{display: block;font-weight: var(--font-weight-700);margin-bottom: 15px;}

.pv-detail{margin-top: 160px;padding: 180px 0;background: #212121;}
.pv-detail img{display: block;max-width: 100%;margin: 0 auto;}

.pv-title-content{position: relative;top: auto;left: auto;transform: translate(0);width: 100%;max-width: 1080px;margin: 0 auto;margin-top: 180px;}
.pv-title-content h2{font-size: var(--font-size-45);}
.pv-title-content ul{margin-top: 50px;}
.pv-title-content ul li{width: 20%;}

@media screen and (max-width: 1480px){
	
	.pv-title h2{font-size: var(--font-size-80);margin-bottom: 30px;}
	.pv-title ul li{width: 15%;}

	.pv-title-content h2{font-size: var(--font-size-45);}
}

@media screen and (max-width: 1080px){
	
	.pv-title ul li{width: 20%;}

	.pv-title-content h2{font-size: var(--font-size-45);}
}

@media screen and (max-width: 720px){
	
	.pv-visual .view-list{top: 100px;left: 5%;}
	
	.pv-title{top: 60%;}
	.pv-title h2{font-size: 40px;}
	.pv-title ul{flex-direction: column;gap: 15px;margin-top: 50px;}
	.pv-title ul li{width: 100%;padding-top: 0;border-top: none;}
	.pv-title ul li h5{font-size: 15px;margin-bottom: 10px;}
	.pv-title ul li span{font-size: 15px;}

	.pv-title-content{top: auto;margin-top: 120px;}
	.pv-title-content h2{font-size: 24px;}

	.pv-text{margin-top: 70px;font-size: 14px;}
	.pv-text b{font-size: 15px;}
	.pv-text br{display: none;}

	.pv-detail{margin-top: 100px;padding: 100px 0;padding-bottom: 0;}

	#port-view{padding-bottom: 100px;}
}

/*-- 포트폴리오 순서 변경 모드 --*/
#change-element{display: flex;flex-wrap: wrap;}
#change-element>li{width: calc( 100% / 10 );border: 1px solid #FFF;margin-left: -1px;margin-top: -1px;position: relative;padding: 45px;background: #000;}

#change-element>li figure{display: block;width: 100%;padding-bottom: 100%;background-size: cover;}

#change-element>li span, #change-element>li h4{position: absolute;z-index: 1;color: #FFF;font-size: 18px;font-weight: bold;}
#change-element>li span{top: 10px;left: 17px;z-index: 1;}
#change-element>li h4{bottom: 10px;left: 0;width: 100%;text-align: center;}