﻿@charset "UTF-8";

/* Default */
* { padding:0; margin:0; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; line-height:1.25; word-break:keep-all; }

html[lang="ko"] * { font-family:'Noto Sans KR', 'simsun', sans-serif; }
html[lang="en"] * { font-family:'Lato', sans-serif; }

html,
body { height:100%; }
body { color:#222; background-color:#fff; }

img { vertical-align:middle; }
em { font-style:normal; }
input,
select { line-height:normal; }

a[data-href] { color:#080; text-decoration:none; }
*[data-anchor] { position:absolute; visibility:hidden; margin-top:-60px; }
input[readonly] { color:#555; background-color:#f0f0f0; }

form fieldset { border:none; }

label { display:inline-block; }
label div { display:-ms-flexbox; display:flex; -ms-flex-align:center; align-items:center; }

#ly-Body.active-detail { overflow:hidden; }

#ly-Layout { width:100%; min-width:800px; min-height:100%; position:relative; }

#ly-Header { width:100%; min-width:800px; height:60px; position:fixed; top:0; left:0; z-index:255; background-color:#d6dde5; display:-ms-flexbox; display:flex; -ms-flex-align:center; align-items:center; -ms-flex-pack:justify; justify-content:space-between; }
#ly-Header h1 { width:220px; height:60px; background-color:#00833e; }
#ly-Header div.frame { padding-right:20px; display:-ms-flexbox; display:flex; -ms-flex-align:center; align-items:center; }
#ly-Header div.frame button { margin-left:10px; padding:2px 10px; background-color:#000; color:#fff; border:none; border-radius:200px; font-size:.9em; }

#ly-Navi { width:220px; min-height:100%; padding-top:60px; position:absolute; top:0; left:0; z-index:254; background-color:#00833e; }
#ly-Navi div.frame { width:100%; margin:auto; }
#ly-Navi a.parent-link { padding:25px 20px 25px 50px; display:block; font-size:1.1em; font-weight:700; text-decoration:none; color:#fff; position:relative; transition:color ease .5s 0s; line-height:1; outline:none; }
#ly-Navi a.parent-link.focus,
#ly-Navi a.parent-link:focus,
#ly-Navi a.parent-link:hover { color:#ffd317; background-color:rgba(255, 255, 255, .1); }
#ly-Navi a.parent-link.active { color:#000; background-color:#ffd317; }
#ly-Navi a.parent-link:after { width:100%; height:100%; content:''; position:absolute; top:0; left:0; opacity:.5; background-position:16px center; background-repeat:no-repeat; transition:opacity ease .5s 0s; }
#ly-Navi a.parent-link.menu:after { background-image:url('../../img/common/img-navi-menu.png'); }
#ly-Navi a.parent-link.content:after { background-image:url('../../img/common/img-navi-content.png'); }
#ly-Navi a.parent-link.cs:after { background-image:url('../../img/common/img-navi-cs.png'); }
#ly-Navi a.parent-link.board:after { background-image:url('../../img/common/img-navi-board.png'); }
#ly-Navi a.parent-link.store:after { background-image:url('../../img/common/img-navi-store.png'); }
#ly-Navi a.parent-link.popup:after { background-image:url('../../img/common/img-navi-popup.png'); }
#ly-Navi a.parent-link:focus:after,
#ly-Navi a.parent-link:hover:after,
#ly-Navi a.parent-link.active:after { opacity:1; }
#ly-Navi a.parent-link span { line-height:1; }
#ly-Navi a.parent-link:not(.active) + ul.child { display:none; }
#ly-Navi ul.child { background-color:rgba(255, 255, 255, .2); padding-top:15px; padding-bottom:15px; }
#ly-Navi a.child-link { padding:8px 24px; text-decoration:none; font-weight:600; color:#fff; display:block; border-left:1px solid transparent; outline:none; }
#ly-Navi a.child-link:focus,
#ly-Navi a.child-link:hover { color:#ffd317; }
#ly-Navi a.child-link.active { color:#ffd317; font-weight:800; }

#ly-Sections { min-height:100%; position:relative; padding:90px 30px 30px 250px; }

#ly-Sections h2 { font-size:1.6em; font-weight:900; margin-bottom:30px; color:#00833e; }

#ly-Footer { width:100%; }

/* Loading */
#ly-Loading { width:100vw; height:100vh; position:fixed; top:0; left:0; background:rgba(0, 0, 0, .8); display:none; z-index:1000; }
#ly-Loading .frame { width:100%; height:100%; display:-ms-flexbox; display:flex; -ms-flex-align:center; align-items:center; -ms-flex-pack:center; justify-content:center; . }
#ly-Loading .obj-loading { position:relative; }
#ly-Loading .obj-loading div { box-sizing:border-box; }
#ly-Loading .obj-loading > div { width:200px; height:200px; position:absolute; top:0px; left:0px; border-radius:50%; border:20px solid #000; border-color:#00833e transparent #00833e transparent; -webkit-animation:loading 2s linear infinite; animation:loading 2s linear infinite; }
#ly-Loading .obj-loading > div:nth-child(2),
#ly-Loading .obj-loading > div:nth-child(4) { width:156px; height:156px; top:22px; left:22px; -webkit-animation:loading-reverse 1s linear infinite; animation:loading-reverse 1s linear infinite; }
#ly-Loading .obj-loading > div:nth-child(2) { border-color:transparent #ffd317 transparent #ffd317; }
#ly-Loading .obj-loading > div:nth-child(3) { border-color:transparent; }
#ly-Loading .obj-loading > div:nth-child(3) div { width:100%; height:100%; position:absolute; -webkit-transform:rotate(45deg); transform:rotate(45deg); }
#ly-Loading .obj-loading > div:nth-child(3) div:before,
#ly-Loading .obj-loading > div:nth-child(3) div:after { width:20px; height:20px; content:''; display:block; position:absolute; top:-20px; left:70px; background:#00833e; border-radius:50%; box-shadow:0 180px 0 0 #00833e; }
#ly-Loading .obj-loading > div:nth-child(3) div:after { left:-20px; top:70px; box-shadow:180px 0 0 0 #00833e; }
#ly-Loading .obj-loading > div:nth-child(4) { border-color:transparent; }
#ly-Loading .obj-loading > div:nth-child(4) div { width:100%; height:100%; position:absolute; -webkit-transform:rotate(45deg); transform:rotate(45deg); }
#ly-Loading .obj-loading > div:nth-child(4) div:before,
#ly-Loading .obj-loading > div:nth-child(4) div:after { width:20px; height:20px; content:''; display:block; position:absolute; top:-20px; left:48px; background:#ffd317; border-radius:50%; box-shadow:0 136px 0 0 #ffd317; }
#ly-Loading .obj-loading > div:nth-child(4) div:after { left:-20px; top:48px; box-shadow:136px 0 0 0 #ffd317; }
#ly-Loading .obj-loading { width:120px !important; height:120px !important; -webkit-transform:translate(-60px, -60px) scale(0.6) translate(60px, 60px); transform:translate(-60px, -60px) scale(0.6) translate(60px, 60px); }

@keyframes loading {
	0% {
		-webkit-transform:rotate(0);
		transform:rotate(0);
	}
	100% {
		-webkit-transform:rotate(360deg);
		transform:rotate(360deg);
	}
}

@-webkit-keyframes loading {
	0% {
		-webkit-transform:rotate(0);
		transform:rotate(0);
	}
	100% {
		-webkit-transform:rotate(360deg);
		transform:rotate(360deg);
	}
}

@keyframes loading-reverse {
	0% {
		-webkit-transform:rotate(0);
		transform:rotate(0);
	}
	100% {
		-webkit-transform:rotate(-360deg);
		transform:rotate(-360deg);
	}
}

@-webkit-keyframes loading-reverse {
	0% {
		-webkit-transform:rotate(0);
		transform:rotate(0);
	}
	100% {
		-webkit-transform:rotate(-360deg);
		transform:rotate(-360deg);
	}
}