@charset "utf-8"; /* 리포트 페이지 공통 스타일 */ *,*:after,*:before { box-sizing: border-box; } html { text-shadow: 1px 1px 1px rgba(0,0,0,0.004); min-width: 1500px; font-size: 62.5%; } html, body { width:100%; height:100%; background: #fff; color: #2b3245; } body { font-family: 'Noto Sans KR','Sans-serif'; font-size: 1.4rem; letter-spacing: 0.1px; background-color: #fff; text-rendering: auto; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } a { text-decoration:none; color: #2b3245; } ::selection {background:#1652f0; color:#FFF; text-shadow:none; } ::-moz-selection {background:#1652f0; color:#FFF; text-shadow:none; } ::-webkit-selection {background:#1652f0; color:#FFF; text-shadow:none; } /*폼 요소*/ input, textarea,option, button { font-family: 'Noto Sans KR','Sans-serif'; font-size: 1.3rem; letter-spacing: -0.5px; } input[type=text],input[type=password],textarea { -webkit-appearance: none; -moz-appearance: none; appearance: none; outline: 0; } select { font-family: 'Nanum Square','Sans-serif'; font-size: 1.3rem; letter-spacing: -1px; width: 150px; height: 30px; padding-left: 5px; padding-right: 5px; } input::-ms-input-placeholder { color: #ccc; } input::-webkit-input-placeholder { color: #ccc; } input::-moz-placeholder { color: #ccc; } /*숨김처리*/ .blind { position:absolute; font-size:0; line-height:0; height:0; } /*테스트*/ .testBorder { border:1px solid red !important; } .testBg { background-color:yellow !important; } /*클리어픽스*/ .clearfix:after { display: block; clear: both; height: 0; content: ''; } /* 헤더 */ #header_container { height: 180px; background: #fff; position: fixed; z-index: 10; left: 0; top: 0; width: 100%; min-width: 1500px; box-shadow: 0 2px 5px 0 rgba(0,0,0,0.1); } /* 헤더 */ #header_container .header .ipoffice-logo { position: absolute; left: 30px; top: 30px; } #header_container .header .ipoffice-logo a { display: block; } #header_container .header .ipoffice-logo a img { height: 22px; } #header_container .header { position: relative; height: 100%; position: relative; overflow: hidden; } #header_container .header>.grade { position: absolute; top: -7px; right: 30px; color: rgba(25,41,142,0.2) ; font-size: 15rem; font-weight: 900; cursor: default; z-index: 1; line-height: 80px; } #header_container .logo-area { position: absolute; left: 30px; top: 0; } #header_container .logo-area h1 { width: 90px; height: 80px; display: inline-block; vertical-align: top; } #header_container .logo-area h1 a { width: 100%; height: 100%; display: block; padding: 0 5px; } #header_container .logo-area h1 a img { width: 100%; height: 100%; } #header_container .logo-area h2 { display: inline-block; margin-left: 10px; color: #1a2465; font-size: 1.8rem; cursor: default; letter-spacing: 0; padding: 25px 0; font-weight: 900; } #header_container .logo-area h2 a { color: #fff; letter-spacing: 0; font-size: 1.7rem; margin-left: 5px; cursor: pointer; } #header_container .logo-area h2 a:hover { text-decoration: underline; } #header_container .logo-area h2 .set { margin: 0 5px; display: inline-block; vertical-align: top; font-size: 1rem; font-weight: 300; background: #1D25A0; padding: 5px 3px; border-radius: 3px; color: #fff; margin-top: 3px; font-family: 'Arial'; } #header_container .logo-area h2 span { margin: 0 5px; } #header_container .logo-area h2 span.grade.grade-13 { color: #FFAE00; } #header_container .logo-area h2 span.grade.grade-12 { color: #E81717; } #header_container .logo-area h2 span.grade.grade-11 { color: #E81717; } #header_container .logo-area h2 span.grade.grade-10 { color: #E81717; } #header_container .logo-area h2 span.grade.grade-09 { color: #186DCC; } #header_container .logo-area h2 span.grade.grade-08 { color: #186DCC; } #header_container .logo-area h2 span.grade.grade-07 { color: #186DCC; } #header_container .logo-area h2 span.grade.grade-06 { color: #59BFEF; } #header_container .logo-area h2 span.grade.grade-05 { color: #59BFEF; } #header_container .logo-area h2 span.grade.grade-04 { color: #59BFEF; } #header_container .logo-area h2 span.grade.grade-03 { color: #3fa449; } #header_container .logo-area h2 span.grade.grade-02 { color: #3fa449; } #header_container .logo-area h2 span.grade.grade-01 { color: #3fa449; } #header_container .logo-area h2 .set span.locale { cursor: pointer; } #header_container .logo-area h2 .set span.locale:hover { text-decoration: underline; } #header_container .gnb-area { width: 100%; margin: 0 auto; height: 50px; position: absolute; left: 0; bottom: 50px; z-index: 2; background: rgba(0, 18, 130, 0.9); } #header_container .gnb-area .gnb-l { height: 100%; display: inline-block; float: left; } #header_container .gnb-area .gnb-l>nav { height: 100%; padding: 0 30px; } #header_container .gnb-area .gnb-l>nav>ul { height: 100%; } #header_container .gnb-area .gnb-l>nav>ul>li { display: inline-block; height: 100%; margin: 0 10px; } #header_container .gnb-area .gnb-l>nav>ul>li:first-child { margin-left: 0; } #header_container .gnb-area .gnb-l>nav>ul>li:last-child { margin-right: 0; } #header_container .gnb-area .gnb-l>nav>ul>li>a { font-size: 1.4rem; line-height: 50px; color: rgba(255,255,255,0.60); height: 100%; display: block; position: relative; transition: color .25s ease; padding: 0 10px; } #header_container .gnb-area .gnb-l>nav>ul>li>a:hover, #header_container .gnb-area .gnb-l>nav>ul>li.select>a { color: rgba(255,255,255,1); } #header_container .gnb-area .gnb-l>nav>ul>li.select>a:after { position: absolute; content: ''; width: 100%; height: 3px; background: #fff; left: 0; bottom: 0; } #header_container .gnb-area .gnb-r { float: right; height: 100%; padding: 6px 30px; } #header_container .gnb-area .gnb-r ul { float: left; } #header_container .gnb-area .gnb-r ul li { display: inline-block; margin-right: 20px; position: relative; float: left; } #header_container .gnb-area .gnb-r ul li:after { position: absolute; content: ''; height: 10px; width: 1px; background: rgba(255,255,255,0.5); right: -10px; top: 50%; margin-top: -4px; } #header_container .gnb-area .gnb-r ul li a { font-size: 1.2rem; line-height: 36px; color: #fff; } #header_container .gnb-area .gnb-r .search-box { float: right; width: 250px; height: 38px; border-radius: 4px; background: rgba(255,255,255,0.10); position: relative; cursor: pointer; transition: background .25s ease; } #header_container .gnb-area .gnb-r .search-box:hover, #header_container .gnb-area .gnb-r .search-box:active, #header_container .gnb-area .gnb-r .search-box:focus { background: rgba(255,255,255,0.20); } #header_container .gnb-area .gnb-r .search-box .search-btn { width: 18px; height: 18px; position: absolute; top: 50%; right: 8px; border: none; background: none; outline: 0; margin-top: -9px; } #header_container .gnb-area .gnb-r .search-box input[type=text] { background: transparent; border: none; width: 100%; height: 100%; color: #fff; font-size: 1.2rem; letter-spacing: 0; padding: 0 45px 0 15px; cursor: pointer; } #header_container .gnb-area .gnb-r .search-box input[type=text]::-ms-input-placeholder { color: rgba(255,255,255,0.50); } #header_container .gnb-area .gnb-r .search-box input[type=text]::-webkit-input-placeholder { color: rgba(255,255,255,0.50); } #header_container .gnb-area .gnb-r .search-box input[type=text]::-moz-placeholder { color: rgba(255,255,255,0.50); } #header_container .gnb-area .gnb-r ul li.lang:after { display: none; } #header_container .gnb-area .gnb-r ul li.lang a img { display: inline-block; width: 15px; height: 15px; margin: 10px 0; } #header_container .gnb-area .gnb-r ul li.lang a .label { font-size: 1.1rem; background: #fff; color: #414347; border-radius: 3px; padding: 0 8px; display: inline-block; height: 18px; line-height: 18px; text-align: center; font-family: 'Arial'; font-weight: bold; letter-spacing: -1px; margin-right: 5px; } #header_container .gnb-area .gnb-r ul li.lang a .txt { font-family: 'Arial'; letter-spacing: 0; font-size: 1.2rem; margin-right: 2px; } #header_container .gnb-area .gnb-r ul li:after { display: none; } #header_container .gnb-area .gnb-r ul li.data-lang .data-lang-select .selectbox { width: 90px; height: 30px; line-height: 28px; margin-left: 0; } #header_container .gnb-area .gnb-r ul li.data-lang .data-lang-select .selectbox:hover { background: transparent; } #header_container .gnb-area .gnb-r ul li.data-lang .data-lang-select .selectbox label { line-height: 28px; font-family: 'Arial'; color: #fff; } #header_container .gnb-area .gnb-r ul li.data-lang .data-lang-select .selectbox select { height: 28px; vertical-align: top; font-size: 1.2rem; } #header_container .gnb-area .gnb-r ul li.data-lang .data-lang-select .selectbox:before { content: ""; position: absolute; top: 50%; margin-top: -8px; right: 8px; background: url("../../img/svg/down_ico.svg") no-repeat; width: 15px; height: 15px; opacity: 1; } #header_container .gnb-area .gnb-r ul li .title { color: rgba(255,255,255,0.5); line-height: 35px; display: inline-block; font-size: 1.2rem; margin-right: 10px; font-weight: 300; } #header_container .gnb-area .gnb-r ul li.data-lang .data-lang-select { } #header_container .bookmark-btn { display: inline-block; padding: 5px 10px 5px 5px; border-radius: 4px; transition: background .25s ease; background: rgba(0,0,0,0.2); float: left; margin-right: 20px; margin-top: 4px;} #header_container .bookmark-btn:hover { background: rgba(0,0,0,0.4); } #header_container .bookmark-btn .title { margin-left: 1px; color: #fff; font-size: 1.2rem; font-weight: 300; line-height: 19px; vertical-align: top; } #header_container .bookmark-btn .star { display: inline-block; width: 20px; height: 20px; vertical-align: top; } #header_container .bookmark-btn .star img { width: 100%; } #header_container .powered { position: absolute; z-index: 2; right: 30px; top: 50px; font-size: 1.2rem;font-weight: 300; cursor: default; color: #555; line-height: 26px; height: 30px; } #header_container .powered a { display: inline-block; margin-left: 8px; vertical-align: top; cursor: pointer; color: #1652f0; font-weight: 900; font-size: 1.3rem; line-height: 26px; } #header_container .powered a img { margin-top: 6px; margin-right: 3px; } #header_container .powered a:hover { text-decoration: underline; } #header_container .report-gnb-wrap { height: 50px; background: #fff; border-bottom: 1px solid #dee3eb; position: absolute; bottom: -50px; left: 0; width: 100%; } #header_container .report-gnb-wrap .report-gnb { height: 100%; padding: 0 30px; overflow: hidden; position: relative; } #header_container .report-gnb-wrap .report-gnb:after { position: absolute; width: 70px; height: 100%; top: 0; right: 30px; content: ''; z-index: 2; background: -webkit-gradient(linear, left top, right top, color-stop(0, rgba(255,255,255,0)), color-stop(1, #ffffff)); background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, #ffffff 100%); background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, #ffffff 100%); background: -o-linear-gradient(left, rgba(255,255,255,0) 0%, #ffffff 100%); background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%, #ffffff 100%); background: linear-gradient(left, rgba(255,255,255,0) 0%, #ffffff 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='rgba(255,255,255,0)', endColorstr='#ffffff', gradientType=1); } #header_container .report-gnb-wrap .report-gnb ul { height: 100%; overflow-x: auto; white-space: nowrap; -ms-overflow-style: none; height: 90px; cursor: pointer; } #header_container .report-gnb-wrap .report-gnb ul.hide { display:none; } #header_container .report-gnb-wrap .report-gnb ul li { display: inline-block; margin: 0 10px; height: 50px; } #header_container .report-gnb-wrap .report-gnb ul li:first-child { margin-left: 0; } #header_container .report-gnb-wrap .report-gnb ul li:last-child { margin-right: 0; } #header_container .report-gnb-wrap .report-gnb ul li a { font-size: 1.4rem; display: block; height: 100%; line-height: 50px; font-weight: normal; color: #999; position: relative; padding: 0 10px; } #header_container .report-gnb-wrap .report-gnb ul li.select a { color: #1652F0; font-weight: bold; } .enterprise #header_container .report-gnb-wrap .report-gnb ul li.select a { color: #262932; } .technology #header_container .report-gnb-wrap .report-gnb ul li.select a { color: #1D25A0; } .agent #header_container .report-gnb-wrap .report-gnb ul li.select a { color: #360E68; } .researcher #header_container .report-gnb-wrap .report-gnb ul li.select a { color: #00515B; } #header_container .report-gnb-wrap .report-gnb ul li.select a:after { position: absolute; content: ''; width: 100%; height: 2px; bottom: 1px; left: 0; background: #1652F0; } .enterprise #header_container .report-gnb-wrap .report-gnb ul li.select a:after { background: #262932; } .technology #header_container .report-gnb-wrap .report-gnb ul li.select a:after { background: #1D25A0; } .agent #header_container .report-gnb-wrap .report-gnb ul li.select a:after { background: #360E68; } .researcher #header_container .report-gnb-wrap .report-gnb ul li.select a:after { background: #00515B; } #header_container .report-gnb-wrap .report-gnb ul li a .ico { display: inline-block; } #header_container .gnb-area .gnb-l>nav>ul>li .report-gnb-wrap { display: none; } #header_container .gnb-area .gnb-l>nav>ul>li .report-gnb-wrap:hover { display: block; z-index: 2; } #header_container .gnb-area .gnb-l>nav>ul>li.select .report-gnb-wrap { display: block; z-index: 1; } #header_container .gnb-area .gnb-l>nav>ul>li>a:hover + .report-gnb-wrap { display: block; z-index: 2; } #header_container .report-gnb-wrap .report-gnb .navi-btn { position: absolute; z-index: 3; top: 13px; background: #505357; border: none; height: 25px; width: 16px; border-radius: 4px; outline: 0; transition: background .25s ease,box-shadow .25s ease; } #header_container .report-gnb-wrap .report-gnb .navi-btn:hover { background: #5E6166; box-shadow: 0 2px 4px 3px rgba(0,0,0,0.1); } #header_container .report-gnb-wrap .report-gnb .navi-btn.left { left: 10px; } #header_container .report-gnb-wrap .report-gnb .navi-btn.right { right: 10px; } #header_container .report-gnb-wrap .report-gnb .navi-btn img { margin-top: 1px; } #header_container .report-gnb-wrap .report-gnb .navi-btn:disabled { opacity: 0.2; cursor: not-allowed; } #info_container { background: #f2f2f7; } #info_container .report-content-area { padding: 195px 30px; min-width: 1500px; margin: 0 auto; } #info_container .report-content-area .report-content { max-width: 1900px; margin: 0 auto; } #info_container .report-content-area .report-content .browsing-area { position: relative; border: 1px solid #dee3eb; margin-bottom: 30px; } #info_container .report-content-area .report-content .browsing-area .header { background: #fff; height: 40px; padding: 0 15px; transition: height .25s ease; border-bottom: 1px solid #dee3eb; } #info_container .report-content-area .report-content .browsing-area .header .type-select { display: inline-block; float: left; height: 100%; } #info_container .report-content-area .report-content .browsing-area .header .search-box { display: inline-block; float: left; } #info_container .report-content-area .report-content .browsing-area .header .type-select a { display: inline-block; height: 100%; font-size: 1.2rem; color: #999; line-height: 38px; padding: 0 10px; position: relative; } #info_container .report-content-area .report-content .browsing-area .header .type-select a.select { font-weight: bold; color: #1652f0; } #info_container .report-content-area .report-content .browsing-area .header .type-select a.select:after { position: absolute; content: ''; left: 0; bottom: 0; left: 0; width: 100%; height: 2px; background: #1652f0; } #info_container .report-content-area .report-content .browsing-area .header .search-box { height: 35px; background: #f8f8f8; position: relative; border-radius: 3px; width: 250px; margin-top: 7px; margin-left: 20px; cursor: pointer; transition: box-shadow .25s ease; transition: width .25s ease; } #info_container .report-content-area .report-content .browsing-area .header .search-box input[type=text] { width: 100%; height: 100%; border: none; background: transparent; outline: 0; padding-left: 10px; letter-spacing: 0; cursor: pointer; border-radius: 3px; } #info_container .report-content-area .report-content .browsing-area .header .search-box input[type=text]:hover, #info_container .report-content-area .report-content .browsing-area .header .search-box input[type=text]:active, #info_container .report-content-area .report-content .browsing-area .header .search-box input[type=text]:focus { box-shadow: 1px 1px 5px 0 rgba(0,0,0,0.1) inset; } #info_container .report-content-area .report-content .browsing-area .header .search-box .search-btn { position: absolute; top: 50%; margin-top: -10px; right: 10px; width: 20px; height: 20px; border: none; background: none; outline: 0; } #info_container .report-content-area .report-content .browsing-area .header .array-btn-wrap { float: right; } #info_container .report-content-area .report-content .browsing-area .header .array-btn-wrap a { font-size: 1.2rem; height: 100%; display: inline-block; line-height: 38px; opacity: .4; font-weight: 500; margin-right: 10px; transition: opacity .25s ease; padding-right: 18px; background: url(/web/img/svg/up_down_normal_ico.svg) no-repeat; background-position: right center; background-size: 15px 15px; } #info_container .report-content-area .report-content .browsing-area .header .array-btn-wrap a.up { background: url(/web/img/svg/up_down_up_ico.svg) no-repeat; background-position: right center; background-size: 15px 15px; } #info_container .report-content-area .report-content .browsing-area .header .array-btn-wrap a.down { background: url(/web/img/svg/up_down_down_ico.svg) no-repeat; background-position: right center; background-size: 15px 15px; } #info_container .report-content-area .report-content .browsing-area .header .array-btn-wrap a.reset { background: url(/web/img/svg/reset_ico.svg) no-repeat; background-position: right center; background-size: 15px 15px; } #info_container .report-content-area .report-content .browsing-area .header .array-btn-wrap a:hover { opacity: 0.9; } #info_container .report-content-area .report-content .browsing-area .header .array-btn-wrap a:last-child { margin-right: 0; } #info_container .report-content-area .report-content .browsing-area .header .array-btn-wrap a.select { opacity: 1; color: #2b3245; font-weight: bold; } #info_container .report-content-area .report-content .browsing-area .header .content-type-select { float: right; margin-left: 20px; } #info_container .report-content-area .report-content .browsing-area .header .content-type-select a { font-size: 1.2rem; height: 100%; line-height: 38px; font-weight: 500; opacity: .4; padding: 0 5px; transition: opacity .25s ease; } #info_container .report-content-area .report-content .browsing-area .header .content-type-select a.select { opacity: 1; } #info_container .report-content-area .report-content .browsing-area .header .content-type-select a:hover { opacity: 0.9; } #info_container .report-content-area .report-content .browsing-area .header .content-type-select a img { width: 17px; margin-top: 11px; margin-right: 4px; } #info_container .report-content-area .report-content .browsing-area .body { background: #fff; overflow: hidden; max-height: 40px; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list { padding: 15px 20px; padding-bottom: 8px; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li:last-child { margin-left: 0; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li { display: inline-block; margin-right: 15px; margin-bottom: 12px; cursor: default; letter-spacing: 0; font-size: 1.25rem; color: #555; position: relative; line-height: 15px; font-weight: 500; transition: color .25s ease; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li a:hover { color: #1652f0; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li .dot { display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: #999; margin-right: 5px; margin-bottom: 3px; transition: background .25s ease; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li:hover .dot { background: #555; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li .label-wrap { display: inline-block; margin-left: 3px; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li .label-wrap .label { font-family: 'Arial','Malgun Gothic','Dotum'; font-size: 1.1rem; background: #F2F2F7; padding: 0 8px; height: 16px; line-height: 16px; display: inline-block; border-radius: 12px; color: #222; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li .view-btn { display: inline-block; margin-right: 3px; opacity: 0.4; transition: opacity .25s ease; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li .view-btn:hover { opacity: 1; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li .view-btn img { width: 14px; height: 14px; margin-top: 2px; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li.disable { cursor: not-allowed; opacity: 0.3; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li.disable a { cursor: not-allowed; font-weight: 300; letter-spacing: 0; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li.disable a:hover { color: #2b3245; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li.disable:hover .dot { background: #999; } #info_container .report-content-area .report-content .browsing-area .body ul.category-list li.disable .label-wrap { display: none; } #info_container .report-content-area .report-content .browsing-area .body .breadcrumb { width: 100%; min-height: 30px; background: #f8f8f8; border-bottom: 1px solid #eee; padding: 10px 15px; } #info_container .report-content-area .report-content .browsing-area .body .breadcrumb ul li { display: inline-block; font-family: 'Arial'; } #info_container .report-content-area .report-content .browsing-area .body .breadcrumb ul li a { font-size: 1.2rem; letter-spacing: 0; color: #555; transition: color .25s ease; } #info_container .report-content-area .report-content .browsing-area .body .breadcrumb ul li a:hover { color: #222; text-decoration: underline; } #info_container .report-content-area .report-content .browsing-area .body .breadcrumb ul li.arrow { margin: 0 5px; cursor: default; } #info_container .report-content-area .report-content .browsing-area .body table { width: 100%; border: 1px solid #ddd; font-size: 1.2rem; } #info_container .report-content-area .report-content .browsing-area .body table th { background: #eee; padding: 10px; text-align: center; font-weight: bold; border-right: 1px solid #ddd; position: relative; } #info_container .report-content-area .report-content .browsing-area .body table th.check-col { width: 35px; } #info_container .report-content-area .report-content .browsing-area .body table th.check-col { width: 35px; } #info_container .report-content-area .report-content .browsing-area .body .list-table table th { padding: 7px; } #info_container .report-content-area .report-content .browsing-area .body .list-table table th.has-order { padding: 7px 23px; } #info_container .report-content-area .report-content .browsing-area .body table th:last-child { border-right: none; } #info_container .report-content-area .report-content .browsing-area .body table td { text-align: center; padding: 10px; border-right: 1px solid #ddd; } #info_container .report-content-area .report-content .browsing-area .body table td.category { text-align: left; } #info_container .report-content-area .report-content .browsing-area .body table td.category .plus img { width: 14px; height: 14px; margin-top: 2px; margin-right: 2px; opacity: 0.4; transition: opacity .25s ease; } #info_container .report-content-area .report-content .browsing-area .body table td.category .plus:hover img { opacity: 1; } #info_container .report-content-area .report-content .browsing-area .body .list-table table td { padding: 7px; } #info_container .report-content-area .report-content .browsing-area .body table td:last-child { border-right: none; } #info_container .report-content-area .report-content .browsing-area .body table td a:hover { color: #1652f0; text-decoration: underline; } #info_container .report-content-area .report-content .browsing-area .body table tr { border-bottom: 1px solid #ddd; } #info_container .report-content-area .report-content .browsing-area .body table tbody tr { transition: background .25s ease; } #info_container .report-content-area .report-content .browsing-area .body table tbody tr:hover { background: #f2f2f7; } #info_container .report-content-area .report-content .browsing-area .body table tbody tr.top-result { background-color: #e8eeff; } #info_container .report-content-area .report-content .browsing-area .body table tr:last-child { border-bottom: none; } #info_container .report-content-area .report-content .browsing-area .body table thead tr:last-child { border-bottom: 1px solid #ddd; } #info_container .report-content-area .report-content .browsing-area .body table tbody tr .view-btn { display: inline-block; margin-left: 3px; opacity: 0.4; transition: opacity .25s ease; } #info_container .report-content-area .report-content .browsing-area .body table tbody tr .view-btn:hover { opacity: 1; } #info_container .report-content-area .report-content .browsing-area .body table tbody tr .view-btn img { width: 14px; height: 14px; margin-top: 2px; } #info_container .report-content-area .report-content .browsing-area .on-off-btn { position: absolute; z-index: 2; width: 50px; height: 15px; background: #fff; text-align: center; border-left: 1px solid #dee3eb; bottom: -15px; border-right: 1px solid #dee3eb; border-bottom: 1px solid #dee3eb; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; left: 50%; margin-left: -25px; overflow: hidden; } #info_container .report-content-area .report-content .browsing-area .on-off-btn img { width: 30%; } #info_container .report-content-area .report-content .browsing-area #body_on_off_toggle:checked ~ .body { max-height: none; } #info_container .report-content-area .report-content .report { border: 1px solid #dee3eb; padding: 70px 20px 25px; position: relative; background: #fff; } #info_container .report-content-area .report-content .report .subject-select-wrap { position: absolute; z-index: 2; left: 0; top: 0; height: 45px; width: 100%; border-bottom: 1px solid #dee3eb; overflow: hidden; cursor: pointer; padding: 0 25px; } #info_container .report-content-area .report-content .report .subject-select-wrap:after { position: absolute; width: 50px; height: 100%; top: 0; right: 0; content: ''; z-index: 2; background: -webkit-gradient(linear, left top, right top, color-stop(0, rgba(255,255,255,0.1)), color-stop(1, #ffffff)); background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, #ffffff 100%); background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, #ffffff 100%); background: -o-linear-gradient(left, rgba(255,255,255,0) 0%, #ffffff 100%); background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%, #ffffff 100%); background: linear-gradient(left, rgba(255,255,255,0) 0%, #ffffff 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='rgba(255,255,255,0)', endColorstr='#ffffff', gradientType=1); } #info_container .report-content-area .report-content .report .subject-select-wrap ul { overflow-x: auto; white-space: nowrap; -ms-overflow-style: none; height: 85px; cursor: pointer; } #info_container .report-content-area .report-content .report .subject-select-wrap ul li { display: inline-block; height: 44px; margin: 0 5px; } #info_container .report-content-area .report-content .report .subject-select-wrap ul li:last-child { margin-right: 0; } #info_container .report-content-area .report-content .report .subject-select-wrap ul li:first-child { margin-left: 0; } #info_container .report-content-area .report-content .report .subject-select-wrap ul li a { display: block; height: 100%; line-height: 44px; font-size: 1.4rem; color: #888; padding: 0 20px; position: relative; } #info_container .report-content-area .report-content .report .subject-select-wrap ul li.select a { font-weight: bold; } #info_container .report-content-area .report-content .report .subject-select-wrap ul li.select a:after { position: absolute; content: ''; width: 100%; height: 2px; bottom: 0; left: 0; } .enterprise #info_container .report-content-area .report-content .report .subject-select-wrap ul li.select a { color: #262932; } .technology #info_container .report-content-area .report-content .report .subject-select-wrap ul li.select a { color: #1D25A0; } .agent #info_container .report-content-area .report-content .report .subject-select-wrap ul li.select a { color: #360E68; } .researcher #info_container .report-content-area .report-content .report .subject-select-wrap ul li.select a { color: #00515B; } .enterprise #info_container .report-content-area .report-content .report .subject-select-wrap ul li.select a:after { background: #262932; } .technology #info_container .report-content-area .report-content .report .subject-select-wrap ul li.select a:after { background: #1D25A0; } .agent #info_container .report-content-area .report-content .report .subject-select-wrap ul li.select a:after { background: #360E68; } .researcher #info_container .report-content-area .report-content .report .subject-select-wrap ul li.select a:after { background: #00515B; } #info_container .report-content-area .report-content .report .subject-select-wrap .navi-btn { position: absolute; z-index: 3; top: 10px; background: #505357; border: none; height: 25px; width: 16px; border-radius: 4px; outline: 0; transition: background .25s ease,box-shadow .25s ease; } #info_container .report-content-area .report-content .report .subject-select-wrap .navi-btn:hover { background: #5E6166; box-shadow: 0 2px 4px 3px rgba(0,0,0,0.1); } #info_container .report-content-area .report-content .report .subject-select-wrap .navi-btn.left { left: 9px; } #info_container .report-content-area .report-content .report .subject-select-wrap .navi-btn.right { right: 9px; } #info_container .report-content-area .report-content .report .subject-select-wrap .navi-btn img { margin-top: 1px; } #info_container .report-content-area .report-content .report .subject-select-wrap .navi-btn:disabled { opacity: 0.2; cursor: not-allowed; } #info_container .report-content-area .report-content .report .content-box { margin-bottom: 30px; } #info_container .report-content-area .report-content .report .content-box:last-child { margin-bottom: 0; } #info_container .report-content-area .report-content .report .report-header { border-bottom: 1px solid #e5e5e5; margin-bottom: 20px; padding-bottom: 20px; } #info_container .report-content-area .report-content .report .report-header .content-title { font-size: 1.8rem; display: block; margin-bottom: 10px; font-weight: 800; position: relative; } #info_container .report-content-area .report-content .report .report-header .content-title img { width: 20px; margin-right: 5px; margin-top: 4px; } #info_container .report-content-area .report-content .report .report-header .content-title .down-btn { background: #2A5696; border: none; height: 35px; color: #fff; letter-spacing: 0; font-size: 1.3rem; font-weight: 300; padding: 0 15px; border-radius: 3px; outline: 0; transition: box-shadow .25s ease; position: absolute; right: 0; top: -5px; } #info_container .report-content-area .report-content .report .report-header .content-title .down-btn:hover{ box-shadow: 0 2px 7px 4px rgba(0,0,0,0.15); } #info_container .report-content-area .report-content .report .report-header .content-title .down-btn img { width: 20px; height: 20px; margin-right: 5px; margin-top: 1px; } #info_container .report-content-area .report-content .report .content-box .detail-content-title { font-size: 1.6rem; display: block; margin-bottom: 5px; } #info_container .report-content-area .report-content .report .content-box .detail-content-title img { width: 15px; margin-right: 5px; margin-top: 5px; } #info_container .report-content-area .report-content .report .report-header .description { font-size: 1.3rem; font-weight: 300; color: #666; display: block; margin-top: 10px; letter-spacing: 0; line-height: 18px; } #info_container .report-content-area .report-content .report .report-header .description img { width: 15px; margin-right: 5px; margin-top: 2px; } #info_container .report-content-area .report-content .report .content-box .sub-title { font-size: 1.3rem; display: block; margin-bottom: 10px; font-weight: 600; } #info_container .report-content-area .report-content .report .content-box table { width: 100%; border: 1px solid #ddd; font-size: 1.4rem; } #info_container .report-content-area .report-content .report .content-box table th { background: #eee; padding: 5px 2px; text-align: center; font-weight: bold; border-right: 1px solid #ddd; position: relative; height: 18px; line-height: 21px; } #info_container .report-content-area .report-content .report .content-box .list-table table th { padding: 5px 2px; position: relative; } #info_container .report-content-area .report-content .report .content-box .list-table.header-fixed table th { position: -webkit-sticky; position: sticky; top: 180px; } #info_container .report-content-area .report-content .report .content-box .list-table.header-fixed.ie-table table th { position: -webkit-relative; position: relative; top: auto; } #info_container .report-content-area .report-content .report .content-box .list-table table th.has-order { padding: 5px 2px 20px; } #info_container .report-content-area .report-content .report .content-box .list-table table th.has-annotation { padding-right: 6px; } #info_container .report-content-area .report-content .report .content-box .list-table table th .annotation-label { position: absolute; top: -4px; right: 0; color: red; font-size: 1rem; } #info_container .report-content-area .report-content .report .content-box table th:last-child { border-right: none; } #info_container .report-content-area .report-content .report .content-box table td { text-align: center; padding: 5px 2px; border-right: 1px solid #ddd; line-height: 21px; } #info_container .report-content-area .report-content .report .content-box .list-table table td { padding: 5px 2px; } #info_container .report-content-area .report-content .report .content-box .list-table table td.left { text-align: left; padding: 5px 8px; } #info_container .report-content-area .report-content .report .content-box .list-table table td.right { text-align: right; padding: 5px 8px; } #info_container .report-content-area .report-content .report .content-box table td:last-child { border-right: none; } #info_container .report-content-area .report-content .report .content-box table td a:hover { color: #1652f0; text-decoration: underline; } #info_container .report-content-area .report-content .report .content-box table tr { border-bottom: 1px solid #ddd; } #info_container .report-content-area .report-content .report .content-box table thead tr th { border-bottom: 2px solid #ddd; } #info_container .report-content-area .report-content .report .content-box table tbody tr { transition: background .25s ease; } #info_container .report-content-area .report-content .report .content-box table tbody tr:hover { background: #f2f2f7; } #info_container .report-content-area .report-content .report .content-box table tbody tr.top-result { background-color: #e8eeff; } #info_container .report-content-area .report-content .report .content-box table tr:last-child { border-bottom: none; } #info_container .report-content-area .report-content .report .content-box table .table-align-btn { font-weight: bold; font-size: 1.2rem; background: none; border: none; border-top: 1px solid #ddd;outline: 0; transition: opacity .25s ease; cursor: pointer; display: inline-block; background: url(../../img/report/table_filter_ico.png) no-repeat; background-size: 15px 45px; width: 100%; height: 15px; background-color: #fff; background-position: center 0; position: absolute; bottom: 0;left:0;} #info_container .report-content-area .report-content .report .content-box table .table-align-btn.up { background-position: center -15px; background-color:#f2f2f7;} #info_container .report-content-area .report-content .report .content-box table .table-align-btn.down { background-position: center -30px; background-color:#f2f2f7;} #info_container .report-content-area .report-content .report .content-box table .table-align-btn:hover { background-color:#f2f2f7; } #info_container .report-content-area .report-content .report .content-box table .trend-img { width: 18px; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap {overflow:hidden;} #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .number-limit { float:left;display: inline-block; margin-top: 15px; vertical-align: top; color: #999; font-size: 1.2rem; line-height: 30px; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .number-limit .filter-title { line-height: 30px; vertical-align: top; margin-right: 5px; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .number-limit ul { overflow: hidden; display: inline-block; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .number-limit ul li { display: inline-block; float: left; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .number-limit ul li a { display: inline-block; min-width: 28px; height: 25px; text-align: center; font-weight: 500; font-size: 1.2rem; color: #999; letter-spacing: 0; padding: 0 5px; border-radius: 4px; line-height: 25px; margin-right: 5px; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .number-limit ul li.select a { color: #fff; background: #002A80; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .number-limit ul li a:hover { color: #222; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .number-limit ul li.select a:hover { color: #fff; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging { float:right;margin-top: 15px; display: inline-block; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging ul { overflow: hidden; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging ul li { display: inline-block; float: left; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging ul li img { width: 17px; opacity: 0.5; margin-top: 6px; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging ul li .page-move-btn.disabled img { opacity: 0.2; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging ul li a { display: inline-block; min-width: 28px; height: 30px; text-align: center; font-weight: 500; font-size: 1.2rem; color: #999; line-height: 28px; letter-spacing: 0; padding: 0 5px; border: 1px solid #dee3eb; border-right: none; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging ul li a.disabled { background-color: #eee; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging ul li:last-child a { border-right: 1px solid #dee3eb; border-top-right-radius: 3px; border-bottom-right-radius: 3px; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging ul li:first-child a { border-top-left-radius: 3px; border-bottom-left-radius: 3px; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging ul li a:hover { color: #222; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging ul li a.disabled:hover { color: #999; cursor: default; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging ul li.select a { background: #002A80; border-color: #002A80; color: #fff; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging ul li .page-move-btn { padding: 0; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging ul li .page-move-btn:hover img { opacity: 1; } #info_container .report-content-area .report-content .report .content-box .list-table .paging-wrap .paging ul li .page-move-btn.disabled:hover img { opacity: 0.2; cursor: default; } #info_container .report-content-area .report-content .report .content-box .note { background: #f8f8f8; margin: 20px 0; padding: 20px; color: #222; font-size: 1.2rem; border-top: 1px solid #005EC3; position: relative; } #info_container .report-content-area .report-content .report .content-box .note ul li { margin-top: 10px; font-weight: 300; } #info_container .report-content-area .report-content .report .content-box .note ul li:first-child { margin-top: 0; } #info_container .report-content-area .report-content .report .content-box .note ul li p { font-size:1em; font-weight:normal;} #info_container .report-content-area .report-content .report .content-box .note ul li p .head-wrap { font-size:1em; font-weight:normal;position: relative; } #info_container .report-content-area .report-content .report .content-box .note ul li p .head-wrap .head-text { text-decoration: underline; } #info_container .report-content-area .report-content .report .content-box .note ul li p .head-wrap .annotation-label { font-size: 1rem; color: red; position:absolute; top:-5px; right:-10px;} #info_container .report-content-area .report-content .report .content-box .note ul li p .annotation-desc { text-decoration: none; position: relative; padding-left:15px;} #info_container .report-content-area .report-content .report .content-box .note ul li p .annotation-desc:before { content : ' : '; } #info_container .report-content-area .report-content .report .content-box .note ul li:nth-child(n+3) { display: none; } #info_container .report-content-area .report-content .report .content-box .note #note_toggle_input { display: none; } #info_container .report-content-area .report-content .report .content-box .note .note-foling-btn { position: absolute; width: 30px; height: 30px; display: block; background: #C0C0C0; border-radius: 50%; opacity: 0.5; right: 20px; top: 20px; text-align: center; } #info_container .report-content-area .report-content .report .content-box .note .note-foling-btn img { width: 20px; margin-top: 6px; } #info_container .report-content-area .report-content .report .content-box .note .note-foling-btn img.up-ico { display: none; } #info_container .report-content-area .report-content .report .content-box .note #note_toggle_input:checked ~ ul li:nth-child(n+3) { display: block; } #info_container .report-content-area .report-content .report .content-box .note #note_toggle_input:checked ~ .note-foling-btn img.down-ico { display: none; } #info_container .report-content-area .report-content .report .content-box .note #note_toggle_input:checked ~ .note-foling-btn img.up-ico { display: inline-block; margin-top: 4px; } #info_container .report-content-area .report-content .report .content-box .chart { border: 1px solid #ddd; padding: 45px 10px 10px; position: relative; } /* 셀렉트 커스텀 */ .selectbox { position: relative; border-style: none; z-index: 1; display: inline-block; border: 1px solid #dcdcdc; height: 35px; width: 170px; border-radius: 3px; margin-left: 5px; vertical-align: middle; transition: background .25s ease; } .selectbox:hover { background: #f8f8f8; } .selectbox:before { content: ""; position: absolute; top: 50%; margin-top: -10px; right: 8px; background: url(../../img/svg/down_b_ico.svg) no-repeat; width: 20px; height: 20px; opacity: 0.5; } .selectbox label { position: absolute; top: 0; left: 0; color: #222; z-index: -1; /* IE8에서 label이 위치한 곳이 클릭되지 않는 것 해결 */ font-size: 1.3rem; line-height: 33px; text-align: left; width: 90%; padding-left: 10px; padding-right: 5px; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .selectbox select { width: 100%; line-height: normal; /* line-height 초기화 */ font-family: inherit; border: 0; opacity: 0; /* 숨기기 */ filter:alpha(opacity=0); /* IE8 숨기기 */ -webkit-appearance: none; /* 네이티브 외형 감추기 */ -moz-appearance: none; appearance: none; margin-left: 0; height: 33px; cursor: pointer; } #info_container .report-content-area .report-content .report .content-box .tool-area { height: 45px; } #info_container .report-content-area .report-content .report .content-box .filter-wrap { display: inline-block; float: left; } #info_container .report-content-area .report-content .report .content-box .filter { display: inline-block; margin-left: 20px; vertical-align: top; } #info_container .report-content-area .report-content .report .content-box .filter:first-child { margin-left: 0; } #info_container .report-content-area .report-content .report .content-box .tool-area .exel-download { float: right; min-height: 45px; } #info_container .report-content-area .report-content .report .content-box .filter .filter-title { font-weight: bold; color: #999; line-height: 25px; display: inline-block; font-size: 1.3rem; margin-right: 5px; } #info_container .report-content-area .report-content .report .content-box .filter .filter-title sup { font-weight: 300; letter-spacing: 0; } #info_container .report-content-area .report-content .report .content-box .exel-download .down-btn { background: #217346; border: none; height: 35px; color: #fff; letter-spacing: 0; font-size: 1.3rem; font-weight: 300; padding: 0 15px; border-radius: 3px; outline: 0; transition: box-shadow .25s ease; } #info_container .report-content-area .report-content .report .content-box .exel-download .down-btn:hover{ box-shadow: 0 2px 7px 4px rgba(0,0,0,0.15); } #info_container .report-content-area .report-content .report .content-box .exel-download .down-btn img { width: 20px; height: 20px; margin-right: 5px; } #info_container .report-content-area .report-content .report .content-box .exel-download .filter { margin-right: 5px; } #info_container .report-content-area .report-content .report .content-box .exel-download .filter .selectbox { width: 110px; } #info_container .report-content-area .report-content .report .content-box .new-window-btn { float: right; height: 35px; background: #2659D4; border: none; border-radius: 3px; line-height: 35px; padding: 0 15px; font-weight: 300; color: #fff; font-size: 1.3rem; outline: 0; transition: box-shadow .25s ease; margin-left: 8px; } #info_container .report-content-area .report-content .report .content-box .new-window-btn:hover { box-shadow: 0 2px 7px 4px rgba(0,0,0,0.15); } #info_container .report-content-area .report-content .report .content-box .new-window-btn img { width: 19px; margin-top: 8px; margin-right: 5px; } #info_container .report-content-area .report-content .report .content-box .wide-view-btn { float: right; height: 35px; background: #fff; border: 1px solid #2659D4; border-radius: 3px; line-height: 33px; padding: 0 15px; font-weight: 500; color: #2659D4; font-size: 1.3rem; outline: 0; transition: box-shadow .25s ease; margin-left: 8px; } #info_container .report-content-area .report-content .report .content-box .wide-view-btn:hover { box-shadow: 0 2px 7px 4px rgba(0,0,0,0.15); } #info_container .report-content-area .report-content .report .content-box .wide-view-btn img { width: 17px; margin-top: 8px; margin-right: 5px; } #info_container .report-content-area .report-content .report .content-box .filter-result { font-weight: bold; color: #999; line-height: 25px; display: inline-block; font-size: 1.3rem; } #info_container .report-content-area .report-content .report .content-box .filter-result .label { display: inline-block; height: 20px; padding: 0 15px; background: #F2F2F7; line-height: 20px; font-size: 12px; border-radius: 10px; margin-left: 10px; color: #222; } #info_container .report-content-area .report-content .report .content-box .filter-result .between { line-height: 35px; padding-left: 10px; } #info_container .report-content-area .report-content .report .content-box .filter-result .filter-unit { display: inline-block; } #info_container .report-content-area .report-content .report .content-box .filter-result .apply-filter-btn { background: #1d25a0; border: none; height: 35px; color: #fff; letter-spacing: 0; font-size: 1.3rem; font-weight: 300; padding: 0 15px; margin-left: 10px; border-radius: 3px; outline: 0; transition: box-shadow .25s ease; } #info_container .report-content-area .report-content .report .content-box .filter-result .apply-filter-btn:hover{ box-shadow: 0 2px 7px 4px rgba(0,0,0,0.15); } #info_container .report-content-area .report-content .report .content-box .url-copy-btn { height: 35px; background: #fff; border: 1px solid #dcdcdc; border-radius: 3px; line-height: 33px; padding: 0 15px; font-weight: normal; color: #222; font-size: 1.3rem; outline: 0; transition: box-shadow .25s ease; margin-left: 8px; } #info_container .report-content-area .report-content .report .content-box .url-copy-btn:hover { background:#f8f8f8;} #info_container .report-content-area .report-content .report .content-box .url-copy-btn img { width: 17px; margin-top: 8px; margin-right: 5px; } #info_container .report-content-area .report-content .report .content-box .search-box { height: 35px; background: #f8f8f8; position: relative; border-radius: 3px; width: 250px; margin-left: 10px; cursor: pointer; transition: box-shadow .25s ease; transition: width .25s ease; display: inline-block; vertical-align: top; } #info_container .report-content-area .report-content .report .content-box .search-box input[type=text] { width: 100%; height: 100%; border: none; background: transparent; outline: 0; padding-left: 10px; letter-spacing: 0; cursor: pointer; border-radius: 3px; } #info_container .report-content-area .report-content .report .content-box .search-box input[type=text]:hover, #info_container .report-content-area .report-content .report .content-box .search-box input[type=text]:active, #info_container .report-content-area .report-content .report .content-box .search-box input[type=text]:focus { box-shadow: 1px 1px 5px 0 rgba(0,0,0,0.1) inset; } #info_container .report-content-area .report-content .report .content-box .search-box .search-btn { position: absolute; top: 50%; margin-top: -10px; right: 10px; width: 20px; height: 20px; border: none; background: none; outline: 0; } /* 체크박스커스텀 */ .checkbox { display: none; } .checkbox-label { min-width: 15px; height: 15px; display: inline-block; background: url(../../img/common/checkbox_02.png)no-repeat; background-size: 15px 30px; background-position: 0 0; padding-left: 15px; line-height: 15px; color: #9DAACC; font-size: 1.2rem; letter-spacing: 0;} .checkbox:checked + .checkbox-label { background-position: 0 -15px; } #info_container .report-content-area .report-content .report .content-box .explanation-box { margin-top: 20px; background: #f2f2f7; padding: 20px; } #info_container .report-content-area .report-content .report .content-box .explanation-box .keyword-box { margin-bottom: 10px; } #info_container .report-content-area .report-content .report .content-box .explanation-box .keyword-box:last-child { margin-bottom: 0; } #info_container .report-content-area .report-content .report .content-box .explanation-box h4 { display: inline-block; margin-bottom: 2px; font-weight: 700; } /* 설정 팝업 */ .user-tool-layer-wrap { position: fixed; left: 0; top: 0; bottom: 0; right: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); z-index: 20; } .user-tool-layer-wrap .lang-layer { position: fixed; z-index: 21; width: 0; border-radius: 6px; left: 50%; margin-left: 0; top: 100px; transition: 0.5s ease; background: #1C2D5F; } .user-tool-layer-wrap .lang-layer.on { width: 650px; margin-left: -325px; } .user-tool-layer-wrap .lang-layer .header-area { height: 50px; position: absolute; color: rgba(255,255,255,0.8); text-align: center; font-size: 1.5rem; font-weight: 500; padding: 15px 0; cursor: default; border-bottom: 1px solid #14265B; background: #24366f; border-top-left-radius: 6px; border-top-right-radius: 6px; width: 100%; left: 0; top: 0; z-index: 21; } .user-tool-layer-wrap .lang-layer .header-area .pop-close-btn { width: 50px; height: 50px; border-radius: 50%; border-style: none; background: rgba(28,45,95,0.5); position: absolute; right: -70px; top: 0; transition: background .25s ease; outline: 0; } .user-tool-layer-wrap .lang-layer .header-area .pop-close-btn:hover { background: rgba(28,45,95,0.8); } .user-tool-layer-wrap .lang-layer .header-area .pop-close-btn img { width: 100%; } .user-tool-layer-wrap .lang-layer .content-area { padding: 70px 20px 60px 20px; padding-top: 70px; max-height: 100%; overflow: hidden; overflow-y: auto; -ms-overflow-style: none; } .user-tool-layer-wrap .lang-layer .content-area::-webkit-scrollbar { display:none; } .user-tool-layer-wrap .lang-layer .content-area .title { color: #808FB8; font-size: 1.2rem; display: block; font-weight: bold; } .user-tool-layer-wrap .lang-layer .content-area .lang-select-wrap { margin-top: 15px; } .user-tool-layer-wrap .lang-layer .content-area .locale-select-wrap { margin-top: 15px; border-bottom: 1px solid #14265B; } .user-tool-layer-wrap .lang-layer .content-area .locale-select-wrap .title, .user-tool-layer-wrap .lang-layer .content-area .lang-select-wrap .title { margin-bottom: 15px; } .user-tool-layer-wrap .lang-layer .content-area ul { overflow: hidden; width: 100%; } .user-tool-layer-wrap .lang-layer .content-area ul li { margin-bottom: 10px; float: left; width: 25%; display: inline-block; height: 30px; transition: width .25s ease; } .user-tool-layer-wrap .lang-layer .content-area .lang-select-wrap ul li { width: 100px; } .user-tool-layer-wrap .lang-layer .content-area ul li label { padding-left: 20px; font-size: 1.3rem; background: none; padding-left: 0; padding-right: 20px; position: relative; display: inline-block; height: 25px; overflow: hidden; } .user-tool-layer-wrap .lang-layer .content-area ul li label .flag { width: 25px; height: 25px; display: inline-block; line-height: 25px; background: #293C76; border-radius: 50%; overflow: hidden; vertical-align: top; overflow: hidden; } .user-tool-layer-wrap .lang-layer .content-area ul li label .flag img { width: 100%; } .user-tool-layer-wrap .lang-layer .content-area ul li label .language { display: inline-block; line-height: 25px; vertical-align: top; margin-left: 5px; } .user-tool-layer-wrap .lang-layer .content-area .lang-select-wrap ul li label .language { margin-left: 0; } .user-tool-layer-wrap .lang-layer .content-area ul li label:after { width: 15px; height: 15px; position: absolute; content: ''; background: url(/web/img/common/checkbox_01.png) no-repeat; background-size: 15px 30px; background-position: 0 0; right: 0; top: 50%; margin-top: -7px; } .user-tool-layer-wrap .lang-layer .content-area ul li .checkbox:checked + label:after { background-position: 0 -15px; } .user-tool-layer-wrap .lang-layer .btn-area { padding: 15px 20px; border-top: 1px solid rgba(0,0,0,0.10); overflow: hidden; position: absolute; bottom: 0; left: 0; width: 100%; background: #1C2D5F; z-index: 21; } .user-tool-layer-wrap .lang-layer .btn-area button { outline: 0; border-style: none; font-size: 1.3rem; padding: 0 20px; height: 32px; border-radius: 3px; margin: 0 3px; } .user-tool-layer-wrap .lang-layer .btn-area button:last-child { margin-right: 0; } .user-tool-layer-wrap .lang-layer .btn-area .btn-wrap { display: inline-block; float: right; } .user-tool-layer-wrap .lang-layer .btn-area .btn-wrap .cancel-btn { background: none; color: #808FB8; } .user-tool-layer-wrap .lang-layer .btn-area .btn-wrap .confirm-btn { background: #1652f0; color: #fff; font-weight: 300; } .user-tool-layer-wrap .lang-layer .btn-area .select-option { float: left; height: 25px; } .user-tool-layer-wrap .lang-layer .btn-area .select-option .unit { display: inline-block; line-height: 25px; color: rgba(128,143,184,0.5); margin-right: 5px; font-size: 1.2rem; } .user-tool-layer-wrap .lang-layer .btn-area .select-option>div { display: inline-block; line-height: 25px; color: #808FB8; font-weight: bold; letter-spacing: 0; font-size: 1.2rem; } .user-tool-layer-wrap .lang-layer .btn-area .select-option>div.locale { margin-right: 10px; } .user-tool-layer-wrap .lang-layer .btn-area .select-option .flag { width: 25px; height: 25px; display: inline-block; margin-right: 3px; } .user-tool-layer-wrap .lang-layer .btn-area .select-option .flag img { width: 100%; } .user-tool-layer-wrap .bookmark-layer { position: fixed; z-index: 21; width: 0; border-radius: 6px; left: 50%; margin-left: 0; top: 100px; transition: 0.5s ease; background: #1C2D5F; } .user-tool-layer-wrap .bookmark-layer.on { width: 650px; margin-left: -325px; } .user-tool-layer-wrap .bookmark-layer .header-area { height: 50px; position: absolute; color: #222; text-align: center; font-size: 1.5rem; font-weight: 500; padding: 15px 0; cursor: default; border-bottom: 1px solid #dcdcdc; background: #f2f2f7; border-top-left-radius: 6px; border-top-right-radius: 6px; width: 100%; left: 0; top: 0; z-index: 21; } .user-tool-layer-wrap .bookmark-layer .header-area .pop-close-btn { width: 50px; height: 50px; border-radius: 50%; border-style: none; background: rgba(28,45,95,0.5); position: absolute; right: -70px; top: 0; transition: background .25s ease; outline: 0; } .user-tool-layer-wrap .bookmark-layer .header-area .pop-close-btn:hover { background: rgba(28,45,95,0.8); } .user-tool-layer-wrap .bookmark-layer .header-area .pop-close-btn img { width: 100%; } .user-tool-layer-wrap .bookmark-layer .content-area { padding: 50px 0 60px 0; max-height: 460px; min-height:360px; overflow: hidden; overflow-y: auto; -ms-overflow-style: none; background: #fff; border-top-left-radius: 8px; border-top-right-radius: 8px; } .user-tool-layer-wrap .bookmark-layer .content-area::-webkit-scrollbar { display:none; } /* 즐겨찾기 */ #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li .bookmark { padding: 10px 15px; cursor: pointer; border-bottom: 1px solid #eee; height: 33px; transition: background .25s ease; position: relative; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li .bookmark:hover { background: #f8f8f8; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li .bookmark.select { background: #4F7FFF; color: #fff; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li .bookmark.select:hover { background: #3D6EF1; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li .bookmark img.folder-img { width: 15px; height: auto; margin-right: 3px; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li .bookmark img.doc-img { width: 15px; height: auto; margin-right: 3px; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li .bookmark .name { font-size: 1.2rem; letter-spacing: 0; line-height: 12px; vertical-align: top; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li .bookmark.title { padding: 15px 10px; border: 8px solid #fff; border-radius: 20px; background-color: #eee; cursor: default; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li .bookmark.title .name { line-height: 0; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li .bookmark .go-btn { position: absolute; z-index: 2; right: -33px; width: 33px; height: 32px; background: #fff; top: 0; text-align: center; border-left: 1px solid #EEEEEE; transition: background .25s ease,right 0.25s ease;} #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li .bookmark:hover .go-btn { right: 0; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li .bookmark .go-btn:hover { background: #f8f8f8; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li .bookmark .go-btn img { width: 50%; margin-top: 8px; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li>ul>li>.bookmark { padding-left: 30px; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li>ul>li>ul>li>.bookmark { padding-left: 45px; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li>ul>li>ul>li>ul>li>.bookmark { padding-left: 60px; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li>ul>li>ul>li>ul>li>ul>li>.bookmark { padding-left: 75px; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>.bookmark { padding-left: 90px; } #header_container .user-tool-layer-wrap .bookmark-layer .btn-area { padding: 15px 20px; border-top: 1px solid #dcdcdc; overflow: hidden; position: absolute; bottom: 0; left: 0; width: 100%; background: #f2f2f7; z-index: 21; } #header_container .user-tool-layer-wrap .bookmark-layer .btn-area button { outline: 0; border-style: none; font-size: 1.3rem; padding: 0 20px; height: 32px; border-radius: 3px; margin: 0 3px; } #header_container .user-tool-layer-wrap .bookmark-layer .btn-area button:last-child { margin-right: 0; } #header_container .user-tool-layer-wrap .bookmark-layer .btn-area .btn-wrap { display: inline-block; float: right; } #header_container .user-tool-layer-wrap .bookmark-layer .btn-area .btn-wrap .cancel-btn { background: none; color: #808FB8; } #header_container .user-tool-layer-wrap .bookmark-layer .btn-area .btn-wrap .confirm-btn { background: #1652f0; color: #fff; font-weight: 300; } #header_container .user-tool-layer-wrap .bookmark-layer .btn-area .new-folder { background: #00C46B; color: #fff; font-size: 1.3rem; } #header_container .user-tool-layer-wrap .bookmark-layer .btn-area .select-option { float: left; height: 25px; } #header_container .user-tool-layer-wrap .bookmark-layer .btn-area .select-option .unit { display: inline-block; line-height: 25px; color: rgba(128,143,184,0.5); margin-right: 5px; font-size: 1.2rem; } #header_container .user-tool-layer-wrap .bookmark-layer .btn-area .select-option>div { display: inline-block; line-height: 25px; color: #808FB8; font-weight: bold; letter-spacing: 0; font-size: 1.2rem; } #header_container .user-tool-layer-wrap .bookmark-layer .btn-area .select-option>div.locale { margin-right: 10px; } #header_container .user-tool-layer-wrap .bookmark-layer .btn-area .select-option .flag { width: 25px; height: 25px; display: inline-block; margin-right: 3px; } #header_container .user-tool-layer-wrap .bookmark-layer .btn-area .select-option .flag img { width: 100%; } .user-tool-layer-wrap .bookmark-layer .breadcrumbs { padding: 5px 10px; border-bottom: 1px solid #dee3eb; border-top: 1px solid #dee3eb; } .user-tool-layer-wrap .bookmark-layer .breadcrumbs .breadcrumbs-list {display: inline;} .user-tool-layer-wrap .bookmark-layer .breadcrumbs .breadcrumbs-list a { font-size: 1.2rem; letter-spacing: 0; font-weight: 500; color: #666; } .user-tool-layer-wrap .bookmark-layer .breadcrumbs .breadcrumbs-list a:hover { text-decoration: underline; } .user-tool-layer-wrap .bookmark-layer .breadcrumbs .breadcrumbs-list .arrow { width: 15px; display: inline-block; margin: 3px 5px; opacity: 0.3; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area ul>li .no-bookmark { cursor: default; background-color: #f8f8f8; text-align: center; padding-top: 70px; min-height: 170px; } #header_container .user-tool-layer-wrap .bookmark-layer .option-area { background: #fff; position: absolute; z-index: 3; bottom: 62px; left: 0; width: 100%; box-shadow: 0 -180px 5px rgba(0,0,0,0.3); border-top: 1px solid #dee3eb; } #header_container .user-tool-layer-wrap .bookmark-layer .option-area a { display: block; width: 100%; padding: 10px 15px; border-bottom: 1px solid #eee; font-size: 1.1rem; font-weight: bold; color: #666; transition: background .25s ease; } #header_container .user-tool-layer-wrap .bookmark-layer .option-area a img { width: 18px; margin-right: 5px; opacity: 0.5; vertical-align: middle; } #header_container .user-tool-layer-wrap .bookmark-layer .option-area a:hover { background: #f8f8f8; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change { cursor: default; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change input[type=text] { width: calc(100% - 35px); padding-left: 10px; border-radius: 3px; margin-left: 5px; margin-top: -10px; font-size: 1.2rem; transition: box-shadow .25s ease; border: 1px solid #dee3eb; } #header_container .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change input[type=text]:hover, #header_container .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change input[type=text]:active, #header_container .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change input[type=text]:focus { box-shadow: 1px 1px 5px 0 rgba(0,0,0,0.1) inset; } /* 즐겨찾기 */ /* .user-tool-layer-wrap .bookmark-layer { background: #fff; border: 1px solid #dee3eb; border-radius: 4px; margin-top: 20px; overflow: hidden; } */ /* .user-tool-layer-wrap .bookmark-layer .header-area { padding:15px; border-bottom: 1px solid #dee3eb; cursor: default; } .user-tool-layer-wrap .bookmark-layer .header-area .arrow { width: 18px; opacity: 0.3; margin: 8px 0; } .user-tool-layer-wrap .bookmark-layer .header-area a { padding: 5px 10px; display: inline-block; border-radius: 3px; transition: background .25s ease; word-break: break-all; } .user-tool-layer-wrap .bookmark-layer .header-area a:hover { background: #F3F3F3; } .user-tool-layer-wrap .bookmark-layer .breadcrumbs { padding: 5px 10px; border-bottom: 1px solid #dee3eb; } .user-tool-layer-wrap .bookmark-layer .breadcrumbs .breadcrumbs-list {display: inline;} .user-tool-layer-wrap .bookmark-layer .breadcrumbs .breadcrumbs-list a { font-size: 1.2rem; letter-spacing: 0; font-weight: 500; color: #666; } .user-tool-layer-wrap .bookmark-layer .breadcrumbs .breadcrumbs-list a:hover { text-decoration: underline; } .user-tool-layer-wrap .bookmark-layer .breadcrumbs .breadcrumbs-list .arrow { width: 15px; display: inline-block; margin: 3px 5px; opacity: 0.3; } .user-tool-layer-wrap .bookmark-layer .content-area { padding-bottom: 45px; min-height: 260px; background: #f8f8f8; position: relative; overflow: hidden; } .user-tool-layer-wrap .bookmark-layer .content-area .btn-area { height: 45px; background: #fff; position: absolute; z-index: 2; bottom: 0; left: 0; width: 100%; padding: 10px 15px; border-top: 1px solid #dee3eb; } .user-tool-layer-wrap .bookmark-layer .content-area .btn-area a { font-size: 1.2rem; display: inline-block; line-height: 25px; height: 25px; border-radius: 3px; color: #fff; padding: 0 10px; } .user-tool-layer-wrap .bookmark-layer .content-area .btn-area .new-folder-btn { background: #149B24; } .user-tool-layer-wrap .bookmark-layer .content-area .btn-area .save-btn { background: #1652F0; float: right; } .user-tool-layer-wrap .bookmark-layer .content-area .btn-area .cancel-btn { background: #f3f3f3; float: right; color: #999; margin-right: 5px; } .user-tool-layer-wrap .bookmark-layer .content-area .btn-area .delete-btn { background: #F01545; float: right; } .user-tool-layer-wrap .bookmark-layer .content-area .option-area { background: #fff; position: absolute; z-index: 3; bottom: 0; left: 0; width: 100%; box-shadow: 0 -180px 5px rgba(0,0,0,0.3); border-top: 1px solid #dee3eb; } .user-tool-layer-wrap .bookmark-layer .content-area .option-area a { display: block; width: 100%; padding: 10px 15px; border-bottom: 1px solid #eee; font-size: 1.1rem; font-weight: bold; color: #666; transition: background .25s ease; } .user-tool-layer-wrap .bookmark-layer .content-area .option-area a img { width: 18px; margin-right: 5px; opacity: 0.5; vertical-align: middle; } .user-tool-layer-wrap .bookmark-layer .content-area .option-area a:hover { background: #f8f8f8; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark { padding: 10px 35px 10px 15px; cursor: pointer; border-bottom: 1px solid #eee; height: 33px; transition: background .25s ease; position: relative; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; background: #fff; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark:hover { background: #f8f8f8; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.select { background: #4F7FFF; color: #fff; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.select:hover { background: #3D6EF1; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark img.folder-img { width: 15px; height: auto; margin-right: 3px; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark img.doc-img { width: 15px; height: auto; margin-right: 3px; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark .name { font-size: 1.2rem; letter-spacing: 0; line-height: 12px; vertical-align: top; } .user-tool-layer-wrap .bookmark-layer .content-area .no-bookmark {background-color: #f8f8f8; text-align: center; padding-top: 90px; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark .go-btn { position: absolute; z-index: 2; right: 0; width: 33px; height: 32px; background: #fff; top: 0; text-align: center; border-left: 1px solid #EEEEEE; background: #fff; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark .go-btn img { width: 50%; margin-top: 8px; opacity: 0.3; transition: opacity .25s ease; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark .go-btn:hover img { opacity: 1; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change { height: 50px; background: #D6E0FF; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change .go-btn { height: 100%; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change .go-btn img { margin-top: 16px; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change:hover { background: #D6E0FF; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change input[type=text] { height: 100%; width: calc(100% - 35px); border: none; padding-left: 10px; border-radius: 3px; margin-left: 5px; font-size: 1.2rem; transition: box-shadow .25s ease; border: 1px solid #dee3eb; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change input[type=text]:hover, .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change input[type=text]:active, .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change input[type=text]:focus { box-shadow: 1px 1px 5px 0 rgba(0,0,0,0.1) inset; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change img.folder-img, .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.name-change img.doc-img { margin-top: 8px; } .user-tool-layer-wrap .bookmark-layer .content-area .btn-area input[type=text] { margin-right:28px;height: 100%; width: calc(100% - 950px); border: none; padding-left: 10px; border-radius: 3px; margin-left: 5px; font-size: 1.2rem; transition: box-shadow .25s ease; border: 1px solid #dee3eb; } .user-tool-layer-wrap .bookmark-layer .content-area .btn-area input[type=text]:hover, .user-tool-layer-wrap .bookmark-layer .content-area .btn-area input[type=text]:active, .user-tool-layer-wrap .bookmark-layer .content-area .btn-area input[type=text]:focus { box-shadow: 1px 1px 5px 0 rgba(0,0,0,0.1) inset; } .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.delete, .user-tool-layer-wrap .bookmark-layer .content-area>ul>li .bookmark.delete:hover { background: #FF6969; } .user-tool-layer-wrap .activity-area { margin-top: 20px; overflow: hidden; } .user-tool-layer-wrap .activity-area .search-area { width: 49%; float: left; background: #fff; border: 1px solid #dee3eb; border-radius: 4px; height: auto; } .user-tool-layer-wrap .activity-area .analysis-area { width: 49%; float: right; background: #fff; border: 1px solid #dee3eb; border-radius: 4px; height: auto; } .user-tool-layer-wrap .activity-area .header-area { padding: 15px; border-bottom: 1px solid #dee3eb; cursor: default; } .user-tool-layer-wrap .activity-area .header-area h3 { font-size: 1.5rem; font-weight: 700; } .user-tool-layer-wrap .activity-area .content-area table { width: 100%; } .user-tool-layer-wrap .activity-area .content-area table tbody tr { border-bottom: 1px solid #eee; } .user-tool-layer-wrap .activity-area .content-area table tbody tr:last-child { border-bottom: none; } .user-tool-layer-wrap .activity-area .content-area table tbody tr th { background: #f8f8f8; border-right: 1px solid #eee; padding: 5px 15px; font-size: 1.2rem; color: #999; cursor: default; } .user-tool-layer-wrap .activity-area .content-area table tbody tr th.keyword { width: 70%; } .user-tool-layer-wrap .activity-area .content-area table tbody tr th:last-child { border-right: none; } .user-tool-layer-wrap .activity-area .content-area table tbody tr td { border-right: 1px solid #eee; padding: 10px 15px; font-size: 1.2rem; letter-spacing: 0; color: #555; } .user-tool-layer-wrap .activity-area .content-area table tbody tr td:last-child { border-right: none; } .user-tool-layer-wrap .activity-area .content-area table tbody tr td a:hover { text-decoration: underline; } @media all and (max-width: 740px) { .user-tool-layer-wrap .activity-area .search-area { margin-bottom: 20px; } .user-tool-layer-wrap .activity-area .search-area, .user-tool-layer-wrap .activity-area .analysis-area { width: 100%; float: left; } .user-tool-layer-wrap .activity-area .content-area table tbody tr th.keyword { width: 60%; } } */ /* 차트 타입 */ #info_container .report-content-area .report-content .report .content-box .chart .chart-type-select { position: absolute; z-index: 2; top: 0; left: 0; padding: 10px; } #info_container .report-content-area .report-content .report .content-box .chart .chart-type-select button { border: none; background: #ddd; border-radius: 4px; height: 30px; outline: 0; padding: 0 10px; line-height: 30px; letter-spacing: 0; font-weight: bold; font-size: 1.1rem; opacity: 0.3; transition: opacity .25s ease; margin:0 1px;} #info_container .report-content-area .report-content .report .content-box .chart .chart-type-select button:hover { opacity: 1; } #info_container .report-content-area .report-content .report .content-box .chart .chart-type-select button.select { opacity: 1; background: #ddd; } #info_container .report-content-area .report-content .report .content-box .chart .chart-type-select button img { width: 20px; height: 20px; margin-top: 5px; } /* 검색 레이어 셀렉트 커스텀 */ #header_container .search-layer-wrap .selectbox { position: relative; border-style: none; z-index: 1; display: inline-block; height: 35px; width: 100%; background: #384A7F; border-radius: 3px; cursor: pointer; transition: background .25s ease; } #header_container .search-layer-wrap .selectbox:hover { background: #45588E; } #header_container .search-layer-wrap .selectbox:before { content: ""; position: absolute; top: 50%; right: 10px; width: 15px; height: 15px; margin-top: -8px; background: url(../../img/svg/down_ico.svg); background-size: 15px 15px; background-repeat: no-repeat; opacity: 0.5; } #header_container .search-layer-wrap .selectbox label { position: absolute; top: 0; left: 5px; color: #fff; z-index: -1; /* IE8에서 label이 위치한 곳이 클릭되지 않는 것 해결 */ font-size: 1.3rem; line-height: 35px; text-align: left; width: 80%; padding-left: 10px; } #header_container .search-layer-wrap .selectbox select { width: 100%; line-height: normal; /* line-height 초기화 */ font-family: inherit; border: 0; opacity: 0; /* 숨기기 */ filter:alpha(opacity=0); /* IE8 숨기기 */ -webkit-appearance: none; /* 네이티브 외형 감추기 */ -moz-appearance: none; appearance: none; margin-left: 0; height: 35px; cursor: pointer; } /* 검색 레이어 */ #header_container .search-layer-wrap { position: fixed; left: 0; top: 0; bottom: 0; right: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); z-index: 20; display: none; } #header_container .search-layer-wrap.on { display: block; } #header_container .search-layer-wrap .search-layer { position: fixed; z-index: 21; width: 0; border-radius: 6px; left: 50%; margin-left: 0; top: 30px; transition: 0.5s ease; } #header_container .search-layer-wrap.on .search-layer { width: 800px; margin-left: -400px; } #header_container .search-layer-wrap .search-layer .search-box-area { height: 50px; position: relative; transition: height .5s ease-out,margin-top 0.5s ease-out; margin-top: 30px; } #header_container .search-layer-wrap .search-layer .search-box-area .ico { display: inline-block; width: 50px; cursor: default; text-align: center; cursor: pointer; opacity: 0.5; height: 100%; transition: opacity .25s ease; position: absolute; right: 0; top: 0; } #header_container .search-layer-wrap .search-layer .search-box-area .ico:hover { opacity: 0.8; } #header_container .search-layer-wrap .search-layer .search-box-area .ico img { width: 28px; margin-top: 12px; } #header_container .search-layer-wrap .search-layer .search-box-area input[type=text] { height: 100%; float: left; background: #567DE7; border: none; font-size: 1.5rem; letter-spacing: 0; font-weight: 500; color: #fff; padding-left: 20px; padding-right: 60px; width: 100%; transition: background .25s ease; border-radius: 6px } #header_container .search-layer-wrap .search-layer .search-box-area input[type=text]::-ms-input-placeholder { color: #fff; } #header_container .search-layer-wrap .search-layer .search-box-area input[type=text]::-webkit-input-placeholder { color: #fff; } #header_container .search-layer-wrap .search-layer .search-box-area input[type=text]::-moz-placeholder { color: #fff; } #header_container .search-layer-wrap .search-layer .search-box-area input[type=text]:hover, #header_container .search-layer-wrap .search-layer .search-box-area input[type=text]:active, #header_container .search-layer-wrap .search-layer .search-box-area input[type=text]:focus { background: #668BEF; } @media all and ( max-width:1259px ) { #header_container .search-layer-wrap .search-layer { left: 0; } #header_container .search-layer-wrap.on .search-layer { width: calc(100% - 60px); margin-left: 30px; } } #header_container .search-layer-wrap .search-layer .advanced-search-btn { float: right; color: #fff; letter-spacing: 0; font-size: 1.2rem; margin: 5px 0; line-height: 30px; } #header_container .search-layer-wrap .search-layer .advanced-search-btn .switch { width: 25px; height: 4px; background: #9195A7; display: inline-block; vertical-align: middle; border-radius: 5px; margin-right: 10px; position: relative; } #header_container .search-layer-wrap .search-layer .advanced-search-btn .switch:after { position: absolute; content: ''; width: 10px; height: 10px; border-radius: 50%; background: #435077; top: 50%; margin-top: -5px; left: 0; transition: left .25s ease; } #header_container .search-layer-wrap .search-layer #advanced_search_toggle:checked ~ .advanced-search-btn .switch:after { left: 15px; background: #00B509; } #header_container .search-layer-wrap .search-layer #advanced_search_toggle:checked ~ .search-box-area { height: 0; overflow: hidden; margin-top: 0; } #header_container .search-layer-wrap .search-layer .advanved-search-area { width: 100%; background: #1C2D5F; border-radius: 6px; overflow: hidden; transition: top .5s ease-out; position: fixed; top: 100%; width: 800px; margin-left: -400px; left: 50%; overflow-y: auto; -ms-overflow-style: none; padding: 20px; } #header_container .search-layer-wrap .search-layer .advanved-search-area::-webkit-scrollbar { display:none; } @media all and ( max-width:1259px ) { #header_container .search-layer-wrap .search-layer .advanved-search-area { width: calc(100% - 60px); margin-left: 30px; left: 0; } } #header_container .search-layer-wrap .search-layer #advanced_search_toggle:checked ~ .advanved-search-area { top: 75px; max-height: 85%; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category { margin-top: 20px; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category:first-of-type { margin-top: 0; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category input[type=text] { display: block; width: 100%; border: none; border-radius: 3px; height: 35px; background: #384A7F; padding-left: 12px; color: #fff; transition: background .25s ease; padding-right: 58px; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category input[type=text]:hover { background: #45588E; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category input[type=text]::-ms-input-placeholder { color: #8A96B8; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category input[type=text]::-webkit-input-placeholder { color: #8A96B8; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category input[type=text]::-moz-placeholder { color: #8A96B8; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap { padding-top: 5px; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .title { color: #808FB8; font-size: 1.2rem; display: block; margin-bottom: 3px; font-weight: bold; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .search-input-wrap { margin-top: 10px; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .search-input-wrap:first-child { margin-top: 0; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties { margin-top: 10px; position: relative; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties:first-child { margin-top: 0; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .search-btn-wrap { position: absolute; top: 6px; right: 8px; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .search-btn-wrap .search-add-btn { background: none; width: 20px; height: 20px; border: none; outline: 0; border-radius: 50%; transition: box-shadow .25s ease, opacity .25s ease; opacity: 0.8; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .search-btn-wrap .search-add-btn:hover { box-shadow: 0 0 7px 0 rgba(255,255,255,0.1); opacity: 1; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .search-btn-wrap .search-add-btn img { width: 100%; height: 100%; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .explain-area { overflow: hidden; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties-label { background: rgba(0,0,0,0.5); line-height: 25px; height: 25px; color: #808FB8; padding: 0 15px; display: inline-block; font-size: 1.2rem; border-radius: 15px; letter-spacing: -1px; float: left; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .unit { color: #8A96B8; font-size: 1.2rem; margin: 0 5px; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .value-range { overflow: hidden; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .value-range input[type=text] { padding-right: 15px; display: inline-block; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .value-range .over { float: left; width: 30%; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .value-range .over input[type=text] { width: calc(100% - 50px); } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .value-range .between { float: right; width: 60%; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .value-range .between input[type=text] { width: calc(50% - 50px); } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .value-range .slash { color: rgba(138,150,184,0.5); line-height: 33px; font-size: 1.5rem; float: left; width: 10%; text-align: center; } @media all and (max-width: 500px) { #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .value-range .over { float: left; width: 90%; margin-bottom: 7px; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .value-range .between { width: 100%; } } #header_container .search-layer-wrap .search-layer .advanved-search-area .search-btn { background: #1652F0; border: none; width: 100%; border-radius: 4px; display: block; font-size: 1.5rem; color: #fff; font-weight: 300; line-height: 55px; margin-top: 20px; height: 55px; box-shadow: 0 2px 5px 0 rgba(0,0,0,0.1); transition: box-shadow .25s ease,background .25s ease; outline: 0; } #header_container .search-layer-wrap .search-layer .advanved-search-area .search-btn:hover { background: #105FFF; box-shadow: 0 5px 8px 0 rgba(0,0,0,0.15); } #header_container .search-layer-wrap .search-layer .advanved-search-area .search-btn.disabled { background: #707c99; opacity: .8; cursor: context-menu; } /* 검색레이어 카테고리 */ #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .category-select { border-radius: 3px; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .category-select .navi { padding: 5px 0; color: #808FB8; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .category-select .navi a { height: 20px; display: inline-block; line-height: 20px; letter-spacing: 0; font-size: 1.1rem; border-radius: 3px; margin: 0 3px; color: #808FB8; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .category-select .navi a.top-btn { background: #748DD5; padding: 0 10px; transition: background .25s ease; color: #fff; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .category-select .navi a:first-child { margin-left: 0; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .category-select .navi a:hover { text-decoration: underline; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .category-select .navi a.top-btn:hover { background: #869EE4; text-decoration: none; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .category-select .list { background: rgba(0,0,0,0.1); padding: 10px; padding-bottom: 5px; border-radius: 3px; max-height: 115px; overflow-y: auto; -ms-overflow-style: none; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .category-select .list::-webkit-scrollbar { display:none; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .category-select .list ul li { display: inline-block; margin-right: 15px; margin-bottom: 5px; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .category-select .list ul li a { color: #9DAACC; font-size: 1.2rem; letter-spacing: 0; margin-left: 5px; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .category-select .list ul li a:hover { text-decoration: underline; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .category-select .selected-category { margin-top: 5px; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .category-select .selected-category .list { background: none; padding: 0; max-height: auto; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .type-select .clear-btn { background: #748DD5; padding: 0 10px; transition: background .25s ease; color: #fff; border-radius: 3px; font-size: 1.1rem; line-height: 20px; height: 20px; display: inline-block; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .type-select .clear-btn:hover { background: #869EE4; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .type-select ul { display: inline-block; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .type-select ul li { display: inline-block; margin-right: 15px; } #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .type-select .checkbox-label, #header_container .search-layer-wrap .search-layer .advanved-search-area .option-category .properties-wrap .properties .type-select .radio-label { padding-left: 20px; } /* highchart no data font-size */ .highcharts-loading-inner {font-weight: bold !important;font-size : 14px !important;color:#2b3245;opacity:1;} /* 모달 */ .modal-wrap { position: fixed; z-index: 99; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); } .modal-wrap .modal { position: fixed; z-index: 100; width: 600px; height: auto; background: #fff; left: 50%; margin-left: -300px; top: 100px; border-radius: 8px; box-shadow: 0 15px 20px 5px rgba(0,0,0,0.1); } .modal-wrap .modal .modal-title-area { padding: 15px 20px; font-size: 1.65rem; font-weight: 600; height: 55px; border-bottom: 1px solid #dee3eb; position: relative; } .modal-wrap .modal .modal-title-area .close-btn { width: 50px; height: 50px; border-radius: 50%; border-style: none; background: rgba(0,0,0,0.3); position: absolute; right: -70px; top: 0; transition: background .25s ease; outline: 0; } .modal-wrap .modal .modal-title-area .close-btn:hover { background: rgba(0,0,0,0.5); } .modal-wrap .modal .modal-title-area .close-btn img { width: 100%; } .modal-wrap .modal .modal-content-area { padding: 15px 20px; background: #f5f5f5; max-height: 500px; overflow-y: auto; } .modal-wrap .modal .modal-btn-area { padding: 15px 20px; background: #fff; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; border-top: 1px solid #dee3eb; overflow: hidden; } .modal-wrap .modal .modal-btn-area button { float: right; height: 35px; padding: 0 30px; margin-left: 10px; border: none; line-height: 35px; font-size: 1.3rem; border-radius: 3px; outline: 0; transition: background .25s ease, color .25s ease; } .modal-wrap .modal .modal-btn-area button.confirm-btn, .modal-wrap .modal .modal-btn-area button.retry-btn { background: #1652f0; color: #fff; } .modal-wrap .modal .modal-btn-area button.confirm-btn:hover, .modal-wrap .modal .modal-btn-area button.retry-btn:hover { background: #0744E4; } .modal-wrap .modal .modal-btn-area button.cancel-btn, .modal-wrap .modal .modal-btn-area button.pre-btn, .modal-wrap .modal .modal-btn-area button.close-btn { background: transparent; color: #999; } .modal-wrap .modal .modal-btn-area button.cancel-btn:hover, .modal-wrap .modal .modal-btn-area button.pre-btn:hover, .modal-wrap .modal .modal-btn-area button.close-btn:hover { background: #E8E8E8; color: #666; } .modal-wrap .modal .modal-btn-area .porfolio-edit-btn { float: left; height: 35px; border-radius: 3px; line-height: 35px; font-size: 1.3rem; padding: 0 20px; color: #fff; background: #217346; } .modal-wrap .modal .modal-btn-area .porfolio-edit-btn img { width: 18px; height: 18px; margin-top: 8px; opacity: .5;} .modal-wrap .modal .modal-content-area .portfolio-select-wrap .select-wrap-head { overflow: hidden; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .select-wrap-head .search-box { height: 35px; background: #fff; position: relative; border-radius: 3px; width: 250px; cursor: pointer; transition: box-shadow .25s ease; transition: width .25s ease; border: 1px solid #dee3eb; float: left; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .select-wrap-head .search-box input[type=text] { width: 100%; height: 100%; border: none; background: transparent; outline: 0; padding-left: 10px; letter-spacing: 0; cursor: pointer; border-radius: 3px; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .select-wrap-head .search-box input[type=text]:hover, .modal-wrap .modal .modal-content-area .portfolio-select-wrap .select-wrap-head .search-box input[type=text]:active, .modal-wrap .modal .modal-content-area .portfolio-select-wrap .select-wrap-head .search-box input[type=text]:focus { box-shadow: 1px 1px 5px 0 rgba(0,0,0,0.1) inset; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .select-wrap-head .search-box .search-btn { position: absolute; top: 50%; margin-top: -10px; right: 10px; width: 20px; height: 20px; border: none; background: none; outline: 0; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .select-wrap-head .refresh-btn { float: right; height: 35px; border-radius: 3px; border: none; outline: 0; background: none; color: #666; font-size: 1.2rem;} .modal-wrap .modal .modal-content-area .portfolio-select-wrap .select-wrap-head .refresh-btn img { width: 15px; height: 15px; margin-top: 2px; margin-right: 2px; opacity: 0.5; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .list-table { overflow-y: auto; border: 1px solid #ccc; margin-top: 10px; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap table { min-width: 100%; font-size: 1.2rem; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap table th { background: #eee; padding: 10px 5px; text-align: center; font-weight: bold; border-right: 1px solid #ddd; position: relative; white-space: nowrap; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .list-table table th { padding: 7px; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap table th:last-child { border-right: none; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap table td { text-align: center; padding: 10px 5px; border-right: 1px solid #ddd; white-space: nowrap; max-width: 200px; overflow: hidden; text-overflow: ellipsis; background: #fff; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap table td.category { text-align: left; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap table td.category .plus img { width: 14px; height: 14px; margin-top: 2px; margin-right: 2px; opacity: 0.4; transition: opacity .25s ease; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap table td.category .plus:hover img { opacity: 1; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .list-table table td { padding: 7px; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap table td:last-child { border-right: none; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap table tr { border-bottom: 1px solid #ddd; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap table tbody tr:last-child { border-bottom: none; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap table td button { border-radius: 3px; height: 25px; font-size: 1.2rem; border: none; padding: 0 10px; line-height: 25px; color: #666; outline: 0; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap table tbody tr.selected td .select-btn { background: #1652f0; color: #fff; font-weight: 300; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap { overflow: hidden; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging { float:right; margin-top: 15px; display: inline-block; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging ul { overflow: hidden; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging ul li { display: inline-block; float: left; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging ul li img { width: 17px; opacity: 0.5; margin-top: 6px; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging ul li .page-move-btn.disabled img { opacity: 0.2; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging ul li a { display: inline-block; min-width: 28px; height: 30px; text-align: center; font-weight: 500; font-size: 1.2rem; color: #999; line-height: 28px; letter-spacing: 0; padding: 0 5px; border: 1px solid #dee3eb; border-right: none; background: #fff; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging ul li a.disabled { background-color: #eee; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging ul li:last-child a { border-right: 1px solid #dee3eb; border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging ul li:first-child a { border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging ul li a:hover { color: #222; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging ul li a.disabled:hover { color: #999; cursor: default; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging ul li.select a { background: #002A80; border-color: #002A80; color: #fff; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging ul li .page-move-btn { padding: 0; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging ul li .page-move-btn:hover img { opacity: 1; } .modal-wrap .modal .modal-content-area .portfolio-select-wrap .paging-wrap .paging ul li .page-move-btn.disabled:hover img { opacity: 0.2; cursor: default; } .modal-wrap .modal .modal-content-area .folder-list { border: 1px solid #ccc; background: #fff; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure { border-bottom: 1px solid #dcdcdc; padding: 15px; position: relative; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure .top-folder { line-height: 16px; font-size: 1.2rem; margin-bottom: 5px; font-weight: bold; padding-right: 50px; border-bottom: 1px solid #dee3eb; padding-bottom: 8px; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure .top-folder .subject-ico { width: 16px; display: inline-block; height: 16px; margin-right: 5px; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure .top-folder .subject-ico img { width: 100%; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure:last-child { border-bottom: none; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure .sub-folder-list .sub-folder { font-size: 1.2rem; margin-bottom: 3px; display: inline-block; padding-right: 20px; position: relative; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure .sub-folder-list .sub-folder:after { width: 15px; height: 15px; position: absolute; content: ''; background: url("../../img/svg/right_b_ico.svg"); background-size: 16px 16px; right: 0; top: 50%; margin-top: -8px; opacity: 0.3; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure .sub-folder-list .sub-folder:last-child { padding-right: 0; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure .sub-folder-list .sub-folder:last-child:after { display: none; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure.selected { border: 1px solid #1652F0; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure.selected .sub-folder-list .sub-folder { display: block; padding-right: 0; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure.selected .sub-folder-list .sub-folder:after { display: none; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure .sub-folder-list .sub-folder .dot-wrap { display: inline-block; cursor: pointer; padding: 0 6px; transition: background .25s ease; border-radius: 3px; margin-right: 5px; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure .sub-folder-list .sub-folder .dot-wrap:hover { background: #EFEFEF; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure .sub-folder-list .sub-folder .dot { cursor: pointer; margin-right: 3px; margin-bottom: 3px; background: #999; display: inline-block; width: 4px; height: 4px; border-radius: 50%; margin-right: 5px; margin-bottom: 3px; transition: background .25s ease; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure .sub-folder-list .sub-folder .dot:last-child { margin-right: 0; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure .sub-folder-list .sub-folder .dot.on { background: #1652f0; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure .select-btn { border-radius: 3px; height: 23px; font-size: 1.2rem; border: none; padding: 0 10px; line-height: 23px; color: #666; outline: 0; position: absolute; right: 15px; top: 10px; } .modal-wrap .modal .modal-content-area .folder-list .folder-structure.selected .select-btn { background: #1652f0; color: #fff; font-weight: 300; } /* alert */ .alert-container { position: fixed; z-index: 999; width: 100%; left: 0; top: -100px; padding: 0 30px; transition: top .45s ease, opacity .25s ease; opacity: 0; } .alert-container.on { top: 0; opacity: 1; } .alert-container .close-btn { float: right; width: 40px; height: 40px; border: none; background: none; outline: 0; cursor: pointer; margin-top: 5px; } .alert-container .close-btn img { width: 100%; } .alert-container.red { background: rgba(252,2,2,0.90); } .alert-container.yellow { background: rgba(255,118,0,0.90); } .alert-container.green { background: rgba(0,144,25,0.90); } .alert-container .alert .messege { color: #fff; font-weight: bold; font-size: 1.4rem; font-weight: 300; padding: 15px 0; display: inline-block; float: left; } /* block ui */ .block-pop-layer { position: fixed; z-index: 9999; top: 179px; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.6); } .block-pop-layer .block-pop { position: fixed; left: 50%; margin-left: -200px; top: 250px; width: 400px; } .block-pop-layer .block-pop .pop-header { font-size: 2.3rem; letter-spacing: -0.5px; font-weight: 700; border-top-left-radius: 4px; border-top-right-radius: 4px; color: #fff; padding: 30px 25px; background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #1652f0); background-size: 400% 400%; animation: gradient 15s ease infinite; position: relative; overflow: hidden; line-height: 30px; } @keyframes gradient { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } .block-pop-layer .block-pop .pop-header:after { width: 200px; height: 200px; background: url(../../img/common/error_w.svg); position: absolute; content: ''; top: -45px; right: -50px; opacity: .1; } .block-pop-layer .block-pop .pop-header p { color: rgba(255,255,255,0.8); font-size: 1.35rem; font-weight: 300; display: block; margin-top: 8px; line-height: 18px; } .block-pop-layer .block-pop .pop-header p a { font-weight: 500; text-decoration: underline; color: rgba(255,255,255,0.9); padding-right: 3px; } .block-pop-layer .block-pop .pop-header p .imp { text-decoration: underline; } .block-pop-layer .block-pop .pop-content { border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; background: #fff; padding: 20px 25px 25px; } .block-pop-layer .block-pop .pop-content .login { margin-bottom: 20px; } .block-pop-layer .block-pop .pop-content .login .sns { margin-top: 10px; } .block-pop-layer .block-pop .pop-content .login input[type=text], .block-pop-layer .block-pop .pop-content .login input[type=password] { width: 100%; height: 30px; border: none; background: #EDEDED; height: 40px; border-radius: 4px; padding-left: 15px; margin-bottom: 5px; letter-spacing: 0; } .block-pop-layer .block-pop .pop-content .login input::-ms-input-placeholder { color: #888; } .block-pop-layer .block-pop .pop-content .login input::-webkit-input-placeholder { color: #888; } .block-pop-layer .block-pop .pop-content .login input::-moz-placeholder { color: #888; } .block-pop-layer .block-pop .pop-content .head { font-size: 1.2rem; display: block; margin-bottom: 8px; color: #999; font-weight: 500; } .block-pop-layer .block-pop .pop-content .login .login-btn { height: 40px; background: #19298E; display: block; color: #fff; border-radius: 4px; text-align: center; font-size: 1.35rem; line-height: 40px; transition: background .25s ease; } .block-pop-layer .block-pop .pop-content .login .login-btn:hover { background: #0921B9; } .block-pop-layer .block-pop .pop-content .sns button { width: 24%; display: inline-block; float: left; text-align: center; vertical-align: top; height: 35px; border: none; color: #fff; border-radius: 4px; transition: background .25s ease; outline: 0; float: left; margin-right: 1.3333%; } .block-pop-layer .block-pop .pop-content .sns button:last-of-type { margin-right: 0; } .block-pop-layer .block-pop .pop-content .sns button img { width: 20px; } .block-pop-layer .block-pop .pop-content .sns button.facebook { background: #4C69BA; } .block-pop-layer .block-pop .pop-content .sns button.facebook:hover { background: #3C5393; } .block-pop-layer .block-pop .pop-content .sns button.google { background: #e24530; } .block-pop-layer .block-pop .pop-content .sns button.google:hover { background: #d5341e; } .block-pop-layer .block-pop .pop-content .sns button.linkedin { background: #1388C8; } .block-pop-layer .block-pop .pop-content .sns button.linkedin:hover { background: #0776B3; } .block-pop-layer .block-pop .pop-content .sns button.naver { background: #19ce60; } .block-pop-layer .block-pop .pop-content .sns button.naver:hover { background: #0DB750; } .block-pop-layer .block-pop .pop-content .sns .head { float: left; width: 100%; } .block-pop-layer .block-pop .pop-content .sns button { float: left; } .block-pop-layer .block-pop .pop-content .sns .notice { float: left; width: 100%; font-size: 1.15rem; margin-top: 5px; color: #999; font-weight: 300; } .block-pop-layer .block-pop .pop-content .register-btn { width: 100%; height: 40px; line-height: 38px; background: #393939; display: block; border-radius: 4px; text-align: center; color: #F1F1F1; font-size: 1.35rem; font-weight: 300; } .block-pop-layer .block-pop .pop-content .register .notice { display: block; width: 100%; font-size: 1.15rem; margin-top: 5px; color: #999; font-weight: 300; } .block-pop-layer .block-pop .pop-content .apply .plan-view-btn { height: 45px; background: #19298E; display: block; color: #fff; border-radius: 4px; text-align: center; font-size: 1.35rem; line-height: 45px; transition: background .25s ease; } .block-pop-layer .block-pop .pop-content .apply .plan-view-btn:hover { background: #0921B9; } .block-pop-layer .block-pop .pop-content .apply p { font-size: 1.2rem; margin-top: 15px; color: #666; font-weight: 400; border-top: 1px solid #dee3eb; padding-top: 15px; } .block-pop-layer .block-pop .pop-content .apply p a { text-decoration: underline; padding: 0 2px; font-weight: 500; color: #666; } .block-pop-layer .block-pop .pop-content .apply p a:hover { color: #222; } .block-pop-layer .block-pop .pop-content .apply p .imp { text-decoration: underline; } .block-pop-layer .block-pop .view-option-area { margin-top: 10px; text-align: right; } .block-pop-layer .block-pop .view-option-area #today_not_view { display: none; } .block-pop-layer .block-pop .view-option-area #today_not_view + .check-label { position: relative; color: #fff; font-size: 1.3rem; font-weight: 100; cursor: pointer; } .block-pop-layer .block-pop .view-option-area #today_not_view + .check-label:before { width: 15px; height: 15px; position: absolute; content: ''; background: url("../../img/report/pop_check_box.png"); background-size: 15px 30px; left: -25px; top: 3px; background-position: 0 0; } .block-pop-layer .block-pop .view-option-area #today_not_view:checked + .check-label:before { background-position: 0 -15px; } .block-pop-layer .block-pop .view-option-area .close-btn { background: none; border: none; color: #fff; line-height: 24px; font-weight: 100; font-size: 1.3rem; margin-left: 10px; } .block-pop-layer .block-pop .view-option-area .close-btn img { width: 25px; } /* 유저정보 */ .login-user { position: absolute; right: 200px; bottom: 103px; height: 25px; } .login-user .user-info { display: inline-block; padding-left: 15px; padding-right: 5px; border-radius: 50px; transition: background .25s ease; height: 25px; padding-top: 1px; } .login-user .user-info .account-ico { width: 19px; margin-top: 2px; margin-right: 3px; opacity: 0.6; } .login-user .user-info .name { font-weight: 400; letter-spacing: -0.3px; display: inline-block; font-size: 1.2rem; } .login-user .user-info .name img { width: 15px; height: 15px; margin-top: 2px; } .login-user .user-info:hover { background: rgba(0,0,0,0.1); } .login-user .plan-info { position: absolute; background: #fff; right: 100%; bottom: 200px; border-radius: 4px; color: #222; padding: 10px 15px; box-shadow: 0 5px 15px -2px rgba(0,0,0,0.5); z-index: -9999; opacity: 0; transition: opacity 1s ease; font-size: 1.2rem; } .login-user .user-info:hover ~ .plan-info { z-index: 10; opacity: 1; right: 100%; bottom: -70px; } .login-user .plan-info:hover { z-index: 10; opacity: 1; right: 100%; bottom: -70px; } .login-user .plan-info .row { margin-bottom: 2px; white-space: nowrap; } .login-user .plan-info .row:last-child { margin-bottom: 0; } .login-user .plan-info .row .head { font-weight: bold; color: #999; width: 45px; display: inline-block; position: relative; } .login-user .plan-info .row .head:after { width: 1px; height: 12px; right: 5px; top: 3px; position: absolute; content: ''; background: #e5e5e5; } .login-user .plan-info .row .cont { letter-spacing: 0; } .login-user .plan-info .plan-upgrade-btn { background: #19298E; display: block; width: 100%; margin-left: 0; margin-top: 10px; text-align: center; height: 30px; line-height: 30px; border-radius: 3px; font-size: 1.2rem; font-weight: 100; color: #fff; } /* 로딩 */ .loading-wrap {position: fixed; top:0; left: 0; z-index: 99; width: 100%; height: 100%; background:rgba(0,0,0,0.8);} .loading-wrap .loading {position: absolute; top:50%; left: 50%; transform:translate(-50%, -50%);} .loading-wrap .loading .lds-txt {text-align: center; } .loading-wrap .loading .lds-txt p { font-size: 1.5rem; font-weight: 600; color: #fff; } .loading-wrap .loading .lds-ellipsis {display: inline-block; position: relative; width: 80px; height: 80px; left:20px;} .loading-wrap .loading .lds-ellipsis div { position: absolute; top: 33px; width: 13px; height: 13px;border-radius: 50%; background: #fff; animation-timing-function: cubic-bezier(0, 1, 1, 0);} .loading-wrap .loading .lds-ellipsis div:nth-child(1) { left: 8px; animation: lds-ellipsis1 0.6s infinite;} .loading-wrap .loading .lds-ellipsis div:nth-child(2) { left: 8px; animation: lds-ellipsis2 0.6s infinite;} .loading-wrap .loading .lds-ellipsis div:nth-child(3) { left: 32px; animation: lds-ellipsis2 0.6s infinite;} .loading-wrap .loading .lds-ellipsis div:nth-child(4) { left: 56px; animation: lds-ellipsis3 0.6s infinite;} @keyframes lds-ellipsis1 { 0% { transform: scale(0); } 100% { transform: scale(1); } } @keyframes lds-ellipsis3 { 0% { transform: scale(1); } 100% { transform: scale(0); } } @keyframes lds-ellipsis2 { 0% { transform: translate(0, 0); } 100% { transform: translate(24px, 0); } } #header_container .page-back { position: relative; width: 100%; padding: 10px 30px 13px; background: #1652f0; } #header_container .page-back a { font-size: 1.15rem; color: #fff; border-radius: 5px; padding: 3px 10px; background: rgba(0,0,0,0.3); transition: background .3s;} #header_container .page-back a:hover { background: rgba(0,0,0,0.4); }