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

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


*:focus { outline:none; }

body, input, textarea, select, button, table{margin:0; font-size:16px; font-family:'Montserrat', 'Noto Sans KR', Noto Sans KR, 'Lato','돋움', Dotum, Helvetica, AppleGothic, Sans-serif; color:#555}
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: 600;}
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:#555;}
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:#dfdfdf; 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:42px; box-sizing:border-box; border-radius:0; -webkit-border-radius:0;}
input.text {padding:0px 10px; height:42px; font-weight:300; box-sizing:border-box; border-radius:0; -webkit-border-radius:0; appearance:none; -webkit-appearance:none; box-sizing:border-box;}
input.file {border:1px solid #dfdfdf;}
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}


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

.btn_gray {width:100px; height:42px; line-height:42px; background:#fff; padding:0px; margin-left:1px; display:inline-block; color:#555; text-decoration:none; text-align:center; border:1px solid #888; cursor:pointer;}
.btn_gray2 {display:inline-block; width:225px; height:55px; border:1px solid #888; background:#fff; line-height:55px; font-size:18px; font-weight:400; padding:0px; color:#222; text-decoration:none; text-align:center; cursor:pointer; vertical-align:top; box-sizing:border-box;}
.btn_gray3 {display:inline-block; width:130px; height:45px; border:none; background:#888; line-height:45px; padding:0px; color:#fff; text-decoration:none; text-align:center; cursor:pointer; vertical-align:top;}

.btn_red {width:100px; height:42px; line-height:42px; background:#7ac142; padding:0px; margin-left:1px; display:inline-block; color:#fff; text-decoration:none; text-align:center; border:none; cursor:pointer;}
.btn_red2 {display:inline-block; width:225px; height:55px; border:none; background:#7ac142; line-height:55px; font-size:18px; font-weight:400; padding:0px; color:#fff; text-decoration:none; text-align:center; cursor:pointer; vertical-align:top; box-sizing:border-box;}
.btn_red2.btn_down span {padding-left:24px; background:url('/images/common/btn/btn_catalogue_ov.png') no-repeat 0 center;}
.btn_red3 {display:inline-block; width:130px; height:45px; border:none; background:#7ac142; line-height:45px; padding:0px; color:#fff; text-decoration:none; text-align:center; cursor:pointer; vertical-align:top;}
.btn_red4 {width:135px; height:40px; background:#977b5d; color:#fff; text-align:center; line-height:40px; font-weight:600; font-size:15px; border-radius:2px;}

.btn_black {width:100px; height:42px; line-height:42px; background:#fff; padding:0px; margin-left:1px; display:inline-block; color:#222; text-decoration:none; text-align:center; border:1px solid #222; cursor:pointer;}
.btn_black2 {display:inline-block; width:225px; height:55px; border:none; background:#000; line-height:55px; font-size:18px; font-weight:400; padding:0px; color:#fff; text-decoration:none; text-align:center; cursor:pointer; vertical-align:top; box-sizing:border-box;}
.btn_black.rebod { border-color:#ccc; }

.btn_search {display:inline-block; width:165px; height:50px; border:none; background:#7ac142; font-size:18px; font-weight:400; text-align:center; color:#fff; vertical-align:middle; line-height:50px; cursor:pointer;}
.btn_prnext {width:40px; height:40px; cursor:pointer; line-height:40px; background:#fff; padding: 0px;display: inline-block; text-decoration:none; text-align: center; border:1px solid #ccc;}
.btn_comment {width:80px; height:52px; border:none; line-height:51px; font-size:13px; background:#999 !important; padding:0px; display:inline-block; color:#fff; text-decoration:none; text-align:center; cursor:pointer; border-radius:2px;}

.btn_file_down {display:inline-block; height:40px; padding:0 20px; border:1px solid #888; background:#fff; font-size:13px; text-align:center; line-height:38px; box-sizing:border-box; vertical-align:middle; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
.btn_file_down span {display:inline-block; padding-left:24px; margin-left:0 !important; background:url('/images/common/btn/btn_catalogue.png') no-repeat 0 center;}
.btn_file_down:hover {background:#7ac142; border-color:#7ac142; color:#fff !important;}
.btn_file_down:hover span {background-image:url('/images/common/btn/btn_catalogue_ov.png');}

.btn_file_down2 {display:inline-block; height:55px; padding:0; border:1px solid #7ac142; background:#7ac142; font-size:18px; color:#fff; text-align:center; line-height:55px; box-sizing:border-box; vertical-align:middle; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
.btn_file_down2 span {display:inline-block; padding-left:24px; margin-left:0 !important; background:url('/images/common/btn/btn_catalogue_ov.png') no-repeat 0 center;}

/* btn more */
.btn_more01 {position:relative; display:inline-block; padding-right:44px; font-size:14px; font-weight:500; color:#fff; -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; transition: all .2s; vertical-align:top;}
.btn_more01 i {position:absolute; top:50%; right:0; display:inline-block; margin-top:-1px; vertical-align:middle; width:33px; height:1px; border-radius:1px; background-color:#fff; -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; transition: all .2s; -webkit-transform: translateZ(0); transform: translateZ(0);}
.btn_more01 i:before {content:""; display:inline-block; vertical-align:middle; position:absolute; bottom:2px; right:-1px; width:7px; height:1px; border-radius:1px; background-color:#fff; transform:rotate(45deg); -ms-transform:rotate(45deg); -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; transition: all .2s;}
.btn_more01 i:after {content:""; display:inline-block; vertical-align:middle; position:absolute; bottom:-2px; right:-1px; width:7px; height:1px; border-radius:1px; background-color:#fff; transform:rotate(-45deg); -ms-transform:rotate(-45deg); -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; transition: all .2s;}

@-webkit-keyframes hvr-icon-wobble-horizontal {
  16.65% {
    -webkit-transform: translateX(6px);
    transform: translateX(6px);
  }
  33.3% {
    -webkit-transform: translateX(-5px);
    transform: translateX(-5px);
  }
  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }
  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes hvr-icon-wobble-horizontal {
  16.65% {
    -webkit-transform: translateX(6px);
    transform: translateX(6px);
  }
  33.3% {
    -webkit-transform: translateX(-5px);
    transform: translateX(-5px);
  }
  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }
  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.btn_more01:hover i {-webkit-animation-name: hvr-icon-wobble-horizontal; animation-name: hvr-icon-wobble-horizontal; -webkit-animation-duration: 1s; animation-duration: 1s; webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: 1; animation-iteration-count: 1;}

.btn_more02 {position:relative; display:inline-block; padding-right:44px; font-size:14px; font-weight:500; color:#222; -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; transition: all .2s; vertical-align:top;}
.btn_more02 i {position:absolute; top:50%; right:0; display:inline-block; margin-top:-1px; vertical-align:middle; width:33px; height:1px; border-radius:1px; background-color:#000; -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; transition: all .2s;}
.btn_more02 i:before {content:""; display:inline-block; vertical-align:middle; position:absolute; bottom:2px; right:-1px; width:7px; height:1px; border-radius:1px; background-color:#000; transform:rotate(45deg); -ms-transform:rotate(45deg); -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; transition: all .2s;}
.btn_more02 i:after {content:""; display:inline-block; vertical-align:middle; position:absolute; bottom:-2px; right:-1px; width:7px; height:1px; border-radius:1px; background-color:#000; transform:rotate(-45deg); -ms-transform:rotate(-45deg); -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; transition: all .2s;}
.btn_more02:hover {color:#7fc143;}
.btn_more02:hover i,
.btn_more02:hover i:before,
.btn_more02:hover i:after {background-color:#7fc143;}
.btn_more02:hover i {-webkit-animation-name: hvr-icon-wobble-horizontal; animation-name: hvr-icon-wobble-horizontal; -webkit-animation-duration: 1s; animation-duration: 1s; webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: 1; animation-iteration-count: 1;}

.btn_more03 {display:inline-block; width:19px; height:19px; background:url('/images/common/btn/btn_more01.png') no-repeat 0 0; background-size:100%;}
.btn_more03:hover {background-image:url('/images/common/btn/btn_more01_ov.png');}

.btn_more04 {padding-right:18px; background:url('/images/common/icon/icon_arrow01.png') no-repeat right center; background-size:12px; font-size:16px; font-weight:400; color:#222;}
.btn_more04.on {background-image:url('/images/common/icon/icon_arrow01_on.png'); color:#7ac142;}

/* padding */
.pdB0 {padding-bottom:0 !important;}

/* margin */
.mgB0 { margin-bottom:0px !important; }
.mgB5 { margin-bottom:5px; }
.mgT0 { margin-top:0px !important; }
.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;}

/* border */
.bdBn {border-bottom:none !important;}

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



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

select,
input.text {height:5.5vw;}

/* btn */
.BtnArea {margin-top:6%;}

.btn_gray,
.btn_red,
.btn_black {width:12vw; height:5.5vw; line-height:5.5vw;}

.btn_gray2,
.btn_red2 {width:26vw; height:7vw; font-size:2.2vw; line-height:7vw;}
.btn_red2.btn_down span {padding-left:3vw; background-size:1.8vw;}

.btn_gray3,
.btn_red3 {width:15vw; height:5.2vw; font-size:1.8vw; line-height:5.2vw;}

.btn_search {width:15%; height:5.5vw; font-size:2vw; line-height:5.5vw;}
.btn_prnext {width:4vw; height:4vw; line-height:4vw;}
.btn_file_down {height:5vw; padding:0 2.5vw; font-size:1.6vw; font-weight:400; line-height:5vw;}
.btn_file_down span {padding-left:2.5vw; background-size:1.8vw;}

/* btn more */
.btn_more01 {font-size:1.5vw; font-weight:600;}
.btn_more02 {font-size:1.5vw; font-weight:600;}
.btn_more04 {padding-right:2.2vw; background-size:1.2vw; font-size:1.8vw;}








}


/*===============================================================*/
/*======================= 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){
body, input, textarea, select, button, table {font-size:3.4vw;}
select {height:10vw;}
input.text {height:10vw; padding:0 3vw;}
textarea.textarea {padding:2%;}


/* btn */
.BtnArea {margin-top:8%; font-size:0; text-align:center;}
.BtnArea input,
.BtnArea a {display:inline-block; width:49% !important; margin-left:2%;}
.BtnArea input:first-child,
.BtnArea a:first-child {margin-left:0;}

.btn_gray,
.btn_red,
.btn_black {width:20vw; height:10vw; line-height:10vw;}

.btn_red2,
.btn_gray2 {width:25vw; height:11vw; font-size:3.8vw; line-height:11vw;}
.btn_red2.btn_down span {padding-left:4.8vw; background-size:3.2vw;}

.btn_gray3,
.btn_red3 {width:25vw; height:9vw; font-size:3.4vw; line-height:9vw;}

.btn_search {width:20%; height:9vw; font-size:3.4vw; line-height:9vw;}
.btn_prnext {width:8vw; height:8vw; line-height:8vw;}
.btn_file_down {height:7vw; padding:0 3vw; font-size:3vw; line-height:6.5vw;}
.btn_file_down span {padding-left:4.8vw; background-size:3.2vw;}

/* btn more */
.btn_more01,
.btn_more02 {padding-right:10vw; font-size:3vw;}
.btn_more01 i,
.btn_more02 i {width:8vw;} 
.btn_more01 i:before,
.btn_more01 i:after, 
.btn_more02 i:before,
.btn_more02 i:after  {width:1.5vw;}
.btn_more01 i:before,
.btn_more02 i:before {bottom:0.5vw;}
.btn_more01 i:after,
.btn_more02 i:after {bottom:-0.5vw;}
.btn_more03 {width:3.5vw; height:3.5vw;}
.btn_more04 {padding-right:3.5vw; background-size:2.5vw; font-size:3.4vw;}


}

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



}

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



}

.btn_url_link {display:inline-block; height:40px; padding:0 16px; border:1px solid #888; background:#fff; font-size:13px; text-align:center; line-height:38px; box-sizing:border-box; vertical-align:middle; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
.btn_url_link span {
	display:inline-block; padding-left:22px; margin-left:0 !important; background:url('/images/common/btn/btn_link.png') no-repeat 0 center;
	background-size:16px;
}
.btn_url_link:hover {background:#7ac142; border-color:#7ac142; color:#fff !important;}
.btn_url_link:hover span {background-image:url('/images/common/btn/btn_link_ov.png');}