/* 공통 */
.all-wrap{padding-top:130px; }
.all-wrap > div{}
.all-wrap > div.tit-ani{position:relative;padding-bottom: 350px !important; border-radius: 30px !important;}
.all-wrap > div.tit-ani span{ text-align: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%;}
.all-wrap > div.tit-ani span h1{ color: white; font-size: 80px; font-weight: 400; letter-spacing: 0px; margin-bottom: 20px; position: relative; animation: move-txt 3s 1;}

@keyframes move-txt {
    0%{
      color: #000;
      margin-bottom: -40px;
    }
    30%{
      letter-spacing: 25px;
      margin-bottom: -40px;
    }
  }

  input:focus{outline:none}
  .re-tit{text-align: center; font-size: 45px; font-weight: 600; margin-bottom: 20px;}
/* About Us */
.intro-top  {position:relative;
    background: url('https://s3.ap-northeast-2.amazonaws.com/lbplatform/images/스카이오프쇼어B2B/16305157652953.jpg') no-repeat;
    background-size: cover; background-position: center; 
}

.itro-btm{position: relative; text-align: left; padding-bottom: 100px;}
.itro-btm:before{    position: absolute; content: ""; right: -22%; width: 100%; height: 100%; bottom: -25%;
    background: url(https://s3.ap-northeast-2.amazonaws.com/lbplatform/images/스카이오프쇼어B2B/162541319319610.png) no-repeat; background-position: center; background-size: contain;}
.itro-btm li{margin-bottom: 50px;}
.itro-btm li p{font-size: 21px; max-width: 100%; font-weight: 400;color: #6c6b6b;}
.itro-btm li div i{display:block; margin: 100px 0px; background:url(https://s3.ap-northeast-2.amazonaws.com/lbplatform/images/스카이오프쇼어B2B/162500243556376.png) no-repeat; padding-bottom: 33%;
    background-size: 1020px; background-position: right;}


.tabSet-1{}
.tabSet-1 ul.tabs { border-bottom: 1px solid #ccc; overflow:hidden;  display: flex; padding-bottom: 15px;}
.tabSet-1 ul.tabs  li{position:relative; }
.tabSet-1 ul.tabs li a{ color: #b5b5b5; padding: 0.5em 2.75em; font-weight: 500;  }
.tabSet-1 ul.tabs li a.on:before{position:absolute; content:"";  width:100%; height:3px; background:#29235c;left: 0; bottom: 0;}
.tabSet-1 ul.tabs li a:hover{}
.tabSet-1 ul.tabs li a.on{position:relative; cursor:default;    padding: 16px 30px;  color: #000; font-weight: 600; }
.tabSet-1 ul.tabs li a.on:hover{}
.panels{background:#fff;     margin-top: 50px;}
.panel{display:none;}    

/* .timeline{background:url(https://s3.ap-northeast-2.amazonaws.com/lbplatform/images/스카이오프쇼어B2B/163078307325343.png) no-repeat; background-size: contain; background-position: right;} */
.out {border-left: 2px solid rgb(181 181 181 / 40%); width:100%;}
.card { position: relative; margin: 0 0 30px 20px; padding: 10px; color: gray; border-radius: 8px}
.info { display: flex; flex-direction: column; gap: 10px;}
.info div{}
.info div h4{position:relative; font-size: 22px;color: #555;padding-left: 20px;}
.info div h4:before{position: absolute; left: 0; top: 7px; content: ""; width: 9px; height: 9px; border-top: 2px solid #28225c; border-right: 2px solid #28225c; transform: rotate(45deg);}
.info p{font-weight: 500;font-size: 20px;}
.title { color: #28225c;; position: relative; font-size: 30px; padding-bottom: 10px;}
.title::before { content: ""; position: absolute; width: 17px; top:10px; height: 17px; background: #fff; border-radius: 999px; left: -39px; border: 3px solid #28225c;}
.timeline .his-bg i{display:block; background:url(https://s3.ap-northeast-2.amazonaws.com/lbplatform/images/스카이오프쇼어B2B/163078258885845.png) no-repeat; background-size: cover; background-position: right;}
.logo-wrap{    display: flex; flex-wrap: wrap;}
.logo-wrap span{    display: block; width: 15.8%; border: 1px solid #f1f1f1; background: #fff; z-index: 9; padding: 16px;     margin-right: 0.8%; margin-bottom: 10px;}



/* Location */
.location-wrap{}
.location-wrap .loca-top{    background-attachment: fixed !important; 
    background:url(https://s3.ap-northeast-2.amazonaws.com/lbplatform/images/스카이오프쇼어B2B/162500473638064.jpg) no-repeat;
    background-size: cover; background-position: center; padding-bottom: 18%; border-radius: 40px;
}
.tabSet.type-2{}
.tabSet.type-2 ul.tabs {border-bottom: 1px solid #ccc; overflow:hidden;  display: flex; padding-bottom: 15px;}
.tabSet.type-2 ul.tabs li{position:relative;}
.tabSet.type-2 ul.tabs li a.on:before{position:absolute; content:"";  width:100%; height:3px; background:#29235c;left: 0; bottom: 0;}
.tabSet.type-2 ul.tabs li a{color: #b5b5b5; padding: 0.5em 2.75em; font-weight: 500;   }
.tabSet.type-2 ul.tabs li a:hover{}
.tabSet.type-2 ul.tabs li a.on{position:relative; cursor:default;    padding: 16px 30px;  color: #000; font-weight: 600;  }
.tabSet.type-2 ul.tabs li a.on:hover{}
.panels{background:#fff;     margin-top: 50px;}
.panel{display:none;}


.in-loca{}
.in-loca .container-02{display: flex;  flex-flow: row nowrap;   }
.in-loca .sidebar{position:relative;  text-align: center; width:30%;height:100%; position: sticky; top:10%;}
.in-loca .sidebar:before{position:absolute;content:""; bottom:0;     width: calc(50% - 200px); left:0; height:1px; background:#29235c}
.in-loca .sidebar:after{position:absolute;content:""; bottom:0;     width: calc(50% - 200px); right:0; height:1px; background:#29235c}
.in-loca .sidebar li{  padding: 10px 20px;  width: 200px; text-align: left;}
.in-loca .sidebar li.on:before{position:absolute; content:""; width:5px; height:5px; background:#28225c; left:0; border-radius: 50%;    top: 50%; transform: translateY(-50%);}
.in-loca .sidebar li.on{position:relative; color: #28225c;}
.in-loca .sidebar li.on a{ font-weight:600}
.in-loca .content{width: 70%;}
.in-loca .content > div{}
.in-loca .content ul{margin-bottom: 70px;}
.in-loca .content ul li{width:100%;}
.in-loca .content ul li .root_daum_roughmap_landing{width:100%; border-radius:10px;}
.in-loca .content ul li h3{text-align: left; font-weight: 600; display: block;  color: #999999;   font-size: 22px; width:300px;}
.in-loca .content ul li h3 span{display:block;color: #1d70b8; FONT-WEIGHT: 700; font-size: 40px;}
.in-loca .content ul li p{font-weight: 500; font-size: 18px; color: #555555; text-align: right;}
.in-loca .content ul li div p{text-align: right;}
.in-loca .content ul li div p:first-child{font-weight: 600; color:#333333;}
.in-loca .content ul li iframe{width:100%; height:320px; border-radius: 10px;}
.in-loca .content ul li:last-child{ padding: 10px 0px; display: flex;  align-items: center;   padding: 30px 0px; justify-content: space-between;}

.sidebar li a{display: block; font-weight: 500; font-size: 18px; transform: translateX(0); transition: all .2s ease;}


/* News */
.news-top{background:url(https://s3.ap-northeast-2.amazonaws.com/lbplatform/images/스카이오프쇼어B2B/162507515175600.jpg) no-repeat; 
    background-size:cover; background-position: center; padding-bottom: 18%; border-radius: 40px;}
.board_list {width: 100%;}
.board_list tr {display: block; padding: 30px 20px; align-items: center; cursor:pointer; border-bottom: 1px solid #ddd; display: flex; width: 100%; justify-content: space-between; transition:all 0.3s;}
.board_list tr:hover{background:#29235c; border-radius: 20px; border-bottom: none;}
.board_list tr:hover td:first-child{color:#fff;}
.board_list tr:hover .tit{color:#fff;}
.board_list tr:hover .tit span{color:#f5f5f5;}
.board_list tr:hover td:last-child{color:#fff;}
.board_list th,
.board_list td { padding: 10px; font-size: 14px; }
.board_list td { text-align: center;}
.board_list td:first-child{    font-size: 18px; font-weight: 400;}
.board_list td:last-child{    font-size: 18px; font-weight: 400;}
.board_list .tit {    text-align: left; width: 80%; font-size: 20px;}
.board_list .tit span{font-size:16px; color: #7c7a7a;}
.paging {margin-top: 70px; text-align: center;margin-top: 70px; text-align: center; display: flex; align-items: center; justify-content: center;}
.paging a {  margin-left: 10px;    padding: 10px 15px; border-radius: 100px; font-size: 12px;}
.paging a:first-child {margin-left: 0;}
.paging a.bt {width: 52px;}
.paging a.bt:first-child {transform: rotate(180deg);}
.paging a.num {border: 1px solid #29235c;font-weight: 600;color: #29235c;}
.paging a.num.on { background: #29235c; color: #fff;}

.view_wrap{}
.view_wrap .view_tit{padding-top:50px;}
.view_wrap .view_tit h5{ border-bottom: 1px solid #ddd;  font-size: 25px; padding: 16px 20px; font-weight: 500; color: #333; text-align: center;}
.view_wrap .view_cont{ padding: 50px 0px;     font-size: 16px; font-weight: 500;}
.view_wrap .view_cont > p{}
.view_wrap .view_cont > span.news-pic{}
#content.view_cont img{display:block; margin: 20px 0px;}
.view_wrap .view_btn{margin-bottom: 30px; border-top: 1px solid #999; border-bottom: 1px solid #999;}
.view_wrap .view_btn .view_prev{ border-bottom: 1px solid #ccc; padding: 10px 20px;}
.view_wrap .view_btn .view_prev p.prev{  margin-left:-4px;  width: 106px; background: url(../img/view_p.png) no-repeat right; font-weight: 500; display: inline-block;     background-position: 85px 9px; background-size: 13px;}
.view_wrap .view_btn p.in_cont{ display: inline-block; color: #888; }
.view_wrap .view_btn .view_next{ padding: 10px 20px;}
.view_wrap .view_btn .view_next .next{width: 106px; display: inline-block;margin-left:-4px; 
    background: url(../img/view_n.png) no-repeat right; background-position: 85px 0px; background-size: 13px;
    font-weight: 500;}
.view-date{}
.view-date ul{    text-align: right; padding: 10px 0px; font-weight: 400; font-size: 14px; color: #939191;}
.view-date ul li{display:inline-block;align-items: center;}
.view-date ul li:first-child{padding-right:10px;}
.file_wrap{    display: flex; border-bottom: 1px solid #f1f1f1; padding: 10px 0px; align-items: center;}
.file_wrap > dt{    font-size: 15px; font-weight: 400;}
.file-list li{}
.file-list li em{    padding-left: 10px; font-size: 14px; font-weight: 400; display: inline-block; vertical-align: super;}
.file-list li i{    display: inline-block; width: 23px; }
.no-tit{}
.no-tit h2{    font-size: 22px; color: #28225c;}



/* JOBS */
.job-top{position:relative; 
    background: url('https://s3.ap-northeast-2.amazonaws.com/lbplatform/images/스카이오프쇼어B2B/163094537236317.jpg') no-repeat; background-size: cover; background-position: center; }
.fil-menu{    display: flex; width: calc(100% - 145px);}
.fil-menu > li{width: 450px; max-width: 100%; margin-right: 20px;}
.fil-menu > li div{   align-items: center; position: relative;}
.fil-menu > li div h2{ position: relative;cursor:pointer; margin-bottom: 5px; border-bottom: 2px solid #000;  padding-bottom: 5px;   font-weight: 400;}
.fil-menu > li div h2 span{display: inline-block; position: absolute; right: 0; vertical-align: middle; margin:0px 10px; width:13px;}
.fil-menu > li div h2.on span{transform:rotate(180deg)}
.fil-menu > li div ul{ margin-bottom: 5px; font-weight: 400; padding: 10px; display:none;position: absolute;  z-index:9;    border-radius: 7px;    box-shadow: 0 0 7px 1px rgb(0 0 0 / 6%);  background: #fff; border: 1px solid #ddd; width: 100%;}
.fil-menu > li div ul li{padding: 5px 0px;font-size: 16px; color: #5c5c5c; margin-right: 0; cursor: pointer;}
.job-btm > div.fil-menu-wrap{display:flex;}
.job-btm button{width: 145px; background:#29235c; color:#fff; height: 36px; border-radius: 9px;}
.job-sec{}
.job-sec ul{display:flex;flex-wrap: wrap;}
.job-sec ul li{width:25%;}
.job-sec ul li form{border:1px solid #ddd; border-radius: 20px; padding:30px; margin-bottom: 40px; margin-right: 20px;}
.job-sec ul li:nth-child(4n) form{margin-right:0px;}
.job-sec ul li form > div{margin-bottom: 22px;}
.job-sec ul li form > div h2{font-weight: 700; font-size: 16px; color: #29235c;}
.job-sec ul li form > div p{font-weight: 500; color: #333; padding-top: 5px;}
.job-sec ul li form button{width:100%; background:#f5f5f5; color:#5c5c5c; transition:all 0.3s;}
.job-sec ul li form button:hover{background:#29235c; color:#fff;}
.paging {margin-top: 70px; text-align: center;margin-top: 70px; text-align: center; display: flex; align-items: center; justify-content: center;}
.paging a {  margin-left: 10px;    padding: 10px 15px; border-radius: 100px; font-size: 12px;}
.paging a:first-child {margin-left: 0;}
.paging a.bt {    width: 52px;}
.paging a.bt:first-child {transform: rotate(180deg);}
.paging a.num {border: 1px solid #29235c;font-weight: 600;color: #29235c;}
.paging a.num.on { background: #29235c; color: #fff;}


/* jobs-view */
.jview-btm{}
.jview-btm > h2{text-align: center; font-size: 20px; font-weight: 600; background: rgb(246 245 248); padding: 16px 0px; border: 1px solid #ccc; border-bottom: 0px;}
.jview-btm > h2 strong{font-size: 16px; font-weight: 600; padding-right: 16px;}
.jview-btm ul{border: 1px solid #ccc;}
.jview-btm ul li{display: flex; border-bottom: 1px solid #ccc;}
.jview-btm ul li:last-child{border-bottom:0px;}
.jview-btm ul li h3{width: 250px; padding: 16px 20px; background: #f6f5f8;  border-right: 1px solid #ccc;    font-weight: 500; font-size: 16px;}
.jview-btm ul li input{ border: 0px; width: calc(100% - 250px); padding: 0px 20px;}
.jview-btm ul li textarea{ border: 0px; width: calc(100% - 250px); padding: 0px 20px; resize: none; background-color: white;}
.jview-btm ul li p{ border: 0px; width: calc(100% - 250px); padding: 0px 20px;}
.sub-btn{display:flex; justify-content: center;border: none !important;}
.sub-btn li{  display:block !important;  border-radius: 10px; padding: 10px; width: 180px; margin: 0px 10px; text-align: center;}
.sub-btn li:first-child{ border: 1px solid #28225c;}
.sub-btn li:last-child{background:#28225c; color:#fff;}
.sub-btn li a{}
.jview-wrap-2{}
.jview-wrap-2 div{position:relative; text-align: center; height: 25vh; margin-top: 100px;}
.jview-wrap-2 div:before{    position: absolute;
    content: "";
    background: url(https://s3.ap-northeast-2.amazonaws.com/lbplatform/images/스카이오프쇼어B2B/163146281531181.png) no-repeat;
    background-size: cover;
    background-position: center; width: 490px; height: 100px; opacity: 0.1; left: 50%; transform: translateX(-50%); top: -30px; filter: blur(3px);}
.jview-wrap-2 div h1{font-size: 22px; font-weight: 600;}
.jview-wrap-2 div p{color: #353535; padding-top: 18px; font-weight: 600;}






/* vessel Manager */
.vessel-top{position:relative; background: url('https://s3.ap-northeast-2.amazonaws.com/lbplatform/images/스카이오프쇼어B2B/163079960812501.jpg') no-repeat; background-size:cover; background-position: center;}
/* .vessel-top.tit-ani span h1{color:#28286e !important} */
.vessel-btm{}
.vessel-btm > p{text-align: center; font-size: 20px;font-weight: 600;line-height: 1.8; margin:0 auto; width:1000px; max-width: 100%;}
.vessel-btm > p:last-child{margin-top:100px;}
.vessel-btm ul{display: flex;justify-content: center;}
.vessel-btm ul li{position:relative; width: 33.3333%; margin-right: 5%;}
.vessel-btm ul li > div{position: relative; width: 370px; height: 370px; max-width:100%; display: flex; align-items: center; justify-content: space-around;}
.vessel-btm ul li:last-child{margin-right:0px;}
.vessel-btm ul li > div:before{position: absolute; content:""; width:100%; height:100%; border:1px solid #1d70b8; border-radius: 50%; border-left-color: #fff;}
.vessel-btm ul li:nth-child(2) > div:before{border:1px solid #29235c;border-left-color: #fff;}
.vessel-btm ul li h2{  color:#fff;  position: absolute; top: 50%; transform: translateY(-50%);     left: -30px; font-size: 11em; font-weight: 600;   -webkit-text-stroke: 1px #1d70b8;}
.vessel-btm ul li:nth-child(2) h2{  -webkit-text-stroke: 1px #29235c;}
.vessel-btm ul li > div div{ margin-left: 40px; width: calc(100% - 130px);}
.vessel-btm ul li > div i{display: block; width: 50px;margin: 0 auto;}
.vessel-btm ul li > div h3{text-align: center; padding: 16px 0px;}
.vessel-btm ul li > div p{font-weight: 300; font-size: 16px; text-align: center;}
.vessel-btm .v-btn{}
.vessel-btm .v-bg{background:url(https://s3.ap-northeast-2.amazonaws.com/lbplatform/images/스카이오프쇼어B2B/162552838343391.jpg) no-repeat; background-position: center; background-size: cover;     padding: 4% 40px; border-radius: 30px;}
.vessel-btm .v-btn p{  color: #f5f5f5;;  text-align: left; font-size: 20px; font-weight: 500;}
.vessel-btm .v-btn p span{color: #fff; margin-bottom: 32px; font-weight: 600; font-size: 27px; display:block; }
.vessel-btm .v-btn button{padding: 16px 50px; color:#fff; border: 1px solid #fff; border-radius: 10px; transition: all 0.3s;}
.vessel-btm .v-btn button:hover{background:#fff; color:#29235c;}
.vessel-btm .v-btn button span{font-size: 16px;}



/* Contact us */
.contact-btm{}
.contact-btm > h2{text-align: center; font-size: 20px; font-weight: 600; background: rgb(246 245 248); padding: 16px 0px; border: 1px solid #ccc; border-bottom: 0px;}
.contact-btm > h2 strong{font-size: 16px; font-weight: 600; padding-right: 16px;}
.contact-btm ul{border: 1px solid #ccc;}
.contact-btm ul li{display: flex; border-bottom: 1px solid #ccc;}
.contact-btm ul li:last-child{border-bottom:0px;}
.contact-btm ul li h3{width: 250px; padding: 16px 20px; background: #f6f5f8;  border-right: 1px solid #ccc;    font-weight: 500; font-size: 16px;}
.contact-btm ul li input{ border: 0px; width: calc(100% - 250px); padding: 0px 20px;}
.sub-btn{display:flex; justify-content: center;border: none !important;}
.sub-btn li{  display:block !important;  border-radius: 10px; padding: 10px; width: 180px; margin: 0px 10px; text-align: center;}
.sub-btn li:first-child{ border: 1px solid #28225c;}
.sub-btn li:last-child{background:#28225c; color:#fff;}
.check-it > div{    padding: 16px 25px;}
.check-label {display: inline-block;position: relative; cursor: pointer; font-size: 16px; font-weight: 400; padding: 0px 30px;}
.check-label input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0;}
.checkmark { position: absolute; top: 4px; left: 0; height: 15px; width: 15px; border-radius: 50%; border: 1px solid #28225c;}
.checkmark:after { content: ""; position: absolute; display: none;}
.check-label input:checked ~ .checkmark:after {display: block;}
.check-label .checkmark:after {     left: 3px; top: 3px; width: 7px; height: 7px;background: #28225c; border-radius: 50%;
    /* -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg); */
  } 
.contact-btm textarea{width:100%; border:none;}
.contact-btm textarea:focus{outline: none;}
.contact-btm li:last-child p{padding:10px;    width: calc(100% - 250px);}  

/* ********************************************* *
 * 1600px
 * ********************************************* */
 @media screen and (max-width: 1660px){
   
   
    
}

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


/* ********************************************* *
* 1300px
* ********************************************* */
@media screen and (max-width: 1300px){
    .all-wrap{padding-top: 80px;}
    .all-wrap > div.tit-ani{border-radius:0 !important}
    .all-wrap > div.tit-ani span h1{font-size: 80px;}
    .vessel-btm ul li{margin-right:0;}
    .vessel-btm ul li > div{width: 330px; height: 330px;}
    .vessel-btm ul li h2{font-size: 9em;}
}


/* ********************************************* *
* 1200px
* ********************************************* */
@media screen and (max-width: 1200px){
    .vessel-btm ul li h2{font-size: 7em; left: 0px;}
    .vessel-btm ul li > div div{margin-left: 20px;}
  
}

/* ********************************************* *
* 1024px
* ********************************************* */
@media screen and (max-width: 1024px){
    .vessel-btm ul li > div i{width: 40px;}
    .job-sec ul li{width:33.3333%;}
    .job-sec ul li form{padding:16px;}
    .job-sec ul li form > div{margin-bottom:16px;}
    .job-sec ul li:nth-child(3n) form{margin-right:0px;}
    .job-sec ul li:nth-child(4n) form{margin-right:20px;}
  
}


/* ********************************************* *
* 960px
* ********************************************* */
@media screen and (max-width: 960px){
    .itro-btm:before{    bottom: -35%;    right: 0%;}
    .vessel-btm ul{    flex-wrap: wrap; justify-content: center;}
    .vessel-btm ul li{width:50%;}
    .vessel-btm ul li > div{margin:0 auto;}

    .in-loca .content ul{margin-bottom: 30px;}
    .in-loca .content ul li:last-child{ align-items: flex-start;   flex-direction: column;}
    .in-loca .content ul li h3{width: 100%; margin-bottom: 10px;}
    .in-loca .content ul li div p{text-align: left;}



}



/* ********************************************* *
* 860px
* ********************************************* */
@media screen and (max-width: 860px){
    .in-loca .content ul li h3{    font-size: 25px;}
    .in-loca .content ul li p{font-size: 17px;font-weight: 500;}

    .fil-menu{width: calc(100% - 115px);}
    .fil-menu > li div h2{font-size: 15px;}
    .job-btm button{width: 115px;}
    .fil-menu > li div ul li{font-size: 15px;}
    .logo-wrap span{width: 19.2%; padding:10px;}

    .out{width:100%;}
    .title{font-size: 23px;}
    .title::before{width: 15px;    height: 15px;left: -28px; border: 2px solid #28225c;}
    .card{margin: 0 0 30px 10px;}
    .info div h4{font-size: 16px;}
    .info p{font-size: 15px;}
    .info div h4:before{width:7px; height:7px}
}


/* ********************************************* *
* 740px
* ********************************************* */

@media screen and (max-width: 740px){
    .vessel-btm ul li > div h3{padding: 10px 0px;}
    .vessel-btm ul li > div p{font-size: 15px;}
    .vessel-btm > p{font-size: 17px;}
    .vessel-btm .v-btn p{font-size: 17px;}
    .vessel-btm .v-btn p span{margin: 7px 0px;}
    .vessel-btm .v-bg{border-radius: 16px;}
    .vessel-btm .v-btn button{padding: 10px 40px; border-radius: 7px;margin-top: 20px;}
    .vessel-btm .v-btn button span{font-size: 14px;}

    .job-sec ul li{width:50%;}
    .job-sec ul li form{margin-right:0px;}
    .job-sec ul li:nth-child(2n-1) form{margin-right:10px;}
    .job-sec ul li:nth-child(2n) form{margin-left:10px;}
    .job-sec ul li:nth-child(4n) form{margin-right:0px;}

    .in-loca .content ul li iframe{height:230px;}

    .news-btm .board_list tr{padding: 20px 10px;}
    .news-btm .board_list .tit{    font-size: 17px;}

    .view_wrap .view_btn p.in_cont{    font-size: 15px; font-weight: 400; vertical-align: bottom; overflow: hidden; white-space: nowrap; width: calc(100% - 114px); text-overflow: ellipsis;}
    .view_wrap .view_btn .view_prev, .view_wrap .view_btn .view_next{padding: 5px 14px;}
    .view_wrap .view_tit h5{ font-size: 20px; padding: 10px 20px;}

    .view_wrap .view_btn p.in_cont span{    display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; width: 80%;}

    .fil-menu > li{    margin-right: 10px;}

}


/* ********************************************* *
* 680px
* ********************************************* */
@media screen and (max-width: 680px){
    .job-btm > div.fil-menu-wrap{flex-direction: column;}
    .fil-menu{flex-direction: column; width:100%;}
    .fil-menu > li{width:100%; margin-right: 0px; margin-bottom: 16px;}
    /* .fil-menu > li div h2{margin-bottom: 20px;} */
    .job-btm button{width:100%;}
    .job-btm button{height: 40px;}
    .job-sec.mt100{margin-top: 40px;}

}



/* ********************************************* *
* 640px
* ********************************************* */
@media screen and (max-width: 640px){
    .all-wrap > div.tit-ani{padding-bottom:280px !important;}
    .all-wrap > div.tit-ani span h1{font-size: 62px;}

    .itro-btm li p{font-size: 18px;}
    .vessel-btm ul li > div:before{    border-left-color: #1d70b8; border-top-color: #fff;}
    .vessel-btm ul li h2{left: 50%; transform: translateX(-50%); top: -7%;    font-size: 5em;}
    .vessel-btm ul li > div div{margin-left: 0px;width: 100%;width: 100%;    padding: 20px;}
    .vessel-btm ul li > div:before{width:280px; height:280px;}
    .vessel-btm ul li:nth-child(2){padding-left:20px;}
    .vessel-btm ul li:nth-child(2) > div:before{  border-left-color: #29235c; border-top-color: #fff;}

    /* .fil-menu{width:100%;margin-bottom: 30px;} */
  
    /* .fil-menu > li:last-child{margin-right:0;} */
    .job-btm > div{    flex-direction: column;}
  
    .paging{flex-direction: row !important;}

    .in-loca .content ul{margin-bottom: 25px;}
    .in-loca .content ul li iframe{height:200px;}
    .in-loca .content ul li:last-child{flex-direction: column;align-items: flex-start;padding: 16px 0px;}
    .in-loca .content ul li h3{margin-bottom: 10px;}

    .in-loca .content ul li div p{text-align:left; font-size: 16px;}
    .in-loca .content ul li h3{font-size: 20px;}

    .news-btm .board_list tr{    flex-wrap: wrap; justify-content: flex-start;}
    .news-btm .board_list td:last-child{padding-left: 40px;font-size: 15px;}
    .news-btm .board_list .tit{    font-size: 16px;}
    .news-btm .board_list .tit span{font-size: 15px;}

    .check-it > div{padding: 16px 13px;}
    .check-label{    padding: 0px 20px;}
    .contact-btm ul li h3{width: 190px;}
    .contact-btm ul li input{width: calc(100% - 190px);}

    .in-loca .content ul li h3{    font-size: 20px;}
    .in-loca .content ul li h3 span{    FONT-WEIGHT: 600; font-size: 34px;}

    .logo-wrap span{width:24.2%;    padding: 6px;}
    
  

}


/* ********************************************* *
* 570px
* ********************************************* */
@media screen and (max-width: 570px){
    .vessel-btm ul li > div:before { width: 250px; height: 250px;}
    .vessel-btm ul li > div p{font-size: 13px;}

    .jview-btm > h2 strong{font-size: 14px; font-weight: 500;} 
    .jview-btm > h2{    font-size: 16px;}
    .jview-btm ul li{flex-direction: column;}
    .jview-btm ul li h3{width: 100%;  padding: 10px 13px; border-right:0px;}
    .jview-btm ul li input{ width: 100%;   height: 55px;}
}



/* ********************************************* *
* 500px
* ********************************************* */
@media screen and (max-width: 500px){
    .all-wrap > div.tit-ani{padding-bottom: 250px !important;}
    .all-wrap > div.tit-ani span h1{font-size: 50px;}
    .itro-btm li{margin-bottom: 25px;}
    .itro-btm li p{font-size: 16px;}
    .vessel-btm > p{font-weight: 500;}
    .vessel-btm ul{flex-direction: column; align-items: center;}
    .vessel-btm ul li:nth-child(2){padding-left:0px}
    .vessel-btm .v-btn p span{font-weight: 500;}

    .job-sec ul li form > div h2{font-size: 14px;}
    .job-sec ul li form > div p{font-size: 15px;}

    .in-loca .sidebar{display:none;}
    .in-loca .content { width: 100%;}
    .news-btm .board_list tr{padding:10px;}
    .news-btm .board_list .tit{padding: 5px;}
    .news-btm .board_list td:last-child{padding: 3px 10px 3px 35px;   font-size: 13px;}

    .contact-btm ul li{flex-direction: column;}
    .contact-btm ul li h3{width:100%;  border-right: 0px; padding: 10px 14px;}
    .contact-btm ul li input{width:100%;height: 55px;}

    .re-tit{margin-bottom: 7px;font-size: 30px;}
    .view_wrap .view_btn p.in_cont span{overflow: hidden; white-space: nowrap; text-overflow: ellipsis; width: 80%;}

    .jview-wrap-2 div:before{width: 330px; height: 60px; top:0px;}
    .jview-wrap-2 div h1{font-size: 19px;}
    .jview-wrap-2 div p{    padding-top: 5px;}

    .logo-wrap span{width: 32.3333%;}
    .title{font-size: 20px;}
    .title::before{    top: 7px;}


  
}

/* ********************************************* *
* 450px
* ********************************************* */
@media screen and (max-width: 450px){
    .job-sec ul li{width:100%;}
    .job-sec ul li:nth-child(2n-1) form{margin-right:0px;}
    .job-sec ul li:nth-child(2n) form{margin-left:0px;}

    .fil-menu > li{margin-right:10px;}
    .fil-menu > li div h2{font-size: 14px;}

    .in-loca .content ul li h3{    font-size: 17px;}
    .in-loca .content ul li h3 span{font-size: 27px;}
    .in-loca .content ul li iframe{border-radius: 10px;}
}


/* ********************************************* *
* 400px
* ********************************************* */
@media screen and (max-width: 400px){
    .all-wrap > div.tit-ani span h1{font-size: 40px;}
    .vessel-btm ul li{width:100%;}
    .vessel-btm ul li:nth-child(2){margin:30px 0px;}
    .vessel-btm ul li > div:before{    width: 90%; height: 90%;}
    .vessel-btm ul li > div p{padding:0px 16px;}

    .fil-menu{flex-direction: column;}
    .fil-menu > li{width:100%;}
    /* .fil-menu > li:last-child{margin-top:20px;} */

}


/* ********************************************* *
* 350px
* ********************************************* */
@media screen and (max-width: 350px){
    .paging a{padding: 5px 10px;}
    .paging a.bt{width:37px;}

    .jview-btm > h2 strong{font-size: 12px; padding-right: 7px;}
    .jview-btm > h2{font-size: 14px;}
    .tabSet-1 ul.tabs{padding-bottom: 10px;}
    .tabSet-1 ul.tabs li a{padding: 0.5em 2em;}
    .tabSet-1 ul.tabs li a.on:before{bottom:4px;}
    

}