@charset "UTF-8";
/* PAGE - business > Area map
   PAGE - company-en > Area map */
#biz_business #biz_map { background-image: url(../img/business/bg_map.svg);}
.intro {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap:24px;
	padding-bottom : 32px;
}
.intro + .intro{border-top : 1px dashed #ccc;}
.intro__item img {/*country flag*/
	float: left;
	width: 72px;
	margin-right : 16px;
}
.intro__item {
  display: grid;
  grid-template-columns: subgrid;
  gap: 8px;
}
.intro ul {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  overflow: hidden;
  padding-left: 2px;
  }

.intro__country-name { line-height: 1.2; margin-top: auto;}

.intro#sgp .col:first-of-type,
.intro#bgd .col:first-of-type,
.intro#ken .col:first-of-type {	order: 2;}
.intro h5 span.c-f-s { font-size: .8em; display:block; padding-left: 2.5em;}

.intro:nth-of-type(3) .row,
.intro:nth-of-type(5) .row { flex-wrap: wrap-reverse;}

.intro__item li,
.intro-detail__head + ul li{
	background : #002a5c;
	text-align : center;
	font-weight: bold;
	line-height: 1;
	padding :1px 12px;
	transform: skewX(5deg);
	-webkit-transform: skewX(5deg);
}
.intro li span,
.intro-detail__head + ul li span{
	display: inline-block;
	font-size: .8em;
  line-height: 18px;
	color : #FFF;
	transform: skewX(-5deg);
	-webkit-transform: skewX(-5deg);
}

.intro-detail {
  border-top: 1px dashed #ccc;
  padding-top: 56px;
  margin-top: 40px;
}
.intro-detail li { display: inline-block;}
.intro-detail__wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.intro-detail__head {
  font-display: var(--en);
  font-size:1.13333em;
}
.intro-detail__head + ul li { display: inline-block;}
.intro-detail__head + ul li + li { margin-left: 4px;}
.intro-detail__photo { /*max-width: 420px;*/ margin: 0 auto;}
.intro-detail__photo img{ width: 100%; height: auto; margin: 0 auto;}
.intro-detail__photo ul {
  display: flex;
  justify-content: center;
  align-items: center;
  row-gap: 8px;
  margin-top: 8px;
}
.intro-detail__photo li {
	background: none;
	transform: none;
	margin: 0;
}
.intro-detail__photo li+li { margin-left: 8px;}
.intro-detail__photo li .thumb {
	border: 1px solid #fff;
	cursor: pointer;
}
@media (max-width: 649px) {
.intro-detail__wrap { flex-direction: column;align-items: flex-start;}
.intro-detail__wrap ul { margin-top: 8px; margin-left: auto;}
.intro-detail .col-2 .intro-detail__photo { order:1;}
.intro-detail .col-2 > div{ order:2; margin-top: 8px;}
.intro__item img { width: 64px; margin-right: 8px;}
}