@charset "utf-8";
/* 폰트 */
@font-face {
  font-family: 'NotoSansKR';
  font-style: normal;
  font-weight: 300;
  src: url(../fonts/NotoSansKR-Regular.otf);
  src: local('NotoSansKR'),
       local('NotoSansKR'),
       url(../fonts/NotoSansKR-Regular.otf) format('opentype'),
       url(../fonts/NotoSansKR-Regular.woff2) format('woff2'),
       url(../fonts/NotoSansKR-Regular.woff) format('woff'),
}
@font-face {
  font-family: 'NotoSansKR-Medium';
  font-style: normal;
  font-weight: 300;
  src: url(../fonts/NotoSansKR-Medium.otf);
  src: local('NotoSansKR-Medium'),
       local('NotoSansKR-Medium'),
       url(../fonts/NotoSansKR-Medium.otf) format('opentype'),
       url(../fonts/NotoSansKR-Medium.woff2) format('woff2'),
       url(../fonts/NotoSansKR-Medium.woff) format('woff'),
}
@font-face {
  font-family: 'NotoSansKR-Bold';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/NotoSansKR-Bold.otf);
  src: local('NotoSansKR-Bold'),
       local('NotoSansKR-Bold'),
       url(../fonts/NotoSansKR-Bold.otf) format('opentype'),
       url(../fonts/NotoSansKR-Bold.woff2) format('woff2'),
       url(../fonts/NotoSansKR-Bold.woff) format('woff'),
}
@font-face {
  font-family: 'NotoSansKR-Black';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/NotoSansKR-Black.otf);
  src: local('NotoSansKR-Black'),
       local('NotoSansKR-Black'),
       url(../fonts/NotoSansKR-Black.otf) format('opentype'),
       url(../fonts/NotoSansKR-Black.woff2) format('woff2'),
       url(../fonts/NotoSansKR-Black.woff) format('woff'),
}
/* 영문 */
@font-face {
  font-family: 'Roboto-Light';
  font-style: normal;
  font-weight: 300;
  src: url(../fonts/Roboto-Light.woff);
  src: local('Roboto-Light'),
       local('Roboto-Light'),
       url(../fonts/Roboto-Light.woff) format('woff'),
}
@font-face {
  font-family: 'Roboto-Regular';
  font-style: normal;
  font-weight: 300;
  src: url(../fonts/Roboto-Regular.woff);
  src: local('Roboto-Regular'),
       local('Roboto-Regular'),
       url(../fonts/Roboto-Regular.woff) format('woff'),
}
@font-face {
  font-family: 'Roboto-Bold';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/Roboto-Bold.woff);
  src: local('Roboto-Bold'),
       local('Roboto-Bold'),
       url(../fonts/Roboto-Bold.woff) format('woff'),
}
/* css 초기화 */
body {background:#fff;}
body,div,p,dl,dd,dt,footer,ol,ul,li,select,input,textarea{margin:0; padding:0; font-family: 'NotoSansKR','Roboto-Regular',dotum,sans-serif; font-size:16px; color:#333; line-height:160%;}
a {text-decoration:none; color:#333;}
a.default {cursor: default;}
a:focus {outline:none;}
li{list-style:none;}
table{border-collapse:collapse;}
h1, h2, h3, h4, h5, h6{margin: 0; color: #333; line-height: 160%; font-weight: 400}
img{vertical-align: middle; border: none;}
input, textarea, select {appearance: none; -webkit-appearance: none;}
input:focus,
select:focus,
textarea:focus{outline: none;}
input:disabled{background: #f8f8f8}
input.input_calendar{background: url(../images/btn_i_calendar.png) no-repeat calc(100% - 20px) 50%; background-size: 20px; }
/* link */
a {text-decoration:none; color:#333; cursor: pointer;}
a link,
a:visited{font-size:; color:#333; text-decoration:none;}
a:hover,
a:active {font-size:; color:#333; text-decoration:none;}
*:focus {outline:none}

/* layout */
.mt5{margin-top: 5px}
.mt10{margin-top: 10px}
.mt15{margin-top: 15px}
.mt20{margin-top: 20px}
.mt30{margin-top: 30px}
.mt40{margin-top: 40px}
.mt45{margin-top: 45px!important;}
.mt60{margin-top: 60px}
.mr30{margin-right: 30px}
.mr20{margin-right: 20px}
.ml10{margin-left: 10px}
.ml30{margin-left: 30px}
.mb10{margin-bottom: 10px}
.mb30{margin-bottom: 30px}
.mb120{margin-bottom: 120px}

.pr20{padding-right: 20px}
.pl20{padding-left: 20px}

.relative{position: relative;}
.h700{height: 700px;}

.f_left{float:left;}
.f_right{float:right;}
.txt_center{text-align:center;}
.txt_right{text-align:right;}
.w_100{width: 100%}

hr {width: 100%; border-top:1px solid #ccc; border-left:none; border-bottom:none; margin:0px 0px 0px 0px; display: inline-block; margin: 20px 0}
hr.m0 {width: 100%; border-top:1px solid #ccc; border-left:none; border-bottom:none; margin:0px 0px 0px 0px; display: inline-block; }
hr.dashed {width: 100%; border-top:1px dashed #ccc; border-left:none; border-bottom:none; margin:0px 0px 0px 0px; display: inline-block; }

.box_shadow{box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1); }
.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

/* font */
.font_point_noto{font-family: 'NotoSansKR-Bold';color: #FF8000}
.font_point_roboto{font-family: 'Roboto-Bold' ;color: #FF8000}
.font_noto{font-family: 'NotoSansKR-Bold';}
.font_roboto{font-family: 'Roboto-Bold' ;}

.font_point{color: #02C782}
.font_sub{color: #006B46}
.font_white{color: #fff}
.font_gray_0{color:#000}
.font_gray_4{color:#444;}
.font_gray_6{color:#666}
.font_gray_9{color:#999}
.font_gray_f{color:#fff}
.fs_12{font-size:12px;}
.fs_14{font-size:14px;}
.fs_16{font-size:16px;}
.fs_18{font-size:18px;}
.fs_20{font-size:20px;}
.fs_24{font-size:24px;}

/* form */
input{vertical-align:middle; border:0; width: 100%; height:44px; box-sizing: border-box;}
textarea{border: 1px solid #ddd; border-radius: 5px; resize: none; width: 100%; padding: 10px;caret-color: #02C782; box-sizing: border-box;}
select{vertical-align:middle; width: 100%; height: 36px; padding-left: 14px; box-sizing: border-box; border:1px solid #ccc; background: #fff url('../images/arrow_down.png') no-repeat calc(100% - 14px) center; background-size: 12px;}
input[type="checkbox"] {display:none;}
input[type="checkbox"] + label {display:inline-block;}
input[type="checkbox"] + label span {display:inline-block; width:18px; height:18px; margin:-3px 5px 0 0; vertical-align:middle; background:url('../images/check_off.png') right center no-repeat; cursor:pointer; background-size:18px;}
input[type="checkbox"]:checked + label span {width:18px; height:18px; background:url('../images/check_on.png') right center no-repeat; background-size:18px;}
input[type="radio"] {display:none;}
input[type="radio"] + label {display:inline-block;}
input[type="radio"] + label span {display:inline-block; width:20px; height:20px; margin:-3px 11px 0 0; vertical-align:middle; background:url('../images/btn_radio_off.png') no-repeat; cursor:pointer; background-size: 20px;}
input[type="radio"]:checked + label{color: #333; font-weight: bold}
input[type="radio"]:checked + label span {width:20px; height:20px; background:url('../images/btn_radio_on.png') no-repeat; background-size: 20px;}


.essential{color: #FF1111;}
::-webkit-input-placeholder {color:#999; font-family:'NotoSansKR','Roboto-Regular',dotum,sans-serif; font-size: 14px}/* WebKit, Blink, Edge */
:-moz-placeholder {color:#999; font-family:'NotoSansKR','Roboto-Regular',dotum,sans-serif; font-size: 14px} /* Mozilla Firefox 4 to 18 */
::-moz-placeholder {color:#999; font-family:'NotoSansKR','Roboto-Regular',dotum,sans-serif; font-size: 14px} /* Mozilla Firefox 19+ */
:-ms-input-placeholder {color:#999; font-family:'NotoSansKR','Roboto-Regular',dotum,sans-serif; font-size: 14px} /* Internet Explorer 10-11 */

/* button */
.btn_s a{font-family: 'NotoSansKR-Bold';border-radius: 5px; display: inline-block; width: 160px; height: 50px; line-height: 50px; text-align: center; box-sizing: border-box;}
.btn_m_slim a{font-family: 'NotoSansKR-Bold';border-radius: 5px; display: inline-block; width: 220px; height: 40px; text-align: center; border: 2px solid transparent; box-sizing: border-box; line-height: 40px}
.btn_m a{font-family: 'NotoSansKR-Bold';border-radius: 5px; display: inline-block; width: 220px; height: 50px; text-align: center; border: 2px solid transparent; box-sizing: border-box; line-height: 50px}
.btn_l a{font-family: 'NotoSansKR-Bold';border-radius: 5px; display: inline-block; width: 260px; height: 50px; text-align: center; border: 2px solid transparent; box-sizing: border-box; line-height: 50px}
.btn_b a{font-family: 'NotoSansKR-Bold';border-radius: 5px; display: inline-block; width: 300px; height: 40px; line-height: 40px; text-align: center;}
.btn_full a{font-family: 'NotoSansKR-Bold';width: 100%;font-family:'NotoSansKR-Bold';border-radius: 5px; display: block; text-align: center; height: 40px; line-height: 38px}
.btn_detail_info a{font-family: 'NotoSansKR-Bold';width: 100%;border-radius: 5px; display: block; text-align: center; height: 45px; line-height: 45px}
.input_btn_line a{font-family: 'NotoSansKR-Bold';text-align: center; display: block; width: 120px; height: 48px; border-radius: 5px; border: 1px solid #666; line-height: 48px;}
.input_btn_point a{font-family: 'NotoSansKR-Bold';text-align: center; display: block; width: 120px; height: 48px; border-radius: 5px; background: #006B46; border: 1px solid #006B46; color: #fff; line-height: 48px;}

/* .btn_form a{display: inline-block; width: 150px; height: 36px; border: 1px solid #424242; box-sizing: border-box; text-align: center; line-height: 36px} */
.btn_basic a{font-family: 'NotoSansKR-Bold';background: #DDD; color: #000; border: 1px solid #DDD}
.btn_beware a{font-family: 'NotoSansKR-Bold';background: #E56565; color: #fff; border: 1px solid #E56565}
.btn_point a{font-family: 'NotoSansKR-Bold';font-size: 16px; background: #02C782; color: #fff; border: 1px solid #02C782}
/* .btn_point_line a{background: #fff; color: #02C782; border: 1px solid #02C782} */
.btn_sub a{font-family: 'NotoSansKR-Bold';border: 1px solid #006B46; background: #fff; color: #006B46;}
.btn_line a{font-family: 'NotoSansKR-Bold';border: 1px solid #000; background: #fff; color: #000;}
.btn_cloudy a{font-family: 'NotoSansKR-Bold';border: 1px solid #666; background: #fff; color: #666;}


.btn_70_line{border-radius: 5px; display: block; width: 100%; height: 70px; line-height: 70px; text-align: center; color: #999; border: 1px solid #ccc; box-sizing: border-box; font-size: 16px;}
.btn_70_point{border-radius: 5px; display: block; width: 100%; height: 70px; line-height: 70px; text-align: center; color: #fff; background: #02C782; font-size: 16px;}
.btn_70_point a{display: block; color: #fff;}
.btn_70_line a img, .btn_70_point a img{width: 24px; vertical-align: middle; margin-right: 10px;}
.btn_70_line a{display: block; color: #999;}
.btn_a img{width: 16px; margin-top: -2px; vertical-align: middle; margin-right: 10px;}
/* table */
.board_table{width: 100%; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; margin-bottom: 10px}
.board_table th,
.board_table td{padding: 0 30px; color: #666}
.board_table th{border-bottom: 1px solid #707070; text-align: left; height: 34px; font-weight: 400;}
.board_table th.text_center,
.board_table td.text_center{text-align: center}
.board_table td{height: 45px}
.board_table td a{color: #666}
.board_table.detail_view{margin-bottom: 22px}
.board_table.detail_view th{padding: 12px 0;}
.board_table.detail_view th p{color: #333; font-size: 16px}
.board_table.detail_view th .date{color: #999; font-size: 14px}
.board_table.detail_view td{padding: 25px 0}
.detail_table{border-top: 1px solid #666; width: 100%;}
.detail_table tr{border-bottom: 1px solid #ddd }
.detail_table th{background: #F6F6F6; padding: 10px 20px; height: 20px; font-weight: 400; text-align: left; width: 80px}
.detail_table td{padding: 10px 30px}
.detail_table td span{font-size: 12px; color: #999; margin-left: 30px}

/* paging */
.paging_wrap{width: 690px; float: right;}
.paging{overflow: hidden; text-align:center; margin-bottom: 15px; margin-top: 40px;}
.paging li{display: inline-block; }
.paging a{font-family: 'Roboto-Regular'; background: #fff; color:#444; width: 32px; height: 32px; line-height: 32px; border-radius: 5px; display: inline-block; border: 1px solid #ddd;}
.paging a:hover{width: 32px; height: 32px; text-decoration:none; border:1px solid transparent}
.paging li.active a{color:#fff; background: #006B46; border: 1px solid #006B46;}


/* modal 공통 */
.modal{background: #fff; position: fixed; width: 600px; height: 500px; top:50%; left:50%; transform: translate(-50%, -50%); border-radius: 16px; z-index: 200; }
.madal_con{width: 100%; height: 100%; box-sizing: border-box;}
.md_overlay{position: fixed; width: 100%; height: 100vh; top: 0; left: 0; background: rgba(0,0,0,.5); opacity: 0; visibility: hidden; z-index: 100;}
.modal_btn{height: 40px;}
.modal_btn a{cursor: pointer; border-radius: 5px;position: absolute; bottom: 40px; left:0; right:0; margin: 0 auto; display: block; width: 180px; height: 50px; line-height: 50px; text-align: center; color: #fff; background: #02C782}
.modal_close_btn img{width: 24px; top:30px; right:30px; position: absolute; cursor: pointer;}
.modal_close_btn_wh img{width: 24px; top:-40px; right:0; position: absolute; cursor: pointer;z-index: 200}
/* swiper */
.swiper-pagination{bottom:30px; width: 100%;}
.swiper-pagination-bullet{width: 8px; height: 8px; margin-left: 10px; background:#BDBDBD; opacity: 1}
.swiper-pagination-bullet-active{background:#424242; opacity: 1}
