/* -------------------------------- 

Primary style

-------------------------------- */
*, *::after, *::before { box-sizing: border-box; }
html { font-size: 62.5%; }
body { font-size: 1.6rem; letter-spacing: -0.024em; font-family: 'Noto Sans KR', sans-serif, "나눔고딕", 'Nanum Gothic', dotum, '돋움', gulim, '굴림', Tahoma; ; color: #232323; background-color: #ffffff; }

@media only screen and (max-width: 1169px) {
 body.nav-on-left.overflow-hidden { overflow: hidden; }
}
a { color: #2e3ca4; text-decoration: none; }
img { /* make images responsive */
 max-width: 100%; }
input { font-family: sans-serif; font-size: 1.6rem; }
input[type="search"]::-ms-clear {
 /* removes close icon - IE */
 display: none;
}
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration {
 display: none;
}
/* -------------------------------- 

Main components 

-------------------------------- */
.cd-main-content, .cd-main-header { /* Force Hardware Acceleration in WebKit */
 -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); will-change: transform; }
.cd-main-content, .cd-main-header { position: relative; -webkit-transition: -webkit-transform 0.3s; -moz-transition: -moz-transform 0.3s; transition: transform 0.3s; }

@media only screen and (max-width: 1169px) {
 .cd-main-content.nav-is-visible, .cd-main-header.nav-is-visible { -webkit-transform: translateX(-260px); -moz-transform: translateX(-260px); -ms-transform: translateX(-260px); -o-transform: translateX(-260px); transform: translateX(-260px); }
 .nav-on-left .cd-main-content.nav-is-visible, .nav-on-left .cd-main-header.nav-is-visible { -webkit-transform: translateX(260px); -moz-transform: translateX(260px); -ms-transform: translateX(260px); -o-transform: translateX(260px); transform: translateX(260px); }
}
.cd-main-content { min-height: 100vh; z-index: 2; }
.cd-main-header { height: 50px; background: #ffffff; z-index: 3; }
.nav-is-fixed .cd-main-header { /* add .nav-is-fixed class to body if you want a fixed navigation on > 1170px */
 position: fixed; top: 0; left: 0; width: 100%; }

@media only screen and (min-width: 1170px) {
 .cd-main-header { height: 80px; }
 .cd-main-header::after { clear: both; content: ""; display: table; }
}
.cd-logo { position: absolute; top: 14px; left: 5%; width: 96px; }
.cd-logo img { display: block; }

@media only screen and (max-width: 1169px) {
 .nav-on-left .cd-logo { left: auto; right: 5%; }
}

@media only screen and (min-width: 1170px) {
 .cd-logo { top: 26px; left: 4em; width: auto; }
}
.cd-header-buttons { position: absolute; display: inline-block; top: 3px; right: 5%; }
.cd-header-buttons li { display: inline-block; }

@media only screen and (max-width: 1169px) {
 .nav-on-left .cd-header-buttons { right: auto; left: 5%; }
 .nav-on-left .cd-header-buttons li { float: right; }
}

@media only screen and (min-width: 1170px) {
 .cd-header-buttons { top: 18px; right: 4em; }
}
.cd-search-trigger, .cd-nav-trigger { position: relative; display: block; width: 44px; height: 44px; overflow: hidden; white-space: nowrap; /* hide text */
 color: transparent; z-index: 3; }
.cd-search-trigger::before, .cd-search-trigger::after { /* search icon */
 content: ''; position: absolute; -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s; /* Force Hardware Acceleration in WebKit */
 -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.cd-search-trigger::before { /* lens */
 top: 11px; left: 11px; width: 18px; height: 18px; border-radius: 50%; border: 3px solid #2e3233; }
.cd-search-trigger::after { /* handle */
 height: 3px; width: 8px; background: #2e3233; bottom: 14px; right: 11px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
.cd-search-trigger span { /* container for the X icon */
 position: absolute; height: 100%; width: 100%; top: 0; left: 0; }
.cd-search-trigger span::before, .cd-search-trigger span::after { /* close icon */
 content: ''; position: absolute; display: inline-block; height: 3px; width: 22px; top: 50%; margin-top: -2px; left: 50%; margin-left: -11px; background: #2e3233; opacity: 0; /* Force Hardware Acceleration in WebKit */
 -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; -moz-transition: opacity 0.3s, -moz-transform 0.3s; transition: opacity 0.3s, transform 0.3s; }
.cd-search-trigger span::before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
.cd-search-trigger span::after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }
.cd-search-trigger.search-is-visible::before, .cd-search-trigger.search-is-visible::after { /* hide search icon */
 opacity: 0; }
.cd-search-trigger.search-is-visible span::before, .cd-search-trigger.search-is-visible span::after { /* show close icon */
 opacity: 1; }
.cd-search-trigger.search-is-visible span::before { -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); }
.cd-search-trigger.search-is-visible span::after { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
.cd-nav-trigger span, .cd-nav-trigger span::before, .cd-nav-trigger span::after { /* hamburger icon in CSS */
 position: absolute; display: inline-block; height: 3px; width: 24px; background: #2e3233; }
.cd-nav-trigger span { /* line in the center */
 position: absolute; top: 50%; right: 10px; margin-top: -2px; -webkit-transition: background 0.3s 0.3s; -moz-transition: background 0.3s 0.3s; transition: background 0.3s 0.3s; }
.cd-nav-trigger span::before, .cd-nav-trigger span::after { /* other 2 lines */
 content: ''; right: 0; /* Force Hardware Acceleration in WebKit */
 -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-origin: 0% 50%; -moz-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; -o-transform-origin: 0% 50%; transform-origin: 0% 50%; -webkit-transition: -webkit-transform 0.3s 0.3s; -moz-transition: -moz-transform 0.3s 0.3s; transition: transform 0.3s 0.3s; }
.cd-nav-trigger span::before { /* menu icon top line */
 top: -6px; }
.cd-nav-trigger span::after { /* menu icon bottom line */
 top: 6px; }
.cd-nav-trigger.nav-is-visible span { /* hide line in the center */
 background: rgba(46, 50, 51, 0); }
.cd-nav-trigger.nav-is-visible span::before, .cd-nav-trigger.nav-is-visible span::after { /* keep visible other 2 lines */
 background: #2e3233; }
.cd-nav-trigger.nav-is-visible span::before { -webkit-transform: translateX(4px) translateY(-3px) rotate(45deg); -moz-transform: translateX(4px) translateY(-3px) rotate(45deg); -ms-transform: translateX(4px) translateY(-3px) rotate(45deg); -o-transform: translateX(4px) translateY(-3px) rotate(45deg); transform: translateX(4px) translateY(-3px) rotate(45deg); }
.cd-nav-trigger.nav-is-visible span::after { -webkit-transform: translateX(4px) translateY(2px) rotate(-45deg); -moz-transform: translateX(4px) translateY(2px) rotate(-45deg); -ms-transform: translateX(4px) translateY(2px) rotate(-45deg); -o-transform: translateX(4px) translateY(2px) rotate(-45deg); transform: translateX(4px) translateY(2px) rotate(-45deg); }

@media only screen and (min-width: 1170px) {
 .cd-nav-trigger { display: none; }
}
.cd-primary-nav, .cd-primary-nav ul { position: fixed; top: 0; right: 0; height: 100%; width: 260px; background: #2e3233; overflow: auto; -webkit-overflow-scrolling: touch; z-index: 1; /* Force Hardware Acceleration in WebKit */
 -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); -webkit-transition: -webkit-transform 0.3s; -moz-transition: -moz-transform 0.3s; transition: transform 0.3s; }
.cd-primary-nav a, .cd-primary-nav ul a { display: block; height: 50px; line-height: 50px; padding: 0 40px; color: #ffffff; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-bottom: 1px solid #3a3f40; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); will-change: transform, opacity; -webkit-transition: -webkit-transform 0.3s, opacity 0.3s; -moz-transition: -moz-transform 0.3s, opacity 0.3s; transition: transform 0.3s, opacity 0.3s; }
.cd-primary-nav.is-hidden, .cd-primary-nav ul.is-hidden { /* secondary navigations hidden by default */
 -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); }
.cd-primary-nav.moves-out > li > a, .cd-primary-nav ul.moves-out > li > a { /* push the navigation items to the left - and lower down opacity - when secondary nav slides in */
 -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -o-transform: translateX(-100%); transform: translateX(-100%); opacity: 0; }

@media only screen and (max-width: 1169px) {
 .nav-on-left .cd-primary-nav, .nav-on-left .cd-primary-nav ul { right: auto; left: 0; }
}
.cd-primary-nav .see-all a { /* different style for the See all button on mobile and tablet */
 color: #69aa6f; }
.cd-primary-nav .cd-nav-gallery .cd-nav-item, .cd-primary-nav .cd-nav-icons .cd-nav-item { /* items with picture (or icon) and title */
 height: 80px; line-height: 80px; }
.cd-primary-nav .cd-nav-gallery .cd-nav-item h3, .cd-primary-nav .cd-nav-icons .cd-nav-item h3 { overflow: hidden; text-overflow: ellipsis; }
.cd-primary-nav .cd-nav-gallery .cd-nav-item { padding-left: 90px; }
.cd-primary-nav .cd-nav-gallery .cd-nav-item img { position: absolute; display: block; height: 40px; width: auto; left: 20px; top: 50%; margin-top: -20px; }
.cd-primary-nav .cd-nav-icons .cd-nav-item { padding-left: 75px; }
.cd-primary-nav .cd-nav-icons .cd-nav-item p { color: #2e3233; font-size: 1.3rem; /* hide description on small devices */
 display: none; }
.cd-primary-nav .cd-nav-icons .cd-nav-item::before { /* item icon */
 content: ''; display: block; position: absolute; left: 20px; top: 50%; margin-top: -20px; width: 40px; height: 40px; background-repeat: no-repeat; background-position: center center; background-size: 40px 40px; }
.cd-primary-nav .cd-nav-icons .cd-nav-item.item-1::before { background-image: url("/img/web/line-icon-1.svg"); }
.cd-primary-nav .cd-nav-icons .cd-nav-item.item-2::before { background-image: url("/img/web/line-icon-2.svg"); }
.cd-primary-nav .cd-nav-icons .cd-nav-item.item-3::before { background-image: url("/img/web/line-icon-3.svg"); }
.cd-primary-nav .cd-nav-icons .cd-nav-item.item-4::before { background-image: url("/img/web/line-icon-4.svg"); }
.cd-primary-nav .cd-nav-icons .cd-nav-item.item-5::before { background-image: url("/img/web/line-icon-5.svg"); }
.cd-primary-nav .cd-nav-icons .cd-nav-item.item-6::before { background-image: url("/img/web/line-icon-6.svg"); }
.cd-primary-nav .cd-nav-icons .cd-nav-item.item-7::before { background-image: url("/img/web/line-icon-7.svg"); }
.cd-primary-nav .cd-nav-icons .cd-nav-item.item-8::before { background-image: url("/img/web/line-icon-8.svg"); }

@media only screen and (max-width: 1169px) {
 .cd-primary-nav { /* by default .cd-primary-nav is hidden - trick for iOS devices where you can see the navigation if you pull down */
  visibility: hidden; -webkit-transition: visibility 0s 0.3s; -moz-transition: visibility 0s 0.3s; transition: visibility 0s 0.3s; }
 .cd-primary-nav.nav-is-visible { visibility: visible; -webkit-transition: visibility 0s 0s; -moz-transition: visibility 0s 0s; transition: visibility 0s 0s; }
}

@media only screen and (min-width: 1170px) {
 .cd-primary-nav { position: static; padding: 0 40px 0 0; height: auto; width: auto; float: right; overflow: visible; background: transparent; }
 .cd-primary-nav::after { clear: both; content: ""; display: table; }
 .cd-primary-nav.moves-out > li > a { /* reset mobile style */
  -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); opacity: 1; }
 .cd-primary-nav ul { position: static; height: auto; width: auto; background: transparent; overflow: visible; z-index: 3; }
 .cd-primary-nav ul.is-hidden { /* reset mobile style */
  -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }
 .cd-primary-nav ul.moves-out > li > a { /* reset mobile style */
  -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); opacity: 1; }
 .cd-primary-nav > li { float: left; margin-left: 20px; }
 .cd-primary-nav > li > a { /* main navigation buttons style */
  position: relative; display: inline-block; height: 80px; line-height: 80px; font-size: 16px; font-weight: 800; padding: 0 10px; color: #2e3233; overflow: visible; border-bottom: none; -webkit-transition: color 0.3s, box-shadow 0.3s; -moz-transition: color 0.3s, box-shadow 0.3s; transition: color 0.3s, box-shadow 0.3s; }
 .cd-primary-nav > li > a:hover { color: #252D69; }
 .cd-primary-nav > li > a.selected { color: #252D69; box-shadow: inset 0 -2px 0 #252D69; }
 .cd-primary-nav .go-back, .cd-primary-nav .see-all { display: none!important; }
 .cd-primary-nav .cd-secondary-nav, .cd-primary-nav .cd-nav-gallery, .cd-primary-nav .cd-nav-icons { /* dropdown menu style */
  position: absolute; top: 80px; width: 100vw; background: #ffffff; padding: 20px 64px; box-shadow: inset 0 1px 0 #e2e3df, 0 3px 6px rgba(0, 0, 0, 0.05); -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); -webkit-transition: opacity .3s 0s, visibility 0s 0s; -moz-transition: opacity .3s 0s, visibility 0s 0s; transition: opacity .3s 0s, visibility 0s 0s; }
 .cd-primary-nav .cd-secondary-nav::after, .cd-primary-nav .cd-nav-gallery::after, .cd-primary-nav .cd-nav-icons::after { clear: both; content: ""; display: table; }
 .cd-primary-nav .cd-secondary-nav.is-hidden, .cd-primary-nav .cd-nav-gallery.is-hidden, .cd-primary-nav .cd-nav-icons.is-hidden { opacity: 0; visibility: hidden; -webkit-transition: opacity .3s 0s, visibility 0s .3s; -moz-transition: opacity .3s 0s, visibility 0s .3s; transition: opacity .3s 0s, visibility 0s .3s; }
 .cd-primary-nav .cd-secondary-nav > .see-all, .cd-primary-nav .cd-nav-gallery > .see-all, .cd-primary-nav .cd-nav-icons > .see-all { /* this is the BIG See all button at the bottom of the dropdown menu */
  display: block; position: absolute; left: 0; bottom: 0; height: 80px; width: 100%; overflow: hidden; /* reset some inherited style */
  margin: 0; padding: 0; }
 .cd-primary-nav .cd-secondary-nav > .see-all a, .cd-primary-nav .cd-nav-gallery > .see-all a, .cd-primary-nav .cd-nav-icons > .see-all a { position: absolute; width: 100%; height: 100%; top: 0; left: 0; font-size: 2.2rem; font-weight: bold; text-align: center; line-height: 80px; border-top: 1px solid #e2e3df; /* reset some inherited style */
  border-bottom: none; margin: 0; padding: 0; -webkit-transition: color 0.2s, background 0.2s, border 0.2s; -moz-transition: color 0.2s, background 0.2s, border 0.2s; transition: color 0.2s, background 0.2s, border 0.2s; }
 .cd-primary-nav .cd-secondary-nav > .see-all a:hover, .cd-primary-nav .cd-nav-gallery > .see-all a:hover, .cd-primary-nav .cd-nav-icons > .see-all a:hover { background: #2e3233; border-color: #2e3233; color: #ffffff; }
 .cd-primary-nav .cd-secondary-nav > li { /* change the height according to your needs - you can even set height: auto */
  /* here you set the number of columns - use width percentage */
  width: 1%; display: table-cell; margin-right: 2.66%; overflow: hidden; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; }
 .cd-primary-nav .cd-secondary-nav > li:nth-child(4n+2) { /* +2 because we have 2 list items with display:none */
  margin-right: 0; border-right: none; }
 .cd-primary-nav .cd-secondary-nav > li > a { /* secondary nav title */
  color: #252D69; font-weight: 500; font-size: 1.6rem; text-align: center; }
 .cd-primary-nav .cd-secondary-nav a { height: 30px; line-height: 30px; padding: 0 0 0 0; color: #2e3233; border-bottom: none; font-size: 1.4rem; }
 .cd-primary-nav .cd-secondary-nav a:hover { color: #2e3ca4; }
 .cd-primary-nav .cd-secondary-nav ul { /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); }
 .cd-primary-nav .cd-secondary-nav ul ul { /* tertiary navigation */
  position: absolute; top: 0; left: 0; height: 100%; width: 100%; }
 .cd-primary-nav .cd-secondary-nav ul ul.is-hidden { -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); }
 .cd-primary-nav .cd-secondary-nav ul ul .go-back { display: block; }
 .cd-primary-nav .cd-secondary-nav ul ul .go-back a { color: transparent; }
 .cd-primary-nav .cd-secondary-nav ul ul .see-all { display: block; }
 .cd-primary-nav .cd-secondary-nav .moves-out > li > a { /* push the navigation items to the left - and lower down opacity - when tertiary nav slides in */
  -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -o-transform: translateX(-100%); transform: translateX(-100%); }
 .cd-primary-nav .cd-nav-gallery li { /* set here number of columns - use width percentage */
  width: 22%; float: left; margin: 0 4% 40px 0; }
 .cd-primary-nav .cd-nav-gallery li:nth-child(4n+2) { /* +2 because we have two additional list items with display:none */
  margin-right: 0; }
 .cd-primary-nav .cd-nav-gallery .cd-nav-item { border-bottom: none; padding: 0; height: auto; line-height: 1.2; }
 .cd-primary-nav .cd-nav-gallery .cd-nav-item img { position: static; margin-top: 0; height: auto; width: 100%; margin-bottom: .6em; }
 .cd-primary-nav .cd-nav-gallery .cd-nav-item h3 { color: #2e3ca4; font-weight: bold; padding: 0 .4em; }
 .cd-primary-nav .cd-nav-icons li { /* set here number of columns - use width percentage */
  width: 32%; float: left; margin: 0 2% 20px 0; }
 .cd-primary-nav .cd-nav-icons li:nth-child(3n+2) { /* +2 because we have two additional list items with display:none */
  margin-right: 0; }
 .cd-primary-nav .cd-nav-icons .cd-nav-item { border-bottom: none; height: 80px; line-height: 1.2; padding: 24px 0 0 85px; position: relative; }
 .cd-primary-nav .cd-nav-icons .cd-nav-item:hover { background: #f6f6f5; }
 .cd-primary-nav .cd-nav-icons .cd-nav-item h3 { color: #2e3ca4; font-weight: bold; }
 .cd-primary-nav .cd-nav-icons .cd-nav-item p { display: block; }
 .cd-primary-nav .cd-nav-icons .cd-nav-item::before { left: 25px; }
}
.has-children > a, .go-back a { position: relative; }
.has-children > a::before, .has-children > a::after, .go-back a::before, .go-back a::after { /* arrow icon in CSS - for element with nested unordered lists */
 content: ''; position: absolute; top: 50%; margin-top: -1px; display: inline-block; height: 2px; width: 10px; background: #464c4e; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.has-children > a::before, .go-back a::before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
.has-children > a::after, .go-back a::after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }

@media only screen and (min-width: 1170px) {
 .has-children > a::before, .has-children > a::after, .go-back a::before, .go-back a::after { background: #c9cbc4; }
 .has-children > a:hover::before, .has-children > a:hover::after, .go-back a:hover::before, .go-back a:hover::after { background: #2e3ca4; }
}
.has-children > a { padding-right: 40px; }
.has-children > a::before, .has-children > a::after { /* arrow goes on the right side - children navigation */
 right: 20px; -webkit-transform-origin: 9px 50%; -moz-transform-origin: 9px 50%; -ms-transform-origin: 9px 50%; -o-transform-origin: 9px 50%; transform-origin: 9px 50%; }
.cd-primary-nav .go-back a { padding-left: 40px; background-color: #000; }
.cd-primary-nav .go-back a::before, .cd-primary-nav .go-back a::after { /* arrow goes on the left side - go back button */
 left: 20px; -webkit-transform-origin: 1px 50%; -moz-transform-origin: 1px 50%; -ms-transform-origin: 1px 50%; -o-transform-origin: 1px 50%; transform-origin: 1px 50%; }

@media only screen and (min-width: 1170px) {
 .has-children > a::before, .has-children > a::after { right: 15%; }
 .cd-primary-nav > .has-children > a { /* main navigation arrows on larger devices */
  padding-right: 30px !important; }
 .cd-primary-nav > .has-children > a::before, .cd-primary-nav > .has-children > a::after { width: 9px; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; background: #c9cbc4; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: width 0.3s, -webkit-transform 0.3s; -moz-transition: width 0.3s, -moz-transform 0.3s; transition: width 0.3s, transform 0.3s; }
 .cd-primary-nav > .has-children > a::before { right: 12px; }
 .cd-primary-nav > .has-children > a::after { right: 7px; }
 .cd-primary-nav > .has-children > a.selected::before, .cd-primary-nav > .has-children > a.selected::after { width: 14px; }
 .cd-primary-nav > .has-children > a.selected::before { -webkit-transform: translateX(5px) rotate(-45deg); -moz-transform: translateX(5px) rotate(-45deg); -ms-transform: translateX(5px) rotate(-45deg); -o-transform: translateX(5px) rotate(-45deg); transform: translateX(5px) rotate(-45deg); }
 .cd-primary-nav > .has-children > a.selected::after { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
 .cd-secondary-nav > .has-children > a::before, .cd-secondary-nav > .has-children > a::after { /* remove arrows on secondary nav titles */
  display: none; }
 .cd-primary-nav .go-back a { padding-left: 20px; }
 .cd-primary-nav .go-back a::before, .cd-primary-nav .go-back a::after { left: 1px; }
}
.cd-search { position: absolute; height: 50px; width: 100%; top: 50px; left: 0; z-index: 3; opacity: 0; visibility: hidden; -webkit-transition: opacity .3s 0s, visibility 0s .3s; -moz-transition: opacity .3s 0s, visibility 0s .3s; transition: opacity .3s 0s, visibility 0s .3s; }
.cd-search form { height: 100%; width: 100%; }
.cd-search input { border-radius: 0; border: none; background: #ffffff; height: 100%; width: 100%; padding: 0 5%; box-shadow: inset 0 1px 0 #e2e3df, 0 3px 6px rgba(0, 0, 0, 0.05); -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; }
.cd-search input::-webkit-input-placeholder {
 color: #c9cbc4;
}
.cd-search input::-moz-placeholder {
 color: #c9cbc4;
}
.cd-search input:-moz-placeholder {
 color: #c9cbc4;
}
.cd-search input:-ms-input-placeholder {
 color: #c9cbc4;
}
.cd-search input:focus { outline: none; }
.cd-search.is-visible { opacity: 1; visibility: visible; -webkit-transition: opacity .3s 0s, visibility 0s 0s; -moz-transition: opacity .3s 0s, visibility 0s 0s; transition: opacity .3s 0s, visibility 0s 0s; }
.nav-is-fixed .cd-search { position: fixed; }

@media only screen and (min-width: 1170px) {
 .cd-search { height: 120px; top: 80px; }
 .cd-search input { padding: 0 2em; font-size: 3.2rem; font-weight: 300; }
}
.cd-overlay { /* shadow layer visible when navigation is active */
 position: fixed; z-index: 2; height: 100%; width: 100%; top: 0; left: 0; cursor: pointer; background-color: rgba(37, 45, 105, 0.8); visibility: hidden; opacity: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s, -webkit-transform 0.3s 0s; -moz-transition: opacity 0.3s 0s, visibility 0s 0.3s, -moz-transform 0.3s 0s; transition: opacity 0.3s 0s, visibility 0s 0.3s, transform 0.3s 0s; }
.cd-overlay.is-visible { opacity: 1; visibility: visible; -webkit-transition: opacity 0.3s 0s, visibility 0s 0s, -webkit-transform 0.3s 0s; -moz-transition: opacity 0.3s 0s, visibility 0s 0s, -moz-transform 0.3s 0s; transition: opacity 0.3s 0s, visibility 0s 0s, transform 0.3s 0s; }

@media only screen and (max-width: 1169px) {
 .cd-overlay.is-visible { -webkit-transform: translateX(-260px); -moz-transform: translateX(-260px); -ms-transform: translateX(-260px); -o-transform: translateX(-260px); transform: translateX(-260px); }
 .nav-on-left .cd-overlay.is-visible { -webkit-transform: translateX(260px); -moz-transform: translateX(260px); -ms-transform: translateX(260px); -o-transform: translateX(260px); transform: translateX(260px); }
 .cd-overlay.is-visible.search-is-visible, .nav-on-left .cd-overlay.is-visible.search-is-visible { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }
}
/* -------------------------------- 

support for no js 

-------------------------------- */
.no-js .cd-primary-nav { position: relative; height: auto; width: 100%; overflow: visible; visibility: visible; z-index: 2; }
.no-js .cd-search { position: relative; top: 0; opacity: 1; visibility: visible; }

@media only screen and (min-width: 1170px) {
 .no-js .cd-primary-nav { position: absolute; z-index: 3; display: inline-block; width: auto; top: 0; right: 150px; padding: 0; }
 .no-js .nav-is-fixed .cd-primary-nav { position: fixed; }
}

/* -------------------------------- 

main 

-------------------------------- */
.system-01, .system-02, .system-03, .system-04 { position: relative; }
.system-01 h3, .system-02 h3, .system-03 h3 { position: absolute; text-align: center; width: 100%; margin: 0 auto; top: 30%; font-size: 24px; color: #fff; }
.system-01 p, .system-02 p, .system-03 p { position: absolute; text-align: center; width: 100%; margin: 0 auto; top: 46%; font-size: 14px; color: #fff; font-weight: 300;  }
.system-01 p strong, .system-02 p strong, .system-03 p strong { display: block; font-weight: 500; margin-top: 10px; }
.system-04 h3 { position: absolute; text-align: center; width: 100%; margin: 0 auto; top: 15%; font-size: 20px; line-height: 26px; color: #fff; }
.system-04 h3 br { display: block; }
.system-04 p span { margin-top: 5px; display: inline-block; border-radius: 40px; border:solid 1px #970000; padding: 5px 15px 10px; font-weight: 500; background-color: #d50000;}
.system-04 p br { display: block; }
.system-04 p { position: absolute; text-align: center; width: 100%; margin: 0 auto; top: 44%; font-size: 14px; color: #fff; font-weight: 300;  }
.system-04 p strong { display: block; font-weight: 500; margin-top: 10px; }
.banner { background-color: #232323;/* height: 100px; */text-align: center; margin: auto;} /*hm*/
.banner-01, .banner-02, .banner-03 { position: relative; }
.banner-01 img, .banner-02 img, .banner-03 img { width: auto!important;/* margin-top: 15px;*/ } /*hm*/
.main .section { padding: 30px 0; min-height: 300px; } /*hm*/
.main .section h3 { font-size: 18px; line-height: 30px; margin-bottom: 10px; color: #000; font-weight: 700; text-align: center; }
.main .section h3 span { font-weight: 300;}
.main .section h4 { font-size: 18px; font-weight: 500; margin-bottom: 20px; }
.main .section p { line-height: 21px; font-size: 16px; }
.main .mainbg-02 { background: #f7f7f7; }
.main .mainbg-02 ul { margin-top: 30px; }
.main .mainbg-02 ul li { position: relative; font-size: 14px; line-height: 20px; margin: 5px 1%; width: 46%; display: inline-block; vertical-align: top; padding: 5px; }
.main .mainbg-02 ul li .point5 { font-size: 20px; }
.main .mainbg-02 ul li div strong { font-weight: 500; color:#000; }
.main .mainbg-02 p { text-align: center; font-size: 16px; margin: 30px 0 0; font-weight: 500; color: #ff470a; padding: 0 26px; }
.main .mainbg-03 { background: #99918E url(/img/web/main_section3_bg.jpg) center 50px no-repeat; background-size: cover; }
.main .mainbg-03 h3 { text-align: left!important; color: #000!important; }
.main .mainbg-03 p { color: #000; font-size: 14px; margin-bottom: 10px; line-height: 24px; }
.main .mainbg-04 { overflow: hidden; background: #f7f7f7; }
.main .mainbg-04 .left-area { float: left; width: 100%; vertical-align: top; }
.main .mainbg-04 .left-area .thum-01, .main .mainbg-04 .right-area .thum-01 { margin: 20px 0 0; }
.main .mainbg-04 .left-area .thum-01 img { border: solid 1px #e1e1e1; padding: 10px; }
.main .mainbg-04 .right-area .thum-01 img { }
.main .mainbg-04 .right-area { float: right; width: 100%; vertical-align: top; }
.main .mainbg-04 .left-area p, .main .mainbg-04 .right-area p { font-size: 14px; line-height: 24px!important; width: 90%; margin: 0 auto; text-align: center; word-break: keep-all; }
.main .mainbg-04 .left-area p strong, .main .mainbg-04 .right-area p strong { font-size: 16px; font-weight: 500; color: #ff470a; }
.main .mainbg-04 h4 { line-height: 26px; }
.main .mainbg-05 { background: #252D69 url(/img/web/main_section5_bg.jpg) center no-repeat; background-size: cover; }
.main .mainbg-05 h3 { color: #fff!important; }
.main .mainbg-05 ul { margin-top: 30px; }
.main .mainbg-05 ul li { width: 48%; font-size: 18px; line-height: 30px; margin: 5px 0; display: inline-block; vertical-align: top; padding:0 20px 0 20px; color: #fff; }
.main .mainbg-05 ul li div { width: 100%; text-align: center; }
.main .mainbg-05 ul li div span { display: block; line-height: 24px; font-size: 14px; }
.main .mainbg-05 ul li div strong { font-weight: 500; font-size: 14px; }
.main .mainbg-05 p.text { margin-top: 20px; text-align: center; font-size: 16px!important; line-height: 34px!important; color: #fff; }
.main .mainbg-05 .btn-wrap { text-align: center; margin-top: 20px; }
.main .mainbg-06 { background: #f7f7f7; overflow: hidden; }
.main .mainbg-06 h3 { font-weight: 300!important; text-align: left!important; font-size: 18px!important; line-height: 24px!important; text-align: center!important;}
.main .mainbg-06 h3 strong { font-weight: 700; }
.main .mainbg-06 .left-area { float: left; width: 100%; padding-top: 20px; }
.main .mainbg-06 .right-area { float: right; width: 100%; }
.main .mainbg-06 .right-area span { display: inline-block; background-color: #ff470a; color: #fff; text-align: center; line-height: 30px; font-size: 18px; width: 30px; height: 30px; border-radius: 15px; margin-right: 10px; }
.main .mainbg-06 .right-area h3 { font-size: 16px!important; margin: 30px 0 10px; line-height: 30px!important; text-align: left!important; }
.main .mainbg-06 .right-area li { line-height: 21px; list-style: outside circle; margin-left: 60px; }
.main .mainbg-07 { background: url(/img/web/main_section7_bg.jpg) center no-repeat; background-size: cover; }
.main .mainbg-07 h3 { text-align: left!important; }
.main .mainbg-07 p { text-align: left!important; font-size: 14px; line-height: 26px; width: 90%; }
.main .mainbg-07 span { display: block; margin-top: 30px;}
.main .mainbg-08 { background: url(/img/web/main_section8_bg.jpg) center no-repeat; background-size: cover; }
.main .mainbg-08 h3 { text-align: right!important; color: #fff!important; }
.main .mainbg-08 p { text-align: right!important; color: #fff!important; font-size: 16px; }
.main .mainbg-08 ul { margin-top: 30px;}
.main .mainbg-08 ul li { text-align: right; color: #fff; font-size: 14px; margin: 8px 0; }
.main .mainbg-08 .btn-wrap { text-align: right; margin-top: 20px; }
.main .mainbg-09 { text-align: center; padding: 50px 25px; }
.main .mainbg-09 h3 { font-size: 24px; line-height: 30px; word-break: keep-all; }
.main .mainbg-09 strong { color: #283594; }
.quickMenu {}
.quickMenu h4 {}

@media only screen and (min-width: 1170px) {
 .main .section { padding: 80px 0 100px; }
 .system-01 h3, .system-02 h3, .system-03 h3 { top: 30%; font-size: 70px; color: #fff; }
 .system-01 p, .system-02 p, .system-03 p { top: 46%; font-size: 34px; color: #fff; font-weight: 300; }
 .system-01 p strong, .system-02 p strong, .system-03 p strong { margin-top: 20px; }
 .system-04 h3 { top: 25%; font-size: 50px; color: #fff; line-height: 60px; }
 .system-04 p { top: 46%; font-size: 34px; color: #fff; font-weight: 300; }
 .system-04 p strong { margin-top: 20px; }
 .system-04 p span { margin-top: 20px; display: inline-block; border-radius: 40px; border:solid 1px #970000; padding: 10px 30px 15px; font-weight: 500; background-color: #d50000;}
 .main .section { padding: 100px 0; min-height: 500px; }
 .main .section h3 { font-size: 24px; line-height: 30px; margin-bottom: 30px; color: #000; font-weight: 700; text-align: center; }
 .main .section h3 { font-size: 40px; line-height: 60px; }
 .main .mainbg-02 ul { margin-top: 30px; }
 .main .mainbg-02 ul li { font-size: 16px; line-height: 24px; margin: 10px 1%; width: 22%; display: inline-block; vertical-align: top; padding: 20px; }
 .main .mainbg-02 p { text-align: center; font-size: 24px; margin: 50px 0 0; padding: 0; }
 .main .mainbg-03 { background: #f7f7f7 url(/img/web/main_section3_bg.jpg) no-repeat; background-size: cover; }
 .main .mainbg-03 h3 { text-align: left!important; color: #000!important; }
 .main .mainbg-03 p { color: #000; font-size: 20px; margin-bottom: 10px; line-height: 28px; }
 .main .mainbg-04 { overflow: hidden; }
 .main .mainbg-04 .left-area { float: left; width: 500px; vertical-align: top; }
 .main .mainbg-04 .left-area .thum-01 { margin: 20px 0; }
 .main .mainbg-04 .left-area .thum-01 img { border: solid 1px #e1e1e1; padding: 10px; height: 190px; }
 .main .mainbg-04 .right-area .thum-01 img { height: 250px; }
 .main .mainbg-04 .right-area { float: right; width: 600px; vertical-align: top; }
 .main .mainbg-04 .left-area p, .main .mainbg-04 .right-area p { width: 100%; text-align: left; }
 .main .mainbg-04 .left-area p { font-size: 16px; line-height: 30px!important; }
 .main .mainbg-04 .left-area p strong { font-size: 20px; font-weight: 500; color: #ff470a; }
 .main .mainbg-04 .left-area p strong, .main .mainbg-04 .right-area p strong { font-size: 20px; font-weight: 500; color: #ff470a; line-height: 30px!important; }
 .main .mainbg-04 .right-area .thum-01 img { height: 250px; }
 .main .mainbg-05 { background: #252D69 url(/img/web/main_section5_bg.jpg) center no-repeat; }
 .main .mainbg-05 h3 { color: #fff!important; }
 .main .mainbg-05 ul { margin-top: 30px; }
 .main .mainbg-05 ul li { width: inherit; font-size: 18px; line-height: 30px; margin: 10px 1%; display: inline-block; vertical-align: top; padding: 20px; color: #fff; }
 .main .mainbg-05 ul li div { width: 160px; text-align: center; }
 .main .mainbg-05 ul li div span { display: block; line-height: 24px; font-size: 16px; }
 .main .mainbg-05 ul li div strong { font-weight: 500; font-size: 18px; }
 .main .mainbg-05 p.text { margin-top: 50px; text-align: center; font-size: 21px!important; line-height: 34px!important; color: #fff; }
 .main .mainbg-05 .btn-wrap { text-align: center; margin-top: 20px; }
 .main .mainbg-06 { background: #f7f7f7; overflow: hidden; }
 .main .mainbg-06 h3 { font-weight: 300!important; text-align: left!important; font-size: 30px!important; line-height: 40px!important; text-align: center!important;}
 .main .mainbg-06 h3 strong { font-weight: 700; }
 .main .mainbg-06 .left-area { float: left; width: 550px; padding-top: 20px; }
 .main .mainbg-06 .right-area { float: right; width: 550px }
 .main .mainbg-06 .right-area span { display: inline-block; background-color: #ff470a; color: #fff; text-align: center; line-height: 30px; font-size: 18px; width: 30px; height: 30px; border-radius: 15px; margin-right: 10px; }
 .main .mainbg-06 .right-area h3 { font-size: 18px!important; margin: 30px 0 10px; line-height: 30px!important; text-align: left!important; }
 .main .mainbg-06 .right-area li { line-height: 21px; list-style: outside circle; margin-left: 60px; }
 .main .mainbg-07 { background: url(/img/web/main_section7_bg.jpg) center no-repeat; height: 650px; }
 .main .mainbg-07 p { font-size: 18px; line-height: 30px; }
 .main .mainbg-08 { background: url(/img/web/main_section8_bg.jpg) center no-repeat; height: 650px; background-size: cover; }
 .main .mainbg-08 h3 { text-align: right!important; color: #fff!important; }
 .main .mainbg-08 p { text-align: right!important; color: #fff!important; font-size: 24px; }
 .main .mainbg-08 ul { margin-top: 50px;}
 .main .mainbg-08 ul li { text-align: right; color: #fff; font-size: 18px; margin: 10px 0; }
 .main .mainbg-09 h3 { font-size: 34px; padding: 60px 0; line-hegith: 38px; }
 .banner { height: 240px; }
 .banner-01 img, .banner-02 img, .banner-03 img { width: auto!important; margin-top: 0; }
}
/* -------------------------------- 

sub content 

-------------------------------- */
.content { width: 94%; margin: 0 auto; position: relative;/* height: 100%;*/ font-size: 14px; font-weight: 300; }
.content h2 { margin: -85px 0 50px 0; font-size: 34px; font-weight: 700; color: #000; font-family: "Roboto", sans-serif; }
.visual-wrap {  width: 100%; height: 160px; background-size: 100%!important; }
.Overview { background: #888 url(/img/web/company_visual_01.jpg) 100% no-repeat; }
.Introduction { background: #888 url(/img/web/company_visual_02.jpg) 100% no-repeat; }
.History { background: #888 url(/img/web/company_visual_03.jpg) 100% no-repeat; }
.Directions { background: #888 url(/img/web/company_visual_04.jpg) 100% no-repeat; }
.patent { background: #888 url(/img/web/company_visual_05.jpg) 100% no-repeat; }
.aveccarer { background: #888 url(/img/web/product_visual_01.jpg) 100% no-repeat; }
.design { background: #888 url(/img/web/product_visual_02.jpg) no-repeat; }
.spec { background: #888 url(/img/web/product_visual_03.jpg) no-repeat; }
.Notice { background: #888 url(/img/web/pr_visual_01.jpg) 100% no-repeat; }
.News { background: #888 url(/img/web/pr_visual_02.jpg) 100% no-repeat; }
.Video { background: #888 url(/img/web/pr_visual_03.jpg) 100% no-repeat; }
.Event { background: #888 url(/img/web/pr_visual_04.jpg) 100% no-repeat; }
.manual { background: #888 url(/img/web/customer_visual_01.jpg) 100% no-repeat; }
.faq { background: #888 url(/img/web/customer_visual_02.jpg) 100% no-repeat; }
.comingsoon { width: 100%; height: 100vh; background-size: 100%!important; background: #888 url(/img/web/comingsoon.jpg) 100% no-repeat; }
.comingsoon h3 { padding-top: 150px; text-align: center; font-size: 40px; }
.comingsoon p { text-align: center; font-size: 14px; margin-top: 10px; }
.avec .section, .product .section, .pr .section, .customer .section { position: relative; width: 100%; min-height: auto; margin: 0 auto; display: block; clear: both; padding: 30px 0; }
.avec .section h3, .product .section h3, .pr .section h3, .customer .section h3 { font-size: 20px; line-height: 30px; margin-bottom: 30px; color: #000; font-weight: 700; }
.avec .section h4, .product .section h4, .pr .section h4, .customer .section h4 { font-size: 16px; font-weight: 500; margin-bottom: 20px; }
.avec .section p, .product .section p, .pr .section p, .customer .section p { line-height: 21px; }
.avec .section .basic-left, .product .section .basic-left, .pr .section .basic-left, .customer .section .basic-left { margin: 0 5%; width: 90%; }
.avec .section .basic-right, .product .section .basic-right, .pr .section .basic-right, .customer .section .basic-right { margin: 0 5%; width: 90%; }
.avec .section .ani-thum, .product .section .ani-thum, .pr .section .ani-thum, .customer .section .ani-thum { display: none; position: absolute; top: 300px; }
br { display: none; }
@media only screen and (min-width: 1170px) {
  br { display: block; }
 .avec .section, .product .section, .pr .section, .customer .section { padding: 70px 0; }
 .content { width: 1160px; margin: 0 auto; }
 .content h2 { margin: -110px 0 50px 0; font-size: 60px; }
 .visual-wrap {  width: 100%; height: 460px; }
 .Overview { background: #888 url(/img/web/company_visual_01.jpg) no-repeat fixed; }
 .Introduction { background: #888 url(/img/web/company_visual_02.jpg) no-repeat fixed; }
 .History { background: #888 url(/img/web/company_visual_03.jpg) no-repeat fixed; }
 .Directions { background: #888 url(/img/web/company_visual_04.jpg) no-repeat fixed; }
 .patent { background: #888 url(/img/web/company_visual_05.jpg) no-repeat fixed; }
 .aveccarer { background: #888 url(/img/web/product_visual_01.jpg) no-repeat fixed; }
 .design { background: #888 url(/img/web/product_visual_02.jpg) no-repeat fixed; }
 .spec { background: #888 url(/img/web/product_visual_03.jpg) no-repeat fixed; }
 .Notice { background: #888 url(/img/web/pr_visual_01.jpg) no-repeat fixed; }
 .News { background: #888 url(/img/web/pr_visual_02.jpg) no-repeat fixed; }
 .Video { background: #888 url(/img/web/pr_visual_03.jpg) no-repeat fixed; }
 .Event { background: #888 url(/img/web/pr_visual_04.jpg) no-repeat fixed; }
 .manual { background: #888 url(/img/web/customer_visual_01.jpg) no-repeat fixed; }
 .faq { background: #888 url(/img/web/customer_visual_02.jpg) no-repeat fixed; }
 .comingsoon { width: 100%; height: 1000px; background-size: 100%!important; background: #888 url(/img/web/comingsoon.jpg) 100% no-repeat; }
 .comingsoon h3 { padding-top: 350px; text-align: center; font-size: 100px; color: #fff!important; }
 .comingsoon p { text-align: center; font-size: 30px; margin-top: 40px; color: #fff!important; }
 .avec .section, .product .section, .pr .section, .customer .section { padding: 80px 0 100px; min-height: 400px; }
 .avec .section h3, .product .section h3, .pr .section h3, .customer .section h3 { font-size: 30px; line-height: 40px; margin-bottom: 30px; color: #000; font-weight: 700; }
 .avec .section h4, .product .section h4, .pr .section h4, .customer .section h4 { font-size: 18px; font-weight: 500; margin-bottom: 20px; }
 .avec .section p, .product .section p, .pr .section p, .customer .section p { line-height: 24px!important; font-size: 16px; }
 .avec .section .basic-left, .product .section .basic-left, .pr .section .basic-left, .customer .section .basic-left { margin-right: 50%; width: 48%; }
 .avec .section .basic-right, .product .section .basic-right, .pr .section .basic-right, .customer .section .basic-right { margin-left: 50%; width: 48%; }
 .avec .section .ani-thum, .product .section .ani-thum, .pr .section .ani-thum, .customer .section .ani-thum { display: block; position: absolute; top: 200px; }
}
/* Overview */
.overbg-02 { background: #ccc url(/img/web/overview_section2_img.jpg) center no-repeat; }
.overbg-03 { background: #232323 url(/img/web/connectwork.png); }
.overbg-04 { background: #ccc url(/img/web/overview_section4_img.jpg) center no-repeat; background-size: cover; }
.ci-info { width: 100%; margin: 0 0 40px; }
.ci-info img { max-width: 100%; }
.over-philosophy { margin-top: 0; }
.over-philosophy li { display: inline-block; margin-top: 50px; width: 100%; font-size: 24px; color: rgba(255,255,255,0.6); font-weight: 300; line-height: 50px; text-align: center; }
.over-philosophy li .thum-box { display: block; width: 70%; height: 180px; margin: 0 auto; border-radius: 100px; background-size: 100%!important; }
.over-philosophy li .thum-box.thum01 { background: #000 url(/img/web/overview_section3_thum01.png) 50% no-repeat;}
.over-philosophy li .thum-box.thum02 { background: #000 url(/img/web/overview_section3_thum02.png) 50% no-repeat;}
.over-philosophy li .thum-box.thum03 { background: #000 url(/img/web/overview_section3_thum03.png) 50% no-repeat;}
.over-philosophy li .thum-box.thum04 { background: #000 url(/img/web/overview_section3_thum04.png) 50% no-repeat;}
.over-philosophy li p { margin-top: 20px; font-weight: 300; font-size: 16px }
.ceo-history li { font-size: 14px; font-weight: 300; line-height: 24px; list-style: outside circle; margin-left: 20px; }
.ceo-photo { width: 100%; }
.overbg-05 .left-thum { margin-bottom: 20px; }
.overbg-05 .right-text { font-size: 14px; }
.overbg-05 h4 { line-height: 30px; font-size: 30px; }
.overbg-05 .right-text .ceo-name { color: #888; margin-top: 70px; }
.overbg-05 .right-text .ceo-name span { display: block; font-size: 18px; font-weight: 500; color: #232323; line-height: 24px; letter-spacing: -1px; }
.overbg-06 { background: url(/img/web/overview_section6_img.jpg) center no-repeat; background-size: cover; text-align: center; height: auto; }
.overbg-06 h3 { font-size: 40px; margin-top: auto; text-align: left; color: #fff!important; }

@media only screen and (min-width: 1170px) {
 .overbg-02 { background: #ccc url(/img/web/overview_section2_img.jpg) center no-repeat; }
 .overbg-03 { background: #232323 url(/img/web/connectwork.png); }
 .overbg-04 { background: #ccc url(/img/web/overview_section4_img.jpg) center no-repeat fixed; background-size: cover; }
 .ci-info { width: 60%; margin: 70px 0 40px; }
 .over-philosophy { margin-top: 100px; }
 .over-philosophy li { display: inline-block; margin-top: 0; width: 24%; font-size: 24px; color: rgba(255,255,255,0.6); font-weight: 300; line-height: 50px; text-align: center; }
 .over-philosophy li .thum-box { display: block; width: 200px; height: 200px; margin: 0 auto; border-radius: 100px; background-size: 100%!important; }
 .over-philosophy li .thum-box.thum01 { background: #000 url(/img/web/overview_section3_thum01.png) no-repeat; }
 .over-philosophy li .thum-box.thum02 { background: #000 url(/img/web/overview_section3_thum02.png) no-repeat; }
 .over-philosophy li .thum-box.thum03 { background: #000 url(/img/web/overview_section3_thum03.png) no-repeat; }
 .over-philosophy li .thum-box.thum04 { background: #000 url(/img/web/overview_section3_thum04.png) no-repeat; }
 .over-philosophy li p { margin-top: 20px; font-weight: 300; font-size: 16px }
 .ceo-history li { font-size: 14px; font-weight: 300; line-height: 24px; list-style: outside circle; margin-left: 20px; }
 .overbg-05 .left-thum { float: left; width: 300px; }
 .overbg-05 .right-text { float: right; width: 800px; }
 .overbg-06 { background: #ccc url(/img/web/overview_section6_img.jpg) center no-repeat; background-size: cover; text-align: center; height: 600px; }
 .overbg-06 h3 { font-size: 40px; margin-top: 180px; text-align: left; }
}

/* Product */
.aveccarerbg-02 { background: #ddd; height: auto; padding: 15px 0!important; }
.aveccarerbg-02 video { width: 100%; }
.aveccarerbg-03 { background: #252D69 url(/img/web/main_section5_bg.jpg) center no-repeat; }
.aveccarerbg-03 h3 { font-size: 18px!important; color: #fff!important; text-align: center; }
.aveccarerbg-03 ul { margin-top: 30px; }
.aveccarerbg-03 ul li { width: 46%; font-size: 18px; line-height: 30px; margin: 10px 1%; display: inline-block; vertical-align: top; padding: 20px; color: #fff; }
.aveccarerbg-03 ul li div { width: 100%; text-align: center; }
.aveccarerbg-03 ul li div span { display: block; line-height: 14px; font-size: 14px; }
.aveccarerbg-03 ul li div strong { font-weight: 500; font-size: 14px; }
.aveccarerbg-03 p.text { margin-top: 20px; text-align: center; font-size: 16px!important; line-height: 24px!important; color: #fff; }
.aveccarerbg-04 { background: #f7f7f7; overflow: hidden; }
.aveccarerbg-04 .left-area, .aveccarerbg-04 .right-area { float: inherit; width: 100%; margin-bottom: 30px; overflow: hidden; }
.aveccarerbg-04 .left-area h3, .aveccarerbg-04 .right-area h3 { height: 50px; text-align: center; line-height: 50px; font-size: 24px; border-radius: 25px; color: #fff; }
.aveccarerbg-04 .left-area h3 { background-color: #252D69; }
.aveccarerbg-04 .right-area h3 { background-color: #2a74a7; }
.aveccarerbg-04 .left-area h4 { font-size: 18px; font-weight: 700; color: #252D69; margin-top: 30px; }
.aveccarerbg-04 .right-area h4 { font-size: 18px; font-weight: 700; color: #2a74a7; margin-top: 30px; }
.aveccarerbg-04 .left-area div, .aveccarerbg-04 .right-area div { width: 350px; float: left; }
.aveccarerbg-04 .left-area span, .aveccarerbg-04 .right-area span { margin: 30px 0 30px; display: block; }
.aveccarerbg-05 { overflow: hidden; }
.aveccarerbg-05 .left-area, .aveccarerbg-05 .right-area { float: inherit; width: 100%; margin-bottom: 30px; }
.aveccarerbg-05 .right-area { float: right; }
.aveccarerbg-05 .left-area h4, .aveccarerbg-05 .right-area h4, .aveccarerbg-05 .center-area h4 { line-height: 30px; font-size: 21px;}
.aveccarerbg-05 .center-area { width: 100%; clear: both; }
.aveccarerbg-05 .left-area .ac-box, .aveccarerbg-05 .right-area .ac-box { position: relative; overflow: hidden; }
.aveccarerbg-05 .left-area .ac-box img, .aveccarerbg-05 .right-area .ac-box img { float: left; display: block; vertical-align: middle; margin-right: 30px; }
.ico-patent { font-size: 16px; display: inline-block; margin-left: 10px; background-color: #FF3500; padding: 0 10px; color:#fff; border-radius: 20px; }
.aveccarerbg-06 { background: #f7f7f7; overflow: hidden; }
.aveccarerbg-06 h3 { font-weight: 300!important; font-size: 16px!important; line-height: 24px!important; }
.aveccarerbg-06 h3 strong { font-weight: 700; }
.aveccarerbg-06 .left-area { float: left; width: 100%; padding-top: 20px; }
.aveccarerbg-06 .right-area { float: right; width: 100%; }
.aveccarerbg-06 .right-area span { display: inline-block; background-color: #ff470a; color: #fff; text-align: center; line-height: 30px; font-size: 18px; width: 30px; height: 30px; border-radius: 15px; margin-right: 10px; }
.aveccarerbg-06 .right-area h3 { font-size: 18px; margin: 30px 0 10px; }
.aveccarerbg-06 .right-area li { line-height: 21px; list-style: outside circle; margin-left: 60px; }
.aveccarerbg-07 .ani-wrap { width:100%; overflow: hidden; position: relative; text-align: center; margin-top: 50px; }
.aveccarerbg-07 .ani-wrap .ani-text { position: absolute; left: -20%; top: 50px; width: 140%; }
.aveccarerbg-07 .ani-wrap .ani-bg { margin: 0 0 0 0; }
.aveccarerbg-08 { background: url(/img/web/aveccarer08_bg.jpg) center no-repeat; height: 400px; background-size: cover; }
.aveccarerbg-09 { background: #f7f7f7; overflow: hidden; }
.aveccarerbg-09 table { width: 100%; }
.aveccarerbg-09 table th { padding: 20px 0; border-top: solid 1px #e1e1e1; border-bottom: solid 1px #ccc; font-weight: 500; }
.aveccarerbg-09 table td { padding: 20px 0; text-align: center; border-bottom: solid 1px #e1e1e1; }
.aveccarerbg-10 { overflow: hidden; background: #f7f7f7; }
.aveccarerbg-10 .left-area { float: left; width: 100%; vertical-align: top; }
.aveccarerbg-10 .left-area .thum-01, .aveccarerbg-10 .right-area .thum-01 { margin: 20px 0 0; }
.aveccarerbg-10 .left-area .thum-01 img { border: solid 1px #e1e1e1; padding: 10px; }
.aveccarerbg-10 .right-area .thum-01 img { }
.aveccarerbg-10 .right-area { float: right; width: 100%; vertical-align: top; }
.aveccarerbg-10 .left-area p, .aveccarerbg-10 .right-area p { font-size: 14px; line-height: 24px!important; width: 90%; margin: 0 auto; text-align: center; word-break: keep-all; }
.aveccarerbg-10 .left-area p strong, .aveccarerbg-10 .right-area p strong { font-size: 16px; font-weight: 500; color: #ff470a; }
.aveccarerbg-10 h4 { line-height: 26px; }
.aveccarerbg-11 { background: url(/img/web/main_section8_bg.jpg) center no-repeat; background-size: cover; }
.aveccarerbg-11 h3 { text-align: right!important; color: #fff!important; }
.aveccarerbg-11 p { text-align: right!important; color: #fff!important; font-size: 16px; }
.aveccarerbg-11 ul { margin-top: 30px;}
.aveccarerbg-11 ul li { text-align: right; color: #fff; font-size: 14px; margin: 8px 0; }
.aveccarerbg-11 .btn-wrap { text-align: right; margin-top: 20px; }
.lineup li { display: table-cell; width: 1%; text-align: center; }
.lineup li p strong { font-weight: 500; }
@media only screen and (min-width: 1170px) {
 .aveccarerbg-02 { background: #ddd; height: auto; padding: 70px 0!important; }
 .aveccarerbg-03 h3 { font-size: 40px!important; color: #fff!important; text-align: center; }
 .aveccarerbg-03 ul { margin-top: 30px; }
 .aveccarerbg-03 ul li { width: inherit; font-size: 18px; line-height: 30px; margin: 10px 1%; display: inline-block; vertical-align: top; padding: 20px; color: #fff; }
 .aveccarerbg-03 ul li div { width: 160px; text-align: center; }
 .aveccarerbg-03 ul li div span { display: block; line-height: 24px; font-size: 16px; }
 .aveccarerbg-03 ul li div strong { font-weight: 500; font-size: 18px; }
 .aveccarerbg-03 p.text { margin-top: 50px; text-align: center; font-size: 21px!important; line-height: 34px!important; color: #fff; }
 .aveccarerbg-04 .left-area { float: left; width: 350px; margin-bottom: 0; }
 .aveccarerbg-04 .right-area { float: right; width: 700px; margin-bottom: 0; }
 .aveccarerbg-05 .left-area { float: left; width: 550px; margin-bottom: 0; }
 .aveccarerbg-05 .right-area { float: right; width: 550px; margin-bottom: 0; }
 .aveccarerbg-06 { background: #f7f7f7; overflow: hidden; }
 .aveccarerbg-06 h3 { font-weight: 300!important; font-size: 30px!important; line-height: 40px!important; }
 .aveccarerbg-06 h3 strong { font-weight: 700; }
 .aveccarerbg-06 .left-area { float: left; width: 550px; padding-top: 20px; }
 .aveccarerbg-06 .right-area { float: right; width: 550px }
 .aveccarerbg-06 .right-area span { display: inline-block; background-color: #ff470a; color: #fff; text-align: center; line-height: 30px; font-size: 18px; width: 30px; height: 30px; border-radius: 15px; margin-right: 10px; }
 .aveccarerbg-06 .right-area h3 { font-size: 18px!important; margin: 30px 0 10px; }
 .aveccarerbg-06 .right-area li { line-height: 21px; list-style: outside circle; margin-left: 60px; }
 .aveccarerbg-07 .ani-wrap { width:100%; overflow: hidden; position: relative; text-align: center; margin-top: 50px; }
 .aveccarerbg-07 .ani-wrap .ani-text { position: absolute; left: 0; top: 0;  width: inherit; }
 .aveccarerbg-07 .ani-wrap .ani-bg { margin: 134px 0; }
 .aveccarerbg-08 { background: url(/img/web/aveccarer08_bg.jpg) center no-repeat; height: 400px; background-size: cover; }
 .aveccarerbg-10 { overflow: hidden; }
 .aveccarerbg-10 .left-area { float: left; width: 500px; vertical-align: top; }
 .aveccarerbg-10 .left-area .thum-01 { margin: 20px 0; }
 .aveccarerbg-10 .left-area .thum-01 img { border: solid 1px #e1e1e1; padding: 10px; height: 190px; }
 .aveccarerbg-10 .right-area .thum-01 img { height: 250px; }
 .aveccarerbg-10 .right-area { float: right; width: 600px; vertical-align: top; }
 .aveccarerbg-10 .left-area p, .aveccarerbg-10 .right-area p { width: 100%; text-align: left; }
 .aveccarerbg-10 .left-area p { font-size: 16px; line-height: 30px!important; }
 .aveccarerbg-10 .left-area p strong { font-size: 20px; font-weight: 500; color: #ff470a; }
 .aveccarerbg-10 .left-area p strong, .main .mainbg-04 .right-area p strong { font-size: 20px; font-weight: 500; color: #ff470a; line-height: 30px!important; }
 .aveccarerbg-10 .right-area .thum-01 img { height: 250px; }
 .aveccarerbg-11 { background: url(/img/web/main_section8_bg.jpg) center no-repeat; height: 650px; background-size: cover; }
 .aveccarerbg-11 h3 { text-align: right!important; color: #fff!important; }
 .aveccarerbg-11 p { text-align: right!important; color: #fff!important; font-size: 24px; }
 .aveccarerbg-11 ul { margin-top: 50px;}
 .aveccarerbg-11 ul li { text-align: right; color: #fff; font-size: 18px; margin: 10px 0; }
 .lineup li { display: table-cell; width: 1%;}
}

/* Introduction */
.introbg-02 { background: #ccc url(/img/web/introduction_section2_img.jpg) center no-repeat; height: 800px; }
.introbg-03 { background:#252D69; height: auto; }
.introbg-04 { background: #ccc url(/img/web/introduction_section4_img.jpg) center bottom no-repeat; height: 400px; background-size: cover; }
.introbg-06 { background: #ccc url(/img/web/introduction_section6_img.jpg) left bottom no-repeat; height: 800px; background-size: cover; }
.introbg-07 { background: #232323 url(/img/web/introduction_section7_img.jpg) center bottom no-repeat; height: 500px; background-size: 150%; }
.introbg-07 h3 { color: #fff!important; }
.introbg-07 h3 strong { color: #fff100;}
.intro-section2-list { width: 100%; overflow: hidden; }
.intro-section2-list strong { display: block; }
.intro-section2-list div { display: block; margin: 30px 0; width: 100%!important; }
.intro-section2-list div span { display: inline-block; margin-right: 10px; }
.intro-section2-list div span img { border-radius: 35px; }
.intro-section2-list div span.thum-01 { width: 70px; height: 70px; border-radius: 35px; vertical-align: top; }
.intro-section2-list div span.thum-02 { width: 70px; height: 70px; border-radius: 35px; vertical-align: top; }
.intro-section2-list div span.thum-03 { width: 70px; height: 70px; border-radius: 35px; vertical-align: top; }
.intro-section2-list div span.thum-04 { width: 70px; height: 70px; border-radius: 35px; vertical-align: top; }
.intro-section2-list div span.text { line-height: 26px; }
.intro-section2-list div span strong { font-weight: 500; }
.pop-01 { display: none; }
.pop-02 { display: none; }
.pop-03 { display: none; }
.intro-section3-list > li { margin: 30px 0; }
.intro-section3-list > li > div { display: inline-block; }
.intro-section3-list > li > div.virus-thum { width: 100%; }
.intro-section3-list > li > div.virus-info { width: 100%; vertical-align: top; margin-top: 20px; }
.intro-section3-list > li > div > ul { margin-left: 20px; }
.intro-section3-list > li > div > ul > li { margin: 10px 0; list-style: outside circle; word-break: break-all; line-height: 21px; }
.text-sm { font-size: 13px; color: #fff; font-weight: 300;}
.graph-01 { width: 100%; }
.graph-02 { position: inherit; right: 0; top: 0; width: 100%; height: 250px; }
.graph-03 { position: inherit; right: 0; top: 0; width: 100%; height: inherit; }
.introbg-04 p { font-size: 14px; line-height: 24px!important; }
.introbg-04 p span { text-decoration: underline; color: #ffc500; }
.bar-radius { text-align: center; background-color: #252D69; border-radius: 30px; color: #fff!important; padding: 10px 20px; }
.introbg-05 ul { margin-top: 50px; }
.introbg-05 ul li { display: inline-block; width: 100%; margin: 0 auto 30px; text-align: center; }
.introbg-06 p { font-size: 14px; line-height: 24px!important; }
.introbg-06 p span { text-decoration: underline; color: #252D69; }
.care-00 { z-index: 5; width: 500px; height: 500px; position: absolute; left: -1000px; top: 100px; }
.care-01 { z-index: 10; width: 130px; height: 130px; position: absolute; left: 50%; top: 170px; background: #fff url(/img/web/care_01.png) 50% 5% no-repeat; border-radius: 75px; text-align: center; font-size: 21px; font-weight: 700; line-height: 200px; margin-left: -65px; }
.care-02 { z-index: 10; width: 130px; height: 130px; position: absolute; left: 50%; right: inherit; top: 340px; background: #fff url(/img/web/care_02.png) 50% 5% no-repeat;; border-radius: 75px; text-align: center; font-size: 21px; font-weight: 700; line-height: 200px; margin-left: -65px; }
.care-03 { z-index: 10; width: 130px; height: 130px; position: absolute; left: 50%; top: 510px; background: #fff url(/img/web/care_03.png) 50% 5% no-repeat;; border-radius: 75px; text-align: center; font-size: 21px; font-weight: 700; line-height: 200px; margin-left: -65px; }
.patent-wrap ul:after { display: block; content: ''; clear: both; }
.patent-box { position: relative; float: left; width: 100%;  margin: 10px 0; }
.patent-box .patent-thum { border: 1px solid #e1e1e1; text-align: center; }
.patent-box .patent-thum img { vertical-align: top; max-width: 100%; }
.patent-box .patent-txt { position: relative; /*height: 220px;*/ font-size: 12px; padding: 10px 0; color: #000; }
.patent-box .patent-txt h5 { font-size: 16px; font-weight: 500; color: #2e3ca4; margin: 10px 0; line-height: 24px; }
.patent-box .patent-txt ul li { line-height: 21px; font-size: 14px; list-style: outside circle; margin-left: 20px; }
.patent-box .patent-txt ul li span { color: #FC2F33; }
.pantentbg-02 { background: #f7f7f7; }
.historybg_02 { overflow: hidden; background: #f7f7f7; position: relative; }
.historybg_02 .history-thum-01 { position: unset; width: 100%; height: 400px;  }/*180718*/
.historybg_02 .history-thum-02 { position: unset; width: 100%; height: 400px; }/*180718*/
@media only screen and (min-width: 1170px) {
 .patent-box { width: 240px; height: 570px; margin: 10px 20px; }
 .historybg_02 .history-thum-01 { position: absolute; left: 5%; top: 90px; width: 400px; height: 400px;  }/*180718*/
 .historybg_02 .history-thum-02 { position: absolute; right: 5%; bottom: 0; width: 400px; height: 400px; }/*180718*/
 .care-01 { z-index: 10; width: 130px; height: 130px; position: absolute; left: 10%; top: 170px; background: #fff url(/img/web/care_01.png) 50% 5% no-repeat; border-radius: 75px; text-align: center; font-size: 21px; font-weight: 700; line-height: 200px; }
 .care-02 { z-index: 10; width: 130px; height: 130px; position: absolute; left: 10%; right: inherit; top: 340px; background: #fff url(/img/web/care_02.png) 50% 5% no-repeat;; border-radius: 75px; text-align: center; font-size: 21px; font-weight: 700; line-height: 200px; }
 .care-03 { z-index: 10; width: 130px; height: 130px; position: absolute; left: 10%; top: 510px; background: #fff url(/img/web/care_03.png) 50% 5% no-repeat;; border-radius: 75px; text-align: center; font-size: 21px; font-weight: 700; line-height: 200px; }
}

.box_point li { display: block; width: 100% }
.box_point li div { margin: 10px; border: solid 1px #e1e1e1; border-radius: 5px; text-align: center; padding: 20px 0; font-size: 21px; line-height: 24px; color: #888; }
.box_point li div strong { font-weight: 500; }
.box_point li div span.thum { display: inline-block; margin-right: 20px; }
.box_point li div span.text { display: inline-block; }
.box_point li div span.text br { display: block; }
.center { text-align: center; }
.vet-wrap { margin-top: 50px; }
.vet-wrap .mov { display: inline-block; width: 100%; margin-right: 0; }
.vet-wrap .histpry { display: inline-block; width: 100%; vertical-align: top; }
.vet-wrap .histpry h4 { font-size: 18px; line-height: 24px;}
.vet-wrap .histpry p { font-size: 14px; }
@media only screen and (min-width: 1170px) {
 .introbg-02 { background: #ccc url(/img/web/introduction_section2_img.jpg) center no-repeat; height: 800px; }
 .introbg-03 { background:#252D69; height: 730px }
 .introbg-04 { background: #ccc url(/img/web/introduction_section4_img.jpg) center bottom no-repeat; height: 800px; background-size: cover; }
 .introbg-06 { background: #ccc url(/img/web/introduction_section6_img.jpg) center center no-repeat; height: 800px; background-size: 100%; }
 .introbg-07 { background: #ccc url(/img/web/introduction_section7_img.jpg) center bottom no-repeat; height: 1000px; background-size: cover; }
 .introbg-07 h3 { font-size: 26px!important; line-height: 36px!important; color: #fff!important; }
 .pop-01 { display: block; position: absolute; right: 400px; top: 150px; }
 .pop-02 { display: block; position: absolute; right: 300px; top: 500px; }
 .pop-03 { display: block; position: absolute; right: 150px; top: 300px; }
 .intro-section3-list > li > div.virus-thum { width: 30%; }
 .intro-section3-list > li > div.virus-info { width: 65%; vertical-align: top; margin-top: 0; }
 .graph-01 { width: 600px; }
 .graph-02 { position: absolute; right: 0; top: 0; width: 450px; height: 250px; }
 .graph-03 { position: absolute; right: 0; top: 280px; width: 450px; height: 250px; }
 .introbg-04 p { font-size: 24px; line-height: 34px!important; }
 .introbg-04 p span { text-decoration: underline; color: #ffc500; }
 .bar-radius { text-align: center; background-color: #252D69; border-radius: 30px; color: #fff!important; padding: 10px 0; }
 .introbg-05 ul { margin-top: 50px; }
 .introbg-05 ul li { display: inline-block; width: 31%; margin: 0 1%; text-align: left; }
 .introbg-06 p { font-size: 24px; line-height: 34px!important; }
 .introbg-06 p span { text-decoration: underline; color: #252D69; }
 .care-00 { z-index: 5; width: 500px; height: 500px; position: absolute; left: 45%; top: 100px; }
 .care-01 { z-index: 10; width: 150px; height: 150px; position: absolute; left: 40%; top: 200px; background: #fff url(/img/web/care_01.png) 50% 10% no-repeat; border-radius: 75px; text-align: center; font-size: 24px; font-weight: 700; line-height: 220px; }
 .care-02 { z-index: 10; width: 150px; height: 150px; position: absolute; left: inherit; right: 10%; top: 350px; background: #fff url(/img/web/care_02.png) 50% 10% no-repeat;; border-radius: 75px; text-align: center; font-size: 24px; font-weight: 700; line-height: 220px; }
 .care-03 { z-index: 10; width: 150px; height: 150px; position: absolute; left: 45%; top: 480px; background: #fff url(/img/web/care_03.png) 50% 10% no-repeat;; border-radius: 75px; text-align: center; font-size: 24px; font-weight: 700; line-height: 220px; }
 .box_point li { display: table-cell; width: 1% }
 .box_point li div { margin: 50px; border: solid 1px #e1e1e1; border-radius: 5px; text-align: center; padding: 20px 0; font-size: 21px; line-height: 24px; color: #888; }
 .box_point li div strong { font-weight: 500; }
 .box_point li div span.thum { display: inline-block; margin-right: 20px; }
 .box_point li div span.text { display: inline-block; }
 .vet-wrap { margin-top: 50px; }
 .vet-wrap .mov { display: inline-block; width: 60%; margin-right: 50px; }
 .vet-wrap .histpry { display: inline-block; width: 35%; vertical-align: top; }
 .vet-wrap .histpry h4 { font-size: 18px; line-height: 24px;}
 .vet-wrap .histpry p { font-size: 14px; }
}

/* history */
.history-list li { margin-bottom: 20px; overflow: hidden; }
.history-list li span.mon { display: inline-block; width: 70px; line-height: 24px; vertical-align: top; font-size: 24px; }
.history-list li span.text { display: inline-block; width: 75%; line-height: 24px; vertical-align: top; }

/* directions */ /*180718*/
.direbg-02 { background: #ccc; min-height: 800px; }
.dire-left { width: 100%; height: auto; }
.dire-left .root_daum_roughmap { width: 100%!important; }
.dire-right { width: 100%; margin-top: 20px; padding-bottom: 20px; }
@media only screen and (min-width: 1170px) {
 .direbg-02 { background: #ccc; height: 800px; }
 .dire-left { float: left; width: 700px; }
 .dire-left .root_daum_roughmap .wrap_map{ height: 528px!important;}
 .dire-right { float: right; width: 400px; margin-top: 0; }
}

/* pr */
.board-title { display: none; }
.board-title { border-top: 2px solid #232323; border-bottom: 1px solid #ccc; padding: 15px 20px; overflow: hidden; }
.board-title li span { float: left; font-weight: 500; }
.board-title li span.b_tit_01 { width: 1000px; text-align: center; }
.board-title li span.b_tit_02 { width: 120px; text-align: center; }
.board-list li { border-bottom: 1px solid #ccc; padding: 15px 20px; overflow: hidden; }
.board-list li span { float: left; }
.board-list li span.b_con_01 { width: 100%; margin-bottom: 10px; line-height: 21px; }
.board-list li span.b_con_01 a { font-weight: 500; color: #000; }
.board-list li span.b_con_01 a:hover { text-decoration: underline; }
.board-list li span.b_con_02 { width: 100%; text-align: left; }
@media only screen and (min-width: 1170px) {
 .board-title { display: block; }
 .board-list li { border-bottom: 1px solid #ccc; padding: 15px 20px; overflow: hidden; }
 .board-list li span { float: left; }
 .board-list li span.b_con_01 { width: 1000px; margin-bottom: 0; line-height: inherit; }
 .board-list li span.b_con_01 a { font-weight: 500; color: #000; }
 .board-list li span.b_con_01 a:hover { text-decoration: underline; }
 .board-list li span.b_con_02 { width: 120px; text-align: center; }
 .board-view { overflow: hidden; line-height: 26px; padding-bottom: 50px; border-bottom: solid 1px #e1e1e1; }
 .board-view .board-title-bar { font-size: 24px!important; margin-bottom: 10px!important; }
 .board-view .date { display: block; margin-bottom: 30px!important; }
 .board-view .view-body { border-top: solid 1px #e1e1e1; padding-top: 50px; }
 .board-write { overflow: hidden; line-height: 26px; border-bottom: solid 1px #e1e1e1; }
 .board-write ul li { padding: 15px; border-top: solid 1px #e1e1e1; }
 .board-write ul li input { width: 100%; padding: 5px; border: solid 1px #e1e1e1; }
 .board-write ul li textarea { width: 100%; height: 500px; border: solid 1px #e1e1e1; }
 .board-write ul li .w-title { width: 100px; display: inline-block; }
 .board-write ul li .form { width: 1030px; display: inline-block; }
 .btn-wrap { padding-top: 20px; }
 .btn-wrap .btn-move { float: left; width: 98px; height: 38px; margin-right: 10px; border: 1px solid #e6e6e6; font-size: 14px; line-height: 38px; color: #1e1e1e; text-align: center; text-decoration: none; }
 .btn-wrap .btn-move:hover { color: #fff; background-color: #4d4d4d; }
 .btn-wrap .btn-list { float: right; width: 100px; height: 40px; font-size: 14px; line-height: 40px; color: #fff; background-color: #2e3ca4; text-align: center; text-decoration: none; }
 .btn-wrap .btn-list:hover { background-color: #1e1e1e; }
}
.evt-wrap ul:after { display: block; content: ''; clear: both; }
.evt-box { position: relative; float: left; width: 100%; height: 360px; margin: 10px 0; cursor: pointer; background: #fff; border-bottom: 2px solid #e1e1e1; }
.evt-box .evt-thum img { vertical-align: top; width: 100%; height: 200px; }
.evt-box .evt-txt { position: relative; height: 160px; font-size: 12px; padding: 15px; color: #000;}
.evt-box .evt-txt .evt-tag { vertical-align: top; line-height: 14px; }
.evt-box .evt-txt .evt-tit { font-weight: bold; font-size: 16px; line-height: 16px; padding: 5px 0; }
.evt-box .evt-txt .evt-desc { line-height: 15px; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; height: 60px; }
.evt-box .evt-txt .evt-date { position: absolute; left: 12px; bottom: 10px; color: #aaa; }
.vid-wrap ul:after { display: block; content: ''; clear: both; }
.vid-box { float: left; width: 100%; height: 300px; margin: 10px 0; cursor: pointer; background: #fff; border-bottom: 2px solid #e1e1e1; }
.vid-box .vid-thum img { vertical-align: top; width: 100%; height: 220px; }
.vid-box .vid-txt { position: relative; height: 80px; font-size: 11px; padding: 15px; }
.vid-box .vid-txt .vid-tit { font-weight: bold; font-size: 16px; line-height: 16px; }
.vid-box .vid-txt .vid-date { position: absolute; right: 12px; bottom: 10px; color: #aaa; font-size: 12px; }
@media only screen and (min-width: 1170px) {
 .evt-box { width: 270px; margin: 10px; }
 .vid-box { width: 365px; margin: 10px; }
}
/* Customer */
.accordion-wrap {  }
.accordion-li { position: relative; cursor: pointer; }
.accordion-li .tit { padding: 20px; border-bottom: 1px solid #e1e1e1; transition: all 0.3s ease-in-out; }
.accordion-li .tit span { display: inline-block; width: 50px; }
.accordion-li .tit a { display: inline-block;  font-weight: 500; color: #000; }
.accordion-li:after { content: ''; position: absolute; top: 12px; right: 20px; width: 30px; height: 30px; background: url(/img/web/open_arrow.png) no-repeat; background-size: cover; }
.accordion-li .text { padding: 35px 40px; line-height: 20px; border-bottom: 1px solid #2E3CA4; cursor: default;  display: none; }
.accordion-li.on .tit { border-color: #2E3CA4; }
.accordion-li.on .tit a { color: #2E3CA4; }
.accordion-li.on:after { content: ''; position: absolute; top: 12px; right: 20px; width: 30px; height: 30px; background: url(/img/web/open_arrow.png) 0 -30px no-repeat; background-size: cover; }
.accordion-li.on .text { display: block; }

/* -------------------------------- 

foot 

-------------------------------- */
footer { padding: 30px 0; border-top: solid 1px #e1e1e1; position: relative; overflow: hidden; line-height: 21px; }
footer .copy { width: 90%; margin: 0 auto; font-family: "Roboto", sans-serif; }
footer .copy h5 { font-size: 16px; font-weight: 700; }
footer .copy span { font-size: 11px; font-weight: 500;  }
footer .address { width: 80%; float: left; margin-left: 5%; }
footer .address p { font-size: 12px; }
footer .address p span { font-weight: 100; color: #666; margin: 0 5px; }
footer .address p a { color: #666; text-decoration: underline; }
/*footer .share { position: absolute; left: 50%; bottom: 0; margin-left: -92px; }*/
footer .share { position: absolute; right: 5%; top: 30px; }
footer .share a span { width: 24px; height: 24px; display: inline-block; overflow: hidden; text-indent: -500em; margin-left: 20px; }
footer .share a span.facebook { background: url(/img/web/ico_facebook@2x.png) no-repeat; background-size: 100%; }
footer .share a span.instagram { background: url(/img/web/ico_instagram@2x.png) no-repeat; background-size: 100%; }
footer .share a span.blog { background: url(/img/web/ico_blog@2x.png) no-repeat; background-size: 100%; }
footer .share a span.youtube { background: url(/img/web/ico_youtube@2x.png) no-repeat; background-size: 100%; }

@media only screen and (min-width: 1170px) {
 footer .copy { margin-left: 4em; float: left; width: auto; }
 footer .address { margin-left: 4em; float: left; width: auto; }
 /*footer .share { left: 70%!important;  top: 30px;  margin-left: 0;  }*/
}

/* -------------------------------- 

carousel

-------------------------------- */
.main-topbnr-wrap { position: relative; min-height: auto; }
.main-topbnr-wrap .owl-nav {position:absolute;top:50%;left:0;width:100%;display:block; margin-top: -25px;}
.main-topbnr-wrap .owl-nav .owl-prev, .main-topbnr-wrap .owl-nav .owl-next { position:absolute; top:0; width:30px; height:50px; display:block; overflow:hidden; white-space:nowrap; text-indent:-300%; background:url("/img/web/ico_nav.png") no-repeat; }
.main-topbnr-wrap .owl-nav .owl-prev { left:20px; background-position:0 0; }
.main-topbnr-wrap .owl-nav .owl-next { right:20px; background-position:-30px 0; }
.main-topbnr-wrap .owl-dots {position:absolute;bottom:15px;left:0;width:100%;display:block;text-align:center;}
.main-topbnr-wrap .owl-dots .owl-dot {zoom:1;display:inline-block;*display: inline;margin:0 5px;}
.main-topbnr-wrap .owl-dots .owl-dot span {display:block;width:10px;height:10px;background:url("/img/web/ico_nav.png") no-repeat -120px 0px;}
.main-topbnr-wrap .owl-dots .owl-dot.active span {background-position:-120px -10px; width: 20px; height: 10px;}

.banner { position: relative; min-height: auto; padding: 20px 0; } /*hm*/
.banner .owl-nav {position:absolute;top:50%;left:0;width:100%;display:block; margin-top: -25px; }
.banner .owl-nav .owl-prev, .banner .owl-nav .owl-next { position:absolute; top:0; width:30px; height:50px; display:block; overflow:hidden; white-space:nowrap; text-indent:-300%; background:url("/img/web/ico_nav.png") no-repeat; }
.banner .owl-nav .owl-prev { left:0; background-position:0 0; }
.banner .owl-nav .owl-next { right:0; background-position:-30px 0; }
.banner .owl-dots {position:absolute;bottom:0;left:0;width:100%;display:block;text-align:center;} /*hm*/
.banner .owl-dots .owl-dot {zoom:1;display:inline-block;*display: inline;margin:0 5px;}
.banner .owl-dots .owl-dot span {display:block;width:10px;height:10px;background:url("/img/web/ico_nav.png") no-repeat -120px 0px;}
.banner .owl-dots .owl-dot.active span {background-position:-120px -10px; width: 20px; height: 10px;}


@media only screen and (min-width: 1170px) {
 .main-topbnr-wrap { position: relative; }
 .main-topbnr-wrap .owl-dots {position:absolute;bottom:30px;left:0;width:100%;display:block;text-align:center;}

 .banner { position: relative; padding: 0; } /*hm*/
 .banner .owl-carousel { height: 240px; } /*hm*/
 .banner .owl-dots {position:absolute; bottom:30px;left:0;width:100%;display:block;text-align:center;}
 .banner .owl-nav .owl-prev { left:20px; background-position:0 0; }
 .banner .owl-nav .owl-next { right:20px; background-position:-30px 0; }
}

/* -------------------------------- 

pagination

-------------------------------- */
.pagenation { overflow: hidden; position: relative; width: 100%; padding-top: 30px; text-align: center; }
.pagenation .inner_paging { display: inline-block; }
.pagenation a { display: block; float: left; width: 40px; height: 40px; line-height: 40px; margin: 0 3px; border: 1px solid #e6e6e6; text-align: center; color: #333; }
.pagenation a:hover { border: 1px solid #2e3ca4; color: #2e3ca4; text-decoration: none; }
.pagenation .btn-ico span { display: block; width: 40px; height: 40px; }
.pagenation .ico { display:inline-block; overflow:hidden; font-size:0; line-height:0; background:url(/img/web/ico.png) no-repeat; text-indent:-9999px; vertical-align:top; }
.pagenation .ico-fst { background-position: 0 0; }
.pagenation .ico-fst:hover{ background-position: 0 -40px; }
.pagenation .ico-prev { width: 6px; background-position: -40px 0; }
.pagenation .ico-prev:hover { background-position: -40px -40px; }
.pagenation .ico-next { width: 6px; background-position: -80px 0; }
.pagenation .ico-next:hover { background-position: -80px -40px; }
.pagenation .ico-lst { background-position: -120px 0; }
.pagenation .ico-lst:hover { background-position: -120px -40px; }
.pagenation em { display: block; float: left; width: 40px; height: 40px; line-height: 38px; margin: 0 3px; border: 1px solid #2e3ca4; text-align: center; color: #2e3ca4; }

#quickMenu { position: relative; right: inherit; z-index: 100; color: #fff; width: 100%; background: #2b2f6e; text-align: center; padding-bottom: 40px; }
#quickMenu h4 { font-size: 16px; position: relative; line-height: 100px; }
#quickMenu h4::before { content: ""; position: absolute; width: 60px; height: 2px; background-color: #fff; left: 50%; bottom: 20px; margin-left: -30px; }
#quickMenu strong { font-size: 28px; }
#quickMenu p { font-size: 14px; margin-top: 20px; font-weight: 300; }
#quickMenu a { color: #fff; }
#quickMenu span { background: url("/img/web/kakaoplus.png") center no-repeat; display: block; margin: 20px; height: 80px; text-indent: -500em; overflow: hidden; }
#quickMenu span a { width: 100%; height: 100%; display: block; }
#quickMenu .top-wrap { position: absolute; width: 100%; margin: 0; height: 50px; line-height: 50px; background-color: #1f2355; }
#quickMenu .top-wrap a { display: block; width: 100%; height: 100%; }
#quickMenu .top-wrap .top { background: url(/img/web/top.png) no-repeat; display: inline-block; width: 100px; height: 32px; margin: 8px 0 0 5px; }
@media only screen and (min-width: 1170px) {
 #quickMenu { position: absolute; right: 50px; z-index: 100; color: #fff; width: 200px; background: #2b2f6e; text-align: center; padding-bottom: 0; top: 520px; }
}
/* -------------------------------- 

login

-------------------------------- */
.login { background: #f7f7f7; z-index: 1}
.form-box { width: 500px; height: 250px; margin: 50px auto; background: #fff; padding: 30px 20px; border: 1px solid #ddd; border-radius: 3px; }
.login-form { clear: both; }
.input-wrap { position: relative; overflow: hidden; margin: 0 0 10px; padding: 7px 20px; border: solid 1px #D6D6D6; background: #fff; border-radius: 3px;}
.input-box { display: block; overflow: hidden; height: 35px; }
.input-box input { font-size: 14px; position: relative; width: 80%; height: 35px; padding: 7px 0 6px; color: #888; border: none; background: #fff; border-radius: 3px; }
.login-form .btn-login { width: 100%; height: 50px; background: #2e3ca4; border: 0; border-radius: 3px; color: #fff; cursor: pointer; }

/* -------------------------------- 

popup video

-------------------------------- */
#popvid { position: absolute; width: 95%; height: auto; top: 20%; left: 10px; background:#fff; z-index:200; box-shadow: 0 0 20px #333; }
#popvid .cont { width:100%; min-height: 250px; position: relative; }  /*180718*/
#popvid .cont video { width: 100%; }  /*180718*/
#popvid .cont iframe { width: 100%; min-height: 250px;}  /*180718*/
#popvid .close { position: absolute; top: -40px; right: 0; display: block;  color: #fff; font-size:13px; }
#popvid .close #close { display: block; cursor: pointer; width: 30px; height: 30px; background: url(/img/web/btn-close.png) 0 0 no-repeat; background-size: 90%; color: transparent; }
#mask { width: 100%; height: 100%; position: fixed; background: rgba(0,0,0,0.7) repeat; top: 0; left: 0;  z-index: 190; }

@media only screen and (min-width: 1170px) {
 #popvid { width:780px; height:438px; top:50%; left:50%; margin-top:-250px; margin-left:-390px;  }
 #popvid .close { top: -50px; }
 #popvid .close #close {  width: 40px; height: 40px; }
 #popvid .cont iframe { height: 438px; }  /*180718*/
}