/*support*/
.content.support{margin:0px auto; text-align:center;}
/* .content.support input{
	width:70%; max-width:720px; display:inline-block; padding:10px; padding-left:44px; font-size:18px; border-radius:4px; border:solid 1px #e5e5e5; background-color:#fff; text-align:left; margin-bottom:20px;
	background-image:url('../image/icon-support-search.png'); background-repeat:no-repeat; background-size:24px 24px; background-position:10px center;
} */
.content.support .input-wrap {
	width:70%; max-width:720px; display:inline-block;margin-bottom:20px;position: relative;
}
.content.support input{
	width:100%; padding:10px; padding-left:44px; font-size:18px; border-radius:4px; border:solid 1px #e5e5e5; background-color:#fff; text-align:left; 
	background-image:url('../image/icon-support-search.png'); background-repeat:no-repeat; background-size:24px 24px; background-position:10px center;
}
.content.support input:focus{border-color:#28d5b9;}
.content.support form button{width:20%; max-width:160px; padding:10px 20px; font-size:18px; border-radius:4px; background-color:#28d5b9; color:#fff;}
.content.support form button:hover{background-color:#00a0e9;}
.trisection.support{padding:30px 10px 28px; margin-top:30px; background-color:#fafcff; border:solid 1px #e5e5e5;}
.trisection.support h4{font-size:18px; color:#00284c;margin-top: 8px;}
.trisection.support p {
	font-size: 12px;
	padding: 5px 10px;
	height: 46px;
	color: #8aa5ab;
}
.trisection.support img{display:inline-block; width:50px;}
.trisection.support button{font-size:16px; margin-top:12px; padding:10px 20px; background-color:#4f5b66; color:#fff; border-radius:4px;}
.trisection.support button:hover{background-color:#00a0e9;}

/*search*/
.content.search{margin:80px auto;}
.search-top{width:100%; max-width:720px; margin:0 auto; background-color:#fff; border:solid 1px #e5e5e5; padding:10px; border-radius:4px;}
.search-top input{float:left; background:none; border:0; width:60%; font-size:18px; padding:0 10px; height:30px;}
.search-top select{float:left; background:none; border:0; width:30%; font-size:16px; height:30px;}
.search-top button{
	float:left; border:0; width:10%; border-left:solid 1px #e5e5e5;  height:30px; text-align:center; background-color:transparent;
	background-image:url('../image/icon-support-search.png'); background-repeat:no-repeat; background-size:24px 24px; background-position:center center;
}
.search-top button:hover{background-image:url('../image/icon-support-search-green.png');}

.search-result{width:100%; max-width:960px; margin:0 auto; margin-top:40px;}
.search-result .row{width:100%; padding:20px 10px; border-bottom:solid 1px #e5e5e5;}
.search-result .row:hover{background-color:#fafcff;}
.search-result .subject{display:inline-block; font-size:18px; font-weight:700; color:#000; padding-right:10px;}
.search-result .subject:hover{color:#00a0e9;}
.search-result .category{display:inline-block; font-size:14px; font-weight:700; color:#28d5b9;}
.search-result .description{display:block; width:100%; font-size:16px; line-height:20px; padding:10px;}

/* FAQ */
@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700');
html,body {height:100%;}
html{margin:0; padding:0;}
body{margin:0; padding:0; font-size:16px; font-family:'Lato', AppleGothic,arial,Helvetica, sans-serif; font-weight:300; color:#4f5b66; overflow-x:hidden; word-break:keep-all;}
h1, h2, h3, h4, p, header, footer, div, section, article, aside, nav, ul, li, dl, dt, dd{margin:0; padding:0; position:relative; box-sizing:border-box;}
form input, button{font-family:'Lato', AppleGothic,arial,Helvetica, sans-serif; font-weight:300; box-sizing:border-box;}

p{line-height:1.5em;}
a{margin:0; padding:0; color:inherit; font-size:inherit; text-decoration:none;}
ul, li{list-style:none;}
img{display:inline-block; border:0;}

form input{margin:0; padding:0; box-sizing:border-box; background-color:#fff; border:solid 1px #fff; }
form input:focus{border-color:#00a0e9;}

button{margin:0; padding:0; border:0; cursor:pointer; box-sizing:border-box;}
*:focus {outline:none;}

.content{width:100%; max-width:1420px; margin:0 auto; padding:0 10px;}

.main-content{width:100%; min-height:100%; max-width:1420px; margin:0 auto; padding:0 10px;}
.clear-div{clear:both;}

.btn-to-top{display:none; position:fixed; width:50px; height:50px; bottom:25px; right:25px; z-index:70; transition:none; cursor:pointer;}
.btn-to-top img{width:100%;}

.btn-center-container{width:100%; text-align:center;}
.last-menu{margin-right:0 !important;}

.halfsection{float:left; width:48%; margin:0 1%; padding:20px;}
@media (max-width:640px){.halfsection{width:98%; height:auto; margin:20px 1%;}}

.trisection{float:left; width:31.33333333333333%; margin:0 1%; padding:20px;}
@media (max-width:820px){.trisection{width:48%;}}
@media (max-width:640px){.trisection{width:98%; height:auto; margin:20px 1%;}}

.quadrisection{float:left; width:23%; margin:0 1%; padding:20px;}
@media (max-width:820px){.quadrisection{width:48%;}}
@media (max-width:640px){.quadrisection{width:98%; height:auto; margin:20px 1%;}}

.full-content{width:100%; min-height:100%;}

/*서브페이지 공통*/
.sub-wrap{padding-top:40px;}
.sub-wrap.h100{min-height:100%;}

/*header*/
header{position:relative; width:100%; top:0; left:0; background-color:#fff; border-bottom:solid 1px #e5e5e5; z-index:90;}
.top-info{width:100%; height:43px; line-height:43px; padding:0 20px; background-color:#fafcff; font-size:14px; border-bottom:solid 1px #e5f0ff; text-align:right; transition:all 0.2s;}
.top-info.hide{margin-top:-43px;}
nav{width:100%; height:55px; cursor:default;}
.logo{position:absolute; height:36px; top:50%; left:20px; margin-top:-18px;}
.logo img{height:100%;}
nav ul{float:right; margin-right:10px;}
nav li{display:inline-block;}
nav li a{display:inline-block; line-height:55px; padding:0 10px; font-size:18px;}
nav li a:hover{color:#00a0e9;}
nav li a:hover:before{content:''; position:absolute; width:100%; height:3px; top:52px; left:0; background-color:#00284c;}
nav li.current a{font-weight:700; color:#000;}

.mobile-menu{display:none; position:fixed; width:100%; height:auto; top:55px; left:0; z-index:89; box-shadow:0px 0px 10px rgba(0,0,0,0.5);}
.mobile-menu li{
	width:100%; height:50px; background-color:#fff; border-bottom:solid 1px #e5e5e5;
	background-image:url('../image/icon-mobile-menu.png'); background-repeat:no-repeat; background-size:26px 26px; background-position:right 10px center;
}
.mobile-menu li a{display:inline-block; width:100%; line-height:50px; font-size:16px; padding:0 20px;}
.btn-mobile-menu{display:none; position:absolute; width:30px; height:30px; top:50%; left:10px; margin-top:-15px; cursor:pointer;}
.btn-mobile-login{display:none; position:absolute; width:30px; height:30px; top:50%; right:10px; margin-top:-15px; cursor:pointer;}


/*footer*/
footer{width:100%;background-color:#242b33; color:#fff; z-index:2;}

.footer-copyright{
	clear:both; cursor:default; border-top:solid 1px rgba(255,255,255,0.1); font-size:14px;
}
.footer-copyright li{height:50px; line-height:50px; display:inline-block; margin:0 10px;}
.footer-copyright li a{line-height:50px; display:block;}
.footer-copyright li a:hover{color:#00a0e9;}

.pop-container-wrap{display:none; position:fixed; width:100%; height:100%; top:0; left:0; z-index:89;}
.bg-black{display:none; position:fixed; width:100%; height:100%; top:0; left:0; z-index:90; background-color:rgba(0,0,0,0.8);}
.pop-container{display:none; position:absolute; width:960px; height:80%; top:10%; left:50%; margin-left:-480px; background-color:#fff; border-radius:10px; z-index:91; overflow-y:scroll;}
@media (max-width: 1024px){
	.pop-container{width:90%; left:5%; margin-left:0;}
}


/*faq*/
.ismobile{position:absolute; width:0px; height:0px; top:0; left:0; z-index:-999; display:none;}
.content.faq{width:100%; max-width:960px; margin:0 auto; padding-bottom:30px;}
section.faq-left{
	float:left; width:250px; border-right:solid 1px #e5e5e5; padding:10px; cursor:default;
}
section.faq-right{
	float:left; padding:0 10px; padding-left:30px; max-width:690px;
}

.faq-left dl{width:100%;}
.faq-left dt{font-size:18px; color:#000; font-weight:700; padding-bottom:10px;}
.faq-left dd{padding:5px 0;}
.faq-left dd.current{font-weight:700; color:#28d5b9;}
.faq-left dd.current a:before{content:'> ';}
.faq-left dd a:hover{color:#00a0e9;}

.faq-right a{color:#00a0e9;}
.faq-right a:hover{text-decoration:underline;}

h1.category{font-size:36px; font-weight:700; padding-bottom:10px;}
h2.faq-subject{font-size:28px; font-weight:700; color:#00a0e9;}
p.faq{padding:10px; font-size:16px; line-height:20px;}
dl.faq{padding:20px;}
dl.faq dt{font-size:18px; font-weight:700; color:#000; padding-bottom:5px;}
dl.faq dd{font-size:14px; padding:5px 0; padding-left:8px;}
dl.faq dd:before{content:''; position:absolute; width:4px; height:4px; top:12px; left:0px; border-radius:2px; background-color:#28d5b9;}

ul.faq-list{padding:10px;}
ul.faq-list li{font-size:18px; padding:5px 0; padding-left:25px;}
ul.faq-list li:before{
	content:''; position:absolute; width:24px; height:24px; top:4px; left:0;
	background-image:url('../image/icon-faq-list.png'); background-repeat:no-repeat; background-size:24px 24px; background-position:center center;
}
ul.faq-dash{padding:0 10px;}
ul.faq-dash li{font-size:14px; padding:5px; padding-left:16px;}
ul.faq-dash li:before{content:''; position:absolute; width:6px; height:2px; top:12px; left:5px; background-color:#28d5b9;}

dl.numbered{padding:20px;}
dl.numbered dt{font-size:18px; font-weight:700; color:#000; padding-bottom:5px;}
dl.numbered dd{font-size:14px; padding:5px 0;}
dd img{width:100%; display:block; margin:20px 0;}
img.w320{max-width:320px;}
img.w640{max-width:640px;}
img.wauto{width:auto;}

dd.table table{width:100%; margin:0; padding:0; border-collapse:collapse;}
dd.table table td{padding:10px; border:solid 1px #e5e5e5; vertical-align:top; text-align:left;}
dd.table table td li{padding-bottom:10px;}

@media (max-width: 680px){
	img.w640{width:100%;}
}
@media (max-width: 360px){
	img.w320{width:100%;}
}


.image-cont {
	position: relative;
}
.image-cont .image-body {}
.image-cont .image-popup {
	position: absolute;
	width: auto; max-height: 80%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	box-shadow: 1px 4px 20px rgba(0,0,0,0.3);
}
.image-cont .image-box {
	position: absolute;
	top: 0; left: 0;
}