

#sub_wrap {width:100%;  position:relative; display:inline-block; background:#fff; }
.sub_vi_wrap {position:relative;width:100%;   float:left; height:200px;  box-sizing:border-box;   background:url('/common/img/sub_vi.png')  no-repeat top; background-size:cover;  text-align:Center;   }
.vi_bg2 {  box-sizing:border-box; background:url('/common/img/sub_vi2.png')  no-repeat top; background-size:cover;  }
.vi_bg3 {  box-sizing:border-box; background:url('/common/img/sub_vi3.png')  no-repeat top; background-size:cover;     }
.vi_bg4 {  box-sizing:border-box; background:url('/common/img/sub_vi4.png')  no-repeat top; background-size:cover;   }

.sub_vi_wrap .text {width:100%; margin:0 auto;   box-sizing:border-box; position:absolute;
top:50%; left:50%; transform: translate(-50%, -50%);color:#fff; z-index:99; text-align:center; }
 
 
.sub_vi_wrap .text h1 {font-size:1.8rem; font-family: 'Montserrat';}
.sub_vi_wrap .text p {color:#fff; margin-top:5px; font-size:.95rem; width:100%; box-sizing:border-box; padding:0 5%}

#sub_wrap .sub_con_wrap {width:100%; margin:0 auto; display:block;}
#sub_wrap .sub_con {width:100%; float:left;  background:#fff; padding:60px 3%; box-sizing:border-box; }

#sub_wrap .sub_con_wrap h2.guide {width: 100%;
   display:inline-block;
    font-size:6vw;
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 20px;
    color: #222;
}






.sub_menu {width:100%;   float:left; border-bottom:1px solid #ddd; box-sizing:border-box;}
.sub_menu ul {position:relative; display:flex; justify-content :center; width:100%; margin:0 auto; text-align:center; overflow-x: auto; overflow-y: hidden; white-space: nowrap; }
.sub_menu li {position:relative;   display:inline-block; vertical-align:top;}
.sub_menu li:last-child {margin-right:0}
 .sub_menu li:last-child:after {display:none}

.sub_menu li a {position:relative; font-weight:400; font-size:1.1rem; letter-spacing:0; color:#888; display:block; line-height:100%; height:45px; text-align:center; padding:0 15px; box-sizing:border-box; transition: all 0.3s ease-out; display:flex; justify-content:center; align-items:center; box-sizing:border-box;}
.sub_menu li a:after{position:absolute; display:block; bottom:-1px; left:0; content:""; overflow:hidden; width:0; height:2px; background:#333; transition: all 0.3s ease-out;}
 

.mn_on{display:block; color:#333 !important; font-weight:600 !important; text-decoration: none}
.mn_on:after{width:100% !important; transition: all 0.3s ease-out;}


/*컨텐츠*/

 
 
#sub_wrap .sub_con_wrap  {display:block; margin-bottom:15px; font-size:0.98rem; line-height:1.4em;  font-weight:400;  color:#444}

#sub_wrap .sub_con_wrap .company1 {font-size:1.05rem}
.company1 .top_box {width:100%; display:inline-block; box-sizing:border-box; padding:80px 0; text-align:center; position:relative; }
.company1 .top_box div.rgba_bg {width:100%; height:100%; position:absolute; top:0; left:0; background:rgba(0,0,0,.4); display:inline-block}
.company1 .top_box div.img_bg {width:100%; height:100%; position:absolute; top:0; left:0;   overflow:hidden  }
.company1 .top_box div.img_bg img {width:100%;  /* -moz-animation: bounce 20s infinite;
  -webkit-animation: bounce 20s infinite;
  animation: bounce 20s infinite; */}
.company1 .top_box p {color:#fff;  font-size:4vw; position:relative; z-index:99}
.company1 .top_box p img {width:40%; max-width:200px; margin-bottom:10px }

.company1 .top_box:after {content: '';
    width: calc(100% - 40px);
    height: calc(100% - 40px);
    display: inline-block;
    border: 1px solid rgba(255,255,255,.8);
    position: absolute;
    top: 20px;
    left: 20px;
    box-sizing: border-box; }

 
.company1 span.line1 {width:1px; height:20px; margin-top:-20px; background:rgba(255,255,255,.8); display:inline-block; z-index:99; position:Relative}
.company1 span.line2 {width:1px; height:25px; background-color:#333; display:inline-block}

.ceo_mesage {width:100%; display:inline-block; }
.ceo_mesage img {width:70%; margin-left:15%}
.ceo_mesage div {width:100%; margin-top:20px; margin-left:auto}
.ceo_mesage div  b {font-size:1.2em; display:block; font-weight:600 ; line-height:1.35em; color:#333}


.history {width:100%; position:relative; padding:10px 0; display:inline-block; margin-top:30px; }
.history li {width:100%; display:flex; margin-bottom:10px; position:relative; box-sizing:border-box; padding-left:30px;  justify-content:space-between; font-size:1rem }
.history li:last-child {margin-bottom:0}
.history li p:nth-child(1) {width:60px; font-weight:600}
.history li p:nth-child(2) {width:calc(100% - 70px);  }
.history li:after {content:''; width:18px; height:18px; background-color:#fff;  border:3px solid orange;  box-sizing:border-box;  position:absolute; border-radius:50%;  left:0; top:2px; z-index:99}
.history_line {width:1px; height:100%; display:inline-block; background-color:orange; position:absolute;  left:9px; top:0 }


.company3 .text_box { line-height:1.4em; color:#222}
.company3 .text_box b {font-size:1.1em; display:block; margin-bottom:5px; font-weight:600;   line-height:1.3em; color:#111}


#sub_wrap .sub_con.rnd  h3 {display:block; margin-bottom:5px; font-size:1.5rem; font-weight:800; letter-spacing:-.7px;  line-height:1.3em; color:#333}
#sub_wrap .sub_con.rnd  h3 span {letter-spacing:-.7px; }
#sub_wrap .sub_con.rnd  b {display:block; margin-bottom:23px; font-size:1.2rem; font-weight:600; letter-spacing:-.5px; color:#333; line-height:1.3em; }

#sub_wrap .sub_con.rnd  .text_box {width:100%; display:inline-block; background-color:#f9f9f9; padding:3%; box-sizing:border-box; }


.rnd2 ul.list {width:100%; display:flex; flex-wrap:wrap;  }
.rnd2 ul.list li {width:100%; display:flex; align-items:center; box-sizing:border-box;  border:1px solid #ddd; margin-bottom:-1px; margin-right:-1px; }
.rnd2 ul.list li img {width:30%; }
.rnd2 ul.list li div  {width:60%; margin-left:auto;  font-size:1rem; padding:20px }
.rnd2 ul.list li h3  {display:block; margin-bottom:5px;  font-size:1.15em  }
.rnd2 ul.list li p  {display:block; font-size:0.95rem  }
.rnd2 ul.list li p:nth-child(2) {color:#999; font-size:.9em}
.rnd2 ul.list li a {color:#333;   display:inline-block;  text-align:center; font-size:.95rem; letter-spacing:.5px; line-height:30px;}


.link_label {width:100%; height:50px;  display:inline-block  }



@keyframes bounce {
  0% { transform: translateY(0);}
  40% {transform: translateY(-60px);}
  80% {transform: translateY(0);}
}

 



@media all and (min-width:700px){
    .sub_vi_wrap .text h1 {font-size:3rem; }
    .sub_vi_wrap .text p { font-size:1rem}
    #sub_wrap .sub_con_wrap h2.guide {font-size:2rem;}
	.company1 .top_box p { font-size:2rem; }

  }
 
