@charset "UTF-8";
/* CSS Document */
/*////////////////////////////////////////////////////////

共通css

///////////////////////////////////////////////////////*/
/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
body {
  transition: background-color 0.8s;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  min-height: 100vh;
}
#wrapper {
  position: relative;
  width: 100%;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
  animation: fadeIn 1s ease 0s 1 normal;
  -webkit-animation: fadeIn 1s ease 0s 1 normal;
  letter-spacing: 0.1em;
}
#loading {
  position: fixed;
  left: 50%;
  top: 40%;
  width: 30px;
  margin-left: -15px;
}
#loader-wrap {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: rgba(255, 255, 255, 1);
  z-index: 99999999;
}
.loader, .loader:after {
  border-radius: 50%;
  width: 30px;
  height: 30px;
}
.loader {
  margin: 60px auto;
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 0.6em solid rgba(58, 23, 2, 0.2);
  border-right: 0.6em solid rgba(58, 23, 2, 0.2);
  border-bottom: 0.6em solid rgba(58, 23, 2, 0.2);
  border-left: 0.6em solid #36729f;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}
@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
/*=======================================================

構成要素

=======================================================*/
img {
  width: 100%;
  max-width: 100%;
  line-height: 1;
  vertical-align: top;
}
/* =toTop
-------------------------------------------------------*/
#toTop {
  position: fixed;
  bottom: 5vw;
  right: 1vw;
  width: 60px;
  z-index: 9999;
}
@media screen and (max-width: 599px) {
  #toTop {
    bottom: 17vw;
    right: 2vw;
    width: 40px;
  }
}
/* マウスオーバー透過
-------------------------------------------------------*/
#wrapper a img {
  -webkit-transition: all .3s;
  transition: all .3s;
}
#wrapper a:hover img {
  filter: alpha(opacity=70);
  -moz-opacity: 0.70;
  opacity: 0.70;
  -webkit-transition: all .3s;
  transition: all .3s;
}
#wrapper a:hover {
  -webkit-transition: all .3s;
  transition: all .3s;
}
#wrapper gallery-item a:hover {
    -webkit-transition: all .3s;
    transition: all .3s;
	color: #69a1ad;
}
/* クリアフィックス
-------------------------------------------------------*/
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {
  display: block;
}
/* 注釈
-------------------------------------------------------*/
.notes {
  position: relative;
}
.notes span.notes-head {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
}
.notes span.notes-body {
  display: inline-block;
  padding-left: 1em;
}
/* アニメーション
-------------------------------------------------------*/
.animate {
  visibility: hidden;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn-bottom {
  0% {
    opacity: 0;
    transform: translateY(30px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@-webkit-keyframes fadeIn-bottom {
  0% {
    opacity: 0;
    transform: translateY(30px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes scaleOut {
  0% {
    opacity: 0;
    transform: scale(1.2);
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: scale(1);
  }
}
@-webkit-keyframes scaleOut {
  0% {
    opacity: 0;
    transform: scale(1.2);
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: scale(1);
  }
}
.fadein-animation {
  visibility: visible;
  animation: fadeIn 3s ease 0s 1 normal;
  -webkit-animation: fadeIn 3s ease 0s 1 normal;
}
.fadein-bottom-animation {
  visibility: visible;
  animation: fadeIn-bottom 1s ease 0s 1 normal;
  -webkit-animation: fadeIn-bottom 1s ease 0s 1 normal;
}
.scale-wrap {
  overflow: hidden;
}
.scale-wrap .scale-out-animation {
  visibility: visible;
  animation: scaleOut 3s ease 0s 1 normal;
  -webkit-animation: scaleOut 3s ease 0s 1 normal;
}
/* =ボタン
-------------------------------------------------------*/
.btn-normal {
  display: table;
  width: auto;
}
.btn-normal a {
  display: table-cell;
  vertical-align: middle;
  width: 100%;
  height: clamp(40px, 3.333vw, 60px); /*1500px:60px*/
  font-size: clamp(1.4rem, 1.067vw, 1.067vw); /*1500px:16px*/
  text-align: center;
  text-decoration: none !important;
  padding: 0 30px;
  background-color: #4a4a4a;
  border: solid 1px transparent;
  color: #fff !important;
  -webkit-transition: all .3s;
  transition: all .3s;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 1;
}
.btn-normal a:hover {
  background-color: transparent;
  border: solid 1px #4a4a4a;
  color: #4a4a4a !important;
}
/*text only*/
.btn-txt a {
  position: relative;
  color: #242424 !important;
  font-size: 1.2rem;
  text-decoration: none !important;
  letter-spacing: 0.1em;
}
.btn-txt a::after {
  content: '';
  position: absolute;
  bottom: -3px;
  left: -0.1em;
  width: 100%;
  height: 1px;
  -webkit-transform: scale(0, 1);
  -ms-transform: scale(0, 1);
  transform: scale(0, 1);
  transform-origin: right top;
  background-color: #242424;
  -webkit-transition: transform .3s;
  transition: transform .3s;
}
.btn-txt a:hover::after {
  transform-origin: left top;
  -webkit-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  transform: scale(1, 1);
}

button {
 position: relative;
 overflow: hidden;
 border: 1px solid #18181a;
 color: #36729f;
 display: inline-block;
 font-size: clamp(1.4rem, 1.067vw, 1.067vw);
 line-height: 15px;
 padding: 33px 115px 8px;
 text-decoration: none;
 cursor: pointer;
 background: #fff;
 user-select: none;
 -webkit-user-select: none;
 touch-action: manipulation;
}

@media screen and (max-width: 1024px) {
  button {
    font-size:clamp(1.4rem, 1.067vw, 1.067vw);
	 padding: 21px 82px 0px 82px;
	 
  }
button:after {
    bottom: -62%;
    left: -7px;
    width: 103%;
    height: 114%;
		
	} 
	
}

button span:first-child {
 position: relative;
 transition: color 600ms cubic-bezier(0.48, 0, 0.12, 1);
 z-index: 10;
 left: 0%;
	bottom: 11px;
}

button span:last-child {
 color: white;
 display: block;
 position: absolute;
 bottom: 0;
 transition: all 500ms cubic-bezier(0.48, 0, 0.12, 1);
 z-index: 100;
 opacity: 0;
 top: 50%;
 left: 50%;
 transform: translateY(225%) translateX(-50%);
 height: 14px;
 line-height: 13px;
}

button:after {
 content: "";
 position: absolute;
 bottom: -42px;
 left: -47px;
 width: 459px;
 height: 94px;
 background-color: #36729f;
 transform-origin: bottom center;
 transition: transform 600ms cubic-bezier(0.48, 0, 0.12, 1);
 transform: skewY(9.3deg) scaleY(0);
 z-index: 50;
}

button:hover:after {
 transform-origin: bottom center;
 transform: skewY(9.3deg) scaleY(2);
}

button:hover span:last-child {
 transform: translateX(-50%) translateY(-50%);
 opacity: 1;
 transition: all 900ms cubic-bezier(0.48, 0, 0.12, 1);
}


/*------------------------------------------------------

 =header
 
-------------------------------------------------------*/
header {
  position: relative;
  width: 100%;
  padding: 0 3vw;
  /*height: 6vw;*/
  height: clamp(60px, 6vw, 6vw);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  z-index: 999999;
}
header:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
header .header__container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
}
header .header__container .logo {
  width: clamp(90px, 9.333vw, 9.333vw); /*1500px:140px*/
}
header .header__container .logo a:hover img {
  filter: alpha(opacity=100) !important;
  -moz-opacity: 1 !important;
  opacity: 1 !important;
}
@media screen and (max-width: 599px) {
  header {
    padding: 0 6vw;
  }
}
/* =hamburger-menu
-------------------------------------------------------*/
/*.hamburger-menu {
	display: none;
}*/
.hamburger-menu {
  display: block;
}
.hamburger {
  display: block;
  width: clamp(30px, 3.333vw, 3.333vw); /*1500px:50px*/
  height: auto;
  position: fixed;
  top: 1.333vw; /*1500px:20px*/
  right: 1.333vw; /*1500px:20px*/
  z-index: 2147483647;
  padding-top: 0;
  padding-left: 0;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
  -ms-touch-action: manipulation;
  touch-action: manipulation; /*background: rgba(0, 0, 0, 1);*/
}
.hamburger__icon {
  position: relative;
  margin-top: 10px;
  margin-bottom: 10px;
}
.hamburger__icon, .hamburger__icon:before, .hamburger__icon:after {
  display: block;
  /*width: 50px;*/
  width: clamp(30px, 3.333vw, 3.333vw); /*1500px:50px*/
  height: 3px;
  background-color: #000;
  -moz-transition-property: background-color, -moz-transform;
  -o-transition-property: background-color, -o-transform;
  -webkit-transition-property: background-color, -webkit-transform;
  transition-property: background-color, transform;
  -moz-transition-duration: 0.4s;
  -o-transition-duration: 0.4s;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
}
.hamburger__icon:before, .hamburger__icon:after {
  position: absolute;
  content: "";
}
.hamburger__icon:before {
  top: -10px;
  width: clamp(30px, 3.333vw, 3.333vw); /*1500px:50px*/
}
.hamburger__icon:after {
  top: 10px;
  width: clamp(30px, 3.333vw, 3.333vw); /*1500px:50px*/
}
.hamburger.active .hamburger__icon {
  background-color: transparent;
}
.hamburger.active .hamburger__icon:before {
  -moz-transform: translateY(10px) rotate(45deg);
  -ms-transform: translateY(10px) rotate(45deg);
  -webkit-transform: translateY(10px) rotate(45deg);
  transform: translateY(10px) rotate(45deg);
}
.hamburger.active .hamburger__icon:after {
  -moz-transform: translateY(-10px) rotate(-45deg);
  -ms-transform: translateY(-10px) rotate(-45deg);
  -webkit-transform: translateY(-10px) rotate(-45deg);
  transform: translateY(-10px) rotate(-45deg);
  width: clamp(30px, 3.333vw, 3.333vw); /*1500px:50px*/
}
.fat-nav {
  top: 0;
  left: 0;
  z-index: 999998;
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  background: rgb(226,233,241);
  -moz-transition-property: -moz-transform;
  -o-transition-property: -o-transform;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -moz-transition-duration: 0.4s;
  -o-transition-duration: 0.4s;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}
.fat-nav .fat-nav__wrapper {
  width: 100%;
  height: 100% !important;
  table-layout: fixed;
  transform: translateY(0) !important;
}
.fat-nav .fat-nav__wrapper a {
  position: relative;
  color: #242424;
  text-decoration: none;
}
.fat-nav .fat-nav__wrapper a:hover, .fat-nav .fat-nav__wrapper a:active {
  filter: alpha(opacity=60);
  -moz-opacity: 0.60;
  opacity: 0.60;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.fat-nav .fat-nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row-reverse;
  padding: 10vw;
}
.fat-nav .fat-nav-inner .fat-logo {
  width: 35%;
}
.fat-nav .fat-nav-inner .fat-gnav {
  width: 55%;
}
.fat-nav .to-home {
  font-size: clamp(1.8rem, 1.6vw, 1.6vw); /*1500px:24px*/
  font-weight: bold;
  border-bottom: solid 1px #242424;
  padding-bottom: 7px;
}
.fat-nav ul.global-nav li {
  display: block;
  margin-top: clamp(20px, 2.667vw, 2.667vw); /*1500px:40px*/
  margin-bottom: clamp(20px, 2.667vw, 2.667vw); /*1500px:40px*/
  font-size: clamp(1.4rem, 1.333vw, 1.333vw); /*1500px:20px*/
  color: #999;
}
.fat-nav ul.global-nav:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.fat-nav ul.global-nav li a {
  display: block;
  line-height: 1.4;
  color: #242424;
}
/* active */
/*#sigIndex .fat-nav .to-home a {
  color: #B7B7B7;
}
#sigIndex .fat-nav .to-home a:after {
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  left: -2px;
  width: calc(100% + 4px);
  height: 1px;
  background-color: #B7B7B7;
}*/
@media screen and (max-width: 599px) {
  .hamburger {
    top: 15px;
    right: 15px;
  }
  .fat-nav .fat-nav-inner {
    display: block;
  }
  .fat-nav .fat-nav-inner .fat-logo {
    width: 100%;
    margin-top: 30px;
  }
  .fat-nav .fat-nav-inner .fat-gnav {
    width: 100%;
  }
}
/*------------------------------------------------------

 =footer
 
-------------------------------------------------------*/
footer {
  padding: 20px 6vw;
  font-size: clamp(1.0rem, 0.8vw, 14px); /*1500px:12px*/
  letter-spacing: 0.2em;
  background-color: #e2e9f1;
  text-align: center;
}
/*=======================================================

content

=======================================================*/
#container {
  padding: 4vw 6vw;
}
@media screen and (max-width: 599px) {
  #container {
    padding: 4vw 0;
  }
}
/*------------------------------------------------------
 =pankuzu
-------------------------------------------------------*/
#pankuzu {
  padding: 0 6vw;
  letter-spacing: -0.5em;
}
#pankuzu li {
  display: inline-block;
  font-size: clamp(1.1rem, 0.8vw, 0.8vw); /*1500px:12px*/
  letter-spacing: normal;
}
#pankuzu li::after {
  content: "";
  display: inline-block;
  background-image: url(https://www.shimz.co.jp/theme/civil/assets/common/img/arrow.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: clamp(5px, 0.333vw, 0.333vw); /*1500px:5px*/
  height: clamp(5px, 0.467vw, 0.467vw); /*1500px:7px*/
  margin: 0 10px;
}
#pankuzu li:last-child::after {
  content: none;
  background: none;
  margin: 0;
}
#pankuzu li a {
  text-decoration: underline;
}
#pankuzu li a:link, #pankuzu li a:visited {
  color: #999;
}
#pankuzu li a:hover, #pankuzu li a:active {
  filter: alpha(opacity=70);
  -moz-opacity: 0.70;
  opacity: 0.70;
  -webkit-transition: all .3s;
  transition: all .3s;
}
@media screen and (max-width: 599px) {}
/*------------------------------------------------------
 =title
-------------------------------------------------------*/
.contents-headline {
  position: relative;
  font-size: clamp(2.4rem, 2.4vw, 2.4vw); /*1500px:36px*/
  font-family: 'Noto Serif JP', serif;
  color: #36729f;
  text-align: center;
  line-height: 1.5;
}
.contents-headline + * {
  margin-top: 4vw; /*1500px:60px*/
}
/*---------- section title ----------*/
/*Large*/
.section-ttl-l {
  position: relative;
  font-size: clamp(2.0rem, 2.4vw, 2.4vw); /*1500px:36px*/
  font-family: 'Noto Serif JP', serif;
  color: #36729f;
  text-align: center;
  line-height: 1.5;
}
.section-ttl-l + * {
  margin-top: 4vw; /*1500px:60px*/
}
/*Medium*/
.section-ttl-m {
  position: relative;
  font-size: clamp(1.8rem, 2vw, 2vw); /*1500px:30px*/
  font-family: 'Noto Serif JP', serif;
  color: #36729f;
  text-align: center;
  line-height: 1.5;
}
.section-ttl-m + * {
  margin-top: 2.667vw; /*1500px:40px*/
}
@media screen and (max-width: 599px) {
  .section-ttl-l + * {
    margin-top: 30px;
  }
  .section-ttl-m + * {
    margin-top: 20px;
  }
}

/* gallery-section Styling */
.gallery-section {
    text-align: center;
    padding: 20px;
    background-color: #f8f9fa;
    margin: 30px auto;
    max-width: 100%;
}

.gallery-container {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 15px;
}

.gallery-item {
    width: 22%;
    text-align: center;
    transition: transform 0.3s ease;
}

.gallery-item a p{
	display: inline;   
    background-image: linear-gradient(#36729f, #36729f);
    background-repeat: no-repeat;
    background-size: 0 1px;
    background-position: bottom right;
    padding-bottom: 2px;
    transition: background-size 0.3s ease-out;
}

.gallery-item a:hover p{
    color: #0e93af;
	background-size: 100% 1px;
    background-position: bottom left;
}

.gallery-item img {
    width: 100%;
    height: auto;
    border-radius: 4px;
    transition: transform 0.4s ease;
}

.gallery-item p {
    font-size: 0.9em;
    margin-top: 8px;
}

.gallery-item:hover img {
    transform: scale(1.03);
}

/* Responsive Design */
@media (max-width: 768px) {
    .gallery-container {
        flex-wrap: wrap;
    }

    .gallery-item {
        width: 60%;
        margin-bottom: 15px;
    }

    .more-link {
        justify-content: center;
        margin-top: 20px;
    }
}

/* Base Styling */
body {
    font-family: "Noto Sans JP", sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f8f9fa;
}


/* Highlight Section Styling */
.highlight-section {
    border: 1px solid #003366;
    border-radius: 8px;
    max-width: 900px;
    margin: 20px auto;
    padding: 40px;
    background-color: #ffffff;
}

.highlight-header {
    text-align: center;
	    margin-top: 20px;
    margin-bottom: 30px;
}

.highlight-header span {
    font-size: 1.2em;
    font-weight: bold;
    color: #003366;
    padding: 5px 20px;
    border: 1px solid #003366;
    border-radius: 25px;
    display: inline-block;
}

.highlight-content {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px;
}

.zisseki{
	display: inline;   
    background-image: linear-gradient(#36729f, #36729f);
    background-repeat: no-repeat;
    background-size: 0 1px;
    background-position: bottom right;
    padding-bottom: 2px;
    transition: background-size 0.3s ease-out;
}

.zisseki a:hover p{
    color: #0e93af;
	background-size: 100% 1px;
    background-position: bottom left;
}

.text-section {
    flex: 1 1 100%;
    font-size: 18px;
    color: #333;
    line-height: 1.6;
    display: flex;
    justify-content: center; /* 水平方向中央揃え */
    margin: 0; /* 余白リセット */
    padding: 0px 0px 0px 50px; /* 上下の余白調整 */
    min-height: 200px; /* 必要に応じて高さ調整 */
}

table.blueTable {
  width: 100%;
}
table.blueTable td, table.blueTable th {
  padding: 3px 2px;
}
table.blueTable tbody td {
  font-size: 13px;
}
table.blueTable tfoot td {
  font-size: 14px;
}
table.blueTable tfoot .links {
  text-align: right;
}
table.blueTable tfoot .links a{
  display: inline-block;
  background: #1C6EA4;
  color: #FFFFFF;
  padding: 2px 8px;
  border-radius: 5px;
}

.box {
    position: relative;
    margin-top: 1em;
   /* padding: 1.8em 1.5em 1em 1.5em;*/
    border: 2px solid #000000;
}

.box > div {
    position: absolute;
    top: -1.15em;
    left: 4.5em;
    padding: .4em 1.4em;
    border-radius: 25px;
    background-color: #fff;
	    border: 1px solid #003366;
    color: #18181a;
    font-size: .9em;
}


.box p {
    margin: 0;
}


/* Responsive Design */
@media screen and (max-width: 768px) {
    .text-section {
        padding: 10px 0; /* 上下の余白を小さく */
        min-height: auto; /* 固定高さを解除 */
        line-height: 1.4; /* テキスト行間も少し詰める */
    }
}

.image-section {
    flex: 1 1 100%;
    text-align: left;
	    padding: 0px 40px 0px 40px;
}

.image-section a p{
	display: inline;   
    background-image: linear-gradient(#36729f, #36729f);
    background-repeat: no-repeat;
    background-size: 0 1px;
    background-position: bottom right;
    padding-bottom: 2px;
    transition: background-size 0.3s ease-out;
}

.image-section a:hover p{
    color: #0e93af;
	background-size: 100% 1px;
    background-position: bottom left;
}
.image-section img {
    width: 350px;
    border-radius: 8px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.image-section img:hover {
    transform: scale(1.05);
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.15);
}

.image-section p {
    margin-top: 10px;
    font-size: 0.9em;
}

.image-section2 {
    flex: 1 1 56%;
    text-align: left;
	    padding: 0px 40px 0px 40px;
}

.image-section2 a p{
	display: inline;   
    background-image: linear-gradient(#36729f, #36729f);
    background-repeat: no-repeat;
    background-size: 0 1px;
    background-position: bottom right;
    padding-bottom: 2px;
    transition: background-size 0.3s ease-out;
}

.image-section2 a:hover p{
    color: #0e93af;
	background-size: 100% 1px;
    background-position: bottom left;
}
.image-section2 img {
    width: 350px;
    border-radius: 8px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.image-section2 img:hover {
    transform: scale(1.05);
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.15);
}

.image-section2 p {
    margin-top: 10px;
    font-size: 0.9em;
}

/* Responsive Design */
@media screen and (min-width: 768px) {
    .highlight-content {
        flex-wrap: nowrap;
    }
    .text-section {
        flex: 1 1 60%;
    }
    .image-section {
        flex: 1 1 35%;
    }
}

/*------------------------------------------------------
 =global map
-------------------------------------------------------*/


.map-area{
  position: relative;  		
}

.map-nav li{
    position: absolute;
    background: #3b68c3;
    width: 16%;
    height: auto;
    text-align: center;
}

@media screen and (max-width:1160px){
    .map-nav li {
        position: static;
        width: 100% !important;
        border-bottom: 1px solid white;	
	
}
	.map{
	display: none;
}
}
.map-nav li a{
    display: block;
    color: #fff;
    font-weight: bold;
    font-size: 16px;
    position: relative;
    /*padding: 2px;*/
	text-decoration: none;
}

.map-nav li a:before{
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3px 0 3px 5px;
    border-color: transparent transparent transparent #fff;
    position: absolute;
    left: 7px;
    top: 40%;
}
.map-nav li a:hover {
    background: #0f3a79;
}

.map-nav li#navi01 {
    left: 82%; 
    top: 35.2%;
}
.map-nav li#navi02 {
    left: 82%;
    top: 44%;
}
.map-nav li#navi03 {
    left: 82%;
    top: 53%;
}
.map-nav li#navi04 {
    left: 82%;
    top: 62%;
}
.map-nav li#navi05 {
    left: 82%;
    top: 70.7%;
}
.map-nav li#navi06 {
    left: 58.3%;
    top: 14%;
}
.map-nav li#navi07 {
    left: 48%;
    top: 29%;
}
.map-nav li#navi08 {
    left: 82%;
    top: 78.8%;
}
.map-nav li#navi09 {
    left: 82%;
    top: 88%;
}
.map-nav li#navi10 {
    left: 48.1%;
    top: 88%;
}
.map-nav li#navi11 {
    left: 55.1%;
    top: 19%;
}
.map-nav li#navi12 {
    left: 6%;
    top: 68%;
}
.map-nav li#navi13 {
     left: 2%;
    top: 22%;
    width: 18%;
}
.map-nav li#navi14 {
     left: 51.7%;
    top: 24%;
}
.map-nav li#navi15 {
    left: 30%;
    top: 76%;
}
.map-nav li#navi16 {
 left: 32%;
    top: 47%;
    width: 17%;
}

.map-nav p{	
 font-size: 16px;
 color: #fff;
 border-bottom: 1px solid #fff;
}

/* USA LLC SRD 0718*/
.map-area ul li#navi13 a {
    font-size: 16px;
}
/* USA LLC SRD 0718*/
.map-area ul li#navi13 a:not(:last-child) {
    border-bottom: 1px solid #fff;
}
/* USA LLC SRD 0718*/
.map-area ul li#navi13 p {
    font-size: 16px;
    color: #fff;
    border-bottom: 1px solid #fff;
}