@charset "utf-8";
@import url(/assets/font/font_artheart.css);

* { margin: 0; padding: 0; }
body, input, textarea, table, input, select, textarea { font-size:15px; font: 14px Noto Sans KR, NanumBarunGothic, 맑은 고딕, Dotum,Gulim,Arial;/* 나눔고딕, 'NanumBarunGothic' */ color:#010101; line-height:1.2; font-weight:normal; }
h1, h2, h3, h4, h5 {font-weight:400;color:#010101; font-family: NanumBarunGothic,AppleSDGothicNeo-Regular,'Malgun Gothic','맑은 고딕',dotum,'돋움',sans-serif }
div {color:#000; text-align:left; cursor:default; word-break:break-word;}

h1 {font-size:36px;}
h2 {font-size:30px;}
h3 {font-size:24px;}
h4 {font-size:18pt;}
h5 {font-size:16pt;}

em, address {font-style: normal;}
a { text-decoration: none; color:#010101; }
a:hover{color: #000; cursor: pointer;}
img { border: 0; display: inline-block; vertical-align: middle; }
ul, ol, li { list-style: none; }
hr {display:none;}
form { margin: 0px; padding: 0px; }

input, select, textarea { vertical-align: middle; border:none; -webkit-box-sizing: border-box; }

/* body, input, textarea,  table,input, select, textarea  { font-size:14px; } */

input[type=text],input[type=password] , .file_input input[type=text], .file_input label input, table textarea {border:1px solid #b5b5b5; box-sizing: border-box;  color:#000;  background-color: #fff;}
input[type=text]:disabled,input[type=password]:disabled, input[type="checkbox"]:disabled { background:#d0e4f3; }

input[type=file], input[type=text], input[type=password], textarea  { padding:7px 5px; box-sizing: border-box; background: #fff; min-height:33px;}


/* 첨부파일 스타일 */
.file_input label { position:relative; cursor:pointer; display:inline-block; vertical-align:middle; overflow:hidden; width:100px; height:33px; background:#777; color:#fff; text-align:center; line-height:33px; }
.file_input label input  {display: none;}
/* 파일업다운버튼 스타일 */
.file_drag { width: 60%; color: white; padding: 3px 0px 4px 0; text-align: center;  float: left; margin-top:2px;}
.file-uploads { margin:3px 0 -4px 0;}

/* .file_input input[type=text]  {vertical-align:middle; display:inline-block; width:400px; height:31px; line-height:31px; padding:0; border:0; border:1px solid #777;} */

input[type="radio"] ,input[type="checkbox"] { box-sizing: border-box; margin-right:5px;/* border:1px solid #ddd; */ width: 18px !important; height: 18px; /* *width: 18px !important; */vertical-align: sub; cursor: pointer;}
input[type="radio"]:hover ,input[type="checkbox"]:hover { border:none;}
input[type="radio"] + label , input[type="checkbox"] + label { margin:0 12px 0 2px; cursor: pointer; }
input[type="radio"] + label span { display:inline-block; padding:3px 20px; background-color:#fff; vertical-align:middle; color:#222; cursor:pointer;border-radius: 15px;}
input[type="radio"]:checked + label span {border-radius:15px;background-color:#ee9628;color:#fff;}

label { cursor: pointer;}

textarea {overflow:auto; padding:5px; border:1px solid #ddd;}

select { padding: 6px 16px 6px 10px; height:34px;/* 공지 검색기준 */ box-sizing: border-box; font-family: inherit;  /* 폰트 상속 */ background: url(/artheart/images/common/bg_select_arrow.png) no-repeat 90% 50%; /* 네이티브 화살표 대체 */ border: 1px solid #b5b5b5; background-color:#fff; border-radius: 0px; /* iOS 둥근모서리 제거 */ -webkit-appearance: none;-moz-appearance: none; appearance: none;  cursor: pointer;}
select::-ms-expand { display:none !important;}

select.disable{background-color: #ececec; color: #999;}
option {padding-right:6px;} /* Firefox Fix */


/*placeholder color */
::-webkit-input-placeholder { /* Chrome */ color: #ccc; }
::-ms-input-placeholder { /* IE 10+ */ color: #ccc; }
::-moz-placeholder { /* Firefox 19+ */ color: #ccc; opacity: 1; }
:-moz-placeholder { /* Firefox 4 - 18 */ color: #ccc; opacity: 1; }
input::-ms-clear {display: none;} /* 아이폰 음영 초기화 */

input:hover, textarea:hover, select:hover
, input:active, textarea:active, select:active
{ border:1px solid #999; cursor: pointer;}


input[type=file],  input[type=file]:hover, input[type=file]:active { border:none;}


.dim1 { display: none;}
@media screen and (max-width:640px){
/*   body, input, textarea, table, input, select, textarea { font-size:14px;} */
  img { max-width:100%;}
  h1 {font-size:28px;}
  h2 {font-size:24px;}
  h3 {font-size:20px;}
  h4 {font-size:16pt;}
  h5 {font-size:14pt;}

  input[type="radio"] + label , input[type="checkbox"] + label { margin:0 2px 0 0px; cursor: pointer; }

  /* .file_input label { margin-top:0;} */
 /*  .file_input label input { margin-top:0 !important;} */
.dim_mmenu { display:inline-block; height:100%; width:100%; position:fixed; left:0; top:0; z-index:9 !important; background-color:black; filter: alpha(opacity=50); /* internet explorer */ -khtml-opacity: 0.4;      /* khtml, old safari */ -moz-opacity: 0.4;      /* mozilla, netscape */ opacity: 0.4;      /* fx, safari, opera */ }
}
.no-scroll {overflow: hidden !important;}




/*-----------------------------------------------------------------------------------------------
	기타 공통
-------------------------------------------------------------------------------------------------*/


.b { font-weight: 700;}
.clearfix:after { display: block; clear: both; content: ""; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
/* .clearfix { zoom: 1; } */

.h15 { height:15px;}
.h30 { height:30px;}
.h80 { height:80px;}
.h100 { height:100px;}

.mauto { margin : 0 auto;}
.mt0 { margin-top:0px !important}
.mt5 { margin-top:5px !important;}
.mt10 { margin-top:10px !important;}
.mt15	{ margin-top: 15px !important; }
.mt20	{ margin-top: 20px !important; }
.mt30	{ margin-top: 30px !important; }
.mt50	{ margin-top: 50px !important; }
.mt-10	{ margin-top: -10px !important; }
.mt-50	{ margin-top: -50px !important; }


.mb5	{ margin-bottom: 5px; }
.mb10	{ margin-bottom: 10px; }
.mb20	{ margin-bottom: 20px; }
.mb30	{ margin-bottom: 30px !important; }
.mb50	{ margin-bottom: 50px !important; }

.ml2 { margin-left:2px;}
.ml5 { margin-left:5px;}
.ml10 { margin-left:10px;}
.ml15 { margin-left:15px;}

.mr5 { margin-right:5px;}
.mr10 { margin-right:10px;}
.mr20 { margin-right:20px;}
.mr30 { margin-right:30px;}

.mtb5	{ margin-top: 5px !important; margin-bottom:5px !important;}
.mtb10	{ margin-top: 10px !important; margin-bottom:10px !important;}
.mtb20	{ margin-top: 20px !important; margin-bottom:20px !important;}
.mtb30	{ margin-top: 30px !important; margin-bottom:30px !important;}
.mtb50 {margin-top:50px !important; margin-bottom:50px !important;}
.mtb80 {margin-top:80px !important; margin-bottom:80px !important;}

.m5	{ margin: 5px; }
.m10	{ margin: 10px; }
.m20	{ margin: 20px !important;}

.p0 { padding:0 !important;}

.pr5 { padding-right: 5px; }
.pr10 { padding-right: 10px; }
.pr30 { padding-right: 30px !important; }
.pl20 { padding-left: 20px; }

.paginate { padding-top:5px !important;padding-bottom:10px !important;}
/* .w20 { width:20px !important; min-width: 20px;} */
/* .org01{ color:#ff6600;} #f16522 */

:root {
  --color-art-primary: #6b1686;
  --color-art-p2: #b50081;
  --color-art-p4: #EE9628;
  --color-art-line:#e7e7e7;
}

.art_c01 { color:var(--color-art-primary);}
.org02{ color:#EE9628;}
.org03{ color:#EE9628;}
.org04 { color:#ff6300;}

.blue01 { color:#357ace;}
.brown01 { color:#ca5c39;}
.gray01 { color:#888}
.white { color:#fff !important;}
.black01 { color:#000;}



.line_b { border-bottom:1px solid #ddd;}
.line_t { border-top:1px solid #ddd;}
.line_r_01 { border-right:2px solid #999}

.line_b_01 { border-bottom:2px solid #333}

.line_ddd { border:1px solid #ddd;}
.uline { text-decoration: underline;}

/* .line_l.c9 { border-left:1px solid #999 !important;} */

.ellipsis { text-overflow: ellipsis !important; overflow: hidden !important;word-wrap:break-word;} /*display:-webkit-box; */
.ellipsis_1 { text-overflow: ellipsis !important; overflow: hidden !important;word-wrap:break-word; white-space: nowrap !important;}
.nowrap{ white-space: nowrap !important;}
.wrap{ white-space: normal; !important;}
.block { display: inline-block;}

.block:after  { clear: both;}
.pointer{ cursor: pointer;}
.left {float:left !important;}
.right {float:right !important;}

.right-sel {float:right; margin-right:10px; margin-bottom:10px;}

.clear {clear:both;}

.hide {display:none;}
.noline {border:none !important;}

.ls-1 { letter-spacing: -1px}
.ls-2 { letter-spacing: -2px}

.bg_none { background: none;}
.bg_gray01{background-color: #f7f7f7 !important;}
.bg_gray01.line { border-bottom:1px solid #f0f0f0;}
.bg_white{background-color: #fff !important;}

.p20 { padding:20px !important; }
.p30 { padding:30px !important; }

.ws2{ word-spacing:26px;}


.al_l {text-align:left !important;}
.al_r {text-align:right !important;}
.al_c {text-align:center !important;}
.vl_t { vertical-align: top;}
.vl_m {vertical-align:middle !important;}
.vl_b {vertical-align:bottom !important;}


.underline. {text-decoration:underline;} /*121214 add */

/* font */
.ft12 { font-size: 12px !important; }
.ft13 { font-size: 13px !important; }
.ft14 { font-size: 14px !important; }
.ft16 { font-size: 16px !important; }
.ft17 { font-size: 17px !important; }
.ft20 { font-size: 20px !important; }


.w10  { width:10px !important;}
.w20  { width:20px !important;  }
.w30  { width:30px !important;}
.w50  { width:50px !important;min-width: 50px  !important}
.w80  { width:80px !important;}
.w100 { width:100px !important;}
.w150 { width:150px !important;}
.w200 { width:200px !important;}
.w520 { width:520px !important;}
.w640 { width:640px !important;}

.w20p { width:20% !important;}
.w30p { width:30% !important;}
.w40p { width:40% !important;}
.w50p { width:50% !important;}
.w60p { width:70% !important;}
.w70p { width:70% !important;}
.w80p { width:80% !important;}
.w90p { width:90% !important;}
.w95p { width:95% !important;}
.w100p { width:100% !important;}


.underline { text-decoration: underline;}
.rotate { transform: rotate(-180deg); }
.center { margin-left:auto; margin-right:auto;}
@media screen and (max-width:640px){
  .m_w100p { width:100% !important; box-sizing: border-box;}
  .m_w80p { width:80% !important; box-sizing: border-box;}
  .m_w70p { width:70% !important; box-sizing: border-box;}
  .m_w60p { width:60% !important; box-sizing: border-box;}
  .m_w50p { width:50% !important; box-sizing: border-box;}
  .m_block { display: inline-block; }
  .m_mt10 { margin-top:10px;}

  .m_ls-1 {letter-spacing: -1px}

  .m_pl0 { padding-left:0 !important;}

  .m_ft13 { font-size: 13px !important; }
}


 /* 글씨 반짝임 ex) new */
 .blink {
  animation: blink-animation 1s steps(5, start) infinite;
  -webkit-animation: blink-animation 1s steps(5, start) infinite;
}


/*-----------------------------------------------------------------------------------------------
  반응형 웹 공통
  -----------------------------------------------------------------------------------------------*/
  .mobile{display: none !important}

  @media screen and (max-width:640px){
    .mobile{display: block  !important; min-widht:360px;}
    .pc{display: none !important; }

/*     body, input, textarea, a { font-size:14px;} */
    table { width:100% }

    /* input[type="text"], input[type="password"] {padding:6px} */

    .m_ellipsis { text-overflow: ellipsis !important; overflow: hidden !important;word-wrap:break-word;} /*display:-webkit-box; */
    .m_nowrap{ white-space: nowrap !important;}
  }


/*-----------------------------------------------------------------------------------------------
  툴팁
  -----------------------------------------------------------------------------------------------*/

/* custom CSS */
div.vue-tooltip.tooltip-via {
  font: 15px 'NanumBarunGothic', 맑은 고딕,Dotum,Gulim,Arial;
  line-height:1.2;
  z-index: 1000 !important;
}

/* div.vue-tooltip.tooltip-via.tooltip-arrow {
  border-color: red !important;
} */

/* .lawer_sch { display: none !important; } */

/*-----------------------------------------------------------------------------------------------
  기타 효과
  -----------------------------------------------------------------------------------------------*/
/* 마우스  오버 이미지 커지는 효과 */
.zoom_image { overflow: hidden; }
.zoom_image  img { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1); -webkit-transition:.3s; -moz-transition:.3s; -ms-transition:.3s; -o-transition:.3s; transition:.3s; }
.zoom_image:hover img { cursor:pointer; transform:scale(1.1); /* 마우스 오버시 이미지 크기를 1.1 배만큼 확대 */ -o-transform:scale(1.1); -moz-transform:scale(1.1); -webkit-transform:scale(1.1); transition: transform .35s; -o-transition: transform .35s; -moz-transition: transform .35s; -webkit-transition: transform .35s; /* 마우스 오버시 이미지가 즉시 커지지 않고 30.5 second 의 시간에 걸쳐 커지는 애니메이션 효과*/ }
.zoom_image a { display: inline-block; }

.bg_zoom { width: 200px; height: 200px; overflow: hidden; }
.bg_zoom span { width:100%; height:100%; display: inline-block; background-color: white; background-size: cover; background-repeat: no-repeat; background-position: center top;  -webkit-transition: transform .3s ease-out; -moz-transition: transform .3s ease-out; -ms-transition: transform .3s ease-out; -o-transition: transform .3s ease-out; transition: transform .3s ease-out; }
.bg_zoom:hover span{ -webkit-transform: scale(1.5); -moz-transform: scale(1.5); -ms-transform: scale(1.5); /* IE 9 */ -o-transform: scale(1.5); transform: scale(1.5); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand')"; /* IE8 */ filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand'); /* IE6 and 7 */ }

