/* CSS Document */
@import url('/home/css/form.css');

/*화면전환*/
body {animation: fadein 800ms ease-out; -moz-animation: fadein 800ms ease-out; -webkit-animation: fadein 800ms ease-out; -o-animation: fadein 800ms ease-out;}
@keyframes fadein {
  from {opacity: 0;}
  to {opacity: 1;}
}
@-moz-keyframes fadein { /* Firefox */
  from {opacity:0;}
  to {opacity:1;}
}
@-webkit-keyframes fadein { /* Safari and Chrome */
  from {opacity:0;}
  to {opacity:1;}
}
@-o-keyframes fadein { /* Opera */
  from {opacity:0;}
  to {opacity: 1;}
}

/* Scss Document */
._blind {position: absolute; clip: rect(0 0 0 0); width: 1px; height: 1px; margin: -1px; overflow: hidden;}
.blind_text {text-indent:-9999px}

.wrapper {position:relative; width:100%; }


.page_top {position:relative; height:50px;}
.page_top ._box {display: none; position: relative; widows: 100%; margin: 0}
.page_top .logo {position: absolute; left:50%; top:50%; margin-left:-600px; transform: translate(0,-50%); width: 140px; z-index: 2; display: none;}

.page_top.mypage {display: none;}
.page_top.login {display: none;}

.page_name {position:relative; width:94%; height:80px; line-height:80px; margin-top:15px; border-bottom:1px solid #ddd; font-size:1.4em; font-weight: 600; color:#222; margin: 60px auto 0;}
.page_name:after {position:absolute; left:0; bottom:0; width:60px; height:3px; background:#333; content:''; display:block
}

/* 경로창 */
.path-box {display:none;}
#lnb {position:relative; width:100%; height:50px; margin:0 auto 30px; border-top:1px solid #f9f9f9; border-bottom:1px solid #f4f4f4; padding-right: 16px; /*0103김다영*/}
#lnb > ul { display:flex; width:100%; margin:0 auto; align-items:center; justify-content:flex-end;}
#lnb > ul > li {position:relative; font-size:.9em; }
/*#lnb > ul > li > a {display:block; width:auto; height:50px; margin-left:20px; line-height:50px; padding:0; text-align:left; color:#999;} cs디자인 스킨을 위한 주석 20240902*/
#lnb > ul > li:last-child > a {color:#1c77c4; font-weight:400;}
#lnb > ul > li > ul {position:absolute; right:-1px; top:39px; padding:5px; border:1px solid #eee; background:#fff; opacity:0; visibility:hidden; z-index:19 }
#lnb > ul > li > ul > li {width:130px; height:30px;}
#lnb > ul > li > ul > li > a {display:block; min-width:130px; height:30px; line-height:30px; padding:0 10px; font-size:.95em; color:#aaa;}
#lnb > ul > li > ul > li > a:hover {color:#222}
#lnb > ul > li:hover > a {color:#1c77c4;}
#lnb > ul > li:hover .dropdown-toggle {opacity: 1; visibility: visible}

.lnb_search {position:relative; width:100%; margin-top:50px; padding:5px 15px; background:none; overflow:hidden; z-index: 1}
.lnb_search .search_box {position:relative; width:100%; margin:0 auto}
.lnb_search .search_box ._input {position:relative; width:100%; height:40px; margin:0 auto}
.lnb_search .search_box ._input .search_input {width:100%; height:40px; line-height:40px; padding:0 20px; border-radius:20px; border:1px solid #ddd; font-size:1em; color:#333;}
.lnb_search .search_box ._input .search_btn {position:absolute; top:0; right:0; width:40px; height:40px; border:0; background:url('../images/main/search_img')no-repeat 5px -45px;}
.lnb_search .search_box ._word {display:none; position:relative; left:0; top:0; height:32px; font-size:.95em; font-weight:300; width: 450px; -webkit-user-select: none; -moz-user-select: none; -ms-use-select: none; user-select: none; }
.lnb_search .search_box ._word > p {display:inline-block; color:#5b9c7b; font-weight:600; width: 110px;}
.lnb_search .search_box ._word > a {display:inline-block; height:32px; line-height:32px; margin-right:25px; color:#555;}

.lnb_search .search_box ._word #pop_word {display: flex; flex-wrap: nowrap; width: 100%; gap: 20px; overflow-x: auto; white-space: nowrap;}

.lnb_search .search_box ._word #pop_word::-webkit-scrollbar {display: none;}

.lnb_search .search_box ._word #pop_word .item_ {margin-right: 20px;}

.mainmenu03 {display:block;} /*무엇이든물어보세요 영역*/

@media screen and (min-width: 960px) {
	h2 {padding:0}
	/* .header {display:none;} */
	.lnb_search {padding: 5px 20px;}	
}

@media screen and (min-width: 1280px) {
	.lnb_search {left:50%; top:50%; transform: translateY(-50%)}
	.lnb_search .search_box {width:800px; margin:0}
	.lnb_search .search_box ._input {width:350px; height:40px; margin:0}
	.lnb_search .search_box ._word {display:flex; position:absolute; left:365px; height:40px; line-height: 40px}

	.mainmenu03 {display:none;} /*무엇이든물어보세요 영역*/
}

/* PC */
.pcheader {transition:all .2s ease;}
.hiddenNav {display:none;}
.totalList {display: block;}
.totalList ._box {display: block;}
.logo {width:200px; z-index: 2}
.logo img {width: 100%; height: 100%; object-fit: cover;}
.logo a {width: 100%; display: block;}


/*header .logo {position:absolute; left: 0; top:50%; padding-left:40px; transform: translateY(-50%);}*/
.header .logo {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 110px;} /*모바일,마이페이지*/
/*1215 네비 수정*/
header .pcheader .logo {opacity:0; position:absolute; top:50%; left:-170px; transform:translateY(-50%);}
header .pcheader .pc_right_menu {opacity:0; right:163px;}


nav {position:relative; width:1200px; height:60px; margin:0 auto; padding:0; background: none;}
nav > ul {position: absolute; top: 50%; transform: translateY(-50%); display: flex; line-height: 60px; margin-left:-30px; font-size: 1em; font-weight: 500;}
nav > ul > li {padding: 0 30px; position: relative; height: 60px; line-height: 60px;}
nav > ul > li > ul {width: 1000px; position: absolute; top: 60px; left: 0; padding-left: 30px; display: none;font-size:.95em; height:45px; line-height:45px; font-weight: 400;}
nav > ul > li > ul > li {display: inline-block; white-space: nowrap; margin-right: 30px;}
nav > ul > li > ul > li > a {color: #ddd;}
nav > ul > li > ul > li:hover a {color: #fff;}
nav > ul > li:hover > ul {display: block;}
/* nav > ul > li:last-child {display:none} */
nav .category_icon {position:absolute; top:3px; left:250px; width:55px; height:25px; line-height:19px; font-size:.75em; text-align:center; background:url('/home/images/common/category_icon')no-repeat; background-size:contain; color:#fff;}

/*컬러있는 페이지 헤더 배경*/
header.hd_case {background: linear-gradient(#e4ecff 60px, #345296 30px), #345296;}
header.hd_case nav {background: #e4ecff;}
.case_top {background: #e4ecff;}

/* 모바일 */
.header {position: fixed; width: 100%; z-index: 10; top: 0; left: 0; height: 50px; background: #fff; border-bottom: 1px solid rgba(0, 0, 0, .06);}
.header.mypage {background: #505050;}
.header.sub_page {background: #fff;}
header.privacy {display:none;}

/*메뉴*/
nav.top_menu {position: absolute; top: 50%; left:50%; z-index:0; width:100%; height: 50px; padding:10px 16px; text-align:center; transform: translate(-50%, -50%);  display: flex; justify-content: space-between;}
nav.sub_page {box-shadow: 0 1px rgba(0,0,0,.05);}
nav.top_menu .m_logo {display: none; position: absolute; top: 50%; left: 16px; transform: translateY(-50%); font-size: 1.6em; color: #111; font-weight: bold;}
nav.top_menu .m_logo > a {width: 140px;}
nav.top_menu .m_logo > a img {width: 100%; height: 100%; object-fit: cover;}
nav input.submit {background: none; border: none; color: #2b56e4; font-weight: 500; position: absolute; top: 50%; right: 16px; transform: translateY(-50%); cursor: pointer;}
nav.top_menu {width: 100%; height: 50px; display: flex; justify-content: flex-end;}
.sub_page nav.top_menu {border-bottom: none;}
nav .on {position: absolute; top: 50%; right: 16px; transform: translateY(-50%); cursor: pointer; color: #2b56e4; font-weight: 500; font-size: 1em; font-family: 'Pretendard';}

nav.top_menu .m_left_menu {display: flex; align-items: center; display: none;}
nav.top_menu .m_left_menu a {display: block; background: url('/home/images/mypage/icon_menubar.png') no-repeat -2px 0; width: 20px; height: 16px;}
nav.top_menu .m_left_home {display: flex; align-items: center; display: none;}

nav.top_menu .m_right_menu {display: flex; align-items: center; position: absolute; top: 50%; right: 10px; transform: translateY(-50%); flex-direction: row-reverse; /*left menu 디스플레이 none 아닐때 position 지우기*/}
nav.top_menu .m_right_menu .alarm_ {position: relative; width: 30px; height: 30px;}
nav.top_menu .m_right_menu .alarm_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar') no-repeat 0 -459px; width: 16px; height: 20px;}
nav.top_menu .m_right_menu .alarm_ .alarm01 {position: absolute; display: block; width: 13px; height: 13px; border-radius: 50px; background: red; color: #fff; line-height: 13px; font-weight: 600; font-size: .5em; top: -9px; right: -9px;}
nav.top_menu .m_right_menu .alarm_ .alarm02 {position: absolute; display: block; width: 5px; height: 5px; border-radius: 50px; background: red; top: -2px; right: -2px;}
nav.top_menu .m_right_menu .setting_ {display: none; position: relative; width: 35px; height: 35px; margin-left: 10px;}
nav.top_menu .m_right_menu .setting_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar') no-repeat 0 -428px; width: 22px; height: 22px;}

nav.top_menu .m_right_menu .search_ {position: relative; width: 30px; height: 30px;}
nav.top_menu .m_right_menu .search_ a {display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar') no-repeat 0 -742px; width: 18px; height: 19px;}


nav.top_menu .m_right_menu .logout_ {display: none; position: relative; width: 35px; height: 35px; margin-left: 10px;}
nav.top_menu .m_right_menu .logout_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar2') no-repeat -1px -535px; width: 20px; height: 20px;}



/*  ssssss */
.page_top .m_right_menu {display: none; align-items: center; position: absolute; top: 50%; right: 10px; transform: translateY(-50%); /*left menu 디스플레이 none 아닐때 position 지우기*/}
.page_top .m_right_menu .alarm_ {position: relative; width: 35px; height: 35px;}
.page_top .m_right_menu .alarm_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar') no-repeat 0 -390px; width: 18px; height: 22px;}
.page_top .m_right_menu .alarm_ .alarm01 {position: absolute; display: block; width: 13px; height: 13px; border-radius: 50px; background: red; color: #fff; line-height: 13px; font-weight: 600; font-size: .5em; top: -9px; right: -9px;}
.page_top .m_right_menu .alarm_ .alarm02 {position: absolute; display: block; width: 5px; height: 5px; border-radius: 50px; background: red; top: -2px; right: -2px;}
.page_top .m_right_menu .setting_ {display: none; position: relative; width: 35px; height: 35px; margin-left: 10px;}
.page_top .m_right_menu .setting_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar') no-repeat 0 -428px; width: 22px; height: 22px;}

.page_top .m_right_menu .logout_ {display: block; position: relative; width: 35px; height: 35px; margin-left: 10px;}
.page_top .m_right_menu .logout_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar') no-repeat -1px -568px; width: 22px; height: 22px;}




/*로그인 로그아웃*/
#logForm {display: flex; flex-direction: row-reverse; align-items: center;}
#logForm .img_ {width: 35px; height: 35px; border-radius: 50%; cursor: pointer; margin-left: 5px; border: 1px solid #e1e1e1;}
#logForm .img_ img {width: 100%; height: 100%; object-fit: cover; border-radius: 50%;}

.rightmenu {display: flex; flex-direction: row-reverse; align-items: center;}
.rightmenu .img_ {width: 35px; height: 35px; border-radius: 50%; cursor: pointer; margin-left: 5px; border: 1px solid #e1e1e1;}
.rightmenu .img_ img {width: 100%; height: 100%; object-fit: cover; border-radius: 50%;}

/* mypage 모바일 헤더 or 백그라운드 컬러가 있을때 */
.mypage nav.home {background: #666;}

.mypage .burger-icon .burger-sticks {background: #fff;}
.mypage .burger-icon .burger-sticks:before {background: #fff;}
.mypage .burger-icon .burger-sticks:after {background: #fff;} 

.mypage nav.top_menu .m_right_menu {display: flex; align-items: center; position: absolute; top: 50%; right: 10px; transform: translateY(-50%); /*left menu 디스플레이 none 아닐때 position 지우기*/}

.mypage nav.top_menu .m_right_menu .alarm_ {position: relative; width: 35px; height: 35px;}
.mypage nav.top_menu .m_right_menu .alarm_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar') no-repeat 0 -487px; width: 16px; height: 20px;}
.mypage nav.top_menu .m_right_menu .alarm_ .alarm02 {position: absolute; display: block; width: 5px; height: 5px; border-radius: 50px; background: red; top: -2px; right: -2px;}

.mypage nav.top_menu .m_right_menu .setting_ {position: relative; width: 35px; height: 35px; margin-left: 10px;}
.mypage nav.top_menu .m_right_menu .setting_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar2') no-repeat 0 -505px; width: 22px; height: 22px;}


.mypage nav.top_menu .m_right_menu .search_ a {display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar') no-repeat 0 -775px; width: 18px; height: 18px;}

.mypage nav.sub_page {box-shadow: none;}

.mypage #logForm .img_ {display: none;}

.m_right_menu .skip_log {display: block; position: relative; width: 35px; height: 35px;}
.m_right_menu .skip_log:hover {border-radius: 50px; background: #f5f5f5;}
.m_right_menu .skip_log a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar') no-repeat 0 -710px; width: 22px; height: 22px;}

/*메뉴 - 뒤로가기*/
nav.top_menu .m_back_menu {position: absolute; top: 50%; left: 16px; transform: translateY(-50%);}
nav.top_menu .m_back_menu a {display: block; background: url('/home/images/icon_menubar') no-repeat -1px -199px; width: 9px; height: 15px;}
nav.top_menu .m_back_menu img {position: absolute; top: 50%; left: -5px; transform: translateY(-50%);}
nav.top_menu h4 {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 1em; font-weight: 500;}
nav.top_menu h4 p {display: inline-block; margin-left: 2px;}

/* 글쓰기 헤더 - 취소 저장 버튼 */
.write_page nav.top_menu {width: 100%; padding: 0;}
.write_page nav.top_menu .m_back_menu {left: 20px;}
nav.top_menu .writebtn {height: 100%; padding: 0 35px; border: 1px solid rgba(0, 0, 0, .06); cursor: pointer;}
nav.top_menu .writebtn.save {background: #3968ff; color: #fff;}
nav.top_menu .writebtn.cancel {border-right: none; border-bottom: none; background: none;}

/*햄버거메뉴*/
.burger-check {display: none;}
.burger-icon {cursor: pointer; display: inline-block; position: absolute; top: 50%; left: 16px; width: 20px; height: 20px; user-select: none; z-index: 2;}
.burger-icon .burger-sticks {background: #333; display: block; height: 2px; position: relative; transition: .2s ease-out; width: 20px;}
.burger-icon .burger-sticks:before, .burger-icon .burger-sticks:after {background: #333; content: ''; display: block; height: 100%; position: absolute; transition: all .2s ease-out; width: 100%;} 
.burger-icon .burger-sticks:before {top: 7px;}
.burger-icon .burger-sticks:after {top: -7px;}
.burger-check:checked ~ .m_menu {transform: translateX(0);}
.burger-check:checked ~ .m_menu .blind {display: block;}
.burger-check:checked ~ .burger-icon .burger-sticks {background: transparent;}
.burger-check:checked ~ .burger-icon .burger-sticks:before {transform: rotate(-45deg); background: #333;}
.burger-check:checked ~ .burger-icon .burger-sticks:after {transform: rotate(45deg); background: #333;}
.burger-check:checked ~ .burger-icon:not(.steps) .burger-sticks:before,
.burger-check:checked ~ .burger-icon:not(.steps) .burger-sticks:after {top: 0;}

/*모바일 햄버거메뉴 안 토글슬라이드*/
.m_menu {width: 100%; height: 150vh; transform: translateX(-1000px); background: #fff; position: absolute; top: 0; left: 0; padding: 120px 0 0 0; z-index: 1; transition: 0.5s ease;}

.m_menu .blind {transition: 0.5s ease-out; display: none;}
.m_menu .blind > li > a {display: block; font-size: 1em; padding: 15px 30px; border-bottom: 1px solid rgba(0, 0, 0, .05); color: #555; font-weight: 500;}
.m_menu .blind > li > a span {display:flex;}
.m_menu .blind > li > a i {position: absolute; right: 30px; font-size: .8em; transform: translateX(-50%) rotate(0); transition: transform 0.3s ease; line-height: 1.5em;}
.m_menu .blind > li > a.on i {transform: translateX(-50%) rotate(180deg);}
.m_menu .blind > li:last-child > a {border: 0;}
.m_menu .blind > li > a:hover {color: #203f76; font-weight: 600;} 
.m_menu .blind > li > ul {display: none; background: #fafbfc; box-shadow: 0 1px rgba(0, 0, 0, .06); padding: 10px 0;}
.m_menu .blind > li > ul > li a {display: block; font-size: .9em; padding: 15px 30px; color: #555; font-weight: 500;}
.m_menu .blind > li > ul > li a:hover {color: #203f76;}

/*모바일 햄버거메뉴 안 로그아웃*/
.m_menu .blind > li > form {background: #f9f9f9; padding: 10px 30px; width: 90%; margin: 0 auto; border: 1px solid #ddd; border-radius: 5px; margin-top: 50px; text-align: center; color: #555;}

.left_contents {display: none; transform: translateY(-50%);}
.tab_cont1 .mypage_profile {display: none;}

/*검색페이지상단*/
nav input.search {position: absolute; top: 50%; left: 40px; transform: translateY(-50%); width: calc(100% - 55px); background: #f3f5fa; border: none; border-radius: 50px; padding: 10px 20px; font-weight: 300;}
nav input.search::placeholder {color: #b3b2b2;}
nav button {position: absolute; top: 52%; right: 36px; transform: translateY(-50%); border: none; font-size: 1.2em; color:#b3b2b2; background: none; cursor: pointer;}

/* 레이아웃 설정 */
.container {width:100%; height:auto; margin:0 auto}

/*  member_inner */
.container .member_inner {width:90%; margin:70px auto 0;}

.contents {display:flex; width:100%; height:100%; justify-content:center; flex-wrap:wrap;}
.sub_page .contents {display:flex; width:100%; height:auto; justify-content:center; flex-wrap:wrap;}
.board {width:100%; }
.st_1 {padding-top: 50px;} /*0103김다영*/
.contents > div {display:block;}

.cm_board {}
.column-left {width:100%; padding:0 0 10px;}
.column-left div.view {width:94%; margin:0 auto}
.column-right {width:100%; padding:0; background:#f7f7f7}
.sub_page .column-right {background: #fafbfc;}

/* 메인 사이즈*/
.column-left-main {width:100%;}
.column-right-main {width:100%; padding:0; }

.fix_wrap {display:block; width:94%; height:100%; margin:30px auto 0; padding:30px 0}

/* flex 설정 */
.flex_start {display:flex; justify-content:flex-start; flex-wrap:wrap; }
.flex_start > div {position:relative; overflow:hidden}
.flex_center {display:flex; justify-content:center; flex-wrap:wrap; }
.nowrap {flex-wrap:nowrap;}

/* 글줄임 설정 */
.line_break1 {white-space: nowrap; overflow:clip; text-overflow: ellipsis;}
.line_break2 {}

/* 상태창 */
._info {display:inline-block; position:absolute; top:50%; right:0; height:17px; line-height:17px; transform:translate(0,-50%); font-size:.9em; font-weight:500; color:#777;}
._info > div {position:relative; display:inline-block; margin-right:12px;}
.like {padding-left:18px; background:url('/home/images/board')no-repeat 0 -52px;}
.count {padding-left:18px; background:url('/home/images/board')no-repeat 0 -117px; font-weight: 500; margin-left:10px;}
.count .count-icon {display: inline-block; width: 15px; height: 17px; vertical-align: bottom; background:url('/home/images/board')no-repeat 0 -117px;}
._info .view {padding-left:18px; background:url('/home/images/board')no-repeat 0 -156px;}
.see .view {background:none; padding: inherit; display: flex; align-items: center;}
.see .view i {margin-right: 3px; color: #555;}
.see .view span {font-weight: 300; color: #888;}
.score {padding-left:18px; background:url('/home/images/board.png')no-repeat 0 -224px; font-weight: 500}
.list-box .score {padding-left:0; /*background:url('/home/images/common/board.png')no-repeat 0 -224px;*/ font-weight: 500; color: #333;}

.new {position:relative; top:5px}
.list-box .new {position:relative; top:3px}
/* hover */
.like:hover {background:url('/home/images/board')no-repeat 0 -27px;} 
/*.count:hover {background:url('/home/images/common/board.png')no-repeat 0 -83px;}*/
/*.score:hover {background:url('/home/images/common/board.png')no-repeat 0 -225px;}*/


.qna_input {position:relative; width:100%; margin:0 auto; padding:0; background:#fff; border-radius:10px; }
.qna_input form {width:100%;}
.qna_input .select_ {position: relative; width: 140px; height:40px;	z-index:1}
.qna_input .select_ select { width: 140px; height:40px; padding-left:10px; border: 1px solid #ddd; background: #fff url('/home/images/casestudy/select-icons') no-repeat right -113px;}
.qna_input .aus_send {position:absolute; right:0; top:0;}
.qna_input .aus_send button {display:block; width:100px; height:40px; font-size:1em; font-weight:600; color:#fff; border:0; background:#5367a7; border-radius:3px}
.qna_input .qus_area {position:relative; width:100%; margin-top:5px}
.qna_input .qus_area > input {width: 100%; height:60px; line-height:normal;  padding:10px 15px; font-size:1.1em; color:#777; border: 1px solid #eee; background: #f7f7f7; overflow:hidden}


/* 핫키워드영역 */
.cm_hotkeyword {position:relative; width:100%; margin:0 auto; border:1px solid #dddddd; background:#fff; border-radius:8px; padding:25px 20px;}
.cm_hotkeyword .wrap ._title {font-size:1.15em; font-weight:600; padding-bottom:15px;}
.cm_hotkeyword .wrap ._title span {color:#5063c3; margin-right:5px;}
.cm_hotkeyword .wrap ._list {width:98%; font-size:.95em;}
.cm_hotkeyword .wrap ._list div {padding:8px 0; border-bottom:1px solid #eee; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.cm_hotkeyword .wrap ._list div img {vertical-align: middle; margin-left: 5px;}
.cm_hotkeyword .wrap ._list div:last-child {border-bottom:none;}
.cm_hotkeyword .wrap div span {/*font-size:1.2em;*/ color:#5063c3; margin-right:7px;}
.cm_hotkeyword .keyword_prev {position:absolute; top:33px; right:35px; transform:translateY(-50%) rotate(-45deg);width:10px; height:10px; border-top:2px solid #878787; border-left:2px solid #878787;}
.cm_hotkeyword .keyword_next {position:absolute; top:33px; right:20px; transform:translateY(-50%) rotate(135deg);width:10px; height:10px; border-top:2px solid #878787; border-left:2px solid #878787;}
.cm_hotkeyword .keyword_prev:hover {border-top:2px solid #333; border-left:2px solid #333;}
.cm_hotkeyword .keyword_next:hover {border-top:2px solid #333; border-left:2px solid #333;}

.sub_page .cm_hotkeyword {border: 1px solid rgba(0, 0, 0, .06);}

/* */
.cm_side_gallery {margin:30px 0 0;}
.cm_side_gallery .wrap {width:100%;}
.cm_side_gallery .wrap:after {content: ''; clear:both; display:block;}
.cm_side_gallery .wrap > div {float:left; width: 32.66%; height:102px; margin-right:1%; margin-bottom:1%; border-radius:5px; background:#fff; border:1px solid #ddd}
.cm_side_gallery .wrap > div:nth-child(3n) {margin-right:0 }
.cm_side_gallery .wrap > div a {position:relative; display:block; width:100%; height:100%; background-size:contain}
.cm_side_gallery .wrap > div a > figure {height:100%}
.cm_side_gallery .wrap > div a .cover-hover { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(255,255,255,.95); visibility: hidden; opacity: 0; -webkit-transition: .3s all ease; -o-transition: .3s all ease; transition: .3s all ease; }
.cm_side_gallery .wrap > div a .cover-hover .cover-hover-inner {position:relative; left: 50%; top:50%; transform: translate(-50%, -50%)}
.cm_side_gallery .wrap > div a .cover-hover .project-hover-inner { position: absolute; width:100%; z-index: 99; left: 50%; top: 50%; visibility: hidden; opacity: 0; -webkit-transition: .3s all ease; -o-transition: .3s all ease; transition: .3s all ease; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); transition: .3s all ease; text-align: center; padding:0 30px;}
.cm_side_gallery .wrap > div a:hover .cover-hover, 
.cm_side_gallery .wrap > div a:focus .cover-hover {visibility: visible; opacity: 1; }
.cm_side_gallery .wrap > div a:hover .cover-hover .cover-hover-inner, 
.cm_side_gallery .wrap > div a:focus .cover-hover .cover-hover-inner { visibility: visible; opacity: 1; -webkit-animation-delay: 10s; animation-delay: 10s; }
.cm_side_gallery .wrap > div a:hover .cover-hover .cover-hover-inner p, 
.cm_side_gallery .wrap > div a:focus .cover-hover .cover-hover-inner p { opacity: 1; visibility: visible; bottom: 0px; }
.cm_side_gallery .wrap > div a:hover .cover-hover .cover-hover-inner span, 
.cm_side_gallery .wrap > div a:focus .cover-hover .cover-hover-inner span { bottom: 0; visibility: visible; opacity: 1; }


.cm_side_banner {width:100%; height:auto; margin:20px auto 0;}
.cm_side_banner .side_banner {}
.cm_side_banner .side_banner .banner_img01 {max-width:1280px; height:0; margin:0 auto; padding-bottom:calc(120/1280*100%); border-radius:8px; background:url('/home/images/banner/banner_m_img01')no-repeat center center/contain;}
.cm_side_banner .side_banner .banner_img02 {max-width:1280px; height:0; margin:0 auto; padding-bottom:calc(120/1280*100%); border-radius:8px; background:url('/home/images/banner/banner_m_img02')no-repeat center center/contain;}

/* no-page */
.no-page {position:relative; width:100%; height:100vh; margin:0 auto;}
.no-page .notpermission {height:100%; background:url('/home/images/form/notpermission')no-repeat center center; background-size:contain;}
.no-page .error404 {height:100%; background:url('/home/images/form/404error')no-repeat center center; background-size:contain;}
.no-page .back_home {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:80%; height:65%; z-index:2;}
.no-page .back_home a {display:block; width:100%; height:100%;}



@media screen and (min-width: 640px) {
	nav.top_menu .m_right_menu .logout_ {display: block;}

	.cm_side_gallery .wrap > div {width: 15%; height:90px; margin-right:2%; margin-bottom:9px; background:#f7f7f7;}
	.cm_side_gallery .wrap > div:nth-child(3n) {margin-right:2%}
	.cm_side_gallery .wrap > div:last-child {margin-right:inherit }

	.no-page .notpermission {width:80%; margin:0 auto;}
	.no-page .error404 {width:80%; margin:0 auto;}
}


@media screen and (min-width: 960px) {
	.header {display: block;  border-bottom: 1px solid rgba(0, 0, 0, .06);}
	.header.mypage {display: block;}
	.header .logo {display: block; width: 140px;}
	.mypage .logo {display: block; left: 70px; top: 52%; width: 140px;}
	.mypage nav.home {background: #fff;}
	.header.sub_page {display: block; /*border-bottom: 1px solid rgba(0, 0, 0, .06);*/}
	.mypage nav.top_menu .m_right_menu > div:last-child {margin-left: 22px;}

	/* .container .inner {width:960px; margin:0 auto;}	 */
	
	nav.top_menu {width: 960px; padding: 0; height: 50px;}
	nav.top_menu h4 {font-size: 1.23em;}
	nav.top_menu .m_logo {left: 0;}
	nav.top_menu .m_right_menu {}

	nav.sub_page {box-shadow: none;}

	.write_page nav.top_menu {width: 100%;}
	.write_page nav.top_menu .m_back_menu {left: 30px;}

	.page_top .m_right_menu > div.rightmenu {align-items: center;}

	nav.top_menu .m_right_menu .logout_ a {background: url('/home/images/mypage/icon_menubar') no-repeat -1px -568px; width: 22px; height: 22px;}


	

	/* .container {padding-top: 50px;} */
	
	/*1214김다영 - pc 헤더 메뉴 호버했을 때 글자 돌아가게하는 부분*/
	header .blind > li > a {display:block; height:20px; line-height:20px; font-size:1em; text-align: center; position: relative; top: 50%; transform: translateY(-50%); overflow: hidden; transition: transform .5s;}
	header .blind > li > a > span {display:inline-block; height:75px; transform: translateY(0%); transition: inherit;} 
	header .blind > li > a::after {content: attr(data-after); display: inline-block; transform: translateY(100%); position: absolute; left: 0; transition: inherit; color:#345296;}

	header .blind > li > a:hover > span {display:inline-block; height:75px; transform: translateY(-100%);}
	header .blind > li > a:hover::after {transform: translateY(0%);}
	header .blind > li > a:hover, .gnb > li > a:focus { outline: none;}

	.arrow_box {
  display: none;
  position: absolute;
  min-width:60px;
		width:auto;
  padding:0 8px !important;
  left: 50%;
	top:40px;
		height:30px;
		line-height: 30px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  background:#28aae1;
  color: #fff;
  font-size:.9em;
		text-align: center;
		font-weight: 200;
		transform: translate(-40%,0)
}

.arrow_box:after {
  position: absolute;
  bottom: 100%;
  left: 50%;
  width: 0;
  height: 0;
  margin-left: -10px;
	margin-bottom:-1px;
  border: solid transparent;
  border-color: rgba(51, 51, 51, 0);
  border-bottom-color:#28aae1;
  border-width: 6px;
  pointer-events: none;
  content: ' ';
}

header .blind > li > a:hover + div.arrow_box {
  display: block;
}
.m_right_menu .skip_log a:hover + div.arrow_box, .m_right_menu .search_ a:hover + div.arrow_box  {
	display: block;}
	
	
	nav.top_menu .m_right_menu > div {margin-left: 10px;}
	nav.top_menu .m_right_menu > div:last-child {margin-left: 10px;}
	
	header .m_right_menu .skip_log {display: block; position: relative; width: 35px; height: 35px;}
	header .m_right_menu .skip_log:hover {background: #f5f5f5; border-radius: 50px;}
	header .m_right_menu .skip_log a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar') no-repeat 0 -710px; width: 22px; height: 22px;}
	
	header .m_right_menu > div {align-items: baseline;}
	header .m_right_menu > div.rightmenu {align-items: center;}

	header .m_right_menu {display: flex; align-items: center; position: absolute; top: 50%; right: 10px; transform: translateY(-50%); flex-direction: row-reverse; align-items: center; /*left menu 디스플레이 none 아닐때 position 지우기*/}
	header .m_right_menu .alarm_ {position: relative; width: 35px; height: 35px;}
	header .m_right_menu .alarm_:hover {background: #f5f5f5; border-radius: 50px; }
	header .m_right_menu .alarm_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar2') no-repeat 0 -390px; width: 18px; height: 22px;}
	header .m_right_menu .alarm_ .alarm02 {position: absolute; display: block; width: 5px; height: 5px; border-radius: 50px; background: red; top: -2px; right: -2px;}
	header .m_right_menu .setting_ {display: block; position: relative; width: 35px; height: 35px; margin-left: 2px;}
	header .m_right_menu .setting_:hover {background: #f5f5f5; border-radius: 50px; }
	header .m_right_menu .setting_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar2') no-repeat 0 -428px; width: 22px; height: 22px;}

	header .m_right_menu .search_ {position: relative; width: 35px; height: 35px;}
	header .m_right_menu .search_:hover {background: #f5f5f5; border-radius: 50px; }
	header .m_right_menu .search_ a {display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar2') no-repeat -1px -743px; width: 20px; height: 20px;}

	header .m_right_menu .logout_ {position: relative; width: 35px; height: 35px; margin-left: 10px;}
	header .m_right_menu .logout_:hover {background: #f5f5f5; border-radius: 50px; }
	header .m_right_menu .logout_ a {display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar2') no-repeat -1px -569px; width: 20px; height: 20px;}

	
	nav.top_menu .m_right_menu .alarm_ { width: 35px; height: 35px;}
	nav.top_menu .m_right_menu .alarm:hover {background: #f5f5f5; border-radius: 50px; }
	nav.top_menu .m_right_menu .alarm_ a {background: url('/home/images/mypage/icon_menubar2') no-repeat 0 -390px; width: 18px; height: 22px;}
	nav.top_menu .m_right_menu .setting_ {display: block; position: relative; width: 35px; height: 35px; margin-left: 2px;}
	nav.top_menu .m_right_menu .setting:hover {background: #f5f5f5; border-radius: 50px; }
	nav.top_menu .m_right_menu .setting_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar2') no-repeat 0 -428px; width: 22px; height: 22px;}
	nav.top_menu .m_right_menu .search_ {width: 35px; height: 35px;}
	nav.top_menu .m_right_menu .search_:hover {background: #f5f5f5; border-radius: 50px; }
	nav.top_menu .m_right_menu .search_ .search_btn {background: url('/home/images/mypage/icon_menubar2') no-repeat -1px -743px; width: 20px; height: 20px;}

		
	
	/*pc 헤더 sssssssssssss*/	
	.page_top .m_right_menu {display: none; align-items: center; position: absolute; top: 50%; right: -7px; transform: translateY(-50%); /*left menu 디스플레이 none 아닐때 position 지우기*/ z-index: 3}

	.page_top .m_right_menu > div {align-items: baseline;}	

	.page_top .m_right_menu {display: none; align-items: center; position: absolute; top: 50%; transform: translateY(-50%); /*left menu 디스플레이 none 아닐때 position 지우기*/}
	.page_top .m_right_menu .alarm_ {position: relative; width: 35px; height: 35px;}
	.page_top .m_right_menu .alarm_:hover {background: #f5f5f5; border-radius: 50px; }
	.page_top .m_right_menu .alarm_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar2') no-repeat 0 -390px; width: 18px; height: 22px;}
	.page_top .m_right_menu .setting_ {display: block; position: relative; width: 35px; height: 35px; margin-left: 2px;}
	.page_top .m_right_menu .setting_:hover {background: #f5f5f5; border-radius: 50px; }
	.page_top .m_right_menu .setting_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar2') no-repeat 0 -428px; width: 22px; height: 22px;}

	.page_top .m_right_menu .search_ {position: relative; width: 35px; height: 35px;}
	.page_top .m_right_menu .search_:hover {background: #f5f5f5; border-radius: 50px; }
	.page_top .m_right_menu .search_ a {display: block; cursor: pointer; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar2') no-repeat -1px -743px; width: 20px; height: 20px; border: none;}

	
	.page_top .m_right_menu .logout_ {position: relative; width: 35px; height: 35px; margin-left: 10px;}
	.page_top .m_right_menu .logout_:hover {background: #f5f5f5; border-radius: 50px; }
	.page_top .m_right_menu .logout_ a {display: block; cursor: pointer; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar2') no-repeat -1px -568px; width: 22px; height: 22px; border: none;}


	
	/*햄버거 메뉴*/

	.m_menu {width: 30%; transform: translateX(-2000px);}

	/*마이페이지 pc 헤더*/
	.mypage nav.top_menu {height: 70px; width: 960px; justify-content: space-between; border-bottom: 1px solid rgba(0, 0, 0, .06);}
  .mypage nav.sub_page {box-shadow: none;}
 
	.mypage nav.top_menu .m_right_menu {display: flex; align-items: center; position: absolute; top: 50%; right: -7px; transform: translateY(-50%); /*left menu 디스플레이 none 아닐때 position 지우기*/}

	.mypage nav.top_menu .m_right_menu .img_ {display: none;}

	.mypage nav.top_menu .m_right_menu .alarm_ {position: relative; width: 35px; height: 35px; margin-left: 0;}
	.mypage nav.top_menu .m_right_menu .alarm_:hover {background: #f5f5f5; border-radius: 50px;}
	/*알람 왔을때 표시*/
	.mypage nav.top_menu .m_right_menu .alarm_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar2') no-repeat 0 -390px; width: 18px; height: 22px;}
	.mypage nav.top_menu .m_right_menu .alarm_ .alarm02 {position: absolute; display: block; width: 5px; height: 5px; border-radius: 50px; background: red; top: -2px; right: -2px;}
	
	.mypage nav.top_menu .m_right_menu .setting_ {display: block; position: relative; width: 35px; height: 35px; margin-left: 2px;}
	.mypage nav.top_menu .m_right_menu .setting_:hover {background: #f5f5f5; border-radius: 50px;}
	.mypage nav.top_menu .m_right_menu .setting_ a {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; background: url('/home/images/mypage/icon_menubar2') no-repeat 0 -428px; width: 22px; height: 22px;}
	
	.mypage nav.top_menu .m_right_menu .search_ a {background: url('/home/images/mypage/icon_menubar2') no-repeat -1px -743px; width: 20px; height: 20px;}

	.mypage nav.top_menu .m_logo {display: block;}
  .mypage nav.top_menu .m_left_home {display: flex; align-items: center;}
  .mypage nav.top_menu .m_right_menu > div {align-items: baseline;}
	.mypage nav.top_menu .m_right_menu > div:last-child {margin-left: 10px; align-items: center;}
	
	.container > .inner {}	
	
	/* 핫키워드영역 */
	.cm_hotkeyword {/*padding:35px;*/}
	.cm_hotkeyword .keyword_list .keyword_title {font-size:1.2em; padding-bottom:20px;}
	.cm_hotkeyword .keyword_list div {height:45px; line-height:45px; padding:0; /*font-size:1.1em; padding:15px 0;*/}
	/*.cm_hotkeyword .keyword_list div:last-child {padding:15px 0;}*/
	.cm_hotkeyword .keyword_list div span {/*font-size:1.4em;*/ margin-right:12px;}
	.cm_hotkeyword .keyword_prev {top:67px; right:70px; width:12px; height:12px;}
	.cm_hotkeyword .keyword_next {top:67px; right:45px; width:12px; height:12px;}

	.cm_side_gallery .wrap > div {height:110px;}
	
	.fas.fa-chevron-down {display: none;}

	.st_1 {padding-top: 0;} /*0105김다영*/

	.no-page .notpermission {width:50%;}
	.no-page .error404 {width:50%;}

}

@media screen and (min-width: 1080px) {
	nav.top_menu {width: 1080px;}
	
	.container > .inner .contents {width:100%; margin:0 auto 50px}
	.column-left-main {width:70%;}
	.column-right-main {width:30%; padding:0 15px; }

	.page_name {margin:80px auto 0;}
}

@media screen and (min-width: 1200px) {
	nav.top_menu {width: 1200px; padding: 0; height: 50px;}
	.mypage nav.top_menu {width: 1200px;}
	.write_page nav.top_menu {width: 100%;}
	.write_page nav.top_menu .m_back_menu {left: 50px;}

	.container > .inner {width:1200px; margin:0 auto;}	
}

@media screen and (min-width: 1280px) {	
	
	.mainhdbox.login {display: none}/*로그인페이지 카테고리 헤더 삭제*/
	.mainmenu03 {display:none;}

	header {display:block;} /*pc*/
	.header {display: none; height: 75px; border-bottom: 1px solid rgba(0, 0, 0, .06);} /*모바일*/
	
	header .logo {padding-left:0;}
	.page_top {height: 70px;}
	.page_top ._box {display: block; width: 1200px; height:70px; margin: 0 auto}
	.lnb_search {margin-top:0; margin-left:-450px;}
	.page_top .m_right_menu {display: flex;}
	
	.page_name {width: 100%;} 
	
	.inner .board {display: flex; justify-content: center;}
	.column-center {width:100%;}
	.column-left {width:880px;}
	.column-right {width:calc(100% - 880px); padding-top:50px; padding-left:50px; background:none}
	
	/* 메인 사이즈*/
	.column-left-main {width:840px;}
	.column-right-main {width:calc(100% - 840px); padding-left:55px; }
	.column-left div.view {width:100%}
	.fix_wrap {width:100%; margin:0; padding:0}
	
	
	.qna_input {width:100%; padding:0;}
	.qna_input:after {display:block; content:''; clear: both}
	.qna_input .select_ {float:left; height:50px}
	.qna_input .select_ select {height:50px; background: #fff url('/home/images/casestudy/select-icons') no-repeat right -107px;}
	.qna_input .aus_send {right:0; top:0;}
	.qna_input .aus_send button {height:50px;}
	.qna_input .qus_area {float:left; width:calc(100% - 240px); margin-top:0}
	.qna_input .qus_area > input {height:50px; line-height:normal; padding:15px; background: #fff}
	.qna_window:before {height:160px;}
	
	#lnb {padding-right: 0;}
	#lnb > ul {width:1200px;}
	

	/* 핫키워드영역 */
	.cm_hotkeyword {/*width:100%; padding:25px 20px;*/ padding:20px 20px 15px 20px;}
	.cm_hotkeyword .keyword_list div {font-size:1em;}
	.cm_hotkeyword .keyword_list .keyword_title {padding-bottom:5px;}
	.cm_hotkeyword .keyword_prev {top:53px; right:50px;}
	.cm_hotkeyword .keyword_next {top:53px; right:30px;}
	
	.cm_side_gallery .wrap {display:block; width:100%; padding:0; border:none; border-radius:none; background:none}
	.cm_side_gallery .wrap > div {width:88px; height:88px; margin-right:3px; margin-bottom:3px}
	.cm_side_gallery .wrap > div:first-child {width:179px; height:179px; }
	.cm_side_gallery .wrap > div:nth-child(2), .cm_side_gallery .wrap > div:nth-child(3) {margin-right:0;}
	
	.cm_side_banner .side_banner {width:100%; margin:30px auto 0;}
  .cm_side_banner .side_banner .banner_img01 {width:100%; height:500px; background:url('/home/images/banner/banner_img01')no-repeat center center/cover;}
  .cm_side_banner .side_banner .banner_img02 {width:100%; height:500px; background:url('/home/images/banner/banner_img02')no-repeat center center/cover;}

	.no-page .notpermission {width:35%;}
	.no-page .error404 {width:35%;}

	/*  member_inner */
	.container > .member_inner {width:1200px; margin:150px auto 0;}
	
}



/* 하단영역 */
footer {position:relative; width: 100%; margin: 0 auto; padding:25px; -webkit-box-sizing: border-box; box-sizing: border-box; background:#333;}
footer .inner {position:relative; width:100%; height:auto; margin:0 auto;}
footer .inner .logo {color:#fff;}
footer .inner .util {padding:10px 0; border-bottom:1px solid #555;}
footer .inner .util a {display:inline-block; margin-right:30px; font-size:.78em; font-weight:100; color:#bbb;}
footer .inner .info {padding:10px 0; font-size:.78em; font-weight:100; color:#bbb;}
footer .inner .info p {display:inline-block; margin-right:30px; }
footer .inner .info address {font-style:normal;}
footer .inner .copyright {font-size:.95em; font-weight:200; color:#777;}

@media screen and (min-width: 1280px) {
	footer .inner {width:1200px; margin:0 auto;}

	.m_menu {display: none;}
	.page_top .logo {display: block;}
	.page_top .m_right_menu {display: flex; flex-direction: row-reverse; align-items: center;}
}


/* 팝업 애니메이션 추가 2023.09.19 */

@keyframes popupAnimation {
  from { height:0; }
}

.popupAnimation { height:0;animation-name:popupAnimation;animation-duration:2s;animation-fill-mode:forwards; }