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

html {
	font-size: 62.5%;
}

body {
	color: #353535;
	font-size: 1.6rem;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}

*, *::before, *::after {
	box-sizing: border-box;
}

a:link, a:visited, a:hover, a:active {
	color: #353535;
	text-decoration: none;
}
/*ここからPC*/
@media screen and (min-width: 1024px) {
/*	header*/
	.header_fix {
		height: 100px;
		width: 100%;
		padding: 10px 30px;
		margin: auto;
		position: fixed;
		display: flex;
		z-index: 9999;
		background-color: #fff;
	}
	
	.header_logo {
		width: 10%;
		margin: auto;
		left: 0;
	}
	
	.header_logo img {
		height: 100%;
	}
	
	.header_container {
		width: 90%;
		right: 0;
		line-height: 4rem;
		margin: auto;
	}
	
	.header_top {
		width: 100%;
	}
	
	.header_items_flex {
		display: flex;
		justify-content: flex-end;
	}
	
	.header_items {
		margin: auto 20px;
	}
	
	.header_bottom a {
		position: relative;
		display: inline-block;
		text-decoration: none;
	}
	
	.header_bottom a::after {
		position: absolute;
		bottom: -4px;
		left: 0;
		content: '';
		width: 100%;
		height: 2px;
		background: #353535;
		transform: scale(0, 1);
		transform-origin: right top;
		transition: transform .3s;
	}
	
	.header_bottom a:hover::after {
		transform-origin: left top;
		transform: scale(1, 1);
	}
/*	//header*/
/*	top*/
	#top {
		width: 100%;
		height: 300px;
		padding-top: 150px;
	}

	.top_txt {
		width: 100%;
		margin: auto;
	}
	
	#top h1 {
		color: #353535;
	}
	
/*	//top*/
/*	recruit*/
	#recruit {
		width: 100%;
		height: auto;
		padding-bottom: 150px;
		margin-top: 150px;
		background-color: #aed9da;
	}
		
	.svg_wave_01 {
		width: 100%;
		height: auto;
		position: absolute;
		z-index: -1;
		top: 250px;
	}
	
	.svg_wave_01 path,stroke {
		fill: #aed9da;
	}
	
	.recruit_wrapper {
		width: 100%;
		margin: auto;
	}
	
	.recruit_top {
		width: 80%;
		margin: auto;
	}
	
	.recruit_top img {
		width: 100%;
	}
	
	.recruit_flex {
		width: 80%;
		margin: auto;
		display: flex;
		flex-wrap: wrap;
		vertical-align: middle;
	}
	
	.recruit_img {
		width: 50%;
		margin: auto;
	}
	
	.recruit_img img {
		width: 100%;
	}
	
	.recruit_txt {
		width: 50%;
		margin: auto;
		padding: 0 50px;
		line-height: 3rem;
	}
	
	.recruit_contact {
		width: 500px;
		margin: 50px auto;
		padding: 20px 30px;
		line-height: 3rem;
		background-color: #fff;
		border: 2px solid #112D4E;
		border-radius: 10px;
		text-align: center;
		position: relative;
	}
	
	.big_bold {
		font-size: 3rem;
		line-height: 6rem;
		font-weight: bold;
		padding-left: 60px;
	}
	
	.marine_logo {
		height: 5rem;
		position: absolute;
		left: 110px;
		bottom: 25px;
	}
	
	.marine_logo img {
		height: 100%;
	}
	
/*	//recruit*/
/*	#footer*/
	#footer {
		width: 100%;
		height: auto;
		margin-top: 100px;
		position: relative;
		background-color: #112D4E;
	}
	
	.svg_wave_05 {
		width: 100%;
		height: auto;
		position: absolute;
		background-color: #aed9da;
		z-index: -1;
		top: -100px;
	}
	
	.svg_wave_05 path,stroke {
		fill: #112D4E;
	}
/*	//#footer*/
/*	footer*/
/*	call_ataxi*/	
	.call_ataxi_btn {
		width: 700px;
		height: 300px;
		background-color: #fff;
		margin: 0 auto 100px;
		display: flex;
	}
	
	.call_ataxi_btn img {
		height: 300px;
		width: auto;
	}
	
	.call_ataxi_btn_txt {
		width: 40%;
		height: auto;
		margin: auto;
		font-size: 2rem;
		font-weight: bold;
		line-height: 3rem;
		text-align: center;
	}
	
	.call_ataxi_btn_txt p {
		margin-bottom: 10px;
	}
	
	.viewmore_btn_call_ataxi {
		width: 250px;
		height: 60px;
		margin: auto;
		display: block;
		position: relative;
		border-radius: 5px;
	}
	
	.viewmore_btn_call_ataxi a {
		display: inline-block;
		width: 100%;
		height: 100%;
		text-align: center;
		background-color: #E30003;
		border: 2px solid #E30003;
		border-radius: 5px;
		font-size: 1.8rem;
		color: #fff;
		text-decoration: none;
		margin: auto;
		position: relative;
	}
	.viewmore_btn_call_ataxi a:hover {
		background-color: #fff;
		border-radius: 50px;
		transition: all .4s;
	}
	
	.viewmore_btn_call_ataxi a:hover span {
		color: #E30003;
		transition: all .4s;
	}
		
	.viewmore_btn_call_ataxi span {
		width: 100%;
		height: 100%;
		position: relative;
		color: #fff;
		line-height: 55px;
	}
	
	.viewmore_btn_call_ataxi span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 4px;
		left: 135px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	.viewmore_btn_call_ataxi a:hover span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 4px;
		left: 135px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #E30003;
		border-right: 2px solid #E30003;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		transition: all .4s;
	}
	
/*	call_ataxi*/
	footer {
		padding-top: 100px;
		background-color: #112D4E;
	}
	
	.footer {
		width: 80%;
		height: auto;
		margin: auto;
		padding-bottom: 10px;
	}
	
	.footer a,small {
		color: #fff;
	}
	
	.footer_main {
		width: 100%;
		margin: 0 auto 50px;
		display: flex;
		flex-wrap: wrap;
	}
	
	.footer_main_item {
		width: 25%;
		line-height: 2.5rem;
		font-weight: bold;
	}
	
	.footer_submenu a {
		padding-left: 1rem;
		font-weight: normal;
	}
	
	.footer_main a:hover {
		color: #E30003;
		transition: all .3s;
	}
	
	small p {
		font-size: 1.3rem;
		font-weight: normal;
		text-align: center;
	}
	
/*	//footer*/
/*	common items*/
	h1 {
		font-size: 3rem;
		text-align: center;
		color: #135589;
	}
	
	h1 span {
		display:  block;
		font-size:  1.5rem;
		margin-top:  10px;
		position:  relative;
		width: 140px;
		margin: 10px auto 0;
	}

	h2 {
		font-size: 2.5rem;
		text-align: center;
	}
	
	h2 span{
		 position: relative;
		 display: inline-block;
		 padding-bottom:0.5em;
		 border-bottom: 1px solid #353535;
	}

	h2 span::before,
	h2 span::after {
		 position: absolute;
		 top: 100%;
		 left:50%;
		 transform:translateX(-50%);
		 content: '';
		 border: 10px solid transparent;
	}

	h2 span::before {
		 border-top: 10px solid #353535;
	}

	h2 span::after {
		 margin-top: -1px;
		 border-top: 10px solid white;
	}
	
	h3 {
		font-size: 1.8rem;
		font-weight: bold;
		text-indent: 5rem;
	}

	.h3_QR span::before {
		width: 8rem;
		height: 8rem;
		position: absolute;
		top: 140px;
		left: 22%;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #fff;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	.h3_credit span::before {
		width: 8rem;
		height: 8rem;
		position: absolute;
		top: 300px;
		left: 22%;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #fff;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	.underbar {
		padding: 0 1rem;
		background: linear-gradient(transparent 60%, #A9F7FF 0%);
		font-weight: bold;
	}
	
	.sp {
		display: none;
	}
/*  fadeIn*/
	.fadeIn_softly {
	transition: .8s;
	opacity: 0;
	}

	.fadeIn_softly.animated {
	opacity: 1;
	}
		
	.fadeIn_h1 {
		opacity : 0;
		transform : translate(0, 50px);
		transition : all .5s;
	}
	
	.fadeIn_h1.active {
		opacity : 1;
		transform : translate(0, 0);
	}
	
	.fadeIn01 {
		opacity : 0;
		transform : translate(0, 100px);
		transition : all .5s;
	}
	
	.fadeIn01.active {
		opacity : 1;
		transform : translate(0, 0);
	}
	
	.fadeIn02 {
		opacity : 0;
		transform : translate(0, 100px);
		transition : all .8s;
	}
	
	.fadeIn02.active {
		opacity : 1;
		transform : translate(0, 0);
	}
	
	.fadeIn03 {
		opacity : 0;
		transform : translate(0, 100px);
		transition : all 1.1s;
	}
	
	.fadeIn03.active {
		opacity : 1;
		transform : translate(0, 0);
	}
	
	.fadeIn04 {
		opacity : 0;
		transform : translate(0, 100px);
		transition : all .5s;
	}
	
	.fadeIn04.active {
		opacity : 1;
		transform : translate(0, 0);
	}

	/*  //fadeIn*/
/*	wrapper*/
	.wrapper {
		width: 80%;
		height: auto;
		margin: auto;
	}
/*	//wrapper*/
/*	call_btn*/
	.call_btn {
		width: 150px;
		height: 4rem;
	}
	
	.call_btn a {
		display: inline-block;
		width: 100%;
		height: 100%;
		text-align: center;
		background:linear-gradient(0deg,#E30003 0%,#FF0003 100%);
		border-radius: 5px;	
		color: #fff;
		text-decoration: none;
		padding: 0 15px;
		margin: auto;
		position: relative;
	}
	
	.call_btn:hover {
		opacity: 0.8;
		transition: .4s;
	}
		
/*	//call_btn*/
/*	language_btn*/
	.language_btn span {
		margin-right: 1.5rem;
	}
	
	.language_btn span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 2.5rem;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #353535;
		border-right: 2px solid #353535;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	.language_btn span:hover {
		color: #E30003;
		transition: .4s;
	}
	
	.language_btn:hover span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 2.5rem;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #E30003;
		border-right: 2px solid #E30003;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		transition: .4s;
	}
/*	//language_btn*/
/*　mail_btn*/
	.mail_btn {
		width: 150px;
		height: 4rem;
	}
	
	.mail_btn a {
		display: inline-block;
		width: 100%;
		height: 100%;
		text-align: center;
		background: #353535;
		border-radius: 5px;	
		color: #fff;
		text-decoration: none;
		padding: 0 15px;
		margin: auto;
		position: relative;
	}
	
	.mail_btn:hover {
		opacity: 0.8;
		transition: .4s;
	}
		
/*　//mail_btn*/
/*	viewmore_btn*/
	.viewmore_btn {
		width: 300px;
		height: 60px;
		margin: 20px auto 0;
		display: block;
		position: relative;
		border-radius: 5px;
	}
	
	.viewmore_btn a {
		display: inline-block;
		width: 100%;
		height: 100%;
		text-align: center;
		background-color: #E30003;
		border: 2px solid #E30003;
		border-radius: 5px;
		font-size: 1.8rem;
		color: #fff;
		text-decoration: none;
		margin: auto;
		position: relative;
	}
	.viewmore_btn a:hover {
		background-color: #fff;
		border-radius: 50px;
		transition: all .4s;
	}
	
	.viewmore_btn a:hover span {
		color: #E30003;
		transition: all .4s;
	}
		
	.viewmore_btn span {
		width: 100%;
		height: 100%;
		position: relative;
		color: #fff;
		line-height: 55px;
	}
	
	.viewmore_btn span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 4px;
		left: 240px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	.viewmore_btn a:hover span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 4px;
		left: 240px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #E30003;
		border-right: 2px solid #E30003;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		transition: all .4s;
	}
/*	//viewmore_btn*/
/*	//common items*/
}

/*ここからタブレット*/
@media screen and (min-width: 480px) and (max-width: 1024px) { 
/*	header*/
	.header_fix {
		height: 100px;
		width: 100%;
		margin: auto;
		position: fixed;
		display: flex;
		z-index: 9999;
		background-color: #fff;
	}
	
	.header_logo {
		width: 170px;
		max-height: 80px;
		margin: auto;
		left: 0;
	}
	
	.header_logo img {
		height: auto;
	}
/*	hum_btn*/
	.menu_trigger,
	.menu_trigger span {
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
		z-index: 1000;
		right: 0;
	}
	
	.menu_trigger {
		position: fixed;
		width: 40px;
		height: 42px;
		right: 60px;
		margin: 30px auto;
	}
	.menu_trigger span {
		position: absolute;
		width: 40px;
		height: 2px;
		background-color: #BFBFBF;
		border-radius: 2px;
	}
	.menu_trigger span:nth-of-type(1) {
		top: 10px;
	}
	.menu_trigger span:nth-of-type(2) {
		top: 20px;
	}
	.menu_trigger span:nth-of-type(3) {
		bottom: 10px;
	}

	.menu_trigger.active span:nth-of-type(1) {
		-webkit-transform: translateY(10px) rotate(-45deg);
		transform: translateY(10px) rotate(-45deg);
	}
	.menu_trigger.active span:nth-of-type(2) {
		opacity: 0;
	}
	.menu_trigger.active span:nth-of-type(3) {
		-webkit-transform: translateY(-10px) rotate(45deg);
		transform: translateY(-10px) rotate(45deg);
	}

	#gloval_nav {
		position: fixed;
		width: 100%;
		height: 100vh;
		padding-top: 150px;
		right: -100%;
		background-color: #fff;
		transition: all .6s;
		z-index: -1;
		overflow-y: auto;
	}

	.active#gloval_nav {
		right: 0;
	}

	#gloval_nav li {
		height: 6rem;
		margin: auto;
		font-size: 2rem;
		padding-left: 33%;
	}

	#gloval_nav li a {
		line-height: 6rem;
		display: inline-block;
		font-weight: bold;
	}
	
	#gloval_nav li a:hover {
		color: #E30003;
		transition: all .4s;
	}
/*	//hum_btn*/
/*	//header*/
/*	top*/
	#top {
		width: 100%;
		height: 300px;
		padding-top: 150px;
	}

	.top_txt {
		width: 100%;
		margin: auto;
	}
	
	#top h1 {
		color: #353535;
	}
	
/*	//top*/
/*	recruit*/
	#recruit {
		width: 100%;
		height: auto;
		padding-bottom: 100px;
		margin-top: 50px;
		background-color: #aed9da;
	}
		
	.svg_wave_01 {
		width: 100%;
		height: auto;
		position: absolute;
		z-index: -1;
		top: 250px;
	}
	
	.svg_wave_01 path,stroke {
		fill: #aed9da;
	}
	
	.recruit_wrapper {
		width: 100%;
		margin: auto;
	}
	
	.recruit_top {
		width: 80%;
		margin: auto;
	}
	
	.recruit_top img {
		width: 100%;
	}
	
	.recruit_flex {
		width: 80%;
		margin: auto;
		display: flex;
		flex-wrap: wrap;
		vertical-align: middle;
	}
	
	.recruit_img {
		width: 100%;
		margin: auto;
	}
	
	.recruit_img img {
		width: 100%;
	}
	
	.recruit_txt {
		width: 100%;
		margin: auto;
		padding: 0 50px;
		line-height: 3rem;
	}
	
	.recruit_contact {
		width: 400px;
		margin: 50px auto;
		padding: 20px 30px;
		line-height: 3rem;
		background-color: #fff;
		border: 2px solid #112D4E;
		border-radius: 10px;
		text-align: center;
		position: relative;
	}
	
	.big_bold {
		font-size: 3rem;
		line-height: 6rem;
		font-weight: bold;
		padding-left: 60px;
	}
	
	.marine_logo {
		height: 5rem;
		position: absolute;
		left: 60px;
		bottom: 25px;
	}
	
	.marine_logo img {
		height: 100%;
	}
	
/*	//recruit*/
/*	#footer*/
	#footer {
		width: 100%;
		height: auto;
		margin-top: 100px;
		position: relative;
		background-color: #112D4E;
	}
	
	.svg_wave_05 {
		width: 100%;
		height: auto;
		position: absolute;
		background-color: #aed9da;
		z-index: -1;
		top: -100px;
	}
	
	.svg_wave_05 path,stroke {
		fill: #112D4E;
	}
/*	//#footer*/
/*	footer*/
/*	call_ataxi*/	
	.call_ataxi_btn {
		width: 100%;
		height: 300px;
		background-color: #fff;
		margin: 0 auto 100px;
		display: flex;
	}
	
	.call_ataxi_btn img {
		height: 300px;
		width: auto;
	}
	
	.call_ataxi_btn_txt {
		width: 100%;
		height: auto;
		margin: auto;
		font-size: 2rem;
		font-weight: bold;
		line-height: 3rem;
		text-align: center;
	}
	
	.call_ataxi_btn_txt p {
		margin-bottom: 10px;
	}
	
	.viewmore_btn_call_ataxi {
		width: 250px;
		height: 60px;
		margin: auto;
		display: block;
		position: relative;
		border-radius: 5px;
	}
	
	.viewmore_btn_call_ataxi a {
		display: inline-block;
		width: 100%;
		height: 100%;
		text-align: center;
		background-color: #E30003;
		border: 2px solid #E30003;
		border-radius: 5px;
		font-size: 1.8rem;
		color: #fff;
		text-decoration: none;
		margin: auto;
		position: relative;
	}
	.viewmore_btn_call_ataxi a:hover {
		background-color: #fff;
		border-radius: 50px;
		transition: all .4s;
	}
	
	.viewmore_btn_call_ataxi a:hover span {
		color: #E30003;
		transition: all .4s;
	}
		
	.viewmore_btn_call_ataxi span {
		width: 100%;
		height: 100%;
		position: relative;
		color: #fff;
		line-height: 55px;
	}
	
	.viewmore_btn_call_ataxi span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 4px;
		left: 135px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	.viewmore_btn_call_ataxi a:hover span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 4px;
		left: 135px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #E30003;
		border-right: 2px solid #E30003;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		transition: all .4s;
	}
	
/*	call_ataxi*/
	footer {
		padding-top: 100px;
		background-color: #112D4E;
	}
	
	.footer {
		width: 90%;
		height: auto;
		margin: auto;
		padding-bottom: 10px;
	}
	
	.footer a,small {
		color: #fff;
	}
	
	.footer_main {
		width: 100%;
		margin: 0 auto 50px;
		display: flex;
		flex-wrap: wrap;
	}
	
	.footer_main_item {
		width: 25%;
		line-height: 2.5rem;
		font-weight: bold;
	}
	
	.footer_submenu a {
		padding-left: 1rem;
		font-weight: normal;
	}
	
	.footer_main a:hover {
		color: #E30003;
		transition: all .3s;
	}
	
	small p {
		font-size: 1.3rem;
		font-weight: normal;
		text-align: center;
	}
	
/*	//footer*/
/*	common items*/
	h1 {
		font-size: 3rem;
		text-align: center;
		color: #135589;
	}
	
	h1 span {
		display:  block;
		font-size:  1.5rem;
		margin-top:  10px;
		position:  relative;
		width: 140px;
		margin: 10px auto 0;
	}

	h2 {
		font-size: 2.5rem;
		text-align: center;
	}
	
	h2 span{
		 position: relative;
		 display: inline-block;
		 padding-bottom:0.5em;
		 border-bottom: 1px solid #353535;
	}

	h2 span::before,
	h2 span::after {
		 position: absolute;
		 top: 100%;
		 left:50%;
		 transform:translateX(-50%);
		 content: '';
		 border: 10px solid transparent;
	}

	h2 span::before {
		 border-top: 10px solid #353535;
	}

	h2 span::after {
		 margin-top: -1px;
		 border-top: 10px solid white;
	}
	
	h3 {
		font-size: 1.8rem;
		font-weight: bold;
		text-indent: 5rem;
	}

	.h3_QR span::before {
		width: 8rem;
		height: 8rem;
		position: absolute;
		top: 100px;
		left: 22%;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #fff;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	.h3_credit span::before {
		width: 7rem;
		height: 7rem;
		position: absolute;
		top: 210px;
		left: 23%;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #fff;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	.underbar {
		padding: 0 1rem;
		background: linear-gradient(transparent 60%, #A9F7FF 0%);
		font-weight: bold;
	}
	
	.pc {
		display: none;
	}
/*	wrapper*/
	.wrapper {
		width: 80%;
		height: auto;
		margin: auto;
	}
/*	//wrapper*/
/*	gloval_nav_btn*/
	.gloval_nav_btn {
		width: 35%;
		margin: 50px auto 0;
		position: relative;
	}
	
	#gloval_nav .gloval_nav_btn li {
		padding: 0;
		margin-bottom: 10px;
	}
/*	//gloval_nav_btn*/
/*	call_btn*/
	.call_btn {
		width: 100%;
		height: 4rem;
		left: 20%;
	}
	
	.call_btn a {
		display: inline-block;
		width: 100%;
		height: 100%;
		text-align: center;
		background:linear-gradient(0deg,#E30003 0%,#FF0003 100%);
		border-radius: 5px;	
		color: #fff;
		text-decoration: none;
		padding: 0 15px;
		margin: auto;
		position: relative;
	}
	
	.call_btn:hover {
		opacity: 0.8;
		transition: .4s;
	}
		
/*	//call_btn*/
/*	language_btn*/
	.language_btn {
		margin: auto;
	}
	
	.language_btn span {
		margin-right: 1.5rem;
	}
	
	.language_btn span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 165px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #353535;
		border-right: 2px solid #353535;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	.language_btn span:hover {
		color: #E30003;
		transition: .4s;
	}
	
	.language_btn:hover span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 165px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #E30003;
		border-right: 2px solid #E30003;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		transition: .4s;
	}
/*	//language_btn*/
/*　mail_btn*/
	.mail_btn {
		width: 100%;
		height: 300px;
	}
	
	.mail_btn a {
		display: inline-block;
		width: 100%;
		height: 100%;
		text-align: center;
		background: #353535;
		border-radius: 5px;	
		color: #fff;
		text-decoration: none;
		padding: 0 15px;
		margin: auto;
		position: relative;
	}
	
	.mail_btn:hover {
		opacity: 0.8;
		transition: .4s;
	}
		
/*　//mail_btn*/
/*	viewmore_btn*/
	.viewmore_btn {
		width: 300px;
		height: 60px;
		margin: 20px auto 0;
		display: block;
		position: relative;
		border-radius: 5px;
	}

	.viewmore_btn a {
		display: inline-block;
		width: 100%;
		height: 100%;
		text-align: center;
		background-color: #E30003;
		border: 2px solid #E30003;
		border-radius: 5px;
		font-size: 1.8rem;
		color: #fff;
		text-decoration: none;
		margin: auto;
		position: relative;
	}
	.viewmore_btn a:hover {
		background-color: #fff;
		border-radius: 50px;
		transition: all .4s;
	}
	
	.viewmore_btn a:hover span {
		color: #E30003;
		transition: all .4s;
	}
		
	.viewmore_btn span {
		width: 100%;
		height: 100%;
		position: relative;
		color: #fff;
		line-height: 55px;
	}
	
	.viewmore_btn span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 4px;
		left: 240px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	.viewmore_btn a:hover span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 4px;
		left: 240px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #E30003;
		border-right: 2px solid #E30003;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		transition: all .4s;
	}
/*	//viewmore_btn*/
/*	//common items*/
}

/*ここからスマホ*/
@media screen and (max-width: 480px) { 
/*	header*/
	.header_fix {
		height: 100px;
		width: 100%;
		margin: auto;
		position: fixed;
		display: flex;
		z-index: 9999;
		background-color: #fff;
	}
	
	.header_logo {
		width: 120px;
		max-height: 80px;
		margin: auto;
		left: 0;
	}
	
	.header_logo img {
		height: auto;
	}
/*	hum_btn*/
	.menu_trigger,
	.menu_trigger span {
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
		z-index: 1000;
		right: 0;
	}
	
	.menu_trigger {
		position: fixed;
		width: 40px;
		height: 42px;
		right: 30px;
		margin: 30px auto;
	}
	.menu_trigger span {
		position: absolute;
		width: 40px;
		height: 2px;
		background-color: #BFBFBF;
		border-radius: 2px;
	}
	.menu_trigger span:nth-of-type(1) {
		top: 10px;
	}
	.menu_trigger span:nth-of-type(2) {
		top: 20px;
	}
	.menu_trigger span:nth-of-type(3) {
		bottom: 10px;
	}

	.menu_trigger.active span:nth-of-type(1) {
		-webkit-transform: translateY(10px) rotate(-45deg);
		transform: translateY(10px) rotate(-45deg);
	}
	.menu_trigger.active span:nth-of-type(2) {
		opacity: 0;
	}
	.menu_trigger.active span:nth-of-type(3) {
		-webkit-transform: translateY(-10px) rotate(45deg);
		transform: translateY(-10px) rotate(45deg);
	}

	#gloval_nav {
		position: fixed;
		width: 100%;
		height: 100vh;
		padding-top: 100px;
		right: -100%;
		background-color: #fff;
		transition: all .6s;
		z-index: -1;
		overflow-y: auto;
	}

	.active#gloval_nav {
		right: 0;
	}

	#gloval_nav li {
		height: 5rem;
		max-width: 90%;
		margin: auto;
		font-size: 1.8rem;
		padding-left: 5%;
	}

	#gloval_nav li a {
		line-height: 5rem;
		display: inline-block;
		font-weight: bold;
	}
	
	#gloval_nav li a:hover {
		color: #E30003;
		transition: all .4s;
	}
/*	//hum_btn*/
/*	//header*/
/*	top*/
	#top {
		width: 100%;
		height: 300px;
		padding-top: 150px;
	}

	.top_txt {
		width: 100%;
		margin: auto;
	}
	
	#top h1 {
		color: #353535;
	}
	
/*	//top*/
/*	recruit*/
	#recruit {
		width: 100%;
		height: auto;
		padding-bottom: 50px;
		background-color: #aed9da;
	}
		
	.svg_wave_01 {
		width: 100%;
		height: auto;
		position: absolute;
		z-index: -1;
		top: 260px;
	}
	
	.svg_wave_01 path,stroke {
		fill: #aed9da;
	}
	
	.recruit_wrapper {
		width: 100%;
		margin: auto;
	}
	
	.recruit_top {
		width: 80%;
		margin: auto;
	}
	
	.recruit_top img {
		width: 100%;
	}
	
	.recruit_flex {
		width: 80%;
		margin: auto;
		display: flex;
		flex-wrap: wrap;
		vertical-align: middle;
	}
	
	.recruit_img {
		width: 100%;
		margin: auto;
	}
	
	.recruit_img img {
		width: 100%;
	}
	
	.recruit_txt {
		width: 100%;
		margin: auto;
		line-height: 3rem;
	}
	
	.recruit_contact {
		width: 250px;
		margin: 50px auto;
		padding: 20px;
		line-height: 2rem;
		background-color: #fff;
		border: 2px solid #112D4E;
		border-radius: 10px;
		text-align: center;
		position: relative;
	}
	
	.big_bold {
		font-size: 2rem;
		line-height: 4rem;
		font-weight: bold;
		padding-left: 60px;
	}
	
	.marine_logo {
		height: 4rem;
		position: absolute;
		left: 30px;
		bottom: 15px;
	}
	
	.marine_logo img {
		height: 100%;
	}
	
/*	//recruit*/
/*	#footer*/
	#footer {
		width: 100%;
		height: auto;
		margin-top: 70px;
		position: relative;
		background-color: #112D4E;
	}
	
	.svg_wave_05 {
		width: 100%;
		height: auto;
		position: absolute;
		background-color: #aed9da;
		z-index: -1;
		top: -70px;
	}
	
	.svg_wave_05 path,stroke {
		fill: #112D4E;
	}
/*	//#footer*/
/*	call_ataxi*/	
	.call_ataxi_btn {
		width: 100%;
		height: 300px;
		background-color: #fff;
		margin: 0 auto 100px;
		display: flex;
	}
	
	.call_ataxi_btn img {
		height: 300px;
		width: auto;
	}
	
	.call_ataxi_btn_txt {
		width: 90%;
		height: auto;
		margin: auto;
		font-size: 2rem;
		font-weight: bold;
		line-height: 3rem;
		text-align: center;
	}
	
	.call_ataxi_btn_txt p {
		margin-bottom: 10px;
	}
	
	.viewmore_btn_call_ataxi {
		width: 250px;
		height: 60px;
		margin: auto;
		display: block;
		position: relative;
		border-radius: 5px;
	}
	
	.viewmore_btn_call_ataxi a {
		display: inline-block;
		width: 100%;
		height: 100%;
		text-align: center;
		background-color: #E30003;
		border: 2px solid #E30003;
		border-radius: 5px;
		font-size: 1.6rem;
		color: #fff;
		text-decoration: none;
		margin: auto;
		position: relative;
	}
	.viewmore_btn_call_ataxi a:hover {
		background-color: #fff;
		border-radius: 50px;
		transition: all .4s;
	}
	
	.viewmore_btn_call_ataxi a:hover span {
		color: #E30003;
		transition: all .4s;
	}
		
	.viewmore_btn_call_ataxi span {
		width: 100%;
		height: 100%;
		position: relative;
		color: #fff;
		line-height: 55px;
	}
	
	.viewmore_btn_call_ataxi span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 3px;
		left: 135px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	.viewmore_btn_call_ataxi a:hover span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 3px;
		left: 135px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #E30003;
		border-right: 2px solid #E30003;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		transition: all .4s;
	}
	
/*	call_ataxi*/
	footer {
		padding-top: 100px;
		background-color: #112D4E;
	}
	
	.footer {
		width: 90%;
		height: auto;
		margin: auto;
		padding-bottom: 10px;
	}
	
	.footer a,small {
		color: #fff;
	}
	
	.footer_main {
		width: 100%;
		margin: 0 auto 50px;
		display: flex;
		flex-wrap: wrap;
	}
	
	.footer_main_item {
		width: 25%;
		line-height: 2.5rem;
		font-weight: bold;
	}
	
	.footer_submenu a {
		padding-left: 1rem;
		font-weight: normal;
	}
	
	.footer_main a:hover {
		color: #E30003;
		transition: all .3s;
	}
	
	small p {
		font-size: 1.3rem;
		font-weight: normal;
		text-align: center;
	}
	
/*	//footer*/
/*	common items*/
	h1 {
		font-size: 3rem;
		text-align: center;
		color: #135589;
	}
	
	h1 span {
		display:  block;
		font-size:  1.5rem;
		margin-top:  10px;
		position:  relative;
		width: 140px;
		margin: 10px auto 0;
	}

	h2 {
		font-size: 2rem;
		text-align: center;
	}
	
	h2 span{
		 position: relative;
		 display: inline-block;
		 padding-bottom:0.5em;
		 border-bottom: 1px solid #353535;
	}

	h2 span::before,
	h2 span::after {
		 position: absolute;
		 top: 100%;
		 left:50%;
		 transform:translateX(-50%);
		 content: '';
		 border: 10px solid transparent;
	}

	h2 span::before {
		 border-top: 10px solid #353535;
	}

	h2 span::after {
		 margin-top: -1px;
		 border-top: 10px solid white;
	}
	
	h3 {
		font-size: 1.6rem;
		font-weight: bold;
		text-indent: 2.5rem;
	}

	.h3_QR span::before {
		width: 6rem;
		height: 6rem;
		position: absolute;
		top: 90px;
		left: 0;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #fff;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	.h3_credit span::before {
		width: 6rem;
		height: 6rem;
		position: absolute;
		top: 165px;
		left: 0;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #fff;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	.underbar {
		padding: 0 1rem;
		background: linear-gradient(transparent 60%, #A9F7FF 0%);
		font-weight: bold;
	}
	
	.pc {
		display: none;
	}
/*	wrapper*/
	.wrapper {
		width: 80%;
		height: auto;
		margin: auto;
	}
/*	//wrapper*/
/*	gloval_nav_btn*/
	.gloval_nav_btn {
		width: 65%;
		margin: 30px auto 0;
		position: relative;
	}
	
	#gloval_nav .gloval_nav_btn li {
		padding: 0;
		margin-bottom: 10px;
	}
/*	//gloval_nav_btn*/
/*	call_btn*/
	.call_btn {
		width: 100%;
		height: 4rem;
		left: 20%;
	}
	
	.call_btn a {
		display: inline-block;
		width: 100%;
		height: 100%;
		text-align: center;
		background:linear-gradient(0deg,#E30003 0%,#FF0003 100%);
		border-radius: 5px;	
		color: #fff;
		text-decoration: none;
		padding: 0 15px;
		margin: auto;
		position: relative;
	}
	
	.call_btn:hover {
		opacity: 0.8;
		transition: .4s;
	}
		
/*	//call_btn*/
/*	language_btn*/
	.language_btn {
		margin: auto;
	}
	
	.language_btn span {
		margin-right: 1.5rem;
	}
	
	.language_btn span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 140px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #353535;
		border-right: 2px solid #353535;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	.language_btn span:hover {
		color: #E30003;
		transition: .4s;
	}
	
	.language_btn:hover span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 140px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #E30003;
		border-right: 2px solid #E30003;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		transition: .4s;
	}
/*	//language_btn*/
/*　mail_btn*/
	.mail_btn {
		width: 100%;
		height: 300px;
	}
	
	.mail_btn a {
		display: inline-block;
		width: 100%;
		height: 100%;
		text-align: center;
		background: #353535;
		border-radius: 5px;	
		color: #fff;
		text-decoration: none;
		padding: 0 15px;
		margin: auto;
		position: relative;
	}
	
	.mail_btn:hover {
		opacity: 0.8;
		transition: .4s;
	}
		
/*　//mail_btn*/
/*	viewmore_btn*/
	.viewmore_btn {
		width: 220px;
		height: 60px;
		margin: 10px auto 0;
		display: block;
		position: relative;
		border-radius: 5px;
	}
	
	.viewmore_btn a {
		display: inline-block;
		width: 100%;
		height: 100%;
		text-align: center;
		background-color: #E30003;
		border: 2px solid #E30003;
		border-radius: 5px;
		font-size: 1.6rem;
		color: #fff;
		text-decoration: none;
		margin: auto;
		position: relative;
	}
	.viewmore_btn a:hover {
		background-color: #fff;
		border-radius: 50px;
		transition: all .4s;
	}
	
	.viewmore_btn a:hover span {
		color: #E30003;
		transition: all .4s;
	}
		
	.viewmore_btn span {
		width: 100%;
		height: 100%;
		position: relative;
		color: #fff;
		line-height: 55px;
	}
	
	.viewmore_btn span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 4px;
		left: 220px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	.viewmore_btn a:hover span::after {
		width: 1rem;
		height: 1rem;
		position: absolute;
		top: 4px;
		left: 240px;
		content: "";
		vertical-align: middle;
		border-top: 2px solid #E30003;
		border-right: 2px solid #E30003;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		transition: all .4s;
	}
/*	//viewmore_btn*/
/*	//common items*/
}