div.inner_wrap { width: 320px; margin: 0 auto; }

header { position: fixed; width: 100%; height: 75px; z-index: 1000; background: #fff; }
header > div.util_menu { width: 100%; height: 25px; text-align: right; background-color: #ff844a; }
header > div.util_menu > div { float: right; }
header > div.util_menu > div.ico_call > p.img { padding-right: 10px; }
header > div.util_menu > div.ico_call > p.img > img { width: 19px; height: 19px; margin-top: 3px;}
header > div.util_menu > div.pn > p.txt { padding-rsight: 10px; padding-top: 4px; font-family: "NanumSquareEB"; font-size: 1.125em; color: #fff;  }
header > div.inner_wrap > div.logo_zone { float: left; width: 320px; padding-top: 5px; }
header > div.inner_wrap > div.logo_zone > h1 { float: left; }
header > div.inner_wrap > div.logo_zone > h1 > a.logo { display: block; width: 150px; height: 40px; margin-top: 5px; margin-left: 85px; background: url("../images/logo.png") no-repeat; background-size: 150px auto; text-indent: -99999em; }
header > div.inner_wrap > div.logo_zone > h1 > a.btn_toggle { display: block; width: 22px; height: 22px; background: url("../images/menu.png") no-repeat; background-size: 22px auto; text-indent: -99999em; margin-top: 12px; margin-left: 63px; }

header > div.inner_wrap > nav { display: block; position: fixed; left: 0; top: 75px; z-index: 100; width: 100vw; height: calc(100vh - 66px); border-top: 1px solid #4e3c20; background: rgba(0, 0, 0, 0.7); transform: translateX(100%); transition: transform 0.2s; }
header > div.inner_wrap > nav > ul { overflow: scroll; width: 80%; height: 100%; margin-left: 80px; background: #fff; }
header > div.inner_wrap > nav > ul > li { width: 100%; }
header > div.inner_wrap > nav > ul > li > a { display: block; width: 100%; padding: 15px 20px; font-family: 'NotoSansKR-Bold'; font-size: 18px; color: #333; background-image: url("../images/btn_nav_T_on.png"); background-repeat: no-repeat; background-size: 14px 8px; background-position: 91% center; }
header > div.inner_wrap > nav > ul > li > ul { display: none; width: 100%; background: #eee; }
header > div.inner_wrap > nav > ul > li > ul > li { width: 100%; }
header > div.inner_wrap > nav > ul > li > ul > li > a { display: block; width: 100%; padding: 15px 20px 15px 30px; font-size: 16px; color: #333; }

div.route  { position: relative; padding-top: 62px; background: #e5e5e5; color: #333; }
div.route > div.inner_wrap > p { padding-top: 28px; padding-bottom: 12px; font-size: 14px; color: #666; }
div.route > div.inner_wrap > p > a { padding: 0 5px; }

section { position: relative;  }
section > h4 { margin-top: 50px; font-size: 14px; font-family: "NanumSquareL"; color: #666; text-align: center; }
section > h2 { margin-top: 20px; font-size: 40px; font-family: "NanumSquareL"; color: #ff844a; text-align: center; letter-spacing: 5px; }

section > div.inner_wrap > div.chart { margin-top: 50px; width: 320px; border: 1px solid #ccc; }
section > div.inner_wrap > div.chart > ul > li { float: left; color: #666; font-size: 12px; }
section > div.inner_wrap > div.chart > ul > li > a > p { margin-left: 10px; }
section > div.inner_wrap > div.chart > ul:nth-child(1) { height: 50px; border-bottom: 1px solid #ccc; text-align: center; }
section > div.inner_wrap > div.chart > ul:nth-child(1) li > p { margin-top: 18px; }
section > div.inner_wrap > div.chart > ul:nth-child(2) { height: 90px; border-bottom: 1px solid #ccc;}
section > div.inner_wrap > div.chart > ul > li > a > p.txt { display: inline-block; }
section > div.inner_wrap > div.chart > ul:nth-child(2) > li > p { margin-top: 10px; margin-top: 40px; }
section > div.inner_wrap > div.chart > ul:nth-child(3) { height: 90px; border-bottom: 1px solid #ccc;}
section > div.inner_wrap > div.chart > ul:nth-child(3) > li > p { margin-top: 10px; margin-top: 40px; }
section > div.inner_wrap > div.chart > ul:nth-child(4) { height: 90px; border-bottom: 1px solid #ccc;}
section > div.inner_wrap > div.chart > ul:nth-child(4) > li > p { margin-top: 10px; margin-top: 40px; }
section > div.inner_wrap > div.chart > ul:nth-child(5) { height: 90px; border-bottom: 1px solid #ccc;}
section > div.inner_wrap > div.chart > ul:nth-child(5) > li > p { margin-top: 10px; margin-top: 40px; }
section > div.inner_wrap > div.chart > ul:nth-child(6) { height: 90px; border-bottom: none; }
section > div.inner_wrap > div.chart > ul:nth-child(6) > li > p { margin-top: 10px; margin-top: 40px; }
section > div.inner_wrap > div.chart > ul:nth-child(1) { height: 50px; }
section > div.inner_wrap > div.chart > ul:nth-child(2) > li { height: 90px;  border-right: 1px solid #ccc;}
section > div.inner_wrap > div.chart > ul:nth-child(3) > li { height: 90px;  border-right: 1px solid #ccc;}
section > div.inner_wrap > div.chart > ul:nth-child(4) > li { height: 90px;  border-right: 1px solid #ccc; }
section > div.inner_wrap > div.chart > ul:nth-child(5) > li { height: 90px;  border-right: 1px solid #ccc; }
section > div.inner_wrap > div.chart > ul:nth-child(6) > li { height: 90px;  border-right: 1px solid #ccc; }
section > div.inner_wrap > div.chart > ul:nth-child(1) > li { height: 50px; font-family: "NotoSansKR-Bold"; color: #fff; font-size: 14px; background: #ff844a; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc; }
section > div.inner_wrap > div.chart > ul > li:nth-child(1) { width: 50px; text-align: center; }
section > div.inner_wrap > div.chart > ul > li:nth-child(2) { width: 128px; }
section > div.inner_wrap > div.chart > ul > li:nth-child(2) > a > p { margin-top: 20px; }
section > div.inner_wrap > div.chart > ul > li:nth-child(3) { width: 80px; text-align: center; }
section > div.inner_wrap > div.chart > ul > li:nth-child(4) { width: 60px; text-align: center; border-right: none; }
section > div.inner_wrap > div.chart > ul > li > a > p > img { width: 10px; height: auto; }


section > div.inner_wrap > div.page { width: 320px; height: 50px; margin: 0 auto; padding-top: 100px; }
section > div.inner_wrap > div.page > a > div.write { float: right; width: 100px; height: 30px; margin-top: -70px; background: #ff844a; border: none; text-align: center; }
section > div.inner_wrap > div.page > a > div.write > p { color: #fff; font-family: "NotoSansKR-Bold"; font-size: 14px; padding-top: 8px; }

section > div.inner_wrap > div.page > ul { margin-left: 10px; }
section > div.inner_wrap > div.page > ul > li { float: left; width: 40px; height: 40px; margin-right: 5px; background: #fff; }
section > div.inner_wrap > div.page > ul > li > a > p { text-align: center;  font-family: "NotoSansKR-Regular"; font-size: 16px; color: #666 }
section > div.inner_wrap > div.page > ul > li:nth-child(7) { margin-right: 0; }
section > div.inner_wrap > div.page > ul > li.active > a > p { color: #ff844a; }
section > div.inner_wrap > div.page > ul > li > a > p { padding-top: 10px; }

footer { width: 100%; height: 210px; background-color: #333; }
footer > div.inner_wrap > div.info > div { float: left; }
footer > div.inner_wrap > div.info > div.txt { margin-top: 20px; font-family: "NanumSquareB"; }
footer > div.inner_wrap > div.info > div.txt > p.sub { padding-top: 5px; color: #69696a; font-size: 14px; }
footer > div.inner_wrap > div.info > div.logo { margin-top: 30px; }
footer > div.inner_wrap > div.info > div.logo > p > img { width: 100px; height: auto; }

}