@charset "utf-8";

/* 여백 초기화 */
body,div,ul,li,dl,dd,dt,ol,h1,h2,h3,h4,h5,h6,input,fieldset,legend,p,select,table,th,td,tr,textarea,button,form,figure,figcaption{margin:0; padding:0;}

/* a 링크 초기화 */
a {color: #222; text-decoration: none;}
a:hover {color: #2698cb;}

/* 폰트 초기화 */
body, input, textarea, select, button, table {font-family:'Noto Sans KR', AppleSDGothicNeo-Regular,'Malgun Gothic','맑은 고딕',dotum,'돋움',sans-serif; color: #222; font-size: 16px; line-height: 1.5;}

/* 폰트 스타일 초기화 */
em,address {font-style: normal;}

/* 블릿기호 초기화 */
ul,li,ol {list-style:none;}

/* 제목 태그 초기화 */
h1,h2,h3,h4,h5,h6 {font-size: 16px; font-weight: normal;}

/* 테두리 초기화 */
img,fieldset {border:0 none;}

/* 버튼 초기화 */
button {border: 0;}

/* 반응형
video,img {width: 100%;} */

/* clearfix */
.clearfix{*zoom:1;}
.clearfix:before, .clearfix:after {display: block; content: '';line-height: 0;}
.clearfix:after {clear: both;}

/* IR 효과 */
.ir_pm {display:block; overflow:hidden; font-size:0; line-height:0; text-indent:-9999px;} /* 의미있는 이미지의 대체 텍스트를 제공하는 경우(Phark Method) */
.ir_wa {display:block; overflow:hidden; position:relative; z-index:-1; width:100%; height: 100%;} /* 의미있는 이미지의 대체 텍스트로 이미지가 없어도 대체 텍스트를 보여주고자 할 때(WA IR) */
.ir_so {overflow: hidden; position:absolute; width:0; height:0; line-height:0; text-indent:-9999px;} /* 대체 텍스트가 아닌 접근성을 위한 숨김 텍스트를 제공할 때 */

/* 아이콘 이미지 최적화 작업 */
/*
.icon {background-image: url(../img/icon.png);}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
       only screen and (min-device-pixel-ratio: 1.5),
       only screen and (min-resolution: 1.5dppx){
            .icon {background-image: url(../img/icon@2.png); background-size: 500px;}
       }
*/

/* 빨간색은 필수입력 항목입니다. */
.red_required { color: red; text-align: center; font-size: 16px; padding-bottom: 10px; }

/* Form */
textarea { border:1px solid #dbdbdb;}
select { /*height:32px;*/ line-height: 1.5; font-size:16px; color:#373737; border:1px solid #ddd; background:#fff;border-radius: 5px;}
input[type=tel],
input[type=time],
input[type=text],
input[type=password],
input[type=search],
input[type=email],
input[type=file],
input[type=url],
input[type=number],
input[type=date],textarea {width:100%; padding-bottom: 2px; height:34px; line-height: 1.5; font-size:16px; color:#373737; border:1px solid #ddd; background:#fff; text-indent:12px; border-radius: 5px; transition: all 0.5s; vertical-align:middle;}
/*input::-webkit-input-placeholder{color:#b5b5b5; font-size:16px; line-height:100%;}*/
input::-webkit-input-placeholder { color: #b5b5b5; font-size: 16px; line-height: 1.5; }
input:-ms-input-placeholder { color: #b5b5b5; font-size: 16px; line-height: 1.5; }
input::placeholder { color: #b5b5b5; font-size: 16px; line-height: 1.5; }
input[class*="placeholder_red"]::-webkit-input-placeholder { color: red; font-size: 16px; line-height: 1.5; }
input[class*="placeholder_red"]:-ms-input-placeholder { color: red; font-size: 16px; line-height: 1.5; }
input[class*="placeholder_red"]::placeholder { color: red; font-size: 16px; line-height: 1.5; }
textarea { padding:5px 0;}
select:focus,
textarea:focus,
input:focus { border: 1px solid #727272;}

select { padding: 0 14px 0 2px; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: -webkit-linear-gradient(transparent, transparent); background: url(../img/select_arrow.gif) no-repeat 97% 50%; }
select::-ms-expand { display: none; }​

input[type=tel][readonly],
input[type=text][readonly],
input[type=password][readonly],
input[type=email][readonly],
input[type=search][readonly],
input[type=tel][disabled],
input[type=text][disabled],
input[type=password][disabled],
input[type=search][disabled],
input[type=email][disabled]{background:#eaeaea; border-color:#c0c0c0; color:#666; -webkit-appearance:none;font-size:16px;}
textarea[readonly],
textarea[disabled]{padding:11px; font-size:16px; color:#666; font-weight:normal; line-height:140%; height:78px; background:#eaeaea;border:1px solid #c0c0c0;}

input[type="radio"] { position: absolute; left: -5000%; }
input[type="radio"] + label:before { display: inline-block; content: "\e9c6"; font-family: "xeicon"; font-size: 20px; vertical-align: -3px; padding-right: 5px; }
input[type="radio"]:checked + label:before { display: inline-block; content: "\e9c7"; font-family: "xeicon"; font-size: 20px; vertical-align: -3px; padding-right: 5px; color: blue; }

input[type="checkbox"] { position: absolute; left: -3000%; }
input[type="checkbox"] + label:before { display: inline-block; content: "\ea0e"; font-family: "xeicon"; font-size: 20px; vertical-align: -3px; padding-right: 5px; }
input[type="checkbox"]:checked + label:before { display: inline-block; content: "\e92e"; font-family: "xeicon"; font-size: 20px; vertical-align: -3px; padding-right: 5px; color: blue; }