/************************************************************************
 * 설명       :   기본 스타일시트
 * 작성자     :   (주)웨이투원
 * 작성일     :   2013. 10. 18
 * 최종수정일 :   2019. 08. 26
 * 파일명     :   basic.css
!important
************************************************************************/

/* 
 * Nanum Barun Gothic (Korean) http://hangeul.naver.com
 */
@font-face {
  font-family: 'NanumBarunGothic';
  font-style: normal;
  font-weight: 200;
  src: url(fonts/NanumBarunGothicUltraLight.eot);
  src: local('Nanum Barun Gothic UltraLight'),
       local('NanumBarunGothicUltraLight'),
       url(fonts/NanumBarunGothicUltraLight.eot?#iefix) format('embedded-opentype'),
       url(fonts/NanumBarunGothicUltraLight.woff2) format('woff2'),
       url(fonts/NanumBarunGothicUltraLight.woff) format('woff'),
       url(fonts/NanumBarunGothicUltraLight.ttf) format('truetype');
}

@font-face {
  font-family: 'NanumBarunGothic';
  font-style: normal;
  font-weight: 300;
  src: url(fonts/NanumBarunGothicLight.eot);
  src: local('Nanum Barun Gothic Light'),
       local('NanumBarunGothicLight'),
       url(fonts/NanumBarunGothicLight.eot?#iefix) format('embedded-opentype'),
       url(fonts/NanumBarunGothicLight.woff2) format('woff2'),
       url(fonts/NanumBarunGothicLight.woff) format('woff'),
       url(fonts/NanumBarunGothicLight.ttf) format('truetype');
}

@font-face {
  font-family: 'NanumBarunGothic';
  font-style: normal;
  font-weight: 400;
  src: url(fonts/NanumBarunGothic.eot);
  src: local('Nanum Barun Gothic'),
       local('NanumBarunGothic'),
       url(fonts/NanumBarunGothic.eot?#iefix) format('embedded-opentype'),
       url(fonts/NanumBarunGothic.woff2) format('woff2'),
       url(fonts/NanumBarunGothic.woff) format('woff'),
       url(fonts/NanumBarunGothic.ttf) format('truetype');
}

@font-face {
  font-family: 'NanumBarunGothic';
  font-style: normal;
  font-weight: 700;
  src: url(fonts/NanumBarunGothicBold.eot);
  src: local('Nanum Barun Gothic Bold'),
       local('NanumBarunGothicBold'),
       url(fonts/NanumBarunGothicBold.eot?#iefix) format('embedded-opentype'),
       url(fonts/NanumBarunGothicBold.woff2) format('woff2'),
       url(fonts/NanumBarunGothicBold.woff) format('woff'),
       url(fonts/NanumBarunGothicBold.ttf) format('truetype');
}

@font-face {
 font-family: 'NanumSquare';
 font-weight: 400;
 src: url(/common/css/fonts/NanumSquareR.eot);
 src: url(/common/css/fonts/NanumSquareR.eot?#iefix) format('embedded-opentype'),
      url(/common/css/fonts/NanumSquareR.woff) format('woff'),
      url(/common/css/fonts/NanumSquareR.ttf) format('truetype');
}
@font-face {
 font-family: 'NanumSquare';
 font-weight: 700;
 src: url(/common/css/fonts/NanumSquareB.eot);
 src: url(/common/css/fonts/NanumSquareB.eot?#iefix) format('embedded-opentype'),
      url(/common/css/fonts/NanumSquareB.woff) format('woff'),
      url(/common/css/fonts/NanumSquareB.ttf) format('truetype');
}
@font-face {
 font-family: 'NanumSquare';
 font-weight: 800;
 src: url(/common/css/fonts/NanumSquareEB.eot);
 src: url(/common/css/fonts/NanumSquareEB.eot?#iefix) format('embedded-opentype'),
      url(/common/css/fonts/NanumSquareEB.woff) format('woff'),
      url(/common/css/fonts/NanumSquareEB.ttf) format('truetype');
}
@font-face {
 font-family: 'NanumSquare';
 font-weight: 300;
 src: url(/common/css/fonts/NanumSquareL.eot);
 src: url(/common/css/fonts/NanumSquareL.eot?#iefix) format('embedded-opentype'),
      url(/common/css/fonts/NanumSquareL.woff) format('woff'),
      url(/common/css/fonts/NanumSquareL.ttf) format('truetype');
}

/* Noto Sans JP  http://www.google.com/fonts/earlyaccess */ 

@font-face { 
  font-family: 'Noto Sans JP'; 
  font-style: normal; 
  font-weight: 100; 
  src: url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Thin.woff2) format('woff2'), 
      url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Thin.woff) format('woff'), 
      url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Thin.otf) format('opentype'); 
} 
@font-face { 
  font-family: 'Noto Sans JP'; 
  font-style: normal; 
  font-weight: 300; 
  src: url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Light.woff2) format('woff2'), 
      url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Light.woff) format('woff'), 
      url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Light.otf) format('opentype'); 
} 
@font-face { 
  font-family: 'Noto Sans JP'; 
  font-style: normal; 
  font-weight: 400; 
  src: url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Regular.woff2) format('woff2'), 
        url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Regular.woff) format('woff'), 
        url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Regular.otf) format('opentype'); 
 } 
@font-face { 
  font-family: 'Noto Sans JP'; 
  font-style: normal; 
  font-weight: 500; 
  src: url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Medium.woff2) format('woff2'), 
        url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Medium.woff) format('woff'), 
        url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Medium.otf) format('opentype'); 
 } 
@font-face { 
  font-family: 'Noto Sans JP'; 
  font-style: normal; 
  font-weight: 700; 
  src: url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Bold.woff2) format('woff2'), 
        url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Bold.woff) format('woff'), 
        url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Bold.otf) format('opentype'); 
 } 
@font-face { 
  font-family: 'Noto Sans JP'; 
  font-style: normal; 
  font-weight: 900; 
  src: url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Black.woff2) format('woff2'), 
        url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Black.woff) format('woff'), 
        url(//fonts.gstatic.com/ea/notosansjp/v2/NotoSansJP-Black.otf) format('opentype'); 
 } 



*:focus { outline:none; }

body, input, textarea, select, button, table{margin:0; font-size:15px; font-family:'NanumBarunGothic', NanumBarunGothic, '돋움', Dotum, Helvetica, AppleGothic, Sans-serif; color:#3c3c3c}
body, h1, h2, h3, h4, h5, dl, dt, dd, ul, li, ol, th, td, p, form, fieldset, legend, button { margin: 0; padding: 0; }

img {max-width:100%;}
img, fieldset{border:0 none}
dl, ul, ol, li {list-style: none outside none;}
button{border:0 none; cursor:pointer; display: block;}
table {border-collapse:collapse;}

img {vertical-align:top;}
li img { vertical-align:top;}
td img { vertical-align:middle;}
.cursor { cursor: pointer;}

strong, .strong , b { font-weight: 500;}
address, caption, cite, code, dfn, em, var {font-style:normal;}

hr { clear:both; display: none; }
.blind, legend, caption {display:none;}

a {text-decoration:none; color:#3c3c3c;}
a:hover, a:active, a:focus {text-decoration:none;}
table a:hover, table a:active {text-decoration:underline;}
table a.nonehoverline { text-decoration:none; }

input, select, textarea {vertical-align:middle; font-size:1em; line-height:130%}
input, textarea, select { border-width:1px; border-style: solid; border-color:#ccc; background:#fff; outline:0;}
input[type=button],
input[type=submit],
textarea {border-radius:0; -webkit-border-radius:0; appearance:none; -webkit-appearance:none;}
select {height:40px; box-sizing:border-box; border-radius:0; -webkit-border-radius:0;}
input.text {padding:0px 10px; height:40px; color:#666; box-sizing:border-box; border-radius:0; -webkit-border-radius:0; appearance:none; -webkit-appearance:none; box-sizing:border-box;}
input.file {height:40px; border:1px solid #ddd;}
input.check	{border:none; background:none;}
input.radio	{border:0 none; background:none;}
textarea.textarea {height:120px; padding:10px; box-sizing:border-box;}
label {cursor:pointer;}
.button {border:0 none; cursor:pointer}

.nsfont {font-family:'NanumSquare', NanumSquare, Sans-serif !important;}
.jp,
.jp * {font-family: 'Noto Sans JP', sans-serif !important; font-weight:300;}

/* btn */
.BtnArea {margin-top:30px; text-align:center;}
.button {border:0 none; cursor:pointer}

.btn_gray {width:80px; height:35px; line-height:38px; font-size:15px; padding:0px; margin-left:1px; display:inline-block; background:#fff; color:#666; text-decoration:none; text-align: center; border:1px solid #ccc; cursor:pointer; border-radius:2px;}
.btn_gray2 {width:160px; height:50px; line-height:50px; font-size:20px;   padding:0px; margin-left:1px; display:inline-block; color:#666; text-decoration:none; text-align: center; border:1px solid #ccc; cursor:pointer; border-radius:2px;}
.btn_gray3 {width:140px; height:35px; background:#666; color:#fff; text-align:center; line-height:35px; font-weight:600; font-size:15px; border-radius:2px;}

.btn_red {width:80px; height:35px; line-height:38px; font-size:15px; padding:0px; margin-left:1px; display:inline-block; color:#000; text-decoration:none; text-align:center; border:1px solid #000; cursor:pointer; border-radius:2px;}
.btn_red2 {width:160px; height:50px; line-height:50px; font-size:20px;   padding:0px; display:inline-block; color:#000; text-decoration:none; text-align:center; border:1px solid #000; cursor:pointer; border-radius:2px;}
.btn_red3 {display:inline-block; width:92px; height:25px; margin-top:15px; padding:0; word-spacing:3px; text-align:center; line-height:25px; color:#000; font-size:12px; border:1px solid #000; }
.btn_red4 {width:140px; height:35px; background:#000; color:#fff; text-align:center; line-height:35px; font-weight:600; font-size:15px; border-radius:2px;}

.btn_black {width:80px; height:35px; line-height:35px; font-size:15px;padding:0 5px; margin-left:1px; display:inline-block; color:#444; text-decoration:none; text-align: center; border:1px solid #777; cursor:pointer; border-radius:2px;}
.btn_black.rebod { border-color:#ccc; }

.btn_login {display:block; width:131px; height:85px; border:none; background:#000; font-size:15px; font-weight:500; color:#fff; text-align:center; line-height:85px; cursor:pointer; border-radius:2px;}
.btn_search {width:80px; height:35px; cursor:pointer; line-height:35px; font-size:15px; padding:0px; margin-left:1px; display:inline-block; color:#444; text-decoration:none; text-align: center; border:1px solid #777; border-top-color:#999; border-bottom-color:#444; border-radius:2px;}
.btn_prnext {width:40px; height:35px; cursor:pointer; line-height:35px; font-size: 16px; padding: 0px;display: inline-block;color:#666; text-decoration:none; text-align: center; border:1px solid #ccc; border-top-color:#ddd; border-bottom-color:#bbb; border-radius:2px;}
.btn_comment {width:80px; height:52px; border:none; line-height:51px; font-size:15px; background:#999 !important; padding:0px; display:inline-block; color:#fff; text-decoration:none; text-align:center; cursor:pointer; border-radius:2px;}


/* margin */
.mgT30 { margin-top:30px; }

/* align */
.alignL {text-align:left !important}
.alignR {text-align:right !important}
.alignC {text-align:center !important}
.alignJ{text-align:justify !important;}
.clear {clear:both !important}
.floatL {float:left !important}
.floatR {float:right !important}
img.imgT {vertical-align:top !important}
img.imgB {vertical-align:bottom !important}
img.imgC {vertical-align:middle !important}
.vaT {vertical-align:top !important;}
.vaB {vertical-align:bottom !important;}

/*color*/
.red{color:#dd0000 !important}
.blue {color:#2e4f9e !important;}

/* input-radio */
.comm_radio {position:absolute;left:-9999px}
.comm_radio_label { margin-right:10px;}
.comm_radio_label .ico_radio {display:inline-block; width:16px; height:16px; margin-top:-2px; background:url('/images/common/icon/icon_radio.gif') no-repeat left top; overflow:hidden; font-size:0; line-height:0; vertical-align:middle}
.radio_on .ico_radio {background-position:left bottom}

/* input-checkbox */
.comm_check {position:absolute;left:-9999px}
.comm_check_label {cursor:pointer;}
.comm_check_label .ico_check {display:inline-block; width:19px; height:19px; margin-top:-1px; background:url('/images/common/icon/icon_check.gif') no-repeat left top; overflow:hidden; font-size:0; line-height:0; vertical-align:middle}
.comm_check_label .ico_check2 {display:inline-block; width:16px; height:16px; margin-top:-1px; background:url('/images/common/icon/icon_check02.gif') no-repeat left top; overflow:hidden; font-size:0; line-height:0; vertical-align:middle}
.check_on .ico_check, .check_on .ico_check2 {background-position:left bottom}
.check_on {color:#555}


/*============================================================*/
/*======================= PC 1024 px ~ =======================*/
/*============================================================*/
@media only screen and (max-width:1024px){
body, input, textarea, select, button, table {font-size:15px; font-weight:400; letter-spacing:-0.5px;}

select,
input.text,
input.file {height:35px;}

.btn_black,
.btn_gray,
.btn_red {width:80px; height:35px; font-size:14px; line-height:35px;}

.btn_red2,
.btn_gray2 {width:140px; height:45px; font-size:18px; line-height:45px;}

.btn_search {width:80px; height:35px; font-size:14px; line-height:35px;}
.btn_prnext {width:35px; height:35px; font-size:14px; line-height:35px;}

}


/*===============================================================*/
/*======================= Tablet 850 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:850px){


}

/*===============================================================*/
/*======================= Tablet 768 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:768px){



}

/*===============================================================*/
/*======================= Mobile 640 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:640px){

}

/*===============================================================*/
/*======================= Mobile 520 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:520px){
body, input, textarea, select, button, table {font-size:3.5vw;}
select {height:8vw;}
input.text {height:8vw; padding:0 2%;}
input.file {height:8vw;}
textarea.textarea {padding:2%;}

/* btn */
.btn_gray,
.btn_red,
.btn_black {width:14vw; height:7.5vw; font-size:3vw; line-height:7.5vw;}
.btn_search {width:16%; height:8vw; line-height:8vw; font-size:3.5vw;}

.btn_red2,
.btn_gray2 {width:35%; height:10vw; font-size:3.4vw; line-height:10vw;}

.btn_prnext {width:7.5vw; height:7.5vw; font-size:3vw; line-height:7.5vw}


}

/*===============================================================*/
/*======================= Mobile 360 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:360px){



}