@charset "utf-8";

.inner{ max-width: 420px; padding: 0 16px; margin: 0 auto; box-sizing: border-box;}
.inner2{ max-width: 420px; padding: 0 30px; margin: 0 auto; box-sizing: border-box;}
/*
#top_layout{ width: 100%; position: absolute; top: 0; left: 0; z-index: 9999;}
#top_layout.fix{ position: fixed; top: -50.5px; transition: 500s all ease-in-out;}
#top_layout.fix.on{ top: 0; transition: 500s all ease-in-out;}
#top_layout.fix::before{ width: 100%; height: 100%; background-color: #fff; content: ""; opacity: 0.3; position: absolute; top: 0; left: 0; z-index: -1;}
*/
#top_layout{ width: 100%; position: fixed; top: 0; left: 0; z-index: 9999;}
#top_layout.fix::before{ width: 100%; height: 100%; background-color: #fff; content: ""; opacity: 0.6; position: absolute; top: 0; left: 0; z-index: -1;}
#top_layout.bg .gnb_bg,
#top_layout.fix.bg .gnb_bg{ width: 100%; height: 100%; background-color: #fff; display: inline-block; opacity: 0.7; position: fixed; top: 0; left: 0; z-index: 0;}
#top_layout .logo{ width: 95px; height: 23px; margin: 11.5px 0 11.5px 16px; display: inline-block;}
#top_layout .logo a{ width: 100%; height: 100%; background: url(/img/mo_ko/inc/logo.png) no-repeat center center; background-size: 100%; text-indent: -9999px;}
#top_layout .menu{ width: 22px; height: 22px; margin: 14.25px 16px 14.25px 0; float: right;}
#top_layout .menu a{ width: 100%; height: 100%; background: url(/img/mo_ko/inc/menu.png) no-repeat center center; background-size: 100%; text-indent: -9999px;}

#gnb_layout{ width: 292px; background-color: #fff; padding: 35.5px 0 0 0; box-sizing: border-box; position: fixed; top: 0; right: -292px; bottom: 0; z-index: 9999; transition: 0.5s all ease-in-out;}
#gnb_layout .scroll{ width: 100%; box-sizing: border-box; overflow-y: auto; position: absolute; top: 71px; bottom: 29.5px;}
#gnb_layout .gnb_top{ margin: 0 21px; overflow: hidden;}
#gnb_layout .gnb_top li{ margin-right: 13px; float: left; position: relative;}
#gnb_layout .gnb_top li:first-child::after{ width: 1px; height: 9px; background-color: #999; content: ""; margin-top: -3.5px; position: absolute; top: 50%; right: -8px;}
#gnb_layout .gnb_top li:nth-child(2){ margin-right: 20px;}
#gnb_layout .gnb_top li:last-child a,
#gnb_layout .gnb_top li.on a{ color: #000;}
#gnb_layout .gnb_top a{ font-weight: 500; font-size: 12px; color: #999; line-height: 18px;}
#gnb_layout .depth1_ul > li h2{ padding: 0 21px;}
#gnb_layout .depth1_ul > li h2 a{ background: url(/img/mo_ko/inc/more.png) no-repeat right center; background-size: 12.5px; font-weight: 500; font-size: 19px; color: #000; line-height: 3.03; padding: 0 5px; border-bottom: 1px solid #eee;}
#gnb_layout .depth1_ul > li.on h2 a{ background-image: url(/img/mo_ko/inc/more_up.png); border-bottom: 1px solid #eee;}
#gnb_layout .depth1_ul > li.on + li h2 a{  border-top: 1px solid #eee;}
#gnb_layout .depth1_ul > li.on .depth2_ul{ display: block;}
#gnb_layout .depth2_ul{ padding: 11px 0; display: none;}
#gnb_layout .depth2_ul > li > a{ font-weight: 400; font-size: 17px; color: #000; line-height: 1.2; padding: 8px 15px; margin: 0 21px;}
#gnb_layout .depth2_ul > li.on .depth3_ul{ display: block;}
#gnb_layout .depth2_ul > li.more > a{ background: url(/img/mo_ko/inc/more.png) no-repeat right center; background-size: 12.5px;}
#gnb_layout .depth2_ul > li.on > a{ background-image: url(/img/mo_ko/inc/more_up.png);}
#gnb_layout .depth3_ul{ background-color: #f5f5f5; padding: 15px 0; display: none;}
#gnb_layout .depth3_ul a{ font-weight: 400; font-size: 14px; line-height: 2.06; padding: 0 25px; margin: 0 21px;}
#gnb_layout .gnb_foot{ padding: 29.5px 21px 0 21px; margin-top: 50px; position: relative;}
#gnb_layout .gnb_foot::before{ width: 83.5px; height: 19.5px; background: url(/img/mo_ko/inc/gnb_foot_logo.png) no-repeat center center; background-size: 100% auto; content: ""; position: absolute; top: 0; left: 21px;}
#gnb_layout .gnb_foot ul{ overflow: hidden;}
#gnb_layout .gnb_foot ul li{ margin-right: 13.5px; float: left; position: relative;}
#gnb_layout .gnb_foot ul li + li::before{ width: 1px; height: 8px; background-color: #999; content: ""; margin-top: -3.5px; position: absolute; top: 50%; left: -6px;}
#gnb_layout .gnb_foot ul a{ font-weight: 500; font-size: 11px; color: #333; line-height: 15px;}
#gnb_layout .gnb_foot strong{ font-weight: 500; font-size: 12px; color: #000; line-height: 18px; margin-top: 18px; margin-bottom: 7px;}
#gnb_layout .gnb_foot .family a{ width: 250px; height: 72px; background: url(/img/mo_ko/inc/familysite.png) no-repeat center center; background-size: 100%; text-indent: -9999px;}
#gnb_layout.on{ right: 0; transition: 0.5s all ease-in-out;}
#gnb_layout.on .depth1_ul > li.off h2 a{ color: #999;}
#gnb_layout.on .depth1_ul > li.on h2 a{ color: #000;}
#gnb_layout.on .gnbClose{ width: 22px; height: 22px; background: url(/img/mo_ko/inc/close.png) no-repeat; background-size: 22px; text-indent: -9999px; position: fixed; top: 35px; right: 16px;}

#body_layout{ max-width: 420px; text-align: center; margin: 0 auto;}

#foot_layout{ padding-top: 70px; margin: 0 auto;}
#foot_layout .banner{ text-align: center;}
#foot_layout .banner strong{ font-family: 'oswald'; font-weight: 400; font-size: 21px; color: #000; line-height: 1; margin-top: 13px;}
#foot_layout .banner strong em{ font-size: 14px; color: #666; display: inline-block; vertical-align: middle;}
#foot_layout .banner strong .n1{ padding-right: 25px;}
#foot_layout .banner strong .n2{ padding-left: 50px;}
#foot_layout .banner .txt1{ font-weight: 300; font-size: 13px; color: #666; text-align: center; line-height: 1.38; letter-spacing: -0.54px; margin-top: 9px;}
#foot_layout .banner .txt2{ font-family: 'oswald'; font-weight: 300; font-size: 10px; color: #999; text-align: center; line-height: 1.5; letter-spacing: 0.1px; margin-top: 2px;}
#foot_layout .banner .txt2 .n1{ letter-spacing: 0.5px;}
#foot_layout .banner .txt2 .n2{ letter-spacing: 0.4px;}
#foot_layout .banner .txt3{ font-family: 'oswald'; font-weight: 400; font-size: 14px; color: #000; text-align: center; line-height: 1.4; letter-spacing: 0; margin-top: 4px;}
#foot_layout .banner .txt3 span{ font-weight: 600; display: inline-block;}
#foot_layout .newsletter{ width: 50%; height: 154px; background: url(/img/mo_ko/inc/foot_newsletter_bg.png) no-repeat center center; background-size: cover; text-align: center; display: table; float: left;}
#foot_layout .newsletter.type2{ background-image: url(/img/mo_ko/inc/foot_contact_bg.png);}
#foot_layout .newsletter .middle{ display: table-cell; vertical-align: middle;}
#foot_layout .newsletter strong{ font-family: 'oswald'; font-weight: 400; font-size: 21px; color: #fff; line-height: 1.4; letter-spacing: 0;}
#foot_layout .newsletter p{ font-weight: 300; font-size: 13px; color: #fff; line-height: 1.31; letter-spacing: 0; margin-top: 1px;}
#foot_layout .newsletter a{ width: 78px; background: url(/img/mo_ko/inc/foot_newsletter_icon.png) no-repeat 60px center; background-size: 8px auto; font-weight: 500; font-size: 10px; color: #fff; line-height: 24px; padding-right: 10px; margin-top: 11px; display: inline-block; border: 1px solid #fff;}
#foot_layout .foot_wrap{ background-color: #000; padding: 25px 33px 42px 33px; overflow: hidden;}
#foot_layout .foot_wrap::before{ width: 83.5px; height: 19.5px; background: url(/img/mo_ko/inc/foot_logo.png) no-repeat center center; background-size: 100% auto; content: ""; display: inline-block;}
#foot_layout .foot_wrap p{ font-weight: 400; font-size: 10px; color: #999; line-height: 1.4; letter-spacing: 0; margin-top: 15px;}
#foot_layout .foot_wrap p + p{ margin-top: 8px;}