/*
  Department
*/
/*------------------------
  Hero
------------------------*/
.department #hero {
  background-image: url("../images/department/kv.jpg");
  background-position: center bottom; }

/*------------------------
  common
------------------------*/
.department #dept01, .department #dept02, .department #dept03, .department #dept04, .department #dept05, .department #dept06, .department #dept07 {
  margin-top: -100px;
  padding-top: 100px; }
.department .bg-pink.container {
  background-image: url("../images/common/bg-dots.png");
  background-repeat: no-repeat;
  background-position: right top; }
.department .lead {
  color: #fff;
  position: relative; }
  .department .lead h3 {
    font-size: 2.0rem;
    line-height: 1.5;
    margin-bottom: 30px; }
  .department .lead img {
    display: block;
    margin: 30px auto;
    border-radius: 10px;
    overflow: hidden; }
  .department .lead p + p {
    margin-top: 25px; }
.department .thumb {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  margin-top: 30px; }
  .department .thumb img {
    width: 180px;
    height: 180px;
    border-radius: 50%;
    margin: 0; }
  .department .thumb p {
    font-weight: 500;
    font-size: 2.0rem;
    padding-left: 20px; }
    .department .thumb p small {
      font-size: 1.4rem;
      display: block;
      line-height: 1.5; }
.department .link-btn {
  max-width: 360px;
  width: 100%; }
  .department .link-btn a {
    display: block;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: right 30px center;
    background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2215px%22%20height%3D%2215px%22%20viewBox%3D%220%200%2015%2015%22%20style%3D%22enable-background%3Anew%200%200%2015%2015%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23fa4e66%3B%7D%3C%2Fstyle%3E%3Cg%3E%20%3Cg%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M11.3%2C8.1c-0.4%2C0-0.8%2C0.4-0.8%2C0.8v3.3c0%2C0.6-0.5%2C1.2-1.2%2C1.2H2.8c-0.6%2C0-1.2-0.5-1.2-1.2V5.6%20c0-0.6%2C0.5-1.2%2C1.2-1.2h2.8C6%2C4.4%2C6.4%2C4%2C6.4%2C3.6S6%2C2.8%2C5.6%2C2.8H2.8C1.2%2C2.9%2C0%2C4.1%2C0%2C5.6v6.6C0%2C13.7%2C1.2%2C15%2C2.8%2C15h6.6%20c1.5%2C0%2C2.8-1.2%2C2.8-2.8V8.9C12.1%2C8.5%2C11.7%2C8.1%2C11.3%2C8.1z%20M15%2C7.6V0.8c0-0.1%2C0-0.2-0.1-0.3c0-0.1-0.1-0.2-0.1-0.2l0%2C0l0%2C0%20c-0.1-0.1-0.1-0.1-0.2-0.1C14.4%2C0%2C14.3%2C0%2C14.2%2C0H7.3C6.9%2C0%2C6.6%2C0.4%2C6.6%2C0.8S7%2C1.6%2C7.4%2C1.6h4.9L5.5%2C8.4c-0.3%2C0.3-0.3%2C0.8%2C0%2C1.1%20s0.8%2C0.3%2C1.1%2C0l6.8-6.8v4.9c0%2C0.4%2C0.4%2C0.8%2C0.8%2C0.8S15%2C8%2C15%2C7.6L15%2C7.6z%22%2F%3E%20%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    padding: 0 30px;
    border-radius: 10px;
    color: #fa4e66;
    line-height: 50px;
    font-weight: 700; }
    .department .link-btn a:hover {
      background-color: #293962;
      color: #fff;
      background-image: url("../images/common/icon-blank.svg"); }
.department p + .link-btn {
  margin-top: 30px; }
.department .staff-wrap .row {
  margin: -25px -20px; }
  .department .staff-wrap .row + h3 {
    margin-top: 50px; }
.department .staff-wrap .column-4 {
  padding: 25px 20px; }
  .department .staff-wrap .column-4 .inner {
    height: 100%;
    border: 1px solid #eee;
    border-radius: 10px;
    overflow: hidden; }
  .department .staff-wrap .column-4 .image {
    position: relative;
    overflow: hidden; }
    .department .staff-wrap .column-4 .image::before {
      content: '';
      padding-bottom: 115%;
      display: inline-block; }
    .department .staff-wrap .column-4 .image img {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      width: 100%; }
  .department .staff-wrap .column-4 .text {
    padding: 20px 10px 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center; }
    .department .staff-wrap .column-4 .text .p-tag {
      background: #fa4e66;
      border-radius: 5px 5px 0 0;
      font-size: 1.3rem;
      line-height: 25px;
      padding: 0 20px;
      color: #fff;
      text-align: center; }
    .department .staff-wrap .column-4 .text .name {
      width: 100%;
      text-align: center;
      font-size: 2.0rem;
      font-weight: 700;
      line-height: 1;
      color: #293962;
      margin-bottom: 20px; }

@media screen and (max-width: 768px) {
  .department #dept01, .department #dept02, .department #dept03, .department #dept04, .department #dept05, .department #dept06, .department #dept07 {
    margin-top: 0;
    padding-top: 0; }
  .department .bg-pink.container {
    background-size: 90% auto; }
  .department .lead h3 {
    font-size: 1.6rem; }
  .department .lead img {
    margin: 20px auto; }
  .department .lead p + p {
    margin-top: 20px; }
  .department .thumb {
    margin: 0 0 30px; }
    .department .thumb img {
      width: 150px;
      height: 150px;
      margin: 0; }
    .department .thumb p {
      font-size: 1.6rem;
      padding-left: 0;
      text-align: center; }
      .department .thumb p small {
        font-size: 1.3rem; }
  .department .link-btn a {
    padding: 0 20px;
    background-position: right 20px center; }
  .department p + .link-btn {
    margin-top: 20px; }
  .department .staff-wrap .row {
    margin: -10px -5px; }
  .department .staff-wrap .column-4 {
    width: 25%;
    padding: 10px 5px; }
    .department .staff-wrap .column-4 .text .p-tag {
      padding: 0 10px; } }
@media screen and (max-width: 640px) {
  .department .staff-wrap .row {
    margin: -10px -5px; }
    .department .staff-wrap .row + h3 {
      margin-top: 40px; }
  .department .staff-wrap .column-4 {
    width: 50%;
    padding: 10px 5px; }
    .department .staff-wrap .column-4 .text .p-tag {
      font-size: 1.2rem;
      line-height: 20px; }
    .department .staff-wrap .column-4 .text .name {
      font-size: 1.6rem; } }
/*------------------------
  01
------------------------*/
#dept01 ul {
  margin: 20px 0 30px 20px;
  list-style: disc; }

@media screen and (max-width: 768px) {
  #dept01 .row.default .column-2 + .column-2 {
    padding-top: 20px; }
  #dept01 ul {
    margin: 20px 0 20px 20px;
    list-style: disc; } }
/*------------------------
  02
------------------------*/
#dept02 .row.default .column-2 + .column-2 {
  padding-top: 20px; }

@media screen and (max-width: 768px) {
  #dept02 .row.default .column-2 + .column-2 {
    padding-top: 20px; } }
/*------------------------
  03
------------------------*/
@media screen and (max-width: 768px) {
  #dept03 .row.default .column-2 + .column-2 {
    padding-top: 20px; } }
/*------------------------
  04
------------------------*/
/*------------------------
  05
------------------------*/
/*------------------------
  06
------------------------*/
#dept06 {
  margin-bottom: 1px; }

/*------------------------
  07
------------------------*/
#dept07 {
  margin-bottom: 100px; }
  #dept07 .gallery {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    max-width: 760px;
    margin: 40px auto 0; }
    #dept07 .gallery .column-3 {
      padding: 0 20px; }
    #dept07 .gallery img {
      border-radius: 10px;
      overflow: hidden; }

@media screen and (max-width: 768px) {
  #dept07 {
    margin-bottom: 70px; }
    #dept07 .gallery {
      display: -webkit-box;
      display: -webkit-flex;
      display: flex;
      -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      margin: 30px auto -5px; }
      #dept07 .gallery .column-3 {
        padding: 5px;
        width: 33.33%; } }
@media screen and (max-width: 640px) {
  #dept07 .gallery .column-3 {
    padding: 5px;
    width: 50%; } }
