


 /* 서브 ================================================================================= */
 


 .subVisual {
    width: 100%;
    height: 350px;
    overflow: hidden;
 }
 
 .subVisual .subBg {
    width: 100%;
    height: 300px;
    /*background-size: cover;*/
 }
 .subVisual .sub-bg-company {
    background: #b7dee8 url(../../images/sub/sub_01_bg.png) 50% 50% no-repeat;
    background-size: cover;
 }
 .subVisual .sub-bg-business {
   background: #f6cdab url(../../images/sub/sub_01_bg.png) 50% 50% no-repeat;
   background-size: cover;
}
.subVisual .sub-bg-board {
   background: #ccc url(../../images/sub/sub_03_bg.png) 50% 50% no-repeat;
   background-size: cover;
}
.subVisual .sub-bg-contact {
   background: #c3d69b url(../../images/sub/sub_01_bg.png) 50% 50% no-repeat;
   background-size: cover;
}
.subVisual .sub-bg-recruit {
   background: #c3d69b url(../../images/sub/sub_01_bg.png) 50% 50% no-repeat;
   background-size: cover;
}
.subVisual .sub-bg-login {
   background: #ccc url(../../images/sub/sub_01_bg.png) 50% 50% no-repeat;
   background-size: cover;
}

 .subimg {float:right; width:337px; height:220px;}
 
 /*
 .subVisual .subimg-company {
    background: url("../../images/sub/sub_v01.png?v=210608") 0 0 no-repeat;
 }
 .subVisual .subimg-product {
    background: url("../../images/sub/sub_v02.png?v=210608") 0 0 no-repeat;
 }
 .subVisual .subimg-board {
    background: url("../../images/sub/sub_v03.png?v=210608") 0 0 no-repeat;
 }
 .subVisual .subimg-location {
    background: url("../../images/sub/sub_v04.png?v=210608") 0 0 no-repeat;
 }
 .subVisual .subimg-login {
   background: url(../../images/sub/sub_v03.png) 0 0 no-repeat;
}
*/

 .subVisual > .subBg > ul {
    width: 1100px;
    margin: 0 auto;
    position: relative;
 }
 
 .subVisual .subText {
    position: absolute;
    top: 180px;
    left: 0px;
 }
 
 .subVisual .subText >.title {
    color: rgba(255,255,255,0.9);
    font-size: 36px;
    font-weight: bold;
 }
 
 .subVisual .subText > .subTitle {
   color: rgba(255,255,255,0.8);
    font-size: 24px;
    font-family: 500;
 }
 
 /* .location {
     box-sizing: border-box;
     width: 100%;
     height: 50px;
     background: #135bc7;
     z-index: 10;
     /* overflow: hidden; *
 } */

 .location {
   position: absolute;
   top: 300px;
   left: 0;
   box-sizing: border-box;
   width: 100%;
   background: #fff;
   /* background: -webkit-linear-gradient(45deg, #343774, #193574 80%); */
   z-index: 10;
   border-bottom: 1px solid #ddd;
   /* overflow: hidden; */
}
 
 .inner1200 {
     position: relative;
     width: 1200px;
     margin: 0 auto;
 }
 
 .location .home {
     display: block;
     float: left;
     width: 54px;
     height: 50px;
     border-left: 1px solid #ddd;
     border-right: 1px solid #ddd;
     background: url(../../images/sub/subTop_home.png) no-repeat center center;
 }
 
 .location .sub_menu {
     position: relative;
     float: left;
 }
 
 .location .sub_menu > a {
     display: block;
     width: 250px;
     box-sizing: border-box;
     height: 50px;
     line-height: 50px;
     font-size: 15px;
     font-weight: bold;
     color: #555; 
     border-right: 1px solid #ddd;
     padding-left: 30px;
     padding-right: 20px;
 }
 
 .location .sub_menu > a .subArrow {
     background: url(../../images/sub/arrow3.png) no-repeat right center;
     display: block;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
 }
 
 .location .sub_menu.on > a {
     background: #223f93;
     color: #fff;
 }
 
 .location .sub_menu.on > a .subArrow {
   background: url(../../images/sub/arrow3_w.png) no-repeat right center;
}

 .location .sub_menu .twoD {
     display: none;
     position: absolute;
     top: 50px;
     left: 0;
     box-sizing: border-box;
     width: 249px;
     background: #223f93;
     z-index: 1;
 }
 
 .location .sub_menu .twoD a {
     display: block;
     padding: 15px 30px;
     font-size: 16px;
     color: #fff;
     border-top: 1px solid rgba(255,255,255,0.2);
 }
 
 .location .sub_menu .twoD a:hover {
     color:#fff; 
     background:#223f93;
 }


/* .subCon {
    width: 100%;
    height: 100%;
} */

.subContents {
   position: relative;
   width: 100%;
   margin: 0 auto;
   /* text-align: center; */
   /* padding-bottom: 140px; */
   overflow: hidden;
   /* text-align: center; */
   /* padding-bottom: 140px; */
   overflow: hidden;
}

@media only screen and (max-width: 1260px) {  
   .subContents {
       /* width:800px; */
       width:100%;
       /* padding-bottom: 0px; */
   }
}

@media only screen and (max-width: 1024px) {  
   .subContents {
       /* width:800px; */
       width:100%;
       /* padding-bottom: 0px; */
   }
}

@media only screen and (max-width: 768px) { 
   .subContents {
       /* width:700px; */
       width:100%;
       /* padding-bottom: 0px; */
   }
 }

 @media only screen and (max-width: 480px) { 
    .subContents {
        /* width:400px; */
        width:100%;
        /* padding-bottom: 0px; */
    }
  }


.subContents > .title {
    margin: 0 auto;
    text-align: center;
    padding-top: 90px;
}

.subContents > .title > .title-bar {
   display: block;
   width: 4px;
   height: 25px;
   margin: 0 auto;
   text-align: center;
   margin-top: 40px;
   background: -webkit-linear-gradient(45deg, #4927c3, #21a59f 80%);
}

.subContents > .title.title_board {
   margin-bottom: 30px;
}

.subContents > .title > h2 {
   display: inline-block;
   color: #333;
   font-size: 34px;
   font-weight: bold;
}


.subCon {
   width: 100%;
   height: 100%;
}

.subCon .subTitle2 {
   width: 100%;
   height: 180px;
   margin: 0 auto;
}

.subCon .subTitle2 > h2{
   color: #222;
   font-size: 26px;
   font-weight: 800;
   line-height: 180px;
   text-align: center;
}


/* CEO인사말 */
.ceo {
   position: relative;
   width: 100%;
   margin: 0 auto;
   font-size: 0;
   vertical-align: top;
   margin-top: 120px;
   margin-bottom: 150px;
}
.greetingTop {
   position: relative;
   width: calc(50% - 50px);
   margin-right: 50px;
   min-height: 500px;
   display: inline-block;
   margin-top: 0px;
   vertical-align: top;
   background: url(../../images/sub/ceo.jpg) 50% 50% no-repeat;
   background-size: cover;
}
.greetingTop > span {
   display: block;
}
.greetingTop > span.introduction1 {
   position: absolute;
   left: 3%;
   bottom: -50px;
   font-size: 130px;
   font-weight: 800;
   letter-spacing: -5px;
   color: #fff;
   /*background: -webkit-linear-gradient(45deg, #4927c3, #21a59f 80%);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;*/
}
.greetingTop > span.introduction1 > img {
   width: 70%;
}
.greetingBottom {
   width: calc(50% - 50px);
   margin-left: 50px;
   display: inline-block;
   text-align: left;
   margin-top: 30px;
   max-width: 550px;
}
.greetingBottom > div {
   vertical-align: top;
   word-break: keep-all;
   font-size: 17px;
   line-height: 30px;
   color: #555;
}
.greetingBottom > div > span {
   font-size: 30px;
   font-weight: bold;
   line-height: 42px;
   color: #222;
   letter-spacing: -0.25px;
   margin-bottom: 20px;
}
.greetingBottom > div.ceo-name {
   font-size: 25px;
   font-weight: bold;
   margin-top: 50px;
   text-align: right;
   color: #222;
}


/*** 회사소개 ***/
.company {
   width: 100%;
   margin: 0 auto;
   margin-top: 140px;
}
.company .introduce {
   width: 1200px;
   margin: 0 auto;
   font-size: 0;
}
.company .introduce-title {
   display: block;
   font-size: 45px;
   font-weight: 800;
   letter-spacing: -1px;
   vertical-align: top;
   color: #222;
}
.company .introduce-ex {
   display: block;
   font-size: 1.2rem;
   line-height: 36px;
   vertical-align: top;
   color: #333;
   margin-top: 50px;
   margin-bottom: 220px;
}
.company .mission {
   margin-top: 100px;
   background: url(../../images/sub/company-mission.jpg) 50% 68% no-repeat;
   height: 500px;
   position: relative;
}
.company .mission > span {
   position: absolute;
   right: 0%;
   bottom: -8%;
   font-size: 230px;
   font-weight: 800;
   letter-spacing: -5px;
   color: rgba(255,255,255,0.1)
}
.company .mission > div {
   width: 1200px;
   margin: 0 auto;
   font-size: 0;
}
.company .mission-title {
   display: inline-block;
   width: 30%;
   font-size: 45px;
   font-weight: 800;
   letter-spacing: -1px;
   vertical-align: top;
   color: #fff;
   margin-top: 130px;
}
.company .mission-ex {
   display: inline-block;
   width: calc(70% - 30px);
   margin-left: 30px;
   font-size: 1.8rem;
   line-height: 50px;
   vertical-align: top;
   color: rgba(255, 255, 255, 0.7);
   margin-top: 130px;
   letter-spacing: -0px;
}
.company .mission-ex > span {
   font-size: 2.5rem;
   font-weight: 800;
   line-height: 40px;
   color: #fff;
   letter-spacing: -1px;
}



/*** 연혁 ***/
.history {
   width: 1100px;
   margin: 0 auto;
   margin-top: 80px;
   margin-bottom: 100px;
}
.historyArea {

}
/*.historyArea > .line {
   margin-top: 30px;
   background: url(../../images/sub/history_line.jpg) 2px 0px repeat-y;
   padding: 20px 0px 25px;
}*/
.historyArea .history-img {
   position: relative;
   height: 200px;
   overflow: hidden;
}
.historyArea .history-img > img {
   position: absolute;
   top: 0%;
   left: 50%;
   transform: translate(-50%, 0%);
}
.historyArea .line {
   padding-top: 50px;
}
.historyArea > .line > ul {
   font-size: 0;
   padding-bottom: 70px;
}
.historyArea > .line > ul.last {

}
.historyArea > .line > ul > li {
   display: inline-block;
   vertical-align: top;
}
.historyArea > .line > ul > li.dot {
   width: 3%;
   vertical-align: top;
   margin-top: 5px;
}
.historyArea > .line > ul > li.year {
   width: calc(25% - 10px);
   padding-top: 25px;
   padding-left: 10px;
   border-top: 2px solid #333;
   font-size: 45px;
   color: #222;
   font-weight: 800;
   margin-left: 0px;
   line-height: ;
}
.historyArea > .line > ul > li.text {
   width: calc(75% - 30px);
   font-size: 17px;
   color: #555;
   line-height: 34px;
   padding-top: 40px;
   padding-left: 30px;
   border-top: 1px solid #d5d5d5;
   vertical-align: top;
}
.historyArea > .line > ul > li.text > span {
   display: block;
}
.historyArea > .line > ul > li.text > span > span {
   display: inline-block;
   width: calc(100% - 50px);
   word-break: break-all;
}
.historyArea > .line > ul > li.text span.month {
   display: inline-block;
   width: 50px;
   font-size: 18px;
   font-weight: bold;
   color: #222;
   vertical-align: top;
}
.historyArea > .line > ul > li.text > span.mt20 {
   margin-top: 20px;
}
.historyArea > .line > ul > .none {
   display: none;
}
.historyBox, .performanceBox  {
   display: inline-block;
   vertical-align: top;
   margin: 0px 40px;
}
.historyBox > .line, .performanceBox > .line {
   margin-top: 30px;
   background: url(../../images/sub/history_line.jpg) 2px 0px repeat-y;
   padding: 20px 0px 25px;
}
.historyBox > .line > ul, .performanceBox > .line > ul {
   padding-bottom: 30px;
}
.historyBox > .line > ul.last, .performanceBox > .line > ul.last {
   padding-bottom: 0px;
}
.historyBox > .line > ul > li, .performanceBox > .line > ul > li {
   display: inline-block;
   vertical-align: top;
}
.historyBox > .line > ul > li.dot, .performanceBox > .line > ul > li.dot {
   vertical-align: top;
   margin-top: 5px;
}
.historyBox > .line > ul > li.year {
   font-size: 18px;
   color: #222;
   font-weight: 800;
   margin-left: 20px;
   line-height: 24px;
}
.historyBox > .line > ul > li.year, 
.performanceBox > .line > ul > li.year {
   font-size: 18px;
   color: #222;
   font-weight: 800;
   margin-left: 20px;
   line-height: 24px;
}
.performanceBox > .line > ul > li.year {
   width: 100px; 
}
.historyBox > .line > ul > li.month {
   font-size: 16px;
   color: #222;
   margin-left: 35px;
   line-height: 26px;
}
.historyBox > .line > ul > li.text, .performanceBox > .line > ul > li.text  {
   font-size: 15px;
   color: #777;
   margin-left: 25px;
   line-height: 26px;
}
.historyBox > .line > ul > .none, .performanceBox > .line > ul > .none {
   display: none;
}


/*** 조직도 ***/
.organization {
   background: #f9f9f9;
   border: 1px solid #ddd;
   text-align: center;
   padding: 70px 0px 100px;
   margin-top: 50px;
}

.organization img{
   text-align: center;
}


/*** Business ***/
.business {
   width: 100%;
   margin: 0 auto;
   margin-top: 80px;
   margin-bottom: 100px;
}
.SIR-Spheres {

}
.business-info {
   padding: 80px 0px;
   background: #f5f5f5;
}
.business-info2 {
   padding: 80px 0px;
}
.business-title {
   width: 1100px;
   margin: 0 auto;
}
.business-title > h4 {
   color: #27282c;
   margin: 0px 30px;
   font-size: 1.1rem;
   font-weight: 800;
   margin-bottom: 30px;
}
.business-title > h4.medicine {
   color: #27282c;
   font-size: 2.1rem;
   font-weight: 800;
   margin-bottom: 30px;
   text-transform: uppercase;
}
.business-title  > p {
   margin: 0px 30px;
   font-size: 1.1rem;
   color: #333;
   line-height: 30px;
   word-break: keep-all;
}
.business-title  > p > span {
   display: inline-block;
   font-size: 2rem;
   font-weight: 900;
   line-height: 40px;
   margin-bottom: 30px;
}
.business-pic {
   width: 1100px;
   margin: 0 auto;
   font-size: 0;
}
.business-pic > div {
   display: inline-block;
   width: calc(100% -62px);
   margin: 50px 30px 0% 30px;
   border: 1px solid #ddd;
}
.business-pic > div > img {
   width: 100%;
}
.business-play {
   width: 1100px;
   margin: 0 auto;
}
.business-play > p {
   margin: 100px 30px 0px 30px;
   font-size: 1.2rem;
   color: #333;
   line-height: 36px;
   word-break: keep-all;
}
.business-play .play-zone {
   position: relative;
   padding-top: 56%;
   width: calc(100% - 60px);
   height: 0;
   margin: 0px 30px 0px 30px;
}
.business-play .play-zone > iframe {
   position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.business-play > h5 {
   font-size: 2rem;
   font-weight: bold;
   margin: 100px 30px 30px 30px;
 } 


/*** 찾아오시는길 ***/
.map {
   width: 1100px;
   margin: 0 auto;
   margin-top: 80px;
   margin-bottom: 120px;
}
.map > .mapArea {
   height: 450px;
   border: 1px solid #eeeeee;
}
.map > .table {
   margin-top: 40px;
}
.map > .table .mapTitle {
   width: 150px;
   font-size: 17px;
}
.map > .table td {
   width: calc(100% - 70px);
   font-size: 1rem;
   color: #444;
   overflow: hidden;  
   line-height: 34px;
   padding: 20px 35px 20px;
}
.map > .table td.subway span.fax {
}
.map > .table td.subway span {
   display: inline-block;
   width: 130px;
   font-weight: bold;
   color: #222;
}
.map > .table td.subway span:last-child {
   margin-bottom: 0px;
}

/*.map > .table td > .subway1 {
   background: #004989;
   margin-bottom: 7px;
}
.map > .table td > .subway2 {
   background: #009658;
}
.map > .table td.subway > span {
   display: inline-block;
   width: 60px;
   height: 26px;
   line-height: 24px;
   text-align: center;
   color: #fff;
   font-size: 13px;
   border-radius: 3px;
}*/

/* .googlemap{
	position : absolute;
	top : 0;
	left : 0;
	width : 100%;
	height : 100%;
} */

/*** 채용 ***/
.recruit {
   position: relative;
   width: 100%;
   margin: 0 auto;
}
.recruit-title {
   width: 800px;
   margin: 0 auto;
   padding: 70px 0px 0px;
   text-align: center;
   color: #aaaaaa;
   font-size: 38px;
   font-weight: 800;
   line-height: 50px;
   word-break: break-word;
   letter-spacing: -0.5px;
}
.recruit-title > span {
   position: relative;
   color: #3539a1;
}
.recruit-title span::after {

}
.employPaper-wrap {
   background: #f6f8f9;
   margin-top: 50px;
   padding: 50px 0px 100px;
}
.recruit .employPaper {
   position: relative;
   width: 500px;
   margin: 0 auto;
   line-height: 35px;
   background: url(../../images/page/employ_paper.png) no-repeat;
}
.recruit .employPaper ul {

}
.recruit .employPaper ul li {
   display: flex;
   align-items: center;
   margin-bottom: 10px;
}
.recruit .employPaper ul li label {
   display: inline-block;
   width: 100px;
   color: #333;
   font-size: 1.1rem;
   font-weight: bold;
   cursor: pointer;
}
.recruit .join-business {
   width: calc(100% - 100px);
   font-size: 0;
}
.recruit .join-business .col-75 {
   width: calc(100% - 112px);
   vertical-align: top;
}
.recruit .employPaper ul li.phone span {
   display: inline-block;
   height: 46px;
   line-height: 46px;
   vertical-align: top;
   padding: 0 6px;
   color: #c5c5c5;
}
.recruit .employPaper ul li.phone input {

}
.recruit input {
   width: calc(100% - 112px);
    height: 43px;
    line-height: 43px;
    padding: 0 5px;
    border: 1px solid #c5c5c5;
    border-radius: 5px;
    background-color: #fff;
}
.recruit input.file_add {
   filter: alpha(opacity:0);
   opacity: 0;
   width: 60px;
   height: 22px;
   cursor: Pointer;
}
.join-business .col-80 {
   width: calc(100% - 100px)
}
.join-business .file_wrap a {
   display: inline-block;
   width: 96px;
   height: 45px;
   line-height: 44px;
   font-size: 15px;
   color: #fff;
   text-align: center;
   background: #88898a;
   border-radius: 5px;
   margin-left: 4px;
}
.recruit input.checked {
   width: auto;
   padding: 0;
   margin: 0;
   border: none;
   background: none;
   width: 18px;
   height: 18px;
}
.recruit .employCheck {
   margin-top: 20px;
}
.recruit .employCheck label {
   font-size: 16px;
   color: #333;
   margin-left: 5px;
}
.recruit .employPaper .submit {
   display: block;
   height: 60px;
   line-height: 60px;
   text-align: center;
   background: #3539a1;
   border-radius: 5px;
   color: #fff;
   margin-top: 20px;
   font-size: 1.1rem;
}
input::placeholder {
   color: #999;
   font-size: 16px;
}
.recruit-info {
   width: 500px;
   margin: 0 auto;
   padding-top: 30px;
}
.recruit-info > p {
   color: #555;
   font-size: 14px;
   line-height: 26px;
}
.recruit-info > p::before {
   content: "";
   display: inline-block;
   background: #3539a1;
   width: 4px;
   height: 4px;
   border-radius: 5px;
   margin-right: 7px;
   vertical-align: top;
   margin-top: 12px;
}

.resume a {
   color: 
   #1549d8;
   text-align: left;
}
.resume a:hover {
   text-decoration: underline;
}

/*** Sub footer ***/
#footerSub {
    clear: both; 
    width: 100%;
    text-align:center;
    /* margin-top: -16rem; */ /* Footer 스크롤 없이 하단 붙이기 */
    background: #252525;
    /* padding: 20px 0px 20px; */
    /* border-top: 1px solid #d5d5d5; */
    /* overflow:hidden; */
    /* position: fixed;
    bottom: 0px; */
 }
 
 .footerSub {
    max-width: 1100px;
    margin: 0 auto;
    padding-top: 40px;
    padding-bottom: 50px;
 }
 
 .footerSub_logo {
    display: inline-block;
    vertical-align: top;
 }
 
 #footerSub .address {
    display: inline-block;
    /* padding-left: 0px; */
    color: #999;
    font-size: 14px;
    line-height: 26px;
 }
 
 
 #footerSub .address .privacy > a{
    display: inline-block;
    color: #999;
    font-weight: bold;
    margin-bottom: 10px;
 }
 
 #footerSub .address .privacy > a:hover{
    color: #ea1414;
 }
 
 #footerSub .address > img{
    vertical-align: top;
    margin: 9px 10px 0px 10px;
    opacity: 0.7;
 }
 .footerAddr, .footerTel {
    display: inline-block;
 }
 .footerCopy {
    display: block;
 }
 
 
 @media (max-width: 1100px) {
    .footerSub {
      padding-left: 20px;
      padding-right: 20px;
    }
 }
 
 @media only screen and (max-width: 767px) {
    
    #footerSub .address {
       font-size: 12px;
       line-height: 20px;
    }
    .footerAddr, .footerTel {
       display: block;
    }
  }



  /*** board ***/
  .board-wrap {
      width: 1200px;
      margin: 0 auto;
   }
  .board_search {
     /* width: 1100px; */
     width:100%;
     display: inline-block;
     margin-bottom: 10px;
   }
   .board_search > .info_text{
     font-size: 17px;
     color:#999;
     float: left;
     padding-top: 14px;
   }

   @media only screen and (max-width: 1279px) {
      .board-wrap {
         width: 100%;
         margin: 0 auto;
      }
   }

  @media only screen and (max-width: 480px) {
     
   .board_search > .info_text {
      /* font-size: 17px;
      color: #999;
      float: left;
      padding-top: 14px; */
      padding-bottom: 25px;
      text-align: center;
      width: 100%;
    }
   }
  
  .board_search > .search_box {
     height: 45px;
     box-sizing: border-box;
     float: right;
     position: relative;
  }
 
  @media only screen and (max-width: 480px) {

      /* .board_search > .search_box {
         height: 45px;
         box-sizing: border-box;
         float: right;
         position: relative;
         width: 100%;
         text-align: center;
      } */
   }  
 
  /* 2021.05.18
  @media only screen and (max-width: 767px) {
      .board_search {
         width:100%;
         display: inline-block;
         margin-bottom: 20px;
      }
  
      .board_search > .info_text{
         width:100%;
         text-align: center;
      }
      
      .board_search > .search_box {
         width:100%;
         text-align: right;
         padding-top: 10px;
     }
  } */
  
  .board_search > .search_box > select {
     display: inline-block;
     width: 110px;
     height: 40px;
     border: 1px solid #ccc;
     background-color: #fff;
     color: #646464;
     padding-left: 15px;
     margin-right: 3px;
     background: url(../../images/more06.png) 0 0 no-repeat;
     background-position-y: 17px;
     background-position-x: 86px;
  }
  
  .placeholder_wrap {
     box-sizing: border-box;
     position: relative;
     display: inline-block;
     border: 1px solid #ccc;
  }
  .placeholder_wrap input[type='text'],
  .placeholder_wrap textarea {
     width: 200px;
     height: 38px;
     padding-right: 50px;
     padding-left: 15px;
     border: 0;
     box-sizing: border-box;
  }
  .placeholder_wrap > .placeholder {
     color: #999;
     font-size: 14px;
     font-weight: 300;
     position: absolute;
     top: 8px;
     left: 15px;
  }
  
  .search_box > .btn_search {
     width: 19px;
     height: 19px;
     font-size: 0;
     background: url(../../images/common/icon_search.png) 50% no-repeat;
     position: absolute;
     top: 10px;
     right: 12px;
     display: inline-block;
  }
  
 
  @media only screen and (max-width: 480px) {
   
      /* .search_box > .btn_search {
         right: 31px;
      } */
   }  
  
  .table {
     border-top: 1px solid #ddd;
     display: table;
     width: 100%;
     table-layout: fixed;
     overflow: hidden;
     margin: 0 auto;
  }
  
  .table tr {
     vertical-align: middle;
     text-align: center;
     border-bottom: 1px solid #e5e5e5;
  }
  
  .table th {
     font-size: 16px;
     color: #333;
     background: #f3f3f3;
     /* border-right: 1px solid #e9e9e9; */
     padding: 14px 20px;
  }
  
  .table td {
     width: 100%;
     font-size: 14px;
     color: #444;
     /* border-right: 1px solid #e9e9e9; */
     padding: 18px 15px;
     overflow: hidden;
     /* white-space: nowrap;
     text-overflow: ellipsis; */
  }

  .table.boardList {

  }
  
  .table .last {
     border-right: none;
     border-bottom: 1px solid #e5e5e5;
  }
  
  .table .atitle {
     color: #555;
  }
  
  .table .atitle:hover {
     color: #5c2e98;
  }
  
  .table .left {
     text-align: left;
  }
   
  .table.boardWrite td {
     padding: 0px 20px;
  }
  
  .table td.tArea {
     white-space: normal;
     padding: 14px 20px;
  }
  
  .textArea {
     border: 1px solid #e1e1e1;
     width: 98%;
     height: 300px;
     font-size: 14px;
     color: #777;
     padding: 10px;
     line-height: 24px;
  }
  
  textarea:focus {
     outline: none;
  }
  
  .table td.viewText {
     line-height: 28px;
     min-height: 200px;
     white-space: normal;
     word-break: break-all;
     vertical-align: top;
     padding: 30px;
     width: calc(100% - 60px);
  }
  .table td.viewText > img{
     max-width:1000px
  }
  
  .writeInput {
     height: 30px;
     border: 0px;
     width: 98%;
     background-color: #fff;
     border: 1px solid #d2d2d2;
     font-size: 14px;
     vertical-align: middle;
  }
  
  input:focus {outline:none;}
  
  .file_input > label {
     position:relative;
     cursor:pointer;
     display:inline-block;
     vertical-align:middle;
     overflow:hidden;
     width:100px;
     height:34px;
     background:#999;
     color:#fff;
     text-align:center;
     line-height:33px;
     margin-left: 5px;
     font-size: 15px;
  }
  
  .file_input > label > input {
     position:absolute;
     width:0;
     height:0;
     overflow:hidden;
  }
  
  .file_input input[type=text] {
     width:400px;
  }
  
  .triUp{
     display: inline-block;
     width: 0px; height: 0px;
     margin-left: 10px;
     margin-top: -3px;
     vertical-align: middle;
     border-top: 6px solid none;
     border-bottom: 6px solid #999;
     border-right: 6px solid transparent;
     border-left: 6px solid  transparent;
     cursor: pointer;
  }
  
  .triDown{
     display: inline-block;
     width: 0px; height: 0px;
     margin-left: 10px;
     margin-top: -2px;
     vertical-align: middle;
     border-top: 6px solid #999;
     border-bottom: 6px solid none;
     border-right: 6px solid transparent;
     border-left: 6px solid  transparent;
     cursor: pointer;
  }

  .at-file a {
      color: #0e63ff;
      word-break: break-all;
  }
  
  .prev_list, .next_list {
     color:#444;
  }
  
  .paging {
     margin-top: 30px;
     text-align: center;
  }
  
  .paging > a {
     display: inline-block;
     text-indent: -9999em;
     width: 34px;
     height: 34px;
     vertical-align: middle;
     border: 1px solid #d5d5d5;
  }
  
  .paging .first {
     background: url(../../images/sub/btn_paging_first.png) 50% 50% no-repeat;
  }
  
  .paging .prev {
     background: url(../../images/sub/btn_paging_prev.png) 50% 50% no-repeat;
  }
  
  .paging .next {
     background: url(../../images/sub/btn_paging_next.png) 50% 50% no-repeat;
  }
  
  .paging .last {
     background: url(../../images/sub/btn_paging_last.png) 50% 50% no-repeat;
  }
  
  .paging > span {
     display: inline-block;
     vertical-align: middle;
     margin: 0 13px;
  }
  
  .paging > span > a {
     display: inline-block;
     width: 34px;
     height: 34px;
     line-height: 34px;
     font-size: 13px;
     color: #777;
     border: 1px solid #d5d5d5;
     margin-right: 3px;
  }
  
  .paging .active:last-child {
     margin-right: 0px;
  }
  
  .paging > span > a:hover {
     background: #ddd;
  }
  
  .paging > span > a.active {
     color: #fff;
     background: #135bc7;
     border: 1px solid #135bc7;
  }
  
  
  .btnWrap {
     width: 100%;
     margin: 0 auto;
     margin-top: 40px;
     font-size: 0;
     text-align: center;
  }
  
  .btnWrap > a {
     display: inline-block;
     width: 120px;
     height: 45px;
     line-height: 44px;
     background: #135bc7;
     color: #fff;
     font-size: 15px;
     margin-right: 5px;
  }
  
  .btnWrap > a:last-child {
     margin-right: 0px;
  }
  
  .btnWrap > .btnList, .btnWrap > .btnModify{
     background: #fff;
     border: 1px solid #135bc7;
     color: #135bc7;
     height: 43px;
     line-height: 42px;
  }
  
  .btnWrap > .btnDelete {
     background: #c52020;
     color: #fff;
  }
  

   

@media only screen and (max-width: 1279px) {   
   .inner1200 {
      width: 100%;
   }
   .subContents {
       width: 100%;
       box-sizing: border-box;
   }
   .subVisual .subText {
      left: 40px;
   }
   .ceo {
      width: 100%;
   }
   .greetingTop {
      width: calc(50% - 30px);
      margin-right: 30px;
   }
   .greetingTop > span.introduction1 {

   }
   .greetingTop > span.introduction1 > img {

   }
   .greetingBottom {
      width: calc(50% - 90px);
      margin-left: 30px;
      margin-right: 60px;
      display: inline-block;
      text-align: left;
      max-width: 550px;
   }
   .company .introduce {
      width: calc(100% - 100px);
      padding: 0 50px;
   }
   .company .mission > div {
      width: calc(100% - 100px);
      padding: 0 50px;
   }
   .history {
      width: calc(100% - 180px);
      padding: 0 90px;
   }
   .historyBox, .performanceBox {
      margin: 0px 0px;
      width: 49%;
      margin-bottom: 60px;
   }
   .performanceBox {
      float: right
   }
   .historyBox .pic, .performanceBox .pic {
      width: 100%;
   }
   .historyBox .pic > img , .performanceBox .pic > img {
      width: 100%;
   }
   .historyBox > .line > ul > .none, .performanceBox > .line > ul > .none {
      display: block;
   }
   .historyBox > .line > ul > li > .block, .performanceBox > .line > ul > li > .block {
      display: none;
   }
   .historyBox > .line > ul > li.month {
      margin-left: 32px;
   }
   .performanceBox > .line > ul > li.text {
      margin-left: 32px;
   }

   .organization {
      padding: 70px 40px 100px;
   } 
   .business-title {
      width: 100%;
      margin: 0 auto;
   }
   .business-play {
      width: 100%;
      margin: 0 auto;
   }
   .business-pic {
      width: 100%;
   }
   .map {
      width: calc(100% - 62px);
      padding: 0 30px;
   }
   .map > .mapArea iframe {
      width: 100%
   }
   .recruit {
      width: 100%;
   }
}


@media only screen and (max-width: 1024px) {  

   .subContents {
   }
   .subVisual {
      height: 300px;
   }
   .subVisual .subBg {
   }
   .subVisual .subBg > ul{
      width: 100%;
   }
   .subVisual .subBg .subimg {
      background-size: 275px;
      background-position-x: right;
   }
   .subVisual .subText {
      top: 145px;
   }
   .subVisual .subText > .title {
      font-size: 33px;
  }
   .subVisual .subText > .subTitle {
      font-size: 20px;
   }
   .subContents > .title {
      padding-top: 60px;
   }
   .ceo {
      width: calc(100% - 60px);
      padding: 0 30px;
      margin-top: 60px;
   }
   .greetingTop {
      width: 100%;
      margin-right: 0px;
      min-height: 250px;
   }
   .greetingTop > span.introduction1 > img {
      width: 230px;
   }
   .greetingTop > span.introduction1 {
      bottom: 0px;
   }
   .greetingBottom {
      width: 100%;
      margin-left: 0px;
      margin-right: 0px;
      display: block;
      margin-top: 60px;
      max-width: 100%;
   }
   .greetingBottom > div {
      font-size: 16px;
      line-height: 28px;
   }
   .greetingBottom > div > span {
      font-size: 24px;
      font-weight: bold;
      line-height: 32px;
   }
   .company {
      margin-top: 100px;
   }
   .company .introduce-title {
      font-size: 40px;
      letter-spacing: -1px;
   }
   .company .introduce-ex {
      font-size: 1.1rem;
      line-height: 30px;
   }
   .company .mission {
      background: url(../../images/sub/company-mission.jpg) 50% 68% no-repeat;
      height: 450px;
   }
   .company .mission > span {
      font-size: 200px;
   }
   .company .mission-title {
      font-size: 40px;
      letter-spacing: -1px;
      margin-top: 100px;
   }
   .company .mission-ex {
      font-size: 1.5rem;
      line-height: 37px;
      margin-top: 100px;
      letter-spacing: 0px;
   }
   .company .mission-ex > span {
      font-size: 2rem;
      line-height: 40px;
   }
   .history {
      width: calc(100% - 60px);
      padding: 0 30px;
   }
   .history {
      margin-top: 60px;
   }
   .location {
      top: 250px;
   }
   .organization img{
      width: 100%;
   }
   .map {
      margin-top: 50px;
   }
   .map > .table td {
      width: calc(100% - 0px);
      padding: 20px 0px 20px;
   }
   .recruit-title {
      width: 95%;
      padding: 60px 0px 0px;
   }
}



@media only screen and (max-width: 767px) { 
   .subContents > .title > h2 {
      font-size: 30px;
   }
   .subVisual .subText > .subTitle {
      font-size: 18px;
   }
   .subContents {

   }
   .location .sub_menu {
      width: calc(50% - 28px);
   }
   .location .sub_menu > a {
      width: auto;
   }
   .location .sub_menu .twoD {
      width: 100%;
   }

   .greetingTop > span.introduction1 {

   }
   .greetingTop > span.introduction2 {
      font-size: 16px;
      line-height: 24px;
   }
   .greetingBottom {
      display: block;
      font-size: 14px;
   }
    .greetingBottom > div {
       width: 100%;
   }
   .greetingBottom > div.ceo-name {
      font-size: 23px;
   }

   .company .introduce {

   }
   .company .introduce-title {
      display: block;
      width: 100%;
      font-size: 34px;
   }
   .company .introduce-ex {
      display: block;
      width: 100%;
      margin-top: 25px;
      margin-left: 0px;
      font-size: 1rem;
      line-height: 26px;
   }
   .company .mission {
     text-align: center;
     margin-top: 90px;
   }
   .company .mission > span {
      right: 50%;
      bottom: -6%;
      font-size: 140px;
      transform: translate(50%, 0%);
   }
   .company .mission-title {
      width: 100%;
      margin-top: 90px;
      font-size: 34px;
   }
   .company .mission-ex {
      display: inline-block;
      width: 100%;
      margin-top: 25px;
      margin-left: 0px;
      font-size: 1rem;
      line-height: 26px;
   }
   .company .mission-ex > span {
      font-size: 1.5rem;
      line-height: 40px;
   }

   .history {}
   .historyBox, .performanceBox {
      width: 100%;
   }
   .historyBox .pic, .performanceBox .pic {
      width: 100%;
   }
   .historyBox .pic > img , .performanceBox .pic > img {
      width: 100%;
   }
   .historyBox > .line, .performanceBox > .line {
      margin-top: 10px;
   }
   .historyArea > .line > ul > li.year {
      font-size: 40px;
      padding-left: 0px;
   }
   .historyArea > .line > ul > li.text {
      font-size: 16px;
      line-height: 30px;
   }

   .business {
      margin-top: 60px;
      margin-bottom: 100px;
   }
   .business-info {
      padding: 80px 0px;
   }
   .business-title > h4 {

   }
   .business-title > p {
      font-size: 1rem;
      line-height: 27px;
   }
   .business-play > p {
      margin: 60px 30px 0px 30px;
      font-size: 1rem;
      line-height: 29px;
   }
   .business-play > h5 {
      font-size: 1.5rem;
      font-weight: bold;
      margin: 60px 30px 30px 30px;
   }

   .map > .table .mapTitle {
      width: calc(100% - 40px);
      display: block;
      border-bottom: 1px solid #e7e7e7;
   }
   .map > .table tr {
      border: none;
   }
   .map > .table td {
      width: calc(100% - 0px);
      line-height: 24px;
      padding: 0px !important;
      word-break: break-all;
   }
   .map > .table td.subway span {
      display: block;
      width: 100%;
      margin-bottom: 5px;
      margin-top: 20px;
   }
   .map > .table td.subway span.f-title {
      display: none;
   }

   .recruit .employPaper {
      width: calc(100% - 60px);
   }
   .recruit-info {
      width: calc(100% - 60px);
   }
   .recruit-title {
      width: 95%;
      font-size: 30px;
      line-height: 45px;
   }
   .recruit-title > .line {
      display: none;
   }
   .recruit-title > span > img {
      width: 100%;
   }

}


 @media only screen and (max-width: 480px) {
   .company .mission > span {
      font-size: 120px;
   }
   .historyArea > .line > ul {
      border-top: 1px solid #d5d5d5;
   }
   .historyArea > .line > ul > li.year {
      width: auto;
      padding-left: 0px;
   }
   .historyArea > .line > ul > li.text span.month {
      font-size: 16px;
   }
   .historyArea > .line > ul > li.text {
      width: 100%;
      font-size: 15px;
      line-height: 24px;
      padding-left: 0px;
      border-top: none;
   }
   .subVisual .subBg .subimg {
      width: 50%;
   }
   .map > .table td.subway {

   }

   .employPaper-wrap {
      margin-top: 40px;
      padding: 40px 0px 80px;
   }
   .recruit .employPaper ul li label {
      display: inline-block;
      width: 80px;
      color: #333;
      font-size: 1rem;
   }
   .recruit input {
      width: calc(100% - 92px);
   }
   .recruit .join-business {
      width: calc(100% - 80px);
   }
   .recruit .employCheck label {
      font-size: 15px;
   }
   .recruit-info {
      padding-top: 20px;
   }
   .recruit-info > p {
      color: #555;
      font-size: 13px;
      line-height: 22px;
   }
}

  
  