@charset "utf-8";

a:focus,
button:focus,
input:focus {
  outline: -webkit-focus-ring-color auto 5px;
  /*outline: -ms-focus-ring-color auto 5px;*/
}

.w1000 {max-width: 1000px; margin: 0 auto; padding: 0; box-sizing: border-box;}
body.Tablet .w1000, body.Mobile .w1000 { width: auto; margin-left: 10px; margin-right: 10px; padding: 0; }

a.nw:after {
	content: ''; display: inline-block;
	width: 14px; height: 14px; margin-left: 5px;
	background: url('/sites/moj/images/nw_icon.png') right center no-repeat;
}

#skip { position: absolute; width: 100%; left: 0; top: 0;  z-index: 105; }
#skip a { display: block; height: 1px; width: 1px; margin-bottom: -1px; overflow: hidden; color: #fff; background: #1d262d; white-space: nowrap; text-align: center; transition: all 0.2s ease;}
#skip a:focus, #skip a:active { height: auto; width: auto; padding: 7px; margin-bottom: 10px; }

/**[Layout]********************************************************/
#_wrapHeader, #_header { height: 300px;}
body.Mobile #_wrapHeader, body.Mobile #_header { height: 250px;}


#multipleContentsDiv_orderlymigration_31{background-color: #102548; opacity: 0.8;}

#_wrapHeader { 
    background-color: #000;
    background-position: center 30%;
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    -webkit-animation: subVisual_animate 10s linear;
    -moz-animation: subVisual_animate 10s linear;
    -o-animation: subVisual_animate 10s linear;
    animation: subVisual_animate 10s linear;
}
body.main .head-visual {  background-image: url('/sites/orderlymigration/images/sVisual_main01.jpg'); }
body.sub.eQ01 .head-visual {  background-image: url('/sites/orderlymigration/images/sVisual_main01.jpg');}
body.sub.eQ02 .head-visual {  background-image: url('/sites/orderlymigration/images/sVisual_main01.jpg');}
body.sub.eQ03 .head-visual {  background-image: url('/sites/orderlymigration/images/sVisual_main01.jpg'); }
body.sub.eQ04 .head-visual {  background-image: url('/sites/orderlymigration/images/sVisual_main01.jpg'); }

#_header {
    position: relative;
    /*transition: all 0.3s ease;*/
	z-index: 3;
  	overflow: hidden;
}
#_wrapArticle {
    padding: 0;
    position: relative;
	z-index: 1;
}
/* #_wrapFooter {border-top: 1px solid #b2b2b2;} */
#_wrapFooter, #_footer {
    position: relative;
	z-index: 2;
}
#topBtn {display: none;}
#topBtn button{
	position: fixed; bottom: 30px; right: 30px;
	width: 50px; height: 50px;
	background: url('/sites/orderlymigration/images/topBtn.png') center top no-repeat;
	border: 0;
	text-indent: -9999em;
	z-index: 101;
}



/**[Header]********************************************************/
/* header - logo Area */
.logoWrap {  width: 100%;  height:50px; margin-top:10px; position:relative; }
#_logo { width: 100%; position: absolute; left: 0; top: 0;  text-align: center; }
#_logo a {
    display: block;
    width: 249px;
    height: 50px;
    background: url('/sites/orderlymigration/images/logo.png') left top no-repeat;
    background-size: 100%;
    text-indent: -5000px;
    overflow: hidden;
}
body.Mobile #_logo a { width: 200px;  height: 40px;}
#_logo span.head-copy { display: inline-table;  width: 100%; padding-top: 10px; font-family: 'AritaBuri', '바탕체'; font-weight: 500; color: #fff; position: absolute;  left: 0; top: 90px; animation: titleScale 1.5s ease-out; }
@keyframes titleScale {
    0% {top: 0; opacity: 0;}
	50% {opacity: 0;}
    100% {top: 90px; opacity: 1;}
}
body.Mobile #_logo span.head-copy { top: 70px; animation: titleScale_M 1.5s ease-out; }
@keyframes titleScale_M {
    0% {top: 0; opacity: 0;}
	50% {opacity: 0;}
    100% {top: 70px; opacity: 1;}
}
#_logo span.head-copy:before {
    content: '';
    position: absolute; 
    left: 50%; top: 0;
    display: inline-table;
    width:50px;
    height: 1px;
    margin-left: -25px;
    background-color: #fff;
}
.logoWrap .rightArea { position: absolute; right: 0; top: 10px;  }
body.Mobile .logoWrap .rightArea { top: 5px;  }
.langbox { position: relative; }
.langbox .btn-lang {  width: 90px; height: 28px; padding-right: 20px; border-radius: 5px; font-size: .87em; color: #fff;  background-color: rgba(19,28,35,.75);  position: relative;  z-index: 10; }
.langbox .btn-lang:after {
    content: '';
    display: block;
    width: 14px;
    height: 8px;
    background: url('/sites/orderlymigration/images/sitelink_arrow_main.png') left top no-repeat;
    transition: all 0.3s ease;
    position: absolute; right: 5px; top: 10px; 
}
.langbox .btn-lang._on:after {
    transform: rotate(180deg);
}
.langbox .select-lang { width: 70px; padding-top: 28px; border-radius: 5px; background-color: rgba(19,28,35,.75); position: absolute; left: 0; top: 0; z-index: 1; overflow: hidden;  display: none; }
.langbox .select-lang a {  display: block; height: 20px; padding-bottom: 2px; vertical-align: middle; font-size: .87em; color: #fff; }
.langbox .select-lang a:hover, .langbox .select-lang a:active, .langbox .select-lang a:focus { background-color: #036; }
.langbox .select-lang a.on { background-color: #1395d2; }


/**[주메뉴]********************************************************/
.topMenu {
    position: absolute;
  	bottom: 0;
  	z-index: 100;
    width: 100%;
	background-color: rgba(19,28,35,.75);
}
.topMenu .w1000 { padding: 0; }
.menuUItop{

}
.menuUItop .top_div {
    margin: 0;
    padding: 0;
    text-align: center;
}
.menuUItop ul {
    display: inline-block;
    vertical-align: top;
    max-width: 1200px;
    width: 100%;
    min-height: 60px;
}
body.Mobile .menuUItop ul { min-height: 50px; }
.menuUItop ul > li {
    display: inline-table;
    vertical-align: top;
    box-sizing: border-box;
    margin: 0 15px;
}
.menuUItop ul > li > a { 
    display: table-cell;
    vertical-align: middle;
    color: #FFF;
    font-size: 16px;
    position: relative;
    height: 60px;
    box-sizing: border-box;
    transition: .1s;
}
body.Mobile .menuUItop ul > li > a { height: 50px; }
.menuUItop ul > li > a:before {
    content: "";
    position: absolute;
    top: 25px;
    right: -18px;
    background-color: rgba(255,255,255,.25);
    width: 1px;
    height: 13px;
}
body.Mobile .menuUItop ul > li > a:before {   top: 20px; }
.menuUItop ul > li:last-child > a:before {
	display: none
}
.menuUItop ul > li > a:after {
	content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: transparent;
    width: 100%;
    height: 4px;
}
.menuUItop ul > li > a:hover:after, .menuUItop ul > li > a:active:after, 
.menuUItop ul > li > a:focus:after, .menuUItop ul > li._menuOn > a:after {
    background-color: #FFF;
}



/**[Footer]********************************************************/
.fleft { float: left; }
.fright { float: right; }
#_footer { background-color: #1d262d; padding: 1.5em 0 2em 0; overflow: hidden; }
#_footer * { font-size: 14px; color: #8b959e; }
#_footer ul {overflow: hidden; }
body.Mobile #_footer .fleft, body.Mobile #_footer .fright { float: none; overflow: hidden; }
body.Mobile #_footer .fright { margin-top: 20px; }

#_footer ._info h2.logo { width: 230px; height: 35px; margin-bottom: 10px; font-size:0; line-height: 0; text-indent: -9999em; background: url('/sites/orderlymigration/images/logo_footer.png') no-repeat; background-size: 100%; }
#_footer ._info ul { margin: 10px 0; }
#_footer ._info ul li { margin-bottom: 10px; padding-left: 20px; position: relative; }
#_footer ._info ul li:last-child { margin-bottom: 0; }
#_footer ._info ul li:before { 
	content: ''; 
	display: block; 
	width: 15px; height: 15px; 
	background-image: url('/sites/orderlymigration/images/icon_footer.png'); 
	background-repeat: no-repeat;
	position: absolute; left: 0; top: 5px;
}
#_footer ._info ul li._tel:before { background-position: 0 0; }
#_footer ._info ul li._address:before { background-position: 0 -20px; }
#_footer ._info ._copyright { font-size: 10px; }

#_footer ._direct_sns { margin-bottom: 10px; overflow: hidden; text-align: right; }
#_footer ._direct_sns > ul { display: inline; }
#_footer ._direct_sns > ul > li { display: inline-block; margin-left: 5px; }
#_footer ._direct_sns > ul > li > a { 
	display: block; 
	width: 33px; height: 33px;
	background-image: url('/sites/orderlymigration/images/btn_sns.png');
	background-position: left top;
	background-repeat: no-repeat;
	font-size: 0; line-height: 0;
    text-indent: -9999em;
  	overflow: hidden;
}
#_footer ._direct_sns > ul > li > a.snsF { background-position: 0 0; }
#_footer ._direct_sns > ul > li > a.snsT { background-position: 0 -38px; }
#_footer ._direct_sns > ul > li > a.snsY { background-position: 0 -76px; }
#_footer ._direct_sns > ul > li > a.snsB { background-position: 0 -104px; }
#_footer .linklogoWrap > li { float:left; margin-left: 10px; }
body.Mobile ._direct_sns, body.Moblie .linklogoWrap { display: inline !important; }
body.Mobile ._direct_sns { float: left; }
body.Moblie .linklogoWrap { float: right; }



/** 임시작업 **/
#_contentBuilder > .multipleDiv,
#_contentBuilder > .multipleDiv > .multipleContentsDiv { /*overflow: hidden;*/ position: relative; }
#_contentBuilder > .multipleDiv {
	background-position: right bottom;
    background-repeat: no-repeat;
    background-size: cover;
    background-color:#102548;
}
#_contentBuilder > .multipleDiv:nth-child(2) {
    /*background-image: url(/sites/orderlymigration/images/sVisual_main02.jpg);*/  background:#fff;
}
#_contentBuilder > .multipleDiv:nth-child(3) {
    background-image: url(/sites/orderlymigration/images/sVisual_main02_2.jpg); padding: 60px 0;  
}
#_contentBuilder > .multipleDiv > .multipleContentsDiv { 
  width: auto; height: auto; max-width: 1040px; min-height: 200px;  margin-top: 0; /*margin-bottom: 80px;*/ padding-top: 60px;
  /*background-color: #102548;*/
}


#_contentBuilder > .multipleDiv:nth-child(1) > .multipleContentsDiv { /*margin-top:  60px;*/ }
body.Mobile #_contentBuilder > .multipleDiv > .multipleContentsDiv { 
  margin-top: 0px; margin-bottom: 0px; 
}
#_contentBuilder > .multipleDiv . _objHtml   { width: auto !important; hegiht: auto !important; }