@charset "utf-8";

/*
Theme Name: l-and theme 2026
Author: CyberTech Okinawa
Author URI: http://okinawa.itoutsourcing.jp/
Theme URI:
Description: this theme is based minimu theme
Version: 1.0
..................... */

/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
	reset style
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
html, body, div, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, input, ins, kbd, q, s, samp,
small, select, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, figure {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: normal;
	font-style: normal;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
	base style
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/*	font
------------------------ */
* { font-family: "Noto Sans JP", "メイリオ", Meiryo, "MS Pゴシック", sans-serif; }

* {
	color: #333;
	font-size: 15px;
	line-height: 1.5;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

html, body {
	overflow-x: hidden;
}

body {
	background: #f1f1f1;
	position: relative;
}

/*	tags
------------------------ */
a, a:link, a:visited {
	color: #191a86;
	text-decoration: none;
}
a, a:hover {
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.5s;
}
a img:hover {
	filter: alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
}

a:focus { outline: none; }

img { max-width: 100%; vertical-align: middle; }
strong { font-weight: bold; }
ul, ol, li { list-style: none; }

/*	table
------------------------ */
table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}

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

/*	h tag base
------------------------ */
h2 {
	font-size: 23px;
	font-weight: 500;
}

/* --------------------------------------------
	header
-------------------------------------------- */
.header {
	width: 100%;
	padding: 0 20px;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
}

.hd-inner {
	max-width: 1000px;
	margin: 0 auto;
}

.hd-main {
	padding: 20px 0;
	position: relative;
}

.logo {
	width: 23%;
	float: left;
}

.top-title {
	width: 45vw;
	margin-left: -10px;
}

/*	g-navi
------------------------ */
.g-navi {
	position: absolute;
	right: 0;
	bottom: 20px;
}
	.g-navi li {
		float: left;
	}
		.g-navi li a {
			font-size: 14px;
			display: block;
			padding: 0 20px;
		}
		.g-navi li a img {
			width: 60px;
		}
		.g-navi li.active a {
			color: #fff;
			background: #191a86;
			padding: 1px 15px;
			font-size: 13px;
		}

	.g-navi li:first-child a img {
		width: 45px;
	}
	.g-navi li:nth-child(2) a img {
		width: 73px;
	}
	.g-navi li:last-child a img {
		width: 85px;
	}

.menu-btn {
	display: none;
	width: 45px;
	border-radius: 1px;
	padding: 2px;
	position: absolute;
	top: 20px;
	right: 10px;
}

.bars {
	width: 100%;
	border: 2px solid #191a86;
	display: block;
	margin: 7px auto;
}

.close-btn {
	width: 45px;
	border-radius: 1px;
	padding: 2px;
	position: absolute;
	top: 20px;
	right: 30px;
	display: block;
	height: 45px;

}

.close-btn .bars {
	position: absolute;
	top: 12px;
	right: 0;
}

.close-btn .bars:first-child {
	-webkit-transform: rotate(-33deg);
	-moz-transform: rotate(-33deg);
	-ms-transform: rotate(-33deg);
	-o-transform: rotate(-33deg);
	transform: rotate(-33deg);

	-webkit-transform-origin: center;
	-moz-transform-origin: center;
	-ms-transform-origin: center;
	-o-transform-origin: center;
	transform-origin: center;
}
.close-btn .bars:last-child {
	-webkit-transform: rotate(33deg);
	-moz-transform: rotate(33deg);
	-ms-transform: rotate(33deg);
	-o-transform: rotate(33deg);
	transform: rotate(33deg);

	-webkit-transform-origin: center;
	-moz-transform-origin: center;
	-ms-transform-origin: center;
	-o-transform-origin: center;
	transform-origin: center;
}
.sp-menu {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: none;
	padding: 20px;
	background: rgba(241,241,241,.8);
	z-index: 10;
}

.sp-menu ul {
	display: inline-block;
}

.sp-menu li a {
	font-size: 25px;
	display: block;
	padding: 10px 10px;
}

.sp-menu li img {
	width: 100px;
}

/* --------------------------------------------
	main
-------------------------------------------- */
.main {
	position: relative;
}

/*	main-visual
------------------------ */
.main-visual img {
	min-width: 1000px;
	width: 100%;
	max-width: initial;
}

.h-group {
	width: 100%;
	padding: 0 20px;
	position: absolute;
	top: 20vw;
	left: 0;
}

.catch-title {
	width: 25%;
	margin-left: -15px;
}

.privacy .catch-title { width: 45%; }
.about .catch-title { width: 29%; }
.news .catch-title { width: 20%; }

.catch-sub {
	width: 10%;
	margin-top: 10px;
	margin-left: 5px;
}

.error-title {
	color: #fff;
	font-size: 30px;
	font-weight: 600;
	text-shadow: 0 2px 15px #73B0C8, 0 5px 10px #73B0C8, 0 -5px 15px #73b0cb;
	transform: scale( 1 , 2 );
	line-height: 1.2;
	letter-spacing: 1px;
}
.error-sub {
	font-size: 17px;
	font-weight: 600;
	margin-top: 40px;
}

.top .catch-sub { width: 55%; }
.about .catch-sub { width: 15%; }
.privacy .catch-sub { width: 20%; }

/* --------------------------------------------
	footer
-------------------------------------------- */
.footer {
	padding-top: 100px;
}

.ft-main {
	background: url(images/common/ft_bg.png) repeat-x bottom center;
	background-size: auto;
	padding: 30px 0 100px;
}

.ft-inner {
	max-width: 860px;
	margin: 0 auto;
}

/*	ft-navi
------------------------ */
.ft-navi {
	padding-bottom: 30px;
}
	.ft-navi li {
		float: left;
	}
		.ft-navi li a {
			font-weight: 600;
			display: block;
			padding: 10px 35px;
		}

	.ft-navi .child-menu li {
		float: none;
	}
		.ft-navi .child-menu li a {
			font-size: 13px;
			font-weight: 500;
			padding: 5px 35;
		}

.ft-bottom {
	background: #1d2089;
	padding: 20px 0;
}
	.ft-bottom p {
		color: #fff;
		padding: 10px 0;
		text-align: center;
	}

.privacy a {
	color: #fff;
}

/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
	pages section style
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

/* --------------------------------------------
	section overall
-------------------------------------------- */
/*	title-group
------------------------ */
.title-group {
	position: relative;
	text-align: center;
}

.chapter-title {
	font-size: 35px;
	text-align: center;
}

	.chapter-title img {
		width: 250px;
	}

.sub-title {
	font-size: 18px;
	font-weight: 600;
	margin-top: 10px;
	text-align: center;
}

.news .chapter-title {
	color: #fff;
}

.top .chapter-title img {
	width: 130px;
}

#about section:nth-child(2) .chapter-title img {
	width: 200px;
}
#about section:nth-child(3) .chapter-title img {
	width: 170px;
}
#privacy .chapter-title img {
	width: 300px;
}

/*	section style
------------------------ */
section {
	position: relative;
	padding: 50px 0;
}

/*	slope
------------------------ */
.slope {
	position: relative;
	padding: 80px 0;
}

	.slope:before {
		content: "";
		position: absolute;
		top: 0;
		right: -50%;
		bottom: 0;
		left: -50%;

		-webkit-transform: rotate(-10deg);
		-moz-transform: rotate(-10deg);
		-ms-transform: rotate(-10deg);
		-o-transform: rotate(-10deg);
		transform: rotate(-10deg);
	}

.top .slope:before {
	z-index: 0;
}

.slope.wh {
	position: relative;
	background: #5ba5c0;

	background: #f1f1f1; /* Old browsers */
	background: -moz-linear-gradient(top, transparent 50%, #5ba5c0 50%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, transparent 50%,#5ba5c0 50%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, transparent 50%,#5ba5c0 50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1f1f1', endColorstr='#5ba5c0',GradientType=0 ); /* IE6-9 */
}

	.slope.bl:before {
		background: #5ba5c0;
	}
	.slope.wh:before {
		background: #f1f1f1;
	}

.slope.wh + .footer {
	background: #5ba5c0;
}
.slope.wh + .footer .ft-navi li a {
	color: #fff;
}

/*	inner style
------------------------ */
.inner {
	max-width: 800px;
	margin: 0 auto;
	position: relative;
}
.inner-s {
	max-width: 600px;
	margin: 0 auto;
}
.inner400 {
	width: 400px;
	margin: 0 auto;
	position: relative;
}
.inner900 {
	max-width: 900px;
	margin: 0 auto;
	position: relative;
}

.lead-text {
	margin-top: 10px;
}

.text {
	padding: 50px 20px;
	position: relative;
}
	.text p {
		line-height: 2;
		margin-bottom: 30px;
	}
	.text p:last-child {
		margin-bottom: 0;
	}

.text-c {
	text-align: center;
}

.text h3 {
	font-size: 17px;
	font-weight: 600;
}

.slope.bl .chapter-title,
.slope.bl .sub-title,
.slope.bl .lead-text,
.slope.bl .text h3,
.slope.bl .text p {
	color: #fff;
}

/*	contact-btn
------------------------ */
.contact-btn {
	text-align: center;
}

.contact-btn a {
	width: 250px;
	color: #eee;
	font-weight: 600;
	display: inline-block;
	background: #797979;
	padding: 10px;
}

.slope .contact-btn a {
	color: #333;
	background: #fff;
}

.adjust200 img { width: 200px; }
.adjust180 img { width: 180px; }
.adjust150 img { width: 150px; }
.adjust300 img { width: 300px; }

.image-box {
	padding: 0 20px;
}

/* --------------------------------------------
	TOP PAGE
-------------------------------------------- */
/*	news
------------------------ */
.news-inner {	
	width: 500px;
	margin: 0 auto;
	padding: 20px 0;
	position: relative;
}

/*	news-board
------------------------ */
.news-board {
	padding: 30px 0;
}
	.news-board dl:not(:last-child) {
		margin-bottom: 30px;
	}

		.news-board dl dt {
			width: 22%;
			font-size: 14px;
			padding: 1px 0;
			float: left;
		}

		.news-board dl dd {
			overflow: hidden;
		}

			.news-board dl dd a {
				font-size: 16px;
				font-weight: 500;
			}

.slope.bl .news-board dl dt,
.slope.bl .news-board dl dd,
.slope.bl .news-board dl dd a {
	color: #fff;
}

/* --------------------------------------------
	NEWS PAGE
-------------------------------------------- */
/*	news-archive-box
------------------------ */
.news-archive-box {
	padding: 50px 20px;
}

	.news-archive-box dl {
		margin: 30px 0;
	}

	.news-archive-box dl dt {
		width: 15%;
		font-size: 15px;
		font-weight: 600;
		float: left;
	}

/*	post-box
------------------------ */
.post-box {
	overflow: hidden;
}

.post-box .post-title {
	font-size: 25px;
	font-weight: 600;
	line-height: 1;
}

.post-box .post-title a {
	color: #191a86;
	font-size: 25px;
	font-weight: 600;
	line-height: 1;
}

.post-box .post-body {
	margin-top: 30px;
	line-height: 2;
}

.post-box .post-body p {
	line-height: 2;
}

/* --------------------------------------------
	PROFILE PAGE
-------------------------------------------- */
/*	table
------------------------ */
.table {
	width: 100%;
}
.table th,
.table td {
	padding: 10px;
	text-align: center;
}
.table.media {
	margin: 50px 0;
}
.table.media th,
.table.media td {
	color: #fff;
}
.table.media td:last-child {
	text-align: left;
}
.table.media th:first-child {
	width: 15%;
}
.table.media th:nth-child(2) {
	width: 10%;
}

.profile-inner {
	max-width: 400px;
	margin: 0 auto;
}

/*	profile-info
------------------------ */
.profile-info {
	margin: 50px 0;
	padding: 10px 20px;
}
	.profile-info dl {
		margin-top: 30px;
	}
		.profile-info dl dt {
			width: 40%;
			font-weight: 600;
			float: left;
		}
		.profile-info dl dd {
			overflow: hidden;
		}

.media-inner {
	max-width: 900px;
	margin: 0 auto;
	position: relative;
}

/* --------------------------------------------
	RECRUIT PAGE
-------------------------------------------- */
.recruit-career-info {
	margin: 50px 0;
	padding: 10px 20px;
}
	.recruit-career-info dl {
		margin-top: 30px;
	}
		.recruit-career-info dl dt {
			width: 15%;
			font-weight: 600;
			float: left;
		}
		.recruit-career-info dl dd {
			overflow: hidden;
		}

.recruit-career-info .inner400 p {
	margin-top: 30px;
}

/* --------------------------------------------
	SERVICE PAGE
-------------------------------------------- */
.banner-area ul li {
	text-align: center;
	margin-bottom: 20px;
}

/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
	responsive style
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

@media screen and (max-width: 900px) {
	.g-navi li a {
		padding: 0 15px;
	}
	.ft-navi li a {
		padding: 10px 25px;
	}
}

@media screen and (max-width: 800px) {
	.table.media th:first-child {
		width: 20%;
	}
	.table.media th:nth-child(2) {
		width: 15%;
	}
}

@media screen and (max-width: 768px) {
	.logo {
		width: 30%;
	}
	.g-navi {
		display: none;
	}
	.footer {
		padding-top: 50px;
	}
	.child-menu {
		display: none;
	}
	.h-group {
		padding: 0;
		top: 25vw;
		left: 10vw;
	}
	.privacy .catch-title {
		width: 55%;
	}
	.privacy .catch-sub {
		width: 25%;
	}
	.top-title {
		width: 60%;
	}
	.top .catch-sub {
		width: 70%;
	}
	.menu-btn {
		display: block;
	}
}

@media screen and (max-width: 640px) {
	* {
		font-size: 14px;
	}
	.main-visual img {
		min-width: 900px;
	}
	.h-group {
		top: 30vw;
	}
	.slope {
		padding: 50px 0;
	}

	.catch-title { width: 30%; }
	.catch-sub { width: 15%; }

	.about .catch-title { width: 35%; }
	.about .catch-sub { width: 22%; }

	.privacy .catch-title { width: 55%; }
	.privacy .catch-sub { width: 32%; }

	.table.media th, .table.media td {
		font-size: 13px;
		padding: 10px 5px;
	}
	.news-board {
		padding: 30px 20px;
	}
	.news-archive-box dl dt {
		float: none;
	}
	.post-box .post-title {
		line-height: 1.3;
	}
}

@media screen and (max-width: 480px) {
	.logo {
		width: 40%;
	}
	.main-visual img {
		min-width: 850px;
	}
	.chapter-title {
		font-size: 30px;
	}
	.h-group {
		top: 35vw;
	}
	.top-title {
		width: 65vw;
	}
	.news-inner {
		width: 100%;
	}
	.news-board dl:not(:last-child) {
		margin-bottom: 10px;
	}
	.catch-title { width: 40%; }
	.catch-sub { width: 20%; }

	.about .catch-title { width: 40%; }
	.about .catch-sub { width: 25%;}

	.privacy .catch-title { width: 55%; }
	.privacy .catch-sub { width: 40%; }

	.top .h-group {
		left: 5vw;
	}
	.top-title { width: 75%; }
	.top .catch-sub { width: 85%; }

	.ft-navi li {
		width: 33.33%;
	}
	.ft-navi li a {
		padding: 10px 15px;
	}
	.table.media tr {
		width: 100%;
		display: block;
		padding-bottom: 20px;
	}
	.table.media tr:first-child {
		display: none;
	}
	.table.media th, .table.media td {
		width: 100%;
		display: block;
		text-align: left;
		padding: 5px 20px;
	}
	.title-group {
		padding: 0 20px;
	}
	.news-board dl dt {
		float: none;
	}
	.news-board dl:not(:last-child) {
		margin-bottom: 15px;
	}
	.post-box .post-title {
		font-size: 20px;
	}
	.news .catch-title {
		width: 30%;
	}
}

@media screen and (max-width: 400px) {
	.main-visual img {
		min-width: 600px;
	}
	
	.catch-title { width: 45%; }
	.catch-sub { width: 20%; }

	.about .catch-title { width: 50%; }
	.about .catch-sub { width: 30%; }

	.privacy .catch-title { width: 70%; }
	.ft-navi li {
		width: 50%;
	}
}

@media screen and (max-width: 350px) {
	.top-title { width: 85%; }
	.top .catch-sub { width: 93%; }
	.h-group {
		top: 40%;
	}
}