﻿/* charset */
@charset "UTF-8";

body, td, div, p {
	color: #111111;
}

body {
	margin: 0;
	padding: 0;
	font-family:Verdana, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
	color: #111111;
	background-color: #FFFFFF;
	text-align: center;
}

p { margin: 0 0 10px 0; padding: 0; line-height: 180%; }
img { border-width: 0; vertical-align:text-bottom; }
strong { font-weight: bold; }

.clear { clear: both; height: 0; display:block; visibility: hidden; }

.clearfix:before,
.clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

.alignLeft { text-align: left !important; }
.alignCenter { text-align: center !important; margin: 0 auto; }
.alignRight { text-align: right !important; }

/* ----- 端末ごとの表示 ----- */
@media screen and (max-width: 480px) {
	.pc { display: none; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	.pc { display: none; }
}
@media screen and (min-width:900px) {
	.sp { display: none; }
}

/* ----- テキスト設定 ----- */
.fontLL { font-size: 1.6em; }
.fontL { font-size: 1.2em; }
.fontM { font-size: 1em; }
.fontS { font-size: 0.8em; font-size/*\**/: 0.85em\9; _font-size: 0.85em; }
.fontSS { font-size: 0.65em; font-size/*\**/: 0.7em\9; _font-size: 0.7em; }

.fake { color: #FFFFFF; }
.indent { margin-left: 50px; }
.indentV { margin-top: 50px; }

a:link { color: #385723; text-decoration: none; }
a:visited { color: #385723; text-decoration: none; }
a:hover { color: #289713; text-decoration: none; }
a:active { color: #289713; text-decoration: none; }

.pnt1 { color: #C00000; }
.pnt1 a:link { color: #C00000; }
.pnt1 a:visited { color: #C00000; }
.pnt1 a:hover { color: #C00000; }
.pnt1 a:active { color: #C00000; }

.pnt2 { color: #335577; }
.pnt2 a:link { color: #335577; }
.pnt2 a:visited { color: #335577; }
.pnt2 a:hover { color: #66BBEE; }
.pnt2 a:active { color: #66BBEE; }

.btn1 {
	display: inline-block;
	padding: 2px 10px;
	font-size: 0.65em; font-size/*\**/: 0.7em\9; _font-size: 0.7em;
	color: #FFFFFF;
	background-color: #385723;
	border: 1px solid #999999;
}

.btn2 {
	display: inline-block;
	padding: 2px 10px;
	font-size: 0.8em; font-size/*\**/: 0.85em\9; _font-size: 0.85em;
	font-weight: bold;
	color: #FFFFFF;
	background-color: #385723;
}

.btn3 {
	display: inline-block;
	margin: 10px;
	padding: 20px 30px;
	width: 180px;
	font-weight: bold;
	color: #FFFFFF;
	background-color: #385723;
}

/* ----- 見出し設定 ----- */
h1 {
	margin: 0;
	padding: 0;
}

h2 {
	margin: 0;
	padding: 0;
}

h3 {
	margin: 20px auto 0 auto;
	color: #385723;
	font-size: 1.4em;
	text-align: left;
}
@media screen and (max-width: 480px) {
	h3 { padding: 0 5px; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	h3 { padding: 0 5px; }
}
@media screen and (min-width:900px) {
	h3 { width: 1000px; }
}

h4 {
	margin: 5px auto 30px auto;
	padding: 30px 0;
	color: #333333;
	text-align: center;
	font-family: "HG正楷書体-PRO", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-weight: bold;
}
h4 .messageL {
	letter-spacing: -0.1em;
	line-height: 130%;
}
@media screen and (max-width: 480px) {
	h4 .messageL { font-size: 2.2em; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	h4 .messageL { font-size: 2.2em; }
}
@media screen and (min-width:900px) {
	h4 .messageL { font-size: 2.8em; }
}
h4 .messageS {
	display: block;
	margin-top: 15px;
	color: #110099;
	line-height: 150%;
}
@media screen and (max-width: 480px) {
	h4 .messageS { font-size: 1em; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	h4 .messageS { font-size: 1em; }
}
@media screen and (min-width:900px) {
	h4 .messageS { font-size: 1.1em; }
}

h5 {
	margin: 30px 0 10px 0;
	color: #385723;
	font-size: 1em;
	border-bottom: 2px solid #385723;
}

/* ----- リスト設定 ----- */
ul, li {
	margin: 0;
	padding: 0;
}
ul {
	list-style-position: outside;
}

ol {
	line-height: 180%;
}

form {
	margin: 0;
	padding: 0;
}

/* ----- テーブル設定 ----- */
table {
	border-collapse: collapse;
}

/* ----- フォーム設定 ----- */
input[type="submit"], input[type="reset"], input.reset {
	display: inline-block;
	margin: 20px;
	padding: 0.3em 1em;
	width: 120px;
	font-size: 1.05em;
	font-weight: bold;
	border: 1px solid #CCD3DD;
	background-image: -webkit-linear-gradient(#FFFFFF 0%, #E9E9E9 100%);
	background-image: linear-gradient(#FFFFFF 0%, #E9E9E9 100%);
	transition: .4s;
	box-shadow: 0px 1px 1px 1px rgba(0,0,0,0.3);
}

/* ----- レイアウト ----- */
/* ヘッダー ----- */
#header {
	margin: 0;
	width: 100%;
	display: -webkit-flex;
	display: flex;
}

#headerL {
	margin: 0;
	padding: 0;
	text-align: left;
}
#headerL img {
	margin: 0;
	width: 100%;
}
#headerR {
	-webkit-flex-grow: 1;
	flex-grow: 1;
}

@media screen and (max-width: 480px) {
	#headerL { width: 55%; }
	#headerR { width: 45%; }
	#headerR img { margin: 2vw 0 0 2vw; height: 15vw; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	#headerL { width: 60%; }
	#headerR { width: 40%; }
	#headerR img { margin: 3vw 0 0 2vw; height: 15vw; }
}
@media screen and (min-width:900px) {
	#headerL { width: 60%; }
	#headerR { width: 40%; }
	#headerR img { margin-top: 5vw; }
}


/* メニュー ----- */
#menu {
	width: 100%;
	background-color: #385723;
}
#menu ul {
	margin: 0 auto;
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	list-style-type: none;
	text-align:center;
}
#menu li {
	border: 3px solid #FFFFFF;
	line-height: 70px;
	white-space: nowrap;
}
#menu li.menuHome {
	padding: 2px 5px;
	border: 0;
	line-height: 100%;
}
#menu li.menuNolink {
	background-color: #FFFFFF;
	color: #385723;
	font-weight: bold;
}
#menu a li:hover {
	background-color: #587743;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all  0.2s ease;
}
#menu .menuText {
	display:inline-block;
	vertical-align: middle;
	line-height:normal;
}
#menu a:link { color: #FFFFFF; text-decoration: none; }
#menu a:visited { color: #FFFFFF; text-decoration: none; }
#menu a:hover { color: #FCFCFC; text-decoration: none; }
#menu a:active { color: #FCFCFC; text-decoration: none; }

@media screen and (max-width: 480px) {
	#menu { margin-bottom: 10px; }
	#menu li { margin: 10px 5px; padding: 1vw; width: 25vw; }
	#menu li.menuHome { margin: 5px 0; width: auto; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	#menu { margin-bottom: 10px; }
	#menu li { margin: 10px 5px; padding: 1vw; width: 25vw; }
	#menu li.menuHome { margin: 5px 0; width: auto; }
}
@media screen and (min-width:900px) {
	#menu { margin-bottom: 20px; }
	#menu li { margin: 10px 15px; padding: 10px; width: 110px; }
	#menu li.menuHome { margin: 80px 0 0 0; width: auto; }
}

/* キャッチコピー ----- */
#catch {
	margin: 0 auto;
	padding: 0;
}
#catch ul {
	display:block;
	line-height: 200%;
	pointer-events: none;
}
#catch li {
	color: #385723;
}

@media screen and (max-width: 480px) {
	#catch ul { font-size: 1.1em; }
	#catch strong { font-size: 1.3em; }
	.slider{ margin: 50px auto; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	#catch ul { font-size: 1.1em; }
	#catch strong { font-size: 1.3em; }
	.slider{ margin: 50px auto; }
}
@media screen and (min-width:900px) {
	#catch ul { font-size: 1.3em; letter-spacing: 0.2em; }
	#catch strong { font-size: 1.5em; }
	.slider{ margin: 100px auto; }
}

/* トップ写真 ----- */
#cover {
	margin: 0 auto 4vw auto;
}
#cover img {
	margin: 10px 5px;
}

@media screen and (max-width: 480px) {
	#cover { width: 95%; text-align: center; }
	#cover img { width: 45%; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	#cover { width: 95%; text-align: center; }
	#cover img { width: 45%; }
}
@media screen and (min-width:900px) {
	#cover { width: 1200px; text-align: left; }
}

/* コンテンツ ----- */
.container {
	margin: 20px auto;
	text-align: left;
}

.containerL {
	float: left;
}
.containerR {
	float: left;
}

@media screen and (max-width: 480px) {
	.container { padding-left: 0; width: 98%; }
	.containerL { width: 100%; }
	.containerR { width: 100%; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	.container { padding-left: 0; width: 98%; }
	.containerL { width: 100%; }
	.containerR { width: 100%; }
}
@media screen and (min-width:900px) {
	.container { padding-left: 150px; width: 850px; }
	.containerL { width: 30%; }
	.containerR { width: 70%; }
}

.containerBox {
	margin: 0 auto;
	border: 2px solid #385723;
}
.containerBox h4{
	background-color: #F7FBF5;
	border: 1px solid #385723;
}

@media screen and (max-width: 480px) {
	.containerBox { padding: 20px 15px; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	.containerBox { padding: 20px 15px; }
}
@media screen and (min-width:900px) {
	.containerBox { padding: 70px 55px; }
}


/* コンテンツ: テーブル ----- */
.container table {
	margin: 0 auto;
	width: 100%;
}
.container table th {
	padding: 20px;
	background-color: #E2F0D9;
	color: #385723;
	text-align: center;
	font-weight: normal;
	vertical-align: top;
	white-space: nowrap;
}
.container table td {
	padding: 20px;
	color: #385723;
}

/* コンテンツ: 箇条書き強調 ----- */
.container ul {
	margin-left: 16px;
}

.ul_emphasis {
	padding: 0 30px 0 40px;
	border-left: 5px solid #385723;
}
.ul_emphasis li {
	margin: 5px 0;
	color: #385723;
	font-size: 1.2em;
}

/* ページトップに戻る ----- */
.back {
	margin: 20px;
	text-align: right;
	font-size: 0.75em; font-size/*\**/: 0.75em\8; _font-size: 0.75em;
	border-bottom: 1px solid #EEEEEE;
}
.back a { text-decoration: none; }
.back a:link { color: #CCCCCC; }
.back a:visited { color: #CCCCCC; }
.back a:hover { color: #587743; }
.back a:active { color: #587743; }

.back a:before {
	font-family: "Font Awesome 5 Free";
	content: "\f139";
	font-weight: 900;
	margin-right: 4px;
}

@media print {
	.back { display: none; }
}

/* 前ページに戻る ----- */
.prev {
	margin: 30px auto 0 auto;
	width: 200px;
	padding: 8px 20px;
	border: 3px solid #385723;
	text-align: center;
	font-weight: bold;
}

/* フッター ----- */
#footer {
	position: relative;
	margin: 15px auto;
	text-align: left;
	background-image: URL(../image/kokusei_bg.gif);
	background-repeat: repeat-x;
}
#footer ul {
	margin: 0 auto;
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	list-style-type: none;
	text-align:center;
}
#footer li {
	margin: 0 1vw;
	font-weight: bold;
	font-size: 0.9em; font-size/*\**/: 0.9em\9.5; _font-size: 0.9em;
	white-space: nowrap;
}
@media screen and (max-width: 480px) {
	#footerCompany { margin-left: 0; height: auto; margin-bottom: 10px; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	#footerCompany { margin-left: 20px; width: ; height: auto; }
}
@media screen and (min-width:900px) {
	#footerCompany { margin-left: 100px; width: 130px; height: 72px; }
}

/* 会社概要 ----- */
#companyPolicy {
	margin: 0 auto;
	padding: 20px;
	background-color: #E2F0D9;
	border: 3px solid #385723;
	color: #385723;
	text-align: center;
	font-size: 1.3em;
}

/* 國盛とは ----- */
#overviewTitle {
	margin: 5px auto 30px auto;
	padding: 30px 0 10px 0;
	text-align: center;
}
@media screen and (max-width: 480px) {
	#overviewTitle { width: 95%; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	#overviewTitle { width: 95%; }
}
@media screen and (min-width:900px) {
}


/* 社員NOインタビュー ----- */
.interview {
	margin: 20px auto;
	display: -webkit-flex;
	display: flex;
	background-color: #E2F0D9;
	border: 3px solid #385723;
	text-align: center;
	font-size: 1.3em;
}
.interview:hover {
	background-color: #D2F0C9;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all  0.2s ease;
}

.interviewText {
	float: left;
	color: #385723;
}

.interviewPhoto {
	width: 270px;
}
@media screen and (max-width: 480px) {
	.interview { flex-direction: column; }
	.interviewEven { }
	.interviewText { padding: 15px 0; width: 100%; }
	.interviewPhoto { margin: 0 auto 10px auto; }
	.interviewPhotoL { border: 3px solid #385723; }
	.interviewPhotoR { border: 3px solid #385723; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	.interview { flex-direction: column; }
	.interviewEven { }
	.interviewText { padding: 15px 0; width: 100%; }
	.interviewPhoto { margin: 0 auto 10px auto; }
	.interviewPhotoL { border: 3px solid #385723; }
	.interviewPhotoR { border: 3px solid #385723; }
}
@media screen and (min-width:900px) {
	.interview { height: 240px; }
	.interviewEven .interviewText { order: 2; }
	.interviewEven .interviewPhoto { order: 1; }
	.interviewText { padding-top: 90px; width: 571px; }
	.interviewPhoto { float: left; }
	.interviewPhotoL { border-left: 3px solid #385723; }
	.interviewPhotoR { border-right: 3px solid #385723; }
}

/* 社員インタビュー内容 ----- */
.interviewTitle {
	margin-bottom: 15px;
	width: 100%;
	background-color: #E2F0D9;
	display: -webkit-flex;
	display: flex;
	align-items: center;
}
.interviewTitle img {
	border: 2px solid #385723;
}

.interviewName {
	margin: 5px 20px;
	background-color: #FFFFFF;
	border: 2px solid #385723;
	text-align: center;
	white-space: nowrap;
}
@media screen and (max-width: 480px) {
	.interviewTitle { flex-wrap: wrap; }
	.interviewTitle img { width: 55%; }
	.interviewTitleEx { width: 60% !important; }
	.interviewName { padding: 10px; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	.interviewTitle { flex-wrap: wrap; }
	.interviewTitle img { width: 55%; }
	.interviewTitleEx { width: 60% !important; }
	.interviewName { padding: 10px; }
}
@media screen and (min-width:900px) {
	.interviewTitle {}
	.interviewTitle img {}
	.interviewTitleEx { }
	.interviewName { padding: 20px; }
}

.interviewTime {
	margin: 3px !important;
}
.interviewTime td {
	padding: 4px 0 !important;
	color: #000000 !important;
	font-weight: bold;
	font-size: 0.9em; font-size/*\**/: 1em\9; _font-size: 1em;
	line-height: 120%;
	vertical-align: top;
}

.interviewExtra {
	margin-top: 20px;
	text-align: center;
}
.interviewExtra img {
	margin: 0 0 5px 0;
}

/* 点滅アニメーションの定義 */
@keyframes blinker {
  50% {
    opacity: 0; /* 透明度を変更 */
  }
}

/* 点滅を適用するクラス */
.blink {
  animation: blinker 3s linear infinite;
}



/* 求める人物像 ----- */
.messagePoint {
	display: inline-block;
	padding: 8px 15px 8px 10px;
	text-align: center;
	color: #FFFFFF;
	background-image: URL(../image/message_point.png);
	background-repeat: no-repeat;
	background-position: right;
	background-size: 100%;
}

.messageText p, .messageText li {
	color: #333333;
	letter-spacing: -0.1em;
	font-weight: bold;
}
.messageText p {
	margin: 0 0 20px 0;
	font-family: "HG正楷書体-PRO", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.messageText p, .messageText li {
	font-family: "HG正楷書体-PRO", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
@media screen and (max-width: 480px) {
	.messageText p, .messageText li { font-size: 1.4em; line-height: 140%; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	.messageText p, .messageText li { font-size: 1.4em; line-height: 140%; }
}
@media screen and (min-width:900px) {
	.messageText p, .messageText li { font-size: 1.5em; line-height: 130%; }
}
.messageBullet {
	margin-bottom: 0 !important;
}
.messageText ul {
	margin-left: 30px;
}

/* 募集要項 ----- */
#requireMenu {
	margin: 0 auto;
	width: 100%;
	text-align: center;
}

#requireMenu li {
	margin: 30px auto;
	line-height: 70px;
	display: block;
	background-color: #E2F0D9;
	border: 2px solid #385723;
	text-align: center;
	font-size: 1.3em;
}
#requireMenu li:hover {
	background-color: #D2F0C9;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all  0.2s ease;
}
@media screen and (max-width: 480px) {
	#requireMenu li { width: 90%; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	#requireMenu li { width: 90%; }
}
@media screen and (min-width:900px) {
	#requireMenu li { width: 480px; }
}

/* メールフォーム ----- */
.mailError {
	color: #C00000;
}

@media screen and (max-width: 480px) {
	.mailFormInput1 { width: 120px; }
	.mailFormInput2 { width: 200px; }
	.mailFormInput3 { width: 220px; }
	.mailFormInput4 { width: 280px; }
}
@media screen and (min-width: 481px) and (max-width: 899px) {
	.mailFormInput1 { width: 120px; }
	.mailFormInput2 { width: 200px; }
	.mailFormInput3 { width: 220px; }
	.mailFormInput4 { width: 280px; }
}
@media screen and (min-width:900px) {
	.mailFormInput1 { width: 150px; }
	.mailFormInput2 { width: 300px; }
	.mailFormInput3 { width: 350px; }
	.mailFormInput4 { width: 600px; }
}

/* フッター ----- */

#copyright {
	margin: 5px auto;
	font-size: 0.7em; font-size/*\**/: 0.75em\8; _font-size: 0.75em;
	color: #444444;
}

