@charset "utf-8";

.demartment-box {position: relative;}
.demartment-box ul {display: flex; flex-wrap:wrap; margin:0 -20px;}
.demartment-box li {width:25%; padding:0 20px; margin-bottom: 20px; min-height:110px;}
.demartment-box li .box {border:1px solid #ccc; position: relative; min-height:110px; display: flex; align-items: center; }
.demartment-box li a { padding:0 30px;display: flex; justify-content: center; flex-direction: column; min-height:170px;  }
.demartment-box strong {display: inline-block; font-size: 19px; font-family: 'HG Medium'; color:#000; position: relative; line-height:1.5; padding-left:30px; word-break: break-all; margin-bottom: 5px;}
.demartment-box .a {padding:0 30px; min-height:170px; width:100%;display: flex; justify-content: center; flex-direction: column;}
.demartment-box .a > strong {padding-left: 0 !important;}
.demartment-box a > strong {align-self:start; padding-left:0 !important;}
.demartment-box a > strong span {background: linear-gradient(to bottom, transparent 98%, #00B6AD 0) left center no-repeat; background-size:0; transition: background-size .5s;}
.demartment-box a > strong span::after {content:''; display: inline-block; background:url('../../images/sub/dept/icon-blank.png') no-repeat right center;  margin-left: 25px; width: 11px; height: 11px;}
.demartment-box strong::before {content:''; width:0%; height:1px; background:#00B6AD; position: absolute; left: 0; bottom:0; transition: width .3s;}
.demartment-box .tel {line-height: 30px; margin-top: 20px; font-family: 'HG Regular'; font-size: 15px; color:#555}
.demartment-box .tel span {display: inline-block; font-family: 'HG Medium';font-size: 15px;color: #000;position: relative;padding-left: 40px;padding-right: 14px;margin-right: 15px; }
.demartment-box .tel span::after {content: '';width: 1px;height: 9px;background: #ccc;position: absolute;right: 0;top: 50%;margin-top: -4px;}
.demartment-box .tel span::before {content: '';width: 30px;height: 30px;background: #F0FFFE url('../../images/sub/dept/icon-tel2.png') no-repeat center;border-radius: 50%;position: absolute;left: 0; filter: grayscale(1) contrast(0.8); transition:transform .3s;}
.demartment-box .box:hover {box-shadow:0px 0px 20px rgba(0,182,173,0.1);}
.demartment-box a:hover::after {content:''; border:2px solid #00B6AD; position: absolute; top:-1px;; left:-1px; right:-1px; bottom:-1px;}
.demartment-box a:hover strong {color: #00B6AD;}
.demartment-box a:hover strong span {background-size:100% auto;}
.demartment-box a:hover > strong span::after {background:url('../../images/sub/dept/icon-blank-on.png') no-repeat right center;}
.demartment-box a:hover .tel span::before {filter: grayscale(0) contrast(1);}

@media screen and (max-width:1300px) {
  .demartment-box li {width:33.3333%;}
}
@media screen and (max-width:1000px) {
  .demartment-box ul {margin:0 -10px;}
  .demartment-box li {padding:0 10px;}
  .demartment-box strong {padding-left:15px;}
  .demartment-box li .a  {padding:0 15px; min-height:150px;}
  .demartment-box li a {padding:0 15px; min-height:150px;}
  .demartment-box strong {font-size: 17px;}
}
@media screen and (max-width:850px) {
  .demartment-box li {width:50%;}
}
@media screen and (max-width:600px) {
  .demartment-box li {width:100%;}
}

.content-tab-content{margin-bottom: 7px;}
.content-tab-content .content-tab-box{display: none;}
.content-tab-content .content-tab-box.active{display: block;}
.content-tab-content .flex-inner{display: flex; flex-wrap: wrap;}
.content-tab-content .flex-inner .flex-box{width: 51.34%;}
.content-tab-content .flex-inner .flex-box:nth-child(2){width: 48.66%;}
.content-tab-content .flex-inner .flex-box.half{width: 100%;}
.content-tab-content .flex-inner .flex-box dl{display: flex; flex-wrap: wrap; margin-bottom: 11px;}
.content-tab-content .flex-inner .flex-box dl:last-child{margin-bottom: 0;}
.content-tab-content .flex-inner .flex-box dt{font-size: 16px; color: #333333; font-family: "HG Medium"; padding-left: 15px; position: relative; width: 185px;}
.content-tab-content .flex-inner .flex-box dt::before{content:""; display: block; position: absolute; left: 0; top: 11px; width: 4px; height: 4px; border-radius: 50%; background-color: #222222;}
.content-tab-content .flex-inner .flex-box dd{font-size: 16px; line-height: 26px; color: #555555; width: calc(100% - 185px)}
.content-tab-content .flex-inner .date-list{margin-top: 7px;}
.content-tab-content .flex-inner .date-list.half{display: flex; flex-wrap: wrap;}
.content-tab-content .flex-inner .date-list.half dl:nth-child(odd){width: 51.34%;}
.content-tab-content .flex-inner .date-list.half dl:nth-child(even){width: 48.66%;}

@media screen and (max-width: 768px) {
  .content-tab-content .flex-inner .flex-box,
  .content-tab-content .flex-inner .flex-box:nth-child(2),
  .content-tab-content .flex-inner .date-list.half dl:nth-child(odd),
  .content-tab-content .flex-inner .date-list.half dl:nth-child(even){width: 100%;}
  .content-tab-content .flex-inner .flex-box dt{width: 135px; font-size: 14px;}
  .content-tab-content .flex-inner .flex-box dt::before{top: 8px;}
  .content-tab-content .flex-inner .flex-box dd{width: calc(100% - 135px); font-size: 14px; line-height: 20px; padding-left: 15px;}
}


.dept-list-wrap {position: relative; margin-top: 80px;}
.dept-list-wrap .box-list {display: flex; flex-wrap:wrap; margin:0 -20px;}
.dept-list-wrap .box-list > li {width:50%; padding:0 20px; margin-bottom: 30px;}
.dept-list-wrap .li-frame {border:5px solid #eee; border-radius:5px; padding:30px 35px 25px 35px; height: 100%; background:url('../../images/sub/dept/obj-bg.png') no-repeat right -73px bottom -8px;}
.dept-list-wrap .title {display: flex; flex-wrap:wrap; align-items: center; justify-content: space-between; margin-bottom: 25px;}
.dept-list-wrap .title strong {font-size: 20px; line-height: 30px; color:#333; font-family: 'SBA Medium'; width: 75%;}
.dept-list-wrap .list1 > ul {display: flex; flex-wrap:wrap; margin:0 -10px;}
.dept-list-wrap .list1 > ul > li {width:100%; display: flex; justify-content: space-between; align-items: center; padding:0 10px; margin-bottom: 5px;}
.dept-list-wrap .list1 .box {position: relative; padding-left:15px; font-size: 0; width: calc(100% - 60px);}
.dept-list-wrap .list1 .box::before {content:''; width: 6px; height:6px; background:#c8c8c8; border-radius:50%; position: absolute; left:0; top:12px; margin-top:-3px;}
.dept-list-wrap .list1 em {display: inline-block; font-size: 16px; color: #555; position: relative;}
.dept-list-wrap .list1 span {font-size: 14px; display: inline-block; color:#888; padding-left:12px; margin-left:14px; position: relative;}
.dept-list-wrap .list1 span::after {content:''; width:2px; height:9px; background:#ccc; position: absolute; left:0; top:6px;}
.dept-list-wrap .service-link {display: inline-block;width: 40px; height: 40px; border-radius: 3px; background-color: #999999; background-repeat: no-repeat; background-position: center center; background-image: url(/sites/guide/images/guide/home_icon.png); text-indent: -9999px;}
.dept-list-wrap .service-link:hover{background-color: #0066b5;}
.dept-list-wrap .list2 {position: relative;font-size: 0;}
.dept-list-wrap .tel {font-size: 15px; color:#000; position: relative; display: inline-block; padding-right:14px; margin-right:12px; padding-left:40px;  line-height: 30px;}
.dept-list-wrap .tel::before {content:''; width:30px; height:30px; background:#eee url(../../images/sub/dept/icon-tel.png) no-repeat center; position: absolute; left:0; top:0; border-radius:50%;}
.dept-list-wrap .tel::after {content:''; width:2px; height:9px; background:#ccc; position: absolute; right:0; top:11px;}
.dept-list-wrap .list2 span {display: inline-block; font-size: 15px; color:#555;}

@media screen and (max-width: 1500px) {
  .dept-list-wrap .list1 > ul > li {width:100%;}
}
@media screen and (max-width: 1200px) {    
  .dept-list-wrap {margin-top:50px;}
  .dept-list-wrap .li-frame {padding: 20px 25px 15px 25px;}
  .dept-list-wrap .title {flex-direction: column; gap: 5px; align-items: start}
  .dept-list-wrap .title strong {font-size: 16px; line-height: 25px; width: 100%;}
  .dept-list-wrap .box-list {margin:0 -10px;}
  .dept-list-wrap .list1 em {display: block;;}
  .dept-list-wrap .box-list > li {padding:0 10px;}
}
@media screen and (max-width: 768px) {
  .dept-list-wrap {margin-top: 30px;}
  .dept-list-wrap .li-frame {min-height:auto; padding:15px 25px;}
  .dept-list-wrap .title {margin-bottom:20px;}
  .dept-list-wrap .box-list > li {width:100%; margin-bottom: 20px;}
  .dept-list-wrap .list1 em {font-size: 15px;}
  .dept-list-wrap .list1 em::after {top:7px;}
}