@charset "utf-8";

@import url("m_layout.css");


/* --------------------------------------------
 * 메인비쥬얼
/* ------------------------------------------ */

.main_visual { width:100%; height:250px; overflow:hidden; position:relative; }
.main_visual a { display:block; }
.main-visual-slide { width:100%; height:250px; overflow:hidden; background-size:auto 100%!important; }
.list { width:100%; position:relative; text-align:center; overflow:hidden; }
.info-box {width:100%; }
.info-box .visual-dot-nav { opacity:0; }
.main-visual-slick .slick-slide { overflow:hidden; }


.main-visual-section .slick-dots {position:absolute; bottom:0px; left:0; width:100%; text-align: center; padding:0px 15px 22px; background:rgba(0,0,0,0.3); }
.main-visual-section .slick-dots  li {float:left; position:relative; cursor:pointer; width:25%; z-index:999; color:#fff; padding:10px 0; text-align:left; margin-right:12.5%; }
.main-visual-section .slick-dots  li:last-child { /* float:right; */ margin-right:0; }
.main-visual-section .slick-dots  li span {display:block; font-size:14px; letter-spacing:-0.025em; }
.main-visual-section .slick-dots  li:after {content:''; display:block; position:absolute; top:38px; left:0; width:100%; height:3px; background-color: rgba(255, 255, 255, 4); opacity:0.5;}
.main-visual-section .slick-dots  li:before {content:''; display:block; position:absolute; top:38px; left:0; width:0; height:3px; background-color: rgba(255, 255, 255, 1); opacity:0;}
.main-visual-section .slick-dots .slick-active {opacity:1;}
.main-visual-section .slick-dots .slick-active:after {border:1px solid rgba(214, 214, 214, 1); background-color: rgba(255, 255, 255, 0); box-sizing:border-box; }
.main-visual-section .slick-dots .slick-active:before {width:100%; border:1px solid rgba(214, 214, 214, 1); background-color: rgba(255, 255, 255, 1); box-sizing:border-box; opacity:1; transition:width 8s ease;}

/* --------------------------------------------
 * 메인 컨텐츠 시작
/* ------------------------------------------ */
.txt_pink { color:#e4007f; }
.section { width:100%; overflow:hidden; padding:30px 15px 45px; color:#000; position:relative; }
.section:after { content:''; display:block; clear:both; position:absolute; bottom:0; left:0; width:100%; height:15px; background:#e7ebf2; }

.section .titArea { text-align:center; margin-bottom:30px; }
.section .cttArea { width:100%; }

/* --------------------------------------------
 * service 영역
/* ------------------------------------------ */
.m_board_tab { width:100%; position:relative;  }
.m_board_tab > li {  text-align:center;  }
.m_board_tab > li > a { display:block; font-size:16px; float:left; border:1px solid #000; width:32.2%; font-weight:500; padding:5px 0; }
.m_board_tab > li.on > a { background:#04287e; color:#fff; border-color:#04287e; box-shadow:0px 3px 0 rgba(6,6,6,0.08); }
.m_board_tab > li:nth-child(2) > a { margin:0 5px;  }
.m_board_tab > li .tab_list { width:100%; position:absolute; top:50px; left:0; height:0px; overflow:hidden;  }
.m_board_tab > li.on .tab_list { height:auto; }

.service_tab { height:155px; }
.service_tab > li .tab_list li { width:50%; float:left; text-align: center;  }
.service_tab > li .tab_rent li { width: 100%; padding-top:10px; }
.service_tab > li .tab_equip li { width:100%; padding-top:10px; }

.service_tab > li .tab_list li a { display:block; position:relative; height: 100%; }
.service_tab > li .tab_list li a:after { content:''; display:inline-block; position:absolute; top:10px; right:0; width:1px; height:80px; background:#ccd1d9;  }
.service_tab > li .tab_list li:last-child a:after { display:none; }
.service_tab > li .tab_list li a i { display:inline-block; width:70px; height:70px; background:url('../image/mobile/common/sprite-map-icon.png') 0 0 no-repeat;  background-size:300px 300px; margin:10px auto 0; }
.service_tab > li .tab_list li.m1_list_01 a i { background-position:0 -56px; }
.service_tab > li .tab_list li.m1_list_02 a i { background-position:-68px -56px; }
.service_tab > li .tab_list li.m1_list_03 a i { background-position:-136px -56px; }
.service_tab > li .tab_list li.m2_list_01 a i { background-position:-187px -50px; }
.service_tab > li .tab_list li.m2_list_02 a i { background-position:0px -116px; width:65px; }
.service_tab > li .tab_list li.m3_list_01 a i { background-position:-75px -128px; width:83px; }
.service_tab > li .tab_list li a > span { font-size:16px; color:#000; font-weight:500; display: block; }
/*
.service_tab > li .tab_rent  li a i { width:75px; margin-top:15px; background-size:280px 280px; vertical-align: middle; }
.service_tab > li .tab_rent  li a > span { display: inline-block; margin-left:10px; vertical-align: middle; }
*/
.service_tab > li .tab_rent  li a {  }
.service_tab > li .tab_rent  li a i {vertical-align: middle; width:85px; background-position:-200px -50px!important; }
.service_tab > li .tab_rent  li a > span { display: inline-block; margin-left:30px; vertical-align: middle; width: 60%; font-size:18px; text-align: left; }
.service_tab > li .tab_rent  li a > span span { display: block; font-size: 16px; font-weight:normal; line-height:18px; }
.service_tab > li .tab_rent  li a > span span:before { content:''; display: block; width:30px; height:2px; background:#0086d5; margin:10px 0; }

.service_tab > li .tab_equip  li a {  }
.service_tab > li .tab_equip  li a i {vertical-align: middle;  }
.service_tab > li .tab_equip  li a > span { display: inline-block; margin-left:30px; vertical-align: middle; width: 60%; font-size:18px; text-align: left; }
.service_tab > li .tab_equip  li a > span span { display: block; font-size: 16px; font-weight:normal; line-height:18px; }
.service_tab > li .tab_equip  li a > span span:before { content:''; display: block; width:30px; height:2px; background:#0086d5; margin:10px 0; }

/* --------------------------------------------
 * library 영역
/* ------------------------------------------ */
.m_library .cttArea>ul{display:flex}
.m_library .cttArea>ul:after  { content:''; display:block; clear:both; }
.m_library .cttArea>ul>li { float:left; background:#0086cd; padding:10px; color:#fff; overflow:hidden; width:48%; margin-right:4%; text-align:center;  }
.m_library .cttArea>ul>li:last-child { margin-right:0; }
.m_library .cttArea>ul>li.db_prd { background:#00519f; }
.m_library .cttArea>ul>li .library_img { position:relative; }
.m_library .cttArea>ul>li h3 { font-size:20px; letter-spacing:-0.05em; font-weight:500; margin:20px 0 20px; }
.m_library .cttArea>ul>li p { font-size:14px; letter-spacing:-0.05em; line-height:20px; word-break:keep-all;}
.m_library .cttArea>ul>li .db_btn { display:inline-block; border:1px solid #fff; color:#fff; padding:10px 8px; margin:25px 0 25px;  position:relative; overflow:hidden; background:rgba(0,0,0,0.1); }

.m_library .cttArea>ul>li> div{display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;}


/* --------------------------------------------
 * news 영역
/* ------------------------------------------ */

.m_service { padding: 30px 0px 45px; }
.notice_tab { height:165px; padding:0 15px;  }
.notice_tab > li .tab_list li { text-align:left; background:url('../image/mobile/common/notice_list.png') 0 9px no-repeat; padding-left:15px; margin-bottom:5px; }
.notice_tab > li .tab_list li a { display:block; font-size:15px; color:#000; font-weight:300; width:100%; height:22px; overflow:hidden; }
.m_board_tab.notice_tab > li .tab_list {  margin-top:10px; padding:0 15px; }
.m_board_tab.notice_tab > li .tab_list.tabimg { padding:0 10px; margin-top:0; }
.ellipsis { text-overflow: ellipsis; white-space: nowrap;  overflow: hidden; }
.notice_tab > li .tab_list .list_gally li { height: 120px; background: none; padding:0; margin:0 auto; overflow: hidden;  }
.notice_tab > li .tab_list .list_gally li a { height:120px; padding:0 5px; position: relative; }
.notice_tab > li .tab_list .list_gally li a img { width:160px; height:112px; }
.notice_tab > li .tab_list .list_gally a strong { display: block; width:100%; margin-top:5px;  text-overflow: ellipsis; white-space: nowrap; overflow: hidden; position: absolute; 
bottom:7px; left:5px; background:rgba(0,0,0,0.6); color: #fff; padding:5px; font-weight:300; width:160px; }
.notice_tab  .slick-dots {  text-align:center; padding-top:5px; }
.notice_tab  .slick-dots li { display:inline-block;  }
.notice_tab  .slick-dots li button { text-indent:-9999px; width:15px; height:4px; display:inline-block; background:#656d78; margin:0 5px; outline:0; border: none; }
.notice_tab  .slick-dots li.slick-active button { width:35px; background:#04287e; }