@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;500&display=swap');

html {-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;}
html, body, div, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, span, blockquote, pre,
abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var, a,b, center, dl, dt, dd, ol, ul, li,
fieldset, form, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary, time, mark, audio, video ,button, textarea, input, 
label, select, option{
	margin:0; padding:0; border:0; vertical-align:top; letter-spacing:-0.04em; line-height:1.6;
    box-sizing:border-box; border-width:0px; font-size:20px; color:#111; word-break:keep-all;
    border-style:initial; border-color:initial; border-image:initial; outline:0px;
	font-family:'Montserrat','Noto Sans KR',sans-serif;
}
a{text-decoration:none; cursor:pointer}
a:hover{text-decoration:none;}
button, select{background:none; outline:none; border:none; cursor:pointer}
button {cursor:pointer}
em,i{font-style:normal}
em{font-weight:bold}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {display:block}
body {line-height:1;}
ol, ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after {content:''; content:none}
table {width:100%; border-spacing:0}
caption{display:none;}
input{vertical-align:middle}
textarea{width:100%; overflow-y:auto; resize:none; border:1px solid #ddd}
hr{border:none}
i{display:inline-block}
input::placeholder{color:#aaa; font-weight:normal; font-family:'Noto Sans KR','돋움',dotum,Helvetica,'Apple SD Gothic Neo',applegothic,sans-serif;}
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder{color:transparent} 
input:focus:-moz-placeholder, textarea:focus:-moz-placeholder{color:transparent}
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder{color:transparent}
input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder{color:transparent}
select{-moz-appearance:none; -webkit-appearance:none; appearance:none;}
select::-ms-expand{display:none}
label{display:inline-block; text-align:center; font-weight:normal}
ul{font-size:0}
img{max-width:100%; image-rendering:-webkit-optimize-contrast; transform:translateZ(0); backface-visibility:hidden}

h2, h2 *{font-size:48px; line-height:1.3}
h3, h3 *{font-size:30px; line-height:1.3}
h2, h3{position:relative; font-weight:normal}

.xs_block{display:none !important}
.xs_inline{display:none !important}
.xs_hidden{display:block !important; margin:0 auto}

.bold{font-weight:bold}

.flex{display:flex !important; justify-content:space-between; align-items:flex-start}
.flexbox{display:flex; justify-content:space-between; align-items:center}

.tal{text-align:left !important}
.tar{text-align:right !important}
.tac{text-align:center !important}

.vat{vertical-align:top !important}
.vam{vertical-align:middle !important}
.vab{vertical-align:bottom !important}
.baseline{vertical-align:baseline !important}

.hidden{overflow:hidden !important}
.fl{float:left !important}
.fr{float:right !important}

.pt0{padding-top:0 !important}
.mt0{margin-top:0 !important}
.mt5{margin-top:5px !important}
.mt10{margin-top:10px !important}
.mt15{margin-top:15px !important}
.mt20{margin-top:20px !important}
.mt25{margin-top:25px !important}
.mt30{margin-top:30px !important}
.mt35{margin-top:35px !important}
.mt40{margin-top:40px !important}
.mt45{margin-top:45px !important}
.mt50{margin-top:50px !important}
.mt55{margin-top:55px !important}
.mt60{margin-top:60px !important}
.mt65{margin-top:65px !important}
.mt70{margin-top:70px !important}
.mb5{margin-bottom:5px !important}
.mb10{margin-bottom:10px !important}
.mb15{margin-bottom:15px !important}
.mb20{margin-bottom:20px !important}
.mb25{margin-bottom:25px !important}
.mb30{margin-bottom:30px !important}
.mb35{margin-bottom:35px !important}
.mb40{margin-bottom:40px !important}
.mb45{margin-bottom:45px !important}
.mb50{margin-bottom:50px !important}
.mb55{margin-bottom:55px !important}
.mb60{margin-bottom:60px !important}
.mb65{margin-bottom:65px !important}
.mb70{margin-bottom:70px !important}
.mb150{margin-bottom:150px !important}
.ml5{margin-left:5px !important}
.ml10{margin-left:10px !important}
.ml15{margin-left:15px !important}
.ml20{margin-left:20px !important}
.ml25{margin-left:25px !important}
.ml30{margin-left:30px !important}
.mr5{margin-right:5px !important}
.mr10{margin-right:10px !important}
.mr15{margin-right:15px !important}
.mr20{margin-right:20px !important}
.mr25{margin-right:25px !important}
.mr30{margin-right:30px !important}


/* Header */
.pc_header{position:fixed; left:0; top:0; width:100%; padding:30px 0; z-index:999; transition: all 0.3s ease 0s}
.pc_header h1 a{width:150px; height:30px; display:inline-block; overflow:hidden; position:relative}
.pc_header h1 img{position:absolute; top:0; left:0; max-width:none}
.pc_header li{display:inline-block}
.pc_header .menu li + li{margin-left:50px}
.pc_header .menu li a{color:#fff}
.pc_header.scroll, .pc_header:hover{background:#fff; border-bottom:1px solid #ddd; /*padding:15px 0*/}
.pc_header.scroll h1 img, .pc_header:hover h1 img{left:-150px}
.pc_header.scroll .menu li a, .pc_header:hover .menu li a{color:#111; font-size:18px; position:relative}
.pc_header.scroll .menu li a:hover, .pc_header:hover .menu li a:hover{color:#57c2d8}
.pc_header.scroll .menu li a:hover::before, .pc_header:hover .menu li a:hover::before{content:''; position:absolute; bottom:-5px; left:0; width:100%; height:3px; background:#57c2d8}
.pc_header.on h1 img{/*left:-150px !important*/}
/*
.pc_header.on .menu li a{color:#111 !important}
*/
.pc_header.on .menu li a:hover{color:#57c2d8 !important}
.pc_header .language li + li{margin-left:15px}
.pc_header .language li a{display:inline-block; text-indent:-9999px; width:32px; height:32px; border:1px solid #ddd; border-radius:100%}
.ko{background:url('../../img/korea.png')}
.jp{background:url('../../img/japan.png')}
.us{background:url('../../img/us.png')}



/* Footer */
.footer{background:#eee; padding:50px 0}
.footer .logo{flex:0 0 25%}
.footer .info{flex:0 0 75%}
.footer *{font-size:16px; color:#777}
.footer li{display:inline-block; position:relative}
.footer li + li{margin-left:15px; padding-left:16px}
.footer li + li::before{content:''; position:absolute; top:50%; transform:translateY(-50%); left:0; width:1px; height:10px; background:#ccc}

@media (max-width: 1100px) {
	html, body, div, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, span, blockquote, pre,
	abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp,
	small, strike, sub, sup, tt, var, a,b, center, dl, dt, dd, ol, ul, li,
	fieldset, form, legend, table, caption, tbody, tfoot, thead, tr, th, td,
	article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup,
	menu, nav, output, ruby, section, summary, time, mark, audio, video ,button, textarea, input, 
	label, select, option{font-size:18px}
	ul{font-size:0}

	h2, h2 *{font-size:4vw}
}

@media (max-width: 768px) {
	html, body, div, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, span, blockquote, pre,
	abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp,
	small, strike, sub, sup, tt, var, a,b, center, dl, dt, dd, ol, ul, li,
	fieldset, form, legend, table, caption, tbody, tfoot, thead, tr, th, td,
	article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup,
	menu, nav, output, ruby, section, summary, time, mark, audio, video ,button, textarea, input, 
	label, select, option{font-size:15px}
	ul{font-size:0}

	h2, h2 *{font-size:6vw}
	h3, h3 *{font-size:4.5vw}

	.xs_block{display:block !important; margin:0 auto}
    .xs_inline{display:inline-block !important}
	.xs_hidden{display:none !important}

	.flexnone{display:block !important}

	.m_tal{text-align:left !important}
	.m_tar{text-align:right !important}
	.m_tac{text-align:center !important}

	.m_mt0{margin-top:0px !important}
	.m_mt5{margin-top:5px !important}
	.m_mt10{margin-top:10px !important}
	.m_mt15{margin-top:15px !important}
	.m_mt20{margin-top:20px !important}
	.m_mt25{margin-top:25px !important}
	.m_mt30{margin-top:30px !important}
	.m_mt35{margin-top:35px !important}
	.m_mt40{margin-top:40px !important}
	.m_mt45{margin-top:45px !important}
	.m_mt50{margin-top:50px !important}
	.m_mt55{margin-top:55px !important}
	.m_mt60{margin-top:60px !important}
	.m_mt65{margin-top:65px !important}
	.m_mt70{margin-top:70px !important}
	.m_mb0{margin-bottom:0px !important}
	.m_mb5{margin-bottom:5px !important}
	.m_mb10{margin-bottom:10px !important}
	.m_mb15{margin-bottom:15px !important}
	.m_mb20{margin-bottom:20px !important}
	.m_mb25{margin-bottom:25px !important}
	.m_mb30{margin-bottom:30px !important}
	.m_mb35{margin-bottom:35px !important}
	.m_mb40{margin-bottom:40px !important}
	.m_mb45{margin-bottom:45px !important}
	.m_mb50{margin-bottom:50px !important}
	.m_mb55{margin-bottom:55px !important}
	.m_mb60{margin-bottom:60px !important}
	.m_mb65{margin-bottom:65px !important}
	.m_mb70{margin-bottom:70px !important}
	.m_ml0{margin-left:0 !important}
	.m_ml5{margin-left:5px !important}
	.m_ml10{margin-left:10px !important}
	.m_ml15{margin-left:15px !important}
	.m_ml20{margin-left:20px !important}
	.m_ml25{margin-left:25px !important}
	.m_ml30{margin-left:30px !important}
	.m_mr5{margin-right:5px !important}
	.m_mr10{margin-right:10px !important}
	.m_mr15{margin-right:15px !important}
	.m_mr20{margin-right:20px !important}
	.m_mr25{margin-right:25px !important}
	.m_mr30{margin-right:30px !important}


	/* Header */
	.mo_header{position:fixed; z-index:999; padding:20px; width:100%; background:#fff; border-bottom:1px solid #ddd}
	.all_menu{display:inline-block; width:30px; height:auto; cursor:pointer; z-index:3; position:relative; text-align:center}
	.all_menu > div{width:auto; margin:0 auto; transition:all .7s ease; -webkit-transition:all .7s ease; -moz-transition:all .7s ease; -ms-transition:all .7s ease; -o-transition:all .7s ease}
	.all_menu .bar{display:block; height:3px; width:25px; background:#56c1d9; border-radius:10px; -webkit-transition:all .7s ease; -moz-transition:all .7s ease; -ms-transition:all .7s ease; -o-transition:all .7s ease; transition:all .7s ease}
	.all_menu .bar + .bar{margin-top:4px}
	.all_menu.on .top{ -webkit-transform:translateY(7px) rotateZ(45deg); -moz-transform:translateY(7px) rotateZ(45deg); -ms-transform:translateY(7px) rotateZ(45deg); -o-transform:translateY(7px) rotateZ(45deg); transform:translateY(7px) rotateZ(45deg)}
	.all_menu.on .middle{width:0;}
	.all_menu.on .bottom{-webkit-transform:translateY(-7px) rotateZ(-45deg); -moz-transform:translateY(-7px) rotateZ(-45deg); -ms-transform:translateY(-7px) rotateZ(-45deg); -o-transform:translateY(-7px) rotateZ(-45deg); transform:translateY(-7px) rotateZ(-45deg)}
	.gnb_menu{position:fixed; top:0; left:0; width:100%; height:100vh; background:#fff; z-index:2; display:none}
	.gnb_menu ul.mob_menu{position:absolute; top:40%; transform:translateY(-50%); padding:0 10vw}
	.gnb_menu li{overflow:hidden}
	.gnb_menu li + li{margin-top:20px}
	.gnb_menu li a{font-size:6vw; font-weight:bold; letter-spacing:1px; position:relative; opacity:0}
	.gnb_menu li:nth-child(1) a{animation:txtToTop .7s ease-in-out .2s forwards}
	.gnb_menu li:nth-child(2) a{animation:txtToTop .7s ease-in-out .4s forwards}
	.gnb_menu li:nth-child(3) a{animation:txtToTop .7s ease-in-out .6s forwards}
	.gnb_menu li:nth-child(4) a{animation:txtToTop .7s ease-in-out .8s forwards}
	.gnb_menu li:nth-child(5) a{animation:txtToTop .7s ease-in-out .9s forwards}
	html.scrollno{overflow:hidden; height:100%}

	.mob_lang{
		display: flex;
		align-items: flex-end;
		justify-content: flex-start;
		padding: 0 10vw;
		position: absolute;
		top: 63%;
		transform: translateY(-50%);
	}
	.mob_lang li{
		margin-right:10px;
	}
	.mob_lang li a{
		display: inline-block;
		text-indent: -9999px;
		width: 32px;
		height: 32px;
		border: 1px solid #ddd;
		border-radius: 100%;
	}

	/* Footer */
	.footer{padding:7vw 0}
	.footer .logo img{height:22px}
	.footer .info{margin-top:20px; width:100%}
	.footer *{font-size:14px}
	.footer li{display:block}
	.footer li + li{margin-left:0; padding-left:0}
	.footer li + li::before{content:none}
}