@charset "utf-8";
/*================================================
 *  ＰＣ用
 ================================================*/
/*ヘッダーメイン画像*/
.Box{
	width: 100vw;
	/*height: auto;
	min-height: 50vh;*/
	height: 60vh;
	background-size: cover;
	 background-position: center top;
  	background-image:url(../img/work-header1.jpg);
	display: -webkit-box;
  	display: -ms-flexbox;
  	display: flex;

  /* 左右中央寄せ */
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;

  /* 上下中央寄せ */
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.TitleBox{
	width:950px;
}

.TitleBox img{
	width:100%;
	height:auto;
}



/*基本レイヤー*/
.LayerA{
	width:100%;
	margin:0;
	padding:0;
	background-color:#FFF;
	background-image:url(../img/work-header1.jpg);
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100%;
}
.LayerB{
	width:100%;
	margin:0;
	padding:0;
	background-color:#FFF;
}
.LayerC{
	width:100%;
	margin:0;
	padding:0;
	background-color:#FFF;
	background-image:url(../img/Area.jpg);
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:250%;
	padding-top:1px;
}

.LayerD{
	width:100%;
	margin:0;
	padding:0;
	background-color:#E8F1F7;
}
.WrapA{
	width:1120px;
	margin:0 auto;
	height:520px;
	display: -webkit-box;
  	display: -ms-flexbox;
  	display: flex;

  /* 左右中央寄せ */
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;

  /* 上下中央寄せ */
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.WrapB{
	width:1120px;
	margin:0 auto;
	background-color:#FFF;
	padding:40px 0;
}

.WrapC{
	width:1120px;
	margin:0 auto;
	padding:40px 0;
	padding-top:1px;
}
.WrapD{
	width:1120px;
	margin:0 auto;
	padding:40px 0;
}

/*コンテンツページ-------------------------*/
.ContentBoxA{
	width:100%;
	clear:both;
	margin:30px auto;
	margin-bottom:40px;
	padding-bottom:30px;
	/*display: -webkit-box;
  	display: -ms-flexbox;
  	display: flex;*/
}
.ContentTitle{
	width:300px;
	position:relative;
	border-radius:5px;
	overflow:hidden;
	float:left;
	margin:50px 0;
}

h2.SubTitle1{
	width:100%;
	text-align:center;
	color:#FFF;
	position:absolute;
	top:10px;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:600;
	font-size:1.8rem;
}
h3.SubTitle2{
	width:100%;
	text-align:center;
	color:#FFF;
	position:absolute;
	top:60px;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:400;
	font-size:3.2rem;
}
h3.SubTitle3{
	width:100%;
	text-align:center;
	color:#FFF;
	position:absolute;
	top:60px;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:400;
	font-size:2.4rem;
}
h2.LeadTitle1{
	width:100%;
	text-align:center;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:600;
	font-size:2.2rem;
	margin-bottom:15px;
}

.ContentRight{
	width:770px;
	margin-left:50px;
	float:left;
}
h3.MapLead{
	margin:20px auto 0 auto;
	width:650px;
	background-color:#ECEEF2;
	color:#0964A8;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:600;
	padding:6px 10px 4px 10px;
	text-align:left;
	font-size:1.1em;
}


.MapBoxA{
	width:650px;
	margin:0 auto;
}

.MapBoxB{
	width:575px;
	margin:0 auto;
}
.MapBoxBout{
	width:770px;
	clear:both;
}

.MapBoxBinL{
	width:360px;
	float:left;
}
.MapBoxBinR{
	width:360px;
	float:left;
	margin-left:50px;
}
span.MapLead{
	display:block;
	width:100%;
	font-size:0.92em;
	text-align:left;
}
.DiveAreaBox{
	width:1020px;
	margin:40px auto;
	background-color:#FFF;
	border-radius:6px;
	padding-top:1px;
	padding:30px 30px;
	text-align:left;
	clear:both;
}

h3.DiveArea{
	width:300px;
	margin:10px auto;
	
}
h4.AreaZone{
	font-size:2.2rem;
	margin-top:15px;
	padding-bottom:3px;
	/*border-bottom:1px #C0DFEB solid;*/
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:400;
	line-height:2.2rem;
	padding:7px 0 3px 3px;
	border-radius:5px;
}
h4.AreaZone a{
	color:#FFF;
}
h4.AreaZone a::before{
	 /*content:url(../img/next-bt1.png);*/
	 content: '';/*何も入れない*/
  display: inline-block;/*忘れずに！*/
  width: 20px;/*画像の幅*/
  height:20px;/*画像の高さ*/
  background-image: url(../img/next-bt1.png);
  background-size: contain;
  vertical-align: middle;
  margin-right:5px;
}

h4.Philippines{
	background-color:#FFDD53;
}
h4.Malaysia{
	background-color:#7FE87F;
}

h4.Indonesia{
	background-color:#62C792;
}
h4.Timor{
	background-color:#FFAC60;
}
h4.Solomon{
	background-color:#73D0D0;
}
h4.Papua{
	background-color:#E2665B;
}
h4.Brunei{
	background-color:#67D0E6;
}
h4.Another{
	background-color:#A9D6E4;
}
ul.EachArea{
	margin-left:5px;
}
ul.EachArea li{
	display:inline-block;
	width:49%;
	margin:6px 0;
	line-height:1.8rem;
}
h3.AnotherArea{
	background-color:#537ACC;
	color:#FFF;
	font-weight:bold;
	width:180px;
	padding:6px 0 4px 0;
	margin:25px auto 10px auto;
	text-align:center;
	font-size:1.1em;
	border-radius:8px;
}

ul.EachArea li a::before{
	 content: '';/*何も入れない*/
  display: inline-block;/*忘れずに！*/
  width: 12px;/*画像の幅*/
  height:12px;/*画像の高さ*/
  background-image: url(../img/next-bt2.png);
  background-size: contain;
  vertical-align: middle;
  margin-right:5px;
}


.InformationBox{
	width:1020px;
	margin:0 auto;
	background-color:#FFF;
	border-radius:6px;
	padding:20px 30px;;
	text-align:left;
	
}

ul.Imfo{
	margin:0;
	padding:0;
}
ul.Imfo li{
	margin:5px 0;
	padding:0;
	border-bottom:1px #DDECF2 solid;
}
ul.Imfo li.Link a::before{
	 content: '';/*何も入れない*/
  display: inline-block;/*忘れずに！*/
  width: 12px;/*画像の幅*/
  height:12px;/*画像の高さ*/
  background-image: url(../img/next-bt2.png);
  background-size: contain;
  vertical-align: middle;
  margin-right:5px;
}

ul.Imfo li.LinkImg{
	margin:5px 20px;
	width:160px;
	border-bottom:none;
}

h3.AreaZoneAnother{
	font-size:2.2rem;
	margin-top:15px;
	padding-bottom:3px;
	/*border-bottom:1px #C0DFEB solid;*/
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:400;
	line-height:2.2rem;
	padding:7px 0 3px 3px;
	border-radius:5px;
	background-color:#537ACC;
	color:#FFF;
}
h3.AreaZoneAnother a{
	color:#FFF;
}


/**/
.FooterLayer{
	width:100%;
	padding-top:1px;
	clear:both;
	background-color:#546C96;
	
}
.Footer{
	width:1120px;
	margin:0 auto;
	padding-bottom:30px;
	font-size:0.92em;
	color:#FFF;
	clear:both;
	padding-top:30px;
}
/*マージン*/
.mgT20_15{
	margin-top:20px;
}
.mgT30_20{
	margin-top:30px;
}
.mgT40-20{
	margin-top:40px;
}

hr.hight40-20{
	height:40px;
	border:none;
	width:100%;
	background-color:inherit;
}
hr.hight20-10{
	height:20px;
	border:none;
	width:100%;
	background-color:inherit;
}
hr.hight50-25{
	height:50px;
	border:none;
	width:100%;
	background-color:inherit;
}

.Opa30{
	opacity:.30;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}

hr.gLine{
	width:100%;
	margin-top:35px 0 20px 0;
	padding-top:1px;
	height:1px;
	border:none;
	background-color:#CCC;
}
.FontS{
	font-size:0.7em;
}
hr.BlueLine{
	width:100%;
	display:block;
	padding-top:1px;
	height:4px;
	border:none;
	background-color:#CDE6F3;
	margin-bottom:20px;
}