@charset "utf-8";
/*
Copyright (c) 2021 Kil Hyung-jin, with Reserved Font Name Pretendard.
https://github.com/orioncactus/pretendard

This Font Software is licensed under the SIL Open Font License, Version 1.1.
This license is copied below, and is also available with a FAQ at:
http://scripts.sil.org/OFL
*/

/* Pretendard 900 */
@font-face {
  font-family: 'Pretendard';
  font-weight: 900;
  font-display: swap;
  src: url('../css/font/Pretendard-Black.eot'); /* IE9 Compat Modes */
  src: local(''),
      url('../css/font/Pretendard-Black.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
      url('../css/font/Pretendard-Black.woff2') format('woff2'), /* Super Modern Browsers */
      url('../css/font/Pretendard-Black.woff') format('woff'), /* Modern Browsers */
      url('../css/font/PretendardVariable.ttf') format('truetype'), /* Safari, Android, iOS */
      url('../css/font/Pretendard-Black.svg#Pretendard') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Pretendard';
  font-weight: 800;
  font-display: swap;
  src: url('../css/font/Pretendard-ExtraBold.eot'); /* IE9 Compat Modes */
  src: local(''),
      url('../css/font/Pretendard-ExtraBold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
      url('../css/font/Pretendard-ExtraBold.woff2') format('woff2'), /* Super Modern Browsers */
      url('../css/font/Pretendard-ExtraBold.woff') format('woff'), /* Modern Browsers */
      url('../css/font/PretendardVariable.ttf') format('truetype'), /* Safari, Android, iOS */
      url('../css/font/Pretendard-ExtraBold.svg#Pretendard') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Pretendard';
  font-weight: 700;
  font-display: swap;
  src: url('../css/font/Pretendard-Bold.eot'); /* IE9 Compat Modes */
  src: local(''),
      url('../css/font/Pretendard-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
      url('../css/font/Pretendard-Bold.woff2') format('woff2'), /* Super Modern Browsers */
      url('../css/font/Pretendard-Bold.woff') format('woff'), /* Modern Browsers */
      url('../css/font/PretendardVariable.ttf') format('truetype'), /* Safari, Android, iOS */
      url('../css/font/Pretendard-Bold.svg#Pretendard') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Pretendard';
  font-weight: 600;
  font-display: swap;
  src: url('../css/font/Pretendard-SemiBold.eot'); /* IE9 Compat Modes */
  src: local(''),
      url('../css/font/Pretendard-SemiBold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
      url('../css/font/Pretendard-SemiBold.woff2') format('woff2'), /* Super Modern Browsers */
      url('../css/font/Pretendard-SemiBold.woff') format('woff'), /* Modern Browsers */
      url('../css/font/PretendardVariable.ttf') format('truetype'), /* Safari, Android, iOS */
      url('../css/font/Pretendard-SemiBold.svg#Pretendard') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Pretendard';
  font-weight: 500;
  font-display: swap;
  src: url('../css/font/Pretendard-Medium.eot'); /* IE9 Compat Modes */
  src: local(''),
      url('../css/font/Pretendard-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
      url('../css/font/Pretendard-Medium.woff2') format('woff2'), /* Super Modern Browsers */
      url('../css/font/Pretendard-Medium.woff') format('woff'), /* Modern Browsers */
      url('../css/font/PretendardVariable.ttf') format('truetype'), /* Safari, Android, iOS */
      url('../css/font/Pretendard-Medium.svg#Pretendard') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 400;
  font-display: swap;
  src: url('../css/font/Pretendard-Regular.eot'); /* IE9 Compat Modes */
  src: local(''),
      url('../css/font/Pretendard-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
      url('../css/font/Pretendard-Regular.woff2') format('woff2'), /* Super Modern Browsers */
      url('../css/font/Pretendard-Regular.woff') format('woff'), /* Modern Browsers */
      url('../css/font/PretendardVariable.ttf') format('truetype'), /* Safari, Android, iOS */
      url('../css/font/Pretendard-Regular.svg#Pretendard') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Pretendard';
  font-weight: 300;
  font-display: swap;
  src: url('../css/font/Pretendard-Light.eot'); /* IE9 Compat Modes */
  src: local(''),
      url('../css/font/Pretendard-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
      url('../css/font/Pretendard-Light.woff2') format('woff2'), /* Super Modern Browsers */
      url('../css/font/Pretendard-Light.woff') format('woff'), /* Modern Browsers */
      url('../css/font/PretendardVariable.ttf') format('truetype'), /* Safari, Android, iOS */
      url('../css/font/Pretendard-Light.svg#Pretendard') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Pretendard';
  font-weight: 200;
  font-display: swap;
  src: url('../css/font/Pretendard-ExtraLight.eot'); /* IE9 Compat Modes */
  src: local(''),
      url('../css/font/Pretendard-ExtraLight.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
      url('../css/font/Pretendard-ExtraLight.woff2') format('woff2'), /* Super Modern Browsers */
      url('../css/font/Pretendard-ExtraLight.woff') format('woff'), /* Modern Browsers */
      url('../css/font/PretendardVariable.ttf') format('truetype'), /* Safari, Android, iOS */
      url('../css/font/Pretendard-ExtraLight.svg#Pretendard') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Pretendard';
  font-weight: 100;
  font-display: swap;
  src: url('../css/font/Pretendard-Thin.eot'); /* IE9 Compat Modes */
  src: local(''),
      url('../css/font/Pretendard-Thin.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
      url('../css/font/Pretendard-Thin.woff2') format('woff2'), /* Super Modern Browsers */
      url('../css/font/Pretendard-Thin.woff') format('woff'), /* Modern Browsers */
      url('../css/font/PretendardVariable.ttf') format('truetype'), /* Safari, Android, iOS */
      url('../css/font/Pretendard-Thin.svg#Pretendard') format('svg'); /* Legacy iOS */
}





/*------------
reset
------------*/

* {font-family: 'Pretendard', sans-serif;}
*, ::after, ::before{box-sizing: border-box; scroll-behavior: smooth;}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike,
strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption,
footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, p, span, i, input, select{
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	vertical-align: baseline;
	font-weight:500;
	font-family: 'Pretendard', sans-serif;
	/* font-family:-apple-system, BlinkMacSystemFont,'Apple SD Gothic Neo','Malgun Gothic','맑은 고딕','NanumGothic','나눔고딕','Dotum','돋움',sans-serif; */
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}

html {
   width: 100%;
   height: 100%;
   display: table;
}

body {
   width: 100%;
   display: table-cell;
   overflow-x:hidden;
}

html, body {
   line-height:1;
   margin: 0px;
   padding: 0px;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
  width:100%
}

a, a:hover, a:active{
	text-decoration: none;
   color:#000;
}

.ui-page-theme-a a:visited, html .ui-bar-a a:visited, html .ui-body-a a:visited, html body .ui-group-theme-a a:visited{
	text-decoration: none;
   color:#000;
}

.ui-page-theme-a a, html .ui-bar-a a, html .ui-body-a a, html body .ui-group-theme-a a{
    color: #000;
}

b{
	font-weight:bold;
}

i{
	font-size:1.1em
}

strong{
	font-weight:bold
}

table caption, .hidden{
  position: absolute;
  z-index:-1;
  width: 1px;
  height: 1px;
  margin: -1px;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path:inset(50%);
  overflow: hidden;
}

hr {
  display: block;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  margin-left: auto;
  margin-right: auto;
  border-style: inset;
  border: 0;
}

/*
img {
   image-rendering: -webkit-optimize-contrast;
}
*/




/*------------------------
input
------------------------*/

input{
  appearance: none;
  border:0;
	border-radius: 0;
	border:1px solid #cdd1d7;
	height:44px;
	padding-left:8px;
	font-weight:normal;
	background-color:#fff;
  padding:0px 10px;
  font-size:15px;
  display:inline-block;
  vertical-align:middle;
  border-radius:4px;
  background-position:92% center;
  background-repeat: no-repeat;
}

input::placeholder{color:#c2c7ce; font-weight:300; opacity: 1}
input[readonly] {color:#888}
input:focus {outline:none;}
input:focus {border:1px solid #002788}
input[type=button]{padding:0}

input[type="checkbox"][disabled], input[type="checkbox"][readonly]{
  background:#edf6fc;
  color:#5d5d5d
}

.cal-input{
    background-image:url(../images/calendar_icon.png);
}
.time-input{
    background-image:url(../images/time_icon.png);
}
.loca-input{
    background-image:url(../images/loca_icon.png);
}
.port-input{
    background-image:url(../images/port_icon.png);
}


/*------------------------
select
------------------------*/

select {
   appearance: none;
   background: #fff url(../images/select_arrow.png) no-repeat 93% center;
   height:44px;
   line-height:44px;
   width:100px;
   padding:0px 10px;
   border: 1px solid #cdd1d7;
   font-size:15px;
   display:inline-block;
   vertical-align:middle;
   border-radius:4px
}

select::-ms-expand {
    display: none;
}

select[readonly] {background:#f5f5f5; color:#5d5d5d}
select:focus {outline:none;}
select:focus {border:1px solid #002788}






/*------------------------
check box
------------------------*/

.ckdbox {
	position: relative;
	display:inline;
}

.ckdbox input[type="checkbox"] {
  display: none;
}

.ckdbox input[type="checkbox"] + label {
	cursor: pointer;
	display:inline-block;
}

.ckdbox input[type="checkbox"] + label:before {
	 content: "";
	 display: inline-block;
   width: 16px;
   height: 16px;
   text-align: center;
   border: 1px solid #ddd;
   background:#ddd url(../images/ico_ckd_g.png) no-repeat center center;
	 vertical-align:middle;
   background-size:9px;
   border-radius:2px
	}

.ckdbox input[type="checkbox"]:checked + label:before {
	 background:#32baf7 url(../images/ico_ckd.png) no-repeat center center;
	 border: 1px solid #32baf7;
	 width: 16px;
   height: 16px;
   background-size:9px;
}



/*------------------------
check box
------------------------*/

.filebox input{
   font-size:12px
}

.filebox input[type="file"] {
  position: absolute;
  z-index:-1;
  width: 1px;
  height: 1px;
  margin: -1px;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path:inset(50%);
  overflow: hidden;
  border: 0;
}

.filebox label {
   display: inline-block;
   color: #000;
   vertical-align: top;
   background-color: #fff;
   border: 1px solid #cdd1d7;
   height: 30px;
   line-height: 30px;
   cursor: pointer;
   padding:0px 10px;
   font-size:12px;
   box-shadow: -2px 2px 4px rgb(0 0 0 / 6%);
} /* named upload */

.filebox .upload-name {
   display: inline-block;
   line-height: normal;
   vertical-align: middle;
   background-color: #f1f3f8;
   border: 1px solid #eff3f7;
   appearance: none;
 }




 /*------------------------
 radio
 ------------------------*/

 .i-radio {
    position: relative;
    height: 16px;
    line-height: 16px;
    cursor: pointer;
    display: inline-block;
    padding-left:20px
 }

 .i-radio input {
   position: absolute;
   z-index:-1;
   width: 1px;
   height: 1px;
   margin: -1px;
   clip: rect(1px, 1px, 1px, 1px);
   clip-path:inset(50%);
   overflow: hidden;
 	 opacity:0;
 }

 .i-radio .ico {
 	position:absolute;
 	left:0px;
 	top:0px;
 	width:16px;
 	height:16px;
 	/*background:url(../images/ico_radio_before.png) no-repeat 0 0;*/
   background:#fff;
   border:1px solid #cdd1d7;
   border-radius:15px
 }

 .i-radio input:checked + .ico {
 	background-position:0 -40px;
 	/*background:url(../images/ico_radio_after.png) no-repeat 0 0;*/
   background:#fff;
   border:5px solid #002788;
   border-radius:15px
 }




/*------------------------
드래그색상
------------------------*/

::selection {
    background:#002788;
    color: #fff;
    text-shadow: none;
}
::-moz-selection {
    background:#002788;
    color: #fff;
    text-shadow: none;
}
::-webkit-selection {
    background:#002788;
    color: #fff;
    text-shadow: none;
}




/*------------------------
common
------------------------*/

#wrap{
   width:100%;
   /*max-width:640px;*/
   min-width:320px;
   height:100%;
   margin:auto;
}

#container{
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}

.content{
  width:100%;
  height:100%;
  padding:77px 0 100px 0
}

.content .title{
  line-height:50px;
  background: linear-gradient(75deg, #26a8f2, #3cc7fb);
  font-size:18px;
  padding-left:40px;
  font-weight:600;
  position:relative;
  color:#fff
}

.content .title .arrow{
  display:inline-block;
  width:10px;
  height:16px;
  background:url(../images/arrow_prev_icon_w.png) no-repeat center;
  position:absolute;
  left:20px;
  top:17px
}




/*** header ***/
#header{
  width:100%;
  position:fixed;
  top:0;
  left: 50%;
  transform: translateX( -50% );
  z-index:100;
  height:77px;
  border-bottom:1px solid #eeeeee;
  background:#fff;
  box-shadow: 0px 5px 10px rgb(0 0 0 / 3%);
}

#header .logo{
  padding:17px 0 0 20px;
  font-size:22px
}

#header .logo img{
  display:inline-block;
  vertical-align:middle;
}

#header .logo .text{
  display:inline-block;
  vertical-align:middle;
}

#header .rmenu{
  position:absolute;
  right:20px;
  top:25px
}

#header .rmenu a{
  float:left;
  display:block;
  background-repeat: no-repeat;
  margin-left:15px
}

#header .rmenu a.home{
  width:20px;
  height:19px;
  background-image: url(../images/home_icon.png);
  background-size:20px
}

#header .rmenu a.search{
  width:24px;
  height:24px;
  background-image: url(../images/search_icon.png);
  background-size:24px
}

#header .rmenu a.info{
  width:22px;
  height:21px;
  background-image: url(../images/info_icon.png)
}

#header .rmenu a.showInfo{
  width:24px;
  height:24px;
  background-image: url(../images/help_icon.png);
  background-size:24px
}



/*** etc ***/
.l-cont{float:left;}
.r-cont{float:right;}

.t-left{text-align:left}
.t-center{text-align:center;}
.t-right{text-align:right}

.block{display:block;}
.inline{display:inline-block;}

.t-blue{color:#1072d5}
.t-org{color:#ff4800}

.mt10{margin-top:10px !important}
.mt20{margin-top:20px !important}
.mb20{margin-bottom:20px !important}
.ma{margin:0 !important}
.mh{margin:15px 0 !important}
