@charset "UTF-8";



/* ------------------------------------------

  global

------------------------------------------ */
* {
	margin: 0px;
	padding: 0px;

	text-decoration: none;

	}

html {
	font-size: 100.0%;
	height: 100%;

    -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
}

body {font-size: 10px; font-size: 1.0rem;}
body {
	text-align: center;
	font-family: Meiryo,"メイリオ",-apple-system,sans-serif,"Hiragino Kaku Gothic ProN",BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM;

	}

/* img
-----------------------------------------------------------  */
img {
	padding: 0px;
	margin: 0px;
	border: none;
	vertical-align: bottom;
	display: block;
	max-width: 100%;
	max-height: 100%;
	}

/* text link
----------------------------------------------------------- */
a:link,
a:visited,
a:active {
	color: #137dcc;
/*	text-decoration: underline; */
	}

a:hover {
	color: #999999;
	text-decoration: underline;
	}

/* clearfix
----------------------------------------------------------- */
/* clearfix */
.cf:before,
.cf:after{
    display: table; 
    content: '';
}

.cf:after{
    clear: both;
}

/* h
----------------------------------------------------------- */
h1,h2,h3,h4,h5,h6 {
	margin: 0px;
	padding: 0px;
	}

/* ul li
----------------------------------------------------------- */
li { list-style: none;}


/* em
----------------------------------------------------------- */
em { font-style: normal; font-weight: bold;}


/* bold
----------------------------------------------------------- */
.bold { font-weight: bold;}


/* color
----------------------------------------------------------- */
.red { color: #db0202;}



/* link move
----------------------------------------------------------- */
.btn a,
#gMenu ul li a,
.contentBn ul li,
#footer ul li a
	{
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	cursor: pointer;
	}

.btn a:hover,
#gMenu ul li a:hover,
.contentBn ul li:hover,
#footer ul li a:hover
	{
	filter: alpha(opacity=50);
	-webkit-opacity: 0.5;
	-moz-opacity: 0.5;
	opacity: 0.5;
	}


/* text-indent
----------------------------------------------------------- */
#header h1 
										{ overflow: hidden; text-indent: 100%; white-space: nowrap;}


/* PC タブレット用スタイル */
@media (min-width: 768px) {	

/* width
-----------------------------------------------------------  */
.inner,
#gMenu ul
										{ margin: 0 auto; width: 1200px;}
.contentBn,
#totop
										{ margin: 0 auto; width: 1170px;}	
	
/* container
----------------------------------------------------------- */
#container {
	font-size: 14px; font-size: 1.4rem;
	line-height: 1.5;
	color: #555;
	letter-spacing: 0.05em;
	text-align: left;
	}


/* header
----------------------------------------------------------- */
#header 								{ height: 88px; margin-top: 20px;}
#header h1								{ display: block; float: left; width: 410px; height: 64px; background: url(../../img/union/logo.png) no-repeat left top; }

#header .headerR						{ float: right; width: 300px; margin-top: 4px; font-weight: bold;}
#header h1 a { display: block; }

/* btn
----------------------------------------------------------- */
/*.btn a								{ display: block; background-color: #137dcc; height: 60px; color: #fff; text-align: center; border-radius: 10px; line-height: 60px; text-decoration: none;} */
.btn a									{ display: block; background-color: #00cc76; height: 60px; color: #fff; text-align: center; border-radius: 10px; line-height: 60px; text-decoration: none; font-size: 24px;}

/* btn-large
----------------------------------------------------------- */
.btn-large input							{ display: block; background-color: #00cc76; height: 60px; color: #fff; text-align: center; border-radius: 10px; line-height: 60px; text-decoration: none; font-size: 24px; vertical-align:middle;}

	
/* btnBox
----------------------------------------------------------- */
.btnBox 								{ width: 410px; margin: 0 auto;}
/*.btnBox 								{ width: 398px; margin: 0 auto;}*/


/* large_font
----------------------------------------------------------- */
.large_font								{ font-size: 18px;}
/* large_font


/* gMenu
----------------------------------------------------------- */
#gMenu 									{ background-color: #f39800; height: 98px;}
#gMenu ul 								{ text-align: center;}
#gMenu ul li 							{ display: inline; line-height: 98px; padding: 0 16px;}
#gMenu ul li a 							{ display: inline-block; color: #fff; font-weight: bold; text-decoration: none;}

	
/* contentBn バナー群
----------------------------------------------------------- */
.contentBn ul 							{ display: flex; flex-wrap: wrap; margin-bottom: 56px;}
.contentBn ul li 						{ width: 370px; margin-right: 30px; margin-bottom: 36px;}
.contentBn ul li:nth-child(3n) 					{ margin-right: 0;}
	

/* footer
----------------------------------------------------------- */
#footer 								{ background-color: #ebebeb; padding: 55px 0 24px 0;}
#footer ul								{ text-align: center; padding-bottom: 46px;}
#footer ul li							{ display: inline; padding: 0 10px;}
#footer ul li a							{ color: #333; text-decoration: none;}

#footer p  								{ text-align: center;}
#footer p small 						{ font-style: normal;}


/* topcontrol ページの先頭へ戻る
----------------------------------------------------------- */
#totop a {
	float: right;
	display: block;
	width: 78px;
	height: 78px;
	background: url(../../js/totop.png) no-repeat left top;
	text-indent: -9999px;
	margin-bottom: 15px;
	
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	}

#totop a:hover {
	filter: alpha(opacity=50);
	-webkit-opacity: 0.5;
	-moz-opacity: 0.5;
	opacity: 0.5;
	}


/* margin
----------------------------------------------------------- */
.mb70 									{ margin-bottom: 50px;}
	

/* font
----------------------------------------------------------- */
/* basic font-size: 14px; */
.btn,
#gMenu ul li a
										{ font-size: 18px;}
#footer ul li,
#footer p small 
										{ font-size: 16px;}


}


/* タブレット用スタイル */
@media (min-width: 768px) and (max-width: 1024px) {

/* width
-----------------------------------------------------------  */
.inner,
#gMenu ul
										{ margin: 0 auto; width: 740px;}
.contentBn,
#totop
										{ margin: 0 auto; width: 740px;}	

	
/* gMenu
----------------------------------------------------------- */
#gMenu 									{ height: auto !important; padding: 20px 0;}
#gMenu ul li 								{ display: inline; line-height: 2 !important; padding: 0 20px;}


/* contentBn バナー群
----------------------------------------------------------- */
.contentBn ul li 							{ width: 30%; margin: 0 1.5%; margin-bottom: 36px;}


}
	
/* スマホ用スタイル */
@media screen and (max-width: 767px){

			*									{ font-size: 12px;}

			/* width
			-----------------------------------------------------------  */
			.inner,
			#gMenu ul
												{ margin: 0 auto; width: 96%;}
			.contentBn,
			#totop
												{ margin: 0 auto; width: 96%;}	

			/* container
			----------------------------------------------------------- */
			#container {
				font-size: 14px; font-size: 1.4rem;
				line-height: 1.5;
				color: #555;
				letter-spacing: 0.05em;
				text-align: left;
				}


			/* header
			----------------------------------------------------------- */
			#header 								{ margin: 2rem 0;}
			#header h1								{ display: block; width: 356px; height: 51px; margin-bottom: 1rem; background: url(../../img/union/logo.png) no-repeat left top; background-size: cover;}
/*			#header h1								{ display: block; width: 611px; height: 90px; margin-bottom: 1rem; background: url(../../img/union/logo.png) no-repeat left top; background-size: cover;}*/
			#header h1 a { display: block; }

			#header .headerR						{ margin: 0 auto; width: 300px; margin-top: 4px; font-weight: bold;}


			/* btn
			----------------------------------------------------------- */
			.btn a								{ display: block; background-color: /* #137dcc */ #00cc76; height: 60px; color: #fff; text-align: center; border-radius: 10px; line-height: 60px; text-decoration: none; font-weight: bold; font-size: 16px;}


			/* btnBox
			----------------------------------------------------------- */
			.btnBox 							{ width: 90%; margin: 0 auto;}


			/* contentBn バナー群
			----------------------------------------------------------- */
			.contentBn ul 							{ display: flex; flex-wrap: wrap; margin-bottom: 1rem;}
			.contentBn ul li 						{ width: 48%; margin-right: 2%; margin-bottom: 1rem;}
			.contentBn ul li:nth-child(2n) 			{ margin-right: 0;}


			/* footer
			----------------------------------------------------------- */
			#footer 								{ background-color: #ebebeb; padding: 2rem 0;}
			#footer ul								{ text-align: center; padding-bottom: 1rem;}
			#footer ul li							{ display: inline; padding: 0 0.5rem;}
			#footer ul li a							{ color: #333; text-decoration: none;}

			#footer p  								{ text-align: center;}
			#footer p small 						{ font-style: normal;}


			/* topcontrol ページの先頭へ戻る
			----------------------------------------------------------- */
			#totop a {
				float: right;
				display: block;
				width: 50px;
				height: 50px;
				background: url(../../js/totop.png) no-repeat left top;
				background-size: cover;
				text-indent: -9999px;
				margin-bottom: 15px;
				}


			/* margin
			----------------------------------------------------------- */
			.mb70 										{ margin-bottom: 40px;}


			/* font
			----------------------------------------------------------- */
			/* basic font-size: 14px; */
			.btn
													{ font-size: 21px;}
			.large_font
													{ font-size: 19px;}
			#gMenu ul li a
													{ font-size: 17px;}
			#footer ul li,
			#footer p small 
													{ font-size: 16px;}
			.contentInner, .contentInner02,
			.column3Point, .cf,
			.column2Seminar, .cf,
			.boxOrange, .tableBlock, .qaBlock, .companyBlock				{ font-size: 9px;}
			.notes										{ font-size: 9px; text-decoration: none;}

			.img										{ height: auto;}


}

#form { margin-top: 40px; }
.input-field {}
::-webkit-input-placeholder {
  color: #555; }

:-moz-placeholder {
  /* Firefox 18- */
  color: #555; }

::-moz-placeholder {
  /* Firefox 19+ */
  color: #555; }

:-ms-input-placeholder {
  color: #555; }

input[type=text], input[type=password], input[type=email], input[type=url], input[type=time], input[type=date], input[type=datetime-local], input[type=tel], input[type=number], input[type=search], textarea.materialize-textarea {
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #9e9e9e;
  border-radius: 0;
  outline: none;
  height: 6rem;
  width: 100%;
  font-size: 14px;
  margin: 0 0 15px 0;
  padding: 0;
  box-shadow: none;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  transition: all .3s; }
  input[type=text]:disabled, input[type=text][readonly="readonly"], input[type=password]:disabled, input[type=password][readonly="readonly"], input[type=email]:disabled, input[type=email][readonly="readonly"], input[type=url]:disabled, input[type=url][readonly="readonly"], input[type=time]:disabled, input[type=time][readonly="readonly"], input[type=date]:disabled, input[type=date][readonly="readonly"], input[type=datetime-local]:disabled, input[type=datetime-local][readonly="readonly"], input[type=tel]:disabled, input[type=tel][readonly="readonly"], input[type=number]:disabled, input[type=number][readonly="readonly"], input[type=search]:disabled, input[type=search][readonly="readonly"], textarea.materialize-textarea:disabled, textarea.materialize-textarea[readonly="readonly"] {
    color: rgba(0, 0, 0, 0.26);
    border-bottom: 1px dotted rgba(0, 0, 0, 0.26); }
  input[type=text]:disabled + label, input[type=text][readonly="readonly"] + label, input[type=password]:disabled + label, input[type=password][readonly="readonly"] + label, input[type=email]:disabled + label, input[type=email][readonly="readonly"] + label, input[type=url]:disabled + label, input[type=url][readonly="readonly"] + label, input[type=time]:disabled + label, input[type=time][readonly="readonly"] + label, input[type=date]:disabled + label, input[type=date][readonly="readonly"] + label, input[type=datetime-local]:disabled + label, input[type=datetime-local][readonly="readonly"] + label, input[type=tel]:disabled + label, input[type=tel][readonly="readonly"] + label, input[type=number]:disabled + label, input[type=number][readonly="readonly"] + label, input[type=search]:disabled + label, input[type=search][readonly="readonly"] + label, textarea.materialize-textarea:disabled + label, textarea.materialize-textarea[readonly="readonly"] + label {
    color: rgba(0, 0, 0, 0.26); }
  input[type=text]:focus:not([readonly]), input[type=password]:focus:not([readonly]), input[type=email]:focus:not([readonly]), input[type=url]:focus:not([readonly]), input[type=time]:focus:not([readonly]), input[type=date]:focus:not([readonly]), input[type=datetime-local]:focus:not([readonly]), input[type=tel]:focus:not([readonly]), input[type=number]:focus:not([readonly]), input[type=search]:focus:not([readonly]), textarea.materialize-textarea:focus:not([readonly]) {
    border-bottom: 1px solid #d31a1b;
    box-shadow: 0 1px 0 0 #d31a1b; }
  input[type=text]:focus:not([readonly]) + label, input[type=password]:focus:not([readonly]) + label, input[type=email]:focus:not([readonly]) + label, input[type=url]:focus:not([readonly]) + label, input[type=time]:focus:not([readonly]) + label, input[type=date]:focus:not([readonly]) + label, input[type=datetime-local]:focus:not([readonly]) + label, input[type=tel]:focus:not([readonly]) + label, input[type=number]:focus:not([readonly]) + label, input[type=search]:focus:not([readonly]) + label, textarea.materialize-textarea:focus:not([readonly]) + label {
    color: #d31a1b; }
  input[type=text].valid, input[type=text]:focus.valid, input[type=password].valid, input[type=password]:focus.valid, input[type=email].valid, input[type=email]:focus.valid, input[type=url].valid, input[type=url]:focus.valid, input[type=time].valid, input[type=time]:focus.valid, input[type=date].valid, input[type=date]:focus.valid, input[type=datetime-local].valid, input[type=datetime-local]:focus.valid, input[type=tel].valid, input[type=tel]:focus.valid, input[type=number].valid, input[type=number]:focus.valid, input[type=search].valid, input[type=search]:focus.valid, textarea.materialize-textarea.valid, textarea.materialize-textarea:focus.valid {
    border-bottom: 1px solid #4CAF50;
    box-shadow: 0 1px 0 0 #4CAF50; }
  input[type=text].valid + label:after, input[type=text]:focus.valid + label:after, input[type=password].valid + label:after, input[type=password]:focus.valid + label:after, input[type=email].valid + label:after, input[type=email]:focus.valid + label:after, input[type=url].valid + label:after, input[type=url]:focus.valid + label:after, input[type=time].valid + label:after, input[type=time]:focus.valid + label:after, input[type=date].valid + label:after, input[type=date]:focus.valid + label:after, input[type=datetime-local].valid + label:after, input[type=datetime-local]:focus.valid + label:after, input[type=tel].valid + label:after, input[type=tel]:focus.valid + label:after, input[type=number].valid + label:after, input[type=number]:focus.valid + label:after, input[type=search].valid + label:after, input[type=search]:focus.valid + label:after, textarea.materialize-textarea.valid + label:after, textarea.materialize-textarea:focus.valid + label:after {
    content: attr(data-success);
    color: #4CAF50;
    opacity: 1; }
  input[type=text].invalid, input[type=text]:focus.invalid, input[type=password].invalid, input[type=password]:focus.invalid, input[type=email].invalid, input[type=email]:focus.invalid, input[type=url].invalid, input[type=url]:focus.invalid, input[type=time].invalid, input[type=time]:focus.invalid, input[type=date].invalid, input[type=date]:focus.invalid, input[type=datetime-local].invalid, input[type=datetime-local]:focus.invalid, input[type=tel].invalid, input[type=tel]:focus.invalid, input[type=number].invalid, input[type=number]:focus.invalid, input[type=search].invalid, input[type=search]:focus.invalid, textarea.materialize-textarea.invalid, textarea.materialize-textarea:focus.invalid {
    border-bottom: 1px solid #d31a1b;
    box-shadow: 0 1px 0 0 #d31a1b; }
  input[type=text].invalid + label:after, input[type=text]:focus.invalid + label:after, input[type=password].invalid + label:after, input[type=password]:focus.invalid + label:after, input[type=email].invalid + label:after, input[type=email]:focus.invalid + label:after, input[type=url].invalid + label:after, input[type=url]:focus.invalid + label:after, input[type=time].invalid + label:after, input[type=time]:focus.invalid + label:after, input[type=date].invalid + label:after, input[type=date]:focus.invalid + label:after, input[type=datetime-local].invalid + label:after, input[type=datetime-local]:focus.invalid + label:after, input[type=tel].invalid + label:after, input[type=tel]:focus.invalid + label:after, input[type=number].invalid + label:after, input[type=number]:focus.invalid + label:after, input[type=search].invalid + label:after, input[type=search]:focus.invalid + label:after, textarea.materialize-textarea.invalid + label:after, textarea.materialize-textarea:focus.invalid + label:after {
    content: attr(data-error);
    color: #d31a1b;
    opacity: 1; }
  input[type=text] + label:after, input[type=password] + label:after, input[type=email] + label:after, input[type=url] + label:after, input[type=time] + label:after, input[type=date] + label:after, input[type=datetime-local] + label:after, input[type=tel] + label:after, input[type=number] + label:after, input[type=search] + label:after, textarea.materialize-textarea + label:after {
    display: block;
    content: "";
    position: absolute;
    top: 65px;
    opacity: 0;
    transition: .2s opacity ease-out, .2s color ease-out; }
input[type="submit"] { -webkit-appearance: button; cursor: pointer; padding: 20px; margin-top: 2em; font-size: 14px; border: 1px solid #828282; color: #333; width: 100%; }

.input-field {
  position: relative;
  margin-top: 2em;
  margin-bottom: 2em; }
  .input-field label {
    color: #333;
    position: absolute;
    top: -1.5rem;
    left: 0rem;
    font-size: 14px;
    cursor: text;
    -webkit-transition: .2s ease-out;
    -moz-transition: .2s ease-out;
    -o-transition: .2s ease-out;
    -ms-transition: .2s ease-out;
    transition: .2s ease-out; }
  .input-field label.active {
    font-size: 0.8rem;
    -webkit-transform: translateY(-140%);
    -moz-transform: translateY(-140%);
    -ms-transform: translateY(-140%);
    -o-transform: translateY(-140%);
    transform: translateY(-140%); }
  .input-field .prefix {
    position: absolute;
    width: 3rem;
    font-size: 2rem;
    -webkit-transition: color .2s;
    -moz-transition: color .2s;
    -o-transition: color .2s;
    -ms-transition: color .2s;
    transition: color .2s; }
    .input-field .prefix.active {
      color: #26a69a; }
  .input-field .prefix ~ input, .input-field .prefix ~ textarea {
    margin-left: 3rem;
    width: 92%;
    width: calc(100% - 3rem); }
  .input-field .prefix ~ textarea {
    padding-top: .8rem; }
  .input-field .prefix ~ label {
    margin-left: 3rem; }
  @media only screen and (max-width : 992px) {
    .input-field .prefix ~ input {
      width: 86%;
      width: calc(100% - 3rem); } }
  @media only screen and (max-width : 600px) {
    .input-field .prefix ~ input {
      width: 80%;
      width: calc(100% - 3rem); } }

.input-field input[type=search] {
  display: block;
  line-height: inherit;
  padding-left: 4rem;
  width: calc(100% - 4rem); }
  .input-field input[type=search]:focus {
    background-color: #fff;
    border: 0;
    box-shadow: none;
    color: #444; }
    .input-field input[type=search]:focus + label i, .input-field input[type=search]:focus ~ .mdi-navigation-close, .input-field input[type=search]:focus ~ .material-icons {
      color: #444; }
  .input-field input[type=search] + label {
    left: 1rem; }
  .input-field input[type=search] ~ .mdi-navigation-close, .input-field input[type=search] ~ .material-icons {
    position: absolute;
    top: 0;
    right: 1rem;
    color: transparent;
    cursor: pointer;
    font-size: 2rem;
    transition: .3s color; }

  textarea {
    width: 100%;
    height: 3rem;
    background-color: transparent; }
    textarea.materialize-textarea {
      overflow-y: hidden;
      /* prevents scroll bar flash */
      padding: 1.6rem 0;
      /* prevents text jump on Enter keypress */
      resize: none;
      min-height: 3rem; margin-top: 3em; }

select { height: 4em; width: 100%; margin-top: 10px; border:1px solid #CCC;}
button, html [type="button"], [type="reset"], [type="submit"] { border:1px solid #CCC; padding: 1em; width: 100%; font-size: 1.4rem; }
