/* reset */
html{font-size:15px; height:100%;}
body{height:100%; min-height:100%;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button,label,article{margin:0;padding:0;}
html, body, header,footer,section,nav,div,ul,dl,ol,li,dl,dd,dt,h1,h2,h3,h4,h5,h6,p,span,a,button,input,label,textarea,article{box-sizing:border-box;}
fieldset,img {border:0 none}
dl,ul,ol,menu,li,label {list-style:none}
blockquote, q {quotes:none}
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none}
input,select,textarea,button {font-size:100%;vertical-align:middle}
button {border:0 none;background-color:transparent;cursor:pointer}
table {border-collapse:collapse;border-spacing:0}
input[type='text'],input[type='password'],input[type='submit'],input[type='search'],select {-webkit-appearance:none; border-radius:0}
input:checked[type='checkbox'] {background-color:#666; -webkit-appearance:checkbox}
button,input[type='button'],input[type='submit'],input[type='reset'],input[type='file'] {-webkit-appearance:button; border-radius:0}
input[type='search']::-webkit-search-cancel-button {-webkit-appearance:none}
body,th,td,input,select,textarea{line-height:1.5;font-family:'Noto Sans KR','Noto Sans', 'Malgun Gothic', '맑은 고딕', sans-serif; color:#676767}
a{text-decoration:none}
button, a{font-family:inherit; color:inherit; font-size:inherit;}
a:active, a:hover {text-decoration:none}
a:focus, button:focus{outline:none;}
address,caption,cite,code,dfn,em,var {font-style:normal;font-weight:normal}
img{width:auto; height:auto; max-width:100%; max-height:100%;}

/*Hide*/
.hide{overflow:hidden;position:absolute;width:0;height:0;line-height:0;text-indent:-9999px}
.landscape{display:none;}

/*뷰포트에 따른 폰트사이즈 자동변형 방지*/
html{
-webkit-text-size-adjust: none; /*Chrome, Safari, newer versions of Opera*/
-moz-text-size-adjust: none; /*Firefox*/
-ms-text-size-adjust: none;  /*Ie*/
-o-text-size-adjust: none; /*old versions of Opera*/
}

/*common*/
header{background:#2D3063; height:4rem; position:relative; z-index:1000; text-align:center;}

h1{height:2rem; display:inline-block; margin-top:0.7rem;}
h2{color:#000000; font-size:2rem; text-align:center; margin:2rem 0;}

input[type="text"], input[type="password"]{border:1px solid #D0D0D0; line-height:3rem; padding:0 10px;}
input::placeholder{color:#b3b3b3}

input[type="checkbox"]{width:0; height:0; line-height:0; overflow:hidden;}
input[type="checkbox"] + label:before{content:''; display:inline-block; margin-right:0.3rem; width:1.3em; height:1.3em; vertical-align:middle; background:URL('/img/common/bu_input_chk.png') no-repeat center left / auto 100% #FFF;}
input:checked[type="checkbox"] + label:before{background-position:center right}

select{border:1px solid #D0D0D0; line-height:3rem; padding:0 25px 0 10px; background:URL('/img/common/bu_input_sel.png') no-repeat center right / auto 70%;}
select option.placeholder{color:#E1E1E1}

button[type="submit"]{color:#FFF; background:#2D3063; line-height:2.5rem;}

header .btn_gnb{top:0; left:0; width:3.4rem; height:4rem; font-size:0; position:absolute; display:block;}
header .btn_gnb span{display:block; transition:all .4s; position:absolute; left:50%; margin-left:-0.9rem; width:1.8rem; height:1px; background:#fff;}

header .btn_gnb span:nth-of-type(1){top:1.333rem;}
header .btn_gnb span:nth-of-type(2){top:50%;}
header .btn_gnb span:nth-of-type(3){bottom:1.333rem;}

header .btn_gnb.active span:nth-of-type(1){-webkit-transform:translateY(0.63rem) rotate(-45deg); transform:translateY(0.63rem) rotate(-45deg);}
header .btn_gnb.active span:nth-of-type(2){opacity:0;}
header .btn_gnb.active span:nth-of-type(3){-webkit-transform:translateY(-0.63rem) rotate(45deg); transform:translateY(-0.63rem) rotate(45deg);}

header .gnb_login, header .gnb_logout{right:0; top:0; font-size:0; width:3.4rem; height:4rem; position:absolute; display:block;}
header .gnb_login{background:URL('/img/common/btn_login.png') no-repeat center/100% auto;}
header .gnb_logout{background:URL('/img/common/btn_logout.png') no-repeat center/100% auto;}

nav{position:fixed; top:0; bottom:0; width:100%; left:-100%; padding-top:4rem; background:#FFF; transition:all .4s; z-index:999;}
nav.active{left:0;}

nav .gnb_box li{border-bottom:1px dashed #CBCBCB;}
nav .gnb_box li a{display:block; color:#000; font-weight:bold; font-size:1.34em; line-height:3; padding-left:1.4rem; position:relative;}
nav .gnb_box li a:after{content:''; width:1.6em; height:100%; display:inline-block; position:absolute; right:1.4rem; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7.4' height='12'%3E%3Cpath data-name='↳Color' d='M1.408 0 0 1.41 4.574 6 0 10.59 1.408 12 7.4 6Z' fill='%23c6c6c6'/%3E%3C/svg%3E") no-repeat right center;}

nav .policy_box{padding-left:1.4rem; margin-top:1rem}
nav .policy_box li a{display:inline-block; line-height:2.5; color:#8E8E8E}

.container{background:#F9F9F9; border:1px solid #F9F9F9;}

footer{text-align:center;}

footer .infor_box{background:#747474; padding:1.4em; font-size:0.667rem; color:#BBB;}

footer .infor_box > img{width:2.7rem; display:block; margin:0 auto 0.5em; opacity:0.7;}
footer .infor_box > strong{color:#D5D5D5; font-size:0.733em}

footer .infor_box .contect_box{color:#E6E6E6; margin:0.667rem auto}

footer .policy_box{background:#818181;}
footer .policy_box:after{content:''; display:block; clear:both;}
footer .policy_box li{width:50%; float:left;}
footer .policy_box li a{line-height:3rem; color:#FFF; display:block; position:relative;}
footer .policy_box li + li a:before{content:''; display:block; position:absolute; top:15%; left:0; width:1px; height:70%; background:#9E9E9E}

/*popup*/
html.pop_open_scroll, html.pop_open_scroll body{overflow:hidden;}

.popup_wrap{display:none; position:fixed; top:0; bottom:0; left:0; right:0; background:rgba(0,0,0,0.8); z-index:1001;}
.popup_box{overflow:auto; position:absolute; background:#FFF; width:100%; height:100%;}
.popup_box h2{position:absolute; top:0; background:#2D3063; height:4rem; padding:1rem 5.5%; color:#FFF; width:100%; margin:0; font-size:1.3rem; text-align:left;}
.popup_box > div{height:100%; overflow:auto; padding:4.5rem 5.5% 1.4rem}

.popup_box .btn_close{position:absolute; right:0; width:3.4rem; height:4rem; font-size:0; background:no-repeat center url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17.602' height='17.545'%3E%3Cpath d='M16.091 16.781 8.802 9.492l-7.29 7.289c-.273.273-.65.341-.842.148a.627.627 0 0 1 .149-.842l7.289-7.289L.819 1.509C.545 1.235.478.858.671.666s.569-.123.841.149l7.29 7.289L16.091.815a.626.626 0 0 1 .842-.149c.192.193.125.569-.148.843l-7.29 7.289 7.29 7.289c.274.275.34.651.148.842a.4.4 0 0 1-.288.11.819.819 0 0 1-.554-.258Z' fill='%23fff' stroke='rgba(0,0,0,0)' stroke-miterlimit='10'/%3E%3C/svg%3E");}

/*이용약관, 개인정보*/
#pop_policy, #pop_private{word-break:keep-all;}
#pop_policy h3, #pop_private h3{margin:1.5em 0 1em; color:#2d3063;}
#pop_policy h4, #pop_private h4{margin:0.5em 0; color:#000;}
#pop_policy h5, #pop_private h5{margin:0.5em 0; font-size: 0.95em;}

#pop_policy ol,
#pop_private ol,
#pop_policy ul,
#pop_private ul,
#pop_policy ul + p,
#pop_private ul + p,
#pop_policy ol + p,
#pop_private ol + p{
margin-top:0.5rem;
}

#pop_policy dl, #pop_private dl{margin:0.5rem 0 0.5rem 10px;}
#pop_policy dd, #pop_private dd, #pop_policy dt, #pop_private dt{display:inline-block;}

#pop_policy ol li + li,
#pop_private ol li + li,
#pop_policy ul li + li,
#pop_private ul li + li{margin-top:0.5rem;}

/*가로모드*/
@media screen and (orientation: landscape){

}

/*iphone X - 세로*/
@media only screen and (min-device-width: 375px) and (min-device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait) {

}

/*iphone X - 가로*/
@media only screen and (orientation: landscape) and (min-width:812px) and (-webkit-max-device-pixel-ratio: 3.0) {

}

/*DPR 3.5 - 세로*/
@media only screen and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 3.5) {

}

/*DPR 3.5 - 가로*/
@media only screen and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 3.5) {

}

/*Tablet*/
@media only screen and (orientation: portrait) and  (min-height:1024px){

}

/*높이 320px 이하*/
@media only screen and (orientation: portrait) and  (max-height:321px){

}

/*넓이 360px 이하*/
@media only screen and (max-width:360px){
html{font-size:14px;}
}

/*넓이 320px 이하*/
@media only screen and (max-width:320px){
html{font-size:13px;}
}

/*640px 이상*/
@media only screen and (min-width:640px) {
html{width:640px; margin:0 auto; box-shadow:0 -1px 3px 0px rgb(0 0 0 / 20%);}
nav.active{width:640px; left:50%; margin-left:-320px; }

.popup_wrap{width:640px; left:50%; margin-left:-320px;}
}

/*1200px 이상*/
@media only screen and (min-width:1200px) {

}