/**
* Owl Carousel v2.2.1
* Copyright 2013-2017 David Deutsch
* Licensed under ()
*/
.owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}.owl-carousel{display:none;width:100%;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;-moz-backface-visibility:hidden}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.no-js .owl-carousel,.owl-carousel.owl-loaded{display:block}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;cursor:hand;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%}
height: 500px;
padding: 15% 0 10%;
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed;
background-size: cover;
overflow: hidden
}
#subVisual:before {
content: '';
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(0,0,0,0.5)
}
#subVisual.bg1 {
background-image: url(../../img/subvisual1.jpg)
}
#subVisual.bg2 {
background-image: url(../../img/subvisual2.jpg)
}
#subVisual.bg3 {
background-image: url(../../img/subvisual3.jpg)
}
#subVisual.bg4 {
background-image: url(../../img/subvisual4.jpg)
}
#subVisual.bg5 {
background-image: url(../../img/subvisual5.jpg)
}
#subVisual.bg6 {
background-image: url(../../img/subvisual6.jpg)
}
#subVisual.bg7 {
background-image: url(../../img/subvisual7.jpg)
}
#subVisual.bg8 {
background-image: url(../../img/sub-out-all.jpg)
}
#subVisual.bg9 {
background-image: url(../../img/sub-out-sofa.jpg)
}
#subVisual.bg10 {
background-image: url(../../img/sub-out-table.jpg)
}
#subVisual.bg11 {
background-image: url(../../img/sub-out-sunbed.jpg)
}
#subVisual.bg12 {
background-image: url(../../img/sub-out-daybed.jpg)
}
#subVisual.bg13 {
background-image: url(../../img/sub-out-swingchair.jpg)
}
#subVisual.bg14 {
background-image: url(../../img/sub-out-cabana.jpg)
}
#subVisual.bg15 {
background-image: url(../../img/sub-out-parasol.jpg)
}
#subVisual.bg16 {
background-image: url(../../img/subvisual7.jpg)
}
#subVisual.bg17 {
background-image: url(../../img/subvisual7.jpg)
}

#subVisual .container {
z-index: 5
}
#subVisual .visual-text {
float: left
}
#subVisual .visual-text>* {
color: #fff;
letter-spacing: -1px
}
#subVisual .visual-text>h2 {
font-size: 48px;
font-weight: 300;
margin-bottom: 10px
}
#subVisual .visual-text>h3 {
font-size: 18px;
font-weight: 300;
color: rgba(255,255,255,0.6);
letter-spacing: 4px !important
}
#subVisual .breadcrumb {
display: none;
float: right;
font-size: 0;
padding-top: 80px
}
#subVisual .breadcrumb>li {
display: inline-block;
font-size: 13px;
color: rgba(255,255,255,0.6)
}
#subVisual .breadcrumb>li>a {
color: #fff !important
}
#subVisual .breadcrumb>li.current {
font-weight: 700;
color: rgba(255,255,255,0.85)
}
#subVisual .breadcrumb>li:before {
content: '\f3d3';
position: relative;
top: 0;
font-family: 'Ionicons';
font-weight: normal !important;
color: rgba(255,255,255,0.6) !important;
margin: 0 10px
}
#subVisual .breadcrumb>li:first-child:before {
display: none
}
#subVisual nav {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
background: rgba(0,0,0,0.5);
z-index: 5
}
#subVisual nav>.container>ul>li {
position: relative;
display: table-cell;
height: 60px
}
#subVisual nav>.container>ul>li:before {
content: '';
position: absolute;
top: 50%;
left: 0;
display: block;
width: 1px;
height: 16px;
margin-top: -8px;
background: rgba(255,255,255,0.25)
}
#subVisual nav>.container>ul>li:first-child:before, #subVisual nav>.container>ul>li.active:before, #subVisual nav>.container>ul>li.active+li:before {
display: none
}
#subVisual nav>.container>ul>li>a {
display: block;
width: 100%;
height: 100%;
font-size: 13px;
font-weight: 300;
color: #fff;
text-align: center;
line-height: 60px
}
#subVisual nav>.container>ul>li.active>a {
font-weight: 700;
background: #333
}
/* Section Common */
#container img {
max-width: 100%
}
section.sub-section {
position: relative;
padding: 100px 0;
overflow: hidden
}
section.sub-section:before, section.sub-section:after {
content: '';
display: block
}
section.sub-section:after {
clear: both
}
section.sub-section .nav-bar {
position: relative;
margin-bottom: 60px;
padding-bottom: 20px;
border-bottom: 1px solid #e8e8e8
}
section.sub-section .nav-bar:before, section.sub-section .nav-bar:after {
content: '';
display: block
}
section.sub-section .nav-bar:after {
clear: both
}
section.sub-section .nav-bar h2 {
font-size: 34px;
font-weight: 300;
color: #000;
text-align: center
}
section.sub-section .nav-bar .direction {
position: absolute;
display: block;
top: 50%;
width: 50px;
height: 40px;
margin-top: -20px;
font-size: 0
}
section.sub-section .nav-bar .direction.prev {
left: 0
}
section.sub-section .nav-bar .direction.next {
right: 0
}
section.sub-section .nav-bar .direction:before, section.sub-section .nav-bar .direction:after {
content: '';
position: absolute;
display: block;
background: #005b96;
transition: all 0.35s ease
}
section.sub-section .nav-bar .direction:before {
top: 50%;
width: 30px;
height: 2px;
margin-top: -1px
}
section.sub-section .nav-bar .direction.prev:before {
left: 0
}
section.sub-section .nav-bar .direction.next:before {
right: 0
}
section.sub-section .nav-bar .direction.prev:after, section.sub-section .nav-bar .direction.next:after {
top: 50%;
width: 12px;
height: 2px;
margin-top: -6px
}
section.sub-section .nav-bar .direction.prev:after {
left: 0;
transform: rotate(-45deg)
}
section.sub-section .nav-bar .direction.next:after {
right: 0;
transform: rotate(45deg)
}
section.sub-section .nav-bar .direction:hover:before {
width: 20px
}
section.sub-section .sectionTitle {
text-align: center
}
section.sub-section .sectionTitle:after {
content: '';
display: block;
margin: 45px auto 80px;
width: 50%;
height: 1px;
max-width: 350px;
background: #e8e8e8
}
section.sub-section .sectionTitle h2 {
font-size: 42px;
font-weight: 700;
color: #333;
letter-spacing: -1px;
margin-bottom: 10px
}
section.sub-section .sectionTitle p {
font-size: 16px;
font-weight: 300;
color: #999;
line-height: 1.65
}
section.sub-section .subTitle {
padding: 50px 0;
text-align: center
}
section.sub-section .subTitle h2 {
font-size: 36px;
font-weight: 300;
color: #333
}
section.sub-section .subTitle p {
margin-top: 15px;
font-size: 16px;
font-weight: 300;
color: #555;
line-height: 1.6
}
section.sub-section .subTitle p strong {
color: #333
}
section.sub-section .container .subTitle {
padding-top: 0 !important
}
/* about - greet */
section.sub-section .greet-grid .text-area h3 {
font-size: 36px;
font-weight: 500;
color: #333;
line-height: 1.3
}
section.sub-section .greet-grid .text-area h3:after {
content: '';
display: block;
width: 40px;
height: 1px;
margin: 15px 0 20px;
background: #333
}
section.sub-section .greet-grid .text-area p {
color: #8a8a8a;
line-height: 1.8;
text-align: justify;
margin-bottom: 20px
}
section.sub-section .greet-grid .text-area .sign {
font-size: 18px;
color: #555;
text-align: left;
margin-bottom: 0
}
section.sub-section .greet-grid .text-area .sign span {
color: #000;
margin-left: 15px;
font-size: 24px;
font-weight: 700;
letter-spacing: 5px
}
/* about company - type1 */
#container .about-top {
padding-bottom: 0
}
#container .about-main {
padding: 150px 0;
background: url(../../img/about_main_bg.jpg) center top no-repeat;
background-size: cover
}
#container .about-main h3 {
font-size: 24px;
font-weight: normal;
color: #fff;
text-align: center;
line-height: 1.6;
margin-bottom: 80px
}
#container .about-main .company-info {
display: table;
width: 100%;
max-width: 1200px;
margin: auto;
table-layout: fixed
}
#container .about-main .company-info>li {
display: table-cell;
padding: 50px 20px;
color: #fff;
text-align: center;
border-right: 1px solid rgba(255, 255, 255, 0.25)
}
#container .about-main .company-info>li:first-child {
border-left: 1px solid rgba(255, 255, 255, 0.25)
}
#container .about-main .company-info>li i {
display: inline-block;
font-size: 48px;
height: 60px
}
#container .about-main .company-info>li h4 {
font-size: 18px;
font-weight: 600;
margin: 10px 0 15px
}
#container .about-main .company-info>li p {
font-size: 16px;
line-height: 1.5;
opacity: 0.7
}
#container .about-section1 .about-desc {
font-size: 18px;
color: #3b3b3b;
text-align: center;
line-height: 1.75;
margin-bottom: 60px
}
#container .about-section1 .about-info {}
#container .about-section1 .about-info:after {
content: '';
clear: both;
display: block
}
#container .about-section1 .about-info dt, #container .about-section1 .about-info dd {
font-size: 15px;
line-height: 1
}
#container .about-section1 .about-info dt {
float: left;
display: block;
width: 130px;
padding: 20px 15px;
font-weight: 600;
color: #2b2b2b;
border-top: 1px solid #333
}
#container .about-section1 .about-info dd {
display: block;
margin-left: 150px;
padding: 20px 15px;
color: #666;
border-top: 1px solid #e2e2e2
}
#container .about-section2 {
background: #fafafa
}
#container .about-section2 .team-info>li {
transition: opacity 0.4s ease
}
#container .about-section2 .team-info>li:before {
content: '';
display: block;
height: 1px;
margin-bottom: 30px;
background: #e5e5e5;
transition: background 0.4s ease
}
#container .about-section2 .team-info>li .imgBox {
overflow: hidden
}
#container .about-section2 .team-info>li .imgBox img {
display: block;
width: 100%
}
#container .about-section2 .team-info>li .detail h3 {
font-size: 24px;
font-weight: 300;
color: #2b2b2b;
margin: 35px 0 5px
}
#container .about-section2 .team-info>li .detail .subtit {
display: block;
font-size: 14px;
font-weight: 300;
color: #9a9a9a;
margin-bottom: 25px
}
#container .about-section2 .team-info>li .detail p {
color: #6a6a6a;
line-height: 1.85
}
#container .about-section2 .team-info>li .detail .sns-link {
margin-top: 25px;
font-size: 0
}
#container .about-section2 .team-info>li .detail .sns-link>li {
display: inline-block;
font-size: 18px;
margin-right: 10px
}
#container .about-section2 .team-info>li .detail .sns-link>li a {
font-size: 18px;
color: #333
}
/* about company - type2 */
#container .about-grid-type2>li {
text-align: center
}
#container .about-grid-type2 .inner-box {
position: relative;
padding: 40px 30px;
border: 1px solid #e5e5e5
}
#container .about-grid-type2 .inner-box>.line {
position: absolute;
display: block;
background: #333;
-webkit-transition: all 0.35s cubic-bezier(0.165, 0.84, 0.44, 1);
transition: all 0.35s cubic-bezier(0.165, 0.84, 0.44, 1)
}
#container .about-grid-type2 .inner-box>.line1 {
top: -1px;
left: -1px;
width: 1px;
height: 0
}
#container .about-grid-type2 .inner-box>.line2 {
top: -1px;
left: -1px;
width: 0;
height: 1px
}
#container .about-grid-type2 .inner-box>.line3 {
top: -1px;
right: -1px;
width: 1px;
height: 0
}
#container .about-grid-type2 .inner-box>.line4 {
bottom: -1px;
right: -1px;
width: 0;
height: 1px
}
#container .about-grid-type2 .inner-box:hover>.line1, #container .about-grid-type2 .inner-box:hover>.line3 {
height: 100%
}
#container .about-grid-type2 .inner-box:hover>.line2, #container .about-grid-type2 .inner-box:hover>.line4 {
width: 100%
}
#container .about-grid-type2 .inner-box .icon {
font-size: 48px;
color: #333
}
#container .about-grid-type2 .inner-box h3 {
font-size: 18px;
font-weight: 700;
color: #333;
margin: 15px 0 10px
}
#container .about-grid-type2 .inner-box p {
color: #8a8a8a;
line-height: 1.7;
word-break: keep-all
}
#container .about-video-type2 {
text-align: center;
padding: 150px 0;
background-image: url(../../img/about_video_bg.jpg);
}
#container .about-video-type2 .caption {
margin-bottom: 50px
}
#container .about-video-type2 .caption>* {
color: #fff
}
#container .about-video-type2 .caption h3 {
font-size: 42px;
font-weight: normal;
letter-spacing: 2px;
margin-bottom: 5px
}
#container .about-video-type2 .caption p {
font-size: 13px;
letter-spacing: 2px;
opacity: 0.65
}
#container .about-video-type2 .btn-video {
position: relative;
display: inline-block;
padding: 15px 30px;
color: #fff;
border: 1px solid rgba(255,255,255,0.2);
border-radius: 5px;
-webkit-transition: all 0.25s ease;
transition: all 0.25s ease
}
#container .about-video-type2 .btn-video.load {
color: rgba(255,255,255,0.45);
border-color: rgba(150,150,150,0.45) !important;
background: rgba(150,150,150,0.15) !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
cursor: not-allowed
}
#container .about-video-type2 .btn-video.load:after {
content: '\f20d';
position: absolute;
left: 50%;
font-family: 'Ionicons';
font-size: 18px;
color: #fff;
text-align: center;
margin-left: -9px;
-webkit-transform: rotate(90deg);
transform: rotate(90deg)
}
#container .about-video-type2 .btn-video span {
display: inline-block;
width: 20px;
height: 20px;
font-size: 12px;
text-align: center;
line-height: 18px;
margin-left: 5px;
border: 1px solid rgba(255,255,255,0.65);
border-radius: 50%
}
#container .about-video-type2 .btn-video:hover {
background: rgba(255,255,255,0.15)
}
#container .about-skill-type2 {
background: #fafafa
}
#container .about-skill-type2 .skill-grid>.info h3 {
font-size: 28px;
font-weight: 500;
color: #333;
margin-bottom: 10px
}
#container .about-skill-type2 .skill-grid>.info p {
font-size: 16px;
color: #7b7b7b;
line-height: 1.85;
text-align: justify;
text-align-last: left;
word-break: keep-all
}
#container .about-skill-type2 .skill-grid>.skill .skill-wrap {
position: relative;
margin-bottom: 20px;
padding-bottom: 5px;
overflow-x: hidden;
overflow-y: visible
}
#container .about-skill-type2 .skill-grid>.skill .skill-wrap:before {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 2px;
background: #ddd
}
#container .about-skill-type2 .skill-grid>.skill .skill-wrap h4 {
font-size: 14px;
font-weight: normal;
color: #333
}
#container .about-skill-type2 .skill-grid>.skill .skill-wrap .progress-bar {
position: relative;
top: 5px;
height: 2px;
background: #333
}
#container .about-skill-type2 .skill-grid>.skill .skill-wrap .progress-bar>.percent {
position: absolute;
top: -20px;
right: 0;
font-size: 13px;
color: #888
}
#container .about-skill-type2 .skill-grid>.skill .skill-wrap:last-child {
margin-bottom: 0
}
#container .about-count-type2 {
padding: 120px 0;
background-image: url(../../img/about_count_bg.jpg)
}
#container .about-count-type2 .count-items li {
text-align: center
}
#container .about-count-type2 .count-items li .icon {
width: 90px;
height: 90px;
font-size: 48px;
color: #fff;
line-height: 90px;
margin: auto auto 20px auto;
border: 2px solid rgba(255,255,255,0.15);
border-radius: 50%
}
#container .about-count-type2 .count-items li .count {
font-size: 36px;
font-weight: 700;
color: #fff;
letter-spacing: 4px
}
#container .about-count-type2 .count-items li h4 {
font-size: 15px;
font-weight: 300;
color: #fff;
margin-top: 5px
}
#container .about-count-type2 .count-items li em {
display: none;
font-size: 15px;
color: #fff;
margin-left: 10px
}
#container .about-team-type2 .owl-item>.item {
position: relative;
overflow: hidden
}
#container .about-team-type2 .owl-carousel .owl-dots {
margin-top: 30px;
text-align: center
}
#container .about-team-type2 .owl-carousel .owl-dots>.owl-dot {
display: inline-block;
width: 10px;
height: 10px;
margin: 0 3px;
border-radius: 50%;
background: #ddd;
-webkit-transition: background 0.3s ease;
transition: background 0.3s ease
}
#container .about-team-type2 .owl-carousel .owl-dots>.owl-dot:hover, #container .about-team-type2 .owl-carousel .owl-dots>.owl-dot.active {
background:#4b4b4b
}
#container .about-team-type2 .owl-item>.item .overlay {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
padding: 30px;
background: rgba(255, 166, 0,0.85);
z-index: 5;
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(20px);
transform: translateY(20px);
-webkit-transition: all 0.2s ease-in;
transition: all 0.2s ease-in
}
#container .about-team-type2 .owl-item>.item .overlay * {
color: #fff
}
#container .about-team-type2 .owl-item>.item:hover .overlay {
opacity: 1;
visibility: visible;
transform: translateY(0)
}
#container .about-team-type2 .owl-item>.item .overlay h4 {
font-size: 15px;
font-weight: 700
}
#container .about-team-type2 .owl-item>.item .overlay span {
font-size: 12px
}
#container .about-team-type2 .owl-item>.item .overlay .sns-link {
position: absolute;
bottom: 30px;
left: 30px;
font-size: 0
}
#container .about-team-type2 .owl-item>.item .overlay .sns-link>li {
display: inline;
font-size: 16px;
margin-right: 10px
}
#container .about-team-type2 .owl-item>.item .overlay .sns-link>li>a {
-webkit-transition: opacity 0.25s;
transition: opacity 0.25s
}
#container .about-team-type2 .owl-item>.item .overlay .sns-link>li>a:hover {
opacity: 0.5
}
/* promotion video modal */
#modalPromotion {
position: fixed;
display: none;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: 9998
}
#modalPromotion>.overlay {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: #000;
opacity: 0.65;
z-index: 1
}
#modalPromotion>.popup-inner {
position: absolute;
top: 50%;
left: 50%;
width: 800px;
height: 500px;
margin: -250px 0 0 -400px;
opacity: 0;
-webkit-box-shadow: 0 3px 20px 10px rgba(0,0,0,0.15);
box-shadow: 0 3px 20px 10px rgba(0,0,0,0.15);
-webkit-transform: translateY(-40px);
transform: translateY(-40px);
-webkit-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
z-index: 5
}
#modalPromotion>.popup-inner iframe {
width: 100% !important;
height: 100% !important;
border: none
}
#modalPromotion.show>.popup-inner {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0)
}
/* history - type1 */
#container .history-section .year-wrap {
position: relative;
padding-bottom: 50px
}
#container .history-section .year-wrap:after {
content: '';
clear: both;
display: block
}
#container .history-section .year-wrap:before {
position: absolute;
top: 0;
left: 50%;
content: '';
width: 1px;
height: 100%;
margin-left: 1px;
background: #e2e2e2;
z-index: 10
}
#container .history-section .year-wrap:last-child {
padding-bottom: 200px
}
#container .history-section .year-wrap>.year {
position: relative;
width: 80px;
height: 80px;
margin: auto;
font-size: 24px;
font-weight: 300;
color: #fff;
text-align: center;
line-height: 80px;
border-radius: 50%;
background: #333;
z-index: 20
}
#container .history-section .year-wrap>ul {
position: relative
}
#container .history-section .year-wrap>ul:after {
content: '';
clear: both;
display: block
}
#container .history-section .year-wrap>ul>li {
position: relative;
margin-top: 40px;
padding-left: 55%
}
#container .history-section .year-wrap>ul>li:before {
position: absolute;
top: 5px;
left: 50%;
content: '';
width: 16px;
height: 16px;
margin-left: -7px;
border: 2px solid #333;
border-radius: 50%;
background: #fff;
z-index: 20
}
#container .history-section .year-wrap>ul>li.left {
text-align: right;
padding-left: 0;
padding-right: 55%
}
#container .history-section .year-wrap>ul>li .inner {
margin: auto
}
#container .history-section .year-wrap>ul>li h3 {
font-size: 26px;
font-weight: normal;
color: #333;
margin-bottom: 20px
}
#container .history-section .year-wrap>ul>li dl dt, #container .history-section .year-wrap>ul>li dl dd {
font-size: 15px
}
#container .history-section .year-wrap>ul>li dl dt {
font-weight: normal;
color: #8a8a8a;
letter-spacing: 1px;
margin-bottom: 15px
}
#container .history-section .year-wrap>ul>li dl dd {
color: #6a6a6a;
line-height: 1.6
}
#container .history-section .finish-box {
position: absolute;
bottom: 0;
left: 50%;
width: 140px;
height: 140px;
margin-left: -70px;
text-align: center;
border: 6px solid #f2f2f2;
border-radius: 50%;
background: #333;
z-index: 20
}
#container .history-section .finish-box:before {
display: inline-block;
content: '';
height: 100%;
vertical-align: middle
}
#container .history-section .finish-box p {
display: inline-block;
font-size: 16px;
font-weight: 500;
color: #fff;
line-height: 1.65;
vertical-align: middle
}
/* history - type2 */
#container .history-section-type2 .history-wrap {
position: relative
}
#container .history-section-type2 .history-wrap:before {
content: '';
position: absolute;
top: 0;
left: 50%;
width: 1px;
height: 100%;
background: #e8e8e8
}
#container .history-section-type2 .history-wrap>.history-item {
position: relative;
float: right;
margin-right: 120px;
margin-top: -50px;
padding-right: 50%;
text-align: right
}
#container .history-section-type2 .history-wrap>.history-item:first-child {
margin-top: 60px
}
#container .history-section-type2 .history-wrap>.history-item:last-child {
margin-bottom: 110px
}
#container .history-section-type2 .history-wrap>.history-item.right {
margin-left: 120px;
margin-right: 0;
padding-left: 50%;
padding-right: 0;
text-align: left
}
#container .history-section-type2 .history-wrap>.history-item:before {
content: '';
position: absolute;
top: 20px;
right: 50%;
width: 90px;
height: 1px;
margin-right: -60px;
background: #ddd
}
#container .history-section-type2 .history-wrap>.history-item:after {
content: '';
position: absolute;
top: 17px;
right: 50%;
width: 8px;
height: 8px;
margin-right: 22px;
border-radius: 50%;
background: #333
}
#container .history-section-type2 .history-wrap>.history-item.right:before {
left: 50%;
margin-left: -60px;
margin-right: 0
}
#container .history-section-type2 .history-wrap>.history-item.right:after {
left: 50%;
right: auto;
margin-left: 22px;
margin-right: 0
}
#container .history-section-type2 .history-wrap>.history-item .connect-dot {
position: absolute;
top: 12px;
right: 50%;
width: 18px;
height: 18px;
margin-right: -69px;
border: 1px solid #333;
border-radius: 50%;
background: #fff
}
#container .history-section-type2 .history-wrap>.history-item .connect-dot:before {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 6px;
height: 6px;
margin: -3px 0 0 -3px;
border-radius: 50%;
background: #333
}
#container .history-section-type2 .history-wrap>.history-item.right .connect-dot {
left: 50%;
right: auto;
margin-left: -69px;
margin-right: 0
}
#container .history-section-type2 .history-wrap>.history-item h3 {
font-size: 42px;
font-weight: 300;
color: #333;
line-height: 1;
margin-bottom: 20px
}
#container .history-section-type2 .history-wrap>.history-item ul>li {
line-height: 2
}
#container .history-section-type2 .history-wrap>.history-item ul>li:before, #container .history-section-type2 .history-wrap>.history-item ul>li:after {
content: '';
display: block
}
#container .history-section-type2 .history-wrap>.history-item ul>li:after {
clear: both
}
#container .history-section-type2 .history-wrap>.history-item ul>li strong {
float: right;
width: 30px;
font-size: 15px;
font-weight: 700;
color: #aaa
}
#container .history-section-type2 .history-wrap>.history-item ul>li span {
float: right;
display: block;
width: calc(100% - 30px);
font-size: 15px;
color: #777
}
#container .history-section-type2 .history-wrap>.history-item.right ul>li strong {
float: left
}
#container .history-section-type2 .history-wrap>.history-item.right ul>li span {
float: left
}
#container .history-section-type2 .history-wrap>.history-item img {
margin-top: 30px
}
/* location */
#container .location-tab {
display: table;
width: 100%;
margin-bottom: 50px;
border-collapse: collapse;
table-layout: fixed
}
#container .location-tab>li {
position: relative;
display: table-cell;
font-size: 18px;
color: #8a8a8a;
text-align: center;
height: 60px;
border: 1px solid #e7e7e7;
vertical-align: middle;
cursor: pointer;
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease
}
#container .location-tab>li:hover {
background: #fafafa
}
#container .location-tab>li:after {
content: '';
position: absolute;
bottom: -21px;
left: 50%;
margin-left: -10px;
border-style: solid;
border-width: 10px;
border-color: transparent;
-webkit-transition: border-color 0.3s ease;
transition: border-color 0.3s ease
}
#container .location-tab>li.active {
font-weight: 700;
color: #fff;
/*border-color: #005b96; 
background: #005b96; ¿¡Æç±âº»°ª*/
border-color: #666; 
background: #666;
}
#container .location-tab>li.active:after {
/*border-top-color: #005b96 ¿¡Æç±âº»°ª*/
border-top-color: #666;
}
#container .location-tab-con {
display: none
}
#container .location-info {
margin-bottom: 30px;
padding: 40px 0;
border-top: 1px solid #e2e2e2;
border-bottom: 1px solid #e2e2e2
}
#container .location-info>dl>dt, #container .location-info>dl>dd {
line-height: 2
}
#container .location-info>dl>dt {
float: left;
clear: left;
display: block;
max-width: 80px;
min-width: 60px;
width: 5%;
font-weight: 700;
color: #333
}
#container .location-info>dl>dd {
float: left;
padding-left: 10px;
color: #8a8a8a
}
#container .location-map iframe {
width: 100% !important;
height: 500px
}
/* business overview */
#container .business-overview-top {
}
#container .business-overview-top .business-items>li {
margin-bottom: 40px;
vertical-align: top
}
#container .business-overview-top .business-items>li .inner-box {
padding: 30px;
background: #fff;
-webkit-box-shadow: 0 22px 68px -9px rgba(0,0,0,0.1);
box-shadow: 0 22px 68px -9px rgba(0,0,0,0.1)
}
#container .business-overview-top .business-items>li .inner-box h3 {
font-size: 20px;
font-weight: 300;
color: #333;
margin-bottom: 20px
}
#container .business-overview-top .business-items>li .inner-box h3 i {
position: relative;
top: 4px;
font-size: 30px;
color: #333;
margin-right: 10px
}
#container .business-overview-top .business-items>li .inner-box p {
font-size: 14px;
color: #aaa;
line-height: 1.8;
word-break: keep-all
}
/*¿¡Æç ȸ»ç¼Ò°³*/
#container section .container .business-items>li {
margin-bottom: 40px;
vertical-align: top
}
#container section .container .business-items>li .inner-box {
padding: 30px;
background: #fff;
-webkit-box-shadow: 0 22px 68px -9px rgba(0,0,0,0.1);
box-shadow: 0 22px 68px -9px rgba(0,0,0,0.1)
}
#container section .container .business-items>li .inner-box h3 {
font-size: 20px;
font-weight: 300;
color: #333;
margin-bottom: 20px
}
#container section .container .business-items>li .inner-box h3 i {
position: relative;
top: 4px;
font-size: 30px;
color: #333;
margin-right: 10px
}
#container section .container .business-items>li .inner-box p {
font-size: 14px;
color: #aaa;
line-height: 1.8;
word-break: keep-all;
/*text-align: justyfy*/
}
/*¿¡Æç ȸ»ç¼Ò°³*/
#container .business-overview-mid {
background-image: url(../../img/business_overview_bg.jpg)
}
#container .business-overview-mid:before {
display: none
}
#container .business-overview-mid .mid-title {
margin-bottom: 50px
}
#container .business-overview-mid .mid-title h3 {
font-size: 38px;
font-weight: 300;
color: #333;
margin-bottom: 15px
}
#container .business-overview-mid .mid-title p {
font-size: 16px;
color: #565656;
line-height: 1.65
}
#container .business-overview-mid .business-desc>div .title {
margin-bottom: 20px;
padding-bottom: 15px;
border-bottom: 1px solid #333
}
#container .business-overview-mid .business-desc>div .title span {
display: block;
font-size: 13px;
font-weight: 300;
color: #999
}
#container .business-overview-mid .business-desc>div .title h4 {
font-size: 20px;
font-weight: 700;
color: #454545
}
#container .business-overview-mid .business-desc>div dl dt {
font-size: 16px;
font-weight: 500;
color: #333;
letter-spacing: -0.5px;
margin-bottom: 5px
}
#container .business-overview-mid .business-desc>div dl dd {
color: #7b7b7b;
line-height: 1.75;
letter-spacing: -0.5px;
text-align: justify;
text-align-last: left;
margin-bottom: 30px
}
#container .business-detail .detail-items {
white-space: nowrap;
overflow: hidden
}
#container .business-detail .detail-items>li {
position: relative;
width: 33.333%;
height: 500px;
text-align: center;
overflow: hidden;
transition: width 0.3s ease-out
}
#container .business-detail .detail-items>li .bg {
position: absolute;
top: 0;
left: 50%;
width: 600px;
margin-left: -300px
}
#container .business-detail .detail-items>li .bg:before {
position: absolute;
top: 0;
left: 0;
content: '';
width: 100%;
height: 100%;
background: #000;
opacity: 0.2;
transition: opacity 0.3s ease-out;
z-index: 10
}
#container .business-detail .detail-items>li .bg>img {
display: block;
max-width: 100%
}
#container .business-detail .detail-items>li .info-box {
position: relative;
top: 40%;
padding: 0 30px;
transition: top 0.3s ease-out;
z-index: 20
}
#container .business-detail .detail-items>li .info-box span {
display: block;
font-size: 13px;
color: #333;
margin: 15px 0 5px
}
#container .business-detail .detail-items>li .info-box h3 {
font-size: 20px;
font-weight: 700;
color: #fff;
margin-bottom: 20px
}
#container .business-detail .detail-items>li .info-box p {
font-size: 14px;
color: #fff;
line-height: 1.75;
white-space: normal;
word-break: keep-all;
width: 300px;
margin: auto auto 30px;
opacity: 0;
transition: opacity 0.3s ease-out
}
/* business field */
#container .business-field {
background: #f7f7f7
}
#container .business-field .field-items li .inner-box {
position: relative;
padding: 50px;
text-align: center;
background: #fff
}
#container .business-field .field-items li .inner-box .icon {
font-size: 56px;
color: #333
}
#container .business-field .field-items li .inner-box>h3 {
font-size: 20px;
font-weight: 700;
color: #333;
margin: 20px 0 10px
}
#container .business-field .field-items li .inner-box>p {
color: #7a7a7a;
line-height: 1.8;
word-break: keep-all
}
#container .business-field .field-items li .inner-box .overlay {
position: absolute;
top: 10px;
left: 10px;
bottom: 10px;
right: 10px;
padding: 30px;
background: rgba(255, 166, 0, 0.9);
opacity: 0;
visibility: hidden;
-webkit-transform: scale(0.75);
transform: scale(0.75);
-webkit-transition: all 0.4s ease;
transition: all 0.4s ease
}
#container .business-field .field-items li:hover .inner-box .overlay {
opacity: 1;
visibility: visible;
-webkit-transform: scale(1);
transform: scale(1)
}
#container .business-field .field-items li .inner-box .overlay p {
font-size: 13px;
color: #fff;
line-height: 1.8;
padding-top: 20%
}
#container .business-field .field-items li .inner-box .overlay a {
display: inline-block;
margin-top: 30px;
padding: 10px 25px;
font-size: 12px;
font-weight: 700;
color: #000;
border-radius: 3px;
background: #fff;
-webkit-transition: all 0.3s;
transition: all 0.3s
}
#container .business-field .field-items li .inner-box .overlay a:hover {
color: #fff;
background: #000
}
#container .business-customer {
background: url(../../img/customer_review_bg.jpg) center no-repeat;
background-size: cover
}
#container .business-customer h3 {
font-size: 14px;
font-weight: normal;
color: #fff;
letter-spacing: 3px;
text-align: center;
margin-bottom: 30px
}
#container .business-customer .owl-carousel blockquote {
color: #fff;
text-align: center;
width: 70%;
margin: auto
}
#container .business-customer .owl-carousel blockquote .review-text {
font-size: 32px;
font-weight: 300;
line-height: 1.55;
word-break: keep-all
}
#container .business-customer .owl-carousel blockquote .review-text:before, #container .business-customer .owl-carousel blockquote .review-text:after {
font-family: serif;
opacity: 0.35
}
#container .business-customer .owl-carousel blockquote .review-text:before {
content: '¡°'
}
#container .business-customer .owl-carousel blockquote .review-text:after {
content: '¡±'
}
#container .business-customer .owl-carousel blockquote .review-name {
margin-top: 30px;
font-style: italic
}
#container .business-customer .owl-carousel blockquote .review-name:before {
content: '';
display: inline-block;
width: 12px;
height: 1px;
margin-right: 3px;
background: #fff;
vertical-align: 5px
}
#container .business-customer .owl-carousel .owl-nav>div {
position: absolute;
top: 50%;
width: 50px;
height: 50px;
font-size: 48px;
color: #fff;
line-height: 50px;
margin-top: -35px;
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease
}
#container .business-customer .owl-carousel .owl-nav>.owl-prev {
left: 0
}
#container .business-customer .owl-carousel .owl-nav>.owl-prev:hover {
left: -10px
}
#container .business-customer .owl-carousel .owl-nav>.owl-next {
right: 0
}
#container .business-customer .owl-carousel .owl-nav>.owl-next:hover {
right: -10px
}
#container .business-customer .owl-carousel .owl-dots {
font-size: 0;
text-align: center;
padding-top: 40px
}
#container .business-customer .owl-carousel .owl-dots>.owl-dot {
display: inline-block;
font-size: 13px;
width: 14px;
height: 14px;
margin: 0 5px;
border: 2px solid #333;
border-radius: 50%;
-webkit-transition: all 0.25s ease;
transition: all 0.25s ease
}
#container .business-customer .owl-carousel .owl-dots>.owl-dot.active {
background: #333
}
#container .business-process .process-grid li {
font-size: 14px;vertical-align:top
margin-bottom: 40px
}
#container .business-process .process-grid li>span {
display: block;
font-size: 48px;
font-weight: 300;
color: #e9e9e9
}
#container .business-process .process-grid li>span:after {
content: '';
position: relative;
display: inline-block;
width: 20px;
height: 1px;
margin-left: 10px;
background: #e7e7e7
}
#container .business-process .process-grid li>h3 {
font-size: 18px;
font-weight: 700;
color: #454545;
margin-bottom: 5px
}
#container .business-process .process-grid li>p {
font-size: 14px;
color: #7a7a7a;
line-height: 1.8
}
#container .business-contact {
text-align: center;
background-image: url(../../img/business_contact_bg.jpg)
}
#container .business-contact .caption {
margin-bottom: 30px
}
#container .business-contact .caption h2 {
font-size: 28px;
font-weight: 300;
color: #fff;
line-height: 1.5
}
#container .business-contact .caption p {
color: rgba(255,255,255,0.65);
line-height: 1.7;
margin-top: 20px
}
#container .business-contact .btn-contact {
display: inline-block;
padding: 12px 30px;
color: #333;
border-radius: 3px;
background: #fff;
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease
}
#container .business-contact .btn-contact i {
margin-left: 5px
}
#container .business-contact .btn-contact:hover {
background: #e7e7e7
}
#container .business-contact .btn-contact:active {
background: #ccc
}
/* partners introduction */
#container .partners-banner>li {
margin-bottom: 20px

}
/* search */
#search_table {margin:auto}
/* floating menu */
#floating_nav {display:none}
/*================================
TERMS COMMON (PRIVACY, TERM, EMAIL)
================================*/
#container .terms-area {
padding: 50px;
border: 1px solid #e9e9e9;
background: #fafafa
}
#container .terms-area h3 {
font-size: 20px;
font-weight: 700;
line-height: 1.5;
color: #333;
margin-bottom: 15px
}
#container .terms-area h3.center {
text-align: center
}
#container .terms-area p {
font-size: 15px;
color: #888;
line-height: 1.8;
word-break: keep-all;
margin-bottom: 30px
}
#container .terms-area strong {
font-weight: 700;
color: #454545
}
/*================================
PARALLAX COMMON
================================*/
.parallax {
position: relative;
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed;
background-size: cover
}
.parallax:before {
content: '';
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(0,0,0,0.45)
}
/*================================
BUTTON STYLE
================================*/
.btn-outline:focus, .btn-outline:active {
box-shadow: 0 0 3px 2px rgba(43, 154, 226, 0.75)
}
/*================================
MEDIA QUERY
================================*/
@media all and (min-width:1366px) {
/* floating menu *//*¿¡Æç Ç÷ÎÆø޴º ¹è°æ»ö Åõ¸íÀ¸·Îº¯°æ background-color:#fff ¿¡¼­ transparent·Î º¯°æÇÔ*/
#floating_nav {position:absolute; display:block; top:100px; left:100px; width:160px; padding-right:30px; border-right:none; background-color:transparent; z-index:900}
#floating_nav > ul > li > a {display:block; font-size:17px; font-weight:500; color:#2b2b2b; padding-bottom:10px; border-bottom:1px solid #e9e9e9}
#floating_nav > ul > li > ul {padding:10px 0}
#floating_nav > ul > li > ul > li {margin-bottom:5px}
#floating_nav > ul > li > ul > li > a {color:#8a8a8a; transition:color 0.25s}
#floating_nav > ul > li > ul > li > a:before {content:'- '}
#floating_nav > ul > li > ul > li > a:hover {color:#454545}
#floating_nav.sticky {position:fixed}
}

/* PC */
@media all and (min-width:1025px) {
/* container */
#container {min-height:800px}
/* Sub Visual */
#subVisual nav>.container>ul {
display: table !important;
width: 100%;
table-layout: fixed
}
#subVisual nav>a {
display: none
}
/* about company - type1 */
#container .about-section2 .team-info:hover>li {
opacity: 0.5
}
#container .about-section2 .team-info>li:hover {
opacity: 1
}
#container .about-section2 .team-info>li:hover:before {
background: #333
}
/* business overview */
#container .business-overview-top .business-items>li:nth-last-child(3), #container .business-overview-top .business-items>li:nth-last-child(2), #container .business-overview-top .business-items>li:last-child {
margin-bottom: 0
}
#container .business-detail .detail-items>li:hover .bg:before {
opacity: 0.5
}
#container .business-detail .detail-items>li:hover .info-box {
top: 25%
}
#container .business-detail .detail-items>li:hover .info-box p {
opacity: 1
}
#container .business-detail .detail-items>li.on {
width: 42%
}
#container .business-detail .detail-items>li.off {
width: 29%
}
/* business field */
#container .business-process .process-grid li:nth-last-child(3), #container .business-process .process-grid li:nth-last-child(2), #container .business-process .process-grid li:last-child {
margin-bottom: 0
}
#container .business-contact:before {
-webkit-transition: all 0.4s ease;
transition: all 0.4s ease
}
#container .business-contact .caption h2 {
-webkit-transform: translateY(60px);
transform: translateY(60px);
-webkit-transition: all 0.4s ease;
transition: all 0.4s ease
}
#container .business-contact .caption p {
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(30px);
transform: translateY(30px);
-webkit-transition: all 0.4s ease;
transition: all 0.4s ease
}
#container .business-contact .btn-wrap {
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(30px);
transform: translateY(30px);
-webkit-transition: all 0.4s ease;
transition: all 0.4s ease
}
#container .business-contact:hover .caption h2 {
-webkit-transform: translateY(0);
transform: translateY(0)
}
#container .business-contact:hover .caption p, #container .business-contact:hover .btn-wrap {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0);
transform: translateY(0)
}
#container .business-contact:hover:before {
background: rgba(0,0,0,0.65)
}
/* partners introduction */
#container .partners-banner>li:nth-last-child(6), #container .partners-banner>li:nth-last-child(5), #container .partners-banner>li:nth-last-child(4), #container .partners-banner>li:nth-last-child(3), #container .partners-banner>li:nth-last-child(2), #container .partners-banner>li:last-child {
margin-bottom: 0
}
}
/* TABLET */
@media all and (max-width:1024px) {
/* Sub Visual */
#subVisual {
padding: 120px 0;
overflow: visible;
background-position: center !important;
background-attachment: scroll !important
}
#subVisual nav {
background: transparent
}
#subVisual nav>a {
position: relative;
display: block;
width: 90%;
margin: auto;
padding: 0 30px;
font-size: 15px;
color: #555;
height: 50px;
line-height: 50px;
background: #fff
}
#subVisual nav>a:after {
content: '\f104';
position: absolute;
right: 30px;
font-family: 'Ionicons';
font-size: 14px;
color: #333;
-webkit-transition: transform 0.3s ease;
transition: transform 0.3s ease
}
#subVisual nav.open>a:after {
-webkit-transform: rotate(180deg);
transform: rotate(180deg)
}
#subVisual nav>.container>ul {
position: absolute;
display: none;
top: 100%;
left: 50%;
width: 90%;
margin-left: -45%;
border-left: 1px solid #e9e9e9;
border-right: 1px solid #e9e9e9;
z-index: 10
}
#subVisual nav>.container>ul>li {
display: block;
height: auto
}
#subVisual nav>.container>ul>li:before {
display: none
}
#subVisual nav>.container>ul>li:first-child>a {
border-top: 1px solid #e9e9e9
}
#subVisual nav>.container>ul>li>a {
display: block;
width: 100%;
height: 50px;
padding: 0 30px;
font-size: 14px;
font-weight: normal;
color: #7a7a7a;
text-align: left;
line-height: 49px;
border-bottom: 1px solid #e9e9e9;
background: #fff
}
#subVisual nav>.container>ul>li.active>a, #subVisual nav>.container>ul>li>a:active, #subVisual nav>.container>ul>li>a:focus {
font-weight: 700;
background: #fafafa
}
/* about company - type1 */
#container .about-main {
padding: 130px 0
}
#container .about-main h3 {
font-size: 21px;
margin-bottom: 70px
}
#container .about-main .company-info {
padding: 0 30px
}
#container .about-section2 .team-info>li {
margin-bottom: 50px
}
/* about company - type2 */
#container .about-count-type2 .count-items li .count {
font-size: 34px
}
#modalPromotion>.popup-inner {
width: 90%;
margin: -250px 0 0 -45%;
}
/* location */
#container .location-tab>li {
height: 50px
}
/* business overview */
#container .business-overview-top .business-items>li:nth-last-child(2), #container .business-overview-top .business-items>li:last-child {
margin-bottom: 0
}
#container .business-detail .detail-items>li .bg:before {
opacity: 0.5
}
#container .business-detail .detail-items>li .info-box {
top: 20%
}
#container .business-detail .detail-items>li .info-box h3 {
font-size: 18px
}
#container .business-detail .detail-items>li .info-box p {
width: 100%;
padding: 0;
opacity: 1
}
/* business field */
#container .business-field .field-items li .inner-box {
padding: 30px
}
#container .business-field .field-items li .inner-box>h3 {
font-size: 18px;
margin-top: 10px
}
#container .business-field .field-items li .inner-box .overlay {
padding: 20px
}
#container .business-field .field-items li .inner-box .overlay p {
font-size: 12px;
padding-top: 15%
}
#container .business-field .field-items li .inner-box .overlay a {
margin-top: 20px
}
#container .business-field .field-items li .inner-box .overlay a:hover {
color: #fff;
background: #000
}
#container .business-customer .owl-carousel blockquote .review-text {
font-size: 26px
}
#container .business-customer .owl-carousel .owl-nav>div {
margin-top: -45px
}
#container .business-process .process-grid li {
margin-bottom: 40px !important
}
#container .business-process .process-grid li:nth-last-child(2), #container .business-process .process-grid li:last-child {
margin-bottom: 0 !important
}
/* partners introduction */
#container .partners-banner>li:nth-last-child(3), #container .partners-banner>li:nth-last-child(2), #container .partners-banner>li:last-child {
margin-bottom: 0
}
}
/* MOBILE */
@media all and (max-width:768px) {
#subVisual .visual-text>h2 {
font-size: 36px;
margin-bottom: 5px
}
#subVisual .visual-text>h3 {
font-size: 16px
}
#subVisual nav>a {
padding: 0 15px
}
#subVisual nav>a:after {
right: 15px
}
#subVisual nav>.container>ul {
max-height: 200px;
overflow: auto
}
#subVisual nav>.container>ul::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
background-color: #f5f5f5
}
#subVisual nav>.container>ul::-webkit-scrollbar {
width: 5px;
background-color: #f5f5f5
}
#subVisual nav>.container>ul::-webkit-scrollbar-thumb {
background-color: #333
}
#subVisual nav>.container>ul>li>a {
padding: 0 15px
}
/* Section Common */
section.sub-section {
padding: 60px 0
}
section.sub-section .sectionTitle:after {
margin: 25px auto 50px;
width: 70%;
max-width: 260px
}
section.sub-section .sectionTitle h2 {
font-size: 28px;
}
section.sub-section .sectionTitle p {
font-size: 14px
}
section.sub-section .subTitle {
padding: 30px 0
}
section.sub-section .subTitle h2 {
font-size: 24px
}
section.sub-section .subTitle p {
font-size: 14px
}
/* about - greet */
section.sub-section .greet-grid .text-area h3 {
font-size: 28px
}
section.sub-section .greet-grid .text-area p {
font-size: 12px;
word-break: keep-all
}
section.sub-section .greet-grid .text-area .sign {
font-size: 16px
}
section.sub-section .greet-grid .text-area .sign span {
margin-left: 10px;
font-size: 20px
}
section.sub-section .greet-grid .img-area {
margin-bottom: 40px
}
/* about company - type1 */
#container .about-main {
padding: 60px 15px
}
#container .about-main h3 {
font-size: 16px;
margin: auto auto 35px;
width: 80%;
word-break: keep-all
}
#container .about-main .company-info>li {
display: block;
padding: 35px 15px;
border-bottom: 1px solid rgba(255, 255, 255, 0.55);
border-right: none
}
#container .about-main .company-info>li:first-child {
border-left: none
}
#container .about-main .company-info>li:last-child {
border-bottom: none
}
#container .about-main .company-info>li i {
display: inline-block;
font-size: 36px;
height: 50px
}
#container .about-main .company-info>li h4 {
font-size: 15px;
margin: 5px 0 10px
}
#container .about-main .company-info>li p {
font-size: 13px;
word-break: keep-all
}
#container .about-section1 .about-desc {
font-size: 15px;
margin-bottom: 35px
}
#container .about-section1 .about-info {
margin-bottom: 30px
}
#container .about-section1 .about-info dt, #container .about-section1 .about-info dd {
font-size: 12px;
line-height: 1
}
#container .about-section1 .about-info dt {
float: none;
width: 100%;
font-size: 14px;
border-top: 1px solid #333;
border-bottom: 1px solid #aaa
}
#container .about-section1 .about-info dd {
margin: 0 0 40px 0px;
border-top: none;
border-bottom: 1px solid #e2e2e2
}
#container .about-section2 .team-info>li:before {
margin-bottom: 25px
}
#container .about-section2 .team-info>li .detail h3 {
font-size: 15px;
margin: 25px 0 5px
}
#container .about-section2 .team-info>li .detail .subtit {
font-size: 12px;
margin-bottom: 15px
}
#container .about-section2 .team-info>li .detail p {
font-size: 12px
}
#container .about-section2 .team-info>li .detail .sns-link {
margin-top: 20px
}
#container .about-section2 .team-info>li .detail .sns-link>li {
font-size: 16px
}
#container .about-section2 .team-info>li .detail .sns-link>li a {
font-size: 16px
}
/* about company - type2 */
#container .about-grid-type2>li {
margin-bottom: 25px
}
#container .about-grid-type2>li:last-child {
margin-bottom: 0
}
#container .about-grid-type2 .inner-box {
padding: 30px 20px
}
#container .about-grid-type2 .inner-box h3 {
font-size: 16px
}
#container .about-grid-type2 .inner-box p {
font-size: 13px
}
#container .about-video-type2 {
padding: 90px 0
}
#container .about-video-type2 .caption {
margin-bottom: 35px
}
#container .about-video-type2 .caption h3 {
font-size: 28px;
line-height: 1.2;
margin-bottom: 10px
}
#container .about-video-type2 .caption p {
font-size: 11px
}
#container .about-video-type2 .btn-video {
font-size: 13px
}
#container .about-skill-type2 .skill-grid>.info {
margin-bottom: 35px
}
#container .about-skill-type2 .skill-grid>.info h3 {
font-size: 18px
}
#container .about-skill-type2 .skill-grid>.info p {
font-size: 13px
}
#container .about-skill-type2 .skill-grid>.skill .skill-wrap h4 {
font-size: 13px
}
#container .about-skill-type2 .skill-grid>.skill .skill-wrap .progress-bar>.percent {
font-size: 12px
}
#container .about-count-type2 {
padding: 80px 0
}
#container .about-count-type2 .count-items li {
margin-bottom: 30px
}
#container .about-count-type2 .count-items li:nth-last-child(2), #container .about-count-type2 .count-items li:last-child {
margin-bottom: 0
}
#container .about-count-type2 .count-items li .icon {
width: 75px;
height: 75px;
font-size: 38px;
line-height: 75px
}
#container .about-count-type2 .count-items li .count {
font-size: 24px
}
#container .about-count-type2 .count-items li h4 {
font-size: 13px
}
#container .about-count-type2 .count-items li em {
font-size: 13px
}
#container .about-team-type2 .owl-item>.item .overlay {
padding: 15px
}
#container .about-team-type2 .owl-item>.item .overlay h4 {
font-size: 14px
}
#container .about-team-type2 .owl-item>.item .overlay span {
font-size: 11px
}
#container .about-team-type2 .owl-item>.item .overlay .sns-link {
bottom: 15px;
left: 15px
}
/* promotion video modal */
#modalPromotion>.popup-inner {
height: 300px;
margin: -150px 0 0 -45%
}
/* history - type1 */
#container .history-section .year-wrap:before {
display: none
}
#container .history-section .year-wrap:last-child {
padding-bottom: 150px
}
#container .history-section .year-wrap>ul>li {
margin-top: 25px;
padding-left: 0 !important;
padding-right: 0 !important;
text-align: center !important
}
#container .history-section .year-wrap>ul>li:before {
position: relative;
left: 2px;
display: block;
width: 10px;
height: 10px;
margin: 0 auto 20px;
border-width: 1px
}
#container .history-section .year-wrap>ul>li h3 {
font-size: 18px;
margin-bottom: 15px
}
#container .history-section .year-wrap>ul>li dl dt, #container .history-section .year-wrap>ul>li dl dd {
font-size: 13px
}
#container .history-section .finish-box {
width: 100px;
height: 100px;
margin-left: -50px;
border-width: 4px
}
#container .history-section .finish-box p {
font-size: 13px
}
#container .history-section .finish-box:after {
position: absolute;
bottom: 96px;
left: 50%;
content: '';
width: 1px;
height: 35px;
background: #eee
}
/* history - type2 */
#container .history-section-type2 .history-wrap:before {
display: none
}
#container .history-section-type2 .history-wrap>.history-item {
float: none !important;
margin: 50px 0 0 0 !important;
padding: 0 !important;
text-align: center !important
}
#container .history-section-type2 .history-wrap>.history-item:last-child {
margin-bottom: 60px
}
#container .history-section-type2 .history-wrap>.history-item:before {
display: none
}
#container .history-section-type2 .history-wrap>.history-item:after {
display: none
}
#container .history-section-type2 .history-wrap>.history-item .connect-dot {
position: relative;
top: auto !important;
left: auto !important;
right: auto !important;
display: block;
margin: 15px auto !important
}
#container .history-section-type2 .history-wrap>.history-item h3 {
font-size: 28px;
margin-bottom: 15px
}
#container .history-section-type2 .history-wrap>.history-item ul>li strong {
float: none !important;
display: inline;
width: auto;
font-size: 13px
}
#container .history-section-type2 .history-wrap>.history-item ul>li span {
float: none !important;
display: inline;
width: auto;
font-size: 13px
}
/* location */
#container .location-tab {
display: table;
width: 100%;
border-collapse: collapse;
table-layout: fixed
}
#container .location-tab>li {
font-size: 15px;
height: 45px
}
#container .location-tab>li:after {
bottom: -13px;
margin-left: -3px;
border-width: 6px;
}
#container .location-info {
padding: 30px 0
}
#container .location-info>dl>dt {
font-size: 12px
}
#container .location-info>dl>dd {
font-size: 12px
}
#container .location-map iframe {
height: 300px
}
/* business overview */
#container .business-overview-top .business-items>li {
margin-bottom: 30px !important
}
#container .business-overview-top .business-items>li .inner-box {
padding: 20px;
border: 1px solid #e2e2e2;
-webkit-box-shadow: none;
box-shadow: none
}
#container .business-overview-top .business-items>li .inner-box h3 {
margin-bottom: 10px;
font-size: 16px
}
#container .business-overview-top .business-items>li .inner-box h3 i {
top: 2px;
font-size: 24px
}
#container .business-overview-top .business-items>li .inner-box p {
font-size: 12px
}
#container .business-overview-top .business-items>li:last-child {
margin-bottom: 0 !important
}

/*¿¡Æç ȸ»ç¼Ò°³ ¸ð¹ÙÀÏ*/
#container section .container .business-items>li {
margin-bottom: 30px !important
}
#container section .container .business-items>li .inner-box {
padding: 20px;
border: 1px solid #e2e2e2;
-webkit-box-shadow: none;
box-shadow: none
}
#container section .container .business-items>li .inner-box h3 {
margin-bottom: 10px;
font-size: 16px
}
#container section .container .business-items>li .inner-box h3 i {
top: 2px;
font-size: 24px
}
#container section .container .business-items>li .inner-box p {
font-size: 12px
}
/*¿¡Æç ȸ»ç¼Ò°³ ¸ð¹ÙÀÏ*/

#container .business-overview-mid .mid-title {
margin-bottom: 35px
}
#container .business-overview-mid .mid-title h3 {
font-size: 24px
}
#container .business-overview-mid .mid-title p {
font-size: 14px
}
#container .business-overview-mid .business-desc>div .title h4 {
font-size: 16px
}
#container .business-overview-mid .business-desc>div .title span {
font-size: 11px
}
#container .business-overview-mid .business-desc>div dl dt {
font-size: 14px
}
#container .business-overview-mid .business-desc>div dl dd {
font-size: 12px;
margin-bottom: 25px
}
#container .business-detail .detail-items>li {
display: block;
width: 100%;
margin-bottom: 15px
}
#container .business-detail .detail-items>li:last-child {
margin-bottom: 0
}
#container .business-detail .detail-items>li .bg {
left: 0;
margin-left: 0
}
#container .business-detail .detail-items>li .bg img {
width: 100%
}
#container .business-detail .detail-items>li .info-box {
padding: 0 20px
}
#container .business-detail .detail-items>li .info-box span {
font-size: 12px
}
#container .business-detail .detail-items>li .info-box h3 {
font-size: 16px
}
/* busines field */
#container .business-field .field-items li {
margin-bottom: 25px
}
#container .business-field .field-items li:last-child {
margin-bottom: 0
}
#container .business-field .field-items li .inner-box {
padding: 20px
}
#container .business-field .field-items li .inner-box>h3 {
font-size: 16px
}
#container .business-field .field-items li .inner-box>p {
font-size: 12px
}
#container .business-field .field-items li .inner-box .overlay p {
padding-top: 0
}
#container .business-customer h3 {
font-size: 12px
}
#container .business-customer .owl-carousel blockquote .review-text {
font-size: 18px
}
#container .business-customer .owl-carousel blockquote .review-name {
font-size: 12px
}
#container .business-customer .owl-carousel .owl-nav>div {
width: 30px;
height: 30px;
font-size: 28px;
margin-top: -60px
}
#container .business-process .process-grid li, #container .business-process .process-grid li:nth-last-child(2) {
margin-bottom: 30px !important
}
#container .business-process .process-grid li:last-child {
margin-bottom: 0 !important
}
#container .business-process .process-grid li>span {
font-size: 36px
}
#container .business-process .process-grid li>h3 {
font-size: 16px
}
#container .business-process .process-grid li>p {
font-size: 12px
}
#container .business-contact .caption h2 {
font-size: 20px
}
#container .business-contact .caption p {
font-size: 13px
}
#container .business-contact .btn-contact {
font-size: 12px
}
/* partners introduction */
#container .partners-banner>li {
margin-bottom: 20px !important
}
#container .partners-banner>li:nth-last-child(2), #container .partners-banner>li:last-child {
margin-bottom: 0 !important
}
/* TERMS COMMON (PRIVACY, TERM, EMAIL) */
#container .terms-area {
padding: 25px
}
#container .terms-area h3 {
font-size: 16px
}
#container .terms-area p {
font-size: 13px
}
/* parallax common */
.parallax {
background-position: center !important;
background-attachment: scroll !important
}
}