@charset "UTF-8";

/*0831 황혜인추가*/

* { margin: 0; padding: 0; box-sizing: border-box;}
body { color: #212121; background-color: #fff;}
body.on { overflow: hidden;}
a { text-decoration: none; color: #212121;}
ul, li, ol {list-style: none;}
img { vertical-align: middle; max-width: 100%;}
.wrap { width: 1200px; margin: 0 auto;}
button { cursor: pointer; padding: 0;}
button, input { border: none; background:transparent;}
button, :focus, :active { outline: 0;}
button:focus, button:active { padding: 0;}
button span, button img { position: relative;}
.hidden { text-indent: -99999px; overflow: hidden; font-size: 0; display: none;}
.cb:after { clear: both; display: block; content: '';}

.mNone {display: none !important;}

/* 임시로 숨기기 :: 요청사항 */
 .container02 {height: 40px; overflow: hidden;}
.topBanner, .container02 .wrap { display: none !important;} 

/* 공통 */
.bg01 {background-color: #f2f4f7 !important;}
.color01 {color: #1d398d;}
.color02 {color: #4c4c4c !important;}

.subText {display: block; font-size:13px; font-weight: 300; font-style: normal; color: #54628c;}
.moreBtn {display: block; width: 180px; height: 60px; line-height: 58px; border: 1px solid #878787; text-align: center; font-size:16px; -webkit-transition: background-color .3s, border-color .3s;-ms-transition: background-color .3s, border-color .3s;transition: background-color .3s, border-color .3s;}
.moreBtn:hover {background:#1d398d; color: #fff; border-color: #1d398d;}

/* 메인 */
.topBanner {font-family: 'Noto Sans', sans-serif;padding: 75px 0 80px; text-align: center;}
.topBanner h2 {font-size:32px;font-weight: 500;}
.topBanner em {display:block;font-size:16px;font-style: normal;}

.searchBox { margin-top: 30px; display: inline-block; text-align: center; font-size: 0; height:60px; line-height: 58px; border: 1px solid #ebebeb;}
.searchBox input { display: inline-block; vertical-align: top; width: 400px; height: 100%;padding: 5px 15px;  font-size:16px; background: #fff; text-align: left;border:0;}
.searchBox input::placeholder {color:#b2b2b2;}
.searchBox button {-webkit-transition: background-color 1s;-ms-transition: background-color 1s;transition: background-color 1s; display: inline-block; vertical-align: top; width: 178px; height: 100%; background: #1d398d; color: #fff; font-size: 16px;}
.searchBox button:hover {background:#10236d;}


.container01 {font-family: 'Noto Sans', sans-serif; padding: 80px 0 0; background: url('../img/container01.jpg') no-repeat center top -80px/cover;}
.container01 h2 {margin-top: 30px; font-size:32px;}
.container01 h2 span {display:block;}
.container01 .text { margin-top: 40px; position: relative; width: 680px; padding: 30px 40px; background: #fff; text-align: justify; font-size: 14px;}
.container01 .text span {display: block; margin-bottom: 40px;}
.container01 .moreBtn {margin-top: 60px;}

.container02 { font-family: 'Noto Sans', sans-serif; padding: 80px 0;text-align: center;}
.container02 h2 {font-size: 32px;padding-bottom: 40px;}
.container02 ul {}
.container02 ul li { float: left; width: 33.333%; padding: 0 10px;}
.container02 ul li div {width: 100%; height: 280px; background: url('../img/list01.jpg') no-repeat center 0/cover;}
.container02 ul li:nth-of-type(2) div {background-image: url('../img/list02.jpg');}
.container02 ul li:nth-of-type(3) div {background-image: url('../img/list03.jpg');}
.container02 ul li p {min-height: 230px; padding: 40px 40px 0; background: #fff; border: 1px solid #ebebeb; border-top: none; text-align: center;}
.container02 ul li p b { display: block; font-size:24px; padding-bottom: 30px;}
.container02 ul li p span { display: block; font-size:16px; word-break: keep-all;}

/* 서브좌측메뉴 */
.subMenu {float: left; width: 200px; padding:40px 0 0 26px; min-height: 690px; background: #fff; text-align: left;}
.subMenu h3, .subMenu p {font-weight: 600;font-size: 18px;}
.subMenu ul {padding-top: 30px;}
.subMenu ul li { padding-bottom: 11px;}
.subMenu ul li a {padding-bottom: 3px; border-bottom: 1px solid #fff; font-size:14px; -webkit-transition: border-bottom .3s;-ms-transition: border-bottom .3s;transition: border-bottom .3s;}
.subMenu ul li.on a {border-bottom: 1px solid #868686;}
.subMenu:not(.noHover) ul li a:hover {border-bottom: 1px solid #868686;}

/* 서브 */
.subInner {float:left; width:calc(100% - 200px);padding: 40px 0 0 40px;}
.subInner h3 {font-size:32px; color:#10236d; font-weight: 500;}
.subInner h3 span {display:block;font-size:13px; font-weight: 300;}
.subInner .inner {margin-top: 40px;}
.subInner .inner ul {min-height: 500px; margin-bottom: 26px;}
.subInner .inner ul li { float:left; padding: 5px; width: 20%; font-size: 12px;}
.subInner .inner ul li a {padding: 10px; display: block; width: 100%; height: 120px; line-height: 118px; text-align: center; border: 1px solid #ebebeb; background: #fff;}
.subInner .inner ul li a img { vertical-align: baseline;max-height: 100%; width: auto; max-width: none;}
.subInner .inner ul li a span { display: block;line-height:110px;}


.subSearch {text-align:center;}
.subSearch .searchBox {margin: 0; height:40px; line-height: 38px; border: 1px solid #ebebeb;}
.subSearch .searchBox input { display: inline-block; vertical-align: top; width: 280px; height: 100%;padding: 5px 15px;  font-size:13px; background: #fff; text-align: left;}
.subSearch .searchBox input::placeholder {color:#b2b2b2;}
.subSearch .searchBox button {width: 118px; font-size: 13px;}


.btnInner a.btn_b02, .btnInner .btn_b02 {display: block; float:right;margin-left: 10px;}


/* 페이징 */
.pageInner {text-align: center; margin: 26px auto 0;}

/* 유명상표 */
.sub01 {padding: 0 0 40px;}

/* 0828 추가작업시작 */

/* 유명상표 뷰 */
.viewTable { margin: 20px 0;border:1px solid #c8cacc;}
.viewTable table {border-collapse: collapse;}
.viewTable .table01,.viewTable .table02 ,.viewTable .table03 {width: 100%;}
.viewTable .logoBox {padding: 0;}
.viewTable .logoBox a {display: block; width: 50%; height: 160px; line-height: 158px; float: left;padding: 10px;}
.viewTable .logoBox a img { width: auto; height: 100%; max-width: none; vertical-align: baseline;}
.viewTable .logoBox a:nth-of-type(1) {border-right: 1px solid #d9dbde;border-bottom: 1px solid #d9dbde;}
.viewTable .logoBox a:nth-of-type(2) {border-bottom: 1px solid #d9dbde;}
.viewTable .logoBox a:nth-of-type(3) {border-right: 1px solid #d9dbde;}
.viewTable .logoBox a:nth-of-type(4) {}
.viewTable table th {font-size: 13px;color: #333; background: #edeff2;font-weight: 400; border-bottom: 1px solid #d9dbde;border-right: 1px solid #d9dbde;}
.viewTable table .subTd {background: #fff;color: #333;font-weight: 500;border: 1px solid #d9dbde;}
.viewTable table td {font-size: 13px;font-weight:300;border-bottom: 1px solid #d9dbde;background: #fff;color: #000; padding: 21px 10px; text-align: center;}
.viewTable table td a {background: #fff;color: #333; font-size:11px;}
.viewTable table td .link01 { padding:7px;border:1px solid #ccc;}

/* .viewTable .lastTr th, .viewTable .lastTr td {height:184px;} */
.viewTable .table02 th {padding:20px 0;}

.table-wrap table {float: left; width: 50%;}
.th-wid {width: 145px;}
.table-wrap table:nth-of-type(2) th {border-left:1px solid #d9dbde;width: 50%;}
.table-wrap table:nth-of-type(2) td {height:64px;border-right: 1px solid #fff;width: 50%;}
.viewTable .table03 td {border-bottom: none;}
.viewTable .table02 tr:nth-of-type(1) th {border-right:none;}
.viewTable .table02 tr:not(:nth-of-type(1)) th {border-left:none;}

/* 상표 글쓰기 */
.write-wrap {padding: 30px 0 76px;}
.write-wrap .tti {padding-left:.5%;font-size: 32px; color: #10236d; font-weight: 500;}
.write-wrap .subText {padding-left:.5%}
.write-wrap .wri_select {margin: 25px 0;}
.write-wrap .wri_select .sel-list { float:left;margin: 0 6px;}
.write-wrap .wri_select .sel-box {position: relative; border:1px solid #d9dbde; padding-right: 15px; width: 288px; height: 64px; background: #fff;}
.write-wrap .wri_select .sel-box label {position: absolute; top: 8px; left: 15px; display: block; font-size: 12px; color: #333;}
.write-wrap .wri_select .sel-box select {cursor: pointer; border: none; width: 100%; height: 100%; padding: 25px 15px 15px 10px;font-size:16px; color:#333;}
.sel-check {font-size:12px;color:#333;}
.sel-check input[type="checkbox"] {cursor: pointer; width: 15px;height: 15px;display: inline-block; vertical-align: sub;}

.wri-info .info-box {position: relative; float: left; border:1px solid #d9dbde; margin: 0 .5% 40px; width: 24%; height: 64px; background: #fff;}
.wri-info .info-box .frm_input {width:calc(100% - 15px);height: 100%;margin-left:15px;padding:25px 0 0 0;border-radius: 0;border:none;font-size:13px;color:#333;}
.wri-info .info-box .frm_input::placeholder {font-size: 13px;color: #b2b2b2;font-weight: 300;}
.wri-info .info-box label {position: absolute; top: 8px; left: 15px; display: block; font-size: 12px; color: #333;}
.last-info.wri-info {margin-top: 10px;}
.last-info.wri-info .info-box {width: 99%; height: 160px;line-height: 1.5;}
.last-info.wri-info .info-box .frm_input {padding-top:40px;padding-left:15px;margin-left:0;vertical-align: top;resize: none;width: 100%; height: 140px;text-align: left;}

.wri-title {position: relative; border:1px solid #d9dbde; margin:0 .5%; width: 99%; height: 64px; padding-left:15px;background: #fff;}
.wri-title .frm_input {width:100%;height: 100%;padding:25px 180px 0 0;border-radius: 0;border:none;font-size:13px;color:#333;}
.wri-title .frm_input::placeholder {font-size: 13px;color: #b2b2b2;font-weight: 300;}
.wri-title label {position: absolute; z-index: 10; top: 8px; left: 15px; display: block; font-size: 12px; color: #333;}
.wri-title button.btn_frmline {position: absolute; right: 18px; top: 14px; padding:9px 12px; font-size:12px;font-weight: 300;color: #fff;background: #5c5e66;border-radius: 0;}
button.btn_frmline:active {padding:9px 12px;}

.wri-file-border { margin:0 .5%; border-top:1px solid #d9dbde;}
.wri-file-wrap {border:1px solid #d9dbde; border-top:none;height: 62px;}
.wri-file-wrap .file-tti {float:left;width: 160px;height:100%;line-height:60px;padding:0 0 0 15px;background:#edeff2;font-size:14px;color:#333;}
.wri-file-wrap .wri-file {float:left;width: calc(100% - 160px);height:100%;background: #fff;padding: 6px;}
.wri-file-wrap .wri-file .wri-filebox {display: inline-block; width: 200px; overflow: hidden; vertical-align: middle;padding-top: 11px;}
.wri-file-wrap .wri-file .file_del {display: inline-block; vertical-align: middle;font-size:12px;color:#333;padding-top: 12px;}
.wri-file-wrap .wri-file .file_del input {vertical-align: middle;}
.wri-filebox input[type="file"] {font-size:13px;}

.wri-taxtbox {margin:10px 0 10px .5%;}
.wri-taxtbox textarea {height: 320px !important;resize: none; width: 99.5% !important;overflow-y:auto;border-radius: 0; border: 1px solid #d9dbde;}

.wri-btn {text-align: center; font-size: 0; margin-top: 16px;}
.wri-btn a {cursor: pointer; display: inline-block; margin:0 6px; vertical-align: top; text-align: center; width: 96px;height:60px;line-height: 60px;font-weight:400;font-size: 16px;color: #fff;background: #969799;}
.wri-btn input {cursor: pointer;display: inline-block;margin:0 6px;vertical-align: top;width:180px;height:60px;line-height:60px;font-size:16px;font-weight:300;color:#fff;background: #1d398d;}

.allHidden {padding:6px;font-size:14px}
.allHidden {}

/* 0828:19시09분 추가 */
/* sub*/
.sub-wrap {padding: 80px 0;}
.sub-title {text-align: center;margin-bottom: 40px;}
.sub-title h2 {font-size:32px;font-weight:500;letter-spacing: -2px; color:#1d398d;}
.sub-title p {font-size: 16px;}

/* contactUs */
.contactUs {}
.contactUs article {}
.contactUs article > div {width: 50%; float: left;}
.contactUs article .map iframe {width: 100%; height: 480px;}
.contactUs article ul {border-left:1px solid #d9dbde; border-right: 1px solid #d9dbde; border-top: 1px solid #d9dbde;}
.contactUs article ul li {width: 100%; border-bottom: 1px solid #d9dbde;min-height: 60px; background: #fff;}
.contactUs article ul li .tti {width: 200px;float:left; text-align: center; line-height: 60px; background: #edeff2;border-right: 1px solid #d9dbde;font-size:13px;color:#333;}
.contactUs article ul li .inner {width: calc(100% - 200px);float:left;padding:16px 0 0 16px;}
.contactUs article ul li .inner b {display:block; font-size:13px;color:#333;padding-bottom: 9px;}
.contactUs article ul li .inner p {font-size: 13px; color: #333;line-height: 1.5;}

.contactUs article ul .logo {padding: 34px 0; text-align: center;}
.contactUs article ul .name {min-height: 80px;}
.contactUs article ul .name .tti {line-height:80px;}
.contactUs article ul .ard {min-height: 100px;}
.contactUs article ul .ard .tti {line-height:100px;}

/* sitemap */
.sitemap {}
.sitemap article {font-size: 0; text-align: center;}
.sitemap article .map-s {display: inline-block;padding: 0 10px;}
.sitemap article .map-s .subMenu.subMenu-1 {height: 520px;min-height: 0; border: 1px solid #ebebeb;}
.sitemap article .map-s1 p {margin-bottom: 18px;}
.sitemap article .map-s1 .subMenu.subMenu-1 ul li p a{font-size: 18px;font-weight: 600;}


/* 이용약관, 개인정보 공통 */
.TermsofUse .inner {border: 1px solid #d9dbde;background: #fff;padding: 60px 40px;min-height: 500px; font-size:14px; color:#4c4c4c;}


#autosave_wrapper {position:relative}
#autosave_pop {display:none;z-index:10;position:absolute !important;top:64px;right:0;width:350px;height:auto !important;height:180px;max-height:180px;border:1px solid #565656;background:#fff;
-webkit-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);
box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);}
#autosave_pop:before{content: "";position: absolute;top: -8px;right: 45px;width: 0;height: 0;border-style: solid;border-width: 0 6px 8px 6px;border-color: transparent transparent #000 transparent;}
#autosave_pop:after{content: "";position: absolute;top: -7px;right: 45px;width: 0;height: 0;border-style: solid;border-width: 0 6px 8px 6px;border-color: transparent transparent #fff transparent;}
html.no-overflowscrolling #autosave_pop {height:auto;max-height:10000px !important} /* overflow 미지원 기기 대응 */
#autosave_pop strong {position:absolute;font-size:0;line-height:0;overflow:hidden}
#autosave_pop div {text-align:center;margin:0 !important;}
#autosave_pop button {margin:0;padding:0;border:0;}
#autosave_pop ul {padding:15px;border-top:1px solid #e9e9e9;list-style:none;overflow-y:scroll;height:130px;border-bottom:1px solid #e8e8e8}
#autosave_pop li {padding:8px 5px;border-bottom:1px solid #fff;background:#eee;zoom:1}
#autosave_pop li:after {display:block;visibility:hidden;clear:both;content:""}
#autosave_pop a {display:block;float:left;font-size:12px;}
#autosave_pop span {display:block;float:right;font-size:12px;color:#000}
.autosave_close {cursor:pointer;width:100%;height:30px;background:none;color:#888;font-weight:bold;font-size:12px;}
.autosave_content {display:none}
.autosave_del{background:url(./img/close_btn.png) no-repeat 50% 50%;text-indent:-999px;overflow:hidden;height:20px;width:20px;}



@media screen and (max-width: 1230px){
    .wrap {width: 100%; padding: 0 4%;}

    /* main */
    .container02 ul li p {padding: 40px 10px 0;}


    /* 서브좌측메뉴 */
    .subMenu:not(.subMenu-1) {float: none; width: auto; padding: 0; min-height: 0; background: none;}
    .subMenu:not(.subMenu-1) h3 {padding: 10px; cursor: pointer; border: 1px solid #ebebeb; background: #fff  url('../img/icon02.png') no-repeat right 10px top 50%/8px auto;;}
    .subMenu:not(.subMenu-1) ul {display: none; padding: 10px; background: #fff;}
    /* 서브 */
    .subInner {float: none; width: 100%; padding: 40px 0;} 
    .subInner .inner ul {width: 101.5%; overflow: hidden;}
    .subInner .inner ul li {width: 25%; padding: 5px 5px 5px 0;}
    /* 유명상표 */
    .sub01, .sub02 {padding-top: 40px;}

    /* 사이트맵 */


}

@media screen and (max-width: 1200px){
    /* Contact Us */
    .contactUs article > div {float: none; width: 100%;}
    .contactUs article .map  {margin-bottom: 20px;}
    .contactUs article .map iframe {height: 400px;}
}

@media screen and (max-width: 1020px){ 
    /* main */
    .topBanner h2,
    .container01 h2,
    .container02 h2,
    .sub-title h2,
    .subInner h3 {font-size:28px;}
    .container02 ul li p b {font-size:20px;}
    .container02 ul li p span {font-size: 14px;}

    .table-wrap table {width: 100%; float:none;}
    .table-wrap table:nth-of-type(2) th {width:145px;border-left:none;}
    .table-wrap table:nth-of-type(2) td {width:calc(100% - 143px); text-align:left;}

    /* 글쓰기 */
    .wri-info .info-box {width: 32.333%;}

    .wri-file-wrap .wri-file .wri-filebox {display: block;padding-top: 0; width: auto; overflow: visible; }
    .wri-file-wrap .wri-file .file_del {display: block;padding-top: 5px;}
    .wri-file-wrap .wri-file .file_del input {vertical-align: middle;}

}
@media screen and (max-width: 755px){ 
    /* main */
    .container01 .text {width: 100%; margin: 40px auto 0;}
    .container02 ul li {float:none; width: 100%;margin-bottom: 40px;}
    .container02 ul li p {min-height: auto; padding: 40px 10px;}
    .container02 ul li div {background-position:  center 50%; height: 270px;}
    /* sub */
    .subInner .inner ul li {width: 50%;}

    /*0812 테이블 추가*/
    .viewTable .table02 {width: 100%; float:none;}
    /*0812 테이블 끝*/

    /* 글쓰기 */
    .write-wrap .wri_select .sel-list {width: 49%; margin: 0 .5%;}
    .write-wrap .wri_select .sel-box {width: 100%;}

    /* Contact Us */
    .contactUs article ul li .tti {width: 100px;}
    .contactUs article ul li .inner {width: calc(100% - 100px);}
    .contactUs article ul li .inner p {word-break: keep-all;}

    /* 사이트맵 */
    .subMenu.subMenu-1 {float: none; width: auto; padding: 0; min-height: 0; background: none;}
    .subMenu.subMenu-1 h3 {padding: 10px; cursor: pointer; border: 1px solid #ebebeb; background: #fff  url('../img/icon02.png') no-repeat right 10px top 50%/8px auto;;}
    .subMenu.subMenu-1 ul {display: none; padding: 10px; background: #fff;}
    .sitemap article .map-s:not(.map-s1) .subMenu.subMenu-1 {border:none;}
    .sitemap article .map-s .subMenu.subMenu-1 {height: auto;background: #fff;}
    .sitemap article .map-s1 .subMenu.subMenu-1 {padding: 10px;}
    .sitemap article .map-s1 p {margin: 20px 0;}
    .sitemap article .map-s {width: 100%;display: block;margin-bottom:20px;}

}

@media screen and (max-width: 700px){ 
     /* main */
    .searchBox {width: 80%; margin: 30px auto 0; }
    .searchBox input,.subSearch .searchBox input {width: 80%;}
    .searchBox button,.subSearch .searchBox button {width:20%;}
    .topBanner h2, .container01 h2, .container02 h2 {word-break: keep-all;}

     /*0812 테이블 추가*/
    .sub02 {overflow: hidden;}
    .viewTable {margin: 40px 0;}
    .pcNone {display: none;}
    .mNone {display: block !important;}
    .mNone th {display: block;width: 100%; padding: 21px 0;}
    .viewTable .table01 td {text-align:center !important;}
    .viewTable table th {border-right: none;}

    /* 글쓰기 */
    .wri-info .info-box {width: 49%;}

    /* Contact Us */
    .sub-title p {word-break: keep-all; font-size: 15px;}
    .sub-title p br {display: none;}

}
@media screen and (max-width: 499px){ 
    /* 공통 */
    .moreBtn {font-size:13px; height: 50px; line-height: 48px;}

    /* main */
    .topBanner h2, .container01 h2, .container02 h2, .subInner h3, .sub-title h2  {font-size:18px;}
    .topBanner em {font-size:13px;}
    .topBanner {padding: 50px 0;}
    .searchBox {height: 40px; line-height: 38px;}
    .searchBox input {padding:5px; font-size:12px;}
    .searchBox button {font-size:12px;}
    .container01 {padding: 40px 0 0;}
    .container01 .text {padding: 20px 10px; text-align: left; word-break: keep-all;}
    .container01 .moreBtn {margin: 30px auto 0;}
    .container02 {padding: 40px 0;}
    .container02 ul li div {height: 160px;}
    .container02 ul li p {padding: 25px 10px;}
    .container02 ul li p b { font-size: 15px; padding-bottom: 15px;}
    .container02 ul li p span {font-size:13px;}

    /* sub */
    .subInner h3 span {display: block; padding-top: 10px; font-size: 12px;}

    /* 테이블 */
    .table-wrap table:nth-of-type(2) td {width: 50%;}
    .th-wid {width: 50%;}

    /* 글쓰기 */
    .wri-file-wrap {height: auto;}
    .wri-file-wrap .file-tti {width: 100%;float:none;}
    .wri-file-wrap .wri-file {width: 100%;float:none;padding: 15px 6px;}
    .wri-btn a, .wri-btn input {height: 40px; line-height: 40px; font-size: 12px;}

    /* Contact Us  */
    .contactUs article .map iframe {height: 250px;}
    .contactUs article ul li .tti {width: 70px;}
    .contactUs article ul li .inner {width: calc(100% - 70px); padding: 16px 5px;}
    .contactUs article ul .name {min-height: 100px;}
    .contactUs article ul .name .tti {line-height: 100px;}
    .contactUs article ul .ard {min-height: 140px;}
    .contactUs article ul .ard .tti {line-height:140px;}

    /* 이용약관, 개인정보 공통 */
    .TermsofUse {padding: 30px 0;}


}