@charset "utf-8";
/*@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);*/
@import url(//fonts.googleapis.com/css?family=Montserrat:thin,extra-light,light,100,200,300,400,500,600,700,800);
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');

@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 300;
   src: url('../../assets/fonts/NotoSansKR-Light.woff2') format('woff2'),
        url('../../assets/fonts/NotoSansKR-Light.woff') format('woff'),
		url('../../assets/fonts/NotoSansKR-Light.eot?#iefix') format('embedded-opentype'),
        url('../../assets/fonts/NotoSansKR-Light.otf') format('opentype');
 }

@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 400;
   src: url('../../assets/fonts/NotoSansKR-Regular.woff2') format('woff2'),
        url('../../assets/fonts/NotoSansKR-Regular.woff') format('woff'),
		url('../../assets/fonts/NotoSansKR-Regular.eot?#iefix') format('embedded-opentype'),
        url('../../assets/fonts/NotoSansKR-Regular.otf') format('opentype');
 }
 @font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 500;
   src: url('../../assets/fonts/NotoSansKR-Medium.woff2') format('woff2'),
        url('../../assets/fonts/NotoSansKR-Medium.woff') format('woff'),
		url('../../assets/fonts/NotoSansKR-Medium.eot?#iefix') format('embedded-opentype'),
        url('../../assets/fonts/NotoSansKR-Medium.otf') format('opentype');
 }
 @font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 700;
   src: url('../../assets/fonts/NotoSansKR-Bold.woff2') format('woff2'),
        url('../../assets/fonts/NotoSansKR-Bold.woff') format('woff'),
		url('../../assets/fonts/NotoSansKR-Bold.eot?#iefix') format('embedded-opentype'),
        url('../../assets/fonts/NotoSansKR-Bold.otf') format('opentype');
 }
 @font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 900;
   src: url('../../assets/fonts/NotoSansKR-Black.woff2') format('woff2'),
        url('../../assets/fonts/NotoSansKR-Black.woff') format('woff'),
		url('../../assets/fonts/NotoSansKR-Black.eot?#iefix') format('embedded-opentype'),
        url('../../assets/fonts/NotoSansKR-Black.otf') format('opentype');
 }


@font-face {
    font-family: 'GmarketSans';
    font-weight: 300;
    font-style: normal;
    src: url('../../assets/fonts/GmarketSansLight.eot');
    src: url('../../assets/fonts/GmarketSansLight.eot?#iefix') format('embedded-opentype'),
         url('../../assets/fonts/GmarketSansLight.woff2') format('woff2'),
         url('../../assets/fonts/GmarketSansLight.woff') format('woff'),
         url('../../assets/fonts/GmarketSansLight.ttf') format("truetype");
    font-display: swap;
} 

@font-face {
    font-family: 'GmarketSans';
    font-weight: 500;
    font-style: normal;
    src: url('../../assets/fonts/GmarketSansMedium.eot');
    src: url('../../assets/fonts/GmarketSansMedium.eot?#iefix') format('embedded-opentype'),
         url('../../assets/fonts/GmarketSansMedium.woff2') format('woff2'),
         url('../../assets/fonts/GmarketSansMedium.woff') format('woff'),
         url('../../assets/fonts/GmarketSansMedium.ttf') format("truetype");
    font-display: swap;
} 

@font-face {
    font-family: 'GmarketSans';
    font-weight: 700;
    font-style: normal;
    src: url('../../assets/fonts/GmarketSansBold.eot');
    src: url('../../assets/fonts/GmarketSansBold.eot?#iefix') format('embedded-opentype'),
         url('../../assets/fonts/GmarketSansBold.woff2') format('woff2'),
         url('../../assets/fonts/GmarketSansBold.woff') format('woff'),
         url('../../assets/fonts/GmarketSansBold.ttf') format("truetype");
    font-display: swap;
}


html, body {width:100%; font-weight:400; font-family:'Roboto','맑은 고딕', 'Malgun Gothic', sans-serif; color:#666;}

/* common */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { 
	margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
article,aside,details,figcaption,figure, footer,header,hgroup,menu,nav,section {display:block;}
nav ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after, q:before, q:after {content:''; content:none;}
ins {background-color:#ff9; color:#000; text-decoration:none;}
mark {background-color:#ff9; color:#000; font-style:italic; font-weight:bold;}
del {text-decoration: line-through;}
i {font-style:normal;} 
abbr[title], dfn[title] {border-bottom:1px dotted; cursor:help;}
hr {display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0;}
table {border-collapse:collapse; border-spacing:0;}
li{list-style:none;}
legend  {position:absolute; top:0; left:0; width:0; height:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0;}
img {border:0 none;}
body,th,td,input,select,textarea,button,
a {font-weight:400; font-family:'Roboto','맑은 고딕', 'Malgun Gothic', sans-serif; text-decoration:none;  transition:0.3s;}


/* form reset */
input, select, textarea, button {border-radius:0; box-shadow:none;  }
button, input[type="submit"] {cursor: pointer; border:0 none;}
input:focus, button:focus, select:focus, textarea:focus {outline:0;}
button::-moz-focus-inner {border:0 none; padding:0;}
label {cursor:pointer;}

input, textarea, button {/*appearance: none; -moz-appearance: none; -webkit-appearance: none; */ border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; }
input[type=checkbox] {vertical-align: middle; cursor: pointer; width: 17px; height: 17px;}
input[type=radio] {vertical-align: middle; cursor: pointer; width: 17px; height: 17px;}




/* layout */
body {background:#e9f0f9; }
#wrap {overflow:hidden; min-width:100%; width:100%; padding: 30px; margin: 0 auto; text-align: center; box-sizing: border-box;}
#wrap a {-khtml-transition:all 0.3s; -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s; -webkit-transition:all 0.3s; transition:0.3s;} 
#header {height:75px; width:129px; display:inline-block; background:url('../images/h1_logo.png') left center no-repeat; background-size: 129px;}
#header a {display: inline-block; width: 129px; height: 75px;}
#footer {position:relative; z-index:1000; font-size:14px; color:#666666; max-width:960px; margin:0 auto; }
#contents {clear:both; width:100%; padding: 35px 0 0px; position: relative;}
.inner {margin:0 auto; width:1080px;}
.mt90 {margin-top:90px; }
.hidden {position:absolute; left:-9999px; top:-9999px; width:0; height:0; font-size:0; line-height:0;}

.txtL {text-align:left;}
.txtR {text-align:right;}
.txtC {text-align:center;}
.VT {vertical-align: top;}
.VTT {vertical-align: text-top;}
.VM {vertical-align: middle  !important;}
.OH {overflow:hidden;}
.fl {float:left;}
.fr {float:right;}

.dn {display:none;}
.dn_imp {display:none !important;}
.d_inline_b {display:inline-block;}
.d_b {display:block;}
.PAB {position:absolute;}
.PRE {position:relative;}
.clear {display:block; clear:both; overflow: hidden;}

.w100_imp {width:100% !important;}
.hauto_imp {height:auto !important;}

.Cbu {color:#3683fa !important;}
.Cbu2 {color:#2c4592 !important;}
.Cbu3 {color:#4465b7 !important;}
.Cre {color:#fc5539;}
.Gray {color:#808080;}
.Gray6 {color:#666666;}
.Wh {color:#fff;}
.Gre {color:#269109;}
.Gree {color:#1d9a00;}
.Pur {color:#79149E;}
.Yell {color:#ffcd15;}
.Blk {color:#000 !important}

.f08 {font-size:0.8em;}
.f09 {font-size:0.9em;}
.f10 {font-size:1em;}
.f11 {font-size:1.1em;}
.f12 {font-size:1.2em;}
.f13 {font-size:1.3em;}
.f14 {font-size:1.4em;}
.f14px {font-size:14px;}
.f16px {font-size:16px;}
.f18px {font-size:18px;}

.LH1 {line-height:1;}
.LH15 {line-height:1.5;}
.LH2 {line-height:2;}
.sp1 {letter-spacing:-1px;}
.sp05 {letter-spacing:-0.5px;}

.txt_under{text-decoration:underline;}

.fwN {font-weight:normal !important;}
.fwB {font-weight:bold;}

.f-noto {font-family: 'Noto Sans KR';}

.wordB {word-break:break-all;}
.wordK {word-break: keep-all;}

.bd1 {border:solid 2px #d7d7d7}
.BKbg1 {background:#f5f5f5;}

/*마진값*/
.mt5 {margin-top:5px; }
.mt10 {margin-top:10px;}
.mt12 {margin-top:12px;}
.mt15 {margin-top:15px;}
.mt17 {margin-top:17px;}
.mt20 {margin-top:20px;}
.mt25 {margin-top:25px;}
.mt30 {margin-top:30px;}
.mt35 {margin-top:35px;}
.mt40 {margin-top:40px;}
.mt45 {margin-top:45px;}
.mt50 {margin-top:50px;}
.mt55 {margin-top:55px;}
.mt60 {margin-top:60px;}
.mt65 {margin-top:65px;}
.mt70 {margin-top:70px;}
.mt75 {margin-top:75px;}
.mt80 {margin-top:80px;}
.mt100 {margin-top:100px;}


.mb5 {margin-bottom:5px !important;}
.mb10 {margin-bottom:10px !important;}
.mb15 {margin-bottom:15px;}
.mb20 {margin-bottom:20px;}
.mb25 {margin-bottom:25px;}
.mb30 {margin-bottom:30px;}
.mb35 {margin-bottom:35px;}
.mb40 {margin-bottom:40px;}

.mr3 {margin-right:3px;}
.mr5 {margin-right:5px;}
.mr10 {margin-right:10px;}
.mr15 {margin-right:15px;}
.mr20 {margin-right:20px;}
.mr25 {margin-right:25px;}
.mr30 {margin-right:30px;}
.mr35 {margin-right:35px;}
.mr40 {margin-right:40px;}

.mr2p {margin-right:2%;}
.ml3 {margin-left:3px;}
.ml5 {margin-left:5px;}
.ml10 {margin-left:10px;}
.ml15 {margin-left:15px;}
.ml20 {margin-left:20px;}
.ml25 {margin-left:25px;}
.ml30 {margin-left:30px;}
.ml35 {margin-left:35px;}
.ml40 {margin-left:40px;}

/*패딩값*/
.pt3 {padding-top:3px;}
.pt5 {padding-top:5px;}
.pt6 {padding-top:6px;}
.pt10 {padding-top:10px;}
.pt14 {padding-top:14px;}
.pt15 {padding-top:15px;}
.pt20 {padding-top:20px;}
.pt25 {padding-top:25px;}
.pt30 {padding-top:30px;}
.pt35 {padding-top:35px;}
.pt40 {padding-top:40px;}
.pt45 {padding-top:45px;}
.pt50 {padding-top:50px;}
.pt55 {padding-top:55px;}
.pt60 {padding-top:60px;}
.pt65 {padding-top:65px;}
.pt70 {padding-top:70px;}
.pt75 {padding-top:75px;}
.pt80 {padding-top:80px;}

.pb5 {padding-bottom:5px;}
.pb10 {padding-bottom:10px;}
.pb14 {padding-bottom:14px;}
.pb15 {padding-bottom:15px;}
.pb20 {padding-bottom:20px;}
.pb25 {padding-bottom:25px;}
.pb30 {padding-bottom:30px;}
.pb35 {padding-bottom:35px;}
.pb40 {padding-bottom:40px;}
.pb45 {padding-bottom:45px;}
.pb50 {padding-bottom:50px;}
.pb55 {padding-bottom:55px;}
.pb60 {padding-bottom:60px;}
.pb65 {padding-bottom:65px;}
.pb70 {padding-bottom:70px;}
.pb75 {padding-bottom:75px;}
.pb80 {padding-bottom:80px;}
.pb100 {padding-bottom:100px;}
.pb120 {padding-bottom:120px;}
.pb140 {padding-bottom:140px;}

.pl5 {padding-left:5px;}
.pl10 {padding-left:10px;}
.pl15 {padding-left:15px;}
.pl20 {padding-left:20px;}
.pl23 {padding-left:23px;}
.pl25 {padding-left:25px;}
.pl27 {padding-left:27px;}
.pl30 {padding-left:30px;}
.pl35 {padding-left:35px;}
.pl40 {padding-left:40px;}
.pl50 {padding-left:50px;}

.pr10 {padding-right:10px;}
.pr15 {padding-right:15px;}
.pr20 {padding-right:20px;}
.pr30 {padding-right:30px;}
.pr50 {padding-right:50px;}


/*리스트 스타일*/
.listSY {text-align:left;}
.listSY:after {display:block; clear:both; content:"";}
.listSY li {position: relative; display: inline-block;}

.tableSY {display:table;}
.tableSY li {display:table-cell;}

.tableSY2 {display:block;}
.tableSY2 dt,
.tableSY2 dd,
.tableSY2 li {display:block; }

.tableSY3 {display:table;}
.tableSY3 dt,
.tableSY3 dd {display:table-cell;}


/*블릿 스타일*/
.bullet li{position: relative; padding-left: 10px;}
.bullet li:before {display: block; clear: both; content: ""; width: 3px; height: 3px; background: #666; position: absolute; top: 7px; left: 0; }
.bullet-1 {position: relative; padding-left: 10px;  display: inline-block;  vertical-align: top;}
.bullet-1:before {display: block; clear: both; content: ""; width: 4px; height: 4px; background: #186dcb ; position: absolute; top: 7px; left: 0; }


/*버튼 스타일*/
.btn {display:inline-block; vertical-align: top; box-sizing:border-box;}
.btn_100 {width:100%;}
.btn_69 {width:69%;}
.btn_59 {width:59%;}
.btn_49 {width:49%;}
.btn_50 {width:50%;}
.btn_40 {width:40%;}
.btn_32 {width:32%;}
.btn_30 {width:30%;}



.btnSY1 {background: #a7a7a7; border-radius: 3px; color: #fff; font-size: 0.9em; padding: 4px 15px;}
.btnSY1:hover {background:#646464;}
.btnSY1.black {background: #3e3e3e; border-radius: 3px; color: #fff; font-size: 0.9em; padding: 5px 15px 7px; text-align: center;}
.btnSY1.black:hover {background:#646464;}
.btnSY1.gray {background:#666666; }
.btnSY2 {background: #ffc81b; border-radius: 3px; color: #111; font-family: 'roboto', 'Noto Sans KR'; font-size: 1.3em; padding: 17px 15px; text-align: center; font-weight: bold; letter-spacing: -1px;}
.btnSY2.gray {background: #d8d8d8;}
.btnSY2.black {/*background: #3f3f3f;*/  background: #c1c1c1; color: #fff;}
.btnSY2.small {font-size:1.2em;}
.btnSY2.small2 {font-size:1.2em; padding: 15px;}
.btnSY2.small3 {font-size:1.2em; padding: 15px;}

.btnSY2:hover {background: #d11901; color:#fff;}
.btnSY2.gray:hover {background: #7e7e7e; color:#fff;}
.btnSY3 {background: #dde7f5; color: #4d565d; /*background:#36a3fa; color: #fff; */  display: inline-block; padding: 17px 0; font-family: 'Noto Sans KR'; font-size: 0.9em; letter-spacing: 0px; font-weight: bold; width: 100%; box-sizing: border-box; text-align: center;}
.btnSY3:hover {background: #347adc; color: #fff; }
.btnSY4 {background: #2c4592;  display: inline-block; padding: 17px 0; font-family: 'Noto Sans KR'; font-size: 0.9em; color: #fff; font-weight: bold; width: 100%; box-sizing: border-box; text-align: center;}
.btnSY4.V1{padding: 10px 15px 13px; font-size: 0.9em;}
.btnSY4.V2{padding: 6px 15px 8px; font-size: 0.9em;}
.btnSY4:hover {background: #182758; } 
.btnSY5 {background: #f0f3ff; border: solid 1px #2c4592; padding: 19px 0; font-family: 'Noto Sans KR'; font-size: 0.9em; color: #2c4592; font-weight: bold; width: 100%; box-sizing: border-box; text-align: center;}
.btnSY5.small {padding:10px 0;}
.btnSY5.small2 {padding:16px 0;}
.btnSY6 {background: #3e3e3e; color: #fff; border: solid 1px #3e3e3e; border-radius: 0; font-size: 0.9em; padding: 5px 0 7px; text-align: center; box-sizing: border-box; font-weight: bold;}
.btnSY6:hover {background: #fff; color: #222; border: solid 1px #7e7e7e; }
.btnSY7 {background: #fff;  display: inline-block; padding: 6px 15px 8px; font-family: 'Noto Sans KR'; font-size: 0.8em; color: #2c4592;  border:solid 1px #919ec7; font-weight: bold; width: 100%; box-sizing: border-box; text-align: center;}
.btnSY7:hover {background: #2c4592; border:solid 1px #2c4592; color: #fff}
.btnSY7.yel:hover {background: #ffc81b; border:solid 1px #2c4592; color: #111}
.btnSY7.small {background: #fff;  display: inline-block; padding: 4px 10px 4px; font-family: 'Noto Sans KR'; font-size: 0.8em; color: #2c4592;  border:solid 1px #919ec7; font-weight: bold; width: auto; box-sizing: border-box; text-align: center;}

.b-arrow { position: relative; text-align:center; }
.b-arrow::after { position: absolute;  right: 50%; top: 25px; opacity:0; content: ''; width: 13px; height: 13px; border-top: 3px solid #fff; border-right: 3px solid #fff; transform: rotate(45deg); transition:0.5s}
.b-arrow:hover {text-align:center; padding-right:10%; transition:0.5s; }
.b-arrow:hover::after { position: absolute;  right: 40%; top: 25px; opacity:1; content: ''; width: 13px; height: 13px; border-top: 3px solid #fff; border-right: 3px solid #fff; transform: rotate(45deg); transition:0.5s}

.b-arrow.r2::after { position: absolute;  right: 45%; top: 25px; opacity:0; content: ''; width: 13px; height: 13px; border-top: 3px solid #fff; border-right: 3px solid #fff; transform: rotate(45deg); transition:0.5s}
.b-arrow.r2:hover {text-align:center; padding-right:10%; transition:0.5s; }
.b-arrow.r2:hover::after { position: absolute;  right: 35%; top: 25px; opacity:1; content: ''; width: 13px; height: 13px; border-top: 3px solid #fff; border-right: 3px solid #fff; transform: rotate(45deg); transition:0.5s}


/* 스크립트 스타일*/
.info-box {background: #e7f1f9; padding: 15px 20px; word-break: keep-all; box-sizing: border-box;}
.info-box.gray {background: #f4f4f5; border: solid 1px #dddddd;}
.info-box h4 {font-size: 0.9em; font-weight: bold; margin-bottom: 10px; color: #186dcb !important;}
.info-box p {font-size: 0.9em; word-break: keep-all; line-height: 1.6; letter-spacing: -0.5px;}
.info-box.WH { background: #fff; padding: 10px 0;}
.info-box.WH h3 {font-size: 1.1em; color:#222; letter-spacing:-1px; line-height:1.3; margin-bottom: 10px;}
.info-box.WH h3 strong {color:#f04219;}


.script-box {}
.script-box li {position: relative; padding-left: 10px; padding-bottom: 5px; font-size: 12px; word-break: keep-all;}
.script-box li:last-child {padding-bottom: 0;}
.script-box li:after {display: block; clear: both; content: ""; width: 4px; height: 4px; background: #6e6e6e; position: absolute; top: 7px; left: 0; font-size: 13px; font-weight: 400; color: #6e6e6e;}
.script-box li a {color:#666; text-decoration:underline;}





/* contents
--------------------------------------------------------------------------------------------------------- */
.contents-box {width:620px; background:#fff; box-shadow: 35px 50px 80px 10px #d9dfe8; padding: 50px 60px; margin: 0 auto; text-align: left; box-sizing: border-box;}
.contents-box.myPage {width:960px; /*min-height: 718px;*/ min-height: 780px;  background:#fff; box-shadow: 35px 50px 80px 10px #d9dfe8; padding: 0 60px 50px 0; margin: 0 auto; text-align: left; box-sizing: border-box; overflow: hidden; position: relative;}
.contents-box.myPage > .left-area {width:32%; background:#f9f9f9; display: inline-block; vertical-align: top; margin-right: 8%; box-sizing: border-box; position: absolute; top: 0; bottom: 0;}
.contents-box.myPage > .join-area {width:59%; display: block; /*padding-top: 50px;*/ box-sizing: border-box; float: right;}



.join-area {width:100%;}
.join-area ul.tab{width:100%; height:60px; margin: 0 auto; padding:0; box-sizing:border-box;}
.join-area ul.tab li{display: inline-block; padding: 3% 5%;	cursor: pointer; display:inline-block; width:50%; height:auto; background:#edf0f4; border:solid 1px #dbe1ea; border-bottom: solid 1px #36a3fa; float:left; line-height:1.5; text-decoration:none; font-family: 'Noto Sans KR'; font-size:1.1em; color: #4a5762; font-weight:bold; text-align:center; box-sizing:border-box; }
.join-area.find ul.tab li {width:50%; }
.join-area ul.tab li.current{color: #36a3fa; background:#fff; border-top:solid 2px #36a3fa; border-left:solid 1px #36a3fa; border-right:solid 1px #36a3fa; border-bottom:none;}
.join-area ul.tab li.current a{color: #36a3fa; }
.join-area ul.tab li:hover {background: #36a3fa; border-top: solid 1px #36a3fa; border-left: solid 1px #36a3fa; border-right: solid 1px #36a3fa; border-bottom:0; color: #fff; -khtml-transition:all 0.3s; -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s; -webkit-transition:all 0.3s; transition:0.3s;}
.join-area ul.tab li:hover.current{border-top: solid 2px #36a3fa;}
.join-area ul.tab li:hover a { color: #fff; }
.join-area .tabcontent{display: none; padding:0;}
.join-area .tabcontent.current {display: block;}
.join-area ul.tab li a {display:block; color: #4a5762; font-weight: bold; font-family: 'Noto Sans KR'; text-align: center; box-sizing: border-box;}
.join-area ul.tab li a:hover {color: #fff; -khtml-transition:all 0.3s; -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s; -webkit-transition:all 0.3s; transition:0.3s;}

.join-area .basic {padding:15px 0 0;}
.join-area .basic.pt0 {padding:0;}
.join-area .basic h2 {font-size: 1.3em; color: #36a3fa; letter-spacing: -1px; font-family: 'roboto', 'Noto Sans KR'; word-break: keep-all;}
.join-area .basic h3 {color:#222; line-height: 1.5; word-break: keep-all; font-family: 'roboto', 'Noto Sans KR'; word-break: keep-all;}
.join-area .basic h4 {font-size:14px; line-height: 1.6; font-weight:normal; color:#333; word-break: keep-all;}
.join-area .basic h5 {font-size:13px; line-height: 1.6; font-weight:normal; word-break: keep-all;}

.join-area .basic ul.join-box li {margin-bottom: 25px;}
.join-area .basic ul.join-box.find li {margin-bottom: 10px;}
.join-area .basic label.short {display:inline-block; width:73.5%; vertical-align:middle; }
.join-area .basic label.short2 {display:inline-block; width:58%; vertical-align:middle; }
.join-area .basic .mail-autocomplete {width:73.5%; position: relative; display: inline-block;}
.join-area.find .basic .mail-autocomplete {width:100%;}
.join-area.find .basic .mail-autocomplete.V2 {width:73.5%;}
.join-area .basic .mail-autocomplete label.short {width:100%;}
.join-area .basic .btn-area {display:inline-block; width:25%; vertical-align:top; padding-top:6px;}
.join-area .basic .btn-area2 {display:inline-block; width:20%; vertical-align:top; padding-top:6px;}
.join-area .basic .btn-chk {background:#dde7f5; display: inline-block; padding: 19px 0; font-size: 0.8em; color: #4d565d; font-weight: bold; width: 100%; box-sizing: border-box; text-align: center;}
.join-area .basic .certi-box input {width: 58%; vertical-align: middle;}
.join-area .basic .certi-box .btn {width: 20%;vertical-align: middle;}

.join-area .basic .script {font-size:0.8em; color:#555555; margin-top: 5px; letter-spacing: -0.5px; line-height: 1.5; word-break: keep-all;}
.join-area .basic .script.big {font-size:0.9em; color:#555555; margin-top: 5px; letter-spacing: -0.5px; word-break: keep-all;}
.join-area .basic .script.Cre {color:#fc5539;}

.join-area .basic .script-box li {position: relative; padding-left: 10px; padding-bottom: 5px; font-size: 0.85em; color: #333; word-break: keep-all;}
.join-area .basic .script-box li:last-child {padding-bottom:0;}
.join-area .basic .script-box li:after {display: block; clear: both; content: ""; width: 4px; height: 4px; background: #999999; position: absolute; top: 7px; left: 0; font-size: 13px; font-weight: 400; color: #999999;}
.join-area .basic .script-box li a {color:#333; text-decoration:none; border-bottom:solid 1px #7c7c7c;}

.join-area .basic .label-area {overflow: hidden; padding-top: 5px}
.join-area .basic .label-area .ico_ro input[type="checkbox"] + label {padding-left:0;}
.join-area .basic .label-area span.chk_txt {font-size: 0.9em; line-height:1.5; width: 94%; float: right; word-break: keep-all;}

.mail-autocomplete { position: relative;  display: inline-block;}
/*.mail-autocomplete input {width:490px;}*/
.autocomplete-items { /*position: absolute;*/  border: 1px solid #ced6e1; border-bottom: none;  border-top: none;  z-index: 99;  top: 55px;  left: 0;  right: 0;}
.autocomplete-items div { padding: 10px 10px 10px 25px;  font-size:12px; font-weight: bold; letter-spacing: -0.5; cursor: pointer;  color: #2065d1; background-color: #EDF1FB; border-bottom: 1px solid #BAC7E3 }
.autocomplete-items div:last-child {border-bottom: 1px solid #ced6e1;}
.autocomplete-items div:hover { background-color: #fff; }
.autocomplete-items div strong {color: #102E56;}
.autocomplete-active { background-color: #347adc !important; color: #ffffff !important;  }

.option_box .tableSY2 dt, .tableSY2 dd {display:block;}
.option_box .tableSY2 dt span { font-size: 16px; color:#444; font-weight:bold; line-height: 1.5; font-family: 'Noto Sans KR';}
.option_box .tableSY2 dt span.Cbu2 {color: #2c4592;}
.option_box .tableSY2 dt span.f09 {font-size:0.9em;}
.option_box .tableSY2 dt span.f12 {font-size:1.2em; letter-spacing:-1px;}
.option_box .tableSY2 dt span strong {color: red; font-weight: bold; line-height: 2.5; padding-left: 3px; font-size: 1.2em;}

.option_box .listSY li {width:45%; font-size:12px; float: left;}
.option_box .listSY li label {cursor:pointer;}

.option_box .tableSY2 li {font-size:14px; line-height: 1.5; margin-bottom: 10px; word-break: keep-all;}

.option_box dl.tableSY3 {width:100%;} 
.option_box dl.tableSY3 dt {width:30%; color: #333;}
.option_box dl.tableSY3 dd {width:70%;color: #222222; text-align: left; font-weight: bold;}
.option_box dl.tableSY3 dd span {font-weight:normal;}

#private_valid {display:block; position:relative; /* width:620px; */ padding: 40px 0; margin-bottom:30px; margin: 0 auto; text-align:left;}
#private_valid li:first-child {padding: 5px 0; border-bottom: solid 1px #acb7cb;  border-top: solid 1px #acb7cb; margin-bottom: 10px; background: #d4dde6;}
#private_valid p { /*display:block;*/ padding:7px 10px 7px 10px; font-size: 14px; color: #222; font-weight: bold; letter-spacing: -1px;} 
#private_valid input {vertical-align:middle;} 
#private_valid label{/*color:#2C4592; */cursor:pointer; }
#private_valid p.pri_che {background:#e4ecf9;color:#2C4592; letter-spacing:-1px;}
#private_valid p.pri_che label {display:inline-block; width:80px; padding:5px 10px 5px 5px;/color:#2C4592; cursor:pointer; background:#e4ecf9;}
/*#private_valid  p span{display:inline-block;padding-bottom:4px; color:#4072e4;}*/
#agr_message {display:block; position:absolute; right:10px; bottom:-7px; z-index:100; width:275px; height:30px; line-height:120%; letter-spacing:-1px; padding:7px 0 0 13px; color:#e54404; background: url('/img/find_pw_bg.gif') no-repeat; filter:alpha(opacity=100);}
.btn_alg {text-align:center;}
/* #private_valid  div {margin-bottom:5px; display:block; padding:7px 10px 7px 5px; background:#e4ecf9; } */

#private_valid p input[type="checkbox"] {border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}
#private_valid p input[type="checkbox"]:active + label:before {-webkit-transition-duration: 0; transition-duration: 0; -webkit-filter: brightness(0.2); filter: brightness(0.2);}
#private_valid p input[type="checkbox"] + label {position: relative; padding:0 10px; padding-left: 2em; vertical-align: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}

#private_valid .btn-area {float:right;}

#private_valid.social-box {width:100%; padding: 40px 0 0;}
#private_valid.social-box iframe {padding: 0 0 10px 0; border: solid 1px #ccc; box-sizing: border-box; height: 185px;}
#private_valid.social-box iframe .iframe-box {padding:0px 15px 15px 15px; bgcolor:#FFFFFF; white-space : pre-wrap; box-sizing: border-box; }
#private_valid.social-box .chk-area {padding: 5px 0; font-size: 14px; font-weight: bold;}

#private_valid.social-box .soc_reg_area {border: solid 1px #ccc; padding: 20px 5px 20px 30px; box-sizing: border-box;}
#private_valid.social-box .soc_reg_area > .popup-pri-area {height:200px; box-sizing: border-box;}
#private_valid.social-box .soc_reg_area h2 {color:#222;}

#private_valid .login-txt-area2 {display:block; font-size: 12px; color: #999; padding-top: 10px;}

#private_valid .login-txt-area {display:inline-block; font-size: 14px; color: #666; padding-top: 40px;}
#private_valid .login-txt-area a {border-bottom:solid 1px #1f6cca; color: #1f6cca;}
#private_valid .login-txt-area a:hover {color:#084897;}

#private_valid .cs-tel-area {float:right; font-size: 14px; color: #666; padding-top: 40px;}
#private_valid .cs-tel-area strong {color: #333; font-weight: bold; font-size: 16px;}

.bt-contents {padding-top:30px;}
.bt-contents > dl.tableSY3 {width: 100%;}
.bt-contents > dl.tableSY3 dt {width:75%; vertical-align: middle; padding-right: 10px;}
.bt-contents > dl.tableSY3 dd {width:25%;}
.bt-contents p {width:65%;}
.bt-contents .script {font-size:14px; color: #222; letter-spacing: 0px; word-break: keep-all;}
.bt-contents .btn-areavjqmf {width: 30%;}
.bt-contents .script.bul {display: inline-block;}

.join-area .basic .comfrim {text-align:center;}
.join-area .basic .comfrim h3 {font-size:1.3em; color:#36a3fa; letter-spacing: -2px; line-height: 1.3; word-break: keep-all;}
.join-area .basic .comfrim h4 {font-weight: normal; letter-spacing: -1px; font-size: 0.9em; word-break: keep-all;}
.join-area .basic .comfrim .ico-join {width:90px; height:81px; background: url('../../assets/images/ico_joins.png') no-repeat; margin:0 auto; }
.comfrim .tableSY3 {width:100%; text-align: left; }
.comfrim .tableSY3 dt {background: #f4f8ff; border: solid 1px #c0cde3; border-top:none; font-family: 'roboto', 'Noto Sans KR'; color: #1e3a91; font-size: 15px; font-weight: bold; width: 32%; padding: 12px 0 15px 12px; box-sizing: border-box;}
.comfrim .tableSY3:first-child dt {border-top: solid 1px #c0cde3; }
.comfrim.PW .tableSY3 dt {padding: 15px 0 15px 15px; }
.comfrim .tableSY3 dd {border: solid 1px #c0cde3; border-top:none; border-left: none; font-family: 'roboto', 'Noto Sans KR'; color: #333; font-size: 15px; line-height: 1.5; padding: 12px 0 15px 12px; width: 78%; letter-spacing: 0; box-sizing: border-box;}
.comfrim .tableSY3:first-child dd {border-top: solid 1px #c0cde3; }
.comfrim.PW .tableSY3 dd {padding: 15px 0 15px 15px; }


.ID_box {background:#f0f0f0; padding:25px; box-sizing: border-box;}
.ID_box.PW2 {background:#f0f0f0; padding:15px; margin-bottom: 10px; box-sizing: border-box;}

.ID_box dl.tableSY3 {width:100%; font-size: 0.9em; padding-bottom: 10px;}
.ID_box dl:last-child.tableSY3 {padding-bottom:0;}
.ID_box dl.tableSY3 dt {width:62%; color: #333; vertical-align: middle;}
.ID_box dl.tableSY3 dt strong {width: 20%; display: inline-block;}
.ID_box dl.tableSY3 dt span { letter-spacing:-0.5px;}
.ID_box dl.tableSY3 dd {width:38%; text-align: right;}
.ID_box.PW dl.tableSY3 dt {width:64%; color: #333; vertical-align:middle; font-family:'roboto',  'Noto Sans KR'; font-size: 15px;}
.ID_box.PW dl.tableSY3 dd {width:36%; text-align: right; font-size: 1em;}
.ID_box.PW dl.tableSY3 dd .btnSY6 {font-size:0.8em; letter-spacing: -1px;}
.ID_box.PW2 dl.tableSY3 dt {width:30%; color: #333;}
.ID_box.PW2 dl.tableSY3 dd {width:70%;color: #222222; text-align: left; font-weight: bold;}
.ID_box.PW2 dl.tableSY3 dd span {font-weight: normal;}
.ID_box label [name="certi_number"] {background:#fff; border-color: #ced6e1; border-top-color: transparent;}
.ID_box label span {color: #222; font-weight: bold;}

.PW_box p {padding: 15px 0 17px; border-top: dotted 1px #347adc; border-bottom: dotted 1px #347adc;}
.PW_box p label {color: #222; line-height: 1;}
.PW_box > .ID_box { background: #f0f4fb;}

.PW_box dl.tableSY3 {width:100%; font-size: 1em; padding-bottom: 10px;}
.PW_box dl.tableSY3 dt {width:25%; color: #333;}
.PW_box dl.tableSY3 dt span { letter-spacing:-0.5px; color:#555; font-weight:bold;}
.PW_box dl.tableSY3 dd {width:75%; font-weight:bold; color:#222; font-size: 1em; font-family: 'roboto', 'Noto Sans KR';}
.PW_box dl.tableSY3 dd .op-certi {font-weight: normal; font-size: 0.9em; vertical-align: middle; color: #666;}
.PW_box dl.tableSY3 dd.fwN {font-weight:normal;}



.PW_box input.invalid-pw {
    border: solid 2px;
    border-color: #fc5539;
}

.page-tit {padding-top: 20px;}
.page-tit.pt0 {padding-top: 0;}

.page-tit h2 {font-size: 1.4em; color: #222; letter-spacing: -1.5px; line-height: 1; border-bottom: solid 3px #333; padding-bottom: 10px; font-family: 'roboto', 'Noto Sans KR'; }
.page-tit h2 .script {display:block; font-size: 13px; font-weight: normal; color: #666; letter-spacing: -0.5px;}
.page-tit h3 {font-size: 1.2em; color: #222; letter-spacing: -1px; line-height: 1; border-bottom: solid 1px #333; padding-bottom: 15px; font-family: 'Noto Sans KR'; }

.certi-time {position: absolute;  top: 24px;  right: 5%;  font-size: 0.9em; color: #000cff;}
.certi-time.find-pw {top:12px;}



/*마이페이지*/
.left-area .my-box {background: #1f4d92; padding: 30px 35px;}
.left-area .my-box .user dl.tableSY3 {width:100%; font-size: 1em; padding-bottom: 10px;}
.left-area .my-box .user dl.tableSY3 dt {width: 75%; color: #fff; font-size: 0.9em; vertical-align: middle; letter-spacing: -1px;}
.left-area .my-box .user dl.tableSY3 dd {width: 25%; color: #fff; font-size: 0.9em; letter-spacing: -1px; text-align: right;}
.left-area .my-box .user dl.tableSY3 dd a {color:#fff; text-decoration:underline;}
.left-area .my-box .user dl.tableSY3 .ico_member {width: 16px; height: 15px; background: url(../../assets/images/ico_member.png) left top /100% no-repeat; display: inline-block; vertical-align: middle;}
.left-area .my-box .id-name {box-sizing: border-box; background: #1b3b6b; padding: 6px 20px 8px; color: #fff; font-size: 0.9em;}
.left-area .sub-menu-box {padding: 30px 35px;}
.left-area .sub-menu-box > .sub-menu li a { font-size: 1.2em; font-weight: bold; color: #222; letter-spacing: -1.5px; line-height: 3; font-family: 'roboto', 'Noto Sans KR';} 
.left-area .sub-menu-box > .sub-menu li a:hover {color:#1f4d92;}
.left-area .sub-menu-box > .sub-menu li a.on {border-bottom:solid 3px #186dcb; color:#186dcb;}
.left-area .sub-menu-box > .sub-menu li a:hover.on {border-bottom:solid 3px #1f4d92;}

.left-area .cs-menu {padding: 30px 35px;}
.left-area .cs-menu li {position:relative; padding: 0 11px 0 10px;}
.left-area .cs-menu li:first-child {padding:0 11px 0 0; }
.left-area .cs-menu li:last-child {padding:0 0 0 10px; }
.left-area .cs-menu li:before { display: block;  clear: both; content: ""; width: 1px; height: 10px; background: #c3c3c3; position: absolute; top: 7px; left: 0;}
.left-area .cs-menu li:before:first-child {display:none;}
.left-area .cs-menu li a {font-size: 0.9em; color: #333; letter-spacing: -1px; font-weight: bold; font-family: 'roboto', 'Noto Sans KR';}
.left-area .cs-menu li a:hover {color:#1f4d92;}

.left-area.MO {display: none; width: 620px; margin: 0 auto; z-index: 10; position: inherit;}

.left-area .my-box .member-user > p { color: #fff; font-size: 0.85em;}

/* 2023.07.06 고객평점 추가 */
.cst-box {text-align: center;}
.cst-box h2 .ico-best {width:50px; height:50px; display:inline-block; background: url('../../assets/images/ico_best.png') left center /100% no-repeat; vertical-align: middle; margin-right: 7px;} 
.cst-box h2 p {display:inline-block; font-size: 1em; font-weight: 400; letter-spacing: -1px; color: #111111; text-align: left; width: auto; vertical-align: middle;}
.cst-box h2 p span {display:block;}
.cst-box .tit_box {text-align:center; color:#fff; padding:10px 0 14px; background:#2a374b;}
.cst-box .tit_box h1 {font-size:2.1em; color:#f7d541; font-weight:700; letter-spacing:-2px; }
.cst-box .tit_box h2 {font-size:1.6em; font-weight:500;}
.cst-box .tit_box .txt_box {display:inline-block; font-size: 0.8em; line-height: 1.4; letter-spacing: -0.5px; vertical-align: middle; margin-right: 5px;}
.cst-box .tit_box .txt_box strong{color:#f7d541; letter-spacing: 0; }
.cst-box .tit_box .grade_box {display:inline-block; padding:5px 0 0 0;}
.cst-box .tit_box h1,
.cst-box .grade_star {display:inline-block; vertical-align: middle;}
.cst-box .grade_star {text-align:left; padding-top:3px; padding-left:0;}
.cst-box .grade_star p {color:#cccccc; font-size:1em;}
/*평점*/
.ico_star {display: inline-block; height:20px; width:115px; background:url('../../assets/images/icon_star_bg.png') left top no-repeat; background-size:115px 20px;}
.ico_star strong {display:block; height:100%; font-size:0; background:url('../../assets/images/icon_star_bg_all.png') left top no-repeat; background-size:115px 20px;}


.sub-select {position: relative; width: 100%; background: #f9f9f9; text-align: left; box-sizing: border-box;}
.sub-select h3 {padding: 16px 60px;  font-weight: bold; font-size: 1.25em; color:#222; letter-spacing: -2px; cursor:pointer;}
.sub-select h3 span.arrow { position: absolute; right: 60px; top: 19px; content: ''; width: 10px; height: 10px; border-top: 3px solid #1f4d92;  border-right: 3px solid #1f4d92;  transform: rotate(135deg); cursor: pointer; transition: all 0.4s;}
.sub-select.on h3 span.arrow { position: absolute; right: 60px; top: 24px; content: ''; width: 10px; height: 10px; border-top: 3px solid #1f4d92;  border-right: 3px solid #1f4d92;  transform: rotate(315deg);cursor: pointer; }
.sub-select ul {display:none; position:absolute; top:59px; left:0; z-index:22; padding:9px 0; width:100%; background:#fff; border: 1px solid #1f4d92; }
.sub-select ul a {display:block; font-size: 1em; font-weight: bold; letter-spacing: -1px; text-align: left; color: #222; padding: 10px 60px; }
.sub-select ul li:hover a {background: rgba(31, 77, 146, 0.1);}

.cs-box {display: none;}
.cs-box > .cs-menu {text-align: center; margin: 40px 0;}
.cs-box > .cs-menu li {position:relative; padding: 0 10px 0 10px;}
.cs-box > .cs-menu li:first-child {padding:0 10px 0 0; }
.cs-box > .cs-menu li:before { display: block;  clear: both; content: ""; width: 1px; height: 10px; background: #c3c3c3; position: absolute; top: 7px; left: 0;}
.cs-box > .cs-menu li:before:first-child {display:none;}
.cs-box > .cs-menu li a {font-family:'Noto Sans Kr';  font-size: 0.9em; color: #333; letter-spacing: -1.5px; font-weight: bold;}
.cs-box > .cs-menu li a:hover {color:#1f4d92;}

.ico-naver { height: 18px; vertical-align: middle; margin-right: 7px;}


/*회원정보 보호*/
.sec-area .sec-visual {width:100%; height:145px; background:url('../../assets/images/sec_bg.png') bottom right /50% no-repeat; }
.sec-area .sec-visual > p {font-size:1em; padding-top: 15px; line-height: 1.5;}
.sec-area .banList li {background:#e9edf3; margin-bottom: 15px; box-sizing: border-box;}
.sec-area .banList li:first-child {background:#e9edf3 url('../../assets/images/sec_banner_bg.png') 107% /35% no-repeat}
.sec-area .banList li a {display: block; padding: 20px 40px; }
.sec-area .banList li a h3 {font-size: 1.3em; font-weight: normal; letter-spacing: 0px; margin-bottom: 10px; color: #222; font-family: 'roboto',  'Noto Sans KR';}
.sec-area .banList li a:hover h3 {color: #2286d6;}
.sec-area .banList li a p {width:70%; font-size: 1em; letter-spacing: -1px; color: #666; line-height: 1.5; word-break: keep-all;}
.sec-area .banList li a div.ban {position:relative;}
.sec-area .banList li a div.ban div.arrow {position: absolute; top: 50%; right: 0; transform: translate(0, -50%); background:#fff; border-radius:50px; width: 50px;  height: 50px; box-sizing: border-box; padding: 10px;}
.sec-area .banList li a:hover div.ban div.arrow {background:#36a3fa; transition:0.3s;}
.sec-area .banList li a div.ban span.material-icons-outlined {font-size: 30px; color: #36a3fa;}
.sec-area .banList li a:hover div.ban span.material-icons-outlined {color: #fff;}

.sec-area .banList li a div.ban div.switch {position: absolute; top: 50%; right: 0; transform: translate(0, -50%); }
.sec-area .banList li a div.ban div.switch .status_on {display: inline-block; width: 45px; height: 28px; line-height: 14px; border: solid 1px #36a3fa; border-top-left-radius: 5px; border-bottom-left-radius: 5px; background: #36a3fa; font-size: 14px; color: #fff; font-weight: bold; cursor: pointer; text-align: center; box-sizing:border-box;}
.sec-area .banList li a div.ban div.switch .status_on2 {display: inline-block; width: 45px; height: 28px; line-height: 14px; border: solid 1px #36a3fa; border-top-left-radius: 5px; border-bottom-left-radius: 5px; font-size: 14px; color: #36a3fa; font-weight: bold; cursor: pointer; text-align: center; box-sizing:border-box;}
.sec-area .banList li a div.ban div.switch .status_off {display: inline-block; width: 45px; height: 28px; line-height: 14px; border: solid 1px #36a3fa; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background: #36a3fa; color: #fff; font-weight: bold; font-size: 14px; cursor: pointer; text-align: center; box-sizing:border-box;}
.sec-area .banList li a div.ban div.switch .status_off2 {display: inline-block; width: 45px; height: 28px; line-height: 14px; border: solid 1px #36a3fa; border-top-right-radius: 5px; border-bottom-right-radius: 5px; color: #36a3fa; font-weight: bold; font-size: 14px; cursor: pointer; text-align: center; box-sizing:border-box;}

.sec-area .listSY li {width:32%; float:left; margin-right:2%;}
.sec-area .listSY li:last-child {margin-right:0;}
.sec-area .listSY li .dia {background: #e9eff6; text-align: center; padding: 30px 0;}
.sec-area .listSY li .dia h3 {color:#444444; font-size:1.1em; letter-spacing: -1.5px;}
.sec-area .listSY li .dia h3 span {display: block; width: 50%; background: #36a3fa; color: #fff; border-radius: 50px; margin: 0 auto; padding: 4px 0; font-size: 0.9em;  letter-spacing: 0; margin-bottom: 5px;}
.sec-area .listSY li .dia img {margin-top:20px;}
.sec-area .listSY li:nth-child(1) .dia img {width: 85px; height: 84px; filter: drop-shadow(10px 15px 10px #c0c5d3);}
.sec-area .listSY li:nth-child(2) .dia img {width: 49px; height: 84px; filter: drop-shadow(10px 15px 10px #c0c5d3);}
.sec-area .listSY li:nth-child(3) .dia img {width: 85px; height: 84px; filter: drop-shadow(10px 15px 10px #c0c5d3);}

.sec_end .sec_end_img {background:url(../../assets/images/sec_end.png) bottom center /200px no-repeat; height: 280px; padding-top: 50px; margin-bottom: 30px;}
.sec_end h2 {font-size: 1.5em; color: #36a3fa; letter-spacing: -1.5px; }


/*회원탈퇴*/
.drawa-opt li {margin-bottom:40px;}
.drawa-opt li:last-child {margin-bottom:0;}
.drawa-opt li .s-tit {padding: 10px 0 12px;  border-top: dotted 1px #347adc;  border-bottom: dotted 1px #347adc; font-size: 1.1em; font-weight: bold; color: #222; letter-spacing: -1px;}
.drawa-opt li p {font-size: 0.85em; line-height: 1.5; letter-spacing: -0.5px; word-break: keep-all;}



/*스타벅스 이벤트*/
.banner-box .ban_star {width:100%; padding: 20px; box-sizing: border-box; background:#eef6f2 url('../../assets/images/ban_star_icon.png') 123% -110% /40% no-repeat; }
.banner-box .ban_star > h3 { font-size: 1.1em; letter-spacing: -1px; color: #0e2319;  font-family: 'GmarketSans';}
.banner-box .ban_star > h3 strong {color:#008c5f;}
.banner-box .ban_star > h3 em {font-style:italic;}
.banner-box .ban_star > p {font-size:12px; color: #0e2319; letter-spacing: -1.5px; }


/*네이버웍스 이벤트*/
.banner-box .ban_nworks {width:100%; padding: 15px 0; box-sizing: border-box; background:#03c75a url('../../assets/images/ban_nworks_icon.png') 6% 50% /15% no-repeat; }
.banner-box .ban_nworks > h3 {font-size: 14px; letter-spacing: -1px; color: #fff; padding-left: 70px; line-height: 1.5;}
.banner-box .ban_nworks > h3 strong {color:#f2f513;}




/*팝업 스타일*/
.pop-layer .pop-container { padding: 20px 25px;}
.pop-layer p.ctxt { color: #666;  line-height: 25px;}
.pop-layer .btn-r { width: -webkit-fill-available;  padding: 20px 0;  margin-right: 25px; border-top: 1px solid #DDD;  text-align: right; position: absolute; box-sizing: border-box; bottom: 0; background: #fff; z-index: 100; }
.pop-layer { display: none; position: absolute;  top: 50%;  left: 50%;  width: 70%;  height: auto;  background-color: #fff;  border: 5px solid #3571B5;  z-index: 10; box-sizing: border-box;}
.dim-layer { display: none; position: fixed;  _position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  z-index: 1010;}
.dim-layer .dimBg { position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: #000;  opacity: .5;  filter: alpha(opacity=50);}
.dim-layer .pop-layer { display: block;}
a.btn-layerClose { display: inline-block;  height: 25px;  padding: 0 14px 0;  border: 1px solid #304a8a;  background-color: #3f5a9d;  font-size: 13px;  color: #fff;  line-height: 25px;}
a.btn-layerClose:hover { border: 1px solid #091940;  background-color: #1f326a;  color: #fff;}

.popup-pri-area a {text-decoration:none;}

.pop-layer2 { z-index:100; font-size: 13px; color: #333; padding: 20px 25px; border: 5px solid #3571B5; font-family:'Noto Sans Kr'; background: #f7fafe; box-sizing: border-box; line-height:20px;}
.pop-layer2 dl {margin-bottom:5px; }
.pop-layer2 dl dt {display:inline-block; width:20%; min-width:100px; vertical-align:top; font-weight:bold;  }
.pop-layer2 dl dd {display:inline-block; width:75%; word-break:keep-all; }


/*check, radio 스타일*/
.ico_ro input[type="checkbox"],
.ico_ro input[type="radio"] {border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}
.ico_ro input[type="checkbox"]:active + label:before,
.ico_ro input[type="radio"]:active + label:before {-webkit-transition-duration: 0; transition-duration: 0; -webkit-filter: brightness(0.2); filter: brightness(0.2);}
.ico_ro input[type="checkbox"] + label,
.ico_ro input[type="radio"] + label {position: relative; padding:0 10px; padding-left: 1.6em; vertical-align: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.ico_ro input[type="checkbox"] + label > strong,
.ico_ro input[type="radio"] + label > strong {font-family: 'roboto',  'Noto Sans KR'; font-size:17px; color: #333; letter-spacing: 0;}

/*input 스타일*/
select {box-sizing: border-box;  margin: 0;  border: solid 1px;  border-color: #ced6e1; border-radius: 2px; padding: 5px 3px 5px 25px; width: 100%; height: 55px; font-family: inherit; font-size: inherit; line-height: inherit; font-size: 1.1em; font-weight: bold; background:#fff url(../images/ico_select.png) no-repeat 100% 50%; background-size:auto 100%; -webkit-appearance: none; -moz-appearance: none  appearance: none; }
select option {color:#666666;}
select::-ms-expand { /* for IE 11 */display: none;}

select.sel-WH {border:none; background: #f9f9f9 url(../images/ico_select.png) no-repeat 100% 50%; font-size: 1.2em; letter-spacing: -1px;}

.in_txt {box-sizing: border-box;  margin: 0;  border: solid 1px;  border-color: #ced6e1; border-radius: 2px; padding: 5px 3px 5px 25px; width: 100%; height: 55px; font-family: inherit; font-size: inherit; line-height: inherit; font-size: inherit; font-weight: bold;}
.in_txt.small {height: 45px; font-family: inherit; font-size: 14px; font-weight: normal;}

.in_certi {padding: 5px 80px 5px 25px;}

.ico_ro input:focus + label:before {border-color: #3683fa;}
.ico_ro input + label:before {box-sizing: content-box; content: ''; color: #cccccc; position: absolute; top:50%; left: 0; width:20px; height:20px; margin-top:-11px; border:1px solid #cccccc; text-align: center; background:#fff; border-radius:3px;}
.ico_ro input + label:after {box-sizing: content-box; content: ''; background-color: #fff; position: absolute; top:50%; left:6px; width:9px; height:4px; margin-top:-4px; -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-transition: -webkit-transform 200ms ease-out; transition: -webkit-transform 200ms ease-out; transition: transform 200ms ease-out; transition: transform 200ms ease-out, -webkit-transform 200ms ease-out; background-color: transparent; border-style: solid; border-color: #cccccc; border-width: 0 0 2px 2px; -webkit-border-image: none; -o-border-image: none; border-image: none; -webkit-transform: rotate(-45deg) scale(1); transform: rotate(-45deg) scale(1); -webkit-transition: none; transition: none;}
.ico_ro input:checked + label:after {content: ''; -webkit-transform: rotate(-45deg) scale(1); transform: rotate(-45deg) scale(1); -webkit-transition: -webkit-transform 200ms ease-out; transition: -webkit-transform 200ms ease-out; transition: transform 200ms ease-out; transition: transform 200ms ease-out, -webkit-transform 200ms ease-out;}
.ico_ro input:checked + label:before {-webkit-animation: borderscale1 200ms ease-in; animation: borderscale1 200ms ease-in; background-color:#3683fa; border-color:#3683fa;}
.ico_ro input:checked + label:after {-webkit-transform: rotate(-45deg) scale(1); transform: rotate(-45deg) scale(1); border-color:#fff;}
.ico_ro input + label:before{border-radius: 50%;}
.ico_ro input + label:after{border-radius: 0;}

.pure-material-textfield-outlined {
    --pure-material-safari-helper1: #347adc;
    position: relative;
    display: inline-block;
    padding-top: 6px;
    font-size: 0.9em /*14px*/;
    line-height: 1.5;
    overflow: hidden;
	box-shadow: none;
	-moz-box-shadow: none; 
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
	width:100%;
}

/* Input, Textarea */
.pure-material-textfield-outlined > input {
    box-sizing: border-box;
    margin: 0;
    border: solid 1px; /* Safari */
    border-color: #ced6e1;
    border-top-color: transparent;
    border-radius: 2px;
    padding: 5px 3px 5px 25px;
	width:100%;
    height: 55px;
    color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 1);
    background-color: transparent;
    box-shadow: none; /* Firefox */
	-moz-box-shadow: none; 
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    caret-color: #347adc;
    transition: border 0.2s, box-shadow 0.2s;
	font-size: 1.1em;
	font-weight: bold;
}



.pure-material-textfield-outlined > input.invalid-pw {
	border: solid 2px;
    border-color: #fc5539;
	border-top-color: transparent;
}

.pure-material-textfield-outlined > select {
    box-sizing: border-box;
    margin: 0;
    border: solid 1px; /* Safari */
    border-color: #ced6e1;
    border-top-color: transparent;
    border-radius: 2px;
    padding: 5px 3px 5px 25px;
	width:100%;
    height: 55px;
    color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.87);
    box-shadow: none; /* Firefox */
	-moz-box-shadow: none; 
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    caret-color: #347adc;
    transition: border 0.2s, box-shadow 0.2s;
	font-size: 1.1em;
	font-weight: bold;
}

/* Span */
.mail-autocomplete span.em-ui,
.pure-material-textfield-outlined > input + span,
.pure-material-textfield-outlined > select + span {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    border-color: #cfcfcf;
    width: 100%;
    max-height: 100%;
    color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.6);
    font-size: 100%;
    line-height: 15px;
    cursor: text;
    transition: color 0.2s, font-size 0.2s, line-height 0.2s;
	color:#666;
}

.pure-material-textfield-outlined > input.invalid-pw + span {
	border-color: #fc5539;
	color: #fc5539;
}

.mail-autocomplete span.em-ui strong,
.pure-material-textfield-outlined > input + span strong,
.pure-material-textfield-outlined > select + span strong {
	color:red;
	font-weight:bold;
	line-height: 1;
    padding-left: 3px;
    font-size: 1.2em;
}


/* Corners */
.mail-autocomplete span.em-ui::before,
.mail-autocomplete span.em-ui::after,
.pure-material-textfield-outlined > input + span::before,
.pure-material-textfield-outlined > input + span::after,
.pure-material-textfield-outlined > select + span::before,
.pure-material-textfield-outlined > select + span::after{
    content: "";
    display: block;
    box-sizing: border-box;
    margin-top: 6px;
    border-top: solid 1px #ced6e1;
    min-width: 10px;
    height: 8px;
    pointer-events: none;
    box-shadow: inset 0 1px transparent;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.pure-material-textfield-outlined > input.invalid-pw + span::before,
.pure-material-textfield-outlined > input.invalid-pw + span::after {
	border-top: solid 2px #fc5539;
}

.mail-autocomplete span.em-ui::before,
.mail-autocomplete span.em-ui::after,
.pure-material-textfield-outlined > input + span::before,
.pure-material-textfield-outlined > select + span::before{
    margin-right: 4px;
    border-left: solid 1px transparent;
    border-radius: 0;
}


.mail-autocomplete span.em-ui::after{
	flex-grow: 1;
    margin-left: 4px;
    border-right: solid 1px transparent;
    border-radius: 0;
	margin-right: 0;
}
.pure-material-textfield-outlined > input + span::after,
.pure-material-textfield-outlined > select + span::after {
    flex-grow: 1;
    margin-left: 4px;
    border-right: solid 1px transparent;
    border-radius: 0;
}

/* Hover */
.pure-material-textfield-outlined:hover > input,
.pure-material-textfield-outlined:hover > select {
    border-color: #347adc;
    border-top-color: transparent;
}

.pure-material-textfield-outlined:hover > input + span::before,
.pure-material-textfield-outlined:hover > input + span::after,
.pure-material-textfield-outlined:hover > select + span::before,
.pure-material-textfield-outlined:hover > select + span::after{
    border-top-color: #347adc;
}

.pure-material-textfield-outlined:hover > input:not(:focus):placeholder-shown,
.pure-material-textfield-outlined:hover > select:not(:focus):placeholder-shown{
    border-color: #347adc;
}

/* Placeholder-shown */
.pure-material-textfield-outlined > input:not(:focus):placeholder-shown,
.pure-material-textfield-outlined > select:not(:focus):placeholder-shown{
    border-top-color: #ced6e1;
}

.mail-autocomplete .pure-material-textfield-outlined > input:not(:focus):placeholder-shown + span.em-ui,
.pure-material-textfield-outlined > input:not(:focus):placeholder-shown + span, 
.pure-material-textfield-outlined > select:not(:focus):placeholder-shown + span{
    font-size: inherit;
    line-height: 65px;
	color: #333;
}
.pure-material-textfield-outlined > input:not(:focus):placeholder-shown + span strong{
	color:red;
	font-weight:bold;
	line-height: 3.5;
    padding-left: 3px;
    font-size: 1.2em;
}

.pure-material-textfield-outlined > input:not(:focus):placeholder-shown + span::before,
.pure-material-textfield-outlined > input:not(:focus):placeholder-shown + span::after {
    border-top-color: transparent;
}

/* Focus */
.pure-material-textfield-outlined > input:focus {
    border-color: #cfcfcf;
    border-top-color: transparent;
   /* box-shadow: inset 1px 0 #347adc, inset -1px 0 #347adc, inset 0 -1px #347adc;*/
    outline: none;
	background:#fff;
}

.pure-material-textfield-outlined > input.invalid-pw:focus{
	 border-color: #fc5539;
	 border-top-color: transparent;
}


.pure-material-textfield-outlined > input:focus + span{
    color: #222222;
	font-size:1em;
}

.pure-material-textfield-outlined > input.invalid-pw:focus + span{
    color: #fc5539;
}

.pure-material-textfield-outlined > input:focus + span strong{
	color:red;
	font-weight:bold;
	line-height: 1;
    padding-left: 3px;
    font-size: 1.2em;
}

.pure-material-textfield-outlined > input:focus + span::before,
.pure-material-textfield-outlined > input:focus + span::after {
    border-top-color: #cfcfcf !important;
    /*box-shadow: inset 0 1px #347adc;*/
}

.pure-material-textfield-outlined > input.invalid-pw:focus + span::before,
.pure-material-textfield-outlined > input.invalid-pw:focus + span::after {
	 border-top-color: #fc5539 !important;
}

/* Disabled */
.pure-material-textfield-outlined > input:disabled,
.pure-material-textfield-outlined > input:disabled + span {
    border-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38) !important;
    border-top-color: transparent !important;
    color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38);
    pointer-events: none;
}

.pure-material-textfield-outlined > input:disabled + span::before,
.pure-material-textfield-outlined > input:disabled + span::after {
    border-top-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38) !important;
}

.pure-material-textfield-outlined > input:disabled:placeholder-shown,
.pure-material-textfield-outlined > input:disabled:placeholder-shown + span {
    border-top-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38) !important;
}

.pure-material-textfield-outlined > input:disabled:placeholder-shown + span::before,
.pure-material-textfield-outlined > input:disabled:placeholder-shown + span::after {
    border-top-color: transparent !important;
}

/* Faster transition in Safari for less noticable fractional font-size issue */
@media not all and (min-resolution:.001dpcm) {
    @supports (-webkit-appearance:none) {
        .pure-material-textfield-outlined > input,
		.pure-material-textfield-outlined > input + span.em-ui,
        .pure-material-textfield-outlined > input + span,
        .pure-material-textfield-outlined > input + span::before,
        .pure-material-textfield-outlined > input + span::after  {
            transition-duration: 0.1s;
        }
    }
}



.magic-radio,
.magic-checkbox {
  position: absolute;
  display: none; 
}

.magic-radio[disabled],
.magic-checkbox[disabled] {
  cursor: not-allowed; }

.magic-radio + label,
.magic-checkbox:enabled + label {
  position: relative;
  display: inline-block;
  cursor: pointer; 
  padding-left:22px; 
  letter-spacing:-0.5px; 
}

.magic-checkbox:disabled + label {
position: relative;
display: inline-block;
cursor: pointer; 
padding-left:0px; 
letter-spacing:-1px; 
}
  
  .magic-radio + label:before,
  .magic-checkbox:enabled + label:before {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 15px;
    height: 15px;
    content: '';
    border: 1px solid #347adc; 
	vertical-align:top;}

  .magic-radio + label:after,
  .magic-checkbox + label:after {
    position: absolute;
    display: none;
    content: ''; }

.magic-radio[disabled] + label,
.magic-checkbox[disabled] + label {
  cursor: not-allowed;
  color: #979797; }
  .magic-radio[disabled] + label:hover, .magic-radio[disabled] + label:before, .magic-radio[disabled] + label:after,
  .magic-checkbox[disabled] + label:hover,
  .magic-checkbox[disabled] + label:before,
  .magic-checkbox[disabled] + label:after {
    cursor: not-allowed; }
  .magic-radio[disabled] + label:hover:before,
  .magic-checkbox[disabled] + label:hover:before {
    border: 1px solid #979797;}
  .magic-radio[disabled] + label:before,
  .magic-checkbox[disabled] + label:before {
    border-color: #979797; }

.magic-radio:checked + label:after,
.magic-checkbox:checked + label:after {
  display: block; }

.magic-radio + label:before {
  border-radius: 50%; }

.magic-radio + label:after {
  top: 5px;
  left: 5px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #347adc; }

.magic-radio:checked + label:before {
  border: 1px solid #347adc; }

.magic-radio:checked[disabled] + label:before {
  border: 1px solid #c9e2f9; }

.magic-radio:checked[disabled] + label:after {
  background: #c9e2f9; }

.magic-checkbox + label:after {
  top:2px;
  left: 6px;
  box-sizing: border-box;
  width: 5px;
  height: 10px;
  transform: rotate(45deg);
  border-width: 2px;
  border-style: solid;
  border-color: #fff;
  border-top: 0;
  border-left: 0; }

.magic-checkbox:checked + label:before {
    border: 1px solid #347adc; 
	background: #347adc; }

.magic-checkbox:checked[disabled] + label:before {
  border: 1px solid #c9e2f9; 
  background: #c9e2f9; }

.mdc-floating-label{color: #ababab !important ;} 
.mdc-notched-outline__leading > :focus + span{color: #347adc !important;}

.mdc-text-field .mdc-text-field__input{caret-color:#347adc !important;caret-color:var(--mdc-theme-primary, #347adc !important)}
.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__leading,.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__notch,.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#347adc !important;border-color:var(--mdc-theme-primary, #347adc !important)}

.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-floating-label{color: #347adc !important}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active  {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}

@media screen and (min-width:1024px) {
	.cst-box.mo-foot {display:none;}
}


@media screen and (max-width:1024px) {
	.left-area.MO {display: block; }
	.cs-box {display: none; }
	.cs-box > .cs-menu li a {font-size:1em; letter-spacing:-0.5;}
	.contents-box.myPage {width: 620px; padding: 0 60px 60px 60px; min-height: auto;}
	.contents-box.myPage > .left-area {display:none;}	
	.contents-box.myPage > .join-area {width:100%;}

	.left-area .my-box {padding:30px 60px; text-align: left;}
	.left-area .sub-menu-box {padding:0;}
	
	.page-tit.view-no h2 {display:none; padding-top:10px;}

	.join-area .basic > .info-box { padding: 15px 20px;}
	.sec_end .sec_end_img {background:url(../../assets/images/sec_end.png) top center /160px no-repeat; height: 220px; padding-top: 0; margin-bottom: 0;}

	.cst-box.mo-foot { margin: 0 auto; width:620px; z-index: 99; position: relative;}
	.cst-box.mo-foot h2 {background:#fff;}
	.cst-box h2 p span {display:none;}

	#footer .footer-utils { width: 620px; padding:20px 0 0px 30px;}
	#footer .address-wrap { width: 620px; padding:10px 0 30px 30px;  }

}

@media screen and (max-width:768px) {
	#wrap {overflow:hidden; min-width:100%; width:100%; padding: 5%;}
	.contents-box {width:100%; background:#fff; box-shadow: 35px 50px 80px 10px #d9dfe8; padding: 9% 5.5%; margin: 0 auto; text-align: left; box-sizing: border-box;}
	.join-area ul.tab li{display: inline-block; padding: 3% 5%;	cursor: pointer; display:inline-block; width:50%; height:auto; background:#edf0f4; border:solid 1px #dbe1ea; border-bottom: solid 1px #36a3fa; float:left; line-height:1.5; text-decoration:none; font-size:0.8em; color: #4a5762; font-weight:bold; text-align:center; box-sizing:border-box; }
	#private_valid { width: 100%; }
	
	.join-area .basic label.short {width: 69%;}
	.join-area .basic .btn-area {width: 30%;}
	.join-area .basic .mail-autocomplete {width: 69%;}
	.join-area.find .basic .mail-autocomplete.V2 {width: 69%; }

	.left-area.MO {width:100%;}
	.left-area .my-box {padding: 4% 5.5%;}
	.contents-box.myPage {width:100%; padding: 0 5.5% 12% 5.5%;}
	
	.sub-select h3 {padding: 16px 5.5%;}
	.sub-select h3 span.arrow {right: 5.5%; }
	.sub-select.on h3 span.arrow {right: 5.5%;  }
	.sub-select ul a {padding: 3% 5.5%;}
	.cs-box {width:100%; display:none; }
	.sec-area .banList li a p {font-size:0.9em;}

	.cst-box.mo-foot {width:100%;}
	.cst-box h2 p span {display:block;}

	#footer .footer-utils { width: 100%; padding:20px 0 0px 30px;}
	#footer .address-wrap { width: 100%; padding:10px 0 30px 30px; }

}

@media screen and (max-width:580px) {
	#private_valid li { margin-bottom: 10px;}
	#private_valid .btn-area {float: none; padding-left: 2em;}

	.ID_box dl.tableSY3 dt {width:100%; display:block;}
	.ID_box dl.tableSY3 dd {width:100%; display:block; margin: 5px 0;}
	.ID_box.PW dl.tableSY3 dt {width:100%; display:block;}
	.ID_box.PW dl.tableSY3 dd {width:100%; display:block; margin: 10px 0 15px; }
	
	.join-area .basic .label-area span.chk_txt {width: 90%;}

	.ico_ro input[type="radio"] + label > strong.f09 {font-size:14px;}

	.bt-contents p {width: 100%; margin-bottom:10px;}
	.bt-contents .btn-area.fr {float:none;}
	.sec-area .banList li a {padding:20px;}
	.sec-area .listSY li {width:100%; margin-bottom:10px;}
	.sec-area .listSY li .dia {text-align: left; padding: 35px 50px; overflow: hidden;}
	.sec-area .listSY li .dia h3 {width: 50%; display: inline-block; padding-top: 10px;}
	.sec-area .listSY li .dia h3 span {margin: 0; text-align:center; margin-bottom: 10px;}
	.sec-area .listSY li .dia img {margin-top:0; float:right;}
	.sec-area .listSY li:nth-child(2) .dia img {padding-right: 18px}

	.in_txt {padding: 5px 3px 5px 15px}
	
	.btnSY2.small3.btn-b {font-size:1em; padding: 15px 5px;}

}

@media screen and (max-width:420px) {
	#private_valid li { margin-bottom: 10px;}
	#private_valid .btn-area {float: none; padding-left: 2em;}
	#private_valid .cs-tel-area {float: none; padding-top: 10px;}
	.comfrim {padding: 10px 0;}
	.comfrim .tableSY3 { display: block;}
	.comfrim .tableSY3 dt {display: block; width: 100%;}
	.comfrim .tableSY3 dd {display: block; width: 100%; border-top: none; border-left: solid 1px #c2ccdd;}
	.comfrim .tableSY3:first-child dd { border-top: none; }

	.sec-area .banList li a p {width:66%;}
	.sec-area .listSY li .dia {padding: 25px 30px;}
	.sec-area .listSY li .dia h3 {padding-top: 10px;}
	.sec-area .listSY li .dia h3 span {margin-bottom: 10px;}

	.pop-layer {width: 90%;}
	.option_box .listSY li {width:100%;}
	.join-area .basic label.short2 {width:100%;}
	.join-area .basic .btn-area2 {width:49%;}

	.step-two dl.tableSY3 dt {width:40%; }
	.step-two dl.tableSY3 dd {width:60%; }

	.btnSY2.small3 {font-size:1em; padding: 15px 5px;}
	.btnSY2.small3.btn-b { display: block; width: 100%;}
	.btnSY2.small3.btn-b:first-of-type {margin-bottom:5px;}
	
}


@media screen and (max-width:380px) {
	.btnSY2.small3 {font-size:1em; padding: 15px 5px;}
}




/* 구글 아이콘 */
.material-symbols-outlined { font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 0, 'opsz' 48; color: #fff;}



/* 약관팝업 */
.popup-pri-area {background:#fff; font-family: 'Noto Sans KR'; font-size: 14px; height: 520px; overflow: auto; padding-bottom: 70px;}
.popup-pri-area pre {font-family: 'Noto Sans KR'; font-size: 14px; word-break: keep-all; white-space: break-spaces;}
.popup-pri-area pre h2 {font-size: 20px; color: #111;}
.popup-pri-area strong { padding: 10px 0; display: inline-block;}
.popup-pri-area pre table {width:97%;}
.popup-pri-area pre table th {width:24%; font-family: 'Noto Sans KR';  font-size: 14px; vertical-align: middle; padding: 10px; background: #eee; border: solid 1px #e0e0e0; text-align: center;}
.popup-pri-area pre table td {font-family: 'Noto Sans KR';  font-size: 14px; padding: 10px 10px 10px 20px; border: solid 1px #e0e0e0; word-break: break-word;}
.popup-pri-area strong a.Link {text-decoration: none; color: #333; font-weight: bold;}


/* 로그인기록 */
.date-sch-area li {width:28%; padding-right:2%;}
.date-sch-area li:nth-of-type(2) {width:3%; }
.date-sch-area li:last-of-type {padding-right:0;}
.login-hs-area {padding-top:20px;}
.login-hs-area table {width:100%;}
.login-hs-area table tr th {font-size:0.9em; font-weight:bold; text-align:center; color:#333; background: #f2f2f2; padding: 15px 0; border-right: solid 1px #c1c1c1; border-top: solid 1px #c1c1c1; border-bottom: solid 1px #c1c1c1;}
.login-hs-area table tr th:first-of-type {width:33%}
.login-hs-area table tr th:nth-of-type(2) {width:24%}
.login-hs-area table tr th:nth-of-type(3) {width:28%}
.login-hs-area table tr th:last-of-type {width:15%; border-right:none;}
.login-hs-area table tr td {text-align:center; font-size:0.8em; padding: 10px; border-right: solid 1px #c1c1c1; border-bottom: solid 1px #c1c1c1; word-break: break-word;}
.login-hs-area table tr td:last-of-type {border-right:none;}


.footer-utils {clear:both; margin:0 auto; padding:30px 0 0px 50px; text-align:left; width:100%;  box-sizing:border-box; background:#1e2026}
.footer-utils .utils {overflow:hidden; display:block; height:auto; }
.footer-utils .utils li {display:inline-block;}
.footer-utils .utils li a {font-family: 'Noto Sans KR'; display:block; padding-right:25px; font-size:14px; line-height:20px; color:#888a90; font-weight:500; letter-spacing:0px;}
.footer-utils .utils li a.footer_privacy{color:#dbdbdb; }
.footer-utils .utils li:first-child a {padding-left:0;}
.footer-utils .utils li:hover a {color:#3977ca;}

/* 주소 */
.address-wrap { width:100%; display:table; margin:0 auto; min-height:120px; background:#1e2026; padding:10px 0 30px 50px; text-align:left; box-sizing:border-box; clear:both; }
.address-wrap address{ font-style:normal; margin-top:20px; margin-bottom:50px;}
.address-wrap address span { font-family: 'Noto Sans KR';float:left; margin-right:20px; font-size:12px; letter-spacing:-0.5px; line-height:20px; color:#888a90; }
.address-wrap address span:nth-child(5),
.address-wrap address span:nth-child(9),
.address-wrap address span:nth-child(10) {clear:both;} 
.address-wrap address span a {font-family: 'Noto Sans KR';color:#888a90; }


/* 회원정보 sns 문의 */
.sns-area {margin-top: 20px; border-top: solid 1px #ccc; width: 100%; padding-top: 20px;}
.sns-area .cs_txt {display: inline-block; font-size: 14px; line-height: 2; vertical-align: middle;}
.sns-area .cs_txt .cs-on { padding: 1px 5px 2px 5px; background: #f64d00; font-size: 10px; color: #fff; border-radius: 3px;}
.sns-area .cs_txt .cs-off { padding: 1px 5px 2px 5px; background: #8f8f8f; font-size: 10px; color: #fff; border-radius: 3px;}
.sns-area a:hover {text-decoration:underline; text-decoration-thickness:from-font; -webkit-text-decoration-thickness:from-font;}
.sns-area .cs_naver  a {display: block; font-size: 14px; color: #333; letter-spacing: -1.5px;  font-weight: 700; line-height: 2; margin-right:20px;}
.sns-area .cs_naver  a strong { color: #36b044;  font-weight: 700;}
.sns-area .naver-img {width: 50px; height: 50px; display: inline-block; background: url('../../assets/images/foot_cs_sns02.png') left center / 100% no-repeat;  vertical-align: middle; margin-right: 7px;}

.sns-area .cs_kakao  a {display: block; font-size: 14px; color: #333; letter-spacing: -1.5px;  font-weight: 700; line-height: 2;}
.sns-area .kakao-img {width: 50px; height: 50px; display: inline-block; background: url('../../assets/images/foot_cs_sns03.png') left center / 100% no-repeat;  vertical-align: middle; margin-right: 7px;}

.find_my .sns-area {margin: 20px 0; border-top: solid 1px #ccc;  border-bottom: solid 1px #ccc; width: 100%; padding: 20px 0;}

@media screen and (max-width:580px) {
	.sns-area .cs_naver {width:100%; display: block; margin-right:0px; margin-bottom:20px;}
	.sns-area .cs_kakao {width:100%; display: block;}
}