@keyframes zoom {
    from {
      transform: scale(1.2);
    }
    to {
      transform: scale(1);
    }
  }

.common_banner{width: 100%; position: relative; height: 360px; overflow: hidden; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.common_banner>span{width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-position: center; background-repeat: no-repeat; background-size: cover; animation: zoom 6s ease-in-out;}

.common_banner .company_bg{background:url(../img/style/company-bg.jpg);    background-repeat: no-repeat;
  background-size: cover;}
  .common_banner .part_bg{background:url(../img/style/partnership-bg.jpg);    background-repeat: no-repeat;
    background-size: cover; background-position: 60%;}
.common_banner .contact_bg{background:url(../img/style/cont-bg.jpg);    background-repeat: no-repeat;
  background-size: cover;}
  .common_banner .man_bg{background:url(../img/style/man-bg.jpg);    background-repeat: no-repeat;
    background-size: cover; background-position: 60%;}
    .common_banner .business_bg{background:url(../img/style/business-bg.jpg);    background-repeat: no-repeat;
      background-size: cover; background-position: 60%;}
      .common_banner .store_bg{background:url(../img/style/store-bg.jpg);    background-repeat: no-repeat;
        background-size: cover; background-position: 60%;}
    .common_banner .arc_bg{background:url(../img/style/archive-bg.jpg);    background-repeat: no-repeat;
      background-size: cover;}
.common-title{display: flex; justify-content: flex-start; flex-direction: column; max-width: 1440px; width: 100%; z-index: 1; }
.common-title h3{font-size: 50px; color:#fff; line-height: 100%; letter-spacing: 2px; font-weight: 700; display: block; font-family: 'Oswald', sans-serif; text-transform: uppercase;}
/* .common-title p{max-width: 500px; display: block; margin-top:50px; font-size: 20px;} */

.common_tab{position: relative; width: 100%; padding: 0 20px; border-bottom:1px solid #ececec;}
.common_tab ul{max-width: 1440px; height: 57px; margin:  0 auto;}
.common_tab ul li{display: inline-block; position: relative; padding:0 6px; font-size: 1rem; box-sizing: border-box; line-height: 57px; letter-spacing: 1.2px;}
.common_tab ul li + li{margin-left: 40px;}
.common_tab ul li + li::before{content: ""; position: absolute; top: 50%; left: -20px; width: 1px; height: 20px; margin-top:-10px; background-color:#dbdbdb; left: -20px;}
.common_tab ul li a{transition: all .2s;}
.common_tab ul li a:hover{opacity: 0.5;}
.common_tab ul li.on a{color:#0d6fb8; position: relative;;}
.common_tab ul li.on a::before{content: ""; width: 100%; height: 2px; background-color: #0d6fb8; position: absolute; bottom: -20px; left: 0;}
/* ================================================ */
/* =================== // ceo // ================== */
/* ================================================ */
.container{padding: 150px 0; position: relative;}
.sub-title-con strong{font-size: 50px; letter-spacing: 1.2px; line-height: 1.2; display: block; margin-bottom: 80px;}
.sub-title-con strong span{color:#0d6fb8}

.sub-title-con strong span.kor_ver{font-size: 24px; display: block;}
.ceo .container{overflow: hidden;}
.ceo-text-con{width:40%;}
.ceo-text-con>div + div{margin-top: 40px;}

.ceo-img{display: inline-block; position: absolute; }
.ceo-side{right: 0; top: 50%; transform: translateY(-50%);}
.ceo-bg{left: -40px; top: 0; background:url(../img/sub/ceo-side.jpg); background-repeat:no-repeat repeat; width: 179px; height: 100%; z-index: -1;}



/* ================================================ */
/* =================== // history // ================== */
/* ================================================ */
.history .sub-title-con strong span{color:#0d6fb8; display: inline-block;}
.history-body{width: 100%; padding-left: 340px; padding-top: 60px; transition: all .2s;}
.history-body dl{display: table; width: 100%;}
/* .history-body dl + dl{padding-top: 60px;} */
.history-body dl>dt,.history-body dl>dd{display: table-cell; vertical-align: top;}
.history-body dl>dt{width: 300px; transition: all .2s;}
.history-body dl>dt p{font-size: 40px; font-weight: bold; line-height: 1.2;}
.history-body dl>dd{padding: 20px 0 70px 40px; border-left: 2px solid #ddd; position: relative;}
.history-body dl>dd::before{width:13px; height: 13px; border-radius: 100%; background-color: #0d6fb8; content: ""; position: absolute; top: -7px; left: -7px;}
.history-body dl>dd span.year{font-weight: 600; display: block; font-size: 20px;}
.history-body dl>dd span.month{color:#888; font-weight: 600; position: absolute; left: 0; top: 0; }
.history-body dl>dd ul li{padding-left: 32px; position: relative;}
.history-body dl>dd .his-con + .his-con{padding-top:14px;}
.history-body dl:last-child dd::after{width:13px; height: 13px; border-radius: 100%; background-color: #0d6fb8; content: ""; position: absolute;bottom: -7px; left: -7px;}



/* ================================================= */
/* =================== //policy// ================== */
/* ================================================= */
.policy-body{padding-top: 60px;}
.policy-diagram{position: relative}
.policy-logo{display: inline-block; position: absolute; left: 50%; top: 26px; transform: translateX(-50%);}
/* .policy-con{} */
.policy-con{margin-bottom: 60px; width: 50%; float: left;}
.policy-con i{display: block; width: 100%;}
.policy-con i img{width: 40px;}
.policy-con:nth-child(1),.policy-con:nth-child(3){padding-right: 230px;  text-align: right}
.policy-con:nth-child(1) i img,.policy-con:nth-child(3) i img{margin-left: auto;}
.policy-con:nth-child(2),.policy-con:nth-child(4){padding-left: 230px;}
.policy-con strong{display: block; font-size: 20px; text-transform: uppercase; padding: 10px 0;}
.policy-con .conts-en + .conts-kr{margin-top: 12px;}

.policy-con a.link{width: 120px; text-align: center; margin-top: 20px; padding: 0 20px; display: block; line-height: 36px;
  height: 36px; border-radius: 30px; border: 1px solid #888;  transition: all .2s;} 
.policy-con a.link:hover{opacity: 0.5; }
.policy-con .conts-en li{margin-bottom: 12px;}
.policy-con .conts-en .kor_ver{font-size: 14px; color:#6ba0c5}
/* ================================================ */
/* =================== // notice // ================== */
/* ================================================ */

.notice-body>ul li{margin-bottom: 60px;}
.notice-con{border: 1px solid #444; padding: 40px; cursor: pointer; background-color: #fff; transition: all .2s;}
.notice-con:hover{opacity: 0.7;}
.notice-con strong{font-size: 18px; display: block; white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.notice-con p{margin-top: 16px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; line-height: 1.2em; height: 2.2em;}
.notice-con span.date{margin-top: 60px; font-size: 14px; font-weight: 500; display: block;}

.board-container{border-top: 2px solid #333;}
.board-header{display: flex; justify-content: space-between;  padding: 30px 24px;}
.board-header strong{display: block; font-size: 24px;}
.board-header span{width: 84px; display: block;}
.board-file{display: table; width: 100%; background-color:#f5f5f5; border-top: 1px solid #ececec; border-bottom: 1px solid #ececec;}
.board-file dt, .board-file dd{display: table-cell; padding: 15px 24px;}
.board-file dt{width: 150px;}
.board-file .file-list span{display: inline-block; font-size: 14px; cursor: pointer; color:#0d6fb8; transition: all .2s;}
.board-file .file-list span:hover{opacity: 0.7;}
.board-file .file-list span + span{margin-left: 12px;}
.board-file .empty p{color:#888}
.board_pagination { margin-bottom: 80px;  font-size: 16px;}
.board_view_page {  padding: 24px 0;  border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;  transition: all .3s;cursor: pointer;}
.board_view_page + .board_view_page{border-top: 0;}
.board_view_page .title  {  padding: 0 24px;font-weight: 700;}
.board-body{padding: 30px 24px; min-height: 400px;}
.board-body img{max-width: 100%; width: auto;}
.board-select{width: 120px;}


button.list-btn{position: relative; color:#d6d6d6; width: 250px; border-color: #d6d6d6; border-width: 2px; border-style: solid; padding: 30px; font-size: 14px; transition: all .2s ease-in-out;}
button.list-btn:hover{color:#0d6fb8; border-color: #0d6fb8;}

/* ********************************************* *
    board
* ********************************************* */

/* board */
.board .table-board{margin: 2.222rem 0;table-layout: fixed}
.board .board-title{display: flex;min-width: 0;flex: 1 1 auto;-webkit-flex-basis: 0;align-items: center}
.board .board-title .tit{display: block;flex-shrink: 1;margin-right: 3px;overflow: hidden;text-overflow: ellipsis;;white-space: nowrap}
.board .board-title .new{min-width: 1.111rem;line-height: 1.111rem;border-radius: 100%;display: block;font-style: normal;background: #0070C3;color: #fff;text-align: center;font-size: .611rem;font-weight: 500}

/* table */
.board .table-data th, .table-data td{padding: .333rem 0}
.board .table-data th{width: 1%;white-space: nowrap;vertical-align: top;padding-right: 1.667rem;font-weight: 500}
.board .table{border-top: 2px solid;border-bottom: 1px solid;margin: 0; width: 100%;}
.board .table thead th{border-top: 0;border-bottom: 1px solid;vertical-align: middle}
.board .table th, .table td{padding: .556rem;height: 4.444rem;vertical-align: middle;text-align: center;font-weight: 500; border-top: 1px solid #dee2e6;}
.board .table td{    border-color: #e5e5e5;}
.board .table-responsive th{white-space: nowrap}
.board .table+.table, .board .table-responsive+.table-responsive .table{border-top-width: 1px}

.board-list-top{display: flex; align-items: center; justify-content: space-between; margin-bottom: 32px;}
.board-list-top .total{font-size: 16px; font-weight: 600;}
.board-list-top .total em{color:#0070C3}
.board-top{ display: flex;}
.select{width: 100px;}
.search{position: relative; width: 230px; margin-left: 8px;}
.search a{position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 23px; height: 23px; /* background-image: url(../img/sub/search.svg); */}
.search a i{font-size:20px; transition: all .2;}
.search a:hover i{opacity: 0.5;}
.search input[type=text]{border: none; outline: none;background-color: #fff; border: 1px solid #ddd; padding: 2px 40px 2px 8px; width: 100%; height: 40px; line-height: 40px; /* border-radius: 3px; */ }



/* ================================================ */
/* =================== //online // ================== */
/* ================================================ */

.online-body h4{font-size: 20px; padding-bottom: 12px;}
.online-table-wrap{margin-top: 60px;}
.online-table{display: flex; flex-wrap: wrap; border-top: 1px solid #0d6fb8;}
.online-table .tr{width: 50%; display: table; border-bottom: 1px solid #ececec; min-height: 80px; padding: 16px 20px;}
.online-table .tr > *{display: table-cell; vertical-align: middle;}
.online-table .tr .th{/* font-size: 18px;  */font-weight: 600; width: 150px;}
.online-table .tr .th .impt::before{content: "*"; display: inline-block; color:#0d6fb8; margin-top: -6px; vertical-align: top; height: 10px; font-size: 17px; font-weight: 600;}
.online-table .tr .td{width: calc(100% - 150px);}
.online-table .tr.type02{width: 100%; padding: 16px 20px;}
.online-table .tr textarea{width: 100%; height: 200px; background-color:#fff;  border: 1px solid #ececec; outline: 0; resize: none; font-size: 1rem; padding: 20px;} 
.online-policy-box{height: 150px; border: 1px solid #ececec; overflow-y: scroll; padding: 20px; font-size: 14px;}


/* ================================================ */
/* =================== //partner // ================== */
/* ================================================ */

.partner .sub-title-con strong span{font-weight: 400;}
.partner-body{padding-left: 204px; margin-top: 80px;}

.part-sec dl{display: table;width: 100%;}
.part-sec dl dt{width: 210px;}
.part-sec dl dt,.part-sec dl dd{display: table-cell;vertical-align:middle;font-size: 15px;}
.part-sec dl dt img{width: auto; box-shadow: 0px 3px 13px rgb(0 0 0 / 10%);}
.part-sec dl dd span{display: block;}
.part-sec + .part-sec{margin-top: 80px;}
.part-sec h4{font-size: 28px; margin-bottom: 24px;}
.part-sec p{position: relative; margin-top: 20px;margin-bottom: 24px; }

.root_daum_roughmap{width: 100%!important;}

.part-img{margin-bottom: 20px;}
.part-img li{display: inline-block; }
.part-img li + li{margin-left: 20px;}
.prt--img{width: 150px; height: 150px; border-radius: 100%; border: 1px solid #ececec; overflow: hidden; transition: all .2s;}
.prt--img img{width: auto;     height: 100%;}

/* ================================================ */
/* =================== //partner // ================== */
/* ================================================ */

.ship-flex{display: flex; width: 100%; margin-top: 8px;}
.ship-flex>div + div{margin-left: 12px;}
.ship-flex>div p{margin-top: 12px;}
.ship-flex.ship-sec03{width: 80%;}
.shipstore-sec h4{font-size: 28px;                }
.shipstore-sec + .shipstore-sec{margin-top: 80px;}
.ship-wrap{margin-top: 20px;}
.ship-wrap>div{margin-bottom: 24px;}
.ship-wrap img{border-radius: 12px;}
.ship-sec>div img{border: 7px solid #eee; border-radius: 20px;}
.ship-sec04{margin-top: 32px;}

/* ================================================ */
/* =================== //개인정보처리방침 // ================== */
/* ================================================ */

.treatmen_policy .text_box{border:1px solid #ddd;min-height:800px; width:100%; overflow-y: scroll;}








/* ********************************************* *
 * 1600px
 * ********************************************* */
 @media screen and (max-width: 1660px){
   
   
  .container{padding: 150px 0;}
  .ceo-side{width: 50%;}
    
}

/* ********************************************* *
* 1400px
* ********************************************* */
@media screen and (max-width: 1400px){
  .common-title{padding: 0 16px;}

  .history-body,.partner-body{padding-left: 0; }
 
}

/* ********************************************* *
* 1200px
* ********************************************* */
@media screen and (max-width: 1200px){

  .ceo-text-con{width: 100%;}
  .ceo-side{width: 100%; position: relative; transform: inherit; margin-top: 40px;}
  .ceo-side img{width: auto; display: block; margin-left: auto;}

  .policy-logo {position: relative; transform: inherit; width: 100%; text-align: center; left: 0; top: 0;}
  .policy-logo img{width: auto; margin: 0 auto;}
  .policy-con{width: 25%;}
  .policy-con:nth-child(1), .policy-con:nth-child(3){padding: 0 16px; text-align: left;}
  .policy-con:nth-child(2), .policy-con:nth-child(4){padding: 0 16px}
  .policy-con:nth-child(1) i img, .policy-con:nth-child(3) i img{margin-left: 0;}
}

/* ********************************************* *
* 1024px
* ********************************************* */
@media screen and (max-width: 1024px){

  .history-body dl>dt{width: 200px}
  .policy-logo{position: relative; top: 0; transform: inherit; left: 0 ; width: 100%;}
  .policy-logo img{width: auto; margin: 0 auto;}
  .policy-con{width: 50%;}
  .notice-body .row-wide > [class*='col']{    padding-right: 16px; padding-left: 16px;}
  .notice-body .row-wide {margin-right: -16px; margin-left: -16px;}
  .ship-flex.ship-sec03{width:inherit}
}


/* ********************************************* *
* 960px
* ********************************************* */
@media screen and (max-width: 960px){

  .common_tab ul{width: 100%; max-width: inherit}
  .online-table .tr .th{width: 120px;}

}


/* ********************************************* *
* 768px
* ********************************************* */
@media screen and (min-width: 769px){
 

 
}
@media screen and (max-width: 768px){

  .common_tab{overflow-x: auto; padding: 0; text-align: center;}
  /* .common_tab ul{width: 640px;} */
  .common_tab ul li{font-size: 15px;}
  .common_tab ul li + li {margin-left: 20px;}
  .company_tab ul li{float: left; width: 33.333%;}
  .company_tab ul li + li{margin-left: 0;}
  .common_tab ul li + li::before{left: 0;}
  .news_tab ul li{float: left; width: 50%;}
  .news_tab ul li + li{margin-left: 0;}

   /* board */
   .board .table-board{margin: 1rem 0}
   .board .table-board thead, .table-board .none{display: none}
   .board .table-board, .table-board tbody, .table-board tr, .table-board td{display: block}
   .board .table-board td{height: auto;border: 0;text-align: left;padding: .278rem 0}
   .board .table-board tr{position: relative;padding: 1rem 0}
   .board .table-board tr+tr{border-top: 1px solid #e5e5e5}
   .board .table-board .inline{display: inline-block;vertical-align: top}
   .board .board-title{font-size:16px;align-items: flex-start;}
   .board .board-title .tit{display:-webkit-box;overflow:hidden;max-width: 100%;max-height: 2.8em;line-height: 1.4em !important;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-wrap:break-word;word-break:break-all;white-space:normal}
   .board .board-title .new{margin-top: .2rem}


   .ship-flex{display: block;}
   .ship-flex>div + div{margin-left: 0;}
   .ship-flex.ship-sec::before,.ship-flex.ship-sec::after{display: table; content: " "; clear: both;}
   .ship-flex.ship-sec{margin-left: -16px; margin-right: -16px;}
   .ship-flex.ship-sec>div{width: 50%; padding-left: 16px; padding-right: 16px; float: left; position: relative;}
   .ship-flex.ship-sec03>div:nth-child(3){width: 100%;}


}


/* ********************************************* *
* 640px
* ********************************************* */
@media screen and (max-width: 640px){
  .common-title h3{font-size: 40px;}
  .container{padding: 80px 0;}
  .sub-title-con strong {font-size: 42px; word-break: keep-all;}

  .history-body dl>dt, .history-body dl>dd{display: block;}
  .history-body dl>dt{padding: 20px 0 ; width: 100%;}
  .history-body dl>dd {padding: 20px 0 70px 20px;}
  .history-body dl>dt p{font-size: 28px;}

  .sub-title-con strong br{display: none;}
  .policy-logo{display: none;}
  .policy-con{width:100%}
  /* .policy-con:nth-child(1), .policy-con:nth-child(3),.policy-con:nth-child(2), .policy-con:nth-child(4){padding-left: 16px;} */
  .policy-con{margin-bottom: 40px;}

  .part-sec dl ,.part-sec dl dt, .part-sec dl dd{display: block;;}
  .part-sec dl dt{width: 120px; background-color: #fff;;}
  .part-sec dl dd{padding: 20px 0; border-bottom:1px dashed #ddd;}

  .prt--img{width: 100px; height: 100px;}
  .part-img li + li{margin-left: 4px;}

  .notice-con{padding: 20px;}
  .notice-body>ul li{margin-bottom: 20px;}
  .notice-con span.date{margin-top: 32px;}
  .notice-body .row-wide > [class*='col']{    padding-right: 8px; padding-left: 8px;}
  .notice-body .row-wide {margin-right: -8px; margin-left: -8px;}

  .online-table .tr,.online-table .tr.type02{width: 100%; padding: 16px 0;}
  .online-table .tr .th{font-size: 14px;}

}


/* ********************************************* *
* 500px
* ********************************************* */
@media screen and (max-width: 500px){

  
  .sub-title-con strong {font-size: 32px; margin-bottom: 40px;}
  .search {width: 70%;}
  .board-select{width: 30%;}
  
}

/* ********************************************* *
* 400px
* ********************************************* */
@media screen and (max-width: 420px){
  
  .online-table .tr > *{display: block;}
  .online-table .tr .td{width: 100%;}

  .board-list-top,.board-list-top .total{display: block;}
  .board-list-top .total{margin-bottom: 4px;}
  .board-top{justify-content: space-between;}
 
  /* .select{width: 30%;} */
}