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

/*
Author: Kazuhiro Kinoshita
*/

/* font-size
-------------------------------------------------- */
/*
 
12px * 84% -> 10px
12px * 92% -> 11px
12px * 100% -> 12px
12px * 109% -> 13px
12px * 117% -> 14px
12px * 125% -> 15px
12px * 134% -> 16px
12px * 142% -> 17px
12px * 150% -> 18px
12px * 159% -> 19px
12px * 167% -> 20px
12px * 175% -> 21px
12px * 184% -> 22px
12px * 192% -> 23px
12px * 200% -> 24px
12px * 209% -> 25px
12px * 217% -> 26px
 
13px * 77% -> 10px
13px * 85% -> 11px
13px * 93% -> 12px
13px * 100% -> 13px
13px * 108% -> 14px
13px * 116% -> 15px
13px * 124% -> 16px
13px * 131% -> 17px
13px * 139% -> 18px
13px * 147% -> 19px
13px * 154% -> 20px
13px * 162% -> 21px
13px * 170% -> 22px
13px * 177% -> 23px
13px * 185% -> 24px
13px * 193% -> 25px
13px * 200% -> 26px
 
14px * 72% -> 10px
14px * 79% -> 11px
14px * 86% -> 12px
14px * 93% -> 13px
14px * 100% -> 14px
14px * 108% -> 15px
14px * 115% -> 16px
14px * 122% -> 17px
14px * 129% -> 18px
14px * 136% -> 19px
14px * 143% -> 20px
14px * 150% -> 21px
14px * 158% -> 22px
14px * 165% -> 23px
14px * 172% -> 24px
14px * 179% -> 25px
14px * 186% -> 26px
 
15px * 67% -> 10px
15px * 74% -> 11px
15px * 80% -> 12px
15px * 87% -> 13px
15px * 94% -> 14px
15px * 100% -> 15px
15px * 107% -> 16px
15px * 114% -> 17px
15px * 120% -> 18px
15px * 127% -> 19px
15px * 134% -> 20px
15px * 140% -> 21px
15px * 147% -> 22px
15px * 154% -> 23px
15px * 160% -> 24px
15px * 167% -> 25px
15px * 174% -> 26px
 
16px * 63% -> 10px
16px * 69% -> 11px
16px * 75% -> 12px
16px * 82% -> 13px
16px * 88% -> 14px
16px * 94% -> 15px
16px * 100% -> 16px
16px * 107% -> 17px
16px * 113% -> 18px
16px * 119% -> 19px
16px * 125% -> 20px
16px * 132% -> 21px
16px * 138% -> 22px
16px * 144% -> 23px
16px * 150% -> 24px
16px * 157% -> 25px
16px * 163% -> 26px

/*===== CONTENTS ===========================================

A: デフォルト設定
B: レイアウト設定

　*/


/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 

A: デフォルト設定 

+++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/*===== 1: リセット =================================*/
* {
	margin: 0;
	padding: 0;
	color: #000;
}


/*===== 2: ボディー＆ベース ===========================*/

body {
	font-family: 'Segoe UI', SegoeUI, 'Microsoft YaHei', 微软雅黑, "Helvetica Neue", Helvetica, Arial, sans-serif;
	/*
font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
*/
	font-weight: normal;
	font-size: 14px;
	margin: 0px;
	padding: 0px;
	background: #f3faff url(../img/bg_header.jpg) no-repeat;
	background-position: calc(50% + 0px) 0px;
}

* html body {
	text-align: center;
}

/* general params--------------------*/
p,
pre,
ul,
ol,
dl,
dt,
dd,
div,
address,
form,
blockquote {
	padding: 0;
	/* margin&padding reset */
	line-height: 1.8;
	/* base line height */
	text-align: left;
	display: block;
	margin: 0;
}

div {
	line-height: 0;
}

li {
	list-style: none;
}

img {
	border-style: none;
	margin: 0;
	padding: 0;
}

hr {
	clear: both;
	visibility: hidden;
}

a:link {
	/*未訪問のリンク*/
	color: #0000ee;
	text-decoration: underline;
}

a:visited {
	/*訪問後のリンク*/
	color: #0000ee;
	text-decoration: underline;
}

a:hover {
	/*マウスをのせたとき*/
	color: #0000ee;
	text-decoration: none;
}

a:active {
	/*クリック中*/
	color: #0000ee;
	text-decoration: none;
}






/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 

B: レイアウト設定 

+++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/*===== 0: wrapper ==========================================*/
#wrapper {
	margin: 0 auto;
	width: 1080px;
	font-size: 100%;
}

body#topPage #wrapper {
	background: url(../img/bg_footer.jpg) no-repeat;
	background-position: calc(50% + 150px) bottom;
}

body#otherPage #wrapper {
	background: url(../img/bg_footer2.jpg) no-repeat;
	background-position: calc(50% + 150px) bottom;
}


/*===== 1: ヘッダー ==========================================*/
#header {
	margin: 0 auto 10px auto;
	padding: 0 0 0;
	position: relative;
	width: 100%;
	min-width: 1080px;
	height: 90px;
	display: flex;
	background-color: #fff;
}




/* 白背景 */
#header::before {
	position: absolute;
	content: '';
	left: calc(50% - 50vw);
	width: 100vw;
	height: 100%;
	background-color: #fff;
	z-index: -1;
}

* html #header {
	text-align: left;
}

.headerTitle {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	flex-direction: column;
	padding-left: 10px;
}

#navi {
	width: 100%;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-direction: column;
}

/*logo*/
h1 {
	margin: 0;
	padding: 0;
}

h2 {
	margin: 0 0 4px 0;
	padding: 0;
}


/* グローバルナビゲーション--------------*/
/*gnavi area*/

#gnavi {
	background-color: #fff;
	/* width: 840px; */
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0;
	list-style: none;
}

#gnavi li {
	/* float: left; */
	margin: 0 0 0 0;
	padding: 0 10px;
	display: block;
	border-bottom: 1px solid #fff;
	position: relative;
}

#gnavi li a {
	text-decoration: none;
	color: #000;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 60px;
	font-weight: bold;
}

#gnavi li a:hover {
	color: #fe7f02;
}

#gnavi li.gnaviEnquiry {
	display: flex;
	align-items: center;
	justify-content: center;
}

#gnavi li.gnaviEnquiry a {
	border: 1px solid #fe7f02;
	background-color: #fe7f02;
	width: 110px;
	height: 36px;
	margin-left: 20px;
	color: #fff;
}

#gnavi li.gnaviEnquiry a:hover {
	color: #fe7f02;
	background-color: #fff;
}

#gnavi li .is_active {
	color: #fe7f02;
	pointer-events: none;
}


/*2階層目以降は横並びにしない*/
#gnavi ul {
	display: block;
}

/*下の階層を持っているulの指定*/
#gnavi li.has-child ul {
	position: absolute;
	left: 0;
	top: 40px;
	z-index: 4;
	background: #fff;
	width: 100%;
	visibility: hidden;
	opacity: 0;
	transition: all .3s;
	padding-top: 20px;
}

#gnavi li.has-child:hover>ul,
#gnavi li.has-child ul li:hover>ul,
#gnavi li.has-child:active>ul,
#gnavi li.has-child ul li:active>ul {
	visibility: visible;
	opacity: 1;
}

#gnavi li.has-child ul li {
	text-align: center;
}

#gnavi li.has-child ul li a {
	height: 40px;
}

#gnavi li.has-child ul li:last-child a {
	border-bottom: none;
}

#gnavi li.has-child ul li a:hover,
#gnavi li.has-child ul li a:active {}






/*sub-navi*/
#sub_navi {
	width: 100%;
	background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(5, 108, 223, 1));
	display: flex;
	align-items: center;
	justify-content: flex-end;
	height: 30px;
}

#sub_navi li {
	/* float: left; */
	line-height: 1.0em;
	color: #fff;
}

#sub_navi li a {
	color: #fff;
}

#sub_navi li.sub01 {
	margin: 0;
	padding: 0 20px 0 20px;
	border-right: 1px solid #000;
}

#sub_navi li.sub02 {
	margin: 0;
	padding: 0 25px 0 20px;
}

#sub_navi li.sub03 {
	margin: -15px 0 0 0;
	padding: 0;
}

#sub_navi li.sub04 {
	margin: 0;
	padding: 0 20px 0 0;
	border-right: 1px solid #000;
}





/*===== 2: コンテンツ ==========================================*/
body#topPage #contents {
	padding: 20px 0;
	z-index: 100;
}

body#topPage #contents2 {
	padding: 20px 0;
	margin-left: auto;
	margin-right: auto;
	display: block;
	position: relative;
}

body#otherPage #contents {
	/* max-width: 960px; */
	padding: 20px 0 30px;
	margin-left: auto;
	margin-right: auto;
	display: block;
	z-index: 100;
	overflow: hidden;
}

body#otherPage #contents h3 {
	border-bottom: 3px solid #ff7a00;
	height: 43px;
	overflow: hidden;
}

body#otherPage #contents h3>img {
	/* width: 960px; */
}

/*top*/
#qr {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding-top: 10px;
	padding-bottom: 20px;
}

#qr img {
	width: 50px;
}

#qr p {
	color: #fff;
	width: 420px;
	/* width: calc(100% - 90px); */
	margin-left: 20px;
	font-size: 13px;
	color: #fad6b4;
}

#maingf {
	text-align: right;
	margin: 0 0 15px 0;
}

#topBanner {
	margin-top: 70px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

#topBanner li {
	display: block;
}

.slide01_top {
	width: 442px;
	height: 262px;
	position: absolute;
	top: 20px;
	left: 50%;
	transform: translateX(-50%);
}

.slide01_top img.pop {}


/*other*/
.contentsBox {
	margin: 0;
	padding: 0;
	background: #fff;
}


.stH4 {
	padding: 1.0em 0 2.0em 0;
}

.normalList {
	margin: 0 0 30px 1.3em;
	padding: 0;
}

.normalList li {
	list-style: disc;
	line-height: 2.8em;
}

.normalList2 {
	margin: 20px 0 30px 1.3em;
	padding: 0;
}

.normalList2 p {
	line-height: 2.8em;
}

.boxNormal {
	padding: 20px 25px;
}

.boxNormal02 {
	padding: 0 25px 20px 25px;
}

.boxNormal03 {
	/* height: 160px; */
	padding: 0px 25px 20px;
}


.centerBox {
	text-align: center;
}

.centerBox img {
	margin: 21px 0;
}

.bgAbout,
.bgActivity {
	background: #fff;
}

.bgCareer {
	height: 400px;
	background: #fff;
}

.bgService {
	background: #fff url(../img/services/bg_sevice.jpg) right bottom no-repeat;
	height: 524px;
}

.bglocations {
	background: #fff url(../img/ocean_seivces/bg_OeanService.jpg) right bottom no-repeat;
}

.bgSingapore {
	background: #fff url(../img/sevices/bg_sevice.jpg) right bottom no-repeat;
}

.bgMalaysia {
	background: #fff url(../img/bg_sevice.jpg) right bottom no-repeat;
}

.bgJapan {
	background: #fff url(../img/bg_sevice.jpg) right bottom no-repeat;
}

.bgContact,
.bgContactEnquiry {
	background: #fff;
}


/*about*/
.aboutTable {
	margin: 20px;
}

.aboutTable th,
.aboutTable td {
	padding-bottom: 8px;
	line-height: 1.4;
	vertical-align: top;
}

.aboutTable th {
	font-weight: bold;
	color: #ff7a00;
}

.aboutList {
	margin: -5px 0 5px 0;
}

.aboutList li {
	float: left;
	/* height: 80px; */
	margin: 0 17px 0 0;
}

.aboutList li a img {
	margin: 4px 0 0 0;
}

.aboutMotto {
	font-weight: bold;
	font-size: 117%;
}

/*services*/
.service-list {
	width: 100%;
	border-collapse: collapse;
	border-bottom: 1px solid #ccc;
}

.service-list th,
.service-list td {
	padding: 4px 12px;
	vertical-align: top;
	/* border: 1px solid black; */
}

.service-list th {
	font-size: 100%;
	font-weight: bold;
	padding: 1em;
	background: #4878ac;
	/* border-right: solid 1px #9babbd; */
	color: #ffffff;
	width: 33%;
}

.service-list tr td {
	border-bottom: 1px solid #fad6b4;
}

.service-list tr:nth-child(2n+1) {}


.not-list {
	padding-bottom: 1em;
}

.service-photo {
	margin-top: 20px;
	display: flex;
	justify-content: space-between;
}

.service-photo img {
	width: auto;
	height: 190px;
}


/*information*/
.information-list {
	margin-bottom: 50px;
	line-height: 1.4;
}

.information-list h4 {
	font-family: "SimSun", serif;
	font-weight: bold;
	font-size: 125%;
	color: #ff7a00;
}

.information-list h5 {
	margin-bottom: .25em;
	font-weight: bold;
	font-size: 109%;
}

.information-list table {
	width: 100%;
	/* border-top: 1px solid #444444;
	border-bottom: 1px solid #444444; */
	border-collapse: collapse;
}

.information-list th,
.information-list td {
	padding: 10px 15px;
	vertical-align: top;
	line-height: 1.4;
	font-weight: normal;
	border: none;
	/* border-bottom: 1px solid #cccccc; */
}

.information-list tr:last-child th,
.information-list tr:last-child td {
	border: none;
}

.information-list th {
	width: 180px;
}

.information-list tr {
	background-color: #fcfdfd;
}

.information-list tr:nth-child(odd) {
	background-color: #ecf1f8;
}

.information-list-tel {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
}

.information-list-tel dt,
.information-list-tel dd {
	line-height: 1.4;
}

.information-list-tel dt {
	margin-right: 5px;
}

/*contact enquiry*/
.contact-form table {
	margin: 0 auto 20px auto;
	width: 740px;
	border-collapse: collapse;
}

.contact-form th,
.contact-form td {
	padding: 8px 12px;
	border: 1px solid #666;
}

.contact-form .form01 th {
	width: 210px;
}

.contact-form .form02 th {
	width: 210px;
}

.contact-form .form03 th {
	width: 210px;
}

.contact-form input,
.contact-form textarea {
	width: calc(100% - 16px);
	height: 1.5em;
	padding: 2px 8px;
	font-family: Arial, Helvetica, "sans-serif";
	font-size: 125%;
	border: 1px solid #ccc;
}

.contact-form input:valid {}

.contact-form input:invalid {}

.contact-form textarea {
	height: 4.5em;
}

.contact-form input[type="radio"] {
	width: 1em;
	margin-right: .5em;
	vertical-align: middle;
}

.contact-form .sub-input div {
	display: block;
	margin-bottom: 10px;
}

.contact-form .sub-input div:last-child {
	margin-bottom: 0;
}

.contact-form .sub-input div span {
	display: inline-block;
	width: 75px;
	line-height: 1.5;
}

.contact-form .sub-input input {
	width: 385px;
}

.contact-form input[type="submit"] {
	display: block;
	margin: 20px auto;
	padding: 10px 20px;
	width: auto;
	height: auto;
	background-color: #dddddd;
	border-radius: 8px;
	cursor: pointer;
}

body#otherPage #contents .contact-form h3 {
	border-bottom: none;
}

.contact-form .error {
	text-align: right;
	color: red;
}

/*contact - old*/
.stH4Contact {
	/*background:#b4b4b4;*/
	background: #014fa1;
	padding: 20px 20px;
	color: #fff;
	font-weight: bold;
	margin: 25px 0;
	font-size: 134%;
}

.stH5Contact {
	padding: 0 0 20px 0;
	margin: 45px 0 0 0;
	font-size: 120%;
	font-weight: bold;
	border-bottom: 2px solid #b4b4b4;
}

.txtBig {
	font-weight: bold;
	font-size: 142%;
}

.txtBig2 {
	font-weight: bold;
	font-size: 120%;
}

/*japan*/
.listGl01 {
	width: 747px;
	margin: 0 auto;
}

.listGl01 li {
	float: left;
	margin: 0 10px 0 0;
	line-height: 2.6em;
}

.slide01 {
	width: 747px;
	margin: 0 auto;
}

.move {
	padding-top: 36px;
	height: 30px !important;
	margin-left: -15px !important;
}

/*activity*/
.boxAward {
	margin-top: 30px;
	padding-top: 5px;
	padding-bottom: 50px;
	line-height: 1.5;
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 600px;
}

.boxAwardTtl {
	font-family: "Times New Roman", serif;
	font-weight: bold;
	font-size: 200%;
	color: #ff7a00;
	display: block;
}

.boxAward img {
	display: block;
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
}

.boxAward p+img {
	margin-top: 30px;
}

.boxAward p {
	margin-top: 10px;
	text-align: right;
	padding-right: 10px;
}

.boxAward .date {
	padding-left: 15px;
}



/*===== フッター ==========================================*/

body#topPage #fwrapper {
	width: 100%;
	margin: 0 auto;
	/* background: url(../img/bg_footer.jpg) center top no-repeat; */
	height: 150px;
	font-size: 92%;
	padding: 78px 0 0 0;
}

body#otherPage #fwrapper {
	width: 100%;
	margin: 0 auto;
	/* background: url(../img/bg_footer2.jpg) center -78px no-repeat; */
	height: 150px;
	font-size: 92%;
	padding: 0;
}


body#topPage #footer {
	margin: 32px auto 0 auto;
	/* width: 860px; */
	color: #ffffff;
	position: relative;
}

body#otherPage #footer {
	margin: 0 auto;
	/* width: 860px; */
	color: #ffffff;
	position: relative;
	padding: 32px 0 0 0;
}


#footer ul {
	display: flex;
	justify-content: center;
	gap: 10px;
	/* width: 1100px; */
	margin: 0 auto;
	padding: 0;
}

#footer ul li {
	margin: 0;
	padding: 0;
}

/* #footer ul li:nth-child(10) {
	margin: 0 150px 0 0;
} */

body#topPage #ftxt01 {
	position: absolute;
	width: 120px;
	text-align: center;
	top: 35px;
	left: 128px;
	color: #FFFFFF;
	line-height: 1.2em;
	font-size: 78%;
}

body#topPage #ftxt02 {
	position: absolute;
	top: 10px;
	left: 642px;
	color: #FFFFFF;
	line-height: 1.0em;
	font-size: 84%;
}

body#topPage #ftxt03 {
	/*アクセスカウンター*/
	display: none;
	position: absolute;
	top: 50px;
	right: 120px;
	color: #FFFFFF;
	line-height: 1.0em;
	font-size: 84%;
}

body#topPage #copylight {
	margin-top: 30px;
	width: 100%;
	text-align: center;
	color: #FFFFFF;
	font-size: 84%;
}




body#otherPage #ftxt01 {
	position: absolute;
	width: 120px;
	text-align: center;
	top: 68px;
	left: 128px;
	color: #FFFFFF;
	line-height: 1.2em;
	font-size: 78%;
}

body#otherPage #ftxt02 {
	position: absolute;
	top: 43px;
	right: 135px;
	color: #FFFFFF;
	line-height: 1.0em;
	font-size: 84%;
	height: 8px;
}

body#otherPage #ftxt03 {
	/*アクセスカウンター*/
	display: none;
	position: absolute;
	top: 85px;
	right: 120px;
	color: #FFFFFF;
	line-height: 1.0em;
	font-size: 84%;
}

body#otherPage #copylight {
	margin-top: 30px;
	width: 100%;
	text-align: center;
	color: #FFFFFF;
	font-size: 84%;
}


.move2 {
	/*アクセスカウンター*/
	display: none;
	padding-top: 45px;
	padding-left: 760px;
}

/*===== テーブル ==========================================*/

/*------- テーブル ver01--------------------*/
table.ver01 {
	margin: 0;
}

table.ver01 tr th,
table.ver01 tr td {
	padding: 0;
	margin: 0;
	line-height: 1.4em;
}

/*------- テーブル ver02--------------------*/
table.ver02 {
	margin: 20px 0 0 0;
	width: 810px;
}

table.ver02 tr th,
table.ver02 tr td {
	padding: 5px;
	line-height: 1.4em;
}

table.ver02 tr th {
	background: #e6e6e6;
	font-weight: bold;
	text-align: left;
}

table.ver02 tr.intTtable td {
	padding: 15px 5px 5px 5px;
}

/*------- テーブル ver02_02--------------------*/
table.ver02_02 {
	margin: 20px 0 0 0;
	width: 810px;
}

table.ver02_02 tr th,
table.ver02_02 tr td {
	padding: 5px;
	line-height: 1.4em;
	text-align: left;
}

table.ver02_02 tr th {
	background: #f5f5f5;
	font-weight: bold;
}

table.ver02_02 tr.intTtable td {
	padding: 15px 5px 5px 5px;
}










/*===== クリア ==========================================*/

.clear {
	clear: both;
	height: 0px;
	font-size: 0px;
	margin: 0px;
	padding: 0px;
	overflow: hidden;
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/*IE7以外のモダンブラウザ向け*/


.clearfix {
	display: inline-block;
}

/*IE7およびMacIE5向け*/



/*===== 共通 ==========================================*/



/*pagetop*/
#pagetop {
	width: 860px;
	margin: 0 auto;
	padding: 17px 0;
	text-align: right;
	font-size: 83.4%;
}

.redTxt {
	color: #e3001c;
	font-weight: bold;
	font-size: 120%;

}

.orangeTxt {
	color: #ff7a00;
	font-family: "Times New Roman", serif;
	font-weight: bold;
	font-size: 110%;
}

.blueTxt {
	color: #004fa0;
	font-family: "Times New Roman", serif;
	font-weight: bold;
	font-size: 110%;
}

.intB1 {
	margin-bottom: 1.0em;
}

.intB2 {
	margin-bottom: 2.0em;
}

.FR {
	float: right;
	margin: 0 0 10px 15px;
}

.FL {
	float: left;
	margin: 0 0 10px 15px;
}

.strong {
	font-weight: bold;
}


.orbor {
	display: block;
	height: 3px;
	background: #fe7f02;
}