/* @import url("https://fonts.googleapis.com/earlyaccess/notosanskr.css"); */
*{margin:0;padding:0;font-family:'Noto Sans KR',Arial,sans-serif;color:#595959}
html{box-sizing:border-box}
*,:before,:after{box-sizing:inherit}
html,body{width:100%;min-width:450px;height:100%;background-color:#fff;font-style:normal;font-weight:normal;font-family:'Noto Sans KR',Arial,sans-serif;color:#000;-ms-overflow-style:-ms-autohiding-scrollbar}
body,input,select{font-size:.9em}
#noScript{margin:16px;color:#000}
:lang(en-GB){quotes:'\2018\' \'\2019\' \'\201C\' \'\201D'}
:lang(zh){font-family:'微软雅黑'}

@-ms-viewport{width:device-width}
@-moz-viewport{width:device-width}
@-o-viewport{width:device-width}
@-webkit-viewport{width:device-width}@viewport{width:device-width}

/* Theme layout styles */
#fullPage{display:flex;position:relative;justify-content:center;align-items:center}
#fullPage,#brandingWrapper{width:100%;height:100%;background-color:inherit}
#brandingWrapper{position:absolute;top:0;left:0;background-color:#333}
.illustrationClass{background-position:50% 50%}
.overlay{position:absolute;top:0;left:0;z-index:1;width:100%;height:100%;background-color:rgba(0,0,0,0.3)}
#branding{/* A background image will be added to the #branding element at run-time once the illustration image is configured in the theme. 
       Recommended image dimensions: 1420x1200 pixels, JPG or PNG, 200 kB average, 500 kB maximum. */
height:100%;background-color:inherit;background-repeat:no-repeat;background-size:cover;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover}
#contentWrapper{position:relative;z-index:200;width:450px;height:650px;/* opacity: 0.9; */}
#contentWrapper:after{position:absolute;/* for IE7 */top:0;left:0;z-index:-1;width:100%;height:100%;border-radius:7px;background-color:#fff;content:'';opacity:0.92;hereisyouropacity*-moz-box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22);-webkit-box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22);box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22)}
#content{min-height:100%;height:auto !important;margin:0 auto -50px;padding:0 50px}
#header{overflow:hidden;min-height:100px;margin-bottom:50px;padding-top:90px;font-size:1.7em;font-weight:500}
#header img{/* Logo image recommended dimension: 60x60 (square) or 350X35 (elongated), 4 kB average, 10 kB maximum. Transparent PNG strongly recommended. */width:auto;max-width:100%;height:auto}
#workArea,#header{word-wrap:break-word}
#footerPlaceholder{height:40px}
#footer{position:absolute;bottom:0;width:100%;height:50px;font-size:.9em;color:#666;text-align:center}
#footerLinks{float:none;padding-top:10px}
#copyright{color:#696969;}
.pageLink{padding-left:16px;color:#000}

/* Common content styles */
.clear{clear:both}
.float{float:left}
.floatReverse{float:right}
.indent{margin-left:16px}
.indentNonCollapsible{padding-left:16px}
.hidden{display:none}
.notHidden{display:inherit}
.error{color:#c85305}
.actionLink{display:block;margin-bottom:8px}
a{background-color:transparent;color:#2672ec;text-decoration:none}
ul{list-style-type:disc}
ul,ol,dd{padding:0 0 0 16px}
h1,h2,h3,h4,h5,label{margin-bottom:8px}
.submitMargin{margin-top:10px;margin-bottom:30px}
.topFieldMargin{margin-top:8px}
.fieldMargin{margin-bottom:8px}
.groupMargin{margin-bottom:20px}
.sectionMargin{margin-bottom:64px}
.block{display:block}
.autoWidth{width:auto}
.fullWidth{width:100%}
.fullWidthIndent{width:320px}
.smallTopSpacing{margin-top:15px}
.mediumTopSpacing{margin-top:25px}
.largeTopSpacing{margin-top:35px}
.smallBottomSpacing{margin-bottom:5px}
.mediumBottomSpacing{margin-bottom:15px}
.largeBottomSpacing{margin-bottom:25px}
input{max-width:100%;margin-bottom:8px;padding:5px;border:1px solid #aeaeae;border-radius:3px;font-family:inherit}
input[type=radio],input[type=checkbox]{margin-bottom:0;border:none;vertical-align:middle}
span.submit,input[type=submit]{display:inline-block;min-width:80px;width:100%;height:50px;margin-bottom:8px;padding:4px 20px 6px;border:1px solid #58a8f7;border-style:solid;border-width:1px;border-radius:5px;background-color:#58a8f7;line-height:35px;font-size:1.3em;font-weight:400;color:#fff;text-align:center;transition:background 0;cursor:pointer;-ms-user-select:none;-moz-transition:background 0;-webkit-transition:background 0;-o-transition:background 0;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-o-user-select:none;user-select:none}
input[type=submit]:hover,span.submit:hover{background:#0072bc}
input.text{height:43px;padding:5px;border:solid 1px #BABABA;border-radius:2px;font-size:1em}
input.text:focus{border:1px solid #0072bc}
select{min-width:60px;max-width:100%;height:43px;padding:5px;border:1px solid #aeaeae;border-radius:2px}
h1,.giantText{font-size:2em;font-weight:lighter}
h2,.bigText{font-size:1.33em;font-weight:lighter}
h3,.normalText{font-size:1em;font-weight:normal}
h4,.smallText{font-size:.9em;font-weight:normal}
h5,.tinyText{font-size:.8em;font-weight:normal}
.hint{color:#999}
.emphasis{font-weight:700;color:#2F2F2F}
.smallIcon{height:20px;padding-right:12px;vertical-align:middle}
.largeIcon{height:48px;/* width:48px; */vertical-align:middle}
.largeTextNoWrap{display:table-cell;height:48px;/* needed when in float */font-size:1.15em;vertical-align:middle;white-space:nowrap}
.idp{overflow:hidden;clear:both;height:64px;margin-bottom:5px;padding:8px}
.idp:hover{background-color:#AED5FB;cursor:pointer}
.idpDescription{width:80%}
#errorText{display:block;margin-top:-5px;color:#c00}

/* Language Box */
#langBtn {display: flex;align-items: center;justify-content: center;gap: 8px;height: 32px;font-size: 14px;padding: 0 6px 0 6px;border: 1px solid #D9DADC;border-radius: 50px;background: #fff;box-sizing: border-box;cursor:pointer;}
#downArrow { background: url(../images/common/flag_korea.svg) no-repeat right center / 16px auto;}
#langDiv {position: relative;font-size: 12px;z-index: 999;cursor:pointer;}
#langDiv .dropdown-list ul{padding:0px;}
#langDiv .dropdown-list ul li{padding-left:22px;}
#nowLangSpan{padding-left:22px;}
.dropdown-list {display: none;position: absolute;top: calc(100% + 2px);left: 0;right: 0;border: 1px solid #C8CACC;border-radius: 6px;padding: 6px;background: #fff;}
.list-style-none {list-style:none;}
.dropdown-list li {display: flex;align-items: center;gap: 6px;white-space: nowrap;padding: 2px 4px;}
.dropdown-list li:hover { background-color:rgb(133 166 199 / 60%); border-radius: 6px; }
.flag-kr { background: url(../iamges/KoreaFlag.png) no-repeat left center / 16px auto; }
.flag-en { background: url(../iamges/AmericaFlag.png) no-repeat left center / 16px auto; }
.flag-zh { background: url(../iamges/ChinaFlag.png) no-repeat left center / 16px auto; }
.downArrow { background: url(../iamges/ico_dropdown.gif) no-repeat left center / 16px auto; width: 16px;height: 20px;display: inline-block;line-height: 23px;background-position-y: 4px;}


/* media query */
/* Form factor: intermediate height layout. Reduce space of the header. */
@media only screen and (max-height: 820px) {
	#header{overflow:hidden;min-height:0;margin-bottom:30px;padding-top:50px}
	#contentWrapper{height:600px}
	.groupMargin{margin-bottom:15px}
	.submitMargin{margin-bottom:15px}
}
/* Form factor: intermediate height layout. Reduce space of the header. */
@media only screen and (max-height: 500px)
{
	#header{margin-bottom:30px;padding-top:30px}
}
/* Form factor: intermediate layout (WAB in non-snapped view falls in here) */
@media only screen and (max-width: 600px)
{
	html,body{min-width:260px}
	#brandingWrapper{display:none}
	#contentWrapper{float:none;width:100%;height:100%;margin:0 auto}
	#content,#header{width:400px;margin-left:auto;margin-right:auto;padding-left:0;padding-right:0}
	#workArea{width:100%}
	#contentWrapper:after{border-radius:inherit;-moz-box-shadow:inherit;-webkit-box-shadow:inherit;box-shadow:inherit}
        #footer{position:inherit;}
}
@media only screen and (max-width: 450px)
{
	body{font-size:.8em}
	#content{width:auto;margin-right:25px;margin-left:25px}
	#header{width:auto}
	span.submit,input[type=submit]{height:inherit;font-size:1.1em}
	.fullWidth{width:100%;margin-left:auto;margin-right:auto}
	.fullWidthIndent{width:85%}
	.idpDescription{width:70%}
}
/* Form factor: snapped WAB (for WAB to work in snapped view, the content wrapper width has to be set to 260px) */
@media only screen and (max-width:280px)
{
	#contentWrapper{width:260px}
	.idpDescription{max-width:160px;min-width:100px}
}


@media \0screen\,screen\9
{
	/* under ie8 */
	#contentWrapper{height:100%;position:absolute;top:0;right:0;}
	input.text{height:33px}

}